@yoyaflow/yoya-ui 0.1.0

package/types/router.d.ts

@@ -0,0 +1,123 @@
+import type {
+  ChildInput,
+  ElementFactory,
+  ElementNode,
+  ElementOptions,
+  SetupCallback,
+  SetupInput
+} from './core.js';
+import type { HtmlElementNode } from './html.js';
+
+export type RouterMode = 'hash' | 'history';
+
+export interface RouteContext {
+  path: string;
+  params: Record<string, string>;
+  query: Record<string, string>;
+  route: RouteDeclaration | null;
+}
+
+export type RouteView = ChildInput | ((context: RouteContext) => ChildInput | Promise<ChildInput>);
+
+export interface RouteConfig {
+  view?: RouteView;
+  component?: RouteView;
+  beforeEnter?: (context: RouteContext) => boolean | void | Promise<boolean | void>;
+  [key: string]: any;
+}
+
+export interface RouteDeclaration {
+  pattern: string;
+  config: RouteConfig | RouteView;
+}
+
+export type RouterGuard = (context: RouteContext) => boolean | void | Promise<boolean | void>;
+
+export interface NavigateOptions {
+  replace?: boolean;
+  state?: unknown;
+}
+
+/** Hash/history router as a view node. */
+export class Router extends ElementNode {
+  default(path: string): Router;
+  mode(): RouterMode;
+  mode(value: RouterMode): Router;
+  route(pattern: string, config: RouteConfig | RouteView): Router;
+  /** Declarative route registration (available on vRouter instances). */
+  vRoute(pattern: string, config: RouteConfig | RouteView): Router;
+  notFound(view: RouteView): Router;
+  loading(view: RouteView): Router;
+  error(view: RouteView): Router;
+  beforeEach(guard: RouterGuard): Router;
+  start(): Router;
+  stop(): Router;
+  navigate(path: string, options?: NavigateOptions): Router;
+  refresh(): Router;
+  renderPath(path: string): Router;
+  currentPath(): string;
+  currentParams(): Record<string, string>;
+  currentQuery(): Record<string, string>;
+  currentRoute(): RouteDeclaration | null;
+  currentView(): ViewNodeLike | null;
+  outlet(): ElementNode;
+  outlet(value: ElementNode): Router;
+  subscribe(listener: (router: Router) => void): () => void;
+  go(delta: number): Router;
+  back(): Router;
+  forward(): Router;
+}
+
+/** Minimal node shape returned by currentView(). */
+export interface ViewNodeLike {
+  toHTML(): string;
+  renderDom(): Node | null;
+  destroy(): unknown;
+  [key: string]: any;
+}
+
+/** Creates a router; alias of createRouter. */
+export const router: typeof createRouter;
+
+/** Creates a router with optional setup. */
+export const createRouter: ElementFactory<Router> & {
+  (first?: SetupInput<Router> | null, callback?: SetupCallback<Router>): Router;
+};
+
+/** Declares a route (used inside route lists). */
+export function vRoute(pattern: string, config: RouteConfig | RouteView): RouteDeclaration;
+
+/** Declarative router container. */
+export const vRouter: ElementFactory<Router> & {
+  (first?: SetupInput<Router> | null, callback?: SetupCallback<Router>): Router;
+};
+
+/** Router link with to/params/query/replace/exact helpers. */
+export function vLink(
+  routerInstance: Router,
+  setup?: SetupInput<HtmlElementNode> | null,
+  callback?: SetupCallback<HtmlElementNode>
+): HtmlElementNode;
+
+/** Current-route outlet bound to a router. */
+export function vRouterView(
+  routerInstance: Router,
+  setup?: SetupInput<HtmlElementNode> | null,
+  callback?: SetupCallback<HtmlElementNode>
+): HtmlElementNode;
+
+/** Multi-outlet router view. */
+export function vRouterViews(
+  routerInstance: Router,
+  setup?: SetupInput<HtmlElementNode> | null,
+  callback?: SetupCallback<HtmlElementNode>
+): HtmlElementNode;
+
+/**
+ * Parent-shortcut surface merged onto HtmlElementNode. Router shortcuts
+ * (vRouter/vLink/vRouterView/vRouterViews) live on ElementNode and are
+ * inherited; this interface is kept for the shared DSL merge point.
+ */
+export interface RouterParentShortcuts {}
+
+export type { ElementOptions };

