@ndla/ui 19.1.1 → 20.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (98) hide show
  1. package/README.md +1 -1
  2. package/es/Masthead/Masthead.js +1 -0
  3. package/es/Messages/MessageBanner.js +3 -3
  4. package/es/MyNdla/Resource/FolderInput.js +29 -36
  5. package/es/NDLAFilm/FilmSlideshow.js +8 -8
  6. package/es/Resource/ListResource.js +6 -6
  7. package/es/Search/LoadingWrapper.js +2 -2
  8. package/es/Search/SearchResult.js +1 -1
  9. package/es/SearchTypeResult/SearchTypeResult.js +3 -3
  10. package/es/TopicMenu/TopicMenu.js +14 -1
  11. package/es/TreeStructure/FolderItem.js +54 -38
  12. package/es/TreeStructure/FolderItems.js +29 -35
  13. package/es/TreeStructure/FolderNameInput.js +12 -16
  14. package/es/TreeStructure/TreeStructure.js +64 -91
  15. package/es/TreeStructure/arrowNavigation.js +44 -0
  16. package/es/TreeStructure/helperFunctions.js +41 -35
  17. package/es/all.css +1 -1
  18. package/es/index.js +0 -1
  19. package/es/locale/messages-en.js +4 -1
  20. package/es/locale/messages-nb.js +4 -1
  21. package/es/locale/messages-nn.js +4 -1
  22. package/es/locale/messages-se.js +4 -1
  23. package/es/locale/messages-sma.js +4 -1
  24. package/lib/Masthead/Masthead.js +1 -0
  25. package/lib/Messages/MessageBanner.js +3 -3
  26. package/lib/MyNdla/Resource/FolderInput.d.ts +2 -2
  27. package/lib/MyNdla/Resource/FolderInput.js +26 -33
  28. package/lib/NDLAFilm/FilmSlideshow.js +10 -10
  29. package/lib/Resource/ListResource.js +6 -6
  30. package/lib/Search/LoadingWrapper.js +3 -3
  31. package/lib/Search/SearchResult.js +2 -2
  32. package/lib/SearchTypeResult/SearchTypeResult.js +4 -4
  33. package/lib/TopicMenu/TopicMenu.js +14 -1
  34. package/lib/TreeStructure/FolderItem.d.ts +6 -3
  35. package/lib/TreeStructure/FolderItem.js +55 -38
  36. package/lib/TreeStructure/FolderItems.d.ts +1 -1
  37. package/lib/TreeStructure/FolderItems.js +29 -35
  38. package/lib/TreeStructure/FolderNameInput.d.ts +3 -2
  39. package/lib/TreeStructure/FolderNameInput.js +13 -17
  40. package/lib/TreeStructure/TreeStructure.d.ts +1 -6
  41. package/lib/TreeStructure/TreeStructure.js +63 -92
  42. package/lib/TreeStructure/TreeStructure.types.d.ts +13 -20
  43. package/lib/TreeStructure/arrowNavigation.d.ts +9 -0
  44. package/lib/TreeStructure/arrowNavigation.js +54 -0
  45. package/lib/TreeStructure/helperFunctions.d.ts +3 -4
  46. package/lib/TreeStructure/helperFunctions.js +45 -35
  47. package/lib/all.css +1 -1
  48. package/lib/index.d.ts +0 -1
  49. package/lib/index.js +0 -9
  50. package/lib/locale/messages-en.d.ts +3 -0
  51. package/lib/locale/messages-en.js +4 -1
  52. package/lib/locale/messages-nb.d.ts +3 -0
  53. package/lib/locale/messages-nb.js +4 -1
  54. package/lib/locale/messages-nn.d.ts +3 -0
  55. package/lib/locale/messages-nn.js +4 -1
  56. package/lib/locale/messages-se.d.ts +3 -0
  57. package/lib/locale/messages-se.js +4 -1
  58. package/lib/locale/messages-sma.d.ts +3 -0
  59. package/lib/locale/messages-sma.js +4 -1
  60. package/package.json +14 -13
  61. package/src/Masthead/Masthead.tsx +4 -1
  62. package/src/Messages/MessageBanner.tsx +1 -1
  63. package/src/MyNdla/Resource/FolderInput.tsx +41 -44
  64. package/src/NDLAFilm/FilmSlideshow.tsx +1 -1
  65. package/src/Resource/ListResource.tsx +1 -0
  66. package/src/Search/LoadingWrapper.tsx +1 -1
  67. package/src/Search/SearchResult.jsx +1 -1
  68. package/src/SearchTypeResult/SearchTypeResult.tsx +1 -1
  69. package/src/TopicMenu/TopicMenu.jsx +15 -2
  70. package/src/TreeStructure/FolderItem.tsx +63 -40
  71. package/src/TreeStructure/FolderItems.tsx +26 -19
  72. package/src/TreeStructure/FolderNameInput.tsx +10 -12
  73. package/src/TreeStructure/TreeStructure.tsx +56 -71
  74. package/src/TreeStructure/TreeStructure.types.ts +13 -17
  75. package/src/TreeStructure/arrowNavigation.ts +53 -0
  76. package/src/TreeStructure/helperFunctions.ts +17 -25
  77. package/src/index.ts +0 -2
  78. package/src/locale/messages-en.ts +3 -0
  79. package/src/locale/messages-nb.ts +3 -0
  80. package/src/locale/messages-nn.ts +3 -0
  81. package/src/locale/messages-se.ts +3 -0
  82. package/src/locale/messages-sma.ts +3 -0
  83. package/es/Spinner/Spinner.js +0 -42
  84. package/es/Spinner/index.js +0 -2
  85. package/es/TreeStructure/keyboardNavigation/keyboardNavigation.js +0 -194
  86. package/es/TreeStructure/keyboardNavigation/keyboardNavigation.types.js +0 -0
  87. package/lib/Spinner/Spinner.d.ts +0 -16
  88. package/lib/Spinner/Spinner.js +0 -54
  89. package/lib/Spinner/index.d.ts +0 -2
  90. package/lib/Spinner/index.js +0 -13
  91. package/lib/TreeStructure/keyboardNavigation/keyboardNavigation.d.ts +0 -11
  92. package/lib/TreeStructure/keyboardNavigation/keyboardNavigation.js +0 -198
  93. package/lib/TreeStructure/keyboardNavigation/keyboardNavigation.types.d.ts +0 -26
  94. package/lib/TreeStructure/keyboardNavigation/keyboardNavigation.types.js +0 -1
  95. package/src/Spinner/Spinner.tsx +0 -46
  96. package/src/Spinner/index.ts +0 -3
  97. package/src/TreeStructure/keyboardNavigation/keyboardNavigation.ts +0 -161
  98. package/src/TreeStructure/keyboardNavigation/keyboardNavigation.types.ts +0 -28
