@signalflare-ai/ui 1.2.0 → 1.3.0

package/dist/{text-Cqryz7rk.js → text-iQ0YUFNg.js}

@@ -1,6 +1,6 @@
 "use client";
-import { t as cn } from "./cn-YROP2_ox.js";
-import { t as MeasuredText } from "./measured-text-BI3dTJmH.js";
+import { t as cn } from "./cn-CmAOpn49.js";
+import { t as MeasuredText } from "./measured-text-CXkdw9Yr.js";
 import { forwardRef, useMemo } from "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/text/text.tsx
@@ -63,8 +63,7 @@ var SF_TEXT_VARIANTS = {
 		}
 	}
 };
-function getDefaultWrap(variant) {
-	if (variant === "heading1" || variant === "heading2" || variant === "heading3") return "balance";
+function getDefaultWrap(_variant) {
 	return "natural";
 }
 /**
@@ -122,4 +121,4 @@ Text.displayName = "Text";
 //#endregion
 export { Text as t };
 
-//# sourceMappingURL=text-Cqryz7rk.js.map
+//# sourceMappingURL=text-iQ0YUFNg.js.map

package/dist/{text-Cqryz7rk.js.map → text-iQ0YUFNg.js.map}

@@ -1 +1 @@
-{"version":3,"file":"text-Cqryz7rk.js","names":[],"sources":["../src/components/text/text.tsx"],"sourcesContent":["import {\n  type CSSProperties,\n  type ComponentPropsWithoutRef,\n  type ElementRef,\n  type ForwardedRef,\n  forwardRef,\n  useMemo,\n  type ElementType,\n} from \"react\";\n\nimport { cn } from \"../../utils/cn\";\nimport { MeasuredText, type MeasuredTextMode } from \"../../utils/measured-text\";\n\n/** Text variant and size definitions mapping names to their Tailwind classes. */\nexport const SF_TEXT_VARIANTS = {\n  variant: {\n    heading1: {\n      classes: \"text-3xl font-semibold\",\n      description: \"Large heading for page titles\",\n    },\n    heading2: {\n      classes: \"text-2xl font-semibold\",\n      description: \"Medium heading for section titles\",\n    },\n    heading3: {\n      classes: \"text-lg font-semibold\",\n      description: \"Small heading for subsections\",\n    },\n    body: {\n      classes: \"text-sf-default\",\n      description: \"Default body text\",\n    },\n    secondary: {\n      classes: \"text-sf-subtle\",\n      description: \"Muted text for secondary information\",\n    },\n    success: {\n      classes: \"text-sf-link\",\n      description: \"Success state text\",\n    },\n    error: {\n      classes: \"text-sf-danger\",\n      description: \"Error state text\",\n    },\n    mono: {\n      classes: \"font-mono\",\n      description: \"Monospace text for code\",\n    },\n    \"mono-secondary\": {\n      classes: \"font-mono text-sf-subtle\",\n      description: \"Muted monospace text\",\n    },\n  },\n  size: {\n    xs: {\n      classes: \"text-xs\",\n      description: \"Extra small text\",\n    },\n    sm: {\n      classes: \"text-sm\",\n      description: \"Small text\",\n    },\n    base: {\n      classes: \"text-base\",\n      description: \"Default text size\",\n    },\n    lg: {\n      classes: \"text-lg\",\n      description: \"Large text\",\n    },\n  },\n} as const;\n\nexport const SF_TEXT_DEFAULT_VARIANTS = {\n  variant: \"body\",\n  size: \"base\",\n} as const;\n\n/**\n * SF_TEXT_STYLING - Typography metadata for Figma generator\n *\n * This export provides structured styling information extracted from text.tsx\n * for use by the Figma plugin generator. It documents font sizes, weights,\n * colors, and font families used across all Text variants.\n *\n * Source of truth chain:\n * text.tsx (this file) → component-registry.json → text.ts (Figma generator)\n */\nexport const SF_TEXT_STYLING = {\n  fontSizes: {\n    xs: 12,\n    sm: 14,\n    base: 16,\n    lg: 18,\n    xl: 20,\n    \"2xl\": 24,\n    \"3xl\": 30,\n  },\n  fontWeights: {\n    normal: 400,\n    medium: 500,\n    semibold: 600,\n  },\n  baseColor: \"text-sf-default\",\n  variantColors: {\n    body: \"text-sf-default\",\n    secondary: \"text-sf-subtle\",\n    success: \"text-sf-link\",\n    error: \"text-sf-danger\",\n    mono: \"text-sf-default\",\n    \"mono-secondary\": \"text-sf-subtle\",\n  },\n  fontFamilies: {\n    default: \"sans-serif\",\n    mono: \"monospace\",\n  },\n} as const;\n\n// Derived types from SF_TEXT_VARIANTS\nexport type SFTextVariant = keyof typeof SF_TEXT_VARIANTS.variant;\nexport type SFTextSize = keyof typeof SF_TEXT_VARIANTS.size;\n\nexport interface SFTextVariantsProps {\n  variant?: SFTextVariant;\n  size?: SFTextSize;\n}\n\nexport function textVariants({\n  variant = SF_TEXT_DEFAULT_VARIANTS.variant,\n  size = SF_TEXT_DEFAULT_VARIANTS.size,\n}: SFTextVariantsProps = {}) {\n  return cn(\n    SF_TEXT_VARIANTS.variant[variant].classes,\n    SF_TEXT_VARIANTS.size[size].classes\n  );\n}\n\n// Legacy types for backwards compatibility\ntype Heading = \"heading1\" | \"heading2\" | \"heading3\";\ntype Copy = \"body\" | \"secondary\" | \"success\" | \"error\";\ntype Monospace = \"mono\" | \"mono-secondary\";\ntype TextSize = SFTextSize;\ntype TextVariant = SFTextVariant;\n\ntype BaseTextProps = Omit<\n  ComponentPropsWithoutRef<\"span\">,\n  \"className\" | \"style\"\n> & {\n  DANGEROUS_className?: string;\n  DANGEROUS_style?: CSSProperties;\n  as?: ElementType;\n  /**\n   * Text layout strategy using pretext-driven measurement.\n   * - `\"natural\"` — No measurement, normal browser wrapping (default for body).\n   * - `\"balance\"` — Even wrapping, smallest maxWidth without adding lines (default for headings).\n   * - `\"shrink\"` — Hug widest natural line (maxWidth = line width). Good for chat bubbles.\n   * - `\"reserve\"` — Reserve height based on line count. Good for streaming text.\n   * - `false` — Same as `\"natural\"`, explicit opt-out.\n   * @default \"balance\" for headings, \"natural\" for body/mono/secondary.\n   */\n  wrap?: MeasuredTextMode | false;\n  /**\n   * For `wrap=\"reserve\"`: reserve this many lines of height.\n   * If omitted, measures current content to determine line count.\n   */\n  reserveLines?: number;\n};\n\ntype TextPropsInternal<Variant extends TextVariant = \"body\"> = BaseTextProps &\n  (Variant extends Copy\n    ? {\n        variant?: Variant;\n        bold?: boolean;\n        size?: TextSize;\n      }\n    : Variant extends Monospace\n      ? {\n          variant?: Variant;\n          bold?: never;\n          size?: \"lg\";\n        }\n      : Variant extends Heading\n        ? {\n            variant?: Variant;\n            bold?: never;\n            size?: never;\n          }\n        : never);\n\n/**\n * Text component props.\n *\n * @example\n * ```tsx\n * <Text variant=\"heading1\">Page Title</Text>\n * <Text variant=\"body\">Default paragraph text.</Text>\n * <Text variant=\"secondary\" size=\"sm\">Muted helper text</Text>\n * <Text variant=\"error\">Something went wrong</Text>\n * <Text variant=\"mono\">console.log(\"code\")</Text>\n * <Text wrap=\"shrink\">Hug content width</Text>\n * <Text wrap=\"reserve\" reserveLines={3}>Streaming content...</Text>\n * ```\n */\nexport interface TextProps {\n  /**\n   * Text style variant. Determines color, font, and weight.\n   * - `\"heading1\"` — Large page title (30px, semibold)\n   * - `\"heading2\"` — Section title (24px, semibold)\n   * - `\"heading3\"` — Subsection title (18px, semibold)\n   * - `\"body\"` — Default body text\n   * - `\"secondary\"` — Muted text for secondary information\n   * - `\"success\"` — Success state text\n   * - `\"error\"` — Error state text\n   * - `\"mono\"` — Monospace text for code\n   * - `\"mono-secondary\"` — Muted monospace text\n   * @default \"body\"\n   */\n  variant?: SFTextVariant;\n  /**\n   * Text size (only applies to body/secondary/success/error variants).\n   * - `\"xs\"` — 12px\n   * - `\"sm\"` — 14px\n   * - `\"base\"` — 16px\n   * - `\"lg\"` — 18px\n   * @default \"base\"\n   */\n  size?: SFTextSize;\n  /** Whether to use bold font weight (only applies to body variants). */\n  bold?: boolean;\n  /** The HTML element type to render as (e.g. `\"span\"`, `\"p\"`, `\"h1\"`). Auto-selected based on variant if omitted. */\n  as?: ElementType;\n  /** Text content. */\n  children?: React.ReactNode;\n  /**\n   * Text layout strategy using pretext-driven measurement.\n   * - `\"natural\"` — No measurement, normal browser wrapping (default for body).\n   * - `\"balance\"` — Even wrapping, smallest maxWidth without adding lines (default for headings).\n   * - `\"shrink\"` — Hug widest natural line (maxWidth = line width). Good for chat bubbles.\n   * - `\"reserve\"` — Reserve height based on line count. Good for streaming text.\n   * @default \"balance\" for headings, \"natural\" for body/mono.\n   */\n  wrap?: MeasuredTextMode | false;\n  /**\n   * For `wrap=\"reserve\"`: reserve this many lines of height.\n   * If omitted, measures current content to determine line count.\n   */\n  reserveLines?: number;\n}\n\nfunction getDefaultWrap(variant: TextVariant): MeasuredTextMode | false {\n  if (variant === \"heading1\" || variant === \"heading2\" || variant === \"heading3\") {\n    return \"balance\";\n  }\n  return \"natural\";\n}\n\n/**\n * Typography component for rendering text with consistent styling.\n * Automatically selects the appropriate HTML element based on variant\n * (`h1`/`h2`/`h3` for headings, `p` for body, `span` for mono).\n *\n * Now includes pretext-driven layout for precise wrapping and spacing.\n *\n * @example\n * ```tsx\n * <Text variant=\"heading1\">Dashboard</Text>\n * <Text>Default body text</Text>\n * <Text wrap=\"shrink\">Compact bubble</Text>\n * ```\n */\nfunction _Text<Variant extends TextVariant = \"body\">(\n  {\n    variant = \"body\" as Variant,\n    bold = false,\n    size = \"base\",\n    children,\n    DANGEROUS_className,\n    DANGEROUS_style,\n    as,\n    wrap,\n    reserveLines,\n    ...props\n  }: TextPropsInternal<Variant>,\n  ref: ForwardedRef<HTMLHeadingElement>\n) {\n  const isCopy = [\"body\", \"secondary\", \"success\", \"error\"].includes(variant);\n  const isMono = [\"mono\", \"mono-secondary\"].includes(variant);\n\n  const Component = useMemo(() => {\n    if (as) return as;\n    if (variant === \"heading1\") return \"h1\";\n    if (variant === \"heading2\") return \"h2\";\n    if (variant === \"heading3\") return \"h3\";\n    if ([\"mono\", \"mono-secondary\"].includes(variant)) return \"span\";\n    return \"p\";\n  }, [variant, as]);\n\n  const effectiveWrap = wrap ?? getDefaultWrap(variant);\n  const className = cn(\n    \"text-sf-default\",\n    SF_TEXT_VARIANTS.variant[variant].classes,\n    isCopy ? SF_TEXT_VARIANTS.size[size].classes : \"\",\n    isCopy && bold ? \"font-medium\" : \"\",\n    // Monospace fonts need to be 1pt smaller than body text to optically match\n    isMono &&\n      (size === \"lg\"\n        ? SF_TEXT_VARIANTS.size.base.classes\n        : SF_TEXT_VARIANTS.size.sm.classes),\n    DANGEROUS_className\n  );\n\n  // Use MeasuredText for non-natural modes, or when reserveLines is set\n  if (effectiveWrap !== \"natural\" && effectiveWrap !== false) {\n    return (\n      <MeasuredText\n        ref={ref as React.RefObject<HTMLElement>}\n        as={Component}\n        wrap={effectiveWrap}\n        reserveLines={reserveLines}\n        className={className}\n        style={DANGEROUS_style}\n        {...props}\n      >\n        {children}\n      </MeasuredText>\n    );\n  }\n\n  // Natural mode: render directly without measurement overhead\n  return (\n    <Component\n      ref={ref}\n      className={className}\n      style={DANGEROUS_style}\n      {...props}\n    >\n      {children}\n    </Component>\n  );\n}\n\nexport const Text = forwardRef(_Text) as <Variant extends TextVariant = \"body\">(\n  props: TextPropsInternal<Variant> & {\n    ref?: ForwardedRef<ElementRef<\"span\">>;\n  }\n) => React.ReactElement & { displayName?: string };\n\n// Cast needed because of the complex forwardRef type signature\n(Text as { displayName?: string }).displayName = \"Text\";\n"],"mappings":";;;;;;;AAcA,IAAa,mBAAmB;CAC9B,SAAS;EACP,UAAU;GACR,SAAS;GACT,aAAa;GACd;EACD,UAAU;GACR,SAAS;GACT,aAAa;GACd;EACD,UAAU;GACR,SAAS;GACT,aAAa;GACd;EACD,MAAM;GACJ,SAAS;GACT,aAAa;GACd;EACD,WAAW;GACT,SAAS;GACT,aAAa;GACd;EACD,SAAS;GACP,SAAS;GACT,aAAa;GACd;EACD,OAAO;GACL,SAAS;GACT,aAAa;GACd;EACD,MAAM;GACJ,SAAS;GACT,aAAa;GACd;EACD,kBAAkB;GAChB,SAAS;GACT,aAAa;GACd;EACF;CACD,MAAM;EACJ,IAAI;GACF,SAAS;GACT,aAAa;GACd;EACD,IAAI;GACF,SAAS;GACT,aAAa;GACd;EACD,MAAM;GACJ,SAAS;GACT,aAAa;GACd;EACD,IAAI;GACF,SAAS;GACT,aAAa;GACd;EACF;CACF;AAkLD,SAAS,eAAe,SAAgD;AACtE,KAAI,YAAY,cAAc,YAAY,cAAc,YAAY,WAClE,QAAO;AAET,QAAO;;;;;;;;;;;;;;;;AAiBT,SAAS,MACP,EACE,UAAU,QACV,OAAO,OACP,OAAO,QACP,UACA,qBACA,iBACA,IACA,MACA,cACA,GAAG,SAEL,KACA;CACA,MAAM,SAAS;EAAC;EAAQ;EAAa;EAAW;EAAQ,CAAC,SAAS,QAAQ;CAC1E,MAAM,SAAS,CAAC,QAAQ,iBAAiB,CAAC,SAAS,QAAQ;CAE3D,MAAM,YAAY,cAAc;AAC9B,MAAI,GAAI,QAAO;AACf,MAAI,YAAY,WAAY,QAAO;AACnC,MAAI,YAAY,WAAY,QAAO;AACnC,MAAI,YAAY,WAAY,QAAO;AACnC,MAAI,CAAC,QAAQ,iBAAiB,CAAC,SAAS,QAAQ,CAAE,QAAO;AACzD,SAAO;IACN,CAAC,SAAS,GAAG,CAAC;CAEjB,MAAM,gBAAgB,QAAQ,eAAe,QAAQ;CACrD,MAAM,YAAY,GAChB,mBACA,iBAAiB,QAAQ,SAAS,SAClC,SAAS,iBAAiB,KAAK,MAAM,UAAU,IAC/C,UAAU,OAAO,gBAAgB,IAEjC,WACG,SAAS,OACN,iBAAiB,KAAK,KAAK,UAC3B,iBAAiB,KAAK,GAAG,UAC/B,oBACD;AAGD,KAAI,kBAAkB,aAAa,kBAAkB,MACnD,QACE,oBAAC,cAAD;EACO;EACL,IAAI;EACJ,MAAM;EACQ;EACH;EACX,OAAO;EACP,GAAI;EAEH;EACY,CAAA;AAKnB,QACE,oBAAC,WAAD;EACO;EACM;EACX,OAAO;EACP,GAAI;EAEH;EACS,CAAA;;AAIhB,IAAa,OAAO,WAAW,MAAM;AAOrC,KAAmC,cAAc"}
+{"version":3,"file":"text-iQ0YUFNg.js","names":[],"sources":["../src/components/text/text.tsx"],"sourcesContent":["import {\n  type CSSProperties,\n  type ComponentPropsWithoutRef,\n  type ElementRef,\n  type ForwardedRef,\n  forwardRef,\n  useMemo,\n  type ElementType,\n} from \"react\";\n\nimport { cn } from \"../../utils/cn\";\nimport { MeasuredText, type MeasuredTextMode } from \"../../utils/measured-text\";\n\n/** Text variant and size definitions mapping names to their Tailwind classes. */\nexport const SF_TEXT_VARIANTS = {\n  variant: {\n    heading1: {\n      classes: \"text-3xl font-semibold\",\n      description: \"Large heading for page titles\",\n    },\n    heading2: {\n      classes: \"text-2xl font-semibold\",\n      description: \"Medium heading for section titles\",\n    },\n    heading3: {\n      classes: \"text-lg font-semibold\",\n      description: \"Small heading for subsections\",\n    },\n    body: {\n      classes: \"text-sf-default\",\n      description: \"Default body text\",\n    },\n    secondary: {\n      classes: \"text-sf-subtle\",\n      description: \"Muted text for secondary information\",\n    },\n    success: {\n      classes: \"text-sf-link\",\n      description: \"Success state text\",\n    },\n    error: {\n      classes: \"text-sf-danger\",\n      description: \"Error state text\",\n    },\n    mono: {\n      classes: \"font-mono\",\n      description: \"Monospace text for code\",\n    },\n    \"mono-secondary\": {\n      classes: \"font-mono text-sf-subtle\",\n      description: \"Muted monospace text\",\n    },\n  },\n  size: {\n    xs: {\n      classes: \"text-xs\",\n      description: \"Extra small text\",\n    },\n    sm: {\n      classes: \"text-sm\",\n      description: \"Small text\",\n    },\n    base: {\n      classes: \"text-base\",\n      description: \"Default text size\",\n    },\n    lg: {\n      classes: \"text-lg\",\n      description: \"Large text\",\n    },\n  },\n} as const;\n\nexport const SF_TEXT_DEFAULT_VARIANTS = {\n  variant: \"body\",\n  size: \"base\",\n} as const;\n\n/**\n * SF_TEXT_STYLING - Typography metadata for Figma generator\n *\n * This export provides structured styling information extracted from text.tsx\n * for use by the Figma plugin generator. It documents font sizes, weights,\n * colors, and font families used across all Text variants.\n *\n * Source of truth chain:\n * text.tsx (this file) → component-registry.json → text.ts (Figma generator)\n */\nexport const SF_TEXT_STYLING = {\n  fontSizes: {\n    xs: 12,\n    sm: 14,\n    base: 16,\n    lg: 18,\n    xl: 20,\n    \"2xl\": 24,\n    \"3xl\": 30,\n  },\n  fontWeights: {\n    normal: 400,\n    medium: 500,\n    semibold: 600,\n  },\n  baseColor: \"text-sf-default\",\n  variantColors: {\n    body: \"text-sf-default\",\n    secondary: \"text-sf-subtle\",\n    success: \"text-sf-link\",\n    error: \"text-sf-danger\",\n    mono: \"text-sf-default\",\n    \"mono-secondary\": \"text-sf-subtle\",\n  },\n  fontFamilies: {\n    default: \"sans-serif\",\n    mono: \"monospace\",\n  },\n} as const;\n\n// Derived types from SF_TEXT_VARIANTS\nexport type SFTextVariant = keyof typeof SF_TEXT_VARIANTS.variant;\nexport type SFTextSize = keyof typeof SF_TEXT_VARIANTS.size;\n\nexport interface SFTextVariantsProps {\n  variant?: SFTextVariant;\n  size?: SFTextSize;\n}\n\nexport function textVariants({\n  variant = SF_TEXT_DEFAULT_VARIANTS.variant,\n  size = SF_TEXT_DEFAULT_VARIANTS.size,\n}: SFTextVariantsProps = {}) {\n  return cn(\n    SF_TEXT_VARIANTS.variant[variant].classes,\n    SF_TEXT_VARIANTS.size[size].classes\n  );\n}\n\n// Legacy types for backwards compatibility\ntype Heading = \"heading1\" | \"heading2\" | \"heading3\";\ntype Copy = \"body\" | \"secondary\" | \"success\" | \"error\";\ntype Monospace = \"mono\" | \"mono-secondary\";\ntype TextSize = SFTextSize;\ntype TextVariant = SFTextVariant;\n\ntype BaseTextProps = Omit<\n  ComponentPropsWithoutRef<\"span\">,\n  \"className\" | \"style\"\n> & {\n  DANGEROUS_className?: string;\n  DANGEROUS_style?: CSSProperties;\n  as?: ElementType;\n  /**\n   * Text layout strategy using pretext-driven measurement.\n   * - `\"natural\"` — No measurement, normal browser wrapping (default for body).\n   * - `\"balance\"` — Even wrapping, smallest maxWidth without adding lines (default for headings).\n   * - `\"shrink\"` — Hug widest natural line (maxWidth = line width). Good for chat bubbles.\n   * - `\"reserve\"` — Reserve height based on line count. Good for streaming text.\n   * - `false` — Same as `\"natural\"`, explicit opt-out.\n   * @default \"balance\" for headings, \"natural\" for body/mono/secondary.\n   */\n  wrap?: MeasuredTextMode | false;\n  /**\n   * For `wrap=\"reserve\"`: reserve this many lines of height.\n   * If omitted, measures current content to determine line count.\n   */\n  reserveLines?: number;\n};\n\ntype TextPropsInternal<Variant extends TextVariant = \"body\"> = BaseTextProps &\n  (Variant extends Copy\n    ? {\n        variant?: Variant;\n        bold?: boolean;\n        size?: TextSize;\n      }\n    : Variant extends Monospace\n      ? {\n          variant?: Variant;\n          bold?: never;\n          size?: \"lg\";\n        }\n      : Variant extends Heading\n        ? {\n            variant?: Variant;\n            bold?: never;\n            size?: never;\n          }\n        : never);\n\n/**\n * Text component props.\n *\n * @example\n * ```tsx\n * <Text variant=\"heading1\">Page Title</Text>\n * <Text variant=\"body\">Default paragraph text.</Text>\n * <Text variant=\"secondary\" size=\"sm\">Muted helper text</Text>\n * <Text variant=\"error\">Something went wrong</Text>\n * <Text variant=\"mono\">console.log(\"code\")</Text>\n * <Text wrap=\"shrink\">Hug content width</Text>\n * <Text wrap=\"reserve\" reserveLines={3}>Streaming content...</Text>\n * ```\n */\nexport interface TextProps {\n  /**\n   * Text style variant. Determines color, font, and weight.\n   * - `\"heading1\"` — Large page title (30px, semibold)\n   * - `\"heading2\"` — Section title (24px, semibold)\n   * - `\"heading3\"` — Subsection title (18px, semibold)\n   * - `\"body\"` — Default body text\n   * - `\"secondary\"` — Muted text for secondary information\n   * - `\"success\"` — Success state text\n   * - `\"error\"` — Error state text\n   * - `\"mono\"` — Monospace text for code\n   * - `\"mono-secondary\"` — Muted monospace text\n   * @default \"body\"\n   */\n  variant?: SFTextVariant;\n  /**\n   * Text size (only applies to body/secondary/success/error variants).\n   * - `\"xs\"` — 12px\n   * - `\"sm\"` — 14px\n   * - `\"base\"` — 16px\n   * - `\"lg\"` — 18px\n   * @default \"base\"\n   */\n  size?: SFTextSize;\n  /** Whether to use bold font weight (only applies to body variants). */\n  bold?: boolean;\n  /** The HTML element type to render as (e.g. `\"span\"`, `\"p\"`, `\"h1\"`). Auto-selected based on variant if omitted. */\n  as?: ElementType;\n  /** Text content. */\n  children?: React.ReactNode;\n  /**\n   * Text layout strategy using pretext-driven measurement.\n   * - `\"natural\"` — No measurement, normal browser wrapping (default for body).\n   * - `\"balance\"` — Even wrapping, smallest maxWidth without adding lines (default for headings).\n   * - `\"shrink\"` — Hug widest natural line (maxWidth = line width). Good for chat bubbles.\n   * - `\"reserve\"` — Reserve height based on line count. Good for streaming text.\n   * @default \"natural\" for all variants. Set `wrap=\"balance\"` explicitly to\n   * enable balanced wrapping (only reliable inside width-constrained containers).\n   */\n  wrap?: MeasuredTextMode | false;\n  /**\n   * For `wrap=\"reserve\"`: reserve this many lines of height.\n   * If omitted, measures current content to determine line count.\n   */\n  reserveLines?: number;\n}\n\nfunction getDefaultWrap(_variant: TextVariant): MeasuredTextMode | false {\n  return \"natural\";\n}\n\n/**\n * Typography component for rendering text with consistent styling.\n * Automatically selects the appropriate HTML element based on variant\n * (`h1`/`h2`/`h3` for headings, `p` for body, `span` for mono).\n *\n * Now includes pretext-driven layout for precise wrapping and spacing.\n *\n * @example\n * ```tsx\n * <Text variant=\"heading1\">Dashboard</Text>\n * <Text>Default body text</Text>\n * <Text wrap=\"shrink\">Compact bubble</Text>\n * ```\n */\nfunction _Text<Variant extends TextVariant = \"body\">(\n  {\n    variant = \"body\" as Variant,\n    bold = false,\n    size = \"base\",\n    children,\n    DANGEROUS_className,\n    DANGEROUS_style,\n    as,\n    wrap,\n    reserveLines,\n    ...props\n  }: TextPropsInternal<Variant>,\n  ref: ForwardedRef<HTMLHeadingElement>\n) {\n  const isCopy = [\"body\", \"secondary\", \"success\", \"error\"].includes(variant);\n  const isMono = [\"mono\", \"mono-secondary\"].includes(variant);\n\n  const Component = useMemo(() => {\n    if (as) return as;\n    if (variant === \"heading1\") return \"h1\";\n    if (variant === \"heading2\") return \"h2\";\n    if (variant === \"heading3\") return \"h3\";\n    if ([\"mono\", \"mono-secondary\"].includes(variant)) return \"span\";\n    return \"p\";\n  }, [variant, as]);\n\n  const effectiveWrap = wrap ?? getDefaultWrap(variant);\n  const className = cn(\n    \"text-sf-default\",\n    SF_TEXT_VARIANTS.variant[variant].classes,\n    isCopy ? SF_TEXT_VARIANTS.size[size].classes : \"\",\n    isCopy && bold ? \"font-medium\" : \"\",\n    // Monospace fonts need to be 1pt smaller than body text to optically match\n    isMono &&\n      (size === \"lg\"\n        ? SF_TEXT_VARIANTS.size.base.classes\n        : SF_TEXT_VARIANTS.size.sm.classes),\n    DANGEROUS_className\n  );\n\n  // Use MeasuredText for non-natural modes, or when reserveLines is set\n  if (effectiveWrap !== \"natural\" && effectiveWrap !== false) {\n    return (\n      <MeasuredText\n        ref={ref as React.RefObject<HTMLElement>}\n        as={Component}\n        wrap={effectiveWrap}\n        reserveLines={reserveLines}\n        className={className}\n        style={DANGEROUS_style}\n        {...props}\n      >\n        {children}\n      </MeasuredText>\n    );\n  }\n\n  // Natural mode: render directly without measurement overhead\n  return (\n    <Component\n      ref={ref}\n      className={className}\n      style={DANGEROUS_style}\n      {...props}\n    >\n      {children}\n    </Component>\n  );\n}\n\nexport const Text = forwardRef(_Text) as <Variant extends TextVariant = \"body\">(\n  props: TextPropsInternal<Variant> & {\n    ref?: ForwardedRef<ElementRef<\"span\">>;\n  }\n) => React.ReactElement & { displayName?: string };\n\n// Cast needed because of the complex forwardRef type signature\n(Text as { displayName?: string }).displayName = \"Text\";\n"],"mappings":";;;;;;;AAcA,IAAa,mBAAmB;CAC9B,SAAS;EACP,UAAU;GACR,SAAS;GACT,aAAa;EACf;EACA,UAAU;GACR,SAAS;GACT,aAAa;EACf;EACA,UAAU;GACR,SAAS;GACT,aAAa;EACf;EACA,MAAM;GACJ,SAAS;GACT,aAAa;EACf;EACA,WAAW;GACT,SAAS;GACT,aAAa;EACf;EACA,SAAS;GACP,SAAS;GACT,aAAa;EACf;EACA,OAAO;GACL,SAAS;GACT,aAAa;EACf;EACA,MAAM;GACJ,SAAS;GACT,aAAa;EACf;EACA,kBAAkB;GAChB,SAAS;GACT,aAAa;EACf;CACF;CACA,MAAM;EACJ,IAAI;GACF,SAAS;GACT,aAAa;EACf;EACA,IAAI;GACF,SAAS;GACT,aAAa;EACf;EACA,MAAM;GACJ,SAAS;GACT,aAAa;EACf;EACA,IAAI;GACF,SAAS;GACT,aAAa;EACf;CACF;AACF;AAmLA,SAAS,eAAe,UAAiD;CACvE,OAAO;AACT;;;;;;;;;;;;;;;AAgBA,SAAS,MACP,EACE,UAAU,QACV,OAAO,OACP,OAAO,QACP,UACA,qBACA,iBACA,IACA,MACA,cACA,GAAG,SAEL,KACA;CACA,MAAM,SAAS;EAAC;EAAQ;EAAa;EAAW;CAAO,EAAE,SAAS,OAAO;CACzE,MAAM,SAAS,CAAC,QAAQ,gBAAgB,EAAE,SAAS,OAAO;CAE1D,MAAM,YAAY,cAAc;EAC9B,IAAI,IAAI,OAAO;EACf,IAAI,YAAY,YAAY,OAAO;EACnC,IAAI,YAAY,YAAY,OAAO;EACnC,IAAI,YAAY,YAAY,OAAO;EACnC,IAAI,CAAC,QAAQ,gBAAgB,EAAE,SAAS,OAAO,GAAG,OAAO;EACzD,OAAO;CACT,GAAG,CAAC,SAAS,EAAE,CAAC;CAEhB,MAAM,gBAAgB,QAAQ,eAAe,OAAO;CACpD,MAAM,YAAY,GAChB,mBACA,iBAAiB,QAAQ,SAAS,SAClC,SAAS,iBAAiB,KAAK,MAAM,UAAU,IAC/C,UAAU,OAAO,gBAAgB,IAEjC,WACG,SAAS,OACN,iBAAiB,KAAK,KAAK,UAC3B,iBAAiB,KAAK,GAAG,UAC/B,mBACF;CAGA,IAAI,kBAAkB,aAAa,kBAAkB,OACnD,OACE,oBAAC,cAAD;EACO;EACL,IAAI;EACJ,MAAM;EACQ;EACH;EACX,OAAO;EACP,GAAI;EAEH;CACW,CAAA;CAKlB,OACE,oBAAC,WAAD;EACO;EACM;EACX,OAAO;EACP,GAAI;EAEH;CACQ,CAAA;AAEf;AAEA,IAAa,OAAO,WAAW,KAAK;AAOpC,KAAmC,cAAc"}

package/dist/{text-roll-Ch52hcQj.js → text-roll-C3U2jd2u.js}

@@ -12,6 +12,9 @@ var DEFAULT_VARIANTS = {
 		animate: { rotateX: 0 }
 	}
 };
+var DEFAULT_TRANSITION = { ease: "easeIn" };
+var defaultEnterDelay = (index) => index * .1;
+var defaultExitDelay = (index) => index * .1 + .2;
 /**
 * Letter-by-letter roll animation. Each character flips on the X axis: the
 * current letter rolls up and out, the new letter rolls in from below.
@@ -27,7 +30,7 @@ var DEFAULT_VARIANTS = {
 * <TextRoll key={title}>{title}</TextRoll>
 * ```
 */
-function TextRoll({ children, duration = .5, getEnterDelay = (i) => i * .1, getExitDelay = (i) => i * .1 + .2, className, transition = { ease: "easeIn" }, variants, onAnimationComplete }) {
+function TextRoll({ children, duration = .5, getEnterDelay = defaultEnterDelay, getExitDelay = defaultExitDelay, className, transition = DEFAULT_TRANSITION, variants, onAnimationComplete }) {
 	const letters = children.split("");
 	return /* @__PURE__ */ jsxs("span", {
 		className,
@@ -76,4 +79,4 @@ TextRoll.displayName = "TextRoll";
 //#endregion
 export { TextRoll as t };
 
-//# sourceMappingURL=text-roll-Ch52hcQj.js.map
+//# sourceMappingURL=text-roll-C3U2jd2u.js.map

package/dist/text-roll-C3U2jd2u.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"text-roll-C3U2jd2u.js","names":[],"sources":["../src/components/text-roll/text-roll.tsx"],"sourcesContent":["\"use client\";\n\nimport {\n  motion,\n  type Target,\n  type TargetAndTransition,\n  type Transition,\n  type VariantLabels,\n} from \"motion/react\";\n\nexport type TextRollVariants = {\n  enter: {\n    initial: Target | VariantLabels | boolean;\n    animate: TargetAndTransition | VariantLabels;\n  };\n  exit: {\n    initial: Target | VariantLabels | boolean;\n    animate: TargetAndTransition | VariantLabels;\n  };\n};\n\nexport type TextRollProps = {\n  /** Text to animate. Each character rolls in / out independently. */\n  children: string;\n  /** Duration (seconds) of each letter's enter and exit tween. */\n  duration?: number;\n  /** Per-letter delay for the enter animation. */\n  getEnterDelay?: (index: number) => number;\n  /** Per-letter delay for the exit animation. */\n  getExitDelay?: (index: number) => number;\n  /** Additional CSS classes merged via `cn()`. Use sf semantic tokens only. */\n  className?: string;\n  /** Shared transition for both enter and exit tweens. */\n  transition?: Transition;\n  /** Override the default rotate-X roll with custom enter/exit variants. */\n  variants?: TextRollVariants;\n  /** Fires once the last letter's exit animation finishes. */\n  onAnimationComplete?: () => void;\n};\n\nconst DEFAULT_VARIANTS: TextRollVariants = {\n  enter: {\n    initial: { rotateX: 0 },\n    animate: { rotateX: 90 },\n  },\n  exit: {\n    initial: { rotateX: 90 },\n    animate: { rotateX: 0 },\n  },\n};\n\nconst DEFAULT_TRANSITION: Transition = { ease: \"easeIn\" };\nconst defaultEnterDelay = (index: number) => index * 0.1;\nconst defaultExitDelay = (index: number) => index * 0.1 + 0.2;\n\n/**\n * Letter-by-letter roll animation. Each character flips on the X axis: the\n * current letter rolls up and out, the new letter rolls in from below.\n * Good for title changes (e.g. a streaming activity group swapping its\n * current-step label) where the text content is short and the change should\n * register visually.\n *\n * Wraps the string in an `aria-hidden` visual stack with a screen-reader-only\n * copy of the full text so a11y tools always read the real content.\n *\n * @example\n * ```tsx\n * <TextRoll key={title}>{title}</TextRoll>\n * ```\n */\nexport function TextRoll({\n  children,\n  duration = 0.5,\n  getEnterDelay = defaultEnterDelay,\n  getExitDelay = defaultExitDelay,\n  className,\n  transition = DEFAULT_TRANSITION,\n  variants,\n  onAnimationComplete,\n}: TextRollProps) {\n  const letters = children.split(\"\");\n\n  return (\n    <span className={className}>\n      {letters.map((letter, i) => {\n        const display = letter === \" \" ? \"\\u00A0\" : letter;\n        return (\n          <span\n            aria-hidden=\"true\"\n            className=\"relative inline-block [perspective:10000px] [transform-style:preserve-3d] [width:auto]\"\n            // Using index is intentional — letters are positional.\n            // biome-ignore lint/suspicious/noArrayIndexKey: positional char animation\n            key={i}\n          >\n            <motion.span\n              animate={\n                variants?.enter?.animate ?? DEFAULT_VARIANTS.enter.animate\n              }\n              className=\"absolute inline-block [backface-visibility:hidden] [transform-origin:50%_25%]\"\n              initial={\n                variants?.enter?.initial ?? DEFAULT_VARIANTS.enter.initial\n              }\n              transition={{\n                ...transition,\n                duration,\n                delay: getEnterDelay(i),\n              }}\n            >\n              {display}\n            </motion.span>\n            <motion.span\n              animate={variants?.exit?.animate ?? DEFAULT_VARIANTS.exit.animate}\n              className=\"absolute inline-block [backface-visibility:hidden] [transform-origin:50%_100%]\"\n              initial={variants?.exit?.initial ?? DEFAULT_VARIANTS.exit.initial}\n              onAnimationComplete={\n                letters.length === i + 1 ? onAnimationComplete : undefined\n              }\n              transition={{\n                ...transition,\n                duration,\n                delay: getExitDelay(i),\n              }}\n            >\n              {display}\n            </motion.span>\n            <span className=\"invisible\">{display}</span>\n          </span>\n        );\n      })}\n      <span className=\"sr-only\">{children}</span>\n    </span>\n  );\n}\n\nTextRoll.displayName = \"TextRoll\";\n"],"mappings":";;;;AAwCA,IAAM,mBAAqC;CACzC,OAAO;EACL,SAAS,EAAE,SAAS,EAAE;EACtB,SAAS,EAAE,SAAS,GAAG;CACzB;CACA,MAAM;EACJ,SAAS,EAAE,SAAS,GAAG;EACvB,SAAS,EAAE,SAAS,EAAE;CACxB;AACF;AAEA,IAAM,qBAAiC,EAAE,MAAM,SAAS;AACxD,IAAM,qBAAqB,UAAkB,QAAQ;AACrD,IAAM,oBAAoB,UAAkB,QAAQ,KAAM;;;;;;;;;;;;;;;;AAiB1D,SAAgB,SAAS,EACvB,UACA,WAAW,IACX,gBAAgB,mBAChB,eAAe,kBACf,WACA,aAAa,oBACb,UACA,uBACgB;CAChB,MAAM,UAAU,SAAS,MAAM,EAAE;CAEjC,OACE,qBAAC,QAAD;EAAiB;YAAjB,CACG,QAAQ,KAAK,QAAQ,MAAM;GAC1B,MAAM,UAAU,WAAW,MAAM,SAAW;GAC5C,OACE,qBAAC,QAAD;IACE,eAAY;IACZ,WAAU;cAFZ;KAOE,oBAAC,OAAO,MAAR;MACE,SACE,UAAU,OAAO,WAAW,iBAAiB,MAAM;MAErD,WAAU;MACV,SACE,UAAU,OAAO,WAAW,iBAAiB,MAAM;MAErD,YAAY;OACV,GAAG;OACH;OACA,OAAO,cAAc,CAAC;MACxB;gBAEC;KACU,CAAA;KACb,oBAAC,OAAO,MAAR;MACE,SAAS,UAAU,MAAM,WAAW,iBAAiB,KAAK;MAC1D,WAAU;MACV,SAAS,UAAU,MAAM,WAAW,iBAAiB,KAAK;MAC1D,qBACE,QAAQ,WAAW,IAAI,IAAI,sBAAsB,KAAA;MAEnD,YAAY;OACV,GAAG;OACH;OACA,OAAO,aAAa,CAAC;MACvB;gBAEC;KACU,CAAA;KACb,oBAAC,QAAD;MAAM,WAAU;gBAAa;KAAc,CAAA;IACvC;MAlCC,CAkCD;EAEV,CAAC,GACD,oBAAC,QAAD;GAAM,WAAU;GAAW;EAAe,CAAA,CACtC;;AAEV;AAEA,SAAS,cAAc"}

package/dist/{theme-toggle-LDfIKEqx.js → theme-toggle-BTVxD-fD.js}

@@ -1,7 +1,7 @@
 "use client";
-import { t as cn } from "./cn-YROP2_ox.js";
-import { t as Tooltip } from "./tooltip-g9lFsvcT.js";
-import { t as Button } from "./button-CO6-qPax.js";
+import { t as cn } from "./cn-CmAOpn49.js";
+import { t as Tooltip } from "./tooltip-uobk6Oh-.js";
+import { t as Button } from "./button-BHOgXJRU.js";
 import { useEffect, useState } from "react";
 import { jsx } from "react/jsx-runtime";
 import { MoonIcon, SunIcon } from "@phosphor-icons/react";
@@ -22,6 +22,11 @@ var SF_THEME_TOGGLE_VARIANTS = { mode: {
 } };
 var SF_THEME_TOGGLE_DEFAULT_VARIANTS = { mode: "system" };
 var STORAGE_KEY = "theme";
+var DEFAULT_CYCLE = [
+	"light",
+	"dark",
+	"system"
+];
 function getSystemTheme() {
 	if (typeof window === "undefined") return "light";
 	return window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
@@ -65,11 +70,7 @@ function getStoredThemeMode() {
 * <ThemeToggle cycle={["light", "dark"]} />
 * ```
 */
-function ThemeToggle({ className, mode: controlledMode, onModeChange, cycle = [
-	"light",
-	"dark",
-	"system"
-], tooltip = true }) {
+function ThemeToggle({ className, mode: controlledMode, onModeChange, cycle = DEFAULT_CYCLE, tooltip = true }) {
 	const isControlled = controlledMode !== void 0;
 	const [internalMode, setInternalMode] = useState("system");
 	const [mounted, setMounted] = useState(false);
@@ -126,4 +127,4 @@ function ThemeToggle({ className, mode: controlledMode, onModeChange, cycle = [
 //#endregion
 export { getStoredThemeMode as i, SF_THEME_TOGGLE_VARIANTS as n, ThemeToggle as r, SF_THEME_TOGGLE_DEFAULT_VARIANTS as t };
 
-//# sourceMappingURL=theme-toggle-LDfIKEqx.js.map
+//# sourceMappingURL=theme-toggle-BTVxD-fD.js.map

package/dist/theme-toggle-BTVxD-fD.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme-toggle-BTVxD-fD.js","names":[],"sources":["../src/components/theme-toggle/theme-toggle.tsx"],"sourcesContent":["\"use client\";\n\nimport { MoonIcon, SunIcon } from \"@phosphor-icons/react\";\nimport { useEffect, useState } from \"react\";\n\nimport { cn } from \"../../utils/cn\";\nimport { Button } from \"../button\";\nimport { Tooltip } from \"../tooltip\";\n\n// ─── Types ────────────────────────────────────────────────────────────────────\n\nexport type SFThemeMode = \"light\" | \"dark\" | \"system\";\n\nexport const SF_THEME_TOGGLE_VARIANTS = {\n  mode: {\n    light: { classes: \"\", description: \"Light mode\" },\n    dark: { classes: \"\", description: \"Dark mode\" },\n    system: { classes: \"\", description: \"Follow system preference\" },\n  },\n} as const;\n\nexport const SF_THEME_TOGGLE_DEFAULT_VARIANTS = {\n  mode: \"system\",\n} as const;\n\n// ─── Helpers ──────────────────────────────────────────────────────────────────\n\nconst STORAGE_KEY = \"theme\";\nconst DEFAULT_CYCLE: SFThemeMode[] = [\"light\", \"dark\", \"system\"];\n\nfunction getSystemTheme(): \"light\" | \"dark\" {\n  if (typeof window === \"undefined\") return \"light\";\n  return window.matchMedia(\"(prefers-color-scheme: dark)\").matches\n    ? \"dark\"\n    : \"light\";\n}\n\nfunction resolveMode(mode: SFThemeMode): \"light\" | \"dark\" {\n  return mode === \"system\" ? getSystemTheme() : mode;\n}\n\nfunction applyTheme(mode: SFThemeMode) {\n  const resolved = resolveMode(mode);\n  document.documentElement.dataset.mode = resolved;\n  if (mode === \"system\") {\n    localStorage.removeItem(STORAGE_KEY);\n  } else {\n    localStorage.setItem(STORAGE_KEY, mode);\n  }\n}\n\n/**\n * Read the current persisted mode preference from localStorage.\n * Returns \"system\" if nothing is stored.\n */\nexport function getStoredThemeMode(): SFThemeMode {\n  if (typeof window === \"undefined\") return \"system\";\n  const stored = localStorage.getItem(STORAGE_KEY);\n  if (stored === \"light\" || stored === \"dark\") return stored;\n  return \"system\";\n}\n\n// ─── Component ────────────────────────────────────────────────────────────────\n\nexport interface ThemeToggleProps {\n  /** Additional CSS classes merged via `cn()`. */\n  className?: string;\n  /**\n   * Controlled mode. When provided the component acts as a controlled input —\n   * pair with `onModeChange`.\n   */\n  mode?: SFThemeMode;\n  /**\n   * Called when the user cycles to a new mode.\n   * Receives the new mode value.\n   */\n  onModeChange?: (mode: SFThemeMode) => void;\n  /**\n   * Cycle order for clicking. Defaults to `[\"light\", \"dark\", \"system\"]`.\n   * Remove `\"system\"` to limit to a simple light/dark toggle.\n   */\n  cycle?: SFThemeMode[];\n  /** Show a tooltip labelling the current action. Defaults to true. */\n  tooltip?: boolean;\n}\n\n/**\n * Theme toggle button. Cycles through light → dark → system (follows OS) modes.\n *\n * Reads from and writes to `localStorage` under the key `\"theme\"`. When set to\n * `\"system\"` the key is removed so the OS preference takes over automatically.\n * Applies the resolved mode to `document.documentElement.dataset.mode`.\n *\n * @example\n * ```tsx\n * // Simple uncontrolled — manages localStorage automatically\n * <ThemeToggle />\n *\n * // Controlled\n * const [mode, setMode] = useState<SFThemeMode>(\"system\");\n * <ThemeToggle mode={mode} onModeChange={setMode} />\n *\n * // Light/dark only (no system option)\n * <ThemeToggle cycle={[\"light\", \"dark\"]} />\n * ```\n */\nexport function ThemeToggle({\n  className,\n  mode: controlledMode,\n  onModeChange,\n  cycle = DEFAULT_CYCLE,\n  tooltip = true,\n}: ThemeToggleProps) {\n  const isControlled = controlledMode !== undefined;\n\n  const [internalMode, setInternalMode] = useState<SFThemeMode>(\"system\");\n  const [mounted, setMounted] = useState(false);\n\n  // Hydrate from localStorage on mount\n  useEffect(() => {\n    setMounted(true);\n    if (!isControlled) {\n      setInternalMode(getStoredThemeMode());\n    }\n  }, [isControlled]);\n\n  // Keep in sync if system preference changes while in \"system\" mode\n  useEffect(() => {\n    if (typeof window === \"undefined\") return;\n    const mq = window.matchMedia(\"(prefers-color-scheme: dark)\");\n    const activeMode = isControlled ? controlledMode : internalMode;\n    if (activeMode !== \"system\") return;\n\n    const handler = () => applyTheme(\"system\");\n    mq.addEventListener(\"change\", handler);\n    return () => mq.removeEventListener(\"change\", handler);\n  }, [isControlled, controlledMode, internalMode]);\n\n  const activeMode = isControlled ? (controlledMode ?? \"system\") : internalMode;\n  const resolvedActive = resolveMode(activeMode);\n\n  const handleClick = () => {\n    const idx = cycle.indexOf(activeMode);\n    const next = cycle[(idx + 1) % cycle.length] ?? cycle[0] ?? \"system\";\n    applyTheme(next);\n    if (!isControlled) setInternalMode(next);\n    onModeChange?.(next);\n  };\n\n  const tooltipLabel =\n    activeMode === \"light\"\n      ? \"Switch to dark mode\"\n      : activeMode === \"dark\"\n        ? \"Use system theme\"\n        : \"Switch to light mode\";\n\n  // SSR / pre-mount: render a stable placeholder to avoid hydration mismatch\n  if (!mounted) {\n    return (\n      <Button\n        aria-label=\"Toggle theme\"\n        className={cn(\"text-sf-subtle\", className)}\n        shape=\"square\"\n        size=\"sm\"\n        type=\"button\"\n        variant=\"ghost\"\n      >\n        <SunIcon className=\"size-4\" />\n      </Button>\n    );\n  }\n\n  const button = (\n    <Button\n      aria-label={tooltipLabel}\n      className={cn(\"text-sf-subtle hover:text-sf-default\", className)}\n      onClick={handleClick}\n      shape=\"square\"\n      size=\"sm\"\n      type=\"button\"\n      variant=\"ghost\"\n    >\n      {resolvedActive === \"dark\" ? (\n        <MoonIcon className=\"size-4\" />\n      ) : (\n        <SunIcon className=\"size-4\" />\n      )}\n    </Button>\n  );\n\n  if (!tooltip) return button;\n\n  return <Tooltip content={tooltipLabel}>{button}</Tooltip>;\n}\n"],"mappings":";;;;;;;;AAaA,IAAa,2BAA2B,EACtC,MAAM;CACJ,OAAO;EAAE,SAAS;EAAI,aAAa;CAAa;CAChD,MAAM;EAAE,SAAS;EAAI,aAAa;CAAY;CAC9C,QAAQ;EAAE,SAAS;EAAI,aAAa;CAA2B;AACjE,EACF;AAEA,IAAa,mCAAmC,EAC9C,MAAM,SACR;AAIA,IAAM,cAAc;AACpB,IAAM,gBAA+B;CAAC;CAAS;CAAQ;AAAQ;AAE/D,SAAS,iBAAmC;CAC1C,IAAI,OAAO,WAAW,aAAa,OAAO;CAC1C,OAAO,OAAO,WAAW,8BAA8B,EAAE,UACrD,SACA;AACN;AAEA,SAAS,YAAY,MAAqC;CACxD,OAAO,SAAS,WAAW,eAAe,IAAI;AAChD;AAEA,SAAS,WAAW,MAAmB;CACrC,MAAM,WAAW,YAAY,IAAI;CACjC,SAAS,gBAAgB,QAAQ,OAAO;CACxC,IAAI,SAAS,UACX,aAAa,WAAW,WAAW;MAEnC,aAAa,QAAQ,aAAa,IAAI;AAE1C;;;;;AAMA,SAAgB,qBAAkC;CAChD,IAAI,OAAO,WAAW,aAAa,OAAO;CAC1C,MAAM,SAAS,aAAa,QAAQ,WAAW;CAC/C,IAAI,WAAW,WAAW,WAAW,QAAQ,OAAO;CACpD,OAAO;AACT;;;;;;;;;;;;;;;;;;;;;AA8CA,SAAgB,YAAY,EAC1B,WACA,MAAM,gBACN,cACA,QAAQ,eACR,UAAU,QACS;CACnB,MAAM,eAAe,mBAAmB,KAAA;CAExC,MAAM,CAAC,cAAc,mBAAmB,SAAsB,QAAQ;CACtE,MAAM,CAAC,SAAS,cAAc,SAAS,KAAK;CAG5C,gBAAgB;EACd,WAAW,IAAI;EACf,IAAI,CAAC,cACH,gBAAgB,mBAAmB,CAAC;CAExC,GAAG,CAAC,YAAY,CAAC;CAGjB,gBAAgB;EACd,IAAI,OAAO,WAAW,aAAa;EACnC,MAAM,KAAK,OAAO,WAAW,8BAA8B;EAE3D,KADmB,eAAe,iBAAiB,kBAChC,UAAU;EAE7B,MAAM,gBAAgB,WAAW,QAAQ;EACzC,GAAG,iBAAiB,UAAU,OAAO;EACrC,aAAa,GAAG,oBAAoB,UAAU,OAAO;CACvD,GAAG;EAAC;EAAc;EAAgB;CAAY,CAAC;CAE/C,MAAM,aAAa,eAAgB,kBAAkB,WAAY;CACjE,MAAM,iBAAiB,YAAY,UAAU;CAE7C,MAAM,oBAAoB;EAExB,MAAM,OAAO,OADD,MAAM,QAAQ,UACN,IAAM,KAAK,MAAM,WAAW,MAAM,MAAM;EAC5D,WAAW,IAAI;EACf,IAAI,CAAC,cAAc,gBAAgB,IAAI;EACvC,eAAe,IAAI;CACrB;CAEA,MAAM,eACJ,eAAe,UACX,wBACA,eAAe,SACb,qBACA;CAGR,IAAI,CAAC,SACH,OACE,oBAAC,QAAD;EACE,cAAW;EACX,WAAW,GAAG,kBAAkB,SAAS;EACzC,OAAM;EACN,MAAK;EACL,MAAK;EACL,SAAQ;YAER,oBAAC,SAAD,EAAS,WAAU,SAAU,CAAA;CACvB,CAAA;CAIZ,MAAM,SACJ,oBAAC,QAAD;EACE,cAAY;EACZ,WAAW,GAAG,wCAAwC,SAAS;EAC/D,SAAS;EACT,OAAM;EACN,MAAK;EACL,MAAK;EACL,SAAQ;YAEP,mBAAmB,SAClB,oBAAC,UAAD,EAAU,WAAU,SAAU,CAAA,IAE9B,oBAAC,SAAD,EAAS,WAAU,SAAU,CAAA;CAEzB,CAAA;CAGV,IAAI,CAAC,SAAS,OAAO;CAErB,OAAO,oBAAC,SAAD;EAAS,SAAS;YAAe;CAAgB,CAAA;AAC1D"}

package/dist/{toast-CaFQNYng.js → toast-CgZVaAkw.js}

@@ -1,6 +1,6 @@
 "use client";
-import { t as cn } from "./cn-YROP2_ox.js";
-import { t as Button } from "./button-CO6-qPax.js";
+import { t as cn } from "./cn-CmAOpn49.js";
+import { t as Button } from "./button-BHOgXJRU.js";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { Toast, Toast as Toast$1 } from "@base-ui/react/toast";
 import { WarningIcon, WarningOctagonIcon } from "@phosphor-icons/react/dist/ssr";
@@ -158,4 +158,4 @@ function XIcon(props) {
 //#endregion
 export { useSFToastManager as a, createSFToastManager as i, ToastProvider as n, Toasty as r, Toast$1 as t };
 
-//# sourceMappingURL=toast-CaFQNYng.js.map
+//# sourceMappingURL=toast-CgZVaAkw.js.map

package/dist/{toast-CaFQNYng.js.map → toast-CgZVaAkw.js.map}

@@ -1 +1 @@
-{"version":3,"file":"toast-CaFQNYng.js","names":[],"sources":["../src/components/toast/toast.tsx"],"sourcesContent":["import {\n  Toast,\n  ToastManagerAddOptions,\n  ToastObject,\n} from \"@base-ui/react/toast\";\nimport {\n  WarningIcon,\n  WarningOctagonIcon,\n} from \"@phosphor-icons/react/dist/ssr\";\nimport type React from \"react\";\n\nimport { Button, ButtonProps } from \"../../components/button\";\nimport { cn } from \"../../utils/cn\";\n\n/**\n * Toast styling configuration for Figma plugin consumption.\n * Toast has no user-facing variants but documents the styling structure.\n */\nexport const SF_TOAST_VARIANTS = {\n  root: {\n    classes:\n      \"rounded-lg border border-sf-fill bg-sf-control p-4 shadow-lg text-sf-default\",\n    description: \"Toast container with background, border, and shadow\",\n  },\n  title: {\n    classes: \"text-[0.975rem] leading-5 font-medium text-sf-default\",\n    description: \"Toast title with primary text color\",\n  },\n  description: {\n    classes: \"text-[0.925rem] leading-5 text-sf-subtle\",\n    description: \"Toast description with muted text color\",\n  },\n  close: {\n    classes:\n      \"absolute top-2 right-2 flex h-5 w-5 items-center justify-center rounded border-none bg-transparent text-sf-subtle hover:bg-sf-fill-hover hover:text-sf-strong\",\n    description: \"Close button with X icon\",\n  },\n  variant: {\n    default: {\n      classes: \"border-sf-fill bg-sf-control\",\n      description: \"Default toast style\",\n    },\n    error: {\n      classes:\n        \"border-sf-fill bg-sf-control [&_[data-toast-icon]]:text-[light-dark(var(--color-red-600),var(--color-red-400))] [&_[data-toast-title]]:text-[light-dark(var(--color-red-600),var(--color-red-400))]\",\n      description: \"Error toast for critical issues\",\n      icon: WarningOctagonIcon,\n    },\n    warning: {\n      classes:\n        \"border-sf-fill bg-sf-control [&_[data-toast-icon]]:text-[light-dark(var(--color-amber-700),var(--color-amber-500))] [&_[data-toast-title]]:text-[light-dark(var(--color-amber-700),var(--color-amber-500))]\",\n      description: \"Warning toast for cautionary messages\",\n      icon: WarningIcon,\n    },\n  },\n} as const;\n\nexport const SF_TOAST_DEFAULT_VARIANTS = {\n  variant: \"default\",\n} as const;\n\n/**\n * Toast styling configuration for Figma plugin consumption.\n * Provides structured metadata for generating Toast components in Figma.\n */\nexport const SF_TOAST_STYLING = {\n  container: {\n    width: 300,\n    padding: 16,\n    borderRadius: 8,\n    background: \"color-secondary\",\n    border: \"color-color\",\n    shadow: \"shadow-lg\",\n    gap: 4,\n  },\n  title: {\n    fontSize: 16,\n    fontWeight: 500,\n    color: \"text-color-surface\",\n  },\n  description: {\n    fontSize: 15,\n    fontWeight: 400,\n    color: \"text-color-muted\",\n  },\n  closeButton: {\n    size: 20,\n    iconSize: 16,\n    iconName: \"ph-x\",\n    iconColor: \"text-color-muted\",\n    hoverBackground: \"color-color-2\",\n    hoverColor: \"text-color-label\",\n    borderRadius: 4,\n  },\n} as const;\n\n// Derived types from SF_TOAST_VARIANTS\nexport type SFToastVariant = keyof typeof SF_TOAST_VARIANTS.variant;\n\nexport interface SFToastVariantsProps {\n  variant?: SFToastVariant;\n}\n\nexport function toastVariants({\n  variant = SF_TOAST_DEFAULT_VARIANTS.variant,\n}: SFToastVariantsProps = {}) {\n  return cn(\n    // Base styles for toast root\n    \"rounded-xl border bg-clip-padding p-4 shadow-lg\",\n    // Apply variant styles from SF_TOAST_VARIANTS\n    SF_TOAST_VARIANTS.variant[variant].classes\n  );\n}\n\n/**\n * Toasty component props.\n *\n * Wrap your app with `<Toasty>` to enable toast notifications.\n * Use `Toast.useToastManager().notify(…)` to create toasts.\n *\n * @example\n * ```tsx\n * // 1. Wrap your app\n * <Toasty>\n *   <App />\n * </Toasty>\n *\n * // 2. Show a toast from any child component\n * const toasts = Toast.useToastManager();\n * toasts.notify({ title: \"Saved\", description: \"Changes saved successfully.\" });\n * ```\n */\nexport interface ToastyProps extends SFToastVariantsProps {\n  /** Application content. Toasts render via a portal above this. */\n  children: React.ReactNode;\n}\n\ntype SFToastOptionsBase = {\n  variant?: SFToastVariant;\n  content?: React.ReactNode;\n  actions?: Array<ButtonProps>;\n};\n\nexport type SFToastOptions<Data extends object> = ToastObject<Data> &\n  SFToastOptionsBase;\n\nexport type SFToastManagerAddOptions<Data extends object> =\n  ToastManagerAddOptions<Data> & SFToastOptionsBase;\n\nfunction wrapManagerMethods<\n  T extends { add: Function; update: Function; promise: Function },\n>(manager: T) {\n  return {\n    ...manager,\n\n    add: (options: SFToastManagerAddOptions<any>) => {\n      return manager.add({\n        ...options,\n      });\n    },\n\n    update: (id: string, options: Partial<SFToastManagerAddOptions<any>>) => {\n      return manager.update(id, {\n        ...options,\n      });\n    },\n\n    promise: <T,>(\n      promise: Promise<T>,\n      options: {\n        loading: SFToastManagerAddOptions<any>;\n        success:\n          | SFToastManagerAddOptions<any>\n          | ((data: T) => SFToastManagerAddOptions<any>);\n        error:\n          | SFToastManagerAddOptions<any>\n          | ((error: Error) => SFToastManagerAddOptions<any>);\n      }\n    ) => {\n      return manager.promise(promise, {\n        loading: { ...options.loading },\n        success:\n          typeof options.success === \"function\"\n            ? (data: T) => ({\n                ...(\n                  options.success as (data: T) => SFToastManagerAddOptions<any>\n                )(data),\n              })\n            : { ...options.success },\n        error:\n          typeof options.error === \"function\"\n            ? (error: Error) => ({\n                ...(\n                  options.error as (\n                    error: Error\n                  ) => SFToastManagerAddOptions<any>\n                )(error),\n              })\n            : { ...options.error },\n      });\n    },\n  };\n}\n\nexport const useSFToastManager = () => {\n  const manager = Toast.useToastManager();\n  return {\n    ...wrapManagerMethods(manager),\n    toasts: manager.toasts as Array<SFToastOptions<any>>,\n  };\n};\n\nexport const createSFToastManager = () => {\n  return wrapManagerMethods(Toast.createToastManager());\n};\n\n/**\n * Toasty — toast notification provider and viewport.\n *\n * Renders a `Toast.Provider` with a fixed-position viewport in the bottom-right corner.\n * Toasts stack with smooth enter/exit animations, swipe-to-dismiss, and expand-on-hover.\n *\n * Built on `@base-ui/react/toast`.\n *\n * @example\n * ```tsx\n * <Toasty>\n *   <App />\n * </Toasty>\n * ```\n */\nexport function Toasty({ children }: ToastyProps) {\n  return (\n    <Toast.Provider>\n      {children}\n      <Toast.Portal>\n        <Toast.Viewport className=\"fixed top-auto right-4 bottom-4 z-10 mx-auto flex w-[calc(100%-2rem)] sm:right-8 sm:bottom-8 sm:w-[340px]\">\n          <ToastList />\n        </Toast.Viewport>\n      </Toast.Portal>\n    </Toast.Provider>\n  );\n}\n\n/** Alias for Toasty — provided for discoverability when migrating from other libraries */\nexport const ToastProvider = Toasty;\n\nfunction ToastList() {\n  const { toasts } = useSFToastManager();\n  return toasts.map((toast) => (\n    <Toast.Root\n      key={toast.id}\n      toast={toast}\n      className={cn(\n        \"absolute right-0 bottom-0 left-auto z-[calc(1000-var(--toast-index))] mr-0 h-[var(--height)] w-full origin-bottom select-none\",\n        toastVariants({ variant: toast.variant }),\n        \"[--gap:0.75rem] [--height:var(--toast-frontmost-height,var(--toast-height))] [--offset-y:calc(var(--toast-offset-y)*-1+calc(var(--toast-index)*var(--gap)*-1)+var(--toast-swipe-movement-y))] [--peek:0.75rem] [--scale:calc(max(0,1-(var(--toast-index)*0.1)))] [--shrink:calc(1-var(--scale))]\",\n        \"[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--toast-swipe-movement-y)-(var(--toast-index)*var(--peek))-(var(--shrink)*var(--height))))_scale(var(--scale))] [transition:transform_0.5s_cubic-bezier(0.22,1,0.36,1),opacity_0.5s,height_0.15s]\",\n        \"after:absolute after:top-full after:left-0 after:h-[calc(var(--gap)+1px)] after:w-full after:content-['']\",\n        \"data-[ending-style]:opacity-0 data-[expanded]:h-[var(--toast-height)] data-[expanded]:[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--offset-y)))] data-[limited]:opacity-0 data-[starting-style]:[transform:translateY(150%)]\",\n        \"data-[ending-style]:data-[swipe-direction=down]:[transform:translateY(calc(var(--toast-swipe-movement-y)+150%))] data-[expanded]:data-[ending-style]:data-[swipe-direction=down]:[transform:translateY(calc(var(--toast-swipe-movement-y)+150%))]\",\n        \"data-[ending-style]:data-[swipe-direction=left]:[transform:translateX(calc(var(--toast-swipe-movement-x)-150%))_translateY(var(--offset-y))] data-[expanded]:data-[ending-style]:data-[swipe-direction=left]:[transform:translateX(calc(var(--toast-swipe-movement-x)-150%))_translateY(var(--offset-y))]\",\n        \"data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))] data-[expanded]:data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))]\",\n        \"data-[ending-style]:data-[swipe-direction=up]:[transform:translateY(calc(var(--toast-swipe-movement-y)-150%))] data-[expanded]:data-[ending-style]:data-[swipe-direction=up]:[transform:translateY(calc(var(--toast-swipe-movement-y)-150%))]\",\n        \"[&[data-ending-style]:not([data-limited]):not([data-swipe-direction])]:[transform:translateY(150%)]\"\n      )}\n    >\n      <div className=\"absolute inset-0 rounded-[11px] bg-sf-control/90\"></div>\n      <Toast.Content className=\"isolate flex flex-col gap-1 transition-opacity [transition-duration:250ms] data-[behind]:pointer-events-none data-[behind]:opacity-0 data-[expanded]:pointer-events-auto data-[expanded]:opacity-100\">\n        {toast.content ?? (\n          <>\n            <div className=\"flex items-start gap-2\">\n              <ToastIcon variant={toast.variant} />\n              <div className=\"flex flex-col gap-1 overflow-hidden\">\n                <Toast.Title\n                  data-toast-title\n                  className=\"text-[0.975rem] leading-5 font-medium text-sf-default\"\n                />\n                <Toast.Description className=\"text-[0.925rem] leading-5 text-sf-subtle\" />\n\n                {!!toast.actions && (\n                  <div className=\"mt-2 flex min-w-0 flex-nowrap gap-2 overflow-x-auto p-px\">\n                    {toast.actions.map((actionProps, idx) => (\n                      <Button key={idx} {...actionProps} />\n                    ))}\n                  </div>\n                )}\n              </div>\n            </div>\n          </>\n        )}\n        <Toast.Close\n          className=\"absolute top-2 right-2 flex h-4 w-4 items-center justify-center rounded border-none bg-transparent text-current/50 hover:bg-sf-contrast/10 hover:text-current\"\n          aria-label=\"Close\"\n        >\n          <XIcon className=\"h-3 w-3\" />\n        </Toast.Close>\n      </Toast.Content>\n    </Toast.Root>\n  ));\n}\n\nfunction ToastIcon({ variant }: { variant?: SFToastVariant }) {\n  if (!variant || variant === \"default\") return null;\n  const variantConfig = SF_TOAST_VARIANTS.variant[variant];\n  if (!(\"icon\" in variantConfig)) return null;\n  const Icon = variantConfig.icon;\n  return (\n    <Icon data-toast-icon className=\"mt-0.5 h-4 w-4 shrink-0\" weight=\"fill\" />\n  );\n}\n\nfunction XIcon(props: React.ComponentProps<\"svg\">) {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"24\"\n      height=\"24\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      {...props}\n    >\n      <path d=\"M18 6 6 18\" />\n      <path d=\"m6 6 12 12\" />\n    </svg>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"toast-CgZVaAkw.js","names":[],"sources":["../src/components/toast/toast.tsx"],"sourcesContent":["import {\n  Toast,\n  ToastManagerAddOptions,\n  ToastObject,\n} from \"@base-ui/react/toast\";\nimport {\n  WarningIcon,\n  WarningOctagonIcon,\n} from \"@phosphor-icons/react/dist/ssr\";\nimport type React from \"react\";\n\nimport { Button, ButtonProps } from \"../../components/button\";\nimport { cn } from \"../../utils/cn\";\n\n/**\n * Toast styling configuration for Figma plugin consumption.\n * Toast has no user-facing variants but documents the styling structure.\n */\nexport const SF_TOAST_VARIANTS = {\n  root: {\n    classes:\n      \"rounded-lg border border-sf-fill bg-sf-control p-4 shadow-lg text-sf-default\",\n    description: \"Toast container with background, border, and shadow\",\n  },\n  title: {\n    classes: \"text-[0.975rem] leading-5 font-medium text-sf-default\",\n    description: \"Toast title with primary text color\",\n  },\n  description: {\n    classes: \"text-[0.925rem] leading-5 text-sf-subtle\",\n    description: \"Toast description with muted text color\",\n  },\n  close: {\n    classes:\n      \"absolute top-2 right-2 flex h-5 w-5 items-center justify-center rounded border-none bg-transparent text-sf-subtle hover:bg-sf-fill-hover hover:text-sf-strong\",\n    description: \"Close button with X icon\",\n  },\n  variant: {\n    default: {\n      classes: \"border-sf-fill bg-sf-control\",\n      description: \"Default toast style\",\n    },\n    error: {\n      classes:\n        \"border-sf-fill bg-sf-control [&_[data-toast-icon]]:text-[light-dark(var(--color-red-600),var(--color-red-400))] [&_[data-toast-title]]:text-[light-dark(var(--color-red-600),var(--color-red-400))]\",\n      description: \"Error toast for critical issues\",\n      icon: WarningOctagonIcon,\n    },\n    warning: {\n      classes:\n        \"border-sf-fill bg-sf-control [&_[data-toast-icon]]:text-[light-dark(var(--color-amber-700),var(--color-amber-500))] [&_[data-toast-title]]:text-[light-dark(var(--color-amber-700),var(--color-amber-500))]\",\n      description: \"Warning toast for cautionary messages\",\n      icon: WarningIcon,\n    },\n  },\n} as const;\n\nexport const SF_TOAST_DEFAULT_VARIANTS = {\n  variant: \"default\",\n} as const;\n\n/**\n * Toast styling configuration for Figma plugin consumption.\n * Provides structured metadata for generating Toast components in Figma.\n */\nexport const SF_TOAST_STYLING = {\n  container: {\n    width: 300,\n    padding: 16,\n    borderRadius: 8,\n    background: \"color-secondary\",\n    border: \"color-color\",\n    shadow: \"shadow-lg\",\n    gap: 4,\n  },\n  title: {\n    fontSize: 16,\n    fontWeight: 500,\n    color: \"text-color-surface\",\n  },\n  description: {\n    fontSize: 15,\n    fontWeight: 400,\n    color: \"text-color-muted\",\n  },\n  closeButton: {\n    size: 20,\n    iconSize: 16,\n    iconName: \"ph-x\",\n    iconColor: \"text-color-muted\",\n    hoverBackground: \"color-color-2\",\n    hoverColor: \"text-color-label\",\n    borderRadius: 4,\n  },\n} as const;\n\n// Derived types from SF_TOAST_VARIANTS\nexport type SFToastVariant = keyof typeof SF_TOAST_VARIANTS.variant;\n\nexport interface SFToastVariantsProps {\n  variant?: SFToastVariant;\n}\n\nexport function toastVariants({\n  variant = SF_TOAST_DEFAULT_VARIANTS.variant,\n}: SFToastVariantsProps = {}) {\n  return cn(\n    // Base styles for toast root\n    \"rounded-xl border bg-clip-padding p-4 shadow-lg\",\n    // Apply variant styles from SF_TOAST_VARIANTS\n    SF_TOAST_VARIANTS.variant[variant].classes\n  );\n}\n\n/**\n * Toasty component props.\n *\n * Wrap your app with `<Toasty>` to enable toast notifications.\n * Use `Toast.useToastManager().notify(…)` to create toasts.\n *\n * @example\n * ```tsx\n * // 1. Wrap your app\n * <Toasty>\n *   <App />\n * </Toasty>\n *\n * // 2. Show a toast from any child component\n * const toasts = Toast.useToastManager();\n * toasts.notify({ title: \"Saved\", description: \"Changes saved successfully.\" });\n * ```\n */\nexport interface ToastyProps extends SFToastVariantsProps {\n  /** Application content. Toasts render via a portal above this. */\n  children: React.ReactNode;\n}\n\ntype SFToastOptionsBase = {\n  variant?: SFToastVariant;\n  content?: React.ReactNode;\n  actions?: Array<ButtonProps>;\n};\n\nexport type SFToastOptions<Data extends object> = ToastObject<Data> &\n  SFToastOptionsBase;\n\nexport type SFToastManagerAddOptions<Data extends object> =\n  ToastManagerAddOptions<Data> & SFToastOptionsBase;\n\nfunction wrapManagerMethods<\n  T extends { add: Function; update: Function; promise: Function },\n>(manager: T) {\n  return {\n    ...manager,\n\n    add: (options: SFToastManagerAddOptions<any>) => {\n      return manager.add({\n        ...options,\n      });\n    },\n\n    update: (id: string, options: Partial<SFToastManagerAddOptions<any>>) => {\n      return manager.update(id, {\n        ...options,\n      });\n    },\n\n    promise: <T,>(\n      promise: Promise<T>,\n      options: {\n        loading: SFToastManagerAddOptions<any>;\n        success:\n          | SFToastManagerAddOptions<any>\n          | ((data: T) => SFToastManagerAddOptions<any>);\n        error:\n          | SFToastManagerAddOptions<any>\n          | ((error: Error) => SFToastManagerAddOptions<any>);\n      }\n    ) => {\n      return manager.promise(promise, {\n        loading: { ...options.loading },\n        success:\n          typeof options.success === \"function\"\n            ? (data: T) => ({\n                ...(\n                  options.success as (data: T) => SFToastManagerAddOptions<any>\n                )(data),\n              })\n            : { ...options.success },\n        error:\n          typeof options.error === \"function\"\n            ? (error: Error) => ({\n                ...(\n                  options.error as (\n                    error: Error\n                  ) => SFToastManagerAddOptions<any>\n                )(error),\n              })\n            : { ...options.error },\n      });\n    },\n  };\n}\n\nexport const useSFToastManager = () => {\n  const manager = Toast.useToastManager();\n  return {\n    ...wrapManagerMethods(manager),\n    toasts: manager.toasts as Array<SFToastOptions<any>>,\n  };\n};\n\nexport const createSFToastManager = () => {\n  return wrapManagerMethods(Toast.createToastManager());\n};\n\n/**\n * Toasty — toast notification provider and viewport.\n *\n * Renders a `Toast.Provider` with a fixed-position viewport in the bottom-right corner.\n * Toasts stack with smooth enter/exit animations, swipe-to-dismiss, and expand-on-hover.\n *\n * Built on `@base-ui/react/toast`.\n *\n * @example\n * ```tsx\n * <Toasty>\n *   <App />\n * </Toasty>\n * ```\n */\nexport function Toasty({ children }: ToastyProps) {\n  return (\n    <Toast.Provider>\n      {children}\n      <Toast.Portal>\n        <Toast.Viewport className=\"fixed top-auto right-4 bottom-4 z-10 mx-auto flex w-[calc(100%-2rem)] sm:right-8 sm:bottom-8 sm:w-[340px]\">\n          <ToastList />\n        </Toast.Viewport>\n      </Toast.Portal>\n    </Toast.Provider>\n  );\n}\n\n/** Alias for Toasty — provided for discoverability when migrating from other libraries */\nexport const ToastProvider = Toasty;\n\nfunction ToastList() {\n  const { toasts } = useSFToastManager();\n  return toasts.map((toast) => (\n    <Toast.Root\n      key={toast.id}\n      toast={toast}\n      className={cn(\n        \"absolute right-0 bottom-0 left-auto z-[calc(1000-var(--toast-index))] mr-0 h-[var(--height)] w-full origin-bottom select-none\",\n        toastVariants({ variant: toast.variant }),\n        \"[--gap:0.75rem] [--height:var(--toast-frontmost-height,var(--toast-height))] [--offset-y:calc(var(--toast-offset-y)*-1+calc(var(--toast-index)*var(--gap)*-1)+var(--toast-swipe-movement-y))] [--peek:0.75rem] [--scale:calc(max(0,1-(var(--toast-index)*0.1)))] [--shrink:calc(1-var(--scale))]\",\n        \"[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--toast-swipe-movement-y)-(var(--toast-index)*var(--peek))-(var(--shrink)*var(--height))))_scale(var(--scale))] [transition:transform_0.5s_cubic-bezier(0.22,1,0.36,1),opacity_0.5s,height_0.15s]\",\n        \"after:absolute after:top-full after:left-0 after:h-[calc(var(--gap)+1px)] after:w-full after:content-['']\",\n        \"data-[ending-style]:opacity-0 data-[expanded]:h-[var(--toast-height)] data-[expanded]:[transform:translateX(var(--toast-swipe-movement-x))_translateY(calc(var(--offset-y)))] data-[limited]:opacity-0 data-[starting-style]:[transform:translateY(150%)]\",\n        \"data-[ending-style]:data-[swipe-direction=down]:[transform:translateY(calc(var(--toast-swipe-movement-y)+150%))] data-[expanded]:data-[ending-style]:data-[swipe-direction=down]:[transform:translateY(calc(var(--toast-swipe-movement-y)+150%))]\",\n        \"data-[ending-style]:data-[swipe-direction=left]:[transform:translateX(calc(var(--toast-swipe-movement-x)-150%))_translateY(var(--offset-y))] data-[expanded]:data-[ending-style]:data-[swipe-direction=left]:[transform:translateX(calc(var(--toast-swipe-movement-x)-150%))_translateY(var(--offset-y))]\",\n        \"data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))] data-[expanded]:data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--toast-swipe-movement-x)+150%))_translateY(var(--offset-y))]\",\n        \"data-[ending-style]:data-[swipe-direction=up]:[transform:translateY(calc(var(--toast-swipe-movement-y)-150%))] data-[expanded]:data-[ending-style]:data-[swipe-direction=up]:[transform:translateY(calc(var(--toast-swipe-movement-y)-150%))]\",\n        \"[&[data-ending-style]:not([data-limited]):not([data-swipe-direction])]:[transform:translateY(150%)]\"\n      )}\n    >\n      <div className=\"absolute inset-0 rounded-[11px] bg-sf-control/90\"></div>\n      <Toast.Content className=\"isolate flex flex-col gap-1 transition-opacity [transition-duration:250ms] data-[behind]:pointer-events-none data-[behind]:opacity-0 data-[expanded]:pointer-events-auto data-[expanded]:opacity-100\">\n        {toast.content ?? (\n          <>\n            <div className=\"flex items-start gap-2\">\n              <ToastIcon variant={toast.variant} />\n              <div className=\"flex flex-col gap-1 overflow-hidden\">\n                <Toast.Title\n                  data-toast-title\n                  className=\"text-[0.975rem] leading-5 font-medium text-sf-default\"\n                />\n                <Toast.Description className=\"text-[0.925rem] leading-5 text-sf-subtle\" />\n\n                {!!toast.actions && (\n                  <div className=\"mt-2 flex min-w-0 flex-nowrap gap-2 overflow-x-auto p-px\">\n                    {toast.actions.map((actionProps, idx) => (\n                      <Button key={idx} {...actionProps} />\n                    ))}\n                  </div>\n                )}\n              </div>\n            </div>\n          </>\n        )}\n        <Toast.Close\n          className=\"absolute top-2 right-2 flex h-4 w-4 items-center justify-center rounded border-none bg-transparent text-current/50 hover:bg-sf-contrast/10 hover:text-current\"\n          aria-label=\"Close\"\n        >\n          <XIcon className=\"h-3 w-3\" />\n        </Toast.Close>\n      </Toast.Content>\n    </Toast.Root>\n  ));\n}\n\nfunction ToastIcon({ variant }: { variant?: SFToastVariant }) {\n  if (!variant || variant === \"default\") return null;\n  const variantConfig = SF_TOAST_VARIANTS.variant[variant];\n  if (!(\"icon\" in variantConfig)) return null;\n  const Icon = variantConfig.icon;\n  return (\n    <Icon data-toast-icon className=\"mt-0.5 h-4 w-4 shrink-0\" weight=\"fill\" />\n  );\n}\n\nfunction XIcon(props: React.ComponentProps<\"svg\">) {\n  return (\n    <svg\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"24\"\n      height=\"24\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      {...props}\n    >\n      <path d=\"M18 6 6 18\" />\n      <path d=\"m6 6 12 12\" />\n    </svg>\n  );\n}\n"],"mappings":"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"}

package/dist/{tooltip-g9lFsvcT.js → tooltip-uobk6Oh-.js}

@@ -1,6 +1,6 @@
 "use client";
-import { t as cn } from "./cn-YROP2_ox.js";
-import { t as Text } from "./text-Cqryz7rk.js";
+import { t as cn } from "./cn-CmAOpn49.js";
+import { t as Text } from "./text-iQ0YUFNg.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Tooltip } from "@base-ui/react/tooltip";
 //#region src/components/tooltip/tooltip.tsx
@@ -82,4 +82,4 @@ function ArrowSvg(props) {
 //#endregion
 export { TooltipProvider as n, Tooltip$1 as t };
 
-//# sourceMappingURL=tooltip-g9lFsvcT.js.map
+//# sourceMappingURL=tooltip-uobk6Oh-.js.map

package/dist/{tooltip-g9lFsvcT.js.map → tooltip-uobk6Oh-.js.map}

@@ -1 +1 @@
-{"version":3,"file":"tooltip-g9lFsvcT.js","names":[],"sources":["../src/components/tooltip/tooltip.tsx"],"sourcesContent":["import { Tooltip as TooltipBase } from \"@base-ui/react/tooltip\";\nimport type { ComponentPropsWithoutRef, ReactNode } from \"react\";\n\nimport { cn } from \"../../utils/cn\";\nimport { Text } from \"../text\";\n\n/** Tooltip side variant definitions mapping positions to their Tailwind classes. */\nexport const SF_TOOLTIP_VARIANTS = {\n  side: {\n    top: {\n      classes: \"\",\n      description: \"Tooltip appears above the trigger\",\n    },\n    bottom: {\n      classes: \"\",\n      description: \"Tooltip appears below the trigger\",\n    },\n    left: {\n      classes: \"\",\n      description: \"Tooltip appears to the left of the trigger\",\n    },\n    right: {\n      classes: \"\",\n      description: \"Tooltip appears to the right of the trigger\",\n    },\n  },\n} as const;\n\nexport const SF_TOOLTIP_DEFAULT_VARIANTS = {\n  side: \"top\",\n} as const;\n\n// Derived types from SF_TOOLTIP_VARIANTS\nexport type SFTooltipSide = keyof typeof SF_TOOLTIP_VARIANTS.side;\n\nexport interface SFTooltipVariantsProps {\n  /**\n   * Preferred side of the trigger to render the tooltip.\n   * - `\"top\"` — Tooltip appears above the trigger\n   * - `\"bottom\"` — Tooltip appears below the trigger\n   * - `\"left\"` — Tooltip appears to the left of the trigger\n   * - `\"right\"` — Tooltip appears to the right of the trigger\n   * @default \"top\"\n   */\n  side?: SFTooltipSide;\n}\n\nexport function tooltipVariants({\n  side = SF_TOOLTIP_DEFAULT_VARIANTS.side,\n}: SFTooltipVariantsProps = {}) {\n  return cn(\n    // Base styles\n    \"flex origin-[var(--transform-origin)] flex-col rounded-md bg-sf-elevated px-2.5 py-1.5 text-sm text-sf-default\",\n    \"shadow-lg shadow-sf-tip-shadow outline outline-1 outline-sf-fill\",\n    \"transition-[transform,opacity] duration-150\",\n    \"data-[starting-style]:scale-90 data-[starting-style]:opacity-0\",\n    \"data-[ending-style]:scale-90 data-[ending-style]:opacity-0\",\n    \"data-[instant]:duration-0\",\n    // Apply side-specific styles (currently none, but extensible)\n    SF_TOOLTIP_VARIANTS.side[side].classes\n  );\n}\n\nexport const TooltipProvider = TooltipBase.Provider;\n\ntype BaseTooltipProps = ComponentPropsWithoutRef<typeof TooltipBase.Root>;\n\ntype TriggerProps = ComponentPropsWithoutRef<typeof TooltipBase.Trigger>;\n\n/** Alignment options for tooltip positioning. Source: PositionerProps[\"align\"] */\ntype TooltipAlign = \"start\" | \"center\" | \"end\";\n\n/**\n * Tooltip component props.\n *\n * @example\n * ```tsx\n * <TooltipProvider>\n *   <Tooltip content=\"Add new item\">\n *     <Button shape=\"square\" icon={PlusIcon} />\n *   </Tooltip>\n * </TooltipProvider>\n * ```\n */\nexport type TooltipProps = BaseTooltipProps &\n  SFTooltipVariantsProps & {\n    /**\n     * Alignment on the axis perpendicular to `side`.\n     * - `\"start\"` — Align to the start edge\n     * - `\"center\"` — Center-aligned\n     * - `\"end\"` — Align to the end edge\n     */\n    align?: TooltipAlign;\n    /** Additional CSS classes merged via `cn()`. */\n    className?: string;\n    /** Content to display inside the tooltip popup. */\n    content: ReactNode;\n  };\n\n/**\n * Accessible popup that shows additional information on hover/focus.\n * Wrap your app or section with `<TooltipProvider>` to enable delay grouping.\n *\n * @example\n * ```tsx\n * <Tooltip content=\"Save changes\">\n *   <Button variant=\"primary\">Save</Button>\n * </Tooltip>\n * ```\n */\nexport function Tooltip({\n  content,\n  children,\n  align,\n  side,\n  className,\n  ...props\n}: TooltipProps) {\n  return (\n    <TooltipBase.Root {...props}>\n      <TooltipBase.Trigger\n        className={className}\n        render={children as TriggerProps[\"render\"]}\n      />\n      <TooltipBase.Portal>\n        <TooltipBase.Positioner align={align} side={side} sideOffset={10}>\n          <TooltipBase.Popup\n            className={cn(\n              \"flex origin-[var(--transform-origin)] flex-col rounded-md bg-sf-elevated px-2.5 py-1.5 text-sm text-sf-default\",\n              \"shadow-lg shadow-sf-tip-shadow outline outline-sf-fill\",\n              \"transition-[transform,opacity] duration-150\",\n              \"data-[starting-style]:scale-90 data-[starting-style]:opacity-0\",\n              \"data-[ending-style]:scale-90 data-[ending-style]:opacity-0\",\n              \"data-[instant]:duration-0\",\n              \"sf-tooltip-popup\"\n            )}\n          >\n            <TooltipBase.Arrow\n              className={cn(\n                \"flex\",\n                \"data-[side=bottom]:top-[-8px]\",\n                \"data-[side=left]:right-[-13px] data-[side=left]:rotate-90\",\n                \"data-[side=right]:left-[-13px] data-[side=right]:-rotate-90\",\n                \"data-[side=top]:bottom-[-8px] data-[side=top]:rotate-180\"\n              )}\n            >\n              <ArrowSvg />\n            </TooltipBase.Arrow>\n            {typeof content === \"string\" ? (\n              <Text size=\"sm\" wrap=\"shrink\" as=\"span\">\n                {content}\n              </Text>\n            ) : (\n              content\n            )}\n          </TooltipBase.Popup>\n        </TooltipBase.Positioner>\n      </TooltipBase.Portal>\n    </TooltipBase.Root>\n  );\n}\n\n/**\n * Arrow SVG with three paths for proper border rendering in both light and dark modes.\n * This approach matches Base UI's tooltip implementation.\n *\n * The three paths are:\n * 1. ArrowFill - The main arrow body, matches tooltip background\n * 2. ArrowOuterStroke - Border visible in light mode only (transparent in dark)\n * 3. ArrowInnerStroke - Border visible in dark mode only (transparent in light)\n *\n * This is necessary because the outer and inner stroke paths have different geometries,\n * and using both ensures the arrow border aligns perfectly with the tooltip's outline\n * in both color modes.\n *\n * @see https://base-ui.com/react/components/tooltip\n */\nfunction ArrowSvg(props: React.ComponentProps<\"svg\">) {\n  return (\n    <svg width=\"20\" height=\"10\" viewBox=\"0 0 20 10\" fill=\"none\" {...props}>\n      <path\n        d=\"M9.66437 2.60207L4.80758 6.97318C4.07308 7.63423 3.11989 8 2.13172 8H0V10H20V8H18.5349C17.5468 8 16.5936 7.63423 15.8591 6.97318L11.0023 2.60207C10.622 2.2598 10.0447 2.25979 9.66437 2.60207Z\"\n        className=\"fill-sf-elevated\"\n      />\n      <path\n        d=\"M8.99542 1.85876C9.75604 1.17425 10.9106 1.17422 11.6713 1.85878L16.5281 6.22989C17.0789 6.72568 17.7938 7.00001 18.5349 7.00001L15.89 7L11.0023 2.60207C10.622 2.2598 10.0447 2.2598 9.66436 2.60207L4.77734 7L2.13171 7.00001C2.87284 7.00001 3.58774 6.72568 4.13861 6.22989L8.99542 1.85876Z\"\n        className=\"fill-sf-tip-shadow\"\n      />\n      <path\n        d=\"M10.3333 3.34539L5.47654 7.71648C4.55842 8.54279 3.36693 9 2.13172 9H0V8H2.13172C3.11989 8 4.07308 7.63423 4.80758 6.97318L9.66437 2.60207C10.0447 2.25979 10.622 2.2598 11.0023 2.60207L15.8591 6.97318C16.5936 7.63423 17.5468 8 18.5349 8H20V9H18.5349C17.2998 9 16.1083 8.54278 15.1901 7.71648L10.3333 3.34539Z\"\n        className=\"fill-sf-tip-stroke\"\n      />\n    </svg>\n  );\n}\n"],"mappings":";;;;;;AA+DA,IAAa,kBAAkB,QAAY;;;;;;;;;;;;AA+C3C,SAAgB,UAAQ,EACtB,SACA,UACA,OACA,MACA,WACA,GAAG,SACY;AACf,QACE,qBAAC,QAAY,MAAb;EAAkB,GAAI;YAAtB,CACE,oBAAC,QAAY,SAAb;GACa;GACX,QAAQ;GACR,CAAA,EACF,oBAAC,QAAY,QAAb,EAAA,UACE,oBAAC,QAAY,YAAb;GAA+B;GAAa;GAAM,YAAY;aAC5D,qBAAC,QAAY,OAAb;IACE,WAAW,GACT,kHACA,0DACA,+CACA,kEACA,8DACA,6BACA,mBACD;cATH,CAWE,oBAAC,QAAY,OAAb;KACE,WAAW,GACT,QACA,iCACA,6DACA,+DACA,2DACD;eAED,oBAAC,UAAD,EAAY,CAAA;KACM,CAAA,EACnB,OAAO,YAAY,WAClB,oBAAC,MAAD;KAAM,MAAK;KAAK,MAAK;KAAS,IAAG;eAC9B;KACI,CAAA,GAEP,QAEgB;;GACG,CAAA,EACN,CAAA,CACJ;;;;;;;;;;;;;;;;;;AAmBvB,SAAS,SAAS,OAAoC;AACpD,QACE,qBAAC,OAAD;EAAK,OAAM;EAAK,QAAO;EAAK,SAAQ;EAAY,MAAK;EAAO,GAAI;YAAhE;GACE,oBAAC,QAAD;IACE,GAAE;IACF,WAAU;IACV,CAAA;GACF,oBAAC,QAAD;IACE,GAAE;IACF,WAAU;IACV,CAAA;GACF,oBAAC,QAAD;IACE,GAAE;IACF,WAAU;IACV,CAAA;GACE"}
+{"version":3,"file":"tooltip-uobk6Oh-.js","names":[],"sources":["../src/components/tooltip/tooltip.tsx"],"sourcesContent":["import { Tooltip as TooltipBase } from \"@base-ui/react/tooltip\";\nimport type { ComponentPropsWithoutRef, ReactNode } from \"react\";\n\nimport { cn } from \"../../utils/cn\";\nimport { Text } from \"../text\";\n\n/** Tooltip side variant definitions mapping positions to their Tailwind classes. */\nexport const SF_TOOLTIP_VARIANTS = {\n  side: {\n    top: {\n      classes: \"\",\n      description: \"Tooltip appears above the trigger\",\n    },\n    bottom: {\n      classes: \"\",\n      description: \"Tooltip appears below the trigger\",\n    },\n    left: {\n      classes: \"\",\n      description: \"Tooltip appears to the left of the trigger\",\n    },\n    right: {\n      classes: \"\",\n      description: \"Tooltip appears to the right of the trigger\",\n    },\n  },\n} as const;\n\nexport const SF_TOOLTIP_DEFAULT_VARIANTS = {\n  side: \"top\",\n} as const;\n\n// Derived types from SF_TOOLTIP_VARIANTS\nexport type SFTooltipSide = keyof typeof SF_TOOLTIP_VARIANTS.side;\n\nexport interface SFTooltipVariantsProps {\n  /**\n   * Preferred side of the trigger to render the tooltip.\n   * - `\"top\"` — Tooltip appears above the trigger\n   * - `\"bottom\"` — Tooltip appears below the trigger\n   * - `\"left\"` — Tooltip appears to the left of the trigger\n   * - `\"right\"` — Tooltip appears to the right of the trigger\n   * @default \"top\"\n   */\n  side?: SFTooltipSide;\n}\n\nexport function tooltipVariants({\n  side = SF_TOOLTIP_DEFAULT_VARIANTS.side,\n}: SFTooltipVariantsProps = {}) {\n  return cn(\n    // Base styles\n    \"flex origin-[var(--transform-origin)] flex-col rounded-md bg-sf-elevated px-2.5 py-1.5 text-sm text-sf-default\",\n    \"shadow-lg shadow-sf-tip-shadow outline outline-1 outline-sf-fill\",\n    \"transition-[transform,opacity] duration-150\",\n    \"data-[starting-style]:scale-90 data-[starting-style]:opacity-0\",\n    \"data-[ending-style]:scale-90 data-[ending-style]:opacity-0\",\n    \"data-[instant]:duration-0\",\n    // Apply side-specific styles (currently none, but extensible)\n    SF_TOOLTIP_VARIANTS.side[side].classes\n  );\n}\n\nexport const TooltipProvider = TooltipBase.Provider;\n\ntype BaseTooltipProps = ComponentPropsWithoutRef<typeof TooltipBase.Root>;\n\ntype TriggerProps = ComponentPropsWithoutRef<typeof TooltipBase.Trigger>;\n\n/** Alignment options for tooltip positioning. Source: PositionerProps[\"align\"] */\ntype TooltipAlign = \"start\" | \"center\" | \"end\";\n\n/**\n * Tooltip component props.\n *\n * @example\n * ```tsx\n * <TooltipProvider>\n *   <Tooltip content=\"Add new item\">\n *     <Button shape=\"square\" icon={PlusIcon} />\n *   </Tooltip>\n * </TooltipProvider>\n * ```\n */\nexport type TooltipProps = BaseTooltipProps &\n  SFTooltipVariantsProps & {\n    /**\n     * Alignment on the axis perpendicular to `side`.\n     * - `\"start\"` — Align to the start edge\n     * - `\"center\"` — Center-aligned\n     * - `\"end\"` — Align to the end edge\n     */\n    align?: TooltipAlign;\n    /** Additional CSS classes merged via `cn()`. */\n    className?: string;\n    /** Content to display inside the tooltip popup. */\n    content: ReactNode;\n  };\n\n/**\n * Accessible popup that shows additional information on hover/focus.\n * Wrap your app or section with `<TooltipProvider>` to enable delay grouping.\n *\n * @example\n * ```tsx\n * <Tooltip content=\"Save changes\">\n *   <Button variant=\"primary\">Save</Button>\n * </Tooltip>\n * ```\n */\nexport function Tooltip({\n  content,\n  children,\n  align,\n  side,\n  className,\n  ...props\n}: TooltipProps) {\n  return (\n    <TooltipBase.Root {...props}>\n      <TooltipBase.Trigger\n        className={className}\n        render={children as TriggerProps[\"render\"]}\n      />\n      <TooltipBase.Portal>\n        <TooltipBase.Positioner align={align} side={side} sideOffset={10}>\n          <TooltipBase.Popup\n            className={cn(\n              \"flex origin-[var(--transform-origin)] flex-col rounded-md bg-sf-elevated px-2.5 py-1.5 text-sm text-sf-default\",\n              \"shadow-lg shadow-sf-tip-shadow outline outline-sf-fill\",\n              \"transition-[transform,opacity] duration-150\",\n              \"data-[starting-style]:scale-90 data-[starting-style]:opacity-0\",\n              \"data-[ending-style]:scale-90 data-[ending-style]:opacity-0\",\n              \"data-[instant]:duration-0\",\n              \"sf-tooltip-popup\"\n            )}\n          >\n            <TooltipBase.Arrow\n              className={cn(\n                \"flex\",\n                \"data-[side=bottom]:top-[-8px]\",\n                \"data-[side=left]:right-[-13px] data-[side=left]:rotate-90\",\n                \"data-[side=right]:left-[-13px] data-[side=right]:-rotate-90\",\n                \"data-[side=top]:bottom-[-8px] data-[side=top]:rotate-180\"\n              )}\n            >\n              <ArrowSvg />\n            </TooltipBase.Arrow>\n            {typeof content === \"string\" ? (\n              <Text size=\"sm\" wrap=\"shrink\" as=\"span\">\n                {content}\n              </Text>\n            ) : (\n              content\n            )}\n          </TooltipBase.Popup>\n        </TooltipBase.Positioner>\n      </TooltipBase.Portal>\n    </TooltipBase.Root>\n  );\n}\n\n/**\n * Arrow SVG with three paths for proper border rendering in both light and dark modes.\n * This approach matches Base UI's tooltip implementation.\n *\n * The three paths are:\n * 1. ArrowFill - The main arrow body, matches tooltip background\n * 2. ArrowOuterStroke - Border visible in light mode only (transparent in dark)\n * 3. ArrowInnerStroke - Border visible in dark mode only (transparent in light)\n *\n * This is necessary because the outer and inner stroke paths have different geometries,\n * and using both ensures the arrow border aligns perfectly with the tooltip's outline\n * in both color modes.\n *\n * @see https://base-ui.com/react/components/tooltip\n */\nfunction ArrowSvg(props: React.ComponentProps<\"svg\">) {\n  return (\n    <svg width=\"20\" height=\"10\" viewBox=\"0 0 20 10\" fill=\"none\" {...props}>\n      <path\n        d=\"M9.66437 2.60207L4.80758 6.97318C4.07308 7.63423 3.11989 8 2.13172 8H0V10H20V8H18.5349C17.5468 8 16.5936 7.63423 15.8591 6.97318L11.0023 2.60207C10.622 2.2598 10.0447 2.25979 9.66437 2.60207Z\"\n        className=\"fill-sf-elevated\"\n      />\n      <path\n        d=\"M8.99542 1.85876C9.75604 1.17425 10.9106 1.17422 11.6713 1.85878L16.5281 6.22989C17.0789 6.72568 17.7938 7.00001 18.5349 7.00001L15.89 7L11.0023 2.60207C10.622 2.2598 10.0447 2.2598 9.66436 2.60207L4.77734 7L2.13171 7.00001C2.87284 7.00001 3.58774 6.72568 4.13861 6.22989L8.99542 1.85876Z\"\n        className=\"fill-sf-tip-shadow\"\n      />\n      <path\n        d=\"M10.3333 3.34539L5.47654 7.71648C4.55842 8.54279 3.36693 9 2.13172 9H0V8H2.13172C3.11989 8 4.07308 7.63423 4.80758 6.97318L9.66437 2.60207C10.0447 2.25979 10.622 2.2598 11.0023 2.60207L15.8591 6.97318C16.5936 7.63423 17.5468 8 18.5349 8H20V9H18.5349C17.2998 9 16.1083 8.54278 15.1901 7.71648L10.3333 3.34539Z\"\n        className=\"fill-sf-tip-stroke\"\n      />\n    </svg>\n  );\n}\n"],"mappings":";;;;;;AA+DA,IAAa,kBAAkB,QAAY;;;;;;;;;;;;AA+C3C,SAAgB,UAAQ,EACtB,SACA,UACA,OACA,MACA,WACA,GAAG,SACY;CACf,OACE,qBAAC,QAAY,MAAb;EAAkB,GAAI;YAAtB,CACE,oBAAC,QAAY,SAAb;GACa;GACX,QAAQ;EACT,CAAA,GACD,oBAAC,QAAY,QAAb,EAAA,UACE,oBAAC,QAAY,YAAb;GAA+B;GAAa;GAAM,YAAY;aAC5D,qBAAC,QAAY,OAAb;IACE,WAAW,GACT,kHACA,0DACA,+CACA,kEACA,8DACA,6BACA,kBACF;cATF,CAWE,oBAAC,QAAY,OAAb;KACE,WAAW,GACT,QACA,iCACA,6DACA,+DACA,0DACF;eAEA,oBAAC,UAAD,CAAW,CAAA;IACM,CAAA,GAClB,OAAO,YAAY,WAClB,oBAAC,MAAD;KAAM,MAAK;KAAK,MAAK;KAAS,IAAG;eAC9B;IACG,CAAA,IAEN,OAEe;;EACG,CAAA,EACN,CAAA,CACJ;;AAEtB;;;;;;;;;;;;;;;;AAiBA,SAAS,SAAS,OAAoC;CACpD,OACE,qBAAC,OAAD;EAAK,OAAM;EAAK,QAAO;EAAK,SAAQ;EAAY,MAAK;EAAO,GAAI;YAAhE;GACE,oBAAC,QAAD;IACE,GAAE;IACF,WAAU;GACX,CAAA;GACD,oBAAC,QAAD;IACE,GAAE;IACF,WAAU;GACX,CAAA;GACD,oBAAC,QAAD;IACE,GAAE;IACF,WAAU;GACX,CAAA;EACE;;AAET"}

package/dist/{use-agent-harness-BTcNJdw4.js → use-agent-harness-Dl8w6X5O.js}

@@ -193,7 +193,7 @@ function agentHarnessReducer(state, action) {
 				...state,
 				timeline
 			};
-			const newContent = event.content !== void 0 ? event.content : existing.content + event.delta;
+			const newContent = event.content === void 0 ? existing.content + event.delta : event.content;
 			return {
 				...state,
 				timeline,
@@ -627,7 +627,7 @@ function agentHarnessReducer(state, action) {
 				...state,
 				timeline
 			};
-			const newText = event.content !== void 0 ? event.content : existing.text + event.delta;
+			const newText = event.content === void 0 ? existing.text + event.delta : event.content;
 			return {
 				...state,
 				timeline,
@@ -926,4 +926,4 @@ function useAgentHarness({ adapter }) {
 //#endregion
 export { useAgentHarness as a, fromMastraHarness as i, SF_USE_AGENT_HARNESS_VARIANTS as n, createAgentHarnessState as r, SF_USE_AGENT_HARNESS_DEFAULT_VARIANTS as t };
 
-//# sourceMappingURL=use-agent-harness-BTcNJdw4.js.map
+//# sourceMappingURL=use-agent-harness-Dl8w6X5O.js.map