@countermeasure-platform/web-components 1.2.1-dev.4.1 → 1.2.1

package/src/utils/__tests__/status-tone.test.ts

@@ -0,0 +1,164 @@
+import { describe, expect, it } from 'vitest'
+import { statusToneFromSeverity, statusToneFromState } from '../status-tone'
+
+describe('statusToneFromSeverity', () => {
+  it('returns rose for critical', () => {
+    expect(statusToneFromSeverity('critical')).toBe('rose')
+  })
+
+  it('returns orange for high', () => {
+    expect(statusToneFromSeverity('high')).toBe('orange')
+  })
+
+  it('returns amber for medium', () => {
+    expect(statusToneFromSeverity('medium')).toBe('amber')
+  })
+
+  it('returns cyan for low', () => {
+    expect(statusToneFromSeverity('low')).toBe('cyan')
+  })
+
+  it('returns glass for info', () => {
+    expect(statusToneFromSeverity('info')).toBe('glass')
+  })
+
+  it('is case-insensitive (Critical)', () => {
+    expect(statusToneFromSeverity('Critical')).toBe('rose')
+  })
+
+  it('is case-insensitive (CRITICAL)', () => {
+    expect(statusToneFromSeverity('CRITICAL')).toBe('rose')
+  })
+
+  it('is case-insensitive (mixed case HIGH)', () => {
+    expect(statusToneFromSeverity('HiGh')).toBe('orange')
+  })
+
+  it('falls back to glass for unknown values', () => {
+    expect(statusToneFromSeverity('unknown')).toBe('glass')
+    expect(statusToneFromSeverity('severe')).toBe('glass')
+  })
+
+  it('falls back to glass for empty string', () => {
+    expect(statusToneFromSeverity('')).toBe('glass')
+  })
+})
+
+describe('statusToneFromState', () => {
+  it('returns emerald for active', () => {
+    expect(statusToneFromState('active')).toBe('emerald')
+  })
+
+  it('returns emerald for connected', () => {
+    expect(statusToneFromState('connected')).toBe('emerald')
+  })
+
+  it('returns emerald for passing', () => {
+    expect(statusToneFromState('passing')).toBe('emerald')
+  })
+
+  it('returns emerald for enabled', () => {
+    expect(statusToneFromState('enabled')).toBe('emerald')
+  })
+
+  it('returns emerald for healthy', () => {
+    expect(statusToneFromState('healthy')).toBe('emerald')
+  })
+
+  it('returns cyan for running', () => {
+    expect(statusToneFromState('running')).toBe('cyan')
+  })
+
+  it('returns cyan for testing', () => {
+    expect(statusToneFromState('testing')).toBe('cyan')
+  })
+
+  it('returns cyan for completed', () => {
+    expect(statusToneFromState('completed')).toBe('cyan')
+  })
+
+  it('returns rose for error', () => {
+    expect(statusToneFromState('error')).toBe('rose')
+  })
+
+  it('returns rose for failed', () => {
+    expect(statusToneFromState('failed')).toBe('rose')
+  })
+
+  it('returns rose for disconnected', () => {
+    expect(statusToneFromState('disconnected')).toBe('rose')
+  })
+
+  it('returns rose for attention', () => {
+    expect(statusToneFromState('attention')).toBe('rose')
+  })
+
+  it('returns amber for pending', () => {
+    expect(statusToneFromState('pending')).toBe('amber')
+  })
+
+  it('returns amber for needs_setup', () => {
+    expect(statusToneFromState('needs_setup')).toBe('amber')
+  })
+
+  it('returns amber for needs_review', () => {
+    expect(statusToneFromState('needs_review')).toBe('amber')
+  })
+
+  it('returns amber for stale', () => {
+    expect(statusToneFromState('stale')).toBe('amber')
+  })
+
+  it('returns amber for available', () => {
+    expect(statusToneFromState('available')).toBe('amber')
+  })
+
+  it('returns amber for queued', () => {
+    expect(statusToneFromState('queued')).toBe('amber')
+  })
+
+  it('returns amber for generating', () => {
+    expect(statusToneFromState('generating')).toBe('amber')
+  })
+
+  it('returns amber for purging', () => {
+    expect(statusToneFromState('purging')).toBe('amber')
+  })
+
+  it('returns violet for quarantined', () => {
+    expect(statusToneFromState('quarantined')).toBe('violet')
+  })
+
+  it('returns glass for disabled', () => {
+    expect(statusToneFromState('disabled')).toBe('glass')
+  })
+
+  it('returns glass for inactive', () => {
+    expect(statusToneFromState('inactive')).toBe('glass')
+  })
+
+  it('returns glass for decommissioned', () => {
+    expect(statusToneFromState('decommissioned')).toBe('glass')
+  })
+
+  it('is case-insensitive (Active)', () => {
+    expect(statusToneFromState('Active')).toBe('emerald')
+  })
+
+  it('is case-insensitive (ERROR)', () => {
+    expect(statusToneFromState('ERROR')).toBe('rose')
+  })
+
+  it('is case-insensitive (Pending)', () => {
+    expect(statusToneFromState('Pending')).toBe('amber')
+  })
+
+  it('falls back to glass for unknown values', () => {
+    expect(statusToneFromState('unknown')).toBe('glass')
+    expect(statusToneFromState('something')).toBe('glass')
+  })
+
+  it('falls back to glass for empty string', () => {
+    expect(statusToneFromState('')).toBe('glass')
+  })
+})

package/src/utils/index.ts

@@ -158,3 +158,32 @@ export {
   isPortrait,
   getSafeAreaInsets,
 } from './touch'
+
+// Score utilities
+export {
+  getScoreLevel,
+  scoreColors,
+  scoreToColor,
+  scoreToTextColor,
+  getScoreBgClass,
+  getScoreTextClass,
+  getScoreBorderClass,
+  getScoreBgColor,
+  getScoreTextColor,
+  getScoreHexColor,
+  getScoreColorClasses,
+  type ScoreLevel,
+} from './score'
+
+// Status tone utilities
+export {
+  statusToneFromSeverity,
+  statusToneFromState,
+  type StatusTone,
+} from './status-tone'
+
+// Sage analysis utilities
+export {
+  generateSageAnalysis,
+  type SageAnalysisThresholds,
+} from './sage-analysis'

package/src/utils/sage-analysis.ts

