@yoyaflow/yoya-ui 0.2.0 → 0.3.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yoyaflow/yoya-ui",
-  "version": "0.2.0",
+  "version": "0.3.0",
   "description": "A browser-native JS UI library with declarative HTML authoring: component library, router, i18n, theming and layout, works with or without a build tool, SSR-ready.",
   "type": "module",
   "private": false,

package/types/core.d.ts

@@ -450,6 +450,69 @@ export function vStateNode<S extends Record<string, unknown> = Record<string, un
   config: StateNodeConfig<S>
 ): StateNodeComponent<S>;
 
+// ---------------------------------------------------------------------------
+// Request
+// ---------------------------------------------------------------------------
+
+/** 请求传输层：RequestBase.submit() 会调用它，返回统一包装结构（如 Result.from 的 raw）。 */
+export type RequestSubmit = (request: RequestCommand) => unknown;
+
+/** 注册请求传输层；传 null 清除注册。 */
+export function configureRequest(options?: { submit?: RequestSubmit | null }): RequestSubmit | null;
+
+/** 请求实例：描述请求与映射，方法由 RequestBase 或子类提供。 */
+export interface RequestCommand {
+  address(): string;
+  method(): string;
+  headers(): Record<string, string>;
+  cookies(): string | null;
+  body(): unknown;
+  params(): Record<string, unknown>;
+  submit(): unknown;
+  toItem?: (row: unknown) => unknown;
+  toDetail?: (data: unknown) => unknown;
+  [key: string]: unknown;
+}
+
+/** 请求基类：定义请求描述与提交的默认逻辑，子类覆写或扩展。 */
+export class RequestBase {
+  method(): string;
+  headers(): Record<string, string>;
+  cookies(): string | null;
+  body(): unknown;
+  params(): Record<string, unknown>;
+  address(): string;
+  submit(): unknown;
+}
+
+// ---------------------------------------------------------------------------
+// Result
+// ---------------------------------------------------------------------------
+
+export type ResultKind = 'detail' | 'list' | 'page';
+
+/** 统一返回结构：自动判断 detail / list / page 并完成映射，失败时 from 抛错。 */
+export class Result<T = unknown> {
+  ok: boolean;
+  code: string;
+  msg: string | null;
+  showType: number;
+  data: T;
+  kind: ResultKind;
+  pageNum: number | null;
+  pageSize: number | null;
+  total: number | null;
+  readonly isSuccess: boolean;
+  readonly pages: number;
+
+  constructor(init?: Partial<Result<T>>);
+
+  static from<T = unknown>(
+    raw: unknown,
+    command?: { toItem?: (item: unknown) => unknown; toDetail?: (data: unknown) => unknown }
+  ): Result<T>;
+}
+
 // ---------------------------------------------------------------------------
 // Theme
 // ---------------------------------------------------------------------------

package/types/data-display.d.ts

@@ -271,6 +271,83 @@ export class VScroll extends HtmlElementNode {
   check(): VScroll;
 }
 
+// ---------------------------------------------------------------------------
+// Tree Ranger
+// ---------------------------------------------------------------------------
+
+export interface TreeRangerColumnContext {
+  column: number;
+  offset: number;
+  page: number;
+  pageSize: number;
+  selection: unknown[];
+  selections: unknown[];
+}
+
+export interface TreeRangerLoadResult {
+  hasMore?: boolean;
+  items: unknown[];
+  pageSize?: number;
+}
+
+export interface TreeRangerColumn {
+  icon?: (item: unknown, index: number) => ChildInput;
+  itemText?: (item: unknown) => string;
+  pageSize?: number;
+  title?: ChildInput;
+  load?: (
+    context: TreeRangerColumnContext
+  ) => Promise<TreeRangerLoadResult | unknown[]> | TreeRangerLoadResult | unknown[];
+  renderItem?: (item: unknown, index: number) => ChildInput;
+  itemKey?: (item: unknown) => unknown;
+}
+
+export interface TreeRangerChangePayload {
+  current: number;
+  detail: unknown;
+  selections: unknown[];
+  type: string;
+}
+
+export interface TreeRangerOptions {
+  ariaLabel?: string;
+  columns?: TreeRangerColumn[];
+  columnWidth?: number;
+  emptyText?: string;
+  itemHeight?: number;
+  loadingText?: string;
+  minSize?: number;
+  overscan?: number;
+  visibleColumns?: number;
+  change?: (payload: TreeRangerChangePayload) => void;
+  onChange?: (payload: TreeRangerChangePayload) => void;
+}
+
+export interface TreeRanger {
+  ariaLabel(value?: string): TreeRanger;
+  columns(): TreeRangerColumn[];
+  columns(value: TreeRangerColumn[]): TreeRanger;
+  itemHeight(value?: number): number | TreeRanger;
+  overscan(value?: number): number | TreeRanger;
+  columnWidth(value?: number): number | TreeRanger;
+  minSize(value?: number): number | TreeRanger;
+  visibleColumns(value?: number): number | TreeRanger;
+  selectedKeys(): unknown[];
+  selectedItems(): unknown[];
+  current(): number;
+  back(): TreeRanger;
+  reload(): TreeRanger;
+  refresh(): TreeRanger;
+  render(): HtmlElementNode;
+  change(handler: (payload: TreeRangerChangePayload) => void): TreeRanger;
+  onChange(handler: (payload: TreeRangerChangePayload) => void): TreeRanger;
+  [key: string]: any;
+}
+
+export function vTreeRanger(setup?: TreeRangerColumn[] | TreeRangerOptions | SetupCallback<TreeRanger>): TreeRanger;
+export const treeRanger: typeof vTreeRanger;
+export function vTreeRangerColumn(setup?: unknown): unknown;
+
 // ---------------------------------------------------------------------------
 // Table
 // ---------------------------------------------------------------------------

