@elliemae/ds-legacy-datagrids 1.0.0-rc.1

package/dist/esm/DataGridImpl.js

@@ -0,0 +1,126 @@
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { isFunction, useDataGrid } from "@elliemae/ds-legacy-shared";
+import { Table } from "./components/Table.js";
+import { TableBody } from "./components/TableBody.js";
+import { TableHeader } from "./components/TableHeader.js";
+import { defaultRenderers, renderRowsLoader } from "./components/renderers/index.js";
+import { DatagridWrapper } from "./components/renderers/defaultClassedRenderers.js";
+import { addOptionalFooterComponents } from "./components/footer/addOptionalFooterComponents.js";
+import { addOptionalHeaderComponents } from "./components/header/addOptionalHeaderComponents.js";
+import { EmptyState } from "./components/EmptyState.js";
+import { getPluginsFromProps } from "./utilities/getPluginsFromProps.js";
+import { defaultPlugins } from "./defaultPlugins.js";
+import { normalizeRows } from "./utilities/normalizeData.js";
+const isFluid = ({ autoHeight, paginated, numRowsVisible }) => {
+  if (autoHeight)
+    return false;
+  if (paginated)
+    return false;
+  return !numRowsVisible;
+};
+const DataGridImpl = ({
+  className,
+  renderers,
+  columns,
+  rows,
+  containerProps,
+  plugins: pluginsProp,
+  normalizeDataKeys,
+  ...otherProps
+}) => {
+  const {
+    noResultsPlaceholder = /* @__PURE__ */ jsx(EmptyState, {}),
+    noColumnsPlaceholder = "Please select one of more columns in order for data to be displayed.",
+    noResultsRender,
+    paginated,
+    height,
+    showHeader,
+    showRowsLoader,
+    rowsLoaderRenderer = renderRowsLoader,
+    groupedRows,
+    sortable,
+    rowSize,
+    wrapText,
+    onDefaultFiltersLoad,
+    rowKey
+  } = otherProps;
+  const idKey = rowKey || "id";
+  const rowsIdsSet = /* @__PURE__ */ new Set();
+  const rowsIds = rows.map((row) => {
+    if (row[idKey] === void 0)
+      throw new Error("Missing id: each row must have an unique id");
+    rowsIdsSet.add(row[idKey]);
+    return row[idKey];
+  });
+  if (rowsIds.length !== rowsIdsSet.size)
+    throw new Error("Repeated id: each row must have an unique id");
+  const plugins = getPluginsFromProps({
+    ...otherProps,
+    virtualized: (!paginated || groupedRows) && !wrapText,
+    paginated: paginated && !groupedRows || wrapText,
+    sortable: sortable && !groupedRows
+  });
+  if (normalizeDataKeys) {
+    normalizeRows(rows);
+  }
+  const grid = useDataGrid({
+    columns,
+    rows,
+    renderers: defaultRenderers,
+    plugins: [...plugins, ...pluginsProp, ...defaultPlugins],
+    ...otherProps
+  });
+  const noColumnsVisible = useMemo(() => {
+    const visibleUserColumns = grid.columns.filter((column) => column.visible || typeof column.visible === "undefined");
+    return visibleUserColumns.length === 0;
+  }, [grid.columns]);
+  const bodyPlaceholder = useMemo(() => {
+    if (noColumnsVisible) {
+      return noColumnsPlaceholder;
+    }
+    return isFunction(noResultsRender) ? noResultsRender() : noResultsPlaceholder;
+  }, [noResultsPlaceholder, noColumnsPlaceholder, noColumnsVisible]);
+  const { pagination } = otherProps;
+  const conditionalPagination = pagination && pagination.conditionalPagination === true && rows.length <= otherProps.pagination.perPage;
+  const usePagination = paginated && !conditionalPagination;
+  return /* @__PURE__ */ jsxs(
+    DatagridWrapper,
+    {
+      className: `${className} ds-row-size-${rowSize}`,
+      classProps: {
+        fluidHeight: isFluid({
+          autoHeight: otherProps.autoHeight,
+          numRowsVisible: otherProps.numRowsVisible,
+          paginated: usePagination
+        })
+      },
+      style: { height },
+      ...containerProps,
+      children: [
+        addOptionalHeaderComponents({ grid }),
+        /* @__PURE__ */ jsxs(Table, { ...grid, onDefaultFiltersLoad, children: [
+          showHeader && /* @__PURE__ */ jsx(TableHeader, {}),
+          showRowsLoader ? rowsLoaderRenderer() : /* @__PURE__ */ jsx(
+            TableBody,
+            {
+              isPlaceholderActive: noColumnsVisible || grid.composedRows.rows && grid.composedRows.rows.length === 0 || grid.composedRows.length === 0,
+              noResultsPlaceholder: bodyPlaceholder
+            }
+          )
+        ] }),
+        addOptionalFooterComponents({
+          grid,
+          rows: grid.composedRows
+        })
+      ]
+    }
+  );
+};
+var DataGridImpl_default = DataGridImpl;
+export {
+  DataGridImpl,
+  DataGridImpl_default as default
+};
+//# sourceMappingURL=DataGridImpl.js.map

