@table-js/core 0.0.1

package/README.md

@@ -0,0 +1,38 @@
+# @tablejs/core
+
+Core runtime for Table.js - the Smart TV application framework.
+
+## Features
+
+- **File-based Router** - Next.js-style app router with dynamic routes
+- **Focus Engine** - Spatial navigation for TV remotes
+- **Platform Support** - Works on Tizen, webOS, and Android TV
+
+## Installation
+
+```bash
+npm install @tablejs/core react react-dom
+```
+
+## Quick Start
+
+```tsx
+import { TableApp, defineRoutes } from '@tablejs/core'
+
+const routes = defineRoutes([
+  { path: '/', component: () => import('./app/page') },
+  { path: '/movie/[id]', component: () => import('./app/movie/[id]/page') },
+])
+
+function App() {
+  return <TableApp routes={routes} />
+}
+```
+
+## Documentation
+
+Visit [tablejs.dev](https://tablejs.dev) for full documentation.
+
+## License
+
+MIT

package/dist/index.d.mts

@@ -0,0 +1,178 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React$1 from 'react';
+import React__default from 'react';
+
+interface RouteParams {
+    [key: string]: string;
+}
+interface RouteQuery {
+    [key: string]: string | string[] | undefined;
+}
+interface Route {
+    path: string;
+    params: RouteParams;
+    query: RouteQuery;
+}
+interface RouteSegment {
+    type: 'static' | 'dynamic' | 'catch-all';
+    value: string;
+}
+interface RouteDefinition {
+    filePath: string;
+    segments: RouteSegment[];
+    component: React__default.LazyExoticComponent<React__default.ComponentType>;
+}
+type NavigateOptions = {
+    replace?: boolean;
+    query?: RouteQuery;
+};
+
+type FocusDirection = 'up' | 'down' | 'left' | 'right';
+type FocusableId = string;
+interface FocusableNode {
+    id: FocusableId;
+    el: HTMLElement;
+    groupId: FocusableId | null;
+    disabled: boolean;
+    onFocus?: () => void;
+    onBlur?: () => void;
+    onSelect?: () => void;
+}
+interface FocusGroup$1 {
+    id: FocusableId;
+    parentId: FocusableId | null;
+    orientation: 'horizontal' | 'vertical' | 'grid';
+    loop: boolean;
+    rememberFocus: boolean;
+    lastFocusedId: FocusableId | null;
+}
+interface FocusState {
+    focusedId: FocusableId | null;
+    nodes: Map<FocusableId, FocusableNode>;
+    groups: Map<FocusableId, FocusGroup$1>;
+}
+interface FocusManagerOptions {
+    initialFocusId?: FocusableId;
+    onFocusChange?: (id: FocusableId | null) => void;
+}
+
+interface TableAppProps {
+    routes: RouteDefinition[];
+    initialPath?: string;
+    focus?: FocusManagerOptions;
+}
+declare function TableApp({ routes, initialPath, focus }: TableAppProps): react_jsx_runtime.JSX.Element;
+
+interface RouterProps {
+    routes: RouteDefinition[];
+    initialPath?: string;
+}
+declare function Router({ routes, initialPath }: RouterProps): react_jsx_runtime.JSX.Element;
+
+interface RouterContextValue {
+    route: Route;
+    navigate: (path: string, options?: NavigateOptions) => void;
+    back: () => void;
+    prefetch: (path: string) => void;
+}
+declare const RouterContext: React$1.Context<RouterContextValue | null>;
+declare function useRouter(): RouterContextValue;
+declare function useParams<T extends Record<string, string>>(): T;
+declare function useQuery<T extends Record<string, string | string[] | undefined>>(): T;
+
+type RouteInput = {
+    path: string;
+    component: () => Promise<{
+        default: React__default.ComponentType;
+    }>;
+};
+declare function defineRoutes(routes: RouteInput[]): RouteDefinition[];
+
+declare class FocusManager {
+    private state;
+    private options;
+    constructor(options?: FocusManagerOptions);
+    registerNode(node: FocusableNode): void;
+    unregisterNode(id: FocusableId): void;
+    registerGroup(group: FocusGroup$1): void;
+    unregisterGroup(id: FocusableId): void;
+    setFocus(id: FocusableId): void;
+    move(direction: FocusDirection): void;
+    select(): void;
+    focusFirst(): void;
+    getFocusedId(): FocusableId | null;
+    private findNextInGroup;
+    private findNextSpatial;
+}
+
+interface FocusProviderProps {
+    children: React__default.ReactNode;
+    options?: FocusManagerOptions;
+}
+declare function FocusProvider({ children, options }: FocusProviderProps): react_jsx_runtime.JSX.Element;
+
+type KeyAction = {
+    type: 'move';
+    direction: FocusDirection;
+} | {
+    type: 'select';
+} | {
+    type: 'back';
+} | {
+    type: 'unknown';
+};
+declare function resolveKeyAction(event: KeyboardEvent): KeyAction;
+declare class KeyHandler {
+    private listeners;
+    private bound;
+    mount(): void;
+    unmount(): void;
+    subscribe(fn: (action: KeyAction) => void): () => void;
+}
+
+interface FocusContextValue {
+    manager: FocusManager;
+    keyHandler: KeyHandler;
+}
+declare const FocusContext: React$1.Context<FocusContextValue | null>;
+declare function useFocusContext(): FocusContextValue;
+
+interface UseFocusableOptions {
+    groupId?: string;
+    disabled?: boolean;
+    onFocus?: () => void;
+    onBlur?: () => void;
+    onSelect?: () => void;
+    autoFocus?: boolean;
+}
+interface UseFocusableResult {
+    ref: React.RefObject<HTMLElement>;
+    focused: boolean;
+    focusableProps: {
+        'data-focusable': string;
+        'data-focused': boolean;
+        tabIndex: number;
+    };
+}
+declare function useFocusable(options?: UseFocusableOptions): UseFocusableResult;
+type UseFocusGroupOptions = Omit<FocusGroup$1, 'id' | 'lastFocusedId' | 'parentId'>;
+declare function useFocusGroup(options: UseFocusGroupOptions): {
+    groupId: string;
+};
+
+interface FocusableProps extends UseFocusableOptions {
+    children: React__default.ReactNode | ((focused: boolean) => React__default.ReactNode);
+    as?: React__default.ElementType;
+    className?: string;
+    style?: React__default.CSSProperties;
+}
+declare const Focusable: React__default.ForwardRefExoticComponent<FocusableProps & React__default.RefAttributes<HTMLElement>>;
+interface FocusGroupProps extends UseFocusGroupOptions {
+    children: React__default.ReactNode;
+    as?: React__default.ElementType;
+    className?: string;
+    style?: React__default.CSSProperties;
+}
+declare function FocusGroup({ children, as: Tag, className, style, ...options }: FocusGroupProps): react_jsx_runtime.JSX.Element;
+
+export { FocusContext, type FocusDirection, FocusGroup, type FocusGroup$1 as FocusGroupType, FocusManager, type FocusManagerOptions, FocusProvider, type FocusState, Focusable, type FocusableId, type FocusableNode, KeyHandler, type NavigateOptions, type Route, type RouteDefinition, type RouteParams, type RouteQuery, type RouteSegment, Router, RouterContext, TableApp, type UseFocusGroupOptions, type UseFocusableOptions, type UseFocusableResult, defineRoutes, resolveKeyAction, useFocusContext, useFocusGroup, useFocusable, useParams, useQuery, useRouter };

package/dist/index.d.ts

@@ -0,0 +1,178 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React$1 from 'react';
+import React__default from 'react';
+
+interface RouteParams {
+    [key: string]: string;
+}
+interface RouteQuery {
+    [key: string]: string | string[] | undefined;
+}
+interface Route {
+    path: string;
+    params: RouteParams;
+    query: RouteQuery;
+}
+interface RouteSegment {
+    type: 'static' | 'dynamic' | 'catch-all';
+    value: string;
+}
+interface RouteDefinition {
+    filePath: string;
+    segments: RouteSegment[];
+    component: React__default.LazyExoticComponent<React__default.ComponentType>;
+}
+type NavigateOptions = {
+    replace?: boolean;
+    query?: RouteQuery;
+};
+
+type FocusDirection = 'up' | 'down' | 'left' | 'right';
+type FocusableId = string;
+interface FocusableNode {
+    id: FocusableId;
+    el: HTMLElement;
+    groupId: FocusableId | null;
+    disabled: boolean;
+    onFocus?: () => void;
+    onBlur?: () => void;
+    onSelect?: () => void;
+}
+interface FocusGroup$1 {
+    id: FocusableId;
+    parentId: FocusableId | null;
+    orientation: 'horizontal' | 'vertical' | 'grid';
+    loop: boolean;
+    rememberFocus: boolean;
+    lastFocusedId: FocusableId | null;
+}
+interface FocusState {
+    focusedId: FocusableId | null;
+    nodes: Map<FocusableId, FocusableNode>;
+    groups: Map<FocusableId, FocusGroup$1>;
+}
+interface FocusManagerOptions {
+    initialFocusId?: FocusableId;
+    onFocusChange?: (id: FocusableId | null) => void;
+}
+
+interface TableAppProps {
+    routes: RouteDefinition[];
+    initialPath?: string;
+    focus?: FocusManagerOptions;
+}
+declare function TableApp({ routes, initialPath, focus }: TableAppProps): react_jsx_runtime.JSX.Element;
+
+interface RouterProps {
+    routes: RouteDefinition[];
+    initialPath?: string;
+}
+declare function Router({ routes, initialPath }: RouterProps): react_jsx_runtime.JSX.Element;
+
+interface RouterContextValue {
+    route: Route;
+    navigate: (path: string, options?: NavigateOptions) => void;
+    back: () => void;
+    prefetch: (path: string) => void;
+}
+declare const RouterContext: React$1.Context<RouterContextValue | null>;
+declare function useRouter(): RouterContextValue;
+declare function useParams<T extends Record<string, string>>(): T;
+declare function useQuery<T extends Record<string, string | string[] | undefined>>(): T;
+
+type RouteInput = {
+    path: string;
+    component: () => Promise<{
+        default: React__default.ComponentType;
+    }>;
+};
+declare function defineRoutes(routes: RouteInput[]): RouteDefinition[];
+
+declare class FocusManager {
+    private state;
+    private options;
+    constructor(options?: FocusManagerOptions);
+    registerNode(node: FocusableNode): void;
+    unregisterNode(id: FocusableId): void;
+    registerGroup(group: FocusGroup$1): void;
+    unregisterGroup(id: FocusableId): void;
+    setFocus(id: FocusableId): void;
+    move(direction: FocusDirection): void;
+    select(): void;
+    focusFirst(): void;
+    getFocusedId(): FocusableId | null;
+    private findNextInGroup;
+    private findNextSpatial;
+}
+
+interface FocusProviderProps {
+    children: React__default.ReactNode;
+    options?: FocusManagerOptions;
+}
+declare function FocusProvider({ children, options }: FocusProviderProps): react_jsx_runtime.JSX.Element;
+
+type KeyAction = {
+    type: 'move';
+    direction: FocusDirection;
+} | {
+    type: 'select';
+} | {
+    type: 'back';
+} | {
+    type: 'unknown';
+};
+declare function resolveKeyAction(event: KeyboardEvent): KeyAction;
+declare class KeyHandler {
+    private listeners;
+    private bound;
+    mount(): void;
+    unmount(): void;
+    subscribe(fn: (action: KeyAction) => void): () => void;
+}
+
+interface FocusContextValue {
+    manager: FocusManager;
+    keyHandler: KeyHandler;
+}
+declare const FocusContext: React$1.Context<FocusContextValue | null>;
+declare function useFocusContext(): FocusContextValue;
+
+interface UseFocusableOptions {
+    groupId?: string;
+    disabled?: boolean;
+    onFocus?: () => void;
+    onBlur?: () => void;
+    onSelect?: () => void;
+    autoFocus?: boolean;
+}
+interface UseFocusableResult {
+    ref: React.RefObject<HTMLElement>;
+    focused: boolean;
+    focusableProps: {
+        'data-focusable': string;
+        'data-focused': boolean;
+        tabIndex: number;
+    };
+}
+declare function useFocusable(options?: UseFocusableOptions): UseFocusableResult;
+type UseFocusGroupOptions = Omit<FocusGroup$1, 'id' | 'lastFocusedId' | 'parentId'>;
+declare function useFocusGroup(options: UseFocusGroupOptions): {
+    groupId: string;
+};
+
+interface FocusableProps extends UseFocusableOptions {
+    children: React__default.ReactNode | ((focused: boolean) => React__default.ReactNode);
+    as?: React__default.ElementType;
+    className?: string;
+    style?: React__default.CSSProperties;
+}
+declare const Focusable: React__default.ForwardRefExoticComponent<FocusableProps & React__default.RefAttributes<HTMLElement>>;
+interface FocusGroupProps extends UseFocusGroupOptions {
+    children: React__default.ReactNode;
+    as?: React__default.ElementType;
+    className?: string;
+    style?: React__default.CSSProperties;
+}
+declare function FocusGroup({ children, as: Tag, className, style, ...options }: FocusGroupProps): react_jsx_runtime.JSX.Element;
+
+export { FocusContext, type FocusDirection, FocusGroup, type FocusGroup$1 as FocusGroupType, FocusManager, type FocusManagerOptions, FocusProvider, type FocusState, Focusable, type FocusableId, type FocusableNode, KeyHandler, type NavigateOptions, type Route, type RouteDefinition, type RouteParams, type RouteQuery, type RouteSegment, Router, RouterContext, TableApp, type UseFocusGroupOptions, type UseFocusableOptions, type UseFocusableResult, defineRoutes, resolveKeyAction, useFocusContext, useFocusGroup, useFocusable, useParams, useQuery, useRouter };