@digigov/ui 2.0.0-e7d30530 → 2.0.0-eaf330f5

package/content/Table/__stories__/WithSortFilters/index.js

@@ -0,0 +1,121 @@
+import React from "react";
+import {
+  TableContainer,
+  Table,
+  TableCaption,
+  TableHead,
+  TableRow,
+  TableBody,
+  TableHeadCell,
+  TableDataCell,
+  TableNoDataRow,
+  TableSortLabel
+} from "@digigov/ui/content/Table";
+import { useSort } from "@digigov/ui/content/Table/hooks/useSort";
+const headerConfig = [
+  {
+    name: "product",
+    label: "\u03A0\u03C1\u03BF\u03CA\u03CC\u03BD",
+    sortLabels: {
+      asc: "\u0391\u03BB\u03C6\u03B1\u03B2\u03B7\u03C4\u03B9\u03BA\u03AE \u03C3\u03B5\u03B9\u03C1\u03AC (\u0391 -> \u03A9)",
+      desc: "\u0391\u03BB\u03C6\u03B1\u03B2\u03B7\u03C4\u03B9\u03BA\u03AE \u03C3\u03B5\u03B9\u03C1\u03AC (\u03A9 -> \u0391)"
+    }
+  },
+  {
+    name: "price",
+    label: "\u03A4\u03B9\u03BC\u03AE",
+    sortLabels: {
+      asc: "\u0391\u03CD\u03BE\u03BF\u03C5\u03C3\u03B1 \u03C3\u03B5\u03B9\u03C1\u03AC",
+      desc: "\u03A6\u03B8\u03AF\u03BD\u03BF\u03C5\u03C3\u03B1 \u03C3\u03B5\u03B9\u03C1\u03AC"
+    }
+  },
+  {
+    name: "stock",
+    label: "\u03A3\u03C4\u03BF\u03BA",
+    sortLabels: {
+      asc: "\u0391\u03CD\u03BE\u03BF\u03C5\u03C3\u03B1 \u03C3\u03B5\u03B9\u03C1\u03AC",
+      desc: "\u03A6\u03B8\u03AF\u03BD\u03BF\u03C5\u03C3\u03B1 \u03C3\u03B5\u03B9\u03C1\u03AC"
+    }
+  },
+  {
+    name: "date",
+    label: "\u0397\u03BC\u03B5\u03C1\u03BF\u03BC\u03B7\u03BD\u03AF\u03B1",
+    sortLabels: {
+      asc: "\u0391\u03CD\u03BE\u03BF\u03C5\u03C3\u03B1 \u03C3\u03B5\u03B9\u03C1\u03AC",
+      desc: "\u03A6\u03B8\u03AF\u03BD\u03BF\u03C5\u03C3\u03B1 \u03C3\u03B5\u03B9\u03C1\u03AC"
+    }
+  }
+];
+const data = [
+  {
+    id: 1,
+    product: "\u03A4\u03C5\u03C1\u03AF",
+    price: "4.9\u20AC",
+    stock: 20,
+    date: "2013-04-01"
+  },
+  {
+    id: 2,
+    product: "\u0393\u03AC\u03BB\u03B1",
+    price: "1.9\u20AC",
+    stock: 32,
+    date: "2013-01-01"
+  },
+  {
+    id: 3,
+    product: "\u0393\u03B9\u03B1\u03BF\u03CD\u03C1\u03C4\u03B9",
+    price: "2.4\u20AC",
+    stock: 12,
+    date: "2002-04-12"
+  },
+  {
+    id: 4,
+    product: "\u039A\u03C1\u03AD\u03BC\u03B1",
+    price: "3.9\u20AC",
+    stock: 8,
+    date: "2011-12-12"
+  },
+  {
+    id: 5,
+    product: "\u0392\u03BF\u03CD\u03C4\u03C5\u03C1\u03BF",
+    price: "0.9\u20AC",
+    stock: 99,
+    date: "2019-06-01"
+  },
+  {
+    id: 6,
+    product: "\u039A\u03B1\u03C6\u03AD\u03C2",
+    price: "2.9\u20AC",
+    stock: 86,
+    date: "2023-02-11"
+  },
+  {
+    id: 7,
+    product: "\u03A8\u03C9\u03BC\u03AF",
+    price: "99\u20AC",
+    stock: 12,
+    date: "2000-12-12"
+  }
+];
+const WithSortFilters = () => {
+  const { sortedData, setSortedField, field, direction } = useSort(data);
+  return /* @__PURE__ */ React.createElement(TableContainer, null, /* @__PURE__ */ React.createElement(Table, null, /* @__PURE__ */ React.createElement(TableCaption, null, "\u03A0\u03AF\u03BD\u03B1\u03BA\u03B1\u03C2 \u03C0\u03C1\u03BF\u03CA\u03CC\u03BD\u03C4\u03C9\u03BD"), /* @__PURE__ */ React.createElement(TableHead, null, /* @__PURE__ */ React.createElement(TableRow, null, headerConfig.map((header, index) => {
+    return /* @__PURE__ */ React.createElement(TableHeadCell, { key: index }, /* @__PURE__ */ React.createElement(
+      TableSortLabel,
+      {
+        labels: header.sortLabels,
+        onSort: (dir) => setSortedField(header.name, dir),
+        direction: header.name === field ? direction : 0
+      },
+      header.label
+    ));
+  }))), /* @__PURE__ */ React.createElement(TableBody, null, sortedData.length > 0 ? sortedData.map((d, index) => {
+    return /* @__PURE__ */ React.createElement(TableRow, { key: index }, /* @__PURE__ */ React.createElement(TableDataCell, null, d.product), /* @__PURE__ */ React.createElement(TableDataCell, null, d.price), /* @__PURE__ */ React.createElement(TableDataCell, null, d.stock), /* @__PURE__ */ React.createElement(TableDataCell, null, new Date(d.date).toLocaleDateString("en-GB")));
+  }) : /* @__PURE__ */ React.createElement(TableNoDataRow, null, "\u0394\u03B5\u03BD \u03C5\u03C0\u03C1\u03C7\u03BF\u03C5\u03BD \u03B4\u03B5\u03B4\u03BF\u03BC\u03AD\u03BD\u03B1"))));
+};
+var WithSortFilters_default = WithSortFilters;
+export {
+  WithSortFilters,
+  WithSortFilters_default as default
+};
+//# sourceMappingURL=WithSortFilters.js.map

package/content/Table/__stories__/WithSortFilters/package.json

@@ -0,0 +1,6 @@
+{
+  "sideEffects": false,
+  "module": "./index.js",
+  "types": "./index.d.ts",
+  "main": "../../../../cjs/content/Table/__stories__/WithSortFilters/index.js"
+}

package/content/Table/__stories__/WithSortFilters.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
-export declare const WithSortFilters: (_: any) => React.JSX.Element;
+export declare const WithSortFilters: () => React.JSX.Element;
 export default WithSortFilters;

