UNPKG

@navikt/ds-react

Version:

React components from the Norwegian Labour and Welfare Administration.

82 lines 3.88 kB
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; }; import React, { forwardRef } from "react"; import Combobox from "./Combobox.js"; import { FilteredOptionsProvider } from "./FilteredOptions/filteredOptionsContext.js"; import { InputContextProvider } from "./Input/Input.context.js"; import { SelectedOptionsProvider } from "./SelectedOptions/selectedOptionsContext.js"; import { mapToComboboxOptionArray } from "./combobox-utils.js"; import { CustomOptionsProvider } from "./customOptionsContext.js"; /** * A component that allows the user to search in a list of options * * Has options for allowing only one or multiple options to be selected, * or adding new, user-submitted values. * * @see [📝 Documentation](https://aksel.nav.no/komponenter/core/combobox) * * @example * ```jsx * const options = ["apple", "banana", "orange"]; * * return ( * <Combobox * label="Velg en verdi" * options={options} * id="my-combobox" * shouldAutoComplete * /> * ) * ``` */ const ComboboxProvider = forwardRef((props, ref) => { const { allowNewValues = false, children, defaultValue, disabled, readOnly, error, errorId, filteredOptions: externalFilteredOptions, id, isListOpen, isLoading = false, isMultiSelect, onToggleSelected, selectedOptions: externalSelectedOptions, maxSelected, options: externalOptions, value, onChange, onClear, shouldAutocomplete: externalShouldAutocomplete, size } = props, rest = __rest(props, ["allowNewValues", "children", "defaultValue", "disabled", "readOnly", "error", "errorId", "filteredOptions", "id", "isListOpen", "isLoading", "isMultiSelect", "onToggleSelected", "selectedOptions", "maxSelected", "options", "value", "onChange", "onClear", "shouldAutocomplete", "size"]); const options = mapToComboboxOptionArray(externalOptions) || []; const filteredOptions = mapToComboboxOptionArray(externalFilteredOptions); const selectedOptions = mapToComboboxOptionArray(externalSelectedOptions); const userAgent = typeof navigator === "undefined" ? "" : navigator.userAgent; const isFirefoxOnAndroid = userAgent.includes("Android") && userAgent.includes("Firefox/"); const shouldAutocomplete = !isFirefoxOnAndroid && externalShouldAutocomplete; return (React.createElement(InputContextProvider, { value: { defaultValue, description: rest.description, disabled, readOnly, error, errorId, id, value, onChange, onClear, shouldAutocomplete, size, } }, React.createElement(CustomOptionsProvider, { value: { isMultiSelect } }, React.createElement(SelectedOptionsProvider, { value: { allowNewValues, isMultiSelect, selectedOptions, maxSelected, onToggleSelected, options, } }, React.createElement(FilteredOptionsProvider, { value: { allowNewValues, filteredOptions, isListOpen, isLoading, options, } }, React.createElement(Combobox, Object.assign({ ref: ref }, rest), children)))))); }); export default ComboboxProvider; //# sourceMappingURL=ComboboxProvider.js.map