What is Pando v1?
Pando v1 is the latest version of Pluralsight’s design system. It is a collection of guidelines, styles, and components that help teams build consistent, accessible, and user-friendly interfaces. Pando v1 is built with React and TypeScript, and it is designed to work with modern front-end tools and frameworks.
Requirements to use Pando v1
To use Pando v1, you need to have the following tools and technologies installed:
- Node.js or bun
- npm or pnpm or Yarn Berry
- React 18 or later
When to use Pando v1
Pando v1 is the recommended version of Pluralsight’s design system for new projects. It is designed to work with modern front-end tools and frameworks, and it provides a solid foundation for building scalable and maintainable interfaces. If you are starting a new project or looking to upgrade an existing project to use the latest design system, Pando v1 is the way to go.
Differences between Pando v0 and Pando v1
Pando v1 is a major update to Pluralsight’s design system, with significant changes over previous versions. To summarize version history:
Versions 0.7.1 and prior (without @next designation) are characterized by making use of the @pluralsight/react library in conjunction with @pluralsight/headless-styles, @pluralsight/react-aria, and @pluralsight/react-utils libraries. The future intention is to deprecate these libraries while providing parity in functionality.
Versions 0.7.1@next[…] are characterized by making use of the @pluralsight/react library in conjunction with the @pluralsight/panda-preset library. It requires the user to adopt and configure PandaCSS alongside the library to make use of the recipes generated by the @pluralsight/panda-preset library. As of the time of this document, this is what is referred to as v1. It was decided to develop v1 in the @next release channel as it was not ideal to release an incomplete set of components.
Version 1.0.0+ does not require the user to adopt and configure PandaCSS. The panda-preset will still be available and used within the @pluralsight/react library, but as a static resource. This will greatly reduce the complexity in adopting the Pando component set, as it will require minimal configuration and remove the complexity of additional knowledge of PandaCSS in order to use the components.
The @pluralsight/react library will be the primary library for consuming Pando, but the @pluralsight/panda-preset, @pluralsight/icons, and @pluralsight/design-tokens will be available as supporting libraries for use as needed.