package/dist/esm/DataGridImpl.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/DataGridImpl.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useMemo } from 'react';\nimport { isFunction, useDataGrid } from '@elliemae/ds-legacy-shared';\nimport { Table } from './components/Table.js';\nimport { TableBody } from './components/TableBody.js';\nimport { TableHeader } from './components/TableHeader.js';\nimport { defaultRenderers, renderRowsLoader } from './components/renderers/index.js';\nimport { DatagridWrapper } from './components/renderers/defaultClassedRenderers.js';\nimport { addOptionalFooterComponents } from './components/footer/addOptionalFooterComponents.js';\nimport { addOptionalHeaderComponents } from './components/header/addOptionalHeaderComponents.js';\nimport { EmptyState } from './components/EmptyState.js';\nimport { getPluginsFromProps } from './utilities/getPluginsFromProps.js';\nimport { defaultPlugins } from './defaultPlugins.js';\nimport { normalizeRows } from './utilities/normalizeData.js';\n\nconst isFluid = ({ autoHeight, paginated, numRowsVisible }) => {\n  if (autoHeight) return false;\n  if (paginated) return false;\n  return !numRowsVisible;\n};\n\nconst DataGridImpl = ({\n  className,\n  renderers,\n  columns,\n  rows,\n  containerProps,\n  plugins: pluginsProp,\n  normalizeDataKeys,\n  ...otherProps\n}) => {\n  const {\n    noResultsPlaceholder = <EmptyState />,\n    noColumnsPlaceholder = 'Please select one of more columns in order for data to be displayed.',\n    noResultsRender,\n    paginated,\n    height,\n    showHeader,\n    showRowsLoader,\n    rowsLoaderRenderer = renderRowsLoader,\n    groupedRows,\n    sortable,\n    rowSize,\n    wrapText,\n    onDefaultFiltersLoad,\n    rowKey,\n  } = otherProps;\n\n  const idKey = rowKey || 'id';\n  const rowsIdsSet = new Set();\n  const rowsIds = rows.map((row) => {\n    if (row[idKey] === undefined) throw new Error('Missing id: each row must have an unique id');\n    rowsIdsSet.add(row[idKey]);\n    return row[idKey];\n  });\n  if (rowsIds.length !== rowsIdsSet.size) throw new Error('Repeated id: each row must have an unique id');\n\n  const plugins = getPluginsFromProps({\n    ...otherProps,\n    virtualized: (!paginated || groupedRows) && !wrapText,\n    paginated: (paginated && !groupedRows) || wrapText,\n    sortable: sortable && !groupedRows,\n  });\n\n  if (normalizeDataKeys) {\n    normalizeRows(rows);\n  }\n\n  const grid = useDataGrid({\n    columns,\n    rows,\n    renderers: defaultRenderers,\n    plugins: [...plugins, ...pluginsProp, ...defaultPlugins],\n    ...otherProps,\n  });\n\n  const noColumnsVisible = useMemo(() => {\n    const visibleUserColumns = grid.columns.filter((column) => column.visible || typeof column.visible === 'undefined');\n    return visibleUserColumns.length === 0;\n  }, [grid.columns]);\n\n  const bodyPlaceholder = useMemo(() => {\n    if (noColumnsVisible) {\n      return noColumnsPlaceholder;\n    }\n    return isFunction(noResultsRender) ? noResultsRender() : noResultsPlaceholder;\n  }, [noResultsPlaceholder, noColumnsPlaceholder, noColumnsVisible]);\n\n  const { pagination } = otherProps;\n  const conditionalPagination =\n    pagination && pagination.conditionalPagination === true && rows.length <= otherProps.pagination.perPage;\n  const usePagination = paginated && !conditionalPagination;\n  return (\n    <DatagridWrapper\n      className={`${className} ds-row-size-${rowSize}`}\n      classProps={{\n        fluidHeight: isFluid({\n          autoHeight: otherProps.autoHeight,\n          numRowsVisible: otherProps.numRowsVisible,\n          paginated: usePagination,\n        }),\n      }}\n      style={{ height }}\n      {...containerProps}\n    >\n      {addOptionalHeaderComponents({ grid })}\n      <Table {...grid} onDefaultFiltersLoad={onDefaultFiltersLoad}>\n        {showHeader && <TableHeader />}\n        {showRowsLoader ? (\n          rowsLoaderRenderer()\n        ) : (\n          <TableBody\n            isPlaceholderActive={\n              noColumnsVisible ||\n              (grid.composedRows.rows && grid.composedRows.rows.length === 0) ||\n              grid.composedRows.length === 0\n            }\n            noResultsPlaceholder={bodyPlaceholder}\n          />\n        )}\n      </Table>\n      {addOptionalFooterComponents({\n        grid,\n        rows: grid.composedRows,\n      })}\n    </DatagridWrapper>\n  );\n};\n\nexport { DataGridImpl };\n\nexport default DataGridImpl;\n"],
+  "mappings": "AAAA,YAAY,WAAW;AC+BI,cA0ErB,YA1EqB;AA/B3B,SAAgB,eAAe;AAC/B,SAAS,YAAY,mBAAmB;AACxC,SAAS,aAAa;AACtB,SAAS,iBAAiB;AAC1B,SAAS,mBAAmB;AAC5B,SAAS,kBAAkB,wBAAwB;AACnD,SAAS,uBAAuB;AAChC,SAAS,mCAAmC;AAC5C,SAAS,mCAAmC;AAC5C,SAAS,kBAAkB;AAC3B,SAAS,2BAA2B;AACpC,SAAS,sBAAsB;AAC/B,SAAS,qBAAqB;AAE9B,MAAM,UAAU,CAAC,EAAE,YAAY,WAAW,eAAe,MAAM;AAC7D,MAAI;AAAY,WAAO;AACvB,MAAI;AAAW,WAAO;AACtB,SAAO,CAAC;AACV;AAEA,MAAM,eAAe,CAAC;AAAA,EACpB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,SAAS;AAAA,EACT;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM;AAAA,IACJ,uBAAuB,oBAAC,cAAW;AAAA,IACnC,uBAAuB;AAAA,IACvB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,qBAAqB;AAAA,IACrB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,QAAQ,UAAU;AACxB,QAAM,aAAa,oBAAI,IAAI;AAC3B,QAAM,UAAU,KAAK,IAAI,CAAC,QAAQ;AAChC,QAAI,IAAI,KAAK,MAAM;AAAW,YAAM,IAAI,MAAM,6CAA6C;AAC3F,eAAW,IAAI,IAAI,KAAK,CAAC;AACzB,WAAO,IAAI,KAAK;AAAA,EAClB,CAAC;AACD,MAAI,QAAQ,WAAW,WAAW;AAAM,UAAM,IAAI,MAAM,8CAA8C;AAEtG,QAAM,UAAU,oBAAoB;AAAA,IAClC,GAAG;AAAA,IACH,cAAc,CAAC,aAAa,gBAAgB,CAAC;AAAA,IAC7C,WAAY,aAAa,CAAC,eAAgB;AAAA,IAC1C,UAAU,YAAY,CAAC;AAAA,EACzB,CAAC;AAED,MAAI,mBAAmB;AACrB,kBAAc,IAAI;AAAA,EACpB;AAEA,QAAM,OAAO,YAAY;AAAA,IACvB;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX,SAAS,CAAC,GAAG,SAAS,GAAG,aAAa,GAAG,cAAc;AAAA,IACvD,GAAG;AAAA,EACL,CAAC;AAED,QAAM,mBAAmB,QAAQ,MAAM;AACrC,UAAM,qBAAqB,KAAK,QAAQ,OAAO,CAAC,WAAW,OAAO,WAAW,OAAO,OAAO,YAAY,WAAW;AAClH,WAAO,mBAAmB,WAAW;AAAA,EACvC,GAAG,CAAC,KAAK,OAAO,CAAC;AAEjB,QAAM,kBAAkB,QAAQ,MAAM;AACpC,QAAI,kBAAkB;AACpB,aAAO;AAAA,IACT;AACA,WAAO,WAAW,eAAe,IAAI,gBAAgB,IAAI;AAAA,EAC3D,GAAG,CAAC,sBAAsB,sBAAsB,gBAAgB,CAAC;AAEjE,QAAM,EAAE,WAAW,IAAI;AACvB,QAAM,wBACJ,cAAc,WAAW,0BAA0B,QAAQ,KAAK,UAAU,WAAW,WAAW;AAClG,QAAM,gBAAgB,aAAa,CAAC;AACpC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,GAAG,yBAAyB;AAAA,MACvC,YAAY;AAAA,QACV,aAAa,QAAQ;AAAA,UACnB,YAAY,WAAW;AAAA,UACvB,gBAAgB,WAAW;AAAA,UAC3B,WAAW;AAAA,QACb,CAAC;AAAA,MACH;AAAA,MACA,OAAO,EAAE,OAAO;AAAA,MACf,GAAG;AAAA,MAEH;AAAA,oCAA4B,EAAE,KAAK,CAAC;AAAA,QACrC,qBAAC,SAAO,GAAG,MAAM,sBACd;AAAA,wBAAc,oBAAC,eAAY;AAAA,UAC3B,iBACC,mBAAmB,IAEnB;AAAA,YAAC;AAAA;AAAA,cACC,qBACE,oBACC,KAAK,aAAa,QAAQ,KAAK,aAAa,KAAK,WAAW,KAC7D,KAAK,aAAa,WAAW;AAAA,cAE/B,sBAAsB;AAAA;AAAA,UACxB;AAAA,WAEJ;AAAA,QACC,4BAA4B;AAAA,UAC3B;AAAA,UACA,MAAM,KAAK;AAAA,QACb,CAAC;AAAA;AAAA;AAAA,EACH;AAEJ;AAIA,IAAO,uBAAQ;",
+  "names": []
+}

