@leafygreen-ui/icon 14.6.1 → 14.7.0

package/src/generated/Redo.tsx

@@ -2,10 +2,11 @@
 * This is a generated file. Do not modify it manually.
 *
 * @script packages/icon/scripts/prebuild/index.ts
-* @checksum 94bb886a2e3c4fbccf7f51d22f460fb6
+* @checksum f483fbf2370aef61ac33412fde3e377f
 */
 import * as React from "react";
 import { css, cx } from '@leafygreen-ui/emotion';
+import { useIdAllocator } from '@leafygreen-ui/hooks';
 import { generateAccessibleProps, sizeMap } from '../glyphCommon';
 import { LGGlyph } from '../types';
 export interface RedoProps extends LGGlyph.ComponentProps {}
@@ -19,6 +20,9 @@ const Redo = ({
   role = 'img',
   ...props
 }: RedoProps) => {
+  const titleId = useIdAllocator({
+    prefix: 'icon-title'
+  });
   const fillStyle = css`
         color: ${fill};
       `;
@@ -27,12 +31,13 @@ const Redo = ({
       `;
   const accessibleProps = generateAccessibleProps(role, 'Redo', {
     title,
+    titleId,
     ['aria-label']: ariaLabel,
     ['aria-labelledby']: ariaLabelledby
   });
   return <svg className={cx({
     [fillStyle]: fill != null
-  }, noFlexShrink, className)} height={typeof size === 'number' ? size : sizeMap[size]} width={typeof size === 'number' ? size : sizeMap[size]} role={role} {...accessibleProps} {...props} viewBox="0 0 16 16"><path d="M4.01756 9.40216C3.96845 9.72987 3.70455 10 3.37318 10H2.57318C2.24181 10 1.97003 9.73064 2.00272 9.40089C2.18023 7.6104 3.14483 6.05139 4.54567 5.07473C5.02468 4.73549 5.56726 4.46519 6.15478 4.28051C6.72834 4.09832 7.33928 4.00002 7.97318 4.00002C7.98266 3.99998 7.99215 4.00002 8.00164 4.00002C10.7006 4.00002 12.9519 5.71778 13.4688 8.00002H14.8831C15.4243 8.00002 15.6748 8.67204 15.2657 9.02631L12.7841 11.1755C12.5645 11.3657 12.2385 11.3657 12.0188 11.1755L9.53719 9.02631C9.12812 8.67204 9.37866 8.00002 9.91982 8.00002H11.3664C10.8977 6.91458 9.68595 6.00002 8.00164 6.00002C7.81503 6.00002 7.63422 6.01124 7.45958 6.03269C6.75401 6.12312 6.10595 6.39739 5.56496 6.80592C5.54654 6.8206 5.52833 6.83543 5.51032 6.85041C5.4936 6.86432 5.47625 6.87728 5.45838 6.88926C4.69892 7.50399 4.16907 8.39119 4.01756 9.40216Z" fill={'currentColor'} /></svg>;
+  }, noFlexShrink, className)} height={typeof size === 'number' ? size : sizeMap[size]} width={typeof size === 'number' ? size : sizeMap[size]} role={role} {...accessibleProps} {...props} viewBox="0 0 16 16">{title && <title id={titleId}>{title}</title>}<path d="M4.01756 9.40216C3.96845 9.72987 3.70455 10 3.37318 10H2.57318C2.24181 10 1.97003 9.73064 2.00272 9.40089C2.18023 7.6104 3.14483 6.05139 4.54567 5.07473C5.02468 4.73549 5.56726 4.46519 6.15478 4.28051C6.72834 4.09832 7.33928 4.00002 7.97318 4.00002C7.98266 3.99998 7.99215 4.00002 8.00164 4.00002C10.7006 4.00002 12.9519 5.71778 13.4688 8.00002H14.8831C15.4243 8.00002 15.6748 8.67204 15.2657 9.02631L12.7841 11.1755C12.5645 11.3657 12.2385 11.3657 12.0188 11.1755L9.53719 9.02631C9.12812 8.67204 9.37866 8.00002 9.91982 8.00002H11.3664C10.8977 6.91458 9.68595 6.00002 8.00164 6.00002C7.81503 6.00002 7.63422 6.01124 7.45958 6.03269C6.75401 6.12312 6.10595 6.39739 5.56496 6.80592C5.54654 6.8206 5.52833 6.83543 5.51032 6.85041C5.4936 6.86432 5.47625 6.87728 5.45838 6.88926C4.69892 7.50399 4.16907 8.39119 4.01756 9.40216Z" fill={'currentColor'} /></svg>;
 };
 Redo.displayName = 'Redo';
 Redo.isGlyph = true;

package/src/generated/Refresh.tsx

@@ -2,10 +2,11 @@
 * This is a generated file. Do not modify it manually.
 *
 * @script packages/icon/scripts/prebuild/index.ts
-* @checksum f1c3390781c6f99bf6f88aa6faa5a31d
+* @checksum 3224c594f852483d1da0b28852435dc3
 */
 import * as React from "react";
 import { css, cx } from '@leafygreen-ui/emotion';
+import { useIdAllocator } from '@leafygreen-ui/hooks';
 import { generateAccessibleProps, sizeMap } from '../glyphCommon';
 import { LGGlyph } from '../types';
 export interface RefreshProps extends LGGlyph.ComponentProps {}
@@ -19,6 +20,9 @@ const Refresh = ({
   role = 'img',
   ...props
 }: RefreshProps) => {
+  const titleId = useIdAllocator({
+    prefix: 'icon-title'
+  });
   const fillStyle = css`
         color: ${fill};
       `;
@@ -27,12 +31,13 @@ const Refresh = ({
       `;
   const accessibleProps = generateAccessibleProps(role, 'Refresh', {
     title,
+    titleId,
     ['aria-label']: ariaLabel,
     ['aria-labelledby']: ariaLabelledby
   });
   return <svg className={cx({
     [fillStyle]: fill != null
-  }, noFlexShrink, className)} height={typeof size === 'number' ? size : sizeMap[size]} width={typeof size === 'number' ? size : sizeMap[size]} role={role} {...accessibleProps} {...props} viewBox="0 0 16 16"><path d="M8.03289 2C10.7318 2 12.9831 3.71776 13.5 6L14.9144 6C15.4555 6 15.7061 6.67202 15.297 7.02629L12.8153 9.17546C12.5957 9.36566 12.2697 9.36566 12.0501 9.17545L9.56844 7.02629C9.15937 6.67202 9.40991 6 9.95107 6H11.3977C10.929 4.91456 9.7172 4 8.03289 4C7.00662 4 6.15578 4.33954 5.54157 4.85039C5.29859 5.05248 4.92429 5.0527 4.72549 4.80702L4.11499 4.05254C3.95543 3.85535 3.96725 3.56792 4.1591 3.40197C5.16255 2.53394 6.52815 2 8.03289 2Z" fill={'currentColor'} /><path d="M3.94991 6.84265C3.73028 6.65245 3.40429 6.65245 3.18466 6.84265L0.703017 8.99182C0.293944 9.34608 0.544489 10.0181 1.08564 10.0181H2.50411C3.02878 12.2913 5.27531 14 7.96711 14C9.47186 14 10.8375 13.4661 11.8409 12.598C12.0327 12.4321 12.0446 12.1447 11.885 11.9475L11.2745 11.193C11.0757 10.9473 10.7014 10.9475 10.4584 11.1496C9.84422 11.6605 8.99338 12 7.96711 12C6.29218 12 5.08453 11.0956 4.6102 10.0181H6.04893C6.59009 10.0181 6.84063 9.34608 6.43156 8.99182L3.94991 6.84265Z" fill={'currentColor'} /></svg>;
+  }, noFlexShrink, className)} height={typeof size === 'number' ? size : sizeMap[size]} width={typeof size === 'number' ? size : sizeMap[size]} role={role} {...accessibleProps} {...props} viewBox="0 0 16 16">{title && <title id={titleId}>{title}</title>}<path d="M8.03289 2C10.7318 2 12.9831 3.71776 13.5 6L14.9144 6C15.4555 6 15.7061 6.67202 15.297 7.02629L12.8153 9.17546C12.5957 9.36566 12.2697 9.36566 12.0501 9.17545L9.56844 7.02629C9.15937 6.67202 9.40991 6 9.95107 6H11.3977C10.929 4.91456 9.7172 4 8.03289 4C7.00662 4 6.15578 4.33954 5.54157 4.85039C5.29859 5.05248 4.92429 5.0527 4.72549 4.80702L4.11499 4.05254C3.95543 3.85535 3.96725 3.56792 4.1591 3.40197C5.16255 2.53394 6.52815 2 8.03289 2Z" fill={'currentColor'} /><path d="M3.94991 6.84265C3.73028 6.65245 3.40429 6.65245 3.18466 6.84265L0.703017 8.99182C0.293944 9.34608 0.544489 10.0181 1.08564 10.0181H2.50411C3.02878 12.2913 5.27531 14 7.96711 14C9.47186 14 10.8375 13.4661 11.8409 12.598C12.0327 12.4321 12.0446 12.1447 11.885 11.9475L11.2745 11.193C11.0757 10.9473 10.7014 10.9475 10.4584 11.1496C9.84422 11.6605 8.99338 12 7.96711 12C6.29218 12 5.08453 11.0956 4.6102 10.0181H6.04893C6.59009 10.0181 6.84063 9.34608 6.43156 8.99182L3.94991 6.84265Z" fill={'currentColor'} /></svg>;
 };
 Refresh.displayName = 'Refresh';
 Refresh.isGlyph = true;

package/src/generated/Relationship.tsx

@@ -2,10 +2,11 @@
 * This is a generated file. Do not modify it manually.
 *
 * @script packages/icon/scripts/prebuild/index.ts
-* @checksum f1b6e767453a9635bee72cf897775edb
+* @checksum 581e14df157dd41acbe56d87377f3a45
 */
 import * as React from "react";
 import { css, cx } from '@leafygreen-ui/emotion';
+import { useIdAllocator } from '@leafygreen-ui/hooks';
 import { generateAccessibleProps, sizeMap } from '../glyphCommon';
 import { LGGlyph } from '../types';
 export interface RelationshipProps extends LGGlyph.ComponentProps {}
