@coorpacademy/components 11.18.9 → 11.18.10

package/lib/molecule/expandible-actionable-table/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","names":["columnProptypes","PropTypes","shape","title","string","isRequired","rowProptypes","fields","arrayOf","oneOfType","StatusItem","propTypes","type","oneOf","isRowExpandible","bool","lastField","BulletPointMenuButton","columns","rows","stickyFirstColumn","stickyLastColumn","columnWidth","ariaDescribedby","ButtonLink","componentType","isNestedTable"],"sources":["../../../src/molecule/expandible-actionable-table/types.ts"],"sourcesContent":["import PropTypes from 'prop-types';\nimport StatusItem from '../../atom/status-item';\nimport ButtonLink from '../../atom/button-link';\nimport BulletPointMenuButton from '../bullet-point-menu-button';\nimport {BulletPointMenuButtonProps} from '../bullet-point-menu-button/types';\nimport {ButtonLinkProps} from '../../atom/button-link/types';\nimport {StatusItemProps} from '../../atom/status-item/types';\nimport {Props as ErrorsTableProps} from '../errors-table/types';\nimport {Props as BulkProgressBarProps} from '../bulk-progress-bar/types';\n\nconst columnProptypes = PropTypes.shape({\n  title: PropTypes.string.isRequired\n});\n\nconst rowProptypes = PropTypes.shape({\n  fields: PropTypes.arrayOf(\n    PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.shape({\n        ...StatusItem.propTypes,\n        type: PropTypes.oneOf(['status'])\n      })\n    ])\n  ),\n  isRowExpandible: PropTypes.bool,\n  lastField: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.shape({\n      ...BulletPointMenuButton.propTypes,\n      type: PropTypes.oneOf(['menu'])\n    })\n  ])\n});\n\nexport const propTypes = {\n  columns: PropTypes.arrayOf(columnProptypes),\n  rows: PropTypes.arrayOf(rowProptypes),\n  stickyFirstColumn: PropTypes.bool,\n  stickyLastColumn: PropTypes.bool,\n  columnWidth: PropTypes.string,\n  ariaDescribedby: PropTypes.string,\n  lastField: PropTypes.oneOfType([\n    PropTypes.shape({\n      ...ButtonLink.propTypes,\n      componentType: PropTypes.oneOf(['button-link'])\n    }),\n    PropTypes.shape({\n      ...BulletPointMenuButton.propTypes,\n      componentType: PropTypes.oneOf(['menu'])\n    })\n  ]),\n  isNestedTable: PropTypes.bool\n};\n\nexport type Field =\n  | string\n  | (StatusItemProps & {\n      componentType: 'status';\n    })\n  | (BulkProgressBarProps & {\n      componentType: 'progress-bar';\n    });\n\nexport type LastField =\n  | (ButtonLinkProps & {\n      componentType: 'button-link';\n    })\n  | (BulletPointMenuButtonProps & {\n      componentType: 'menu';\n    });\n\nexport type NestedRow =\n  | (ErrorsTableProps & {\n      componentType: 'errors-table';\n    })\n  | (Props & {\n      componentType: 'expandible-errors-table';\n    });\n\nexport type Column = {title: string};\nexport type Row = {\n  fields: Field[];\n\n  nestedRow?: NestedRow;\n  isRowExpandible?: boolean;\n};\nexport type Columns = Column[];\nexport type Rows = Row[];\n\nexport type Props = {\n  columns: Columns;\n  rows?: Rows;\n  stickyFirstColumn?: boolean;\n  stickyLastColumn?: boolean;\n  columnWidth?: `${number}${'px' | '%'}`;\n  ariaDescribedby?: string;\n  lastField?: LastField;\n  isNestedTable?: boolean;\n};\n\nexport type ExpandState = {[key: number]: boolean};\n"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;;;;;AAOA,MAAMA,eAAe,GAAGC,kBAAA,CAAUC,KAAV,CAAgB;EACtCC,KAAK,EAAEF,kBAAA,CAAUG,MAAV,CAAiBC;AADc,CAAhB,CAAxB;;AAIA,MAAMC,YAAY,GAAGL,kBAAA,CAAUC,KAAV,CAAgB;EACnCK,MAAM,EAAEN,kBAAA,CAAUO,OAAV,CACNP,kBAAA,CAAUQ,SAAV,CAAoB,CAClBR,kBAAA,CAAUG,MADQ,EAElBH,kBAAA,CAAUC,KAAV,cACKQ,mBAAA,CAAWC,SADhB;IAEEC,IAAI,EAAEX,kBAAA,CAAUY,KAAV,CAAgB,CAAC,QAAD,CAAhB;EAFR,GAFkB,CAApB,CADM,CAD2B;EAUnCC,eAAe,EAAEb,kBAAA,CAAUc,IAVQ;EAWnCC,SAAS,EAAEf,kBAAA,CAAUQ,SAAV,CAAoB,CAC7BR,kBAAA,CAAUG,MADmB,EAE7BH,kBAAA,CAAUC,KAAV,cACKe,8BAAA,CAAsBN,SAD3B;IAEEC,IAAI,EAAEX,kBAAA,CAAUY,KAAV,CAAgB,CAAC,MAAD,CAAhB;EAFR,GAF6B,CAApB;AAXwB,CAAhB,CAArB;;AAoBO,MAAMF,SAAS,GAAG;EACvBO,OAAO,EAAEjB,kBAAA,CAAUO,OAAV,CAAkBR,eAAlB,CADc;EAEvBmB,IAAI,EAAElB,kBAAA,CAAUO,OAAV,CAAkBF,YAAlB,CAFiB;EAGvBc,iBAAiB,EAAEnB,kBAAA,CAAUc,IAHN;EAIvBM,gBAAgB,EAAEpB,kBAAA,CAAUc,IAJL;EAKvBO,WAAW,EAAErB,kBAAA,CAAUG,MALA;EAMvBmB,eAAe,EAAEtB,kBAAA,CAAUG,MANJ;EAOvBY,SAAS,EAAEf,kBAAA,CAAUQ,SAAV,CAAoB,CAC7BR,kBAAA,CAAUC,KAAV,cACKsB,mBAAA,CAAWb,SADhB;IAEEc,aAAa,EAAExB,kBAAA,CAAUY,KAAV,CAAgB,CAAC,aAAD,CAAhB;EAFjB,GAD6B,EAK7BZ,kBAAA,CAAUC,KAAV,cACKe,8BAAA,CAAsBN,SAD3B;IAEEc,aAAa,EAAExB,kBAAA,CAAUY,KAAV,CAAgB,CAAC,MAAD,CAAhB;EAFjB,GAL6B,CAApB,CAPY;EAiBvBa,aAAa,EAAEzB,kBAAA,CAAUc;AAjBF,CAAlB"}
+{"version":3,"file":"types.js","names":["columnProptypes","PropTypes","shape","title","string","isRequired","rowProptypes","fields","arrayOf","oneOfType","StatusItem","propTypes","type","oneOf","isRowExpandible","bool","lastField","BulletPointMenuButton","columns","rows","stickyFirstColumn","stickyLastColumn","columnWidth","ariaDescribedby","ButtonLink","componentType","isNestedTable","emptyStateFirstMessage","emptyStateSecondMessage"],"sources":["../../../src/molecule/expandible-actionable-table/types.ts"],"sourcesContent":["import PropTypes from 'prop-types';\nimport StatusItem from '../../atom/status-item';\nimport ButtonLink from '../../atom/button-link';\nimport BulletPointMenuButton from '../bullet-point-menu-button';\nimport {BulletPointMenuButtonProps} from '../bullet-point-menu-button/types';\nimport {ButtonLinkProps} from '../../atom/button-link/types';\nimport {StatusItemProps} from '../../atom/status-item/types';\nimport {Props as ErrorsTableProps} from '../errors-table/types';\nimport {Props as BulkProgressBarProps} from '../bulk-progress-bar/types';\n\nconst columnProptypes = PropTypes.shape({\n  title: PropTypes.string.isRequired\n});\n\nconst rowProptypes = PropTypes.shape({\n  fields: PropTypes.arrayOf(\n    PropTypes.oneOfType([\n      PropTypes.string,\n      PropTypes.shape({\n        ...StatusItem.propTypes,\n        type: PropTypes.oneOf(['status'])\n      })\n    ])\n  ),\n  isRowExpandible: PropTypes.bool,\n  lastField: PropTypes.oneOfType([\n    PropTypes.string,\n    PropTypes.shape({\n      ...BulletPointMenuButton.propTypes,\n      type: PropTypes.oneOf(['menu'])\n    })\n  ])\n});\n\nexport const propTypes = {\n  columns: PropTypes.arrayOf(columnProptypes),\n  rows: PropTypes.arrayOf(rowProptypes),\n  stickyFirstColumn: PropTypes.bool,\n  stickyLastColumn: PropTypes.bool,\n  columnWidth: PropTypes.string,\n  ariaDescribedby: PropTypes.string,\n  lastField: PropTypes.oneOfType([\n    PropTypes.shape({\n      ...ButtonLink.propTypes,\n      componentType: PropTypes.oneOf(['button-link'])\n    }),\n    PropTypes.shape({\n      ...BulletPointMenuButton.propTypes,\n      componentType: PropTypes.oneOf(['menu'])\n    })\n  ]),\n  isNestedTable: PropTypes.bool,\n  emptyStateFirstMessage: PropTypes.string,\n  emptyStateSecondMessage: PropTypes.string\n};\n\nexport type Field =\n  | string\n  | (StatusItemProps & {\n      componentType: 'status';\n    })\n  | (BulkProgressBarProps & {\n      componentType: 'progress-bar';\n    });\n\nexport type LastField =\n  | (ButtonLinkProps & {\n      componentType: 'button-link';\n    })\n  | (BulletPointMenuButtonProps & {\n      componentType: 'menu';\n    });\n\nexport type NestedRow =\n  | (ErrorsTableProps & {\n      componentType: 'errors-table';\n    })\n  | (Props & {\n      componentType: 'expandible-errors-table';\n    });\n\nexport type Column = {title: string};\nexport type Row = {\n  fields: Field[];\n\n  nestedRow?: NestedRow;\n  isRowExpandible?: boolean;\n};\nexport type Columns = Column[];\nexport type Rows = Row[];\n\nexport type Props = {\n  columns: Columns;\n  rows?: Rows;\n  stickyFirstColumn?: boolean;\n  stickyLastColumn?: boolean;\n  columnWidth?: `${number}${'px' | '%'}`;\n  ariaDescribedby?: string;\n  lastField?: LastField;\n  isNestedTable?: boolean;\n  emptyStateFistMessage?: string;\n  emptyStateSecondMessage?: string;\n};\n\nexport type ExpandState = {[key: number]: boolean};\n"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;;;;;AAOA,MAAMA,eAAe,GAAGC,kBAAA,CAAUC,KAAV,CAAgB;EACtCC,KAAK,EAAEF,kBAAA,CAAUG,MAAV,CAAiBC;AADc,CAAhB,CAAxB;;AAIA,MAAMC,YAAY,GAAGL,kBAAA,CAAUC,KAAV,CAAgB;EACnCK,MAAM,EAAEN,kBAAA,CAAUO,OAAV,CACNP,kBAAA,CAAUQ,SAAV,CAAoB,CAClBR,kBAAA,CAAUG,MADQ,EAElBH,kBAAA,CAAUC,KAAV,cACKQ,mBAAA,CAAWC,SADhB;IAEEC,IAAI,EAAEX,kBAAA,CAAUY,KAAV,CAAgB,CAAC,QAAD,CAAhB;EAFR,GAFkB,CAApB,CADM,CAD2B;EAUnCC,eAAe,EAAEb,kBAAA,CAAUc,IAVQ;EAWnCC,SAAS,EAAEf,kBAAA,CAAUQ,SAAV,CAAoB,CAC7BR,kBAAA,CAAUG,MADmB,EAE7BH,kBAAA,CAAUC,KAAV,cACKe,8BAAA,CAAsBN,SAD3B;IAEEC,IAAI,EAAEX,kBAAA,CAAUY,KAAV,CAAgB,CAAC,MAAD,CAAhB;EAFR,GAF6B,CAApB;AAXwB,CAAhB,CAArB;;AAoBO,MAAMF,SAAS,GAAG;EACvBO,OAAO,EAAEjB,kBAAA,CAAUO,OAAV,CAAkBR,eAAlB,CADc;EAEvBmB,IAAI,EAAElB,kBAAA,CAAUO,OAAV,CAAkBF,YAAlB,CAFiB;EAGvBc,iBAAiB,EAAEnB,kBAAA,CAAUc,IAHN;EAIvBM,gBAAgB,EAAEpB,kBAAA,CAAUc,IAJL;EAKvBO,WAAW,EAAErB,kBAAA,CAAUG,MALA;EAMvBmB,eAAe,EAAEtB,kBAAA,CAAUG,MANJ;EAOvBY,SAAS,EAAEf,kBAAA,CAAUQ,SAAV,CAAoB,CAC7BR,kBAAA,CAAUC,KAAV,cACKsB,mBAAA,CAAWb,SADhB;IAEEc,aAAa,EAAExB,kBAAA,CAAUY,KAAV,CAAgB,CAAC,aAAD,CAAhB;EAFjB,GAD6B,EAK7BZ,kBAAA,CAAUC,KAAV,cACKe,8BAAA,CAAsBN,SAD3B;IAEEc,aAAa,EAAExB,kBAAA,CAAUY,KAAV,CAAgB,CAAC,MAAD,CAAhB;EAFjB,GAL6B,CAApB,CAPY;EAiBvBa,aAAa,EAAEzB,kBAAA,CAAUc,IAjBF;EAkBvBY,sBAAsB,EAAE1B,kBAAA,CAAUG,MAlBX;EAmBvBwB,uBAAuB,EAAE3B,kBAAA,CAAUG;AAnBZ,CAAlB"}

package/lib/molecule/review-header-steps/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/review-header-steps/index.js"],"names":[],"mappings":";AAMA,4DAaC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/molecule/review-header-steps/index.js"],"names":[],"mappings":";AAMA,4DAiBC"}

package/lib/molecule/review-header-steps/index.js

@@ -15,8 +15,6 @@ var _propTypes = _interopRequireDefault(require("./prop-types"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 const ReviewHeaderSteps = props => {
   const {
     steps
@@ -24,9 +22,10 @@ const ReviewHeaderSteps = props => {
 
   const items = _map.default.convert({
     cap: false
-  })((step, index) => /*#__PURE__*/_react.default.createElement(_statusItem.default, _extends({}, step, {
+  })((step, index) => /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.statusItemContainer,
     key: index
-  })), steps);
+  }, /*#__PURE__*/_react.default.createElement(_statusItem.default, step)), steps);
 
   return /*#__PURE__*/_react.default.createElement("div", {
     className: _style.default.wrapper,

package/lib/molecule/review-header-steps/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["ReviewHeaderSteps","props","steps","items","map","convert","cap","step","index","style","wrapper","propTypes"],"sources":["../../../src/molecule/review-header-steps/index.js"],"sourcesContent":["import React from 'react';\nimport map from 'lodash/fp/map';\nimport StatusItem from '../../atom/status-item';\nimport style from './style.css';\nimport propTypes from './prop-types';\n\nconst ReviewHeaderSteps = props => {\n  const {steps} = props;\n\n  const items = map.convert({cap: false})(\n    (step, index) => <StatusItem {...step} key={index} />,\n    steps\n  );\n\n  return (\n    <div className={style.wrapper} data-name=\"header-steps\">\n      {items}\n    </div>\n  );\n};\n\nReviewHeaderSteps.propTypes = propTypes;\n\nexport default ReviewHeaderSteps;\n"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;;;;;AAEA,MAAMA,iBAAiB,GAAGC,KAAK,IAAI;EACjC,MAAM;IAACC;EAAD,IAAUD,KAAhB;;EAEA,MAAME,KAAK,GAAGC,YAAA,CAAIC,OAAJ,CAAY;IAACC,GAAG,EAAE;EAAN,CAAZ,EACZ,CAACC,IAAD,EAAOC,KAAP,kBAAiB,6BAAC,mBAAD,eAAgBD,IAAhB;IAAsB,GAAG,EAAEC;EAA3B,GADL,EAEZN,KAFY,CAAd;;EAKA,oBACE;IAAK,SAAS,EAAEO,cAAA,CAAMC,OAAtB;IAA+B,aAAU;EAAzC,GACGP,KADH,CADF;AAKD,CAbD;;AAeAH,iBAAiB,CAACW,SAAlB,2CAA8BA,kBAA9B;eAEeX,iB"}
+{"version":3,"file":"index.js","names":["ReviewHeaderSteps","props","steps","items","map","convert","cap","step","index","style","statusItemContainer","wrapper","propTypes"],"sources":["../../../src/molecule/review-header-steps/index.js"],"sourcesContent":["import React from 'react';\nimport map from 'lodash/fp/map';\nimport StatusItem from '../../atom/status-item';\nimport style from './style.css';\nimport propTypes from './prop-types';\n\nconst ReviewHeaderSteps = props => {\n  const {steps} = props;\n\n  const items = map.convert({cap: false})(\n    (step, index) => (\n      <div className={style.statusItemContainer} key={index}>\n        <StatusItem {...step} />\n      </div>\n    ),\n    steps\n  );\n\n  return (\n    <div className={style.wrapper} data-name=\"header-steps\">\n      {items}\n    </div>\n  );\n};\n\nReviewHeaderSteps.propTypes = propTypes;\n\nexport default ReviewHeaderSteps;\n"],"mappings":";;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;;;AAEA,MAAMA,iBAAiB,GAAGC,KAAK,IAAI;EACjC,MAAM;IAACC;EAAD,IAAUD,KAAhB;;EAEA,MAAME,KAAK,GAAGC,YAAA,CAAIC,OAAJ,CAAY;IAACC,GAAG,EAAE;EAAN,CAAZ,EACZ,CAACC,IAAD,EAAOC,KAAP,kBACE;IAAK,SAAS,EAAEC,cAAA,CAAMC,mBAAtB;IAA2C,GAAG,EAAEF;EAAhD,gBACE,6BAAC,mBAAD,EAAgBD,IAAhB,CADF,CAFU,EAMZL,KANY,CAAd;;EASA,oBACE;IAAK,SAAS,EAAEO,cAAA,CAAME,OAAtB;IAA+B,aAAU;EAAzC,GACGR,KADH,CADF;AAKD,CAjBD;;AAmBAH,iBAAiB,CAACY,SAAlB,2CAA8BA,kBAA9B;eAEeZ,iB"}

package/lib/molecule/review-header-steps/prop-types.d.ts

@@ -3,6 +3,7 @@ import { StatusItemProps } from '../../atom/status-item/types';
 declare const propTypes: {
     steps: PropTypes.Requireable<(PropTypes.InferProps<{
         current: PropTypes.Requireable<boolean>;
+        selected: PropTypes.Requireable<boolean>;
         icon: PropTypes.Requireable<string>;
         value: PropTypes.Requireable<string>;
     }> | null | undefined)[]>;

package/lib/molecule/review-header-steps/prop-types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"prop-types.d.ts","sourceRoot":"","sources":["../../../src/molecule/review-header-steps/prop-types.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,OAAsC,EAAC,eAAe,EAAC,MAAM,8BAA8B,CAAC;AAE5F,QAAA,MAAM,SAAS;;;;;;CAEd,CAAC;AAEF,eAAe,SAAS,CAAC;AAEzB,oBAAY,sBAAsB,GAAG;IACnC,KAAK,EAAE,eAAe,EAAE,CAAC;CAC1B,CAAC"}
+{"version":3,"file":"prop-types.d.ts","sourceRoot":"","sources":["../../../src/molecule/review-header-steps/prop-types.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,YAAY,CAAC;AAEnC,OAAsC,EAAC,eAAe,EAAC,MAAM,8BAA8B,CAAC;AAE5F,QAAA,MAAM,SAAS;;;;;;;CAEd,CAAC;AAEF,eAAe,SAAS,CAAC;AAEzB,oBAAY,sBAAsB,GAAG;IACnC,KAAK,EAAE,eAAe,EAAE,CAAC;CAC1B,CAAC"}

package/lib/molecule/review-header-steps/style.css

@@ -3,4 +3,9 @@
   display: flex;
   align-items: center;
   justify-content: space-between;
-}
+}
+
+.statusItemContainer {
+  width: 32px;
+  height: 32px;
+}

package/lib/organism/list-item/index.d.ts

@@ -1,18 +1,24 @@
 export default ListItem;
-declare function ListItem(props: any): JSX.Element;
+declare function ListItem({ buttonLink, buttonLinkIcon, bulletPointMenuButton, tags, title, dataColumns, order, "aria-label": ariaLabel, contentType, isBulkStyle }: {
+    buttonLink: any;
+    buttonLinkIcon: any;
+    bulletPointMenuButton: any;
+    tags: any;
+    title: any;
+    dataColumns: any;
+    order: any;
+    "aria-label": any;
+    contentType: any;
+    isBulkStyle?: boolean | undefined;
+}): JSX.Element;
 declare namespace ListItem {
     const propTypes: {
-        bulletPointMenuButton: PropTypes.Requireable<PropTypes.InferProps<{
-            buttonAriaLabel: PropTypes.Requireable<string>;
-            menuAriaLabel: PropTypes.Requireable<string>;
-            buttons: PropTypes.Requireable<(PropTypes.InferProps<{
-                'data-name': PropTypes.Requireable<string>;
-                label: PropTypes.Requireable<string>;
-                type: PropTypes.Requireable<string>;
-                onClick: PropTypes.Requireable<(...args: any[]) => any>;
-            }> | null | undefined)[]>;
-            onClick: PropTypes.Requireable<(...args: any[]) => any>;
-        }>>;
+        title: PropTypes.Validator<string>;
+        dataColumns: PropTypes.Requireable<(PropTypes.InferProps<{
+            label: PropTypes.Requireable<string>;
+            type: PropTypes.Requireable<string>;
+            className: PropTypes.Requireable<string>;
+        }> | null | undefined)[]>;
         buttonLink: PropTypes.Requireable<PropTypes.InferProps<{
             type: PropTypes.Requireable<string>;
             label: PropTypes.Requireable<string>;
@@ -24,11 +30,36 @@ declare namespace ListItem {
             }>>;
             onClick: PropTypes.Requireable<(...args: any[]) => any>;
         }>>;
+        buttonLinkIcon: PropTypes.Requireable<PropTypes.InferProps<{
+            size: PropTypes.Requireable<string>;
+            'aria-label': PropTypes.Requireable<string>;
+            'data-name': PropTypes.Requireable<string>;
+            icon: PropTypes.Requireable<string>;
+            onClick: PropTypes.Requireable<(...args: any[]) => any>;
+            link: PropTypes.Requireable<PropTypes.InferProps<{
+                href: PropTypes.Requireable<string>;
+                download: PropTypes.Requireable<boolean>;
+                target: PropTypes.Requireable<string>;
+            }>>;
+            disabled: PropTypes.Requireable<boolean>;
+            className: PropTypes.Requireable<string>;
+        }>>;
+        bulletPointMenuButton: PropTypes.Requireable<PropTypes.InferProps<{
+            buttonAriaLabel: PropTypes.Requireable<string>;
+            menuAriaLabel: PropTypes.Requireable<string>;
+            buttons: PropTypes.Requireable<(PropTypes.InferProps<{
+                'data-name': PropTypes.Requireable<string>;
+                label: PropTypes.Requireable<string>;
+                type: PropTypes.Requireable<string>;
+                onClick: PropTypes.Requireable<(...args: any[]) => any>;
+            }> | null | undefined)[]>;
+            onClick: PropTypes.Requireable<(...args: any[]) => any>;
+        }>>;
         tags: PropTypes.Requireable<(PropTypes.InferProps<{
             label: PropTypes.Requireable<string>;
             type: PropTypes.Requireable<string>;
         }> | null | undefined)[]>;
-        title: PropTypes.Validator<string>;
+        isBulkStyle: PropTypes.Requireable<boolean>;
         order: PropTypes.Requireable<number>;
         'aria-label': PropTypes.Requireable<string>;
         contentType: PropTypes.Requireable<string>;

package/lib/organism/list-item/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/list-item/index.js"],"names":[],"mappings":";AAQA,mDA8CC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/list-item/index.js"],"names":[],"mappings":";AAWA;;;;;;;;;;;gBAgEC"}

package/lib/organism/list-item/index.js

@@ -9,70 +9,81 @@ var _react = _interopRequireDefault(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
+var _classnames = _interopRequireDefault(require("classnames"));
+
 var _tag = _interopRequireDefault(require("../../atom/tag"));
 
 var _buttonLink = _interopRequireDefault(require("../../atom/button-link"));
 
+var _buttonLinkIconOnly = _interopRequireDefault(require("../../atom/button-link-icon-only"));
+
 var _bulletPointMenuButton = _interopRequireDefault(require("../../molecule/bullet-point-menu-button"));
 
 var _style = _interopRequireDefault(require("./style.css"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-const ListItem = props => {
+// eslint-disable-next-line css-modules/no-unused-class
+const ListItem = ({
+  buttonLink,
+  buttonLinkIcon,
+  bulletPointMenuButton,
+  tags,
+  title,
+  dataColumns,
+  order,
+  'aria-label': ariaLabel,
+  contentType,
+  isBulkStyle = false
+}) => {
   let isPublished = false;
-  const {
-    bulletPointMenuButton,
-    buttonLink,
-    tags,
-    title,
-    order,
-    'aria-label': ariaLabel,
-    contentType
-  } = props;
 
   const tagsView = _map2.default.convert({
     cap: false
   })((tag, index) => {
-    isPublished = tag.type === 'published';
+    isPublished = tag.type === 'success';
     return /*#__PURE__*/_react.default.createElement("div", {
       key: index,
       className: _style.default.tag
     }, /*#__PURE__*/_react.default.createElement(_tag.default, tag));
   })(tags);
 
-  return /*#__PURE__*/_react.default.createElement("div", {
-    className: _style.default.wrapper
-  }, isPublished && contentType === 'certification' ? /*#__PURE__*/_react.default.createElement("div", {
-    className: _style.default.orderWrapper
-  }, order !== null && order !== undefined ? /*#__PURE__*/_react.default.createElement("div", {
+  const dataColumnsView = _map2.default.convert({
+    cap: false
+  })((dataColumn, index) => {
+    return /*#__PURE__*/_react.default.createElement("div", {
+      key: index,
+      className: _style.default[dataColumn.className]
+    }, dataColumn.type ? /*#__PURE__*/_react.default.createElement(_tag.default, dataColumn) : dataColumn.label);
+  })(dataColumns);
+
+  const orderView = order !== null && order !== undefined ? /*#__PURE__*/_react.default.createElement("div", {
     className: _style.default.order,
     "aria-label": ariaLabel
-  }, order + 1) : null, /*#__PURE__*/_react.default.createElement("div", {
-    className: _style.default.title,
-    title: title
-  }, title)) : /*#__PURE__*/_react.default.createElement("div", {
+  }, order + 1) : null;
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: (0, _classnames.default)(_style.default.wrapper, isBulkStyle && _style.default.gridLayout)
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.dataColumnsWrapper
+  }, isPublished && contentType === 'certification' ? orderView : null, /*#__PURE__*/_react.default.createElement("div", {
     className: _style.default.title,
     title: title
-  }, title), /*#__PURE__*/_react.default.createElement("div", {
+  }, title), dataColumnsView), /*#__PURE__*/_react.default.createElement("div", {
     className: _style.default.settings
-  }, tagsView, /*#__PURE__*/_react.default.createElement("div", {
-    className: _style.default.edit
-  }, /*#__PURE__*/_react.default.createElement(_buttonLink.default, buttonLink)), /*#__PURE__*/_react.default.createElement(_bulletPointMenuButton.default, bulletPointMenuButton)));
+  }, tagsView, buttonLink ? /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.buttonLink
+  }, /*#__PURE__*/_react.default.createElement(_buttonLink.default, buttonLink)) : null, buttonLinkIcon ? /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.buttonLink
+  }, /*#__PURE__*/_react.default.createElement(_buttonLinkIconOnly.default, buttonLinkIcon)) : null, /*#__PURE__*/_react.default.createElement(_bulletPointMenuButton.default, bulletPointMenuButton)));
 };
 
 ListItem.propTypes = process.env.NODE_ENV !== "production" ? {
-  bulletPointMenuButton: _propTypes.default.shape({
-    buttonAriaLabel: _propTypes.default.string,
-    menuAriaLabel: _propTypes.default.string,
-    buttons: _propTypes.default.arrayOf(_propTypes.default.shape({
-      'data-name': _propTypes.default.string,
-      label: _propTypes.default.string,
-      type: _propTypes.default.string,
-      onClick: _propTypes.default.func
-    })),
-    onClick: _propTypes.default.func
-  }),
+  title: _propTypes.default.string.isRequired,
+  dataColumns: _propTypes.default.arrayOf(_propTypes.default.shape({
+    label: _propTypes.default.string,
+    type: _propTypes.default.oneOf(['success', 'failure', 'warning', 'progress', 'default']),
+    className: _propTypes.default.oneOf(['cell', 'title'])
+  })),
   buttonLink: _propTypes.default.shape({
     type: _propTypes.default.string,
     label: _propTypes.default.string,
@@ -84,11 +95,36 @@ ListItem.propTypes = process.env.NODE_ENV !== "production" ? {
     }),
     onClick: _propTypes.default.func
   }),
+  buttonLinkIcon: _propTypes.default.shape({
+    size: _propTypes.default.oneOf(['default', 'small', 'responsive']),
+    'aria-label': _propTypes.default.string,
+    'data-name': _propTypes.default.string,
+    icon: _propTypes.default.string,
+    onClick: _propTypes.default.func,
+    link: _propTypes.default.shape({
+      href: _propTypes.default.string,
+      download: _propTypes.default.bool,
+      target: _propTypes.default.oneOf(['_self', '_blank', '_parent', '_top'])
+    }),
+    disabled: _propTypes.default.bool,
+    className: _propTypes.default.string
+  }),
+  bulletPointMenuButton: _propTypes.default.shape({
+    buttonAriaLabel: _propTypes.default.string,
+    menuAriaLabel: _propTypes.default.string,
+    buttons: _propTypes.default.arrayOf(_propTypes.default.shape({
+      'data-name': _propTypes.default.string,
+      label: _propTypes.default.string,
+      type: _propTypes.default.string,
+      onClick: _propTypes.default.func
+    })),
+    onClick: _propTypes.default.func
+  }),
   tags: _propTypes.default.arrayOf(_propTypes.default.shape({
     label: _propTypes.default.string,
-    type: _propTypes.default.oneOf(['published', 'draft', 'archived', 'revised', 'default'])
+    type: _propTypes.default.oneOf(['success', 'failure', 'warning', 'progress', 'default'])
   })),
-  title: _propTypes.default.string.isRequired,
+  isBulkStyle: _propTypes.default.bool,
   order: _propTypes.default.number,
   'aria-label': _propTypes.default.string,
   contentType: _propTypes.default.string,

package/lib/organism/list-item/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":["ListItem","props","isPublished","bulletPointMenuButton","buttonLink","tags","title","order","ariaLabel","contentType","tagsView","convert","cap","tag","index","type","style","wrapper","orderWrapper","undefined","settings","edit","propTypes","PropTypes","shape","buttonAriaLabel","string","menuAriaLabel","buttons","arrayOf","label","onClick","func","dataName","icon","position","oneOf","isRequired","number","id"],"sources":["../../../src/organism/list-item/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {map} from 'lodash/fp';\nimport Tag from '../../atom/tag';\nimport ButtonLink from '../../atom/button-link';\nimport BulletPointMenuButton from '../../molecule/bullet-point-menu-button';\nimport style from './style.css';\n\nconst ListItem = props => {\n  let isPublished = false;\n  const {\n    bulletPointMenuButton,\n    buttonLink,\n    tags,\n    title,\n    order,\n    'aria-label': ariaLabel,\n    contentType\n  } = props;\n  const tagsView = map.convert({cap: false})((tag, index) => {\n    isPublished = tag.type === 'published';\n    return (\n      <div key={index} className={style.tag}>\n        <Tag {...tag} />\n      </div>\n    );\n  })(tags);\n  return (\n    <div className={style.wrapper}>\n      {isPublished && contentType === 'certification' ? (\n        <div className={style.orderWrapper}>\n          {order !== null && order !== undefined ? (\n            <div className={style.order} aria-label={ariaLabel}>\n              {order + 1}\n            </div>\n          ) : null}\n          <div className={style.title} title={title}>\n            {title}\n          </div>\n        </div>\n      ) : (\n        <div className={style.title} title={title}>\n          {title}\n        </div>\n      )}\n      <div className={style.settings}>\n        {tagsView}\n        <div className={style.edit}>\n          <ButtonLink {...buttonLink} />\n        </div>\n        <BulletPointMenuButton {...bulletPointMenuButton} />\n      </div>\n    </div>\n  );\n};\n\nListItem.propTypes = {\n  bulletPointMenuButton: PropTypes.shape({\n    buttonAriaLabel: PropTypes.string,\n    menuAriaLabel: PropTypes.string,\n    buttons: PropTypes.arrayOf(\n      PropTypes.shape({\n        'data-name': PropTypes.string,\n        label: PropTypes.string,\n        type: PropTypes.string,\n        onClick: PropTypes.func\n      })\n    ),\n    onClick: PropTypes.func\n  }),\n  buttonLink: PropTypes.shape({\n    type: PropTypes.string,\n    label: PropTypes.string,\n    ariaLabel: PropTypes.string,\n    dataName: PropTypes.string,\n    icon: PropTypes.shape({\n      position: PropTypes.string,\n      type: PropTypes.string\n    }),\n    onClick: PropTypes.func\n  }),\n  tags: PropTypes.arrayOf(\n    PropTypes.shape({\n      label: PropTypes.string,\n      type: PropTypes.oneOf(['published', 'draft', 'archived', 'revised', 'default'])\n    })\n  ),\n  title: PropTypes.string.isRequired,\n  order: PropTypes.number,\n  'aria-label': PropTypes.string,\n  contentType: PropTypes.string,\n  id: PropTypes.string\n};\n\nexport default ListItem;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":["ListItem","buttonLink","buttonLinkIcon","bulletPointMenuButton","tags","title","dataColumns","order","ariaLabel","contentType","isBulkStyle","isPublished","tagsView","convert","cap","tag","index","type","style","dataColumnsView","dataColumn","className","label","orderView","undefined","classnames","wrapper","gridLayout","dataColumnsWrapper","settings","propTypes","PropTypes","string","isRequired","arrayOf","shape","oneOf","dataName","icon","position","onClick","func","size","link","href","download","bool","target","disabled","buttonAriaLabel","menuAriaLabel","buttons","number","id"],"sources":["../../../src/organism/list-item/index.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport {map} from 'lodash/fp';\nimport classnames from 'classnames';\nimport Tag from '../../atom/tag';\nimport ButtonLink from '../../atom/button-link';\nimport ButtonLinkIconOnly from '../../atom/button-link-icon-only';\nimport BulletPointMenuButton from '../../molecule/bullet-point-menu-button';\n// eslint-disable-next-line css-modules/no-unused-class\nimport style from './style.css';\n\nconst ListItem = ({\n  buttonLink,\n  buttonLinkIcon,\n  bulletPointMenuButton,\n  tags,\n  title,\n  dataColumns,\n  order,\n  'aria-label': ariaLabel,\n  contentType,\n  isBulkStyle = false\n}) => {\n  let isPublished = false;\n\n  const tagsView = map.convert({cap: false})((tag, index) => {\n    isPublished = tag.type === 'success';\n    return (\n      <div key={index} className={style.tag}>\n        <Tag {...tag} />\n      </div>\n    );\n  })(tags);\n\n  const dataColumnsView = map.convert({cap: false})((dataColumn, index) => {\n    return (\n      <div key={index} className={style[dataColumn.className]}>\n        {dataColumn.type ? <Tag {...dataColumn} /> : dataColumn.label}\n      </div>\n    );\n  })(dataColumns);\n\n  const orderView =\n    order !== null && order !== undefined ? (\n      <div className={style.order} aria-label={ariaLabel}>\n        {order + 1}\n      </div>\n    ) : null;\n\n  return (\n    <div className={classnames(style.wrapper, isBulkStyle && style.gridLayout)}>\n      <div className={style.dataColumnsWrapper}>\n        {isPublished && contentType === 'certification' ? orderView : null}\n        <div className={style.title} title={title}>\n          {title}\n        </div>\n        {dataColumnsView}\n      </div>\n\n      <div className={style.settings}>\n        {tagsView}\n        {buttonLink ? (\n          <div className={style.buttonLink}>\n            <ButtonLink {...buttonLink} />\n          </div>\n        ) : null}\n        {buttonLinkIcon ? (\n          <div className={style.buttonLink}>\n            <ButtonLinkIconOnly {...buttonLinkIcon} />\n          </div>\n        ) : null}\n        <BulletPointMenuButton {...bulletPointMenuButton} />\n      </div>\n    </div>\n  );\n};\n\nListItem.propTypes = {\n  title: PropTypes.string.isRequired,\n  dataColumns: PropTypes.arrayOf(\n    PropTypes.shape({\n      label: PropTypes.string,\n      type: PropTypes.oneOf(['success', 'failure', 'warning', 'progress', 'default']),\n      className: PropTypes.oneOf(['cell', 'title'])\n    })\n  ),\n  buttonLink: PropTypes.shape({\n    type: PropTypes.string,\n    label: PropTypes.string,\n    ariaLabel: PropTypes.string,\n    dataName: PropTypes.string,\n    icon: PropTypes.shape({\n      position: PropTypes.string,\n      type: PropTypes.string\n    }),\n    onClick: PropTypes.func\n  }),\n  buttonLinkIcon: PropTypes.shape({\n    size: PropTypes.oneOf(['default', 'small', 'responsive']),\n    'aria-label': PropTypes.string,\n    'data-name': PropTypes.string,\n    icon: PropTypes.string,\n    onClick: PropTypes.func,\n    link: PropTypes.shape({\n      href: PropTypes.string,\n      download: PropTypes.bool,\n      target: PropTypes.oneOf(['_self', '_blank', '_parent', '_top'])\n    }),\n    disabled: PropTypes.bool,\n    className: PropTypes.string\n  }),\n  bulletPointMenuButton: PropTypes.shape({\n    buttonAriaLabel: PropTypes.string,\n    menuAriaLabel: PropTypes.string,\n    buttons: PropTypes.arrayOf(\n      PropTypes.shape({\n        'data-name': PropTypes.string,\n        label: PropTypes.string,\n        type: PropTypes.string,\n        onClick: PropTypes.func\n      })\n    ),\n    onClick: PropTypes.func\n  }),\n  tags: PropTypes.arrayOf(\n    PropTypes.shape({\n      label: PropTypes.string,\n      type: PropTypes.oneOf(['success', 'failure', 'warning', 'progress', 'default'])\n    })\n  ),\n  isBulkStyle: PropTypes.bool,\n  order: PropTypes.number,\n  'aria-label': PropTypes.string,\n  contentType: PropTypes.string,\n  id: PropTypes.string\n};\n\nexport default ListItem;\n"],"mappings":"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"}

package/lib/organism/list-item/style.css

@@ -5,6 +5,7 @@
 @value cm_grey_900 from colors;
 @value primaryAdd1 from colors;
 @value cm_grey_400 from colors;
+@value cm_grey_500 from colors;
 
 .wrapper {
   align-items: center;
@@ -16,11 +17,22 @@
   justify-content: space-between;
   padding: 0 24px;
   width: 100%;
+  gap: 24px;
+}
+
+.gridLayout {
+  display: grid;
+  grid-template-columns: 70% auto; 
 }
 
 .title {
   color: cm_grey_900;
   flex-grow: 0;
+  display: flex;
+  height: 56px;
+  align-items: center;
+  gap: 16px;
+  flex: 1 0 0;
   font-family: Gilroy;
   font-size: 16px;
   font-stretch: normal;
@@ -28,12 +40,10 @@
   font-weight: bold;
   line-height: 1.38;
   letter-spacing: normal;
-  margin-right: 24px;
   overflow: hidden;
   text-align: left;
   text-overflow: ellipsis;
   white-space: nowrap;
-
 }
 
 .settings {
@@ -47,10 +57,23 @@
   text-overflow: ellipsis;
   white-space: nowrap;
 }
+.cell {
+  display: flex;
+  height: 56px;
+  align-items: center;
+  gap: 16px;
+  flex: 1 0 0;
+  color: cm_grey_500;
+  font-family: Gilroy;
+  font-size: 14px;
+  font-style: normal;
+  font-weight: 600;
+  line-height: 20px;
+  white-space: nowrap;
+}
 
-.edit {
+.buttonLink {
   margin: 0 16px 0 0;
-  min-width: 93px;
 }
 
 .order {
@@ -65,7 +88,7 @@
   margin: 0 16px 0 0;
 }
 
-.orderWrapper {
+.dataColumnsWrapper {
   align-items: center;
   display: flex;
   width: 100%;

package/lib/organism/list-items/index.d.ts

@@ -49,17 +49,12 @@ declare namespace ListItems {
         }>>;
         content: PropTypes.Requireable<NonNullable<PropTypes.InferProps<{
             items: PropTypes.Requireable<(PropTypes.InferProps<{
-                bulletPointMenuButton: PropTypes.Requireable<PropTypes.InferProps<{
-                    buttonAriaLabel: PropTypes.Requireable<string>;
-                    menuAriaLabel: PropTypes.Requireable<string>;
-                    buttons: PropTypes.Requireable<(PropTypes.InferProps<{
-                        'data-name': PropTypes.Requireable<string>;
-                        label: PropTypes.Requireable<string>;
-                        type: PropTypes.Requireable<string>;
-                        onClick: PropTypes.Requireable<(...args: any[]) => any>;
-                    }> | null | undefined)[]>;
-                    onClick: PropTypes.Requireable<(...args: any[]) => any>;
-                }>>;
+                title: PropTypes.Validator<string>;
+                dataColumns: PropTypes.Requireable<(PropTypes.InferProps<{
+                    label: PropTypes.Requireable<string>;
+                    type: PropTypes.Requireable<string>;
+                    className: PropTypes.Requireable<string>;
+                }> | null | undefined)[]>;
                 buttonLink: PropTypes.Requireable<PropTypes.InferProps<{
                     type: PropTypes.Requireable<string>;
                     label: PropTypes.Requireable<string>;
@@ -71,11 +66,36 @@ declare namespace ListItems {
                     }>>;
                     onClick: PropTypes.Requireable<(...args: any[]) => any>;
                 }>>;
+                buttonLinkIcon: PropTypes.Requireable<PropTypes.InferProps<{
+                    size: PropTypes.Requireable<string>;
+                    'aria-label': PropTypes.Requireable<string>;
+                    'data-name': PropTypes.Requireable<string>;
+                    icon: PropTypes.Requireable<string>;
+                    onClick: PropTypes.Requireable<(...args: any[]) => any>;
+                    link: PropTypes.Requireable<PropTypes.InferProps<{
+                        href: PropTypes.Requireable<string>;
+                        download: PropTypes.Requireable<boolean>;
+                        target: PropTypes.Requireable<string>;
+                    }>>;
+                    disabled: PropTypes.Requireable<boolean>;
+                    className: PropTypes.Requireable<string>;
+                }>>;
+                bulletPointMenuButton: PropTypes.Requireable<PropTypes.InferProps<{
+                    buttonAriaLabel: PropTypes.Requireable<string>;
+                    menuAriaLabel: PropTypes.Requireable<string>;
+                    buttons: PropTypes.Requireable<(PropTypes.InferProps<{
+                        'data-name': PropTypes.Requireable<string>;
+                        label: PropTypes.Requireable<string>;
+                        type: PropTypes.Requireable<string>;
+                        onClick: PropTypes.Requireable<(...args: any[]) => any>;
+                    }> | null | undefined)[]>;
+                    onClick: PropTypes.Requireable<(...args: any[]) => any>;
+                }>>;
                 tags: PropTypes.Requireable<(PropTypes.InferProps<{
                     label: PropTypes.Requireable<string>;
                     type: PropTypes.Requireable<string>;
                 }> | null | undefined)[]>;
-                title: PropTypes.Validator<string>;
+                isBulkStyle: PropTypes.Requireable<boolean>;
                 order: PropTypes.Requireable<number>;
                 'aria-label': PropTypes.Requireable<string>;
                 contentType: PropTypes.Requireable<string>;
@@ -85,6 +105,7 @@ declare namespace ListItems {
             itemType: PropTypes.Requireable<string>;
             onDrop: PropTypes.Requireable<(...args: any[]) => any>;
             isDraggable: PropTypes.Requireable<boolean>;
+            tableHeader: PropTypes.Requireable<(string | null | undefined)[]>;
         }> | PropTypes.InferProps<{
             type: PropTypes.Requireable<string>;
             columns: PropTypes.Requireable<(PropTypes.InferProps<{
@@ -94,6 +115,7 @@ declare namespace ListItems {
                 fields: PropTypes.Requireable<(NonNullable<string | PropTypes.InferProps<{
                     type: PropTypes.Requireable<string>;
                     current: PropTypes.Requireable<boolean>;
+                    selected: PropTypes.Requireable<boolean>;
                     icon: PropTypes.Requireable<string>;
                     value: PropTypes.Requireable<string>;
                 }> | null | undefined> | null | undefined)[]>;
@@ -156,6 +178,8 @@ declare namespace ListItems {
                 isBulkMenu: PropTypes.Requireable<boolean>;
             }> | null | undefined>>;
             isNestedTable: PropTypes.Requireable<boolean>;
+            emptyStateFirstMessage: PropTypes.Requireable<string>;
+            emptyStateSecondMessage: PropTypes.Requireable<string>;
         }> | null | undefined>>;
         title: PropTypes.Requireable<string>;
     };

package/lib/organism/list-items/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/list-items/index.js"],"names":[],"mappings":";AA8CA;;;;;;gBAwBC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/organism/list-items/index.js"],"names":[],"mappings":";AAoEA;;;;;;gBAwBC"}

package/lib/organism/list-items/index.js

@@ -7,6 +7,10 @@ var _react = _interopRequireDefault(require("react"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
+var _isNil = _interopRequireDefault(require("lodash/fp/isNil"));
+
+var _isEmpty = _interopRequireDefault(require("lodash/fp/isEmpty"));
+
 var _listItem = _interopRequireDefault(require("../list-item"));
 
 var _draggableList = _interopRequireDefault(require("../../molecule/draggable-list"));
@@ -30,7 +34,8 @@ const buildListItemsView = (content, ariaLabel, selectMultiple) => {
     items,
     itemType,
     onDrop,
-    isDraggable = false
+    isDraggable = false,
+    tableHeader
   } = content;
   const itemsView = isDraggable && items.length > 1 ? /*#__PURE__*/_react.default.createElement(_draggableList.default, {
     items: items.map(item => _extends({}, item, {
@@ -46,11 +51,22 @@ const buildListItemsView = (content, ariaLabel, selectMultiple) => {
     order: null,
     contentType: itemType
   }))));
-  return /*#__PURE__*/_react.default.createElement("ul", {
+  const tableHeaderView = !(0, _isNil.default)(tableHeader) && !(0, _isEmpty.default)(tableHeader) ? /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.tableHeaderWrapper
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.dataColumnsWrapper
+  }, tableHeader.map((tableHeaderItem, index) => /*#__PURE__*/_react.default.createElement("div", {
+    key: `tableHeadeColumn-key-${index}`,
+    className: _style.default.tableHeaderItem,
+    "data-name": `tableHeader-${index}`
+  }, tableHeaderItem))), /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.settings
+  }, '')) : null;
+  return /*#__PURE__*/_react.default.createElement("div", null, tableHeaderView, /*#__PURE__*/_react.default.createElement("ul", {
     className: !selectMultiple ? _style.default.list : _style.default.listWithSelectMultiple,
     "aria-label": ariaLabel,
     "data-name": 'content-list'
-  }, itemsView);
+  }, itemsView));
 };
 
 const buildContentView = (content, ariaLabel, selectMultiple) => {
@@ -101,7 +117,8 @@ ListItems.propTypes = process.env.NODE_ENV !== "production" ? {
     type: _propTypes.default.oneOf(['list']),
     itemType: _propTypes.default.string,
     onDrop: _propTypes.default.func,
-    isDraggable: _propTypes.default.bool
+    isDraggable: _propTypes.default.bool,
+    tableHeader: _propTypes.default.arrayOf(_propTypes.default.string)
   }), _propTypes.default.shape(_extends({}, _expandibleActionableTable.default.propTypes, {
     type: _propTypes.default.oneOf(['expandible-actionable-table'])
   }))]),