@ssa-ui-kit/core 2.30.0 → 2.32.0

package/dist/components/Chip/Chip.d.ts

@@ -0,0 +1,2 @@
+import { ChipProps } from './types';
+export declare const Chip: import("react").ForwardRefExoticComponent<ChipProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/Chip/constants.d.ts

@@ -0,0 +1,22 @@
+export declare const VARIANTS: {
+    readonly OUTLINED: "outlined";
+    readonly FILLED: "filled";
+};
+export declare const COLORS: {
+    readonly DEFAULT: "default";
+    readonly PRIMARY: "primary";
+    readonly SUCCESS: "success";
+    readonly ERROR: "error";
+    readonly INFO: "info";
+    readonly WARNING: "warning";
+};
+export declare const mapSizes: {
+    small: import("@emotion/react").SerializedStyles;
+    medium: import("@emotion/react").SerializedStyles;
+    large: import("@emotion/react").SerializedStyles;
+};
+export declare const ICON_SIZES: {
+    readonly small: 12;
+    readonly medium: 14;
+    readonly large: 16;
+};

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

@@ -0,0 +1,13 @@
+import { Theme } from '@emotion/react';
+import { ChipProps } from './types';
+type SemanticColor = Exclude<ChipProps['color'], 'default' | undefined>;
+type ColorConfig = {
+    main: string;
+    bg: string;
+};
+export declare const colorMap: (theme: Theme) => Record<SemanticColor, ColorConfig>;
+export declare const getVariantColors: (theme: Theme, variant: ChipProps["variant"], color: ChipProps["color"], disabled: boolean) => {
+    chipStyles: import("@emotion/react").SerializedStyles;
+    iconColor: string | undefined;
+};
+export {};

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

@@ -0,0 +1,2 @@
+export * from './Chip';
+export type { ChipProps, ChipVariant, ChipColor, ChipSize } from './types';

package/dist/components/Chip/styles.d.ts

@@ -0,0 +1,35 @@
+import { Theme } from '@emotion/react';
+import { CommonProps } from '../../types/emotion';
+export declare const ChipBase: import("@emotion/styled").StyledComponent<{
+    theme?: Theme;
+    as?: React.ElementType;
+} & CommonProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const small: import("@emotion/react").SerializedStyles;
+export declare const medium: import("@emotion/react").SerializedStyles;
+export declare const large: import("@emotion/react").SerializedStyles;
+export declare const filled: (theme: Theme) => import("@emotion/react").SerializedStyles;
+export declare const filledDisabled: (theme: Theme) => import("@emotion/react").SerializedStyles;
+export declare const outlined: (theme: Theme) => import("@emotion/react").SerializedStyles;
+export declare const outlinedDisabled: (theme: Theme) => import("@emotion/react").SerializedStyles;
+export declare const clickable: import("@emotion/react").SerializedStyles;
+export declare const clickableDisabled: import("@emotion/react").SerializedStyles;
+export declare const IconWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+export declare const AvatarWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+export declare const TitleWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+export declare const LabelWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+export declare const DeleteIconButton: import("@emotion/styled").StyledComponent<{
+    theme?: Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {}>;

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

@@ -0,0 +1,23 @@
+import { CommonProps } from '../../types/emotion';
+import { Interpolation, Theme } from '@emotion/react';
+import { ReactNode, MouseEventHandler } from 'react';
+import { IconProps } from '../Icon/types';
+export type ChipVariant = 'filled' | 'outlined';
+export type ChipColor = 'default' | 'primary' | 'success' | 'error' | 'info' | 'warning';
+export type ChipSize = 'small' | 'medium' | 'large';
+export interface ChipProps extends CommonProps {
+    label: ReactNode;
+    title?: ReactNode;
+    variant?: ChipVariant;
+    color?: ChipColor;
+    size?: ChipSize;
+    disabled?: boolean;
+    icon?: IconProps['name'];
+    avatar?: ReactNode;
+    onDelete?: MouseEventHandler<HTMLButtonElement>;
+    deleteIcon?: IconProps['name'];
+    showIcon?: boolean;
+    onClick?: MouseEventHandler<HTMLDivElement>;
+    clickable?: boolean;
+    css?: Interpolation<Theme>;
+}

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

@@ -2,7 +2,6 @@ export declare const DaysViewCell: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
 } & {
-    avatarSize?: number;
     direction?: string;
     alignItems?: string;
     fade?: boolean;

package/dist/components/DateRangePicker/components/DatesListWrapper.d.ts

@@ -2,7 +2,6 @@ export declare const DatesListWrapper: import("@emotion/styled").StyledComponent
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
 } & {
-    avatarSize?: number;
     direction?: string;
     alignItems?: string;
     fade?: boolean;

package/dist/components/DateRangePicker/styles.d.ts

@@ -2,7 +2,6 @@ export declare const DaysViewCell: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
 } & {
-    avatarSize?: number;
     direction?: string;
     alignItems?: string;
     fade?: boolean;
@@ -38,7 +37,6 @@ export declare const TriggerWrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
 } & {
-    avatarSize?: number;
     direction?: string;
     alignItems?: string;
     fade?: boolean;

package/dist/components/Filters/FilterBlockWrapper.d.ts

@@ -2,7 +2,6 @@ export declare const FilterBlockWrapper: import("@emotion/styled").StyledCompone
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
 } & {
-    avatarSize?: number;
     direction?: string;
     alignItems?: string;
     fade?: boolean;

package/dist/components/JsonSchemaForm/constants.d.ts

@@ -0,0 +1 @@
+export declare const DEFAULT_AVATAR_SIZE = 24;

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

@@ -11,3 +11,5 @@ declare const Form: import("@emotion/styled").StyledComponent<FormProps<unknown,
     theme?: import("@emotion/react").Theme;
 }, {}, {}>;
 export { Form, Templates, Theme, Widgets, Fields, generateTemplates, generateWidgets, generateFields, };
