Skip to content

refactor(components): standardize component family entrypoints - #464

Open
IzumiSy wants to merge 5 commits into
mainfrom
refactor/components-directory-entrypoints
Open

refactor(components): standardize component family entrypoints#464
IzumiSy wants to merge 5 commits into
mainfrom
refactor/components-directory-entrypoints

Conversation

@IzumiSy

@IzumiSy IzumiSy commented Aug 21, 2026

Copy link
Copy Markdown
Contributor

Motivation

packages/core/src/components had drifted into several filesystem shapes at once: top-level files, top-level directories, explicit nested entrypoints like layout/Layout, and separate *-standalone sibling directories.

That inconsistency leaked into the component-design guidance and made the skills describe filesystem exceptions instead of just describing API patterns. This change standardizes the component family layout so the skills can assume one directory shape regardless of implementation size.

The folder was also mixing public components with internal-only building blocks. That made it harder to tell which pieces were part of the shipped contract versus just implementation support.

Design Decision

Chosen approach

Every public component or helper family under packages/core/src/components now has a stable directory entrypoint at components/<name>/index.ts.

For the standalone control families, the standalone implementation now lives inside the same family directory as the parts implementation instead of in a parallel sibling directory:

  • select/select-standalone.tsx
  • combobox/combobox-standalone.tsx
  • autocomplete/autocomplete-standalone.tsx

Internal-only pieces are separated from that public surface:

  • shared internal-only component helpers live under components/internals
  • routing-owned pieces such as content and document-head live under src/routing
  • the dynamic breadcrumb implementation now lives under components/sidebar, alongside the sidebar header that owns it

Alternatives considered

Keep single-file components as top-level files

That would preserve today's mixed shapes and keep the skills branching on implementation size, which is the inconsistency this refactor is meant to remove.

Keep standalone implementations in separate sibling directories

That would still leave one component family split across multiple top-level directories. Co-locating standalone and parts implementations keeps the family boundary obvious and makes components/<name> the single place to inspect.

Leave internal-only pieces mixed in with public components

That would keep components/ convenient as a grab bag, but it would continue to blur the public API boundary and make it harder to see ownership at a glance.

Summary

  • move top-level component and helper files under components/<name>/ directories and add index.ts entrypoints
  • update packages/core/src/index.ts, internal imports, and docs references to use the family directory entrypoints consistently
  • co-locate standalone select/combobox/autocomplete implementations with their corresponding parts-based families and move related tests/snapshots with them
  • separate internal-only UI building blocks from the public component surface, using components/internals only where no narrower owner exists

@IzumiSy
IzumiSy force-pushed the refactor/components-directory-entrypoints branch from 7e70efb to 6a617ae Compare August 21, 2026 07:25
@github-actions

github-actions Bot commented Aug 21, 2026

Copy link
Copy Markdown
Contributor

Code Metrics Report

main (de6ef76) #464 (cbd701d) +/-
Coverage 90.0% 90.0% 0.0%
Test Execution Time 2m4s 1m41s -23s
Details
  |                     | main (de6ef76) | #464 (cbd701d) | +/-  |
  |---------------------|----------------|----------------|------|
  | Coverage            |          90.0% |          90.0% | 0.0% |
  |   Files             |            126 |            152 |  +26 |
  |   Lines             |           5174 |           5174 |    0 |
  |   Covered           |           4661 |           4661 |    0 |
+ | Test Execution Time |           2m4s |          1m41s | -23s |

Code coverage of files in pull request scope (89.0% → 89.0%)

