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

package/dist/es/commons/helpers/index.js

@@ -1,3 +1,5 @@
+import { HELPER_STRINGS, PLACEHOLDERS } from '../constants/strings.js';
+
 var __defProp = Object.defineProperty;
 var __defProps = Object.defineProperties;
 var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
@@ -17,50 +19,84 @@ var __spreadValues = (a, b) => {
   return a;
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+const MAPPING_TYPES = {
+  QUESTION: HELPER_STRINGS.MAPPING_TYPES.QUESTION,
+  CONTACT: HELPER_STRINGS.MAPPING_TYPES.CONTACT,
+  VARIABLE: HELPER_STRINGS.MAPPING_TYPES.VARIABLE,
+  EXPRESSION: HELPER_STRINGS.MAPPING_TYPES.EXPRESSION,
+  SUBMISSION_PROPERTY: HELPER_STRINGS.MAPPING_TYPES.SUBMISSION_PROPERTY
+};
+const SURVEY_TYPES = {
+  CLASSIC_FORM: HELPER_STRINGS.SURVEY_TYPES.CLASSIC_FORM
+};
+const EXCLUDED_QUESTION_TYPES = HELPER_STRINGS.EXCLUDED_QUESTION_TYPES;
+const EXCLUDED_CONTACT_PROPERTIES = HELPER_STRINGS.EXCLUDED_CONTACT_PROPERTIES;
 const handleMappingOptions = (mappingType, surveyQuestions, contactProperties, surveyVariables, expressions, integrationsNpsSubmissionProperties, integrationsClassicSubmissionProperties, surveyType) => {
-  let currentOption;
   switch (mappingType) {
-    case "QUESTION":
-      const filteredQuestions = surveyQuestions.filter((question) => (question == null ? void 0 : question.type) !== "Message" && (question == null ? void 0 : question.type) !== "PaymentQuestion");
-      currentOption = handleQuestionOptions(filteredQuestions);
-      break;
-    case "CONTACT":
-      const filteredContactProperties = contactProperties.filter((contact) => (contact == null ? void 0 : contact.name) !== "team_internal" && (contact == null ? void 0 : contact.name) !== "department_internal");
-      currentOption = filteredContactProperties.map((contact) => ({
-        label: contact.label,
-        value: contact.name
-      }));
-      break;
-    case "VARIABLE":
-      currentOption = surveyVariables.map((varibles) => ({
-        name: varibles.name,
-        label: varibles.label,
-        value: varibles.id
-      }));
-      break;
-    case "EXPRESSION":
-      currentOption = expressions.map((expression) => ({
-        label: expression.name,
-        value: expression.id
-      }));
-      break;
-    case "SUBMISSION_PROPERTY":
-      currentOption = (surveyType == null ? void 0 : surveyType.toLocaleLowerCase()) === "classicform" ? integrationsClassicSubmissionProperties : integrationsNpsSubmissionProperties;
-      break;
+    case MAPPING_TYPES.QUESTION:
+      return handleQuestionOptions(filterQuestions(surveyQuestions));
+    case MAPPING_TYPES.CONTACT:
+      return filterContactProperties(contactProperties);
+    case MAPPING_TYPES.VARIABLE:
+      return mapVariables(surveyVariables);
+    case MAPPING_TYPES.EXPRESSION:
+      return mapExpressions(expressions);
+    case MAPPING_TYPES.SUBMISSION_PROPERTY:
+      return selectSubmissionProperties(
+        surveyType,
+        integrationsNpsSubmissionProperties,
+        integrationsClassicSubmissionProperties
+      );
     default:
-      currentOption = [];
+      console.warn(HELPER_STRINGS.CONSOLE_MESSAGES.UNKNOWN_MAPPING_TYPE(mappingType));
+      return [];
   }
-  return currentOption;
+};
+const filterQuestions = (questions) => {
+  return questions.filter(
+    (question) => (question == null ? void 0 : question.type) && !EXCLUDED_QUESTION_TYPES.includes(question.type)
+  );
+};
+const filterContactProperties = (contactProperties) => {
+  return contactProperties.filter(
+    (contact) => (contact == null ? void 0 : contact.name) && !EXCLUDED_CONTACT_PROPERTIES.includes(contact.name)
+  ).map((contact) => ({
+    label: contact.label,
+    value: contact.name
+  }));
+};
+const mapVariables = (variables) => {
+  return variables.map((variable) => ({
+    name: variable.name,
+    label: variable.label,
+    value: variable.id
+  }));
+};
+const mapExpressions = (expressions) => {
+  return expressions.map((expression) => ({
+    label: expression.name,
+    value: expression.id
+  }));
+};
+const selectSubmissionProperties = (surveyType, npsProperties, classicProperties) => {
+  return (surveyType == null ? void 0 : surveyType.toLowerCase()) === SURVEY_TYPES.CLASSIC_FORM ? classicProperties : npsProperties;
 };
 const handleQuestionOptions = (surveyQuestions) => {
-  const data = surveyQuestions.map((val) => {
-    return __spreadValues({}, val);
-  });
-  const groupedData = data.reduce((result, item) => {
+  const data = surveyQuestions.map((val) => __spreadValues({}, val));
+  const groupedData = groupQuestionsByLabel(data);
+  const ungroupedQuestions = extractUngroupedQuestions(data, groupedData);
+  const filteredData = formatUngroupedQuestions(ungroupedQuestions);
+  const formattedGroupedData = formatGroupedQuestions(groupedData);
+  return [...filteredData, ...formattedGroupedData];
+};
+const groupQuestionsByLabel = (questions) => {
+  return questions.reduce((result, item) => {
+    if (!item.label)
+      return result;
     const existingGroup = result.find((group) => group.label === item.label);
     if (existingGroup) {
       existingGroup.options.push(...item.options || []);
-    } else if (item.label) {
+    } else {
       result.push({
         label: item.label,
         options: item.options || []
@@ -68,31 +104,36 @@ const handleQuestionOptions = (surveyQuestions) => {
     }
     return result;
   }, []);
-  const updatedData = data == null ? void 0 : data.filter((question) => {
-    if (!groupedData.some((data2) => data2.label === question.rtxt)) {
-      return question;
-    }
-  });
-  const filteredData = updatedData == null ? void 0 : updatedData.filter((item) => !item.label).map((question) => {
+};
+const extractUngroupedQuestions = (questions, groupedData) => {
+  return questions.filter(
+    (question) => !groupedData.some((group) => group.label === question.rtxt)
+  );
+};
+const formatUngroupedQuestions = (questions) => {
+  return questions.filter((item) => !item.label).map((question) => {
     var _a;
     return {
-      label: !!((_a = question.rtxt) == null ? void 0 : _a.length) ? question.rtxt : "Please enter your question",
+      label: ((_a = question.rtxt) == null ? void 0 : _a.length) ? question.rtxt : PLACEHOLDERS.PLEASE_ENTER_YOUR_QUESTION,
       value: question.id,
       questionType: question.type
     };
   });
-  const formattedData = [
-    ...filteredData,
-    ...groupedData.map((data2) => __spreadProps(__spreadValues({}, data2), {
-      options: data2.options.map((option) => __spreadProps(__spreadValues({}, option), {
-        label: `- ${option.label}`
-      }))
-    }))
-  ];
-  return formattedData;
+};
+const formatGroupedQuestions = (groupedData) => {
+  return groupedData.map((data) => __spreadProps(__spreadValues({}, data), {
+    label: data.label,
+    options: data.options.map((option) => __spreadProps(__spreadValues({}, option), {
+      label: `${HELPER_STRINGS.LABEL_PREFIX}${option.label}`
+    })),
+    value: data.label
+    // Add value field for consistency
+  }));
 };
 const generateUniqueId = () => {
-  return `id-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
+  const timestamp = Date.now();
+  const randomStr = Math.random().toString(36).substring(2, 11);
+  return `${HELPER_STRINGS.ID_PREFIX}${timestamp}-${randomStr}`;
 };
 
 export { generateUniqueId, handleMappingOptions };

package/dist/es/commons/helpers/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/commons/helpers/index.ts"],"sourcesContent":["import { ResultGroupDataOptionsType, ResultGroupDataType } from \"../../mapping/types\";\n\nexport const handleMappingOptions = (\n  mappingType: string,\n  surveyQuestions: Array<any>,\n  contactProperties: Array<any>,\n  surveyVariables: Array<any>,\n  expressions: Array<any>,\n  integrationsNpsSubmissionProperties: Array<any>,\n  integrationsClassicSubmissionProperties: Array<any>,\n  surveyType: string\n) => {\n  let currentOption;\n  switch (mappingType) {\n    case \"QUESTION\":\n      const filteredQuestions = surveyQuestions.filter((question) => question?.type !== \"Message\" && question?.type !== \"PaymentQuestion\");\n      currentOption = handleQuestionOptions(filteredQuestions);\n      break;\n    case \"CONTACT\":\n      const filteredContactProperties = contactProperties.filter((contact) => contact?.name !== \"team_internal\" && contact?.name !== \"department_internal\");\n      currentOption = filteredContactProperties.map((contact) => ({\n        label: contact.label,\n        value: contact.name\n      }));\n      break;\n    case \"VARIABLE\":\n      currentOption = surveyVariables.map((varibles) => ({\n        name: varibles.name,\n        label: varibles.label,\n        value: varibles.id\n      }));\n      break;\n    case \"EXPRESSION\":\n      currentOption = expressions.map((expression) => ({\n        label: expression.name,\n        value: expression.id\n      }));\n      break;\n      case \"SUBMISSION_PROPERTY\":\n        currentOption = surveyType?.toLocaleLowerCase() === \"classicform\" ? integrationsClassicSubmissionProperties : integrationsNpsSubmissionProperties;\n        break;\n    default:\n      currentOption = [];\n  }\n\n  return currentOption;\n};\n\nconst handleQuestionOptions = (surveyQuestions: Array<any>) => {\n  const data = surveyQuestions.map((val) => {\n    return { ...val };\n  });\n  const groupedData = data.reduce((result, item) => {\n    const existingGroup = result.find((group: ResultGroupDataType) => group.label === item.label);\n\n    if (existingGroup) {\n      existingGroup.options.push(...(item.options || []));\n    } else if (item.label) {\n      result.push({\n        label: item.label,\n        options: item.options || []\n      });\n    }\n    return result;\n  }, []);\n\n  // Extract other data\n  const updatedData = data?.filter((question) => {\n    if (!groupedData.some((data: ResultGroupDataType) => data.label === question.rtxt)) {\n      return question;\n    }\n  });\n\n  const filteredData = updatedData\n    ?.filter((item) => !item.label)\n    .map((question) => ({\n      label: !!question.rtxt?.length  ? question.rtxt  :'Please enter your question',\n      value: question.id,\n      questionType: question.type\n    }));\n\n  const formattedData = [\n    ...filteredData,\n    ...groupedData.map((data: ResultGroupDataType) => ({\n      ...data,\n      options: data.options\n        .map((option: ResultGroupDataOptionsType) => ({\n          ...option,\n          label: `- ${option.label}`\n        }))\n    }))\n  ];\n  return formattedData;\n};\n\n\nexport const generateUniqueId = (): string => {\n  return `id-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;\n};"],"names":["data"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../src/commons/helpers/index.ts"],"sourcesContent":["import { ResultGroupDataOptionsType, ResultGroupDataType } from '../../mapping/types';\nimport { HELPER_STRINGS, PLACEHOLDERS } from '../constants/strings';\n\n/**\n * Mapping type constants\n */\nconst MAPPING_TYPES = {\n  QUESTION: HELPER_STRINGS.MAPPING_TYPES.QUESTION,\n  CONTACT: HELPER_STRINGS.MAPPING_TYPES.CONTACT,\n  VARIABLE: HELPER_STRINGS.MAPPING_TYPES.VARIABLE,\n  EXPRESSION: HELPER_STRINGS.MAPPING_TYPES.EXPRESSION,\n  SUBMISSION_PROPERTY: HELPER_STRINGS.MAPPING_TYPES.SUBMISSION_PROPERTY,\n} as const;\n\n/**\n * Survey type constants\n */\nconst SURVEY_TYPES = {\n  CLASSIC_FORM: HELPER_STRINGS.SURVEY_TYPES.CLASSIC_FORM,\n} as const;\n\n/**\n * Question types to exclude from mapping options\n */\nconst EXCLUDED_QUESTION_TYPES = HELPER_STRINGS.EXCLUDED_QUESTION_TYPES;\n\n/**\n * Contact properties to exclude from mapping options\n */\nconst EXCLUDED_CONTACT_PROPERTIES = HELPER_STRINGS.EXCLUDED_CONTACT_PROPERTIES;\n\n/**\n * Survey question interface\n */\ninterface SurveyQuestion {\n  id: string | number;\n  type: string;\n  label?: string;\n  rtxt?: string;\n  options?: unknown[];\n  [key: string]: unknown;\n}\n\n/**\n * Contact property interface\n */\ninterface ContactProperty {\n  name: string;\n  label: string;\n  [key: string]: unknown;\n}\n\n/**\n * Survey variable interface\n */\ninterface SurveyVariable {\n  id: string | number;\n  name: string;\n  label: string;\n  [key: string]: unknown;\n}\n\n/**\n * Expression interface\n */\ninterface Expression {\n  id: string | number;\n  name: string;\n  [key: string]: unknown;\n}\n\n/**\n * Mapped option interface\n */\ninterface MappedOption {\n  label: string;\n  value: string | number;\n  name?: string;\n  questionType?: string;\n  options?: unknown[];\n}\n\n/**\n * Handle mapping options based on mapping type\n * \n * @param mappingType - Type of mapping (QUESTION, CONTACT, VARIABLE, etc.)\n * @param surveyQuestions - Array of survey questions\n * @param contactProperties - Array of contact properties\n * @param surveyVariables - Array of survey variables\n * @param expressions - Array of expressions\n * @param integrationsNpsSubmissionProperties - NPS submission properties\n * @param integrationsClassicSubmissionProperties - Classic form submission properties\n * @param surveyType - Type of survey\n * @returns Array of mapped options\n */\nexport const handleMappingOptions = (\n  mappingType: string,\n  surveyQuestions: SurveyQuestion[],\n  contactProperties: ContactProperty[],\n  surveyVariables: SurveyVariable[],\n  expressions: Expression[],\n  integrationsNpsSubmissionProperties: unknown[],\n  integrationsClassicSubmissionProperties: unknown[],\n  surveyType: string\n): MappedOption[] => {\n  switch (mappingType) {\n    case MAPPING_TYPES.QUESTION:\n      return handleQuestionOptions(filterQuestions(surveyQuestions));\n\n    case MAPPING_TYPES.CONTACT:\n      return filterContactProperties(contactProperties);\n\n    case MAPPING_TYPES.VARIABLE:\n      return mapVariables(surveyVariables);\n\n    case MAPPING_TYPES.EXPRESSION:\n      return mapExpressions(expressions);\n\n    case MAPPING_TYPES.SUBMISSION_PROPERTY:\n      return selectSubmissionProperties(\n        surveyType,\n        integrationsNpsSubmissionProperties,\n        integrationsClassicSubmissionProperties\n      );\n\n    default:\n      console.warn(HELPER_STRINGS.CONSOLE_MESSAGES.UNKNOWN_MAPPING_TYPE(mappingType));\n      return [];\n  }\n};\n\n/**\n * Filter out excluded question types\n */\nconst filterQuestions = (questions: SurveyQuestion[]): SurveyQuestion[] => {\n  return questions.filter(\n    (question) =>\n      question?.type &&\n      !EXCLUDED_QUESTION_TYPES.includes(question.type as typeof EXCLUDED_QUESTION_TYPES[number])\n  );\n};\n\n/**\n * Filter and map contact properties\n */\nconst filterContactProperties = (contactProperties: ContactProperty[]): MappedOption[] => {\n  return contactProperties\n    .filter(\n      (contact) =>\n        contact?.name &&\n        !EXCLUDED_CONTACT_PROPERTIES.includes(contact.name as typeof EXCLUDED_CONTACT_PROPERTIES[number])\n    )\n    .map((contact) => ({\n      label: contact.label,\n      value: contact.name,\n    }));\n};\n\n/**\n * Map survey variables to options\n */\nconst mapVariables = (variables: SurveyVariable[]): MappedOption[] => {\n  return variables.map((variable) => ({\n    name: variable.name,\n    label: variable.label,\n    value: variable.id,\n  }));\n};\n\n/**\n * Map expressions to options\n */\nconst mapExpressions = (expressions: Expression[]): MappedOption[] => {\n  return expressions.map((expression) => ({\n    label: expression.name,\n    value: expression.id,\n  }));\n};\n\n/**\n * Select appropriate submission properties based on survey type\n */\nconst selectSubmissionProperties = (\n  surveyType: string,\n  npsProperties: unknown[],\n  classicProperties: unknown[]\n): unknown[] => {\n  return surveyType?.toLowerCase() === SURVEY_TYPES.CLASSIC_FORM\n    ? classicProperties\n    : npsProperties;\n};\n\n/**\n * Handle question options with grouping logic\n */\nconst handleQuestionOptions = (surveyQuestions: SurveyQuestion[]): MappedOption[] => {\n  // Create a deep copy to avoid mutations\n  const data = surveyQuestions.map((val) => ({ ...val }));\n\n  // Group questions by label\n  const groupedData = groupQuestionsByLabel(data);\n\n  // Extract ungrouped questions\n  const ungroupedQuestions = extractUngroupedQuestions(data, groupedData);\n\n  // Format ungrouped questions\n  const filteredData = formatUngroupedQuestions(ungroupedQuestions);\n\n  // Format grouped data with nested options\n  const formattedGroupedData = formatGroupedQuestions(groupedData);\n\n  return [...filteredData, ...formattedGroupedData];\n};\n\n/**\n * Group questions by their label\n */\nconst groupQuestionsByLabel = (questions: SurveyQuestion[]): ResultGroupDataType[] => {\n  return questions.reduce((result: ResultGroupDataType[], item) => {\n    if (!item.label) return result;\n\n    const existingGroup = result.find((group) => group.label === item.label);\n\n    if (existingGroup) {\n      existingGroup.options.push(...(item.options || []));\n    } else {\n      result.push({\n        label: item.label,\n        options: (item.options || []) as ResultGroupDataOptionsType[],\n      });\n    }\n\n    return result;\n  }, []);\n};\n\n/**\n * Extract questions that are not in any group\n */\nconst extractUngroupedQuestions = (\n  questions: SurveyQuestion[],\n  groupedData: ResultGroupDataType[]\n): SurveyQuestion[] => {\n  return questions.filter(\n    (question) => !groupedData.some((group) => group.label === question.rtxt)\n  );\n};\n\n/**\n * Format ungrouped questions into mapped options\n */\nconst formatUngroupedQuestions = (questions: SurveyQuestion[]): MappedOption[] => {\n  return questions\n    .filter((item) => !item.label)\n    .map((question) => ({\n      label: question.rtxt?.length ? question.rtxt : PLACEHOLDERS.PLEASE_ENTER_YOUR_QUESTION,\n      value: question.id,\n      questionType: question.type,\n    }));\n};\n\n/**\n * Format grouped questions with prefixed option labels\n */\nconst formatGroupedQuestions = (groupedData: ResultGroupDataType[]): MappedOption[] => {\n  return groupedData.map((data) => ({\n    ...data,\n    label: data.label,\n    options: data.options.map((option) => ({\n      ...option,\n      label: `${HELPER_STRINGS.LABEL_PREFIX}${option.label}`,\n    })),\n    value: data.label, // Add value field for consistency\n  }));\n};\n\n/**\n * Generate a unique identifier\n * \n * @returns A unique string ID based on timestamp and random characters\n */\nexport const generateUniqueId = (): string => {\n  const timestamp = Date.now();\n  const randomStr = Math.random().toString(36).substring(2, 11);\n  return `${HELPER_STRINGS.ID_PREFIX}${timestamp}-${randomStr}`;\n};"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;AAMA,MAAM,aAAgB,GAAA;AAAA,EACpB,QAAA,EAAU,eAAe,aAAc,CAAA,QAAA;AAAA,EACvC,OAAA,EAAS,eAAe,aAAc,CAAA,OAAA;AAAA,EACtC,QAAA,EAAU,eAAe,aAAc,CAAA,QAAA;AAAA,EACvC,UAAA,EAAY,eAAe,aAAc,CAAA,UAAA;AAAA,EACzC,mBAAA,EAAqB,eAAe,aAAc,CAAA,mBAAA;AACpD,CAAA,CAAA;AAKA,MAAM,YAAe,GAAA;AAAA,EACnB,YAAA,EAAc,eAAe,YAAa,CAAA,YAAA;AAC5C,CAAA,CAAA;AAKA,MAAM,0BAA0B,cAAe,CAAA,uBAAA,CAAA;AAK/C,MAAM,8BAA8B,cAAe,CAAA,2BAAA,CAAA;AAkEtC,MAAA,oBAAA,GAAuB,CAClC,WACA,EAAA,eAAA,EACA,mBACA,eACA,EAAA,WAAA,EACA,mCACA,EAAA,uCAAA,EACA,UACmB,KAAA;AACnB,EAAA,QAAQ,WAAa;AAAA,IACnB,KAAK,aAAc,CAAA,QAAA;AACjB,MAAO,OAAA,qBAAA,CAAsB,eAAgB,CAAA,eAAe,CAAC,CAAA,CAAA;AAAA,IAE/D,KAAK,aAAc,CAAA,OAAA;AACjB,MAAA,OAAO,wBAAwB,iBAAiB,CAAA,CAAA;AAAA,IAElD,KAAK,aAAc,CAAA,QAAA;AACjB,MAAA,OAAO,aAAa,eAAe,CAAA,CAAA;AAAA,IAErC,KAAK,aAAc,CAAA,UAAA;AACjB,MAAA,OAAO,eAAe,WAAW,CAAA,CAAA;AAAA,IAEnC,KAAK,aAAc,CAAA,mBAAA;AACjB,MAAO,OAAA,0BAAA;AAAA,QACL,UAAA;AAAA,QACA,mCAAA;AAAA,QACA,uCAAA;AAAA,OACF,CAAA;AAAA,IAEF;AACE,MAAA,OAAA,CAAQ,IAAK,CAAA,cAAA,CAAe,gBAAiB,CAAA,oBAAA,CAAqB,WAAW,CAAC,CAAA,CAAA;AAC9E,MAAA,OAAO,EAAC,CAAA;AAAA,GACZ;AACF,EAAA;AAKA,MAAM,eAAA,GAAkB,CAAC,SAAkD,KAAA;AACzE,EAAA,OAAO,SAAU,CAAA,MAAA;AAAA,IACf,CAAC,cACC,QAAU,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,QAAA,CAAA,IAAA,KACV,CAAC,uBAAwB,CAAA,QAAA,CAAS,SAAS,IAA8C,CAAA;AAAA,GAC7F,CAAA;AACF,CAAA,CAAA;AAKA,MAAM,uBAAA,GAA0B,CAAC,iBAAyD,KAAA;AACxF,EAAA,OAAO,iBACJ,CAAA,MAAA;AAAA,IACC,CAAC,aACC,OAAS,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,OAAA,CAAA,IAAA,KACT,CAAC,2BAA4B,CAAA,QAAA,CAAS,QAAQ,IAAkD,CAAA;AAAA,GACpG,CACC,GAAI,CAAA,CAAC,OAAa,MAAA;AAAA,IACjB,OAAO,OAAQ,CAAA,KAAA;AAAA,IACf,OAAO,OAAQ,CAAA,IAAA;AAAA,GACf,CAAA,CAAA,CAAA;AACN,CAAA,CAAA;AAKA,MAAM,YAAA,GAAe,CAAC,SAAgD,KAAA;AACpE,EAAO,OAAA,SAAA,CAAU,GAAI,CAAA,CAAC,QAAc,MAAA;AAAA,IAClC,MAAM,QAAS,CAAA,IAAA;AAAA,IACf,OAAO,QAAS,CAAA,KAAA;AAAA,IAChB,OAAO,QAAS,CAAA,EAAA;AAAA,GAChB,CAAA,CAAA,CAAA;AACJ,CAAA,CAAA;AAKA,MAAM,cAAA,GAAiB,CAAC,WAA8C,KAAA;AACpE,EAAO,OAAA,WAAA,CAAY,GAAI,CAAA,CAAC,UAAgB,MAAA;AAAA,IACtC,OAAO,UAAW,CAAA,IAAA;AAAA,IAClB,OAAO,UAAW,CAAA,EAAA;AAAA,GAClB,CAAA,CAAA,CAAA;AACJ,CAAA,CAAA;AAKA,MAAM,0BAA6B,GAAA,CACjC,UACA,EAAA,aAAA,EACA,iBACc,KAAA;AACd,EAAA,OAAA,CAAO,UAAY,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,UAAA,CAAA,WAAA,EAAA,MAAkB,YAAa,CAAA,YAAA,GAC9C,iBACA,GAAA,aAAA,CAAA;AACN,CAAA,CAAA;AAKA,MAAM,qBAAA,GAAwB,CAAC,eAAsD,KAAA;AAEnF,EAAA,MAAM,OAAO,eAAgB,CAAA,GAAA,CAAI,CAAC,GAAA,KAAS,mBAAK,GAAM,CAAA,CAAA,CAAA;AAGtD,EAAM,MAAA,WAAA,GAAc,sBAAsB,IAAI,CAAA,CAAA;AAG9C,EAAM,MAAA,kBAAA,GAAqB,yBAA0B,CAAA,IAAA,EAAM,WAAW,CAAA,CAAA;AAGtE,EAAM,MAAA,YAAA,GAAe,yBAAyB,kBAAkB,CAAA,CAAA;AAGhE,EAAM,MAAA,oBAAA,GAAuB,uBAAuB,WAAW,CAAA,CAAA;AAE/D,EAAA,OAAO,CAAC,GAAG,YAAc,EAAA,GAAG,oBAAoB,CAAA,CAAA;AAClD,CAAA,CAAA;AAKA,MAAM,qBAAA,GAAwB,CAAC,SAAuD,KAAA;AACpF,EAAA,OAAO,SAAU,CAAA,MAAA,CAAO,CAAC,MAAA,EAA+B,IAAS,KAAA;AAC/D,IAAA,IAAI,CAAC,IAAK,CAAA,KAAA;AAAO,MAAO,OAAA,MAAA,CAAA;AAExB,IAAM,MAAA,aAAA,GAAgB,OAAO,IAAK,CAAA,CAAC,UAAU,KAAM,CAAA,KAAA,KAAU,KAAK,KAAK,CAAA,CAAA;AAEvE,IAAA,IAAI,aAAe,EAAA;AACjB,MAAA,aAAA,CAAc,QAAQ,IAAK,CAAA,GAAI,IAAK,CAAA,OAAA,IAAW,EAAG,CAAA,CAAA;AAAA,KAC7C,MAAA;AACL,MAAA,MAAA,CAAO,IAAK,CAAA;AAAA,QACV,OAAO,IAAK,CAAA,KAAA;AAAA,QACZ,OAAA,EAAU,IAAK,CAAA,OAAA,IAAW,EAAC;AAAA,OAC5B,CAAA,CAAA;AAAA,KACH;AAEA,IAAO,OAAA,MAAA,CAAA;AAAA,GACT,EAAG,EAAE,CAAA,CAAA;AACP,CAAA,CAAA;AAKA,MAAM,yBAAA,GAA4B,CAChC,SAAA,EACA,WACqB,KAAA;AACrB,EAAA,OAAO,SAAU,CAAA,MAAA;AAAA,IACf,CAAC,QAAa,KAAA,CAAC,WAAY,CAAA,IAAA,CAAK,CAAC,KAAU,KAAA,KAAA,CAAM,KAAU,KAAA,QAAA,CAAS,IAAI,CAAA;AAAA,GAC1E,CAAA;AACF,CAAA,CAAA;AAKA,MAAM,wBAAA,GAA2B,CAAC,SAAgD,KAAA;AAChF,EAAO,OAAA,SAAA,CACJ,MAAO,CAAA,CAAC,IAAS,KAAA,CAAC,KAAK,KAAK,CAAA,CAC5B,GAAI,CAAA,CAAC,QAAU,KAAA;AA9PpB,IAAA,IAAA,EAAA,CAAA;AA8PwB,IAAA,OAAA;AAAA,MAClB,SAAO,EAAS,GAAA,QAAA,CAAA,IAAA,KAAT,mBAAe,MAAS,IAAA,QAAA,CAAS,OAAO,YAAa,CAAA,0BAAA;AAAA,MAC5D,OAAO,QAAS,CAAA,EAAA;AAAA,MAChB,cAAc,QAAS,CAAA,IAAA;AAAA,KACzB,CAAA;AAAA,GAAE,CAAA,CAAA;AACN,CAAA,CAAA;AAKA,MAAM,sBAAA,GAAyB,CAAC,WAAuD,KAAA;AACrF,EAAA,OAAO,WAAY,CAAA,GAAA,CAAI,CAAC,IAAA,KAAU,iCAC7B,IAD6B,CAAA,EAAA;AAAA,IAEhC,OAAO,IAAK,CAAA,KAAA;AAAA,IACZ,SAAS,IAAK,CAAA,OAAA,CAAQ,IAAI,CAAC,MAAA,KAAY,iCAClC,MADkC,CAAA,EAAA;AAAA,MAErC,OAAO,CAAG,EAAA,cAAA,CAAe,YAAY,CAAA,EAAG,OAAO,KAAK,CAAA,CAAA;AAAA,KACpD,CAAA,CAAA;AAAA,IACF,OAAO,IAAK,CAAA,KAAA;AAAA;AAAA,GACZ,CAAA,CAAA,CAAA;AACJ,CAAA,CAAA;AAOO,MAAM,mBAAmB,MAAc;AAC5C,EAAM,MAAA,SAAA,GAAY,KAAK,GAAI,EAAA,CAAA;AAC3B,EAAM,MAAA,SAAA,GAAY,KAAK,MAAO,EAAA,CAAE,SAAS,EAAE,CAAA,CAAE,SAAU,CAAA,CAAA,EAAG,EAAE,CAAA,CAAA;AAC5D,EAAA,OAAO,GAAG,cAAe,CAAA,SAAS,CAAG,EAAA,SAAS,IAAI,SAAS,CAAA,CAAA,CAAA;AAC7D;;;;"}

package/dist/es/commons/icons/arrow.js

@@ -1,8 +1,43 @@
 import React__default from 'react';
+import { ATTRIBUTES, ARIA_LABELS, COMPONENT_DISPLAY_NAMES, COLORS } from '../constants/strings.js';
 
-const Arrow = () => {
-  return /* @__PURE__ */ React__default.createElement("svg", { width: "26", height: "12", viewBox: "0 0 26 12", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, /* @__PURE__ */ React__default.createElement("path", { d: "M1 5.25C0.585786 5.25 0.25 5.58579 0.25 6C0.25 6.41421 0.585786 6.75 1 6.75V5.25ZM25.5303 6.53033C25.8232 6.23744 25.8232 5.76256 25.5303 5.46967L20.7574 0.696699C20.4645 0.403806 19.9896 0.403806 19.6967 0.696699C19.4038 0.989593 19.4038 1.46447 19.6967 1.75736L23.9393 6L19.6967 10.2426C19.4038 10.5355 19.4038 11.0104 19.6967 11.3033C19.9896 11.5962 20.4645 11.5962 20.7574 11.3033L25.5303 6.53033ZM1 6.75H25V5.25H1V6.75Z", fill: "black", "fill-opacity": "0.2" }));
+const DEFAULT_CONFIG = {
+  width: 26,
+  height: 12,
+  color: COLORS.BLACK,
+  opacity: 0.2
 };
+const ArrowIcon = ({
+  width = DEFAULT_CONFIG.width,
+  height = DEFAULT_CONFIG.height,
+  color = DEFAULT_CONFIG.color,
+  opacity = DEFAULT_CONFIG.opacity,
+  className,
+  ariaLabel = ARIA_LABELS.ARROW
+}) => {
+  return /* @__PURE__ */ React__default.createElement(
+    "svg",
+    {
+      width,
+      height,
+      viewBox: "0 0 26 12",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      className,
+      "aria-label": ariaLabel,
+      role: ATTRIBUTES.IMG
+    },
+    /* @__PURE__ */ React__default.createElement(
+      "path",
+      {
+        d: "M1 5.25C0.585786 5.25 0.25 5.58579 0.25 6C0.25 6.41421 0.585786 6.75 1 6.75V5.25ZM25.5303 6.53033C25.8232 6.23744 25.8232 5.76256 25.5303 5.46967L20.7574 0.696699C20.4645 0.403806 19.9896 0.403806 19.6967 0.696699C19.4038 0.989593 19.4038 1.46447 19.6967 1.75736L23.9393 6L19.6967 10.2426C19.4038 10.5355 19.4038 11.0104 19.6967 11.3033C19.9896 11.5962 20.4645 11.5962 20.7574 11.3033L25.5303 6.53033ZM1 6.75H25V5.25H1V6.75Z",
+        fill: color,
+        fillOpacity: opacity
+      }
+    )
+  );
+};
+ArrowIcon.displayName = COMPONENT_DISPLAY_NAMES.ARROW_ICON;
 
-export { Arrow as default };
+export { ArrowIcon as default };
 //# sourceMappingURL=arrow.js.map

package/dist/es/commons/icons/arrow.js.map

@@ -1 +1 @@
-{"version":3,"file":"arrow.js","sources":["../../../../src/commons/icons/arrow.tsx"],"sourcesContent":["import React from \"react\";\n\nconst Arrow = () => {\n  return (\n    <svg width=\"26\" height=\"12\" viewBox=\"0 0 26 12\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n    <path d=\"M1 5.25C0.585786 5.25 0.25 5.58579 0.25 6C0.25 6.41421 0.585786 6.75 1 6.75V5.25ZM25.5303 6.53033C25.8232 6.23744 25.8232 5.76256 25.5303 5.46967L20.7574 0.696699C20.4645 0.403806 19.9896 0.403806 19.6967 0.696699C19.4038 0.989593 19.4038 1.46447 19.6967 1.75736L23.9393 6L19.6967 10.2426C19.4038 10.5355 19.4038 11.0104 19.6967 11.3033C19.9896 11.5962 20.4645 11.5962 20.7574 11.3033L25.5303 6.53033ZM1 6.75H25V5.25H1V6.75Z\" fill=\"black\" fill-opacity=\"0.2\"/>\n    </svg>    \n  );\n};\n\nexport default Arrow;"],"names":["React"],"mappings":";;AAEA,MAAM,QAAQ,MAAM;AAClB,EACE,uBAAAA,cAAA,CAAA,aAAA,CAAC,SAAI,KAAM,EAAA,IAAA,EAAK,QAAO,IAAK,EAAA,OAAA,EAAQ,aAAY,IAAK,EAAA,MAAA,EAAO,OAAM,4BAClE,EAAA,kBAAAA,cAAA,CAAA,aAAA,CAAC,UAAK,CAAE,EAAA,0aAAA,EAA2a,MAAK,OAAQ,EAAA,cAAA,EAAa,OAAK,CACld,CAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"arrow.js","sources":["../../../../src/commons/icons/arrow.tsx"],"sourcesContent":["import React from 'react';\nimport { COLORS, ARIA_LABELS, ATTRIBUTES, COMPONENT_DISPLAY_NAMES } from '../constants/strings';\n\n/**\n * Props for the ArrowIcon component\n */\nexport interface ArrowIconProps {\n  /** Width of the icon */\n  width?: number | string;\n  /** Height of the icon */\n  height?: number | string;\n  /** Fill color of the icon */\n  color?: string;\n  /** Fill opacity */\n  opacity?: number;\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 arrow icon\n */\nconst DEFAULT_CONFIG = {\n  width: 26,\n  height: 12,\n  color: COLORS.BLACK,\n  opacity: 0.2,\n} as const;\n\n/**\n * ArrowIcon Component\n * \n * A customizable right-pointing arrow icon.\n * \n * @example\n * ```tsx\n * <ArrowIcon width={32} height={16} color=\"blue\" />\n * ```\n */\nconst ArrowIcon: React.FC<ArrowIconProps> = ({\n  width = DEFAULT_CONFIG.width,\n  height = DEFAULT_CONFIG.height,\n  color = DEFAULT_CONFIG.color,\n  opacity = DEFAULT_CONFIG.opacity,\n  className,\n  ariaLabel = ARIA_LABELS.ARROW,\n}) => {\n  return (\n    <svg\n      width={width}\n      height={height}\n      viewBox=\"0 0 26 12\"\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=\"M1 5.25C0.585786 5.25 0.25 5.58579 0.25 6C0.25 6.41421 0.585786 6.75 1 6.75V5.25ZM25.5303 6.53033C25.8232 6.23744 25.8232 5.76256 25.5303 5.46967L20.7574 0.696699C20.4645 0.403806 19.9896 0.403806 19.6967 0.696699C19.4038 0.989593 19.4038 1.46447 19.6967 1.75736L23.9393 6L19.6967 10.2426C19.4038 10.5355 19.4038 11.0104 19.6967 11.3033C19.9896 11.5962 20.4645 11.5962 20.7574 11.3033L25.5303 6.53033ZM1 6.75H25V5.25H1V6.75Z\"\n        fill={color}\n        fillOpacity={opacity}\n      />\n    </svg>\n  );\n};\n\nArrowIcon.displayName = COMPONENT_DISPLAY_NAMES.ARROW_ICON;\n\nexport default ArrowIcon;"],"names":["React"],"mappings":";;;AAwBA,MAAM,cAAiB,GAAA;AAAA,EACrB,KAAO,EAAA,EAAA;AAAA,EACP,MAAQ,EAAA,EAAA;AAAA,EACR,OAAO,MAAO,CAAA,KAAA;AAAA,EACd,OAAS,EAAA,GAAA;AACX,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,UAAU,cAAe,CAAA,OAAA;AAAA,EACzB,SAAA;AAAA,EACA,YAAY,WAAY,CAAA,KAAA;AAC1B,CAAM,KAAA;AACJ,EACE,uBAAAA,cAAA,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,MAAM,UAAW,CAAA,GAAA;AAAA,KAAA;AAAA,oBAEjBA,cAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,0aAAA;AAAA,QACF,IAAM,EAAA,KAAA;AAAA,QACN,WAAa,EAAA,OAAA;AAAA,OAAA;AAAA,KACf;AAAA,GACF,CAAA;AAEJ,EAAA;AAEA,SAAA,CAAU,cAAc,uBAAwB,CAAA,UAAA;;;;"}

package/dist/es/commons/icons/cursor.js

@@ -1,8 +1,17 @@
 import React__default from 'react';
+import { ATTRIBUTES, ARIA_LABELS, COMPONENT_DISPLAY_NAMES, COLORS } from '../constants/strings.js';
 
+const DEFAULT_CONFIG = {
+  size: 64,
+  color: COLORS.ICON_GRAY_MEDIUM,
+  strokeWidth: 3
+};
 const CursorIcon = ({
-  size = " 64",
-  color = "#767676"
+  size = DEFAULT_CONFIG.size,
+  color = DEFAULT_CONFIG.color,
+  strokeWidth = DEFAULT_CONFIG.strokeWidth,
+  className,
+  ariaLabel = ARIA_LABELS.CURSOR
 }) => {
   return /* @__PURE__ */ React__default.createElement(
     "svg",
@@ -11,14 +20,17 @@ const CursorIcon = ({
       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: ATTRIBUTES.IMG
     },
     /* @__PURE__ */ React__default.createElement(
       "path",
       {
         d: "M13.3335 23.9997C13.3335 13.6903 21.6908 5.33301 32.0002 5.33301C42.3095 5.33301 50.6668 13.6903 50.6668 23.9997",
         stroke: color,
-        strokeWidth: "3",
+        strokeWidth,
         strokeLinecap: "round",
         strokeLinejoin: "round"
       }
@@ -28,7 +40,7 @@ const CursorIcon = ({
       {
         d: "M21.3335 23.9997C21.3335 18.109 26.1095 13.333 32.0002 13.333C37.8908 13.333 42.6668 18.109 42.6668 23.9997",
         stroke: color,
-        strokeWidth: "3",
+        strokeWidth,
         strokeLinecap: "round",
         strokeLinejoin: "round"
       }
@@ -36,17 +48,18 @@ const CursorIcon = ({
     /* @__PURE__ */ React__default.createElement(
       "path",
       {
-        "fill-rule": "evenodd",
-        "clip-rule": "evenodd",
+        fillRule: "evenodd",
+        clipRule: "evenodd",
         d: "M36.1443 34.6663V25.333C36.1443 23.125 34.3523 21.333 32.1443 21.333V21.333C29.9363 21.333 28.1443 23.125 28.1443 25.333V31.9997V42.6663L25.7417 40.2637C24.123 38.645 21.499 38.645 19.8803 40.2637V40.2637C18.483 41.661 18.267 43.8503 19.363 45.493L26.5603 56.2903C27.5497 57.7757 29.2163 58.6663 31.0003 58.6663H45.1017C47.7923 58.6663 50.059 56.6637 50.395 53.9943L51.8403 42.429C52.195 39.5837 50.2377 36.965 47.4083 36.5037L36.1443 34.6663Z",
         stroke: color,
-        strokeWidth: "3",
+        strokeWidth,
         strokeLinecap: "round",
         strokeLinejoin: "round"
       }
     )
   );
 };
+CursorIcon.displayName = COMPONENT_DISPLAY_NAMES.CURSOR_ICON;
 
 export { CursorIcon as default };
 //# sourceMappingURL=cursor.js.map

package/dist/es/commons/icons/cursor.js.map

@@ -1 +1 @@
-{"version":3,"file":"cursor.js","sources":["../../../../src/commons/icons/cursor.tsx"],"sourcesContent":["import React from \"react\";\n\nconst CursorIcon = ({\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      <path\n        d=\"M13.3335 23.9997C13.3335 13.6903 21.6908 5.33301 32.0002 5.33301C42.3095 5.33301 50.6668 13.6903 50.6668 23.9997\"\n        stroke={color}\n        strokeWidth=\"3\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n      <path\n        d=\"M21.3335 23.9997C21.3335 18.109 26.1095 13.333 32.0002 13.333C37.8908 13.333 42.6668 18.109 42.6668 23.9997\"\n        stroke={color}\n        strokeWidth=\"3\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n      <path\n        fill-rule=\"evenodd\"\n        clip-rule=\"evenodd\"\n        d=\"M36.1443 34.6663V25.333C36.1443 23.125 34.3523 21.333 32.1443 21.333V21.333C29.9363 21.333 28.1443 23.125 28.1443 25.333V31.9997V42.6663L25.7417 40.2637C24.123 38.645 21.499 38.645 19.8803 40.2637V40.2637C18.483 41.661 18.267 43.8503 19.363 45.493L26.5603 56.2903C27.5497 57.7757 29.2163 58.6663 31.0003 58.6663H45.1017C47.7923 58.6663 50.059 56.6637 50.395 53.9943L51.8403 42.429C52.195 39.5837 50.2377 36.965 47.4083 36.5037L36.1443 34.6663Z\"\n        stroke={color}\n        strokeWidth=\"3\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n    </svg>\n  );\n};\n\nexport default CursorIcon;\n"],"names":["React"],"mappings":";;AAEA,MAAM,aAAa,CAAC;AAAA,EAClB,IAAO,GAAA,KAAA;AAAA,EACP,KAAQ,GAAA,SAAA;AACV,CAGM,KAAA;AACJ,EACE,uBAAAA,cAAA,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,oBAENA,cAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,kHAAA;AAAA,QACF,MAAQ,EAAA,KAAA;AAAA,QACR,WAAY,EAAA,GAAA;AAAA,QACZ,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,OAAA;AAAA,KACjB;AAAA,oBACAA,cAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,6GAAA;AAAA,QACF,MAAQ,EAAA,KAAA;AAAA,QACR,WAAY,EAAA,GAAA;AAAA,QACZ,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,OAAA;AAAA,KACjB;AAAA,oBACAA,cAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,WAAU,EAAA,SAAA;AAAA,QACV,WAAU,EAAA,SAAA;AAAA,QACV,CAAE,EAAA,6bAAA;AAAA,QACF,MAAQ,EAAA,KAAA;AAAA,QACR,WAAY,EAAA,GAAA;AAAA,QACZ,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,OAAA;AAAA,KACjB;AAAA,GACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"cursor.js","sources":["../../../../src/commons/icons/cursor.tsx"],"sourcesContent":["import React from 'react';\nimport { COLORS, ARIA_LABELS, ATTRIBUTES, COMPONENT_DISPLAY_NAMES } from '../constants/strings';\n\n/**\n * Props for the CursorIcon component\n */\nexport interface CursorIconProps {\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 cursor icon\n */\nconst DEFAULT_CONFIG = {\n  size: 64,\n  color: COLORS.ICON_GRAY_MEDIUM,\n  strokeWidth: 3,\n} as const;\n\n/**\n * CursorIcon Component\n * \n * A hand cursor/pointer icon with customizable size and color.\n * \n * @example\n * ```tsx\n * <CursorIcon size={48} color=\"#000000\" />\n * ```\n */\nconst CursorIcon: React.FC<CursorIconProps> = ({\n  size = DEFAULT_CONFIG.size,\n  color = DEFAULT_CONFIG.color,\n  strokeWidth = DEFAULT_CONFIG.strokeWidth,\n  className,\n  ariaLabel = ARIA_LABELS.CURSOR,\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      <path\n        d=\"M13.3335 23.9997C13.3335 13.6903 21.6908 5.33301 32.0002 5.33301C42.3095 5.33301 50.6668 13.6903 50.6668 23.9997\"\n        stroke={color}\n        strokeWidth={strokeWidth}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n      <path\n        d=\"M21.3335 23.9997C21.3335 18.109 26.1095 13.333 32.0002 13.333C37.8908 13.333 42.6668 18.109 42.6668 23.9997\"\n        stroke={color}\n        strokeWidth={strokeWidth}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n      <path\n        fillRule=\"evenodd\"\n        clipRule=\"evenodd\"\n        d=\"M36.1443 34.6663V25.333C36.1443 23.125 34.3523 21.333 32.1443 21.333V21.333C29.9363 21.333 28.1443 23.125 28.1443 25.333V31.9997V42.6663L25.7417 40.2637C24.123 38.645 21.499 38.645 19.8803 40.2637V40.2637C18.483 41.661 18.267 43.8503 19.363 45.493L26.5603 56.2903C27.5497 57.7757 29.2163 58.6663 31.0003 58.6663H45.1017C47.7923 58.6663 50.059 56.6637 50.395 53.9943L51.8403 42.429C52.195 39.5837 50.2377 36.965 47.4083 36.5037L36.1443 34.6663Z\"\n        stroke={color}\n        strokeWidth={strokeWidth}\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      />\n    </svg>\n  );\n};\n\nCursorIcon.displayName = COMPONENT_DISPLAY_NAMES.CURSOR_ICON;\n\nexport default CursorIcon;\n"],"names":["React"],"mappings":";;;AAsBA,MAAM,cAAiB,GAAA;AAAA,EACrB,IAAM,EAAA,EAAA;AAAA,EACN,OAAO,MAAO,CAAA,gBAAA;AAAA,EACd,WAAa,EAAA,CAAA;AACf,CAAA,CAAA;AAYA,MAAM,aAAwC,CAAC;AAAA,EAC7C,OAAO,cAAe,CAAA,IAAA;AAAA,EACtB,QAAQ,cAAe,CAAA,KAAA;AAAA,EACvB,cAAc,cAAe,CAAA,WAAA;AAAA,EAC7B,SAAA;AAAA,EACA,YAAY,WAAY,CAAA,MAAA;AAC1B,CAAM,KAAA;AACJ,EACE,uBAAAA,cAAA,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,MAAM,UAAW,CAAA,GAAA;AAAA,KAAA;AAAA,oBAEjBA,cAAA,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,oBACAA,cAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,CAAE,EAAA,6GAAA;AAAA,QACF,MAAQ,EAAA,KAAA;AAAA,QACR,WAAA;AAAA,QACA,aAAc,EAAA,OAAA;AAAA,QACd,cAAe,EAAA,OAAA;AAAA,OAAA;AAAA,KACjB;AAAA,oBACAA,cAAA,CAAA,aAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,QAAS,EAAA,SAAA;AAAA,QACT,QAAS,EAAA,SAAA;AAAA,QACT,CAAE,EAAA,6bAAA;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,UAAA,CAAW,cAAc,uBAAwB,CAAA,WAAA;;;;"}

package/dist/es/commons/icons/email-letter.js

@@ -1,37 +1,55 @@
 import React__default from 'react';
+import { ATTRIBUTES, ARIA_LABELS, COMPONENT_DISPLAY_NAMES, COLORS } from '../constants/strings.js';
 
-const EmailLetterIcon = () => {
+const DEFAULT_CONFIG = {
+  width: 20,
+  height: 20,
+  color: COLORS.ICON_GRAY,
+  strokeWidth: 1.5
+};
+const EmailLetterIcon = ({
+  width = DEFAULT_CONFIG.width,
+  height = DEFAULT_CONFIG.height,
+  color = DEFAULT_CONFIG.color,
+  strokeWidth = DEFAULT_CONFIG.strokeWidth,
+  className,
+  ariaLabel = ARIA_LABELS.EMAIL
+}) => {
   return /* @__PURE__ */ React__default.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: ATTRIBUTES.IMG
     },
     /* @__PURE__ */ React__default.createElement(
       "path",
       {
         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",
-        stroke: "#6A6A6A",
-        "stroke-width": "1.5",
-        "stroke-linecap": "round",
-        "stroke-linejoin": "round"
+        stroke: color,
+        strokeWidth,
+        strokeLinecap: "round",
+        strokeLinejoin: "round"
       }
     ),
     /* @__PURE__ */ React__default.createElement(
       "path",
       {
         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",
-        stroke: "#6A6A6A",
-        "stroke-width": "1.5",
-        "stroke-linecap": "round",
-        "stroke-linejoin": "round"
+        stroke: color,
+        strokeWidth,
+        strokeLinecap: "round",
+        strokeLinejoin: "round"
       }
     )
   );
 };
+EmailLetterIcon.displayName = COMPONENT_DISPLAY_NAMES.EMAIL_LETTER_ICON;
 
 export { EmailLetterIcon as default };
 //# sourceMappingURL=email-letter.js.map

package/dist/es/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":["React"],"mappings":";;AAEA,MAAM,kBAAkB,MAAM;AAC5B,EACE,uBAAAA,cAAA,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,oBAENA,cAAA,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,oBACAA,cAAA,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":["React"],"mappings":";;;AAwBA,MAAM,cAAiB,GAAA;AAAA,EACrB,KAAO,EAAA,EAAA;AAAA,EACP,MAAQ,EAAA,EAAA;AAAA,EACR,OAAO,MAAO,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,YAAY,WAAY,CAAA,KAAA;AAC1B,CAAM,KAAA;AACJ,EACE,uBAAAA,cAAA,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,MAAM,UAAW,CAAA,GAAA;AAAA,KAAA;AAAA,oBAEjBA,cAAA,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,oBACAA,cAAA,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,cAAc,uBAAwB,CAAA,iBAAA;;;;"}

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

@@ -1,8 +1,17 @@
 import React__default from 'react';
+import { ATTRIBUTES, ARIA_LABELS, COMPONENT_DISPLAY_NAMES, COLORS } from '../constants/strings.js';
 
+const DEFAULT_CONFIG = {
+  size: 64,
+  color: 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 = ARIA_LABELS.MAPPING
 }) => {
   return /* @__PURE__ */ React__default.createElement(
     "svg",
@@ -11,10 +20,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: ATTRIBUTES.IMG
     },
-    /* @__PURE__ */ React__default.createElement("circle", { cx: "18", cy: "46", r: "6", stroke: color, strokeWidth: "3" }),
-    /* @__PURE__ */ React__default.createElement("circle", { cx: "46", cy: "18", r: "6", stroke: color, strokeWidth: "3" }),
+    /* @__PURE__ */ React__default.createElement("circle", { cx: "18", cy: "46", r: "6", stroke: color, strokeWidth }),
+    /* @__PURE__ */ React__default.createElement("circle", { cx: "46", cy: "18", r: "6", stroke: color, strokeWidth }),
     /* @__PURE__ */ React__default.createElement(
       "rect",
       {
@@ -24,7 +36,7 @@ const MappingIcon = ({
         height: "12",
         rx: "6",
         stroke: color,
-        strokeWidth: "3"
+        strokeWidth
       }
     ),
     /* @__PURE__ */ React__default.createElement(
@@ -37,7 +49,7 @@ const MappingIcon = ({
         rx: "1",
         transform: "rotate(135 26.4854 18)",
         stroke: color,
-        strokeWidth: "3"
+        strokeWidth
       }
     ),
     /* @__PURE__ */ React__default.createElement(
@@ -45,13 +57,14 @@ const MappingIcon = ({
       {
         d: "M40 17.9999C25.4998 17.9999 40.0002 46.0002 24 45.9999",
         stroke: color,
-        strokeWidth: "3"
+        strokeWidth
       }
     ),
-    /* @__PURE__ */ React__default.createElement("path", { d: "M18 25L18 40", stroke: color, strokeWidth: "3" }),
-    /* @__PURE__ */ React__default.createElement("path", { d: "M46 25L46 41", stroke: color, strokeWidth: "3" })
+    /* @__PURE__ */ React__default.createElement("path", { d: "M18 25L18 40", stroke: color, strokeWidth }),
+    /* @__PURE__ */ React__default.createElement("path", { d: "M46 25L46 41", stroke: color, strokeWidth })
   );
 };
+MappingIcon.displayName = COMPONENT_DISPLAY_NAMES.MAPPING_ICON;
 
 export { MappingIcon as default };
 //# sourceMappingURL=mapping.js.map

package/dist/es/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":["React"],"mappings":";;AAEA,MAAM,cAAc,CAAC;AAAA,EACnB,IAAO,GAAA,KAAA;AAAA,EACP,KAAQ,GAAA,SAAA;AACV,CAGM,KAAA;AACJ,EACE,uBAAAA,cAAA,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,oBAENA,cAAA,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,oBAC7DA,cAAA,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,oBAC7DA,cAAA,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,oBACAA,cAAA,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,oBACAA,cAAA,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,iDACC,MAAK,EAAA,EAAA,CAAA,EAAE,gBAAe,MAAQ,EAAA,KAAA,EAAO,aAAY,GAAI,EAAA,CAAA;AAAA,iDACrD,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":["React"],"mappings":";;;AAsBA,MAAM,cAAiB,GAAA;AAAA,EACrB,IAAM,EAAA,EAAA;AAAA,EACN,OAAO,MAAO,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,YAAY,WAAY,CAAA,OAAA;AAC1B,CAAM,KAAA;AACJ,EACE,uBAAAA,cAAA,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,MAAM,UAAW,CAAA,GAAA;AAAA,KAAA;AAAA,oBAEjBA,cAAA,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,oBACvEA,cAAA,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,oBACvEA,cAAA,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,oBACAA,cAAA,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,oBACAA,cAAA,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,iDACC,MAAK,EAAA,EAAA,CAAA,EAAE,cAAe,EAAA,MAAA,EAAQ,OAAO,WAA0B,EAAA,CAAA;AAAA,iDAC/D,MAAK,EAAA,EAAA,CAAA,EAAE,cAAe,EAAA,MAAA,EAAQ,OAAO,WAA0B,EAAA,CAAA;AAAA,GAClE,CAAA;AAEJ,EAAA;AAEA,WAAA,CAAY,cAAc,uBAAwB,CAAA,YAAA;;;;"}