@sparrowengg/integrations-templates-frontend 2.0.0 → 2.1.0-beta.1

package/dist/cjs/commons/icons/email-letter.js.map

@@ -1 +1 @@
-{"version":3,"file":"email-letter.js","sources":["../../../../src/commons/icons/email-letter.tsx"],"sourcesContent":["import React from \"react\";\n\nconst EmailLetterIcon = () => {\n  return (\n    <svg\n      width=\"20\"\n      height=\"20\"\n      viewBox=\"0 0 20 20\"\n      fill=\"none\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n    >\n      <path\n        d=\"M14.1667 3.75H5.83333C3.99238 3.75 2.5 5.24238 2.5 7.08333V12.9167C2.5 14.7576 3.99238 16.25 5.83333 16.25H14.1667C16.0076 16.25 17.5 14.7576 17.5 12.9167V7.08333C17.5 5.24238 16.0076 3.75 14.1667 3.75Z\"\n        stroke=\"#6A6A6A\"\n        stroke-width=\"1.5\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n      />\n      <path\n        d=\"M5.83337 7.48657L9.33723 9.01427C9.54658 9.10555 9.77245 9.15283 10.0008 9.15317C10.2292 9.15352 10.4552 9.10692 10.6648 9.01628L14.1667 7.50209\"\n        stroke=\"#6A6A6A\"\n        stroke-width=\"1.5\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n      />\n    </svg>\n  );\n};\n\nexport default EmailLetterIcon;\n"],"names":[],"mappings":";;;;;;AAEA,MAAM,kBAAkB,MAAM;AAC5B,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,KAAM,EAAA,IAAA;AAAA,MACN,MAAO,EAAA,IAAA;AAAA,MACP,OAAQ,EAAA,WAAA;AAAA,MACR,IAAK,EAAA,MAAA;AAAA,MACL,KAAM,EAAA,4BAAA;AAAA,KAAA;AAAA,oBAEN,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,4MAAA;AAAA,QACF,MAAO,EAAA,SAAA;AAAA,QACP,cAAa,EAAA,KAAA;AAAA,QACb,gBAAe,EAAA,OAAA;AAAA,QACf,iBAAgB,EAAA,OAAA;AAAA,OAAA;AAAA,KAClB;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,kJAAA;AAAA,QACF,MAAO,EAAA,SAAA;AAAA,QACP,cAAa,EAAA,KAAA;AAAA,QACb,gBAAe,EAAA,OAAA;AAAA,QACf,iBAAgB,EAAA,OAAA;AAAA,OAAA;AAAA,KAClB;AAAA,GACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"email-letter.js","sources":["../../../../src/commons/icons/email-letter.tsx"],"sourcesContent":["import React from 'react';\nimport { COLORS, ARIA_LABELS, ATTRIBUTES, COMPONENT_DISPLAY_NAMES } from '../constants/strings';\n\n/**\n * Props for the EmailLetterIcon component\n */\nexport interface EmailLetterIconProps {\n  /** Width of the icon */\n  width?: number | string;\n  /** Height of the icon */\n  height?: number | string;\n  /** Stroke color of the icon */\n  color?: string;\n  /** Stroke width */\n  strokeWidth?: number | string;\n  /** Optional: Additional CSS class name */\n  className?: string;\n  /** Optional: ARIA label for accessibility */\n  ariaLabel?: string;\n}\n\n/**\n * Default configuration for the email letter icon\n */\nconst DEFAULT_CONFIG = {\n  width: 20,\n  height: 20,\n  color: COLORS.ICON_GRAY,\n  strokeWidth: 1.5,\n} as const;\n\n/**\n * EmailLetterIcon Component\n * \n * An envelope/email icon with customizable size and color.\n * \n * @example\n * ```tsx\n * <EmailLetterIcon width={24} height={24} color=\"#000000\" />\n * ```\n */\nconst EmailLetterIcon: React.FC<EmailLetterIconProps> = ({\n  width = DEFAULT_CONFIG.width,\n  height = DEFAULT_CONFIG.height,\n  color = DEFAULT_CONFIG.color,\n  strokeWidth = DEFAULT_CONFIG.strokeWidth,\n  className,\n  ariaLabel = ARIA_LABELS.EMAIL,\n}) => {\n  return (\n    <svg\n      width={width}\n      height={height}\n      viewBox=\"0 0 20 20\"\n      fill=\"none\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      className={className}\n      aria-label={ariaLabel}\n      role={ATTRIBUTES.IMG}\n    >\n      <path\n        d=\"M14.1667 3.75H5.83333C3.99238 3.75 2.5 5.24238 2.5 7.08333V12.9167C2.5 14.7576 3.99238 16.25 5.83333 16.25H14.1667C16.0076 16.25 17.5 14.7576 17.5 12.9167V7.08333C17.5 5.24238 16.0076 3.75 14.1667 3.75Z\"\n        stroke={color}\n        strokeWidth={strokeWidth}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n      <path\n        d=\"M5.83337 7.48657L9.33723 9.01427C9.54658 9.10555 9.77245 9.15283 10.0008 9.15317C10.2292 9.15352 10.4552 9.10692 10.6648 9.01628L14.1667 7.50209\"\n        stroke={color}\n        strokeWidth={strokeWidth}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n    </svg>\n  );\n};\n\nEmailLetterIcon.displayName = COMPONENT_DISPLAY_NAMES.EMAIL_LETTER_ICON;\n\nexport default EmailLetterIcon;\n"],"names":["COLORS","ARIA_LABELS","ATTRIBUTES","COMPONENT_DISPLAY_NAMES"],"mappings":";;;;;;;AAwBA,MAAM,cAAiB,GAAA;AAAA,EACrB,KAAO,EAAA,EAAA;AAAA,EACP,MAAQ,EAAA,EAAA;AAAA,EACR,OAAOA,cAAO,CAAA,SAAA;AAAA,EACd,WAAa,EAAA,GAAA;AACf,CAAA,CAAA;AAYA,MAAM,kBAAkD,CAAC;AAAA,EACvD,QAAQ,cAAe,CAAA,KAAA;AAAA,EACvB,SAAS,cAAe,CAAA,MAAA;AAAA,EACxB,QAAQ,cAAe,CAAA,KAAA;AAAA,EACvB,cAAc,cAAe,CAAA,WAAA;AAAA,EAC7B,SAAA;AAAA,EACA,YAAYC,mBAAY,CAAA,KAAA;AAC1B,CAAM,KAAA;AACJ,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,KAAA;AAAA,MACA,MAAA;AAAA,MACA,OAAQ,EAAA,WAAA;AAAA,MACR,IAAK,EAAA,MAAA;AAAA,MACL,KAAM,EAAA,4BAAA;AAAA,MACN,SAAA;AAAA,MACA,YAAY,EAAA,SAAA;AAAA,MACZ,MAAMC,kBAAW,CAAA,GAAA;AAAA,KAAA;AAAA,oBAEjB,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,4MAAA;AAAA,QACF,MAAQ,EAAA,KAAA;AAAA,QACR,WAAA;AAAA,QACA,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,OAAA;AAAA,KACjB;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,kJAAA;AAAA,QACF,MAAQ,EAAA,KAAA;AAAA,QACR,WAAA;AAAA,QACA,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,OAAA;AAAA,KACjB;AAAA,GACF,CAAA;AAEJ,EAAA;AAEA,eAAA,CAAgB,cAAcC,+BAAwB,CAAA,iBAAA;;;;"}

package/dist/cjs/commons/icons/mapping.js

@@ -3,10 +3,19 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
+var strings = require('../constants/strings.js');
 
+const DEFAULT_CONFIG = {
+  size: 64,
+  color: strings.COLORS.ICON_GRAY_MEDIUM,
+  strokeWidth: 3
+};
 const MappingIcon = ({
-  size = " 64",
-  color = "#767676"
+  size = DEFAULT_CONFIG.size,
+  color = DEFAULT_CONFIG.color,
+  strokeWidth = DEFAULT_CONFIG.strokeWidth,
+  className,
+  ariaLabel = strings.ARIA_LABELS.MAPPING
 }) => {
   return /* @__PURE__ */ React.createElement(
     "svg",
@@ -15,10 +24,13 @@ const MappingIcon = ({
       height: size,
       viewBox: "0 0 64 64",
       fill: "none",
-      xmlns: "http://www.w3.org/2000/svg"
+      xmlns: "http://www.w3.org/2000/svg",
+      className,
+      "aria-label": ariaLabel,
+      role: strings.ATTRIBUTES.IMG
     },
-    /* @__PURE__ */ React.createElement("circle", { cx: "18", cy: "46", r: "6", stroke: color, strokeWidth: "3" }),
-    /* @__PURE__ */ React.createElement("circle", { cx: "46", cy: "18", r: "6", stroke: color, strokeWidth: "3" }),
+    /* @__PURE__ */ React.createElement("circle", { cx: "18", cy: "46", r: "6", stroke: color, strokeWidth }),
+    /* @__PURE__ */ React.createElement("circle", { cx: "46", cy: "18", r: "6", stroke: color, strokeWidth }),
     /* @__PURE__ */ React.createElement(
       "rect",
       {
@@ -28,7 +40,7 @@ const MappingIcon = ({
         height: "12",
         rx: "6",
         stroke: color,
-        strokeWidth: "3"
+        strokeWidth
       }
     ),
     /* @__PURE__ */ React.createElement(
@@ -41,7 +53,7 @@ const MappingIcon = ({
         rx: "1",
         transform: "rotate(135 26.4854 18)",
         stroke: color,
-        strokeWidth: "3"
+        strokeWidth
       }
     ),
     /* @__PURE__ */ React.createElement(
@@ -49,13 +61,14 @@ const MappingIcon = ({
       {
         d: "M40 17.9999C25.4998 17.9999 40.0002 46.0002 24 45.9999",
         stroke: color,
-        strokeWidth: "3"
+        strokeWidth
       }
     ),
-    /* @__PURE__ */ React.createElement("path", { d: "M18 25L18 40", stroke: color, strokeWidth: "3" }),
-    /* @__PURE__ */ React.createElement("path", { d: "M46 25L46 41", stroke: color, strokeWidth: "3" })
+    /* @__PURE__ */ React.createElement("path", { d: "M18 25L18 40", stroke: color, strokeWidth }),
+    /* @__PURE__ */ React.createElement("path", { d: "M46 25L46 41", stroke: color, strokeWidth })
   );
 };
+MappingIcon.displayName = strings.COMPONENT_DISPLAY_NAMES.MAPPING_ICON;
 
 exports.default = MappingIcon;
 //# sourceMappingURL=mapping.js.map

package/dist/cjs/commons/icons/mapping.js.map

@@ -1 +1 @@
-{"version":3,"file":"mapping.js","sources":["../../../../src/commons/icons/mapping.tsx"],"sourcesContent":["import React from \"react\";\n\nconst MappingIcon = ({\n  size = \" 64\",\n  color = \"#767676\"\n}: {\n  size?: number | string;\n  color?: string;\n}) => {\n  return (\n    <svg\n      width={size}\n      height={size}\n      viewBox=\"0 0 64 64\"\n      fill=\"none\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n    >\n      <circle cx=\"18\" cy=\"46\" r=\"6\" stroke={color} strokeWidth=\"3\" />\n      <circle cx=\"46\" cy=\"18\" r=\"6\" stroke={color} strokeWidth=\"3\" />\n      <rect\n        x=\"40\"\n        y=\"40\"\n        width=\"12\"\n        height=\"12\"\n        rx=\"6\"\n        stroke={color}\n        strokeWidth=\"3\"\n      />\n      <rect\n        x=\"26.4854\"\n        y=\"18\"\n        width=\"12\"\n        height=\"12\"\n        rx=\"1\"\n        transform=\"rotate(135 26.4854 18)\"\n        stroke={color}\n        strokeWidth=\"3\"\n      />\n      <path\n        d=\"M40 17.9999C25.4998 17.9999 40.0002 46.0002 24 45.9999\"\n        stroke={color}\n        strokeWidth=\"3\"\n      />\n      <path d=\"M18 25L18 40\" stroke={color} strokeWidth=\"3\" />\n      <path d=\"M46 25L46 41\" stroke={color} strokeWidth=\"3\" />\n    </svg>\n  );\n};\n\nexport default MappingIcon;\n"],"names":[],"mappings":";;;;;;AAEA,MAAM,cAAc,CAAC;AAAA,EACnB,IAAO,GAAA,KAAA;AAAA,EACP,KAAQ,GAAA,SAAA;AACV,CAGM,KAAA;AACJ,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,KAAO,EAAA,IAAA;AAAA,MACP,MAAQ,EAAA,IAAA;AAAA,MACR,OAAQ,EAAA,WAAA;AAAA,MACR,IAAK,EAAA,MAAA;AAAA,MACL,KAAM,EAAA,4BAAA;AAAA,KAAA;AAAA,oBAEN,KAAA,CAAA,aAAA,CAAC,QAAO,EAAA,EAAA,EAAA,EAAG,IAAK,EAAA,EAAA,EAAG,IAAK,EAAA,CAAA,EAAE,GAAI,EAAA,MAAA,EAAQ,KAAO,EAAA,WAAA,EAAY,GAAI,EAAA,CAAA;AAAA,oBAC7D,KAAA,CAAA,aAAA,CAAC,QAAO,EAAA,EAAA,EAAA,EAAG,IAAK,EAAA,EAAA,EAAG,IAAK,EAAA,CAAA,EAAE,GAAI,EAAA,MAAA,EAAQ,KAAO,EAAA,WAAA,EAAY,GAAI,EAAA,CAAA;AAAA,oBAC7D,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,IAAA;AAAA,QACF,CAAE,EAAA,IAAA;AAAA,QACF,KAAM,EAAA,IAAA;AAAA,QACN,MAAO,EAAA,IAAA;AAAA,QACP,EAAG,EAAA,GAAA;AAAA,QACH,MAAQ,EAAA,KAAA;AAAA,QACR,WAAY,EAAA,GAAA;AAAA,OAAA;AAAA,KACd;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,SAAA;AAAA,QACF,CAAE,EAAA,IAAA;AAAA,QACF,KAAM,EAAA,IAAA;AAAA,QACN,MAAO,EAAA,IAAA;AAAA,QACP,EAAG,EAAA,GAAA;AAAA,QACH,SAAU,EAAA,wBAAA;AAAA,QACV,MAAQ,EAAA,KAAA;AAAA,QACR,WAAY,EAAA,GAAA;AAAA,OAAA;AAAA,KACd;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,wDAAA;AAAA,QACF,MAAQ,EAAA,KAAA;AAAA,QACR,WAAY,EAAA,GAAA;AAAA,OAAA;AAAA,KACd;AAAA,wCACC,MAAK,EAAA,EAAA,CAAA,EAAE,gBAAe,MAAQ,EAAA,KAAA,EAAO,aAAY,GAAI,EAAA,CAAA;AAAA,wCACrD,MAAK,EAAA,EAAA,CAAA,EAAE,gBAAe,MAAQ,EAAA,KAAA,EAAO,aAAY,GAAI,EAAA,CAAA;AAAA,GACxD,CAAA;AAEJ;;;;"}
+{"version":3,"file":"mapping.js","sources":["../../../../src/commons/icons/mapping.tsx"],"sourcesContent":["import React from 'react';\nimport { COLORS, ARIA_LABELS, ATTRIBUTES, COMPONENT_DISPLAY_NAMES } from '../constants/strings';\n\n/**\n * Props for the MappingIcon component\n */\nexport interface MappingIconProps {\n  /** Size of the icon (width and height) */\n  size?: number | string;\n  /** Stroke color of the icon */\n  color?: string;\n  /** Stroke width */\n  strokeWidth?: number | string;\n  /** Optional: Additional CSS class name */\n  className?: string;\n  /** Optional: ARIA label for accessibility */\n  ariaLabel?: string;\n}\n\n/**\n * Default configuration for the mapping icon\n */\nconst DEFAULT_CONFIG = {\n  size: 64,\n  color: COLORS.ICON_GRAY_MEDIUM,\n  strokeWidth: 3,\n} as const;\n\n/**\n * MappingIcon Component\n * \n * A data mapping/connection icon with customizable size and color.\n * Shows interconnected nodes representing data relationships.\n * \n * @example\n * ```tsx\n * <MappingIcon size={48} color=\"#3B82F6\" />\n * ```\n */\nconst MappingIcon: React.FC<MappingIconProps> = ({\n  size = DEFAULT_CONFIG.size,\n  color = DEFAULT_CONFIG.color,\n  strokeWidth = DEFAULT_CONFIG.strokeWidth,\n  className,\n  ariaLabel = ARIA_LABELS.MAPPING,\n}) => {\n  return (\n    <svg\n      width={size}\n      height={size}\n      viewBox=\"0 0 64 64\"\n      fill=\"none\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      className={className}\n      aria-label={ariaLabel}\n      role={ATTRIBUTES.IMG}\n    >\n      <circle cx=\"18\" cy=\"46\" r=\"6\" stroke={color} strokeWidth={strokeWidth} />\n      <circle cx=\"46\" cy=\"18\" r=\"6\" stroke={color} strokeWidth={strokeWidth} />\n      <rect\n        x=\"40\"\n        y=\"40\"\n        width=\"12\"\n        height=\"12\"\n        rx=\"6\"\n        stroke={color}\n        strokeWidth={strokeWidth}\n      />\n      <rect\n        x=\"26.4854\"\n        y=\"18\"\n        width=\"12\"\n        height=\"12\"\n        rx=\"1\"\n        transform=\"rotate(135 26.4854 18)\"\n        stroke={color}\n        strokeWidth={strokeWidth}\n      />\n      <path\n        d=\"M40 17.9999C25.4998 17.9999 40.0002 46.0002 24 45.9999\"\n        stroke={color}\n        strokeWidth={strokeWidth}\n      />\n      <path d=\"M18 25L18 40\" stroke={color} strokeWidth={strokeWidth} />\n      <path d=\"M46 25L46 41\" stroke={color} strokeWidth={strokeWidth} />\n    </svg>\n  );\n};\n\nMappingIcon.displayName = COMPONENT_DISPLAY_NAMES.MAPPING_ICON;\n\nexport default MappingIcon;\n"],"names":["COLORS","ARIA_LABELS","ATTRIBUTES","COMPONENT_DISPLAY_NAMES"],"mappings":";;;;;;;AAsBA,MAAM,cAAiB,GAAA;AAAA,EACrB,IAAM,EAAA,EAAA;AAAA,EACN,OAAOA,cAAO,CAAA,gBAAA;AAAA,EACd,WAAa,EAAA,CAAA;AACf,CAAA,CAAA;AAaA,MAAM,cAA0C,CAAC;AAAA,EAC/C,OAAO,cAAe,CAAA,IAAA;AAAA,EACtB,QAAQ,cAAe,CAAA,KAAA;AAAA,EACvB,cAAc,cAAe,CAAA,WAAA;AAAA,EAC7B,SAAA;AAAA,EACA,YAAYC,mBAAY,CAAA,OAAA;AAC1B,CAAM,KAAA;AACJ,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,KAAO,EAAA,IAAA;AAAA,MACP,MAAQ,EAAA,IAAA;AAAA,MACR,OAAQ,EAAA,WAAA;AAAA,MACR,IAAK,EAAA,MAAA;AAAA,MACL,KAAM,EAAA,4BAAA;AAAA,MACN,SAAA;AAAA,MACA,YAAY,EAAA,SAAA;AAAA,MACZ,MAAMC,kBAAW,CAAA,GAAA;AAAA,KAAA;AAAA,oBAEjB,KAAA,CAAA,aAAA,CAAC,QAAO,EAAA,EAAA,EAAA,EAAG,IAAK,EAAA,EAAA,EAAG,MAAK,CAAE,EAAA,GAAA,EAAI,MAAQ,EAAA,KAAA,EAAO,WAA0B,EAAA,CAAA;AAAA,oBACvE,KAAA,CAAA,aAAA,CAAC,QAAO,EAAA,EAAA,EAAA,EAAG,IAAK,EAAA,EAAA,EAAG,MAAK,CAAE,EAAA,GAAA,EAAI,MAAQ,EAAA,KAAA,EAAO,WAA0B,EAAA,CAAA;AAAA,oBACvE,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,IAAA;AAAA,QACF,CAAE,EAAA,IAAA;AAAA,QACF,KAAM,EAAA,IAAA;AAAA,QACN,MAAO,EAAA,IAAA;AAAA,QACP,EAAG,EAAA,GAAA;AAAA,QACH,MAAQ,EAAA,KAAA;AAAA,QACR,WAAA;AAAA,OAAA;AAAA,KACF;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,SAAA;AAAA,QACF,CAAE,EAAA,IAAA;AAAA,QACF,KAAM,EAAA,IAAA;AAAA,QACN,MAAO,EAAA,IAAA;AAAA,QACP,EAAG,EAAA,GAAA;AAAA,QACH,SAAU,EAAA,wBAAA;AAAA,QACV,MAAQ,EAAA,KAAA;AAAA,QACR,WAAA;AAAA,OAAA;AAAA,KACF;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,wDAAA;AAAA,QACF,MAAQ,EAAA,KAAA;AAAA,QACR,WAAA;AAAA,OAAA;AAAA,KACF;AAAA,wCACC,MAAK,EAAA,EAAA,CAAA,EAAE,cAAe,EAAA,MAAA,EAAQ,OAAO,WAA0B,EAAA,CAAA;AAAA,wCAC/D,MAAK,EAAA,EAAA,CAAA,EAAE,cAAe,EAAA,MAAA,EAAQ,OAAO,WAA0B,EAAA,CAAA;AAAA,GAClE,CAAA;AAEJ,EAAA;AAEA,WAAA,CAAY,cAAcC,+BAAwB,CAAA,YAAA;;;;"}

package/dist/cjs/commons/icons/nested-add.js

@@ -3,23 +3,40 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
+var strings = require('../constants/strings.js');
 
-const NestedAddIcon = () => {
+const DEFAULT_CONFIG = {
+  width: 20,
+  height: 20,
+  color: strings.COLORS.ICON_GRAY,
+  strokeWidth: 1.5
+};
+const NestedAddIcon = ({
+  width = DEFAULT_CONFIG.width,
+  height = DEFAULT_CONFIG.height,
+  color = DEFAULT_CONFIG.color,
+  strokeWidth = DEFAULT_CONFIG.strokeWidth,
+  className,
+  ariaLabel = strings.ARIA_LABELS.ADD_NESTED_ITEM
+}) => {
   return /* @__PURE__ */ React.createElement(
     "svg",
     {
-      width: "20",
-      height: "20",
+      width,
+      height,
       viewBox: "0 0 20 20",
       fill: "none",
-      xmlns: "http://www.w3.org/2000/svg"
+      xmlns: "http://www.w3.org/2000/svg",
+      className,
+      "aria-label": ariaLabel,
+      role: strings.ATTRIBUTES.IMG
     },
     /* @__PURE__ */ React.createElement(
       "path",
       {
         d: "M2.56665 3.75H16.5625",
-        stroke: "#6A6A6A",
-        strokeWidth: "1.5",
+        stroke: color,
+        strokeWidth,
         strokeLinecap: "round",
         strokeLinejoin: "round"
       }
@@ -28,8 +45,8 @@ const NestedAddIcon = () => {
       "path",
       {
         d: "M2.56665 8.125H16.5625",
-        stroke: "#6A6A6A",
-        strokeWidth: "1.5",
+        stroke: color,
+        strokeWidth,
         strokeLinecap: "round",
         strokeLinejoin: "round"
       }
@@ -38,8 +55,8 @@ const NestedAddIcon = () => {
       "path",
       {
         d: "M2.56665 12.5H8.43749",
-        stroke: "#6A6A6A",
-        strokeWidth: "1.5",
+        stroke: color,
+        strokeWidth,
         strokeLinecap: "round",
         strokeLinejoin: "round"
       }
@@ -48,8 +65,8 @@ const NestedAddIcon = () => {
       "path",
       {
         d: "M13.75 17.9168V12.0835",
-        stroke: "#6A6A6A",
-        strokeWidth: "1.5",
+        stroke: color,
+        strokeWidth,
         strokeLinecap: "round",
         strokeLinejoin: "round"
       }
@@ -58,14 +75,15 @@ const NestedAddIcon = () => {
       "path",
       {
         d: "M16.6667 15H10.8333",
-        stroke: "#6A6A6A",
-        strokeWidth: "1.5",
+        stroke: color,
+        strokeWidth,
         strokeLinecap: "round",
         strokeLinejoin: "round"
       }
     )
   );
 };
+NestedAddIcon.displayName = strings.COMPONENT_DISPLAY_NAMES.NESTED_ADD_ICON;
 
 exports.default = NestedAddIcon;
 //# sourceMappingURL=nested-add.js.map

package/dist/cjs/commons/icons/nested-add.js.map

@@ -1 +1 @@
-{"version":3,"file":"nested-add.js","sources":["../../../../src/commons/icons/nested-add.tsx"],"sourcesContent":["import React from \"react\";\n\nconst NestedAddIcon = () => {\n  return (\n    <svg\n      width=\"20\"\n      height=\"20\"\n      viewBox=\"0 0 20 20\"\n      fill=\"none\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n    >\n      <path\n        d=\"M2.56665 3.75H16.5625\"\n        stroke=\"#6A6A6A\"\n        strokeWidth=\"1.5\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n      <path\n        d=\"M2.56665 8.125H16.5625\"\n        stroke=\"#6A6A6A\"\n        strokeWidth=\"1.5\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n      <path\n        d=\"M2.56665 12.5H8.43749\"\n        stroke=\"#6A6A6A\"\n        strokeWidth=\"1.5\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n      <path\n        d=\"M13.75 17.9168V12.0835\"\n        stroke=\"#6A6A6A\"\n        strokeWidth=\"1.5\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n      <path\n        d=\"M16.6667 15H10.8333\"\n        stroke=\"#6A6A6A\"\n        strokeWidth=\"1.5\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n    </svg>\n  );\n};\n\nexport default NestedAddIcon;\n"],"names":[],"mappings":";;;;;;AAEA,MAAM,gBAAgB,MAAM;AAC1B,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,KAAM,EAAA,IAAA;AAAA,MACN,MAAO,EAAA,IAAA;AAAA,MACP,OAAQ,EAAA,WAAA;AAAA,MACR,IAAK,EAAA,MAAA;AAAA,MACL,KAAM,EAAA,4BAAA;AAAA,KAAA;AAAA,oBAEN,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,uBAAA;AAAA,QACF,MAAO,EAAA,SAAA;AAAA,QACP,WAAY,EAAA,KAAA;AAAA,QACZ,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,OAAA;AAAA,KACjB;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,wBAAA;AAAA,QACF,MAAO,EAAA,SAAA;AAAA,QACP,WAAY,EAAA,KAAA;AAAA,QACZ,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,OAAA;AAAA,KACjB;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,uBAAA;AAAA,QACF,MAAO,EAAA,SAAA;AAAA,QACP,WAAY,EAAA,KAAA;AAAA,QACZ,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,OAAA;AAAA,KACjB;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,wBAAA;AAAA,QACF,MAAO,EAAA,SAAA;AAAA,QACP,WAAY,EAAA,KAAA;AAAA,QACZ,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,OAAA;AAAA,KACjB;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,qBAAA;AAAA,QACF,MAAO,EAAA,SAAA;AAAA,QACP,WAAY,EAAA,KAAA;AAAA,QACZ,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,OAAA;AAAA,KACjB;AAAA,GACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"nested-add.js","sources":["../../../../src/commons/icons/nested-add.tsx"],"sourcesContent":["import React from 'react';\nimport { COLORS, ARIA_LABELS, ATTRIBUTES, COMPONENT_DISPLAY_NAMES } from '../constants/strings';\n\n/**\n * Props for the NestedAddIcon component\n */\nexport interface NestedAddIconProps {\n  /** Width of the icon */\n  width?: number | string;\n  /** Height of the icon */\n  height?: number | string;\n  /** Stroke color of the icon */\n  color?: string;\n  /** Stroke width */\n  strokeWidth?: number | string;\n  /** Optional: Additional CSS class name */\n  className?: string;\n  /** Optional: ARIA label for accessibility */\n  ariaLabel?: string;\n}\n\n/**\n * Default configuration for the nested add icon\n */\nconst DEFAULT_CONFIG = {\n  width: 20,\n  height: 20,\n  color: COLORS.ICON_GRAY,\n  strokeWidth: 1.5,\n} as const;\n\n/**\n * NestedAddIcon Component\n * \n * An icon representing adding a nested item to a list.\n * Shows horizontal lines with a plus symbol.\n * \n * @example\n * ```tsx\n * <NestedAddIcon width={24} height={24} color=\"#10B981\" />\n * ```\n */\nconst NestedAddIcon: React.FC<NestedAddIconProps> = ({\n  width = DEFAULT_CONFIG.width,\n  height = DEFAULT_CONFIG.height,\n  color = DEFAULT_CONFIG.color,\n  strokeWidth = DEFAULT_CONFIG.strokeWidth,\n  className,\n  ariaLabel = ARIA_LABELS.ADD_NESTED_ITEM,\n}) => {\n  return (\n    <svg\n      width={width}\n      height={height}\n      viewBox=\"0 0 20 20\"\n      fill=\"none\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      className={className}\n      aria-label={ariaLabel}\n      role={ATTRIBUTES.IMG}\n    >\n      <path\n        d=\"M2.56665 3.75H16.5625\"\n        stroke={color}\n        strokeWidth={strokeWidth}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n      <path\n        d=\"M2.56665 8.125H16.5625\"\n        stroke={color}\n        strokeWidth={strokeWidth}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n      <path\n        d=\"M2.56665 12.5H8.43749\"\n        stroke={color}\n        strokeWidth={strokeWidth}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n      <path\n        d=\"M13.75 17.9168V12.0835\"\n        stroke={color}\n        strokeWidth={strokeWidth}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n      <path\n        d=\"M16.6667 15H10.8333\"\n        stroke={color}\n        strokeWidth={strokeWidth}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n    </svg>\n  );\n};\n\nNestedAddIcon.displayName = COMPONENT_DISPLAY_NAMES.NESTED_ADD_ICON;\n\nexport default NestedAddIcon;\n"],"names":["COLORS","ARIA_LABELS","ATTRIBUTES","COMPONENT_DISPLAY_NAMES"],"mappings":";;;;;;;AAwBA,MAAM,cAAiB,GAAA;AAAA,EACrB,KAAO,EAAA,EAAA;AAAA,EACP,MAAQ,EAAA,EAAA;AAAA,EACR,OAAOA,cAAO,CAAA,SAAA;AAAA,EACd,WAAa,EAAA,GAAA;AACf,CAAA,CAAA;AAaA,MAAM,gBAA8C,CAAC;AAAA,EACnD,QAAQ,cAAe,CAAA,KAAA;AAAA,EACvB,SAAS,cAAe,CAAA,MAAA;AAAA,EACxB,QAAQ,cAAe,CAAA,KAAA;AAAA,EACvB,cAAc,cAAe,CAAA,WAAA;AAAA,EAC7B,SAAA;AAAA,EACA,YAAYC,mBAAY,CAAA,eAAA;AAC1B,CAAM,KAAA;AACJ,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,KAAA;AAAA,MACA,MAAA;AAAA,MACA,OAAQ,EAAA,WAAA;AAAA,MACR,IAAK,EAAA,MAAA;AAAA,MACL,KAAM,EAAA,4BAAA;AAAA,MACN,SAAA;AAAA,MACA,YAAY,EAAA,SAAA;AAAA,MACZ,MAAMC,kBAAW,CAAA,GAAA;AAAA,KAAA;AAAA,oBAEjB,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,uBAAA;AAAA,QACF,MAAQ,EAAA,KAAA;AAAA,QACR,WAAA;AAAA,QACA,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,OAAA;AAAA,KACjB;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,wBAAA;AAAA,QACF,MAAQ,EAAA,KAAA;AAAA,QACR,WAAA;AAAA,QACA,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,OAAA;AAAA,KACjB;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,uBAAA;AAAA,QACF,MAAQ,EAAA,KAAA;AAAA,QACR,WAAA;AAAA,QACA,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,OAAA;AAAA,KACjB;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,wBAAA;AAAA,QACF,MAAQ,EAAA,KAAA;AAAA,QACR,WAAA;AAAA,QACA,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,OAAA;AAAA,KACjB;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,qBAAA;AAAA,QACF,MAAQ,EAAA,KAAA;AAAA,QACR,WAAA;AAAA,QACA,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,OAAA;AAAA,KACjB;AAAA,GACF,CAAA;AAEJ,EAAA;AAEA,aAAA,CAAc,cAAcC,+BAAwB,CAAA,eAAA;;;;"}

package/dist/cjs/commons/icons/sms.js

@@ -3,51 +3,69 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
+var strings = require('../constants/strings.js');
 
-const SMSIcon = () => {
+const DEFAULT_CONFIG = {
+  width: 20,
+  height: 20,
+  color: strings.COLORS.ICON_GRAY,
+  strokeWidth: 1.5
+};
+const SMSIcon = ({
+  width = DEFAULT_CONFIG.width,
+  height = DEFAULT_CONFIG.height,
+  color = DEFAULT_CONFIG.color,
+  strokeWidth = DEFAULT_CONFIG.strokeWidth,
+  className,
+  ariaLabel = strings.ARIA_LABELS.SMS
+}) => {
   return /* @__PURE__ */ React.createElement(
     "svg",
     {
-      width: "20",
-      height: "20",
+      width,
+      height,
       viewBox: "0 0 20 20",
       fill: "none",
-      xmlns: "http://www.w3.org/2000/svg"
+      xmlns: "http://www.w3.org/2000/svg",
+      className,
+      "aria-label": ariaLabel,
+      role: strings.ATTRIBUTES.IMG
     },
     /* @__PURE__ */ React.createElement(
       "path",
       {
-        "fill-rule": "evenodd",
-        "clip-rule": "evenodd",
+        fillRule: "evenodd",
+        clipRule: "evenodd",
         d: "M6.00005 14.3951H4.40005C3.51605 14.3951 2.80005 13.6791 2.80005 12.7951V4.79507C2.80005 3.91107 3.51605 3.19507 4.40005 3.19507H15.6C16.484 3.19507 17.2 3.91107 17.2 4.79507V12.7951C17.2 13.6791 16.484 14.3951 15.6 14.3951H10.7L7.33205 17.3911C6.81605 17.8503 6.00005 17.4839 6.00005 16.7935V14.3951Z",
-        stroke: "#6A6A6A",
-        "stroke-width": "1.5",
-        "stroke-linecap": "round",
-        "stroke-linejoin": "round"
+        stroke: color,
+        strokeWidth,
+        strokeLinecap: "round",
+        strokeLinejoin: "round"
       }
     ),
     /* @__PURE__ */ React.createElement(
       "path",
       {
         d: "M6 6.79185H14",
-        stroke: "#6A6A6A",
-        "stroke-width": "1.5",
-        "stroke-linecap": "round",
-        "stroke-linejoin": "round"
+        stroke: color,
+        strokeWidth,
+        strokeLinecap: "round",
+        strokeLinejoin: "round"
       }
     ),
     /* @__PURE__ */ React.createElement(
       "path",
       {
         d: "M6 10.3919H11.6",
-        stroke: "#6A6A6A",
-        "stroke-width": "1.5",
-        "stroke-linecap": "round",
-        "stroke-linejoin": "round"
+        stroke: color,
+        strokeWidth,
+        strokeLinecap: "round",
+        strokeLinejoin: "round"
       }
     )
   );
 };
+SMSIcon.displayName = strings.COMPONENT_DISPLAY_NAMES.SMS_ICON;
 
 exports.default = SMSIcon;
 //# sourceMappingURL=sms.js.map

package/dist/cjs/commons/icons/sms.js.map

@@ -1 +1 @@
-{"version":3,"file":"sms.js","sources":["../../../../src/commons/icons/sms.tsx"],"sourcesContent":["import React from \"react\";\n\nconst SMSIcon = () => {\n  return (\n    <svg\n      width=\"20\"\n      height=\"20\"\n      viewBox=\"0 0 20 20\"\n      fill=\"none\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n    >\n      <path\n        fill-rule=\"evenodd\"\n        clip-rule=\"evenodd\"\n        d=\"M6.00005 14.3951H4.40005C3.51605 14.3951 2.80005 13.6791 2.80005 12.7951V4.79507C2.80005 3.91107 3.51605 3.19507 4.40005 3.19507H15.6C16.484 3.19507 17.2 3.91107 17.2 4.79507V12.7951C17.2 13.6791 16.484 14.3951 15.6 14.3951H10.7L7.33205 17.3911C6.81605 17.8503 6.00005 17.4839 6.00005 16.7935V14.3951Z\"\n        stroke=\"#6A6A6A\"\n        stroke-width=\"1.5\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n      />\n      <path\n        d=\"M6 6.79185H14\"\n        stroke=\"#6A6A6A\"\n        stroke-width=\"1.5\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n      />\n      <path\n        d=\"M6 10.3919H11.6\"\n        stroke=\"#6A6A6A\"\n        stroke-width=\"1.5\"\n        stroke-linecap=\"round\"\n        stroke-linejoin=\"round\"\n      />\n    </svg>\n  );\n};\n\nexport default SMSIcon;\n"],"names":[],"mappings":";;;;;;AAEA,MAAM,UAAU,MAAM;AACpB,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,KAAM,EAAA,IAAA;AAAA,MACN,MAAO,EAAA,IAAA;AAAA,MACP,OAAQ,EAAA,WAAA;AAAA,MACR,IAAK,EAAA,MAAA;AAAA,MACL,KAAM,EAAA,4BAAA;AAAA,KAAA;AAAA,oBAEN,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,WAAU,EAAA,SAAA;AAAA,QACV,WAAU,EAAA,SAAA;AAAA,QACV,CAAE,EAAA,+SAAA;AAAA,QACF,MAAO,EAAA,SAAA;AAAA,QACP,cAAa,EAAA,KAAA;AAAA,QACb,gBAAe,EAAA,OAAA;AAAA,QACf,iBAAgB,EAAA,OAAA;AAAA,OAAA;AAAA,KAClB;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,eAAA;AAAA,QACF,MAAO,EAAA,SAAA;AAAA,QACP,cAAa,EAAA,KAAA;AAAA,QACb,gBAAe,EAAA,OAAA;AAAA,QACf,iBAAgB,EAAA,OAAA;AAAA,OAAA;AAAA,KAClB;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,iBAAA;AAAA,QACF,MAAO,EAAA,SAAA;AAAA,QACP,cAAa,EAAA,KAAA;AAAA,QACb,gBAAe,EAAA,OAAA;AAAA,QACf,iBAAgB,EAAA,OAAA;AAAA,OAAA;AAAA,KAClB;AAAA,GACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"sms.js","sources":["../../../../src/commons/icons/sms.tsx"],"sourcesContent":["import React from 'react';\nimport { COLORS, ARIA_LABELS, ATTRIBUTES, COMPONENT_DISPLAY_NAMES } from '../constants/strings';\n\n/**\n * Props for the SMSIcon component\n */\nexport interface SMSIconProps {\n  /** Width of the icon */\n  width?: number | string;\n  /** Height of the icon */\n  height?: number | string;\n  /** Stroke color of the icon */\n  color?: string;\n  /** Stroke width */\n  strokeWidth?: number | string;\n  /** Optional: Additional CSS class name */\n  className?: string;\n  /** Optional: ARIA label for accessibility */\n  ariaLabel?: string;\n}\n\n/**\n * Default configuration for the SMS icon\n */\nconst DEFAULT_CONFIG = {\n  width: 20,\n  height: 20,\n  color: COLORS.ICON_GRAY,\n  strokeWidth: 1.5,\n} as const;\n\n/**\n * SMSIcon Component\n * \n * A text message/SMS bubble icon with customizable size and color.\n * \n * @example\n * ```tsx\n * <SMSIcon width={24} height={24} color=\"#000000\" />\n * ```\n */\nconst SMSIcon: React.FC<SMSIconProps> = ({\n  width = DEFAULT_CONFIG.width,\n  height = DEFAULT_CONFIG.height,\n  color = DEFAULT_CONFIG.color,\n  strokeWidth = DEFAULT_CONFIG.strokeWidth,\n  className,\n  ariaLabel = ARIA_LABELS.SMS,\n}) => {\n  return (\n    <svg\n      width={width}\n      height={height}\n      viewBox=\"0 0 20 20\"\n      fill=\"none\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      className={className}\n      aria-label={ariaLabel}\n      role={ATTRIBUTES.IMG}\n    >\n      <path\n        fillRule=\"evenodd\"\n        clipRule=\"evenodd\"\n        d=\"M6.00005 14.3951H4.40005C3.51605 14.3951 2.80005 13.6791 2.80005 12.7951V4.79507C2.80005 3.91107 3.51605 3.19507 4.40005 3.19507H15.6C16.484 3.19507 17.2 3.91107 17.2 4.79507V12.7951C17.2 13.6791 16.484 14.3951 15.6 14.3951H10.7L7.33205 17.3911C6.81605 17.8503 6.00005 17.4839 6.00005 16.7935V14.3951Z\"\n        stroke={color}\n        strokeWidth={strokeWidth}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n      <path\n        d=\"M6 6.79185H14\"\n        stroke={color}\n        strokeWidth={strokeWidth}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n      <path\n        d=\"M6 10.3919H11.6\"\n        stroke={color}\n        strokeWidth={strokeWidth}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n    </svg>\n  );\n};\n\nSMSIcon.displayName = COMPONENT_DISPLAY_NAMES.SMS_ICON;\n\nexport default SMSIcon;\n"],"names":["COLORS","ARIA_LABELS","ATTRIBUTES","COMPONENT_DISPLAY_NAMES"],"mappings":";;;;;;;AAwBA,MAAM,cAAiB,GAAA;AAAA,EACrB,KAAO,EAAA,EAAA;AAAA,EACP,MAAQ,EAAA,EAAA;AAAA,EACR,OAAOA,cAAO,CAAA,SAAA;AAAA,EACd,WAAa,EAAA,GAAA;AACf,CAAA,CAAA;AAYA,MAAM,UAAkC,CAAC;AAAA,EACvC,QAAQ,cAAe,CAAA,KAAA;AAAA,EACvB,SAAS,cAAe,CAAA,MAAA;AAAA,EACxB,QAAQ,cAAe,CAAA,KAAA;AAAA,EACvB,cAAc,cAAe,CAAA,WAAA;AAAA,EAC7B,SAAA;AAAA,EACA,YAAYC,mBAAY,CAAA,GAAA;AAC1B,CAAM,KAAA;AACJ,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,KAAA;AAAA,MACA,MAAA;AAAA,MACA,OAAQ,EAAA,WAAA;AAAA,MACR,IAAK,EAAA,MAAA;AAAA,MACL,KAAM,EAAA,4BAAA;AAAA,MACN,SAAA;AAAA,MACA,YAAY,EAAA,SAAA;AAAA,MACZ,MAAMC,kBAAW,CAAA,GAAA;AAAA,KAAA;AAAA,oBAEjB,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,QAAS,EAAA,SAAA;AAAA,QACT,QAAS,EAAA,SAAA;AAAA,QACT,CAAE,EAAA,+SAAA;AAAA,QACF,MAAQ,EAAA,KAAA;AAAA,QACR,WAAA;AAAA,QACA,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,OAAA;AAAA,KACjB;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,eAAA;AAAA,QACF,MAAQ,EAAA,KAAA;AAAA,QACR,WAAA;AAAA,QACA,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,OAAA;AAAA,KACjB;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,iBAAA;AAAA,QACF,MAAQ,EAAA,KAAA;AAAA,QACR,WAAA;AAAA,QACA,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,OAAA;AAAA,KACjB;AAAA,GACF,CAAA;AAEJ,EAAA;AAEA,OAAA,CAAQ,cAAcC,+BAAwB,CAAA,QAAA;;;;"}

package/dist/cjs/commons/icons/sync.js

@@ -3,10 +3,117 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
+var strings = require('../constants/strings.js');
 
-const Sync = () => {
-  return /* @__PURE__ */ React.createElement("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ React.createElement("path", { d: "M12 3.99687C14.9302 3.99663 17.626 5.59833 19.027 8.17188", stroke: "#6A6A6A", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }), /* @__PURE__ */ React.createElement("path", { d: "M20 11.9961C20 16.4144 16.4183 19.9961 12 19.9961", stroke: "#6A6A6A", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }), /* @__PURE__ */ React.createElement("path", { d: "M11.9997 19.9961C9.06949 19.9963 6.37365 18.3946 4.97266 15.8211", stroke: "#6A6A6A", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }), /* @__PURE__ */ React.createElement("path", { d: "M4 11.9961C4 7.57781 7.58172 3.99609 12 3.99609", stroke: "#6A6A6A", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }), /* @__PURE__ */ React.createElement("path", { d: "M4.97266 15.8223C7.08447 19.7032 11.9425 21.1373 15.8235 19.0255C18.3979 17.6246 20.0001 14.9281 19.9997 11.9973", stroke: "#6A6A6A", strokeWidth: "1.5", "stroke-linecap": "round", strokeLinejoin: "round" }), /* @__PURE__ */ React.createElement("path", { d: "M4 11.9961V11.9949C4 7.57659 7.58172 3.99487 12 3.99487C14.9309 3.99487 17.6271 5.59755 19.0276 8.17217", stroke: "#6A6A6A", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }), /* @__PURE__ */ React.createElement("path", { d: "M8.04672 15.8234H4.51172V19.3594", stroke: "#6A6A6A", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }), /* @__PURE__ */ React.createElement("path", { d: "M15.9531 8.17188H19.4881V4.63587", stroke: "#6A6A6A", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }));
+const DEFAULT_CONFIG = {
+  width: 24,
+  height: 24,
+  color: strings.COLORS.ICON_GRAY,
+  strokeWidth: 1.5
 };
+const SyncIcon = ({
+  width = DEFAULT_CONFIG.width,
+  height = DEFAULT_CONFIG.height,
+  color = DEFAULT_CONFIG.color,
+  strokeWidth = DEFAULT_CONFIG.strokeWidth,
+  className,
+  ariaLabel = strings.ARIA_LABELS.SYNC
+}) => {
+  return /* @__PURE__ */ React.createElement(
+    "svg",
+    {
+      width,
+      height,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      className,
+      "aria-label": ariaLabel,
+      role: strings.ATTRIBUTES.IMG
+    },
+    /* @__PURE__ */ React.createElement(
+      "path",
+      {
+        d: "M12 3.99687C14.9302 3.99663 17.626 5.59833 19.027 8.17188",
+        stroke: color,
+        strokeWidth,
+        strokeLinecap: "round",
+        strokeLinejoin: "round"
+      }
+    ),
+    /* @__PURE__ */ React.createElement(
+      "path",
+      {
+        d: "M20 11.9961C20 16.4144 16.4183 19.9961 12 19.9961",
+        stroke: color,
+        strokeWidth,
+        strokeLinecap: "round",
+        strokeLinejoin: "round"
+      }
+    ),
+    /* @__PURE__ */ React.createElement(
+      "path",
+      {
+        d: "M11.9997 19.9961C9.06949 19.9963 6.37365 18.3946 4.97266 15.8211",
+        stroke: color,
+        strokeWidth,
+        strokeLinecap: "round",
+        strokeLinejoin: "round"
+      }
+    ),
+    /* @__PURE__ */ React.createElement(
+      "path",
+      {
+        d: "M4 11.9961C4 7.57781 7.58172 3.99609 12 3.99609",
+        stroke: color,
+        strokeWidth,
+        strokeLinecap: "round",
+        strokeLinejoin: "round"
+      }
+    ),
+    /* @__PURE__ */ React.createElement(
+      "path",
+      {
+        d: "M4.97266 15.8223C7.08447 19.7032 11.9425 21.1373 15.8235 19.0255C18.3979 17.6246 20.0001 14.9281 19.9997 11.9973",
+        stroke: color,
+        strokeWidth,
+        strokeLinecap: "round",
+        strokeLinejoin: "round"
+      }
+    ),
+    /* @__PURE__ */ React.createElement(
+      "path",
+      {
+        d: "M4 11.9961V11.9949C4 7.57659 7.58172 3.99487 12 3.99487C14.9309 3.99487 17.6271 5.59755 19.0276 8.17217",
+        stroke: color,
+        strokeWidth,
+        strokeLinecap: "round",
+        strokeLinejoin: "round"
+      }
+    ),
+    /* @__PURE__ */ React.createElement(
+      "path",
+      {
+        d: "M8.04672 15.8234H4.51172V19.3594",
+        stroke: color,
+        strokeWidth,
+        strokeLinecap: "round",
+        strokeLinejoin: "round"
+      }
+    ),
+    /* @__PURE__ */ React.createElement(
+      "path",
+      {
+        d: "M15.9531 8.17188H19.4881V4.63587",
+        stroke: color,
+        strokeWidth,
+        strokeLinecap: "round",
+        strokeLinejoin: "round"
+      }
+    )
+  );
+};
+SyncIcon.displayName = strings.COMPONENT_DISPLAY_NAMES.SYNC_ICON;
 
-exports.default = Sync;
+exports.default = SyncIcon;
 //# sourceMappingURL=sync.js.map

package/dist/cjs/commons/icons/sync.js.map

@@ -1 +1 @@
-{"version":3,"file":"sync.js","sources":["../../../../src/commons/icons/sync.tsx"],"sourcesContent":["import React from \"react\";\n\nconst Sync = () => {\n  return (\n    <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <path d=\"M12 3.99687C14.9302 3.99663 17.626 5.59833 19.027 8.17188\" stroke=\"#6A6A6A\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\"/>\n    <path d=\"M20 11.9961C20 16.4144 16.4183 19.9961 12 19.9961\" stroke=\"#6A6A6A\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\"/>\n    <path d=\"M11.9997 19.9961C9.06949 19.9963 6.37365 18.3946 4.97266 15.8211\" stroke=\"#6A6A6A\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\"/>\n    <path d=\"M4 11.9961C4 7.57781 7.58172 3.99609 12 3.99609\" stroke=\"#6A6A6A\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\"/>\n    <path d=\"M4.97266 15.8223C7.08447 19.7032 11.9425 21.1373 15.8235 19.0255C18.3979 17.6246 20.0001 14.9281 19.9997 11.9973\" stroke=\"#6A6A6A\" strokeWidth=\"1.5\" stroke-linecap=\"round\" strokeLinejoin=\"round\"/>\n    <path d=\"M4 11.9961V11.9949C4 7.57659 7.58172 3.99487 12 3.99487C14.9309 3.99487 17.6271 5.59755 19.0276 8.17217\" stroke=\"#6A6A6A\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\"/>\n    <path d=\"M8.04672 15.8234H4.51172V19.3594\" stroke=\"#6A6A6A\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\"/>\n    <path d=\"M15.9531 8.17188H19.4881V4.63587\" stroke=\"#6A6A6A\" strokeWidth=\"1.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\"/>\n    </svg>\n    \n  );\n};\n\nexport default Sync;\n"],"names":[],"mappings":";;;;;;AAEA,MAAM,OAAO,MAAM;AACjB,EACE,uBAAA,KAAA,CAAA,aAAA,CAAC,KAAI,EAAA,EAAA,KAAA,EAAM,IAAK,EAAA,MAAA,EAAO,MAAK,OAAQ,EAAA,WAAA,EAAY,IAAK,EAAA,MAAA,EAAO,KAAM,EAAA,4BAAA,EAAA,sCACjE,MAAK,EAAA,EAAA,CAAA,EAAE,2DAA4D,EAAA,MAAA,EAAO,SAAU,EAAA,WAAA,EAAY,KAAM,EAAA,aAAA,EAAc,OAAQ,EAAA,cAAA,EAAe,OAAO,EAAA,CAAA,kBAClJ,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAK,GAAE,mDAAoD,EAAA,MAAA,EAAO,SAAU,EAAA,WAAA,EAAY,KAAM,EAAA,aAAA,EAAc,OAAQ,EAAA,cAAA,EAAe,OAAO,EAAA,CAAA,kBAC1I,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAK,CAAE,EAAA,kEAAA,EAAmE,QAAO,SAAU,EAAA,WAAA,EAAY,KAAM,EAAA,aAAA,EAAc,OAAQ,EAAA,cAAA,EAAe,OAAO,EAAA,CAAA,kBACzJ,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAK,CAAE,EAAA,iDAAA,EAAkD,MAAO,EAAA,SAAA,EAAU,aAAY,KAAM,EAAA,aAAA,EAAc,OAAQ,EAAA,cAAA,EAAe,OAAO,EAAA,CAAA,kBACxI,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAK,CAAE,EAAA,kHAAA,EAAmH,MAAO,EAAA,SAAA,EAAU,WAAY,EAAA,KAAA,EAAM,kBAAe,OAAQ,EAAA,cAAA,EAAe,OAAO,EAAA,CAAA,kBAC1M,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAK,CAAE,EAAA,yGAAA,EAA0G,MAAO,EAAA,SAAA,EAAU,WAAY,EAAA,KAAA,EAAM,aAAc,EAAA,OAAA,EAAQ,gBAAe,OAAO,EAAA,CAAA,kBAChM,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAK,CAAE,EAAA,kCAAA,EAAmC,MAAO,EAAA,SAAA,EAAU,WAAY,EAAA,KAAA,EAAM,aAAc,EAAA,OAAA,EAAQ,cAAe,EAAA,OAAA,EAAO,mBACzH,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAK,CAAE,EAAA,kCAAA,EAAmC,MAAO,EAAA,SAAA,EAAU,WAAY,EAAA,KAAA,EAAM,aAAc,EAAA,OAAA,EAAQ,cAAe,EAAA,OAAA,EAAO,CAC1H,CAAA,CAAA;AAGJ;;;;"}
+{"version":3,"file":"sync.js","sources":["../../../../src/commons/icons/sync.tsx"],"sourcesContent":["import React from 'react';\nimport { COLORS, ARIA_LABELS, ATTRIBUTES, COMPONENT_DISPLAY_NAMES } from '../constants/strings';\n\n/**\n * Props for the SyncIcon component\n */\nexport interface SyncIconProps {\n  /** Width of the icon */\n  width?: number | string;\n  /** Height of the icon */\n  height?: number | string;\n  /** Stroke color of the icon */\n  color?: string;\n  /** Stroke width */\n  strokeWidth?: number | string;\n  /** Optional: Additional CSS class name */\n  className?: string;\n  /** Optional: ARIA label for accessibility */\n  ariaLabel?: string;\n}\n\n/**\n * Default configuration for the sync icon\n */\nconst DEFAULT_CONFIG = {\n  width: 24,\n  height: 24,\n  color: COLORS.ICON_GRAY,\n  strokeWidth: 1.5,\n} as const;\n\n/**\n * SyncIcon Component\n * \n * A circular sync/refresh icon with customizable size and color.\n * \n * @example\n * ```tsx\n * <SyncIcon width={28} height={28} color=\"#3B82F6\" />\n * ```\n */\nconst SyncIcon: React.FC<SyncIconProps> = ({\n  width = DEFAULT_CONFIG.width,\n  height = DEFAULT_CONFIG.height,\n  color = DEFAULT_CONFIG.color,\n  strokeWidth = DEFAULT_CONFIG.strokeWidth,\n  className,\n  ariaLabel = ARIA_LABELS.SYNC,\n}) => {\n  return (\n    <svg\n      width={width}\n      height={height}\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      className={className}\n      aria-label={ariaLabel}\n      role={ATTRIBUTES.IMG}\n    >\n      <path\n        d=\"M12 3.99687C14.9302 3.99663 17.626 5.59833 19.027 8.17188\"\n        stroke={color}\n        strokeWidth={strokeWidth}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n      <path\n        d=\"M20 11.9961C20 16.4144 16.4183 19.9961 12 19.9961\"\n        stroke={color}\n        strokeWidth={strokeWidth}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n      <path\n        d=\"M11.9997 19.9961C9.06949 19.9963 6.37365 18.3946 4.97266 15.8211\"\n        stroke={color}\n        strokeWidth={strokeWidth}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n      <path\n        d=\"M4 11.9961C4 7.57781 7.58172 3.99609 12 3.99609\"\n        stroke={color}\n        strokeWidth={strokeWidth}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n      <path\n        d=\"M4.97266 15.8223C7.08447 19.7032 11.9425 21.1373 15.8235 19.0255C18.3979 17.6246 20.0001 14.9281 19.9997 11.9973\"\n        stroke={color}\n        strokeWidth={strokeWidth}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n      <path\n        d=\"M4 11.9961V11.9949C4 7.57659 7.58172 3.99487 12 3.99487C14.9309 3.99487 17.6271 5.59755 19.0276 8.17217\"\n        stroke={color}\n        strokeWidth={strokeWidth}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n      <path\n        d=\"M8.04672 15.8234H4.51172V19.3594\"\n        stroke={color}\n        strokeWidth={strokeWidth}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n      <path\n        d=\"M15.9531 8.17188H19.4881V4.63587\"\n        stroke={color}\n        strokeWidth={strokeWidth}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n    </svg>\n  );\n};\n\nSyncIcon.displayName = COMPONENT_DISPLAY_NAMES.SYNC_ICON;\n\nexport default SyncIcon;\n"],"names":["COLORS","ARIA_LABELS","ATTRIBUTES","COMPONENT_DISPLAY_NAMES"],"mappings":";;;;;;;AAwBA,MAAM,cAAiB,GAAA;AAAA,EACrB,KAAO,EAAA,EAAA;AAAA,EACP,MAAQ,EAAA,EAAA;AAAA,EACR,OAAOA,cAAO,CAAA,SAAA;AAAA,EACd,WAAa,EAAA,GAAA;AACf,CAAA,CAAA;AAYA,MAAM,WAAoC,CAAC;AAAA,EACzC,QAAQ,cAAe,CAAA,KAAA;AAAA,EACvB,SAAS,cAAe,CAAA,MAAA;AAAA,EACxB,QAAQ,cAAe,CAAA,KAAA;AAAA,EACvB,cAAc,cAAe,CAAA,WAAA;AAAA,EAC7B,SAAA;AAAA,EACA,YAAYC,mBAAY,CAAA,IAAA;AAC1B,CAAM,KAAA;AACJ,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,KAAA;AAAA,MACA,MAAA;AAAA,MACA,OAAQ,EAAA,WAAA;AAAA,MACR,IAAK,EAAA,MAAA;AAAA,MACL,KAAM,EAAA,4BAAA;AAAA,MACN,SAAA;AAAA,MACA,YAAY,EAAA,SAAA;AAAA,MACZ,MAAMC,kBAAW,CAAA,GAAA;AAAA,KAAA;AAAA,oBAEjB,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,2DAAA;AAAA,QACF,MAAQ,EAAA,KAAA;AAAA,QACR,WAAA;AAAA,QACA,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,OAAA;AAAA,KACjB;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,mDAAA;AAAA,QACF,MAAQ,EAAA,KAAA;AAAA,QACR,WAAA;AAAA,QACA,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,OAAA;AAAA,KACjB;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,kEAAA;AAAA,QACF,MAAQ,EAAA,KAAA;AAAA,QACR,WAAA;AAAA,QACA,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,OAAA;AAAA,KACjB;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,iDAAA;AAAA,QACF,MAAQ,EAAA,KAAA;AAAA,QACR,WAAA;AAAA,QACA,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,OAAA;AAAA,KACjB;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,kHAAA;AAAA,QACF,MAAQ,EAAA,KAAA;AAAA,QACR,WAAA;AAAA,QACA,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,OAAA;AAAA,KACjB;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,yGAAA;AAAA,QACF,MAAQ,EAAA,KAAA;AAAA,QACR,WAAA;AAAA,QACA,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,OAAA;AAAA,KACjB;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,kCAAA;AAAA,QACF,MAAQ,EAAA,KAAA;AAAA,QACR,WAAA;AAAA,QACA,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,OAAA;AAAA,KACjB;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,kCAAA;AAAA,QACF,MAAQ,EAAA,KAAA;AAAA,QACR,WAAA;AAAA,QACA,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,OAAA;AAAA,KACjB;AAAA,GACF,CAAA;AAEJ,EAAA;AAEA,QAAA,CAAS,cAAcC,+BAAwB,CAAA,SAAA;;;;"}

package/dist/cjs/commons/icons/trash.js

@@ -3,23 +3,40 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
+var strings = require('../constants/strings.js');
 
-const Trash = () => {
+const DEFAULT_CONFIG = {
+  width: 16,
+  height: 18,
+  color: strings.COLORS.ICON_GRAY_DARK,
+  strokeWidth: 1.2
+};
+const TrashIcon = ({
+  width = DEFAULT_CONFIG.width,
+  height = DEFAULT_CONFIG.height,
+  color = DEFAULT_CONFIG.color,
+  strokeWidth = DEFAULT_CONFIG.strokeWidth,
+  className,
+  ariaLabel = strings.ARIA_LABELS.DELETE
+}) => {
   return /* @__PURE__ */ React.createElement(
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
-      width: "16",
-      height: "18",
+      width,
+      height,
       viewBox: "0 0 16 18",
-      fill: "none"
+      fill: "none",
+      className,
+      "aria-label": ariaLabel,
+      role: strings.ATTRIBUTES.IMG
     },
     /* @__PURE__ */ React.createElement(
       "path",
       {
         d: "M11.7842 16.5H4.21518C3.74279 16.5 3.28781 16.3217 2.94121 16.0007C2.59461 15.6798 2.38193 15.2398 2.3457 14.7688L2.3747 4.3125H13.6247L13.6537 14.7688C13.6175 15.2398 13.4048 15.6798 13.0582 16.0007C12.7116 16.3217 12.2566 16.5 11.7842 16.5Z",
-        stroke: "#64748B",
-        strokeWidth: "1.2",
+        stroke: color,
+        strokeWidth,
         strokeLinecap: "round",
         strokeLinejoin: "round"
       }
@@ -28,8 +45,8 @@ const Trash = () => {
       "path",
       {
         d: "M14.6663 4.3125H1.33301",
-        stroke: "#64748B",
-        strokeWidth: "1.2",
+        stroke: color,
+        strokeWidth,
         strokeLinecap: "round",
         strokeLinejoin: "round"
       }
@@ -38,8 +55,8 @@ const Trash = () => {
       "path",
       {
         d: "M5.65625 1.5H10.3437C10.5924 1.5 10.8308 1.59877 11.0067 1.77459C11.1825 1.9504 11.2812 2.18886 11.2812 2.4375V4.3125H4.71875V2.4375C4.71875 2.18886 4.81752 1.9504 4.99334 1.77459C5.16915 1.59877 5.40761 1.5 5.65625 1.5V1.5Z",
-        stroke: "#64748B",
-        strokeWidth: "1.2",
+        stroke: color,
+        strokeWidth,
         strokeLinecap: "round",
         strokeLinejoin: "round"
       }
@@ -48,8 +65,8 @@ const Trash = () => {
       "path",
       {
         d: "M9.64062 8.0625V12.75",
-        stroke: "#64748B",
-        strokeWidth: "1.2",
+        stroke: color,
+        strokeWidth,
         strokeLinecap: "round",
         strokeLinejoin: "round"
       }
@@ -58,14 +75,15 @@ const Trash = () => {
       "path",
       {
         d: "M6.3584 8.0625V12.75",
-        stroke: "#64748B",
-        strokeWidth: "1.2",
+        stroke: color,
+        strokeWidth,
         strokeLinecap: "round",
         strokeLinejoin: "round"
       }
     )
   );
 };
+TrashIcon.displayName = strings.COMPONENT_DISPLAY_NAMES.TRASH_ICON;
 
-exports.default = Trash;
+exports.default = TrashIcon;
 //# sourceMappingURL=trash.js.map

package/dist/cjs/commons/icons/trash.js.map

@@ -1 +1 @@
-{"version":3,"file":"trash.js","sources":["../../../../src/commons/icons/trash.tsx"],"sourcesContent":["import React from \"react\";\n\nconst Trash = () => {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"16\"\n      height=\"18\"\n      viewBox=\"0 0 16 18\"\n      fill=\"none\"\n    >\n      <path\n        d=\"M11.7842 16.5H4.21518C3.74279 16.5 3.28781 16.3217 2.94121 16.0007C2.59461 15.6798 2.38193 15.2398 2.3457 14.7688L2.3747 4.3125H13.6247L13.6537 14.7688C13.6175 15.2398 13.4048 15.6798 13.0582 16.0007C12.7116 16.3217 12.2566 16.5 11.7842 16.5Z\"\n        stroke=\"#64748B\"\n        strokeWidth=\"1.2\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n      <path\n        d=\"M14.6663 4.3125H1.33301\"\n        stroke=\"#64748B\"\n        strokeWidth=\"1.2\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n      <path\n        d=\"M5.65625 1.5H10.3437C10.5924 1.5 10.8308 1.59877 11.0067 1.77459C11.1825 1.9504 11.2812 2.18886 11.2812 2.4375V4.3125H4.71875V2.4375C4.71875 2.18886 4.81752 1.9504 4.99334 1.77459C5.16915 1.59877 5.40761 1.5 5.65625 1.5V1.5Z\"\n        stroke=\"#64748B\"\n        strokeWidth=\"1.2\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n      <path\n        d=\"M9.64062 8.0625V12.75\"\n        stroke=\"#64748B\"\n        strokeWidth=\"1.2\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n      <path\n        d=\"M6.3584 8.0625V12.75\"\n        stroke=\"#64748B\"\n        strokeWidth=\"1.2\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n    </svg>\n  );\n};\n\nexport default Trash;"],"names":[],"mappings":";;;;;;AAEA,MAAM,QAAQ,MAAM;AAClB,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,KAAM,EAAA,4BAAA;AAAA,MACN,KAAM,EAAA,IAAA;AAAA,MACN,MAAO,EAAA,IAAA;AAAA,MACP,OAAQ,EAAA,WAAA;AAAA,MACR,IAAK,EAAA,MAAA;AAAA,KAAA;AAAA,oBAEL,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,oPAAA;AAAA,QACF,MAAO,EAAA,SAAA;AAAA,QACP,WAAY,EAAA,KAAA;AAAA,QACZ,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,OAAA;AAAA,KACjB;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,yBAAA;AAAA,QACF,MAAO,EAAA,SAAA;AAAA,QACP,WAAY,EAAA,KAAA;AAAA,QACZ,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,OAAA;AAAA,KACjB;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,kOAAA;AAAA,QACF,MAAO,EAAA,SAAA;AAAA,QACP,WAAY,EAAA,KAAA;AAAA,QACZ,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,OAAA;AAAA,KACjB;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,uBAAA;AAAA,QACF,MAAO,EAAA,SAAA;AAAA,QACP,WAAY,EAAA,KAAA;AAAA,QACZ,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,OAAA;AAAA,KACjB;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,sBAAA;AAAA,QACF,MAAO,EAAA,SAAA;AAAA,QACP,WAAY,EAAA,KAAA;AAAA,QACZ,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,OAAA;AAAA,KACjB;AAAA,GACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"trash.js","sources":["../../../../src/commons/icons/trash.tsx"],"sourcesContent":["import React from 'react';\nimport { COLORS, ARIA_LABELS, ATTRIBUTES, COMPONENT_DISPLAY_NAMES } from '../constants/strings';\n\n/**\n * Props for the TrashIcon component\n */\nexport interface TrashIconProps {\n  /** Width of the icon */\n  width?: number | string;\n  /** Height of the icon */\n  height?: number | string;\n  /** Stroke color of the icon */\n  color?: string;\n  /** Stroke width */\n  strokeWidth?: number | string;\n  /** Optional: Additional CSS class name */\n  className?: string;\n  /** Optional: ARIA label for accessibility */\n  ariaLabel?: string;\n}\n\n/**\n * Default configuration for the trash icon\n */\nconst DEFAULT_CONFIG = {\n  width: 16,\n  height: 18,\n  color: COLORS.ICON_GRAY_DARK,\n  strokeWidth: 1.2,\n} as const;\n\n/**\n * TrashIcon Component\n * \n * A trash/delete icon with customizable size and color.\n * \n * @example\n * ```tsx\n * <TrashIcon width={20} height={22} color=\"#EF4444\" />\n * ```\n */\nconst TrashIcon: React.FC<TrashIconProps> = ({\n  width = DEFAULT_CONFIG.width,\n  height = DEFAULT_CONFIG.height,\n  color = DEFAULT_CONFIG.color,\n  strokeWidth = DEFAULT_CONFIG.strokeWidth,\n  className,\n  ariaLabel = ARIA_LABELS.DELETE,\n}) => {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width={width}\n      height={height}\n      viewBox=\"0 0 16 18\"\n      fill=\"none\"\n      className={className}\n      aria-label={ariaLabel}\n      role={ATTRIBUTES.IMG}\n    >\n      <path\n        d=\"M11.7842 16.5H4.21518C3.74279 16.5 3.28781 16.3217 2.94121 16.0007C2.59461 15.6798 2.38193 15.2398 2.3457 14.7688L2.3747 4.3125H13.6247L13.6537 14.7688C13.6175 15.2398 13.4048 15.6798 13.0582 16.0007C12.7116 16.3217 12.2566 16.5 11.7842 16.5Z\"\n        stroke={color}\n        strokeWidth={strokeWidth}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n      <path\n        d=\"M14.6663 4.3125H1.33301\"\n        stroke={color}\n        strokeWidth={strokeWidth}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n      <path\n        d=\"M5.65625 1.5H10.3437C10.5924 1.5 10.8308 1.59877 11.0067 1.77459C11.1825 1.9504 11.2812 2.18886 11.2812 2.4375V4.3125H4.71875V2.4375C4.71875 2.18886 4.81752 1.9504 4.99334 1.77459C5.16915 1.59877 5.40761 1.5 5.65625 1.5V1.5Z\"\n        stroke={color}\n        strokeWidth={strokeWidth}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n      <path\n        d=\"M9.64062 8.0625V12.75\"\n        stroke={color}\n        strokeWidth={strokeWidth}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n      <path\n        d=\"M6.3584 8.0625V12.75\"\n        stroke={color}\n        strokeWidth={strokeWidth}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n    </svg>\n  );\n};\n\nTrashIcon.displayName = COMPONENT_DISPLAY_NAMES.TRASH_ICON;\n\nexport default TrashIcon;"],"names":["COLORS","ARIA_LABELS","ATTRIBUTES","COMPONENT_DISPLAY_NAMES"],"mappings":";;;;;;;AAwBA,MAAM,cAAiB,GAAA;AAAA,EACrB,KAAO,EAAA,EAAA;AAAA,EACP,MAAQ,EAAA,EAAA;AAAA,EACR,OAAOA,cAAO,CAAA,cAAA;AAAA,EACd,WAAa,EAAA,GAAA;AACf,CAAA,CAAA;AAYA,MAAM,YAAsC,CAAC;AAAA,EAC3C,QAAQ,cAAe,CAAA,KAAA;AAAA,EACvB,SAAS,cAAe,CAAA,MAAA;AAAA,EACxB,QAAQ,cAAe,CAAA,KAAA;AAAA,EACvB,cAAc,cAAe,CAAA,WAAA;AAAA,EAC7B,SAAA;AAAA,EACA,YAAYC,mBAAY,CAAA,MAAA;AAC1B,CAAM,KAAA;AACJ,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,KAAM,EAAA,4BAAA;AAAA,MACN,KAAA;AAAA,MACA,MAAA;AAAA,MACA,OAAQ,EAAA,WAAA;AAAA,MACR,IAAK,EAAA,MAAA;AAAA,MACL,SAAA;AAAA,MACA,YAAY,EAAA,SAAA;AAAA,MACZ,MAAMC,kBAAW,CAAA,GAAA;AAAA,KAAA;AAAA,oBAEjB,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,oPAAA;AAAA,QACF,MAAQ,EAAA,KAAA;AAAA,QACR,WAAA;AAAA,QACA,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,OAAA;AAAA,KACjB;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,yBAAA;AAAA,QACF,MAAQ,EAAA,KAAA;AAAA,QACR,WAAA;AAAA,QACA,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,OAAA;AAAA,KACjB;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,kOAAA;AAAA,QACF,MAAQ,EAAA,KAAA;AAAA,QACR,WAAA;AAAA,QACA,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,OAAA;AAAA,KACjB;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,uBAAA;AAAA,QACF,MAAQ,EAAA,KAAA;AAAA,QACR,WAAA;AAAA,QACA,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,OAAA;AAAA,KACjB;AAAA,oBACA,KAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,sBAAA;AAAA,QACF,MAAQ,EAAA,KAAA;AAAA,QACR,WAAA;AAAA,QACA,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,OAAA;AAAA,KACjB;AAAA,GACF,CAAA;AAEJ,EAAA;AAEA,SAAA,CAAU,cAAcC,+BAAwB,CAAA,UAAA;;;;"}