@digigov/ui 0.30.3 → 0.32.0

package/core/SingleCharacterInputContainer/SingleCharacterInputContainer.stories.js

@@ -0,0 +1,75 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {};
+exports["default"] = void 0;
+
+var _SingleCharacterInputContainer = _interopRequireDefault(require("@digigov/ui/core/SingleCharacterInputContainer"));
+
+var _Default = require("@digigov/ui/core/SingleCharacterInputContainer/__stories__/Default");
+
+Object.keys(_Default).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _Default[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _Default[key];
+    }
+  });
+});
+
+var _WithDefaultError = require("@digigov/ui/core/SingleCharacterInputContainer/__stories__/WithDefaultError");
+
+Object.keys(_WithDefaultError).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _WithDefaultError[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _WithDefaultError[key];
+    }
+  });
+});
+
+var _WithErrorMessageInvalidCode = require("@digigov/ui/core/SingleCharacterInputContainer/__stories__/WithErrorMessageInvalidCode");
+
+Object.keys(_WithErrorMessageInvalidCode).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _WithErrorMessageInvalidCode[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _WithErrorMessageInvalidCode[key];
+    }
+  });
+});
+
+var _WithErrorMessageLessDigit = require("@digigov/ui/core/SingleCharacterInputContainer/__stories__/WithErrorMessageLessDigit");
+
+Object.keys(_WithErrorMessageLessDigit).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _WithErrorMessageLessDigit[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _WithErrorMessageLessDigit[key];
+    }
+  });
+});
+var _default = {
+  title: 'Digigov UI/core/SingleCharacterInputContainer',
+  description: 'Use the One-time password input component to help users enter a memorable digital character for One-time password.',
+  link: 'https://guide.services.gov.gr/docs/patterns/one-time-password',
+  component: _SingleCharacterInputContainer["default"],
+  displayName: 'SingleCharacterInputContainer'
+};
+exports["default"] = _default;

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

@@ -0,0 +1,2 @@
+export declare const Default: () => JSX.Element;
+export default Default;

package/core/SingleCharacterInputContainer/__stories__/Default.js

@@ -0,0 +1,46 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.Default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _SingleCharacterInputContainer = require("@digigov/ui/core/SingleCharacterInputContainer");
+
+var _FieldContainer = require("@digigov/ui/core/FieldContainer");
+
+var _Paragraph = require("@digigov/ui/typography/Paragraph");
+
+var _ref = /*#__PURE__*/_react["default"].createElement(_FieldContainer.FieldContainer, null, /*#__PURE__*/_react["default"].createElement(_FieldContainer.Fieldset, null, /*#__PURE__*/_react["default"].createElement(_FieldContainer.FieldsetLegend, {
+  heading: true
+}, "\u039A\u03C9\u03B4\u03B9\u03BA\u03CC\u03C2 \u0395\u03C0\u03B9\u03B2\u03B5\u03B2\u03B1\u03AF\u03C9\u03C3\u03B7\u03C2"), /*#__PURE__*/_react["default"].createElement(_Paragraph.Paragraph, null, "\u0395\u03B9\u03C3\u03AC\u03B3\u03B5\u03C4\u03B5 \u03C4\u03BF\u03BD \u03BC\u03BF\u03BD\u03B1\u03B4\u03B9\u03BA\u03CC \u03BA\u03C9\u03B4\u03B9\u03BA\u03CC \u03C0\u03BF\u03C5 \u03BB\u03AC\u03B2\u03B1\u03C4\u03B5 \u03C3\u03C4\u03BF \u03B7\u03BB\u03B5\u03BA\u03C4\u03C1\u03BF\u03BD\u03B9\u03BA\u03CC \u03C3\u03B1\u03C2 \u03C4\u03B1\u03C7\u03C5\u03B4\u03C1\u03BF\u03BC\u03B5\u03AF\u03BF"), /*#__PURE__*/_react["default"].createElement(_SingleCharacterInputContainer.SingleCharacterInputContainer, null, /*#__PURE__*/_react["default"].createElement(_SingleCharacterInputContainer.SingleCharacterInputItem, {
+  name: "first-digit",
+  value: 4
+}), /*#__PURE__*/_react["default"].createElement(_SingleCharacterInputContainer.SingleCharacterInputItem, {
+  name: "second-digit",
+  value: 4
+}), /*#__PURE__*/_react["default"].createElement(_SingleCharacterInputContainer.SingleCharacterInputItem, {
+  name: "third-digit",
+  value: 5
+}), /*#__PURE__*/_react["default"].createElement(_SingleCharacterInputContainer.SingleCharacterInputItem, {
+  name: "forth-digit",
+  value: 1
+}), /*#__PURE__*/_react["default"].createElement(_SingleCharacterInputContainer.SingleCharacterInputItem, {
+  name: "fifth-digit",
+  value: 2
+}), /*#__PURE__*/_react["default"].createElement(_SingleCharacterInputContainer.SingleCharacterInputItem, {
+  name: "sixth-digit",
+  value: 3
+}))));
+
+var Default = function Default() {
+  return _ref;
+};
+
+exports.Default = Default;
+var _default = Default;
+exports["default"] = _default;

