Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update Editor for new Scoped Registry #50

Merged
merged 12 commits into from
Feb 23, 2022
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 10 additions & 0 deletions elements/formfield.js
Original file line number Diff line number Diff line change
@@ -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;
}
},
};
8 changes: 8 additions & 0 deletions elements/ignore/select.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
export const ignoreSelectFiles = [
'@material/mwc-ripple/mwc-ripple.js',
'@material/mwc-menu/mwc-menu.js',
'@material/mwc-menu/mwc-menu-surface.js',
'@material/mwc-list/mwc-list.js',
'@material/mwc-list/mwc-list-item.js',
'@material/mwc-icon/mwc-icon.js',
];
1 change: 1 addition & 0 deletions elements/ignore/switch.js
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
export const ignoreSwitchFiles = ['@material/mwc-ripple/mwc-ripple.js'];
1 change: 1 addition & 0 deletions elements/ignore/textfield.js
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
export const ignoreTextfieldFiles = ['@material/mwc-notched-outline/mwc-notched-outline.js'];
53 changes: 53 additions & 0 deletions elements/select.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
import { SelectBase } from '@material/mwc-select/mwc-select-base.js';
import { ListBase } from '@material/mwc-list/mwc-list-base.js';
import { ListItemBase } from '@material/mwc-list/mwc-list-item-base.js';
import { MenuBase } from '@material/mwc-menu/mwc-menu-base.js';
import { MenuSurfaceBase } from '@material/mwc-menu/mwc-menu-surface-base.js';
import { RippleBase } from '@material/mwc-ripple/mwc-ripple-base.js';
import { NotchedOutlineBase } from '@material/mwc-notched-outline/mwc-notched-outline-base.js';

import { styles as selectStyles } from '@material/mwc-select/mwc-select.css';
import { styles as listStyles } from '@material/mwc-list/mwc-list.css';
import { styles as listItemStyles } from '@material/mwc-list//mwc-list-item.css';
import { styles as rippleStyles } from '@material/mwc-ripple/mwc-ripple.css';
import { styles as menuStyles } from '@material/mwc-menu/mwc-menu.css';
import { styles as menuSurfaceStyles } from '@material/mwc-menu/mwc-menu-surface.css';
import { styles as notchedOutlineStyles } from '@material/mwc-notched-outline/mwc-notched-outline.css';

export const selectDefinition = {
'mwc-select': class extends SelectBase {
static get styles() {
return selectStyles;
}
},
'mwc-list': class extends ListBase {
static get styles() {
return listStyles;
}
},
'mwc-list-item': class extends ListItemBase {
static get styles() {
return listItemStyles;
}
},
'mwc-ripple': class extends RippleBase {
static get styles() {
return rippleStyles;
}
},
'mwc-menu': class extends MenuBase {
static get styles() {
return menuStyles;
}
},
'mwc-menu-surface': class extends MenuSurfaceBase {
static get styles() {
return menuSurfaceStyles;
}
},
'mwc-notched-outline': class extends NotchedOutlineBase {
static get styles() {
return notchedOutlineStyles;
}
},
};
17 changes: 17 additions & 0 deletions elements/switch.js
Original file line number Diff line number Diff line change
@@ -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;
}
},
};
18 changes: 18 additions & 0 deletions elements/textfield.js
Original file line number Diff line number Diff line change
@@ -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;
}
},
};
18 changes: 16 additions & 2 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -15,9 +15,18 @@
"author": "Ian Richardson <[email protected]>",
"license": "MIT",
"dependencies": {
"@lit-labs/scoped-registry-mixin": "^1.0.0",
"@material/mwc-formfield": "^0.25.3",
"@material/mwc-list": "^0.25.3",
"@material/mwc-menu": "^0.25.3",
"@material/mwc-notched-outline": "^0.25.3",
"@material/mwc-ripple": "^0.25.3",
"@material/mwc-select": "^0.25.3",
"@material/mwc-switch": "^0.25.3",
"@material/mwc-textfield": "^0.25.3",
"custom-card-helpers": "^1.7.2",
"home-assistant-js-websocket": "^5.11.1",
"lit": "^2.0.0-rc.2"
"lit": "^2.0.0"
},
"devDependencies": {
"@babel/core": "^7.15.0",
Expand All @@ -39,9 +48,14 @@
"rollup-plugin-serve": "^1.1.0",
"rollup-plugin-terser": "^7.0.2",
"rollup-plugin-typescript2": "^0.30.0",
"rollup-plugin-uglify": "^6.0.4",
"typescript": "^4.4.3"
},
"resolutions": {
"lit": "^2.1.2",
"lit-html": "2.1.2",
"lit-element": "3.1.2",
"@lit/reactive-element": "1.2.1"
},
"scripts": {
"start": "rollup -c rollup.config.dev.js --watch",
"build": "npm run lint && npm run rollup",
Expand Down
24 changes: 24 additions & 0 deletions rollup-plugins/ignore.js
Original file line number Diff line number Diff line change
@@ -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;
},
};
}
31 changes: 19 additions & 12 deletions rollup.config.dev.js
Original file line number Diff line number Diff line change
@@ -1,32 +1,39 @@
import resolve from "rollup-plugin-node-resolve";
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 resolve from 'rollup-plugin-node-resolve';
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 json from '@rollup/plugin-json';
import ignore from './rollup-plugins/ignore';
import { ignoreTextfieldFiles } from './elements/ignore/textfield';
import { ignoreSelectFiles } from './elements/ignore/select';
import { ignoreSwitchFiles } from './elements/ignore/switch';

