@ndla/ui 30.6.1 → 30.7.0

package/es/LetterFilter/LetterFilter.js

@@ -0,0 +1,57 @@
+import _styled from "@emotion/styled/base";
+/**
+ * Copyright (c) 2022-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+import React, { useMemo } from 'react';
+import { colors, fonts, spacing } from '@ndla/core';
+import { useTranslation } from 'react-i18next';
+import { IconButtonV2 as IconButton } from '@ndla/button';
+import { alphabet } from './alphabet';
+import { jsx as _jsx } from "@emotion/react/jsx-runtime";
+var StyledUL = /*#__PURE__*/_styled("ul", {
+  target: "e1uzf2ke1",
+  label: "StyledUL"
+})("list-style:none;display:flex;flex-direction:row;flex-wrap:wrap;gap:", spacing.xsmall, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkxldHRlckZpbHRlci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBZTBCIiwiZmlsZSI6IkxldHRlckZpbHRlci50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgMjAyMi1wcmVzZW50LCBORExBLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIEdQTHYzIGxpY2Vuc2UgZm91bmQgaW4gdGhlXG4gKiBMSUNFTlNFIGZpbGUgaW4gdGhlIHJvb3QgZGlyZWN0b3J5IG9mIHRoaXMgc291cmNlIHRyZWUuXG4gKlxuICovXG5cbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCBSZWFjdCwgeyB1c2VNZW1vIH0gZnJvbSAncmVhY3QnO1xuaW1wb3J0IHsgY29sb3JzLCBmb250cywgc3BhY2luZyB9IGZyb20gJ0BuZGxhL2NvcmUnO1xuaW1wb3J0IHsgdXNlVHJhbnNsYXRpb24gfSBmcm9tICdyZWFjdC1pMThuZXh0JztcbmltcG9ydCB7IEljb25CdXR0b25WMiBhcyBJY29uQnV0dG9uIH0gZnJvbSAnQG5kbGEvYnV0dG9uJztcbmltcG9ydCB7IGFscGhhYmV0IH0gZnJvbSAnLi9hbHBoYWJldCc7XG5cbmNvbnN0IFN0eWxlZFVMID0gc3R5bGVkLnVsYFxuICBsaXN0LXN0eWxlOiBub25lO1xuICBkaXNwbGF5OiBmbGV4O1xuICBmbGV4LWRpcmVjdGlvbjogcm93O1xuICBmbGV4LXdyYXA6IHdyYXA7XG4gIGdhcDogJHtzcGFjaW5nLnhzbWFsbH07XG5gO1xuXG5jb25zdCBTdHlsZWRCdXR0b24gPSBzdHlsZWQoSWNvbkJ1dHRvbilgXG4gIGRpc3BsYXk6IGZsZXg7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICB3aWR0aDogJHtzcGFjaW5nLm5vcm1hbH07XG4gIGhlaWdodDogJHtzcGFjaW5nLm5vcm1hbH07XG4gIHBhZGRpbmc6IDA7XG4gICR7Zm9udHMuc2l6ZXMoMTgpfTtcbiAgJiYge1xuICAgIGZvbnQtd2VpZ2h0OiAke2ZvbnRzLndlaWdodC5zZW1pYm9sZH07XG4gIH1cblxuICA6ZGlzYWJsZWQge1xuICAgIHBvaW50ZXItZXZlbnRzOiBub25lO1xuICAgIGNvbG9yOiAke2NvbG9ycy5icmFuZC5saWdodH07XG4gIH1cbmA7XG5cbmludGVyZmFjZSBQcm9wcyB7XG4gIHZhbHVlPzogc3RyaW5nIHwgdW5kZWZpbmVkO1xuICBvbkNoYW5nZTogKHZhbHVlPzogc3RyaW5nKSA9PiB2b2lkO1xuICBlbmFibGVkTGV0dGVyczogc3RyaW5nW107XG59XG5cbmNvbnN0IExldHRlckZpbHRlciA9ICh7IHZhbHVlLCBvbkNoYW5nZSwgZW5hYmxlZExldHRlcnMgfTogUHJvcHMpID0+IHtcbiAgY29uc3QgeyB0IH0gPSB1c2VUcmFuc2xhdGlvbigpO1xuICBjb25zdCB1cHBlcmNhc2VMZXR0ZXJzID0gdXNlTWVtbygoKSA9PiBlbmFibGVkTGV0dGVycy5tYXAoKGxldHRlcikgPT4gbGV0dGVyLnRvVXBwZXJDYXNlKCkpLCBbZW5hYmxlZExldHRlcnNdKTtcblxuICByZXR1cm4gKFxuICAgIDxTdHlsZWRVTD5cbiAgICAgIHthbHBoYWJldC5tYXAoKGxldHRlcikgPT4ge1xuICAgICAgICBjb25zdCBkaXNhYmxlZCA9ICF1cHBlcmNhc2VMZXR0ZXJzLmluY2x1ZGVzKGxldHRlci50b1VwcGVyQ2FzZSgpKTtcbiAgICAgICAgY29uc3Qgc2VsZWN0ZWQgPSBsZXR0ZXIudG9VcHBlckNhc2UoKSA9PT0gdmFsdWU/LnRvVXBwZXJDYXNlKCk7XG4gICAgICAgIHJldHVybiAoXG4gICAgICAgICAgPGxpIGtleT17bGV0dGVyfT5cbiAgICAgICAgICAgIDxTdHlsZWRCdXR0b25cbiAgICAgICAgICAgICAgb25DbGljaz17KCkgPT4gKHNlbGVjdGVkID8gb25DaGFuZ2UodW5kZWZpbmVkKSA6IG9uQ2hhbmdlKGxldHRlcikpfVxuICAgICAgICAgICAgICBhcmlhLWxhYmVsPXt0KCdsaXN0dmlldy5maWx0ZXJzLmFscGhhYmV0LmxldHRlckZpbHRlcicsIHsgbGV0dGVyIH0pfVxuICAgICAgICAgICAgICB2YXJpYW50PXshc2VsZWN0ZWQgPyAnZ2hvc3QnIDogdW5kZWZpbmVkfVxuICAgICAgICAgICAgICBjb2xvclRoZW1lPXshc2VsZWN0ZWQgPyAnbGlnaHRlcicgOiAncHJpbWFyeSd9XG4gICAgICAgICAgICAgIGRpc2FibGVkPXtkaXNhYmxlZH1cbiAgICAgICAgICAgICAgc2l6ZT1cInhzbWFsbFwiPlxuICAgICAgICAgICAgICB7bGV0dGVyfVxuICAgICAgICAgICAgPC9TdHlsZWRCdXR0b24+XG4gICAgICAgICAgPC9saT5cbiAgICAgICAgKTtcbiAgICAgIH0pfVxuICAgIDwvU3R5bGVkVUw+XG4gICk7XG59O1xuXG5leHBvcnQgZGVmYXVsdCBMZXR0ZXJGaWx0ZXI7XG4iXX0= */"));
+var StyledButton = /*#__PURE__*/_styled(IconButton, {
+  target: "e1uzf2ke0",
+  label: "StyledButton"
+})("display:flex;align-items:center;justify-content:center;width:", spacing.normal, ";height:", spacing.normal, ";padding:0;", fonts.sizes(18), ";&&{font-weight:", fonts.weight.semibold, ";}:disabled{pointer-events:none;color:", colors.brand.light, ";}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkxldHRlckZpbHRlci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBdUJ1QyIsImZpbGUiOiJMZXR0ZXJGaWx0ZXIudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBDb3B5cmlnaHQgKGMpIDIwMjItcHJlc2VudCwgTkRMQS5cbiAqXG4gKiBUaGlzIHNvdXJjZSBjb2RlIGlzIGxpY2Vuc2VkIHVuZGVyIHRoZSBHUEx2MyBsaWNlbnNlIGZvdW5kIGluIHRoZVxuICogTElDRU5TRSBmaWxlIGluIHRoZSByb290IGRpcmVjdG9yeSBvZiB0aGlzIHNvdXJjZSB0cmVlLlxuICpcbiAqL1xuXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgUmVhY3QsIHsgdXNlTWVtbyB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7IGNvbG9ycywgZm9udHMsIHNwYWNpbmcgfSBmcm9tICdAbmRsYS9jb3JlJztcbmltcG9ydCB7IHVzZVRyYW5zbGF0aW9uIH0gZnJvbSAncmVhY3QtaTE4bmV4dCc7XG5pbXBvcnQgeyBJY29uQnV0dG9uVjIgYXMgSWNvbkJ1dHRvbiB9IGZyb20gJ0BuZGxhL2J1dHRvbic7XG5pbXBvcnQgeyBhbHBoYWJldCB9IGZyb20gJy4vYWxwaGFiZXQnO1xuXG5jb25zdCBTdHlsZWRVTCA9IHN0eWxlZC51bGBcbiAgbGlzdC1zdHlsZTogbm9uZTtcbiAgZGlzcGxheTogZmxleDtcbiAgZmxleC1kaXJlY3Rpb246IHJvdztcbiAgZmxleC13cmFwOiB3cmFwO1xuICBnYXA6ICR7c3BhY2luZy54c21hbGx9O1xuYDtcblxuY29uc3QgU3R5bGVkQnV0dG9uID0gc3R5bGVkKEljb25CdXR0b24pYFxuICBkaXNwbGF5OiBmbGV4O1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgd2lkdGg6ICR7c3BhY2luZy5ub3JtYWx9O1xuICBoZWlnaHQ6ICR7c3BhY2luZy5ub3JtYWx9O1xuICBwYWRkaW5nOiAwO1xuICAke2ZvbnRzLnNpemVzKDE4KX07XG4gICYmIHtcbiAgICBmb250LXdlaWdodDogJHtmb250cy53ZWlnaHQuc2VtaWJvbGR9O1xuICB9XG5cbiAgOmRpc2FibGVkIHtcbiAgICBwb2ludGVyLWV2ZW50czogbm9uZTtcbiAgICBjb2xvcjogJHtjb2xvcnMuYnJhbmQubGlnaHR9O1xuICB9XG5gO1xuXG5pbnRlcmZhY2UgUHJvcHMge1xuICB2YWx1ZT86IHN0cmluZyB8IHVuZGVmaW5lZDtcbiAgb25DaGFuZ2U6ICh2YWx1ZT86IHN0cmluZykgPT4gdm9pZDtcbiAgZW5hYmxlZExldHRlcnM6IHN0cmluZ1tdO1xufVxuXG5jb25zdCBMZXR0ZXJGaWx0ZXIgPSAoeyB2YWx1ZSwgb25DaGFuZ2UsIGVuYWJsZWRMZXR0ZXJzIH06IFByb3BzKSA9PiB7XG4gIGNvbnN0IHsgdCB9ID0gdXNlVHJhbnNsYXRpb24oKTtcbiAgY29uc3QgdXBwZXJjYXNlTGV0dGVycyA9IHVzZU1lbW8oKCkgPT4gZW5hYmxlZExldHRlcnMubWFwKChsZXR0ZXIpID0+IGxldHRlci50b1VwcGVyQ2FzZSgpKSwgW2VuYWJsZWRMZXR0ZXJzXSk7XG5cbiAgcmV0dXJuIChcbiAgICA8U3R5bGVkVUw+XG4gICAgICB7YWxwaGFiZXQubWFwKChsZXR0ZXIpID0+IHtcbiAgICAgICAgY29uc3QgZGlzYWJsZWQgPSAhdXBwZXJjYXNlTGV0dGVycy5pbmNsdWRlcyhsZXR0ZXIudG9VcHBlckNhc2UoKSk7XG4gICAgICAgIGNvbnN0IHNlbGVjdGVkID0gbGV0dGVyLnRvVXBwZXJDYXNlKCkgPT09IHZhbHVlPy50b1VwcGVyQ2FzZSgpO1xuICAgICAgICByZXR1cm4gKFxuICAgICAgICAgIDxsaSBrZXk9e2xldHRlcn0+XG4gICAgICAgICAgICA8U3R5bGVkQnV0dG9uXG4gICAgICAgICAgICAgIG9uQ2xpY2s9eygpID0+IChzZWxlY3RlZCA/IG9uQ2hhbmdlKHVuZGVmaW5lZCkgOiBvbkNoYW5nZShsZXR0ZXIpKX1cbiAgICAgICAgICAgICAgYXJpYS1sYWJlbD17dCgnbGlzdHZpZXcuZmlsdGVycy5hbHBoYWJldC5sZXR0ZXJGaWx0ZXInLCB7IGxldHRlciB9KX1cbiAgICAgICAgICAgICAgdmFyaWFudD17IXNlbGVjdGVkID8gJ2dob3N0JyA6IHVuZGVmaW5lZH1cbiAgICAgICAgICAgICAgY29sb3JUaGVtZT17IXNlbGVjdGVkID8gJ2xpZ2h0ZXInIDogJ3ByaW1hcnknfVxuICAgICAgICAgICAgICBkaXNhYmxlZD17ZGlzYWJsZWR9XG4gICAgICAgICAgICAgIHNpemU9XCJ4c21hbGxcIj5cbiAgICAgICAgICAgICAge2xldHRlcn1cbiAgICAgICAgICAgIDwvU3R5bGVkQnV0dG9uPlxuICAgICAgICAgIDwvbGk+XG4gICAgICAgICk7XG4gICAgICB9KX1cbiAgICA8L1N0eWxlZFVMPlxuICApO1xufTtcblxuZXhwb3J0IGRlZmF1bHQgTGV0dGVyRmlsdGVyO1xuIl19 */"));
+var LetterFilter = function LetterFilter(_ref) {
+  var value = _ref.value,
+    onChange = _ref.onChange,
+    enabledLetters = _ref.enabledLetters;
+  var _useTranslation = useTranslation(),
+    t = _useTranslation.t;
+  var uppercaseLetters = useMemo(function () {
+    return enabledLetters.map(function (letter) {
+      return letter.toUpperCase();
+    });
+  }, [enabledLetters]);
+  return _jsx(StyledUL, {
+    children: alphabet.map(function (letter) {
+      var disabled = !uppercaseLetters.includes(letter.toUpperCase());
+      var selected = letter.toUpperCase() === (value === null || value === void 0 ? void 0 : value.toUpperCase());
+      return _jsx("li", {
+        children: _jsx(StyledButton, {
+          onClick: function onClick() {
+            return selected ? onChange(undefined) : onChange(letter);
+          },
+          "aria-label": t('listview.filters.alphabet.letterFilter', {
+            letter: letter
+          }),
+          variant: !selected ? 'ghost' : undefined,
+          colorTheme: !selected ? 'lighter' : 'primary',
+          disabled: disabled,
+          size: "xsmall",
+          children: letter
+        })
+      }, letter);
+    })
+  });
+};
+export default LetterFilter;

