@digigov/ui 2.0.0-f2d82d25 → 2.0.0-rc.0

package/navigation/NavList/__stories__/VerticalWithoutDrawer/index.js

@@ -1,41 +0,0 @@
-import _extends from "@babel/runtime/helpers/extends";
-import React from 'react';
-import Link from '@digigov/ui/navigation/Link';
-import { Nav, NavList, NavListItemAction, NavMenuContainer, NavMenuContent, NavMenuContentList, NavMenuContentListItem, NavMenuTitle } from '@digigov/ui/navigation/NavList';
-import links from '@digigov/ui/navigation/NavList/__stories__/NavLinksWithSubmenu.json';
-import { useNavList } from '@digigov/ui/navigation/NavList/hooks/useNavList';
-export var VerticalWithoutDrawer = function VerticalWithoutDrawer() {
-  var layout = 'vertical';
-  var border = false;
-  var _useNavList = useNavList(),
-    registerNavItemMenu = _useNavList.registerNavItemMenu,
-    registerNavItem = _useNavList.registerNavItem;
-  return /*#__PURE__*/React.createElement(Nav, {
-    border: border,
-    "aria-orientation": layout || 'horizontal',
-    "aria-label": "navigation list"
-  }, /*#__PURE__*/React.createElement(NavList, {
-    layout: layout
-  }, links.map(function (item, key) {
-    var _item$subMenu;
-    return /*#__PURE__*/React.createElement(React.Fragment, {
-      key: key
-    }, /*#__PURE__*/React.createElement(NavListItemAction, registerNavItem(item), item.label), item.subMenu && /*#__PURE__*/React.createElement(NavMenuContainer, _extends({
-      layout: layout,
-      paddingLeft: 5,
-      paddingRight: 5
-    }, registerNavItemMenu(item.name)), /*#__PURE__*/React.createElement(NavMenuTitle, null, item.label), /*#__PURE__*/React.createElement(NavMenuContent, null, /*#__PURE__*/React.createElement(NavMenuContentList, {
-      role: "menu"
-    }, (_item$subMenu = item.subMenu) === null || _item$subMenu === void 0 ? void 0 : _item$subMenu.map(function (subMenu, menuIndex) {
-      return (subMenu === null || subMenu === void 0 ? void 0 : subMenu.href) && /*#__PURE__*/React.createElement(NavMenuContentListItem, {
-        key: menuIndex,
-        role: "presentation"
-      }, /*#__PURE__*/React.createElement(Link, {
-        role: "menuitem",
-        id: subMenu.name,
-        href: subMenu.href
-      }, subMenu.label));
-    })))));
-  })));
-};
-export default VerticalWithoutDrawer;

package/navigation/NavList/__stories__/VerticalWithoutDrawer/package.json

@@ -1,6 +0,0 @@
-{
-  "sideEffects": false,
-  "module": "./index.js",
-  "types": "./index.d.ts",
-  "main": "../../../../cjs/navigation/NavList/__stories__/VerticalWithoutDrawer/index.js"
-}

package/navigation/NavList/__stories__/VerticalWithoutDrawer.d.ts

@@ -1,3 +0,0 @@
-/// <reference types="react" />
-export declare const VerticalWithoutDrawer: () => JSX.Element;
-export default VerticalWithoutDrawer;

package/navigation/NavList/hooks/useNavList/index.js

@@ -1,37 +0,0 @@
-import _extends from "@babel/runtime/helpers/extends";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-var _excluded = ["registerButton", "registerLink", "opened"];
-import { useCallback, useRef } from 'react';
-import { useTogglableNav } from '@digigov/ui/navigation/NavList/hooks/useTogglableNav';
-export var useNavList = function useNavList() {
-  var registeredContainers = useRef({});
-  var _useTogglableNav = useTogglableNav({
-      singleOpen: true,
-      toggleOpenClose: true,
-      toggleParentOpen: true,
-      toggleProperty: 'active',
-      onToggleProperty: 'onClick',
-      ariaNavigation: true
-    }),
-    registerButton = _useTogglableNav.registerButton,
-    registerLink = _useTogglableNav.registerLink,
-    opened = _useTogglableNav.opened,
-    rest = _objectWithoutProperties(_useTogglableNav, _excluded);
-  var registerNavItemMenu = useCallback(function (key) {
-    return {
-      ref: function ref(el) {
-        if (el && !registeredContainers.current[el.id]) {
-          registeredContainers.current[el.id] = el;
-        }
-      },
-      active: opened[key],
-      id: key
-    };
-  }, [opened]);
-  return _extends({
-    registerButton: registerButton,
-    registerLink: registerLink,
-    opened: opened,
-    registerNavItemMenu: registerNavItemMenu
-  }, rest);
-};

