Merge branch 'main' into field-base/select

seb-oss · Jan 23, 2025 · 6baadff · 6baadff
2 parents 8cce08b + de43417
commit 6baadff
Show file tree

Hide file tree

Showing 4 changed files with 35 additions and 17 deletions.
diff --git a/libs/core/CHANGELOG.md b/libs/core/CHANGELOG.md
@@ -1,5 +1,17 @@
 # Changelog
 
+## 1.62.3
+
+### Patch Changes
+
+- c6d42ec: **Filter Chip**: Fix issue where filter chip is trying to register transitional styles for button
+
+## 1.62.2
+
+### Patch Changes
+
+- 12a3417: **Scoping:** Fix return type of `gdsCustomElement` decorator in bail-out code path
+
 ## 1.62.1
 
 ### Patch Changes

diff --git a/libs/core/package.json b/libs/core/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@sebgroup/green-core",
   "description": "A carefully crafted set of Web Components, laying the foundation of the Green Design System.",
-  "version": "1.62.1",
+  "version": "1.62.3",
   "main": "index.js",
   "module": "index.js",
   "type": "module",

diff --git a/libs/core/src/components/filter-chips/filter-chip/filter-chip.ts b/libs/core/src/components/filter-chips/filter-chip/filter-chip.ts
@@ -41,17 +41,8 @@ export class GdsFilterChip<ValueT = any> extends GdsElement {
     super.connectedCallback()
     this.setAttribute('role', 'none')
     TransitionalStyles.instance.apply(this, 'gds-filter-chip')
-
-    // Apply transitional styles to the button if connectedCallback is called directly
-    // This is here mainly for the toggle feature in Storybook to work
-    this._button.then((btn) => {
-      TransitionalStyles.instance.apply(btn, 'gds-button')
-    })
   }
 
-  @queryAsync(getScopedTagName('gds-button'))
-  private _button!: Promise<GdsButton>
-
   render() {
     const btnClasses = {
       'btn-p': !this.selected,

diff --git a/libs/core/src/utils/helpers/custom-element-scoping.ts b/libs/core/src/utils/helpers/custom-element-scoping.ts
@@ -57,7 +57,7 @@
  */
 
 import { html as litHtml } from 'lit'
-import { customElement } from 'lit/decorators.js'
+import { customElement, CustomElementDecorator } from 'lit/decorators.js'
 
 import { GdsElement } from '../../gds-element'
 
@@ -67,6 +67,16 @@ declare global {
   var __gdsElementLookupTable: { [VER_SUFFIX]: Map<string, string> } // eslint-disable-line no-var
 }
 
+type Constructor<T> = {
+  // tslint:disable-next-line:no-any
+  new (...args: any[]): T
+}
+
+/**
+ * Allow for custom element classes with private constructors
+ */
+type CustomElementClass = Omit<typeof HTMLElement, 'new'>
+
 export class ScopedElementRegistry {
   static get instance() {
     if (!globalThis.__gdsElementLookupTable?.[VER_SUFFIX])
@@ -79,18 +89,23 @@ export class ScopedElementRegistry {
   }
 }
 
-function scopedCustomElement(tagName: string) {
+function scopedCustomElement(tagName: string): CustomElementDecorator {
   const versionedTagName = tagName + VER_SUFFIX
   ScopedElementRegistry.instance.set(tagName, versionedTagName)
 
-  return function (constructor: any) {
-    constructor.prototype.gdsElementName = tagName
+  return function (
+    classOrTarget: CustomElementClass | Constructor<GdsElement>,
+    context?: ClassDecoratorContext<Constructor<GdsElement>>,
+  ) {
+    classOrTarget.prototype.gdsElementName = tagName
 
     // Bail out if the element is already registered
-    if (customElements.get(versionedTagName))
-      return (_constructor: GdsElement) => false
+    if (customElements.get(versionedTagName)) return
 
-    return customElement(versionedTagName)(constructor) as any
+    return customElement(versionedTagName)(
+      classOrTarget,
+      context as ClassDecoratorContext<Constructor<GdsElement>>,
+    )
   }
 }