lkd-web-kit 0.10.2 → 0.10.3

package/.agents/skills/update-lkd-dependencies/SKILL.md

@@ -0,0 +1,88 @@
+---
+name: update-lkd-dependencies
+description: Audita y actualiza con cautela solo las peerDependencies de lkd-web-kit. Usar cuando el usuario pida revisar versiones disponibles, actualizar peers del paquete, evaluar breaking changes de React/Mantine/Next/Zod/React Hook Form/TanStack/Ky, sincronizar package-lock o preparar una recomendacion SemVer sin publicar.
+---
+
+# Actualizar dependencias LKD
+
+## Principio
+
+Trabaja como auditor de compatibilidad de una libreria React corporativa. No actualices a ciegas: primero descubre versiones, peers, engines y riesgos; despues edita de forma acotada y valida el paquete.
+
+Esta skill no sube la version de `lkd-web-kit`, no crea tags y no publica en npm. Para publicar usa `$publish-lkd-web-kit`.
+
+Esta skill es solo para `peerDependencies`. No actualices `devDependencies`, `dependencies` ni tooling interno salvo que sea estrictamente necesario para que el lockfile resuelva los peers actualizados y el usuario lo haya pedido.
+
+## Contexto obligatorio
+
+Antes de proponer o editar dependencias, lee:
+
+- `AGENTS.md`
+- `package.json`
+- `package-lock.json`
+- `docs/generated/lkd-web-kit.md`
+
+Usa `docs/generated/lkd-web-kit.md` como fuente de verdad del catalogo publico de componentes. Si un cambio de dependencia puede afectar props, wrappers Mantine, formularios o hooks publicos, tratalo como riesgo de compatibilidad.
+
+## Auditoria de versiones
+
+1. Identifica todas las entradas de `peerDependencies`.
+2. Consulta metadata de npm para cada paquete relevante:
+
+```bash
+npm view <pkg> version peerDependencies dependencies engines --json
+```
+
+3. Para un reporte inicial no mutante, puedes ejecutar:
+
+```bash
+node .agents/skills/update-lkd-dependencies/scripts/collect-npm-metadata.mjs
+```
+
+4. Actualiza solo a versiones estables publicadas. Evita prereleases, canary, alpha, beta, rc y next salvo instruccion explicita.
+5. Mantiene alineadas familias peer que deben avanzar juntas: `react`/`react-dom`, paquetes `@mantine/*` y paquetes `@tanstack/*` cuando compartan contrato.
+
+## Politica de riesgo
+
+Detente y reporta antes de aplicar si encuentras:
+
+- Cambio major en React, Mantine, Next, Zod, React Hook Form, TanStack Query o Ky.
+- Cambio de `engines.node` que exceda el `>=22.12.0` actual o reduzca compatibilidad razonable.
+- Peer ranges incompatibles entre dependencias del kit.
+- Migraciones que obliguen a cambiar APIs publicas, props exportadas, tipos o comportamiento de componentes.
+
+Puedes aplicar patch/minor compatibles cuando las pruebas y peers lo respalden. Para majors, aplica solo si el usuario pidio explicitamente aceptar el breaking change o si el analisis demuestra que el rango actual ya era incompatible.
+
+Si por un breaking change tuviste que modificar props, componentes, formularios, hooks exportados o utilidades documentadas, regenera `docs/generated/lkd-web-kit.md` siguiendo estrictamente `docs/generate-lkd-web-kit-docs.md`. No edites el documento generado a mano salvo correcciones mecanicas posteriores al diff.
+
+## Edicion y validacion
+
+Cuando edites:
+
+- Actualiza solo `peerDependencies` en `package.json` y sincroniza `package-lock.json`.
+- Corrige drift de version entre `package.json` y `package-lock.json`; en este repo se ha visto `package.json` en `0.8.4` y lockfile en `0.8.3`.
+- No cambies `version` del paquete salvo que el usuario lo pida explicitamente fuera de esta skill.
+- No ejecutes `npm publish`, no crees tags y no automatices login.
+
+Validacion minima:
+
+```bash
+npm install --package-lock-only
+npm run lint
+npm run test
+npm run build
+npm pack --dry-run
+```
+
+Si una validacion falla, arregla solo lo necesario para la actualizacion o reporta el bloqueo con el paquete responsable.
+
+## Reporte final
+
+Termina siempre con un resumen en espanol:
+
+- Peer dependencies actualizadas.
+- Peer dependencies retenidas y motivo.
+- Breaking changes o riesgos detectados.
+- Si se regenero `docs/generated/lkd-web-kit.md`, indica por que cambio la superficie publica.
+- Validaciones ejecutadas y resultado.
+- Recomendacion SemVer para una futura publicacion: `major`, `minor` o `patch`, con una frase de justificacion.

