@oxide/design-system 1.2.4 → 1.2.5--canary.46.c02a6da.0

package/icons/react/Close12Icon.tsx

@@ -5,14 +5,27 @@
  *
  * Copyright Oxide Computer Company
  */
-import { SVGProps } from "react";
+import { SVGProps } from 'react'
+
 interface SVGRProps {
-  title?: string;
-  titleId?: string;
+  title?: string
+  titleId?: string
 }
-const Close12Icon = ({
-  title,
-  titleId,
-  ...props
-}: SVGProps<SVGSVGElement> & SVGRProps) => <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="M10.301 2.76a.667.667 0 0 0 0-.944l-.117-.117a.667.667 0 0 0-.943 0L6 4.939 2.76 1.7a.667.667 0 0 0-.944 0l-.117.117a.667.667 0 0 0 0 .943L4.939 6 1.7 9.24a.667.667 0 0 0 0 .944l.117.117c.26.26.683.26.943 0L6 7.061l3.24 3.24c.261.26.683.26.944 0l.117-.117a.667.667 0 0 0 0-.943L7.061 6l3.24-3.24Z" fill="currentColor" /></svg>;
-export default Close12Icon;
+const Close12Icon = ({ title, titleId, ...props }: SVGProps<SVGSVGElement> & SVGRProps) => (
+  <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="M10.301 2.76a.667.667 0 0 0 0-.944l-.117-.117a.667.667 0 0 0-.943 0L6 4.939 2.76 1.7a.667.667 0 0 0-.944 0l-.117.117a.667.667 0 0 0 0 .943L4.939 6 1.7 9.24a.667.667 0 0 0 0 .944l.117.117c.26.26.683.26.943 0L6 7.061l3.24 3.24c.261.26.683.26.944 0l.117-.117a.667.667 0 0 0 0-.943L7.061 6l3.24-3.24Z"
+      fill="currentColor"
+    />
+  </svg>
+)
+export default Close12Icon

package/icons/react/Close16Icon.tsx

@@ -5,14 +5,29 @@
  *
  * Copyright Oxide Computer Company
  */
-import { SVGProps } from "react";
+import { SVGProps } from 'react'
+
 interface SVGRProps {
-  title?: string;
-  titleId?: string;
+  title?: string
+  titleId?: string
 }
-const Close16Icon = ({
-  title,
-  titleId,
-  ...props
-}: SVGProps<SVGSVGElement> & SVGRProps) => <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 fillRule="evenodd" clipRule="evenodd" d="M2.22 2.644a.75.75 0 0 0 0 1.06L6.514 8 2.22 12.295a.75.75 0 0 0 0 1.06l.424.425a.75.75 0 0 0 1.06 0L8 9.483l4.295 4.296a.75.75 0 0 0 1.06 0l.425-.425a.75.75 0 0 0 0-1.06L9.484 8l4.295-4.296a.75.75 0 0 0 0-1.06l-.424-.424a.75.75 0 0 0-1.061 0L7.999 6.515 3.704 2.22a.75.75 0 0 0-1.06 0l-.424.424Z" fill="currentColor" /></svg>;
-export default Close16Icon;
+const Close16Icon = ({ title, titleId, ...props }: SVGProps<SVGSVGElement> & SVGRProps) => (
+  <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
+      fillRule="evenodd"
+      clipRule="evenodd"
+      d="M2.22 2.644a.75.75 0 0 0 0 1.06L6.514 8 2.22 12.295a.75.75 0 0 0 0 1.06l.424.425a.75.75 0 0 0 1.06 0L8 9.483l4.295 4.296a.75.75 0 0 0 1.06 0l.425-.425a.75.75 0 0 0 0-1.06L9.484 8l4.295-4.296a.75.75 0 0 0 0-1.06l-.424-.424a.75.75 0 0 0-1.061 0L7.999 6.515 3.704 2.22a.75.75 0 0 0-1.06 0l-.424.424Z"
+      fill="currentColor"
+    />
+  </svg>
+)
+export default Close16Icon

package/icons/react/Close8Icon.tsx

@@ -5,14 +5,29 @@
  *
  * Copyright Oxide Computer Company
  */
-import { SVGProps } from "react";
+import { SVGProps } from 'react'
+
 interface SVGRProps {
-  title?: string;
-  titleId?: string;
+  title?: string
+  titleId?: string
 }
-const Close8Icon = ({
-  title,
-  titleId,
-  ...props
-}: SVGProps<SVGSVGElement> & SVGRProps) => <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 fillRule="evenodd" 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>;
-export default Close8Icon;
+const Close8Icon = ({ title, titleId, ...props }: SVGProps<SVGSVGElement> & SVGRProps) => (
+  <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
+      fillRule="evenodd"
+      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>
+)
+export default Close8Icon

package/icons/react/Cloud16Icon.tsx