package/es/LetterFilter/LetterFilter.stories.js

@@ -0,0 +1,44 @@
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+/**
+ * Copyright (c) 2022-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+import { useArgs } from '@storybook/client-api';
+import React from 'react';
+import { defaultParameters } from '../../../designmanual/stories/defaults';
+import LetterFilter from './LetterFilter';
+import { jsx as _jsx } from "@emotion/react/jsx-runtime";
+export default {
+  title: 'Enkle komponenter/LetterFilter',
+  component: LetterFilter,
+  parameters: _objectSpread({}, defaultParameters),
+  args: {
+    enabledLetters: ['a', 'c'],
+    onChange: function onChange(value) {}
+  }
+};
+export var LetterFilterStory = function LetterFilterStory(args) {
+  var _useArgs = useArgs(),
+    _useArgs2 = _slicedToArray(_useArgs, 2),
+    updateArgs = _useArgs2[1];
+  return _jsx(LetterFilter, _objectSpread(_objectSpread({}, args), {}, {
+    onChange: function onChange(val) {
+      return updateArgs({
+        value: val
+      });
+    }
+  }));
+};
+LetterFilterStory.storyName = 'LetterFilter';

package/es/LetterFilter/alphabet.js

@@ -0,0 +1,9 @@
+/**
+ * Copyright (c) 2022-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+export var alphabet = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z', 'Æ', 'Ø', 'Å'];

package/es/LetterFilter/index.js

@@ -0,0 +1,10 @@
+/**
+ * Copyright (c) 2022-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+import LetterFilter from './LetterFilter';
+export default LetterFilter;

package/es/index.js

@@ -86,4 +86,5 @@ export { TagSelector } from './TagSelector';
 export { SnackbarProvider, useSnack, BaseSnack, DefaultSnackbar } from './SnackBar';
 export { InfoBlock } from './InfoBlock';
 export { TreeStructure } from './TreeStructure';
-export { SearchField, SearchResultList, SearchResultItem, ActiveFilters, ToggleSearchButton } from './Search';
+export { SearchField, SearchResultList, SearchResultItem, ActiveFilters, ToggleSearchButton } from './Search';
+export { default as LetterFilter } from './LetterFilter';

package/lib/LetterFilter/LetterFilter.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Copyright (c) 2022-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+interface Props {
+    value?: string | undefined;
+    onChange: (value?: string) => void;
+    enabledLetters: string[];
+}
+declare const LetterFilter: ({ value, onChange, enabledLetters }: Props) => import("@emotion/react/jsx-runtime").JSX.Element;
+export default LetterFilter;

package/lib/LetterFilter/LetterFilter.js

@@ -0,0 +1,68 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _base = _interopRequireDefault(require("@emotion/styled/base"));
+var _react = _interopRequireWildcard(require("react"));
+var _core = require("@ndla/core");
+var _reactI18next = require("react-i18next");
+var _button = require("@ndla/button");
+var _alphabet = require("./alphabet");
+var _jsxRuntime = require("@emotion/react/jsx-runtime");
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+/**
+ * Copyright (c) 2022-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+var StyledUL = /*#__PURE__*/(0, _base["default"])("ul", {
+  target: "e1uzf2ke1",
+  label: "StyledUL"
+})("list-style:none;display:flex;flex-direction:row;flex-wrap:wrap;gap:", _core.spacing.xsmall, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkxldHRlckZpbHRlci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBZTBCIiwiZmlsZSI6IkxldHRlckZpbHRlci50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgMjAyMi1wcmVzZW50LCBORExBLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIEdQTHYzIGxpY2Vuc2UgZm91bmQgaW4gdGhlXG4gKiBMSUNFTlNFIGZpbGUgaW4gdGhlIHJvb3QgZGlyZWN0b3J5IG9mIHRoaXMgc291cmNlIHRyZWUuXG4gKlxuICovXG5cbmltcG9ydCBzdHlsZWQgZnJvbSAnQGVtb3Rpb24vc3R5bGVkJztcbmltcG9ydCBSZWFjdCwgeyB1c2VNZW1vIH0gZnJvbSAncmVhY3QnO1xuaW1wb3J0IHsgY29sb3JzLCBmb250cywgc3BhY2luZyB9IGZyb20gJ0BuZGxhL2NvcmUnO1xuaW1wb3J0IHsgdXNlVHJhbnNsYXRpb24gfSBmcm9tICdyZWFjdC1pMThuZXh0JztcbmltcG9ydCB7IEljb25CdXR0b25WMiBhcyBJY29uQnV0dG9uIH0gZnJvbSAnQG5kbGEvYnV0dG9uJztcbmltcG9ydCB7IGFscGhhYmV0IH0gZnJvbSAnLi9hbHBoYWJldCc7XG5cbmNvbnN0IFN0eWxlZFVMID0gc3R5bGVkLnVsYFxuICBsaXN0LXN0eWxlOiBub25lO1xuICBkaXNwbGF5OiBmbGV4O1xuICBmbGV4LWRpcmVjdGlvbjogcm93O1xuICBmbGV4LXdyYXA6IHdyYXA7XG4gIGdhcDogJHtzcGFjaW5nLnhzbWFsbH07XG5gO1xuXG5jb25zdCBTdHlsZWRCdXR0b24gPSBzdHlsZWQoSWNvbkJ1dHRvbilgXG4gIGRpc3BsYXk6IGZsZXg7XG4gIGFsaWduLWl0ZW1zOiBjZW50ZXI7XG4gIGp1c3RpZnktY29udGVudDogY2VudGVyO1xuICB3aWR0aDogJHtzcGFjaW5nLm5vcm1hbH07XG4gIGhlaWdodDogJHtzcGFjaW5nLm5vcm1hbH07XG4gIHBhZGRpbmc6IDA7XG4gICR7Zm9udHMuc2l6ZXMoMTgpfTtcbiAgJiYge1xuICAgIGZvbnQtd2VpZ2h0OiAke2ZvbnRzLndlaWdodC5zZW1pYm9sZH07XG4gIH1cblxuICA6ZGlzYWJsZWQge1xuICAgIHBvaW50ZXItZXZlbnRzOiBub25lO1xuICAgIGNvbG9yOiAke2NvbG9ycy5icmFuZC5saWdodH07XG4gIH1cbmA7XG5cbmludGVyZmFjZSBQcm9wcyB7XG4gIHZhbHVlPzogc3RyaW5nIHwgdW5kZWZpbmVkO1xuICBvbkNoYW5nZTogKHZhbHVlPzogc3RyaW5nKSA9PiB2b2lkO1xuICBlbmFibGVkTGV0dGVyczogc3RyaW5nW107XG59XG5cbmNvbnN0IExldHRlckZpbHRlciA9ICh7IHZhbHVlLCBvbkNoYW5nZSwgZW5hYmxlZExldHRlcnMgfTogUHJvcHMpID0+IHtcbiAgY29uc3QgeyB0IH0gPSB1c2VUcmFuc2xhdGlvbigpO1xuICBjb25zdCB1cHBlcmNhc2VMZXR0ZXJzID0gdXNlTWVtbygoKSA9PiBlbmFibGVkTGV0dGVycy5tYXAoKGxldHRlcikgPT4gbGV0dGVyLnRvVXBwZXJDYXNlKCkpLCBbZW5hYmxlZExldHRlcnNdKTtcblxuICByZXR1cm4gKFxuICAgIDxTdHlsZWRVTD5cbiAgICAgIHthbHBoYWJldC5tYXAoKGxldHRlcikgPT4ge1xuICAgICAgICBjb25zdCBkaXNhYmxlZCA9ICF1cHBlcmNhc2VMZXR0ZXJzLmluY2x1ZGVzKGxldHRlci50b1VwcGVyQ2FzZSgpKTtcbiAgICAgICAgY29uc3Qgc2VsZWN0ZWQgPSBsZXR0ZXIudG9VcHBlckNhc2UoKSA9PT0gdmFsdWU/LnRvVXBwZXJDYXNlKCk7XG4gICAgICAgIHJldHVybiAoXG4gICAgICAgICAgPGxpIGtleT17bGV0dGVyfT5cbiAgICAgICAgICAgIDxTdHlsZWRCdXR0b25cbiAgICAgICAgICAgICAgb25DbGljaz17KCkgPT4gKHNlbGVjdGVkID8gb25DaGFuZ2UodW5kZWZpbmVkKSA6IG9uQ2hhbmdlKGxldHRlcikpfVxuICAgICAgICAgICAgICBhcmlhLWxhYmVsPXt0KCdsaXN0dmlldy5maWx0ZXJzLmFscGhhYmV0LmxldHRlckZpbHRlcicsIHsgbGV0dGVyIH0pfVxuICAgICAgICAgICAgICB2YXJpYW50PXshc2VsZWN0ZWQgPyAnZ2hvc3QnIDogdW5kZWZpbmVkfVxuICAgICAgICAgICAgICBjb2xvclRoZW1lPXshc2VsZWN0ZWQgPyAnbGlnaHRlcicgOiAncHJpbWFyeSd9XG4gICAgICAgICAgICAgIGRpc2FibGVkPXtkaXNhYmxlZH1cbiAgICAgICAgICAgICAgc2l6ZT1cInhzbWFsbFwiPlxuICAgICAgICAgICAgICB7bGV0dGVyfVxuICAgICAgICAgICAgPC9TdHlsZWRCdXR0b24+XG4gICAgICAgICAgPC9saT5cbiAgICAgICAgKTtcbiAgICAgIH0pfVxuICAgIDwvU3R5bGVkVUw+XG4gICk7XG59O1xuXG5leHBvcnQgZGVmYXVsdCBMZXR0ZXJGaWx0ZXI7XG4iXX0= */"));
+var StyledButton = /*#__PURE__*/(0, _base["default"])(_button.IconButtonV2, {
+  target: "e1uzf2ke0",
+  label: "StyledButton"
+})("display:flex;align-items:center;justify-content:center;width:", _core.spacing.normal, ";height:", _core.spacing.normal, ";padding:0;", _core.fonts.sizes(18), ";&&{font-weight:", _core.fonts.weight.semibold, ";}:disabled{pointer-events:none;color:", _core.colors.brand.light, ";}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkxldHRlckZpbHRlci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBdUJ1QyIsImZpbGUiOiJMZXR0ZXJGaWx0ZXIudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBDb3B5cmlnaHQgKGMpIDIwMjItcHJlc2VudCwgTkRMQS5cbiAqXG4gKiBUaGlzIHNvdXJjZSBjb2RlIGlzIGxpY2Vuc2VkIHVuZGVyIHRoZSBHUEx2MyBsaWNlbnNlIGZvdW5kIGluIHRoZVxuICogTElDRU5TRSBmaWxlIGluIHRoZSByb290IGRpcmVjdG9yeSBvZiB0aGlzIHNvdXJjZSB0cmVlLlxuICpcbiAqL1xuXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgUmVhY3QsIHsgdXNlTWVtbyB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7IGNvbG9ycywgZm9udHMsIHNwYWNpbmcgfSBmcm9tICdAbmRsYS9jb3JlJztcbmltcG9ydCB7IHVzZVRyYW5zbGF0aW9uIH0gZnJvbSAncmVhY3QtaTE4bmV4dCc7XG5pbXBvcnQgeyBJY29uQnV0dG9uVjIgYXMgSWNvbkJ1dHRvbiB9IGZyb20gJ0BuZGxhL2J1dHRvbic7XG5pbXBvcnQgeyBhbHBoYWJldCB9IGZyb20gJy4vYWxwaGFiZXQnO1xuXG5jb25zdCBTdHlsZWRVTCA9IHN0eWxlZC51bGBcbiAgbGlzdC1zdHlsZTogbm9uZTtcbiAgZGlzcGxheTogZmxleDtcbiAgZmxleC1kaXJlY3Rpb246IHJvdztcbiAgZmxleC13cmFwOiB3cmFwO1xuICBnYXA6ICR7c3BhY2luZy54c21hbGx9O1xuYDtcblxuY29uc3QgU3R5bGVkQnV0dG9uID0gc3R5bGVkKEljb25CdXR0b24pYFxuICBkaXNwbGF5OiBmbGV4O1xuICBhbGlnbi1pdGVtczogY2VudGVyO1xuICBqdXN0aWZ5LWNvbnRlbnQ6IGNlbnRlcjtcbiAgd2lkdGg6ICR7c3BhY2luZy5ub3JtYWx9O1xuICBoZWlnaHQ6ICR7c3BhY2luZy5ub3JtYWx9O1xuICBwYWRkaW5nOiAwO1xuICAke2ZvbnRzLnNpemVzKDE4KX07XG4gICYmIHtcbiAgICBmb250LXdlaWdodDogJHtmb250cy53ZWlnaHQuc2VtaWJvbGR9O1xuICB9XG5cbiAgOmRpc2FibGVkIHtcbiAgICBwb2ludGVyLWV2ZW50czogbm9uZTtcbiAgICBjb2xvcjogJHtjb2xvcnMuYnJhbmQubGlnaHR9O1xuICB9XG5gO1xuXG5pbnRlcmZhY2UgUHJvcHMge1xuICB2YWx1ZT86IHN0cmluZyB8IHVuZGVmaW5lZDtcbiAgb25DaGFuZ2U6ICh2YWx1ZT86IHN0cmluZykgPT4gdm9pZDtcbiAgZW5hYmxlZExldHRlcnM6IHN0cmluZ1tdO1xufVxuXG5jb25zdCBMZXR0ZXJGaWx0ZXIgPSAoeyB2YWx1ZSwgb25DaGFuZ2UsIGVuYWJsZWRMZXR0ZXJzIH06IFByb3BzKSA9PiB7XG4gIGNvbnN0IHsgdCB9ID0gdXNlVHJhbnNsYXRpb24oKTtcbiAgY29uc3QgdXBwZXJjYXNlTGV0dGVycyA9IHVzZU1lbW8oKCkgPT4gZW5hYmxlZExldHRlcnMubWFwKChsZXR0ZXIpID0+IGxldHRlci50b1VwcGVyQ2FzZSgpKSwgW2VuYWJsZWRMZXR0ZXJzXSk7XG5cbiAgcmV0dXJuIChcbiAgICA8U3R5bGVkVUw+XG4gICAgICB7YWxwaGFiZXQubWFwKChsZXR0ZXIpID0+IHtcbiAgICAgICAgY29uc3QgZGlzYWJsZWQgPSAhdXBwZXJjYXNlTGV0dGVycy5pbmNsdWRlcyhsZXR0ZXIudG9VcHBlckNhc2UoKSk7XG4gICAgICAgIGNvbnN0IHNlbGVjdGVkID0gbGV0dGVyLnRvVXBwZXJDYXNlKCkgPT09IHZhbHVlPy50b1VwcGVyQ2FzZSgpO1xuICAgICAgICByZXR1cm4gKFxuICAgICAgICAgIDxsaSBrZXk9e2xldHRlcn0+XG4gICAgICAgICAgICA8U3R5bGVkQnV0dG9uXG4gICAgICAgICAgICAgIG9uQ2xpY2s9eygpID0+IChzZWxlY3RlZCA/IG9uQ2hhbmdlKHVuZGVmaW5lZCkgOiBvbkNoYW5nZShsZXR0ZXIpKX1cbiAgICAgICAgICAgICAgYXJpYS1sYWJlbD17dCgnbGlzdHZpZXcuZmlsdGVycy5hbHBoYWJldC5sZXR0ZXJGaWx0ZXInLCB7IGxldHRlciB9KX1cbiAgICAgICAgICAgICAgdmFyaWFudD17IXNlbGVjdGVkID8gJ2dob3N0JyA6IHVuZGVmaW5lZH1cbiAgICAgICAgICAgICAgY29sb3JUaGVtZT17IXNlbGVjdGVkID8gJ2xpZ2h0ZXInIDogJ3ByaW1hcnknfVxuICAgICAgICAgICAgICBkaXNhYmxlZD17ZGlzYWJsZWR9XG4gICAgICAgICAgICAgIHNpemU9XCJ4c21hbGxcIj5cbiAgICAgICAgICAgICAge2xldHRlcn1cbiAgICAgICAgICAgIDwvU3R5bGVkQnV0dG9uPlxuICAgICAgICAgIDwvbGk+XG4gICAgICAgICk7XG4gICAgICB9KX1cbiAgICA8L1N0eWxlZFVMPlxuICApO1xufTtcblxuZXhwb3J0IGRlZmF1bHQgTGV0dGVyRmlsdGVyO1xuIl19 */"));
+var LetterFilter = function LetterFilter(_ref) {
+  var value = _ref.value,
+    onChange = _ref.onChange,
+    enabledLetters = _ref.enabledLetters;
+  var _useTranslation = (0, _reactI18next.useTranslation)(),
+    t = _useTranslation.t;
+  var uppercaseLetters = (0, _react.useMemo)(function () {
+    return enabledLetters.map(function (letter) {
+      return letter.toUpperCase();
+    });
+  }, [enabledLetters]);
+  return (0, _jsxRuntime.jsx)(StyledUL, {
+    children: _alphabet.alphabet.map(function (letter) {
+      var disabled = !uppercaseLetters.includes(letter.toUpperCase());
+      var selected = letter.toUpperCase() === (value === null || value === void 0 ? void 0 : value.toUpperCase());
+      return (0, _jsxRuntime.jsx)("li", {
+        children: (0, _jsxRuntime.jsx)(StyledButton, {
+          onClick: function onClick() {
+            return selected ? onChange(undefined) : onChange(letter);
+          },
+          "aria-label": t('listview.filters.alphabet.letterFilter', {
+            letter: letter
+          }),
+          variant: !selected ? 'ghost' : undefined,
+          colorTheme: !selected ? 'lighter' : 'primary',
+          disabled: disabled,
+          size: "xsmall",
+          children: letter
+        })
+      }, letter);
+    })
+  });
+};
+var _default = LetterFilter;
+exports["default"] = _default;

