@navikt/ds-react 6.14.0 → 6.15.0

package/cjs/overlays/floating-menu/parts/FocusScope.d.ts

@@ -0,0 +1,22 @@
+import * as React from "react";
+interface FocusScopeProps extends React.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Event handler called on mount, unless the component already has focus. Used for auto-focusing.
+     * Can be prevented.
+     */
+    onMountHandler?: (event: Event) => void;
+    /**
+     * Event handler called on unmount. Used for auto-focusing.
+     * Can be prevented.
+     */
+    onUnmountHandler?: (event: Event) => void;
+}
+/**
+ * FocusScope manages focus on mount and unmount of container.
+ * This is used to better handle autofocus of elements when mounted and unmounted.
+ * Example usage:
+ * - Focus first item in a list when mounted
+ * - Focus a button when unmounted
+ */
+declare const FocusScope: React.ForwardRefExoticComponent<FocusScopeProps & React.RefAttributes<HTMLDivElement>>;
+export { FocusScope, type FocusScopeProps };

package/cjs/overlays/floating-menu/parts/FocusScope.js

@@ -0,0 +1,89 @@
+"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 __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FocusScope = void 0;
+const React = __importStar(require("react"));
+const react_1 = require("react");
+const Slot_1 = require("../../../slot/Slot");
+const hooks_1 = require("../../../util/hooks");
+const AUTOFOCUS_ON_MOUNT = "focusScope.autoFocusOnMount";
+const AUTOFOCUS_ON_UNMOUNT = "focusScope.autoFocusOnUnmount";
+const EVENT_OPTIONS = { bubbles: false, cancelable: true };
+/**
+ * FocusScope manages focus on mount and unmount of container.
+ * This is used to better handle autofocus of elements when mounted and unmounted.
+ * Example usage:
+ * - Focus first item in a list when mounted
+ * - Focus a button when unmounted
+ */
+const FocusScope = (0, react_1.forwardRef)((_a, ref) => {
+    var { onMountHandler: onMountHandlerCallback, onUnmountHandler: onUnmountHandlerCallback } = _a, rest = __rest(_a, ["onMountHandler", "onUnmountHandler"]);
+    const [container, setContainer] = (0, react_1.useState)(null);
+    const onMountHandler = (0, hooks_1.useCallbackRef)(onMountHandlerCallback);
+    const onUnmountHandler = (0, hooks_1.useCallbackRef)(onUnmountHandlerCallback);
+    const composedRefs = (0, hooks_1.useMergeRefs)(ref, setContainer);
+    (0, react_1.useEffect)(() => {
+        var _a;
+        if (!container)
+            return;
+        const ownerDocument = (_a = container.ownerDocument) !== null && _a !== void 0 ? _a : globalThis === null || globalThis === void 0 ? void 0 : globalThis.document;
+        const hasFocus = container.contains(ownerDocument.activeElement);
+        if (!hasFocus) {
+            const mountEvent = new CustomEvent(AUTOFOCUS_ON_MOUNT, EVENT_OPTIONS);
+            container.addEventListener(AUTOFOCUS_ON_MOUNT, onMountHandler);
+            container.dispatchEvent(mountEvent);
+        }
+        return () => {
+            container.removeEventListener(AUTOFOCUS_ON_MOUNT, onMountHandler);
+            /**
+             * https://github.com/facebook/react/issues/17894
+             * As usual when dealing with focus and useEffect,
+             * we need to defer the focus to the next event-loop
+             * setTimeout makes sure the code is ran after the next render-cycle
+             */
+            setTimeout(() => {
+                const unmountEvent = new CustomEvent(AUTOFOCUS_ON_UNMOUNT, EVENT_OPTIONS);
+                container.addEventListener(AUTOFOCUS_ON_UNMOUNT, onUnmountHandler);
+                container.dispatchEvent(unmountEvent);
+                // we need to remove the listener after we `dispatchEvent`
+                container.removeEventListener(AUTOFOCUS_ON_UNMOUNT, onUnmountHandler);
+            }, 0);
+        };
+    }, [container, onMountHandler, onUnmountHandler]);
+    return React.createElement(Slot_1.Slot, Object.assign({ tabIndex: -1 }, rest, { ref: composedRefs }));
+});
+exports.FocusScope = FocusScope;
+//# sourceMappingURL=FocusScope.js.map

