@sebgroup/green-core 3.22.0 → 3.23.0

package/utils/decorators/resize-observer.d.ts

@@ -1,5 +1,15 @@
 import type { LitElement } from 'lit';
 type Handler = () => void;
+interface ResizeObserverConfig {
+    /**
+     * A selector for the elements to observe, resolved against the shadow root of the
+     * component. The matching elements are re-resolved after each render, so elements
+     * that are rendered by later updates are picked up automatically.
+     *
+     * When omitted, the host element is observed.
+     */
+    selector?: string;
+}
 /**
  * Runs when the size of the component changes.
  *
@@ -10,6 +20,15 @@ type Handler = () => void;
  *  // Do some layout calculation or something
  * }
  * ```
+ *
+ * Pass a `selector` to observe elements inside the shadow root instead of the host,
+ * for cases where the host size does not reflect the size of the observed content:
+ * ```javascript
+ * \@resizeObserver({ selector: 'thead th' })
+ * handleHeaderResize() {
+ *  // Do some layout calculation or something
+ * }
+ * ```
  */
-export declare function resizeObserver(): <ElemClass extends LitElement>(proto: ElemClass, propertyKey: string, descriptor: TypedPropertyDescriptor<Handler>) => void;
+export declare function resizeObserver({ selector }?: ResizeObserverConfig): <ElemClass extends LitElement>(proto: ElemClass, propertyKey: string, descriptor: TypedPropertyDescriptor<Handler>) => void;
 export {};

package/utils/decorators/resize-observer.js

@@ -1,8 +1,20 @@
 import "../../chunks/chunk.CAV4X6PU.js";
-function resizeObserver() {
+function resizeObserver({ selector } = {}) {
   return (proto, propertyKey, descriptor) => {
     const connectedCallback = proto.connectedCallback;
     const disconnectedCallback = proto.disconnectedCallback;
+    const { updated } = proto;
+    function observeTargets() {
+      const observer = this.__resizeObservers?.[propertyKey];
+      if (!observer)
+        return;
+      if (!selector) {
+        observer.observe(this);
+        return;
+      }
+      observer.disconnect();
+      this.shadowRoot?.querySelectorAll(selector).forEach((element) => observer.observe(element));
+    }
     proto.connectedCallback = function() {
       connectedCallback?.call(this);
       this.__resizeObservers = this.__resizeObservers || {};
@@ -13,11 +25,17 @@ function resizeObserver() {
           descriptor.value?.call(this);
         }, 20);
       });
-      this.__resizeObservers[propertyKey].observe(this);
+      observeTargets.call(this);
     };
+    if (selector) {
+      proto.updated = function(changedProperties) {
+        updated?.call(this, changedProperties);
+        observeTargets.call(this);
+      };
+    }
     proto.disconnectedCallback = function() {
       disconnectedCallback?.call(this);
-      this.__resizeObservers[propertyKey].disconnect();
+      this.__resizeObservers?.[propertyKey]?.disconnect();
     };
   };
 }

package/utils/helpers/custom-element-scoping.js

@@ -1,6 +1,6 @@
 import "../../chunks/chunk.CAV4X6PU.js";
 import { html as litHtml } from "lit";
-const VER_SUFFIX = "-d5b7b0";
+const VER_SUFFIX = "-3deb38";
 class ScopedElementRegistry {
   static get instance() {
     if (!globalThis.__gdsElementLookupTable?.[VER_SUFFIX])