package/navigation/NavList/hooks/useNavList/package.json

@@ -1,6 +0,0 @@
-{
-  "sideEffects": false,
-  "module": "./index.js",
-  "types": "./index.d.ts",
-  "main": "../../../../cjs/navigation/NavList/hooks/useNavList/index.js"
-}

package/navigation/NavList/hooks/useNavList.d.ts

@@ -1,8 +0,0 @@
-import { UseTogglableNavReturn } from '@digigov/ui/navigation/NavList/hooks/useTogglableNav';
-export interface UseNavListReturn extends UseTogglableNavReturn {
-    registerNavItemMenu: (key: string) => {
-        active: boolean;
-        id: string;
-    };
-}
-export declare const useNavList: () => UseNavListReturn;

package/navigation/NavList/hooks/useTogglableNav/index.js

@@ -1,264 +0,0 @@
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import _extends from "@babel/runtime/helpers/extends";
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-/* eslint-disable no-case-declarations */
-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 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 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 registerButton = useCallback(function (key) {
-    var isOpen = !!opened[key];
-    return _extends(_defineProperty(_defineProperty(_defineProperty({
-      ref: registerButtonRef
-    }, toggleProperty, isOpen), onToggleProperty, toggle), 'aria-controls', "".concat(key)), ariaNavigation && {
-      onKeyDown: onKeyDown
-    });
-  }, [opened]);
-  var registerLink = useCallback(function (key) {
-    return _extends({
-      ref: registerLinkRef,
-      'aria-controls': "".concat(key)
-    }, ariaNavigation && {
-      onKeyDown: onKeyDown
-    });
-  }, [opened]);
-  var registerNavItem = useCallback(function (item) {
-    if (item.subMenu || item.menu) {
-      return _extends({}, registerButton(item.name), {
-        role: 'button'
-      });
-    } else if (item.href) {
-      return _extends({}, registerLink(item.name), {
-        href: item.href
-      });
-    } else {
-      console.error(item);
-      throw new Error('Invalid nav item. Must be either button or link');
-    }
-  }, [opened]);
-  return useMemo(function () {
-    return {
-      registerNavItem: registerNavItem,
-      registerButton: registerButton,
-      registerLink: registerLink,
-      registered: registered,
-      opened: opened,
-      toggle: toggle,
-      setOpened: setOpened
-    };
-  }, [opened]);
-}

package/navigation/NavList/hooks/useTogglableNav/package.json

@@ -1,6 +0,0 @@
-{
-  "sideEffects": false,
-  "module": "./index.js",
-  "types": "./index.d.ts",
-  "main": "../../../../cjs/navigation/NavList/hooks/useTogglableNav/index.js"
-}

package/navigation/NavList/hooks/useTogglableNav.d.ts

@@ -1,26 +0,0 @@
-export interface UseTogglableNavInterface {
-    toggleProperty: string;
-    singleOpen?: boolean;
-    toggleOpenClose?: boolean;
-    toggleParentOpen?: boolean;
-    onToggleProperty: string;
-    initial?: Record<string, boolean>;
-    firstOpen?: boolean;
-    ariaNavigation?: boolean;
-    toggleHook?: (id: string) => void;
-}
-export interface UseTogglableNavReturn {
-    registerButton: (el: string) => any;
-    registerLink: (el: string) => any;
-    registerNavItem: (item: any) => any;
-    registered: {
-        current: Record<string, {
-            el: HTMLElement;
-            type: string;
-        }>;
-    };
-    opened: Record<string, boolean>;
-    toggle: (id: string) => void;
-    setOpened: (opened: ((curOpened: Record<string, boolean>) => Record<string, boolean>) | Record<string, boolean>) => void;
-}
-export declare function useTogglableNav({ toggleProperty, toggleOpenClose, toggleParentOpen, onToggleProperty, initial, ariaNavigation, toggleHook, }: UseTogglableNavInterface): UseTogglableNavReturn;

package/navigation/NavList/index.d.ts