@@ -5,14 +5,29 @@
  *
  * Copyright Oxide Computer Company
  */
-import { SVGProps } from "react";
+import { SVGProps } from 'react'
+
 interface SVGRProps {
-  title?: string;
-  titleId?: string;
+  title?: string
+  titleId?: string
 }
-const Cloud16Icon = ({
-  title,
-  titleId,
-  ...props
-}: SVGProps<SVGSVGElement> & SVGRProps) => <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 fillRule="evenodd" 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>;
-export default Cloud16Icon;
+const Cloud16Icon = ({ title, titleId, ...props }: SVGProps<SVGSVGElement> & SVGRProps) => (
+  <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
+      fillRule="evenodd"
+      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>
+)
+export default Cloud16Icon

package/icons/react/Cloud24Icon.tsx

@@ -5,14 +5,29 @@
  *
  * Copyright Oxide Computer Company
  */
-import { SVGProps } from "react";
+import { SVGProps } from 'react'
+
 interface SVGRProps {
-  title?: string;
-  titleId?: string;
+  title?: string
+  titleId?: string
 }
-const Cloud24Icon = ({
-  title,
-  titleId,
-  ...props
-}: SVGProps<SVGSVGElement> & SVGRProps) => <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 fillRule="evenodd" 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>;
-export default Cloud24Icon;
+const Cloud24Icon = ({ title, titleId, ...props }: SVGProps<SVGSVGElement> & SVGRProps) => (
+  <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
+      fillRule="evenodd"
+      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>
+)
+export default Cloud24Icon

package/icons/react/Compability16Icon.tsx

@@ -5,14 +5,33 @@
  *
  * Copyright Oxide Computer Company
  */
-import { SVGProps } from "react";
+import { SVGProps } from 'react'
+
 interface SVGRProps {
-  title?: string;
-  titleId?: string;
+  title?: string
+  titleId?: string
 }
 const Compability16Icon = ({
   title,
   titleId,
   ...props
-}: SVGProps<SVGSVGElement> & SVGRProps) => <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 fillRule="evenodd" 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>;
-export default Compability16Icon;
+}: SVGProps<SVGSVGElement> & SVGRProps) => (
+  <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
+      fillRule="evenodd"
+      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>
+)
+export default Compability16Icon

package/icons/react/Compatibility24Icon.tsx

@@ -5,14 +5,33 @@
  *
  * Copyright Oxide Computer Company
  */
-import { SVGProps } from "react";
+import { SVGProps } from 'react'
+
 interface SVGRProps {
-  title?: string;
-  titleId?: string;
+  title?: string
+  titleId?: string
 }
 const Compatibility24Icon = ({
   title,
   titleId,
   ...props
-}: SVGProps<SVGSVGElement> & SVGRProps) => <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 fillRule="evenodd" 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>;
-export default Compatibility24Icon;
+}: SVGProps<SVGSVGElement> & SVGRProps) => (
+  <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
+      fillRule="evenodd"
+      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>
+)
+export default Compatibility24Icon

package/icons/react/Contrast16Icon.tsx

@@ -5,14 +5,33 @@
  *
  * Copyright Oxide Computer Company
  */
-import { SVGProps } from "react";
+import { SVGProps } from 'react'
+
 interface SVGRProps {
-  title?: string;
-  titleId?: string;
+  title?: string
+  titleId?: string
 }
 const Contrast16Icon = ({
   title,
   titleId,
   ...props
-}: SVGProps<SVGSVGElement> & SVGRProps) => <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 fillRule="evenodd" 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>;
-export default Contrast16Icon;
+}: SVGProps<SVGSVGElement> & SVGRProps) => (
+  <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
+      fillRule="evenodd"
+      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>
+)
+export default Contrast16Icon

package/icons/react/Contrast24Icon.tsx

@@ -5,14 +5,33 @@
  *
  * Copyright Oxide Computer Company
  */
-import { SVGProps } from "react";
+import { SVGProps } from 'react'
+
 interface SVGRProps {
-  title?: string;
-  titleId?: string;
+  title?: string
+  titleId?: string
 }
 const Contrast24Icon = ({
   title,
   titleId,
   ...props
-}: SVGProps<SVGSVGElement> & SVGRProps) => <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 fillRule="evenodd" 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>;
-export default Contrast24Icon;
+}: SVGProps<SVGSVGElement> & SVGRProps) => (
+  <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
+      fillRule="evenodd"
+      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>
+)
+export default Contrast24Icon

package/icons/react/Cpu16Icon.tsx

@@ -5,14 +5,29 @@
  *
  * Copyright Oxide Computer Company
  */
-import { SVGProps } from "react";
+import { SVGProps } from 'react'
+
 interface SVGRProps {
-  title?: string;
-  titleId?: string;
+  title?: string
+  titleId?: string
 }
