Merge pull request #57 from rohankapoorcom/fix-editor-ui

Restore editor UI

elements/formfield.js

@@ -0,0 +1,10 @@
+import { FormfieldBase } from '@material/mwc-formfield/mwc-formfield-base.js';
+import { styles as formfieldStyles } from '@material/mwc-formfield/mwc-formfield.css.js';
+
+export const formfieldDefinition = {
+  'mwc-formfield': class extends FormfieldBase {
+    static get styles() {
+      return formfieldStyles;
+    }
+  },
+};

elements/ignore/switch.js

@@ -0,0 +1 @@
+export const ignoreSwitchFiles = ['@material/mwc-ripple/mwc-ripple.js'];

elements/ignore/textfield.js

@@ -0,0 +1 @@
+export const ignoreTextfieldFiles = ['@material/mwc-notched-outline/mwc-notched-outline.js'];

elements/switch.js

@@ -0,0 +1,17 @@
+import { SwitchBase } from '@material/mwc-switch/deprecated/mwc-switch-base.js';
+import { RippleBase } from '@material/mwc-ripple/mwc-ripple-base.js';
+import { styles as switchStyles } from '@material/mwc-switch/deprecated/mwc-switch.css';
+import { styles as rippleStyles } from '@material/mwc-ripple/mwc-ripple.css';
+
+export const switchDefinition = {
+  'mwc-switch': class extends SwitchBase {
+    static get styles() {
+      return switchStyles;
+    }
+  },
+  'mwc-ripple': class extends RippleBase {
+    static get styles() {
+      return rippleStyles;
+    }
+  },
+};

elements/textfield.js

@@ -0,0 +1,18 @@
+import { TextFieldBase } from '@material/mwc-textfield/mwc-textfield-base.js';
+import { NotchedOutlineBase } from '@material/mwc-notched-outline/mwc-notched-outline-base.js';
+
+import { styles as textfieldStyles } from '@material/mwc-textfield/mwc-textfield.css';
+import { styles as notchedOutlineStyles } from '@material/mwc-notched-outline/mwc-notched-outline.css';
+
+export const textfieldDefinition = {
+  'mwc-textfield': class extends TextFieldBase {
+    static get styles() {
+      return textfieldStyles;
+    }
+  },
+  'mwc-notched-outline': class extends NotchedOutlineBase {
+    static get styles() {
+      return notchedOutlineStyles;
+    }
+  },
+};

package.json

@@ -18,11 +18,17 @@
   "license": "MIT",
   "dependencies": {
     "@ctrl/tinycolor": "^3.4.0",
+    "@lit-labs/scoped-registry-mixin": "^1.0.1",
+    "@material/mwc-formfield": "^0.27.0",
+    "@material/mwc-list": "^0.27.0",
+    "@material/mwc-notched-outline": "^0.27.0",
+    "@material/mwc-switch": "^0.27.0",
+    "@material/mwc-textarea": "^0.27.0",
+    "@material/mwc-textfield": "^0.27.0",
     "custom-card-helpers": "^1.6.6",
     "fast-copy": "^2.1.1",
     "home-assistant-js-websocket": "^4.5.0",
-    "lit-element": "^2.4.0",
-    "lit-html": "^1.3.0"
+    "lit": "^2.8.0"
   },
   "devDependencies": {
     "@babel/core": "^7.12.3",

rollup-plugins/ignore.js

@@ -0,0 +1,24 @@
+export default function (userOptions = {}) {
+  // Files need to be absolute paths.
+  // This only works if the file has no exports
+  // and only is imported for its side effects
+  const files = userOptions.files || [];
+
+  if (files.length === 0) {
+    return {
+      name: 'ignore',
+    };
+  }
+
+  return {
+    name: 'ignore',
+
+    load(id) {
+      return files.some((toIgnorePath) => id.startsWith(toIgnorePath))
+        ? {
+            code: '',
+          }
+        : null;
+    },
+  };
+}

rollup-plugins/ignoreWrapper.js

@@ -0,0 +1,12 @@
+import ignore from "./ignore";
+import { ignoreSwitchFiles } from '../elements/ignore/switch';
+import { ignoreTextfieldFiles } from '../elements/ignore/textfield'
+
+export default function ignoreWrapper() {
+    return ignore({
+        files: [
+          ...ignoreSwitchFiles,
+          ...ignoreTextfieldFiles,
+        ].map((file) => require.resolve(file)),
+      })
+}

rollup.config.dev.js

@@ -3,6 +3,7 @@ import typescript from "rollup-plugin-typescript2";
 import babel from "rollup-plugin-babel";
 import serve from "rollup-plugin-serve";
 import { terser } from "rollup-plugin-terser";
+import ignoreWrapper  from './rollup-plugins/ignoreWrapper';
 import json from '@rollup/plugin-json';
 
 export default {
@@ -28,5 +29,6 @@ export default {
         "Access-Control-Allow-Origin": "*",
       },
     }),
+    ignoreWrapper()
   ],
 };

rollup.config.js

@@ -3,6 +3,7 @@ import commonjs from 'rollup-plugin-commonjs';
 import nodeResolve from 'rollup-plugin-node-resolve';
 import babel from 'rollup-plugin-babel';
 import { terser } from 'rollup-plugin-terser';
+import ignoreWrapper from './rollup-plugins/ignoreWrapper';
 import serve from 'rollup-plugin-serve';
 import json from '@rollup/plugin-json';
 
@@ -28,6 +29,7 @@ const plugins = [
   }),
   dev && serve(serveopts),
   !dev && terser(),
+  ignoreWrapper()
 ];
 
 export default [