package/content/Table/__stories__/WithSortFilters.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/content/Table/__stories__/WithSortFilters.tsx"],
+  "sourcesContent": ["import React from 'react';\n\nimport {\n  TableContainer,\n  Table,\n  TableCaption,\n  TableHead,\n  TableRow,\n  TableBody,\n  TableHeadCell,\n  TableDataCell,\n  TableNoDataRow,\n  TableSortLabel,\n} from '@digigov/ui/content/Table';\nimport { useSort } from '@digigov/ui/content/Table/hooks/useSort';\n\nconst headerConfig = [\n  {\n    name: 'product',\n    label: '\u03A0\u03C1\u03BF\u03CA\u03CC\u03BD',\n    sortLabels: {\n      asc: '\u0391\u03BB\u03C6\u03B1\u03B2\u03B7\u03C4\u03B9\u03BA\u03AE \u03C3\u03B5\u03B9\u03C1\u03AC (\u0391 -> \u03A9)',\n      desc: '\u0391\u03BB\u03C6\u03B1\u03B2\u03B7\u03C4\u03B9\u03BA\u03AE \u03C3\u03B5\u03B9\u03C1\u03AC (\u03A9 -> \u0391)',\n    },\n  },\n  {\n    name: 'price',\n    label: '\u03A4\u03B9\u03BC\u03AE',\n    sortLabels: {\n      asc: '\u0391\u03CD\u03BE\u03BF\u03C5\u03C3\u03B1 \u03C3\u03B5\u03B9\u03C1\u03AC',\n      desc: '\u03A6\u03B8\u03AF\u03BD\u03BF\u03C5\u03C3\u03B1 \u03C3\u03B5\u03B9\u03C1\u03AC',\n    },\n  },\n  {\n    name: 'stock',\n    label: '\u03A3\u03C4\u03BF\u03BA',\n    sortLabels: {\n      asc: '\u0391\u03CD\u03BE\u03BF\u03C5\u03C3\u03B1 \u03C3\u03B5\u03B9\u03C1\u03AC',\n      desc: '\u03A6\u03B8\u03AF\u03BD\u03BF\u03C5\u03C3\u03B1 \u03C3\u03B5\u03B9\u03C1\u03AC',\n    },\n  },\n  {\n    name: 'date',\n    label: '\u0397\u03BC\u03B5\u03C1\u03BF\u03BC\u03B7\u03BD\u03AF\u03B1',\n    sortLabels: {\n      asc: '\u0391\u03CD\u03BE\u03BF\u03C5\u03C3\u03B1 \u03C3\u03B5\u03B9\u03C1\u03AC',\n      desc: '\u03A6\u03B8\u03AF\u03BD\u03BF\u03C5\u03C3\u03B1 \u03C3\u03B5\u03B9\u03C1\u03AC',\n    },\n  },\n];\n\nconst data = [\n  {\n    id: 1,\n    product: '\u03A4\u03C5\u03C1\u03AF',\n    price: '4.9\u20AC',\n    stock: 20,\n    date: '2013-04-01',\n  },\n  {\n    id: 2,\n    product: '\u0393\u03AC\u03BB\u03B1',\n    price: '1.9\u20AC',\n    stock: 32,\n    date: '2013-01-01',\n  },\n  {\n    id: 3,\n    product: '\u0393\u03B9\u03B1\u03BF\u03CD\u03C1\u03C4\u03B9',\n    price: '2.4\u20AC',\n    stock: 12,\n    date: '2002-04-12',\n  },\n  {\n    id: 4,\n    product: '\u039A\u03C1\u03AD\u03BC\u03B1',\n    price: '3.9\u20AC',\n    stock: 8,\n    date: '2011-12-12',\n  },\n  {\n    id: 5,\n    product: '\u0392\u03BF\u03CD\u03C4\u03C5\u03C1\u03BF',\n    price: '0.9\u20AC',\n    stock: 99,\n    date: '2019-06-01',\n  },\n  {\n    id: 6,\n    product: '\u039A\u03B1\u03C6\u03AD\u03C2',\n    price: '2.9\u20AC',\n    stock: 86,\n    date: '2023-02-11',\n  },\n  {\n    id: 7,\n    product: '\u03A8\u03C9\u03BC\u03AF',\n    price: '99\u20AC',\n    stock: 12,\n    date: '2000-12-12',\n  },\n];\n\nexport const WithSortFilters = () => {\n  const { sortedData, setSortedField, field, direction } = useSort(data);\n\n  return (\n    <TableContainer>\n      <Table>\n        <TableCaption>\u03A0\u03AF\u03BD\u03B1\u03BA\u03B1\u03C2 \u03C0\u03C1\u03BF\u03CA\u03CC\u03BD\u03C4\u03C9\u03BD</TableCaption>\n        <TableHead>\n          <TableRow>\n            {headerConfig.map((header, index) => {\n              return (\n                <TableHeadCell key={index}>\n                  <TableSortLabel\n                    labels={header.sortLabels}\n                    onSort={(dir) => setSortedField(header.name, dir)}\n                    direction={header.name === field ? direction : 0}\n                  >\n                    {header.label}\n                  </TableSortLabel>\n                </TableHeadCell>\n              );\n            })}\n          </TableRow>\n        </TableHead>\n        <TableBody>\n          {sortedData.length > 0 ? (\n            sortedData.map((d, index) => {\n              return (\n                <TableRow key={index}>\n                  <TableDataCell>{d.product}</TableDataCell>\n                  <TableDataCell>{d.price}</TableDataCell>\n                  <TableDataCell>{d.stock}</TableDataCell>\n                  <TableDataCell>\n                    {new Date(d.date).toLocaleDateString('en-GB')}\n                  </TableDataCell>\n                </TableRow>\n              );\n            })\n          ) : (\n            <TableNoDataRow>\u0394\u03B5\u03BD \u03C5\u03C0\u03C1\u03C7\u03BF\u03C5\u03BD \u03B4\u03B5\u03B4\u03BF\u03BC\u03AD\u03BD\u03B1</TableNoDataRow>\n          )}\n        </TableBody>\n      </Table>\n    </TableContainer>\n  );\n};\nexport default WithSortFilters;\n"],
+  "mappings": "AAAA,OAAO,WAAW;AAElB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,eAAe;AAExB,MAAM,eAAe;AAAA,EACnB;AAAA,IACE,MAAM;AAAA,IACN,OAAO;AAAA,IACP,YAAY;AAAA,MACV,KAAK;AAAA,MACL,MAAM;AAAA,IACR;AAAA,EACF;AAAA,EACA;AAAA,IACE,MAAM;AAAA,IACN,OAAO;AAAA,IACP,YAAY;AAAA,MACV,KAAK;AAAA,MACL,MAAM;AAAA,IACR;AAAA,EACF;AAAA,EACA;AAAA,IACE,MAAM;AAAA,IACN,OAAO;AAAA,IACP,YAAY;AAAA,MACV,KAAK;AAAA,MACL,MAAM;AAAA,IACR;AAAA,EACF;AAAA,EACA;AAAA,IACE,MAAM;AAAA,IACN,OAAO;AAAA,IACP,YAAY;AAAA,MACV,KAAK;AAAA,MACL,MAAM;AAAA,IACR;AAAA,EACF;AACF;AAEA,MAAM,OAAO;AAAA,EACX;AAAA,IACE,IAAI;AAAA,IACJ,SAAS;AAAA,IACT,OAAO;AAAA,IACP,OAAO;AAAA,IACP,MAAM;AAAA,EACR;AAAA,EACA;AAAA,IACE,IAAI;AAAA,IACJ,SAAS;AAAA,IACT,OAAO;AAAA,IACP,OAAO;AAAA,IACP,MAAM;AAAA,EACR;AAAA,EACA;AAAA,IACE,IAAI;AAAA,IACJ,SAAS;AAAA,IACT,OAAO;AAAA,IACP,OAAO;AAAA,IACP,MAAM;AAAA,EACR;AAAA,EACA;AAAA,IACE,IAAI;AAAA,IACJ,SAAS;AAAA,IACT,OAAO;AAAA,IACP,OAAO;AAAA,IACP,MAAM;AAAA,EACR;AAAA,EACA;AAAA,IACE,IAAI;AAAA,IACJ,SAAS;AAAA,IACT,OAAO;AAAA,IACP,OAAO;AAAA,IACP,MAAM;AAAA,EACR;AAAA,EACA;AAAA,IACE,IAAI;AAAA,IACJ,SAAS;AAAA,IACT,OAAO;AAAA,IACP,OAAO;AAAA,IACP,MAAM;AAAA,EACR;AAAA,EACA;AAAA,IACE,IAAI;AAAA,IACJ,SAAS;AAAA,IACT,OAAO;AAAA,IACP,OAAO;AAAA,IACP,MAAM;AAAA,EACR;AACF;AAEO,MAAM,kBAAkB,MAAM;AACnC,QAAM,EAAE,YAAY,gBAAgB,OAAO,UAAU,IAAI,QAAQ,IAAI;AAErE,SACE,oCAAC,sBACC,oCAAC,aACC,oCAAC,oBAAa,mGAAiB,GAC/B,oCAAC,iBACC,oCAAC,gBACE,aAAa,IAAI,CAAC,QAAQ,UAAU;AACnC,WACE,oCAAC,iBAAc,KAAK,SAClB;AAAA,MAAC;AAAA;AAAA,QACC,QAAQ,OAAO;AAAA,QACf,QAAQ,CAAC,QAAQ,eAAe,OAAO,MAAM,GAAG;AAAA,QAChD,WAAW,OAAO,SAAS,QAAQ,YAAY;AAAA;AAAA,MAE9C,OAAO;AAAA,IACV,CACF;AAAA,EAEJ,CAAC,CACH,CACF,GACA,oCAAC,iBACE,WAAW,SAAS,IACnB,WAAW,IAAI,CAAC,GAAG,UAAU;AAC3B,WACE,oCAAC,YAAS,KAAK,SACb,oCAAC,qBAAe,EAAE,OAAQ,GAC1B,oCAAC,qBAAe,EAAE,KAAM,GACxB,oCAAC,qBAAe,EAAE,KAAM,GACxB,oCAAC,qBACE,IAAI,KAAK,EAAE,IAAI,EAAE,mBAAmB,OAAO,CAC9C,CACF;AAAA,EAEJ,CAAC,IAED,oCAAC,sBAAe,gHAAoB,CAExC,CACF,CACF;AAEJ;AACA,IAAO,0BAAQ;",
+  "names": []
+}

