@digigov/react-core 0.17.2 → 0.18.1

package/es/FieldsetLegend/__snapshots__/index.test.tsx.snap

@@ -5,13 +5,20 @@ exports[`renders the FieldsetLegend with heading and size l props 1`] = `
   heading={true}
   size="l"
 >
-  <legend
+  <ForwardRef(Base)
     aria-level={1}
+    as="legend"
     className="govgr-heading-l govgr-fieldset__legend"
     role="heading"
   >
-    This is FieldsetLegend with no props
-  </legend>
+    <legend
+      aria-level={1}
+      className="govgr-heading-l govgr-fieldset__legend"
+      role="heading"
+    >
+      This is FieldsetLegend with no props
+    </legend>
+  </ForwardRef(Base)>
 </ForwardRef(FieldsetLegend)>
 `;
 
@@ -20,13 +27,20 @@ exports[`renders the FieldsetLegend with heading and size m props 1`] = `
   heading={true}
   size="m"
 >
-  <legend
+  <ForwardRef(Base)
     aria-level={1}
+    as="legend"
     className="govgr-heading-m govgr-fieldset__legend"
     role="heading"
   >
-    This is FieldsetLegend with no props
-  </legend>
+    <legend
+      aria-level={1}
+      className="govgr-heading-m govgr-fieldset__legend"
+      role="heading"
+    >
+      This is FieldsetLegend with no props
+    </legend>
+  </ForwardRef(Base)>
 </ForwardRef(FieldsetLegend)>
 `;
 
@@ -35,13 +49,20 @@ exports[`renders the FieldsetLegend with heading and size s props 1`] = `
   heading={true}
   size="s"
 >
-  <legend
+  <ForwardRef(Base)
     aria-level={1}
+    as="legend"
     className="govgr-heading-s govgr-fieldset__legend"
     role="heading"
   >
-    This is FieldsetLegend with no props
-  </legend>
+    <legend
+      aria-level={1}
+      className="govgr-heading-s govgr-fieldset__legend"
+      role="heading"
+    >
+      This is FieldsetLegend with no props
+    </legend>
+  </ForwardRef(Base)>
 </ForwardRef(FieldsetLegend)>
 `;
 
@@ -50,13 +71,20 @@ exports[`renders the FieldsetLegend with heading and size xl props 1`] = `
   heading={true}
   size="xl"
 >
-  <legend
+  <ForwardRef(Base)
     aria-level={1}
+    as="legend"
     className="govgr-heading-xl govgr-fieldset__legend"
     role="heading"
   >
-    This is FieldsetLegend with no props
-  </legend>
+    <legend
+      aria-level={1}
+      className="govgr-heading-xl govgr-fieldset__legend"
+      role="heading"
+    >
+      This is FieldsetLegend with no props
+    </legend>
+  </ForwardRef(Base)>
 </ForwardRef(FieldsetLegend)>
 `;
 
@@ -64,23 +92,35 @@ exports[`renders the FieldsetLegend with heading props 1`] = `
 <ForwardRef(FieldsetLegend)
   heading={true}
 >
-  <legend
+  <ForwardRef(Base)
     aria-level={1}
+    as="legend"
     className="govgr-heading-l govgr-fieldset__legend"
     role="heading"
   >
-    This is FieldsetLegend with no props
-  </legend>
+    <legend
+      aria-level={1}
+      className="govgr-heading-l govgr-fieldset__legend"
+      role="heading"
+    >
+      This is FieldsetLegend with no props
+    </legend>
+  </ForwardRef(Base)>
 </ForwardRef(FieldsetLegend)>
 `;
 
 exports[`renders the FieldsetLegend with no props 1`] = `
 <ForwardRef(FieldsetLegend)>
-  <legend
+  <ForwardRef(Base)
+    as="legend"
     className="govgr-heading-l govgr-fieldset__legend"
   >
-    This is FieldsetLegend with no props
-  </legend>
+    <legend
+      className="govgr-heading-l govgr-fieldset__legend"
+    >
+      This is FieldsetLegend with no props
+    </legend>
+  </ForwardRef(Base)>
 </ForwardRef(FieldsetLegend)>
 `;
 
@@ -88,11 +128,16 @@ exports[`renders the FieldsetLegend with size l props 1`] = `
 <ForwardRef(FieldsetLegend)
   size="l"
 >
-  <legend
+  <ForwardRef(Base)
+    as="legend"
     className="govgr-heading-l govgr-fieldset__legend"
   >
-    This is FieldsetLegend with no props
-  </legend>
+    <legend
+      className="govgr-heading-l govgr-fieldset__legend"
+    >
+      This is FieldsetLegend with no props
+    </legend>
+  </ForwardRef(Base)>
 </ForwardRef(FieldsetLegend)>
 `;
 
