@digigov/ui 0.21.2 → 0.23.0

package/core/Checkboxes/__stories__/MultipleQuestions.js

@@ -21,9 +21,13 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 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(_Field["default"], null, /*#__PURE__*/_react["default"].createElement(_Field.Fieldset, null, /*#__PURE__*/_react["default"].createElement(_Field.FieldsetLegend, {
+var _ref = /*#__PURE__*/_react["default"].createElement(_Field["default"], null, /*#__PURE__*/_react["default"].createElement(_Field.Fieldset, {
+  "aria-describedby": "feeling-hint"
+}, /*#__PURE__*/_react["default"].createElement(_Field.FieldsetLegend, {
   size: "s"
-}, "\u03A0\u03CE\u03C2 \u03B1\u03B9\u03C3\u03B8\u03AC\u03BD\u03B5\u03C4\u03B1\u03B9 \u03B1\u03C5\u03C4\u03AE \u03C4\u03B7 \u03C3\u03C4\u03B9\u03B3\u03BC\u03AE;"), /*#__PURE__*/_react["default"].createElement(_Hint["default"], null, "\u03A0\u03B5\u03AF\u03C4\u03B5 \u03BC\u03B1\u03C2 \u03C3\u03C7\u03B5\u03C4\u03B9\u03BA\u03AC \u03BC\u03B5 \u03C0\u03C1\u03CC\u03C3\u03C6\u03B1\u03C4\u03B5\u03C2 \u03B1\u03BB\u03BB\u03B1\u03B3\u03AD\u03C2. \u0395\u03C0\u03B9\u03BB\u03AD\u03BE\u03C4\u03B5 \u03CC,\u03C4\u03B9 \u03B9\u03C3\u03C7\u03CD\u03B5\u03B9."), /*#__PURE__*/_react["default"].createElement(_Checkboxes["default"], null, /*#__PURE__*/_react["default"].createElement(_Checkboxes.CheckboxItem, {
+}, "\u03A0\u03CE\u03C2 \u03B1\u03B9\u03C3\u03B8\u03AC\u03BD\u03B5\u03C4\u03B1\u03B9 \u03B1\u03C5\u03C4\u03AE \u03C4\u03B7 \u03C3\u03C4\u03B9\u03B3\u03BC\u03AE;"), /*#__PURE__*/_react["default"].createElement(_Hint["default"], {
+  id: "feeling-hint"
+}, "\u03A0\u03B5\u03AF\u03C4\u03B5 \u03BC\u03B1\u03C2 \u03C3\u03C7\u03B5\u03C4\u03B9\u03BA\u03AC \u03BC\u03B5 \u03C0\u03C1\u03CC\u03C3\u03C6\u03B1\u03C4\u03B5\u03C2 \u03B1\u03BB\u03BB\u03B1\u03B3\u03AD\u03C2. \u0395\u03C0\u03B9\u03BB\u03AD\u03BE\u03C4\u03B5 \u03CC,\u03C4\u03B9 \u03B9\u03C3\u03C7\u03CD\u03B5\u03B9."), /*#__PURE__*/_react["default"].createElement(_Checkboxes["default"], null, /*#__PURE__*/_react["default"].createElement(_Checkboxes.CheckboxItem, {
   name: "cold",
   value: "cold"
 }, "\u0388\u03C7\u03C9 \u03C3\u03C5\u03BD\u03AC\u03C7\u03B9"), /*#__PURE__*/_react["default"].createElement(_Checkboxes.CheckboxItem, {

package/core/Checkboxes/__stories__/NoneAnswer.js

@@ -21,7 +21,11 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 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(_Field["default"], null, /*#__PURE__*/_react["default"].createElement(_Field.Fieldset, null, /*#__PURE__*/_react["default"].createElement(_Field.FieldsetLegend, null, "\u0398\u03B1 \u03C4\u03B1\u03BE\u03B9\u03B4\u03AD\u03C8\u03B5\u03C4\u03B5 \u03C3\u03B5 \u03BA\u03AC\u03C0\u03BF\u03B9\u03B1 \u03B1\u03C0\u03CC \u03B1\u03C5\u03C4\u03AD\u03C2 \u03C4\u03B9\u03C2 \u03C7\u03CE\u03C1\u03B5\u03C2;"), /*#__PURE__*/_react["default"].createElement(_Hint["default"], null, "\u0391\u03BD \u03AD\u03C7\u03B5\u03C4\u03B5 \u03C0\u03BF\u03BB\u03BB\u03B1\u03C0\u03BB\u03AE \u03C5\u03C0\u03B7\u03BA\u03BF\u03CC\u03C4\u03B7\u03C4\u03B1, \u03B5\u03C0\u03B9\u03BB\u03AD\u03BE\u03C4\u03B5 \u03CC,\u03C4\u03B9 \u03B9\u03C3\u03C7\u03CD\u03B5\u03B9."), /*#__PURE__*/_react["default"].createElement(_Checkboxes["default"], null, /*#__PURE__*/_react["default"].createElement(_Checkboxes.CheckboxItem, {
+var _ref = /*#__PURE__*/_react["default"].createElement(_Field["default"], null, /*#__PURE__*/_react["default"].createElement(_Field.Fieldset, {
+  "aria-describedby": "travel-hint"
+}, /*#__PURE__*/_react["default"].createElement(_Field.FieldsetLegend, null, "\u0398\u03B1 \u03C4\u03B1\u03BE\u03B9\u03B4\u03AD\u03C8\u03B5\u03C4\u03B5 \u03C3\u03B5 \u03BA\u03AC\u03C0\u03BF\u03B9\u03B1 \u03B1\u03C0\u03CC \u03B1\u03C5\u03C4\u03AD\u03C2 \u03C4\u03B9\u03C2 \u03C7\u03CE\u03C1\u03B5\u03C2;"), /*#__PURE__*/_react["default"].createElement(_Hint["default"], {
+  id: "travel-hint"
+}, "\u0391\u03BD \u03AD\u03C7\u03B5\u03C4\u03B5 \u03C0\u03BF\u03BB\u03BB\u03B1\u03C0\u03BB\u03AE \u03C5\u03C0\u03B7\u03BA\u03BF\u03CC\u03C4\u03B7\u03C4\u03B1, \u03B5\u03C0\u03B9\u03BB\u03AD\u03BE\u03C4\u03B5 \u03CC,\u03C4\u03B9 \u03B9\u03C3\u03C7\u03CD\u03B5\u03B9."), /*#__PURE__*/_react["default"].createElement(_Checkboxes["default"], null, /*#__PURE__*/_react["default"].createElement(_Checkboxes.CheckboxItem, {
   name: "cold",
   value: "cold"
 }, "\u0391\u03B3\u03B3\u03BB\u03AF\u03B1"), /*#__PURE__*/_react["default"].createElement(_Checkboxes.CheckboxItem, {

package/core/Checkboxes/__stories__/NoneAnswerWithError.d.ts

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

package/core/Checkboxes/__stories__/NoneAnswerWithError.js

@@ -0,0 +1,57 @@
+"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.NoneAnswer = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _Checkboxes = _interopRequireWildcard(require("@digigov/ui/core/Checkboxes"));
+
+var _Field = _interopRequireWildcard(require("@digigov/ui/core/Field"));
+
+var _Hint = _interopRequireDefault(require("@digigov/ui/typography/Hint"));
+
+var _VisuallyHidden = _interopRequireDefault(require("@digigov/react-core/VisuallyHidden"));
+
+var _ErrorMessage = _interopRequireDefault(require("@digigov/react-core/ErrorMessage"));
+
+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(_Field["default"], {
+  error: true
+}, /*#__PURE__*/_react["default"].createElement(_Field.Fieldset, {
+  "aria-describedby": "travel-hint travel-error"
+}, /*#__PURE__*/_react["default"].createElement(_Field.FieldsetLegend, null, "\u0398\u03B1 \u03C4\u03B1\u03BE\u03B9\u03B4\u03AD\u03C8\u03B5\u03C4\u03B5 \u03C3\u03B5 \u03BA\u03AC\u03C0\u03BF\u03B9\u03B1 \u03B1\u03C0\u03CC \u03B1\u03C5\u03C4\u03AD\u03C2 \u03C4\u03B9\u03C2 \u03C7\u03CE\u03C1\u03B5\u03C2;"), /*#__PURE__*/_react["default"].createElement(_Hint["default"], {
+  id: "travel-hint"
+}, "\u0391\u03BD \u03AD\u03C7\u03B5\u03C4\u03B5 \u03C0\u03BF\u03BB\u03BB\u03B1\u03C0\u03BB\u03AE \u03C5\u03C0\u03B7\u03BA\u03BF\u03CC\u03C4\u03B7\u03C4\u03B1, \u03B5\u03C0\u03B9\u03BB\u03AD\u03BE\u03C4\u03B5 \u03CC,\u03C4\u03B9 \u03B9\u03C3\u03C7\u03CD\u03B5\u03B9."), /*#__PURE__*/_react["default"].createElement(_ErrorMessage["default"], {
+  id: "travel-error"
+}, /*#__PURE__*/_react["default"].createElement(_VisuallyHidden["default"], null, "\u039B\u03AC\u03B8\u03BF\u03C2:"), "\u0395\u03C0\u03B9\u03BB\u03AD\u03BE\u03C4\u03B5 \u03C4\u03B9\u03C2 \u03C7\u03CE\u03C1\u03B5\u03C2 \u03C3\u03C4\u03B9\u03C2 \u03BF\u03C0\u03BF\u03AF\u03B5\u03C2 \u03B8\u03B1 \u03C4\u03B1\u03BE\u03B9\u03B4\u03AD\u03C8\u03B5\u03C4\u03B5, \u03AE \u03B5\u03C0\u03B9\u03BB\u03AD\u03BE\u03C4\u03B5 \xAB\u038C\u03C7\u03B9, \u03B4\u03B5\u03BD \u03B8\u03B1 \u03C4\u03B1\u03BE\u03B9\u03B4\u03AD\u03C8\u03C9 \u03C3\u03B5 \u03BA\u03B1\u03BC\u03AF\u03B1 \u03B1\u03C0\u03CC \u03B1\u03C5\u03C4\u03AD\u03C2 \u03C4\u03B9\u03C2 \u03C7\u03CE\u03C1\u03B5\u03C2\xBB."), /*#__PURE__*/_react["default"].createElement(_Checkboxes["default"], null, /*#__PURE__*/_react["default"].createElement(_Checkboxes.CheckboxItem, {
+  checked: true,
+  name: "en",
+  value: "en"
+}, "\u0391\u03B3\u03B3\u03BB\u03AF\u03B1"), /*#__PURE__*/_react["default"].createElement(_Checkboxes.CheckboxItem, {
+  name: "fr",
+  value: "fever"
+}, "\u0393\u03B1\u03BB\u03BB\u03AF\u03B1"), /*#__PURE__*/_react["default"].createElement("div", {
+  className: "govgr-checkboxes__divider"
+}, "\u03AE"), /*#__PURE__*/_react["default"].createElement(_Checkboxes.CheckboxItem, {
+  checked: true,
+  name: "none",
+  value: "none"
+}, "\u038C\u03C7\u03B9, \u03B4\u03B5\u03BD \u03B8\u03B1 \u03C4\u03B1\u03BE\u03B9\u03B4\u03AD\u03C8\u03C9 \u03C3\u03B5 \u03BA\u03B1\u03BC\u03AF\u03B1 \u03B1\u03C0\u03CC \u03B1\u03C5\u03C4\u03AD\u03C2 \u03C4\u03B9\u03C2 \u03C7\u03CE\u03C1\u03B5\u03C2"))));
+
+var NoneAnswer = function NoneAnswer() {
+  return _ref;
+};
+
+exports.NoneAnswer = NoneAnswer;
+var _default = NoneAnswer;
+exports["default"] = _default;

package/core/Checkboxes/__stories__/WithErrorMessage.js

@@ -27,7 +27,13 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 
 var _ref = /*#__PURE__*/_react["default"].createElement(_Field["default"], {
   error: true
-}, /*#__PURE__*/_react["default"].createElement(_Field.Fieldset, null, /*#__PURE__*/_react["default"].createElement(_Field.FieldsetLegend, null, "\u0398\u03B1 \u03C4\u03B1\u03BE\u03B9\u03B4\u03AD\u03C8\u03B5\u03C4\u03B5 \u03C3\u03B5 \u03BA\u03AC\u03C0\u03BF\u03B9\u03B1 \u03B1\u03C0\u03CC \u03B1\u03C5\u03C4\u03AD\u03C2 \u03C4\u03B9\u03C2 \u03C7\u03CE\u03C1\u03B5\u03C2;"), /*#__PURE__*/_react["default"].createElement(_Hint["default"], null, "\u0391\u03BD \u03AD\u03C7\u03B5\u03C4\u03B5 \u03C0\u03BF\u03BB\u03BB\u03B1\u03C0\u03BB\u03AE \u03C5\u03C0\u03B7\u03BA\u03BF\u03CC\u03C4\u03B7\u03C4\u03B1, \u03B5\u03C0\u03B9\u03BB\u03AD\u03BE\u03C4\u03B5 \u03CC,\u03C4\u03B9 \u03B9\u03C3\u03C7\u03CD\u03B5\u03B9."), /*#__PURE__*/_react["default"].createElement(_ErrorMessage["default"], null, /*#__PURE__*/_react["default"].createElement(_VisuallyHidden["default"], null, "\u039B\u03AC\u03B8\u03BF\u03C2:"), " \u0395\u03C0\u03B9\u03BB\u03AD\u03BE\u03C4\u03B5 \u03BC\u03AF\u03B1 \u03AE \u03C0\u03B1\u03C1\u03B1\u03C0\u03AC\u03BD\u03C9 \u03C7\u03CE\u03C1\u03B5\u03C2."), /*#__PURE__*/_react["default"].createElement(_Checkboxes["default"], null, /*#__PURE__*/_react["default"].createElement(_Checkboxes.CheckboxItem, {
+}, /*#__PURE__*/_react["default"].createElement(_Field.Fieldset, {
+  "aria-describedby": "nationality-hint nationality-error"
+}, /*#__PURE__*/_react["default"].createElement(_Field.FieldsetLegend, null, "\u0398\u03B1 \u03C4\u03B1\u03BE\u03B9\u03B4\u03AD\u03C8\u03B5\u03C4\u03B5 \u03C3\u03B5 \u03BA\u03AC\u03C0\u03BF\u03B9\u03B1 \u03B1\u03C0\u03CC \u03B1\u03C5\u03C4\u03AD\u03C2 \u03C4\u03B9\u03C2 \u03C7\u03CE\u03C1\u03B5\u03C2;"), /*#__PURE__*/_react["default"].createElement(_Hint["default"], {
+  id: "nationality-hint"
+}, "\u0391\u03BD \u03AD\u03C7\u03B5\u03C4\u03B5 \u03C0\u03BF\u03BB\u03BB\u03B1\u03C0\u03BB\u03AE \u03C5\u03C0\u03B7\u03BA\u03BF\u03CC\u03C4\u03B7\u03C4\u03B1, \u03B5\u03C0\u03B9\u03BB\u03AD\u03BE\u03C4\u03B5 \u03CC,\u03C4\u03B9 \u03B9\u03C3\u03C7\u03CD\u03B5\u03B9."), /*#__PURE__*/_react["default"].createElement(_ErrorMessage["default"], {
+  id: "nationality-error"
+}, /*#__PURE__*/_react["default"].createElement(_VisuallyHidden["default"], null, "\u039B\u03AC\u03B8\u03BF\u03C2:"), " \u0395\u03C0\u03B9\u03BB\u03AD\u03BE\u03C4\u03B5 \u03BC\u03AF\u03B1 \u03AE \u03C0\u03B1\u03C1\u03B1\u03C0\u03AC\u03BD\u03C9 \u03C7\u03CE\u03C1\u03B5\u03C2."), /*#__PURE__*/_react["default"].createElement(_Checkboxes["default"], null, /*#__PURE__*/_react["default"].createElement(_Checkboxes.CheckboxItem, {
   name: "cold",
   value: "cold"
 }, "\u0391\u03B3\u03B3\u03BB\u03AF\u03B1"), /*#__PURE__*/_react["default"].createElement(_Checkboxes.CheckboxItem, {

package/core/Checkboxes/__stories__/WithHint.js

@@ -21,7 +21,11 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 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(_Field["default"], null, /*#__PURE__*/_react["default"].createElement(_Field.Fieldset, null, /*#__PURE__*/_react["default"].createElement(_Field.FieldsetLegend, null, "\u03A0\u03BF\u03B9\u03B1 \u03B5\u03AF\u03BD\u03B1\u03B9 \u03B7 \u03B5\u03B8\u03BD\u03B9\u03BA\u03CC\u03C4\u03B7\u03C4\u03B1 \u03C3\u03B1\u03C2;"), /*#__PURE__*/_react["default"].createElement(_Hint["default"], null, "\u0391\u03BD \u03AD\u03C7\u03B5\u03C4\u03B5 \u03C0\u03BF\u03BB\u03BB\u03B1\u03C0\u03BB\u03AE \u03C5\u03C0\u03B7\u03BA\u03BF\u03CC\u03C4\u03B7\u03C4\u03B1, \u03B5\u03C0\u03B9\u03BB\u03AD\u03BE\u03C4\u03B5 \u03CC,\u03C4\u03B9 \u03B9\u03C3\u03C7\u03CD\u03B5\u03B9."), /*#__PURE__*/_react["default"].createElement(_Checkboxes["default"], null, /*#__PURE__*/_react["default"].createElement(_Checkboxes.CheckboxItem, {
+var _ref = /*#__PURE__*/_react["default"].createElement(_Field["default"], null, /*#__PURE__*/_react["default"].createElement(_Field.Fieldset, {
+  "aria-describedby": "nationality-hint"
+}, /*#__PURE__*/_react["default"].createElement(_Field.FieldsetLegend, null, "\u03A0\u03BF\u03B9\u03B1 \u03B5\u03AF\u03BD\u03B1\u03B9 \u03B7 \u03B5\u03B8\u03BD\u03B9\u03BA\u03CC\u03C4\u03B7\u03C4\u03B1 \u03C3\u03B1\u03C2;"), /*#__PURE__*/_react["default"].createElement(_Hint["default"], {
+  id: "nationality-hint"
+}, "\u0391\u03BD \u03AD\u03C7\u03B5\u03C4\u03B5 \u03C0\u03BF\u03BB\u03BB\u03B1\u03C0\u03BB\u03AE \u03C5\u03C0\u03B7\u03BA\u03BF\u03CC\u03C4\u03B7\u03C4\u03B1, \u03B5\u03C0\u03B9\u03BB\u03AD\u03BE\u03C4\u03B5 \u03CC,\u03C4\u03B9 \u03B9\u03C3\u03C7\u03CD\u03B5\u03B9."), /*#__PURE__*/_react["default"].createElement(_Checkboxes["default"], null, /*#__PURE__*/_react["default"].createElement(_Checkboxes.CheckboxItem, {
   name: "cold",
   value: "cold"
 }, "\u0395\u03BB\u03BB\u03B7\u03BD\u03B9\u03BA\u03AE", /*#__PURE__*/_react["default"].createElement(_Hint["default"], null, "\u03C3\u03C5\u03BC\u03C0\u03B5\u03C1\u03B9\u03BB\u03B1\u03BC\u03B2\u03B1\u03BD\u03BF\u03BC\u03AD\u03BD\u03C9\u03BD \u03B1\u03C0\u03CC\u03B4\u03B7\u03BC\u03C9\u03BD \u03C0\u03BF\u03BB\u03B9\u03C4\u03CE\u03BD")), /*#__PURE__*/_react["default"].createElement(_Checkboxes.CheckboxItem, {

package/core/Checkboxes/checkboxes.mdx

@@ -0,0 +1,54 @@
+---
+id: checkboxes
+title: Checkboxes
+---
+
+
+# Checkboxes
+
+ 
+
+
+```bash
+import Checkboxes from '@digigov/ui/core/Checkboxes';
+``` 
+
+## How to use
+
+<Story packageName="@digigov/ui" component="core/Checkboxes" story="Default.tsx" />
+
+### If you’re asking more than one question on the page
+
+<Story packageName="@digigov/ui" component="core/Checkboxes" story="MultipleQuestions.tsx" />
+
+### Checkbox items with hints
+
+You can add hints to checkbox items to provide additional information about the options.
+
+<Story packageName="@digigov/ui" component="core/Checkboxes" story="WithHint.tsx" />
+
+### Add an option for ‘none’
+
+When ‘none’ would be a valid answer, give users the option to check a box to say none of the other options apply to them — without this option, users would have to leave all of the boxes unchecked. Giving users this option also makes sure they do not skip the question by accident.
+
+<Story packageName="@digigov/ui" component="core/Checkboxes" story="NoneAnswer.tsx" />
+
+If JavaScript is unavailable, and a user selects both the ‘none’ checkbox and another checkbox, display an error message.
+
+<Story packageName="@digigov/ui" component="core/Checkboxes" story="NoneAnswerWithError.tsx" />
+
+### Error messages
+
+Error messages should be styled like this:
+
+<Story packageName="@digigov/ui" component="core/Checkboxes" story="WithErrorMessage.tsx" />
+
+## Conditionally revealing a related question
+
+You can ask the user a related question when they select a particular checkbox, so they only see the question when it’s relevant to them.
+
+This might make 2 related questions easier to answer by grouping them on the same page. For example, you could reveal a phone number input when the user selects the ‘Contact me by phone’ option.
+
+<Story packageName="@digigov/ui" component="core/Checkboxes" story="ConditionalReveal.tsx" />
+
+

package/core/Confirmation/confirmation.mdx

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

package/core/DateInput/DateInput.stories.d.ts

@@ -4,6 +4,7 @@ declare namespace _default {
 }
 export default _default;
 export * from "@digigov/ui/core/DateInput/__stories__/Default";
+export * from "@digigov/ui/core/DateInput/__stories__/MultipleQuestions";
 export * from "@digigov/ui/core/DateInput/__stories__/WithErrorMessage";
 export * from "@digigov/ui/core/DateInput/__stories__/WithErrorMessageForSingleField";
 import DateInput from "@digigov/ui/core/DateInput";

package/core/DateInput/DateInput.stories.js

@@ -24,6 +24,20 @@ Object.keys(_Default).forEach(function (key) {
   });
 });
 
+var _MultipleQuestions = require("@digigov/ui/core/DateInput/__stories__/MultipleQuestions");
+
+Object.keys(_MultipleQuestions).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _MultipleQuestions[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _MultipleQuestions[key];
+    }
+  });
+});
+
 var _WithErrorMessage = require("@digigov/ui/core/DateInput/__stories__/WithErrorMessage");
 
 Object.keys(_WithErrorMessage).forEach(function (key) {

package/core/DateInput/__stories__/Default.js

@@ -21,7 +21,9 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 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(_Field["default"], null, /*#__PURE__*/_react["default"].createElement(_Field.Fieldset, null, /*#__PURE__*/_react["default"].createElement(_Field.FieldsetLegend, null, "\u03A0\u03CC\u03C4\u03B5 \u03B5\u03BA\u03B4\u03CC\u03B8\u03B7\u03BA\u03B5 \u03C4\u03BF \u03B4\u03B9\u03B1\u03B2\u03B1\u03C4\u03AE\u03C1\u03B9\u03BF \u03C3\u03B1\u03C2;"), /*#__PURE__*/_react["default"].createElement(_Hint["default"], null, "\u0393\u03B9\u03B1 \u03C0\u03B1\u03C1\u03AC\u03B4\u03B5\u03B9\u03B3\u03BC\u03B1, 05 11 2020"), /*#__PURE__*/_react["default"].createElement(_DateInput["default"], null, /*#__PURE__*/_react["default"].createElement(_DateInput.DateInputItem, {
+var _ref = /*#__PURE__*/_react["default"].createElement(_Field["default"], null, /*#__PURE__*/_react["default"].createElement(_Field.Fieldset, null, /*#__PURE__*/_react["default"].createElement(_Field.FieldsetLegend, {
+  heading: true
+}, "\u03A0\u03CC\u03C4\u03B5 \u03B5\u03BA\u03B4\u03CC\u03B8\u03B7\u03BA\u03B5 \u03C4\u03BF \u03B4\u03B9\u03B1\u03B2\u03B1\u03C4\u03AE\u03C1\u03B9\u03BF \u03C3\u03B1\u03C2;"), /*#__PURE__*/_react["default"].createElement(_Hint["default"], null, "\u0393\u03B9\u03B1 \u03C0\u03B1\u03C1\u03AC\u03B4\u03B5\u03B9\u03B3\u03BC\u03B1, 05 11 2020"), /*#__PURE__*/_react["default"].createElement(_DateInput["default"], null, /*#__PURE__*/_react["default"].createElement(_DateInput.DateInputItem, {
   name: "day"
 }, "\u0397\u03BC\u03AD\u03C1\u03B1"), /*#__PURE__*/_react["default"].createElement(_DateInput.DateInputItem, {
   name: "month"

package/core/DateInput/__stories__/MultipleQuestions.d.ts

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

package/core/DateInput/__stories__/MultipleQuestions.js

@@ -0,0 +1,41 @@
+"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.MultipleQuestions = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _DateInput = _interopRequireWildcard(require("@digigov/ui/core/DateInput"));
+
+var _Field = _interopRequireWildcard(require("@digigov/ui/core/Field"));
+
+var _Hint = _interopRequireDefault(require("@digigov/ui/typography/Hint"));
+
+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(_Field["default"], null, /*#__PURE__*/_react["default"].createElement(_Field.Fieldset, null, /*#__PURE__*/_react["default"].createElement(_Field.FieldsetLegend, {
+  size: "m"
+}, "\u03A0\u03CC\u03C4\u03B5 \u03B5\u03BA\u03B4\u03CC\u03B8\u03B7\u03BA\u03B5 \u03C4\u03BF \u03B4\u03B9\u03B1\u03B2\u03B1\u03C4\u03AE\u03C1\u03B9\u03BF \u03C3\u03B1\u03C2;"), /*#__PURE__*/_react["default"].createElement(_Hint["default"], null, "\u0393\u03B9\u03B1 \u03C0\u03B1\u03C1\u03AC\u03B4\u03B5\u03B9\u03B3\u03BC\u03B1, 05 11 2020"), /*#__PURE__*/_react["default"].createElement(_DateInput["default"], null, /*#__PURE__*/_react["default"].createElement(_DateInput.DateInputItem, {
+  name: "day"
+}, "\u0397\u03BC\u03AD\u03C1\u03B1"), /*#__PURE__*/_react["default"].createElement(_DateInput.DateInputItem, {
+  name: "month"
+}, "\u039C\u03AE\u03BD\u03B1\u03C2"), /*#__PURE__*/_react["default"].createElement(_DateInput.DateInputItem, {
+  width: 4,
+  name: "year"
+}, "\u03A7\u03C1\u03CC\u03BD\u03BF\u03C2"))));
+
+var MultipleQuestions = function MultipleQuestions() {
+  return _ref;
+};
+
+exports.MultipleQuestions = MultipleQuestions;
+var _default = MultipleQuestions;
+exports["default"] = _default;

package/core/DateInput/index.mdx

@@ -0,0 +1,34 @@
+---
+id: date-input
+title: DateInput
+---
+
+
+# DateInput
+
+
+ 
+
+
+```bash
+import DateInput from '@digigov/ui/core/DateInput';
+``` 
+
+## How to use
+
+<Story packageName="@digigov/ui" component="core/DateInput" story="Default.tsx" />
+
+### If you’re asking more than one question on the page
+
+<Story packageName="@digigov/ui" component="core/DateInput" story="MultipleQuestions.tsx" />
+
+
+### Error message
+
+If you’re highlighting the whole date, style all the fields like this:
+
+<Story packageName="@digigov/ui" component="core/DateInput" story="WithErrorMessage.tsx" />
+
+If you’re highlighting just one field - either the day, month or year - only style the field that has an error. The error message must say which field has an error, like this:
+
+<Story packageName="@digigov/ui" component="core/DateInput" story="WithErrorMessageForSingleField.tsx" />

package/core/Details/index.mdx

@@ -1,34 +1,18 @@
 ---
-parent: docs/ui/components
+id: details
 title: Details
 ---
 
-## Example
+# Details
 
-```jsx live
-<Details>
-  <DetailsSummary>Help with nationality</DetailsSummary>
-  <DetailsContent>
-    We need to know your nationality so we can work out which elections you’re
-    entitled to vote in. If you cannot provide your nationality, you’ll have to
-    send copies of identity documents through the post.
-  </DetailsContent>
-</Details>
-```
+The details component is a short link that shows more detailed help text when a user clicks on it.
+ 
 
-<br />
 
-## When to use this component
+```bash
+import Details from '@digigov/ui/core/Details';
+``` 
 
-Use the Details component to make a page easier to scan when it contains
-information that only some users will need.
+## How to use
 
-## When not to use this component
-
-Do not use the Details component to hide information that the majority of
-your users should see.
-
-## How it works
-
-The Details component is a short link that expands into a text including some
-extra information, when a user clicks on it.
+<Story packageName="@digigov/ui" component="core/Details" story="Default.tsx" />

package/core/ErrorMessage/__stories__/Default.js

@@ -27,7 +27,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 
 var _ref = /*#__PURE__*/_react["default"].createElement(_Field["default"], {
   error: true
-}, /*#__PURE__*/_react["default"].createElement(_Field.Fieldset, null, /*#__PURE__*/_react["default"].createElement(_Field.FieldsetLegend, null, "\u0398\u03B1 \u03C4\u03B1\u03BE\u03B9\u03B4\u03AD\u03C8\u03B5\u03C4\u03B5 \u03C3\u03B5 \u03BA\u03AC\u03C0\u03BF\u03B9\u03B1 \u03B1\u03C0\u03CC \u03B1\u03C5\u03C4\u03AD\u03C2 \u03C4\u03B9\u03C2 \u03C7\u03CE\u03C1\u03B5\u03C2;"), /*#__PURE__*/_react["default"].createElement(_Hint["default"], null, "\u0391\u03BD \u03AD\u03C7\u03B5\u03C4\u03B5 \u03C0\u03BF\u03BB\u03BB\u03B1\u03C0\u03BB\u03AE \u03C5\u03C0\u03B7\u03BA\u03BF\u03CC\u03C4\u03B7\u03C4\u03B1, \u03B5\u03C0\u03B9\u03BB\u03AD\u03BE\u03C4\u03B5 \u03CC,\u03C4\u03B9 \u03B9\u03C3\u03C7\u03CD\u03B5\u03B9."), /*#__PURE__*/_react["default"].createElement(_ErrorMessage["default"], null, /*#__PURE__*/_react["default"].createElement(_VisuallyHidden["default"], null, "\u039B\u03AC\u03B8\u03BF\u03C2:"), " \u0395\u03C0\u03B9\u03BB\u03AD\u03BE\u03C4\u03B5 \u03BC\u03AF\u03B1 \u03AE \u03C0\u03B1\u03C1\u03B1\u03C0\u03AC\u03BD\u03C9 \u03C7\u03CE\u03C1\u03B5\u03C2."), /*#__PURE__*/_react["default"].createElement(_Checkboxes["default"], null, /*#__PURE__*/_react["default"].createElement(_Checkboxes.CheckboxItem, {
+}, /*#__PURE__*/_react["default"].createElement(_Field.Fieldset, null, /*#__PURE__*/_react["default"].createElement(_Field.FieldsetLegend, null, "\u0398\u03B1 \u03C4\u03B1\u03BE\u03B9\u03B4\u03AD\u03C8\u03B5\u03C4\u03B5 \u03C3\u03B5 \u03BA\u03AC\u03C0\u03BF\u03B9\u03B1 \u03B1\u03C0\u03CC \u03B1\u03C5\u03C4\u03AD\u03C2 \u03C4\u03B9\u03C2 \u03C7\u03CE\u03C1\u03B5\u03C2;"), /*#__PURE__*/_react["default"].createElement(_Hint["default"], null, "\u0391\u03BD \u03AD\u03C7\u03B5\u03C4\u03B5 \u03C0\u03BF\u03BB\u03BB\u03B1\u03C0\u03BB\u03AE \u03C5\u03C0\u03B7\u03BA\u03BF\u03CC\u03C4\u03B7\u03C4\u03B1, \u03B5\u03C0\u03B9\u03BB\u03AD\u03BE\u03C4\u03B5 \u03CC,\u03C4\u03B9 \u03B9\u03C3\u03C7\u03CD\u03B5\u03B9."), /*#__PURE__*/_react["default"].createElement(_ErrorMessage["default"], null, /*#__PURE__*/_react["default"].createElement(_VisuallyHidden["default"], null, "\u039B\u03AC\u03B8\u03BF\u03C2:"), "\u0395\u03C0\u03B9\u03BB\u03AD\u03BE\u03C4\u03B5 \u03BC\u03AF\u03B1 \u03AE \u03C0\u03B1\u03C1\u03B1\u03C0\u03AC\u03BD\u03C9 \u03C7\u03CE\u03C1\u03B5\u03C2."), /*#__PURE__*/_react["default"].createElement(_Checkboxes["default"], null, /*#__PURE__*/_react["default"].createElement(_Checkboxes.CheckboxItem, {
   name: "cold",
   value: "cold"
 }, "\u0391\u03B3\u03B3\u03BB\u03AF\u03B1"), /*#__PURE__*/_react["default"].createElement(_Checkboxes.CheckboxItem, {

package/core/ErrorMessage/index.mdx

@@ -0,0 +1,21 @@
+---
+id: error-message
+title: ErrorMessage
+---
+
+
+# ErrorMessage
+
+Follow the validation pattern and show an error message when there is a validation error. 
+In the error message explain what went wrong and how to fix it.
+ 
+
+
+```bash
+import ErrorMessage from '@digigov/ui/core/ErrorMessage';
+``` 
+
+## How to use
+
+<Story packageName="@digigov/ui" component="core/ErrorMessage" story="Default.tsx" />
+

package/core/ErrorSummary/__stories__/LinkedToCheckbox.js

@@ -36,7 +36,7 @@ var _ref = /*#__PURE__*/_react["default"].createElement("div", {
 }, /*#__PURE__*/_react["default"].createElement(_ErrorSummary["default"], null, /*#__PURE__*/_react["default"].createElement(_Title["default"], {
   size: "sm"
 }, "\u03A5\u03C0\u03AE\u03C1\u03BE\u03B5 \u03BA\u03AC\u03C0\u03BF\u03B9\u03BF \u03C0\u03C1\u03CC\u03B2\u03BB\u03B7\u03BC\u03B1"), /*#__PURE__*/_react["default"].createElement(_Link["default"], {
-  href: "#thisone"
+  href: "#england"
 }, "\u0395\u03C0\u03B9\u03BB\u03AD\u03BE\u03C4\u03B5 \u03BC\u03AF\u03B1 \u03AE \u03C0\u03B1\u03C1\u03B1\u03C0\u03AC\u03BD\u03C9 \u03C7\u03CE\u03C1\u03B5\u03C2.")), /*#__PURE__*/_react["default"].createElement(_Field["default"], {
   error: true
 }, /*#__PURE__*/_react["default"].createElement(_Field.Fieldset, null, /*#__PURE__*/_react["default"].createElement(_Field.FieldsetLegend, null, "\u0398\u03B1 \u03C4\u03B1\u03BE\u03B9\u03B4\u03AD\u03C8\u03B5\u03C4\u03B5 \u03C3\u03B5 \u03BA\u03AC\u03C0\u03BF\u03B9\u03B1 \u03B1\u03C0\u03CC \u03B1\u03C5\u03C4\u03AD\u03C2 \u03C4\u03B9\u03C2 \u03C7\u03CE\u03C1\u03B5\u03C2;"), /*#__PURE__*/_react["default"].createElement(_Hint["default"], null, "\u0391\u03BD \u03AD\u03C7\u03B5\u03C4\u03B5 \u03C0\u03BF\u03BB\u03BB\u03B1\u03C0\u03BB\u03AE \u03C5\u03C0\u03B7\u03BA\u03BF\u03CC\u03C4\u03B7\u03C4\u03B1, \u03B5\u03C0\u03B9\u03BB\u03AD\u03BE\u03C4\u03B5 \u03CC,\u03C4\u03B9 \u03B9\u03C3\u03C7\u03CD\u03B5\u03B9."), /*#__PURE__*/_react["default"].createElement(_ErrorMessage["default"], null, /*#__PURE__*/_react["default"].createElement(_VisuallyHidden["default"], null, "\u039B\u03AC\u03B8\u03BF\u03C2:"), " \u0395\u03C0\u03B9\u03BB\u03AD\u03BE\u03C4\u03B5 \u03BC\u03AF\u03B1 \u03AE \u03C0\u03B1\u03C1\u03B1\u03C0\u03AC\u03BD\u03C9 \u03C7\u03CE\u03C1\u03B5\u03C2."), /*#__PURE__*/_react["default"].createElement(_Checkboxes["default"], null, /*#__PURE__*/_react["default"].createElement(_Checkboxes.CheckboxItem, {

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,11 +13,13 @@ 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"], {
+  "aria-label": "\u03C0\u03BB\u03BF\u03B7\u03B3\u03B7\u03B8\u03B5\u03AF\u03C4\u03B5 \u03C3\u03C4\u03B7\u03BD \u03B9\u03C3\u03C4\u03BF\u03C3\u03B5\u03BB\u03AF\u03B4\u03B1 \u03C4\u03BF govgr",
+  role: "link",
   href: "#"
-}, " govgr link  "), /*#__PURE__*/_react["default"].createElement(_Divider["default"], null));
+}, "govgr link"), /*#__PURE__*/_react["default"].createElement(_Divider["default"], null));
 
 var DarkBackground = function DarkBackground() {
   return _ref;

package/core/Link/__stories__/DarkBackgroundNoUnderline.js

@@ -13,12 +13,14 @@ 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"], {
+  "aria-label": "\u03C0\u03BB\u03BF\u03B7\u03B3\u03B7\u03B8\u03B5\u03AF\u03C4\u03B5 \u03C3\u03C4\u03B7\u03BD \u03B9\u03C3\u03C4\u03BF\u03C3\u03B5\u03BB\u03AF\u03B4\u03B1 \u03C4\u03BF govgr",
+  role: "link",
   href: "#",
   underline: false
-}, " govgr link"), /*#__PURE__*/_react["default"].createElement(_Divider["default"], null));
+}, "govgr link"), /*#__PURE__*/_react["default"].createElement(_Divider["default"], null));
 
 var DarkBackgroundNoUnderline = function DarkBackgroundNoUnderline() {
   return _ref;

package/core/Link/__stories__/Default.js

@@ -12,8 +12,10 @@ var _react = _interopRequireDefault(require("react"));
 var _Link = _interopRequireDefault(require("@digigov/ui/core/Link"));
 
 var _ref = /*#__PURE__*/_react["default"].createElement(_Link["default"], {
+  "aria-label": "\u03C0\u03BB\u03BF\u03B7\u03B3\u03B7\u03B8\u03B5\u03AF\u03C4\u03B5 \u03C3\u03C4\u03B7\u03BD \u03B9\u03C3\u03C4\u03BF\u03C3\u03B5\u03BB\u03AF\u03B4\u03B1 \u03C4\u03BF govgr",
+  role: "link",
   href: "#"
-}, " govgr link ");
+}, "govgr link");
 
 var Default = function Default() {
   return _ref;