@digigov/ui 0.21.3 → 0.22.0

package/core/ErrorSummary/index.mdx

@@ -1,59 +1,42 @@
 ---
-title: Error Summary
-parent: docs/ui/components
+id: error-summary
+title: ErrorSummary
 ---
 
-# Error Summary
 
-import ErrorSummary from '@digigov/ui/core/ErrorSummary';
+# ErrorSummary
 
-## Example
+Use this component at the top of a page to summarise any errors a user has made.
 
-```jsx live path=core/ErrorSummary/index.tsx
-import ErrorSummary from '@digigov/ui/core/ErrorSummary';
-import Paragraph from '@digigov/ui/typography/Paragraph';
-function CustomWarning (props){
- return (
-  <ErrorSummary><Paragraph>Action Label</Paragraph></ErrorSummary>
- )
-}
-export CustomErrorSummary
+When a user makes an error, you must show both an error summary and an error message next to each answer that contains an error.
+ 
 
-```
 
-<br />
+```bash
+import ErrorSummary from '@digigov/ui/core/ErrorSummary';
+``` 
+
+## How to use
 
-## When to use this component
+<Story packageName="@digigov/ui" component="core/ErrorSummary" story="Default.tsx" />
 
-Use this component at the top of a page to summarise any errors a user has
-made.
 
-When a user makes an error, you must show both an error summary and an error
-message next to each answer that contains an error.
+### Linking from the error summary to each answer
 
-## How it works
+You must link the errors in the error summary to the answer they relate to.
 
-You must:
+For questions that require a user to answer using a single field, like a file upload, select, textarea, text input or character count, link to the field.
 
-- move keyboard focus to the error summary
-- include the heading "There is a problem"
-- link to each of the answers that have validation errors
-- make sure the error messages in the error summary are worded the same as
-  those which appear next to the inputs with errors
+<Story packageName="@digigov/ui" component="core/ErrorSummary" story="LinkedToInput.tsx" />
 
-As well as showing an error summary, follow the validation pattern - for
-example, by adding "Error: " to the beginning of the page `<title>` so screen
-readers read it out as soon as possible.
+When a user has to enter their answer into multiple fields, such as the day, month and year fields in the date input component, link to the first field that contains an error.
 
-And make your error messages clear and concise.
+If you do not know which field contains an error, link to the first field.
 
-## API
+<Story packageName="@digigov/ui" component="core/ErrorSummary" story="LinkedToField.tsx" />
 
-### Properties
+For questions that require a user to select one or more options from a list using radios or checkboxes, link to the first radio or checkbox.
 
-<PropsDoc data={ErrorSummary.__doc__} />
-<br />
+<Story packageName="@digigov/ui" component="core/ErrorSummary" story="LinkedToCheckbox.tsx" />
 
-### Styles
 
-<StylesDoc data={ErrorSummary.__doc__} />

package/core/FileUpload/__stories__/Default.d.ts

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

package/core/FileUpload/__stories__/Default.js

@@ -7,7 +7,7 @@ var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.Default = void 0;
+exports["default"] = exports.Default = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
@@ -29,4 +29,6 @@ var Default = function Default() {
   return _ref;
 };
 
-exports.Default = Default;
+exports.Default = Default;
+var _default = Default;
+exports["default"] = _default;

package/core/FileUpload/index.mdx

@@ -0,0 +1,22 @@
+---
+id: file-upload
+title: FileUpload
+---
+
+# FileUpload
+ 
+
+
+```bash
+import FileUpload from '@digigov/ui/core/FileUpload';
+``` 
+
+## How to use
+
+<Story packageName="@digigov/ui" component="core/FileUpload" story="Default.tsx" />
+
+### Error message
+
+Error messages should be styled like this:
+
+<Story packageName="@digigov/ui" component="core/FileUpload" story="WithErrorMessage.tsx" />

package/core/Link/__stories__/DarkBackground.js

@@ -13,7 +13,7 @@ var _Link = _interopRequireDefault(require("@digigov/ui/core/Link"));
 
 var _layouts = require("@digigov/ui/layouts");
 
