@navikt/ds-react 0.19.5 → 0.19.8
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/_docs.json +24 -5
- package/cjs/form/ConfirmationPanel.js +1 -2
- package/cjs/form/Fieldset/Fieldset.js +1 -2
- package/cjs/form/Select.js +1 -2
- package/cjs/form/TextField.js +1 -2
- package/cjs/form/Textarea.js +1 -2
- package/cjs/typography/Detail.js +2 -1
- package/cjs/{form → typography}/ErrorMessage.js +1 -4
- package/cjs/typography/index.js +3 -1
- package/esm/form/ConfirmationPanel.js +1 -2
- package/esm/form/ConfirmationPanel.js.map +1 -1
- package/esm/form/Fieldset/Fieldset.js +1 -2
- package/esm/form/Fieldset/Fieldset.js.map +1 -1
- package/esm/form/Select.js +1 -2
- package/esm/form/Select.js.map +1 -1
- package/esm/form/TextField.js +1 -2
- package/esm/form/TextField.js.map +1 -1
- package/esm/form/Textarea.js +1 -2
- package/esm/form/Textarea.js.map +1 -1
- package/esm/typography/Detail.d.ts +4 -0
- package/esm/typography/Detail.js +2 -1
- package/esm/typography/Detail.js.map +1 -1
- package/esm/typography/ErrorMessage.d.ts +14 -0
- package/esm/typography/ErrorMessage.js +6 -0
- package/esm/typography/ErrorMessage.js.map +1 -0
- package/esm/typography/index.d.ts +1 -0
- package/esm/typography/index.js +1 -0
- package/esm/typography/index.js.map +1 -1
- package/package.json +4 -4
- package/src/button/button.stories.tsx +22 -19
- package/src/form/ConfirmationPanel.tsx +1 -2
- package/src/form/Fieldset/Fieldset.tsx +1 -2
- package/src/form/Select.tsx +1 -2
- package/src/form/TextField.tsx +1 -2
- package/src/form/Textarea.tsx +1 -2
- package/src/typography/Detail.tsx +28 -18
- package/src/typography/ErrorMessage.tsx +26 -0
- package/src/typography/index.ts +1 -0
- package/src/typography/typography.stories.tsx +19 -4
- package/esm/form/ErrorMessage.d.ts +0 -3
- package/esm/form/ErrorMessage.js +0 -9
- package/esm/form/ErrorMessage.js.map +0 -1
- package/src/form/ErrorMessage.tsx +0 -17
package/_docs.json
CHANGED
|
@@ -880,11 +880,6 @@
|
|
|
880
880
|
}
|
|
881
881
|
}
|
|
882
882
|
},
|
|
883
|
-
{
|
|
884
|
-
"filePath": "src/form/ErrorMessage.tsx",
|
|
885
|
-
"displayName": "ErrorMessage",
|
|
886
|
-
"props": {}
|
|
887
|
-
},
|
|
888
883
|
{
|
|
889
884
|
"filePath": "src/form/Select.tsx",
|
|
890
885
|
"displayName": "Select",
|
|
@@ -7061,6 +7056,25 @@
|
|
|
7061
7056
|
"name": "boolean"
|
|
7062
7057
|
}
|
|
7063
7058
|
},
|
|
7059
|
+
"uppercase": {
|
|
7060
|
+
"defaultValue": null,
|
|
7061
|
+
"description": "All caps",
|
|
7062
|
+
"name": "uppercase",
|
|
7063
|
+
"parent": {
|
|
7064
|
+
"fileName": "src/typography/Detail.tsx",
|
|
7065
|
+
"name": "DetailProps"
|
|
7066
|
+
},
|
|
7067
|
+
"declarations": [
|
|
7068
|
+
{
|
|
7069
|
+
"fileName": "src/typography/Detail.tsx",
|
|
7070
|
+
"name": "DetailProps"
|
|
7071
|
+
}
|
|
7072
|
+
],
|
|
7073
|
+
"required": false,
|
|
7074
|
+
"type": {
|
|
7075
|
+
"name": "boolean"
|
|
7076
|
+
}
|
|
7077
|
+
},
|
|
7064
7078
|
"className": {
|
|
7065
7079
|
"defaultValue": null,
|
|
7066
7080
|
"description": "",
|
|
@@ -7101,6 +7115,11 @@
|
|
|
7101
7115
|
}
|
|
7102
7116
|
}
|
|
7103
7117
|
},
|
|
7118
|
+
{
|
|
7119
|
+
"filePath": "src/typography/ErrorMessage.tsx",
|
|
7120
|
+
"displayName": "ErrorMessage",
|
|
7121
|
+
"props": {}
|
|
7122
|
+
},
|
|
7104
7123
|
{
|
|
7105
7124
|
"filePath": "src/typography/Heading.tsx",
|
|
7106
7125
|
"displayName": "Heading",
|
|
@@ -41,7 +41,6 @@ exports.ConfirmationPanel = void 0;
|
|
|
41
41
|
const react_1 = __importStar(require("react"));
|
|
42
42
|
const classnames_1 = __importDefault(require("classnames"));
|
|
43
43
|
const __1 = require("..");
|
|
44
|
-
const ErrorMessage_1 = __importDefault(require("./ErrorMessage"));
|
|
45
44
|
const useFormField_1 = require("./useFormField");
|
|
46
45
|
exports.ConfirmationPanel = (0, react_1.forwardRef)((_a, ref) => {
|
|
47
46
|
var { className, children, label } = _a, props = __rest(_a, ["className", "children", "label"]);
|
|
@@ -54,6 +53,6 @@ exports.ConfirmationPanel = (0, react_1.forwardRef)((_a, ref) => {
|
|
|
54
53
|
react_1.default.createElement("div", { className: "navds-confirmation-panel__inner" },
|
|
55
54
|
children && (react_1.default.createElement(__1.BodyLong, { size: props.size, className: "navds-confirmation-panel__content" }, children)),
|
|
56
55
|
react_1.default.createElement(__1.Checkbox, Object.assign({}, props, inputProps, { error: hasError, size: size }), label)),
|
|
57
|
-
react_1.default.createElement("div", { id: errorId, "aria-relevant": "additions removals", "aria-live": "polite" }, showErrorMsg && react_1.default.createElement(
|
|
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))));
|
|
58
57
|
});
|
|
59
58
|
exports.default = exports.ConfirmationPanel;
|
|
@@ -41,7 +41,6 @@ exports.Fieldset = exports.FieldsetContext = void 0;
|
|
|
41
41
|
const classnames_1 = __importDefault(require("classnames"));
|
|
42
42
|
const react_1 = __importStar(require("react"));
|
|
43
43
|
const __1 = require("../..");
|
|
44
|
-
const ErrorMessage_1 = __importDefault(require("../ErrorMessage"));
|
|
45
44
|
const useFieldset_1 = require("./useFieldset");
|
|
46
45
|
exports.FieldsetContext = react_1.default.createContext(null);
|
|
47
46
|
exports.Fieldset = (0, react_1.forwardRef)((props, ref) => {
|
|
@@ -69,6 +68,6 @@ exports.Fieldset = (0, react_1.forwardRef)((props, ref) => {
|
|
|
69
68
|
"navds-sr-only": !!hideLegend,
|
|
70
69
|
}), id: inputDescriptionId, size: "small", as: "div" }, props.description))),
|
|
71
70
|
children,
|
|
72
|
-
react_1.default.createElement("div", { id: errorId, "aria-relevant": "additions removals", "aria-live": "polite", className: "navds-fieldset__error" }, showErrorMsg && (react_1.default.createElement(
|
|
71
|
+
react_1.default.createElement("div", { id: errorId, "aria-relevant": "additions removals", "aria-live": "polite", className: "navds-fieldset__error" }, showErrorMsg && (react_1.default.createElement(__1.ErrorMessage, { size: size }, props.error))))));
|
|
73
72
|
});
|
|
74
73
|
exports.default = exports.Fieldset;
|
package/cjs/form/Select.js
CHANGED
|
@@ -42,7 +42,6 @@ const react_1 = __importStar(require("react"));
|
|
|
42
42
|
const classnames_1 = __importDefault(require("classnames"));
|
|
43
43
|
const ds_icons_1 = require("@navikt/ds-icons");
|
|
44
44
|
const __1 = require("..");
|
|
45
|
-
const ErrorMessage_1 = __importDefault(require("./ErrorMessage"));
|
|
46
45
|
const useFormField_1 = require("./useFormField");
|
|
47
46
|
exports.Select = (0, react_1.forwardRef)((props, ref) => {
|
|
48
47
|
const { inputProps, errorId, showErrorMsg, hasError, size, inputDescriptionId, } = (0, useFormField_1.useFormField)(props, "textField");
|
|
@@ -60,6 +59,6 @@ exports.Select = (0, react_1.forwardRef)((props, ref) => {
|
|
|
60
59
|
react_1.default.createElement("div", { className: "navds-select__container" },
|
|
61
60
|
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),
|
|
62
61
|
react_1.default.createElement(ds_icons_1.Expand, { className: "navds-select__chevron", "aria-hidden": true })),
|
|
63
|
-
react_1.default.createElement("div", { id: errorId, "aria-relevant": "additions removals", "aria-live": "polite" }, showErrorMsg && (react_1.default.createElement(
|
|
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
63
|
});
|
|
65
64
|
exports.default = exports.Select;
|
package/cjs/form/TextField.js
CHANGED
|
@@ -41,7 +41,6 @@ exports.TextField = void 0;
|
|
|
41
41
|
const react_1 = __importStar(require("react"));
|
|
42
42
|
const classnames_1 = __importDefault(require("classnames"));
|
|
43
43
|
const __1 = require("..");
|
|
44
|
-
const ErrorMessage_1 = __importDefault(require("./ErrorMessage"));
|
|
45
44
|
const useFormField_1 = require("./useFormField");
|
|
46
45
|
exports.TextField = (0, react_1.forwardRef)((props, ref) => {
|
|
47
46
|
const { inputProps, errorId, showErrorMsg, hasError, size, inputDescriptionId, } = (0, useFormField_1.useFormField)(props, "textField");
|
|
@@ -59,6 +58,6 @@ exports.TextField = (0, react_1.forwardRef)((props, ref) => {
|
|
|
59
58
|
"navds-sr-only": hideLabel,
|
|
60
59
|
}), id: inputDescriptionId, size: "small", as: "div" }, description)))),
|
|
61
60
|
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 })),
|
|
62
|
-
react_1.default.createElement("div", { id: errorId, "aria-relevant": "additions removals", "aria-live": "polite" }, showErrorMsg && (react_1.default.createElement(
|
|
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)))));
|
|
63
62
|
});
|
|
64
63
|
exports.default = exports.TextField;
|
package/cjs/form/Textarea.js
CHANGED
|
@@ -42,7 +42,6 @@ const react_1 = __importStar(require("react"));
|
|
|
42
42
|
const classnames_1 = __importDefault(require("classnames"));
|
|
43
43
|
const TextareaAutosize_1 = __importDefault(require("@material-ui/core/TextareaAutosize"));
|
|
44
44
|
const __1 = require("..");
|
|
45
|
-
const ErrorMessage_1 = __importDefault(require("./ErrorMessage"));
|
|
46
45
|
const useFormField_1 = require("./useFormField");
|
|
47
46
|
const __2 = require("..");
|
|
48
47
|
exports.Textarea = (0, react_1.forwardRef)((props, ref) => {
|
|
@@ -79,7 +78,7 @@ exports.Textarea = (0, react_1.forwardRef)((props, ref) => {
|
|
|
79
78
|
maxLength,
|
|
80
79
|
" signs."),
|
|
81
80
|
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 })))),
|
|
82
|
-
react_1.default.createElement("div", { id: errorId, "aria-relevant": "additions removals", "aria-live": "polite" }, showErrorMsg && (react_1.default.createElement(
|
|
81
|
+
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)))));
|
|
83
82
|
});
|
|
84
83
|
const Counter = ({ maxLength, currentLength, size }) => {
|
|
85
84
|
const difference = maxLength - currentLength;
|
package/cjs/typography/Detail.js
CHANGED
|
@@ -41,10 +41,11 @@ exports.Detail = void 0;
|
|
|
41
41
|
const react_1 = __importStar(require("react"));
|
|
42
42
|
const classnames_1 = __importDefault(require("classnames"));
|
|
43
43
|
exports.Detail = (0, react_1.forwardRef)((_a, ref) => {
|
|
44
|
-
var { className, size = "medium", spacing, as: Component = "p" } = _a, rest = __rest(_a, ["className", "size", "spacing", "as"]);
|
|
44
|
+
var { className, size = "medium", spacing, uppercase, as: Component = "p" } = _a, rest = __rest(_a, ["className", "size", "spacing", "uppercase", "as"]);
|
|
45
45
|
return (react_1.default.createElement(Component, Object.assign({}, rest, { ref: ref, className: (0, classnames_1.default)(className, "navds-detail", {
|
|
46
46
|
"navds-detail--small": size === "small",
|
|
47
47
|
"navds-typo--spacing": !!spacing,
|
|
48
|
+
"navds-typo--uppercase": !!uppercase,
|
|
48
49
|
}) })));
|
|
49
50
|
});
|
|
50
51
|
exports.default = exports.Detail;
|
|
@@ -6,8 +6,5 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
6
6
|
const react_1 = __importDefault(require("react"));
|
|
7
7
|
const classnames_1 = __importDefault(require("classnames"));
|
|
8
8
|
const __1 = require("..");
|
|
9
|
-
const ErrorMessage = (props) => {
|
|
10
|
-
var _a;
|
|
11
|
-
return (react_1.default.createElement(__1.Label, Object.assign({}, props, { as: "div", className: (0, classnames_1.default)("navds-error-message", props.className, `navds-error-message--${(_a = props.size) !== null && _a !== void 0 ? _a : "medium"}`) })));
|
|
12
|
-
};
|
|
9
|
+
const ErrorMessage = (props) => (react_1.default.createElement(__1.Label, Object.assign({}, props, { as: "div", className: (0, classnames_1.default)("navds-error-message", props.className) })));
|
|
13
10
|
exports.default = ErrorMessage;
|
package/cjs/typography/index.js
CHANGED
|
@@ -3,13 +3,15 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
|
3
3
|
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
4
|
};
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.Label = exports.Ingress = exports.Heading = exports.Detail = exports.BodyShort = exports.BodyLong = void 0;
|
|
6
|
+
exports.Label = exports.Ingress = exports.Heading = exports.ErrorMessage = exports.Detail = exports.BodyShort = exports.BodyLong = void 0;
|
|
7
7
|
var BodyLong_1 = require("./BodyLong");
|
|
8
8
|
Object.defineProperty(exports, "BodyLong", { enumerable: true, get: function () { return __importDefault(BodyLong_1).default; } });
|
|
9
9
|
var BodyShort_1 = require("./BodyShort");
|
|
10
10
|
Object.defineProperty(exports, "BodyShort", { enumerable: true, get: function () { return __importDefault(BodyShort_1).default; } });
|
|
11
11
|
var Detail_1 = require("./Detail");
|
|
12
12
|
Object.defineProperty(exports, "Detail", { enumerable: true, get: function () { return __importDefault(Detail_1).default; } });
|
|
13
|
+
var ErrorMessage_1 = require("./ErrorMessage");
|
|
14
|
+
Object.defineProperty(exports, "ErrorMessage", { enumerable: true, get: function () { return __importDefault(ErrorMessage_1).default; } });
|
|
13
15
|
var Heading_1 = require("./Heading");
|
|
14
16
|
Object.defineProperty(exports, "Heading", { enumerable: true, get: function () { return __importDefault(Heading_1).default; } });
|
|
15
17
|
var Ingress_1 = require("./Ingress");
|
|
@@ -11,8 +11,7 @@ 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 { BodyLong, Checkbox } from "..";
|
|
15
|
-
import ErrorMessage from "./ErrorMessage";
|
|
14
|
+
import { BodyLong, Checkbox, ErrorMessage } from "..";
|
|
16
15
|
import { useFormField } from "./useFormField";
|
|
17
16
|
export const ConfirmationPanel = forwardRef((_a, ref) => {
|
|
18
17
|
var { className, children, label } = _a, props = __rest(_a, ["className", "children", "label"]);
|
|
@@ -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,
|
|
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,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,iBAAiB,CAAC"}
|
|
@@ -11,8 +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, Detail, Label, omit } from "../..";
|
|
15
|
-
import ErrorMessage from "../ErrorMessage";
|
|
14
|
+
import { BodyShort, Detail, Label, ErrorMessage, omit } from "../..";
|
|
16
15
|
import { useFieldset } from "./useFieldset";
|
|
17
16
|
export const FieldsetContext = React.createContext(null);
|
|
18
17
|
export const Fieldset = forwardRef((props, ref) => {
|
|
@@ -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,MAAM,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,OAAO,CAAC;
|
|
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,MAAM,EAAE,KAAK,EAAE,YAAY,EAAE,IAAI,EAAE,MAAM,OAAO,CAAC;AAErE,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAqB5C,MAAM,CAAC,MAAM,eAAe,GAAG,KAAK,CAAC,aAAa,CAChD,IAAI,CACL,CAAC;AAwBF,MAAM,CAAC,MAAM,QAAQ,GAAG,UAAU,CAChC,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;;IACb,MAAM,EACJ,UAAU,EACV,OAAO,EACP,YAAY,EACZ,QAAQ,EACR,IAAI,EACJ,kBAAkB,GACnB,GAAG,WAAW,CAAC,KAAK,CAAC,CAAC;IAEvB,MAAM,QAAQ,GAAG,UAAU,CAAC,eAAe,CAAC,CAAC;IAE7C,MAAM,EACJ,QAAQ,EACR,SAAS,EACT,gBAAgB,GAAG,IAAI,EACvB,MAAM,EACN,WAAW,EACX,UAAU,KAER,KAAK,EADJ,IAAI,UACL,KAAK,EARH,oFAQL,CAAQ,CAAC;IAEV,OAAO,CACL,oBAAC,eAAe,CAAC,QAAQ,IACvB,KAAK,EAAE;YACL,KAAK,EAAE,gBAAgB,CAAC,CAAC,CAAC,MAAA,KAAK,CAAC,KAAK,mCAAI,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,KAAK,CAAC,CAAC,CAAC,SAAS;YACpE,OAAO,EAAE,EAAE,CAAC;gBACV,CAAC,OAAO,CAAC,EAAE,YAAY;gBACvB,CAAC,MAAA,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,OAAO,mCAAI,EAAE,CAAC,EAAE,CAAC,CAAC,CAAA,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,KAAK,CAAA;aAC7C,CAAC;YACF,IAAI;YACJ,QAAQ,EAAE,MAAA,KAAK,CAAC,QAAQ,mCAAI,KAAK;SAClC;QAED,kDACM,IAAI,CAAC,IAAI,EAAE,CAAC,SAAS,EAAE,OAAO,EAAE,MAAM,CAAC,CAAC,EACxC,UAAU,IACd,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACX,SAAS,EACT,gBAAgB,EAChB,mBAAmB,IAAI,EAAE,EACzB,EAAE,uBAAuB,EAAE,QAAQ,EAAE,CACtC;YAED,oBAAC,KAAK,IACJ,IAAI,EAAE,IAAI,EACV,EAAE,EAAC,QAAQ,EACX,SAAS,EAAE,EAAE,CAAC,wBAAwB,EAAE;oBACtC,eAAe,EAAE,CAAC,CAAC,UAAU;iBAC9B,CAAC,IAED,MAAM,CACD;YACP,CAAC,CAAC,WAAW;gBACZ,CAAC,IAAI,KAAK,QAAQ,CAAC,CAAC,CAAC,CACnB,oBAAC,SAAS,IACR,SAAS,EAAE,EAAE,CAAC,6BAA6B,EAAE;wBAC3C,eAAe,EAAE,CAAC,CAAC,UAAU;qBAC9B,CAAC,EACF,EAAE,EAAE,kBAAkB,EACtB,IAAI,EAAC,OAAO,EACZ,EAAE,EAAC,KAAK,IAEP,KAAK,CAAC,WAAW,CACR,CACb,CAAC,CAAC,CAAC,CACF,oBAAC,MAAM,IACL,SAAS,EAAE,EAAE,CAAC,6BAA6B,EAAE;wBAC3C,eAAe,EAAE,CAAC,CAAC,UAAU;qBAC9B,CAAC,EACF,EAAE,EAAE,kBAAkB,EACtB,IAAI,EAAC,OAAO,EACZ,EAAE,EAAC,KAAK,IAEP,KAAK,CAAC,WAAW,CACX,CACV,CAAC;YACH,QAAQ;YACT,6BACE,EAAE,EAAE,OAAO,mBACG,oBAAoB,eACxB,QAAQ,EAClB,SAAS,EAAC,uBAAuB,IAEhC,YAAY,IAAI,CACf,oBAAC,YAAY,IAAC,IAAI,EAAE,IAAI,IAAG,KAAK,CAAC,KAAK,CAAgB,CACvD,CACG,CACG,CACc,CAC5B,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,QAAQ,CAAC"}
|
package/esm/form/Select.js
CHANGED
|
@@ -12,8 +12,7 @@ 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, omit } from "..";
|
|
16
|
-
import ErrorMessage from "./ErrorMessage";
|
|
15
|
+
import { BodyShort, Label, ErrorMessage, omit } from "..";
|
|
17
16
|
import { useFormField } from "./useFormField";
|
|
18
17
|
export const Select = forwardRef((props, ref) => {
|
|
19
18
|
const { inputProps, errorId, showErrorMsg, hasError, size, inputDescriptionId, } = useFormField(props, "textField");
|
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,
|
|
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;AAC1D,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,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,eAAe,EAAE,SAAS;aAC3B,CAAC,IAED,KAAK,CACA;QACP,CAAC,CAAC,WAAW,IAAI,CAChB,oBAAC,SAAS,IACR,EAAE,EAAC,KAAK,EACR,SAAS,EAAE,EAAE,CAAC,2BAA2B,EAAE;gBACzC,eAAe,EAAE,SAAS;aAC3B,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,wBAAe,CACpD;QACN,6BAAK,EAAE,EAAE,OAAO,mBAAgB,oBAAoB,eAAW,QAAQ,IACpE,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
|
@@ -11,8 +11,7 @@ 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, Detail, Label, omit } from "..";
|
|
15
|
-
import ErrorMessage from "./ErrorMessage";
|
|
14
|
+
import { BodyShort, Detail, Label, ErrorMessage, omit } from "..";
|
|
16
15
|
import { useFormField } from "./useFormField";
|
|
17
16
|
export const TextField = forwardRef((props, ref) => {
|
|
18
17
|
const { inputProps, errorId, showErrorMsg, hasError, size, inputDescriptionId, } = useFormField(props, "textField");
|
|
@@ -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,
|
|
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,6BAAK,EAAE,EAAE,OAAO,mBAAgB,oBAAoB,eAAW,QAAQ,IACpE,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,8 +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, omit } from "..";
|
|
16
|
-
import ErrorMessage from "./ErrorMessage";
|
|
15
|
+
import { BodyShort, Label, ErrorMessage, omit } from "..";
|
|
17
16
|
import { useFormField } from "./useFormField";
|
|
18
17
|
import { useId } from "..";
|
|
19
18
|
export const Textarea = forwardRef((props, ref) => {
|
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,
|
|
1
|
+
{"version":3,"file":"Textarea.js","sourceRoot":"","sources":["../../src/form/Textarea.tsx"],"names":[],"mappings":"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"}
|
|
@@ -14,6 +14,10 @@ export interface DetailProps extends React.HTMLAttributes<HTMLParagraphElement>
|
|
|
14
14
|
* Adds margin-bottom
|
|
15
15
|
*/
|
|
16
16
|
spacing?: boolean;
|
|
17
|
+
/**
|
|
18
|
+
* All caps
|
|
19
|
+
*/
|
|
20
|
+
uppercase?: boolean;
|
|
17
21
|
}
|
|
18
22
|
export declare const Detail: OverridableComponent<DetailProps, HTMLParagraphElement>;
|
|
19
23
|
export default Detail;
|
package/esm/typography/Detail.js
CHANGED
|
@@ -12,10 +12,11 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
12
12
|
import React, { forwardRef } from "react";
|
|
13
13
|
import cl from "classnames";
|
|
14
14
|
export const Detail = forwardRef((_a, ref) => {
|
|
15
|
-
var { className, size = "medium", spacing, as: Component = "p" } = _a, rest = __rest(_a, ["className", "size", "spacing", "as"]);
|
|
15
|
+
var { className, size = "medium", spacing, uppercase, as: Component = "p" } = _a, rest = __rest(_a, ["className", "size", "spacing", "uppercase", "as"]);
|
|
16
16
|
return (React.createElement(Component, Object.assign({}, rest, { ref: ref, className: cl(className, "navds-detail", {
|
|
17
17
|
"navds-detail--small": size === "small",
|
|
18
18
|
"navds-typo--spacing": !!spacing,
|
|
19
|
+
"navds-typo--uppercase": !!uppercase,
|
|
19
20
|
}) })));
|
|
20
21
|
});
|
|
21
22
|
export default Detail;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Detail.js","sourceRoot":"","sources":["../../src/typography/Detail.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,MAAM,YAAY,CAAC;
|
|
1
|
+
{"version":3,"file":"Detail.js","sourceRoot":"","sources":["../../src/typography/Detail.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,MAAM,YAAY,CAAC;AAwB5B,MAAM,CAAC,MAAM,MAAM,GACjB,UAAU,CACR,CACE,EAOC,EACD,GAAG,EACH,EAAE;QATF,EACE,SAAS,EACT,IAAI,GAAG,QAAQ,EACf,OAAO,EACP,SAAS,EACT,EAAE,EAAE,SAAS,GAAG,GAAG,OAEpB,EADI,IAAI,cANT,mDAOC,CADQ;IAGN,OAAA,CACH,oBAAC,SAAS,oBACJ,IAAI,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,SAAS,EAAE,cAAc,EAAE;YACvC,qBAAqB,EAAE,IAAI,KAAK,OAAO;YACvC,qBAAqB,EAAE,CAAC,CAAC,OAAO;YAChC,uBAAuB,EAAE,CAAC,CAAC,SAAS;SACrC,CAAC,IACF,CACH,CAAA;CAAA,CACF,CAAC;AAEJ,eAAe,MAAM,CAAC"}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
export interface ErrorMessageProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
3
|
+
/**
|
|
4
|
+
* medium: 18px, small: 16px
|
|
5
|
+
* @default "medium"
|
|
6
|
+
*/
|
|
7
|
+
size?: "medium" | "small";
|
|
8
|
+
/**
|
|
9
|
+
* Error text
|
|
10
|
+
*/
|
|
11
|
+
children: React.ReactNode;
|
|
12
|
+
}
|
|
13
|
+
declare const ErrorMessage: (props: any) => JSX.Element;
|
|
14
|
+
export default ErrorMessage;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import cl from "classnames";
|
|
3
|
+
import { Label } from "..";
|
|
4
|
+
const ErrorMessage = (props) => (React.createElement(Label, Object.assign({}, props, { as: "div", className: cl("navds-error-message", props.className) })));
|
|
5
|
+
export default ErrorMessage;
|
|
6
|
+
//# sourceMappingURL=ErrorMessage.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ErrorMessage.js","sourceRoot":"","sources":["../../src/typography/ErrorMessage.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,EAAE,KAAK,EAAE,MAAM,IAAI,CAAC;AAe3B,MAAM,YAAY,GAAG,CAAC,KAAK,EAAE,EAAE,CAAC,CAC9B,oBAAC,KAAK,oBACA,KAAK,IACT,EAAE,EAAC,KAAK,EACR,SAAS,EAAE,EAAE,CAAC,qBAAqB,EAAE,KAAK,CAAC,SAAS,CAAC,IACrD,CACH,CAAC;AAEF,eAAe,YAAY,CAAC"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
export { BodyLongProps, default as BodyLong } from "./BodyLong";
|
|
2
2
|
export { BodyShortProps, default as BodyShort } from "./BodyShort";
|
|
3
3
|
export { default as Detail, DetailProps } from "./Detail";
|
|
4
|
+
export { default as ErrorMessage, ErrorMessageProps } from "./ErrorMessage";
|
|
4
5
|
export { default as Heading, HeadingProps } from "./Heading";
|
|
5
6
|
export { default as Ingress, IngressProps } from "./Ingress";
|
|
6
7
|
export { default as Label, LabelProps } from "./Label";
|
package/esm/typography/index.js
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
export { default as BodyLong } from "./BodyLong";
|
|
2
2
|
export { default as BodyShort } from "./BodyShort";
|
|
3
3
|
export { default as Detail } from "./Detail";
|
|
4
|
+
export { default as ErrorMessage } from "./ErrorMessage";
|
|
4
5
|
export { default as Heading } from "./Heading";
|
|
5
6
|
export { default as Ingress } from "./Ingress";
|
|
6
7
|
export { default as Label } from "./Label";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/typography/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AAChE,OAAO,EAAkB,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC;AACnE,OAAO,EAAE,OAAO,IAAI,MAAM,EAAe,MAAM,UAAU,CAAC;AAC1D,OAAO,EAAE,OAAO,IAAI,OAAO,EAAgB,MAAM,WAAW,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,OAAO,EAAgB,MAAM,WAAW,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,KAAK,EAAc,MAAM,SAAS,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/typography/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AAChE,OAAO,EAAkB,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC;AACnE,OAAO,EAAE,OAAO,IAAI,MAAM,EAAe,MAAM,UAAU,CAAC;AAC1D,OAAO,EAAE,OAAO,IAAI,YAAY,EAAqB,MAAM,gBAAgB,CAAC;AAC5E,OAAO,EAAE,OAAO,IAAI,OAAO,EAAgB,MAAM,WAAW,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,OAAO,EAAgB,MAAM,WAAW,CAAC;AAC7D,OAAO,EAAE,OAAO,IAAI,KAAK,EAAc,MAAM,SAAS,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@navikt/ds-react",
|
|
3
|
-
"version": "0.19.
|
|
3
|
+
"version": "0.19.8",
|
|
4
4
|
"description": "NAV designsystem react components",
|
|
5
5
|
"author": "NAV Designsystem team",
|
|
6
6
|
"license": "MIT",
|
|
@@ -11,7 +11,7 @@
|
|
|
11
11
|
],
|
|
12
12
|
"repository": {
|
|
13
13
|
"type": "git",
|
|
14
|
-
"url": "git+https://github.com/navikt/
|
|
14
|
+
"url": "git+https://github.com/navikt/Designsystemet.git"
|
|
15
15
|
},
|
|
16
16
|
"sideEffects": false,
|
|
17
17
|
"main": "./cjs/index.js",
|
|
@@ -37,7 +37,7 @@
|
|
|
37
37
|
"dependencies": {
|
|
38
38
|
"@floating-ui/react-dom": "0.6.0",
|
|
39
39
|
"@material-ui/core": "^4.12.3",
|
|
40
|
-
"@navikt/ds-icons": "^0.8.
|
|
40
|
+
"@navikt/ds-icons": "^0.8.17",
|
|
41
41
|
"@popperjs/core": "^2.10.1",
|
|
42
42
|
"@radix-ui/react-tabs": "0.1.5",
|
|
43
43
|
"@radix-ui/react-toggle-group": "0.1.5",
|
|
@@ -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": "adfdfceef32a159b51ee7499449468f5044b0961"
|
|
80
80
|
}
|
|
@@ -74,6 +74,16 @@ export const XSmall = () => (
|
|
|
74
74
|
</div>
|
|
75
75
|
);
|
|
76
76
|
|
|
77
|
+
export const Link = () => (
|
|
78
|
+
<div className="rowgap">
|
|
79
|
+
{variants.map((variant) => (
|
|
80
|
+
<Button key={variant} variant={variant} as="a" href="#thecakeisalie">
|
|
81
|
+
{varSwitch[variant]}
|
|
82
|
+
</Button>
|
|
83
|
+
))}
|
|
84
|
+
</div>
|
|
85
|
+
);
|
|
86
|
+
|
|
77
87
|
export const Loading = () => (
|
|
78
88
|
<div className="colgap">
|
|
79
89
|
<div className="rowgap">
|
|
@@ -105,21 +115,24 @@ export const Icon = () => (
|
|
|
105
115
|
<div className="rowgap">
|
|
106
116
|
{variants.map((variant) => (
|
|
107
117
|
<Button key={variant} variant={variant}>
|
|
108
|
-
<Star />
|
|
118
|
+
<Star aria-hidden />
|
|
119
|
+
<span className="navds-sr-only">Stjerne</span>
|
|
109
120
|
</Button>
|
|
110
121
|
))}
|
|
111
122
|
</div>
|
|
112
123
|
<div className="rowgap">
|
|
113
124
|
{variants.map((variant) => (
|
|
114
125
|
<Button key={variant} variant={variant} size="small">
|
|
115
|
-
<Star />
|
|
126
|
+
<Star aria-hidden />
|
|
127
|
+
<span className="navds-sr-only">Stjerne</span>
|
|
116
128
|
</Button>
|
|
117
129
|
))}
|
|
118
130
|
</div>
|
|
119
131
|
<div className="rowgap">
|
|
120
132
|
{variants.map((variant) => (
|
|
121
133
|
<Button key={variant} variant={variant} size="xsmall">
|
|
122
|
-
<Star />
|
|
134
|
+
<Star aria-hidden />
|
|
135
|
+
<span className="navds-sr-only">Stjerne</span>
|
|
123
136
|
</Button>
|
|
124
137
|
))}
|
|
125
138
|
</div>
|
|
@@ -131,39 +144,29 @@ export const IconWText = () => (
|
|
|
131
144
|
<div className="rowgap">
|
|
132
145
|
{variants.map((variant) => (
|
|
133
146
|
<Button key={variant} variant={variant}>
|
|
134
|
-
<Star />
|
|
147
|
+
<Star aria-hidden />
|
|
135
148
|
{varSwitch[variant]}
|
|
136
|
-
<Star />
|
|
149
|
+
<Star aria-hidden />
|
|
137
150
|
</Button>
|
|
138
151
|
))}
|
|
139
152
|
</div>
|
|
140
153
|
<div className="rowgap">
|
|
141
154
|
{variants.map((variant) => (
|
|
142
155
|
<Button key={variant} variant={variant} size="small">
|
|
143
|
-
<Star />
|
|
156
|
+
<Star aria-hidden />
|
|
144
157
|
{varSwitch[variant]}
|
|
145
|
-
<Star />
|
|
158
|
+
<Star aria-hidden />
|
|
146
159
|
</Button>
|
|
147
160
|
))}
|
|
148
161
|
</div>
|
|
149
162
|
<div className="rowgap">
|
|
150
163
|
{variants.map((variant) => (
|
|
151
164
|
<Button key={variant} variant={variant} size="xsmall">
|
|
152
|
-
<Star />
|
|
165
|
+
<Star aria-hidden />
|
|
153
166
|
{varSwitch[variant]}
|
|
154
|
-
<Star />
|
|
167
|
+
<Star aria-hidden />
|
|
155
168
|
</Button>
|
|
156
169
|
))}
|
|
157
170
|
</div>
|
|
158
171
|
</div>
|
|
159
172
|
);
|
|
160
|
-
|
|
161
|
-
export const Link = () => (
|
|
162
|
-
<div className="rowgap">
|
|
163
|
-
{variants.map((variant) => (
|
|
164
|
-
<Button key={variant} variant={variant} as="a" href="#thecakeisalie">
|
|
165
|
-
{varSwitch[variant]}
|
|
166
|
-
</Button>
|
|
167
|
-
))}
|
|
168
|
-
</div>
|
|
169
|
-
);
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import React, { forwardRef } from "react";
|
|
2
2
|
import cl from "classnames";
|
|
3
|
-
import { BodyLong, Checkbox, CheckboxProps } from "..";
|
|
4
|
-
import ErrorMessage from "./ErrorMessage";
|
|
3
|
+
import { BodyLong, Checkbox, CheckboxProps, ErrorMessage } from "..";
|
|
5
4
|
import { useFormField } from "./useFormField";
|
|
6
5
|
|
|
7
6
|
export interface ConfirmationPanelProps
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import cl from "classnames";
|
|
2
2
|
import React, { FieldsetHTMLAttributes, forwardRef, useContext } from "react";
|
|
3
|
-
import { BodyShort, Detail, Label, omit } from "../..";
|
|
4
|
-
import ErrorMessage from "../ErrorMessage";
|
|
3
|
+
import { BodyShort, Detail, Label, ErrorMessage, omit } from "../..";
|
|
5
4
|
import { FormFieldProps } from "../useFormField";
|
|
6
5
|
import { useFieldset } from "./useFieldset";
|
|
7
6
|
|
package/src/form/Select.tsx
CHANGED
|
@@ -1,8 +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, omit } from "..";
|
|
5
|
-
import ErrorMessage from "./ErrorMessage";
|
|
4
|
+
import { BodyShort, Label, ErrorMessage, omit } from "..";
|
|
6
5
|
import { FormFieldProps, useFormField } from "./useFormField";
|
|
7
6
|
|
|
8
7
|
export interface SelectProps
|
package/src/form/TextField.tsx
CHANGED
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import React, { forwardRef, InputHTMLAttributes } from "react";
|
|
2
2
|
import cl from "classnames";
|
|
3
|
-
import { BodyShort, Detail, Label, omit } from "..";
|
|
4
|
-
import ErrorMessage from "./ErrorMessage";
|
|
3
|
+
import { BodyShort, Detail, Label, ErrorMessage, omit } from "..";
|
|
5
4
|
import { FormFieldProps, useFormField } from "./useFormField";
|
|
6
5
|
|
|
7
6
|
export interface TextFieldProps
|
package/src/form/Textarea.tsx
CHANGED
|
@@ -1,8 +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, omit } from "..";
|
|
5
|
-
import ErrorMessage from "./ErrorMessage";
|
|
4
|
+
import { BodyShort, Label, ErrorMessage, omit } from "..";
|
|
6
5
|
import { FormFieldProps, useFormField } from "./useFormField";
|
|
7
6
|
import { useId } from "..";
|
|
8
7
|
|
|
@@ -17,25 +17,35 @@ export interface DetailProps
|
|
|
17
17
|
* Adds margin-bottom
|
|
18
18
|
*/
|
|
19
19
|
spacing?: boolean;
|
|
20
|
+
/**
|
|
21
|
+
* All caps
|
|
22
|
+
*/
|
|
23
|
+
uppercase?: boolean;
|
|
20
24
|
}
|
|
21
25
|
|
|
22
|
-
export const Detail: OverridableComponent<
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
26
|
+
export const Detail: OverridableComponent<DetailProps, HTMLParagraphElement> =
|
|
27
|
+
forwardRef(
|
|
28
|
+
(
|
|
29
|
+
{
|
|
30
|
+
className,
|
|
31
|
+
size = "medium",
|
|
32
|
+
spacing,
|
|
33
|
+
uppercase,
|
|
34
|
+
as: Component = "p",
|
|
35
|
+
...rest
|
|
36
|
+
},
|
|
37
|
+
ref
|
|
38
|
+
) => (
|
|
39
|
+
<Component
|
|
40
|
+
{...rest}
|
|
41
|
+
ref={ref}
|
|
42
|
+
className={cl(className, "navds-detail", {
|
|
43
|
+
"navds-detail--small": size === "small",
|
|
44
|
+
"navds-typo--spacing": !!spacing,
|
|
45
|
+
"navds-typo--uppercase": !!uppercase,
|
|
46
|
+
})}
|
|
47
|
+
/>
|
|
48
|
+
)
|
|
49
|
+
);
|
|
40
50
|
|
|
41
51
|
export default Detail;
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import cl from "classnames";
|
|
3
|
+
import { Label } from "..";
|
|
4
|
+
|
|
5
|
+
export interface ErrorMessageProps
|
|
6
|
+
extends React.HTMLAttributes<HTMLDivElement> {
|
|
7
|
+
/**
|
|
8
|
+
* medium: 18px, small: 16px
|
|
9
|
+
* @default "medium"
|
|
10
|
+
*/
|
|
11
|
+
size?: "medium" | "small";
|
|
12
|
+
/**
|
|
13
|
+
* Error text
|
|
14
|
+
*/
|
|
15
|
+
children: React.ReactNode;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
const ErrorMessage = (props) => (
|
|
19
|
+
<Label
|
|
20
|
+
{...props}
|
|
21
|
+
as="div"
|
|
22
|
+
className={cl("navds-error-message", props.className)}
|
|
23
|
+
/>
|
|
24
|
+
);
|
|
25
|
+
|
|
26
|
+
export default ErrorMessage;
|
package/src/typography/index.ts
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
export { BodyLongProps, default as BodyLong } from "./BodyLong";
|
|
2
2
|
export { BodyShortProps, default as BodyShort } from "./BodyShort";
|
|
3
3
|
export { default as Detail, DetailProps } from "./Detail";
|
|
4
|
+
export { default as ErrorMessage, ErrorMessageProps } from "./ErrorMessage";
|
|
4
5
|
export { default as Heading, HeadingProps } from "./Heading";
|
|
5
6
|
export { default as Ingress, IngressProps } from "./Ingress";
|
|
6
7
|
export { default as Label, LabelProps } from "./Label";
|
|
@@ -1,5 +1,13 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
-
import {
|
|
2
|
+
import {
|
|
3
|
+
Heading,
|
|
4
|
+
BodyShort,
|
|
5
|
+
BodyLong,
|
|
6
|
+
Detail,
|
|
7
|
+
Ingress,
|
|
8
|
+
Label,
|
|
9
|
+
ErrorMessage,
|
|
10
|
+
} from "..";
|
|
3
11
|
|
|
4
12
|
export default {
|
|
5
13
|
title: "ds-react/typography",
|
|
@@ -51,14 +59,21 @@ const LabelTemplate = ({ spacing, size }) => (
|
|
|
51
59
|
export const LabelStory = LabelTemplate.bind({});
|
|
52
60
|
LabelStory.args = { spacing: false, size: "medium" };
|
|
53
61
|
|
|
54
|
-
const DetailTemplate = ({ spacing, size }) => (
|
|
55
|
-
<Detail size={size} spacing={spacing}>
|
|
62
|
+
const DetailTemplate = ({ spacing, size, uppercase }) => (
|
|
63
|
+
<Detail size={size} spacing={spacing} uppercase={uppercase}>
|
|
56
64
|
{lorem()}
|
|
57
65
|
</Detail>
|
|
58
66
|
);
|
|
59
67
|
|
|
60
68
|
export const DetailStory = DetailTemplate.bind({});
|
|
61
|
-
DetailStory.args = { spacing: false, size: "medium" };
|
|
69
|
+
DetailStory.args = { spacing: false, uppercase: false, size: "medium" };
|
|
70
|
+
|
|
71
|
+
const ErrorMessageTemplate = ({ size }) => (
|
|
72
|
+
<ErrorMessage size={size}>{lorem()}</ErrorMessage>
|
|
73
|
+
);
|
|
74
|
+
|
|
75
|
+
export const ErrorMessageStory = ErrorMessageTemplate.bind({});
|
|
76
|
+
ErrorMessageStory.args = { size: "medium" };
|
|
62
77
|
|
|
63
78
|
export const SideInnholdEksempel = () => {
|
|
64
79
|
return (
|
package/esm/form/ErrorMessage.js
DELETED
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
import cl from "classnames";
|
|
3
|
-
import { Label } from "..";
|
|
4
|
-
const ErrorMessage = (props) => {
|
|
5
|
-
var _a;
|
|
6
|
-
return (React.createElement(Label, Object.assign({}, props, { as: "div", className: cl("navds-error-message", props.className, `navds-error-message--${(_a = props.size) !== null && _a !== void 0 ? _a : "medium"}`) })));
|
|
7
|
-
};
|
|
8
|
-
export default ErrorMessage;
|
|
9
|
-
//# sourceMappingURL=ErrorMessage.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ErrorMessage.js","sourceRoot":"","sources":["../../src/form/ErrorMessage.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,MAAM,YAAY,CAAC;AAC5B,OAAO,EAAE,KAAK,EAAE,MAAM,IAAI,CAAC;AAE3B,MAAM,YAAY,GAAG,CAAC,KAAK,EAAE,EAAE;;IAAC,OAAA,CAC9B,oBAAC,KAAK,oBACA,KAAK,IACT,EAAE,EAAC,KAAK,EACR,SAAS,EAAE,EAAE,CACX,qBAAqB,EACrB,KAAK,CAAC,SAAS,EACf,wBAAwB,MAAA,KAAK,CAAC,IAAI,mCAAI,QAAQ,EAAE,CACjD,IACD,CACH,CAAA;CAAA,CAAC;AAEF,eAAe,YAAY,CAAC"}
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
import cl from "classnames";
|
|
3
|
-
import { Label } from "..";
|
|
4
|
-
|
|
5
|
-
const ErrorMessage = (props) => (
|
|
6
|
-
<Label
|
|
7
|
-
{...props}
|
|
8
|
-
as="div"
|
|
9
|
-
className={cl(
|
|
10
|
-
"navds-error-message",
|
|
11
|
-
props.className,
|
|
12
|
-
`navds-error-message--${props.size ?? "medium"}`
|
|
13
|
-
)}
|
|
14
|
-
/>
|
|
15
|
-
);
|
|
16
|
-
|
|
17
|
-
export default ErrorMessage;
|