@digigov/react-core 1.0.0-079f34f3d → 1.0.0-290a96e2

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

@@ -2,16 +2,21 @@
 
 exports[`renders the Heading with no props 1`] = `
 <ForwardRef(Heading)>
-  <ForwardRef(Base)
+  <ForwardRef(Typography)
     as="h1"
     className="govgr-heading-xl"
   >
-    <h1
+    <ForwardRef(Base)
+      as="h1"
       className="govgr-heading-xl"
     >
-      hello
-    </h1>
-  </ForwardRef(Base)>
+      <h1
+        className="govgr-heading-xl"
+      >
+        hello
+      </h1>
+    </ForwardRef(Base)>
+  </ForwardRef(Typography)>
 </ForwardRef(Heading)>
 `;
 
@@ -20,16 +25,21 @@ exports[`renders the Heading with size=l and element h2 1`] = `
   element="h2"
   size="lg"
 >
-  <ForwardRef(Base)
+  <ForwardRef(Typography)
     as="h2"
     className="govgr-heading-lg"
   >
-    <h2
+    <ForwardRef(Base)
+      as="h2"
       className="govgr-heading-lg"
     >
-      hello
-    </h2>
-  </ForwardRef(Base)>
+      <h2
+        className="govgr-heading-lg"
+      >
+        hello
+      </h2>
+    </ForwardRef(Base)>
+  </ForwardRef(Typography)>
 </ForwardRef(Heading)>
 `;
 
@@ -38,16 +48,21 @@ exports[`renders the Heading with size=l and element h3 1`] = `
   element="h3"
   size="lg"
 >
-  <ForwardRef(Base)
+  <ForwardRef(Typography)
     as="h3"
     className="govgr-heading-lg"
   >
-    <h3
+    <ForwardRef(Base)
+      as="h3"
       className="govgr-heading-lg"
     >
-      hello
-    </h3>
-  </ForwardRef(Base)>
+      <h3
+        className="govgr-heading-lg"
+      >
+        hello
+      </h3>
+    </ForwardRef(Base)>
+  </ForwardRef(Typography)>
 </ForwardRef(Heading)>
 `;
 
@@ -56,16 +71,21 @@ exports[`renders the Heading with size=l and element h4 1`] = `
   element="h4"
   size="lg"
 >
-  <ForwardRef(Base)
+  <ForwardRef(Typography)
     as="h4"
     className="govgr-heading-lg"
   >
-    <h4
+    <ForwardRef(Base)
+      as="h4"
       className="govgr-heading-lg"
     >
-      hello
-    </h4>
-  </ForwardRef(Base)>
+      <h4
+        className="govgr-heading-lg"
+      >
+        hello
+      </h4>
+    </ForwardRef(Base)>
+  </ForwardRef(Typography)>
 </ForwardRef(Heading)>
 `;
 
@@ -73,16 +93,21 @@ exports[`renders the Heading with size=lg 1`] = `
 <ForwardRef(Heading)
   size="lg"
 >
-  <ForwardRef(Base)
+  <ForwardRef(Typography)
     as="h2"
     className="govgr-heading-lg"
   >
-    <h2
+    <ForwardRef(Base)
+      as="h2"
       className="govgr-heading-lg"
     >
-      hello
-    </h2>
-  </ForwardRef(Base)>
+      <h2
+        className="govgr-heading-lg"
+      >
+        hello
+      </h2>
+    </ForwardRef(Base)>
+  </ForwardRef(Typography)>
 </ForwardRef(Heading)>
 `;
 
@@ -91,16 +116,21 @@ exports[`renders the Heading with size=m and element h2 1`] = `
   element="h2"
   size="md"
 >
-  <ForwardRef(Base)
+  <ForwardRef(Typography)
     as="h2"
     className="govgr-heading-md"
   >
-    <h2
+    <ForwardRef(Base)
+      as="h2"
       className="govgr-heading-md"
     >
-      hello
-    </h2>
-  </ForwardRef(Base)>
+      <h2
+        className="govgr-heading-md"
+      >
+        hello
+      </h2>
+    </ForwardRef(Base)>
+  </ForwardRef(Typography)>
 </ForwardRef(Heading)>
 `;
 
@@ -109,16 +139,21 @@ exports[`renders the Heading with size=m and element h3 1`] = `
   element="h3"
   size="md"
 >
-  <ForwardRef(Base)
+  <ForwardRef(Typography)
     as="h3"
     className="govgr-heading-md"
   >
-    <h3
+    <ForwardRef(Base)
+      as="h3"
       className="govgr-heading-md"
     >
-      hello
-    </h3>
-  </ForwardRef(Base)>
+      <h3
+        className="govgr-heading-md"
+      >
+        hello
+      </h3>
+    </ForwardRef(Base)>
+  </ForwardRef(Typography)>
 </ForwardRef(Heading)>
 `;
 
