@digigov/ui 1.2.0-dcbd7ded → 2.0.0-4be8f7cc

package/cjs/layouts/Basic/index.mdx

@@ -1,40 +1,42 @@
 ---
 id: basic
 title: Basic Layout
-parent: docs/ui/components
 ---
 
-# BasicLayout
+# Layout
 
-Use the BasicLayout component to create a basic page layout.
+The Layout component is used in combination with the Top, Side, Main,
+Content and Bottom components.
 
-```jsx live path=layouts/Basic/index.tsx
-import BasicLayout, { Top, Aside, Main , Container, Bottom } from '@digigov/ui/layouts/Basic';
-function CustomLayout (props){
- return (
-    <BasicLayout>
-      <Top>Header content</Top>
-      <Container>
-        <Main>Main content</Main>
-        <Aside>Side content</Aside>
-      </Container>
-      <Bottom>Bottom content</Bottom>
-    </BasicLayout>
- )
-}
-export CustomLayout
+## How to use
 
-```
+### Default layout
 
-<br />
+<Story
+  packageName="@digigov/ui"
+  component="layouts/Basic"
+  story="Default.tsx"
+/>
 
-## How it works
+### Two thirds one third columns layout
+<Story
+  packageName="@digigov/ui"
+  component="layouts/Basic"
+  story="TwoThirdsOneThirdColumns.tsx"
+/>
 
-The BasicLayout component is used in combination with the Top, Side, Main,
-Content and Bottom components.
+  ### Multiple rows lyout
+
+<Story
+  packageName="@digigov/ui"
+  component="layouts/Basic"
+  story="MultipleRowsLayout.tsx"
+/>
 
 ## API
 
-### Properties
+See below for a complete reference to all of the props  available to the components mentioned here.
+
+<ComponentProps componentName={["Layout"]} /> 
+
 
-<br />

package/cjs/layouts/Grid/index.mdx

@@ -0,0 +1,39 @@
+---
+id: grid
+title: Grid
+---
+
+## How to use
+
+Grid compoment is a  layout system that allows you to design complex web page layouts with rows and columns.
+
+
+### Default Grid
+
+<Story
+  packageName="@digigov/ui"
+  component="layouts/Grid"
+  story="Default.tsx"
+/>
+
+### Responsive spacing Grid
+
+<Story
+  packageName="@digigov/ui"
+  component="layouts/Grid"
+  story="ResponsiveSpacing.tsx"
+/>
+
+### Inline Grid
+
+<Story
+  packageName="@digigov/ui"
+  component="layouts/Grid"
+  story="Inline.tsx"
+/>
+
+## API
+
+See below for a complete reference to all of the props  available to the components mentioned here.
+
+<ComponentProps componentName={["Grid"]} /> 

package/cjs/lazy/index.js

@@ -613,6 +613,15 @@ var _default = exports["default"] = {
       };
     });
   }),
+  'Skeleton': /*#__PURE__*/(0, _react.lazy)(function () {
+    return Promise.resolve().then(function () {
+      return _interopRequireWildcard(require('@digigov/ui/app/Skeleton'));
+    }).then(function (module) {
+      return {
+        "default": module['Skeleton']
+      };
+    });
+  }),
   'AccordionAuto': /*#__PURE__*/(0, _react.lazy)(function () {
     return Promise.resolve().then(function () {
       return _interopRequireWildcard(require('@digigov/ui/content/Accordion/auto'));
@@ -1405,6 +1414,15 @@ var _default = exports["default"] = {
       };
     });
   }),
+  'AutoCompleteContainer': /*#__PURE__*/(0, _react.lazy)(function () {
+    return Promise.resolve().then(function () {
+      return _interopRequireWildcard(require('@digigov/ui/form/AutoComplete'));
+    }).then(function (module) {
+      return {
+        "default": module['AutoCompleteContainer']
+      };
+    });
+  }),
   'AutoCompleteInput': /*#__PURE__*/(0, _react.lazy)(function () {
     return Promise.resolve().then(function () {
       return _interopRequireWildcard(require('@digigov/ui/form/AutoComplete'));
@@ -1423,30 +1441,39 @@ var _default = exports["default"] = {
       };
     });
   }),
