v1.0.8

dist/outline/BuildingOfficeIcon.d.ts

@@ -4,10 +4,21 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
     color?: string;
 }
 /**
+ * @name BuildingOfficeIcon
+ *
+ * @category outline
+ *
+ * @description
+ *
  *
  *
  * @usage
  *
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export declare const BuildingOfficeIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;
 export {};

dist/outline/CheckCircleIcon.d.ts

@@ -4,10 +4,21 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
     color?: string;
 }
 /**
+ * @name CheckCircleIcon
+ *
+ * @category outline
+ *
+ * @description
+ *
  *
  *
  * @usage
  *
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export declare const CheckCircleIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;
 export {};

dist/outline/DevicePhoneMobileIcon.d.ts

@@ -4,10 +4,21 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
     color?: string;
 }
 /**
+ * @name DevicePhoneMobileIcon
+ *
+ * @category outline
+ *
+ * @description
+ *
  *
  *
  * @usage
  *
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export declare const DevicePhoneMobileIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;
 export {};

dist/outline/DocumentMinusIcon.d.ts

@@ -4,10 +4,21 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
     color?: string;
 }
 /**
+ * @name DocumentMinusIcon
+ *
+ * @category outline
+ *
+ * @description
+ *
  *
  *
  * @usage
  *
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export declare const DocumentMinusIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;
 export {};

dist/outline/DocumentPlusIcon.d.ts

@@ -4,10 +4,23 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
     color?: string;
 }
 /**
- * The DocumentPlus icon is used to represent the action of adding a new document.
+ * @name DocumentPlusIcon
+ *
+ * @category solid
+ *
+ * @description
+ * El ícono DocumentPlus representa la acción de agregar un nuevo documento. Visualmente, muestra un documento con un símbolo de más (+).
+ *
  *
  * @usage
- * Use this icon in buttons, links, or other UI elements where the user can create a new document.
+ * - Botones para permitir a los usuarios agregar nuevos registros.
+ * - Enlaces para destacar la opción de agregar contenido.
+ * - Formularios donde se necesite la acción de crear nuevos registros.
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export declare const DocumentPlusIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;
 export {};

dist/outline/EnvelopeIcon.d.ts

@@ -4,10 +4,21 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
     color?: string;
 }
 /**
+ * @name EnvelopeIcon
+ *
+ * @category outline
+ *
+ * @description
+ *
  *
  *
  * @usage
  *
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export declare const EnvelopeIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;
 export {};

dist/outline/GlobeAltIcon.d.ts

@@ -4,10 +4,21 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
     color?: string;
 }
 /**
+ * @name GlobeAltIcon
+ *
+ * @category outline
+ *
+ * @description
+ *
  *
  *
  * @usage
  *
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export declare const GlobeAltIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;
 export {};

dist/outline/PencilSquareIcon.d.ts

@@ -4,10 +4,21 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
     color?: string;
 }
 /**
+ * @name PencilSquareIcon
+ *
+ * @category outline
+ *
+ * @description
+ *
  *
  *
  * @usage
  *
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export declare const PencilSquareIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;
 export {};

dist/outline/PhoneIcon.d.ts

@@ -4,10 +4,21 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
     color?: string;
 }
 /**
+ * @name PhoneIcon
+ *
+ * @category outline
+ *
+ * @description
+ *
  *
  *
  * @usage
  *
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export declare const PhoneIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;
 export {};

dist/outline/PrinterIcon.d.ts

@@ -4,10 +4,21 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
     color?: string;
 }
 /**
+ * @name PrinterIcon
+ *
+ * @category outline
+ *
+ * @description
+ *
  *
  *
  * @usage
  *
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export declare const PrinterIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;
 export {};

dist/solid/BuildingOfficeIcon.d.ts

@@ -4,10 +4,21 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
     color?: string;
 }
 /**
+ * @name BuildingOfficeIcon
+ *
+ * @category outline
+ *
+ * @description
+ *
  *
  *
  * @usage
  *
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export declare const BuildingOfficeIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;
 export {};

dist/solid/CheckCircleIcon.d.ts

@@ -4,10 +4,21 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
     color?: string;
 }
 /**
+ * @name CheckCircleIcon
+ *
+ * @category outline
+ *
+ * @description
+ *
  *
  *
  * @usage
  *
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export declare const CheckCircleIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;
 export {};

dist/solid/DevicePhoneMobileIcon.d.ts

@@ -4,10 +4,21 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
     color?: string;
 }
 /**
+ * @name DevicePhoneMobileIcon
+ *
+ * @category outline
+ *
+ * @description
+ *
  *
  *
  * @usage
  *
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export declare const DevicePhoneMobileIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;
 export {};

dist/solid/DocumentMinusIcon.d.ts

@@ -4,10 +4,21 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
     color?: string;
 }
 /**
+ * @name DocumentMinusIcon
+ *
+ * @category outline
+ *
+ * @description
+ *
  *
  *
  * @usage
  *
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export declare const DocumentMinusIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;
 export {};

dist/solid/DocumentPlusIcon.d.ts

@@ -4,10 +4,23 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
     color?: string;
 }
 /**
- * The DocumentPlus icon is used to represent the action of adding a new document.
+ * @name DocumentPlusIcon
+ *
+ * @category solid
+ *
+ * @description
+ * El ícono DocumentPlus representa la acción de agregar un nuevo documento. Visualmente, muestra un documento con un símbolo de más (+).
+ *
  *
  * @usage
- * Use this icon in buttons, links, or other UI elements where the user can create a new document.
+ * - Botones para permitir a los usuarios agregar nuevos registros.
+ * - Enlaces para destacar la opción de agregar contenido.
+ * - Formularios donde se necesite la acción de crear nuevos registros.
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export declare const DocumentPlusIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;
 export {};

dist/solid/EnvelopeIcon.d.ts

@@ -4,10 +4,21 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
     color?: string;
 }
 /**
+ * @name EnvelopeIcon
+ *
+ * @category outline
+ *
+ * @description
+ *
  *
  *
  * @usage
  *
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export declare const EnvelopeIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;
 export {};

dist/solid/GlobeAltIcon.d.ts

@@ -4,10 +4,21 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
     color?: string;
 }
 /**
+ * @name GlobeAltIcon
+ *
+ * @category outline
+ *
+ * @description
+ *
  *
  *
  * @usage
  *
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export declare const GlobeAltIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;
 export {};

dist/solid/PencilSquareIcon.d.ts

@@ -4,10 +4,21 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
     color?: string;
 }
 /**
+ * @name PencilSquareIcon
+ *
+ * @category outline
+ *
+ * @description
+ *
  *
  *
  * @usage
  *
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export declare const PencilSquareIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;
 export {};

dist/solid/PhoneIcon.d.ts

@@ -4,10 +4,21 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
     color?: string;
 }
 /**
+ * @name PhoneIcon
+ *
+ * @category outline
+ *
+ * @description
+ *
  *
  *
  * @usage
  *
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export declare const PhoneIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;
 export {};

dist/solid/PrinterIcon.d.ts

@@ -4,10 +4,21 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
     color?: string;
 }
 /**
+ * @name PrinterIcon
+ *
+ * @category outline
+ *
+ * @description
+ *
  *
  *
  * @usage
  *
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export declare const PrinterIcon: React.ForwardRefExoticComponent<IconProps & React.RefAttributes<SVGSVGElement>>;
 export {};

package.json

@@ -1,6 +1,6 @@
 {
   "name": "via-icons",
-  "version": "1.0.7",
+  "version": "1.0.8",
   "description": "",
   "type": "module",
   "sideEffects": false,

scripts/deprecated.json

@@ -0,0 +1 @@
+["OldIcon1", "OldIcon2"]

scripts/generateIcons.js

@@ -3,19 +3,13 @@ import path from "path";
 import { optimize } from "svgo";
 import { fileURLToPath } from "url";
 import { dirname } from "path";
+import outlineConfig from "./svgo.24.outline.js";
+import solidConfig from "./svgo.24.solid.js";
+import deprecatedIcons from "./deprecated.json" assert { type: "json" };
 
 const __filename = fileURLToPath(import.meta.url);
 const __dirname = dirname(__filename);
 
-const svgoConfig = {
-  plugins: [
-    { name: "removeTitle", active: true },
-    { name: "removeAttrs", params: { attrs: "(data-name)" } },
-    { name: "removeDimensions", active: true },
-    { name: "convertColors", params: { currentColor: true } },
-  ],
-};
-
 const iconMetadataPath = path.resolve(__dirname, "./iconMetadata.json");
 const iconMetadata = JSON.parse(fs.readFileSync(iconMetadataPath, "utf-8"));
 
@@ -29,7 +23,8 @@ const generateIconComponent = (
   name,
   svgContent,
   description = "",
-  usage = ""
+  usage = [],
+  isDeprecated = false
 ) => `
 import * as React from 'react';
 
@@ -39,10 +34,21 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
 }
 
 /**
+ * @name ${name}Icon
+ *
+ * @category ${usage.length ? "solid" : "outline"}
+ *
+ * @description
  * ${description}
  *
+ * ${isDeprecated ? "@deprecated\n * " : ""}
  * @usage
- * ${usage}
+ * ${usage.map((item) => `- ${item}`).join("\n * ")}
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo \`aria-label\` o \`aria-hidden="true"\` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export const ${name}Icon = React.forwardRef<SVGSVGElement, IconProps>(
   ({ color = 'currentColor', ...props }, forwardedRef) => {
@@ -75,18 +81,21 @@ const processIcons = async (iconType) => {
   }
 
   const components = [];
-
   const files = fs.readdirSync(svgDir);
 
   for (const file of files) {
     const filePath = path.resolve(svgDir, file);
     const svgContent = fs.readFileSync(filePath, "utf-8");
+
+    const svgoConfig = iconType === "outline" ? outlineConfig : solidConfig;
     const { data } = await optimize(svgContent, svgoConfig);
 
     const componentName = file
       .replace(".svg", "")
       .replace(/(^\w|-\w)/g, clearAndUpper);
     const metadata = iconMetadata[componentName];
+    const isDeprecated = deprecatedIcons.includes(componentName);
+
     if (!metadata) {
       console.warn(
         `Metadata for ${componentName} not found, generating without metadata.`
@@ -98,7 +107,8 @@ const processIcons = async (iconType) => {
       componentName,
       data,
       metadata ? metadata.description : "",
-      metadata ? metadata.usage : ""
+      metadata ? metadata.usage : [],
+      isDeprecated
     );
 
     const componentPath = path.resolve(

scripts/iconMetadata.json

@@ -1,10 +1,10 @@
 {
   "DocumentPlus": {
-    "description": "The DocumentPlus icon is used to represent the action of adding a new document.",
+    "description": "El ícono DocumentPlus representa la acción de agregar un nuevo documento. Visualmente, muestra un documento con un símbolo de más (+).",
-    "usage": "Use this icon in buttons, links, or other UI elements where the user can create a new document."
+    "usage": [
-  },
+      "Botones para permitir a los usuarios agregar nuevos registros.",
-  "Icon2": {
+      "Enlaces para destacar la opción de agregar contenido.",
-    "description": "The Icon2 icon represents a generic action or item.",
+      "Formularios donde se necesite la acción de crear nuevos registros."
-    "usage": "Use this icon in scenarios where a general action needs to be indicated, such as settings or preferences."
+    ]
   }
 }

scripts/svgo.24.outline.js

@@ -0,0 +1,27 @@
+export default {
+  plugins: [
+    "preset-default",
+    "removeDimensions",
+    "sortAttrs",
+    "cleanupListOfValues",
+    {
+      name: "removeAttrs",
+      params: {
+        attrs: ["stroke", "path:stroke-width"],
+      },
+    },
+    {
+      name: "addAttributesToSVGElement",
+      params: {
+        attributes: [
+          {
+            "stroke-width": "1.5",
+            stroke: "currentColor",
+            "aria-hidden": "true",
+            "data-slot": "icon",
+          },
+        ],
+      },
+    },
+  ],
+};

scripts/svgo.24.solid.js

@@ -0,0 +1,26 @@
+export default {
+  plugins: [
+    "preset-default",
+    "removeDimensions",
+    "sortAttrs",
+    "cleanupListOfValues",
+    {
+      name: "removeAttrs",
+      params: {
+        attrs: ["fill"],
+      },
+    },
+    {
+      name: "addAttributesToSVGElement",
+      params: {
+        attributes: [
+          {
+            fill: "currentColor",
+            "aria-hidden": "true",
+            "data-slot": "icon",
+          },
+        ],
+      },
+    },
+  ],
+};

src/outline/BuildingOfficeIcon.tsx

@@ -7,15 +7,26 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
 }
 
 /**
+ * @name BuildingOfficeIcon
+ *
+ * @category outline
+ *
+ * @description
+ * 
  *
  * 
  * @usage
  * 
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export const BuildingOfficeIcon = React.forwardRef<SVGSVGElement, IconProps>(
   ({ color = 'currentColor', ...props }, forwardedRef) => {
     return (
-      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon"><path stroke-linecap="round" stroke-linejoin="round" d="M3.75 21h16.5M4.5 3h15M5.25 3v18m13.5-18v18M9 6.75h1.5m-1.5 3h1.5m-1.5 3h1.5m3-6H15m-1.5 3H15m-1.5 3H15M9 21v-3.375c0-.621.504-1.125 1.125-1.125h3.75c.621 0 1.125.504 1.125 1.125V21"/></svg>
+      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" fill="none" stroke-width="1.5" aria-hidden="true" data-slot="icon" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M3.75 21h16.5M4.5 3h15M5.25 3v18m13.5-18v18M9 6.75h1.5m-1.5 3h1.5m-1.5 3h1.5m3-6H15m-1.5 3H15m-1.5 3H15M9 21v-3.375c0-.621.504-1.125 1.125-1.125h3.75c.621 0 1.125.504 1.125 1.125V21"/></svg>
     );
   }
 );

src/outline/CheckCircleIcon.tsx

@@ -7,15 +7,26 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
 }
 
 /**
+ * @name CheckCircleIcon
+ *
+ * @category outline
+ *
+ * @description
+ * 
  *
  * 
  * @usage
  * 
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export const CheckCircleIcon = React.forwardRef<SVGSVGElement, IconProps>(
   ({ color = 'currentColor', ...props }, forwardedRef) => {
     return (
-      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon"><path stroke-linecap="round" stroke-linejoin="round" d="M9 12.75 11.25 15 15 9.75M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z"/></svg>
+      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" fill="none" stroke-width="1.5" aria-hidden="true" data-slot="icon" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M9 12.75 11.25 15 15 9.75M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z"/></svg>
     );
   }
 );

src/outline/DevicePhoneMobileIcon.tsx

@@ -7,15 +7,26 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
 }
 
 /**
+ * @name DevicePhoneMobileIcon
+ *
+ * @category outline
+ *
+ * @description
+ * 
  *
  * 
  * @usage
  * 
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export const DevicePhoneMobileIcon = React.forwardRef<SVGSVGElement, IconProps>(
   ({ color = 'currentColor', ...props }, forwardedRef) => {
     return (
-      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon"><path stroke-linecap="round" stroke-linejoin="round" d="M10.5 1.5H8.25A2.25 2.25 0 0 0 6 3.75v16.5a2.25 2.25 0 0 0 2.25 2.25h7.5A2.25 2.25 0 0 0 18 20.25V3.75a2.25 2.25 0 0 0-2.25-2.25H13.5m-3 0V3h3V1.5m-3 0h3m-3 18.75h3"/></svg>
+      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" fill="none" stroke-width="1.5" aria-hidden="true" data-slot="icon" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M10.5 1.5H8.25A2.25 2.25 0 0 0 6 3.75v16.5a2.25 2.25 0 0 0 2.25 2.25h7.5A2.25 2.25 0 0 0 18 20.25V3.75a2.25 2.25 0 0 0-2.25-2.25H13.5m-3 0V3h3V1.5m-3 0h3m-3 18.75h3"/></svg>
     );
   }
 );

src/outline/DocumentMinusIcon.tsx

@@ -7,15 +7,26 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
 }
 
 /**
+ * @name DocumentMinusIcon
+ *
+ * @category outline
+ *
+ * @description
+ * 
  *
  * 
  * @usage
  * 
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export const DocumentMinusIcon = React.forwardRef<SVGSVGElement, IconProps>(
   ({ color = 'currentColor', ...props }, forwardedRef) => {
     return (
-      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon"><path stroke-linecap="round" stroke-linejoin="round" d="M19.5 14.25v-2.625a3.375 3.375 0 0 0-3.375-3.375h-1.5A1.125 1.125 0 0 1 13.5 7.125v-1.5a3.375 3.375 0 0 0-3.375-3.375H8.25m6.75 12H9m1.5-12H5.625c-.621 0-1.125.504-1.125 1.125v17.25c0 .621.504 1.125 1.125 1.125h12.75c.621 0 1.125-.504 1.125-1.125V11.25a9 9 0 0 0-9-9Z"/></svg>
+      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" fill="none" stroke-width="1.5" aria-hidden="true" data-slot="icon" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M19.5 14.25v-2.625a3.375 3.375 0 0 0-3.375-3.375h-1.5A1.125 1.125 0 0 1 13.5 7.125v-1.5a3.375 3.375 0 0 0-3.375-3.375H8.25m6.75 12H9m1.5-12H5.625c-.621 0-1.125.504-1.125 1.125v17.25c0 .621.504 1.125 1.125 1.125h12.75c.621 0 1.125-.504 1.125-1.125V11.25a9 9 0 0 0-9-9Z"/></svg>
     );
   }
 );

src/outline/DocumentPlusIcon.tsx

@@ -7,15 +7,28 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
 }
 
 /**
- * The DocumentPlus icon is used to represent the action of adding a new document.
+ * @name DocumentPlusIcon
+ *
+ * @category solid
+ *
+ * @description
+ * El ícono DocumentPlus representa la acción de agregar un nuevo documento. Visualmente, muestra un documento con un símbolo de más (+).
+ *
  * 
  * @usage
- * Use this icon in buttons, links, or other UI elements where the user can create a new document.
+ * - Botones para permitir a los usuarios agregar nuevos registros.
+ * - Enlaces para destacar la opción de agregar contenido.
+ * - Formularios donde se necesite la acción de crear nuevos registros.
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export const DocumentPlusIcon = React.forwardRef<SVGSVGElement, IconProps>(
   ({ color = 'currentColor', ...props }, forwardedRef) => {
     return (
-      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon"><path stroke-linecap="round" stroke-linejoin="round" d="M19.5 14.25v-2.625a3.375 3.375 0 0 0-3.375-3.375h-1.5A1.125 1.125 0 0 1 13.5 7.125v-1.5a3.375 3.375 0 0 0-3.375-3.375H8.25m3.75 9v6m3-3H9m1.5-12H5.625c-.621 0-1.125.504-1.125 1.125v17.25c0 .621.504 1.125 1.125 1.125h12.75c.621 0 1.125-.504 1.125-1.125V11.25a9 9 0 0 0-9-9Z"/></svg>
+      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" fill="none" stroke-width="1.5" aria-hidden="true" data-slot="icon" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M19.5 14.25v-2.625a3.375 3.375 0 0 0-3.375-3.375h-1.5A1.125 1.125 0 0 1 13.5 7.125v-1.5a3.375 3.375 0 0 0-3.375-3.375H8.25m3.75 9v6m3-3H9m1.5-12H5.625c-.621 0-1.125.504-1.125 1.125v17.25c0 .621.504 1.125 1.125 1.125h12.75c.621 0 1.125-.504 1.125-1.125V11.25a9 9 0 0 0-9-9Z"/></svg>
     );
   }
 );

src/outline/EnvelopeIcon.tsx

@@ -7,15 +7,26 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
 }
 
 /**
+ * @name EnvelopeIcon
+ *
+ * @category outline
+ *
+ * @description
+ * 
  *
  * 
  * @usage
  * 
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export const EnvelopeIcon = React.forwardRef<SVGSVGElement, IconProps>(
   ({ color = 'currentColor', ...props }, forwardedRef) => {
     return (
-      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon"><path stroke-linecap="round" stroke-linejoin="round" d="M21.75 6.75v10.5a2.25 2.25 0 0 1-2.25 2.25h-15a2.25 2.25 0 0 1-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0 0 19.5 4.5h-15a2.25 2.25 0 0 0-2.25 2.25m19.5 0v.243a2.25 2.25 0 0 1-1.07 1.916l-7.5 4.615a2.25 2.25 0 0 1-2.36 0L3.32 8.91a2.25 2.25 0 0 1-1.07-1.916V6.75"/></svg>
+      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" fill="none" stroke-width="1.5" aria-hidden="true" data-slot="icon" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M21.75 6.75v10.5a2.25 2.25 0 0 1-2.25 2.25h-15a2.25 2.25 0 0 1-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0 0 19.5 4.5h-15a2.25 2.25 0 0 0-2.25 2.25m19.5 0v.243a2.25 2.25 0 0 1-1.07 1.916l-7.5 4.615a2.25 2.25 0 0 1-2.36 0L3.32 8.91a2.25 2.25 0 0 1-1.07-1.916V6.75"/></svg>
     );
   }
 );

src/outline/GlobeAltIcon.tsx

@@ -7,15 +7,26 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
 }
 
 /**
+ * @name GlobeAltIcon
+ *
+ * @category outline
+ *
+ * @description
+ * 
  *
  * 
  * @usage
  * 
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export const GlobeAltIcon = React.forwardRef<SVGSVGElement, IconProps>(
   ({ color = 'currentColor', ...props }, forwardedRef) => {
     return (
-      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon"><path stroke-linecap="round" stroke-linejoin="round" d="M12 21a9.004 9.004 0 0 0 8.716-6.747M12 21a9.004 9.004 0 0 1-8.716-6.747M12 21c2.485 0 4.5-4.03 4.5-9S14.485 3 12 3m0 18c-2.485 0-4.5-4.03-4.5-9S9.515 3 12 3m0 0a8.997 8.997 0 0 1 7.843 4.582M12 3a8.997 8.997 0 0 0-7.843 4.582m15.686 0A11.953 11.953 0 0 1 12 10.5c-2.998 0-5.74-1.1-7.843-2.918m15.686 0A8.959 8.959 0 0 1 21 12c0 .778-.099 1.533-.284 2.253m0 0A17.919 17.919 0 0 1 12 16.5c-3.162 0-6.133-.815-8.716-2.247m0 0A9.015 9.015 0 0 1 3 12c0-1.605.42-3.113 1.157-4.418"/></svg>
+      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" fill="none" stroke-width="1.5" aria-hidden="true" data-slot="icon" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M12 21a9.004 9.004 0 0 0 8.716-6.747M12 21a9.004 9.004 0 0 1-8.716-6.747M12 21c2.485 0 4.5-4.03 4.5-9S14.485 3 12 3m0 18c-2.485 0-4.5-4.03-4.5-9S9.515 3 12 3m0 0a8.997 8.997 0 0 1 7.843 4.582M12 3a8.997 8.997 0 0 0-7.843 4.582m15.686 0A11.953 11.953 0 0 1 12 10.5c-2.998 0-5.74-1.1-7.843-2.918m15.686 0A8.959 8.959 0 0 1 21 12c0 .778-.099 1.533-.284 2.253m0 0A17.919 17.919 0 0 1 12 16.5a17.92 17.92 0 0 1-8.716-2.247m0 0A9.015 9.015 0 0 1 3 12c0-1.605.42-3.113 1.157-4.418"/></svg>
     );
   }
 );

src/outline/PencilSquareIcon.tsx

@@ -7,15 +7,26 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
 }
 
 /**
+ * @name PencilSquareIcon
+ *
+ * @category outline
+ *
+ * @description
+ * 
  *
  * 
  * @usage
  * 
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export const PencilSquareIcon = React.forwardRef<SVGSVGElement, IconProps>(
   ({ color = 'currentColor', ...props }, forwardedRef) => {
     return (
-      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon"><path stroke-linecap="round" stroke-linejoin="round" d="m16.862 4.487 1.687-1.688a1.875 1.875 0 1 1 2.652 2.652L10.582 16.07a4.5 4.5 0 0 1-1.897 1.13L6 18l.8-2.685a4.5 4.5 0 0 1 1.13-1.897l8.932-8.931Zm0 0L19.5 7.125M18 14v4.75A2.25 2.25 0 0 1 15.75 21H5.25A2.25 2.25 0 0 1 3 18.75V8.25A2.25 2.25 0 0 1 5.25 6H10"/></svg>
+      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" fill="none" stroke-width="1.5" aria-hidden="true" data-slot="icon" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="m16.862 4.487 1.687-1.688a1.875 1.875 0 1 1 2.652 2.652L10.582 16.07a4.5 4.5 0 0 1-1.897 1.13L6 18l.8-2.685a4.5 4.5 0 0 1 1.13-1.897l8.932-8.931Zm0 0L19.5 7.125M18 14v4.75A2.25 2.25 0 0 1 15.75 21H5.25A2.25 2.25 0 0 1 3 18.75V8.25A2.25 2.25 0 0 1 5.25 6H10"/></svg>
     );
   }
 );

src/outline/PhoneIcon.tsx

@@ -7,15 +7,26 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
 }
 
 /**
+ * @name PhoneIcon
+ *
+ * @category outline
+ *
+ * @description
+ * 
  *
  * 
  * @usage
  * 
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export const PhoneIcon = React.forwardRef<SVGSVGElement, IconProps>(
   ({ color = 'currentColor', ...props }, forwardedRef) => {
     return (
-      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon"><path stroke-linecap="round" stroke-linejoin="round" d="M2.25 6.75c0 8.284 6.716 15 15 15h2.25a2.25 2.25 0 0 0 2.25-2.25v-1.372c0-.516-.351-.966-.852-1.091l-4.423-1.106c-.44-.11-.902.055-1.173.417l-.97 1.293c-.282.376-.769.542-1.21.38a12.035 12.035 0 0 1-7.143-7.143c-.162-.441.004-.928.38-1.21l1.293-.97c.363-.271.527-.734.417-1.173L6.963 3.102a1.125 1.125 0 0 0-1.091-.852H4.5A2.25 2.25 0 0 0 2.25 4.5v2.25Z"/></svg>
+      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" fill="none" stroke-width="1.5" aria-hidden="true" data-slot="icon" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M2.25 6.75c0 8.284 6.716 15 15 15h2.25a2.25 2.25 0 0 0 2.25-2.25v-1.372c0-.516-.351-.966-.852-1.091l-4.423-1.106c-.44-.11-.902.055-1.173.417l-.97 1.293c-.282.376-.769.542-1.21.38a12.035 12.035 0 0 1-7.143-7.143c-.162-.441.004-.928.38-1.21l1.293-.97c.363-.271.527-.734.417-1.173L6.963 3.102a1.125 1.125 0 0 0-1.091-.852H4.5A2.25 2.25 0 0 0 2.25 4.5v2.25Z"/></svg>
     );
   }
 );

src/outline/PrinterIcon.tsx

@@ -7,15 +7,26 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
 }
 
 /**
+ * @name PrinterIcon
+ *
+ * @category outline
+ *
+ * @description
+ * 
  *
  * 
  * @usage
  * 
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export const PrinterIcon = React.forwardRef<SVGSVGElement, IconProps>(
   ({ color = 'currentColor', ...props }, forwardedRef) => {
     return (
-      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon"><path stroke-linecap="round" stroke-linejoin="round" d="M6.72 13.829c-.24.03-.48.062-.72.096m.72-.096a42.415 42.415 0 0 1 10.56 0m-10.56 0L6.34 18m10.94-4.171c.24.03.48.062.72.096m-.72-.096L17.66 18m0 0 .229 2.523a1.125 1.125 0 0 1-1.12 1.227H7.231c-.662 0-1.18-.568-1.12-1.227L6.34 18m11.318 0h1.091A2.25 2.25 0 0 0 21 15.75V9.456c0-1.081-.768-2.015-1.837-2.175a48.055 48.055 0 0 0-1.913-.247M6.34 18H5.25A2.25 2.25 0 0 1 3 15.75V9.456c0-1.081.768-2.015 1.837-2.175a48.041 48.041 0 0 1 1.913-.247m10.5 0a48.536 48.536 0 0 0-10.5 0m10.5 0V3.375c0-.621-.504-1.125-1.125-1.125h-8.25c-.621 0-1.125.504-1.125 1.125v3.659M18 10.5h.008v.008H18V10.5Zm-3 0h.008v.008H15V10.5Z"/></svg>
+      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" fill="none" stroke-width="1.5" aria-hidden="true" data-slot="icon" viewBox="0 0 24 24" stroke="currentColor"><path stroke-linecap="round" stroke-linejoin="round" d="M6.72 13.829c-.24.03-.48.062-.72.096m.72-.096a42.415 42.415 0 0 1 10.56 0m-10.56 0L6.34 18m10.94-4.171c.24.03.48.062.72.096m-.72-.096L17.66 18m0 0 .229 2.523a1.125 1.125 0 0 1-1.12 1.227H7.231c-.662 0-1.18-.568-1.12-1.227L6.34 18m11.318 0h1.091A2.25 2.25 0 0 0 21 15.75V9.456c0-1.081-.768-2.015-1.837-2.175a48.055 48.055 0 0 0-1.913-.247M6.34 18H5.25A2.25 2.25 0 0 1 3 15.75V9.456c0-1.081.768-2.015 1.837-2.175a48.041 48.041 0 0 1 1.913-.247m10.5 0a48.536 48.536 0 0 0-10.5 0m10.5 0V3.375c0-.621-.504-1.125-1.125-1.125h-8.25c-.621 0-1.125.504-1.125 1.125v3.659M18 10.5h.008v.008H18V10.5Zm-3 0h.008v.008H15V10.5Z"/></svg>
     );
   }
 );

src/solid/BuildingOfficeIcon.tsx

@@ -7,15 +7,26 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
 }
 
 /**
+ * @name BuildingOfficeIcon
+ *
+ * @category outline
+ *
+ * @description
+ * 
  *
  * 
  * @usage
  * 
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export const BuildingOfficeIcon = React.forwardRef<SVGSVGElement, IconProps>(
   ({ color = 'currentColor', ...props }, forwardedRef) => {
     return (
-      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" data-slot="icon"><path fillRule="evenodd" d="M4.5 2.25a.75.75 0 0 0 0 1.5v16.5h-.75a.75.75 0 0 0 0 1.5h16.5a.75.75 0 0 0 0-1.5h-.75V3.75a.75.75 0 0 0 0-1.5h-15ZM9 6a.75.75 0 0 0 0 1.5h1.5a.75.75 0 0 0 0-1.5H9Zm-.75 3.75A.75.75 0 0 1 9 9h1.5a.75.75 0 0 1 0 1.5H9a.75.75 0 0 1-.75-.75ZM9 12a.75.75 0 0 0 0 1.5h1.5a.75.75 0 0 0 0-1.5H9Zm3.75-5.25A.75.75 0 0 1 13.5 6H15a.75.75 0 0 1 0 1.5h-1.5a.75.75 0 0 1-.75-.75ZM13.5 9a.75.75 0 0 0 0 1.5H15A.75.75 0 0 0 15 9h-1.5Zm-.75 3.75a.75.75 0 0 1 .75-.75H15a.75.75 0 0 1 0 1.5h-1.5a.75.75 0 0 1-.75-.75ZM9 19.5v-2.25a.75.75 0 0 1 .75-.75h4.5a.75.75 0 0 1 .75.75v2.25a.75.75 0 0 1-.75.75h-4.5A.75.75 0 0 1 9 19.5Z" clipRule="evenodd"/></svg>
+      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" aria-hidden="true" data-slot="icon" viewBox="0 0 24 24" fill="currentColor"><path fillRule="evenodd" d="M4.5 2.25a.75.75 0 0 0 0 1.5v16.5h-.75a.75.75 0 0 0 0 1.5h16.5a.75.75 0 0 0 0-1.5h-.75V3.75a.75.75 0 0 0 0-1.5h-15ZM9 6a.75.75 0 0 0 0 1.5h1.5a.75.75 0 0 0 0-1.5H9Zm-.75 3.75A.75.75 0 0 1 9 9h1.5a.75.75 0 0 1 0 1.5H9a.75.75 0 0 1-.75-.75ZM9 12a.75.75 0 0 0 0 1.5h1.5a.75.75 0 0 0 0-1.5H9Zm3.75-5.25A.75.75 0 0 1 13.5 6H15a.75.75 0 0 1 0 1.5h-1.5a.75.75 0 0 1-.75-.75ZM13.5 9a.75.75 0 0 0 0 1.5H15A.75.75 0 0 0 15 9h-1.5Zm-.75 3.75a.75.75 0 0 1 .75-.75H15a.75.75 0 0 1 0 1.5h-1.5a.75.75 0 0 1-.75-.75ZM9 19.5v-2.25a.75.75 0 0 1 .75-.75h4.5a.75.75 0 0 1 .75.75v2.25a.75.75 0 0 1-.75.75h-4.5A.75.75 0 0 1 9 19.5Z" clipRule="evenodd"/></svg>
     );
   }
 );

src/solid/CheckCircleIcon.tsx

@@ -7,15 +7,26 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
 }
 
 /**
+ * @name CheckCircleIcon
+ *
+ * @category outline
+ *
+ * @description
+ * 
  *
  * 
  * @usage
  * 
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export const CheckCircleIcon = React.forwardRef<SVGSVGElement, IconProps>(
   ({ color = 'currentColor', ...props }, forwardedRef) => {
     return (
-      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" data-slot="icon"><path fillRule="evenodd" d="M2.25 12c0-5.385 4.365-9.75 9.75-9.75s9.75 4.365 9.75 9.75-4.365 9.75-9.75 9.75S2.25 17.385 2.25 12Zm13.36-1.814a.75.75 0 1 0-1.22-.872l-3.236 4.53L9.53 12.22a.75.75 0 0 0-1.06 1.06l2.25 2.25a.75.75 0 0 0 1.14-.094l3.75-5.25Z" clipRule="evenodd"/></svg>
+      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" aria-hidden="true" data-slot="icon" viewBox="0 0 24 24" fill="currentColor"><path fillRule="evenodd" d="M2.25 12c0-5.385 4.365-9.75 9.75-9.75s9.75 4.365 9.75 9.75-4.365 9.75-9.75 9.75S2.25 17.385 2.25 12Zm13.36-1.814a.75.75 0 1 0-1.22-.872l-3.236 4.53L9.53 12.22a.75.75 0 0 0-1.06 1.06l2.25 2.25a.75.75 0 0 0 1.14-.094l3.75-5.25Z" clipRule="evenodd"/></svg>
     );
   }
 );

src/solid/DevicePhoneMobileIcon.tsx

@@ -7,15 +7,26 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
 }
 
 /**
+ * @name DevicePhoneMobileIcon
+ *
+ * @category outline
+ *
+ * @description
+ * 
  *
  * 
  * @usage
  * 
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export const DevicePhoneMobileIcon = React.forwardRef<SVGSVGElement, IconProps>(
   ({ color = 'currentColor', ...props }, forwardedRef) => {
     return (
-      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" data-slot="icon"><path d="M10.5 18.75a.75.75 0 0 0 0 1.5h3a.75.75 0 0 0 0-1.5h-3Z"/><path fillRule="evenodd" d="M8.625.75A3.375 3.375 0 0 0 5.25 4.125v15.75a3.375 3.375 0 0 0 3.375 3.375h6.75a3.375 3.375 0 0 0 3.375-3.375V4.125A3.375 3.375 0 0 0 15.375.75h-6.75ZM7.5 4.125C7.5 3.504 8.004 3 8.625 3H9.75v.375c0 .621.504 1.125 1.125 1.125h2.25c.621 0 1.125-.504 1.125-1.125V3h1.125c.621 0 1.125.504 1.125 1.125v15.75c0 .621-.504 1.125-1.125 1.125h-6.75A1.125 1.125 0 0 1 7.5 19.875V4.125Z" clipRule="evenodd"/></svg>
+      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" aria-hidden="true" data-slot="icon" viewBox="0 0 24 24" fill="currentColor"><path d="M10.5 18.75a.75.75 0 0 0 0 1.5h3a.75.75 0 0 0 0-1.5h-3Z"/><path fillRule="evenodd" d="M8.625.75A3.375 3.375 0 0 0 5.25 4.125v15.75a3.375 3.375 0 0 0 3.375 3.375h6.75a3.375 3.375 0 0 0 3.375-3.375V4.125A3.375 3.375 0 0 0 15.375.75h-6.75ZM7.5 4.125C7.5 3.504 8.004 3 8.625 3H9.75v.375c0 .621.504 1.125 1.125 1.125h2.25c.621 0 1.125-.504 1.125-1.125V3h1.125c.621 0 1.125.504 1.125 1.125v15.75c0 .621-.504 1.125-1.125 1.125h-6.75A1.125 1.125 0 0 1 7.5 19.875V4.125Z" clipRule="evenodd"/></svg>
     );
   }
 );

src/solid/DocumentMinusIcon.tsx

@@ -7,15 +7,26 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
 }
 
 /**
+ * @name DocumentMinusIcon
+ *
+ * @category outline
+ *
+ * @description
+ * 
  *
  * 
  * @usage
  * 
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export const DocumentMinusIcon = React.forwardRef<SVGSVGElement, IconProps>(
   ({ color = 'currentColor', ...props }, forwardedRef) => {
     return (
-      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" data-slot="icon"><path fillRule="evenodd" d="M5.625 1.5H9a3.75 3.75 0 0 1 3.75 3.75v1.875c0 1.036.84 1.875 1.875 1.875H16.5a3.75 3.75 0 0 1 3.75 3.75v7.875c0 1.035-.84 1.875-1.875 1.875H5.625a1.875 1.875 0 0 1-1.875-1.875V3.375c0-1.036.84-1.875 1.875-1.875ZM9.75 14.25a.75.75 0 0 0 0 1.5H15a.75.75 0 0 0 0-1.5H9.75Z" clipRule="evenodd"/><path d="M14.25 5.25a5.23 5.23 0 0 0-1.279-3.434 9.768 9.768 0 0 1 6.963 6.963A5.23 5.23 0 0 0 16.5 7.5h-1.875a.375.375 0 0 1-.375-.375V5.25Z"/></svg>
+      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" aria-hidden="true" data-slot="icon" viewBox="0 0 24 24" fill="currentColor"><path fillRule="evenodd" d="M5.625 1.5H9a3.75 3.75 0 0 1 3.75 3.75v1.875c0 1.036.84 1.875 1.875 1.875H16.5a3.75 3.75 0 0 1 3.75 3.75v7.875c0 1.035-.84 1.875-1.875 1.875H5.625a1.875 1.875 0 0 1-1.875-1.875V3.375c0-1.036.84-1.875 1.875-1.875ZM9.75 14.25a.75.75 0 0 0 0 1.5H15a.75.75 0 0 0 0-1.5H9.75Z" clipRule="evenodd"/><path d="M14.25 5.25a5.23 5.23 0 0 0-1.279-3.434 9.768 9.768 0 0 1 6.963 6.963A5.23 5.23 0 0 0 16.5 7.5h-1.875a.375.375 0 0 1-.375-.375V5.25Z"/></svg>
     );
   }
 );

src/solid/DocumentPlusIcon.tsx

@@ -7,15 +7,28 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
 }
 
 /**
- * The DocumentPlus icon is used to represent the action of adding a new document.
+ * @name DocumentPlusIcon
+ *
+ * @category solid
+ *
+ * @description
+ * El ícono DocumentPlus representa la acción de agregar un nuevo documento. Visualmente, muestra un documento con un símbolo de más (+).
+ *
  * 
  * @usage
- * Use this icon in buttons, links, or other UI elements where the user can create a new document.
+ * - Botones para permitir a los usuarios agregar nuevos registros.
+ * - Enlaces para destacar la opción de agregar contenido.
+ * - Formularios donde se necesite la acción de crear nuevos registros.
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export const DocumentPlusIcon = React.forwardRef<SVGSVGElement, IconProps>(
   ({ color = 'currentColor', ...props }, forwardedRef) => {
     return (
-      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" data-slot="icon"><path fillRule="evenodd" d="M5.625 1.5H9a3.75 3.75 0 0 1 3.75 3.75v1.875c0 1.036.84 1.875 1.875 1.875H16.5a3.75 3.75 0 0 1 3.75 3.75v7.875c0 1.035-.84 1.875-1.875 1.875H5.625a1.875 1.875 0 0 1-1.875-1.875V3.375c0-1.036.84-1.875 1.875-1.875ZM12.75 12a.75.75 0 0 0-1.5 0v2.25H9a.75.75 0 0 0 0 1.5h2.25V18a.75.75 0 0 0 1.5 0v-2.25H15a.75.75 0 0 0 0-1.5h-2.25V12Z" clipRule="evenodd"/><path d="M14.25 5.25a5.23 5.23 0 0 0-1.279-3.434 9.768 9.768 0 0 1 6.963 6.963A5.23 5.23 0 0 0 16.5 7.5h-1.875a.375.375 0 0 1-.375-.375V5.25Z"/></svg>
+      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" aria-hidden="true" data-slot="icon" viewBox="0 0 24 24" fill="currentColor"><path fillRule="evenodd" d="M5.625 1.5H9a3.75 3.75 0 0 1 3.75 3.75v1.875c0 1.036.84 1.875 1.875 1.875H16.5a3.75 3.75 0 0 1 3.75 3.75v7.875c0 1.035-.84 1.875-1.875 1.875H5.625a1.875 1.875 0 0 1-1.875-1.875V3.375c0-1.036.84-1.875 1.875-1.875ZM12.75 12a.75.75 0 0 0-1.5 0v2.25H9a.75.75 0 0 0 0 1.5h2.25V18a.75.75 0 0 0 1.5 0v-2.25H15a.75.75 0 0 0 0-1.5h-2.25V12Z" clipRule="evenodd"/><path d="M14.25 5.25a5.23 5.23 0 0 0-1.279-3.434 9.768 9.768 0 0 1 6.963 6.963A5.23 5.23 0 0 0 16.5 7.5h-1.875a.375.375 0 0 1-.375-.375V5.25Z"/></svg>
     );
   }
 );

src/solid/EnvelopeIcon.tsx

@@ -7,15 +7,26 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
 }
 
 /**
+ * @name EnvelopeIcon
+ *
+ * @category outline
+ *
+ * @description
+ * 
  *
  * 
  * @usage
  * 
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export const EnvelopeIcon = React.forwardRef<SVGSVGElement, IconProps>(
   ({ color = 'currentColor', ...props }, forwardedRef) => {
     return (
-      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" data-slot="icon"><path d="M1.5 8.67v8.58a3 3 0 0 0 3 3h15a3 3 0 0 0 3-3V8.67l-8.928 5.493a3 3 0 0 1-3.144 0L1.5 8.67Z"/><path d="M22.5 6.908V6.75a3 3 0 0 0-3-3h-15a3 3 0 0 0-3 3v.158l9.714 5.978a1.5 1.5 0 0 0 1.572 0L22.5 6.908Z"/></svg>
+      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" aria-hidden="true" data-slot="icon" viewBox="0 0 24 24" fill="currentColor"><path d="M1.5 8.67v8.58a3 3 0 0 0 3 3h15a3 3 0 0 0 3-3V8.67l-8.928 5.493a3 3 0 0 1-3.144 0L1.5 8.67Z"/><path d="M22.5 6.908V6.75a3 3 0 0 0-3-3h-15a3 3 0 0 0-3 3v.158l9.714 5.978a1.5 1.5 0 0 0 1.572 0L22.5 6.908Z"/></svg>
     );
   }
 );

src/solid/GlobeAltIcon.tsx

@@ -7,15 +7,26 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
 }
 
 /**
+ * @name GlobeAltIcon
+ *
+ * @category outline
+ *
+ * @description
+ * 
  *
  * 
  * @usage
  * 
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export const GlobeAltIcon = React.forwardRef<SVGSVGElement, IconProps>(
   ({ color = 'currentColor', ...props }, forwardedRef) => {
     return (
-      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" data-slot="icon"><path d="M21.721 12.752a9.711 9.711 0 0 0-.945-5.003 12.754 12.754 0 0 1-4.339 2.708 18.991 18.991 0 0 1-.214 4.772 17.165 17.165 0 0 0 5.498-2.477ZM14.634 15.55a17.324 17.324 0 0 0 .332-4.647c-.952.227-1.945.347-2.966.347-1.021 0-2.014-.12-2.966-.347a17.515 17.515 0 0 0 .332 4.647 17.385 17.385 0 0 0 5.268 0ZM9.772 17.119a18.963 18.963 0 0 0 4.456 0A17.182 17.182 0 0 1 12 21.724a17.18 17.18 0 0 1-2.228-4.605ZM7.777 15.23a18.87 18.87 0 0 1-.214-4.774 12.753 12.753 0 0 1-4.34-2.708 9.711 9.711 0 0 0-.944 5.004 17.165 17.165 0 0 0 5.498 2.477ZM21.356 14.752a9.765 9.765 0 0 1-7.478 6.817 18.64 18.64 0 0 0 1.988-4.718 18.627 18.627 0 0 0 5.49-2.098ZM2.644 14.752c1.682.971 3.53 1.688 5.49 2.099a18.64 18.64 0 0 0 1.988 4.718 9.765 9.765 0 0 1-7.478-6.816ZM13.878 2.43a9.755 9.755 0 0 1 6.116 3.986 11.267 11.267 0 0 1-3.746 2.504 18.63 18.63 0 0 0-2.37-6.49ZM12 2.276a17.152 17.152 0 0 1 2.805 7.121c-.897.23-1.837.353-2.805.353-.968 0-1.908-.122-2.805-.353A17.151 17.151 0 0 1 12 2.276ZM10.122 2.43a18.629 18.629 0 0 0-2.37 6.49 11.266 11.266 0 0 1-3.746-2.504 9.754 9.754 0 0 1 6.116-3.985Z"/></svg>
+      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" aria-hidden="true" data-slot="icon" viewBox="0 0 24 24" fill="currentColor"><path d="M21.721 12.752a9.711 9.711 0 0 0-.945-5.003 12.754 12.754 0 0 1-4.339 2.708 18.991 18.991 0 0 1-.214 4.772 17.165 17.165 0 0 0 5.498-2.477Zm-7.087 2.798a17.324 17.324 0 0 0 .332-4.647c-.952.227-1.945.347-2.966.347-1.021 0-2.014-.12-2.966-.347a17.515 17.515 0 0 0 .332 4.647 17.385 17.385 0 0 0 5.268 0Zm-4.862 1.569a18.963 18.963 0 0 0 4.456 0A17.182 17.182 0 0 1 12 21.724a17.18 17.18 0 0 1-2.228-4.605ZM7.777 15.23a18.87 18.87 0 0 1-.214-4.774 12.753 12.753 0 0 1-4.34-2.708 9.711 9.711 0 0 0-.944 5.004 17.165 17.165 0 0 0 5.498 2.477Zm13.579-.478a9.765 9.765 0 0 1-7.478 6.817 18.64 18.64 0 0 0 1.988-4.718 18.627 18.627 0 0 0 5.49-2.098Zm-18.712 0a18.619 18.619 0 0 0 5.49 2.099 18.64 18.64 0 0 0 1.988 4.718 9.765 9.765 0 0 1-7.478-6.816ZM13.878 2.43a9.755 9.755 0 0 1 6.116 3.986 11.267 11.267 0 0 1-3.746 2.504 18.63 18.63 0 0 0-2.37-6.49ZM12 2.276a17.152 17.152 0 0 1 2.805 7.121 11.281 11.281 0 0 1-5.61 0A17.151 17.151 0 0 1 12 2.276Zm-1.878.154a18.629 18.629 0 0 0-2.37 6.49 11.266 11.266 0 0 1-3.746-2.504 9.754 9.754 0 0 1 6.116-3.985Z"/></svg>
     );
   }
 );

src/solid/PencilSquareIcon.tsx

@@ -7,15 +7,26 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
 }
 
 /**
+ * @name PencilSquareIcon
+ *
+ * @category outline
+ *
+ * @description
+ * 
  *
  * 
  * @usage
  * 
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export const PencilSquareIcon = React.forwardRef<SVGSVGElement, IconProps>(
   ({ color = 'currentColor', ...props }, forwardedRef) => {
     return (
-      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" data-slot="icon"><path d="M21.731 2.269a2.625 2.625 0 0 0-3.712 0l-1.157 1.157 3.712 3.712 1.157-1.157a2.625 2.625 0 0 0 0-3.712ZM19.513 8.199l-3.712-3.712-8.4 8.4a5.25 5.25 0 0 0-1.32 2.214l-.8 2.685a.75.75 0 0 0 .933.933l2.685-.8a5.25 5.25 0 0 0 2.214-1.32l8.4-8.4Z"/><path d="M5.25 5.25a3 3 0 0 0-3 3v10.5a3 3 0 0 0 3 3h10.5a3 3 0 0 0 3-3V13.5a.75.75 0 0 0-1.5 0v5.25a1.5 1.5 0 0 1-1.5 1.5H5.25a1.5 1.5 0 0 1-1.5-1.5V8.25a1.5 1.5 0 0 1 1.5-1.5h5.25a.75.75 0 0 0 0-1.5H5.25Z"/></svg>
+      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" aria-hidden="true" data-slot="icon" viewBox="0 0 24 24" fill="currentColor"><path d="M21.731 2.269a2.625 2.625 0 0 0-3.712 0l-1.157 1.157 3.712 3.712 1.157-1.157a2.625 2.625 0 0 0 0-3.712Zm-2.218 5.93-3.712-3.712-8.4 8.4a5.25 5.25 0 0 0-1.32 2.214l-.8 2.685a.75.75 0 0 0 .933.933l2.685-.8a5.25 5.25 0 0 0 2.214-1.32l8.4-8.4Z"/><path d="M5.25 5.25a3 3 0 0 0-3 3v10.5a3 3 0 0 0 3 3h10.5a3 3 0 0 0 3-3V13.5a.75.75 0 0 0-1.5 0v5.25a1.5 1.5 0 0 1-1.5 1.5H5.25a1.5 1.5 0 0 1-1.5-1.5V8.25a1.5 1.5 0 0 1 1.5-1.5h5.25a.75.75 0 0 0 0-1.5H5.25Z"/></svg>
     );
   }
 );

src/solid/PhoneIcon.tsx

@@ -7,15 +7,26 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
 }
 
 /**
+ * @name PhoneIcon
+ *
+ * @category outline
+ *
+ * @description
+ * 
  *
  * 
  * @usage
  * 
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export const PhoneIcon = React.forwardRef<SVGSVGElement, IconProps>(
   ({ color = 'currentColor', ...props }, forwardedRef) => {
     return (
-      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" data-slot="icon"><path fillRule="evenodd" d="M1.5 4.5a3 3 0 0 1 3-3h1.372c.86 0 1.61.586 1.819 1.42l1.105 4.423a1.875 1.875 0 0 1-.694 1.955l-1.293.97c-.135.101-.164.249-.126.352a11.285 11.285 0 0 0 6.697 6.697c.103.038.25.009.352-.126l.97-1.293a1.875 1.875 0 0 1 1.955-.694l4.423 1.105c.834.209 1.42.959 1.42 1.82V19.5a3 3 0 0 1-3 3h-2.25C8.552 22.5 1.5 15.448 1.5 6.75V4.5Z" clipRule="evenodd"/></svg>
+      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" aria-hidden="true" data-slot="icon" viewBox="0 0 24 24" fill="currentColor"><path fillRule="evenodd" d="M1.5 4.5a3 3 0 0 1 3-3h1.372c.86 0 1.61.586 1.819 1.42l1.105 4.423a1.875 1.875 0 0 1-.694 1.955l-1.293.97c-.135.101-.164.249-.126.352a11.285 11.285 0 0 0 6.697 6.697c.103.038.25.009.352-.126l.97-1.293a1.875 1.875 0 0 1 1.955-.694l4.423 1.105c.834.209 1.42.959 1.42 1.82V19.5a3 3 0 0 1-3 3h-2.25C8.552 22.5 1.5 15.448 1.5 6.75V4.5Z" clipRule="evenodd"/></svg>
     );
   }
 );

src/solid/PrinterIcon.tsx

@@ -7,15 +7,26 @@ interface IconProps extends React.SVGAttributes<SVGElement> {
 }
 
 /**
+ * @name PrinterIcon
+ *
+ * @category outline
+ *
+ * @description
+ * 
  *
  * 
  * @usage
  * 
+ *
+ * @accessibility
+ * Asegurarse de incluir un atributo `aria-label` o `aria-hidden="true"` si el ícono es decorativo.
+ *
+ * @returns {JSX.Element} Componente SVG.
  */
 export const PrinterIcon = React.forwardRef<SVGSVGElement, IconProps>(
   ({ color = 'currentColor', ...props }, forwardedRef) => {
     return (
-      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true" data-slot="icon"><path fillRule="evenodd" d="M7.875 1.5C6.839 1.5 6 2.34 6 3.375v2.99c-.426.053-.851.11-1.274.174-1.454.218-2.476 1.483-2.476 2.917v6.294a3 3 0 0 0 3 3h.27l-.155 1.705A1.875 1.875 0 0 0 7.232 22.5h9.536a1.875 1.875 0 0 0 1.867-2.045l-.155-1.705h.27a3 3 0 0 0 3-3V9.456c0-1.434-1.022-2.7-2.476-2.917A48.716 48.716 0 0 0 18 6.366V3.375c0-1.036-.84-1.875-1.875-1.875h-8.25ZM16.5 6.205v-2.83A.375.375 0 0 0 16.125 3h-8.25a.375.375 0 0 0-.375.375v2.83a49.353 49.353 0 0 1 9 0Zm-.217 8.265c.178.018.317.16.333.337l.526 5.784a.375.375 0 0 1-.374.409H7.232a.375.375 0 0 1-.374-.409l.526-5.784a.373.373 0 0 1 .333-.337 41.741 41.741 0 0 1 8.566 0Zm.967-3.97a.75.75 0 0 1 .75-.75h.008a.75.75 0 0 1 .75.75v.008a.75.75 0 0 1-.75.75H18a.75.75 0 0 1-.75-.75V10.5ZM15 9.75a.75.75 0 0 0-.75.75v.008c0 .414.336.75.75.75h.008a.75.75 0 0 0 .75-.75V10.5a.75.75 0 0 0-.75-.75H15Z" clipRule="evenodd"/></svg>
+      <svg {...props} ref={forwardedRef} xmlns="http://www.w3.org/2000/svg" aria-hidden="true" data-slot="icon" viewBox="0 0 24 24" fill="currentColor"><path fillRule="evenodd" d="M7.875 1.5C6.839 1.5 6 2.34 6 3.375v2.99c-.426.053-.851.11-1.274.174-1.454.218-2.476 1.483-2.476 2.917v6.294a3 3 0 0 0 3 3h.27l-.155 1.705A1.875 1.875 0 0 0 7.232 22.5h9.536a1.875 1.875 0 0 0 1.867-2.045l-.155-1.705h.27a3 3 0 0 0 3-3V9.456c0-1.434-1.022-2.7-2.476-2.917A48.716 48.716 0 0 0 18 6.366V3.375c0-1.036-.84-1.875-1.875-1.875h-8.25ZM16.5 6.205v-2.83A.375.375 0 0 0 16.125 3h-8.25a.375.375 0 0 0-.375.375v2.83a49.353 49.353 0 0 1 9 0Zm-.217 8.265c.178.018.317.16.333.337l.526 5.784a.375.375 0 0 1-.374.409H7.232a.375.375 0 0 1-.374-.409l.526-5.784a.373.373 0 0 1 .333-.337 41.741 41.741 0 0 1 8.566 0Zm.967-3.97a.75.75 0 0 1 .75-.75h.008a.75.75 0 0 1 .75.75v.008a.75.75 0 0 1-.75.75H18a.75.75 0 0 1-.75-.75V10.5ZM15 9.75a.75.75 0 0 0-.75.75v.008c0 .414.336.75.75.75h.008a.75.75 0 0 0 .75-.75V10.5a.75.75 0 0 0-.75-.75H15Z" clipRule="evenodd"/></svg>
     );
   }
 );