@@ -127,16 +162,21 @@ exports[`renders the Heading with size=m and element h4 1`] = `
   element="h4"
   size="md"
 >
-  <ForwardRef(Base)
+  <ForwardRef(Typography)
     as="h4"
     className="govgr-heading-md"
   >
-    <h4
+    <ForwardRef(Base)
+      as="h4"
       className="govgr-heading-md"
     >
-      hello
-    </h4>
-  </ForwardRef(Base)>
+      <h4
+        className="govgr-heading-md"
+      >
+        hello
+      </h4>
+    </ForwardRef(Base)>
+  </ForwardRef(Typography)>
 </ForwardRef(Heading)>
 `;
 
@@ -144,16 +184,21 @@ exports[`renders the Heading with size=md 1`] = `
 <ForwardRef(Heading)
   size="md"
 >
-  <ForwardRef(Base)
+  <ForwardRef(Typography)
     as="h3"
     className="govgr-heading-md"
   >
-    <h3
+    <ForwardRef(Base)
+      as="h3"
       className="govgr-heading-md"
     >
-      hello
-    </h3>
-  </ForwardRef(Base)>
+      <h3
+        className="govgr-heading-md"
+      >
+        hello
+      </h3>
+    </ForwardRef(Base)>
+  </ForwardRef(Typography)>
 </ForwardRef(Heading)>
 `;
 
@@ -162,16 +207,21 @@ exports[`renders the Heading with size=s and element h2 1`] = `
   element="h2"
   size="sm"
 >
-  <ForwardRef(Base)
+  <ForwardRef(Typography)
     as="h2"
     className="govgr-heading-sm"
   >
-    <h2
+    <ForwardRef(Base)
+      as="h2"
       className="govgr-heading-sm"
     >
-      hello
-    </h2>
-  </ForwardRef(Base)>
+      <h2
+        className="govgr-heading-sm"
+      >
+        hello
+      </h2>
+    </ForwardRef(Base)>
+  </ForwardRef(Typography)>
 </ForwardRef(Heading)>
 `;
 
@@ -180,16 +230,21 @@ exports[`renders the Heading with size=s and element h3 1`] = `
   element="h3"
   size="sm"
 >
-  <ForwardRef(Base)
+  <ForwardRef(Typography)
     as="h3"
     className="govgr-heading-sm"
   >
-    <h3
+    <ForwardRef(Base)
+      as="h3"
       className="govgr-heading-sm"
     >
-      hello
-    </h3>
-  </ForwardRef(Base)>
+      <h3
+        className="govgr-heading-sm"
+      >
+        hello
+      </h3>
+    </ForwardRef(Base)>
+  </ForwardRef(Typography)>
 </ForwardRef(Heading)>
 `;
 
@@ -198,16 +253,21 @@ exports[`renders the Heading with size=s and element h4 1`] = `
   element="h4"
   size="sm"
 >
-  <ForwardRef(Base)
+  <ForwardRef(Typography)
     as="h4"
     className="govgr-heading-sm"
   >
-    <h4
+    <ForwardRef(Base)
+      as="h4"
       className="govgr-heading-sm"
     >
-      hello
-    </h4>
-  </ForwardRef(Base)>
+      <h4
+        className="govgr-heading-sm"
+      >
+        hello
+      </h4>
+    </ForwardRef(Base)>
+  </ForwardRef(Typography)>
 </ForwardRef(Heading)>
 `;
 
@@ -215,16 +275,21 @@ exports[`renders the Heading with size=sm 1`] = `
 <ForwardRef(Heading)
   size="sm"
 >
-  <ForwardRef(Base)
+  <ForwardRef(Typography)
     as="h4"
     className="govgr-heading-sm"
   >
-    <h4
+    <ForwardRef(Base)
+      as="h4"
       className="govgr-heading-sm"
     >
-      hello
-    </h4>
-  </ForwardRef(Base)>
+      <h4
+        className="govgr-heading-sm"
+      >
+        hello
+      </h4>
+    </ForwardRef(Base)>
+  </ForwardRef(Typography)>
 </ForwardRef(Heading)>
 `;
 
