@digigov/ui 0.23.0 → 0.24.0

package/CHANGELOG.md

@@ -1,6 +1,15 @@
 # Change Log - @digigov/ui
 
-This log was last generated on Tue, 26 Jul 2022 07:39:59 GMT and should not be manually modified.
+This log was last generated on Wed, 03 Aug 2022 10:06:10 GMT and should not be manually modified.
+
+## 0.24.0
+Wed, 03 Aug 2022 10:06:10 GMT
+
+### Minor changes
+
+- Implement Timeline component
+- Add Storybook example
+- export TaskList component
 
 ## 0.23.0
 Tue, 26 Jul 2022 07:39:59 GMT

package/admin/TaskList/TaskList.stories.d.ts

@@ -0,0 +1,7 @@
+declare namespace _default {
+    export const title: string;
+    export { TaskList as component };
+}
+export default _default;
+export * from "./__stories__/Default";
+import TaskList from "@digigov/ui/admin/TaskList";

package/admin/TaskList/TaskList.stories.js

@@ -0,0 +1,30 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {};
+exports["default"] = void 0;
+
+var _TaskList = _interopRequireDefault(require("@digigov/ui/admin/TaskList"));
+
+var _Default = require("./__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 _default = {
+  title: 'Digigov UI/admin/TaskList',
+  component: _TaskList["default"]
+};
+exports["default"] = _default;

package/admin/TaskList/__stories__/Default.d.ts

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

package/admin/TaskList/__stories__/Default.js

@@ -0,0 +1,97 @@
+"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.Default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _reactCore = require("@digigov/react-core");
+
+var _SummaryList = _interopRequireWildcard(require("@digigov/ui/core/SummaryList"));
+
+var _admin = require("@digigov/ui/admin");
+
+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 fields = [{
+  title: 'Check before you start',
+  tasks: [{
+    text: 'Check eligibility',
+    status: 'Completed'
+  }, {
+    text: 'Read declaration',
+    status: 'Completed'
+  }]
+}, {
+  title: 'Prepare application',
+  tasks: [{
+    text: 'Company information',
+    status: 'Completed'
+  }, {
+    text: 'Your contact details',
+    status: 'In progress'
+  }, {
+    text: 'List convictions',
+    status: 'Not started'
+  }, {
+    text: 'Provide financial evidence',
+    status: 'Cannot start yet'
+  }, {
+    text: 'Give medical information',
+    status: 'Cannot start yet'
+  }]
+}, {
+  title: 'Apply',
+  tasks: [{
+    text: 'Submit and pay',
+    status: 'Cannot start yet'
+  }]
+}];
+
+var Default = function Default() {
+  return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_admin.TaskList, null, fields && fields.map(function (field, index) {
+    return /*#__PURE__*/_react["default"].createElement(_admin.TaskListItem, {
+      key: index
+    }, /*#__PURE__*/_react["default"].createElement(_admin.TaskListItemHeading, {
+      size: "m"
+    }, "".concat(index + 1, ". ").concat(field.title)), /*#__PURE__*/_react["default"].createElement(_admin.TaskListItemContent, null, /*#__PURE__*/_react["default"].createElement(_SummaryList["default"], null, field.tasks.map(function (task, key) {
+      var tagColor;
+
+      switch (task.status) {
+        case 'Completed':
+          tagColor = 'completed';
+          break;
+
+        case 'In progress':
+          tagColor = 'in-progress';
+          break;
+
+        case 'Not started':
+          tagColor = 'not-started';
+          break;
+
+        case 'Cannot start yet':
+          tagColor = 'not-started';
+          break;
+      }
+
+      return /*#__PURE__*/_react["default"].createElement(_SummaryList.SummaryListItem, {
+        key: key
+      }, /*#__PURE__*/_react["default"].createElement(_SummaryList.SummaryListItemKey, null, /*#__PURE__*/_react["default"].createElement(_reactCore.Link, null, task.text)), /*#__PURE__*/_react["default"].createElement(_SummaryList.SummaryListItemAction, null, /*#__PURE__*/_react["default"].createElement(_admin.TaskListItemTag, {
+        status: tagColor
+      }, task.status)));
+    }))));
+  })));
+};
+
+exports.Default = Default;
+var _default = Default;
+exports["default"] = _default;

