@central-icons-solid/square-outlined-radius-0-stroke-2 1.1.294 → 1.1.296

package/CentralIconBase.tsx

@@ -1,7 +1,11 @@
 import type { JSX } from "solid-js";
-export type CentralIconBaseProps = { size?: string | number; color?: string; ariaHidden?: boolean; ariaLabel?: string } & JSX.SvgSVGAttributes<SVGSVGElement>;
+export type CentralIconBaseProps = { size?: string | number; color?: string; ariaHidden?: boolean; ariaLabel?: string; mode?: "masked" | "raw"; maskId?: string } & JSX.SvgSVGAttributes<SVGSVGElement>;
+export function maskInner(raw: string, maskId: string, mode: "masked" | "raw" = "masked"): string {
+  if (mode === "raw" || !maskId) return raw;
+  return `<mask id="${maskId}" maskUnits="userSpaceOnUse" x="0" y="0" width="24" height="24"><rect width="24" height="24" fill="#000"/><g fill="none" style="color:#fff">${raw}</g></mask><rect width="24" height="24" fill="currentColor" mask="url(#${maskId})"/>`;
+}
 export function svgAttrs(props: CentralIconBaseProps) {
-  const { size = 24, color, ariaHidden = true, ariaLabel, ...rest } = props;
+  const { size = 24, color, ariaHidden = true, ariaLabel, mode, maskId, ...rest } = props;
   const dim = typeof size === "number" ? `${size}px` : size;
   return { ...rest, width: dim, height: dim, viewBox: "0 0 24 24", fill: "none",
     xmlns: "http://www.w3.org/2000/svg", role: ariaHidden ? undefined : "img",

package/Icon3d/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const Icon3d = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "3d, shaders" })} innerHTML={"<circle cx=\"12\" cy=\"12\" r=\"1.5\" fill=\"currentColor\"/><circle cx=\"12\" cy=\"16\" r=\"1.5\" fill=\"currentColor\"/><circle cx=\"8\" cy=\"8\" r=\"1\" fill=\"currentColor\"/><circle cx=\"4\" cy=\"12\" r=\"1\" fill=\"currentColor\"/><circle cx=\"20\" cy=\"12\" r=\"1\" fill=\"currentColor\"/><circle cx=\"12\" cy=\"4\" r=\"1\" fill=\"currentColor\"/><circle cx=\"12\" cy=\"20\" r=\"1\" fill=\"currentColor\"/><circle cx=\"8\" cy=\"4\" r=\"0.75\" fill=\"currentColor\"/><circle cx=\"16\" cy=\"4\" r=\"0.75\" fill=\"currentColor\"/><circle cx=\"4\" cy=\"4\" r=\"0.5\" fill=\"currentColor\"/><circle cx=\"20\" cy=\"4\" r=\"0.5\" fill=\"currentColor\"/><circle cx=\"4\" cy=\"8\" r=\"0.75\" fill=\"currentColor\"/><circle cx=\"20\" cy=\"8\" r=\"0.75\" fill=\"currentColor\"/><circle cx=\"4\" cy=\"16\" r=\"0.75\" fill=\"currentColor\"/><circle cx=\"20\" cy=\"16\" r=\"0.75\" fill=\"currentColor\"/><circle cx=\"4\" cy=\"20\" r=\"0.5\" fill=\"currentColor\"/><circle cx=\"20\" cy=\"20\" r=\"0.5\" fill=\"currentColor\"/><circle cx=\"12\" cy=\"8\" r=\"1.5\" fill=\"currentColor\"/><circle cx=\"16\" cy=\"8\" r=\"1\" fill=\"currentColor\"/><circle cx=\"16\" cy=\"12\" r=\"1.5\" fill=\"currentColor\"/><circle cx=\"8\" cy=\"12\" r=\"1.5\" fill=\"currentColor\"/><circle cx=\"16\" cy=\"16\" r=\"1\" fill=\"currentColor\"/><circle cx=\"16\" cy=\"20\" r=\"0.75\" fill=\"currentColor\"/><circle cx=\"8\" cy=\"16\" r=\"1\" fill=\"currentColor\"/><circle cx=\"8\" cy=\"20\" r=\"0.75\" fill=\"currentColor\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "3d, shaders" })} innerHTML={maskInner("<circle cx=\"12\" cy=\"12\" r=\"1.5\" fill=\"currentColor\"/><circle cx=\"12\" cy=\"16\" r=\"1.5\" fill=\"currentColor\"/><circle cx=\"8\" cy=\"8\" r=\"1\" fill=\"currentColor\"/><circle cx=\"4\" cy=\"12\" r=\"1\" fill=\"currentColor\"/><circle cx=\"20\" cy=\"12\" r=\"1\" fill=\"currentColor\"/><circle cx=\"12\" cy=\"4\" r=\"1\" fill=\"currentColor\"/><circle cx=\"12\" cy=\"20\" r=\"1\" fill=\"currentColor\"/><circle cx=\"8\" cy=\"4\" r=\"0.75\" fill=\"currentColor\"/><circle cx=\"16\" cy=\"4\" r=\"0.75\" fill=\"currentColor\"/><circle cx=\"4\" cy=\"4\" r=\"0.5\" fill=\"currentColor\"/><circle cx=\"20\" cy=\"4\" r=\"0.5\" fill=\"currentColor\"/><circle cx=\"4\" cy=\"8\" r=\"0.75\" fill=\"currentColor\"/><circle cx=\"20\" cy=\"8\" r=\"0.75\" fill=\"currentColor\"/><circle cx=\"4\" cy=\"16\" r=\"0.75\" fill=\"currentColor\"/><circle cx=\"20\" cy=\"16\" r=\"0.75\" fill=\"currentColor\"/><circle cx=\"4\" cy=\"20\" r=\"0.5\" fill=\"currentColor\"/><circle cx=\"20\" cy=\"20\" r=\"0.5\" fill=\"currentColor\"/><circle cx=\"12\" cy=\"8\" r=\"1.5\" fill=\"currentColor\"/><circle cx=\"16\" cy=\"8\" r=\"1\" fill=\"currentColor\"/><circle cx=\"16\" cy=\"12\" r=\"1.5\" fill=\"currentColor\"/><circle cx=\"8\" cy=\"12\" r=\"1.5\" fill=\"currentColor\"/><circle cx=\"16\" cy=\"16\" r=\"1\" fill=\"currentColor\"/><circle cx=\"16\" cy=\"20\" r=\"0.75\" fill=\"currentColor\"/><circle cx=\"8\" cy=\"16\" r=\"1\" fill=\"currentColor\"/><circle cx=\"8\" cy=\"20\" r=\"0.75\" fill=\"currentColor\"/>", "square-outlined-radius-0-stroke-2-Icon3d", props.mode)} />
 );
 
 export default Icon3d;

package/Icon3dBoxBottom/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const Icon3dBoxBottom = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "3d-box-bottom, shaders, model, room" })} innerHTML={"<path d=\"M12 2L20.6603 7V17L12 22L3.33975 17V7L12 2Z\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M12.0001 2V12M20.6604 17L12.0001 12M3.33984 17L12.0001 12\" stroke=\"currentColor\" stroke-width=\"2\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "3d-box-bottom, shaders, model, room" })} innerHTML={maskInner("<path d=\"M12 2L20.6603 7V17L12 22L3.33975 17V7L12 2Z\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M12.0001 2V12M20.6604 17L12.0001 12M3.33984 17L12.0001 12\" stroke=\"currentColor\" stroke-width=\"2\"/>", "square-outlined-radius-0-stroke-2-Icon3dBoxBottom", props.mode)} />
 );
 
 export default Icon3dBoxBottom;

