@koobiq/react-components 0.8.0 → 0.9.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/components/Alert/Alert.js +5 -3
- package/dist/components/Alert/types.d.ts +0 -3
- package/dist/components/Backdrop/Backdrop.js +1 -1
- package/dist/components/Backdrop/types.d.ts +4 -1
- package/dist/components/Button/Button.js +7 -7
- package/dist/components/Button/types.d.ts +0 -4
- package/dist/components/ButtonToggleGroup/ButtonToggleGroup.js +6 -6
- package/dist/components/ButtonToggleGroup/components/ButtonToggle/ButtonToggle.js +6 -6
- package/dist/components/ButtonToggleGroup/components/ButtonToggle/types.d.ts +0 -1
- package/dist/components/ButtonToggleGroup/types.d.ts +0 -3
- package/dist/components/Checkbox/Checkbox.js +6 -6
- package/dist/components/Checkbox/types.d.ts +0 -5
- package/dist/components/Container/Container.js +2 -2
- package/dist/components/Container/types.d.ts +0 -2
- package/dist/components/DateInput/DateInput.js +15 -11
- package/dist/components/DateInput/types.d.ts +1 -3
- package/dist/components/DatePicker/types.d.ts +1 -2
- package/dist/components/Dialog/Dialog.js +1 -1
- package/dist/components/Dialog/types.d.ts +0 -1
- package/dist/components/Divider/Divider.js +5 -4
- package/dist/components/Divider/types.d.ts +0 -2
- package/dist/components/FieldComponents/FieldAddon/FieldAddon.js +4 -4
- package/dist/components/FieldComponents/FieldContentGroup/FieldContentGroup.js +2 -2
- package/dist/components/FieldComponents/FieldError/FieldError.d.ts +4 -2
- package/dist/components/FieldComponents/FieldError/FieldError.js +6 -8
- package/dist/components/FieldComponents/FieldInput/FieldInput.js +3 -3
- package/dist/components/FieldComponents/FieldInputDate/FieldInputDate.js +2 -2
- package/dist/components/FieldComponents/FieldSelect/FieldSelect.js +3 -3
- package/dist/components/FormControl/FormControl.js +2 -2
- package/dist/components/FormControlLabel/FormControlLabel.js +1 -8
- package/dist/components/IconButton/IconButton.js +4 -4
- package/dist/components/IconButton/types.d.ts +0 -3
- package/dist/components/Input/Input.d.ts +2 -3
- package/dist/components/Input/Input.js +11 -7
- package/dist/components/Input/Input.module.css.js +4 -0
- package/dist/components/Input/types.d.ts +1 -10
- package/dist/components/InputNumber/InputNumber.d.ts +2 -3
- package/dist/components/InputNumber/InputNumber.js +7 -7
- package/dist/components/InputNumber/types.d.ts +0 -9
- package/dist/components/Link/Link.js +3 -3
- package/dist/components/Link/types.d.ts +0 -5
- package/dist/components/List/components/ListOption/ListOption.js +5 -5
- package/dist/components/Modal/Modal.js +1 -1
- package/dist/components/Modal/types.d.ts +1 -5
- package/dist/components/Popover/PopoverInner.js +2 -2
- package/dist/components/Popover/types.d.ts +0 -4
- package/dist/components/RadioGroup/RadioGroup.js +8 -11
- package/dist/components/RadioGroup/components/Radio/types.d.ts +0 -1
- package/dist/components/RadioGroup/types.d.ts +1 -8
- package/dist/components/SearchInput/SearchInput.d.ts +2 -3
- package/dist/components/SearchInput/SearchInput.js +13 -12
- package/dist/components/SearchInput/types.d.ts +1 -5
- package/dist/components/Select/Select.js +11 -14
- package/dist/components/Select/components/SelectOption/SelectOption.js +5 -5
- package/dist/components/Select/types.d.ts +4 -6
- package/dist/components/SidePanel/SidePanel.js +1 -1
- package/dist/components/SidePanel/types.d.ts +0 -5
- package/dist/components/Table/Table.js +4 -4
- package/dist/components/Table/components/TableRow/TableRow.js +5 -5
- package/dist/components/Table/types.d.ts +0 -2
- package/dist/components/TagGroup/components/Tag/Tag.js +6 -6
- package/dist/components/Textarea/Textarea.d.ts +1 -2
- package/dist/components/Textarea/Textarea.js +6 -6
- package/dist/components/Textarea/components/TextareaContextConsumer/TextareaContextConsumer.js +1 -1
- package/dist/components/Textarea/types.d.ts +1 -10
- package/dist/components/TimePicker/TimePicker.d.ts +1 -1
- package/dist/components/TimePicker/TimePicker.js +15 -11
- package/dist/components/TimePicker/types.d.ts +0 -2
- package/dist/components/Toggle/Toggle.js +3 -3
- package/dist/components/Toggle/types.d.ts +0 -3
- package/dist/components/Tooltip/Tooltip.js +9 -9
- package/dist/components/Tooltip/types.d.ts +0 -3
- package/dist/style.css +7 -0
- package/package.json +5 -5
|
@@ -18,8 +18,8 @@ const IconButton = polymorphicForwardRef(
|
|
|
18
18
|
className,
|
|
19
19
|
...other
|
|
20
20
|
} = props;
|
|
21
|
-
const isCompact = isCompactProp ?? compact
|
|
22
|
-
const isDisabled = isDisabledProp ?? disabled
|
|
21
|
+
const isCompact = isCompactProp ?? compact;
|
|
22
|
+
const isDisabled = isDisabledProp ?? disabled;
|
|
23
23
|
if (process.env.NODE_ENV !== "production" && "compact" in props) {
|
|
24
24
|
deprecate(
|
|
25
25
|
'IconButton: the "compact" prop is deprecated. Use "isCompact" prop to replace it.'
|
|
@@ -54,9 +54,9 @@ const IconButton = polymorphicForwardRef(
|
|
|
54
54
|
as: Tag,
|
|
55
55
|
isDisabled,
|
|
56
56
|
className: classNameFn,
|
|
57
|
-
"data-compact": isCompact,
|
|
58
|
-
"data-variant": variant,
|
|
59
57
|
"data-size": size,
|
|
58
|
+
"data-variant": variant,
|
|
59
|
+
"data-compact": isCompact || void 0,
|
|
60
60
|
...other,
|
|
61
61
|
ref,
|
|
62
62
|
children
|
|
@@ -8,14 +8,12 @@ export type IconButtonPropSize = (typeof iconButtonPropSize)[number];
|
|
|
8
8
|
type IconButtonBaseDeprecatedProps = {
|
|
9
9
|
/**
|
|
10
10
|
* If `true`, the component is disabled.
|
|
11
|
-
* @default false
|
|
12
11
|
* @deprecated
|
|
13
12
|
* The "disabled" prop is deprecated. Use "isDisabled" prop to replace it.
|
|
14
13
|
*/
|
|
15
14
|
disabled?: boolean;
|
|
16
15
|
/**
|
|
17
16
|
* If `true`, reduce the size of the component canvas.
|
|
18
|
-
* @default false
|
|
19
17
|
* @deprecated
|
|
20
18
|
* The "compact" prop is deprecated. Use "isCompact" prop to replace it.
|
|
21
19
|
*/
|
|
@@ -36,7 +34,6 @@ export type IconButtonBaseProps = ExtendableProps<{
|
|
|
36
34
|
size?: IconButtonPropSize;
|
|
37
35
|
/**
|
|
38
36
|
* If `true`, reduce the size of the component canvas.
|
|
39
|
-
* @default false
|
|
40
37
|
*/
|
|
41
38
|
isCompact?: boolean;
|
|
42
39
|
/** Additional CSS-classes. */
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { TextField } from '@koobiq/react-primitives';
|
|
2
|
-
import { type FieldContentGroupProps, type FieldCaptionProps, type
|
|
2
|
+
import { type FieldContentGroupProps, type FieldCaptionProps, type FieldInputProps, type FieldErrorProps } from '../FieldComponents';
|
|
3
3
|
import { type FormControlProps } from '../FormControl';
|
|
4
4
|
import { type FormControlLabelProps } from '../FormControlLabel';
|
|
5
|
-
export declare const Input: import("react").ForwardRefExoticComponent<Omit<Omit<import("@koobiq/react-primitives").TextFieldProps<HTMLInputElement>, "children" | "
|
|
5
|
+
export declare const Input: import("react").ForwardRefExoticComponent<Omit<Omit<import("@koobiq/react-primitives").TextFieldProps<HTMLInputElement>, "children" | "validationState" | "description" | "inputElementType">, "caption" | "style" | "className" | "labelPlacement" | "labelAlign" | "fullWidth" | "variant" | "slotProps" | "data-testid" | "startAddon" | "endAddon" | "isLabelHidden" | keyof {
|
|
6
6
|
disabled?: boolean;
|
|
7
7
|
error?: boolean;
|
|
8
8
|
required?: boolean;
|
|
@@ -13,7 +13,6 @@ export declare const Input: import("react").ForwardRefExoticComponent<Omit<Omit<
|
|
|
13
13
|
startAddon?: import("react").ReactNode;
|
|
14
14
|
endAddon?: import("react").ReactNode;
|
|
15
15
|
variant?: import("./types").InputPropVariant;
|
|
16
|
-
errorMessage?: import("react").ReactNode;
|
|
17
16
|
fullWidth?: boolean;
|
|
18
17
|
isLabelHidden?: boolean;
|
|
19
18
|
labelPlacement?: import("./types").InputPropLabelPlacement;
|
|
@@ -4,6 +4,7 @@ import { forwardRef } from "react";
|
|
|
4
4
|
import { deprecate } from "@koobiq/logger";
|
|
5
5
|
import { useDOMRef, mergeProps } from "@koobiq/react-core";
|
|
6
6
|
import { TextField } from "@koobiq/react-primitives";
|
|
7
|
+
import s from "./Input.module.css.js";
|
|
7
8
|
import { FormControl } from "../FormControl/FormControl.js";
|
|
8
9
|
import { FormControlLabel } from "../FormControlLabel/FormControlLabel.js";
|
|
9
10
|
import { Field } from "../FieldComponents/Field/Field.js";
|
|
@@ -14,7 +15,7 @@ import { FieldError } from "../FieldComponents/FieldError/FieldError.js";
|
|
|
14
15
|
const Input = forwardRef((props, ref) => {
|
|
15
16
|
const {
|
|
16
17
|
variant = "filled",
|
|
17
|
-
fullWidth
|
|
18
|
+
fullWidth,
|
|
18
19
|
hiddenLabel,
|
|
19
20
|
isLabelHidden: isLabelHiddenProp,
|
|
20
21
|
disabled,
|
|
@@ -35,11 +36,11 @@ const Input = forwardRef((props, ref) => {
|
|
|
35
36
|
caption,
|
|
36
37
|
...other
|
|
37
38
|
} = props;
|
|
38
|
-
const isDisabled = isDisabledProp ?? disabled
|
|
39
|
-
const isRequired = isRequiredProp ?? required
|
|
40
|
-
const isReadOnly = isReadOnlyProp ?? readonly
|
|
41
|
-
const isInvalid = isInvalidProp ?? error
|
|
42
|
-
const isLabelHidden = isLabelHiddenProp ?? hiddenLabel
|
|
39
|
+
const isDisabled = isDisabledProp ?? disabled;
|
|
40
|
+
const isRequired = isRequiredProp ?? required;
|
|
41
|
+
const isReadOnly = isReadOnlyProp ?? readonly;
|
|
42
|
+
const isInvalid = isInvalidProp ?? error;
|
|
43
|
+
const isLabelHidden = isLabelHiddenProp ?? hiddenLabel;
|
|
43
44
|
if (process.env.NODE_ENV !== "production" && "disabled" in props) {
|
|
44
45
|
deprecate(
|
|
45
46
|
'Input: the "disabled" prop is deprecated. Use "isDisabled" prop to replace it.'
|
|
@@ -107,7 +108,10 @@ const Input = forwardRef((props, ref) => {
|
|
|
107
108
|
slotProps?.group
|
|
108
109
|
);
|
|
109
110
|
const captionProps = mergeProps({ children: caption }, slotProps?.caption);
|
|
110
|
-
const errorProps = mergeProps(
|
|
111
|
+
const errorProps = mergeProps(
|
|
112
|
+
{ children: errorMessage, className: s.error },
|
|
113
|
+
slotProps?.errorMessage
|
|
114
|
+
);
|
|
111
115
|
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
112
116
|
/* @__PURE__ */ jsx(FormControlLabel, { ...labelProps }),
|
|
113
117
|
/* @__PURE__ */ jsxs(Field, { children: [
|
|
@@ -13,35 +13,30 @@ export type InputPropLabelAlign = FormControlPropLabelAlign;
|
|
|
13
13
|
type InputDeprecatedProps = {
|
|
14
14
|
/**
|
|
15
15
|
* If `true`, the component is disabled.
|
|
16
|
-
* @default false
|
|
17
16
|
* @deprecated
|
|
18
17
|
* The "disabled" prop is deprecated. Use "isDisabled" prop to replace it.
|
|
19
18
|
*/
|
|
20
19
|
disabled?: boolean;
|
|
21
20
|
/**
|
|
22
21
|
* If `true`, the input will indicate an error.
|
|
23
|
-
* @default false
|
|
24
22
|
* @deprecated
|
|
25
23
|
* The "error" prop is deprecated. Use "isInvalid" prop to replace it.
|
|
26
24
|
*/
|
|
27
25
|
error?: boolean;
|
|
28
26
|
/**
|
|
29
27
|
* If `true`, the label is displayed as required and the input element is required.
|
|
30
|
-
* @default false
|
|
31
28
|
* @deprecated
|
|
32
29
|
* The "required" prop is deprecated. Use "isRequired" prop to replace it.
|
|
33
30
|
*/
|
|
34
31
|
required?: boolean;
|
|
35
32
|
/**
|
|
36
33
|
* If `true`, the input can be selected but not changed by the user.
|
|
37
|
-
* @default false
|
|
38
34
|
* @deprecated
|
|
39
35
|
* The "readonly" prop is deprecated. Use "isReadOnly" prop to replace it.
|
|
40
36
|
*/
|
|
41
37
|
readonly?: boolean;
|
|
42
38
|
/**
|
|
43
39
|
* If `true`, the label is hidden. Be sure to add aria-label to the input element.
|
|
44
|
-
* @default false
|
|
45
40
|
* @deprecated
|
|
46
41
|
* The "hiddenLabel" prop is deprecated. Use "isLabelHidden" prop to replace it.
|
|
47
42
|
*/
|
|
@@ -59,16 +54,12 @@ export type InputProps = ExtendableProps<{
|
|
|
59
54
|
* @default 'filled'
|
|
60
55
|
*/
|
|
61
56
|
variant?: InputPropVariant;
|
|
62
|
-
/** An error message for the field. */
|
|
63
|
-
errorMessage?: ReactNode;
|
|
64
57
|
/**
|
|
65
58
|
* If true, the input will take up the full width of its container.
|
|
66
|
-
* @default false
|
|
67
59
|
*/
|
|
68
60
|
fullWidth?: boolean;
|
|
69
61
|
/**
|
|
70
62
|
* If `true`, the label is hidden. Be sure to add aria-label to the input element.
|
|
71
|
-
* @default false
|
|
72
63
|
*/
|
|
73
64
|
isLabelHidden?: boolean;
|
|
74
65
|
/**
|
|
@@ -96,6 +87,6 @@ export type InputProps = ExtendableProps<{
|
|
|
96
87
|
errorMessage?: FieldErrorProps;
|
|
97
88
|
input?: FieldInputProps;
|
|
98
89
|
};
|
|
99
|
-
} & InputDeprecatedProps, Omit<TextFieldProps<HTMLInputElement>, 'description' | '
|
|
90
|
+
} & InputDeprecatedProps, Omit<TextFieldProps<HTMLInputElement>, 'description' | 'children' | 'inputElementType' | 'validationState'>>;
|
|
100
91
|
export type InputRef = ComponentRef<'input'>;
|
|
101
92
|
export {};
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { NumberField } from '@koobiq/react-primitives';
|
|
2
|
-
import { type FieldCaptionProps, type
|
|
2
|
+
import { type FieldCaptionProps, type FieldContentGroupProps, type FieldInputProps, type FieldErrorProps } from '../FieldComponents';
|
|
3
3
|
import { type FormControlProps } from '../FormControl';
|
|
4
4
|
import { type FormControlLabelProps } from '../FormControlLabel';
|
|
5
|
-
export declare const InputNumber: import("react").ForwardRefExoticComponent<Omit<Omit<import("@koobiq/react-primitives").NumberFieldProps, "children" | "validationState" | "description" | "inputElementType">, "caption" | "style" | "className" | "labelPlacement" | "labelAlign" | "fullWidth" | "variant" | "slotProps" | "data-testid" | "startAddon" | "endAddon" | "
|
|
5
|
+
export declare const InputNumber: import("react").ForwardRefExoticComponent<Omit<Omit<import("@koobiq/react-primitives").NumberFieldProps, "children" | "validationState" | "description" | "inputElementType">, "caption" | "style" | "className" | "labelPlacement" | "labelAlign" | "fullWidth" | "variant" | "slotProps" | "data-testid" | "startAddon" | "endAddon" | "isLabelHidden" | keyof {
|
|
6
6
|
disabled?: boolean;
|
|
7
7
|
error?: boolean;
|
|
8
8
|
required?: boolean;
|
|
@@ -10,7 +10,6 @@ export declare const InputNumber: import("react").ForwardRefExoticComponent<Omit
|
|
|
10
10
|
hiddenLabel?: boolean;
|
|
11
11
|
}> & {
|
|
12
12
|
className?: string;
|
|
13
|
-
errorMessage?: import("react").ReactNode;
|
|
14
13
|
startAddon?: import("react").ReactNode;
|
|
15
14
|
endAddon?: import("react").ReactNode;
|
|
16
15
|
variant?: import("./types").InputNumberPropVariant;
|
|
@@ -16,7 +16,7 @@ const InputNumber = forwardRef(
|
|
|
16
16
|
(props, ref) => {
|
|
17
17
|
const {
|
|
18
18
|
variant = "filled",
|
|
19
|
-
fullWidth
|
|
19
|
+
fullWidth,
|
|
20
20
|
hiddenLabel,
|
|
21
21
|
isLabelHidden: isLabelHiddenProp,
|
|
22
22
|
disabled,
|
|
@@ -38,11 +38,11 @@ const InputNumber = forwardRef(
|
|
|
38
38
|
...other
|
|
39
39
|
} = props;
|
|
40
40
|
const inputRef = useDOMRef(ref);
|
|
41
|
-
const isDisabled = isDisabledProp ?? disabled
|
|
42
|
-
const isRequired = isRequiredProp ?? required
|
|
43
|
-
const isReadOnly = isReadOnlyProp ?? readonly
|
|
44
|
-
const isInvalid = isInvalidProp ?? error
|
|
45
|
-
const isLabelHidden = isLabelHiddenProp ?? hiddenLabel
|
|
41
|
+
const isDisabled = isDisabledProp ?? disabled;
|
|
42
|
+
const isRequired = isRequiredProp ?? required;
|
|
43
|
+
const isReadOnly = isReadOnlyProp ?? readonly;
|
|
44
|
+
const isInvalid = isInvalidProp ?? error;
|
|
45
|
+
const isLabelHidden = isLabelHiddenProp ?? hiddenLabel;
|
|
46
46
|
if (process.env.NODE_ENV !== "production" && "disabled" in props) {
|
|
47
47
|
deprecate(
|
|
48
48
|
'InputNumber: the "disabled" prop is deprecated. Use "isDisabled" prop to replace it.'
|
|
@@ -99,7 +99,7 @@ const InputNumber = forwardRef(
|
|
|
99
99
|
slotProps?.input
|
|
100
100
|
);
|
|
101
101
|
const captionProps = mergeProps({ children: caption }, slotProps?.caption);
|
|
102
|
-
const errorProps = mergeProps({
|
|
102
|
+
const errorProps = mergeProps({ children: errorMessage }, slotProps?.errorMessage);
|
|
103
103
|
const groupProps = mergeProps(
|
|
104
104
|
{
|
|
105
105
|
endAddon: /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
@@ -13,35 +13,30 @@ export type InputNumberPropLabelAlign = FormControlPropLabelAlign;
|
|
|
13
13
|
type InputNumberDeprecatedProps = {
|
|
14
14
|
/**
|
|
15
15
|
* If `true`, the component is disabled.
|
|
16
|
-
* @default false
|
|
17
16
|
* @deprecated
|
|
18
17
|
* The "disabled" prop is deprecated. Use "isDisabled" prop to replace it.
|
|
19
18
|
*/
|
|
20
19
|
disabled?: boolean;
|
|
21
20
|
/**
|
|
22
21
|
* If `true`, the input will indicate an error.
|
|
23
|
-
* @default false
|
|
24
22
|
* @deprecated
|
|
25
23
|
* The "error" prop is deprecated. Use "isInvalid" prop to replace it.
|
|
26
24
|
*/
|
|
27
25
|
error?: boolean;
|
|
28
26
|
/**
|
|
29
27
|
* If `true`, the label is displayed as required and the input element is required.
|
|
30
|
-
* @default false
|
|
31
28
|
* @deprecated
|
|
32
29
|
* The "required" prop is deprecated. Use "isRequired" prop to replace it.
|
|
33
30
|
*/
|
|
34
31
|
required?: boolean;
|
|
35
32
|
/**
|
|
36
33
|
* If `true`, the input can be selected but not changed by the user.
|
|
37
|
-
* @default false
|
|
38
34
|
* @deprecated
|
|
39
35
|
* The "readonly" prop is deprecated. Use "isReadOnly" prop to replace it.
|
|
40
36
|
*/
|
|
41
37
|
readonly?: boolean;
|
|
42
38
|
/**
|
|
43
39
|
* If `true`, the label is hidden. Be sure to add aria-label to the input element.
|
|
44
|
-
* @default false
|
|
45
40
|
* @deprecated
|
|
46
41
|
* The "hiddenLabel" prop is deprecated. Use "isLabelHidden" prop to replace it.
|
|
47
42
|
*/
|
|
@@ -50,8 +45,6 @@ type InputNumberDeprecatedProps = {
|
|
|
50
45
|
export type InputNumberProps = ExtendableProps<{
|
|
51
46
|
/** Additional CSS-classes. */
|
|
52
47
|
className?: string;
|
|
53
|
-
/** An error message for the field. */
|
|
54
|
-
errorMessage?: ReactNode;
|
|
55
48
|
/** Addon placed before the children. */
|
|
56
49
|
startAddon?: ReactNode;
|
|
57
50
|
/** Addon placed after the children. */
|
|
@@ -63,12 +56,10 @@ export type InputNumberProps = ExtendableProps<{
|
|
|
63
56
|
variant?: InputNumberPropVariant;
|
|
64
57
|
/**
|
|
65
58
|
* If true, the input will take up the full width of its container.
|
|
66
|
-
* @default false
|
|
67
59
|
*/
|
|
68
60
|
fullWidth?: boolean;
|
|
69
61
|
/**
|
|
70
62
|
* If `true`, the label is hidden. Be sure to add aria-label to the input element.
|
|
71
|
-
* @default false
|
|
72
63
|
*/
|
|
73
64
|
isLabelHidden?: boolean;
|
|
74
65
|
/**
|
|
@@ -20,9 +20,9 @@ const Link = polymorphicForwardRef((props, ref) => {
|
|
|
20
20
|
className,
|
|
21
21
|
...other
|
|
22
22
|
} = props;
|
|
23
|
-
const allowVisited = allowVisitedProp ?? visitable
|
|
24
|
-
const isDisabled = isDisabledProp ?? disabled
|
|
25
|
-
const isPseudo = isPseudoProp ?? pseudo
|
|
23
|
+
const allowVisited = allowVisitedProp ?? visitable;
|
|
24
|
+
const isDisabled = isDisabledProp ?? disabled;
|
|
25
|
+
const isPseudo = isPseudoProp ?? pseudo;
|
|
26
26
|
const hasIcon = Boolean(startIcon || endIcon);
|
|
27
27
|
if (process.env.NODE_ENV !== "production" && "visitable" in props) {
|
|
28
28
|
deprecate(
|
|
@@ -6,21 +6,18 @@ export type LinkPropVariant = Extract<TypographyPropVariant, 'text-compact' | 't
|
|
|
6
6
|
type LinkDeprecatedProps = {
|
|
7
7
|
/**
|
|
8
8
|
* If `true`, the component is disabled.
|
|
9
|
-
* @default false
|
|
10
9
|
* @deprecated
|
|
11
10
|
* The "disabled" prop is deprecated. Use "isDisabled" prop to replace it.
|
|
12
11
|
*/
|
|
13
12
|
disabled?: boolean;
|
|
14
13
|
/**
|
|
15
14
|
* If `true`, displays :visited CSS-state.
|
|
16
|
-
* @default false
|
|
17
15
|
* @deprecated
|
|
18
16
|
* The "visitable" prop is deprecated. Use "isVisitable" prop to replace it.
|
|
19
17
|
*/
|
|
20
18
|
visitable?: boolean;
|
|
21
19
|
/**
|
|
22
20
|
* If `true`, displays the link as a pseudo-link.
|
|
23
|
-
* @default false
|
|
24
21
|
* @deprecated
|
|
25
22
|
* The "pseudo" prop is deprecated. Use "isPseudo" prop to replace it.
|
|
26
23
|
*/
|
|
@@ -37,12 +34,10 @@ export type LinkBaseProps = ExtendableProps<{
|
|
|
37
34
|
endIcon?: ReactNode;
|
|
38
35
|
/**
|
|
39
36
|
* If `true`, displays :visited CSS-state.
|
|
40
|
-
* @default false
|
|
41
37
|
*/
|
|
42
38
|
allowVisited?: boolean;
|
|
43
39
|
/**
|
|
44
40
|
* If `true`, displays the link as a pseudo-link.
|
|
45
|
-
* @default false
|
|
46
41
|
*/
|
|
47
42
|
isPseudo?: boolean;
|
|
48
43
|
/** Additional CSS-classes. */
|
|
@@ -24,11 +24,11 @@ function ListOption({ item, state }) {
|
|
|
24
24
|
className: clsx(listItem, textVariant["text-normal"], className),
|
|
25
25
|
style,
|
|
26
26
|
ref,
|
|
27
|
-
"data-hovered": isHovered,
|
|
28
|
-
"data-pressed": isPressed,
|
|
29
|
-
"data-disabled": isDisabled,
|
|
30
|
-
"data-selected": isSelected,
|
|
31
|
-
"data-focus-visible": isFocusVisible,
|
|
27
|
+
"data-hovered": isHovered || void 0,
|
|
28
|
+
"data-pressed": isPressed || void 0,
|
|
29
|
+
"data-disabled": isDisabled || void 0,
|
|
30
|
+
"data-selected": isSelected || void 0,
|
|
31
|
+
"data-focus-visible": isFocusVisible || void 0,
|
|
32
32
|
children: item.rendered
|
|
33
33
|
}
|
|
34
34
|
);
|
|
@@ -32,7 +32,7 @@ export type ModalProps = {
|
|
|
32
32
|
control?: ModalPropControl;
|
|
33
33
|
/**
|
|
34
34
|
* If `true`, the close button isn't shown.
|
|
35
|
-
* @default
|
|
35
|
+
* @default
|
|
36
36
|
*/
|
|
37
37
|
hideCloseButton?: boolean;
|
|
38
38
|
/** Handler that is called when the modal's open state changes. */
|
|
@@ -44,17 +44,14 @@ export type ModalProps = {
|
|
|
44
44
|
portalContainer?: Element;
|
|
45
45
|
/**
|
|
46
46
|
* If `true`, the modal window won't close when clicked outside of it.
|
|
47
|
-
* @default false
|
|
48
47
|
*/
|
|
49
48
|
disableExitOnClickOutside?: boolean;
|
|
50
49
|
/**
|
|
51
50
|
* If `true`, the modal window won't close when the ESC key is pressed.
|
|
52
|
-
* @default false
|
|
53
51
|
*/
|
|
54
52
|
disableExitOnEscapeKeyDown?: boolean;
|
|
55
53
|
/**
|
|
56
54
|
* If `true`, the underlay (backdrop) under the modal window isn't shown.
|
|
57
|
-
* @default false
|
|
58
55
|
*/
|
|
59
56
|
hideBackdrop?: boolean;
|
|
60
57
|
/** Additional CSS-classes. */
|
|
@@ -63,7 +60,6 @@ export type ModalProps = {
|
|
|
63
60
|
'data-testid'?: string | number;
|
|
64
61
|
/**
|
|
65
62
|
* If `true`, the focus trap in modal window is disabled.
|
|
66
|
-
* @default false
|
|
67
63
|
*/
|
|
68
64
|
disableFocusManagement?: boolean;
|
|
69
65
|
/**
|
|
@@ -11,12 +11,12 @@ const PopoverInner = (props) => {
|
|
|
11
11
|
offset = 0,
|
|
12
12
|
size = "medium",
|
|
13
13
|
crossOffset = 0,
|
|
14
|
-
hideArrow = false,
|
|
15
14
|
containerPadding = 12,
|
|
16
15
|
arrowBoundaryOffset = 20,
|
|
17
16
|
placement: placementProp = "top",
|
|
18
17
|
maxBlockSize = 480,
|
|
19
18
|
type = "dialog",
|
|
19
|
+
hideArrow,
|
|
20
20
|
state,
|
|
21
21
|
control,
|
|
22
22
|
children,
|
|
@@ -117,7 +117,7 @@ const PopoverInner = (props) => {
|
|
|
117
117
|
{
|
|
118
118
|
ref: domRef,
|
|
119
119
|
"data-size": size,
|
|
120
|
-
"data-arrow": showArrow,
|
|
120
|
+
"data-arrow": showArrow || void 0,
|
|
121
121
|
"data-placement": placement,
|
|
122
122
|
"data-transition": transition,
|
|
123
123
|
className: clsx(s.base, s[size], className),
|
|
@@ -38,7 +38,6 @@ export type PopoverProps = {
|
|
|
38
38
|
size?: PopoverPropSize;
|
|
39
39
|
/**
|
|
40
40
|
* If `true`, the close button isn't shown.
|
|
41
|
-
* @default false
|
|
42
41
|
*/
|
|
43
42
|
hideCloseButton?: boolean;
|
|
44
43
|
/** Handler that is called when the modal's open state changes. */
|
|
@@ -50,7 +49,6 @@ export type PopoverProps = {
|
|
|
50
49
|
portalContainer?: Element;
|
|
51
50
|
/**
|
|
52
51
|
* If `true`, the modal window won't close when the ESC key is pressed.
|
|
53
|
-
* @default false
|
|
54
52
|
*/
|
|
55
53
|
disableExitOnEscapeKeyDown?: boolean;
|
|
56
54
|
/** Additional CSS-classes. */
|
|
@@ -61,7 +59,6 @@ export type PopoverProps = {
|
|
|
61
59
|
'data-testid'?: string | number;
|
|
62
60
|
/**
|
|
63
61
|
* If `true`, the focus trap in modal window is disabled.
|
|
64
|
-
* @default false
|
|
65
62
|
*/
|
|
66
63
|
disableFocusManagement?: boolean;
|
|
67
64
|
/**
|
|
@@ -73,7 +70,6 @@ export type PopoverProps = {
|
|
|
73
70
|
anchorRef?: RefObject<HTMLElement | null>;
|
|
74
71
|
/**
|
|
75
72
|
* If `true`, the arrow isn't shown.
|
|
76
|
-
* @default false
|
|
77
73
|
*/
|
|
78
74
|
hideArrow?: boolean;
|
|
79
75
|
/**
|
|
@@ -15,7 +15,7 @@ import { FieldError } from "../FieldComponents/FieldError/FieldError.js";
|
|
|
15
15
|
const RadioGroup = forwardRef(
|
|
16
16
|
(props, ref) => {
|
|
17
17
|
const {
|
|
18
|
-
size,
|
|
18
|
+
size = "normal",
|
|
19
19
|
label,
|
|
20
20
|
children,
|
|
21
21
|
slotProps,
|
|
@@ -39,10 +39,10 @@ const RadioGroup = forwardRef(
|
|
|
39
39
|
required
|
|
40
40
|
} = props;
|
|
41
41
|
const caption = captionProp ?? description;
|
|
42
|
-
const isDisabled = isDisabledProp ?? disabled
|
|
43
|
-
const isInvalid = isInvalidProp ?? error
|
|
44
|
-
const isReadOnly = isReadOnlyProp ?? readonly
|
|
45
|
-
const isRequired = isRequiredProp ?? required
|
|
42
|
+
const isDisabled = isDisabledProp ?? disabled;
|
|
43
|
+
const isInvalid = isInvalidProp ?? error;
|
|
44
|
+
const isReadOnly = isReadOnlyProp ?? readonly;
|
|
45
|
+
const isRequired = isRequiredProp ?? required;
|
|
46
46
|
if (process.env.NODE_ENV !== "production" && "description" in props) {
|
|
47
47
|
deprecate(
|
|
48
48
|
'RadioGroup: the "description" prop is deprecated. Use "caption" prop to replace it.'
|
|
@@ -82,10 +82,7 @@ const RadioGroup = forwardRef(
|
|
|
82
82
|
ref,
|
|
83
83
|
"data-size": size,
|
|
84
84
|
"data-testid": testId,
|
|
85
|
-
"data-
|
|
86
|
-
"data-disabled": isDisabled,
|
|
87
|
-
"data-required": isRequired,
|
|
88
|
-
"data-readonly": isReadOnly
|
|
85
|
+
"data-orientation": orientation
|
|
89
86
|
},
|
|
90
87
|
slotProps?.root
|
|
91
88
|
);
|
|
@@ -99,7 +96,7 @@ const RadioGroup = forwardRef(
|
|
|
99
96
|
},
|
|
100
97
|
slotProps?.radioGroup
|
|
101
98
|
);
|
|
102
|
-
return /* @__PURE__ */ jsx(RadioGroupContext.Provider, { value: { size }, children: /* @__PURE__ */ jsx(FormControl, { as: RadioGroup$1, ...rootProps, children: ({
|
|
99
|
+
return /* @__PURE__ */ jsx(RadioGroupContext.Provider, { value: { size }, children: /* @__PURE__ */ jsx(FormControl, { as: RadioGroup$1, ...rootProps, children: ({ isRequired: isRequired2 }) => {
|
|
103
100
|
const labelProps = mergeProps(
|
|
104
101
|
{
|
|
105
102
|
as: "span",
|
|
@@ -110,7 +107,7 @@ const RadioGroup = forwardRef(
|
|
|
110
107
|
},
|
|
111
108
|
slotProps?.label
|
|
112
109
|
);
|
|
113
|
-
const errorProps = mergeProps({
|
|
110
|
+
const errorProps = mergeProps({ children: errorMessage }, slotProps?.errorMessage);
|
|
114
111
|
const captionProps = mergeProps({ children: caption }, slotProps?.caption);
|
|
115
112
|
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
116
113
|
/* @__PURE__ */ jsx(FormControlLabel, { ...labelProps }),
|
|
@@ -8,7 +8,6 @@ export type RadioPropLabelPlacement = (typeof radioPropLabelPlacement)[number];
|
|
|
8
8
|
type RadioDeprecatedProps = {
|
|
9
9
|
/**
|
|
10
10
|
* If `true`, the component is disabled.
|
|
11
|
-
* @default false
|
|
12
11
|
* @deprecated
|
|
13
12
|
* The "disabled" prop is deprecated. Use "isDisabled" prop to replace it.
|
|
14
13
|
*/
|
|
@@ -15,28 +15,24 @@ export type RadioGroupPropLabelAlign = FormControlPropLabelAlign;
|
|
|
15
15
|
type RadioGroupDeprecatedProps = {
|
|
16
16
|
/**
|
|
17
17
|
* If `true`, the component is disabled.
|
|
18
|
-
* @default false
|
|
19
18
|
* @deprecated
|
|
20
19
|
* The "disabled" prop is deprecated. Use "isDisabled" prop to replace it.
|
|
21
20
|
*/
|
|
22
21
|
disabled?: boolean;
|
|
23
22
|
/**
|
|
24
23
|
* If `true`, the component will indicate an error.
|
|
25
|
-
* @default false
|
|
26
24
|
* @deprecated
|
|
27
25
|
* The "error" prop is deprecated. Use "isInvalid" prop to replace it.
|
|
28
26
|
*/
|
|
29
27
|
error?: boolean;
|
|
30
28
|
/**
|
|
31
29
|
* It prevents the user from changing the value of the checkbox.
|
|
32
|
-
* @default false
|
|
33
30
|
* @deprecated
|
|
34
31
|
* The "readonly" prop is deprecated. Use "isReadonly" prop to replace it.
|
|
35
32
|
*/
|
|
36
33
|
readonly?: boolean;
|
|
37
34
|
/**
|
|
38
35
|
* If `true`, the input element is required.
|
|
39
|
-
* @default false
|
|
40
36
|
* @deprecated
|
|
41
37
|
* The "required" prop is deprecated. Use "isRequired" prop to replace it.
|
|
42
38
|
*/
|
|
@@ -71,11 +67,8 @@ export type RadioGroupBaseProps = ExtendableProps<{
|
|
|
71
67
|
orientation?: RadioGroupPropOrientation;
|
|
72
68
|
/**
|
|
73
69
|
* If `true`, the label is hidden. Be sure to add aria-label to the input element.
|
|
74
|
-
* @default false
|
|
75
70
|
*/
|
|
76
71
|
isLabelHidden?: boolean;
|
|
77
|
-
/** An error message for the field. */
|
|
78
|
-
errorMessage?: ReactNode;
|
|
79
72
|
/**
|
|
80
73
|
* The label's overall position relative to the element it is labeling.
|
|
81
74
|
* @default 'top'
|
|
@@ -94,6 +87,6 @@ export type RadioGroupBaseProps = ExtendableProps<{
|
|
|
94
87
|
label?: FormControlLabelProps<'span'>;
|
|
95
88
|
radioGroup?: ComponentPropsWithRef<'div'>;
|
|
96
89
|
};
|
|
97
|
-
} & RadioGroupDeprecatedProps, Omit<RadioGroupPrimitiveProps, '
|
|
90
|
+
} & RadioGroupDeprecatedProps, Omit<RadioGroupPrimitiveProps, 'validationState'>>;
|
|
98
91
|
export type RadioGroupProps = ExtendableComponentPropsWithRef<RadioGroupBaseProps, 'div'>;
|
|
99
92
|
export {};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { type FieldCaptionProps, type FieldContentGroupProps, type
|
|
1
|
+
import { type FieldCaptionProps, type FieldContentGroupProps, type FieldInputProps, type FieldErrorProps } from '../FieldComponents';
|
|
2
2
|
import { type FormControlProps } from '../FormControl';
|
|
3
3
|
import { type FormControlLabelProps } from '../FormControlLabel';
|
|
4
|
-
export declare const SearchInput: import("react").ForwardRefExoticComponent<Omit<Omit<import("@react-types/searchfield").AriaSearchFieldProps, "validationState" | "description"
|
|
4
|
+
export declare const SearchInput: import("react").ForwardRefExoticComponent<Omit<Omit<import("@react-types/searchfield").AriaSearchFieldProps, "validationState" | "description">, "caption" | "style" | "className" | `data-${string}` | "labelPlacement" | "labelAlign" | "fullWidth" | "variant" | "slotProps" | "startAddon" | "endAddon" | "isLabelHidden"> & {
|
|
5
5
|
className?: string;
|
|
6
6
|
style?: import("react").CSSProperties;
|
|
7
7
|
isLabelHidden?: boolean;
|
|
@@ -18,7 +18,6 @@ export declare const SearchInput: import("react").ForwardRefExoticComponent<Omit
|
|
|
18
18
|
errorMessage?: FieldErrorProps;
|
|
19
19
|
clearButton?: import("..").IconButtonProps;
|
|
20
20
|
};
|
|
21
|
-
errorMessage?: import("react").ReactNode;
|
|
22
21
|
caption?: import("react").ReactNode;
|
|
23
22
|
variant?: import("./types").SearchInputPropVariant;
|
|
24
23
|
fullWidth?: boolean;
|