@dataverse-kit/surface-kit 0.3.0 → 0.4.1

package/dist/index.mjs

@@ -494,18 +494,23 @@ var Section = ({
     ...style
   };
   const styles = mergeStyleSets3({
-    card: { ...dynamicsCardStyle, boxShadow: cardShadow, padding: cardPad, minWidth: 300, width: "100%" },
+    // box-sizing:border-box so the 20px padding + 1px border are contained within
+    // `width:100%` — otherwise the card renders 42px wider than its grid cell and
+    // spills off the right edge (dashboards, page sections, fields inside dialogs).
+    card: { ...dynamicsCardStyle, boxSizing: "border-box", boxShadow: cardShadow, padding: cardPad, minWidth: 0, width: "100%" },
     flat: {
       background: colors.surface,
       borderRadius: radius.card,
+      boxSizing: "border-box",
       padding: cardPad,
-      minWidth: 300,
+      minWidth: 0,
       width: "100%",
       overflow: "hidden"
     },
     placeholder: {
       border: `1px dashed ${colors.borderNeutral}`,
       borderRadius: radius.card,
+      boxSizing: "border-box",
       minHeight,
       width: "100%",
       background: "transparent"
@@ -561,6 +566,7 @@ var SectionCard = ({
 );
 
 // src/containers/FormHeader.tsx
+import React2 from "react";
 import { mergeStyleSets as mergeStyleSets4 } from "@fluentui/react";
 import { jsx as jsx9, jsxs as jsxs4 } from "react/jsx-runtime";
 var FormHeader = ({
@@ -570,6 +576,7 @@ var FormHeader = ({
   titleColor,
   subtitleColor,
   persona,
+  headerFields,
   actions,
   className
 }) => {
@@ -593,8 +600,29 @@ var FormHeader = ({
       lineHeight: "1.3"
     },
     status: { fontSize: typography.fontSize.smPlus, color: colors.textSecondary },
-    subtitle: { fontSize: typography.fontSize.smPlus, color: subtitleColor || colors.textSecondary, marginTop: 2 }
+    subtitle: { fontSize: typography.fontSize.smPlus, color: subtitleColor || colors.textSecondary, marginTop: 2 },
+    // Right cluster: Dynamics header-field summary tiles (value over label) separated by
+    // hairline dividers — mirrors form-runtime HeaderShell's SummaryTile.
+    right: { display: "flex", alignItems: "center", justifyContent: "flex-end", flexWrap: "wrap", minWidth: 0 },
+    field: { display: "flex", flexDirection: "column", gap: 2, maxWidth: 200, minWidth: 0 },
+    fieldValue: {
+      fontSize: typography.fontSize.md,
+      fontWeight: typography.fontWeight.semibold,
+      color: colors.textPrimary,
+      whiteSpace: "nowrap",
+      overflow: "hidden",
+      textOverflow: "ellipsis"
+    },
+    fieldLabel: {
+      fontSize: typography.fontSize.sm,
+      color: colors.textSecondary,
+      whiteSpace: "nowrap",
+      overflow: "hidden",
+      textOverflow: "ellipsis"
+    },
+    divider: { width: 1, height: 24, background: colors.borderNeutral, margin: "0 12px", flexShrink: 0 }
   });
+  const hasFields = headerFields != null && headerFields.length > 0;
   return /* @__PURE__ */ jsxs4("div", { className: [styles.root, className].filter(Boolean).join(" "), children: [
     /* @__PURE__ */ jsxs4("div", { className: styles.main, children: [
       persona,
@@ -606,13 +634,29 @@ var FormHeader = ({
         subtitle != null && /* @__PURE__ */ jsx9("div", { className: styles.subtitle, children: subtitle })
       ] })
     ] }),
-    actions != null && /* @__PURE__ */ jsx9("div", { children: actions })
+    (hasFields || actions != null) && /* @__PURE__ */ jsxs4("div", { className: styles.right, children: [
+      hasFields && headerFields.map((f, i) => /* @__PURE__ */ jsxs4(React2.Fragment, { children: [
+        i > 0 && /* @__PURE__ */ jsx9("div", { className: styles.divider, "aria-hidden": true }),
+        /* @__PURE__ */ jsxs4("div", { className: styles.field, children: [
+          /* @__PURE__ */ jsx9(
+            "div",
+            {
+              className: styles.fieldValue,
+              title: typeof f.value === "string" ? f.value : void 0,
+              children: f.value
+            }
+          ),
+          /* @__PURE__ */ jsx9("div", { className: styles.fieldLabel, children: f.label })
+        ] })
+      ] }, i)),
+      actions != null && /* @__PURE__ */ jsx9("div", { style: { marginLeft: hasFields ? 12 : 0 }, children: actions })
+    ] })
   ] });
 };
 
 // src/containers/PivotSurface.tsx
 import { useState as useState4 } from "react";
-import { Pivot, PivotItem } from "@fluentui/react";
+import { Pivot, PivotItem, TooltipHost } from "@fluentui/react";
 import { jsx as jsx10, jsxs as jsxs5 } from "react/jsx-runtime";
 var PivotSurface = ({
   tabs,
@@ -628,10 +672,12 @@ var PivotSurface = ({
   const handleLinkClick = (item) => {
     const id = item?.props.itemKey;
     if (!id) return;
+    if (tabs.find((t) => t.id === id)?.disabled) return;
     if (selectedId == null) setInternal(id);
     onTabChange?.(id);
   };
   const active = tabs.find((t) => t.id === selected) ?? tabs[0];
+  const renderItemLink = (tab) => tab.tooltip ? (props, defaultRender) => /* @__PURE__ */ jsx10(TooltipHost, { content: tab.tooltip, children: defaultRender?.(props) }) : void 0;
   return /* @__PURE__ */ jsxs5("div", { className, children: [
     /* @__PURE__ */ jsx10(
       Pivot,
@@ -646,7 +692,8 @@ var PivotSurface = ({
             itemKey: t.id,
             headerText: t.label,
             itemIcon: t.iconName,
-            headerButtonProps: t.disabled ? { disabled: true } : void 0
+            onRenderItemLink: renderItemLink(t),
+            headerButtonProps: t.disabled ? { disabled: true, style: { opacity: 0.4, cursor: "not-allowed", pointerEvents: "none" } } : void 0
           },
           t.id
         ))
@@ -675,16 +722,22 @@ function renderButton(b) {
   if (b.appearance === "subtle") return /* @__PURE__ */ jsx12(ActionButton, { ...common }, b.id);
   return /* @__PURE__ */ jsx12(DefaultButton, { ...common }, b.id);
 }
-var ActionBar = ({ buttons, alignment = "right", sticky = true, className }) => {
+var ActionBar = ({
+  buttons,
+  alignment = "right",
+  inverted = false,
+  sticky = true,
+  className
+}) => {
   const justify = alignment === "left" ? "flex-start" : alignment === "center" ? "center" : "flex-end";
   const visible = buttons.filter((b) => !b.hidden);
   const left = visible.filter((b) => b.position === "left");
   const right = visible.filter((b) => b.position !== "left");
+  const rightOrdered = inverted ? [...right].reverse() : right;
   const cls = mergeStyles4(
     {
       display: "flex",
       alignItems: "center",
-      justifyContent: left.length ? "space-between" : justify,
       gap: 8,
       padding: "12px 24px",
       borderTop: `1px solid ${colors.borderNeutral}`,
@@ -695,7 +748,7 @@ var ActionBar = ({ buttons, alignment = "right", sticky = true, className }) =>
   );
   return /* @__PURE__ */ jsxs6("div", { className: cls, children: [
     left.length > 0 && /* @__PURE__ */ jsx12("div", { style: { display: "flex", gap: 8 }, children: left.map(renderButton) }),
-    /* @__PURE__ */ jsx12("div", { style: { display: "flex", gap: 8, justifyContent: justify }, children: right.map(renderButton) })
+    /* @__PURE__ */ jsx12("div", { style: { display: "flex", flex: 1, gap: 8, justifyContent: justify }, children: rightOrdered.map(renderButton) })
   ] });
 };
 
@@ -758,8 +811,7 @@ var FormDialogSurface = ({
     subheader: { fontSize: typography.fontSize.smPlus, color: colors.textSecondary, marginTop: 2 },
     headerRight: { display: "flex", alignItems: "center", gap: 8 },
     counter: { fontSize: typography.fontSize.smPlus, color: colors.textSecondary },
-    content: { flex: 1, minHeight: 0, overflow: "auto", padding: 20 },
-    footer: { borderTop: `1px solid ${colors.borderNeutral}`, padding: "12px 20px" }
+    content: { flex: 1, minHeight: 0, overflow: "auto", padding: 20 }
   });
   const showHeader = Boolean(title) || Boolean(recordCounter) || Boolean(onDismiss);
   return /* @__PURE__ */ jsxs7(
@@ -810,7 +862,7 @@ var FormDialogSurface = ({
           ] })
         ] }),
         /* @__PURE__ */ jsx14("div", { className: styles.content, children }),
-        footer && /* @__PURE__ */ jsx14("div", { className: styles.footer, children: footer })
+        footer
       ]
     }
   );
@@ -840,19 +892,12 @@ var ModalSurface = ({
       color: colors.textPrimary,
       padding: "16px 20px 0"
     },
-    content: { padding: 20 },
-    footer: {
-      borderTop: `1px solid ${colors.borderNeutral}`,
-      padding: "12px 20px",
-      display: "flex",
-      justifyContent: "flex-end",
-      gap: 8
-    }
+    content: { padding: 20 }
   });
   return /* @__PURE__ */ jsxs8(Modal2, { isOpen, onDismiss, isBlocking, className, styles: { main }, children: [
     title && /* @__PURE__ */ jsx15("div", { className: styles.title, children: title }),
     /* @__PURE__ */ jsx15("div", { className: styles.content, children }),
-    footer && /* @__PURE__ */ jsx15("div", { className: styles.footer, children: footer })
+    footer
   ] });
 };
 
@@ -926,7 +971,7 @@ var CalloutSurface = ({
 };
 
 // src/overlays/TooltipSurface.tsx
-import { TooltipHost, DirectionalHint as DirectionalHint2, TooltipDelay } from "@fluentui/react";
+import { TooltipHost as TooltipHost2, DirectionalHint as DirectionalHint2, TooltipDelay } from "@fluentui/react";
 import { jsx as jsx18 } from "react/jsx-runtime";
 var DELAY_MAP = {
   zero: TooltipDelay.zero,
@@ -938,7 +983,7 @@ var TooltipSurface = ({
   directionalHint = "bottomCenter",
   delay = "medium",
   children
-}) => /* @__PURE__ */ jsx18(TooltipHost, { content, directionalHint: DirectionalHint2[directionalHint], delay: DELAY_MAP[delay], children });
+}) => /* @__PURE__ */ jsx18(TooltipHost2, { content, directionalHint: DirectionalHint2[directionalHint], delay: DELAY_MAP[delay], children });
 
 // src/composites/MasterDetailSurface.tsx
 import { mergeStyles as mergeStyles6 } from "@fluentui/react";

package/dist/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/core/sizePresets.ts","../src/core/columns.ts","../src/responsive/breakpoints.ts","../src/responsive/builders.ts","../src/tokens/tokens.ts","../src/tokens/theme.ts","../src/tokens/density.ts","../src/hooks/useContainerSize.ts","../src/hooks/useContainerWidth.ts","../src/hooks/useContainerBreakpoint.ts","../src/hooks/useResponsiveValue.ts","../src/hooks/useMediaQuery.ts","../src/hooks/useDensity.ts","../src/layouts/ColumnLayout.tsx","../src/layouts/TwoColumnLayout.tsx","../src/layouts/FieldRow.tsx","../src/containers/FormSurface.tsx","../src/internal/styles.ts","../src/containers/PageSurface.tsx","../src/containers/Section.tsx","../src/containers/SectionHeader.tsx","../src/containers/SectionCard.tsx","../src/containers/FormHeader.tsx","../src/containers/PivotSurface.tsx","../src/containers/CommandSurface.tsx","../src/containers/ActionBar.tsx","../src/containers/Footer.tsx","../src/overlays/FormDialogSurface.tsx","../src/overlays/ModalSurface.tsx","../src/overlays/PanelSurface.tsx","../src/overlays/CalloutSurface.tsx","../src/overlays/TooltipSurface.tsx","../src/composites/MasterDetailSurface.tsx","../src/composites/DashboardSurface.tsx","../src/adapters/fromFormDefinition.ts"],"sourcesContent":["// Pure-TS sizing scalars for overlay surfaces. The SINGLE SOURCE of the numbers\n// that both surface-kit's runtime overlays AND the export-engine codegen use, so a\n// Dialog is 1200px wide in exactly one place. Framework-agnostic (no react/@fluentui).\n//\n// Values mirror export-engine/src/generators/FormCodeGenerator.ts (v8 branches):\n//   dialog: default width 1200; height <=100 -> `${h}vh` else '95vh'\n//   panel:  kind = (width ?? 480) > 500 ? 'medium' : 'custom'; custom width = width ?? 480\n//   callout (form-type): default width 320; directionalHint 'bottomLeftEdge'\n// v1c wires export-engine to import these; a byte-identical emission test guards drift.\n\n// --- Dialog --------------------------------------------------------------------\n\nexport type DialogSizePreset = 'sm' | 'md' | 'lg' | 'xl' | 'fullscreen';\n\n// NOTE: only the lg = 1200 default and an explicit `width` are the shared-with-codegen\n// contract (export-engine does `width ?? 1200`). The sm/md/xl/fullscreen presets are\n// surface-kit runtime conveniences with no codegen counterpart — v1c does NOT consume them.\nexport const DIALOG_SIZE_PX = {\n  sm: 600,\n  md: 900,\n  lg: 1200,\n  xl: 1600,\n} as const;\n\n/** Resolved dialog width in px. Explicit `width` wins; else the preset (default lg = 1200, the codegen default). */\nexport function dialogWidthPx(opts: { width?: number; size?: DialogSizePreset } = {}): number {\n  if (typeof opts.width === 'number') return opts.width;\n  const size = opts.size ?? 'lg';\n  // fullscreen is clamped by 95vw at the CSS layer; fall back to the largest preset for the px hint.\n  if (size === 'fullscreen') return DIALOG_SIZE_PX.xl;\n  return DIALOG_SIZE_PX[size];\n}\n\n/** Dialog width as a CSS value — '95vw' for the fullscreen preset (no explicit width), else `${px}px`. */\nexport function dialogWidthCss(opts: { width?: number; size?: DialogSizePreset } = {}): string {\n  if (opts.size === 'fullscreen' && opts.width == null) return '95vw';\n  return `${dialogWidthPx(opts)}px`;\n}\n\n/** Dialog height as a CSS value. <=100 is treated as a vh percentage; otherwise the 95vh cap (codegen rule). */\nexport function dialogHeightCss(height?: number): string {\n  return height != null && height <= 100 ? `${height}vh` : '95vh';\n}\n\n/** Min width for an auto-sized ModalSurface (the Track-and-Ship \"min 1000, auto\" pattern). */\nexport const MODAL_AUTOSIZE_MIN_WIDTH = 1000;\n\n// --- Panel ---------------------------------------------------------------------\n\nexport type PanelKind = 'medium' | 'custom';\nexport const PANEL_DEFAULT_WIDTH = 480;\n\n/** Codegen-parity panel kind: wide panels use Fluent `medium`, narrow ones `custom` + customWidth. */\nexport function panelKindFromWidth(width?: number): PanelKind {\n  return (width ?? PANEL_DEFAULT_WIDTH) > 500 ? 'medium' : 'custom';\n}\n\n/** customWidth px for a `custom` panel. */\nexport function panelCustomWidthPx(width?: number): number {\n  return width ?? PANEL_DEFAULT_WIDTH;\n}\n\n// --- Callout -------------------------------------------------------------------\n\nexport const CALLOUT_DEFAULT_WIDTH = 320;\n\n/** Form-type callout defaults (the export-engine form-callout path emits width + directionalHint only). */\nexport const calloutFormDefaults = {\n  width: CALLOUT_DEFAULT_WIDTH,\n  directionalHint: 'bottomLeftEdge',\n} as const;\n\nexport function calloutWidthPx(width?: number): number {\n  return width ?? CALLOUT_DEFAULT_WIDTH;\n}\n","// Pure-TS column helpers shared by layouts/containers and the responsive builders.\nexport type ColumnCount = 1 | 2 | 3 | 4;\n\n/** CSS grid-template-columns for an N-column layout. Matches codegen `repeat(N, 1fr)`. */\nexport function gridTemplateForColumns(columns: ColumnCount): string {\n  return `repeat(${columns}, 1fr)`;\n}\n\n/** Clamp a cell column-span to the available column count (min 1). */\nexport function clampSpan(span: number, columns: ColumnCount): number {\n  if (!Number.isFinite(span)) return 1;\n  return Math.max(1, Math.min(Math.round(span), columns));\n}\n","// Named responsive breakpoints (px). The 480/768 cutoffs match the export-engine\n// section/field stacking; CARD_REFLOW_WIDTH (900) matches the CardGrid reflow\n// emitter (a separate cutoff). Pure-TS (no react/@fluentui).\nexport type Breakpoint = 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n\nexport const BREAKPOINTS: Record<Breakpoint, number> = {\n  xs: 0,\n  sm: 480,\n  md: 768,\n  lg: 1024,\n  xl: 1366,\n};\n\n/** The card-grid reflow cutoff the codegen CardGrid emitter uses (distinct from the 480/768 field/section cutoffs). */\nexport const CARD_REFLOW_WIDTH = 900;\n\nconst DESCENDING: Breakpoint[] = ['xl', 'lg', 'md', 'sm', 'xs'];\nconst ASCENDING: Breakpoint[] = ['xs', 'sm', 'md', 'lg', 'xl'];\n\n/** Largest breakpoint whose min-width is <= width. */\nexport function resolveBreakpoint(width: number): Breakpoint {\n  for (const bp of DESCENDING) {\n    if (width >= BREAKPOINTS[bp]) return bp;\n  }\n  return 'xs';\n}\n\nexport type ResponsiveValue<T> = T | Partial<Record<Breakpoint, T>>;\n\nfunction isResponsiveMap<T>(v: ResponsiveValue<T>): v is Partial<Record<Breakpoint, T>> {\n  return typeof v === 'object' && v !== null && ASCENDING.some((bp) => bp in (v as object));\n}\n\n/**\n * Resolve a responsive value at a breakpoint, cascading mobile-first: pick the\n * nearest defined value at or below `breakpoint`, else the nearest defined above.\n */\nexport function resolveResponsiveValue<T>(value: ResponsiveValue<T>, breakpoint: Breakpoint): T | undefined {\n  if (!isResponsiveMap(value)) return value as T;\n  const map = value;\n  const idx = ASCENDING.indexOf(breakpoint);\n  for (let i = idx; i >= 0; i--) {\n    const v = map[ASCENDING[i]];\n    if (v !== undefined) return v;\n  }\n  for (let i = idx + 1; i < ASCENDING.length; i++) {\n    const v = map[ASCENDING[i]];\n    if (v !== undefined) return v;\n  }\n  return undefined;\n}\n","// Pure-TS responsive style-object builders. Every responsive stacking decision in\n// surface-kit flows through here so viewport (`mode:'media'`) and container\n// (`mode:'container'`) stacking share the same 480/768 cutoffs. The numeric values\n// (gaps, minHeight, alignItems) mirror the export-engine fieldGrid/fieldRow/\n// tabSectionsGrid emitters so the eventual emitMode:'surface-kit' rewrite is parity.\n// Returned objects are structurally compatible with Fluent's `IStyle` (the `selectors`\n// shape) but typed locally so this layer stays framework-agnostic (no @fluentui import).\nimport { BREAKPOINTS } from './breakpoints';\nimport { gridTemplateForColumns, type ColumnCount } from '../core/columns';\n\nexport type StyleObject = Record<string, unknown>;\nexport type ResponsiveMode = 'media' | 'container';\n\nfunction atRule(mode: ResponsiveMode, maxPx: number): string {\n  return mode === 'container'\n    ? `@container (max-width: ${maxPx}px)`\n    : `@media (max-width: ${maxPx}px)`;\n}\n\n/** N-column field grid that caps at 2 columns on tablet (<=768) and stacks to 1 on phone (<=480). */\nexport function fieldGridStyle(columns: ColumnCount, mode: ResponsiveMode = 'media'): StyleObject {\n  const capped = Math.min(columns, 2) as ColumnCount;\n  return {\n    display: 'grid',\n    gridTemplateColumns: gridTemplateForColumns(columns),\n    gap: '4px 24px',\n    selectors: {\n      [atRule(mode, BREAKPOINTS.md)]: { gridTemplateColumns: gridTemplateForColumns(capped) },\n      [atRule(mode, BREAKPOINTS.sm)]: { gridTemplateColumns: '1fr' },\n    },\n  };\n}\n\n/** Multi-section tab row that collapses straight to a single column on tablet (<=768). */\nexport function sectionStackingStyle(gridTemplateColumns: string, mode: ResponsiveMode = 'media'): StyleObject {\n  return {\n    display: 'grid',\n    gridTemplateColumns,\n    gap: 16,\n    alignItems: 'start',\n    selectors: {\n      [atRule(mode, BREAKPOINTS.md)]: { gridTemplateColumns: '1fr' },\n    },\n  };\n}\n\n/** \"Label : input\" row that collapses the label above the input on phone (<=480). */\nexport function fieldRowStyle(labelWidth = '130px', mode: ResponsiveMode = 'media'): StyleObject {\n  return {\n    display: 'grid',\n    gridTemplateColumns: `${labelWidth} 1fr`,\n    alignItems: 'center',\n    gap: 8,\n    minHeight: 38,\n    selectors: {\n      [atRule(mode, BREAKPOINTS.sm)]: { gridTemplateColumns: '1fr', alignItems: 'flex-start', minHeight: 0, gap: 4 },\n    },\n  };\n}\n","// Re-exported from @dataverse-kit/design-tokens — the single canonical source of the\n// Dynamics design tokens. surface-kit no longer keeps its own copy (this retires the old\n// \"SYNCED FROM reusable-components\" duplication). The values are pure-TS (no react /\n// no @fluentui), so they remain safe to import from anywhere. `createDynamicsTheme()` and\n// `density` stay here in surface-kit (see ./theme and ./density).\nexport { colors, spacing, typography, radius, layout } from '@dataverse-kit/design-tokens';\n","import { createTheme, type Theme } from '@fluentui/react';\nimport { colors, typography } from './tokens';\n\n// The genuinely-missing layer: a single Fluent v8 theme built from the canonical\n// tokens. No shared package exposes a `createTheme` literal today (every client\n// re-inlines its own `dynamicsTheme`); surface-kit establishes the one builder they\n// collapse into.\nexport function createDynamicsTheme(): Theme {\n  return createTheme({\n    palette: {\n      themePrimary: colors.brand,\n      themeDarkAlt: colors.brandHover,\n      themeDark: colors.brandDark,\n      themeDarker: colors.brandDark,\n      neutralPrimary: colors.textPrimary,\n      neutralSecondary: colors.textSecondary,\n      neutralLight: colors.borderNeutral,\n      neutralLighter: colors.surfaceAlt,\n      white: colors.surface,\n      redDark: colors.danger,\n    },\n    defaultFontStyle: {\n      fontFamily: typography.fontFamily,\n    },\n    semanticColors: {\n      errorText: colors.danger,\n      inputBorder: colors.fieldBorder,\n      inputBackground: colors.fieldFill,\n      bodyBackground: colors.surface,\n    },\n  });\n}\n","// Spacing density multiplier — `comfortable` (Dynamics default) vs `compact`\n// (denser forms / embedded PCF). Pure-TS.\nexport type Density = 'comfortable' | 'compact';\n\nexport const densityScale = {\n  comfortable: 1,\n  compact: 0.75,\n} as const;\n\n/** Scale a base spacing value (px) by the active density. */\nexport function scaleSpacing(value: number, density: Density = 'comfortable'): number {\n  return Math.round(value * densityScale[density]);\n}\n","// SYNCED FROM: shared/responsive-patterns/03-layouts/container-query/ContainerQuery.tsx (useContainerSize)\n// Inlined, not aliased: shared/responsive-patterns is outside the npm workspace. The\n// ContainerSize type is inlined here too (rather than vendoring shared/shared/types).\n// This is a React hook, so it lives in hooks/ (NOT responsive/, which must stay\n// framework-agnostic for the ./responsive subpath that export-engine inlines).\nimport * as React from 'react';\nimport { useState, useEffect } from 'react';\n\nexport interface ContainerSize {\n  width: number;\n  height: number;\n  inlineSize: number;\n  blockSize: number;\n}\n\n/** Observe an element's size via ResizeObserver. Pass a ref; returns {width,height,inlineSize,blockSize}. */\nexport function useContainerSize<T extends HTMLElement = HTMLElement>(ref: React.RefObject<T>): ContainerSize {\n  const [size, setSize] = useState<ContainerSize>({ width: 0, height: 0, inlineSize: 0, blockSize: 0 });\n\n  useEffect(() => {\n    if (!ref.current || typeof ResizeObserver === 'undefined') return;\n\n    const observer = new ResizeObserver((entries) => {\n      for (const entry of entries) {\n        const { width, height } = entry.contentRect;\n        const inlineSize = entry.borderBoxSize?.[0]?.inlineSize ?? width;\n        const blockSize = entry.borderBoxSize?.[0]?.blockSize ?? height;\n        setSize({ width, height, inlineSize, blockSize });\n      }\n    });\n\n    observer.observe(ref.current);\n    return () => observer.disconnect();\n  }, [ref]);\n\n  return size;\n}\n","import * as React from 'react';\nimport { useRef } from 'react';\nimport { useContainerSize } from './useContainerSize';\n\n/**\n * Create-and-return a ref plus the observed width of the element it is attached to.\n * `const [ref, width] = useContainerWidth(); return <div ref={ref}>…</div>`.\n */\nexport function useContainerWidth<T extends HTMLElement = HTMLDivElement>(): [React.RefObject<T>, number] {\n  const ref = useRef<T>(null);\n  const { width } = useContainerSize(ref);\n  return [ref, width];\n}\n","import type * as React from 'react';\nimport { resolveBreakpoint, type Breakpoint } from '../responsive/breakpoints';\nimport { useContainerWidth } from './useContainerWidth';\n\n/**\n * Resolve the *container's* current breakpoint (not the viewport's) — the correctness\n * fix for a surface inside a PCF, where width comes from `context.allocatedWidth`.\n * Returns `[ref, breakpoint, width]`.\n */\nexport function useContainerBreakpoint<T extends HTMLElement = HTMLDivElement>(): [React.RefObject<T>, Breakpoint, number] {\n  const [ref, width] = useContainerWidth<T>();\n  return [ref, resolveBreakpoint(width), width];\n}\n","import type * as React from 'react';\nimport { resolveResponsiveValue, type ResponsiveValue } from '../responsive/breakpoints';\nimport { useContainerBreakpoint } from './useContainerBreakpoint';\n\n/**\n * Resolve a responsive value against the *container's* current breakpoint.\n * `const [ref, cols] = useResponsiveValue({ xs: 1, md: 2, lg: 3 });`\n */\nexport function useResponsiveValue<T, E extends HTMLElement = HTMLDivElement>(\n  value: ResponsiveValue<T>,\n): [React.RefObject<E>, T | undefined] {\n  const [ref, breakpoint] = useContainerBreakpoint<E>();\n  return [ref, resolveResponsiveValue(value, breakpoint)];\n}\n","import { useState, useEffect } from 'react';\n\n/** Viewport media-query match — the SSR-safe / no-ResizeObserver fallback to the container hooks. */\nexport function useMediaQuery(query: string): boolean {\n  const [matches, setMatches] = useState<boolean>(() => {\n    if (typeof window === 'undefined' || typeof window.matchMedia !== 'function') return false;\n    return window.matchMedia(query).matches;\n  });\n\n  useEffect(() => {\n    if (typeof window === 'undefined' || typeof window.matchMedia !== 'function') return;\n    const mql = window.matchMedia(query);\n    const onChange = () => setMatches(mql.matches);\n    onChange();\n    mql.addEventListener('change', onChange);\n    return () => mql.removeEventListener('change', onChange);\n  }, [query]);\n\n  return matches;\n}\n","import { createContext, useContext } from 'react';\nimport type { Density } from '../tokens/density';\n\n/**\n * Form-level spacing density. `FormSurface` provides it; `Section` (and any future\n * container) reads it via `useDensity()`, so a single `density` switch on the form\n * cascades to every section instead of being set per-section. Defaults to\n * `'comfortable'` (the Dynamics default) — `'compact'` scales spacing by 0.75.\n */\nexport const DensityContext = createContext<Density>('comfortable');\n\n/** Read the ambient spacing density (defaults to `'comfortable'` outside a provider). */\nexport const useDensity = (): Density => useContext(DensityContext);\n","import React from 'react';\nimport { mergeStyles, type IStyle } from '@fluentui/react';\nimport type { ColumnLayoutProps } from '../types';\nimport { fieldGridStyle } from '../responsive/builders';\nimport { gridTemplateForColumns } from '../core/columns';\n\n/** N-column grid for form fields. Responsive by default (caps at 2 cols <=768, 1 <=480). */\nexport const ColumnLayout: React.FC<ColumnLayoutProps> = ({\n  columns,\n  gap = '4px 24px',\n  responsive = true,\n  mode = 'media',\n  className,\n  style,\n  children,\n}) => {\n  const base: IStyle = responsive\n    ? (fieldGridStyle(columns, mode) as IStyle)\n    : { display: 'grid', gridTemplateColumns: gridTemplateForColumns(columns) };\n  const cls = mergeStyles(base, { gap } as IStyle, className);\n  return (\n    <div className={cls} style={style}>\n      {children}\n    </div>\n  );\n};\n\nexport default ColumnLayout;\n","import React from 'react';\nimport { mergeStyles, type IStyle } from '@fluentui/react';\nimport type { TwoColumnLayoutProps } from '../types';\nimport { BREAKPOINTS } from '../responsive/breakpoints';\n\n/** Two equal columns that collapse to one below `collapseBelow` (default 'sm' = 480). */\nexport const TwoColumnLayout: React.FC<TwoColumnLayoutProps> = ({\n  gap = 16,\n  collapseBelow = 'sm',\n  className,\n  style,\n  children,\n}) => {\n  const cls = mergeStyles(\n    {\n      display: 'grid',\n      gridTemplateColumns: '1fr 1fr',\n      gap,\n      alignItems: 'start',\n      selectors: {\n        [`@media (max-width: ${BREAKPOINTS[collapseBelow]}px)`]: { gridTemplateColumns: '1fr' },\n      },\n    } as IStyle,\n    className,\n  );\n  return (\n    <div className={cls} style={style}>\n      {children}\n    </div>\n  );\n};\n\nexport default TwoColumnLayout;\n","import React from 'react';\nimport { mergeStyleSets, type IStyle } from '@fluentui/react';\nimport type { FieldRowProps } from '../types';\nimport { colors, typography } from '../tokens/tokens';\nimport { fieldRowStyle } from '../responsive/builders';\n\n// Ported + extended from reusable-components/src/ui/primitives/FieldRow.tsx — adds\n// `labelPosition` and a phone-stacking @480 rule on top of the same 130px label grid.\n\n/** A two-column \"Label : control\" row. The control goes in `children` (right column). */\nexport const FieldRow: React.FC<FieldRowProps> = ({\n  label,\n  required,\n  fullWidth,\n  labelWidth = '130px',\n  labelPosition = 'beside',\n  className,\n  children,\n}) => {\n  const styles = mergeStyleSets({\n    // The beside layout IS the shared responsive builder (130px label grid + @480\n    // stack) — no hand-written breakpoint here.\n    rowBeside: fieldRowStyle(labelWidth, 'media') as IStyle,\n    rowAbove: {\n      display: 'grid',\n      gridTemplateColumns: '1fr',\n      gap: 2,\n      minHeight: 38,\n    },\n    label: {\n      fontSize: typography.fontSize.sm,\n      fontWeight: typography.fontWeight.semibold,\n      color: colors.textPrimary,\n      fontFamily: typography.fontFamily,\n      lineHeight: '1.3',\n      wordBreak: 'break-word',\n    },\n    required: { color: colors.danger, marginLeft: 2, fontWeight: typography.fontWeight.semibold },\n    full: { gridColumn: '1 / -1' },\n  });\n\n  const cls = [\n    labelPosition === 'above' ? styles.rowAbove : styles.rowBeside,\n    fullWidth ? styles.full : '',\n    className,\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  return (\n    <div className={cls}>\n      {label != null && (\n        <span className={styles.label}>\n          {label}\n          {required && <span className={styles.required}>*</span>}\n        </span>\n      )}\n      {children}\n    </div>\n  );\n};\n\nexport default FieldRow;\n","import React from 'react';\nimport { mergeStyles, type IStyle } from '@fluentui/react';\nimport type { FormSurfaceProps } from '../types';\nimport { colors } from '../tokens/tokens';\nimport { scaleSpacing } from '../tokens/density';\nimport { BREAKPOINTS } from '../responsive/breakpoints';\nimport { stackChildrenBelow } from '../internal/styles';\nimport { DensityContext } from '../hooks/useDensity';\n\n// Ported from reusable-components Form's body grid. The outer N-column form canvas\n// that Sections sit on. Stacks children to full width below `collapseBelow` — driven\n// by the *container* width when `containerWidth` is supplied (PCF allocatedWidth),\n// else by the viewport via @media.\n\n/** The N-column form canvas that hosts Sections. */\nexport const FormSurface: React.FC<FormSurfaceProps> = ({\n  columns = 12,\n  gap = 20,\n  padding = 20,\n  density = 'comfortable',\n  background = colors.canvas,\n  containerWidth,\n  collapseBelow = 'sm',\n  maxWidth,\n  className,\n  style,\n  children,\n}) => {\n  const collapsePx = BREAKPOINTS[collapseBelow];\n  const forceStack = containerWidth != null && containerWidth <= collapsePx;\n  // Density scales the canvas gap + padding; cascades to child Sections via context.\n  // `comfortable` is x1, so an unset/comfortable density is byte-identical to before.\n  const scaledGap = scaleSpacing(gap, density);\n  const scaledPadding = scaleSpacing(padding, density);\n\n  const cls = mergeStyles(\n    {\n      display: 'grid',\n      gridTemplateColumns: forceStack ? '1fr' : `repeat(${columns}, 1fr)`,\n      gap: scaledGap,\n      padding: scaledPadding,\n      background,\n      alignItems: 'start',\n      ...(maxWidth != null ? { maxWidth, marginLeft: 'auto', marginRight: 'auto' } : {}),\n      // When the container forces a single column, reset child spans the same way the\n      // viewport fallback does — otherwise a Section with `columnStart` references grid\n      // lines that no longer exist and escapes the stack. (Mutually exclusive with the\n      // @media fallback below, which only applies when containerWidth is unset.)\n      ...(forceStack ? { selectors: { '> *': { gridColumn: '1 / -1' } } } : {}),\n      // Viewport fallback only when the container width isn't explicitly provided.\n      ...(containerWidth == null ? stackChildrenBelow(collapsePx) : {}),\n    } as IStyle,\n    className,\n  );\n\n  return (\n    <DensityContext.Provider value={density}>\n      <div className={cls} style={style}>\n        {children}\n      </div>\n    </DensityContext.Provider>\n  );\n};\n\nexport default FormSurface;\n","// Shared Dynamics-CE style fragments used across containers. Not part of the public\n// API. Fluent v8 mergeStyles `IRawStyle` fragments built from the canonical tokens.\nimport type { IRawStyle } from '@fluentui/react';\nimport { colors, typography, radius } from '../tokens/tokens';\n\n/** Dynamics section/header title (Segoe UI Semibold 14 / #323130). */\nexport const sharedTitleStyle: IRawStyle = {\n  fontWeight: typography.fontWeight.semibold,\n  fontSize: typography.fontSize.md,\n  color: colors.textPrimary,\n  fontFamily: typography.fontFamilySemibold,\n  paddingBottom: 0,\n  marginBottom: 0,\n};\n\n/** White card with subtle neutral border + soft rounding (Dynamics card chrome). */\nexport const dynamicsCardStyle: IRawStyle = {\n  background: colors.surface,\n  border: `1px solid ${colors.borderNeutral}`,\n  borderRadius: radius.card,\n  overflow: 'hidden',\n};\n\n/** The subtle Fluent elevation used on Dynamics form cards. */\nexport const cardShadow =\n  '0 1.6px 3.6px rgba(0, 0, 0, 0.08), 0 0.3px 0.9px rgba(0, 0, 0, 0.05)';\n\n/** Stack direct grid children to full width below `maxPx` (viewport @media). */\nexport function stackChildrenBelow(maxPx: number): IRawStyle {\n  return {\n    selectors: {\n      [`@media (max-width: ${maxPx}px)`]: {\n        selectors: { '> *': { gridColumn: '1 / -1' } },\n      },\n    },\n  };\n}\n","import React from 'react';\nimport type { PageSurfaceProps } from '../types';\nimport { FormSurface } from './FormSurface';\n\n/** A full-page FormSurface — optionally centered with a comfortable max width. */\nexport const PageSurface: React.FC<PageSurfaceProps> = ({ centered, maxWidth, ...rest }) => (\n  <FormSurface maxWidth={maxWidth ?? (centered ? 1200 : undefined)} {...rest} />\n);\n\nexport default PageSurface;\n","import React, { useState } from 'react';\nimport { mergeStyleSets, type IStyle } from '@fluentui/react';\nimport type { SectionProps } from '../types';\nimport { colors, radius } from '../tokens/tokens';\nimport { scaleSpacing } from '../tokens/density';\nimport { BREAKPOINTS } from '../responsive/breakpoints';\nimport { dynamicsCardStyle, cardShadow } from '../internal/styles';\nimport { useDensity } from '../hooks/useDensity';\nimport { SectionHeader } from './SectionHeader';\n\n// Ported + extended from reusable-components/src/ui/section/section.component.tsx.\n// Same grid-positioned white card + internal N-column field grid; adds the three\n// `variant`s (card/flat/placeholder), `collapsible`, and phone-stacking of the body.\n\n/** A Dynamics-CE form section: positioned card with a header and an internal field grid. */\nexport const Section: React.FC<SectionProps> = ({\n  title,\n  columnSpan = 12,\n  columnStart,\n  rowPosition,\n  internalColumns = 12,\n  showCommandBar,\n  commandBarItems,\n  statusText,\n  notification,\n  collapsible,\n  defaultCollapsed = false,\n  collapsed: controlledCollapsed,\n  onCollapsedChange,\n  variant = 'card',\n  minHeight = 80,\n  density: densityProp,\n  className,\n  style,\n  children,\n}) => {\n  const [internalCollapsed, setInternalCollapsed] = useState(defaultCollapsed);\n  const collapsed = controlledCollapsed ?? internalCollapsed;\n  const toggle = () => {\n    const next = !collapsed;\n    if (controlledCollapsed == null) setInternalCollapsed(next);\n    onCollapsedChange?.(next);\n  };\n\n  // Density: an explicit prop wins, else inherit the ambient FormSurface density.\n  // `comfortable` is x1, so the padding/gap strings are byte-identical to before.\n  const ctxDensity = useDensity();\n  const density = densityProp ?? ctxDensity;\n  const cardPad = `${scaleSpacing(3, density)}px ${scaleSpacing(20, density)}px ${scaleSpacing(20, density)}px ${scaleSpacing(20, density)}px`;\n  const bodyGap = scaleSpacing(7, density);\n\n  const gridColumn = columnStart ? `${columnStart} / span ${columnSpan}` : `span ${columnSpan}`;\n  const rootStyle: React.CSSProperties = {\n    gridColumn,\n    ...(rowPosition ? { gridRowStart: rowPosition } : {}),\n    ...style,\n  };\n\n  const styles = mergeStyleSets({\n    card: { ...dynamicsCardStyle, boxShadow: cardShadow, padding: cardPad, minWidth: 300, width: '100%' },\n    flat: {\n      background: colors.surface,\n      borderRadius: radius.card,\n      padding: cardPad,\n      minWidth: 300,\n      width: '100%',\n      overflow: 'hidden',\n    },\n    placeholder: {\n      border: `1px dashed ${colors.borderNeutral}`,\n      borderRadius: radius.card,\n      minHeight,\n      width: '100%',\n      background: 'transparent',\n    },\n    notification: { marginBottom: scaleSpacing(8, density) },\n    body: {\n      display: 'grid',\n      gridTemplateColumns: `repeat(${internalColumns}, 1fr)`,\n      gap: bodyGap,\n      alignItems: 'start',\n      selectors: {\n        [`@media (max-width: ${BREAKPOINTS.sm}px)`]: { selectors: { '> *': { gridColumn: '1 / -1' } } },\n      },\n    } as IStyle,\n  });\n\n  if (variant === 'placeholder') {\n    return <div className={[styles.placeholder, className].filter(Boolean).join(' ')} style={rootStyle} />;\n  }\n\n  const showHeader = Boolean(title) || showCommandBar || collapsible;\n\n  return (\n    <div className={[variant === 'flat' ? styles.flat : styles.card, className].filter(Boolean).join(' ')} style={rootStyle}>\n      {notification && <div className={styles.notification}>{notification}</div>}\n      {showHeader && (\n        <SectionHeader\n          title={title}\n          statusText={statusText}\n          showCommandBar={showCommandBar}\n          commandBarItems={commandBarItems}\n          collapsible={collapsible}\n          collapsed={collapsed}\n          onToggle={toggle}\n        />\n      )}\n      {!collapsed && <div className={styles.body}>{children}</div>}\n    </div>\n  );\n};\n\nexport default Section;\n","import React from 'react';\nimport { mergeStyleSets, CommandBar, Icon } from '@fluentui/react';\nimport type { SectionHeaderProps } from '../types';\nimport { colors } from '../tokens/tokens';\nimport { sharedTitleStyle } from '../internal/styles';\n\n// Ported from reusable-components section header: flex title + status on the left,\n// overflow CommandBar on the right, Dynamics neutral underline. Adds a collapse chevron.\n\n/** Section header bar: title + status (left), command bar / actions (right), optional collapse toggle. */\nexport const SectionHeader: React.FC<SectionHeaderProps> = ({\n  title,\n  statusText,\n  showCommandBar,\n  commandBarItems = [],\n  actions,\n  collapsible,\n  collapsed,\n  onToggle,\n}) => {\n  const styles = mergeStyleSets({\n    root: {\n      display: 'flex',\n      justifyContent: 'space-between',\n      alignItems: 'center',\n      flexWrap: 'nowrap',\n      borderBottom: `1px solid ${colors.borderNeutral}`,\n      marginBottom: 16,\n      minHeight: 48,\n      width: '100%',\n    },\n    left: { display: 'flex', alignItems: 'center', gap: 8, minWidth: 0 },\n    title: sharedTitleStyle,\n    status: { marginLeft: 8, fontSize: '0.9em', color: colors.textSecondary },\n    chevron: {\n      cursor: 'pointer',\n      border: 'none',\n      background: 'transparent',\n      padding: 4,\n      display: 'flex',\n      alignItems: 'center',\n      color: colors.textSecondary,\n    },\n  });\n\n  return (\n    <div className={styles.root}>\n      <div className={styles.left}>\n        {collapsible && (\n          <button\n            type=\"button\"\n            className={styles.chevron}\n            onClick={onToggle}\n            aria-label={collapsed ? 'Expand section' : 'Collapse section'}\n            aria-expanded={!collapsed}\n          >\n            <Icon iconName={collapsed ? 'ChevronRight' : 'ChevronDown'} />\n          </button>\n        )}\n        {title && <span className={styles.title}>{title}</span>}\n        {statusText && <span className={styles.status}>{statusText}</span>}\n      </div>\n      {actions ? (\n        <div>{actions}</div>\n      ) : showCommandBar && commandBarItems.length > 0 ? (\n        <CommandBar\n          items={commandBarItems.slice(0, 2)}\n          overflowItems={commandBarItems.slice(2)}\n          styles={{ root: { background: 'transparent', padding: 0, height: 'auto' } }}\n        />\n      ) : null}\n    </div>\n  );\n};\n\nexport default SectionHeader;\n","import React from 'react';\nimport type { SectionCardProps } from '../types';\nimport { colors } from '../tokens/tokens';\nimport { Section } from './Section';\n\n/**\n * A Section with the Dynamics blue 3px accent top border.\n * NOTE: the accent is an inline style so it wins over the `card` variant's shorthand\n * `border` (mergeStyles class). If the accent ever moves into a class, use the\n * `borderTop*` longhand so it isn't clobbered by the shorthand `border`.\n */\nexport const SectionCard: React.FC<SectionCardProps> = ({\n  accentColor = colors.brand,\n  accentWidth = 3,\n  variant = 'card',\n  style,\n  ...rest\n}) => (\n  <Section\n    variant={variant}\n    {...rest}\n    style={{ borderTop: `${accentWidth}px solid ${accentColor}`, ...style }}\n  />\n);\n\nexport default SectionCard;\n","import React from 'react';\nimport { mergeStyleSets } from '@fluentui/react';\nimport type { FormHeaderProps } from '../types';\nimport { colors, typography } from '../tokens/tokens';\n\n/** Dynamics form header: persona + title/status (left), KPI/header fields (right). */\nexport const FormHeader: React.FC<FormHeaderProps> = ({\n  title,\n  subtitle,\n  status,\n  titleColor,\n  subtitleColor,\n  persona,\n  actions,\n  className,\n}) => {\n  const styles = mergeStyleSets({\n    root: {\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'space-between',\n      gap: 12,\n      padding: '12px 24px',\n      borderBottom: `1px solid ${colors.borderNeutral}`,\n      background: colors.surface,\n    },\n    main: { display: 'flex', alignItems: 'center', gap: 12, minWidth: 0 },\n    titleRow: { display: 'flex', alignItems: 'baseline', gap: 8, flexWrap: 'wrap' },\n    title: {\n      fontSize: typography.fontSize.lg,\n      fontWeight: typography.fontWeight.semibold,\n      fontFamily: typography.fontFamilySemibold,\n      color: titleColor || colors.textPrimary,\n      lineHeight: '1.3',\n    },\n    status: { fontSize: typography.fontSize.smPlus, color: colors.textSecondary },\n    subtitle: { fontSize: typography.fontSize.smPlus, color: subtitleColor || colors.textSecondary, marginTop: 2 },\n  });\n\n  return (\n    <div className={[styles.root, className].filter(Boolean).join(' ')}>\n      <div className={styles.main}>\n        {persona}\n        <div>\n          <div className={styles.titleRow}>\n            {title != null && <span className={styles.title}>{title}</span>}\n            {status != null && <span className={styles.status}>{status}</span>}\n          </div>\n          {subtitle != null && <div className={styles.subtitle}>{subtitle}</div>}\n        </div>\n      </div>\n      {actions != null && <div>{actions}</div>}\n    </div>\n  );\n};\n\nexport default FormHeader;\n","import React, { useState } from 'react';\nimport { Pivot, PivotItem, type IPivotProps } from '@fluentui/react';\nimport type { PivotSurfaceProps } from '../types';\n\n/** Tabbed surface (Fluent Pivot). Controlled via `selectedId`/`onTabChange` or uncontrolled. */\nexport const PivotSurface: React.FC<PivotSurfaceProps> = ({\n  tabs,\n  selectedId,\n  defaultSelectedId,\n  onTabChange,\n  linkFormat = 'links',\n  className,\n}) => {\n  // Seed to the requested default, else the first *enabled* tab (don't open a disabled one).\n  const firstEnabledId = tabs.find((t) => !t.disabled)?.id ?? tabs[0]?.id;\n  const [internal, setInternal] = useState<string | undefined>(defaultSelectedId ?? firstEnabledId);\n  const selected = selectedId ?? internal;\n\n  const handleLinkClick = (item?: PivotItem) => {\n    const id = item?.props.itemKey;\n    if (!id) return;\n    if (selectedId == null) setInternal(id);\n    onTabChange?.(id);\n  };\n\n  const active = tabs.find((t) => t.id === selected) ?? tabs[0];\n\n  return (\n    <div className={className}>\n      <Pivot\n        selectedKey={selected}\n        onLinkClick={handleLinkClick}\n        linkFormat={linkFormat as IPivotProps['linkFormat']}\n        headersOnly\n      >\n        {tabs.map((t) => (\n          <PivotItem\n            key={t.id}\n            itemKey={t.id}\n            headerText={t.label}\n            itemIcon={t.iconName}\n            headerButtonProps={t.disabled ? { disabled: true } : undefined}\n          />\n        ))}\n      </Pivot>\n      <div>{active?.content}</div>\n    </div>\n  );\n};\n\nexport default PivotSurface;\n","import React from 'react';\nimport { CommandBar } from '@fluentui/react';\nimport type { CommandSurfaceProps } from '../types';\n\n/** A Dynamics-style command bar (thin wrapper over Fluent CommandBar, no card chrome). */\nexport const CommandSurface: React.FC<CommandSurfaceProps> = ({ items, overflowItems, farItems, className }) => (\n  <div className={className}>\n    <CommandBar items={items} overflowItems={overflowItems} farItems={farItems} styles={{ root: { padding: 0 } }} />\n  </div>\n);\n\nexport default CommandSurface;\n","import React from 'react';\nimport { mergeStyles, DefaultButton, PrimaryButton, ActionButton, type IStyle } from '@fluentui/react';\nimport type { ActionBarProps, SurfaceActionButton } from '../types';\nimport { colors } from '../tokens/tokens';\n\nfunction renderButton(b: SurfaceActionButton) {\n  const common = {\n    text: b.label,\n    disabled: b.disabled,\n    onClick: b.onClick,\n    iconProps: b.iconName ? { iconName: b.iconName } : undefined,\n  };\n  // key passed directly (not spread) per React 18.\n  if (b.appearance === 'primary') return <PrimaryButton key={b.id} {...common} />;\n  if (b.appearance === 'subtle') return <ActionButton key={b.id} {...common} />;\n  return <DefaultButton key={b.id} {...common} />;\n}\n\n/** A sticky footer bar of action buttons, with optional left-aligned buttons. */\nexport const ActionBar: React.FC<ActionBarProps> = ({ buttons, alignment = 'right', sticky = true, className }) => {\n  const justify = alignment === 'left' ? 'flex-start' : alignment === 'center' ? 'center' : 'flex-end';\n  const visible = buttons.filter((b) => !b.hidden);\n  const left = visible.filter((b) => b.position === 'left');\n  const right = visible.filter((b) => b.position !== 'left');\n\n  const cls = mergeStyles(\n    {\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: left.length ? 'space-between' : justify,\n      gap: 8,\n      padding: '12px 24px',\n      borderTop: `1px solid ${colors.borderNeutral}`,\n      background: colors.surface,\n      ...(sticky ? { position: 'sticky', bottom: 0, zIndex: 1 } : {}),\n    } as IStyle,\n    className,\n  );\n\n  return (\n    <div className={cls}>\n      {left.length > 0 && <div style={{ display: 'flex', gap: 8 }}>{left.map(renderButton)}</div>}\n      <div style={{ display: 'flex', gap: 8, justifyContent: justify }}>{right.map(renderButton)}</div>\n    </div>\n  );\n};\n\nexport default ActionBar;\n","import React from 'react';\nimport { mergeStyles, type IStyle } from '@fluentui/react';\nimport type { FooterProps } from '../types';\nimport { colors } from '../tokens/tokens';\n\n/** A sticky footer region (free-form children) — e.g. for dialog/panel actions. */\nexport const Footer: React.FC<FooterProps> = ({ sticky = true, align = 'right', className, children }) => {\n  const justify = align === 'left' ? 'flex-start' : align === 'center' ? 'center' : 'flex-end';\n  const cls = mergeStyles(\n    {\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: justify,\n      gap: 8,\n      padding: '12px 24px',\n      borderTop: `1px solid ${colors.borderNeutral}`,\n      background: colors.surface,\n      ...(sticky ? { position: 'sticky', bottom: 0, zIndex: 1 } : {}),\n    } as IStyle,\n    className,\n  );\n  return <div className={cls}>{children}</div>;\n};\n\nexport default Footer;\n","import React from 'react';\nimport { Modal, IconButton, mergeStyleSets } from '@fluentui/react';\nimport type { FormDialogSurfaceProps } from '../types';\nimport { dialogWidthCss, dialogHeightCss } from '../core/sizePresets';\nimport { colors, typography } from '../tokens/tokens';\n\n// Extracted from export-engine generateDialogForm (v8 <Modal> branch): the same\n// 95vw / ${width}px / 95vh flex-column main + scrollableContent, a header (title +\n// subheader | counter + close), a scrolling content region, and a sticky footer.\n// Named FormDialogSurface to avoid colliding with Fluent v9's `DialogSurface`.\n\n/**\n * Full Dynamics form-dialog (Fluent v8 Modal). Default width 1200 (lg), height 95vh.\n * `onDismiss` is the close affordance — when omitted, no close button renders, so a\n * blocking dialog without `onDismiss` is intentionally non-dismissible.\n */\nexport const FormDialogSurface: React.FC<FormDialogSurfaceProps> = ({\n  isOpen,\n  onDismiss,\n  title,\n  subheader,\n  size,\n  width,\n  height,\n  isBlocking = true,\n  recordCounter,\n  footer,\n  className,\n  children,\n}) => {\n  const widthCss = dialogWidthCss({ width, size });\n  const heightCss = dialogHeightCss(height);\n\n  const styles = mergeStyleSets({\n    header: {\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'space-between',\n      gap: 12,\n      padding: '12px 20px',\n      borderBottom: `1px solid ${colors.borderNeutral}`,\n    },\n    headerLeft: { display: 'flex', flexDirection: 'column', minWidth: 0 },\n    title: {\n      fontSize: typography.fontSize.lg,\n      fontWeight: typography.fontWeight.semibold,\n      fontFamily: typography.fontFamilySemibold,\n      color: colors.textPrimary,\n    },\n    subheader: { fontSize: typography.fontSize.smPlus, color: colors.textSecondary, marginTop: 2 },\n    headerRight: { display: 'flex', alignItems: 'center', gap: 8 },\n    counter: { fontSize: typography.fontSize.smPlus, color: colors.textSecondary },\n    content: { flex: 1, minHeight: 0, overflow: 'auto', padding: 20 },\n    footer: { borderTop: `1px solid ${colors.borderNeutral}`, padding: '12px 20px' },\n  });\n\n  const showHeader = Boolean(title) || Boolean(recordCounter) || Boolean(onDismiss);\n\n  return (\n    <Modal\n      isOpen={isOpen}\n      onDismiss={onDismiss}\n      isBlocking={isBlocking}\n      className={className}\n      styles={{\n        main: {\n          maxWidth: '95vw',\n          width: widthCss,\n          height: heightCss,\n          maxHeight: '95vh',\n          display: 'flex',\n          flexDirection: 'column',\n        },\n        scrollableContent: {\n          overflow: 'hidden',\n          display: 'flex',\n          flexDirection: 'column',\n          flex: 1,\n          minHeight: 0,\n        },\n      }}\n    >\n      {showHeader && (\n        <div className={styles.header}>\n          <div className={styles.headerLeft}>\n            {title && <span className={styles.title}>{title}</span>}\n            {subheader && <span className={styles.subheader}>{subheader}</span>}\n          </div>\n          <div className={styles.headerRight}>\n            {recordCounter && (\n              <span className={styles.counter}>\n                {recordCounter.current} of {recordCounter.total}\n              </span>\n            )}\n            {onDismiss && (\n              <IconButton\n                iconProps={{ iconName: 'Cancel' }}\n                ariaLabel=\"Close\"\n                onClick={onDismiss}\n                styles={{ root: { color: colors.textSecondary } }}\n              />\n            )}\n          </div>\n        </div>\n      )}\n      <div className={styles.content}>{children}</div>\n      {footer && <div className={styles.footer}>{footer}</div>}\n    </Modal>\n  );\n};\n\nexport default FormDialogSurface;\n","import React from 'react';\nimport { Modal, mergeStyleSets } from '@fluentui/react';\nimport type { ModalSurfaceProps } from '../types';\nimport { dialogWidthPx, MODAL_AUTOSIZE_MIN_WIDTH } from '../core/sizePresets';\nimport { colors, typography } from '../tokens/tokens';\n\n/** A generic modal (Fluent v8 Modal) — title + content + optional footer; lighter than FormDialogSurface. */\nexport const ModalSurface: React.FC<ModalSurfaceProps> = ({\n  isOpen,\n  onDismiss,\n  title,\n  size,\n  width,\n  isBlocking = true,\n  autoSize,\n  footer,\n  className,\n  children,\n}) => {\n  const main = autoSize\n    ? { width: 'auto', minWidth: MODAL_AUTOSIZE_MIN_WIDTH, maxWidth: '100%' }\n    : { maxWidth: '95vw', width: `${dialogWidthPx({ width, size })}px` };\n\n  const styles = mergeStyleSets({\n    title: {\n      fontSize: typography.fontSize.lg,\n      fontWeight: typography.fontWeight.semibold,\n      fontFamily: typography.fontFamilySemibold,\n      color: colors.textPrimary,\n      padding: '16px 20px 0',\n    },\n    content: { padding: 20 },\n    footer: {\n      borderTop: `1px solid ${colors.borderNeutral}`,\n      padding: '12px 20px',\n      display: 'flex',\n      justifyContent: 'flex-end',\n      gap: 8,\n    },\n  });\n\n  return (\n    <Modal isOpen={isOpen} onDismiss={onDismiss} isBlocking={isBlocking} className={className} styles={{ main }}>\n      {title && <div className={styles.title}>{title}</div>}\n      <div className={styles.content}>{children}</div>\n      {footer && <div className={styles.footer}>{footer}</div>}\n    </Modal>\n  );\n};\n\nexport default ModalSurface;\n","import React from 'react';\nimport { Panel, PanelType } from '@fluentui/react';\nimport type { PanelSurfaceProps } from '../types';\nimport { panelKindFromWidth, panelCustomWidthPx } from '../core/sizePresets';\n\n// Extracted from export-engine generatePanelForm (v8 <Panel> branch): headerText,\n// type derived from width (>500 → medium, else custom + customWidth), footer at bottom.\n// Exposes the full 8-literal panelType (a superset of the codegen's medium/custom binary).\n\n/** A Dynamics side panel (Fluent v8 Panel). */\nexport const PanelSurface: React.FC<PanelSurfaceProps> = ({\n  isOpen,\n  onDismiss,\n  title,\n  panelType,\n  width,\n  hasCloseButton = true,\n  isLightDismiss = false,\n  isFooterAtBottom = true,\n  isNonModal = false,\n  footer,\n  children,\n}) => {\n  const kind = panelType ?? panelKindFromWidth(width);\n  const resolvedType = PanelType[kind];\n  const customWidth = kind === 'custom' || kind === 'customNear' ? `${panelCustomWidthPx(width)}px` : undefined;\n\n  return (\n    <Panel\n      isOpen={isOpen}\n      onDismiss={onDismiss}\n      headerText={title}\n      type={resolvedType}\n      customWidth={customWidth}\n      hasCloseButton={hasCloseButton}\n      isLightDismiss={isLightDismiss}\n      isFooterAtBottom={isFooterAtBottom}\n      isBlocking={!isNonModal}\n      onRenderFooterContent={footer ? () => <>{footer}</> : undefined}\n    >\n      <div style={{ padding: '12px 0' }}>{children}</div>\n    </Panel>\n  );\n};\n\nexport default PanelSurface;\n","import React from 'react';\nimport { Callout, DirectionalHint, type ICalloutProps } from '@fluentui/react';\nimport type { CalloutSurfaceProps } from '../types';\nimport { calloutWidthPx } from '../core/sizePresets';\n\n// Extracted from export-engine generateCalloutForm (v8 <Callout> branch): width 320 +\n// bottomLeftEdge + padding 16. beak/gap are additive opt-ins (the form-callout path omits\n// them; sourced from the embedded-callout defaults).\n\n/** A lightweight contextual callout (Fluent v8 Callout) anchored to a target. */\nexport const CalloutSurface: React.FC<CalloutSurfaceProps> = ({\n  target,\n  isOpen = true,\n  onDismiss,\n  width,\n  directionalHint = 'bottomLeftEdge',\n  isBeakVisible = true,\n  beakWidth = 16,\n  gapSpace = 0,\n  className,\n  children,\n}) => {\n  if (!isOpen) return null;\n  return (\n    <Callout\n      target={(target ?? undefined) as ICalloutProps['target']}\n      onDismiss={onDismiss}\n      directionalHint={DirectionalHint[directionalHint]}\n      isBeakVisible={isBeakVisible}\n      beakWidth={beakWidth}\n      gapSpace={gapSpace}\n      className={className}\n      styles={{ root: { width: calloutWidthPx(width), padding: 16 } }}\n    >\n      {children}\n    </Callout>\n  );\n};\n\nexport default CalloutSurface;\n","import React from 'react';\nimport { TooltipHost, DirectionalHint, TooltipDelay } from '@fluentui/react';\nimport type { TooltipSurfaceProps } from '../types';\n\nconst DELAY_MAP: Record<NonNullable<TooltipSurfaceProps['delay']>, TooltipDelay> = {\n  zero: TooltipDelay.zero,\n  medium: TooltipDelay.medium,\n  long: TooltipDelay.long,\n};\n\n/** A tooltip wrapper (Fluent v8 TooltipHost). New surface — no codegen counterpart. */\nexport const TooltipSurface: React.FC<TooltipSurfaceProps> = ({\n  content,\n  directionalHint = 'bottomCenter',\n  delay = 'medium',\n  children,\n}) => (\n  <TooltipHost content={content} directionalHint={DirectionalHint[directionalHint]} delay={DELAY_MAP[delay]}>\n    {children}\n  </TooltipHost>\n);\n\nexport default TooltipSurface;\n","import React from 'react';\nimport { mergeStyles, type IStyle } from '@fluentui/react';\nimport type { MasterDetailSurfaceProps } from '../types';\nimport { colors } from '../tokens/tokens';\nimport { BREAKPOINTS } from '../responsive/breakpoints';\n\n/** Master (left rail) + detail (right pane) split that stacks vertically below `collapseBelow`. */\nexport const MasterDetailSurface: React.FC<MasterDetailSurfaceProps> = ({\n  master,\n  detail,\n  detailFallback,\n  splitRatio = 0.38,\n  collapseBelow = 'md',\n  className,\n}) => {\n  const masterFr = Math.min(90, Math.max(10, Math.round(splitRatio * 100)));\n  const detailFr = 100 - masterFr;\n  const collapsePx = BREAKPOINTS[collapseBelow];\n\n  const rootCls = mergeStyles(\n    {\n      display: 'grid',\n      gridTemplateColumns: `${masterFr}fr ${detailFr}fr`,\n      minHeight: 0,\n      selectors: { [`@media (max-width: ${collapsePx}px)`]: { gridTemplateColumns: '1fr' } },\n    } as IStyle,\n    className,\n  );\n  const masterCls = mergeStyles({\n    minWidth: 0,\n    overflow: 'auto',\n    borderRight: `1px solid ${colors.borderNeutral}`,\n    selectors: {\n      [`@media (max-width: ${collapsePx}px)`]: {\n        borderRight: 'none',\n        borderBottom: `1px solid ${colors.borderNeutral}`,\n      },\n    },\n  } as IStyle);\n  const detailCls = mergeStyles({ minWidth: 0, overflow: 'auto' });\n\n  return (\n    <div className={rootCls}>\n      <div className={masterCls}>{master}</div>\n      <div className={detailCls}>{detail ?? detailFallback}</div>\n    </div>\n  );\n};\n\nexport default MasterDetailSurface;\n","import React from 'react';\nimport { mergeStyles, type IStyle } from '@fluentui/react';\nimport type { DashboardSurfaceProps } from '../types';\nimport { CARD_REFLOW_WIDTH, BREAKPOINTS } from '../responsive/breakpoints';\n\n/** A reflowing grid of dashboard tiles (N cols → 2 below 900px → 1 below 480px). */\nexport const DashboardSurface: React.FC<DashboardSurfaceProps> = ({ tiles, columns = 2, gap = 16, className }) => {\n  const cls = mergeStyles(\n    {\n      display: 'grid',\n      gridTemplateColumns: `repeat(${columns}, minmax(0, 1fr))`,\n      gap,\n      alignItems: 'start',\n      selectors: {\n        [`@media (max-width: ${CARD_REFLOW_WIDTH}px)`]: { gridTemplateColumns: 'repeat(2, minmax(0, 1fr))' },\n        [`@media (max-width: ${BREAKPOINTS.sm}px)`]: { gridTemplateColumns: '1fr' },\n      },\n    } as IStyle,\n    className,\n  );\n  return (\n    <div className={cls}>\n      {tiles.map((tile, i) => (\n        <div key={`tile-${i}`}>{tile}</div>\n      ))}\n    </div>\n  );\n};\n\nexport default DashboardSurface;\n","// Maps a form-runtime FormDefinition to resolved surface-kit overlay props.\n//\n// IMPORTANT: do NOT import @dataverse-kit/form-runtime here — it's a cross-tree sibling.\n// We duck-type the subset of its FormDefinition we read. Keep `FormDefinitionLike` in\n// sync with msft/04-dynamics/dynamics-toolkit/packages/form-runtime/src/types/form.ts —\n// the __compat__/formDefinition.test-d.ts type test (run under typecheck:stories)\n// fails to compile if the real schema drifts away from this shape.\nimport {\n  dialogWidthPx,\n  dialogHeightCss,\n  panelKindFromWidth,\n  panelCustomWidthPx,\n  calloutWidthPx,\n} from '../core/sizePresets';\n\n/** The overlay FormTypes surface-kit knows how to resolve (form-runtime also has the tab-only 'related'/'audit'). */\nexport type SurfaceFormType = 'main' | 'dialog' | 'panel' | 'callout';\n\n// Only the settings fields the adapter actually reads — keeping the duck-type minimal\n// reduces the drift surface against form-runtime's (much larger) FormSettings.\nexport interface FormSettingsLike {\n  width?: number;\n  height?: number;\n  panelType?: string;\n}\n\nexport interface FormDefinitionLike {\n  type?: SurfaceFormType;\n  name?: string;\n  settings?: FormSettingsLike;\n}\n\nexport type ResolvedSurface =\n  | { kind: 'main' }\n  | { kind: 'dialog'; widthPx: number; heightCss: string; title?: string }\n  | { kind: 'panel'; panelType: string; customWidthPx?: number; title?: string }\n  | { kind: 'callout'; widthPx: number; title?: string };\n\n/** Resolve a (duck-typed) form-runtime FormDefinition to the right surface + sizing props. */\nexport function fromFormDefinition(def: FormDefinitionLike): ResolvedSurface {\n  const s = def.settings ?? {};\n  switch (def.type) {\n    case 'dialog':\n      return {\n        kind: 'dialog',\n        widthPx: dialogWidthPx({ width: s.width }),\n        heightCss: dialogHeightCss(s.height),\n        title: def.name,\n      };\n    case 'panel': {\n      const panelType = s.panelType ?? panelKindFromWidth(s.width);\n      return {\n        kind: 'panel',\n        panelType,\n        customWidthPx: panelType === 'custom' ? panelCustomWidthPx(s.width) : undefined,\n        title: def.name,\n      };\n    }\n    case 'callout':\n      return { kind: 'callout', widthPx: calloutWidthPx(s.width), title: def.name };\n    case 'main':\n    default:\n      return { kind: 'main' };\n  }\n}\n"],"mappings":"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","names":["useState","useEffect","mergeStyles","jsx","mergeStyles","jsx","mergeStyles","jsx","mergeStyles","jsx","useState","mergeStyleSets","mergeStyleSets","jsx","jsxs","mergeStyleSets","jsx","jsxs","useState","mergeStyleSets","jsx","mergeStyleSets","jsx","jsxs","mergeStyleSets","useState","jsx","jsxs","CommandBar","jsx","mergeStyles","jsx","jsxs","mergeStyles","mergeStyles","jsx","mergeStyles","mergeStyleSets","jsx","jsxs","mergeStyleSets","Modal","mergeStyleSets","jsx","jsxs","mergeStyleSets","Modal","jsx","jsx","DirectionalHint","jsx","mergeStyles","jsx","jsxs","mergeStyles","mergeStyles","jsx","mergeStyles"]}
+{"version":3,"sources":["../src/core/sizePresets.ts","../src/core/columns.ts","../src/responsive/breakpoints.ts","../src/responsive/builders.ts","../src/tokens/tokens.ts","../src/tokens/theme.ts","../src/tokens/density.ts","../src/hooks/useContainerSize.ts","../src/hooks/useContainerWidth.ts","../src/hooks/useContainerBreakpoint.ts","../src/hooks/useResponsiveValue.ts","../src/hooks/useMediaQuery.ts","../src/hooks/useDensity.ts","../src/layouts/ColumnLayout.tsx","../src/layouts/TwoColumnLayout.tsx","../src/layouts/FieldRow.tsx","../src/containers/FormSurface.tsx","../src/internal/styles.ts","../src/containers/PageSurface.tsx","../src/containers/Section.tsx","../src/containers/SectionHeader.tsx","../src/containers/SectionCard.tsx","../src/containers/FormHeader.tsx","../src/containers/PivotSurface.tsx","../src/containers/CommandSurface.tsx","../src/containers/ActionBar.tsx","../src/containers/Footer.tsx","../src/overlays/FormDialogSurface.tsx","../src/overlays/ModalSurface.tsx","../src/overlays/PanelSurface.tsx","../src/overlays/CalloutSurface.tsx","../src/overlays/TooltipSurface.tsx","../src/composites/MasterDetailSurface.tsx","../src/composites/DashboardSurface.tsx","../src/adapters/fromFormDefinition.ts"],"sourcesContent":["// Pure-TS sizing scalars for overlay surfaces. The SINGLE SOURCE of the numbers\n// that both surface-kit's runtime overlays AND the export-engine codegen use, so a\n// Dialog is 1200px wide in exactly one place. Framework-agnostic (no react/@fluentui).\n//\n// Values mirror export-engine/src/generators/FormCodeGenerator.ts (v8 branches):\n//   dialog: default width 1200; height <=100 -> `${h}vh` else '95vh'\n//   panel:  kind = (width ?? 480) > 500 ? 'medium' : 'custom'; custom width = width ?? 480\n//   callout (form-type): default width 320; directionalHint 'bottomLeftEdge'\n// v1c wires export-engine to import these; a byte-identical emission test guards drift.\n\n// --- Dialog --------------------------------------------------------------------\n\nexport type DialogSizePreset = 'sm' | 'md' | 'lg' | 'xl' | 'fullscreen';\n\n// NOTE: only the lg = 1200 default and an explicit `width` are the shared-with-codegen\n// contract (export-engine does `width ?? 1200`). The sm/md/xl/fullscreen presets are\n// surface-kit runtime conveniences with no codegen counterpart — v1c does NOT consume them.\nexport const DIALOG_SIZE_PX = {\n  sm: 600,\n  md: 900,\n  lg: 1200,\n  xl: 1600,\n} as const;\n\n/** Resolved dialog width in px. Explicit `width` wins; else the preset (default lg = 1200, the codegen default). */\nexport function dialogWidthPx(opts: { width?: number; size?: DialogSizePreset } = {}): number {\n  if (typeof opts.width === 'number') return opts.width;\n  const size = opts.size ?? 'lg';\n  // fullscreen is clamped by 95vw at the CSS layer; fall back to the largest preset for the px hint.\n  if (size === 'fullscreen') return DIALOG_SIZE_PX.xl;\n  return DIALOG_SIZE_PX[size];\n}\n\n/** Dialog width as a CSS value — '95vw' for the fullscreen preset (no explicit width), else `${px}px`. */\nexport function dialogWidthCss(opts: { width?: number; size?: DialogSizePreset } = {}): string {\n  if (opts.size === 'fullscreen' && opts.width == null) return '95vw';\n  return `${dialogWidthPx(opts)}px`;\n}\n\n/** Dialog height as a CSS value. <=100 is treated as a vh percentage; otherwise the 95vh cap (codegen rule). */\nexport function dialogHeightCss(height?: number): string {\n  return height != null && height <= 100 ? `${height}vh` : '95vh';\n}\n\n/** Min width for an auto-sized ModalSurface (the Track-and-Ship \"min 1000, auto\" pattern). */\nexport const MODAL_AUTOSIZE_MIN_WIDTH = 1000;\n\n// --- Panel ---------------------------------------------------------------------\n\nexport type PanelKind = 'medium' | 'custom';\nexport const PANEL_DEFAULT_WIDTH = 480;\n\n/** Codegen-parity panel kind: wide panels use Fluent `medium`, narrow ones `custom` + customWidth. */\nexport function panelKindFromWidth(width?: number): PanelKind {\n  return (width ?? PANEL_DEFAULT_WIDTH) > 500 ? 'medium' : 'custom';\n}\n\n/** customWidth px for a `custom` panel. */\nexport function panelCustomWidthPx(width?: number): number {\n  return width ?? PANEL_DEFAULT_WIDTH;\n}\n\n// --- Callout -------------------------------------------------------------------\n\nexport const CALLOUT_DEFAULT_WIDTH = 320;\n\n/** Form-type callout defaults (the export-engine form-callout path emits width + directionalHint only). */\nexport const calloutFormDefaults = {\n  width: CALLOUT_DEFAULT_WIDTH,\n  directionalHint: 'bottomLeftEdge',\n} as const;\n\nexport function calloutWidthPx(width?: number): number {\n  return width ?? CALLOUT_DEFAULT_WIDTH;\n}\n","// Pure-TS column helpers shared by layouts/containers and the responsive builders.\nexport type ColumnCount = 1 | 2 | 3 | 4;\n\n/** CSS grid-template-columns for an N-column layout. Matches codegen `repeat(N, 1fr)`. */\nexport function gridTemplateForColumns(columns: ColumnCount): string {\n  return `repeat(${columns}, 1fr)`;\n}\n\n/** Clamp a cell column-span to the available column count (min 1). */\nexport function clampSpan(span: number, columns: ColumnCount): number {\n  if (!Number.isFinite(span)) return 1;\n  return Math.max(1, Math.min(Math.round(span), columns));\n}\n","// Named responsive breakpoints (px). The 480/768 cutoffs match the export-engine\n// section/field stacking; CARD_REFLOW_WIDTH (900) matches the CardGrid reflow\n// emitter (a separate cutoff). Pure-TS (no react/@fluentui).\nexport type Breakpoint = 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n\nexport const BREAKPOINTS: Record<Breakpoint, number> = {\n  xs: 0,\n  sm: 480,\n  md: 768,\n  lg: 1024,\n  xl: 1366,\n};\n\n/** The card-grid reflow cutoff the codegen CardGrid emitter uses (distinct from the 480/768 field/section cutoffs). */\nexport const CARD_REFLOW_WIDTH = 900;\n\nconst DESCENDING: Breakpoint[] = ['xl', 'lg', 'md', 'sm', 'xs'];\nconst ASCENDING: Breakpoint[] = ['xs', 'sm', 'md', 'lg', 'xl'];\n\n/** Largest breakpoint whose min-width is <= width. */\nexport function resolveBreakpoint(width: number): Breakpoint {\n  for (const bp of DESCENDING) {\n    if (width >= BREAKPOINTS[bp]) return bp;\n  }\n  return 'xs';\n}\n\nexport type ResponsiveValue<T> = T | Partial<Record<Breakpoint, T>>;\n\nfunction isResponsiveMap<T>(v: ResponsiveValue<T>): v is Partial<Record<Breakpoint, T>> {\n  return typeof v === 'object' && v !== null && ASCENDING.some((bp) => bp in (v as object));\n}\n\n/**\n * Resolve a responsive value at a breakpoint, cascading mobile-first: pick the\n * nearest defined value at or below `breakpoint`, else the nearest defined above.\n */\nexport function resolveResponsiveValue<T>(value: ResponsiveValue<T>, breakpoint: Breakpoint): T | undefined {\n  if (!isResponsiveMap(value)) return value as T;\n  const map = value;\n  const idx = ASCENDING.indexOf(breakpoint);\n  for (let i = idx; i >= 0; i--) {\n    const v = map[ASCENDING[i]];\n    if (v !== undefined) return v;\n  }\n  for (let i = idx + 1; i < ASCENDING.length; i++) {\n    const v = map[ASCENDING[i]];\n    if (v !== undefined) return v;\n  }\n  return undefined;\n}\n","// Pure-TS responsive style-object builders. Every responsive stacking decision in\n// surface-kit flows through here so viewport (`mode:'media'`) and container\n// (`mode:'container'`) stacking share the same 480/768 cutoffs. The numeric values\n// (gaps, minHeight, alignItems) mirror the export-engine fieldGrid/fieldRow/\n// tabSectionsGrid emitters so the eventual emitMode:'surface-kit' rewrite is parity.\n// Returned objects are structurally compatible with Fluent's `IStyle` (the `selectors`\n// shape) but typed locally so this layer stays framework-agnostic (no @fluentui import).\nimport { BREAKPOINTS } from './breakpoints';\nimport { gridTemplateForColumns, type ColumnCount } from '../core/columns';\n\nexport type StyleObject = Record<string, unknown>;\nexport type ResponsiveMode = 'media' | 'container';\n\nfunction atRule(mode: ResponsiveMode, maxPx: number): string {\n  return mode === 'container'\n    ? `@container (max-width: ${maxPx}px)`\n    : `@media (max-width: ${maxPx}px)`;\n}\n\n/** N-column field grid that caps at 2 columns on tablet (<=768) and stacks to 1 on phone (<=480). */\nexport function fieldGridStyle(columns: ColumnCount, mode: ResponsiveMode = 'media'): StyleObject {\n  const capped = Math.min(columns, 2) as ColumnCount;\n  return {\n    display: 'grid',\n    gridTemplateColumns: gridTemplateForColumns(columns),\n    gap: '4px 24px',\n    selectors: {\n      [atRule(mode, BREAKPOINTS.md)]: { gridTemplateColumns: gridTemplateForColumns(capped) },\n      [atRule(mode, BREAKPOINTS.sm)]: { gridTemplateColumns: '1fr' },\n    },\n  };\n}\n\n/** Multi-section tab row that collapses straight to a single column on tablet (<=768). */\nexport function sectionStackingStyle(gridTemplateColumns: string, mode: ResponsiveMode = 'media'): StyleObject {\n  return {\n    display: 'grid',\n    gridTemplateColumns,\n    gap: 16,\n    alignItems: 'start',\n    selectors: {\n      [atRule(mode, BREAKPOINTS.md)]: { gridTemplateColumns: '1fr' },\n    },\n  };\n}\n\n/** \"Label : input\" row that collapses the label above the input on phone (<=480). */\nexport function fieldRowStyle(labelWidth = '130px', mode: ResponsiveMode = 'media'): StyleObject {\n  return {\n    display: 'grid',\n    gridTemplateColumns: `${labelWidth} 1fr`,\n    alignItems: 'center',\n    gap: 8,\n    minHeight: 38,\n    selectors: {\n      [atRule(mode, BREAKPOINTS.sm)]: { gridTemplateColumns: '1fr', alignItems: 'flex-start', minHeight: 0, gap: 4 },\n    },\n  };\n}\n","// Re-exported from @dataverse-kit/design-tokens — the single canonical source of the\n// Dynamics design tokens. surface-kit no longer keeps its own copy (this retires the old\n// \"SYNCED FROM reusable-components\" duplication). The values are pure-TS (no react /\n// no @fluentui), so they remain safe to import from anywhere. `createDynamicsTheme()` and\n// `density` stay here in surface-kit (see ./theme and ./density).\nexport { colors, spacing, typography, radius, layout } from '@dataverse-kit/design-tokens';\n","import { createTheme, type Theme } from '@fluentui/react';\nimport { colors, typography } from './tokens';\n\n// The genuinely-missing layer: a single Fluent v8 theme built from the canonical\n// tokens. No shared package exposes a `createTheme` literal today (every client\n// re-inlines its own `dynamicsTheme`); surface-kit establishes the one builder they\n// collapse into.\nexport function createDynamicsTheme(): Theme {\n  return createTheme({\n    palette: {\n      themePrimary: colors.brand,\n      themeDarkAlt: colors.brandHover,\n      themeDark: colors.brandDark,\n      themeDarker: colors.brandDark,\n      neutralPrimary: colors.textPrimary,\n      neutralSecondary: colors.textSecondary,\n      neutralLight: colors.borderNeutral,\n      neutralLighter: colors.surfaceAlt,\n      white: colors.surface,\n      redDark: colors.danger,\n    },\n    defaultFontStyle: {\n      fontFamily: typography.fontFamily,\n    },\n    semanticColors: {\n      errorText: colors.danger,\n      inputBorder: colors.fieldBorder,\n      inputBackground: colors.fieldFill,\n      bodyBackground: colors.surface,\n    },\n  });\n}\n","// Spacing density multiplier — `comfortable` (Dynamics default) vs `compact`\n// (denser forms / embedded PCF). Pure-TS.\nexport type Density = 'comfortable' | 'compact';\n\nexport const densityScale = {\n  comfortable: 1,\n  compact: 0.75,\n} as const;\n\n/** Scale a base spacing value (px) by the active density. */\nexport function scaleSpacing(value: number, density: Density = 'comfortable'): number {\n  return Math.round(value * densityScale[density]);\n}\n","// SYNCED FROM: shared/responsive-patterns/03-layouts/container-query/ContainerQuery.tsx (useContainerSize)\n// Inlined, not aliased: shared/responsive-patterns is outside the npm workspace. The\n// ContainerSize type is inlined here too (rather than vendoring shared/shared/types).\n// This is a React hook, so it lives in hooks/ (NOT responsive/, which must stay\n// framework-agnostic for the ./responsive subpath that export-engine inlines).\nimport * as React from 'react';\nimport { useState, useEffect } from 'react';\n\nexport interface ContainerSize {\n  width: number;\n  height: number;\n  inlineSize: number;\n  blockSize: number;\n}\n\n/** Observe an element's size via ResizeObserver. Pass a ref; returns {width,height,inlineSize,blockSize}. */\nexport function useContainerSize<T extends HTMLElement = HTMLElement>(ref: React.RefObject<T>): ContainerSize {\n  const [size, setSize] = useState<ContainerSize>({ width: 0, height: 0, inlineSize: 0, blockSize: 0 });\n\n  useEffect(() => {\n    if (!ref.current || typeof ResizeObserver === 'undefined') return;\n\n    const observer = new ResizeObserver((entries) => {\n      for (const entry of entries) {\n        const { width, height } = entry.contentRect;\n        const inlineSize = entry.borderBoxSize?.[0]?.inlineSize ?? width;\n        const blockSize = entry.borderBoxSize?.[0]?.blockSize ?? height;\n        setSize({ width, height, inlineSize, blockSize });\n      }\n    });\n\n    observer.observe(ref.current);\n    return () => observer.disconnect();\n  }, [ref]);\n\n  return size;\n}\n","import * as React from 'react';\nimport { useRef } from 'react';\nimport { useContainerSize } from './useContainerSize';\n\n/**\n * Create-and-return a ref plus the observed width of the element it is attached to.\n * `const [ref, width] = useContainerWidth(); return <div ref={ref}>…</div>`.\n */\nexport function useContainerWidth<T extends HTMLElement = HTMLDivElement>(): [React.RefObject<T>, number] {\n  const ref = useRef<T>(null);\n  const { width } = useContainerSize(ref);\n  return [ref, width];\n}\n","import type * as React from 'react';\nimport { resolveBreakpoint, type Breakpoint } from '../responsive/breakpoints';\nimport { useContainerWidth } from './useContainerWidth';\n\n/**\n * Resolve the *container's* current breakpoint (not the viewport's) — the correctness\n * fix for a surface inside a PCF, where width comes from `context.allocatedWidth`.\n * Returns `[ref, breakpoint, width]`.\n */\nexport function useContainerBreakpoint<T extends HTMLElement = HTMLDivElement>(): [React.RefObject<T>, Breakpoint, number] {\n  const [ref, width] = useContainerWidth<T>();\n  return [ref, resolveBreakpoint(width), width];\n}\n","import type * as React from 'react';\nimport { resolveResponsiveValue, type ResponsiveValue } from '../responsive/breakpoints';\nimport { useContainerBreakpoint } from './useContainerBreakpoint';\n\n/**\n * Resolve a responsive value against the *container's* current breakpoint.\n * `const [ref, cols] = useResponsiveValue({ xs: 1, md: 2, lg: 3 });`\n */\nexport function useResponsiveValue<T, E extends HTMLElement = HTMLDivElement>(\n  value: ResponsiveValue<T>,\n): [React.RefObject<E>, T | undefined] {\n  const [ref, breakpoint] = useContainerBreakpoint<E>();\n  return [ref, resolveResponsiveValue(value, breakpoint)];\n}\n","import { useState, useEffect } from 'react';\n\n/** Viewport media-query match — the SSR-safe / no-ResizeObserver fallback to the container hooks. */\nexport function useMediaQuery(query: string): boolean {\n  const [matches, setMatches] = useState<boolean>(() => {\n    if (typeof window === 'undefined' || typeof window.matchMedia !== 'function') return false;\n    return window.matchMedia(query).matches;\n  });\n\n  useEffect(() => {\n    if (typeof window === 'undefined' || typeof window.matchMedia !== 'function') return;\n    const mql = window.matchMedia(query);\n    const onChange = () => setMatches(mql.matches);\n    onChange();\n    mql.addEventListener('change', onChange);\n    return () => mql.removeEventListener('change', onChange);\n  }, [query]);\n\n  return matches;\n}\n","import { createContext, useContext } from 'react';\nimport type { Density } from '../tokens/density';\n\n/**\n * Form-level spacing density. `FormSurface` provides it; `Section` (and any future\n * container) reads it via `useDensity()`, so a single `density` switch on the form\n * cascades to every section instead of being set per-section. Defaults to\n * `'comfortable'` (the Dynamics default) — `'compact'` scales spacing by 0.75.\n */\nexport const DensityContext = createContext<Density>('comfortable');\n\n/** Read the ambient spacing density (defaults to `'comfortable'` outside a provider). */\nexport const useDensity = (): Density => useContext(DensityContext);\n","import React from 'react';\nimport { mergeStyles, type IStyle } from '@fluentui/react';\nimport type { ColumnLayoutProps } from '../types';\nimport { fieldGridStyle } from '../responsive/builders';\nimport { gridTemplateForColumns } from '../core/columns';\n\n/** N-column grid for form fields. Responsive by default (caps at 2 cols <=768, 1 <=480). */\nexport const ColumnLayout: React.FC<ColumnLayoutProps> = ({\n  columns,\n  gap = '4px 24px',\n  responsive = true,\n  mode = 'media',\n  className,\n  style,\n  children,\n}) => {\n  const base: IStyle = responsive\n    ? (fieldGridStyle(columns, mode) as IStyle)\n    : { display: 'grid', gridTemplateColumns: gridTemplateForColumns(columns) };\n  const cls = mergeStyles(base, { gap } as IStyle, className);\n  return (\n    <div className={cls} style={style}>\n      {children}\n    </div>\n  );\n};\n\nexport default ColumnLayout;\n","import React from 'react';\nimport { mergeStyles, type IStyle } from '@fluentui/react';\nimport type { TwoColumnLayoutProps } from '../types';\nimport { BREAKPOINTS } from '../responsive/breakpoints';\n\n/** Two equal columns that collapse to one below `collapseBelow` (default 'sm' = 480). */\nexport const TwoColumnLayout: React.FC<TwoColumnLayoutProps> = ({\n  gap = 16,\n  collapseBelow = 'sm',\n  className,\n  style,\n  children,\n}) => {\n  const cls = mergeStyles(\n    {\n      display: 'grid',\n      gridTemplateColumns: '1fr 1fr',\n      gap,\n      alignItems: 'start',\n      selectors: {\n        [`@media (max-width: ${BREAKPOINTS[collapseBelow]}px)`]: { gridTemplateColumns: '1fr' },\n      },\n    } as IStyle,\n    className,\n  );\n  return (\n    <div className={cls} style={style}>\n      {children}\n    </div>\n  );\n};\n\nexport default TwoColumnLayout;\n","import React from 'react';\nimport { mergeStyleSets, type IStyle } from '@fluentui/react';\nimport type { FieldRowProps } from '../types';\nimport { colors, typography } from '../tokens/tokens';\nimport { fieldRowStyle } from '../responsive/builders';\n\n// Ported + extended from reusable-components/src/ui/primitives/FieldRow.tsx — adds\n// `labelPosition` and a phone-stacking @480 rule on top of the same 130px label grid.\n\n/** A two-column \"Label : control\" row. The control goes in `children` (right column). */\nexport const FieldRow: React.FC<FieldRowProps> = ({\n  label,\n  required,\n  fullWidth,\n  labelWidth = '130px',\n  labelPosition = 'beside',\n  className,\n  children,\n}) => {\n  const styles = mergeStyleSets({\n    // The beside layout IS the shared responsive builder (130px label grid + @480\n    // stack) — no hand-written breakpoint here.\n    rowBeside: fieldRowStyle(labelWidth, 'media') as IStyle,\n    rowAbove: {\n      display: 'grid',\n      gridTemplateColumns: '1fr',\n      gap: 2,\n      minHeight: 38,\n    },\n    label: {\n      fontSize: typography.fontSize.sm,\n      fontWeight: typography.fontWeight.semibold,\n      color: colors.textPrimary,\n      fontFamily: typography.fontFamily,\n      lineHeight: '1.3',\n      wordBreak: 'break-word',\n    },\n    required: { color: colors.danger, marginLeft: 2, fontWeight: typography.fontWeight.semibold },\n    full: { gridColumn: '1 / -1' },\n  });\n\n  const cls = [\n    labelPosition === 'above' ? styles.rowAbove : styles.rowBeside,\n    fullWidth ? styles.full : '',\n    className,\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  return (\n    <div className={cls}>\n      {label != null && (\n        <span className={styles.label}>\n          {label}\n          {required && <span className={styles.required}>*</span>}\n        </span>\n      )}\n      {children}\n    </div>\n  );\n};\n\nexport default FieldRow;\n","import React from 'react';\nimport { mergeStyles, type IStyle } from '@fluentui/react';\nimport type { FormSurfaceProps } from '../types';\nimport { colors } from '../tokens/tokens';\nimport { scaleSpacing } from '../tokens/density';\nimport { BREAKPOINTS } from '../responsive/breakpoints';\nimport { stackChildrenBelow } from '../internal/styles';\nimport { DensityContext } from '../hooks/useDensity';\n\n// Ported from reusable-components Form's body grid. The outer N-column form canvas\n// that Sections sit on. Stacks children to full width below `collapseBelow` — driven\n// by the *container* width when `containerWidth` is supplied (PCF allocatedWidth),\n// else by the viewport via @media.\n\n/** The N-column form canvas that hosts Sections. */\nexport const FormSurface: React.FC<FormSurfaceProps> = ({\n  columns = 12,\n  gap = 20,\n  padding = 20,\n  density = 'comfortable',\n  background = colors.canvas,\n  containerWidth,\n  collapseBelow = 'sm',\n  maxWidth,\n  className,\n  style,\n  children,\n}) => {\n  const collapsePx = BREAKPOINTS[collapseBelow];\n  const forceStack = containerWidth != null && containerWidth <= collapsePx;\n  // Density scales the canvas gap + padding; cascades to child Sections via context.\n  // `comfortable` is x1, so an unset/comfortable density is byte-identical to before.\n  const scaledGap = scaleSpacing(gap, density);\n  const scaledPadding = scaleSpacing(padding, density);\n\n  const cls = mergeStyles(\n    {\n      display: 'grid',\n      gridTemplateColumns: forceStack ? '1fr' : `repeat(${columns}, 1fr)`,\n      gap: scaledGap,\n      padding: scaledPadding,\n      background,\n      alignItems: 'start',\n      ...(maxWidth != null ? { maxWidth, marginLeft: 'auto', marginRight: 'auto' } : {}),\n      // When the container forces a single column, reset child spans the same way the\n      // viewport fallback does — otherwise a Section with `columnStart` references grid\n      // lines that no longer exist and escapes the stack. (Mutually exclusive with the\n      // @media fallback below, which only applies when containerWidth is unset.)\n      ...(forceStack ? { selectors: { '> *': { gridColumn: '1 / -1' } } } : {}),\n      // Viewport fallback only when the container width isn't explicitly provided.\n      ...(containerWidth == null ? stackChildrenBelow(collapsePx) : {}),\n    } as IStyle,\n    className,\n  );\n\n  return (\n    <DensityContext.Provider value={density}>\n      <div className={cls} style={style}>\n        {children}\n      </div>\n    </DensityContext.Provider>\n  );\n};\n\nexport default FormSurface;\n","// Shared Dynamics-CE style fragments used across containers. Not part of the public\n// API. Fluent v8 mergeStyles `IRawStyle` fragments built from the canonical tokens.\nimport type { IRawStyle } from '@fluentui/react';\nimport { colors, typography, radius } from '../tokens/tokens';\n\n/** Dynamics section/header title (Segoe UI Semibold 14 / #323130). */\nexport const sharedTitleStyle: IRawStyle = {\n  fontWeight: typography.fontWeight.semibold,\n  fontSize: typography.fontSize.md,\n  color: colors.textPrimary,\n  fontFamily: typography.fontFamilySemibold,\n  paddingBottom: 0,\n  marginBottom: 0,\n};\n\n/** White card with subtle neutral border + soft rounding (Dynamics card chrome). */\nexport const dynamicsCardStyle: IRawStyle = {\n  background: colors.surface,\n  border: `1px solid ${colors.borderNeutral}`,\n  borderRadius: radius.card,\n  overflow: 'hidden',\n};\n\n/** The subtle Fluent elevation used on Dynamics form cards. */\nexport const cardShadow =\n  '0 1.6px 3.6px rgba(0, 0, 0, 0.08), 0 0.3px 0.9px rgba(0, 0, 0, 0.05)';\n\n/** Stack direct grid children to full width below `maxPx` (viewport @media). */\nexport function stackChildrenBelow(maxPx: number): IRawStyle {\n  return {\n    selectors: {\n      [`@media (max-width: ${maxPx}px)`]: {\n        selectors: { '> *': { gridColumn: '1 / -1' } },\n      },\n    },\n  };\n}\n","import React from 'react';\nimport type { PageSurfaceProps } from '../types';\nimport { FormSurface } from './FormSurface';\n\n/** A full-page FormSurface — optionally centered with a comfortable max width. */\nexport const PageSurface: React.FC<PageSurfaceProps> = ({ centered, maxWidth, ...rest }) => (\n  <FormSurface maxWidth={maxWidth ?? (centered ? 1200 : undefined)} {...rest} />\n);\n\nexport default PageSurface;\n","import React, { useState } from 'react';\nimport { mergeStyleSets, type IStyle } from '@fluentui/react';\nimport type { SectionProps } from '../types';\nimport { colors, radius } from '../tokens/tokens';\nimport { scaleSpacing } from '../tokens/density';\nimport { BREAKPOINTS } from '../responsive/breakpoints';\nimport { dynamicsCardStyle, cardShadow } from '../internal/styles';\nimport { useDensity } from '../hooks/useDensity';\nimport { SectionHeader } from './SectionHeader';\n\n// Ported + extended from reusable-components/src/ui/section/section.component.tsx.\n// Same grid-positioned white card + internal N-column field grid; adds the three\n// `variant`s (card/flat/placeholder), `collapsible`, and phone-stacking of the body.\n\n/** A Dynamics-CE form section: positioned card with a header and an internal field grid. */\nexport const Section: React.FC<SectionProps> = ({\n  title,\n  columnSpan = 12,\n  columnStart,\n  rowPosition,\n  internalColumns = 12,\n  showCommandBar,\n  commandBarItems,\n  statusText,\n  notification,\n  collapsible,\n  defaultCollapsed = false,\n  collapsed: controlledCollapsed,\n  onCollapsedChange,\n  variant = 'card',\n  minHeight = 80,\n  density: densityProp,\n  className,\n  style,\n  children,\n}) => {\n  const [internalCollapsed, setInternalCollapsed] = useState(defaultCollapsed);\n  const collapsed = controlledCollapsed ?? internalCollapsed;\n  const toggle = () => {\n    const next = !collapsed;\n    if (controlledCollapsed == null) setInternalCollapsed(next);\n    onCollapsedChange?.(next);\n  };\n\n  // Density: an explicit prop wins, else inherit the ambient FormSurface density.\n  // `comfortable` is x1, so the padding/gap strings are byte-identical to before.\n  const ctxDensity = useDensity();\n  const density = densityProp ?? ctxDensity;\n  const cardPad = `${scaleSpacing(3, density)}px ${scaleSpacing(20, density)}px ${scaleSpacing(20, density)}px ${scaleSpacing(20, density)}px`;\n  const bodyGap = scaleSpacing(7, density);\n\n  const gridColumn = columnStart ? `${columnStart} / span ${columnSpan}` : `span ${columnSpan}`;\n  const rootStyle: React.CSSProperties = {\n    gridColumn,\n    ...(rowPosition ? { gridRowStart: rowPosition } : {}),\n    ...style,\n  };\n\n  const styles = mergeStyleSets({\n    // box-sizing:border-box so the 20px padding + 1px border are contained within\n    // `width:100%` — otherwise the card renders 42px wider than its grid cell and\n    // spills off the right edge (dashboards, page sections, fields inside dialogs).\n    card: { ...dynamicsCardStyle, boxSizing: 'border-box', boxShadow: cardShadow, padding: cardPad, minWidth: 0, width: '100%' },\n    flat: {\n      background: colors.surface,\n      borderRadius: radius.card,\n      boxSizing: 'border-box',\n      padding: cardPad,\n      minWidth: 0,\n      width: '100%',\n      overflow: 'hidden',\n    },\n    placeholder: {\n      border: `1px dashed ${colors.borderNeutral}`,\n      borderRadius: radius.card,\n      boxSizing: 'border-box',\n      minHeight,\n      width: '100%',\n      background: 'transparent',\n    },\n    notification: { marginBottom: scaleSpacing(8, density) },\n    body: {\n      display: 'grid',\n      gridTemplateColumns: `repeat(${internalColumns}, 1fr)`,\n      gap: bodyGap,\n      alignItems: 'start',\n      selectors: {\n        [`@media (max-width: ${BREAKPOINTS.sm}px)`]: { selectors: { '> *': { gridColumn: '1 / -1' } } },\n      },\n    } as IStyle,\n  });\n\n  if (variant === 'placeholder') {\n    return <div className={[styles.placeholder, className].filter(Boolean).join(' ')} style={rootStyle} />;\n  }\n\n  const showHeader = Boolean(title) || showCommandBar || collapsible;\n\n  return (\n    <div className={[variant === 'flat' ? styles.flat : styles.card, className].filter(Boolean).join(' ')} style={rootStyle}>\n      {notification && <div className={styles.notification}>{notification}</div>}\n      {showHeader && (\n        <SectionHeader\n          title={title}\n          statusText={statusText}\n          showCommandBar={showCommandBar}\n          commandBarItems={commandBarItems}\n          collapsible={collapsible}\n          collapsed={collapsed}\n          onToggle={toggle}\n        />\n      )}\n      {!collapsed && <div className={styles.body}>{children}</div>}\n    </div>\n  );\n};\n\nexport default Section;\n","import React from 'react';\nimport { mergeStyleSets, CommandBar, Icon } from '@fluentui/react';\nimport type { SectionHeaderProps } from '../types';\nimport { colors } from '../tokens/tokens';\nimport { sharedTitleStyle } from '../internal/styles';\n\n// Ported from reusable-components section header: flex title + status on the left,\n// overflow CommandBar on the right, Dynamics neutral underline. Adds a collapse chevron.\n\n/** Section header bar: title + status (left), command bar / actions (right), optional collapse toggle. */\nexport const SectionHeader: React.FC<SectionHeaderProps> = ({\n  title,\n  statusText,\n  showCommandBar,\n  commandBarItems = [],\n  actions,\n  collapsible,\n  collapsed,\n  onToggle,\n}) => {\n  const styles = mergeStyleSets({\n    root: {\n      display: 'flex',\n      justifyContent: 'space-between',\n      alignItems: 'center',\n      flexWrap: 'nowrap',\n      borderBottom: `1px solid ${colors.borderNeutral}`,\n      marginBottom: 16,\n      minHeight: 48,\n      width: '100%',\n    },\n    left: { display: 'flex', alignItems: 'center', gap: 8, minWidth: 0 },\n    title: sharedTitleStyle,\n    status: { marginLeft: 8, fontSize: '0.9em', color: colors.textSecondary },\n    chevron: {\n      cursor: 'pointer',\n      border: 'none',\n      background: 'transparent',\n      padding: 4,\n      display: 'flex',\n      alignItems: 'center',\n      color: colors.textSecondary,\n    },\n  });\n\n  return (\n    <div className={styles.root}>\n      <div className={styles.left}>\n        {collapsible && (\n          <button\n            type=\"button\"\n            className={styles.chevron}\n            onClick={onToggle}\n            aria-label={collapsed ? 'Expand section' : 'Collapse section'}\n            aria-expanded={!collapsed}\n          >\n            <Icon iconName={collapsed ? 'ChevronRight' : 'ChevronDown'} />\n          </button>\n        )}\n        {title && <span className={styles.title}>{title}</span>}\n        {statusText && <span className={styles.status}>{statusText}</span>}\n      </div>\n      {actions ? (\n        <div>{actions}</div>\n      ) : showCommandBar && commandBarItems.length > 0 ? (\n        <CommandBar\n          items={commandBarItems.slice(0, 2)}\n          overflowItems={commandBarItems.slice(2)}\n          styles={{ root: { background: 'transparent', padding: 0, height: 'auto' } }}\n        />\n      ) : null}\n    </div>\n  );\n};\n\nexport default SectionHeader;\n","import React from 'react';\nimport type { SectionCardProps } from '../types';\nimport { colors } from '../tokens/tokens';\nimport { Section } from './Section';\n\n/**\n * A Section with the Dynamics blue 3px accent top border.\n * NOTE: the accent is an inline style so it wins over the `card` variant's shorthand\n * `border` (mergeStyles class). If the accent ever moves into a class, use the\n * `borderTop*` longhand so it isn't clobbered by the shorthand `border`.\n */\nexport const SectionCard: React.FC<SectionCardProps> = ({\n  accentColor = colors.brand,\n  accentWidth = 3,\n  variant = 'card',\n  style,\n  ...rest\n}) => (\n  <Section\n    variant={variant}\n    {...rest}\n    style={{ borderTop: `${accentWidth}px solid ${accentColor}`, ...style }}\n  />\n);\n\nexport default SectionCard;\n","import React from 'react';\nimport { mergeStyleSets } from '@fluentui/react';\nimport type { FormHeaderProps } from '../types';\nimport { colors, typography } from '../tokens/tokens';\n\n/** Dynamics form header: persona + title/status (left), KPI/header fields (right). */\nexport const FormHeader: React.FC<FormHeaderProps> = ({\n  title,\n  subtitle,\n  status,\n  titleColor,\n  subtitleColor,\n  persona,\n  headerFields,\n  actions,\n  className,\n}) => {\n  const styles = mergeStyleSets({\n    root: {\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'space-between',\n      gap: 12,\n      padding: '12px 24px',\n      borderBottom: `1px solid ${colors.borderNeutral}`,\n      background: colors.surface,\n    },\n    main: { display: 'flex', alignItems: 'center', gap: 12, minWidth: 0 },\n    titleRow: { display: 'flex', alignItems: 'baseline', gap: 8, flexWrap: 'wrap' },\n    title: {\n      fontSize: typography.fontSize.lg,\n      fontWeight: typography.fontWeight.semibold,\n      fontFamily: typography.fontFamilySemibold,\n      color: titleColor || colors.textPrimary,\n      lineHeight: '1.3',\n    },\n    status: { fontSize: typography.fontSize.smPlus, color: colors.textSecondary },\n    subtitle: { fontSize: typography.fontSize.smPlus, color: subtitleColor || colors.textSecondary, marginTop: 2 },\n    // Right cluster: Dynamics header-field summary tiles (value over label) separated by\n    // hairline dividers — mirrors form-runtime HeaderShell's SummaryTile.\n    right: { display: 'flex', alignItems: 'center', justifyContent: 'flex-end', flexWrap: 'wrap', minWidth: 0 },\n    field: { display: 'flex', flexDirection: 'column', gap: 2, maxWidth: 200, minWidth: 0 },\n    fieldValue: {\n      fontSize: typography.fontSize.md,\n      fontWeight: typography.fontWeight.semibold,\n      color: colors.textPrimary,\n      whiteSpace: 'nowrap',\n      overflow: 'hidden',\n      textOverflow: 'ellipsis',\n    },\n    fieldLabel: {\n      fontSize: typography.fontSize.sm,\n      color: colors.textSecondary,\n      whiteSpace: 'nowrap',\n      overflow: 'hidden',\n      textOverflow: 'ellipsis',\n    },\n    divider: { width: 1, height: 24, background: colors.borderNeutral, margin: '0 12px', flexShrink: 0 },\n  });\n\n  const hasFields = headerFields != null && headerFields.length > 0;\n\n  return (\n    <div className={[styles.root, className].filter(Boolean).join(' ')}>\n      <div className={styles.main}>\n        {persona}\n        <div>\n          <div className={styles.titleRow}>\n            {title != null && <span className={styles.title}>{title}</span>}\n            {status != null && <span className={styles.status}>{status}</span>}\n          </div>\n          {subtitle != null && <div className={styles.subtitle}>{subtitle}</div>}\n        </div>\n      </div>\n      {(hasFields || actions != null) && (\n        <div className={styles.right}>\n          {hasFields &&\n            headerFields!.map((f, i) => (\n              <React.Fragment key={i}>\n                {i > 0 && <div className={styles.divider} aria-hidden />}\n                <div className={styles.field}>\n                  <div\n                    className={styles.fieldValue}\n                    title={typeof f.value === 'string' ? f.value : undefined}\n                  >\n                    {f.value}\n                  </div>\n                  <div className={styles.fieldLabel}>{f.label}</div>\n                </div>\n              </React.Fragment>\n            ))}\n          {actions != null && (\n            <div style={{ marginLeft: hasFields ? 12 : 0 }}>{actions}</div>\n          )}\n        </div>\n      )}\n    </div>\n  );\n};\n\nexport default FormHeader;\n","import React, { useState } from 'react';\nimport { Pivot, PivotItem, TooltipHost, type IPivotProps, type IPivotItemProps } from '@fluentui/react';\nimport type { PivotSurfaceProps, SurfaceTab } from '../types';\n\n/** Tabbed surface (Fluent Pivot). Controlled via `selectedId`/`onTabChange` or uncontrolled. */\nexport const PivotSurface: React.FC<PivotSurfaceProps> = ({\n  tabs,\n  selectedId,\n  defaultSelectedId,\n  onTabChange,\n  linkFormat = 'links',\n  className,\n}) => {\n  // Seed to the requested default, else the first *enabled* tab (don't open a disabled one).\n  const firstEnabledId = tabs.find((t) => !t.disabled)?.id ?? tabs[0]?.id;\n  const [internal, setInternal] = useState<string | undefined>(defaultSelectedId ?? firstEnabledId);\n  const selected = selectedId ?? internal;\n\n  const handleLinkClick = (item?: PivotItem) => {\n    const id = item?.props.itemKey;\n    if (!id) return;\n    // Guard: a disabled tab must not become the active tab (belt-and-braces —\n    // Fluent already blocks the click, but controlled callers rely on this too).\n    if (tabs.find((t) => t.id === id)?.disabled) return;\n    if (selectedId == null) setInternal(id);\n    onTabChange?.(id);\n  };\n\n  const active = tabs.find((t) => t.id === selected) ?? tabs[0];\n\n  // Wrap a tab's rendered link in a TooltipHost when the tab declares a `tooltip`\n  // (covers the icon + label). Returns undefined so Fluent uses its default render.\n  const renderItemLink = (tab: SurfaceTab) =>\n    tab.tooltip\n      ? (props?: IPivotItemProps, defaultRender?: (p?: IPivotItemProps) => JSX.Element | null) => (\n          <TooltipHost content={tab.tooltip}>{defaultRender?.(props)}</TooltipHost>\n        )\n      : undefined;\n\n  return (\n    <div className={className}>\n      <Pivot\n        selectedKey={selected}\n        onLinkClick={handleLinkClick}\n        linkFormat={linkFormat as IPivotProps['linkFormat']}\n        headersOnly\n      >\n        {tabs.map((t) => (\n          <PivotItem\n            key={t.id}\n            itemKey={t.id}\n            headerText={t.label}\n            itemIcon={t.iconName}\n            onRenderItemLink={renderItemLink(t)}\n            // Disabled tabs: block interaction AND read as disabled (Fluent's\n            // headerButtonProps.disabled alone leaves them looking enabled).\n            headerButtonProps={\n              t.disabled\n                ? { disabled: true, style: { opacity: 0.4, cursor: 'not-allowed', pointerEvents: 'none' } }\n                : undefined\n            }\n          />\n        ))}\n      </Pivot>\n      <div>{active?.content}</div>\n    </div>\n  );\n};\n\nexport default PivotSurface;\n","import React from 'react';\nimport { CommandBar } from '@fluentui/react';\nimport type { CommandSurfaceProps } from '../types';\n\n/** A Dynamics-style command bar (thin wrapper over Fluent CommandBar, no card chrome). */\nexport const CommandSurface: React.FC<CommandSurfaceProps> = ({ items, overflowItems, farItems, className }) => (\n  <div className={className}>\n    <CommandBar items={items} overflowItems={overflowItems} farItems={farItems} styles={{ root: { padding: 0 } }} />\n  </div>\n);\n\nexport default CommandSurface;\n","import React from 'react';\nimport { mergeStyles, DefaultButton, PrimaryButton, ActionButton, type IStyle } from '@fluentui/react';\nimport type { ActionBarProps, SurfaceActionButton } from '../types';\nimport { colors } from '../tokens/tokens';\n\nfunction renderButton(b: SurfaceActionButton) {\n  const common = {\n    text: b.label,\n    disabled: b.disabled,\n    onClick: b.onClick,\n    iconProps: b.iconName ? { iconName: b.iconName } : undefined,\n  };\n  // key passed directly (not spread) per React 18.\n  if (b.appearance === 'primary') return <PrimaryButton key={b.id} {...common} />;\n  if (b.appearance === 'subtle') return <ActionButton key={b.id} {...common} />;\n  return <DefaultButton key={b.id} {...common} />;\n}\n\n/** A sticky footer bar of action buttons, with optional left-aligned buttons. */\nexport const ActionBar: React.FC<ActionBarProps> = ({\n  buttons,\n  alignment = 'right',\n  inverted = false,\n  sticky = true,\n  className,\n}) => {\n  const justify = alignment === 'left' ? 'flex-start' : alignment === 'center' ? 'center' : 'flex-end';\n  const visible = buttons.filter((b) => !b.hidden);\n  const left = visible.filter((b) => b.position === 'left');\n  const right = visible.filter((b) => b.position !== 'left');\n  // `inverted` flips the right cluster so the primary action leads (leftmost).\n  const rightOrdered = inverted ? [...right].reverse() : right;\n\n  const cls = mergeStyles(\n    {\n      display: 'flex',\n      alignItems: 'center',\n      gap: 8,\n      padding: '12px 24px',\n      borderTop: `1px solid ${colors.borderNeutral}`,\n      background: colors.surface,\n      ...(sticky ? { position: 'sticky', bottom: 0, zIndex: 1 } : {}),\n    } as IStyle,\n    className,\n  );\n\n  // Left buttons pin to the start; the right cluster takes the remaining space and\n  // honors `alignment` within it — so left/center/right are visibly distinct even when\n  // a left-positioned button is present.\n  return (\n    <div className={cls}>\n      {left.length > 0 && <div style={{ display: 'flex', gap: 8 }}>{left.map(renderButton)}</div>}\n      <div style={{ display: 'flex', flex: 1, gap: 8, justifyContent: justify }}>{rightOrdered.map(renderButton)}</div>\n    </div>\n  );\n};\n\nexport default ActionBar;\n","import React from 'react';\nimport { mergeStyles, type IStyle } from '@fluentui/react';\nimport type { FooterProps } from '../types';\nimport { colors } from '../tokens/tokens';\n\n/** A sticky footer region (free-form children) — e.g. for dialog/panel actions. */\nexport const Footer: React.FC<FooterProps> = ({ sticky = true, align = 'right', className, children }) => {\n  const justify = align === 'left' ? 'flex-start' : align === 'center' ? 'center' : 'flex-end';\n  const cls = mergeStyles(\n    {\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: justify,\n      gap: 8,\n      padding: '12px 24px',\n      borderTop: `1px solid ${colors.borderNeutral}`,\n      background: colors.surface,\n      ...(sticky ? { position: 'sticky', bottom: 0, zIndex: 1 } : {}),\n    } as IStyle,\n    className,\n  );\n  return <div className={cls}>{children}</div>;\n};\n\nexport default Footer;\n","import React from 'react';\nimport { Modal, IconButton, mergeStyleSets } from '@fluentui/react';\nimport type { FormDialogSurfaceProps } from '../types';\nimport { dialogWidthCss, dialogHeightCss } from '../core/sizePresets';\nimport { colors, typography } from '../tokens/tokens';\n\n// Extracted from export-engine generateDialogForm (v8 <Modal> branch): the same\n// 95vw / ${width}px / 95vh flex-column main + scrollableContent, a header (title +\n// subheader | counter + close), a scrolling content region, and a sticky footer.\n// Named FormDialogSurface to avoid colliding with Fluent v9's `DialogSurface`.\n\n/**\n * Full Dynamics form-dialog (Fluent v8 Modal). Default width 1200 (lg), height 95vh.\n * `onDismiss` is the close affordance — when omitted, no close button renders, so a\n * blocking dialog without `onDismiss` is intentionally non-dismissible.\n */\nexport const FormDialogSurface: React.FC<FormDialogSurfaceProps> = ({\n  isOpen,\n  onDismiss,\n  title,\n  subheader,\n  size,\n  width,\n  height,\n  isBlocking = true,\n  recordCounter,\n  footer,\n  className,\n  children,\n}) => {\n  const widthCss = dialogWidthCss({ width, size });\n  const heightCss = dialogHeightCss(height);\n\n  const styles = mergeStyleSets({\n    header: {\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'space-between',\n      gap: 12,\n      padding: '12px 20px',\n      borderBottom: `1px solid ${colors.borderNeutral}`,\n    },\n    headerLeft: { display: 'flex', flexDirection: 'column', minWidth: 0 },\n    title: {\n      fontSize: typography.fontSize.lg,\n      fontWeight: typography.fontWeight.semibold,\n      fontFamily: typography.fontFamilySemibold,\n      color: colors.textPrimary,\n    },\n    subheader: { fontSize: typography.fontSize.smPlus, color: colors.textSecondary, marginTop: 2 },\n    headerRight: { display: 'flex', alignItems: 'center', gap: 8 },\n    counter: { fontSize: typography.fontSize.smPlus, color: colors.textSecondary },\n    content: { flex: 1, minHeight: 0, overflow: 'auto', padding: 20 },\n  });\n\n  const showHeader = Boolean(title) || Boolean(recordCounter) || Boolean(onDismiss);\n\n  return (\n    <Modal\n      isOpen={isOpen}\n      onDismiss={onDismiss}\n      isBlocking={isBlocking}\n      className={className}\n      styles={{\n        main: {\n          maxWidth: '95vw',\n          width: widthCss,\n          height: heightCss,\n          maxHeight: '95vh',\n          display: 'flex',\n          flexDirection: 'column',\n        },\n        scrollableContent: {\n          overflow: 'hidden',\n          display: 'flex',\n          flexDirection: 'column',\n          flex: 1,\n          minHeight: 0,\n        },\n      }}\n    >\n      {showHeader && (\n        <div className={styles.header}>\n          <div className={styles.headerLeft}>\n            {title && <span className={styles.title}>{title}</span>}\n            {subheader && <span className={styles.subheader}>{subheader}</span>}\n          </div>\n          <div className={styles.headerRight}>\n            {recordCounter && (\n              <span className={styles.counter}>\n                {recordCounter.current} of {recordCounter.total}\n              </span>\n            )}\n            {onDismiss && (\n              <IconButton\n                iconProps={{ iconName: 'Cancel' }}\n                ariaLabel=\"Close\"\n                onClick={onDismiss}\n                styles={{ root: { color: colors.textSecondary } }}\n              />\n            )}\n          </div>\n        </div>\n      )}\n      <div className={styles.content}>{children}</div>\n      {/* Footer rendered bare: an ActionBar supplies its own full-width divider + padding. */}\n      {footer}\n    </Modal>\n  );\n};\n\nexport default FormDialogSurface;\n","import React from 'react';\nimport { Modal, mergeStyleSets } from '@fluentui/react';\nimport type { ModalSurfaceProps } from '../types';\nimport { dialogWidthPx, MODAL_AUTOSIZE_MIN_WIDTH } from '../core/sizePresets';\nimport { colors, typography } from '../tokens/tokens';\n\n/** A generic modal (Fluent v8 Modal) — title + content + optional footer; lighter than FormDialogSurface. */\nexport const ModalSurface: React.FC<ModalSurfaceProps> = ({\n  isOpen,\n  onDismiss,\n  title,\n  size,\n  width,\n  isBlocking = true,\n  autoSize,\n  footer,\n  className,\n  children,\n}) => {\n  const main = autoSize\n    ? { width: 'auto', minWidth: MODAL_AUTOSIZE_MIN_WIDTH, maxWidth: '100%' }\n    : { maxWidth: '95vw', width: `${dialogWidthPx({ width, size })}px` };\n\n  const styles = mergeStyleSets({\n    title: {\n      fontSize: typography.fontSize.lg,\n      fontWeight: typography.fontWeight.semibold,\n      fontFamily: typography.fontFamilySemibold,\n      color: colors.textPrimary,\n      padding: '16px 20px 0',\n    },\n    content: { padding: 20 },\n  });\n\n  // The footer is rendered bare — an ActionBar footer supplies its own full-width\n  // divider (borderTop) + padding, so a wrapper here would double the divider line.\n  return (\n    <Modal isOpen={isOpen} onDismiss={onDismiss} isBlocking={isBlocking} className={className} styles={{ main }}>\n      {title && <div className={styles.title}>{title}</div>}\n      <div className={styles.content}>{children}</div>\n      {footer}\n    </Modal>\n  );\n};\n\nexport default ModalSurface;\n","import React from 'react';\nimport { Panel, PanelType } from '@fluentui/react';\nimport type { PanelSurfaceProps } from '../types';\nimport { panelKindFromWidth, panelCustomWidthPx } from '../core/sizePresets';\n\n// Extracted from export-engine generatePanelForm (v8 <Panel> branch): headerText,\n// type derived from width (>500 → medium, else custom + customWidth), footer at bottom.\n// Exposes the full 8-literal panelType (a superset of the codegen's medium/custom binary).\n\n/** A Dynamics side panel (Fluent v8 Panel). */\nexport const PanelSurface: React.FC<PanelSurfaceProps> = ({\n  isOpen,\n  onDismiss,\n  title,\n  panelType,\n  width,\n  hasCloseButton = true,\n  isLightDismiss = false,\n  isFooterAtBottom = true,\n  isNonModal = false,\n  footer,\n  children,\n}) => {\n  const kind = panelType ?? panelKindFromWidth(width);\n  const resolvedType = PanelType[kind];\n  const customWidth = kind === 'custom' || kind === 'customNear' ? `${panelCustomWidthPx(width)}px` : undefined;\n\n  return (\n    <Panel\n      isOpen={isOpen}\n      onDismiss={onDismiss}\n      headerText={title}\n      type={resolvedType}\n      customWidth={customWidth}\n      hasCloseButton={hasCloseButton}\n      isLightDismiss={isLightDismiss}\n      isFooterAtBottom={isFooterAtBottom}\n      isBlocking={!isNonModal}\n      onRenderFooterContent={footer ? () => <>{footer}</> : undefined}\n    >\n      <div style={{ padding: '12px 0' }}>{children}</div>\n    </Panel>\n  );\n};\n\nexport default PanelSurface;\n","import React from 'react';\nimport { Callout, DirectionalHint, type ICalloutProps } from '@fluentui/react';\nimport type { CalloutSurfaceProps } from '../types';\nimport { calloutWidthPx } from '../core/sizePresets';\n\n// Extracted from export-engine generateCalloutForm (v8 <Callout> branch): width 320 +\n// bottomLeftEdge + padding 16. beak/gap are additive opt-ins (the form-callout path omits\n// them; sourced from the embedded-callout defaults).\n\n/** A lightweight contextual callout (Fluent v8 Callout) anchored to a target. */\nexport const CalloutSurface: React.FC<CalloutSurfaceProps> = ({\n  target,\n  isOpen = true,\n  onDismiss,\n  width,\n  directionalHint = 'bottomLeftEdge',\n  isBeakVisible = true,\n  beakWidth = 16,\n  gapSpace = 0,\n  className,\n  children,\n}) => {\n  if (!isOpen) return null;\n  return (\n    <Callout\n      target={(target ?? undefined) as ICalloutProps['target']}\n      onDismiss={onDismiss}\n      directionalHint={DirectionalHint[directionalHint]}\n      isBeakVisible={isBeakVisible}\n      beakWidth={beakWidth}\n      gapSpace={gapSpace}\n      className={className}\n      styles={{ root: { width: calloutWidthPx(width), padding: 16 } }}\n    >\n      {children}\n    </Callout>\n  );\n};\n\nexport default CalloutSurface;\n","import React from 'react';\nimport { TooltipHost, DirectionalHint, TooltipDelay } from '@fluentui/react';\nimport type { TooltipSurfaceProps } from '../types';\n\nconst DELAY_MAP: Record<NonNullable<TooltipSurfaceProps['delay']>, TooltipDelay> = {\n  zero: TooltipDelay.zero,\n  medium: TooltipDelay.medium,\n  long: TooltipDelay.long,\n};\n\n/** A tooltip wrapper (Fluent v8 TooltipHost). New surface — no codegen counterpart. */\nexport const TooltipSurface: React.FC<TooltipSurfaceProps> = ({\n  content,\n  directionalHint = 'bottomCenter',\n  delay = 'medium',\n  children,\n}) => (\n  <TooltipHost content={content} directionalHint={DirectionalHint[directionalHint]} delay={DELAY_MAP[delay]}>\n    {children}\n  </TooltipHost>\n);\n\nexport default TooltipSurface;\n","import React from 'react';\nimport { mergeStyles, type IStyle } from '@fluentui/react';\nimport type { MasterDetailSurfaceProps } from '../types';\nimport { colors } from '../tokens/tokens';\nimport { BREAKPOINTS } from '../responsive/breakpoints';\n\n/** Master (left rail) + detail (right pane) split that stacks vertically below `collapseBelow`. */\nexport const MasterDetailSurface: React.FC<MasterDetailSurfaceProps> = ({\n  master,\n  detail,\n  detailFallback,\n  splitRatio = 0.38,\n  collapseBelow = 'md',\n  className,\n}) => {\n  const masterFr = Math.min(90, Math.max(10, Math.round(splitRatio * 100)));\n  const detailFr = 100 - masterFr;\n  const collapsePx = BREAKPOINTS[collapseBelow];\n\n  const rootCls = mergeStyles(\n    {\n      display: 'grid',\n      gridTemplateColumns: `${masterFr}fr ${detailFr}fr`,\n      minHeight: 0,\n      selectors: { [`@media (max-width: ${collapsePx}px)`]: { gridTemplateColumns: '1fr' } },\n    } as IStyle,\n    className,\n  );\n  const masterCls = mergeStyles({\n    minWidth: 0,\n    overflow: 'auto',\n    borderRight: `1px solid ${colors.borderNeutral}`,\n    selectors: {\n      [`@media (max-width: ${collapsePx}px)`]: {\n        borderRight: 'none',\n        borderBottom: `1px solid ${colors.borderNeutral}`,\n      },\n    },\n  } as IStyle);\n  const detailCls = mergeStyles({ minWidth: 0, overflow: 'auto' });\n\n  return (\n    <div className={rootCls}>\n      <div className={masterCls}>{master}</div>\n      <div className={detailCls}>{detail ?? detailFallback}</div>\n    </div>\n  );\n};\n\nexport default MasterDetailSurface;\n","import React from 'react';\nimport { mergeStyles, type IStyle } from '@fluentui/react';\nimport type { DashboardSurfaceProps } from '../types';\nimport { CARD_REFLOW_WIDTH, BREAKPOINTS } from '../responsive/breakpoints';\n\n/** A reflowing grid of dashboard tiles (N cols → 2 below 900px → 1 below 480px). */\nexport const DashboardSurface: React.FC<DashboardSurfaceProps> = ({ tiles, columns = 2, gap = 16, className }) => {\n  const cls = mergeStyles(\n    {\n      display: 'grid',\n      gridTemplateColumns: `repeat(${columns}, minmax(0, 1fr))`,\n      gap,\n      alignItems: 'start',\n      selectors: {\n        [`@media (max-width: ${CARD_REFLOW_WIDTH}px)`]: { gridTemplateColumns: 'repeat(2, minmax(0, 1fr))' },\n        [`@media (max-width: ${BREAKPOINTS.sm}px)`]: { gridTemplateColumns: '1fr' },\n      },\n    } as IStyle,\n    className,\n  );\n  return (\n    <div className={cls}>\n      {tiles.map((tile, i) => (\n        <div key={`tile-${i}`}>{tile}</div>\n      ))}\n    </div>\n  );\n};\n\nexport default DashboardSurface;\n","// Maps a form-runtime FormDefinition to resolved surface-kit overlay props.\n//\n// IMPORTANT: do NOT import @dataverse-kit/form-runtime here — it's a cross-tree sibling.\n// We duck-type the subset of its FormDefinition we read. Keep `FormDefinitionLike` in\n// sync with msft/04-dynamics/dynamics-toolkit/packages/form-runtime/src/types/form.ts —\n// the __compat__/formDefinition.test-d.ts type test (run under typecheck:stories)\n// fails to compile if the real schema drifts away from this shape.\nimport {\n  dialogWidthPx,\n  dialogHeightCss,\n  panelKindFromWidth,\n  panelCustomWidthPx,\n  calloutWidthPx,\n} from '../core/sizePresets';\n\n/** The overlay FormTypes surface-kit knows how to resolve (form-runtime also has the tab-only 'related'/'audit'). */\nexport type SurfaceFormType = 'main' | 'dialog' | 'panel' | 'callout';\n\n// Only the settings fields the adapter actually reads — keeping the duck-type minimal\n// reduces the drift surface against form-runtime's (much larger) FormSettings.\nexport interface FormSettingsLike {\n  width?: number;\n  height?: number;\n  panelType?: string;\n}\n\nexport interface FormDefinitionLike {\n  type?: SurfaceFormType;\n  name?: string;\n  settings?: FormSettingsLike;\n}\n\nexport type ResolvedSurface =\n  | { kind: 'main' }\n  | { kind: 'dialog'; widthPx: number; heightCss: string; title?: string }\n  | { kind: 'panel'; panelType: string; customWidthPx?: number; title?: string }\n  | { kind: 'callout'; widthPx: number; title?: string };\n\n/** Resolve a (duck-typed) form-runtime FormDefinition to the right surface + sizing props. */\nexport function fromFormDefinition(def: FormDefinitionLike): ResolvedSurface {\n  const s = def.settings ?? {};\n  switch (def.type) {\n    case 'dialog':\n      return {\n        kind: 'dialog',\n        widthPx: dialogWidthPx({ width: s.width }),\n        heightCss: dialogHeightCss(s.height),\n        title: def.name,\n      };\n    case 'panel': {\n      const panelType = s.panelType ?? panelKindFromWidth(s.width);\n      return {\n        kind: 'panel',\n        panelType,\n        customWidthPx: panelType === 'custom' ? panelCustomWidthPx(s.width) : undefined,\n        title: def.name,\n      };\n    }\n    case 'callout':\n      return { kind: 'callout', widthPx: calloutWidthPx(s.width), title: def.name };\n    case 'main':\n    default:\n      return { kind: 'main' };\n  }\n}\n"],"mappings":"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","names":["useState","useEffect","mergeStyles","jsx","mergeStyles","jsx","mergeStyles","jsx","mergeStyles","jsx","useState","mergeStyleSets","mergeStyleSets","jsx","jsxs","mergeStyleSets","jsx","jsxs","useState","mergeStyleSets","jsx","React","mergeStyleSets","jsx","jsxs","mergeStyleSets","React","useState","jsx","jsxs","CommandBar","jsx","mergeStyles","jsx","jsxs","mergeStyles","mergeStyles","jsx","mergeStyles","mergeStyleSets","jsx","jsxs","mergeStyleSets","Modal","mergeStyleSets","jsx","jsxs","mergeStyleSets","Modal","jsx","jsx","TooltipHost","DirectionalHint","jsx","mergeStyles","jsx","jsxs","mergeStyles","mergeStyles","jsx","mergeStyles"]}