@@ -1,12 +1,12 @@
1
1
  import { FolderStructureProps } from './TreeStructure.types';
2
2
 
3
- const getPathOfFolder = (data: FolderStructureProps[], findId: string): string[] => {
4
- const paths = (dataChildren: FolderStructureProps[], path: string[]): string[] => {
5
- for (const { id, data: dataChildrenSub } of dataChildren) {
3
+ export const getPathOfFolder = (data: FolderStructureProps[], findId: string): string[] => {
4
+ const paths = (folders: FolderStructureProps[], path: string[]): string[] => {
5
+ for (const { id, subfolders } of folders) {
6
6
  if (id === findId) {
7
7
  return [...path, id];
8
- } else if (dataChildrenSub?.length) {
9
- return paths(dataChildrenSub, [...path, id]);
8
+ } else if (subfolders?.length) {
9
+ return paths(subfolders, [...path, id]);
10
10
  }
11
11
  }
12
12
  return [];
@@ -14,33 +14,18 @@ const getPathOfFolder = (data: FolderStructureProps[], findId: string): string[]
14
14
  return paths(data, []);
15
15
  };
16
16
 
17
- const getIdPathsOfFolder = (data: FolderStructureProps[], findId: string): number[] => {
18
- let currentPath: number[] = [];
19
- const paths = (dataChildren: FolderStructureProps[], path: number[]) => {
20
- dataChildren.forEach(({ id, data: dataChildrenSub }, _index) => {
21
- if (id === findId) {
22
- currentPath = [...path, _index];
23
- } else if (dataChildrenSub?.length) {
24
- paths(dataChildrenSub, [...path, _index]);
25
- }
26
- });
27
- };
28
- paths(data, []);
29
- return currentPath;
30
- };
31
-
32
- const getFolderName = (data: FolderStructureProps[], findId: string | undefined): string | undefined => {
17
+ export const getFolderName = (data: FolderStructureProps[], findId: string | undefined): string | undefined => {
33
18
  if (!findId) {
34
19
  return undefined;
35
20
  }
36
21
  let folderName: string | undefined;
37
22
  const paths = (dataChildren: FolderStructureProps[]) => {
38
- dataChildren.some(({ id, name, data: dataChildrenSub }, _index) => {
23
+ dataChildren.some(({ id, name, subfolders }, _index) => {
39
24
  if (id === findId) {
40
25
  folderName = name;
41
26
  return true;
42
- } else if (dataChildrenSub?.length) {
43
- return paths(dataChildrenSub);
27
+ } else if (subfolders?.length) {
28
+ return paths(subfolders);
44
29
  }
45
30
  return false;
46
31
  });
@@ -49,4 +34,11 @@ const getFolderName = (data: FolderStructureProps[], findId: string | undefined)
49
34
  return folderName;
50
35
  };
51
36
 
52
- export { getPathOfFolder, getIdPathsOfFolder, getFolderName };
37
+ export const flattenFolders = (folders: FolderStructureProps[], openFolders?: string[]): FolderStructureProps[] => {
38
+ return folders.reduce((acc, { subfolders, id, ...rest }) => {
39
+ if (!subfolders || (openFolders && !openFolders.includes(id))) {
40
+ return acc.concat({ subfolders, id, ...rest });
41
+ }
42
+ return acc.concat({ subfolders, id, ...rest }, flattenFolders(subfolders, openFolders));
43
+ }, [] as FolderStructureProps[]);
44
+ };
package/src/index.ts CHANGED
@@ -109,8 +109,6 @@ export {
109
109
  } from './LearningPaths';
110
110
  export { Translation, TranslationLine, TranslationBox } from './Translation';
111
111
 
112
- export { default as Spinner } from './Spinner';
113
-
114
112
  export { default as SearchResultSleeve } from './Search/SearchResultSleeve';
115
113
 
116
114
  export { default as ContentTypeResult } from './Search/ContentTypeResult';
@@ -861,8 +861,10 @@ const messages = {
861
861
  open: 'Open menu',
862
862
  close: 'Close menu',
863
863
  },
864
+ cancel: 'Cancel',
864
865
  close: 'Close',
865
866
  title: 'Title',
867
+ save: 'Save',
866
868
  image: {
867
869
  altText: 'Alt-text',
868
870
  caption: 'Caption',
@@ -993,6 +995,7 @@ const messages = {
993
995
  folder: 'Folder',
994
996
  delete: 'Delete',
995
997
  edit: 'Edit',
998
+ missingName: 'Folder name required',
996
999
  },
997
1000
  confirmDeleteFolder: 'Are you sure you want to delete this folder? This process cannot be undone.',
998
1001
  confirmDeleteTag: 'Are you sure you want to delete this tag? This process cannot be undone.',
@@ -861,6 +861,8 @@ const messages = {
861
861
  },
862
862
  close: 'Lukk',
863
863
  title: 'Tittel',
864
+ cancel: 'Avbryt',
865
+ save: 'Lagre',
864
866
  image: {
865
867
  altText: 'Alt-tekst',
866
868
  caption: 'Bildetekst',
@@ -991,6 +993,7 @@ const messages = {
991
993
  folder: 'Mappe',
992
994
  delete: 'Slett',
993
995
  edit: 'Rediger',
996
+ missingName: 'Mappenavn er påkrevd',
994
997
  },
995
998
  confirmDeleteFolder: 'Er du sikker på at du vil slette mappen? Denne handlingen kan ikke angres.',
996
999
  confirmDeleteTag: 'Er du sikker på at du vil slette tag? Denne handlingen kan ikke angres.',
@@ -860,8 +860,10 @@ const messages = {
860
860
  open: 'Åpne meny',
861
861
  close: 'Lukk meny',
862
862
  },
863
+ cancel: 'Avbryt',
863
864
  close: 'Lukk',
864
865
  title: 'Tittel',
866
+ save: 'Lagre',
865
867
  image: {
866
868
  altText: 'Alt-tekst',
867
869
  caption: 'Bilettekst',
@@ -992,6 +994,7 @@ const messages = {
992
994
  folder: 'Mappe',
993
995
  delete: 'Slett',
994
996
  edit: 'Rediger',
997
+ missingName: 'Mappenavn er påkrevd',
995
998
  },
996
999
  confirmDeleteFolder: 'Er du sikker på at du vil slette mappa? Denne handlinga kan ikkje angres.',
997
1000
  confirmDeleteTag: 'Er du sikker på at du vil slette tag? Denne handlinga kan ikkje angres.',
@@ -859,8 +859,10 @@ const messages = {
859
859
  open: 'Åpne meny',
860
860
  close: 'Lukk meny',
861
861
  },
862
+ cancel: 'Avbryt',
862
863
  close: 'Lukk',
863
864
  title: 'Tittel',
865
+ save: 'Lagre',
864
866
  image: {
865
867
  altText: 'Alt-tekst',
866
868
  caption: 'Bilettekst',
@@ -991,6 +993,7 @@ const messages = {
991
993
  folder: 'Mappe',
992
994
  delete: 'Slett',
993
995
  edit: 'Rediger',
996
+ missingName: 'Mappenavn er påkrevd',
994
997
  },
995
998
  confirmDeleteFolder: 'Er du sikker på at du vil slette mappen? Denne handlingen kan ikke angres.',
996
999
  confirmDeleteTag: 'Er du sikker på at du vil slette tag? Denne handlingen kan ikke angres.',
@@ -859,8 +859,10 @@ const messages = {
859
859
  open: 'Åpne meny',
860
860
  close: 'Lukk meny',
861
861
  },
862
+ cancel: 'Avbryt',
862
863
  close: 'Lukk',
863
864
  title: 'Tittel',
865
+ save: 'Lagre',
864
866
  image: {
865
867
  altText: 'Alt-tekst',
866
868
  caption: 'Bilettekst',
@@ -991,6 +993,7 @@ const messages = {
991
993
  folder: 'Mappe',
992
994
  delete: 'Slett',
993
995
  edit: 'Rediger',
996
+ missingName: 'Mappenavn er påkrevd',
994
997
  },
995
998
  confirmDeleteFolder: 'Er du sikker på at du vil slette mappen? Denne handlingen kan ikke angres.',
996
999
  confirmDeleteTag: 'Er du sikker på at du vil slette tag? Denne handlingen kan ikke angres.',
@@ -1,42 +0,0 @@
1
- import _styled from "@emotion/styled-base";
2
-
3
- /**
4
- * Copyright (c) 2018-present, NDLA.
5
- *
6
- * This source code is licensed under the GPLv3 license found in the
7
- * LICENSE file in the root directory of this source tree.
8
- *
9
- */
10
- import React from 'react';
11
- import { colors, spacing } from '@ndla/core';
12
- import { jsx as ___EmotionJSX } from "@emotion/core";
13
-
14
- var SpinnerDiv = /*#__PURE__*/_styled('div', {
15
- target: "eecx2hs0",
16
- label: "SpinnerDiv"
17
- })("border:calc(", function (props) {
18
- return spacing[props.size];
19
- }, " / 6.5) solid rgba(0,0,0,0.1);border-bottom-color:", function (props) {
20
- return props.inverted ? '#fff' : colors.brand.primary;
21
- }, ";border-radius:50%;animation:spinnerAnimation 0.7s linear infinite;height:", function (props) {
22
- return spacing[props.size];
23
- }, ";width:", function (props) {
24
- return spacing[props.size];
25
- }, ";margin:", function (props) {
26
- return props.margin;
27
- }, ";display:block;@keyframes spinnerAnimation{0%{transform:rotate(0deg);}100%{transform:rotate(360deg);}}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlNwaW5uZXIudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXNCNkMiLCJmaWxlIjoiU3Bpbm5lci50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgMjAxOC1wcmVzZW50LCBORExBLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIEdQTHYzIGxpY2Vuc2UgZm91bmQgaW4gdGhlXG4gKiBMSUNFTlNFIGZpbGUgaW4gdGhlIHJvb3QgZGlyZWN0b3J5IG9mIHRoaXMgc291cmNlIHRyZWUuXG4gKlxuICovXG5cbmltcG9ydCBSZWFjdCBmcm9tICdyZWFjdCc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBjb2xvcnMsIHNwYWNpbmcsIFNwYWNpbmdOYW1lcyB9IGZyb20gJ0BuZGxhL2NvcmUnO1xuXG5pbnRlcmZhY2UgUHJvcHMge1xuICBzaXplPzogU3BhY2luZ05hbWVzO1xuICBtYXJnaW4/OiBzdHJpbmc7XG4gIGludmVydGVkPzogYm9vbGVhbjtcbn1cblxuaW50ZXJmYWNlIFN0eWxlZFByb3BzIGV4dGVuZHMgUHJvcHMge1xuICBzaXplOiBTcGFjaW5nTmFtZXM7XG59XG5cbmNvbnN0IFNwaW5uZXJEaXYgPSBzdHlsZWQoJ2RpdicpPFN0eWxlZFByb3BzPmBcbiAgYm9yZGVyOiBjYWxjKCR7KHByb3BzKSA9PiBzcGFjaW5nW3Byb3BzLnNpemVdfSAvIDYuNSkgc29saWQgcmdiYSgwLCAwLCAwLCAwLjEpO1xuICBib3JkZXItYm90dG9tLWNvbG9yOiAkeyhwcm9wcykgPT4gKHByb3BzLmludmVydGVkID8gJyNmZmYnIDogY29sb3JzLmJyYW5kLnByaW1hcnkpfTtcbiAgYm9yZGVyLXJhZGl1czogNTAlO1xuICBhbmltYXRpb246IHNwaW5uZXJBbmltYXRpb24gMC43cyBsaW5lYXIgaW5maW5pdGU7XG4gIGhlaWdodDogJHsocHJvcHMpID0+IHNwYWNpbmdbcHJvcHMuc2l6ZV19O1xuICB3aWR0aDogJHsocHJvcHMpID0+IHNwYWNpbmdbcHJvcHMuc2l6ZV19O1xuICBtYXJnaW46ICR7KHByb3BzKSA9PiBwcm9wcy5tYXJnaW59O1xuICBkaXNwbGF5OiBibG9jaztcbiAgQGtleWZyYW1lcyBzcGlubmVyQW5pbWF0aW9uIHtcbiAgICAwJSB7XG4gICAgICB0cmFuc2Zvcm06IHJvdGF0ZSgwZGVnKTtcbiAgICB9XG4gICAgMTAwJSB7XG4gICAgICB0cmFuc2Zvcm06IHJvdGF0ZSgzNjBkZWcpO1xuICAgIH1cbiAgfVxuYDtcblxuY29uc3QgU3Bpbm5lciA9ICh7IHNpemUgPSAnbGFyZ2UnLCBtYXJnaW4gPSBgJHtzcGFjaW5nLm5vcm1hbH0gYXV0b2AsIGludmVydGVkIH06IFBhcnRpYWw8UHJvcHM+KSA9PiAoXG4gIDxTcGlubmVyRGl2IHNpemU9e3NpemV9IG1hcmdpbj17bWFyZ2lufSBpbnZlcnRlZD17ISFpbnZlcnRlZH0gLz5cbik7XG5cbmV4cG9ydCBkZWZhdWx0IFNwaW5uZXI7XG4iXX0= */"));
28
-
29
- var Spinner = function Spinner(_ref) {
30
- var _ref$size = _ref.size,
31
- size = _ref$size === void 0 ? 'large' : _ref$size,
32
- _ref$margin = _ref.margin,
33
- margin = _ref$margin === void 0 ? "".concat(spacing.normal, " auto") : _ref$margin,
34
- inverted = _ref.inverted;
35
- return ___EmotionJSX(SpinnerDiv, {
36
- size: size,
37
- margin: margin,
38
- inverted: !!inverted
39
- });
40
- };
41
-
42
- export default Spinner;
@@ -1,2 +0,0 @@
1
- import Spinner from './Spinner';
2
- export default Spinner;
@@ -1,194 +0,0 @@
1
- function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
2
-
3
- function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
4
-
5
- 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); }
6
-
7
- function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && Symbol.iterator in Object(iter)) return Array.from(iter); }
8
-
9
- function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
10
-
11
- 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; }
12
-
13
- /**
14
- * Copyright (c) 2022-present, NDLA.
15
- *
16
- * This source code is licensed under the GPLv3 license found in the
17
- * LICENSE file in the root directory of this source tree.
18
- *
19
- */
20
- import { MAX_LEVEL_FOR_FOLDERS } from '../TreeStructure';
21
- export var KEYBOARD_KEYS_OF_INTEREST = ['ArrowDown', 'ArrowUp', 'ArrowRight', 'ArrowLeft', ' ']; // Traverse upwards, incase parent is last element of its parent..
22
-
23
- var traverseUpwards = function traverseUpwards(inital, setFocusedFolderId, paths, index) {
24
- var findParent = inital;
25
- var parentNextIds = [];
26
- paths.forEach(function (pathIndex) {
27
- var nextParent = findParent ? findParent[pathIndex + 1] : undefined;
28
- parentNextIds.push((nextParent === null || nextParent === void 0 ? void 0 : nextParent.id) || false);
29
- findParent = findParent[pathIndex].data || [];
30
- });
31
-
32
- if (!parentNextIds.length) {
33
- var _findParent;
34
-
35
- parentNextIds.push(((_findParent = findParent[index + 1]) === null || _findParent === void 0 ? void 0 : _findParent.id) || false);
36
- } // We use a reversed version of parentNextIds, filtered out falses, to find the next element
37
- // No newId? We are at the end of the tree so we wont update.
38
-
39
-
40
- var newId = parentNextIds.reverse().filter(function (id) {
41
- return id;
42
- })[0];
43
-
44
- if (newId) {
45
- setFocusedFolderId(newId);
46
- }
47
- };
48
-
49
- var keyboardNavigation = function keyboardNavigation(_ref) {
50
- var _document$activeEleme, _elementWithKeyFocus$5;
51
-
52
- var e = _ref.e,
53
- data = _ref.data,
54
- onToggleOpen = _ref.onToggleOpen,
55
- setFocusedFolderId = _ref.setFocusedFolderId,
56
- id = _ref.focusedFolderId,
57
- openFolders = _ref.openFolders;
58
-
59
- if (e.key === ' ' && ((_document$activeEleme = document.activeElement) === null || _document$activeEleme === void 0 ? void 0 : _document$activeEleme.nodeName) === 'INPUT') {
60
- return;
61
- } // We are navigating in the tree.
62
- // We need to find the next folder in the tree
63
-
64
-
65
- var elementWithKeyFocus = {
66
- paths: [],
67
- index: 0
68
- };
69
-
70
- var updatePathToElementWithKeyFocus = function updatePathToElementWithKeyFocus(data, paths, parent, parentId) {
71
- return data.some(function (_ref2, _index) {
72
- var childData = _ref2.data,
73
- dataId = _ref2.id,
74
- url = _ref2.url;
75
-
76
- if (dataId === id) {
77
- elementWithKeyFocus.paths = paths;
78
- elementWithKeyFocus.index = _index;
79
- elementWithKeyFocus.isOpen = openFolders.includes(dataId) && childData && childData.length > 0;
80
- elementWithKeyFocus.data = childData;
81
- elementWithKeyFocus.parent = parent;
82
- elementWithKeyFocus.parentId = parentId;
83
- elementWithKeyFocus.url = url;
84
- return true;
85
- }
86
-
87
- return childData ? updatePathToElementWithKeyFocus(childData, [].concat(_toConsumableArray(paths), [_index]), _toConsumableArray(childData), dataId) : false;
88
- });
89
- };
90
-
91
- if (!updatePathToElementWithKeyFocus(data, [], data)) {
92
- var _data$;
93
-
94
- // Couldn't find its location in the tree.
95
- // This should not happen, reset its value to root.
96
- setFocusedFolderId(e.key === 'ArrowDown' ? (_data$ = data[0]) === null || _data$ === void 0 ? void 0 : _data$.id : undefined);
97
- return;
98
- }
99
-
100
- e.preventDefault();
101
- e.stopPropagation();
102
-
103
- if (e.key === ' ') {
104
- var simulatedEvent = new MouseEvent('click', {
105
- bubbles: true,
106
- cancelable: true,
107
- view: window
108
- });
109
- document.activeElement && document.activeElement.dispatchEvent(simulatedEvent);
110
- return;
111
- }
112
-
113
- if (e.key === 'ArrowRight') {
114
- var _elementWithKeyFocus$;
115
-
116
- if (!elementWithKeyFocus.isOpen && ((_elementWithKeyFocus$ = elementWithKeyFocus.data) === null || _elementWithKeyFocus$ === void 0 ? void 0 : _elementWithKeyFocus$.length) && id && elementWithKeyFocus.paths.length < MAX_LEVEL_FOR_FOLDERS - 1) {
117
- onToggleOpen(id);
118
- }
119
-
120
- return;
121
- }
122
-
123
- if (e.key === 'ArrowLeft') {
124
- if (id && elementWithKeyFocus.isOpen) {
125
- onToggleOpen(id);
126
- }
127
-
128
- return;
129
- }
130
-
131
- if (!id && e.key === 'ArrowDown') {
132
- var _data$2;
133
-
134
- setFocusedFolderId((_data$2 = data[0]) === null || _data$2 === void 0 ? void 0 : _data$2.id);
135
- return;
136
- }
137
-
138
- if (!id) {
139
- return;
140
- } // Move up
141
-
142
-
143
- if (e.key === 'ArrowUp') {
144
- if (elementWithKeyFocus.index > 0) {
145
- var _elementWithKeyFocus$2;
146
-
147
- // Move upwards to the parent folder
148
- setFocusedFolderId(elementWithKeyFocus.parent ? (_elementWithKeyFocus$2 = elementWithKeyFocus.parent[elementWithKeyFocus.index - 1]) === null || _elementWithKeyFocus$2 === void 0 ? void 0 : _elementWithKeyFocus$2.id : undefined);
149
- } else if (elementWithKeyFocus.paths.length > 0) {
150
- var _findParent$parentsCu;
151
-
152
- elementWithKeyFocus.paths.pop();
153
- var findParent = data;
154
- elementWithKeyFocus.paths.forEach(function (index) {
155
- findParent = findParent[index].data;
156
- });
157
- var parentsCurrentIndex = findParent.findIndex(function (_ref3) {
158
- var id = _ref3.id;
159
- return id === elementWithKeyFocus.parentId;
160
- });
161
- setFocusedFolderId((_findParent$parentsCu = findParent[parentsCurrentIndex]) === null || _findParent$parentsCu === void 0 ? void 0 : _findParent$parentsCu.id);
162
- }
163
-
164
- return;
165
- }
166
-
167
- if (elementWithKeyFocus.isOpen) {
168
- var _elementWithKeyFocus$3;
169
-
170
- if ((_elementWithKeyFocus$3 = elementWithKeyFocus.data) === null || _elementWithKeyFocus$3 === void 0 ? void 0 : _elementWithKeyFocus$3.length) {
171
- var _elementWithKeyFocus$4;
172
-
173
- setFocusedFolderId((_elementWithKeyFocus$4 = elementWithKeyFocus.data[0]) === null || _elementWithKeyFocus$4 === void 0 ? void 0 : _elementWithKeyFocus$4.id);
174
- } else {
175
- // move to next child of parent if any... need new traverse :-/
176
- traverseUpwards(data, setFocusedFolderId, elementWithKeyFocus.paths, elementWithKeyFocus.index);
177
- }
178
-
179
- return;
180
- }
181
-
182
- if (elementWithKeyFocus.parent && elementWithKeyFocus.index < ((_elementWithKeyFocus$5 = elementWithKeyFocus.parent) === null || _elementWithKeyFocus$5 === void 0 ? void 0 : _elementWithKeyFocus$5.length) - 1) {
183
- var _elementWithKeyFocus$6;
184
-
185
- // Move downwards to the next child
186
- setFocusedFolderId((_elementWithKeyFocus$6 = elementWithKeyFocus.parent[elementWithKeyFocus.index + 1]) === null || _elementWithKeyFocus$6 === void 0 ? void 0 : _elementWithKeyFocus$6.id);
187
- return;
188
- }
189
-
190
- traverseUpwards(data, setFocusedFolderId, elementWithKeyFocus.paths, elementWithKeyFocus.index);
191
- return;
192
- };
193
-
194
- export default keyboardNavigation;
@@ -1,16 +0,0 @@
1
- /**
2
- * Copyright (c) 2018-present, NDLA.
3
- *
4
- * This source code is licensed under the GPLv3 license found in the
5
- * LICENSE file in the root directory of this source tree.
6
- *
7
- */
8
- /// <reference types="react" />
9
- import { SpacingNames } from '@ndla/core';
10
- interface Props {
11
- size?: SpacingNames;
12
- margin?: string;
13
- inverted?: boolean;
14
- }
15
- declare const Spinner: ({ size, margin, inverted }: Partial<Props>) => JSX.Element;
16
- export default Spinner;
@@ -1,54 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports["default"] = void 0;
7
-
8
- var _styledBase = _interopRequireDefault(require("@emotion/styled-base"));
9
-
10
- var _react = _interopRequireDefault(require("react"));
11
-
12
- var _core = require("@ndla/core");
13
-
14
- var _core2 = require("@emotion/core");
15
-
16
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
17
-
18
- /**
19
- * Copyright (c) 2018-present, NDLA.
20
- *
21
- * This source code is licensed under the GPLv3 license found in the
22
- * LICENSE file in the root directory of this source tree.
23
- *
24
- */
25
- var SpinnerDiv = ( /*#__PURE__*/0, _styledBase["default"])('div', {
26
- target: "eecx2hs0",
27
- label: "SpinnerDiv"
28
- })("border:calc(", function (props) {
29
- return _core.spacing[props.size];
30
- }, " / 6.5) solid rgba(0,0,0,0.1);border-bottom-color:", function (props) {
31
- return props.inverted ? '#fff' : _core.colors.brand.primary;
32
- }, ";border-radius:50%;animation:spinnerAnimation 0.7s linear infinite;height:", function (props) {
33
- return _core.spacing[props.size];
34
- }, ";width:", function (props) {
35
- return _core.spacing[props.size];
36
- }, ";margin:", function (props) {
37
- return props.margin;
38
- }, ";display:block;@keyframes spinnerAnimation{0%{transform:rotate(0deg);}100%{transform:rotate(360deg);}}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlNwaW5uZXIudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXNCNkMiLCJmaWxlIjoiU3Bpbm5lci50c3giLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqIENvcHlyaWdodCAoYykgMjAxOC1wcmVzZW50LCBORExBLlxuICpcbiAqIFRoaXMgc291cmNlIGNvZGUgaXMgbGljZW5zZWQgdW5kZXIgdGhlIEdQTHYzIGxpY2Vuc2UgZm91bmQgaW4gdGhlXG4gKiBMSUNFTlNFIGZpbGUgaW4gdGhlIHJvb3QgZGlyZWN0b3J5IG9mIHRoaXMgc291cmNlIHRyZWUuXG4gKlxuICovXG5cbmltcG9ydCBSZWFjdCBmcm9tICdyZWFjdCc7XG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZCc7XG5pbXBvcnQgeyBjb2xvcnMsIHNwYWNpbmcsIFNwYWNpbmdOYW1lcyB9IGZyb20gJ0BuZGxhL2NvcmUnO1xuXG5pbnRlcmZhY2UgUHJvcHMge1xuICBzaXplPzogU3BhY2luZ05hbWVzO1xuICBtYXJnaW4/OiBzdHJpbmc7XG4gIGludmVydGVkPzogYm9vbGVhbjtcbn1cblxuaW50ZXJmYWNlIFN0eWxlZFByb3BzIGV4dGVuZHMgUHJvcHMge1xuICBzaXplOiBTcGFjaW5nTmFtZXM7XG59XG5cbmNvbnN0IFNwaW5uZXJEaXYgPSBzdHlsZWQoJ2RpdicpPFN0eWxlZFByb3BzPmBcbiAgYm9yZGVyOiBjYWxjKCR7KHByb3BzKSA9PiBzcGFjaW5nW3Byb3BzLnNpemVdfSAvIDYuNSkgc29saWQgcmdiYSgwLCAwLCAwLCAwLjEpO1xuICBib3JkZXItYm90dG9tLWNvbG9yOiAkeyhwcm9wcykgPT4gKHByb3BzLmludmVydGVkID8gJyNmZmYnIDogY29sb3JzLmJyYW5kLnByaW1hcnkpfTtcbiAgYm9yZGVyLXJhZGl1czogNTAlO1xuICBhbmltYXRpb246IHNwaW5uZXJBbmltYXRpb24gMC43cyBsaW5lYXIgaW5maW5pdGU7XG4gIGhlaWdodDogJHsocHJvcHMpID0+IHNwYWNpbmdbcHJvcHMuc2l6ZV19O1xuICB3aWR0aDogJHsocHJvcHMpID0+IHNwYWNpbmdbcHJvcHMuc2l6ZV19O1xuICBtYXJnaW46ICR7KHByb3BzKSA9PiBwcm9wcy5tYXJnaW59O1xuICBkaXNwbGF5OiBibG9jaztcbiAgQGtleWZyYW1lcyBzcGlubmVyQW5pbWF0aW9uIHtcbiAgICAwJSB7XG4gICAgICB0cmFuc2Zvcm06IHJvdGF0ZSgwZGVnKTtcbiAgICB9XG4gICAgMTAwJSB7XG4gICAgICB0cmFuc2Zvcm06IHJvdGF0ZSgzNjBkZWcpO1xuICAgIH1cbiAgfVxuYDtcblxuY29uc3QgU3Bpbm5lciA9ICh7IHNpemUgPSAnbGFyZ2UnLCBtYXJnaW4gPSBgJHtzcGFjaW5nLm5vcm1hbH0gYXV0b2AsIGludmVydGVkIH06IFBhcnRpYWw8UHJvcHM+KSA9PiAoXG4gIDxTcGlubmVyRGl2IHNpemU9e3NpemV9IG1hcmdpbj17bWFyZ2lufSBpbnZlcnRlZD17ISFpbnZlcnRlZH0gLz5cbik7XG5cbmV4cG9ydCBkZWZhdWx0IFNwaW5uZXI7XG4iXX0= */"));
39
-
40
- var Spinner = function Spinner(_ref) {
41
- var _ref$size = _ref.size,
42
- size = _ref$size === void 0 ? 'large' : _ref$size,
43
- _ref$margin = _ref.margin,
44
- margin = _ref$margin === void 0 ? "".concat(_core.spacing.normal, " auto") : _ref$margin,
45
- inverted = _ref.inverted;
46
- return (0, _core2.jsx)(SpinnerDiv, {
47
- size: size,
48
- margin: margin,
49
- inverted: !!inverted
50
- });
51
- };
52
-
53
- var _default = Spinner;
54
- exports["default"] = _default;
@@ -1,2 +0,0 @@
1
- import Spinner from './Spinner';
2
- export default Spinner;
@@ -1,13 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports["default"] = void 0;
7
-
8
- var _Spinner = _interopRequireDefault(require("./Spinner"));
9
-
10
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
11
-
12
- var _default = _Spinner["default"];
13
- exports["default"] = _default;
@@ -1,11 +0,0 @@
1
- /**
2
- * Copyright (c) 2022-present, NDLA.
3
- *
4
- * This source code is licensed under the GPLv3 license found in the
5
- * LICENSE file in the root directory of this source tree.
6
- *
7
- */
8
- import { KeyboardNavigationProps } from './keyboardNavigation.types';
9
- export declare const KEYBOARD_KEYS_OF_INTEREST: string[];
10
- declare const keyboardNavigation: ({ e, data, onToggleOpen, setFocusedFolderId, focusedFolderId: id, openFolders, }: KeyboardNavigationProps) => string | undefined;
11
- export default keyboardNavigation;