refactor(elements): externalize lit instead of just lit-html (#15901)

Author: damyanpetev

angular.json

@@ -323,7 +323,7 @@
               ],
               "outputHashing": "none",
               "optimization": true,
-              "externalDependencies": ["lit-html"]
+              "externalDependencies": ["lit"]
             },
             "development": {
               "optimization": false,

package-lock.json

@@ -75,7 +75,7 @@
     "express": "^5.1.0",
     "fflate": "^0.8.1",
     "igniteui-theming": "^18.0.1",
-    "igniteui-trial-watermark": "^3.0.2",
+    "igniteui-trial-watermark": "^3.1.0",
     "lodash-es": "^4.17.21",
     "rxjs": "^7.8.2",
     "tslib": "^2.3.0",

package.json

@@ -8,7 +8,7 @@ const config = {
     minify: false, // temporary disabled due to Webpack issues https://github.com/webpack/webpack/issues/16262
     outfile: `${ROOT}/elements.js`,
     format: 'esm',
-    external: ['lit-html'],
+    external: ['lit'],
     target: 'es2022',
     metafile: true,
     treeShaking: true

projects/igniteui-angular-elements/esbuild.mjs

@@ -1,5 +1,5 @@
 import { IgxColumnComponent, IgxGridComponent, IgxHierarchicalGridComponent } from 'igniteui-angular';
-import { html } from 'lit-html';
+import { html } from 'lit';
 import { firstValueFrom, fromEvent, skip, timer } from 'rxjs';
 import { ComponentRefKey, IgcNgElement } from './custom-strategy';
 import hgridData from '../assets/data/projects-hgrid.js';

projects/igniteui-angular-elements/src/app/custom-strategy.spec.ts

@@ -1,5 +1,5 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { html } from 'lit-html';
+import { html } from 'lit';
 import { AsyncDirective, directive } from 'lit/async-directive.js';
 import { TemplateWrapperComponent } from './wrapper.component';
 

projects/igniteui-angular-elements/src/app/wrapper/wrapper.component.spec.ts

@@ -2,7 +2,7 @@ import { ChangeDetectorRef, Component, QueryList, TemplateRef, ViewChildren } fr
 import { Subject } from 'rxjs';
 import { TemplateRefWrapper } from './template-ref-wrapper';
 
-import { render, type RootPart, type TemplateResult } from 'lit-html';
+import { render, type RootPart, type TemplateResult } from 'lit';
 
 type TemplateFunction = (arg: any) => TemplateResult;
 

projects/igniteui-angular-elements/src/app/wrapper/wrapper.component.ts

@@ -71,7 +71,7 @@
     "dependencies": {
         "fflate": "^0.8.1",
         "tslib": "^2.3.0",
-        "igniteui-trial-watermark": "^3.0.2",
+        "igniteui-trial-watermark": "^3.1.0",
         "lodash-es": "^4.17.21",
         "igniteui-theming": "^18.0.1",
         "@igniteui/material-icons-extended": "^3.1.0"