package/content/Table/__stories__/ZebraProp/index.js

@@ -0,0 +1,50 @@
+import React from "react";
+import {
+  TableContainer,
+  Table,
+  TableCaption,
+  TableHead,
+  TableRow,
+  TableBody,
+  TableHeadCell,
+  TableDataCell
+} from "@digigov/ui/content/Table";
+const data = {
+  title: "\u03A7\u03C1\u03AE\u03C3\u03C4\u03B5\u03C2",
+  labels: {
+    name: "\u039F\u03BD\u03BF\u03BC\u03B1\u03C4\u03B5\u03C0\u03CE\u03BD\u03C5\u03BC\u03BF",
+    role: "\u03A1\u03CC\u03BB\u03BF\u03C2",
+    email: "Email"
+  },
+  content: [
+    {
+      name: "\u039C\u03AC\u03C1\u03B9\u03BF\u03C2 \u039C\u03B5\u03BD\u03B5\u03BE\u03AD\u03C2",
+      role: "\u03A7\u03B5\u03B9\u03C1\u03B9\u03C3\u03C4\u03AE\u03C2",
+      email: "marios@mail.com"
+    },
+    {
+      name: "\u039A\u03B1\u03BB\u03BB\u03B9\u03CC\u03C0\u03B7 \u03A0\u03B1\u03C0\u03B1\u03B4\u03BF\u03C0\u03BF\u03CD\u03BB\u03BF\u03C5",
+      role: "\u03A7\u03B5\u03B9\u03C1\u03B9\u03C3\u03C4\u03AE\u03C2",
+      email: "kalliopi@mail.com"
+    },
+    {
+      name: "\u039C\u03B1\u03C1\u03AF\u03B1 \u03A6\u03BB\u03BF\u03CD\u03C0\u03B7",
+      role: "\u0394\u03B9\u03B1\u03C7\u03B5\u03B9\u03C1\u03B9\u03C3\u03C4\u03AE\u03C2",
+      email: "maria@mail.com"
+    },
+    {
+      name: "\u0397\u03BB\u03AD\u03BA\u03C4\u03C1\u03B1 \u0391\u03C0\u03BF\u03C3\u03C4\u03CC\u03BB\u03BF\u03C5",
+      role: "\u0394\u03B9\u03B1\u03C7\u03B5\u03B9\u03C1\u03B9\u03C3\u03C4\u03AE\u03C2",
+      email: "ilektra@mail.com"
+    }
+  ]
+};
+const ZebraProp = () => {
+  return /* @__PURE__ */ React.createElement(TableContainer, null, /* @__PURE__ */ React.createElement(Table, { variant: "zebra" }, data && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(TableCaption, null, data.title), /* @__PURE__ */ React.createElement(TableHead, null, /* @__PURE__ */ React.createElement(TableRow, null, data.labels && Object.keys(data.labels).map((key) => /* @__PURE__ */ React.createElement(TableHeadCell, { key }, data.labels[key])))), /* @__PURE__ */ React.createElement(TableBody, null, data.content && data.content.map((item, index) => /* @__PURE__ */ React.createElement(TableRow, { key: index }, /* @__PURE__ */ React.createElement(TableDataCell, { "data-label": data.labels.name }, item.name), /* @__PURE__ */ React.createElement(TableDataCell, { "data-label": data.labels.role }, item.role), /* @__PURE__ */ React.createElement(TableDataCell, { "data-label": data.labels.email }, item.email)))))));
+};
+var ZebraProp_default = ZebraProp;
+export {
+  ZebraProp,
+  ZebraProp_default as default
+};
+//# sourceMappingURL=ZebraProp.js.map

package/content/Table/__stories__/ZebraProp/package.json

@@ -0,0 +1,6 @@
+{
+  "sideEffects": false,
+  "module": "./index.js",
+  "types": "./index.d.ts",
+  "main": "../../../../cjs/content/Table/__stories__/ZebraProp/index.js"
+}

package/content/Table/__stories__/ZebraProp.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
-export declare const ZebraProp: (_: any) => React.JSX.Element;
+export declare const ZebraProp: () => React.JSX.Element;
 export default ZebraProp;

package/content/Table/__stories__/ZebraProp.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/content/Table/__stories__/ZebraProp.tsx"],
+  "sourcesContent": ["import React from 'react';\nimport {\n  TableContainer,\n  Table,\n  TableCaption,\n  TableHead,\n  TableRow,\n  TableBody,\n  TableHeadCell,\n  TableDataCell,\n} from '@digigov/ui/content/Table';\n\nconst data = {\n  title: '\u03A7\u03C1\u03AE\u03C3\u03C4\u03B5\u03C2',\n  labels: {\n    name: '\u039F\u03BD\u03BF\u03BC\u03B1\u03C4\u03B5\u03C0\u03CE\u03BD\u03C5\u03BC\u03BF',\n    role: '\u03A1\u03CC\u03BB\u03BF\u03C2',\n    email: 'Email',\n  },\n  content: [\n    {\n      name: '\u039C\u03AC\u03C1\u03B9\u03BF\u03C2 \u039C\u03B5\u03BD\u03B5\u03BE\u03AD\u03C2',\n      role: '\u03A7\u03B5\u03B9\u03C1\u03B9\u03C3\u03C4\u03AE\u03C2',\n      email: 'marios@mail.com',\n    },\n    {\n      name: '\u039A\u03B1\u03BB\u03BB\u03B9\u03CC\u03C0\u03B7 \u03A0\u03B1\u03C0\u03B1\u03B4\u03BF\u03C0\u03BF\u03CD\u03BB\u03BF\u03C5',\n      role: '\u03A7\u03B5\u03B9\u03C1\u03B9\u03C3\u03C4\u03AE\u03C2',\n      email: 'kalliopi@mail.com',\n    },\n    {\n      name: '\u039C\u03B1\u03C1\u03AF\u03B1 \u03A6\u03BB\u03BF\u03CD\u03C0\u03B7',\n      role: '\u0394\u03B9\u03B1\u03C7\u03B5\u03B9\u03C1\u03B9\u03C3\u03C4\u03AE\u03C2',\n      email: 'maria@mail.com',\n    },\n    {\n      name: '\u0397\u03BB\u03AD\u03BA\u03C4\u03C1\u03B1 \u0391\u03C0\u03BF\u03C3\u03C4\u03CC\u03BB\u03BF\u03C5',\n      role: '\u0394\u03B9\u03B1\u03C7\u03B5\u03B9\u03C1\u03B9\u03C3\u03C4\u03AE\u03C2',\n      email: 'ilektra@mail.com',\n    },\n  ],\n};\n\nexport const ZebraProp = () => {\n  return (\n    <TableContainer>\n      <Table variant=\"zebra\">\n        {data && (\n          <>\n            <TableCaption>{data.title}</TableCaption>\n            <TableHead>\n              <TableRow>\n                {data.labels &&\n                  Object.keys(data.labels).map((key) => (\n                    <TableHeadCell key={key}>{data.labels[key]}</TableHeadCell>\n                  ))}\n              </TableRow>\n            </TableHead>\n            <TableBody>\n              {data.content &&\n                data.content.map((item, index) => (\n                  <TableRow key={index}>\n                    <TableDataCell data-label={data.labels.name}>\n                      {item.name}\n                    </TableDataCell>\n                    <TableDataCell data-label={data.labels.role}>\n                      {item.role}\n                    </TableDataCell>\n                    <TableDataCell data-label={data.labels.email}>\n                      {item.email}\n                    </TableDataCell>\n                  </TableRow>\n                ))}\n            </TableBody>\n          </>\n        )}\n      </Table>\n    </TableContainer>\n  );\n};\nexport default ZebraProp;\n"],
+  "mappings": "AAAA,OAAO,WAAW;AAClB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,MAAM,OAAO;AAAA,EACX,OAAO;AAAA,EACP,QAAQ;AAAA,IACN,MAAM;AAAA,IACN,MAAM;AAAA,IACN,OAAO;AAAA,EACT;AAAA,EACA,SAAS;AAAA,IACP;AAAA,MACE,MAAM;AAAA,MACN,MAAM;AAAA,MACN,OAAO;AAAA,IACT;AAAA,IACA;AAAA,MACE,MAAM;AAAA,MACN,MAAM;AAAA,MACN,OAAO;AAAA,IACT;AAAA,IACA;AAAA,MACE,MAAM;AAAA,MACN,MAAM;AAAA,MACN,OAAO;AAAA,IACT;AAAA,IACA;AAAA,MACE,MAAM;AAAA,MACN,MAAM;AAAA,MACN,OAAO;AAAA,IACT;AAAA,EACF;AACF;AAEO,MAAM,YAAY,MAAM;AAC7B,SACE,oCAAC,sBACC,oCAAC,SAAM,SAAQ,WACZ,QACC,0DACE,oCAAC,oBAAc,KAAK,KAAM,GAC1B,oCAAC,iBACC,oCAAC,gBACE,KAAK,UACJ,OAAO,KAAK,KAAK,MAAM,EAAE,IAAI,CAAC,QAC5B,oCAAC,iBAAc,OAAW,KAAK,OAAO,GAAG,CAAE,CAC5C,CACL,CACF,GACA,oCAAC,iBACE,KAAK,WACJ,KAAK,QAAQ,IAAI,CAAC,MAAM,UACtB,oCAAC,YAAS,KAAK,SACb,oCAAC,iBAAc,cAAY,KAAK,OAAO,QACpC,KAAK,IACR,GACA,oCAAC,iBAAc,cAAY,KAAK,OAAO,QACpC,KAAK,IACR,GACA,oCAAC,iBAAc,cAAY,KAAK,OAAO,SACpC,KAAK,KACR,CACF,CACD,CACL,CACF,CAEJ,CACF;AAEJ;AACA,IAAO,oBAAQ;",
+  "names": []
+}