package/dist/esm/PaginatedDataGrid.js

@@ -0,0 +1,54 @@
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useDataGrid } from "@elliemae/ds-legacy-shared";
+import { Table } from "./components/Table.js";
+import { defaultRenderers, renderRowsLoader } from "./components/renderers/index.js";
+import { DatagridWrapper } from "./components/renderers/defaultClassedRenderers.js";
+import { addOptionalHeaderComponents } from "./components/header/addOptionalHeaderComponents.js";
+import { getPluginsFromProps } from "./utilities/getPluginsFromProps.js";
+import { Pagination } from "./plugins/pagination/components/Pagination.js";
+const PaginatedDataGrid = ({
+  columns,
+  rows,
+  showRowsLoader,
+  noResultsPlaceholder,
+  rowsLoaderRenderer = renderRowsLoader,
+  maxPerPage,
+  minPerPage,
+  onPageSelect,
+  onPerPage,
+  pagination,
+  ...otherProps
+}) => {
+  const plugins = getPluginsFromProps(otherProps, { infiniteScrolling: true });
+  const grid = useDataGrid({
+    ...otherProps,
+    columns,
+    rows,
+    renderers: defaultRenderers,
+    plugins
+  });
+  return /* @__PURE__ */ jsxs(DatagridWrapper, { children: [
+    addOptionalHeaderComponents({ grid }),
+    /* @__PURE__ */ jsxs(Table, { ...grid, children: [
+      /* @__PURE__ */ jsx(Table.Header, {}),
+      showRowsLoader ? rowsLoaderRenderer() : /* @__PURE__ */ jsx(Table.Body, { rows: grid.composedRows.rows || grid.composedRows })
+    ] }),
+    /* @__PURE__ */ jsx(
+      Pagination,
+      {
+        maxPerPage,
+        minPerPage,
+        onPageSelect,
+        onPerPage,
+        paginated: rows,
+        pagination
+      }
+    )
+  ] });
+};
+var PaginatedDataGrid_default = PaginatedDataGrid;
+export {
+  PaginatedDataGrid_default as default
+};
+//# sourceMappingURL=PaginatedDataGrid.js.map

package/dist/esm/PaginatedDataGrid.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/PaginatedDataGrid.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { useDataGrid } from '@elliemae/ds-legacy-shared';\nimport { Table } from './components/Table.js';\nimport { defaultRenderers, renderRowsLoader } from './components/renderers/index.js';\nimport { DatagridWrapper } from './components/renderers/defaultClassedRenderers.js';\nimport { addOptionalHeaderComponents } from './components/header/addOptionalHeaderComponents.js';\nimport { getPluginsFromProps } from './utilities/getPluginsFromProps.js';\nimport { Pagination } from './plugins/pagination/components/Pagination.js';\n\nconst PaginatedDataGrid = ({\n  columns,\n  rows,\n  showRowsLoader,\n  noResultsPlaceholder,\n  rowsLoaderRenderer = renderRowsLoader,\n  maxPerPage,\n  minPerPage,\n  onPageSelect,\n  onPerPage,\n  pagination,\n  ...otherProps\n}) => {\n  const plugins = getPluginsFromProps(otherProps, { infiniteScrolling: true });\n  const grid = useDataGrid({\n    ...otherProps,\n    columns,\n    rows,\n    renderers: defaultRenderers,\n    plugins,\n  });\n\n  return (\n    <DatagridWrapper>\n      {addOptionalHeaderComponents({ grid })}\n      <Table {...grid}>\n        <Table.Header />\n        {showRowsLoader ? rowsLoaderRenderer() : <Table.Body rows={grid.composedRows.rows || grid.composedRows} />}\n      </Table>\n      <Pagination\n        maxPerPage={maxPerPage}\n        minPerPage={minPerPage}\n        onPageSelect={onPageSelect}\n        onPerPage={onPerPage}\n        paginated={rows}\n        pagination={pagination}\n      />\n    </DatagridWrapper>\n  );\n};\n\nexport default PaginatedDataGrid;\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACkCjB,SACE,KADF;AAjCN,SAAS,mBAAmB;AAC5B,SAAS,aAAa;AACtB,SAAS,kBAAkB,wBAAwB;AACnD,SAAS,uBAAuB;AAChC,SAAS,mCAAmC;AAC5C,SAAS,2BAA2B;AACpC,SAAS,kBAAkB;AAE3B,MAAM,oBAAoB,CAAC;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,qBAAqB;AAAA,EACrB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,UAAU,oBAAoB,YAAY,EAAE,mBAAmB,KAAK,CAAC;AAC3E,QAAM,OAAO,YAAY;AAAA,IACvB,GAAG;AAAA,IACH;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX;AAAA,EACF,CAAC;AAED,SACE,qBAAC,mBACE;AAAA,gCAA4B,EAAE,KAAK,CAAC;AAAA,IACrC,qBAAC,SAAO,GAAG,MACT;AAAA,0BAAC,MAAM,QAAN,EAAa;AAAA,MACb,iBAAiB,mBAAmB,IAAI,oBAAC,MAAM,MAAN,EAAW,MAAM,KAAK,aAAa,QAAQ,KAAK,cAAc;AAAA,OAC1G;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,WAAW;AAAA,QACX;AAAA;AAAA,IACF;AAAA,KACF;AAEJ;AAEA,IAAO,4BAAQ;",
+  "names": []
+}

package/dist/esm/blockNames.js

@@ -0,0 +1,10 @@
+import * as React from "react";
+const dataGridBlockName = "data-grid";
+const headerBlockName = `${dataGridBlockName}-header`;
+const bodyBlockName = `${dataGridBlockName}-body`;
+export {
+  bodyBlockName,
+  dataGridBlockName,
+  headerBlockName
+};
+//# sourceMappingURL=blockNames.js.map

package/dist/esm/blockNames.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/blockNames.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "const dataGridBlockName = 'data-grid';\nconst headerBlockName = `${dataGridBlockName}-header`;\nconst bodyBlockName = `${dataGridBlockName}-body`;\n\nexport { dataGridBlockName, headerBlockName, bodyBlockName };\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAvB,MAAM,oBAAoB;AAC1B,MAAM,kBAAkB,GAAG;AAC3B,MAAM,gBAAgB,GAAG;",
+  "names": []
+}

