Merge branch 'staging' into dev

Author: TheodoreSpeaks

.agents/skills/emcn-design-review/SKILL.md

@@ -234,7 +234,7 @@ Use for context menus and action menus:
 <DropdownMenu>
   <DropdownMenuTrigger asChild>
     <Button variant="ghost">
-      <MoreHorizontal className="h-[14px] w-[14px]" />
+      <MoreHorizontal className="size-[14px]" />
     </Button>
   </DropdownMenuTrigger>
   <DropdownMenuContent align="end">
@@ -281,19 +281,21 @@ Rules:
 - Stack multiple skeletons for lists
 
 ### Icons
-Standard sizing — `h-[14px] w-[14px]` is the dominant pattern (400+ uses):
+Standard sizing — use the `size-*` shorthand. `size-[14px]` is the dominant pattern:
 
 ```tsx
-<Icon className="h-[14px] w-[14px] text-[var(--text-icon)]" />
+<Icon className="size-[14px] text-[var(--text-icon)]" />
 ```
 
-Size scale by frequency:
-1. `h-[14px] w-[14px]` — default for inline icons (most common)
-2. `h-[16px] w-[16px]` — slightly larger inline icons
-3. `h-3 w-3` (12px) — compact/tight spaces
-4. `h-4 w-4` (16px) — Tailwind equivalent, also common
-5. `h-3.5 w-3.5` (14px) — Tailwind equivalent of 14px
-6. `h-5 w-5` (20px) — larger icons, section headers
+Always prefer `size-*` over the legacy `h-* w-*` pair. `size-[14px]` is canonical; treat any `h-[Npx] w-[Npx]` or `h-N w-N` pair as a refactor target.
+
+Size scale (most common first):
+1. `size-[14px]` — default for inline icons
+2. `size-[16px]` — slightly larger inline icons
+3. `size-3` (12px) — compact/tight spaces
+4. `size-4` (16px) — Tailwind equivalent
+5. `size-3.5` (14px) — Tailwind equivalent of 14px
+6. `size-5` (20px) — larger icons, section headers
 
 Use `text-[var(--text-icon)]` for icon color (113+ uses in codebase).
 
@@ -332,4 +334,5 @@ Use `text-[var(--text-icon)]` for icon color (113+ uses in codebase).
 - Importing from emcn subpaths instead of barrel export
 - Using arbitrary z-index (`z-50`, `z-[9999]`) instead of z-index tokens
 - Custom shadows instead of shadow tokens
-- Icon sizes that don't follow the established scale (default to `h-[14px] w-[14px]`)
+- Icon sizes that don't follow the established scale (default to `size-[14px]`)
+- Splitting equal height/width into `h-* w-*` pairs instead of the `size-*` shorthand

.claude/commands/emcn-design-review.md

@@ -65,7 +65,7 @@ Modal `size="sm"`, title "Delete/Remove {ItemType}", `variant="destructive"` act
 
 ## Icons
 
-Default: `h-[14px] w-[14px]` (400+ uses). Color: `text-[var(--text-icon)]`. Scale: 14px > 16px > 12px > 20px.
+Default: `size-[14px]`. Color: `text-[var(--text-icon)]`. Scale: 14px > 16px > 12px > 20px. Use the `size-*` shorthand — flag `h-[Npx] w-[Npx]` and `h-N w-N` pairs as refactor targets.
 
 ## Anti-patterns to flag
 

.claude/rules/emcn-components.md