package/cjs/overlays/floating-menu/parts/FocusScope.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FocusScope.js","sourceRoot":"","sources":["../../../../src/overlays/floating-menu/parts/FocusScope.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,6CAA+B;AAC/B,iCAAwD;AACxD,6CAA0C;AAC1C,+CAAmE;AAEnE,MAAM,kBAAkB,GAAG,6BAA6B,CAAC;AACzD,MAAM,oBAAoB,GAAG,+BAA+B,CAAC;AAC7D,MAAM,aAAa,GAAG,EAAE,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,IAAI,EAAE,CAAC;AAe3D;;;;;;GAMG;AACH,MAAM,UAAU,GAAG,IAAA,kBAAU,EAC3B,CACE,EAIC,EACD,GAAG,EACH,EAAE;QANF,EACE,cAAc,EAAE,sBAAsB,EACtC,gBAAgB,EAAE,wBAAwB,OAE3C,EADI,IAAI,cAHT,sCAIC,CADQ;IAIT,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,IAAA,gBAAQ,EAAqB,IAAI,CAAC,CAAC;IACrE,MAAM,cAAc,GAAG,IAAA,sBAAc,EAAC,sBAAsB,CAAC,CAAC;IAC9D,MAAM,gBAAgB,GAAG,IAAA,sBAAc,EAAC,wBAAwB,CAAC,CAAC;IAElE,MAAM,YAAY,GAAG,IAAA,oBAAY,EAAC,GAAG,EAAE,YAAY,CAAC,CAAC;IAErD,IAAA,iBAAS,EAAC,GAAG,EAAE;;QACb,IAAI,CAAC,SAAS;YAAE,OAAO;QAEvB,MAAM,aAAa,GAAG,MAAA,SAAS,CAAC,aAAa,mCAAI,UAAU,aAAV,UAAU,uBAAV,UAAU,CAAE,QAAQ,CAAC;QACtE,MAAM,QAAQ,GAAG,SAAS,CAAC,QAAQ,CAAC,aAAa,CAAC,aAAa,CAAC,CAAC;QAEjE,IAAI,CAAC,QAAQ,EAAE,CAAC;YACd,MAAM,UAAU,GAAG,IAAI,WAAW,CAAC,kBAAkB,EAAE,aAAa,CAAC,CAAC;YACtE,SAAS,CAAC,gBAAgB,CAAC,kBAAkB,EAAE,cAAc,CAAC,CAAC;YAC/D,SAAS,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;QACtC,CAAC;QAED,OAAO,GAAG,EAAE;YACV,SAAS,CAAC,mBAAmB,CAAC,kBAAkB,EAAE,cAAc,CAAC,CAAC;YAElE;;;;;eAKG;YACH,UAAU,CAAC,GAAG,EAAE;gBACd,MAAM,YAAY,GAAG,IAAI,WAAW,CAClC,oBAAoB,EACpB,aAAa,CACd,CAAC;gBACF,SAAS,CAAC,gBAAgB,CAAC,oBAAoB,EAAE,gBAAgB,CAAC,CAAC;gBACnE,SAAS,CAAC,aAAa,CAAC,YAAY,CAAC,CAAC;gBAEtC,0DAA0D;gBAC1D,SAAS,CAAC,mBAAmB,CAAC,oBAAoB,EAAE,gBAAgB,CAAC,CAAC;YACxE,CAAC,EAAE,CAAC,CAAC,CAAC;QACR,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,SAAS,EAAE,cAAc,EAAE,gBAAgB,CAAC,CAAC,CAAC;IAElD,OAAO,oBAAC,WAAI,kBAAC,QAAQ,EAAE,CAAC,CAAC,IAAM,IAAI,IAAE,GAAG,EAAE,YAAY,IAAI,CAAC;AAC7D,CAAC,CACF,CAAC;AAEO,gCAAU"}

package/cjs/overlays/floating-menu/parts/RovingFocus.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+import { DescendantsManager } from "../../../util/hooks/descendants/descendant";
+interface RovingFocusProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "tabIndex"> {
+    asChild?: boolean;
+    descendants: DescendantsManager<HTMLDivElement, object>;
+    onEntryFocus?: (event: Event) => void;
+}
+declare const RovingFocus: React.ForwardRefExoticComponent<RovingFocusProps & React.RefAttributes<HTMLDivElement>>;
+export { RovingFocus, type RovingFocusProps };

package/cjs/overlays/floating-menu/parts/RovingFocus.js

@@ -0,0 +1,112 @@
+"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 __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RovingFocus = void 0;
+const react_1 = __importStar(require("react"));
+const Slot_1 = require("../../../slot/Slot");
+const composeEventHandlers_1 = require("../../../util/composeEventHandlers");
+const hooks_1 = require("../../../util/hooks");
+const ENTRY_FOCUS = "rovingFocusGroup.onEntryFocus";
+const EVENT_OPTIONS = { bubbles: false, cancelable: true };
+const RovingFocus = (0, react_1.forwardRef)((_a, ref) => {
+    var { children, asChild, descendants, onKeyDown, onEntryFocus, onMouseDown, onFocus } = _a, rest = __rest(_a, ["children", "asChild", "descendants", "onKeyDown", "onEntryFocus", "onMouseDown", "onFocus"]);
+    const _ref = react_1.default.useRef(null);
+    const composedRefs = (0, hooks_1.useMergeRefs)(ref, _ref);
+    const handleEntryFocus = (0, hooks_1.useCallbackRef)(onEntryFocus);
+    const isMouseFocusRef = (0, react_1.useRef)(false);
+    (0, react_1.useEffect)(() => {
+        const node = _ref.current;
+        if (node) {
+            node.addEventListener(ENTRY_FOCUS, handleEntryFocus);
+            return () => node.removeEventListener(ENTRY_FOCUS, handleEntryFocus);
+        }
+    }, [handleEntryFocus]);
+    const handleKeyDown = (0, react_1.useCallback)((event) => {
+        var _a, _b;
+        const loop = false;
+        const ownerDocument = (_b = (_a = _ref === null || _ref === void 0 ? void 0 : _ref.current) === null || _a === void 0 ? void 0 : _a.ownerDocument) !== null && _b !== void 0 ? _b : globalThis === null || globalThis === void 0 ? void 0 : globalThis.document;
+        const idx = descendants
+            .values()
+            .findIndex((x) => x.node.isSameNode(ownerDocument.activeElement));
+        const nextItem = () => {
+            var _a;
+            const next = descendants.nextEnabled(idx, loop);
+            next && ((_a = next.node) === null || _a === void 0 ? void 0 : _a.focus());
+        };
+        const prevItem = () => {
+            var _a;
+            const prev = descendants.prevEnabled(idx, loop);
+            prev && ((_a = prev.node) === null || _a === void 0 ? void 0 : _a.focus());
+        };
+        const firstItem = () => {
+            var _a;
+            const first = descendants.firstEnabled();
+            first && ((_a = first.node) === null || _a === void 0 ? void 0 : _a.focus());
+        };
+        const lastItem = () => {
+            var _a;
+            const last = descendants.lastEnabled();
+            last && ((_a = last.node) === null || _a === void 0 ? void 0 : _a.focus());
+        };
+        const keyMap = {
+            ArrowUp: prevItem,
+            ArrowDown: nextItem,
+            Home: firstItem,
+            End: lastItem,
+        };
+        const action = keyMap[event.key];
+        if (action) {
+            event.preventDefault();
+            action(event);
+        }
+    }, [descendants]);
+    const Comp = asChild ? Slot_1.Slot : "div";
+    return (react_1.default.createElement(Comp, Object.assign({ ref: composedRefs }, rest, { tabIndex: descendants.enabledCount() === 0 ? -1 : 0, style: Object.assign({ outline: "none" }, rest.style), onKeyDown: (0, composeEventHandlers_1.composeEventHandlers)(onKeyDown, handleKeyDown), onMouseDown: (0, composeEventHandlers_1.composeEventHandlers)(onMouseDown, () => {
+            isMouseFocusRef.current = true;
+        }), onFocus: (0, composeEventHandlers_1.composeEventHandlers)(onFocus, (event) => {
+            var _a;
+            if (event.target === event.currentTarget) {
+                const entryFocusEvent = new CustomEvent(ENTRY_FOCUS, EVENT_OPTIONS);
+                event.currentTarget.dispatchEvent(entryFocusEvent);
+                if (!entryFocusEvent.defaultPrevented) {
+                    (_a = descendants.firstEnabled()) === null || _a === void 0 ? void 0 : _a.node.focus({ preventScroll: true });
+                }
+            }
+            isMouseFocusRef.current = false;
+        }) }), children));
+});
+exports.RovingFocus = RovingFocus;
+//# sourceMappingURL=RovingFocus.js.map

