@foxford/ui 2.5.1 → 2.6.0-beta-3b38ea8-20230704

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.
package/dts/index.d.ts CHANGED
@@ -1,14 +1,14 @@
1
1
  /// <reference types="react" />
2
2
  import * as styled_components from 'styled-components';
3
3
  import { DefaultTheme, FlattenSimpleInterpolation, CSSObject, SimpleInterpolation, css } from 'styled-components';
4
- import * as react from 'react';
5
- import { PureComponent, Component, ForwardRefExoticComponent, PropsWithoutRef, RefAttributes } from 'react';
6
4
  import { Link, NavLink } from 'react-router-dom';
7
- import { ResponsiveProperty as ResponsiveProperty$1, ResponsiveNamedProperty as ResponsiveNamedProperty$1 } from 'mixins/responsive-property';
8
- import { BaseProps as BaseProps$1, Nullable as Nullable$1, FontWeight as FontWeight$1 } from 'shared/interfaces';
9
5
  import { Display as Display$1 } from 'mixins/display';
6
+ import { ResponsiveNamedProperty as ResponsiveNamedProperty$1, ResponsiveProperty as ResponsiveProperty$1 } from 'mixins/responsive-property';
10
7
  import { Color as Color$1 } from 'mixins/color';
11
8
  import { Anchor as Anchor$1 } from 'components/Anchor';
9
+ import { BaseProps as BaseProps$1, Nullable as Nullable$1, FontWeight as FontWeight$1 } from 'shared/interfaces';
10
+ import * as react from 'react';
11
+ import { Component, PureComponent, ForwardRefExoticComponent, PropsWithoutRef, RefAttributes } from 'react';
12
12
  import { Classes } from 'react-modal';
13
13
  import * as rc_scrollbars_lib_Scrollbars_types from 'rc-scrollbars/lib/Scrollbars/types';
14
14
  import * as rc_scrollbars from 'rc-scrollbars';
@@ -206,7 +206,8 @@ declare enum ColorNames {
206
206
  grey = "grey",
207
207
  darkgrey = "darkgrey",
208
208
  lightgrey = "lightgrey",
209
- superlightgrey = "superlightgrey"
209
+ superlightgrey = "superlightgrey",
210
+ transparent = "rgba(0,0,0,0)"
210
211
  }
211
212
 
212
213
  declare type ColorPropsProperties = 'color' | 'fontColor' | `${string}Color` | `color${string}`;
@@ -574,181 +575,6 @@ declare namespace ActionBtn {
574
575
  var displayName: string;
575
576
  }
576
577
 
