@ddtcorex/dsh-maestro-config 0.1.2 → 0.2.1

package/src/client/components/BrandMark.tsx

@@ -0,0 +1,22 @@
+import { createElement as h } from 'react'
+
+export function MaestroMark(props: { size?: number }) {
+  const s = props.size ?? 16
+  return h('svg', { width: s, height: s, viewBox: '0 0 16 16', fill: 'none', 'aria-hidden': 'true' } as any,
+    h('path', { d: 'M2 11 L5 4 L8 9 L11 4 L14 11', stroke: 'currentColor', strokeWidth: 1.6, strokeLinecap: 'round', strokeLinejoin: 'round' } as any)
+  )
+}
+
+export function BrandBadge(props: { size?: number; outer?: number; radius?: number }) {
+  const outer = props.outer ?? 28
+  const size = props.size ?? 16
+  const radius = props.radius ?? 8
+  return h('span', {
+    'data-maestro-logo': '',
+    style: {
+      width: outer, height: outer, borderRadius: radius, display: 'inline-flex', alignItems: 'center', justifyContent: 'center',
+      background: 'var(--dsw-alias-brand-primary, #0A84FF)', backgroundColor: '#0A84FF', color: '#fff', flex: 'none',
+      border: '1px solid rgba(0,0,0,0.08)', boxShadow: '0 0 0 1px var(--dsw-alias-border-l1)', boxSizing: 'border-box' as any,
+    },
+  } as any, h(MaestroMark as any, { size }))
+}

package/src/client/index.tsx

@@ -1,5 +1,5 @@
-// Verbatim legacy-card port (fields/styles preserved; see maestro-card.tsx).
-import { MaestroSettingsTab } from './maestro-card.jsx'
+// DSH-native redesign — reuses DSH tokens & primitive geometry maximally (see MaestroSettings.tsx).
+import { MaestroSettingsTab } from './MaestroSettings.js'
 import { MAESTRO_RPC_CHANNEL } from './api.js'
 import { registerSettingsNavIcon, SETTINGS_NAV_MARKER } from './settings-nav-icon.js'
 
@@ -13,9 +13,10 @@ import { registerSettingsNavIcon, SETTINGS_NAV_MARKER } from './settings-nav-ico
  */
 const SETTINGS_NAV_CSS = `
 
-/* maestro: replace the settings-nav fallback gear with the Maestro M-logo glyph */
-[${SETTINGS_NAV_MARKER}] > svg:first-child {
-  display: none;
+/* maestro: replace the settings-nav fallback gear with the Maestro M-logo glyph — same mark as sidebar/popup BrandMark */
+[${SETTINGS_NAV_MARKER}] > svg:first-child,
+[${SETTINGS_NAV_MARKER}] > svg.zWKi1a_navIcon {
+  display: none !important;
 }
 
 [${SETTINGS_NAV_MARKER}]::before {
@@ -23,9 +24,10 @@ const SETTINGS_NAV_CSS = `
   flex: none;
   width: 16px;
   height: 16px;
+  display: inline-block;
   background: currentColor;
-  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 11 L5 4 L8 9 L11 4 L14 11'/%3E%3C/svg%3E") center / contain no-repeat;
-  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 11 L5 4 L8 9 L11 4 L14 11'/%3E%3C/svg%3E") center / contain no-repeat;
+  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 11 L5 4 L8 9 L11 4 L14 11'/%3E%3C/svg%3E") center / contain no-repeat;
+  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 11 L5 4 L8 9 L11 4 L14 11'/%3E%3C/svg%3E") center / contain no-repeat;
 }
 `