@navikt/ds-react 5.10.2 → 5.10.4

package/_docs.json

@@ -3418,7 +3418,7 @@
       },
       "maxRows": {
         "defaultValue": null,
-        "description": "Maximum number of character rows to display.\n@bug Internal scrolling with `maxLength` scrolls over maxLength-text",
+        "description": "Maximum number of character rows to display.",
         "name": "maxRows",
         "parent": {
           "fileName": "src/form/Textarea.tsx",
@@ -3704,43 +3704,83 @@
     }
   },
   {
-    "filePath": "src/form/Textarea.tsx",
-    "displayName": "Counter",
+    "filePath": "src/form/TextareaCounter.tsx",
+    "displayName": "TextareaCounter",
     "props": {
       "maxLength": {
         "defaultValue": null,
         "description": "",
         "name": "maxLength",
+        "parent": {
+          "fileName": "src/form/TextareaCounter.tsx",
+          "name": "Props"
+        },
+        "declarations": [
+          {
+            "fileName": "src/form/TextareaCounter.tsx",
+            "name": "Props"
+          }
+        ],
         "required": true,
         "type": {
-          "name": "any"
+          "name": "number"
         }
       },
       "currentLength": {
         "defaultValue": null,
         "description": "",
         "name": "currentLength",
+        "parent": {
+          "fileName": "src/form/TextareaCounter.tsx",
+          "name": "Props"
+        },
+        "declarations": [
+          {
+            "fileName": "src/form/TextareaCounter.tsx",
+            "name": "Props"
+          }
+        ],
         "required": true,
         "type": {
-          "name": "any"
+          "name": "number"
         }
       },
       "size": {
         "defaultValue": null,
         "description": "",
         "name": "size",
+        "parent": {
+          "fileName": "src/form/TextareaCounter.tsx",
+          "name": "Props"
+        },
+        "declarations": [
+          {
+            "fileName": "src/form/TextareaCounter.tsx",
+            "name": "Props"
+          }
+        ],
         "required": true,
         "type": {
-          "name": "any"
+          "name": "\"medium\" | \"small\" | undefined"
         }
       },
       "i18n": {
         "defaultValue": null,
         "description": "",
         "name": "i18n",
+        "parent": {
+          "fileName": "src/form/TextareaCounter.tsx",
+          "name": "Props"
+        },
+        "declarations": [
+          {
+            "fileName": "src/form/TextareaCounter.tsx",
+            "name": "Props"
+          }
+        ],
         "required": true,
         "type": {
-          "name": "any"
+          "name": "{ counterLeft?: string | undefined; counterTooMuch?: string | undefined; } | undefined"
         }
       }
     }
@@ -4556,7 +4596,7 @@
         "defaultValue": {
           "value": "true"
         },
-        "description": "Inverts when the underline appears. If this is false,\nthe underline does not appear by default, but does appear when the link is hovered.\nThis makes it more suitable for use when inlined in text.",
+        "description": "Inverts when the underline appears. If this is false,\nthe underline only appears on hover.\n\n**NB: Underline can only be removed in menus etc. where it's obvious that it's a link.**",
         "name": "underline",
         "parent": {
           "fileName": "src/link/Link.tsx",

package/cjs/alert/Alert.js

@@ -77,6 +77,6 @@ exports.Alert = (0, react_1.forwardRef)((_a, ref) => {
         react_1.default.createElement(Icon, { variant: variant, className: "navds-alert__icon" }),
         react_1.default.createElement(typography_1.BodyLong, { as: "div", size: size, className: "navds-alert__wrapper" }, children),
         closeButton && !inline && (react_1.default.createElement("div", { className: "navds-alert__button-wrapper" },
-            react_1.default.createElement(button_1.Button, { className: "navds-alert__button", size: "small", variant: "tertiary-neutral", onClick: onClose, icon: react_1.default.createElement(aksel_icons_1.XMarkIcon, { title: "Lukk Alert" }) })))));
+            react_1.default.createElement(button_1.Button, { className: "navds-alert__button", size: "small", variant: "tertiary-neutral", onClick: onClose, type: "button", icon: react_1.default.createElement(aksel_icons_1.XMarkIcon, { title: "Lukk Alert" }) })))));
 });
 exports.default = exports.Alert;

package/cjs/form/Textarea.js

@@ -37,14 +37,15 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Counter = exports.Textarea = void 0;
+exports.Textarea = void 0;
 const clsx_1 = __importDefault(require("clsx"));
 const react_1 = __importStar(require("react"));
 const typography_1 = require("../typography");
+const util_1 = require("../util");
 const TextareaAutoSize_1 = __importDefault(require("../util/TextareaAutoSize"));
-const useFormField_1 = require("./useFormField");
 const ReadOnlyIcon_1 = require("./ReadOnlyIcon");