-  'AutoCompleteResultList': /*#__PURE__*/(0, _react.lazy)(function () {
+  'AutoCompleteMultipleInput': /*#__PURE__*/(0, _react.lazy)(function () {
     return Promise.resolve().then(function () {
       return _interopRequireWildcard(require('@digigov/ui/form/AutoComplete'));
     }).then(function (module) {
       return {
-        "default": module['AutoCompleteResultList']
+        "default": module['AutoCompleteMultipleInput']
       };
     });
   }),
-  'AutoCompleteResultListItem': /*#__PURE__*/(0, _react.lazy)(function () {
+  'AutoCompleteMultipleInputContainer': /*#__PURE__*/(0, _react.lazy)(function () {
     return Promise.resolve().then(function () {
       return _interopRequireWildcard(require('@digigov/ui/form/AutoComplete'));
     }).then(function (module) {
       return {
-        "default": module['AutoCompleteResultListItem']
+        "default": module['AutoCompleteMultipleInputContainer']
+      };
+    });
+  }),
+  'AutoCompleteResultList': /*#__PURE__*/(0, _react.lazy)(function () {
+    return Promise.resolve().then(function () {
+      return _interopRequireWildcard(require('@digigov/ui/form/AutoComplete'));
+    }).then(function (module) {
+      return {
+        "default": module['AutoCompleteResultList']
       };
     });
   }),
-  'AutoCompleteWrapper': /*#__PURE__*/(0, _react.lazy)(function () {
+  'AutoCompleteResultListItem': /*#__PURE__*/(0, _react.lazy)(function () {
     return Promise.resolve().then(function () {
       return _interopRequireWildcard(require('@digigov/ui/form/AutoComplete'));
     }).then(function (module) {
       return {
-        "default": module['AutoCompleteWrapper']
+        "default": module['AutoCompleteResultListItem']
       };
     });
   }),
@@ -1459,12 +1486,12 @@ var _default = exports["default"] = {
       };
     });
   }),
-  'AutoCompleteStatusWrapper': /*#__PURE__*/(0, _react.lazy)(function () {
+  'AutoCompleteStatusContainer': /*#__PURE__*/(0, _react.lazy)(function () {
     return Promise.resolve().then(function () {
       return _interopRequireWildcard(require('@digigov/ui/form/AutoComplete/Status'));
     }).then(function (module) {
       return {
-        "default": module['AutoCompleteStatusWrapper']
+        "default": module['AutoCompleteStatusContainer']
       };
     });
   }),
@@ -1945,6 +1972,114 @@ var _default = exports["default"] = {
       };
     });
   }),