package/core/SingleCharacterInputContainer/__stories__/WithDefaultError.d.ts

@@ -0,0 +1,2 @@
+export declare const WithDefaultError: () => JSX.Element;
+export default WithDefaultError;

package/core/SingleCharacterInputContainer/__stories__/WithDefaultError.js

@@ -0,0 +1,52 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.WithDefaultError = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _SingleCharacterInputContainer = require("@digigov/ui/core/SingleCharacterInputContainer");
+
+var _FieldContainer = require("@digigov/ui/core/FieldContainer");
+
+var _Paragraph = require("@digigov/ui/typography/Paragraph");
+
+var _ErrorMessage = require("@digigov/ui/core/ErrorMessage");
+
+var _VisuallyHidden = require("@digigov/ui/core/VisuallyHidden");
+
+var _ref = /*#__PURE__*/_react["default"].createElement(_FieldContainer.FieldContainer, {
+  error: true
+}, /*#__PURE__*/_react["default"].createElement(_FieldContainer.Fieldset, null, /*#__PURE__*/_react["default"].createElement(_FieldContainer.FieldsetLegend, {
+  heading: true
+}, "\u039A\u03C9\u03B4\u03B9\u03BA\u03CC\u03C2 \u0395\u03C0\u03B9\u03B2\u03B5\u03B2\u03B1\u03AF\u03C9\u03C3\u03B7\u03C2"), /*#__PURE__*/_react["default"].createElement(_Paragraph.Paragraph, null, "\u0395\u03B9\u03C3\u03AC\u03B3\u03B5\u03C4\u03B5 \u03C4\u03BF\u03BD \u03BC\u03BF\u03BD\u03B1\u03B4\u03B9\u03BA\u03CC \u03BA\u03C9\u03B4\u03B9\u03BA\u03CC \u03C0\u03BF\u03C5 \u03BB\u03AC\u03B2\u03B1\u03C4\u03B5 \u03C3\u03C4\u03BF \u03B7\u03BB\u03B5\u03BA\u03C4\u03C1\u03BF\u03BD\u03B9\u03BA\u03CC \u03C3\u03B1\u03C2 \u03C4\u03B1\u03C7\u03C5\u03B4\u03C1\u03BF\u03BC\u03B5\u03AF\u03BF"), /*#__PURE__*/_react["default"].createElement(_ErrorMessage.ErrorMessage, null, /*#__PURE__*/_react["default"].createElement(_VisuallyHidden.VisuallyHidden, null, "\u039B\u03AC\u03B8\u03BF\u03C2:"), "\u03A4\u03BF \u03C0\u03B5\u03B4\u03AF\u03BF \u03B5\u03AF\u03BD\u03B1\u03B9 \u03C5\u03C0\u03BF\u03C7\u03C1\u03B5\u03C9\u03C4\u03B9\u03BA\u03CC."), /*#__PURE__*/_react["default"].createElement(_SingleCharacterInputContainer.SingleCharacterInputContainer, null, /*#__PURE__*/_react["default"].createElement(_SingleCharacterInputContainer.SingleCharacterInputItem, {
+  name: "first-digit",
+  error: true
+}), /*#__PURE__*/_react["default"].createElement(_SingleCharacterInputContainer.SingleCharacterInputItem, {
+  name: "second-digit",
+  error: true
+}), /*#__PURE__*/_react["default"].createElement(_SingleCharacterInputContainer.SingleCharacterInputItem, {
+  name: "third-digit",
+  error: true
+}), /*#__PURE__*/_react["default"].createElement(_SingleCharacterInputContainer.SingleCharacterInputItem, {
+  name: "forth-digit",
+  error: true
+}), /*#__PURE__*/_react["default"].createElement(_SingleCharacterInputContainer.SingleCharacterInputItem, {
+  name: "fifth-digit",
+  error: true
+}), /*#__PURE__*/_react["default"].createElement(_SingleCharacterInputContainer.SingleCharacterInputItem, {
+  name: "sixth-digit",
+  error: true
+}))));
+
+var WithDefaultError = function WithDefaultError() {
+  return _ref;
+};
+
+exports.WithDefaultError = WithDefaultError;
+var _default = WithDefaultError;
+exports["default"] = _default;

