Chonky v2.1.0 Docs
IntroductionInstallation & usageFile Browser demosMigrating from 1.xFAQ
Basics

Migrating from 1.x

Components

  • FileNavbar component was added. The folder chain is now displayed in FileNavbar instead of FileToolbar.
  • ⚠️ FileSearch component was removed. The search input was moved into FileToolbar.

Icons

  • ⚠️ To decrease the bundle size, the default FontAwesome icon component was moved into a separate package - chonky-icon-fontawesome. It is now also possible to provide custom icon component.

File actions

  • ⚠️ EssentialFileActions were introduced. These are file actions required by Chonky to function correctly. They are always enabled. DefaultFileActions now only contain non-essential actions, and users can still disable them.
  • ⚠️ toolbarButton field was renamed into button. button object now needs either button.toolbar or button.contextMenu to be set to true to be displayed in respective parts of the interface. The button.dropdown field was deprecated, now group being truthy/falsy serves the same purpose.
  • specialActionToDispatch field was removed. In fact, "special" actions were completely deprecated. Instead, Chonky now allows actions to define the effect function that has access to Chonky's Redux state.
  • Although you can still define custom file actions using the old way (plain JS objects), new utility functions are provided to create type-safe action definitions.

File action handler

  • ⚠️ The file action handler has changed completely - it is now called differently, and different parameters are passed in. These changes are not backwards-compatible, so you will need to re-define your file action handlers.

Styling

  • ⚠️ Chonky now uses a CSS-in-JSS library called JSS. Thanks to this, you no longer need to import Chonky CSS manually. You can remove this line from your project:
    // No longer needed; will throw error.
    import 'chonky/style/main.css';
  • As Chonky no longer uses plain CSS, the mechanisms for overriding built-in classes have changed . You can still override styles using custom CSS rules, but the class names in 2.x are different to 1.x.

State management

  • Chonky now uses Redux for state management instead of Recoil. If your application used Chonky's internal Recoil atoms, your code will no longer receive updates.
If you have a question, want to request a feature or report a bug, please create an issue on GitHub. You can also report inaccurate or unclear documentation on Chonky's Discord server.