@@ -19,6 +20,9 @@ const Relationship = ({
   role = 'img',
   ...props
 }: RelationshipProps) => {
+  const titleId = useIdAllocator({
+    prefix: 'icon-title'
+  });
   const fillStyle = css`
         color: ${fill};
       `;
@@ -27,12 +31,13 @@ const Relationship = ({
       `;
   const accessibleProps = generateAccessibleProps(role, 'Relationship', {
     title,
+    titleId,
     ['aria-label']: ariaLabel,
     ['aria-labelledby']: ariaLabelledby
   });
   return <svg className={cx({
     [fillStyle]: fill != null
-  }, noFlexShrink, className)} height={typeof size === 'number' ? size : sizeMap[size]} width={typeof size === 'number' ? size : sizeMap[size]} role={role} {...accessibleProps} {...props} viewBox="0 0 16 16"><path d="M0.5 2C0.5 1.44772 0.947715 1 1.5 1H3.5C4.05228 1 4.5 1.44772 4.5 2V3H5.99999C7.3807 3 8.49998 4.11929 8.49998 5.5V10.5C8.49998 11.3284 9.17156 12 9.99999 12H11.5V11C11.5 10.4477 11.9477 10 12.5 10H14.5C15.0523 10 15.5 10.4477 15.5 11V14C15.5 14.5523 15.0523 15 14.5 15H12.5C11.9477 15 11.5 14.5523 11.5 14V13H9.99999C8.61928 13 7.49998 11.8807 7.49998 10.5V5.5C7.49998 4.67157 6.82841 4 5.99999 4H4.5V5C4.5 5.55228 4.05228 6 3.5 6H1.5C0.947715 6 0.5 5.55228 0.5 5V2Z" fill={'currentColor'} /></svg>;
+  }, noFlexShrink, className)} height={typeof size === 'number' ? size : sizeMap[size]} width={typeof size === 'number' ? size : sizeMap[size]} role={role} {...accessibleProps} {...props} viewBox="0 0 16 16">{title && <title id={titleId}>{title}</title>}<path d="M0.5 2C0.5 1.44772 0.947715 1 1.5 1H3.5C4.05228 1 4.5 1.44772 4.5 2V3H5.99999C7.3807 3 8.49998 4.11929 8.49998 5.5V10.5C8.49998 11.3284 9.17156 12 9.99999 12H11.5V11C11.5 10.4477 11.9477 10 12.5 10H14.5C15.0523 10 15.5 10.4477 15.5 11V14C15.5 14.5523 15.0523 15 14.5 15H12.5C11.9477 15 11.5 14.5523 11.5 14V13H9.99999C8.61928 13 7.49998 11.8807 7.49998 10.5V5.5C7.49998 4.67157 6.82841 4 5.99999 4H4.5V5C4.5 5.55228 4.05228 6 3.5 6H1.5C0.947715 6 0.5 5.55228 0.5 5V2Z" fill={'currentColor'} /></svg>;
 };
 Relationship.displayName = 'Relationship';
 Relationship.isGlyph = true;

package/src/generated/ReplicaSet.tsx

@@ -2,10 +2,11 @@
 * This is a generated file. Do not modify it manually.
 *
 * @script packages/icon/scripts/prebuild/index.ts
-* @checksum 2bea089178e1fab0526b7fa4268d176b
+* @checksum be0fb6f7dabb7d6c40470727be5f32d9
 */
 import * as React from "react";
 import { css, cx } from '@leafygreen-ui/emotion';
+import { useIdAllocator } from '@leafygreen-ui/hooks';
 import { generateAccessibleProps, sizeMap } from '../glyphCommon';
 import { LGGlyph } from '../types';
 export interface ReplicaSetProps extends LGGlyph.ComponentProps {}
@@ -19,6 +20,9 @@ const ReplicaSet = ({
   role = 'img',
   ...props
 }: ReplicaSetProps) => {
+  const titleId = useIdAllocator({
+    prefix: 'icon-title'
+  });
   const fillStyle = css`
         color: ${fill};
       `;
@@ -27,12 +31,13 @@ const ReplicaSet = ({
       `;
   const accessibleProps = generateAccessibleProps(role, 'ReplicaSet', {
     title,
+    titleId,
     ['aria-label']: ariaLabel,
     ['aria-labelledby']: ariaLabelledby
   });
   return <svg className={cx({
     [fillStyle]: fill != null
-  }, noFlexShrink, className)} height={typeof size === 'number' ? size : sizeMap[size]} width={typeof size === 'number' ? size : sizeMap[size]} role={role} {...accessibleProps} {...props} viewBox="0 0 16 16"><path fillRule="evenodd" clipRule="evenodd" d="M9.39072 7.71281C8.96444 7.89758 8.49418 8 8 8C7.50582 8 7.03556 7.89758 6.60928 7.71281L5.26491 9.72938C5.719 10.182 6 10.8082 6 11.5C6 12.8807 4.88071 14 3.5 14C2.11929 14 1 12.8807 1 11.5C1 10.1193 2.11929 9 3.5 9C3.73768 9 3.96761 9.03317 4.18543 9.09513L5.56972 7.01868C4.91019 6.38216 4.5 5.48898 4.5 4.5C4.5 2.567 6.067 1 8 1C9.933 1 11.5 2.567 11.5 4.5C11.5 5.48898 11.0898 6.38216 10.4303 7.01868L11.8146 9.09513C12.0324 9.03317 12.2623 9 12.5 9C13.8807 9 15 10.1193 15 11.5C15 12.8807 13.8807 14 12.5 14C11.1193 14 10 12.8807 10 11.5C10 10.8082 10.281 10.182 10.7351 9.72938L9.39072 7.71281ZM9.75 4.5C9.75 5.4665 8.9665 6.25 8 6.25C7.0335 6.25 6.25 5.4665 6.25 4.5C6.25 3.5335 7.0335 2.75 8 2.75C8.9665 2.75 9.75 3.5335 9.75 4.5Z" fill={'currentColor'} /></svg>;
+  }, noFlexShrink, className)} height={typeof size === 'number' ? size : sizeMap[size]} width={typeof size === 'number' ? size : sizeMap[size]} role={role} {...accessibleProps} {...props} viewBox="0 0 16 16">{title && <title id={titleId}>{title}</title>}<path fillRule="evenodd" clipRule="evenodd" d="M9.39072 7.71281C8.96444 7.89758 8.49418 8 8 8C7.50582 8 7.03556 7.89758 6.60928 7.71281L5.26491 9.72938C5.719 10.182 6 10.8082 6 11.5C6 12.8807 4.88071 14 3.5 14C2.11929 14 1 12.8807 1 11.5C1 10.1193 2.11929 9 3.5 9C3.73768 9 3.96761 9.03317 4.18543 9.09513L5.56972 7.01868C4.91019 6.38216 4.5 5.48898 4.5 4.5C4.5 2.567 6.067 1 8 1C9.933 1 11.5 2.567 11.5 4.5C11.5 5.48898 11.0898 6.38216 10.4303 7.01868L11.8146 9.09513C12.0324 9.03317 12.2623 9 12.5 9C13.8807 9 15 10.1193 15 11.5C15 12.8807 13.8807 14 12.5 14C11.1193 14 10 12.8807 10 11.5C10 10.8082 10.281 10.182 10.7351 9.72938L9.39072 7.71281ZM9.75 4.5C9.75 5.4665 8.9665 6.25 8 6.25C7.0335 6.25 6.25 5.4665 6.25 4.5C6.25 3.5335 7.0335 2.75 8 2.75C8.9665 2.75 9.75 3.5335 9.75 4.5Z" fill={'currentColor'} /></svg>;
 };
 ReplicaSet.displayName = 'ReplicaSet';
 ReplicaSet.isGlyph = true;

package/src/generated/Resize.tsx

@@ -2,10 +2,11 @@
 * This is a generated file. Do not modify it manually.
 *
 * @script packages/icon/scripts/prebuild/index.ts
-* @checksum fee3256c80da5096170156f59e09e087
+* @checksum 2f9e78aed457fa72a1e5d13cae45df6e
 */
 import * as React from "react";
 import { css, cx } from '@leafygreen-ui/emotion';
+import { useIdAllocator } from '@leafygreen-ui/hooks';
 import { generateAccessibleProps, sizeMap } from '../glyphCommon';
 import { LGGlyph } from '../types';
 export interface ResizeProps extends LGGlyph.ComponentProps {}