package/content/TaskList/TaskList.stories/index.js

@@ -0,0 +1,15 @@
+import TaskList from "@digigov/ui/content/TaskList";
+var TaskList_stories_default = {
+  title: "Digigov UI/content/TaskList",
+  description: "Only use a task list page for longer transactions involving multiple tasks that users may need to complete over a number of sessions.",
+  component: TaskList,
+  displayName: "TaskList"
+};
+import { Default } from "@digigov/ui/content/TaskList/__stories__/Default";
+import { Dense } from "@digigov/ui/content/TaskList/__stories__/Dense";
+export {
+  Default,
+  Dense,
+  TaskList_stories_default as default
+};
+//# sourceMappingURL=TaskList.stories.js.map

package/content/TaskList/TaskList.stories/package.json

@@ -0,0 +1,6 @@
+{
+  "sideEffects": false,
+  "module": "./index.js",
+  "types": "./index.d.ts",
+  "main": "../../../cjs/content/TaskList/TaskList.stories/index.js"
+}

package/content/TaskList/TaskList.stories.d.ts

@@ -2,8 +2,6 @@ declare namespace _default {
     export let title: string;
     export let description: string;
     export { TaskList as component };
-    export let tags: string[];
-    export { doc as markdown };
     export let displayName: string;
 }
 export default _default;

package/content/TaskList/TaskList.stories.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/content/TaskList/TaskList.stories.js"],
+  "sourcesContent": ["import TaskList from '@digigov/ui/content/TaskList';\nexport default {\n  title: 'Digigov UI/content/TaskList',\n  description:\n    'Only use a task list page for longer transactions involving multiple tasks that users may need to complete over a number of sessions.',\n  component: TaskList,\n  displayName: 'TaskList',\n};\nexport { Default } from '@digigov/ui/content/TaskList/__stories__/Default';\nexport { Dense } from '@digigov/ui/content/TaskList/__stories__/Dense';\n"],
+  "mappings": "AAAA,OAAO,cAAc;AACrB,IAAO,2BAAQ;AAAA,EACb,OAAO;AAAA,EACP,aACE;AAAA,EACF,WAAW;AAAA,EACX,aAAa;AACf;AACA,SAAS,eAAe;AACxB,SAAS,aAAa;",
+  "names": []
+}

package/content/TaskList/__stories__/Default/index.js

