@navikt/ds-react 0.13.0 → 0.14.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/cjs/form/Fieldset/Fieldset.js +6 -3
- package/cjs/form/Select.js +5 -2
- package/cjs/form/TextField.js +8 -3
- package/cjs/form/Textarea.js +5 -2
- package/cjs/form/checkbox/Checkbox.js +9 -8
- package/cjs/form/checkbox/useCheckbox.js +2 -1
- package/cjs/form/radio/Radio.js +8 -14
- package/cjs/form/radio/useRadio.js +2 -1
- package/cjs/form/search-field/SearchField.js +5 -2
- package/cjs/loader/Loader.js +1 -1
- package/esm/form/Fieldset/Fieldset.js +7 -4
- package/esm/form/Fieldset/Fieldset.js.map +1 -1
- package/esm/form/Select.js +5 -2
- package/esm/form/Select.js.map +1 -1
- package/esm/form/TextField.js +9 -4
- package/esm/form/TextField.js.map +1 -1
- package/esm/form/Textarea.js +5 -2
- package/esm/form/Textarea.js.map +1 -1
- package/esm/form/checkbox/Checkbox.d.ts +6 -1
- package/esm/form/checkbox/Checkbox.js +10 -9
- package/esm/form/checkbox/Checkbox.js.map +1 -1
- package/esm/form/checkbox/CheckboxGroup.d.ts +1 -1
- package/esm/form/checkbox/CheckboxGroup.js.map +1 -1
- package/esm/form/checkbox/useCheckbox.js +2 -1
- package/esm/form/checkbox/useCheckbox.js.map +1 -1
- package/esm/form/radio/Radio.d.ts +4 -1
- package/esm/form/radio/Radio.js +9 -15
- package/esm/form/radio/Radio.js.map +1 -1
- package/esm/form/radio/RadioGroup.d.ts +1 -1
- package/esm/form/radio/RadioGroup.js.map +1 -1
- package/esm/form/radio/useRadio.js +2 -1
- package/esm/form/radio/useRadio.js.map +1 -1
- package/esm/form/search-field/SearchField.js +5 -2
- package/esm/form/search-field/SearchField.js.map +1 -1
- package/esm/loader/Loader.js +1 -1
- package/esm/loader/Loader.js.map +1 -1
- package/package.json +5 -4
- package/src/form/Fieldset/Fieldset.tsx +25 -12
- package/src/form/Select.tsx +5 -1
- package/src/form/TextField.tsx +30 -11
- package/src/form/Textarea.tsx +5 -1
- package/src/form/checkbox/Checkbox.tsx +30 -37
- package/src/form/checkbox/CheckboxGroup.tsx +2 -1
- package/src/form/checkbox/stories/checkbox.stories.mdx +17 -45
- package/src/form/checkbox/stories/checkbox.stories.tsx +55 -82
- package/src/form/checkbox/useCheckbox.ts +5 -1
- package/src/form/radio/Radio.tsx +26 -40
- package/src/form/radio/RadioGroup.tsx +2 -1
- package/src/form/radio/stories/radio.stories.mdx +3 -29
- package/src/form/radio/stories/radio.stories.tsx +33 -61
- package/src/form/radio/useRadio.ts +5 -1
- package/src/form/search-field/SearchField.tsx +5 -1
- package/src/form/search-field/stories/search-field.stories.tsx +25 -1
- package/src/form/stories/fieldset.stories.tsx +6 -2
- package/src/form/stories/select.stories.tsx +1 -1
- package/src/form/stories/text-field.stories.tsx +23 -1
- package/src/form/stories/textarea.stories.tsx +12 -2
- package/src/grid/stories/grid.stories.mdx +3 -3
- package/src/guide-panel/stories/example.css +4 -4
- package/src/guide-panel/stories/guidepanel.stories.mdx +7 -7
- package/src/guide-panel/stories/guidepanel.stories.tsx +6 -6
- package/src/loader/Loader.tsx +1 -1
- package/src/loader/stories/loader.stories.mdx +0 -16
- package/src/popover/stories/popover.stories.tsx +1 -1
- package/src/speech-bubble/stories/speechbubble.stories.mdx +4 -4
- package/src/speech-bubble/stories/speechbubble.stories.tsx +2 -2
- package/src/typography/stories/index.css +1 -1
|
@@ -58,9 +58,12 @@ const Fieldset = (0, react_1.forwardRef)((props, ref) => {
|
|
|
58
58
|
react_1.default.createElement(__1.Label, { size: size, as: "legend", className: (0, classnames_1.default)("navds-fieldset__legend", {
|
|
59
59
|
"sr-only": !!hideLegend,
|
|
60
60
|
}) }, legend),
|
|
61
|
-
!!description &&
|
|
62
|
-
|
|
63
|
-
|
|
61
|
+
!!description &&
|
|
62
|
+
(size === "medium" ? (react_1.default.createElement(__1.BodyShort, { className: (0, classnames_1.default)("navds-fieldset__description", {
|
|
63
|
+
"sr-only": !!hideLegend,
|
|
64
|
+
}), id: inputDescriptionId, size: "small", as: "div" }, props.description)) : (react_1.default.createElement(__1.Detail, { className: (0, classnames_1.default)("navds-fieldset__description", {
|
|
65
|
+
"sr-only": !!hideLegend,
|
|
66
|
+
}), id: inputDescriptionId, size: "small", as: "div" }, props.description))),
|
|
64
67
|
children,
|
|
65
68
|
react_1.default.createElement("div", { id: errorId, "aria-relevant": "additions removals", "aria-live": "polite", className: "navds-fieldset__error" }, showErrorMsg && (react_1.default.createElement(ErrorMessage_1.default, { size: size }, props.error))))));
|
|
66
69
|
});
|
package/cjs/form/Select.js
CHANGED
|
@@ -42,11 +42,14 @@ const useFormField_1 = require("./useFormField");
|
|
|
42
42
|
const Select = (0, react_1.forwardRef)((props, ref) => {
|
|
43
43
|
const { inputProps, errorId, showErrorMsg, hasError, size, inputDescriptionId, } = (0, useFormField_1.useFormField)(props, "textField");
|
|
44
44
|
const { children, label, className, description, htmlSize, hideLabel = false } = props, rest = __rest(props, ["children", "label", "className", "description", "htmlSize", "hideLabel"]);
|
|
45
|
-
return (react_1.default.createElement("div", { className: (0, classnames_1.default)(className, "navds-form-field", `navds-form-field--${size}`, {
|
|
45
|
+
return (react_1.default.createElement("div", { className: (0, classnames_1.default)(className, "navds-form-field", `navds-form-field--${size}`, {
|
|
46
|
+
"navds-select--error": hasError,
|
|
47
|
+
"navds-select--disabled": !!inputProps.disabled,
|
|
48
|
+
}) },
|
|
46
49
|
react_1.default.createElement(__1.Label, { htmlFor: inputProps.id, size: size, as: "label", className: (0, classnames_1.default)("navds-select__label", {
|
|
47
50
|
"sr-only": hideLabel,
|
|
48
51
|
}) }, label),
|
|
49
|
-
!!description && (react_1.default.createElement(__1.BodyShort, { className: (0, classnames_1.default)("navds-select__description", {
|
|
52
|
+
!!description && (react_1.default.createElement(__1.BodyShort, { as: "div", className: (0, classnames_1.default)("navds-select__description", {
|
|
50
53
|
"sr-only": hideLabel,
|
|
51
54
|
}), id: inputDescriptionId, size: size }, description)),
|
|
52
55
|
react_1.default.createElement("div", { className: "navds-select__container" },
|
package/cjs/form/TextField.js
CHANGED
|
@@ -41,11 +41,16 @@ const useFormField_1 = require("./useFormField");
|
|
|
41
41
|
const TextField = (0, react_1.forwardRef)((props, ref) => {
|
|
42
42
|
const { inputProps, errorId, showErrorMsg, hasError, size, inputDescriptionId, } = (0, useFormField_1.useFormField)(props, "textField");
|
|
43
43
|
const { label, className, description, htmlSize, hideLabel = false, type = "text" } = props, rest = __rest(props, ["label", "className", "description", "htmlSize", "hideLabel", "type"]);
|
|
44
|
-
return (react_1.default.createElement("div", { className: (0, classnames_1.default)(className, "navds-form-field", `navds-form-field--${size}`, {
|
|
44
|
+
return (react_1.default.createElement("div", { className: (0, classnames_1.default)(className, "navds-form-field", `navds-form-field--${size}`, {
|
|
45
|
+
"navds-text-field--error": hasError,
|
|
46
|
+
"navds-text-field--disabled": !!inputProps.disabled,
|
|
47
|
+
}) },
|
|
45
48
|
react_1.default.createElement(__1.Label, { htmlFor: inputProps.id, size: size, as: "label", className: (0, classnames_1.default)("navds-text-field__label", { "sr-only": hideLabel }) }, label),
|
|
46
|
-
!!description && (react_1.default.createElement(__1.BodyShort, { className: (0, classnames_1.default)("navds-text-field__description", {
|
|
49
|
+
!!description && (react_1.default.createElement(react_1.default.Fragment, null, size === "medium" ? (react_1.default.createElement(__1.BodyShort, { className: (0, classnames_1.default)("navds-text-field__description", {
|
|
47
50
|
"sr-only": hideLabel,
|
|
48
|
-
}), id: inputDescriptionId, size:
|
|
51
|
+
}), id: inputDescriptionId, size: "small", as: "div" }, description)) : (react_1.default.createElement(__1.Detail, { className: (0, classnames_1.default)("navds-text-field__description", {
|
|
52
|
+
"sr-only": hideLabel,
|
|
53
|
+
}), id: inputDescriptionId, size: "small", as: "div" }, description)))),
|
|
49
54
|
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 })),
|
|
50
55
|
react_1.default.createElement("div", { id: errorId, "aria-relevant": "additions removals", "aria-live": "polite" }, showErrorMsg && react_1.default.createElement(ErrorMessage_1.default, { size: size }, props.error))));
|
|
51
56
|
});
|
package/cjs/form/Textarea.js
CHANGED
|
@@ -46,11 +46,14 @@ const Textarea = (0, react_1.forwardRef)((props, ref) => {
|
|
|
46
46
|
const { label, className, description, maxLength, hideLabel = false } = props, rest = __rest(props, ["label", "className", "description", "maxLength", "hideLabel"]);
|
|
47
47
|
const maxLengthId = `TextareaMaxLength-${(0, __2.useId)()}`;
|
|
48
48
|
const hasMaxLength = maxLength !== undefined && maxLength > 0;
|
|
49
|
-
return (react_1.default.createElement("div", { className: (0, classnames_1.default)(className, "navds-form-field", `navds-form-field--${size}`, {
|
|
49
|
+
return (react_1.default.createElement("div", { className: (0, classnames_1.default)(className, "navds-form-field", `navds-form-field--${size}`, {
|
|
50
|
+
"navds-textarea--error": hasError,
|
|
51
|
+
"navds-textarea--disabled": !!inputProps.disabled,
|
|
52
|
+
}) },
|
|
50
53
|
react_1.default.createElement(__1.Label, { htmlFor: inputProps.id, size: size, as: "label", className: (0, classnames_1.default)("navds-textarea__label", {
|
|
51
54
|
"sr-only": hideLabel,
|
|
52
55
|
}) }, label),
|
|
53
|
-
!!description && (react_1.default.createElement(__1.BodyShort, { className: (0, classnames_1.default)("navds-textarea__description", {
|
|
56
|
+
!!description && (react_1.default.createElement(__1.BodyShort, { as: "div", className: (0, classnames_1.default)("navds-textarea__description", {
|
|
54
57
|
"sr-only": hideLabel,
|
|
55
58
|
}), id: inputDescriptionId, size: size }, description)),
|
|
56
59
|
react_1.default.createElement("div", { className: "navds-textarea__wrapper" },
|
|
@@ -25,25 +25,26 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
25
25
|
const react_1 = __importStar(require("react"));
|
|
26
26
|
const classnames_1 = __importDefault(require("classnames"));
|
|
27
27
|
const useCheckbox_1 = __importDefault(require("./useCheckbox"));
|
|
28
|
-
const ErrorMessage_1 = __importDefault(require("../ErrorMessage"));
|
|
29
28
|
const __1 = require("../..");
|
|
30
29
|
const Checkbox = (0, react_1.forwardRef)((props, ref) => {
|
|
31
|
-
const { inputProps,
|
|
30
|
+
const { inputProps, hasError, size } = (0, useCheckbox_1.default)(props);
|
|
31
|
+
const Description = size === "medium" ? __1.BodyShort : __1.Detail;
|
|
32
32
|
return (react_1.default.createElement("div", { className: (0, classnames_1.default)(props.className, "navds-checkbox", `navds-checkbox--${size}`, {
|
|
33
33
|
"navds-checkbox--error": hasError,
|
|
34
|
-
"navds-checkbox--
|
|
35
|
-
"navds-checkbox--with-description": !!props.description,
|
|
34
|
+
"navds-checkbox--disabled": inputProps.disabled,
|
|
36
35
|
}) },
|
|
37
36
|
react_1.default.createElement("input", Object.assign({}, (0, __1.omit)(props, [
|
|
38
37
|
"children",
|
|
39
38
|
"size",
|
|
40
39
|
"error",
|
|
41
|
-
"errorId",
|
|
42
40
|
"description",
|
|
43
41
|
"hideLabel",
|
|
44
42
|
]), inputProps, { className: "navds-checkbox__input", ref: ref })),
|
|
45
|
-
react_1.default.createElement(
|
|
46
|
-
|
|
47
|
-
|
|
43
|
+
react_1.default.createElement("label", { htmlFor: inputProps.id, className: "navds-checkbox__label" },
|
|
44
|
+
react_1.default.createElement("div", { className: (0, classnames_1.default)("navds-checkbox__content", {
|
|
45
|
+
"sr-only": props.hideLabel,
|
|
46
|
+
}) },
|
|
47
|
+
react_1.default.createElement(__1.BodyShort, { as: "div", size: size }, props.children),
|
|
48
|
+
props.description && (react_1.default.createElement(Description, { as: "div", size: "small", className: "navds-checkbox__description" }, props.description))))));
|
|
48
49
|
});
|
|
49
50
|
exports.default = Checkbox;
|
|
@@ -14,13 +14,14 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
14
14
|
const react_1 = require("react");
|
|
15
15
|
const useFormField_1 = require("../useFormField");
|
|
16
16
|
const CheckboxGroup_1 = require("./CheckboxGroup");
|
|
17
|
+
const __1 = require("../..");
|
|
17
18
|
/**
|
|
18
19
|
* Handles props for Checkboxes in context with Fieldset and CheckboxGroup
|
|
19
20
|
*/
|
|
20
21
|
const useCheckbox = (_a) => {
|
|
21
22
|
var { children } = _a, props = __rest(_a, ["children"]);
|
|
22
23
|
const checkboxGroup = (0, react_1.useContext)(CheckboxGroup_1.CheckboxGroupContext);
|
|
23
|
-
const _b = (0, useFormField_1.useFormField)(props, "checkbox"), { inputProps } = _b, rest = __rest(_b, ["inputProps"]);
|
|
24
|
+
const _b = (0, useFormField_1.useFormField)((0, __1.omit)(props, ["description"]), "checkbox"), { inputProps } = _b, rest = __rest(_b, ["inputProps"]);
|
|
24
25
|
if (checkboxGroup) {
|
|
25
26
|
if (props.checked) {
|
|
26
27
|
console.warn("`checked` is unsupported on <Checkbox> elements within a <CheckboxGroup>. Please set a `value` or `defaultValue` on <CheckboxGroup> instead.");
|
package/cjs/form/radio/Radio.js
CHANGED
|
@@ -25,24 +25,18 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
25
25
|
const react_1 = __importStar(require("react"));
|
|
26
26
|
const classnames_1 = __importDefault(require("classnames"));
|
|
27
27
|
const __1 = require("../..");
|
|
28
|
-
const ErrorMessage_1 = __importDefault(require("../ErrorMessage"));
|
|
29
28
|
const useRadio_1 = require("./useRadio");
|
|
30
29
|
const Radio = (0, react_1.forwardRef)((props, ref) => {
|
|
31
|
-
const { inputProps,
|
|
30
|
+
const { inputProps, size, hasError } = (0, useRadio_1.useRadio)(props);
|
|
31
|
+
const Description = size === "medium" ? __1.BodyShort : __1.Detail;
|
|
32
32
|
return (react_1.default.createElement("div", { className: (0, classnames_1.default)(props.className, "navds-radio", `navds-radio--${size}`, {
|
|
33
33
|
"navds-radio--error": hasError,
|
|
34
|
-
"navds-radio--
|
|
35
|
-
"navds-radio--with-description": !!props.description,
|
|
34
|
+
"navds-radio--disabled": inputProps.disabled,
|
|
36
35
|
}) },
|
|
37
|
-
react_1.default.createElement("input", Object.assign({}, (0, __1.omit)(props, [
|
|
38
|
-
|
|
39
|
-
"
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
"description",
|
|
43
|
-
]), inputProps, { className: "navds-radio__input", ref: ref })),
|
|
44
|
-
react_1.default.createElement(__1.BodyShort, { as: "label", htmlFor: inputProps.id, size: size, className: "navds-radio__label" }, props.children),
|
|
45
|
-
props.description && (react_1.default.createElement(__1.BodyShort, { size: size, id: inputDescriptionId, className: "navds-radio__description" }, props.description)),
|
|
46
|
-
react_1.default.createElement("div", { id: errorId, "aria-relevant": "additions removals", "aria-live": "polite" }, showErrorMsg && react_1.default.createElement(ErrorMessage_1.default, { size: size }, props.error))));
|
|
36
|
+
react_1.default.createElement("input", Object.assign({}, (0, __1.omit)(props, ["children", "size", "description"]), inputProps, { className: "navds-radio__input", ref: ref })),
|
|
37
|
+
react_1.default.createElement("label", { htmlFor: inputProps.id, className: "navds-radio__label" },
|
|
38
|
+
react_1.default.createElement("div", { className: "navds-radio__content" },
|
|
39
|
+
react_1.default.createElement(__1.BodyShort, { as: "div", size: size }, props.children),
|
|
40
|
+
props.description && (react_1.default.createElement(Description, { as: "div", size: "small", className: "navds-radio__description" }, props.description))))));
|
|
47
41
|
});
|
|
48
42
|
exports.default = Radio;
|
|
@@ -15,12 +15,13 @@ exports.useRadio = void 0;
|
|
|
15
15
|
const react_1 = require("react");
|
|
16
16
|
const useFormField_1 = require("../useFormField");
|
|
17
17
|
const RadioGroup_1 = require("./RadioGroup");
|
|
18
|
+
const __1 = require("../..");
|
|
18
19
|
/**
|
|
19
20
|
* Handles props for Radios in context with Fieldset and RadioGroup
|
|
20
21
|
*/
|
|
21
22
|
const useRadio = (props) => {
|
|
22
23
|
const radioGroup = (0, react_1.useContext)(RadioGroup_1.RadioGroupContext);
|
|
23
|
-
const _a = (0, useFormField_1.useFormField)(props, "radio"), { inputProps } = _a, rest = __rest(_a, ["inputProps"]);
|
|
24
|
+
const _a = (0, useFormField_1.useFormField)((0, __1.omit)(props, ["description"]), "radio"), { inputProps } = _a, rest = __rest(_a, ["inputProps"]);
|
|
24
25
|
if (!radioGroup) {
|
|
25
26
|
console.warn("<Radio> must be used inside <RadioGroup>.");
|
|
26
27
|
}
|
|
@@ -46,11 +46,14 @@ exports.SearchFieldContext = react_1.default.createContext(null);
|
|
|
46
46
|
const SearchField = (0, react_1.forwardRef)((props, ref) => {
|
|
47
47
|
const { inputProps, errorId, showErrorMsg, hasError, size, inputDescriptionId, } = (0, useFormField_1.useFormField)(props, "searchfield");
|
|
48
48
|
const { className, hideLabel, children, label, description, error } = props, rest = __rest(props, ["className", "hideLabel", "children", "label", "description", "error"]);
|
|
49
|
-
return (react_1.default.createElement("div", Object.assign({ ref: ref }, (0, __1.omit)(rest, ["id", "error", "errorId", "size", "disabled"]), { className: (0, classnames_1.default)(className, "navds-form-field", `navds-form-field--${size !== null && size !== void 0 ? size : "medium"}`, "navds-search-field", {
|
|
49
|
+
return (react_1.default.createElement("div", Object.assign({ ref: ref }, (0, __1.omit)(rest, ["id", "error", "errorId", "size", "disabled"]), { className: (0, classnames_1.default)(className, "navds-form-field", `navds-form-field--${size !== null && size !== void 0 ? size : "medium"}`, "navds-search-field", {
|
|
50
|
+
"navds-search-field--error": hasError,
|
|
51
|
+
"navds-search-field--disabled": !!inputProps.disabled,
|
|
52
|
+
}) }),
|
|
50
53
|
react_1.default.createElement(__1.Label, { htmlFor: inputProps.id, size: size, as: "label", className: (0, classnames_1.default)("navds-text-field__label", {
|
|
51
54
|
"sr-only": hideLabel,
|
|
52
55
|
}) }, label),
|
|
53
|
-
!!description && (react_1.default.createElement(__1.BodyShort, { className: (0, classnames_1.default)("navds-text-field__description", {
|
|
56
|
+
!!description && (react_1.default.createElement(__1.BodyShort, { as: "div", className: (0, classnames_1.default)("navds-text-field__description", {
|
|
54
57
|
"sr-only": hideLabel,
|
|
55
58
|
}), id: inputDescriptionId, size: size }, description)),
|
|
56
59
|
react_1.default.createElement("div", { className: "navds-search-field__input-wrapper" },
|
package/cjs/loader/Loader.js
CHANGED
|
@@ -44,6 +44,6 @@ const Loader = (0, react_1.forwardRef)((_a, ref) => {
|
|
|
44
44
|
}), focusable: "false", viewBox: "0 0 50 50", preserveAspectRatio: "xMidYMid" }, rest),
|
|
45
45
|
react_1.default.createElement("title", { id: id !== null && id !== void 0 ? id : `loader-${internalId}` }, title),
|
|
46
46
|
react_1.default.createElement("circle", { className: "navds-loader__background", xmlns: "http://www.w3.org/2000/svg", cx: "25", cy: "25", r: "20", fill: "none", strokeWidth: "5" }),
|
|
47
|
-
react_1.default.createElement("circle", { className: "navds-loader__foreground", cx: "25", cy: "25", r: "20", stroke: "var(--navds-color-gray-
|
|
47
|
+
react_1.default.createElement("circle", { className: "navds-loader__foreground", cx: "25", cy: "25", r: "20", stroke: "var(--navds-global-color-gray-400)", fill: "none", strokeWidth: "5", strokeDasharray: "50 155", strokeLinecap: "round" })));
|
|
48
48
|
});
|
|
49
49
|
exports.default = Loader;
|
|
@@ -11,7 +11,7 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
11
11
|
};
|
|
12
12
|
import cl from "classnames";
|
|
13
13
|
import React, { forwardRef, useContext } from "react";
|
|
14
|
-
import { BodyShort, Label, omit } from "../..";
|
|
14
|
+
import { BodyShort, Detail, Label, omit } from "../..";
|
|
15
15
|
import ErrorMessage from "../ErrorMessage";
|
|
16
16
|
import { useFieldset } from "./useFieldset";
|
|
17
17
|
export const FieldsetContext = React.createContext(null);
|
|
@@ -33,9 +33,12 @@ const Fieldset = forwardRef((props, ref) => {
|
|
|
33
33
|
React.createElement(Label, { size: size, as: "legend", className: cl("navds-fieldset__legend", {
|
|
34
34
|
"sr-only": !!hideLegend,
|
|
35
35
|
}) }, legend),
|
|
36
|
-
!!description &&
|
|
37
|
-
|
|
38
|
-
|
|
36
|
+
!!description &&
|
|
37
|
+
(size === "medium" ? (React.createElement(BodyShort, { className: cl("navds-fieldset__description", {
|
|
38
|
+
"sr-only": !!hideLegend,
|
|
39
|
+
}), id: inputDescriptionId, size: "small", as: "div" }, props.description)) : (React.createElement(Detail, { className: cl("navds-fieldset__description", {
|
|
40
|
+
"sr-only": !!hideLegend,
|
|
41
|
+
}), id: inputDescriptionId, size: "small", as: "div" }, props.description))),
|
|
39
42
|
children,
|
|
40
43
|
React.createElement("div", { id: errorId, "aria-relevant": "additions removals", "aria-live": "polite", className: "navds-fieldset__error" }, showErrorMsg && (React.createElement(ErrorMessage, { size: size }, props.error))))));
|
|
41
44
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Fieldset.js","sourceRoot":"","sources":["../../../src/form/Fieldset/Fieldset.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,KAAK,EAAE,EAA0B,UAAU,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC9E,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"Fieldset.js","sourceRoot":"","sources":["../../../src/form/Fieldset/Fieldset.tsx"],"names":[],"mappings":"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"}
|
package/esm/form/Select.js
CHANGED
|
@@ -18,11 +18,14 @@ import { useFormField } from "./useFormField";
|
|
|
18
18
|
const Select = forwardRef((props, ref) => {
|
|
19
19
|
const { inputProps, errorId, showErrorMsg, hasError, size, inputDescriptionId, } = useFormField(props, "textField");
|
|
20
20
|
const { children, label, className, description, htmlSize, hideLabel = false } = props, rest = __rest(props, ["children", "label", "className", "description", "htmlSize", "hideLabel"]);
|
|
21
|
-
return (React.createElement("div", { className: cl(className, "navds-form-field", `navds-form-field--${size}`, {
|
|
21
|
+
return (React.createElement("div", { className: cl(className, "navds-form-field", `navds-form-field--${size}`, {
|
|
22
|
+
"navds-select--error": hasError,
|
|
23
|
+
"navds-select--disabled": !!inputProps.disabled,
|
|
24
|
+
}) },
|
|
22
25
|
React.createElement(Label, { htmlFor: inputProps.id, size: size, as: "label", className: cl("navds-select__label", {
|
|
23
26
|
"sr-only": hideLabel,
|
|
24
27
|
}) }, label),
|
|
25
|
-
!!description && (React.createElement(BodyShort, { className: cl("navds-select__description", {
|
|
28
|
+
!!description && (React.createElement(BodyShort, { as: "div", className: cl("navds-select__description", {
|
|
26
29
|
"sr-only": hideLabel,
|
|
27
30
|
}), id: inputDescriptionId, size: size }, description)),
|
|
28
31
|
React.createElement("div", { className: "navds-select__container" },
|
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,IAAI,EAAE,MAAM,IAAI,CAAC;AAC5C,OAAO,YAAY,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAkB,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAuB9D,MAAM,MAAM,GAAG,UAAU,CAAiC,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IACvE,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,
|
|
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,IAAI,EAAE,MAAM,IAAI,CAAC;AAC5C,OAAO,YAAY,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAkB,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAuB9D,MAAM,MAAM,GAAG,UAAU,CAAiC,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IACvE,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,qBAAqB,EAAE,QAAQ;YAC/B,wBAAwB,EAAE,CAAC,CAAC,UAAU,CAAC,QAAQ;SAChD,CACF;QAED,oBAAC,KAAK,IACJ,OAAO,EAAE,UAAU,CAAC,EAAE,EACtB,IAAI,EAAE,IAAI,EACV,EAAE,EAAC,OAAO,EACV,SAAS,EAAE,EAAE,CAAC,qBAAqB,EAAE;gBACnC,SAAS,EAAE,SAAS;aACrB,CAAC,IAED,KAAK,CACA;QACP,CAAC,CAAC,WAAW,IAAI,CAChB,oBAAC,SAAS,IACR,EAAE,EAAC,KAAK,EACR,SAAS,EAAE,EAAE,CAAC,2BAA2B,EAAE;gBACzC,SAAS,EAAE,SAAS;aACrB,CAAC,EACF,EAAE,EAAE,kBAAkB,EACtB,IAAI,EAAE,IAAI,IAET,WAAW,CACF,CACb;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,GAAG,CACxC;QACN,6BAAK,EAAE,EAAE,OAAO,mBAAgB,oBAAoB,eAAW,QAAQ,IACpE,YAAY,IAAI,oBAAC,YAAY,IAAC,IAAI,EAAE,IAAI,IAAG,KAAK,CAAC,KAAK,CAAgB,CACnE,CACF,CACP,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,MAAM,CAAC"}
|
package/esm/form/TextField.js
CHANGED
|
@@ -11,17 +11,22 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
11
11
|
};
|
|
12
12
|
import React, { forwardRef } from "react";
|
|
13
13
|
import cl from "classnames";
|
|
14
|
-
import { BodyShort, Label, omit } from "..";
|
|
14
|
+
import { BodyShort, Detail, Label, omit } from "..";
|
|
15
15
|
import ErrorMessage from "./ErrorMessage";
|
|
16
16
|
import { useFormField } from "./useFormField";
|
|
17
17
|
const TextField = forwardRef((props, ref) => {
|
|
18
18
|
const { inputProps, errorId, showErrorMsg, hasError, size, inputDescriptionId, } = useFormField(props, "textField");
|
|
19
19
|
const { label, className, description, htmlSize, hideLabel = false, type = "text" } = props, rest = __rest(props, ["label", "className", "description", "htmlSize", "hideLabel", "type"]);
|
|
20
|
-
return (React.createElement("div", { className: cl(className, "navds-form-field", `navds-form-field--${size}`, {
|
|
20
|
+
return (React.createElement("div", { className: cl(className, "navds-form-field", `navds-form-field--${size}`, {
|
|
21
|
+
"navds-text-field--error": hasError,
|
|
22
|
+
"navds-text-field--disabled": !!inputProps.disabled,
|
|
23
|
+
}) },
|
|
21
24
|
React.createElement(Label, { htmlFor: inputProps.id, size: size, as: "label", className: cl("navds-text-field__label", { "sr-only": hideLabel }) }, label),
|
|
22
|
-
!!description && (React.createElement(BodyShort, { className: cl("navds-text-field__description", {
|
|
25
|
+
!!description && (React.createElement(React.Fragment, null, size === "medium" ? (React.createElement(BodyShort, { className: cl("navds-text-field__description", {
|
|
23
26
|
"sr-only": hideLabel,
|
|
24
|
-
}), id: inputDescriptionId, size:
|
|
27
|
+
}), id: inputDescriptionId, size: "small", as: "div" }, description)) : (React.createElement(Detail, { className: cl("navds-text-field__description", {
|
|
28
|
+
"sr-only": hideLabel,
|
|
29
|
+
}), id: inputDescriptionId, size: "small", as: "div" }, description)))),
|
|
25
30
|
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 })),
|
|
26
31
|
React.createElement("div", { id: errorId, "aria-relevant": "additions removals", "aria-live": "polite" }, showErrorMsg && React.createElement(ErrorMessage, { size: size }, props.error))));
|
|
27
32
|
});
|
|
@@ -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,KAAK,EAAE,IAAI,EAAE,MAAM,IAAI,CAAC;
|
|
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,IAAI,EAAE,MAAM,IAAI,CAAC;AACpD,OAAO,YAAY,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAkB,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAwB9D,MAAM,SAAS,GAAG,UAAU,CAAmC,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IAC5E,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,EAAE,SAAS,EAAE,SAAS,EAAE,CAAC,IAEjE,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,SAAS,EAAE,SAAS;aACrB,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,SAAS,EAAE,SAAS;aACrB,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,6BAAK,EAAE,EAAE,OAAO,mBAAgB,oBAAoB,eAAW,QAAQ,IACpE,YAAY,IAAI,oBAAC,YAAY,IAAC,IAAI,EAAE,IAAI,IAAG,KAAK,CAAC,KAAK,CAAgB,CACnE,CACF,CACP,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,SAAS,CAAC"}
|
package/esm/form/Textarea.js
CHANGED
|
@@ -21,11 +21,14 @@ const Textarea = forwardRef((props, ref) => {
|
|
|
21
21
|
const { label, className, description, maxLength, hideLabel = false } = props, rest = __rest(props, ["label", "className", "description", "maxLength", "hideLabel"]);
|
|
22
22
|
const maxLengthId = `TextareaMaxLength-${useId()}`;
|
|
23
23
|
const hasMaxLength = maxLength !== undefined && maxLength > 0;
|
|
24
|
-
return (React.createElement("div", { className: cl(className, "navds-form-field", `navds-form-field--${size}`, {
|
|
24
|
+
return (React.createElement("div", { className: cl(className, "navds-form-field", `navds-form-field--${size}`, {
|
|
25
|
+
"navds-textarea--error": hasError,
|
|
26
|
+
"navds-textarea--disabled": !!inputProps.disabled,
|
|
27
|
+
}) },
|
|
25
28
|
React.createElement(Label, { htmlFor: inputProps.id, size: size, as: "label", className: cl("navds-textarea__label", {
|
|
26
29
|
"sr-only": hideLabel,
|
|
27
30
|
}) }, label),
|
|
28
|
-
!!description && (React.createElement(BodyShort, { className: cl("navds-textarea__description", {
|
|
31
|
+
!!description && (React.createElement(BodyShort, { as: "div", className: cl("navds-textarea__description", {
|
|
29
32
|
"sr-only": hideLabel,
|
|
30
33
|
}), id: inputDescriptionId, size: size }, description)),
|
|
31
34
|
React.createElement("div", { className: "navds-textarea__wrapper" },
|
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,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,gBAAgB,MAAM,oCAAoC,CAAC;AAClE,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,IAAI,CAAC;AAC5C,OAAO,YAAY,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAkB,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9D,OAAO,EAAE,KAAK,EAAE,MAAM,IAAI,CAAC;AAiC3B,MAAM,QAAQ,GAAG,UAAU,CACzB,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,UAAU,CAAC,CAAC;IAEpC,MAAM,EACJ,KAAK,EACL,SAAS,EACT,WAAW,EACX,SAAS,EACT,SAAS,GAAG,KAAK,KAEf,KAAK,EADJ,IAAI,UACL,KAAK,EAPH,+DAOL,CAAQ,CAAC;IAEV,MAAM,WAAW,GAAG,qBAAqB,KAAK,EAAE,EAAE,CAAC;IACnD,MAAM,YAAY,GAAG,SAAS,KAAK,SAAS,IAAI,SAAS,GAAG,CAAC,CAAC;IAE9D,OAAO,CACL,6BACE,SAAS,EAAE,EAAE,CACX,SAAS,EACT,kBAAkB,EAClB,qBAAqB,IAAI,EAAE,EAC3B,
|
|
1
|
+
{"version":3,"file":"Textarea.js","sourceRoot":"","sources":["../../src/form/Textarea.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,6 +1,11 @@
|
|
|
1
1
|
import React, { InputHTMLAttributes } from "react";
|
|
2
2
|
import { FormFieldProps } from "../useFormField";
|
|
3
|
-
export interface CheckboxProps extends FormFieldProps, Omit<InputHTMLAttributes<HTMLInputElement>, "size"> {
|
|
3
|
+
export interface CheckboxProps extends Omit<FormFieldProps, "errorId">, Omit<InputHTMLAttributes<HTMLInputElement>, "size"> {
|
|
4
|
+
/**
|
|
5
|
+
* Checkbox has error
|
|
6
|
+
* @default false
|
|
7
|
+
*/
|
|
8
|
+
error?: boolean;
|
|
4
9
|
/**
|
|
5
10
|
* Label for checkbox
|
|
6
11
|
*/
|
|
@@ -1,26 +1,27 @@
|
|
|
1
1
|
import React, { forwardRef } from "react";
|
|
2
2
|
import cl from "classnames";
|
|
3
3
|
import useCheckbox from "./useCheckbox";
|
|
4
|
-
import
|
|
5
|
-
import { BodyShort, omit } from "../..";
|
|
4
|
+
import { BodyShort, Detail, omit } from "../..";
|
|
6
5
|
const Checkbox = forwardRef((props, ref) => {
|
|
7
|
-
const { inputProps,
|
|
6
|
+
const { inputProps, hasError, size } = useCheckbox(props);
|
|
7
|
+
const Description = size === "medium" ? BodyShort : Detail;
|
|
8
8
|
return (React.createElement("div", { className: cl(props.className, "navds-checkbox", `navds-checkbox--${size}`, {
|
|
9
9
|
"navds-checkbox--error": hasError,
|
|
10
|
-
"navds-checkbox--
|
|
11
|
-
"navds-checkbox--with-description": !!props.description,
|
|
10
|
+
"navds-checkbox--disabled": inputProps.disabled,
|
|
12
11
|
}) },
|
|
13
12
|
React.createElement("input", Object.assign({}, omit(props, [
|
|
14
13
|
"children",
|
|
15
14
|
"size",
|
|
16
15
|
"error",
|
|
17
|
-
"errorId",
|
|
18
16
|
"description",
|
|
19
17
|
"hideLabel",
|
|
20
18
|
]), inputProps, { className: "navds-checkbox__input", ref: ref })),
|
|
21
|
-
React.createElement(
|
|
22
|
-
|
|
23
|
-
|
|
19
|
+
React.createElement("label", { htmlFor: inputProps.id, className: "navds-checkbox__label" },
|
|
20
|
+
React.createElement("div", { className: cl("navds-checkbox__content", {
|
|
21
|
+
"sr-only": props.hideLabel,
|
|
22
|
+
}) },
|
|
23
|
+
React.createElement(BodyShort, { as: "div", size: size }, props.children),
|
|
24
|
+
props.description && (React.createElement(Description, { as: "div", size: "small", className: "navds-checkbox__description" }, props.description))))));
|
|
24
25
|
});
|
|
25
26
|
export default Checkbox;
|
|
26
27
|
//# sourceMappingURL=Checkbox.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["../../../src/form/checkbox/Checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAuB,MAAM,OAAO,CAAC;AAC/D,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,WAAW,MAAM,eAAe,CAAC;
|
|
1
|
+
{"version":3,"file":"Checkbox.js","sourceRoot":"","sources":["../../../src/form/checkbox/Checkbox.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAuB,MAAM,OAAO,CAAC;AAC/D,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,WAAW,MAAM,eAAe,CAAC;AAExC,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,OAAO,CAAC;AAwBhD,MAAM,QAAQ,GAAG,UAAU,CAAkC,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IAC1E,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,IAAI,EAAE,GAAG,WAAW,CAAC,KAAK,CAAC,CAAC;IAE1D,MAAM,WAAW,GAAG,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC;IAE3D,OAAO,CACL,6BACE,SAAS,EAAE,EAAE,CACX,KAAK,CAAC,SAAS,EACf,gBAAgB,EAChB,mBAAmB,IAAI,EAAE,EACzB;YACE,uBAAuB,EAAE,QAAQ;YACjC,0BAA0B,EAAE,UAAU,CAAC,QAAQ;SAChD,CACF;QAED,+CACM,IAAI,CAAC,KAAK,EAAE;YACd,UAAU;YACV,MAAM;YACN,OAAO;YACP,aAAa;YACb,WAAW;SACZ,CAAC,EACE,UAAU,IACd,SAAS,EAAC,uBAAuB,EACjC,GAAG,EAAE,GAAG,IACR;QACF,+BAAO,OAAO,EAAE,UAAU,CAAC,EAAE,EAAE,SAAS,EAAC,uBAAuB;YAC9D,6BACE,SAAS,EAAE,EAAE,CAAC,yBAAyB,EAAE;oBACvC,SAAS,EAAE,KAAK,CAAC,SAAS;iBAC3B,CAAC;gBAEF,oBAAC,SAAS,IAAC,EAAE,EAAC,KAAK,EAAC,IAAI,EAAE,IAAI,IAC3B,KAAK,CAAC,QAAQ,CACL;gBACX,KAAK,CAAC,WAAW,IAAI,CACpB,oBAAC,WAAW,IACV,EAAE,EAAC,KAAK,EACR,IAAI,EAAC,OAAO,EACZ,SAAS,EAAC,6BAA6B,IAEtC,KAAK,CAAC,WAAW,CACN,CACf,CACG,CACA,CACJ,CACP,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,QAAQ,CAAC"}
|
|
@@ -6,7 +6,7 @@ export interface CheckboxGroupState {
|
|
|
6
6
|
toggleValue(value: string): void;
|
|
7
7
|
}
|
|
8
8
|
export declare const CheckboxGroupContext: React.Context<CheckboxGroupState | null>;
|
|
9
|
-
export interface CheckboxGroupProps extends Omit<FieldsetProps, "onChange"> {
|
|
9
|
+
export interface CheckboxGroupProps extends Omit<FieldsetProps, "onChange" | "errorPropagation"> {
|
|
10
10
|
/**
|
|
11
11
|
* Checkboxes
|
|
12
12
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CheckboxGroup.js","sourceRoot":"","sources":["../../../src/form/checkbox/CheckboxGroup.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,aAAa,EAAE,UAAU,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC/E,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,EAAE,QAAQ,EAAiB,eAAe,EAAE,MAAM,IAAI,CAAC;AAQ9D,MAAM,CAAC,MAAM,oBAAoB,GAAG,aAAa,CAC/C,IAAI,CACL,CAAC;
|
|
1
|
+
{"version":3,"file":"CheckboxGroup.js","sourceRoot":"","sources":["../../../src/form/checkbox/CheckboxGroup.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,aAAa,EAAE,UAAU,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC/E,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,EAAE,QAAQ,EAAiB,eAAe,EAAE,MAAM,IAAI,CAAC;AAQ9D,MAAM,CAAC,MAAM,oBAAoB,GAAG,aAAa,CAC/C,IAAI,CACL,CAAC;AAsBF,MAAM,aAAa,GAAG,UAAU,CAC9B,CACE,EAA0E,EAC1E,GAAG,EACH,EAAE;;QAFF,EAAE,KAAK,EAAE,YAAY,EAAE,QAAQ,GAAG,GAAG,EAAE,GAAE,CAAC,EAAE,QAAQ,EAAE,SAAS,OAAW,EAAN,IAAI,cAAxE,8DAA0E,CAAF;IAGxE,MAAM,QAAQ,GAAG,UAAU,CAAC,eAAe,CAAC,CAAC;IAE7C,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAW,EAAE,CAAC,CAAC;IAEjD,MAAM,YAAY,GAAG,CAAC,CAAS,EAAE,EAAE;QACjC,MAAM,QAAQ,GAAG,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC;QACvC,MAAM,QAAQ,GAAG,QAAQ,CAAC,QAAQ,CAAC,CAAC,CAAC;YACnC,CAAC,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC;YACjC,CAAC,CAAC,CAAC,GAAG,QAAQ,EAAE,CAAC,CAAC,CAAC;QAErB,KAAK,KAAK,SAAS,IAAI,QAAQ,CAAC,QAAQ,CAAC,CAAC;QAC1C,QAAQ,CAAC,QAAQ,CAAC,CAAC;IACrB,CAAC,CAAC;IAEF,OAAO,CACL,oBAAC,QAAQ,oBACH,IAAI,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACX,SAAS,EACT,sBAAsB,EACtB,yBAAyB,MAAA,MAAA,IAAI,CAAC,IAAI,mCAAI,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,IAAI,mCAAI,QAAQ,EAAE,CACnE;QAED,oBAAC,oBAAoB,CAAC,QAAQ,IAC5B,KAAK,EAAE;gBACL,KAAK;gBACL,YAAY;gBACZ,WAAW,EAAE,CAAC,KAAa,EAAE,EAAE,CAAC,YAAY,CAAC,KAAK,CAAC;aACpD;YAED,6BAAK,SAAS,EAAC,kBAAkB,IAAE,QAAQ,CAAO,CACpB,CACvB,CACZ,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,aAAa,CAAC"}
|
|
@@ -12,13 +12,14 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
12
12
|
import { useContext } from "react";
|
|
13
13
|
import { useFormField } from "../useFormField";
|
|
14
14
|
import { CheckboxGroupContext } from "./CheckboxGroup";
|
|
15
|
+
import { omit } from "../..";
|
|
15
16
|
/**
|
|
16
17
|
* Handles props for Checkboxes in context with Fieldset and CheckboxGroup
|
|
17
18
|
*/
|
|
18
19
|
const useCheckbox = (_a) => {
|
|
19
20
|
var { children } = _a, props = __rest(_a, ["children"]);
|
|
20
21
|
const checkboxGroup = useContext(CheckboxGroupContext);
|
|
21
|
-
const _b = useFormField(props, "checkbox"), { inputProps } = _b, rest = __rest(_b, ["inputProps"]);
|
|
22
|
+
const _b = useFormField(omit(props, ["description"]), "checkbox"), { inputProps } = _b, rest = __rest(_b, ["inputProps"]);
|
|
22
23
|
if (checkboxGroup) {
|
|
23
24
|
if (props.checked) {
|
|
24
25
|
console.warn("`checked` is unsupported on <Checkbox> elements within a <CheckboxGroup>. Please set a `value` or `defaultValue` on <CheckboxGroup> instead.");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useCheckbox.js","sourceRoot":"","sources":["../../../src/form/checkbox/useCheckbox.ts"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEnC,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;
|
|
1
|
+
{"version":3,"file":"useCheckbox.js","sourceRoot":"","sources":["../../../src/form/checkbox/useCheckbox.ts"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAEnC,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AACvD,OAAO,EAAE,IAAI,EAAE,MAAM,OAAO,CAAC;AAE7B;;GAEG;AACH,MAAM,WAAW,GAAG,CAAC,EAAqC,EAAE,EAAE;QAAzC,EAAE,QAAQ,OAA2B,EAAtB,KAAK,cAApB,YAAsB,CAAF;IACvC,MAAM,aAAa,GAAG,UAAU,CAAC,oBAAoB,CAAC,CAAC;IAEvD,MAAM,KAA0B,YAAY,CAC1C,IAAI,CAAC,KAAK,EAAE,CAAC,aAAa,CAAC,CAAC,EAC5B,UAAU,CACX,EAHK,EAAE,UAAU,OAGjB,EAHsB,IAAI,cAArB,cAAuB,CAG5B,CAAC;IAEF,IAAI,aAAa,EAAE;QACjB,IAAI,KAAK,CAAC,OAAO,EAAE;YACjB,OAAO,CAAC,IAAI,CACV,8IAA8I,CAC/I,CAAC;SACH;QACD,IAAI,KAAK,CAAC,KAAK,KAAK,SAAS,EAAE;YAC7B,OAAO,CAAC,IAAI,CACV,4EAA4E,CAC7E,CAAC;SACH;KACF;IAED,uCACK,IAAI,KACP,UAAU,kCACL,UAAU,KACb,IAAI,EAAE,UAAU,EAChB,OAAO,EAAE,CAAA,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,KAAK;gBAC3B,CAAC,CAAC,aAAa,CAAC,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAe,CAAC;gBACrD,CAAC,CAAC,KAAK,CAAC,OAAO,EACjB,cAAc,EAAE,CAAA,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,YAAY;gBACzC,CAAC,CAAC,aAAa,CAAC,YAAY,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAe,CAAC;gBAC5D,CAAC,CAAC,KAAK,CAAC,cAAc,EACxB,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE;gBACd,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;gBACpC,aAAa,IAAI,aAAa,CAAC,WAAW,CAAC,KAAK,CAAC,KAAe,CAAC,CAAC;YACpE,CAAC,OAEH;AACJ,CAAC,CAAC;AAEF,eAAe,WAAW,CAAC"}
|
|
@@ -1,10 +1,13 @@
|
|
|
1
1
|
import React, { InputHTMLAttributes } from "react";
|
|
2
2
|
import { FormFieldProps } from "../useFormField";
|
|
3
|
-
export interface RadioProps extends FormFieldProps, Omit<InputHTMLAttributes<HTMLInputElement>, "size"> {
|
|
3
|
+
export interface RadioProps extends Omit<FormFieldProps, "error" | "errorId">, Omit<InputHTMLAttributes<HTMLInputElement>, "size"> {
|
|
4
4
|
/**
|
|
5
5
|
* Label for radio
|
|
6
6
|
*/
|
|
7
7
|
children: React.ReactNode;
|
|
8
|
+
/**
|
|
9
|
+
* The value of the HTML element
|
|
10
|
+
*/
|
|
8
11
|
value: string;
|
|
9
12
|
}
|
|
10
13
|
declare const Radio: React.ForwardRefExoticComponent<RadioProps & React.RefAttributes<HTMLInputElement>>;
|
package/esm/form/radio/Radio.js
CHANGED
|
@@ -1,25 +1,19 @@
|
|
|
1
1
|
import React, { forwardRef } from "react";
|
|
2
2
|
import cl from "classnames";
|
|
3
|
-
import { BodyShort, omit } from "../..";
|
|
4
|
-
import ErrorMessage from "../ErrorMessage";
|
|
3
|
+
import { BodyShort, Detail, omit } from "../..";
|
|
5
4
|
import { useRadio } from "./useRadio";
|
|
6
5
|
const Radio = forwardRef((props, ref) => {
|
|
7
|
-
const { inputProps,
|
|
6
|
+
const { inputProps, size, hasError } = useRadio(props);
|
|
7
|
+
const Description = size === "medium" ? BodyShort : Detail;
|
|
8
8
|
return (React.createElement("div", { className: cl(props.className, "navds-radio", `navds-radio--${size}`, {
|
|
9
9
|
"navds-radio--error": hasError,
|
|
10
|
-
"navds-radio--
|
|
11
|
-
"navds-radio--with-description": !!props.description,
|
|
10
|
+
"navds-radio--disabled": inputProps.disabled,
|
|
12
11
|
}) },
|
|
13
|
-
React.createElement("input", Object.assign({}, omit(props, [
|
|
14
|
-
|
|
15
|
-
"
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
"description",
|
|
19
|
-
]), inputProps, { className: "navds-radio__input", ref: ref })),
|
|
20
|
-
React.createElement(BodyShort, { as: "label", htmlFor: inputProps.id, size: size, className: "navds-radio__label" }, props.children),
|
|
21
|
-
props.description && (React.createElement(BodyShort, { size: size, id: inputDescriptionId, className: "navds-radio__description" }, props.description)),
|
|
22
|
-
React.createElement("div", { id: errorId, "aria-relevant": "additions removals", "aria-live": "polite" }, showErrorMsg && React.createElement(ErrorMessage, { size: size }, props.error))));
|
|
12
|
+
React.createElement("input", Object.assign({}, omit(props, ["children", "size", "description"]), inputProps, { className: "navds-radio__input", ref: ref })),
|
|
13
|
+
React.createElement("label", { htmlFor: inputProps.id, className: "navds-radio__label" },
|
|
14
|
+
React.createElement("div", { className: "navds-radio__content" },
|
|
15
|
+
React.createElement(BodyShort, { as: "div", size: size }, props.children),
|
|
16
|
+
props.description && (React.createElement(Description, { as: "div", size: "small", className: "navds-radio__description" }, props.description))))));
|
|
23
17
|
});
|
|
24
18
|
export default Radio;
|
|
25
19
|
//# sourceMappingURL=Radio.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Radio.js","sourceRoot":"","sources":["../../../src/form/radio/Radio.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,IAAI,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"Radio.js","sourceRoot":"","sources":["../../../src/form/radio/Radio.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,IAAI,EAAE,MAAM,OAAO,CAAC;AAEhD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAetC,MAAM,KAAK,GAAG,UAAU,CAA+B,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;IACpE,MAAM,EAAE,UAAU,EAAE,IAAI,EAAE,QAAQ,EAAE,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEvD,MAAM,WAAW,GAAG,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC;IAE3D,OAAO,CACL,6BACE,SAAS,EAAE,EAAE,CAAC,KAAK,CAAC,SAAS,EAAE,aAAa,EAAE,gBAAgB,IAAI,EAAE,EAAE;YACpE,oBAAoB,EAAE,QAAQ;YAC9B,uBAAuB,EAAE,UAAU,CAAC,QAAQ;SAC7C,CAAC;QAEF,+CACM,IAAI,CAAC,KAAK,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,aAAa,CAAC,CAAC,EAChD,UAAU,IACd,SAAS,EAAC,oBAAoB,EAC9B,GAAG,EAAE,GAAG,IACR;QACF,+BAAO,OAAO,EAAE,UAAU,CAAC,EAAE,EAAE,SAAS,EAAC,oBAAoB;YAC3D,6BAAK,SAAS,EAAC,sBAAsB;gBACnC,oBAAC,SAAS,IAAC,EAAE,EAAC,KAAK,EAAC,IAAI,EAAE,IAAI,IAC3B,KAAK,CAAC,QAAQ,CACL;gBACX,KAAK,CAAC,WAAW,IAAI,CACpB,oBAAC,WAAW,IACV,EAAE,EAAC,KAAK,EACR,IAAI,EAAC,OAAO,EACZ,SAAS,EAAC,0BAA0B,IAEnC,KAAK,CAAC,WAAW,CACN,CACf,CACG,CACA,CACJ,CACP,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,eAAe,KAAK,CAAC"}
|
|
@@ -8,7 +8,7 @@ export interface RadioGroupContextProps {
|
|
|
8
8
|
required?: boolean;
|
|
9
9
|
}
|
|
10
10
|
export declare const RadioGroupContext: React.Context<RadioGroupContextProps | null>;
|
|
11
|
-
export interface RadioGroupProps extends Omit<FieldsetProps, "onChange"> {
|
|
11
|
+
export interface RadioGroupProps extends Omit<FieldsetProps, "onChange" | "errorPropagation"> {
|
|
12
12
|
/**
|
|
13
13
|
* Collection of <Radio>-elements
|
|
14
14
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RadioGroup.js","sourceRoot":"","sources":["../../../src/form/radio/RadioGroup.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACtD,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,EAAE,QAAQ,EAAE,eAAe,EAAiB,MAAM,IAAI,CAAC;AAC9D,OAAO,EAAE,KAAK,EAAE,MAAM,OAAO,CAAC;AAU9B,MAAM,CAAC,MAAM,iBAAiB,GAAG,KAAK,CAAC,aAAa,CAClD,IAAI,CACL,CAAC;
|
|
1
|
+
{"version":3,"file":"RadioGroup.js","sourceRoot":"","sources":["../../../src/form/radio/RadioGroup.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACtD,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,EAAE,QAAQ,EAAE,eAAe,EAAiB,MAAM,IAAI,CAAC;AAC9D,OAAO,EAAE,KAAK,EAAE,MAAM,OAAO,CAAC;AAU9B,MAAM,CAAC,MAAM,iBAAiB,GAAG,KAAK,CAAC,aAAa,CAClD,IAAI,CACL,CAAC;AA8BF,MAAM,UAAU,GAAG,UAAU,CAC3B,CACE,EASC,EACD,GAAG,EACH,EAAE;;QAXF,EACE,QAAQ,EACR,SAAS,EACT,IAAI,EACJ,YAAY,EACZ,KAAK,EACL,QAAQ,GAAG,GAAG,EAAE,GAAE,CAAC,EACnB,QAAQ,OAET,EADI,IAAI,cART,kFASC,CADQ;IAIT,MAAM,QAAQ,GAAG,UAAU,CAAC,eAAe,CAAC,CAAC;IAE7C,MAAM,MAAM,GAAG,KAAK,EAAE,CAAC;IAEvB,OAAO,CACL,oBAAC,QAAQ,oBACH,IAAI,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACX,SAAS,EACT,mBAAmB,EACnB,sBAAsB,MAAA,MAAA,IAAI,CAAC,IAAI,mCAAI,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,IAAI,mCAAI,QAAQ,EAAE,CAChE;QAED,oBAAC,iBAAiB,CAAC,QAAQ,IACzB,KAAK,EAAE;gBACL,IAAI,EAAE,IAAI,aAAJ,IAAI,cAAJ,IAAI,GAAI,kBAAkB,MAAM,EAAE;gBACxC,YAAY;gBACZ,KAAK;gBACL,QAAQ;gBACR,QAAQ;aACT;YAED,6BAAK,SAAS,EAAC,qBAAqB,IAAE,QAAQ,CAAO,CAC1B,CACpB,CACZ,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,UAAU,CAAC"}
|
|
@@ -12,12 +12,13 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
12
12
|
import { useContext } from "react";
|
|
13
13
|
import { useFormField } from "../useFormField";
|
|
14
14
|
import { RadioGroupContext } from "./RadioGroup";
|
|
15
|
+
import { omit } from "../..";
|
|
15
16
|
/**
|
|
16
17
|
* Handles props for Radios in context with Fieldset and RadioGroup
|
|
17
18
|
*/
|
|
18
19
|
export const useRadio = (props) => {
|
|
19
20
|
const radioGroup = useContext(RadioGroupContext);
|
|
20
|
-
const _a = useFormField(props, "radio"), { inputProps } = _a, rest = __rest(_a, ["inputProps"]);
|
|
21
|
+
const _a = useFormField(omit(props, ["description"]), "radio"), { inputProps } = _a, rest = __rest(_a, ["inputProps"]);
|
|
21
22
|
if (!radioGroup) {
|
|
22
23
|
console.warn("<Radio> must be used inside <RadioGroup>.");
|
|
23
24
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useRadio.js","sourceRoot":"","sources":["../../../src/form/radio/useRadio.ts"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACnC,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAE/C,OAAO,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"useRadio.js","sourceRoot":"","sources":["../../../src/form/radio/useRadio.ts"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACnC,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAE/C,OAAO,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AACjD,OAAO,EAAE,IAAI,EAAE,MAAM,OAAO,CAAC;AAE7B;;GAEG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,KAAiB,EAAE,EAAE;IAC5C,MAAM,UAAU,GAAG,UAAU,CAAC,iBAAiB,CAAC,CAAC;IAEjD,MAAM,KAA0B,YAAY,CAC1C,IAAI,CAAC,KAAK,EAAE,CAAC,aAAa,CAAC,CAAC,EAC5B,OAAO,CACR,EAHK,EAAE,UAAU,OAGjB,EAHsB,IAAI,cAArB,cAAuB,CAG5B,CAAC;IAEF,IAAI,CAAC,UAAU,EAAE;QACf,OAAO,CAAC,IAAI,CAAC,2CAA2C,CAAC,CAAC;KAC3D;IAED,IAAI,CAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,QAAQ,MAAK,SAAS,EAAE;QACjC,OAAO,CAAC,IAAI,CAAC,6CAA6C,CAAC,CAAC;KAC7D;IAED,uCACK,IAAI,KACP,UAAU,kCACL,UAAU,KACb,IAAI,EAAE,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,IAAI,EACtB,cAAc,EACZ,CAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,YAAY,MAAK,SAAS;gBACpC,CAAC,CAAC,SAAS;gBACX,CAAC,CAAC,CAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,YAAY,MAAK,KAAK,CAAC,KAAK,EAC9C,OAAO,EACL,CAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,KAAK,MAAK,SAAS;gBAC7B,CAAC,CAAC,SAAS;gBACX,CAAC,CAAC,CAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,KAAK,MAAK,KAAK,CAAC,KAAK,EACvC,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE;gBACd,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;gBACpC,CAAA,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,QAAQ,KAAI,UAAU,CAAC,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;YAC3D,CAAC,EACD,QAAQ,EAAE,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,QAAQ,EAC9B,IAAI,EAAE,OAAO,OAEf;AACJ,CAAC,CAAC"}
|