@strapi/design-system 1.17.0-typescript.0 → 1.18.0-typescript.0
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/dist/Accordion/Accordion.d.ts +1 -1
- package/dist/Avatar/AvatarGroup.d.ts +1 -1
- package/dist/BaseButton/BaseButton.d.ts +26 -26
- package/dist/BaseLink/BaseLink.d.ts +26 -26
- package/dist/Button/Button.d.ts +26 -26
- package/dist/Field/FieldInput.d.ts +26 -26
- package/dist/Grid/GridItem.d.ts +26 -26
- package/dist/IconButton/IconButton.d.ts +1 -1
- package/dist/SimpleMenu/SimpleMenu.d.ts +1 -1
- package/dist/Tabs/TabGroup.d.ts +1 -0
- package/dist/Tabs/TabGroup.js +9 -3
- package/dist/Tabs/TabGroup.mjs +9 -3
- package/dist/Tabs/components.d.ts +53 -53
- package/dist/helpers/context.d.ts +1 -1
- package/dist/themes/utils.d.ts +3 -3
- package/dist/v2/LinkButton/LinkButton.d.ts +26 -26
- package/dist/v2/SimpleMenu/SimpleMenu.d.ts +26 -26
- package/package.json +5 -5
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { DefaultTheme } from 'styled-components';
|
|
3
|
-
declare const AccordionTypography: import("styled-components").StyledComponent<"span", DefaultTheme, import("
|
|
3
|
+
declare const AccordionTypography: import("styled-components").StyledComponent<"span", DefaultTheme, import("src/Typography/Typography").TypographyProps<"span">, never>;
|
|
4
4
|
type AccordionSize = 'S' | 'M';
|
|
5
5
|
type AccordionVariant = 'primary' | 'secondary';
|
|
6
6
|
interface AccordionProps {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const AvatarGroup: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, import("
|
|
1
|
+
export declare const AvatarGroup: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, import("src/Flex/Flex").FlexProps<"div">, never>;
|
|
@@ -2,40 +2,40 @@ import * as React from 'react';
|
|
|
2
2
|
import { FlexProps } from '../Flex';
|
|
3
3
|
export declare const BaseButtonWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, FlexProps<"div">, never>;
|
|
4
4
|
export type BaseButtonProps<TElement extends keyof JSX.IntrinsicElements = 'button'> = FlexProps<TElement>;
|
|
5
|
-
export declare const BaseButton: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & Pick<import("styled-components").CSSProperties, "cursor" | "display" | "
|
|
5
|
+
export declare const BaseButton: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & Pick<import("styled-components").CSSProperties, "cursor" | "display" | "overflow" | "pointerEvents" | "transform" | "position" | "textAlign" | "textTransform" | "zIndex" | "animation" | "transition"> & {
|
|
6
6
|
_hover?: ((theme: import("styled-components").DefaultTheme) => string) | undefined;
|
|
7
|
-
background?: import("
|
|
7
|
+
background?: import("src/types").DefaultThemeOrCSSProp<"colors", "background">;
|
|
8
8
|
basis?: import("csstype").Property.FlexBasis<string | number> | undefined;
|
|
9
|
-
borderColor?: keyof import("
|
|
10
|
-
color?: keyof import("
|
|
9
|
+
borderColor?: keyof import("src/themes/colors").Colors | undefined;
|
|
10
|
+
color?: keyof import("src/themes/colors").Colors | undefined;
|
|
11
11
|
flex?: import("csstype").Property.Flex<string | number> | undefined;
|
|
12
|
-
fontSize?: import("
|
|
12
|
+
fontSize?: import("src/types").DefaultThemeOrCSSProp<"fontSizes", "fontSize">;
|
|
13
13
|
grow?: import("csstype").Property.FlexGrow | undefined;
|
|
14
14
|
hasRadius?: boolean | undefined;
|
|
15
15
|
hiddenS?: boolean | undefined;
|
|
16
16
|
hiddenXS?: boolean | undefined;
|
|
17
|
-
padding?: import("
|
|
18
|
-
paddingBottom?: import("
|
|
19
|
-
paddingLeft?: import("
|
|
20
|
-
paddingRight?: import("
|
|
21
|
-
paddingTop?: import("
|
|
22
|
-
marginLeft?: import("
|
|
23
|
-
marginBottom?: import("
|
|
24
|
-
marginRight?: import("
|
|
25
|
-
marginTop?: import("
|
|
26
|
-
shadow?: keyof import("
|
|
17
|
+
padding?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"padding">;
|
|
18
|
+
paddingBottom?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"paddingBottom">;
|
|
19
|
+
paddingLeft?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"paddingLeft">;
|
|
20
|
+
paddingRight?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"paddingRight">;
|
|
21
|
+
paddingTop?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"paddingTop">;
|
|
22
|
+
marginLeft?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"marginLeft">;
|
|
23
|
+
marginBottom?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"marginBottom">;
|
|
24
|
+
marginRight?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"marginRight">;
|
|
25
|
+
marginTop?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"marginTop">;
|
|
26
|
+
shadow?: keyof import("src/themes/colors").Shadows | undefined;
|
|
27
27
|
shrink?: import("csstype").Property.FlexShrink | undefined;
|
|
28
|
-
lineHeight?: import("
|
|
29
|
-
width?: import("
|
|
30
|
-
minWidth?: import("
|
|
31
|
-
maxWidth?: import("
|
|
32
|
-
height?: import("
|
|
33
|
-
minHeight?: import("
|
|
34
|
-
maxHeight?: import("
|
|
35
|
-
top?: import("
|
|
36
|
-
left?: import("
|
|
37
|
-
bottom?: import("
|
|
38
|
-
right?: import("
|
|
28
|
+
lineHeight?: import("src/types").DefaultThemeOrCSSProp<"lineHeights", "lineHeight">;
|
|
29
|
+
width?: import("src/types").DefaultThemeOrCSSProp<"spaces", "width">;
|
|
30
|
+
minWidth?: import("src/types").DefaultThemeOrCSSProp<"spaces", "minWidth">;
|
|
31
|
+
maxWidth?: import("src/types").DefaultThemeOrCSSProp<"spaces", "maxWidth">;
|
|
32
|
+
height?: import("src/types").DefaultThemeOrCSSProp<"spaces", "height">;
|
|
33
|
+
minHeight?: import("src/types").DefaultThemeOrCSSProp<"spaces", "minHeight">;
|
|
34
|
+
maxHeight?: import("src/types").DefaultThemeOrCSSProp<"spaces", "maxHeight">;
|
|
35
|
+
top?: import("src/types").DefaultThemeOrCSSProp<"spaces", "top">;
|
|
36
|
+
left?: import("src/types").DefaultThemeOrCSSProp<"spaces", "left">;
|
|
37
|
+
bottom?: import("src/types").DefaultThemeOrCSSProp<"spaces", "bottom">;
|
|
38
|
+
right?: import("src/types").DefaultThemeOrCSSProp<"spaces", "right">;
|
|
39
39
|
borderRadius?: import("csstype").Property.BorderRadius<string | number> | undefined;
|
|
40
40
|
borderStyle?: import("csstype").Property.BorderStyle | undefined;
|
|
41
41
|
borderWidth?: import("csstype").Property.BorderWidth<string | number> | undefined;
|
|
@@ -4,40 +4,40 @@ export type BaseLinkProps = BoxProps<'a'> & {
|
|
|
4
4
|
disabled?: boolean;
|
|
5
5
|
isExternal?: boolean;
|
|
6
6
|
};
|
|
7
|
-
export declare const BaseLink: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref"> & Pick<import("styled-components").CSSProperties, "cursor" | "display" | "
|
|
7
|
+
export declare const BaseLink: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref"> & Pick<import("styled-components").CSSProperties, "cursor" | "display" | "overflow" | "pointerEvents" | "transform" | "position" | "textAlign" | "textTransform" | "zIndex" | "animation" | "transition"> & {
|
|
8
8
|
_hover?: ((theme: import("styled-components").DefaultTheme) => string) | undefined;
|
|
9
|
-
background?: import("
|
|
9
|
+
background?: import("src/types").DefaultThemeOrCSSProp<"colors", "background">;
|
|
10
10
|
basis?: import("csstype").Property.FlexBasis<string | number> | undefined;
|
|
11
|
-
borderColor?: keyof import("
|
|
12
|
-
color?: keyof import("
|
|
11
|
+
borderColor?: keyof import("src/themes/colors").Colors | undefined;
|
|
12
|
+
color?: keyof import("src/themes/colors").Colors | undefined;
|
|
13
13
|
flex?: import("csstype").Property.Flex<string | number> | undefined;
|
|
14
|
-
fontSize?: import("
|
|
14
|
+
fontSize?: import("src/types").DefaultThemeOrCSSProp<"fontSizes", "fontSize">;
|
|
15
15
|
grow?: import("csstype").Property.FlexGrow | undefined;
|
|
16
16
|
hasRadius?: boolean | undefined;
|
|
17
17
|
hiddenS?: boolean | undefined;
|
|
18
18
|
hiddenXS?: boolean | undefined;
|
|
19
|
-
padding?: import("
|
|
20
|
-
paddingBottom?: import("
|
|
21
|
-
paddingLeft?: import("
|
|
22
|
-
paddingRight?: import("
|
|
23
|
-
paddingTop?: import("
|
|
24
|
-
marginLeft?: import("
|
|
25
|
-
marginBottom?: import("
|
|
26
|
-
marginRight?: import("
|
|
27
|
-
marginTop?: import("
|
|
28
|
-
shadow?: keyof import("
|
|
19
|
+
padding?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"padding">;
|
|
20
|
+
paddingBottom?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"paddingBottom">;
|
|
21
|
+
paddingLeft?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"paddingLeft">;
|
|
22
|
+
paddingRight?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"paddingRight">;
|
|
23
|
+
paddingTop?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"paddingTop">;
|
|
24
|
+
marginLeft?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"marginLeft">;
|
|
25
|
+
marginBottom?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"marginBottom">;
|
|
26
|
+
marginRight?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"marginRight">;
|
|
27
|
+
marginTop?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"marginTop">;
|
|
28
|
+
shadow?: keyof import("src/themes/colors").Shadows | undefined;
|
|
29
29
|
shrink?: import("csstype").Property.FlexShrink | undefined;
|
|
30
|
-
lineHeight?: import("
|
|
31
|
-
width?: import("
|
|
32
|
-
minWidth?: import("
|
|
33
|
-
maxWidth?: import("
|
|
34
|
-
height?: import("
|
|
35
|
-
minHeight?: import("
|
|
36
|
-
maxHeight?: import("
|
|
37
|
-
top?: import("
|
|
38
|
-
left?: import("
|
|
39
|
-
bottom?: import("
|
|
40
|
-
right?: import("
|
|
30
|
+
lineHeight?: import("src/types").DefaultThemeOrCSSProp<"lineHeights", "lineHeight">;
|
|
31
|
+
width?: import("src/types").DefaultThemeOrCSSProp<"spaces", "width">;
|
|
32
|
+
minWidth?: import("src/types").DefaultThemeOrCSSProp<"spaces", "minWidth">;
|
|
33
|
+
maxWidth?: import("src/types").DefaultThemeOrCSSProp<"spaces", "maxWidth">;
|
|
34
|
+
height?: import("src/types").DefaultThemeOrCSSProp<"spaces", "height">;
|
|
35
|
+
minHeight?: import("src/types").DefaultThemeOrCSSProp<"spaces", "minHeight">;
|
|
36
|
+
maxHeight?: import("src/types").DefaultThemeOrCSSProp<"spaces", "maxHeight">;
|
|
37
|
+
top?: import("src/types").DefaultThemeOrCSSProp<"spaces", "top">;
|
|
38
|
+
left?: import("src/types").DefaultThemeOrCSSProp<"spaces", "left">;
|
|
39
|
+
bottom?: import("src/types").DefaultThemeOrCSSProp<"spaces", "bottom">;
|
|
40
|
+
right?: import("src/types").DefaultThemeOrCSSProp<"spaces", "right">;
|
|
41
41
|
borderRadius?: import("csstype").Property.BorderRadius<string | number> | undefined;
|
|
42
42
|
borderStyle?: import("csstype").Property.BorderStyle | undefined;
|
|
43
43
|
borderWidth?: import("csstype").Property.BorderWidth<string | number> | undefined;
|
package/dist/Button/Button.d.ts
CHANGED
|
@@ -1,40 +1,40 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { Variant, ButtonSizes } from './constants';
|
|
3
3
|
import { BaseButtonProps } from '../BaseButton';
|
|
4
|
-
export declare const ButtonWrapper: import("styled-components").StyledComponent<React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & Pick<import("styled-components").CSSProperties, "cursor" | "display" | "
|
|
4
|
+
export declare const ButtonWrapper: import("styled-components").StyledComponent<React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & Pick<import("styled-components").CSSProperties, "cursor" | "display" | "overflow" | "pointerEvents" | "transform" | "position" | "textAlign" | "textTransform" | "zIndex" | "animation" | "transition"> & {
|
|
5
5
|
_hover?: ((theme: import("styled-components").DefaultTheme) => string) | undefined;
|
|
6
|
-
background?: import("
|
|
6
|
+
background?: import("src/types").DefaultThemeOrCSSProp<"colors", "background">;
|
|
7
7
|
basis?: import("csstype").Property.FlexBasis<string | number> | undefined;
|
|
8
|
-
borderColor?: keyof import("
|
|
9
|
-
color?: keyof import("
|
|
8
|
+
borderColor?: keyof import("src/themes/colors").Colors | undefined;
|
|
9
|
+
color?: keyof import("src/themes/colors").Colors | undefined;
|
|
10
10
|
flex?: import("csstype").Property.Flex<string | number> | undefined;
|
|
11
|
-
fontSize?: import("
|
|
11
|
+
fontSize?: import("src/types").DefaultThemeOrCSSProp<"fontSizes", "fontSize">;
|
|
12
12
|
grow?: import("csstype").Property.FlexGrow | undefined;
|
|
13
13
|
hasRadius?: boolean | undefined;
|
|
14
14
|
hiddenS?: boolean | undefined;
|
|
15
15
|
hiddenXS?: boolean | undefined;
|
|
16
|
-
padding?: import("
|
|
17
|
-
paddingBottom?: import("
|
|
18
|
-
paddingLeft?: import("
|
|
19
|
-
paddingRight?: import("
|
|
20
|
-
paddingTop?: import("
|
|
21
|
-
marginLeft?: import("
|
|
22
|
-
marginBottom?: import("
|
|
23
|
-
marginRight?: import("
|
|
24
|
-
marginTop?: import("
|
|
25
|
-
shadow?: keyof import("
|
|
16
|
+
padding?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"padding">;
|
|
17
|
+
paddingBottom?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"paddingBottom">;
|
|
18
|
+
paddingLeft?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"paddingLeft">;
|
|
19
|
+
paddingRight?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"paddingRight">;
|
|
20
|
+
paddingTop?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"paddingTop">;
|
|
21
|
+
marginLeft?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"marginLeft">;
|
|
22
|
+
marginBottom?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"marginBottom">;
|
|
23
|
+
marginRight?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"marginRight">;
|
|
24
|
+
marginTop?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"marginTop">;
|
|
25
|
+
shadow?: keyof import("src/themes/colors").Shadows | undefined;
|
|
26
26
|
shrink?: import("csstype").Property.FlexShrink | undefined;
|
|
27
|
-
lineHeight?: import("
|
|
28
|
-
width?: import("
|
|
29
|
-
minWidth?: import("
|
|
30
|
-
maxWidth?: import("
|
|
31
|
-
height?: import("
|
|
32
|
-
minHeight?: import("
|
|
33
|
-
maxHeight?: import("
|
|
34
|
-
top?: import("
|
|
35
|
-
left?: import("
|
|
36
|
-
bottom?: import("
|
|
37
|
-
right?: import("
|
|
27
|
+
lineHeight?: import("src/types").DefaultThemeOrCSSProp<"lineHeights", "lineHeight">;
|
|
28
|
+
width?: import("src/types").DefaultThemeOrCSSProp<"spaces", "width">;
|
|
29
|
+
minWidth?: import("src/types").DefaultThemeOrCSSProp<"spaces", "minWidth">;
|
|
30
|
+
maxWidth?: import("src/types").DefaultThemeOrCSSProp<"spaces", "maxWidth">;
|
|
31
|
+
height?: import("src/types").DefaultThemeOrCSSProp<"spaces", "height">;
|
|
32
|
+
minHeight?: import("src/types").DefaultThemeOrCSSProp<"spaces", "minHeight">;
|
|
33
|
+
maxHeight?: import("src/types").DefaultThemeOrCSSProp<"spaces", "maxHeight">;
|
|
34
|
+
top?: import("src/types").DefaultThemeOrCSSProp<"spaces", "top">;
|
|
35
|
+
left?: import("src/types").DefaultThemeOrCSSProp<"spaces", "left">;
|
|
36
|
+
bottom?: import("src/types").DefaultThemeOrCSSProp<"spaces", "bottom">;
|
|
37
|
+
right?: import("src/types").DefaultThemeOrCSSProp<"spaces", "right">;
|
|
38
38
|
borderRadius?: import("csstype").Property.BorderRadius<string | number> | undefined;
|
|
39
39
|
borderStyle?: import("csstype").Property.BorderStyle | undefined;
|
|
40
40
|
borderWidth?: import("csstype").Property.BorderWidth<string | number> | undefined;
|
|
@@ -8,40 +8,40 @@ export interface FieldInputProps extends Omit<React.InputHTMLAttributes<HTMLInpu
|
|
|
8
8
|
onChange?: ChangeEventHandler<HTMLInputElement>;
|
|
9
9
|
}
|
|
10
10
|
export declare const FieldInput: import("react").ForwardRefExoticComponent<FieldInputProps & import("react").RefAttributes<HTMLInputElement>>;
|
|
11
|
-
export declare const InputWrapper: import("styled-components").StyledComponent<"div", DefaultTheme, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & Pick<import("styled-components").CSSProperties, "cursor" | "display" | "
|
|
11
|
+
export declare const InputWrapper: import("styled-components").StyledComponent<"div", DefaultTheme, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & Pick<import("styled-components").CSSProperties, "cursor" | "display" | "overflow" | "pointerEvents" | "transform" | "position" | "textAlign" | "textTransform" | "zIndex" | "animation" | "transition"> & {
|
|
12
12
|
_hover?: ((theme: DefaultTheme) => string) | undefined;
|
|
13
|
-
background?: import("
|
|
13
|
+
background?: import("src/types").DefaultThemeOrCSSProp<"colors", "background">;
|
|
14
14
|
basis?: import("csstype").Property.FlexBasis<string | number> | undefined;
|
|
15
|
-
borderColor?: keyof import("
|
|
16
|
-
color?: keyof import("
|
|
15
|
+
borderColor?: keyof import("src/themes/colors").Colors | undefined;
|
|
16
|
+
color?: keyof import("src/themes/colors").Colors | undefined;
|
|
17
17
|
flex?: import("csstype").Property.Flex<string | number> | undefined;
|
|
18
|
-
fontSize?: import("
|
|
18
|
+
fontSize?: import("src/types").DefaultThemeOrCSSProp<"fontSizes", "fontSize">;
|
|
19
19
|
grow?: import("csstype").Property.FlexGrow | undefined;
|
|
20
20
|
hasRadius?: boolean | undefined;
|
|
21
21
|
hiddenS?: boolean | undefined;
|
|
22
22
|
hiddenXS?: boolean | undefined;
|
|
23
|
-
padding?: import("
|
|
24
|
-
paddingBottom?: import("
|
|
25
|
-
paddingLeft?: import("
|
|
26
|
-
paddingRight?: import("
|
|
27
|
-
paddingTop?: import("
|
|
28
|
-
marginLeft?: import("
|
|
29
|
-
marginBottom?: import("
|
|
30
|
-
marginRight?: import("
|
|
31
|
-
marginTop?: import("
|
|
32
|
-
shadow?: keyof import("
|
|
23
|
+
padding?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"padding">;
|
|
24
|
+
paddingBottom?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"paddingBottom">;
|
|
25
|
+
paddingLeft?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"paddingLeft">;
|
|
26
|
+
paddingRight?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"paddingRight">;
|
|
27
|
+
paddingTop?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"paddingTop">;
|
|
28
|
+
marginLeft?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"marginLeft">;
|
|
29
|
+
marginBottom?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"marginBottom">;
|
|
30
|
+
marginRight?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"marginRight">;
|
|
31
|
+
marginTop?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"marginTop">;
|
|
32
|
+
shadow?: keyof import("src/themes/colors").Shadows | undefined;
|
|
33
33
|
shrink?: import("csstype").Property.FlexShrink | undefined;
|
|
34
|
-
lineHeight?: import("
|
|
35
|
-
width?: import("
|
|
36
|
-
minWidth?: import("
|
|
37
|
-
maxWidth?: import("
|
|
38
|
-
height?: import("
|
|
39
|
-
minHeight?: import("
|
|
40
|
-
maxHeight?: import("
|
|
41
|
-
top?: import("
|
|
42
|
-
left?: import("
|
|
43
|
-
bottom?: import("
|
|
44
|
-
right?: import("
|
|
34
|
+
lineHeight?: import("src/types").DefaultThemeOrCSSProp<"lineHeights", "lineHeight">;
|
|
35
|
+
width?: import("src/types").DefaultThemeOrCSSProp<"spaces", "width">;
|
|
36
|
+
minWidth?: import("src/types").DefaultThemeOrCSSProp<"spaces", "minWidth">;
|
|
37
|
+
maxWidth?: import("src/types").DefaultThemeOrCSSProp<"spaces", "maxWidth">;
|
|
38
|
+
height?: import("src/types").DefaultThemeOrCSSProp<"spaces", "height">;
|
|
39
|
+
minHeight?: import("src/types").DefaultThemeOrCSSProp<"spaces", "minHeight">;
|
|
40
|
+
maxHeight?: import("src/types").DefaultThemeOrCSSProp<"spaces", "maxHeight">;
|
|
41
|
+
top?: import("src/types").DefaultThemeOrCSSProp<"spaces", "top">;
|
|
42
|
+
left?: import("src/types").DefaultThemeOrCSSProp<"spaces", "left">;
|
|
43
|
+
bottom?: import("src/types").DefaultThemeOrCSSProp<"spaces", "bottom">;
|
|
44
|
+
right?: import("src/types").DefaultThemeOrCSSProp<"spaces", "right">;
|
|
45
45
|
borderRadius?: import("csstype").Property.BorderRadius<string | number> | undefined;
|
|
46
46
|
borderStyle?: import("csstype").Property.BorderStyle | undefined;
|
|
47
47
|
borderWidth?: import("csstype").Property.BorderWidth<string | number> | undefined;
|
package/dist/Grid/GridItem.d.ts
CHANGED
|
@@ -4,40 +4,40 @@ export interface GridItemProps extends BoxProps {
|
|
|
4
4
|
s?: number;
|
|
5
5
|
xs?: number;
|
|
6
6
|
}
|
|
7
|
-
export declare const GridItem: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & Pick<import("styled-components").CSSProperties, "cursor" | "display" | "
|
|
7
|
+
export declare const GridItem: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & Pick<import("styled-components").CSSProperties, "cursor" | "display" | "overflow" | "pointerEvents" | "transform" | "position" | "textAlign" | "textTransform" | "zIndex" | "animation" | "transition"> & {
|
|
8
8
|
_hover?: ((theme: import("styled-components").DefaultTheme) => string) | undefined;
|
|
9
|
-
background?: import("
|
|
9
|
+
background?: import("src/types").DefaultThemeOrCSSProp<"colors", "background">;
|
|
10
10
|
basis?: import("csstype").Property.FlexBasis<string | number> | undefined;
|
|
11
|
-
borderColor?: keyof import("
|
|
12
|
-
color?: keyof import("
|
|
11
|
+
borderColor?: keyof import("src/themes/colors").Colors | undefined;
|
|
12
|
+
color?: keyof import("src/themes/colors").Colors | undefined;
|
|
13
13
|
flex?: import("csstype").Property.Flex<string | number> | undefined;
|
|
14
|
-
fontSize?: import("
|
|
14
|
+
fontSize?: import("src/types").DefaultThemeOrCSSProp<"fontSizes", "fontSize">;
|
|
15
15
|
grow?: import("csstype").Property.FlexGrow | undefined;
|
|
16
16
|
hasRadius?: boolean | undefined;
|
|
17
17
|
hiddenS?: boolean | undefined;
|
|
18
18
|
hiddenXS?: boolean | undefined;
|
|
19
|
-
padding?: import("
|
|
20
|
-
paddingBottom?: import("
|
|
21
|
-
paddingLeft?: import("
|
|
22
|
-
paddingRight?: import("
|
|
23
|
-
paddingTop?: import("
|
|
24
|
-
marginLeft?: import("
|
|
25
|
-
marginBottom?: import("
|
|
26
|
-
marginRight?: import("
|
|
27
|
-
marginTop?: import("
|
|
28
|
-
shadow?: keyof import("
|
|
19
|
+
padding?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"padding">;
|
|
20
|
+
paddingBottom?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"paddingBottom">;
|
|
21
|
+
paddingLeft?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"paddingLeft">;
|
|
22
|
+
paddingRight?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"paddingRight">;
|
|
23
|
+
paddingTop?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"paddingTop">;
|
|
24
|
+
marginLeft?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"marginLeft">;
|
|
25
|
+
marginBottom?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"marginBottom">;
|
|
26
|
+
marginRight?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"marginRight">;
|
|
27
|
+
marginTop?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"marginTop">;
|
|
28
|
+
shadow?: keyof import("src/themes/colors").Shadows | undefined;
|
|
29
29
|
shrink?: import("csstype").Property.FlexShrink | undefined;
|
|
30
|
-
lineHeight?: import("
|
|
31
|
-
width?: import("
|
|
32
|
-
minWidth?: import("
|
|
33
|
-
maxWidth?: import("
|
|
34
|
-
height?: import("
|
|
35
|
-
minHeight?: import("
|
|
36
|
-
maxHeight?: import("
|
|
37
|
-
top?: import("
|
|
38
|
-
left?: import("
|
|
39
|
-
bottom?: import("
|
|
40
|
-
right?: import("
|
|
30
|
+
lineHeight?: import("src/types").DefaultThemeOrCSSProp<"lineHeights", "lineHeight">;
|
|
31
|
+
width?: import("src/types").DefaultThemeOrCSSProp<"spaces", "width">;
|
|
32
|
+
minWidth?: import("src/types").DefaultThemeOrCSSProp<"spaces", "minWidth">;
|
|
33
|
+
maxWidth?: import("src/types").DefaultThemeOrCSSProp<"spaces", "maxWidth">;
|
|
34
|
+
height?: import("src/types").DefaultThemeOrCSSProp<"spaces", "height">;
|
|
35
|
+
minHeight?: import("src/types").DefaultThemeOrCSSProp<"spaces", "minHeight">;
|
|
36
|
+
maxHeight?: import("src/types").DefaultThemeOrCSSProp<"spaces", "maxHeight">;
|
|
37
|
+
top?: import("src/types").DefaultThemeOrCSSProp<"spaces", "top">;
|
|
38
|
+
left?: import("src/types").DefaultThemeOrCSSProp<"spaces", "left">;
|
|
39
|
+
bottom?: import("src/types").DefaultThemeOrCSSProp<"spaces", "bottom">;
|
|
40
|
+
right?: import("src/types").DefaultThemeOrCSSProp<"spaces", "right">;
|
|
41
41
|
borderRadius?: import("csstype").Property.BorderRadius<string | number> | undefined;
|
|
42
42
|
borderStyle?: import("csstype").Property.BorderStyle | undefined;
|
|
43
43
|
borderWidth?: import("csstype").Property.BorderWidth<string | number> | undefined;
|
|
@@ -37,5 +37,5 @@ type IconWithLabel = LabelOnlyProps & IconOnlyProps;
|
|
|
37
37
|
type IconWithAriaLabel = AriaLabelOnlyProps & IconOnlyProps;
|
|
38
38
|
export type IconButtonProps = ChildrenWithLabel | ChildrenWithAriaLabel | IconWithLabel | IconWithAriaLabel;
|
|
39
39
|
export declare const IconButton: React.ForwardRefExoticComponent<IconButtonProps & React.RefAttributes<HTMLButtonElement>>;
|
|
40
|
-
export declare const IconButtonGroup: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, import("
|
|
40
|
+
export declare const IconButtonGroup: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, import("src/Flex/Flex").FlexProps<"div">, never>;
|
|
41
41
|
export {};
|
|
@@ -30,4 +30,4 @@ export type SimpleMenuProps<As extends React.ElementType = React.ElementType> =
|
|
|
30
30
|
*/
|
|
31
31
|
size?: 'S' | 'M';
|
|
32
32
|
};
|
|
33
|
-
export declare const SimpleMenu: <As extends React.ElementType<any, keyof React.JSX.IntrinsicElements> = React.ForwardRefExoticComponent<import("
|
|
33
|
+
export declare const SimpleMenu: <As extends React.ElementType<any, keyof React.JSX.IntrinsicElements> = React.ForwardRefExoticComponent<import("src/Button/Button").ButtonProps & React.RefAttributes<HTMLButtonElement>>>({ label, children, id, as: asComp, onOpen, onClose, size, popoverPlacement, onReachEnd, ...props }: SimpleMenuProps<As>) => import("react/jsx-runtime").JSX.Element;
|
package/dist/Tabs/TabGroup.d.ts
CHANGED
|
@@ -3,6 +3,7 @@ import { type TabsContextState } from './TabsContext';
|
|
|
3
3
|
export interface TabGroupProps extends Omit<TabsContextState, 'id' | 'selectedTabIndex' | 'selectTabIndex'>, React.HTMLAttributes<HTMLDivElement> {
|
|
4
4
|
children: React.ReactNode;
|
|
5
5
|
id?: string;
|
|
6
|
+
selectedTabIndex?: number;
|
|
6
7
|
initialSelectedTabIndex?: number;
|
|
7
8
|
}
|
|
8
9
|
export type SetSelectedTabIndexHandler = (tabIndex: number) => void;
|
package/dist/Tabs/TabGroup.js
CHANGED
|
@@ -5,6 +5,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
|
5
5
|
const jsxRuntime = require('react/jsx-runtime');
|
|
6
6
|
const React = require('react');
|
|
7
7
|
const TabsContext = require('./TabsContext.js');
|
|
8
|
+
const useControllableState = require('../hooks/useControllableState.js');
|
|
8
9
|
const useId = require('../hooks/useId.js');
|
|
9
10
|
|
|
10
11
|
function _interopNamespace(e) {
|
|
@@ -27,13 +28,18 @@ function _interopNamespace(e) {
|
|
|
27
28
|
|
|
28
29
|
const React__namespace = /*#__PURE__*/_interopNamespace(React);
|
|
29
30
|
|
|
30
|
-
const TabGroup = React__namespace.forwardRef(({ id, initialSelectedTabIndex
|
|
31
|
+
const TabGroup = React__namespace.forwardRef(({ id, initialSelectedTabIndex, label, onTabChange, selectedTabIndex: selectedTabIndexProp, variant, ...props }, ref) => {
|
|
31
32
|
const tabsId = useId.useId(id);
|
|
32
|
-
const [selectedTabIndex, setSelectedTabIndex] =
|
|
33
|
+
const [selectedTabIndex = 0, setSelectedTabIndex] = useControllableState.useControllableState({
|
|
34
|
+
prop: selectedTabIndexProp,
|
|
35
|
+
defaultProp: initialSelectedTabIndex,
|
|
36
|
+
// @ts-expect-error
|
|
37
|
+
onChange: onTabChange,
|
|
38
|
+
});
|
|
33
39
|
React__namespace.useImperativeHandle(ref, () => ({
|
|
34
40
|
_handlers: { setSelectedTabIndex },
|
|
35
41
|
}));
|
|
36
|
-
const context = React__namespace.useMemo(() => ({ id: tabsId, selectedTabIndex, selectTabIndex: setSelectedTabIndex, label, variant, onTabChange }), [label, onTabChange, selectedTabIndex, tabsId, variant]);
|
|
42
|
+
const context = React__namespace.useMemo(() => ({ id: tabsId, selectedTabIndex, selectTabIndex: setSelectedTabIndex, label, variant, onTabChange }), [label, onTabChange, selectedTabIndex, tabsId, variant, setSelectedTabIndex]);
|
|
37
43
|
return (jsxRuntime.jsx(TabsContext.TabsContext.Provider, { value: context, children: jsxRuntime.jsx("div", { ...props }) }));
|
|
38
44
|
});
|
|
39
45
|
TabGroup.displayName = 'TabGroup';
|
package/dist/Tabs/TabGroup.mjs
CHANGED
|
@@ -1,15 +1,21 @@
|
|
|
1
1
|
import { jsx } from 'react/jsx-runtime';
|
|
2
2
|
import * as React from 'react';
|
|
3
3
|
import { TabsContext } from './TabsContext.mjs';
|
|
4
|
+
import { useControllableState } from '../hooks/useControllableState.mjs';
|
|
4
5
|
import { useId } from '../hooks/useId.mjs';
|
|
5
6
|
|
|
6
|
-
const TabGroup = React.forwardRef(({ id, initialSelectedTabIndex
|
|
7
|
+
const TabGroup = React.forwardRef(({ id, initialSelectedTabIndex, label, onTabChange, selectedTabIndex: selectedTabIndexProp, variant, ...props }, ref) => {
|
|
7
8
|
const tabsId = useId(id);
|
|
8
|
-
const [selectedTabIndex, setSelectedTabIndex] =
|
|
9
|
+
const [selectedTabIndex = 0, setSelectedTabIndex] = useControllableState({
|
|
10
|
+
prop: selectedTabIndexProp,
|
|
11
|
+
defaultProp: initialSelectedTabIndex,
|
|
12
|
+
// @ts-expect-error
|
|
13
|
+
onChange: onTabChange,
|
|
14
|
+
});
|
|
9
15
|
React.useImperativeHandle(ref, () => ({
|
|
10
16
|
_handlers: { setSelectedTabIndex },
|
|
11
17
|
}));
|
|
12
|
-
const context = React.useMemo(() => ({ id: tabsId, selectedTabIndex, selectTabIndex: setSelectedTabIndex, label, variant, onTabChange }), [label, onTabChange, selectedTabIndex, tabsId, variant]);
|
|
18
|
+
const context = React.useMemo(() => ({ id: tabsId, selectedTabIndex, selectTabIndex: setSelectedTabIndex, label, variant, onTabChange }), [label, onTabChange, selectedTabIndex, tabsId, variant, setSelectedTabIndex]);
|
|
13
19
|
return (jsx(TabsContext.Provider, { value: context, children: jsx("div", { ...props }) }));
|
|
14
20
|
});
|
|
15
21
|
TabGroup.displayName = 'TabGroup';
|
|
@@ -1,38 +1,38 @@
|
|
|
1
1
|
/** Simple variant */
|
|
2
|
-
export declare const SimpleTabBox: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & Pick<import("styled-components").CSSProperties, "cursor" | "display" | "
|
|
2
|
+
export declare const SimpleTabBox: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & Pick<import("styled-components").CSSProperties, "cursor" | "display" | "overflow" | "pointerEvents" | "transform" | "position" | "textAlign" | "textTransform" | "zIndex" | "animation" | "transition"> & {
|
|
3
3
|
_hover?: ((theme: import("styled-components").DefaultTheme) => string) | undefined;
|
|
4
|
-
background?: import("
|
|
4
|
+
background?: import("src/types").DefaultThemeOrCSSProp<"colors", "background">;
|
|
5
5
|
basis?: import("csstype").Property.FlexBasis<string | number> | undefined;
|
|
6
|
-
borderColor?: keyof import("
|
|
7
|
-
color?: keyof import("
|
|
6
|
+
borderColor?: keyof import("src/themes/colors").Colors | undefined;
|
|
7
|
+
color?: keyof import("src/themes/colors").Colors | undefined;
|
|
8
8
|
flex?: import("csstype").Property.Flex<string | number> | undefined;
|
|
9
|
-
fontSize?: import("
|
|
9
|
+
fontSize?: import("src/types").DefaultThemeOrCSSProp<"fontSizes", "fontSize">;
|
|
10
10
|
grow?: import("csstype").Property.FlexGrow | undefined;
|
|
11
11
|
hasRadius?: boolean | undefined;
|
|
12
12
|
hiddenS?: boolean | undefined;
|
|
13
13
|
hiddenXS?: boolean | undefined;
|
|
14
|
-
padding?: import("
|
|
15
|
-
paddingBottom?: import("
|
|
16
|
-
paddingLeft?: import("
|
|
17
|
-
paddingRight?: import("
|
|
18
|
-
paddingTop?: import("
|
|
19
|
-
marginLeft?: import("
|
|
20
|
-
marginBottom?: import("
|
|
21
|
-
marginRight?: import("
|
|
22
|
-
marginTop?: import("
|
|
23
|
-
shadow?: keyof import("
|
|
14
|
+
padding?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"padding">;
|
|
15
|
+
paddingBottom?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"paddingBottom">;
|
|
16
|
+
paddingLeft?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"paddingLeft">;
|
|
17
|
+
paddingRight?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"paddingRight">;
|
|
18
|
+
paddingTop?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"paddingTop">;
|
|
19
|
+
marginLeft?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"marginLeft">;
|
|
20
|
+
marginBottom?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"marginBottom">;
|
|
21
|
+
marginRight?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"marginRight">;
|
|
22
|
+
marginTop?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"marginTop">;
|
|
23
|
+
shadow?: keyof import("src/themes/colors").Shadows | undefined;
|
|
24
24
|
shrink?: import("csstype").Property.FlexShrink | undefined;
|
|
25
|
-
lineHeight?: import("
|
|
26
|
-
width?: import("
|
|
27
|
-
minWidth?: import("
|
|
28
|
-
maxWidth?: import("
|
|
29
|
-
height?: import("
|
|
30
|
-
minHeight?: import("
|
|
31
|
-
maxHeight?: import("
|
|
32
|
-
top?: import("
|
|
33
|
-
left?: import("
|
|
34
|
-
bottom?: import("
|
|
35
|
-
right?: import("
|
|
25
|
+
lineHeight?: import("src/types").DefaultThemeOrCSSProp<"lineHeights", "lineHeight">;
|
|
26
|
+
width?: import("src/types").DefaultThemeOrCSSProp<"spaces", "width">;
|
|
27
|
+
minWidth?: import("src/types").DefaultThemeOrCSSProp<"spaces", "minWidth">;
|
|
28
|
+
maxWidth?: import("src/types").DefaultThemeOrCSSProp<"spaces", "maxWidth">;
|
|
29
|
+
height?: import("src/types").DefaultThemeOrCSSProp<"spaces", "height">;
|
|
30
|
+
minHeight?: import("src/types").DefaultThemeOrCSSProp<"spaces", "minHeight">;
|
|
31
|
+
maxHeight?: import("src/types").DefaultThemeOrCSSProp<"spaces", "maxHeight">;
|
|
32
|
+
top?: import("src/types").DefaultThemeOrCSSProp<"spaces", "top">;
|
|
33
|
+
left?: import("src/types").DefaultThemeOrCSSProp<"spaces", "left">;
|
|
34
|
+
bottom?: import("src/types").DefaultThemeOrCSSProp<"spaces", "bottom">;
|
|
35
|
+
right?: import("src/types").DefaultThemeOrCSSProp<"spaces", "right">;
|
|
36
36
|
borderRadius?: import("csstype").Property.BorderRadius<string | number> | undefined;
|
|
37
37
|
borderStyle?: import("csstype").Property.BorderStyle | undefined;
|
|
38
38
|
borderWidth?: import("csstype").Property.BorderWidth<string | number> | undefined;
|
|
@@ -44,40 +44,40 @@ export declare const SimpleTabBox: import("styled-components").StyledComponent<"
|
|
|
44
44
|
hasError?: boolean | undefined;
|
|
45
45
|
}, never>;
|
|
46
46
|
/** Default variant */
|
|
47
|
-
export declare const DefaultTabBox: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & Pick<import("styled-components").CSSProperties, "cursor" | "display" | "
|
|
47
|
+
export declare const DefaultTabBox: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & Pick<import("styled-components").CSSProperties, "cursor" | "display" | "overflow" | "pointerEvents" | "transform" | "position" | "textAlign" | "textTransform" | "zIndex" | "animation" | "transition"> & {
|
|
48
48
|
_hover?: ((theme: import("styled-components").DefaultTheme) => string) | undefined;
|
|
49
|
-
background?: import("
|
|
49
|
+
background?: import("src/types").DefaultThemeOrCSSProp<"colors", "background">;
|
|
50
50
|
basis?: import("csstype").Property.FlexBasis<string | number> | undefined;
|
|
51
|
-
borderColor?: keyof import("
|
|
52
|
-
color?: keyof import("
|
|
51
|
+
borderColor?: keyof import("src/themes/colors").Colors | undefined;
|
|
52
|
+
color?: keyof import("src/themes/colors").Colors | undefined;
|
|
53
53
|
flex?: import("csstype").Property.Flex<string | number> | undefined;
|
|
54
|
-
fontSize?: import("
|
|
54
|
+
fontSize?: import("src/types").DefaultThemeOrCSSProp<"fontSizes", "fontSize">;
|
|
55
55
|
grow?: import("csstype").Property.FlexGrow | undefined;
|
|
56
56
|
hasRadius?: boolean | undefined;
|
|
57
57
|
hiddenS?: boolean | undefined;
|
|
58
58
|
hiddenXS?: boolean | undefined;
|
|
59
|
-
padding?: import("
|
|
60
|
-
paddingBottom?: import("
|
|
61
|
-
paddingLeft?: import("
|
|
62
|
-
paddingRight?: import("
|
|
63
|
-
paddingTop?: import("
|
|
64
|
-
marginLeft?: import("
|
|
65
|
-
marginBottom?: import("
|
|
66
|
-
marginRight?: import("
|
|
67
|
-
marginTop?: import("
|
|
68
|
-
shadow?: keyof import("
|
|
59
|
+
padding?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"padding">;
|
|
60
|
+
paddingBottom?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"paddingBottom">;
|
|
61
|
+
paddingLeft?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"paddingLeft">;
|
|
62
|
+
paddingRight?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"paddingRight">;
|
|
63
|
+
paddingTop?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"paddingTop">;
|
|
64
|
+
marginLeft?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"marginLeft">;
|
|
65
|
+
marginBottom?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"marginBottom">;
|
|
66
|
+
marginRight?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"marginRight">;
|
|
67
|
+
marginTop?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"marginTop">;
|
|
68
|
+
shadow?: keyof import("src/themes/colors").Shadows | undefined;
|
|
69
69
|
shrink?: import("csstype").Property.FlexShrink | undefined;
|
|
70
|
-
lineHeight?: import("
|
|
71
|
-
width?: import("
|
|
72
|
-
minWidth?: import("
|
|
73
|
-
maxWidth?: import("
|
|
74
|
-
height?: import("
|
|
75
|
-
minHeight?: import("
|
|
76
|
-
maxHeight?: import("
|
|
77
|
-
top?: import("
|
|
78
|
-
left?: import("
|
|
79
|
-
bottom?: import("
|
|
80
|
-
right?: import("
|
|
70
|
+
lineHeight?: import("src/types").DefaultThemeOrCSSProp<"lineHeights", "lineHeight">;
|
|
71
|
+
width?: import("src/types").DefaultThemeOrCSSProp<"spaces", "width">;
|
|
72
|
+
minWidth?: import("src/types").DefaultThemeOrCSSProp<"spaces", "minWidth">;
|
|
73
|
+
maxWidth?: import("src/types").DefaultThemeOrCSSProp<"spaces", "maxWidth">;
|
|
74
|
+
height?: import("src/types").DefaultThemeOrCSSProp<"spaces", "height">;
|
|
75
|
+
minHeight?: import("src/types").DefaultThemeOrCSSProp<"spaces", "minHeight">;
|
|
76
|
+
maxHeight?: import("src/types").DefaultThemeOrCSSProp<"spaces", "maxHeight">;
|
|
77
|
+
top?: import("src/types").DefaultThemeOrCSSProp<"spaces", "top">;
|
|
78
|
+
left?: import("src/types").DefaultThemeOrCSSProp<"spaces", "left">;
|
|
79
|
+
bottom?: import("src/types").DefaultThemeOrCSSProp<"spaces", "bottom">;
|
|
80
|
+
right?: import("src/types").DefaultThemeOrCSSProp<"spaces", "right">;
|
|
81
81
|
borderRadius?: import("csstype").Property.BorderRadius<string | number> | undefined;
|
|
82
82
|
borderStyle?: import("csstype").Property.BorderStyle | undefined;
|
|
83
83
|
borderWidth?: import("csstype").Property.BorderWidth<string | number> | undefined;
|
|
@@ -91,4 +91,4 @@ export declare const DefaultTabButton: import("styled-components").StyledCompone
|
|
|
91
91
|
selected?: boolean | undefined;
|
|
92
92
|
showRightBorder?: boolean | undefined;
|
|
93
93
|
}, never>;
|
|
94
|
-
export declare const DefaultTabsRow: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, import("
|
|
94
|
+
export declare const DefaultTabsRow: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, import("src/Flex/Flex").FlexProps<"div">, never>;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
export declare const createContext: <ContextValueType extends object | null>(rootComponentName: string, defaultContext?: ContextValueType
|
|
2
|
+
export declare const createContext: <ContextValueType extends object | null>(rootComponentName: string, defaultContext?: ContextValueType) => readonly [{
|
|
3
3
|
(props: ContextValueType & {
|
|
4
4
|
children: React.ReactNode;
|
|
5
5
|
}): import("react/jsx-runtime").JSX.Element;
|
package/dist/themes/utils.d.ts
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { DefaultTheme } from 'styled-components';
|
|
2
|
-
export declare const getThemeSize: <TType extends keyof import("
|
|
2
|
+
export declare const getThemeSize: <TType extends keyof import("src/themes/sizes").Sizes>(type: TType) => ({ theme, size }: {
|
|
3
3
|
theme: DefaultTheme;
|
|
4
|
-
size: keyof
|
|
5
|
-
}) => import("
|
|
4
|
+
size: keyof DefaultTheme['sizes'][TType];
|
|
5
|
+
}) => import("src/themes/sizes").Sizes[TType][keyof import("src/themes/sizes").Sizes[TType]];
|
|
6
6
|
export declare const inputFocusStyle: (rootElement?: string) => ({ theme, hasError }: {
|
|
7
7
|
theme: DefaultTheme;
|
|
8
8
|
hasError?: boolean | undefined;
|
|
@@ -10,40 +10,40 @@ interface SharedLinkProps extends BaseLinkProps {
|
|
|
10
10
|
variant?: (typeof VARIANTS)[number];
|
|
11
11
|
}
|
|
12
12
|
export type LinkButtonProps = SharedLinkProps & BaseButtonProps;
|
|
13
|
-
export declare const LinkButton: React.ForwardRefExoticComponent<SharedLinkProps & Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & Pick<import("styled-components").CSSProperties, "cursor" | "display" | "
|
|
13
|
+
export declare const LinkButton: React.ForwardRefExoticComponent<SharedLinkProps & Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & Pick<import("styled-components").CSSProperties, "cursor" | "display" | "overflow" | "pointerEvents" | "transform" | "position" | "textAlign" | "textTransform" | "zIndex" | "animation" | "transition"> & {
|
|
14
14
|
_hover?: ((theme: import("styled-components").DefaultTheme) => string) | undefined;
|
|
15
|
-
background?: import("
|
|
15
|
+
background?: import("src/types").DefaultThemeOrCSSProp<"colors", "background">;
|
|
16
16
|
basis?: import("csstype").Property.FlexBasis<string | number> | undefined;
|
|
17
|
-
borderColor?: keyof import("
|
|
18
|
-
color?: keyof import("
|
|
17
|
+
borderColor?: keyof import("src/themes/colors").Colors | undefined;
|
|
18
|
+
color?: keyof import("src/themes/colors").Colors | undefined;
|
|
19
19
|
flex?: import("csstype").Property.Flex<string | number> | undefined;
|
|
20
|
-
fontSize?: import("
|
|
20
|
+
fontSize?: import("src/types").DefaultThemeOrCSSProp<"fontSizes", "fontSize">;
|
|
21
21
|
grow?: import("csstype").Property.FlexGrow | undefined;
|
|
22
22
|
hasRadius?: boolean | undefined;
|
|
23
23
|
hiddenS?: boolean | undefined;
|
|
24
24
|
hiddenXS?: boolean | undefined;
|
|
25
|
-
padding?: import("
|
|
26
|
-
paddingBottom?: import("
|
|
27
|
-
paddingLeft?: import("
|
|
28
|
-
paddingRight?: import("
|
|
29
|
-
paddingTop?: import("
|
|
30
|
-
marginLeft?: import("
|
|
31
|
-
marginBottom?: import("
|
|
32
|
-
marginRight?: import("
|
|
33
|
-
marginTop?: import("
|
|
34
|
-
shadow?: keyof import("
|
|
25
|
+
padding?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"padding">;
|
|
26
|
+
paddingBottom?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"paddingBottom">;
|
|
27
|
+
paddingLeft?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"paddingLeft">;
|
|
28
|
+
paddingRight?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"paddingRight">;
|
|
29
|
+
paddingTop?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"paddingTop">;
|
|
30
|
+
marginLeft?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"marginLeft">;
|
|
31
|
+
marginBottom?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"marginBottom">;
|
|
32
|
+
marginRight?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"marginRight">;
|
|
33
|
+
marginTop?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"marginTop">;
|
|
34
|
+
shadow?: keyof import("src/themes/colors").Shadows | undefined;
|
|
35
35
|
shrink?: import("csstype").Property.FlexShrink | undefined;
|
|
36
|
-
lineHeight?: import("
|
|
37
|
-
width?: import("
|
|
38
|
-
minWidth?: import("
|
|
39
|
-
maxWidth?: import("
|
|
40
|
-
height?: import("
|
|
41
|
-
minHeight?: import("
|
|
42
|
-
maxHeight?: import("
|
|
43
|
-
top?: import("
|
|
44
|
-
left?: import("
|
|
45
|
-
bottom?: import("
|
|
46
|
-
right?: import("
|
|
36
|
+
lineHeight?: import("src/types").DefaultThemeOrCSSProp<"lineHeights", "lineHeight">;
|
|
37
|
+
width?: import("src/types").DefaultThemeOrCSSProp<"spaces", "width">;
|
|
38
|
+
minWidth?: import("src/types").DefaultThemeOrCSSProp<"spaces", "minWidth">;
|
|
39
|
+
maxWidth?: import("src/types").DefaultThemeOrCSSProp<"spaces", "maxWidth">;
|
|
40
|
+
height?: import("src/types").DefaultThemeOrCSSProp<"spaces", "height">;
|
|
41
|
+
minHeight?: import("src/types").DefaultThemeOrCSSProp<"spaces", "minHeight">;
|
|
42
|
+
maxHeight?: import("src/types").DefaultThemeOrCSSProp<"spaces", "maxHeight">;
|
|
43
|
+
top?: import("src/types").DefaultThemeOrCSSProp<"spaces", "top">;
|
|
44
|
+
left?: import("src/types").DefaultThemeOrCSSProp<"spaces", "left">;
|
|
45
|
+
bottom?: import("src/types").DefaultThemeOrCSSProp<"spaces", "bottom">;
|
|
46
|
+
right?: import("src/types").DefaultThemeOrCSSProp<"spaces", "right">;
|
|
47
47
|
borderRadius?: import("csstype").Property.BorderRadius<string | number> | undefined;
|
|
48
48
|
borderStyle?: import("csstype").Property.BorderStyle | undefined;
|
|
49
49
|
borderWidth?: import("csstype").Property.BorderWidth<string | number> | undefined;
|
|
@@ -10,43 +10,43 @@ interface SimpleMenuProps extends Omit<Menu.TriggerProps, 'children'>, Pick<Menu
|
|
|
10
10
|
onReachEnd?: (entry: IntersectionObserverEntry) => void;
|
|
11
11
|
}
|
|
12
12
|
declare const SimpleMenu: ({ children, onOpen, onClose, popoverPlacement, onReachEnd, ...props }: SimpleMenuProps) => import("react/jsx-runtime").JSX.Element;
|
|
13
|
-
declare const MenuItem: ({ onSelect, disabled, ...props }: Menu.ItemProps<import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref"> & Pick<import("styled-components").CSSProperties, "cursor" | "display" | "
|
|
13
|
+
declare const MenuItem: ({ onSelect, disabled, ...props }: Menu.ItemProps<import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref"> & Pick<import("styled-components").CSSProperties, "cursor" | "display" | "overflow" | "pointerEvents" | "transform" | "position" | "textAlign" | "textTransform" | "zIndex" | "animation" | "transition"> & {
|
|
14
14
|
_hover?: ((theme: import("styled-components").DefaultTheme) => string) | undefined;
|
|
15
|
-
background?: import("
|
|
15
|
+
background?: import("src/types").DefaultThemeOrCSSProp<"colors", "background">;
|
|
16
16
|
basis?: import("csstype").Property.FlexBasis<string | number> | undefined;
|
|
17
|
-
borderColor?: keyof import("
|
|
18
|
-
color?: keyof import("
|
|
17
|
+
borderColor?: keyof import("src/themes/colors").Colors | undefined;
|
|
18
|
+
color?: keyof import("src/themes/colors").Colors | undefined;
|
|
19
19
|
flex?: import("csstype").Property.Flex<string | number> | undefined;
|
|
20
|
-
fontSize?: import("
|
|
20
|
+
fontSize?: import("src/types").DefaultThemeOrCSSProp<"fontSizes", "fontSize">;
|
|
21
21
|
grow?: import("csstype").Property.FlexGrow | undefined;
|
|
22
22
|
hasRadius?: boolean | undefined;
|
|
23
23
|
hiddenS?: boolean | undefined;
|
|
24
24
|
hiddenXS?: boolean | undefined;
|
|
25
|
-
padding?: import("
|
|
25
|
+
padding?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"padding">; /**
|
|
26
26
|
* We need to know when the select is open because only then will viewportRef
|
|
27
27
|
* not be null. Because it uses a portal that (sensibly) is not mounted 24/7.
|
|
28
28
|
*/
|
|
29
|
-
paddingBottom?: import("
|
|
30
|
-
paddingLeft?: import("
|
|
31
|
-
paddingRight?: import("
|
|
32
|
-
paddingTop?: import("
|
|
33
|
-
marginLeft?: import("
|
|
34
|
-
marginBottom?: import("
|
|
35
|
-
marginRight?: import("
|
|
36
|
-
marginTop?: import("
|
|
37
|
-
shadow?: keyof import("
|
|
29
|
+
paddingBottom?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"paddingBottom">;
|
|
30
|
+
paddingLeft?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"paddingLeft">;
|
|
31
|
+
paddingRight?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"paddingRight">;
|
|
32
|
+
paddingTop?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"paddingTop">;
|
|
33
|
+
marginLeft?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"marginLeft">;
|
|
34
|
+
marginBottom?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"marginBottom">;
|
|
35
|
+
marginRight?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"marginRight">;
|
|
36
|
+
marginTop?: import("src/helpers/handleResponsiveValues").ResponsiveValue<"marginTop">;
|
|
37
|
+
shadow?: keyof import("src/themes/colors").Shadows | undefined;
|
|
38
38
|
shrink?: import("csstype").Property.FlexShrink | undefined;
|
|
39
|
-
lineHeight?: import("
|
|
40
|
-
width?: import("
|
|
41
|
-
minWidth?: import("
|
|
42
|
-
maxWidth?: import("
|
|
43
|
-
height?: import("
|
|
44
|
-
minHeight?: import("
|
|
45
|
-
maxHeight?: import("
|
|
46
|
-
top?: import("
|
|
47
|
-
left?: import("
|
|
48
|
-
bottom?: import("
|
|
49
|
-
right?: import("
|
|
39
|
+
lineHeight?: import("src/types").DefaultThemeOrCSSProp<"lineHeights", "lineHeight">;
|
|
40
|
+
width?: import("src/types").DefaultThemeOrCSSProp<"spaces", "width">;
|
|
41
|
+
minWidth?: import("src/types").DefaultThemeOrCSSProp<"spaces", "minWidth">;
|
|
42
|
+
maxWidth?: import("src/types").DefaultThemeOrCSSProp<"spaces", "maxWidth">;
|
|
43
|
+
height?: import("src/types").DefaultThemeOrCSSProp<"spaces", "height">;
|
|
44
|
+
minHeight?: import("src/types").DefaultThemeOrCSSProp<"spaces", "minHeight">;
|
|
45
|
+
maxHeight?: import("src/types").DefaultThemeOrCSSProp<"spaces", "maxHeight">;
|
|
46
|
+
top?: import("src/types").DefaultThemeOrCSSProp<"spaces", "top">;
|
|
47
|
+
left?: import("src/types").DefaultThemeOrCSSProp<"spaces", "left">;
|
|
48
|
+
bottom?: import("src/types").DefaultThemeOrCSSProp<"spaces", "bottom">;
|
|
49
|
+
right?: import("src/types").DefaultThemeOrCSSProp<"spaces", "right">;
|
|
50
50
|
borderRadius?: import("csstype").Property.BorderRadius<string | number> | undefined;
|
|
51
51
|
borderStyle?: import("csstype").Property.BorderStyle | undefined;
|
|
52
52
|
borderWidth?: import("csstype").Property.BorderWidth<string | number> | undefined;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@strapi/design-system",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.18.0-typescript.0",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"sideEffects": false,
|
|
6
6
|
"main": "./dist/index.js",
|
|
@@ -33,16 +33,16 @@
|
|
|
33
33
|
"@radix-ui/react-dismissable-layer": "^1.0.5",
|
|
34
34
|
"@radix-ui/react-dropdown-menu": "^2.0.6",
|
|
35
35
|
"@radix-ui/react-focus-scope": "1.0.4",
|
|
36
|
-
"@strapi/ui-primitives": "1.
|
|
36
|
+
"@strapi/ui-primitives": "1.18.0-typescript.0",
|
|
37
37
|
"@uiw/react-codemirror": "^4.21.24",
|
|
38
38
|
"aria-hidden": "^1.2.3",
|
|
39
39
|
"compute-scroll-into-view": "^3.1.0",
|
|
40
40
|
"prop-types": "^15.8.1",
|
|
41
|
-
"react-remove-scroll": "^2.5.
|
|
41
|
+
"react-remove-scroll": "^2.5.9"
|
|
42
42
|
},
|
|
43
43
|
"devDependencies": {
|
|
44
44
|
"@playwright/test": "1.41.2",
|
|
45
|
-
"@strapi/icons": "1.
|
|
45
|
+
"@strapi/icons": "1.18.0-typescript.0",
|
|
46
46
|
"@types/react-router-dom": "^5.3.3",
|
|
47
47
|
"@types/styled-components": "^5.1.26",
|
|
48
48
|
"axe-playwright": "^2.0.1",
|
|
@@ -51,7 +51,7 @@
|
|
|
51
51
|
"styled-components": "^5.3.11"
|
|
52
52
|
},
|
|
53
53
|
"peerDependencies": {
|
|
54
|
-
"@strapi/icons": "1.
|
|
54
|
+
"@strapi/icons": "1.18.0-typescript.0",
|
|
55
55
|
"react": "^17.0.0 || ^18.0.0",
|
|
56
56
|
"react-dom": "^17.0.0 || ^18.0.0",
|
|
57
57
|
"react-router-dom": "^5.2.0",
|