pcui

PCUI (PlayCanvas UI) is a component library for building reliable and visually pleasing user interfaces for websites and complex web tools. It provides fully styled components that can be used directly in a page, from simple forms to graphical UIs. Installation is via npm install @playcanvas/pcui; individual elements can be imported, with styles imported once per project. React users can import components from @playcanvas/pcui/react. The library includes a data binding layer built around @playcanvas/observer, supporting observers-to-element, element-to-observers, and two-way bindings so multiple components can synchronize values. Components live in ./src/components and typically include an index.ts element, a style.scss SASS file, a React component.tsx wrapper, and a Storybook stories file. Developers can run npm run build for a custom dist build, npm run storybook to browse and test components, and npm run docs to generate the API reference. PCUI uses .font-regular, .font-bold, .font-thin, and .font-light classes with a Helvetica Neue default stack, which can be overridden with custom CSS. A UMD bundle can be built using the guide for use in PlayCanvas Editor projects. The README links to a user manual, API reference, ESM examples, React Storybook, blog, and forum.