@digigov/react-icons 2.0.0-af1b5f33 → 2.0.0-b3ec0588

package/src/DownloadIcon/__snapshots__/index.test.tsx.snap

@@ -41,28 +41,31 @@ exports[`renders the DownloadIcon with no props 1`] = `
 </DownloadIcon>
 `;
 
-exports[`renders the DownloadIcon with prop size=m 1`] = `
+exports[`renders the DownloadIcon with prop color=error and size= xl 1`] = `
 <DownloadIcon
-  size="md"
+  color="warning"
+  size="xl"
 >
   <ForwardRef(Icon)
+    color="warning"
     icon="download"
-    size="md"
+    size="xl"
   >
     <ForwardRef(SvgIcon)
       className="ds-svg-icon--download"
-      size="md"
+      color="warning"
+      size="xl"
     >
       <ForwardRef(Base)
         aria-hidden="true"
         as="svg"
-        className="ds-svg-icon--download ds-svg-icon--md ds-svg-icon"
+        className="ds-svg-icon--download ds-svg-icon--warning ds-svg-icon--xl ds-svg-icon"
         focusable="false"
         viewBox="0 0 24 24"
       >
         <svg
           aria-hidden="true"
-          className="ds-svg-icon--download ds-svg-icon--md ds-svg-icon"
+          className="ds-svg-icon--download ds-svg-icon--warning ds-svg-icon--xl ds-svg-icon"
           focusable="false"
           viewBox="0 0 24 24"
         >
@@ -86,28 +89,28 @@ exports[`renders the DownloadIcon with prop size=m 1`] = `
 </DownloadIcon>
 `;
 
-exports[`renders the DownloadIcon with prop size=xl 1`] = `
+exports[`renders the DownloadIcon with prop color=light 1`] = `
 <DownloadIcon
-  size="xl"
+  color="light"
 >
   <ForwardRef(Icon)
+    color="light"
     icon="download"
-    size="xl"
   >
     <ForwardRef(SvgIcon)
       className="ds-svg-icon--download"
-      size="xl"
+      color="light"
     >
       <ForwardRef(Base)
         aria-hidden="true"
         as="svg"
-        className="ds-svg-icon--download ds-svg-icon--xl ds-svg-icon"
+        className="ds-svg-icon--download ds-svg-icon--light ds-svg-icon"
         focusable="false"
         viewBox="0 0 24 24"
       >
         <svg
           aria-hidden="true"
-          className="ds-svg-icon--download ds-svg-icon--xl ds-svg-icon"
+          className="ds-svg-icon--download ds-svg-icon--light ds-svg-icon"
           focusable="false"
           viewBox="0 0 24 24"
         >
@@ -131,31 +134,28 @@ exports[`renders the DownloadIcon with prop size=xl 1`] = `
 </DownloadIcon>
 `;
 
-exports[`renders the DownloadIcon with prop variant=error and size= xl 1`] = `
+exports[`renders the DownloadIcon with prop color=warning 1`] = `
 <DownloadIcon
-  size="xl"
-  variant="warning"
+  color="warning"
 >
   <ForwardRef(Icon)
+    color="warning"
     icon="download"
-    size="xl"
-    variant="warning"
   >
     <ForwardRef(SvgIcon)
       className="ds-svg-icon--download"
-      size="xl"
-      variant="warning"
+      color="warning"
     >
       <ForwardRef(Base)
         aria-hidden="true"
         as="svg"
-        className="ds-svg-icon--download ds-svg-icon--warning ds-svg-icon--xl ds-svg-icon"
+        className="ds-svg-icon--download ds-svg-icon--warning ds-svg-icon"
         focusable="false"
         viewBox="0 0 24 24"
       >
         <svg
           aria-hidden="true"
-          className="ds-svg-icon--download ds-svg-icon--warning ds-svg-icon--xl ds-svg-icon"
+          className="ds-svg-icon--download ds-svg-icon--warning ds-svg-icon"
           focusable="false"
           viewBox="0 0 24 24"
         >
@@ -179,28 +179,31 @@ exports[`renders the DownloadIcon with prop variant=error and size= xl 1`] = `
 </DownloadIcon>
 `;
 
-exports[`renders the DownloadIcon with prop variant=light 1`] = `
+exports[`renders the DownloadIcon with prop color=warning and size=s 1`] = `
 <DownloadIcon
-  variant="light"
+  color="warning"
+  size="sm"
 >
   <ForwardRef(Icon)