-const util_1 = require("../util");
+const TextareaCounter_1 = __importDefault(require("./TextareaCounter"));
+const useFormField_1 = require("./useFormField");
 /**
  * A component that displays a textarea input field with a label.
  *
@@ -91,22 +92,10 @@ exports.Textarea = (0, react_1.forwardRef)((props, ref) => {
         react_1.default.createElement("div", { className: "navds-textarea__wrapper" },
             react_1.default.createElement(TextareaAutoSize_1.default, Object.assign({}, (0, util_1.omit)(rest, ["error", "errorId", "size"]), inputProps, { onChange: (e) => props.onChange
                     ? props.onChange(e)
-                    : setControlledValue(e.target.value), minRows: getMinRows(), ref: ref, readOnly: readOnly, className: (0, clsx_1.default)("navds-textarea__input", "navds-body-short", `navds-body-short--${size !== null && size !== void 0 ? size : "medium"}`, {
-                    "navds-textarea--counter": hasMaxLength,
-                }) }, (describedBy ? { "aria-describedby": describedBy } : {}))),
-            hasMaxLength && (react_1.default.createElement(react_1.default.Fragment, null,
+                    : setControlledValue(e.target.value), minRows: getMinRows(), ref: ref, readOnly: readOnly, className: (0, clsx_1.default)("navds-textarea__input", "navds-body-short", `navds-body-short--${size !== null && size !== void 0 ? size : "medium"}`) }, (describedBy ? { "aria-describedby": describedBy } : {}))),
+            hasMaxLength && !readOnly && !inputProps.disabled && (react_1.default.createElement(react_1.default.Fragment, null,
                 react_1.default.createElement("span", { id: maxLengthId, className: "navds-sr-only" }, `Tekstområde med plass til ${maxLength} tegn.`),
-                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, i18n: i18n })))),
+                react_1.default.createElement(TextareaCounter_1.default, { 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, i18n: i18n })))),
         react_1.default.createElement("div", { className: "navds-form-field__error", id: errorId, "aria-relevant": "additions removals", "aria-live": "polite" }, showErrorMsg && (react_1.default.createElement(typography_1.ErrorMessage, { size: size }, props.error)))));
 });
-const Counter = ({ maxLength, currentLength, size, i18n }) => {
-    var _a, _b;
-    const difference = maxLength - currentLength;
-    return (react_1.default.createElement(typography_1.BodyShort, { className: (0, clsx_1.default)("navds-textarea__counter", {
-            "navds-textarea__counter--error": difference < 0,
-        }), "aria-live": difference < 20 ? "polite" : "off", size: size }, difference < 0
-        ? `${Math.abs(difference)} ${(_a = i18n === null || i18n === void 0 ? void 0 : i18n.counterTooMuch) !== null && _a !== void 0 ? _a : "tegn for mye"}`
-        : `${difference} ${(_b = i18n === null || i18n === void 0 ? void 0 : i18n.counterLeft) !== null && _b !== void 0 ? _b : "tegn igjen"}`));
-};
-exports.Counter = Counter;
 exports.default = exports.Textarea;

package/cjs/form/TextareaCounter.js

@@ -0,0 +1,18 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const clsx_1 = __importDefault(require("clsx"));
+const react_1 = __importDefault(require("react"));
+const typography_1 = require("../typography");
+const TextareaCounter = ({ maxLength, currentLength, size, i18n }) => {
+    var _a, _b;
+    const difference = maxLength - currentLength;
+    return (react_1.default.createElement(typography_1.BodyShort, { className: (0, clsx_1.default)("navds-textarea__counter", {
+            "navds-textarea__counter--error": difference < 0,
+        }), role: difference < 20 ? "status" : undefined, size: size }, difference < 0
+        ? `${Math.abs(difference)} ${(_a = i18n === null || i18n === void 0 ? void 0 : i18n.counterTooMuch) !== null && _a !== void 0 ? _a : "tegn for mye"}`
+        : `${difference} ${(_b = i18n === null || i18n === void 0 ? void 0 : i18n.counterLeft) !== null && _b !== void 0 ? _b : "tegn igjen"}`));
+};
+exports.default = TextareaCounter;

package/cjs/form/error-summary/ErrorSummary.js

@@ -67,7 +67,10 @@ exports.ErrorSummary = (0, react_1.forwardRef)((_a, ref) => {
     return (react_1.default.createElement("section", Object.assign({ ref: ref }, rest, { className: (0, clsx_1.default)(className, "navds-error-summary", `navds-error-summary--${size}`), tabIndex: -1, "aria-live": "polite", "aria-relevant": "all", "aria-labelledby": headingId }),
         react_1.default.createElement(typography_1.Heading, { className: "navds-error-summary__heading", as: headingTag, size: "small", id: headingId }, heading),
         react_1.default.createElement(typography_1.BodyShort, { as: "ul", size: size, className: "navds-error-summary__list" }, react_1.default.Children.map(children, (child) => {
-            return react_1.default.createElement("li", { key: child === null || child === void 0 ? void 0 : child.toString() }, child);
+            if (!(0, react_1.isValidElement)(child)) {
+                return null;
+            }
+            return react_1.default.createElement("li", { key: child.toString() }, child);
         }))));
 });
 exports.ErrorSummary.Item = ErrorSummaryItem_1.default;

package/cjs/form/index.js

@@ -3,30 +3,29 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.TextField = exports.Textarea = exports.Counter = exports.Switch = exports.Select = exports.UNSAFE_Combobox = exports.Search = exports.RadioGroup = exports.Radio = exports.FieldsetContext = exports.Fieldset = exports.ErrorSummary = exports.ConfirmationPanel = exports.CheckboxGroup = exports.Checkbox = void 0;
-var checkbox_1 = require("./checkbox");
-Object.defineProperty(exports, "Checkbox", { enumerable: true, get: function () { return checkbox_1.Checkbox; } });
-Object.defineProperty(exports, "CheckboxGroup", { enumerable: true, get: function () { return checkbox_1.CheckboxGroup; } });
+exports.Search = exports.RadioGroup = exports.Radio = exports.ErrorSummary = exports.UNSAFE_Combobox = exports.CheckboxGroup = exports.Checkbox = exports.Textarea = exports.TextField = exports.Switch = exports.Select = exports.FieldsetContext = exports.Fieldset = exports.ConfirmationPanel = void 0;
 var ConfirmationPanel_1 = require("./ConfirmationPanel");
 Object.defineProperty(exports, "ConfirmationPanel", { enumerable: true, get: function () { return __importDefault(ConfirmationPanel_1).default; } });
-var error_summary_1 = require("./error-summary");
-Object.defineProperty(exports, "ErrorSummary", { enumerable: true, get: function () { return error_summary_1.ErrorSummary; } });
 var Fieldset_1 = require("./Fieldset");
 Object.defineProperty(exports, "Fieldset", { enumerable: true, get: function () { return Fieldset_1.Fieldset; } });
 Object.defineProperty(exports, "FieldsetContext", { enumerable: true, get: function () { return Fieldset_1.FieldsetContext; } });
-var radio_1 = require("./radio");
-Object.defineProperty(exports, "Radio", { enumerable: true, get: function () { return radio_1.Radio; } });
-Object.defineProperty(exports, "RadioGroup", { enumerable: true, get: function () { return radio_1.RadioGroup; } });
-var search_1 = require("./search");
-Object.defineProperty(exports, "Search", { enumerable: true, get: function () { return search_1.Search; } });
-var combobox_1 = require("./combobox");
-Object.defineProperty(exports, "UNSAFE_Combobox", { enumerable: true, get: function () { return combobox_1.Combobox; } });
 var Select_1 = require("./Select");
 Object.defineProperty(exports, "Select", { enumerable: true, get: function () { return __importDefault(Select_1).default; } });
 var Switch_1 = require("./Switch");
 Object.defineProperty(exports, "Switch", { enumerable: true, get: function () { return __importDefault(Switch_1).default; } });
-var Textarea_1 = require("./Textarea");
-Object.defineProperty(exports, "Counter", { enumerable: true, get: function () { return Textarea_1.Counter; } });
-Object.defineProperty(exports, "Textarea", { enumerable: true, get: function () { return __importDefault(Textarea_1).default; } });
 var TextField_1 = require("./TextField");
 Object.defineProperty(exports, "TextField", { enumerable: true, get: function () { return __importDefault(TextField_1).default; } });
+var Textarea_1 = require("./Textarea");
+Object.defineProperty(exports, "Textarea", { enumerable: true, get: function () { return __importDefault(Textarea_1).default; } });
+var checkbox_1 = require("./checkbox");
+Object.defineProperty(exports, "Checkbox", { enumerable: true, get: function () { return checkbox_1.Checkbox; } });
+Object.defineProperty(exports, "CheckboxGroup", { enumerable: true, get: function () { return checkbox_1.CheckboxGroup; } });
+var combobox_1 = require("./combobox");
+Object.defineProperty(exports, "UNSAFE_Combobox", { enumerable: true, get: function () { return combobox_1.Combobox; } });
+var error_summary_1 = require("./error-summary");
+Object.defineProperty(exports, "ErrorSummary", { enumerable: true, get: function () { return error_summary_1.ErrorSummary; } });
+var radio_1 = require("./radio");
+Object.defineProperty(exports, "Radio", { enumerable: true, get: function () { return radio_1.Radio; } });
+Object.defineProperty(exports, "RadioGroup", { enumerable: true, get: function () { return radio_1.RadioGroup; } });
+var search_1 = require("./search");
+Object.defineProperty(exports, "Search", { enumerable: true, get: function () { return search_1.Search; } });

package/cjs/link/Link.js

@@ -38,8 +38,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Link = void 0;
-const react_1 = __importStar(require("react"));
 const clsx_1 = __importDefault(require("clsx"));
+const react_1 = __importStar(require("react"));
 /**
  * A component that displays a hyperlink.
  *

package/esm/alert/Alert.js

@@ -48,7 +48,7 @@ export const Alert = forwardRef((_a, ref) => {
         React.createElement(Icon, { variant: variant, className: "navds-alert__icon" }),
         React.createElement(BodyLong, { as: "div", size: size, className: "navds-alert__wrapper" }, children),
         closeButton && !inline && (React.createElement("div", { className: "navds-alert__button-wrapper" },
-            React.createElement(Button, { className: "navds-alert__button", size: "small", variant: "tertiary-neutral", onClick: onClose, icon: React.createElement(XMarkIcon, { title: "Lukk Alert" }) })))));
+            React.createElement(Button, { className: "navds-alert__button", size: "small", variant: "tertiary-neutral", onClick: onClose, type: "button", icon: React.createElement(XMarkIcon, { title: "Lukk Alert" }) })))));
 });
 export default Alert;
 //# sourceMappingURL=Alert.js.map

package/esm/alert/Alert.js.map

@@ -1 +1 @@
-{"version":3,"file":"Alert.js","sourceRoot":"","sources":["../../src/alert/Alert.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EACL,yBAAyB,EACzB,uBAAuB,EACvB,+BAA+B,EAC/B,oBAAoB,EACpB,SAAS,GACV,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,MAAM,MAAM,CAAC;AACtB,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AAuCnC,MAAM,IAAI,GAAG,CAAC,EAAqB,EAAE,EAAE;QAAzB,EAAE,OAAO,OAAY,EAAP,KAAK,cAAnB,WAAqB,CAAF;IAC/B,QAAQ,OAAO,EAAE;QACf,KAAK,OAAO;YACV,OAAO,oBAAC,oBAAoB,kBAAC,KAAK,EAAC,MAAM,IAAK,KAAK,EAAI,CAAC;QAC1D,KAAK,SAAS;YACZ,OAAO,oBAAC,+BAA+B,kBAAC,KAAK,EAAC,UAAU,IAAK,KAAK,EAAI,CAAC;QACzE,KAAK,MAAM;YACT,OAAO,oBAAC,yBAAyB,kBAAC,KAAK,EAAC,aAAa,IAAK,KAAK,EAAI,CAAC;QACtE,KAAK,SAAS;YACZ,OAAO,oBAAC,uBAAuB,kBAAC,KAAK,EAAC,SAAS,IAAK,KAAK,EAAI,CAAC;QAChE;YACE,OAAO,IAAI,CAAC;KACf;AACH,CAAC,CAAC;AAMF;;;;;;;;GAQG;AACH,MAAM,CAAC,MAAM,KAAK,GAAG,UAAU,CAC7B,CACE,EAUC,EACD,GAAG,EACH,EAAE;QAZF,EACE,QAAQ,EACR,SAAS,EACT,OAAO,EACP,IAAI,GAAG,QAAQ,EACf,SAAS,GAAG,KAAK,EACjB,MAAM,GAAG,KAAK,EACd,WAAW,GAAG,KAAK,EACnB,OAAO,OAER,EADI,IAAI,cATT,6FAUC,CADQ;IAIT,OAAO,CACL,6CACM,IAAI,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACX,SAAS,EACT,aAAa,EACb,gBAAgB,OAAO,EAAE,EACzB,gBAAgB,IAAI,EAAE,EACtB;YACE,yBAAyB,EAAE,SAAS;YACpC,qBAAqB,EAAE,MAAM;YAC7B,2BAA2B,EAAE,WAAW;SACzC,CACF;QAED,oBAAC,IAAI,IAAC,OAAO,EAAE,OAAO,EAAE,SAAS,EAAC,mBAAmB,GAAG;QACxD,oBAAC,QAAQ,IAAC,EAAE,EAAC,KAAK,EAAC,IAAI,EAAE,IAAI,EAAE,SAAS,EAAC,sBAAsB,IAC5D,QAAQ,CACA;QACV,WAAW,IAAI,CAAC,MAAM,IAAI,CACzB,6BAAK,SAAS,EAAC,6BAA6B;YAC1C,oBAAC,MAAM,IACL,SAAS,EAAC,qBAAqB,EAC/B,IAAI,EAAC,OAAO,EACZ,OAAO,EAAC,kBAAkB,EAC1B,OAAO,EAAE,OAAO,EAChB,IAAI,EAAE,oBAAC,SAAS,IAAC,KAAK,EAAC,YAAY,GAAG,GACtC,CACE,CACP,CACG,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,KAAK,CAAC"}
+{"version":3,"file":"Alert.js","sourceRoot":"","sources":["../../src/alert/Alert.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EACL,yBAAyB,EACzB,uBAAuB,EACvB,+BAA+B,EAC/B,oBAAoB,EACpB,SAAS,GACV,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,MAAM,MAAM,CAAC;AACtB,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AACzC,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AAuCnC,MAAM,IAAI,GAAG,CAAC,EAAqB,EAAE,EAAE;QAAzB,EAAE,OAAO,OAAY,EAAP,KAAK,cAAnB,WAAqB,CAAF;IAC/B,QAAQ,OAAO,EAAE;QACf,KAAK,OAAO;YACV,OAAO,oBAAC,oBAAoB,kBAAC,KAAK,EAAC,MAAM,IAAK,KAAK,EAAI,CAAC;QAC1D,KAAK,SAAS;YACZ,OAAO,oBAAC,+BAA+B,kBAAC,KAAK,EAAC,UAAU,IAAK,KAAK,EAAI,CAAC;QACzE,KAAK,MAAM;YACT,OAAO,oBAAC,yBAAyB,kBAAC,KAAK,EAAC,aAAa,IAAK,KAAK,EAAI,CAAC;QACtE,KAAK,SAAS;YACZ,OAAO,oBAAC,uBAAuB,kBAAC,KAAK,EAAC,SAAS,IAAK,KAAK,EAAI,CAAC;QAChE;YACE,OAAO,IAAI,CAAC;KACf;AACH,CAAC,CAAC;AAMF;;;;;;;;GAQG;AACH,MAAM,CAAC,MAAM,KAAK,GAAG,UAAU,CAC7B,CACE,EAUC,EACD,GAAG,EACH,EAAE;QAZF,EACE,QAAQ,EACR,SAAS,EACT,OAAO,EACP,IAAI,GAAG,QAAQ,EACf,SAAS,GAAG,KAAK,EACjB,MAAM,GAAG,KAAK,EACd,WAAW,GAAG,KAAK,EACnB,OAAO,OAER,EADI,IAAI,cATT,6FAUC,CADQ;IAIT,OAAO,CACL,6CACM,IAAI,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACX,SAAS,EACT,aAAa,EACb,gBAAgB,OAAO,EAAE,EACzB,gBAAgB,IAAI,EAAE,EACtB;YACE,yBAAyB,EAAE,SAAS;YACpC,qBAAqB,EAAE,MAAM;YAC7B,2BAA2B,EAAE,WAAW;SACzC,CACF;QAED,oBAAC,IAAI,IAAC,OAAO,EAAE,OAAO,EAAE,SAAS,EAAC,mBAAmB,GAAG;QACxD,oBAAC,QAAQ,IAAC,EAAE,EAAC,KAAK,EAAC,IAAI,EAAE,IAAI,EAAE,SAAS,EAAC,sBAAsB,IAC5D,QAAQ,CACA;QACV,WAAW,IAAI,CAAC,MAAM,IAAI,CACzB,6BAAK,SAAS,EAAC,6BAA6B;YAC1C,oBAAC,MAAM,IACL,SAAS,EAAC,qBAAqB,EAC/B,IAAI,EAAC,OAAO,EACZ,OAAO,EAAC,kBAAkB,EAC1B,OAAO,EAAE,OAAO,EAChB,IAAI,EAAC,QAAQ,EACb,IAAI,EAAE,oBAAC,SAAS,IAAC,KAAK,EAAC,YAAY,GAAG,GACtC,CACE,CACP,CACG,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,KAAK,CAAC"}

package/esm/form/Textarea.d.ts

@@ -19,7 +19,6 @@ export interface TextareaProps extends FormFieldProps, React.TextareaHTMLAttribu
     defaultValue?: string;
     /**
      * Maximum number of character rows to display.
-     * @bug Internal scrolling with `maxLength` scrolls over maxLength-text
      */
     maxRows?: number;
     /**
@@ -42,7 +41,7 @@ export interface TextareaProps extends FormFieldProps, React.TextareaHTMLAttribu
      * i18n-translations for counter-text
      */
     i18n?: {
-        /** @default Antall tegn igjen */
+        /** @default tegn igjen */
         counterLeft?: string;
         /** @default tegn for mye */
         counterTooMuch?: string;
@@ -60,10 +59,4 @@ export interface TextareaProps extends FormFieldProps, React.TextareaHTMLAttribu
  * ```
  */
 export declare const Textarea: React.ForwardRefExoticComponent<TextareaProps & React.RefAttributes<HTMLTextAreaElement>>;
-export declare const Counter: ({ maxLength, currentLength, size, i18n }: {
-    maxLength: any;
-    currentLength: any;
-    size: any;
-    i18n: any;
-}) => React.JSX.Element;
 export default Textarea;

package/esm/form/Textarea.js

@@ -12,10 +12,11 @@ var __rest = (this && this.__rest) || function (s, e) {
 import cl from "clsx";
 import React, { forwardRef, useState } from "react";
 import { BodyShort, ErrorMessage, Label } from "../typography";
+import { omit, useId } from "../util";
 import TextareaAutosize from "../util/TextareaAutoSize";
-import { useFormField } from "./useFormField";
 import { ReadOnlyIcon } from "./ReadOnlyIcon";
-import { omit, useId } from "../util";
+import Counter from "./TextareaCounter";
+import { useFormField } from "./useFormField";
 /**
  * A component that displays a textarea input field with a label.
  *
@@ -62,22 +63,11 @@ export const Textarea = forwardRef((props, ref) => {
         React.createElement("div", { className: "navds-textarea__wrapper" },
             React.createElement(TextareaAutosize, Object.assign({}, omit(rest, ["error", "errorId", "size"]), inputProps, { onChange: (e) => props.onChange
                     ? props.onChange(e)
-                    : setControlledValue(e.target.value), minRows: getMinRows(), ref: ref, readOnly: readOnly, className: cl("navds-textarea__input", "navds-body-short", `navds-body-short--${size !== null && size !== void 0 ? size : "medium"}`, {
-                    "navds-textarea--counter": hasMaxLength,
-                }) }, (describedBy ? { "aria-describedby": describedBy } : {}))),
-            hasMaxLength && (React.createElement(React.Fragment, null,
+                    : setControlledValue(e.target.value), minRows: getMinRows(), ref: ref, readOnly: readOnly, className: cl("navds-textarea__input", "navds-body-short", `navds-body-short--${size !== null && size !== void 0 ? size : "medium"}`) }, (describedBy ? { "aria-describedby": describedBy } : {}))),
+            hasMaxLength && !readOnly && !inputProps.disabled && (React.createElement(React.Fragment, null,
                 React.createElement("span", { id: maxLengthId, className: "navds-sr-only" }, `Tekstområde med plass til ${maxLength} tegn.`),
                 React.createElement(Counter, { maxLength: maxLength, currentLength: (_c = (_b = props.value) === null || _b === void 0 ? void 0 : _b.length) !== null && _c !== void 0 ? _c : controlledValue === null || controlledValue === void 0 ? void 0 : controlledValue.length, size: size, i18n: i18n })))),
         React.createElement("div", { className: "navds-form-field__error", id: errorId, "aria-relevant": "additions removals", "aria-live": "polite" }, showErrorMsg && (React.createElement(ErrorMessage, { size: size }, props.error)))));
 });
-export const Counter = ({ maxLength, currentLength, size, i18n }) => {
-    var _a, _b;
-    const difference = maxLength - currentLength;
-    return (React.createElement(BodyShort, { className: cl("navds-textarea__counter", {
-            "navds-textarea__counter--error": difference < 0,
-        }), "aria-live": difference < 20 ? "polite" : "off", size: size }, difference < 0
-        ? `${Math.abs(difference)} ${(_a = i18n === null || i18n === void 0 ? void 0 : i18n.counterTooMuch) !== null && _a !== void 0 ? _a : "tegn for mye"}`
-        : `${difference} ${(_b = i18n === null || i18n === void 0 ? void 0 : i18n.counterLeft) !== null && _b !== void 0 ? _b : "tegn igjen"}`));
-};
 export default Textarea;
 //# sourceMappingURL=Textarea.js.map

package/esm/form/Textarea.js.map

@@ -1 +1 @@
-{"version":3,"file":"Textarea.js","sourceRoot":"","sources":["../../src/form/Textarea.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Textarea.js","sourceRoot":"","sources":["../../src/form/Textarea.tsx"],"names":[],"mappings":"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"}

package/esm/form/TextareaCounter.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+import type { TextareaProps } from "./Textarea";
+interface Props {
+    maxLength: number;
+    currentLength: number;
+    size: TextareaProps["size"];
+    i18n: TextareaProps["i18n"];
+}
+declare const TextareaCounter: ({ maxLength, currentLength, size, i18n }: Props) => React.JSX.Element;
+export default TextareaCounter;

package/esm/form/TextareaCounter.js

@@ -0,0 +1,14 @@
+import cl from "clsx";
+import React from "react";
+import { BodyShort } from "../typography";
+const TextareaCounter = ({ maxLength, currentLength, size, i18n }) => {
+    var _a, _b;
+    const difference = maxLength - currentLength;
+    return (React.createElement(BodyShort, { className: cl("navds-textarea__counter", {
+            "navds-textarea__counter--error": difference < 0,
+        }), role: difference < 20 ? "status" : undefined, size: size }, difference < 0
+        ? `${Math.abs(difference)} ${(_a = i18n === null || i18n === void 0 ? void 0 : i18n.counterTooMuch) !== null && _a !== void 0 ? _a : "tegn for mye"}`
+        : `${difference} ${(_b = i18n === null || i18n === void 0 ? void 0 : i18n.counterLeft) !== null && _b !== void 0 ? _b : "tegn igjen"}`));
+};
+export default TextareaCounter;
+//# sourceMappingURL=TextareaCounter.js.map

package/esm/form/TextareaCounter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextareaCounter.js","sourceRoot":"","sources":["../../src/form/TextareaCounter.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,MAAM,CAAC;AACtB,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAU1C,MAAM,eAAe,GAAG,CAAC,EAAE,SAAS,EAAE,aAAa,EAAE,IAAI,EAAE,IAAI,EAAS,EAAE,EAAE;;IAC1E,MAAM,UAAU,GAAG,SAAS,GAAG,aAAa,CAAC;IAE7C,OAAO,CACL,oBAAC,SAAS,IACR,SAAS,EAAE,EAAE,CAAC,yBAAyB,EAAE;YACvC,gCAAgC,EAAE,UAAU,GAAG,CAAC;SACjD,CAAC,EACF,IAAI,EAAE,UAAU,GAAG,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,EAC5C,IAAI,EAAE,IAAI,IAET,UAAU,GAAG,CAAC;QACb,CAAC,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,UAAU,CAAC,IAAI,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,cAAc,mCAAI,cAAc,EAAE;QACrE,CAAC,CAAC,GAAG,UAAU,IAAI,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,WAAW,mCAAI,YAAY,EAAE,CAC9C,CACb,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/esm/form/error-summary/ErrorSummary.js

@@ -9,7 +9,7 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import React, { forwardRef } from "react";
+import React, { forwardRef, isValidElement } from "react";
 import cl from "clsx";
 import { Heading, BodyShort } from "../../typography";
 import ErrorSummaryItem from "./ErrorSummaryItem";
@@ -38,7 +38,10 @@ export const ErrorSummary = forwardRef((_a, ref) => {
     return (React.createElement("section", Object.assign({ ref: ref }, rest, { className: cl(className, "navds-error-summary", `navds-error-summary--${size}`), tabIndex: -1, "aria-live": "polite", "aria-relevant": "all", "aria-labelledby": headingId }),
         React.createElement(Heading, { className: "navds-error-summary__heading", as: headingTag, size: "small", id: headingId }, heading),
         React.createElement(BodyShort, { as: "ul", size: size, className: "navds-error-summary__list" }, React.Children.map(children, (child) => {
-            return React.createElement("li", { key: child === null || child === void 0 ? void 0 : child.toString() }, child);
+            if (!isValidElement(child)) {
+                return null;
+            }
+            return React.createElement("li", { key: child.toString() }, child);
         }))));
 });
 ErrorSummary.Item = ErrorSummaryItem;

package/esm/form/error-summary/ErrorSummary.js.map

@@ -1 +1 @@
-{"version":3,"file":"ErrorSummary.js","sourceRoot":"","sources":["../../../src/form/error-summary/ErrorSummary.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAkB,MAAM,OAAO,CAAC;AAC1D,OAAO,EAAE,MAAM,MAAM,CAAC;AACtB,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AACtD,OAAO,gBAA0C,MAAM,oBAAoB,CAAC;AAC5E,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AA0CnC;;;;;;;;;;;;;;;;;GAiBG;AACH,MAAM,CAAC,MAAM,YAAY,GAAG,UAAU,CACpC,CACE,EAOC,EACD,GAAG,EACH,EAAE;QATF,EACE,QAAQ,EACR,SAAS,EACT,IAAI,GAAG,QAAQ,EACf,UAAU,GAAG,IAAI,EACjB,OAAO,OAER,EADI,IAAI,cANT,0DAOC,CADQ;IAIT,MAAM,SAAS,GAAG,KAAK,EAAE,CAAC;IAE1B,OAAO,CACL,+CACE,GAAG,EAAE,GAAG,IACJ,IAAI,IACR,SAAS,EAAE,EAAE,CACX,SAAS,EACT,qBAAqB,EACrB,wBAAwB,IAAI,EAAE,CAC/B,EACD,QAAQ,EAAE,CAAC,CAAC,eACF,QAAQ,mBACJ,KAAK,qBACF,SAAS;QAE1B,oBAAC,OAAO,IACN,SAAS,EAAC,8BAA8B,EACxC,EAAE,EAAE,UAAU,EACd,IAAI,EAAC,OAAO,EACZ,EAAE,EAAE,SAAS,IAEZ,OAAO,CACA;QACV,oBAAC,SAAS,IAAC,EAAE,EAAC,IAAI,EAAC,IAAI,EAAE,IAAI,EAAE,SAAS,EAAC,2BAA2B,IACjE,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE;YACtC,OAAO,4BAAI,GAAG,EAAE,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,QAAQ,EAAE,IAAG,KAAK,CAAM,CAAC;QAClD,CAAC,CAAC,CACQ,CACJ,CACX,CAAC;AACJ,CAAC,CACuB,CAAC;AAE3B,YAAY,CAAC,IAAI,GAAG,gBAAgB,CAAC;AAErC,eAAe,YAAY,CAAC"}
+{"version":3,"file":"ErrorSummary.js","sourceRoot":"","sources":["../../../src/form/error-summary/ErrorSummary.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAkB,cAAc,EAAE,MAAM,OAAO,CAAC;AAC1E,OAAO,EAAE,MAAM,MAAM,CAAC;AACtB,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AACtD,OAAO,gBAA0C,MAAM,oBAAoB,CAAC;AAC5E,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AA0CnC;;;;;;;;;;;;;;;;;GAiBG;AACH,MAAM,CAAC,MAAM,YAAY,GAAG,UAAU,CACpC,CACE,EAOC,EACD,GAAG,EACH,EAAE;QATF,EACE,QAAQ,EACR,SAAS,EACT,IAAI,GAAG,QAAQ,EACf,UAAU,GAAG,IAAI,EACjB,OAAO,OAER,EADI,IAAI,cANT,0DAOC,CADQ;IAIT,MAAM,SAAS,GAAG,KAAK,EAAE,CAAC;IAE1B,OAAO,CACL,+CACE,GAAG,EAAE,GAAG,IACJ,IAAI,IACR,SAAS,EAAE,EAAE,CACX,SAAS,EACT,qBAAqB,EACrB,wBAAwB,IAAI,EAAE,CAC/B,EACD,QAAQ,EAAE,CAAC,CAAC,eACF,QAAQ,mBACJ,KAAK,qBACF,SAAS;QAE1B,oBAAC,OAAO,IACN,SAAS,EAAC,8BAA8B,EACxC,EAAE,EAAE,UAAU,EACd,IAAI,EAAC,OAAO,EACZ,EAAE,EAAE,SAAS,IAEZ,OAAO,CACA;QACV,oBAAC,SAAS,IAAC,EAAE,EAAC,IAAI,EAAC,IAAI,EAAE,IAAI,EAAE,SAAS,EAAC,2BAA2B,IACjE,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE;YACtC,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE;gBAC1B,OAAO,IAAI,CAAC;aACb;YACD,OAAO,4BAAI,GAAG,EAAE,KAAK,CAAC,QAAQ,EAAE,IAAG,KAAK,CAAM,CAAC;QACjD,CAAC,CAAC,CACQ,CACJ,CACX,CAAC;AACJ,CAAC,CACuB,CAAC;AAE3B,YAAY,CAAC,IAAI,GAAG,gBAAgB,CAAC;AAErC,eAAe,YAAY,CAAC"}

package/esm/form/index.d.ts

@@ -1,11 +1,11 @@
-export { Checkbox, CheckboxGroup, type CheckboxGroupProps, type CheckboxProps, } from "./checkbox";
-export { type ConfirmationPanelProps, default as ConfirmationPanel, } from "./ConfirmationPanel";
-export { ErrorSummary, type ErrorSummaryProps } from "./error-summary";
+export { default as ConfirmationPanel, type ConfirmationPanelProps, } from "./ConfirmationPanel";
 export { Fieldset, FieldsetContext, type FieldsetProps } from "./Fieldset";
-export { Radio, RadioGroup, type RadioGroupProps, type RadioProps, } from "./radio";
-export { Search, type SearchClearEvent, type SearchProps } from "./search";
-export { Combobox as UNSAFE_Combobox, type ComboboxProps } from "./combobox";
 export { default as Select, type SelectProps } from "./Select";
 export { default as Switch, type SwitchProps } from "./Switch";
-export { Counter, default as Textarea, type TextareaProps } from "./Textarea";
 export { default as TextField, type TextFieldProps } from "./TextField";
+export { default as Textarea, type TextareaProps } from "./Textarea";
+export { Checkbox, CheckboxGroup, type CheckboxGroupProps, type CheckboxProps, } from "./checkbox";
+export { Combobox as UNSAFE_Combobox, type ComboboxProps } from "./combobox";
+export { ErrorSummary, type ErrorSummaryProps } from "./error-summary";
+export { Radio, RadioGroup, type RadioGroupProps, type RadioProps, } from "./radio";
+export { Search, type SearchClearEvent, type SearchProps } from "./search";

package/esm/form/index.js

@@ -1,12 +1,12 @@
-export { Checkbox, CheckboxGroup, } from "./checkbox";
 export { default as ConfirmationPanel, } from "./ConfirmationPanel";
-export { ErrorSummary } from "./error-summary";
 export { Fieldset, FieldsetContext } from "./Fieldset";
-export { Radio, RadioGroup, } from "./radio";
-export { Search } from "./search";
-export { Combobox as UNSAFE_Combobox } from "./combobox";
 export { default as Select } from "./Select";
 export { default as Switch } from "./Switch";
-export { Counter, default as Textarea } from "./Textarea";
 export { default as TextField } from "./TextField";
+export { default as Textarea } from "./Textarea";
+export { Checkbox, CheckboxGroup, } from "./checkbox";
+export { Combobox as UNSAFE_Combobox } from "./combobox";
+export { ErrorSummary } from "./error-summary";
+export { Radio, RadioGroup, } from "./radio";
+export { Search } from "./search";
 //# sourceMappingURL=index.js.map

package/esm/form/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/form/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,QAAQ,EACR,aAAa,GAGd,MAAM,YAAY,CAAC;AACpB,OAAO,EAEL,OAAO,IAAI,iBAAiB,GAC7B,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,YAAY,EAA0B,MAAM,iBAAiB,CAAC;AACvE,OAAO,EAAE,QAAQ,EAAE,eAAe,EAAsB,MAAM,YAAY,CAAC;AAC3E,OAAO,EACL,KAAK,EACL,UAAU,GAGX,MAAM,SAAS,CAAC;AACjB,OAAO,EAAE,MAAM,EAA2C,MAAM,UAAU,CAAC;AAC3E,OAAO,EAAE,QAAQ,IAAI,eAAe,EAAsB,MAAM,YAAY,CAAC;AAC7E,OAAO,EAAE,OAAO,IAAI,MAAM,EAAoB,MAAM,UAAU,CAAC;AAC/D,OAAO,EAAE,OAAO,IAAI,MAAM,EAAoB,MAAM,UAAU,CAAC;AAC/D,OAAO,EAAE,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAsB,MAAM,YAAY,CAAC;AAC9E,OAAO,EAAE,OAAO,IAAI,SAAS,EAAuB,MAAM,aAAa,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/form/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,OAAO,IAAI,iBAAiB,GAE7B,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,QAAQ,EAAE,eAAe,EAAsB,MAAM,YAAY,CAAC;AAC3E,OAAO,EAAE,OAAO,IAAI,MAAM,EAAoB,MAAM,UAAU,CAAC;AAC/D,OAAO,EAAE,OAAO,IAAI,MAAM,EAAoB,MAAM,UAAU,CAAC;AAC/D,OAAO,EAAE,OAAO,IAAI,SAAS,EAAuB,MAAM,aAAa,CAAC;AACxE,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAsB,MAAM,YAAY,CAAC;AACrE,OAAO,EACL,QAAQ,EACR,aAAa,GAGd,MAAM,YAAY,CAAC;AACpB,OAAO,EAAE,QAAQ,IAAI,eAAe,EAAsB,MAAM,YAAY,CAAC;AAC7E,OAAO,EAAE,YAAY,EAA0B,MAAM,iBAAiB,CAAC;AACvE,OAAO,EACL,KAAK,EACL,UAAU,GAGX,MAAM,SAAS,CAAC;AACjB,OAAO,EAAE,MAAM,EAA2C,MAAM,UAAU,CAAC"}

package/esm/link/Link.d.ts

@@ -3,8 +3,9 @@ import { OverridableComponent } from "../util/OverridableComponent";
 export interface LinkProps extends React.AnchorHTMLAttributes<HTMLAnchorElement> {
     /**
      * Inverts when the underline appears. If this is false,
-     * the underline does not appear by default, but does appear when the link is hovered.
-     * This makes it more suitable for use when inlined in text.
+     * the underline only appears on hover.
+     *
+     * **NB: Underline can only be removed in menus etc. where it's obvious that it's a link.**
      * @default true
      */
     underline?: boolean;

package/esm/link/Link.js

@@ -9,8 +9,8 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import React, { forwardRef } from "react";
 import cl from "clsx";
+import React, { forwardRef } from "react";
 /**
  * A component that displays a hyperlink.
  *

package/esm/link/Link.js.map

@@ -1 +1 @@
-{"version":3,"file":"Link.js","sourceRoot":"","sources":["../../src/link/Link.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,EAAE,MAAM,MAAM,CAAC;AA4BtB;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,MAAM,CAAC,MAAM,IAAI,GACf,UAAU,CACR,CACE,EAOC,EACD,GAAG,EACH,EAAE;QATF,EACE,EAAE,EAAE,SAAS,GAAG,GAAG,EACnB,SAAS,EACT,SAAS,GAAG,IAAI,EAChB,OAAO,GAAG,QAAQ,EAClB,UAAU,GAAG,KAAK,OAEnB,EADI,IAAI,cANT,yDAOC,CADQ;IAGN,OAAA,CACH,oBAAC,SAAS,oBACJ,IAAI,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,YAAY,EAAE,SAAS,EAAE,eAAe,OAAO,EAAE,EAAE;YAC/D,8BAA8B,EAAE,CAAC,SAAS;YAC1C,yBAAyB,EAAE,UAAU;SACtC,CAAC,IACF,CACH,CAAA;CAAA,CACF,CAAC;AAEJ,eAAe,IAAI,CAAC"}
+{"version":3,"file":"Link.js","sourceRoot":"","sources":["../../src/link/Link.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,EAAE,MAAM,MAAM,CAAC;AACtB,OAAO,KAAK,EAAE,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AA6B1C;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,MAAM,CAAC,MAAM,IAAI,GACf,UAAU,CACR,CACE,EAOC,EACD,GAAG,EACH,EAAE;QATF,EACE,EAAE,EAAE,SAAS,GAAG,GAAG,EACnB,SAAS,EACT,SAAS,GAAG,IAAI,EAChB,OAAO,GAAG,QAAQ,EAClB,UAAU,GAAG,KAAK,OAEnB,EADI,IAAI,cANT,yDAOC,CADQ;IAGN,OAAA,CACH,oBAAC,SAAS,oBACJ,IAAI,IACR,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,YAAY,EAAE,SAAS,EAAE,eAAe,OAAO,EAAE,EAAE;YAC/D,8BAA8B,EAAE,CAAC,SAAS;YAC1C,yBAAyB,EAAE,UAAU;SACtC,CAAC,IACF,CACH,CAAA;CAAA,CACF,CAAC;AAEJ,eAAe,IAAI,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@navikt/ds-react",
-  "version": "5.10.2",
+  "version": "5.10.4",
   "description": "Aksel react-components for NAV designsystem",
   "author": "Aksel | NAV designsystem team",
   "license": "MIT",
@@ -38,8 +38,8 @@
   },
   "dependencies": {
     "@floating-ui/react": "0.25.4",
-    "@navikt/aksel-icons": "^5.10.2",
-    "@navikt/ds-tokens": "^5.10.2",
+    "@navikt/aksel-icons": "^5.10.4",
+    "@navikt/ds-tokens": "^5.10.4",
     "@radix-ui/react-tabs": "1.0.0",
     "@radix-ui/react-toggle-group": "1.0.0",
     "clsx": "^1.2.1",

package/src/alert/Alert.tsx

@@ -117,6 +117,7 @@ export const Alert = forwardRef<HTMLDivElement, AlertProps>(
               size="small"
               variant="tertiary-neutral"
               onClick={onClose}
+              type="button"
               icon={<XMarkIcon title="Lukk Alert" />}
             />
           </div>

package/src/form/Textarea.tsx

@@ -1,10 +1,11 @@
 import cl from "clsx";
 import React, { forwardRef, useState } from "react";
 import { BodyShort, ErrorMessage, Label } from "../typography";
+import { omit, useId } from "../util";
 import TextareaAutosize from "../util/TextareaAutoSize";
-import { FormFieldProps, useFormField } from "./useFormField";
 import { ReadOnlyIcon } from "./ReadOnlyIcon";
-import { omit, useId } from "../util";
+import Counter from "./TextareaCounter";
+import { FormFieldProps, useFormField } from "./useFormField";
 
 /**
  * TODO: Mulighet for lokalisering av sr-only/counter text
@@ -27,7 +28,6 @@ export interface TextareaProps
   defaultValue?: string;
   /**
    * Maximum number of character rows to display.
-   * @bug Internal scrolling with `maxLength` scrolls over maxLength-text
    */
   maxRows?: number;
   /**
@@ -50,7 +50,7 @@ export interface TextareaProps
    * i18n-translations for counter-text
    */
   i18n?: {
-    /** @default Antall tegn igjen */
+    /** @default tegn igjen */
     counterLeft?: string;
     /** @default tegn for mye */
     counterTooMuch?: string;
@@ -162,14 +162,11 @@ export const Textarea = forwardRef<HTMLTextAreaElement, TextareaProps>(
             className={cl(
               "navds-textarea__input",
               "navds-body-short",
-              `navds-body-short--${size ?? "medium"}`,
-              {
-                "navds-textarea--counter": hasMaxLength,
-              }
+              `navds-body-short--${size ?? "medium"}`
             )}
             {...(describedBy ? { "aria-describedby": describedBy } : {})}
           />
-          {hasMaxLength && (
+          {hasMaxLength && !readOnly && !inputProps.disabled && (
             <>
               <span id={maxLengthId} className="navds-sr-only">
                 {`Tekstområde med plass til ${maxLength} tegn.`}
@@ -198,22 +195,4 @@ export const Textarea = forwardRef<HTMLTextAreaElement, TextareaProps>(
   }
 );
 
-export const Counter = ({ maxLength, currentLength, size, i18n }) => {
-  const difference = maxLength - currentLength;
-
-  return (
-    <BodyShort
-      className={cl("navds-textarea__counter", {
-        "navds-textarea__counter--error": difference < 0,
-      })}
-      aria-live={difference < 20 ? "polite" : "off"}
-      size={size}
-    >
-      {difference < 0
-        ? `${Math.abs(difference)} ${i18n?.counterTooMuch ?? "tegn for mye"}`
-        : `${difference} ${i18n?.counterLeft ?? "tegn igjen"}`}
-    </BodyShort>
-  );
-};
-
 export default Textarea;

package/src/form/TextareaCounter.tsx

@@ -0,0 +1,31 @@
+import cl from "clsx";
+import React from "react";
+import { BodyShort } from "../typography";
+import type { TextareaProps } from "./Textarea";
+
+interface Props {
+  maxLength: number;
+  currentLength: number;
+  size: TextareaProps["size"];
+  i18n: TextareaProps["i18n"];
+}
+
+const TextareaCounter = ({ maxLength, currentLength, size, i18n }: Props) => {
+  const difference = maxLength - currentLength;
+
+  return (
+    <BodyShort
+      className={cl("navds-textarea__counter", {
+        "navds-textarea__counter--error": difference < 0,
+      })}
+      role={difference < 20 ? "status" : undefined}
+      size={size}
+    >
+      {difference < 0
+        ? `${Math.abs(difference)} ${i18n?.counterTooMuch ?? "tegn for mye"}`
+        : `${difference} ${i18n?.counterLeft ?? "tegn igjen"}`}
+    </BodyShort>
+  );
+};
+
+export default TextareaCounter;

package/src/form/error-summary/ErrorSummary.tsx

@@ -1,4 +1,4 @@
-import React, { forwardRef, HTMLAttributes } from "react";
+import React, { forwardRef, HTMLAttributes, isValidElement } from "react";
 import cl from "clsx";
 import { Heading, BodyShort } from "../../typography";
 import ErrorSummaryItem, { ErrorSummaryItemType } from "./ErrorSummaryItem";
@@ -100,7 +100,10 @@ export const ErrorSummary = forwardRef<HTMLDivElement, ErrorSummaryProps>(
         </Heading>
         <BodyShort as="ul" size={size} className="navds-error-summary__list">
           {React.Children.map(children, (child) => {
-            return <li key={child?.toString()}>{child}</li>;
+            if (!isValidElement(child)) {
+              return null;
+            }
+            return <li key={child.toString()}>{child}</li>;
           })}
         </BodyShort>
       </section>

package/src/form/index.ts

@@ -1,15 +1,20 @@
+export {
+  default as ConfirmationPanel,
+  type ConfirmationPanelProps,
+} from "./ConfirmationPanel";
+export { Fieldset, FieldsetContext, type FieldsetProps } from "./Fieldset";
+export { default as Select, type SelectProps } from "./Select";
+export { default as Switch, type SwitchProps } from "./Switch";
+export { default as TextField, type TextFieldProps } from "./TextField";
+export { default as Textarea, type TextareaProps } from "./Textarea";
 export {
   Checkbox,
   CheckboxGroup,
   type CheckboxGroupProps,
   type CheckboxProps,
 } from "./checkbox";
-export {
-  type ConfirmationPanelProps,
-  default as ConfirmationPanel,
-} from "./ConfirmationPanel";
+export { Combobox as UNSAFE_Combobox, type ComboboxProps } from "./combobox";
 export { ErrorSummary, type ErrorSummaryProps } from "./error-summary";
-export { Fieldset, FieldsetContext, type FieldsetProps } from "./Fieldset";
 export {
   Radio,
   RadioGroup,
@@ -17,8 +22,3 @@ export {
   type RadioProps,
 } from "./radio";
 export { Search, type SearchClearEvent, type SearchProps } from "./search";
-export { Combobox as UNSAFE_Combobox, type ComboboxProps } from "./combobox";
-export { default as Select, type SelectProps } from "./Select";
-export { default as Switch, type SwitchProps } from "./Switch";
-export { Counter, default as Textarea, type TextareaProps } from "./Textarea";
-export { default as TextField, type TextFieldProps } from "./TextField";

package/src/form/stories/textarea.stories.tsx

@@ -14,7 +14,7 @@ export const Default: StoryObj<typeof Textarea> = {
   },
 
   args: {
-    maxLength: 100,
+    maxLength: 0,
     label: "Ipsum enim quis culpa",
     resize: false,
   },
@@ -28,6 +28,7 @@ export const Default: StoryObj<typeof Textarea> = {
     error: { type: "string" },
     hideLabel: { type: "boolean" },
     disabled: { type: "boolean" },
+    readOnly: { type: "boolean" },
     maxRows: { type: "number" },
     minRows: { type: "number" },
   },
@@ -66,6 +67,20 @@ export const Error = () => {
         error="Consectetur labore velit eiusmod Lorem ut nostrud mollit labore ullamco laboris laboris in."
         size="small"
       />
+
+      <Textarea
+        label="Ipsum enim quis culpa"
+        error="Consectetur labore velit eiusmod Lorem ut nostrud mollit labore ullamco laboris laboris in."
+        maxLength={20}
+      />
+
+      <Textarea
+        label="Ipsum enim quis culpa"
+        error="Consectetur labore velit eiusmod Lorem ut nostrud mollit labore ullamco laboris laboris in."
+        value="Sed dignissim sollicitudin porta."
+        maxLength={20}
+        size="small"
+      />
     </div>
   );
 };

package/src/link/Link.tsx

@@ -1,13 +1,14 @@
-import React, { forwardRef } from "react";
 import cl from "clsx";
+import React, { forwardRef } from "react";
 import { OverridableComponent } from "../util/OverridableComponent";
 
 export interface LinkProps
   extends React.AnchorHTMLAttributes<HTMLAnchorElement> {
   /**
    * Inverts when the underline appears. If this is false,
-   * the underline does not appear by default, but does appear when the link is hovered.
-   * This makes it more suitable for use when inlined in text.
+   * the underline only appears on hover.
+   *
+   * **NB: Underline can only be removed in menus etc. where it's obvious that it's a link.**
    * @default true
    */
   underline?: boolean;