@@ -0,0 +1,62 @@
+/**
+ * Sage Analysis Utility
+ *
+ * Generates contextual narrative strings for Sage insight cards based on
+ * a numeric score and domain-specific thresholds. Consolidates the repeated
+ * getSageAnalysis() pattern found across DetectionInsightsCard,
+ * ValidationInsightsCard, and VisibilityInsightsCard in tenant-ui.
+ *
+ * Usage:
+ *   const thresholds: SageAnalysisThresholds = {
+ *     excellent: 'Strong detection posture...',
+ *     good:      'Moderate coverage with room to improve...',
+ *     moderate:  'Gaps exist across several techniques...',
+ *     poor:      'Significant exposure requires immediate action...',
+ *     critical:  'Critical gaps demand urgent remediation...',
+ *   }
+ *   const narrative = generateSageAnalysis(score, thresholds, hasCritical)
+ */
+
+/** Threshold-based narrative messages for Sage analysis. */
+export interface SageAnalysisThresholds {
+  /** Narrative when score >= 80 */
+  excellent: string
+  /** Narrative when score >= 60 */
+  good: string
+  /** Narrative when score >= 40 */
+  moderate: string
+  /** Narrative when score < 40 */
+  poor: string
+  /** Override narrative when critical issues are detected */
+  critical?: string
+}
+
+/**
+ * Generate a Sage analysis narrative string from a numeric score and
+ * threshold-based messages.
+ *
+ * When `hasCriticalIssues` is true and a `critical` threshold message is
+ * provided, the critical message takes precedence over score-based tiers.
+ *
+ * Score tiers:
+ * - 80+  -> excellent
+ * - 60+  -> good
+ * - 40+  -> moderate
+ * - <40  -> poor
+ *
+ * @param score - Numeric score (0-100)
+ * @param thresholds - Tier-based narrative messages
+ * @param hasCriticalIssues - Whether critical issues override the score tier
+ * @returns The narrative string for the matching tier
+ */
+export function generateSageAnalysis(
+  score: number,
+  thresholds: SageAnalysisThresholds,
+  hasCriticalIssues?: boolean,
+): string {
+  if (hasCriticalIssues && thresholds.critical) return thresholds.critical
+  if (score >= 80) return thresholds.excellent
+  if (score >= 60) return thresholds.good
+  if (score >= 40) return thresholds.moderate
+  return thresholds.poor
+}

package/src/utils/score.ts

@@ -0,0 +1,123 @@
+export type ScoreLevel = 'good' | 'warning' | 'concerning' | 'critical'
+
+/**
+ * Global score-to-level mapping for consistent health indicators.
+ *
+ * Thresholds (aligned with tenant-ui):
+ * - 80+: good (healthy)
+ * - 60-79: warning (needs attention)
+ * - 40-59: concerning (degraded)
+ * - <40: critical
+ */
+export function getScoreLevel(score: number): ScoreLevel {
+  if (score >= 80) return 'good'
+  if (score >= 60) return 'warning'
+  if (score >= 40) return 'concerning'
+  return 'critical'
+}
+
+/** Pre-built Tailwind class and CSS var map keyed by score level. */
+export const scoreColors = {
+  good: {
+    bg: 'bg-score-good',
+    text: 'text-score-good',
+    hex: 'var(--color-score-good)',
+  },
+  warning: {
+    bg: 'bg-score-warning',
+    text: 'text-score-warning',
+    hex: 'var(--color-score-warning)',
+  },
+  concerning: {
+    bg: 'bg-score-concerning',
+    text: 'text-score-concerning',
+    hex: 'var(--color-score-concerning)',
+  },
+  critical: {
+    bg: 'bg-score-critical',
+    text: 'text-score-critical',
+    hex: 'var(--color-score-critical)',
+  },
+} as const
+
+// ---------------------------------------------------------------------------
+// CSS custom-property helpers (for inline styles)
+// ---------------------------------------------------------------------------
+
+export function scoreToColor(score: number): string {
+  const level = getScoreLevel(score)
+  return `var(--color-score-${level})`
+}
+
+export function scoreToTextColor(score: number): string {
+  return scoreToColor(score)
+}
+
+// ---------------------------------------------------------------------------
+// Tailwind class helpers (single class strings)
+// ---------------------------------------------------------------------------
+
+/** Returns `bg-score-<level>` */
+export function getScoreBgClass(score: number): string {
+  return `bg-score-${getScoreLevel(score)}`
+}
+
+/** Returns `text-score-<level>` */
+export function getScoreTextClass(score: number): string {
+  return `text-score-${getScoreLevel(score)}`
+}
+
+/** Returns `border-score-<level>` */
+export function getScoreBorderClass(score: number): string {
+  return `border-score-${getScoreLevel(score)}`
+}
+
+// ---------------------------------------------------------------------------
+// Lookup helpers (match tenant-ui API)
+// ---------------------------------------------------------------------------
+
+/** Returns the Tailwind `bg-score-*` class for a numeric score. */
+export function getScoreBgColor(score: number): string {
+  return scoreColors[getScoreLevel(score)].bg
+}
+
+/** Returns the Tailwind `text-score-*` class for a numeric score. */
+export function getScoreTextColor(score: number): string {
+  return scoreColors[getScoreLevel(score)].text
+}
+
+/** Returns the CSS variable reference (`var(--color-score-*)`) for a numeric score. */
+export function getScoreHexColor(score: number): string {
+  return scoreColors[getScoreLevel(score)].hex
+}
+
+/**
+ * Returns composite Tailwind classes (text, bg with 10% opacity, border with 20% opacity)
+ * suitable for badge / pill styling.
+ */
+export function getScoreColorClasses(score: number): {
+  text: string
+  bg: string
+  border: string
+} {
+  const level = getScoreLevel(score)
+  const colorMap = {
+    good: { text: 'text-score-good', bg: 'bg-score-good/10', border: 'border-score-good/20' },
+    warning: {
+      text: 'text-score-warning',
+      bg: 'bg-score-warning/10',
+      border: 'border-score-warning/20',
+    },
+    concerning: {
+      text: 'text-score-concerning',
+      bg: 'bg-score-concerning/10',
+      border: 'border-score-concerning/20',
+    },
+    critical: {
+      text: 'text-score-critical',
+      bg: 'bg-score-critical/10',
+      border: 'border-score-critical/20',
+    },
+  }
+  return colorMap[level]
+}

package/src/utils/status-tone.ts

@@ -0,0 +1,48 @@
+export type StatusTone = 'emerald' | 'cyan' | 'rose' | 'amber' | 'violet' | 'orange' | 'glass'
+
+export function statusToneFromSeverity(severity: string): StatusTone {
+  switch (severity.toLowerCase()) {
+    case 'critical': return 'rose'
+    case 'high': return 'orange'
+    case 'medium': return 'amber'
+    case 'low': return 'cyan'
+    case 'info': return 'glass'
+    default: return 'glass'
+  }
+}
+
+export function statusToneFromState(state: string): StatusTone {
+  switch (state.toLowerCase()) {
+    case 'active':
+    case 'connected':
+    case 'passing':
+    case 'enabled':
+    case 'healthy':
+      return 'emerald'
+    case 'running':
+    case 'testing':
+    case 'completed':
+      return 'cyan'
+    case 'error':
+    case 'failed':
+    case 'disconnected':
+    case 'attention':
+      return 'rose'
+    case 'pending':
+    case 'needs_setup':
+    case 'needs_review':
+    case 'stale':
+    case 'available':
+    case 'queued':
+    case 'generating':
+    case 'purging':
+      return 'amber'
+    case 'quarantined':
+      return 'violet'
+    case 'disabled':
+    case 'inactive':
+    case 'decommissioned':
+    default:
+      return 'glass'
+  }
+}

package/dist/architecture-PBZL5I3N-gCfUhEfQ.js

@@ -1,3 +0,0 @@
-import "./chunk-XZSTWKYB-BZB_wvbZ.js";
-import { n as e } from "./chunk-R5LLSJPH-C90VQC8y.js";
-export { e as createArchitectureServices };

package/dist/classDiagram-VBA2DB6C-DFfohpM0.js

@@ -1,31 +0,0 @@
-import "./chunk-GEFDOKGD-bXEkwPrJ.js";
-import { n as e } from "./src-hxErHTV1.js";
-import "./chunk-7R4GIKGN-DiZ1HYFd.js";
-import "./chunk-PU5JKC2W-CAfe4Tg3.js";
-import "./chunk-FMBD7UC4-7bd068zf.js";
-import "./chunk-MX3YWQON-DnBlqD44.js";
-import "./chunk-YBOYWFTD-DVqQ1pen.js";
-import "./chunk-JSJVCQXG-p-BUVvps.js";
-import "./chunk-55IACEB6-DxNTqHZ8.js";
-import "./chunk-KX2RTZJC-DopwIbE1.js";
-import "./chunk-PQ6SQG4A-DPz_e-Es.js";
-import "./chunk-KYZI473N-4Y4_4kXL.js";
-import "./chunk-O4XLMI2P-BcKxBhcn.js";
-import "./chunk-GLR3WWYH-GIQ55uMn.js";
-import { i as t, n, r, t as i } from "./chunk-WL4C6EOR-B2OMxQLL.js";
-//#region node_modules/mermaid/dist/chunks/mermaid.core/classDiagram-VBA2DB6C.mjs
-var a = {
-	parser: n,
-	get db() {
-		return new i();
-	},
-	renderer: r,
-	styles: t,
-	init: /* @__PURE__ */ e((e) => {
-		e.class ||= {}, e.class.arrowMarkerAbsolute = e.arrowMarkerAbsolute;
-	}, "init")
-};
-//#endregion
-export { a as diagram };
-
-//# sourceMappingURL=classDiagram-VBA2DB6C-DFfohpM0.js.map

package/dist/classDiagram-v2-RAHNMMFH-kUMm28FB.js

@@ -1,31 +0,0 @@
-import "./chunk-GEFDOKGD-bXEkwPrJ.js";
-import { n as e } from "./src-hxErHTV1.js";
-import "./chunk-7R4GIKGN-DiZ1HYFd.js";
-import "./chunk-PU5JKC2W-CAfe4Tg3.js";
-import "./chunk-FMBD7UC4-7bd068zf.js";
-import "./chunk-MX3YWQON-DnBlqD44.js";
-import "./chunk-YBOYWFTD-DVqQ1pen.js";
-import "./chunk-JSJVCQXG-p-BUVvps.js";
-import "./chunk-55IACEB6-DxNTqHZ8.js";
-import "./chunk-KX2RTZJC-DopwIbE1.js";
-import "./chunk-PQ6SQG4A-DPz_e-Es.js";
-import "./chunk-KYZI473N-4Y4_4kXL.js";
-import "./chunk-O4XLMI2P-BcKxBhcn.js";
-import "./chunk-GLR3WWYH-GIQ55uMn.js";
-import { i as t, n, r, t as i } from "./chunk-WL4C6EOR-B2OMxQLL.js";
-//#region node_modules/mermaid/dist/chunks/mermaid.core/classDiagram-v2-RAHNMMFH.mjs
-var a = {
-	parser: n,
-	get db() {
-		return new i();
-	},
-	renderer: r,
-	styles: t,
-	init: /* @__PURE__ */ e((e) => {
-		e.class ||= {}, e.class.arrowMarkerAbsolute = e.arrowMarkerAbsolute;
-	}, "init")
-};
-//#endregion
-export { a as diagram };
-
-//# sourceMappingURL=classDiagram-v2-RAHNMMFH-kUMm28FB.js.map