@@ -19,6 +20,9 @@ const Resize = ({
   role = 'img',
   ...props
 }: ResizeProps) => {
+  const titleId = useIdAllocator({
+    prefix: 'icon-title'
+  });
   const fillStyle = css`
         color: ${fill};
       `;
@@ -27,12 +31,13 @@ const Resize = ({
       `;
   const accessibleProps = generateAccessibleProps(role, 'Resize', {
     title,
+    titleId,
     ['aria-label']: ariaLabel,
     ['aria-labelledby']: ariaLabelledby
   });
   return <svg className={cx({
     [fillStyle]: fill != null
-  }, noFlexShrink, className)} height={typeof size === 'number' ? size : sizeMap[size]} width={typeof size === 'number' ? size : sizeMap[size]} role={role} {...accessibleProps} {...props} viewBox="0 0 16 16"><path fillRule="evenodd" clipRule="evenodd" d="M14.7706 5.71967C15.0631 6.01256 15.0631 6.48744 14.7706 6.78033L6.77898 14.7803C6.4864 15.0732 6.01202 15.0732 5.71944 14.7803C5.42685 14.4874 5.42685 14.0126 5.71944 13.7197L13.711 5.71967C14.0036 5.42678 14.478 5.42678 14.7706 5.71967Z" fill={'currentColor'} /><path fillRule="evenodd" clipRule="evenodd" d="M14.7806 10.2197C15.0731 10.5126 15.0731 10.9874 14.7806 11.2803L11.2842 14.7803C10.9917 15.0732 10.5173 15.0732 10.2247 14.7803C9.93212 14.4874 9.93212 14.0126 10.2247 13.7197L13.721 10.2197C14.0136 9.92678 14.488 9.92678 14.7806 10.2197Z" fill={'currentColor'} /></svg>;
+  }, noFlexShrink, className)} height={typeof size === 'number' ? size : sizeMap[size]} width={typeof size === 'number' ? size : sizeMap[size]} role={role} {...accessibleProps} {...props} viewBox="0 0 16 16">{title && <title id={titleId}>{title}</title>}<path fillRule="evenodd" clipRule="evenodd" d="M14.7706 5.71967C15.0631 6.01256 15.0631 6.48744 14.7706 6.78033L6.77898 14.7803C6.4864 15.0732 6.01202 15.0732 5.71944 14.7803C5.42685 14.4874 5.42685 14.0126 5.71944 13.7197L13.711 5.71967C14.0036 5.42678 14.478 5.42678 14.7706 5.71967Z" fill={'currentColor'} /><path fillRule="evenodd" clipRule="evenodd" d="M14.7806 10.2197C15.0731 10.5126 15.0731 10.9874 14.7806 11.2803L11.2842 14.7803C10.9917 15.0732 10.5173 15.0732 10.2247 14.7803C9.93212 14.4874 9.93212 14.0126 10.2247 13.7197L13.721 10.2197C14.0136 9.92678 14.488 9.92678 14.7806 10.2197Z" fill={'currentColor'} /></svg>;
 };
 Resize.displayName = 'Resize';
 Resize.isGlyph = true;

package/src/generated/Resource.tsx

@@ -2,10 +2,11 @@
 * This is a generated file. Do not modify it manually.
 *
 * @script packages/icon/scripts/prebuild/index.ts
-* @checksum 9ec4992f3837f7bd0837fb90a4d9ed89
+* @checksum 9fe72420fd1bc7e6ca78c980da3e8cbb
 */
 import * as React from "react";
 import { css, cx } from '@leafygreen-ui/emotion';
+import { useIdAllocator } from '@leafygreen-ui/hooks';
 import { generateAccessibleProps, sizeMap } from '../glyphCommon';
 import { LGGlyph } from '../types';
 export interface ResourceProps extends LGGlyph.ComponentProps {}
@@ -19,6 +20,9 @@ const Resource = ({
   role = 'img',
   ...props
 }: ResourceProps) => {
+  const titleId = useIdAllocator({
+    prefix: 'icon-title'
+  });
   const fillStyle = css`
         color: ${fill};
       `;
@@ -27,12 +31,13 @@ const Resource = ({
       `;
   const accessibleProps = generateAccessibleProps(role, 'Resource', {
     title,
+    titleId,
     ['aria-label']: ariaLabel,
     ['aria-labelledby']: ariaLabelledby
   });
   return <svg className={cx({
     [fillStyle]: fill != null
-  }, noFlexShrink, className)} height={typeof size === 'number' ? size : sizeMap[size]} width={typeof size === 'number' ? size : sizeMap[size]} role={role} {...accessibleProps} {...props} viewBox="0 0 16 16"><path fillRule="evenodd" clipRule="evenodd" d="M6.09999 1.99998C5.71339 1.99998 5.39999 2.31338 5.39999 2.69998V13.3C5.39999 13.6866 5.71339 14 6.09999 14H8.19999C8.58659 14 8.89999 13.6866 8.89999 13.3V2.69998C8.89999 2.31338 8.58659 1.99998 8.19999 1.99998H6.09999ZM8.02499 2.99998H6.27499V3.99998H8.02499V2.99998ZM6.27499 4.99998H8.02499V5.49998H6.27499V4.99998ZM8.02499 12H6.27499V13H8.02499V12Z" fill={'currentColor'} /><path fillRule="evenodd" clipRule="evenodd" d="M9.84432 2.35808C9.46647 2.4399 9.22758 2.81229 9.31074 3.18984L11.5698 13.4468C11.653 13.8243 12.0267 14.0641 12.4046 13.9823L14.4557 13.5381C14.8335 13.4563 15.0724 13.0839 14.9893 12.7064L12.7302 2.44944C12.647 2.07189 12.2733 1.83215 11.8954 1.91396L9.84432 2.35808ZM11.9381 2.91964L10.2283 3.28984L10.4417 4.25852L12.1514 3.88832L11.9381 2.91964ZM10.6551 5.22735L12.3648 4.85715L12.4715 5.34149L10.7618 5.71169L10.6551 5.22735ZM13.8583 11.6377L12.1485 12.0079L12.3619 12.9766L14.0716 12.6064L13.8583 11.6377Z" fill={'currentColor'} /><path fillRule="evenodd" clipRule="evenodd" d="M2.09999 1.99998C1.71339 1.99998 1.39999 2.31338 1.39999 2.69998V13.3C1.39999 13.6866 1.71339 14 2.09999 14H4.19999C4.58659 14 4.89999 13.6866 4.89999 13.3V2.69998C4.89999 2.31338 4.58659 1.99998 4.19999 1.99998H2.09999ZM4.02499 2.99998H2.27499V3.99998H4.02499V2.99998ZM2.27499 4.99998H4.02499V5.49998H2.27499V4.99998ZM4.02499 12H2.27499V13H4.02499V12Z" fill={'currentColor'} /></svg>;
+  }, noFlexShrink, className)} height={typeof size === 'number' ? size : sizeMap[size]} width={typeof size === 'number' ? size : sizeMap[size]} role={role} {...accessibleProps} {...props} viewBox="0 0 16 16">{title && <title id={titleId}>{title}</title>}<path fillRule="evenodd" clipRule="evenodd" d="M6.09999 1.99998C5.71339 1.99998 5.39999 2.31338 5.39999 2.69998V13.3C5.39999 13.6866 5.71339 14 6.09999 14H8.19999C8.58659 14 8.89999 13.6866 8.89999 13.3V2.69998C8.89999 2.31338 8.58659 1.99998 8.19999 1.99998H6.09999ZM8.02499 2.99998H6.27499V3.99998H8.02499V2.99998ZM6.27499 4.99998H8.02499V5.49998H6.27499V4.99998ZM8.02499 12H6.27499V13H8.02499V12Z" fill={'currentColor'} /><path fillRule="evenodd" clipRule="evenodd" d="M9.84432 2.35808C9.46647 2.4399 9.22758 2.81229 9.31074 3.18984L11.5698 13.4468C11.653 13.8243 12.0267 14.0641 12.4046 13.9823L14.4557 13.5381C14.8335 13.4563 15.0724 13.0839 14.9893 12.7064L12.7302 2.44944C12.647 2.07189 12.2733 1.83215 11.8954 1.91396L9.84432 2.35808ZM11.9381 2.91964L10.2283 3.28984L10.4417 4.25852L12.1514 3.88832L11.9381 2.91964ZM10.6551 5.22735L12.3648 4.85715L12.4715 5.34149L10.7618 5.71169L10.6551 5.22735ZM13.8583 11.6377L12.1485 12.0079L12.3619 12.9766L14.0716 12.6064L13.8583 11.6377Z" fill={'currentColor'} /><path fillRule="evenodd" clipRule="evenodd" d="M2.09999 1.99998C1.71339 1.99998 1.39999 2.31338 1.39999 2.69998V13.3C1.39999 13.6866 1.71339 14 2.09999 14H4.19999C4.58659 14 4.89999 13.6866 4.89999 13.3V2.69998C4.89999 2.31338 4.58659 1.99998 4.19999 1.99998H2.09999ZM4.02499 2.99998H2.27499V3.99998H4.02499V2.99998ZM2.27499 4.99998H4.02499V5.49998H2.27499V4.99998ZM4.02499 12H2.27499V13H4.02499V12Z" fill={'currentColor'} /></svg>;
 };
 Resource.displayName = 'Resource';
 Resource.isGlyph = true;

package/src/generated/Return.tsx

@@ -2,10 +2,11 @@
 * This is a generated file. Do not modify it manually.
 *
 * @script packages/icon/scripts/prebuild/index.ts
-* @checksum f2504ef6bb18fa9ef178d7936f437bd6
+* @checksum cb455ae81426632a7fde296ac3ee93e4
 */
 import * as React from "react";
 import { css, cx } from '@leafygreen-ui/emotion';
+import { useIdAllocator } from '@leafygreen-ui/hooks';
 import { generateAccessibleProps, sizeMap } from '../glyphCommon';
 import { LGGlyph } from '../types';
 export interface ReturnProps extends LGGlyph.ComponentProps {}
