Skip to content

Commit 750e2dd

Browse files
elbakerinoelbakerino
committed
update to 0.5.0-alpha.1
1 parent 0a107a0 commit 750e2dd

File tree

8 files changed

+16958
-13164
lines changed

8 files changed

+16958
-13164
lines changed

‎.gitignore‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
22

3+
.idea
4+
35
# dependencies
46
/node_modules
57
/.pnp

‎package-lock.json‎

Lines changed: 16704 additions & 13081 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 13 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,24 @@
11
{
22
"name": "demo-bts",
3-
"version": "0.1.0",
3+
"version": "0.5.0-alpha.1",
44
"private": true,
55
"dependencies": {
66
"@testing-library/jest-dom": "^4.2.4",
77
"@testing-library/react": "^9.5.0",
88
"@testing-library/user-event": "^7.2.1",
9-
"@ui-schema/ds-bootstrap": "0.0.11",
10-
"@ui-schema/ui-schema": "0.0.11",
11-
"bootstrap": "^4.4.1",
12-
"clsx": "^1.1.0",
13-
"immutable": "^4.0.0-rc.12",
14-
"react": "^16.13.0",
15-
"react-dom": "^16.13.0",
9+
"@ui-schema/dictionary": "~0.1.0-alpha.1",
10+
"@ui-schema/ds-bootstrap": "~0.5.0-alpha.1",
11+
"@ui-schema/ui-schema": "~0.5.0-alpha.1",
12+
"@ui-schema/react": "~0.5.0-alpha.1",
13+
"@ui-schema/json-schema": "~0.5.0-alpha.1",
14+
"@ui-schema/json-pointer": "~0.5.0-alpha.1",
15+
"bootstrap": "^5.3.7",
16+
"clsx": "^2.1.1",
17+
"immutable": "^5.1.3",
18+
"react": "^18.0",
19+
"react-dom": "^18.0",
1620
"react-router-dom": "^5.1.2",
17-
"react-scripts": "3.4.0",
18-
"ui-schema": "^0.4.4"
21+
"react-scripts": "^5.0.1"
1922
},
2023
"scripts": {
2124
"start": "react-scripts start",

‎src/Schema/DemoEditor.js‎

Lines changed: 131 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,52 @@
11
import React from 'react';
2-
import {SchemaEditor, isInvalid, createOrderedMap, createStore} from "@ui-schema/ui-schema";
3-
import {widgets,} from "@ui-schema/ds-bootstrap";
2+
import { createOrderedMap } from '@ui-schema/ui-schema/createMap'
3+
import { UIMetaProvider } from '@ui-schema/react/UIMeta'
4+
import { UIStoreProvider, createStore } from '@ui-schema/react/UIStore'
5+
import { storeUpdater } from '@ui-schema/react/storeUpdater'
6+
import { WidgetEngine } from '@ui-schema/react/WidgetEngine'
7+
import { browserT } from '../t';
8+
import { DefaultHandler } from '@ui-schema/react/DefaultHandler';
9+
import { ValidityReporter } from '@ui-schema/react/ValidityReporter';
10+
import { schemaPluginsAdapterBuilder } from '@ui-schema/react/SchemaPluginsAdapter';
11+
import {
12+
requiredPlugin,
13+
requiredValidatorLegacy,
14+
standardValidators,
15+
Validator,
16+
validatorPlugin
17+
} from '@ui-schema/json-schema';
18+
import { SchemaGridHandler } from '@ui-schema/ds-bootstrap/Grid';
19+
import { GridContainer } from '@ui-schema/ds-bootstrap/GridContainer';
20+
import { widgets } from "@ui-schema/ds-bootstrap/BindingDefault";
21+
import { isInvalid } from "@ui-schema/react/isInvalid";
422

23+
/**
24+
*
25+
* @type {import('@ui-schema/ds-material/Binding').BtsBinding}
26+
*/
27+
const customBinding = {
28+
...widgets,
29+
widgetPlugins: [
30+
DefaultHandler,
31+
schemaPluginsAdapterBuilder([
32+
validatorPlugin,
33+
requiredPlugin,
34+
]),
35+
SchemaGridHandler, // use `import {GridItemPlugin} from '@ui-schema/ds-material/GridItemPlugin'` for MUI v7
36+
ValidityReporter,
37+
],
38+
// widgets: {
39+
// ...typeWidgets,
40+
// ...bindingExtended,
41+
// },
42+
}
543

6-
const schema1 = createOrderedMap({
44+
const validator = Validator([
45+
...standardValidators,
46+
requiredValidatorLegacy,
47+
])
48+
49+
const schema1 = {
750
type: "object",
851
title: "demo-bts",
952
properties: {
@@ -36,6 +79,68 @@ const schema1 = createOrderedMap({
3679
sizeMd: 12
3780
}
3881
},
82+
coffee: {
83+
type: "string",
84+
widget: "OptionsRadio",
85+
default: "milk",
86+
view: {
87+
sizeMd: 3
88+
},
89+
enum: [
90+
'milk',
91+
'sugar',
92+
'black',
93+
],
94+
t: {
95+
de: {
96+
title: 'Kaffee',
97+
enum: {
98+
milk: 'Milch',
99+
sugar: 'Zucker',
100+
black: 'Schwarz'
101+
}
102+
},
103+
en: {
104+
title: 'Coffee',
105+
enum: {
106+
milk: 'milk',
107+
sugar: 'sugar',
108+
black: 'black'
109+
}
110+
}
111+
},
112+
},
113+
cake: {
114+
type: "array",
115+
widget: "OptionsCheck",
116+
view: {
117+
sizeMd: 3
118+
},
119+
items: {
120+
oneOf: [
121+
{
122+
const: 'cheesecake',
123+
t: {
124+
de: {
125+
title: 'Käsekuchen',
126+
},
127+
en: {
128+
title: 'Cheesecake',
129+
},
130+
},
131+
},
132+
{
133+
const: 'chocolate',
134+
},
135+
{
136+
const: 'donut'
137+
}
138+
],
139+
},
140+
default: [
141+
'cheesecake'
142+
],
143+
},
39144
address: {
40145
type: "object",
41146
properties: {
@@ -63,7 +168,8 @@ const schema1 = createOrderedMap({
63168
sizeMd: 12
64169
}
65170
},
66-
}
171+
},
172+
required: ['country'],
67173
},
68174
birthday: {
69175
type: "string",
@@ -79,7 +185,7 @@ const schema1 = createOrderedMap({
79185
}
80186
},
81187
}
82-
});
188+
};
83189

84190
const data1 = {
85191
headline: 'Some Demo Content Headline',
@@ -98,6 +204,10 @@ const Editor = () => {
98204
}, 1200);
99205
}, [setStore, setSchema]);
100206