package/dist/components/theme/theme-studio.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"theme-studio.js","names":[],"sources":["../../../src/components/theme/theme-studio.ts"],"sourcesContent":["import { resetTheme } from '../../services/theme-engine'\nimport { AccentSwitcher } from './accent-switcher'\nimport { DensitySwitcher } from './density-switcher'\nimport { FontStackPicker } from './font-stack-picker'\nimport { GlassSlider } from './glass-slider'\nimport { IconSetPicker } from './icon-set-picker'\nimport { IconUsageMatrix } from './icon-usage-matrix'\nimport { RadiusSlider } from './radius-slider'\nimport { ThemePresetGrid } from './theme-preset-grid'\nimport { ThemePreviewTile } from './theme-preview-tile'\nimport { ThemeSwitcher } from './theme-switcher'\n\nexport interface ThemeStudioOptions {\n  showTabs?: boolean\n  showHeader?: boolean\n  showBrandSection?: boolean\n}\n\nconst DEFAULT_OPTIONS: Required<ThemeStudioOptions> = {\n  showTabs: true,\n  showHeader: true,\n  showBrandSection: true,\n}\n\nfunction el<K extends keyof HTMLElementTagNameMap>(\n  tag: K,\n  className?: string,\n  text?: string\n): HTMLElementTagNameMap[K] {\n  const node = document.createElement(tag)\n  if (className) node.className = className\n  if (text !== undefined) node.textContent = text\n  return node\n}\n\nfunction buildSection(\n  title: string,\n  helper: string,\n  body: HTMLElement,\n  rightSlot?: HTMLElement\n): HTMLElement {\n  const section = el('section', 'theme-studio-section')\n  const head = el('div', 'theme-studio-section__head')\n  const titles = el('div', 'theme-studio-section__titles')\n  titles.appendChild(el('h3', 'theme-studio-section__title', title))\n  titles.appendChild(el('div', 'theme-studio-section__helper', helper))\n  head.appendChild(titles)\n  if (rightSlot) head.appendChild(rightSlot)\n  section.appendChild(head)\n  section.appendChild(body)\n  return section\n}\n\nfunction buildTabStrip(): HTMLElement {\n  const strip = el('div', 'theme-studio-tabs')\n  const tabs = ['Profile', 'Organization', 'Appearance', 'About'] as const\n  for (const tab of tabs) {\n    const button = el('button', 'theme-studio-tab', tab)\n    button.type = 'button'\n    if (tab === 'Appearance') button.classList.add('is-active')\n    button.disabled = tab !== 'Appearance'\n    strip.appendChild(button)\n  }\n  return strip\n}\n\nfunction buildResetLink(): HTMLButtonElement {\n  const button = el('button', 'theme-studio-link', 'Reset to default')\n  button.type = 'button'\n  button.addEventListener('click', () => {\n    resetTheme()\n  })\n  return button\n}\n\nfunction buildAdvanced(): HTMLElement {\n  const wrap = el('div', 'theme-studio-advanced')\n\n  const densityRow = el('div', 'theme-studio-advanced__row')\n  densityRow.appendChild(new DensitySwitcher().el)\n  wrap.appendChild(densityRow)\n\n  const radiusRow = el('div', 'theme-studio-advanced__row')\n  radiusRow.appendChild(new RadiusSlider().el)\n  wrap.appendChild(radiusRow)\n\n  const matrixHead = el('div', 'theme-studio-advanced__matrix-head')\n  matrixHead.appendChild(el('h4', 'theme-studio-advanced__matrix-title', 'Per-icon mapping'))\n  matrixHead.appendChild(\n    el(\n      'p',\n      'theme-studio-advanced__matrix-helper',\n      'Rebind any icon slot. Useful if your team thinks of detection as a bug instead of a shield.'\n    )\n  )\n  wrap.appendChild(matrixHead)\n\n  wrap.appendChild(new IconUsageMatrix().el)\n  return wrap\n}\n\nfunction buildAdvancedSection(): HTMLElement {\n  const details = document.createElement('details')\n  details.className = 'theme-studio-section theme-studio-section--advanced'\n\n  const summary = document.createElement('summary')\n  summary.className = 'theme-studio-section__head theme-studio-section__head--summary'\n\n  const titles = el('div', 'theme-studio-section__titles')\n  titles.appendChild(el('h3', 'theme-studio-section__title', 'Advanced'))\n  titles.appendChild(\n    el('div', 'theme-studio-section__helper', 'Density, corner radius, and per-icon overrides')\n  )\n  summary.appendChild(titles)\n\n  const toggle = el('span', 'theme-studio-section__chev', 'Show')\n  summary.appendChild(toggle)\n\n  details.appendChild(summary)\n  details.appendChild(buildAdvanced())\n\n  details.addEventListener('toggle', () => {\n    toggle.textContent = details.open ? 'Hide' : 'Show'\n  })\n\n  return details\n}\n\nexport class ThemeStudio {\n  public readonly el: HTMLElement\n  private readonly options: Required<ThemeStudioOptions>\n\n  constructor(options: ThemeStudioOptions = {}) {\n    this.options = { ...DEFAULT_OPTIONS, ...options }\n    this.el = document.createElement('section')\n    this.el.className = 'theme-studio-pane'\n    this.render()\n  }\n\n  render(): void {\n    this.el.innerHTML = ''\n\n    if (this.options.showTabs) {\n      this.el.appendChild(buildTabStrip())\n    }\n\n    if (this.options.showHeader) {\n      const header = el('header', 'theme-studio-pane__header')\n      header.appendChild(el('h1', 'theme-studio-pane__title', 'Appearance'))\n      header.appendChild(\n        el(\n          'p',\n          'theme-studio-pane__subtitle',\n          'Customize how CounterMeasure looks. Pick a preset, tweak the color mode, accent, transparency, typography, and icons. Changes apply immediately and persist on this device.'\n        )\n      )\n      this.el.appendChild(header)\n    }\n\n    this.el.appendChild(\n      buildSection(\n        'Start from a preset',\n        'Curated combinations of mode, accent, font, and icon style.',\n        new ThemePresetGrid().el,\n        buildResetLink()\n      )\n    )\n\n    this.el.appendChild(\n      buildSection(\n        'Live preview',\n        'A miniature app shell that re-renders as you tweak settings below.',\n        new ThemePreviewTile().el\n      )\n    )\n\n    this.el.appendChild(\n      buildSection('Color Mode', 'Choose how the interface looks.', new ThemeSwitcher().el)\n    )\n    this.el.appendChild(\n      buildSection(\n        'Accent Color',\n        'Pick a color that highlights actions and links.',\n        new AccentSwitcher().el\n      )\n    )\n    this.el.appendChild(\n      buildSection(\n        'Surface Transparency',\n        'How translucent panels, hover states, and overlays appear.',\n        new GlassSlider({ expanded: true }).el\n      )\n    )\n    this.el.appendChild(\n      buildSection(\n        'Typography',\n        'Select the typeface used throughout the app.',\n        new FontStackPicker().el\n      )\n    )\n    this.el.appendChild(\n      buildSection(\n        'Icon Set',\n        'Choose the icon style for navigation and content.',\n        new IconSetPicker().el\n      )\n    )\n\n    if (this.options.showBrandSection) {\n      const brandBody = el('div', 'theme-studio-brand-note')\n      brandBody.appendChild(\n        el(\n          'p',\n          'theme-studio-brand-note__text',\n          'Brand assets live under design-system brand resources. Switch icon sets to CounterMeasure above to apply the bespoke security glyphs.'\n        )\n      )\n      this.el.appendChild(\n        buildSection('Brand', 'Logo, wordmark, and brand glyph references.', brandBody)\n      )\n    }\n    this.el.appendChild(buildAdvancedSection())\n  }\n}\n\nexport function renderThemeStudio(\n  container: HTMLElement,\n  options?: ThemeStudioOptions\n): ThemeStudio {\n  const studio = new ThemeStudio(options)\n  container.innerHTML = ''\n  container.appendChild(studio.el)\n  return studio\n}\n"],"mappings":"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"}