@@ -0,0 +1,90 @@
+import React from "react";
+import {
+  SummaryList,
+  SummaryListItem,
+  SummaryListItemAction,
+  SummaryListItemKey
+} from "@digigov/ui/content/SummaryList";
+import {
+  TaskList,
+  TaskListItem,
+  TaskListItemHeading,
+  TaskListItemContent,
+  TaskListItemTag
+} from "@digigov/ui/content/TaskList";
+import { LinkBase } from "@digigov/ui/navigation/Link";
+const fields = [
+  {
+    title: "\u0388\u03BB\u03B5\u03B3\u03C7\u03BF\u03B9 \u03C0\u03C1\u03B9\u03BD \u03BE\u03B5\u03BA\u03B9\u03BD\u03AE\u03C3\u03B5\u03C4\u03B5",
+    tasks: [
+      {
+        text: "\u0395\u03BB\u03AD\u03B3\u03BE\u03C4\u03B5 \u03C4\u03B7\u03BD \u03BA\u03B1\u03C4\u03B1\u03BB\u03BB\u03B7\u03BB\u03CC\u03C4\u03B7\u03C4\u03B1",
+        status: "\u039F\u03BB\u03BF\u03BA\u03BB\u03B7\u03C1\u03C9\u03B8\u03B7\u03BA\u03B5"
+      },
+      {
+        text: "\u0395\u03BC\u03C6\u03AC\u03BD\u03B9\u03C3\u03B7 \u03B4\u03AE\u03BB\u03C9\u03C3\u03B7\u03C2",
+        status: "\u039F\u03BB\u03BF\u03BA\u03BB\u03B7\u03C1\u03C9\u03B8\u03B7\u03BA\u03B5"
+      }
+    ]
+  },
+  {
+    title: "\u03A0\u03C1\u03BF\u03B5\u03C4\u03BF\u03B9\u03BC\u03B1\u03C3\u03AF\u03B1 \u03B1\u03AF\u03C4\u03B7\u03C3\u03B7\u03C2",
+    tasks: [
+      {
+        text: "\u03A3\u03C4\u03BF\u03B9\u03C7\u03B5\u03AF\u03B1 \u03B5\u03C4\u03B1\u03B9\u03C1\u03B5\u03AF\u03B1\u03C2",
+        status: "\u039F\u03BB\u03BF\u03BA\u03BB\u03B7\u03C1\u03C9\u03B8\u03B7\u03BA\u03B5"
+      },
+      {
+        text: "\u03A3\u03C4\u03BF\u03B9\u03C7\u03B5\u03AF\u03B1 \u03B5\u03C0\u03B9\u03BA\u03BF\u03B9\u03BD\u03C9\u03BD\u03AF\u03B1\u03C2",
+        status: "\u03A3\u03B5 \u03B5\u03BE\u03B5\u03BB\u03B9\u03BE\u03B7"
+      },
+      {
+        text: "\u039B\u03AF\u03C3\u03C4\u03B1 \u03B1\u03C0\u03BF\u03B4\u03B5\u03AF\u03BE\u03B5\u03C9\u03BD",
+        status: "\u0394\u03B5\u03BD \u03B5\u03C7\u03B5\u03B9 \u03BE\u03B5\u03BA\u03B9\u03BD\u03B7\u03C3\u03B5\u03B9"
+      },
+      {
+        text: "\u03A0\u03B1\u03C1\u03BF\u03C7\u03AE \u03BF\u03B9\u03BA\u03BF\u03BD\u03BF\u03BC\u03B9\u03BA\u03CE\u03BD \u03C3\u03C4\u03BF\u03B9\u03C7\u03B5\u03AF\u03C9\u03BD",
+        status: "\u03A3\u03B5 \u03B1\u03BD\u03B1\u03BC\u03BF\u03BD\u03B7"
+      },
+      {
+        text: "\u03A0\u03B1\u03C1\u03BF\u03C7\u03AE \u03B9\u03B1\u03C4\u03C1\u03B9\u03BA\u03CE\u03BD \u03C0\u03BB\u03B7\u03C1\u03BF\u03C6\u03BF\u03C1\u03B9\u03CE\u03BD",
+        status: "\u03A3\u03B5 \u03B1\u03BD\u03B1\u03BC\u03BF\u03BD\u03B7"
+      }
+    ]
+  },
+  {
+    title: "\u0391\u03AF\u03C4\u03B7\u03C3\u03B7",
+    tasks: [
+      {
+        text: "\u03A5\u03C0\u03BF\u03B2\u03BF\u03BB\u03AE \u03BA\u03B1\u03B9 \u03C0\u03BB\u03B7\u03C1\u03C9\u03BC\u03AE",
+        status: "\u03A3\u03B5 \u03B1\u03BD\u03B1\u03BC\u03BF\u03BD\u03B7"
+      }
+    ]
+  }
+];
+const Default = () => /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(TaskList, null, fields && fields.map((field, index) => {
+  return /* @__PURE__ */ React.createElement(TaskListItem, { key: index }, /* @__PURE__ */ React.createElement(TaskListItemHeading, { size: "md" }, `${index + 1}. ${field.title}`), /* @__PURE__ */ React.createElement(TaskListItemContent, null, /* @__PURE__ */ React.createElement(SummaryList, null, field.tasks.map((task, key) => {
+    let tagColor;
+    switch (task.status) {
+      case "\u039F\u03BB\u03BF\u03BA\u03BB\u03B7\u03C1\u03C9\u03B8\u03B7\u03BA\u03B5":
+        tagColor = "info";
+        break;
+      case "\u03A3\u03B5 \u03B5\u03BE\u03B5\u03BB\u03B9\u03BE\u03B7":
+        tagColor = "primary";
+        break;
+      case "\u0394\u03B5\u03BD \u03B5\u03C7\u03B5\u03B9 \u03BE\u03B5\u03BA\u03B9\u03BD\u03B7\u03C3\u03B5\u03B9":
+        tagColor = "secondary";
+        break;
+      case "\u03A3\u03B5 \u03B1\u03BD\u03B1\u03BC\u03BF\u03BD\u03B7":
+        tagColor = "secondary";
+        break;
+    }
+    return /* @__PURE__ */ React.createElement(SummaryListItem, { key }, /* @__PURE__ */ React.createElement(SummaryListItemKey, null, /* @__PURE__ */ React.createElement(LinkBase, null, task.text)), /* @__PURE__ */ React.createElement(SummaryListItemAction, null, /* @__PURE__ */ React.createElement(TaskListItemTag, { color: tagColor }, task.status)));
+  }))));
+})));
+var Default_default = Default;
+export {
+  Default,
+  Default_default as default
+};
+//# sourceMappingURL=Default.js.map

package/content/TaskList/__stories__/Default/package.json

@@ -0,0 +1,6 @@
+{
+  "sideEffects": false,
+  "module": "./index.js",
+  "types": "./index.d.ts",
+  "main": "../../../../cjs/content/TaskList/__stories__/Default/index.js"
+}

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

@@ -1,3 +1,3 @@
 import React from 'react';
-export declare const Default: (_: any) => React.JSX.Element;
+export declare const Default: () => React.JSX.Element;
 export default Default;