package/admin/TaskList/index.d.ts

@@ -0,0 +1,7 @@
+export * from '@digigov/react-extensions/admin/TaskList';
+export * from '@digigov/react-extensions/admin/TaskListItem';
+export * from '@digigov/react-extensions/admin/TaskListItemContent';
+export * from '@digigov/react-extensions/admin/TaskListItemHeading';
+export * from '@digigov/react-extensions/admin/TaskListItemTag';
+import TaskList from '@digigov/react-extensions/admin/TaskList';
+export default TaskList;

package/admin/TaskList/index.js

@@ -0,0 +1,86 @@
+"use strict";
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {};
+exports["default"] = void 0;
+
+var _TaskList = _interopRequireWildcard(require("@digigov/react-extensions/admin/TaskList"));
+
+Object.keys(_TaskList).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _TaskList[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _TaskList[key];
+    }
+  });
+});
+
+var _TaskListItem = require("@digigov/react-extensions/admin/TaskListItem");
+
+Object.keys(_TaskListItem).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _TaskListItem[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _TaskListItem[key];
+    }
+  });
+});
+
+var _TaskListItemContent = require("@digigov/react-extensions/admin/TaskListItemContent");
+
+Object.keys(_TaskListItemContent).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _TaskListItemContent[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _TaskListItemContent[key];
+    }
+  });
+});
+
+var _TaskListItemHeading = require("@digigov/react-extensions/admin/TaskListItemHeading");
+
+Object.keys(_TaskListItemHeading).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _TaskListItemHeading[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _TaskListItemHeading[key];
+    }
+  });
+});
+
+var _TaskListItemTag = require("@digigov/react-extensions/admin/TaskListItemTag");
+
+Object.keys(_TaskListItemTag).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _TaskListItemTag[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _TaskListItemTag[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 = _TaskList["default"];
+exports["default"] = _default;

package/admin/Timeline/Timeline.stories.d.ts

@@ -0,0 +1,7 @@
+declare namespace _default {
+    export const title: string;
+    export { Timeline as component };
+}
+export default _default;
+export * from "./__stories__/Default";
+import Timeline from "@digigov/ui/admin/Timeline";

package/admin/Timeline/Timeline.stories.js

@@ -0,0 +1,30 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {};
+exports["default"] = void 0;
+
+var _Timeline = _interopRequireDefault(require("@digigov/ui/admin/Timeline"));
+
+var _Default = require("./__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 _default = {
+  title: 'Digigov UI/admin/Timeline',
+  component: _Timeline["default"]
+};
+exports["default"] = _default;

package/admin/Timeline/__stories__/Default.d.ts

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

package/admin/Timeline/__stories__/Default.js

@@ -0,0 +1,87 @@
+"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.Default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _reactCore = require("@digigov/react-core");
+
+var _admin = require("@digigov/ui/admin");
+
+var _Details = _interopRequireWildcard(require("@digigov/ui/core/Details"));
+
+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 data = [{
+  title: 'Application requires confirmation',
+  date: '14 June 2019 at 2:01pm',
+  text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras non felis risus. Curabitur nec ante vitae felis ullamcorper tincidunt.',
+  links: [{
+    text: 'See application',
+    href: '#'
+  }]
+}, {
+  title: 'Application review in progress ',
+  date: '7 June 2019 at 12:32pm',
+  text: 'Your application is being reviewed by one of our case workers.',
+  buttons: [{
+    text: 'Continue'
+  }, {
+    text: 'Cancel',
+    color: 'warning'
+  }]
+}, {
+  title: 'Application received ',
+  date: '6 June 2019 at 9:12am ',
+  text: 'Your application has been received – reference MOJ-1234-5678'
+}, {
+  title: 'Application details ',
+  date: '6 June 2019 at 9:12am ',
+  detailsSummary: 'More info regarding your application',
+  detailsContent: 'Your application has been received – reference MOJ-1234-5678'
+}, {
+  title: 'Application submitted',
+  date: '28 May 2019 at 10:45am',
+  text: 'Your application is being reviewed by one of our case workers.',
+  buttons: [{
+    text: 'Continue'
+  }],
+  links: [{
+    text: 'Details',
+    href: '#'
+  }, {
+    text: 'Something else',
+    href: '#'
+  }]
+}];
+
+var Default = function Default() {
+  return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_admin.Timeline, null, data && data.map(function (field, index) {
+    return /*#__PURE__*/_react["default"].createElement(_admin.TimelineItem, {
+      key: index
+    }, /*#__PURE__*/_react["default"].createElement(_admin.TimelineHeading, null, field.title), /*#__PURE__*/_react["default"].createElement(_admin.TimelineContent, null, /*#__PURE__*/_react["default"].createElement(_reactCore.Hint, null, field.date), field.text && /*#__PURE__*/_react["default"].createElement(_reactCore.Paragraph, null, field.text), field.detailsSummary && /*#__PURE__*/_react["default"].createElement(_Details["default"], null, /*#__PURE__*/_react["default"].createElement(_Details.DetailsSummary, null, field.detailsSummary), /*#__PURE__*/_react["default"].createElement(_Details.DetailsContent, null, field.detailsContent))), (field.links || field.buttons) && /*#__PURE__*/_react["default"].createElement(_admin.TimelineActions, null, field.buttons && field.buttons.map(function (button, index) {
+      return /*#__PURE__*/_react["default"].createElement(_reactCore.Button, {
+        key: index,
+        color: button.color || 'secondary'
+      }, button.text);
+    }), field.links && field.links.map(function (link, index) {
+      return /*#__PURE__*/_react["default"].createElement(_reactCore.Link, {
+        key: index,
+        href: link.href
+      }, link.text);
+    })));
+  })));
+};
+
+exports.Default = Default;
+var _default = Default;
+exports["default"] = _default;