@@ -100,11 +145,16 @@ exports[`renders the FieldsetLegend with size m props 1`] = `
 <ForwardRef(FieldsetLegend)
   size="m"
 >
-  <legend
+  <ForwardRef(Base)
+    as="legend"
     className="govgr-heading-m govgr-fieldset__legend"
   >
-    This is FieldsetLegend with no props
-  </legend>
+    <legend
+      className="govgr-heading-m govgr-fieldset__legend"
+    >
+      This is FieldsetLegend with no props
+    </legend>
+  </ForwardRef(Base)>
 </ForwardRef(FieldsetLegend)>
 `;
 
@@ -112,11 +162,16 @@ exports[`renders the FieldsetLegend with size s props 1`] = `
 <ForwardRef(FieldsetLegend)
   size="s"
 >
-  <legend
+  <ForwardRef(Base)
+    as="legend"
     className="govgr-heading-s govgr-fieldset__legend"
   >
-    This is FieldsetLegend with no props
-  </legend>
+    <legend
+      className="govgr-heading-s govgr-fieldset__legend"
+    >
+      This is FieldsetLegend with no props
+    </legend>
+  </ForwardRef(Base)>
 </ForwardRef(FieldsetLegend)>
 `;
 
@@ -124,10 +179,15 @@ exports[`renders the FieldsetLegend with size xl props 1`] = `
 <ForwardRef(FieldsetLegend)
   size="xl"
 >
-  <legend
+  <ForwardRef(Base)
+    as="legend"
     className="govgr-heading-xl govgr-fieldset__legend"
   >
-    This is FieldsetLegend with no props
-  </legend>
+    <legend
+      className="govgr-heading-xl govgr-fieldset__legend"
+    >
+      This is FieldsetLegend with no props
+    </legend>
+  </ForwardRef(Base)>
 </ForwardRef(FieldsetLegend)>
 `;

package/es/FileUpload/__snapshots__/index.test.tsx.snap

@@ -4,27 +4,58 @@ exports[`renders the FileUpload with name prop 1`] = `
 <ForwardRef(FileUpload)
   name="some-name"
 >
-  <div
-    className="upload-file"
+  <ForwardRef(Base)
+    as="label"
+    className="govgr-btn govgr-btn-secondary govgr-label-file"
+    role="button"
+    tabIndex={0}
   >
-    <input
-      className="govgr-file-input"
-      name="some-name"
-      type="file"
-    />
-  </div>
+    <label
+      className="govgr-btn govgr-btn-secondary govgr-label-file"
+      role="button"
+      tabIndex={0}
+    >
+      <ForwardRef(Base)
+        as="input"
+        className="govgr-file-input"
+        name="some-name"
+        type="file"
+      >
+        <input
+          className="govgr-file-input"
+          name="some-name"
+          type="file"
+        />
+      </ForwardRef(Base)>
+    </label>
+  </ForwardRef(Base)>
 </ForwardRef(FileUpload)>
 `;
 
 exports[`renders the FileUpload with no props 1`] = `
 <ForwardRef(FileUpload)>
-  <div
-    className="upload-file"
+  <ForwardRef(Base)
+    as="label"
+    className="govgr-btn govgr-btn-secondary govgr-label-file"
+    role="button"
+    tabIndex={0}
   >
-    <input
-      className="govgr-file-input"
-      type="file"
-    />
-  </div>
+    <label
+      className="govgr-btn govgr-btn-secondary govgr-label-file"
+      role="button"
+      tabIndex={0}
+    >
+      <ForwardRef(Base)
+        as="input"
+        className="govgr-file-input"
+        type="file"
+      >
+        <input
+          className="govgr-file-input"
+          type="file"
+        />
+      </ForwardRef(Base)>
+    </label>
+  </ForwardRef(Base)>
 </ForwardRef(FileUpload)>
 `;

package/es/Footer/__snapshots__/index.test.tsx.snap

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

package/es/FooterContainer/__snapshots__/index.test.tsx.snap

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

package/es/FooterContent/__snapshots__/index.test.tsx.snap

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

package/es/FooterContentLogos/__snapshots__/index.test.tsx.snap

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

package/es/FooterHeading/__snapshots__/index.test.tsx.snap

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

package/es/FooterImage/__snapshots__/index.test.tsx.snap

@@ -2,9 +2,15 @@
 
 exports[`renders the FooterImage with no props 1`] = `
 <ForwardRef(FooterImage)>
-  <img
+  <ForwardRef(Base)
     alt="footer logo"
+    as="img"
     className="govgr-footer__logo"
-  />
+  >
+    <img
+      alt="footer logo"
+      className="govgr-footer__logo"
+    />
+  </ForwardRef(Base)>
 </ForwardRef(FooterImage)>
 `;

package/es/FooterInlineList/__snapshots__/index.test.tsx.snap

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

package/es/FooterInlineListItem/__snapshots__/index.test.tsx.snap

