@openremote/or-json-forms 1.8.0-snapshot.20250725074716 → 1.8.0-snapshot.20250725120000

package/lib/util.js

@@ -1,23 +1,291 @@
-import{composeWithUi as e,createDefaultValue as t,deriveTypes as r,getAjv as o,getData as i,getRenderers as n,getSchema as s,hasShowRule as a,isVisible as c,Resolve as l}from"@jsonforms/core";import{DefaultColor5 as m,Util as p}from"@openremote/core";import{InputType as d}from"@openremote/or-mwc-components/or-mwc-input";import{i18next as f}from"@openremote/or-translate";import"@openremote/or-components/or-ace-editor";import{html as u,unsafeCSS as h}from"lit";import{createRef as b,ref as v}from"lit/directives/ref.js";import{unknownTemplate as S}from"./standard-renderers";import{OrMwcDialog as g,showDialog as y}from"@openremote/or-mwc-components/or-mwc-dialog";export function getTemplateFromProps(e,t){let r;if(!e||!t)return u``;let o=t.renderers||n({jsonforms:Object.assign({},e)}),i=t.schema,s=t.uischema;if(o&&i&&s&&e.core){let n=o.map(t=>[t,t.tester(s,i,{rootSchema:resolveSubSchemasRecursive(i,e.core.schema),config:e.config})]).sort((e,t)=>t[1]-e[1]),a=n&&n.length>0?n[0]:void 0;r=a&&-1!==a[1]?a[0].renderer(e,t):S()}return r}export function getCombinatorInfos(e,o){return e.map(e=>{let i,n,s,a=findSchemaTitleAndDescription(e,o);if(e.$ref&&(e=l.schema(e,"",o)),Array.isArray(e.allOf)&&(e=l.schema(e,"allOf",o)),r(e).every(e=>"object"===e)){let r=getSchemaObjectProperties(e).find(([e,t])=>void 0!==getSchemaConst(t));r?(i=r[0],n=getSchemaConst(r[1]),s=()=>{let e={};return e[r[0]]=getSchemaConst(r[1]),e},a[0]||(a[0]=getSchemaConst(r[1]))):s=()=>t(e,o)}else s=()=>t(e,o);return{title:a[0],description:a[1],defaultValueCreator:s,constProperty:i,constValue:n}})}export function getSchemaConst(e){if(e){if(void 0!==e.const)return e.const;if(Array.isArray(e.enum)&&1===e.enum.length)return e.enum[0]}}export function getSchemaPicker(e,t,r,o,i,n){let s=getCombinatorInfos(t[o],e),a=s.map((e,t)=>[t+"",e.title||f.t("schema.title.indexedItem",{index:t})]),c=i?f.t("schema.anyOfPickerLabel",{label:i}):f.t("type");return u`                
-        <or-mwc-input class="any-of-picker" .label="${c}" .type="${d.SELECT}" .options="${a}" @or-mwc-input-changed="${e=>{n(s[Number(e.detail.value)])}}"></or-mwc-input>
-    `}export function findSchemaTitleAndDescription(e,t){let r;if(e.$ref&&(r=getLabelFromScopeOrRef(e.$ref),e=l.schema(e,"",t)),e.title)return[e.title,e.description];if(e.allOf){let r=l.schema(e,"allOf",t).allOf.find(e=>!!e.title);if(r)return[r.title,r.description]}return[f.t("schema.title."+r,{defaultValue:p.camelCaseToSentenceCase(r)}),void 0]}function getLabelFromScopeOrRef(e){return e.substr(e.lastIndexOf("/")+1)}function getSchemaObjectProperties(e){let t=[];return e.allOf?t=e.allOf.map(e=>e.properties?Object.entries(e.properties):[]).flat():e.properties&&(t=Object.entries(e.properties)),t}export function mapStateToCombinatorRendererProps(t,r,n){let{uischema:m}=r,p=e(m,r.path),d=s(t),f=l.schema(r.schema||d,m.scope,d),u=void 0===r.visible||a(m)?c(m,i(t),r.path,o(t)):r.visible,h=r.id,b=l.data(i(t),p),v=t.jsonforms.core.ajv,S=f||d,g=l.schema(S,n,d),y=["required","additionalProperties","type","enum","const"],O=e=>!e||0===e.length||!e.find(e=>-1!==y.indexOf(e.keyword)),w=-1;for(let e=0;e<g.length;e++)try{let t=Object.assign({definitions:d.definitions},g[e]),r=v.compile(t);if(r(b),O(r.errors)){w=e;break}}catch(e){console.debug("Combinator subschema is not self contained, can't hand it over to AJV")}return{data:b,path:p,schema:S,rootSchema:d,visible:u,id:h,indexOfFittingSchema:w,uischemas:t.jsonforms.uischemas,uischema:m}}export function getLabel(e,t,r,o){if(r)return r;let i=findSchemaTitleAndDescription(e,t);return i[0]?i[0]:o?p.camelCaseToSentenceCase(getLabelFromScopeOrRef(o)):void 0}export function resolveSubSchemasRecursive(e,t,r){return e.$ref?resolveSubSchemasRecursive(l.schema(t,e.$ref,t),t):((r?[r]:["allOf","anyOf","oneOf"]).forEach(r=>{let o=e[r];o&&(e[r]=o.map(e=>resolveSubSchemasRecursive(e,t)))}),e.items&&(Array.isArray(e.items)?e.items=e.items.map(e=>resolveSubSchemasRecursive(e,t)):e.items=resolveSubSchemasRecursive(e.items,t)),e.properties&&Object.keys(e.properties).forEach(r=>e.properties[r]=resolveSubSchemasRecursive(e.properties[r],t)),e)}export const controlWithoutLabel=e=>({type:"Control",scope:e,label:!1});export const showJsonEditor=(e,t,r)=>{let o=b(),i=b();y(new g().setContent(u`
-                <or-ace-editor ${v(o)} @or-ace-editor-edit="${()=>void(i.value.disabled=!0)}" @or-ace-editor-changed="${e=>(e=>{let t=e.detail.valid;i.value.disabled=!t})(e)}" .value="${t}"></or-ace-editor>
-            `).setActions([{actionName:"cancel",content:"cancel"},{default:!0,actionName:"update",action:()=>{let e=o.value;e.validate()&&r(e.getValue()?JSON.parse(e.getValue()):void 0)},content:u`<or-mwc-input ${v(i)} disabled .type="${d.BUTTON}" label="update"></or-mwc-input>`}]).setHeading(e).setDismissAction(null).setStyles(u`
-                <style>
-                    .mdc-dialog__surface {
-                        width: 1024px;
-                        overflow-x: visible !important;
-                        overflow-y: visible !important;
-                    }
-                    #dialog-content {
-                        border-color: var(--or-app-color5, ${h(m)});
-                        border-top-width: 1px;
-                        border-top-style: solid;
-                        border-bottom-width: 1px;
-                        border-bottom-style: solid;
-                        padding: 0;
-                        overflow: visible;
-                        height: 60vh;
-                    }
-                </style>
-            `))};
+import { composeWithUi, createDefaultValue, deriveTypes, getAjv, getData, getRenderers, getSchema, hasShowRule, isVisible, Resolve, } from "@jsonforms/core";
+import { DefaultColor5, Util } from "@openremote/core";
+import { InputType } from "@openremote/or-mwc-components/or-mwc-input";
+import { i18next } from "@openremote/or-translate";
+import "@openremote/or-components/or-ace-editor";
+import { html, unsafeCSS } from "lit";
+import { createRef, ref } from 'lit/directives/ref.js';
+import { unknownTemplate } from "./standard-renderers";
+import { OrMwcDialog, showDialog } from "@openremote/or-mwc-components/or-mwc-dialog";
+export function getTemplateFromProps(state, props) {
+    if (!state || !props) {
+        return html ``;
+    }
+    const renderers = props.renderers || getRenderers({ jsonforms: Object.assign({}, state) });
+    const schema = props.schema;
+    const uischema = props.uischema;
+    let template;
+    if (renderers && schema && uischema && state.core) {
+        const orderedRenderers = renderers.map(r => [r, r.tester(uischema, schema, { rootSchema: resolveSubSchemasRecursive(schema, state.core.schema), config: state.config })]).sort((a, b) => b[1] - a[1]);
+        const renderer = orderedRenderers && orderedRenderers.length > 0 ? orderedRenderers[0] : undefined;
+        if (renderer && renderer[1] !== -1) {
+            template = renderer[0].renderer(state, props);
+        }
+        else {
+            template = unknownTemplate();
+        }
+    }
+    return template;
+}
+/**
+ * For a given anyOf schema array this will try and extract a common const property which can be used as a discriminator
+ * when creating instances
+ */
+export function getCombinatorInfos(schemas, rootSchema) {
+    return schemas.map(schema => {
+        let constProperty;
+        let constValue;
+        let creator;
+        const titleAndDescription = findSchemaTitleAndDescription(schema, rootSchema);
+        if (schema.$ref) {
+            schema = Resolve.schema(schema, '', rootSchema);
+        }
+        if (Array.isArray(schema.allOf)) {
+            schema = Resolve.schema(schema, "allOf", rootSchema);
+        }
+        if (deriveTypes(schema).every(type => type === "object")) {
+            const props = getSchemaObjectProperties(schema);
+            const constProp = props.find(([propName, propSchema]) => getSchemaConst(propSchema) !== undefined);
+            if (constProp) {
+                constProperty = constProp[0];
+                constValue = getSchemaConst(constProp[1]);
+                creator = () => {
+                    const obj = {};
+                    obj[constProp[0]] = getSchemaConst(constProp[1]);
+                    return obj;
+                };
+                if (!titleAndDescription[0]) {
+                    titleAndDescription[0] = getSchemaConst(constProp[1]);
+                }
+            }
+            else {
+                creator = () => createDefaultValue(schema, rootSchema);
+            }
+        }
+        else {
+            // Assume a primitive type that can be instantiated with default value creator
+            creator = () => createDefaultValue(schema, rootSchema);
+        }
+        return {
+            title: titleAndDescription[0],
+            description: titleAndDescription[1],
+            defaultValueCreator: creator,
+            constProperty: constProperty,
+            constValue: constValue
+        };
+    });
+}
+export function getSchemaConst(schema) {
+    if (!schema) {
+        return;
+    }
+    if (schema.const !== undefined) {
+        return schema.const;
+    }
+    if (Array.isArray(schema.enum) && schema.enum.length === 1) {
+        return schema.enum[0];
+    }
+}
+export function getSchemaPicker(rootSchema, resolvedSchema, path, keyword, label, selectedCallback) {
+    const combinatorInfos = getCombinatorInfos(resolvedSchema[keyword], rootSchema);
+    const options = combinatorInfos.map((combinatorInfo, index) => [index + "", combinatorInfo.title || i18next.t("schema.title.indexedItem", { index: index })]);
+    const pickerUpdater = (index) => {
+        const matchedInfo = combinatorInfos[index];
+        selectedCallback(matchedInfo);
+    };
+    const pickerLabel = label ? i18next.t("schema.anyOfPickerLabel", { label: label }) : i18next.t("type");
+    return html `                
+        <or-mwc-input class="any-of-picker" .label="${pickerLabel}" .type="${InputType.SELECT}" .options="${options}" @or-mwc-input-changed="${(ev) => pickerUpdater(Number(ev.detail.value))}"></or-mwc-input>
+    `;
+}
+// TODO: use i18n translations from jsonforms/core
+export function findSchemaTitleAndDescription(schema, rootSchema) {
+    let title;
+    if (schema.$ref) {
+        title = getLabelFromScopeOrRef(schema.$ref);
+        schema = Resolve.schema(schema, '', rootSchema);
+    }
+    if (schema.title) {
+        return [schema.title, schema.description];
+    }
+    if (schema.allOf) {
+        const resolvedSchema = Resolve.schema(schema, "allOf", rootSchema);
+        const titledSchema = resolvedSchema.allOf.find((allOfSchema) => {
+            return !!allOfSchema.title;
+        });
+        if (titledSchema) {
+            return [titledSchema.title, titledSchema.description];
+        }
+    }
+    return [i18next.t("schema.title." + title, { defaultValue: Util.camelCaseToSentenceCase(title) }), undefined];
+}
+function getLabelFromScopeOrRef(scopeOrRef) {
+    return scopeOrRef.substr(scopeOrRef.lastIndexOf("/") + 1);
+}
+function getSchemaObjectProperties(schema) {
+    let props = [];
+    if (schema.allOf) {
+        props = schema.allOf.map(schema => schema.properties ? Object.entries(schema.properties) : []).flat();
+    }
+    else if (schema.properties) {
+        props = Object.entries(schema.properties);
+    }
+    return props;
+}
+/**
+ * Copied from eclipse source code to inject global definitions into the validating schema otherwise AJV will fail
+ * to compile the schema - not perfect but works for our cases
+ */
+export function mapStateToCombinatorRendererProps(state, ownProps, keyword) {
+    const { uischema } = ownProps;
+    const path = composeWithUi(uischema, ownProps.path);
+    const rootSchema = getSchema(state);
+    const resolvedSchema = Resolve.schema(ownProps.schema || rootSchema, uischema.scope, rootSchema);
+    const visible = ownProps.visible === undefined || hasShowRule(uischema)
+        ? isVisible(uischema, getData(state), ownProps.path, getAjv(state))
+        : ownProps.visible;
+    const id = ownProps.id;
+    const data = Resolve.data(getData(state), path);
+    const ajv = state.jsonforms.core.ajv;
+    const schema = resolvedSchema || rootSchema;
+    const _schema = Resolve.schema(schema, keyword, rootSchema);
+    const structuralKeywords = [
+        'required',
+        'additionalProperties',
+        'type',
+        'enum',
+        'const'
+    ];
+    const dataIsValid = (errors) => {
+        return (!errors ||
+            errors.length === 0 ||
+            !errors.find(e => structuralKeywords.indexOf(e.keyword) !== -1));
+    };
+    let indexOfFittingSchema = -1;
+    // TODO instead of compiling the combinator subschemas we can compile the original schema
+    // without the combinator alternatives and then revalidate and check the errors for the
+    // element
+    for (let i = 0; i < _schema.length; i++) {
+        try {
+            const schema = Object.assign({ definitions: rootSchema.definitions }, _schema[i]);
+            const valFn = ajv.compile(schema);
+            valFn(data);
+            if (dataIsValid(valFn.errors)) {
+                indexOfFittingSchema = i;
+                break;
+            }
+        }
+        catch (error) {
+            console.debug("Combinator subschema is not self contained, can't hand it over to AJV");
+        }
+    }
+    return {
+        data,
+        path,
+        schema,
+        rootSchema,
+        visible,
+        id,
+        indexOfFittingSchema,
+        uischemas: state.jsonforms.uischemas,
+        uischema: uischema,
+    };
+}
+export function getLabel(schema, rootSchema, uiElementLabel, uiElementScope) {
+    if (uiElementLabel) {
+        return uiElementLabel;
+    }
+    const titleAndDesc = findSchemaTitleAndDescription(schema, rootSchema);
+    if (titleAndDesc[0]) {
+        return titleAndDesc[0];
+    }
+    if (uiElementScope) {
+        return Util.camelCaseToSentenceCase(getLabelFromScopeOrRef(uiElementScope));
+    }
+    return undefined;
+}
+export function resolveSubSchemasRecursive(schema, rootSchema, keyword) {
+    const combinators = keyword ? [keyword] : ["allOf", "anyOf", "oneOf"];
+    if (schema.$ref) {
+        return resolveSubSchemasRecursive(Resolve.schema(rootSchema, schema.$ref, rootSchema), rootSchema);
+    }
+    combinators.forEach((combinator) => {
+        const schemas = schema[combinator];
+        if (schemas) {
+            schema[combinator] = schemas.map(subSchema => resolveSubSchemasRecursive(subSchema, rootSchema));
+        }
+    });
+    if (schema.items) {
+        if (Array.isArray(schema.items)) {
+            schema.items = schema.items.map((itemSchema) => resolveSubSchemasRecursive(itemSchema, rootSchema));
+        }
+        else {
+            schema.items = resolveSubSchemasRecursive(schema.items, rootSchema);
+        }
+    }
+    if (schema.properties) {
+        Object.keys(schema.properties).forEach((prop) => schema.properties[prop] = resolveSubSchemasRecursive(schema.properties[prop], rootSchema));
+    }
+    return schema;
+}
+export const controlWithoutLabel = (scope) => ({
+    type: 'Control',
+    scope: scope,
+    label: false
+});
+export const showJsonEditor = (title, value, updateCallback) => {
+    const editorRef = createRef();
+    const updateBtnRef = createRef();
+    const onEditorEdit = () => {
+        // Disable update button whilst edit in progress
+        updateBtnRef.value.disabled = true;
+    };
+    const onEditorChanged = (ev) => {
+        const valid = ev.detail.valid;
+        updateBtnRef.value.disabled = !valid;
+    };
+    const dialog = showDialog(new OrMwcDialog()
+        .setContent(html `
+                <or-ace-editor ${ref(editorRef)} @or-ace-editor-edit="${() => onEditorEdit()}" @or-ace-editor-changed="${(ev) => onEditorChanged(ev)}" .value="${value}"></or-ace-editor>
+            `)
+        .setActions([
+        {
+            actionName: "cancel",
+            content: "cancel"
+        },
+        {
+            default: true,
+            actionName: "update",
+            action: () => {
+                const editor = editorRef.value;
+                if (editor.validate()) {
+                    const data = !!editor.getValue() ? JSON.parse(editor.getValue()) : undefined;
+                    updateCallback(data);
+                }
+            },
+            content: html `<or-mwc-input ${ref(updateBtnRef)} disabled .type="${InputType.BUTTON}" label="update"></or-mwc-input>`
+        }
+    ])
+        .setHeading(title)
+        .setDismissAction(null)
+        .setStyles(html `
+                <style>
+                    .mdc-dialog__surface {
+                        width: 1024px;
+                        overflow-x: visible !important;
+                        overflow-y: visible !important;
+                    }
+                    #dialog-content {
+                        border-color: var(--or-app-color5, ${unsafeCSS(DefaultColor5)});
+                        border-top-width: 1px;
+                        border-top-style: solid;
+                        border-bottom-width: 1px;
+                        border-bottom-style: solid;
+                        padding: 0;
+                        overflow: visible;
+                        height: 60vh;
+                    }
+                </style>
+            `));
+};
+//# sourceMappingURL=util.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openremote/or-json-forms",
-  "version": "1.8.0-snapshot.20250725074716",
+  "version": "1.8.0-snapshot.20250725120000",
   "description": "Renders a JSON schema and provides instance editing",
   "customElements": "custom-elements.json",
   "main": "dist/umd/index.bundle.js",
@@ -20,14 +20,14 @@
   "license": "AGPL-3.0-or-later",
   "dependencies": {
     "@jsonforms/core": "^3.5.1",
-    "@openremote/or-components": "1.8.0-snapshot.20250725074716",
-    "@openremote/or-mwc-components": "1.8.0-snapshot.20250725074716",
+    "@openremote/or-components": "1.8.0-snapshot.20250725120000",
+    "@openremote/or-mwc-components": "1.8.0-snapshot.20250725120000",
     "@polymer/polymer": "^3.3.1",
     "ajv": "^8.8.2",
     "lit": "^2.0.2"
   },
   "devDependencies": {
-    "@openremote/util": "1.8.0-snapshot.20250725074716"
+    "@openremote/util": "1.8.0-snapshot.20250725120000"
   },
   "publishConfig": {
     "access": "public"