package/admin/Timeline/index.d.ts

@@ -0,0 +1,7 @@
+export * from '@digigov/react-extensions/admin/Timeline';
+export * from '@digigov/react-extensions/admin/TimelineContent';
+export * from '@digigov/react-extensions/admin/TimelineHeading';
+export * from '@digigov/react-extensions/admin/TimelineItem';
+export * from '@digigov/react-extensions/admin/TimelineActions';
+import Timeline from '@digigov/react-extensions/admin/Timeline';
+export default Timeline;

package/admin/Timeline/index.js

@@ -0,0 +1,86 @@
+"use strict";
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {};
+exports["default"] = void 0;
+
+var _Timeline = _interopRequireWildcard(require("@digigov/react-extensions/admin/Timeline"));
+
+Object.keys(_Timeline).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _Timeline[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _Timeline[key];
+    }
+  });
+});
+
+var _TimelineContent = require("@digigov/react-extensions/admin/TimelineContent");
+
+Object.keys(_TimelineContent).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _TimelineContent[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _TimelineContent[key];
+    }
+  });
+});
+
+var _TimelineHeading = require("@digigov/react-extensions/admin/TimelineHeading");
+
+Object.keys(_TimelineHeading).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _TimelineHeading[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _TimelineHeading[key];
+    }
+  });
+});
+
+var _TimelineItem = require("@digigov/react-extensions/admin/TimelineItem");
+
+Object.keys(_TimelineItem).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _TimelineItem[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _TimelineItem[key];
+    }
+  });
+});
+
+var _TimelineActions = require("@digigov/react-extensions/admin/TimelineActions");
+
+Object.keys(_TimelineActions).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _TimelineActions[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _TimelineActions[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 = _Timeline["default"];
+exports["default"] = _default;

package/admin/index.d.ts

@@ -15,3 +15,5 @@ export * from '@digigov/ui/admin/ResultsHeading';
 export * from '@digigov/ui/admin/SearchSection';
 export * from '@digigov/ui/admin/FilterSection';
 export * from '@digigov/ui/admin/AutoComplete';
+export * from '@digigov/ui/admin/Timeline';
+export * from '@digigov/ui/admin/TaskList';

package/admin/index.js

@@ -223,4 +223,30 @@ Object.keys(_AutoComplete).forEach(function (key) {
       return _AutoComplete[key];
     }
   });
+});
+
+var _Timeline = require("@digigov/ui/admin/Timeline");
+
+Object.keys(_Timeline).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _Timeline[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _Timeline[key];
+    }
+  });
+});
+
+var _TaskList = require("@digigov/ui/admin/TaskList");
+
+Object.keys(_TaskList).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _TaskList[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _TaskList[key];
+    }
+  });
 });