+    color="warning"
     icon="download"
-    variant="light"
+    size="sm"
   >
     <ForwardRef(SvgIcon)
       className="ds-svg-icon--download"
-      variant="light"
+      color="warning"
+      size="sm"
     >
       <ForwardRef(Base)
         aria-hidden="true"
         as="svg"
-        className="ds-svg-icon--download ds-svg-icon--light ds-svg-icon"
+        className="ds-svg-icon--download ds-svg-icon--warning ds-svg-icon--sm ds-svg-icon"
         focusable="false"
         viewBox="0 0 24 24"
       >
         <svg
           aria-hidden="true"
-          className="ds-svg-icon--download ds-svg-icon--light ds-svg-icon"
+          className="ds-svg-icon--download ds-svg-icon--warning ds-svg-icon--sm ds-svg-icon"
           focusable="false"
           viewBox="0 0 24 24"
         >
@@ -224,28 +227,28 @@ exports[`renders the DownloadIcon with prop variant=light 1`] = `
 </DownloadIcon>
 `;
 
-exports[`renders the DownloadIcon with prop variant=warning 1`] = `
+exports[`renders the DownloadIcon with prop size=m 1`] = `
 <DownloadIcon
-  variant="warning"
+  size="md"
 >
   <ForwardRef(Icon)
     icon="download"
-    variant="warning"
+    size="md"
   >
     <ForwardRef(SvgIcon)
       className="ds-svg-icon--download"
-      variant="warning"
+      size="md"
     >
       <ForwardRef(Base)
         aria-hidden="true"
         as="svg"
-        className="ds-svg-icon--download ds-svg-icon--warning ds-svg-icon"
+        className="ds-svg-icon--download ds-svg-icon--md ds-svg-icon"
         focusable="false"
         viewBox="0 0 24 24"
       >
         <svg
           aria-hidden="true"
-          className="ds-svg-icon--download ds-svg-icon--warning ds-svg-icon"
+          className="ds-svg-icon--download ds-svg-icon--md ds-svg-icon"
           focusable="false"
           viewBox="0 0 24 24"
         >
@@ -269,31 +272,28 @@ exports[`renders the DownloadIcon with prop variant=warning 1`] = `
 </DownloadIcon>
 `;
 
-exports[`renders the DownloadIcon with prop variant=warning and size=s 1`] = `
+exports[`renders the DownloadIcon with prop size=xl 1`] = `
 <DownloadIcon
-  size="sm"
-  variant="warning"
+  size="xl"
 >
   <ForwardRef(Icon)
     icon="download"
-    size="sm"
-    variant="warning"
+    size="xl"
   >
     <ForwardRef(SvgIcon)
       className="ds-svg-icon--download"
-      size="sm"
-      variant="warning"
+      size="xl"
     >
       <ForwardRef(Base)
         aria-hidden="true"
         as="svg"
-        className="ds-svg-icon--download ds-svg-icon--warning ds-svg-icon--sm ds-svg-icon"
+        className="ds-svg-icon--download ds-svg-icon--xl ds-svg-icon"
         focusable="false"
         viewBox="0 0 24 24"
       >
         <svg
           aria-hidden="true"
-          className="ds-svg-icon--download ds-svg-icon--warning ds-svg-icon--sm ds-svg-icon"
+          className="ds-svg-icon--download ds-svg-icon--xl ds-svg-icon"
           focusable="false"
           viewBox="0 0 24 24"
         >

package/src/DownloadIcon/index.test.tsx