package/types/ssr.d.ts

@@ -0,0 +1,81 @@
+import type { ComponentLike, I18n, ViewNode } from './core.js';
+
+export type PageFactory<S = unknown> = (state: S) => ViewNode | ComponentLike | PageFactory<S>;
+
+/**
+ * Optional i18n binding for render/mount/hydrate: an I18n instance, or a
+ * factory receiving the request state. When provided, the ".s()" string
+ * shortcut is automatically scoped to that instance during the build.
+ */
+export interface SsrI18nOption<S = unknown> {
+  i18n?: I18n | ((state: S | null) => I18n);
+}
+
+export interface RenderOptions<S = unknown> extends SsrI18nOption<S> {
+  maxNodes?: number;
+  state?: S | null;
+}
+
+export interface RenderResult {
+  exceeded: boolean;
+  html: string;
+  state: string | null;
+}
+
+/** Raw request fields accepted by resolveLocale; extraction is done by the caller. */
+export interface LocaleInput {
+  /** Raw Cookie request header string. */
+  cookie?: string;
+  /** Request URL (path + query, or full URL). */
+  url?: string;
+  /** Raw Accept-Language request header string. */
+  acceptLanguage?: string;
+}
+
+export interface ResolveLocaleOptions {
+  /** Cookie key holding the locale identifier. Defaults to "yoya-lang". */
+  cookieKey?: string;
+  /** Query key used as fallback. Defaults to "locale". */
+  queryKey?: string;
+  /** Locale returned when nothing matches. Defaults to "zh-CN". */
+  defaultLanguage?: string;
+}
+
+/**
+ * Resolves the locale identifier from a request with priority
+ * cookie > query > Accept-Language > defaultLanguage. Only receives raw
+ * strings, so it works with any framework; extract the fields yourself
+ * (e.g. req.headers.cookie or request.headers.get('cookie')).
+ */
+export function resolveLocale(input?: LocaleInput | null, options?: ResolveLocaleOptions): string;
+
+/**
+ * Server-side render: serializes a page factory/component to HTML plus initial
+ * state. Exceeds maxNodes, falls back to client rendering.
+ */
+export function renderToString<S = unknown>(
+  component: ViewNode | ComponentLike | PageFactory<S>,
+  options?: RenderOptions<S>
+): RenderResult;
+
+/** Serializes state to a JSON string safe to inline into <script>. */
+export function serializeState(state: unknown): string | null;
+
+/** Parses serialized state; null/empty input returns null. */
+export function parseState(serialized: string | null | undefined): unknown;
+
+/** Client-side full mount: rebuilds the tree and replaces the target content. */
+export function mount<S = unknown>(
+  component: ViewNode | ComponentLike | PageFactory<S>,
+  target: string | ParentNode,
+  state?: S | null,
+  options?: SsrI18nOption<S>
+): ViewNode;
+
+/** Hydrates server-rendered DOM: adopts elements and binds pending events. */
+export function hydrate<S = unknown>(
+  component: ViewNode | ComponentLike | PageFactory<S>,
+  target: string | ParentNode,
+  state?: S | null,
+  options?: SsrI18nOption<S>
+): ViewNode;

package/types/svg.d.ts

