@equal-experts/kuat-react 0.12.0 → 0.13.1

package/agent-docs/kuat-docs/rules/scenarios/marketing-pages.md

@@ -0,0 +1,367 @@
+# Marketing Page Scenarios
+
+Patterns for landing pages, feature pages, pricing, testimonials, and promotional content.
+
+---
+
+## Principles
+
+### User Goals
+
+- **Understand the value** - What's in it for me?
+- **Build trust** - Is this credible?
+- **Make decisions** - Which option is right for me?
+- **Take action** - Easy path to next step
+
+### UX Principles
+
+| Principle | Implementation |
+|-----------|----------------|
+| Clear value proposition | Hero communicates benefit immediately |
+| Social proof | Testimonials, logos, metrics build trust |
+| Scannable content | Users skim before they read |
+| Clear CTAs | Obvious next steps at every section |
+
+### Success Metrics
+
+- Time on page
+- Scroll depth
+- CTA click-through rate
+- Conversion rate
+
+---
+
+## Layout
+
+**Base Layout:** [Horizontal Navigation](../design/layouts.md#1-horizontal-navigation-layout)
+
+Marketing pages use full-width sections with contained content.
+
+### Landing Page Structure
+
+```
+┌─────────────────────────────────────┐
+│ Header                              │
+├─────────────────────────────────────┤
+│ Hero Section (full width)           │
+├─────────────────────────────────────┤
+│ Social Proof / Logos                │
+├─────────────────────────────────────┤
+│ Features Section                    │
+├─────────────────────────────────────┤
+│ Benefits / How It Works             │
+├─────────────────────────────────────┤
+│ Testimonials                        │
+├─────────────────────────────────────┤
+│ CTA Section                         │
+├─────────────────────────────────────┤
+│ Footer                              │
+└─────────────────────────────────────┘
+```
+
+### Pricing Page Structure
+
+```
+┌─────────────────────────────────────┐
+│ Header                              │
+├─────────────────────────────────────┤
+│ Heading: "Pricing" or "Choose Plan" │
+│ [Monthly] [Annual] toggle           │
+├─────────────────────────────────────┤
+│ ┌─────┐ ┌─────┐ ┌─────┐            │
+│ │Free │ │ Pro │ │Enter│            │
+│ │     │ │ ★   │ │prise│            │
+│ └─────┘ └─────┘ └─────┘            │
+├─────────────────────────────────────┤
+│ Feature Comparison Table            │
+├─────────────────────────────────────┤
+│ FAQ Section                         │
+├─────────────────────────────────────┤
+│ Footer                              │
+└─────────────────────────────────────┘
+```
+
+### Specifications
+
+| Element | Value |
+|---------|-------|
+| Header height | 64-80px |
+| Content container | max-width 1200-1400px, centered |
+| Section padding | 64-96px vertical |
+| Footer padding | 48-64px vertical |
+
+---
+
+## Design
+
+### Color Tokens
+
+| Element | Token |
+|---------|-------|
+| Page background | `bg-background` |
+| Header | `bg-background` (light) |
+| Alternating sections | `bg-muted` or `bg-background` |
+| CTA sections | `bg-primary` or dark |
+| Footer | `bg-muted` |
+
+### Typography
+
+| Element | Style |
+|---------|-------|
+| Hero heading | `text-4xl md:text-5xl lg:text-6xl font-bold` |
+| Hero subheading | `text-xl text-muted-foreground` |
+| Section heading | `text-3xl font-bold` |
+| Section subheading | `text-lg text-muted-foreground` |
+| Body text | `text-base` or `text-lg` |
+| Feature title | `text-lg font-semibold` |
+
+### Spacing Between Sections
+
+| Section Type | Vertical Padding |
+|--------------|-----------------|
+| Hero | 64-96px |
+| Standard content | 64px |
+| CTA sections | 64-80px |
+| Compact (logos) | 32-48px |
+
+---
+
+## Content
+
+### Hero Section
+
+**Required Elements:**
+
+1. Headline - Clear value proposition
+2. Subheadline - Supporting detail
+3. Primary CTA button
+4. Secondary CTA (optional)
+5. Hero image/illustration (optional)
+
+**Hero Variants:**
+
+| Variant | Structure |
+|---------|-----------|
+| Centered | Text centered, buttons centered below |
+| Split | Text left (50%), image right (50%) |
+| With background | Dark/image background, light text |
+
+**Specifications:**
+
+| Element | Value |
+|---------|-------|
+| Heading | Max 10-12 words |
+| Subheading | 1-2 sentences |
+| CTA spacing | 16px between buttons |
+
+### Feature Sections
+
+**Feature Grid:**
+
+```
+┌─────────┐ ┌─────────┐ ┌─────────┐
+│  Icon   │ │  Icon   │ │  Icon   │
+│ Heading │ │ Heading │ │ Heading │
+│  Text   │ │  Text   │ │  Text   │
+└─────────┘ └─────────┘ └─────────┘
+```
+
+| Element | Specification |
+|---------|---------------|
+| Grid | 3 columns desktop, 2 tablet, 1 mobile |
+| Gap | 32px |
+| Icon size | 48px, brand color |
+| Alignment | Center or left |
+
+**Feature Alternating:**
+
+```
+┌─────────────────────────────────────┐
+│ [Image]          Text content       │
+├─────────────────────────────────────┤
+│ Text content          [Image]       │
+├─────────────────────────────────────┤
+│ [Image]          Text content       │
+└─────────────────────────────────────┘
+```
+
+- Alternate image position left/right
+- 50/50 or 60/40 split
+- Stack on mobile (image above text)
+
+### Pricing Cards
+
+| Element | Specification |
+|---------|---------------|
+| Card padding | 32px (`p-8`) |
+| Highlighted tier | `border-primary`, "Popular" badge |
+| Price display | `text-4xl font-bold` |
+| Period | `text-sm text-muted-foreground` |
+| Feature list | 8-10 items max, checkmarks |
+| CTA button | Full width at bottom |
+
+### Testimonials
+
+**Card Pattern:**
+
+| Element | Specification |
+|---------|---------------|
+| Quote | `text-lg`, optional quotation marks |
+| Avatar | 48-64px, rounded full |
+| Name | `font-semibold` |
+| Title/Company | `text-muted-foreground` |
+| Logo | 80-120px wide |
+
+**Layout Options:**
+
+| Layout | Use Case |
+|--------|----------|
+| Grid (3 col) | Multiple equal testimonials |
+| Carousel | Many testimonials, limited space |
+| Featured | Single prominent quote |
+
+### CTA Sections
+
+**Mid-page CTA:**
+
+| Element | Specification |
+|---------|---------------|
+| Background | `bg-muted` |
+| Padding | 64px vertical |
+| Content | Centered heading + button |
+
+**Final CTA (above footer):**
+
+| Element | Specification |
+|---------|---------------|
+| Background | `bg-primary` or dark |
+| Text | White/light |
+| Padding | 80-96px vertical |
+| Content | Strong headline + single button |
+
+---
+
+## Accessibility
+
+**Base requirements:** See [accessibility/design.md](../accessibility/design.md), [accessibility/content.md](../accessibility/content.md), and [accessibility/technical.md](../accessibility/technical.md)
+
+**Scenario-specific:**
+
+| Requirement | Implementation |
+|-------------|----------------|
+| Image alt text | Describe meaningful images, decorative get empty alt |
+| Heading structure | H1 (hero) → H2 (sections) → H3 (sub-sections) |
+| Link purpose | CTAs describe destination/action |
+| Contrast on dark sections | Ensure text meets 4.5:1 on dark backgrounds |
+| Video captions | All promotional videos have captions |
+
+### Pricing Table Accessibility
+
+- Use semantic `<table>` for comparison tables
+- Clear header row with `<th>` elements
+- Don't rely on color alone for highlighting
+
+---
+
+## Implementation
+
+### Header Pattern
+
+| Element | Specification |
+|---------|---------------|
+| Background | `bg-background` (light) |
+| Logo | Full-color, left-aligned, 120-150px |
+| Navigation | Right-aligned, horizontal |
+| CTA button | Primary action in header |
+| Height | 64-80px |
+
+### Footer Pattern
+
+| Element | Specification |
+|---------|---------------|
+| Background | `bg-muted` |
+| Logo | Full-color, 100-120px |
+| Link columns | Company, Resources, Legal |
+| Social links | Icons, 24px |
+| Copyright | Bottom, `text-sm text-muted-foreground` |
+
+### Case Study Structure
+
+1. Hero with client logo and headline
+2. Challenge section - What problem?
+3. Solution section - How did we help?
+4. Results section - Metrics and outcomes
+5. Client quote
+6. Related case studies CTA
+
+**Results Display:**
+
+```
+┌──────┐ ┌──────┐ ┌──────┐
+│ 50%  │ │ 3x   │ │ 24h  │
+│ cost │ │faster│ │deploy│
+│ saved│ │ time │ │ time │
+└──────┘ └──────┘ └──────┘
+```
+
+- Use KPI card pattern
+- Include context (e.g., "50% reduction in...")
+
+### Responsive Behavior
+
+| Element | Desktop | Tablet | Mobile |
+|---------|---------|--------|--------|
+| Hero heading | `text-6xl` | `text-5xl` | `text-4xl` |
+| Feature grid | 3 columns | 2 columns | 1 column |
+| Pricing cards | 3 horizontal | 3 horizontal | Stacked |
+| Split sections | 50/50 | 50/50 | Stacked |
+| Testimonials | 3 columns | 2 columns | 1 column |
+
+---
+
+## Best Practices
+
+### Do's
+
+1. **Lead with value** - Hero should answer "what's in it for me?"
+2. **Use social proof** - Logos, testimonials, metrics
+3. **Clear CTAs** - One primary action per section
+4. **Scannable content** - Users skim before reading
+5. **Mobile-first** - Many visitors are on mobile
+6. **Fast loading** - Optimize images, lazy load below fold
+
+### Don'ts
+
+1. **Don't overwhelm** - One message per section
+2. **Don't hide CTAs** - Make them prominent
+3. **Don't use jargon** - Plain language for broad audience
+4. **Don't auto-play video with sound** - Respect user preferences
+5. **Don't neglect footer** - Important for trust and navigation
+
+### Common Mistakes
+
+| Mistake | Solution |
+|---------|----------|
+| Unclear value prop | Test headline with users |
+| Too many CTAs | One primary per section |
+| Walls of text | Break into scannable sections |
+| Generic testimonials | Specific, credible quotes |
+| Missing social proof | Add logos, numbers, quotes |
+| Slow loading | Optimize images, lazy load |
+
+### Edge Cases
+
+| Case | Handling |
+|------|----------|
+| No testimonials yet | Use partner logos, team credentials |
+| Complex pricing | Summary cards + detailed table |
+| Many features | Categorize, show top 3-6, link to full list |
+| Video content | Thumbnail + play button, don't auto-play |
+| International | Consider localization, currency display |
+
+---
+
+## Related Documentation
+
+- [Layout Primitives](../design/layouts.md) - Horizontal Navigation layout
+- [Rules index](../README.md) - Marketing content and logo (paths under *Types — web — marketing* and *Foundations — logo*)

package/agent-docs/manifest.json

@@ -0,0 +1,9 @@
+{
+  "packageVersion": "0.13.1",
+  "rules": {
+    "snapshotRef": "67fc215fe87c22084c245d97429837b2b6ed65bd",
+    "snapshotDate": "2026-05-21T11:23:20.905Z",
+    "sourceRepo": "equalexperts/kuat-agent-docs",
+    "loadingPath": "agent-docs/rules/LOADING-consumer.md"
+  }
+}

package/agent-docs/rules/LOADING-consumer.md

@@ -0,0 +1,27 @@
+# Kuat consumer rules (bundled)
+
+**Package:** @equal-experts/kuat-core (and mirrored in kuat-react / kuat-vue agent-docs)
+
+**Snapshot:** 67fc215fe87c
+
+## Default load (web product / marketing UI)
+
+1. `external/kuat-agent-rules/kuat-docs/rules/foundations/` (design, content, brand, logo, accessibility)
+2. `external/kuat-agent-rules/kuat-docs/rules/types/web/product/` — core files + scenarios + content (examples excluded)
+3. `external/kuat-agent-rules/kuat-docs/rules/types/web/marketing/`
+4. `kuat-docs/rules/design/layouts.md` — Kuat layout primitives
+5. `kuat-docs/rules/scenarios/` — Kuat scenario overlays
+6. Component guides on demand: `components/{slug}.md` via `components.manifest.json`
+
+## Component IDs
+
+Resolve `shadcn:button`, `kuat:button-group`, etc. using `components/components.manifest.json`.
+
+## Full org taxonomy
+
+Set `KUAT_RULES_PATH` to a `kuat-agent-docs` git clone for slides, graphics, and latest upstream.
+
+## Related
+
+- [README.md](../README.md)
+- Upstream [LOADING.md](../external/kuat-agent-rules/kuat-docs/rules/LOADING.md)

package/dist/components/ui/icon-button/icon-button.d.ts

@@ -0,0 +1,27 @@
+import { ButtonColor, ButtonVariant } from '../button/button';
+import * as React from "react";
+/** @deprecated Use "primary" instead. */
+export declare const ICON_BUTTON_VARIANT_DEFAULT_ALIAS = "default";
+export declare const ICON_BUTTON_SIZES: readonly ["mini", "small", "regular", "large"];
+/** @deprecated Use "small" instead. */
+export declare const ICON_BUTTON_SIZE_SM_ALIAS = "sm";
+/** @deprecated Use "large" instead. */
+export declare const ICON_BUTTON_SIZE_LG_ALIAS = "lg";
+export declare const ICON_BUTTON_ROUNDNESS: readonly ["default", "round"];
+export type IconButtonSize = (typeof ICON_BUTTON_SIZES)[number];
+export type IconButtonRoundness = (typeof ICON_BUTTON_ROUNDNESS)[number];
+export interface IconButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+    variant?: ButtonVariant | typeof ICON_BUTTON_VARIANT_DEFAULT_ALIAS;
+    size?: IconButtonSize | typeof ICON_BUTTON_SIZE_SM_ALIAS | typeof ICON_BUTTON_SIZE_LG_ALIAS;
+    color?: ButtonColor;
+    roundness?: IconButtonRoundness;
+    asChild?: boolean;
+}
+declare const IconButton: React.ForwardRefExoticComponent<IconButtonProps & React.RefAttributes<HTMLButtonElement>>;
+declare function iconButtonVariants(options?: {
+    variant?: IconButtonProps["variant"];
+    size?: IconButtonProps["size"];
+    color?: ButtonColor;
+    roundness?: IconButtonRoundness;
+}): string;
+export { IconButton, iconButtonVariants };