package/Icon3dBoxTop/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const Icon3dBoxTop = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "3d-box-top, shaders, model, cube, ar" })} innerHTML={"<path d=\"M12.0001 2L20.6604 7V17L12.0001 22L3.33984 17V7L12.0001 2Z\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M20.6604 7L12.0001 12M12.0001 22V12M3.33984 7L12.0001 12\" stroke=\"currentColor\" stroke-width=\"2\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "3d-box-top, shaders, model, cube, ar" })} innerHTML={maskInner("<path d=\"M12.0001 2L20.6604 7V17L12.0001 22L3.33984 17V7L12.0001 2Z\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M20.6604 7L12.0001 12M12.0001 22V12M3.33984 7L12.0001 12\" stroke=\"currentColor\" stroke-width=\"2\"/>", "square-outlined-radius-0-stroke-2-Icon3dBoxTop", props.mode)} />
 );
 
 export default Icon3dBoxTop;

package/Icon3dPackage/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const Icon3dPackage = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "3d-package, box" })} innerHTML={"<path d=\"M12.0001 2L20.6604 7V17L12.0001 22L3.33984 17V7L12.0001 2Z\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M20.6604 7L12.0001 12M12.0001 21V12M3.33984 7L12.0001 12\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M7.67188 4.5L16.3321 9.5\" stroke=\"currentColor\" stroke-width=\"2\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "3d-package, box" })} innerHTML={maskInner("<path d=\"M12.0001 2L20.6604 7V17L12.0001 22L3.33984 17V7L12.0001 2Z\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M20.6604 7L12.0001 12M12.0001 21V12M3.33984 7L12.0001 12\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M7.67188 4.5L16.3321 9.5\" stroke=\"currentColor\" stroke-width=\"2\"/>", "square-outlined-radius-0-stroke-2-Icon3dPackage", props.mode)} />
 );
 
 export default Icon3dPackage;

package/Icon3dPackage2/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const Icon3dPackage2 = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "3d-package-2, box, delivery" })} innerHTML={"<path d=\"M12.0001 2L20.6604 7V17L12.0001 22L3.33984 17V7L12.0001 2Z\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M20.6604 7L12.0001 12M12.0001 21V12M3.33984 7L12.0001 12\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M17.332 8.92285V14.9219L15.332 16.0771V10.0771L7.17188 5.36621L8.17188 3.63379L17.332 8.92285Z\" fill=\"currentColor\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "3d-package-2, box, delivery" })} innerHTML={maskInner("<path d=\"M12.0001 2L20.6604 7V17L12.0001 22L3.33984 17V7L12.0001 2Z\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M20.6604 7L12.0001 12M12.0001 21V12M3.33984 7L12.0001 12\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M17.332 8.92285V14.9219L15.332 16.0771V10.0771L7.17188 5.36621L8.17188 3.63379L17.332 8.92285Z\" fill=\"currentColor\"/>", "square-outlined-radius-0-stroke-2-Icon3dPackage2", props.mode)} />
 );
 
 export default Icon3dPackage2;

package/Icon3dSphere/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const Icon3dSphere = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "3d-sphere" })} innerHTML={"<path d=\"M21 12C21 16.9706 16.9706 21 12 21C7.02944 21 3 16.9706 3 12C3 7.02944 7.02944 3 12 3C16.9706 3 21 7.02944 21 12Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"/><path d=\"M3.04492 12.301C3.49788 13.8165 7.33441 15 12.0002 15C16.64 15 20.4598 13.8297 20.9476 12.3263\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"/><path d=\"M11.4065 20.8239C10.0339 19.9975 9 16.361 9 12C9 7.40754 10.1466 3.61846 11.6278 3.0686\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "3d-sphere" })} innerHTML={maskInner("<path d=\"M21 12C21 16.9706 16.9706 21 12 21C7.02944 21 3 16.9706 3 12C3 7.02944 7.02944 3 12 3C16.9706 3 21 7.02944 21 12Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"/><path d=\"M3.04492 12.301C3.49788 13.8165 7.33441 15 12.0002 15C16.64 15 20.4598 13.8297 20.9476 12.3263\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"/><path d=\"M11.4065 20.8239C10.0339 19.9975 9 16.361 9 12C9 7.40754 10.1466 3.61846 11.6278 3.0686\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"/>", "square-outlined-radius-0-stroke-2-Icon3dSphere", props.mode)} />
 );
 
 export default Icon3dSphere;

package/Icon4k/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const Icon4k = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "4k" })} innerHTML={"<path d=\"M21 5H3V19H21V5Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M8.80664 15.5V14.3818H5.33984V12.7168L7.89844 8.4541H10.7598V12.7949H11.624V14.3818H10.7598V15.5H8.80664ZM7.03418 12.8779H8.86523V9.83594H8.82617L7.03418 12.8193V12.8779Z\" fill=\"currentColor\"/><path d=\"M12.4102 15.5V8.4541H14.4805V11.4424H14.5195L16.6973 8.4541H18.8701L16.5508 11.5791L18.9775 15.5H16.5703L15.0322 12.9072L14.4805 13.6543V15.5H12.4102Z\" fill=\"currentColor\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "4k" })} innerHTML={maskInner("<path d=\"M21 5H3V19H21V5Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M8.80664 15.5V14.3818H5.33984V12.7168L7.89844 8.4541H10.7598V12.7949H11.624V14.3818H10.7598V15.5H8.80664ZM7.03418 12.8779H8.86523V9.83594H8.82617L7.03418 12.8193V12.8779Z\" fill=\"currentColor\"/><path d=\"M12.4102 15.5V8.4541H14.4805V11.4424H14.5195L16.6973 8.4541H18.8701L16.5508 11.5791L18.9775 15.5H16.5703L15.0322 12.9072L14.4805 13.6543V15.5H12.4102Z\" fill=\"currentColor\"/>", "square-outlined-radius-0-stroke-2-Icon4k", props.mode)} />
 );
 
 export default Icon4k;

package/IconAddImage/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const IconAddImage = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "add-image, upload-image" })} innerHTML={"<path d=\"M20 11V4H4V20H11\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M14.5 11.5C15.6046 11.5 16.5 10.6046 16.5 9.5C16.5 8.39543 15.6046 7.5 14.5 7.5C13.3954 7.5 12.5 8.39543 12.5 9.5C12.5 10.6046 13.3954 11.5 14.5 11.5Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M4 16L8 12L11 15\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M14 18L22 18\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M18 14V22\" stroke=\"currentColor\" stroke-width=\"2\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "add-image, upload-image" })} innerHTML={maskInner("<path d=\"M20 11V4H4V20H11\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M14.5 11.5C15.6046 11.5 16.5 10.6046 16.5 9.5C16.5 8.39543 15.6046 7.5 14.5 7.5C13.3954 7.5 12.5 8.39543 12.5 9.5C12.5 10.6046 13.3954 11.5 14.5 11.5Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M4 16L8 12L11 15\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M14 18L22 18\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M18 14V22\" stroke=\"currentColor\" stroke-width=\"2\"/>", "square-outlined-radius-0-stroke-2-IconAddImage", props.mode)} />
 );
 
 export default IconAddImage;

package/IconAddKeyframe/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const IconAddKeyframe = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "add-keyframe, rhombus" })} innerHTML={"<path d=\"M12 2.5L2.5 12L12 21.5L21.5 12L12 2.5Z\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M12 9V15M9 12H15\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "add-keyframe, rhombus" })} innerHTML={maskInner("<path d=\"M12 2.5L2.5 12L12 21.5L21.5 12L12 2.5Z\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M12 9V15M9 12H15\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/>", "square-outlined-radius-0-stroke-2-IconAddKeyframe", props.mode)} />
 );
 
 export default IconAddKeyframe;

