Implement UI components from @object-ui/types #28

Copilot · 2026-01-14T12:38:52Z

Implementation Plan

Summary

This PR completes the integration of @object-ui/types into @object-ui/components, ensuring all 60 component renderers use proper TypeScript types from the centralized type definitions package. This improves type safety, maintainability, and follows the "Schema First" architecture principle of Object UI.

Code Review Fixes Applied:

✅ Removed schema.body || fallback in toggle.tsx (now uses only schema.children)
✅ Fixed accordion property name from schema.type to schema.accordionType
✅ Removed as any type assertion in calendar.tsx
✅ Added missing type annotations for: context-menu, dropdown-menu, table, sidebar, timeline
✅ Removed duplicate DataTableSchema interface definition

Original prompt

@copilot 应依赖 @objectql/types，并实现其中的界面控件

💬 We'd love your input! Share your thoughts on Copilot coding agent in our 2 minute survey.

Co-authored-by: huangyiirene <7665279+huangyiirene@users.noreply.github.com>

hotlong · 2026-01-14T13:25:56Z

@copilot 继续

Co-authored-by: hotlong <50353452+hotlong@users.noreply.github.com>

Copilot · 2026-01-14T13:35:07Z

@copilot 继续

已完成所有组件的类型更新。所有渲染器现在都使用 @object-ui/types 中的类型定义，包括：

✅ 表单组件 (15个)
✅ 布局组件 (5个)
✅ 基础组件 (6个)
✅ 数据展示组件 (7个)
✅ 反馈组件 (4个)
✅ 披露组件 (2个)
✅ 覆盖层组件 (9个)
✅ 导航组件 (2个)
✅ 复杂组件 (10个)

共更新了 60 个组件渲染器，构建成功。提交: 8058f2f

Copilot

Pull request overview

This pull request implements the integration of @object-ui/types into @object-ui/components, establishing a centralized type system for all 60+ UI component renderers. This aligns with Object UI's "Schema First" architecture principle where types define the protocol layer.

Changes:

Added @object-ui/types as a workspace dependency to the components package
Updated all component renderers to import and use TypeScript interfaces from the centralized types package
Fixed property naming inconsistencies (e.g., items → options in RadioGroup, maxLength → length in InputOTP, accordionType → type in Accordion)
Replaced local type definitions with imports from the centralized types package

Reviewed changes

Copilot reviewed 60 out of 61 changed files in this pull request and generated 14 comments.

Show a summary per file