package/dist/components/ui/icon-button/index.d.ts

@@ -0,0 +1,2 @@
+export { IconButton, iconButtonVariants, ICON_BUTTON_SIZES, ICON_BUTTON_ROUNDNESS, ICON_BUTTON_VARIANT_DEFAULT_ALIAS, ICON_BUTTON_SIZE_SM_ALIAS, ICON_BUTTON_SIZE_LG_ALIAS, } from './icon-button';
+export type { IconButtonProps, IconButtonSize, IconButtonRoundness, } from './icon-button';

package/dist/components/ui/kuat-header/index.d.ts

@@ -1,2 +1,4 @@
-export { KuatHeader, EELogo, kuatHeaderVariants, KUAT_HEADER_VARIANTS, KUAT_HEADER_LOCKUP_VARIANTS, EE_LOGO_TEXT_COLORS, } from './kuat-header';
-export type { KuatHeaderProps, EELogoProps, KuatHeaderVariant, KuatHeaderLockupVariant, EELogoTextColor, KuatHeaderSubItem, KuatHeaderNavItem, KuatHeaderActionItem, } from './kuat-header';
+export { KuatHeader, EELogo, kuatHeaderVariants, } from './kuat-header';
+export { KUAT_HEADER_VARIANTS, KUAT_HEADER_LOCKUP_VARIANTS, KUAT_HEADER_APP_SWITCHER_EMPTY, EE_LOGO_TEXT_COLORS, } from './kuat-header.types';
+export type { KuatHeaderProps, EELogoProps, KuatHeaderVariant, KuatHeaderLockupVariant, EELogoTextColor, KuatHeaderSubItem, KuatHeaderNavItem, KuatHeaderAccountItem, KuatHeaderAccountConfig, KuatHeaderAccountLabels, KuatHeaderAccountMobileTier, KuatHeaderActionItem, KuatHeaderApp, KuatHeaderAppSwitcherConfig, KuatHeaderAppSwitcherEmpty, KuatHeaderAppSwitcherLabels, KuatHeaderLockupConfig, } from './kuat-header.types';
+export { shouldShowAppSwitcher, resolveAppSwitcherLabels, resolveHeaderLockup, resolveAccountLabels, shouldShowAccountMobileTier, hasStructuredAccount, resolveDesktopAccountMenuItems, shouldUseDesktopAccountDropdown, } from './kuat-header.logic';

