@@ -64,6 +64,20 @@ Jump to **implementations**:
64
64
65
65
---
66
66
67
+ <div align =" center " >
68
+
69
+ Jump to ** UI libraries** :
70
+ — [ Shoelace] ( #ui-libraries )
71
+ — [ Material] ( #ui-libraries )
72
+ — [ Carbon] ( #ui-libraries )
73
+ — [ Wired] ( #ui-libraries )
74
+ — [ System] ( #ui-libraries )
75
+ —
76
+
77
+ </div >
78
+
79
+ ---
80
+
67
81
<details >
68
82
<summary align =" center " ><strong >Table of Contents</strong ></summary >
69
83
@@ -97,6 +111,7 @@ Jump to **implementations**:
97
111
- [Schema](#schema)
98
112
- [ Usage] ( #usage )
99
113
- [Installation](#installation)
114
+ - [UI Libraries](#ui-libraries)
100
115
- [Implementation](#implementation)
101
116
- [All examples](#all-examples)
102
117
- [Pure HTML with CDN](#pure-html-with-cdn)
@@ -525,21 +540,43 @@ items:
525
540
### Installation
526
541
527
542
` ` ` sh
528
- npm i @jsfe/core
543
+ npm i @jsfe/form
529
544
# or
530
- pnpm i @jsfe/core
545
+ pnpm i @jsfe/form
531
546
# or
532
- yarn add @jsfe/core
547
+ yarn add @jsfe/form
533
548
```
534
549
535
- ``` ts
536
- import ' @jsfe/core' ;
550
+ #### UI Libraries
551
+
552
+ See [ examples/src/pages/flavored.astro] ( https://github.com/json-schema-form-element/examples/blob/main/src/pages/flavored.astro )
553
+
554
+ Alternatively:
555
+
556
+ ```
557
+ npm install @jsfe/shoelace
558
+ npm install @jsfe/material
559
+ npm install @jsfe/carbon
560
+ npm install @jsfe/wired
561
+ npm install @jsfe/system
537
562
```
538
563
539
- ``` ts
564
+ ``` html
565
+ <jsf-shoelace schema =" ..." uiSchema =" ..." data =" ..." ></jsf-shoelace >
566
+ <jsf-material schema =" ..." uiSchema =" ..." data =" ..." ></jsf-material >
567
+ <jsf-carbon schema =" ..." uiSchema =" ..." data =" ..." ></jsf-carbon >
568
+ <jsf-wired schema =" ..." uiSchema =" ..." data =" ..." ></jsf-wired >
569
+ <jsf-system schema =" ..." uiSchema =" ..." data =" ..." ></jsf-system >
570
+ ```
571
+
572
+ <!-- ```ts
573
+ import '@jsfe/form';
574
+ ``` -->
575
+
576
+ <!-- ```ts
540
577
import '@shoelace-style/shoelace/dist/themes/light.css';
541
578
import '@shoelace-style/shoelace/dist/themes/dark.css';
542
- ```
579
+ ``` -->
543
580
544
581
See also the [ CSS section] ( #CSS ) .
545
582
@@ -760,7 +797,7 @@ With all external JS dependencies included, minus some CSS:
760
797
761
798
| Package | Size |
762
799
| ---------- | --------------------------------------------------------------- |
763
- | @jsfe/core | ![ ] ( https://deno.bundlejs.com/badge?q=@jsfe/core &treeshake=[*] ) |
800
+ | @jsfe/form | ![ ] ( https://deno.bundlejs.com/badge?q=@jsfe/form &treeshake=[*] ) |
764
801
765
802
Components are planned to be extracted in separate packages as soon as more UI library are added. E.g. ` @jsfe/shoelace ` , ` @jsfe/material ` …
766
803
@@ -800,7 +837,7 @@ Actual **features flags** list:
800
837
- Drag and drop for array items, using native API.
801
838
- Autofocuses (for added array item, etc.)
802
839
- …
803
- - Have an idea? [ Discussions are open] ( https://github.com/json-schema-form-element/core /discussions ) !
840
+ - Have an idea? [ Discussions are open] ( https://github.com/json-schema-form-element/form /discussions ) !
804
841
805
842
## Acknowledgements
806
843
0 commit comments