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

package/icons/react/Filter12Icon.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 Filter12Icon = ({
   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 fillRule="evenodd" clipRule="evenodd" d="M0 1.667C0 1.299.299 1 .667 1h10.666c.368 0 .667.299.667.667v.666a.667.667 0 0 1-.667.667H.667A.667.667 0 0 1 0 2.333v-.666Zm2 4C2 5.299 2.299 5 2.667 5h6.666c.368 0 .667.299.667.667v.666A.667.667 0 0 1 9.333 7H2.667A.667.667 0 0 1 2 6.333v-.666Zm6 4A.667.667 0 0 0 7.333 9H4.667A.667.667 0 0 0 4 9.667v.666c0 .368.299.667.667.667h2.666A.667.667 0 0 0 8 10.333v-.666Z" fill="currentColor" /></svg>;
-export default Filter12Icon;
+}: 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
+      fillRule="evenodd"
+      clipRule="evenodd"
+      d="M0 1.667C0 1.299.299 1 .667 1h10.666c.368 0 .667.299.667.667v.666a.667.667 0 0 1-.667.667H.667A.667.667 0 0 1 0 2.333v-.666Zm2 4C2 5.299 2.299 5 2.667 5h6.666c.368 0 .667.299.667.667v.666A.667.667 0 0 1 9.333 7H2.667A.667.667 0 0 1 2 6.333v-.666Zm6 4A.667.667 0 0 0 7.333 9H4.667A.667.667 0 0 0 4 9.667v.666c0 .368.299.667.667.667h2.666A.667.667 0 0 0 8 10.333v-.666Z"
+      fill="currentColor"
+    />
+  </svg>
+)
+export default Filter12Icon

package/icons/react/Firewall16Icon.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 Firewall16Icon = ({
   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="M0 .75A.75.75 0 0 1 .75 0h5.5A.75.75 0 0 1 7 .75v1.5a.75.75 0 0 1-.75.75H.75A.75.75 0 0 1 0 2.25V.75Zm0 13A.75.75 0 0 1 .75 13h5.5a.75.75 0 0 1 .75.75v1.5a.75.75 0 0 1-.75.75H.75a.75.75 0 0 1-.75-.75v-1.5ZM9.75 13a.75.75 0 0 0-.75.75v1.5c0 .414.336.75.75.75h5.5a.75.75 0 0 0 .75-.75v-1.5a.75.75 0 0 0-.75-.75h-5.5ZM0 5.75A.75.75 0 0 1 .75 5h1.5a.75.75 0 0 1 .75.75v4.5a.75.75 0 0 1-.75.75H.75a.75.75 0 0 1-.75-.75v-4.5ZM13.75 5a.75.75 0 0 0-.75.75v4.5c0 .414.336.75.75.75h1.5a.75.75 0 0 0 .75-.75v-4.5a.75.75 0 0 0-.75-.75h-1.5ZM9 .75A.75.75 0 0 1 9.75 0h5.5a.75.75 0 0 1 .75.75v1.5a.75.75 0 0 1-.75.75h-5.5A.75.75 0 0 1 9 2.25V.75ZM7.796 11.867c.124.081.284.081.408 0l1.196-.776c1-.691 1.6-1.855 1.6-3.127V5.375A.375.375 0 0 0 10.625 5h-5.25A.375.375 0 0 0 5 5.375v2.589c0 1.272.6 2.472 1.6 3.127l1.196.776Z" fill="currentColor" /></svg>;
-export default Firewall16Icon;
+}: 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="M0 .75A.75.75 0 0 1 .75 0h5.5A.75.75 0 0 1 7 .75v1.5a.75.75 0 0 1-.75.75H.75A.75.75 0 0 1 0 2.25V.75Zm0 13A.75.75 0 0 1 .75 13h5.5a.75.75 0 0 1 .75.75v1.5a.75.75 0 0 1-.75.75H.75a.75.75 0 0 1-.75-.75v-1.5ZM9.75 13a.75.75 0 0 0-.75.75v1.5c0 .414.336.75.75.75h5.5a.75.75 0 0 0 .75-.75v-1.5a.75.75 0 0 0-.75-.75h-5.5ZM0 5.75A.75.75 0 0 1 .75 5h1.5a.75.75 0 0 1 .75.75v4.5a.75.75 0 0 1-.75.75H.75a.75.75 0 0 1-.75-.75v-4.5ZM13.75 5a.75.75 0 0 0-.75.75v4.5c0 .414.336.75.75.75h1.5a.75.75 0 0 0 .75-.75v-4.5a.75.75 0 0 0-.75-.75h-1.5ZM9 .75A.75.75 0 0 1 9.75 0h5.5a.75.75 0 0 1 .75.75v1.5a.75.75 0 0 1-.75.75h-5.5A.75.75 0 0 1 9 2.25V.75ZM7.796 11.867c.124.081.284.081.408 0l1.196-.776c1-.691 1.6-1.855 1.6-3.127V5.375A.375.375 0 0 0 10.625 5h-5.25A.375.375 0 0 0 5 5.375v2.589c0 1.272.6 2.472 1.6 3.127l1.196.776Z"
+      fill="currentColor"
+    />
+  </svg>
+)
+export default Firewall16Icon

