@ttn-shared/ui 1.0.3 → 1.2.0

package/dist/index.cjs

@@ -30,11 +30,15 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/index.ts
 var index_exports = {};
 __export(index_exports, {
+  ChangeAccountModal: () => ChangeAccountModal,
+  Header: () => Header,
+  HelpModal: () => HelpModal,
   PatientAdministrativeRisks: () => PatientAdministrativeRisks,
   PatientAppointmentHistory: () => PatientAppointmentHistory,
   PatientAssistanceRisks: () => PatientAssistanceRisks,
   PatientForm: () => PatientForm,
   PatientNotes: () => PatientNotes,
+  Sidebar: () => Sidebar,
   TTNSharedProvider: () => TTNSharedProvider,
   useTTNSharedContext: () => useTTNSharedContext
 });
@@ -354,24 +358,24 @@ var PatientVoluntaryInsuranceForm = ({
   mode,
   form
 }) => {
-  const { userAccountId } = useTTNSharedContext();
+  const { userInfo } = useTTNSharedContext();
   const insuranceInfo = form.values.voluntaryInsurance[index];
   const { data: companyTypes } = useCompanyTypes({
     filters: {
-      eaccount: userAccountId,
+      eaccount: userInfo.accountId,
       status: "enabled"
     }
   });
   const { data: companyClients } = useCompanyClients({
     filters: {
-      eaccount: userAccountId,
+      eaccount: userInfo.accountId,
       status: "enabled"
     }
   });
   const { data: contracts } = useContracts({
     enabled: Boolean(insuranceInfo.companyId),
     filters: {
-      eaccount: userAccountId,
+      eaccount: userInfo.accountId,
       cType: "particular",
       client: Number(insuranceInfo.companyId) || void 0,
       status: "enabled"
@@ -380,7 +384,7 @@ var PatientVoluntaryInsuranceForm = ({
   const { data: contractPopulations } = useContractPopulations({
     enabled: Boolean(insuranceInfo.plan),
     filters: {
-      eaccount: userAccountId,
+      eaccount: userInfo.accountId,
       contract: Number(insuranceInfo.plan) || void 0,
       status: "enabled"
     }
@@ -388,7 +392,7 @@ var PatientVoluntaryInsuranceForm = ({
   const { data: incomeGroups } = useIncomeGroups({
     enabled: Boolean(insuranceInfo.companyId),
     filters: {
-      eaccount: userAccountId,
+      eaccount: userInfo.accountId,
       corpclientId: Number(insuranceInfo.companyId) || void 0
     }
   });
@@ -454,11 +458,11 @@ var PatientVoluntaryInsuranceForm = ({
                 companyTypeTag || ""
               );
             }
-            form.setFieldValue(`voluntaryInsurance.${index}.companyType`, value || "");
-            form.setFieldValue(`voluntaryInsurance.${index}.companyId`, "");
-            form.setFieldValue(`voluntaryInsurance.${index}.plan`, "");
-            form.setFieldValue(`voluntaryInsurance.${index}.population`, "");
-            form.setFieldValue(`voluntaryInsurance.${index}.groupId`, "");
+            form.setFieldValue(`voluntaryInsurance.${index}.companyType`, value);
+            form.setFieldValue(`voluntaryInsurance.${index}.companyId`, null);
+            form.setFieldValue(`voluntaryInsurance.${index}.plan`, null);
+            form.setFieldValue(`voluntaryInsurance.${index}.population`, null);
+            form.setFieldValue(`voluntaryInsurance.${index}.groupId`, null);
             form.setFieldValue(`voluntaryInsurance.${index}.policyNumber`, "");
           },
           "data-testid": `patient-form-voluntary-insurance-company-type-select-${index}`
@@ -473,10 +477,10 @@ var PatientVoluntaryInsuranceForm = ({
           data: companyClientOptions,
           ...form.getInputProps(`voluntaryInsurance.${index}.companyId`),
           onChange: (value) => {
-            form.setFieldValue(`voluntaryInsurance.${index}.companyId`, value || "");
-            form.setFieldValue(`voluntaryInsurance.${index}.plan`, "");
-            form.setFieldValue(`voluntaryInsurance.${index}.population`, "");
-            form.setFieldValue(`voluntaryInsurance.${index}.groupId`, "");
+            form.setFieldValue(`voluntaryInsurance.${index}.companyId`, value);
+            form.setFieldValue(`voluntaryInsurance.${index}.plan`, null);
+            form.setFieldValue(`voluntaryInsurance.${index}.population`, null);
+            form.setFieldValue(`voluntaryInsurance.${index}.groupId`, null);
             form.setFieldValue(`voluntaryInsurance.${index}.policyNumber`, "");
           },
           "data-testid": `patient-form-voluntary-insurance-company-select-${index}`
@@ -491,9 +495,9 @@ var PatientVoluntaryInsuranceForm = ({
           data: contractOptions,
           ...form.getInputProps(`voluntaryInsurance.${index}.plan`),
           onChange: (value) => {
-            form.setFieldValue(`voluntaryInsurance.${index}.plan`, value || "");
-            form.setFieldValue(`voluntaryInsurance.${index}.population`, "");
-            form.setFieldValue(`voluntaryInsurance.${index}.groupId`, "");
+            form.setFieldValue(`voluntaryInsurance.${index}.plan`, value);
+            form.setFieldValue(`voluntaryInsurance.${index}.population`, null);
+            form.setFieldValue(`voluntaryInsurance.${index}.groupId`, null);
             form.setFieldValue(`voluntaryInsurance.${index}.policyNumber`, "");
           },
           "data-testid": `patient-form-voluntary-insurance-plan-select-${index}`
@@ -625,7 +629,7 @@ var PatientNotes = ({
   closeOnSave = true,
   onAttemptRemoveNote
 }) => {
-  const { userId, userName } = useTTNSharedContext();
+  const { userInfo } = useTTNSharedContext();
   const [comment, setComment] = (0, import_react3.useState)("");
   const { data: notes } = useComments({
     enabled: isOpen && Boolean(patientId),
@@ -636,7 +640,7 @@ var PatientNotes = ({
   const handleAddNote = async () => {
     await createComment2({
       entity: "userClient",
-      userId: userId ?? 0,
+      userId: userInfo.id ?? 0,
       comment,
       id: patientId ?? 0
     });
@@ -685,7 +689,7 @@ var PatientNotes = ({
         !notes?.length && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_core2.Text, { c: "dimmed", ta: "center", children: "No hay notas disponibles." })
       ] }),
       /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_core2.Box, { p: "lg", style: { flexShrink: 0 }, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_core2.Paper, { withBorder: true, p: "md", bg: "brand-color.0", shadow: "none", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_core2.Text, { c: "brand-color", children: userName }),
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_core2.Text, { c: "brand-color", children: userInfo.name }),
         /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
           import_core2.Textarea,
           {
@@ -779,13 +783,13 @@ var PatientAdministrativeRisks = ({
   isOpen,
   onClose
 }) => {
-  const { userAccountId } = useTTNSharedContext();
+  const { userInfo } = useTTNSharedContext();
   const [riskValue, setRiskValue] = (0, import_react4.useState)(null);
   const [selectedRisks, setSelectedRisks] = (0, import_react4.useState)([]);
   const { data: patientInfo } = usePatientDetail({
     enabled: Boolean(patientId) && isOpen,
     filters: {
-      eaccount: userAccountId,
+      eaccount: userInfo.accountId,
       id: patientId
     }
   });
@@ -798,7 +802,7 @@ var PatientAdministrativeRisks = ({
   const { mutateAsync: updateRisks2 } = useUpdateRisks();
   const handleSaveRisks = async () => {
     await updateRisks2({
-      eaccount: userAccountId ?? 0,
+      eaccount: userInfo.accountId ?? 0,
       idPatient: patientId ?? 0,
       riskList: {
         administrative: selectedRisks
@@ -921,13 +925,13 @@ var PatientAssistanceRisks = ({
   isOpen,
   onClose
 }) => {
-  const { userAccountId } = useTTNSharedContext();
+  const { userInfo } = useTTNSharedContext();
   const [riskValue, setRiskValue] = (0, import_react5.useState)(null);
   const [selectedRisks, setSelectedRisks] = (0, import_react5.useState)([]);
   const { data: patientInfo } = usePatientDetail({
     enabled: Boolean(patientId) && isOpen,
     filters: {
-      eaccount: userAccountId,
+      eaccount: userInfo.accountId,
       id: patientId
     }
   });
@@ -951,7 +955,7 @@ var PatientAssistanceRisks = ({
   };
   const handleSaveRisks = async () => {
     await updateRisks2({
-      eaccount: userAccountId ?? 0,
+      eaccount: userInfo.accountId ?? 0,
       idPatient: patientId ?? 0,
       riskList: {
         assistance: selectedRisks.map((risk) => ({ id: risk.clinicalDiseaseId }))
@@ -1182,7 +1186,7 @@ function AppPagination(props) {
 // src/components/PatientAppointmentHistory.tsx
 var import_jsx_runtime7 = require("react/jsx-runtime");
 var PatientAppointmentHistory = ({ patientId }) => {
-  const { userAccountId } = useTTNSharedContext();
+  const { userInfo } = useTTNSharedContext();
   const [currentPage, setCurrentPage] = (0, import_react6.useState)(1);
   const [selectedAppointment, setSelectedAppointment] = (0, import_react6.useState)();
   const { data: appointments, rowTotal } = useAppointments({
@@ -1191,7 +1195,7 @@ var PatientAppointmentHistory = ({ patientId }) => {
       idPatient: patientId,
       page: currentPage,
       perpage: 10,
-      idAccount: userAccountId ?? 0
+      idAccount: userInfo.accountId ?? 0
     }
   });
   return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_jsx_runtime7.Fragment, { children: [
@@ -1438,11 +1442,16 @@ var PatientForm = ({
   defaultMode,
   patientId,
   policyContent,
+  disabledFields,
   onSavePatient,
   onSaveError,
   onBack
 }) => {
-  const { userAccountId } = useTTNSharedContext();
+  const { userInfo } = useTTNSharedContext();
+  const disabledFieldSet = (0, import_react7.useMemo)(() => new Set(disabledFields ?? []), [disabledFields]);
+  const isFieldDisabled = (field) => disabledFieldSet.has(field);
+  const isMandatoryInsuranceDisabled = isFieldDisabled("mandatoryInsurance");
+  const isVoluntaryInsuranceDisabled = isFieldDisabled("voluntaryInsurance");
   const [mode, setMode] = (0, import_react7.useState)(defaultMode);
   const [openPatientNotes, setOpenPatientNotes] = (0, import_react7.useState)(false);
   const [openPatientAssistanceRisks, setOpenPatientAssistanceRisks] = (0, import_react7.useState)(false);
@@ -1451,7 +1460,7 @@ var PatientForm = ({
   const form = (0, import_form.useForm)({
     mode: "controlled",
     initialValues: {
-      documentTypeId: "",
+      documentTypeId: null,
       documentNumber: "",
       firstName: "",
       middleName: "",
@@ -1460,30 +1469,30 @@ var PatientForm = ({
       birthDate: "",
       age: "",
       whatsapp: "",
-      gender: "",
-      affiliationTypeId: "",
-      bloodType: "",
+      gender: null,
+      affiliationTypeId: null,
+      bloodType: null,
       email: "",
-      provinceId: "",
-      cityId: "",
+      provinceId: null,
+      cityId: null,
       homeAddress: "",
       neighborhood: "",
       cellphone: "",
       homephone: "",
       emergencyContact: "",
-      maritalStatus: "",
+      maritalStatus: null,
       occupation: "",
       use_glasses: "",
       use_contact_lens: "",
       isDataPolicyAccepted: false,
-      stratumId: "",
-      educationLevelId: "",
-      ethnicGroupId: "",
+      stratumId: null,
+      educationLevelId: null,
+      ethnicGroupId: null,
       mandatoryInsurance: {
-        companyId: "",
-        plan: "",
-        population: "",
-        groupId: "",
+        companyId: null,
+        plan: null,
+        population: null,
+        groupId: null,
         policyNumber: ""
       },
       voluntaryInsurance: []
@@ -1502,16 +1511,16 @@ var PatientForm = ({
   const { data: patientInfo, refetch: refetchPatientInfo } = usePatientDetail({
     enabled: Boolean(patientId) && mode !== "create",
     filters: {
-      eaccount: userAccountId,
+      eaccount: userInfo.accountId,
       id: patientId
     }
   });
   const { data: documentTypes } = useDocumentTypes({});
   const { data: affiliationTypes } = useAffiliationTypes({
-    filters: { eaccount: userAccountId }
+    filters: { eaccount: userInfo.accountId }
   });
   const { data: provinces } = useProvinces({
-    filters: { eaccount: userAccountId }
+    filters: { eaccount: userInfo.accountId }
   });
   const { data: cities } = useCities({
     enabled: Boolean(form.values.provinceId),
@@ -1519,32 +1528,32 @@ var PatientForm = ({
   });
   const { data: stratums } = useStratums({});
   const { data: ethnicGroups } = useEthnicGroups({
-    filters: { eaccount: userAccountId }
+    filters: { eaccount: userInfo.accountId }
   });
   const { data: educationLevels } = useEducationLevels({
-    filters: { eaccount: userAccountId }
+    filters: { eaccount: userInfo.accountId }
   });
   const { data: companyClients } = useCompanyClients({
-    filters: { eaccount: userAccountId }
+    filters: { eaccount: userInfo.accountId }
   });
   const { data: contracts } = useContracts({
     enabled: Boolean(form.values.mandatoryInsurance.companyId),
     filters: {
-      eaccount: userAccountId,
+      eaccount: userInfo.accountId,
       client: Number(form.values.mandatoryInsurance.companyId) || void 0
     }
   });
   const { data: contractPopulations } = useContractPopulations({
     enabled: Boolean(form.values.mandatoryInsurance.plan),
     filters: {
-      eaccount: userAccountId,
+      eaccount: userInfo.accountId,
       contract: Number(form.values.mandatoryInsurance.plan) || void 0
     }
   });
   const { data: incomeGroups } = useIncomeGroups({
     enabled: Boolean(form.values.mandatoryInsurance.companyId),
     filters: {
-      eaccount: userAccountId,
+      eaccount: userInfo.accountId,
       corpclientId: Number(form.values.mandatoryInsurance.companyId) || void 0
     }
   });
@@ -1582,10 +1591,6 @@ var PatientForm = ({
         value: values.affiliationTypeId,
         message: "El campo Tipo de afiliado es obligatorio."
       },
-      {
-        value: values.maritalStatus,
-        message: "El campo Estado civil es obligatorio."
-      },
       {
         value: values.provinceId,
         message: "El campo Departamento es obligatorio."
@@ -1683,16 +1688,17 @@ var PatientForm = ({
     onBack?.();
   };
   const handleAddVoluntaryInsurance = () => {
-    form.insertListItem("voluntaryInsurance", {
+    const newInsurance = {
       companyTypeTag: "",
       id: Date.now().toString(),
       companyType: "",
-      companyId: "",
-      plan: "",
-      population: "",
-      groupId: "",
+      companyId: null,
+      plan: null,
+      population: null,
+      groupId: null,
       policyNumber: ""
-    });
+    };
+    form.insertListItem("voluntaryInsurance", newInsurance);
   };
   (0, import_react7.useEffect)(() => {
     if (!patientInfo || mode === "create") return;
@@ -1825,7 +1831,7 @@ var PatientForm = ({
         /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Grid.Col, { span: 6, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
           import_core8.Select,
           {
-            readOnly: mode === "view",
+            readOnly: mode === "view" || isFieldDisabled("documentTypeId"),
             withAsterisk: mode !== "view",
             label: "Tipo de Documento",
             data: documentTypeOptions,
@@ -1836,7 +1842,7 @@ var PatientForm = ({
         /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Grid.Col, { span: 6, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
           import_core8.TextInput,
           {
-            readOnly: mode === "view",
+            readOnly: mode === "view" || isFieldDisabled("documentNumber"),
             withAsterisk: mode !== "view",
             label: "N\xFAmero de Documento",
             ...form.getInputProps("documentNumber"),
@@ -1846,7 +1852,7 @@ var PatientForm = ({
         /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Grid.Col, { span: 6, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
           import_core8.TextInput,
           {
-            readOnly: mode === "view",
+            readOnly: mode === "view" || isFieldDisabled("firstName"),
             withAsterisk: mode !== "view",
             label: "Primer Nombre",
             ...form.getInputProps("firstName"),
@@ -1856,7 +1862,7 @@ var PatientForm = ({
         /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Grid.Col, { span: 6, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
           import_core8.TextInput,
           {
-            readOnly: mode === "view",
+            readOnly: mode === "view" || isFieldDisabled("middleName"),
             label: "Segundo Nombre",
             ...form.getInputProps("middleName"),
             "data-testid": "patient-form-middle-name-input"
@@ -1865,7 +1871,7 @@ var PatientForm = ({
         /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Grid.Col, { span: 6, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
           import_core8.TextInput,
           {
-            readOnly: mode === "view",
+            readOnly: mode === "view" || isFieldDisabled("surname"),
             withAsterisk: mode !== "view",
             label: "Primer Apellido",
             ...form.getInputProps("surname"),
@@ -1875,7 +1881,7 @@ var PatientForm = ({
         /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Grid.Col, { span: 6, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
           import_core8.TextInput,
           {
-            readOnly: mode === "view",
+            readOnly: mode === "view" || isFieldDisabled("secondSurname"),
             label: "Segundo Apellido",
             ...form.getInputProps("secondSurname"),
             "data-testid": "patient-form-second-surname-input"
@@ -1884,7 +1890,7 @@ var PatientForm = ({
         /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Grid.Col, { span: 6, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
           import_core8.TextInput,
           {
-            readOnly: mode === "view",
+            readOnly: mode === "view" || isFieldDisabled("birthDate"),
             withAsterisk: mode !== "view",
             label: "Fecha de Nacimiento",
             type: "date",
@@ -1895,7 +1901,8 @@ var PatientForm = ({
         /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Grid.Col, { span: 6, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
           import_core8.NumberInput,
           {
-            readOnly: true,
+            readOnly: isFieldDisabled("age"),
+            disabled: true,
             label: "Edad",
             suffix: !form.values.age ? "" : " a\xF1os",
             ...form.getInputProps("age"),
@@ -1905,7 +1912,7 @@ var PatientForm = ({
         /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Grid.Col, { span: 6, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
           import_core8.NumberInput,
           {
-            readOnly: mode === "view",
+            readOnly: mode === "view" || isFieldDisabled("whatsapp"),
             withAsterisk: mode !== "view",
             label: "WhatsApp",
             allowNegative: false,
@@ -1917,7 +1924,7 @@ var PatientForm = ({
         /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Grid.Col, { span: 6, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
           import_core8.Select,
           {
-            readOnly: mode === "view",
+            readOnly: mode === "view" || isFieldDisabled("gender"),
             withAsterisk: mode !== "view",
             label: "G\xE9nero",
             data: genderOptions,
@@ -1928,7 +1935,7 @@ var PatientForm = ({
         /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Grid.Col, { span: 6, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
           import_core8.Select,
           {
-            readOnly: mode === "view",
+            readOnly: mode === "view" || isFieldDisabled("affiliationTypeId"),
             withAsterisk: mode !== "view",
             label: "Tipo de afiliaci\xF3n",
             data: affiliationTypeOptions,
@@ -1939,7 +1946,7 @@ var PatientForm = ({
         /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Grid.Col, { span: 6, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
           import_core8.TextInput,
           {
-            readOnly: mode === "view",
+            readOnly: mode === "view" || isFieldDisabled("email"),
             label: "Correo electr\xF3nico",
             ...form.getInputProps("email"),
             "data-testid": "patient-form-email-input"
@@ -1948,8 +1955,7 @@ var PatientForm = ({
         /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Grid.Col, { span: 6, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
           import_core8.Select,
           {
-            readOnly: mode === "view",
-            withAsterisk: mode !== "view",
+            readOnly: mode === "view" || isFieldDisabled("maritalStatus"),
             label: "Estado civil",
             data: maritalStatusOptions,
             ...form.getInputProps("maritalStatus"),
@@ -1959,7 +1965,7 @@ var PatientForm = ({
         /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Grid.Col, { span: 12, mt: "sm", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
           import_core8.Checkbox,
           {
-            disabled: mode === "view",
+            readOnly: mode === "view" || isFieldDisabled("isDataPolicyAccepted"),
             label: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_core8.Text, { fz: "sm", children: [
               "Autorizo el tratamiento de mis datos personales conforme a la",
               " ",
@@ -1988,14 +1994,14 @@ var PatientForm = ({
         /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Grid.Col, { span: 6, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
           import_core8.Select,
           {
-            readOnly: mode === "view",
+            readOnly: mode === "view" || isFieldDisabled("provinceId"),
             withAsterisk: mode !== "view",
             label: "Departamento",
             data: provinceOptions,
             ...form.getInputProps("provinceId"),
             onChange: (value) => {
-              form.setFieldValue("provinceId", value || "");
-              form.setFieldValue("cityId", "");
+              form.setFieldValue("provinceId", value);
+              form.setFieldValue("cityId", null);
             },
             "data-testid": "patient-form-province-select"
           }
@@ -2003,7 +2009,7 @@ var PatientForm = ({
         /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Grid.Col, { span: 6, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
           import_core8.Select,
           {
-            readOnly: mode === "view",
+            readOnly: mode === "view" || isFieldDisabled("cityId"),
             withAsterisk: mode !== "view",
             label: "Municipio",
             data: cityOptions,
@@ -2014,7 +2020,7 @@ var PatientForm = ({
         /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Grid.Col, { span: 6, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
           import_core8.TextInput,
           {
-            readOnly: mode === "view",
+            readOnly: mode === "view" || isFieldDisabled("homeAddress"),
             label: "Direcci\xF3n",
             ...form.getInputProps("homeAddress"),
             "data-testid": "patient-form-home-address-input"
@@ -2023,7 +2029,7 @@ var PatientForm = ({
         /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Grid.Col, { span: 6, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
           import_core8.Select,
           {
-            readOnly: mode === "view",
+            readOnly: mode === "view" || isFieldDisabled("bloodType"),
             label: "Grupo sangu\xEDneo",
             data: bloodTypeOptions,
             ...form.getInputProps("bloodType"),
@@ -2033,7 +2039,7 @@ var PatientForm = ({
         /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Grid.Col, { span: 6, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
           import_core8.NumberInput,
           {
-            readOnly: mode === "view",
+            readOnly: mode === "view" || isFieldDisabled("cellphone"),
             withAsterisk: mode !== "view",
             label: "Celular",
             allowNegative: false,
@@ -2046,7 +2052,7 @@ var PatientForm = ({
         /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Grid.Col, { span: 6, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
           import_core8.NumberInput,
           {
-            readOnly: mode === "view",
+            readOnly: mode === "view" || isFieldDisabled("homephone"),
             label: "Tel\xE9fono fijo",
             allowNegative: false,
             allowDecimal: false,
@@ -2058,7 +2064,7 @@ var PatientForm = ({
         /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Grid.Col, { span: 6, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
           import_core8.Select,
           {
-            readOnly: mode === "view",
+            readOnly: mode === "view" || isFieldDisabled("stratumId"),
             withAsterisk: mode !== "view",
             label: "Estrato",
             data: stratumOptions,
@@ -2069,7 +2075,7 @@ var PatientForm = ({
         /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Grid.Col, { span: 6, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
           import_core8.Select,
           {
-            readOnly: mode === "view",
+            readOnly: mode === "view" || isFieldDisabled("ethnicGroupId"),
             withAsterisk: mode !== "view",
             label: "Pertenencia \xE9tnica",
             data: ethnicGroupOptions,
@@ -2080,7 +2086,7 @@ var PatientForm = ({
         /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Grid.Col, { span: 6, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
           import_core8.Select,
           {
-            readOnly: mode === "view",
+            readOnly: mode === "view" || isFieldDisabled("educationLevelId"),
             withAsterisk: mode !== "view",
             label: "Nivel educativo",
             data: educationLevelOptions,
@@ -2095,15 +2101,16 @@ var PatientForm = ({
               import_core8.Select,
               {
                 readOnly: mode === "view",
+                disabled: isMandatoryInsuranceDisabled,
                 withAsterisk: mode !== "view",
                 label: "Seguro",
                 data: companyClientOptions,
                 ...form.getInputProps("mandatoryInsurance.companyId"),
                 onChange: (value) => {
-                  form.setFieldValue("mandatoryInsurance.companyId", value || "");
-                  form.setFieldValue("mandatoryInsurance.plan", "");
-                  form.setFieldValue("mandatoryInsurance.population", "");
-                  form.setFieldValue("mandatoryInsurance.groupId", "");
+                  form.setFieldValue("mandatoryInsurance.companyId", value);
+                  form.setFieldValue("mandatoryInsurance.plan", null);
+                  form.setFieldValue("mandatoryInsurance.population", null);
+                  form.setFieldValue("mandatoryInsurance.groupId", null);
                   form.setFieldValue("mandatoryInsurance.policyNumber", "");
                 },
                 "data-testid": "patient-form-mandatory-insurance-company-select"
@@ -2113,14 +2120,15 @@ var PatientForm = ({
               import_core8.Select,
               {
                 readOnly: mode === "view",
+                disabled: isMandatoryInsuranceDisabled,
                 withAsterisk: mode !== "view",
                 label: "Plan",
                 data: contractOptions,
                 ...form.getInputProps("mandatoryInsurance.plan"),
                 onChange: (value) => {
-                  form.setFieldValue("mandatoryInsurance.plan", value || "");
-                  form.setFieldValue("mandatoryInsurance.population", "");
-                  form.setFieldValue("mandatoryInsurance.groupId", "");
+                  form.setFieldValue("mandatoryInsurance.plan", value);
+                  form.setFieldValue("mandatoryInsurance.population", null);
+                  form.setFieldValue("mandatoryInsurance.groupId", null);
                   form.setFieldValue("mandatoryInsurance.policyNumber", "");
                 },
                 "data-testid": "patient-form-mandatory-insurance-plan-select"
@@ -2130,6 +2138,7 @@ var PatientForm = ({
               import_core8.Select,
               {
                 readOnly: mode === "view",
+                disabled: isMandatoryInsuranceDisabled,
                 withAsterisk: mode !== "view",
                 label: "Poblaci\xF3n",
                 data: contractPopulationOptions,
@@ -2141,6 +2150,7 @@ var PatientForm = ({
               import_core8.Select,
               {
                 readOnly: mode === "view",
+                disabled: isMandatoryInsuranceDisabled,
                 withAsterisk: mode !== "view",
                 label: "Grupo de ingreso",
                 data: incomeGroupOptions,
@@ -2151,7 +2161,8 @@ var PatientForm = ({
             /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Grid.Col, { span: 6, children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
               import_core8.TextInput,
               {
-                readOnly: mode === "view",
+                readOnly: mode === "view" || isMandatoryInsuranceDisabled,
+                disabled: isMandatoryInsuranceDisabled,
                 label: "N\xFAmero de p\xF3liza",
                 ...form.getInputProps("mandatoryInsurance.policyNumber"),
                 "data-testid": "patient-form-mandatory-insurance-policy-number-input"
@@ -2164,7 +2175,7 @@ var PatientForm = ({
             PatientVoluntaryInsuranceForm,
             {
               index,
-              mode,
+              mode: isVoluntaryInsuranceDisabled ? "view" : mode,
               form
             },
             insurance.id ?? index
@@ -2175,6 +2186,7 @@ var PatientForm = ({
               variant: "outline",
               color: "secondary",
               size: "xs",
+              disabled: isVoluntaryInsuranceDisabled,
               onClick: handleAddVoluntaryInsurance,
               leftSection: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_icons_react6.IconPlus, { style: { width: 16, height: 16 } }),
               "data-testid": "patient-form-add-voluntary-insurance-button",
@@ -2258,14 +2270,14 @@ var createPatientPayload = (values) => {
     birthDate: values.birthDate,
     age: values.age,
     whatsapp: String(values.whatsapp),
-    gender: values.gender,
+    gender: values.gender ?? "",
     affiliationType: Number(values.affiliationTypeId),
     email: values.email,
-    maritalStatus: values.maritalStatus,
+    maritalStatus: values.maritalStatus ?? "",
     provinceId: Number(values.provinceId),
     cityId: Number(values.cityId),
     homeAddress: values.homeAddress,
-    bloodType: values.bloodType,
+    bloodType: values.bloodType ?? "",
     cellphone: String(values.cellphone),
     homephone: String(values.homephone),
     emergencyContact: values.emergencyContact,
@@ -2331,13 +2343,355 @@ var createPatientForm = (info) => {
     }))
   };
 };
+
+// src/components/header/Header.tsx
+var MC3 = __toESM(require("@mantine/core"), 1);
+var TI4 = __toESM(require("@tabler/icons-react"), 1);
+var import_react8 = require("react");
+
+// src/components/header/HelpModal.tsx
+var MC = __toESM(require("@mantine/core"), 1);
+var TI2 = __toESM(require("@tabler/icons-react"), 1);
+var import_jsx_runtime10 = require("react/jsx-runtime");
+var HelpModal = ({ opened, onClose, enterpriseLogo }) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(MC.Modal, { title: "Ayuda", opened, onClose, "data-testid": "header-help-modal", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(MC.Stack, { mb: "lg", align: "center", children: [
+      enterpriseLogo,
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(MC.Text, { fz: "lg", fw: "bold", children: "Informaci\xF3n de contacto" }),
+      /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(MC.Stack, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(MC.Group, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(MC.ThemeIcon, { variant: "transparent", c: "primary-color", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(TI2.IconPhone, { style: { width: 24, height: 24 } }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(MC.Text, { fz: "xs", children: "+57 300 658 32 65" })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(MC.Group, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(MC.ThemeIcon, { variant: "transparent", c: "primary-color", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(TI2.IconMail, { style: { width: 24, height: 24 } }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(MC.Text, { fz: "xs", children: "analistadesoporte@ttncompany.com" })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(MC.Group, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(MC.ThemeIcon, { variant: "transparent", c: "primary-color", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(TI2.IconMapPin, { style: { width: 24, height: 24 } }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(MC.Text, { fz: "xs", children: "Carrera 51b # 87 - 50 Piso 3 Local 337" })
+        ] })
+      ] })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(MC.Group, { justify: "end", mt: "xl", children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+      MC.Button,
+      {
+        onClick: onClose,
+        size: "sm",
+        px: "xl",
+        color: "brand-color",
+        "data-testid": "header-help-accept-button",
+        children: "Aceptar"
+      }
+    ) })
+  ] });
+};
+
+// src/components/header/ChangeAccountModal.tsx
+var MC2 = __toESM(require("@mantine/core"), 1);
+var TI3 = __toESM(require("@tabler/icons-react"), 1);
+var import_jsx_runtime11 = require("react/jsx-runtime");
+var ChangeAccountModal = ({
+  opened,
+  onClose,
+  accounts,
+  onChangeAccount
+}) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(MC2.Modal, { opened, onClose, size: 1200, title: "Cambiar cuenta", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(MC2.Grid, { px: "lg", children: accounts.map((account, accountIndex) => /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(MC2.Grid.Col, { span: 6, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(MC2.Menu, { position: "right", width: 210, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(MC2.Menu.Target, { "data-testid": `change-account-account-option-${accountIndex}`, children: /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
+      MC2.Group,
+      {
+        w: 216,
+        h: 100,
+        justify: "space-between",
+        align: "center",
+        style: (theme) => ({
+          border: `1px solid ${theme.colors.gray[3]}`,
+          borderRadius: theme.radius.md,
+          padding: "8px",
+          cursor: "pointer"
+        }),
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", {}),
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(MC2.Text, { fw: "bold", tt: "uppercase", children: account.name }),
+          /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(MC2.ThemeIcon, { variant: "transparent", c: "dimmed", children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(TI3.IconChevronRight, { style: { width: 32, height: 32 } }) })
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(MC2.Menu.Dropdown, { p: 0, children: account.profiles.map((profile, profileIndex) => /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+      MC2.Menu.Item,
+      {
+        ta: "center",
+        tt: "uppercase",
+        py: "xs",
+        onClick: () => {
+          onChangeAccount(account, profile);
+          onClose();
+        },
+        style: (theme) => ({
+          borderRadius: 0,
+          borderBottom: profileIndex !== account.profiles.length - 1 ? `1px solid ${theme.colors.gray[3]}` : void 0
+        }),
+        "data-testid": `change-account-profile-option-${accountIndex}-${profileIndex}`,
+        children: profile.name
+      },
+      profile.id
+    )) })
+  ] }) }, account.id)) }) });
+};
+
+// src/components/header/Header.tsx
+var import_jsx_runtime12 = require("react/jsx-runtime");
+var Header = ({
+  moduleName,
+  logo,
+  enterpriseLogo,
+  accounts,
+  currentSite,
+  onBackHome,
+  onChangeAccount,
+  onClickMyPayroll,
+  onClickSettings,
+  onLogout
+}) => {
+  const { userInfo } = useTTNSharedContext();
+  const [changeAccountModalOpened, setChangeAccountModalOpened] = (0, import_react8.useState)(false);
+  const [helpModalOpened, setHelpModalOpened] = (0, import_react8.useState)(false);
+  const { currentAccount, currentProfile } = (0, import_react8.useMemo)(() => {
+    if (!userInfo.accountId || !userInfo.profileId) {
+      return { currentAccount: void 0, currentProfile: void 0 };
+    }
+    const currentAccount2 = accounts.find((account) => account.id === userInfo.accountId);
+    const currentProfile2 = currentAccount2?.profiles.find(
+      (profile) => profile.id === userInfo.profileId
+    );
+    return { currentAccount: currentAccount2, currentProfile: currentProfile2 };
+  }, [accounts, userInfo]);
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_jsx_runtime12.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(MC3.Flex, { w: "100%", px: 16, py: 6, justify: "space-between", align: "center", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(MC3.Group, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(MC3.UnstyledButton, { onClick: onBackHome, "data-testid": "header-logo-button", children: logo }),
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(MC3.Title, { order: 3, c: "gray.4", fw: "inherit", children: [
+          "\u2022 ",
+          moduleName
+        ] })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(MC3.Flex, { gap: "sm", children: [
+        Boolean(currentSite) && /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(MC3.Flex, { align: "center", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(MC3.ThemeIcon, { variant: "transparent", c: "dimmed", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(TI4.IconMapPinFilled, { style: { width: 24, height: 24 } }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(MC3.Text, { c: "gray.6", fz: "sm", children: currentSite?.name })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(MC3.Menu, { width: 216, position: "bottom-end", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(MC3.Menu.Target, { "data-testid": "header-account-menu-button", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
+            MC3.Box,
+            {
+              w: 216,
+              style: (theme) => ({
+                display: "flex",
+                alignItems: "center",
+                border: `1px solid ${theme.colors.gray[3]}`,
+                borderRadius: theme.radius.sm,
+                padding: "4px 8px",
+                cursor: "pointer"
+              }),
+              children: [
+                Boolean(currentAccount) && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(MC3.ThemeIcon, { variant: "transparent", c: "primary-color", size: "lg", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(TI4.IconBuilding, { style: { width: 24, height: 24 } }) }),
+                /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(MC3.Text, { ml: 6, flex: 1, children: currentAccount?.name }),
+                /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(MC3.Avatar, { src: userInfo?.imageUrl })
+              ]
+            }
+          ) }),
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(MC3.Menu.Dropdown, { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(MC3.Stack, { px: "md", py: "sm", gap: "xs", align: "center", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(MC3.Avatar, { src: userInfo?.imageUrl, size: "lg" }),
+              /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(MC3.Text, { fw: "bold", children: userInfo?.name }),
+              /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(MC3.Text, { fw: "bold", ta: "center", c: "gray.4", children: [
+                currentAccount?.name,
+                " - ",
+                currentProfile?.name
+              ] })
+            ] }),
+            Boolean(currentAccount) && /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_jsx_runtime12.Fragment, { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+                MC3.Menu.Item,
+                {
+                  onClick: () => setChangeAccountModalOpened(true),
+                  "data-testid": "header-change-account-menu-item",
+                  children: "Cambiar rol y cuenta"
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+                MC3.Menu.Item,
+                {
+                  onClick: onClickMyPayroll,
+                  "data-testid": "header-my-payroll-menu-item",
+                  children: "Mi n\xF3mina"
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(MC3.Menu.Item, { onClick: onClickSettings, "data-testid": "header-settings-menu-item", children: "Configuraci\xF3n" })
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+              MC3.Menu.Item,
+              {
+                onClick: () => setHelpModalOpened(true),
+                "data-testid": "header-help-menu-item",
+                children: "Ayuda"
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(MC3.Menu.Divider, {}),
+            /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(MC3.Menu.Item, { onClick: onLogout, "data-testid": "header-logout-menu-item", children: "Cerrar sesi\xF3n" })
+          ] })
+        ] })
+      ] })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+      ChangeAccountModal,
+      {
+        opened: changeAccountModalOpened,
+        onClose: () => setChangeAccountModalOpened(false),
+        accounts,
+        onChangeAccount
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+      HelpModal,
+      {
+        opened: helpModalOpened,
+        onClose: () => setHelpModalOpened(false),
+        enterpriseLogo
+      }
+    )
+  ] });
+};
+
+// src/components/sidebar/Sidebar.tsx
+var import_react9 = require("react");
+var MC5 = __toESM(require("@mantine/core"), 1);
+var TI5 = __toESM(require("@tabler/icons-react"), 1);
+
+// src/components/sidebar/SidebarMenu.tsx
+var MC4 = __toESM(require("@mantine/core"), 1);
+var import_jsx_runtime13 = require("react/jsx-runtime");
+var import_react_router = require("react-router");
+var import_jsx_runtime14 = require("react/jsx-runtime");
+var SidebarMenu = ({
+  id,
+  label,
+  icon,
+  active,
+  screens,
+  onClickMenu,
+  onCloseSidebar,
+  onClickExternalScreen
+}) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_jsx_runtime14.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+      MC4.UnstyledButton,
+      {
+        onClick: () => onClickMenu(id),
+        className: "ttn-sidebar-menu",
+        "data-testid": `sidebar-menu-${label}`,
+        children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(MC4.Flex, { align: "center", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(MC4.Center, { w: 40, h: 40, me: 10, children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+            MC4.Box,
+            {
+              className: "ttn-sidebar-menu-icon",
+              style: { maskImage: `url(${icon})`, WebkitMaskImage: `url(${icon})` }
+            }
+          ) }),
+          /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(MC4.Text, { size: "sm", c: "gray.7", lineClamp: 1, children: label })
+        ] })
+      }
+    ),
+    Boolean(screens?.length) && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(MC4.Collapse, { in: active ?? false, children: screens?.map((screen) => /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_jsx_runtime13.Fragment, { children: [
+      screen.external && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(MC4.Box, { onClick: () => onClickExternalScreen(screen), children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(MC4.Text, { size: "sm", c: "gray.7", lineClamp: 1, children: screen.label }) }),
+      !screen.external && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+        import_react_router.NavLink,
+        {
+          to: screen.url || "#",
+          onClick: onCloseSidebar,
+          className: ({ isActive }) => isActive ? "ttn-sidebar-menu-item active" : "ttn-sidebar-menu-item",
+          children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(MC4.Text, { size: "sm", c: "gray.7", lineClamp: 1, children: screen.label })
+        }
+      )
+    ] }, screen.id)) })
+  ] });
+};
+
+// src/components/sidebar/Sidebar.tsx
+var import_jsx_runtime15 = require("react/jsx-runtime");
+var Sidebar = ({ modules, onClickExternalScreen }) => {
+  const [opened, setOpened] = (0, import_react9.useState)(false);
+  const [activeModuleId, setActiveModuleId] = (0, import_react9.useState)(null);
+  const handleClickMenu = (id) => {
+    setActiveModuleId(id === activeModuleId ? null : id);
+    if (!opened) {
+      setOpened(true);
+    }
+  };
+  const handleCloseSidebar = () => {
+    setActiveModuleId(null);
+    setOpened(false);
+  };
+  const handleClickExternalScreen = (item) => {
+    setActiveModuleId(null);
+    setOpened(false);
+    onClickExternalScreen(item);
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("aside", { className: opened ? "ttn-sidebar" : "ttn-sidebar closed", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(MC5.Flex, { direction: "column", justify: "center", h: 56, children: [
+      opened && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+        MC5.ActionIcon,
+        {
+          variant: "white",
+          c: "gray.6",
+          onClick: handleCloseSidebar,
+          style: { alignSelf: "flex-end" },
+          "data-testid": "sidebar-close-button",
+          children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(TI5.IconX, { style: { width: 20, height: 20 } })
+        }
+      ),
+      !opened && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(MC5.Center, { w: 80, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+        MC5.ActionIcon,
+        {
+          w: 32,
+          h: 32,
+          variant: "outline",
+          radius: "xs",
+          onClick: () => setOpened(true),
+          style: { alignSelf: "flex-end", borderWidth: 2 },
+          "data-testid": "sidebar-open-button",
+          children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(TI5.IconMenu2, { style: { width: 20, height: 20, strokeWidth: 2 } })
+        }
+      ) })
+    ] }),
+    modules.map((module2) => /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+      SidebarMenu,
+      {
+        id: module2.id,
+        label: module2.label,
+        icon: module2.icon,
+        active: activeModuleId === module2.id,
+        screens: module2.screens,
+        onClickMenu: handleClickMenu,
+        onCloseSidebar: handleCloseSidebar,
+        onClickExternalScreen: handleClickExternalScreen
+      },
+      module2.id
+    ))
+  ] });
+};
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
+  ChangeAccountModal,
+  Header,
+  HelpModal,
   PatientAdministrativeRisks,
   PatientAppointmentHistory,
   PatientAssistanceRisks,
   PatientForm,
   PatientNotes,
+  Sidebar,
   TTNSharedProvider,
   useTTNSharedContext
 });