package/types/form.d.ts

@@ -66,6 +66,27 @@ export class VColorPicker extends HtmlElementNode {
   ): VColorPicker;
 }
 
+/** SVG icon picker with a dialog: opens an icon grid for selection. */
+export class VSvgIconPicker extends HtmlElementNode {
+  value(): string | null;
+  value(next: string | null): VSvgIconPicker;
+  clearValue(): VSvgIconPicker;
+  disabled(): boolean;
+  disabled(next: boolean): VSvgIconPicker;
+  name(): string;
+  name(next: string): VSvgIconPicker;
+  required(): boolean;
+  required(next: boolean): VSvgIconPicker;
+  icons(): string[];
+  icons(next: Array<string | { icon: () => any; name: string }>): VSvgIconPicker;
+  open(value?: boolean): VSvgIconPicker;
+  close(): VSvgIconPicker;
+  toggle(): VSvgIconPicker;
+  change(): Array<(name: string | null, picker: VSvgIconPicker) => void>;
+  change(handler: (name: string | null, picker: VSvgIconPicker) => void): VSvgIconPicker;
+  onChange(handler: (name: string | null, picker: VSvgIconPicker) => void): VSvgIconPicker;
+}
+
 /** Slider input with min/max/step constraints. */
 export class VSlider extends HtmlElementNode {
   value(): number;

package/types/ssr.d.ts

@@ -1,4 +1,5 @@
 import type { ComponentLike, I18n, ViewNode } from './core.js';
+import type { HtmlElementNode } from './html.js';
 
 export type PageFactory<S = unknown> = (state: S) => ViewNode | ComponentLike | PageFactory<S>;
 
@@ -79,3 +80,45 @@ export function hydrate<S = unknown>(
   state?: S | null,
   options?: SsrI18nOption<S>
 ): ViewNode;
+
+/** Document builder node used by renderPage: head/body callbacks build the page. */
+export class PageDocumentNode extends HtmlElementNode {
+  head(callback: (node: HtmlElementNode, state: unknown) => void): PageDocumentNode;
+  body(callback: (node: HtmlElementNode, state: unknown) => void): PageDocumentNode;
+  vBody(...args: unknown[]): PageDocumentNode;
+}
+
+export interface RenderPageConfig<S = unknown> {
+  page: (page: PageDocumentNode, state: S | null) => void;
+}
+
+export interface RenderPageOptions<S = unknown> extends SsrI18nOption<S> {
+  /** Per-request dictionary; builds an I18n instance from state.lang. */
+  messages?: Record<string, any>;
+  maxNodes?: number;
+  /** State container id. Defaults to "__YOYA_DATA__". */
+  stateId?: string;
+  /** Hydration container id. Defaults to "app". */
+  containerId?: string;
+  /** Client entry script src. Defaults to "/client.js". */
+  client?: string;
+}
+
+/** Renders a complete HTML document from DSL-defined head/body. */
+export function renderPage<S = unknown>(
+  config: RenderPageConfig<S>,
+  state?: S | null,
+  options?: RenderPageOptions<S>
+): string;
+
+export interface HydrateOrMountOptions<S = unknown> extends SsrI18nOption<S> {
+  messages?: Record<string, any>;
+  stateId?: string;
+  target?: string | ParentNode;
+}
+
+/** Client bootstrap: reads state and hydrates or mounts in one call. */
+export function hydrateOrMount<S = unknown>(
+  component: ViewNode | ComponentLike | PageFactory<S>,
+  options?: HydrateOrMountOptions<S>
+): ViewNode | null;

package/types/svg.d.ts

@@ -137,6 +137,7 @@ export function FolderOutlined(): SvgElementNode;
 export function FolderOpenOutlined(): SvgElementNode;
 export function HeartOutlined(): SvgElementNode;
 export function HomeOutlined(): SvgElementNode;
+export function ImageOutlined(): SvgElementNode;
 export function InfoOutlined(): SvgElementNode;
 export function LockOutlined(): SvgElementNode;
 export function LogoutOutlined(): SvgElementNode;

package/types/yoya.ssr.d.ts

@@ -1,4 +1,9 @@
 /**
- * Entry types for `yoya-ui/ssr`: server-side rendering helpers.
+ * Entry types for `yoya-ui/ssr`: server-side complete entry
+ * (core + html + layout + router + i18n + rendering helpers).
  */
+export * from './core.js';
+export * from './html.js';
+export * from './layout.js';
+export * from './router.js';
 export * from './ssr.js';