+export * from './constants';
+export type * from './types';

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

@@ -0,0 +1,6 @@
+export type SelectOptionSchemaExtension = {
+    avatar?: string;
+};
+export type SelectWidgetUiOptions = {
+    typeaheadAvatarSize?: number;
+};

package/dist/components/PersonInfo/PersonInfo.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { PersonInfoProps } from './types';
+export declare const PersonInfo: React.ForwardRefExoticComponent<PersonInfoProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/PersonInfo/PersonInfoAvatar.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { PersonInfoAvatarProps } from './types';
+export declare const PersonInfoAvatar: React.FC<PersonInfoAvatarProps>;

package/dist/components/PersonInfo/PersonInfoBadges.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { PersonInfoStyles } from './types';
+interface PersonInfoBadgesProps {
+    badges: React.ReactNode | (string | React.ReactNode)[];
+    styles?: PersonInfoStyles;
+}
+export declare const PersonInfoBadges: React.FC<PersonInfoBadgesProps>;
+export {};

package/dist/components/PersonInfo/PersonInfoCounter.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { PersonInfoCounterProps } from './types';
+export declare const PersonInfoCounter: React.FC<PersonInfoCounterProps>;

package/dist/components/PersonInfo/PersonInfoIcon.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import type { IconProps } from '../Icon/types';
+interface PersonInfoIconProps {
+    icon: IconProps['name'] | React.ReactNode;
+}
+export declare const PersonInfoIcon: React.FC<PersonInfoIconProps>;
+export {};

package/dist/components/PersonInfo/PersonInfoValue.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { PersonInfoValueProps } from './types';
+export declare const PersonInfoValue: React.FC<PersonInfoValueProps>;

package/dist/components/PersonInfo/constants.d.ts

@@ -0,0 +1,9 @@
+import type { Theme } from '@emotion/react';
+type BadgeColorName = keyof MainColors;
+export declare const DEFAULT_BADGE_COLORS: Array<keyof MainColors>;
+interface BadgeColorConfig {
+    text: string;
+    bg: string;
+}
+export declare const BADGE_COLORS: (theme: Theme) => Record<BadgeColorName, BadgeColorConfig>;
+export {};

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