@@ -1,17 +0,0 @@
-import NavList from '@digigov/react-core/NavList';
-export * from '@digigov/ui/navigation/NavList/NavListAuto';
-export * from '@digigov/ui/navigation/NavList/NavMenuContentList';
-export * from '@digigov/ui/navigation/NavList/types';
-export * from '@digigov/ui/navigation/NavList/hooks/useNavList';
-export * from '@digigov/react-core/Nav';
-export * from '@digigov/react-core/NavList';
-export * from '@digigov/react-core/NavMenuContainer';
-export * from '@digigov/react-core/NavMenuContent';
-export * from '@digigov/react-core/NavMenuContentListBase';
-export * from '@digigov/react-core/NavMenuContentListItem';
-export * from '@digigov/react-core/NavMenuTitle';
-export * from '@digigov/react-core/NavListItemActionContainer';
-export * from '@digigov/react-core/NavListItemAction';
-export * from '@digigov/react-core/NavListItemLink';
-export * from '@digigov/react-core/NavListItemButton';
-export default NavList;

package/navigation/NavList/index.js

@@ -1,17 +0,0 @@
-import NavList from '@digigov/react-core/NavList';
-export * from '@digigov/ui/navigation/NavList/NavListAuto';
-export * from '@digigov/ui/navigation/NavList/NavMenuContentList';
-export * from '@digigov/ui/navigation/NavList/types';
-export * from '@digigov/ui/navigation/NavList/hooks/useNavList';
-export * from '@digigov/react-core/Nav';
-export * from '@digigov/react-core/NavList';
-export * from '@digigov/react-core/NavMenuContainer';
-export * from '@digigov/react-core/NavMenuContent';
-export * from '@digigov/react-core/NavMenuContentListBase';
-export * from '@digigov/react-core/NavMenuContentListItem';
-export * from '@digigov/react-core/NavMenuTitle';
-export * from '@digigov/react-core/NavListItemActionContainer';
-export * from '@digigov/react-core/NavListItemAction';
-export * from '@digigov/react-core/NavListItemLink';
-export * from '@digigov/react-core/NavListItemButton';
-export default NavList;

package/navigation/NavList/index.mdx