export default {
input: ["src/boilerplate-card.ts"],
input: ['src/boilerplate-card.ts'],
output: {
dir: "./dist",
format: "es",
dir: './dist',
format: 'es',
},
plugins: [
resolve(),
typescript(),
json(),
babel({
exclude: "node_modules/**",
exclude: 'node_modules/**',
}),
terser(),
serve({
contentBase: "./dist",
host: "0.0.0.0",
contentBase: './dist',
host: '0.0.0.0',
port: 5000,
allowCrossOrigin: true,
headers: {
"Access-Control-Allow-Origin": "*",
'Access-Control-Allow-Origin': '*',
},
}),
ignore({
files: [...ignoreTextfieldFiles, ...ignoreSelectFiles, ...ignoreSwitchFiles].map((file) => require.resolve(file)),
}),
],
};
7 changes: 7 additions & 0 deletions rollup.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,10 @@ import babel from 'rollup-plugin-babel';
import { terser } from 'rollup-plugin-terser';
import serve from 'rollup-plugin-serve';
import json from '@rollup/plugin-json';
import ignore from './rollup-plugins/ignore';
import { ignoreTextfieldFiles } from './elements/ignore/textfield';
import { ignoreSelectFiles } from './elements/ignore/select';
import { ignoreSwitchFiles } from './elements/ignore/switch';

const dev = process.env.ROLLUP_WATCH;

Expand All @@ -28,6 +32,9 @@ const plugins = [
}),
dev && serve(serveopts),
!dev && terser(),
ignore({
files: [...ignoreTextfieldFiles, ...ignoreSelectFiles, ...ignoreSwitchFiles].map((file) => require.resolve(file)),
}),
];

export default [
Expand Down
4 changes: 2 additions & 2 deletions src/action-handler-directive.ts
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,7 @@ class ActionHandler extends HTMLElement implements ActionHandler {
this.appendChild(this.ripple);
this.ripple.primary = true;

['touchcancel', 'mouseout', 'mouseup', 'touchmove', 'mousewheel', 'wheel', 'scroll'].forEach(ev => {
['touchcancel', 'mouseout', 'mouseup', 'touchmove', 'mousewheel', 'wheel', 'scroll'].forEach((ev) => {
document.addEventListener(
ev,
() => {
Expand Down Expand Up @@ -192,7 +192,7 @@ export const actionHandler = directive(
return noChange;
}

// eslint-disable-next-line @typescript-eslint/no-empty-function
// eslint-disable-next-line @typescript-eslint/no-empty-function, @typescript-eslint/no-unused-vars
render(_options?: ActionHandlerOptions) {}
},
);
23 changes: 5 additions & 18 deletions src/boilerplate-card.ts
Original file line number Diff line number Diff line change
@@ -1,13 +1,6 @@
/* eslint-disable @typescript-eslint/no-explicit-any */
import {
LitElement,
html,
TemplateResult,
css,
PropertyValues,
CSSResultGroup,
} from 'lit';
import { customElement, property, state } from "lit/decorators";
import { LitElement, html, TemplateResult, css, PropertyValues, CSSResultGroup } from 'lit';
import { customElement, property, state } from 'lit/decorators';
import {
HomeAssistant,
hasConfigOrEntityChanged,
Expand All @@ -18,9 +11,6 @@ import {
getLovelace,
} from 'custom-card-helpers'; // This is a community maintained npm module with common helper functions/types. https://github.com/custom-cards/custom-card-helpers


import './editor';

import type { BoilerplateCardConfig } from './types';
import { actionHandler } from './action-handler-directive';
import { CARD_VERSION } from './const';
Expand All @@ -45,6 +35,7 @@ console.info(
@customElement('boilerplate-card')
export class BoilerplateCard extends LitElement {
public static async getConfigElement(): Promise<LovelaceCardEditor> {
await import('./editor');
return document.createElement('boilerplate-card-editor');
}

Expand Down Expand Up @@ -116,9 +107,7 @@ export class BoilerplateCard extends LitElement {
}

private _showWarning(warning: string): TemplateResult {
return html`
<hui-warning>${warning}</hui-warning>
`;
return html` <hui-warning>${warning}</hui-warning> `;
}

private _showError(error: string): TemplateResult {
Expand All @@ -129,9 +118,7 @@ export class BoilerplateCard extends LitElement {
origConfig: this.config,
});

return html`
${errorCard}
`;
return html` ${errorCard} `;
}

// https://lit.dev/docs/components/styles/
Expand Down
Loading