@adia-ai/web-modules 0.8.41 → 0.8.42

package/shell/admin-sidebar/admin-sidebar.js

@@ -29,8 +29,10 @@
  *   sidebar-toggle  — bubbles. detail: { name, expanded }
  *   sidebar-resize  — bubbles. detail: { name, width }
  *
- * The drag handle is conventional: a child `[data-resize]` element.
- * Authors may provide a custom one, or omit (no resize affordance).
+ * The drag handle is conventional: a child `[data-sidebar-resize]` element
+ * (`[data-resize]` still works — deprecated, dual-read compat shim, removed
+ * in 0.9.0: docs/ops/plan/plan-090-rename-wave.md). Authors may provide a
+ * custom one, or omit (no resize affordance).
  *
  * Backwards compat: <admin-shell> still recognizes the legacy
  * `<aside data-sidebar="leading">` shape via :is() selector. New
@@ -59,6 +61,11 @@ class AdminSidebar extends UIElement {
   // handle — one-shot per element so re-renders stay quiet. GC-friendly.
   static #warnedNoHandle = new WeakSet();
 
+  // Rename-wave compat (docs/ops/plan/plan-090-rename-wave.md W1): one-shot
+  // deprecation warn per element when the legacy `[data-resize]` name is the
+  // one that resolved the handle. Same GC-friendly WeakSet pattern as above.
+  static #warnedOldResizeName = new WeakSet();
+
   // The width the sidebar had before being collapsed — used for restore.
   // Map keyed by sidebar name allows multiple sidebars on one host.
   #previousExpandedWidth = '';
@@ -166,19 +173,34 @@ class AdminSidebar extends UIElement {
   // ── Resize drag handle ──
 
   #setupResizeHandle() {
-    const handle = this.querySelector(':scope > [data-resize]');
+    // Rename-wave compat (plan-090 W1): `[data-sidebar-resize]` is the
+    // current name; `[data-resize]` still dual-reads until the 0.9.0 cut
+    // (W3), warning once per element when it's the name that resolved.
+    let handle = this.querySelector(':scope > [data-sidebar-resize]');
+    if (!handle) {
+      handle = this.querySelector(':scope > [data-resize]');
+      if (handle && !AdminSidebar.#warnedOldResizeName.has(this)) {
+        AdminSidebar.#warnedOldResizeName.add(this);
+        // eslint-disable-next-line no-console
+        console.warn(
+          '[admin-sidebar] `[data-resize]` is deprecated and removed in ' +
+          '0.9.0 — rename the drag-handle child to `[data-sidebar-resize]`.',
+          this,
+        );
+      }
+    }
     if (!handle) {
       // FEEDBACK-17: `resizable` opts in to drag-resize but relies on an
-      // author-supplied `[data-resize]` child. A silent return left authors
-      // with a no-op `resizable` attribute and zero diagnostic signal.
+      // author-supplied `[data-sidebar-resize]` child. A silent return left
+      // authors with a no-op `resizable` attribute and zero diagnostic signal.
       if (!AdminSidebar.#warnedNoHandle.has(this)) {
         AdminSidebar.#warnedNoHandle.add(this);
         // eslint-disable-next-line no-console
         console.warn(
-          '[admin-sidebar] `resizable` is set but no `[data-resize]` child ' +
-          'was found. Add `<div data-resize></div>` as a direct child to ' +
-          'enable drag-to-resize. (Unlike `collapsible`, `resizable` requires ' +
-          'this author-supplied handle.)',
+          '[admin-sidebar] `resizable` is set but no `[data-sidebar-resize]` ' +
+          'child was found. Add `<div data-sidebar-resize></div>` as a direct ' +
+          'child to enable drag-to-resize. (Unlike `collapsible`, `resizable` ' +
+          'requires this author-supplied handle.)',
           this,
         );
       }

package/shell/admin-sidebar/admin-sidebar.yaml

@@ -37,7 +37,7 @@ props:
   resizable:
     description: |
       Opts in to drag-to-resize behavior. Author supplies a child
-      [data-resize] element as the drag handle.
+      [data-sidebar-resize] element as the drag handle.
     type: boolean
     default: false
     reflect: true