@@ -19,6 +20,9 @@ const Return = ({
   role = 'img',
   ...props
 }: ReturnProps) => {
+  const titleId = useIdAllocator({
+    prefix: 'icon-title'
+  });
   const fillStyle = css`
         color: ${fill};
       `;
@@ -27,12 +31,13 @@ const Return = ({
       `;
   const accessibleProps = generateAccessibleProps(role, 'Return', {
     title,
+    titleId,
     ['aria-label']: ariaLabel,
     ['aria-labelledby']: ariaLabelledby
   });
   return <svg className={cx({
     [fillStyle]: fill != null
-  }, noFlexShrink, className)} height={typeof size === 'number' ? size : sizeMap[size]} width={typeof size === 'number' ? size : sizeMap[size]} role={role} {...accessibleProps} {...props} viewBox="0 0 16 16"><g id="Return"><path id="Union" d="M5 2C4.44772 2 4 2.44772 4 3C4 3.55228 4.44772 4 5 4H10C11.3807 4 12.5 5.11929 12.5 6.5C12.5 7.88071 11.3807 9 10 9H5.20328L6.65079 7.75927C7.07012 7.39985 7.11868 6.76855 6.75926 6.34923C6.39983 5.9299 5.76853 5.88134 5.34921 6.24076L1.84921 9.24076C1.62756 9.43074 1.5 9.70809 1.5 10C1.5 10.2919 1.62756 10.5693 1.84921 10.7593L5.34921 13.7593C5.76853 14.1187 6.39983 14.0701 6.75926 13.6508C7.11868 13.2315 7.07012 12.6002 6.65079 12.2408L5.20324 11H10C12.4853 11 14.5 8.98528 14.5 6.5C14.5 4.01472 12.4853 2 10 2H5Z" fill={'currentColor'} /></g></svg>;
+  }, noFlexShrink, className)} height={typeof size === 'number' ? size : sizeMap[size]} width={typeof size === 'number' ? size : sizeMap[size]} role={role} {...accessibleProps} {...props} viewBox="0 0 16 16">{title && <title id={titleId}>{title}</title>}<g id="Return"><path id="Union" d="M5 2C4.44772 2 4 2.44772 4 3C4 3.55228 4.44772 4 5 4H10C11.3807 4 12.5 5.11929 12.5 6.5C12.5 7.88071 11.3807 9 10 9H5.20328L6.65079 7.75927C7.07012 7.39985 7.11868 6.76855 6.75926 6.34923C6.39983 5.9299 5.76853 5.88134 5.34921 6.24076L1.84921 9.24076C1.62756 9.43074 1.5 9.70809 1.5 10C1.5 10.2919 1.62756 10.5693 1.84921 10.7593L5.34921 13.7593C5.76853 14.1187 6.39983 14.0701 6.75926 13.6508C7.11868 13.2315 7.07012 12.6002 6.65079 12.2408L5.20324 11H10C12.4853 11 14.5 8.98528 14.5 6.5C14.5 4.01472 12.4853 2 10 2H5Z" fill={'currentColor'} /></g></svg>;
 };
 Return.displayName = 'Return';
 Return.isGlyph = true;

package/src/generated/Revert.tsx

@@ -2,10 +2,11 @@
 * This is a generated file. Do not modify it manually.
 *
 * @script packages/icon/scripts/prebuild/index.ts
-* @checksum ceebe674c72b8db63286c07567793217
+* @checksum c482456b583c7bc64b059e7d0bd7dfb7
 */
 import * as React from "react";
 import { css, cx } from '@leafygreen-ui/emotion';
+import { useIdAllocator } from '@leafygreen-ui/hooks';
 import { generateAccessibleProps, sizeMap } from '../glyphCommon';
 import { LGGlyph } from '../types';
 export interface RevertProps extends LGGlyph.ComponentProps {}
@@ -19,6 +20,9 @@ const Revert = ({
   role = 'img',
   ...props
 }: RevertProps) => {
+  const titleId = useIdAllocator({
+    prefix: 'icon-title'
+  });
   const fillStyle = css`
         color: ${fill};
       `;
@@ -27,12 +31,13 @@ const Revert = ({
       `;
   const accessibleProps = generateAccessibleProps(role, 'Revert', {
     title,
+    titleId,
     ['aria-label']: ariaLabel,
     ['aria-labelledby']: ariaLabelledby
   });
   return <svg className={cx({
     [fillStyle]: fill != null
-  }, noFlexShrink, className)} height={typeof size === 'number' ? size : sizeMap[size]} width={typeof size === 'number' ? size : sizeMap[size]} role={role} {...accessibleProps} {...props} viewBox="0 0 16 16"><path d="M13 8C13 10.7614 10.7614 13 8 13C7.16895 13 6.38526 12.7973 5.69568 12.4385C5.34783 12.2576 4.90944 12.3087 4.65841 12.6099L4.32712 13.0075C4.05174 13.3379 4.1087 13.8355 4.48034 14.0521C5.51438 14.6548 6.71687 15 8 15C11.866 15 15 11.866 15 8C15 4.13401 11.866 1 8 1C6.05606 1 4.2972 1.7924 3.02879 3.07181L1.96954 2.14618C1.56206 1.7901 0.931193 2.13127 1.00611 2.66721L1.4606 5.9185C1.50083 6.20624 1.7463 6.4287 2.03684 6.43H5.31972C5.86086 6.43241 6.1144 5.76821 5.70691 5.41212L4.53896 4.3915C5.4373 3.52965 6.65679 3 8 3C10.7614 3 13 5.23858 13 8Z" fill={'currentColor'} /></svg>;
+  }, noFlexShrink, className)} height={typeof size === 'number' ? size : sizeMap[size]} width={typeof size === 'number' ? size : sizeMap[size]} role={role} {...accessibleProps} {...props} viewBox="0 0 16 16">{title && <title id={titleId}>{title}</title>}<path d="M13 8C13 10.7614 10.7614 13 8 13C7.16895 13 6.38526 12.7973 5.69568 12.4385C5.34783 12.2576 4.90944 12.3087 4.65841 12.6099L4.32712 13.0075C4.05174 13.3379 4.1087 13.8355 4.48034 14.0521C5.51438 14.6548 6.71687 15 8 15C11.866 15 15 11.866 15 8C15 4.13401 11.866 1 8 1C6.05606 1 4.2972 1.7924 3.02879 3.07181L1.96954 2.14618C1.56206 1.7901 0.931193 2.13127 1.00611 2.66721L1.4606 5.9185C1.50083 6.20624 1.7463 6.4287 2.03684 6.43H5.31972C5.86086 6.43241 6.1144 5.76821 5.70691 5.41212L4.53896 4.3915C5.4373 3.52965 6.65679 3 8 3C10.7614 3 13 5.23858 13 8Z" fill={'currentColor'} /></svg>;
 };
 Revert.displayName = 'Revert';
 Revert.isGlyph = true;

package/src/generated/Router.tsx

@@ -2,10 +2,11 @@
 * This is a generated file. Do not modify it manually.
 *
 * @script packages/icon/scripts/prebuild/index.ts
-* @checksum 26b268485a87705e369fef3cee115d85
+* @checksum 87bf274c98c4286ce21666e17bf6d0cf
 */
 import * as React from "react";
 import { css, cx } from '@leafygreen-ui/emotion';
+import { useIdAllocator } from '@leafygreen-ui/hooks';
 import { generateAccessibleProps, sizeMap } from '../glyphCommon';
 import { LGGlyph } from '../types';
 export interface RouterProps extends LGGlyph.ComponentProps {}
