@laserfiche/types-lf-ui-components - npm Package Compare versions

Comparing version 12.0.0--preview-2316486624 to 12.0.0--preview-2333574870

package.json

 {
   "name": "@laserfiche/types-lf-ui-components",
-  "version": "12.0.0--preview-2316486624",
+  "version": "12.0.0--preview-2333574870",
   "scripts": {},
@@ -5,0 +5,0 @@ "dependencies": {},

README.md

@@ -24,3 +24,3 @@ # @laserfiche/type-lf-ui-components
 # Why do we need it?
-The `laserfiche-ui-components` in CDN is essentially loosely typed JavaScript. For this reason, if an application use elements imported from CDN, it will not have any typing information about those elements. To compliment this, we provide ***@laserfiche/type-lf-ui-components***, a type NPM package that contains the declaration files for those elements.
+The `laserfiche-ui-components` in CDN is essentially loosely typed JavaScript. For this reason, if an application use elements imported from CDN, it will not have any typing information about those elements. To compliment this, we provide ***@laserfiche/types-lf-ui-components***, a type NPM package that contains the declaration files for those elements.
 
@@ -30,8 +30,12 @@ # How to use the type NPM Package for laserfiche-ui-components?
 ## With Angular Applications
-1. `npm install @laserfiche/type-lf-ui-components` (use the link from the [released versions](https://unpkg.com/@laserfiche/lf-ui-components@12.0/cdn/index.html#/release-notes) to obtain the NPM package for the desired version)
-2. Import the lf-elements from the CDN by adding this line in `./index.html` inside your application (use the url from the [released versions](https://unpkg.com/@laserfiche/lf-ui-components@12.0/cdn/index.html#/release-notes)).
+1. `npm install @laserfiche/type-lf-ui-components`
+2. Import the UI elements from the CDN by adding this line in `./index.html` inside your application
    ```html
    <script src="https://unpkg.com/@laserfiche/lf-ui-components@12.0/cdn/lf-ui-components.js" defer></script>
    ```
-3. Inside `./app.module.ts`, add `CUSTOM_ELEMENTS_SCHEMA` to @NgModule.schemas. This enables custom elements in your Angular application.
+3. Import the style sheet from the CDN by adding this line in `./index.html` inside your application 
+   ```html
+   <link href="https://unpkg.com/@laserfiche/lf-ui-components@12.0/cdn/lf-laserfiche-lite.css"  rel="stylesheet"/>
+   ```
+4. Inside `./app.module.ts`, add `CUSTOM_ELEMENTS_SCHEMA` to @NgModule.schemas. This enables custom elements in your Angular application.
    ```TypeScript
@@ -51,7 +55,7 @@ import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
    ```
-4. example usage of using `lf-cheklist` whose implementation is provided in CDN, while type information is provided in the `@laserfiche/type-laserfiche-ui-components` NPM package.
+5. example usage of using `lf-cheklist` whose implementation is provided in CDN, while type information is provided in the `@laserfiche/type-lf-ui-components` NPM package.
 
    In a html file, 
    ```html
-   <lf-checklist-element #myChecklist (checklistChanged)="onChecklistChangedAsync($event)"></lf-checklist-element>
+   <lf-checklist #myChecklist (checklistChanged)="onChecklistChangedAsync($event)"></lf-checklist>
    <!-- checklistChanged is a HTML custom event -->
@@ -63,3 +67,3 @@ ```
    // we can directly import types from the NPM package
-   import {LfChecklistComponent, Checklist} from '@laserfiche/types-laserfiche-ui-components'  
+   import {LfChecklistComponent, Checklist} from '@laserfiche/types-lf-ui-components'  
   
@@ -86,3 +90,3 @@ @Component({
         // the element's view is initialized after ngAfterViewInit
-       this.componentChecklist.initAsync(...)
+       this.componentChecklist.nativeElement.initAsync(...)
      }
@@ -89,0 +93,0 @@ }

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Number of lines in readme file

95

increased by4.4%

Worsened metrics

Total package byte prevSize

24809

decreased by-0.35%

No dependency changes