207+
const onChange = React.useCallback((actions) => {
208+
setStore(storeUpdater(actions))
209+
}, [setStore])
210+
101211
if(!store || !schema) return <div style={{textAlign: 'center', margin: '75px 0'}}>
102212
<svg className={["bi", "bi-arrow-clockwise"].join(' ')} width="32" height="32" viewBox="0 0 20 20" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
103213
<path fillRule="evenodd" d="M10 4.5a5.5 5.5 0 105.5 5.5.5.5 0 011 0 6.5 6.5 0 11-3.25-5.63l-.5.865A5.472 5.472 0 0010 4.5z" clipRule="evenodd"/>
@@ -108,18 +218,21 @@ const Editor = () => {
108218
</div>;
109219

110220
return <React.Fragment>
111-
<SchemaEditor
112-
schema={schema}
113-
store={store}
114-
onChange={setStore}
115-
widgets={widgets}
116-
showValidity={showValidity}
221+
<UIMetaProvider
222+
binding={customBinding}
223+
t={browserT}
224+
validate={validator.validate}
117225
>
118-
{/*
119-
add children that should be under the schema editor,
120-
they can use the context of the editor for working
121-
*/}
122-
</SchemaEditor>
226+
<UIStoreProvider
227+
store={store}
228+
onChange={onChange}
229+
showValidity={showValidity}
230+
>
231+
<GridContainer>
232+
<WidgetEngine isRoot schema={schema}/>
233+
</GridContainer>
234+
</UIStoreProvider>
235+
</UIMetaProvider>
123236

124237
<button
125238
className={["btn", "btn-primary", "my-2"].join(' ')}
@@ -130,7 +243,8 @@ const Editor = () => {
130243
setShowValidity(true) :
131244
console.log('should do some action here')
132245
}}
133-
>send!</button>
246+
>send!
247+
</button>
134248

135249
<p>
136250
See <code>console.log</code> after clicking on <code>SEND!</code>

‎src/component/GithubLogo.js‎

Lines changed: 11 additions & 8 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/component/NavProject.js‎

Lines changed: 48 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -1,49 +1,51 @@
11
import React from "react";
22
import GithubLogo from "./GithubLogo";
33

