falta poner los fetch

Front/src/Componentes/ModalEditarPermiso.svelte

@@ -0,0 +1,85 @@
+<script lang="ts">
+    import { onMount } from "svelte";
+    import type { PermisoDto } from "../types";
+
+    let {
+        permiso = $bindable(),
+        onClose,
+        onSubmit,
+        modalTitle = "Modificar Permiso",
+    }: {
+        permiso: PermisoDto;
+        onClose: (a: string) => void;
+        onSubmit: (arg0: PermisoDto) => void;
+        modalTitle: string;
+    } = $props();
+
+    const maxChars = $state(25);
+    let remaining: number = $state(25);
+    const ogdesc: string = permiso.descripcion;
+
+    function saveChanges() {
+        onSubmit(permiso);
+        onClose(ogdesc);
+    }
+
+    function updateRemaining(event: Event) {
+        const inputValue = (event.target as HTMLInputElement).value;
+        permiso.descripcion = inputValue;
+        remaining = maxChars - inputValue.length;
+    }
+
+    $effect(() => {
+        remaining = maxChars - permiso.descripcion.length;
+    });
+</script>
+
+<div
+    class="modal show fade d-block"
+    tabindex="-1"
+    aria-labelledby="textModalLabel"
+    style="background-color: rgba(0, 0, 0, 0.3);"
+>
+    <div class="modal-dialog">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h5 class="modal-title" id="textModalLabel">{modalTitle}</h5>
+                <button
+                    type="button"
+                    class="btn-close"
+                    aria-label="Close"
+                    onclick={() => onClose(ogdesc)}
+                ></button>
+            </div>
+            <div class="modal-body">
+                <div class="mb-3">
+                    <label for="textInput" class="form-label">Descripcion</label
+                    >
+                    <input
+                        type="text"
+                        class="form-control"
+                        id="textInput"
+                        value={permiso.descripcion}
+                        maxlength={maxChars}
+                        oninput={updateRemaining}
+                    />
+                    <small class="form-text text-muted">
+                        {remaining} caracteres restantes de {maxChars}
+                    </small>
+                </div>
+            </div>
+            <div class="modal-footer">
+                <button
+                    type="button"
+                    class="btn btn-secondary"
+                    onclick={() => onClose(ogdesc)}>Cerrar</button
+                >
+                <button
+                    type="button"
+                    class="btn btn-primary"
+                    onclick={saveChanges}>Guardar</button
+                >
+            </div>
+        </div>
+    </div>
+</div>