awesome-repositories.com
Blog
MCP
awesome-repositories.com

Descubre los mejores repositorios open-source con nuestra búsqueda potenciada por IA.

ExplorarBúsquedas curadasAlternativas open-sourceSoftware autohospedableBlogMapa del sitio
ProyectoServidor MCPAcerca deCómo clasificamosPrensa
Aviso legalPrivacidadTérminos
© 2026 Bringes Technology SRL·VAT RO45896025·hello@awesome-repositories.com
·
seek-oss avatar

seek-oss/playroom

0
View on GitHub↗

Playroom

Playroom es una herramienta de sistema de diseño frontend y sandbox de componentes JSX. Funciona como un banco de trabajo para componentes de UI y un prototipador con soporte para TypeScript, permitiendo a los desarrolladores diseñar y probar interfaces en un entorno interactivo en tiempo real.

El proyecto permite pruebas visuales renderizando el mismo componente bajo múltiples temas, tamaños de pantalla y configuraciones de propiedades simultáneamente. Proporciona un mecanismo para guías de estilo interactivas y documentación de sistemas de diseño, donde los componentes pueden ser prototipados usando una librería existente y exportados como un sandbox distribuible.

El banco de trabajo incluye capacidades para alternar estados, gestionar dimensiones de marco y análisis de tipos estáticos para el autocompletado de props. También cuenta con herramientas para organizar fragmentos de código, inyectar variables globales y envolver componentes en árboles de proveedores personalizados para mantener el estado global requerido.

Se proporciona una interfaz de línea de comandos para orquestar el servidor de desarrollo local y compilar el entorno de sandbox en un formato distribuible.

Búsqueda con IA

Explora más repositorios increíbles

Describe lo que necesitas en lenguaje sencillo: la IA clasifica miles de proyectos open-source curados por relevancia.

Start searching with AI

Features

  • Design System Tooling - Functions as a comprehensive utility for documenting and iterating on design system components.
  • JSX Sandboxes - Renders live previews of UI elements by evaluating JSX code within a controlled browser sandbox.
  • Design System Documentation - Offers an interactive gallery for cataloging UI patterns and components for design system documentation.
  • Development Iteration Workflows - Provides a rapid iteration workflow for JSX components with real-time previews and state toggling.
  • Rapid Prototyping Environments - Provides a rapid prototyping environment for designing and testing user interfaces in a live sandbox.
  • Type-Aware Autocompletion - Provides intelligent code completion by parsing TypeScript prop types from source files.
  • Prop Autocompletion Utilities - Parses type definitions to generate static property information for enhanced code completion in the editor.
  • Type Definition Parsing - Extracts TypeScript prop types from source files to provide intelligent autocomplete and property suggestions.
  • Sandbox State Injections - Allows passing toggleable boolean controls and global variables into the sandbox to modify component states in real-time.
  • Multi-Viewport Theme Previews - Renders the same component instance across multiple simultaneous viewports with different theme and size configurations.
  • Component Configuration Providers - Injects custom wrappers around rendered output to provide components with required context and properties.
  • Component Documentation Sandboxes - Provides an isolated sandbox environment for developing and documenting JSX components.
  • Component Workbenches - Implements a component workbench for the isolated development, testing, and documentation of UI elements.
  • Type-Aware Prototyping Tools - Provides a TypeScript-aware prototyping experience with intelligent prop inspection and autocompletion.
  • Component-Based Prototyping - Supports component-based prototyping by assembling reusable UI elements in a live sandbox.
  • Component Wrapper Providers - Provides custom provider wrapping to ensure components have access to required global state and themes in the sandbox.
  • Development Servers - Provides a command-line interface to launch a local development server for real-time component iteration.
  • Preview Frame Setting Toggles - Allows switching environment settings for individual preview frames to test layout and orientation.
  • Component Property Toggles - Provides a user interface to independently toggle boolean properties and layout states for preview frames.
  • Rendered Element Source Mapping - Connects a rendered UI element back to its corresponding line of code to accelerate debugging.
  • Build Pipeline Loader Rules - Customizes the build pipeline to integrate specific loaders and handle non-standard module formats.
  • Global Variable Injections - Exposes custom variables and hooks to the editor scope for direct use within components.
  • Build Configuration Overrides - Supports overriding default build settings and module rules to integrate custom loaders.
  • Visual Consistency Testing - Enables visual consistency testing by rendering components across multiple themes and screen sizes simultaneously.
  • Sandbox Compilation Tools - Provides a CLI utility for compiling the sandbox environment into a distributable format for hosting and sharing.
  • Simultaneous Theme Previews - Renders the same component across various theme configurations simultaneously to ensure visual consistency.
  • Preview Frame Controls - Provides toggleable boolean controls for each preview frame to modify layout or debug modes as properties.
  • Interactive - Allows developers to experiment with component props and layouts in a distributable interactive environment.
  • Visual Design Iteration Tools - Saves and organizes UI iterations locally using titles and thumbnails for easy switching between layouts.