package/dist/esm/columns/IconColumn.js

@@ -0,0 +1,79 @@
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import React2 from "react";
+import { cx } from "@elliemae/ds-legacy-utilities";
+import { DSButton } from "@elliemae/ds-legacy-button";
+import { aggregatedClasses } from "@elliemae/ds-legacy-classnames";
+const Intents = {
+  SUCCESS: "success",
+  INFO: "info",
+  DANGER: "danger",
+  WARNING: "warning"
+};
+const IntentIconColors = {
+  [Intents.SUCCESS]: ["success", 900],
+  [Intents.INFO]: ["brand-primary", 600],
+  [Intents.DANGER]: ["danger", 900],
+  [Intents.WARNING]: ["warning", 900]
+};
+const ValueWrapper = aggregatedClasses("span")("icon-column-cell");
+const addColorToIcon = (icon, intentColor) => {
+  if (icon.props.color) {
+    return icon;
+  }
+  return React2.cloneElement(icon, { color: intentColor });
+};
+const IconColumn = ({
+  property,
+  label,
+  headerIcon,
+  getRowIcon = () => null,
+  isVisited = () => null,
+  intent = Intents.SUCCESS,
+  width = 60,
+  onClick,
+  visible,
+  resizable,
+  sortable,
+  searchable
+}) => {
+  const formatter = (value, extraParams) => {
+    const icon = getRowIcon(value, extraParams);
+    const onClickHandler = (e) => onClick(e, extraParams);
+    return /* @__PURE__ */ jsxs(ValueWrapper, { className: cx(`icc-${intent}`, isVisited(value, extraParams)), children: [
+      icon && addColorToIcon(icon, IntentIconColors[intent]),
+      onClick && typeof value !== "undefined" ? /* @__PURE__ */ jsx(DSButton, { buttonType: "text", intent, labelText: value, onClick: onClickHandler }) : value
+    ] });
+  };
+  return {
+    property,
+    label,
+    headerStyle: {
+      justifyContent: "center"
+    },
+    header: {
+      formatters: [
+        () => /* @__PURE__ */ jsx("span", { children: React2.cloneElement(headerIcon, {
+          color: IntentIconColors[intent]
+        }) })
+      ]
+    },
+    cell: {
+      formatters: [formatter]
+    },
+    cellStyle: {
+      justifyContent: "center"
+    },
+    width,
+    visible: typeof visible === "undefined" || visible,
+    resizable,
+    sortable,
+    searchable
+  };
+};
+var IconColumn_default = IconColumn;
+export {
+  IconColumn,
+  IconColumn_default as default
+};
+//# sourceMappingURL=IconColumn.js.map

