@grafloria/element 0.3.20 → 0.3.22

package/src/libs/renderer/src/types/theme.types.d.ts

@@ -1,305 +0,0 @@
-/**
- * Complete theme definition
- * Supports both CSS Variables (SVG+HTML) and Programmatic (Canvas)
- */
-export interface Theme {
-    /**
-     * Theme name (e.g., "Light", "Dark", "High Contrast")
-     */
-    name: string;
-    /**
-     * Theme version
-     */
-    version: string;
-    /**
-     * Color palette
-     */
-    colors: ColorPalette;
-    /**
-     * Typography settings
-     */
-    typography: Typography;
-    /**
-     * Spacing scale
-     */
-    spacing: Spacing;
-    /**
-     * Visual effects (shadows, border radius, opacity)
-     */
-    effects: Effects;
-    /**
-     * Node type defaults
-     * - default: Base styles for all nodes
-     * - [nodeType]: Type-specific overrides
-     */
-    nodes: {
-        default: NodeStyleTheme;
-        [nodeType: string]: Partial<NodeStyleTheme>;
-    };
-    /**
-     * Link type defaults
-     * - default: Base styles for all links
-     * - [linkType]: Type-specific overrides
-     */
-    links: {
-        default: LinkStyleTheme;
-        [linkType: string]: Partial<LinkStyleTheme>;
-    };
-    /**
-     * Port configuration
-     */
-    ports: PortThemeConfig;
-    /**
-     * SEMANTIC / CATEGORY PALETTE — the caller's OWN vocabulary of colours.
-     *
-     * Styling & theming, Card "Theme-bound properties". The palettes above are the
-     * renderer's CHROME (what a node's default fill is, what selection looks like).
-     * This one is the HOST's: "critical", "warning", "deprecated", "team-a" — the
-     * meanings the caller assigns to its own nodes and links.
-     *
-     * Bind a property to one with `themeRef('category.critical')`; the value is
-     * resolved against the ACTIVE theme, so a theme swap recolours it. Without
-     * this a theme swap only repaints chrome and every semantic colour in the
-     * caller's diagram stays frozen at whatever literal it was authored with.
-     *
-     * Every key is also published as `--grafloria-category-<key>` on the instance root.
-     */
-    categories?: SemanticPalette;
-    /**
-     * NAMED NUMERIC SCALE — the numeric analogue of {@link categories}.
-     *
-     * `themeRef('numbers.emphasis')` on a `strokeWidth` binds the weight to the
-     * theme, so a high-contrast theme can thicken every emphasised stroke without
-     * the caller touching a single element. Published as `--grafloria-numbers-<key>`.
-     */
-    numbers?: NumberScale;
-}
-/**
- * The host's semantic colour vocabulary (see {@link Theme.categories}).
- * Open-ended: the built-in themes ship the names below, and callers add theirs.
- */
-export interface SemanticPalette {
-    /** Blocking / fatal — the strongest attention colour. */
-    critical?: string;
-    /** Non-blocking problem. */
-    warning?: string;
-    /** Healthy / passing. */
-    success?: string;
-    /** Neutral information. */
-    info?: string;
-    /** De-emphasised / inactive. */
-    neutral?: string;
-    /** The host's brand accent. */
-    accent?: string;
-    [category: string]: string | undefined;
-}
-/**
- * A named numeric scale (see {@link Theme.numbers}). Values are unitless — they
- * are consumed as SVG lengths (`stroke-width`), which accept plain numbers.
- */
-export interface NumberScale {
-    hairline?: number;
-    regular?: number;
-    emphasis?: number;
-    heavy?: number;
-    [name: string]: number | undefined;
-}
-/**
- * Color palette for theme
- */
-export interface ColorPalette {
-    /**
-     * Background colors
-     */
-    background: {
-        /** Main diagram background */
-        default: string;
-        /** Node/surface background */
-        surface: string;
-        /** Elevated surface (modals, popovers) */
-        elevated: string;
-    };
-    /**
-     * Text colors
-     */
-    text: {
-        /** Primary text */
-        primary: string;
-        /** Secondary/muted text */
-        secondary: string;
-        /** Disabled text */
-        disabled: string;
-        /** Inverse text (for dark backgrounds) */
-        inverse: string;
-    };
-    /**
-     * State-based node colors
-     */
-    node: {
-        default: {
-            fill: string;
-            stroke: string;
-        };
-        selected: {
-            fill: string;
-            stroke: string;
-        };
-        /** Attention emphasis (independent of selection); selected wins when both. */
-        highlighted: {
-            fill: string;
-            stroke: string;
-        };
-        hovered: {
-            fill: string;
-            stroke: string;
-        };
-        disabled: {
-            fill: string;
-            stroke: string;
-        };
-        error: {
-            fill: string;
-            stroke: string;
-        };
-    };
-    /**
-     * State-based link colors
-     */
-    link: {
-        default: string;
-        selected: string;
-        /** Attention emphasis (independent of selection). */
-        highlighted: string;
-        hovered: string;
-        disabled: string;
-    };
-    /**
-     * Port colors by type
-     */
-    port: {
-        input: string;
-        output: string;
-        bi: string;
-    };
-    /**
-     * Semantic colors
-     */
-    primary: string;
-    secondary: string;
-    success: string;
-    warning: string;
-    error: string;
-    info: string;
-}
-/**
- * Typography theme
- */
-export interface Typography {
-    /**
-     * Font families
-     */
-    fontFamily: {
-        default: string;
-        mono: string;
-    };
-    /**
-     * Font sizes (in pixels)
-     */
-    fontSize: {
-        xs: number;
-        sm: number;
-        md: number;
-        lg: number;
-        xl: number;
-    };
-    /**
-     * Font weights
-     */
-    fontWeight: {
-        normal: number;
-        medium: number;
-        bold: number;
-    };
-    /**
-     * Line heights
-     */
-    lineHeight: {
-        tight: number;
-        normal: number;
-        relaxed: number;
-    };
-}
-/**
- * Spacing theme (in pixels)
- */
-export interface Spacing {
-    xs: number;
-    sm: number;
-    md: number;
-    lg: number;
-    xl: number;
-}
-/**
- * Effects theme (shadows, border radius, opacity)
- */
-export interface Effects {
-    /**
-     * Shadow definitions (CSS box-shadow values)
-     */
-    shadow: {
-        none: string;
-        sm: string;
-        md: string;
-        lg: string;
-    };
-    /**
-     * Border radius values (in pixels)
-     */
-    borderRadius: {
-        none: number;
-        sm: number;
-        md: number;
-        lg: number;
-        full: number;
-    };
-    /**
-     * Opacity values (0-1)
-     */
-    opacity: {
-        disabled: number;
-        ghost: number;
-        translucent: number;
-    };
-}
-/**
- * Node style from theme
- */
-export interface NodeStyleTheme {
-    fill: string;
-    stroke: string;
-    strokeWidth: number;
-    borderRadius: number;
-    shadow: boolean;
-    opacity: number;
-}
-/**
- * Link style from theme
- */
-export interface LinkStyleTheme {
-    stroke: string;
-    strokeWidth: number;
-    strokeDasharray?: string;
-    opacity: number;
-}
-/**
- * Port theme configuration
- */
-export interface PortThemeConfig {
-    size: number;
-    strokeWidth: number;
-    colors: {
-        input: string;
-        output: string;
-        bi: string;
-    };
-}

package/src/libs/renderer/src/types/theme.types.js

@@ -1,3 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-//# sourceMappingURL=theme.types.js.map

package/src/libs/renderer/src/types/vnode.types.d.ts

@@ -1,139 +0,0 @@
-/**
- * VNode element type
- *
- * Discriminated union of all supported SVG and HTML element types.
- * Using a union type enables better TypeScript type checking and autocomplete.
- */
-export type VNodeType = 'rect' | 'circle' | 'ellipse' | 'line' | 'polyline' | 'polygon' | 'path' | 'text' | 'g' | 'svg' | 'foreignObject' | 'div' | 'span' | string;
-/**
- * Virtual Node - Abstract representation of visual element
- * Framework-agnostic, serializable, diffable
- *
- * Supports both SVG and Canvas rendering modes, as well as HTML content
- * via foreignObject for embedding rich components.
- */
-export interface VNode {
-    /**
-     * Element type: 'svg', 'g', 'rect', 'circle', 'path', 'text', 'foreignObject', etc.
-     */
-    type: VNodeType;
-    /**
-     * Element properties (attributes, styles, event handlers)
-     */
-    props: VNodeProps;
-    /**
-     * Optional children VNodes (for hierarchical structures)
-     */
-    children?: VNode[];
-    /**
-     * Optional unique key for diffing optimization
-     * Used by renderers to efficiently update only changed nodes
-     */
-    key?: string;
-}
-/**
- * VNode properties supporting SVG attributes, styles, and event handlers
- */
-export interface VNodeProps {
-    /** X coordinate */
-    x?: number;
-    /** Y coordinate */
-    y?: number;
-    /** Width */
-    width?: number;
-    /** Height */
-    height?: number;
-    /** Border radius X (rounded corners) */
-    rx?: number;
-    /** Border radius Y (rounded corners) */
-    ry?: number;
-    /** Circle center X */
-    cx?: number;
-    /** Circle center Y */
-    cy?: number;
-    /** Circle radius */
-    r?: number;
-    /** Line start X */
-    x1?: number;
-    /** Line start Y */
-    y1?: number;
-    /** Line end X */
-    x2?: number;
-    /** Line end Y */
-    y2?: number;
-    /** SVG path data (d attribute) */
-    d?: string;
-    /** Fill color */
-    fill?: string;
-    /** Stroke color */
-    stroke?: string;
-    /** Stroke width */
-    strokeWidth?: number;
-    /** Stroke dash array (dashed lines) */
-    strokeDasharray?: string;
-    /** Opacity (0-1) */
-    opacity?: number;
-    /** SVG transform attribute */
-    transform?: string;
-    /** Text content */
-    textContent?: string;
-    /** Font size (in pixels) */
-    fontSize?: number;
-    /** Font family */
-    fontFamily?: string;
-    /** Text anchor (alignment) */
-    textAnchor?: 'start' | 'middle' | 'end';
-    /** CSS class names (space-separated) */
-    className?: string;
-    /**
-     * Container ID for foreignObject elements
-     * Used by ComponentRenderer to target the specific foreignObject for Angular component injection
-     */
-    containerId?: string;
-    /**
-     * SVG foreignObject requiredExtensions attribute
-     * Specifies SVG extensions required for rendering
-     */
-    requiredExtensions?: string;
-    /**
-     * XML namespace (typically for XHTML in foreignObject)
-     * Example: 'http://www.w3.org/1999/xhtml'
-     */
-    xmlns?: string;
-    /**
-     * Inline CSS style.
-     *
-     * BOTH forms are emitted in production and both are supported by every
-     * consumer (`patch.ts::serializeStyle`, and the canvas style resolver):
-     *   - an OBJECT (`{ cursor: 'move' }`) — the interaction overlays,
-     *   - a STRING (`'fill: #fff; stroke-width: 2'`) — the shape registry and the
-     *     link style computation, which put the resolved cascade inline precisely
-     *     so it beats the theme stylesheet.
-     *
-     * This was typed object-only, and the string form slipped past the compiler
-     * only because it always arrives through an `any`-typed style bag. Anything
-     * reading `props.style` off a VNode had no way to know it had to handle a
-     * string. It does.
-     */
-    /**
-     * Inline style: either a declaration map, or a raw CSS string.
-     *
-     * The string form is not a convenience — it is the ONLY form in which a shape
-     * can carry a `var(--grafloria-*)` paint (a presentation attribute cannot hold a
-     * variable), and the shape registry and link styles have always emitted it.
-     * The type said object-only and got away with it purely because those values
-     * arrive through `any`-typed prop bags; the runtime (`serializeStyle`, and the
-     * patcher) has handled both all along. Typing it honestly is what lets the
-     * cascade fixes type-check at all.
-     */
-    style?: Record<string, any> | string;
-    /** Click event handler */
-    onClick?: (e: Event) => void;
-    /** Mouse enter event handler */
-    onMouseEnter?: (e: Event) => void;
-    /** Mouse leave event handler */
-    onMouseLeave?: (e: Event) => void;
-    /** Mouse down event handler */
-    onMouseDown?: (e: Event) => void;
-    [key: string]: any;
-}

package/src/libs/renderer/src/types/vnode.types.js

@@ -1,3 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-//# sourceMappingURL=vnode.types.js.map