package/core/SingleCharacterInputContainer/__stories__/WithErrorMessageInvalidCode.d.ts

@@ -0,0 +1,2 @@
+export declare const WithErrorMessageInvalidCode: () => JSX.Element;
+export default WithErrorMessageInvalidCode;

package/core/SingleCharacterInputContainer/__stories__/WithErrorMessageInvalidCode.js

@@ -0,0 +1,58 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.WithErrorMessageInvalidCode = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _SingleCharacterInputContainer = require("@digigov/ui/core/SingleCharacterInputContainer");
+
+var _FieldContainer = require("@digigov/ui/core/FieldContainer");
+
+var _Paragraph = require("@digigov/ui/typography/Paragraph");
+
+var _ErrorMessage = require("@digigov/ui/core/ErrorMessage");
+
+var _VisuallyHidden = require("@digigov/ui/core/VisuallyHidden");
+
+var _ref = /*#__PURE__*/_react["default"].createElement(_FieldContainer.FieldContainer, {
+  error: true
+}, /*#__PURE__*/_react["default"].createElement(_FieldContainer.Fieldset, null, /*#__PURE__*/_react["default"].createElement(_FieldContainer.FieldsetLegend, {
+  heading: true
+}, "\u039A\u03C9\u03B4\u03B9\u03BA\u03CC\u03C2 \u0395\u03C0\u03B9\u03B2\u03B5\u03B2\u03B1\u03AF\u03C9\u03C3\u03B7\u03C2"), /*#__PURE__*/_react["default"].createElement(_Paragraph.Paragraph, null, "\u0395\u03B9\u03C3\u03AC\u03B3\u03B5\u03C4\u03B5 \u03C4\u03BF\u03BD \u03BC\u03BF\u03BD\u03B1\u03B4\u03B9\u03BA\u03CC \u03BA\u03C9\u03B4\u03B9\u03BA\u03CC \u03C0\u03BF\u03C5 \u03BB\u03AC\u03B2\u03B1\u03C4\u03B5 \u03C3\u03C4\u03BF \u03B7\u03BB\u03B5\u03BA\u03C4\u03C1\u03BF\u03BD\u03B9\u03BA\u03CC \u03C3\u03B1\u03C2 \u03C4\u03B1\u03C7\u03C5\u03B4\u03C1\u03BF\u03BC\u03B5\u03AF\u03BF"), /*#__PURE__*/_react["default"].createElement(_ErrorMessage.ErrorMessage, null, /*#__PURE__*/_react["default"].createElement(_VisuallyHidden.VisuallyHidden, null, "\u039B\u03AC\u03B8\u03BF\u03C2:"), "\u0388\u03C7\u03B5\u03C4\u03B5 \u03B5\u03B9\u03C3\u03AC\u03B3\u03B5\u03B9 \u03BB\u03AC\u03B8\u03BF\u03C2 \u03BA\u03C9\u03B4\u03B9\u03BA\u03CC."), /*#__PURE__*/_react["default"].createElement(_SingleCharacterInputContainer.SingleCharacterInputContainer, null, /*#__PURE__*/_react["default"].createElement(_SingleCharacterInputContainer.SingleCharacterInputItem, {
+  name: "first-digit",
+  value: 4,
+  error: true
+}), /*#__PURE__*/_react["default"].createElement(_SingleCharacterInputContainer.SingleCharacterInputItem, {
+  name: "second-digit",
+  value: 4,
+  error: true
+}), /*#__PURE__*/_react["default"].createElement(_SingleCharacterInputContainer.SingleCharacterInputItem, {
+  name: "third-digit",
+  value: 5,
+  error: true
+}), /*#__PURE__*/_react["default"].createElement(_SingleCharacterInputContainer.SingleCharacterInputItem, {
+  name: "forth-digit",
+  value: 1,
+  error: true
+}), /*#__PURE__*/_react["default"].createElement(_SingleCharacterInputContainer.SingleCharacterInputItem, {
+  name: "fifth-digit",
+  value: 2,
+  error: true
+}), /*#__PURE__*/_react["default"].createElement(_SingleCharacterInputContainer.SingleCharacterInputItem, {
+  name: "sixth-digit",
+  value: 3,
+  error: true
+}))));
+
+var WithErrorMessageInvalidCode = function WithErrorMessageInvalidCode() {
+  return _ref;
+};
+
+exports.WithErrorMessageInvalidCode = WithErrorMessageInvalidCode;
+var _default = WithErrorMessageInvalidCode;
+exports["default"] = _default;