package/.agents/skills/update-lkd-dependencies/agents/openai.yaml

@@ -0,0 +1,4 @@
+interface:
+  display_name: "Actualizar dependencias LKD"
+  short_description: "Audita y actualiza peer deps del kit"
+  default_prompt: "Usa $update-lkd-dependencies para auditar y actualizar solo las peerDependencies de lkd-web-kit con cautela."

package/.agents/skills/update-lkd-dependencies/scripts/collect-npm-metadata.mjs

@@ -0,0 +1,73 @@
+#!/usr/bin/env node
+import { execFile } from 'node:child_process'
+import { readFile } from 'node:fs/promises'
+import { promisify } from 'node:util'
+
+const execFileAsync = promisify(execFile)
+const packageJsonPath = new URL('../../../../package.json', import.meta.url)
+const npmCommand = process.platform === 'win32' ? 'npm.cmd' : 'npm'
+
+function parseMaybeJson(value) {
+  try {
+    return JSON.parse(value)
+  } catch {
+    return value.trim()
+  }
+}
+
+async function npmView(packageName) {
+  const { stdout } = await execFileAsync(
+    npmCommand,
+    ['view', packageName, 'version', 'peerDependencies', 'dependencies', 'engines', '--json'],
+    { shell: process.platform === 'win32', windowsHide: true },
+  )
+
+  return parseMaybeJson(stdout)
+}
+
+async function main() {
+  const packageJson = JSON.parse(await readFile(packageJsonPath, 'utf8'))
+  const names = Object.keys(packageJson.peerDependencies ?? {}).sort()
+  const results = []
+
+  for (const name of names) {
+    const currentRange = packageJson.peerDependencies?.[name] ?? null
+
+    try {
+      results.push({
+        name,
+        section: 'peerDependencies',
+        currentRange,
+        npm: await npmView(name),
+      })
+    } catch (error) {
+      results.push({
+        name,
+        section: 'peerDependencies',
+        currentRange,
+        error: error instanceof Error ? error.message : String(error),
+      })
+    }
+  }
+
+  console.log(
+    JSON.stringify(
+      {
+        package: {
+          name: packageJson.name,
+          version: packageJson.version,
+          engines: packageJson.engines ?? {},
+        },
+        generatedAt: new Date().toISOString(),
+        dependencies: results,
+      },
+      null,
+      2,
+    ),
+  )
+}
+
+main().catch((error) => {
+  console.error(error instanceof Error ? error.message : String(error))
+  process.exitCode = 1
+})

package/dist/index.cjs