@@ -1,44 +0,0 @@
----
-id: nav-list
-title: NavList
----
-
-```bash
-import NavList, { NavListItem } from '@digigov/ui/navigation/NavList';
-```
-
-## How to use
-
-### Horizontal NavList
-
-<Story
-  packageName="@digigov/ui"
-  component="navigation/NavList"
-  story="Default.tsx"
-/>
-
-### Vertical NavList
-
-<Story
-  packageName="@digigov/ui"
-  component="navigation/NavList"
-  story="Vertical.tsx"
-/>
-
-### NavListAuto
-
-<Story
-  packageName="@digigov/ui"
-  component="navigation/NavList"
-  story="UsingNavListAuto.tsx"
-/>
-
-## Accessibility
-
-You can read more about the accessibility patterns used in our NavList
-implementation in the ARIA Authoring Practices Guide (APG) at
-[Menu or Menu bar](https://www.w3.org/WAI/ARIA/apg/patterns/menu/).
-
-## API
-
-<PropTypes packageName="@digigov/ui" component="NavList" />

package/navigation/NavList/index.spec/index.js

@@ -1,6 +0,0 @@
-import * as React from 'react';
-import Component from '@digigov/ui/navigation/NavList';
-var _ref = /*#__PURE__*/React.createElement(Component, null, "this is some random warning text");
-it('renders the ErrorSummary with sample data', function () {
-  expect(_ref).toMatchSnapshot();
-});

package/navigation/NavList/index.spec/package.json

@@ -1,6 +0,0 @@
-{
-  "sideEffects": false,
-  "module": "./index.js",
-  "types": "./index.d.ts",
-  "main": "../../../cjs/navigation/NavList/index.spec/index.js"
-}

package/navigation/NavList/index.spec.d.ts

@@ -1 +0,0 @@
-export {};

package/navigation/NavList/package.json

@@ -1,6 +0,0 @@
-{
-  "sideEffects": false,
-  "module": "./index.js",
-  "types": "./index.d.ts",
-  "main": "../../cjs/navigation/NavList/index.js"
-}

package/navigation/NavList/types/index.js

@@ -1 +0,0 @@
-export {};

package/navigation/NavList/types/package.json

@@ -1,6 +0,0 @@
-{
-  "sideEffects": false,
-  "module": "./index.js",
-  "types": "./index.d.ts",
-  "main": "../../../cjs/navigation/NavList/types/index.js"
-}

package/navigation/NavList/types.d.ts

@@ -1,53 +0,0 @@
-import React from 'react';
-import { BaseCSSProperties } from '@material-ui/core/styles/withStyles';
-import { NavProps } from '@digigov/ui/navigation/NavList';
-export type NavListLayout = 'horizontal' | 'vertical';
-interface NavListItemMenuInterface {
-    links: NavListItemLinkInterface[];
-    title?: string;
-}
-export interface NavLinkInterface {
-    label?: string;
-    name: string;
-    href?: string;
-    subMenuHeading?: string;
-    subMenu?: NavLinkInterface[];
-    menu?: NavListItemMenuInterface;
-}
-export interface NavListAutoProps extends NavProps {
-    children?: React.ReactNode;
-    className?: string;
-    layout?: NavListLayout;
-    border?: boolean;
-    fixed?: boolean;
-    role?: string;
-    openSubMenus?: boolean;
-    floating?: boolean;
-    subMenu?: boolean;
-    links?: NavLinkInterface[];
-    style?: BaseCSSProperties;
-}
-export interface NavListHeaderItemType {
-    name: string;
-    label?: string;
-    title?: string;
-    children?: React.ReactNode;
-    menu: {
-        links: NavListItemLinkInterface[];
-    };
-}
-interface NavListItemInterface {
-    name: string;
-    label?: string;
-}
-interface NavListItemLinkInterface extends NavListItemInterface {
-    href: string;
-}
-export type NavListItemType = NavListItemLinkInterface | NavListItemMenuContainerInterface | NavListItemSubMenuInterface;
-export interface NavListItemMenuContainerInterface extends NavListItemInterface {
-    menu: NavListItemMenuInterface[];
-}
-export interface NavListItemSubMenuInterface extends NavListItemInterface {
-    subMenu: NavListItemType[];
-}
-export {};

package/navigation/Pagination/Pagination.stories/index.js

@@ -1,15 +0,0 @@
-import Pagination from '@digigov/ui/navigation/Pagination';
-export default {
-  title: 'Digigov UI/navigation/Pagination',
-  description: 'Use the pagination component to let users browse through a long list.',
-  link: 'https://guide.services.gov.gr/docs/patterns/admin-pages/components/pagination',
-  component: Pagination,
-  displayName: 'Pagination'
-};
-export * from '@digigov/ui/navigation/Pagination/__stories__/Default';
-export * from '@digigov/ui/navigation/Pagination/__stories__/WithInactiveValues';
-export * from '@digigov/ui/navigation/Pagination/__stories__/WithResultsPerPage';
-export * from '@digigov/ui/navigation/Pagination/__stories__/PaginationSmall';
-export * from '@digigov/ui/navigation/Pagination/__stories__/PaginationWithSmallFont';
-export * from '@digigov/ui/navigation/Pagination/__stories__/WithHook';
-export * from '@digigov/ui/navigation/Pagination/__stories__/Auto';

package/navigation/Pagination/Pagination.stories/package.json

@@ -1,6 +0,0 @@
-{
-  "sideEffects": false,
-  "module": "./index.js",
-  "types": "./index.d.ts",
-  "main": "../../../cjs/navigation/Pagination/Pagination.stories/index.js"
-}

package/navigation/Pagination/Pagination.stories.d.ts

@@ -1,16 +0,0 @@
-declare namespace _default {
-    export let title: string;
-    export let description: string;
-    export let link: string;
-    export { Pagination as component };
-    export let displayName: string;
-}
-export default _default;
-export * from "@digigov/ui/navigation/Pagination/__stories__/Default";
-export * from "@digigov/ui/navigation/Pagination/__stories__/WithInactiveValues";
-export * from "@digigov/ui/navigation/Pagination/__stories__/WithResultsPerPage";
-export * from "@digigov/ui/navigation/Pagination/__stories__/PaginationSmall";
-export * from "@digigov/ui/navigation/Pagination/__stories__/PaginationWithSmallFont";
-export * from "@digigov/ui/navigation/Pagination/__stories__/WithHook";
-export * from "@digigov/ui/navigation/Pagination/__stories__/Auto";
-import Pagination from '@digigov/ui/navigation/Pagination';

package/navigation/Pagination/Pagination.stories.playwright.json

@@ -1,27 +0,0 @@
-{
-  "version": "4",
-  "stories": {
-    "digigov-ui-navigation-pagination--default": {
-      "actionSets": [
-        {
-          "actions": [
-            {
-              "name": "hover",
-              "args": {
-                "selector": "html>body>div:nth-child(5)>nav:nth-child(1)>ul>li:nth-child(4)>a"
-              }
-            },
-            {
-              "name": "click",
-              "args": {
-                "selector": "html>body>div:nth-child(5)>nav:nth-child(1)>ul>li:nth-child(4)>a"
-              }
-            }
-          ],
-          "id": "2mzsrAipphk8",
-          "title": "Hover and click no3"
-        }
-      ]
-    }
-  }
-}