package/dist/esm/columns/IconColumn.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/columns/IconColumn.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/display-name */\nimport React from 'react';\nimport { cx } from '@elliemae/ds-legacy-utilities';\nimport { DSButton } from '@elliemae/ds-legacy-button';\nimport { aggregatedClasses } from '@elliemae/ds-legacy-classnames';\n\nconst Intents = {\n  SUCCESS: 'success',\n  INFO: 'info',\n  DANGER: 'danger',\n  WARNING: 'warning',\n};\n\nconst IntentIconColors = {\n  [Intents.SUCCESS]: ['success', 900],\n  [Intents.INFO]: ['brand-primary', 600],\n  [Intents.DANGER]: ['danger', 900],\n  [Intents.WARNING]: ['warning', 900],\n};\n\nconst ValueWrapper = aggregatedClasses('span')('icon-column-cell');\n\nconst addColorToIcon = (icon, intentColor) => {\n  if (icon.props.color) {\n    return icon;\n  }\n  return React.cloneElement(icon, { color: intentColor });\n};\n\nexport const IconColumn = ({\n  property,\n  label,\n  headerIcon,\n  getRowIcon = () => null,\n  isVisited = () => null,\n  intent = Intents.SUCCESS,\n  width = 60,\n  onClick,\n  visible,\n  resizable,\n  sortable,\n  searchable,\n}) => {\n  const formatter = (value, extraParams) => {\n    const icon = getRowIcon(value, extraParams);\n    const onClickHandler = (e) => onClick(e, extraParams);\n    return (\n      <ValueWrapper className={cx(`icc-${intent}`, isVisited(value, extraParams))}>\n        {icon && addColorToIcon(icon, IntentIconColors[intent])}\n        {onClick && typeof value !== 'undefined' ? (\n          <DSButton buttonType=\"text\" intent={intent} labelText={value} onClick={onClickHandler} />\n        ) : (\n          value\n        )}\n      </ValueWrapper>\n    );\n  };\n  return {\n    property,\n    label,\n    headerStyle: {\n      justifyContent: 'center',\n    },\n    header: {\n      formatters: [\n        () => (\n          <span>\n            {React.cloneElement(headerIcon, {\n              color: IntentIconColors[intent],\n            })}\n          </span>\n        ),\n      ],\n    },\n    cell: {\n      formatters: [formatter],\n    },\n    cellStyle: {\n      justifyContent: 'center',\n    },\n    width,\n    visible: typeof visible === 'undefined' || visible,\n    resizable,\n    sortable,\n    searchable,\n  };\n};\n\nexport default IconColumn;\n"],
+  "mappings": "AAAA,YAAY,WAAW;AC+CjB,SAGI,KAHJ;AA9CN,OAAOA,YAAW;AAClB,SAAS,UAAU;AACnB,SAAS,gBAAgB;AACzB,SAAS,yBAAyB;AAElC,MAAM,UAAU;AAAA,EACd,SAAS;AAAA,EACT,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,SAAS;AACX;AAEA,MAAM,mBAAmB;AAAA,EACvB,CAAC,QAAQ,OAAO,GAAG,CAAC,WAAW,GAAG;AAAA,EAClC,CAAC,QAAQ,IAAI,GAAG,CAAC,iBAAiB,GAAG;AAAA,EACrC,CAAC,QAAQ,MAAM,GAAG,CAAC,UAAU,GAAG;AAAA,EAChC,CAAC,QAAQ,OAAO,GAAG,CAAC,WAAW,GAAG;AACpC;AAEA,MAAM,eAAe,kBAAkB,MAAM,EAAE,kBAAkB;AAEjE,MAAM,iBAAiB,CAAC,MAAM,gBAAgB;AAC5C,MAAI,KAAK,MAAM,OAAO;AACpB,WAAO;AAAA,EACT;AACA,SAAOA,OAAM,aAAa,MAAM,EAAE,OAAO,YAAY,CAAC;AACxD;AAEO,MAAM,aAAa,CAAC;AAAA,EACzB;AAAA,EACA;AAAA,EACA;AAAA,EACA,aAAa,MAAM;AAAA,EACnB,YAAY,MAAM;AAAA,EAClB,SAAS,QAAQ;AAAA,EACjB,QAAQ;AAAA,EACR;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,YAAY,CAAC,OAAO,gBAAgB;AACxC,UAAM,OAAO,WAAW,OAAO,WAAW;AAC1C,UAAM,iBAAiB,CAAC,MAAM,QAAQ,GAAG,WAAW;AACpD,WACE,qBAAC,gBAAa,WAAW,GAAG,OAAO,UAAU,UAAU,OAAO,WAAW,CAAC,GACvE;AAAA,cAAQ,eAAe,MAAM,iBAAiB,MAAM,CAAC;AAAA,MACrD,WAAW,OAAO,UAAU,cAC3B,oBAAC,YAAS,YAAW,QAAO,QAAgB,WAAW,OAAO,SAAS,gBAAgB,IAEvF;AAAA,OAEJ;AAAA,EAEJ;AACA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA,aAAa;AAAA,MACX,gBAAgB;AAAA,IAClB;AAAA,IACA,QAAQ;AAAA,MACN,YAAY;AAAA,QACV,MACE,oBAAC,UACE,UAAAA,OAAM,aAAa,YAAY;AAAA,UAC9B,OAAO,iBAAiB,MAAM;AAAA,QAChC,CAAC,GACH;AAAA,MAEJ;AAAA,IACF;AAAA,IACA,MAAM;AAAA,MACJ,YAAY,CAAC,SAAS;AAAA,IACxB;AAAA,IACA,WAAW;AAAA,MACT,gBAAgB;AAAA,IAClB;AAAA,IACA;AAAA,IACA,SAAS,OAAO,YAAY,eAAe;AAAA,IAC3C;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;AAEA,IAAO,qBAAQ;",
+  "names": ["React"]
+}

package/dist/esm/columns/NumberColumn.js

@@ -0,0 +1,7 @@
+import * as React from "react";
+function createNumberColumn({ label, property }) {
+}
+export {
+  createNumberColumn as default
+};
+//# sourceMappingURL=NumberColumn.js.map

package/dist/esm/columns/NumberColumn.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/columns/NumberColumn.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export default function createNumberColumn({ label, property }) {}\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAR,SAAR,mBAAoC,EAAE,OAAO,SAAS,GAAG;AAAC;",
+  "names": []
+}

package/dist/esm/components/BodyCell.js

@@ -0,0 +1,84 @@
+import * as React from "react";
+import { jsx } from "react/jsx-runtime";
+import { useEffect, useContext, useRef, useCallback } from "react";
+import PropTypes from "prop-types";
+import { FocusGridContext, evaluateFormatters, evaluateTransforms } from "@elliemae/ds-legacy-shared";
+import { DSTruncatedTooltipText } from "@elliemae/ds-legacy-truncated-tooltip-text";
+const BodyCell = ({ component: Component, classProps, rowProps, column, columnIndex, rowIndex, grid }) => {
+  const { rowData, rowKey, isScrolling, ...extraRowProps } = rowProps;
+  const { property, cell, props } = column;
+  const evaluatedProperty = property || cell && cell.property;
+  const ref = useRef(null);
+  const { register } = useContext(FocusGridContext);
+  const registerFocus = useCallback((node) => {
+    register(node, rowIndex, columnIndex);
+  }, []);
+  useEffect(() => {
+    registerFocus(ref.current);
+  }, [ref.current]);
+  const {
+    transforms = [],
+    formatters = [],
+    fixedFormatters = [],
+    // useful for the toolbar trigger at the last column
+    scrollingFormatters = []
+  } = cell || {};
+  const extraParameters = {
+    columnIndex,
+    property: evaluatedProperty,
+    column,
+    rowData,
+    rowIndex,
+    rowKey,
+    isScrolling,
+    // improve performance on scroll rendering a lightweight component instead
+    registerFocus,
+    ...extraRowProps
+  };
+  const withTooltip = (v) => classProps && classProps.wrapText ? v : /* @__PURE__ */ jsx(DSTruncatedTooltipText, { value: v });
+  const value = rowData[`_${evaluatedProperty}`] || rowData[evaluatedProperty];
+  const transformed = evaluateTransforms(transforms, value, extraParameters);
+  return /* @__PURE__ */ jsx(
+    Component,
+    {
+      ref,
+      "data-testid": `column-${property}`,
+      tabIndex: -1,
+      classProps,
+      ...props,
+      ...cell && cell.props,
+      ...transformed,
+      children: transformed.children || evaluateFormatters(
+        !isScrolling ? [withTooltip, ...formatters, ...fixedFormatters] : [...scrollingFormatters, ...fixedFormatters],
+        value,
+        extraParameters,
+        grid
+      )
+    }
+  );
+};
+BodyCell.propTypes = {
+  component: PropTypes.element,
+  classProps: PropTypes.shape({
+    wrapText: PropTypes.bool
+  }),
+  rowProps: PropTypes.shape({
+    rowData: PropTypes.shape({}),
+    rowKey: PropTypes.string,
+    isScrolling: PropTypes.bool
+  }),
+  column: PropTypes.shape({
+    property: PropTypes.string,
+    cell: PropTypes.any,
+    props: PropTypes.shape({})
+  }),
+  columnIndex: PropTypes.number,
+  rowIndex: PropTypes.number,
+  grid: PropTypes.any
+};
+var BodyCell_default = BodyCell;
+export {
+  BodyCell,
+  BodyCell_default as default
+};
+//# sourceMappingURL=BodyCell.js.map

package/dist/esm/components/BodyCell.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/components/BodyCell.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useEffect, useContext, useRef, useCallback } from 'react';\nimport PropTypes from 'prop-types';\nimport { FocusGridContext, evaluateFormatters, evaluateTransforms } from '@elliemae/ds-legacy-shared';\nimport { DSTruncatedTooltipText } from '@elliemae/ds-legacy-truncated-tooltip-text';\n\nconst BodyCell = ({ component: Component, classProps, rowProps, column, columnIndex, rowIndex, grid }) => {\n  const { rowData, rowKey, isScrolling, ...extraRowProps } = rowProps;\n  const { property, cell, props } = column;\n  const evaluatedProperty = property || (cell && cell.property);\n\n  const ref = useRef(null);\n  const { register } = useContext(FocusGridContext);\n\n  const registerFocus = useCallback((node) => {\n    register(node, rowIndex, columnIndex);\n  }, []);\n\n  useEffect(() => {\n    registerFocus(ref.current);\n  }, [ref.current]);\n\n  const {\n    transforms = [],\n    formatters = [],\n    fixedFormatters = [], // useful for the toolbar trigger at the last column\n    scrollingFormatters = [],\n  } = cell || {};\n\n  const extraParameters = {\n    columnIndex,\n    property: evaluatedProperty,\n    column,\n    rowData,\n    rowIndex,\n    rowKey,\n    isScrolling, // improve performance on scroll rendering a lightweight component instead\n    registerFocus,\n    ...extraRowProps,\n  };\n  const withTooltip = (v) => (classProps && classProps.wrapText ? v : <DSTruncatedTooltipText value={v} />);\n  const value = rowData[`_${evaluatedProperty}`] || rowData[evaluatedProperty];\n  const transformed = evaluateTransforms(transforms, value, extraParameters);\n  return (\n    <Component\n      ref={ref}\n      data-testid={`column-${property}`}\n      tabIndex={-1}\n      classProps={classProps}\n      {...props}\n      {...(cell && cell.props)}\n      {...transformed}\n    >\n      {transformed.children ||\n        evaluateFormatters(\n          !isScrolling\n            ? [withTooltip, ...formatters, ...fixedFormatters]\n            : [...scrollingFormatters, ...fixedFormatters],\n          value,\n          extraParameters,\n          grid,\n        )}\n    </Component>\n  );\n};\n\nBodyCell.propTypes = {\n  component: PropTypes.element,\n  classProps: PropTypes.shape({\n    wrapText: PropTypes.bool,\n  }),\n  rowProps: PropTypes.shape({\n    rowData: PropTypes.shape({}),\n    rowKey: PropTypes.string,\n    isScrolling: PropTypes.bool,\n  }),\n  column: PropTypes.shape({\n    property: PropTypes.string,\n    cell: PropTypes.any,\n    props: PropTypes.shape({}),\n  }),\n  columnIndex: PropTypes.number,\n  rowIndex: PropTypes.number,\n  grid: PropTypes.any,\n};\n\nexport { BodyCell };\nexport default BodyCell;\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACuC+C;AAvCtE,SAAgB,WAAW,YAAY,QAAQ,mBAAmB;AAClE,OAAO,eAAe;AACtB,SAAS,kBAAkB,oBAAoB,0BAA0B;AACzE,SAAS,8BAA8B;AAEvC,MAAM,WAAW,CAAC,EAAE,WAAW,WAAW,YAAY,UAAU,QAAQ,aAAa,UAAU,KAAK,MAAM;AACxG,QAAM,EAAE,SAAS,QAAQ,aAAa,GAAG,cAAc,IAAI;AAC3D,QAAM,EAAE,UAAU,MAAM,MAAM,IAAI;AAClC,QAAM,oBAAoB,YAAa,QAAQ,KAAK;AAEpD,QAAM,MAAM,OAAO,IAAI;AACvB,QAAM,EAAE,SAAS,IAAI,WAAW,gBAAgB;AAEhD,QAAM,gBAAgB,YAAY,CAAC,SAAS;AAC1C,aAAS,MAAM,UAAU,WAAW;AAAA,EACtC,GAAG,CAAC,CAAC;AAEL,YAAU,MAAM;AACd,kBAAc,IAAI,OAAO;AAAA,EAC3B,GAAG,CAAC,IAAI,OAAO,CAAC;AAEhB,QAAM;AAAA,IACJ,aAAa,CAAC;AAAA,IACd,aAAa,CAAC;AAAA,IACd,kBAAkB,CAAC;AAAA;AAAA,IACnB,sBAAsB,CAAC;AAAA,EACzB,IAAI,QAAQ,CAAC;AAEb,QAAM,kBAAkB;AAAA,IACtB;AAAA,IACA,UAAU;AAAA,IACV;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL;AACA,QAAM,cAAc,CAAC,MAAO,cAAc,WAAW,WAAW,IAAI,oBAAC,0BAAuB,OAAO,GAAG;AACtG,QAAM,QAAQ,QAAQ,IAAI,mBAAmB,KAAK,QAAQ,iBAAiB;AAC3E,QAAM,cAAc,mBAAmB,YAAY,OAAO,eAAe;AACzE,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,eAAa,UAAU;AAAA,MACvB,UAAU;AAAA,MACV;AAAA,MACC,GAAG;AAAA,MACH,GAAI,QAAQ,KAAK;AAAA,MACjB,GAAG;AAAA,MAEH,sBAAY,YACX;AAAA,QACE,CAAC,cACG,CAAC,aAAa,GAAG,YAAY,GAAG,eAAe,IAC/C,CAAC,GAAG,qBAAqB,GAAG,eAAe;AAAA,QAC/C;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAAA;AAAA,EACJ;AAEJ;AAEA,SAAS,YAAY;AAAA,EACnB,WAAW,UAAU;AAAA,EACrB,YAAY,UAAU,MAAM;AAAA,IAC1B,UAAU,UAAU;AAAA,EACtB,CAAC;AAAA,EACD,UAAU,UAAU,MAAM;AAAA,IACxB,SAAS,UAAU,MAAM,CAAC,CAAC;AAAA,IAC3B,QAAQ,UAAU;AAAA,IAClB,aAAa,UAAU;AAAA,EACzB,CAAC;AAAA,EACD,QAAQ,UAAU,MAAM;AAAA,IACtB,UAAU,UAAU;AAAA,IACpB,MAAM,UAAU;AAAA,IAChB,OAAO,UAAU,MAAM,CAAC,CAAC;AAAA,EAC3B,CAAC;AAAA,EACD,aAAa,UAAU;AAAA,EACvB,UAAU,UAAU;AAAA,EACpB,MAAM,UAAU;AAClB;AAGA,IAAO,mBAAQ;",
+  "names": []
+}

package/dist/esm/components/BodyList.js

@@ -0,0 +1,18 @@
+import * as React from "react";
+import { jsx } from "react/jsx-runtime";
+import React2 from "react";
+import { NoResults } from "./NoResults.js";
+const BodyWrapperDefaultRenderer = ({
+  component: Component,
+  rows,
+  rowRenderer,
+  noResultsPlaceholder,
+  innerRef,
+  innerBodyRef,
+  ...otherBodyProps
+}) => /* @__PURE__ */ jsx(Component, { ...otherBodyProps, innerRef, children: rows.length ? rows.map((row, index) => rowRenderer(row, { index }, {})) : /* @__PURE__ */ jsx(NoResults, { innerRef, rowRenderer, children: noResultsPlaceholder }) });
+var BodyList_default = React2.memo(BodyWrapperDefaultRenderer);
+export {
+  BodyList_default as default
+};
+//# sourceMappingURL=BodyList.js.map

package/dist/esm/components/BodyList.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/components/BodyList.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { NoResults } from './NoResults.js';\n\nconst BodyWrapperDefaultRenderer = ({\n  component: Component,\n  rows,\n  rowRenderer,\n  noResultsPlaceholder,\n  innerRef,\n  innerBodyRef,\n  ...otherBodyProps\n}) => (\n  <Component {...otherBodyProps} innerRef={innerRef}>\n    {rows.length ? (\n      rows.map((row, index) => rowRenderer(row, { index }, {}))\n    ) : (\n      <NoResults innerRef={innerRef} rowRenderer={rowRenderer}>\n        {noResultsPlaceholder}\n      </NoResults>\n    )}\n  </Component>\n);\n\nexport default React.memo(BodyWrapperDefaultRenderer);\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACgBjB;AAhBN,OAAOA,YAAW;AAClB,SAAS,iBAAiB;AAE1B,MAAM,6BAA6B,CAAC;AAAA,EAClC,WAAW;AAAA,EACX;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MACE,oBAAC,aAAW,GAAG,gBAAgB,UAC5B,eAAK,SACJ,KAAK,IAAI,CAAC,KAAK,UAAU,YAAY,KAAK,EAAE,MAAM,GAAG,CAAC,CAAC,CAAC,IAExD,oBAAC,aAAU,UAAoB,aAC5B,gCACH,GAEJ;AAGF,IAAO,mBAAQA,OAAM,KAAK,0BAA0B;",
+  "names": ["React"]
+}

package/dist/esm/components/ColumnVisibilityMenuOption.js

@@ -0,0 +1,35 @@
+import * as React from "react";
+const getColumnVisibilityMenuOption = ({ columns, onColumnVisibilityChange, searchable, height }) => {
+  const { items, active } = columns.reduce(
+    (result, column, index) => ({
+      items: [
+        ...result.items,
+        {
+          id: column.property,
+          label: column.label,
+          checked: column.visible,
+          onClick: () => onColumnVisibilityChange(column, index)
+        }
+      ],
+      active: !column.visible ? result.active : [...result.active, column.property]
+    }),
+    {
+      items: [],
+      active: []
+    }
+  );
+  return {
+    type: "SelectionGroup",
+    id: "column-visibility-option",
+    multi: true,
+    searchable,
+    closeOnClick: false,
+    active,
+    items,
+    height
+  };
+};
+export {
+  getColumnVisibilityMenuOption
+};
+//# sourceMappingURL=ColumnVisibilityMenuOption.js.map

package/dist/esm/components/ColumnVisibilityMenuOption.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/components/ColumnVisibilityMenuOption.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export const getColumnVisibilityMenuOption = ({ columns, onColumnVisibilityChange, searchable, height }) => {\n  const { items, active } = columns.reduce(\n    (result, column, index) => ({\n      items: [\n        ...result.items,\n        {\n          id: column.property,\n          label: column.label,\n          checked: column.visible,\n          onClick: () => onColumnVisibilityChange(column, index),\n        },\n      ],\n      active: !column.visible ? result.active : [...result.active, column.property],\n    }),\n    {\n      items: [],\n      active: [],\n    },\n  );\n\n  return {\n    type: 'SelectionGroup',\n    id: 'column-visibility-option',\n    multi: true,\n    searchable,\n    closeOnClick: false,\n    active,\n    items,\n    height,\n  };\n};\n"],
+  "mappings": "AAAA,YAAY,WAAW;ACAhB,MAAM,gCAAgC,CAAC,EAAE,SAAS,0BAA0B,YAAY,OAAO,MAAM;AAC1G,QAAM,EAAE,OAAO,OAAO,IAAI,QAAQ;AAAA,IAChC,CAAC,QAAQ,QAAQ,WAAW;AAAA,MAC1B,OAAO;AAAA,QACL,GAAG,OAAO;AAAA,QACV;AAAA,UACE,IAAI,OAAO;AAAA,UACX,OAAO,OAAO;AAAA,UACd,SAAS,OAAO;AAAA,UAChB,SAAS,MAAM,yBAAyB,QAAQ,KAAK;AAAA,QACvD;AAAA,MACF;AAAA,MACA,QAAQ,CAAC,OAAO,UAAU,OAAO,SAAS,CAAC,GAAG,OAAO,QAAQ,OAAO,QAAQ;AAAA,IAC9E;AAAA,IACA;AAAA,MACE,OAAO,CAAC;AAAA,MACR,QAAQ,CAAC;AAAA,IACX;AAAA,EACF;AAEA,SAAO;AAAA,IACL,MAAM;AAAA,IACN,IAAI;AAAA,IACJ,OAAO;AAAA,IACP;AAAA,IACA,cAAc;AAAA,IACd;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;",
+  "names": []
+}