4,579 estrellas·187 forks·TypeScript·MIT·6 vistas

Historial de estrellas

Gráfico del historial de estrellas de seek-oss/playroomGráfico del historial de estrellas de seek-oss/playroom

Preguntas frecuentes

¿Qué hace seek-oss/playroom?

Playroom es una herramienta de sistema de diseño frontend y sandbox de componentes JSX. Funciona como un banco de trabajo para componentes de UI y un prototipador con soporte para TypeScript, permitiendo a los desarrolladores diseñar y probar interfaces en un entorno interactivo en tiempo real.

¿Cuáles son las características principales de seek-oss/playroom?

Las características principales de seek-oss/playroom son: Design System Tooling, JSX Sandboxes, Design System Documentation, Development Iteration Workflows, Rapid Prototyping Environments, Type-Aware Autocompletion, Prop Autocompletion Utilities, Type Definition Parsing.

¿Qué alternativas de código abierto existen para seek-oss/playroom?

Las alternativas de código abierto para seek-oss/playroom incluyen: skidding/cosmos — Cosmos is a UI component sandbox and development tool used for building and testing user interface elements in… formidablelabs/react-live — react-live is a suite of tools for in-browser React transpilation, live editing, and interactive documentation. It… microsoft/vscode-copilot-chat — This project is an AI-powered IDE extension and LLM coding assistant that provides a conversational interface for… preactjs/preact-cli — preact-cli is a command line tool for scaffolding, developing, and building applications using the Preact library. It… kyleamathews/typography.js — Typography.js is a configuration-driven engine designed to standardize web design systems by generating consistent CSS… sass/sass — Sass is a stylesheet compilation engine and CSS preprocessor that extends standard CSS with variables, nested rules,…

Alternativas open-source a Playroom

Proyectos open-source similares, clasificados según cuántas características comparten con Playroom.
  • skidding/cosmosAvatar de skidding

    skidding/cosmos

    8,665Ver en GitHub↗

    Cosmos is a UI component sandbox and development tool used for building and testing user interface elements in isolation from main application logic. It serves as a frontend design system tool and a modular prototyping environment for verifying the visual behavior and functionality of reusable interface components. The tool provides a dedicated workspace for iterating on visual elements and their states without requiring a full application deployment. This environment supports a frontend design system workflow by allowing components to be developed and documented independently before project

    TypeScript
    Ver en GitHub↗8,665
  • formidablelabs/react-liveAvatar de FormidableLabs

    FormidableLabs/react-live

    4,609Ver en GitHub↗

    react-live is a suite of tools for in-browser React transpilation, live editing, and interactive documentation. It provides a React component for building live playgrounds where source code is transpiled and rendered in real time, accompanied by a live code editor that offers syntax highlighting and immediate visual feedback. The project enables the creation of living documentation by embedding editable React code examples alongside their rendered output. It supports the execution of editable markup or functional components, allowing users to modify code and observe the resulting behavior ins

    TypeScriptcomponent-playgroundlivereact
    Ver en GitHub↗4,609
  • microsoft/vscode-copilot-chatAvatar de microsoft

    microsoft/vscode-copilot-chat

    9,493Ver en GitHub↗

    This project is an AI-powered IDE extension and LLM coding assistant that provides a conversational interface for generating, refactoring, and debugging code. It functions as an AI agent framework and a Model Context Protocol client, connecting AI models to external data sources and tools to automate complex development tasks. The system is distinguished by its use of autonomous AI agents capable of multi-step task execution, including the ability to read files, modify code, and run terminal commands iteratively. It supports recursive agent orchestration through subagent delegation and employ

    TypeScript
    Ver en GitHub↗9,493
  • preactjs/preact-cliAvatar de preactjs

    preactjs/preact-cli

    4,669Ver en GitHub↗

    preact-cli is a command line tool for scaffolding, developing, and building applications using the Preact library. It provides a Webpack-based build pipeline to coordinate code transformation, asset optimization, and production compilation. The toolkit includes a static site prerenderer to convert application routes into static HTML files and a PWA development toolkit for generating service workers and offline asset caching. It also functions as a frontend development server featuring hot module replacement and a proxy for real-time application iteration. The project covers a broad range of

    JavaScriptclihacktoberfesthttp2
    Ver en GitHub↗4,669
Ver las 30 alternativas a Playroom→