package/es/admin/TaskList/TaskList.stories.js

@@ -0,0 +1,6 @@
+import TaskList from "@digigov/ui/admin/TaskList";
+export default {
+  title: 'Digigov UI/admin/TaskList',
+  component: TaskList
+};
+export * from './__stories__/Default';

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

@@ -0,0 +1,74 @@
+import React from 'react';
+import { Link } from '@digigov/react-core';
+import SummaryList, { SummaryListItem, SummaryListItemAction, SummaryListItemKey } from '@digigov/ui/core/SummaryList';
+import { TaskList, TaskListItem, TaskListItemHeading, TaskListItemContent, TaskListItemTag } from '@digigov/ui/admin';
+var fields = [{
+  title: 'Check before you start',
+  tasks: [{
+    text: 'Check eligibility',
+    status: 'Completed'
+  }, {
+    text: 'Read declaration',
+    status: 'Completed'
+  }]
+}, {
+  title: 'Prepare application',
+  tasks: [{
+    text: 'Company information',
+    status: 'Completed'
+  }, {
+    text: 'Your contact details',
+    status: 'In progress'
+  }, {
+    text: 'List convictions',
+    status: 'Not started'
+  }, {
+    text: 'Provide financial evidence',
+    status: 'Cannot start yet'
+  }, {
+    text: 'Give medical information',
+    status: 'Cannot start yet'
+  }]
+}, {
+  title: 'Apply',
+  tasks: [{
+    text: 'Submit and pay',
+    status: 'Cannot start yet'
+  }]
+}];
+export var Default = function Default() {
+  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(TaskList, null, fields && fields.map(function (field, index) {
+    return /*#__PURE__*/React.createElement(TaskListItem, {
+      key: index
+    }, /*#__PURE__*/React.createElement(TaskListItemHeading, {
+      size: "m"
+    }, "".concat(index + 1, ". ").concat(field.title)), /*#__PURE__*/React.createElement(TaskListItemContent, null, /*#__PURE__*/React.createElement(SummaryList, null, field.tasks.map(function (task, key) {
+      var tagColor;
+
+      switch (task.status) {
+        case 'Completed':
+          tagColor = 'completed';
+          break;
+
+        case 'In progress':
+          tagColor = 'in-progress';
+          break;
+
+        case 'Not started':
+          tagColor = 'not-started';
+          break;
+
+        case 'Cannot start yet':
+          tagColor = 'not-started';
+          break;
+      }
+
+      return /*#__PURE__*/React.createElement(SummaryListItem, {
+        key: key
+      }, /*#__PURE__*/React.createElement(SummaryListItemKey, null, /*#__PURE__*/React.createElement(Link, null, task.text)), /*#__PURE__*/React.createElement(SummaryListItemAction, null, /*#__PURE__*/React.createElement(TaskListItemTag, {
+        status: tagColor
+      }, task.status)));
+    }))));
+  })));
+};
+export default Default;

package/es/admin/TaskList/index.js

@@ -0,0 +1,7 @@
+export * from '@digigov/react-extensions/admin/TaskList';
+export * from '@digigov/react-extensions/admin/TaskListItem';
+export * from '@digigov/react-extensions/admin/TaskListItemContent';
+export * from '@digigov/react-extensions/admin/TaskListItemHeading';
+export * from '@digigov/react-extensions/admin/TaskListItemTag';
+import TaskList from '@digigov/react-extensions/admin/TaskList';
+export default TaskList;

package/es/admin/Timeline/Timeline.stories.js

@@ -0,0 +1,6 @@
+import Timeline from "@digigov/ui/admin/Timeline";
+export default {
+  title: 'Digigov UI/admin/Timeline',
+  component: Timeline
+};
+export * from './__stories__/Default';

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

@@ -0,0 +1,64 @@
+import React from 'react';
+import { Button, Hint, Link, Paragraph } from '@digigov/react-core';
+import { Timeline, TimelineItem, TimelineHeading, TimelineContent, TimelineActions } from '@digigov/ui/admin';
+import Details, { DetailsSummary, DetailsContent } from '@digigov/ui/core/Details';
+var data = [{
+  title: 'Application requires confirmation',
+  date: '14 June 2019 at 2:01pm',
+  text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras non felis risus. Curabitur nec ante vitae felis ullamcorper tincidunt.',
+  links: [{
+    text: 'See application',
+    href: '#'
+  }]
+}, {
+  title: 'Application review in progress ',
+  date: '7 June 2019 at 12:32pm',
+  text: 'Your application is being reviewed by one of our case workers.',
+  buttons: [{
+    text: 'Continue'
+  }, {
+    text: 'Cancel',
+    color: 'warning'
+  }]
+}, {
+  title: 'Application received ',
+  date: '6 June 2019 at 9:12am ',
+  text: 'Your application has been received – reference MOJ-1234-5678'
+}, {
+  title: 'Application details ',
+  date: '6 June 2019 at 9:12am ',
+  detailsSummary: 'More info regarding your application',
+  detailsContent: 'Your application has been received – reference MOJ-1234-5678'
+}, {
+  title: 'Application submitted',
+  date: '28 May 2019 at 10:45am',
+  text: 'Your application is being reviewed by one of our case workers.',
+  buttons: [{
+    text: 'Continue'
+  }],
+  links: [{
+    text: 'Details',
+    href: '#'
+  }, {
+    text: 'Something else',
+    href: '#'
+  }]
+}];
+export var Default = function Default() {
+  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Timeline, null, data && data.map(function (field, index) {
+    return /*#__PURE__*/React.createElement(TimelineItem, {
+      key: index
+    }, /*#__PURE__*/React.createElement(TimelineHeading, null, field.title), /*#__PURE__*/React.createElement(TimelineContent, null, /*#__PURE__*/React.createElement(Hint, null, field.date), field.text && /*#__PURE__*/React.createElement(Paragraph, null, field.text), field.detailsSummary && /*#__PURE__*/React.createElement(Details, null, /*#__PURE__*/React.createElement(DetailsSummary, null, field.detailsSummary), /*#__PURE__*/React.createElement(DetailsContent, null, field.detailsContent))), (field.links || field.buttons) && /*#__PURE__*/React.createElement(TimelineActions, null, field.buttons && field.buttons.map(function (button, index) {
+      return /*#__PURE__*/React.createElement(Button, {
+        key: index,
+        color: button.color || 'secondary'
+      }, button.text);
+    }), field.links && field.links.map(function (link, index) {
+      return /*#__PURE__*/React.createElement(Link, {
+        key: index,
+        href: link.href
+      }, link.text);
+    })));
+  })));
+};
+export default Default;

package/es/admin/Timeline/index.js

@@ -0,0 +1,7 @@
+export * from '@digigov/react-extensions/admin/Timeline';
+export * from '@digigov/react-extensions/admin/TimelineContent';
+export * from '@digigov/react-extensions/admin/TimelineHeading';
+export * from '@digigov/react-extensions/admin/TimelineItem';
+export * from '@digigov/react-extensions/admin/TimelineActions';
+import Timeline from '@digigov/react-extensions/admin/Timeline';
+export default Timeline;

package/es/admin/index.js

@@ -14,4 +14,6 @@ export * from '@digigov/ui/admin/AdminLayout';
 export * from '@digigov/ui/admin/ResultsHeading';
 export * from '@digigov/ui/admin/SearchSection';
 export * from '@digigov/ui/admin/FilterSection';
-export * from '@digigov/ui/admin/AutoComplete';
+export * from '@digigov/ui/admin/AutoComplete';
+export * from '@digigov/ui/admin/Timeline';
+export * from '@digigov/ui/admin/TaskList';

package/esm/admin/TaskList/TaskList.stories.js

@@ -0,0 +1,6 @@
+import TaskList from "@digigov/ui/admin/TaskList";
+export default {
+  title: 'Digigov UI/admin/TaskList',
+  component: TaskList
+};
+export * from './__stories__/Default';

package/esm/admin/TaskList/__stories__/Default.js

