Skip to content

feat(app): add debug layout direction toggle - #40393

Merged
Hona merged 2 commits into
anomalyco:devfrom
Hona:debug-rtl-toggle
Aug 4, 2026
Merged

feat(app): add debug layout direction toggle#40393
Hona merged 2 commits into
anomalyco:devfrom
Hona:debug-rtl-toggle

Conversation

@Hona

@Hona Hona commented Aug 4, 2026

Copy link
Copy Markdown
Member

Summary

  • add a DebugBar DIR toggle that forces RTL or LTR without changing the selected language
  • propagate the forced direction through the document root and Kobalte's locale context so menus and submenus mirror correctly
  • localize the new direction control and the existing focus control across all supported app locales

Testing

  • bun typecheck (packages/app)
  • bun typecheck (packages/ui)
  • bun test --conditions=solid --preload ./happydom.ts ./src/i18n/parity.test.ts (packages/app)
  • bun test src/context/i18n.test.ts (packages/ui)
  • repository pre-push typecheck: 30 packages passed
  • Prettier check

@Hona
Hona requested a review from Brendonovich as a code owner August 4, 2026 08:04
Copilot AI lite review requested due to automatic review settings August 4, 2026 08:04

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

Adds a DebugBar control to force LTR/RTL layout independent of the selected language, and threads that override through the app’s document root dir plus the UI/Kobalte i18n provider so directional UI (menus/submenus) mirrors correctly.

Changes:

  • Add layout-direction override state to the app language context and apply it to document.documentElement.dir.
  • Bridge a separate layoutLocale into @opencode-ai/ui’s I18nProvider to drive Kobalte’s direction behavior.
  • Localize new DebugBar direction + focus controls across all supported app locales.

Reviewed changes

Copilot reviewed 32 out of 32 changed files in this pull request and generated 1 comment.

Show a summary per file
File Description
packages/ui/src/context/i18n.tsx Allows an optional layoutLocale to drive Kobalte’s I18nProvider locale (for direction) independently of translation locale.
packages/app/src/context/language.tsx Introduces direction override state, computes direction/layoutLocale, and applies dir to the document root.
packages/app/src/components/debug-bar.tsx Adds DIR toggle UI and refactors focus into a generic toggle cell; adjusts grid spans to fit.
packages/app/src/app.tsx Passes layoutLocale through the UI i18n bridge provider.
packages/app/src/i18n/ar.ts Adds localized strings for DebugBar focus + direction controls.
packages/app/src/i18n/az.ts Adds localized strings for DebugBar focus + direction controls.
packages/app/src/i18n/br.ts Adds localized strings for DebugBar focus + direction controls.
packages/app/src/i18n/bs.ts Adds localized strings for DebugBar focus + direction controls.
packages/app/src/i18n/da.ts Adds localized strings for DebugBar focus + direction controls.
packages/app/src/i18n/de.ts Adds localized strings for DebugBar focus + direction controls.
packages/app/src/i18n/en.ts Adds localized strings for DebugBar focus + direction controls.
packages/app/src/i18n/es.ts Adds localized strings for DebugBar focus + direction controls.
packages/app/src/i18n/fi.ts Adds localized strings for DebugBar focus + direction controls.
packages/app/src/i18n/fr.ts Adds localized strings for DebugBar focus + direction controls.
packages/app/src/i18n/hi.ts Adds localized strings for DebugBar focus + direction controls.
packages/app/src/i18n/id.ts Adds localized strings for DebugBar focus + direction controls.
packages/app/src/i18n/it.ts Adds localized strings for DebugBar focus + direction controls.
packages/app/src/i18n/ja.ts Adds localized strings for DebugBar focus + direction controls.
packages/app/src/i18n/ko.ts Adds localized strings for DebugBar focus + direction controls.
packages/app/src/i18n/nl.ts Adds localized strings for DebugBar focus + direction controls.
packages/app/src/i18n/no.ts Adds localized strings for DebugBar focus + direction controls.
packages/app/src/i18n/pa.ts Adds localized strings for DebugBar focus + direction controls.
packages/app/src/i18n/pl.ts Adds localized strings for DebugBar focus + direction controls.
packages/app/src/i18n/ru.ts Adds localized strings for DebugBar focus + direction controls.
packages/app/src/i18n/sv.ts Adds localized strings for DebugBar focus + direction controls.
packages/app/src/i18n/th.ts Adds localized strings for DebugBar focus + direction controls.
packages/app/src/i18n/tr.ts Adds localized strings for DebugBar focus + direction controls.
packages/app/src/i18n/uk.ts Adds localized strings for DebugBar focus + direction controls.
packages/app/src/i18n/ur.ts Adds localized strings for DebugBar focus + direction controls.
packages/app/src/i18n/vi.ts Adds localized strings for DebugBar focus + direction controls.
packages/app/src/i18n/zh.ts Adds localized strings for DebugBar focus + direction controls.
packages/app/src/i18n/zht.ts Adds localized strings for DebugBar focus + direction controls.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

<button
type="button"
aria-label="Force focus styles on all interactive elements"
aria-label={props.tip}
@Hona
Hona enabled auto-merge (squash) August 4, 2026 08:13
@Hona
Hona merged commit c387fe1 into anomalyco:dev Aug 4, 2026
12 of 13 checks passed
banlanzs pushed a commit to banlanzs/opencode that referenced this pull request Aug 6, 2026
charlesverge pushed a commit to charlesverge/opencode that referenced this pull request Aug 11, 2026
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