package/lib/LetterFilter/LetterFilter.stories.js

@@ -0,0 +1,45 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.LetterFilterStory = void 0;
+var _clientApi = require("@storybook/client-api");
+var _react = _interopRequireDefault(require("react"));
+var _defaults = require("../../../designmanual/stories/defaults");
+var _LetterFilter = _interopRequireDefault(require("./LetterFilter"));
+var _jsxRuntime = require("@emotion/react/jsx-runtime");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+var _default = {
+  title: 'Enkle komponenter/LetterFilter',
+  component: _LetterFilter["default"],
+  parameters: _objectSpread({}, _defaults.defaultParameters),
+  args: {
+    enabledLetters: ['a', 'c'],
+    onChange: function onChange(value) {}
+  }
+};
+exports["default"] = _default;
+var LetterFilterStory = function LetterFilterStory(args) {
+  var _useArgs = (0, _clientApi.useArgs)(),
+    _useArgs2 = _slicedToArray(_useArgs, 2),
+    updateArgs = _useArgs2[1];
+  return (0, _jsxRuntime.jsx)(_LetterFilter["default"], _objectSpread(_objectSpread({}, args), {}, {
+    onChange: function onChange(val) {
+      return updateArgs({
+        value: val
+      });
+    }
+  }));
+};
+exports.LetterFilterStory = LetterFilterStory;
+LetterFilterStory.storyName = 'LetterFilter';

