Skip to content
Orbix React · Tailwind CSS v1.0.3

Updating Orbix

Each release of Orbix is listed in Changelog with the files it touches. Download the new version from your account downloads page at the store or marketplace where you purchased Orbix.

  1. Keep your project under version control (Git or similar) before changing anything.
  2. Extract the new version into a separate folder; never overwrite your project with it.
  3. Compare the new version with the version you started from (a folder diff tool such as WinMerge, Meld or Beyond Compare, or git diff --no-index old/ new/). Since your own code lives in your pages, components, route table, menu, translations and CSS files, most updates come down to a few files.
  4. Copy what you need:
    • packages/foundry-ui/ (the design system) can usually be replaced as a whole.
    • src/styles/orbix/, src/core/, src/hooks/, src/layouts/ and src/components/ hold the template code: merge the changes into your copies if you edited them.
    • New pages: copy the components, their lines in src/app/pages.ts and their keys in src/locales/.
  5. Run npm install, npm run build and npm test.

Updating React and the dependencies

Orbix uses standard React, React Router, i18next and Vite: follow their upgrade guides for major versions. Minor updates are safe with npm update, followed by npm run build and npm test (the type check and the tests show what needs attention).

Keeping customizations easy to update

  • Add new styles in your own CSS files instead of editing the Orbix ones.
  • Set the theme defaults in initTheme() (see Theming) instead of editing tokens.
  • Add translation keys in your own files (src/locales/<locale>/app.json) so new Orbix keys never collide with yours.
  • Wrap or compose the Orbix components in your own components instead of editing them in place.