package/core/SingleCharacterInputContainer/__stories__/WithErrorMessageLessDigit.d.ts

@@ -0,0 +1,2 @@
+export declare const WithErrorMessageLessDigit: () => JSX.Element;
+export default WithErrorMessageLessDigit;

package/core/SingleCharacterInputContainer/__stories__/WithErrorMessageLessDigit.js

@@ -0,0 +1,52 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.WithErrorMessageLessDigit = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _SingleCharacterInputContainer = require("@digigov/ui/core/SingleCharacterInputContainer");
+
+var _FieldContainer = require("@digigov/ui/core/FieldContainer");
+
+var _Paragraph = require("@digigov/ui/typography/Paragraph");
+
+var _ErrorMessage = require("@digigov/ui/core/ErrorMessage");
+
+var _VisuallyHidden = require("@digigov/ui/core/VisuallyHidden");
+
+var _ref = /*#__PURE__*/_react["default"].createElement(_FieldContainer.FieldContainer, {
+  error: true
+}, /*#__PURE__*/_react["default"].createElement(_FieldContainer.Fieldset, null, /*#__PURE__*/_react["default"].createElement(_FieldContainer.FieldsetLegend, {
+  heading: true
+}, "\u039A\u03C9\u03B4\u03B9\u03BA\u03CC\u03C2 \u0395\u03C0\u03B9\u03B2\u03B5\u03B2\u03B1\u03AF\u03C9\u03C3\u03B7\u03C2"), /*#__PURE__*/_react["default"].createElement(_Paragraph.Paragraph, null, "\u0395\u03B9\u03C3\u03AC\u03B3\u03B5\u03C4\u03B5 \u03C4\u03BF\u03BD \u03BC\u03BF\u03BD\u03B1\u03B4\u03B9\u03BA\u03CC \u03BA\u03C9\u03B4\u03B9\u03BA\u03CC \u03C0\u03BF\u03C5 \u03BB\u03AC\u03B2\u03B1\u03C4\u03B5 \u03C3\u03C4\u03BF \u03B7\u03BB\u03B5\u03BA\u03C4\u03C1\u03BF\u03BD\u03B9\u03BA\u03CC \u03C3\u03B1\u03C2 \u03C4\u03B1\u03C7\u03C5\u03B4\u03C1\u03BF\u03BC\u03B5\u03AF\u03BF"), /*#__PURE__*/_react["default"].createElement(_ErrorMessage.ErrorMessage, null, /*#__PURE__*/_react["default"].createElement(_VisuallyHidden.VisuallyHidden, null, "\u039B\u03AC\u03B8\u03BF\u03C2:"), "\u0388\u03C7\u03B5\u03C4\u03B5 \u03C3\u03C5\u03BC\u03C0\u03BB\u03B7\u03C1\u03CE\u03C3\u03B5\u03B9 \u03BB\u03B9\u03B3\u03CC\u03C4\u03B5\u03C1\u03B1 \u03B1\u03C0\u03CC 6 \u03C8\u03B7\u03C6\u03AF\u03B1.."), /*#__PURE__*/_react["default"].createElement(_SingleCharacterInputContainer.SingleCharacterInputContainer, null, /*#__PURE__*/_react["default"].createElement(_SingleCharacterInputContainer.SingleCharacterInputItem, {
+  name: "first-digit",
+  value: "6"
+}), /*#__PURE__*/_react["default"].createElement(_SingleCharacterInputContainer.SingleCharacterInputItem, {
+  name: "second-digit",
+  value: "4"
+}), /*#__PURE__*/_react["default"].createElement(_SingleCharacterInputContainer.SingleCharacterInputItem, {
+  name: "third-digit",
+  value: "5"
+}), /*#__PURE__*/_react["default"].createElement(_SingleCharacterInputContainer.SingleCharacterInputItem, {
+  name: "forth-digit",
+  error: true
+}), /*#__PURE__*/_react["default"].createElement(_SingleCharacterInputContainer.SingleCharacterInputItem, {
+  name: "fifth-digit",
+  error: true
+}), /*#__PURE__*/_react["default"].createElement(_SingleCharacterInputContainer.SingleCharacterInputItem, {
+  name: "sixth-digit",
+  error: true
+}))));
+
+var WithErrorMessageLessDigit = function WithErrorMessageLessDigit() {
+  return _ref;
+};
+
+exports.WithErrorMessageLessDigit = WithErrorMessageLessDigit;
+var _default = WithErrorMessageLessDigit;
+exports["default"] = _default;

