@digigov/ui 0.30.2 → 0.31.0

package/es/hooks/useNavList.js

@@ -1,21 +1,23 @@
 import _extends from "@babel/runtime/helpers/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["register", "opened"];
+var _excluded = ["registerButton", "registerLink", "opened"];
+import { useTogglableNav } from '@digigov/ui/hooks/useTogglableNav';
 import { useCallback, useRef } from 'react';
-import { useTogglableSections } from '@digigov/ui/hooks/useTogglableSections';
 export var useNavList = function useNavList() {
   var registeredContainers = useRef({});
 
-  var _useTogglableSections = useTogglableSections({
+  var _useTogglableNav = useTogglableNav({
     singleOpen: true,
     toggleOpenClose: true,
+    toggleParentOpen: true,
     toggleProperty: 'active',
     onToggleProperty: 'onClick',
     ariaNavigation: true
   }),
-      register = _useTogglableSections.register,
-      opened = _useTogglableSections.opened,
-      rest = _objectWithoutProperties(_useTogglableSections, _excluded);
+      registerButton = _useTogglableNav.registerButton,
+      registerLink = _useTogglableNav.registerLink,
+      opened = _useTogglableNav.opened,
+      rest = _objectWithoutProperties(_useTogglableNav, _excluded);
 
   var container = useCallback(function (key) {
     return {
@@ -29,7 +31,8 @@ export var useNavList = function useNavList() {
     };
   }, [opened]);
   return _extends({
-    register: register,
+    registerButton: registerButton,
+    registerLink: registerLink,
     opened: opened,
     container: container
   }, rest);

package/es/hooks/useTheme.js

@@ -1,9 +1,8 @@
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import { useState, useEffect } from 'react';
-;
 export var useTheme = function useTheme() {
   var prefersDarkScheme = window.matchMedia('(prefers-color-scheme: dark)').matches;
-  var storedTheme = localStorage.getItem('theme');
+  var storedTheme = localStorage.getItem('--theme-palette');
 
   var _useState = useState(storedTheme || 'auto'),
       _useState2 = _slicedToArray(_useState, 2),
@@ -11,21 +10,33 @@ export var useTheme = function useTheme() {
       changeTheme = _useState2[1];
 
   useEffect(function () {
+    document.documentElement.classList.remove('dark', 'light', 'auto');
+
     if (theme === 'auto') {
-      document.documentElement.className = prefersDarkScheme ? 'dark' : 'light';
+      document.documentElement.classList.add(prefersDarkScheme ? 'dark' : 'light');
     } else {
-      document.documentElement.className = theme;
+      document.documentElement.classList.add(theme);
     }
 
-    localStorage.setItem('theme', theme);
+    localStorage.setItem('--theme-palette', theme);
   }, [theme]);
   useEffect(function () {
     var beforePrintListener = function beforePrintListener() {
-      document.documentElement.className = 'light';
+      document.documentElement.classList.remove('dark');
+      document.documentElement.classList.add('light');
     };
 
     var afterPrintListener = function afterPrintListener() {
-      document.documentElement.className = localStorage.getItem('theme') || theme;
+      document.documentElement.classList.remove('light');
+      var localtheme;
+
+      if (localStorage.getItem('--theme-palette') === 'auto') {
+        localtheme = prefersDarkScheme ? 'dark' : 'light';
+      } else {
+        localtheme = localStorage.getItem('--theme-palette');
+      }
+
+      document.documentElement.classList.add(localtheme || theme);
     };
 
     window.addEventListener('beforeprint', beforePrintListener);
@@ -35,9 +46,6 @@ export var useTheme = function useTheme() {
       window.removeEventListener('afterprint', afterPrintListener);
     };
   }, []);
-  return {
-    theme: theme,
-    changeTheme: changeTheme
-  };
+  return [theme, changeTheme];
 };
 export default useTheme;

package/es/hooks/useTogglableNav.js

@@ -0,0 +1,292 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _extends from "@babel/runtime/helpers/extends";
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import { useRef, useState, useCallback, useMemo } from 'react';
+export function useTogglableNav(_ref) {
+  var toggleProperty = _ref.toggleProperty,
+      toggleOpenClose = _ref.toggleOpenClose,
+      toggleParentOpen = _ref.toggleParentOpen,
+      onToggleProperty = _ref.onToggleProperty,
+      initial = _ref.initial,
+      ariaNavigation = _ref.ariaNavigation,
+      toggleHook = _ref.toggleHook;
+
+  var _useState = useState(initial || {}),
+      _useState2 = _slicedToArray(_useState, 2),
+      opened = _useState2[0],
+      setOpened = _useState2[1];
+
+  var registered = useRef({});
+  var openedKeys = useRef([]);
+  var registerButtonRef = useCallback(function (el) {
+    if (!el) return;
+    var key = el.getAttribute('aria-controls');
+    if (registered.current[key]) return;
+    registered.current[key] = {
+      el: el,
+      type: 'button'
+    };
+  }, []);
+  var registerLinkRef = useCallback(function (el) {
+    if (!el) return;
+    var key = el.getAttribute('aria-controls');
+    if (registered.current[key]) return;
+    registered.current[key] = {
+      el: el,
+      type: 'link'
+    };
+  }, []);
+  var toggle = useCallback(function (e) {
+    var key = e.currentTarget.getAttribute('aria-controls');
+    var selected = e.currentTarget.getAttribute('aria-selected') === 'true';
+
+    if (toggleHook) {
+      toggleHook(key);
+    }
+
+    e.preventDefault();
+
+    if (toggleOpenClose) {
+      if (toggleParentOpen) {
+        var items = key.split('__');
+        var currentKey = items.slice(0, items.length).join('__');
+        var totalKeys = items.map(function (_, index) {
+          return items.slice(0, index + 1).join('__');
+        });
+
+        if (!selected && !openedKeys.current.includes(currentKey)) {
+          openedKeys.current.push(currentKey);
+        }
+
+        if (selected && openedKeys.current.includes(currentKey)) {
+          openedKeys.current = openedKeys.current.filter(function (k) {
+            return k !== currentKey;
+          });
+        }
+
+        setOpened(function (_) {
+          return _extends({}, totalKeys.reduce(function (acc, cur) {
+            acc[cur] = cur === currentKey ? !selected : true;
+            return acc;
+          }, {}));
+        });
+      } else {
+        setOpened(_defineProperty({}, key, !selected));
+      }
+    } else {
+      setOpened(_defineProperty({}, key, true));
+    }
+  }, []);
+
+  var getMenuItems = function getMenuItems(element) {
+    if (element) {
+      if ((element === null || element === void 0 ? void 0 : element.role) === 'menuitem') {
+        return element;
+      } else {
+        var childrenArray = Array.from(element === null || element === void 0 ? void 0 : element.children);
+        var menuItemsArray = [];
+        childrenArray.forEach(function (child) {
+          var menuItem = getMenuItems(child);
+
+          if (menuItem && !menuItemsArray.includes(menuItem)) {
+            menuItemsArray.push(menuItem);
+          }
+        });
+        return menuItemsArray.flatMap(function (x) {
+          return x;
+        });
+      }
+    }
+
+    return null;
+  };
+
+  var findChildren = function findChildren(parent, items) {
+    return items ? items.filter(function (child) {
+      return child.slice(0, child.lastIndexOf('__')) === parent;
+    }) : items;
+  };
+
+  var findParent = function findParent(child, items) {
+    var parent = child.slice(0, child.lastIndexOf('__'));
+    return items.find(function (item) {
+      return item === parent;
+    }) ? parent : null;
+  };
+
+  var findSiblings = function findSiblings(key, items) {
+    var parent = key.slice(0, key.lastIndexOf('__'));
+
+    if (key.lastIndexOf('__') > 0) {
+      return items.filter(function (child) {
+        return child.slice(0, child.lastIndexOf('__')) === parent;
+      });
+    }
+
+    return items.filter(function (child) {
+      return !child.includes('__');
+    });
+  };
+
+  var findLeftSibling = function findLeftSibling(key, items) {
+    var siblings = findSiblings(key, items);
+
+    if (siblings.length > 0) {
+      var keyIndex = siblings.findIndex(function (item) {
+        return item === key;
+      });
+      return keyIndex > 0 ? siblings[keyIndex - 1] : null;
+    }
+
+    return null;
+  };
+
+  var findRightSibling = function findRightSibling(key, items) {
+    var siblings = findSiblings(key, items);
+
+    if (siblings.length > 0) {
+      var keyIndex = siblings.findIndex(function (item) {
+        return item === key;
+      });
+      return keyIndex < siblings.length - 1 ? siblings[keyIndex + 1] : null;
+    }
+
+    return null;
+  };
+
+  var getOpenItemChildren = function getOpenItemChildren(currentItem, items) {
+    var itemChildrenArray = [];
+    var itemChildren = findChildren(currentItem, items);
+    itemChildren.forEach(function (item) {
+      if (openedKeys.current.includes(item)) {
+        itemChildrenArray.push(item);
+        var internChildren = getOpenItemChildren(item, items);
+
+        if (internChildren.length > 0) {
+          itemChildrenArray.push(internChildren);
+        }
+      } else {
+        itemChildrenArray.push(item);
+      }
+    });
+    return itemChildrenArray.flatMap(function (x) {
+      return x;
+    });
+  };
+
+  var onKeyDown = useCallback(function (e) {
+    var _document$querySelect;
+
+    var orientation = (_document$querySelect = document.querySelector("[aria-orientation]")) === null || _document$querySelect === void 0 ? void 0 : _document$querySelect.getAttribute('aria-orientation');
+    var key = e.target.getAttribute('aria-controls');
+    var keys = Object.entries(registered.current).map(function (_ref2) {
+      var _ref3 = _slicedToArray(_ref2, 2),
+          entryKey = _ref3[0],
+          _ = _ref3[1];
+
+      return entryKey;
+    });
+
+    var handleArrowRight = function handleArrowRight() {
+      var arrowRightItem = findRightSibling(key, keys);
+
+      if (arrowRightItem) {
+        registered.current[arrowRightItem].el.focus();
+      }
+    };
+
+    var handleArrowLeft = function handleArrowLeft() {
+      var arrowLeftItem = findLeftSibling(key, keys);
+
+      if (arrowLeftItem) {
+        registered.current[arrowLeftItem].el.focus();
+      }
+    };
+
+    switch (e.key) {
+      case 'ArrowRight':
+        handleArrowRight();
+        break;
+
+      case 'ArrowDown':
+        var openItem = getOpenItemChildren(key, keys);
+        var arrowDownItems = findChildren(key, openItem);
+        var menuItems = getMenuItems(document.getElementById(key));
+
+        if (arrowDownItems.length > 0) {
+          registered.current[arrowDownItems[0]].el.focus();
+        } else {
+          if (orientation === 'vertical') {
+            var _document$activeEleme;
+
+            if (((_document$activeEleme = document.activeElement) === null || _document$activeEleme === void 0 ? void 0 : _document$activeEleme.getAttribute('aria-selected')) === 'true' && menuItems && menuItems.length > 0) {
+              menuItems[0].focus();
+            } else {
+              handleArrowRight();
+            }
+          } else {
+            if (menuItems && menuItems.length > 0) {
+              menuItems[0].focus();
+            }
+          }
+        }
+
+        break;
+
+      case 'ArrowLeft':
+        handleArrowLeft();
+        break;
+
+      case 'ArrowUp':
+        if (orientation === 'vertical') {
+          handleArrowLeft();
+        } else {
+          var arrowUpItem = findParent(key, keys);
+
+          if (arrowUpItem) {
+            registered.current[arrowUpItem].el.focus();
+          }
+        }
+
+        break;
+
+      case ' ':
+      case 'Enter':
+        if (registered.current[key].type === 'link') {
+          registered.current[key].el.click();
+        } else {
+          toggle(e);
+        }
+
+        break;
+    }
+  }, []);
+  var registerButton = useCallback(function (key) {
+    var _extends2;
+
+    var isOpen = !!opened[key];
+    return _extends((_extends2 = {
+      ref: registerButtonRef
+    }, _defineProperty(_extends2, toggleProperty, isOpen), _defineProperty(_extends2, onToggleProperty, toggle), _defineProperty(_extends2, 'aria-controls', "".concat(key)), _extends2), ariaNavigation && {
+      onKeyDown: onKeyDown
+    });
+  }, [opened]);
+  var registerLink = useCallback(function (key) {
+    return _extends({
+      ref: registerLinkRef,
+      'aria-controls': "".concat(key)
+    }, ariaNavigation && {
+      onKeyDown: onKeyDown
+    });
+  }, [opened]);
+  return useMemo(function () {
+    return {
+      registerButton: registerButton,
+      registerLink: registerLink,
+      registered: registered,
+      opened: opened,
+      toggle: toggle,
+      setOpened: setOpened
+    };
+  }, [opened]);
+}

package/es/hooks/{useTogglableSections.js → useTogglableTab.js}

@@ -4,10 +4,9 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 
 /* eslint-disable react-hooks/exhaustive-deps */
 import { useRef, useState, useCallback, useMemo } from 'react';
-export function useTogglableSections(_ref) {
+export function useTogglableTab(_ref) {
   var toggleProperty = _ref.toggleProperty,
       singleOpen = _ref.singleOpen,
-      toggleOpenClose = _ref.toggleOpenClose,
       onToggleProperty = _ref.onToggleProperty,
       initial = _ref.initial,
       firstOpen = _ref.firstOpen,
@@ -34,7 +33,6 @@ export function useTogglableSections(_ref) {
   }, []);
   var toggle = useCallback(function (e) {
     var key = e.currentTarget.getAttribute('aria-controls');
-    var selected = e.currentTarget.getAttribute('aria-selected') === 'true';
 
     if (toggleHook) {
       toggleHook(key);
@@ -43,11 +41,7 @@ export function useTogglableSections(_ref) {
     e.preventDefault();
 
     if (singleOpen) {
-      if (toggleOpenClose) {
-        setOpened(_defineProperty({}, key, !selected));
-      } else {
-        setOpened(_defineProperty({}, key, true));
-      }
+      setOpened(_defineProperty({}, key, true));
     } else {
       setOpened(function (prev) {
         return _extends({}, prev, _defineProperty({}, key, !prev[key]));

package/es/hooks/useVariantVars.js

@@ -0,0 +1,30 @@
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import { useState, useEffect } from 'react';
+
+function useVariantVars(_ref) {
+  var name = _ref.name,
+      variables = _ref.variables,
+      variants = _ref.variants;
+  var root = document.documentElement;
+  var storedValue = localStorage.getItem("--theme-".concat(name));
+
+  var _useState = useState(storedValue || variants[0]),
+      _useState2 = _slicedToArray(_useState, 2),
+      value = _useState2[0],
+      setValue = _useState2[1];
+
+  useEffect(function () {
+    localStorage.setItem("--theme-".concat(name), value);
+    variables.forEach(function (varName) {
+      root.style.setProperty("--".concat(varName), "var(--".concat(varName, "-").concat(value, ")"));
+    });
+  }, [value]);
+
+  function changeValue(v) {
+    setValue(v);
+  }
+
+  return [value, changeValue];
+}
+
+export default useVariantVars;

package/es/layouts/Basic/__stories__/Default.js

@@ -1,10 +1,10 @@
 import React from 'react';
 import { Layout } from '@digigov/ui/layouts/Basic';
-import { Content } from '@digigov/ui/layouts/Basic/Content';
+import { Container } from '@digigov/ui/layouts/Basic/Container';
 import { Main } from '@digigov/ui/layouts/Basic/Main';
 import { Heading, Paragraph } from '@digigov/ui/typography';
 
-var _ref = /*#__PURE__*/React.createElement(Layout, null, /*#__PURE__*/React.createElement(Content, null, /*#__PURE__*/React.createElement(Main, null, /*#__PURE__*/React.createElement(Heading, null, "Two-thirds column"), /*#__PURE__*/React.createElement(Paragraph, null, "This is a paragraph inside a two-thirds wide column"))));
+var _ref = /*#__PURE__*/React.createElement(Layout, null, /*#__PURE__*/React.createElement(Container, null, /*#__PURE__*/React.createElement(Main, null, /*#__PURE__*/React.createElement(Heading, null, "Two-thirds column"), /*#__PURE__*/React.createElement(Paragraph, null, "This is a paragraph inside a two-thirds wide column"))));
 
 export var Default = function Default() {
   return _ref;

package/es/layouts/Basic/__stories__/MultipleRowsLayout.js

@@ -1,11 +1,11 @@
 import React from 'react';
 import { Layout } from '@digigov/ui/layouts/Basic';
-import { Content } from '@digigov/ui/layouts/Basic/Content';
+import { Container } from '@digigov/ui/layouts/Basic/Container';
 import { Main } from '@digigov/ui/layouts/Basic/Main';
-import { Side } from '@digigov/ui/layouts/Basic/Side';
+import { Aside } from '@digigov/ui/layouts/Basic/Aside';
 import { Heading, Paragraph } from '@digigov/ui/typography';
 
-var _ref = /*#__PURE__*/React.createElement(Layout, null, /*#__PURE__*/React.createElement(Content, null, /*#__PURE__*/React.createElement(Main, null, /*#__PURE__*/React.createElement(Heading, null, "Two-thirds column"), /*#__PURE__*/React.createElement(Paragraph, null, "This is a paragraph inside a two-thirds wide column"))), /*#__PURE__*/React.createElement(Content, null, /*#__PURE__*/React.createElement(Main, null, /*#__PURE__*/React.createElement(Heading, null, "Two-thirds column"), /*#__PURE__*/React.createElement(Paragraph, null, "This is a paragraph inside a two-thirds wide column")), /*#__PURE__*/React.createElement(Side, null, /*#__PURE__*/React.createElement(Heading, {
+var _ref = /*#__PURE__*/React.createElement(Layout, null, /*#__PURE__*/React.createElement(Container, null, /*#__PURE__*/React.createElement(Main, null, /*#__PURE__*/React.createElement(Heading, null, "Two-thirds column"), /*#__PURE__*/React.createElement(Paragraph, null, "This is a paragraph inside a two-thirds wide column"))), /*#__PURE__*/React.createElement(Container, null, /*#__PURE__*/React.createElement(Main, null, /*#__PURE__*/React.createElement(Heading, null, "Two-thirds column"), /*#__PURE__*/React.createElement(Paragraph, null, "This is a paragraph inside a two-thirds wide column")), /*#__PURE__*/React.createElement(Aside, null, /*#__PURE__*/React.createElement(Heading, {
   size: "m"
 }, "One-third-column"), /*#__PURE__*/React.createElement(Paragraph, null, "This is a paragraph inside a one-third wide column"))));
 

package/es/layouts/Basic/__stories__/TwoThirdsOneThirdColumns.js

@@ -1,11 +1,11 @@
 import React from 'react';
 import { Layout } from '@digigov/ui/layouts/Basic';
-import { Content } from '@digigov/ui/layouts/Basic/Content';
+import { Container } from '@digigov/ui/layouts/Basic/Container';
 import { Main } from '@digigov/ui/layouts/Basic/Main';
-import { Side } from '@digigov/ui/layouts/Basic/Side';
+import { Aside } from '@digigov/ui/layouts/Basic/Aside';
 import { Heading, Paragraph } from '@digigov/ui/typography';
 
-var _ref = /*#__PURE__*/React.createElement(Layout, null, /*#__PURE__*/React.createElement(Content, null, /*#__PURE__*/React.createElement(Main, null, /*#__PURE__*/React.createElement(Heading, null, "Two-thirds column"), /*#__PURE__*/React.createElement(Paragraph, null, "This is a paragraph inside a two-thirds wide column")), /*#__PURE__*/React.createElement(Side, null, /*#__PURE__*/React.createElement(Heading, {
+var _ref = /*#__PURE__*/React.createElement(Layout, null, /*#__PURE__*/React.createElement(Container, null, /*#__PURE__*/React.createElement(Main, null, /*#__PURE__*/React.createElement(Heading, null, "Two-thirds column"), /*#__PURE__*/React.createElement(Paragraph, null, "This is a paragraph inside a two-thirds wide column")), /*#__PURE__*/React.createElement(Aside, null, /*#__PURE__*/React.createElement(Heading, {
   size: "m"
 }, "One-third-column"), /*#__PURE__*/React.createElement(Paragraph, null, "This is a paragraph inside a one-third wide column"))));
 

package/es/registry.js

@@ -1,3 +1,4 @@
+import * as _digigov_ui_admin_AccessibilityMenu from '@digigov/ui/admin/AccessibilityMenu';
 import * as _digigov_ui_admin_AdminLayout from '@digigov/ui/admin/AdminLayout';
 import * as _digigov_ui_admin_AutoComplete from '@digigov/ui/admin/AutoComplete';
 import * as _digigov_ui_admin_AutoComplete_Status from '@digigov/ui/admin/AutoComplete/Status';
@@ -55,7 +56,8 @@ import * as _digigov_ui_app_QrCodeViewer from '@digigov/ui/app/QrCodeViewer';
 import * as _digigov_ui_app_QrCodeViewer_qrcodegen from '@digigov/ui/app/QrCodeViewer/qrcodegen';
 import * as _digigov_ui_app_QrCodeViewer_types from '@digigov/ui/app/QrCodeViewer/types';
 import * as _digigov_ui_app_QrCodeViewer_utils from '@digigov/ui/app/QrCodeViewer/utils';
-import * as _digigov_ui_app_ThemeSelectorOptions from '@digigov/ui/app/ThemeSelectorOptions';
+import * as _digigov_ui_app_ThemeOptionsForm from '@digigov/ui/app/ThemeOptionsForm';
+import * as _digigov_ui_app_ThemePaletteForm from '@digigov/ui/app/ThemePaletteForm';
 import * as _digigov_ui_core_Accordion from '@digigov/ui/core/Accordion';
 import * as _digigov_ui_core_BackLink from '@digigov/ui/core/BackLink';
 import * as _digigov_ui_core_Base from '@digigov/ui/core/Base';
@@ -93,15 +95,18 @@ import * as _digigov_ui_core_Masthead from '@digigov/ui/core/Masthead';
 import * as _digigov_ui_core_NavList from '@digigov/ui/core/NavList';
 import * as _digigov_ui_core_NavList_Nav from '@digigov/ui/core/NavList/Nav';
 import * as _digigov_ui_core_NavList_NavList from '@digigov/ui/core/NavList/NavList';
-import * as _digigov_ui_core_NavList_NavListAuto from '@digigov/ui/core/NavList/NavListAuto';
-import * as _digigov_ui_core_NavList_NavListBase from '@digigov/ui/core/NavList/NavListBase';
-import * as _digigov_ui_core_NavList_NavListContext from '@digigov/ui/core/NavList/NavListContext';
+import * as _digigov_ui_core_NavList_NavListAuto_NavListAuto from '@digigov/ui/core/NavList/NavListAuto/NavListAuto';
+import * as _digigov_ui_core_NavList_NavListAuto_NavListBaseAuto from '@digigov/ui/core/NavList/NavListAuto/NavListBaseAuto';
+import * as _digigov_ui_core_NavList_NavListAuto_NavListContextAuto from '@digigov/ui/core/NavList/NavListAuto/NavListContextAuto';
+import * as _digigov_ui_core_NavList_NavListAuto_NavListItemAnchorAuto from '@digigov/ui/core/NavList/NavListAuto/NavListItemAnchorAuto';
+import * as _digigov_ui_core_NavList_NavListAuto_NavListItemAuto from '@digigov/ui/core/NavList/NavListAuto/NavListItemAuto';
+import * as _digigov_ui_core_NavList_NavListAuto_NavListItemButtonAuto from '@digigov/ui/core/NavList/NavListAuto/NavListItemButtonAuto';
+import * as _digigov_ui_core_NavList_NavListAuto_NavListMenuAuto from '@digigov/ui/core/NavList/NavListAuto/NavListMenuAuto';
+import * as _digigov_ui_core_NavList_NavListAuto_NavListSubMenuAuto from '@digigov/ui/core/NavList/NavListAuto/NavListSubMenuAuto';
 import * as _digigov_ui_core_NavList_NavListItem from '@digigov/ui/core/NavList/NavListItem';
-import * as _digigov_ui_core_NavList_NavListItemAuto from '@digigov/ui/core/NavList/NavListItemAuto';
 import * as _digigov_ui_core_NavList_NavListItemBase from '@digigov/ui/core/NavList/NavListItemBase';
 import * as _digigov_ui_core_NavList_NavListItemButton from '@digigov/ui/core/NavList/NavListItemButton';
 import * as _digigov_ui_core_NavList_NavListItemLink from '@digigov/ui/core/NavList/NavListItemLink';
-import * as _digigov_ui_core_NavList_NavListSubMenu from '@digigov/ui/core/NavList/NavListSubMenu';
 import * as _digigov_ui_core_NavList_NavMenu from '@digigov/ui/core/NavList/NavMenu';
 import * as _digigov_ui_core_NavList_NavMenuContainer from '@digigov/ui/core/NavList/NavMenuContainer';
 import * as _digigov_ui_core_NavList_NavMenuContainerContent from '@digigov/ui/core/NavList/NavMenuContainerContent';
@@ -145,13 +150,19 @@ import * as _digigov_ui_govgr_images_minedu_logo_base64 from '@digigov/ui/govgr/
 import * as _digigov_ui_govgr_images_minedu_logo_black_base64 from '@digigov/ui/govgr/images/minedu-logo-black-base64';
 import * as _digigov_ui_govgr from '@digigov/ui/govgr';
 import * as _digigov_ui_hooks_useDebounce from '@digigov/ui/hooks/useDebounce';
+import * as _digigov_ui_hooks_useFontSize from '@digigov/ui/hooks/useFontSize';
+import * as _digigov_ui_hooks_useHighlightLinks from '@digigov/ui/hooks/useHighlightLinks';
 import * as _digigov_ui_hooks_useKeypress from '@digigov/ui/hooks/useKeypress';
 import * as _digigov_ui_hooks_useLatest from '@digigov/ui/hooks/useLatest';
+import * as _digigov_ui_hooks_useLetterSpacing from '@digigov/ui/hooks/useLetterSpacing';
+import * as _digigov_ui_hooks_useLineHeight from '@digigov/ui/hooks/useLineHeight';
 import * as _digigov_ui_hooks_useNavList from '@digigov/ui/hooks/useNavList';
 import * as _digigov_ui_hooks_useOutdatedBrowserCheck from '@digigov/ui/hooks/useOutdatedBrowserCheck';
 import * as _digigov_ui_hooks_useSearch from '@digigov/ui/hooks/useSearch';
 import * as _digigov_ui_hooks_useTheme from '@digigov/ui/hooks/useTheme';
-import * as _digigov_ui_hooks_useTogglableSections from '@digigov/ui/hooks/useTogglableSections';
+import * as _digigov_ui_hooks_useTogglableNav from '@digigov/ui/hooks/useTogglableNav';
+import * as _digigov_ui_hooks_useTogglableTab from '@digigov/ui/hooks/useTogglableTab';
+import * as _digigov_ui_hooks_useVariantVars from '@digigov/ui/hooks/useVariantVars';
 import * as _digigov_ui from '@digigov/ui';
 import * as _digigov_ui_layouts_Basic_Aside from '@digigov/ui/layouts/Basic/Aside';
 import * as _digigov_ui_layouts_Basic_Bottom from '@digigov/ui/layouts/Basic/Bottom';
@@ -198,6 +209,7 @@ function lazyImport(pkgImport) {
 }
 
 export default {
+  '@digigov/ui/admin/AccessibilityMenu': lazyImport(_digigov_ui_admin_AccessibilityMenu),
   '@digigov/ui/admin/AdminLayout': lazyImport(_digigov_ui_admin_AdminLayout),
   '@digigov/ui/admin/AutoComplete': lazyImport(_digigov_ui_admin_AutoComplete),
   '@digigov/ui/admin/AutoComplete/Status': lazyImport(_digigov_ui_admin_AutoComplete_Status),
@@ -255,7 +267,8 @@ export default {
   '@digigov/ui/app/QrCodeViewer/qrcodegen': lazyImport(_digigov_ui_app_QrCodeViewer_qrcodegen),
   '@digigov/ui/app/QrCodeViewer/types': lazyImport(_digigov_ui_app_QrCodeViewer_types),
   '@digigov/ui/app/QrCodeViewer/utils': lazyImport(_digigov_ui_app_QrCodeViewer_utils),
-  '@digigov/ui/app/ThemeSelectorOptions': lazyImport(_digigov_ui_app_ThemeSelectorOptions),
+  '@digigov/ui/app/ThemeOptionsForm': lazyImport(_digigov_ui_app_ThemeOptionsForm),
+  '@digigov/ui/app/ThemePaletteForm': lazyImport(_digigov_ui_app_ThemePaletteForm),
   '@digigov/ui/core/Accordion': lazyImport(_digigov_ui_core_Accordion),
   '@digigov/ui/core/BackLink': lazyImport(_digigov_ui_core_BackLink),
   '@digigov/ui/core/Base': lazyImport(_digigov_ui_core_Base),
@@ -293,15 +306,18 @@ export default {
   '@digigov/ui/core/NavList': lazyImport(_digigov_ui_core_NavList),
   '@digigov/ui/core/NavList/Nav': lazyImport(_digigov_ui_core_NavList_Nav),
   '@digigov/ui/core/NavList/NavList': lazyImport(_digigov_ui_core_NavList_NavList),
-  '@digigov/ui/core/NavList/NavListAuto': lazyImport(_digigov_ui_core_NavList_NavListAuto),
-  '@digigov/ui/core/NavList/NavListBase': lazyImport(_digigov_ui_core_NavList_NavListBase),
-  '@digigov/ui/core/NavList/NavListContext': lazyImport(_digigov_ui_core_NavList_NavListContext),
+  '@digigov/ui/core/NavList/NavListAuto/NavListAuto': lazyImport(_digigov_ui_core_NavList_NavListAuto_NavListAuto),
+  '@digigov/ui/core/NavList/NavListAuto/NavListBaseAuto': lazyImport(_digigov_ui_core_NavList_NavListAuto_NavListBaseAuto),
+  '@digigov/ui/core/NavList/NavListAuto/NavListContextAuto': lazyImport(_digigov_ui_core_NavList_NavListAuto_NavListContextAuto),
+  '@digigov/ui/core/NavList/NavListAuto/NavListItemAnchorAuto': lazyImport(_digigov_ui_core_NavList_NavListAuto_NavListItemAnchorAuto),
+  '@digigov/ui/core/NavList/NavListAuto/NavListItemAuto': lazyImport(_digigov_ui_core_NavList_NavListAuto_NavListItemAuto),
+  '@digigov/ui/core/NavList/NavListAuto/NavListItemButtonAuto': lazyImport(_digigov_ui_core_NavList_NavListAuto_NavListItemButtonAuto),
+  '@digigov/ui/core/NavList/NavListAuto/NavListMenuAuto': lazyImport(_digigov_ui_core_NavList_NavListAuto_NavListMenuAuto),
+  '@digigov/ui/core/NavList/NavListAuto/NavListSubMenuAuto': lazyImport(_digigov_ui_core_NavList_NavListAuto_NavListSubMenuAuto),
   '@digigov/ui/core/NavList/NavListItem': lazyImport(_digigov_ui_core_NavList_NavListItem),
-  '@digigov/ui/core/NavList/NavListItemAuto': lazyImport(_digigov_ui_core_NavList_NavListItemAuto),
   '@digigov/ui/core/NavList/NavListItemBase': lazyImport(_digigov_ui_core_NavList_NavListItemBase),
   '@digigov/ui/core/NavList/NavListItemButton': lazyImport(_digigov_ui_core_NavList_NavListItemButton),
   '@digigov/ui/core/NavList/NavListItemLink': lazyImport(_digigov_ui_core_NavList_NavListItemLink),
-  '@digigov/ui/core/NavList/NavListSubMenu': lazyImport(_digigov_ui_core_NavList_NavListSubMenu),
   '@digigov/ui/core/NavList/NavMenu': lazyImport(_digigov_ui_core_NavList_NavMenu),
   '@digigov/ui/core/NavList/NavMenuContainer': lazyImport(_digigov_ui_core_NavList_NavMenuContainer),
   '@digigov/ui/core/NavList/NavMenuContainerContent': lazyImport(_digigov_ui_core_NavList_NavMenuContainerContent),
@@ -345,13 +361,19 @@ export default {
   '@digigov/ui/govgr/images/minedu-logo-black-base64': lazyImport(_digigov_ui_govgr_images_minedu_logo_black_base64),
   '@digigov/ui/govgr': lazyImport(_digigov_ui_govgr),
   '@digigov/ui/hooks/useDebounce': lazyImport(_digigov_ui_hooks_useDebounce),
+  '@digigov/ui/hooks/useFontSize': lazyImport(_digigov_ui_hooks_useFontSize),
+  '@digigov/ui/hooks/useHighlightLinks': lazyImport(_digigov_ui_hooks_useHighlightLinks),
   '@digigov/ui/hooks/useKeypress': lazyImport(_digigov_ui_hooks_useKeypress),
   '@digigov/ui/hooks/useLatest': lazyImport(_digigov_ui_hooks_useLatest),
+  '@digigov/ui/hooks/useLetterSpacing': lazyImport(_digigov_ui_hooks_useLetterSpacing),
+  '@digigov/ui/hooks/useLineHeight': lazyImport(_digigov_ui_hooks_useLineHeight),
   '@digigov/ui/hooks/useNavList': lazyImport(_digigov_ui_hooks_useNavList),
   '@digigov/ui/hooks/useOutdatedBrowserCheck': lazyImport(_digigov_ui_hooks_useOutdatedBrowserCheck),
   '@digigov/ui/hooks/useSearch': lazyImport(_digigov_ui_hooks_useSearch),
   '@digigov/ui/hooks/useTheme': lazyImport(_digigov_ui_hooks_useTheme),
-  '@digigov/ui/hooks/useTogglableSections': lazyImport(_digigov_ui_hooks_useTogglableSections),
+  '@digigov/ui/hooks/useTogglableNav': lazyImport(_digigov_ui_hooks_useTogglableNav),
+  '@digigov/ui/hooks/useTogglableTab': lazyImport(_digigov_ui_hooks_useTogglableTab),
+  '@digigov/ui/hooks/useVariantVars': lazyImport(_digigov_ui_hooks_useVariantVars),
   '@digigov/ui': lazyImport(_digigov_ui),
   '@digigov/ui/layouts/Basic/Aside': lazyImport(_digigov_ui_layouts_Basic_Aside),
   '@digigov/ui/layouts/Basic/Bottom': lazyImport(_digigov_ui_layouts_Basic_Bottom),