@duke333/builder-ui 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Winu
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,85 @@
+# @duke333/builder-ui
+
+Frontend талын builder package. Энэ package нь dynamic form/list/view runtime logic,
+builder admin factory components, API client factory, React Query hook factory-уудыг
+эзэмшинэ.
+
+## Workspace Development
+
+This repository uses the package as a workspace dependency:
+
+```json
+{
+  "dependencies": {
+    "@duke333/builder-ui": "workspace:*"
+  }
+}
+```
+
+Ажиллуулах:
+
+```bash
+pnpm install
+pnpm build
+pnpm typecheck
+pnpm test:run
+```
+
+## Хэрэглэх
+
+Host app дээр package factory-уудыг host wrapper component болгон угсарна:
+
+```text
+src/features/builder/api.ts
+src/features/builder/hooks/useBuilder.ts
+src/features/builder/components/DynamicForm.tsx
+src/features/builder/components/DynamicList.tsx
+src/features/builder/components/DynamicView.tsx
+```
+
+App page дээр wrapper-уудыг ашиглана:
+
+```tsx
+import { DynamicView } from "../features/builder/components/DynamicView";
+
+export default function RuntimePage() {
+  return <DynamicView viewId="..." />;
+}
+```
+
+Дангаар нь дуудах contract:
+
+```tsx
+<DynamicForm formId="..." />
+<DynamicList listId="..." />
+<DynamicView viewId="..." />
+```
+
+`DynamicView` нь form + list нийлсэн CRUD screen. Харин зөвхөн form эсвэл зөвхөн
+grid/list хэрэгтэй бол `DynamicForm`, `DynamicList`-ийг шууд ашиглана.
+
+## Host UI Adapter
+
+Package нь shadcn/ui-г шууд эзэмшихгүй. Host app өөрийн Button, Dialog, DataGrid,
+form renderer зэрэг design-system component-уудаа adapter-аар өгнө. Ингэснээр portal
+энгийн shadcn app хэвээр, builder нь нэмэлт reusable layer хэвээр үлдэнэ.
+
+## Publish / Update
+
+Publish after `@duke333/builder-contracts` and `@duke333/builder-backend` are available in the
+target registry. The package is configured for public npm publishing.
+
+External portal project дээр:
+
+```bash
+pnpm add @duke333/builder-ui
+```
+
+Update:
+
+```bash
+pnpm update @duke333/builder-ui
+```
+
+Package нь `dist` output publish хийнэ. `prepack` нь publish/pack хийхээс өмнө
+`pnpm build` ажиллуулна.

package/dist/RuntimeEntryDialog-DAO74GFp.d.ts

