@blueprintjs/icons 5.0.0-alpha.5 → 5.0.0-beta.1

package/src/generated/components/edit.tsx

@@ -13,73 +13,30 @@
  * limitations under the License.
  */
 
-import classNames from "classnames";
 import * as React from "react";
 import type { SVGIconProps } from "../../svgIconProps";
-import { IconSize } from "../../iconSize";
-import * as Classes from "../../classes";
-import { uniqueId } from "../../jsUtils";
+import { IconSize } from "../../iconTypes";
+import { SVGIconContainer } from "../../svgIconContainer";
 
-export const Edit: React.FC<SVGIconProps> = React.forwardRef<any, SVGIconProps>(({
-    className,
-    color,
-    size = IconSize.STANDARD,
-    title,
-    htmlTitle,
-    svgProps,
-    tagName = "span",
-    ...htmlProps
-}, ref) => {
-    const isLarge = size >= IconSize.LARGE;
-    const pixelGridSize =  isLarge ? IconSize.LARGE : IconSize.STANDARD;
-    const viewBox = `0 0 ${pixelGridSize} ${pixelGridSize}`;
-    const titleId = uniqueId("iconTitle");
-    const path = (
-        <path
-            d={
-                isLarge
-                    ? "M91.8 148.2L148.4 91.6L301.4 244.6L244.8 301.2000000000001L91.8 148.2zM40 40L128.2 71.8L72 127.6L40 40zM320 360C309 360 299 355.6 291.8 348.2L258.8 315.2L315.4 258.6L348.4 291.6C355.6 299 360 309 360 320C360 342 342 360 320 360z"
-                    : "M65 114.8L114.4 65.4L248.2 199.2L199 248.8L65 114.8zM19.8 20.2L97 48L47.8 96.8L19.8 20.2zM264.8 300.2C255.2 300.2 246.4 296.2 240 290L211.2 261.2L260.6 211.8L289.4000000000001 240.6C295.8 247 299.6 255.6 299.6 265.4C299.8 284.4 284.2000000000001 300.2 264.8 300.2z"
-            }
-            fillRule="evenodd"
-            transform="scale(0.05 0.05)"
-        />
-    );
-
-    if (tagName === null) {
-        return (
-            <svg
-                aria-labelledby={title ? titleId : undefined}
-                data-icon="edit"
-                fill={color}
-                height={size}
-                ref={ref}
-                role="img"
-                viewBox={viewBox}
-                width={size}
-                {...svgProps}
-                {...htmlProps}
-            >
-                {title && <title id={titleId}>{title}</title>}
-                {path}
-            </svg>
-        );
-    } else {
-        return React.createElement(
-            tagName,
-            {
-                ...htmlProps,
-                "aria-hidden": title ? undefined : true,
-                className: classNames(Classes.ICON, `${Classes.ICON}-edit`, className),
-                ref,
-                title: htmlTitle,
-            },
-            <svg fill={color} data-icon="edit" width={size} height={size} role="img" viewBox={viewBox} {...svgProps}>
-                {title && <title>{title}</title>}
-                {path}
-            </svg>
-        );
-    }
+export const Edit: React.FC<SVGIconProps> = React.forwardRef<any, SVGIconProps>((props, ref) => {
+    const translation = `${-1 * props.size! / 0.05 / 2}`;
+    return (
+        <SVGIconContainer iconName="edit" ref={ref}  {...props}>
+            <path
+                d={
+                    props.size! < IconSize.LARGE
+                        ? "M65 114.8L114.4 65.4L248.2 199.2L199 248.8L65 114.8zM19.8 20.2L97 48L47.8 96.8L19.8 20.2zM264.8 300.2C255.2 300.2 246.4 296.2 240 290L211.2 261.2L260.6 211.8L289.4000000000001 240.6C295.8 247 299.6 255.6 299.6 265.4C299.8 284.4 284.2000000000001 300.2 264.8 300.2z"
+                        : "M91.8 148.2L148.4 91.6L301.4 244.6L244.8 301.2000000000001L91.8 148.2zM40 40L128.2 71.8L72 127.6L40 40zM320 360C309 360 299 355.6 291.8 348.2L258.8 315.2L315.4 258.6L348.4 291.6C355.6 299 360 309 360 320C360 342 342 360 320 360z"
+                }
+                fillRule="evenodd"
+                transform-origin="center"
+                transform={`scale(0.05, -0.05) translate(${translation}, ${translation})`}
+            />
+        </SVGIconContainer>
+   )
 });
+Edit.defaultProps = {
+    size: IconSize.STANDARD,
+};
 Edit.displayName = `Blueprint5.Icon.Edit`;
 export default Edit;

package/src/generated/components/eject.tsx

@@ -13,73 +13,30 @@
  * limitations under the License.
  */
 
-import classNames from "classnames";
 import * as React from "react";
 import type { SVGIconProps } from "../../svgIconProps";
-import { IconSize } from "../../iconSize";
-import * as Classes from "../../classes";
-import { uniqueId } from "../../jsUtils";
+import { IconSize } from "../../iconTypes";
+import { SVGIconContainer } from "../../svgIconContainer";
 
-export const Eject: React.FC<SVGIconProps> = React.forwardRef<any, SVGIconProps>(({
-    className,
-    color,
-    size = IconSize.STANDARD,
-    title,
-    htmlTitle,
-    svgProps,
-    tagName = "span",
-    ...htmlProps
-}, ref) => {
-    const isLarge = size >= IconSize.LARGE;
-    const pixelGridSize =  isLarge ? IconSize.LARGE : IconSize.STANDARD;
-    const viewBox = `0 0 ${pixelGridSize} ${pixelGridSize}`;
-    const titleId = uniqueId("iconTitle");
-    const path = (
-        <path
-            d={
-                isLarge
-                    ? "M80 160H320C331 160 340 169 340 180C340 185 338 189.4 335 192.8L335.2000000000001 193L215.2000000000001 333L215 332.8C211.4 337.2 206 340 200 340S188.6 337.2 185 332.8C185 332.8 184.8 333 184.8 333L64.8 193L65 192.8C62 189.4 60 185 60 180C60 169 69 160 80 160zM320 140H80C69 140 60 131 60 120V80C60 69 69 60 80 60H320C331 60 340 69 340 80V120C340 131 331 140 320 140z"
-                    : "M80 140H240C251 140 260 149 260 160C260 165.6 257.8 170.6 254.2 174.2L174.2 254.2C170.6 257.8 165.6 260 160 260S149.4 257.8 145.8 254.2L65.8 174.2C62.2 170.6 60 165.6 60 160C60 149 69 140 80 140zM240 120H80C69 120 60 111 60 100V80C60 69 69 60 80 60H240C251 60 260 69 260 80V100C260 111 251 120 240 120z"
-            }
-            fillRule="evenodd"
-            transform="scale(0.05 0.05)"
-        />
-    );
-
-    if (tagName === null) {
-        return (
-            <svg
-                aria-labelledby={title ? titleId : undefined}
-                data-icon="eject"
-                fill={color}
-                height={size}
-                ref={ref}
-                role="img"
-                viewBox={viewBox}
-                width={size}
-                {...svgProps}
-                {...htmlProps}
-            >
-                {title && <title id={titleId}>{title}</title>}
-                {path}
-            </svg>
-        );
-    } else {
-        return React.createElement(
-            tagName,
-            {
-                ...htmlProps,
-                "aria-hidden": title ? undefined : true,
-                className: classNames(Classes.ICON, `${Classes.ICON}-eject`, className),
-                ref,
-                title: htmlTitle,
-            },
-            <svg fill={color} data-icon="eject" width={size} height={size} role="img" viewBox={viewBox} {...svgProps}>
-                {title && <title>{title}</title>}
-                {path}
-            </svg>
-        );
-    }
+export const Eject: React.FC<SVGIconProps> = React.forwardRef<any, SVGIconProps>((props, ref) => {
+    const translation = `${-1 * props.size! / 0.05 / 2}`;
+    return (
+        <SVGIconContainer iconName="eject" ref={ref}  {...props}>
+            <path
+                d={
+                    props.size! < IconSize.LARGE
+                        ? "M80 140H240C251 140 260 149 260 160C260 165.6 257.8 170.6 254.2 174.2L174.2 254.2C170.6 257.8 165.6 260 160 260S149.4 257.8 145.8 254.2L65.8 174.2C62.2 170.6 60 165.6 60 160C60 149 69 140 80 140zM240 120H80C69 120 60 111 60 100V80C60 69 69 60 80 60H240C251 60 260 69 260 80V100C260 111 251 120 240 120z"
+                        : "M80 160H320C331 160 340 169 340 180C340 185 338 189.4 335 192.8L335.2000000000001 193L215.2000000000001 333L215 332.8C211.4 337.2 206 340 200 340S188.6 337.2 185 332.8C185 332.8 184.8 333 184.8 333L64.8 193L65 192.8C62 189.4 60 185 60 180C60 169 69 160 80 160zM320 140H80C69 140 60 131 60 120V80C60 69 69 60 80 60H320C331 60 340 69 340 80V120C340 131 331 140 320 140z"
+                }
+                fillRule="evenodd"
+                transform-origin="center"
+                transform={`scale(0.05, -0.05) translate(${translation}, ${translation})`}
+            />
+        </SVGIconContainer>
+   )
 });
+Eject.defaultProps = {
+    size: IconSize.STANDARD,
+};
 Eject.displayName = `Blueprint5.Icon.Eject`;
 export default Eject;

package/src/generated/components/emoji.tsx

@@ -13,73 +13,30 @@
  * limitations under the License.
  */
 
-import classNames from "classnames";
 import * as React from "react";
 import type { SVGIconProps } from "../../svgIconProps";
-import { IconSize } from "../../iconSize";
-import * as Classes from "../../classes";
-import { uniqueId } from "../../jsUtils";
+import { IconSize } from "../../iconTypes";
+import { SVGIconContainer } from "../../svgIconContainer";
 
-export const Emoji: React.FC<SVGIconProps> = React.forwardRef<any, SVGIconProps>(({
-    className,
-    color,
-    size = IconSize.STANDARD,
-    title,
-    htmlTitle,
-    svgProps,
-    tagName = "span",
-    ...htmlProps
-}, ref) => {
-    const isLarge = size >= IconSize.LARGE;
-    const pixelGridSize =  isLarge ? IconSize.LARGE : IconSize.STANDARD;
-    const viewBox = `0 0 ${pixelGridSize} ${pixelGridSize}`;
-    const titleId = uniqueId("iconTitle");
-    const path = (
-        <path
-            d={
-                isLarge
-                    ? "M200 400C310.45695 400 400 310.45695 400 200C400 89.54305 310.45695 0 200 0C89.54305 0 0 89.54305 0 200C0 310.45695 89.54305 400 200 400zM200 360C111.63444 360 40 288.36556 40 200C40 111.63444 111.63444 40 200 40C288.36556 40 360 111.63444 360 200C360 288.36556 288.36556 360 200 360zM120 200L120.2995578 195.695118C124.3722088 151.607298 158.4949642 120 200 120C242.843908 120 277.821578 153.67937 279.9020940000001 196.007194L280 200L320 200L319.7479840000001 195.2364C315.089908 128.952668 263.261708 80 200 80C135.2320612 80 82.4485648 131.311498 80.0827694 195.501234L80 200L120 200zM150 280C166.5685424 280 180 266.5685424 180 250C180 233.4314576 166.5685424 220 150 220C133.4314576 220 120 233.4314576 120 250C120 266.5685424 133.4314576 280 150 280zM250 280C266.5685420000001 280 280 266.5685424 280 250C280 233.4314576 266.5685420000001 220 250 220C233.431458 220 220 233.4314576 220 250C220 266.5685424 233.431458 280 250 280z"
-                    : "M160 320C248.36556 320 320 248.36556 320 160C320 71.63444 248.36556 0 160 0C71.63444 0 0 71.63444 0 160C0 248.36556 71.63444 320 160 320zM160 300C82.680135 300 20 237.319865 20 160C20 82.680136 82.680135 20 160 20C237.319864 20 300 82.680136 300 160C300 237.319865 237.319864 300 160 300zM80 160C84.5527456 114.761724 120 80 160 80C198.75 80 235.414496 114.765414 239.688518 155.991191L240 160L260 160C257.43309 102.2497 213.650518 60 160 60C106.224906 60 62.3636378 102.446134 60.0923902 155.6622076L60 160L80 160zM120 220C131.045695 220 140 211.045695 140 200C140 188.954305 131.045695 180 120 180C108.954305 180 100 188.954305 100 200C100 211.045695 108.954305 220 120 220zM200 220C211.045694 220 220 211.045695 220 200C220 188.954305 211.045694 180 200 180C188.954305 180 180 188.954305 180 200C180 211.045695 188.954305 220 200 220z"
-            }
-            fillRule="evenodd"
-            transform="scale(0.05 0.05)"
-        />
-    );
-
-    if (tagName === null) {
-        return (
-            <svg
-                aria-labelledby={title ? titleId : undefined}
-                data-icon="emoji"
-                fill={color}
-                height={size}
-                ref={ref}
-                role="img"
-                viewBox={viewBox}
-                width={size}
-                {...svgProps}
-                {...htmlProps}
-            >
-                {title && <title id={titleId}>{title}</title>}
-                {path}
-            </svg>
-        );
-    } else {
-        return React.createElement(
-            tagName,
-            {
-                ...htmlProps,
-                "aria-hidden": title ? undefined : true,
-                className: classNames(Classes.ICON, `${Classes.ICON}-emoji`, className),
-                ref,
-                title: htmlTitle,
-            },
-            <svg fill={color} data-icon="emoji" width={size} height={size} role="img" viewBox={viewBox} {...svgProps}>
-                {title && <title>{title}</title>}
-                {path}
-            </svg>
-        );
-    }
+export const Emoji: React.FC<SVGIconProps> = React.forwardRef<any, SVGIconProps>((props, ref) => {
+    const translation = `${-1 * props.size! / 0.05 / 2}`;
+    return (
+        <SVGIconContainer iconName="emoji" ref={ref}  {...props}>
+            <path
+                d={
+                    props.size! < IconSize.LARGE
+                        ? "M160 320C248.36556 320 320 248.36556 320 160C320 71.63444 248.36556 0 160 0C71.63444 0 0 71.63444 0 160C0 248.36556 71.63444 320 160 320zM160 300C82.680135 300 20 237.319865 20 160C20 82.680136 82.680135 20 160 20C237.319864 20 300 82.680136 300 160C300 237.319865 237.319864 300 160 300zM80 160C84.5527456 114.761724 120 80 160 80C198.75 80 235.414496 114.765414 239.688518 155.991191L240 160L260 160C257.43309 102.2497 213.650518 60 160 60C106.224906 60 62.3636378 102.446134 60.0923902 155.6622076L60 160L80 160zM120 220C131.045695 220 140 211.045695 140 200C140 188.954305 131.045695 180 120 180C108.954305 180 100 188.954305 100 200C100 211.045695 108.954305 220 120 220zM200 220C211.045694 220 220 211.045695 220 200C220 188.954305 211.045694 180 200 180C188.954305 180 180 188.954305 180 200C180 211.045695 188.954305 220 200 220z"
+                        : "M200 400C310.45695 400 400 310.45695 400 200C400 89.54305 310.45695 0 200 0C89.54305 0 0 89.54305 0 200C0 310.45695 89.54305 400 200 400zM200 360C111.63444 360 40 288.36556 40 200C40 111.63444 111.63444 40 200 40C288.36556 40 360 111.63444 360 200C360 288.36556 288.36556 360 200 360zM120 200L120.2995578 195.695118C124.3722088 151.607298 158.4949642 120 200 120C242.843908 120 277.821578 153.67937 279.9020940000001 196.007194L280 200L320 200L319.7479840000001 195.2364C315.089908 128.952668 263.261708 80 200 80C135.2320612 80 82.4485648 131.311498 80.0827694 195.501234L80 200L120 200zM150 280C166.5685424 280 180 266.5685424 180 250C180 233.4314576 166.5685424 220 150 220C133.4314576 220 120 233.4314576 120 250C120 266.5685424 133.4314576 280 150 280zM250 280C266.5685420000001 280 280 266.5685424 280 250C280 233.4314576 266.5685420000001 220 250 220C233.431458 220 220 233.4314576 220 250C220 266.5685424 233.431458 280 250 280z"
+                }
+                fillRule="evenodd"
+                transform-origin="center"
+                transform={`scale(0.05, -0.05) translate(${translation}, ${translation})`}
+            />
+        </SVGIconContainer>
+   )
 });
+Emoji.defaultProps = {
+    size: IconSize.STANDARD,
+};
 Emoji.displayName = `Blueprint5.Icon.Emoji`;
 export default Emoji;

package/src/generated/components/endorsed.tsx

@@ -13,73 +13,30 @@
  * limitations under the License.
  */
 
-import classNames from "classnames";
 import * as React from "react";
 import type { SVGIconProps } from "../../svgIconProps";
-import { IconSize } from "../../iconSize";
-import * as Classes from "../../classes";
-import { uniqueId } from "../../jsUtils";
+import { IconSize } from "../../iconTypes";
+import { SVGIconContainer } from "../../svgIconContainer";
 
-export const Endorsed: React.FC<SVGIconProps> = React.forwardRef<any, SVGIconProps>(({
-    className,
-    color,
-    size = IconSize.STANDARD,
-    title,
-    htmlTitle,
-    svgProps,
-    tagName = "span",
-    ...htmlProps
-}, ref) => {
-    const isLarge = size >= IconSize.LARGE;
-    const pixelGridSize =  isLarge ? IconSize.LARGE : IconSize.STANDARD;
-    const viewBox = `0 0 ${pixelGridSize} ${pixelGridSize}`;
-    const titleId = uniqueId("iconTitle");
-    const path = (
-        <path
-            d={
-                isLarge
-                    ? "M396.6 212.4L376.2 248V287.6C376.2 296.6 371.6 304.6 364 309.2L329.8 329.2L309.4 364.4C304.8 372 296.8 376.6 287.8 376.6H247.2L212.4 396.6C204.8 401.2 195 401.2 187.4 396.6L152.6 376.6H113C104.2 376.6 96 372 91.4 364.4L71.6 330L35.6 309.2C28 304.4 23.2 296.4 23.2 287.6V246.4L3.4 212C1.2 208.2 0 204 0 199.8S1.2 191.4 3.4 187.6L23.2 153.2V112C23.2 103 27.8 95 35.4 90.4L71 70L90.8 35.6C95.4 28.0000000000001 103.4 23.4 112.4 23.4H152.2L187 3.4C190.8 1.2 195.2 0 199.4 0C203.6 0 207.8 1.2 211.6 3.4L246.4 23.4H287C295.8 23.4 304 28.0000000000001 308.6 35.6L329 70.8000000000001L363.2 90.8000000000001C370.8 95.4000000000001 375.4 103.6000000000001 375.4 112.4V151.8000000000001L395.8 187.4000000000001C401.2 195 401.2 204.4 396.6 212.4zM295 226.6L194.8 126.4C191.2 122.8 186.2 120.6 180.6 120.6C175 120.6 170 122.8 166.4 126.4L106.2 186.6C102.6 190.2 100.4 195.2 100.4 200.8C100.4 211.8 109.4 220.8 120.4 220.8C126 220.8 131 218.6 134.6 215L180.6 169L266.8 255C270.4 258.6 275.4 260.8 281 260.8C292 260.8 301 251.8 301 240.8C301 235.2 298.6 230.2 295 226.6z"
-                    : "M317.2 170L301 198.4V230C301 237.2 297.2 243.6 291.2 247.4L263.8 263.4L247.6 291.6C243.8 297.8 237.4 301.4 230.4 301.4H197.8L170 317.2C164 321 156.2 321 150 317.2L122.2 301.2H90.4C83.2 301.2 76.8 297.4 73.2 291.4L57.2 264L28.4 247.4C22.4 243.6 18.6 237.2 18.6 230V197L2.6 169.6C1 166.6 0 163.2 0 159.8S1 153 2.8 150L18.8 122.6V89.6C18.8 82.4 22.6 76 28.6 72.2L57 56L73 28.6C76.8 22.4 83.2 18.8 90.2 18.8H122L149.8 2.8C152.8 1 156.2 0 159.4 0S166.2 1 169.2 2.8L197 18.8H229.6C236.8 18.8 243.2 22.6 246.8 28.6L263 56.8L290.4 72.8C296.4 76.6 300.2 83.0000000000001 300.2 90.2000000000001V121.4L316.4 149.8C321 156 321 163.6 317.2 170zM234.8 186.4L154.6 106.2C151 102.6 146 100.4 140.4 100.4S129.8 102.6 126.2 106.2L86.2 146.2C82.6 150 80.2 155 80.2 160.4C80.2 171.4 89.2 180.4 100.2 180.4C105.8 180.4 110.8 178.2 114.4 174.6L140.4 148.6L206.4 214.6C210 218.2 215 220.4 220.6 220.4C231.6 220.4 240.6 211.4 240.6 200.4C240.8 195 238.4 190 234.8 186.4z"
-            }
-            fillRule="evenodd"
-            transform="scale(0.05 0.05)"
-        />
-    );
-
-    if (tagName === null) {
-        return (
-            <svg
-                aria-labelledby={title ? titleId : undefined}
-                data-icon="endorsed"
-                fill={color}
-                height={size}
-                ref={ref}
-                role="img"
-                viewBox={viewBox}
-                width={size}
-                {...svgProps}
-                {...htmlProps}
-            >
-                {title && <title id={titleId}>{title}</title>}
-                {path}
-            </svg>
-        );
-    } else {
-        return React.createElement(
-            tagName,
-            {
-                ...htmlProps,
-                "aria-hidden": title ? undefined : true,
-                className: classNames(Classes.ICON, `${Classes.ICON}-endorsed`, className),
-                ref,
-                title: htmlTitle,
-            },
-            <svg fill={color} data-icon="endorsed" width={size} height={size} role="img" viewBox={viewBox} {...svgProps}>
-                {title && <title>{title}</title>}
-                {path}
-            </svg>
-        );
-    }
+export const Endorsed: React.FC<SVGIconProps> = React.forwardRef<any, SVGIconProps>((props, ref) => {
+    const translation = `${-1 * props.size! / 0.05 / 2}`;
+    return (
+        <SVGIconContainer iconName="endorsed" ref={ref}  {...props}>
+            <path
+                d={
+                    props.size! < IconSize.LARGE
+                        ? "M317.2 170L301 198.4V230C301 237.2 297.2 243.6 291.2 247.4L263.8 263.4L247.6 291.6C243.8 297.8 237.4 301.4 230.4 301.4H197.8L170 317.2C164 321 156.2 321 150 317.2L122.2 301.2H90.4C83.2 301.2 76.8 297.4 73.2 291.4L57.2 264L28.4 247.4C22.4 243.6 18.6 237.2 18.6 230V197L2.6 169.6C1 166.6 0 163.2 0 159.8S1 153 2.8 150L18.8 122.6V89.6C18.8 82.4 22.6 76 28.6 72.2L57 56L73 28.6C76.8 22.4 83.2 18.8 90.2 18.8H122L149.8 2.8C152.8 1 156.2 0 159.4 0S166.2 1 169.2 2.8L197 18.8H229.6C236.8 18.8 243.2 22.6 246.8 28.6L263 56.8L290.4 72.8C296.4 76.6 300.2 83.0000000000001 300.2 90.2000000000001V121.4L316.4 149.8C321 156 321 163.6 317.2 170zM234.8 186.4L154.6 106.2C151 102.6 146 100.4 140.4 100.4S129.8 102.6 126.2 106.2L86.2 146.2C82.6 150 80.2 155 80.2 160.4C80.2 171.4 89.2 180.4 100.2 180.4C105.8 180.4 110.8 178.2 114.4 174.6L140.4 148.6L206.4 214.6C210 218.2 215 220.4 220.6 220.4C231.6 220.4 240.6 211.4 240.6 200.4C240.8 195 238.4 190 234.8 186.4z"
+                        : "M396.6 212.4L376.2 248V287.6C376.2 296.6 371.6 304.6 364 309.2L329.8 329.2L309.4 364.4C304.8 372 296.8 376.6 287.8 376.6H247.2L212.4 396.6C204.8 401.2 195 401.2 187.4 396.6L152.6 376.6H113C104.2 376.6 96 372 91.4 364.4L71.6 330L35.6 309.2C28 304.4 23.2 296.4 23.2 287.6V246.4L3.4 212C1.2 208.2 0 204 0 199.8S1.2 191.4 3.4 187.6L23.2 153.2V112C23.2 103 27.8 95 35.4 90.4L71 70L90.8 35.6C95.4 28.0000000000001 103.4 23.4 112.4 23.4H152.2L187 3.4C190.8 1.2 195.2 0 199.4 0C203.6 0 207.8 1.2 211.6 3.4L246.4 23.4H287C295.8 23.4 304 28.0000000000001 308.6 35.6L329 70.8000000000001L363.2 90.8000000000001C370.8 95.4000000000001 375.4 103.6000000000001 375.4 112.4V151.8000000000001L395.8 187.4000000000001C401.2 195 401.2 204.4 396.6 212.4zM295 226.6L194.8 126.4C191.2 122.8 186.2 120.6 180.6 120.6C175 120.6 170 122.8 166.4 126.4L106.2 186.6C102.6 190.2 100.4 195.2 100.4 200.8C100.4 211.8 109.4 220.8 120.4 220.8C126 220.8 131 218.6 134.6 215L180.6 169L266.8 255C270.4 258.6 275.4 260.8 281 260.8C292 260.8 301 251.8 301 240.8C301 235.2 298.6 230.2 295 226.6z"
+                }
+                fillRule="evenodd"
+                transform-origin="center"
+                transform={`scale(0.05, -0.05) translate(${translation}, ${translation})`}
+            />
+        </SVGIconContainer>
+   )
 });
+Endorsed.defaultProps = {
+    size: IconSize.STANDARD,
+};
 Endorsed.displayName = `Blueprint5.Icon.Endorsed`;
 export default Endorsed;

package/src/generated/components/envelope.tsx

@@ -13,73 +13,30 @@
  * limitations under the License.
  */
 
-import classNames from "classnames";
 import * as React from "react";
 import type { SVGIconProps } from "../../svgIconProps";
-import { IconSize } from "../../iconSize";
-import * as Classes from "../../classes";
-import { uniqueId } from "../../jsUtils";
+import { IconSize } from "../../iconTypes";
+import { SVGIconContainer } from "../../svgIconContainer";
 
-export const Envelope: React.FC<SVGIconProps> = React.forwardRef<any, SVGIconProps>(({
-    className,
-    color,
-    size = IconSize.STANDARD,
-    title,
-    htmlTitle,
-    svgProps,
-    tagName = "span",
-    ...htmlProps
-}, ref) => {
-    const isLarge = size >= IconSize.LARGE;
-    const pixelGridSize =  isLarge ? IconSize.LARGE : IconSize.STANDARD;
-    const viewBox = `0 0 ${pixelGridSize} ${pixelGridSize}`;
-    const titleId = uniqueId("iconTitle");
-    const path = (
-        <path
-            d={
-                isLarge
-                    ? "M0 319.8V81.6L125.4 207L0 319.8zM378.2 340.4H21.8L200 180.6L378.2 340.4zM274.6 207.2L400 81.6V319.8L274.6 207.2zM210 149.2L210 149.2C207.4 146.8000000000001 203.8 145.4 200 145.4S192.6 146.8000000000001 190 149.2L190 149.2L147.8 187L21.2 60.4000000000001H378.8L252.2 187.0000000000001L210 149.2z"
-                    : "M0 258.8V61.2L98.8 160L0 258.8zM298.8 280H21.2L160 141.2L298.8 280zM170.6 109.4C167.8 106.6 164.2 105 160 105S152.2 106.6 149.4 109.4L120 138.8L21.2 40H298.8L200 138.8L170.6 109.4zM221.2 160L320 61.2V258.8L221.2 160z"
-            }
-            fillRule="evenodd"
-            transform="scale(0.05 0.05)"
-        />
-    );
-
-    if (tagName === null) {
-        return (
-            <svg
-                aria-labelledby={title ? titleId : undefined}
-                data-icon="envelope"
-                fill={color}
-                height={size}
-                ref={ref}
-                role="img"
-                viewBox={viewBox}
-                width={size}
-                {...svgProps}
-                {...htmlProps}
-            >
-                {title && <title id={titleId}>{title}</title>}
-                {path}
-            </svg>
-        );
-    } else {
-        return React.createElement(
-            tagName,
-            {
-                ...htmlProps,
-                "aria-hidden": title ? undefined : true,
-                className: classNames(Classes.ICON, `${Classes.ICON}-envelope`, className),
-                ref,
-                title: htmlTitle,
-            },
-            <svg fill={color} data-icon="envelope" width={size} height={size} role="img" viewBox={viewBox} {...svgProps}>
-                {title && <title>{title}</title>}
-                {path}
-            </svg>
-        );
-    }
+export const Envelope: React.FC<SVGIconProps> = React.forwardRef<any, SVGIconProps>((props, ref) => {
+    const translation = `${-1 * props.size! / 0.05 / 2}`;
+    return (
+        <SVGIconContainer iconName="envelope" ref={ref}  {...props}>
+            <path
+                d={
+                    props.size! < IconSize.LARGE
+                        ? "M0 258.8V61.2L98.8 160L0 258.8zM298.8 280H21.2L160 141.2L298.8 280zM170.6 109.4C167.8 106.6 164.2 105 160 105S152.2 106.6 149.4 109.4L120 138.8L21.2 40H298.8L200 138.8L170.6 109.4zM221.2 160L320 61.2V258.8L221.2 160z"
+                        : "M0 319.8V81.6L125.4 207L0 319.8zM378.2 340.4H21.8L200 180.6L378.2 340.4zM274.6 207.2L400 81.6V319.8L274.6 207.2zM210 149.2L210 149.2C207.4 146.8000000000001 203.8 145.4 200 145.4S192.6 146.8000000000001 190 149.2L190 149.2L147.8 187L21.2 60.4000000000001H378.8L252.2 187.0000000000001L210 149.2z"
+                }
+                fillRule="evenodd"
+                transform-origin="center"
+                transform={`scale(0.05, -0.05) translate(${translation}, ${translation})`}
+            />
+        </SVGIconContainer>
+   )
 });
+Envelope.defaultProps = {
+    size: IconSize.STANDARD,
+};
 Envelope.displayName = `Blueprint5.Icon.Envelope`;
 export default Envelope;

package/src/generated/components/equals.tsx

@@ -13,73 +13,30 @@
  * limitations under the License.
  */
 
-import classNames from "classnames";
 import * as React from "react";
 import type { SVGIconProps } from "../../svgIconProps";
-import { IconSize } from "../../iconSize";
-import * as Classes from "../../classes";
-import { uniqueId } from "../../jsUtils";
+import { IconSize } from "../../iconTypes";
+import { SVGIconContainer } from "../../svgIconContainer";
 
-export const Equals: React.FC<SVGIconProps> = React.forwardRef<any, SVGIconProps>(({
-    className,
-    color,
-    size = IconSize.STANDARD,
-    title,
-    htmlTitle,
-    svgProps,
-    tagName = "span",
-    ...htmlProps
-}, ref) => {
-    const isLarge = size >= IconSize.LARGE;
-    const pixelGridSize =  isLarge ? IconSize.LARGE : IconSize.STANDARD;
-    const viewBox = `0 0 ${pixelGridSize} ${pixelGridSize}`;
-    const titleId = uniqueId("iconTitle");
-    const path = (
-        <path
-            d={
-                isLarge
-                    ? "M80 260L320 260C331.0456940000001 260 340 251.045695 340 240C340 228.954305 331.0456940000001 220 320 220L80 220C68.954305 220 60 228.954305 60 240C60 251.045695 68.954305 260 80 260zM80 180L320 180C331.0456940000001 180 340 171.045694 340 160C340 148.954306 331.0456940000001 140 320 140L80 140C68.954305 140 60 148.954306 60 160C60 171.045694 68.954305 180 80 180z"
-                    : "M60 220L260 220C271.045694 220 280 211.045695 280 200C280 188.954305 271.045694 180 260 180L60 180C48.954305 180 40 188.954305 40 200C40 211.045695 48.954305 220 60 220zM60 140L260 140C271.045694 140 280 131.045695 280 120C280 108.954306 271.045694 100 260 100L60 100C48.954305 100 40 108.954306 40 120C40 131.045695 48.954305 140 60 140z"
-            }
-            fillRule="evenodd"
-            transform="scale(0.05 0.05)"
-        />
-    );
-
-    if (tagName === null) {
-        return (
-            <svg
-                aria-labelledby={title ? titleId : undefined}
-                data-icon="equals"
-                fill={color}
-                height={size}
-                ref={ref}
-                role="img"
-                viewBox={viewBox}
-                width={size}
-                {...svgProps}
-                {...htmlProps}
-            >
-                {title && <title id={titleId}>{title}</title>}
-                {path}
-            </svg>
-        );
-    } else {
-        return React.createElement(
-            tagName,
-            {
-                ...htmlProps,
-                "aria-hidden": title ? undefined : true,
-                className: classNames(Classes.ICON, `${Classes.ICON}-equals`, className),
-                ref,
-                title: htmlTitle,
-            },
-            <svg fill={color} data-icon="equals" width={size} height={size} role="img" viewBox={viewBox} {...svgProps}>
-                {title && <title>{title}</title>}
-                {path}
-            </svg>
-        );
-    }
+export const Equals: React.FC<SVGIconProps> = React.forwardRef<any, SVGIconProps>((props, ref) => {
+    const translation = `${-1 * props.size! / 0.05 / 2}`;
+    return (
+        <SVGIconContainer iconName="equals" ref={ref}  {...props}>
+            <path
+                d={
+                    props.size! < IconSize.LARGE
+                        ? "M60 220L260 220C271.045694 220 280 211.045695 280 200C280 188.954305 271.045694 180 260 180L60 180C48.954305 180 40 188.954305 40 200C40 211.045695 48.954305 220 60 220zM60 140L260 140C271.045694 140 280 131.045695 280 120C280 108.954306 271.045694 100 260 100L60 100C48.954305 100 40 108.954306 40 120C40 131.045695 48.954305 140 60 140z"
+                        : "M80 260L320 260C331.0456940000001 260 340 251.045695 340 240C340 228.954305 331.0456940000001 220 320 220L80 220C68.954305 220 60 228.954305 60 240C60 251.045695 68.954305 260 80 260zM80 180L320 180C331.0456940000001 180 340 171.045694 340 160C340 148.954306 331.0456940000001 140 320 140L80 140C68.954305 140 60 148.954306 60 160C60 171.045694 68.954305 180 80 180z"
+                }
+                fillRule="evenodd"
+                transform-origin="center"
+                transform={`scale(0.05, -0.05) translate(${translation}, ${translation})`}
+            />
+        </SVGIconContainer>
+   )
 });
+Equals.defaultProps = {
+    size: IconSize.STANDARD,
+};
 Equals.displayName = `Blueprint5.Icon.Equals`;
 export default Equals;