@@ -0,0 +1,74 @@
+import React from 'react';
+import { Link } from '@digigov/react-core';
+import SummaryList, { SummaryListItem, SummaryListItemAction, SummaryListItemKey } from '@digigov/ui/core/SummaryList';
+import { TaskList, TaskListItem, TaskListItemHeading, TaskListItemContent, TaskListItemTag } from '@digigov/ui/admin';
+var fields = [{
+  title: 'Check before you start',
+  tasks: [{
+    text: 'Check eligibility',
+    status: 'Completed'
+  }, {
+    text: 'Read declaration',
+    status: 'Completed'
+  }]
+}, {
+  title: 'Prepare application',
+  tasks: [{
+    text: 'Company information',
+    status: 'Completed'
+  }, {
+    text: 'Your contact details',
+    status: 'In progress'
+  }, {
+    text: 'List convictions',
+    status: 'Not started'
+  }, {
+    text: 'Provide financial evidence',
+    status: 'Cannot start yet'
+  }, {
+    text: 'Give medical information',
+    status: 'Cannot start yet'
+  }]
+}, {
+  title: 'Apply',
+  tasks: [{
+    text: 'Submit and pay',
+    status: 'Cannot start yet'
+  }]
+}];
+export var Default = function Default() {
+  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(TaskList, null, fields && fields.map(function (field, index) {
+    return /*#__PURE__*/React.createElement(TaskListItem, {
+      key: index
+    }, /*#__PURE__*/React.createElement(TaskListItemHeading, {
+      size: "m"
+    }, "".concat(index + 1, ". ").concat(field.title)), /*#__PURE__*/React.createElement(TaskListItemContent, null, /*#__PURE__*/React.createElement(SummaryList, null, field.tasks.map(function (task, key) {
+      var tagColor;
+
+      switch (task.status) {
+        case 'Completed':
+          tagColor = 'completed';
+          break;
+
+        case 'In progress':
+          tagColor = 'in-progress';
+          break;
+
+        case 'Not started':
+          tagColor = 'not-started';
+          break;
+
+        case 'Cannot start yet':
+          tagColor = 'not-started';
+          break;
+      }
+
+      return /*#__PURE__*/React.createElement(SummaryListItem, {
+        key: key
+      }, /*#__PURE__*/React.createElement(SummaryListItemKey, null, /*#__PURE__*/React.createElement(Link, null, task.text)), /*#__PURE__*/React.createElement(SummaryListItemAction, null, /*#__PURE__*/React.createElement(TaskListItemTag, {
+        status: tagColor
+      }, task.status)));
+    }))));
+  })));
+};
+export default Default;

package/esm/admin/TaskList/index.js

@@ -0,0 +1,7 @@
+export * from '@digigov/react-extensions/admin/TaskList';
+export * from '@digigov/react-extensions/admin/TaskListItem';
+export * from '@digigov/react-extensions/admin/TaskListItemContent';
+export * from '@digigov/react-extensions/admin/TaskListItemHeading';
+export * from '@digigov/react-extensions/admin/TaskListItemTag';
+import TaskList from '@digigov/react-extensions/admin/TaskList';
+export default TaskList;

package/esm/admin/Timeline/Timeline.stories.js

@@ -0,0 +1,6 @@
+import Timeline from "@digigov/ui/admin/Timeline";
+export default {
+  title: 'Digigov UI/admin/Timeline',
+  component: Timeline
+};
+export * from './__stories__/Default';

package/esm/admin/Timeline/__stories__/Default.js