@@ -19,6 +20,9 @@ const Router = ({
   role = 'img',
   ...props
 }: RouterProps) => {
+  const titleId = useIdAllocator({
+    prefix: 'icon-title'
+  });
   const fillStyle = css`
         color: ${fill};
       `;
@@ -27,12 +31,13 @@ const Router = ({
       `;
   const accessibleProps = generateAccessibleProps(role, 'Router', {
     title,
+    titleId,
     ['aria-label']: ariaLabel,
     ['aria-labelledby']: ariaLabelledby
   });
   return <svg className={cx({
     [fillStyle]: fill != null
-  }, noFlexShrink, className)} height={typeof size === 'number' ? size : sizeMap[size]} width={typeof size === 'number' ? size : sizeMap[size]} role={role} {...accessibleProps} {...props} viewBox="0 0 16 16"><path d="M13.89 4.89001C13.61 4.77001 13.29 4.89001 13.16 5.17001L12.6 6.41001C12.56 6.31001 12.53 6.21001 12.49 6.12001C12.33 5.70001 12.17 5.27001 12.04 4.93001C11.91 4.59001 11.82 4.35001 11.78 4.25001C11.54 3.70001 11.2 3.38001 11.12 3.31001C11.12 3.31001 11.11 3.30001 11.1 3.30001C11.01 3.21001 10.41 2.66001 9.34003 2.53001C9.22003 2.52001 9.11003 2.51001 8.99003 2.51001C7.95003 2.51001 7.27003 3.03001 7.14003 3.12001C7.14003 3.12001 7.12003 3.13001 7.12003 3.14001C7.05003 3.19001 6.81003 3.38001 6.55003 3.71001C6.26003 4.08001 5.94003 4.64001 5.88003 5.37001V5.60001C5.88003 6.72001 6.47003 7.42001 6.61003 7.58001C6.61003 7.58001 7.80003 9.08001 8.48003 9.91001C8.70003 10.18 8.77003 10.51 8.77003 10.81C8.77003 10.97 8.75003 11.11 8.73003 11.21L8.70003 11.32V11.34V11.36V11.37C8.70003 11.39 8.62003 11.62 8.43003 11.85C8.23003 12.07 7.94003 12.3 7.37003 12.38C7.28003 12.39 7.19003 12.4 7.11003 12.4C6.64003 12.4 6.36003 12.23 6.17003 12.05C6.08003 11.96 6.01003 11.87 5.97003 11.81L5.93003 11.74V11.72L5.34003 10.61C5.76003 10.22 6.02003 9.67001 6.02003 9.06001C6.02003 7.89001 5.07003 6.94001 3.90003 6.94001C2.73003 6.94001 1.78003 7.89001 1.78003 9.06001C1.78003 10.23 2.73003 11.18 3.90003 11.18C4.06003 11.18 4.22003 11.16 4.37003 11.12L4.95003 12.21C4.99003 12.29 5.13003 12.56 5.44003 12.85C5.78003 13.17 6.35003 13.49 7.13003 13.49C7.26003 13.49 7.39003 13.49 7.52003 13.46C8.41003 13.35 9.01003 12.9 9.34003 12.47C9.64003 12.09 9.74003 11.76 9.77003 11.66C9.77003 11.66 9.89003 11.28 9.89003 10.79C9.89003 10.33 9.79003 9.73001 9.36003 9.19001C8.69003 8.37001 7.50003 6.87001 7.50003 6.87001V6.85001L7.47003 6.84001C7.44003 6.81001 6.99003 6.28001 7.00003 5.58001V5.44001C7.04003 5.00001 7.24003 4.63001 7.45003 4.37001C7.55003 4.24001 7.65003 4.14001 7.72003 4.08001L7.80003 4.01001H7.82003L7.83003 3.99001H7.84003C7.84003 3.99001 8.38003 3.59001 9.03003 3.59001H9.25003C9.63003 3.65001 9.92003 3.78001 10.12 3.89001C10.22 3.95001 10.29 4.00001 10.34 4.04001L10.39 4.08001V4.09001C10.39 4.09001 10.65 4.35001 10.79 4.68001C10.8 4.71001 10.91 4.97001 11.03 5.31001C11.19 5.72001 11.39 6.27001 11.58 6.77001L10.26 6.17001C9.98003 6.04001 9.66003 6.17001 9.53003 6.44001C9.40003 6.72001 9.53003 7.04001 9.80003 7.17001L12.35 8.33001C12.48 8.39001 12.63 8.40001 12.77 8.34001C12.91 8.29001 13.02 8.18001 13.08 8.05001L14.18 5.60001C14.3 5.32001 14.18 5.00001 13.9 4.87001L13.89 4.89001ZM2.85003 9.07001C2.85003 8.51001 3.31003 8.05001 3.87003 8.05001C4.43003 8.05001 4.89003 8.51001 4.89003 9.07001C4.89003 9.64001 4.43003 10.09 3.87003 10.09C3.30003 10.09 2.85003 9.63001 2.85003 9.07001Z" fill={'currentColor'} /></svg>;
+  }, noFlexShrink, className)} height={typeof size === 'number' ? size : sizeMap[size]} width={typeof size === 'number' ? size : sizeMap[size]} role={role} {...accessibleProps} {...props} viewBox="0 0 16 16">{title && <title id={titleId}>{title}</title>}<path d="M13.89 4.89001C13.61 4.77001 13.29 4.89001 13.16 5.17001L12.6 6.41001C12.56 6.31001 12.53 6.21001 12.49 6.12001C12.33 5.70001 12.17 5.27001 12.04 4.93001C11.91 4.59001 11.82 4.35001 11.78 4.25001C11.54 3.70001 11.2 3.38001 11.12 3.31001C11.12 3.31001 11.11 3.30001 11.1 3.30001C11.01 3.21001 10.41 2.66001 9.34003 2.53001C9.22003 2.52001 9.11003 2.51001 8.99003 2.51001C7.95003 2.51001 7.27003 3.03001 7.14003 3.12001C7.14003 3.12001 7.12003 3.13001 7.12003 3.14001C7.05003 3.19001 6.81003 3.38001 6.55003 3.71001C6.26003 4.08001 5.94003 4.64001 5.88003 5.37001V5.60001C5.88003 6.72001 6.47003 7.42001 6.61003 7.58001C6.61003 7.58001 7.80003 9.08001 8.48003 9.91001C8.70003 10.18 8.77003 10.51 8.77003 10.81C8.77003 10.97 8.75003 11.11 8.73003 11.21L8.70003 11.32V11.34V11.36V11.37C8.70003 11.39 8.62003 11.62 8.43003 11.85C8.23003 12.07 7.94003 12.3 7.37003 12.38C7.28003 12.39 7.19003 12.4 7.11003 12.4C6.64003 12.4 6.36003 12.23 6.17003 12.05C6.08003 11.96 6.01003 11.87 5.97003 11.81L5.93003 11.74V11.72L5.34003 10.61C5.76003 10.22 6.02003 9.67001 6.02003 9.06001C6.02003 7.89001 5.07003 6.94001 3.90003 6.94001C2.73003 6.94001 1.78003 7.89001 1.78003 9.06001C1.78003 10.23 2.73003 11.18 3.90003 11.18C4.06003 11.18 4.22003 11.16 4.37003 11.12L4.95003 12.21C4.99003 12.29 5.13003 12.56 5.44003 12.85C5.78003 13.17 6.35003 13.49 7.13003 13.49C7.26003 13.49 7.39003 13.49 7.52003 13.46C8.41003 13.35 9.01003 12.9 9.34003 12.47C9.64003 12.09 9.74003 11.76 9.77003 11.66C9.77003 11.66 9.89003 11.28 9.89003 10.79C9.89003 10.33 9.79003 9.73001 9.36003 9.19001C8.69003 8.37001 7.50003 6.87001 7.50003 6.87001V6.85001L7.47003 6.84001C7.44003 6.81001 6.99003 6.28001 7.00003 5.58001V5.44001C7.04003 5.00001 7.24003 4.63001 7.45003 4.37001C7.55003 4.24001 7.65003 4.14001 7.72003 4.08001L7.80003 4.01001H7.82003L7.83003 3.99001H7.84003C7.84003 3.99001 8.38003 3.59001 9.03003 3.59001H9.25003C9.63003 3.65001 9.92003 3.78001 10.12 3.89001C10.22 3.95001 10.29 4.00001 10.34 4.04001L10.39 4.08001V4.09001C10.39 4.09001 10.65 4.35001 10.79 4.68001C10.8 4.71001 10.91 4.97001 11.03 5.31001C11.19 5.72001 11.39 6.27001 11.58 6.77001L10.26 6.17001C9.98003 6.04001 9.66003 6.17001 9.53003 6.44001C9.40003 6.72001 9.53003 7.04001 9.80003 7.17001L12.35 8.33001C12.48 8.39001 12.63 8.40001 12.77 8.34001C12.91 8.29001 13.02 8.18001 13.08 8.05001L14.18 5.60001C14.3 5.32001 14.18 5.00001 13.9 4.87001L13.89 4.89001ZM2.85003 9.07001C2.85003 8.51001 3.31003 8.05001 3.87003 8.05001C4.43003 8.05001 4.89003 8.51001 4.89003 9.07001C4.89003 9.64001 4.43003 10.09 3.87003 10.09C3.30003 10.09 2.85003 9.63001 2.85003 9.07001Z" fill={'currentColor'} /></svg>;
 };
 Router.displayName = 'Router';
 Router.isGlyph = true;

package/src/generated/SMS.tsx

@@ -2,10 +2,11 @@
 * This is a generated file. Do not modify it manually.
 *
 * @script packages/icon/scripts/prebuild/index.ts
-* @checksum ce13ff18d80b041de18dc658f749a828
+* @checksum 02c507e0e0b5e19eb993a161b570c272
 */
 import * as React from "react";
 import { css, cx } from '@leafygreen-ui/emotion';
+import { useIdAllocator } from '@leafygreen-ui/hooks';
 import { generateAccessibleProps, sizeMap } from '../glyphCommon';
 import { LGGlyph } from '../types';
 export interface SMSProps extends LGGlyph.ComponentProps {}
@@ -19,6 +20,9 @@ const SMS = ({
   role = 'img',
   ...props
 }: SMSProps) => {
+  const titleId = useIdAllocator({
+    prefix: 'icon-title'
+  });
   const fillStyle = css`
         color: ${fill};
       `;
@@ -27,12 +31,13 @@ const SMS = ({
       `;
   const accessibleProps = generateAccessibleProps(role, 'SMS', {
     title,
+    titleId,
     ['aria-label']: ariaLabel,
     ['aria-labelledby']: ariaLabelledby
   });
   return <svg className={cx({
     [fillStyle]: fill != null
-  }, noFlexShrink, className)} height={typeof size === 'number' ? size : sizeMap[size]} width={typeof size === 'number' ? size : sizeMap[size]} role={role} {...accessibleProps} {...props} viewBox="0 0 16 16"><path fillRule="evenodd" clipRule="evenodd" d="M1 4C1 2.89543 1.89543 2 3 2H13C14.1046 2 15 2.89543 15 4V10C15 11.1046 14.1046 12 13 12H7.75495L4.23014 14.8311C3.74164 15.2234 3 14.8886 3 14.2758L3 12C1.89543 12 1 11.1046 1 10V4ZM3.00001 4.75C3.00001 4.33579 3.3358 4 3.75001 4H11.25C11.6642 4 12 4.33579 12 4.75C12 5.16421 11.6642 5.5 11.25 5.5H3.75001C3.3358 5.5 3.00001 5.16421 3.00001 4.75ZM3.00001 7.75C3.00001 7.33579 3.3358 7 3.75001 7H9.25001C9.66423 7 10 7.33579 10 7.75C10 8.16421 9.66423 8.5 9.25001 8.5H3.75001C3.3358 8.5 3.00001 8.16421 3.00001 7.75Z" fill={'currentColor'} /></svg>;
+  }, noFlexShrink, className)} height={typeof size === 'number' ? size : sizeMap[size]} width={typeof size === 'number' ? size : sizeMap[size]} role={role} {...accessibleProps} {...props} viewBox="0 0 16 16">{title && <title id={titleId}>{title}</title>}<path fillRule="evenodd" clipRule="evenodd" d="M1 4C1 2.89543 1.89543 2 3 2H13C14.1046 2 15 2.89543 15 4V10C15 11.1046 14.1046 12 13 12H7.75495L4.23014 14.8311C3.74164 15.2234 3 14.8886 3 14.2758L3 12C1.89543 12 1 11.1046 1 10V4ZM3.00001 4.75C3.00001 4.33579 3.3358 4 3.75001 4H11.25C11.6642 4 12 4.33579 12 4.75C12 5.16421 11.6642 5.5 11.25 5.5H3.75001C3.3358 5.5 3.00001 5.16421 3.00001 4.75ZM3.00001 7.75C3.00001 7.33579 3.3358 7 3.75001 7H9.25001C9.66423 7 10 7.33579 10 7.75C10 8.16421 9.66423 8.5 9.25001 8.5H3.75001C3.3358 8.5 3.00001 8.16421 3.00001 7.75Z" fill={'currentColor'} /></svg>;
 };
 SMS.displayName = 'SMS';
 SMS.isGlyph = true;

package/src/generated/Save.tsx

@@ -2,10 +2,11 @@
 * This is a generated file. Do not modify it manually.
 *
 * @script packages/icon/scripts/prebuild/index.ts
-* @checksum 904983e53706275facd1f094d926a4cf
+* @checksum fc3c31e83aa13d4942bf63257c1b1e74
 */
 import * as React from "react";
 import { css, cx } from '@leafygreen-ui/emotion';
+import { useIdAllocator } from '@leafygreen-ui/hooks';
 import { generateAccessibleProps, sizeMap } from '../glyphCommon';
 import { LGGlyph } from '../types';
 export interface SaveProps extends LGGlyph.ComponentProps {}