package/icons/react/Firewall24Icon.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 Firewall24Icon = ({
   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-1h7a1 1 0 0 1 1 1v3a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V3Zm0 15a1 1 0 0 1 1-1h7a1 1 0 0 1 1 1v3a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1v-3Zm1-9a1 1 0 0 0-1 1v4a1 1 0 0 0 1 1h3a1 1 0 0 0 1-1v-4a1 1 0 0 0-1-1H3Zm14 1a1 1 0 0 1 1-1h3a1 1 0 0 1 1 1v4a1 1 0 0 1-1 1h-3a1 1 0 0 1-1-1v-4Zm-3-8a1 1 0 0 0-1 1v3a1 1 0 0 0 1 1h7a1 1 0 0 0 1-1V3a1 1 0 0 0-1-1h-7Zm-1 16a1 1 0 0 1 1-1h7a1 1 0 0 1 1 1v3a1 1 0 0 1-1 1h-7a1 1 0 0 1-1-1v-3Zm-1.272-2.177a.5.5 0 0 0 .544 0l1.128-.732c1-.691 1.6-1.855 1.6-3.127V9.5a.5.5 0 0 0-.5-.5h-5a.5.5 0 0 0-.5.5v2.464c0 1.272.6 2.472 1.6 3.127l1.128.732Z" fill="currentColor" /></svg>;
-export default Firewall24Icon;
+}: 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-1h7a1 1 0 0 1 1 1v3a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V3Zm0 15a1 1 0 0 1 1-1h7a1 1 0 0 1 1 1v3a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1v-3Zm1-9a1 1 0 0 0-1 1v4a1 1 0 0 0 1 1h3a1 1 0 0 0 1-1v-4a1 1 0 0 0-1-1H3Zm14 1a1 1 0 0 1 1-1h3a1 1 0 0 1 1 1v4a1 1 0 0 1-1 1h-3a1 1 0 0 1-1-1v-4Zm-3-8a1 1 0 0 0-1 1v3a1 1 0 0 0 1 1h7a1 1 0 0 0 1-1V3a1 1 0 0 0-1-1h-7Zm-1 16a1 1 0 0 1 1-1h7a1 1 0 0 1 1 1v3a1 1 0 0 1-1 1h-7a1 1 0 0 1-1-1v-3Zm-1.272-2.177a.5.5 0 0 0 .544 0l1.128-.732c1-.691 1.6-1.855 1.6-3.127V9.5a.5.5 0 0 0-.5-.5h-5a.5.5 0 0 0-.5.5v2.464c0 1.272.6 2.472 1.6 3.127l1.128.732Z"
+      fill="currentColor"
+    />
+  </svg>
+)
+export default Firewall24Icon

package/icons/react/Folder16Icon.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 Folder16Icon = ({
   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.75 2h6.773a.75.75 0 0 1 .75.75v1.16H1V2.75A.75.75 0 0 1 1.75 2ZM1 5h13.25a.75.75 0 0 1 .75.75v7.5a.75.75 0 0 1-.75.75H1.75a.75.75 0 0 1-.75-.75V5Z" fill="currentColor" /></svg>;
-export default Folder16Icon;
+}: 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.75 2h6.773a.75.75 0 0 1 .75.75v1.16H1V2.75A.75.75 0 0 1 1.75 2ZM1 5h13.25a.75.75 0 0 1 .75.75v7.5a.75.75 0 0 1-.75.75H1.75a.75.75 0 0 1-.75-.75V5Z"
+      fill="currentColor"
+    />
+  </svg>
+)
+export default Folder16Icon

