[SPIKE]feat:CTORNDSD-590: react native support - #16
Merged
Zlodej43sm merged 14 commits intoAug 13, 2026
Conversation
- Deleted App.tsx and package-lock.json used for the `spike-react-native` smoke test. - Removed dependencies and styles associated with its functionality.
…GdButton, and GdSelect - Implemented focus ring approximation for `GdInput`, `GdButton`, and `GdSelect` components using absolutely positioned sibling layers. - Added tests for focus ring behavior, except where not supported by test-rendering tools. - Modified Metro config to enhance React dependency resolution and added dist support for `libs/ui/styles.css`. - Updated input and select token resolvers to include `focusColor` theme token. - Added React Native web dependencies, adjusted build scripts, and expanded README documentation for development.
…ve-spike # Conflicts: # libs/design-core/README.md # libs/design-core/src/tokenResolvers/typography.ts # libs/web-components/README.md # spike-react-native/App.tsx # spike-react-native/README.md # spike-react-native/package.json # spike-react-native/src/components/GdButton/GdButton.tsx
- Deleted `App.tsx`, `GdButton.tsx`, `package.json`, and `README.md` from `spike-react-native` directory.
There was a problem hiding this comment.
Pull request overview
This PR migrates the earlier standalone React Native spike into the Nx monorepo as libs/react-native, adds an Expo-based PoC for 5 atoms (Button/Checkbox/Typography/Input/Select), and restores/reintroduces several gd-design-core token resolvers to support React Native consumption.
Changes:
- Removed the old repo-root
spike-react-nativepackage and introduced a workspace-based Expo app underlibs/react-native(components, Metro config, tests, docs). - Recreated/restored
gd-design-coretoken resolvers for Checkbox/Input/Typography and added a new Select resolver, with accompanying unit tests and updated barrel exports. - Updated root/workspace tooling and docs (root script/workspaces, ESLint ignores, web-components docs and harness tweaks).
Reviewed changes
Copilot reviewed 46 out of 50 changed files in this pull request and generated 15 comments.
Show a summary per file
| File | Description |
|---|---|
| spike-react-native/src/components/GdButton/GdButton.tsx | Removed legacy standalone RN button spike implementation. |
| spike-react-native/README.md | Removed legacy standalone RN spike documentation. |
| spike-react-native/package.json | Removed legacy standalone RN spike package definition. |
| spike-react-native/App.tsx | Removed legacy standalone RN spike harness app. |
| package.json | Adds dev:react-native script and includes libs/react-native in workspaces. |
| libs/web-components/src/components/gd-typography/gd-typography.ts | Adjusts design-core-related imports used by typography web component. |
| libs/web-components/src/components/gd-select/gd-select.ts | Adjusts design-core-related imports used by select web component. |
| libs/web-components/src/components/gd-input/gd-input.ts | Adjusts design-core-related imports used by input web component. |
| libs/web-components/src/components/gd-checkbox/gd-checkbox.ts | Adjusts design-core-related imports used by checkbox web component. |
| libs/web-components/src/components/gd-button/gd-button.ts | Adjusts design-core-related imports used by button web component. |
| libs/web-components/README.md | Updates RN spike naming/reference in “Parallel-safety” section. |
| libs/web-components/harness/perf-check.tsx | Removes one eslint suppression line around harness-only imports. |
| libs/web-components/harness/fidelity-check.tsx | Removes eslint suppression line around harness-only dist CSS import. |
| libs/web-components/FINDINGS.md | Updates references from spike-react-native to react-native. |
| libs/react-native/tsconfig.json | Fixes path mapping to design-core source within monorepo layout. |
| libs/react-native/src/utils/toFontWeight.ts | Adds shared RN fontWeight coercion helper. |
| libs/react-native/src/utils/pxToNumber.ts | Adds shared RN CSS-px-string-to-number helper. |
| libs/react-native/src/components/GdTypography/GdTypography.tsx | Adds RN typography atom adapter using resolveTypographyStyle. |
| libs/react-native/src/components/GdTypography/GdTypography.test.tsx | Adds RN typography interaction/style mapping tests. |
| libs/react-native/src/components/GdSelect/GdSelectAnchoredPrototype.tsx | Adds non-shipping prototype for select anchoring approach comparison. |
| libs/react-native/src/components/GdSelect/GdSelect.tsx | Adds RN select atom adapter using Modal + createSelectStore. |
| libs/react-native/src/components/GdSelect/GdSelect.test.tsx | Adds RN select interaction tests. |
| libs/react-native/src/components/GdInput/GdInput.tsx | Adds RN input atom adapter with debounce and cursor-jump mitigation logic. |
| libs/react-native/src/components/GdInput/GdInput.test.tsx | Adds RN input interaction tests (typing, debounce, focus ring, guard). |
| libs/react-native/src/components/GdCheckbox/GdCheckbox.tsx | Adds RN checkbox atom adapter using createCheckboxStore. |
| libs/react-native/src/components/GdCheckbox/GdCheckbox.test.tsx | Adds RN checkbox interaction tests. |
| libs/react-native/src/components/GdButton/GdButton.tsx | Adds RN button atom adapter with focus ring + resolver mapping. |
| libs/react-native/README.md | Documents setup, constraints, and run/test instructions for the RN spike. |
| libs/react-native/package.json | Defines the Expo app workspace package, deps, scripts, and Jest config. |
| libs/react-native/metro.config.js | Adds Metro aliasing for gd-design-core source and React de-dupe override. |
| libs/react-native/index.js | Adds Expo root-component registration entrypoint. |
| libs/react-native/FINDINGS.md | Adds spike findings/verdict and detailed per-atom notes. |
| libs/react-native/babel.config.js | Adds Expo Babel preset configuration. |
| libs/react-native/App.tsx | Adds the RN visual-fidelity harness rendering all 5 atoms. |
| libs/react-native/app.json | Updates Expo app name/slug to react-native. |
| libs/react-native/.gitignore | Adds RN app-specific ignores. |
| libs/design-core/src/tokenResolvers/typography.ts | Reintroduces resolveTypographyStyle implementation + types. |
| libs/design-core/src/tokenResolvers/typography.spec.ts | Adds unit tests for typography resolver behavior. |
| libs/design-core/src/tokenResolvers/select.ts | Adds resolveSelectStyle for RN select adapter consumption. |
| libs/design-core/src/tokenResolvers/select.spec.ts | Adds unit tests for select resolver behavior. |
| libs/design-core/src/tokenResolvers/input.ts | Reintroduces resolveInputStyle implementation + constants/types. |
| libs/design-core/src/tokenResolvers/input.spec.ts | Adds unit tests for input resolver behavior. |
| libs/design-core/src/tokenResolvers/index.ts | Updates barrel exports to include resolver functions and types/constants. |
| libs/design-core/src/tokenResolvers/checkbox.ts | Reintroduces resolveCheckboxStyle implementation + types. |
| libs/design-core/src/tokenResolvers/checkbox.spec.ts | Adds unit tests for checkbox resolver behavior. |
| libs/design-core/README.md | Updates docs to describe Lit vs RN resolver consumption and current status. |
| eslint.config.mjs | Ignores libs/react-native/** and attempts to exclude its tsconfig from import resolver. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
- Consolidated import paths across components to reference `gd-design-core`. - Simplified theme utilities and token resolver imports in `gd-checkbox`, `gd-button`, `gd-input`, `gd-select`, and `gd-typography`.
Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>
Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>
Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>
Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>
Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>
…re` across components - Updated imports in `gd-button`, `gd-select`, `gd-input`, `gd-checkbox`, and `gd-typography` to explicitly use `type` annotations.
Zlodej43sm
marked this pull request as ready for review
August 13, 2026 07:47
… compatibility - Introduced `toFontFamily()` utility to resolve CSS font stacks into loadable native font faces. - Added `fonts.ts` for face registration via `expo-font`; ensures Fira Sans and Fira Code assets are loaded. - Updated `App.tsx` to block rendering until fonts are fully loaded. - Expanded GdButton tests and validated alignment with design tokens. - Fixed `dev:react-native` to properly forward Expo CLI flags.
… compatibility - Introduced `toFontFamily()` utility to resolve CSS font stacks into loadable native font faces. - Added `fonts.ts` for face registration via `expo-font`; ensures Fira Sans and Fira Code assets are loaded. - Updated `App.tsx` to block rendering until fonts are fully loaded. - Expanded GdButton tests and validated alignment with design tokens. - Fixed `dev:react-native` to properly forward Expo CLI flags.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
No description provided.