@navikt/ds-react 5.10.4 → 5.11.1

package/_docs.json

@@ -3507,6 +3507,25 @@
           }
         ],
         "required": false,
+        "type": {
+          "name": "boolean | \"vertical\" | \"horizontal\""
+        }
+      },
+      "UNSAFE_autoScrollbar": {
+        "defaultValue": null,
+        "description": "Textarea will stop growing and get a scrollbar when there's no more room to grow.\nRequires `display:flex` on the parent.\nExperimental feature that may be removed or get breaking changes in a minor version.",
+        "name": "UNSAFE_autoScrollbar",
+        "parent": {
+          "fileName": "src/form/Textarea.tsx",
+          "name": "TextareaProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/form/Textarea.tsx",
+            "name": "TextareaProps"
+          }
+        ],
+        "required": false,
         "type": {
           "name": "boolean"
         }
@@ -10411,6 +10430,25 @@
           "name": "number"
         }
       },
+      "autoScrollbar": {
+        "defaultValue": null,
+        "description": "If true, textarea will never get `overflow:hidden`",
+        "name": "autoScrollbar",
+        "parent": {
+          "fileName": "src/util/TextareaAutoSize.tsx",
+          "name": "TextareaAutosizeProps"
+        },
+        "declarations": [
+          {
+            "fileName": "src/util/TextareaAutoSize.tsx",
+            "name": "TextareaAutosizeProps"
+          }
+        ],
+        "required": false,
+        "type": {
+          "name": "boolean"
+        }
+      },
       "className": {
         "defaultValue": null,
         "description": "",

package/cjs/form/Switch.js

@@ -40,11 +40,11 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.Switch = void 0;
 const clsx_1 = __importDefault(require("clsx"));
 const react_1 = __importStar(require("react"));
-const useFormField_1 = require("./useFormField");
-const ReadOnlyIcon_1 = require("./ReadOnlyIcon");
 const loader_1 = require("../loader");
 const typography_1 = require("../typography");
 const util_1 = require("../util");
+const ReadOnlyIcon_1 = require("./ReadOnlyIcon");
+const useFormField_1 = require("./useFormField");
 const SelectedIcon = () => (react_1.default.createElement("svg", { width: "12", height: "10", viewBox: "0 0 12 10", fill: "none", xmlns: "http://www.w3.org/2000/svg", focusable: false, role: "img", "aria-hidden": true, "aria-label": "Deaktiver valg" },
     react_1.default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M11.2674 0.647802C11.8762 1.20971 11.9141 2.1587 11.3522 2.76743L5.35221 9.26743C5.07531 9.56739 4.68813 9.74155 4.27998 9.74971C3.87184 9.75787 3.478 9.59933 3.18934 9.31067L0.68934 6.81067C0.103553 6.22488 0.103553 5.27513 0.68934 4.68935C1.27513 4.10356 2.22487 4.10356 2.81066 4.68935L4.20673 6.08541L9.14779 0.732587C9.7097 0.123856 10.6587 0.0858967 11.2674 0.647802Z", fill: "currentColor" })));
 /**
@@ -86,7 +86,7 @@ exports.Switch = (0, react_1.forwardRef)((props, ref) => {
                 (_a = props === null || props === void 0 ? void 0 : props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, e);
             }, className: (0, clsx_1.default)(className, "navds-switch__input") })),
         react_1.default.createElement("span", { className: "navds-switch__track" },
-            react_1.default.createElement("span", { className: "navds-switch__thumb" }, loading ? (react_1.default.createElement(loader_1.Loader, { size: "xsmall", "aria-live": "polite" })) : checked ? (react_1.default.createElement(SelectedIcon, null)) : null)),
+            react_1.default.createElement("span", { className: "navds-switch__thumb" }, loading ? (react_1.default.createElement(loader_1.Loader, { size: "xsmall", "aria-live": "polite", variant: checked ? "interaction" : "neutral" })) : checked ? (react_1.default.createElement(SelectedIcon, null)) : null)),
         react_1.default.createElement("label", { htmlFor: inputProps.id, className: "navds-switch__label-wrapper" },
             react_1.default.createElement("div", { className: (0, clsx_1.default)("navds-switch__content", {
                     "navds-sr-only": hideLabel,

package/cjs/form/Textarea.js

@@ -60,7 +60,7 @@ const useFormField_1 = require("./useFormField");
 exports.Textarea = (0, react_1.forwardRef)((props, ref) => {
     var _a, _b, _c;
     const { inputProps, errorId, showErrorMsg, hasError, size, inputDescriptionId, } = (0, useFormField_1.useFormField)(props, "textarea");
-    const { label, className, description, maxLength, hideLabel = false, resize, i18n, readOnly } = props, rest = __rest(props, ["label", "className", "description", "maxLength", "hideLabel", "resize", "i18n", "readOnly"]);
+    const { label, className, description, maxLength, hideLabel = false, resize, UNSAFE_autoScrollbar, i18n, readOnly } = props, rest = __rest(props, ["label", "className", "description", "maxLength", "hideLabel", "resize", "UNSAFE_autoScrollbar", "i18n", "readOnly"]);
     const maxLengthId = (0, util_1.useId)();
     const hasMaxLength = maxLength !== undefined && maxLength > 0;
     const [controlledValue, setControlledValue] = (0, react_1.useState)((_a = props === null || props === void 0 ? void 0 : props.defaultValue) !== null && _a !== void 0 ? _a : "");
@@ -79,7 +79,8 @@ exports.Textarea = (0, react_1.forwardRef)((props, ref) => {
             "navds-form-field--readonly": readOnly,
             "navds-textarea--readonly": readOnly,
             "navds-textarea--error": hasError,
-            "navds-textarea--resize": resize,
+            "navds-textarea--autoscrollbar": UNSAFE_autoScrollbar,
+            [`navds-textarea--resize-${resize === true ? "both" : resize}`]: resize,
         }) },
         react_1.default.createElement(typography_1.Label, { htmlFor: inputProps.id, size: size, className: (0, clsx_1.default)("navds-form-field__label", {
                 "navds-sr-only": hideLabel,
@@ -92,7 +93,7 @@ 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"}`) }, (describedBy ? { "aria-describedby": describedBy } : {}))),
+                    : setControlledValue(e.target.value), minRows: getMinRows(), autoScrollbar: UNSAFE_autoScrollbar, 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(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 })))),

package/cjs/form/TextareaCounter.js

@@ -1,18 +1,57 @@
 "use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
 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 react_1 = __importStar(require("react"));
 const typography_1 = require("../typography");
+const debounce_1 = __importDefault(require("../util/debounce"));
 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
+    const [debouncedDiff, setDebouncedDiff] = (0, react_1.useState)(difference);
+    (0, react_1.useEffect)(() => {
+        const debounceFunc = (0, debounce_1.default)(() => {
+            setDebouncedDiff(difference);
+        }, 2000);
+        debounceFunc();
+        return () => {
+            debounceFunc.clear();
+        };
+    }, [difference]);
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        difference < 20 && (react_1.default.createElement("span", { role: "status", className: "navds-textarea__sr-counter navds-sr-only" }, getCounterText(debouncedDiff, i18n))),
+        react_1.default.createElement(typography_1.BodyShort, { className: (0, clsx_1.default)("navds-textarea__counter", {
+                "navds-textarea__counter--error": difference < 0,
+            }), size: size }, getCounterText(difference, i18n))));
+};
+const getCounterText = (difference, i18n) => {
+    var _a, _b;
+    return 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"}`));
+        : `${difference} ${(_b = i18n === null || i18n === void 0 ? void 0 : i18n.counterLeft) !== null && _b !== void 0 ? _b : "tegn igjen"}`;
 };
 exports.default = TextareaCounter;

package/cjs/util/TextareaAutoSize.js

@@ -37,53 +37,75 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-/* https://github.com/mui/material-ui/blob/master/packages/mui-base/src/TextareaAutosize/TextareaAutosize.js */
+/* https://github.com/mui/material-ui/blob/master/packages/mui-base/src/TextareaAutosize/TextareaAutosize.tsx */
 const react_1 = __importStar(require("react"));
 const react_dom_1 = __importDefault(require("react-dom"));
 const util_1 = require("../util");
+const updateState = (prevState, newState, renders) => {
+    const { outerHeightStyle, overflow } = newState;
+    // Need a large enough difference to update the height.
+    // This prevents infinite rendering loop.
+    if (renders.current < 20 &&
+        ((outerHeightStyle > 0 &&
+            Math.abs((prevState.outerHeightStyle || 0) - outerHeightStyle) > 1) ||
+            prevState.overflow !== overflow)) {
+        renders.current += 1;
+        return {
+            overflow,
+            outerHeightStyle,
+        };
+    }
+    if (process.env.NODE_ENV !== "production") {
+        if (renders.current === 20) {
+            console.error([
+                "Textarea: Too many re-renders. The layout is unstable.",
+                "TextareaAutosize limits the number of renders to prevent an infinite loop.",
+            ].join("\n"));
+        }
+    }
+    return prevState;
+};
 /**
- * https://github.com/mui/material-ui/blob/master/packages/mui-utils/src/ownerDocument.ts
- * https://github.com/mui/material-ui/blob/master/packages/mui-utils/src/ownerWindow.ts
+ * https://github.com/mui/material-ui/blob/master/packages/mui-utils/src/ownerDocument/ownerDocument.ts
+ * https://github.com/mui/material-ui/blob/master/packages/mui-utils/src/ownerWindow/ownerWindow.ts
  */
 const ownerWindow = (node) => {
     const doc = (node && node.ownerDocument) || document;
     return doc.defaultView || window;
 };
-function getStyleValue(computedStyle, property) {
-    return parseInt(computedStyle[property], 10) || 0;
+function getStyleValue(value) {
+    return parseInt(value, 10) || 0;
 }
 const TextareaAutosize = (0, react_1.forwardRef)((_a, ref) => {
-    var { className, onChange, maxRows, minRows = 1, style, value } = _a, other = __rest(_a, ["className", "onChange", "maxRows", "minRows", "style", "value"]);
+    var { className, onChange, maxRows, minRows = 1, autoScrollbar, style, value } = _a, other = __rest(_a, ["className", "onChange", "maxRows", "minRows", "autoScrollbar", "style", "value"]);
     const { current: isControlled } = (0, react_1.useRef)(value != null);
     const inputRef = (0, react_1.useRef)(null);
     const handleRef = (0, react_1.useMemo)(() => (0, util_1.mergeRefs)([inputRef, ref]), [ref]);
     const shadowRef = (0, react_1.useRef)(null);
     const renders = (0, react_1.useRef)(0);
-    const [state, setState] = (0, react_1.useState)({});
+    const [state, setState] = (0, react_1.useState)({ outerHeightStyle: 0 });
     const getUpdatedState = react_1.default.useCallback(() => {
-        if (!inputRef.current || !shadowRef.current)
-            return;
         const input = inputRef.current;
         const containerWindow = ownerWindow(input);
         const computedStyle = containerWindow.getComputedStyle(input);
         // If input's width is shrunk and it's not visible, don't sync height.
         if (computedStyle.width === "0px") {
-            return;
+            return { outerHeightStyle: 0 };
         }
         const inputShallow = shadowRef.current;
         inputShallow.style.width = computedStyle.width;
-        inputShallow.value = input.value || (other === null || other === void 0 ? void 0 : other.placeholder) || "x";
+        inputShallow.value = input.value || other.placeholder || "x";
         if (inputShallow.value.slice(-1) === "\n") {
             // Certain fonts which overflow the line height will cause the textarea
             // to report a different scrollHeight depending on whether the last line
             // is empty. Make it non-empty to avoid this issue.
             inputShallow.value += " ";
         }
-        const boxSizing = computedStyle["box-sizing"];
-        const padding = getStyleValue(computedStyle, "padding-bottom") +
-            getStyleValue(computedStyle, "padding-top");
-        const border = getStyleValue(computedStyle, "border-bottom-width") +
-            getStyleValue(computedStyle, "border-top-width");
+        const boxSizing = computedStyle.boxSizing;
+        const padding = getStyleValue(computedStyle.paddingBottom) +
+            getStyleValue(computedStyle.paddingTop);
+        const border = getStyleValue(computedStyle.borderBottomWidth) +
+            getStyleValue(computedStyle.borderTopWidth);
         // The height of the inner content
         const innerHeight = inputShallow.scrollHeight - padding;
         // Measure height of a textarea with a single row
@@ -102,77 +124,50 @@ const TextareaAutosize = (0, react_1.forwardRef)((_a, ref) => {
         const outerHeightStyle = outerHeight + (boxSizing === "border-box" ? padding + border : 0);
         const overflow = Math.abs(outerHeight - innerHeight) <= 1;
         return { outerHeightStyle, overflow };
-    }, [maxRows, minRows, other === null || other === void 0 ? void 0 : other.placeholder]);
+    }, [maxRows, minRows, other.placeholder]);
     const syncHeight = react_1.default.useCallback(() => {
         const newState = getUpdatedState();
         if (isEmpty(newState)) {
             return;
         }
-        setState((prevState) => {
-            return updateState(prevState, newState);
-        });
+        setState((prevState) => updateState(prevState, newState, renders));
     }, [getUpdatedState]);
-    const updateState = (prevState, newState) => {
-        const { outerHeightStyle, overflow } = newState;
-        // Need a large enough difference to update the height.
-        // This prevents infinite rendering loop.
-        if (renders.current < 20 &&
-            ((outerHeightStyle > 0 &&
-                Math.abs((prevState.outerHeightStyle || 0) - outerHeightStyle) > 1) ||
-                prevState.overflow !== overflow)) {
-            renders.current += 1;
-            return {
-                overflow,
-                outerHeightStyle,
-            };
-        }
-        if (process.env.NODE_ENV !== "production") {
-            if (renders.current === 20) {
-                console.error([
-                    "Textarea: Too many re-renders. The layout is unstable.",
-                    "TextareaAutosize limits the number of renders to prevent an infinite loop.",
-                ].join("\n"));
+    (0, util_1.useClientLayoutEffect)(() => {
+        const syncHeightWithFlushSync = () => {
+            const newState = getUpdatedState();
+            if (isEmpty(newState)) {
+                return;
             }
-        }
-        return prevState;
-    };
-    const withFlushSync = () => {
-        const newState = getUpdatedState();
-        if (isEmpty(newState)) {
-            return;
-        }
-        // In React 18, state updates in a ResizeObserver's callback are happening after the paint which causes flickering
-        // when doing some visual updates in it. Using flushSync ensures that the dom will be painted after the states updates happen
-        // Related issue - https://github.com/facebook/react/issues/24331
-        react_dom_1.default.flushSync(() => {
-            setState((prevState) => {
-                return updateState(prevState, newState);
+            // In React 18, state updates in a ResizeObserver's callback are happening after
+            // the paint, this leads to an infinite rendering.
+            //
+            // Using flushSync ensures that the states is updated before the next pain.
+            // Related issue - https://github.com/facebook/react/issues/24331
+            react_dom_1.default.flushSync(() => {
+                setState((prevState) => updateState(prevState, newState, renders));
             });
-        });
-    };
-    react_1.default.useEffect(() => {
-        const handleResize = (0, util_1.debounce)(() => {
+        };
+        const handleResize = () => {
             renders.current = 0;
-            if (inputRef.current) {
-                withFlushSync();
-            }
-        });
-        let resizeObserver;
+            syncHeightWithFlushSync();
+        };
+        const debounceHandleResize = (0, util_1.debounce)(handleResize);
         const input = inputRef.current;
         const containerWindow = ownerWindow(input);
-        containerWindow.addEventListener("resize", handleResize);
+        containerWindow.addEventListener("resize", debounceHandleResize);
+        let resizeObserver;
         if (typeof ResizeObserver !== "undefined") {
             resizeObserver = new ResizeObserver(handleResize);
             resizeObserver.observe(input);
         }
         return () => {
-            handleResize.clear();
-            containerWindow.removeEventListener("resize", handleResize);
+            debounceHandleResize.clear();
+            containerWindow.removeEventListener("resize", debounceHandleResize);
             if (resizeObserver) {
                 resizeObserver.disconnect();
             }
         };
-    });
+    }, [getUpdatedState]);
     (0, util_1.useClientLayoutEffect)(() => {
         syncHeight();
     });
@@ -191,7 +186,10 @@ const TextareaAutosize = (0, react_1.forwardRef)((_a, ref) => {
     return (react_1.default.createElement(react_1.default.Fragment, null,
         react_1.default.createElement("textarea", Object.assign({ value: value, onChange: handleChange, ref: handleRef, 
             // Apply the rows prop to get a "correct" first SSR paint
-            rows: minRows, style: Object.assign(Object.assign({ height: state.outerHeightStyle }, (state.overflow ? { overflow: "hidden" } : {})), style) }, other, { className: className })),
+            rows: minRows, style: Object.assign({ height: state.outerHeightStyle, 
+                // Need a large enough difference to allow scrolling.
+                // This prevents infinite rendering loop.
+                overflow: state.overflow && !autoScrollbar ? "hidden" : undefined }, style) }, other, { className: className })),
         react_1.default.createElement("textarea", { "aria-hidden": true, className: className, readOnly: true, ref: shadowRef, tabIndex: -1, style: Object.assign({ 
                 // Visibility needed to hide the extra text area on iPads
                 visibility: "hidden", 
@@ -206,6 +204,6 @@ function isEmpty(obj) {
     return (obj === undefined ||
         obj === null ||
         Object.keys(obj).length === 0 ||
-        ((obj === null || obj === void 0 ? void 0 : obj.outerHeightStyle) === 0 && !(obj === null || obj === void 0 ? void 0 : obj.overflow)));
+        (obj.outerHeightStyle === 0 && !obj.overflow));
 }
 exports.default = TextareaAutosize;

package/esm/form/Switch.js

@@ -11,11 +11,11 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import cl from "clsx";
 import React, { forwardRef, useEffect, useState, } from "react";
-import { useFormField } from "./useFormField";
-import { ReadOnlyIcon } from "./ReadOnlyIcon";
 import { Loader } from "../loader";
 import { BodyShort } from "../typography";
 import { omit } from "../util";
+import { ReadOnlyIcon } from "./ReadOnlyIcon";
+import { useFormField } from "./useFormField";
 const SelectedIcon = () => (React.createElement("svg", { width: "12", height: "10", viewBox: "0 0 12 10", fill: "none", xmlns: "http://www.w3.org/2000/svg", focusable: false, role: "img", "aria-hidden": true, "aria-label": "Deaktiver valg" },
     React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M11.2674 0.647802C11.8762 1.20971 11.9141 2.1587 11.3522 2.76743L5.35221 9.26743C5.07531 9.56739 4.68813 9.74155 4.27998 9.74971C3.87184 9.75787 3.478 9.59933 3.18934 9.31067L0.68934 6.81067C0.103553 6.22488 0.103553 5.27513 0.68934 4.68935C1.27513 4.10356 2.22487 4.10356 2.81066 4.68935L4.20673 6.08541L9.14779 0.732587C9.7097 0.123856 10.6587 0.0858967 11.2674 0.647802Z", fill: "currentColor" })));
 /**
@@ -57,7 +57,7 @@ export const Switch = forwardRef((props, ref) => {
                 (_a = props === null || props === void 0 ? void 0 : props.onClick) === null || _a === void 0 ? void 0 : _a.call(props, e);
             }, className: cl(className, "navds-switch__input") })),
         React.createElement("span", { className: "navds-switch__track" },
-            React.createElement("span", { className: "navds-switch__thumb" }, loading ? (React.createElement(Loader, { size: "xsmall", "aria-live": "polite" })) : checked ? (React.createElement(SelectedIcon, null)) : null)),
+            React.createElement("span", { className: "navds-switch__thumb" }, loading ? (React.createElement(Loader, { size: "xsmall", "aria-live": "polite", variant: checked ? "interaction" : "neutral" })) : checked ? (React.createElement(SelectedIcon, null)) : null)),
         React.createElement("label", { htmlFor: inputProps.id, className: "navds-switch__label-wrapper" },
             React.createElement("div", { className: cl("navds-switch__content", {
                     "navds-sr-only": hideLabel,

package/esm/form/Switch.js.map

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

package/esm/form/Textarea.d.ts

@@ -36,7 +36,13 @@ export interface TextareaProps extends FormFieldProps, React.TextareaHTMLAttribu
     /**
      * Enables resizing of field
      */
-    resize?: boolean;
+    resize?: boolean | "vertical" | "horizontal";
+    /**
+     * Textarea will stop growing and get a scrollbar when there's no more room to grow.
+     * Requires `display:flex` on the parent.
+     * Experimental feature that may be removed or get breaking changes in a minor version.
+     */
+    UNSAFE_autoScrollbar?: boolean;
     /**
      * i18n-translations for counter-text
      */

package/esm/form/Textarea.js

@@ -31,7 +31,7 @@ import { useFormField } from "./useFormField";
 export const Textarea = forwardRef((props, ref) => {
     var _a, _b, _c;
     const { inputProps, errorId, showErrorMsg, hasError, size, inputDescriptionId, } = useFormField(props, "textarea");
-    const { label, className, description, maxLength, hideLabel = false, resize, i18n, readOnly } = props, rest = __rest(props, ["label", "className", "description", "maxLength", "hideLabel", "resize", "i18n", "readOnly"]);
+    const { label, className, description, maxLength, hideLabel = false, resize, UNSAFE_autoScrollbar, i18n, readOnly } = props, rest = __rest(props, ["label", "className", "description", "maxLength", "hideLabel", "resize", "UNSAFE_autoScrollbar", "i18n", "readOnly"]);
     const maxLengthId = useId();
     const hasMaxLength = maxLength !== undefined && maxLength > 0;
     const [controlledValue, setControlledValue] = useState((_a = props === null || props === void 0 ? void 0 : props.defaultValue) !== null && _a !== void 0 ? _a : "");
@@ -50,7 +50,8 @@ export const Textarea = forwardRef((props, ref) => {
             "navds-form-field--readonly": readOnly,
             "navds-textarea--readonly": readOnly,
             "navds-textarea--error": hasError,
-            "navds-textarea--resize": resize,
+            "navds-textarea--autoscrollbar": UNSAFE_autoScrollbar,
+            [`navds-textarea--resize-${resize === true ? "both" : resize}`]: resize,
         }) },
         React.createElement(Label, { htmlFor: inputProps.id, size: size, className: cl("navds-form-field__label", {
                 "navds-sr-only": hideLabel,
@@ -63,7 +64,7 @@ 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"}`) }, (describedBy ? { "aria-describedby": describedBy } : {}))),
+                    : setControlledValue(e.target.value), minRows: getMinRows(), autoScrollbar: UNSAFE_autoScrollbar, 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 })))),

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.js

@@ -1,14 +1,30 @@
 import cl from "clsx";
-import React from "react";
+import React, { useEffect, useState } from "react";
 import { BodyShort } from "../typography";
+import debounce from "../util/debounce";
 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
+    const [debouncedDiff, setDebouncedDiff] = useState(difference);
+    useEffect(() => {
+        const debounceFunc = debounce(() => {
+            setDebouncedDiff(difference);
+        }, 2000);
+        debounceFunc();
+        return () => {
+            debounceFunc.clear();
+        };
+    }, [difference]);
+    return (React.createElement(React.Fragment, null,
+        difference < 20 && (React.createElement("span", { role: "status", className: "navds-textarea__sr-counter navds-sr-only" }, getCounterText(debouncedDiff, i18n))),
+        React.createElement(BodyShort, { className: cl("navds-textarea__counter", {
+                "navds-textarea__counter--error": difference < 0,
+            }), size: size }, getCounterText(difference, i18n))));
+};
+const getCounterText = (difference, i18n) => {
+    var _a, _b;
+    return 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"}`));
+        : `${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

@@ -1 +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"}
+{"version":3,"file":"TextareaCounter.js","sourceRoot":"","sources":["../../src/form/TextareaCounter.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,MAAM,CAAC;AACtB,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACnD,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAC1C,OAAO,QAAQ,MAAM,kBAAkB,CAAC;AAUxC,MAAM,eAAe,GAAG,CAAC,EAAE,SAAS,EAAE,aAAa,EAAE,IAAI,EAAE,IAAI,EAAS,EAAE,EAAE;IAC1E,MAAM,UAAU,GAAG,SAAS,GAAG,aAAa,CAAC;IAE7C,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAC,UAAU,CAAC,CAAC;IAE/D,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,YAAY,GAAG,QAAQ,CAAC,GAAG,EAAE;YACjC,gBAAgB,CAAC,UAAU,CAAC,CAAC;QAC/B,CAAC,EAAE,IAAI,CAAC,CAAC;QACT,YAAY,EAAE,CAAC;QAEf,OAAO,GAAG,EAAE;YACV,YAAY,CAAC,KAAK,EAAE,CAAC;QACvB,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC;IAEjB,OAAO,CACL;QACG,UAAU,GAAG,EAAE,IAAI,CAClB,8BACE,IAAI,EAAC,QAAQ,EACb,SAAS,EAAC,0CAA0C,IAEnD,cAAc,CAAC,aAAa,EAAE,IAAI,CAAC,CAC/B,CACR;QAED,oBAAC,SAAS,IACR,SAAS,EAAE,EAAE,CAAC,yBAAyB,EAAE;gBACvC,gCAAgC,EAAE,UAAU,GAAG,CAAC;aACjD,CAAC,EACF,IAAI,EAAE,IAAI,IAET,cAAc,CAAC,UAAU,EAAE,IAAI,CAAC,CACvB,CACX,CACJ,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,cAAc,GAAG,CAAC,UAAkB,EAAE,IAA2B,EAAE,EAAE;;IACzE,OAAA,UAAU,GAAG,CAAC;QACZ,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,CAAA;CAAA,CAAC;AAE3D,eAAe,eAAe,CAAC"}

package/esm/util/TextareaAutoSize.d.ts

@@ -9,6 +9,10 @@ interface TextareaAutosizeProps extends Omit<React.TextareaHTMLAttributes<HTMLTe
      * @default 1
      */
     minRows?: number;
+    /**
+     * If true, textarea will never get `overflow:hidden`
+     */
+    autoScrollbar?: boolean;
 }
 declare const TextareaAutosize: React.ForwardRefExoticComponent<TextareaAutosizeProps & React.RefAttributes<HTMLTextAreaElement>>;
 export default TextareaAutosize;