-const Cpu16Icon = ({
-  title,
-  titleId,
-  ...props
-}: SVGProps<SVGSVGElement> & SVGRProps) => <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 fillRule="evenodd" 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>;
-export default Cpu16Icon;
+const Cpu16Icon = ({ title, titleId, ...props }: SVGProps<SVGSVGElement> & SVGRProps) => (
+  <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
+      fillRule="evenodd"
+      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>
+)
+export default Cpu16Icon

package/icons/react/Cpu24Icon.tsx

@@ -5,14 +5,29 @@
  *
  * Copyright Oxide Computer Company
  */
-import { SVGProps } from "react";
+import { SVGProps } from 'react'
+
 interface SVGRProps {
-  title?: string;
-  titleId?: string;
+  title?: string
+  titleId?: string
 }
-const Cpu24Icon = ({
-  title,
-  titleId,
-  ...props
-}: SVGProps<SVGSVGElement> & SVGRProps) => <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 fillRule="evenodd" 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>;
-export default Cpu24Icon;
+const Cpu24Icon = ({ title, titleId, ...props }: SVGProps<SVGSVGElement> & SVGRProps) => (
+  <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
+      fillRule="evenodd"
+      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>
+)
+export default Cpu24Icon

package/icons/react/Delete16Icon.tsx

@@ -5,14 +5,33 @@
  *
  * Copyright Oxide Computer Company
  */
-import { SVGProps } from "react";
+import { SVGProps } from 'react'
+
 interface SVGRProps {
-  title?: string;
-  titleId?: string;
+  title?: string
+  titleId?: string
 }
 const Delete16Icon = ({
   title,
   titleId,
   ...props
-}: SVGProps<SVGSVGElement> & SVGRProps) => <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 fillRule="evenodd" 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>;
-export default Delete16Icon;
+}: SVGProps<SVGSVGElement> & SVGRProps) => (
+  <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
+      fillRule="evenodd"
+      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>
+)
+export default Delete16Icon

package/icons/react/Delete24Icon.tsx

@@ -5,14 +5,33 @@
  *
  * Copyright Oxide Computer Company
  */
-import { SVGProps } from "react";
+import { SVGProps } from 'react'
+
 interface SVGRProps {
-  title?: string;
-  titleId?: string;
+  title?: string
+  titleId?: string
 }
 const Delete24Icon = ({
   title,
   titleId,
   ...props
-}: SVGProps<SVGSVGElement> & SVGRProps) => <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 fillRule="evenodd" 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>;
-export default Delete24Icon;
+}: SVGProps<SVGSVGElement> & SVGRProps) => (
+  <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
+      fillRule="evenodd"
+      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>
+)
+export default Delete24Icon

package/icons/react/DirectionDownIcon.tsx

@@ -5,14 +5,31 @@
  *
  * Copyright Oxide Computer Company
  */
-import { SVGProps } from "react";
+import { SVGProps } from 'react'
+
 interface SVGRProps {
-  title?: string;
-  titleId?: string;
+  title?: string
+  titleId?: string
 }
 const DirectionDownIcon = ({
   title,
   titleId,
   ...props
-}: SVGProps<SVGSVGElement> & SVGRProps) => <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" /></svg>;
-export default DirectionDownIcon;
+}: SVGProps<SVGSVGElement> & SVGRProps) => (
+  <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"
+    />
+  </svg>
+)
+export default DirectionDownIcon

package/icons/react/DirectionLeftIcon.tsx

@@ -5,14 +5,31 @@
  *
  * Copyright Oxide Computer Company
  */
-import { SVGProps } from "react";
+import { SVGProps } from 'react'
+
 interface SVGRProps {
-  title?: string;
-  titleId?: string;
+  title?: string
+  titleId?: string
 }
 const DirectionLeftIcon = ({
   title,
   titleId,
   ...props
-}: SVGProps<SVGSVGElement> & SVGRProps) => <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" /></svg>;
-export default DirectionLeftIcon;
+}: SVGProps<SVGSVGElement> & SVGRProps) => (
+  <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"
+    />
+  </svg>
+)
+export default DirectionLeftIcon

package/icons/react/DirectionRightIcon.tsx

@@ -5,14 +5,31 @@
  *
  * Copyright Oxide Computer Company
  */
-import { SVGProps } from "react";
+import { SVGProps } from 'react'
+
 interface SVGRProps {
-  title?: string;
-  titleId?: string;
+  title?: string
+  titleId?: string
 }
 const DirectionRightIcon = ({
   title,
   titleId,
   ...props
-}: SVGProps<SVGSVGElement> & SVGRProps) => <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" /></svg>;
-export default DirectionRightIcon;
+}: SVGProps<SVGSVGElement> & SVGRProps) => (
+  <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"
+    />
+  </svg>
+)
+export default DirectionRightIcon