@universal-material/web 3.0.10 → 3.0.11

package/theme/theme-builder.js

@@ -0,0 +1,146 @@
+import { argbFromHex, CorePalette, TonalPalette } from '@material/material-color-utilities';
+import { CssVarBuilder } from './css-var-builder.js';
+import { neutralColors, neutralVariantColors } from './neutral-colors.js';
+function getCss(selector, content) {
+    return `${selector} {
+${content}}`;
+}
+export class ThemeBuilder {
+    constructor() {
+        this.colors = [];
+        this.commonColors = [];
+        this.partial = false;
+        this.cssClass = null;
+    }
+    static create(primaryColorHex) {
+        return new ThemeBuilder()
+            .addColorFromHex('primary', primaryColorHex);
+    }
+    static createPartial() {
+        const themeBuilder = new ThemeBuilder();
+        themeBuilder.partial = true;
+        return themeBuilder;
+    }
+    addColorFromHex(name, hex) {
+        const palette = TonalPalette.fromInt(argbFromHex(hex));
+        this.addColorFromPalette(name, palette);
+        return this;
+    }
+    addColorFromPalette(name, palette) {
+        this.colors.push({ name, lightTone: 40, darkTone: 80, tonalPalette: palette });
+        this.colors.push({ name: `on-${name}`, lightTone: 100, darkTone: 20, tonalPalette: palette });
+        this.colors.push({ name: `${name}-container`, lightTone: 90, darkTone: 30, tonalPalette: palette });
+        this.colors.push({ name: `on-${name}-container`, lightTone: 10, darkTone: 90, tonalPalette: palette });
+        this.colors.push({ name: `${name}-fixed`, fixedTone: 90, tonalPalette: palette });
+        this.colors.push({ name: `${name}-fixed-dim`, fixedTone: 800, tonalPalette: palette });
+        this.colors.push({ name: `on-${name}-fixed`, fixedTone: 10, tonalPalette: palette });
+        this.colors.push({ name: `on-${name}-fixed-variant`, fixedTone: 30, tonalPalette: palette });
+        return this;
+    }
+    addCommonColor(name, hex) {
+        this.commonColors.push({ name, tonalPalette: TonalPalette.fromInt(argbFromHex(hex)) });
+        return this;
+    }
+    setCssClass(cssClass) {
+        this.cssClass = cssClass;
+        return this;
+    }
+    ensureCssClassStartsWithDot() {
+        if (!this.cssClass || this.cssClass.startsWith('.')) {
+            return;
+        }
+        this.cssClass = `.${this.cssClass}`;
+    }
+    ensureThemeColors() {
+        const primaryColor = this.colors.find(c => c.name === 'primary');
+        const palette = CorePalette.of(primaryColor.tonalPalette.tone(40));
+        if (!this.colors.find(c => c.name === 'secondary')) {
+            this.addColorFromPalette('secondary', palette.a2);
+        }
+        if (!this.colors.find(c => c.name === 'tertiary')) {
+            this.addColorFromPalette('tertiary', palette.a3);
+        }
+        if (!this.neutralColorPalette) {
+            this.neutralColorPalette = palette.n1;
+        }
+        if (!this.neutralVariantColorPalette) {
+            this.neutralVariantColorPalette = palette.n2;
+        }
+    }
+    getNeutralVariables(dark) {
+        const builder = CssVarBuilder.create();
+        this.addColors(builder, neutralColors, this.neutralColorPalette, dark);
+        builder
+            .add('--u-color-background', "var(--u-color-surface-container-highest)")
+            .add('--u-color-inverse-background', "var(--u-color-inverse-surface-container-highest)")
+            .add('--u-color-on-background', "var(--u-color-on-surface)")
+            .add('--u-color-on-inverse-background', "var(--u-color-inverse-on-surface)");
+        return builder.build();
+    }
+    getNeutralVariantVariables(dark) {
+        const builder = CssVarBuilder.create();
+        this.addColors(builder, neutralVariantColors, this.neutralColorPalette, dark);
+        return builder.build();
+    }
+    getColorVariables(color, dark) {
+        const builder = CssVarBuilder.create();
+        this.addToneColor(builder, color, color.tonalPalette, dark);
+        return builder.build();
+    }
+    getColorsVariables(dark) {
+        let variables = '';
+        for (const color of this.colors) {
+            variables += this.getColorVariables(color, dark);
+        }
+        if (this.neutralColorPalette) {
+            variables += this.getNeutralVariables(dark);
+        }
+        if (this.neutralVariantColorPalette) {
+            variables += this.getNeutralVariantVariables(dark);
+        }
+        return variables;
+    }
+    addColors(builder, colors, palette, dark) {
+        for (const color of colors) {
+            this.addToneColor(builder, color, palette, dark);
+        }
+    }
+    addToneColor(builder, color, palette, dark) {
+        if (color.fixedTone !== undefined) {
+            builder.addFromArgb(color.name, palette.tone(color.fixedTone));
+            return;
+        }
+        const tone = dark
+            ? color.darkTone
+            : color.lightTone;
+        const inverseTone = dark
+            ? color.lightTone
+            : color.darkTone;
+        builder
+            .addFromArgb(color.name, palette.tone(tone))
+            .addFromArgb(`inverse-${color.name}`, palette.tone(inverseTone));
+        if (dark) {
+            return;
+        }
+        builder
+            .addFromArgb(`light-${color.name}`, palette.tone(color.lightTone))
+            .addFromArgb(`dark-${color.name}`, palette.tone(color.darkTone));
+    }
+    build() {
+        this.ensureCssClassStartsWithDot();
+        const lightCssClass = this.cssClass ?? ':root';
+        const darkCssClass = this.cssClass
+            ? `${this.cssClass}.u-dark-mode,
+${this.cssClass} .u-dark-mode`
+            : '.u-dark-mode';
+        if (!this.partial) {
+            this.ensureThemeColors();
+        }
+        const variables = `${getCss(lightCssClass, `${this.getColorsVariables(false)}`)}
+
+${getCss(darkCssClass, this.getColorsVariables(true))}
+`;
+        return variables;
+    }
+}
+//# sourceMappingURL=theme-builder.js.map