package/IconAddToBasket/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const IconAddToBasket = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "add-to-basket" })} innerHTML={"<path d=\"M9 19C9 19.5523 8.55228 20 8 20C7.44772 20 7 19.5523 7 19C7 18.4477 7.44772 18 8 18C8.55228 18 9 18.4477 9 19Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M18 19C18 19.5523 17.5523 20 17 20C16.4477 20 16 19.5523 16 19C16 18.4477 16.4477 18 17 18C17.5523 18 18 18.4477 18 19Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M21 6L19.5 15H6L4 3H2\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M10 7H13M13 7H16M13 7V4M13 7V10\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "add-to-basket" })} innerHTML={maskInner("<path d=\"M9 19C9 19.5523 8.55228 20 8 20C7.44772 20 7 19.5523 7 19C7 18.4477 7.44772 18 8 18C8.55228 18 9 18.4477 9 19Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M18 19C18 19.5523 17.5523 20 17 20C16.4477 20 16 19.5523 16 19C16 18.4477 16.4477 18 17 18C17.5523 18 18 18.4477 18 19Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/><path d=\"M21 6L19.5 15H6L4 3H2\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M10 7H13M13 7H16M13 7V4M13 7V10\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/>", "square-outlined-radius-0-stroke-2-IconAddToBasket", props.mode)} />
 );
 
 export default IconAddToBasket;

package/IconAddToBasket2/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const IconAddToBasket2 = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "add-to-basket-2" })} innerHTML={"<path d=\"M8.5 4L6.7 8.5M15.5 4L17.3 8.5M10 20H5L3 9H21L20.6364 12M17 15V18M17 18V21M17 18H14M17 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "add-to-basket-2" })} innerHTML={maskInner("<path d=\"M8.5 4L6.7 8.5M15.5 4L17.3 8.5M10 20H5L3 9H21L20.6364 12M17 15V18M17 18V21M17 18H14M17 18H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/>", "square-outlined-radius-0-stroke-2-IconAddToBasket2", props.mode)} />
 );
 
 export default IconAddToBasket2;

package/IconAdjustPhoto/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const IconAdjustPhoto = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "adjust-photo, tuning, settings" })} innerHTML={"<path d=\"M19 12C19 15.866 15.866 19 12 19C8.13401 19 5 15.866 5 12C5 8.13401 8.13401 5 12 5C15.866 5 19 8.13401 19 12Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M7.5 16.5L12 12\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M12 1.1001V1.1101\" stroke=\"currentColor\" stroke-width=\"2.2\" stroke-linecap=\"round\"/><path d=\"M1.10156 12V12.01\" stroke=\"currentColor\" stroke-width=\"2.2\" stroke-linecap=\"round\"/><path d=\"M22.8984 12V12.01\" stroke=\"currentColor\" stroke-width=\"2.2\" stroke-linecap=\"round\"/><path d=\"M19.6992 4.30005V4.31005M19.6992 4.30005V4.31005\" stroke=\"currentColor\" stroke-width=\"2.2\" stroke-linecap=\"round\"/><path d=\"M4.30078 4.30005V4.31005\" stroke=\"currentColor\" stroke-width=\"2.2\" stroke-linecap=\"round\"/><path d=\"M19.6992 19.7V19.71M19.6992 19.7V19.71\" stroke=\"currentColor\" stroke-width=\"2.2\" stroke-linecap=\"round\"/><path d=\"M4.30078 19.7V19.71\" stroke=\"currentColor\" stroke-width=\"2.2\" stroke-linecap=\"round\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "adjust-photo, tuning, settings" })} innerHTML={maskInner("<path d=\"M19 12C19 15.866 15.866 19 12 19C8.13401 19 5 15.866 5 12C5 8.13401 8.13401 5 12 5C15.866 5 19 8.13401 19 12Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M7.5 16.5L12 12\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M12 1.1001V1.1101\" stroke=\"currentColor\" stroke-width=\"2.2\" stroke-linecap=\"round\"/><path d=\"M1.10156 12V12.01\" stroke=\"currentColor\" stroke-width=\"2.2\" stroke-linecap=\"round\"/><path d=\"M22.8984 12V12.01\" stroke=\"currentColor\" stroke-width=\"2.2\" stroke-linecap=\"round\"/><path d=\"M19.6992 4.30005V4.31005M19.6992 4.30005V4.31005\" stroke=\"currentColor\" stroke-width=\"2.2\" stroke-linecap=\"round\"/><path d=\"M4.30078 4.30005V4.31005\" stroke=\"currentColor\" stroke-width=\"2.2\" stroke-linecap=\"round\"/><path d=\"M19.6992 19.7V19.71M19.6992 19.7V19.71\" stroke=\"currentColor\" stroke-width=\"2.2\" stroke-linecap=\"round\"/><path d=\"M4.30078 19.7V19.71\" stroke=\"currentColor\" stroke-width=\"2.2\" stroke-linecap=\"round\"/>", "square-outlined-radius-0-stroke-2-IconAdjustPhoto", props.mode)} />
 );
 
 export default IconAdjustPhoto;

package/IconAdobeAcrobat/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const IconAdobeAcrobat = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "adobe-acrobat" })} innerHTML={"<path d=\"M21.3654 14.4172C19.9038 12.8994 15.9127 13.5178 14.9571 13.6302C13.5518 12.2811 12.5961 10.6509 12.2589 10.0888C12.7648 8.57101 13.1021 7.05325 13.1583 5.42308C13.1583 4.01775 12.5961 2.5 11.0222 2.5C10.46 2.5 9.95413 2.83728 9.67306 3.28698C8.9985 4.46746 9.27957 6.8284 10.3476 9.24556C9.72927 10.9882 9.16714 12.6746 7.59318 15.6538C5.963 16.3284 2.53401 17.9024 2.25294 19.5888C2.14052 20.0947 2.30915 20.6006 2.70265 20.9941C3.09614 21.3314 3.60205 21.5 4.10797 21.5C6.18785 21.5 8.21152 18.6331 9.61685 16.216C10.7973 15.8225 12.6524 15.2604 14.5074 14.9231C16.6997 16.8343 18.6109 17.1154 19.6228 17.1154C20.9719 17.1154 21.4778 16.5533 21.6464 16.0473C21.9275 15.4852 21.7589 14.8669 21.3654 14.4172ZM19.96 15.3728C19.9038 15.7663 19.3979 16.1598 18.4985 15.9349C17.4305 15.6538 16.4748 15.1479 15.6316 14.4734C16.3624 14.3609 17.9926 14.1923 19.1731 14.4172C19.6228 14.5296 20.0725 14.8107 19.96 15.3728ZM10.5725 3.7929C10.6849 3.62426 10.8535 3.51183 11.0222 3.51183C11.5281 3.51183 11.6405 4.13018 11.6405 4.6361C11.5843 5.81657 11.3595 6.99704 10.966 8.1213C10.1228 5.87278 10.2914 4.29882 10.5725 3.7929ZM10.46 14.6982C10.9097 13.7988 11.5281 12.2249 11.7529 11.5503C12.2589 12.3935 13.1021 13.4053 13.5518 13.855C13.5518 13.9112 11.8092 14.2485 10.46 14.6982ZM7.14348 16.9467C5.85058 19.0828 4.50146 20.432 3.77069 20.432C3.65827 20.432 3.54584 20.3757 3.43342 20.3195C3.26478 20.2071 3.20856 20.0385 3.26478 19.8136C3.43342 19.0266 4.89495 17.9586 7.14348 16.9467Z\" fill=\"currentColor\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "adobe-acrobat" })} innerHTML={maskInner("<path d=\"M21.3654 14.4172C19.9038 12.8994 15.9127 13.5178 14.9571 13.6302C13.5518 12.2811 12.5961 10.6509 12.2589 10.0888C12.7648 8.57101 13.1021 7.05325 13.1583 5.42308C13.1583 4.01775 12.5961 2.5 11.0222 2.5C10.46 2.5 9.95413 2.83728 9.67306 3.28698C8.9985 4.46746 9.27957 6.8284 10.3476 9.24556C9.72927 10.9882 9.16714 12.6746 7.59318 15.6538C5.963 16.3284 2.53401 17.9024 2.25294 19.5888C2.14052 20.0947 2.30915 20.6006 2.70265 20.9941C3.09614 21.3314 3.60205 21.5 4.10797 21.5C6.18785 21.5 8.21152 18.6331 9.61685 16.216C10.7973 15.8225 12.6524 15.2604 14.5074 14.9231C16.6997 16.8343 18.6109 17.1154 19.6228 17.1154C20.9719 17.1154 21.4778 16.5533 21.6464 16.0473C21.9275 15.4852 21.7589 14.8669 21.3654 14.4172ZM19.96 15.3728C19.9038 15.7663 19.3979 16.1598 18.4985 15.9349C17.4305 15.6538 16.4748 15.1479 15.6316 14.4734C16.3624 14.3609 17.9926 14.1923 19.1731 14.4172C19.6228 14.5296 20.0725 14.8107 19.96 15.3728ZM10.5725 3.7929C10.6849 3.62426 10.8535 3.51183 11.0222 3.51183C11.5281 3.51183 11.6405 4.13018 11.6405 4.6361C11.5843 5.81657 11.3595 6.99704 10.966 8.1213C10.1228 5.87278 10.2914 4.29882 10.5725 3.7929ZM10.46 14.6982C10.9097 13.7988 11.5281 12.2249 11.7529 11.5503C12.2589 12.3935 13.1021 13.4053 13.5518 13.855C13.5518 13.9112 11.8092 14.2485 10.46 14.6982ZM7.14348 16.9467C5.85058 19.0828 4.50146 20.432 3.77069 20.432C3.65827 20.432 3.54584 20.3757 3.43342 20.3195C3.26478 20.2071 3.20856 20.0385 3.26478 19.8136C3.43342 19.0266 4.89495 17.9586 7.14348 16.9467Z\" fill=\"currentColor\"/>", "square-outlined-radius-0-stroke-2-IconAdobeAcrobat", props.mode)} />
 );
 
 export default IconAdobeAcrobat;

package/IconAffinity/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const IconAffinity = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "affinity" })} innerHTML={"<path d=\"M19.6157 6.52429C19.6157 3.88674 16.5606 2.75 12.6605 2.75C10.2882 2.75 7.60574 3.18911 5.11455 3.97485V9.13252C8.78581 6.45864 12.8647 5.31397 15.4921 5.31397C17.1442 5.31397 18.2652 5.77501 18.2652 6.60078C18.2652 10.0036 3.5 9.46437 3.5 16.817C3.5 19.6353 5.43794 21.25 8.1644 21.25C12.2884 21.25 15.4077 17.2423 17.7413 12.357L18.2141 12.5269C16.985 15.5123 14.4416 18.7856 13.9463 20.8899H19.2556V10.0035H18.0293C16.2493 13.8712 13.6411 17.4352 10.9329 17.4352C9.69652 17.4352 8.90999 16.6851 8.90999 15.7338C8.90999 11.6628 19.6157 10.8477 19.6157 6.52429Z\" fill=\"currentColor\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "affinity" })} innerHTML={maskInner("<path d=\"M19.6157 6.52429C19.6157 3.88674 16.5606 2.75 12.6605 2.75C10.2882 2.75 7.60574 3.18911 5.11455 3.97485V9.13252C8.78581 6.45864 12.8647 5.31397 15.4921 5.31397C17.1442 5.31397 18.2652 5.77501 18.2652 6.60078C18.2652 10.0036 3.5 9.46437 3.5 16.817C3.5 19.6353 5.43794 21.25 8.1644 21.25C12.2884 21.25 15.4077 17.2423 17.7413 12.357L18.2141 12.5269C16.985 15.5123 14.4416 18.7856 13.9463 20.8899H19.2556V10.0035H18.0293C16.2493 13.8712 13.6411 17.4352 10.9329 17.4352C9.69652 17.4352 8.90999 16.6851 8.90999 15.7338C8.90999 11.6628 19.6157 10.8477 19.6157 6.52429Z\" fill=\"currentColor\"/>", "square-outlined-radius-0-stroke-2-IconAffinity", props.mode)} />
 );
 
 export default IconAffinity;

package/IconAgent/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const IconAgent = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "agent, flow, diagram, org" })} innerHTML={"<circle cx=\"12\" cy=\"6\" r=\"2.5\" stroke=\"currentColor\" stroke-width=\"2\"/><circle cx=\"6\" cy=\"18\" r=\"2.5\" stroke=\"currentColor\" stroke-width=\"2\"/><circle cx=\"18\" cy=\"18\" r=\"2.5\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M12 8.5V12M12 12H6V15.5M12 12H18V15.5\" stroke=\"currentColor\" stroke-width=\"2\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "agent, flow, diagram, org" })} innerHTML={maskInner("<circle cx=\"12\" cy=\"6\" r=\"2.5\" stroke=\"currentColor\" stroke-width=\"2\"/><circle cx=\"6\" cy=\"18\" r=\"2.5\" stroke=\"currentColor\" stroke-width=\"2\"/><circle cx=\"18\" cy=\"18\" r=\"2.5\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M12 8.5V12M12 12H6V15.5M12 12H18V15.5\" stroke=\"currentColor\" stroke-width=\"2\"/>", "square-outlined-radius-0-stroke-2-IconAgent", props.mode)} />
 );
 
 export default IconAgent;

package/IconAgentNetwork/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const IconAgentNetwork = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "agent-network, connections, atoms" })} innerHTML={"<circle cx=\"18.5\" cy=\"7.5\" r=\"2.5\" stroke=\"currentColor\" stroke-width=\"2\"/><circle cx=\"5.5\" cy=\"16.5\" r=\"2.5\" stroke=\"currentColor\" stroke-width=\"2\"/><circle cx=\"8.5\" cy=\"6.5\" r=\"3.5\" stroke=\"currentColor\" stroke-width=\"2\"/><circle cx=\"15.5\" cy=\"17.5\" r=\"3.5\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M12 6.8501L16 7.2501M17.75 10.0001L16.55 14.0001M13.5 14.3572L12 12.0001L10.4091 9.5001M6.25 14.0001L7.45 10.0001M8 16.7501L12 17.1501\" stroke=\"currentColor\" stroke-width=\"2\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "agent-network, connections, atoms" })} innerHTML={maskInner("<circle cx=\"18.5\" cy=\"7.5\" r=\"2.5\" stroke=\"currentColor\" stroke-width=\"2\"/><circle cx=\"5.5\" cy=\"16.5\" r=\"2.5\" stroke=\"currentColor\" stroke-width=\"2\"/><circle cx=\"8.5\" cy=\"6.5\" r=\"3.5\" stroke=\"currentColor\" stroke-width=\"2\"/><circle cx=\"15.5\" cy=\"17.5\" r=\"3.5\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M12 6.8501L16 7.2501M17.75 10.0001L16.55 14.0001M13.5 14.3572L12 12.0001L10.4091 9.5001M6.25 14.0001L7.45 10.0001M8 16.7501L12 17.1501\" stroke=\"currentColor\" stroke-width=\"2\"/>", "square-outlined-radius-0-stroke-2-IconAgentNetwork", props.mode)} />
 );
 
 export default IconAgentNetwork;

package/IconAgenticCoding/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const IconAgenticCoding = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "agentic-coding, ai-code, vibe-code" })} innerHTML={"<path d=\"M4 6H12\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M16 6L20 6\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M4 12H5\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M9 12H12\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M4 18H9\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M18.5 11H17.5L16.25 14.25L13 15.5V16.5L16.25 17.75L17.5 21H18.5L19.75 17.75L23 16.5V15.5L19.75 14.25L18.5 11Z\" fill=\"currentColor\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "agentic-coding, ai-code, vibe-code" })} innerHTML={maskInner("<path d=\"M4 6H12\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M16 6L20 6\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M4 12H5\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M9 12H12\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M4 18H9\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M18.5 11H17.5L16.25 14.25L13 15.5V16.5L16.25 17.75L17.5 21H18.5L19.75 17.75L23 16.5V15.5L19.75 14.25L18.5 11Z\" fill=\"currentColor\"/>", "square-outlined-radius-0-stroke-2-IconAgenticCoding", props.mode)} />
 );
 
 export default IconAgenticCoding;

package/IconAgents/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const IconAgents = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "agents, connections, flow, roadmap" })} innerHTML={"<circle cx=\"18\" cy=\"19\" r=\"2\" stroke=\"currentColor\" stroke-width=\"2\"/><circle cx=\"6\" cy=\"5\" r=\"2\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M9 12L12 9L15 12L12 15L9 12Z\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M8 5H16.5C18.433 5 20 6.567 20 8.5C20 10.433 18.433 12 16.5 12H15\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M9 12H7.5C5.567 12 4 13.567 4 15.5C4 17.433 5.567 19 7.5 19H16\" stroke=\"currentColor\" stroke-width=\"2\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "agents, connections, flow, roadmap" })} innerHTML={maskInner("<circle cx=\"18\" cy=\"19\" r=\"2\" stroke=\"currentColor\" stroke-width=\"2\"/><circle cx=\"6\" cy=\"5\" r=\"2\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M9 12L12 9L15 12L12 15L9 12Z\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M8 5H16.5C18.433 5 20 6.567 20 8.5C20 10.433 18.433 12 16.5 12H15\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M9 12H7.5C5.567 12 4 13.567 4 15.5C4 17.433 5.567 19 7.5 19H16\" stroke=\"currentColor\" stroke-width=\"2\"/>", "square-outlined-radius-0-stroke-2-IconAgents", props.mode)} />
 );
 
 export default IconAgents;

package/IconAiSlop/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const IconAiSlop = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "ai-slop, trash" })} innerHTML={"<path d=\"M3 7H21\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linejoin=\"round\"/><path d=\"M8 7L9 3H15L16 7\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"/><path d=\"M17.9999 14L17.4999 21H6.49986L6.07129 15\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M5 7V13.25C5 14.2165 5.7835 15 6.75 15C7.7165 15 8.5 14.2165 8.5 13.25V10.5\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M15.5 11V12.25C15.5 13.2165 16.2835 14 17.25 14C18.2165 14 19 13.2165 19 12.25V7.5\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M15.5 11V14.25C15.5 15.2165 14.7165 16 13.75 16C12.7835 16 12 15.2165 12 14.25V9.5\" stroke=\"currentColor\" stroke-width=\"2\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "ai-slop, trash" })} innerHTML={maskInner("<path d=\"M3 7H21\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linejoin=\"round\"/><path d=\"M8 7L9 3H15L16 7\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"/><path d=\"M17.9999 14L17.4999 21H6.49986L6.07129 15\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M5 7V13.25C5 14.2165 5.7835 15 6.75 15C7.7165 15 8.5 14.2165 8.5 13.25V10.5\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M15.5 11V12.25C15.5 13.2165 16.2835 14 17.25 14C18.2165 14 19 13.2165 19 12.25V7.5\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M15.5 11V14.25C15.5 15.2165 14.7165 16 13.75 16C12.7835 16 12 15.2165 12 14.25V9.5\" stroke=\"currentColor\" stroke-width=\"2\"/>", "square-outlined-radius-0-stroke-2-IconAiSlop", props.mode)} />
 );
 
 export default IconAiSlop;

package/IconAiTokens/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const IconAiTokens = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "ai-tokens, credits" })} innerHTML={"<circle cx=\"12\" cy=\"12\" r=\"9\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M12.5 6.84863H11.5L10.25 10.0986L7 11.3486V12.3486L10.25 13.5986L11.5 16.8486H12.5L13.75 13.5986L17 12.3486V11.3486L13.75 10.0986L12.5 6.84863Z\" fill=\"currentColor\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "ai-tokens, credits" })} innerHTML={maskInner("<circle cx=\"12\" cy=\"12\" r=\"9\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M12.5 6.84863H11.5L10.25 10.0986L7 11.3486V12.3486L10.25 13.5986L11.5 16.8486H12.5L13.75 13.5986L17 12.3486V11.3486L13.75 10.0986L12.5 6.84863Z\" fill=\"currentColor\"/>", "square-outlined-radius-0-stroke-2-IconAiTokens", props.mode)} />
 );
 
 export default IconAiTokens;

package/IconAiTranslate/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const IconAiTranslate = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "ai-translate,language, auto-translate" })} innerHTML={"<path d=\"M3 7L11 7\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M7 7V5\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M10.9998 15.0001C7.11309 14.0284 5.1147 11.6405 4.5459 7.37769\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M3.0001 15C6.88484 14.0288 8.88317 11.6428 9.45312 7.38403\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M12 20L15.75 12H16.25L20 20M13.5 18H18.5\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M17.85 2H17.15L16.275 4.275L14 5.15V5.85L16.275 6.725L17.15 9H17.85L18.725 6.725L21 5.85V5.15L18.725 4.275L17.85 2Z\" fill=\"currentColor\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "ai-translate,language, auto-translate" })} innerHTML={maskInner("<path d=\"M3 7L11 7\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M7 7V5\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M10.9998 15.0001C7.11309 14.0284 5.1147 11.6405 4.5459 7.37769\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M3.0001 15C6.88484 14.0288 8.88317 11.6428 9.45312 7.38403\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M12 20L15.75 12H16.25L20 20M13.5 18H18.5\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M17.85 2H17.15L16.275 4.275L14 5.15V5.85L16.275 6.725L17.15 9H17.85L18.725 6.725L21 5.85V5.15L18.725 4.275L17.85 2Z\" fill=\"currentColor\"/>", "square-outlined-radius-0-stroke-2-IconAiTranslate", props.mode)} />
 );
 
 export default IconAiTranslate;

package/IconAirdrop/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const IconAirdrop = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "airdrop, file-sharing, radar" })} innerHTML={"<path d=\"M13 12C13 12.5523 12.5523 13 12 13C11.4477 13 11 12.5523 11 12C11 11.4477 11.4477 11 12 11C12.5523 11 13 11.4477 13 12Z\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M16.5006 19.7956C19.1904 18.2394 21 15.331 21 12C21 7.02944 16.9706 3 12 3C7.02944 3 3 7.02944 3 12C3 15.331 4.80962 18.2394 7.4994 19.7956\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M14.5003 16.3309C15.9947 15.4663 17 13.8506 17 12C17 9.23858 14.7614 7 12 7C9.23858 7 7 9.23858 7 12C7 13.8506 8.00535 15.4663 9.49968 16.3309\" stroke=\"currentColor\" stroke-width=\"2\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "airdrop, file-sharing, radar" })} innerHTML={maskInner("<path d=\"M13 12C13 12.5523 12.5523 13 12 13C11.4477 13 11 12.5523 11 12C11 11.4477 11.4477 11 12 11C12.5523 11 13 11.4477 13 12Z\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M16.5006 19.7956C19.1904 18.2394 21 15.331 21 12C21 7.02944 16.9706 3 12 3C7.02944 3 3 7.02944 3 12C3 15.331 4.80962 18.2394 7.4994 19.7956\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M14.5003 16.3309C15.9947 15.4663 17 13.8506 17 12C17 9.23858 14.7614 7 12 7C9.23858 7 7 9.23858 7 12C7 13.8506 8.00535 15.4663 9.49968 16.3309\" stroke=\"currentColor\" stroke-width=\"2\"/>", "square-outlined-radius-0-stroke-2-IconAirdrop", props.mode)} />
 );
 
 export default IconAirdrop;