package/icons/react/Folder24Icon.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 Folder24Icon = ({
   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 3h10a1 1 0 0 1 1 1v2H1V4a1 1 0 0 1 1-1ZM1 8h21a1 1 0 0 1 1 1v11a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V8Z" fill="currentColor" /></svg>;
-export default Folder24Icon;
+}: 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 3h10a1 1 0 0 1 1 1v2H1V4a1 1 0 0 1 1-1ZM1 8h21a1 1 0 0 1 1 1v11a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V8Z"
+      fill="currentColor"
+    />
+  </svg>
+)
+export default Folder24Icon

package/icons/react/Gateway16Icon.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 Gateway16Icon = ({
   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.75 0h10.5a.75.75 0 0 1 .75.75v14.5a.75.75 0 0 1-.75.75H2.75a.75.75 0 0 1-.75-.75V.75A.75.75 0 0 1 2.75 0Zm3.471 4.15A.375.375 0 0 0 6 4.492v6.838c0 .143.082.274.21.337l4.25 2.07c.25.122.54-.06.54-.337V2.58a.375.375 0 0 0-.529-.342l-4.25 1.913Z" fill="currentColor" /></svg>;
-export default Gateway16Icon;
+}: 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.75 0h10.5a.75.75 0 0 1 .75.75v14.5a.75.75 0 0 1-.75.75H2.75a.75.75 0 0 1-.75-.75V.75A.75.75 0 0 1 2.75 0Zm3.471 4.15A.375.375 0 0 0 6 4.492v6.838c0 .143.082.274.21.337l4.25 2.07c.25.122.54-.06.54-.337V2.58a.375.375 0 0 0-.529-.342l-4.25 1.913Z"
+      fill="currentColor"
+    />
+  </svg>
+)
+export default Gateway16Icon

package/icons/react/Gateway24Icon.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 Gateway24Icon = ({
   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="M4 1h16a1 1 0 0 1 1 1v20a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1Zm6.306 5.246a.5.5 0 0 0-.306.46v10.32a.5.5 0 0 0 .292.454l7 3.197a.5.5 0 0 0 .708-.455V3.754a.5.5 0 0 0-.694-.461l-7 2.953Z" fill="currentColor" /></svg>;
-export default Gateway24Icon;
+}: 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="M4 1h16a1 1 0 0 1 1 1v20a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1Zm6.306 5.246a.5.5 0 0 0-.306.46v10.32a.5.5 0 0 0 .292.454l7 3.197a.5.5 0 0 0 .708-.455V3.754a.5.5 0 0 0-.694-.461l-7 2.953Z"
+      fill="currentColor"
+    />
+  </svg>
+)
+export default Gateway24Icon