package/dist/esm/components/ColumnsOptionsMenuSection.js

@@ -0,0 +1,33 @@
+import * as React from "react";
+import { jsx } from "react/jsx-runtime";
+import { Menu } from "@elliemae/ds-legacy-menu";
+const ColumnsOptionsMenuSection = ({
+  columns,
+  onColumnVisibilityChange,
+  searchable = false,
+  height
+  // eslint-disable-next-line react/display-name
+}) => function() {
+  const { items, active } = columns.reduce(
+    (result, column, index) => ({
+      items: [
+        ...result.items,
+        {
+          id: column.property,
+          label: column.label,
+          checked: column.visible,
+          onClick: () => onColumnVisibilityChange(column, index)
+        }
+      ],
+      active: typeof column.visible === "undefined" || column.visible ? [...result.active, column.property] : result.active
+    }),
+    { items: [], active: [] }
+  );
+  return /* @__PURE__ */ jsx(Menu.SelectionGroup, { active, height, items, multi: true, searchable });
+};
+var ColumnsOptionsMenuSection_default = ColumnsOptionsMenuSection;
+export {
+  ColumnsOptionsMenuSection,
+  ColumnsOptionsMenuSection_default as default
+};
+//# sourceMappingURL=ColumnsOptionsMenuSection.js.map