Details
Files Coverage +/- Status
packages/core/src/components/alert/alert.tsx 100.0% 0.0% renamed
packages/core/src/components/appearance-switcher/appearance-switcher.tsx 93.3% 0.0% renamed
packages/core/src/components/appearance-switcher/index.ts 0.0% 0.0% added
packages/core/src/components/appshell/appshell.tsx 75.7% 0.0% renamed
packages/core/src/components/appshell/index.ts 0.0% 0.0% added
packages/core/src/components/autocomplete/autocomplete-standalone.tsx 100.0% 0.0% renamed
packages/core/src/components/autocomplete/autocomplete.tsx 90.6% 0.0% renamed
packages/core/src/components/avatar/avatar.tsx 100.0% 0.0% renamed
packages/core/src/components/avatar/index.ts 0.0% 0.0% added
packages/core/src/components/badge-list/badge-list.tsx 100.0% 0.0% renamed
packages/core/src/components/badge-list/index.ts 0.0% 0.0% added
packages/core/src/components/badge/badge.tsx 100.0% 0.0% renamed
packages/core/src/components/badge/index.ts 0.0% 0.0% added
packages/core/src/components/button/button.tsx 100.0% 0.0% renamed
packages/core/src/components/button/index.ts 0.0% 0.0% added
packages/core/src/components/card/card.tsx 100.0% 0.0% renamed
packages/core/src/components/card/index.ts 0.0% 0.0% added
packages/core/src/components/checkbox/checkbox.tsx 100.0% 0.0% renamed
packages/core/src/components/checkbox/index.ts 0.0% 0.0% added
packages/core/src/components/combobox/combobox-standalone.tsx 76.3% 0.0% renamed
packages/core/src/components/combobox/combobox.tsx 97.7% 0.0% renamed
packages/core/src/components/command-palette/command-palette.tsx 92.6% 0.0% renamed
packages/core/src/components/command-palette/index.ts 0.0% 0.0% added
packages/core/src/components/data-table/pagination.tsx 94.1% 0.0% modified
packages/core/src/components/data-table/toolbar.tsx 77.5% 0.0% modified
packages/core/src/components/dialog/dialog.tsx 95.2% 0.0% renamed
packages/core/src/components/dialog/index.ts 0.0% 0.0% added
packages/core/src/components/dropdown-items/dropdown-items.ts 100.0% 0.0% renamed
packages/core/src/components/dropdown-items/index.ts 0.0% 0.0% added
packages/core/src/components/field/field.tsx 100.0% 0.0% renamed
packages/core/src/components/field/index.ts 0.0% 0.0% added
packages/core/src/components/fieldset/fieldset.tsx 100.0% 0.0% renamed
packages/core/src/components/form/form.tsx 100.0% 0.0% renamed
packages/core/src/components/form/index.ts 0.0% 0.0% added
packages/core/src/components/input/index.ts 0.0% 0.0% added
packages/core/src/components/input/input.tsx 100.0% 0.0% renamed
packages/core/src/components/internals/app-info/app-info.tsx 100.0% 0.0% renamed
packages/core/src/components/internals/app-info/index.ts 0.0% 0.0% added
packages/core/src/components/internals/async-error-state/async-error-state.tsx 100.0% 0.0% renamed
packages/core/src/components/internals/async-error-state/index.ts 0.0% 0.0% added
packages/core/src/components/internals/breadcrumb/breadcrumb.tsx 75.0% 0.0% renamed
packages/core/src/components/internals/breadcrumb/index.ts 0.0% 0.0% added
packages/core/src/components/internals/default-error-boundary/default-error-boundary.tsx 80.0% 0.0% renamed
packages/core/src/components/internals/default-error-boundary/index.ts 0.0% 0.0% added
packages/core/src/components/internals/separator/index.ts 0.0% 0.0% added
packages/core/src/components/internals/separator/separator.tsx 100.0% 0.0% renamed
packages/core/src/components/internals/sonner/index.ts 0.0% 0.0% added
packages/core/src/components/internals/sonner/sonner.tsx 100.0% 0.0% renamed
packages/core/src/components/menu/index.ts 0.0% 0.0% added
packages/core/src/components/menu/menu.tsx 90.6% 0.0% renamed
packages/core/src/components/select/index.ts 0.0% 0.0% added
packages/core/src/components/select/select-standalone.tsx 95.7% 0.0% renamed
packages/core/src/components/select/select.tsx 100.0% 0.0% renamed
packages/core/src/components/sheet/index.ts 0.0% 0.0% added
packages/core/src/components/sheet/sheet.tsx 97.1% 0.0% renamed
packages/core/src/components/sidebar/default-header.tsx 100.0% 0.0% modified
packages/core/src/components/sidebar/default-sidebar.tsx 97.5% 0.0% modified
packages/core/src/components/sidebar/dynamic-breadcrumb.tsx 93.3% 0.0% renamed
packages/core/src/components/sidebar/primitives.tsx 76.0% +76.0% renamed
packages/core/src/components/sidebar/sidebar-group.tsx 100.0% 0.0% modified
packages/core/src/components/sidebar/sidebar-item.tsx 95.4% 0.0% modified
packages/core/src/components/sidebar/sidebar-layout.tsx 100.0% 0.0% modified
packages/core/src/components/sidebar/sidebar-separator.tsx 100.0% 0.0% modified
packages/core/src/components/table/index.ts 0.0% 0.0% added
packages/core/src/components/table/table.tsx 100.0% 0.0% renamed
packages/core/src/components/tabs/tabs.tsx 100.0% 0.0% renamed
packages/core/src/components/timeline/timeline.tsx 98.6% 0.0% renamed
packages/core/src/components/tooltip/index.ts 0.0% 0.0% added
packages/core/src/components/tooltip/tooltip.tsx 100.0% 0.0% renamed
packages/core/src/components/with-guard/with-guard.tsx 93.5% 0.0% renamed
packages/core/src/contexts/appshell-context.tsx 94.4% 0.0% modified
packages/core/src/fs-routes/converter.tsx 95.9% 0.0% modified
packages/core/src/resource.tsx 100.0% 0.0% modified
packages/core/src/routing/content.tsx 50.0% 0.0% renamed
packages/core/src/routing/document-head.tsx 92.5% 0.0% renamed
packages/core/src/routing/router.tsx 100.0% 0.0% modified
packages/core/src/routing/routes.tsx 85.2% 0.0% modified
src/components/sidebar.tsx 0.0% -76.1% affected

