@react-fabric/data 1.0.0-beta.60 → 1.0.0-beta.61

package/dist/cjs/checklist/CheckList.js

@@ -40,12 +40,12 @@ var CheckItem = function CheckItem(_ref) {
       "data-type": "checkbox",
       className: "ax-checkList__checkbox",
       "data-selected": selected === 1,
-      icon: selected ? core.CoreIcons.checkboxInt : core.CoreIcons.checkboxOff
+      icon: selected ? "icon-[mdi--checkbox-marked]" : "icon-[mdi--checkbox-blank-outline]"
     }), allowNegative && /*#__PURE__*/jsxRuntime.jsxs(react.Fragment, {
       children: [/*#__PURE__*/jsxRuntime.jsx(core.Icon, {
         "data-type": "multiple",
         className: "ax-checkList__checkbox",
-        icon: selected === 1 ? core.CoreIcons.expand : selected === -1 ? core.CoreIcons.collapse : core.CoreIcons.checkboxOff,
+        icon: selected === 1 ? "icon-[mdi--plus-box-outline]" : selected === -1 ? "icon-[mdi--minus-box-outline]" : "icon-[mdi--checkbox-blank-outline]",
         "data-selected": selected
       }), /*#__PURE__*/jsxRuntime.jsxs("div", {
         className: "ax-checkList__checkbox",
@@ -54,14 +54,14 @@ var CheckItem = function CheckItem(_ref) {
           onClick: function onClick(e) {
             return [(_onClick(id, false), e.stopPropagation())];
           },
-          icon: selected === 1 ? core.CoreIcons.expandActive : core.CoreIcons.expand,
+          icon: selected === 1 ? "icon-[mdi--plus-box]" : "icon-[mdi--plus-box-outline]",
           "data-selected": selected === 1
         }), /*#__PURE__*/jsxRuntime.jsx(core.Icon, {
           "data-type": "negative",
           onClick: function onClick(e) {
             return [(_onClick(id, true), e.stopPropagation())];
           },
-          icon: selected === -1 ? core.CoreIcons.collapseActive : core.CoreIcons.collapse,
+          icon: selected === -1 ? "icon-[mdi--minus-box]" : "icon-[mdi--minus-box-outline]",
           "data-selected": selected === -1
         })]
       })]

package/dist/cjs/histogram/Histogram.js