577
- declare enum CurrencyCodes {
578
- ALL = "ALL",
579
- AFN = "AFN",
580
- ARS = "ARS",
581
- AWG = "AWG",
582
- AUD = "AUD",
583
- AZN = "AZN",
584
- BSD = "BSD",
585
- BBD = "BBD",
586
- BYR = "BYR",
587
- BZD = "BZD",
588
- BMD = "BMD",
589
- BOB = "BOB",
590
- BAM = "BAM",
591
- BWP = "BWP",
592
- BGN = "BGN",
593
- BRL = "BRL",
594
- BND = "BND",
595
- KHR = "KHR",
596
- CAD = "CAD",
597
- KYD = "KYD",
598
- CLP = "CLP",
599
- CNY = "CNY",
600
- COP = "COP",
601
- CRC = "CRC",
602
- HRK = "HRK",
603
- CUP = "CUP",
604
- CZK = "CZK",
605
- DKK = "DKK",
606
- DOP = "DOP",
607
- XCD = "XCD",
608
- EGP = "EGP",
609
- SVC = "SVC",
610
- EEK = "EEK",
611
- EUR = "EUR",
612
- FKP = "FKP",
613
- FJD = "FJD",
614
- FRF = "FRF",
615
- GHC = "GHC",
616
- GIP = "GIP",
617
- GTQ = "GTQ",
618
- GGP = "GGP",
619
- GYD = "GYD",
620
- HNL = "HNL",
621
- HKD = "HKD",
622
- HUF = "HUF",
623
- ISK = "ISK",
624
- INR = "INR",
625
- IDR = "IDR",
626
- IRR = "IRR",
627
- IMP = "IMP",
628
- ILS = "ILS",
629
- JMD = "JMD",
630
- JPY = "JPY",
631
- JEP = "JEP",
632
- KZT = "KZT",
633
- KGS = "KGS",
634
- LAK = "LAK",
635
- LVL = "LVL",
636
- LBP = "LBP",
637
- LRD = "LRD",
638
- LTL = "LTL",
639
- MKD = "MKD",
640
- MYR = "MYR",
641
- MUR = "MUR",
642
- MXN = "MXN",
643
- MNT = "MNT",
644
- MZN = "MZN",
645
- NAD = "NAD",
646
- NPR = "NPR",
647
- ANG = "ANG",
648
- NZD = "NZD",
649
- NIO = "NIO",
650
- NGN = "NGN",
651
- KPW = "KPW",
652
- NOK = "NOK",
653
- OMR = "OMR",
654
- PKR = "PKR",
655
- PAB = "PAB",
656
- PYG = "PYG",
657
- PEN = "PEN",
658
- PHP = "PHP",
659
- PLN = "PLN",
660
- QAR = "QAR",
661
- RON = "RON",
662
- RUR = "RUR",
663
- RUB = "RUB",
664
- SHP = "SHP",
665
- SAR = "SAR",
666
- RSD = "RSD",
667
- SCR = "SCR",
668
- SGD = "SGD",
669
- SBD = "SBD",
670
- SOS = "SOS",
671
- ZAR = "ZAR",
672
- KRW = "KRW",
673
- LKR = "LKR",
674
- SEK = "SEK",
675
- CHF = "CHF",
676
- SRD = "SRD",
677
- SYP = "SYP",
678
- TWD = "TWD",
679
- THB = "THB",
680
- TTD = "TTD",
681
- TRY = "TRY",
682
- TRL = "TRL",
683
- TVD = "TVD",
684
- UAH = "UAH",
685
- GBP = "GBP",
686
- USD = "USD",
687
- UYU = "UYU",
688
- UZS = "UZS",
689
- VEF = "VEF",
690
- VND = "VND",
691
- YER = "YER",
692
- ZWD = "ZWD"
693
- }
694
- declare const CURRENCY_MAP: Readonly<Record<CurrencyCodes, string>>;
695
-
696
- interface AmountProps extends BaseProps, Color, ResponsiveNamedProperty<'size'>, Display {
697
- /**
698
- * Value for amount
699
- */
700
- value?: number;
701
- /**
702
- * Digits after point
703
- */
704
- digitsAfterPoint?: number;
705
- /**
706
- * Show zero minor part
707
- */
708
- showZeroMinorPart?: boolean;
709
- /**
710
- * Separator of major and minor part of amount
711
- */
712
- separator?: string;
713
- /**
714
- * International code of currency.
715
- */
716
- currency?: keyof typeof CurrencyCodes | string;
717
- /**
718
- * Use Header component for display amount
719
- */
720
- isHeader?: boolean;
721
- /**
722
- * Amount is not valid and will be crossed out with ```text-decoration: line-through```
723
- */
724
- crossedOut?: boolean;
725
- /**
726
- * If need only currency symbol
727
- */
728
- onlyCurrency?: boolean;
729
- }
730
- /**
731
- * Расширен:
732
- * - [`BaseProps`](#/Миксины)
733
- * - [`Color`](#/Миксины)
734
- * - [`ResponsiveNamedProperty<'size'>`](#/Миксины)
735
- */
736
- declare class Amount extends PureComponent<AmountProps> {
737
- static displayName: string;
738
- static defaultProps: {
739
- isHeader: boolean;
740
- showZeroMinorPart: boolean;
741
- crossedOut: boolean;
742
- digitsAfterPoint: number;
743
- separator: string;
744
- onlyCurrency: boolean;
745
- };
746
- static getCurrencySymbol(currencyCode: keyof typeof CurrencyCodes | string): any;
747
- renderMinorPart(minorPart: string): JSX.Element | null;
748
- renderCurrencySymbol: (currencySymbol: string) => JSX.Element;
749
- render(): JSX.Element;
750
- }
751
-
752
578
  interface AnchorProps extends BaseProps, Color, ResponsiveNamedProperty<'size'>, Display {
753
579
  /**
754
580
  * Custom CSS class name
@@ -811,74 +637,82 @@ declare namespace Anchor {
811
637
  };
812
638
  }
813
639
 
814
- declare type ArrowStaticSize = 'l' | 'm' | 'xs';
815
- declare type ArrowSize = ArrowStaticSize | ResponsiveProperty$1<`${number}rem` | number>;
816
- interface ArrowProps extends BaseProps$1 {
817
- /** Square shape */
818
- square?: boolean;
819
- /** Used on colored background */
820
- onColored?: boolean;
821
- /** Size of button */
822
- size?: ArrowSize;
823
- /** Arrow points top */
824
- top?: boolean;
825
- /** Arrow points right */
826
- right?: boolean;
827
- /** Arrow points bottom */
828
- bottom?: boolean;
829
- /** Arrow points left */
830
- left?: boolean;
831
- /** Inverted colors */
832
- inverse?: boolean;
833
- /** Outlined appearance */
834
- outline?: boolean;
640
+ declare type ButtonStaticSize = 'xl' | 'l' | 'm' | 's' | 'xs';
641
+ declare type ButtonSize = ButtonStaticSize | ResponsiveProperty$1<`${number}rem` | number>;
642
+ interface ButtonProps extends BaseProps$1, Display$1, Color$1, Color$1<'fontColor'>, ResponsiveNamedProperty$1<'padding'>, ResponsiveNamedProperty$1<'paddingTop'>, ResponsiveNamedProperty$1<'paddingRight'>, ResponsiveNamedProperty$1<'paddingBottom'>, ResponsiveNamedProperty$1<'paddingLeft'>, ResponsiveNamedProperty$1<'margin'>, ResponsiveNamedProperty$1<'marginTop'>, ResponsiveNamedProperty$1<'marginRight'>, ResponsiveNamedProperty$1<'marginBottom'>, ResponsiveNamedProperty$1<'marginLeft'>, ResponsiveNamedProperty$1<'fontSize'>, ResponsiveNamedProperty$1<'fluid', boolean>, ResponsiveNamedProperty$1<'width', 'auto' | 'l' | 'm' | 's' | 'xs' | number>, ResponsiveNamedProperty$1<'height', 'l' | 'm' | 's' | 'xs' | number> {
643
+ /** Root node polymorphic type */
644
+ as?: 'div' | 'span' | 'a' | 'button' | typeof Link | typeof Anchor$1;
645
+ /** Button size */
646
+ size?: ButtonSize;
647
+ /** Button type attribute */
648
+ type?: 'button' | 'submit' | 'reset';
649
+ /** Button icons */
650
+ icon?: JSX.Element | [Nullable$1<JSX.Element>, Nullable$1<JSX.Element>];
651
+ /** Button success state */
652
+ success?: boolean;
653
+ /** Loading state */
654
+ loading?: boolean;
835
655
  /** Button disabled */
836
656
  disabled?: boolean;
837
- /** Click handler */
838
- onClick?(event: React.MouseEvent<HTMLButtonElement>): void;
839
- }
840
-
841
- /**
842
- * Button with arrow icon
843
- */
844
- declare const Arrow: react.ForwardRefExoticComponent<ArrowProps & react.RefAttributes<HTMLButtonElement>>;
845
-
846
- interface AvatarProps extends BaseProps, Color {
657
+ /** Rounded border radius */
658
+ rounded?: boolean;
659
+ /** Rounded shape button */
660
+ round?: boolean;
661
+ /** Anchor target attribute */
662
+ target?: string;
663
+ /** Anchor rel attribute */
664
+ rel?: string;
665
+ /** Auto-generate rel. You must specify domain inside theme */
666
+ autoRel?: boolean;
667
+ /** Anchor href attribute */
668
+ href?: string;
669
+ /** React router Link to prop */
670
+ to?: string;
847
671
  /**
848
- * Children react node
672
+ * Indicates if there should not be any margin
673
+ * between this button and the previous one
849
674
  */
850
- children?: React.ReactNode;
851
- /** Title for avatar. Example user name. */
852
- title?: string;
853
- /** Image source */
854
- src?: string;
855
- /** Size of avatar */
856
- size?: 'l' | 'm' | 'sm' | 's' | 'xs' | number;
857
- /** Shadow of avatar */
858
- shadow?: boolean;
859
- /** Make ref func */
860
- ref?: React.LegacyRef<HTMLDivElement>;
861
- /**
862
- * Generate color by title automatically
863
- *
864
- * `Performance Info`: Each render of component call getAvatarColor function on received title
865
- */
866
- autoColor?: boolean;
675
+ noSpacing?: boolean;
676
+ /** Outline appearance */
677
+ outline?: boolean;
678
+ /** Content font weight */
679
+ fontWeight?: FontWeight$1;
680
+ /** Associated form */
681
+ form?: string;
682
+ /** @preset {Default} Primary appearance */
683
+ primary?: boolean;
684
+ /** @preset {Default} Secondary appearance */
685
+ secondary?: boolean;
686
+ /** @preset {Default} Inverted colors */
687
+ inverted?: boolean;
688
+ /** @preset {Brand} Base appearance */
689
+ base?: boolean;
690
+ /** @preset {Brand} Clear appearance */
691
+ clear?: boolean;
692
+ /** @preset {Brand} Black colors appearance */
693
+ black?: boolean;
694
+ /** @preset {Brand} Red colors appearance */
695
+ danger?: boolean;
696
+ /** @preset {Brand} Modifies appearance on colored background */
697
+ onColored?: boolean;
698
+ /** @deprecated Use outline */
699
+ basic?: boolean;
700
+ /** @deprecated Use children */
701
+ content?: React.ReactNode;
702
+ /** @deprecated Use ref */
703
+ innerRef?: React.LegacyRef<HTMLElement>;
704
+ /** Component's children */
705
+ children?: React.ReactNode | React.ReactNode[];
706
+ onClick?: (evt: React.SyntheticEvent<HTMLElement>) => void;
707
+ onClickCapture?: (evt: React.SyntheticEvent<HTMLElement>) => void;
708
+ onMouseEnter?: (evt: React.SyntheticEvent<HTMLElement>) => void;
709
+ onMouseLeave?: (evt: React.SyntheticEvent<HTMLElement>) => void;
867
710
  }
711
+
868
712
  /**
869
- * Расширен:
870
- * - [`BaseProps`](#/Миксины)
871
- * - [`Color`](#/Миксины)
713
+ * Main button
872
714
  */
873
- declare class Avatar extends PureComponent<AvatarProps> {
874
- static defaultProps: {
875
- size: string;
876
- autoColor: boolean;
877
- };
878
- static displayName: string;
879
- getAvatarText(): string;
880
- render(): JSX.Element;
881
- }
715
+ declare const Button: react.ForwardRefExoticComponent<ButtonProps & react.RefAttributes<HTMLElement>>;
882
716
 
883
717
  declare enum H {
884
718
  h1 = 0,
@@ -990,103 +824,315 @@ declare namespace Text {
990
824
  var displayName: string;
991
825
  }
992
826
 
993
- interface BadgeProps extends BaseProps, Color, Display {
827
+ declare type AlertType = 'warning' | 'error' | 'info' | 'success';
828
+ interface AlertProps extends BaseProps {
994
829
  /**
995
830
  * Children react node
996
831
  */
997
832
  children?: React.ReactNode;
833
+ clear?: boolean;
834
+ closeToast?(): void;
998
835
  content?: string | React.ReactNode;
836
+ /** Icon name (for inner Icon component) */
837
+ customIcon?: keyof typeof IconNames;
838
+ image?: React.ReactNode;
839
+ isCompact?: boolean;
840
+ link?: {
841
+ content: string | React.ReactNode;
842
+ onClick(): void;
843
+ };
844
+ linkProps?: AnchorProps;
845
+ noIcon?: boolean;
846
+ onClickCancelTimer?(): void;
847
+ primaryAction?: {
848
+ content: string | React.ReactNode;
849
+ onClick(): void;
850
+ };
851
+ primaryActionProps?: ButtonProps;
852
+ secondaryAction?: {
853
+ content: string | React.ReactNode;
854
+ onClick(): void;
855
+ };
856
+ secondaryActionProps?: ButtonProps;
999
857
  textProps?: TextProps;
1000
- /** Make badge round */
1001
- round?: string;
858
+ timer?: number;
859
+ title?: string;
860
+ titleProps?: TextProps;
861
+ type: AlertType;
1002
862
  }
1003
863
  /**
1004
864
  * Расширен:
1005
865
  * - [`BaseProps`](#/Миксины)
1006
- * - [`Color`](#/Миксины)
1007
- * - [`Display`](#/Миксины)
1008
866
  */
1009
- declare function Badge({ children, content, className, textProps, round, display, ...restProps }: BadgeProps): JSX.Element;
1010
- declare namespace Badge {
867
+ declare function Alert({ primaryAction, primaryActionProps, secondaryAction, secondaryActionProps, children, className, clear, content, customIcon, image, isCompact, link, linkProps, noIcon, onClickCancelTimer, closeToast, style, textProps, timer, title, titleProps, type, }: AlertProps): JSX.Element;
868
+ declare namespace Alert {
1011
869
  var displayName: string;
1012
870
  }
1013
871
 
1014
- declare type ButtonStaticSize = 'xl' | 'l' | 'm' | 's' | 'xs';
1015
- declare type ButtonSize = ButtonStaticSize | ResponsiveProperty$1<`${number}rem` | number>;
1016
- interface ButtonProps extends BaseProps$1, Display$1, Color$1, Color$1<'fontColor'>, ResponsiveNamedProperty$1<'padding'>, ResponsiveNamedProperty$1<'paddingTop'>, ResponsiveNamedProperty$1<'paddingRight'>, ResponsiveNamedProperty$1<'paddingBottom'>, ResponsiveNamedProperty$1<'paddingLeft'>, ResponsiveNamedProperty$1<'margin'>, ResponsiveNamedProperty$1<'marginTop'>, ResponsiveNamedProperty$1<'marginRight'>, ResponsiveNamedProperty$1<'marginBottom'>, ResponsiveNamedProperty$1<'marginLeft'>, ResponsiveNamedProperty$1<'fontSize'>, ResponsiveNamedProperty$1<'fluid', boolean>, ResponsiveNamedProperty$1<'width', 'auto' | 'l' | 'm' | 's' | 'xs' | number>, ResponsiveNamedProperty$1<'height', 'l' | 'm' | 's' | 'xs' | number> {
1017
- /** Root node polymorphic type */
1018
- as?: 'div' | 'span' | 'a' | 'button' | typeof Link | typeof Anchor$1;
1019
- /** Button size */
1020
- size?: ButtonSize;
1021
- /** Button type attribute */
1022
- type?: 'button' | 'submit' | 'reset';
1023
- /** Button icons */
1024
- icon?: JSX.Element | [Nullable$1<JSX.Element>, Nullable$1<JSX.Element>];
1025
- /** Button success state */
1026
- success?: boolean;
1027
- /** Loading state */
1028
- loading?: boolean;
872
+ declare enum CurrencyCodes {
873
+ ALL = "ALL",
874
+ AFN = "AFN",
875
+ ARS = "ARS",
876
+ AWG = "AWG",
877
+ AUD = "AUD",
878
+ AZN = "AZN",
879
+ BSD = "BSD",
880
+ BBD = "BBD",
881
+ BYR = "BYR",
882
+ BZD = "BZD",
883
+ BMD = "BMD",
884
+ BOB = "BOB",
885
+ BAM = "BAM",
886
+ BWP = "BWP",
887
+ BGN = "BGN",
888
+ BRL = "BRL",
889
+ BND = "BND",
890
+ KHR = "KHR",
891
+ CAD = "CAD",
892
+ KYD = "KYD",
893
+ CLP = "CLP",
894
+ CNY = "CNY",
895
+ COP = "COP",
896
+ CRC = "CRC",
897
+ HRK = "HRK",
898
+ CUP = "CUP",
899
+ CZK = "CZK",
900
+ DKK = "DKK",
901
+ DOP = "DOP",
902
+ XCD = "XCD",
903
+ EGP = "EGP",
904
+ SVC = "SVC",
905
+ EEK = "EEK",
906
+ EUR = "EUR",
907
+ FKP = "FKP",
908
+ FJD = "FJD",
909
+ FRF = "FRF",
910
+ GHC = "GHC",
911
+ GIP = "GIP",
912
+ GTQ = "GTQ",
913
+ GGP = "GGP",
914
+ GYD = "GYD",
915
+ HNL = "HNL",
916
+ HKD = "HKD",
917
+ HUF = "HUF",
918
+ ISK = "ISK",
919
+ INR = "INR",
920
+ IDR = "IDR",
921
+ IRR = "IRR",
922
+ IMP = "IMP",
923
+ ILS = "ILS",
924
+ JMD = "JMD",
925
+ JPY = "JPY",
926
+ JEP = "JEP",
927
+ KZT = "KZT",
928
+ KGS = "KGS",
929
+ LAK = "LAK",
930
+ LVL = "LVL",
931
+ LBP = "LBP",
932
+ LRD = "LRD",
933
+ LTL = "LTL",
934
+ MKD = "MKD",
935
+ MYR = "MYR",
936
+ MUR = "MUR",
937
+ MXN = "MXN",
938
+ MNT = "MNT",
939
+ MZN = "MZN",
940
+ NAD = "NAD",
941
+ NPR = "NPR",
942
+ ANG = "ANG",
943
+ NZD = "NZD",
944
+ NIO = "NIO",
945
+ NGN = "NGN",
946
+ KPW = "KPW",
947
+ NOK = "NOK",
948
+ OMR = "OMR",
949
+ PKR = "PKR",
950
+ PAB = "PAB",
951
+ PYG = "PYG",
952
+ PEN = "PEN",
953
+ PHP = "PHP",
954
+ PLN = "PLN",
955
+ QAR = "QAR",
956
+ RON = "RON",
957
+ RUR = "RUR",
958
+ RUB = "RUB",
959
+ SHP = "SHP",
960
+ SAR = "SAR",
961
+ RSD = "RSD",
962
+ SCR = "SCR",
963
+ SGD = "SGD",
964
+ SBD = "SBD",
965
+ SOS = "SOS",
966
+ ZAR = "ZAR",
967
+ KRW = "KRW",
968
+ LKR = "LKR",
969
+ SEK = "SEK",
970
+ CHF = "CHF",
971
+ SRD = "SRD",
972
+ SYP = "SYP",
973
+ TWD = "TWD",
974
+ THB = "THB",
975
+ TTD = "TTD",
976
+ TRY = "TRY",
977
+ TRL = "TRL",
978
+ TVD = "TVD",
979
+ UAH = "UAH",
980
+ GBP = "GBP",
981
+ USD = "USD",
982
+ UYU = "UYU",
983
+ UZS = "UZS",
984
+ VEF = "VEF",
985
+ VND = "VND",
986
+ YER = "YER",
987
+ ZWD = "ZWD"
988
+ }
989
+ declare const CURRENCY_MAP: Readonly<Record<CurrencyCodes, string>>;
990
+
991
+ interface AmountProps extends BaseProps, Color, ResponsiveNamedProperty<'size'>, Display {
992
+ /**
993
+ * Value for amount
994
+ */
995
+ value?: number;
996
+ /**
997
+ * Digits after point
998
+ */
999
+ digitsAfterPoint?: number;
1000
+ /**
1001
+ * Show zero minor part
1002
+ */
1003
+ showZeroMinorPart?: boolean;
1004
+ /**
1005
+ * Separator of major and minor part of amount
1006
+ */
1007
+ separator?: string;
1008
+ /**
1009
+ * International code of currency.
1010
+ */
1011
+ currency?: keyof typeof CurrencyCodes | string;
1012
+ /**
1013
+ * Use Header component for display amount
1014
+ */
1015
+ isHeader?: boolean;
1016
+ /**
1017
+ * Amount is not valid and will be crossed out with ```text-decoration: line-through```
1018
+ */
1019
+ crossedOut?: boolean;
1020
+ /**
1021
+ * If need only currency symbol
1022
+ */
1023
+ onlyCurrency?: boolean;
1024
+ }
1025
+ /**
1026
+ * Расширен:
1027
+ * - [`BaseProps`](#/Миксины)
1028
+ * - [`Color`](#/Миксины)
1029
+ * - [`ResponsiveNamedProperty<'size'>`](#/Миксины)
1030
+ */
1031
+ declare class Amount extends PureComponent<AmountProps> {
1032
+ static displayName: string;
1033
+ static defaultProps: {
1034
+ isHeader: boolean;
1035
+ showZeroMinorPart: boolean;
1036
+ crossedOut: boolean;
1037
+ digitsAfterPoint: number;
1038
+ separator: string;
1039
+ onlyCurrency: boolean;
1040
+ };
1041
+ static getCurrencySymbol(currencyCode: keyof typeof CurrencyCodes | string): any;
1042
+ renderMinorPart(minorPart: string): JSX.Element | null;
1043
+ renderCurrencySymbol: (currencySymbol: string) => JSX.Element;
1044
+ render(): JSX.Element;
1045
+ }
1046
+
1047
+ declare type ArrowStaticSize = 'l' | 'm' | 'xs';
1048
+ declare type ArrowSize = ArrowStaticSize | ResponsiveProperty$1<`${number}rem` | number>;
1049
+ interface ArrowProps extends BaseProps$1 {
1050
+ /** Square shape */
1051
+ square?: boolean;
1052
+ /** Used on colored background */
1053
+ onColored?: boolean;
1054
+ /** Size of button */
1055
+ size?: ArrowSize;
1056
+ /** Arrow points top */
1057
+ top?: boolean;
1058
+ /** Arrow points right */
1059
+ right?: boolean;
1060
+ /** Arrow points bottom */
1061
+ bottom?: boolean;
1062
+ /** Arrow points left */
1063
+ left?: boolean;
1064
+ /** Inverted colors */
1065
+ inverse?: boolean;
1066
+ /** Outlined appearance */
1067
+ outline?: boolean;
1029
1068
  /** Button disabled */
1030
1069
  disabled?: boolean;
1031
- /** Rounded border radius */
1032
- rounded?: boolean;
1033
- /** Rounded shape button */
1034
- round?: boolean;
1035
- /** Anchor target attribute */
1036
- target?: string;
1037
- /** Anchor rel attribute */
1038
- rel?: string;
1039
- /** Auto-generate rel. You must specify domain inside theme */
1040
- autoRel?: boolean;
1041
- /** Anchor href attribute */
1042
- href?: string;
1043
- /** React router Link to prop */
1044
- to?: string;
1070
+ /** Click handler */
1071
+ onClick?(event: React.MouseEvent<HTMLButtonElement>): void;
1072
+ }
1073
+
1074
+ /**
1075
+ * Button with arrow icon
1076
+ */
1077
+ declare const Arrow: react.ForwardRefExoticComponent<ArrowProps & react.RefAttributes<HTMLButtonElement>>;
1078
+
1079
+ interface AvatarProps extends BaseProps, Color {
1045
1080
  /**
1046
- * Indicates if there should not be any margin
1047
- * between this button and the previous one
1081
+ * Children react node
1048
1082
  */
1049
- noSpacing?: boolean;
1050
- /** Outline appearance */
1051
- outline?: boolean;
1052
- /** Content font weight */
1053
- fontWeight?: FontWeight$1;
1054
- /** Associated form */
1055
- form?: string;
1056
- /** @preset {Default} Primary appearance */
1057
- primary?: boolean;
1058
- /** @preset {Default} Secondary appearance */
1059
- secondary?: boolean;
1060
- /** @preset {Default} Inverted colors */
1061
- inverted?: boolean;
1062
- /** @preset {Brand} Base appearance */
1063
- base?: boolean;
1064
- /** @preset {Brand} Clear appearance */
1065
- clear?: boolean;
1066
- /** @preset {Brand} Black colors appearance */
1067
- black?: boolean;
1068
- /** @preset {Brand} Red colors appearance */
1069
- danger?: boolean;
1070
- /** @preset {Brand} Modifies appearance on colored background */
1071
- onColored?: boolean;
1072
- /** @deprecated Use outline */
1073
- basic?: boolean;
1074
- /** @deprecated Use children */
1075
- content?: React.ReactNode;
1076
- /** @deprecated Use ref */
1077
- innerRef?: React.LegacyRef<HTMLElement>;
1078
- /** Component's children */
1079
- children?: React.ReactNode | React.ReactNode[];
1080
- onClick?: (evt: React.SyntheticEvent<HTMLElement>) => void;
1081
- onClickCapture?: (evt: React.SyntheticEvent<HTMLElement>) => void;
1082
- onMouseEnter?: (evt: React.SyntheticEvent<HTMLElement>) => void;
1083
- onMouseLeave?: (evt: React.SyntheticEvent<HTMLElement>) => void;
1083
+ children?: React.ReactNode;
1084
+ /** Title for avatar. Example user name. */
1085
+ title?: string;
1086
+ /** Image source */
1087
+ src?: string;
1088
+ /** Size of avatar */
1089
+ size?: 'l' | 'm' | 'sm' | 's' | 'xs' | number;
1090
+ /** Shadow of avatar */
1091
+ shadow?: boolean;
1092
+ /** Make ref func */
1093
+ ref?: React.LegacyRef<HTMLDivElement>;
1094
+ /**
1095
+ * Generate color by title automatically
1096
+ *
1097
+ * `Performance Info`: Each render of component call getAvatarColor function on received title
1098
+ */
1099
+ autoColor?: boolean;
1100
+ }
1101
+ /**
1102
+ * Расширен:
1103
+ * - [`BaseProps`](#/Миксины)
1104
+ * - [`Color`](#/Миксины)
1105
+ */
1106
+ declare class Avatar extends PureComponent<AvatarProps> {
1107
+ static defaultProps: {
1108
+ size: string;
1109
+ autoColor: boolean;
1110
+ };
1111
+ static displayName: string;
1112
+ getAvatarText(): string;
1113
+ render(): JSX.Element;
1084
1114
  }
1085
1115
 
1116
+ interface BadgeProps extends BaseProps, Color, Display {
1117
+ /**
1118
+ * Children react node
1119
+ */
1120
+ children?: React.ReactNode;
1121
+ content?: string | React.ReactNode;
1122
+ textProps?: TextProps;
1123
+ /** Make badge round */
1124
+ round?: string;
1125
+ }
1086
1126
  /**
1087
- * Main button
1127
+ * Расширен:
1128
+ * - [`BaseProps`](#/Миксины)
1129
+ * - [`Color`](#/Миксины)
1130
+ * - [`Display`](#/Миксины)
1088
1131
  */
1089
- declare const Button: react.ForwardRefExoticComponent<ButtonProps & react.RefAttributes<HTMLElement>>;
1132
+ declare function Badge({ children, content, className, textProps, round, display, ...restProps }: BadgeProps): JSX.Element;
1133
+ declare namespace Badge {
1134
+ var displayName: string;
1135
+ }
1090
1136
 
1091
1137
  interface ContainerProps extends BaseProps, Display, Color {
1092
1138
  /**
@@ -2465,4 +2511,4 @@ declare namespace Select {
2465
2511
  var displayName: string;
2466
2512
  }
2467
2513
 
2468
- export { ActionBtn, Amount, Anchor, Arrow, Avatar, Badge, BaseProps, Button, COUNTRY_DATA, CURRENCY_MAP, Checkbox, ColorNames, Container, ContextMenu, CurrencyCodes, DEFAULT_MASK, FontWeight, HEX, INITIAL_MASK, Icon, Input, InputField, Modal, Nullable, Paper, Progress, RGB, RGBA, Radio, withThemeScrollable as Scrollable, Section, Select, Separator, Spacer, Spinner, Switcher, Tabs, Tag, Text, Textarea, ThemeMode, ThemeName, ThemePreset, ThemeProvider, Tooltip, adultDarkTheme, adultLightTheme, babyDarkTheme, babyLightTheme, baseInputStyle, buildMediaQuery, color, defaultIcons, desktopFirst, mobileFirst, motherDarkTheme, motherLightTheme, property, responsiveNamedProperty, responsiveProperty, screenL, screenM, screenMaxL, screenMaxM, screenMaxS, screenMaxXl, screenMaxXs, screenMaxXxs, screenMinL, screenMinM, screenMinS, screenMinXl, screenMinXs, screenRetina, screenS, screenXl, screenXs, teenDarkTheme, teenLightTheme, defaultTheme as theme, vAlign };
2514
+ export { ActionBtn, Alert, Amount, Anchor, Arrow, Avatar, Badge, BaseProps, Button, COUNTRY_DATA, CURRENCY_MAP, Checkbox, ColorNames, Container, ContextMenu, CurrencyCodes, DEFAULT_MASK, FontWeight, HEX, INITIAL_MASK, Icon, Input, InputField, Modal, Nullable, Paper, Progress, RGB, RGBA, Radio, withThemeScrollable as Scrollable, Section, Select, Separator, Spacer, Spinner, Switcher, Tabs, Tag, Text, Textarea, ThemeMode, ThemeName, ThemePreset, ThemeProvider, Tooltip, adultDarkTheme, adultLightTheme, babyDarkTheme, babyLightTheme, baseInputStyle, buildMediaQuery, color, defaultIcons, desktopFirst, mobileFirst, motherDarkTheme, motherLightTheme, property, responsiveNamedProperty, responsiveProperty, screenL, screenM, screenMaxL, screenMaxM, screenMaxS, screenMaxXl, screenMaxXs, screenMaxXxs, screenMinL, screenMinM, screenMinS, screenMinXl, screenMinXs, screenRetina, screenS, screenXl, screenXs, teenDarkTheme, teenLightTheme, defaultTheme as theme, vAlign };