+  'CancelIcon': /*#__PURE__*/(0, _react.lazy)(function () {
+    return Promise.resolve().then(function () {
+      return _interopRequireWildcard(require('@digigov/ui/utils/SvgIcon'));
+    }).then(function (module) {
+      return {
+        "default": module['CancelIcon']
+      };
+    });
+  }),
+  'LockIcon': /*#__PURE__*/(0, _react.lazy)(function () {
+    return Promise.resolve().then(function () {
+      return _interopRequireWildcard(require('@digigov/ui/utils/SvgIcon'));
+    }).then(function (module) {
+      return {
+        "default": module['LockIcon']
+      };
+    });
+  }),
+  'DownloadIcon': /*#__PURE__*/(0, _react.lazy)(function () {
+    return Promise.resolve().then(function () {
+      return _interopRequireWildcard(require('@digigov/ui/utils/SvgIcon'));
+    }).then(function (module) {
+      return {
+        "default": module['DownloadIcon']
+      };
+    });
+  }),
+  'PdfFileIcon': /*#__PURE__*/(0, _react.lazy)(function () {
+    return Promise.resolve().then(function () {
+      return _interopRequireWildcard(require('@digigov/ui/utils/SvgIcon'));
+    }).then(function (module) {
+      return {
+        "default": module['PdfFileIcon']
+      };
+    });
+  }),
+  'PlusIcon': /*#__PURE__*/(0, _react.lazy)(function () {
+    return Promise.resolve().then(function () {
+      return _interopRequireWildcard(require('@digigov/ui/utils/SvgIcon'));
+    }).then(function (module) {
+      return {
+        "default": module['PlusIcon']
+      };
+    });
+  }),
+  'MinusIcon': /*#__PURE__*/(0, _react.lazy)(function () {
+    return Promise.resolve().then(function () {
+      return _interopRequireWildcard(require('@digigov/ui/utils/SvgIcon'));
+    }).then(function (module) {
+      return {
+        "default": module['MinusIcon']
+      };
+    });
+  }),
+  'LoginIcon': /*#__PURE__*/(0, _react.lazy)(function () {
+    return Promise.resolve().then(function () {
+      return _interopRequireWildcard(require('@digigov/ui/utils/SvgIcon'));
+    }).then(function (module) {
+      return {
+        "default": module['LoginIcon']
+      };
+    });
+  }),
+  'RestoreIcon': /*#__PURE__*/(0, _react.lazy)(function () {
+    return Promise.resolve().then(function () {
+      return _interopRequireWildcard(require('@digigov/ui/utils/SvgIcon'));
+    }).then(function (module) {
+      return {
+        "default": module['RestoreIcon']
+      };
+    });
+  }),
+  'ReplyIcon': /*#__PURE__*/(0, _react.lazy)(function () {
+    return Promise.resolve().then(function () {
+      return _interopRequireWildcard(require('@digigov/ui/utils/SvgIcon'));
+    }).then(function (module) {
+      return {
+        "default": module['ReplyIcon']
+      };
+    });
+  }),
+  'ChatIcon': /*#__PURE__*/(0, _react.lazy)(function () {
+    return Promise.resolve().then(function () {
+      return _interopRequireWildcard(require('@digigov/ui/utils/SvgIcon'));
+    }).then(function (module) {
+      return {
+        "default": module['ChatIcon']
+      };
+    });
+  }),
+  'ExclamationIcon': /*#__PURE__*/(0, _react.lazy)(function () {
+    return Promise.resolve().then(function () {
+      return _interopRequireWildcard(require('@digigov/ui/utils/SvgIcon'));
+    }).then(function (module) {
+      return {
+        "default": module['ExclamationIcon']
+      };
+    });
+  }),
+  'PrintIcon': /*#__PURE__*/(0, _react.lazy)(function () {
+    return Promise.resolve().then(function () {
+      return _interopRequireWildcard(require('@digigov/ui/utils/SvgIcon'));
+    }).then(function (module) {
+      return {
+        "default": module['PrintIcon']
+      };
+    });
+  }),
   'ImageLogo': /*#__PURE__*/(0, _react.lazy)(function () {
     return Promise.resolve().then(function () {
       return _interopRequireWildcard(require('@digigov/ui/icons/ImageLogo'));
@@ -2656,6 +2791,15 @@ var _default = exports["default"] = {
       };
     });
   }),
+  'Typography': /*#__PURE__*/(0, _react.lazy)(function () {
+    return Promise.resolve().then(function () {
+      return _interopRequireWildcard(require('@digigov/ui/typography/Typography'));
+    }).then(function (module) {
+      return {
+        "default": module['Typography']
+      };
+    });
+  }),
   'Base': /*#__PURE__*/(0, _react.lazy)(function () {
     return Promise.resolve().then(function () {
       return _interopRequireWildcard(require('@digigov/ui/utils/Base'));
@@ -2754,14 +2898,5 @@ var _default = exports["default"] = {
         "default": module['CodeBlock']
       };
     });
-  }),
-  'Typography': /*#__PURE__*/(0, _react.lazy)(function () {
-    return Promise.resolve().then(function () {
-      return _interopRequireWildcard(require('@digigov/ui/utils/Typography'));
-    }).then(function (module) {
-      return {
-        "default": module['Typography']
-      };
-    });
   })
 };

package/cjs/navigation/BackLink/index.mdx

@@ -7,10 +7,6 @@ title: Back Link
 
 Use the back link component to help users go back to the previous page in a multi-page transaction.
 
-```bash
-import BackLink from "@digigov/ui/navigation/BackLink";
-```
-
 ## How to use
 
 <Story
@@ -21,4 +17,7 @@ import BackLink from "@digigov/ui/navigation/BackLink";
 
 ## API
 
-<PropTypes packageName="@digigov/ui" component="BackLink" />
+See below for a complete reference to all of the props  available to the components mentioned here.
+
+<ComponentProps componentName={["BackLink"]} />
+

package/cjs/navigation/Breadcrumbs/index.mdx

@@ -9,10 +9,6 @@ This component is currently experimental because adding a summary line with more
 
 The Breadcrumbs component lets users show and hide sections of related content on a page.
 
-```bash
-import Breadcrumbs from '@digigov/ui/navigation/Breadcrumbs';
-```
-
 ## How to use
 
 <Story
@@ -28,4 +24,9 @@ implementation in the ARIA Authoring Practices Guide (APG) at [Breadcrumbs](http
 
 ## API
 
-<PropTypes packageName="@digigov/ui" component="Breadcrumbs" />
+See below for a complete reference to all of the props  available to the components mentioned here.
+
+<ComponentProps componentName={[
+  "Breadcrumbs",
+  "BreadcrumbsList",
+  "BreadcrumbsListItem"]} />

package/cjs/navigation/Drawer/index.mdx

@@ -3,18 +3,12 @@ id: drawer
 title: Drawer
 ---
 
-```bash
-import Drawer from '@digigov/ui/app/Drawer';
-```
-
 ## How to use
 
-<Story
-  packageName="@digigov/ui"
-  component="navigation/Drawer"
-  story="Default.tsx"
-/>
+<Story packageName="@digigov/ui" component="navigation/Drawer" story="Default.tsx" />
 
 ## API
 
-<PropTypes packageName="@digigov/ui" component="Drawer" />
+See below for a complete reference to all of the props  available to the components mentioned here.
+
+<ComponentProps componentName={["Drawer", "DrawerHeading",]} />

package/cjs/navigation/Dropdown/Dropdown.stories/index.js

@@ -115,6 +115,18 @@ Object.keys(_ContentPosition).forEach(function (key) {
     }
   });
 });
+var _ScrollableContent = require("@digigov/ui/navigation/Dropdown/__stories__/ScrollableContent");
+Object.keys(_ScrollableContent).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _ScrollableContent[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _ScrollableContent[key];
+    }
+  });
+});
 var _Dense = require("@digigov/ui/navigation/Dropdown/__stories__/Dense");
 Object.keys(_Dense).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;

package/cjs/navigation/Dropdown/Dropdown.stories.playwright.json

@@ -64,6 +64,22 @@
           "title": "Open dropdown action"
         }
       ]
+    },
+    "digigov-ui-navigation-dropdown--scrollable-content": {
+      "actionSets": [
+        {
+          "actions": [
+            {
+              "name": "click",
+              "args": {
+                "selector": "html>body>div:nth-child(5)>details>summary"
+              }
+            }
+          ],
+          "id": "rZUYM--IzpfW",
+          "title": "open content"
+        }
+      ]
     }
   }
 }

package/cjs/navigation/Dropdown/__stories__/ScrollableContent/index.js

