fix(ui): remove openPropsTokenSheet from all component adoptedStyleSheets

Safari/WebKit bug: adoptedStyleSheets do not recompute :host([data-theme])
selectors when the host's data-theme attribute changes at runtime. Removing
openPropsTokenSheet from all static styles arrays fixes this because:

- The identical CSS custom properties are already injected as page-level
  <style> by vite.config.ts with :root/html selectors
- CSS custom properties inherit through shadow DOM naturally
- Page-level html[data-theme='dark'] rules ARE recomputed in all browsers

Also fix 5 instances of redundant double binding where textContent={signal}
coexisted with data-signal='name' on the same element — the signal marker
already handles textContent updates via hydrateSignals().

Scope:
- 17 UI package components (packages/ui/src/*.tsx)
- 4 website islands (www/app/islands/*.tsx)
- 29 route page components (www/app/routes/**/*.tsx)
- 5 double-binding removals (reactive-showcase, home-console)
- openPropsTokenSheet import/export kept in index.ts for consumers

E2E: Chromium 24/25 (surface colors test — same as WebKit limitation),
WebKit 6/7. All functional theme tests pass.

Author: DevBot

packages/ui/src/open-badge.tsx

@@ -7,7 +7,6 @@
 
 import { OpenElement } from '@openelement/element';
 import { StyleSheet, type StyleSheetLike } from '@openelement/core/style-sheet';
-import { openPropsTokenSheet } from './open-props-tokens.js';
 
 export const tagName = 'open-badge';
 