@@ -232,16 +297,21 @@ exports[`renders the Heading with size=xl 1`] = `
 <ForwardRef(Heading)
   size="xl"
 >
-  <ForwardRef(Base)
+  <ForwardRef(Typography)
     as="h1"
     className="govgr-heading-xl"
   >
-    <h1
+    <ForwardRef(Base)
+      as="h1"
       className="govgr-heading-xl"
     >
-      hello
-    </h1>
-  </ForwardRef(Base)>
+      <h1
+        className="govgr-heading-xl"
+      >
+        hello
+      </h1>
+    </ForwardRef(Base)>
+  </ForwardRef(Typography)>
 </ForwardRef(Heading)>
 `;
 
@@ -250,16 +320,21 @@ exports[`renders the Heading with size=xl and element h2 1`] = `
   element="h2"
   size="xl"
 >
-  <ForwardRef(Base)
+  <ForwardRef(Typography)
     as="h2"
     className="govgr-heading-xl"
   >
-    <h2
+    <ForwardRef(Base)
+      as="h2"
       className="govgr-heading-xl"
     >
-      hello
-    </h2>
-  </ForwardRef(Base)>
+      <h2
+        className="govgr-heading-xl"
+      >
+        hello
+      </h2>
+    </ForwardRef(Base)>
+  </ForwardRef(Typography)>
 </ForwardRef(Heading)>
 `;
 
@@ -268,16 +343,21 @@ exports[`renders the Heading with size=xl and element h3 1`] = `
   element="h3"
   size="xl"
 >
-  <ForwardRef(Base)
+  <ForwardRef(Typography)
     as="h3"
     className="govgr-heading-xl"
   >
-    <h3
+    <ForwardRef(Base)
+      as="h3"
       className="govgr-heading-xl"
     >
-      hello
-    </h3>
-  </ForwardRef(Base)>
+      <h3
+        className="govgr-heading-xl"
+      >
+        hello
+      </h3>
+    </ForwardRef(Base)>
+  </ForwardRef(Typography)>
 </ForwardRef(Heading)>
 `;
 
@@ -286,16 +366,21 @@ exports[`renders the Heading with size=xl and element h4 1`] = `
   element="h4"
   size="xl"
 >
-  <ForwardRef(Base)
+  <ForwardRef(Typography)
     as="h4"
     className="govgr-heading-xl"
   >
-    <h4
+    <ForwardRef(Base)
+      as="h4"
       className="govgr-heading-xl"
     >
-      hello
-    </h4>
-  </ForwardRef(Base)>
+      <h4
+        className="govgr-heading-xl"
+      >
+        hello
+      </h4>
+    </ForwardRef(Base)>
+  </ForwardRef(Typography)>
 </ForwardRef(Heading)>
 `;
 
@@ -303,16 +388,21 @@ exports[`renders the Heading with size=xs 1`] = `
 <ForwardRef(Heading)
   size="xs"
 >
-  <ForwardRef(Base)
+  <ForwardRef(Typography)
     as="h5"
     className="govgr-heading-xs"
   >
-    <h5
+    <ForwardRef(Base)
+      as="h5"
       className="govgr-heading-xs"
     >
-      hello
-    </h5>
-  </ForwardRef(Base)>
+      <h5
+        className="govgr-heading-xs"
+      >
+        hello
+      </h5>
+    </ForwardRef(Base)>
+  </ForwardRef(Typography)>
 </ForwardRef(Heading)>
 `;
 
@@ -321,15 +411,20 @@ exports[`renders the Heading with size=xs and element h4 1`] = `
   element="h4"
   size="xs"
 >
-  <ForwardRef(Base)
+  <ForwardRef(Typography)
     as="h4"
     className="govgr-heading-xs"
   >
-    <h4
+    <ForwardRef(Base)
+      as="h4"
       className="govgr-heading-xs"
     >
-      hello
-    </h4>
-  </ForwardRef(Base)>
+      <h4
+        className="govgr-heading-xs"
+      >
+        hello
+      </h4>
+    </ForwardRef(Base)>
+  </ForwardRef(Typography)>
 </ForwardRef(Heading)>
 `;

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

@@ -2,16 +2,21 @@
 
 exports[`renders the HeadingCaption with no props 1`] = `
 <ForwardRef(HeadingCaption)>
-  <ForwardRef(Base)
+  <ForwardRef(Typography)
     as="span"
     className="govgr-caption-lg"
   >
-    <span
+    <ForwardRef(Base)
+      as="span"
       className="govgr-caption-lg"
     >
-      hello
-    </span>
-  </ForwardRef(Base)>
+      <span
+        className="govgr-caption-lg"
+      >
+        hello
+      </span>
+    </ForwardRef(Base)>
+  </ForwardRef(Typography)>
 </ForwardRef(HeadingCaption)>
 `;
 