@@ -0,0 +1,158 @@
+import type {
+  ElementNode,
+  ElementOptions,
+  SetupCallback,
+  SetupInput,
+  StyleInput,
+  StyleValue
+} from './core.js';
+
+export const SVG_NAMESPACE: string;
+
+/**
+ * SvgElementNode is an SVG-namespace element node. SVG child shortcuts are
+ * only registered here, keeping the HTML and SVG DSLs separate.
+ */
+export class SvgElementNode extends ElementNode {
+  /** SVG text hosts accept raw text; other elements create <text> children. */
+  text(
+    ...args: Array<
+      string | number | SetupCallback<SvgElementNode> | ElementOptions | null | undefined
+    >
+  ): this;
+
+  renderDom(): SVGElement | null;
+}
+
+/** Signature shared by SVG factories: accepts any number of setup inputs. */
+export interface SvgElementFactory {
+  (...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+}
+
+/** SVG child shortcuts registered on SvgElementNode. */
+export interface SvgChildShortcuts {
+  svg(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  animate(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  animateMotion(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  animateTransform(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  circle(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  clipPath(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  defs(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  desc(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  ellipse(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  feBlend(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  feColorMatrix(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  feComponentTransfer(
+    ...setups: Array<SetupInput<SvgElementNode> | null | undefined>
+  ): SvgElementNode;
+  feComposite(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  feConvolveMatrix(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  feDiffuseLighting(
+    ...setups: Array<SetupInput<SvgElementNode> | null | undefined>
+  ): SvgElementNode;
+  feDisplacementMap(
+    ...setups: Array<SetupInput<SvgElementNode> | null | undefined>
+  ): SvgElementNode;
+  feDistantLight(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  feDropShadow(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  feFlood(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  feFuncA(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  feFuncB(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  feFuncG(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  feFuncR(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  feGaussianBlur(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  feImage(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  feMerge(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  feMergeNode(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  feMorphology(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  feOffset(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  fePointLight(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  feSpecularLighting(
+    ...setups: Array<SetupInput<SvgElementNode> | null | undefined>
+  ): SvgElementNode;
+  feSpotLight(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  feTile(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  feTurbulence(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  filter(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  foreignObject(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  g(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  image(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  line(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  linearGradient(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  marker(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  mask(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  metadata(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  mpath(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  path(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  pattern(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  polygon(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  polyline(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  radialGradient(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  rect(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  set(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  stop(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  a(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  script(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  switch(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  title(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  symbol(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  textPath(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  tspan(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  use(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+  view(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+}
+
+/** Merged SVG child shortcut surface on SvgElementNode. */
+export interface SvgElementNode extends SvgChildShortcuts {}
+
+/** The svg shortcut registered on HtmlElementNode. */
+export interface SvgParentShortcuts {
+  svg(...setups: Array<SetupInput<SvgElementNode> | null | undefined>): SvgElementNode;
+}
+
+/** Creates an <svg> element; the only SVG entry visible from HTML DSL. */
+export const svg: SvgElementFactory;
+
+// Built-in icon factories (each returns an SVG node).
+export function ArrowDownOutlined(): SvgElementNode;
+export function ArrowLeftOutlined(): SvgElementNode;
+export function ArrowRightOutlined(): SvgElementNode;
+export function ArrowUpOutlined(): SvgElementNode;
+export function BellOutlined(): SvgElementNode;
+export function CalendarOutlined(): SvgElementNode;
+export function CheckOutlined(): SvgElementNode;
+export function ChevronDownOutlined(): SvgElementNode;
+export function ChevronLeftOutlined(): SvgElementNode;
+export function ChevronRightOutlined(): SvgElementNode;
+export function ChevronUpOutlined(): SvgElementNode;
+export function CloseOutlined(): SvgElementNode;
+export function CodeOutlined(): SvgElementNode;
+export function CopyOutlined(): SvgElementNode;
+export function DownloadOutlined(): SvgElementNode;
+export function EditOutlined(): SvgElementNode;
+export function ExternalOutlined(): SvgElementNode;
+export function EyeOutlined(): SvgElementNode;
+export function FileOutlined(): SvgElementNode;
+export function FolderOutlined(): SvgElementNode;
+export function FolderOpenOutlined(): SvgElementNode;
+export function HeartOutlined(): SvgElementNode;
+export function HomeOutlined(): SvgElementNode;
+export function InfoOutlined(): SvgElementNode;
+export function LockOutlined(): SvgElementNode;
+export function LogoutOutlined(): SvgElementNode;
+export function MailOutlined(): SvgElementNode;
+export function MenuOutlined(): SvgElementNode;
+export function MinusOutlined(): SvgElementNode;
+export function MoreHorizontalOutlined(): SvgElementNode;
+export function PlusOutlined(): SvgElementNode;
+export function RefreshOutlined(): SvgElementNode;
+export function SearchOutlined(): SvgElementNode;
+export function SettingsOutlined(): SvgElementNode;
+export function StarOutlined(): SvgElementNode;
+export function TrashOutlined(): SvgElementNode;
+export function UploadOutlined(): SvgElementNode;
+export function UserOutlined(): SvgElementNode;
+export function WarningOutlined(): SvgElementNode;
+export function SunOutlined(): SvgElementNode;
+export function MoonOutlined(): SvgElementNode;
+export function MonitorOutlined(): SvgElementNode;

package/types/theme.d.ts

@@ -0,0 +1,40 @@
+import type {
+  ChildInput,
+  ElementFactory,
+  ElementOptions,
+  SetupCallback,
+  SetupInput,
+  YoyaMode
+} from './core.js';
+import type { HtmlElementNode } from './html.js';
+
+export interface ThemeModeEntry {
+  mode: YoyaMode;
+  label?: ChildInput;
+  icon?: unknown;
+  [key: string]: any;
+}
+
+/** Theme light/dark/system mode switcher. */
+export class VThemeModeSwitch extends HtmlElementNode {
+  modes(): ThemeModeEntry[];
+  modes(value: Array<YoyaMode | ThemeModeEntry>): VThemeModeSwitch;
+  persist(): boolean;
+  persist(value: boolean): VThemeModeSwitch;
+  sync(): VThemeModeSwitch;
+}
+
+export const vThemeModeSwitch: ElementFactory<VThemeModeSwitch> & {
+  (
+    first?: SetupInput<VThemeModeSwitch> | null,
+    callback?: SetupCallback<VThemeModeSwitch>
+  ): VThemeModeSwitch;
+};
+
+/**
+ * Parent-shortcut surface merged onto HtmlElementNode. vThemeModeSwitch is
+ * registered on ElementNode and inherited, so it is declared there.
+ */
+export interface ThemeParentShortcuts {}
+
+export type { ElementOptions, YoyaMode };

package/types/yoya.core.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Entry types for `yoya-ui/core`: core nodes/state/i18n/theme plus the HTML
+ * and SVG element DSL.
+ */
+export * from './core.js';
+export * from './html.js';
+export * from './svg.js';

package/types/yoya.echart.d.ts

@@ -0,0 +1,4 @@
+/**
+ * Entry types for `yoya-ui/echart`: the ECharts component.
+ */
+export { VEchart, vEchart } from './chart.js';

package/types/yoya.ssr.d.ts

@@ -0,0 +1,4 @@
+/**
+ * Entry types for `yoya-ui/ssr`: server-side rendering helpers.
+ */
+export * from './ssr.js';

package/types/yoya.ui.d.ts

@@ -0,0 +1,19 @@
+/**
+ * Entry types for the `yoya-ui` root export (and `yoya-ui/ui`).
+ */
+export * from './core.js';
+export * from './html.js';
+export * from './svg.js';
+export * from './layout.js';
+export * from './actions.js';
+export * from './navigation.js';
+export * from './feedback.js';
+export * from './form.js';
+export * from './data-display.js';
+export * from './async.js';
+export * from './i18n.js';
+export * from './theme.js';
+export * from './router.js';
+export * from './effects.js';
+export { VEchart, vEchart } from './chart.js';
+export * from './ssr.js';