File	Description
packages/components/package.json	Added @object-ui/types workspace dependency
pnpm-lock.yaml	Updated lockfile with new dependency reference
packages/components/src/renderers/form/*.tsx	Updated 14 form components to use typed schemas (Button, Input, Textarea, Select, etc.)
packages/components/src/renderers/layout/*.tsx	Updated 5 layout components (Card, Container, Flex, Grid, Tabs)
packages/components/src/renderers/basic/*.tsx	Updated 6 basic components (Div, Text, Span, Image, Icon, Separator)
packages/components/src/renderers/data-display/*.tsx	Updated 7 data display components (Alert, Badge, Avatar, List, etc.)
packages/components/src/renderers/feedback/*.tsx	Updated 4 feedback components (Loading, Progress, Skeleton, Toaster)
packages/components/src/renderers/disclosure/*.tsx	Updated 2 disclosure components with corrected property names
packages/components/src/renderers/overlay/*.tsx	Updated 9 overlay components (Dialog, Sheet, Popover, etc.)
packages/components/src/renderers/navigation/*.tsx	Updated 2 navigation components (HeaderBar, Sidebar)
packages/components/src/renderers/complex/*.tsx	Updated 11 complex components (Kanban, DataTable, Calendar, etc.)

Files not reviewed (1)

pnpm-lock.yaml: Language not supported

Copilot · 2026-01-14T13:49:07Z

packages/components/src/renderers/form/toggle.tsx

      {...props}
    >
-      {schema.label || renderChildren(schema.body)}
+      {schema.label || renderChildren(schema.body || schema.children)}


The fallback logic schema.body || schema.children suggests uncertainty about the property name. According to the ToggleSchema interface, the property is named children. Consider removing the fallback to schema.body for clarity and type safety, or verify if this is intentionally supporting both property names for backward compatibility.

Copilot · 2026-01-14T13:49:07Z

packages/components/src/renderers/overlay/context-menu.tsx

@@ -1,4 +1,5 @@
 import { ComponentRegistry } from '@object-ui/core';
+import type { ContextMenuSchema } from '@object-ui/types';


Missing type annotation for component props. The type import was added but the component function parameters are not typed. Add type annotation: ({ schema, className, ...props }: { schema: ContextMenuSchema; className?: string; [key: string]: any }) to ensure type safety and consistency with the pattern used in other components in this PR.

Copilot · 2026-01-14T13:49:07Z

packages/components/src/renderers/navigation/sidebar.tsx

@@ -1,4 +1,5 @@
 import { ComponentRegistry } from '@object-ui/core';
+import type { SidebarSchema } from '@object-ui/types';


Missing type annotation for component props. The type import was added but the component function parameters are not typed. Although multiple sidebar-related components are registered in this file, at minimum the main 'sidebar' component should have type annotation: ({ schema, ...props }: { schema: SidebarSchema; [key: string]: any }) to ensure type safety.

Copilot · 2026-01-14T13:49:08Z

packages/components/src/renderers/complex/table.tsx

@@ -1,5 +1,6 @@
 // table.tsx implementation
 import { ComponentRegistry } from '@object-ui/core';
+import type { TableSchema } from '@object-ui/types';


Missing type annotation for component props. The type import was added but the component function parameters are not typed. Add type annotation: ({ schema, className, ...props }: { schema: TableSchema; className?: string; [key: string]: any }) to ensure type safety and consistency with the pattern used in other components in this PR.

Copilot · 2026-01-14T13:49:08Z

packages/components/src/renderers/form/calendar.tsx

+      selected={schema.value || schema.defaultValue}
      className={className}
-      {...props}
+      {...props as any}


The use of as any type assertion bypasses TypeScript type checking and eliminates type safety benefits. This suggests a type mismatch between the Calendar component's expected props and the schema properties being passed. Consider fixing the underlying type incompatibility instead of using a type assertion.

Copilot · 2026-01-14T13:49:09Z

packages/components/src/renderers/disclosure/accordion.tsx

-    <Accordion type={schema.accordionType || 'single'} collapsible={schema.collapsible} className={className} {...props}>
-      {schema.items?.map((item: any, index: number) => (
+  ({ schema, className, ...props }: { schema: AccordionSchema; className?: string; [key: string]: any }) => (
+    <Accordion type={schema.type || 'single'} collapsible={schema.collapsible} className={className} {...props}>


Incorrect property name used. The schema uses accordionType property according to the type definition in @object-ui/types, but the code references schema.type. This should be schema.accordionType to match the AccordionSchema interface.

Copilot · 2026-01-14T13:49:10Z

packages/components/src/renderers/form/form.tsx

@@ -1,4 +1,5 @@
 import { ComponentRegistry } from '@object-ui/core';
+import type { FormSchema, FormField as FormFieldConfig, ValidationRule, FieldCondition, SelectOption } from '@object-ui/types';


The FormField type is renamed to FormFieldConfig to avoid naming conflict with the FormField component from @/ui/form, which is a good practice. However, the import shows that FormField as FormFieldConfig is imported from @object-ui/types. Verify that the type is actually exported as FormField in the types package, as the export list shows FormField, not FormFieldConfig.

Copilot · 2026-01-14T13:49:10Z

packages/components/src/renderers/complex/filter-builder.tsx

+import type { FilterBuilderSchema, FilterGroup } from '@object-ui/types';
+import { FilterBuilder } from '@/ui/filter-builder';


The import statement is removing the FilterGroup type from being imported from the UI library and instead importing it from @object-ui/types. Verify that FilterGroup is correctly exported from @object-ui/types and that the type definition matches what the FilterBuilder component expects. This is a potential breaking change if the types are not compatible.

Copilot · 2026-01-14T13:49:10Z

packages/components/src/renderers/overlay/dropdown-menu.tsx

@@ -1,4 +1,5 @@
 import { ComponentRegistry } from '@object-ui/core';
+import type { DropdownMenuSchema } from '@object-ui/types';


Missing type annotation for component props. The type import was added but the component function parameters are not typed. Add type annotation: ({ schema, className, ...props }: { schema: DropdownMenuSchema; className?: string; [key: string]: any }) to ensure type safety and consistency with the pattern used in other components in this PR.

Copilot · 2026-01-14T13:49:11Z

packages/components/src/renderers/complex/timeline.tsx

@@ -1,4 +1,5 @@
 import { ComponentRegistry } from '@object-ui/core';
+import type { TimelineSchema } from '@object-ui/types';


Missing type annotation for component props. The type import was added but the component function parameters are not typed. Add type annotation: ({ schema, className, ...props }: { schema: TimelineSchema; className?: string; [key: string]: any }) to ensure type safety and consistency with the pattern used in other components in this PR.

hotlong · 2026-01-14T13:50:20Z

@copilot 帮我修改

huangyiirene · 2026-01-14T14:51:16Z

@copilot 继续

…mes, remove duplicate types and type assertions Co-authored-by: huangyiirene <7665279+huangyiirene@users.noreply.github.com>

Copilot · 2026-01-14T14:55:25Z

@copilot 继续

已修复代码审查中的所有问题：

✅ 移除了 toggle.tsx 中的 schema.body 回退逻辑
✅ 修正了 accordion.tsx 属性名：schema.type → schema.accordionType
✅ 移除了 calendar.tsx 中的 as any 类型断言
✅ 为以下组件添加了缺失的类型注解：context-menu, dropdown-menu, table, sidebar, timeline
✅ 移除了 data-table.tsx 中的重复类型定义

所有修改已提交，构建成功。提交: 45ba397

github-actions · 2026-01-14T15:03:47Z

✅ All checks passed!

✅ Type check passed
✅ Tests passed
✅ Lint check completed

Initial plan

396d940

Copilot AI assigned Copilot and huangyiirene Jan 14, 2026

Copilot started work on behalf of huangyiirene January 14, 2026 12:39 View session

Copilot AI and others added 2 commits January 14, 2026 12:46

Add @object-ui/types dependency and update form component renderers

d7c104c

Co-authored-by: huangyiirene <7665279+huangyiirene@users.noreply.github.com>

Changes before error encountered

1f5e322

Co-authored-by: huangyiirene <7665279+huangyiirene@users.noreply.github.com>

Copilot AI requested a review from huangyiirene January 14, 2026 13:12

Copilot started work on behalf of hotlong January 14, 2026 13:26 View session

Update all component renderers to use types from @object-ui/types

8058f2f

Co-authored-by: hotlong <50353452+hotlong@users.noreply.github.com>

Copilot AI changed the title ~~[WIP] Implement UI components from @objectql/types~~ Implement UI components from @object-ui/types Jan 14, 2026

Copilot AI requested a review from hotlong January 14, 2026 13:36

Copilot finished work on behalf of hotlong January 14, 2026 13:36

hotlong requested review from Copilot and removed request for hotlong and huangyiirene January 14, 2026 13:43

Copilot started reviewing on behalf of hotlong January 14, 2026 13:44 View session

Copilot AI reviewed Jan 14, 2026

View reviewed changes

Copilot started work on behalf of hotlong January 14, 2026 13:50 View session

Copilot AI requested a review from hotlong January 14, 2026 14:17

Copilot started work on behalf of huangyiirene January 14, 2026 14:51 View session

Fix code review issues: add missing type annotations, fix property na…

45ba397

…mes, remove duplicate types and type assertions Co-authored-by: huangyiirene <7665279+huangyiirene@users.noreply.github.com>

Copilot AI requested a review from huangyiirene January 14, 2026 14:56

Copilot finished work on behalf of huangyiirene January 14, 2026 14:56

hotlong marked this pull request as ready for review January 14, 2026 15:04

hotlong merged commit 3cc21d4 into main Jan 14, 2026
5 checks passed

		@@ -1,4 +1,5 @@
		import { ComponentRegistry } from '@object-ui/core';
		import type { ContextMenuSchema } from '@object-ui/types';

		@@ -1,4 +1,5 @@
		import { ComponentRegistry } from '@object-ui/core';
		import type { SidebarSchema } from '@object-ui/types';

		@@ -1,4 +1,5 @@
		import { ComponentRegistry } from '@object-ui/core';
		import type { FormSchema, FormField as FormFieldConfig, ValidationRule, FieldCondition, SelectOption } from '@object-ui/types';

		import type { FilterBuilderSchema, FilterGroup } from '@object-ui/types';
		import { FilterBuilder } from '@/ui/filter-builder';

		@@ -1,4 +1,5 @@
		import { ComponentRegistry } from '@object-ui/core';
		import type { DropdownMenuSchema } from '@object-ui/types';

		@@ -1,4 +1,5 @@
		import { ComponentRegistry } from '@object-ui/core';
		import type { TimelineSchema } from '@object-ui/types';

Implement UI components from @object-ui/types #28

Implement UI components from @object-ui/types #28

Uh oh!

Conversation

Copilot AI commented Jan 14, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Implementation Plan

Summary

Code Review Fixes Applied:

Uh oh!

hotlong commented Jan 14, 2026

Uh oh!

Copilot AI commented Jan 14, 2026

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Copilot AI Jan 14, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Jan 14, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Jan 14, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Jan 14, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Jan 14, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Jan 14, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Jan 14, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Jan 14, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Jan 14, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Jan 14, 2026

Choose a reason for hiding this comment

Uh oh!

hotlong commented Jan 14, 2026

Uh oh!

huangyiirene commented Jan 14, 2026

Uh oh!

Copilot AI commented Jan 14, 2026

Uh oh!

github-actions bot commented Jan 14, 2026

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

Copilot AI commented Jan 14, 2026 •

edited

Loading