@dipusevilla/componentes-iu 1.0.44 → 1.0.45

package/dist/types/components/Button.d.ts

@@ -1,8 +1,8 @@
 import React, { type ButtonHTMLAttributes } from "react";
 export type ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & {
     type?: "button" | "submit" | "reset";
-    variant?: "primary" | "outline" | "ghost";
-    size?: "sm" | "md" | "lg";
+    variant?: "primary" | "outline" | "ghost" | "subtle" | "danger";
+    size?: "xs" | "sm" | "md" | "lg";
     width?: string;
     disabled?: boolean;
     /** Componente de icono (pasa un React component desde @heroicons/react) */
@@ -13,4 +13,4 @@ export type ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & {
     children?: React.ReactNode;
     onClick?: () => void;
 };
-export declare function Button({ type, variant, size, width, disabled, icon: IconComponent, iconPosition, ariaLabel, children, onClick, className: buttonClassName, }: ButtonProps): import("react/jsx-runtime").JSX.Element;
+export declare function Button({ type, variant, size, width, disabled, icon: IconComponent, iconPosition, ariaLabel, children, onClick, className: buttonClassName, ...rest }: ButtonProps): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/InfoButton.d.ts

@@ -8,5 +8,7 @@ export interface InfoButtonProps {
     position?: 'top' | 'right' | 'bottom' | 'left';
     /** Clases extra para el contenedor padre */
     className?: string;
+    onClick?: () => void;
+    ariaLabel?: string;
 }
 export declare const InfoButton: FC<InfoButtonProps>;

package/dist/types/components/NodeToolbar.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+type NodeToolbarProps = {
+    anchorEl: HTMLElement | null;
+    visible: boolean;
+    children?: React.ReactNode;
+};
+export declare function NodeToolbar({ anchorEl, visible, children }: NodeToolbarProps): React.ReactPortal | null;
+export {};

package/dist/types/editor/SchemaEditorHost.d.ts

@@ -0,0 +1,21 @@
+import React from "react";
+import type { FileSystemAdapter, ServicesAdapter } from "./adapters/types";
+export type SchemaEditorHostProps = {
+    title?: string;
+    baseDir?: string;
+    fs: FileSystemAdapter;
+    services: ServicesAdapter;
+    onSchemaChange?: (schema: unknown) => void;
+    rightPanel?: React.ReactNode;
+    /** ancho del panel derecho cuando está visible (ej: "320px") */
+    rightPanelWidth?: string;
+    /** si el panel debe arrancar abierto (por defecto: false) */
+    rightPanelDefaultOpen?: boolean;
+    /** control externo opcional */
+    rightPanelOpen?: boolean;
+    /** callback al cambiar visibilidad del panel (si lo controlas tú) */
+    onRightPanelOpenChange?: (open: boolean) => void;
+    className?: string;
+};
+export declare function SchemaEditorHost({ title, baseDir, fs, services, onSchemaChange, rightPanel, rightPanelWidth, rightPanelDefaultOpen, rightPanelOpen, onRightPanelOpenChange, className, }: SchemaEditorHostProps): import("react/jsx-runtime").JSX.Element;
+export default SchemaEditorHost;

package/dist/types/editor/SchemaEditorPage.d.ts

@@ -0,0 +1 @@
+export default function SchemaEditorPage(): import("react/jsx-runtime").JSX.Element;

package/dist/types/editor/adapters/types.d.ts

@@ -0,0 +1,17 @@
+export type FileSystemAdapter = {
+    list(): Promise<Array<{
+        name: string;
+        path: string;
+    }>>;
+    read(path: string): Promise<string>;
+    write(path: string, content: string): Promise<void>;
+    remove(path: string): Promise<void>;
+};
+export type ServicesAdapter = {
+    registry: Record<string, unknown>;
+};
+export type EditorAdapters = {
+    fs: FileSystemAdapter;
+    services: ServicesAdapter;
+    baseDir: string;
+};

package/dist/types/editor/components/Canvas.d.ts

@@ -0,0 +1 @@
+export declare function Canvas(): import("react/jsx-runtime").JSX.Element;

package/dist/types/editor/components/ColumnDropZone.d.ts

@@ -0,0 +1,26 @@
+type MovePos = {
+    s: number;
+    r: number;
+    c: number;
+    idx: number;
+};
+type Props = {
+    widthLabel?: string;
+    fields: string[];
+    indices: {
+        sIdx: number;
+        rIdx: number;
+        cIdx: number;
+    };
+    canMoveLeft: boolean;
+    canMoveRight: boolean;
+    onSelect: (name: string) => void;
+    onMove: (from: MovePos, to: Partial<MovePos>) => void;
+    onDuplicate: (name: string) => void;
+    onRemoveAt: (at: MovePos) => void;
+    onPlaceLast: () => void;
+    placeDisabled?: boolean;
+    readOnly?: boolean;
+};
+export declare function ColumnDropZone({ widthLabel, fields, indices, canMoveLeft, canMoveRight, onSelect, onMove, onDuplicate, onRemoveAt, onPlaceLast, placeDisabled, readOnly }: Props): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/editor/components/DesignerCanvas.d.ts

@@ -0,0 +1 @@
+export default function DesignerCanvas(): import("react/jsx-runtime").JSX.Element;

package/dist/types/editor/components/FieldChip.d.ts

@@ -0,0 +1,16 @@
+type Props = {
+    name: string;
+    canUp?: boolean;
+    canDown?: boolean;
+    canLeft?: boolean;
+    canRight?: boolean;
+    onSelect: () => void;
+    onUp: () => void;
+    onDown: () => void;
+    onLeft: () => void;
+    onRight: () => void;
+    onDuplicate: () => void;
+    onRemove: () => void;
+};
+export declare function FieldChip({ name, canUp, canDown, canLeft, canRight, onSelect, onUp, onDown, onLeft, onRight, onDuplicate, onRemove, }: Props): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/editor/components/Inspector.d.ts

@@ -0,0 +1,10 @@
+import type { RuleExpr } from "../../rules/RuleDSL";
+type Validation = {
+    ok: true;
+} | {
+    ok: false;
+    reason: string;
+};
+export declare function validateRule(expr: RuleExpr | undefined, fieldNames: string[]): Validation;
+export declare function Inspector(): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/editor/components/Palette.d.ts

@@ -0,0 +1,4 @@
+/** MIME types para DnD con el FormRendererEditable (se conservan por compatibilidad) */
+export declare const DRAG_MIME_FIELD = "application/x-ds-field-template";
+export declare const DRAG_MIME_LAYOUT = "application/x-ds-layout-kind";
+export declare function Palette(): import("react/jsx-runtime").JSX.Element;

package/dist/types/editor/components/RuleBuilder.d.ts

@@ -0,0 +1,11 @@
+import type { RuleExpr } from "../../rules/RuleDSL";
+type Props = {
+    value?: RuleExpr;
+    onChange: (expr: RuleExpr) => void;
+    fieldOptions: Array<{
+        label: string;
+        value: string;
+    }>;
+};
+export declare function RuleBuilder({ value, onChange, fieldOptions }: Props): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/editor/components/Toolbar.d.ts

@@ -0,0 +1,2 @@
+export declare function Toolbar(): import("react/jsx-runtime").JSX.Element;
+export default Toolbar;

package/dist/types/editor/context/adaptersProvider.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { EditorAdapters } from "../adapters/types";
+export declare function AdaptersProvider({ children, value, }: {
+    value: EditorAdapters;
+    children: React.ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function useAdapters(): EditorAdapters;

package/dist/types/editor/dnd/DraggableField.d.ts

@@ -0,0 +1,18 @@
+import type { FieldIndexPath } from "./types";
+type RowsProps = {
+    kind: "field-in-rows";
+    rowsNodeIdx: number;
+    name: string;
+    path: FieldIndexPath;
+    onSelect: () => void;
+};
+type TabsProps = {
+    kind: "field-in-tabs";
+    tabKey: string;
+    name: string;
+    path: FieldIndexPath;
+    onSelect: () => void;
+};
+type Props = RowsProps | TabsProps;
+export declare function DraggableField(p: Props): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/editor/dnd/DraggableSection.d.ts

@@ -0,0 +1,8 @@
+export declare function SectionDropSlot({ nodeIdx, insertAt }: {
+    nodeIdx: number;
+    insertAt: number;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function DraggableSectionGrip({ nodeIdx, sIdx }: {
+    nodeIdx: number;
+    sIdx: number;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/types/editor/dnd/DraggableTabChip.d.ts

@@ -0,0 +1,10 @@
+export declare function TabDropSlot({ nodeIdx, insertAt }: {
+    nodeIdx: number;
+    insertAt: number;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function DraggableTabChip({ nodeIdx, index, tabKey, label, }: {
+    nodeIdx: number;
+    index: number;
+    tabKey: string;
+    label: string;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/types/editor/dnd/DraggableTabSection.d.ts

@@ -0,0 +1,10 @@
+export declare function TabSectionDropSlot({ nodeIdx, tabKey, insertAt, }: {
+    nodeIdx: number;
+    tabKey: string;
+    insertAt: number;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function DraggableTabSectionGrip({ nodeIdx, tabKey, sIdx, }: {
+    nodeIdx: number;
+    tabKey: string;
+    sIdx: number;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/types/editor/dnd/DropColumn.d.ts

@@ -0,0 +1,26 @@
+import React from "react";
+type RowsColProps = {
+    scope: "rows-column";
+    rowsNodeIdx: number;
+    s: number;
+    r: number;
+    c: number;
+    children: React.ReactNode;
+};
+type TabsColProps = {
+    scope: "tabs-column";
+    tabKey: string;
+    s: number;
+    r: number;
+    c: number;
+    children: React.ReactNode;
+};
+type Props = RowsColProps | TabsColProps;
+/**
+ * DropColumn
+ * - Zona droppable que envuelve una columna completa.
+ * - Si se suelta aquí (y no en un InlineDropSlot), interpretamos "insertar al final"
+ *   enviando insertAt=Number.MAX_SAFE_INTEGER (el provider lo clamp-ea).
+ */
+export declare function DropColumn(props: Props): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/editor/dnd/EditorDndProvider.d.ts

@@ -0,0 +1,2 @@
+import { PropsWithChildren } from "react";
+export default function EditorDndProvider({ children }: PropsWithChildren<object>): import("react/jsx-runtime").JSX.Element;

package/dist/types/editor/dnd/GlobalDropTarget.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+type Props = {
+    className?: string;
+    children: React.ReactNode;
+};
+export default function GlobalDropTarget({ className, children }: Props): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/editor/dnd/InlineDropSlot.d.ts

@@ -0,0 +1,19 @@
+type RowsColProps = {
+    scope: "rows-column";
+    rowsNodeIdx: number;
+    s: number;
+    r: number;
+    c: number;
+    insertAt: number;
+};
+type TabsColProps = {
+    scope: "tabs-column";
+    tabKey: string;
+    s: number;
+    r: number;
+    c: number;
+    insertAt: number;
+};
+type Props = RowsColProps | TabsColProps;
+export declare function InlineDropSlot(props: Props): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/types/editor/dnd/types.d.ts

@@ -0,0 +1,62 @@
+export type FieldIndexPath = {
+    s: number;
+    r: number;
+    c: number;
+    idx: number;
+};
+export type DragData = {
+    kind: "field-in-rows";
+    name: string;
+    path: FieldIndexPath;
+    rowsNodeIdx?: number;
+} | {
+    kind: "field-in-tabs";
+    tabKey: string;
+    name: string;
+    path: FieldIndexPath;
+} | {
+    kind: "palette-field";
+    factoryKind: "text" | "number" | "email" | "password" | "select" | "textarea" | "checkbox" | "date" | "file";
+} | {
+    kind: "rows-section";
+    nodeIdx: number;
+    sIdx: number;
+} | {
+    kind: "tabs-tab";
+    nodeIdx: number;
+    index: number;
+    tabKey: string;
+} | {
+    kind: "tab-section";
+    nodeIdx: number;
+    tabKey: string;
+    sIdx: number;
+};
+export type DropTarget = {
+    scope: "rows-column";
+    rowsNodeIdx: number;
+    s: number;
+    r: number;
+    c: number;
+    insertAt?: number;
+} | {
+    scope: "tabs-column";
+    tabKey: string;
+    s: number;
+    r: number;
+    c: number;
+    insertAt?: number;
+} | {
+    scope: "rows-section";
+    nodeIdx: number;
+    insertAt: number;
+} | {
+    scope: "tabs-tab";
+    nodeIdx: number;
+    insertAt: number;
+} | {
+    scope: "tab-section";
+    nodeIdx: number;
+    tabKey: string;
+    insertAt: number;
+};

package/dist/types/editor/store.d.ts

@@ -0,0 +1,125 @@
+import type { FormSchema, FieldSchema, FieldEntry } from "../types/FormTypes";
+export declare const getYupFromEditor: () => import("yup").ObjectSchema<Record<string, unknown>, import("yup").AnyObject, any, "">;
+export type Selection = {
+    kind: "field";
+    name: string;
+} | {
+    kind: "column";
+    sectionIdx: number;
+    rowIdx: number;
+    colIdx: number;
+} | {
+    kind: "row";
+    sectionIdx: number;
+    rowIdx: number;
+} | {
+    kind: "section";
+    sectionIdx: number;
+} | {
+    kind: "tab";
+    tabKey: string;
+} | {
+    kind: "none";
+};
+export type ColumnPreset = "1" | "2" | "3" | "4" | "1/3-2/3" | "2/3-1/3" | "1/4-3/4" | "3/4-1/4";
+type IndexPath = {
+    s: number;
+    r: number;
+    c: number;
+    idx: number;
+};
+type EditorState = {
+    schema: FormSchema;
+    selection: Selection;
+    past: FormSchema[];
+    future: FormSchema[];
+};
+type EditorActions = {
+    changeFieldType: (name: string, newType: "text" | "number" | "email" | "password" | "select" | "textarea" | "checkbox" | "date" | "file") => void;
+    setSchema: (updater: (draft: FormSchema) => void) => void;
+    setSelection: (sel: Selection) => void;
+    undo: () => void;
+    redo: () => void;
+    resetHistory: () => void;
+    addField: (field: FieldEntry) => void;
+    removeField: (name: string) => void;
+    updateField: (name: string, updater: (f: FieldSchema) => void) => void;
+    duplicateField: (name: string, desiredNew?: string) => void;
+    renameField: (oldName: string, desiredNew?: string) => void;
+    addFieldAt: (field: FieldEntry, atIndex: number) => void;
+    addSection: (title?: string) => void;
+    renameSection: (sectionIdx: number, title: string) => void;
+    moveSection: (nodeIdx: number, from: number, to: number) => void;
+    removeSection: (sectionIdx: number) => void;
+    duplicateSection: (sectionIdx: number) => void;
+    addTabsContainer: () => void;
+    addTabAfter: (tabKey: string) => void;
+    removeTab: (tabKey: string) => void;
+    renameTab: (tabKey: string, newLabel: string) => void;
+    moveTab: (nodeIdx: number, from: number, to: number) => void;
+    moveTabSection: (nodeIdx: number, tabKey: string, from: number, to: number) => void;
+    addSectionToTab: (tabKey: string, title?: string) => void;
+    addRowToTabSection: (tabKey: string, sectionIdx: number) => void;
+    renameTabSection: (tabKey: string, sectionIdx: number, title: string) => void;
+    setTabRowColumns: (tabKey: string, sectionIdx: number, rowIdx: number, nCols: number) => void;
+    addColumnToTabRow: (tabKey: string, sectionIdx: number, rowIdx: number) => void;
+    removeTabColumn: (tabKey: string, sectionIdx: number, rowIdx: number, colIdx: number) => void;
+    placeFieldInTabColumn: (name: string, tabKey: string, sectionIdx: number, rowIdx: number, colIdx: number) => void;
+    moveFieldInTab: (from: {
+        tabKey: string;
+        s: number;
+        r: number;
+        c: number;
+        idx: number;
+    }, to: {
+        tabKey: string;
+        s: number;
+        r: number;
+        c: number;
+        idx?: number;
+    }) => void;
+    removeFieldFromTabLayout: (at: {
+        tabKey: string;
+        s: number;
+        r: number;
+        c: number;
+        idx: number;
+    }) => void;
+    moveTabRow: (tabKey: string, sectionIdx: number, fromRowIdx: number, toRowIdx: number) => void;
+    duplicateTabRow: (tabKey: string, sectionIdx: number, rowIdx: number) => void;
+    removeTabRow: (tabKey: string, sectionIdx: number, rowIdx: number) => void;
+    setTabRowColumnsPreset: (tabKey: string, sectionIdx: number, rowIdx: number, preset: ColumnPreset) => void;
+    addRowToSection: (sectionIdx: number) => void;
+    addColumnToRow: (sectionIdx: number, rowIdx: number) => void;
+    setRowColumns: (sectionIdx: number, rowIdx: number, nCols: number) => void;
+    removeColumn: (sectionIdx: number, rowIdx: number, colIdx: number) => void;
+    addRowsBlockAt: (layoutIdx: number, title?: string) => void;
+    addTabsContainerAt: (layoutIdx: number) => void;
+    moveLayoutNode: (fromIdx: number, toIdx: number) => void;
+    removeLayoutNode: (layoutIdx: number) => void;
+    moveRowInSection: (sectionIdx: number, fromRowIdx: number, toRowIdx: number) => void;
+    duplicateRowInSection: (sectionIdx: number, rowIdx: number) => void;
+    removeRowFromSection: (sectionIdx: number, rowIdx: number) => void;
+    setRowColumnsPreset: (sectionIdx: number, rowIdx: number, preset: ColumnPreset) => void;
+    placeFieldInColumn: (name: string, sectionIdx: number, rowIdx: number, colIdx: number) => void;
+    moveField: (from: IndexPath, to: Omit<IndexPath, "idx"> & {
+        idx?: number;
+    }) => void;
+    removeFieldFromLayout: (at: IndexPath) => void;
+    addFieldAndPlace: (fieldTemplate: Omit<FieldSchema, "name"> & Partial<Pick<FieldSchema, "name">>, sectionIdx: number, rowIdx: number, colIdx: number) => void;
+    moveFieldWithinColumn: (sectionIdx: number, rowIdx: number, colIdx: number, fromIdx: number, toIdx: number) => void;
+    insertExistingFieldAt: (name: string, sectionIdx: number, rowIdx: number, colIdx: number, atIdx: number) => void;
+    addFieldAndPlaceAt: (fieldTemplate: Omit<FieldSchema, "name"> & Partial<Pick<FieldSchema, "name">>, sectionIdx: number, rowIdx: number, colIdx: number, atIdx: number) => void;
+    moveFieldWithinTab: (tabKey: string, s: number, r: number, c: number, fromIdx: number, toIdx: number) => void;
+    insertExistingFieldInTabAt: (name: string, tabKey: string, s: number, r: number, c: number, atIdx: number) => void;
+    addFieldAndPlaceInTabAt: (fieldTemplate: Omit<FieldSchema, "name"> & Partial<Pick<FieldSchema, "name">>, tabKey: string, s: number, r: number, c: number, atIdx: number) => void;
+    placeFieldInColumnAt: (rowsNodeIdx: number, name: string, sectionIdx: number, rowIdx: number, colIdx: number, atIdx?: number) => void;
+    moveFieldAt: (fromRowsNodeIdx: number, from: IndexPath, toRowsNodeIdx: number, to: Omit<IndexPath, "idx"> & {
+        idx?: number;
+    }) => void;
+    removeFieldFromLayoutAt: (rowsNodeIdx: number, at: IndexPath) => void;
+    insertExistingFieldAtAt: (rowsNodeIdx: number, name: string, sectionIdx: number, rowIdx: number, colIdx: number, atIdx: number) => void;
+    addFieldAndPlaceAtAt: (rowsNodeIdx: number, fieldTemplate: Omit<FieldSchema, "name"> & Partial<Pick<FieldSchema, "name">>, sectionIdx: number, rowIdx: number, colIdx: number, atIdx: number) => void;
+};
+export declare const useEditorStore: import("zustand").UseBoundStore<import("zustand").StoreApi<EditorState & EditorActions>>;
+export {};

package/dist/types/index.d.ts

@@ -62,4 +62,9 @@ export { SearchField } from './components/SearchField';
 export type { SearchFieldProps } from './components/SearchField';
 export { CompactAccordion } from "./components/CompactAccordion";
 export type { CompactAccordionItem, CompactAccordionProps } from "./components/CompactAccordion";
+export { SchemaEditorHost } from "./editor/SchemaEditorHost";
+export type { SchemaEditorHostProps } from "./editor/SchemaEditorHost";
+export { Canvas } from "./editor/components/Canvas";
+export { ColumnDropZone } from "./editor/components/ColumnDropZone";
+export type { EditorAdapters, FileSystemAdapter, ServicesAdapter } from "./editor/adapters/types";
 import './styles/index.css';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dipusevilla/componentes-iu",
-  "version": "1.0.44",
+  "version": "1.0.45",
   "description": "Librería de componentes React de Dipusevilla",
   "keywords": [
     "react",
@@ -30,6 +30,9 @@
     "react-dom": "^19.1.0"
   },
   "dependencies": {
+    "@dnd-kit/core": "^6.3.1",
+    "@dnd-kit/modifiers": "^9.0.0",
+    "@dnd-kit/sortable": "^10.0.0",
     "@headlessui/react": "^2.2.4",
     "@heroicons/react": "^2.2.0",
     "@hookform/resolvers": "^5.0.1",