@@ -0,0 +1,282 @@
+import * as react from 'react';
+import { ComponentType, ReactNode } from 'react';
+import { BuilderApiContracts } from './api/index.js';
+import { BuilderHooks } from './hooks/index.js';
+import { BuilderRuntimeFormSchemaLike, BuilderRuntimeFormValues, BuilderRuntimeEntryLike, BuilderRuntimeViewLike, BuilderRuntimeEntryValues } from './runtime/index.js';
+
+type DynamicFormContracts = BuilderApiContracts & {
+    BuilderForm: {
+        id: string;
+        title: string;
+        schema: BuilderRuntimeFormSchemaLike;
+    };
+    CreateBuilderViewEntryInput: BuilderRuntimeFormValues;
+};
+type DynamicFormProps = {
+    formId: string;
+};
+type DynamicFormShellProps = {
+    title: string;
+    children: ReactNode;
+};
+type DynamicFormFieldsProps<TSchema> = {
+    formId: string;
+    schema: TSchema;
+    namePrefix: "values";
+};
+type DynamicFormSubmitProps = {
+    isSaving: boolean;
+};
+type DynamicFormErrorStateProps = {
+    title: string;
+    description: string;
+};
+type DynamicFormNotifications = {
+    success(message: string): void;
+    error(message: string): void;
+    errorMessage(error: unknown, fallback: string): string;
+};
+type DynamicFormDependencies<C extends DynamicFormContracts> = {
+    hooks: Pick<BuilderHooks<C>, "useRuntimeBuilderForm" | "useSaveRuntimeBuilderFormEntry">;
+    FormShell: ComponentType<DynamicFormShellProps>;
+    FormFields: ComponentType<DynamicFormFieldsProps<C["BuilderForm"]["schema"]>>;
+    SubmitButton: ComponentType<DynamicFormSubmitProps>;
+    ErrorState: ComponentType<DynamicFormErrorStateProps>;
+    notifications: DynamicFormNotifications;
+};
+declare function createDynamicFormComponent<C extends DynamicFormContracts>(deps: DynamicFormDependencies<C>): ({ formId }: DynamicFormProps) => react.JSX.Element | null;
+
+type DynamicListContracts = BuilderApiContracts & {
+    BuilderList: {
+        id: string;
+        title: string;
+        description?: string | null;
+    };
+    BuilderViewEntry: {
+        id: string;
+    };
+    ListBuilderViewEntriesResponse: {
+        items: Array<BuilderApiContracts["BuilderViewEntry"]>;
+        total: number;
+    };
+};
+type DynamicListProps = {
+    listId: string;
+};
+type DynamicListDataGridProps<TController> = {
+    title?: string;
+    description?: string;
+    controller: TController;
+    isLoading?: boolean;
+    searchPlaceholder?: string;
+    emptyTitle?: string;
+    emptyDescription?: string;
+};
+type DynamicListErrorStateProps = {
+    title: string;
+    description: string;
+};
+type DynamicListDependencies<C extends DynamicListContracts, TColumn, TState extends {
+    query: C["ListBuilderViewEntriesQuery"];
+}, TController> = {
+    hooks: Pick<BuilderHooks<C>, "useRuntimeBuilderList" | "useRuntimeBuilderListEntries">;
+    buildColumns(list: C["BuilderList"]): TColumn[];
+    useDataTableState(args?: {
+        pageSize?: number;
+    }): TState;
+    useDataTable(args: {
+        columns: TColumn[];
+        data: C["BuilderViewEntry"][];
+        rowCount: number;
+        state: TState;
+        getRowId(row: C["BuilderViewEntry"]): string;
+    }): TController;
+    DataGrid: ComponentType<DynamicListDataGridProps<TController>>;
+    ErrorState: ComponentType<DynamicListErrorStateProps>;
+};
+declare function createDynamicListComponent<C extends DynamicListContracts, TColumn, TState extends {
+    query: C["ListBuilderViewEntriesQuery"];
+}, TController>(deps: DynamicListDependencies<C, TColumn, TState, TController>): ({ listId }: DynamicListProps) => react.JSX.Element;
+
+type DynamicViewContracts = BuilderApiContracts & {
+    BuilderView: {
+        id: string;
+        title: string;
+        description?: string | null;
+        form?: unknown | null;
+    };
+    BuilderViewEntry: BuilderRuntimeEntryLike;
+    ListBuilderViewEntriesResponse: {
+        items: Array<BuilderApiContracts["BuilderViewEntry"]>;
+        total: number;
+    };
+};
+type DynamicViewProps = {
+    viewId: string;
+};
+type DynamicViewColumnActions<TEntry> = {
+    onEdit(entry: TEntry): void;
+    onDelete(entry: TEntry): void;
+};
+type DynamicViewDataGridProps<TController> = {
+    title?: string;
+    description?: string;
+    controller: TController;
+    isLoading?: boolean;
+    searchPlaceholder?: string;
+    emptyTitle?: string;
+    emptyDescription?: string;
+    onRowClick?: (row: unknown) => void;
+    toolbarExtra?: ReactNode;
+};
+type DynamicViewAddButtonProps = {
+    disabled: boolean;
+    onAdd(): void;
+};
+type DynamicViewEntryDialogProps<TView, TEntry, TInput> = {
+    open: boolean;
+    view: TView;
+    editing: TEntry | null;
+    onClose(): void;
+    onSave(args: {
+        id?: string;
+        input: TInput;
+    }): Promise<unknown>;
+    isSaving: boolean;
+};
+type DynamicViewDeleteDialogProps<TEntry> = {
+    entry: TEntry | null;
+    isDeleting: boolean;
+    onClose(): void;
+    onConfirm(): Promise<void>;
+};
+type DynamicViewErrorStateProps = {
+    title: string;
+    description: string;
+};
+type DynamicViewDependencies<C extends DynamicViewContracts, TColumn, TState extends {
+    query: C["ListBuilderViewEntriesQuery"];
+}, TController> = {
+    hooks: Pick<BuilderHooks<C>, "useBuilderViewEntries" | "useDeleteBuilderViewEntry" | "useRuntimeBuilderView" | "useSaveBuilderViewEntry">;
+    buildColumns(view: C["BuilderView"], actions: DynamicViewColumnActions<C["BuilderViewEntry"]>): TColumn[];
+    useDataTableState(args?: {
+        pageSize?: number;
+    }): TState;
+    useDataTable(args: {
+        columns: TColumn[];
+        data: C["BuilderViewEntry"][];
+        rowCount: number;
+        state: TState;
+        getRowId(row: C["BuilderViewEntry"]): string;
+    }): TController;
+    DataGrid: ComponentType<DynamicViewDataGridProps<TController>>;
+    AddButton: ComponentType<DynamicViewAddButtonProps>;
+    EntryDialog: ComponentType<DynamicViewEntryDialogProps<C["BuilderView"], C["BuilderViewEntry"], C["UpdateBuilderViewEntryInput"]>>;
+    DeleteDialog: ComponentType<DynamicViewDeleteDialogProps<C["BuilderViewEntry"]>>;
+    ErrorState: ComponentType<DynamicViewErrorStateProps>;
+};
+declare function createDynamicViewComponent<C extends DynamicViewContracts, TColumn, TState extends {
+    query: C["ListBuilderViewEntriesQuery"];
+}, TController>(deps: DynamicViewDependencies<C, TColumn, TState, TController>): ({ viewId }: DynamicViewProps) => react.JSX.Element;
+
+type BuilderRuntimeDatasourceLike = {
+    type: "dbTable";
+    tableName: string;
+} | {
+    type: string;
+} | null;
+type RuntimeEntryDialogSubformLike = {
+    key: string;
+};
+type RuntimeEntryDialogViewLike = BuilderRuntimeViewLike & {
+    id: string;
+    title: string;
+    list?: {
+        source?: BuilderRuntimeDatasourceLike;
+    } | null;
+    form?: {
+        id: string;
+        source?: BuilderRuntimeDatasourceLike;
+        schema: BuilderRuntimeFormSchemaLike & {
+            subforms?: readonly RuntimeEntryDialogSubformLike[];
+        };
+    } | null;
+};
+type RuntimeEntryDialogSaveArgs<TInput> = {
+    id?: string;
+    input: TInput;
+};
+type RuntimeEntryDialogProps<TView, TEntry, TInput> = {
+    open: boolean;
+    view: TView;
+    editing: TEntry | null;
+    onClose: () => void;
+    onSave: (args: RuntimeEntryDialogSaveArgs<TInput>) => Promise<unknown>;
+    isSaving: boolean;
+};
+type RuntimeEntryDialogShellProps = {
+    open: boolean;
+    title: string;
+    description: string;
+    onClose: () => void;
+    children: ReactNode;
+};
+type RuntimeEntryDialogExtraItem = {
+    key: string;
+    render: () => ReactNode;
+};
+type RuntimeEntryDialogFieldsProps<TSchema> = {
+    formId: string;
+    viewId: string;
+    entry?: BuilderRuntimeEntryLike | null;
+    schema: TSchema;
+    namePrefix: "values";
+    extraItems?: RuntimeEntryDialogExtraItem[];
+};
+type RuntimeEntryDialogActionsProps = {
+    isSaving: boolean;
+    onClose: () => void;
+};
+type RuntimeEntryDialogNotifications = {
+    success(message: string): void;
+    error(message: string): void;
+    errorMessage(error: unknown, fallback: string): string;
+};
+type RuntimeEntryDialogDraftRowsChange<TEntry> = {
+    subformKey: string;
+    dataKey: string;
+    rows: TEntry[];
+};
+type RuntimeEntryDialogSubformFieldProps<TSubform, TEntry> = {
+    subform: TSubform;
+    parentEntry?: TEntry | null;
+    draftRows?: TEntry[];
+    onDraftRowsChange?(args: RuntimeEntryDialogDraftRowsChange<TEntry>): void;
+};
+type RuntimeCompositeData = Record<string, Record<string, unknown> | Array<Record<string, unknown>>>;
+type RuntimeCompositeCreateInput = {
+    data: RuntimeCompositeData;
+};
+type RuntimeCompositeUpdateInput = {
+    data: RuntimeCompositeData;
+};
+type RuntimeMutation<TInput> = {
+    mutateAsync(input: TInput): Promise<unknown>;
+    isPending: boolean;
+};
+type RuntimeEntryDialogDependencies<TView extends RuntimeEntryDialogViewLike, TEntry extends BuilderRuntimeEntryLike = BuilderRuntimeEntryLike> = {
+    DialogShell: ComponentType<RuntimeEntryDialogShellProps>;
+    FormFields: ComponentType<RuntimeEntryDialogFieldsProps<NonNullable<TView["form"]>["schema"]>>;
+    Actions: ComponentType<RuntimeEntryDialogActionsProps>;
+    formClassName?: string;
+    SubformField?: ComponentType<RuntimeEntryDialogSubformFieldProps<NonNullable<NonNullable<TView["form"]>["schema"]["subforms"]>[number], TEntry>>;
+    useCreateCompositeEntry?(viewId: string): RuntimeMutation<RuntimeCompositeCreateInput>;
+    useUpdateCompositeEntry?(viewId: string): RuntimeMutation<{
+        id: string;
+        input: RuntimeCompositeUpdateInput;
+    }>;
+    notifications: RuntimeEntryDialogNotifications;
+};
+declare function createRuntimeEntryDialogComponent<TView extends RuntimeEntryDialogViewLike, TEntry extends BuilderRuntimeEntryLike, TInput extends BuilderRuntimeEntryValues>(deps: RuntimeEntryDialogDependencies<TView, TEntry>): ({ open, view, editing, onClose, onSave, isSaving, }: RuntimeEntryDialogProps<TView, TEntry, TInput>) => react.JSX.Element;
+
+export { type RuntimeEntryDialogSaveArgs as A, type RuntimeEntryDialogShellProps as B, type RuntimeEntryDialogViewLike as C, type DynamicFormContracts as D, createDynamicFormComponent as E, createDynamicListComponent as F, createDynamicViewComponent as G, createRuntimeEntryDialogComponent as H, type RuntimeEntryDialogDraftRowsChange as R, type DynamicFormDependencies as a, type DynamicFormErrorStateProps as b, type DynamicFormFieldsProps as c, type DynamicFormNotifications as d, type DynamicFormProps as e, type DynamicFormShellProps as f, type DynamicFormSubmitProps as g, type DynamicListContracts as h, type DynamicListDataGridProps as i, type DynamicListDependencies as j, type DynamicListErrorStateProps as k, type DynamicListProps as l, type DynamicViewAddButtonProps as m, type DynamicViewColumnActions as n, type DynamicViewContracts as o, type DynamicViewDataGridProps as p, type DynamicViewDeleteDialogProps as q, type DynamicViewDependencies as r, type DynamicViewEntryDialogProps as s, type DynamicViewErrorStateProps as t, type DynamicViewProps as u, type RuntimeEntryDialogActionsProps as v, type RuntimeEntryDialogDependencies as w, type RuntimeEntryDialogFieldsProps as x, type RuntimeEntryDialogNotifications as y, type RuntimeEntryDialogProps as z };