@@ -99,7 +99,7 @@ var Histogram = function Histogram(_ref) {
             color: "danger",
             size: "sm",
             stopPropagation: true,
-            icon: core.CoreIcons.funnelMinus,
+            icon: "icon-[mdi--filter-minus]",
             "aria-label": "Filter Negative",
             onClick: function onClick() {
               return _onClick === null || _onClick === void 0 ? void 0 : _onClick(item.id, true);
@@ -108,7 +108,7 @@ var Histogram = function Histogram(_ref) {
             color: "primary",
             size: "sm",
             stopPropagation: true,
-            icon: core.CoreIcons.funnelPlus,
+            icon: "icon-[mdi--filter-plus]",
             "aria-label": "Filter",
             onClick: function onClick() {
               return _onClick === null || _onClick === void 0 ? void 0 : _onClick(item.id);

package/dist/cjs/json/JsonViewer.js

@@ -133,7 +133,7 @@ var JsonEntry = function JsonEntry(_ref3) {
           color: "danger",
           size: "xs",
           variant: "link",
-          icon: core.CoreIcons.funnelMinus,
+          icon: "icon-[mdi--filter-minus]",
           "aria-label": "Filter Negative",
           onClick: function onClick() {
             return onFilter === null || onFilter === void 0 ? void 0 : onFilter(pathWithoutOrdinal, actualValue, true);
@@ -142,7 +142,7 @@ var JsonEntry = function JsonEntry(_ref3) {
           color: "primary",
           size: "xs",
           variant: "link",
-          icon: core.CoreIcons.funnelPlus,
+          icon: "icon-[mdi--filter-plus]",
           "aria-label": "Filter",
           onClick: function onClick() {
             return onFilter === null || onFilter === void 0 ? void 0 : onFilter(pathWithoutOrdinal, actualValue);
@@ -168,7 +168,7 @@ var JsonEntry = function JsonEntry(_ref3) {
         },
         children: [canExpand && /*#__PURE__*/jsxRuntime.jsx(core.Icon, {
           rtlFlip: true,
-          icon: expanded ? core.CoreIcons.chevronDown : core.CoreIcons.chevronRight
+          icon: expanded ? "icon-[mdi--chevron-down]" : "icon-[mdi--chevron-right]"
         }), labelDisplay]
       }), display && /*#__PURE__*/jsxRuntime.jsxs("div", {
         className: classNames("px-2 flex flex-nowrap overflow-hidden", inline && "flex-1"),

package/dist/cjs/pagination/Pagination.js

@@ -69,7 +69,7 @@ var Pagination = /*#__PURE__*/react.memo(function (_ref) {
       },
       className: classNames("leading-none text-sm hover:bg-primary-200 w-8 h-6 rounded-full", page === 0 && "pointer-events-none text-tint-300"),
       children: /*#__PURE__*/jsxRuntime.jsx(core.Icon, {
-        icon: core.CoreIcons.chevronsLeft,
+        icon: "icon-[mdi--chevron-double-left]",
         rtlFlip: true
       })
     }), /*#__PURE__*/jsxRuntime.jsx("button", {
@@ -78,7 +78,7 @@ var Pagination = /*#__PURE__*/react.memo(function (_ref) {
       },
       className: classNames("leading-none text-sm hover:bg-primary-200 w-8 h-6 rounded-full", page === 0 && "pointer-events-none text-tint-300"),
       children: /*#__PURE__*/jsxRuntime.jsx(core.Icon, {
-        icon: core.CoreIcons.chevronLeft,
+        icon: "icon-[mdi--chevron-left]",
         rtlFlip: true
       })
     }), !minimal && pageBody, minimal && /*#__PURE__*/jsxRuntime.jsxs("label", {
@@ -90,7 +90,7 @@ var Pagination = /*#__PURE__*/react.memo(function (_ref) {
       },
       className: classNames("leading-none text-sm hover:bg-primary-200 w-8 h-6 rounded-full", page + 1 >= totalPages && "pointer-events-none text-tint-300"),
       children: /*#__PURE__*/jsxRuntime.jsx(core.Icon, {
-        icon: core.CoreIcons.chevronRight,
+        icon: "icon-[mdi--chevron-right]",
         rtlFlip: true
       })
     }), /*#__PURE__*/jsxRuntime.jsx("button", {
@@ -99,7 +99,7 @@ var Pagination = /*#__PURE__*/react.memo(function (_ref) {
       },
       className: classNames("leading-none text-sm hover:bg-primary-200 w-8 h-6 rounded-full", page + 1 >= totalPages && "pointer-events-none text-tint-300"),
       children: /*#__PURE__*/jsxRuntime.jsx(core.Icon, {
-        icon: core.CoreIcons.chevronsRight,
+        icon: "icon-[mdi--chevron-double-right]",
         rtlFlip: true
       })
     })]

package/dist/cjs/table/AddColumn.js

@@ -34,7 +34,7 @@ var AddColumn = function AddColumn(_ref) {
     children: /*#__PURE__*/jsxRuntime.jsxs(core.Dropdown, {
       placement: "bottom-end",
       children: [/*#__PURE__*/jsxRuntime.jsx(core.Icon, {
-        icon: core.CoreIcons.insert,
+        icon: "icon-[mdi--plus-circle-outline]",
         className: "p-1 rounded-t rounded-b-none hover:outline"
       }), /*#__PURE__*/jsxRuntime.jsx(core.Menu, {
         className: "text-sm",
@@ -45,7 +45,7 @@ var AddColumn = function AddColumn(_ref) {
             id: String(col.id),
             "data-dropdown-dismiss": "false",
             label: "".concat((_col$label = col.label) !== null && _col$label !== void 0 ? _col$label : String(col.id)),
-            icon: !col.hidden ? core.CoreIcons.tick : ""
+            icon: !col.hidden ? "icon-[mdi--check]" : ""
           }, String(col.id));
         })
       })]

package/dist/cjs/table/BodyCell.js

@@ -43,7 +43,7 @@ var BodyCell = function BodyCell(_ref) {
     return (_widths$get = widths.get(column.id.toString())) !== null && _widths$get !== void 0 ? _widths$get : column.width;
   }, [widths, column]);
   var content = react.useMemo(function () {
-    var _column$dataType;
+    var _column$dataType2;
     var value = utilities.getByPath(item, column.id.toString());
     if (column.renderer != null) {
       return column.renderer(value, item, index);
@@ -52,16 +52,17 @@ var BodyCell = function BodyCell(_ref) {
       var _column$valueMap;
       var map = (_column$valueMap = column.valueMap) !== null && _column$valueMap !== void 0 ? _column$valueMap : {
         "true": "Yes",
-        "false": "no"
+        "false": "No"
       };
       return map["".concat(utilities.isTrue(value) ? "true" : "false")];
     }
     if (column.valueMap != null) {
-      if (column.dataType === "string" && value in column.valueMap) {
+      var _column$dataType;
+      if (["number", "string"].includes((_column$dataType = column.dataType) !== null && _column$dataType !== void 0 ? _column$dataType : "string") && value in column.valueMap) {
         return column.valueMap[value];
       }
     }
-    if (["date", "time", "datetime"].includes((_column$dataType = column.dataType) !== null && _column$dataType !== void 0 ? _column$dataType : "")) {
+    if (["date", "time", "datetime"].includes((_column$dataType2 = column.dataType) !== null && _column$dataType2 !== void 0 ? _column$dataType2 : "")) {
       return /*#__PURE__*/jsxRuntime.jsx(date.DateDisplay, {
         date: value,
         format: column.format
@@ -70,6 +71,12 @@ var BodyCell = function BodyCell(_ref) {
     if (column.dataType === "number") {
       return utilities.Format.number(value, column.format);
     }
+    if (utilities.isObject(value)) {
+      return JSON.stringify(value);
+    }
+    if (utilities.isArray(value)) {
+      return value.join(", ");
+    }
     return value !== null && value !== void 0 ? value : "";
   }, [item, column]);
   return /*#__PURE__*/jsxRuntime.jsx("div", {

package/dist/cjs/table/BodyRow.js

@@ -1,9 +1,9 @@
 'use strict';
 
+var core = require('@react-fabric/core');
 var classNames = require('classnames');
 var BodyCell = require('./BodyCell.js');
 var CheckboxCell = require('./CheckboxCell.js');
-var core = require('@react-fabric/core');
 var jsxRuntime = require('react/jsx-runtime');
 
 /*
@@ -65,7 +65,7 @@ var BodyRow = function BodyRow(_ref) {
           className: classNames("group font-medium w-6 flex flex-nowrap text-start py-1", !canExpand(data) && "pointer-events-none opacity-35"),
           children: /*#__PURE__*/jsxRuntime.jsx(core.Icon, {
             className: "p-1 text-tint-700 hover:text-primary-600",
-            icon: expanded ? core.CoreIcons.collapse : core.CoreIcons.expand,
+            icon: expanded ? "icon-[mdi--minus-box]" : "icon-[mdi--plus-box]",
             onClick: function onClick(e) {
               return [keyProperty && toggleExpand(data[keyProperty]), e.stopPropagation()];
             }

package/dist/cjs/table/CheckboxCell.js

@@ -32,7 +32,7 @@ var CheckboxCell = function CheckboxCell(_ref) {
   return /*#__PURE__*/jsxRuntime.jsx("div", {
     className: "group font-medium border-e w-6 flex flex-nowrap text-start py-1",
     children: /*#__PURE__*/jsxRuntime.jsx(core.Icon, {
-      icon: state === 2 ? core.CoreIcons.checkboxInt : state === 1 ? core.CoreIcons.checkboxOn : core.CoreIcons.checkboxOff,
+      icon: state === 2 ? "icon-[mdi--checkbox-intermediate]" : state === 1 ? "icon-[mdi--checkbox-marked]" : "icon-[mdi--checkbox-blank-outline]",
       className: "p-1 text-tint-700 hover:text-primary-600",
       onClick: function onClick(e) {
         return [_onClick === null || _onClick === void 0 ? void 0 : _onClick(), e.stopPropagation()];

package/dist/cjs/table/HeaderCell.js

@@ -50,7 +50,7 @@ var HeaderCell = function HeaderCell(_ref) {
     if (filterable && (dataType !== null && dataType !== void 0 ? dataType : filterOptions)) {
       ret.push( /*#__PURE__*/jsxRuntime.jsx(core.Menu, {
         label: "Filter",
-        icon: filter ? core.CoreIcons.tick : "",
+        icon: filter ? "icon-[mdi--check]" : "",
         trigger: "click",
         children: /*#__PURE__*/jsxRuntime.jsx(ColumnFilters.ColumnFilters, {
           type: dataType,
@@ -65,13 +65,13 @@ var HeaderCell = function HeaderCell(_ref) {
     if (sortable) {
       ret.push( /*#__PURE__*/jsxRuntime.jsx(core.MenuItem, {
         label: "Sort ascending",
-        icon: core.CoreIcons.sortAsc,
+        icon: "icon-[mdi--sort-ascending]",
         onClick: function onClick() {
           return handleSort("asc");
         }
       }, "sort-asc"), /*#__PURE__*/jsxRuntime.jsx(core.MenuItem, {
         label: "Sort descending",
-        icon: core.CoreIcons.sortDesc,
+        icon: "icon-[mdi--sort-descending]",
         onClick: function onClick() {
           return handleSort("desc");
         }
@@ -136,7 +136,7 @@ var HeaderCell = function HeaderCell(_ref) {
       variant: "link",
       "aria-label": "clear filter",
       stopPropagation: true,
-      icon: core.CoreIcons.funnelRemove,
+      icon: "icon-[mdi--filter-remove]",
       onClick: function onClick() {
         return _onFilter === null || _onFilter === void 0 ? void 0 : _onFilter(id);
       }

package/dist/cjs/table/Table.js

@@ -168,7 +168,7 @@ var Table = function Table(_ref) {
             })
           })]
         })]
-      }), loading && /*#__PURE__*/jsxRuntime.jsx(core.Loading, {}), data.length > 0 && /*#__PURE__*/jsxRuntime.jsxs("div", {
+      }), loading && /*#__PURE__*/jsxRuntime.jsx(core.LoadingLine, {}), data.length > 0 && /*#__PURE__*/jsxRuntime.jsxs("div", {
         className: "area-content flex flex-col flex-nowrap min-h-full",
         style: {
           height: totalSize()
@@ -183,26 +183,29 @@ var Table = function Table(_ref) {
           var index = _ref2.index,
             key = _ref2.key;
           var data = getData(index);
-          return "__GROUP__" in data ? /*#__PURE__*/jsxRuntime.jsxs("div", {
+          return "__GROUP__" in data ? /*#__PURE__*/jsxRuntime.jsx("div", {
             ref: measureElement,
             "data-index": index,
-            className: classNames("px-2 py-1 text-md bg-base border-y border-tint-100 cursor-pointer flex items-center gap-1 z-2", isActiveSticky(index) && "sticky top-8"),
+            className: classNames("text-md bg-base border-y border-tint-100 border-t-0 cursor-pointer flex items-center justify-start gap-1 z-2", isActiveSticky(index) && "sticky top-8"),
             role: "none",
             onClick: function onClick() {
               return toggleGroupExpand(data.key);
             },
-            children: [/*#__PURE__*/jsxRuntime.jsx(core.Icon, {
-              rtlFlip: true,
-              icon: data.open ? core.CoreIcons.chevronDown : core.CoreIcons.chevronRight
-            }), (_groupRenderer = groupRenderer === null || groupRenderer === void 0 ? void 0 : groupRenderer(data)) !== null && _groupRenderer !== void 0 ? _groupRenderer : /*#__PURE__*/jsxRuntime.jsxs("div", {
-              className: "flex gap-1 items-center",
-              children: [/*#__PURE__*/jsxRuntime.jsx("span", {
-                children: data.key
-              }), /*#__PURE__*/jsxRuntime.jsxs("span", {
-                className: "text-sm",
-                children: ["(", data.itemCount, ")"]
+            children: /*#__PURE__*/jsxRuntime.jsxs("div", {
+              className: classNames("px-2 py-1 flex items-center gap-1 z-2 sticky start-0"),
+              children: [/*#__PURE__*/jsxRuntime.jsx(core.Icon, {
+                rtlFlip: true,
+                icon: data.open ? "icon-[mdi--chevron-down]" : "icon-[mdi--chevron-right]"
+              }), (_groupRenderer = groupRenderer === null || groupRenderer === void 0 ? void 0 : groupRenderer(data)) !== null && _groupRenderer !== void 0 ? _groupRenderer : /*#__PURE__*/jsxRuntime.jsxs("div", {
+                className: "flex gap-1 items-center",
+                children: [/*#__PURE__*/jsxRuntime.jsx("span", {
+                  children: data.key
+                }), /*#__PURE__*/jsxRuntime.jsxs("span", {
+                  className: "text-sm",
+                  children: ["(", data.itemCount, ")"]
+                })]
               })]
-            })]
+            })
           }, key) : /*#__PURE__*/jsxRuntime.jsx(BodyRow.BodyRow, {
             rowKey: key.toString(),
             index: index,

package/dist/cjs/tree/TreeNode.js

@@ -57,7 +57,7 @@ var TreeNode = function TreeNode(_ref) {
     };
   }, [defaultLeafIcon, defaultNodeIcon, node.icon]);
   var canCheck = react.useMemo(function () {
-    return checkable === true || checkable === "leafOnly" && node.leaf;
+    return utilities.isTrue(checkable) || checkable === "leafOnly" && node.leaf;
   }, [node.leaf, checkable]);
   var canSelect = react.useMemo(function () {
     return !node.disabled && (selectable === true || selectable === "leafOnly" && node.leaf);
@@ -72,8 +72,8 @@ var TreeNode = function TreeNode(_ref) {
     children: [filler, node.loading && /*#__PURE__*/jsxRuntime.jsx("div", {
       className: "flex-initial w-6",
       children: /*#__PURE__*/jsxRuntime.jsx(core.Icon, {
-        icon: core.CoreIcons.spinner,
-        className: "animate-spin text-muted"
+        icon: "icon-[svg-spinners--eclipse]",
+        className: "text-muted"
       })
     }), !node.leaf && !node.childFiltered && !node.loading && /*#__PURE__*/jsxRuntime.jsx("div", {
       className: "flex-initial w-6",
@@ -91,7 +91,7 @@ var TreeNode = function TreeNode(_ref) {
         onClick: function onClick() {
           return !node.disabled && onChecked(node.id);
         },
-        icon: node.checked === 2 ? core.CoreIcons.checkboxInt : node.checked === 1 ? core.CoreIcons.checkboxOn : core.CoreIcons.checkboxOff,
+        icon: node.checked === 2 ? "icon-[mdi--checkbox-intermediate]" : node.checked === 1 ? "icon-[mdi--checkbox-marked]" : "icon-[mdi--checkbox-blank-outline]",
         className: classNames(node.disabled ? "text-muted" : "text-primary-500 hover:text-primary-600")
       })
     }), !node.empty && /*#__PURE__*/jsxRuntime.jsxs("div", {

package/dist/cjs/tree/TreePanel.js

@@ -7,7 +7,6 @@ var form = require('@react-fabric/form');
 var reactVirtual = require('@tanstack/react-virtual');
 var react = require('react');
 var TreeNode = require('./TreeNode.js');
-var types = require('./types.js');
 var useTree = require('./useTree.js');
 var jsxRuntime = require('react/jsx-runtime');
 
@@ -81,10 +80,10 @@ var TreePanel = function TreePanel(_ref) {
   });
   var virtualItems = virtualizer.getVirtualItems();
   var expanders = react.useMemo(function () {
-    if (expander === "caret") return [core.CoreIcons.caretRight, core.CoreIcons.caretDown];
-    if (expander === "chevron") return [core.CoreIcons.chevronRight, core.CoreIcons.chevronDown];
-    if (expander === "folder") return [core.CoreIcons.folderClosed, core.CoreIcons.folderOpen];
-    return [core.CoreIcons.expand, core.CoreIcons.collapse];
+    if (expander === "caret") return ["icon-[mdi--menu-right]", "icon-[mdi--menu-down]"];
+    if (expander === "chevron") return ["icon-[mdi--chevron-right]", "icon-[mdi--chevron-down]"];
+    if (expander === "folder") return ["icon-[mdi--folder-outline]", "icon-[mdi--folder-open-outline]"];
+    return ["icon-[mdi--plus-box-outline]", "icon-[mdi--minus-box-outline]"];
   }, [expander]);
   react.useImperativeHandle(ref, function () {
     return {
@@ -118,7 +117,7 @@ var TreePanel = function TreePanel(_ref) {
         placeholder: filterPlaceholder,
         noBorder: true,
         decorateStart: /*#__PURE__*/jsxRuntime.jsx(core.Icon, {
-          icon: core.CoreIcons.filter,
+          icon: "icon-[mdi--filter-variant]",
           className: "p-1"
         })
       }), /*#__PURE__*/jsxRuntime.jsxs(core.ButtonGroup, {
@@ -127,12 +126,12 @@ var TreePanel = function TreePanel(_ref) {
         children: [/*#__PURE__*/jsxRuntime.jsx(core.Button, {
           size: "sm",
           "aria-label": "expand all",
-          icon: types.iconExpandAll,
+          icon: "icon-[mdi--arrow-expand-vertical]",
           onClick: expandAll
         }), /*#__PURE__*/jsxRuntime.jsx(core.Button, {
           size: "sm",
           "aria-label": "collapse all",
-          icon: types.iconCollapseAll,
+          icon: "icon-[mdi--arrow-collapse-vertical]",
           onClick: collapseAll
         })]
       })]

package/dist/cjs/virtual/Scroller.js

@@ -43,7 +43,7 @@ var Scroller = function Scroller(_ref) {
       variant: "link",
       "aria-label": "scroll to top",
       icon: {
-        icon: vertical ? core.CoreIcons.chevronsUp : core.CoreIcons.chevronsLeft,
+        icon: vertical ? "icon-[mdi--chevron-double-up]" : "icon-[mdi--chevron-double-left]",
         rtlFlip: true
       },
       disabled: (scrollActive & 2) === 0,
@@ -53,7 +53,7 @@ var Scroller = function Scroller(_ref) {
       variant: "link",
       "aria-label": "scroll up",
       icon: {
-        icon: vertical ? core.CoreIcons.chevronUp : core.CoreIcons.chevronLeft,
+        icon: vertical ? "icon-[mdi--chevron-up]" : "icon-[mdi--chevron-left]",
         rtlFlip: true
       },
       disabled: (scrollActive & 2) === 0,
@@ -63,7 +63,7 @@ var Scroller = function Scroller(_ref) {
       variant: "link",
       "aria-label": "scroll down",
       icon: {
-        icon: vertical ? core.CoreIcons.chevronDown : core.CoreIcons.chevronRight,
+        icon: vertical ? "icon-[mdi--chevron-down]" : "icon-[mdi--chevron-right]",
         rtlFlip: true
       },
       disabled: scrollActive % 2 === 0,
@@ -73,7 +73,7 @@ var Scroller = function Scroller(_ref) {
       variant: "link",
       "aria-label": "scroll to bottom",
       icon: {
-        icon: vertical ? core.CoreIcons.chevronsDown : core.CoreIcons.chevronsRight,
+        icon: vertical ? "icon-[mdi--chevron-double-down]" : "icon-[mdi--chevron-double-right]",
         rtlFlip: true
       },
       disabled: scrollActive % 2 === 0,

package/dist/esm/checklist/CheckList.js

@@ -4,7 +4,7 @@ import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
-import { EmptyContent, Icon, CoreIcons, Badge } from '@react-fabric/core';
+import { EmptyContent, Icon, Badge } from '@react-fabric/core';
 import { isString } from '@react-fabric/utilities';
 import { useState, useEffect, useMemo, createElement, Fragment, isValidElement } from 'react';
 import { useTranslation } from 'react-i18next';
@@ -40,12 +40,12 @@ var CheckItem = function CheckItem(_ref) {
       "data-type": "checkbox",
       className: "ax-checkList__checkbox",
       "data-selected": selected === 1,
-      icon: selected ? CoreIcons.checkboxInt : CoreIcons.checkboxOff
+      icon: selected ? "icon-[mdi--checkbox-marked]" : "icon-[mdi--checkbox-blank-outline]"
     }), allowNegative && /*#__PURE__*/jsxs(Fragment, {
       children: [/*#__PURE__*/jsx(Icon, {
         "data-type": "multiple",
         className: "ax-checkList__checkbox",
-        icon: selected === 1 ? CoreIcons.expand : selected === -1 ? CoreIcons.collapse : CoreIcons.checkboxOff,
+        icon: selected === 1 ? "icon-[mdi--plus-box-outline]" : selected === -1 ? "icon-[mdi--minus-box-outline]" : "icon-[mdi--checkbox-blank-outline]",
         "data-selected": selected
       }), /*#__PURE__*/jsxs("div", {
         className: "ax-checkList__checkbox",
@@ -54,14 +54,14 @@ var CheckItem = function CheckItem(_ref) {
           onClick: function onClick(e) {
             return [(_onClick(id, false), e.stopPropagation())];
           },
-          icon: selected === 1 ? CoreIcons.expandActive : CoreIcons.expand,
+          icon: selected === 1 ? "icon-[mdi--plus-box]" : "icon-[mdi--plus-box-outline]",
           "data-selected": selected === 1
         }), /*#__PURE__*/jsx(Icon, {
           "data-type": "negative",
           onClick: function onClick(e) {
             return [(_onClick(id, true), e.stopPropagation())];
           },
-          icon: selected === -1 ? CoreIcons.collapseActive : CoreIcons.collapse,
+          icon: selected === -1 ? "icon-[mdi--minus-box]" : "icon-[mdi--minus-box-outline]",
           "data-selected": selected === -1
         })]
       })]

package/dist/esm/histogram/Histogram.js

@@ -3,7 +3,7 @@
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
-import { EmptyContent, Icon, ActionLabel, Button, CoreIcons } from '@react-fabric/core';
+import { EmptyContent, Icon, ActionLabel, Button } from '@react-fabric/core';
 import { compareValues, isColor, Format } from '@react-fabric/utilities';
 import classNames from 'classnames';
 import { useMemo } from 'react';
@@ -99,7 +99,7 @@ var Histogram = function Histogram(_ref) {
             color: "danger",
             size: "sm",
             stopPropagation: true,
-            icon: CoreIcons.funnelMinus,
+            icon: "icon-[mdi--filter-minus]",
             "aria-label": "Filter Negative",
             onClick: function onClick() {
               return _onClick === null || _onClick === void 0 ? void 0 : _onClick(item.id, true);
@@ -108,7 +108,7 @@ var Histogram = function Histogram(_ref) {
             color: "primary",
             size: "sm",
             stopPropagation: true,
-            icon: CoreIcons.funnelPlus,
+            icon: "icon-[mdi--filter-plus]",
             "aria-label": "Filter",
             onClick: function onClick() {
               return _onClick === null || _onClick === void 0 ? void 0 : _onClick(item.id);

package/dist/esm/json/JsonViewer.js

@@ -4,7 +4,7 @@ import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProper
 import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import _toConsumableArray from '@babel/runtime/helpers/toConsumableArray';
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { EmptyContent, Text, Meter, Button, CoreIcons, Icon, Copy } from '@react-fabric/core';
+import { EmptyContent, Text, Meter, Button, Icon, Copy } from '@react-fabric/core';
 import { isEmpty, isArray, isObject, isNil, Format, isBoolean, isTrue } from '@react-fabric/utilities';
 import classNames from 'classnames';
 import { useMemo, useState, Fragment } from 'react';
@@ -133,7 +133,7 @@ var JsonEntry = function JsonEntry(_ref3) {
           color: "danger",
           size: "xs",
           variant: "link",
-          icon: CoreIcons.funnelMinus,
+          icon: "icon-[mdi--filter-minus]",
           "aria-label": "Filter Negative",
           onClick: function onClick() {
             return onFilter === null || onFilter === void 0 ? void 0 : onFilter(pathWithoutOrdinal, actualValue, true);
@@ -142,7 +142,7 @@ var JsonEntry = function JsonEntry(_ref3) {
           color: "primary",
           size: "xs",
           variant: "link",
-          icon: CoreIcons.funnelPlus,
+          icon: "icon-[mdi--filter-plus]",
           "aria-label": "Filter",
           onClick: function onClick() {
             return onFilter === null || onFilter === void 0 ? void 0 : onFilter(pathWithoutOrdinal, actualValue);
@@ -168,7 +168,7 @@ var JsonEntry = function JsonEntry(_ref3) {
         },
         children: [canExpand && /*#__PURE__*/jsx(Icon, {
           rtlFlip: true,
-          icon: expanded ? CoreIcons.chevronDown : CoreIcons.chevronRight
+          icon: expanded ? "icon-[mdi--chevron-down]" : "icon-[mdi--chevron-right]"
         }), labelDisplay]
       }), display && /*#__PURE__*/jsxs("div", {
         className: classNames("px-2 flex flex-nowrap overflow-hidden", inline && "flex-1"),

package/dist/esm/pagination/Pagination.js

@@ -1,7 +1,7 @@
 'use client';
 
 import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
-import { Icon, CoreIcons } from '@react-fabric/core';
+import { Icon } from '@react-fabric/core';
 import classNames from 'classnames';
 import { memo, useMemo, Fragment } from 'react';
 import { jsxs, jsx } from 'react/jsx-runtime';
@@ -69,7 +69,7 @@ var Pagination = /*#__PURE__*/memo(function (_ref) {
       },
       className: classNames("leading-none text-sm hover:bg-primary-200 w-8 h-6 rounded-full", page === 0 && "pointer-events-none text-tint-300"),
       children: /*#__PURE__*/jsx(Icon, {
-        icon: CoreIcons.chevronsLeft,
+        icon: "icon-[mdi--chevron-double-left]",
         rtlFlip: true
       })
     }), /*#__PURE__*/jsx("button", {
@@ -78,7 +78,7 @@ var Pagination = /*#__PURE__*/memo(function (_ref) {
       },
       className: classNames("leading-none text-sm hover:bg-primary-200 w-8 h-6 rounded-full", page === 0 && "pointer-events-none text-tint-300"),
       children: /*#__PURE__*/jsx(Icon, {
-        icon: CoreIcons.chevronLeft,
+        icon: "icon-[mdi--chevron-left]",
         rtlFlip: true
       })
     }), !minimal && pageBody, minimal && /*#__PURE__*/jsxs("label", {
@@ -90,7 +90,7 @@ var Pagination = /*#__PURE__*/memo(function (_ref) {
       },
       className: classNames("leading-none text-sm hover:bg-primary-200 w-8 h-6 rounded-full", page + 1 >= totalPages && "pointer-events-none text-tint-300"),
       children: /*#__PURE__*/jsx(Icon, {
-        icon: CoreIcons.chevronRight,
+        icon: "icon-[mdi--chevron-right]",
         rtlFlip: true
       })
     }), /*#__PURE__*/jsx("button", {
@@ -99,7 +99,7 @@ var Pagination = /*#__PURE__*/memo(function (_ref) {
       },
       className: classNames("leading-none text-sm hover:bg-primary-200 w-8 h-6 rounded-full", page + 1 >= totalPages && "pointer-events-none text-tint-300"),
       children: /*#__PURE__*/jsx(Icon, {
-        icon: CoreIcons.chevronsRight,
+        icon: "icon-[mdi--chevron-double-right]",
         rtlFlip: true
       })
     })]

package/dist/esm/table/AddColumn.js

@@ -1,6 +1,6 @@
 'use client';
 
-import { Dropdown, Icon, CoreIcons, Menu, MenuItem } from '@react-fabric/core';
+import { Dropdown, Icon, Menu, MenuItem } from '@react-fabric/core';
 import { jsx, jsxs } from 'react/jsx-runtime';
 
 /*
@@ -34,7 +34,7 @@ var AddColumn = function AddColumn(_ref) {
     children: /*#__PURE__*/jsxs(Dropdown, {
       placement: "bottom-end",
       children: [/*#__PURE__*/jsx(Icon, {
-        icon: CoreIcons.insert,
+        icon: "icon-[mdi--plus-circle-outline]",
         className: "p-1 rounded-t rounded-b-none hover:outline"
       }), /*#__PURE__*/jsx(Menu, {
         className: "text-sm",
@@ -45,7 +45,7 @@ var AddColumn = function AddColumn(_ref) {
             id: String(col.id),
             "data-dropdown-dismiss": "false",
             label: "".concat((_col$label = col.label) !== null && _col$label !== void 0 ? _col$label : String(col.id)),
-            icon: !col.hidden ? CoreIcons.tick : ""
+            icon: !col.hidden ? "icon-[mdi--check]" : ""
           }, String(col.id));
         })
       })]

package/dist/esm/table/BodyCell.js

@@ -1,7 +1,7 @@
 'use client';
 
 import { DateDisplay } from '@react-fabric/date';
-import { getByPath, isTrue, Format } from '@react-fabric/utilities';
+import { getByPath, isTrue, Format, isObject, isArray } from '@react-fabric/utilities';
 import classNames from 'classnames';
 import { useMemo } from 'react';
 import { useTableContext } from './Context.js';
@@ -43,7 +43,7 @@ var BodyCell = function BodyCell(_ref) {
     return (_widths$get = widths.get(column.id.toString())) !== null && _widths$get !== void 0 ? _widths$get : column.width;
   }, [widths, column]);
   var content = useMemo(function () {
-    var _column$dataType;
+    var _column$dataType2;
     var value = getByPath(item, column.id.toString());
     if (column.renderer != null) {
       return column.renderer(value, item, index);
@@ -52,16 +52,17 @@ var BodyCell = function BodyCell(_ref) {
       var _column$valueMap;
       var map = (_column$valueMap = column.valueMap) !== null && _column$valueMap !== void 0 ? _column$valueMap : {
         "true": "Yes",
-        "false": "no"
+        "false": "No"
       };
       return map["".concat(isTrue(value) ? "true" : "false")];
     }
     if (column.valueMap != null) {
-      if (column.dataType === "string" && value in column.valueMap) {
+      var _column$dataType;
+      if (["number", "string"].includes((_column$dataType = column.dataType) !== null && _column$dataType !== void 0 ? _column$dataType : "string") && value in column.valueMap) {
         return column.valueMap[value];
       }
     }
-    if (["date", "time", "datetime"].includes((_column$dataType = column.dataType) !== null && _column$dataType !== void 0 ? _column$dataType : "")) {
+    if (["date", "time", "datetime"].includes((_column$dataType2 = column.dataType) !== null && _column$dataType2 !== void 0 ? _column$dataType2 : "")) {
       return /*#__PURE__*/jsx(DateDisplay, {
         date: value,
         format: column.format
@@ -70,6 +71,12 @@ var BodyCell = function BodyCell(_ref) {
     if (column.dataType === "number") {
       return Format.number(value, column.format);
     }
+    if (isObject(value)) {
+      return JSON.stringify(value);
+    }
+    if (isArray(value)) {
+      return value.join(", ");
+    }
     return value !== null && value !== void 0 ? value : "";
   }, [item, column]);
   return /*#__PURE__*/jsx("div", {