@@ -19,6 +20,9 @@ const Save = ({
   role = 'img',
   ...props
 }: SaveProps) => {
+  const titleId = useIdAllocator({
+    prefix: 'icon-title'
+  });
   const fillStyle = css`
         color: ${fill};
       `;
@@ -27,12 +31,13 @@ const Save = ({
       `;
   const accessibleProps = generateAccessibleProps(role, 'Save', {
     title,
+    titleId,
     ['aria-label']: ariaLabel,
     ['aria-labelledby']: ariaLabelledby
   });
   return <svg className={cx({
     [fillStyle]: fill != null
-  }, noFlexShrink, className)} height={typeof size === 'number' ? size : sizeMap[size]} width={typeof size === 'number' ? size : sizeMap[size]} role={role} {...accessibleProps} {...props} viewBox="0 0 16 16"><path fillRule="evenodd" clipRule="evenodd" d="M2 3.6C2 3.03995 2 2.75992 2.10899 2.54601C2.20487 2.35785 2.35785 2.20487 2.54601 2.10899C2.75992 2 3.03995 2 3.6 2H11.3373C11.5818 2 11.7041 2 11.8192 2.02763C11.9213 2.05213 12.0188 2.09253 12.1083 2.14736C12.2092 2.2092 12.2957 2.29568 12.4686 2.46862L13.5314 3.53137C13.7043 3.70432 13.7908 3.7908 13.8526 3.89172C13.9075 3.98119 13.9479 4.07873 13.9724 4.18077C14 4.29586 14 4.41815 14 4.66274V12.4C14 12.9601 14 13.2401 13.891 13.454C13.7951 13.6422 13.6422 13.7951 13.454 13.891C13.2532 13.9933 12.9942 13.9996 12.5 14L12.5 9.28404C12.5 9.15788 12.5 9.03494 12.4915 8.93089C12.4822 8.81659 12.4602 8.68172 12.391 8.54601C12.2951 8.35785 12.1422 8.20487 11.954 8.109C11.8183 8.03985 11.6834 8.01781 11.5691 8.00848C11.465 7.99997 11.3421 7.99999 11.216 8H4.78405C4.65786 7.99999 4.53497 7.99997 4.43089 8.00848C4.31659 8.01781 4.18172 8.03985 4.04601 8.109C3.85785 8.20487 3.70487 8.35785 3.609 8.54601C3.53985 8.68172 3.51781 8.81659 3.50848 8.93089C3.49997 9.03497 3.49999 9.15786 3.5 9.28405L3.5 14C3.00583 13.9996 2.74679 13.9933 2.54601 13.891C2.35785 13.7951 2.20487 13.6422 2.10899 13.454C2 13.2401 2 12.9601 2 12.4V3.6ZM4 3.5C3.72386 3.5 3.5 3.72386 3.5 4V6C3.5 6.27614 3.72386 6.5 4 6.5H9C9.27614 6.5 9.5 6.27614 9.5 6V4C9.5 3.72386 9.27614 3.5 9 3.5H4Z" fill={'currentColor'} /><path d="M11.5 9.3V14H4.5V9.3C4.5 9.15174 4.50039 9.07061 4.50515 9.01232L4.50573 9.00573L4.51232 9.00515C4.57061 9.00039 4.65174 9 4.8 9H11.2C11.3483 9 11.4294 9.00039 11.4877 9.00515L11.4943 9.00573L11.4949 9.01232C11.4996 9.07061 11.5 9.15174 11.5 9.3Z" fill={'currentColor'} /></svg>;
+  }, noFlexShrink, className)} height={typeof size === 'number' ? size : sizeMap[size]} width={typeof size === 'number' ? size : sizeMap[size]} role={role} {...accessibleProps} {...props} viewBox="0 0 16 16">{title && <title id={titleId}>{title}</title>}<path fillRule="evenodd" clipRule="evenodd" d="M2 3.6C2 3.03995 2 2.75992 2.10899 2.54601C2.20487 2.35785 2.35785 2.20487 2.54601 2.10899C2.75992 2 3.03995 2 3.6 2H11.3373C11.5818 2 11.7041 2 11.8192 2.02763C11.9213 2.05213 12.0188 2.09253 12.1083 2.14736C12.2092 2.2092 12.2957 2.29568 12.4686 2.46862L13.5314 3.53137C13.7043 3.70432 13.7908 3.7908 13.8526 3.89172C13.9075 3.98119 13.9479 4.07873 13.9724 4.18077C14 4.29586 14 4.41815 14 4.66274V12.4C14 12.9601 14 13.2401 13.891 13.454C13.7951 13.6422 13.6422 13.7951 13.454 13.891C13.2532 13.9933 12.9942 13.9996 12.5 14L12.5 9.28404C12.5 9.15788 12.5 9.03494 12.4915 8.93089C12.4822 8.81659 12.4602 8.68172 12.391 8.54601C12.2951 8.35785 12.1422 8.20487 11.954 8.109C11.8183 8.03985 11.6834 8.01781 11.5691 8.00848C11.465 7.99997 11.3421 7.99999 11.216 8H4.78405C4.65786 7.99999 4.53497 7.99997 4.43089 8.00848C4.31659 8.01781 4.18172 8.03985 4.04601 8.109C3.85785 8.20487 3.70487 8.35785 3.609 8.54601C3.53985 8.68172 3.51781 8.81659 3.50848 8.93089C3.49997 9.03497 3.49999 9.15786 3.5 9.28405L3.5 14C3.00583 13.9996 2.74679 13.9933 2.54601 13.891C2.35785 13.7951 2.20487 13.6422 2.10899 13.454C2 13.2401 2 12.9601 2 12.4V3.6ZM4 3.5C3.72386 3.5 3.5 3.72386 3.5 4V6C3.5 6.27614 3.72386 6.5 4 6.5H9C9.27614 6.5 9.5 6.27614 9.5 6V4C9.5 3.72386 9.27614 3.5 9 3.5H4Z" fill={'currentColor'} /><path d="M11.5 9.3V14H4.5V9.3C4.5 9.15174 4.50039 9.07061 4.50515 9.01232L4.50573 9.00573L4.51232 9.00515C4.57061 9.00039 4.65174 9 4.8 9H11.2C11.3483 9 11.4294 9.00039 11.4877 9.00515L11.4943 9.00573L11.4949 9.01232C11.4996 9.07061 11.5 9.15174 11.5 9.3Z" fill={'currentColor'} /></svg>;
 };
 Save.displayName = 'Save';
 Save.isGlyph = true;

package/src/generated/SearchIndex.tsx

@@ -2,10 +2,11 @@
 * This is a generated file. Do not modify it manually.
 *
 * @script packages/icon/scripts/prebuild/index.ts
-* @checksum 84fafe19c477c2660e835a752627ee27
+* @checksum ba804a294af513ead63d9ee1fa8387ec
 */
 import * as React from "react";
 import { css, cx } from '@leafygreen-ui/emotion';
+import { useIdAllocator } from '@leafygreen-ui/hooks';
 import { generateAccessibleProps, sizeMap } from '../glyphCommon';
 import { LGGlyph } from '../types';
 export interface SearchIndexProps extends LGGlyph.ComponentProps {}
@@ -19,6 +20,9 @@ const SearchIndex = ({
   role = 'img',
   ...props
 }: SearchIndexProps) => {
+  const titleId = useIdAllocator({
+    prefix: 'icon-title'
+  });
   const fillStyle = css`
         color: ${fill};
       `;
@@ -27,12 +31,13 @@ const SearchIndex = ({
       `;
   const accessibleProps = generateAccessibleProps(role, 'SearchIndex', {
     title,
+    titleId,
     ['aria-label']: ariaLabel,
     ['aria-labelledby']: ariaLabelledby
   });
   return <svg className={cx({
     [fillStyle]: fill != null
-  }, noFlexShrink, className)} height={typeof size === 'number' ? size : sizeMap[size]} width={typeof size === 'number' ? size : sizeMap[size]} role={role} {...accessibleProps} {...props} viewBox="0 0 16 16"><path fillRule="evenodd" clipRule="evenodd" d="M8.81572 12.7544C9.73678 13.6754 11.1421 13.8164 12.2116 13.1777L13.8338 14.7999C14.1006 15.0667 14.5331 15.0667 14.7999 14.7999C15.0667 14.5331 15.0667 14.1006 14.7999 13.8338L13.1777 12.2116C13.8164 11.1421 13.6754 9.73678 12.7544 8.81572C11.6667 7.72809 9.90335 7.72809 8.81572 8.81572C7.72809 9.90335 7.72809 11.6667 8.81572 12.7544ZM11.7883 9.78181C12.3424 10.3359 12.3424 11.2342 11.7883 11.7883C11.2342 12.3424 10.3359 12.3424 9.78181 11.7883C9.22773 11.2342 9.22773 10.3359 9.78181 9.78181C10.3359 9.22773 11.2342 9.22773 11.7883 9.78181Z" fill={'currentColor'} /><path d="M12 3.66667C12 3.75035 11.9994 3.83206 11.9983 3.91184C11.9994 3.94108 12 3.97047 12 4V4.21428C12 4.49502 11.8763 4.76461 11.6065 5.02898C11.3319 5.2981 10.9246 5.54074 10.4197 5.74366C9.41078 6.14907 8.10976 6.35714 7 6.35714C5.89024 6.35714 4.58922 6.14907 3.58034 5.74366C3.07537 5.54074 2.66813 5.2981 2.39348 5.02898C2.12368 4.76461 2 4.49502 2 4.21428V4C2 3.96691 2.00073 3.934 2.00217 3.90128C2.00073 3.82496 2 3.74677 2 3.66667C2 1.85714 4.53444 1 7 1C9.46556 1 12 1.85714 12 3.66667Z" fill={'currentColor'} /><path d="M2 5.81314V7.64286C2 7.92359 2.12368 8.19318 2.39348 8.45755C2.66813 8.72667 3.07537 8.96932 3.58034 9.17224C4.58922 9.57765 5.89024 9.78571 7 9.78571C7.04434 9.78571 7.08899 9.78538 7.13391 9.78472C7.3015 9.17079 7.6264 8.59083 8.10862 8.10862C9.16114 7.05609 10.6793 6.75302 12 7.1994V5.81314C11.6435 6.11014 11.1998 6.35041 10.7229 6.54204C9.59874 6.99378 8.19143 7.21428 7 7.21428C5.80857 7.21428 4.40126 6.99378 3.2771 6.54204C2.8002 6.35041 2.35654 6.11014 2 5.81314Z" fill={'currentColor'} /><path d="M7 10.6429H7.00266C6.97218 11.4587 7.20413 12.2826 7.69852 12.977C7.46653 12.9923 7.23296 13 7 13C4.53444 13 2 12.1429 2 10.3333C2 10.2503 2.00057 10.1683 2.00171 10.0875C2.00057 10.0585 2 10.0293 2 10V9.24171C2.35654 9.53872 2.8002 9.77898 3.2771 9.97062C4.40126 10.4223 5.80857 10.6429 7 10.6429Z" fill={'currentColor'} /></svg>;
+  }, noFlexShrink, className)} height={typeof size === 'number' ? size : sizeMap[size]} width={typeof size === 'number' ? size : sizeMap[size]} role={role} {...accessibleProps} {...props} viewBox="0 0 16 16">{title && <title id={titleId}>{title}</title>}<path fillRule="evenodd" clipRule="evenodd" d="M8.81572 12.7544C9.73678 13.6754 11.1421 13.8164 12.2116 13.1777L13.8338 14.7999C14.1006 15.0667 14.5331 15.0667 14.7999 14.7999C15.0667 14.5331 15.0667 14.1006 14.7999 13.8338L13.1777 12.2116C13.8164 11.1421 13.6754 9.73678 12.7544 8.81572C11.6667 7.72809 9.90335 7.72809 8.81572 8.81572C7.72809 9.90335 7.72809 11.6667 8.81572 12.7544ZM11.7883 9.78181C12.3424 10.3359 12.3424 11.2342 11.7883 11.7883C11.2342 12.3424 10.3359 12.3424 9.78181 11.7883C9.22773 11.2342 9.22773 10.3359 9.78181 9.78181C10.3359 9.22773 11.2342 9.22773 11.7883 9.78181Z" fill={'currentColor'} /><path d="M12 3.66667C12 3.75035 11.9994 3.83206 11.9983 3.91184C11.9994 3.94108 12 3.97047 12 4V4.21428C12 4.49502 11.8763 4.76461 11.6065 5.02898C11.3319 5.2981 10.9246 5.54074 10.4197 5.74366C9.41078 6.14907 8.10976 6.35714 7 6.35714C5.89024 6.35714 4.58922 6.14907 3.58034 5.74366C3.07537 5.54074 2.66813 5.2981 2.39348 5.02898C2.12368 4.76461 2 4.49502 2 4.21428V4C2 3.96691 2.00073 3.934 2.00217 3.90128C2.00073 3.82496 2 3.74677 2 3.66667C2 1.85714 4.53444 1 7 1C9.46556 1 12 1.85714 12 3.66667Z" fill={'currentColor'} /><path d="M2 5.81314V7.64286C2 7.92359 2.12368 8.19318 2.39348 8.45755C2.66813 8.72667 3.07537 8.96932 3.58034 9.17224C4.58922 9.57765 5.89024 9.78571 7 9.78571C7.04434 9.78571 7.08899 9.78538 7.13391 9.78472C7.3015 9.17079 7.6264 8.59083 8.10862 8.10862C9.16114 7.05609 10.6793 6.75302 12 7.1994V5.81314C11.6435 6.11014 11.1998 6.35041 10.7229 6.54204C9.59874 6.99378 8.19143 7.21428 7 7.21428C5.80857 7.21428 4.40126 6.99378 3.2771 6.54204C2.8002 6.35041 2.35654 6.11014 2 5.81314Z" fill={'currentColor'} /><path d="M7 10.6429H7.00266C6.97218 11.4587 7.20413 12.2826 7.69852 12.977C7.46653 12.9923 7.23296 13 7 13C4.53444 13 2 12.1429 2 10.3333C2 10.2503 2.00057 10.1683 2.00171 10.0875C2.00057 10.0585 2 10.0293 2 10V9.24171C2.35654 9.53872 2.8002 9.77898 3.2771 9.97062C4.40126 10.4223 5.80857 10.6429 7 10.6429Z" fill={'currentColor'} /></svg>;
 };
 SearchIndex.displayName = 'SearchIndex';
 SearchIndex.isGlyph = true;