package/cjs/overlays/floating-menu/parts/RovingFocus.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RovingFocus.js","sourceRoot":"","sources":["../../../../src/overlays/floating-menu/parts/RovingFocus.tsx"],"names":[],"mappings":"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"}

package/cjs/overlays/floating-menu/parts/SlottedDivElement.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+interface SlottedDivProps extends React.HTMLAttributes<HTMLDivElement> {
+    asChild?: boolean;
+}
+declare const SlottedDivElement: React.ForwardRefExoticComponent<SlottedDivProps & React.RefAttributes<HTMLDivElement>>;
+type SlottedDivElementRef = React.ElementRef<typeof SlottedDivElement>;
+export { SlottedDivElement, type SlottedDivElementRef, type SlottedDivProps };

package/cjs/overlays/floating-menu/parts/SlottedDivElement.js

@@ -0,0 +1,46 @@
+"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 __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SlottedDivElement = void 0;
+const react_1 = __importStar(require("react"));
+const Slot_1 = require("../../../slot/Slot");
+const SlottedDivElement = (0, react_1.forwardRef)((_a, forwardedRef) => {
+    var { asChild } = _a, rest = __rest(_a, ["asChild"]);
+    const Comp = asChild ? Slot_1.Slot : "div";
+    return react_1.default.createElement(Comp, Object.assign({}, rest, { ref: forwardedRef }));
+});
+exports.SlottedDivElement = SlottedDivElement;
+//# sourceMappingURL=SlottedDivElement.js.map

package/cjs/overlays/floating-menu/parts/SlottedDivElement.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SlottedDivElement.js","sourceRoot":"","sources":["../../../../src/overlays/floating-menu/parts/SlottedDivElement.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA0C;AAC1C,6CAA0C;AAM1C,MAAM,iBAAiB,GAAG,IAAA,kBAAU,EAClC,CAAC,EAAoB,EAAE,YAAY,EAAE,EAAE;QAAtC,EAAE,OAAO,OAAW,EAAN,IAAI,cAAlB,WAAoB,CAAF;IACjB,MAAM,IAAI,GAAG,OAAO,CAAC,CAAC,CAAC,WAAI,CAAC,CAAC,CAAC,KAAK,CAAC;IACpC,OAAO,8BAAC,IAAI,oBAAK,IAAI,IAAE,GAAG,EAAE,YAAY,IAAI,CAAC;AAC/C,CAAC,CACF,CAAC;AAIO,8CAAiB"}

package/cjs/util/composeEventHandlers.d.ts

@@ -2,6 +2,6 @@
  * Utility to consistently call original eventhandler, often from props and internal eventhandler
  * @internal
  */