Reported by octocov

@IzumiSy
IzumiSy marked this pull request as ready for review August 21, 2026 07:53
@IzumiSy
IzumiSy requested a review from a team as a code owner August 21, 2026 07:53
@IzumiSy
IzumiSy requested a lite review from Copilot August 21, 2026 07:59

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This pull request standardizes the filesystem layout of packages/core/src/components into consistent “component family” directories with index.ts entrypoints, while separating internal-only building blocks into components/internals or moving ownership-specific UI into routing/ and components/sidebar/. It updates internal imports/exports and relocates/extends tests and snapshots to match the new structure.

Changes:

  • Standardize component family entrypoints (components/<name>/index.ts) and update packages/core/src/index.ts + internal imports accordingly.
  • Move internal-only pieces under components/internals, and move routing/sidebar-owned UI (e.g. content, document-head, dynamic breadcrumb) to their owning modules.
  • Co-locate standalone Select/Combobox/Autocomplete implementations with their families and move/update related tests and snapshots (plus add new coverage like DocumentHead tests).

Reviewed changes

Copilot reviewed 81 out of 146 changed files in this pull request and generated no comments.

Show a summary per file
File Description
packages/vite-plugin/README.md Update referenced AppShell source path
packages/core/src/routing/routes.tsx Switch to internal/routing-owned imports
packages/core/src/routing/routes.test.tsx Update imports to routing-owned content
packages/core/src/routing/router.tsx Import DocumentHead from routing module
packages/core/src/routing/document-head.tsx Update dynamic breadcrumb import path
packages/core/src/routing/document-head.test.tsx Add DocumentHead behavior tests
packages/core/src/routing/content.tsx Move Button/Toaster imports to new entrypoints
packages/core/src/resource.tsx Update DefaultErrorBoundary import path
packages/core/src/index.ts Standardize component entrypoint exports
packages/core/src/hooks/use-page-meta.test.tsx Update DefaultErrorBoundary import path
packages/core/src/fs-routes/converter.tsx Update DefaultErrorBoundary import path
packages/core/src/contexts/scroll-container-context.test.tsx Update SidebarLayout import to family entrypoint
packages/core/src/contexts/appshell-context.tsx Update DefaultErrorBoundary import path
packages/core/src/components/with-guard/with-guard.tsx Add WithGuard component + guard caching
packages/core/src/components/with-guard/with-guard.test.tsx Update DefaultErrorBoundary import path
packages/core/src/components/with-guard/index.ts Add family index entrypoint
packages/core/src/components/tooltip/tooltip.tsx Move Tooltip into family directory
packages/core/src/components/tooltip/tooltip.test.tsx Add Tooltip tests for new location
packages/core/src/components/tooltip/index.ts Add family index entrypoint
packages/core/src/components/timeline/index.ts Add family index entrypoint
packages/core/src/components/tabs/tabs.tsx Move Tabs into family directory
packages/core/src/components/tabs/tabs.test.tsx Add Tabs tests for new location
packages/core/src/components/tabs/index.ts Add family index entrypoint
packages/core/src/components/table/table.tsx Move Table into family directory
packages/core/src/components/table/table.test.tsx Add Table tests for new location
packages/core/src/components/table/index.ts Add family index entrypoint
packages/core/src/components/sidebar/sidebar.test.tsx Update sidebar primitive imports + error boundary path
packages/core/src/components/sidebar/sidebar-separator.tsx Use local primitives entrypoint
packages/core/src/components/sidebar/sidebar-layout.tsx Use local primitives + routing content outlet
packages/core/src/components/sidebar/sidebar-item.tsx Use local primitives entrypoint
packages/core/src/components/sidebar/sidebar-group.tsx Use local primitives entrypoint
packages/core/src/components/sidebar/primitives.tsx Update Separator import to internals
packages/core/src/components/sidebar/dynamic-breadcrumb.tsx Move breadcrumb impl under sidebar + internals breadcrumb
packages/core/src/components/sidebar/default-sidebar.tsx Use local primitives entrypoint
packages/core/src/components/sidebar/default-sidebar.test.tsx Use local primitives + error boundary path
packages/core/src/components/sidebar/default-header.tsx Use local primitives + local breadcrumb
packages/core/src/components/sheet/index.ts Add family index entrypoint
packages/core/src/components/select/select.tsx Move Select parts into family directory
packages/core/src/components/select/select-standalone.tsx Co-locate standalone Select + update internal deps
packages/core/src/components/select/select-standalone.test.tsx Update test imports for new structure
packages/core/src/components/select/index.ts Add family index exporting parts + standalone
packages/core/src/components/menu/menu.test.tsx Add Menu tests for new location
packages/core/src/components/menu/index.ts Add family index entrypoint
packages/core/src/components/layout/index.ts Add family index entrypoint
packages/core/src/components/internals/sonner/sonner.tsx Move Sonner Toaster under internals
packages/core/src/components/internals/sonner/index.ts Add internals entrypoint
packages/core/src/components/internals/separator/separator.tsx Add internal Separator building block
packages/core/src/components/internals/separator/separator.test.tsx Add Separator tests
packages/core/src/components/internals/separator/index.ts Add internals entrypoint
packages/core/src/components/internals/default-error-boundary/index.ts Add internals entrypoint
packages/core/src/components/internals/default-error-boundary/default-error-boundary.tsx Update Button import for new structure
packages/core/src/components/internals/breadcrumb/index.ts Add internals entrypoint
packages/core/src/components/internals/breadcrumb/breadcrumb.tsx Add internal breadcrumb building blocks
packages/core/src/components/internals/async-error-state/index.ts Add internals entrypoint
packages/core/src/components/internals/async-error-state/async-error-state.tsx Add shared async error UI + resolver
packages/core/src/components/internals/app-info/index.ts Add internals entrypoint
packages/core/src/components/internals/app-info/app-info.tsx Update package.json import for new location
packages/core/src/components/internals/app-info/app-info.test.tsx Update package.json import for new location
packages/core/src/components/input/input.tsx Move Input into family directory
packages/core/src/components/input/input.test.tsx Update RHF test util import path
packages/core/src/components/input/index.ts Add family index entrypoint
packages/core/src/components/form/index.ts Add family index entrypoint
packages/core/src/components/form/form.tsx Move Form into family directory
packages/core/src/components/form/form.test.tsx Update Field import for new structure
packages/core/src/components/fieldset/index.ts Add family index entrypoint
packages/core/src/components/fieldset/fieldset.tsx Move Fieldset into family directory
packages/core/src/components/fieldset/fieldset.test.tsx Add Fieldset tests
packages/core/src/components/field/index.ts Add family index entrypoint
packages/core/src/components/field/field.test.tsx Update RHF test util import path
packages/core/src/components/dropdown-items/index.ts Add family index entrypoint
packages/core/src/components/dropdown-items/dropdown-items.ts Move dropdown item helpers into family dir
packages/core/src/components/dialog/index.ts Add family index entrypoint
packages/core/src/components/dialog/dialog.tsx Move Dialog into family directory
packages/core/src/components/dialog/dialog.test.tsx Add Dialog tests + snapshots
packages/core/src/components/data-table/toolbar.tsx Update Select import to new family entrypoint
packages/core/src/components/data-table/pagination.tsx Update Select import to new family entrypoint
packages/core/src/components/csv-importer/CsvImporter.tsx Update Combobox import to new family entrypoint
packages/core/src/components/command-palette/index.ts Add family index entrypoint
packages/core/src/components/command-palette/command-palette.tsx Update app-info + navigation imports
packages/core/src/components/command-palette/command-palette.test.tsx Update navigation type import path
packages/core/src/components/combobox/index.ts Add family index exporting parts + standalone
packages/core/src/components/combobox/combobox-standalone.tsx Co-locate standalone Combobox + update deps
packages/core/src/components/combobox/combobox-standalone.test.tsx Update test imports for new structure
packages/core/src/components/checkbox/index.ts Add family index entrypoint
packages/core/src/components/checkbox/checkbox.tsx Move Checkbox into family directory
packages/core/src/components/checkbox/checkbox.test.tsx Update RHF + Field import paths
packages/core/src/components/card/index.ts Add family index entrypoint
packages/core/src/components/card/card.tsx Move Card into family directory
packages/core/src/components/card/card.test.tsx Add Card tests + snapshots
packages/core/src/components/button/index.ts Add family index entrypoint
packages/core/src/components/button/button.tsx Move Button into family directory
packages/core/src/components/button/button.test.tsx Add Button tests + snapshots
packages/core/src/components/badge/index.ts Add family index + default export passthrough
packages/core/src/components/badge/badge.tsx Update cn import for new location
packages/core/src/components/badge-list/index.ts Add family index entrypoint
packages/core/src/components/badge-list/badge-list.tsx Update Badge imports to new structure
packages/core/src/components/badge-list/badge-list.test.tsx Update test util import path
packages/core/src/components/avatar/index.ts Add family index entrypoint
packages/core/src/components/avatar/avatar.tsx Move Avatar into family directory
packages/core/src/components/avatar/avatar.test.tsx Add Avatar tests + snapshots
packages/core/src/components/autocomplete/index.ts Add family index exporting parts + standalone
packages/core/src/components/autocomplete/autocomplete-standalone.tsx Co-locate standalone Autocomplete + update deps
packages/core/src/components/autocomplete/autocomplete-standalone.test.tsx Update test imports for new structure
packages/core/src/components/appshell/index.ts Add family index entrypoint
packages/core/src/components/appearance-switcher/index.ts Add family index entrypoint
packages/core/src/components/appearance-switcher/appearance-switcher.tsx Move AppearanceSwitcher into family dir
packages/core/src/components/appearance-switcher/appearance-switcher.test.tsx Update test util import path
packages/core/src/components/alert/index.ts Add family index entrypoint
packages/core/src/components/alert/alert.tsx Update cn import for new location
packages/core/src/components/alert/alert.test.tsx Add Alert tests + snapshots
packages/core/snapshots/src__components__tooltip__tooltip.test.tsx.snap New Tooltip snapshots
packages/core/snapshots/src__components__table__table.test.tsx.snap New Table snapshots
packages/core/snapshots/src__components__select__select-standalone.test.tsx.snap New Select standalone snapshots
packages/core/snapshots/src__components__input__input.test.tsx.snap New Input snapshots
packages/core/snapshots/src__components__form__form.test.tsx.snap New Form snapshots
packages/core/snapshots/src__components__fieldset__fieldset.test.tsx.snap New Fieldset snapshots
packages/core/snapshots/src__components__field__field.test.tsx.snap New Field snapshots
packages/core/snapshots/src__components__dialog__dialog.test.tsx.snap New Dialog snapshots
packages/core/snapshots/src__components__combobox__combobox.test.tsx.snap New Combobox parts snapshots
packages/core/snapshots/src__components__combobox__combobox-standalone.test.tsx.snap New Combobox standalone snapshots
packages/core/snapshots/src__components__checkbox__checkbox.test.tsx.snap New Checkbox snapshots
packages/core/snapshots/src__components__card__card.test.tsx.snap New Card snapshots
packages/core/snapshots/src__components__button__button.test.tsx.snap New Button snapshots
packages/core/snapshots/src__components__avatar__avatar.test.tsx.snap New Avatar snapshots
packages/core/snapshots/src__components__autocomplete__autocomplete.test.tsx.snap New Autocomplete parts snapshots
packages/core/snapshots/src__components__autocomplete__autocomplete-standalone.test.tsx.snap New Autocomplete standalone snapshots
packages/core/snapshots/src__components__alert__alert.test.tsx.snap New Alert snapshots
.agents/references/composite-field-controls.md Update reference paths to new structure
.agents/references/component-design.md Document standardized filesystem shape + internals rules

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants