import { Node, NodeProps } from '@xyflow/react'; import { IconName } from '../../../components/Icon'; import { FlowNodeAccent } from '../nodeRegistry'; /** * One hover-toolbar action. Shape mirrors the WIP's existing `NodeToolbarAction` * (`nodes/NodeHoverToolbar.tsx:6-13`) rather than inventing a parallel type — same * fields, same names — but is deliberately re-declared here, not imported, per * `04-note-node.md` §9/§10 (item 4): `03`'s exports stay scoped to * `NodeCard`/`NodeCardBranchRow`/`AccentIconSwatch`/`HoverBridge`/`useHoverToolbar`. */ export interface NoteAction { id: string; label: string; icon: IconName; destructive?: boolean; onClick: () => void; } export interface FlowNoteNodeData { [key: string]: unknown; text: string; onTextChange: (text: string) => void; /** @default 'Write a note' — CJO's literal placeholder (`StickyNote.tsx:139`). */ placeholder?: string; /** Drives the avatar via `getAvatarColors`/`getInitials`. Omit to render no avatar row at all. */ author?: string; /** * Body/header tint. @default 'info' — CJO's hardcoded `NOTE_ACCENT = '#0288d1'` * (`StickyNote.tsx:19`). Independent of the avatar's color — see the component doc below. */ accent?: FlowNodeAccent; /** * @default [] — CJO hardcodes exactly Duplicate + Delete with no configurability * (`StickyNote.tsx:74-108`); this generalizes that into an app-supplied list rendered * through the same hover-toolbar chrome. Passing none renders a note with no hover * toolbar at all. */ actions?: NoteAction[]; /** @default false — disables the textarea. No CJO precedent; see `04-note-node.md` §10 (item 3). */ readOnly?: boolean; /** @default 100 — CJO's exact `NOTE_TEXT_MAX_HEIGHT` (`StickyNote.tsx:18`), verified, not adjusted. */ maxTextHeight?: number; } /** * Sticky-note React Flow node (CJO `StickyNote.tsx`, Figma 1836:71148), generalized past * CJO's one hardcoded blue accent and hardcoded Duplicate/Delete action pair. * * Deliberately NOT a graph node in the connective sense `NodeCard` is: it renders zero * `` elements (CJO's own `StickyNote.tsx` never imports `Handle` either) and is * registered as a React Flow node `type` purely so it can be dragged/positioned on the * same canvas coordinate system as real nodes. * * Body/header tint: CJO hand-picks two Figma pastels (`#edf8ff`/`#dcf2ff`) for light mode * and `alpha(NOTE_ACCENT, 0.16/0.32)` for dark mode — a formula that only ever existed for * its one shipped accent. Here both modes use the SAME alpha-over-swatch formula (`0.12`/ * `0.24` light, `0.16`/`0.32` dark — dark ratio matches CJO's own 2x exactly), so any * accent (including a bare-hex brand color) gets a proportional pastel. `swatch` is read * directly from `useNodeAccent`, never `surface` — `surface` is calibrated for `NodeCard`'s * single-gradient-stop use case, not this note's two independent tones. */ declare function FlowNoteNodeComponent({ id, data }: NodeProps>): import("react/jsx-runtime").JSX.Element; export declare const FlowNoteNode: import('../../../../node_modules/react').MemoExoticComponent; export {};