-export declare function composeEventHandlers<T extends React.SyntheticEvent>(originalEventHandler?: (event: T) => void, ourEventHandler?: (event: T) => void, { checkForDefaultPrevented }?: {
+export declare function composeEventHandlers<T extends React.SyntheticEvent | Event>(originalEventHandler?: (event: T) => void, ourEventHandler?: (event: T) => void, { checkForDefaultPrevented }?: {
     checkForDefaultPrevented?: boolean | undefined;
 }): (event: T) => void;

package/esm/form/combobox/FilteredOptions/AddNewOption.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+declare const AddNewOption: () => React.JSX.Element;
+export default AddNewOption;

package/esm/form/combobox/FilteredOptions/AddNewOption.js

@@ -0,0 +1,36 @@
+import cl from "clsx";
+import React from "react";
+import { PlusIcon } from "@navikt/aksel-icons";
+import { BodyShort, Label } from "../../../typography/index.js";
+import { useInputContext } from "../Input/Input.context.js";
+import { useSelectedOptionsContext } from "../SelectedOptions/selectedOptionsContext.js";
+import { isInList, toComboboxOption } from "../combobox-utils.js";
+import filteredOptionsUtil from "./filtered-options-util.js";
+import { useFilteredOptionsContext } from "./filteredOptionsContext.js";
+const AddNewOption = () => {
+    const { inputProps: { id }, size, value, } = useInputContext();
+    const { setIsMouseLastUsedInputDevice, toggleIsListOpen, activeDecendantId, virtualFocus, } = useFilteredOptionsContext();
+    const { isMultiSelect, selectedOptions, toggleOption } = useSelectedOptionsContext();
+    return (React.createElement("li", { tabIndex: -1, onMouseMove: () => {
+            if (activeDecendantId !== filteredOptionsUtil.getAddNewOptionId(id)) {
+                virtualFocus.moveFocusToElement(filteredOptionsUtil.getAddNewOptionId(id));
+                setIsMouseLastUsedInputDevice(true);
+            }
+        }, onPointerUp: (event) => {
+            toggleOption(toComboboxOption(value), event);
+            if (!isMultiSelect && !isInList(value, selectedOptions))
+                toggleIsListOpen(false);
+        }, id: filteredOptionsUtil.getAddNewOptionId(id), className: cl("navds-combobox__list-item navds-combobox__list-item--new-option", {
+            "navds-combobox__list-item--new-option--focus": activeDecendantId === filteredOptionsUtil.getAddNewOptionId(id),
+        }), role: "option", "aria-selected": false },
+        React.createElement(PlusIcon, { "aria-hidden": true }),
+        React.createElement(BodyShort, { size: size },
+            "Legg til",
+            " ",
+            React.createElement(Label, { as: "span", size: size },
+                "\u201C",
+                value,
+                "\u201D"))));
+};
+export default AddNewOption;
+//# sourceMappingURL=AddNewOption.js.map

package/esm/form/combobox/FilteredOptions/AddNewOption.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AddNewOption.js","sourceRoot":"","sources":["../../../../src/form/combobox/FilteredOptions/AddNewOption.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,MAAM,CAAC;AACtB,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAC/C,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,qBAAqB,CAAC;AACvD,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AACzD,OAAO,EAAE,yBAAyB,EAAE,MAAM,2CAA2C,CAAC;AACtF,OAAO,EAAE,QAAQ,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAC/D,OAAO,mBAAmB,MAAM,yBAAyB,CAAC;AAC1D,OAAO,EAAE,yBAAyB,EAAE,MAAM,0BAA0B,CAAC;AAErE,MAAM,YAAY,GAAG,GAAG,EAAE;IACxB,MAAM,EACJ,UAAU,EAAE,EAAE,EAAE,EAAE,EAClB,IAAI,EACJ,KAAK,GACN,GAAG,eAAe,EAAE,CAAC;IACtB,MAAM,EACJ,6BAA6B,EAC7B,gBAAgB,EAChB,iBAAiB,EACjB,YAAY,GACb,GAAG,yBAAyB,EAAE,CAAC;IAChC,MAAM,EAAE,aAAa,EAAE,eAAe,EAAE,YAAY,EAAE,GACpD,yBAAyB,EAAE,CAAC;IAC9B,OAAO,CACL,4BACE,QAAQ,EAAE,CAAC,CAAC,EACZ,WAAW,EAAE,GAAG,EAAE;YAChB,IAAI,iBAAiB,KAAK,mBAAmB,CAAC,iBAAiB,CAAC,EAAE,CAAC,EAAE,CAAC;gBACpE,YAAY,CAAC,kBAAkB,CAC7B,mBAAmB,CAAC,iBAAiB,CAAC,EAAE,CAAC,CAC1C,CAAC;gBACF,6BAA6B,CAAC,IAAI,CAAC,CAAC;YACtC,CAAC;QACH,CAAC,EACD,WAAW,EAAE,CAAC,KAAK,EAAE,EAAE;YACrB,YAAY,CAAC,gBAAgB,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,CAAC;YAC7C,IAAI,CAAC,aAAa,IAAI,CAAC,QAAQ,CAAC,KAAK,EAAE,eAAe,CAAC;gBACrD,gBAAgB,CAAC,KAAK,CAAC,CAAC;QAC5B,CAAC,EACD,EAAE,EAAE,mBAAmB,CAAC,iBAAiB,CAAC,EAAE,CAAC,EAC7C,SAAS,EAAE,EAAE,CACX,iEAAiE,EACjE;YACE,8CAA8C,EAC5C,iBAAiB,KAAK,mBAAmB,CAAC,iBAAiB,CAAC,EAAE,CAAC;SAClE,CACF,EACD,IAAI,EAAC,QAAQ,mBACE,KAAK;QAEpB,oBAAC,QAAQ,0BAAe;QACxB,oBAAC,SAAS,IAAC,IAAI,EAAE,IAAI;;YACV,GAAG;YACZ,oBAAC,KAAK,IAAC,EAAE,EAAC,MAAM,EAAC,IAAI,EAAE,IAAI;;gBACjB,KAAK;yBACP,CACE,CACT,CACN,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,YAAY,CAAC"}

package/esm/form/combobox/FilteredOptions/FilteredOptions.js

@@ -1,19 +1,18 @@
 import cl from "clsx";
 import React from "react";
-import { CheckmarkIcon, PlusIcon } from "@navikt/aksel-icons";
-import { Loader } from "../../../loader/index.js";
-import { BodyShort, Label } from "../../../typography/index.js";
 import { useInputContext } from "../Input/Input.context.js";
 import { useSelectedOptionsContext } from "../SelectedOptions/selectedOptionsContext.js";
-import { isInList, toComboboxOption } from "../combobox-utils.js";
+import AddNewOption from "./AddNewOption.js";
+import FilteredOptionsItem from "./FilteredOptionsItem.js";
+import LoadingMessage from "./LoadingMessage.js";
+import MaxSelectedMessage from "./MaxSelectedMessage.js";
+import NoSearchHitsMessage from "./NoSearchHitsMessage.js";
 import filteredOptionsUtil from "./filtered-options-util.js";
 import { useFilteredOptionsContext } from "./filteredOptionsContext.js";
 const FilteredOptions = () => {
-    var _a;
-    const { inputProps: { id }, size, value, } = useInputContext();
-    const { allowNewValues, isLoading, isListOpen, filteredOptions, setFilteredOptionsRef, isMouseLastUsedInputDevice, setIsMouseLastUsedInputDevice, isValueNew, toggleIsListOpen, activeDecendantId, virtualFocus, } = useFilteredOptionsContext();
-    const { isMultiSelect, selectedOptions, toggleOption, maxSelected } = useSelectedOptionsContext();
-    const isDisabled = (option) => (maxSelected === null || maxSelected === void 0 ? void 0 : maxSelected.isLimitReached) && !isInList(option.value, selectedOptions);
+    const { inputProps: { id }, } = useInputContext();
+    const { allowNewValues, isLoading, isListOpen, filteredOptions, setFilteredOptionsRef, isMouseLastUsedInputDevice, isValueNew, } = useFilteredOptionsContext();
+    const { maxSelected } = useSelectedOptionsContext();
     const shouldRenderNonSelectables = (maxSelected === null || maxSelected === void 0 ? void 0 : maxSelected.isLimitReached) || // Render maxSelected message
         isLoading || // Render loading message
         (!isLoading && filteredOptions.length === 0 && !allowNewValues); // Render no hits message
@@ -24,55 +23,12 @@ const FilteredOptions = () => {
             "navds-combobox__list--with-hover": isMouseLastUsedInputDevice,
         }), id: filteredOptionsUtil.getFilteredOptionsId(id), tabIndex: -1 },
         shouldRenderNonSelectables && (React.createElement("div", { className: "navds-combobox__list_non-selectables", role: "status" },
-            (maxSelected === null || maxSelected === void 0 ? void 0 : maxSelected.isLimitReached) && (React.createElement("div", { className: "navds-combobox__list-item--max-selected", id: filteredOptionsUtil.getMaxSelectedOptionsId(id) }, (_a = maxSelected.message) !== null && _a !== void 0 ? _a : `${selectedOptions.length} av ${maxSelected.limit} er valgt.`)),
-            isLoading && (React.createElement("div", { className: "navds-combobox__list-item--loading", id: filteredOptionsUtil.getIsLoadingId(id) },
-                React.createElement(Loader, { title: "S\u00F8ker..." }))),
-            !isLoading && filteredOptions.length === 0 && !allowNewValues && (React.createElement("div", { className: "navds-combobox__list-item--no-options", id: filteredOptionsUtil.getNoHitsId(id) }, "Ingen s\u00F8ketreff")))),
+            (maxSelected === null || maxSelected === void 0 ? void 0 : maxSelected.isLimitReached) && React.createElement(MaxSelectedMessage, null),
+            isLoading && React.createElement(LoadingMessage, null),
+            !isLoading && filteredOptions.length === 0 && !allowNewValues && (React.createElement(NoSearchHitsMessage, null)))),
         shouldRenderFilteredOptionsList && (React.createElement("ul", { ref: setFilteredOptionsRef, role: "listbox", className: "navds-combobox__list-options" },
-            isValueNew && !(maxSelected === null || maxSelected === void 0 ? void 0 : maxSelected.isLimitReached) && allowNewValues && (React.createElement("li", { tabIndex: -1, onMouseMove: () => {
-                    if (activeDecendantId !==
-                        filteredOptionsUtil.getAddNewOptionId(id)) {
-                        virtualFocus.moveFocusToElement(filteredOptionsUtil.getAddNewOptionId(id));
-                        setIsMouseLastUsedInputDevice(true);
-                    }
-                }, onPointerUp: (event) => {
-                    toggleOption(toComboboxOption(value), event);
-                    if (!isMultiSelect && !isInList(value, selectedOptions))
-                        toggleIsListOpen(false);
-                }, id: filteredOptionsUtil.getAddNewOptionId(id), className: cl("navds-combobox__list-item navds-combobox__list-item--new-option", {
-                    "navds-combobox__list-item--new-option--focus": activeDecendantId ===
-                        filteredOptionsUtil.getAddNewOptionId(id),
-                }), role: "option", "aria-selected": false },
-                React.createElement(PlusIcon, { "aria-hidden": true }),
-                React.createElement(BodyShort, { size: size },
-                    "Legg til",
-                    " ",
-                    React.createElement(Label, { as: "span", size: size },
-                        "\u201C",
-                        value,
-                        "\u201D")))),
-            filteredOptions.map((option) => (React.createElement("li", { className: cl("navds-combobox__list-item", {
-                    "navds-combobox__list-item--focus": activeDecendantId ===
-                        filteredOptionsUtil.getOptionId(id, option.label),
-                    "navds-combobox__list-item--selected": isInList(option.value, selectedOptions),
-                }), "data-no-focus": isDisabled(option) || undefined, id: filteredOptionsUtil.getOptionId(id, option.label), key: option.label, tabIndex: -1, onMouseMove: () => {
-                    if (activeDecendantId !==
-                        filteredOptionsUtil.getOptionId(id, option.label)) {
-                        virtualFocus.moveFocusToElement(filteredOptionsUtil.getOptionId(id, option.label));
-                        setIsMouseLastUsedInputDevice(true);
-                    }
-                }, onPointerUp: (event) => {
-                    if (isDisabled(option)) {
-                        return;
-                    }
-                    toggleOption(option, event);
-                    if (!isMultiSelect &&
-                        !isInList(option.value, selectedOptions)) {
-                        toggleIsListOpen(false);
-                    }
-                }, role: "option", "aria-selected": isInList(option.value, selectedOptions), "aria-disabled": isDisabled(option) || undefined },
-                React.createElement(BodyShort, { size: size }, option.label),
-                isInList(option.value, selectedOptions) && React.createElement(CheckmarkIcon, null))))))));
+            isValueNew && !(maxSelected === null || maxSelected === void 0 ? void 0 : maxSelected.isLimitReached) && allowNewValues && (React.createElement(AddNewOption, null)),
+            filteredOptions.map((option) => (React.createElement(FilteredOptionsItem, { key: option.value, option: option })))))));
 };
 export default FilteredOptions;
 //# sourceMappingURL=FilteredOptions.js.map