@@ -2,15 +2,15 @@
 
 exports[`renders the FooterInlineListItem with no props 1`] = `
 <ForwardRef(FooterInlineListItem)>
-  <li
+  <ForwardRef(Base)
+    as="li"
     className="govgr-footer__inline-list-item"
   >
-    <a
-      className="govgr-footer__link"
-      href="/"
+    <li
+      className="govgr-footer__inline-list-item"
     >
       hello
-    </a>
-  </li>
+    </li>
+  </ForwardRef(Base)>
 </ForwardRef(FooterInlineListItem)>
 `;

package/es/FooterLink/__snapshots__/index.test.tsx.snap

@@ -4,21 +4,32 @@ exports[`renders the FooterLink with href prop 1`] = `
 <ForwardRef(FooterLink)
   href="#"
 >
-  <a
+  <ForwardRef(Base)
+    as="a"
     className="govgr-footer__link"
     href="#"
   >
-    hello
-  </a>
+    <a
+      className="govgr-footer__link"
+      href="#"
+    >
+      hello
+    </a>
+  </ForwardRef(Base)>
 </ForwardRef(FooterLink)>
 `;
 
 exports[`renders the FooterLink with no props 1`] = `
 <ForwardRef(FooterLink)>
-  <a
+  <ForwardRef(Base)
+    as="a"
     className="govgr-footer__link"
   >
-    hello
-  </a>
+    <a
+      className="govgr-footer__link"
+    >
+      hello
+    </a>
+  </ForwardRef(Base)>
 </ForwardRef(FooterLink)>
 `;

package/es/FooterList/__snapshots__/index.test.tsx.snap

@@ -4,20 +4,30 @@ exports[`renders the FooterList with columns=2 1`] = `
 <ForwardRef(FooterList)
   columns={2}
 >
-  <ul
+  <ForwardRef(Base)
+    as="ul"
     className="govgr-footer__list--columns-2 govgr-footer__list"
   >
-    hello
-  </ul>
+    <ul
+      className="govgr-footer__list--columns-2 govgr-footer__list"
+    >
+      hello
+    </ul>
+  </ForwardRef(Base)>
 </ForwardRef(FooterList)>
 `;
 
 exports[`renders the FooterList with no props 1`] = `
 <ForwardRef(FooterList)>
-  <ul
+  <ForwardRef(Base)
+    as="ul"
     className="govgr-footer__list"
   >
-    hello
-  </ul>
+    <ul
+      className="govgr-footer__list"
+    >
+      hello
+    </ul>
+  </ForwardRef(Base)>
 </ForwardRef(FooterList)>
 `;

package/es/FooterListItem/__snapshots__/index.test.tsx.snap

@@ -2,15 +2,15 @@
 
 exports[`renders the FooterListItem with no props 1`] = `
 <ForwardRef(FooterListItem)>
-  <li
+  <ForwardRef(Base)
+    as="li"
     className="govgr-footer__list-item"
   >
-    <a
-      className="govgr-footer__link"
-      href="/"
+    <li
+      className="govgr-footer__list-item"
     >
       hello
-    </a>
-  </li>
+    </li>
+  </ForwardRef(Base)>
 </ForwardRef(FooterListItem)>
 `;

package/es/FooterMeta/__snapshots__/index.test.tsx.snap

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

package/es/FooterMetaItem/__snapshots__/index.test.tsx.snap

@@ -4,11 +4,16 @@ exports[`renders the FooterMetaItem with grow=false 1`] = `
 <ForwardRef(FooterMetaItem)
   grow={false}
 >
-  <div
+  <ForwardRef(Base)
+    as="div"
     className="govgr-footer__meta-item"
   >
-    hello
-  </div>
+    <div
+      className="govgr-footer__meta-item"
+    >
+      hello
+    </div>
+  </ForwardRef(Base)>
 </ForwardRef(FooterMetaItem)>
 `;
 
@@ -16,20 +21,30 @@ exports[`renders the FooterMetaItem with grow=true 1`] = `
 <ForwardRef(FooterMetaItem)
   grow={true}
 >
-  <div
+  <ForwardRef(Base)
+    as="div"
     className="govgr-footer__meta-item--grow govgr-footer__meta-item"
   >
-    hello
-  </div>
+    <div
+      className="govgr-footer__meta-item--grow govgr-footer__meta-item"
+    >
+      hello
+    </div>
+  </ForwardRef(Base)>
 </ForwardRef(FooterMetaItem)>
 `;
 
 exports[`renders the FooterMetaItem with no props 1`] = `
 <ForwardRef(FooterMetaItem)>
-  <div
+  <ForwardRef(Base)
+    as="div"
     className="govgr-footer__meta-item"
   >
-    hello
-  </div>
+    <div
+      className="govgr-footer__meta-item"
+    >
+      hello
+    </div>
+  </ForwardRef(Base)>
 </ForwardRef(FooterMetaItem)>
 `;

package/es/FooterNavigation/__snapshots__/index.test.tsx.snap

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