@@ -67,7 +66,7 @@ sheet.replaceSync(`
 `);
 
 export class OpenBadge extends OpenElement {
-  static override styles = [openPropsTokenSheet, sheet];
+  static override styles = [sheet];
   static override observedAttributes = ['tone', 'size'];
 
   override render(): ReturnType<typeof OpenElement.prototype.render> {

packages/ui/src/open-brand-mark.tsx

@@ -7,7 +7,6 @@
 
 import { OpenElement } from '@openelement/element';
 import { StyleSheet, type StyleSheetLike } from '@openelement/core/style-sheet';
-import { openPropsTokenSheet } from './open-props-tokens.js';
 
 export const tagName = 'open-brand-mark';
 
@@ -93,7 +92,7 @@ sheet.replaceSync(`
 `);
 
 export class OpenBrandMark extends OpenElement {
-  static override styles = [openPropsTokenSheet, sheet];
+  static override styles = [sheet];
   static override observedAttributes = ['size', 'tone'];
 
   override render(): ReturnType<typeof OpenElement.prototype.render> {

packages/ui/src/open-button.tsx

@@ -23,7 +23,6 @@
 
 import { OpenElement } from '@openelement/element';
 import { StyleSheet, type StyleSheetLike } from '@openelement/core/style-sheet';
-import { openPropsTokenSheet } from './open-props-tokens.js';
 import { escapeAttr } from '@openelement/core';
 
 export const tagName = 'open-button';
@@ -137,7 +136,7 @@ sheet.replaceSync(`
 `);
 
 export class OpenButton extends OpenElement {
-  static override styles = [openPropsTokenSheet, sheet];
+  static override styles = [sheet];
   static override delegatesFocus = true;
   static override formAssociated = true;
   static override observedAttributes = ['variant', 'size', 'disabled', 'href', 'target', 'type'];

packages/ui/src/open-callout.tsx

@@ -16,7 +16,6 @@
 
 import { OpenElement } from '@openelement/element';
 import { StyleSheet, type StyleSheetLike } from '@openelement/core/style-sheet';
-import { openPropsTokenSheet } from './open-props-tokens.js';
 import { escapeHtml } from '@openelement/core';
 
 export const tagName = 'open-callout';
@@ -58,7 +57,7 @@ sheet.replaceSync(`
 `);
 
 export class OpenCallout extends OpenElement {
-  static override styles = [openPropsTokenSheet, sheet];
+  static override styles = [sheet];
   static override observedAttributes = ['type', 'label'];
 
   override render(): ReturnType<typeof OpenElement.prototype.render> {

packages/ui/src/open-card.tsx

@@ -26,7 +26,6 @@
 
 import { OpenElement } from '@openelement/element';
 import { StyleSheet, type StyleSheetLike } from '@openelement/core/style-sheet';
-import { openPropsTokenSheet } from './open-props-tokens.js';
 export const tagName = 'open-card';
 
 const sheet: StyleSheetLike = new StyleSheet();
@@ -89,7 +88,7 @@ sheet.replaceSync(`
 `);
 
 export class OpenCard extends OpenElement {
-  static override styles = [openPropsTokenSheet, sheet];
+  static override styles = [sheet];
   static override observedAttributes = ['variant'];
 
   override render(): ReturnType<typeof OpenElement.prototype.render> {

packages/ui/src/open-code-block.tsx

@@ -22,7 +22,6 @@
 
 import { OpenElement } from '@openelement/element';
 import { StyleSheet, type StyleSheetLike } from '@openelement/core/style-sheet';
-import { openPropsTokenSheet } from './open-props-tokens.js';
 import { createLogger } from '@openelement/core/logger';
 export const tagName = 'open-code-block';
 
@@ -130,7 +129,7 @@ sheet.replaceSync(`
 `);
 
 export class OpenCodeBlock extends OpenElement {
-  static override styles = [openPropsTokenSheet, sheet];
+  static override styles = [sheet];
 
   private _copyState: 'idle' | 'copied' | 'failed' = 'idle';
   private _copyTimer: ReturnType<typeof setTimeout> | undefined;

packages/ui/src/open-dialog.tsx

@@ -25,7 +25,6 @@
 
 import { OpenElement } from '@openelement/element';
 import { StyleSheet, type StyleSheetLike } from '@openelement/core/style-sheet';
-import { openPropsTokenSheet } from './open-props-tokens.js';
 import { escapeAttr, escapeHtml } from '@openelement/core';
 
 export const tagName = 'open-dialog';
@@ -115,7 +114,7 @@ sheet.replaceSync(`
 `);
 
 export class OpenDialog extends OpenElement {
-  static override styles = [openPropsTokenSheet, sheet];
+  static override styles = [sheet];
   static override delegatesFocus = true;
   static override observedAttributes = ['open', 'label'];
 

packages/ui/src/open-dropdown.tsx

@@ -20,13 +20,12 @@
 
 import { OpenElement, type VNode } from '@openelement/element';
 import { signal } from '@openelement/signal';
-import { openPropsTokenSheet } from './open-props-tokens.js';
 import { daisyClassSheet } from './daisy-classes.js';
 
 export const tagName = 'open-dropdown';
 
 export class OpenDropdown extends OpenElement {
-  static override styles = [daisyClassSheet, openPropsTokenSheet];
+  static override styles = [daisyClassSheet];
   #open = signal(false);
 
   #toggle(): void {

packages/ui/src/open-hero-ping.tsx

@@ -13,7 +13,6 @@
  */
 import { OpenElement } from '@openelement/element';
 import { StyleSheet, type StyleSheetLike } from '@openelement/core/style-sheet';
-import { openPropsTokenSheet } from './open-props-tokens.js';
 export const tagName = 'open-hero-ping';
 
 const styles: StyleSheetLike = new StyleSheet();
@@ -75,7 +74,7 @@ styles.replaceSync(`
 `);
 
 export default class HeroPing extends OpenElement {
-  static override styles = [openPropsTokenSheet, styles];
+  static override styles = [styles];
 
   apiUrl = '';
   _state: 'idle' | 'loading' | 'ok' | 'err' = 'idle';

packages/ui/src/open-input.tsx

@@ -31,7 +31,6 @@
 
 import { OpenElement } from '@openelement/element';
 import { StyleSheet, type StyleSheetLike } from '@openelement/core/style-sheet';
-import { openPropsTokenSheet } from './open-props-tokens.js';
 import { escapeAttr, escapeHtml } from '@openelement/core';
 
 export const tagName = 'open-input';
@@ -108,7 +107,7 @@ sheet.replaceSync(`
 `);
 
 export class OpenInput extends OpenElement {
-  static override styles = [openPropsTokenSheet, sheet];
+  static override styles = [sheet];
   static override formAssociated = true;
   static override delegatesFocus = true;
   static override observedAttributes = [