package/core/SingleCharacterInputContainer/index.d.ts

@@ -0,0 +1,4 @@
+export * from '@digigov/react-core/SingleCharacterInputContainer';
+export * from '@digigov/react-core/SingleCharacterInputItem';
+import SingleCharacterInputContainer from '@digigov/react-core/SingleCharacterInputContainer';
+export default SingleCharacterInputContainer;

package/core/SingleCharacterInputContainer/index.js

@@ -0,0 +1,44 @@
+"use strict";
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {};
+exports["default"] = void 0;
+
+var _SingleCharacterInputContainer = _interopRequireWildcard(require("@digigov/react-core/SingleCharacterInputContainer"));
+
+Object.keys(_SingleCharacterInputContainer).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _SingleCharacterInputContainer[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _SingleCharacterInputContainer[key];
+    }
+  });
+});
+
+var _SingleCharacterInputItem = require("@digigov/react-core/SingleCharacterInputItem");
+
+Object.keys(_SingleCharacterInputItem).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _SingleCharacterInputItem[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _SingleCharacterInputItem[key];
+    }
+  });
+});
+
+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 _default = _SingleCharacterInputContainer["default"];
+exports["default"] = _default;

package/core/SingleCharacterInputContainer/index.mdx

@@ -0,0 +1,29 @@
+---
+id: otp-input
+title: SingleCharacterInputContainer
+---
+
+# SingleCharacterInputItem
+
+```bash
+import SingleCharacterInputContainer from '@digigov/ui/core/SingleCharacterInputContainer';
+```
+
+## How to use
+
+<Story
+  packageName="@digigov/ui"
+  component="core/SingleCharacterInputContainer"
+  story="Default.tsx"
+/>
+
+
+### Error message
+
+If you’re highlighting the whole date, style all the fields like this:
+
+<Story
+  packageName="@digigov/ui"
+  component="core/SingleCharacterInputContainer"
+  story="WithDefaultError.tsx"
+/>

package/core/Tabs/__stories__/Default.js

@@ -12,7 +12,7 @@ var _react = _interopRequireDefault(require("react"));
 
 var _Tabs = require("@digigov/ui/core/Tabs");
 
-var _Title = require("@digigov/ui/typography/Title");
+var _Heading = require("@digigov/ui/typography/Heading");
 
 var _VisuallyHidden = require("@digigov/ui/core/VisuallyHidden");
 
@@ -20,8 +20,8 @@ var _SummaryList = require("@digigov/ui/core/SummaryList");
 
 var _Link = require("@digigov/ui/core/Link");
 
-var _ref = /*#__PURE__*/_react["default"].createElement(_Title.Title, {
-  size: "md",
+var _ref = /*#__PURE__*/_react["default"].createElement(_Heading.Heading, {
+  size: "m",
   element: "h3"
 }, "\u03A3\u03C4\u03BF\u03B9\u03C7\u03B5\u03AF\u03B1 \u03C0\u03BF\u03BB\u03AF\u03C4\u03B7");
 
@@ -29,8 +29,8 @@ var _ref2 = /*#__PURE__*/_react["default"].createElement(_SummaryList.SummaryLis
   href: "#"
 }, "\u0391\u03BB\u03BB\u03B1\u03B3\u03AE ", /*#__PURE__*/_react["default"].createElement(_VisuallyHidden.VisuallyHidden, null, " \u03BF\u03BD\u03CC\u03BC\u03B1\u03C4\u03BF\u03C2 ")))), /*#__PURE__*/_react["default"].createElement(_SummaryList.SummaryListItem, null, /*#__PURE__*/_react["default"].createElement(_SummaryList.SummaryListItemKey, null, "\u0397\u03BC. \u0393\u03AD\u03BD\u03BD\u03B7\u03C3\u03B7\u03C2"), /*#__PURE__*/_react["default"].createElement(_SummaryList.SummaryListItemValue, null, "11 \u039C\u03B1\u03CA\u03BF\u03C5 1990")), /*#__PURE__*/_react["default"].createElement(_SummaryList.SummaryListItem, null, /*#__PURE__*/_react["default"].createElement(_SummaryList.SummaryListItemKey, null, "\u03A4\u03B7\u03BB\u03AD\u03C6\u03C9\u03BD\u03BF \u03B5\u03C0\u03B9\u03BA\u03BF\u03B9\u03BD\u03C9\u03BD\u03AF\u03B1\u03C2"), /*#__PURE__*/_react["default"].createElement(_SummaryList.SummaryListItemValue, null, "6941234567"), /*#__PURE__*/_react["default"].createElement(_SummaryList.SummaryListItemAction, null, ' ', /*#__PURE__*/_react["default"].createElement(_Link.Link, null, ' ', "\u0391\u03BB\u03BB\u03B1\u03B3\u03AE ", /*#__PURE__*/_react["default"].createElement(_VisuallyHidden.VisuallyHidden, null, " \u03C4\u03B7\u03BB\u03B5\u03C6\u03CE\u03BD\u03BF\u03C5 ")))));
 
