@foxford/ui 2.6.0-beta-3f7fdb5-20230713 → 2.6.0-beta-95a4a4e-20230719
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/components/Anchor/Anchor.js +1 -1
- package/components/Anchor/Anchor.js.map +1 -1
- package/components/Button/style.js +1 -1
- package/components/Button/style.js.map +1 -1
- package/components/Text/Text.js +1 -1
- package/components/Text/Text.js.map +1 -1
- package/components/Text/constants.js +2 -0
- package/components/Text/constants.js.map +1 -0
- package/components/Text/style.js +1 -1
- package/components/Text/style.js.map +1 -1
- package/dts/index.d.ts +194 -315
- package/index.cjs.js +1 -1
- package/index.cjs.js.map +1 -1
- package/index.js +1 -1
- package/mixins/responsive-property.js +1 -1
- package/mixins/responsive-property.js.map +1 -1
- package/mixins/shared.js +1 -1
- package/mixins/shared.js.map +1 -1
- package/package.json +1 -2
- package/theme/colors.js +1 -1
- package/theme/colors.js.map +1 -1
- package/components/Alert/Alert.js +0 -2
- package/components/Alert/Alert.js.map +0 -1
- package/components/Alert/CountdownCircle.js +0 -2
- package/components/Alert/CountdownCircle.js.map +0 -1
- package/components/Alert/style.js +0 -2
- package/components/Alert/style.js.map +0 -1
package/dts/index.d.ts
CHANGED
|
@@ -2,13 +2,16 @@
|
|
|
2
2
|
import * as styled_components from 'styled-components';
|
|
3
3
|
import { DefaultTheme, FlattenSimpleInterpolation, CSSObject, SimpleInterpolation, css } from 'styled-components';
|
|
4
4
|
import * as react from 'react';
|
|
5
|
-
import {
|
|
5
|
+
import { PureComponent, ForwardRefExoticComponent, PropsWithoutRef, RefAttributes } from 'react';
|
|
6
6
|
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';
|
|
7
9
|
import { Display as Display$1 } from 'mixins/display';
|
|
8
|
-
import { ResponsiveNamedProperty as ResponsiveNamedProperty$1, ResponsiveProperty as ResponsiveProperty$1 } from 'mixins/responsive-property';
|
|
9
10
|
import { Color as Color$1 } from 'mixins/color';
|
|
11
|
+
import { SizeLatin as SizeLatin$1 } from 'shared/enums/sizeLatin';
|
|
12
|
+
import { TextHeadingProps } from 'components/Text.Heading';
|
|
13
|
+
import { TextEllipse } from 'components/Text.Ellipse';
|
|
10
14
|
import { Anchor as Anchor$1 } from 'components/Anchor';
|
|
11
|
-
import { BaseProps as BaseProps$1, Nullable as Nullable$1, FontWeight as FontWeight$1 } from 'shared/interfaces';
|
|
12
15
|
import { Classes } from 'react-modal';
|
|
13
16
|
import * as rc_scrollbars_lib_Scrollbars_types from 'rc-scrollbars/lib/Scrollbars/types';
|
|
14
17
|
import * as rc_scrollbars from 'rc-scrollbars';
|
|
@@ -206,8 +209,7 @@ declare enum ColorNames {
|
|
|
206
209
|
grey = "grey",
|
|
207
210
|
darkgrey = "darkgrey",
|
|
208
211
|
lightgrey = "lightgrey",
|
|
209
|
-
superlightgrey = "superlightgrey"
|
|
210
|
-
transparent = "transparent"
|
|
212
|
+
superlightgrey = "superlightgrey"
|
|
211
213
|
}
|
|
212
214
|
|
|
213
215
|
declare type ColorPropsProperties = 'color' | 'fontColor' | `${string}Color` | `color${string}`;
|
|
@@ -245,7 +247,7 @@ declare type ResponsiveNamedProperty<T extends PropsProperties, V extends Possib
|
|
|
245
247
|
[key in `${T}${ResponsiveKeys}`]?: V;
|
|
246
248
|
};
|
|
247
249
|
declare type ResponsiveProperty<V = number | keyof typeof SizeLatin> = V | [desktop: V, tablet: V, mobile: V] | [xl: V, l: V, m: V, s: V, xs: V, xxs: V];
|
|
248
|
-
declare const property: (value: PossibleValues, cssProperty?: CssProperty, sizing?: null | string) => () => () => FlattenSimpleInterpolation | null;
|
|
250
|
+
declare const property: (value: PossibleValues, cssProperty?: CssProperty, sizing?: null | string, sizes?: Record<SizeLatin, number>) => () => () => FlattenSimpleInterpolation | null;
|
|
249
251
|
/**
|
|
250
252
|
* Sort keys as desktop first
|
|
251
253
|
* @param a key a
|
|
@@ -263,9 +265,10 @@ declare const mobileFirst: (a: string, b: string) => number;
|
|
|
263
265
|
interface ResponsiveNamedPropertyPayload<T extends PropsProperties> {
|
|
264
266
|
sizes: ResponsiveNamedProperty<T>;
|
|
265
267
|
cssProperty: CssProperty;
|
|
266
|
-
sizing?: null |
|
|
268
|
+
sizing?: null | string;
|
|
267
269
|
customSizeHandler?: (_value: PossibleValues) => PossibleValues;
|
|
268
270
|
sort?: (_a: string, _b: string) => number;
|
|
271
|
+
predefinedSizes?: Record<SizeLatin, number>;
|
|
269
272
|
}
|
|
270
273
|
/**
|
|
271
274
|
* Миксин для генерации media запросов
|
|
@@ -276,7 +279,7 @@ interface ResponsiveNamedPropertyPayload<T extends PropsProperties> {
|
|
|
276
279
|
* @param obj.customSizeHandler функция для вычисления кастомных значений величин
|
|
277
280
|
* @returns строки медиазапросов
|
|
278
281
|
*/
|
|
279
|
-
declare const responsiveNamedProperty: <T extends PropsProperties>({ sizes, cssProperty, sizing, customSizeHandler, sort, }: ResponsiveNamedPropertyPayload<T>) => () => () => styled_components.FlattenInterpolation<styled_components.ThemeProps<styled_components.DefaultTheme>>[];
|
|
282
|
+
declare const responsiveNamedProperty: <T extends PropsProperties>({ sizes, predefinedSizes, cssProperty, sizing, customSizeHandler, sort, }: ResponsiveNamedPropertyPayload<T>) => () => () => styled_components.FlattenInterpolation<styled_components.ThemeProps<styled_components.DefaultTheme>>[];
|
|
280
283
|
/**
|
|
281
284
|
* Миксин для генерации media запросов
|
|
282
285
|
*
|
|
@@ -432,7 +435,7 @@ interface VAlign {
|
|
|
432
435
|
}
|
|
433
436
|
declare const vAlign: (vAlign: 'top' | 'middle' | 'bottom' | 'text-top' | 'text-bottom' | 'baseline') => styled_components.FlattenSimpleInterpolation;
|
|
434
437
|
|
|
435
|
-
declare function buildMediaQuery(value: number | keyof typeof SizeLatin | 'auto' | 'initial' | 'inherit' | boolean, property: string | ((_size: number | 'auto' | 'initial' | 'inherit' | boolean, _sizing?: null | string) => FlattenSimpleInterpolation | null), screenQueryFunction: typeof screenXs, sizing: null | string): ReturnType<typeof css>;
|
|
438
|
+
declare function buildMediaQuery(value: number | keyof typeof SizeLatin | 'auto' | 'initial' | 'inherit' | boolean, property: string | ((_size: number | 'auto' | 'initial' | 'inherit' | boolean, _sizing?: null | string) => FlattenSimpleInterpolation | null), screenQueryFunction: typeof screenXs, sizing: null | string, sizes?: Record<SizeLatin, number>): ReturnType<typeof css>;
|
|
436
439
|
|
|
437
440
|
interface Display {
|
|
438
441
|
display?: 'block' | 'inline' | 'inline-block' | 'flex' | 'inline-flex' | 'table-cell' | 'inherit' | 'none';
|
|
@@ -575,311 +578,6 @@ declare namespace ActionBtn {
|
|
|
575
578
|
var displayName: string;
|
|
576
579
|
}
|
|
577
580
|
|
|
578
|
-
interface AnchorProps extends BaseProps, Color, ResponsiveNamedProperty<'size'>, Display {
|
|
579
|
-
/**
|
|
580
|
-
* Custom CSS class name
|
|
581
|
-
*/
|
|
582
|
-
as?: 'div' | 'span' | 'a' | typeof Link;
|
|
583
|
-
/**
|
|
584
|
-
* React router link to
|
|
585
|
-
*/
|
|
586
|
-
to?: string;
|
|
587
|
-
/**
|
|
588
|
-
* Link href
|
|
589
|
-
*/
|
|
590
|
-
href?: string;
|
|
591
|
-
/**
|
|
592
|
-
* Is display inline
|
|
593
|
-
* */
|
|
594
|
-
wrapper?: boolean;
|
|
595
|
-
/**
|
|
596
|
-
* Pseudo link has dashed bottom border
|
|
597
|
-
* */
|
|
598
|
-
pseudo?: boolean;
|
|
599
|
-
/**
|
|
600
|
-
* If link should be underlined
|
|
601
|
-
* */
|
|
602
|
-
underline?: boolean;
|
|
603
|
-
/**
|
|
604
|
-
* Primary content
|
|
605
|
-
*/
|
|
606
|
-
/**
|
|
607
|
-
* Children react node
|
|
608
|
-
*/
|
|
609
|
-
children?: React.ReactNode;
|
|
610
|
-
/**
|
|
611
|
-
* Primary content
|
|
612
|
-
*/
|
|
613
|
-
content?: string;
|
|
614
|
-
/**
|
|
615
|
-
* Onclick handler
|
|
616
|
-
*/
|
|
617
|
-
onClick?: () => void;
|
|
618
|
-
tabIndex?: number;
|
|
619
|
-
target?: string;
|
|
620
|
-
rel?: string;
|
|
621
|
-
/**
|
|
622
|
-
* Auto-generate rel. You must specify domain inside theme
|
|
623
|
-
*/
|
|
624
|
-
autoRel?: boolean;
|
|
625
|
-
}
|
|
626
|
-
/**
|
|
627
|
-
* Расширен:
|
|
628
|
-
* - [`BaseProps`](#/Миксины)
|
|
629
|
-
* - [`Color`](#/Миксины)
|
|
630
|
-
* - [`ResponsiveNamedProperty<'size'>`](#/Миксины)
|
|
631
|
-
* - [`Display`](#/Миксины)
|
|
632
|
-
*/
|
|
633
|
-
declare function Anchor(props: typeof Anchor.defaultProps & AnchorProps): JSX.Element;
|
|
634
|
-
declare namespace Anchor {
|
|
635
|
-
var displayName: string;
|
|
636
|
-
var defaultProps: {
|
|
637
|
-
display: string;
|
|
638
|
-
};
|
|
639
|
-
}
|
|
640
|
-
|
|
641
|
-
declare type ButtonStaticSize = 'xl' | 'l' | 'm' | 's' | 'xs';
|
|
642
|
-
declare type ButtonSize = ButtonStaticSize | ResponsiveProperty$1<`${number}rem` | number>;
|
|
643
|
-
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> {
|
|
644
|
-
/** Root node polymorphic type */
|
|
645
|
-
as?: 'div' | 'span' | 'a' | 'button' | typeof Link | typeof Anchor$1;
|
|
646
|
-
/** Button size */
|
|
647
|
-
size?: ButtonSize;
|
|
648
|
-
/** Button type attribute */
|
|
649
|
-
type?: 'button' | 'submit' | 'reset';
|
|
650
|
-
/** Button icons */
|
|
651
|
-
icon?: JSX.Element | [Nullable$1<JSX.Element>, Nullable$1<JSX.Element>];
|
|
652
|
-
/** Button success state */
|
|
653
|
-
success?: boolean;
|
|
654
|
-
/** Loading state */
|
|
655
|
-
loading?: boolean;
|
|
656
|
-
/** Button disabled */
|
|
657
|
-
disabled?: boolean;
|
|
658
|
-
/** Rounded border radius */
|
|
659
|
-
rounded?: boolean;
|
|
660
|
-
/** Rounded shape button */
|
|
661
|
-
round?: boolean;
|
|
662
|
-
/** Anchor target attribute */
|
|
663
|
-
target?: string;
|
|
664
|
-
/** Anchor rel attribute */
|
|
665
|
-
rel?: string;
|
|
666
|
-
/** Auto-generate rel. You must specify domain inside theme */
|
|
667
|
-
autoRel?: boolean;
|
|
668
|
-
/** Anchor href attribute */
|
|
669
|
-
href?: string;
|
|
670
|
-
/** React router Link to prop */
|
|
671
|
-
to?: string;
|
|
672
|
-
/**
|
|
673
|
-
* Indicates if there should not be any margin
|
|
674
|
-
* between this button and the previous one
|
|
675
|
-
*/
|
|
676
|
-
noSpacing?: boolean;
|
|
677
|
-
/** Outline appearance */
|
|
678
|
-
outline?: boolean;
|
|
679
|
-
/** Content font weight */
|
|
680
|
-
fontWeight?: FontWeight$1;
|
|
681
|
-
/** Associated form */
|
|
682
|
-
form?: string;
|
|
683
|
-
/** @preset {Default} Primary appearance */
|
|
684
|
-
primary?: boolean;
|
|
685
|
-
/** @preset {Default} Secondary appearance */
|
|
686
|
-
secondary?: boolean;
|
|
687
|
-
/** @preset {Default} Inverted colors */
|
|
688
|
-
inverted?: boolean;
|
|
689
|
-
/** @preset {Brand} Base appearance */
|
|
690
|
-
base?: boolean;
|
|
691
|
-
/** @preset {Brand} Clear appearance */
|
|
692
|
-
clear?: boolean;
|
|
693
|
-
/** @preset {Brand} Black colors appearance */
|
|
694
|
-
black?: boolean;
|
|
695
|
-
/** @preset {Brand} Red colors appearance */
|
|
696
|
-
danger?: boolean;
|
|
697
|
-
/** @preset {Brand} Modifies appearance on colored background */
|
|
698
|
-
onColored?: boolean;
|
|
699
|
-
/** @deprecated Use outline */
|
|
700
|
-
basic?: boolean;
|
|
701
|
-
/** @deprecated Use children */
|
|
702
|
-
content?: React.ReactNode;
|
|
703
|
-
/** @deprecated Use ref */
|
|
704
|
-
innerRef?: React.LegacyRef<HTMLElement>;
|
|
705
|
-
/** Component's children */
|
|
706
|
-
children?: React.ReactNode | React.ReactNode[];
|
|
707
|
-
onClick?: (evt: React.SyntheticEvent<HTMLElement>) => void;
|
|
708
|
-
onClickCapture?: (evt: React.SyntheticEvent<HTMLElement>) => void;
|
|
709
|
-
onMouseEnter?: (evt: React.SyntheticEvent<HTMLElement>) => void;
|
|
710
|
-
onMouseLeave?: (evt: React.SyntheticEvent<HTMLElement>) => void;
|
|
711
|
-
}
|
|
712
|
-
|
|
713
|
-
/**
|
|
714
|
-
* Main button
|
|
715
|
-
*/
|
|
716
|
-
declare const Button: react.ForwardRefExoticComponent<ButtonProps & react.RefAttributes<HTMLElement>>;
|
|
717
|
-
|
|
718
|
-
declare enum H {
|
|
719
|
-
h1 = 0,
|
|
720
|
-
h2 = 1,
|
|
721
|
-
h3 = 2,
|
|
722
|
-
h4 = 3
|
|
723
|
-
}
|
|
724
|
-
interface TextHeadingProps extends Omit<TextProps, 'content' | 'as'> {
|
|
725
|
-
h?: keyof typeof H;
|
|
726
|
-
/**
|
|
727
|
-
* Children react node
|
|
728
|
-
*/
|
|
729
|
-
children?: React.ReactNode;
|
|
730
|
-
}
|
|
731
|
-
declare function TextHeading({ h, ...props }: TextHeadingProps): JSX.Element;
|
|
732
|
-
declare namespace TextHeading {
|
|
733
|
-
var displayName: string;
|
|
734
|
-
}
|
|
735
|
-
|
|
736
|
-
interface TextEllipseProps extends Omit<TextProps, 'content'> {
|
|
737
|
-
/** Toggle text for folded state */
|
|
738
|
-
moreText?: string;
|
|
739
|
-
/** Toggle text for unfolded state */
|
|
740
|
-
lessText?: string;
|
|
741
|
-
/** Classname */
|
|
742
|
-
className?: string;
|
|
743
|
-
/** Html content */
|
|
744
|
-
content: string | string[];
|
|
745
|
-
/** Characters quantity for ellipsed text */
|
|
746
|
-
chars?: number;
|
|
747
|
-
/** Wrap text in quotes */
|
|
748
|
-
quoted?: boolean;
|
|
749
|
-
/** Flag to show toggler */
|
|
750
|
-
showToggler?: boolean;
|
|
751
|
-
}
|
|
752
|
-
interface TextEllipseState {
|
|
753
|
-
isUnFolded: boolean;
|
|
754
|
-
isEllipsed: boolean;
|
|
755
|
-
}
|
|
756
|
-
/**
|
|
757
|
-
* Расширен:
|
|
758
|
-
* - [`BaseProps`](#/Миксины)
|
|
759
|
-
* - [`Color`](#/Миксины)
|
|
760
|
-
* - [`Display`](#/Миксины)
|
|
761
|
-
* - [`ResponsiveNamedProperty<'size'>`](#/Миксины)
|
|
762
|
-
*/
|
|
763
|
-
declare class TextEllipse extends Component<TextEllipseProps, TextEllipseState> {
|
|
764
|
-
static displayName: string;
|
|
765
|
-
constructor(props: TextEllipseProps);
|
|
766
|
-
componentDidUpdate({ content }: TextEllipseProps): void;
|
|
767
|
-
getContent: (props: Omit<TextEllipseProps, 'className' | 'moreText' | 'lessText' | 'showToggler'>) => "" | JSX.Element;
|
|
768
|
-
getQuted: (content: string) => string;
|
|
769
|
-
toggle: () => void;
|
|
770
|
-
render(): JSX.Element;
|
|
771
|
-
}
|
|
772
|
-
|
|
773
|
-
interface TextProps extends BaseProps, Color, ResponsiveNamedProperty<'size'>, Display {
|
|
774
|
-
/**
|
|
775
|
-
* An element type to render as (string).
|
|
776
|
-
*/
|
|
777
|
-
as?: 'div' | 'span' | 'h1' | 'h2' | 'h3' | 'h4' | 'p';
|
|
778
|
-
/**
|
|
779
|
-
* Primary content
|
|
780
|
-
*/
|
|
781
|
-
content?: string;
|
|
782
|
-
/**
|
|
783
|
-
* Primary content
|
|
784
|
-
*/
|
|
785
|
-
/**
|
|
786
|
-
* Children react node
|
|
787
|
-
*/
|
|
788
|
-
children?: React.ReactNode;
|
|
789
|
-
/**
|
|
790
|
-
* Text font weight
|
|
791
|
-
*/
|
|
792
|
-
weight?: 'lighter' | 'normal' | 'bold' | 'bolder' | number;
|
|
793
|
-
/**
|
|
794
|
-
* Text font style
|
|
795
|
-
*/
|
|
796
|
-
fontStyle?: 'normal' | 'italic';
|
|
797
|
-
/**
|
|
798
|
-
* Add underline to inline links
|
|
799
|
-
*/
|
|
800
|
-
underlineLinks?: boolean;
|
|
801
|
-
/**
|
|
802
|
-
* Text align
|
|
803
|
-
*/
|
|
804
|
-
textAlign?: 'left' | 'center' | 'right' | 'justify' | 'start' | 'end';
|
|
805
|
-
/**
|
|
806
|
-
* Line height
|
|
807
|
-
*/
|
|
808
|
-
lineHeight?: 'l' | 'm' | 's' | 'xs' | number;
|
|
809
|
-
/**
|
|
810
|
-
* Element title
|
|
811
|
-
*/
|
|
812
|
-
title?: string;
|
|
813
|
-
}
|
|
814
|
-
/**
|
|
815
|
-
* Расширен:
|
|
816
|
-
* - [`BaseProps`](#/Миксины)
|
|
817
|
-
* - [`Color`](#/Миксины)
|
|
818
|
-
* - [`Display`](#/Миксины)
|
|
819
|
-
* - [`ResponsiveNamedProperty<'size'>`](#/Миксины)
|
|
820
|
-
*/
|
|
821
|
-
declare function Text(props: TextProps): JSX.Element;
|
|
822
|
-
declare namespace Text {
|
|
823
|
-
var Heading: typeof TextHeading;
|
|
824
|
-
var Ellipse: typeof TextEllipse;
|
|
825
|
-
var displayName: string;
|
|
826
|
-
}
|
|
827
|
-
|
|
828
|
-
declare type AlertType = 'warning' | 'error' | 'info' | 'success';
|
|
829
|
-
declare type AlertSize = 'big' | 'small';
|
|
830
|
-
interface AlertProps extends BaseProps {
|
|
831
|
-
/** Text of the timer cancellation button */
|
|
832
|
-
cancelTimerText?: string | React.ReactNode;
|
|
833
|
-
/** Children react node */
|
|
834
|
-
children?: React.ReactNode;
|
|
835
|
-
/** Use a colorless background */
|
|
836
|
-
clear?: boolean;
|
|
837
|
-
/** This method is taken from react-toastify library */
|
|
838
|
-
closeToast?(): void;
|
|
839
|
-
/** Icon name (for inner Icon component) */
|
|
840
|
-
customIcon?: keyof typeof IconNames;
|
|
841
|
-
/** Any custom image (e.g.: img, svg, icon from @foxford/icon-pack) */
|
|
842
|
-
image?: React.ReactNode;
|
|
843
|
-
/** Use for tablet and mobile view */
|
|
844
|
-
isCompact?: boolean;
|
|
845
|
-
/** Display a hyperlink */
|
|
846
|
-
link?: {
|
|
847
|
-
content: string | React.ReactNode;
|
|
848
|
-
onClick(): void;
|
|
849
|
-
};
|
|
850
|
-
linkProps?: AnchorProps;
|
|
851
|
-
/** Use alert without icon */
|
|
852
|
-
noIcon?: boolean;
|
|
853
|
-
/** You can cancel the action if the timer has not expired yet */
|
|
854
|
-
onClickCancelTimer?(): void;
|
|
855
|
-
/** Display the action button */
|
|
856
|
-
primaryAction?: {
|
|
857
|
-
content: string | React.ReactNode;
|
|
858
|
-
onClick(): void;
|
|
859
|
-
};
|
|
860
|
-
primaryActionProps?: ButtonProps;
|
|
861
|
-
/** Display the second action button */
|
|
862
|
-
secondaryAction?: {
|
|
863
|
-
content: string | React.ReactNode;
|
|
864
|
-
onClick(): void;
|
|
865
|
-
};
|
|
866
|
-
secondaryActionProps?: ButtonProps;
|
|
867
|
-
/** Use this to change the appearance of the alert */
|
|
868
|
-
size?: AlertSize;
|
|
869
|
-
/** Use it when you need to move text to another line in alerts without a title */
|
|
870
|
-
textProps?: TextProps;
|
|
871
|
-
textWrap?: boolean;
|
|
872
|
-
/** It is used in alerts with a timer. Pass the value in seconds */
|
|
873
|
-
timer?: number;
|
|
874
|
-
/** Display a title */
|
|
875
|
-
title?: string;
|
|
876
|
-
titleProps?: TextProps;
|
|
877
|
-
type?: AlertType;
|
|
878
|
-
width?: ResponsiveProperty;
|
|
879
|
-
}
|
|
880
|
-
|
|
881
|
-
declare const Alert: react.ForwardRefExoticComponent<AlertProps & react.RefAttributes<HTMLDivElement>>;
|
|
882
|
-
|
|
883
581
|
declare enum CurrencyCodes {
|
|
884
582
|
ALL = "ALL",
|
|
885
583
|
AFN = "AFN",
|
|
@@ -1055,6 +753,68 @@ declare class Amount extends PureComponent<AmountProps> {
|
|
|
1055
753
|
render(): JSX.Element;
|
|
1056
754
|
}
|
|
1057
755
|
|
|
756
|
+
interface AnchorProps extends BaseProps, Color, ResponsiveNamedProperty<'size'>, Display {
|
|
757
|
+
/**
|
|
758
|
+
* Custom CSS class name
|
|
759
|
+
*/
|
|
760
|
+
as?: 'div' | 'span' | 'a' | typeof Link;
|
|
761
|
+
/**
|
|
762
|
+
* React router link to
|
|
763
|
+
*/
|
|
764
|
+
to?: string;
|
|
765
|
+
/**
|
|
766
|
+
* Link href
|
|
767
|
+
*/
|
|
768
|
+
href?: string;
|
|
769
|
+
/**
|
|
770
|
+
* Is display inline
|
|
771
|
+
* */
|
|
772
|
+
wrapper?: boolean;
|
|
773
|
+
/**
|
|
774
|
+
* Pseudo link has dashed bottom border
|
|
775
|
+
* */
|
|
776
|
+
pseudo?: boolean;
|
|
777
|
+
/**
|
|
778
|
+
* If link should be underlined
|
|
779
|
+
* */
|
|
780
|
+
underline?: boolean;
|
|
781
|
+
/**
|
|
782
|
+
* Primary content
|
|
783
|
+
*/
|
|
784
|
+
/**
|
|
785
|
+
* Children react node
|
|
786
|
+
*/
|
|
787
|
+
children?: React.ReactNode;
|
|
788
|
+
/**
|
|
789
|
+
* Primary content
|
|
790
|
+
*/
|
|
791
|
+
content?: string;
|
|
792
|
+
/**
|
|
793
|
+
* Onclick handler
|
|
794
|
+
*/
|
|
795
|
+
onClick?: () => void;
|
|
796
|
+
target?: string;
|
|
797
|
+
rel?: string;
|
|
798
|
+
/**
|
|
799
|
+
* Auto-generate rel. You must specify domain inside theme
|
|
800
|
+
*/
|
|
801
|
+
autoRel?: boolean;
|
|
802
|
+
}
|
|
803
|
+
/**
|
|
804
|
+
* Расширен:
|
|
805
|
+
* - [`BaseProps`](#/Миксины)
|
|
806
|
+
* - [`Color`](#/Миксины)
|
|
807
|
+
* - [`ResponsiveNamedProperty<'size'>`](#/Миксины)
|
|
808
|
+
* - [`Display`](#/Миксины)
|
|
809
|
+
*/
|
|
810
|
+
declare function Anchor(props: typeof Anchor.defaultProps & AnchorProps): JSX.Element;
|
|
811
|
+
declare namespace Anchor {
|
|
812
|
+
var displayName: string;
|
|
813
|
+
var defaultProps: {
|
|
814
|
+
display: string;
|
|
815
|
+
};
|
|
816
|
+
}
|
|
817
|
+
|
|
1058
818
|
declare type ArrowStaticSize = 'l' | 'm' | 'xs';
|
|
1059
819
|
declare type ArrowSize = ArrowStaticSize | ResponsiveProperty$1<`${number}rem` | number>;
|
|
1060
820
|
interface ArrowProps extends BaseProps$1 {
|
|
@@ -1124,6 +884,48 @@ declare class Avatar extends PureComponent<AvatarProps> {
|
|
|
1124
884
|
render(): JSX.Element;
|
|
1125
885
|
}
|
|
1126
886
|
|
|
887
|
+
declare type TextAppearance = 'display' | 'heading' | 'subheading' | 'subheading-compact' | 'body' | 'caption';
|
|
888
|
+
interface TextProps extends Display$1, Color$1, ResponsiveNamedProperty$1<'size'>, BaseProps$1 {
|
|
889
|
+
/** Root node polymorphic type */
|
|
890
|
+
as?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'p' | 'div' | 'span';
|
|
891
|
+
/** Root id attribute */
|
|
892
|
+
id?: string;
|
|
893
|
+
/** Use predefined props with low priority */
|
|
894
|
+
appearance?: TextAppearance;
|
|
895
|
+
/** Custom sizes set */
|
|
896
|
+
sizes?: Record<SizeLatin$1, number>;
|
|
897
|
+
/** Sizing units */
|
|
898
|
+
fontUnits?: string;
|
|
899
|
+
/** Font family */
|
|
900
|
+
fontFamily?: string;
|
|
901
|
+
/** Font weight */
|
|
902
|
+
weight?: 'normal' | 'bold' | 'lighter' | 'bolder' | number;
|
|
903
|
+
/** Font style */
|
|
904
|
+
fontStyle?: 'normal' | 'italic';
|
|
905
|
+
/** Text transform */
|
|
906
|
+
transform?: 'capitalize' | 'uppercase' | 'lowercase';
|
|
907
|
+
/** Root margin */
|
|
908
|
+
margin?: number | string;
|
|
909
|
+
/** Underlined text */
|
|
910
|
+
underlineLinks?: boolean;
|
|
911
|
+
/** Text align */
|
|
912
|
+
textAlign?: 'left' | 'center' | 'right' | 'justify' | 'start' | 'end';
|
|
913
|
+
/** Line height */
|
|
914
|
+
lineHeight?: 'l' | 'm' | 's' | 'xs' | number;
|
|
915
|
+
/** Title attribute */
|
|
916
|
+
title?: string;
|
|
917
|
+
/** Component's children */
|
|
918
|
+
children?: React.ReactNode;
|
|
919
|
+
/** @deprecated Use children */
|
|
920
|
+
content?: string;
|
|
921
|
+
}
|
|
922
|
+
interface TextComponent extends ForwardRefExoticComponent<PropsWithoutRef<TextProps> & RefAttributes<HTMLElement>> {
|
|
923
|
+
Heading: (props: TextHeadingProps) => JSX.Element;
|
|
924
|
+
Ellipse: typeof TextEllipse;
|
|
925
|
+
}
|
|
926
|
+
|
|
927
|
+
declare const Text: TextComponent;
|
|
928
|
+
|
|
1127
929
|
interface BadgeProps extends BaseProps, Color, Display {
|
|
1128
930
|
/**
|
|
1129
931
|
* Children react node
|
|
@@ -1145,6 +947,83 @@ declare namespace Badge {
|
|
|
1145
947
|
var displayName: string;
|
|
1146
948
|
}
|
|
1147
949
|
|
|
950
|
+
declare type ButtonStaticSize = 'xl' | 'l' | 'm' | 's' | 'xs';
|
|
951
|
+
declare type ButtonSize = ButtonStaticSize | ResponsiveProperty$1<`${number}rem` | number>;
|
|
952
|
+
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> {
|
|
953
|
+
/** Root node polymorphic type */
|
|
954
|
+
as?: 'div' | 'span' | 'a' | 'button' | typeof Link | typeof Anchor$1;
|
|
955
|
+
/** Button size */
|
|
956
|
+
size?: ButtonSize;
|
|
957
|
+
/** Button type attribute */
|
|
958
|
+
type?: 'button' | 'submit' | 'reset';
|
|
959
|
+
/** Button icons */
|
|
960
|
+
icon?: JSX.Element | [Nullable$1<JSX.Element>, Nullable$1<JSX.Element>];
|
|
961
|
+
/** Button success state */
|
|
962
|
+
success?: boolean;
|
|
963
|
+
/** Loading state */
|
|
964
|
+
loading?: boolean;
|
|
965
|
+
/** Button disabled */
|
|
966
|
+
disabled?: boolean;
|
|
967
|
+
/** Rounded border radius */
|
|
968
|
+
rounded?: boolean;
|
|
969
|
+
/** Rounded shape button */
|
|
970
|
+
round?: boolean;
|
|
971
|
+
/** Anchor target attribute */
|
|
972
|
+
target?: string;
|
|
973
|
+
/** Anchor rel attribute */
|
|
974
|
+
rel?: string;
|
|
975
|
+
/** Auto-generate rel. You must specify domain inside theme */
|
|
976
|
+
autoRel?: boolean;
|
|
977
|
+
/** Anchor href attribute */
|
|
978
|
+
href?: string;
|
|
979
|
+
/** React router Link to prop */
|
|
980
|
+
to?: string;
|
|
981
|
+
/**
|
|
982
|
+
* Indicates if there should not be any margin
|
|
983
|
+
* between this button and the previous one
|
|
984
|
+
*/
|
|
985
|
+
noSpacing?: boolean;
|
|
986
|
+
/** Outline appearance */
|
|
987
|
+
outline?: boolean;
|
|
988
|
+
/** Content font weight */
|
|
989
|
+
fontWeight?: FontWeight$1;
|
|
990
|
+
/** Associated form */
|
|
991
|
+
form?: string;
|
|
992
|
+
/** @preset {Default} Primary appearance */
|
|
993
|
+
primary?: boolean;
|
|
994
|
+
/** @preset {Default} Secondary appearance */
|
|
995
|
+
secondary?: boolean;
|
|
996
|
+
/** @preset {Default} Inverted colors */
|
|
997
|
+
inverted?: boolean;
|
|
998
|
+
/** @preset {Brand} Base appearance */
|
|
999
|
+
base?: boolean;
|
|
1000
|
+
/** @preset {Brand} Clear appearance */
|
|
1001
|
+
clear?: boolean;
|
|
1002
|
+
/** @preset {Brand} Black colors appearance */
|
|
1003
|
+
black?: boolean;
|
|
1004
|
+
/** @preset {Brand} Red colors appearance */
|
|
1005
|
+
danger?: boolean;
|
|
1006
|
+
/** @preset {Brand} Modifies appearance on colored background */
|
|
1007
|
+
onColored?: boolean;
|
|
1008
|
+
/** @deprecated Use outline */
|
|
1009
|
+
basic?: boolean;
|
|
1010
|
+
/** @deprecated Use children */
|
|
1011
|
+
content?: React.ReactNode;
|
|
1012
|
+
/** @deprecated Use ref */
|
|
1013
|
+
innerRef?: React.LegacyRef<HTMLElement>;
|
|
1014
|
+
/** Component's children */
|
|
1015
|
+
children?: React.ReactNode | React.ReactNode[];
|
|
1016
|
+
onClick?: (evt: React.SyntheticEvent<HTMLElement>) => void;
|
|
1017
|
+
onClickCapture?: (evt: React.SyntheticEvent<HTMLElement>) => void;
|
|
1018
|
+
onMouseEnter?: (evt: React.SyntheticEvent<HTMLElement>) => void;
|
|
1019
|
+
onMouseLeave?: (evt: React.SyntheticEvent<HTMLElement>) => void;
|
|
1020
|
+
}
|
|
1021
|
+
|
|
1022
|
+
/**
|
|
1023
|
+
* Main button
|
|
1024
|
+
*/
|
|
1025
|
+
declare const Button: react.ForwardRefExoticComponent<ButtonProps & react.RefAttributes<HTMLElement>>;
|
|
1026
|
+
|
|
1148
1027
|
interface ContainerProps extends BaseProps, Display, Color {
|
|
1149
1028
|
/**
|
|
1150
1029
|
* Primary content
|
|
@@ -2522,4 +2401,4 @@ declare namespace Select {
|
|
|
2522
2401
|
var displayName: string;
|
|
2523
2402
|
}
|
|
2524
2403
|
|
|
2525
|
-
export { ActionBtn,
|
|
2404
|
+
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 };
|