@proteinjs/ui 1.0.1
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/CHANGELOG.md +8 -0
- package/LICENSE +21 -0
- package/dist/generated/index.d.ts +17 -0
- package/dist/generated/index.d.ts.map +1 -0
- package/dist/generated/index.js +40 -0
- package/dist/generated/index.js.map +1 -0
- package/dist/index.d.ts +15 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +31 -0
- package/dist/index.js.map +1 -0
- package/dist/src/container/AccountIconButton.d.ts +20 -0
- package/dist/src/container/AccountIconButton.d.ts.map +1 -0
- package/dist/src/container/AccountIconButton.js +112 -0
- package/dist/src/container/AccountIconButton.js.map +1 -0
- package/dist/src/container/NavMenu.d.ts +16 -0
- package/dist/src/container/NavMenu.d.ts.map +1 -0
- package/dist/src/container/NavMenu.js +51 -0
- package/dist/src/container/NavMenu.js.map +1 -0
- package/dist/src/container/PageContainer.d.ts +31 -0
- package/dist/src/container/PageContainer.d.ts.map +1 -0
- package/dist/src/container/PageContainer.js +75 -0
- package/dist/src/container/PageContainer.js.map +1 -0
- package/dist/src/form/Field.d.ts +34 -0
- package/dist/src/form/Field.d.ts.map +1 -0
- package/dist/src/form/Field.js +29 -0
- package/dist/src/form/Field.js.map +1 -0
- package/dist/src/form/Form.d.ts +46 -0
- package/dist/src/form/Form.d.ts.map +1 -0
- package/dist/src/form/Form.js +377 -0
- package/dist/src/form/Form.js.map +1 -0
- package/dist/src/form/FormButton.d.ts +28 -0
- package/dist/src/form/FormButton.d.ts.map +1 -0
- package/dist/src/form/FormButton.js +18 -0
- package/dist/src/form/FormButton.js.map +1 -0
- package/dist/src/form/FunctionalForm.d.ts +1 -0
- package/dist/src/form/FunctionalForm.d.ts.map +1 -0
- package/dist/src/form/FunctionalForm.js +328 -0
- package/dist/src/form/FunctionalForm.js.map +1 -0
- package/dist/src/form/container/FormPage.d.ts +4 -0
- package/dist/src/form/container/FormPage.d.ts.map +1 -0
- package/dist/src/form/container/FormPage.js +29 -0
- package/dist/src/form/container/FormPage.js.map +1 -0
- package/dist/src/form/container/FormPaper.d.ts +4 -0
- package/dist/src/form/container/FormPaper.d.ts.map +1 -0
- package/dist/src/form/container/FormPaper.js +27 -0
- package/dist/src/form/container/FormPaper.js.map +1 -0
- package/dist/src/form/fields/TextField.d.ts +6 -0
- package/dist/src/form/fields/TextField.d.ts.map +1 -0
- package/dist/src/form/fields/TextField.js +70 -0
- package/dist/src/form/fields/TextField.js.map +1 -0
- package/dist/src/list/NestedList.d.ts +14 -0
- package/dist/src/list/NestedList.d.ts.map +1 -0
- package/dist/src/list/NestedList.js +44 -0
- package/dist/src/list/NestedList.js.map +1 -0
- package/dist/src/router/Page.d.ts +28 -0
- package/dist/src/router/Page.d.ts.map +1 -0
- package/dist/src/router/Page.js +7 -0
- package/dist/src/router/Page.js.map +1 -0
- package/dist/src/router/Router.d.ts +14 -0
- package/dist/src/router/Router.d.ts.map +1 -0
- package/dist/src/router/Router.js +66 -0
- package/dist/src/router/Router.js.map +1 -0
- package/dist/src/router/createUrlParams.d.ts +4 -0
- package/dist/src/router/createUrlParams.d.ts.map +1 -0
- package/dist/src/router/createUrlParams.js +19 -0
- package/dist/src/router/createUrlParams.js.map +1 -0
- package/dist/src/router/withRouter.d.ts +7 -0
- package/dist/src/router/withRouter.d.ts.map +1 -0
- package/dist/src/router/withRouter.js +28 -0
- package/dist/src/router/withRouter.js.map +1 -0
- package/dist/src/table/Table.d.ts +14 -0
- package/dist/src/table/Table.d.ts.map +1 -0
- package/dist/src/table/Table.js +170 -0
- package/dist/src/table/Table.js.map +1 -0
- package/dist/src/table/TableButton.d.ts +12 -0
- package/dist/src/table/TableButton.d.ts.map +1 -0
- package/dist/src/table/TableButton.js +3 -0
- package/dist/src/table/TableButton.js.map +1 -0
- package/dist/src/table/TableLoader.d.ts +16 -0
- package/dist/src/table/TableLoader.d.ts.map +1 -0
- package/dist/src/table/TableLoader.js +57 -0
- package/dist/src/table/TableLoader.js.map +1 -0
- package/dist/src/table/TableToolbar.d.ts +10 -0
- package/dist/src/table/TableToolbar.d.ts.map +1 -0
- package/dist/src/table/TableToolbar.js +59 -0
- package/dist/src/table/TableToolbar.js.map +1 -0
- package/generated/index.ts +37 -0
- package/index.ts +20 -0
- package/jest.config.js +18 -0
- package/package.json +52 -0
- package/src/container/AccountIconButton.tsx +118 -0
- package/src/container/NavMenu.tsx +91 -0
- package/src/container/PageContainer.tsx +108 -0
- package/src/form/Field.tsx +51 -0
- package/src/form/Form.tsx +405 -0
- package/src/form/FormButton.tsx +30 -0
- package/src/form/FunctionalForm.tsx +364 -0
- package/src/form/container/FormPage.tsx +23 -0
- package/src/form/container/FormPaper.tsx +16 -0
- package/src/form/fields/TextField.tsx +71 -0
- package/src/list/NestedList.tsx +61 -0
- package/src/router/Page.ts +28 -0
- package/src/router/Router.tsx +76 -0
- package/src/router/createUrlParams.ts +16 -0
- package/src/router/withRouter.tsx +21 -0
- package/src/table/Table.tsx +195 -0
- package/src/table/TableButton.ts +12 -0
- package/src/table/TableLoader.ts +19 -0
- package/src/table/TableToolbar.tsx +99 -0
- package/tsconfig.json +18 -0
|
@@ -0,0 +1,328 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
// import React from 'react';
|
|
3
|
+
// import { Button, Container, Grid, IconButton, Typography, LinearProgress } from '@material-ui/core';
|
|
4
|
+
// import { makeStyles, styled } from '@material-ui/core/styles';
|
|
5
|
+
// import { compose, sizing, spacing } from '@material-ui/system';
|
|
6
|
+
// import queryString from 'query-string';
|
|
7
|
+
// import { history } from '../util/history';
|
|
8
|
+
// import { Field, FieldComponent, Fields } from './Field';
|
|
9
|
+
// import { FormButton, FormButtons } from './FormButton';
|
|
10
|
+
// const useStyles = makeStyles(theme => ({
|
|
11
|
+
// root: {
|
|
12
|
+
// padding: 0
|
|
13
|
+
// },
|
|
14
|
+
// title: {
|
|
15
|
+
// marginBottom: theme.spacing(4),
|
|
16
|
+
// },
|
|
17
|
+
// status: {
|
|
18
|
+
// marginBottom: theme.spacing(2)
|
|
19
|
+
// },
|
|
20
|
+
// button: {
|
|
21
|
+
// margin: theme.spacing(6, 0, 2),
|
|
22
|
+
// }
|
|
23
|
+
// }));
|
|
24
|
+
// export const RootBox = styled('div')(
|
|
25
|
+
// compose(
|
|
26
|
+
// sizing,
|
|
27
|
+
// spacing
|
|
28
|
+
// )
|
|
29
|
+
// );
|
|
30
|
+
// export type FormProps<F extends Fields, B extends FormButtons<F>> = {
|
|
31
|
+
// name?: string,
|
|
32
|
+
// documentation?: React.ComponentType,
|
|
33
|
+
// createFields: () => F,
|
|
34
|
+
// fieldLayout?: (keyof F)[]|(keyof F)[][],
|
|
35
|
+
// buttons: B,
|
|
36
|
+
// onLoad?: (fields: F, buttons: B) => Promise<void>,
|
|
37
|
+
// onLoadProgressMessage?: string
|
|
38
|
+
// }
|
|
39
|
+
// export function Form<F extends Fields, B extends FormButtons<F>>(props: FormProps<F, B>) {
|
|
40
|
+
// const classes = useStyles(props);
|
|
41
|
+
// const [status, setStatus] = React.useState<{ message?: string, isError?: boolean }>();
|
|
42
|
+
// const [fields, setFields] = React.useState<F>();
|
|
43
|
+
// const [progress, setProgress] = React.useState<{ visible?: boolean, message?: string }>();
|
|
44
|
+
// const [fieldRenderKeys, setFieldRenderKeys] = React.useState<{[fieldName: string]: number}>({});
|
|
45
|
+
// // const [fieldRenderKeys, dispatchFieldRenderKeys] = React.useReducer((state: {[fieldName: string]: number}, action: any) => {
|
|
46
|
+
// // // const counter = typeof state[action.field] !== 'undefined' ? state[action.field] + 1 : 1;
|
|
47
|
+
// // // const fieldUpdate: any = {};
|
|
48
|
+
// // // fieldUpdate[action.field] = counter;
|
|
49
|
+
// // // return Object.assign(state, fieldUpdate);
|
|
50
|
+
// // state[action.field] = typeof state[action.field] !== 'undefined' ? state[action.field] + 1 : 1;
|
|
51
|
+
// // return Object.assign({}, state);
|
|
52
|
+
// // }, {});
|
|
53
|
+
// const [renderFields, setRenderFields] = React.useState(0);
|
|
54
|
+
// const [focusedField, setFocusedField] = React.useState<string>();
|
|
55
|
+
// React.useEffect(() => {
|
|
56
|
+
// onLoad();
|
|
57
|
+
// }, []);
|
|
58
|
+
// async function onLoad() {
|
|
59
|
+
// setProgress({ visible: true, message: props.onLoadProgressMessage });
|
|
60
|
+
// const newFields = props.createFields();
|
|
61
|
+
// try {
|
|
62
|
+
// for (const fieldPropertyName in newFields) {
|
|
63
|
+
// const field = newFields[fieldPropertyName].field;
|
|
64
|
+
// if (!field)
|
|
65
|
+
// continue;
|
|
66
|
+
// if (field.onLoad)
|
|
67
|
+
// await field.onLoad(newFields);
|
|
68
|
+
// if (!field.accessibility)
|
|
69
|
+
// field.accessibility = {};
|
|
70
|
+
// Object.defineProperty(field.accessibility, 'required', {
|
|
71
|
+
// get: function() {
|
|
72
|
+
// return this._required;
|
|
73
|
+
// },
|
|
74
|
+
// set: function(value) {
|
|
75
|
+
// console.log(`running set value for field: ${field.name}`);
|
|
76
|
+
// // const renderKeyUpdate: any = {};
|
|
77
|
+
// // renderKeyUpdate[field.name] = typeof renderKeyUpdate[field.name] !== 'undefined' ? renderKeyUpdate[field.name] + 1 : 1;
|
|
78
|
+
// // setFieldRenderKeys(Object.assign(fieldRenderKeys, renderKeyUpdate));
|
|
79
|
+
// fieldRenderKeys[field.name] = typeof fieldRenderKeys[field.name] !== 'undefined' ? fieldRenderKeys[field.name] + 1 : 1;
|
|
80
|
+
// setFieldRenderKeys(Object.assign({}, fieldRenderKeys));
|
|
81
|
+
// // dispatchFieldRenderKeys({ field: field.name });
|
|
82
|
+
// // if (typeof fieldRenderKeys[field.name] !== 'number')
|
|
83
|
+
// // fieldRenderKeys[field.name] = 0;
|
|
84
|
+
// // fieldRenderKeys[field.name] = fieldRenderKeys[field.name] + 1;
|
|
85
|
+
// this._required = value;
|
|
86
|
+
// }
|
|
87
|
+
// });
|
|
88
|
+
// }
|
|
89
|
+
// if (props.onLoad)
|
|
90
|
+
// await props.onLoad(newFields, props.buttons);
|
|
91
|
+
// } catch (error) {
|
|
92
|
+
// console.error(`Failed while running onLoad functions`, error);
|
|
93
|
+
// }
|
|
94
|
+
// setStatus({});
|
|
95
|
+
// setFields(newFields);
|
|
96
|
+
// setProgress({ visible: false });
|
|
97
|
+
// }
|
|
98
|
+
// async function onChange(field: Field<any, any>, value: any, setFieldStatus: (message: string, isError: boolean) => void) {
|
|
99
|
+
// field.value = value;
|
|
100
|
+
// if (field.onChange) {
|
|
101
|
+
// try {
|
|
102
|
+
// await field.onChange(field.value, fields, setFieldStatus);
|
|
103
|
+
// } catch (error) {
|
|
104
|
+
// console.error(`Failed while running onChange for field: ${field.name}`, error);
|
|
105
|
+
// }
|
|
106
|
+
// }
|
|
107
|
+
// setFocusedField(field.name);
|
|
108
|
+
// // setFields(Object.assign({}, fields));
|
|
109
|
+
// // setFieldRenderKeys(Object.assign({}, fieldRenderKeys));
|
|
110
|
+
// // dispatchFieldRenderKeys({ type: 'update' })
|
|
111
|
+
// // setRenderFields(renderFields +1);
|
|
112
|
+
// }
|
|
113
|
+
// async function onClick(button: FormButton<any>) {
|
|
114
|
+
// if (button.onClick) {
|
|
115
|
+
// setProgress({ visible: true, message: button.progressMessage ? button.progressMessage(fields) : undefined });
|
|
116
|
+
// try {
|
|
117
|
+
// const successMessage = await button.onClick(fields, props.buttons);
|
|
118
|
+
// if (successMessage)
|
|
119
|
+
// setStatus({ message: successMessage, isError: false});
|
|
120
|
+
// } catch (error) {
|
|
121
|
+
// setStatus({ message: error.message, isError: true});
|
|
122
|
+
// console.error(`Error when clicking button: ${button.name}`, error);
|
|
123
|
+
// }
|
|
124
|
+
// setProgress({ visible: false });
|
|
125
|
+
// }
|
|
126
|
+
// if (button.redirect) {
|
|
127
|
+
// let path = button.redirect.path;
|
|
128
|
+
// if (button.redirect.props)
|
|
129
|
+
// path += `?${queryString.stringify(button.redirect.props)}`;
|
|
130
|
+
// history.push(path);
|
|
131
|
+
// return;
|
|
132
|
+
// }
|
|
133
|
+
// if (button.clearFormOnClick)
|
|
134
|
+
// await onLoad();
|
|
135
|
+
// }
|
|
136
|
+
// return (
|
|
137
|
+
// <Container>
|
|
138
|
+
// <form autoComplete='off'>
|
|
139
|
+
// <Title />
|
|
140
|
+
// <Documentation />
|
|
141
|
+
// <Status />
|
|
142
|
+
// <Fields />
|
|
143
|
+
// <Progress />
|
|
144
|
+
// <Buttons />
|
|
145
|
+
// </form>
|
|
146
|
+
// </Container>
|
|
147
|
+
// );
|
|
148
|
+
// function Title() {
|
|
149
|
+
// if (!props.name)
|
|
150
|
+
// return null;
|
|
151
|
+
// return (
|
|
152
|
+
// <Grid container justify='flex-start' alignItems='flex-start' spacing={2}>
|
|
153
|
+
// <Grid item>
|
|
154
|
+
// <Typography variant='h5' className={classes.title}>
|
|
155
|
+
// {props.name}
|
|
156
|
+
// </Typography>
|
|
157
|
+
// </Grid>
|
|
158
|
+
// </Grid>
|
|
159
|
+
// );
|
|
160
|
+
// }
|
|
161
|
+
// function Documentation() {
|
|
162
|
+
// if (!props.documentation)
|
|
163
|
+
// return null;
|
|
164
|
+
// return (
|
|
165
|
+
// <Grid container justify='flex-start' alignItems='flex-start'>
|
|
166
|
+
// <Grid item>
|
|
167
|
+
// <props.documentation />
|
|
168
|
+
// </Grid>
|
|
169
|
+
// </Grid>
|
|
170
|
+
// );
|
|
171
|
+
// }
|
|
172
|
+
// function Status() {
|
|
173
|
+
// if (!status || !status.message)
|
|
174
|
+
// return null;
|
|
175
|
+
// return (
|
|
176
|
+
// <Grid container>
|
|
177
|
+
// <Grid item xs={12} className={classes.status}>
|
|
178
|
+
// <Typography
|
|
179
|
+
// variant='subtitle1'
|
|
180
|
+
// color={status.isError ? 'error' : 'primary'}
|
|
181
|
+
// >
|
|
182
|
+
// {status.message}
|
|
183
|
+
// </Typography>
|
|
184
|
+
// </Grid>
|
|
185
|
+
// </Grid>
|
|
186
|
+
// );
|
|
187
|
+
// }
|
|
188
|
+
// function Fields() {
|
|
189
|
+
// return (
|
|
190
|
+
// <Grid container spacing={8}>
|
|
191
|
+
// {
|
|
192
|
+
// getFieldRows().map((fieldComponents, index) => {
|
|
193
|
+
// if (!fieldRowVisible(fieldComponents))
|
|
194
|
+
// return null;
|
|
195
|
+
// return (
|
|
196
|
+
// <Grid item xs={12} key={index}>
|
|
197
|
+
// <Grid container spacing={8}>
|
|
198
|
+
// {
|
|
199
|
+
// fieldComponents.filter((fieldComponent) => {
|
|
200
|
+
// if (fieldComponent.field.accessibility?.hidden)
|
|
201
|
+
// return false;
|
|
202
|
+
// return true;
|
|
203
|
+
// }).map((fieldComponent, key) => {
|
|
204
|
+
// const fieldKey = fieldRenderKeys[fieldComponent.field.name] ? `${fieldComponent.field.name}_${fieldRenderKeys[fieldComponent.field.name]}` : `${fieldComponent.field.name}`;
|
|
205
|
+
// console.log(fieldKey);
|
|
206
|
+
// return (
|
|
207
|
+
// <Grid item xs={12} sm={fieldComponent.field.layout?.width as 1} key={fieldRenderKeys[fieldComponent.field.name] ? `${fieldComponent.field.name}_${fieldRenderKeys[fieldComponent.field.name]}` : `${fieldComponent.field.name}`}>
|
|
208
|
+
// <fieldComponent.component
|
|
209
|
+
// field={fieldComponent.field}
|
|
210
|
+
// onChange={onChange}
|
|
211
|
+
// // focused={focusedField == fieldComponent.field.name}
|
|
212
|
+
// />
|
|
213
|
+
// </Grid>
|
|
214
|
+
// )})
|
|
215
|
+
// }
|
|
216
|
+
// </Grid>
|
|
217
|
+
// </Grid>
|
|
218
|
+
// );
|
|
219
|
+
// })
|
|
220
|
+
// }
|
|
221
|
+
// </Grid>
|
|
222
|
+
// );
|
|
223
|
+
// }
|
|
224
|
+
// function getFieldRows(): FieldComponent<any, any>[][] {
|
|
225
|
+
// const rows: FieldComponent<any, any>[][] = [];
|
|
226
|
+
// if (!fields)
|
|
227
|
+
// return rows;
|
|
228
|
+
// if (props.fieldLayout) {
|
|
229
|
+
// if (typeof props.fieldLayout[0] === 'string') {
|
|
230
|
+
// for (let i = 0; i < props.fieldLayout.length; i++) {
|
|
231
|
+
// const fieldPropertyName = props.fieldLayout[i] as string;
|
|
232
|
+
// const fieldComponent = fields[fieldPropertyName];
|
|
233
|
+
// fieldComponent.field.layout = { row: i, width: 12 };
|
|
234
|
+
// rows.push([fieldComponent]);
|
|
235
|
+
// }
|
|
236
|
+
// } else {
|
|
237
|
+
// for (let i = 0; i < props.fieldLayout.length; i++) {
|
|
238
|
+
// const row = props.fieldLayout[i] as string[];
|
|
239
|
+
// const columns = row.length;
|
|
240
|
+
// if (columns > 6)
|
|
241
|
+
// throw new Error(`When using FormProps.fieldLayout, the maximum number of fields per row is 6, provided: ${columns}. For more granular layout control use Field.layout`);
|
|
242
|
+
// const currentRow: FieldComponent<any, any>[] = [];
|
|
243
|
+
// for (const fieldPropertyName of row ) {
|
|
244
|
+
// const fieldComponent = fields[fieldPropertyName];
|
|
245
|
+
// fieldComponent.field.layout = { row: i, width: columns == 5 ? 2 : 12/columns as 1 };
|
|
246
|
+
// currentRow.push(fieldComponent);
|
|
247
|
+
// }
|
|
248
|
+
// rows.push(currentRow);
|
|
249
|
+
// }
|
|
250
|
+
// }
|
|
251
|
+
// } else {
|
|
252
|
+
// for (const fieldPropertyName in fields) {
|
|
253
|
+
// const fieldComponent: FieldComponent<any, any> = fields[fieldPropertyName];
|
|
254
|
+
// const field = fieldComponent.field;
|
|
255
|
+
// if (!field.layout)
|
|
256
|
+
// throw new Error(`Unless using FormProps.fieldLayout, Field.layout must be provided; layout not provided for field: ${field.name}`);
|
|
257
|
+
// if (typeof rows[field.layout.row] === 'undefined')
|
|
258
|
+
// rows[field.layout.row] = [];
|
|
259
|
+
// if (field.layout.column && rows[field.layout.row].length >= field.layout.column) {
|
|
260
|
+
// rows[field.layout.row].splice(field.layout.column - 1, 0, fieldComponent);
|
|
261
|
+
// } else
|
|
262
|
+
// rows[field.layout.row].push(fieldComponent);
|
|
263
|
+
// const rowWidth = rows[field.layout.row].map((fieldComponent) => fieldComponent.field.layout?.width ? fieldComponent.field.layout.width as number : 0).reduce((accumulator, currentWidth) => accumulator + currentWidth);
|
|
264
|
+
// if (rowWidth > 12)
|
|
265
|
+
// throw new Error(`Width of row exceeds maximum width (12), row width: ${rowWidth}, row index: ${field.layout.row}`);
|
|
266
|
+
// }
|
|
267
|
+
// }
|
|
268
|
+
// return rows;
|
|
269
|
+
// }
|
|
270
|
+
// function fieldRowVisible(fieldComponents: FieldComponent<any, any>[]): boolean {
|
|
271
|
+
// for (const fieldComponent of fieldComponents) {
|
|
272
|
+
// if (!fieldComponent.field.accessibility || !fieldComponent.field.accessibility?.hidden)
|
|
273
|
+
// return true;
|
|
274
|
+
// }
|
|
275
|
+
// return false;
|
|
276
|
+
// }
|
|
277
|
+
// function Progress() {
|
|
278
|
+
// if (!progress || !progress.visible)
|
|
279
|
+
// return null;
|
|
280
|
+
// return (
|
|
281
|
+
// <Grid container justify='center' alignItems='center' spacing={2}>
|
|
282
|
+
// <Grid item>
|
|
283
|
+
// <LinearProgress variant='indeterminate' color='primary' />
|
|
284
|
+
// </Grid>
|
|
285
|
+
// </Grid>
|
|
286
|
+
// );
|
|
287
|
+
// }
|
|
288
|
+
// function Buttons() {
|
|
289
|
+
// return (
|
|
290
|
+
// <Grid container justify='flex-end' alignItems='flex-end' spacing={2}>
|
|
291
|
+
// {
|
|
292
|
+
// Object.keys(props.buttons).map((buttonPropertyName) => props.buttons[buttonPropertyName]).filter((button) => {
|
|
293
|
+
// if (button.accessibility?.hidden)
|
|
294
|
+
// return false;
|
|
295
|
+
// return true;
|
|
296
|
+
// }).map((button, key) => {
|
|
297
|
+
// return (
|
|
298
|
+
// <Grid item key={key}>
|
|
299
|
+
// { button.style.icon ?
|
|
300
|
+
// <RootBox className={classes.button}>
|
|
301
|
+
// <IconButton
|
|
302
|
+
// disabled={button.accessibility?.disabled}
|
|
303
|
+
// onClick={event => onClick(button)}
|
|
304
|
+
// >
|
|
305
|
+
// <button.style.icon />
|
|
306
|
+
// </IconButton>
|
|
307
|
+
// </RootBox>
|
|
308
|
+
// :
|
|
309
|
+
// <RootBox className={classes.button}>
|
|
310
|
+
// <Button
|
|
311
|
+
// color={button.style.color}
|
|
312
|
+
// variant={button.style.variant ? 'contained' : 'text'}
|
|
313
|
+
// disabled={button.accessibility?.disabled}
|
|
314
|
+
// onClick={event => onClick(button)}
|
|
315
|
+
// >
|
|
316
|
+
// {button.name}
|
|
317
|
+
// </Button>
|
|
318
|
+
// </RootBox>
|
|
319
|
+
// }
|
|
320
|
+
// </Grid>
|
|
321
|
+
// )
|
|
322
|
+
// })
|
|
323
|
+
// }
|
|
324
|
+
// </Grid>
|
|
325
|
+
// );
|
|
326
|
+
// }
|
|
327
|
+
// }
|
|
328
|
+
//# sourceMappingURL=FunctionalForm.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FunctionalForm.js","sourceRoot":"","sources":["../../../src/form/FunctionalForm.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FormPage.d.ts","sourceRoot":"","sources":["../../../../src/form/container/FormPage.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAQ,UAAU,EAAE,MAAM,eAAe,CAAC;AAGjD,wBAAgB,QAAQ,CAAC,KAAK,EAAE,UAAU,qBAkBzC"}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
|
3
|
+
__assign = Object.assign || function(t) {
|
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
+
s = arguments[i];
|
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
+
t[p] = s[p];
|
|
8
|
+
}
|
|
9
|
+
return t;
|
|
10
|
+
};
|
|
11
|
+
return __assign.apply(this, arguments);
|
|
12
|
+
};
|
|
13
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
14
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
15
|
+
};
|
|
16
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
|
+
exports.FormPage = void 0;
|
|
18
|
+
var react_1 = __importDefault(require("react"));
|
|
19
|
+
var material_1 = require("@mui/material");
|
|
20
|
+
var FormPaper_1 = require("./FormPaper");
|
|
21
|
+
function FormPage(props) {
|
|
22
|
+
return (react_1.default.createElement(material_1.Grid, { container: true, sx: function (theme) { return ({
|
|
23
|
+
marginTop: theme.spacing(4),
|
|
24
|
+
}); }, direction: 'row', justifyContent: 'center', alignItems: 'center' },
|
|
25
|
+
react_1.default.createElement(material_1.Grid, { item: true },
|
|
26
|
+
react_1.default.createElement(FormPaper_1.FormPaper, __assign({}, props), props.children))));
|
|
27
|
+
}
|
|
28
|
+
exports.FormPage = FormPage;
|
|
29
|
+
//# sourceMappingURL=FormPage.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FormPage.js","sourceRoot":"","sources":["../../../../src/form/container/FormPage.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,gDAA0B;AAC1B,0CAAiD;AACjD,yCAAwC;AAExC,SAAgB,QAAQ,CAAC,KAAiB;IACtC,OAAO,CACH,8BAAC,eAAI,IACD,SAAS,QACT,EAAE,EAAE,UAAC,KAAK,IAAK,OAAA,CAAC;YACZ,SAAS,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;SAC9B,CAAC,EAFa,CAEb,EACF,SAAS,EAAC,KAAK,EACf,cAAc,EAAC,QAAQ,EACvB,UAAU,EAAC,QAAQ;QAEnB,8BAAC,eAAI,IAAC,IAAI;YACN,8BAAC,qBAAS,eAAK,KAAK,GACf,KAAK,CAAC,QAAQ,CACP,CACT,CACJ,CACV,CAAC;AACN,CAAC;AAlBD,4BAkBC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FormPaper.d.ts","sourceRoot":"","sources":["../../../../src/form/container/FormPaper.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAS,MAAM,eAAe,CAAC;AAElD,wBAAgB,SAAS,CAAC,KAAK,EAAE,UAAU,qBAY1C"}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
|
3
|
+
__assign = Object.assign || function(t) {
|
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
+
s = arguments[i];
|
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
+
t[p] = s[p];
|
|
8
|
+
}
|
|
9
|
+
return t;
|
|
10
|
+
};
|
|
11
|
+
return __assign.apply(this, arguments);
|
|
12
|
+
};
|
|
13
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
14
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
15
|
+
};
|
|
16
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
|
+
exports.FormPaper = void 0;
|
|
18
|
+
var react_1 = __importDefault(require("react"));
|
|
19
|
+
var material_1 = require("@mui/material");
|
|
20
|
+
function FormPaper(props) {
|
|
21
|
+
return (react_1.default.createElement(material_1.Paper, __assign({ sx: function (theme) { return ({
|
|
22
|
+
padding: theme.spacing(2, 2, 1),
|
|
23
|
+
width: 'fit-content'
|
|
24
|
+
}); } }, props), props.children));
|
|
25
|
+
}
|
|
26
|
+
exports.FormPaper = FormPaper;
|
|
27
|
+
//# sourceMappingURL=FormPaper.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FormPaper.js","sourceRoot":"","sources":["../../../../src/form/container/FormPaper.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,gDAA0B;AAC1B,0CAAkD;AAElD,SAAgB,SAAS,CAAC,KAAiB;IACvC,OAAO,CACH,8BAAC,gBAAK,aACF,EAAE,EAAE,UAAC,KAAK,IAAK,OAAA,CAAC;YACZ,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;YACrC,KAAK,EAAE,aAAa;SACjB,CAAC,EAHa,CAGb,IACE,KAAK,GAER,KAAK,CAAC,QAAQ,CACX,CACX,CAAC;AACN,CAAC;AAZD,8BAYC"}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { Field, FieldComponent, Fields } from '../Field';
|
|
2
|
+
export type TextFieldProps<T, F extends Fields> = Field<T, F> & {
|
|
3
|
+
isPassword?: boolean;
|
|
4
|
+
};
|
|
5
|
+
export declare function textField<F extends Fields>(props: TextFieldProps<string, F>): FieldComponent<string, F>;
|
|
6
|
+
//# sourceMappingURL=TextField.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TextField.d.ts","sourceRoot":"","sources":["../../../../src/form/fields/TextField.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,EAAE,cAAc,EAAsD,MAAM,EAAE,MAAM,UAAU,CAAC;AAE7G,MAAM,MAAM,cAAc,CAAC,CAAC,EAAE,CAAC,SAAS,MAAM,IAAI,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG;IAC5D,UAAU,CAAC,EAAE,OAAO,CAAA;CACvB,CAAA;AAED,wBAAgB,SAAS,CAAC,CAAC,SAAS,MAAM,EAAE,KAAK,EAAE,cAAc,CAAC,MAAM,EAAE,CAAC,CAAC,GAAG,cAAc,CAAC,MAAM,EAAE,CAAC,CAAC,CA6DvG"}
|
|
@@ -0,0 +1,70 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __assign = (this && this.__assign) || function () {
|
|
3
|
+
__assign = Object.assign || function(t) {
|
|
4
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
5
|
+
s = arguments[i];
|
|
6
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
|
7
|
+
t[p] = s[p];
|
|
8
|
+
}
|
|
9
|
+
return t;
|
|
10
|
+
};
|
|
11
|
+
return __assign.apply(this, arguments);
|
|
12
|
+
};
|
|
13
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
14
|
+
var t = {};
|
|
15
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
16
|
+
t[p] = s[p];
|
|
17
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
18
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
19
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
20
|
+
t[p[i]] = s[p[i]];
|
|
21
|
+
}
|
|
22
|
+
return t;
|
|
23
|
+
};
|
|
24
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
25
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
26
|
+
};
|
|
27
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
28
|
+
exports.textField = void 0;
|
|
29
|
+
var react_1 = __importDefault(require("react"));
|
|
30
|
+
var material_1 = require("@mui/material");
|
|
31
|
+
var icons_material_1 = require("@mui/icons-material");
|
|
32
|
+
var Field_1 = require("../Field");
|
|
33
|
+
function textField(props) {
|
|
34
|
+
var isPassword = props.isPassword;
|
|
35
|
+
return {
|
|
36
|
+
field: props,
|
|
37
|
+
component: TextField
|
|
38
|
+
};
|
|
39
|
+
function TextField(props) {
|
|
40
|
+
var _a, _b;
|
|
41
|
+
var field = props.field, onChange = props.onChange, other = __rest(props, ["field", "onChange"]);
|
|
42
|
+
var _c = react_1.default.useState(false), error = _c[0], setError = _c[1];
|
|
43
|
+
var _d = react_1.default.useState(), statusMessage = _d[0], setStatusMessage = _d[1];
|
|
44
|
+
var _e = react_1.default.useState(false), passwordVisible = _e[0], setPasswordVisible = _e[1];
|
|
45
|
+
return (react_1.default.createElement(material_1.TextField, __assign({ sx: {
|
|
46
|
+
display: 'flex',
|
|
47
|
+
flexWrap: 'nowrap',
|
|
48
|
+
}, key: field.name, label: (0, Field_1.fieldLabel)(field), type: isPassword && !passwordVisible ? 'password' : 'text', value: (0, Field_1.fieldDisplayValue)(field), error: error, helperText: statusMessage ? statusMessage : field.description, required: (_a = field.accessibility) === null || _a === void 0 ? void 0 : _a.required, disabled: (_b = field.accessibility) === null || _b === void 0 ? void 0 : _b.readonly, onChange: function (event) {
|
|
49
|
+
var errorReceived = false;
|
|
50
|
+
var messageReceived;
|
|
51
|
+
onChange(field, event.target.value, function (message, isError) {
|
|
52
|
+
setError(isError);
|
|
53
|
+
setStatusMessage(message);
|
|
54
|
+
errorReceived = isError;
|
|
55
|
+
messageReceived = message;
|
|
56
|
+
}).then(function () {
|
|
57
|
+
if (!errorReceived)
|
|
58
|
+
setError(false);
|
|
59
|
+
if (!messageReceived)
|
|
60
|
+
setStatusMessage(undefined);
|
|
61
|
+
});
|
|
62
|
+
}, InputProps: {
|
|
63
|
+
endAdornment: (isPassword &&
|
|
64
|
+
react_1.default.createElement(material_1.InputAdornment, { position: 'end' },
|
|
65
|
+
react_1.default.createElement(material_1.IconButton, { "aria-label": 'Toggle password visibility', onClick: function (event) { return setPasswordVisible(!passwordVisible); } }, passwordVisible ? react_1.default.createElement(icons_material_1.VisibilityOff, null) : react_1.default.createElement(icons_material_1.Visibility, null))))
|
|
66
|
+
} }, other)));
|
|
67
|
+
}
|
|
68
|
+
}
|
|
69
|
+
exports.textField = textField;
|
|
70
|
+
//# sourceMappingURL=TextField.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TextField.js","sourceRoot":"","sources":["../../../../src/form/fields/TextField.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,gDAA0B;AAC1B,0CAAsF;AACtF,sDAAgE;AAChE,kCAA6G;AAM7G,SAAgB,SAAS,CAAmB,KAAgC;IAChE,IAAA,UAAU,GAAK,KAAK,WAAV,CAAW;IAE7B,OAAO;QACH,KAAK,EAAE,KAAK;QACZ,SAAS,EAAE,SAAS;KACvB,CAAC;IAEF,SAAS,SAAS,CAAC,KAAqC;;QAC5C,IAAA,KAAK,GAAyB,KAAK,MAA9B,EAAE,QAAQ,GAAe,KAAK,SAApB,EAAK,KAAK,UAAK,KAAK,EAArC,qBAA6B,CAAF,CAAW;QACtC,IAAA,KAAoB,eAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAxC,KAAK,QAAA,EAAE,QAAQ,QAAyB,CAAC;QAC1C,IAAA,KAAoC,eAAK,CAAC,QAAQ,EAAU,EAA3D,aAAa,QAAA,EAAE,gBAAgB,QAA4B,CAAC;QAC7D,IAAA,KAAwC,eAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,EAA5D,eAAe,QAAA,EAAE,kBAAkB,QAAyB,CAAC;QAEpE,OAAO,CACH,8BAAC,oBAAY,aACT,EAAE,EAAE;gBACA,OAAO,EAAE,MAAM;gBACrB,QAAQ,EAAE,QAAQ;aACf,EACD,GAAG,EAAE,KAAK,CAAC,IAAI,EACf,KAAK,EAAE,IAAA,kBAAU,EAAC,KAAK,CAAC,EACxB,IAAI,EAAE,UAAU,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,MAAM,EAC1D,KAAK,EAAE,IAAA,yBAAiB,EAAC,KAAK,CAAC,EAC/B,KAAK,EAAE,KAAK,EACZ,UAAU,EAAE,aAAa,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,KAAK,CAAC,WAAW,EAC7D,QAAQ,EAAE,MAAA,KAAK,CAAC,aAAa,0CAAE,QAAQ,EACvC,QAAQ,EAAE,MAAA,KAAK,CAAC,aAAa,0CAAE,QAAQ,EACvC,QAAQ,EAAE,UAAA,KAAK;gBACX,IAAI,aAAa,GAAG,KAAK,CAAC;gBAC1B,IAAI,eAAuB,CAAC;gBAC5B,QAAQ,CAAC,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,KAAK,EAAE,UAAC,OAAe,EAAE,OAAgB;oBAClE,QAAQ,CAAC,OAAO,CAAC,CAAC;oBAClB,gBAAgB,CAAC,OAAO,CAAC,CAAC;oBAC1B,aAAa,GAAG,OAAO,CAAC;oBACxB,eAAe,GAAG,OAAO,CAAC;gBAC9B,CAAC,CAAC,CAAC,IAAI,CAAC;oBACJ,IAAI,CAAC,aAAa;wBACd,QAAQ,CAAC,KAAK,CAAC,CAAC;oBAEpB,IAAI,CAAC,eAAe;wBAChB,gBAAgB,CAAC,SAAS,CAAC,CAAC;gBACpC,CAAC,CAAC,CAAA;YACN,CAAC,EACD,UAAU,EAAE;gBACR,YAAY,EAAE,CACV,UAAU;oBACV,8BAAC,yBAAc,IAAC,QAAQ,EAAC,KAAK;wBAC1B,8BAAC,qBAAU,kBACI,4BAA4B,EACvC,OAAO,EAAE,UAAA,KAAK,IAAI,OAAA,kBAAkB,CAAC,CAAC,eAAe,CAAC,EAApC,CAAoC,IAErD,eAAe,CAAC,CAAC,CAAC,8BAAC,8BAAa,OAAG,CAAC,CAAC,CAAC,8BAAC,2BAAU,OAAG,CAC5C,CACA,CACpB;aACJ,IACG,KAAK,EACX,CACL,CAAC;IACN,CAAC;AACL,CAAC;AA7DD,8BA6DC"}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import React, { ReactElement } from 'react';
|
|
2
|
+
export type NestedListItem = {
|
|
3
|
+
element: ReactElement;
|
|
4
|
+
children?: NestedListItem[];
|
|
5
|
+
renderChildren?: boolean;
|
|
6
|
+
};
|
|
7
|
+
type NestedListProps = {
|
|
8
|
+
items: NestedListItem[];
|
|
9
|
+
level?: number;
|
|
10
|
+
levelColors?: string[];
|
|
11
|
+
};
|
|
12
|
+
export declare const NestedList: ({ items, level, levelColors }: NestedListProps) => React.JSX.Element;
|
|
13
|
+
export {};
|
|
14
|
+
//# sourceMappingURL=NestedList.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"NestedList.d.ts","sourceRoot":"","sources":["../../../src/list/NestedList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,YAAY,EAAE,MAAM,OAAO,CAAA;AAG3C,MAAM,MAAM,cAAc,GAAG;IAAE,OAAO,EAAE,YAAY,CAAC;IAAC,QAAQ,CAAC,EAAE,cAAc,EAAE,CAAC;IAAC,cAAc,CAAC,EAAE,OAAO,CAAA;CAAE,CAAA;AAC7G,KAAK,eAAe,GAAG;IAAE,KAAK,EAAE,cAAc,EAAE,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,WAAW,CAAC,EAAE,MAAM,EAAE,CAAA;CAAE,CAAA;AAO1F,eAAO,MAAM,UAAU,kCAAmC,eAAe,sBAiDxE,CAAA"}
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
exports.NestedList = void 0;
|
|
7
|
+
var react_1 = __importDefault(require("react"));
|
|
8
|
+
var material_1 = require("@mui/material");
|
|
9
|
+
var blue = '#1976d2';
|
|
10
|
+
var green = '#76d275';
|
|
11
|
+
var orange = '#ffa726';
|
|
12
|
+
var purple = '#ab47bc';
|
|
13
|
+
var defaultLevelColors = [blue, green, orange, purple];
|
|
14
|
+
var NestedList = function (_a) {
|
|
15
|
+
var items = _a.items, level = _a.level, levelColors = _a.levelColors;
|
|
16
|
+
var isRoot = typeof level === 'undefined';
|
|
17
|
+
var resolvedLevel = level ? level : 0;
|
|
18
|
+
var resolvedLevelColors = levelColors ? levelColors : defaultLevelColors;
|
|
19
|
+
var flattenedItems = flattenItems(items);
|
|
20
|
+
function flattenItems(items) {
|
|
21
|
+
var flattened = [];
|
|
22
|
+
for (var _i = 0, items_1 = items; _i < items_1.length; _i++) {
|
|
23
|
+
var item = items_1[_i];
|
|
24
|
+
flattened.push(item);
|
|
25
|
+
if (item.children && (item.renderChildren || typeof item.renderChildren === 'undefined'))
|
|
26
|
+
flattened.push(item.children);
|
|
27
|
+
}
|
|
28
|
+
return flattened;
|
|
29
|
+
}
|
|
30
|
+
return (react_1.default.createElement(material_1.Box, { component: 'ul', sx: {
|
|
31
|
+
padding: isRoot ? 0 : undefined,
|
|
32
|
+
margin: isRoot ? 0 : undefined,
|
|
33
|
+
} }, flattenedItems.map(function (item, index) { return (Array.isArray(item)) ?
|
|
34
|
+
react_1.default.createElement(exports.NestedList, { key: index, items: item, level: resolvedLevel + 1 })
|
|
35
|
+
:
|
|
36
|
+
react_1.default.createElement(material_1.Box, { key: index, component: 'li', sx: function (theme) { return ({
|
|
37
|
+
borderLeft: 3,
|
|
38
|
+
borderLeftColor: resolvedLevelColors[resolvedLevel % resolvedLevelColors.length],
|
|
39
|
+
listStyleType: 'none',
|
|
40
|
+
marginTop: !(isRoot && index == 0) ? theme.spacing(1) : undefined,
|
|
41
|
+
}); } }, item.element); })));
|
|
42
|
+
};
|
|
43
|
+
exports.NestedList = NestedList;
|
|
44
|
+
//# sourceMappingURL=NestedList.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"NestedList.js","sourceRoot":"","sources":["../../../src/list/NestedList.tsx"],"names":[],"mappings":";;;;;;AAAA,gDAA2C;AAC3C,0CAAmC;AAInC,IAAM,IAAI,GAAG,SAAS,CAAC;AACvB,IAAM,KAAK,GAAG,SAAS,CAAC;AACxB,IAAM,MAAM,GAAG,SAAS,CAAC;AACzB,IAAM,MAAM,GAAG,SAAS,CAAC;AACzB,IAAM,kBAAkB,GAAG,CAAC,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC;AAElD,IAAM,UAAU,GAAG,UAAC,EAA8C;QAA5C,KAAK,WAAA,EAAE,KAAK,WAAA,EAAE,WAAW,iBAAA;IACpD,IAAM,MAAM,GAAG,OAAO,KAAK,KAAK,WAAW,CAAC;IAC5C,IAAM,aAAa,GAAG,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;IACxC,IAAM,mBAAmB,GAAG,WAAW,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,kBAAkB,CAAC;IAC3E,IAAM,cAAc,GAAG,YAAY,CAAC,KAAK,CAAC,CAAC;IAE3C,SAAS,YAAY,CAAC,KAAuB;QAC3C,IAAM,SAAS,GAAG,EAAE,CAAC;QACrB,KAAiB,UAAK,EAAL,eAAK,EAAL,mBAAK,EAAL,IAAK,EAAE;YAAnB,IAAI,IAAI,cAAA;YACX,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;YACrB,IAAI,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,CAAC,cAAc,IAAI,OAAO,IAAI,CAAC,cAAc,KAAK,WAAW,CAAC;gBACtF,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;SACjC;QAED,OAAO,SAAS,CAAC;IACnB,CAAC;IAED,OAAO,CACL,8BAAC,cAAG,IACF,SAAS,EAAC,IAAI,EACd,EAAE,EAAE;YACF,OAAO,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS;YAC/B,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS;SAC/B,IAGC,cAAc,CAAC,GAAG,CAAC,UAAC,IAAI,EAAE,KAAK,IAAK,OAAA,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC;QACzD,8BAAC,kBAAU,IACT,GAAG,EAAE,KAAK,EACV,KAAK,EAAE,IAAI,EACX,KAAK,EAAE,aAAa,GAAG,CAAC,GACxB;QACF,CAAC;YACD,8BAAC,cAAG,IACF,GAAG,EAAE,KAAK,EACV,SAAS,EAAC,IAAI,EACd,EAAE,EAAE,UAAC,KAAK,IAAK,OAAA,CAAC;oBACd,UAAU,EAAE,CAAC;oBACb,eAAe,EAAE,mBAAmB,CAAC,aAAa,GAAC,mBAAmB,CAAC,MAAM,CAAC;oBAC9E,aAAa,EAAE,MAAM;oBACrB,SAAS,EAAE,CAAC,CAAC,MAAM,IAAI,KAAK,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS;iBAClE,CAAC,EALa,CAKb,IAED,IAAI,CAAC,OAAO,CACT,EAlB4B,CAkB5B,CACP,CAEC,CACP,CAAC;AACJ,CAAC,CAAA;AAjDY,QAAA,UAAU,cAiDtB"}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { SxProps } from '@mui/material';
|
|
3
|
+
import { Loadable } from '@proteinjs/reflection';
|
|
4
|
+
import { NavigateFunction } from 'react-router-dom';
|
|
5
|
+
export declare const getPages: () => Page[];
|
|
6
|
+
export type PageComponentProps = {
|
|
7
|
+
urlParams: {
|
|
8
|
+
[key: string]: string;
|
|
9
|
+
};
|
|
10
|
+
navigate: NavigateFunction;
|
|
11
|
+
};
|
|
12
|
+
export interface Page extends Loadable {
|
|
13
|
+
name: string;
|
|
14
|
+
path: string | string[];
|
|
15
|
+
component: React.ComponentType<PageComponentProps>;
|
|
16
|
+
/** Render component on its own without any additional, top-level container */
|
|
17
|
+
noPageContainer?: boolean;
|
|
18
|
+
auth?: {
|
|
19
|
+
/** If true, the user does not need to be logged in or have any roles to access this page. If blank, defaults to false. */
|
|
20
|
+
public?: boolean;
|
|
21
|
+
/** If true, the user does not need to have any roles to access this page, but must be logged in. If blank, defaults to false. */
|
|
22
|
+
allUsers?: boolean;
|
|
23
|
+
/** The user must be logged in and have these roles to access this page. If blank, defaults to requiring the 'admin' role. */
|
|
24
|
+
roles?: string[];
|
|
25
|
+
};
|
|
26
|
+
pageContainerSxProps?: SxProps;
|
|
27
|
+
}
|
|
28
|
+
//# sourceMappingURL=Page.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Page.d.ts","sourceRoot":"","sources":["../../../src/router/Page.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AACxC,OAAO,EAAE,QAAQ,EAAoB,MAAM,uBAAuB,CAAC;AACnE,OAAO,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;AAEpD,eAAO,MAAM,QAAQ,cAAmE,CAAC;AAEzF,MAAM,MAAM,kBAAkB,GAAG;IAC7B,SAAS,EAAE;QAAC,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;KAAC,CAAC;IACnC,QAAQ,EAAE,gBAAgB,CAAC;CAC9B,CAAA;AAED,MAAM,WAAW,IAAK,SAAQ,QAAQ;IAClC,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,GAAC,MAAM,EAAE,CAAC;IACtB,SAAS,EAAE,KAAK,CAAC,aAAa,CAAC,kBAAkB,CAAC,CAAC;IACnD,8EAA8E;IAC9E,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,IAAI,CAAC,EAAE;QACH,0HAA0H;QAC1H,MAAM,CAAC,EAAE,OAAO,CAAC;QACjB,iIAAiI;QACjI,QAAQ,CAAC,EAAE,OAAO,CAAC;QACnB,6HAA6H;QAC7H,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;KACpB,CAAC;IACF,oBAAoB,CAAC,EAAE,OAAO,CAAC;CAClC"}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.getPages = void 0;
|
|
4
|
+
var reflection_1 = require("@proteinjs/reflection");
|
|
5
|
+
var getPages = function () { return reflection_1.SourceRepository.get().objects('@proteinjs/ui/Page'); };
|
|
6
|
+
exports.getPages = getPages;
|
|
7
|
+
//# sourceMappingURL=Page.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Page.js","sourceRoot":"","sources":["../../../src/router/Page.ts"],"names":[],"mappings":";;;AAEA,oDAAmE;AAG5D,IAAM,QAAQ,GAAG,cAAM,OAAA,6BAAgB,CAAC,GAAG,EAAE,CAAC,OAAO,CAAO,oBAAoB,CAAC,EAA1D,CAA0D,CAAC;AAA5E,QAAA,QAAQ,YAAoE"}
|