@@ -0,0 +1,11 @@
+export declare const getLinkAttributes: (link?: string, openLinkInNewTab?: boolean) => {
+    as: "a";
+    href: string | undefined;
+    target: string | undefined;
+    rel: string | undefined;
+} | {
+    as?: undefined;
+    href?: undefined;
+    target?: undefined;
+    rel?: undefined;
+};

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

@@ -0,0 +1,2 @@
+export * from './PersonInfo';
+export * from './types';

package/dist/components/PersonInfo/styles.d.ts

@@ -0,0 +1,71 @@
+import { Interpolation, Theme } from '@emotion/react';
+import { CommonProps } from '../../types/emotion';
+export declare const PersonInfoBase: import("@emotion/styled").StyledComponent<{
+    theme?: Theme;
+    as?: React.ElementType;
+} & CommonProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const PersonInfoHeader: import("@emotion/styled").StyledComponent<{
+    theme?: Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const IconWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const TitleWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const Title: import("@emotion/styled").StyledComponent<{
+    theme?: Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const Row: import("@emotion/styled").StyledComponent<{
+    theme?: Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const TextBase: import("@emotion/styled").StyledComponent<{
+    theme?: Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const ValueWithCounter: import("@emotion/styled").StyledComponent<{
+    theme?: Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const Counter: import("@emotion/styled").StyledComponent<{
+    theme?: Theme;
+    as?: React.ElementType;
+} & import("react").ClassAttributes<HTMLSpanElement> & import("react").HTMLAttributes<HTMLSpanElement> & {
+    theme?: Theme;
+}, {}, {}>;
+export declare const CounterTooltipContent: import("@emotion/styled").StyledComponent<{
+    theme?: Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const CounterTooltipList: import("@emotion/styled").StyledComponent<{
+    theme?: Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const AttributesList: import("@emotion/styled").StyledComponent<{
+    theme?: Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const AvatarWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const BadgeWrapper: import("@emotion/styled").StyledComponent<{
+    theme?: Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const StyledBadge: import("@emotion/styled").StyledComponent<Omit<Omit<import("react").HTMLProps<HTMLDivElement>, "size"> & import("../Badge/types").BadgeProps, "ref"> & import("react").RefAttributes<HTMLDivElement> & {
+    theme?: Theme;
+}, {}, {}>;
+export declare const CustomBadge: import("@emotion/styled").StyledComponent<{
+    theme?: Theme;
+    as?: React.ElementType;
+} & {
+    colorName: keyof MainColors;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const personInfoValueLinkStyles: Interpolation<Theme>;
+export declare const avatarWrapperLinkStyles: Interpolation<Theme>;

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

@@ -0,0 +1,48 @@
+import { ReactNode } from 'react';
+import { Interpolation, Theme } from '@emotion/react';
+import { CommonProps } from '../../types/emotion';
+import { IconProps } from '../Icon/types';
+import { getLinkAttributes } from './helpers';
+type PersonInfoStyleKeys = 'title' | 'avatarName' | 'counter' | 'attributes' | 'badge' | 'badgeItem' | 'value' | 'description';
+export type PersonInfoStyles = Partial<Record<PersonInfoStyleKeys, Interpolation<Theme>>>;
+export interface PersonInfoCounterTooltipUser {
+    id: string | number;
+    name: string;
+    avatar: string;
+    link?: string;
+    openLinkInNewTab?: boolean;
+}
+export interface PersonInfoCounterTooltip {
+    users: PersonInfoCounterTooltipUser[];
+}
+export type PersonInfoLinkAttributes = ReturnType<typeof getLinkAttributes>;
+export interface PersonInfoValueProps {
+    value: string;
+    css?: Interpolation<Theme>;
+    linkAttributes?: PersonInfoLinkAttributes;
+}
+export interface PersonInfoProps extends CommonProps {
+    title: string;
+    icon?: IconProps['name'] | ReactNode;
+    value?: string;
+    badges?: ReactNode | (string | ReactNode)[];
+    avatar?: string;
+    counterTooltip?: PersonInfoCounterTooltip;
+    attributes?: (string | ReactNode)[];
+    description?: string;
+    styles?: PersonInfoStyles;
+    link?: string;
+    openLinkInNewTab?: boolean;
+}
+export interface PersonInfoAvatarProps {
+    avatar?: string;
+    value?: string;
+    styles?: PersonInfoStyles;
+    link?: string;
+    openLinkInNewTab?: boolean;
+}
+export interface PersonInfoCounterProps {
+    counterTooltip?: PersonInfoCounterTooltip;
+    css?: PersonInfoStyles['counter'];
+}
+export {};

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

@@ -12,6 +12,7 @@ export interface TooltipProps extends CommonProps {
     enableClick?: boolean;
     enableClientPoint?: boolean;
     offsetOptions?: OffsetOptions;
+    allowHoverContent?: boolean;
     size?: TooltipSize;
     hasArrow?: boolean;
     arrowProps?: TooltipArrowProps;

package/dist/components/Typeahead/components/TypeaheadOption.d.ts

@@ -1,2 +1,2 @@
 import { TypeaheadItemProps } from '../types';
-export declare const TypeaheadOption: ({ children, ...rest }: TypeaheadItemProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const TypeaheadOption: ({ children, avatar, ...rest }: TypeaheadItemProps) => import("@emotion/react/jsx-runtime").JSX.Element;

package/dist/components/Typeahead/styles.d.ts

@@ -18,6 +18,10 @@ export declare const TypeaheadItem: import("@emotion/styled").StyledComponent<{
 } & {
     isDisabled?: boolean;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const TypeaheadItemAvatar: import("@emotion/styled").StyledComponent<{
+    theme?: Theme;
+    as?: React.ElementType;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
 export declare const TypeaheadItemLabel: import("@emotion/styled").StyledComponent<{
     theme?: Theme;
     as?: React.ElementType;
@@ -31,7 +35,6 @@ export declare const TypeaheadInputsGroupWrapper: import("@emotion/styled").Styl
     theme?: Theme;
     as?: React.ElementType;
 } & {
-    avatarSize?: number;
     direction?: string;
     alignItems?: string;
     fade?: boolean;

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

@@ -48,5 +48,6 @@ export interface TypeaheadItemProps extends CommonProps {
     value?: string | number;
     label?: string | number;
     children?: React.ReactNode;
+    avatar?: React.ReactNode;
     onClick?: (e: React.MouseEvent<HTMLElement>) => void;
 }

package/dist/components/UserProfile/styles.d.ts

@@ -8,7 +8,6 @@ export declare const AdditionalInfoWrapper: import("@emotion/styled").StyledComp
     theme?: Theme;
     as?: React.ElementType;
 } & {
-    avatarSize?: number;
     direction?: string;
     alignItems?: string;
     fade?: boolean;
@@ -21,7 +20,6 @@ export declare const CustomContentWrapper: import("@emotion/styled").StyledCompo
     theme?: Theme;
     as?: React.ElementType;
 } & {
-    avatarSize?: number;
     direction?: string;
     alignItems?: string;
     fade?: boolean;

package/dist/components/Wrapper/Wrapper.d.ts

@@ -3,7 +3,6 @@ declare const Wrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
 } & {
-    avatarSize?: number;
     direction?: string;
     alignItems?: string;
     fade?: boolean;

package/dist/components/index.d.ts

@@ -68,11 +68,13 @@ export * from './AccordionGroup';
 export * from './AddNewAccountCard';
 export * from './ButtonGroup';
 export * from './CardList';
+export * from './Chip';
 export * from './Charts';
 export * from './Checkbox';
 export * from './CollapsibleNavBar';
 export * from './ColorPicker';
 export * from './DatePicker';
+export * from './PersonInfo';
 export * from './DateRangePicker';
 export * from './Drawer';
 export * from './Field';