@mosaicoo/kanban 0.1.0 → 0.2.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mosaicoo/kanban",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "description": "Flexible board engine and Angular UI for Kanban-style visual organization — configurable columns, swimlanes and dynamic grouping, with a headless zero-dependency core.",
   "license": "Apache-2.0",
   "homepage": "https://github.com/mosaicoo/mosaicoo-kanban#readme",
@@ -40,6 +40,10 @@
       "types": "./types/mosaicoo-kanban-core.d.ts",
       "default": "./fesm2022/mosaicoo-kanban-core.mjs"
     },
+    "./designer": {
+      "types": "./types/mosaicoo-kanban-designer.d.ts",
+      "default": "./fesm2022/mosaicoo-kanban-designer.mjs"
+    },
     "./ui": {
       "types": "./types/mosaicoo-kanban-ui.d.ts",
       "default": "./fesm2022/mosaicoo-kanban-ui.mjs"
@@ -48,7 +52,17 @@
   "peerDependencies": {
     "@angular/cdk": ">=21.0.0 <23.0.0",
     "@angular/common": ">=21.0.0 <23.0.0",
-    "@angular/core": ">=21.0.0 <23.0.0"
+    "@angular/core": ">=21.0.0 <23.0.0",
+    "@angular/forms": ">=21.0.0 <23.0.0",
+    "@angular/material": ">=21.0.0 <23.0.0"
+  },
+  "peerDependenciesMeta": {
+    "@angular/forms": {
+      "optional": true
+    },
+    "@angular/material": {
+      "optional": true
+    }
   },
   "dependencies": {
     "tslib": "^2.3.0"

package/types/mosaicoo-kanban-core.d.ts

@@ -4,7 +4,7 @@
  * Mantida em sincronia com projects/kanban/package.json pelo processo de
  * release (standard-version updater — mesmo mecanismo do @mosaicoo/svg-engine).
  */
-declare const MKB_VERSION = "0.1.0";
+declare const MKB_VERSION = "0.2.0";
 
 /**
  * Modelo DECLARATIVO de cartão — serializável (docs/01 §4). O cartão é uma

package/types/mosaicoo-kanban-designer.d.ts

@@ -0,0 +1,139 @@
+import * as _angular_core from '@angular/core';
+import { OnDestroy } from '@angular/core';
+import * as _mosaicoo_kanban_core from '@mosaicoo/kanban/core';
+import { BoardConfig, KanbanRegistry, ValidationIssue, KanbanBoard, KanbanAxisConfig, KanbanGroupDef, KanbanBlockType } from '@mosaicoo/kanban/core';
+
+/** Tema do designer: só os tokens ALTERADOS em relação ao default. */
+type KanbanDesignTheme = Record<string, string>;
+/** Arquivo de design completo (round-trip do designer). O `config` sozinho
+ * também é aceito na importação — é o BoardConfig puro do runtime. */
+interface KanbanDesignFile {
+    version: 1;
+    config: BoardConfig;
+    theme?: KanbanDesignTheme;
+}
+/** Eixo em forma canônica de edição (sempre objeto). */
+interface DraftAxis extends KanbanAxisConfig {
+    groups?: KanbanGroupDef[];
+}
+/**
+ * Estado do Designer — instância POR componente (provider do
+ * MosKanbanDesigner; nunca singleton de módulo). Fonte da verdade é um
+ * BoardConfig serializável em forma canônica de edição (eixos como objeto);
+ * toda mutação passa por `update()` (clone → muta → valida → re-preview).
+ */
+declare class DesignerStore {
+    readonly config: _angular_core.WritableSignal<BoardConfig>;
+    readonly theme: _angular_core.WritableSignal<KanbanDesignTheme>;
+    registry: KanbanRegistry | undefined;
+    /** Validação contínua da config em edição. */
+    readonly validation: _angular_core.Signal<_mosaicoo_kanban_core.ValidationResult>;
+    readonly errors: _angular_core.Signal<ValidationIssue[]>;
+    /** Board do preview — recriado a cada config VÁLIDA (a inválida mantém o
+     * último preview bom, com os erros listados ao lado). */
+    private lastGood;
+    readonly previewBoard: _angular_core.Signal<KanbanBoard | null>;
+    /** String de estilo com os tokens alterados (aplicada no preview). */
+    readonly themeStyle: _angular_core.Signal<string>;
+    /** Toda mutação: clona, aplica, publica (imutável p/ OnPush). */
+    update(mutator: (draft: BoardConfig) => void): void;
+    load(config: BoardConfig, theme?: KanbanDesignTheme): void;
+    setToken(token: string, value: string): void;
+    resetTheme(): void;
+    /** Eixo de colunas SEMPRE como objeto (açúcar de array normalizado). */
+    columnsAxis(): DraftAxis;
+    lanesAxis(): DraftAxis | null;
+    private axisOf;
+    /** Importa qualquer config para a forma canônica de edição. */
+    private canonicalize;
+    /** Aceita BoardConfig puro OU KanbanDesignFile; retorna erros sem aplicar
+     * quando a config é inválida. */
+    import(json: string): {
+        ok: boolean;
+        errors: ValidationIssue[];
+    };
+    exportConfigJson(): string;
+    exportDesignJson(): string;
+    /** Snippet CSS só com os tokens alterados (nada = string vazia). */
+    exportThemeCss(): string;
+    saveDraft(storageKey: string): void;
+    loadDraft(storageKey: string): boolean;
+    clearDraft(storageKey: string): void;
+    destroy(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<DesignerStore, never>;
+    static ɵprov: _angular_core.ɵɵInjectableDeclaration<DesignerStore>;
+}
+
+/**
+ * Designer do Board — tela OPT-IN (entry point isolado
+ * `@mosaicoo/kanban/designer`): edita visualmente o BoardConfig (pipeline,
+ * cartão, dados, tema) com preview ao vivo e importa/exporta no formato que
+ * o kanban consome em runtime. Exige @angular/material + @angular/forms
+ * (peers opcionais do pacote — quem não usa o designer não paga por eles).
+ */
+declare class MosKanbanDesigner implements OnDestroy {
+    protected readonly store: DesignerStore;
+    /** Config inicial (senão: rascunho salvo → default). */
+    readonly config: _angular_core.InputSignal<BoardConfig | null>;
+    /** Tema inicial (tokens alterados). */
+    readonly theme: _angular_core.InputSignal<KanbanDesignTheme | null>;
+    /** Registry do host — deixa o preview resolver rule:, icon: e format:. */
+    readonly registry: _angular_core.InputSignal<KanbanRegistry | undefined>;
+    /** Chave do rascunho automático em localStorage; '' desliga. */
+    readonly storageKey: _angular_core.InputSignal<string>;
+    /** Config a cada mudança VÁLIDA (para persistência pelo host). */
+    readonly configChange: _angular_core.OutputEmitterRef<BoardConfig>;
+    readonly themeChange: _angular_core.OutputEmitterRef<KanbanDesignTheme>;
+    protected readonly importErrors: _angular_core.WritableSignal<ValidationIssue[]>;
+    private initialized;
+    constructor();
+    protected hasTheme(): boolean;
+    protected onImportFile(event: Event): void;
+    protected applyJson(area: HTMLTextAreaElement): void;
+    protected exportConfig(): void;
+    protected exportDesign(): void;
+    protected exportCss(): void;
+    protected clearDraft(): void;
+    private download;
+    ngOnDestroy(): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<MosKanbanDesigner, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<MosKanbanDesigner, "mos-kanban-designer", never, { "config": { "alias": "config"; "required": false; "isSignal": true; }; "theme": { "alias": "theme"; "required": false; "isSignal": true; }; "registry": { "alias": "registry"; "required": false; "isSignal": true; }; "storageKey": { "alias": "storageKey"; "required": false; "isSignal": true; }; }, { "configChange": "configChange"; "themeChange": "themeChange"; }, never, never, true, never>;
+}
+
+/**
+ * Metadados do Designer — a tela é GERADA a partir destas tabelas, não de
+ * formulários escritos à mão por tipo. Adicionar um token ou um campo de
+ * bloco aqui é o suficiente para ele aparecer na tela.
+ */
+interface TokenDef {
+    /** Nome CSS completo (--mkb-…). */
+    token: string;
+    label: string;
+    kind: 'color' | 'text';
+    /** Default de fábrica (para reset e para exportar só o que mudou). */
+    default: string;
+}
+interface TokenGroup {
+    label: string;
+    tokens: TokenDef[];
+}
+/** Espelho de styles/kanban-tokens.css (defaults de fábrica). */
+declare const TOKEN_GROUPS: TokenGroup[];
+type FieldKind = 'text' | 'number' | 'toggle' | 'select' | 'csv' | 'json' | 'facts' | 'card-actions' | 'capabilities';
+interface BlockFieldDef {
+    key: string;
+    label: string;
+    kind: FieldKind;
+    options?: string[];
+    hint?: string;
+}
+/** Descritores dos campos editáveis de cada tipo de bloco. */
+declare const BLOCK_FIELDS: Record<KanbanBlockType, BlockFieldDef[]>;
+/** Tipos de bloco oferecidos no "adicionar bloco" (ordem de exibição). */
+declare const BLOCK_TYPE_LABELS: Array<{
+    type: KanbanBlockType;
+    label: string;
+}>;
+
+export { BLOCK_FIELDS, BLOCK_TYPE_LABELS, DesignerStore, MosKanbanDesigner, TOKEN_GROUPS };
+export type { BlockFieldDef, FieldKind, KanbanDesignFile, KanbanDesignTheme, TokenDef, TokenGroup };

package/types/mosaicoo-kanban-ui.d.ts

@@ -373,7 +373,7 @@ declare class MosKanbanBoard {
     readonly dragStarted: _angular_core.OutputEmitterRef<KanbanDragInfo>;
     readonly dragEnded: _angular_core.OutputEmitterRef<KanbanDragInfo>;
     readonly dragCanceled: _angular_core.OutputEmitterRef<KanbanDragInfo>;
-    protected readonly version = "0.1.0";
+    protected readonly version = "0.2.0";
     protected readonly cardDef: _angular_core.Signal<MosKanbanCardDef | undefined>;
     protected readonly menu: _angular_core.WritableSignal<MenuState | null>;
     /** Mensagem do aria-live (movimentos por teclado e recusas). */