package/content/TaskList/__stories__/Default.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/content/TaskList/__stories__/Default.tsx"],
+  "sourcesContent": ["import React from 'react';\n\nimport {\n  SummaryList,\n  SummaryListItem,\n  SummaryListItemAction,\n  SummaryListItemKey,\n} from '@digigov/ui/content/SummaryList';\n\nimport {\n  TaskList,\n  TaskListItem,\n  TaskListItemHeading,\n  TaskListItemContent,\n  TaskListItemTag,\n} from '@digigov/ui/content/TaskList';\nimport { LinkBase } from '@digigov/ui/navigation/Link';\n\nconst fields = [\n  {\n    title: '\u0388\u03BB\u03B5\u03B3\u03C7\u03BF\u03B9 \u03C0\u03C1\u03B9\u03BD \u03BE\u03B5\u03BA\u03B9\u03BD\u03AE\u03C3\u03B5\u03C4\u03B5',\n    tasks: [\n      {\n        text: '\u0395\u03BB\u03AD\u03B3\u03BE\u03C4\u03B5 \u03C4\u03B7\u03BD \u03BA\u03B1\u03C4\u03B1\u03BB\u03BB\u03B7\u03BB\u03CC\u03C4\u03B7\u03C4\u03B1',\n        status: '\u039F\u03BB\u03BF\u03BA\u03BB\u03B7\u03C1\u03C9\u03B8\u03B7\u03BA\u03B5',\n      },\n      {\n        text: '\u0395\u03BC\u03C6\u03AC\u03BD\u03B9\u03C3\u03B7 \u03B4\u03AE\u03BB\u03C9\u03C3\u03B7\u03C2',\n        status: '\u039F\u03BB\u03BF\u03BA\u03BB\u03B7\u03C1\u03C9\u03B8\u03B7\u03BA\u03B5',\n      },\n    ],\n  },\n  {\n    title: '\u03A0\u03C1\u03BF\u03B5\u03C4\u03BF\u03B9\u03BC\u03B1\u03C3\u03AF\u03B1 \u03B1\u03AF\u03C4\u03B7\u03C3\u03B7\u03C2',\n    tasks: [\n      {\n        text: '\u03A3\u03C4\u03BF\u03B9\u03C7\u03B5\u03AF\u03B1 \u03B5\u03C4\u03B1\u03B9\u03C1\u03B5\u03AF\u03B1\u03C2',\n        status: '\u039F\u03BB\u03BF\u03BA\u03BB\u03B7\u03C1\u03C9\u03B8\u03B7\u03BA\u03B5',\n      },\n      {\n        text: '\u03A3\u03C4\u03BF\u03B9\u03C7\u03B5\u03AF\u03B1 \u03B5\u03C0\u03B9\u03BA\u03BF\u03B9\u03BD\u03C9\u03BD\u03AF\u03B1\u03C2',\n        status: '\u03A3\u03B5 \u03B5\u03BE\u03B5\u03BB\u03B9\u03BE\u03B7',\n      },\n      {\n        text: '\u039B\u03AF\u03C3\u03C4\u03B1 \u03B1\u03C0\u03BF\u03B4\u03B5\u03AF\u03BE\u03B5\u03C9\u03BD',\n        status: '\u0394\u03B5\u03BD \u03B5\u03C7\u03B5\u03B9 \u03BE\u03B5\u03BA\u03B9\u03BD\u03B7\u03C3\u03B5\u03B9',\n      },\n      {\n        text: '\u03A0\u03B1\u03C1\u03BF\u03C7\u03AE \u03BF\u03B9\u03BA\u03BF\u03BD\u03BF\u03BC\u03B9\u03BA\u03CE\u03BD \u03C3\u03C4\u03BF\u03B9\u03C7\u03B5\u03AF\u03C9\u03BD',\n        status: '\u03A3\u03B5 \u03B1\u03BD\u03B1\u03BC\u03BF\u03BD\u03B7',\n      },\n      {\n        text: '\u03A0\u03B1\u03C1\u03BF\u03C7\u03AE \u03B9\u03B1\u03C4\u03C1\u03B9\u03BA\u03CE\u03BD \u03C0\u03BB\u03B7\u03C1\u03BF\u03C6\u03BF\u03C1\u03B9\u03CE\u03BD',\n        status: '\u03A3\u03B5 \u03B1\u03BD\u03B1\u03BC\u03BF\u03BD\u03B7',\n      },\n    ],\n  },\n  {\n    title: '\u0391\u03AF\u03C4\u03B7\u03C3\u03B7',\n    tasks: [\n      {\n        text: '\u03A5\u03C0\u03BF\u03B2\u03BF\u03BB\u03AE \u03BA\u03B1\u03B9 \u03C0\u03BB\u03B7\u03C1\u03C9\u03BC\u03AE',\n        status: '\u03A3\u03B5 \u03B1\u03BD\u03B1\u03BC\u03BF\u03BD\u03B7',\n      },\n    ],\n  },\n];\n\nexport const Default = () => (\n  <div>\n    <TaskList>\n      {fields &&\n        fields.map((field, index) => {\n          return (\n            <TaskListItem key={index}>\n              <TaskListItemHeading size=\"md\">{`${index + 1}. ${\n                field.title\n              }`}</TaskListItemHeading>\n              <TaskListItemContent>\n                <SummaryList>\n                  {field.tasks.map((task, key) => {\n                    let tagColor;\n                    switch (task.status) {\n                      case '\u039F\u03BB\u03BF\u03BA\u03BB\u03B7\u03C1\u03C9\u03B8\u03B7\u03BA\u03B5':\n                        tagColor = 'info';\n                        break;\n                      case '\u03A3\u03B5 \u03B5\u03BE\u03B5\u03BB\u03B9\u03BE\u03B7':\n                        tagColor = 'primary';\n                        break;\n                      case '\u0394\u03B5\u03BD \u03B5\u03C7\u03B5\u03B9 \u03BE\u03B5\u03BA\u03B9\u03BD\u03B7\u03C3\u03B5\u03B9':\n                        tagColor = 'secondary';\n                        break;\n                      case '\u03A3\u03B5 \u03B1\u03BD\u03B1\u03BC\u03BF\u03BD\u03B7':\n                        tagColor = 'secondary';\n                        break;\n                    }\n                    return (\n                      <SummaryListItem key={key}>\n                        <SummaryListItemKey>\n                          <LinkBase>{task.text}</LinkBase>\n                        </SummaryListItemKey>\n                        <SummaryListItemAction>\n                          <TaskListItemTag color={tagColor}>\n                            {task.status}\n                          </TaskListItemTag>\n                        </SummaryListItemAction>\n                      </SummaryListItem>\n                    );\n                  })}\n                </SummaryList>\n              </TaskListItemContent>\n            </TaskListItem>\n          );\n        })}\n    </TaskList>\n  </div>\n);\n\nexport default Default;\n"],
+  "mappings": "AAAA,OAAO,WAAW;AAElB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,gBAAgB;AAEzB,MAAM,SAAS;AAAA,EACb;AAAA,IACE,OAAO;AAAA,IACP,OAAO;AAAA,MACL;AAAA,QACE,MAAM;AAAA,QACN,QAAQ;AAAA,MACV;AAAA,MACA;AAAA,QACE,MAAM;AAAA,QACN,QAAQ;AAAA,MACV;AAAA,IACF;AAAA,EACF;AAAA,EACA;AAAA,IACE,OAAO;AAAA,IACP,OAAO;AAAA,MACL;AAAA,QACE,MAAM;AAAA,QACN,QAAQ;AAAA,MACV;AAAA,MACA;AAAA,QACE,MAAM;AAAA,QACN,QAAQ;AAAA,MACV;AAAA,MACA;AAAA,QACE,MAAM;AAAA,QACN,QAAQ;AAAA,MACV;AAAA,MACA;AAAA,QACE,MAAM;AAAA,QACN,QAAQ;AAAA,MACV;AAAA,MACA;AAAA,QACE,MAAM;AAAA,QACN,QAAQ;AAAA,MACV;AAAA,IACF;AAAA,EACF;AAAA,EACA;AAAA,IACE,OAAO;AAAA,IACP,OAAO;AAAA,MACL;AAAA,QACE,MAAM;AAAA,QACN,QAAQ;AAAA,MACV;AAAA,IACF;AAAA,EACF;AACF;AAEO,MAAM,UAAU,MACrB,oCAAC,aACC,oCAAC,gBACE,UACC,OAAO,IAAI,CAAC,OAAO,UAAU;AAC3B,SACE,oCAAC,gBAAa,KAAK,SACjB,oCAAC,uBAAoB,MAAK,QAAM,GAAG,QAAQ,CAAC,KAC1C,MAAM,KACR,EAAG,GACH,oCAAC,2BACC,oCAAC,mBACE,MAAM,MAAM,IAAI,CAAC,MAAM,QAAQ;AAC9B,QAAI;AACJ,YAAQ,KAAK,QAAQ;AAAA,MACnB,KAAK;AACH,mBAAW;AACX;AAAA,MACF,KAAK;AACH,mBAAW;AACX;AAAA,MACF,KAAK;AACH,mBAAW;AACX;AAAA,MACF,KAAK;AACH,mBAAW;AACX;AAAA,IACJ;AACA,WACE,oCAAC,mBAAgB,OACf,oCAAC,0BACC,oCAAC,gBAAU,KAAK,IAAK,CACvB,GACA,oCAAC,6BACC,oCAAC,mBAAgB,OAAO,YACrB,KAAK,MACR,CACF,CACF;AAAA,EAEJ,CAAC,CACH,CACF,CACF;AAEJ,CAAC,CACL,CACF;AAGF,IAAO,kBAAQ;",
+  "names": []
+}

package/content/TaskList/__stories__/Dense/index.js