package/dist/esm/components/ColumnsOptionsMenuSection.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/components/ColumnsOptionsMenuSection.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { Menu } from '@elliemae/ds-legacy-menu';\n\nconst ColumnsOptionsMenuSection = ({\n  columns,\n  onColumnVisibilityChange,\n  searchable = false,\n  height,\n  // eslint-disable-next-line react/display-name\n}) =>\n  function () {\n    const { items, active } = columns.reduce(\n      (result, column, index) => ({\n        items: [\n          ...result.items,\n          {\n            id: column.property,\n            label: column.label,\n            checked: column.visible,\n            onClick: () => onColumnVisibilityChange(column, index),\n          },\n        ],\n        active:\n          typeof column.visible === 'undefined' || column.visible ? [...result.active, column.property] : result.active,\n      }),\n      { items: [], active: [] },\n    );\n    return <Menu.SelectionGroup active={active} height={height} items={items} multi searchable={searchable} />;\n  };\n\nexport { ColumnsOptionsMenuSection };\nexport default ColumnsOptionsMenuSection;\n"],
+  "mappings": "AAAA,YAAY,WAAW;AC2BZ;AA1BX,SAAS,YAAY;AAErB,MAAM,4BAA4B,CAAC;AAAA,EACjC;AAAA,EACA;AAAA,EACA,aAAa;AAAA,EACb;AAAA;AAEF,MACE,WAAY;AACV,QAAM,EAAE,OAAO,OAAO,IAAI,QAAQ;AAAA,IAChC,CAAC,QAAQ,QAAQ,WAAW;AAAA,MAC1B,OAAO;AAAA,QACL,GAAG,OAAO;AAAA,QACV;AAAA,UACE,IAAI,OAAO;AAAA,UACX,OAAO,OAAO;AAAA,UACd,SAAS,OAAO;AAAA,UAChB,SAAS,MAAM,yBAAyB,QAAQ,KAAK;AAAA,QACvD;AAAA,MACF;AAAA,MACA,QACE,OAAO,OAAO,YAAY,eAAe,OAAO,UAAU,CAAC,GAAG,OAAO,QAAQ,OAAO,QAAQ,IAAI,OAAO;AAAA,IAC3G;AAAA,IACA,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,EAAE;AAAA,EAC1B;AACA,SAAO,oBAAC,KAAK,gBAAL,EAAoB,QAAgB,QAAgB,OAAc,OAAK,MAAC,YAAwB;AAC1G;AAGF,IAAO,oCAAQ;",
+  "names": []
+}

package/dist/esm/components/EmptyState.js

@@ -0,0 +1,51 @@
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Grid } from "@elliemae/ds-legacy-grid";
+import { WarningTriangle } from "@elliemae/ds-legacy-icons";
+import { __UNSAFE_SPACE_TO_DIMSUM, toMobile, styled } from "@elliemae/ds-legacy-system";
+import { DSButton } from "@elliemae/ds-legacy-button";
+const EmptyStateWrapper = styled(Grid)`
+  min-width: 132px; /* fixed size in px according to specs */
+  max-width: 384px; /* fixed size in px according to specs */
+  height: fit-content;
+`;
+const Icon = styled(WarningTriangle)`
+  fill: ${(props) => props.theme.colors.neutral[300]};
+  color: ${(props) => props.theme.colors.neutral[300]};
+  justify-self: center;
+`;
+const PrimaryMessage = styled.p`
+  text-align: center;
+  font-weight: 600;
+  font-size: ${(props) => toMobile(props.theme.fontSizes.value[400])};
+  color: ${(props) => props.theme.colors.neutral[600]};
+  margin-top: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.s)};
+  margin-bottom: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xs)};
+`;
+const SecondaryMessage = styled.p`
+  text-align: center;
+  font-size: ${(props) => toMobile(props.theme.fontSizes.value[400])}; /* 13px */
+  color: ${(props) => props.theme.colors.neutral[500]};
+  margin: 0;
+`;
+const Button = styled(DSButton)`
+  margin-top: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.m)};
+  justify-self: center;
+  width: fit-content;
+`;
+const EmptyState = ({
+  primaryMessage = "No Results Found",
+  secondaryMessage,
+  buttonLabel,
+  onButtonClick = () => {
+  }
+}) => /* @__PURE__ */ jsxs(EmptyStateWrapper, { children: [
+  /* @__PURE__ */ jsx(Icon, { size: "xxl" }),
+  primaryMessage && /* @__PURE__ */ jsx(PrimaryMessage, { children: primaryMessage }),
+  secondaryMessage && /* @__PURE__ */ jsx(SecondaryMessage, { children: secondaryMessage }),
+  buttonLabel && /* @__PURE__ */ jsx(Button, { buttonType: "secondary", labelText: buttonLabel, onClick: onButtonClick })
+] });
+export {
+  EmptyState
+};
+//# sourceMappingURL=EmptyState.js.map

