@aivenio/aquarium 1.32.0 → 1.33.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/_variables.scss +1 -1
- package/dist/_variables_timescale.scss +1 -1
- package/dist/src/utils/form/Label/Label.d.ts +5 -1
- package/dist/src/utils/form/Label/Label.js +16 -13
- package/dist/system.cjs +10 -3
- package/dist/system.mjs +10 -3
- package/dist/tsconfig.module.tsbuildinfo +1 -1
- package/package.json +1 -1
package/dist/_variables.scss
CHANGED
@@ -43,6 +43,10 @@ export declare type LabelProps = {
|
|
43
43
|
* Optional `data-testid` property for the label wrapper.
|
44
44
|
*/
|
45
45
|
'data-testid'?: string;
|
46
|
+
/**
|
47
|
+
* Optional input field description. If provided, description will be attached to right below the label.
|
48
|
+
*/
|
49
|
+
'description'?: React.ReactNode;
|
46
50
|
};
|
47
51
|
export declare const Label: React.FC<LabelProps> & {
|
48
52
|
Skeleton: typeof LabelSkeleton;
|
@@ -80,5 +84,5 @@ export declare type LabelControlProps = Omit<HelperTextProps, 'error'> & Omit<La
|
|
80
84
|
export declare const LabelControl: React.FC<LabelControlProps> & {
|
81
85
|
Skeleton: React.FC;
|
82
86
|
};
|
83
|
-
export declare const getLabelControlProps: <T extends LabelControlProps>({ labelText, required, valid, disabled, "labelProps": { ...labelProps }, helpTooltip, helpTooltipPlacement, maxLength, error, helperText, reserveSpaceForError, "data-testid": dataTestId, }: T) => LabelControlProps;
|
87
|
+
export declare const getLabelControlProps: <T extends LabelControlProps>({ labelText, required, valid, disabled, "labelProps": { ...labelProps }, helpTooltip, helpTooltipPlacement, description, maxLength, error, helperText, reserveSpaceForError, "data-testid": dataTestId, }: T) => LabelControlProps;
|
84
88
|
export {};
|
@@ -16,17 +16,19 @@ import { FormControl } from '../../../../src/utils/form/FormControl/FormControl'
|
|
16
16
|
import { HelperText } from '../../../../src/utils/form/HelperText/HelperText';
|
17
17
|
import { tw } from '../../../../src/utils/tailwind';
|
18
18
|
import questionMark from '../../../../src/icons/questionMark';
|
19
|
-
const LabelText = ({ variant = 'default', labelText, required, helpTooltip, helpTooltipPlacement, }) => {
|
20
|
-
return (React.createElement("span", { className: tw('
|
21
|
-
|
22
|
-
|
23
|
-
|
24
|
-
|
25
|
-
|
26
|
-
|
27
|
-
|
28
|
-
React.createElement(
|
29
|
-
React.createElement(
|
19
|
+
const LabelText = ({ variant = 'default', labelText, required, helpTooltip, helpTooltipPlacement, description, }) => {
|
20
|
+
return (React.createElement("span", { className: tw('block mb-2') },
|
21
|
+
React.createElement("span", { className: tw('inline-flex items-center typography-small-strong', {
|
22
|
+
'text-grey-60': variant === 'default',
|
23
|
+
'text-error-50': variant === 'error',
|
24
|
+
'text-grey-40': variant === 'disabled',
|
25
|
+
}) },
|
26
|
+
labelText,
|
27
|
+
required && React.createElement("span", { className: tw('text-error-50') }, "*"),
|
28
|
+
helpTooltip && (React.createElement(Tooltip, { content: helpTooltip, placement: helpTooltipPlacement },
|
29
|
+
React.createElement("span", { tabIndex: 0, className: tw('text-grey-40 flex items-center cursor-pointer ml-2') },
|
30
|
+
React.createElement(InlineIcon, { icon: questionMark, "data-testid": "icon-info" }))))),
|
31
|
+
description && React.createElement("span", { className: tw('block text-grey-50 typography-caption mt-1') }, description)));
|
30
32
|
};
|
31
33
|
export const Label = (props) => {
|
32
34
|
const { id, htmlFor, labelText } = props, _a = props["labelProps"], _b = _a === void 0 ? {} : _a, labelProps = __rest(_b, []), { 'data-testid': dataTestid, children } = props;
|
@@ -72,7 +74,7 @@ const LabelControlSkeleton = ({ children }) => (React.createElement("div", null,
|
|
72
74
|
React.createElement(HelperText.Skeleton, null)));
|
73
75
|
LabelControl.Skeleton = LabelControlSkeleton;
|
74
76
|
export const getLabelControlProps = (_a) => {
|
75
|
-
var { labelText, required, valid = true, disabled = false } = _a, _b = _a["labelProps"], _c = _b === void 0 ? {} : _b, labelProps = __rest(_c, []), { helpTooltip, helpTooltipPlacement, maxLength, error, helperText, reserveSpaceForError, 'data-testid': dataTestId } = _a;
|
77
|
+
var { labelText, required, valid = true, disabled = false } = _a, _b = _a["labelProps"], _c = _b === void 0 ? {} : _b, labelProps = __rest(_c, []), { helpTooltip, helpTooltipPlacement, description, maxLength, error, helperText, reserveSpaceForError, 'data-testid': dataTestId } = _a;
|
76
78
|
return ({
|
77
79
|
labelText,
|
78
80
|
required,
|
@@ -81,6 +83,7 @@ export const getLabelControlProps = (_a) => {
|
|
81
83
|
labelProps,
|
82
84
|
helpTooltip,
|
83
85
|
helpTooltipPlacement,
|
86
|
+
description,
|
84
87
|
error,
|
85
88
|
helperText,
|
86
89
|
maxLength,
|
@@ -88,4 +91,4 @@ export const getLabelControlProps = (_a) => {
|
|
88
91
|
'data-testid': dataTestId,
|
89
92
|
});
|
90
93
|
};
|
91
|
-
//# sourceMappingURL=data:application/json;base64,
|
94
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTGFiZWwuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9zcmMvdXRpbHMvZm9ybS9MYWJlbC9MYWJlbC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7QUFBQSxPQUFPLEtBQUssTUFBTSxPQUFPLENBQUM7QUFHMUIsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLGlDQUFpQyxDQUFDO0FBRTNELE9BQU8sRUFBRSxVQUFVLEVBQUUsT0FBTyxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ3BELE9BQU8sRUFBRSxXQUFXLEVBQUUsTUFBTSx3Q0FBd0MsQ0FBQztBQUNyRSxPQUFPLEVBQUUsVUFBVSxFQUF3QixNQUFNLHNDQUFzQyxDQUFDO0FBQ3hGLE9BQU8sRUFBRSxFQUFFLEVBQUUsTUFBTSxvQkFBb0IsQ0FBQztBQUV4QyxPQUFPLFlBQVksTUFBTSx3QkFBd0IsQ0FBQztBQTREbEQsTUFBTSxTQUFTLEdBQXlCLENBQUMsRUFDdkMsT0FBTyxHQUFHLFNBQVMsRUFDbkIsU0FBUyxFQUNULFFBQVEsRUFDUixXQUFXLEVBQ1gsb0JBQW9CLEVBQ3BCLFdBQVcsR0FDWixFQUFFLEVBQUU7SUFDSCxPQUFPLENBQ0wsOEJBQU0sU0FBUyxFQUFFLEVBQUUsQ0FBQyxZQUFZLENBQUM7UUFDL0IsOEJBQ0UsU0FBUyxFQUFFLEVBQUUsQ0FBQyxrREFBa0QsRUFBRTtnQkFDaEUsY0FBYyxFQUFFLE9BQU8sS0FBSyxTQUFTO2dCQUNyQyxlQUFlLEVBQUUsT0FBTyxLQUFLLE9BQU87Z0JBQ3BDLGNBQWMsRUFBRSxPQUFPLEtBQUssVUFBVTthQUN2QyxDQUFDO1lBRUQsU0FBUztZQUNULFFBQVEsSUFBSSw4QkFBTSxTQUFTLEVBQUUsRUFBRSxDQUFDLGVBQWUsQ0FBQyxRQUFVO1lBQzFELFdBQVcsSUFBSSxDQUNkLG9CQUFDLE9BQU8sSUFBQyxPQUFPLEVBQUUsV0FBVyxFQUFFLFNBQVMsRUFBRSxvQkFBb0I7Z0JBQzVELDhCQUFN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
|
package/dist/system.cjs
CHANGED
@@ -8786,10 +8786,13 @@ var LabelText = ({
|
|
8786
8786
|
labelText,
|
8787
8787
|
required,
|
8788
8788
|
helpTooltip,
|
8789
|
-
helpTooltipPlacement
|
8789
|
+
helpTooltipPlacement,
|
8790
|
+
description
|
8790
8791
|
}) => {
|
8791
8792
|
return /* @__PURE__ */ import_react46.default.createElement("span", {
|
8792
|
-
className: tw("
|
8793
|
+
className: tw("block mb-2")
|
8794
|
+
}, /* @__PURE__ */ import_react46.default.createElement("span", {
|
8795
|
+
className: tw("inline-flex items-center typography-small-strong", {
|
8793
8796
|
"text-grey-60": variant === "default",
|
8794
8797
|
"text-error-50": variant === "error",
|
8795
8798
|
"text-grey-40": variant === "disabled"
|
@@ -8805,7 +8808,9 @@ var LabelText = ({
|
|
8805
8808
|
}, /* @__PURE__ */ import_react46.default.createElement(InlineIcon, {
|
8806
8809
|
icon: import_questionMark2.default,
|
8807
8810
|
"data-testid": "icon-info"
|
8808
|
-
}))))
|
8811
|
+
})))), description && /* @__PURE__ */ import_react46.default.createElement("span", {
|
8812
|
+
className: tw("block text-grey-50 typography-caption mt-1")
|
8813
|
+
}, description));
|
8809
8814
|
};
|
8810
8815
|
var Label = (props) => {
|
8811
8816
|
const _a = props, { id, htmlFor, labelText, labelProps: _b = {} } = _a, labelProps = __objRest(_b, []), { "data-testid": dataTestid, children } = _a;
|
@@ -8883,6 +8888,7 @@ var getLabelControlProps = (_a) => {
|
|
8883
8888
|
} = _b, labelProps = __objRest(_c, []), {
|
8884
8889
|
helpTooltip,
|
8885
8890
|
helpTooltipPlacement,
|
8891
|
+
description,
|
8886
8892
|
maxLength,
|
8887
8893
|
error: error2,
|
8888
8894
|
helperText,
|
@@ -8897,6 +8903,7 @@ var getLabelControlProps = (_a) => {
|
|
8897
8903
|
labelProps,
|
8898
8904
|
helpTooltip,
|
8899
8905
|
helpTooltipPlacement,
|
8906
|
+
description,
|
8900
8907
|
error: error2,
|
8901
8908
|
helperText,
|
8902
8909
|
maxLength,
|
package/dist/system.mjs
CHANGED
@@ -8643,10 +8643,13 @@ var LabelText = ({
|
|
8643
8643
|
labelText,
|
8644
8644
|
required,
|
8645
8645
|
helpTooltip,
|
8646
|
-
helpTooltipPlacement
|
8646
|
+
helpTooltipPlacement,
|
8647
|
+
description
|
8647
8648
|
}) => {
|
8648
8649
|
return /* @__PURE__ */ React41.createElement("span", {
|
8649
|
-
className: tw("
|
8650
|
+
className: tw("block mb-2")
|
8651
|
+
}, /* @__PURE__ */ React41.createElement("span", {
|
8652
|
+
className: tw("inline-flex items-center typography-small-strong", {
|
8650
8653
|
"text-grey-60": variant === "default",
|
8651
8654
|
"text-error-50": variant === "error",
|
8652
8655
|
"text-grey-40": variant === "disabled"
|
@@ -8662,7 +8665,9 @@ var LabelText = ({
|
|
8662
8665
|
}, /* @__PURE__ */ React41.createElement(InlineIcon, {
|
8663
8666
|
icon: import_questionMark2.default,
|
8664
8667
|
"data-testid": "icon-info"
|
8665
|
-
}))))
|
8668
|
+
})))), description && /* @__PURE__ */ React41.createElement("span", {
|
8669
|
+
className: tw("block text-grey-50 typography-caption mt-1")
|
8670
|
+
}, description));
|
8666
8671
|
};
|
8667
8672
|
var Label = (props) => {
|
8668
8673
|
const _a = props, { id, htmlFor, labelText, labelProps: _b = {} } = _a, labelProps = __objRest(_b, []), { "data-testid": dataTestid, children } = _a;
|
@@ -8740,6 +8745,7 @@ var getLabelControlProps = (_a) => {
|
|
8740
8745
|
} = _b, labelProps = __objRest(_c, []), {
|
8741
8746
|
helpTooltip,
|
8742
8747
|
helpTooltipPlacement,
|
8748
|
+
description,
|
8743
8749
|
maxLength,
|
8744
8750
|
error: error2,
|
8745
8751
|
helperText,
|
@@ -8754,6 +8760,7 @@ var getLabelControlProps = (_a) => {
|
|
8754
8760
|
labelProps,
|
8755
8761
|
helpTooltip,
|
8756
8762
|
helpTooltipPlacement,
|
8763
|
+
description,
|
8757
8764
|
error: error2,
|
8758
8765
|
helperText,
|
8759
8766
|
maxLength,
|