Zunoy Design System & Internal Packages
Senior Frontend Engineer
Overview
Built and maintain the shared front-end platform behind every Zunoy product — a Tailwind-based design system, a composed component library, a real-time collaborative rich-text editor, icons, and framework-agnostic utilities, published as private packages and consumed org-wide.
Deep dive
zunoy-react-tw-ui — core design system
The foundation nearly every Zunoy webapp is built on: Tailwind CSS v4 theming via native @theme, full light/dark mode with a global ConfigProvider, and a Storybook + Vitest + Playwright pipeline for documentation and browser testing.
zunoy-react-components-kit — composed components
Higher-level components built on top of the core kit — calendar/scheduling (FullCalendar + react-big-calendar), async-paginated selects, all documented in Storybook.
react-lexical-editor — collaborative rich-text editor
The editor used across Uptime, Form API, Docs, HRMS, and Bug Tracker dashboards. Built on Meta's Lexical framework with real-time multi-user collaborative editing via Yjs + Hocuspocus (WebSocket sync, IndexedDB offline persistence), embedded CodeMirror code blocks, and MDX support.
zunoy-canvas-kit — annotation engine
A zero-dependency canvas annotation component (freehand draw, shapes, text, undo/redo) that powers the Bug Tracker widget's screenshot markup.
zunoy-icons & zunoy-web-utils
An automated SVG-to-React icon pipeline, and a small framework-agnostic utility package (timezone handling, SSE helpers) shared across products.
Outcome
A layered internal platform — base UI kit, composed components, editor, icons, utils — that every product team consumes instead of rebuilding common pieces from scratch.