-var _Divider = _interopRequireDefault(require("../../Divider"));
+var _Divider = _interopRequireDefault(require("@digigov/ui/core/Divider"));
 
 var _ref = /*#__PURE__*/_react["default"].createElement(_layouts.Masthead, null, /*#__PURE__*/_react["default"].createElement(_Divider["default"], null), /*#__PURE__*/_react["default"].createElement(_Link["default"], {
   href: "#"

package/core/Link/__stories__/DarkBackgroundNoUnderline.js

@@ -13,7 +13,7 @@ var _Link = _interopRequireDefault(require("@digigov/ui/core/Link"));
 
 var _layouts = require("@digigov/ui/layouts");
 
-var _Divider = _interopRequireDefault(require("../../Divider"));
+var _Divider = _interopRequireDefault(require("@digigov/ui/core/Divider"));
 
 var _ref = /*#__PURE__*/_react["default"].createElement(_layouts.Masthead, null, /*#__PURE__*/_react["default"].createElement(_Divider["default"], null), /*#__PURE__*/_react["default"].createElement(_Link["default"], {
   href: "#",

package/core/Link/link.mdx

@@ -0,0 +1,30 @@
+---
+id: link
+title: Link
+---
+
+```bash
+import Link from '@digigov/ui/core/Link';
+``` 
+
+## How to use
+
+### Default
+
+<Story packageName="@digigov/ui" component="core/Link" story="Default.tsx" />
+
+### No Underline
+
+<Story packageName="@digigov/ui" component="core/Link" story="NoUnderline.tsx" />
+
+### Opens in a new tab
+
+<Story packageName="@digigov/ui" component="core/Link" story="OpensInNewTab.tsx" />
+
+### At dark background
+
+<Story packageName="@digigov/ui" component="core/Link" story="DarkBackground.tsx" />
+
+### At dark background and no underline
+
+<Story packageName="@digigov/ui" component="core/Link" story="DarkBackgroundNoUnderline.tsx" />

package/core/List/index.mdx

@@ -1,8 +1,27 @@
 ---
+id: list
 title: List
-parent: docs/ui/components
 ---
 
-import List, { ListItem } from '@digigov/ui/core/List';
 
-## Examples
+```bash
+import List from '@digigov/ui/core/List';
+``` 
+
+## How to use
+
+### Default
+
+<Story packageName="@digigov/ui" component="core/List" story="Default.tsx" />
+
+### List with bullets
+
+<Story packageName="@digigov/ui" component="core/List" story="BulletList.tsx" />
+
+### List with numbers
+
+<Story packageName="@digigov/ui" component="core/List" story="NumberedList.tsx" />
+
+### List with extra space
+
+<Story packageName="@digigov/ui" component="core/List" story="WithExtraSpace.tsx" />

package/core/Masthead/masthead.mdx

@@ -0,0 +1,14 @@
+---
+id: masthead
+title: Masthead
+---
+
+# Masthead
+
+```bash
+import Masthead from '@digigov/ui/core/Masthead';
+``` 
+
+## How to use
+
+<Story packageName="@digigov/ui" component="core/Masthead" story="Default.tsx" />

package/core/NavList/NavList.d.ts

@@ -1,17 +1,4 @@
 import React from 'react';
-import { NavLinkInterface } from '@digigov/ui/core/NavList/NavListContext';
-import { BaseCSSProperties } from '@material-ui/core/styles/withStyles';
-export declare const useNavListStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"vertical" | "root" | "subMenu" | "floating" | "floatClear">;
-export interface NavListProps {
-    children?: React.ReactNode;
-    className?: string;
-    horizontal?: boolean;
-    openSubMenus?: boolean;
-    floating?: boolean;
-    subMenu?: boolean;
-    links?: NavLinkInterface[];
-    style?: BaseCSSProperties;
-}
-export declare const NavListBase: React.FC<NavListProps>;
+import { NavListProps } from '@digigov/ui/core/NavList/types';
 export declare const NavList: React.FC<NavListProps>;
 export default NavList;

package/core/NavList/NavList.js

@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.useNavListStyles = exports["default"] = exports.NavListBase = exports.NavList = void 0;
+exports["default"] = exports.NavList = void 0;
 
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 
@@ -13,83 +13,24 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
 
 var _react = _interopRequireDefault(require("react"));
 
-var _clsx = _interopRequireDefault(require("clsx"));
-
-var _styles = require("@material-ui/core/styles");
-
 var _NavListContext = require("@digigov/ui/core/NavList/NavListContext");
 
-var _excluded = ["className", "children", "floating", "horizontal", "subMenu"],
-    _excluded2 = ["horizontal", "openSubMenus", "links"];
-var useNavListStyles = (0, _styles.makeStyles)(function (theme) {
-  return {
-    root: {
-      padding: theme.spacing(0),
-      margin: theme.spacing(0),
-      display: 'flex',
-      '&$vertical': {
-        flexDirection: 'column'
-      }
-    },
-    subMenu: {
-      marginLeft: theme.spacing(3)
-    },
-    floating: {
-      left: 0,
-      zIndex: 99,
-      position: 'absolute',
-      background: theme.palette.grey['100'],
-      borderTop: "1px solid ".concat(theme.palette.grey['500']),
-      borderRight: "1px solid ".concat(theme.palette.grey['500']),
-      borderLeft: "1px solid ".concat(theme.palette.grey['500']),
-      margin: theme.spacing(1.5, 0, 0, 0),
-      boxShadow: theme.shadows[3],
-      '& > li': {
-        width: '100%',
-        borderBottom: "1px solid ".concat(theme.palette.grey['500']),
-        margin: 0
-      }
-    },
-    vertical: {},
-    floatClear: {
-      clear: 'both'
-    }
-  };
-}, {
-  name: 'MuiNavList'
-});
-exports.useNavListStyles = useNavListStyles;
+var _NavListBase = require("@digigov/ui/core/NavList/NavListBase");
 
-var NavListBase = function NavListBase(_ref) {
-  var className = _ref.className,
-      children = _ref.children,
-      floating = _ref.floating,
-      horizontal = _ref.horizontal,
-      subMenu = _ref.subMenu,
-      props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
-  var classes = useNavListStyles();
-  return /*#__PURE__*/_react["default"].createElement("nav", null, /*#__PURE__*/_react["default"].createElement("ul", {
-    style: props.style,
-    className: (0, _clsx["default"])(className, classes.root, !horizontal && classes.vertical, floating && classes.floating, subMenu && classes.subMenu)
-  }, children), /*#__PURE__*/_react["default"].createElement("div", {
-    className: classes.floatClear
-  }));
-};
-
-exports.NavListBase = NavListBase;
+var _excluded = ["horizontal", "openSubMenus", "links"];
 
-var NavList = function NavList(_ref2) {
-  var horizontal = _ref2.horizontal,
-      _ref2$openSubMenus = _ref2.openSubMenus,
-      openSubMenus = _ref2$openSubMenus === void 0 ? false : _ref2$openSubMenus,
-      _ref2$links = _ref2.links,
-      links = _ref2$links === void 0 ? [] : _ref2$links,
-      props = (0, _objectWithoutProperties2["default"])(_ref2, _excluded2);
+var NavList = function NavList(_ref) {
+  var horizontal = _ref.horizontal,
+      _ref$openSubMenus = _ref.openSubMenus,
+      openSubMenus = _ref$openSubMenus === void 0 ? false : _ref$openSubMenus,
+      _ref$links = _ref.links,
+      links = _ref$links === void 0 ? [] : _ref$links,
+      props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
   return /*#__PURE__*/_react["default"].createElement(_NavListContext.NavListProvider, {
     openSubMenus: openSubMenus,
     horizontal: horizontal,
     links: links
-  }, /*#__PURE__*/_react["default"].createElement(NavListBase, (0, _extends2["default"])({
+  }, /*#__PURE__*/_react["default"].createElement(_NavListBase.NavListBase, (0, _extends2["default"])({
     horizontal: horizontal
   }, props)));
 };

package/core/NavList/NavListBase.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { NavListProps } from '@digigov/ui/core/NavList/types';
+export declare const useNavListStyles: (props?: any) => import("@material-ui/core/styles/withStyles").ClassNameMap<"vertical" | "root" | "subMenu" | "floating" | "floatClear">;
+export declare const NavListBase: React.FC<NavListProps>;

package/core/NavList/NavListBase.js

@@ -0,0 +1,74 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useNavListStyles = exports.NavListBase = void 0;
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _clsx = _interopRequireDefault(require("clsx"));
+
+var _styles = require("@material-ui/core/styles");
+
+var _excluded = ["className", "children", "floating", "horizontal", "subMenu"];
+var useNavListStyles = (0, _styles.makeStyles)(function (theme) {
+  return {
+    root: {
+      padding: theme.spacing(0),
+      margin: theme.spacing(0),
+      display: 'flex',
+      '&$vertical': {
+        flexDirection: 'column'
+      }
+    },
+    subMenu: {
+      marginLeft: theme.spacing(3)
+    },
+    floating: {
+      left: 0,
+      zIndex: 99,
+      position: 'absolute',
+      background: theme.palette.grey['100'],
+      borderTop: "1px solid ".concat(theme.palette.grey['500']),
+      borderRight: "1px solid ".concat(theme.palette.grey['500']),
+      borderLeft: "1px solid ".concat(theme.palette.grey['500']),
+      margin: theme.spacing(1.5, 0, 0, 0),
+      boxShadow: theme.shadows[3],
+      '& > li': {
+        width: '100%',
+        borderBottom: "1px solid ".concat(theme.palette.grey['500']),
+        margin: 0
+      }
+    },
+    vertical: {},
+    floatClear: {
+      clear: 'both'
+    }
+  };
+}, {
+  name: 'MuiNavList'
+});
+exports.useNavListStyles = useNavListStyles;
+
+var NavListBase = function NavListBase(_ref) {
+  var className = _ref.className,
+      children = _ref.children,
+      floating = _ref.floating,
+      horizontal = _ref.horizontal,
+      subMenu = _ref.subMenu,
+      props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
+  var classes = useNavListStyles();
+  return /*#__PURE__*/_react["default"].createElement("nav", null, /*#__PURE__*/_react["default"].createElement("ul", {
+    style: props.style,
+    className: (0, _clsx["default"])(className, classes.root, !horizontal && classes.vertical, floating && classes.floating, subMenu && classes.subMenu)
+  }, children), /*#__PURE__*/_react["default"].createElement("div", {
+    className: classes.floatClear
+  }));
+};
+
+exports.NavListBase = NavListBase;

package/core/NavList/NavListSubMenu.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { NavListProps } from '@digigov/ui/core/NavList';
+import { NavListProps } from '@digigov/ui/core/NavList/types';
 import { NavLinkInterface } from '@digigov/ui/core/NavList/NavListContext';
 export interface NavListSubMenuProps extends NavListProps {
     links: NavLinkInterface[];

package/core/NavList/NavListSubMenu.js

@@ -15,7 +15,7 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
 
 var _react = _interopRequireWildcard(require("react"));
 
-var _NavList = require("@digigov/ui/core/NavList");
+var _NavListBase = require("@digigov/ui/core/NavList/NavListBase");
 
 var _NavListItemBase = _interopRequireDefault(require("@digigov/ui/core/NavList/NavListItemBase"));
 
@@ -34,7 +34,7 @@ var NavListSubMenu = function NavListSubMenu(_ref) {
   var _useContext = (0, _react.useContext)(_NavListContext["default"]),
       horizontal = _useContext.horizontal;
 
-  return /*#__PURE__*/_react["default"].createElement(_NavList.NavListBase, (0, _extends2["default"])({
+  return /*#__PURE__*/_react["default"].createElement(_NavListBase.NavListBase, (0, _extends2["default"])({
     subMenu: true,
     floating: horizontal
   }, props), links && links.map(function (subMenuLink, key) {

package/core/NavList/types.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import { NavLinkInterface } from '@digigov/ui/core/NavList/NavListContext';
+import { BaseCSSProperties } from '@material-ui/core/styles/withStyles';
+export interface NavListProps {
+    children?: React.ReactNode;
+    className?: string;
+    horizontal?: boolean;
+    openSubMenus?: boolean;
+    floating?: boolean;
+    subMenu?: boolean;
+    links?: NavLinkInterface[];
+    style?: BaseCSSProperties;
+}

package/core/NavList/types.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/core/NotificationBanner/index.mdx

@@ -1,75 +1,28 @@
 ---
+id: notification-banner
 title: NotificationBanner
-parent: docs/ui/components
 ---
 
 # NotificationBanner
 
-import { NotificationBanner } from '@digigov/ui/core';
+This component is currently experimental because more research is needed to validate it.
 
-### Example for "Important"
+Use a notification banner to tell the user about something they need to know about, but that’s not directly related to the page content.
+ 
 
-```jsx live path=layouts/Basic/index.tsx
-import Header, { HeaderTitle } from '@digigov/ui/app/Header';
-import Paragraph from '@digigov/ui/typography/Paragraph';
 
-function NotificationBanner{
- return (
-      <NotificationBanner>
-      This is important !
-     </NotificationBanner>
- )
-}
-export NotificationBanner
+```bash
+import NotificationBanner from '@digigov/ui/core/NotificationBanner';
+``` 
 
-```
+## How to use
 
-<br />
+Use a ‘neutral’ blue notification banner if the user needs to know about a problem with the service as a whole.
 
-### Example for "NotificationBanner"
+Use a ‘neutral’ notification banner if the user needs to know about something that’s happening elsewhere in the service. 
 
-```jsx live path=layouts/Basic/index.tsx
-import Header, { HeaderTitle } from '@digigov/ui/app/Header';
-import GovGRLogo from '@digigov/ui/govgr/Logo';
+<Story packageName="@digigov/ui" component="core/NotificationBanner" story="Default.tsx" />
 
+You can also use a notification banner to tell the user about the outcome of something they’ve just done - but they have not finished using the service, so it does not make sense to use a confirmation page.
 
-function NotificationBanner{
- return (
-      <NotificationBanner variant="success">
-        Training outcome recorded and trainee withdrawn
-      </NotificationBanner>
- )
-}
-export NotificationBanner
-
-```
-
-<br />
-
-## When to use this component
-
-A notification banner lets you tell the user about something that’s not directly relevant to the thing they’re trying to do on that page of the service. For example:
-
-- telling the user about a problem that’s affecting the service as a whole (for example, delays in processing applications because of an emergency)
-- telling the user about something that affects them in particular (for example, an approaching deadline they need to meet)
-- telling the user about the outcome of something they’ve just done on a previous page (for example, confirming that an email has been sent)
-
-## When not to use this component
-
-Use notification banners sparingly. There’s evidence that people often miss them, and using them too often is likely to make this problem worse.
-
-If the information is directly relevant to the thing the user is doing on that page, put the information in the main page content instead. Use inset text or warning text if it needs to stand out.
-
-Don’t use a notification banner to tell the user about validation errors (use an error message and error summary instead).
-
-### API
-
-### Properties
-
-<PropsDoc data={NotificationBanner.__doc__} />
-
-<br />
-
-### Styles
-
-<StylesDoc data={NotificationBanner.__doc__} />
+<Story packageName="@digigov/ui" component="core/NotificationBanner" story="Success.tsx" />

package/core/PhaseBanner/PhaseBanner.stories.d.ts

@@ -4,4 +4,5 @@ declare namespace _default {
 }
 export default _default;
 export * from "./__stories__/Default";
+export * from "./__stories__/Underlined";
 import PhaseBanner from "@digigov/ui/core/PhaseBanner";

package/core/PhaseBanner/PhaseBanner.stories.js

@@ -23,6 +23,20 @@ Object.keys(_Default).forEach(function (key) {
     }
   });
 });
+
+var _Underlined = require("./__stories__/Underlined");
+
+Object.keys(_Underlined).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _Underlined[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _Underlined[key];
+    }
+  });
+});
 var _default = {
   title: 'Digigov UI/core/PhaseBanner',
   component: _PhaseBanner["default"]

package/core/PhaseBanner/__stories__/Underlined.d.ts

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

package/core/PhaseBanner/__stories__/Underlined.js

@@ -0,0 +1,34 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.Underlined = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _PhaseBanner = _interopRequireWildcard(require("@digigov/ui/core/PhaseBanner"));
+
+var _Link = _interopRequireDefault(require("@digigov/ui/core/Link"));
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+var _ref = /*#__PURE__*/_react["default"].createElement(_PhaseBanner["default"], {
+  underline: true
+}, /*#__PURE__*/_react["default"].createElement(_PhaseBanner.PhaseBannerTag, null, "ALPHA"), /*#__PURE__*/_react["default"].createElement(_PhaseBanner.PhaseBannerText, null, "\u0391\u03C5\u03C4\u03AE \u03B5\u03AF\u03BD\u03B1\u03B9 \u03BC\u03AF\u03B1 \u03BD\u03AD\u03B1 \u03C5\u03C0\u03B7\u03C1\u03B5\u03C3\u03AF\u03B1 \u2013 \u03C4\u03B1 ", /*#__PURE__*/_react["default"].createElement(_Link["default"], {
+  href: "#feedback"
+}, "\u03C3\u03C7\u03CC\u03BB\u03B9\u03AC"), " \u03C3\u03B1\u03C2 \u03B8\u03B1 \u03BC\u03B1\u03C2 \u03B2\u03BF\u03B7\u03B8\u03AE\u03C3\u03BF\u03C5\u03BD \u03BD\u03B1 \u03C4\u03B7 \u03B2\u03B5\u03BB\u03C4\u03B9\u03CE\u03C3\u03BF\u03C5\u03BC\u03B5."));
+
+var Underlined = function Underlined() {
+  return _ref;
+};
+
+exports.Underlined = Underlined;
+var _default = Underlined;
+exports["default"] = _default;