package/dist/components/ui/kuat-header/kuat-header.d.ts

@@ -1,50 +1,13 @@
+import { EELogoProps, KuatHeaderProps, KuatHeaderVariant } from './kuat-header.types';
 import * as React from "react";
-export declare const KUAT_HEADER_VARIANTS: readonly ["default", "bold"];
-export type KuatHeaderVariant = (typeof KUAT_HEADER_VARIANTS)[number];
-export declare const KUAT_HEADER_LOCKUP_VARIANTS: readonly ["default", "demo"];
-export type KuatHeaderLockupVariant = (typeof KUAT_HEADER_LOCKUP_VARIANTS)[number];
-export declare const EE_LOGO_TEXT_COLORS: readonly ["grey", "white"];
-export type EELogoTextColor = (typeof EE_LOGO_TEXT_COLORS)[number];
+export type { EELogoProps, EELogoTextColor, KuatHeaderAccountConfig, KuatHeaderAccountItem, KuatHeaderAccountLabels, KuatHeaderAccountMobileTier, KuatHeaderActionItem, KuatHeaderApp, KuatHeaderAppSwitcherConfig, KuatHeaderAppSwitcherEmpty, KuatHeaderAppSwitcherLabels, KuatHeaderLockupConfig, KuatHeaderLockupVariant, KuatHeaderNavItem, KuatHeaderProps, KuatHeaderSubItem, KuatHeaderVariant, } from './kuat-header.types';
+export { KUAT_HEADER_VARIANTS, KUAT_HEADER_LOCKUP_VARIANTS, EE_LOGO_TEXT_COLORS, KUAT_HEADER_APP_SWITCHER_EMPTY, } from './kuat-header.types';
+export { shouldShowAppSwitcher, resolveAppSwitcherLabels, resolveHeaderLockup, } from './kuat-header.logic';
 /**
  * Equal Experts Logo component
  * Source: https://github.com/EqualExperts/brand-assets/blob/main/logo/logo-colour.svg
  */