package/src/generated/Secondary.tsx

@@ -2,10 +2,11 @@
 * This is a generated file. Do not modify it manually.
 *
 * @script packages/icon/scripts/prebuild/index.ts
-* @checksum 88240cf63eabdb680196493723db69de
+* @checksum 07a18998556ab8687deff6e047d975d6
 */
 import * as React from "react";
 import { css, cx } from '@leafygreen-ui/emotion';
+import { useIdAllocator } from '@leafygreen-ui/hooks';
 import { generateAccessibleProps, sizeMap } from '../glyphCommon';
 import { LGGlyph } from '../types';
 export interface SecondaryProps extends LGGlyph.ComponentProps {}
@@ -19,6 +20,9 @@ const Secondary = ({
   role = 'img',
   ...props
 }: SecondaryProps) => {
+  const titleId = useIdAllocator({
+    prefix: 'icon-title'
+  });
   const fillStyle = css`
         color: ${fill};
       `;
@@ -27,12 +31,13 @@ const Secondary = ({
       `;
   const accessibleProps = generateAccessibleProps(role, 'Secondary', {
     title,
+    titleId,
     ['aria-label']: ariaLabel,
     ['aria-labelledby']: ariaLabelledby
   });
   return <svg className={cx({
     [fillStyle]: fill != null
-  }, noFlexShrink, className)} height={typeof size === 'number' ? size : sizeMap[size]} width={typeof size === 'number' ? size : sizeMap[size]} role={role} {...accessibleProps} {...props} viewBox="0 0 16 16"><path fillRule="evenodd" clipRule="evenodd" d="M8 13.5C11.0376 13.5 13.5 11.0376 13.5 8C13.5 4.96243 11.0376 2.5 8 2.5C4.96243 2.5 2.5 4.96243 2.5 8C2.5 11.0376 4.96243 13.5 8 13.5ZM8 15C11.866 15 15 11.866 15 8C15 4.13401 11.866 1 8 1C4.13401 1 1 4.13401 1 8C1 11.866 4.13401 15 8 15Z" fill={'currentColor'} /><path d="M11 9.6705C11 11.1111 9.78621 12 8.11724 12C6.33793 12 5.06897 10.8966 5 9.39464H6.97241C7.04138 10.069 7.56552 10.3908 8.17241 10.3908C8.76552 10.3908 9.06896 10.1456 9.06896 9.77778C9.06896 9.37931 8.8069 9.18008 8.2 9.01149L6.90345 8.64368C5.70345 8.30651 5.15172 7.38697 5.15172 6.2682C5.15172 4.95019 6.2 4 7.92414 4C9.44138 4 10.6 4.88889 10.7103 6.42146H8.8069C8.71034 5.83908 8.31034 5.63985 7.89655 5.63985C7.41379 5.63985 7.08276 5.85441 7.08276 6.22222C7.08276 6.65134 7.45517 6.81992 7.86897 6.9272L9.08276 7.29502C10.4345 7.67816 11 8.4751 11 9.6705Z" fill={'currentColor'} /></svg>;
+  }, noFlexShrink, className)} height={typeof size === 'number' ? size : sizeMap[size]} width={typeof size === 'number' ? size : sizeMap[size]} role={role} {...accessibleProps} {...props} viewBox="0 0 16 16">{title && <title id={titleId}>{title}</title>}<path fillRule="evenodd" clipRule="evenodd" d="M8 13.5C11.0376 13.5 13.5 11.0376 13.5 8C13.5 4.96243 11.0376 2.5 8 2.5C4.96243 2.5 2.5 4.96243 2.5 8C2.5 11.0376 4.96243 13.5 8 13.5ZM8 15C11.866 15 15 11.866 15 8C15 4.13401 11.866 1 8 1C4.13401 1 1 4.13401 1 8C1 11.866 4.13401 15 8 15Z" fill={'currentColor'} /><path d="M11 9.6705C11 11.1111 9.78621 12 8.11724 12C6.33793 12 5.06897 10.8966 5 9.39464H6.97241C7.04138 10.069 7.56552 10.3908 8.17241 10.3908C8.76552 10.3908 9.06896 10.1456 9.06896 9.77778C9.06896 9.37931 8.8069 9.18008 8.2 9.01149L6.90345 8.64368C5.70345 8.30651 5.15172 7.38697 5.15172 6.2682C5.15172 4.95019 6.2 4 7.92414 4C9.44138 4 10.6 4.88889 10.7103 6.42146H8.8069C8.71034 5.83908 8.31034 5.63985 7.89655 5.63985C7.41379 5.63985 7.08276 5.85441 7.08276 6.22222C7.08276 6.65134 7.45517 6.81992 7.86897 6.9272L9.08276 7.29502C10.4345 7.67816 11 8.4751 11 9.6705Z" fill={'currentColor'} /></svg>;
 };
 Secondary.displayName = 'Secondary';
 Secondary.isGlyph = true;

package/src/generated/Serverless.tsx

@@ -2,10 +2,11 @@
 * This is a generated file. Do not modify it manually.
 *
 * @script packages/icon/scripts/prebuild/index.ts
-* @checksum 6236dd59a36b30b56a85d2551a5ecb37
+* @checksum 8669a9fce8f62ddde57601c0fea559d8
 */
 import * as React from "react";
 import { css, cx } from '@leafygreen-ui/emotion';
+import { useIdAllocator } from '@leafygreen-ui/hooks';
 import { generateAccessibleProps, sizeMap } from '../glyphCommon';
 import { LGGlyph } from '../types';
 export interface ServerlessProps extends LGGlyph.ComponentProps {}
@@ -19,6 +20,9 @@ const Serverless = ({
   role = 'img',
   ...props
 }: ServerlessProps) => {
+  const titleId = useIdAllocator({
+    prefix: 'icon-title'
+  });
   const fillStyle = css`
         color: ${fill};
       `;
@@ -27,12 +31,13 @@ const Serverless = ({
       `;
   const accessibleProps = generateAccessibleProps(role, 'Serverless', {
     title,
+    titleId,
     ['aria-label']: ariaLabel,
     ['aria-labelledby']: ariaLabelledby
   });
   return <svg className={cx({
     [fillStyle]: fill != null
-  }, noFlexShrink, className)} height={typeof size === 'number' ? size : sizeMap[size]} width={typeof size === 'number' ? size : sizeMap[size]} role={role} {...accessibleProps} {...props} viewBox="0 0 16 16"><path d="M2.13223 10.8487C0.834955 9.84256 0 8.26878 0 6.5C0 3.46243 2.46243 1 5.5 1C7.74673 1 9.67881 2.34714 10.5326 4.27774C10.9869 4.09848 11.482 4 12 4C14.2091 4 16 5.79086 16 8C16 9.05152 15.5943 10.0083 14.9308 10.7222C14.8896 10.7907 14.8395 10.8552 14.7805 10.9142L13.0092 12.8124C12.6426 13.2337 12.1024 13.5 11.5 13.5L7.79198 13.5C7.4062 14.383 6.52516 15 5.5 15C4.11929 15 3 13.8807 3 12.5C3 12.1448 3.07407 11.8069 3.2076 11.501C3.59316 10.6175 4.47447 10 5.5 10C6.52515 10 7.40619 10.617 7.79197 11.5L11.5 11.5L12.6664 10.25L8.49996 10.25C7.81664 9.34027 6.72814 8.75 5.5 8.75C4.02153 8.75 2.7429 9.6056 2.13223 10.8487Z" fill={'currentColor'} /></svg>;
+  }, noFlexShrink, className)} height={typeof size === 'number' ? size : sizeMap[size]} width={typeof size === 'number' ? size : sizeMap[size]} role={role} {...accessibleProps} {...props} viewBox="0 0 16 16">{title && <title id={titleId}>{title}</title>}<path d="M2.13223 10.8487C0.834955 9.84256 0 8.26878 0 6.5C0 3.46243 2.46243 1 5.5 1C7.74673 1 9.67881 2.34714 10.5326 4.27774C10.9869 4.09848 11.482 4 12 4C14.2091 4 16 5.79086 16 8C16 9.05152 15.5943 10.0083 14.9308 10.7222C14.8896 10.7907 14.8395 10.8552 14.7805 10.9142L13.0092 12.8124C12.6426 13.2337 12.1024 13.5 11.5 13.5L7.79198 13.5C7.4062 14.383 6.52516 15 5.5 15C4.11929 15 3 13.8807 3 12.5C3 12.1448 3.07407 11.8069 3.2076 11.501C3.59316 10.6175 4.47447 10 5.5 10C6.52515 10 7.40619 10.617 7.79197 11.5L11.5 11.5L12.6664 10.25L8.49996 10.25C7.81664 9.34027 6.72814 8.75 5.5 8.75C4.02153 8.75 2.7429 9.6056 2.13223 10.8487Z" fill={'currentColor'} /></svg>;
 };
 Serverless.displayName = 'Serverless';
 Serverless.isGlyph = true;

package/src/generated/Settings.tsx

@@ -2,10 +2,11 @@
 * This is a generated file. Do not modify it manually.
 *
 * @script packages/icon/scripts/prebuild/index.ts
-* @checksum 8dd130a799c0e750237f9d7e9bf1973b
+* @checksum 34b559a3c2f751afd2269bd8ba585287
 */
 import * as React from "react";
 import { css, cx } from '@leafygreen-ui/emotion';
+import { useIdAllocator } from '@leafygreen-ui/hooks';
 import { generateAccessibleProps, sizeMap } from '../glyphCommon';
 import { LGGlyph } from '../types';
 export interface SettingsProps extends LGGlyph.ComponentProps {}
@@ -19,6 +20,9 @@ const Settings = ({
   role = 'img',
   ...props
 }: SettingsProps) => {
+  const titleId = useIdAllocator({
+    prefix: 'icon-title'
+  });
   const fillStyle = css`
         color: ${fill};
       `;
@@ -27,12 +31,13 @@ const Settings = ({
       `;
   const accessibleProps = generateAccessibleProps(role, 'Settings', {
     title,
+    titleId,
     ['aria-label']: ariaLabel,
     ['aria-labelledby']: ariaLabelledby
   });
   return <svg className={cx({
     [fillStyle]: fill != null
-  }, noFlexShrink, className)} height={typeof size === 'number' ? size : sizeMap[size]} width={typeof size === 'number' ? size : sizeMap[size]} role={role} {...accessibleProps} {...props} viewBox="0 0 16 16"><path fillRule="evenodd" clipRule="evenodd" d="M10.2068 1.06716C9.88875 0.935661 9.52203 1.03749 9.31733 1.31414L8.94293 1.82012C8.30664 1.72253 7.66857 1.72598 7.04948 1.8218L6.67408 1.31582C6.46902 1.03944 6.10217 0.938077 5.7843 1.06998L4.65819 1.53728C4.34032 1.66918 4.15301 2.0005 4.20388 2.34087L4.29701 2.96397C3.79197 3.33462 3.33892 3.78396 2.95865 4.30338L2.33602 4.21114C1.99558 4.1607 1.66451 4.34843 1.53301 4.66647L1.06716 5.79319C0.935661 6.11122 1.03749 6.47794 1.31414 6.68265L1.82012 7.05705C1.72253 7.69334 1.72598 8.33142 1.8218 8.9505L1.31583 9.32589C1.03945 9.53096 0.938089 9.89781 1.06999 10.2157L1.53729 11.3418C1.6692 11.6597 2.00051 11.847 2.34088 11.7961L2.96398 11.703C3.33462 12.208 3.78396 12.6611 4.30338 13.0413L4.21114 13.664C4.1607 14.0044 4.34843 14.3355 4.66647 14.467L5.79319 14.9328C6.11122 15.0643 6.47794 14.9625 6.68265 14.6858L7.05705 14.1799C7.69335 14.2774 8.33142 14.274 8.95051 14.1782L9.3259 14.6841C9.53096 14.9605 9.89781 15.0619 10.2157 14.93L11.3418 14.4627C11.6597 14.3308 11.847 13.9995 11.7961 13.6591L11.703 13.036C12.208 12.6654 12.6611 12.216 13.0413 11.6966L13.664 11.7888C14.0044 11.8393 14.3355 11.6515 14.467 11.3335L14.9328 10.2068C15.0643 9.88875 14.9625 9.52203 14.6858 9.31733L14.1799 8.94293C14.2774 8.30663 14.274 7.66856 14.1782 7.04947L14.6841 6.67408C14.9605 6.46902 15.0619 6.10217 14.93 5.7843L14.4627 4.65819C14.3308 4.34032 13.9995 4.15301 13.6591 4.20388L13.036 4.29701C12.6654 3.79197 12.216 3.33892 11.6966 2.95865L11.7888 2.33602C11.8393 1.99558 11.6515 1.66451 11.3335 1.53301L10.2068 1.06716ZM10.5413 9.05074C9.96102 10.4543 8.35278 11.1216 6.94924 10.5413C5.54569 9.96102 4.87833 8.35278 5.45865 6.94924C6.03896 5.54569 7.6472 4.87833 9.05074 5.45865C10.4543 6.03896 11.1216 7.6472 10.5413 9.05074Z" fill={'currentColor'} /></svg>;
+  }, noFlexShrink, className)} height={typeof size === 'number' ? size : sizeMap[size]} width={typeof size === 'number' ? size : sizeMap[size]} role={role} {...accessibleProps} {...props} viewBox="0 0 16 16">{title && <title id={titleId}>{title}</title>}<path fillRule="evenodd" clipRule="evenodd" d="M10.2068 1.06716C9.88875 0.935661 9.52203 1.03749 9.31733 1.31414L8.94293 1.82012C8.30664 1.72253 7.66857 1.72598 7.04948 1.8218L6.67408 1.31582C6.46902 1.03944 6.10217 0.938077 5.7843 1.06998L4.65819 1.53728C4.34032 1.66918 4.15301 2.0005 4.20388 2.34087L4.29701 2.96397C3.79197 3.33462 3.33892 3.78396 2.95865 4.30338L2.33602 4.21114C1.99558 4.1607 1.66451 4.34843 1.53301 4.66647L1.06716 5.79319C0.935661 6.11122 1.03749 6.47794 1.31414 6.68265L1.82012 7.05705C1.72253 7.69334 1.72598 8.33142 1.8218 8.9505L1.31583 9.32589C1.03945 9.53096 0.938089 9.89781 1.06999 10.2157L1.53729 11.3418C1.6692 11.6597 2.00051 11.847 2.34088 11.7961L2.96398 11.703C3.33462 12.208 3.78396 12.6611 4.30338 13.0413L4.21114 13.664C4.1607 14.0044 4.34843 14.3355 4.66647 14.467L5.79319 14.9328C6.11122 15.0643 6.47794 14.9625 6.68265 14.6858L7.05705 14.1799C7.69335 14.2774 8.33142 14.274 8.95051 14.1782L9.3259 14.6841C9.53096 14.9605 9.89781 15.0619 10.2157 14.93L11.3418 14.4627C11.6597 14.3308 11.847 13.9995 11.7961 13.6591L11.703 13.036C12.208 12.6654 12.6611 12.216 13.0413 11.6966L13.664 11.7888C14.0044 11.8393 14.3355 11.6515 14.467 11.3335L14.9328 10.2068C15.0643 9.88875 14.9625 9.52203 14.6858 9.31733L14.1799 8.94293C14.2774 8.30663 14.274 7.66856 14.1782 7.04947L14.6841 6.67408C14.9605 6.46902 15.0619 6.10217 14.93 5.7843L14.4627 4.65819C14.3308 4.34032 13.9995 4.15301 13.6591 4.20388L13.036 4.29701C12.6654 3.79197 12.216 3.33892 11.6966 2.95865L11.7888 2.33602C11.8393 1.99558 11.6515 1.66451 11.3335 1.53301L10.2068 1.06716ZM10.5413 9.05074C9.96102 10.4543 8.35278 11.1216 6.94924 10.5413C5.54569 9.96102 4.87833 8.35278 5.45865 6.94924C6.03896 5.54569 7.6472 4.87833 9.05074 5.45865C10.4543 6.03896 11.1216 7.6472 10.5413 9.05074Z" fill={'currentColor'} /></svg>;
 };
 Settings.displayName = 'Settings';
 Settings.isGlyph = true;