package/IconAirdrop2/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const IconAirdrop2 = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "airdrop-2, free, drop, parachute" })} innerHTML={"<path d=\"M4 11L11 16.5M13 16.5L20 11\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M8 21V17H16V21H8Z\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M12 3C7.58172 3 4 6.58172 4 11C4 11 8.86971 10.5 12 10.5C15.1303 10.5 20 11 20 11C20 6.58172 16.4183 3 12 3Z\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M12 11V16\" stroke=\"currentColor\" stroke-width=\"2\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "airdrop-2, free, drop, parachute" })} innerHTML={maskInner("<path d=\"M4 11L11 16.5M13 16.5L20 11\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M8 21V17H16V21H8Z\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M12 3C7.58172 3 4 6.58172 4 11C4 11 8.86971 10.5 12 10.5C15.1303 10.5 20 11 20 11C20 6.58172 16.4183 3 12 3Z\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M12 11V16\" stroke=\"currentColor\" stroke-width=\"2\"/>", "square-outlined-radius-0-stroke-2-IconAirdrop2", props.mode)} />
 );
 
 export default IconAirdrop2;

package/IconAirplane/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const IconAirplane = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "airplane, flight" })} innerHTML={"<path d=\"M16.3284 4.17157L13.5 7L5 4L3 6L9.5 11L7.5 13H5.5L3 15.5L7 17L8.5 21L11 18.5V16.5L13 14.5L18 21L20 19L17 10.5L19.8284 7.67157C20.5786 6.92143 21 5.90401 21 4.84315V3H19.1569C18.096 3 17.0786 3.42143 16.3284 4.17157Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "airplane, flight" })} innerHTML={maskInner("<path d=\"M16.3284 4.17157L13.5 7L5 4L3 6L9.5 11L7.5 13H5.5L3 15.5L7 17L8.5 21L11 18.5V16.5L13 14.5L18 21L20 19L17 10.5L19.8284 7.67157C20.5786 6.92143 21 5.90401 21 4.84315V3H19.1569C18.096 3 17.0786 3.42143 16.3284 4.17157Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"/>", "square-outlined-radius-0-stroke-2-IconAirplane", props.mode)} />
 );
 
 export default IconAirplane;

package/IconAirplaneDown/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const IconAirplaneDown = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "airplane-down, landing" })} innerHTML={"<path d=\"M3 19H21\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M6.53876 3.43706L4.07745 3L4.37583 7.09403L3.21977 7.89901L3.03264 8.92687C2.83195 10.0292 3.57798 11.0809 4.68621 11.2579L8.48719 11.8651L7.33311 14.2255L10.2867 14.75L14.253 12.889L18.6978 13.6783C19.5098 13.8224 20.3252 13.4436 20.7375 12.7307C21.1876 11.9524 21.0484 10.9681 20.4002 10.3446L18.9565 8.95607C18.6657 8.6763 18.2979 8.49108 17.8995 8.42422C16.2059 8.13994 11.4395 7.33808 9.40771 6.97729C8.82334 6.87352 8.31438 6.51679 8.01849 6.00359L6.53876 3.43706Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "airplane-down, landing" })} innerHTML={maskInner("<path d=\"M3 19H21\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M6.53876 3.43706L4.07745 3L4.37583 7.09403L3.21977 7.89901L3.03264 8.92687C2.83195 10.0292 3.57798 11.0809 4.68621 11.2579L8.48719 11.8651L7.33311 14.2255L10.2867 14.75L14.253 12.889L18.6978 13.6783C19.5098 13.8224 20.3252 13.4436 20.7375 12.7307C21.1876 11.9524 21.0484 10.9681 20.4002 10.3446L18.9565 8.95607C18.6657 8.6763 18.2979 8.49108 17.8995 8.42422C16.2059 8.13994 11.4395 7.33808 9.40771 6.97729C8.82334 6.87352 8.31438 6.51679 8.01849 6.00359L6.53876 3.43706Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"/>", "square-outlined-radius-0-stroke-2-IconAirplaneDown", props.mode)} />
 );
 
 export default IconAirplaneDown;

package/IconAirplaneUp/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const IconAirplaneUp = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "airplane-up, takeoff" })} innerHTML={"<path d=\"M4.34784 6.56821L2 7.41875L4.3064 10.8175L3.70909 12.0924L4.06146 13.0766C4.43936 14.1321 5.61088 14.6708 6.65815 14.2707L10.25 12.8986L10.4326 15.5204L13.25 14.4997L15.75 10.9061L19.9899 9.37013C20.7644 9.08956 21.2803 8.35404 21.2803 7.53031C21.2803 6.6311 20.6674 5.84763 19.7947 5.63108L17.8511 5.14884C17.4596 5.05168 17.0487 5.07486 16.6707 5.21586C15.0634 5.8154 10.539 7.50106 8.60086 8.20317C8.04343 8.40511 7.42468 8.35018 6.91195 8.05323L4.34784 6.56821Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M3 19H21\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "airplane-up, takeoff" })} innerHTML={maskInner("<path d=\"M4.34784 6.56821L2 7.41875L4.3064 10.8175L3.70909 12.0924L4.06146 13.0766C4.43936 14.1321 5.61088 14.6708 6.65815 14.2707L10.25 12.8986L10.4326 15.5204L13.25 14.4997L15.75 10.9061L19.9899 9.37013C20.7644 9.08956 21.2803 8.35404 21.2803 7.53031C21.2803 6.6311 20.6674 5.84763 19.7947 5.63108L17.8511 5.14884C17.4596 5.05168 17.0487 5.07486 16.6707 5.21586C15.0634 5.8154 10.539 7.50106 8.60086 8.20317C8.04343 8.40511 7.42468 8.35018 6.91195 8.05323L4.34784 6.56821Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M3 19H21\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/>", "square-outlined-radius-0-stroke-2-IconAirplaneUp", props.mode)} />
 );
 
 export default IconAirplaneUp;

package/IconAirplay/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const IconAirplay = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "airplay" })} innerHTML={"<path d=\"M3 17H2V18H3V17ZM5.5 18H6.5V16H5.5V18ZM3 4V3H2V4H3ZM21 4H22V3H21V4ZM21 17V18H22V17H21ZM18.5 16H17.5V18H18.5V16ZM3 17V18H5.5V17V16H3V17ZM3 17H4V4H3H2V17H3ZM3 4V5H21V4V3H3V4ZM21 4H20V17H21H22V4H21ZM21 17V16H18.5V17V18H21V17Z\" fill=\"currentColor\"/><path d=\"M12 15L12.7809 14.3753L12 13.3992L11.2191 14.3753L12 15ZM8 20L7.21913 19.3753L5.91938 21H8V20ZM16 20V21H18.0806L16.7809 19.3753L16 20ZM12 15L11.2191 14.3753L7.21913 19.3753L8 20L8.78087 20.6247L12.7809 15.6247L12 15ZM8 20V21H16V20V19H8V20ZM16 20L16.7809 19.3753L12.7809 14.3753L12 15L11.2191 15.6247L15.2191 20.6247L16 20Z\" fill=\"currentColor\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "airplay" })} innerHTML={maskInner("<path d=\"M3 17H2V18H3V17ZM5.5 18H6.5V16H5.5V18ZM3 4V3H2V4H3ZM21 4H22V3H21V4ZM21 17V18H22V17H21ZM18.5 16H17.5V18H18.5V16ZM3 17V18H5.5V17V16H3V17ZM3 17H4V4H3H2V17H3ZM3 4V5H21V4V3H3V4ZM21 4H20V17H21H22V4H21ZM21 17V16H18.5V17V18H21V17Z\" fill=\"currentColor\"/><path d=\"M12 15L12.7809 14.3753L12 13.3992L11.2191 14.3753L12 15ZM8 20L7.21913 19.3753L5.91938 21H8V20ZM16 20V21H18.0806L16.7809 19.3753L16 20ZM12 15L11.2191 14.3753L7.21913 19.3753L8 20L8.78087 20.6247L12.7809 15.6247L12 15ZM8 20V21H16V20V19H8V20ZM16 20L16.7809 19.3753L12.7809 14.3753L12 15L11.2191 15.6247L15.2191 20.6247L16 20Z\" fill=\"currentColor\"/>", "square-outlined-radius-0-stroke-2-IconAirplay", props.mode)} />
 );
 
 export default IconAirplay;

package/IconAirplayAudio/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const IconAirplayAudio = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "airplay-audio, audio-stream" })} innerHTML={"<path d=\"M8 20L12 15L16 20H8Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"/><path d=\"M19.0715 4.92893C15.1663 1.02369 8.83418 1.02369 4.92893 4.92893C1.14851 8.70935 1.02768 14.764 4.56643 18.6898L5.83669 17.102C3.22906 13.959 3.39783 9.28816 6.34299 6.34299C9.46719 3.2188 14.5333 3.2188 17.6574 6.34299L17.9407 6.64182C20.6103 9.59648 20.6849 14.0632 18.1638 17.102L19.434 18.6898C22.8586 14.8907 22.8558 9.09798 19.426 5.30198L19.0715 4.92893Z\" fill=\"currentColor\"/><path d=\"M16.8782 15.4951C18.5082 13.2245 18.3619 10.0733 16.4377 7.96214L16.2424 7.75803C13.9725 5.48809 10.337 5.41704 7.98167 7.54514L7.75803 7.75803C5.65022 9.86585 5.43879 13.15 7.12224 15.4951L8.44672 13.8395C7.66675 12.3337 7.90908 10.4351 9.1721 9.1721L9.32151 9.02952C10.8917 7.61125 13.3152 7.65897 14.8283 9.1721L14.9582 9.30784C16.1073 10.5683 16.3062 12.3868 15.5537 13.8395L16.8782 15.4951Z\" fill=\"currentColor\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "airplay-audio, audio-stream" })} innerHTML={maskInner("<path d=\"M8 20L12 15L16 20H8Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"/><path d=\"M19.0715 4.92893C15.1663 1.02369 8.83418 1.02369 4.92893 4.92893C1.14851 8.70935 1.02768 14.764 4.56643 18.6898L5.83669 17.102C3.22906 13.959 3.39783 9.28816 6.34299 6.34299C9.46719 3.2188 14.5333 3.2188 17.6574 6.34299L17.9407 6.64182C20.6103 9.59648 20.6849 14.0632 18.1638 17.102L19.434 18.6898C22.8586 14.8907 22.8558 9.09798 19.426 5.30198L19.0715 4.92893Z\" fill=\"currentColor\"/><path d=\"M16.8782 15.4951C18.5082 13.2245 18.3619 10.0733 16.4377 7.96214L16.2424 7.75803C13.9725 5.48809 10.337 5.41704 7.98167 7.54514L7.75803 7.75803C5.65022 9.86585 5.43879 13.15 7.12224 15.4951L8.44672 13.8395C7.66675 12.3337 7.90908 10.4351 9.1721 9.1721L9.32151 9.02952C10.8917 7.61125 13.3152 7.65897 14.8283 9.1721L14.9582 9.30784C16.1073 10.5683 16.3062 12.3868 15.5537 13.8395L16.8782 15.4951Z\" fill=\"currentColor\"/>", "square-outlined-radius-0-stroke-2-IconAirplayAudio", props.mode)} />
 );
 
 export default IconAirplayAudio;

package/IconAirpodCase/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const IconAirpodCase = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "airpod-case, airpods" })} innerHTML={"<path d=\"M16.5 20H7.5C5.567 20 4 18.433 4 16.5V10V7.5C4 5.567 5.567 4 7.5 4H16.5C18.433 4 20 5.567 20 7.5V10V16.5C20 18.433 18.433 20 16.5 20Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\" stroke-linejoin=\"round\"/><path d=\"M20 10H4\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\" stroke-linejoin=\"round\"/><path d=\"M12 13.375C12.4832 13.375 12.875 13.7668 12.875 14.25C12.875 14.7332 12.4832 15.125 12 15.125C11.5168 15.125 11.125 14.7332 11.125 14.25C11.125 13.7668 11.5168 13.375 12 13.375Z\" fill=\"currentColor\" stroke=\"currentColor\" stroke-width=\"0.75\" stroke-linecap=\"square\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "airpod-case, airpods" })} innerHTML={maskInner("<path d=\"M16.5 20H7.5C5.567 20 4 18.433 4 16.5V10V7.5C4 5.567 5.567 4 7.5 4H16.5C18.433 4 20 5.567 20 7.5V10V16.5C20 18.433 18.433 20 16.5 20Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\" stroke-linejoin=\"round\"/><path d=\"M20 10H4\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\" stroke-linejoin=\"round\"/><path d=\"M12 13.375C12.4832 13.375 12.875 13.7668 12.875 14.25C12.875 14.7332 12.4832 15.125 12 15.125C11.5168 15.125 11.125 14.7332 11.125 14.25C11.125 13.7668 11.5168 13.375 12 13.375Z\" fill=\"currentColor\" stroke=\"currentColor\" stroke-width=\"0.75\" stroke-linecap=\"square\"/>", "square-outlined-radius-0-stroke-2-IconAirpodCase", props.mode)} />
 );
 
 export default IconAirpodCase;

package/IconAirpodLeft/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const IconAirpodLeft = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "airpod-left" })} innerHTML={"<path d=\"M8 12.7439V20H5L5 8.5C5 6.01472 7.01472 4 9.5 4C10.4251 4 11.285 4.27914 12 4.75777V12.2422C11.285 12.7209 10.4251 13 9.5 13C8.97405 13 8.46917 12.9098 8 12.7439ZM8 12.7439V11\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M16 13V20H20\" stroke=\"currentColor\" stroke-width=\"2\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "airpod-left" })} innerHTML={maskInner("<path d=\"M8 12.7439V20H5L5 8.5C5 6.01472 7.01472 4 9.5 4C10.4251 4 11.285 4.27914 12 4.75777V12.2422C11.285 12.7209 10.4251 13 9.5 13C8.97405 13 8.46917 12.9098 8 12.7439ZM8 12.7439V11\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M16 13V20H20\" stroke=\"currentColor\" stroke-width=\"2\"/>", "square-outlined-radius-0-stroke-2-IconAirpodLeft", props.mode)} />
 );
 
 export default IconAirpodLeft;

