@lit/ts-transformers - npm Package Compare versions

Comparing version 1.0.2 to 1.1.0

CHANGELOG.md

 # Changelog
 
+## 1.1.0
+
+### Minor Changes
+
+- [#2327](https://github.com/lit/lit/pull/2327) [`49ecf623`](https://github.com/lit/lit/commit/49ecf6239033e9578184d46116e6b89676d091db) - Add `queryAssignedElements` decorator for a declarative API that calls `HTMLSlotElement.assignedElements()` on a specified slot. `selector` option allows filtering returned elements with a CSS selector.
+
+### Patch Changes
+
+- [#2338](https://github.com/lit/lit/pull/2338) [`26e3fb7b`](https://github.com/lit/lit/commit/26e3fb7ba1d3ef778a9862ff73374802b4b4eb2e) - Deprecate `@queryAssignedNodes` API in preference for the new options object API which
+  mirrors the `@queryAssignedElements` API. Update the documentation for both
+  `@queryAssignedNodes` and `@queryAssignedElements` to better document the expected
+  return type annotation.
+
 ## 1.0.2
@@ -4,0 +17,0 @@

idiomatic-decorators.js

@@ -20,2 +20,3 @@ "use strict";
 const query_async_js_1 = require("./internal/decorators/query-async.js");
+const query_assigned_elements_js_1 = require("./internal/decorators/query-assigned-elements.js");
 const query_assigned_nodes_js_1 = require("./internal/decorators/query-assigned-nodes.js");
@@ -71,2 +72,3 @@ const event_options_js_1 = require("./internal/decorators/event-options.js");
             new query_async_js_1.QueryAsyncVisitor(context),
+            new query_assigned_elements_js_1.QueryAssignedElementsVisitor(context),
             new query_assigned_nodes_js_1.QueryAssignedNodesVisitor(context),
@@ -73,0 +75,0 @@ new event_options_js_1.EventOptionsVisitor(context, program),

internal/decorators/query-assigned-nodes.d.ts

@@ -7,8 +7,8 @@ /**
 import ts from 'typescript';
+import { QueryAssignedElementsVisitor } from './query-assigned-elements.js';
 import type { LitClassContext } from '../lit-class-context.js';
-import type { MemberDecoratorVisitor } from '../visitor.js';
 /**
  * Transform:
  *
- *   @queryAssignedNodes('list')
+ *   @queryAssignedNodes({slot: 'list'})
  *   listItems
@@ -23,10 +23,11 @@ *
  *   }
+ *
+ * Falls back on transforming the legacy queryAssignedNodes API.
  */
-export declare class QueryAssignedNodesVisitor implements MemberDecoratorVisitor {
-    readonly kind = "memberDecorator";
+export declare class QueryAssignedNodesVisitor extends QueryAssignedElementsVisitor {
     readonly decoratorName = "queryAssignedNodes";
-    private readonly _factory;
-    constructor({ factory }: ts.TransformationContext);
+    slottedQuery: string;
+    private readonly legacyVisitor;
+    constructor(context: ts.TransformationContext);
     visit(litClassContext: LitClassContext, property: ts.ClassElement, decorator: ts.Decorator): void;
-    private _createQueryAssignedNodesGetter;
 }

internal/decorators/query-assigned-nodes.js

@@ -13,6 +13,7 @@ "use strict";
 const typescript_1 = __importDefault(require("typescript"));
+const query_assigned_elements_js_1 = require("./query-assigned-elements.js");
 /**
  * Transform:
  *
- *   @queryAssignedNodes('list')
+ *   @queryAssignedNodes({slot: 'list'})
  *   listItems
@@ -27,21 +28,45 @@ *
  *   }
+ *
+ * Falls back on transforming the legacy queryAssignedNodes API.
  */
-class QueryAssignedNodesVisitor {
+class QueryAssignedNodesVisitor extends query_assigned_elements_js_1.QueryAssignedElementsVisitor {
+    constructor(context) {
+        super(context);
+        this.decoratorName = 'queryAssignedNodes';
+        this.slottedQuery = 'assignedNodes';
+        this.legacyVisitor = new QueryAssignedLegacyNodesVisitor(context);
+    }
+    visit(litClassContext, property, decorator) {
+        if (this.legacyVisitor.visit(litClassContext, property, decorator)) {
+            return;
+        }
+        super.visit(litClassContext, property, decorator);
+    }
+}
+exports.QueryAssignedNodesVisitor = QueryAssignedNodesVisitor;
+class QueryAssignedLegacyNodesVisitor {
     constructor({ factory }) {
-        this.kind = 'memberDecorator';
-        this.decoratorName = 'queryAssignedNodes';
         this._factory = factory;
     }
+    /**
+     * Modified `visit` to keep support for the deprecated legacy
+     * `queryAssignedNodes` decorator. Returns a boolean to notify if it was
+     * successfully applied.
+     */
     visit(litClassContext, property, decorator) {
         if (!typescript_1.default.isPropertyDeclaration(property)) {
-            return;
+            return false;
         }
         if (!typescript_1.default.isCallExpression(decorator.expression)) {
-            return;
+            return false;
         }
         if (!typescript_1.default.isIdentifier(property.name)) {
-            return;
+            return false;
         }
         const name = property.name.text;
         const [arg0, arg1, arg2] = decorator.expression.arguments;
+        if (arg0 && !typescript_1.default.isStringLiteral(arg0)) {
+            // Detection for new queryAssignedNodes API.
+            return false;
+        }
         const slotName = arg0 !== undefined && typescript_1.default.isStringLiteral(arg0) ? arg0.text : '';
@@ -51,2 +76,3 @@ const flatten = arg1?.kind === typescript_1.default.SyntaxKind.TrueKeyword;
         litClassContext.litFileContext.replaceAndMoveComments(property, this._createQueryAssignedNodesGetter(name, slotName, flatten, selector));
+        return true;
     }
@@ -83,3 +109,2 @@ _createQueryAssignedNodesGetter(name, slotName, flatten, selector) {
 }
-exports.QueryAssignedNodesVisitor = QueryAssignedNodesVisitor;
 //# sourceMappingURL=query-assigned-nodes.js.map

package.json

 {
   "name": "@lit/ts-transformers",
-  "version": "1.0.2",
+  "version": "1.1.0",
   "publishConfig": {
@@ -33,7 +33,7 @@ "access": "public"
   "devDependencies": {
-    "@lit/localize": "^0.10.4",
-    "@lit/reactive-element": "^1.0.0",
+    "@lit/localize": "^0.11.0",
+    "@lit/reactive-element": "^1.1.0",
     "@types/prettier": "^2.2.3",
-    "lit": "^2.0.0",
-    "lit-element": "^3.0.0",
+    "lit": "^2.1.0",
+    "lit-element": "^3.1.0",
     "prettier": "^2.3.2",
@@ -40,0 +40,0 @@ "rimraf": "^3.0.2",

README.md

@@ -74,12 +74,13 @@ # @lit/ts-transformers
 
-| Decorator             | Transformer behavior                                                                  |
-| --------------------- | ------------------------------------------------------------------------------------- |
-| `@customElement`      | Adds a `customElements.define` call                                                   |
-| `@property`           | Adds an entry to `static properties`, and moves initializers to the `constructor`     |
-| `@state`              | Same as `@property` with `{state: true}`                                              |
-| `@query`              | Defines a getter that calls `querySelector`                                           |
-| `@querySelectorAll`   | Defines a getter that calls `querySelectorAll`                                        |
-| `@queryAsync`         | Defines an `async` getter that awaits `updateComplete` and then calls `querySelector` |
-| `@queryAssignedNodes` | Defines a getter that calls `querySelector('slot[name=foo]').assignedNodes`           |
-| `@localized`          | Adds an `updateWhenLocaleChanges` call to the constructor                             |
+| Decorator                | Transformer behavior                                                                  |
+| ------------------------ | ------------------------------------------------------------------------------------- |
+| `@customElement`         | Adds a `customElements.define` call                                                   |
+| `@property`              | Adds an entry to `static properties`, and moves initializers to the `constructor`     |
+| `@state`                 | Same as `@property` with `{state: true}`                                              |
+| `@query`                 | Defines a getter that calls `querySelector`                                           |
+| `@querySelectorAll`      | Defines a getter that calls `querySelectorAll`                                        |
+| `@queryAsync`            | Defines an `async` getter that awaits `updateComplete` and then calls `querySelector` |
+| `@queryAssignedElements` | Defines a getter that calls `querySelector('slot[name=foo]').assignedElements`        |
+| `@queryAssignedNodes`    | Defines a getter that calls `querySelector('slot[name=foo]').assignedNodes`           |
+| `@localized`             | Adds an `updateWhenLocaleChanges` call to the constructor                             |
 
@@ -86,0 +87,0 @@ ### preserveBlankLinesTransformer

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

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

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

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

249264

increased by13.95%

Number of package files

61

increased by5.17%

Lines of code

2636

increased by13.04%

Number of lines in readme file

260

increased by0.39%

No dependency changes