@navikt/ds-react 0.19.12 → 0.19.13
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/cjs/form/ConfirmationPanel.js +1 -1
- package/cjs/form/Select.js +7 -5
- package/cjs/form/TextField.js +5 -4
- package/cjs/form/Textarea.js +7 -5
- package/cjs/form/search/Search.js +3 -3
- package/esm/form/ConfirmationPanel.js +1 -1
- package/esm/form/ConfirmationPanel.js.map +1 -1
- package/esm/form/Select.js +8 -6
- package/esm/form/Select.js.map +1 -1
- package/esm/form/TextField.js +5 -4
- package/esm/form/TextField.js.map +1 -1
- package/esm/form/Textarea.js +8 -6
- package/esm/form/Textarea.js.map +1 -1
- package/esm/form/search/Search.js +3 -3
- package/esm/form/search/Search.js.map +1 -1
- package/package.json +2 -2
- package/src/form/ConfirmationPanel.tsx +6 -1
- package/src/form/Select.tsx +34 -14
- package/src/form/TextField.tsx +10 -4
- package/src/form/Textarea.tsx +34 -14
- package/src/form/search/Search.tsx +7 -6
- package/src/form/stories/fieldset.stories.tsx +8 -2
- package/src/form/stories/textarea.stories.tsx +1 -0
|
@@ -53,6 +53,6 @@ exports.ConfirmationPanel = (0, react_1.forwardRef)((_a, ref) => {
|
|
|
53
53
|
react_1.default.createElement("div", { className: "navds-confirmation-panel__inner" },
|
|
54
54
|
children && (react_1.default.createElement(__1.BodyLong, { size: props.size, className: "navds-confirmation-panel__content" }, children)),
|
|
55
55
|
react_1.default.createElement(__1.Checkbox, Object.assign({}, props, inputProps, { error: hasError, size: size }), label)),
|
|
56
|
-
react_1.default.createElement("div", { id: errorId, "aria-relevant": "additions removals", "aria-live": "polite" }, showErrorMsg && react_1.default.createElement(__1.ErrorMessage, { size: size }, props.error))));
|
|
56
|
+
react_1.default.createElement("div", { className: "navds-form-field__error", id: errorId, "aria-relevant": "additions removals", "aria-live": "polite" }, showErrorMsg && react_1.default.createElement(__1.ErrorMessage, { size: size }, props.error))));
|
|
57
57
|
});
|
|
58
58
|
exports.default = exports.ConfirmationPanel;
|
package/cjs/form/Select.js
CHANGED
|
@@ -47,18 +47,20 @@ exports.Select = (0, react_1.forwardRef)((props, ref) => {
|
|
|
47
47
|
const { inputProps, errorId, showErrorMsg, hasError, size, inputDescriptionId, } = (0, useFormField_1.useFormField)(props, "textField");
|
|
48
48
|
const { children, label, className, description, htmlSize, hideLabel = false } = props, rest = __rest(props, ["children", "label", "className", "description", "htmlSize", "hideLabel"]);
|
|
49
49
|
return (react_1.default.createElement("div", { className: (0, classnames_1.default)(className, "navds-form-field", `navds-form-field--${size}`, {
|
|
50
|
+
"navds-form-field--disabled": !!inputProps.disabled,
|
|
50
51
|
"navds-select--error": hasError,
|
|
51
|
-
"navds-select--disabled": !!inputProps.disabled,
|
|
52
52
|
}) },
|
|
53
|
-
react_1.default.createElement(__1.Label, { htmlFor: inputProps.id, size: size, as: "label", className: (0, classnames_1.default)("navds-
|
|
53
|
+
react_1.default.createElement(__1.Label, { htmlFor: inputProps.id, size: size, as: "label", className: (0, classnames_1.default)("navds-form-field__label", {
|
|
54
54
|
"navds-sr-only": hideLabel,
|
|
55
55
|
}) }, label),
|
|
56
|
-
!!description && (react_1.default.createElement(
|
|
56
|
+
!!description && (react_1.default.createElement(react_1.default.Fragment, null, size === "medium" ? (react_1.default.createElement(__1.BodyShort, { className: (0, classnames_1.default)("navds-form-field__description", {
|
|
57
57
|
"navds-sr-only": hideLabel,
|
|
58
|
-
}), id: inputDescriptionId, size:
|
|
58
|
+
}), id: inputDescriptionId, size: "small", as: "div" }, description)) : (react_1.default.createElement(__1.Detail, { className: (0, classnames_1.default)("navds-form-field__description", {
|
|
59
|
+
"navds-sr-only": hideLabel,
|
|
60
|
+
}), id: inputDescriptionId, size: "small", as: "div" }, description)))),
|
|
59
61
|
react_1.default.createElement("div", { className: "navds-select__container" },
|
|
60
62
|
react_1.default.createElement("select", Object.assign({}, (0, __1.omit)(rest, ["error", "errorId", "size"]), inputProps, { ref: ref, className: (0, classnames_1.default)("navds-select__input", "navds-body-short", `navds-body--${size !== null && size !== void 0 ? size : "medium"}`), size: props.htmlSize }), children),
|
|
61
63
|
react_1.default.createElement(ds_icons_1.Expand, { className: "navds-select__chevron", "aria-hidden": true })),
|
|
62
|
-
react_1.default.createElement("div", { id: errorId, "aria-relevant": "additions removals", "aria-live": "polite" }, showErrorMsg && (react_1.default.createElement(__1.ErrorMessage, { size: size }, props.error)))));
|
|
64
|
+
react_1.default.createElement("div", { className: "navds-form-field__error", id: errorId, "aria-relevant": "additions removals", "aria-live": "polite" }, showErrorMsg && (react_1.default.createElement(__1.ErrorMessage, { size: size }, props.error)))));
|
|
63
65
|
});
|
|
64
66
|
exports.default = exports.Select;
|
package/cjs/form/TextField.js
CHANGED
|
@@ -48,16 +48,17 @@ exports.TextField = (0, react_1.forwardRef)((props, ref) => {
|
|
|
48
48
|
return (react_1.default.createElement("div", { className: (0, classnames_1.default)(className, "navds-form-field", `navds-form-field--${size}`, {
|
|
49
49
|
"navds-text-field--error": hasError,
|
|
50
50
|
"navds-text-field--disabled": !!inputProps.disabled,
|
|
51
|
+
"navds-form-field--disabled": !!inputProps.disabled,
|
|
51
52
|
}) },
|
|
52
|
-
react_1.default.createElement(__1.Label, { htmlFor: inputProps.id, size: size, as: "label", className: (0, classnames_1.default)("navds-
|
|
53
|
+
react_1.default.createElement(__1.Label, { htmlFor: inputProps.id, size: size, as: "label", className: (0, classnames_1.default)("navds-form-field__label", {
|
|
53
54
|
"navds-sr-only": hideLabel,
|
|
54
55
|
}) }, label),
|
|
55
|
-
!!description && (react_1.default.createElement(react_1.default.Fragment, null, size === "medium" ? (react_1.default.createElement(__1.BodyShort, { className: (0, classnames_1.default)("navds-
|
|
56
|
+
!!description && (react_1.default.createElement(react_1.default.Fragment, null, size === "medium" ? (react_1.default.createElement(__1.BodyShort, { className: (0, classnames_1.default)("navds-form-field__description", {
|
|
56
57
|
"navds-sr-only": hideLabel,
|
|
57
|
-
}), id: inputDescriptionId, size: "small", as: "div" }, description)) : (react_1.default.createElement(__1.Detail, { className: (0, classnames_1.default)("navds-
|
|
58
|
+
}), id: inputDescriptionId, size: "small", as: "div" }, description)) : (react_1.default.createElement(__1.Detail, { className: (0, classnames_1.default)("navds-form-field__description", {
|
|
58
59
|
"navds-sr-only": hideLabel,
|
|
59
60
|
}), id: inputDescriptionId, size: "small", as: "div" }, description)))),
|
|
60
61
|
react_1.default.createElement("input", Object.assign({}, (0, __1.omit)(rest, ["error", "errorId", "size"]), inputProps, { ref: ref, type: type, className: (0, classnames_1.default)("navds-text-field__input", "navds-body-short", `navds-body-${size !== null && size !== void 0 ? size : "medium"}`), size: htmlSize })),
|
|
61
|
-
react_1.default.createElement("div", { id: errorId, "aria-relevant": "additions removals", "aria-live": "polite" }, showErrorMsg && (react_1.default.createElement(__1.ErrorMessage, { size: size }, props.error)))));
|
|
62
|
+
react_1.default.createElement("div", { className: "navds-form-field__error", id: errorId, "aria-relevant": "additions removals", "aria-live": "polite" }, showErrorMsg && (react_1.default.createElement(__1.ErrorMessage, { size: size }, props.error)))));
|
|
62
63
|
});
|
|
63
64
|
exports.default = exports.TextField;
|
package/cjs/form/Textarea.js
CHANGED
|
@@ -59,16 +59,18 @@ exports.Textarea = (0, react_1.forwardRef)((props, ref) => {
|
|
|
59
59
|
return rows;
|
|
60
60
|
};
|
|
61
61
|
return (react_1.default.createElement("div", { className: (0, classnames_1.default)(className, "navds-form-field", `navds-form-field--${size}`, {
|
|
62
|
+
"navds-form-field--disabled": !!inputProps.disabled,
|
|
62
63
|
"navds-textarea--error": hasError,
|
|
63
|
-
"navds-textarea--disabled": !!inputProps.disabled,
|
|
64
64
|
"navds-textarea--resize": resize,
|
|
65
65
|
}) },
|
|
66
|
-
react_1.default.createElement(__1.Label, { htmlFor: inputProps.id, size: size, as: "label", className: (0, classnames_1.default)("navds-
|
|
66
|
+
react_1.default.createElement(__1.Label, { htmlFor: inputProps.id, size: size, as: "label", className: (0, classnames_1.default)("navds-form-field__label", {
|
|
67
67
|
"navds-sr-only": hideLabel,
|
|
68
68
|
}) }, label),
|
|
69
|
-
!!description && (react_1.default.createElement(
|
|
69
|
+
!!description && (react_1.default.createElement(react_1.default.Fragment, null, size === "medium" ? (react_1.default.createElement(__1.BodyShort, { className: (0, classnames_1.default)("navds-form-field__description", {
|
|
70
70
|
"navds-sr-only": hideLabel,
|
|
71
|
-
}), id: inputDescriptionId, size:
|
|
71
|
+
}), id: inputDescriptionId, size: "small", as: "div" }, description)) : (react_1.default.createElement(__1.Detail, { className: (0, classnames_1.default)("navds-form-field__description", {
|
|
72
|
+
"navds-sr-only": hideLabel,
|
|
73
|
+
}), id: inputDescriptionId, size: "small", as: "div" }, description)))),
|
|
72
74
|
react_1.default.createElement("div", { className: "navds-textarea__wrapper" },
|
|
73
75
|
react_1.default.createElement(TextareaAutosize_1.default, Object.assign({}, (0, __1.omit)(rest, ["error", "errorId", "size"]), inputProps, { onChange: (e) => props.onChange
|
|
74
76
|
? props.onChange(e)
|
|
@@ -86,7 +88,7 @@ exports.Textarea = (0, react_1.forwardRef)((props, ref) => {
|
|
|
86
88
|
maxLength,
|
|
87
89
|
" signs."),
|
|
88
90
|
react_1.default.createElement(exports.Counter, { maxLength: maxLength, currentLength: (_c = (_b = props.value) === null || _b === void 0 ? void 0 : _b.length) !== null && _c !== void 0 ? _c : controlledValue === null || controlledValue === void 0 ? void 0 : controlledValue.length, size: size })))),
|
|
89
|
-
react_1.default.createElement("div", { id: errorId, "aria-relevant": "additions removals", "aria-live": "polite" }, showErrorMsg && (react_1.default.createElement(__1.ErrorMessage, { size: size }, props.error)))));
|
|
91
|
+
react_1.default.createElement("div", { className: "navds-form-field__error", id: errorId, "aria-relevant": "additions removals", "aria-live": "polite" }, showErrorMsg && (react_1.default.createElement(__1.ErrorMessage, { size: size }, props.error)))));
|
|
90
92
|
});
|
|
91
93
|
const Counter = ({ maxLength, currentLength, size }) => {
|
|
92
94
|
const difference = maxLength - currentLength;
|
|
@@ -47,7 +47,7 @@ const SearchButton_1 = __importDefault(require("./SearchButton"));
|
|
|
47
47
|
const useSearch_1 = require("./useSearch");
|
|
48
48
|
exports.SearchContext = react_1.default.createContext(null);
|
|
49
49
|
exports.Search = (0, react_1.forwardRef)((props, ref) => {
|
|
50
|
-
const { inputProps, size = "medium", inputDescriptionId } = (0, useSearch_1.useSearch)(props, "searchfield");
|
|
50
|
+
const { inputProps, size = "medium", inputDescriptionId, } = (0, useSearch_1.useSearch)(props, "searchfield");
|
|
51
51
|
const { className, hideLabel = true, label, description, value, clearButtonLabel, onClear, clearButton = true, children, variant = "primary", defaultValue, onChange } = props, rest = __rest(props, ["className", "hideLabel", "label", "description", "value", "clearButtonLabel", "onClear", "clearButton", "children", "variant", "defaultValue", "onChange"]);
|
|
52
52
|
const searchRef = (0, react_1.useRef)(null);
|
|
53
53
|
const mergedRef = (0, react_merge_refs_1.default)([searchRef, ref]);
|
|
@@ -72,10 +72,10 @@ exports.Search = (0, react_1.forwardRef)((props, ref) => {
|
|
|
72
72
|
return (react_1.default.createElement("div", { ref: setWrapperRef, className: (0, classnames_1.default)(className, "navds-form-field", `navds-form-field--${size}`, "navds-search", {
|
|
73
73
|
"navds-search--disabled": !!inputProps.disabled,
|
|
74
74
|
}) },
|
|
75
|
-
react_1.default.createElement(__1.Label, { htmlFor: inputProps.id, size: size, as: "label", className: (0, classnames_1.default)("navds-
|
|
75
|
+
react_1.default.createElement(__1.Label, { htmlFor: inputProps.id, size: size, as: "label", className: (0, classnames_1.default)("navds-form-field__label", {
|
|
76
76
|
"navds-sr-only": hideLabel,
|
|
77
77
|
}) }, label),
|
|
78
|
-
!!description && (react_1.default.createElement(__1.BodyShort, { as: "div", className: (0, classnames_1.default)("navds-
|
|
78
|
+
!!description && (react_1.default.createElement(__1.BodyShort, { as: "div", className: (0, classnames_1.default)("navds-form-field__description", {
|
|
79
79
|
"navds-sr-only": hideLabel,
|
|
80
80
|
}), id: inputDescriptionId, size: size }, description)),
|
|
81
81
|
react_1.default.createElement("div", { className: "navds-search__wrapper" },
|
|
@@ -24,7 +24,7 @@ export const ConfirmationPanel = forwardRef((_a, ref) => {
|
|
|
24
24
|
React.createElement("div", { className: "navds-confirmation-panel__inner" },
|
|
25
25
|
children && (React.createElement(BodyLong, { size: props.size, className: "navds-confirmation-panel__content" }, children)),
|
|
26
26
|
React.createElement(Checkbox, Object.assign({}, props, inputProps, { error: hasError, size: size }), label)),
|
|
27
|
-
React.createElement("div", { id: errorId, "aria-relevant": "additions removals", "aria-live": "polite" }, showErrorMsg && React.createElement(ErrorMessage, { size: size }, props.error))));
|
|
27
|
+
React.createElement("div", { className: "navds-form-field__error", id: errorId, "aria-relevant": "additions removals", "aria-live": "polite" }, showErrorMsg && React.createElement(ErrorMessage, { size: size }, props.error))));
|
|
28
28
|
});
|
|
29
29
|
export default ConfirmationPanel;
|
|
30
30
|
//# sourceMappingURL=ConfirmationPanel.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ConfirmationPanel.js","sourceRoot":"","sources":["../../src/form/ConfirmationPanel.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAiB,YAAY,EAAE,MAAM,IAAI,CAAC;AACrE,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAyB9C,MAAM,CAAC,MAAM,iBAAiB,GAAG,UAAU,CAGzC,CAAC,EAAwC,EAAE,GAAG,EAAE,EAAE;QAAjD,EAAE,SAAS,EAAE,QAAQ,EAAE,KAAK,OAAY,EAAP,KAAK,cAAtC,kCAAwC,CAAF;IACvC,MAAM,EAAE,OAAO,EAAE,YAAY,EAAE,QAAQ,EAAE,IAAI,EAAE,UAAU,EAAE,GAAG,YAAY,CACxE,KAAK,EACL,mBAAmB,CACpB,CAAC;IAEF,OAAO,CACL,6BACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,0BAA0B,EAAE,kBAAkB,EAAE,SAAS,EAAE;YACvE,iCAAiC,EAAE,IAAI,KAAK,OAAO;YACnD,iCAAiC,EAAE,QAAQ;YAC3C,mCAAmC,EAAE,CAAC,CAAC,KAAK,CAAC,OAAO;SACrD,CAAC;QAEF,6BAAK,SAAS,EAAC,iCAAiC;YAC7C,QAAQ,IAAI,CACX,oBAAC,QAAQ,IACP,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,SAAS,EAAC,mCAAmC,IAE5C,QAAQ,CACA,CACZ;YACD,oBAAC,QAAQ,oBAAK,KAAK,EAAM,UAAU,IAAE,KAAK,EAAE,QAAQ,EAAE,IAAI,EAAE,IAAI,KAC7D,KAAK,CACG,CACP;QACN,
|
|
1
|
+
{"version":3,"file":"ConfirmationPanel.js","sourceRoot":"","sources":["../../src/form/ConfirmationPanel.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAiB,YAAY,EAAE,MAAM,IAAI,CAAC;AACrE,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAyB9C,MAAM,CAAC,MAAM,iBAAiB,GAAG,UAAU,CAGzC,CAAC,EAAwC,EAAE,GAAG,EAAE,EAAE;QAAjD,EAAE,SAAS,EAAE,QAAQ,EAAE,KAAK,OAAY,EAAP,KAAK,cAAtC,kCAAwC,CAAF;IACvC,MAAM,EAAE,OAAO,EAAE,YAAY,EAAE,QAAQ,EAAE,IAAI,EAAE,UAAU,EAAE,GAAG,YAAY,CACxE,KAAK,EACL,mBAAmB,CACpB,CAAC;IAEF,OAAO,CACL,6BACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,0BAA0B,EAAE,kBAAkB,EAAE,SAAS,EAAE;YACvE,iCAAiC,EAAE,IAAI,KAAK,OAAO;YACnD,iCAAiC,EAAE,QAAQ;YAC3C,mCAAmC,EAAE,CAAC,CAAC,KAAK,CAAC,OAAO;SACrD,CAAC;QAEF,6BAAK,SAAS,EAAC,iCAAiC;YAC7C,QAAQ,IAAI,CACX,oBAAC,QAAQ,IACP,IAAI,EAAE,KAAK,CAAC,IAAI,EAChB,SAAS,EAAC,mCAAmC,IAE5C,QAAQ,CACA,CACZ;YACD,oBAAC,QAAQ,oBAAK,KAAK,EAAM,UAAU,IAAE,KAAK,EAAE,QAAQ,EAAE,IAAI,EAAE,IAAI,KAC7D,KAAK,CACG,CACP;QACN,6BACE,SAAS,EAAC,yBAAyB,EACnC,EAAE,EAAE,OAAO,mBACG,oBAAoB,eACxB,QAAQ,IAEjB,YAAY,IAAI,oBAAC,YAAY,IAAC,IAAI,EAAE,IAAI,IAAG,KAAK,CAAC,KAAK,CAAgB,CACnE,CACF,CACP,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,iBAAiB,CAAC"}
|
package/esm/form/Select.js
CHANGED
|
@@ -12,25 +12,27 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
12
12
|
import React, { forwardRef } from "react";
|
|
13
13
|
import cl from "classnames";
|
|
14
14
|
import { Expand } from "@navikt/ds-icons";
|
|
15
|
-
import { BodyShort, Label, ErrorMessage, omit } from "..";
|
|
15
|
+
import { BodyShort, Label, ErrorMessage, omit, Detail } from "..";
|
|
16
16
|
import { useFormField } from "./useFormField";
|
|
17
17
|
export const Select = forwardRef((props, ref) => {
|
|
18
18
|
const { inputProps, errorId, showErrorMsg, hasError, size, inputDescriptionId, } = useFormField(props, "textField");
|
|
19
19
|
const { children, label, className, description, htmlSize, hideLabel = false } = props, rest = __rest(props, ["children", "label", "className", "description", "htmlSize", "hideLabel"]);
|
|
20
20
|
return (React.createElement("div", { className: cl(className, "navds-form-field", `navds-form-field--${size}`, {
|
|
21
|
+
"navds-form-field--disabled": !!inputProps.disabled,
|
|
21
22
|
"navds-select--error": hasError,
|
|
22
|
-
"navds-select--disabled": !!inputProps.disabled,
|
|
23
23
|
}) },
|
|
24
|
-
React.createElement(Label, { htmlFor: inputProps.id, size: size, as: "label", className: cl("navds-
|
|
24
|
+
React.createElement(Label, { htmlFor: inputProps.id, size: size, as: "label", className: cl("navds-form-field__label", {
|
|
25
25
|
"navds-sr-only": hideLabel,
|
|
26
26
|
}) }, label),
|
|
27
|
-
!!description && (React.createElement(
|
|
27
|
+
!!description && (React.createElement(React.Fragment, null, size === "medium" ? (React.createElement(BodyShort, { className: cl("navds-form-field__description", {
|
|
28
28
|
"navds-sr-only": hideLabel,
|
|
29
|
-
}), id: inputDescriptionId, size:
|
|
29
|
+
}), id: inputDescriptionId, size: "small", as: "div" }, description)) : (React.createElement(Detail, { className: cl("navds-form-field__description", {
|
|
30
|
+
"navds-sr-only": hideLabel,
|
|
31
|
+
}), id: inputDescriptionId, size: "small", as: "div" }, description)))),
|
|
30
32
|
React.createElement("div", { className: "navds-select__container" },
|
|
31
33
|
React.createElement("select", Object.assign({}, omit(rest, ["error", "errorId", "size"]), inputProps, { ref: ref, className: cl("navds-select__input", "navds-body-short", `navds-body--${size !== null && size !== void 0 ? size : "medium"}`), size: props.htmlSize }), children),
|
|
32
34
|
React.createElement(Expand, { className: "navds-select__chevron", "aria-hidden": true })),
|
|
33
|
-
React.createElement("div", { id: errorId, "aria-relevant": "additions removals", "aria-live": "polite" }, showErrorMsg && (React.createElement(ErrorMessage, { size: size }, props.error)))));
|
|
35
|
+
React.createElement("div", { className: "navds-form-field__error", id: errorId, "aria-relevant": "additions removals", "aria-live": "polite" }, showErrorMsg && (React.createElement(ErrorMessage, { size: size }, props.error)))));
|
|
34
36
|
});
|
|
35
37
|
export default Select;
|
|
36
38
|
//# sourceMappingURL=Select.js.map
|
package/esm/form/Select.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Select.js","sourceRoot":"","sources":["../../src/form/Select.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAwB,MAAM,OAAO,CAAC;AAChE,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC1C,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,YAAY,EAAE,IAAI,EAAE,MAAM,IAAI,CAAC;
|
|
1
|
+
{"version":3,"file":"Select.js","sourceRoot":"","sources":["../../src/form/Select.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAwB,MAAM,OAAO,CAAC;AAChE,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAC1C,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,YAAY,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,IAAI,CAAC;AAClE,OAAO,EAAkB,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAuB9D,MAAM,CAAC,MAAM,MAAM,GAAG,UAAU,CAC9B,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IACb,MAAM,EACJ,UAAU,EACV,OAAO,EACP,YAAY,EACZ,QAAQ,EACR,IAAI,EACJ,kBAAkB,GACnB,GAAG,YAAY,CAAC,KAAK,EAAE,WAAW,CAAC,CAAC;IAErC,MAAM,EACJ,QAAQ,EACR,KAAK,EACL,SAAS,EACT,WAAW,EACX,QAAQ,EACR,SAAS,GAAG,KAAK,KAEf,KAAK,EADJ,IAAI,UACL,KAAK,EARH,0EAQL,CAAQ,CAAC;IAEV,OAAO,CACL,6BACE,SAAS,EAAE,EAAE,CACX,SAAS,EACT,kBAAkB,EAClB,qBAAqB,IAAI,EAAE,EAC3B;YACE,4BAA4B,EAAE,CAAC,CAAC,UAAU,CAAC,QAAQ;YACnD,qBAAqB,EAAE,QAAQ;SAChC,CACF;QAED,oBAAC,KAAK,IACJ,OAAO,EAAE,UAAU,CAAC,EAAE,EACtB,IAAI,EAAE,IAAI,EACV,EAAE,EAAC,OAAO,EACV,SAAS,EAAE,EAAE,CAAC,yBAAyB,EAAE;gBACvC,eAAe,EAAE,SAAS;aAC3B,CAAC,IAED,KAAK,CACA;QACP,CAAC,CAAC,WAAW,IAAI,CAChB,0CACG,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,CACnB,oBAAC,SAAS,IACR,SAAS,EAAE,EAAE,CAAC,+BAA+B,EAAE;gBAC7C,eAAe,EAAE,SAAS;aAC3B,CAAC,EACF,EAAE,EAAE,kBAAkB,EACtB,IAAI,EAAC,OAAO,EACZ,EAAE,EAAC,KAAK,IAEP,WAAW,CACF,CACb,CAAC,CAAC,CAAC,CACF,oBAAC,MAAM,IACL,SAAS,EAAE,EAAE,CAAC,+BAA+B,EAAE;gBAC7C,eAAe,EAAE,SAAS;aAC3B,CAAC,EACF,EAAE,EAAE,kBAAkB,EACtB,IAAI,EAAC,OAAO,EACZ,EAAE,EAAC,KAAK,IAEP,WAAW,CACL,CACV,CACA,CACJ;QACD,6BAAK,SAAS,EAAC,yBAAyB;YACtC,gDACM,IAAI,CAAC,IAAI,EAAE,CAAC,OAAO,EAAE,SAAS,EAAE,MAAM,CAAC,CAAC,EACxC,UAAU,IACd,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACX,qBAAqB,EACrB,kBAAkB,EAClB,eAAe,IAAI,aAAJ,IAAI,cAAJ,IAAI,GAAI,QAAQ,EAAE,CAClC,EACD,IAAI,EAAE,KAAK,CAAC,QAAQ,KAEnB,QAAQ,CACF;YACT,oBAAC,MAAM,IAAC,SAAS,EAAC,uBAAuB,wBAAe,CACpD;QACN,6BACE,SAAS,EAAC,yBAAyB,EACnC,EAAE,EAAE,OAAO,mBACG,oBAAoB,eACxB,QAAQ,IAEjB,YAAY,IAAI,CACf,oBAAC,YAAY,IAAC,IAAI,EAAE,IAAI,IAAG,KAAK,CAAC,KAAK,CAAgB,CACvD,CACG,CACF,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,MAAM,CAAC"}
|
package/esm/form/TextField.js
CHANGED
|
@@ -19,17 +19,18 @@ export const TextField = forwardRef((props, ref) => {
|
|
|
19
19
|
return (React.createElement("div", { className: cl(className, "navds-form-field", `navds-form-field--${size}`, {
|
|
20
20
|
"navds-text-field--error": hasError,
|
|
21
21
|
"navds-text-field--disabled": !!inputProps.disabled,
|
|
22
|
+
"navds-form-field--disabled": !!inputProps.disabled,
|
|
22
23
|
}) },
|
|
23
|
-
React.createElement(Label, { htmlFor: inputProps.id, size: size, as: "label", className: cl("navds-
|
|
24
|
+
React.createElement(Label, { htmlFor: inputProps.id, size: size, as: "label", className: cl("navds-form-field__label", {
|
|
24
25
|
"navds-sr-only": hideLabel,
|
|
25
26
|
}) }, label),
|
|
26
|
-
!!description && (React.createElement(React.Fragment, null, size === "medium" ? (React.createElement(BodyShort, { className: cl("navds-
|
|
27
|
+
!!description && (React.createElement(React.Fragment, null, size === "medium" ? (React.createElement(BodyShort, { className: cl("navds-form-field__description", {
|
|
27
28
|
"navds-sr-only": hideLabel,
|
|
28
|
-
}), id: inputDescriptionId, size: "small", as: "div" }, description)) : (React.createElement(Detail, { className: cl("navds-
|
|
29
|
+
}), id: inputDescriptionId, size: "small", as: "div" }, description)) : (React.createElement(Detail, { className: cl("navds-form-field__description", {
|
|
29
30
|
"navds-sr-only": hideLabel,
|
|
30
31
|
}), id: inputDescriptionId, size: "small", as: "div" }, description)))),
|
|
31
32
|
React.createElement("input", Object.assign({}, omit(rest, ["error", "errorId", "size"]), inputProps, { ref: ref, type: type, className: cl("navds-text-field__input", "navds-body-short", `navds-body-${size !== null && size !== void 0 ? size : "medium"}`), size: htmlSize })),
|
|
32
|
-
React.createElement("div", { id: errorId, "aria-relevant": "additions removals", "aria-live": "polite" }, showErrorMsg && (React.createElement(ErrorMessage, { size: size }, props.error)))));
|
|
33
|
+
React.createElement("div", { className: "navds-form-field__error", id: errorId, "aria-relevant": "additions removals", "aria-live": "polite" }, showErrorMsg && (React.createElement(ErrorMessage, { size: size }, props.error)))));
|
|
33
34
|
});
|
|
34
35
|
export default TextField;
|
|
35
36
|
//# sourceMappingURL=TextField.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextField.js","sourceRoot":"","sources":["../../src/form/TextField.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAuB,MAAM,OAAO,CAAC;AAC/D,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,KAAK,EAAE,YAAY,EAAE,IAAI,EAAE,MAAM,IAAI,CAAC;AAClE,OAAO,EAAkB,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAgC9D,MAAM,CAAC,MAAM,SAAS,GAAG,UAAU,CACjC,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IACb,MAAM,EACJ,UAAU,EACV,OAAO,EACP,YAAY,EACZ,QAAQ,EACR,IAAI,EACJ,kBAAkB,GACnB,GAAG,YAAY,CAAC,KAAK,EAAE,WAAW,CAAC,CAAC;IAErC,MAAM,EACJ,KAAK,EACL,SAAS,EACT,WAAW,EACX,QAAQ,EACR,SAAS,GAAG,KAAK,EACjB,IAAI,GAAG,MAAM,KAEX,KAAK,EADJ,IAAI,UACL,KAAK,EARH,sEAQL,CAAQ,CAAC;IAEV,OAAO,CACL,6BACE,SAAS,EAAE,EAAE,CACX,SAAS,EACT,kBAAkB,EAClB,qBAAqB,IAAI,EAAE,EAC3B;YACE,yBAAyB,EAAE,QAAQ;YACnC,4BAA4B,EAAE,CAAC,CAAC,UAAU,CAAC,QAAQ;SACpD,CACF;QAED,oBAAC,KAAK,IACJ,OAAO,EAAE,UAAU,CAAC,EAAE,EACtB,IAAI,EAAE,IAAI,EACV,EAAE,EAAC,OAAO,EACV,SAAS,EAAE,EAAE,CAAC,yBAAyB,EAAE;gBACvC,eAAe,EAAE,SAAS;aAC3B,CAAC,IAED,KAAK,CACA;QAEP,CAAC,CAAC,WAAW,IAAI,CAChB,0CACG,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,CACnB,oBAAC,SAAS,IACR,SAAS,EAAE,EAAE,CAAC,+BAA+B,EAAE;gBAC7C,eAAe,EAAE,SAAS;aAC3B,CAAC,EACF,EAAE,EAAE,kBAAkB,EACtB,IAAI,EAAC,OAAO,EACZ,EAAE,EAAC,KAAK,IAEP,WAAW,CACF,CACb,CAAC,CAAC,CAAC,CACF,oBAAC,MAAM,IACL,SAAS,EAAE,EAAE,CAAC,+BAA+B,EAAE;gBAC7C,eAAe,EAAE,SAAS;aAC3B,CAAC,EACF,EAAE,EAAE,kBAAkB,EACtB,IAAI,EAAC,OAAO,EACZ,EAAE,EAAC,KAAK,IAEP,WAAW,CACL,CACV,CACA,CACJ;QACD,+CACM,IAAI,CAAC,IAAI,EAAE,CAAC,OAAO,EAAE,SAAS,EAAE,MAAM,CAAC,CAAC,EACxC,UAAU,IACd,GAAG,EAAE,GAAG,EACR,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,EAAE,CACX,yBAAyB,EACzB,kBAAkB,EAClB,cAAc,IAAI,aAAJ,IAAI,cAAJ,IAAI,GAAI,QAAQ,EAAE,CACjC,EACD,IAAI,EAAE,QAAQ,IACd;QACF,
|
|
1
|
+
{"version":3,"file":"TextField.js","sourceRoot":"","sources":["../../src/form/TextField.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAuB,MAAM,OAAO,CAAC;AAC/D,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,KAAK,EAAE,YAAY,EAAE,IAAI,EAAE,MAAM,IAAI,CAAC;AAClE,OAAO,EAAkB,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAgC9D,MAAM,CAAC,MAAM,SAAS,GAAG,UAAU,CACjC,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IACb,MAAM,EACJ,UAAU,EACV,OAAO,EACP,YAAY,EACZ,QAAQ,EACR,IAAI,EACJ,kBAAkB,GACnB,GAAG,YAAY,CAAC,KAAK,EAAE,WAAW,CAAC,CAAC;IAErC,MAAM,EACJ,KAAK,EACL,SAAS,EACT,WAAW,EACX,QAAQ,EACR,SAAS,GAAG,KAAK,EACjB,IAAI,GAAG,MAAM,KAEX,KAAK,EADJ,IAAI,UACL,KAAK,EARH,sEAQL,CAAQ,CAAC;IAEV,OAAO,CACL,6BACE,SAAS,EAAE,EAAE,CACX,SAAS,EACT,kBAAkB,EAClB,qBAAqB,IAAI,EAAE,EAC3B;YACE,yBAAyB,EAAE,QAAQ;YACnC,4BAA4B,EAAE,CAAC,CAAC,UAAU,CAAC,QAAQ;YACnD,4BAA4B,EAAE,CAAC,CAAC,UAAU,CAAC,QAAQ;SACpD,CACF;QAED,oBAAC,KAAK,IACJ,OAAO,EAAE,UAAU,CAAC,EAAE,EACtB,IAAI,EAAE,IAAI,EACV,EAAE,EAAC,OAAO,EACV,SAAS,EAAE,EAAE,CAAC,yBAAyB,EAAE;gBACvC,eAAe,EAAE,SAAS;aAC3B,CAAC,IAED,KAAK,CACA;QAEP,CAAC,CAAC,WAAW,IAAI,CAChB,0CACG,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,CACnB,oBAAC,SAAS,IACR,SAAS,EAAE,EAAE,CAAC,+BAA+B,EAAE;gBAC7C,eAAe,EAAE,SAAS;aAC3B,CAAC,EACF,EAAE,EAAE,kBAAkB,EACtB,IAAI,EAAC,OAAO,EACZ,EAAE,EAAC,KAAK,IAEP,WAAW,CACF,CACb,CAAC,CAAC,CAAC,CACF,oBAAC,MAAM,IACL,SAAS,EAAE,EAAE,CAAC,+BAA+B,EAAE;gBAC7C,eAAe,EAAE,SAAS;aAC3B,CAAC,EACF,EAAE,EAAE,kBAAkB,EACtB,IAAI,EAAC,OAAO,EACZ,EAAE,EAAC,KAAK,IAEP,WAAW,CACL,CACV,CACA,CACJ;QACD,+CACM,IAAI,CAAC,IAAI,EAAE,CAAC,OAAO,EAAE,SAAS,EAAE,MAAM,CAAC,CAAC,EACxC,UAAU,IACd,GAAG,EAAE,GAAG,EACR,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,EAAE,CACX,yBAAyB,EACzB,kBAAkB,EAClB,cAAc,IAAI,aAAJ,IAAI,cAAJ,IAAI,GAAI,QAAQ,EAAE,CACjC,EACD,IAAI,EAAE,QAAQ,IACd;QACF,6BACE,SAAS,EAAC,yBAAyB,EACnC,EAAE,EAAE,OAAO,mBACG,oBAAoB,eACxB,QAAQ,IAEjB,YAAY,IAAI,CACf,oBAAC,YAAY,IAAC,IAAI,EAAE,IAAI,IAAG,KAAK,CAAC,KAAK,CAAgB,CACvD,CACG,CACF,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,SAAS,CAAC"}
|
package/esm/form/Textarea.js
CHANGED
|
@@ -12,7 +12,7 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
12
12
|
import React, { forwardRef, useState } from "react";
|
|
13
13
|
import cl from "classnames";
|
|
14
14
|
import TextareaAutosize from "@material-ui/core/TextareaAutosize";
|
|
15
|
-
import { BodyShort, Label, ErrorMessage, omit } from "..";
|
|
15
|
+
import { BodyShort, Label, ErrorMessage, omit, Detail } from "..";
|
|
16
16
|
import { useFormField } from "./useFormField";
|
|
17
17
|
import { useId } from "..";
|
|
18
18
|
export const Textarea = forwardRef((props, ref) => {
|
|
@@ -30,16 +30,18 @@ export const Textarea = forwardRef((props, ref) => {
|
|
|
30
30
|
return rows;
|
|
31
31
|
};
|
|
32
32
|
return (React.createElement("div", { className: cl(className, "navds-form-field", `navds-form-field--${size}`, {
|
|
33
|
+
"navds-form-field--disabled": !!inputProps.disabled,
|
|
33
34
|
"navds-textarea--error": hasError,
|
|
34
|
-
"navds-textarea--disabled": !!inputProps.disabled,
|
|
35
35
|
"navds-textarea--resize": resize,
|
|
36
36
|
}) },
|
|
37
|
-
React.createElement(Label, { htmlFor: inputProps.id, size: size, as: "label", className: cl("navds-
|
|
37
|
+
React.createElement(Label, { htmlFor: inputProps.id, size: size, as: "label", className: cl("navds-form-field__label", {
|
|
38
38
|
"navds-sr-only": hideLabel,
|
|
39
39
|
}) }, label),
|
|
40
|
-
!!description && (React.createElement(
|
|
40
|
+
!!description && (React.createElement(React.Fragment, null, size === "medium" ? (React.createElement(BodyShort, { className: cl("navds-form-field__description", {
|
|
41
41
|
"navds-sr-only": hideLabel,
|
|
42
|
-
}), id: inputDescriptionId, size:
|
|
42
|
+
}), id: inputDescriptionId, size: "small", as: "div" }, description)) : (React.createElement(Detail, { className: cl("navds-form-field__description", {
|
|
43
|
+
"navds-sr-only": hideLabel,
|
|
44
|
+
}), id: inputDescriptionId, size: "small", as: "div" }, description)))),
|
|
43
45
|
React.createElement("div", { className: "navds-textarea__wrapper" },
|
|
44
46
|
React.createElement(TextareaAutosize, Object.assign({}, omit(rest, ["error", "errorId", "size"]), inputProps, { onChange: (e) => props.onChange
|
|
45
47
|
? props.onChange(e)
|
|
@@ -57,7 +59,7 @@ export const Textarea = forwardRef((props, ref) => {
|
|
|
57
59
|
maxLength,
|
|
58
60
|
" signs."),
|
|
59
61
|
React.createElement(Counter, { maxLength: maxLength, currentLength: (_c = (_b = props.value) === null || _b === void 0 ? void 0 : _b.length) !== null && _c !== void 0 ? _c : controlledValue === null || controlledValue === void 0 ? void 0 : controlledValue.length, size: size })))),
|
|
60
|
-
React.createElement("div", { id: errorId, "aria-relevant": "additions removals", "aria-live": "polite" }, showErrorMsg && (React.createElement(ErrorMessage, { size: size }, props.error)))));
|
|
62
|
+
React.createElement("div", { className: "navds-form-field__error", id: errorId, "aria-relevant": "additions removals", "aria-live": "polite" }, showErrorMsg && (React.createElement(ErrorMessage, { size: size }, props.error)))));
|
|
61
63
|
});
|
|
62
64
|
export const Counter = ({ maxLength, currentLength, size }) => {
|
|
63
65
|
const difference = maxLength - currentLength;
|
package/esm/form/Textarea.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Textarea.js","sourceRoot":"","sources":["../../src/form/Textarea.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACpD,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,gBAAgB,MAAM,oCAAoC,CAAC;AAClE,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,YAAY,EAAE,IAAI,EAAE,MAAM,IAAI,CAAC;
|
|
1
|
+
{"version":3,"file":"Textarea.js","sourceRoot":"","sources":["../../src/form/Textarea.tsx"],"names":[],"mappings":"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"}
|
|
@@ -18,7 +18,7 @@ import SearchButton from "./SearchButton";
|
|
|
18
18
|
import { useSearch } from "./useSearch";
|
|
19
19
|
export const SearchContext = React.createContext(null);
|
|
20
20
|
export const Search = forwardRef((props, ref) => {
|
|
21
|
-
const { inputProps, size = "medium", inputDescriptionId } = useSearch(props, "searchfield");
|
|
21
|
+
const { inputProps, size = "medium", inputDescriptionId, } = useSearch(props, "searchfield");
|
|
22
22
|
const { className, hideLabel = true, label, description, value, clearButtonLabel, onClear, clearButton = true, children, variant = "primary", defaultValue, onChange } = props, rest = __rest(props, ["className", "hideLabel", "label", "description", "value", "clearButtonLabel", "onClear", "clearButton", "children", "variant", "defaultValue", "onChange"]);
|
|
23
23
|
const searchRef = useRef(null);
|
|
24
24
|
const mergedRef = mergeRefs([searchRef, ref]);
|
|
@@ -43,10 +43,10 @@ export const Search = forwardRef((props, ref) => {
|
|
|
43
43
|
return (React.createElement("div", { ref: setWrapperRef, className: cl(className, "navds-form-field", `navds-form-field--${size}`, "navds-search", {
|
|
44
44
|
"navds-search--disabled": !!inputProps.disabled,
|
|
45
45
|
}) },
|
|
46
|
-
React.createElement(Label, { htmlFor: inputProps.id, size: size, as: "label", className: cl("navds-
|
|
46
|
+
React.createElement(Label, { htmlFor: inputProps.id, size: size, as: "label", className: cl("navds-form-field__label", {
|
|
47
47
|
"navds-sr-only": hideLabel,
|
|
48
48
|
}) }, label),
|
|
49
|
-
!!description && (React.createElement(BodyShort, { as: "div", className: cl("navds-
|
|
49
|
+
!!description && (React.createElement(BodyShort, { as: "div", className: cl("navds-form-field__description", {
|
|
50
50
|
"navds-sr-only": hideLabel,
|
|
51
51
|
}), id: inputDescriptionId, size: size }, description)),
|
|
52
52
|
React.createElement("div", { className: "navds-search__wrapper" },
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Search.js","sourceRoot":"","sources":["../../../src/form/search/Search.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,IAAI,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC/D,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,KAAK,EAAE,EACZ,UAAU,EAEV,WAAW,EACX,MAAM,EACN,QAAQ,GACT,MAAM,OAAO,CAAC;AACf,OAAO,SAAS,MAAM,kBAAkB,CAAC;AACzC,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE,gBAAgB,EAAE,MAAM,OAAO,CAAC;AAEjE,OAAO,YAAkC,MAAM,gBAAgB,CAAC;AAChE,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AA6DxC,MAAM,CAAC,MAAM,aAAa,GAAG,KAAK,CAAC,aAAa,CAC9C,IAAI,CACL,CAAC;AAEF,MAAM,CAAC,MAAM,MAAM,GAAG,UAAU,CAC9B,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IACb,MAAM,
|
|
1
|
+
{"version":3,"file":"Search.js","sourceRoot":"","sources":["../../../src/form/search/Search.tsx"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@navikt/ds-react",
|
|
3
|
-
"version": "0.19.
|
|
3
|
+
"version": "0.19.13",
|
|
4
4
|
"description": "NAV designsystem react components",
|
|
5
5
|
"author": "NAV Designsystem team",
|
|
6
6
|
"license": "MIT",
|
|
@@ -76,5 +76,5 @@
|
|
|
76
76
|
"@types/react": "^17.0.30 || ^18.0.0",
|
|
77
77
|
"react": "^17.0.0 || ^18.0.0"
|
|
78
78
|
},
|
|
79
|
-
"gitHead": "
|
|
79
|
+
"gitHead": "92febc6e0c7831e9362395a5935490a622506bf3"
|
|
80
80
|
}
|
|
@@ -57,7 +57,12 @@ export const ConfirmationPanel = forwardRef<
|
|
|
57
57
|
{label}
|
|
58
58
|
</Checkbox>
|
|
59
59
|
</div>
|
|
60
|
-
<div
|
|
60
|
+
<div
|
|
61
|
+
className="navds-form-field__error"
|
|
62
|
+
id={errorId}
|
|
63
|
+
aria-relevant="additions removals"
|
|
64
|
+
aria-live="polite"
|
|
65
|
+
>
|
|
61
66
|
{showErrorMsg && <ErrorMessage size={size}>{props.error}</ErrorMessage>}
|
|
62
67
|
</div>
|
|
63
68
|
</div>
|
package/src/form/Select.tsx
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React, { forwardRef, SelectHTMLAttributes } from "react";
|
|
2
2
|
import cl from "classnames";
|
|
3
3
|
import { Expand } from "@navikt/ds-icons";
|
|
4
|
-
import { BodyShort, Label, ErrorMessage, omit } from "..";
|
|
4
|
+
import { BodyShort, Label, ErrorMessage, omit, Detail } from "..";
|
|
5
5
|
import { FormFieldProps, useFormField } from "./useFormField";
|
|
6
6
|
|
|
7
7
|
export interface SelectProps
|
|
@@ -53,8 +53,8 @@ export const Select = forwardRef<HTMLSelectElement, SelectProps>(
|
|
|
53
53
|
"navds-form-field",
|
|
54
54
|
`navds-form-field--${size}`,
|
|
55
55
|
{
|
|
56
|
+
"navds-form-field--disabled": !!inputProps.disabled,
|
|
56
57
|
"navds-select--error": hasError,
|
|
57
|
-
"navds-select--disabled": !!inputProps.disabled,
|
|
58
58
|
}
|
|
59
59
|
)}
|
|
60
60
|
>
|
|
@@ -62,23 +62,38 @@ export const Select = forwardRef<HTMLSelectElement, SelectProps>(
|
|
|
62
62
|
htmlFor={inputProps.id}
|
|
63
63
|
size={size}
|
|
64
64
|
as="label"
|
|
65
|
-
className={cl("navds-
|
|
65
|
+
className={cl("navds-form-field__label", {
|
|
66
66
|
"navds-sr-only": hideLabel,
|
|
67
67
|
})}
|
|
68
68
|
>
|
|
69
69
|
{label}
|
|
70
70
|
</Label>
|
|
71
71
|
{!!description && (
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
72
|
+
<>
|
|
73
|
+
{size === "medium" ? (
|
|
74
|
+
<BodyShort
|
|
75
|
+
className={cl("navds-form-field__description", {
|
|
76
|
+
"navds-sr-only": hideLabel,
|
|
77
|
+
})}
|
|
78
|
+
id={inputDescriptionId}
|
|
79
|
+
size="small"
|
|
80
|
+
as="div"
|
|
81
|
+
>
|
|
82
|
+
{description}
|
|
83
|
+
</BodyShort>
|
|
84
|
+
) : (
|
|
85
|
+
<Detail
|
|
86
|
+
className={cl("navds-form-field__description", {
|
|
87
|
+
"navds-sr-only": hideLabel,
|
|
88
|
+
})}
|
|
89
|
+
id={inputDescriptionId}
|
|
90
|
+
size="small"
|
|
91
|
+
as="div"
|
|
92
|
+
>
|
|
93
|
+
{description}
|
|
94
|
+
</Detail>
|
|
95
|
+
)}
|
|
96
|
+
</>
|
|
82
97
|
)}
|
|
83
98
|
<div className="navds-select__container">
|
|
84
99
|
<select
|
|
@@ -96,7 +111,12 @@ export const Select = forwardRef<HTMLSelectElement, SelectProps>(
|
|
|
96
111
|
</select>
|
|
97
112
|
<Expand className="navds-select__chevron" aria-hidden />
|
|
98
113
|
</div>
|
|
99
|
-
<div
|
|
114
|
+
<div
|
|
115
|
+
className="navds-form-field__error"
|
|
116
|
+
id={errorId}
|
|
117
|
+
aria-relevant="additions removals"
|
|
118
|
+
aria-live="polite"
|
|
119
|
+
>
|
|
100
120
|
{showErrorMsg && (
|
|
101
121
|
<ErrorMessage size={size}>{props.error}</ErrorMessage>
|
|
102
122
|
)}
|
package/src/form/TextField.tsx
CHANGED
|
@@ -63,6 +63,7 @@ export const TextField = forwardRef<HTMLInputElement, TextFieldProps>(
|
|
|
63
63
|
{
|
|
64
64
|
"navds-text-field--error": hasError,
|
|
65
65
|
"navds-text-field--disabled": !!inputProps.disabled,
|
|
66
|
+
"navds-form-field--disabled": !!inputProps.disabled,
|
|
66
67
|
}
|
|
67
68
|
)}
|
|
68
69
|
>
|
|
@@ -70,7 +71,7 @@ export const TextField = forwardRef<HTMLInputElement, TextFieldProps>(
|
|
|
70
71
|
htmlFor={inputProps.id}
|
|
71
72
|
size={size}
|
|
72
73
|
as="label"
|
|
73
|
-
className={cl("navds-
|
|
74
|
+
className={cl("navds-form-field__label", {
|
|
74
75
|
"navds-sr-only": hideLabel,
|
|
75
76
|
})}
|
|
76
77
|
>
|
|
@@ -81,7 +82,7 @@ export const TextField = forwardRef<HTMLInputElement, TextFieldProps>(
|
|
|
81
82
|
<>
|
|
82
83
|
{size === "medium" ? (
|
|
83
84
|
<BodyShort
|
|
84
|
-
className={cl("navds-
|
|
85
|
+
className={cl("navds-form-field__description", {
|
|
85
86
|
"navds-sr-only": hideLabel,
|
|
86
87
|
})}
|
|
87
88
|
id={inputDescriptionId}
|
|
@@ -92,7 +93,7 @@ export const TextField = forwardRef<HTMLInputElement, TextFieldProps>(
|
|
|
92
93
|
</BodyShort>
|
|
93
94
|
) : (
|
|
94
95
|
<Detail
|
|
95
|
-
className={cl("navds-
|
|
96
|
+
className={cl("navds-form-field__description", {
|
|
96
97
|
"navds-sr-only": hideLabel,
|
|
97
98
|
})}
|
|
98
99
|
id={inputDescriptionId}
|
|
@@ -116,7 +117,12 @@ export const TextField = forwardRef<HTMLInputElement, TextFieldProps>(
|
|
|
116
117
|
)}
|
|
117
118
|
size={htmlSize}
|
|
118
119
|
/>
|
|
119
|
-
<div
|
|
120
|
+
<div
|
|
121
|
+
className="navds-form-field__error"
|
|
122
|
+
id={errorId}
|
|
123
|
+
aria-relevant="additions removals"
|
|
124
|
+
aria-live="polite"
|
|
125
|
+
>
|
|
120
126
|
{showErrorMsg && (
|
|
121
127
|
<ErrorMessage size={size}>{props.error}</ErrorMessage>
|
|
122
128
|
)}
|
package/src/form/Textarea.tsx
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import React, { forwardRef, useState } from "react";
|
|
2
2
|
import cl from "classnames";
|
|
3
3
|
import TextareaAutosize from "@material-ui/core/TextareaAutosize";
|
|
4
|
-
import { BodyShort, Label, ErrorMessage, omit } from "..";
|
|
4
|
+
import { BodyShort, Label, ErrorMessage, omit, Detail } from "..";
|
|
5
5
|
import { FormFieldProps, useFormField } from "./useFormField";
|
|
6
6
|
import { useId } from "..";
|
|
7
7
|
|
|
@@ -90,8 +90,8 @@ export const Textarea = forwardRef<HTMLTextAreaElement, TextareaProps>(
|
|
|
90
90
|
"navds-form-field",
|
|
91
91
|
`navds-form-field--${size}`,
|
|
92
92
|
{
|
|
93
|
+
"navds-form-field--disabled": !!inputProps.disabled,
|
|
93
94
|
"navds-textarea--error": hasError,
|
|
94
|
-
"navds-textarea--disabled": !!inputProps.disabled,
|
|
95
95
|
"navds-textarea--resize": resize,
|
|
96
96
|
}
|
|
97
97
|
)}
|
|
@@ -100,23 +100,38 @@ export const Textarea = forwardRef<HTMLTextAreaElement, TextareaProps>(
|
|
|
100
100
|
htmlFor={inputProps.id}
|
|
101
101
|
size={size}
|
|
102
102
|
as="label"
|
|
103
|
-
className={cl("navds-
|
|
103
|
+
className={cl("navds-form-field__label", {
|
|
104
104
|
"navds-sr-only": hideLabel,
|
|
105
105
|
})}
|
|
106
106
|
>
|
|
107
107
|
{label}
|
|
108
108
|
</Label>
|
|
109
109
|
{!!description && (
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
110
|
+
<>
|
|
111
|
+
{size === "medium" ? (
|
|
112
|
+
<BodyShort
|
|
113
|
+
className={cl("navds-form-field__description", {
|
|
114
|
+
"navds-sr-only": hideLabel,
|
|
115
|
+
})}
|
|
116
|
+
id={inputDescriptionId}
|
|
117
|
+
size="small"
|
|
118
|
+
as="div"
|
|
119
|
+
>
|
|
120
|
+
{description}
|
|
121
|
+
</BodyShort>
|
|
122
|
+
) : (
|
|
123
|
+
<Detail
|
|
124
|
+
className={cl("navds-form-field__description", {
|
|
125
|
+
"navds-sr-only": hideLabel,
|
|
126
|
+
})}
|
|
127
|
+
id={inputDescriptionId}
|
|
128
|
+
size="small"
|
|
129
|
+
as="div"
|
|
130
|
+
>
|
|
131
|
+
{description}
|
|
132
|
+
</Detail>
|
|
133
|
+
)}
|
|
134
|
+
</>
|
|
120
135
|
)}
|
|
121
136
|
<div className="navds-textarea__wrapper">
|
|
122
137
|
<TextareaAutosize
|
|
@@ -155,7 +170,12 @@ export const Textarea = forwardRef<HTMLTextAreaElement, TextareaProps>(
|
|
|
155
170
|
</>
|
|
156
171
|
)}
|
|
157
172
|
</div>
|
|
158
|
-
<div
|
|
173
|
+
<div
|
|
174
|
+
className="navds-form-field__error"
|
|
175
|
+
id={errorId}
|
|
176
|
+
aria-relevant="additions removals"
|
|
177
|
+
aria-live="polite"
|
|
178
|
+
>
|
|
159
179
|
{showErrorMsg && (
|
|
160
180
|
<ErrorMessage size={size}>{props.error}</ErrorMessage>
|
|
161
181
|
)}
|
|
@@ -78,10 +78,11 @@ export const SearchContext = React.createContext<SearchContextProps | null>(
|
|
|
78
78
|
|
|
79
79
|
export const Search = forwardRef<HTMLInputElement, SearchProps>(
|
|
80
80
|
(props, ref) => {
|
|
81
|
-
const {
|
|
82
|
-
|
|
83
|
-
"
|
|
84
|
-
|
|
81
|
+
const {
|
|
82
|
+
inputProps,
|
|
83
|
+
size = "medium",
|
|
84
|
+
inputDescriptionId,
|
|
85
|
+
} = useSearch(props, "searchfield");
|
|
85
86
|
|
|
86
87
|
const {
|
|
87
88
|
className,
|
|
@@ -153,7 +154,7 @@ export const Search = forwardRef<HTMLInputElement, SearchProps>(
|
|
|
153
154
|
htmlFor={inputProps.id}
|
|
154
155
|
size={size}
|
|
155
156
|
as="label"
|
|
156
|
-
className={cl("navds-
|
|
157
|
+
className={cl("navds-form-field__label", {
|
|
157
158
|
"navds-sr-only": hideLabel,
|
|
158
159
|
})}
|
|
159
160
|
>
|
|
@@ -162,7 +163,7 @@ export const Search = forwardRef<HTMLInputElement, SearchProps>(
|
|
|
162
163
|
{!!description && (
|
|
163
164
|
<BodyShort
|
|
164
165
|
as="div"
|
|
165
|
-
className={cl("navds-
|
|
166
|
+
className={cl("navds-form-field__description", {
|
|
166
167
|
"navds-sr-only": hideLabel,
|
|
167
168
|
})}
|
|
168
169
|
id={inputDescriptionId}
|
|
@@ -61,8 +61,14 @@ export const Description = () => (
|
|
|
61
61
|
legend="Mollit eiusmod"
|
|
62
62
|
description="Esse cupidatat reprehenderit est culpa consectetur sit dolor esse."
|
|
63
63
|
>
|
|
64
|
-
<TextField
|
|
65
|
-
|
|
64
|
+
<TextField
|
|
65
|
+
label="Textfield label"
|
|
66
|
+
description="Amet quis cillum incididunt "
|
|
67
|
+
/>
|
|
68
|
+
<TextField
|
|
69
|
+
label="Textfield label"
|
|
70
|
+
description="Enim et occaecat voluptate labore sit do exercitation laborum non "
|
|
71
|
+
/>
|
|
66
72
|
</Fieldset>
|
|
67
73
|
);
|
|
68
74
|
|