jp.ui.app.ds 1.0.1 → 1.0.3

package/dist/index.d.ts

@@ -1,23 +1,747 @@
-import * as React from 'react';
+import * as React$1 from 'react';
+import { JSX as JSX$1 } from 'react';
+import * as _emotion_react from '@emotion/react';
+import { Theme } from '@emotion/react';
+import * as _emotion_styled from '@emotion/styled';
+import { AppSectionButton, AppScreenSectionListItem, AppScreenTypes } from 'jp.common.view';
+
+type RoomsItemRequisiteType = {
+    onClick?: (event: React$1.MouseEvent<HTMLElement>) => void;
+    title: string;
+    buttonTitle: string;
+    warning?: boolean;
+};
+declare const Alert: ({ onClick, title, warning, buttonTitle }: RoomsItemRequisiteType) => React$1.JSX.Element;
+
+type LabelValueItem = {
+    label: string;
+    value: string;
+};
+
+type PlayersProfileHeaderType = {
+    title: string;
+    avatarUrl?: string;
+    icon?: string;
+    reqList: Array<LabelValueItem>;
+    buttons?: JSX.Element;
+};
+declare const AppBarHeader: (props: PlayersProfileHeaderType) => React$1.JSX.Element;
+
+declare enum AvatarSizeType {
+    USER = 0,
+    USER_ON_TABLE = 1
+}
+
+type AvatarType = {
+    name: string;
+    imageUrl?: string;
+    frame?: string;
+    size?: AvatarSizeType;
+    role?: string;
+    ratingWinnerRank?: number;
+    isMobile?: boolean;
+};
+declare const Avatar: ({ name, imageUrl, frame, size, role, ratingWinnerRank, isMobile }: AvatarType) => React$1.JSX.Element;
+
+type BadgeType = {
+    role: string;
+    ratingWinnerRank: number;
+};
+declare const AvatarBadge: ({ role, ratingWinnerRank }: BadgeType) => React$1.JSX.Element;
+
+type AvatarImageType = {
+    name?: string;
+    imageUrl?: string;
+    icon?: string | null;
+    textColor?: string;
+    backgroundColor?: string;
+    size?: 'xs' | 'sm' | 'md' | 'lg';
+    customSize?: number;
+    avatarText?: string;
+    className?: string;
+};
+declare const AvatarImage: (props: AvatarImageType) => React$1.JSX.Element;
+
+type BannerProps = {
+    header: string;
+    title: string;
+    imageUrl: string;
+    onClick?: () => void;
+};
+declare const Banner: ({ imageUrl, title, onClick, header }: BannerProps) => React$1.JSX.Element;
+
+type DictionaryItem = {
+    key: string;
+    label: string;
+    value: string;
+};
+type BottomSelectionPanelType = {
+    title: string;
+    closeButtonTitle: string;
+    items: Array<DictionaryItem>;
+    onItemClick?: (item: DictionaryItem) => void;
+    onCloseButtonClick?: () => void;
+};
+declare const BottomSelectionPanel: (props: BottomSelectionPanelType) => React$1.JSX.Element;
+
+type componentProps$2 = {
+    children: React$1.ReactNode;
+    className?: string;
+};
+declare const Card: ({ children, className }: componentProps$2) => React$1.JSX.Element;
+
+type componentProps$1 = {
+    children: React$1.ReactNode;
+    onClick?: (event: React$1.MouseEvent<HTMLElement>) => void;
+    as?: React$1.ElementType | undefined;
+    className?: string;
+    hasNoPadding?: boolean;
+    title?: string;
+    active?: boolean;
+};
+declare const CardButton: ({ children, onClick, as, className, hasNoPadding, title, active }: componentProps$1) => React$1.JSX.Element;
+
+type ListCardItemProps = {
+    title?: string;
+    description?: string;
+    imageUrl?: string;
+    icon?: string | null;
+    onClick?: (event: React$1.MouseEvent<HTMLElement>) => void;
+    as?: React$1.ElementType | undefined;
+    avatarText?: string;
+    noRightArrow?: boolean;
+    className?: string;
+    active?: boolean;
+};
+declare const CardItem: (props: ListCardItemProps) => React$1.JSX.Element;
+
+type ButtonProps = {
+    title: string;
+    onClick: (event: React$1.MouseEvent<HTMLElement>) => void;
+    disabled?: boolean;
+};
+type componentProps = {
+    title: string;
+    description: string;
+    imageUrl?: string;
+    icon?: string | null;
+    productImageUrl: string;
+    productTitle?: string | null;
+    productSubtitle?: string | null;
+    productDescription?: string | null;
+    primaryButton?: ButtonProps | undefined;
+    secondaryButton?: ButtonProps | undefined;
+    className?: string;
+};
+declare const CardProduct: (props: componentProps) => React$1.JSX.Element;
+
+type GameCardType = {
+    id: number;
+    rank: number;
+    suit: string;
+    isDisable: boolean;
+};
+
+type CardsPlayerProps = {
+    playerId: string;
+    name: string;
+    avatarUrl: string;
+    avatarFrame?: string;
+    stack: string;
+    isActive: boolean;
+    cards: Array<GameCardType>;
+    role?: string;
+    selectedReaction?: string;
+    previewRatingWinnerRank?: number;
+    playerComment?: string;
+    itemClick?: (playerId: string) => void;
+    timer?: number;
+};
+declare const CardsPlayer: (props: CardsPlayerProps) => React$1.JSX.Element;
+
+type CardsPlayerYoursProps = CardsPlayerProps & {
+    yoursComment?: string;
+};
+declare const CardsPlayerYours: (props: CardsPlayerYoursProps) => React$1.JSX.Element;
+
+declare const CardsPlayerOnMobileTable: (props: CardsPlayerProps) => React$1.JSX.Element;
+
+declare const CardsPlayerOnMobileTableYours: (props: CardsPlayerYoursProps) => React$1.JSX.Element;
+
+declare enum GameCardSizeEnum {
+    USER = 0,
+    TABLE = 1
+}
+
+declare enum GameCardSuitEnum {
+    HEART = "heart",
+    SPADE = "spade",
+    CLUB = "club",
+    DIAMOND = "diamond"
+}
+
+declare enum GameCardRankEnum {
+    CARD_2 = 2,
+    CARD_3 = 3,
+    CARD_4 = 4,
+    CARD_5 = 5,
+    CARD_6 = 6,
+    CARD_7 = 7,
+    CARD_8 = 8,
+    CARD_9 = 9,
+    CARD_10 = 10,
+    CARD_JACK = 11,
+    CARD_QUEEN = 12,
+    CARD_KING = 13,
+    CARD_ACE = 14
+}
+
+declare enum GameCardSkinEnum {
+    DEFAULT = "card_skin__default",
+    WESTERN = "card_skin__western",
+    PINK_PANTHER = "card_skin__pink_panther",
+    DACHA = "card_skin__dacha",
+    VAMPIRE = "card_skin__vampire",
+    USSR = "card_skin__ussr",
+    POKERDOM = "card_skin__pokerdom",
+    PREMIUM = "card_skin__premium"
+}
+
+type componentTypeStyle = {
+    rank?: number;
+    suit?: string;
+    size: GameCardSizeEnum;
+    theme: Theme;
+    hasAnimation?: boolean;
+    isDisable?: boolean;
+};
+type SuitSet = {
+    club: string;
+    spade: string;
+    heart: string;
+    diamond: string;
+};
+declare abstract class GameCardBase extends React$1.PureComponent<componentTypeStyle> {
+    abstract getCover(): JSX$1.Element;
+    abstract getFace(): JSX$1.Element;
+    abstract getFaceBackgroundColor(): string;
+    abstract getFaceBorderColor(): string;
+    abstract getCoverBackgroundColor(): string;
+    abstract getCoverBorderColor(): string;
+    protected suitToIcon(iconSet: SuitSet): string;
+    protected suitToColor(colorSet: SuitSet): string;
+    protected isTableSize(): boolean;
+    protected isEmpty(): boolean;
+    protected isTen(): boolean;
+    protected isDisable(): boolean;
+    protected rankToLetter(): string;
+    protected getTheme(): Theme;
+    render(): JSX$1.Element;
+}
+
+declare class CardSkinWestern extends GameCardBase {
+    getFaceBackgroundColor(): string;
+    getFaceBorderColor(): string;
+    getCoverBackgroundColor(): string;
+    getCoverBorderColor(): string;
+    getCover(): JSX$1.Element;
+    getFace(): JSX$1.Element;
+}
+
+declare function createGameCard(skin: string): typeof CardSkinWestern;
+
+type LastActionPanelType = {
+    playerComment?: string;
+    selectedReaction?: string;
+    timer?: number;
+    className?: string;
+};
+declare const LastActionPanel: (props: LastActionPanelType) => React$1.JSX.Element;
+
+declare const Screen: _emotion_styled.StyledComponent<{
+    theme?: _emotion_react.Theme;
+    as?: React.ElementType;
+}, React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+
+type IconButtonType = {
+    title: string;
+    onClick?: (event: React$1.MouseEvent<HTMLElement>) => void;
+    icon: string;
+    color: string;
+    disabled?: boolean;
+    className?: string;
+    hasBadge?: boolean | undefined;
+    rounded?: boolean;
+    backgroundColor?: string;
+};
+declare const IconButton: ({ title, onClick, icon, color, disabled, className, backgroundColor, rounded }: IconButtonType) => React$1.JSX.Element;
+
+type PageScreenType = {
+    children: React$1.ReactNode;
+    title: string;
+    isLoading?: boolean;
+    isError?: boolean;
+    onLeftButtonClick?: (event: React$1.MouseEvent<HTMLElement>) => void;
+    rightFirstButton?: IconButtonType;
+    rightSecondButton?: IconButtonType;
+    rightThirdButton?: IconButtonType;
+    onClickError?: (event: React$1.MouseEvent<HTMLElement>) => void;
+    topAppBarBackgroundColor?: string;
+    leftButtonTitle: string;
+    errorTitle: string;
+    errorButtonTitle: string;
+};
+declare const PageScreen: (props: PageScreenType) => React$1.JSX.Element;
+
+declare const PopupScreen: _emotion_styled.StyledComponent<{
+    children: React.ReactNode;
+    zIndex: number;
+    className?: string;
+} & {
+    theme?: Theme;
+}, {}, {}>;
+
+type RuStoreBannerProps = {
+    isLight: boolean;
+};
+declare const RuStoreBanner: ({ isLight }: RuStoreBannerProps) => React$1.JSX.Element;
+
+declare const ScrollList: _emotion_styled.StyledComponent<{
+    theme?: _emotion_react.Theme;
+    as?: React.ElementType;
+}, React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+
+type SkeletonType = {
+    width?: number;
+    height: number;
+    variant: 'circle' | 'rect';
+    theme?: Theme;
+    isCard?: boolean;
+    fullWidth?: boolean;
+};
+declare const Skeleton: _emotion_styled.StyledComponent<{
+    theme?: Theme;
+    as?: React.ElementType;
+} & SkeletonType, React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+
+declare const WorkflowButtonsStyled: _emotion_styled.StyledComponent<{
+    theme?: _emotion_react.Theme;
+    as?: React.ElementType;
+}, React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+
+declare const Badge: _emotion_styled.StyledComponent<{
+    theme?: Theme;
+    as?: React.ElementType;
+}, React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+
+type DialogType$1 = {
+    closeButtonTitle: string;
+    onCloseClick?: (event: React$1.MouseEvent | TouchEvent | MouseEvent) => void;
+    children?: React$1.ReactNode;
+};
+declare const BottomSheet: (props: DialogType$1) => React$1.JSX.Element;
 
 type CommonTypeStyle = {
     text: string;
-    onClick?: (event: React.MouseEvent<HTMLElement>) => void;
+    onClick?: (event: React$1.MouseEvent<HTMLElement>) => void;
     className?: string;
     disabled?: boolean;
     textColor?: string;
 };
 
