@digigov/react-core 0.17.2 → 0.18.1

package/esm/TableHeadCell/__snapshots__/index.test.tsx.snap

@@ -4,32 +4,31 @@ exports[`renders the Table with dataType="numeric" prop 1`] = `
 <ForwardRef(TableHeadCell)
   dataType="numeric"
 >
-  <th
+  <ForwardRef(Base)
+    as="th"
     className="govgr-table__header--numeric govgr-table__header"
   >
-    hello
-  </th>
+    <th
+      className="govgr-table__header--numeric govgr-table__header"
+    >
+      hello
+    </th>
+  </ForwardRef(Base)>
 </ForwardRef(TableHeadCell)>
 `;
 
 exports[`renders the Table with no props 1`] = `
 <ForwardRef(TableHeadCell)>
-  <th
+  <ForwardRef(Base)
+    as="th"
     className="govgr-table__header"
   >
-    hello
-  </th>
-</ForwardRef(TableHeadCell)>
-`;
-
-exports[`renders the TableHeadCell dataType="numeric" and  with cellWidth=full 1`] = `
-<ForwardRef(TableHeadCell)
-  cellWidth="full"
-  dataType="numeric"
->
-  <th
-    className="govgr-table__header--numeric govgr-!-width-full govgr-table__header"
-  />
+    <th
+      className="govgr-table__header"
+    >
+      hello
+    </th>
+  </ForwardRef(Base)>
 </ForwardRef(TableHeadCell)>
 `;
 