-export interface EELogoProps {
-    className?: string;
-    /** Text color variant - grey for default, white for bold */
-    textColor?: EELogoTextColor;
-}
 declare function EELogo({ className, textColor }: EELogoProps): import("react/jsx-runtime").JSX.Element;
-export interface KuatHeaderProps extends React.HTMLAttributes<HTMLElement> {
-    /** Logo element - defaults to EE logo if not provided. Set to `null` to hide. */
-    logo?: React.ReactNode;
-    /** Page or application title */
-    title?: string;
-    /** Navigation items or legacy navigation node. */
-    navigation?: React.ReactNode | KuatHeaderNavItem[];
-    /** Right-side actions or legacy action node. */
-    actions?: React.ReactNode | KuatHeaderActionItem[];
-    /** Mobile menu trigger button (e.g., hamburger icon) */
-    mobileMenuTrigger?: React.ReactNode;
-    /** Mobile menu content (typically a Sheet or Drawer) */
-    mobileMenu?: React.ReactNode;
-    /** Hide the default EE logo */
-    hideLogo?: boolean;
-    /** Brand lockup layout in header. */
-    lockupVariant?: KuatHeaderLockupVariant;
-    variant?: KuatHeaderVariant;
-}
-export interface KuatHeaderSubItem {
-    label: string;
-    url: string;
-}
-export interface KuatHeaderNavItem extends KuatHeaderSubItem {
-    items?: KuatHeaderSubItem[];
-}
-export interface KuatHeaderActionItem extends KuatHeaderSubItem {
-    icon?: React.ReactNode;
-    items?: KuatHeaderSubItem[];
-}
 declare const KuatHeader: React.ForwardRefExoticComponent<KuatHeaderProps & React.RefAttributes<HTMLElement>>;
 /** Returns class string for header variant (backward compatibility). */
 export declare function kuatHeaderVariants(options?: {

package/dist/components/ui/kuat-header/kuat-header.logic.d.ts

@@ -0,0 +1,32 @@
+import { ReactNode } from 'react';
+import { KuatHeaderAccountConfig, KuatHeaderAppSwitcherConfig, KuatHeaderAppSwitcherLabels, KuatHeaderLockupConfig, KuatHeaderLockupVariant, KuatHeaderSubItem } from './kuat-header.types';
+
+export declare function shouldShowAppSwitcher(config?: KuatHeaderAppSwitcherConfig): boolean;
+export declare function resolveAppSwitcherLabels(config?: KuatHeaderAppSwitcherConfig): Required<KuatHeaderAppSwitcherLabels>;
+export declare function resolveAppSwitcherEmptyMessage(config?: KuatHeaderAppSwitcherConfig): string;
+export declare function shouldShowAccountMobileTier(account?: KuatHeaderAccountConfig): boolean;
+export declare function hasStructuredAccount(account?: KuatHeaderAccountConfig): boolean;
+/** Menu rows for the desktop account dropdown (from `account.mobile.items`). */
+export declare function resolveDesktopAccountMenuItems(account?: KuatHeaderAccountConfig): KuatHeaderSubItem[];
+/** Single primary row + mobile menu items → desktop shows a dropdown, not a direct link. */
+export declare function shouldUseDesktopAccountDropdown(account?: KuatHeaderAccountConfig): boolean;
+export declare function resolveAccountLabels(account?: KuatHeaderAccountConfig): {
+    teaserTitle: string;
+    teaserDescription: string;
+    nav: string;
+    title: string;
+};
+export type HeaderLockupMode = "hidden" | "custom" | "builtin";
+export declare function resolveHeaderLockup(options: {
+    logo?: ReactNode | null;
+    lockup?: KuatHeaderLockupConfig;
+}): {
+    mode: HeaderLockupMode;
+    lockupVariant: KuatHeaderLockupVariant;
+};
+export declare function resolveMobileSheetAriaLabel(options: {
+    mobileMenuAriaLabel?: string;
+    showAppSwitcher: boolean;
+    hasStructuredNavigation: boolean;
+    hasAccountMobileTier: boolean;
+}): string;

package/dist/components/ui/kuat-header/kuat-header.types.d.ts

@@ -0,0 +1,91 @@
+import type * as React from "react";
+export declare const KUAT_HEADER_VARIANTS: readonly ["default", "bold"];
+export type KuatHeaderVariant = (typeof KUAT_HEADER_VARIANTS)[number];
+export declare const KUAT_HEADER_LOCKUP_VARIANTS: readonly ["default", "demo"];
+export type KuatHeaderLockupVariant = (typeof KUAT_HEADER_LOCKUP_VARIANTS)[number];
+export declare const EE_LOGO_TEXT_COLORS: readonly ["grey", "white"];
+export type EELogoTextColor = (typeof EE_LOGO_TEXT_COLORS)[number];
+export declare const KUAT_HEADER_APP_SWITCHER_EMPTY: readonly ["hide", "message"];
+export type KuatHeaderAppSwitcherEmpty = (typeof KUAT_HEADER_APP_SWITCHER_EMPTY)[number];
+export interface KuatHeaderApp {
+    id: string;
+    label: string;
+    href: string;
+    description?: string;
+    icon?: React.ReactNode;
+}
+export interface KuatHeaderAppSwitcherLabels {
+    trigger?: string;
+    nav?: string;
+    title?: string;
+    teaserTitle?: string;
+    teaserDescription?: string;
+}
+export interface KuatHeaderAppSwitcherConfig {
+    apps: KuatHeaderApp[];
+    loading?: boolean;
+    empty?: KuatHeaderAppSwitcherEmpty;
+    emptyMessage?: string;
+    linkTarget?: React.HTMLAttributeAnchorTarget;
+    labels?: KuatHeaderAppSwitcherLabels;
+    onOpen?: () => void;
+    onSelect?: (app: KuatHeaderApp) => void;
+}
+export interface KuatHeaderAccountItem {
+    label: string;
+    href: string;
+    icon?: React.ReactNode;
+}
+export interface KuatHeaderAccountMobileTier {
+    heading: string;
+    subtitle?: string;
+    items: KuatHeaderAccountItem[];
+}
+export interface KuatHeaderAccountLabels {
+    teaserTitle?: string;
+    teaserDescription?: string;
+    nav?: string;
+    title?: string;
+}
+export interface KuatHeaderAccountConfig {
+    items: KuatHeaderAccountItem[];
+    mobile?: KuatHeaderAccountMobileTier;
+    labels?: KuatHeaderAccountLabels;
+}
+export interface KuatHeaderLockupConfig {
+    variant: KuatHeaderLockupVariant;
+}
+export interface KuatHeaderSubItem {
+    label: string;
+    url: string;
+}
+export interface KuatHeaderNavItem extends KuatHeaderSubItem {
+    items?: KuatHeaderSubItem[];
+}
+/** @deprecated Use `KuatHeaderAccountItem` with `href`. */
+export interface KuatHeaderActionItem {
+    label: string;
+    url: string;
+    icon?: React.ReactNode;
+    items?: KuatHeaderSubItem[];
+}
+export interface KuatHeaderProps extends React.HTMLAttributes<HTMLElement> {
+    variant?: KuatHeaderVariant;
+    title?: string;
+    /** Custom logo node. `null` hides logo. Built-in EE logo only when `lockup` is set. */
+    logo?: React.ReactNode | null;
+    lockup?: KuatHeaderLockupConfig;
+    navigation?: React.ReactNode | KuatHeaderNavItem[];
+    /** Structured account chrome (desktop links + optional mobile tier). */
+    account?: KuatHeaderAccountConfig;
+    /** Custom account / actions markup (escape hatch). */
+    accountMarkup?: React.ReactNode;
+    appSwitcher?: KuatHeaderAppSwitcherConfig;
+    mobileMenuTrigger?: React.ReactNode;
+    mobileMenu?: React.ReactNode;
+    mobileMenuAriaLabel?: string;
+}
+export interface EELogoProps {
+    className?: string;
+    textColor?: EELogoTextColor;
+}

package/dist/icon-button-B5hCoK1b.js

@@ -0,0 +1,63 @@
+import { jsx as I } from "react/jsx-runtime";
+import * as N from "react";
+import { Slot as v } from "@radix-ui/react-slot";
+import { c as s } from "./utils-DLUjLwnh.js";
+const B = "default", $ = ["mini", "small", "regular", "large"], C = "sm", U = "lg", y = ["default", "round"];
+function l(t) {
+  return t === "default" ? "primary" : t ?? "primary";
+}
+function i(t) {
+  return t === "sm" ? "small" : t === "lg" ? "large" : t ?? "regular";
+}
+const S = N.forwardRef(
+  ({
+    className: t,
+    variant: r = "primary",
+    size: e = "regular",
+    color: n = "ee-blue",
+    roundness: u = "default",
+    asChild: a = !1,
+    type: c = "button",
+    ...m
+  }, f) => {
+    const b = a ? v : "button", o = l(r), d = i(e), _ = o === "destructive" ? void 0 : `button--color-${n}`;
+    return /* @__PURE__ */ I(
+      b,
+      {
+        ref: f,
+        type: a ? void 0 : c,
+        className: s(
+          "button",
+          "icon-button",
+          `button--variant-${o}`,
+          _,
+          `icon-button--size-${d}`,
+          `icon-button--roundness-${u}`,
+          t
+        ),
+        ...m
+      }
+    );
+  }
+);
+S.displayName = "IconButton";
+function z(t) {
+  const r = l((t == null ? void 0 : t.variant) ?? "primary"), e = i((t == null ? void 0 : t.size) ?? "regular"), n = (t == null ? void 0 : t.color) ?? "ee-blue", u = (t == null ? void 0 : t.roundness) ?? "default", c = r === "destructive" ? void 0 : `button--color-${n}`;
+  return s(
+    "button",
+    "icon-button",
+    `button--variant-${r}`,
+    c,
+    `icon-button--size-${e}`,
+    `icon-button--roundness-${u}`
+  );
+}
+export {
+  S as I,
+  $ as a,
+  y as b,
+  B as c,
+  C as d,
+  U as e,
+  z as i
+};