Chore: Update's VS Code new UmbLitElement code snippet (#2449)
* Reworked VSCode code snippet for creating new `UmbLitElement` classes * Removed ctor Co-authored-by: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> * Marks `styles` as `readonly` Co-authored-by: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> * Removes `elementName` constant --------- Co-authored-by: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com>
This commit is contained in:
@@ -1,30 +1,30 @@
|
||||
{
|
||||
"Create Lit Component": {
|
||||
"prefix": "lit new",
|
||||
"UmbNewLitElement": {
|
||||
"prefix": "new umb element",
|
||||
"scope": "typescript",
|
||||
"body": [
|
||||
"import { UmbTextStyles } from '@umbraco-ui/backoffice/style';",
|
||||
"import { css, html } from 'lit';",
|
||||
"import { customElement } from 'lit/decorators.js';",
|
||||
"import { css, customElement, html } from '@umbraco-cms/backoffice/external/lit';",
|
||||
"import { UmbLitElement } from '@umbraco-cms/backoffice/lit-element';",
|
||||
"import { UmbTextStyles } from '@umbraco-cms/backoffice/style';",
|
||||
"",
|
||||
"@customElement('umb-${TM_FILENAME_BASE/(.*)\\..+$/$1/}')",
|
||||
"export class Umb${TM_FILENAME_BASE/(.*)\\..+$/${1:/pascalcase}/}Element extends UmbLitElement {",
|
||||
"\trender() {",
|
||||
"\t\treturn html`${0:umb-${TM_FILENAME_BASE/(.*)\\..+$/$1/}}`;",
|
||||
"export class Umb${TM_FILENAME_BASE/(.*)$/${1:/pascalcase}/}Element extends UmbLitElement {",
|
||||
"\toverride render() {",
|
||||
"\t\treturn html`$0`;",
|
||||
"\t}",
|
||||
"",
|
||||
"\tstatic styles = [UmbTextStyles, css``];",
|
||||
"\tstatic override readonly styles = [UmbTextStyles, css``];",
|
||||
"}",
|
||||
"",
|
||||
"export default Umb${TM_FILENAME_BASE/(.*)\\..+$/${1:/pascalcase}/}Element",
|
||||
"export { Umb${TM_FILENAME_BASE/(.*)$/${1:/pascalcase}/}Element as element };",
|
||||
"",
|
||||
"declare global {",
|
||||
"\tinterface HTMLElementTagNameMap {",
|
||||
"\t\t'umb-${TM_FILENAME_BASE/(.*)\\..+$/$1/}': Umb${TM_FILENAME_BASE/(.*)\\..+$/${1:/pascalcase}/}Element;",
|
||||
"\t\t'umb-${TM_FILENAME_BASE/(.*)\\..+$/$1/}': Umb${TM_FILENAME_BASE/(.*)$/${1:/pascalcase}/}Element;",
|
||||
"\t}",
|
||||
"}"
|
||||
"}",
|
||||
"",
|
||||
],
|
||||
"description": "Create a new Lit Component"
|
||||
}
|
||||
"description": "Create a new Umbraco Lit element",
|
||||
},
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user