@@ -38,9 +37,14 @@ exports[`renders the TableHeadCell dataType="numeric" and with cellWidth=full 1`
   cellWidth="full"
   dataType="numeric"
 >
-  <th
+  <ForwardRef(Base)
+    as="th"
     className="govgr-table__header--numeric govgr-!-width-full govgr-table__header"
-  />
+  >
+    <th
+      className="govgr-table__header--numeric govgr-!-width-full govgr-table__header"
+    />
+  </ForwardRef(Base)>
 </ForwardRef(TableHeadCell)>
 `;
 
@@ -48,9 +52,14 @@ exports[`renders the TableHeadCell with cellWidth=full 1`] = `
 <ForwardRef(TableHeadCell)
   cellWidth="full"
 >
-  <th
+  <ForwardRef(Base)
+    as="th"
     className="govgr-!-width-full govgr-table__header"
-  />
+  >
+    <th
+      className="govgr-!-width-full govgr-table__header"
+    />
+  </ForwardRef(Base)>
 </ForwardRef(TableHeadCell)>
 `;
 
@@ -58,9 +67,14 @@ exports[`renders the TableHeadCell with cellWidth=one-half 1`] = `
 <ForwardRef(TableHeadCell)
   cellWidth="one-half"
 >
-  <th
+  <ForwardRef(Base)
+    as="th"
     className="govgr-!-width-one-half govgr-table__header"
-  />
+  >
+    <th
+      className="govgr-!-width-one-half govgr-table__header"
+    />
+  </ForwardRef(Base)>
 </ForwardRef(TableHeadCell)>
 `;
 
@@ -68,9 +82,14 @@ exports[`renders the TableHeadCell with cellWidth=one-quarter 1`] = `
 <ForwardRef(TableHeadCell)
   cellWidth="one-quarter"
 >
-  <th
+  <ForwardRef(Base)
+    as="th"
     className="govgr-!-width-one-quarter govgr-table__header"
-  />
+  >
+    <th
+      className="govgr-!-width-one-quarter govgr-table__header"
+    />
+  </ForwardRef(Base)>
 </ForwardRef(TableHeadCell)>
 `;
 
@@ -78,9 +97,14 @@ exports[`renders the TableHeadCell with cellWidth=one-third 1`] = `
 <ForwardRef(TableHeadCell)
   cellWidth="one-third"
 >
-  <th
+  <ForwardRef(Base)
+    as="th"
     className="govgr-!-width-one-third govgr-table__header"
-  />
+  >
+    <th
+      className="govgr-!-width-one-third govgr-table__header"
+    />
+  </ForwardRef(Base)>
 </ForwardRef(TableHeadCell)>
 `;
 
@@ -88,9 +112,14 @@ exports[`renders the TableHeadCell with cellWidth=three-quarters 1`] = `
 <ForwardRef(TableHeadCell)
   cellWidth="three-quarters"
 >
-  <th
+  <ForwardRef(Base)
+    as="th"
     className="govgr-!-width-three-quarters govgr-table__header"
-  />
+  >
+    <th
+      className="govgr-!-width-three-quarters govgr-table__header"
+    />
+  </ForwardRef(Base)>
 </ForwardRef(TableHeadCell)>
 `;
 
@@ -98,31 +127,14 @@ exports[`renders the TableHeadCell with cellWidth=two-thirds 1`] = `
 <ForwardRef(TableHeadCell)
   cellWidth="two-thirds"
 >
-  <th
+  <ForwardRef(Base)
+    as="th"
     className="govgr-!-width-two-thirds govgr-table__header"
-  />
-</ForwardRef(TableHeadCell)>
-`;
-
-exports[`renders the TableHeadCell with dataType="numeric" and  cellWidth=three-quarters 1`] = `
-<ForwardRef(TableHeadCell)
-  cellWidth="three-quarters"
-  dataType="numeric"
->
-  <th
-    className="govgr-!-width-three-quarters govgr-table__header--numeric govgr-table__header"
-  />
-</ForwardRef(TableHeadCell)>
-`;
-
-exports[`renders the TableHeadCell with dataType="numeric" and  cellWidth=two-thirds 1`] = `
-<ForwardRef(TableHeadCell)
-  cellWidth="two-thirds"
-  dataType="numeric"
->
-  <th
-    className="govgr-!-width-two-thirds govgr-table__header--numeric govgr-table__header"
-  />
+  >
+    <th
+      className="govgr-!-width-two-thirds govgr-table__header"
+    />
+  </ForwardRef(Base)>
 </ForwardRef(TableHeadCell)>
 `;
 
@@ -131,9 +143,14 @@ exports[`renders the TableHeadCell with dataType="numeric" and cellWidth=one-thi
   cellWidth="one-third"
   dataType="numeric"
 >
-  <th
+  <ForwardRef(Base)
+    as="th"
     className="govgr-!-width-one-third govgr-table__header--numeric govgr-table__header"
-  />
+  >
+    <th
+      className="govgr-!-width-one-third govgr-table__header--numeric govgr-table__header"
+    />
+  </ForwardRef(Base)>
 </ForwardRef(TableHeadCell)>
 `;
 
@@ -142,9 +159,14 @@ exports[`renders the TableHeadCell with dataType="numeric" and cellWidth=three-q
   cellWidth="three-quarters"
   dataType="numeric"
 >
-  <th
+  <ForwardRef(Base)
+    as="th"
     className="govgr-!-width-three-quarters govgr-table__header--numeric govgr-table__header"
-  />
+  >
+    <th
+      className="govgr-!-width-three-quarters govgr-table__header--numeric govgr-table__header"
+    />
+  </ForwardRef(Base)>
 </ForwardRef(TableHeadCell)>
 `;
 
@@ -153,9 +175,14 @@ exports[`renders the TableHeadCell with dataType="numeric" and cellWidth=two-thi
   cellWidth="two-thirds"
   dataType="numeric"
 >
-  <th
+  <ForwardRef(Base)
+    as="th"
     className="govgr-!-width-two-thirds govgr-table__header--numeric govgr-table__header"
-  />
+  >
+    <th
+      className="govgr-!-width-two-thirds govgr-table__header--numeric govgr-table__header"
+    />
+  </ForwardRef(Base)>
 </ForwardRef(TableHeadCell)>
 `;
 
@@ -164,9 +191,14 @@ exports[`renders the TableHeadCell with dataType="numeric" and dataType="numeric
   cellWidth="one-half"
   dataType="numeric"
 >
-  <th
+  <ForwardRef(Base)
+    as="th"
     className="govgr-!-width-one-half govgr-table__header--numeric govgr-table__header"
-  />
+  >
+    <th
+      className="govgr-!-width-one-half govgr-table__header--numeric govgr-table__header"
+    />
+  </ForwardRef(Base)>
 </ForwardRef(TableHeadCell)>
 `;
 
@@ -175,8 +207,13 @@ exports[`renders the TableHeadCell with dataType="numeric" cellWidth=one-quarter
   cellWidth="one-quarter"
   dataType="numeric"
 >
-  <th
+  <ForwardRef(Base)
+    as="th"
     className="govgr-!-width-one-quarter govgr-table__header--numeric govgr-table__header"
-  />
+  >
+    <th
+      className="govgr-!-width-one-quarter govgr-table__header--numeric govgr-table__header"
+    />
+  </ForwardRef(Base)>
 </ForwardRef(TableHeadCell)>
 `;

package/esm/TableNoDataRow/__snapshots__/index.test.tsx.snap

@@ -5,12 +5,18 @@ exports[`renders the Table with no props 1`] = `
   <tr
     className="govgr-table__row"
   >
-    <td
+    <ForwardRef(Base)
+      as="td"
       className="govgr-table__cell--no-data"
       colSpan={100}
     >
-      hello
-    </td>
+      <td
+        className="govgr-table__cell--no-data"
+        colSpan={100}
+      >
+        hello
+      </td>
+    </ForwardRef(Base)>
   </tr>
 </ForwardRef(TableNoDataRow)>
 `;

package/esm/TableRow/__snapshots__/index.test.tsx.snap

@@ -2,10 +2,15 @@
 
 exports[`renders the Table with no props 1`] = `
 <ForwardRef(TableRow)>
-  <tr
+  <ForwardRef(Base)
+    as="tr"
     className="govgr-table__row"
   >
-    hello
-  </tr>
+    <tr
+      className="govgr-table__row"
+    >
+      hello
+    </tr>
+  </ForwardRef(Base)>
 </ForwardRef(TableRow)>
 `;

package/esm/Tabs/__snapshots__/index.test.tsx.snap

@@ -2,10 +2,15 @@
 
 exports[`renders the Tabs with no props 1`] = `
 <ForwardRef(Tabs)>
-  <div
+  <ForwardRef(Base)
+    as="div"
     className="govgr-tabs"
   >
-    hello
-  </div>
+    <div
+      className="govgr-tabs"
+    >
+      hello
+    </div>
+  </ForwardRef(Base)>
 </ForwardRef(Tabs)>
 `;

package/esm/TabsHeading/__snapshots__/index.test.tsx.snap

@@ -2,11 +2,16 @@
 
 exports[`renders the TabsHeading with no props 1`] = `
 <ForwardRef(TabsHeading)>
-  <h6
+  <ForwardRef(Base)
+    as="h6"
     className="govgr-heading-s govgr-tabs__title"
   >
-    hello
-  </h6>
+    <h6
+      className="govgr-heading-s govgr-tabs__title"
+    >
+      hello
+    </h6>
+  </ForwardRef(Base)>
 </ForwardRef(TabsHeading)>
 `;
 
@@ -14,11 +19,16 @@ exports[`renders the TabsHeading with size=m 1`] = `
 <ForwardRef(TabsHeading)
   size="m"
 >
-  <h6
+  <ForwardRef(Base)
+    as="h6"
     className="govgr-heading-m govgr-tabs__title"
   >
-    hello
-  </h6>
+    <h6
+      className="govgr-heading-m govgr-tabs__title"
+    >
+      hello
+    </h6>
+  </ForwardRef(Base)>
 </ForwardRef(TabsHeading)>
 `;
 
@@ -26,10 +36,15 @@ exports[`renders the TabsHeading with size=s 1`] = `
 <ForwardRef(TabsHeading)
   size="s"
 >
-  <h6
+  <ForwardRef(Base)
+    as="h6"
     className="govgr-heading-s govgr-tabs__title"
   >
-    hello
-  </h6>
+    <h6
+      className="govgr-heading-s govgr-tabs__title"
+    >
+      hello
+    </h6>
+  </ForwardRef(Base)>
 </ForwardRef(TabsHeading)>
 `;

package/esm/TabsList/__snapshots__/index.test.tsx.snap

@@ -2,11 +2,17 @@
 
 exports[`renders the TabsList with no props 1`] = `
 <ForwardRef(TabsList)>
-  <ul
+  <ForwardRef(Base)
+    as="ul"
     className="govgr-tabs__list"
     role="tablist"
   >
-    hello
-  </ul>
+    <ul
+      className="govgr-tabs__list"
+      role="tablist"
+    >
+      hello
+    </ul>
+  </ForwardRef(Base)>
 </ForwardRef(TabsList)>
 `;

package/esm/TabsListItem/__snapshots__/index.test.tsx.snap

@@ -7,13 +7,24 @@ exports[`renders the TabsListItem with href and selected=false 1`] = `
 >
   <li
     className="govgr-tabs__list-item"
+    role="presentation"
   >
-    <a
+    <ForwardRef(Base)
+      aria-selected={false}
+      as="a"
       className="govgr-tabs__tab"
       href="/"
+      role="tab"
     >
-      hello
-    </a>
+      <a
+        aria-selected={false}
+        className="govgr-tabs__tab"
+        href="/"
+        role="tab"
+      >
+        hello
+      </a>
+    </ForwardRef(Base)>
   </li>
 </ForwardRef(TabsListItem)>
 `;
@@ -22,12 +33,20 @@ exports[`renders the TabsListItem with no props 1`] = `
 <ForwardRef(TabsListItem)>
   <li
     className="govgr-tabs__list-item"
+    role="presentation"
   >
-    <a
+    <ForwardRef(Base)
+      as="a"
       className="govgr-tabs__tab"
+      role="tab"
     >
-      hello
-    </a>
+      <a
+        className="govgr-tabs__tab"
+        role="tab"
+      >
+        hello
+      </a>
+    </ForwardRef(Base)>
   </li>
 </ForwardRef(TabsListItem)>
 `;
@@ -38,12 +57,22 @@ exports[`renders the TabsListItem with selected=false 1`] = `
 >
   <li
     className="govgr-tabs__list-item"
+    role="presentation"
   >
-    <a
+    <ForwardRef(Base)
+      aria-selected={false}
+      as="a"
       className="govgr-tabs__tab"
+      role="tab"
     >
-      hello
-    </a>
+      <a
+        aria-selected={false}
+        className="govgr-tabs__tab"
+        role="tab"
+      >
+        hello
+      </a>
+    </ForwardRef(Base)>
   </li>
 </ForwardRef(TabsListItem)>
 `;
@@ -54,12 +83,22 @@ exports[`renders the TabsListItem with selected=true 1`] = `
 >
   <li
     className="govgr-tabs__list-item-selected govgr-tabs__list-item"
+    role="presentation"
   >
-    <a
+    <ForwardRef(Base)
+      aria-selected={true}
+      as="a"
       className="govgr-tabs__tab"
+      role="tab"
     >
-      hello
-    </a>
+      <a
+        aria-selected={true}
+        className="govgr-tabs__tab"
+        role="tab"
+      >
+        hello
+      </a>
+    </ForwardRef(Base)>
   </li>
 </ForwardRef(TabsListItem)>
 `;
@@ -71,13 +110,24 @@ exports[`renders the TabsListItem with selected=true 2`] = `
 >
   <li
     className="govgr-tabs__list-item-selected govgr-tabs__list-item"
+    role="presentation"
   >
-    <a
+    <ForwardRef(Base)
+      aria-selected={true}
+      as="a"
       className="govgr-tabs__tab"
       href="/"
+      role="tab"
     >
-      hello
-    </a>
+      <a
+        aria-selected={true}
+        className="govgr-tabs__tab"
+        href="/"
+        role="tab"
+      >
+        hello
+      </a>
+    </ForwardRef(Base)>
   </li>
 </ForwardRef(TabsListItem)>
 `;

package/esm/TabsPanel/__snapshots__/index.test.tsx.snap

@@ -4,11 +4,20 @@ exports[`renders the TabsPanel with active 1`] = `
 <ForwardRef(TabsPanel)
   active={true}
 >
-  <div
+  <ForwardRef(Base)
+    aria-hidden={false}
+    as="div"
     className="govgr-tabs__panel-visible govgr-tabs__panel"
+    role="tabpanel"
   >
-    hello
-  </div>
+    <div
+      aria-hidden={false}
+      className="govgr-tabs__panel-visible govgr-tabs__panel"
+      role="tabpanel"
+    >
+      hello
+    </div>
+  </ForwardRef(Base)>
 </ForwardRef(TabsPanel)>
 `;
 
@@ -16,11 +25,20 @@ exports[`renders the TabsPanel with active=false 1`] = `
 <ForwardRef(TabsPanel)
   active={false}
 >
-  <div
+  <ForwardRef(Base)
+    aria-hidden={true}
+    as="div"
     className="govgr-tabs__panel"
+    role="tabpanel"
   >
-    hello
-  </div>
+    <div
+      aria-hidden={true}
+      className="govgr-tabs__panel"
+      role="tabpanel"
+    >
+      hello
+    </div>
+  </ForwardRef(Base)>
 </ForwardRef(TabsPanel)>
 `;
 
@@ -28,20 +46,38 @@ exports[`renders the TabsPanel with active=true 1`] = `
 <ForwardRef(TabsPanel)
   active={true}
 >
-  <div
+  <ForwardRef(Base)
+    aria-hidden={false}
+    as="div"
     className="govgr-tabs__panel-visible govgr-tabs__panel"
+    role="tabpanel"
   >
-    hello
-  </div>
+    <div
+      aria-hidden={false}
+      className="govgr-tabs__panel-visible govgr-tabs__panel"
+      role="tabpanel"
+    >
+      hello
+    </div>
+  </ForwardRef(Base)>
 </ForwardRef(TabsPanel)>
 `;
 
 exports[`renders the TabsPanel with no props 1`] = `
 <ForwardRef(TabsPanel)>
-  <div
+  <ForwardRef(Base)
+    aria-hidden={true}
+    as="div"
     className="govgr-tabs__panel"
+    role="tabpanel"
   >
-    hello
-  </div>
+    <div
+      aria-hidden={true}
+      className="govgr-tabs__panel"
+      role="tabpanel"
+    >
+      hello
+    </div>
+  </ForwardRef(Base)>
 </ForwardRef(TabsPanel)>
 `;