@trackunit/react-components 0.0.45 → 0.0.48

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.
@@ -17,8 +17,8 @@ export interface AlertProps extends CommonProps {
17
17
  children: React.ReactNode;
18
18
  /**
19
19
  * Intent of the alert component.
20
+ * @type "info" | "warning" | "danger" | "success"
20
21
  *
21
- * @type {AlertIntent}
22
22
  * @memberof AlertProps
23
23
  */
24
24
  intent?: AlertIntent;
@@ -39,7 +39,7 @@ export interface AlertProps extends CommonProps {
39
39
  /**
40
40
  * Action to be performed on clicking the secondary button.
41
41
  *
42
- * @type AlertAction
42
+ * @type {AlertAction}
43
43
  * @memberof AlertProps
44
44
  */
45
45
  secondaryAction?: AlertAction;
@@ -19,7 +19,7 @@ export interface ButtonProps extends ButtonCommonProps {
19
19
  /**
20
20
  * Whether button is fullWidth or not.
21
21
  *
22
- * @type {boolean}
22
+ * @type boolean
23
23
  * @memberof ButtonProps
24
24
  */
25
25
  fullWidth?: boolean;
@@ -40,7 +40,7 @@ export interface ButtonProps extends ButtonCommonProps {
40
40
  /**
41
41
  * The type of the button. Values can be "submit" or "button".
42
42
  *
43
- * @type {ButtonType}
43
+ * @type "submit" | "button"
44
44
  * @memberof ButtonProps
45
45
  */
46
46
  type?: ButtonType;
@@ -51,5 +51,9 @@ export interface ButtonProps extends ButtonCommonProps {
51
51
  * @memberof ButtonProps
52
52
  */
53
53
  renderAs?: keyof JSX.IntrinsicElements | React.ComponentType<any>;
54
+ /**
55
+ * The Id of the form to submit, for button type submit
56
+ */
57
+ form?: string;
54
58
  }
55
59
  export declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
@@ -11,7 +11,7 @@ export interface IconButtonProps extends ButtonCommonProps {
11
11
  /**
12
12
  * Whether the button is circular or not.
13
13
  *
14
- * @type {boolean}
14
+ * @type boolean
15
15
  * @memberof IconButtonProps
16
16
  */
17
17
  circular?: boolean;
@@ -25,7 +25,7 @@ export interface IconButtonProps extends ButtonCommonProps {
25
25
  /**
26
26
  * The size of the button. Defaults to "small".
27
27
  *
28
- * @type {("small" | "normal" | "large")}
28
+ * @type "small" | "normal" | "large"
29
29
  * @memberof IconButtonProps
30
30
  */
31
31
  size?: ButtonSize;
@@ -9,42 +9,42 @@ export interface ButtonCommonProps extends CommonProps {
9
9
  /**
10
10
  * Whether the button is loading.
11
11
  *
12
- * @type {boolean}
12
+ * @type boolean
13
13
  * @memberof ButtonCommonProps
14
14
  */
15
15
  loading?: boolean;
16
16
  /**
17
17
  * Whether the button is disabled.
18
18
  *
19
- * @type {boolean}
19
+ * @type boolean
20
20
  * @memberof ButtonCommonProps
21
21
  */
22
22
  disabled?: boolean;
23
23
  /**
24
24
  * Button with square aspect ratio.
25
25
  *
26
- * @type {boolean}
26
+ * @type boolean
27
27
  * @memberof ButtonCommonProps
28
28
  */
29
29
  square?: boolean;
30
30
  /**
31
31
  * The button's variant. Values are filled, transparent, plain.
32
32
  *
33
- * @type {"primary" | "secondary" | "danger" | "warning" | "tertiary"}
33
+ * @type "primary" | "secondary" | "danger" | "warning" | "tertiary"
34
34
  * @memberof ButtonCommonProps
35
35
  */
36
36
  intent?: ButtonIntent;
37
37
  /**
38
38
  * The variant of the button.
39
39
  *
40
- * @type {"filled" | "transparent"}
40
+ * @type "filled" | "transparent"
41
41
  * @memberof ButtonCommonProps
42
42
  */
43
43
  variant?: ButtonVariant;
44
44
  /**
45
45
  * The size of the button.
46
46
  *
47
- * @type {"small" | "normal" | "large"}
47
+ * @type "small" | "normal" | "large"
48
48
  * @memberof ButtonCommonProps
49
49
  */
50
50
  size?: ButtonSize;
@@ -10,21 +10,21 @@ export interface CardProps extends CommonProps {
10
10
  /**
11
11
  * Whether the card should have full height or not.
12
12
  *
13
- * @type {boolean}
13
+ * @type boolean
14
14
  * @memberof CardProps
15
15
  */
16
16
  fullHeight?: boolean;
17
17
  /**
18
18
  * Whether the card should overflow contents.
19
19
  *
20
- * @type {Overflow}
20
+ * @type "visible" | "hidden" | "scroll" | "auto"
21
21
  * @memberof CardProps
22
22
  */
23
23
  overflow?: Overflow;
24
24
  /**
25
25
  *
26
26
  * @deprecated Use tailwind based grid layouts instead.
27
- * @type {string}
27
+ * @type string
28
28
  * @memberof CardProps
29
29
  */
30
30
  gridArea?: string;
@@ -15,18 +15,19 @@ interface ContainerProps extends CommonProps {
15
15
  * "comfortable" = 16px gap and padding.
16
16
  * "spacious" = 16px gap, 26px padding.
17
17
  *
18
- * @type {("none" | "compact" | "comfortable" | "spacious" | "auto")}
18
+ * @type "none" | "compact" | "comfortable" | "spacious" | "auto"
19
19
  * @memberof ContainerProps
20
20
  */
21
21
  $density?: Density;
22
22
  /**
23
23
  * Set gap to be 0px (not preferable)
24
+ * @type boolean
24
25
  */
25
26
  $disableGap?: boolean;
26
27
  /**
27
28
  * The flex direction of the Card. Defaults to "column".
28
29
  *
29
- * @type {("row" | "row-reverse" | "column" | "column-reverse")}
30
+ * @type "row" | "row-reverse" | "column" | "column-reverse"
30
31
  * @memberof ContainerProps
31
32
  */
32
33
  $direction?: "row" | "row-reverse" | "column" | "column-reverse";
@@ -13,7 +13,7 @@ export interface IChartProps {
13
13
  /**
14
14
  * Whether or not to low the preloader.
15
15
  *
16
- * @type {boolean}
16
+ * @type boolean
17
17
  * @memberof IChartProps
18
18
  */
19
19
  showLoading?: boolean;
@@ -42,13 +42,13 @@ export interface IChartProps {
42
42
  */
43
43
  onBrushSelected?: (event: any) => void;
44
44
  /**
45
- * Evebt fired when mouse leaves the chart.
45
+ * Event fired when mouse leaves the chart.
46
46
  *
47
47
  * @memberof IChartProps
48
48
  */
49
49
  mouseLeaveChart?: () => void;
50
50
  /**
51
- * class values to be passed to the component.
51
+ * Class values to be passed to the component.
52
52
  *
53
53
  * @type string
54
54
  * @memberof IChartProps
@@ -70,7 +70,7 @@ export interface IChartProps {
70
70
  /**
71
71
  * Whether to merge with previous option.
72
72
  *
73
- * @type {boolean}
73
+ * @type boolean
74
74
  * @memberof IChartProps
75
75
  */
76
76
  merge?: boolean;
@@ -93,7 +93,7 @@ export interface IChartProps {
93
93
  /**
94
94
  * Type of rendered used. Either "svg" or "canvas".
95
95
  *
96
- * @type {("svg" | "canvas")}
96
+ * @type "svg" | "canvas"
97
97
  * @memberof IChartProps
98
98
  */
99
99
  renderer?: "svg" | "canvas";
@@ -5,7 +5,7 @@ export interface CollapseProps extends CommonProps {
5
5
  /**
6
6
  * Expands the collapse component during initialization.
7
7
  *
8
- * @type {boolean}
8
+ * @type boolean
9
9
  * @memberof CollapseProps
10
10
  */
11
11
  initialExpanded?: boolean;
@@ -1,7 +1,25 @@
1
1
  /// <reference types="react" />
2
2
  interface CopyableTextProps {
3
+ /**
4
+ * The text to be displayed.
5
+ *
6
+ * @type string
7
+ * @memberof CopyableTextProps
8
+ */
3
9
  text?: string;
10
+ /**
11
+ * Alternative text to be displayed.
12
+ *
13
+ * @type string
14
+ * @memberof CopyableTextProps
15
+ */
4
16
  alternativeText?: string;
17
+ /**
18
+ * ID of the component to be used while testing.
19
+ *
20
+ * @type string
21
+ * @memberof CopyableTextProps
22
+ */
5
23
  dataTestId?: string;
6
24
  }
7
25
  export declare const CopyableText: ({ text, alternativeText, dataTestId }: CopyableTextProps) => JSX.Element;
@@ -26,7 +26,7 @@ export interface DateFieldProps extends Pick<BaseInputProps, "placeholder" | "id
26
26
  /**
27
27
  * A flag that can be used to disable the input, default value is false
28
28
  *
29
- * @type {boolean}
29
+ * @type boolean
30
30
  * @memberof DateFieldProps
31
31
  */
32
32
  disabled?: boolean;
@@ -10,23 +10,23 @@ export interface HeadingProps extends CommonProps {
10
10
  */
11
11
  children: React.ReactNode;
12
12
  /**
13
- * Size of heading. Accepted values: "primary", "secondary", "tertiary", "subtitle".
13
+ * Size of heading.
14
14
  *
15
- * @type {HeadingVariant}
15
+ * @type "primary" | "secondary" | "tertiary" | "subtitle"
16
16
  * @memberof HeadingProps
17
17
  */
18
18
  variant: HeadingVariant;
19
19
  /**
20
20
  * Whether the heading uses inverted styles or not.
21
21
  *
22
- * @type {boolean}
22
+ * @type boolean
23
23
  * @memberof HeadingProps
24
24
  */
25
25
  inverted?: boolean;
26
26
  /**
27
27
  * Whether the heading is a subtitle or not.
28
28
  *
29
- * @type {boolean}
29
+ * @type boolean
30
30
  * @memberof HeadingProps
31
31
  */
32
32
  subtle?: boolean;
@@ -7,7 +7,7 @@ export interface IIconProps extends CommonProps {
7
7
  * The name of the icon to be rendered.
8
8
  * HeroIconName and TrackunitIconName are supported.
9
9
  *
10
- * @type {(TrackunitIconName | HeroIconName)}
10
+ * @type TrackunitIconName | HeroIconName
11
11
  * @memberof IIconProps
12
12
  */
13
13
  name: TrackunitIconName | HeroIconName;
@@ -16,7 +16,7 @@ export interface IIconProps extends CommonProps {
16
16
  * Supports any colors from the theme.
17
17
  * Custom colors can be used by setting a text color in the className.
18
18
  *
19
- * @type {Colors}
19
+ * @type Colors
20
20
  * @memberof IIconProps
21
21
  */
22
22
  color?: Colors;
@@ -26,7 +26,7 @@ export interface IIconProps extends CommonProps {
26
26
  * Default value is Large.
27
27
  * If a custom size is needed, set it in the className.
28
28
  *
29
- * @type {("small" | "normal" | "large")}
29
+ * @type "small" | "normal" | "large"
30
30
  * @memberof IIconProps
31
31
  */
32
32
  size?: "small" | "normal" | "large";
@@ -35,7 +35,7 @@ export interface IIconProps extends CommonProps {
35
35
  * Default value depends on the Size prop, small == solid, normal == solid, large == outline.
36
36
  * Trackunit icons might not support both outline and Solid.
37
37
  *
38
- * @type {("solid" | "outline")}
38
+ * @type "solid" | "outline"
39
39
  * @memberof IIconProps
40
40
  */
41
41
  type?: "solid" | "outline";
@@ -26,7 +26,7 @@ export interface IndicatorProps extends CommonProps {
26
26
  /**
27
27
  * A boolean parameter to display or hide icon background, default value is true
28
28
  *
29
- * @type string
29
+ * @type boolean
30
30
  * @memberof IndicatorProps
31
31
  */
32
32
  withBackground?: boolean;
@@ -1,9 +1,38 @@
1
1
  /// <reference types="react" />
2
2
  export interface IMenuItemProps {
3
+ /**
4
+ * The icon to be rendered in the menu item.
5
+ *
6
+ * @type {(JSX.Element)}
7
+ * @memberof IMenuItemProps
8
+ */
3
9
  icon?: JSX.Element;
10
+ /**
11
+ * Label of the menu item
12
+ *
13
+ * @type string
14
+ * @memberof IMenuItemProps
15
+ */
4
16
  label?: string;
17
+ /**
18
+ * Additional tailwind classes to be applied to the component.
19
+ *
20
+ * @type string
21
+ * @memberof IMenuItemProps
22
+ */
5
23
  className?: string;
24
+ /**
25
+ * Test id to be used for the component.
26
+ *
27
+ * @type string
28
+ * @memberof IMenuItemProps
29
+ */
6
30
  dataTestId?: string;
31
+ /**
32
+ * onClick event.
33
+ *
34
+ * @memberof IMenuItemProps
35
+ */
7
36
  onClick: () => void;
8
37
  }
9
38
  export declare const MenuItem: ({ className, dataTestId, label, icon, onClick }: IMenuItemProps) => JSX.Element;
@@ -4,8 +4,26 @@ export interface IMenuListItemProps extends IMenuItemProps {
4
4
  showDivider?: boolean;
5
5
  }
6
6
  export interface IMenuListProps {
7
+ /**
8
+ * Additional tailwind classes to be applied to the component.
9
+ *
10
+ * @type string
11
+ * @memberof IMenuListProps
12
+ */
7
13
  className?: string;
14
+ /**
15
+ * Test id to be used for the component.
16
+ *
17
+ * @type string
18
+ * @memberof IMenuListProps
19
+ */
8
20
  dataTestId?: string;
21
+ /**
22
+ * List of menu items to be rendered.
23
+ *
24
+ * @type {IMenuListItemProps[]}
25
+ * @memberof IMenuListProps
26
+ */
9
27
  menuItems: IMenuListItemProps[];
10
28
  }
11
- export declare const MenuList: ({ dataTestId, className, menuItems }: IMenuListProps) => JSX.Element;
29
+ export declare const MenuList: ({ dataTestId, className, menuItems, ...args }: IMenuListProps) => JSX.Element;
@@ -5,7 +5,7 @@ export interface ModalProps extends CommonProps {
5
5
  /**
6
6
  * Whether modal is open or not.
7
7
  *
8
- * @type {boolean}
8
+ * @type boolean
9
9
  * @memberof ModalProps
10
10
  */
11
11
  isOpen?: boolean;
@@ -1,7 +1,25 @@
1
1
  /// <reference types="react" />
2
2
  interface PageHeadingProps {
3
+ /**
4
+ * The title of the page.
5
+ *
6
+ * @type {string}
7
+ * @memberof PageHeadingProps
8
+ */
3
9
  title: string;
10
+ /**
11
+ * Subtitle of the page.
12
+ *
13
+ * @type {string}
14
+ * @memberof PageHeadingProps
15
+ */
4
16
  subtitle?: string;
17
+ /**
18
+ * Test id to be used for the component.
19
+ *
20
+ * @type {string}
21
+ * @memberof PageHeadingProps
22
+ */
5
23
  dataTestId?: string;
6
24
  badge?: string;
7
25
  }
@@ -1,13 +1,60 @@
1
1
  import * as React from "react";
2
2
  import { CommonProps } from "../../common/CommonProps";
3
3
  interface RadioGroupProps extends CommonProps {
4
+ /**
5
+ *
6
+ *
7
+ * @type {React.ReactNode}
8
+ * @memberof RadioGroupProps
9
+ */
4
10
  children: React.ReactNode;
11
+ /**
12
+ * The id of the radio group.
13
+ *
14
+ * @type string
15
+ * @memberof RadioGroupProps
16
+ */
5
17
  id: string;
18
+ /**
19
+ * onChange handler for the radio group.
20
+ *
21
+ * @memberof RadioGroupProps
22
+ */
6
23
  onChange: (e: React.FormEvent<HTMLInputElement>) => void;
24
+ /**
25
+ * The value of the radio group.
26
+ *
27
+ * @type string | number
28
+ * @memberof RadioGroupProps
29
+ */
7
30
  value: string | number;
31
+ /**
32
+ * The name of the radio group.
33
+ *
34
+ * @type string
35
+ * @memberof RadioGroupProps
36
+ */
8
37
  name?: string;
38
+ /**
39
+ * The label of the radio group.
40
+ *
41
+ * @type string
42
+ * @memberof RadioGroupProps
43
+ */
9
44
  label?: string;
45
+ /**
46
+ * Whether the radiogroup is inline or not.
47
+ *
48
+ * @type boolean
49
+ * @memberof RadioGroupProps
50
+ */
10
51
  inline?: boolean;
52
+ /**
53
+ * Whether the radio group is disabled or not.
54
+ *
55
+ * @type boolean
56
+ * @memberof RadioGroupProps
57
+ */
11
58
  disabled?: boolean;
12
59
  }
13
60
  export declare const RadioGroup: ({ children, id, name, value, disabled, onChange, label, inline, className, dataTestId, }: RadioGroupProps) => JSX.Element;
@@ -1,7 +1,19 @@
1
1
  import * as React from "react";
2
2
  import { CommonProps } from "../../common/CommonProps";
3
3
  interface RadioItemProps extends CommonProps {
4
+ /**
5
+ * The label of the radio item.
6
+ *
7
+ * @type {React.ReactNode}
8
+ * @memberof RadioItemProps
9
+ */
4
10
  label: React.ReactNode;
11
+ /**
12
+ * The value of the radio item.
13
+ *
14
+ * @type {(string | number)}
15
+ * @memberof RadioItemProps
16
+ */
5
17
  value: string | number;
6
18
  }
7
19
  export declare const RadioItem: ({ label, value, dataTestId, className }: RadioItemProps) => JSX.Element;
@@ -20,7 +20,7 @@ export interface ISelectProps<Option, IsAsync extends boolean, IsMulti extends b
20
20
  /**
21
21
  * To hide the label.
22
22
  *
23
- * @type {boolean}
23
+ * @type boolean
24
24
  * @memberof ISelectProps
25
25
  */
26
26
  hideLabel?: boolean;
@@ -34,14 +34,14 @@ export interface ISelectProps<Option, IsAsync extends boolean, IsMulti extends b
34
34
  /**
35
35
  * Whether the component is invalid.
36
36
  *
37
- * @type {boolean}
37
+ * @type boolean
38
38
  * @memberof ISelectProps
39
39
  */
40
40
  isInvalid?: boolean;
41
41
  /**
42
42
  * Whether the component is disabled.
43
43
  *
44
- * @type {boolean}
44
+ * @type boolean
45
45
  * @memberof ISelectProps
46
46
  */
47
47
  isDisabled?: boolean;
@@ -62,7 +62,7 @@ export interface ISelectProps<Option, IsAsync extends boolean, IsMulti extends b
62
62
  /**
63
63
  * Size of the component.
64
64
  *
65
- * @type {SelectSize}
65
+ * @type "small" | "default"
66
66
  * @memberof ISelectProps
67
67
  */
68
68
  size?: SelectSize;
@@ -4,21 +4,21 @@ export interface ISkeletonLinesProps extends CommonProps {
4
4
  /**
5
5
  * The number of lines to display.
6
6
  *
7
- * @type {number}
7
+ * @type number
8
8
  * @memberof ISkeletonLinesProps
9
9
  */
10
10
  lines?: number;
11
11
  /**
12
12
  * The height of lines. Can be a number or an array of numbers or string.
13
13
  *
14
- * @type {(number | number[] | string)}
14
+ * @type number | number[] | string
15
15
  * @memberof ISkeletonLinesProps
16
16
  */
17
17
  height?: number | number[] | string;
18
18
  /**
19
19
  * The width of each lines. Can be a number or an array of numbers or string.
20
20
  *
21
- * @type {(number | number[] | string)}
21
+ * @type number | number[] | string
22
22
  * @memberof ISkeletonLinesProps
23
23
  */
24
24
  width?: number | number[] | string;
@@ -5,14 +5,14 @@ interface SpacerProps extends CommonProps {
5
5
  * The minimum height of the spacer. Defaults to 1px.
6
6
  * Possible values are "normal"(8px), and "large" (32px). Use className prop to use custom min-height values, example: min-h-[100px].
7
7
  *
8
- * @type {(number | string)}
8
+ * @type number | string
9
9
  * @memberof SpacerProps
10
10
  */
11
11
  minHeight?: string;
12
12
  /**
13
13
  * The border of the spacer.
14
14
  *
15
- * @type {boolean}
15
+ * @type boolean
16
16
  * @memberof SpacerProps
17
17
  */
18
18
  border?: boolean;
@@ -15,63 +15,63 @@ export interface TextProps extends CommonProps {
15
15
  /**
16
16
  * Type of element. Element can be of types "p", "span", or "div".
17
17
  *
18
- * @type {TextType}
18
+ * @type "p" | "span" | "div"
19
19
  * @memberof TextProps
20
20
  */
21
21
  type?: TextType;
22
22
  /**
23
23
  * Size of element. Values can be "default", "small", or "large".
24
24
  *
25
- * @type {TextSize}
25
+ * @type "small" | "default" | "large"
26
26
  * @memberof TextProps
27
27
  */
28
28
  size?: TextSize;
29
29
  /**
30
30
  * Alignment of the text. Values can be "left", "center", or "right".
31
31
  *
32
- * @type {TextAlign}
32
+ * @type "left" | "center" | "right"
33
33
  * @memberof TextProps
34
34
  */
35
35
  align?: TextAlign;
36
36
  /**
37
37
  * Weight of the text. Values can be "default", "thick", or "bold".
38
38
  *
39
- * @type {TextWeight}
39
+ * @type "default" | "thick" | "bold"
40
40
  * @memberof TextProps
41
41
  */
42
42
  weight?: TextWeight;
43
43
  /**
44
44
  * Whether font styles are inverted.
45
45
  *
46
- * @type {boolean}
46
+ * @type boolean
47
47
  * @memberof TextProps
48
48
  */
49
49
  inverted?: boolean;
50
50
  /**
51
51
  * Whether font styles are subtle or not.
52
52
  *
53
- * @type {boolean}
53
+ * @type boolean
54
54
  * @memberof TextProps
55
55
  */
56
56
  subtle?: boolean;
57
57
  /**
58
58
  * Whether text is italicized.
59
59
  *
60
- * @type {boolean}
60
+ * @type boolean
61
61
  * @memberof TextProps
62
62
  */
63
63
  italicize?: boolean;
64
64
  /**
65
65
  * Whether text is uppercase.
66
66
  *
67
- * @type {boolean}
67
+ * @type boolean
68
68
  * @memberof TextProps
69
69
  */
70
70
  uppercase?: boolean;
71
71
  /**
72
72
  * Whether text is underlined or not.
73
73
  *
74
- * @type {boolean}
74
+ * @type boolean
75
75
  * @memberof TextProps
76
76
  */
77
77
  underline?: boolean;
@@ -2,24 +2,135 @@ import * as React from "react";
2
2
  import { CommonProps } from "../../common/CommonProps";
3
3
  export declare type TextAreaResize = "none" | "vertical" | "horizontal" | "both";
4
4
  export interface TextAreaProps extends CommonProps {
5
+ /**
6
+ * ID of the text area.
7
+ *
8
+ * @type string
9
+ * @memberof TextAreaProps
10
+ */
5
11
  id?: string;
12
+ /**
13
+ * Name of the text area.
14
+ *
15
+ * @type string
16
+ * @memberof TextAreaProps
17
+ */
6
18
  name?: string;
19
+ /**
20
+ * Label of the text area.
21
+ *
22
+ * @type string
23
+ * @memberof TextAreaProps
24
+ */
7
25
  label?: string;
26
+ /**
27
+ * Description of the text area.
28
+ *
29
+ * @type string
30
+ * @memberof TextAreaProps
31
+ */
8
32
  description?: string;
33
+ /**
34
+ * Information about the text area.
35
+ *
36
+ * @type {React.ReactNode}
37
+ * @memberof TextAreaProps
38
+ */
9
39
  info?: React.ReactNode;
40
+ /**
41
+ * Error message of the text area.
42
+ *
43
+ * @type {React.ReactNode}
44
+ * @memberof TextAreaProps
45
+ */
10
46
  error?: React.ReactNode;
47
+ /**
48
+ * Value of the text area.
49
+ *
50
+ * @type {React.ReactText}
51
+ * @memberof TextAreaProps
52
+ */
11
53
  value?: React.ReactText;
54
+ /**
55
+ * Tab index specifies the keyboard tab order of the textarea relative to the other controls on the page.
56
+ *
57
+ * @type number
58
+ * @memberof TextAreaProps
59
+ */
12
60
  tabIndex?: number;
61
+ /**
62
+ * Whether the text area is disabled or not.
63
+ *
64
+ * @type boolean
65
+ * @memberof TextAreaProps
66
+ */
13
67
  disabled?: boolean;
68
+ /**
69
+ * Whether the text area is readonly or not.
70
+ *
71
+ * @type boolean
72
+ * @memberof TextAreaProps
73
+ */
14
74
  readOnly?: boolean;
75
+ /**
76
+ * Number of rows in the text area.
77
+ *
78
+ * @type number
79
+ * @memberof TextAreaProps
80
+ */
15
81
  rows?: number;
82
+ /**
83
+ * Placeholder text for the text area.
84
+ *
85
+ * @type string
86
+ * @memberof TextAreaProps
87
+ */
16
88
  placeholder?: string;
89
+ /**
90
+ * onChange handler of the text area.
91
+ *
92
+ * @memberof TextAreaProps
93
+ */
17
94
  onChange?: (event: React.SyntheticEvent<HTMLTextAreaElement>) => void;
95
+ /**
96
+ * onFocus handler of the text area.
97
+ *
98
+ * @memberof TextAreaProps
99
+ */
18
100
  onFocus?: (event: React.SyntheticEvent<HTMLTextAreaElement>) => void;
101
+ /**
102
+ * onBlur handler of the text area.
103
+ *
104
+ * @memberof TextAreaProps
105
+ */
19
106
  onBlur?: (event: React.SyntheticEvent<HTMLTextAreaElement>) => void;
107
+ /**
108
+ * Maximum length of the text area.
109
+ *
110
+ * @type number
111
+ * @memberof TextAreaProps
112
+ */
20
113
  maxLength?: number;
114
+ /**
115
+ * Resize of the text area.
116
+ *
117
+ * @type "none" | "vertical" | "horizontal" | "both"
118
+ * @memberof TextAreaProps
119
+ */
21
120
  resize?: TextAreaResize;
121
+ /**
122
+ * Default value of the textarea.
123
+ *
124
+ * @type {React.ReactText}
125
+ * @memberof TextAreaProps
126
+ */
22
127
  defaultValue?: React.ReactText;
128
+ /**
129
+ * Whether the text area is required or not.
130
+ *
131
+ * @type boolean
132
+ * @memberof TextAreaProps
133
+ */
23
134
  required?: boolean;
24
135
  }
25
136
  export declare const TextArea: React.ForwardRefExoticComponent<TextAreaProps & React.RefAttributes<HTMLTextAreaElement>>;
@@ -3,6 +3,12 @@ import { CommonProps } from "../../common";
3
3
  import { IIconProps } from "../icon/Icon";
4
4
  import { TooltipProps } from "../tooltip";
5
5
  export interface TipProps extends CommonProps {
6
+ /**
7
+ * Child nodes to render inside the tip.
8
+ *
9
+ * @type {React.ReactNode}
10
+ * @memberof TipProps
11
+ */
6
12
  children: React.ReactNode;
7
13
  iconProps?: Partial<IIconProps>;
8
14
  tooltipProps?: Partial<TooltipProps>;
@@ -2,14 +2,67 @@ import * as React from "react";
2
2
  import { CommonProps } from "../../common/CommonProps";
3
3
  export declare type ToggleSize = "small" | "default";
4
4
  export interface ToggleProps extends CommonProps {
5
+ /**
6
+ * ID of the toggle.
7
+ *
8
+ * @type string
9
+ * @memberof ToggleProps
10
+ */
5
11
  id: string;
12
+ /**
13
+ * Whether the toggle is toggled(active) or not.
14
+ *
15
+ * @type boolean
16
+ * @memberof ToggleProps
17
+ */
6
18
  toggled: boolean;
19
+ /**
20
+ * onChange event handler.
21
+ *
22
+ * @memberof ToggleProps
23
+ */
7
24
  onChange: (toggled: boolean, event?: React.ChangeEvent<HTMLInputElement>) => void;
25
+ /**
26
+ * Whether the toggle is disabled or not.
27
+ *
28
+ * @type boolean
29
+ * @memberof ToggleProps
30
+ */
8
31
  disabled?: boolean;
32
+ /**
33
+ * Size of the toggle.
34
+ *
35
+ * @type "small" | "default"
36
+ * @memberof ToggleProps
37
+ */
9
38
  size?: ToggleSize;
39
+ /**
40
+ * Tab index specifies the keyboard tab order of the toggle relative to the other controls on the page.
41
+ *
42
+ * @type number
43
+ * @memberof ToggleProps
44
+ */
10
45
  tabIndex?: number;
46
+ /**
47
+ * Whether the toggle is required or not.
48
+ *
49
+ * @type boolean
50
+ * @memberof ToggleProps
51
+ */
11
52
  required?: boolean;
53
+ /**
54
+ * Name of the toggle.
55
+ *
56
+ * @type string
57
+ * @memberof ToggleProps
58
+ */
12
59
  name?: string;
60
+ /**
61
+ * onBlur event handler.
62
+ *
63
+ * @type {React.FocusEventHandler<HTMLInputElement>}
64
+ * @memberof ToggleProps
65
+ */
13
66
  onBlur?: React.FocusEventHandler<HTMLInputElement>;
14
67
  }
15
68
  export declare const Toggle: React.ForwardRefExoticComponent<ToggleProps & React.RefAttributes<HTMLInputElement>>;
@@ -33,21 +33,21 @@ export interface TooltipProps {
33
33
  /**
34
34
  * Whether the tooltip is disabled or not.
35
35
  *
36
- * @type {boolean}
36
+ * @type boolean
37
37
  * @memberof TooltipProps
38
38
  */
39
39
  disabled?: boolean;
40
40
  /**
41
41
  * To select either "light" or "dark" mode.
42
42
  *
43
- * @type {("light" | "dark")}
43
+ * @type "light" | "dark"
44
44
  * @memberof TooltipProps
45
45
  */
46
46
  mode?: "light" | "dark";
47
47
  /**
48
48
  * Offset value of the tooltip.
49
49
  *
50
- * @type {[number, number]}
50
+ * @type [number, number]
51
51
  * @memberof TooltipProps
52
52
  */
53
53
  offset?: [number, number];
@@ -61,7 +61,7 @@ export interface TooltipProps {
61
61
  /**
62
62
  * Type of content.
63
63
  *
64
- * @type {TextType}
64
+ * @type "p" | "span" | "div"
65
65
  * @memberof TooltipProps
66
66
  */
67
67
  contentTextType?: TextType;
package/index.js CHANGED
@@ -85,7 +85,7 @@ const Spinner = ({
85
85
  "$centered": centered,
86
86
  className: containerClassName
87
87
  }, {
88
- children: jsx(StyledSpinner, {
88
+ children: jsx(StyledSpinner$1, {
89
89
  "$size": size,
90
90
  "$mode": mode,
91
91
  role: "spinbutton",
@@ -111,7 +111,7 @@ const getSpinnerStyles = () => ({
111
111
  }
112
112
  };
113
113
 
114
- const StyledSpinner = tw.span`
114
+ const StyledSpinner$1 = tw.span`
115
115
  spinner
116
116
  ${p => p.$mode === "dark" ? tws`spinner--dark` : null}
117
117
  ${getSpinnerStyles()}
@@ -199,7 +199,7 @@ const Button = React.forwardRef((_a, ref) => {
199
199
  "data-testid": dataTestId,
200
200
  ref: ref
201
201
  }, rest, {
202
- children: [loading && jsx(Spinner, {
202
+ children: [loading && jsx(StyledSpinner, {
203
203
  centered: true
204
204
  }), prefix, children, suffix]
205
205
  }));
@@ -211,6 +211,9 @@ const StyledButton$1 = tw.button`
211
211
  ${getStyles()}
212
212
  ${getPadding()}
213
213
  `;
214
+ const StyledSpinner = tw(Spinner)`
215
+ button__spinner
216
+ `;
214
217
  Button.displayName = "Button";
215
218
 
216
219
  const IconButton = React.forwardRef((_a, ref) => {
@@ -2516,15 +2519,18 @@ const Label = tw.div`
2516
2519
  menuItem__label
2517
2520
  `;
2518
2521
 
2519
- const MenuList = ({
2520
- dataTestId,
2521
- className,
2522
- menuItems
2523
- }) => {
2524
- const containerProps = useContainerProps({
2522
+ const MenuList = _a => {
2523
+ var {
2524
+ dataTestId,
2525
+ className,
2526
+ menuItems
2527
+ } = _a,
2528
+ args = __rest(_a, ["dataTestId", "className", "menuItems"]);
2529
+
2530
+ const containerProps = useContainerProps(Object.assign({
2525
2531
  className,
2526
2532
  dataTestId
2527
- });
2533
+ }, args));
2528
2534
  return jsx(Wrapper, {
2529
2535
  children: jsx(Container$1, Object.assign({}, containerProps, {
2530
2536
  children: menuItems.map((props, index) => {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@trackunit/react-components",
3
- "version": "0.0.45",
3
+ "version": "0.0.48",
4
4
  "repository": "https://github.com/Trackunit/manager",
5
5
  "license": "MIT",
6
6
  "dependencies": {