@@ -0,0 +1,90 @@
+import React from "react";
+import {
+  SummaryList,
+  SummaryListItem,
+  SummaryListItemAction,
+  SummaryListItemKey
+} from "@digigov/ui/content/SummaryList";
+import {
+  TaskList,
+  TaskListItem,
+  TaskListItemHeading,
+  TaskListItemContent,
+  TaskListItemTag
+} from "@digigov/ui/content/TaskList";
+import { LinkBase } from "@digigov/ui/navigation/Link";
+const fields = [
+  {
+    title: "\u0388\u03BB\u03B5\u03B3\u03C7\u03BF\u03B9 \u03C0\u03C1\u03B9\u03BD \u03BE\u03B5\u03BA\u03B9\u03BD\u03AE\u03C3\u03B5\u03C4\u03B5",
+    tasks: [
+      {
+        text: "\u0395\u03BB\u03AD\u03B3\u03BE\u03C4\u03B5 \u03C4\u03B7\u03BD \u03BA\u03B1\u03C4\u03B1\u03BB\u03BB\u03B7\u03BB\u03CC\u03C4\u03B7\u03C4\u03B1",
+        status: "\u039F\u03BB\u03BF\u03BA\u03BB\u03B7\u03C1\u03C9\u03B8\u03B7\u03BA\u03B5"
+      },
+      {
+        text: "\u0395\u03BC\u03C6\u03AC\u03BD\u03B9\u03C3\u03B7 \u03B4\u03AE\u03BB\u03C9\u03C3\u03B7\u03C2",
+        status: "\u039F\u03BB\u03BF\u03BA\u03BB\u03B7\u03C1\u03C9\u03B8\u03B7\u03BA\u03B5"
+      }
+    ]
+  },
+  {
+    title: "\u03A0\u03C1\u03BF\u03B5\u03C4\u03BF\u03B9\u03BC\u03B1\u03C3\u03AF\u03B1 \u03B1\u03AF\u03C4\u03B7\u03C3\u03B7\u03C2",
+    tasks: [
+      {
+        text: "\u03A3\u03C4\u03BF\u03B9\u03C7\u03B5\u03AF\u03B1 \u03B5\u03C4\u03B1\u03B9\u03C1\u03B5\u03AF\u03B1\u03C2",
+        status: "\u039F\u03BB\u03BF\u03BA\u03BB\u03B7\u03C1\u03C9\u03B8\u03B7\u03BA\u03B5"
+      },
+      {
+        text: "\u03A3\u03C4\u03BF\u03B9\u03C7\u03B5\u03AF\u03B1 \u03B5\u03C0\u03B9\u03BA\u03BF\u03B9\u03BD\u03C9\u03BD\u03AF\u03B1\u03C2",
+        status: "\u03A3\u03B5 \u03B5\u03BE\u03B5\u03BB\u03B9\u03BE\u03B7"
+      },
+      {
+        text: "\u039B\u03AF\u03C3\u03C4\u03B1 \u03B1\u03C0\u03BF\u03B4\u03B5\u03AF\u03BE\u03B5\u03C9\u03BD",
+        status: "\u0394\u03B5\u03BD \u03B5\u03C7\u03B5\u03B9 \u03BE\u03B5\u03BA\u03B9\u03BD\u03B7\u03C3\u03B5\u03B9"
+      },
+      {
+        text: "\u03A0\u03B1\u03C1\u03BF\u03C7\u03AE \u03BF\u03B9\u03BA\u03BF\u03BD\u03BF\u03BC\u03B9\u03BA\u03CE\u03BD \u03C3\u03C4\u03BF\u03B9\u03C7\u03B5\u03AF\u03C9\u03BD",
+        status: "\u03A3\u03B5 \u03B1\u03BD\u03B1\u03BC\u03BF\u03BD\u03B7"
+      },
+      {
+        text: "\u03A0\u03B1\u03C1\u03BF\u03C7\u03AE \u03B9\u03B1\u03C4\u03C1\u03B9\u03BA\u03CE\u03BD \u03C0\u03BB\u03B7\u03C1\u03BF\u03C6\u03BF\u03C1\u03B9\u03CE\u03BD",
+        status: "\u03A3\u03B5 \u03B1\u03BD\u03B1\u03BC\u03BF\u03BD\u03B7"
+      }
+    ]
+  },
+  {
+    title: "\u0391\u03AF\u03C4\u03B7\u03C3\u03B7",
+    tasks: [
+      {
+        text: "\u03A5\u03C0\u03BF\u03B2\u03BF\u03BB\u03AE \u03BA\u03B1\u03B9 \u03C0\u03BB\u03B7\u03C1\u03C9\u03BC\u03AE",
+        status: "\u03A3\u03B5 \u03B1\u03BD\u03B1\u03BC\u03BF\u03BD\u03B7"
+      }
+    ]
+  }
+];
+const Dense = () => /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(TaskList, { dense: true }, fields && fields.map((field, index) => {
+  return /* @__PURE__ */ React.createElement(TaskListItem, { key: index }, /* @__PURE__ */ React.createElement(TaskListItemHeading, { size: "md" }, `${index + 1}. ${field.title}`), /* @__PURE__ */ React.createElement(TaskListItemContent, null, /* @__PURE__ */ React.createElement(SummaryList, null, field.tasks.map((task, key) => {
+    let tagColor;
+    switch (task.status) {
+      case "\u039F\u03BB\u03BF\u03BA\u03BB\u03B7\u03C1\u03C9\u03B8\u03B7\u03BA\u03B5":
+        tagColor = "info";
+        break;
+      case "\u03A3\u03B5 \u03B5\u03BE\u03B5\u03BB\u03B9\u03BE\u03B7":
+        tagColor = "primary";
+        break;
+      case "\u0394\u03B5\u03BD \u03B5\u03C7\u03B5\u03B9 \u03BE\u03B5\u03BA\u03B9\u03BD\u03B7\u03C3\u03B5\u03B9":
+        tagColor = "secondary";
+        break;
+      case "\u03A3\u03B5 \u03B1\u03BD\u03B1\u03BC\u03BF\u03BD\u03B7":
+        tagColor = "secondary";
+        break;
+    }
+    return /* @__PURE__ */ React.createElement(SummaryListItem, { key }, /* @__PURE__ */ React.createElement(SummaryListItemKey, null, /* @__PURE__ */ React.createElement(LinkBase, null, task.text)), /* @__PURE__ */ React.createElement(SummaryListItemAction, null, /* @__PURE__ */ React.createElement(TaskListItemTag, { color: tagColor }, task.status)));
+  }))));
+})));
+var Dense_default = Dense;
+export {
+  Dense,
+  Dense_default as default
+};
+//# sourceMappingURL=Dense.js.map

package/content/TaskList/__stories__/Dense/package.json

@@ -0,0 +1,6 @@
+{
+  "sideEffects": false,
+  "module": "./index.js",
+  "types": "./index.d.ts",
+  "main": "../../../../cjs/content/TaskList/__stories__/Dense/index.js"
+}

package/content/TaskList/__stories__/Dense.d.ts

@@ -1,3 +1,3 @@
 import React from 'react';
-export declare const Dense: (_: any) => React.JSX.Element;
+export declare const Dense: () => React.JSX.Element;
 export default Dense;