@@ -0,0 +1,64 @@
+import React from 'react';
+import { Button, Hint, Link, Paragraph } from '@digigov/react-core';
+import { Timeline, TimelineItem, TimelineHeading, TimelineContent, TimelineActions } from '@digigov/ui/admin';
+import Details, { DetailsSummary, DetailsContent } from '@digigov/ui/core/Details';
+var data = [{
+  title: 'Application requires confirmation',
+  date: '14 June 2019 at 2:01pm',
+  text: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras non felis risus. Curabitur nec ante vitae felis ullamcorper tincidunt.',
+  links: [{
+    text: 'See application',
+    href: '#'
+  }]
+}, {
+  title: 'Application review in progress ',
+  date: '7 June 2019 at 12:32pm',
+  text: 'Your application is being reviewed by one of our case workers.',
+  buttons: [{
+    text: 'Continue'
+  }, {
+    text: 'Cancel',
+    color: 'warning'
+  }]
+}, {
+  title: 'Application received ',
+  date: '6 June 2019 at 9:12am ',
+  text: 'Your application has been received – reference MOJ-1234-5678'
+}, {
+  title: 'Application details ',
+  date: '6 June 2019 at 9:12am ',
+  detailsSummary: 'More info regarding your application',
+  detailsContent: 'Your application has been received – reference MOJ-1234-5678'
+}, {
+  title: 'Application submitted',
+  date: '28 May 2019 at 10:45am',
+  text: 'Your application is being reviewed by one of our case workers.',
+  buttons: [{
+    text: 'Continue'
+  }],
+  links: [{
+    text: 'Details',
+    href: '#'
+  }, {
+    text: 'Something else',
+    href: '#'
+  }]
+}];
+export var Default = function Default() {
+  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Timeline, null, data && data.map(function (field, index) {
+    return /*#__PURE__*/React.createElement(TimelineItem, {
+      key: index
+    }, /*#__PURE__*/React.createElement(TimelineHeading, null, field.title), /*#__PURE__*/React.createElement(TimelineContent, null, /*#__PURE__*/React.createElement(Hint, null, field.date), field.text && /*#__PURE__*/React.createElement(Paragraph, null, field.text), field.detailsSummary && /*#__PURE__*/React.createElement(Details, null, /*#__PURE__*/React.createElement(DetailsSummary, null, field.detailsSummary), /*#__PURE__*/React.createElement(DetailsContent, null, field.detailsContent))), (field.links || field.buttons) && /*#__PURE__*/React.createElement(TimelineActions, null, field.buttons && field.buttons.map(function (button, index) {
+      return /*#__PURE__*/React.createElement(Button, {
+        key: index,
+        color: button.color || 'secondary'
+      }, button.text);
+    }), field.links && field.links.map(function (link, index) {
+      return /*#__PURE__*/React.createElement(Link, {
+        key: index,
+        href: link.href
+      }, link.text);
+    })));
+  })));
+};
+export default Default;

package/esm/admin/Timeline/index.js

@@ -0,0 +1,7 @@
+export * from '@digigov/react-extensions/admin/Timeline';
+export * from '@digigov/react-extensions/admin/TimelineContent';
+export * from '@digigov/react-extensions/admin/TimelineHeading';
+export * from '@digigov/react-extensions/admin/TimelineItem';
+export * from '@digigov/react-extensions/admin/TimelineActions';
+import Timeline from '@digigov/react-extensions/admin/Timeline';
+export default Timeline;

package/esm/admin/index.js

@@ -14,4 +14,6 @@ export * from '@digigov/ui/admin/AdminLayout';
 export * from '@digigov/ui/admin/ResultsHeading';
 export * from '@digigov/ui/admin/SearchSection';
 export * from '@digigov/ui/admin/FilterSection';
-export * from '@digigov/ui/admin/AutoComplete';
+export * from '@digigov/ui/admin/AutoComplete';
+export * from '@digigov/ui/admin/Timeline';
+export * from '@digigov/ui/admin/TaskList';

package/esm/index.js

@@ -1,4 +1,4 @@
-/** @license Digigov v0.23.0
+/** @license Digigov v0.24.0
  *
  * This source code is licensed under the BSD-2-Clause license found in the
  * LICENSE file in the root directory of this source tree.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@digigov/ui",
-  "version": "0.23.0",
+  "version": "0.24.0",
   "description": "@digigov reusable components toolkit",
   "module": "./esm/index.js",
   "publishConfig": {
@@ -19,7 +19,7 @@
     "react": "16.14.0",
     "react-dom": "16.14.0",
     "@digigov/react-core": "0.15.3",
-    "@digigov/react-extensions": "0.16.0"
+    "@digigov/react-extensions": "0.17.0"
   },
   "gitHead": "c903a46306f77f55ad7fc4d2e274006f39a6c871",
   "private": false,