package/icons/react/Heart16Icon.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 Heart16Icon = ({
-  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 d="M8 3.228a4.05 4.05 0 0 1 5.793 0c1.61 1.626 1.61 4.292 0 5.918l-5.257 5.312a.75.75 0 0 1-1.069-.003l-5.26-5.374c-1.61-1.626-1.61-4.292 0-5.918A4.108 4.108 0 0 1 8 3.228Z" fill="currentColor" /></svg>;
-export default Heart16Icon;
+const Heart16Icon = ({ 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
+      d="M8 3.228a4.05 4.05 0 0 1 5.793 0c1.61 1.626 1.61 4.292 0 5.918l-5.257 5.312a.75.75 0 0 1-1.069-.003l-5.26-5.374c-1.61-1.626-1.61-4.292 0-5.918A4.108 4.108 0 0 1 8 3.228Z"
+      fill="currentColor"
+    />
+  </svg>
+)
+export default Heart16Icon

package/icons/react/Heart24Icon.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 Heart24Icon = ({
-  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 d="M12 3.889c2.299-2.502 5.977-2.502 8.276 0 2.299 2.501 2.299 6.604 0 9.106l-7.536 8.2a1 1 0 0 1-1.476-.005l-7.54-8.296c-2.299-2.501-2.299-6.604 0-9.105 2.299-2.402 5.977-2.402 8.276.1Z" fill="currentColor" /></svg>;
-export default Heart24Icon;
+const Heart24Icon = ({ 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
+      d="M12 3.889c2.299-2.502 5.977-2.502 8.276 0 2.299 2.501 2.299 6.604 0 9.106l-7.536 8.2a1 1 0 0 1-1.476-.005l-7.54-8.296c-2.299-2.501-2.299-6.604 0-9.105 2.299-2.402 5.977-2.402 8.276.1Z"
+      fill="currentColor"
+    />
+  </svg>
+)
+export default Heart24Icon

package/icons/react/Hide12Icon.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 Hide12Icon = ({
-  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 fillRule="evenodd" clipRule="evenodd" d="M11.539 1.385 1.385 11.539a.653.653 0 1 1-.923-.924L2.298 8.78C1.117 7.92.392 6.835.086 6.31a.61.61 0 0 1 0-.622C.635 4.749 2.534 2 6 2c.966 0 1.81.213 2.536.54l2.08-2.078a.653.653 0 0 1 .923.923ZM6.867 4.21 4.183 6.894A2 2 0 0 1 6.866 4.21Zm1.099 1.624L10.19 3.61a8.46 8.46 0 0 1 1.723 2.08.61.61 0 0 1 0 .622C11.366 7.251 9.467 10 6 10a6.142 6.142 0 0 1-1.903-.297l1.71-1.71a2 2 0 0 0 2.16-2.16Z" fill="currentColor" /></svg>;
-export default Hide12Icon;
+const Hide12Icon = ({ 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
+      fillRule="evenodd"
+      clipRule="evenodd"
+      d="M11.539 1.385 1.385 11.539a.653.653 0 1 1-.923-.924L2.298 8.78C1.117 7.92.392 6.835.086 6.31a.61.61 0 0 1 0-.622C.635 4.749 2.534 2 6 2c.966 0 1.81.213 2.536.54l2.08-2.078a.653.653 0 0 1 .923.923ZM6.867 4.21 4.183 6.894A2 2 0 0 1 6.866 4.21Zm1.099 1.624L10.19 3.61a8.46 8.46 0 0 1 1.723 2.08.61.61 0 0 1 0 .622C11.366 7.251 9.467 10 6 10a6.142 6.142 0 0 1-1.903-.297l1.71-1.71a2 2 0 0 0 2.16-2.16Z"
+      fill="currentColor"
+    />
+  </svg>
+)
+export default Hide12Icon

package/icons/react/Hide16Icon.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 Hide16Icon = ({
-  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="M3.997 12.003 2.5 13.5a.707.707 0 1 1-1-1l1.28-1.28A10.638 10.638 0 0 1 .185 8.325a.63.63 0 0 1 0-.652C.852 6.563 3.357 3 8 3c.956 0 1.822.151 2.6.4l1.9-1.9a.707.707 0 0 1 1 1l-1.497 1.497L10.12 5.88 5.88 10.12l-1.882 1.882ZM5.13 8.87 8.87 5.13a3 3 0 0 0-3.743 3.743Zm8.09-4.09-2.348 2.348A3.003 3.003 0 0 1 7.13 10.87L5.4 12.6C6.178 12.85 7.044 13 8 13c4.643 0 7.148-3.563 7.816-4.674a.63.63 0 0 0 0-.652c-.35-.581-1.2-1.832-2.597-2.893Z" fill="currentColor" /></svg>;
-export default Hide16Icon;
+const Hide16Icon = ({ 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="M3.997 12.003 2.5 13.5a.707.707 0 1 1-1-1l1.28-1.28A10.638 10.638 0 0 1 .185 8.325a.63.63 0 0 1 0-.652C.852 6.563 3.357 3 8 3c.956 0 1.822.151 2.6.4l1.9-1.9a.707.707 0 0 1 1 1l-1.497 1.497L10.12 5.88 5.88 10.12l-1.882 1.882ZM5.13 8.87 8.87 5.13a3 3 0 0 0-3.743 3.743Zm8.09-4.09-2.348 2.348A3.003 3.003 0 0 1 7.13 10.87L5.4 12.6C6.178 12.85 7.044 13 8 13c4.643 0 7.148-3.563 7.816-4.674a.63.63 0 0 0 0-.652c-.35-.581-1.2-1.832-2.597-2.893Z"
+      fill="currentColor"
+    />
+  </svg>
+)
+export default Hide16Icon

package/icons/react/Hide24Icon.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 Hide24Icon = ({
-  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="M6.985 17.564 5.5 19.155a.707.707 0 1 1-1.033-.964l1.244-1.333c-2.63-1.669-4.135-3.998-4.623-4.845a.642.642 0 0 1 0-.647C1.88 9.99 5.367 4.69 12 4.69c1.621 0 3.055.316 4.306.815l1.195-1.28a.707.707 0 0 1 1.033.964l-.887.95-2.556 2.74-5.687 6.092-2.42 2.593Zm1.482-3.66 5.515-5.908a4.109 4.109 0 0 0-1.98-.506c-2.298 0-4.16 1.88-4.16 4.2 0 .813.229 1.572.625 2.215Zm10.398-6.997-3.003 3.218c.192.483.298 1.012.298 1.565 0 2.32-1.862 4.2-4.159 4.2-.46 0-.904-.076-1.319-.216l-2.289 2.453c1.08.35 2.28.563 3.608.563 6.635 0 10.12-5.3 10.914-6.677a.641.641 0 0 0 0-.647c-.451-.783-1.773-2.835-4.05-4.459Z" fill="currentColor" /></svg>;
-export default Hide24Icon;
+const Hide24Icon = ({ 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="M6.985 17.564 5.5 19.155a.707.707 0 1 1-1.033-.964l1.244-1.333c-2.63-1.669-4.135-3.998-4.623-4.845a.642.642 0 0 1 0-.647C1.88 9.99 5.367 4.69 12 4.69c1.621 0 3.055.316 4.306.815l1.195-1.28a.707.707 0 0 1 1.033.964l-.887.95-2.556 2.74-5.687 6.092-2.42 2.593Zm1.482-3.66 5.515-5.908a4.109 4.109 0 0 0-1.98-.506c-2.298 0-4.16 1.88-4.16 4.2 0 .813.229 1.572.625 2.215Zm10.398-6.997-3.003 3.218c.192.483.298 1.012.298 1.565 0 2.32-1.862 4.2-4.159 4.2-.46 0-.904-.076-1.319-.216l-2.289 2.453c1.08.35 2.28.563 3.608.563 6.635 0 10.12-5.3 10.914-6.677a.641.641 0 0 0 0-.647c-.451-.783-1.773-2.835-4.05-4.459Z"
+      fill="currentColor"
+    />
+  </svg>
+)
+export default Hide24Icon

package/icons/react/Hourglass16Icon.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 Hourglass16Icon = ({
   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="M4 0h-.25A.75.75 0 0 0 3 .75v.5c0 .414.336.75.75.75H4v2.625a.75.75 0 0 0 .3.6L8 8l-3.7 2.775a.75.75 0 0 0-.3.6V14h-.25a.75.75 0 0 0-.75.75v.5c0 .414.336.75.75.75h8.5a.75.75 0 0 0 .75-.75v-.5a.75.75 0 0 0-.75-.75H12v-2.625a.75.75 0 0 0-.3-.6L8 8l3.7-2.775a.75.75 0 0 0 .3-.6V2h.25a.75.75 0 0 0 .75-.75v-.5a.75.75 0 0 0-.75-.75H4Zm6 12v2H6v-2l2-1.5 2 1.5Z" fill="currentColor" /></svg>;
-export default Hourglass16Icon;
+}: 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="M4 0h-.25A.75.75 0 0 0 3 .75v.5c0 .414.336.75.75.75H4v2.625a.75.75 0 0 0 .3.6L8 8l-3.7 2.775a.75.75 0 0 0-.3.6V14h-.25a.75.75 0 0 0-.75.75v.5c0 .414.336.75.75.75h8.5a.75.75 0 0 0 .75-.75v-.5a.75.75 0 0 0-.75-.75H12v-2.625a.75.75 0 0 0-.3-.6L8 8l3.7-2.775a.75.75 0 0 0 .3-.6V2h.25a.75.75 0 0 0 .75-.75v-.5a.75.75 0 0 0-.75-.75H4Zm6 12v2H6v-2l2-1.5 2 1.5Z"
+      fill="currentColor"
+    />
+  </svg>
+)
+export default Hourglass16Icon

package/icons/react/Hourglass24Icon.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 Hourglass24Icon = ({
   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="M3 2a1 1 0 0 1 1-1h16a1 1 0 1 1 0 2h-2v4.465a1 1 0 0 1-.445.832L12 12 6.445 8.297A1 1 0 0 1 6 7.465V3H4a1 1 0 0 1-1-1Zm9 10-5.555 3.703a1 1 0 0 0-.445.832V21H4a1 1 0 1 0 0 2h16a1 1 0 1 0 0-2h-2v-4.465a1 1 0 0 0-.445-.832L12 12Zm-4 9v-3.93l4-2.666 4 2.666V21H8Z" fill="currentColor" /></svg>;
-export default Hourglass24Icon;
+}: 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="M3 2a1 1 0 0 1 1-1h16a1 1 0 1 1 0 2h-2v4.465a1 1 0 0 1-.445.832L12 12 6.445 8.297A1 1 0 0 1 6 7.465V3H4a1 1 0 0 1-1-1Zm9 10-5.555 3.703a1 1 0 0 0-.445.832V21H4a1 1 0 1 0 0 2h16a1 1 0 1 0 0-2h-2v-4.465a1 1 0 0 0-.445-.832L12 12Zm-4 9v-3.93l4-2.666 4 2.666V21H8Z"
+      fill="currentColor"
+    />
+  </svg>
+)
+export default Hourglass24Icon

package/icons/react/Images16Icon.tsx

@@ -5,14 +5,30 @@
  *
  * Copyright Oxide Computer Company
  */
-import { SVGProps } from "react";
+import { SVGProps } from 'react'
+
 interface SVGRProps {
-  title?: string;
-  titleId?: string;
+  title?: string
+  titleId?: string
 }
 const Images16Icon = ({
   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}<g fill="currentColor"><path d="M1.523 5.312A.375.375 0 0 0 1 5.657v5.808a.75.75 0 0 0 .451.688l5.024 2.184A.375.375 0 0 0 7 13.993V8.154a.75.75 0 0 0-.455-.69L1.523 5.313ZM9 13.993c0 .27.277.452.525.344l5.024-2.184a.75.75 0 0 0 .451-.688V5.657c0-.27-.275-.451-.523-.345L9.455 7.465A.75.75 0 0 0 9 8.154v5.84ZM12.891 3.816a.375.375 0 0 0 .002-.689L8.299 1.13a.75.75 0 0 0-.598 0L3.107 3.127c-.301.131-.3.56.002.689l4.596 1.97a.75.75 0 0 0 .59 0l4.596-1.97Z" /></g></svg>;
-export default Images16Icon;
+}: 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}
+    <g fill="currentColor">
+      <path d="M1.523 5.312A.375.375 0 0 0 1 5.657v5.808a.75.75 0 0 0 .451.688l5.024 2.184A.375.375 0 0 0 7 13.993V8.154a.75.75 0 0 0-.455-.69L1.523 5.313ZM9 13.993c0 .27.277.452.525.344l5.024-2.184a.75.75 0 0 0 .451-.688V5.657c0-.27-.275-.451-.523-.345L9.455 7.465A.75.75 0 0 0 9 8.154v5.84ZM12.891 3.816a.375.375 0 0 0 .002-.689L8.299 1.13a.75.75 0 0 0-.598 0L3.107 3.127c-.301.131-.3.56.002.689l4.596 1.97a.75.75 0 0 0 .59 0l4.596-1.97Z" />
+    </g>
+  </svg>
+)
+export default Images16Icon

package/icons/react/Images24Icon.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 Images24Icon = ({
   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="M11.499 11.71a1 1 0 0 0 1.002 0l8.252-4.777a.5.5 0 0 0 0-.866L12.5 1.29a1 1 0 0 0-1.002 0L3.247 6.067a.5.5 0 0 0 0 .866L11.5 11.71ZM11 14.088a1 1 0 0 0-.514-.874L2.743 8.913A.5.5 0 0 0 2 9.35v8.062a1 1 0 0 0 .514.874l7.743 4.301A.5.5 0 0 0 11 22.15v-8.062Zm2 0a1 1 0 0 1 .514-.874l7.743-4.301A.5.5 0 0 1 22 9.35v8.062a1 1 0 0 1-.514.874l-7.743 4.301A.5.5 0 0 1 13 22.15v-8.062Z" fill="currentColor" /></svg>;
-export default Images24Icon;
+}: 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="M11.499 11.71a1 1 0 0 0 1.002 0l8.252-4.777a.5.5 0 0 0 0-.866L12.5 1.29a1 1 0 0 0-1.002 0L3.247 6.067a.5.5 0 0 0 0 .866L11.5 11.71ZM11 14.088a1 1 0 0 0-.514-.874L2.743 8.913A.5.5 0 0 0 2 9.35v8.062a1 1 0 0 0 .514.874l7.743 4.301A.5.5 0 0 0 11 22.15v-8.062Zm2 0a1 1 0 0 1 .514-.874l7.743-4.301A.5.5 0 0 1 22 9.35v8.062a1 1 0 0 1-.514.874l-7.743 4.301A.5.5 0 0 1 13 22.15v-8.062Z"
+      fill="currentColor"
+    />
+  </svg>
+)
+export default Images24Icon