package/dist/esm/components/EmptyState.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/components/EmptyState.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport { Grid } from '@elliemae/ds-legacy-grid';\nimport { WarningTriangle } from '@elliemae/ds-legacy-icons';\nimport { __UNSAFE_SPACE_TO_DIMSUM, toMobile, styled } from '@elliemae/ds-legacy-system';\nimport { DSButton } from '@elliemae/ds-legacy-button';\n\nconst EmptyStateWrapper = styled(Grid)`\n  min-width: 132px; /* fixed size in px according to specs */\n  max-width: 384px; /* fixed size in px according to specs */\n  height: fit-content;\n`;\n\nconst Icon = styled(WarningTriangle)`\n  fill: ${(props) => props.theme.colors.neutral[300]};\n  color: ${(props) => props.theme.colors.neutral[300]};\n  justify-self: center;\n`;\n\nconst PrimaryMessage = styled.p`\n  text-align: center;\n  font-weight: 600;\n  font-size: ${(props) => toMobile(props.theme.fontSizes.value[400])};\n  color: ${(props) => props.theme.colors.neutral[600]};\n  margin-top: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.s)};\n  margin-bottom: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.xs)};\n`;\nconst SecondaryMessage = styled.p`\n  text-align: center;\n  font-size: ${(props) => toMobile(props.theme.fontSizes.value[400])}; /* 13px */\n  color: ${(props) => props.theme.colors.neutral[500]};\n  margin: 0;\n`;\nconst Button = styled(DSButton)`\n  margin-top: ${(props) => __UNSAFE_SPACE_TO_DIMSUM(props.theme.space.m)};\n  justify-self: center;\n  width: fit-content;\n`;\n\nexport const EmptyState = ({\n  primaryMessage = 'No Results Found',\n  secondaryMessage,\n  buttonLabel,\n  onButtonClick = () => {},\n}) => (\n  <EmptyStateWrapper>\n    <Icon size=\"xxl\" />\n    {primaryMessage && <PrimaryMessage>{primaryMessage}</PrimaryMessage>}\n    {secondaryMessage && <SecondaryMessage>{secondaryMessage}</SecondaryMessage>}\n    {buttonLabel && <Button buttonType=\"secondary\" labelText={buttonLabel} onClick={onButtonClick} />}\n  </EmptyStateWrapper>\n);\n"],
+  "mappings": "AAAA,YAAY,WAAW;AC4CrB,SACE,KADF;AA3CF,SAAS,YAAY;AACrB,SAAS,uBAAuB;AAChC,SAAS,0BAA0B,UAAU,cAAc;AAC3D,SAAS,gBAAgB;AAEzB,MAAM,oBAAoB,OAAO,IAAI;AAAA;AAAA;AAAA;AAAA;AAMrC,MAAM,OAAO,OAAO,eAAe;AAAA,UACzB,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,GAAG;AAAA,WACxC,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,GAAG;AAAA;AAAA;AAIpD,MAAM,iBAAiB,OAAO;AAAA;AAAA;AAAA,eAGf,CAAC,UAAU,SAAS,MAAM,MAAM,UAAU,MAAM,GAAG,CAAC;AAAA,WACxD,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,GAAG;AAAA,gBACpC,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,CAAC;AAAA,mBACpD,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,EAAE;AAAA;AAE3E,MAAM,mBAAmB,OAAO;AAAA;AAAA,eAEjB,CAAC,UAAU,SAAS,MAAM,MAAM,UAAU,MAAM,GAAG,CAAC;AAAA,WACxD,CAAC,UAAU,MAAM,MAAM,OAAO,QAAQ,GAAG;AAAA;AAAA;AAGpD,MAAM,SAAS,OAAO,QAAQ;AAAA,gBACd,CAAC,UAAU,yBAAyB,MAAM,MAAM,MAAM,CAAC;AAAA;AAAA;AAAA;AAKhE,MAAM,aAAa,CAAC;AAAA,EACzB,iBAAiB;AAAA,EACjB;AAAA,EACA;AAAA,EACA,gBAAgB,MAAM;AAAA,EAAC;AACzB,MACE,qBAAC,qBACC;AAAA,sBAAC,QAAK,MAAK,OAAM;AAAA,EAChB,kBAAkB,oBAAC,kBAAgB,0BAAe;AAAA,EAClD,oBAAoB,oBAAC,oBAAkB,4BAAiB;AAAA,EACxD,eAAe,oBAAC,UAAO,YAAW,aAAY,WAAW,aAAa,SAAS,eAAe;AAAA,GACjG;",
+  "names": []
+}