package/dist/dist-DGayZ3ok2.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"dist-DGayZ3ok2.js","names":["React"],"sources":["../node_modules/@radix-ui/react-portal/dist/index.mjs"],"sourcesContent":["\"use client\";\n\n// src/portal.tsx\nimport * as React from \"react\";\nimport ReactDOM from \"react-dom\";\nimport { Primitive } from \"@radix-ui/react-primitive\";\nimport { useLayoutEffect } from \"@radix-ui/react-use-layout-effect\";\nimport { jsx } from \"react/jsx-runtime\";\nvar PORTAL_NAME = \"Portal\";\nvar Portal = React.forwardRef((props, forwardedRef) => {\n  const { container: containerProp, ...portalProps } = props;\n  const [mounted, setMounted] = React.useState(false);\n  useLayoutEffect(() => setMounted(true), []);\n  const container = containerProp || mounted && globalThis?.document?.body;\n  return container ? ReactDOM.createPortal(/* @__PURE__ */ jsx(Primitive.div, { ...portalProps, ref: forwardedRef }), container) : null;\n});\nPortal.displayName = PORTAL_NAME;\nvar Root = Portal;\nexport {\n  Portal,\n  Root\n};\n//# sourceMappingURL=index.mjs.map\n"],"x_google_ignoreList":[0],"mappings":";;;;;AAQA,IAAI,IAAc,UACd,IAASA,EAAM,YAAY,GAAO,MAAiB;CACrD,IAAM,EAAE,WAAW,GAAe,GAAG,MAAgB,GAC/C,CAAC,GAAS,KAAcA,EAAM,SAAS,GAAM;AACnD,SAAsB,EAAW,GAAK,EAAE,EAAE,CAAC;CAC3C,IAAM,IAAY,KAAiB,KAAW,YAAY,UAAU;AACpE,QAAO,IAAY,EAAS,aAA6B,kBAAI,EAAU,KAAK;EAAE,GAAG;EAAa,KAAK;EAAc,CAAC,EAAE,EAAU,GAAG;EACjI;AACF,EAAO,cAAc"}

package/dist/gitGraph-HDMCJU4V--53HTu2M.js

@@ -1,3 +0,0 @@
-import "./chunk-XZSTWKYB-BZB_wvbZ.js";
-import { n as e } from "./chunk-7E7YKBS2-Bewg8t99.js";
-export { e as createGitGraphServices };

package/dist/info-3K5VOQVL-CmVeZuiG.js

@@ -1,3 +0,0 @@
-import "./chunk-XZSTWKYB-BZB_wvbZ.js";
-import { n as e } from "./chunk-EGIJ26TM-1-wU_wPi.js";
-export { e as createInfoServices };

package/dist/packet-RMMSAZCW-jFj7IW8A.js

@@ -1,3 +0,0 @@
-import "./chunk-XZSTWKYB-BZB_wvbZ.js";
-import { n as e } from "./chunk-C72U2L5F-BqOejReq.js";
-export { e as createPacketServices };

package/dist/pie-UPGHQEXC-osqmeuax.js

@@ -1,3 +0,0 @@
-import "./chunk-XZSTWKYB-BZB_wvbZ.js";
-import { n as e } from "./chunk-XIRO2GV7-D1_jT4ch.js";
-export { e as createPieServices };

package/dist/radar-KQ55EAFF-Dj2g5Z-W.js

@@ -1,3 +0,0 @@
-import "./chunk-XZSTWKYB-BZB_wvbZ.js";
-import { n as e } from "./chunk-L3YUKLVL-U6LYvPh7.js";
-export { e as createRadarServices };

package/dist/stateDiagram-v2-FVOUBMTO-Cnp2uGxd.js

@@ -1,29 +0,0 @@
-import "./chunk-GEFDOKGD-bXEkwPrJ.js";
-import { n as e } from "./src-hxErHTV1.js";
-import "./chunk-7R4GIKGN-DiZ1HYFd.js";
-import "./chunk-PU5JKC2W-CAfe4Tg3.js";
-import "./chunk-MX3YWQON-DnBlqD44.js";
-import "./chunk-YBOYWFTD-DVqQ1pen.js";
-import "./chunk-55IACEB6-DxNTqHZ8.js";
-import "./chunk-KX2RTZJC-DopwIbE1.js";
-import "./chunk-PQ6SQG4A-DPz_e-Es.js";
-import "./chunk-KYZI473N-4Y4_4kXL.js";
-import "./chunk-O4XLMI2P-BcKxBhcn.js";
-import "./chunk-GLR3WWYH-GIQ55uMn.js";
-import { i as t, n, r, t as i } from "./chunk-NQ4KR5QH-BSylMz0X.js";
-//#region node_modules/mermaid/dist/chunks/mermaid.core/stateDiagram-v2-FVOUBMTO.mjs
-var a = {
-	parser: n,
-	get db() {
-		return new i(2);
-	},
-	renderer: r,
-	styles: t,
-	init: /* @__PURE__ */ e((e) => {
-		e.state ||= {}, e.state.arrowMarkerAbsolute = e.arrowMarkerAbsolute;
-	}, "init")
-};
-//#endregion
-export { a as diagram };
-
-//# sourceMappingURL=stateDiagram-v2-FVOUBMTO-Cnp2uGxd.js.map

package/dist/treemap-KZPCXAKY-DQ1GEudW.js

@@ -1,3 +0,0 @@
-import "./chunk-XZSTWKYB-BZB_wvbZ.js";
-import { n as e } from "./chunk-OZEHJAEY-D6S6KbwY.js";
-export { e as createTreemapServices };