@@ -0,0 +1,68 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.ScrollableContent = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _Dropdown = require("@digigov/ui/navigation/Dropdown");
+var _NavList = require("@digigov/ui/navigation/NavList");
+var data = [{
+  name: 'Item 1',
+  href: '#'
+}, {
+  name: 'Item 2',
+  href: '#'
+}, {
+  name: 'Item 3',
+  href: '#'
+}, {
+  name: 'Item 4',
+  href: '#'
+}, {
+  name: 'Item 5',
+  href: '#'
+}, {
+  name: 'Item 6',
+  href: '#'
+}, {
+  name: 'Item 7',
+  href: '#'
+}, {
+  name: 'Item 8',
+  href: '#'
+}, {
+  name: 'Item 9',
+  href: '#'
+}, {
+  name: 'Item 10',
+  href: '#'
+}, {
+  name: 'Item 11',
+  href: '#'
+}, {
+  name: 'Item 12',
+  href: '#'
+}];
+var _ref = /*#__PURE__*/_react["default"].createElement(_Dropdown.DropdownButton, {
+  role: "button",
+  "aria-haspopup": "true",
+  "aria-controls": "menu2",
+  arrow: true
+}, "\u0395\u03BD\u03AD\u03C1\u03B3\u03B5\u03B9\u03B5\u03C2");
+var ScrollableContent = exports.ScrollableContent = function ScrollableContent() {
+  return /*#__PURE__*/_react["default"].createElement(_Dropdown.Dropdown, null, _ref, /*#__PURE__*/_react["default"].createElement(_Dropdown.DropdownContent, {
+    role: "menu",
+    id: "menu2",
+    scrollable: true
+  }, /*#__PURE__*/_react["default"].createElement(_NavList.NavList, {
+    layout: "vertical"
+  }, data.map(function (item) {
+    return /*#__PURE__*/_react["default"].createElement(_NavList.NavListItemAction, {
+      role: "menuitem",
+      href: item.href
+    }, item.name);
+  }))));
+};
+var _default = exports["default"] = ScrollableContent;

package/cjs/navigation/Dropdown/index.mdx

@@ -5,10 +5,6 @@ title: Dropdown
 
 # Dropdown
 
-```bash
-import Dropdown from '@digigov/ui/navigation/Dropdown';
-```
-
 ## How to use
 
 <Story
@@ -39,4 +35,6 @@ You can display the dropdown menu to the top of the `Dropdown` button.
 
 ## API
 
-<PropTypes packageName="@digigov/ui" component="Dropdown" />
+See below for a complete reference to all of the props  available to the components mentioned here.
+
+<ComponentProps componentName={["DropdownBase","DropdownButton","DropdownContent"]} /> 

package/cjs/navigation/Link/index.mdx

@@ -3,10 +3,6 @@ id: link
 title: Link
 ---
 
-```bash
-import Link from '@digigov/ui/navigation/Link';
-```
-
 ## How to use
 
 ### Default
@@ -35,19 +31,11 @@ import Link from '@digigov/ui/navigation/Link';
 
 ### At dark background
 
-<Story
-  packageName="@digigov/ui"
-  component="navigation/Link"
-  story="DarkBackground.tsx"
-/>
+<Story packageName="@digigov/ui" component="navigation/Link" story="DarkBackground.tsx" />
 
 ### At dark background and no underline
 
-<Story
-  packageName="@digigov/ui"
-  component="navigation/Link"
-  story="DarkBackgroundNoUnderline.tsx"
-/>
+<Story packageName="@digigov/ui" component="navigation/Link" story="DarkBackgroundNoUnderline.tsx" />
 
 ### Accessibility
 
@@ -57,4 +45,6 @@ implementation in the ARIA Authoring Practices Guide (APG) at
 
 ## API
 
-<PropTypes packageName="@digigov/ui" component="Link" />
+See below for a complete reference to all of the props  available to the components mentioned here.
+
+<ComponentProps componentName={["LinkBase"]} /> 

package/cjs/navigation/NavList/__stories__/Default/index.js