-declare const FilledButton: ({ text, onClick, className, disabled }: CommonTypeStyle) => React.JSX.Element;
+declare const FilledButton: ({ text, onClick, className, disabled }: CommonTypeStyle) => React$1.JSX.Element;
 
-declare const OutlinedButton: ({ text, onClick, className }: CommonTypeStyle) => React.JSX.Element;
+declare const OutlinedButton: ({ text, onClick, className }: CommonTypeStyle) => React$1.JSX.Element;
 
-declare const TextButton: ({ text, onClick, className, textColor }: CommonTypeStyle) => React.JSX.Element;
+declare const TextButton: ({ text, onClick, className, textColor }: CommonTypeStyle) => React$1.JSX.Element;
 
 type CheckboxProps = {
     checked: boolean;
     onChange?: (checked: boolean) => void;
 };
-declare const Checkbox: ({ checked, onChange }: CheckboxProps) => React.JSX.Element;
+declare const Checkbox: ({ checked, onChange }: CheckboxProps) => React$1.JSX.Element;
+
+type DialogType = {
+    title?: string | null;
+    description?: string | null;
+    okButtonText: string;
+    onOkClick: (event: React$1.MouseEvent<HTMLElement> | MouseEvent) => void;
+    cancelButtonText?: string | null;
+    onCancelClick?: (event: React$1.MouseEvent<HTMLElement> | MouseEvent) => void;
+    children?: React$1.ReactNode;
+};
+declare const Dialog: (props: DialogType) => React$1.JSX.Element;
+
+declare const Divider: _emotion_styled.StyledComponent<{
+    theme?: Theme;
+    as?: React.ElementType;
+}, React$1.DetailedHTMLProps<React$1.HTMLAttributes<HTMLHRElement>, HTMLHRElement>, {}>;
+
+type SettingsScreenEditDialogFormImageItemProps = {
+    value: string;
+    initialSelectedValue: string;
+    onChange: (value: string) => void;
+    imageUrl: string;
+    disabled: boolean;
+    title: string;
+};
+declare const ListItem: ({ initialSelectedValue, onChange, value, imageUrl, disabled, title, }: SettingsScreenEditDialogFormImageItemProps) => React$1.JSX.Element;
+
+declare const CircularProgress: () => React$1.JSX.Element;
+
+declare const ScreenProgress: () => React$1.JSX.Element;
+
+type RadioButtonGroupProps = {
+    label?: string;
+    items: Array<{
+        label: string;
+        value: string;
+        checked: boolean;
+    }>;
+    onChange: (selectedValue: string) => void;
+};
+declare const RadioButtonGroup: (props: RadioButtonGroupProps) => React$1.JSX.Element;
+
+type Snack = {
+    id: number;
+    description: string;
+    icon?: JSX$1.Element;
+    buttonClick?: () => void;
+    buttonText?: string;
+};
+type SnackbarType = {
+    items: Array<Snack>;
+    closeClick: (item: Snack) => void;
+    closeButtonTitle: string;
+};
+declare const Snackbar: (props: SnackbarType) => JSX$1.Element;
+
+type TabsProps = {
+    items: Array<{
+        title: string;
+        value: string;
+    }>;
+    onChange: (selectedValue: string) => void;
+    selectedValue: string;
+    className?: string;
+};
+declare const Tabs: (props: TabsProps) => React$1.JSX.Element;
+
+type RadioButtonProps = {
+    title: string;
+    value: string;
+    checked: boolean;
+    onChangeTab: (selectedValue: string) => void;
+};
+declare const Tab: (props: RadioButtonProps) => React$1.JSX.Element;
+
+type OutlinedTextFieldProps = {
+    label: string;
+    placeholder?: string;
+    value: string;
+    onChange: (newValue: string) => void;
+    autoFocus?: boolean;
+    backgroundColor?: string | undefined;
+    type?: string;
+    fullWidth?: boolean;
+    error?: string;
+};
+declare const OutlinedTextField: (props: OutlinedTextFieldProps) => React$1.JSX.Element;
+
+type OutlinedTextAreaProps = {
+    label: string;
+    placeholder?: string;
+    value: string;
+    onChange: (newValue: string) => void;
+    autoFocus?: boolean;
+    backgroundColor?: string | undefined;
+    fullWidth?: boolean;
+    error?: string;
+};
+declare const OutlinedTextarea: (props: OutlinedTextAreaProps) => React$1.JSX.Element;
+
+type componentType = {
+    title: string;
+    titleColor: string;
+    backgroundColor: string;
+    leftButton?: IconButtonType;
+    rightFirstButton?: IconButtonType;
+    rightSecondButton?: IconButtonType;
+    rightThirdButton?: IconButtonType;
+};
+declare const TopAppBar: ({ title, titleColor, backgroundColor, leftButton, rightFirstButton, rightSecondButton, rightThirdButton }: componentType) => React$1.JSX.Element;
+
+type TypographySize = 'sm' | 'md' | 'lg';
+
+type TypographyProps = {
+    color: string;
+    size: TypographySize;
+    children: React$1.ReactNode;
+    className?: string;
+};
+
+declare const Title: ({ size, color, children, className }: TypographyProps) => React$1.JSX.Element;
+
+declare const Body: ({ size, color, children, className }: TypographyProps) => React$1.JSX.Element;
+
+declare const Label: ({ size, color, children, className }: TypographyProps) => React$1.JSX.Element;
+
+declare const Display: ({ size, color, children, className }: TypographyProps) => React$1.JSX.Element;
+
+declare const Headline: ({ size, color, children, className }: TypographyProps) => React$1.JSX.Element;
+
+declare const border_radius = "12px";
+declare const content_min_width = "320px";
+declare const content_max_width = "960px";
+declare const toolbar_height_number = 64;
+declare const toolbar_height = "64px";
+
+declare const common_d_border_radius: typeof border_radius;
+declare const common_d_content_max_width: typeof content_max_width;
+declare const common_d_content_min_width: typeof content_min_width;
+declare const common_d_toolbar_height: typeof toolbar_height;
+declare const common_d_toolbar_height_number: typeof toolbar_height_number;
+declare namespace common_d {
+  export {
+    common_d_border_radius as border_radius,
+    common_d_content_max_width as content_max_width,
+    common_d_content_min_width as content_min_width,
+    common_d_toolbar_height as toolbar_height,
+    common_d_toolbar_height_number as toolbar_height_number,
+  };
+}
+
+declare const MAX_TABLE_WIDTH = 959.98;
+declare const MAX_MOBILE_WIDTH = 666.98;
+declare const sm = "(max-width: 666.98px)";
+declare const md = "(max-width: 959.98px)";
+
+declare const media_d_MAX_MOBILE_WIDTH: typeof MAX_MOBILE_WIDTH;
+declare const media_d_MAX_TABLE_WIDTH: typeof MAX_TABLE_WIDTH;
+declare const media_d_md: typeof md;
+declare const media_d_sm: typeof sm;
+declare namespace media_d {
+  export {
+    media_d_MAX_MOBILE_WIDTH as MAX_MOBILE_WIDTH,
+    media_d_MAX_TABLE_WIDTH as MAX_TABLE_WIDTH,
+    media_d_md as md,
+    media_d_sm as sm,
+  };
+}
+
+declare const default_face_background_color_light = "#F1EAFA";
+declare const default_face_background_color_dark = "#CCC2DC";
+declare const default_face_border_color_light = "#1C1B1F";
+declare const default_face_border_color_dark = "#CCC2DC";
+declare const default_suit_club_dark = "rgb(16, 97, 12)";
+declare const default_suit_club_light = "#045800";
+declare const default_suit_spade_dark = "rgb(25, 34, 38)";
+declare const default_suit_spade_light = "rgb(25, 34, 38)";
+declare const default_suit_heart_dark = "rgb(170, 6, 4)";
+declare const default_suit_heart_light = "#960402";
+declare const default_suit_diamond_dark = "rgb(7, 86, 143)";
+declare const default_suit_diamond_light = "#00477A";
+declare const western_yellow = "#EBA85A";
+declare const western_background = "#262626";
+declare const premium_background = "#281F2F";
+declare const premium_yellow = "#C7A52E";
+declare const pink_panther_pink = "#F5578D";
+declare const pink_panther_background = "#3E3E3E";
+declare const dacha_green = "#00695C";
+declare const dacha_white = "#FAF8E2";
+declare const dacha_red = "#D0392E";
+declare const dacha_black = "#2E2D28";
+declare const vampire_black = "#202020";
+declare const vampire_white = "#FFFFFF";
+declare const vampire_red = "#D82B2B";
+declare const ussr_red = "#D02020";
+declare const ussr_yellow = "#D8BE32";
+declare const ussr_black = "#1B1B1B";
+declare const semaphore_blue = "#1C56C7";
+declare const semaphore_black = "#151515";
+declare const semaphore_green = "#107D2F";
+declare const semaphore_red = "#D32B2B";
+declare const semaphore_white = "#FFFFFF";
+declare const avatar_frame_inst1 = "#515BD4";
+declare const avatar_frame_inst2 = "#8134AF";
+declare const avatar_frame_inst3 = "#DD2A7B";
+declare const avatar_frame_inst4 = "#F58529";
+declare const avatar_frame_inst5 = "#FEDA77";
+declare const avatar_frame_yellow = "#FFD700";
+declare const avatar_frame_red = "#9F0000";
+declare const avatar_frame_blue1 = "#2CBBB2";
+declare const avatar_frame_blue2 = "#80CDEE";
+declare const avatar_frame_bali1 = "#F6EB84";
+declare const avatar_frame_bali2 = "#37CCD6";
+declare const avatar_frame_fire1 = "#FFCC34";
+declare const avatar_frame_fire2 = "#FF645A";
+declare const avatar_frame_sunset1 = "#FF7796";
+declare const avatar_frame_sunset2 = "#394E62";
+declare const avatar_frame_purple = "#990779";
+
+declare const palette_d_avatar_frame_bali1: typeof avatar_frame_bali1;
+declare const palette_d_avatar_frame_bali2: typeof avatar_frame_bali2;
+declare const palette_d_avatar_frame_blue1: typeof avatar_frame_blue1;
+declare const palette_d_avatar_frame_blue2: typeof avatar_frame_blue2;
+declare const palette_d_avatar_frame_fire1: typeof avatar_frame_fire1;
+declare const palette_d_avatar_frame_fire2: typeof avatar_frame_fire2;
+declare const palette_d_avatar_frame_inst1: typeof avatar_frame_inst1;
+declare const palette_d_avatar_frame_inst2: typeof avatar_frame_inst2;
+declare const palette_d_avatar_frame_inst3: typeof avatar_frame_inst3;
+declare const palette_d_avatar_frame_inst4: typeof avatar_frame_inst4;
+declare const palette_d_avatar_frame_inst5: typeof avatar_frame_inst5;
+declare const palette_d_avatar_frame_purple: typeof avatar_frame_purple;
+declare const palette_d_avatar_frame_red: typeof avatar_frame_red;
+declare const palette_d_avatar_frame_sunset1: typeof avatar_frame_sunset1;
+declare const palette_d_avatar_frame_sunset2: typeof avatar_frame_sunset2;
+declare const palette_d_avatar_frame_yellow: typeof avatar_frame_yellow;
+declare const palette_d_dacha_black: typeof dacha_black;
+declare const palette_d_dacha_green: typeof dacha_green;
+declare const palette_d_dacha_red: typeof dacha_red;
+declare const palette_d_dacha_white: typeof dacha_white;
+declare const palette_d_default_face_background_color_dark: typeof default_face_background_color_dark;
+declare const palette_d_default_face_background_color_light: typeof default_face_background_color_light;
+declare const palette_d_default_face_border_color_dark: typeof default_face_border_color_dark;
+declare const palette_d_default_face_border_color_light: typeof default_face_border_color_light;
+declare const palette_d_default_suit_club_dark: typeof default_suit_club_dark;
+declare const palette_d_default_suit_club_light: typeof default_suit_club_light;
+declare const palette_d_default_suit_diamond_dark: typeof default_suit_diamond_dark;
+declare const palette_d_default_suit_diamond_light: typeof default_suit_diamond_light;
+declare const palette_d_default_suit_heart_dark: typeof default_suit_heart_dark;
+declare const palette_d_default_suit_heart_light: typeof default_suit_heart_light;
+declare const palette_d_default_suit_spade_dark: typeof default_suit_spade_dark;
+declare const palette_d_default_suit_spade_light: typeof default_suit_spade_light;
+declare const palette_d_pink_panther_background: typeof pink_panther_background;
+declare const palette_d_pink_panther_pink: typeof pink_panther_pink;
+declare const palette_d_premium_background: typeof premium_background;
+declare const palette_d_premium_yellow: typeof premium_yellow;
+declare const palette_d_semaphore_black: typeof semaphore_black;
+declare const palette_d_semaphore_blue: typeof semaphore_blue;
+declare const palette_d_semaphore_green: typeof semaphore_green;
+declare const palette_d_semaphore_red: typeof semaphore_red;
+declare const palette_d_semaphore_white: typeof semaphore_white;
+declare const palette_d_ussr_black: typeof ussr_black;
+declare const palette_d_ussr_red: typeof ussr_red;
+declare const palette_d_ussr_yellow: typeof ussr_yellow;
+declare const palette_d_vampire_black: typeof vampire_black;
+declare const palette_d_vampire_red: typeof vampire_red;
+declare const palette_d_vampire_white: typeof vampire_white;
+declare const palette_d_western_background: typeof western_background;
+declare const palette_d_western_yellow: typeof western_yellow;
+declare namespace palette_d {
+  export {
+    palette_d_avatar_frame_bali1 as avatar_frame_bali1,
+    palette_d_avatar_frame_bali2 as avatar_frame_bali2,
+    palette_d_avatar_frame_blue1 as avatar_frame_blue1,
+    palette_d_avatar_frame_blue2 as avatar_frame_blue2,
+    palette_d_avatar_frame_fire1 as avatar_frame_fire1,
+    palette_d_avatar_frame_fire2 as avatar_frame_fire2,
+    palette_d_avatar_frame_inst1 as avatar_frame_inst1,
+    palette_d_avatar_frame_inst2 as avatar_frame_inst2,
+    palette_d_avatar_frame_inst3 as avatar_frame_inst3,
+    palette_d_avatar_frame_inst4 as avatar_frame_inst4,
+    palette_d_avatar_frame_inst5 as avatar_frame_inst5,
+    palette_d_avatar_frame_purple as avatar_frame_purple,
+    palette_d_avatar_frame_red as avatar_frame_red,
+    palette_d_avatar_frame_sunset1 as avatar_frame_sunset1,
+    palette_d_avatar_frame_sunset2 as avatar_frame_sunset2,
+    palette_d_avatar_frame_yellow as avatar_frame_yellow,
+    palette_d_dacha_black as dacha_black,
+    palette_d_dacha_green as dacha_green,
+    palette_d_dacha_red as dacha_red,
+    palette_d_dacha_white as dacha_white,
+    palette_d_default_face_background_color_dark as default_face_background_color_dark,
+    palette_d_default_face_background_color_light as default_face_background_color_light,
+    palette_d_default_face_border_color_dark as default_face_border_color_dark,
+    palette_d_default_face_border_color_light as default_face_border_color_light,
+    palette_d_default_suit_club_dark as default_suit_club_dark,
+    palette_d_default_suit_club_light as default_suit_club_light,
+    palette_d_default_suit_diamond_dark as default_suit_diamond_dark,
+    palette_d_default_suit_diamond_light as default_suit_diamond_light,
+    palette_d_default_suit_heart_dark as default_suit_heart_dark,
+    palette_d_default_suit_heart_light as default_suit_heart_light,
+    palette_d_default_suit_spade_dark as default_suit_spade_dark,
+    palette_d_default_suit_spade_light as default_suit_spade_light,
+    palette_d_pink_panther_background as pink_panther_background,
+    palette_d_pink_panther_pink as pink_panther_pink,
+    palette_d_premium_background as premium_background,
+    palette_d_premium_yellow as premium_yellow,
+    palette_d_semaphore_black as semaphore_black,
+    palette_d_semaphore_blue as semaphore_blue,
+    palette_d_semaphore_green as semaphore_green,
+    palette_d_semaphore_red as semaphore_red,
+    palette_d_semaphore_white as semaphore_white,
+    palette_d_ussr_black as ussr_black,
+    palette_d_ussr_red as ussr_red,
+    palette_d_ussr_yellow as ussr_yellow,
+    palette_d_vampire_black as vampire_black,
+    palette_d_vampire_red as vampire_red,
+    palette_d_vampire_white as vampire_white,
+    palette_d_western_background as western_background,
+    palette_d_western_yellow as western_yellow,
+  };
+}
+
+declare const avatar_badge = 1;
+declare const avatar_cards = 2;
+declare const toolbar = 10;
+declare const bottom_panel = 100;
+declare const bottom_sheet = 200;
+declare const bottom_selection_panel = 200;
+declare const page = 700;
+declare const page_friends_chat = 701;
+declare const dialog = 1000;
+declare const snackbar = 1400;
+
+declare const zIndex_d_avatar_badge: typeof avatar_badge;
+declare const zIndex_d_avatar_cards: typeof avatar_cards;
+declare const zIndex_d_bottom_panel: typeof bottom_panel;
+declare const zIndex_d_bottom_selection_panel: typeof bottom_selection_panel;
+declare const zIndex_d_bottom_sheet: typeof bottom_sheet;
+declare const zIndex_d_dialog: typeof dialog;
+declare const zIndex_d_page: typeof page;
+declare const zIndex_d_page_friends_chat: typeof page_friends_chat;
+declare const zIndex_d_snackbar: typeof snackbar;
+declare const zIndex_d_toolbar: typeof toolbar;
+declare namespace zIndex_d {
+  export {
+    zIndex_d_avatar_badge as avatar_badge,
+    zIndex_d_avatar_cards as avatar_cards,
+    zIndex_d_bottom_panel as bottom_panel,
+    zIndex_d_bottom_selection_panel as bottom_selection_panel,
+    zIndex_d_bottom_sheet as bottom_sheet,
+    zIndex_d_dialog as dialog,
+    zIndex_d_page as page,
+    zIndex_d_page_friends_chat as page_friends_chat,
+    zIndex_d_snackbar as snackbar,
+    zIndex_d_toolbar as toolbar,
+  };
+}
+
+type ListSectionClick = (item: AppScreenSectionListItem) => void;
+type ListSectionButtonClick = (item: AppScreenSectionListItem, button?: AppSectionButton) => void;
+type HeaderSectionButtonClick = (button?: AppSectionButton) => void;
+type UniversalScreenSectionHandlers = {
+    appBarCloseButtonClick?: HeaderSectionButtonClick;
+    appBarActionButtonClick?: HeaderSectionButtonClick;
+    tabsSectionClick?: ListSectionClick;
+    listSectionClick?: ListSectionClick;
+    listSectionPrimaryButtonClick?: ListSectionButtonClick;
+    listSectionSecondaryButtonClick?: ListSectionButtonClick;
+    headerPrimaryButtonClick?: HeaderSectionButtonClick;
+    headerSecondaryButtonClick?: HeaderSectionButtonClick;
+    formButtonsSectionPrimaryClick?: HeaderSectionButtonClick;
+    formButtonsSectionSecondaryClick?: HeaderSectionButtonClick;
+};
+
+type UniversalScreenProps = {
+    screen?: AppScreenTypes;
+    isLoading: boolean;
+    isError: boolean;
+    init?: (id?: string) => void;
+    deactivate?: () => void;
+    sectionHandlers?: UniversalScreenSectionHandlers;
+};
+declare const UniversalScreen: (props: UniversalScreenProps) => React$1.JSX.Element;
 
-export { Checkbox, FilledButton, OutlinedButton, TextButton };
+export { Alert, AppBarHeader, Avatar, AvatarBadge, AvatarImage, Badge, Banner, Body, BottomSelectionPanel, BottomSheet, Card, CardButton, CardItem, CardProduct, CardsPlayer, CardsPlayerOnMobileTable, CardsPlayerOnMobileTableYours, CardsPlayerYours, Checkbox, CircularProgress, Dialog, Display, Divider, FilledButton, GameCardRankEnum, GameCardSizeEnum, GameCardSkinEnum, GameCardSuitEnum, Headline, IconButton, Label, LastActionPanel, ListItem, OutlinedButton, OutlinedTextField, OutlinedTextarea, PageScreen, PopupScreen, RadioButtonGroup, RuStoreBanner, Screen, ScreenProgress, ScrollList, Skeleton, Snackbar, Tab, Tabs, TextButton, Title, TopAppBar, UniversalScreen, WorkflowButtonsStyled, common_d as common, createGameCard, media_d as media, palette_d as palette, zIndex_d as zIndex };