fix: delegate accordion panel theme attribute in Lit version (#8265)

packages/accordion/src/vaadin-accordion-panel-mixin.js

@@ -36,12 +36,8 @@ export const AccordionPanelMixin = (superClass) =>
       return ['__updateAriaAttributes(focusElement, _contentElements)'];
     }
 
-    static get delegateAttrs() {
-      return ['theme'];
-    }
-
     static get delegateProps() {
-      return ['disabled', 'opened'];
+      return ['disabled', 'opened', '_theme'];
     }
 
     constructor() {
@@ -69,6 +65,25 @@ export const AccordionPanelMixin = (superClass) =>
       this.addController(this._tooltipController);
     }
 
+    /**
+     * Override method from `DelegateStateMixin` to set delegate `theme`
+     * using attribute instead of property (needed for the Lit version).
+     * @protected
+     * @override
+     */
+    _delegateProperty(name, value) {
+      if (!this.stateTarget) {
+        return;
+      }
+
+      if (name === '_theme') {
+        this._delegateAttribute('theme', value);
+        return;
+      }
+
+      super._delegateProperty(name, value);
+    }
+
     /**
      * Override method inherited from `DisabledMixin`
      * to not set `aria-disabled` on the host element.

packages/accordion/test/accordion-panel.common.js

@@ -148,6 +148,16 @@ describe('vaadin-accordion-panel', () => {
         await nextUpdate(panel);
         expect(heading.hasAttribute('disabled')).to.be.false;
       });
+
+      it(`should propagate theme attribute to ${type} heading`, async () => {
+        panel.setAttribute('theme', 'filled');
+        await nextUpdate(panel);
+        expect(heading.getAttribute('theme')).to.equal('filled');
+
+        panel.removeAttribute('theme');
+        await nextUpdate(panel);
+        expect(heading.hasAttribute('theme')).to.be.false;
+      });
     });
   });