@@ -58,6 +58,7 @@ const require_useFetchNextPageOnScroll = require("./hooks/useFetchNextPageOnScro
 const require_useUpdateSearchParams = require("./hooks/useUpdateSearchParams.cjs");
 const require_useZodConfig = require("./hooks/useZodConfig.cjs");
 const require_my_default_theme = require("./mantine/my-default-theme.cjs");
+const require_create_lkd_theme = require("./mantine/create-lkd-theme.cjs");
 const require_to_tailwind_colors = require("./mantine/to-tailwind-colors.cjs");
 const require_groupBy = require("./utils/array/groupBy.cjs");
 const require_shuffleArray = require("./utils/array/shuffleArray.cjs");
@@ -115,6 +116,7 @@ exports.TableWrapperPagination = require_TableWrapperPagination;
 exports.TableWrapperTitle = require_TableWrapperTitle;
 exports.addBodyJsonHook = require_addBodyJsonHook.addBodyJsonHook;
 exports.breakpointsWithPx = require_breakpoints_with_px.breakpointsWithPx;
+exports.createLkdTheme = require_create_lkd_theme.createLkdTheme;
 exports.createNewRoute = require_new_route.createNewRoute;
 exports.formatBytes = require_formatBytes.formatBytes;
 exports.getVirtualContainerProps = require_virtual_styles.getVirtualContainerProps;

package/dist/index.js

@@ -57,6 +57,7 @@ import { useFetchNextPageOnScroll } from "./hooks/useFetchNextPageOnScroll.js";
 import { useUpdateSearchParams } from "./hooks/useUpdateSearchParams.js";
 import { useZodConfig } from "./hooks/useZodConfig.js";
 import { myDefaultTheme } from "./mantine/my-default-theme.js";
+import { createLkdTheme } from "./mantine/create-lkd-theme.js";
 import { toTailwindColors } from "./mantine/to-tailwind-colors.js";
 import { groupBy, indexBy } from "./utils/array/groupBy.js";
 import { shuffleArray } from "./utils/array/shuffleArray.js";
@@ -66,4 +67,4 @@ import { addBodyJsonHook } from "./utils/ky/addBodyJsonHook.js";
 import { parseJSON } from "./utils/ky/parseJson.js";
 import { queryStringify } from "./utils/query-stringify.js";
 import { createNewRoute, newRoute } from "./utils/new-route.js";
-export { EmptyState, Form, FormCheckbox, FormCheckboxGroup, FormDateInput, FormDatePickerInput, FormDateTimePicker, FormInfinitySelect, FormMonthPickerInput, FormMultiSelect, FormNumberInput, FormRadioGroup, FormSelect, FormSubmitButton, FormTextInput, FormTextarea, FormTimeInput, HttpStatus, Icon, InfinityLoadMoreButton, InfinitySelect, ModalManagerProvider, MyCheckboxGroup, MyDateInput, MyDatePickerInput, MyDateTimePicker, MyMonthPickerInput, MyMultiSelect, MyNotifications, MyNumberInput, MyRadioGroup, MySelect, MyTable, MyTextInput, MyTextarea, MyTimeInput, NavItems, NavigationHistoryProvider, PageDataProvider, QP_BACK_URL_NAME, Revalidate, TableWrapper, TableWrapperFooter, TableWrapperHeader, TableWrapperPagination, TableWrapperTitle, addBodyJsonHook, breakpointsWithPx, createNewRoute, formatBytes, getVirtualContainerProps, getVirtualItemProps, groupBy, indexBy, isInfinityEmpty, myDefaultTheme, newRoute, nullableButRequired, numberToTimeInput, optionalButRequired, parseJSON, queryStringify, shuffleArray, timeInputToNumber, toTailwindColors, useBreakpoint, useFetchNextPageOnScroll, useModalManager, useNavigationHistory, useOnScrollProgress, usePageData, useUpdateSearchParams, useZodConfig, withController, withModalManager, zodValidator };
+export { EmptyState, Form, FormCheckbox, FormCheckboxGroup, FormDateInput, FormDatePickerInput, FormDateTimePicker, FormInfinitySelect, FormMonthPickerInput, FormMultiSelect, FormNumberInput, FormRadioGroup, FormSelect, FormSubmitButton, FormTextInput, FormTextarea, FormTimeInput, HttpStatus, Icon, InfinityLoadMoreButton, InfinitySelect, ModalManagerProvider, MyCheckboxGroup, MyDateInput, MyDatePickerInput, MyDateTimePicker, MyMonthPickerInput, MyMultiSelect, MyNotifications, MyNumberInput, MyRadioGroup, MySelect, MyTable, MyTextInput, MyTextarea, MyTimeInput, NavItems, NavigationHistoryProvider, PageDataProvider, QP_BACK_URL_NAME, Revalidate, TableWrapper, TableWrapperFooter, TableWrapperHeader, TableWrapperPagination, TableWrapperTitle, addBodyJsonHook, breakpointsWithPx, createLkdTheme, createNewRoute, formatBytes, getVirtualContainerProps, getVirtualItemProps, groupBy, indexBy, isInfinityEmpty, myDefaultTheme, newRoute, nullableButRequired, numberToTimeInput, optionalButRequired, parseJSON, queryStringify, shuffleArray, timeInputToNumber, toTailwindColors, useBreakpoint, useFetchNextPageOnScroll, useModalManager, useNavigationHistory, useOnScrollProgress, usePageData, useUpdateSearchParams, useZodConfig, withController, withModalManager, zodValidator };

package/dist/mantine/breakpoints-with-px.cjs

@@ -1,11 +1,12 @@
 //#region src/mantine/breakpoints-with-px.ts
 var breakpointsWithPx = {
-	xs: "576px",
+	xs: "540px",
 	sm: "640px",
 	md: "768px",
 	lg: "1024px",
 	xl: "1280px",
-	["2xl"]: "1536px"
+	"2xl": "1536px",
+	"3xl": "1680px"
 };
 //#endregion
 exports.breakpointsWithPx = breakpointsWithPx;

package/dist/mantine/breakpoints-with-px.d.ts

@@ -4,6 +4,7 @@ export declare const breakpointsWithPx: {
     md: string;
     lg: string;
     xl: string;
-    "2xl": string;
+    '2xl': string;
+    '3xl': string;
 };
 //# sourceMappingURL=breakpoints-with-px.d.ts.map

package/dist/mantine/breakpoints-with-px.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"breakpoints-with-px.d.ts","sourceRoot":"","sources":["../../src/mantine/breakpoints-with-px.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,iBAAiB;;;;;;;CAO7B,CAAA"}
+{"version":3,"file":"breakpoints-with-px.d.ts","sourceRoot":"","sources":["../../src/mantine/breakpoints-with-px.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,iBAAiB;;;;;;;;CAQ7B,CAAA"}

package/dist/mantine/breakpoints-with-px.js

@@ -1,11 +1,12 @@
 //#region src/mantine/breakpoints-with-px.ts
 var breakpointsWithPx = {
-	xs: "576px",
+	xs: "540px",
 	sm: "640px",
 	md: "768px",
 	lg: "1024px",
 	xl: "1280px",
-	["2xl"]: "1536px"
+	"2xl": "1536px",
+	"3xl": "1680px"
 };
 //#endregion
 export { breakpointsWithPx };

package/dist/mantine/create-lkd-theme.cjs

@@ -0,0 +1,7 @@
+require("../_virtual/_rolldown/runtime.cjs");
+const require_my_default_theme = require("./my-default-theme.cjs");
+let _mantine_core = require("@mantine/core");
+//#region src/mantine/create-lkd-theme.ts
+var createLkdTheme = (theme) => (0, _mantine_core.createTheme)((0, _mantine_core.mergeThemeOverrides)(require_my_default_theme.myDefaultTheme, theme));
+//#endregion
+exports.createLkdTheme = createLkdTheme;

package/dist/mantine/create-lkd-theme.d.ts

@@ -0,0 +1,3 @@
+import { MantineThemeOverride } from '@mantine/core';
+export declare const createLkdTheme: (theme: MantineThemeOverride) => MantineThemeOverride;
+//# sourceMappingURL=create-lkd-theme.d.ts.map

package/dist/mantine/create-lkd-theme.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"create-lkd-theme.d.ts","sourceRoot":"","sources":["../../src/mantine/create-lkd-theme.ts"],"names":[],"mappings":"AAAA,OAAO,EAAe,KAAK,oBAAoB,EAAuB,MAAM,eAAe,CAAA;AAG3F,eAAO,MAAM,cAAc,GAAI,OAAO,oBAAoB,KAAG,oBACJ,CAAA"}

package/dist/mantine/create-lkd-theme.js

@@ -0,0 +1,6 @@
+import { myDefaultTheme } from "./my-default-theme.js";
+import { createTheme, mergeThemeOverrides } from "@mantine/core";
+//#region src/mantine/create-lkd-theme.ts
+var createLkdTheme = (theme) => createTheme(mergeThemeOverrides(myDefaultTheme, theme));
+//#endregion
+export { createLkdTheme };

package/dist/mantine/index.d.ts

@@ -1,4 +1,5 @@
 export * from './breakpoints-with-px';
+export * from './create-lkd-theme';
 export * from './my-default-theme';
 export * from './to-tailwind-colors';
 //# sourceMappingURL=index.d.ts.map

package/dist/mantine/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/mantine/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAA;AACrC,cAAc,oBAAoB,CAAA;AAClC,cAAc,sBAAsB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/mantine/index.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAA;AACrC,cAAc,oBAAoB,CAAA;AAClC,cAAc,oBAAoB,CAAA;AAClC,cAAc,sBAAsB,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "lkd-web-kit",
-  "version": "0.10.2",
+  "version": "0.10.3",
   "description": "A template for creating React component libraries with Vite.",
   "author": "LKD",
   "license": "MIT",
@@ -20,13 +20,13 @@
     }
   },
   "bin": {
-    "lkd-install-codex-skills": "./scripts/install-codex-skills.mjs"
+    "lkd-install-agent-skills": "./scripts/install-agent-skills.mjs"
   },
   "sideEffects": false,
   "engines": {
     "node": ">=22.12.0"
   },