package/content/TaskList/__stories__/Dense.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/content/TaskList/__stories__/Dense.tsx"],
+  "sourcesContent": ["import React from 'react';\n\nimport {\n  SummaryList,\n  SummaryListItem,\n  SummaryListItemAction,\n  SummaryListItemKey,\n} from '@digigov/ui/content/SummaryList';\n\nimport {\n  TaskList,\n  TaskListItem,\n  TaskListItemHeading,\n  TaskListItemContent,\n  TaskListItemTag,\n} from '@digigov/ui/content/TaskList';\nimport { LinkBase } from '@digigov/ui/navigation/Link';\n\nconst fields = [\n  {\n    title: '\u0388\u03BB\u03B5\u03B3\u03C7\u03BF\u03B9 \u03C0\u03C1\u03B9\u03BD \u03BE\u03B5\u03BA\u03B9\u03BD\u03AE\u03C3\u03B5\u03C4\u03B5',\n    tasks: [\n      {\n        text: '\u0395\u03BB\u03AD\u03B3\u03BE\u03C4\u03B5 \u03C4\u03B7\u03BD \u03BA\u03B1\u03C4\u03B1\u03BB\u03BB\u03B7\u03BB\u03CC\u03C4\u03B7\u03C4\u03B1',\n        status: '\u039F\u03BB\u03BF\u03BA\u03BB\u03B7\u03C1\u03C9\u03B8\u03B7\u03BA\u03B5',\n      },\n      {\n        text: '\u0395\u03BC\u03C6\u03AC\u03BD\u03B9\u03C3\u03B7 \u03B4\u03AE\u03BB\u03C9\u03C3\u03B7\u03C2',\n        status: '\u039F\u03BB\u03BF\u03BA\u03BB\u03B7\u03C1\u03C9\u03B8\u03B7\u03BA\u03B5',\n      },\n    ],\n  },\n  {\n    title: '\u03A0\u03C1\u03BF\u03B5\u03C4\u03BF\u03B9\u03BC\u03B1\u03C3\u03AF\u03B1 \u03B1\u03AF\u03C4\u03B7\u03C3\u03B7\u03C2',\n    tasks: [\n      {\n        text: '\u03A3\u03C4\u03BF\u03B9\u03C7\u03B5\u03AF\u03B1 \u03B5\u03C4\u03B1\u03B9\u03C1\u03B5\u03AF\u03B1\u03C2',\n        status: '\u039F\u03BB\u03BF\u03BA\u03BB\u03B7\u03C1\u03C9\u03B8\u03B7\u03BA\u03B5',\n      },\n      {\n        text: '\u03A3\u03C4\u03BF\u03B9\u03C7\u03B5\u03AF\u03B1 \u03B5\u03C0\u03B9\u03BA\u03BF\u03B9\u03BD\u03C9\u03BD\u03AF\u03B1\u03C2',\n        status: '\u03A3\u03B5 \u03B5\u03BE\u03B5\u03BB\u03B9\u03BE\u03B7',\n      },\n      {\n        text: '\u039B\u03AF\u03C3\u03C4\u03B1 \u03B1\u03C0\u03BF\u03B4\u03B5\u03AF\u03BE\u03B5\u03C9\u03BD',\n        status: '\u0394\u03B5\u03BD \u03B5\u03C7\u03B5\u03B9 \u03BE\u03B5\u03BA\u03B9\u03BD\u03B7\u03C3\u03B5\u03B9',\n      },\n      {\n        text: '\u03A0\u03B1\u03C1\u03BF\u03C7\u03AE \u03BF\u03B9\u03BA\u03BF\u03BD\u03BF\u03BC\u03B9\u03BA\u03CE\u03BD \u03C3\u03C4\u03BF\u03B9\u03C7\u03B5\u03AF\u03C9\u03BD',\n        status: '\u03A3\u03B5 \u03B1\u03BD\u03B1\u03BC\u03BF\u03BD\u03B7',\n      },\n      {\n        text: '\u03A0\u03B1\u03C1\u03BF\u03C7\u03AE \u03B9\u03B1\u03C4\u03C1\u03B9\u03BA\u03CE\u03BD \u03C0\u03BB\u03B7\u03C1\u03BF\u03C6\u03BF\u03C1\u03B9\u03CE\u03BD',\n        status: '\u03A3\u03B5 \u03B1\u03BD\u03B1\u03BC\u03BF\u03BD\u03B7',\n      },\n    ],\n  },\n  {\n    title: '\u0391\u03AF\u03C4\u03B7\u03C3\u03B7',\n    tasks: [\n      {\n        text: '\u03A5\u03C0\u03BF\u03B2\u03BF\u03BB\u03AE \u03BA\u03B1\u03B9 \u03C0\u03BB\u03B7\u03C1\u03C9\u03BC\u03AE',\n        status: '\u03A3\u03B5 \u03B1\u03BD\u03B1\u03BC\u03BF\u03BD\u03B7',\n      },\n    ],\n  },\n];\n\nexport const Dense = () => (\n  <div>\n    <TaskList dense>\n      {fields &&\n        fields.map((field, index) => {\n          return (\n            <TaskListItem key={index}>\n              <TaskListItemHeading size=\"md\">{`${index + 1}. ${\n                field.title\n              }`}</TaskListItemHeading>\n              <TaskListItemContent>\n                <SummaryList>\n                  {field.tasks.map((task, key) => {\n                    let tagColor;\n                    switch (task.status) {\n                      case '\u039F\u03BB\u03BF\u03BA\u03BB\u03B7\u03C1\u03C9\u03B8\u03B7\u03BA\u03B5':\n                        tagColor = 'info';\n                        break;\n                      case '\u03A3\u03B5 \u03B5\u03BE\u03B5\u03BB\u03B9\u03BE\u03B7':\n                        tagColor = 'primary';\n                        break;\n                      case '\u0394\u03B5\u03BD \u03B5\u03C7\u03B5\u03B9 \u03BE\u03B5\u03BA\u03B9\u03BD\u03B7\u03C3\u03B5\u03B9':\n                        tagColor = 'secondary';\n                        break;\n                      case '\u03A3\u03B5 \u03B1\u03BD\u03B1\u03BC\u03BF\u03BD\u03B7':\n                        tagColor = 'secondary';\n                        break;\n                    }\n                    return (\n                      <SummaryListItem key={key}>\n                        <SummaryListItemKey>\n                          <LinkBase>{task.text}</LinkBase>\n                        </SummaryListItemKey>\n                        <SummaryListItemAction>\n                          <TaskListItemTag color={tagColor}>\n                            {task.status}\n                          </TaskListItemTag>\n                        </SummaryListItemAction>\n                      </SummaryListItem>\n                    );\n                  })}\n                </SummaryList>\n              </TaskListItemContent>\n            </TaskListItem>\n          );\n        })}\n    </TaskList>\n  </div>\n);\n\nexport default Dense;\n"],
+  "mappings": "AAAA,OAAO,WAAW;AAElB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,gBAAgB;AAEzB,MAAM,SAAS;AAAA,EACb;AAAA,IACE,OAAO;AAAA,IACP,OAAO;AAAA,MACL;AAAA,QACE,MAAM;AAAA,QACN,QAAQ;AAAA,MACV;AAAA,MACA;AAAA,QACE,MAAM;AAAA,QACN,QAAQ;AAAA,MACV;AAAA,IACF;AAAA,EACF;AAAA,EACA;AAAA,IACE,OAAO;AAAA,IACP,OAAO;AAAA,MACL;AAAA,QACE,MAAM;AAAA,QACN,QAAQ;AAAA,MACV;AAAA,MACA;AAAA,QACE,MAAM;AAAA,QACN,QAAQ;AAAA,MACV;AAAA,MACA;AAAA,QACE,MAAM;AAAA,QACN,QAAQ;AAAA,MACV;AAAA,MACA;AAAA,QACE,MAAM;AAAA,QACN,QAAQ;AAAA,MACV;AAAA,MACA;AAAA,QACE,MAAM;AAAA,QACN,QAAQ;AAAA,MACV;AAAA,IACF;AAAA,EACF;AAAA,EACA;AAAA,IACE,OAAO;AAAA,IACP,OAAO;AAAA,MACL;AAAA,QACE,MAAM;AAAA,QACN,QAAQ;AAAA,MACV;AAAA,IACF;AAAA,EACF;AACF;AAEO,MAAM,QAAQ,MACnB,oCAAC,aACC,oCAAC,YAAS,OAAK,QACZ,UACC,OAAO,IAAI,CAAC,OAAO,UAAU;AAC3B,SACE,oCAAC,gBAAa,KAAK,SACjB,oCAAC,uBAAoB,MAAK,QAAM,GAAG,QAAQ,CAAC,KAC1C,MAAM,KACR,EAAG,GACH,oCAAC,2BACC,oCAAC,mBACE,MAAM,MAAM,IAAI,CAAC,MAAM,QAAQ;AAC9B,QAAI;AACJ,YAAQ,KAAK,QAAQ;AAAA,MACnB,KAAK;AACH,mBAAW;AACX;AAAA,MACF,KAAK;AACH,mBAAW;AACX;AAAA,MACF,KAAK;AACH,mBAAW;AACX;AAAA,MACF,KAAK;AACH,mBAAW;AACX;AAAA,IACJ;AACA,WACE,oCAAC,mBAAgB,OACf,oCAAC,0BACC,oCAAC,gBAAU,KAAK,IAAK,CACvB,GACA,oCAAC,6BACC,oCAAC,mBAAgB,OAAO,YACrB,KAAK,MACR,CACF,CACF;AAAA,EAEJ,CAAC,CACH,CACF,CACF;AAEJ,CAAC,CACL,CACF;AAGF,IAAO,gBAAQ;",
+  "names": []
+}

package/content/Timeline/Timeline.stories/index.js

@@ -0,0 +1,15 @@
+import Timeline from "@digigov/ui/content/Timeline";
+var Timeline_stories_default = {
+  title: "Digigov UI/content/Timeline",
+  description: "Use this pattern to show a list of entries in the order they happened.",
+  component: Timeline,
+  displayName: "Timeline"
+};
+import { Default } from "@digigov/ui/content/Timeline/__stories__/Default";
+import { Dense } from "@digigov/ui/content/Timeline/__stories__/Dense";
+export {
+  Default,
+  Dense,
+  Timeline_stories_default as default
+};
+//# sourceMappingURL=Timeline.stories.js.map

package/content/Timeline/Timeline.stories/package.json

@@ -0,0 +1,6 @@
+{
+  "sideEffects": false,
+  "module": "./index.js",
+  "types": "./index.d.ts",
+  "main": "../../../cjs/content/Timeline/Timeline.stories/index.js"
+}

package/content/Timeline/Timeline.stories.d.ts

@@ -2,8 +2,6 @@ declare namespace _default {
     export let title: string;
     export let description: string;
     export { Timeline as component };
-    export let tags: string[];
-    export { doc as markdown };
     export let displayName: string;
 }
 export default _default;

package/content/Timeline/Timeline.stories.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/content/Timeline/Timeline.stories.js"],
+  "sourcesContent": ["import Timeline from '@digigov/ui/content/Timeline';\nexport default {\n  title: 'Digigov UI/content/Timeline',\n  description:\n    'Use this pattern to show a list of entries in the order they happened.',\n  component: Timeline,\n  displayName: 'Timeline',\n};\nexport { Default } from '@digigov/ui/content/Timeline/__stories__/Default';\nexport { Dense } from '@digigov/ui/content/Timeline/__stories__/Dense';\n"],
+  "mappings": "AAAA,OAAO,cAAc;AACrB,IAAO,2BAAQ;AAAA,EACb,OAAO;AAAA,EACP,aACE;AAAA,EACF,WAAW;AAAA,EACX,aAAa;AACf;AACA,SAAS,eAAe;AACxB,SAAS,aAAa;",
+  "names": []
+}