@morphql/playground 0.1.17 → 0.1.19

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -1,33 +1,45 @@
1
+ <p align="center">
2
+ <img src="https://raw.githubusercontent.com/Hyperwindmill/morphql/main/morphql.png" alt="MorphQL" width="200" />
3
+ </p>
4
+
5
+ <p align="center">
6
+ <a href="https://www.npmjs.com/package/@morphql/playground"><img src="https://img.shields.io/npm/v/@morphql/playground?label=%40morphql%2Fplayground" alt="npm version" /></a>
7
+ <img src="https://img.shields.io/badge/License-MIT-blue.svg" alt="License: MIT" />
8
+ </p>
9
+
1
10
  # @morphql/playground
2
11
 
3
- An interactive, real-time web editor to test and visualize **Morph Query Language** (MorphQL) transformations.
12
+ An interactive, real-time web editor to test and visualize **Morph Query Language** (MorphQL) transformations. Experiment with queries in the browser and see instant results.
4
13
 
5
- ## Features
14
+ ## Key Features
6
15
 
7
- - **Live Preview**: See transformation results instantly as you type.
8
- - **Code Generation**: Visualize the pure JavaScript function generated by the engine.
9
- - **Monaco Editor**: Rich editing experience with syntax highlighting.
10
- - **Format Toggle**: Test conversions between JSON and XML on the fly.
16
+ - **Live Preview**: Transformation results update instantly as you type.
17
+ - 🛠️ **Code Insight**: Visualize the optimized JavaScript code generated by the engine.
18
+ - 📝 **Rich Editor**: Powered by Monaco (from VS Code) with syntax highlighting.
19
+ - 🔄 **Format Toggles**: Instantly switch and test conversions between JSON and XML.
20
+ - 🚀 **Zero Setup**: Runs entirely in the browser using the isomorphic MorphQL core.
11
21
 
12
22
  ## Development
13
23
 
14
- To start the playground locally during development:
24
+ To start the playground locally for development and testing:
15
25
 
16
26
  ```bash
27
+ # In the monorepo root
17
28
  npm run playground
18
29
  ```
19
30
 
20
- Wait for changes to propagate from `@morphql/core` automatically.
21
-
22
- ## Structure
23
-
24
- The playground is built with:
31
+ ## Tech Stack
25
32
 
26
33
  - **React 19**
27
34
  - **Vite**
28
35
  - **Tailwind CSS 4**
29
36
  - **Monaco Editor**
30
37
 
38
+ ## Learn More
39
+
40
+ - 👉 **[Try it Online](https://hyperwindmill.github.io/morphql/)**
41
+ - 🏠 **[Main Repository](https://github.com/Hyperwindmill/morphql)**
42
+
31
43
  ## License
32
44
 
33
45
  MIT