-  "files": ["dist", "codex/skills", "scripts/install-codex-skills.mjs"],
+  "files": ["dist", ".agents/skills", "scripts/install-agent-skills.mjs"],
   "scripts": {
     "test": "vitest run --passWithNoTests",
     "test:watch": "vitest",

package/scripts/{install-codex-skills.mjs → install-agent-skills.mjs}

@@ -4,7 +4,7 @@ import { dirname, join } from 'node:path'
 import { fileURLToPath } from 'node:url'
 
 const scriptDir = dirname(fileURLToPath(import.meta.url))
-const source = join(scriptDir, '..', 'codex', 'skills')
+const source = join(scriptDir, '..', '.agents', 'skills')
 const target = join(process.cwd(), '.agents', 'skills')
 
 if (!existsSync(source)) {

package/codex/skills/create-modal-component/SKILL.md

@@ -1,168 +0,0 @@
----
-name: create-modal-component
-description: Crear modales en proyectos internos con el modal manager global de lkd-web-kit. Usar cuando Codex deba agregar, modificar o registrar modales bajo src/components/modals, envolverlos con withModalManager, elegir entre un modal interno del proyecto o Modal de Mantine, organizar el modal en carpeta propia, tipar props para showModal, actualizar dynamicModals, MyModalManagerProvider, module augmentation o loadModals.
----
-
-# Crear Modal Component
-
-Usar este flujo para modales abiertos con `useModalManager().showModal(...)`.
-
-## Lectura Obligatoria
-
-1. Leer `docs/lkd-web-kit.md` y `docs/local-components.md`.
-2. Leer `src/components/modals/index.ts`.
-3. Leer `src/contexts/MyModalManagerContext/index.tsx`.
-4. Leer `src/types/lkd-web-kit.d.ts`.
-5. Buscar si existe un modal interno en `src/components/ui` o componentes compartidos antes de importar `Modal` de Mantine.
-6. Leer un modal existente del mismo dominio en `src/components/modals/{dominio}`.
-7. Si se toca `next/dynamic` o lazy loading, leer `node_modules/next/dist/docs/01-app/02-guides/lazy-loading.md`.
-
-## Arquitectura Actual
-
-- `lkd-web-kit` exporta `ModalManagerProvider`, `useModalManager`, `withModalManager`, `ModalRegistryItem`, `ModalKey` y tipos relacionados.
-- El proyecto no usa `src/contexts/ModalManagerContext`; no recrearlo.
-- `src/contexts/MyModalManagerContext/index.tsx` adapta el provider del kit y le pasa `dynamicModals`.
-- `src/types/lkd-web-kit.d.ts` hace module augmentation para que `showModal` infiera keys y props desde `dynamicModals`.
-- `src/app/PageProviders.tsx` envuelve la app con `MyModalManagerProvider` y propaga `loadModals`.
-
-## Estructura
-
-- Crear modales en `src/components/modals/{dominio}/{NombreModal}/index.tsx` cuando tengan formulario, schema, hooks internos, assets o subcomponentes.
-- Usar archivo plano `src/components/modals/{dominio}/{NombreModal}.tsx` solo para modales triviales de una pieza, siguiendo el patron existente.
-- Colocar piezas privadas junto al modal: `schema.ts`, `helpers.ts`, subcomponentes o assets dentro de la misma carpeta.
-- No mover logica compartida a `src/components/ui` salvo que ya exista mas de un consumidor real.
-
-## Implementacion
-
-1. Definir props exportadas si el modal recibe datos desde `showModal`:
-
-```tsx
-export interface MyModalProps {
-  itemId: string;
-  onSuccess?: () => void;
-}
-```
-
-2. Envolver el componente con `withModalManager<Props>`.
-3. Recibir `modalProps` desde el wrapper y pasarlo al modal raiz.
-4. Antes de usar `Modal` de `@mantine/core`, corroborar si el proyecto tiene un modal interno que ya envuelve Mantine y usarlo si cubre el caso.
-5. Usar clases Tailwind para spacing, radius, shadow, margin y padding; evitar props Mantine equivalentes si `className` resuelve el caso.
-6. Usar wrappers locales del proyecto o `lkd-web-kit` antes que primitivas Mantine directas.
-7. No usar `any`.
-
-Modal base con modal interno:
-
-```tsx
-import { withModalManager } from "lkd-web-kit";
-import ButtonAE from "src/components/ui/ButtonAE";
-import InternalModal from "src/components/ui/InternalModal";
-
-export interface MyModalProps {
-  onConfirm?: () => void;
-}
-
-const MyModal = withModalManager<MyModalProps>(
-  ({ onConfirm, modalProps }) => {
-    return (
-      <InternalModal {...modalProps} size="lg">
-        <InternalModal.Header>Titulo</InternalModal.Header>
-        <InternalModal.Body className="grid gap-4">Contenido</InternalModal.Body>
-        <InternalModal.Footer>
-          <ButtonAE
-            onClick={() => {
-              onConfirm?.();
-              modalProps.onClose?.();
-            }}
-          >
-            Guardar
-          </ButtonAE>
-        </InternalModal.Footer>
-      </InternalModal>
-    );
-  },
-);
-
-export default MyModal;
-```
-
-Fallback con Mantine, solo si no hay modal interno aplicable:
-
-```tsx
-import { Modal } from "@mantine/core";
-import { withModalManager } from "lkd-web-kit";
-
-const MyModal = withModalManager(({ modalProps }) => (
-  <Modal {...modalProps} title="Titulo">
-    Contenido
-  </Modal>
-));
-
-export default MyModal;
-```
-
-## Registro
-
-1. Exportar las props publicas desde el modal.
-2. Importar el tipo de props en `src/components/modals/index.ts`:
-
-```ts
-import type { MyModalProps } from "./domain/MyModal";
-```
-
-3. Registrar con `dynamicModal<Props>("domain/MyModal")`:
-
-```ts
-"domain.myModal": dynamicModal<MyModalProps>("domain/MyModal"),
-```
-
-4. Usar una key estable con formato `{dominio}.{accion}`.
-5. No tocar `src/types/lkd-web-kit.d.ts` si `dynamicModals` sigue siendo la fuente unica. La augmentacion ya apunta a `typeof dynamicModals`.
-6. Si se cambia la forma del registro, mantener `ModalRegistryItem<T>` y que cada item tenga `component`, `load` y `path`.
-
-## Contexto y Precarga
-
-- Para rutas que ya usan `PageProviders`, pasar `loadModals` ahi:
-
-```tsx
-<PageProviders loadModals={["domain.myModal"]}>{children}</PageProviders>
-```
-
-- `loadModals` acepta una key exacta o un prefijo, por ejemplo `"development"` para precargar todos los modales cuyo key empieza con ese prefijo.
-- Para layouts que no usan `PageProviders`, envolver el arbol con `MyModalManagerProvider`:
-
-```tsx
-import { MyModalManagerProvider } from "src/contexts/MyModalManagerContext";
-
-<MyModalManagerProvider loadModals={["domain.myModal"]}>
-  {children}
-</MyModalManagerProvider>
-```
-
-- Evitar providers anidados salvo que haya una razon real: un provider interno aisla estado y puede cerrar o reemplazar modales inesperadamente.
-- Invocar siempre con `useModalManager` desde `lkd-web-kit`, nunca importando el modal directo desde una vista:
-
-```tsx
-import { useModalManager } from "lkd-web-kit";
-
-const { showModal, closeModal } = useModalManager();
-showModal("domain.myModal", { itemId: "123" });
-closeModal("domain.myModal");
-```
-
-## Formularios Dentro de Modales
-
-- Usar la skill `rhf-lkd-forms` si el modal contiene formulario.
-- Pasar `onSuccess={modalProps.onClose}` o cerrar en el submit exitoso.
-- En errores de API, mostrar la alerta esperada y luego hacer `throw error`.
-- No poner mensajes textuales en reglas base de Zod.
-
-## Checklist
-
-- El modal exporta default envuelto con `withModalManager`.
-- Las props publicas estan exportadas y registradas en `dynamicModals`.
-- `showModal("key", props)` queda tipado sin `any`.
-- `useModalManager` se importa desde `lkd-web-kit`.
-- La ruta esta bajo `PageProviders` o `MyModalManagerProvider`.
-- `loadModals` se agrega solo cuando conviene precargar.
-- Se reutiliza el modal interno del proyecto salvo necesidad concreta de Mantine directo.
-- Se ejecuta una verificacion focalizada si el cambio no es trivial.

package/codex/skills/create-modal-component/agents/openai.yaml

@@ -1,4 +0,0 @@
-interface:
-  display_name: "Create Modal Component"
-  short_description: "Create project modals with manager registration."
-  default_prompt: "Use $create-modal-component to create a modal following this project's modal manager pattern."

package/codex/skills/create-svg-icon/SKILL.md

@@ -1,41 +0,0 @@
----
-name: create-svg-icon
-description: Create SVG icon files in projects that expose SVGs from src/icons. Use when Codex must add a new icon under src/icons from user-provided SVG markup, normalize SVG colors to currentColor for Tailwind text-* styling, and export the icon alias from src/icons/index.ts.
----
-
-# Create SVG Icon
-
-Use this skill when the user provides SVG markup and the desired icon name, usually in the form `Icon{Name}`.
-
-## Required Workflow
-
-1. Read `src/icons/index.ts` before editing.
-2. Determine the component export name from the user input.
-   - Expected format: `Icon{Name}`.
-   - Keep the export alias with the `Icon` prefix.
-3. Verify the icon does not already exist.
-   - Check for the exact alias in `src/icons/index.ts`.
-   - Check for the target SVG filename in `src/icons/`.
-   - If either exists, cancel the operation and notify the user.
-4. Build the SVG filename.
-   - Remove the leading `Icon` prefix.
-   - Convert the remaining name to kebab-case.
-   - Save it as `src/icons/{name}.svg`.
-   - Example: `IconBuildingTower` -> `src/icons/building-tower.svg`.
-5. Normalize the provided SVG.
-   - Replace every explicit visual color value with `currentColor`.
-   - Include colors expressed as hex, rgb(), rgba(), hsl(), hsla(), named colors, or inline style values.
-   - Apply this to attributes such as `fill`, `stroke`, `color`, `stop-color`, and CSS declarations inside `style`.
-   - Preserve `fill="none"`, `stroke="none"`, `currentColor`, `transparent`, masks, clipping, sizing, viewBox, paths, and structural SVG attributes.
-   - Do not convert opacity values to `currentColor`.
-6. Create the SVG file in `src/icons/`.
-7. Add the alias in `src/icons/index.ts` following the existing export style in that file.
-8. Report the created SVG path and the added export alias.
-
-## Guardrails
-
-- Do not use `any`.
-- Do not create React wrapper components for the icon unless the existing icon system requires it.
-- Do not overwrite an existing icon file or alias.
-- Do not invent SVG path data; use the SVG supplied by the user.
-- Keep edits scoped to `src/icons/{name}.svg` and `src/icons/index.ts` unless the user asks for something else.

package/codex/skills/create-svg-icon/agents/openai.yaml

@@ -1,3 +0,0 @@
-display_name: Create SVG Icon
-short_description: Create project SVG icons with currentColor and index exports.
-default_prompt: Create an SVG icon for this project from the SVG markup and icon name I provide.