@tmf_ciclica/ciclicastorybook 1.2.163 → 1.2.164

package/README.md

@@ -2,5 +2,50 @@
 
 Necesidades:
 
-- Para el componente MapboxMap hay que importar import "mapbox-gl/dist/mapbox-gl.css" 
+- Para el componente MapboxMap hay que importar import "mapbox-gl/dist/mapbox-gl.css"
 
+## Depuración de errores en aplicaciones consumidoras
+
+Cuando usas los componentes desde otra aplicación, los errores pueden aparecer
+encriptados en la consola porque apuntan al bundle compilado (`dist/index.es.js`).
+
+### Source maps
+
+El build genera source maps (`dist/index.es.js.map`). Para que el navegador los
+use y los stack traces apunten al código fuente original (`.jsx`), asegúrate de
+que la app consumidora no los descarte. En Vite, por defecto se usan en dev; en
+producción puedes habilitarlos con:
+
+```js
+// vite.config.js de la app consumidora
+export default defineConfig({
+  build: {
+    sourcemap: true,
+  },
+})
+```
+
+### ErrorBoundary
+
+La librería exporta un `ErrorBoundary` que captura errores de los componentes y
+muestra el nombre del componente que falló y su jerarquía, en lugar de un stack
+trace encriptado:
+
+```jsx
+import { ErrorBoundary, MapboxMap } from "@tmf_ciclica/ciclicastorybook"
+
+<ErrorBoundary name="MapboxMap">
+  <MapboxMap ... />
+</ErrorBoundary>
+```
+
+También acepta un `fallback` personalizado:
+
+```jsx
+<ErrorBoundary
+  name="MapboxMap"
+  fallback={(error, errorInfo) => <div>Ha fallado: {error.message}</div>}
+>
+  <MapboxMap ... />
+</ErrorBoundary>
+```