Skip to content

Conversation

@sissbruecker
Copy link

@sissbruecker sissbruecker commented Oct 21, 2025

Upgrade the component to work with v25:

  • Converted components to Lit
    • Lead to some timing issues around custom tabs, handled those with a __isCustomTab marker property
  • Converted component to use functional styles. Lumo theme styles are applied automatically when the application uses the Lumo theme by using ThemeDetectionMixin.
  • Removed ThemableMixin (shadow root style injection). It's not needed by the component itself, and users should not use it as it's going to be dropped in a future version.
  • Use Web Dev Server for serving the demo
  • Updated demo to import Lumo theme
  • Removed polyfills and related rollup build

@sissbruecker sissbruecker marked this pull request as ready for review October 22, 2025 16:14
--anchor-nav-inner-padding: 0;
--anchor-nav-tabs-background: #fff;
--anchor-nav-tabs-stuck-box-shadow: 0 4px 5px -6px rgba(0, 0, 0, 0.4);
/*

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nit: some incorrect indentation in the comment.

Comment on lines -263 to -265
this.$.slot.addEventListener('slotchange', () => this._onSlotChange());
this.$.tabsSlot.addEventListener('slotchange', e => this._onTabsSlotChange(e));
this.$.headerSlot.addEventListener('slotchange', () => this._onHeaderSlotChange());

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I wonder if we should use PolylitMixin like some other add-ons do? It would allow to reduce such changes.

Comment on lines +598 to +599
const scrollElement = tabs.shadowRoot && tabs.shadowRoot.querySelector('[part="tabs"]');
const backButton = tabs.shadowRoot && tabs.shadowRoot.querySelector('[part="back-button"]');

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nit: could use tabs.shadowRoot?.querySelector('[part="tabs"]'); instead.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants