@oxide/design-system 2.0.0 → 2.0.1--canary.8209c27.0

package/icons/react/Close8Icon.tsx

@@ -5,7 +5,7 @@
  *
  * Copyright Oxide Computer Company
  */
-import { SVGProps } from 'react'
+import type { SVGProps } from 'react'
 
 interface SVGRProps {
   title?: string
@@ -13,20 +13,20 @@ interface SVGRProps {
 }
 const Close8Icon = ({ title, titleId, ...props }: SVGProps<SVGSVGElement> & SVGRProps) => (
   <svg
+    xmlns="http://www.w3.org/2000/svg"
     width={8}
     height={8}
     viewBox="0 0 8 8"
-    xmlns="http://www.w3.org/2000/svg"
     role="img"
     aria-labelledby={titleId}
     {...props}
   >
     {title ? <title id={titleId}>{title}</title> : null}
     <path
+      fill="currentColor"
       fillRule="evenodd"
+      d="M6.21 6.917a.375.375 0 0 0 .53 0l.177-.177a.375.375 0 0 0 0-.53L4.707 4l2.21-2.21a.375.375 0 0 0 0-.53l-.177-.177a.375.375 0 0 0-.53 0L4 3.293l-2.21-2.21a.375.375 0 0 0-.53 0l-.177.177a.375.375 0 0 0 0 .53L3.293 4l-2.21 2.21a.375.375 0 0 0 0 .53l.177.177a.375.375 0 0 0 .53 0L4 4.707z"
       clipRule="evenodd"
-      d="M6.21 6.917a.375.375 0 0 0 .53 0l.177-.177a.375.375 0 0 0 0-.53L4.707 4l2.21-2.21a.375.375 0 0 0 0-.53l-.177-.177a.375.375 0 0 0-.53 0L4 3.293l-2.21-2.21a.375.375 0 0 0-.53 0l-.177.177a.375.375 0 0 0 0 .53L3.293 4l-2.21 2.21a.375.375 0 0 0 0 .53l.177.177a.375.375 0 0 0 .53 0L4 4.707l2.21 2.21Z"
-      fill="currentColor"
     />
   </svg>
 )

package/icons/react/Cloud16Icon.tsx

@@ -5,7 +5,7 @@
  *
  * Copyright Oxide Computer Company
  */
-import { SVGProps } from 'react'
+import type { SVGProps } from 'react'
 
 interface SVGRProps {
   title?: string
@@ -13,20 +13,20 @@ interface SVGRProps {
 }
 const Cloud16Icon = ({ title, titleId, ...props }: SVGProps<SVGSVGElement> & SVGRProps) => (
   <svg
+    xmlns="http://www.w3.org/2000/svg"
     width={16}
     height={16}
     viewBox="0 0 16 16"
-    xmlns="http://www.w3.org/2000/svg"
     role="img"
     aria-labelledby={titleId}
     {...props}
   >
     {title ? <title id={titleId}>{title}</title> : null}
     <path
+      fill="currentColor"
       fillRule="evenodd"
+      d="M13.333 7v.018A3 3 0 0 1 13 13H4a4 4 0 0 1-.254-7.992A5.001 5.001 0 0 1 13.333 7"
       clipRule="evenodd"
-      d="M13.333 7v.018A3 3 0 0 1 13 13H4a4 4 0 0 1-.254-7.992A5.001 5.001 0 0 1 13.333 7Z"
-      fill="currentColor"
     />
   </svg>
 )

package/icons/react/Cloud24Icon.tsx

@@ -5,7 +5,7 @@
  *
  * Copyright Oxide Computer Company
  */
-import { SVGProps } from 'react'
+import type { SVGProps } from 'react'
 
 interface SVGRProps {
   title?: string
@@ -13,20 +13,20 @@ interface SVGRProps {
 }
 const Cloud24Icon = ({ title, titleId, ...props }: SVGProps<SVGSVGElement> & SVGRProps) => (
   <svg
+    xmlns="http://www.w3.org/2000/svg"
     width={24}
     height={24}
     viewBox="0 0 24 24"
-    xmlns="http://www.w3.org/2000/svg"
     role="img"
     aria-labelledby={titleId}
     {...props}
   >
     {title ? <title id={titleId}>{title}</title> : null}
     <path
+      fill="currentColor"
       fillRule="evenodd"
+      d="M20 11q0 .207-.01.412A5.001 5.001 0 0 1 18 21H7A6 6 0 0 1 4.097 9.748 8 8 0 0 1 20 11"
       clipRule="evenodd"
-      d="M20 11c0 .138-.003.275-.01.412A5.001 5.001 0 0 1 18 21H7A6 6 0 0 1 4.097 9.748 8 8 0 0 1 20 11Z"
-      fill="currentColor"
     />
   </svg>
 )

package/icons/react/Compability16Icon.tsx

@@ -5,7 +5,7 @@
  *
  * Copyright Oxide Computer Company
  */
-import { SVGProps } from 'react'
+import type { SVGProps } from 'react'
 
 interface SVGRProps {
   title?: string
@@ -17,20 +17,20 @@ const Compability16Icon = ({
   ...props
 }: SVGProps<SVGSVGElement> & SVGRProps) => (
   <svg
+    xmlns="http://www.w3.org/2000/svg"
     width={16}
     height={16}
     viewBox="0 0 16 16"
-    xmlns="http://www.w3.org/2000/svg"
     role="img"
     aria-labelledby={titleId}
     {...props}
   >
     {title ? <title id={titleId}>{title}</title> : null}
     <path
+      fill="currentColor"
       fillRule="evenodd"
+      d="M1 1.75A.75.75 0 0 1 1.75 1h12.5a.75.75 0 0 1 .75.75V7h-4V4H5v3H1zM11 9v3h4v2.25a.75.75 0 0 1-.75.75H1.75a.75.75 0 0 1-.75-.75V12h4V9z"
       clipRule="evenodd"
-      d="M1 1.75A.75.75 0 0 1 1.75 1h12.5a.75.75 0 0 1 .75.75V7h-4V4H5v3H1V1.75ZM11 9v3h4v2.25a.75.75 0 0 1-.75.75H1.75a.75.75 0 0 1-.75-.75V12h4V9h6Z"
-      fill="currentColor"
     />
   </svg>
 )

package/icons/react/Compass16Icon.tsx

@@ -0,0 +1,37 @@
+/*
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, you can obtain one at https://mozilla.org/MPL/2.0/.
+ *
+ * Copyright Oxide Computer Company
+ */
+import type { SVGProps } from 'react'
+
+interface SVGRProps {
+  title?: string
+  titleId?: string
+}
+const Compass16Icon = ({
+  title,
+  titleId,
+  ...props
+}: SVGProps<SVGSVGElement> & SVGRProps) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    width={16}
+    height={16}
+    viewBox="0 0 16 16"
+    role="img"
+    aria-labelledby={titleId}
+    {...props}
+  >
+    {title ? <title id={titleId}>{title}</title> : null}
+    <path
+      fill="currentColor"
+      fillRule="evenodd"
+      d="M15 8A7 7 0 1 1 1 8a7 7 0 0 1 14 0m-4.278-3.692a.738.738 0 0 1 .97.97L9.886 9.492a.75.75 0 0 1-.394.394l-4.214 1.806a.738.738 0 0 1-.97-.97l1.806-4.214a.75.75 0 0 1 .394-.394zM8 9a1 1 0 1 0 0-2 1 1 0 0 0 0 2"
+      clipRule="evenodd"
+    />
+  </svg>
+)
+export default Compass16Icon

package/icons/react/Compatibility24Icon.tsx

@@ -5,7 +5,7 @@
  *
  * Copyright Oxide Computer Company
  */
-import { SVGProps } from 'react'
+import type { SVGProps } from 'react'
 
 interface SVGRProps {
   title?: string
@@ -17,20 +17,20 @@ const Compatibility24Icon = ({
   ...props
 }: SVGProps<SVGSVGElement> & SVGRProps) => (
   <svg
+    xmlns="http://www.w3.org/2000/svg"
     width={24}
     height={24}
     viewBox="0 0 24 24"
-    xmlns="http://www.w3.org/2000/svg"
     role="img"
     aria-labelledby={titleId}
     {...props}
   >
     {title ? <title id={titleId}>{title}</title> : null}
     <path
+      fill="currentColor"
       fillRule="evenodd"
+      d="M2 3a1 1 0 0 1 1-1h18a1 1 0 0 1 1 1v8h-6V7H8v4H2zm14 10v4h6v4a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1v-4h6v-4z"
       clipRule="evenodd"
-      d="M2 3a1 1 0 0 1 1-1h18a1 1 0 0 1 1 1v8h-6V7H8v4H2V3Zm14 10v4h6v4a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1v-4h6v-4h8Z"
-      fill="currentColor"
     />
   </svg>
 )

package/icons/react/Contrast16Icon.tsx

@@ -5,7 +5,7 @@
  *
  * Copyright Oxide Computer Company
  */
-import { SVGProps } from 'react'
+import type { SVGProps } from 'react'
 
 interface SVGRProps {
   title?: string
@@ -17,20 +17,20 @@ const Contrast16Icon = ({
   ...props
 }: SVGProps<SVGSVGElement> & SVGRProps) => (
   <svg
+    xmlns="http://www.w3.org/2000/svg"
     width={16}
     height={16}
     viewBox="0 0 16 16"
-    xmlns="http://www.w3.org/2000/svg"
     role="img"
     aria-labelledby={titleId}
     {...props}
   >
     {title ? <title id={titleId}>{title}</title> : null}
     <path
+      fill="currentColor"
       fillRule="evenodd"
+      d="M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16m2.296-2.457A6 6 0 0 1 8 14V2a6 6 0 0 1 2.296 11.543"
       clipRule="evenodd"
-      d="M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16Zm2.296-2.457A6 6 0 0 1 8 14V2a6 6 0 0 1 2.296 11.543Z"
-      fill="currentColor"
     />
   </svg>
 )

package/icons/react/Contrast24Icon.tsx

@@ -5,7 +5,7 @@
  *
  * Copyright Oxide Computer Company
  */
-import { SVGProps } from 'react'
+import type { SVGProps } from 'react'
 
 interface SVGRProps {
   title?: string
@@ -17,20 +17,20 @@ const Contrast24Icon = ({
   ...props
 }: SVGProps<SVGSVGElement> & SVGRProps) => (
   <svg
+    xmlns="http://www.w3.org/2000/svg"
     width={24}
     height={24}
     viewBox="0 0 24 24"
-    xmlns="http://www.w3.org/2000/svg"
     role="img"
     aria-labelledby={titleId}
     {...props}
   >
     {title ? <title id={titleId}>{title}</title> : null}
     <path
+      fill="currentColor"
       fillRule="evenodd"
+      d="M12 22c5.523 0 10-4.477 10-10S17.523 2 12 2 2 6.477 2 12s4.477 10 10 10m2.679-3.533c-.85.352-1.76.533-2.679.533V5a7 7 0 0 1 2.679 13.467"
       clipRule="evenodd"
-      d="M12 22c5.523 0 10-4.477 10-10S17.523 2 12 2 2 6.477 2 12s4.477 10 10 10Zm2.679-3.533c-.85.352-1.76.533-2.679.533V5a7 7 0 0 1 2.679 13.467Z"
-      fill="currentColor"
     />
   </svg>
 )

package/icons/react/Copy12Icon.tsx

@@ -5,7 +5,7 @@
  *
  * Copyright Oxide Computer Company
  */
-import { SVGProps } from 'react'
+import type { SVGProps } from 'react'
 
 interface SVGRProps {
   title?: string
@@ -13,20 +13,20 @@ interface SVGRProps {
 }
 const Copy12Icon = ({ title, titleId, ...props }: SVGProps<SVGSVGElement> & SVGRProps) => (
   <svg
+    xmlns="http://www.w3.org/2000/svg"
     width={12}
     height={12}
     viewBox="0 0 12 12"
-    xmlns="http://www.w3.org/2000/svg"
     role="img"
     aria-labelledby={titleId}
     {...props}
   >
     {title ? <title id={titleId}>{title}</title> : null}
     <path
+      fill="currentColor"
       fillRule="evenodd"
+      d="M9.5 2.5v-1H4V.67C4 .3 4.3 0 4.67 0h5.66c.37 0 .67.3.67.67v7.66c0 .37-.3.67-.67.67H9.5V2.5m-7 8v-6h4v6zM1 3.67c0-.37.3-.67.67-.67h5.66c.37 0 .67.3.67.67v7.66c0 .37-.3.67-.67.67H1.67a.67.67 0 0 1-.67-.67z"
       clipRule="evenodd"
-      d="M9.5 2.5v-1H4V.67C4 .3 4.3 0 4.67 0h5.66c.37 0 .67.3.67.67v7.66c0 .37-.3.67-.67.67H9.5V2.5Zm-7 8v-6h4v6h-4ZM1 3.67c0-.37.3-.67.67-.67h5.66c.37 0 .67.3.67.67v7.66c0 .37-.3.67-.67.67H1.67a.67.67 0 0 1-.67-.67V3.67Z"
-      fill="currentColor"
     />
   </svg>
 )

package/icons/react/Cpu16Icon.tsx

@@ -5,7 +5,7 @@
  *
  * Copyright Oxide Computer Company
  */
-import { SVGProps } from 'react'
+import type { SVGProps } from 'react'
 
 interface SVGRProps {
   title?: string
@@ -13,20 +13,20 @@ interface SVGRProps {
 }
 const Cpu16Icon = ({ title, titleId, ...props }: SVGProps<SVGSVGElement> & SVGRProps) => (
   <svg
+    xmlns="http://www.w3.org/2000/svg"
     width={16}
     height={16}
     viewBox="0 0 16 16"
-    xmlns="http://www.w3.org/2000/svg"
     role="img"
     aria-labelledby={titleId}
     {...props}
   >
     {title ? <title id={titleId}>{title}</title> : null}
     <path
+      fill="currentColor"
       fillRule="evenodd"
+      d="M7 0v3h2V0h2v3h1.25a.75.75 0 0 1 .75.75V5h3v2h-3v2h3v2h-3v1.25a.75.75 0 0 1-.75.75H11v3H9v-3H7v3H5v-3H3.75a.75.75 0 0 1-.75-.75V11H0V9h3V7H0V5h3V3.75A.75.75 0 0 1 3.75 3H5V0zm0 9V7h2v2zm3.5-4h-5a.5.5 0 0 0-.5.5v5a.5.5 0 0 0 .5.5h5a.5.5 0 0 0 .5-.5v-5a.5.5 0 0 0-.5-.5"
       clipRule="evenodd"
-      d="M7 0v3h2V0h2v3h1.25a.75.75 0 0 1 .75.75V5h3v2h-3v2h3v2h-3v1.25a.75.75 0 0 1-.75.75H11v3H9v-3H7v3H5v-3H3.75a.75.75 0 0 1-.75-.75V11H0V9h3V7H0V5h3V3.75A.75.75 0 0 1 3.75 3H5V0h2Zm0 9V7h2v2H7Zm3.5-4h-5a.5.5 0 0 0-.5.5v5a.5.5 0 0 0 .5.5h5a.5.5 0 0 0 .5-.5v-5a.5.5 0 0 0-.5-.5Z"
-      fill="currentColor"
     />
   </svg>
 )

package/icons/react/Cpu24Icon.tsx

@@ -5,7 +5,7 @@
  *
  * Copyright Oxide Computer Company
  */
-import { SVGProps } from 'react'
+import type { SVGProps } from 'react'
 
 interface SVGRProps {
   title?: string
@@ -13,20 +13,20 @@ interface SVGRProps {
 }
 const Cpu24Icon = ({ title, titleId, ...props }: SVGProps<SVGSVGElement> & SVGRProps) => (
   <svg
+    xmlns="http://www.w3.org/2000/svg"
     width={24}
     height={24}
     viewBox="0 0 24 24"
-    xmlns="http://www.w3.org/2000/svg"
     role="img"
     aria-labelledby={titleId}
     {...props}
   >
     {title ? <title id={titleId}>{title}</title> : null}
     <path
+      fill="currentColor"
       fillRule="evenodd"
+      d="M7 2v3H6a1 1 0 0 0-1 1v1H2v2h3v2H2v2h3v2H2v2h3v1a1 1 0 0 0 1 1h1v3h2v-3h2v3h2v-3h2v3h2v-3h1a1 1 0 0 0 1-1v-1h3v-2h-3v-2h3v-2h-3V9h3V7h-3V6a1 1 0 0 0-1-1h-1V2h-2v3h-2V2h-2v3H9V2zm3 12v-4h4v4zm5.5-6h-7a.5.5 0 0 0-.5.5v7a.5.5 0 0 0 .5.5h7a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.5-.5"
       clipRule="evenodd"
-      d="M7 2v3H6a1 1 0 0 0-1 1v1H2v2h3v2H2v2h3v2H2v2h3v1a1 1 0 0 0 1 1h1v3h2v-3h2v3h2v-3h2v3h2v-3h1a1 1 0 0 0 1-1v-1h3v-2h-3v-2h3v-2h-3V9h3V7h-3V6a1 1 0 0 0-1-1h-1V2h-2v3h-2V2h-2v3H9V2H7Zm3 12v-4h4v4h-4Zm5.5-6h-7a.5.5 0 0 0-.5.5v7a.5.5 0 0 0 .5.5h7a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.5-.5Z"
-      fill="currentColor"
     />
   </svg>
 )

package/icons/react/Delete16Icon.tsx

@@ -5,7 +5,7 @@
  *
  * Copyright Oxide Computer Company
  */
-import { SVGProps } from 'react'
+import type { SVGProps } from 'react'
 
 interface SVGRProps {
   title?: string
@@ -17,20 +17,20 @@ const Delete16Icon = ({
   ...props
 }: SVGProps<SVGSVGElement> & SVGRProps) => (
   <svg
+    xmlns="http://www.w3.org/2000/svg"
     width={16}
     height={16}
     viewBox="0 0 16 16"
-    xmlns="http://www.w3.org/2000/svg"
     role="img"
     aria-labelledby={titleId}
     {...props}
   >
     {title ? <title id={titleId}>{title}</title> : null}
     <path
+      fill="currentColor"
       fillRule="evenodd"
+      d="M9.69 0a.75.75 0 0 1 .53.22l.56.56c.141.141.332.22.53.22h1.94a.75.75 0 0 1 .75.75v.5a.75.75 0 0 1-.75.75H2.75A.75.75 0 0 1 2 2.25v-.5A.75.75 0 0 1 2.75 1h1.94a.75.75 0 0 0 .53-.22l.56-.56A.75.75 0 0 1 6.31 0zM3.75 5a.75.75 0 0 0-.75.75v9.5c0 .414.336.75.75.75h8.5a.75.75 0 0 0 .75-.75v-9.5a.75.75 0 0 0-.75-.75zM6.5 7a.5.5 0 0 1 .5.5v6a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-6a.5.5 0 0 1 .5-.5zm3 0a.5.5 0 0 0-.5.5v6a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-6a.5.5 0 0 0-.5-.5z"
       clipRule="evenodd"
-      d="M9.69 0a.75.75 0 0 1 .53.22l.56.56c.141.141.332.22.53.22h1.94a.75.75 0 0 1 .75.75v.5a.75.75 0 0 1-.75.75H2.75A.75.75 0 0 1 2 2.25v-.5A.75.75 0 0 1 2.75 1h1.94a.75.75 0 0 0 .53-.22l.56-.56A.75.75 0 0 1 6.31 0h3.38ZM3.75 5a.75.75 0 0 0-.75.75v9.5c0 .414.336.75.75.75h8.5a.75.75 0 0 0 .75-.75v-9.5a.75.75 0 0 0-.75-.75h-8.5ZM6.5 7a.5.5 0 0 1 .5.5v6a.5.5 0 0 1-.5.5h-1a.5.5 0 0 1-.5-.5v-6a.5.5 0 0 1 .5-.5h1Zm3 0a.5.5 0 0 0-.5.5v6a.5.5 0 0 0 .5.5h1a.5.5 0 0 0 .5-.5v-6a.5.5 0 0 0-.5-.5h-1Z"
-      fill="currentColor"
     />
   </svg>
 )

package/icons/react/Delete24Icon.tsx

@@ -5,7 +5,7 @@
  *
  * Copyright Oxide Computer Company
  */
-import { SVGProps } from 'react'
+import type { SVGProps } from 'react'
 
 interface SVGRProps {
   title?: string
@@ -17,20 +17,20 @@ const Delete24Icon = ({
   ...props
 }: SVGProps<SVGSVGElement> & SVGRProps) => (
   <svg
+    xmlns="http://www.w3.org/2000/svg"
     width={24}
     height={24}
     viewBox="0 0 24 24"
-    xmlns="http://www.w3.org/2000/svg"
     role="img"
     aria-labelledby={titleId}
     {...props}
   >
     {title ? <title id={titleId}>{title}</title> : null}
     <path
+      fill="currentColor"
       fillRule="evenodd"
+      d="M14.586 1a1 1 0 0 1 .707.293l.414.414a1 1 0 0 0 .707.293H20a1 1 0 0 1 1 1v1a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V3a1 1 0 0 1 1-1h3.586a1 1 0 0 0 .707-.293l.414-.414A1 1 0 0 1 9.414 1zM6 7a1 1 0 0 0-1 1v14a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V8a1 1 0 0 0-1-1zm4 3a1 1 0 0 1 1 1v8a1 1 0 0 1-1 1H9a1 1 0 0 1-1-1v-8a1 1 0 0 1 1-1zm4 0a1 1 0 0 0-1 1v8a1 1 0 0 0 1 1h1a1 1 0 0 0 1-1v-8a1 1 0 0 0-1-1z"
       clipRule="evenodd"
-      d="M14.586 1a1 1 0 0 1 .707.293l.414.414a1 1 0 0 0 .707.293H20a1 1 0 0 1 1 1v1a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V3a1 1 0 0 1 1-1h3.586a1 1 0 0 0 .707-.293l.414-.414A1 1 0 0 1 9.414 1h5.172ZM6 7a1 1 0 0 0-1 1v14a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1V8a1 1 0 0 0-1-1H6Zm4 3a1 1 0 0 1 1 1v8a1 1 0 0 1-1 1H9a1 1 0 0 1-1-1v-8a1 1 0 0 1 1-1h1Zm4 0a1 1 0 0 0-1 1v8a1 1 0 0 0 1 1h1a1 1 0 0 0 1-1v-8a1 1 0 0 0-1-1h-1Z"
-      fill="currentColor"
     />
   </svg>
 )

package/icons/react/DirectionDownIcon.tsx

@@ -5,7 +5,7 @@
  *
  * Copyright Oxide Computer Company
  */
-import { SVGProps } from 'react'
+import type { SVGProps } from 'react'
 
 interface SVGRProps {
   title?: string
@@ -17,18 +17,18 @@ const DirectionDownIcon = ({
   ...props
 }: SVGProps<SVGSVGElement> & SVGRProps) => (
   <svg
+    xmlns="http://www.w3.org/2000/svg"
     width={12}
     height={12}
     viewBox="0 0 12 12"
-    xmlns="http://www.w3.org/2000/svg"
     role="img"
     aria-labelledby={titleId}
     {...props}
   >
     {title ? <title id={titleId}>{title}</title> : null}
     <path
-      d="M5.403 8.807a.667.667 0 0 0 1.194 0l2.92-5.842A.667.667 0 0 0 8.921 2H3.079a.667.667 0 0 0-.596.965l2.92 5.842Z"
       fill="currentColor"
+      d="M5.403 8.807a.667.667 0 0 0 1.194 0l2.92-5.842A.667.667 0 0 0 8.921 2H3.079a.667.667 0 0 0-.596.965z"
     />
   </svg>
 )

package/icons/react/DirectionLeftIcon.tsx

@@ -5,7 +5,7 @@
  *
  * Copyright Oxide Computer Company
  */
-import { SVGProps } from 'react'
+import type { SVGProps } from 'react'
 
 interface SVGRProps {
   title?: string
@@ -17,18 +17,18 @@ const DirectionLeftIcon = ({
   ...props
 }: SVGProps<SVGSVGElement> & SVGRProps) => (
   <svg
+    xmlns="http://www.w3.org/2000/svg"
     width={12}
     height={12}
     viewBox="0 0 12 12"
-    xmlns="http://www.w3.org/2000/svg"
     role="img"
     aria-labelledby={titleId}
     {...props}
   >
     {title ? <title id={titleId}>{title}</title> : null}
     <path
-      d="M3.193 5.403a.667.667 0 0 0 0 1.194l5.842 2.92c.443.222.965-.1.965-.596V3.079a.667.667 0 0 0-.965-.596l-5.842 2.92Z"
       fill="currentColor"
+      d="M3.193 5.403a.667.667 0 0 0 0 1.194l5.842 2.92c.443.222.965-.1.965-.596V3.079a.667.667 0 0 0-.965-.596z"
     />
   </svg>
 )

package/icons/react/DirectionRightIcon.tsx

@@ -5,7 +5,7 @@
  *
  * Copyright Oxide Computer Company
  */
-import { SVGProps } from 'react'
+import type { SVGProps } from 'react'
 
 interface SVGRProps {
   title?: string
@@ -17,18 +17,18 @@ const DirectionRightIcon = ({
   ...props
 }: SVGProps<SVGSVGElement> & SVGRProps) => (
   <svg
+    xmlns="http://www.w3.org/2000/svg"
     width={12}
     height={12}
     viewBox="0 0 12 12"
-    xmlns="http://www.w3.org/2000/svg"
     role="img"
     aria-labelledby={titleId}
     {...props}
   >
     {title ? <title id={titleId}>{title}</title> : null}
     <path
-      d="M8.807 6.597a.667.667 0 0 0 0-1.194l-5.842-2.92A.667.667 0 0 0 2 3.079v5.842c0 .496.522.818.965.596l5.842-2.92Z"
       fill="currentColor"
+      d="M8.807 6.597a.667.667 0 0 0 0-1.194l-5.842-2.92A.667.667 0 0 0 2 3.079v5.842c0 .496.522.818.965.596z"
     />
   </svg>
 )

package/icons/react/DirectionUpIcon.tsx

@@ -5,7 +5,7 @@
  *
  * Copyright Oxide Computer Company
  */
-import { SVGProps } from 'react'
+import type { SVGProps } from 'react'
 
 interface SVGRProps {
   title?: string
@@ -17,18 +17,18 @@ const DirectionUpIcon = ({
   ...props
 }: SVGProps<SVGSVGElement> & SVGRProps) => (
   <svg
+    xmlns="http://www.w3.org/2000/svg"
     width={12}
     height={12}
     viewBox="0 0 12 12"
-    xmlns="http://www.w3.org/2000/svg"
     role="img"
     aria-labelledby={titleId}
     {...props}
   >
     {title ? <title id={titleId}>{title}</title> : null}
     <path
-      d="M6.597 3.193a.667.667 0 0 0-1.194 0l-2.92 5.842c-.222.443.1.965.596.965h5.842a.667.667 0 0 0 .596-.965l-2.92-5.842Z"
       fill="currentColor"
+      d="M6.597 3.193a.667.667 0 0 0-1.194 0l-2.92 5.842c-.222.443.1.965.596.965h5.842a.667.667 0 0 0 .596-.965z"
     />
   </svg>
 )

package/icons/react/Disabled12Icon.tsx

@@ -5,7 +5,7 @@
  *
  * Copyright Oxide Computer Company
  */
-import { SVGProps } from 'react'
+import type { SVGProps } from 'react'
 
 interface SVGRProps {
   title?: string
@@ -17,20 +17,20 @@ const Disabled12Icon = ({
   ...props
 }: SVGProps<SVGSVGElement> & SVGRProps) => (
   <svg
+    xmlns="http://www.w3.org/2000/svg"
     width={12}
     height={12}
     viewBox="0 0 12 12"
-    xmlns="http://www.w3.org/2000/svg"
     role="img"
     aria-labelledby={titleId}
     {...props}
   >
     {title ? <title id={titleId}>{title}</title> : null}
     <path
+      fill="currentColor"
       fillRule="evenodd"
+      d="M6 12A6 6 0 1 0 6 0a6 6 0 0 0 0 12M3.167 6.75a.667.667 0 0 1-.667-.667v-.166c0-.368.299-.667.667-.667h5.666c.368 0 .667.299.667.667v.166a.667.667 0 0 1-.667.667z"
       clipRule="evenodd"
-      d="M6 12A6 6 0 1 0 6 0a6 6 0 0 0 0 12ZM3.167 6.75a.667.667 0 0 1-.667-.667v-.166c0-.368.299-.667.667-.667h5.666c.368 0 .667.299.667.667v.166a.667.667 0 0 1-.667.667H3.167Z"
-      fill="currentColor"
     />
   </svg>
 )

package/icons/react/Dislike16Icon.tsx

@@ -5,7 +5,7 @@
  *
  * Copyright Oxide Computer Company
  */
-import { SVGProps } from 'react'
+import type { SVGProps } from 'react'
 
 interface SVGRProps {
   title?: string
@@ -17,20 +17,20 @@ const Dislike16Icon = ({
   ...props
 }: SVGProps<SVGSVGElement> & SVGRProps) => (
   <svg
+    xmlns="http://www.w3.org/2000/svg"
     width={16}
     height={16}
     viewBox="0 0 16 16"
-    xmlns="http://www.w3.org/2000/svg"
     role="img"
     aria-labelledby={titleId}
     {...props}
   >
     {title ? <title id={titleId}>{title}</title> : null}
     <path
+      fill="currentColor"
       fillRule="evenodd"
+      d="M8.379 14.527 12 10V1H4.464a.75.75 0 0 0-.671.415L1 7v1a2 2 0 0 0 2 2h4l-.61 2.444a2 2 0 0 0 1.045 2.273l.023.012a.75.75 0 0 0 .92-.202M14.25 10a.75.75 0 0 0 .75-.75v-7.5a.75.75 0 0 0-.75-.75H13v9z"
       clipRule="evenodd"
-      d="M8.379 14.527 12 10V1H4.464a.75.75 0 0 0-.671.415L1 7v1a2 2 0 0 0 2 2h4l-.61 2.444a2 2 0 0 0 1.045 2.273l.023.012a.75.75 0 0 0 .92-.202ZM14.25 10a.75.75 0 0 0 .75-.75v-7.5a.75.75 0 0 0-.75-.75H13v9h1.25Z"
-      fill="currentColor"
     />
   </svg>
 )

package/icons/react/Dislike24Icon.tsx

@@ -5,7 +5,7 @@
  *
  * Copyright Oxide Computer Company
  */
-import { SVGProps } from 'react'
+import type { SVGProps } from 'react'
 
 interface SVGRProps {
   title?: string
@@ -17,20 +17,20 @@ const Dislike24Icon = ({
   ...props
 }: SVGProps<SVGSVGElement> & SVGRProps) => (
   <svg
+    xmlns="http://www.w3.org/2000/svg"
     width={24}
     height={24}
     viewBox="0 0 24 24"
-    xmlns="http://www.w3.org/2000/svg"
     role="img"
     aria-labelledby={titleId}
     {...props}
   >
     {title ? <title id={titleId}>{title}</title> : null}
     <path
+      fill="currentColor"
       fillRule="evenodd"
+      d="M11.328 23.616 17 16.982V4H5.78a.75.75 0 0 0-.689.455L1 14v.982a2 2 0 0 0 2 2h6.571l-1.098 4.207a2 2 0 0 0 1.302 2.403l.746.248a.75.75 0 0 0 .807-.224m9.922-6.634a.75.75 0 0 0 .75-.75V4.75a.75.75 0 0 0-.75-.75h-2.107v12.982z"
       clipRule="evenodd"
-      d="M11.328 23.616 17 16.982V4H5.78a.75.75 0 0 0-.689.455L1 14v.982a2 2 0 0 0 2 2h6.571l-1.098 4.207a2 2 0 0 0 1.302 2.403l.746.248a.75.75 0 0 0 .807-.224Zm9.922-6.634a.75.75 0 0 0 .75-.75V4.75a.75.75 0 0 0-.75-.75h-2.107v12.982h2.107Z"
-      fill="currentColor"
     />
   </svg>
 )