@@ -10,9 +10,21 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _react = _interopRequireWildcard(require("react"));
 var _NavList = require("@digigov/ui/navigation/NavList");
-var _NavLinksOneLevel = _interopRequireDefault(require("@digigov/ui/navigation/NavList/__stories__/NavLinksOneLevel.json"));
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+var links = [{
+  "name": "home",
+  "href": "#home",
+  "label": "Αρχική"
+}, {
+  "name": "educational",
+  "label": "Εκπαιδευτικό υλικό",
+  "href": "#educational"
+}, {
+  "name": "news",
+  "href": "#news",
+  "label": "Νέα"
+}];
 var Default = exports.Default = function Default() {
   var _useNavList = (0, _NavList.useNavList)(),
     registerNavItem = _useNavList.registerNavItem;
@@ -24,7 +36,7 @@ var Default = exports.Default = function Default() {
     "aria-orientation": "horizontal",
     role: "menubar",
     "aria-label": "navigation list"
-  }, /*#__PURE__*/_react["default"].createElement(_NavList.NavList, null, _NavLinksOneLevel["default"].map(function (item, key) {
+  }, /*#__PURE__*/_react["default"].createElement(_NavList.NavList, null, links.map(function (item, key) {
     return /*#__PURE__*/_react["default"].createElement(_NavList.NavListItemAction, (0, _extends2["default"])({}, registerNavItem(item), {
       key: key,
       active: item.name === useActive,

package/cjs/navigation/NavList/__stories__/HorizontalWithDrawer/index.js

@@ -14,9 +14,42 @@ var _BurgerIcon = _interopRequireDefault(require("@digigov/react-icons/cjs/Burge
 var _Button = require("@digigov/ui/form/Button");
 var _Link = require("@digigov/ui/navigation/Link");
 var _NavList = require("@digigov/ui/navigation/NavList");
-var _NavLinksWithSubmenu = _interopRequireDefault(require("@digigov/ui/navigation/NavList/__stories__/NavLinksWithSubmenu.json"));
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+var links = [{
+  "name": "home",
+  "href": "#home",
+  "label": "Αρχική"
+}, {
+  "name": "educational",
+  "label": "Εκπαιδευτικό υλικό",
+  "subMenuHeading": "Εκπαιδευτικό υλικό",
+  "subMenu": [{
+    "name": "elearning",
+    "href": "#elearning",
+    "label": "Εκπαιδευτική πλατφόρμα"
+  }, {
+    "name": "videos",
+    "href": "#videos",
+    "label": "Βίντεο"
+  }, {
+    "name": "presentations",
+    "href": "#presentations",
+    "label": "Παρουσιάσεις"
+  }, {
+    "name": "promoting",
+    "href": "#promoting",
+    "label": "Προωθώντας την αθλητική ακεραιότητα στην νέα γενιά"
+  }, {
+    "name": "other-texts",
+    "href": "#other-texts",
+    "label": "Άλλα κείμενα"
+  }]
+}, {
+  "name": "news",
+  "href": "#news",
+  "label": "Νέα"
+}];
 var _ref = /*#__PURE__*/_react["default"].createElement(_BurgerIcon["default"], null);
 var HorizontalWithDrawer = exports.HorizontalWithDrawer = function HorizontalWithDrawer() {
   var layout = 'horizontal';
@@ -48,7 +81,7 @@ var HorizontalWithDrawer = exports.HorizontalWithDrawer = function HorizontalWit
     }
   }, "\u039A\u03BB\u03B5\u03AF\u03C3\u03B9\u03BC\u03BF"), /*#__PURE__*/_react["default"].createElement(_NavList.NavList, {
     layout: layout
-  }, _NavLinksWithSubmenu["default"].map(function (item, key) {
+  }, links.map(function (item, key) {
     var _item$subMenu;
     return /*#__PURE__*/_react["default"].createElement(_react.Fragment, {
       key: key