package/theme/theme-builder.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme-builder.js","sourceRoot":"","sources":["../../src/theme/theme-builder.ts"],"names":[],"mappings":"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","sourcesContent":["import { argbFromHex, CorePalette, TonalPalette } from '@material/material-color-utilities';\n\nimport { Color } from './color.js';\nimport { CssVarBuilder } from './css-var-builder.js';\nimport { neutralColors, neutralVariantColors } from './neutral-colors.js';\nimport { ThemeColor } from './theme-color.js';\n\nfunction getCss(selector: string, content: string): string {\n  return `${selector} {\n${content}}`;\n}\n\nexport class ThemeBuilder {\n  cssClass: string | null;\n  colors: ThemeColor[] = [];\n  commonColors: ThemeColor[] = [];\n  neutralColorPalette!: TonalPalette;\n  neutralVariantColorPalette!: TonalPalette;\n\n  private partial = false;\n\n  private constructor() {\n    this.cssClass = null;\n  }\n\n  static create(primaryColorHex: string): ThemeBuilder {\n    return new ThemeBuilder()\n      .addColorFromHex('primary', primaryColorHex);\n  }\n\n  static createPartial(): ThemeBuilder {\n    const themeBuilder = new ThemeBuilder();\n    themeBuilder.partial = true;\n\n    return themeBuilder;\n  }\n\n  addColorFromHex(name: string, hex: string): ThemeBuilder {\n    const palette = TonalPalette.fromInt(argbFromHex(hex));\n\n    this.addColorFromPalette(name, palette);\n    return this;\n  }\n\n  addColorFromPalette(name: string, palette: TonalPalette): ThemeBuilder {\n    this.colors.push({name, lightTone: 40, darkTone: 80, tonalPalette: palette});\n    this.colors.push({name: `on-${name}`, lightTone: 100, darkTone: 20, tonalPalette: palette});\n    this.colors.push({name: `${name}-container`, lightTone: 90, darkTone: 30, tonalPalette: palette});\n    this.colors.push({name: `on-${name}-container`, lightTone: 10, darkTone: 90, tonalPalette: palette});\n\n    this.colors.push({name: `${name}-fixed`, fixedTone: 90, tonalPalette: palette});\n    this.colors.push({name: `${name}-fixed-dim`, fixedTone: 800, tonalPalette: palette});\n    this.colors.push({name: `on-${name}-fixed`, fixedTone: 10, tonalPalette: palette});\n    this.colors.push({name: `on-${name}-fixed-variant`, fixedTone: 30, tonalPalette: palette});\n    return this;\n  }\n\n  addCommonColor(name: string, hex: string): ThemeBuilder {\n    this.commonColors.push({name, tonalPalette: TonalPalette.fromInt(argbFromHex(hex))})\n    return this;\n  }\n\n  setCssClass(cssClass: string): ThemeBuilder {\n    this.cssClass = cssClass;\n    return this;\n  }\n\n  private ensureCssClassStartsWithDot(): void {\n    if (!this.cssClass || this.cssClass.startsWith('.')) {\n      return;\n    }\n\n    this.cssClass = `.${this.cssClass}`;\n  }\n\n  private ensureThemeColors(): void {\n\n    const primaryColor = this.colors.find(c => c.name === 'primary')!;\n\n    const palette = CorePalette.of(primaryColor.tonalPalette.tone(40));\n\n    if (!this.colors.find(c => c.name === 'secondary')) {\n      this.addColorFromPalette('secondary', palette.a2);\n    }\n\n    if (!this.colors.find(c => c.name === 'tertiary')) {\n      this.addColorFromPalette('tertiary', palette.a3);\n    }\n\n    if (!this.neutralColorPalette) {\n      this.neutralColorPalette = palette.n1;\n    }\n\n    if (!this.neutralVariantColorPalette) {\n      this.neutralVariantColorPalette = palette.n2;\n    }\n  }\n\n  private getNeutralVariables(dark: boolean): string {\n    const builder = CssVarBuilder.create();\n\n    this.addColors(builder, neutralColors, this.neutralColorPalette, dark);\n\n    builder\n      .add('--u-color-background', \"var(--u-color-surface-container-highest)\")\n      .add('--u-color-inverse-background', \"var(--u-color-inverse-surface-container-highest)\")\n      .add('--u-color-on-background', \"var(--u-color-on-surface)\")\n      .add('--u-color-on-inverse-background', \"var(--u-color-inverse-on-surface)\");\n\n    return builder.build();\n  }\n\n  private getNeutralVariantVariables(dark: boolean): string {\n    const builder = CssVarBuilder.create();\n\n    this.addColors(builder, neutralVariantColors, this.neutralColorPalette, dark);\n\n    return builder.build()\n  }\n\n  getColorVariables(color: ThemeColor, dark: boolean): string {\n\n    const builder = CssVarBuilder.create();\n\n    this.addToneColor(builder, color, color.tonalPalette, dark)\n\n    return builder.build();\n  }\n\n  private getColorsVariables(dark: boolean): string {\n    let variables = '';\n\n    for (const color of this.colors) {\n      variables += this.getColorVariables(color, dark);\n    }\n\n    if (this.neutralColorPalette) {\n      variables += this.getNeutralVariables(dark);\n    }\n\n    if (this.neutralVariantColorPalette) {\n      variables += this.getNeutralVariantVariables(dark);\n    }\n\n    return variables;\n  }\n\n  private addColors(builder: CssVarBuilder, colors: Color[], palette: TonalPalette, dark: boolean): void {\n    for (const color of colors) {\n      this.addToneColor(builder, color, palette, dark);\n    }\n  }\n\n  private addToneColor(builder: CssVarBuilder, color: Color, palette: TonalPalette, dark: boolean): void {\n    if (color.fixedTone !== undefined) {\n      builder.addFromArgb(color.name, palette.tone(color.fixedTone));\n      return;\n    }\n\n    const tone = dark\n      ? color.darkTone!\n      : color.lightTone!;\n\n    const inverseTone = dark\n      ? color.lightTone!\n      : color.darkTone!;\n\n    builder\n      .addFromArgb(color.name, palette.tone(tone))\n      .addFromArgb(`inverse-${color.name}`, palette.tone(inverseTone));\n\n    if (dark) {\n      return;\n    }\n\n    builder\n      .addFromArgb(`light-${color.name}`, palette.tone(color.lightTone!))\n      .addFromArgb(`dark-${color.name}`, palette.tone(color.darkTone!));\n  }\n\n  build(): string {\n\n    this.ensureCssClassStartsWithDot();\n\n    const lightCssClass = this.cssClass ?? ':root';\n    const darkCssClass = this.cssClass\n      ? `${this.cssClass}.u-dark-mode,\n${this.cssClass} .u-dark-mode`\n      : '.u-dark-mode';\n\n    if (!this.partial) {\n      this.ensureThemeColors();\n    }\n\n    const variables = `${getCss(lightCssClass, `${this.getColorsVariables(false)}`)}\n\n${getCss(darkCssClass, this.getColorsVariables(true))}\n`;\n    return variables;\n  }\n}\n"]}

package/{src/theme/theme-color.ts → theme/theme-color.d.ts}

@@ -1,7 +1,6 @@
 import { TonalPalette } from '@material/material-color-utilities';
-
 import { Color } from './color.js';
-
 export interface ThemeColor extends Color {
-  tonalPalette: TonalPalette;
+    tonalPalette: TonalPalette;
 }
+//# sourceMappingURL=theme-color.d.ts.map

package/theme/theme-color.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme-color.d.ts","sourceRoot":"","sources":["../../src/theme/theme-color.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,oCAAoC,CAAC;AAElE,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AAEnC,MAAM,WAAW,UAAW,SAAQ,KAAK;IACvC,YAAY,EAAE,YAAY,CAAC;CAC5B"}

package/theme/theme-color.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=theme-color.js.map

package/theme/theme-color.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme-color.js","sourceRoot":"","sources":["../../src/theme/theme-color.ts"],"names":[],"mappings":"","sourcesContent":["import { TonalPalette } from '@material/material-color-utilities';\n\nimport { Color } from './color.js';\n\nexport interface ThemeColor extends Color {\n  tonalPalette: TonalPalette;\n}\n"]}

package/.editorconfig

@@ -1,8 +0,0 @@
-root = true
-
-[*]
-charset = utf-8
-end_of_line = lf
-insert_final_newline = true
-indent_size = 2
-indent_style = space

package/.eleventy.cjs

@@ -1,21 +0,0 @@
-const syntaxHighlight = require('@11ty/eleventy-plugin-syntaxhighlight');
-
-module.exports = function (eleventyConfig) {
-  eleventyConfig.addPlugin(syntaxHighlight);
-  eleventyConfig.addPassthroughCopy('docs-src/docs.css');
-  eleventyConfig.addPassthroughCopy('docs-src/.nojekyll');
-  eleventyConfig.addPassthroughCopy(
-    'node_modules/@webcomponents/webcomponentsjs'
-  );
-  eleventyConfig.addPassthroughCopy('node_modules/lit/polyfill-support.js');
-  return {
-    dir: {
-      input: 'docs-src',
-      output: 'docs',
-    },
-    templateExtensionAliases: {
-      '11ty.cjs': '11ty.js',
-      '11tydata.cjs': '11tydata.js',
-    },
-  };
-};

package/.eslintignore

@@ -1,6 +0,0 @@
-node_modules/*
-docs/*
-docs-src/*
-rollup-config.js
-custom-elements.json
-web-dev-server.config.js

package/.eslintrc.json

@@ -1,98 +0,0 @@
-{
-  "root": true,
-  "extends": [
-    "eslint:recommended",
-    "plugin:@typescript-eslint/eslint-recommended",
-    "plugin:@typescript-eslint/recommended"
-  ],
-  "parser": "@typescript-eslint/parser",
-  "parserOptions": {
-    "ecmaVersion": 2020,
-    "sourceType": "module"
-  },
-  "plugins": [
-    "@typescript-eslint",
-    "eslint-plugin-import",
-    "eslint-plugin-import-helpers",
-    "unused-imports"
-  ],
-  "env": {
-    "browser": true
-  },
-  "rules": {
-    "no-prototype-builtins": "off",
-    "@typescript-eslint/ban-types": "off",
-    "@typescript-eslint/explicit-function-return-type": "off",
-    "@typescript-eslint/explicit-module-boundary-types": "off",
-    "@typescript-eslint/no-explicit-any": "error",
-    "@typescript-eslint/no-empty-function": "off",
-    "@typescript-eslint/no-non-null-assertion": "off",
-    "@typescript-eslint/no-unused-vars": [
-      "error",
-      {
-        "argsIgnorePattern": "^_"
-      }
-    ],
-    "eol-last": "error",
-    "import-helpers/order-imports": [
-      "error",
-      {
-        "alphabetize": {
-          "order": "asc",
-          "ignoreCase": true
-        },
-        "newlinesBetween": "always",
-        "groups": [
-          "/^@angular|^rxjs/",
-          "module",
-          "/^locale/messages/",
-          [
-            "parent",
-            "sibling",
-            "index",
-            "/^(\\.|@app|@core|@admin|@document-management|@bot-management|core|shared|chatbot)/"
-          ]
-        ]
-      }
-    ],
-    "no-else-return": ["error", { "allowElseIf": false }],
-    "no-lonely-if": "error",
-    "no-multi-spaces": ["error"],
-    "no-multiple-empty-lines": ["error", {"max": 1, "maxEOF":  1}],
-    "padding-line-between-statements": [
-      "error",
-      { "blankLine": "always", "prev": "block-like", "next": "*"},
-      { "blankLine": "always", "prev": "*", "next": "block-like"}
-    ],
-    "space-before-blocks": ["error", "always"],
-    "space-in-parens": ["error", "never"],
-    "space-before-function-paren": [
-      "error",
-      {
-        "anonymous": "never",
-        "asyncArrow": "always",
-        "named": "never"
-      }
-    ],
-    "unused-imports/no-unused-imports": "error"
-  },
-  "overrides": [
-    {
-      "files": ["rollup.config.js", "web-test-runner.config.js"],
-      "env": {
-        "node": true
-      }
-    },
-    {
-      "files": [
-        "*_test.ts",
-        "**/custom_typings/*.ts",
-        "packages/labs/ssr/src/test/integration/tests/**",
-        "packages/labs/ssr/src/lib/util/parse5-utils.ts"
-      ],
-      "rules": {
-        "@typescript-eslint/no-explicit-any": "off"
-      }
-    }
-  ]
-}

package/.prettierrc.json

@@ -1,7 +0,0 @@
-{
-  "trailingComma": "es5",
-  "tabWidth": 2,
-  "singleQuote": true,
-  "bracketSpacing": false,
-  "arrowParens": "always"
-}

package/.vscode/extensions.json

@@ -1,9 +0,0 @@
-{
-  // See https://go.microsoft.com/fwlink/?LinkId=827846 to learn about workspace recommendations.
-  // Extension identifier format: ${publisher}.${name}. Example: vscode.csharp
-
-  // List of extensions which should be recommended for users of this workspace.
-  "recommendations": ["runem.lit-plugin"],
-  // List of extensions recommended by VS Code that should not be recommended for users of this workspace.
-  "unwantedRecommendations": []
-}

package/CHANGELOG.md

@@ -1,98 +0,0 @@
-# @lit/lit-starter-ts
-
-## 2.0.1
-
-### Patch Changes
-
-- [#4451](https://github.com/lit/lit/pull/4451) [`7852e130`](https://github.com/lit/lit/commit/7852e13022c9dcfcff5ed54a215c93420349e318) - Minor security fixes.
-
-## 2.0.0
-
-### Major Changes
-
-- [#4141](https://github.com/lit/lit/pull/4141) [`6b515e43`](https://github.com/lit/lit/commit/6b515e43c3a24cc8a593247d3aa72d81bcc724d5) - Update TypeScript to ~5.2.0
-
-- [#3756](https://github.com/lit/lit/pull/3756) [`f06f7972`](https://github.com/lit/lit/commit/f06f7972a027d2937fe2c68ab5af0274dec57cf4) - Drop IE11 support
-
-### Patch Changes
-
-- [#3814](https://github.com/lit/lit/pull/3814) [`23326c6b`](https://github.com/lit/lit/commit/23326c6b9a6abdf01998dadf5d0f20a643e457aa) - Update to TypeScript v5.0
-
-- Updated dependencies [[`dfd747cf`](https://github.com/lit/lit/commit/dfd747cf4f7239e0c3bb7134f8acb967d0157654), [`6b515e43`](https://github.com/lit/lit/commit/6b515e43c3a24cc8a593247d3aa72d81bcc724d5), [`23c404fd`](https://github.com/lit/lit/commit/23c404fdec0cd7be834221b6ddf9b659c24ca8a2), [`1040f758`](https://github.com/lit/lit/commit/1040f75861b029527538b4ec36b2cfedcc32988a), [`0f6878dc`](https://github.com/lit/lit/commit/0f6878dc45fd95bbeb8750f277349c1392e2b3ad), [`1db01376`](https://github.com/lit/lit/commit/1db0137699b35d7e7bfac9b2ab274af4100fd7cf), [`2a01471a`](https://github.com/lit/lit/commit/2a01471a5f65fe34bad11e1099281811b8d0f79b), [`6f2833fd`](https://github.com/lit/lit/commit/6f2833fd05f2ecde5386f72d291dafc9dbae0cf7), [`c3e473b4`](https://github.com/lit/lit/commit/c3e473b499ff029b5e1aff01ca8799daf1ca1bbe), [`2eba6997`](https://github.com/lit/lit/commit/2eba69974c9e130e7483f44f9daca308345497d5), [`92cedaa2`](https://github.com/lit/lit/commit/92cedaa2c8cd8a306be3fe25d52e0e47bb044020), [`d27a77ec`](https://github.com/lit/lit/commit/d27a77ec3d3999e872df9218a2b07f90f22eb417), [`7e8491d4`](https://github.com/lit/lit/commit/7e8491d4ed9f0c39d974616c4678552ef50b81df), [`6470807f`](https://github.com/lit/lit/commit/6470807f3a0981f9d418cb26f05969912455d148), [`23326c6b`](https://github.com/lit/lit/commit/23326c6b9a6abdf01998dadf5d0f20a643e457aa), [`09949234`](https://github.com/lit/lit/commit/09949234445388d51bfb4ee24ff28a4c9f82fe17), [`f06f7972`](https://github.com/lit/lit/commit/f06f7972a027d2937fe2c68ab5af0274dec57cf4)]:
-  - lit@3.0.0
-
-## 2.0.0-pre.1
-
-### Major Changes
-
-- [#4141](https://github.com/lit/lit/pull/4141) [`6b515e43`](https://github.com/lit/lit/commit/6b515e43c3a24cc8a593247d3aa72d81bcc724d5) - Update TypeScript to ~5.2.0
-
-### Patch Changes
-
-- Updated dependencies [[`6b515e43`](https://github.com/lit/lit/commit/6b515e43c3a24cc8a593247d3aa72d81bcc724d5), [`0f6878dc`](https://github.com/lit/lit/commit/0f6878dc45fd95bbeb8750f277349c1392e2b3ad), [`2a01471a`](https://github.com/lit/lit/commit/2a01471a5f65fe34bad11e1099281811b8d0f79b), [`2eba6997`](https://github.com/lit/lit/commit/2eba69974c9e130e7483f44f9daca308345497d5), [`d27a77ec`](https://github.com/lit/lit/commit/d27a77ec3d3999e872df9218a2b07f90f22eb417), [`6470807f`](https://github.com/lit/lit/commit/6470807f3a0981f9d418cb26f05969912455d148), [`09949234`](https://github.com/lit/lit/commit/09949234445388d51bfb4ee24ff28a4c9f82fe17)]:
-  - lit@3.0.0-pre.1
-
-## 2.0.0-pre.0
-
-### Major Changes
-
-- [#3756](https://github.com/lit/lit/pull/3756) [`f06f7972`](https://github.com/lit/lit/commit/f06f7972a027d2937fe2c68ab5af0274dec57cf4) - Drop IE11 support
-
-### Patch Changes
-
-- [#3814](https://github.com/lit/lit/pull/3814) [`23326c6b`](https://github.com/lit/lit/commit/23326c6b9a6abdf01998dadf5d0f20a643e457aa) - Update to TypeScript v5.0
-
-- Updated dependencies [[`dfd747cf`](https://github.com/lit/lit/commit/dfd747cf4f7239e0c3bb7134f8acb967d0157654), [`23c404fd`](https://github.com/lit/lit/commit/23c404fdec0cd7be834221b6ddf9b659c24ca8a2), [`1db01376`](https://github.com/lit/lit/commit/1db0137699b35d7e7bfac9b2ab274af4100fd7cf), [`c3e473b4`](https://github.com/lit/lit/commit/c3e473b499ff029b5e1aff01ca8799daf1ca1bbe), [`92cedaa2`](https://github.com/lit/lit/commit/92cedaa2c8cd8a306be3fe25d52e0e47bb044020), [`23326c6b`](https://github.com/lit/lit/commit/23326c6b9a6abdf01998dadf5d0f20a643e457aa), [`f06f7972`](https://github.com/lit/lit/commit/f06f7972a027d2937fe2c68ab5af0274dec57cf4)]:
-  - lit@3.0.0-pre.0
-
-## 1.0.6
-
-### Patch Changes
-
-- [#4157](https://github.com/lit/lit/pull/4157) [`da32db2e`](https://github.com/lit/lit/commit/da32db2e67547e0f17b7132065559eba2b1d3513) Thanks [@welingtonms](https://github.com/welingtonms)! - Improve bundling and minification recommendations.
-
-## 1.0.5
-
-### Patch Changes
-
-- [#3561](https://github.com/lit/lit/pull/3561) [`e5c254e9`](https://github.com/lit/lit/commit/e5c254e96cb5d0f770ec616332e231559325c5c5) - Update dependency `@rollup/plugin-replace`
-
-## 1.0.4
-
-### Patch Changes
-
-- [#2922](https://github.com/lit/lit/pull/2922) [`da9db86a`](https://github.com/lit/lit/commit/da9db86a33cba710d439e254df2492f9f6dcbbee) - Update dependencies and remove unused dependencies
-
-## 1.0.3
-
-### Patch Changes
-
-- [#2757](https://github.com/lit/lit/pull/2757) [`55841c14`](https://github.com/lit/lit/commit/55841c14f52891357dd93680d3bc5b1da6c89c8a) - Update Rollup and Rollup plugins
-
-## 1.0.2
-
-### Patch Changes
-
-- [#2535](https://github.com/lit/lit/pull/2535) [`d1359856`](https://github.com/lit/lit/commit/d1359856698d1af381b335fb757f9282574690b0) - Update the README to indicate that issues and PRs should be filed on the main Lit repo.
-
-## 1.0.1
-
-### Patch Changes
-
-- [#2300](https://github.com/lit/lit/pull/2300) [`8b9dcb4d`](https://github.com/lit/lit/commit/8b9dcb4d10e4161083146ae40d0b12174a63d31d) - Fix starter kits so `npm run serve` serves the root directory, and add a link to the `/dev/index.html` component example from `/`.
-
-- Updated dependencies [[`fcc2b3d0`](https://github.com/lit/lit/commit/fcc2b3d0054e69e6f76588ea9f440117b6d0deed), [`49ecf623`](https://github.com/lit/lit/commit/49ecf6239033e9578184d46116e6b89676d091db), [`1d563e83`](https://github.com/lit/lit/commit/1d563e830c02a2d1a22e1e939f1ace971b1d1ae7)]:
-  - lit@2.1.0
-
-## 1.0.0
-
-### Patch Changes
-
-- [#2113](https://github.com/lit/lit/pull/2113) [`5b2f3642`](https://github.com/lit/lit/commit/5b2f3642ff91931b5b01f8bdd2ed98aba24f1047) - Dependency upgrades including TypeScript 4.4.2
-
-- [#2103](https://github.com/lit/lit/pull/2103) [`15a8356d`](https://github.com/lit/lit/commit/15a8356ddd59a1e80880a93acd21fadc9c24e14b) - Added Lit dev mode to test and serve commands, controlled via the MODE=dev or MODE=prod environment variables.
-
-- [#2117](https://github.com/lit/lit/pull/2117) [`eff2fbc7`](https://github.com/lit/lit/commit/eff2fbc7e45cfc2a7b8df21e18c84619dfbcb277) - Updated starter templates to use open-wc analyzer for generating custom-elements.json, and updated basic API docs generater included in the template to the new manifest format.
-
-- Updated dependencies [[`15a8356d`](https://github.com/lit/lit/commit/15a8356ddd59a1e80880a93acd21fadc9c24e14b), [`5fabe2b5`](https://github.com/lit/lit/commit/5fabe2b5ae4ab8fba9dc2d23a69105d32e4c0705), [`5b2f3642`](https://github.com/lit/lit/commit/5b2f3642ff91931b5b01f8bdd2ed98aba24f1047), [`5fabe2b5`](https://github.com/lit/lit/commit/5fabe2b5ae4ab8fba9dc2d23a69105d32e4c0705), [`5fabe2b5`](https://github.com/lit/lit/commit/5fabe2b5ae4ab8fba9dc2d23a69105d32e4c0705), [`0312f3e5`](https://github.com/lit/lit/commit/0312f3e533611eb3f4f9381594485a33ad003b74)]:
-  - lit@2.0.0

package/LICENSE

@@ -1,28 +0,0 @@
-BSD 3-Clause License
-
-Copyright (c) 2019 Google LLC. All rights reserved.
-
-Redistribution and use in source and binary forms, with or without
-modification, are permitted provided that the following conditions are met:
-
-1. Redistributions of source code must retain the above copyright notice, this
-   list of conditions and the following disclaimer.
-
-2. Redistributions in binary form must reproduce the above copyright notice,
-   this list of conditions and the following disclaimer in the documentation
-   and/or other materials provided with the distribution.
-
-3. Neither the name of the copyright holder nor the names of its
-   contributors may be used to endorse or promote products derived from
-   this software without specific prior written permission.
-
-THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
-AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
-IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
-DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE
-FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
-DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR
-SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER
-CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY,
-OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
-OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.

package/docs/api/index.html

@@ -1,149 +0,0 @@
-
-<!doctype html>
-
-<html lang="en">
-  <head>
-    <meta charset="utf-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title><my-element> ⌲ Docs</title>
-    <link rel="stylesheet" href="../docs.css">
-    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,600|Roboto+Mono">
-    <link href="../prism-okaidia.css" rel="stylesheet" />
-    <script src="/node_modules/@webcomponents/webcomponentsjs/webcomponents-loader.js"></script>
-    <script src="/node_modules/lit/polyfill-support.js"></script>
-    <script type="module" src="../my-element.bundled.js"></script>
-  </head>
-  <body>
-    
-<header>
-  <h1>&lt;my-element></h1>
-  <h2>A web component just for me.</h2>
-</header>
-    
-<nav>
-  <a href="../">Home</a>
-  <a href="../examples/">Examples</a>
-  <a href="">API</a>
-  <a href="../install/">Install</a>
-</nav>
-    <div id="main-wrapper">
-      <main>
-        
-     <h1>API</h1>
-     
-       <h2>&lt;my-element></h2>
-       <div>
-         An example element.
-       </div>
-       
-   <h3>Attributes</h3>
-   <table>
-     <tr>
-       <th>Name</th><th>Description</th><th>Type</th><th>Default</th>
-     </tr>
-     
-       <tr>
-         <td>name</td><td>The name to say "Hello" to.</td><td>string</td><td>'World'</td>
-       </tr>
-     
-       <tr>
-         <td>count</td><td>The number of times the button has been clicked.</td><td>number</td><td>0</td>
-       </tr>
-     
-   </table>
- 
-       
-   <h3>Properties</h3>
-   <table>
-     <tr>
-       <th>Name</th><th>Attribute</th><th>Description</th><th>Type</th><th>Default</th>
-     </tr>
-     
-       <tr>
-         <td>name</td><td>name</td><td>The name to say "Hello" to.</td><td>string</td><td>'World'</td>
-       </tr>
-     
-       <tr>
-         <td>count</td><td>count</td><td>The number of times the button has been clicked.</td><td>number</td><td>0</td>
-       </tr>
-     
-   </table>
-   
-       
-   <h3>Methods</h3>
-   <table>
-     <tr>
-       <th>Name</th><th>Parameters</th><th>Description</th><th>Return</th>
-     </tr>
-     
-       <tr>
-         <td>sayHello</td><td>
-   
-   <table>
-     <tr>
-       <th>Name</th><th>Description</th><th>Type</th>
-     </tr>
-     
-       <tr>
-         <td>name</td><td>The name to say "Hello" to</td><td>string</td>
-       </tr>
-     
-   </table>
- </td><td>Formats a greeting</td><td>string</td>
-       </tr>
-     
-   </table>
- 
-       
-   <h3>Events</h3>
-   <table>
-     <tr>
-       <th>Name</th><th>Description</th>
-     </tr>
-     
-       <tr>
-         <td>count-changed</td><td>Indicates when the count changes</td>
-       </tr>
-     
-   </table>
-     
-       
-   <h3>Slots</h3>
-   <table>
-     <tr>
-       <th>Name</th><th>Description</th>
-     </tr>
-     
-       <tr>
-         <td>(default)</td><td>This element has a slot</td>
-       </tr>
-     
-   </table>
-   
-       
-   <h3>CSS Shadow Parts</h3>
-   <table>
-     <tr>
-       <th>Name</th><th>Description</th>
-     </tr>
-     
-       <tr>
-         <td>button</td><td>The button</td>
-       </tr>
-     
-   </table>
- 
-       
-       
-   
-      </main>
-    </div>
-    
-<footer>
-  <p>
-    Made with
-    <a href="https://github.com/lit/lit-element-starter-ts">lit-starter-ts</a>
-  </p>
-</footer>
-  </body>
-</html>