@@ -32,4 +32,5 @@ function Label({ className, ...props }) {
 - Export component and variants (if using CVA)
 - TSDoc with usage examples
 - Consistent tokens: `font-medium`, `text-[12px]`, `rounded-[4px]`
+- Equal height/width → `size-*` (e.g. `size-[14px]`, `size-4`), never `h-[Npx] w-[Npx]` or `h-N w-N`. Default icon size is `size-[14px]`
 - `transition-colors` for hover states

.claude/rules/sim-styling.md

@@ -11,7 +11,8 @@ paths:
 1. **No inline styles** - Use Tailwind classes
 2. **No duplicate dark classes** - Skip `dark:` when value matches light mode
 3. **Exact values** - `text-[14px]`, `h-[26px]`
-4. **Transitions** - `transition-colors` for interactive states
+4. **Equal h/w → `size-*`** - Use `size-[14px]` / `size-4`, never `h-[14px] w-[14px]` or `h-4 w-4`. Default icon size is `size-[14px]`
+5. **Transitions** - `transition-colors` for interactive states
 
 ## Conditional Classes
 

.cursor/commands/emcn-design-review.md

@@ -60,7 +60,7 @@ Modal `size="sm"`, title "Delete/Remove {ItemType}", `variant="destructive"` act
 
 ## Icons
 
-Default: `h-[14px] w-[14px]` (400+ uses). Color: `text-[var(--text-icon)]`. Scale: 14px > 16px > 12px > 20px.
+Default: `size-[14px]`. Color: `text-[var(--text-icon)]`. Scale: 14px > 16px > 12px > 20px. Use the `size-*` shorthand — flag `h-[Npx] w-[Npx]` and `h-N w-N` pairs as refactor targets.
 
 ## Anti-patterns to flag
 

.github/workflows/test-build.yml

@@ -109,6 +109,9 @@ jobs:
       - name: API contract boundary audit
         run: bun run check:api-validation:strict
 
+      - name: Zustand v5 selector audit
+        run: bun run check:zustand-v5
+
       - name: Verify realtime prune graph
         run: bun run check:realtime-prune
 

AGENTS.md

@@ -357,6 +357,12 @@ Use Tailwind only, no inline styles. Use `cn()` from `@/lib/utils` for condition
 <div className={cn('base-classes', isActive && 'active-classes')} />
 ```
 
+For equal height and width, use the `size-*` shorthand — never `h-[Npx] w-[Npx]` or `h-N w-N`. Default icon size is `size-[14px]`.
+
+```typescript
+<Icon className='size-[14px] text-[var(--text-icon)]' />
+```
+
 ## EMCN Components
 
 Import from `@/components/emcn`, never from subpaths (except CSS files). Use CVA when 2+ variants exist.

CLAUDE.md

@@ -347,6 +347,12 @@ Use Tailwind only, no inline styles. Use `cn()` from `@/lib/utils` for condition
 <div className={cn('base-classes', isActive && 'active-classes')} />
 ```
 
+For equal height and width, use the `size-*` shorthand — never `h-[Npx] w-[Npx]` or `h-N w-N`. Default icon size is `size-[14px]`.
+
+```typescript
+<Icon className='size-[14px] text-[var(--text-icon)]' />
+```
+
 ## EMCN Components
 
 Import from `@/components/emcn`, never from subpaths (except CSS files). Use CVA when 2+ variants exist.

apps/docs/app/[lang]/[[...slug]]/page.tsx

@@ -306,9 +306,12 @@ export async function generateMetadata(props: {
       siteName: 'Sim Documentation',
       type: 'article',
       locale: OG_LOCALE_MAP[lang] ?? 'en_US',
-      alternateLocale: i18n.languages
-        .filter((l) => l !== lang)
-        .map((l) => OG_LOCALE_MAP[l] ?? 'en_US'),
+      alternateLocale: i18n.languages.reduce<string[]>((locales, l) => {
+        if (l !== lang) {
+          locales.push(OG_LOCALE_MAP[l] ?? 'en_US')
+        }
+        return locales
+      }, []),
       images: [
         {
           url: ogImageUrl,

apps/docs/app/[lang]/layout.tsx

@@ -11,6 +11,7 @@ import {
 import { Navbar } from '@/components/navbar/navbar'
 import { SimLogoFull } from '@/components/ui/sim-logo'
 import { i18n } from '@/lib/i18n'
+import { serializeJsonLd } from '@/lib/json-ld'
 import { source } from '@/lib/source'
 import { DOCS_BASE_URL } from '@/lib/urls'
 import '../global.css'
@@ -78,14 +79,6 @@ export default async function Layout({ children, params }: LayoutProps) {
       },
     },
     inLanguage: lang,
-    potentialAction: {
-      '@type': 'SearchAction',
-      target: {
-        '@type': 'EntryPoint',
-        urlTemplate: `${DOCS_BASE_URL}/api/search?q={search_term_string}`,
-      },
-      'query-input': 'required name=search_term_string',
-    },
   }
 
   return (
@@ -97,7 +90,7 @@ export default async function Layout({ children, params }: LayoutProps) {
       <head>
         <script
           type='application/ld+json'
-          dangerouslySetInnerHTML={{ __html: JSON.stringify(structuredData) }}
+          dangerouslySetInnerHTML={{ __html: serializeJsonLd(structuredData) }}
         />
       </head>
       <body className='flex min-h-screen flex-col font-sans'>