package/IconAirpodRight/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const IconAirpodRight = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "airpod-right" })} innerHTML={"<path d=\"M16 12.7439V20H19L19 8.5C19 6.01472 16.9853 4 14.5 4C13.5749 4 12.715 4.27914 12 4.75777V12.2422C12.715 12.7209 13.5749 13 14.5 13C15.026 13 15.5308 12.9098 16 12.7439ZM16 12.7439V11\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M5 21V14H7.25C8.2165 14 9 14.7835 9 15.75V15.75C9 16.7165 8.2165 17.5 7.25 17.5H5.5\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M9.00175 21.0001V20.5001C9.00175 18.879 8.61316 17.502 6.38281 17.502\" stroke=\"currentColor\" stroke-width=\"2\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "airpod-right" })} innerHTML={maskInner("<path d=\"M16 12.7439V20H19L19 8.5C19 6.01472 16.9853 4 14.5 4C13.5749 4 12.715 4.27914 12 4.75777V12.2422C12.715 12.7209 13.5749 13 14.5 13C15.026 13 15.5308 12.9098 16 12.7439ZM16 12.7439V11\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M5 21V14H7.25C8.2165 14 9 14.7835 9 15.75V15.75C9 16.7165 8.2165 17.5 7.25 17.5H5.5\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M9.00175 21.0001V20.5001C9.00175 18.879 8.61316 17.502 6.38281 17.502\" stroke=\"currentColor\" stroke-width=\"2\"/>", "square-outlined-radius-0-stroke-2-IconAirpodRight", props.mode)} />
 );
 
 export default IconAirpodRight;

package/IconAirpods/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const IconAirpods = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "airpods, headphones, vibe" })} innerHTML={"<path d=\"M7 12.7439V20H10L10 8.5C10 6.01472 7.98528 4 5.5 4C4.57493 4 3.71505 4.27914 3 4.75777V12.2422C3.71505 12.7209 4.57493 13 5.5 13C6.02595 13 6.53083 12.9098 7 12.7439ZM7 12.7439V11\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M17 12.7439V20H14L14 8.5C14 6.01472 16.0147 4 18.5 4C19.4251 4 20.285 4.27914 21 4.75777V12.2422C20.285 12.7209 19.4251 13 18.5 13C17.974 13 17.4692 12.9098 17 12.7439ZM17 12.7439V11\" stroke=\"currentColor\" stroke-width=\"2\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "airpods, headphones, vibe" })} innerHTML={maskInner("<path d=\"M7 12.7439V20H10L10 8.5C10 6.01472 7.98528 4 5.5 4C4.57493 4 3.71505 4.27914 3 4.75777V12.2422C3.71505 12.7209 4.57493 13 5.5 13C6.02595 13 6.53083 12.9098 7 12.7439ZM7 12.7439V11\" stroke=\"currentColor\" stroke-width=\"2\"/><path d=\"M17 12.7439V20H14L14 8.5C14 6.01472 16.0147 4 18.5 4C19.4251 4 20.285 4.27914 21 4.75777V12.2422C20.285 12.7209 19.4251 13 18.5 13C17.974 13 17.4692 12.9098 17 12.7439ZM17 12.7439V11\" stroke=\"currentColor\" stroke-width=\"2\"/>", "square-outlined-radius-0-stroke-2-IconAirpods", props.mode)} />
 );
 
 export default IconAirpods;

package/IconAlbums/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const IconAlbums = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "albums, cover" })} innerHTML={"<path d=\"M4 6V18\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M8 5V19\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M12 20V4L20 5.5V18.5L12 20Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "albums, cover" })} innerHTML={maskInner("<path d=\"M4 6V18\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M8 5V19\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M12 20V4L20 5.5V18.5L12 20Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/>", "square-outlined-radius-0-stroke-2-IconAlbums", props.mode)} />
 );
 
 export default IconAlbums;

package/IconAlbums2/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const IconAlbums2 = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "albums-2, cover" })} innerHTML={"<path d=\"M18 4H6\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M19 8H5\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M4 12H20L18.5 20H5.5L4 12Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "albums-2, cover" })} innerHTML={maskInner("<path d=\"M18 4H6\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M19 8H5\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M4 12H20L18.5 20H5.5L4 12Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/>", "square-outlined-radius-0-stroke-2-IconAlbums2", props.mode)} />
 );
 
 export default IconAlbums2;

package/IconAlien/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const IconAlien = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "alien" })} innerHTML={"<path d=\"M20 11C20 17 14 22 12 22C10 22 4 17 4 11C4 6.58172 7.58172 3 12 3C16.4183 3 20 6.58172 20 11Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M7.5 11.0086C8.96473 10.9201 9.88847 11.5134 10 12.9944C8.56755 13.0583 7.55498 12.5838 7.5 11.0086Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M16.5 11.0086C15.0353 10.9201 14.1115 11.5134 14 12.9944C15.4325 13.0583 16.445 12.5838 16.5 11.0086Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "alien" })} innerHTML={maskInner("<path d=\"M20 11C20 17 14 22 12 22C10 22 4 17 4 11C4 6.58172 7.58172 3 12 3C16.4183 3 20 6.58172 20 11Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M7.5 11.0086C8.96473 10.9201 9.88847 11.5134 10 12.9944C8.56755 13.0583 7.55498 12.5838 7.5 11.0086Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M16.5 11.0086C15.0353 10.9201 14.1115 11.5134 14 12.9944C15.4325 13.0583 16.445 12.5838 16.5 11.0086Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/>", "square-outlined-radius-0-stroke-2-IconAlien", props.mode)} />
 );
 
 export default IconAlien;

package/IconAlignHorizontalCenter/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const IconAlignHorizontalCenter = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "align-horizontal-center, alignment" })} innerHTML={"<path d=\"M20 4L4 4L4 20H20L20 4Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"/><path d=\"M12 16L12 8\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "align-horizontal-center, alignment" })} innerHTML={maskInner("<path d=\"M20 4L4 4L4 20H20L20 4Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"/><path d=\"M12 16L12 8\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/>", "square-outlined-radius-0-stroke-2-IconAlignHorizontalCenter", props.mode)} />
 );
 
 export default IconAlignHorizontalCenter;

package/IconAlignVerticalCenter/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const IconAlignVerticalCenter = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "align-vertical-center, alignment" })} innerHTML={"<path d=\"M20 4V20H4V4H20Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"/><path d=\"M8 12H16\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "align-vertical-center, alignment" })} innerHTML={maskInner("<path d=\"M20 4V20H4V4H20Z\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\"/><path d=\"M8 12H16\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/>", "square-outlined-radius-0-stroke-2-IconAlignVerticalCenter", props.mode)} />
 );
 
 export default IconAlignVerticalCenter;

package/IconAlignmentCenter/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const IconAlignmentCenter = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "alignment-center" })} innerHTML={"<path d=\"M4 5H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M8 12H16\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M4 19H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "alignment-center" })} innerHTML={maskInner("<path d=\"M4 5H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M8 12H16\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M4 19H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/>", "square-outlined-radius-0-stroke-2-IconAlignmentCenter", props.mode)} />
 );
 
 export default IconAlignmentCenter;

package/IconAlignmentJustify/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const IconAlignmentJustify = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "alignment-justify" })} innerHTML={"<path d=\"M4 12H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M4 19H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M4 5H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "alignment-justify" })} innerHTML={maskInner("<path d=\"M4 12H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M4 19H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M4 5H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/>", "square-outlined-radius-0-stroke-2-IconAlignmentJustify", props.mode)} />
 );
 
 export default IconAlignmentJustify;

package/IconAlignmentLeft/index.tsx

@@ -1,7 +1,7 @@
-import { svgAttrs, type CentralIconBaseProps } from "../CentralIconBase";
+import { svgAttrs, maskInner, type CentralIconBaseProps } from "../CentralIconBase";
 
 export const IconAlignmentLeft = (props: CentralIconBaseProps) => (
-  <svg {...svgAttrs({ ...props, ariaLabel: "alignment-left" })} innerHTML={"<path d=\"M4 5H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M4 12H12\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M4 19H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/>"} />
+  <svg {...svgAttrs({ ...props, ariaLabel: "alignment-left" })} innerHTML={maskInner("<path d=\"M4 5H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M4 12H12\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/><path d=\"M4 19H20\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"square\"/>", "square-outlined-radius-0-stroke-2-IconAlignmentLeft", props.mode)} />
 );
 
 export default IconAlignmentLeft;