package/esm/form/combobox/FilteredOptions/FilteredOptions.js.map

@@ -1 +1 @@
-{"version":3,"file":"FilteredOptions.js","sourceRoot":"","sources":["../../../../src/form/combobox/FilteredOptions/FilteredOptions.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"FilteredOptions.js","sourceRoot":"","sources":["../../../../src/form/combobox/FilteredOptions/FilteredOptions.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,MAAM,CAAC;AACtB,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AACzD,OAAO,EAAE,yBAAyB,EAAE,MAAM,2CAA2C,CAAC;AACtF,OAAO,YAAY,MAAM,gBAAgB,CAAC;AAC1C,OAAO,mBAAmB,MAAM,uBAAuB,CAAC;AACxD,OAAO,cAAc,MAAM,kBAAkB,CAAC;AAC9C,OAAO,kBAAkB,MAAM,sBAAsB,CAAC;AACtD,OAAO,mBAAmB,MAAM,uBAAuB,CAAC;AACxD,OAAO,mBAAmB,MAAM,yBAAyB,CAAC;AAC1D,OAAO,EAAE,yBAAyB,EAAE,MAAM,0BAA0B,CAAC;AAErE,MAAM,eAAe,GAAG,GAAG,EAAE;IAC3B,MAAM,EACJ,UAAU,EAAE,EAAE,EAAE,EAAE,GACnB,GAAG,eAAe,EAAE,CAAC;IACtB,MAAM,EACJ,cAAc,EACd,SAAS,EACT,UAAU,EACV,eAAe,EACf,qBAAqB,EACrB,0BAA0B,EAC1B,UAAU,GACX,GAAG,yBAAyB,EAAE,CAAC;IAChC,MAAM,EAAE,WAAW,EAAE,GAAG,yBAAyB,EAAE,CAAC;IAEpD,MAAM,0BAA0B,GAC9B,CAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,cAAc,KAAI,6BAA6B;QAC5D,SAAS,IAAI,yBAAyB;QACtC,CAAC,CAAC,SAAS,IAAI,eAAe,CAAC,MAAM,KAAK,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,yBAAyB;IAE5F,MAAM,+BAA+B,GACnC,CAAC,cAAc,IAAI,UAAU,IAAI,CAAC,CAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,cAAc,CAAA,CAAC,IAAI,wBAAwB;QAC1F,eAAe,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,0BAA0B;IAExD,OAAO,CACL,6BACE,SAAS,EAAE,EAAE,CAAC,sBAAsB,EAAE;YACpC,8BAA8B,EAAE,CAAC,UAAU;YAC3C,kCAAkC,EAAE,0BAA0B;SAC/D,CAAC,EACF,EAAE,EAAE,mBAAmB,CAAC,oBAAoB,CAAC,EAAE,CAAC,EAChD,QAAQ,EAAE,CAAC,CAAC;QAEX,0BAA0B,IAAI,CAC7B,6BAAK,SAAS,EAAC,sCAAsC,EAAC,IAAI,EAAC,QAAQ;YAChE,CAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,cAAc,KAAI,oBAAC,kBAAkB,OAAG;YACrD,SAAS,IAAI,oBAAC,cAAc,OAAG;YAC/B,CAAC,SAAS,IAAI,eAAe,CAAC,MAAM,KAAK,CAAC,IAAI,CAAC,cAAc,IAAI,CAChE,oBAAC,mBAAmB,OAAG,CACxB,CACG,CACP;QAEA,+BAA+B,IAAI,CAClC,4BACE,GAAG,EAAE,qBAAqB,EAC1B,IAAI,EAAC,SAAS,EACd,SAAS,EAAC,8BAA8B;YAEvC,UAAU,IAAI,CAAC,CAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,cAAc,CAAA,IAAI,cAAc,IAAI,CAC/D,oBAAC,YAAY,OAAG,CACjB;YACA,eAAe,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CAC/B,oBAAC,mBAAmB,IAAC,GAAG,EAAE,MAAM,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,GAAI,CAC3D,CAAC,CACC,CACN,CACG,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,eAAe,CAAC"}

package/esm/form/combobox/FilteredOptions/FilteredOptionsItem.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+import { ComboboxOption } from "../types.js";
+declare const FilteredOptionsItem: ({ option }: {
+    option: ComboboxOption;
+}) => React.JSX.Element;
+export default FilteredOptionsItem;

package/esm/form/combobox/FilteredOptions/FilteredOptionsItem.js

@@ -0,0 +1,38 @@
+import cl from "clsx";
+import React from "react";
+import { CheckmarkIcon } from "@navikt/aksel-icons";
+import { BodyShort } from "../../../typography/index.js";
+import { useInputContext } from "../Input/Input.context.js";
+import { useSelectedOptionsContext } from "../SelectedOptions/selectedOptionsContext.js";
+import { isInList } from "../combobox-utils.js";
+import filteredOptionsUtil from "./filtered-options-util.js";
+import { useFilteredOptionsContext } from "./filteredOptionsContext.js";
+const FilteredOptionsItem = ({ option }) => {
+    const { inputProps: { id }, size, } = useInputContext();
+    const { setIsMouseLastUsedInputDevice, toggleIsListOpen, activeDecendantId, virtualFocus, } = useFilteredOptionsContext();
+    const { isMultiSelect, maxSelected, selectedOptions, toggleOption } = useSelectedOptionsContext();
+    const isDisabled = (_option) => (maxSelected === null || maxSelected === void 0 ? void 0 : maxSelected.isLimitReached) && !isInList(_option.value, selectedOptions);
+    return (React.createElement("li", { className: cl("navds-combobox__list-item", {
+            "navds-combobox__list-item--focus": activeDecendantId ===
+                filteredOptionsUtil.getOptionId(id, option.label),
+            "navds-combobox__list-item--selected": isInList(option.value, selectedOptions),
+        }), "data-no-focus": isDisabled(option) || undefined, id: filteredOptionsUtil.getOptionId(id, option.label), key: option.label, tabIndex: -1, onMouseMove: () => {
+            if (activeDecendantId !==
+                filteredOptionsUtil.getOptionId(id, option.label)) {
+                virtualFocus.moveFocusToElement(filteredOptionsUtil.getOptionId(id, option.label));
+                setIsMouseLastUsedInputDevice(true);
+            }
+        }, onPointerUp: (event) => {
+            if (isDisabled(option)) {
+                return;
+            }
+            toggleOption(option, event);
+            if (!isMultiSelect && !isInList(option.value, selectedOptions)) {
+                toggleIsListOpen(false);
+            }
+        }, role: "option", "aria-selected": isInList(option.value, selectedOptions), "aria-disabled": isDisabled(option) || undefined },
+        React.createElement(BodyShort, { size: size }, option.label),
+        isInList(option.value, selectedOptions) && React.createElement(CheckmarkIcon, null)));
+};
+export default FilteredOptionsItem;
+//# sourceMappingURL=FilteredOptionsItem.js.map

package/esm/form/combobox/FilteredOptions/FilteredOptionsItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FilteredOptionsItem.js","sourceRoot":"","sources":["../../../../src/form/combobox/FilteredOptions/FilteredOptionsItem.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,MAAM,CAAC;AACtB,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AACpD,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAChD,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AACzD,OAAO,EAAE,yBAAyB,EAAE,MAAM,2CAA2C,CAAC;AACtF,OAAO,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE7C,OAAO,mBAAmB,MAAM,yBAAyB,CAAC;AAC1D,OAAO,EAAE,yBAAyB,EAAE,MAAM,0BAA0B,CAAC;AAErE,MAAM,mBAAmB,GAAG,CAAC,EAAE,MAAM,EAA8B,EAAE,EAAE;IACrE,MAAM,EACJ,UAAU,EAAE,EAAE,EAAE,EAAE,EAClB,IAAI,GACL,GAAG,eAAe,EAAE,CAAC;IACtB,MAAM,EACJ,6BAA6B,EAC7B,gBAAgB,EAChB,iBAAiB,EACjB,YAAY,GACb,GAAG,yBAAyB,EAAE,CAAC;IAChC,MAAM,EAAE,aAAa,EAAE,WAAW,EAAE,eAAe,EAAE,YAAY,EAAE,GACjE,yBAAyB,EAAE,CAAC;IAE9B,MAAM,UAAU,GAAG,CAAC,OAAuB,EAAE,EAAE,CAC7C,CAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,cAAc,KAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,KAAK,EAAE,eAAe,CAAC,CAAC;IAC3E,OAAO,CACL,4BACE,SAAS,EAAE,EAAE,CAAC,2BAA2B,EAAE;YACzC,kCAAkC,EAChC,iBAAiB;gBACjB,mBAAmB,CAAC,WAAW,CAAC,EAAE,EAAE,MAAM,CAAC,KAAK,CAAC;YACnD,qCAAqC,EAAE,QAAQ,CAC7C,MAAM,CAAC,KAAK,EACZ,eAAe,CAChB;SACF,CAAC,mBACa,UAAU,CAAC,MAAM,CAAC,IAAI,SAAS,EAC9C,EAAE,EAAE,mBAAmB,CAAC,WAAW,CAAC,EAAE,EAAE,MAAM,CAAC,KAAK,CAAC,EACrD,GAAG,EAAE,MAAM,CAAC,KAAK,EACjB,QAAQ,EAAE,CAAC,CAAC,EACZ,WAAW,EAAE,GAAG,EAAE;YAChB,IACE,iBAAiB;gBACjB,mBAAmB,CAAC,WAAW,CAAC,EAAE,EAAE,MAAM,CAAC,KAAK,CAAC,EACjD,CAAC;gBACD,YAAY,CAAC,kBAAkB,CAC7B,mBAAmB,CAAC,WAAW,CAAC,EAAE,EAAE,MAAM,CAAC,KAAK,CAAC,CAClD,CAAC;gBACF,6BAA6B,CAAC,IAAI,CAAC,CAAC;YACtC,CAAC;QACH,CAAC,EACD,WAAW,EAAE,CAAC,KAAK,EAAE,EAAE;YACrB,IAAI,UAAU,CAAC,MAAM,CAAC,EAAE,CAAC;gBACvB,OAAO;YACT,CAAC;YACD,YAAY,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC;YAC5B,IAAI,CAAC,aAAa,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,KAAK,EAAE,eAAe,CAAC,EAAE,CAAC;gBAC/D,gBAAgB,CAAC,KAAK,CAAC,CAAC;YAC1B,CAAC;QACH,CAAC,EACD,IAAI,EAAC,QAAQ,mBACE,QAAQ,CAAC,MAAM,CAAC,KAAK,EAAE,eAAe,CAAC,mBACvC,UAAU,CAAC,MAAM,CAAC,IAAI,SAAS;QAE9C,oBAAC,SAAS,IAAC,IAAI,EAAE,IAAI,IAAG,MAAM,CAAC,KAAK,CAAa;QAChD,QAAQ,CAAC,MAAM,CAAC,KAAK,EAAE,eAAe,CAAC,IAAI,oBAAC,aAAa,OAAG,CAC1D,CACN,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,mBAAmB,CAAC"}

package/esm/form/combobox/FilteredOptions/LoadingMessage.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+declare const LoadingMessage: () => React.JSX.Element;
+export default LoadingMessage;

package/esm/form/combobox/FilteredOptions/LoadingMessage.js

@@ -0,0 +1,11 @@
+import React from "react";
+import { Loader } from "../../../loader/index.js";
+import { useInputContext } from "../Input/Input.context.js";
+import filteredOptionsUtil from "./filtered-options-util.js";
+const LoadingMessage = () => {
+    const { inputProps: { id }, } = useInputContext();
+    return (React.createElement("div", { className: "navds-combobox__list-item--loading", id: filteredOptionsUtil.getIsLoadingId(id) },
+        React.createElement(Loader, { title: "S\u00F8ker..." })));
+};
+export default LoadingMessage;
+//# sourceMappingURL=LoadingMessage.js.map

package/esm/form/combobox/FilteredOptions/LoadingMessage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LoadingMessage.js","sourceRoot":"","sources":["../../../../src/form/combobox/FilteredOptions/LoadingMessage.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AACzC,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AACzD,OAAO,mBAAmB,MAAM,yBAAyB,CAAC;AAE1D,MAAM,cAAc,GAAG,GAAG,EAAE;IAC1B,MAAM,EACJ,UAAU,EAAE,EAAE,EAAE,EAAE,GACnB,GAAG,eAAe,EAAE,CAAC;IACtB,OAAO,CACL,6BACE,SAAS,EAAC,oCAAoC,EAC9C,EAAE,EAAE,mBAAmB,CAAC,cAAc,CAAC,EAAE,CAAC;QAE1C,oBAAC,MAAM,IAAC,KAAK,EAAC,eAAU,GAAG,CACvB,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/esm/form/combobox/FilteredOptions/MaxSelectedMessage.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+declare const MaxSelectedMessage: () => React.JSX.Element | null;
+export default MaxSelectedMessage;

package/esm/form/combobox/FilteredOptions/MaxSelectedMessage.js

@@ -0,0 +1,15 @@
+import React from "react";
+import { useInputContext } from "../Input/Input.context.js";
+import { useSelectedOptionsContext } from "../SelectedOptions/selectedOptionsContext.js";
+import filteredOptionsUtil from "./filtered-options-util.js";
+const MaxSelectedMessage = () => {
+    var _a;
+    const { inputProps: { id }, } = useInputContext();
+    const { maxSelected, selectedOptions } = useSelectedOptionsContext();
+    if (!maxSelected) {
+        return null;
+    }
+    return (React.createElement("div", { className: "navds-combobox__list-item--max-selected", id: filteredOptionsUtil.getMaxSelectedOptionsId(id) }, (_a = maxSelected.message) !== null && _a !== void 0 ? _a : `${selectedOptions.length} av ${maxSelected.limit} er valgt.`));
+};
+export default MaxSelectedMessage;
+//# sourceMappingURL=MaxSelectedMessage.js.map

package/esm/form/combobox/FilteredOptions/MaxSelectedMessage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MaxSelectedMessage.js","sourceRoot":"","sources":["../../../../src/form/combobox/FilteredOptions/MaxSelectedMessage.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AACzD,OAAO,EAAE,yBAAyB,EAAE,MAAM,2CAA2C,CAAC;AACtF,OAAO,mBAAmB,MAAM,yBAAyB,CAAC;AAE1D,MAAM,kBAAkB,GAAG,GAAG,EAAE;;IAC9B,MAAM,EACJ,UAAU,EAAE,EAAE,EAAE,EAAE,GACnB,GAAG,eAAe,EAAE,CAAC;IACtB,MAAM,EAAE,WAAW,EAAE,eAAe,EAAE,GAAG,yBAAyB,EAAE,CAAC;IAErE,IAAI,CAAC,WAAW,EAAE,CAAC;QACjB,OAAO,IAAI,CAAC;IACd,CAAC;IAED,OAAO,CACL,6BACE,SAAS,EAAC,yCAAyC,EACnD,EAAE,EAAE,mBAAmB,CAAC,uBAAuB,CAAC,EAAE,CAAC,IAElD,MAAA,WAAW,CAAC,OAAO,mCAClB,GAAG,eAAe,CAAC,MAAM,OAAO,WAAW,CAAC,KAAK,YAAY,CAC3D,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,kBAAkB,CAAC"}

package/esm/form/combobox/FilteredOptions/NoSearchHitsMessage.d.ts

@@ -0,0 +1,3 @@
+import React from "react";
+declare const NoSearchHitsMessage: () => React.JSX.Element;
+export default NoSearchHitsMessage;

package/esm/form/combobox/FilteredOptions/NoSearchHitsMessage.js

@@ -0,0 +1,9 @@
+import React from "react";
+import { useInputContext } from "../Input/Input.context.js";
+import filteredOptionsUtil from "./filtered-options-util.js";
+const NoSearchHitsMessage = () => {
+    const { inputProps: { id }, } = useInputContext();
+    return (React.createElement("div", { className: "navds-combobox__list-item--no-options", id: filteredOptionsUtil.getNoHitsId(id) }, "Ingen s\u00F8ketreff"));
+};
+export default NoSearchHitsMessage;
+//# sourceMappingURL=NoSearchHitsMessage.js.map

package/esm/form/combobox/FilteredOptions/NoSearchHitsMessage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NoSearchHitsMessage.js","sourceRoot":"","sources":["../../../../src/form/combobox/FilteredOptions/NoSearchHitsMessage.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AACzD,OAAO,mBAAmB,MAAM,yBAAyB,CAAC;AAE1D,MAAM,mBAAmB,GAAG,GAAG,EAAE;IAC/B,MAAM,EACJ,UAAU,EAAE,EAAE,EAAE,EAAE,GACnB,GAAG,eAAe,EAAE,CAAC;IACtB,OAAO,CACL,6BACE,SAAS,EAAC,uCAAuC,EACjD,EAAE,EAAE,mBAAmB,CAAC,WAAW,CAAC,EAAE,CAAC,2BAGnC,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,mBAAmB,CAAC"}

package/esm/form/combobox/Input/Input.d.ts

@@ -2,6 +2,7 @@ import React, { InputHTMLAttributes } from "react";
 interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "value" | "disabled"> {
     ref: React.Ref<HTMLInputElement>;
     inputClassName?: string;
+    shouldShowSelectedOptions?: boolean;
     value?: string;
 }
 declare const Input: React.ForwardRefExoticComponent<Omit<InputProps, "ref"> & React.RefAttributes<HTMLInputElement>>;