@@ -12,15 +12,15 @@ it('renders the DownloadIcon with prop size=m', () => {
 it('renders the DownloadIcon with prop size=xl', () => {
   expect(mount(<DownloadIcon size="xl" />)).toMatchSnapshot();
 });
-it('renders the DownloadIcon with prop variant=light', () => {
-  expect(mount(<DownloadIcon variant="light" />)).toMatchSnapshot();
+it('renders the DownloadIcon with prop color=light', () => {
+  expect(mount(<DownloadIcon color="light" />)).toMatchSnapshot();
 });
-it('renders the DownloadIcon with prop variant=warning', () => {
-  expect(mount(<DownloadIcon variant="warning" />)).toMatchSnapshot();
+it('renders the DownloadIcon with prop color=warning', () => {
+  expect(mount(<DownloadIcon color="warning" />)).toMatchSnapshot();
 });
-it('renders the DownloadIcon with prop variant=warning and size=s', () => {
-  expect(mount(<DownloadIcon variant="warning" size="sm" />)).toMatchSnapshot();
+it('renders the DownloadIcon with prop color=warning and size=s', () => {
+  expect(mount(<DownloadIcon color="warning" size="sm" />)).toMatchSnapshot();
 });
-it('renders the DownloadIcon with prop variant=error and size= xl', () => {
-  expect(mount(<DownloadIcon variant="warning" size="xl" />)).toMatchSnapshot();
+it('renders the DownloadIcon with prop color=error and size= xl', () => {
+  expect(mount(<DownloadIcon color="warning" size="xl" />)).toMatchSnapshot();
 });

package/src/ExclamationIcon/__snapshots__/index.test.tsx.snap

@@ -38,28 +38,31 @@ exports[`renders the ExclamationIcon with no props 1`] = `
 </ExclamationIcon>
 `;
 
-exports[`renders the ExclamationIcon with prop size=md 1`] = `
+exports[`renders the ExclamationIcon with prop color=error and size=sm 1`] = `
 <ExclamationIcon
-  size="md"
+  color="error"
+  size="sm"
 >
   <ForwardRef(Icon)
+    color="error"
     icon="exclamation"
-    size="md"
+    size="sm"
   >
     <ForwardRef(SvgIcon)
       className="ds-svg-icon--exclamation"
-      size="md"
+      color="error"
+      size="sm"
     >
       <ForwardRef(Base)
         aria-hidden="true"
         as="svg"
-        className="ds-svg-icon--exclamation ds-svg-icon--md ds-svg-icon"
+        className="ds-svg-icon--exclamation ds-svg-icon--error ds-svg-icon--sm ds-svg-icon"
         focusable="false"
         viewBox="0 0 24 24"
       >
         <svg
           aria-hidden="true"
-          className="ds-svg-icon--exclamation ds-svg-icon--md ds-svg-icon"
+          className="ds-svg-icon--exclamation ds-svg-icon--error ds-svg-icon--sm ds-svg-icon"
           focusable="false"
           viewBox="0 0 24 24"
         >
@@ -80,28 +83,31 @@ exports[`renders the ExclamationIcon with prop size=md 1`] = `
 </ExclamationIcon>
 `;
 
-exports[`renders the ExclamationIcon with prop size=xl 1`] = `
+exports[`renders the ExclamationIcon with prop color=info and size= xl 1`] = `
 <ExclamationIcon
+  color="info"
   size="xl"
 >
   <ForwardRef(Icon)
+    color="info"
     icon="exclamation"
     size="xl"
   >
     <ForwardRef(SvgIcon)
       className="ds-svg-icon--exclamation"
+      color="info"
       size="xl"
     >
       <ForwardRef(Base)
         aria-hidden="true"
         as="svg"
-        className="ds-svg-icon--exclamation ds-svg-icon--xl ds-svg-icon"
+        className="ds-svg-icon--exclamation ds-svg-icon--info ds-svg-icon--xl ds-svg-icon"
         focusable="false"
         viewBox="0 0 24 24"
       >
         <svg
           aria-hidden="true"
-          className="ds-svg-icon--exclamation ds-svg-icon--xl ds-svg-icon"
+          className="ds-svg-icon--exclamation ds-svg-icon--info ds-svg-icon--xl ds-svg-icon"
           focusable="false"
           viewBox="0 0 24 24"
         >
@@ -122,31 +128,28 @@ exports[`renders the ExclamationIcon with prop size=xl 1`] = `
 </ExclamationIcon>
 `;
 
-exports[`renders the ExclamationIcon with prop variant=error and size=sm 1`] = `
+exports[`renders the ExclamationIcon with prop color=light 1`] = `
 <ExclamationIcon
-  size="sm"
-  variant="error"
+  color="light"
 >
   <ForwardRef(Icon)
+    color="light"
     icon="exclamation"
-    size="sm"
-    variant="error"
   >
     <ForwardRef(SvgIcon)
       className="ds-svg-icon--exclamation"
-      size="sm"
-      variant="error"
+      color="light"
     >
       <ForwardRef(Base)
         aria-hidden="true"
         as="svg"
-        className="ds-svg-icon--exclamation ds-svg-icon--error ds-svg-icon--sm ds-svg-icon"
+        className="ds-svg-icon--exclamation ds-svg-icon--light ds-svg-icon"
         focusable="false"
         viewBox="0 0 24 24"
       >
         <svg
           aria-hidden="true"
-          className="ds-svg-icon--exclamation ds-svg-icon--error ds-svg-icon--sm ds-svg-icon"
+          className="ds-svg-icon--exclamation ds-svg-icon--light ds-svg-icon"
           focusable="false"
           viewBox="0 0 24 24"
         >
@@ -167,31 +170,28 @@ exports[`renders the ExclamationIcon with prop variant=error and size=sm 1`] = `
 </ExclamationIcon>
 `;
 
-exports[`renders the ExclamationIcon with prop variant=info and size= xl 1`] = `
+exports[`renders the ExclamationIcon with prop color=warning 1`] = `
 <ExclamationIcon
-  size="xl"
-  variant="info"
+  color="warning"
 >
   <ForwardRef(Icon)
+    color="warning"
     icon="exclamation"
-    size="xl"
-    variant="info"
   >
     <ForwardRef(SvgIcon)
       className="ds-svg-icon--exclamation"
-      size="xl"
-      variant="info"
+      color="warning"
     >
       <ForwardRef(Base)
         aria-hidden="true"
         as="svg"
-        className="ds-svg-icon--exclamation ds-svg-icon--info ds-svg-icon--xl ds-svg-icon"
+        className="ds-svg-icon--exclamation ds-svg-icon--warning ds-svg-icon"
         focusable="false"
         viewBox="0 0 24 24"
       >
         <svg
           aria-hidden="true"
-          className="ds-svg-icon--exclamation ds-svg-icon--info ds-svg-icon--xl ds-svg-icon"
+          className="ds-svg-icon--exclamation ds-svg-icon--warning ds-svg-icon"
           focusable="false"
           viewBox="0 0 24 24"
         >
@@ -212,28 +212,28 @@ exports[`renders the ExclamationIcon with prop variant=info and size= xl 1`] = `
 </ExclamationIcon>
 `;
 
-exports[`renders the ExclamationIcon with prop variant=light 1`] = `
+exports[`renders the ExclamationIcon with prop size=md 1`] = `
 <ExclamationIcon
-  variant="light"
+  size="md"
 >
   <ForwardRef(Icon)
     icon="exclamation"
-    variant="light"
+    size="md"
   >
     <ForwardRef(SvgIcon)
       className="ds-svg-icon--exclamation"
-      variant="light"
+      size="md"
     >
       <ForwardRef(Base)
         aria-hidden="true"
         as="svg"
-        className="ds-svg-icon--exclamation ds-svg-icon--light ds-svg-icon"
+        className="ds-svg-icon--exclamation ds-svg-icon--md ds-svg-icon"
         focusable="false"
         viewBox="0 0 24 24"
       >
         <svg
           aria-hidden="true"
-          className="ds-svg-icon--exclamation ds-svg-icon--light ds-svg-icon"
+          className="ds-svg-icon--exclamation ds-svg-icon--md ds-svg-icon"
           focusable="false"
           viewBox="0 0 24 24"
         >
@@ -254,28 +254,28 @@ exports[`renders the ExclamationIcon with prop variant=light 1`] = `
 </ExclamationIcon>
 `;
 
-exports[`renders the ExclamationIcon with prop variant=warning 1`] = `
+exports[`renders the ExclamationIcon with prop size=xl 1`] = `
 <ExclamationIcon
-  variant="warning"
+  size="xl"
 >
   <ForwardRef(Icon)
     icon="exclamation"
-    variant="warning"
+    size="xl"
   >
     <ForwardRef(SvgIcon)
       className="ds-svg-icon--exclamation"
-      variant="warning"
+      size="xl"
     >
       <ForwardRef(Base)
         aria-hidden="true"
         as="svg"
-        className="ds-svg-icon--exclamation ds-svg-icon--warning ds-svg-icon"
+        className="ds-svg-icon--exclamation ds-svg-icon--xl ds-svg-icon"
         focusable="false"
         viewBox="0 0 24 24"
       >
         <svg
           aria-hidden="true"
-          className="ds-svg-icon--exclamation ds-svg-icon--warning ds-svg-icon"
+          className="ds-svg-icon--exclamation ds-svg-icon--xl ds-svg-icon"
           focusable="false"
           viewBox="0 0 24 24"
         >

package/src/ExclamationIcon/index.test.tsx

@@ -12,15 +12,15 @@ it('renders the ExclamationIcon with prop size=md', () => {
 it('renders the ExclamationIcon with prop size=xl', () => {
   expect(mount(<ExclamationIcon size="xl" />)).toMatchSnapshot();
 });
-it('renders the ExclamationIcon with prop variant=light', () => {
-  expect(mount(<ExclamationIcon variant="light" />)).toMatchSnapshot();
+it('renders the ExclamationIcon with prop color=light', () => {
+  expect(mount(<ExclamationIcon color="light" />)).toMatchSnapshot();
 });
-it('renders the ExclamationIcon with prop variant=warning', () => {
-  expect(mount(<ExclamationIcon variant="warning" />)).toMatchSnapshot();
+it('renders the ExclamationIcon with prop color=warning', () => {
+  expect(mount(<ExclamationIcon color="warning" />)).toMatchSnapshot();
 });
-it('renders the ExclamationIcon with prop variant=error and size=sm', () => {
-  expect(mount(<ExclamationIcon variant="error" size="sm" />)).toMatchSnapshot();
+it('renders the ExclamationIcon with prop color=error and size=sm', () => {
+  expect(mount(<ExclamationIcon color="error" size="sm" />)).toMatchSnapshot();
 });
-it('renders the ExclamationIcon with prop variant=info and size= xl', () => {
-  expect(mount(<ExclamationIcon variant="info" size="xl" />)).toMatchSnapshot();
+it('renders the ExclamationIcon with prop color=info and size= xl', () => {
+  expect(mount(<ExclamationIcon color="info" size="xl" />)).toMatchSnapshot();
 });

package/src/GlobeIcon/__snapshots__/index.test.tsx.snap

@@ -1,16 +1,16 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`renders the GlobeIcon prop variant= "error" 1`] = `
+exports[`renders the GlobeIcon prop color= "error" 1`] = `
 <GlobeIcon
-  variant="error"
+  color="error"
 >
   <ForwardRef(Icon)
+    color="error"
     icon="globe"
-    variant="error"
   >
     <ForwardRef(SvgIcon)
       className="ds-svg-icon--globe"
-      variant="error"
+      color="error"
     >
       <ForwardRef(Base)
         aria-hidden="true"
@@ -38,17 +38,17 @@ exports[`renders the GlobeIcon prop variant= "error" 1`] = `
 </GlobeIcon>
 `;
 
-exports[`renders the GlobeIcon prop variant= "light" 1`] = `
+exports[`renders the GlobeIcon prop color= "light" 1`] = `
 <GlobeIcon
-  variant="light"
+  color="light"
 >
   <ForwardRef(Icon)
+    color="light"
     icon="globe"
-    variant="light"
   >
     <ForwardRef(SvgIcon)
       className="ds-svg-icon--globe"
-      variant="light"
+      color="light"
     >
       <ForwardRef(Base)
         aria-hidden="true"
@@ -110,17 +110,17 @@ exports[`renders the GlobeIcon with no props 1`] = `
 </GlobeIcon>
 `;
 
-exports[`renders the GlobeIcon with prop variant=dark 1`] = `
+exports[`renders the GlobeIcon with prop color=dark 1`] = `
 <GlobeIcon
-  variant="dark"
+  color="dark"
 >
   <ForwardRef(Icon)
+    color="dark"
     icon="globe"
-    variant="dark"
   >
     <ForwardRef(SvgIcon)
       className="ds-svg-icon--globe"
-      variant="dark"
+      color="dark"
     >
       <ForwardRef(Base)
         aria-hidden="true"

package/src/GlobeIcon/index.test.tsx

@@ -7,13 +7,13 @@ it('renders the GlobeIcon with no props', () => {
   expect(mount(<GlobeIcon />)).toMatchSnapshot();
 });
 
-it('renders the GlobeIcon with prop variant=dark', () => {
-  expect(mount(<GlobeIcon variant="dark" />)).toMatchSnapshot();
+it('renders the GlobeIcon with prop color=dark', () => {
+  expect(mount(<GlobeIcon color="dark" />)).toMatchSnapshot();
 });
 
-it('renders the GlobeIcon prop variant= "light"', () => {
-  expect(mount(<GlobeIcon variant="light" />)).toMatchSnapshot();
+it('renders the GlobeIcon prop color= "light"', () => {
+  expect(mount(<GlobeIcon color="light" />)).toMatchSnapshot();
 });
-it('renders the GlobeIcon prop variant= "error"', () => {
-  expect(mount(<GlobeIcon variant="error" />)).toMatchSnapshot();
+it('renders the GlobeIcon prop color= "error"', () => {
+  expect(mount(<GlobeIcon color="error" />)).toMatchSnapshot();
 });