-var _ref3 = /*#__PURE__*/_react["default"].createElement(_Title.Title, {
-  size: "md",
+var _ref3 = /*#__PURE__*/_react["default"].createElement(_Heading.Heading, {
+  size: "m",
   element: "h3"
 }, "Y\u03C0\u03BF\u03B8\u03AD\u03C3\u03B5\u03B9\u03C2");
 

package/core/Tabs/index.d.ts

@@ -1,6 +1,6 @@
 import Tabs from '@digigov/react-core/Tabs';
-import { UseTogglableSectionsReturn } from '@digigov/ui/hooks/useTogglableSections';
-export interface UseTabsReturn extends UseTogglableSectionsReturn {
+import { UseTogglableTabReturn } from '@digigov/ui/hooks/useTogglableTab';
+export interface UseTabsReturn extends UseTogglableTabReturn {
     panel: (key: string) => {
         active: boolean;
         tabIndex: number;

package/core/Tabs/index.js

@@ -32,7 +32,7 @@ Object.keys(_Tabs).forEach(function (key) {
   });
 });
 
-var _useTogglableSections2 = require("@digigov/ui/hooks/useTogglableSections");
+var _useTogglableTab2 = require("@digigov/ui/hooks/useTogglableTab");
 
 var _TabsList = require("@digigov/react-core/TabsList");
 
@@ -98,8 +98,6 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 var useTabs = function useTabs() {
   var registeredPanels = (0, _react.useRef)({});
   var goTo = (0, _react.useCallback)(function (key) {
-    console.log(registeredPanels.current[key].offsetTop - rest.registered.current[key].offsetTop);
-
     if (registeredPanels.current[key].offsetTop - rest.registered.current[key].offsetTop >= 30) {
       var _registeredPanels$cur;
 
@@ -110,7 +108,7 @@ var useTabs = function useTabs() {
     }
   }, []);
 
-  var _useTogglableSections = (0, _useTogglableSections2.useTogglableSections)({
+  var _useTogglableTab = (0, _useTogglableTab2.useTogglableTab)({
     singleOpen: true,
     toggleProperty: 'selected',
     onToggleProperty: 'onClick',
@@ -118,9 +116,9 @@ var useTabs = function useTabs() {
     ariaNavigation: true,
     toggleHook: goTo
   }),
-      register = _useTogglableSections.register,
-      opened = _useTogglableSections.opened,
-      rest = (0, _objectWithoutProperties2["default"])(_useTogglableSections, _excluded);
+      register = _useTogglableTab.register,
+      opened = _useTogglableTab.opened,
+      rest = (0, _objectWithoutProperties2["default"])(_useTogglableTab, _excluded);
 
   var panel = (0, _react.useCallback)(function (key) {
     return {

package/es/admin/AccessibilityMenu/index.js

@@ -0,0 +1,13 @@
+export * from '@digigov/react-extensions/admin/AccessibilityMenu';
+export * from '@digigov/react-extensions/admin/AccessibilityMenuButton';
+export * from '@digigov/react-extensions/admin/AccessibilityMenuContent';
+export * from '@digigov/react-extensions/admin/AccessibilityMenuHeader';
+export * from '@digigov/react-extensions/admin/AccessibilityMenuBody';
+export * from '@digigov/react-extensions/admin/AccessibilityMenuList';
+export * from '@digigov/react-extensions/admin/AccessibilityMenuListItem';
+export * from '@digigov/react-extensions/admin/AccessibilityMenuOptionButton';
+export * from '@digigov/react-extensions/admin/AccessibilityMenuSteps';
+export * from '@digigov/react-core/AccessibilityIcon';
+export * from '@digigov/react-core/AccessibilityTextIcon';
+import AccessibilityMenu from '@digigov/react-extensions/admin/AccessibilityMenu';
+export default AccessibilityMenu;

package/es/admin/Chip/index.js

@@ -3,5 +3,6 @@ export * from '@digigov/react-extensions/admin/ChipHeading';
 export * from '@digigov/react-extensions/admin/ChipSection';
 export * from '@digigov/react-extensions/admin/ChipSectionHorizontal';
 export * from '@digigov/react-extensions/admin/ChipSectionWrapper';
+export * from '@digigov/react-extensions/admin/ChipKeyValue';
 import Chip from '@digigov/react-extensions/admin/Chip';
 export default Chip;

package/es/admin/CopyToClipboard/CopyToClipboard.stories.playwright.json

@@ -12,7 +12,7 @@
               }
             }
           ],
-          "id": "BSaIJR2CMZJU",
+          "id": "slm0qFzUIkGw",
           "title": "Click button"
         }
       ]
@@ -28,7 +28,7 @@
               }
             }
           ],
-          "id": "T50MBtHpfRog",
+          "id": "dTykMmK3AzLT",
           "title": "Click button"
         }
       ]

package/es/admin/Drawer/__stories__/Default.js

@@ -3,7 +3,7 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import React, { useState } from 'react';
 import { Drawer } from '@digigov/ui/admin/Drawer';
 import { isNavListItemLinkInterface, NavListAuto, NavListItem, NavMenu, NavMenuContainer, NavMenuContainerContent, NavMenuContainerContentList, NavMenuContainerContentListItem, NavMenuContainerTitle } from '@digigov/ui/core/NavList';
-import { useNavList } from "@digigov/ui/hooks/useNavList";
+import { useNavList } from '@digigov/ui/hooks/useNavList';
 import { Title } from '@digigov/ui/typography/Title';
 import { DrawerHeading } from '@digigov/ui/admin/Drawer';
 import { Link } from '@digigov/ui/core';
@@ -64,13 +64,19 @@ export var Default = function Default() {
 
   var _useNavList = useNavList(),
       container = _useNavList.container,
-      register = _useNavList.register;
+      registerButton = _useNavList.registerButton,
+      registerLink = _useNavList.registerLink;
 
-  var setRegister = function setRegister(name) {
-    return _extends({}, register(name));
+  var setRegisterButton = function setRegisterButton(name) {
+    return _extends({}, registerButton(name));
+  };
+
+  var setRegisterLink = function setRegisterLink(name) {
+    return _extends({}, registerLink(name));
   };
 
   var layout = 'vertical';
+  var border = false;
   return /*#__PURE__*/React.createElement(Drawer, {
     direction: "left",
     open: open
@@ -81,31 +87,32 @@ export var Default = function Default() {
   }, _ref), /*#__PURE__*/React.createElement(NavListAuto, {
     layout: layout,
     links: links,
-    "aria-label": "Nav list",
-    role: "menu"
+    border: border,
+    "aria-label": "Nav list"
   }, links.map(function (item, key) {
     var _item$subMenu;
 
     return /*#__PURE__*/React.createElement(React.Fragment, {
       key: key
     }, /*#__PURE__*/React.createElement(NavListItem, {
-      layout: layout,
       link: item,
-      setRegister: setRegister
+      setRegisterButton: setRegisterButton,
+      setRegisterLink: setRegisterLink
     }), /*#__PURE__*/React.createElement(NavMenu, _extends({
       layout: layout
     }, container(item.name)), /*#__PURE__*/React.createElement(NavMenuContainer, {
       layout: layout,
       paddingLeft: 5,
       paddingRight: 5
-    }, /*#__PURE__*/React.createElement(NavMenuContainerTitle, {
-      layout: layout
-    }, item.label), /*#__PURE__*/React.createElement(NavMenuContainerContent, null, /*#__PURE__*/React.createElement(NavMenuContainerContentList, {
-      layout: layout
+    }, /*#__PURE__*/React.createElement(NavMenuContainerTitle, null, item.label), /*#__PURE__*/React.createElement(NavMenuContainerContent, null, /*#__PURE__*/React.createElement(NavMenuContainerContentList, {
+      role: "menu"
     }, (_item$subMenu = item.subMenu) === null || _item$subMenu === void 0 ? void 0 : _item$subMenu.map(function (subMenu, menuIndex) {
       return isNavListItemLinkInterface(subMenu) && /*#__PURE__*/React.createElement(NavMenuContainerContentListItem, {
-        key: menuIndex
+        key: menuIndex,
+        role: "presentation"
       }, /*#__PURE__*/React.createElement(Link, {
+        role: "menuitem",
+        id: subMenu.name,
         href: subMenu.href
       }, subMenu.label));
     }))))));

package/es/admin/Dropdown/__stories__/AlignRight.js

@@ -25,7 +25,6 @@ var _ref = /*#__PURE__*/React.createElement(Dropdown, {
 }, /*#__PURE__*/React.createElement(LabelContainer, null, /*#__PURE__*/React.createElement(LabelTitle, null, "\u038C\u03BD\u03BF\u03BC\u03B1 \u03C0\u03B5\u03B4\u03AF\u03BF\u03C5"), /*#__PURE__*/React.createElement(TextInput, {
   name: "input-name"
 }))), /*#__PURE__*/React.createElement(SectionBreak, {
-  visible: true,
   role: "separator"
 }), /*#__PURE__*/React.createElement(NavVertical, {
   role: "menu"
@@ -39,7 +38,6 @@ var _ref = /*#__PURE__*/React.createElement(Dropdown, {
   role: "menuitem",
   href: "#"
 }, "\u039F\u03C1\u03B9\u03C3\u03C4\u03B9\u03BA\u03AE \u03B4\u03B9\u03B1\u03B3\u03C1\u03B1\u03C6\u03AE")), /*#__PURE__*/React.createElement(SectionBreak, {
-  visible: true,
   role: "separator"
 }), /*#__PURE__*/React.createElement(Button, {
   role: "menuitem"

package/es/admin/Dropdown/__stories__/Default.js

@@ -24,7 +24,6 @@ var _ref = /*#__PURE__*/React.createElement(Dropdown, {
 }, /*#__PURE__*/React.createElement(LabelContainer, null, /*#__PURE__*/React.createElement(LabelTitle, null, "\u038C\u03BD\u03BF\u03BC\u03B1 \u03C0\u03B5\u03B4\u03AF\u03BF\u03C5"), /*#__PURE__*/React.createElement(TextInput, {
   name: "input-name"
 }))), /*#__PURE__*/React.createElement(SectionBreak, {
-  visible: true,
   role: "separator"
 }), /*#__PURE__*/React.createElement(NavVertical, {
   role: "menu"
@@ -38,7 +37,6 @@ var _ref = /*#__PURE__*/React.createElement(Dropdown, {
   role: "menuitem",
   href: "#"
 }, "\u039F\u03C1\u03B9\u03C3\u03C4\u03B9\u03BA\u03AE \u03B4\u03B9\u03B1\u03B3\u03C1\u03B1\u03C6\u03AE")), /*#__PURE__*/React.createElement(SectionBreak, {
-  visible: true,
   role: "separator"
 }), /*#__PURE__*/React.createElement(Button, {
   role: "menuitem"

package/es/admin/Dropdown/__stories__/PlacementTop.js

@@ -25,7 +25,6 @@ var _ref = /*#__PURE__*/React.createElement(Dropdown, {
 }, /*#__PURE__*/React.createElement(LabelContainer, null, /*#__PURE__*/React.createElement(LabelTitle, null, "\u038C\u03BD\u03BF\u03BC\u03B1 \u03C0\u03B5\u03B4\u03AF\u03BF\u03C5"), /*#__PURE__*/React.createElement(TextInput, {
   name: "input-name"
 }))), /*#__PURE__*/React.createElement(SectionBreak, {
-  visible: true,
   role: "separator"
 }), /*#__PURE__*/React.createElement(NavVertical, {
   role: "menu"
@@ -39,7 +38,6 @@ var _ref = /*#__PURE__*/React.createElement(Dropdown, {
   role: "menuitem",
   href: "#"
 }, "\u039F\u03C1\u03B9\u03C3\u03C4\u03B9\u03BA\u03AE \u03B4\u03B9\u03B1\u03B3\u03C1\u03B1\u03C6\u03AE")), /*#__PURE__*/React.createElement(SectionBreak, {
-  visible: true,
   role: "separator"
 }), /*#__PURE__*/React.createElement(Button, {
   role: "menuitem"