@@ -19,16 +24,21 @@ exports[`renders the HeadingCaption with size=l 1`] = `
 <ForwardRef(HeadingCaption)
   size="lg"
 >
-  <ForwardRef(Base)
+  <ForwardRef(Typography)
     as="span"
     className="govgr-caption-lg"
   >
-    <span
+    <ForwardRef(Base)
+      as="span"
       className="govgr-caption-lg"
     >
-      hello
-    </span>
-  </ForwardRef(Base)>
+      <span
+        className="govgr-caption-lg"
+      >
+        hello
+      </span>
+    </ForwardRef(Base)>
+  </ForwardRef(Typography)>
 </ForwardRef(HeadingCaption)>
 `;
 
@@ -36,16 +46,21 @@ exports[`renders the HeadingCaption with size=m 1`] = `
 <ForwardRef(HeadingCaption)
   size="md"
 >
-  <ForwardRef(Base)
+  <ForwardRef(Typography)
     as="span"
     className="govgr-caption-md"
   >
-    <span
+    <ForwardRef(Base)
+      as="span"
       className="govgr-caption-md"
     >
-      hello
-    </span>
-  </ForwardRef(Base)>
+      <span
+        className="govgr-caption-md"
+      >
+        hello
+      </span>
+    </ForwardRef(Base)>
+  </ForwardRef(Typography)>
 </ForwardRef(HeadingCaption)>
 `;
 
@@ -53,15 +68,20 @@ exports[`renders the HeadingCaption with size=xl 1`] = `
 <ForwardRef(HeadingCaption)
   size="xl"
 >
-  <ForwardRef(Base)
+  <ForwardRef(Typography)
     as="span"
     className="govgr-caption-xl"
   >
-    <span
+    <ForwardRef(Base)
+      as="span"
       className="govgr-caption-xl"
     >
-      hello
-    </span>
-  </ForwardRef(Base)>
+      <span
+        className="govgr-caption-xl"
+      >
+        hello
+      </span>
+    </ForwardRef(Base)>
+  </ForwardRef(Typography)>
 </ForwardRef(HeadingCaption)>
 `;

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

@@ -2,17 +2,26 @@
 
 exports[`renders the Main with no props 1`] = `
 <ForwardRef(Main)>
-  <ForwardRef(Base)
+  <ForwardRef(Grid)
     as="main"
-    className="govgr-grid-column-two-thirds"
+    className="govgr-main"
     id="main-content"
+    item={true}
+    md={8}
+    xs={12}
   >
-    <main
-      className="govgr-grid-column-two-thirds"
+    <ForwardRef(Base)
+      as="main"
+      className="govgr-main xs:govgr-grid__col-span-12 md:govgr-grid__col-span-8"
       id="main-content"
     >
-      hello
-    </main>
-  </ForwardRef(Base)>
+      <main
+        className="govgr-main xs:govgr-grid__col-span-12 md:govgr-grid__col-span-8"
+        id="main-content"
+      >
+        hello
+      </main>
+    </ForwardRef(Base)>
+  </ForwardRef(Grid)>
 </ForwardRef(Main)>
 `;

package/es/Main/index.js

@@ -3,10 +3,10 @@ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProper
 var _excluded = ["className", "children", "id"];
 import React from 'react';
 import clsx from 'clsx';
-import Base from '@digigov/react-core/Base';
+import Grid from '@digigov/react-core/Grid';
 
 /**
- * Use this inside Content component for placing the main content of the page
+ * Use this inside Container component for placing the main content of the page.
  */
 export var Main = /*#__PURE__*/React.forwardRef(function Main(_ref, ref) {
   var className = _ref.className,
@@ -15,11 +15,14 @@ export var Main = /*#__PURE__*/React.forwardRef(function Main(_ref, ref) {
       id = _ref$id === void 0 ? 'main-content' : _ref$id,
       props = _objectWithoutProperties(_ref, _excluded);
 
-  return /*#__PURE__*/React.createElement(Base, _extends({
+  return /*#__PURE__*/React.createElement(Grid, _extends({
+    item: true,
+    xs: 12,
+    md: 8,
     as: "main",
     id: id,
     ref: ref,
-    className: clsx(className, true && 'govgr-grid-column-two-thirds')
+    className: clsx(className, true && 'govgr-main')
   }, props), children);
 });
 export default Main;