package/lib/LetterFilter/alphabet.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Copyright (c) 2022-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+export declare const alphabet: string[];

package/lib/LetterFilter/alphabet.js

@@ -0,0 +1,16 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.alphabet = void 0;
+/**
+ * Copyright (c) 2022-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+var alphabet = ['A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z', 'Æ', 'Ø', 'Å'];
+exports.alphabet = alphabet;

package/lib/LetterFilter/index.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Copyright (c) 2022-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+import LetterFilter from './LetterFilter';
+export default LetterFilter;

package/lib/LetterFilter/index.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _LetterFilter = _interopRequireDefault(require("./LetterFilter"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+/**
+ * Copyright (c) 2022-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+var _default = _LetterFilter["default"];
+exports["default"] = _default;

package/lib/User/apiTypes.d.ts

@@ -65,5 +65,6 @@ export interface FeideUser {
 export interface FeideUserApiType extends FeideUser {
     groups: FeideGroup[];
     primarySchool?: FeideGroup;
+    baseOrg?: FeideGroup;
 }
 export {};

package/lib/index.d.ts

@@ -95,3 +95,4 @@ export { InfoBlock } from './InfoBlock';
 export { TreeStructure } from './TreeStructure';
 export type { FolderType, TreeStructureProps } from './TreeStructure';
 export { SearchField, SearchResultList, SearchResultItem, ActiveFilters, ToggleSearchButton } from './Search';
+export { default as LetterFilter } from './LetterFilter';

package/lib/index.js

@@ -199,7 +199,8 @@ var _exportNames = {
   SearchResultList: true,
   SearchResultItem: true,
   ActiveFilters: true,
-  ToggleSearchButton: true
+  ToggleSearchButton: true,
+  LetterFilter: true
 };
 Object.defineProperty(exports, "AboutNdlaFilm", {
   enumerable: true,
@@ -759,6 +760,12 @@ Object.defineProperty(exports, "LearningPathWrapper", {
     return _LearningPaths.LearningPathWrapper;
   }
 });
+Object.defineProperty(exports, "LetterFilter", {
+  enumerable: true,
+  get: function get() {
+    return _LetterFilter["default"];
+  }
+});
 Object.defineProperty(exports, "ListResource", {
   enumerable: true,
   get: function get() {
@@ -1458,6 +1465,7 @@ var _SnackBar = require("./SnackBar");
 var _InfoBlock = require("./InfoBlock");
 var _TreeStructure = require("./TreeStructure");
 var _Search = require("./Search");
+var _LetterFilter = _interopRequireDefault(require("./LetterFilter"));
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ndla/ui",
-  "version": "30.6.1",
+  "version": "30.7.0",
   "description": "UI component library for NDLA.",
   "license": "GPL-3.0",
   "main": "lib/index.js",
@@ -86,5 +86,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "f546c06948084793c19a88dffeaea8da60e854bc"
+  "gitHead": "ca95292ccece036a5da6c3d4b5c494b35171a71f"
 }

package/src/LetterFilter/LetterFilter.stories.tsx

@@ -0,0 +1,33 @@
+/**
+ * Copyright (c) 2022-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+import { ComponentStory, ComponentMeta } from '@storybook/react';
+import { useArgs } from '@storybook/client-api';
+import React from 'react';
+import { defaultParameters } from '../../../designmanual/stories/defaults';
+import LetterFilter from './LetterFilter';
+
+export default {
+  title: 'Enkle komponenter/LetterFilter',
+  component: LetterFilter,
+  parameters: {
+    ...defaultParameters,
+  },
+  args: {
+    enabledLetters: ['a', 'c'],
+    onChange: (value?: string) => {},
+  },
+} as ComponentMeta<typeof LetterFilter>;
+
+export const LetterFilterStory: ComponentStory<typeof LetterFilter> = (args) => {
+  const [, updateArgs] = useArgs();
+
+  return <LetterFilter {...args} onChange={(val) => updateArgs({ value: val })} />;
+};
+
+LetterFilterStory.storyName = 'LetterFilter';

package/src/LetterFilter/LetterFilter.tsx

@@ -0,0 +1,75 @@
+/**
+ * Copyright (c) 2022-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+import styled from '@emotion/styled';
+import React, { useMemo } from 'react';
+import { colors, fonts, spacing } from '@ndla/core';
+import { useTranslation } from 'react-i18next';
+import { IconButtonV2 as IconButton } from '@ndla/button';
+import { alphabet } from './alphabet';
+
+const StyledUL = styled.ul`
+  list-style: none;
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  gap: ${spacing.xsmall};
+`;
+
+const StyledButton = styled(IconButton)`
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: ${spacing.normal};
+  height: ${spacing.normal};
+  padding: 0;
+  ${fonts.sizes(18)};
+  && {
+    font-weight: ${fonts.weight.semibold};
+  }
+
+  :disabled {
+    pointer-events: none;
+    color: ${colors.brand.light};
+  }
+`;
+
+interface Props {
+  value?: string | undefined;
+  onChange: (value?: string) => void;
+  enabledLetters: string[];
+}
+
+const LetterFilter = ({ value, onChange, enabledLetters }: Props) => {
+  const { t } = useTranslation();
+  const uppercaseLetters = useMemo(() => enabledLetters.map((letter) => letter.toUpperCase()), [enabledLetters]);
+
+  return (
+    <StyledUL>
+      {alphabet.map((letter) => {
+        const disabled = !uppercaseLetters.includes(letter.toUpperCase());
+        const selected = letter.toUpperCase() === value?.toUpperCase();
+        return (
+          <li key={letter}>
+            <StyledButton
+              onClick={() => (selected ? onChange(undefined) : onChange(letter))}
+              aria-label={t('listview.filters.alphabet.letterFilter', { letter })}
+              variant={!selected ? 'ghost' : undefined}
+              colorTheme={!selected ? 'lighter' : 'primary'}
+              disabled={disabled}
+              size="xsmall">
+              {letter}
+            </StyledButton>
+          </li>
+        );
+      })}
+    </StyledUL>
+  );
+};
+
+export default LetterFilter;

package/src/LetterFilter/alphabet.ts

@@ -0,0 +1,39 @@
+/**
+ * Copyright (c) 2022-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+export const alphabet = [
+  'A',
+  'B',
+  'C',
+  'D',
+  'E',
+  'F',
+  'G',
+  'H',
+  'I',
+  'J',
+  'K',
+  'L',
+  'M',
+  'N',
+  'O',
+  'P',
+  'Q',
+  'R',
+  'S',
+  'T',
+  'U',
+  'V',
+  'W',
+  'X',
+  'Y',
+  'Z',
+  'Æ',
+  'Ø',
+  'Å',
+];

package/src/LetterFilter/index.ts

@@ -0,0 +1,11 @@
+/**
+ * Copyright (c) 2022-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+import LetterFilter from './LetterFilter';
+
+export default LetterFilter;

package/src/User/apiTypes.ts

@@ -80,4 +80,5 @@ export interface FeideUser {
 export interface FeideUserApiType extends FeideUser {
   groups: FeideGroup[];
   primarySchool?: FeideGroup;
+  baseOrg?: FeideGroup;
 }

package/src/index.ts

@@ -254,3 +254,4 @@ export { TreeStructure } from './TreeStructure';
 export type { FolderType, TreeStructureProps } from './TreeStructure';
 
 export { SearchField, SearchResultList, SearchResultItem, ActiveFilters, ToggleSearchButton } from './Search';
+export { default as LetterFilter } from './LetterFilter';