4-
export default () => <React.Fragment>
5-
<p>
6-
<span role={'img'} aria-label={'Quick Evaluate CodeSandbox'}>🚀</span>{' '}
7-
<a target="_blank"
8-
rel="noopener noreferrer"
9-
href={'https://codesandbox.io/s/github/ui-schema/demo-bts/tree/master/?autoresize=1&fontsize=12&hidenavigation=1&module=%2Fsrc%2FSchema%2FDemoEditor.js'}>Run on CodeSandbox</a>
10-
</p>
11-
<hr style={{opacity: 0.1, margin: '4px 0 4px 26px'}}/>
12-
<p>
13-
<span role={'img'} aria-label={'Quick Evaluate Repl.it'}>🚀</span>{' '}
14-
<a target="_blank"
15-
rel="noopener noreferrer"
16-
href={'https://repl.it/@carolinholat/demo-bts'}>Repl.it Run</a>&nbsp;|&nbsp;
17-
<a target="_blank"
18-
rel="noopener noreferrer"
19-
href={'https://repl.it/github/ui-schema/demo-bts'}>Repl.it Clone</a>
20-
</p>
21-
<hr style={{opacity: 0.1, margin: '4px 0 4px 26px'}}/>
22-
<p>
23-
<GithubLogo/>
24-
<a target="_blank"
25-
rel="noopener noreferrer"
26-
href={'https://github.com/ui-schema/demo-bts'}>Source of this demo</a>
27-
</p>
28-
<hr style={{opacity: 0.2}}/>
29-
<p>
30-
<span role={'img'} aria-label={'Examples'}>📖</span>
31-
<a target="_blank"
32-
rel="noopener noreferrer"
33-
href={'https://ui-schema.bemit.codes/examples'}>Live-Editor + Examples</a>
34-
</p>
35-
<hr style={{opacity: 0.1, margin: '4px 0 4px 26px'}}/>
36-
<p>
37-
<span role={'img'} aria-label={'Documentation'}>📖</span>
38-
<a target="_blank"
39-
rel="noopener noreferrer"
40-
href={'https://github.com/ui-schema/ui-schema/blob/master/README.md'}>Documentation, Current Status</a>
41-
</p>
42-
<hr style={{opacity: 0.1, margin: '4px 0 4px 26px'}}/>
43-
<p>
44-
<GithubLogo/>
45-
<a target="_blank"
46-
rel="noopener noreferrer"
47-
href={'https://github.com/ui-schema/ui-schema'}>Project, Issues</a>
48-
</p>
49-
</React.Fragment>;
4+
export default function NavProject() {
5+
return <React.Fragment>
6+
<p>
7+
<span role={'img'} aria-label={'Quick Evaluate CodeSandbox'}>🚀</span>{' '}
8+
<a target="_blank"
9+
rel="noopener noreferrer"
10+
href={'https://codesandbox.io/s/github/ui-schema/demo-bts/tree/master/?autoresize=1&fontsize=12&hidenavigation=1&module=%2Fsrc%2FSchema%2FDemoEditor.js'}>Run on CodeSandbox</a>
11+
</p>
12+
<hr style={{opacity: 0.1, margin: '4px 0 4px 26px'}}/>
13+
<p>
14+
<span role={'img'} aria-label={'Quick Evaluate Repl.it'}>🚀</span>{' '}
15+
<a target="_blank"
16+
rel="noopener noreferrer"
17+
href={'https://repl.it/@carolinholat/demo-bts'}>Repl.it Run</a>&nbsp;|&nbsp;
18+
<a target="_blank"
19+
rel="noopener noreferrer"
20+
href={'https://repl.it/github/ui-schema/demo-bts'}>Repl.it Clone</a>
21+
</p>
22+
<hr style={{opacity: 0.1, margin: '4px 0 4px 26px'}}/>
23+
<p>
24+
<GithubLogo/>
25+
<a target="_blank"
26+
rel="noopener noreferrer"
27+
href={'https://github.com/ui-schema/demo-bts'}>Source of this demo</a>
28+
</p>
29+
<hr style={{opacity: 0.2}}/>
30+
<p>
31+
<span role={'img'} aria-label={'Examples'}>📖</span>
32+
<a target="_blank"
33+
rel="noopener noreferrer"
34+
href={'https://ui-schema.bemit.codes/examples'}>Live-Editor + Examples</a>
35+
</p>
36+
<hr style={{opacity: 0.1, margin: '4px 0 4px 26px'}}/>
37+
<p>
38+
<span role={'img'} aria-label={'Documentation'}>📖</span>
39+
<a target="_blank"
40+
rel="noopener noreferrer"
41+
href={'https://github.com/ui-schema/ui-schema/blob/master/README.md'}>Documentation, Current Status</a>
42+
</p>
43+
<hr style={{opacity: 0.1, margin: '4px 0 4px 26px'}}/>
44+
<p>
45+
<GithubLogo/>
46+
<a target="_blank"
47+
rel="noopener noreferrer"
48+
href={'https://github.com/ui-schema/ui-schema'}>Project, Issues</a>
49+
</p>
50+
</React.Fragment>;
51+
}

‎src/index.js‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,11 @@
11
import React from 'react';
2-
import ReactDOM from 'react-dom';
2+
import { createRoot } from 'react-dom/client';
33
import './index.css';
44
import App from './App';
55
import * as serviceWorker from './serviceWorker';
66

7-
ReactDOM.render(<App />, document.getElementById('root'));
7+
createRoot(document.getElementById('root'))
8+
.render(<App/>);
89

910
// If you want your app to work offline and load faster, you can change
1011
// unregister() to register() below. Note this comes with some pitfalls.

0 commit comments

Comments
 (0)