package/dist/utils-CHEq9Vpx.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"utils-CHEq9Vpx.js","names":[],"sources":["../src/utils/validation.ts","../src/utils/errors.ts","../src/utils/touch.ts"],"sourcesContent":["/**\n * Shared input validation utilities\n * @countermeasure/web-components/utils/validation\n */\n\nexport interface ValidationResult {\n  valid: boolean\n  message?: string\n}\n\nexport interface ValidationRule {\n  validate: (value: unknown) => boolean\n  message: string\n}\n\n/** Validate that a value is not empty */\nexport function validateRequired(value: unknown): boolean {\n  if (value === null || value === undefined) return false\n  if (typeof value === 'string') return value.trim().length > 0\n  return true\n}\n\n/** Validate an email address format */\nexport function validateEmail(value: string): boolean {\n  return /^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/.test(value)\n}\n\n/** Validate a URL format */\nexport function validateUrl(value: string): boolean {\n  try {\n    new URL(value)\n    return true\n  } catch {\n    return false\n  }\n}\n\n/** Validate minimum length */\nexport function validateMinLength(value: string, min: number): boolean {\n  return value.length >= min\n}\n\n/** Validate maximum length */\nexport function validateMaxLength(value: string, max: number): boolean {\n  return value.length <= max\n}\n\n/** Validate a value matches a regex pattern */\nexport function validatePattern(value: string, pattern: RegExp): boolean {\n  return pattern.test(value)\n}\n\n/**\n * Create a composite validator from an array of rules.\n * Returns the first failing validation result, or valid if all pass.\n */\nexport function createValidator(rules: ValidationRule[]): (value: unknown) => ValidationResult {\n  return (value: unknown): ValidationResult => {\n    for (const rule of rules) {\n      if (!rule.validate(value)) {\n        return { valid: false, message: rule.message }\n      }\n    }\n    return { valid: true }\n  }\n}\n","/**\n * Shared error classes for consistent error handling\n * @countermeasure/web-components/utils/errors\n */\n\n/** Base error class for all component library errors */\nexport class ComponentError extends Error {\n  constructor(message: string) {\n    super(message)\n    this.name = 'ComponentError'\n  }\n}\n\n/** Error thrown when configuration is invalid */\nexport class ConfigError extends ComponentError {\n  constructor(component: string, message: string) {\n    super(`[${component}] ${message}`)\n    this.name = 'ConfigError'\n  }\n}\n\n/** Error thrown during input validation */\nexport class ValidationError extends ComponentError {\n  public readonly field: string\n\n  constructor(field: string, message: string) {\n    super(`Validation failed for \"${field}\": ${message}`)\n    this.name = 'ValidationError'\n    this.field = field\n  }\n}\n\n/** Error thrown during network operations */\nexport class NetworkError extends ComponentError {\n  public readonly status: number\n  public readonly statusText: string\n\n  constructor(status: number, statusText: string, message?: string) {\n    super(message ?? `HTTP ${String(status)}: ${statusText}`)\n    this.name = 'NetworkError'\n    this.status = status\n    this.statusText = statusText\n  }\n}\n","/**\n * Touch and gesture utilities for web components\n * @countermeasure/web-components/utils/touch\n *\n * Provides swipe detection, touch-or-click handling,\n * and pinch-to-zoom support for mobile accessibility.\n */\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport type SwipeDirection = 'left' | 'right' | 'up' | 'down'\n\nexport interface SwipeOptions {\n  /** Minimum distance in pixels to trigger a swipe (default: 50) */\n  threshold?: number\n  /** Maximum time in ms for a swipe gesture (default: 300) */\n  timeout?: number\n  /** Callback when swipe is detected */\n  onSwipe?: (direction: SwipeDirection, event: TouchEvent) => void\n  /** Callback when swipe starts */\n  onSwipeStart?: (event: TouchEvent) => void\n  /** Callback when swipe ends without triggering */\n  onSwipeEnd?: (event: TouchEvent) => void\n  /** Whether to prevent default behavior during swipe */\n  preventDefault?: boolean\n}\n\nexport interface SwipeDetector {\n  /** Enable swipe detection */\n  enable: () => void\n  /** Disable swipe detection */\n  disable: () => void\n  /** Check if detection is enabled */\n  isEnabled: () => boolean\n  /** Clean up event listeners */\n  destroy: () => void\n}\n\nexport interface PinchOptions {\n  /** Minimum scale change to trigger callback (default: 0.1) */\n  threshold?: number\n  /** Callback when pinch is detected */\n  onPinch?: (scale: number, event: TouchEvent) => void\n  /** Callback when pinch starts */\n  onPinchStart?: (event: TouchEvent) => void\n  /** Callback when pinch ends */\n  onPinchEnd?: (event: TouchEvent) => void\n}\n\nexport interface PinchDetector {\n  /** Enable pinch detection */\n  enable: () => void\n  /** Disable pinch detection */\n  disable: () => void\n  /** Get the current pinch scale */\n  getScale: () => number\n  /** Reset scale to 1 */\n  resetScale: () => void\n  /** Clean up event listeners */\n  destroy: () => void\n}\n\nexport interface PanOptions {\n  /** Callback when pan occurs */\n  onPan?: (deltaX: number, deltaY: number, event: TouchEvent) => void\n  /** Callback when pan starts */\n  onPanStart?: (event: TouchEvent) => void\n  /** Callback when pan ends */\n  onPanEnd?: (event: TouchEvent) => void\n  /** Whether to prevent default behavior during pan */\n  preventDefault?: boolean\n}\n\nexport interface PanDetector {\n  /** Enable pan detection */\n  enable: () => void\n  /** Disable pan detection */\n  disable: () => void\n  /** Clean up event listeners */\n  destroy: () => void\n}\n\n// ============================================================================\n// Swipe Detection\n// ============================================================================\n\n/**\n * Create a swipe gesture detector for an element.\n * Detects horizontal and vertical swipes with configurable threshold.\n */\nexport function detectSwipe(element: HTMLElement, options: SwipeOptions = {}): SwipeDetector {\n  const {\n    threshold = 50,\n    timeout = 300,\n    onSwipe,\n    onSwipeStart,\n    onSwipeEnd,\n    preventDefault = false,\n  } = options\n\n  let enabled = true\n  let startX = 0\n  let startY = 0\n  let startTime = 0\n\n  const handleTouchStart = (event: TouchEvent): void => {\n    if (!enabled) {\n      return\n    }\n\n    const touch = event.touches[0]\n    if (touch === undefined) {\n      return\n    }\n\n    startX = touch.clientX\n    startY = touch.clientY\n    startTime = Date.now()\n\n    onSwipeStart?.(event)\n  }\n\n  const handleTouchEnd = (event: TouchEvent): void => {\n    if (!enabled || startTime === 0) {\n      return\n    }\n\n    const touch = event.changedTouches[0]\n    if (touch === undefined) {\n      return\n    }\n\n    const endX = touch.clientX\n    const endY = touch.clientY\n    const endTime = Date.now()\n\n    const deltaX = endX - startX\n    const deltaY = endY - startY\n    const elapsed = endTime - startTime\n\n    // Reset start time\n    startTime = 0\n\n    // Check if gesture was within timeout\n    if (elapsed > timeout) {\n      onSwipeEnd?.(event)\n      return\n    }\n\n    const absX = Math.abs(deltaX)\n    const absY = Math.abs(deltaY)\n\n    // Determine swipe direction\n    if (absX >= threshold || absY >= threshold) {\n      if (preventDefault) {\n        event.preventDefault()\n      }\n\n      let direction: SwipeDirection\n      if (absX > absY) {\n        direction = deltaX > 0 ? 'right' : 'left'\n      } else {\n        direction = deltaY > 0 ? 'down' : 'up'\n      }\n\n      onSwipe?.(direction, event)\n    } else {\n      onSwipeEnd?.(event)\n    }\n  }\n\n  const handleTouchMove = (event: TouchEvent): void => {\n    if (!enabled || !preventDefault) {\n      return\n    }\n\n    const touch = event.touches[0]\n    if (touch === undefined) {\n      return\n    }\n\n    const deltaX = Math.abs(touch.clientX - startX)\n    const deltaY = Math.abs(touch.clientY - startY)\n\n    // Prevent scrolling if swipe seems intentional\n    if (deltaX > 10 || deltaY > 10) {\n      event.preventDefault()\n    }\n  }\n\n  element.addEventListener('touchstart', handleTouchStart, { passive: true })\n  element.addEventListener('touchend', handleTouchEnd, { passive: !preventDefault })\n  if (preventDefault) {\n    element.addEventListener('touchmove', handleTouchMove, { passive: false })\n  }\n\n  return {\n    enable: () => {\n      enabled = true\n    },\n    disable: () => {\n      enabled = false\n    },\n    isEnabled: () => enabled,\n    destroy: () => {\n      element.removeEventListener('touchstart', handleTouchStart)\n      element.removeEventListener('touchend', handleTouchEnd)\n      element.removeEventListener('touchmove', handleTouchMove)\n    },\n  }\n}\n\n// ============================================================================\n// Touch or Click Handler\n// ============================================================================\n\n/**\n * Handle both touch and click events without double-firing.\n * Uses touch events on touch devices, click events otherwise.\n */\nexport function handleTouchOrClick(\n  element: HTMLElement,\n  callback: (event: TouchEvent | MouseEvent) => void\n): () => void {\n  let touchHandled = false\n\n  const handleTouchStart = (event: TouchEvent): void => {\n    touchHandled = true\n    callback(event)\n  }\n\n  const handleClick = (event: MouseEvent): void => {\n    // Ignore if touch already handled (prevents double-firing on touch devices)\n    if (touchHandled) {\n      touchHandled = false\n      return\n    }\n    callback(event)\n  }\n\n  element.addEventListener('touchstart', handleTouchStart, { passive: true })\n  element.addEventListener('click', handleClick)\n\n  return () => {\n    element.removeEventListener('touchstart', handleTouchStart)\n    element.removeEventListener('click', handleClick)\n  }\n}\n\n/**\n * Add a touchstart handler that also works with mouse for accessibility.\n * Returns a cleanup function.\n */\nexport function onPointerDown(\n  element: HTMLElement,\n  callback: (event: PointerEvent | TouchEvent | MouseEvent) => void\n): () => void {\n  // Prefer PointerEvent if supported\n  if ('PointerEvent' in window) {\n    const handler = (event: PointerEvent): void => {\n      callback(event)\n    }\n    element.addEventListener('pointerdown', handler)\n    return () => {\n      element.removeEventListener('pointerdown', handler)\n    }\n  }\n\n  // Fallback for older browsers\n  let touchHandled = false\n\n  const handleTouchStart = (event: TouchEvent): void => {\n    touchHandled = true\n    callback(event)\n  }\n\n  const handleMouseDown = (event: MouseEvent): void => {\n    if (touchHandled) {\n      touchHandled = false\n      return\n    }\n    callback(event)\n  }\n\n  element.addEventListener('touchstart', handleTouchStart, { passive: true })\n  element.addEventListener('mousedown', handleMouseDown)\n\n  return () => {\n    element.removeEventListener('touchstart', handleTouchStart)\n    element.removeEventListener('mousedown', handleMouseDown)\n  }\n}\n\n// ============================================================================\n// Pinch-to-Zoom Detection\n// ============================================================================\n\n/**\n * Get the distance between two touch points.\n */\nfunction getTouchDistance(touches: TouchList): number {\n  if (touches.length < 2) {\n    return 0\n  }\n  const touch1 = touches[0]\n  const touch2 = touches[1]\n  if (touch1 === undefined || touch2 === undefined) {\n    return 0\n  }\n  const dx = touch1.clientX - touch2.clientX\n  const dy = touch1.clientY - touch2.clientY\n  return Math.sqrt(dx * dx + dy * dy)\n}\n\n/**\n * Create a pinch-to-zoom detector for an element.\n */\nexport function detectPinch(element: HTMLElement, options: PinchOptions = {}): PinchDetector {\n  const { threshold = 0.1, onPinch, onPinchStart, onPinchEnd } = options\n\n  let enabled = true\n  let isPinching = false\n  let initialDistance = 0\n  let currentScale = 1\n\n  const handleTouchStart = (event: TouchEvent): void => {\n    if (!enabled || event.touches.length < 2) {\n      return\n    }\n\n    isPinching = true\n    initialDistance = getTouchDistance(event.touches)\n    currentScale = 1\n\n    onPinchStart?.(event)\n  }\n\n  const handleTouchMove = (event: TouchEvent): void => {\n    if (!enabled || !isPinching || event.touches.length < 2) {\n      return\n    }\n\n    const currentDistance = getTouchDistance(event.touches)\n    if (initialDistance === 0) {\n      return\n    }\n\n    const newScale = currentDistance / initialDistance\n    const scaleDelta = Math.abs(newScale - currentScale)\n\n    if (scaleDelta >= threshold) {\n      currentScale = newScale\n      onPinch?.(currentScale, event)\n    }\n  }\n\n  const handleTouchEnd = (event: TouchEvent): void => {\n    if (!enabled || !isPinching) {\n      return\n    }\n\n    if (event.touches.length < 2) {\n      isPinching = false\n      onPinchEnd?.(event)\n    }\n  }\n\n  element.addEventListener('touchstart', handleTouchStart, { passive: true })\n  element.addEventListener('touchmove', handleTouchMove, { passive: true })\n  element.addEventListener('touchend', handleTouchEnd, { passive: true })\n  element.addEventListener('touchcancel', handleTouchEnd, { passive: true })\n\n  return {\n    enable: () => {\n      enabled = true\n    },\n    disable: () => {\n      enabled = false\n      isPinching = false\n    },\n    getScale: () => currentScale,\n    resetScale: () => {\n      currentScale = 1\n    },\n    destroy: () => {\n      element.removeEventListener('touchstart', handleTouchStart)\n      element.removeEventListener('touchmove', handleTouchMove)\n      element.removeEventListener('touchend', handleTouchEnd)\n      element.removeEventListener('touchcancel', handleTouchEnd)\n    },\n  }\n}\n\n// ============================================================================\n// Pan Detection\n// ============================================================================\n\n/**\n * Create a pan (single-finger drag) detector for an element.\n */\nexport function detectPan(element: HTMLElement, options: PanOptions = {}): PanDetector {\n  const { onPan, onPanStart, onPanEnd, preventDefault = false } = options\n\n  let enabled = true\n  let isPanning = false\n  let lastX = 0\n  let lastY = 0\n\n  const handleTouchStart = (event: TouchEvent): void => {\n    if (!enabled || event.touches.length !== 1) {\n      return\n    }\n\n    const touch = event.touches[0]\n    if (touch === undefined) {\n      return\n    }\n\n    isPanning = true\n    lastX = touch.clientX\n    lastY = touch.clientY\n\n    onPanStart?.(event)\n  }\n\n  const handleTouchMove = (event: TouchEvent): void => {\n    if (!enabled || !isPanning || event.touches.length !== 1) {\n      return\n    }\n\n    const touch = event.touches[0]\n    if (touch === undefined) {\n      return\n    }\n\n    if (preventDefault) {\n      event.preventDefault()\n    }\n\n    const deltaX = touch.clientX - lastX\n    const deltaY = touch.clientY - lastY\n\n    lastX = touch.clientX\n    lastY = touch.clientY\n\n    onPan?.(deltaX, deltaY, event)\n  }\n\n  const handleTouchEnd = (event: TouchEvent): void => {\n    if (!enabled || !isPanning) {\n      return\n    }\n\n    isPanning = false\n    onPanEnd?.(event)\n  }\n\n  element.addEventListener('touchstart', handleTouchStart, { passive: true })\n  element.addEventListener('touchmove', handleTouchMove, { passive: !preventDefault })\n  element.addEventListener('touchend', handleTouchEnd, { passive: true })\n  element.addEventListener('touchcancel', handleTouchEnd, { passive: true })\n\n  return {\n    enable: () => {\n      enabled = true\n    },\n    disable: () => {\n      enabled = false\n      isPanning = false\n    },\n    destroy: () => {\n      element.removeEventListener('touchstart', handleTouchStart)\n      element.removeEventListener('touchmove', handleTouchMove)\n      element.removeEventListener('touchend', handleTouchEnd)\n      element.removeEventListener('touchcancel', handleTouchEnd)\n    },\n  }\n}\n\n// ============================================================================\n// Long Press Detection\n// ============================================================================\n\nexport interface LongPressOptions {\n  /** Duration in ms to trigger long press (default: 500) */\n  duration?: number\n  /** Callback when long press is triggered */\n  onLongPress?: (event: TouchEvent) => void\n  /** Movement threshold in pixels to cancel long press (default: 10) */\n  moveThreshold?: number\n}\n\nexport interface LongPressDetector {\n  /** Enable detection */\n  enable: () => void\n  /** Disable detection */\n  disable: () => void\n  /** Clean up */\n  destroy: () => void\n}\n\n/**\n * Create a long press detector for context menu or similar actions.\n */\nexport function detectLongPress(\n  element: HTMLElement,\n  options: LongPressOptions = {}\n): LongPressDetector {\n  const { duration = 500, onLongPress, moveThreshold = 10 } = options\n\n  let enabled = true\n  let timeoutId: ReturnType<typeof setTimeout> | null = null\n  let startX = 0\n  let startY = 0\n\n  const handleTouchStart = (event: TouchEvent): void => {\n    if (!enabled) {\n      return\n    }\n\n    const touch = event.touches[0]\n    if (touch === undefined) {\n      return\n    }\n\n    startX = touch.clientX\n    startY = touch.clientY\n\n    timeoutId = setTimeout(() => {\n      onLongPress?.(event)\n    }, duration)\n  }\n\n  const handleTouchMove = (event: TouchEvent): void => {\n    if (timeoutId === null) {\n      return\n    }\n\n    const touch = event.touches[0]\n    if (touch === undefined) {\n      return\n    }\n\n    const deltaX = Math.abs(touch.clientX - startX)\n    const deltaY = Math.abs(touch.clientY - startY)\n\n    if (deltaX > moveThreshold || deltaY > moveThreshold) {\n      clearTimeout(timeoutId)\n      timeoutId = null\n    }\n  }\n\n  const handleTouchEnd = (): void => {\n    if (timeoutId !== null) {\n      clearTimeout(timeoutId)\n      timeoutId = null\n    }\n  }\n\n  element.addEventListener('touchstart', handleTouchStart, { passive: true })\n  element.addEventListener('touchmove', handleTouchMove, { passive: true })\n  element.addEventListener('touchend', handleTouchEnd, { passive: true })\n  element.addEventListener('touchcancel', handleTouchEnd, { passive: true })\n\n  return {\n    enable: () => {\n      enabled = true\n    },\n    disable: () => {\n      enabled = false\n      if (timeoutId !== null) {\n        clearTimeout(timeoutId)\n        timeoutId = null\n      }\n    },\n    destroy: () => {\n      if (timeoutId !== null) {\n        clearTimeout(timeoutId)\n      }\n      element.removeEventListener('touchstart', handleTouchStart)\n      element.removeEventListener('touchmove', handleTouchMove)\n      element.removeEventListener('touchend', handleTouchEnd)\n      element.removeEventListener('touchcancel', handleTouchEnd)\n    },\n  }\n}\n\n// ============================================================================\n// Device Detection Helpers\n// ============================================================================\n\n/**\n * Check if the device supports touch events.\n */\nexport function isTouchDevice(): boolean {\n  return 'ontouchstart' in window || navigator.maxTouchPoints > 0\n}\n\n/**\n * Check if the device is likely a mobile device based on screen size.\n */\nexport function isMobileViewport(): boolean {\n  return window.innerWidth < 768\n}\n\n/**\n * Check if the device is in portrait orientation.\n */\nexport function isPortrait(): boolean {\n  return window.innerHeight > window.innerWidth\n}\n\n/**\n * Get the safe area insets for notched devices.\n */\nexport function getSafeAreaInsets(): {\n  top: number\n  right: number\n  bottom: number\n  left: number\n} {\n  const style = getComputedStyle(document.documentElement)\n\n  const parseValue = (prop: string): number => {\n    const value = style.getPropertyValue(prop)\n    const parsed = parseInt(value, 10)\n    return isNaN(parsed) ? 0 : parsed\n  }\n\n  const getValue = (customProp: string, envProp: string): number => {\n    const custom = parseValue(customProp)\n    return custom !== 0 ? custom : parseValue(envProp)\n  }\n\n  return {\n    top: getValue('--safe-area-inset-top', 'env(safe-area-inset-top)'),\n    right: getValue('--safe-area-inset-right', 'env(safe-area-inset-right)'),\n    bottom: getValue('--safe-area-inset-bottom', 'env(safe-area-inset-bottom)'),\n    left: getValue('--safe-area-inset-left', 'env(safe-area-inset-left)'),\n  }\n}\n"],"mappings":"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"}