@utahdts/utah-design-system 0.9.2 → 0.9.5

package/css/1-settings/_settings-index.scss

@@ -80,7 +80,7 @@ variables and settings
   --form-checkbox-large: 1.375rem;
 
     /* content layout sizes */
-  --content-width-narrow: 800px;
+  --content-width-narrow: 808px;
   --content-width: 1224px;
   --content-width-wide: 1432px;
   --documentation-width: 700px;

package/css/4-elements/_elements-index.scss

@@ -59,32 +59,7 @@ elemental html: h1, h2, h3, ul, li, etc.
       background: var(--primary-color-light);
     }
   }
-  pre {
-    position: relative;
-    font-family: var(--fixed-width-font-family);
-    font-size: .95rem;
-    white-space: pre-wrap;
-    word-wrap: break-word;
-    margin: 0 0 var(--spacing) 0;
-    &.gray-block {
-      background: var(--gray-light-color);
-      padding: var(--spacing-s) var(--spacing);
-      border-radius: var(--radius-medium);
-    }
-    &.pre-block {
-      &--overflow {
-        width: 100%;
-        overflow-x: scroll;
-        box-sizing: border-box;
-      }
-      &--padded {
-        padding: 0 var(--spacing);
-      }
-    }
-    .pre-block__overflow-content {
-      width: max-content;
-    }
-  }
+  // pre --- see _pre-code.scss
 
   ul, ol {
     padding: 0 0 0 var(--spacing-2xl);

package/css/6-components/_components-index.scss

@@ -18,6 +18,7 @@ component specific, BEM (Block, Element, Modifier)
 @use "base-components/forms/info-box";
 @use "base-components/forms/radio-button";
 @use "base-components/forms/switch";
+@use "base-components/forms/fieldset";
 @use "base-components/navigation/main-menu";
 @use "base-components/navigation/menu-item";
 @use "base-components/navigation/pagination";
@@ -30,6 +31,7 @@ component specific, BEM (Block, Element, Modifier)
 @use "base-components/popups/search-modal";
 @use "base-components/templates/documenation-template";
 @use "base-components/templates/landing-page-template";
+@use "base-components/text/pre-code";
 @use "base-components/forms/input";
 @use "base-components/widgetsInicators/spinner";
 @use "base-components/tablesAndLists/table";

package/css/6-components/base-components/containers/_accordion.scss

@@ -2,25 +2,41 @@
 
 #{class-vars.$base-class} {
   .accordion {
+    width: 100%;
+
     &__header,
     &__header.button {
-      border-radius: 0;
-      font-size: var(--font-size-2xl);
+      border-radius: var(--radius-small);
+      font-size: var(--font-size-xl);
       font-weight: var(--font-weight-bold);
-      padding: var(--spacing);
+      padding: var(--spacing-s) var(--spacing);
       border: none;
       display: flex;
       flex-direction: row;
       justify-content: space-between;
       width: 100%;
       box-sizing: border-box;
+
+      [class*=utds-icon-before-]::before {
+        margin-right: 0;
+        font-size: 1.5rem;
+      }
     }
+    &__header {
+      &--open {
+        border-bottom-left-radius: 0;
+        border-bottom-right-radius: 0;
+      }
+    }
+
     &__content {
         background: var(--gray-light-color);
         padding: 0;
         box-sizing: border-box;
         height: 0;
         overflow: hidden;
+        border-bottom-left-radius: var(--radius-small);
+        border-bottom-right-radius: var(--radius-small);
 
         &--open {
           height: auto;

package/css/6-components/base-components/forms/_fieldset.scss

@@ -0,0 +1,8 @@
+@use "../../../1-settings/class-vars";
+
+#{class-vars.$base-class} {
+  fieldset {
+    border: none;
+    padding: 0;
+  }
+}

package/css/6-components/base-components/navigation/_main-menu.scss

@@ -52,9 +52,12 @@
           min-height: auto;
           line-height: 1.7;
 
-          .icon-chevron-down {
-            font-size: 1rem;
-            margin-right: -2px;
+          .menu-item__menu-arrow {
+            font-size: .65rem;
+            margin-left: var(--spacing-2xs);
+            &[class*=utds-icon-before-]::before {
+              margin-right: 0;
+            }
           }
 
           &:hover {

package/css/6-components/base-components/templates/_documenation-template.scss

@@ -61,6 +61,15 @@
   }
 }
 
+@media screen and (max-width: 1300px) {
+  #{class-vars.$base-class} {
+    .documentation-template {
+      &__content {
+        max-width: calc(100vw - (6 * var(--spacing-xl)) - (var(--documentation-left-width)) - (var(--documentation-right-width)));
+      }
+    }
+  }
+}
 @media screen and (max-width: #{media-size-vars.$media-size-desktop-small}) {
   #{class-vars.$base-class} {
     .documentation-template {

package/css/6-components/base-components/text/_pre-code.scss

@@ -0,0 +1,38 @@
+
+@use "../../../../../../@utahdts/utah-design-system/css/1-settings/class-vars";
+
+#{class-vars.$base-class} {
+  .pre-code {
+    &__wrapper {
+      position: relative;
+      width: 100%;
+    }
+  }
+
+  pre {
+    position: relative;
+    font-family: var(--fixed-width-font-family);
+    font-size: .95rem;
+    white-space: pre-wrap;
+    word-wrap: break-word;
+    margin: 0 0 var(--spacing) 0;
+    &.gray-block {
+      background: var(--gray-light-color);
+      padding: var(--spacing-s) var(--spacing-xl) var(--spacing-s) var(--spacing);
+      border-radius: var(--radius-medium);
+    }
+    &.pre-code {
+      &--overflow {
+        width: 100%;
+        overflow-x: scroll;
+        box-sizing: border-box;
+      }
+      &--padded {
+        padding: 0 var(--spacing);
+      }
+    }
+    .pre-code__overflow-content {
+      width: max-content;
+    }
+  }
+}

package/dist/style.css

@@ -698,7 +698,7 @@ variables and settings
   --form-checkbox-medium: 1.125rem;
   --form-checkbox-large: 1.375rem;
   /* content layout sizes */
-  --content-width-narrow: 800px;
+  --content-width-narrow: 808px;
   --content-width: 1224px;
   --content-width-wide: 1432px;
   --documentation-width: 700px;
@@ -894,35 +894,6 @@ elemental html: h1, h2, h3, ul, li, etc.
   background: var(--primary-color-light);
 }
 
-.utah-design-system pre {
-  position: relative;
-  font-family: var(--fixed-width-font-family);
-  font-size: 0.95rem;
-  white-space: pre-wrap;
-  word-wrap: break-word;
-  margin: 0 0 var(--spacing) 0;
-}
-
-.utah-design-system pre.gray-block {
-  background: var(--gray-light-color);
-  padding: var(--spacing-s) var(--spacing);
-  border-radius: var(--radius-medium);
-}
-
-.utah-design-system pre.pre-block--overflow {
-  width: 100%;
-  overflow-x: scroll;
-  box-sizing: border-box;
-}
-
-.utah-design-system pre.pre-block--padded {
-  padding: 0 var(--spacing);
-}
-
-.utah-design-system pre .pre-block__overflow-content {
-  width: max-content;
-}
-
 .utah-design-system ul, .utah-design-system ol {
   padding: 0 0 0 var(--spacing-2xl);
   margin: 0;
@@ -966,11 +937,15 @@ containers and general design patterns, 2up, 3up, layout grids, etc.
 ############     _class-vars.scss      ############
 CSS Classes - SCSS Variables
 */
+.utah-design-system .accordion {
+  width: 100%;
+}
+
 .utah-design-system .accordion__header, .utah-design-system .accordion__header.button {
-  border-radius: 0;
-  font-size: var(--font-size-2xl);
+  border-radius: var(--radius-small);
+  font-size: var(--font-size-xl);
   font-weight: var(--font-weight-bold);
-  padding: var(--spacing);
+  padding: var(--spacing-s) var(--spacing);
   border: none;
   display: flex;
   flex-direction: row;
@@ -979,12 +954,24 @@ CSS Classes - SCSS Variables
   box-sizing: border-box;
 }
 
+.utah-design-system .accordion__header [class*=utds-icon-before-]::before, .utah-design-system .accordion__header.button [class*=utds-icon-before-]::before {
+  margin-right: 0;
+  font-size: 1.5rem;
+}
+
+.utah-design-system .accordion__header--open {
+  border-bottom-left-radius: 0;
+  border-bottom-right-radius: 0;
+}
+
 .utah-design-system .accordion__content {
   background: var(--gray-light-color);
   padding: 0;
   box-sizing: border-box;
   height: 0;
   overflow: hidden;
+  border-bottom-left-radius: var(--radius-small);
+  border-bottom-right-radius: var(--radius-small);
 }
 
 .utah-design-system .accordion__content--open {
@@ -2130,6 +2117,11 @@ base color swatches for the design system
   color: #699957;
 }
 
+.utah-design-system fieldset {
+  border: none;
+  padding: 0;
+}
+
 .utah-design-system .main-menu__wrapper {
   background-color: var(--gray-light-color);
   display: flex;
@@ -2178,9 +2170,13 @@ base color swatches for the design system
   line-height: 1.7;
 }
 
-.utah-design-system .horizontal-menu > ul li a[href] .icon-chevron-down, .utah-design-system .horizontal-menu > ul li button .icon-chevron-down {
-  font-size: 1rem;
-  margin-right: -2px;
+.utah-design-system .horizontal-menu > ul li a[href] .menu-item__menu-arrow, .utah-design-system .horizontal-menu > ul li button .menu-item__menu-arrow {
+  font-size: 0.65rem;
+  margin-left: var(--spacing-2xs);
+}
+
+.utah-design-system .horizontal-menu > ul li a[href] .menu-item__menu-arrow[class*=utds-icon-before-]::before, .utah-design-system .horizontal-menu > ul li button .menu-item__menu-arrow[class*=utds-icon-before-]::before {
+  margin-right: 0;
 }
 
 .utah-design-system .horizontal-menu > ul li a[href]:hover, .utah-design-system .horizontal-menu > ul li button:hover {
@@ -3196,7 +3192,7 @@ variables and settings
   --form-checkbox-medium: 1.125rem;
   --form-checkbox-large: 1.375rem;
   /* content layout sizes */
-  --content-width-narrow: 800px;
+  --content-width-narrow: 808px;
   --content-width: 1224px;
   --content-width-wide: 1432px;
   --documentation-width: 700px;
@@ -3641,6 +3637,11 @@ Media Sizes - SCSS Variables
   min-width: var(--documentation-right-width);
 }
 
+@media screen and (max-width: 1300px) {
+  .utah-design-system .documentation-template__content {
+    max-width: calc(100vw - 6 * var(--spacing-xl) - (var(--documentation-left-width)) - (var(--documentation-right-width)));
+  }
+}
 @media screen and (max-width: 1200px) {
   .utah-design-system .documentation-template__side-panel-left, .utah-design-system .documentation-template__side-panel-right {
     min-width: calc(var(--documentation-left-width) - 50px);
@@ -3699,6 +3700,40 @@ Media Sizes - SCSS Variables
     padding: 0 var(--spacing-l);
   }
 }
+.utah-design-system .pre-code__wrapper {
+  position: relative;
+  width: 100%;
+}
+
+.utah-design-system pre {
+  position: relative;
+  font-family: var(--fixed-width-font-family);
+  font-size: 0.95rem;
+  white-space: pre-wrap;
+  word-wrap: break-word;
+  margin: 0 0 var(--spacing) 0;
+}
+
+.utah-design-system pre.gray-block {
+  background: var(--gray-light-color);
+  padding: var(--spacing-s) var(--spacing-xl) var(--spacing-s) var(--spacing);
+  border-radius: var(--radius-medium);
+}
+
+.utah-design-system pre.pre-code--overflow {
+  width: 100%;
+  overflow-x: scroll;
+  box-sizing: border-box;
+}
+
+.utah-design-system pre.pre-code--padded {
+  padding: 0 var(--spacing);
+}
+
+.utah-design-system pre .pre-code__overflow-content {
+  width: max-content;
+}
+
 .utah-design-system input.input--height-small,
 .utah-design-system .input--height-small {
   min-height: var(--form-ele-small);

package/dist/utah-design-system.es.js

@@ -7,7 +7,7 @@ const index = "";
 const name = "@utahdts/utah-design-system";
 const description = "Utah Design System React Library";
 const displayName = "Utah Design System React Library";
-const version$1 = "0.9.2";
+const version$1 = "0.9.5";
 const exports = {
   ".": {
     "development-local": "./index.js",
@@ -65,7 +65,7 @@ const bugs = {
 };
 const homepage = "https://github.com/utahdts/utah-design-system";
 const dependencies = {
-  "@utahdts/utah-design-system-header": "0.9.2",
+  "@utahdts/utah-design-system-header": "0.9.5",
   lodash: "4.17.21",
   "prop-types": "15.8.1",
   react: "18.x",
@@ -79,17 +79,9 @@ const devDependencies = {
   "@types/react-dom": "18.2.4",
   "@vitejs/plugin-react": "4.0.0",
   "@vitest/coverage-istanbul": "0.31.2",
-  eslint: "8.41.0",
-  "eslint-config-airbnb": "19.0.4",
-  "eslint-plugin-import": "2.27.5",
-  "eslint-plugin-jsx-a11y": "6.7.1",
-  "eslint-plugin-react": "7.32.2",
-  "eslint-plugin-react-hooks": "4.6.0",
-  "eslint-plugin-react-refresh": "0.4.1",
   jsdom: "22.1.0",
   sass: "1.62.1",
   vite: "4.3.9",
-  "vite-plugin-eslint": "1.8.1",
   vitest: "0.31.2"
 };
 const type = "module";
@@ -2642,6 +2634,7 @@ const propTypes$S = {
   children: PropTypes.node.isRequired,
   className: PropTypes.string,
   contentClassName: PropTypes.string,
+  headingLevel: PropTypes.number,
   headerClassName: PropTypes.string,
   headerContent: PropTypes.node.isRequired,
   isOpen: PropTypes.bool,
@@ -2650,6 +2643,7 @@ const propTypes$S = {
 const defaultProps$S = {
   className: void 0,
   contentClassName: void 0,
+  headingLevel: 2,
   headerClassName: void 0,
   isOpen: void 0,
   onToggle: void 0
@@ -2658,6 +2652,7 @@ function Accordion({
   children,
   className,
   contentClassName,
+  headingLevel,
   headerClassName,
   headerContent,
   isOpen,
@@ -2674,16 +2669,17 @@ function Accordion({
       setStateIsOpen(!stateIsOpen);
     }
   }
+  const HeadingTag = `h${headingLevel}`;
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: joinClassNames(["accordion", className]), children: [
     /* @__PURE__ */ jsxRuntimeExports.jsxs(
       "button",
       {
-        className: joinClassNames(["accordion__header", headerClassName]),
+        className: joinClassNames(["accordion__header", headerClassName, stateIsOpen ? "accordion__header--open" : ""]),
         type: "button",
         onClick: handleEvent(toggleAccordion),
         children: [
-          headerContent,
-          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: `material-symbols-outlined icon-button__icon ${stateIsOpen ? "" : "icon-button__icon--rotate180"}`, children: "expand_circle_down" })
+          /* @__PURE__ */ jsxRuntimeExports.jsx(HeadingTag, { children: headerContent }),
+          /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: `utds-icon-before-circle-chevron-up icon-button__icon ${stateIsOpen ? "" : "icon-button__icon--rotate180"}` })
         ]
       }
     ),
@@ -36364,16 +36360,20 @@ const TableBodyDataRowContext = React__default.createContext({});
 const TableContext = createContext({
   allData: [],
   filteredData: [],
+  // eslint-disable-next-line no-console
   registerSortingRule: (sortingRule) => {
     console.error("Context not yet initialized: registerSortingRule", sortingRule);
   },
   // unregister a rule for sorting, generally when a <TableSortingRule> unmounts
+  // eslint-disable-next-line no-console
   unregisterSortingRule: (recordFieldPath) => {
     console.error("Context not yet initialized: unregisterSortingRule", recordFieldPath);
   },
+  // eslint-disable-next-line no-console
   setBodyDataForComponentGuid: (guid, allData, filteredData) => {
     console.error("Context not yet initialized: setBodyDataForComponentGuid", guid, allData, filteredData);
   },
+  // eslint-disable-next-line no-console
   setState: (arg) => {
     console.error("Context not yet initialized: setState", arg);
   },
@@ -36502,7 +36502,6 @@ function TableCell({
       ref: innerRef,
       onClick,
       onDoubleClick,
-      onKeyPress: () => console.log("what should keypress on td do?"),
       role: "gridcell",
       ...rest,
       children

package/dist/utah-design-system.umd.js

@@ -23,7 +23,7 @@
   const name = "@utahdts/utah-design-system";
   const description = "Utah Design System React Library";
   const displayName = "Utah Design System React Library";
-  const version$1 = "0.9.2";
+  const version$1 = "0.9.5";
   const exports$1 = {
     ".": {
       "development-local": "./index.js",
@@ -81,7 +81,7 @@
   };
   const homepage = "https://github.com/utahdts/utah-design-system";
   const dependencies = {
-    "@utahdts/utah-design-system-header": "0.9.2",
+    "@utahdts/utah-design-system-header": "0.9.5",
     lodash: "4.17.21",
     "prop-types": "15.8.1",
     react: "18.x",
@@ -95,17 +95,9 @@
     "@types/react-dom": "18.2.4",
     "@vitejs/plugin-react": "4.0.0",
     "@vitest/coverage-istanbul": "0.31.2",
-    eslint: "8.41.0",
-    "eslint-config-airbnb": "19.0.4",
-    "eslint-plugin-import": "2.27.5",
-    "eslint-plugin-jsx-a11y": "6.7.1",
-    "eslint-plugin-react": "7.32.2",
-    "eslint-plugin-react-hooks": "4.6.0",
-    "eslint-plugin-react-refresh": "0.4.1",
     jsdom: "22.1.0",
     sass: "1.62.1",
     vite: "4.3.9",
-    "vite-plugin-eslint": "1.8.1",
     vitest: "0.31.2"
   };
   const type = "module";
@@ -2658,6 +2650,7 @@
     children: PropTypes.node.isRequired,
     className: PropTypes.string,
     contentClassName: PropTypes.string,
+    headingLevel: PropTypes.number,
     headerClassName: PropTypes.string,
     headerContent: PropTypes.node.isRequired,
     isOpen: PropTypes.bool,
@@ -2666,6 +2659,7 @@
   const defaultProps$S = {
     className: void 0,
     contentClassName: void 0,
+    headingLevel: 2,
     headerClassName: void 0,
     isOpen: void 0,
     onToggle: void 0
@@ -2674,6 +2668,7 @@
     children,
     className,
     contentClassName,
+    headingLevel,
     headerClassName,
     headerContent,
     isOpen,
@@ -2690,16 +2685,17 @@
         setStateIsOpen(!stateIsOpen);
       }
     }
+    const HeadingTag = `h${headingLevel}`;
     return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: joinClassNames(["accordion", className]), children: [
       /* @__PURE__ */ jsxRuntimeExports.jsxs(
         "button",
         {
-          className: joinClassNames(["accordion__header", headerClassName]),
+          className: joinClassNames(["accordion__header", headerClassName, stateIsOpen ? "accordion__header--open" : ""]),
           type: "button",
           onClick: handleEvent(toggleAccordion),
           children: [
-            headerContent,
-            /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: `material-symbols-outlined icon-button__icon ${stateIsOpen ? "" : "icon-button__icon--rotate180"}`, children: "expand_circle_down" })
+            /* @__PURE__ */ jsxRuntimeExports.jsx(HeadingTag, { children: headerContent }),
+            /* @__PURE__ */ jsxRuntimeExports.jsx("span", { className: `utds-icon-before-circle-chevron-up icon-button__icon ${stateIsOpen ? "" : "icon-button__icon--rotate180"}` })
           ]
         }
       ),
@@ -36380,16 +36376,20 @@
   const TableContext = React.createContext({
     allData: [],
     filteredData: [],
+    // eslint-disable-next-line no-console
     registerSortingRule: (sortingRule) => {
       console.error("Context not yet initialized: registerSortingRule", sortingRule);
     },
     // unregister a rule for sorting, generally when a <TableSortingRule> unmounts
+    // eslint-disable-next-line no-console
     unregisterSortingRule: (recordFieldPath) => {
       console.error("Context not yet initialized: unregisterSortingRule", recordFieldPath);
     },
+    // eslint-disable-next-line no-console
     setBodyDataForComponentGuid: (guid, allData, filteredData) => {
       console.error("Context not yet initialized: setBodyDataForComponentGuid", guid, allData, filteredData);
     },
+    // eslint-disable-next-line no-console
     setState: (arg) => {
       console.error("Context not yet initialized: setState", arg);
     },
@@ -36518,7 +36518,6 @@
         ref: innerRef,
         onClick,
         onDoubleClick,
-        onKeyPress: () => console.log("what should keypress on td do?"),
         role: "gridcell",
         ...rest,
         children

package/package.json

@@ -2,7 +2,7 @@
   "name": "@utahdts/utah-design-system",
   "description": "Utah Design System React Library",
   "displayName": "Utah Design System React Library",
-  "version": "0.9.2",
+  "version": "0.9.5",
   "exports": {
     ".": {
       "development-local": "./index.js",
@@ -60,7 +60,7 @@
   },
   "homepage": "https://github.com/utahdts/utah-design-system",
   "dependencies": {
-    "@utahdts/utah-design-system-header": "0.9.2",
+    "@utahdts/utah-design-system-header": "0.9.5",
     "lodash": "4.17.21",
     "prop-types": "15.8.1",
     "react": "18.x",
@@ -74,17 +74,9 @@
     "@types/react-dom": "18.2.4",
     "@vitejs/plugin-react": "4.0.0",
     "@vitest/coverage-istanbul": "0.31.2",
-    "eslint": "8.41.0",
-    "eslint-config-airbnb": "19.0.4",
-    "eslint-plugin-import": "2.27.5",
-    "eslint-plugin-jsx-a11y": "6.7.1",
-    "eslint-plugin-react": "7.32.2",
-    "eslint-plugin-react-hooks": "4.6.0",
-    "eslint-plugin-react-refresh": "0.4.1",
     "jsdom": "22.1.0",
     "sass": "1.62.1",
     "vite": "4.3.9",
-    "vite-plugin-eslint": "1.8.1",
     "vitest": "0.31.2"
   },
   "type": "module"

package/react/components/containers/accordion/Accordion.jsx

@@ -7,6 +7,7 @@ const propTypes = {
   children: PropTypes.node.isRequired,
   className: PropTypes.string,
   contentClassName: PropTypes.string,
+  headingLevel: PropTypes.number,
   headerClassName: PropTypes.string,
   headerContent: PropTypes.node.isRequired,
   isOpen: PropTypes.bool,
@@ -15,6 +16,7 @@ const propTypes = {
 const defaultProps = {
   className: undefined,
   contentClassName: undefined,
+  headingLevel: 2,
   headerClassName: undefined,
   isOpen: undefined,
   onToggle: undefined,
@@ -24,6 +26,7 @@ function Accordion({
   children,
   className,
   contentClassName,
+  headingLevel,
   headerClassName,
   headerContent,
   isOpen,
@@ -42,15 +45,17 @@ function Accordion({
       setStateIsOpen(!stateIsOpen);
     }
   }
+  const HeadingTag = `h${headingLevel}`;
+
   return (
     <div className={joinClassNames(['accordion', className])}>
       <button
-        className={joinClassNames(['accordion__header', headerClassName])}
+        className={joinClassNames(['accordion__header', headerClassName, stateIsOpen ? 'accordion__header--open' : ''])}
         type="button"
         onClick={handleEvent(toggleAccordion)}
       >
-        {headerContent}
-        <span className={`material-symbols-outlined icon-button__icon ${stateIsOpen ? '' : 'icon-button__icon--rotate180'}`}>expand_circle_down</span>
+        <HeadingTag>{headerContent}</HeadingTag>
+        <span className={`utds-icon-before-circle-chevron-up icon-button__icon ${stateIsOpen ? '' : 'icon-button__icon--rotate180'}`} />
       </button>
 
       <div className={joinClassNames(['accordion__content', contentClassName, stateIsOpen ? 'accordion__content--open' : ''])}>

package/react/components/table/TableCell.jsx

@@ -35,7 +35,6 @@ function TableCell({
       ref={innerRef}
       onClick={onClick}
       onDoubleClick={onDoubleClick}
-      onKeyPress={() => console.log('what should keypress on td do?')}
       role="gridcell"
       {...rest}
     >

package/react/components/table/util/TableContext.jsx

@@ -3,10 +3,14 @@ import { createContext } from 'react';
 const TableContext = createContext({
   allData: [],
   filteredData: [],
+  // eslint-disable-next-line no-console
   registerSortingRule: (sortingRule) => { console.error('Context not yet initialized: registerSortingRule', sortingRule); },
   // unregister a rule for sorting, generally when a <TableSortingRule> unmounts
+  // eslint-disable-next-line no-console
   unregisterSortingRule: (recordFieldPath) => { console.error('Context not yet initialized: unregisterSortingRule', recordFieldPath); },
+  // eslint-disable-next-line no-console
   setBodyDataForComponentGuid: (guid, allData, filteredData) => { console.error('Context not yet initialized: setBodyDataForComponentGuid', guid, allData, filteredData); },
+  // eslint-disable-next-line no-console
   setState: (arg) => { console.error('Context not yet initialized: setState', arg); },
   state: {},
 });