@yarvelle/ui 0.0.0-stage → 0.1.0

package/dist/index.js

@@ -0,0 +1,4418 @@
+// src/tokens/tailwind-preset.ts
+var yarvellePreset = {
+  content: [],
+  darkMode: ["class", '[data-theme="dark"]'],
+  theme: {
+    colors: {
+      transparent: "transparent",
+      current: "currentColor",
+      canvas: "var(--ui-canvas)",
+      surface: {
+        DEFAULT: "var(--ui-surface)",
+        2: "var(--ui-surface-2)",
+        3: "var(--ui-surface-3)"
+      },
+      rail: "var(--ui-rail)",
+      overlay: "var(--ui-overlay)",
+      fg: {
+        DEFAULT: "var(--ui-fg)",
+        muted: "var(--ui-fg-muted)",
+        subtle: "var(--ui-fg-subtle)",
+        "on-primary": "var(--ui-fg-on-primary)",
+        link: "var(--ui-fg-link)"
+      },
+      border: {
+        DEFAULT: "var(--ui-border)",
+        strong: "var(--ui-border-strong)"
+      },
+      primary: {
+        DEFAULT: "var(--ui-primary)",
+        hover: "var(--ui-primary-hover)",
+        fg: "var(--ui-primary-fg)",
+        soft: "var(--ui-primary-soft)",
+        "soft-fg": "var(--ui-primary-soft-fg)"
+      },
+      info: {
+        bg: "var(--ui-info-bg)",
+        fg: "var(--ui-info-fg)",
+        border: "var(--ui-info-border)"
+      },
+      warn: {
+        bg: "var(--ui-warn-bg)",
+        fg: "var(--ui-warn-fg)",
+        border: "var(--ui-warn-border)"
+      },
+      danger: {
+        bg: "var(--ui-danger-bg)",
+        fg: "var(--ui-danger-fg)",
+        border: "var(--ui-danger-border)"
+      },
+      success: {
+        bg: "var(--ui-success-bg)",
+        fg: "var(--ui-success-fg)",
+        border: "var(--ui-success-border)"
+      },
+      emergency: {
+        DEFAULT: "var(--ui-emergency)",
+        fg: "var(--ui-emergency-fg)"
+      },
+      focus: {
+        DEFAULT: "var(--ui-focus)",
+        offset: "var(--ui-focus-offset)"
+      },
+      member: {
+        1: { bg: "var(--ui-member-1-bg)", fg: "var(--ui-member-1-fg)" },
+        2: { bg: "var(--ui-member-2-bg)", fg: "var(--ui-member-2-fg)" },
+        3: { bg: "var(--ui-member-3-bg)", fg: "var(--ui-member-3-fg)" },
+        4: { bg: "var(--ui-member-4-bg)", fg: "var(--ui-member-4-fg)" },
+        5: { bg: "var(--ui-member-5-bg)", fg: "var(--ui-member-5-fg)" }
+      },
+      scope: {
+        health: { bg: "var(--ui-scope-health-bg)", fg: "var(--ui-scope-health-fg)" },
+        finance: { bg: "var(--ui-scope-finance-bg)", fg: "var(--ui-scope-finance-fg)" },
+        education: { bg: "var(--ui-scope-education-bg)", fg: "var(--ui-scope-education-fg)" },
+        household: { bg: "var(--ui-scope-household-bg)", fg: "var(--ui-scope-household-fg)" }
+      },
+      risk: {
+        low: { bg: "var(--ui-risk-low-bg)", fg: "var(--ui-risk-low-fg)", border: "var(--ui-risk-low-border)" },
+        medium: { bg: "var(--ui-risk-medium-bg)", fg: "var(--ui-risk-medium-fg)", border: "var(--ui-risk-medium-border)" },
+        high: { bg: "var(--ui-risk-high-bg)", fg: "var(--ui-risk-high-fg)", border: "var(--ui-risk-high-border)" },
+        critical: { bg: "var(--ui-risk-critical-bg)", fg: "var(--ui-risk-critical-fg)", border: "var(--ui-risk-critical-border)" }
+      }
+    },
+    spacing: {
+      0: "var(--ui-space-0)",
+      1: "var(--ui-space-1)",
+      2: "var(--ui-space-2)",
+      3: "var(--ui-space-3)",
+      4: "var(--ui-space-4)",
+      5: "var(--ui-space-5)",
+      6: "var(--ui-space-6)",
+      8: "var(--ui-space-8)",
+      10: "var(--ui-space-10)",
+      12: "var(--ui-space-12)",
+      16: "var(--ui-space-16)"
+    },
+    fontFamily: {
+      sans: ["var(--ui-font-sans)"],
+      display: ["var(--ui-font-display)"],
+      mono: ["var(--ui-font-mono)"]
+    },
+    fontSize: {
+      xs: ["var(--ui-text-xs)", { lineHeight: "var(--ui-leading-xs)" }],
+      sm: ["var(--ui-text-sm)", { lineHeight: "var(--ui-leading-sm)" }],
+      base: ["var(--ui-text-md)", { lineHeight: "var(--ui-leading-md)" }],
+      md: ["var(--ui-text-md)", { lineHeight: "var(--ui-leading-md)" }],
+      lg: ["var(--ui-text-lg)", { lineHeight: "var(--ui-leading-lg)" }],
+      xl: ["var(--ui-text-xl)", { lineHeight: "var(--ui-leading-xl)" }],
+      "2xl": ["var(--ui-text-2xl)", { lineHeight: "var(--ui-leading-2xl)" }],
+      "3xl": ["var(--ui-text-3xl)", { lineHeight: "var(--ui-leading-3xl)" }],
+      "4xl": ["var(--ui-text-4xl)", { lineHeight: "var(--ui-leading-4xl)" }]
+    },
+    borderRadius: {
+      none: "0px",
+      sm: "var(--ui-radius-sm)",
+      md: "var(--ui-radius-md)",
+      lg: "var(--ui-radius-lg)",
+      xl: "var(--ui-radius-xl)",
+      full: "var(--ui-radius-full)"
+    },
+    boxShadow: {
+      0: "var(--ui-shadow-0)",
+      1: "var(--ui-shadow-1)",
+      2: "var(--ui-shadow-2)",
+      3: "var(--ui-shadow-3)"
+    },
+    minHeight: {
+      tap: "var(--ui-tap)"
+    },
+    minWidth: {
+      tap: "var(--ui-tap)"
+    },
+    transitionTimingFunction: {
+      ui: "var(--ui-ease)"
+    },
+    transitionDuration: {
+      fast: "var(--ui-duration-fast)",
+      base: "var(--ui-duration-base)",
+      slow: "var(--ui-duration-slow)"
+    },
+    zIndex: {
+      rail: "var(--ui-z-rail)",
+      sticky: "var(--ui-z-sticky)",
+      popover: "var(--ui-z-popover)",
+      modal: "var(--ui-z-modal)",
+      toast: "var(--ui-z-toast)",
+      skip: "var(--ui-z-skip)"
+    }
+  }
+};
+
+// src/primitives/Button.tsx
+import * as React from "react";
+
+// src/lib/cn.ts
+import { clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+
+// src/primitives/Button.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var variantStyles = {
+  primary: "bg-primary hover:bg-primary-hover active:bg-primary-hover text-primary-fg border border-transparent shadow-1",
+  secondary: "bg-surface hover:bg-surface-2 active:bg-surface-3 text-fg border border-border-strong shadow-1",
+  ghost: "bg-transparent hover:bg-surface-2 active:bg-surface-3 text-fg-muted hover:text-fg border border-transparent",
+  outline: "bg-transparent hover:bg-surface-2 active:bg-surface-3 text-fg border border-border-strong",
+  danger: "bg-danger-bg hover:bg-danger-fg text-danger-fg hover:text-white border border-danger-border"
+};
+var sizeStyles = {
+  sm: "h-[34px] px-3 text-sm rounded-md relative before:absolute before:-inset-y-1.5 before:inset-x-0 before:content-['']",
+  md: "min-h-[44px] h-10 px-4 text-sm rounded-md",
+  lg: "min-h-[48px] h-12 px-5 text-base rounded-md"
+};
+var Button = React.forwardRef(
+  ({
+    variant = "primary",
+    size = "md",
+    loading = false,
+    disabled = false,
+    leftIcon,
+    rightIcon,
+    children,
+    className,
+    type = "button",
+    ...props
+  }, ref) => {
+    const isDisabled = disabled || loading;
+    return /* @__PURE__ */ jsxs(
+      "button",
+      {
+        ref,
+        type,
+        disabled: isDisabled,
+        "data-slot": "button",
+        "data-variant": variant,
+        "data-size": size,
+        "data-loading": loading ? "true" : void 0,
+        className: cn(
+          "yc-Button-root inline-flex items-center justify-center font-medium select-none",
+          "transition-colors duration-fast ease-ui",
+          "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2",
+          "disabled:opacity-50 disabled:cursor-not-allowed disabled:pointer-events-none",
+          variantStyles[variant],
+          sizeStyles[size],
+          className
+        ),
+        ...props,
+        children: [
+          loading ? /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: "yc-Button-spinner me-2 inline-block h-4 w-4 animate-spin rounded-full border-2 border-current border-t-transparent",
+              "data-slot": "spinner",
+              role: "status",
+              "aria-label": "Loading"
+            }
+          ) : leftIcon ? /* @__PURE__ */ jsx("span", { className: "yc-Button-icon yc-Button-icon-start me-2 inline-flex shrink-0 items-center", "data-slot": "icon-start", children: leftIcon }) : null,
+          /* @__PURE__ */ jsx("span", { className: "yc-Button-label truncate", "data-slot": "label", children }),
+          !loading && rightIcon ? /* @__PURE__ */ jsx("span", { className: "yc-Button-icon yc-Button-icon-end ms-2 inline-flex shrink-0 items-center", "data-slot": "icon-end", children: rightIcon }) : null
+        ]
+      }
+    );
+  }
+);
+Button.displayName = "Button";
+
+// src/primitives/Dialog.tsx
+import * as React2 from "react";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var DialogContext = React2.createContext(null);
+function useDialogContext() {
+  const context = React2.useContext(DialogContext);
+  if (!context) {
+    throw new Error("Dialog compound components must be rendered within a <Dialog>");
+  }
+  return context;
+}
+function Dialog({
+  open: controlledOpen,
+  defaultOpen = false,
+  onOpenChange,
+  children
+}) {
+  const [uncontrolledOpen, setUncontrolledOpen] = React2.useState(defaultOpen);
+  const isControlled = controlledOpen !== void 0;
+  const isOpen = isControlled ? controlledOpen : uncontrolledOpen;
+  const triggerRef = React2.useRef(null);
+  const dialogId = React2.useId();
+  const handleOpenChange = React2.useCallback(
+    (newOpen) => {
+      if (!isControlled) {
+        setUncontrolledOpen(newOpen);
+      }
+      onOpenChange?.(newOpen);
+    },
+    [isControlled, onOpenChange]
+  );
+  return /* @__PURE__ */ jsx2(
+    DialogContext.Provider,
+    {
+      value: {
+        open: isOpen,
+        onOpenChange: handleOpenChange,
+        dialogId,
+        triggerRef
+      },
+      children
+    }
+  );
+}
+var DialogTrigger = React2.forwardRef(
+  ({ children, className, onClick, asChild = false, ...props }, ref) => {
+    const { open, onOpenChange, dialogId, triggerRef } = useDialogContext();
+    const setRef = React2.useCallback(
+      (node) => {
+        triggerRef.current = node;
+        if (typeof ref === "function") {
+          ref(node);
+        } else if (ref) {
+          ref.current = node;
+        }
+      },
+      [ref, triggerRef]
+    );
+    return /* @__PURE__ */ jsx2(
+      "button",
+      {
+        ref: setRef,
+        type: "button",
+        "aria-haspopup": "dialog",
+        "aria-expanded": open,
+        "aria-controls": dialogId,
+        "data-slot": "trigger",
+        className: cn("yc-Dialog-trigger", className),
+        onClick: (e) => {
+          onClick?.(e);
+          if (!e.defaultPrevented) {
+            onOpenChange(!open);
+          }
+        },
+        ...props,
+        children
+      }
+    );
+  }
+);
+DialogTrigger.displayName = "DialogTrigger";
+var DialogContent = React2.forwardRef(
+  ({ children, className, ...props }, ref) => {
+    const { open, onOpenChange, dialogId, triggerRef } = useDialogContext();
+    const contentRef = React2.useRef(null);
+    React2.useEffect(() => {
+      if (!open) return;
+      const handleKeyDown = (e) => {
+        if (e.key === "Escape") {
+          e.stopPropagation();
+          onOpenChange(false);
+          triggerRef.current?.focus();
+        }
+      };
+      document.addEventListener("keydown", handleKeyDown);
+      return () => document.removeEventListener("keydown", handleKeyDown);
+    }, [open, onOpenChange, triggerRef]);
+    if (!open) return null;
+    return /* @__PURE__ */ jsxs2(
+      "div",
+      {
+        className: "yc-Dialog-portal fixed inset-0 z-50 flex items-center justify-center p-4",
+        "data-slot": "portal",
+        children: [
+          /* @__PURE__ */ jsx2(
+            "div",
+            {
+              className: "yc-Dialog-overlay fixed inset-0 bg-overlay transition-opacity",
+              "data-slot": "overlay",
+              onClick: () => onOpenChange(false),
+              "aria-hidden": "true"
+            }
+          ),
+          /* @__PURE__ */ jsx2(
+            "div",
+            {
+              ref: (node) => {
+                contentRef.current = node;
+                if (typeof ref === "function") ref(node);
+                else if (ref) ref.current = node;
+              },
+              id: dialogId,
+              role: "dialog",
+              "aria-modal": "true",
+              "data-slot": "content",
+              className: cn(
+                "yc-Dialog-content relative z-10 w-full max-w-lg rounded-xl bg-surface p-6 text-fg shadow-3 border border-border",
+                "focus:outline-none",
+                className
+              ),
+              ...props,
+              children
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+DialogContent.displayName = "DialogContent";
+var DialogHeader = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ jsx2(
+  "div",
+  {
+    className: cn("yc-Dialog-header flex flex-col space-y-1.5 text-start pb-4", className),
+    "data-slot": "header",
+    ...props
+  }
+);
+DialogHeader.displayName = "DialogHeader";
+var DialogFooter = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ jsx2(
+  "div",
+  {
+    className: cn("yc-Dialog-footer flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2 pt-4", className),
+    "data-slot": "footer",
+    ...props
+  }
+);
+DialogFooter.displayName = "DialogFooter";
+var DialogTitle = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ jsx2(
+  "h2",
+  {
+    className: cn("yc-Dialog-title text-lg font-semibold leading-none tracking-tight text-fg", className),
+    "data-slot": "title",
+    ...props
+  }
+);
+DialogTitle.displayName = "DialogTitle";
+var DialogDescription = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ jsx2(
+  "p",
+  {
+    className: cn("yc-Dialog-description text-sm text-fg-muted", className),
+    "data-slot": "description",
+    ...props
+  }
+);
+DialogDescription.displayName = "DialogDescription";
+var DialogClose = ({
+  className,
+  children,
+  onClick,
+  asChild = false,
+  ...props
+}) => {
+  const { onOpenChange } = useDialogContext();
+  return /* @__PURE__ */ jsx2(
+    "button",
+    {
+      type: "button",
+      className: cn("yc-Dialog-close", className),
+      "data-slot": "close",
+      onClick: (e) => {
+        onClick?.(e);
+        if (!e.defaultPrevented) onOpenChange(false);
+      },
+      ...props,
+      children: children || "Close"
+    }
+  );
+};
+DialogClose.displayName = "DialogClose";
+
+// src/primitives/Sheet.tsx
+import * as React3 from "react";
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+var SheetContext = React3.createContext(null);
+function useSheetContext() {
+  const context = React3.useContext(SheetContext);
+  if (!context) {
+    throw new Error("Sheet compound components must be rendered within a <Sheet>");
+  }
+  return context;
+}
+function Sheet({
+  open: controlledOpen,
+  defaultOpen = false,
+  onOpenChange,
+  side = "end",
+  children
+}) {
+  const [uncontrolledOpen, setUncontrolledOpen] = React3.useState(defaultOpen);
+  const isControlled = controlledOpen !== void 0;
+  const isOpen = isControlled ? controlledOpen : uncontrolledOpen;
+  const triggerRef = React3.useRef(null);
+  const sheetId = React3.useId();
+  const handleOpenChange = React3.useCallback(
+    (newOpen) => {
+      if (!isControlled) {
+        setUncontrolledOpen(newOpen);
+      }
+      onOpenChange?.(newOpen);
+    },
+    [isControlled, onOpenChange]
+  );
+  return /* @__PURE__ */ jsx3(
+    SheetContext.Provider,
+    {
+      value: {
+        open: isOpen,
+        onOpenChange: handleOpenChange,
+        side,
+        sheetId,
+        triggerRef
+      },
+      children
+    }
+  );
+}
+var SheetTrigger = React3.forwardRef(
+  ({ children, className, onClick, asChild = false, ...props }, ref) => {
+    const { open, onOpenChange, sheetId, triggerRef } = useSheetContext();
+    return /* @__PURE__ */ jsx3(
+      "button",
+      {
+        ref: (node) => {
+          triggerRef.current = node;
+          if (typeof ref === "function") ref(node);
+          else if (ref) ref.current = node;
+        },
+        type: "button",
+        "aria-haspopup": "dialog",
+        "aria-expanded": open,
+        "aria-controls": sheetId,
+        "data-slot": "trigger",
+        className: cn("yc-Sheet-trigger", className),
+        onClick: (e) => {
+          onClick?.(e);
+          if (!e.defaultPrevented) onOpenChange(!open);
+        },
+        ...props,
+        children
+      }
+    );
+  }
+);
+SheetTrigger.displayName = "SheetTrigger";
+var sideStyles = {
+  end: "inset-y-0 end-0 h-full w-3/4 max-w-md border-s border-border",
+  start: "inset-y-0 start-0 h-full w-3/4 max-w-md border-e border-border",
+  bottom: "inset-x-0 bottom-0 max-h-[85vh] border-t border-border rounded-t-xl"
+};
+var SheetContent = React3.forwardRef(
+  ({ children, className, side: propSide, ...props }, ref) => {
+    const { open, onOpenChange, side: contextSide, sheetId, triggerRef } = useSheetContext();
+    const side = propSide || contextSide;
+    React3.useEffect(() => {
+      if (!open) return;
+      const handleKeyDown = (e) => {
+        if (e.key === "Escape") {
+          e.stopPropagation();
+          onOpenChange(false);
+          triggerRef.current?.focus();
+        }
+      };
+      document.addEventListener("keydown", handleKeyDown);
+      return () => document.removeEventListener("keydown", handleKeyDown);
+    }, [open, onOpenChange, triggerRef]);
+    if (!open) return null;
+    return /* @__PURE__ */ jsxs3("div", { className: "yc-Sheet-portal fixed inset-0 z-50 flex", "data-slot": "portal", children: [
+      /* @__PURE__ */ jsx3(
+        "div",
+        {
+          className: "yc-Sheet-overlay fixed inset-0 bg-overlay transition-opacity",
+          "data-slot": "overlay",
+          onClick: () => onOpenChange(false),
+          "aria-hidden": "true"
+        }
+      ),
+      /* @__PURE__ */ jsx3(
+        "div",
+        {
+          ref,
+          id: sheetId,
+          role: "dialog",
+          "aria-modal": "true",
+          "data-slot": "content",
+          "data-side": side,
+          className: cn(
+            "yc-Sheet-content fixed z-10 bg-surface p-6 shadow-3 text-fg transition-transform",
+            sideStyles[side],
+            className
+          ),
+          ...props,
+          children
+        }
+      )
+    ] });
+  }
+);
+SheetContent.displayName = "SheetContent";
+var SheetHeader = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ jsx3(
+  "div",
+  {
+    className: cn("yc-Sheet-header flex flex-col space-y-2 text-start pb-4", className),
+    "data-slot": "header",
+    ...props
+  }
+);
+SheetHeader.displayName = "SheetHeader";
+var SheetFooter = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ jsx3(
+  "div",
+  {
+    className: cn("yc-Sheet-footer flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2 pt-4", className),
+    "data-slot": "footer",
+    ...props
+  }
+);
+SheetFooter.displayName = "SheetFooter";
+var SheetTitle = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ jsx3(
+  "h2",
+  {
+    className: cn("yc-Sheet-title text-lg font-semibold text-fg", className),
+    "data-slot": "title",
+    ...props
+  }
+);
+SheetTitle.displayName = "SheetTitle";
+var SheetDescription = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ jsx3(
+  "p",
+  {
+    className: cn("yc-Sheet-description text-sm text-fg-muted", className),
+    "data-slot": "description",
+    ...props
+  }
+);
+SheetDescription.displayName = "SheetDescription";
+var SheetClose = ({
+  className,
+  children,
+  onClick,
+  ...props
+}) => {
+  const { onOpenChange } = useSheetContext();
+  return /* @__PURE__ */ jsx3(
+    "button",
+    {
+      type: "button",
+      className: cn("yc-Sheet-close", className),
+      "data-slot": "close",
+      onClick: (e) => {
+        onClick?.(e);
+        if (!e.defaultPrevented) onOpenChange(false);
+      },
+      ...props,
+      children: children || "Close"
+    }
+  );
+};
+SheetClose.displayName = "SheetClose";
+
+// src/primitives/Card.tsx
+import * as React4 from "react";
+import { jsx as jsx4 } from "react/jsx-runtime";
+var Card = React4.forwardRef(
+  ({ className, variant = "default", ...props }, ref) => /* @__PURE__ */ jsx4(
+    "div",
+    {
+      ref,
+      "data-slot": "card",
+      "data-variant": variant,
+      className: cn(
+        "yc-Card-root rounded-lg border border-border bg-surface text-fg shadow-1",
+        variant === "muted" && "bg-surface-2",
+        variant === "interactive" && "hover:border-border-strong hover:bg-surface-2 transition-colors duration-fast cursor-pointer",
+        className
+      ),
+      ...props
+    }
+  )
+);
+Card.displayName = "Card";
+var CardHeader = React4.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx4(
+    "div",
+    {
+      ref,
+      "data-slot": "header",
+      className: cn("yc-Card-header flex flex-col space-y-1.5 p-6 text-start", className),
+      ...props
+    }
+  )
+);
+CardHeader.displayName = "CardHeader";
+var CardTitle = React4.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx4(
+    "h3",
+    {
+      ref,
+      "data-slot": "title",
+      className: cn("yc-Card-title text-lg font-semibold leading-none tracking-tight text-fg", className),
+      ...props
+    }
+  )
+);
+CardTitle.displayName = "CardTitle";
+var CardDescription = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx4(
+  "p",
+  {
+    ref,
+    "data-slot": "description",
+    className: cn("yc-Card-description text-sm text-fg-muted", className),
+    ...props
+  }
+));
+CardDescription.displayName = "CardDescription";
+var CardContent = React4.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx4("div", { ref, "data-slot": "content", className: cn("yc-Card-content p-6 pt-0 text-start", className), ...props })
+);
+CardContent.displayName = "CardContent";
+var CardFooter = React4.forwardRef(
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx4(
+    "div",
+    {
+      ref,
+      "data-slot": "footer",
+      className: cn("yc-Card-footer flex items-center p-6 pt-0", className),
+      ...props
+    }
+  )
+);
+CardFooter.displayName = "CardFooter";
+
+// src/primitives/Badge.tsx
+import { jsx as jsx5 } from "react/jsx-runtime";
+var variantStyles2 = {
+  default: "bg-primary-soft text-primary-soft-fg border-transparent",
+  primary: "bg-primary text-primary-fg border-transparent",
+  neutral: "bg-surface-2 text-fg-muted border-border",
+  info: "bg-info-bg text-info-fg border-info-border",
+  warn: "bg-warn-bg text-warn-fg border-warn-border",
+  danger: "bg-danger-bg text-danger-fg border-danger-border",
+  success: "bg-success-bg text-success-fg border-success-border",
+  outline: "bg-transparent text-fg border-border-strong"
+};
+var Badge = ({
+  className,
+  variant = "default",
+  children,
+  ...props
+}) => {
+  return /* @__PURE__ */ jsx5(
+    "span",
+    {
+      "data-slot": "badge",
+      "data-variant": variant,
+      className: cn(
+        "yc-Badge-root inline-flex items-center rounded-sm border px-2.5 py-0.5 text-xs font-medium transition-colors",
+        variantStyles2[variant],
+        className
+      ),
+      ...props,
+      children
+    }
+  );
+};
+Badge.displayName = "Badge";
+
+// src/primitives/Avatar.tsx
+import * as React5 from "react";
+import { jsx as jsx6 } from "react/jsx-runtime";
+var sizeStyles2 = {
+  sm: "h-8 w-8 text-xs",
+  md: "h-10 w-10 text-sm",
+  lg: "h-12 w-12 text-base",
+  xl: "h-16 w-16 text-lg"
+};
+var memberColorStyles = {
+  "1": "bg-member-1-bg text-member-1-fg",
+  "2": "bg-member-2-bg text-member-2-fg",
+  "3": "bg-member-3-bg text-member-3-fg",
+  "4": "bg-member-4-bg text-member-4-fg",
+  "5": "bg-member-5-bg text-member-5-fg"
+};
+var Avatar = ({
+  src,
+  alt = "",
+  name,
+  size = "md",
+  colorSlot = "1",
+  children,
+  className,
+  ...props
+}) => {
+  const [hasError, setHasError] = React5.useState(false);
+  const initials = React5.useMemo(() => {
+    if (!name) return "?";
+    const parts = name.trim().split(/\s+/);
+    if (parts.length === 1) return parts[0].slice(0, 2).toUpperCase();
+    return (parts[0][0] + parts[parts.length - 1][0]).toUpperCase();
+  }, [name]);
+  const showImage = src && !hasError;
+  return /* @__PURE__ */ jsx6(
+    "div",
+    {
+      "data-slot": "avatar",
+      "data-size": size,
+      "data-color-slot": colorSlot,
+      className: cn(
+        "yc-Avatar-root relative inline-flex shrink-0 items-center justify-center overflow-hidden rounded-full font-medium select-none border border-border",
+        sizeStyles2[size],
+        memberColorStyles[colorSlot],
+        className
+      ),
+      ...props,
+      children: children ? children : showImage ? /* @__PURE__ */ jsx6(
+        "img",
+        {
+          src,
+          alt: alt || name || "Avatar",
+          onError: () => setHasError(true),
+          "data-slot": "avatar-image",
+          className: "yc-Avatar-image h-full w-full object-cover"
+        }
+      ) : /* @__PURE__ */ jsx6("span", { "data-slot": "avatar-fallback", className: "yc-Avatar-fallback leading-none", children: initials })
+    }
+  );
+};
+Avatar.displayName = "Avatar";
+var AvatarImage = ({ className, alt = "", ...props }) => /* @__PURE__ */ jsx6(
+  "img",
+  {
+    "data-slot": "avatar-image",
+    alt,
+    className: cn("yc-Avatar-image h-full w-full object-cover", className),
+    ...props
+  }
+);
+AvatarImage.displayName = "AvatarImage";
+var AvatarFallback = ({ className, children, ...props }) => /* @__PURE__ */ jsx6(
+  "span",
+  {
+    "data-slot": "avatar-fallback",
+    className: cn("yc-Avatar-fallback leading-none font-medium", className),
+    ...props,
+    children
+  }
+);
+AvatarFallback.displayName = "AvatarFallback";
+
+// src/primitives/Chip.tsx
+import { jsx as jsx7, jsxs as jsxs4 } from "react/jsx-runtime";
+var scopeStyles = {
+  default: {
+    default: "bg-surface text-fg border-border hover:bg-surface-2",
+    selected: "bg-primary text-primary-fg border-primary"
+  },
+  health: {
+    default: "bg-scope-health-bg text-scope-health-fg border-transparent hover:opacity-90",
+    selected: "bg-primary text-primary-fg border-primary"
+  },
+  finance: {
+    default: "bg-scope-finance-bg text-scope-finance-fg border-transparent hover:opacity-90",
+    selected: "bg-primary text-primary-fg border-primary"
+  },
+  education: {
+    default: "bg-scope-education-bg text-scope-education-fg border-transparent hover:opacity-90",
+    selected: "bg-primary text-primary-fg border-primary"
+  },
+  household: {
+    default: "bg-scope-household-bg text-scope-household-fg border-transparent hover:opacity-90",
+    selected: "bg-primary text-primary-fg border-primary"
+  }
+};
+var Chip = ({
+  children,
+  selected = false,
+  scope = "default",
+  onRemove,
+  startIcon,
+  className,
+  onClick,
+  disabled = false,
+  ...props
+}) => {
+  return /* @__PURE__ */ jsxs4(
+    "button",
+    {
+      type: "button",
+      "data-slot": "chip",
+      "data-selected": selected ? "true" : void 0,
+      "data-scope": scope,
+      disabled,
+      onClick,
+      className: cn(
+        "yc-Chip-root inline-flex items-center rounded-sm border px-3 py-1 text-xs font-medium transition-colors select-none",
+        "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-focus",
+        "disabled:opacity-50 disabled:cursor-not-allowed",
+        selected ? scopeStyles[scope].selected : scopeStyles[scope].default,
+        className
+      ),
+      ...props,
+      children: [
+        startIcon && /* @__PURE__ */ jsx7("span", { className: "yc-Chip-icon me-1.5 inline-flex shrink-0 items-center", "data-slot": "icon", children: startIcon }),
+        /* @__PURE__ */ jsx7("span", { className: "yc-Chip-label truncate", "data-slot": "label", children }),
+        onRemove && /* @__PURE__ */ jsx7(
+          "span",
+          {
+            role: "button",
+            tabIndex: 0,
+            "aria-label": "Remove",
+            "data-slot": "remove",
+            onClick: (e) => {
+              e.stopPropagation();
+              onRemove();
+            },
+            className: "yc-Chip-remove ms-1.5 inline-flex items-center justify-center rounded-full p-0.5 hover:bg-black/10 focus:outline-none",
+            children: /* @__PURE__ */ jsx7("svg", { className: "h-3 w-3", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ jsx7("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) })
+          }
+        )
+      ]
+    }
+  );
+};
+Chip.displayName = "Chip";
+
+// src/primitives/Menu.tsx
+import * as React6 from "react";
+import { jsx as jsx8 } from "react/jsx-runtime";
+var MenuContext = React6.createContext(null);
+function useMenuContext() {
+  const ctx = React6.useContext(MenuContext);
+  if (!ctx) throw new Error("Menu compound components must be rendered inside <Menu>");
+  return ctx;
+}
+function Menu({ open: controlledOpen, defaultOpen = false, onOpenChange, children }) {
+  const [uncontrolledOpen, setUncontrolledOpen] = React6.useState(defaultOpen);
+  const isControlled = controlledOpen !== void 0;
+  const isOpen = isControlled ? controlledOpen : uncontrolledOpen;
+  const triggerRef = React6.useRef(null);
+  const menuId = React6.useId();
+  const setOpen = React6.useCallback(
+    (next) => {
+      if (!isControlled) setUncontrolledOpen(next);
+      onOpenChange?.(next);
+    },
+    [isControlled, onOpenChange]
+  );
+  return /* @__PURE__ */ jsx8(MenuContext.Provider, { value: { open: isOpen, setOpen, triggerRef, menuId }, children: /* @__PURE__ */ jsx8("div", { className: "yc-Menu-root relative inline-block text-start", "data-slot": "root", children }) });
+}
+var MenuTrigger = React6.forwardRef(
+  ({ children, className, onClick, ...props }, ref) => {
+    const { open, setOpen, menuId, triggerRef } = useMenuContext();
+    return /* @__PURE__ */ jsx8(
+      "button",
+      {
+        ref: (node) => {
+          triggerRef.current = node;
+          if (typeof ref === "function") ref(node);
+          else if (ref) ref.current = node;
+        },
+        type: "button",
+        "aria-haspopup": "menu",
+        "aria-expanded": open,
+        "aria-controls": menuId,
+        "data-slot": "trigger",
+        className: cn("yc-Menu-trigger inline-flex items-center justify-center", className),
+        onClick: (e) => {
+          onClick?.(e);
+          if (!e.defaultPrevented) setOpen(!open);
+        },
+        ...props,
+        children
+      }
+    );
+  }
+);
+MenuTrigger.displayName = "MenuTrigger";
+var MenuContent = React6.forwardRef(
+  ({ children, className, align = "start", ...props }, ref) => {
+    const { open, setOpen, menuId, triggerRef } = useMenuContext();
+    const contentRef = React6.useRef(null);
+    React6.useEffect(() => {
+      if (!open) return;
+      const handleClickOutside = (e) => {
+        if (contentRef.current && !contentRef.current.contains(e.target) && triggerRef.current && !triggerRef.current.contains(e.target)) {
+          setOpen(false);
+        }
+      };
+      const handleKeyDown = (e) => {
+        if (e.key === "Escape") {
+          e.stopPropagation();
+          setOpen(false);
+          triggerRef.current?.focus();
+        }
+      };
+      document.addEventListener("mousedown", handleClickOutside);
+      document.addEventListener("keydown", handleKeyDown);
+      return () => {
+        document.removeEventListener("mousedown", handleClickOutside);
+        document.removeEventListener("keydown", handleKeyDown);
+      };
+    }, [open, setOpen, triggerRef]);
+    if (!open) return null;
+    const alignClass = align === "end" ? "end-0" : align === "center" ? "start-1/2 -translate-x-1/2" : "start-0";
+    return /* @__PURE__ */ jsx8(
+      "div",
+      {
+        ref: (node) => {
+          contentRef.current = node;
+          if (typeof ref === "function") ref(node);
+          else if (ref) ref.current = node;
+        },
+        id: menuId,
+        role: "menu",
+        "aria-orientation": "vertical",
+        tabIndex: -1,
+        "data-slot": "content",
+        className: cn(
+          "yc-Menu-content absolute z-50 mt-1 min-w-[12rem] rounded-md bg-surface p-1 text-fg shadow-2 border border-border focus:outline-none",
+          alignClass,
+          className
+        ),
+        ...props,
+        children
+      }
+    );
+  }
+);
+MenuContent.displayName = "MenuContent";
+var MenuItem = React6.forwardRef(
+  ({ children, className, destructive = false, onClick, disabled = false, ...props }, ref) => {
+    const { setOpen } = useMenuContext();
+    return /* @__PURE__ */ jsx8(
+      "button",
+      {
+        ref,
+        type: "button",
+        role: "menuitem",
+        tabIndex: -1,
+        disabled,
+        "data-slot": "item",
+        "data-destructive": destructive ? "true" : void 0,
+        className: cn(
+          "yc-Menu-item group relative flex w-full cursor-pointer select-none items-center rounded-sm px-2.5 py-1.5 text-sm outline-none transition-colors duration-fast",
+          "hover:bg-surface-2 focus:bg-surface-2",
+          destructive ? "text-danger-fg hover:bg-danger-bg focus:bg-danger-bg" : "text-fg hover:text-fg",
+          "disabled:pointer-events-none disabled:opacity-50",
+          className
+        ),
+        onClick: (e) => {
+          onClick?.(e);
+          if (!e.defaultPrevented) setOpen(false);
+        },
+        ...props,
+        children
+      }
+    );
+  }
+);
+MenuItem.displayName = "MenuItem";
+var MenuSeparator = ({ className, ...props }) => /* @__PURE__ */ jsx8(
+  "div",
+  {
+    role: "separator",
+    "data-slot": "separator",
+    className: cn("yc-Menu-separator my-1 h-px bg-border", className),
+    ...props
+  }
+);
+MenuSeparator.displayName = "MenuSeparator";
+
+// src/primitives/Popover.tsx
+import * as React7 from "react";
+import { jsx as jsx9 } from "react/jsx-runtime";
+var PopoverContext = React7.createContext(null);
+function usePopoverContext() {
+  const ctx = React7.useContext(PopoverContext);
+  if (!ctx) throw new Error("Popover compound components must be rendered inside <Popover>");
+  return ctx;
+}
+function Popover({ open: controlledOpen, defaultOpen = false, onOpenChange, children }) {
+  const [uncontrolledOpen, setUncontrolledOpen] = React7.useState(defaultOpen);
+  const isControlled = controlledOpen !== void 0;
+  const isOpen = isControlled ? controlledOpen : uncontrolledOpen;
+  const triggerRef = React7.useRef(null);
+  const popoverId = React7.useId();
+  const setOpen = React7.useCallback(
+    (next) => {
+      if (!isControlled) setUncontrolledOpen(next);
+      onOpenChange?.(next);
+    },
+    [isControlled, onOpenChange]
+  );
+  return /* @__PURE__ */ jsx9(PopoverContext.Provider, { value: { open: isOpen, setOpen, triggerRef, popoverId }, children: /* @__PURE__ */ jsx9("div", { className: "yc-Popover-root relative inline-block text-start", "data-slot": "root", children }) });
+}
+var PopoverTrigger = React7.forwardRef(
+  ({ children, className, onClick, ...props }, ref) => {
+    const { open, setOpen, popoverId, triggerRef } = usePopoverContext();
+    return /* @__PURE__ */ jsx9(
+      "button",
+      {
+        ref: (node) => {
+          triggerRef.current = node;
+          if (typeof ref === "function") ref(node);
+          else if (ref) ref.current = node;
+        },
+        type: "button",
+        "aria-haspopup": "dialog",
+        "aria-expanded": open,
+        "aria-controls": popoverId,
+        "data-slot": "trigger",
+        className: cn("yc-Popover-trigger inline-flex items-center justify-center", className),
+        onClick: (e) => {
+          onClick?.(e);
+          if (!e.defaultPrevented) setOpen(!open);
+        },
+        ...props,
+        children
+      }
+    );
+  }
+);
+PopoverTrigger.displayName = "PopoverTrigger";
+var PopoverContent = React7.forwardRef(
+  ({ children, className, align = "start", ...props }, ref) => {
+    const { open, setOpen, popoverId, triggerRef } = usePopoverContext();
+    const contentRef = React7.useRef(null);
+    React7.useEffect(() => {
+      if (!open) return;
+      const handleClickOutside = (e) => {
+        if (contentRef.current && !contentRef.current.contains(e.target) && triggerRef.current && !triggerRef.current.contains(e.target)) {
+          setOpen(false);
+        }
+      };
+      const handleKeyDown = (e) => {
+        if (e.key === "Escape") {
+          e.stopPropagation();
+          setOpen(false);
+          triggerRef.current?.focus();
+        }
+      };
+      document.addEventListener("mousedown", handleClickOutside);
+      document.addEventListener("keydown", handleKeyDown);
+      return () => {
+        document.removeEventListener("mousedown", handleClickOutside);
+        document.removeEventListener("keydown", handleKeyDown);
+      };
+    }, [open, setOpen, triggerRef]);
+    if (!open) return null;
+    const alignClass = align === "end" ? "end-0" : align === "center" ? "start-1/2 -translate-x-1/2" : "start-0";
+    return /* @__PURE__ */ jsx9(
+      "div",
+      {
+        ref: (node) => {
+          contentRef.current = node;
+          if (typeof ref === "function") ref(node);
+          else if (ref) ref.current = node;
+        },
+        id: popoverId,
+        role: "dialog",
+        "data-slot": "content",
+        className: cn(
+          "yc-Popover-content absolute z-50 mt-1 min-w-[14rem] rounded-lg bg-surface p-4 text-fg shadow-2 border border-border focus:outline-none",
+          alignClass,
+          className
+        ),
+        ...props,
+        children
+      }
+    );
+  }
+);
+PopoverContent.displayName = "PopoverContent";
+
+// src/primitives/Tabs.tsx
+import * as React8 from "react";
+import { jsx as jsx10 } from "react/jsx-runtime";
+var TabsContext = React8.createContext(null);
+function useTabsContext() {
+  const ctx = React8.useContext(TabsContext);
+  if (!ctx) throw new Error("Tabs compound components must be rendered inside <Tabs>");
+  return ctx;
+}
+function Tabs({
+  value: controlledValue,
+  defaultValue = "",
+  onValueChange,
+  children,
+  className,
+  ...props
+}) {
+  const [uncontrolledValue, setUncontrolledValue] = React8.useState(defaultValue);
+  const isControlled = controlledValue !== void 0;
+  const activeValue = isControlled ? controlledValue : uncontrolledValue;
+  const baseId = React8.useId();
+  const handleValueChange = React8.useCallback(
+    (newVal) => {
+      if (!isControlled) setUncontrolledValue(newVal);
+      onValueChange?.(newVal);
+    },
+    [isControlled, onValueChange]
+  );
+  return /* @__PURE__ */ jsx10(TabsContext.Provider, { value: { value: activeValue, onValueChange: handleValueChange, baseId }, children: /* @__PURE__ */ jsx10("div", { className: cn("yc-Tabs-root flex flex-col", className), "data-slot": "root", ...props, children }) });
+}
+var TabsList = React8.forwardRef(
+  ({ children, className, ...props }, ref) => {
+    return /* @__PURE__ */ jsx10(
+      "div",
+      {
+        ref,
+        role: "tablist",
+        "data-slot": "list",
+        className: cn(
+          "yc-Tabs-list inline-flex h-10 items-center justify-start rounded-lg bg-surface-2 p-1 text-fg-muted",
+          className
+        ),
+        ...props,
+        children
+      }
+    );
+  }
+);
+TabsList.displayName = "TabsList";
+var TabsTrigger = React8.forwardRef(
+  ({ value, children, className, disabled = false, ...props }, ref) => {
+    const { value: activeValue, onValueChange, baseId } = useTabsContext();
+    const isSelected = activeValue === value;
+    const tabId = `${baseId}-tab-${value}`;
+    const panelId = `${baseId}-panel-${value}`;
+    return /* @__PURE__ */ jsx10(
+      "button",
+      {
+        ref,
+        id: tabId,
+        type: "button",
+        role: "tab",
+        "aria-selected": isSelected,
+        "aria-controls": panelId,
+        tabIndex: isSelected ? 0 : -1,
+        disabled,
+        "data-slot": "trigger",
+        "data-state": isSelected ? "active" : "inactive",
+        className: cn(
+          "yc-Tabs-trigger inline-flex items-center justify-center whitespace-nowrap rounded-md px-3 py-1.5 text-sm font-medium transition-all duration-fast",
+          "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2",
+          "disabled:pointer-events-none disabled:opacity-50",
+          isSelected ? "bg-surface text-fg shadow-1" : "text-fg-muted hover:text-fg hover:bg-surface-3",
+          className
+        ),
+        onClick: () => onValueChange(value),
+        ...props,
+        children
+      }
+    );
+  }
+);
+TabsTrigger.displayName = "TabsTrigger";
+var TabsContent = React8.forwardRef(
+  ({ value, children, className, ...props }, ref) => {
+    const { value: activeValue, baseId } = useTabsContext();
+    const isSelected = activeValue === value;
+    const tabId = `${baseId}-tab-${value}`;
+    const panelId = `${baseId}-panel-${value}`;
+    if (!isSelected) return null;
+    return /* @__PURE__ */ jsx10(
+      "div",
+      {
+        ref,
+        id: panelId,
+        role: "tabpanel",
+        "aria-labelledby": tabId,
+        tabIndex: 0,
+        "data-slot": "content",
+        className: cn(
+          "yc-Tabs-content mt-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-focus focus-visible:ring-offset-2",
+          className
+        ),
+        ...props,
+        children
+      }
+    );
+  }
+);
+TabsContent.displayName = "TabsContent";
+
+// src/primitives/Segmented.tsx
+import * as React9 from "react";
+import { jsx as jsx11, jsxs as jsxs5 } from "react/jsx-runtime";
+function SegmentedControl({
+  options,
+  value: controlledValue,
+  defaultValue,
+  onChange,
+  className,
+  size = "md"
+}) {
+  const [uncontrolledValue, setUncontrolledValue] = React9.useState(
+    defaultValue || (options.length > 0 ? options[0].value : "")
+  );
+  const isControlled = controlledValue !== void 0;
+  const activeValue = isControlled ? controlledValue : uncontrolledValue;
+  const handleClick = (optValue) => {
+    if (!isControlled) {
+      setUncontrolledValue(optValue);
+    }
+    onChange?.(optValue);
+  };
+  const sizeClasses = size === "sm" ? "h-8 p-0.5 text-xs" : "min-h-[44px] h-10 p-1 text-sm";
+  return /* @__PURE__ */ jsx11(
+    "div",
+    {
+      role: "radiogroup",
+      "data-slot": "segmented-control",
+      "data-size": size,
+      className: cn(
+        "yc-Segmented-root inline-flex items-center rounded-lg bg-surface-2 text-fg-muted border border-border select-none",
+        sizeClasses,
+        className
+      ),
+      children: options.map((opt) => {
+        const isSelected = opt.value === activeValue;
+        return /* @__PURE__ */ jsxs5(
+          "button",
+          {
+            type: "button",
+            role: "radio",
+            "aria-checked": isSelected,
+            disabled: opt.disabled,
+            "data-slot": "item",
+            "data-state": isSelected ? "checked" : "unchecked",
+            onClick: () => handleClick(opt.value),
+            className: cn(
+              "yc-Segmented-item inline-flex h-full items-center justify-center gap-1.5 rounded-md px-3 font-medium transition-all duration-fast",
+              "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-focus",
+              "disabled:pointer-events-none disabled:opacity-50",
+              isSelected ? "bg-surface text-fg shadow-1" : "text-fg-muted hover:text-fg hover:bg-surface-3"
+            ),
+            children: [
+              opt.icon && /* @__PURE__ */ jsx11("span", { className: "yc-Segmented-icon inline-flex shrink-0 items-center", "data-slot": "icon", children: opt.icon }),
+              /* @__PURE__ */ jsx11("span", { className: "yc-Segmented-label truncate", "data-slot": "label", children: opt.label })
+            ]
+          },
+          opt.value
+        );
+      })
+    }
+  );
+}
+
+// src/primitives/EmptyState.tsx
+import * as React10 from "react";
+import { jsx as jsx12, jsxs as jsxs6 } from "react/jsx-runtime";
+var EmptyState = React10.forwardRef(
+  ({ icon, title, description, action, className, ...props }, ref) => {
+    return /* @__PURE__ */ jsxs6(
+      "div",
+      {
+        ref,
+        "data-slot": "empty-state",
+        className: cn(
+          "yc-EmptyState-root flex flex-col items-center justify-center p-8 text-center",
+          className
+        ),
+        ...props,
+        children: [
+          icon && /* @__PURE__ */ jsx12(
+            "div",
+            {
+              className: "yc-EmptyState-icon mb-4 flex h-12 w-12 items-center justify-center rounded-full bg-surface-2 text-fg-muted",
+              "data-slot": "icon",
+              children: icon
+            }
+          ),
+          /* @__PURE__ */ jsx12("h3", { className: "yc-EmptyState-title text-base font-medium text-fg", "data-slot": "title", children: title }),
+          description && /* @__PURE__ */ jsx12(
+            "p",
+            {
+              className: "yc-EmptyState-description mt-1.5 max-w-sm text-sm text-fg-muted",
+              "data-slot": "description",
+              children: description
+            }
+          ),
+          action && /* @__PURE__ */ jsx12("div", { className: "yc-EmptyState-action mt-5", "data-slot": "action", children: action })
+        ]
+      }
+    );
+  }
+);
+EmptyState.displayName = "EmptyState";
+
+// src/primitives/Skeleton.tsx
+import * as React11 from "react";
+import { jsx as jsx13 } from "react/jsx-runtime";
+var Skeleton = React11.forwardRef(
+  ({ className, ...props }, ref) => {
+    return /* @__PURE__ */ jsx13(
+      "div",
+      {
+        ref,
+        "data-slot": "skeleton",
+        className: cn("yc-Skeleton-root animate-pulse rounded-md bg-surface-3", className),
+        ...props
+      }
+    );
+  }
+);
+Skeleton.displayName = "Skeleton";
+
+// src/primitives/InlineError.tsx
+import * as React12 from "react";
+import { jsx as jsx14, jsxs as jsxs7 } from "react/jsx-runtime";
+var InlineError = React12.forwardRef(
+  ({ message, icon, children, className, ...props }, ref) => {
+    const content = message || children;
+    if (!content) return null;
+    return /* @__PURE__ */ jsxs7(
+      "div",
+      {
+        ref,
+        role: "alert",
+        "data-slot": "inline-error",
+        className: cn(
+          "yc-InlineError-root flex items-center gap-1.5 text-xs font-medium text-danger-fg",
+          className
+        ),
+        ...props,
+        children: [
+          icon && /* @__PURE__ */ jsx14("span", { className: "yc-InlineError-icon inline-flex shrink-0 items-center", "data-slot": "icon", children: icon }),
+          /* @__PURE__ */ jsx14("span", { className: "yc-InlineError-message", "data-slot": "message", children: content })
+        ]
+      }
+    );
+  }
+);
+InlineError.displayName = "InlineError";
+
+// src/primitives/Toaster.tsx
+import * as React13 from "react";
+import { jsx as jsx15, jsxs as jsxs8 } from "react/jsx-runtime";
+var ToastContext = React13.createContext(null);
+function useToast() {
+  const ctx = React13.useContext(ToastContext);
+  if (!ctx) {
+    throw new Error("useToast must be used within a ToastProvider or Toaster");
+  }
+  return ctx;
+}
+function ToastProvider({ children }) {
+  const [toasts, setToasts] = React13.useState([]);
+  const removeToast = React13.useCallback((id) => {
+    setToasts((prev) => prev.filter((t) => t.id !== id));
+  }, []);
+  const addToast = React13.useCallback(
+    (toast) => {
+      const id = Math.random().toString(36).substring(2, 9);
+      const newToast = { ...toast, id };
+      setToasts((prev) => [...prev, newToast]);
+      const duration = toast.duration ?? 5e3;
+      if (duration > 0) {
+        setTimeout(() => {
+          removeToast(id);
+        }, duration);
+      }
+      return id;
+    },
+    [removeToast]
+  );
+  return /* @__PURE__ */ jsx15(ToastContext.Provider, { value: { toasts, addToast, removeToast }, children });
+}
+var variantStyles3 = {
+  info: "border-info-border bg-surface text-fg",
+  success: "border-success-border bg-surface text-fg",
+  warn: "border-warn-border bg-surface text-fg",
+  danger: "border-danger-border bg-surface text-fg"
+};
+function Toaster({ className, position = "bottom-end" }) {
+  const ctx = React13.useContext(ToastContext);
+  const toasts = ctx ? ctx.toasts : [];
+  const removeToast = ctx ? ctx.removeToast : () => {
+  };
+  const positionClass = position === "bottom-end" ? "bottom-4 end-4" : position === "bottom-start" ? "bottom-4 start-4" : position === "top-end" ? "top-4 end-4" : "top-4 start-4";
+  return /* @__PURE__ */ jsx15(
+    "div",
+    {
+      "data-slot": "toaster",
+      role: "region",
+      "aria-live": "polite",
+      "aria-label": "Notifications",
+      className: cn("yc-Toaster-root fixed z-50 flex flex-col gap-2 max-w-sm w-full pointer-events-none", positionClass, className),
+      children: toasts.map((toast) => /* @__PURE__ */ jsxs8(
+        "div",
+        {
+          role: "status",
+          "data-slot": "toast",
+          "data-variant": toast.variant || "info",
+          className: cn(
+            "yc-Toaster-toast pointer-events-auto flex w-full items-start justify-between rounded-lg p-3 shadow-2 border transition-all duration-normal",
+            variantStyles3[toast.variant || "info"]
+          ),
+          children: [
+            /* @__PURE__ */ jsxs8("div", { className: "flex-1 pe-2", children: [
+              /* @__PURE__ */ jsx15("h4", { className: "yc-Toaster-title text-sm font-medium", "data-slot": "title", children: toast.title }),
+              toast.description && /* @__PURE__ */ jsx15("p", { className: "yc-Toaster-description mt-0.5 text-xs text-fg-muted", "data-slot": "description", children: toast.description })
+            ] }),
+            /* @__PURE__ */ jsx15(
+              "button",
+              {
+                type: "button",
+                "data-slot": "close",
+                className: "yc-Toaster-close text-fg-muted hover:text-fg text-xs p-1",
+                onClick: () => removeToast(toast.id),
+                "aria-label": "Dismiss",
+                children: "\u2715"
+              }
+            )
+          ]
+        },
+        toast.id
+      ))
+    }
+  );
+}
+
+// src/chat/Chat.tsx
+import * as React21 from "react";
+
+// src/chat/ChatMarkdown.tsx
+import * as React16 from "react";
+
+// src/chat/CodeBlock.tsx
+import * as React14 from "react";
+import { jsx as jsx16, jsxs as jsxs9 } from "react/jsx-runtime";
+function CodeBlock({ code, language = "text", className }) {
+  const [copied, setCopied] = React14.useState(false);
+  const handleCopy = async () => {
+    try {
+      await navigator.clipboard.writeText(code);
+      setCopied(true);
+      setTimeout(() => setCopied(false), 2e3);
+    } catch {
+    }
+  };
+  return /* @__PURE__ */ jsxs9(
+    "div",
+    {
+      "data-slot": "code-block",
+      className: cn(
+        "yc-CodeBlock-root my-2 overflow-hidden rounded-lg border border-border bg-surface-2 text-xs font-mono shadow-1",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxs9("div", { className: "flex items-center justify-between border-b border-border bg-surface-3 px-3 py-1.5 text-fg-muted", children: [
+          /* @__PURE__ */ jsx16("span", { className: "font-semibold uppercase tracking-wider text-[11px]", children: language }),
+          /* @__PURE__ */ jsx16(
+            "button",
+            {
+              type: "button",
+              onClick: handleCopy,
+              className: "rounded px-2 py-0.5 text-[11px] transition-colors hover:bg-surface hover:text-fg",
+              "aria-label": "Copy code to clipboard",
+              children: copied ? "Copied!" : "Copy"
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx16("pre", { className: "overflow-x-auto p-3 text-fg leading-relaxed", children: /* @__PURE__ */ jsx16("code", { children: code }) })
+      ]
+    }
+  );
+}
+
+// src/chat/MermaidDiagram.tsx
+import * as React15 from "react";
+import { jsx as jsx17, jsxs as jsxs10 } from "react/jsx-runtime";
+function MermaidDiagram({ chart, className }) {
+  const [showSource, setShowSource] = React15.useState(false);
+  return /* @__PURE__ */ jsxs10(
+    "div",
+    {
+      "data-slot": "mermaid-diagram",
+      className: cn(
+        "yc-MermaidDiagram-root my-3 rounded-lg border border-border bg-surface p-3 text-xs shadow-1",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxs10("div", { className: "flex items-center justify-between border-b border-border pb-2 mb-2 text-fg-muted font-mono", children: [
+          /* @__PURE__ */ jsx17("span", { className: "font-semibold text-fg", children: "Diagram" }),
+          /* @__PURE__ */ jsx17(
+            "button",
+            {
+              type: "button",
+              onClick: () => setShowSource(!showSource),
+              className: "text-[11px] underline hover:text-fg",
+              children: showSource ? "View rendering" : "View syntax"
+            }
+          )
+        ] }),
+        showSource ? /* @__PURE__ */ jsx17("pre", { className: "overflow-x-auto rounded bg-surface-2 p-3 font-mono text-fg", children: /* @__PURE__ */ jsx17("code", { children: chart }) }) : /* @__PURE__ */ jsx17(
+          "div",
+          {
+            "data-slot": "diagram-viewport",
+            className: "yc-MermaidDiagram-viewport flex items-center justify-center p-4 bg-surface-2 rounded overflow-x-auto",
+            children: /* @__PURE__ */ jsx17("pre", { className: "font-mono text-xs text-fg leading-relaxed", children: chart })
+          }
+        )
+      ]
+    }
+  );
+}
+
+// src/chat/ChatMarkdown.tsx
+import { jsx as jsx18 } from "react/jsx-runtime";
+function ChatMarkdown({ content, className }) {
+  const blocks = React16.useMemo(() => {
+    const lines = content.split("\n");
+    const result = [];
+    let currentCode = [];
+    let currentLang = "";
+    let inCode = false;
+    let currentText = [];
+    for (let i = 0; i < lines.length; i++) {
+      const line = lines[i];
+      if (line.startsWith("```")) {
+        if (inCode) {
+          const codeString = currentCode.join("\n");
+          if (currentLang === "mermaid") {
+            result.push({ type: "mermaid", content: codeString });
+          } else {
+            result.push({ type: "code", content: codeString, lang: currentLang });
+          }
+          currentCode = [];
+          currentLang = "";
+          inCode = false;
+        } else {
+          if (currentText.length > 0) {
+            result.push({ type: "text", content: currentText.join("\n") });
+            currentText = [];
+          }
+          inCode = true;
+          currentLang = line.replace("```", "").trim();
+        }
+      } else if (inCode) {
+        currentCode.push(line);
+      } else {
+        currentText.push(line);
+      }
+    }
+    if (inCode && currentCode.length > 0) {
+      result.push({ type: "code", content: currentCode.join("\n"), lang: currentLang });
+    } else if (currentText.length > 0) {
+      result.push({ type: "text", content: currentText.join("\n") });
+    }
+    return result;
+  }, [content]);
+  return /* @__PURE__ */ jsx18(
+    "div",
+    {
+      "data-slot": "chat-markdown",
+      className: cn("yc-ChatMarkdown-root text-sm text-fg space-y-2 leading-relaxed", className),
+      children: blocks.map((b, idx) => {
+        if (b.type === "code") {
+          return /* @__PURE__ */ jsx18(CodeBlock, { code: b.content, language: b.lang }, idx);
+        }
+        if (b.type === "mermaid") {
+          return /* @__PURE__ */ jsx18(MermaidDiagram, { chart: b.content }, idx);
+        }
+        return /* @__PURE__ */ jsx18("div", { className: "whitespace-pre-wrap", children: b.content }, idx);
+      })
+    }
+  );
+}
+
+// src/chat/MessageToolbar.tsx
+import * as React17 from "react";
+import { Fragment, jsx as jsx19, jsxs as jsxs11 } from "react/jsx-runtime";
+function MessageToolbar({
+  content,
+  onRetry,
+  onFeedback,
+  className
+}) {
+  const [copied, setCopied] = React17.useState(false);
+  const [rated, setRated] = React17.useState(null);
+  const handleCopy = async () => {
+    try {
+      await navigator.clipboard.writeText(content);
+      setCopied(true);
+      setTimeout(() => setCopied(false), 2e3);
+    } catch {
+    }
+  };
+  const handleRate = (rating) => {
+    setRated(rating);
+    onFeedback?.(rating);
+  };
+  return /* @__PURE__ */ jsxs11(
+    "div",
+    {
+      "data-slot": "message-toolbar",
+      className: cn(
+        "yc-MessageToolbar-root inline-flex items-center gap-1 rounded-md bg-surface-2 p-0.5 text-xs text-fg-muted border border-border shadow-1",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsx19(
+          "button",
+          {
+            type: "button",
+            onClick: handleCopy,
+            className: "rounded px-1.5 py-0.5 hover:bg-surface hover:text-fg",
+            "aria-label": "Copy message text",
+            children: copied ? "Copied" : "Copy"
+          }
+        ),
+        onRetry && /* @__PURE__ */ jsx19(
+          "button",
+          {
+            type: "button",
+            onClick: onRetry,
+            className: "rounded px-1.5 py-0.5 hover:bg-surface hover:text-fg",
+            "aria-label": "Retry message generation",
+            children: "Retry"
+          }
+        ),
+        onFeedback && /* @__PURE__ */ jsxs11(Fragment, { children: [
+          /* @__PURE__ */ jsx19(
+            "button",
+            {
+              type: "button",
+              onClick: () => handleRate("positive"),
+              className: cn(
+                "rounded px-1.5 py-0.5 hover:bg-surface hover:text-fg",
+                rated === "positive" && "text-primary font-bold"
+              ),
+              "aria-label": "Helpful",
+              children: "\u{1F44D}"
+            }
+          ),
+          /* @__PURE__ */ jsx19(
+            "button",
+            {
+              type: "button",
+              onClick: () => handleRate("negative"),
+              className: cn(
+                "rounded px-1.5 py-0.5 hover:bg-surface hover:text-fg",
+                rated === "negative" && "text-danger-fg font-bold"
+              ),
+              "aria-label": "Not helpful",
+              children: "\u{1F44E}"
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+
+// src/chat/ThinkingIndicator.tsx
+import * as React18 from "react";
+import { jsx as jsx20, jsxs as jsxs12 } from "react/jsx-runtime";
+function ThinkingIndicator({
+  label = "Thinking...",
+  reasoning,
+  className
+}) {
+  const [open, setOpen] = React18.useState(false);
+  return /* @__PURE__ */ jsxs12(
+    "div",
+    {
+      "data-slot": "thinking-indicator",
+      className: cn(
+        "yc-ThinkingIndicator-root inline-flex flex-col gap-1 text-xs text-fg-muted",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxs12("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsxs12("span", { className: "flex gap-1 items-center", children: [
+            /* @__PURE__ */ jsx20("span", { className: "h-1.5 w-1.5 animate-bounce rounded-full bg-fg-muted" }),
+            /* @__PURE__ */ jsx20("span", { className: "h-1.5 w-1.5 animate-bounce [animation-delay:0.2s] rounded-full bg-fg-muted" }),
+            /* @__PURE__ */ jsx20("span", { className: "h-1.5 w-1.5 animate-bounce [animation-delay:0.4s] rounded-full bg-fg-muted" })
+          ] }),
+          /* @__PURE__ */ jsx20("span", { className: "font-medium", children: label }),
+          reasoning && /* @__PURE__ */ jsx20(
+            "button",
+            {
+              type: "button",
+              onClick: () => setOpen(!open),
+              className: "text-[11px] underline hover:text-fg",
+              children: open ? "Hide details" : "Show details"
+            }
+          )
+        ] }),
+        open && reasoning && /* @__PURE__ */ jsx20("div", { className: "mt-1 rounded border border-border bg-surface-2 p-2 font-mono text-[11px] text-fg whitespace-pre-wrap", children: reasoning })
+      ]
+    }
+  );
+}
+
+// src/chat/ApprovalCard.tsx
+import * as React19 from "react";
+import { jsx as jsx21, jsxs as jsxs13 } from "react/jsx-runtime";
+var levelBadgeVariant = {
+  info: "info",
+  warn: "warn",
+  danger: "danger"
+};
+var levelBorderStyles = {
+  info: "border-info-border bg-info-bg/30",
+  warn: "border-warn-border bg-warn-bg/30",
+  danger: "border-danger-border bg-danger-bg/30"
+};
+function ApprovalCard({
+  id,
+  level,
+  label,
+  details,
+  onDecide,
+  status = "pending",
+  className
+}) {
+  const [loading, setLoading] = React19.useState(false);
+  const [currentStatus, setCurrentStatus] = React19.useState(status);
+  const handleDecision = async (decision) => {
+    try {
+      setLoading(true);
+      if (onDecide) {
+        await onDecide(id, decision);
+      } else {
+        await fetch(`/api/v1/approvals/${encodeURIComponent(id)}/decide`, {
+          method: "POST",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify({ decision })
+        });
+      }
+      setCurrentStatus(decision);
+    } catch (err) {
+      console.error("Failed to submit approval decision:", err);
+    } finally {
+      setLoading(false);
+    }
+  };
+  return /* @__PURE__ */ jsxs13(
+    "div",
+    {
+      "data-slot": "approval-card",
+      "data-risk-level": level,
+      className: cn(
+        "yc-ApprovalCard-root rounded-lg border p-4 shadow-1 transition-colors duration-fast",
+        levelBorderStyles[level],
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxs13("div", { className: "flex items-center justify-between gap-2 pb-2", children: [
+          /* @__PURE__ */ jsxs13("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ jsx21(Badge, { variant: levelBadgeVariant[level], children: level.toUpperCase() }),
+            /* @__PURE__ */ jsx21("span", { className: "yc-ApprovalCard-title text-sm font-semibold text-fg", "data-slot": "title", children: label })
+          ] }),
+          currentStatus !== "pending" && /* @__PURE__ */ jsx21(Badge, { variant: currentStatus === "approved" ? "success" : "danger", children: currentStatus === "approved" ? "Approved" : "Rejected" })
+        ] }),
+        details && Object.keys(details).length > 0 && /* @__PURE__ */ jsx21("div", { className: "yc-ApprovalCard-details mt-2 rounded bg-surface/80 p-2.5 text-xs text-fg-muted font-mono", "data-slot": "details", children: /* @__PURE__ */ jsx21("pre", { className: "overflow-x-auto whitespace-pre-wrap", children: JSON.stringify(details, null, 2) }) }),
+        currentStatus === "pending" && /* @__PURE__ */ jsxs13("div", { className: "yc-ApprovalCard-actions mt-3 flex items-center justify-end gap-2", "data-slot": "actions", children: [
+          /* @__PURE__ */ jsx21(
+            Button,
+            {
+              size: "sm",
+              variant: "ghost",
+              disabled: loading,
+              onClick: () => handleDecision("rejected"),
+              children: "Reject"
+            }
+          ),
+          /* @__PURE__ */ jsx21(
+            Button,
+            {
+              size: "sm",
+              variant: level === "danger" ? "danger" : "primary",
+              loading,
+              onClick: () => handleDecision("approved"),
+              children: "Approve & Continue"
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+
+// src/chat/ToolTraceCard.tsx
+import * as React20 from "react";
+import { jsx as jsx22, jsxs as jsxs14 } from "react/jsx-runtime";
+function ToolTraceCard({
+  trace,
+  className,
+  defaultExpanded = false
+}) {
+  const [expanded, setExpanded] = React20.useState(defaultExpanded);
+  const statusVariant = {
+    running: "info",
+    success: "success",
+    error: "danger"
+  };
+  return /* @__PURE__ */ jsxs14(
+    "div",
+    {
+      "data-slot": "tool-trace-card",
+      className: cn(
+        "yc-ToolTraceCard-root my-1.5 rounded-lg border border-border bg-surface text-fg shadow-1 text-xs",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxs14(
+          "button",
+          {
+            type: "button",
+            onClick: () => setExpanded(!expanded),
+            "data-slot": "header",
+            className: "yc-ToolTraceCard-header flex w-full items-center justify-between p-2.5 text-start font-mono transition-colors hover:bg-surface-2",
+            children: [
+              /* @__PURE__ */ jsxs14("div", { className: "flex items-center gap-2", children: [
+                /* @__PURE__ */ jsx22("span", { className: "font-semibold text-fg", children: trace.toolName }),
+                /* @__PURE__ */ jsx22(Badge, { variant: statusVariant[trace.status], children: trace.status }),
+                trace.durationMs !== void 0 && /* @__PURE__ */ jsxs14("span", { className: "text-fg-muted", children: [
+                  "(",
+                  trace.durationMs,
+                  "ms)"
+                ] })
+              ] }),
+              /* @__PURE__ */ jsx22("span", { className: "text-fg-muted", children: expanded ? "\u25B2" : "\u25BC" })
+            ]
+          }
+        ),
+        expanded && /* @__PURE__ */ jsxs14("div", { "data-slot": "details", className: "yc-ToolTraceCard-details border-t border-border p-2.5 font-mono space-y-2", children: [
+          trace.input !== void 0 && /* @__PURE__ */ jsxs14("div", { children: [
+            /* @__PURE__ */ jsx22("div", { className: "text-fg-muted text-[10px] uppercase font-semibold", children: "Input" }),
+            /* @__PURE__ */ jsx22("pre", { className: "mt-1 max-h-40 overflow-auto rounded bg-surface-2 p-2 text-fg", children: typeof trace.input === "string" ? trace.input : JSON.stringify(trace.input, null, 2) })
+          ] }),
+          trace.output !== void 0 && /* @__PURE__ */ jsxs14("div", { children: [
+            /* @__PURE__ */ jsx22("div", { className: "text-fg-muted text-[10px] uppercase font-semibold", children: "Output" }),
+            /* @__PURE__ */ jsx22("pre", { className: "mt-1 max-h-40 overflow-auto rounded bg-surface-2 p-2 text-fg", children: typeof trace.output === "string" ? trace.output : JSON.stringify(trace.output, null, 2) })
+          ] })
+        ] })
+      ]
+    }
+  );
+}
+
+// src/chat/ExecutionPlanCard.tsx
+import { jsx as jsx23, jsxs as jsxs15 } from "react/jsx-runtime";
+function ExecutionPlanCard({
+  steps,
+  className,
+  title = "Execution Plan"
+}) {
+  if (!steps || steps.length === 0) return null;
+  return /* @__PURE__ */ jsxs15(
+    "div",
+    {
+      "data-slot": "execution-plan-card",
+      className: cn(
+        "yc-ExecutionPlanCard-root my-2 rounded-lg border border-border bg-surface p-3 text-xs shadow-1",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxs15("div", { className: "font-semibold text-fg pb-2 flex items-center justify-between", children: [
+          /* @__PURE__ */ jsx23("span", { children: title }),
+          /* @__PURE__ */ jsxs15("span", { className: "text-fg-muted", children: [
+            steps.filter((s) => s.status === "completed").length,
+            "/",
+            steps.length
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx23("div", { className: "space-y-1.5", children: steps.map((step, idx) => {
+          const isDone = step.status === "completed";
+          const isRunning = step.status === "running";
+          const isFailed = step.status === "failed";
+          return /* @__PURE__ */ jsxs15(
+            "div",
+            {
+              "data-slot": "step",
+              "data-status": step.status,
+              className: "yc-ExecutionPlanCard-step flex items-start gap-2",
+              children: [
+                /* @__PURE__ */ jsx23(
+                  "span",
+                  {
+                    className: cn(
+                      "mt-0.5 inline-flex h-4 w-4 shrink-0 items-center justify-center rounded-full text-[10px] font-bold",
+                      isDone ? "bg-success-fg text-white" : isRunning ? "animate-spin border-2 border-primary border-t-transparent" : isFailed ? "bg-danger-fg text-white" : "bg-surface-3 text-fg-muted"
+                    ),
+                    children: isDone ? "\u2713" : isFailed ? "\u2715" : isRunning ? "" : idx + 1
+                  }
+                ),
+                /* @__PURE__ */ jsx23(
+                  "span",
+                  {
+                    className: cn(
+                      "flex-1 text-fg",
+                      isDone && "line-through text-fg-muted",
+                      isRunning && "font-medium text-primary"
+                    ),
+                    children: step.description
+                  }
+                )
+              ]
+            },
+            step.id || idx
+          );
+        }) })
+      ]
+    }
+  );
+}
+
+// src/chat/Chat.tsx
+import { Fragment as Fragment2, jsx as jsx24, jsxs as jsxs16 } from "react/jsx-runtime";
+var ChatContext = React21.createContext(null);
+function useChatContext() {
+  const ctx = React21.useContext(ChatContext);
+  if (!ctx) throw new Error("Chat compound components must be rendered inside <Chat.Root>");
+  return ctx;
+}
+function ChatRoot({
+  messages,
+  onSendMessage,
+  loading = false,
+  slotHooks,
+  children,
+  className
+}) {
+  const [activeAttachments, setActiveAttachments] = React21.useState([]);
+  return /* @__PURE__ */ jsx24(
+    ChatContext.Provider,
+    {
+      value: {
+        messages,
+        onSendMessage,
+        loading,
+        activeAttachments,
+        setActiveAttachments,
+        slotHooks
+      },
+      children: /* @__PURE__ */ jsx24(
+        "div",
+        {
+          "data-slot": "chat-root",
+          className: cn("yc-Chat-root flex flex-col h-full w-full bg-surface text-fg", className),
+          children
+        }
+      )
+    }
+  );
+}
+function ChatThread({
+  className,
+  emptyTitle = "How can I assist you today?",
+  emptyDescription = "Start a conversation by typing a message below."
+}) {
+  const { messages } = useChatContext();
+  const threadEndRef = React21.useRef(null);
+  React21.useEffect(() => {
+    threadEndRef.current?.scrollIntoView({ behavior: "smooth" });
+  }, [messages]);
+  return /* @__PURE__ */ jsxs16(
+    "div",
+    {
+      "data-slot": "chat-thread",
+      className: cn("yc-Chat-thread flex-1 overflow-y-auto p-4 space-y-4", className),
+      children: [
+        messages.length === 0 ? /* @__PURE__ */ jsx24(EmptyState, { title: emptyTitle, description: emptyDescription, className: "h-full" }) : messages.map((msg) => /* @__PURE__ */ jsx24(ChatMessageItem, { message: msg }, msg.id)),
+        /* @__PURE__ */ jsx24("div", { ref: threadEndRef })
+      ]
+    }
+  );
+}
+function ChatMessageItem({ message, className }) {
+  const { slotHooks } = useChatContext();
+  const isUser = message.role === "user";
+  const isSystem = message.role === "system";
+  if (slotHooks?.messageRenderer) {
+    const custom = slotHooks.messageRenderer(message);
+    if (custom) return /* @__PURE__ */ jsx24(Fragment2, { children: custom });
+  }
+  return /* @__PURE__ */ jsxs16(
+    "div",
+    {
+      "data-slot": "chat-message",
+      "data-role": message.role,
+      className: cn(
+        "yc-Chat-message group flex w-full gap-3",
+        isUser ? "justify-end" : "justify-start",
+        className
+      ),
+      children: [
+        !isUser && /* @__PURE__ */ jsx24(Avatar, { size: "sm", className: "mt-1", children: message.avatarUrl ? /* @__PURE__ */ jsx24(AvatarImage, { src: message.avatarUrl, alt: message.authorName || "Assistant" }) : /* @__PURE__ */ jsx24(AvatarFallback, { children: (message.authorName || "AI").substring(0, 2).toUpperCase() }) }),
+        /* @__PURE__ */ jsxs16(
+          "div",
+          {
+            className: cn(
+              "flex flex-col max-w-[80%] gap-1.5",
+              isUser ? "items-end" : "items-start"
+            ),
+            children: [
+              /* @__PURE__ */ jsxs16("div", { className: "flex items-center gap-2 text-xs text-fg-muted", children: [
+                /* @__PURE__ */ jsx24("span", { className: "font-semibold", children: message.authorName || (isUser ? "You" : "Assistant") }),
+                /* @__PURE__ */ jsx24("span", { children: message.createdAt })
+              ] }),
+              /* @__PURE__ */ jsxs16(
+                "div",
+                {
+                  "data-slot": "message-bubble",
+                  className: cn(
+                    "yc-Chat-bubble rounded-2xl px-4 py-2.5 shadow-1 text-sm leading-relaxed",
+                    isUser ? "bg-primary text-primary-fg rounded-be-sm" : isSystem ? "bg-surface-2 text-fg-muted border border-border" : "bg-surface-2 text-fg rounded-bs-sm border border-border"
+                  ),
+                  children: [
+                    message.reasoning && /* @__PURE__ */ jsx24("div", { className: "mb-2", children: /* @__PURE__ */ jsx24(ThinkingIndicator, { reasoning: message.reasoning }) }),
+                    isUser ? /* @__PURE__ */ jsx24("div", { className: "whitespace-pre-wrap", children: message.content }) : /* @__PURE__ */ jsx24(ChatMarkdown, { content: message.content }),
+                    message.executionPlan && message.executionPlan.length > 0 && /* @__PURE__ */ jsx24(ExecutionPlanCard, { steps: message.executionPlan }),
+                    message.toolTraces && message.toolTraces.length > 0 && /* @__PURE__ */ jsx24("div", { className: "mt-2 space-y-1", children: message.toolTraces.map((trace) => /* @__PURE__ */ jsx24(ToolTraceCard, { trace }, trace.id)) }),
+                    message.approval && /* @__PURE__ */ jsx24("div", { className: "mt-2", children: /* @__PURE__ */ jsx24(
+                      ApprovalCard,
+                      {
+                        id: message.approval.id,
+                        level: message.approval.level,
+                        label: message.approval.label,
+                        details: message.approval.details,
+                        status: message.approval.status
+                      }
+                    ) })
+                  ]
+                }
+              ),
+              !isUser && /* @__PURE__ */ jsx24("div", { className: "opacity-0 group-hover:opacity-100 transition-opacity duration-fast", children: /* @__PURE__ */ jsx24(MessageToolbar, { content: message.content }) })
+            ]
+          }
+        ),
+        isUser && /* @__PURE__ */ jsx24(Avatar, { size: "sm", className: "mt-1", children: message.avatarUrl ? /* @__PURE__ */ jsx24(AvatarImage, { src: message.avatarUrl, alt: "User" }) : /* @__PURE__ */ jsx24(AvatarFallback, { children: "ME" }) })
+      ]
+    }
+  );
+}
+function ChatAttachments({ className }) {
+  const { activeAttachments, setActiveAttachments } = useChatContext();
+  if (activeAttachments.length === 0) return null;
+  return /* @__PURE__ */ jsx24(
+    "div",
+    {
+      "data-slot": "chat-attachments",
+      className: cn("yc-Chat-attachments flex flex-wrap gap-2 px-4 py-2 bg-surface-2 border-t border-border", className),
+      children: activeAttachments.map((att) => /* @__PURE__ */ jsxs16(
+        "div",
+        {
+          "data-slot": "attachment-item",
+          className: "yc-Chat-attachment flex items-center gap-1.5 rounded-md bg-surface px-2.5 py-1 text-xs border border-border shadow-1",
+          children: [
+            /* @__PURE__ */ jsx24("span", { className: "truncate max-w-[150px]", children: att.name }),
+            /* @__PURE__ */ jsx24(
+              "button",
+              {
+                type: "button",
+                className: "text-fg-muted hover:text-danger-fg",
+                onClick: () => setActiveAttachments((prev) => prev.filter((a) => a.id !== att.id)),
+                "aria-label": `Remove ${att.name}`,
+                children: "\u2715"
+              }
+            )
+          ]
+        },
+        att.id
+      ))
+    }
+  );
+}
+function ChatComposer({
+  placeholder = "Type a message...",
+  className
+}) {
+  const { onSendMessage, loading, activeAttachments, setActiveAttachments, slotHooks } = useChatContext();
+  const [text, setText] = React21.useState("");
+  const fileInputRef = React21.useRef(null);
+  const handleSubmit = async (e) => {
+    e?.preventDefault();
+    const trimmed = text.trim();
+    if (!trimmed && activeAttachments.length === 0) return;
+    if (loading) return;
+    if (slotHooks?.beforeSend) {
+      const result = await slotHooks.beforeSend(trimmed, activeAttachments);
+      if (result === false) return;
+      if (typeof result === "string") {
+        await onSendMessage(result, activeAttachments);
+        setText("");
+        setActiveAttachments([]);
+        return;
+      }
+    }
+    await onSendMessage(trimmed, activeAttachments);
+    setText("");
+    setActiveAttachments([]);
+  };
+  const handleKeyDown = (e) => {
+    if (e.key === "Enter" && !e.shiftKey) {
+      e.preventDefault();
+      handleSubmit();
+    }
+  };
+  const handleFileChange = (e) => {
+    const files = e.target.files;
+    if (!files) return;
+    const newAttachments = Array.from(files).map((f) => ({
+      id: Math.random().toString(36).substring(2, 9),
+      name: f.name,
+      mimeType: f.type,
+      sizeBytes: f.size
+    }));
+    setActiveAttachments((prev) => [...prev, ...newAttachments]);
+  };
+  return /* @__PURE__ */ jsxs16(
+    "form",
+    {
+      "data-slot": "chat-composer",
+      onSubmit: handleSubmit,
+      className: cn(
+        "yc-Chat-composer flex flex-col gap-2 p-3 border-t border-border bg-surface",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsx24(ChatAttachments, {}),
+        /* @__PURE__ */ jsxs16("div", { className: "flex items-end gap-2", children: [
+          /* @__PURE__ */ jsx24(
+            "input",
+            {
+              ref: fileInputRef,
+              type: "file",
+              multiple: true,
+              className: "hidden",
+              onChange: handleFileChange
+            }
+          ),
+          /* @__PURE__ */ jsx24(
+            Button,
+            {
+              type: "button",
+              variant: "ghost",
+              size: "sm",
+              onClick: () => fileInputRef.current?.click(),
+              "aria-label": "Attach file",
+              className: "h-10 px-2.5 text-fg-muted",
+              children: "\u{1F4CE}"
+            }
+          ),
+          slotHooks?.composerAction,
+          /* @__PURE__ */ jsx24(
+            "textarea",
+            {
+              value: text,
+              onChange: (e) => setText(e.target.value),
+              onKeyDown: handleKeyDown,
+              placeholder,
+              rows: 1,
+              className: "flex-1 max-h-32 min-h-[44px] resize-none rounded-lg border border-border bg-surface-2 p-2.5 text-sm text-fg placeholder:text-fg-muted focus:border-primary focus:outline-none focus:ring-1 focus:ring-primary",
+              "data-slot": "input"
+            }
+          ),
+          /* @__PURE__ */ jsx24(
+            Button,
+            {
+              type: "submit",
+              variant: "primary",
+              size: "sm",
+              disabled: loading || !text.trim() && activeAttachments.length === 0,
+              loading,
+              className: "h-10 px-4",
+              children: "Send"
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+var Chat = {
+  Root: ChatRoot,
+  Thread: ChatThread,
+  Message: ChatMessageItem,
+  Composer: ChatComposer,
+  Attachments: ChatAttachments
+};
+
+// src/chat/ChatConnected.tsx
+import * as React22 from "react";
+import { jsx as jsx25, jsxs as jsxs17 } from "react/jsx-runtime";
+function ChatConnected({
+  threadId,
+  initialMessages = [],
+  slotHooks,
+  className,
+  onMessageSent
+}) {
+  const [messages, setMessages] = React22.useState(initialMessages);
+  const [loading, setLoading] = React22.useState(false);
+  const handleSendMessage = async (content, attachments) => {
+    const userMessage = {
+      id: Math.random().toString(36).substring(2, 9),
+      role: "user",
+      content,
+      createdAt: (/* @__PURE__ */ new Date()).toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" }),
+      attachments
+    };
+    setMessages((prev) => [...prev, userMessage]);
+    onMessageSent?.(userMessage);
+    setLoading(true);
+    try {
+      const res = await fetch(`/api/v1/threads/${encodeURIComponent(threadId)}/messages`, {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ content, attachments })
+      });
+      if (!res.ok) {
+        throw new Error(`Server returned status ${res.status}`);
+      }
+      const data = await res.json();
+      const assistantMessage = {
+        id: data.id || Math.random().toString(36).substring(2, 9),
+        role: "assistant",
+        content: data.content || data.reply || "",
+        createdAt: (/* @__PURE__ */ new Date()).toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" }),
+        toolTraces: data.toolTraces,
+        executionPlan: data.executionPlan,
+        approval: data.approval
+      };
+      setMessages((prev) => [...prev, assistantMessage]);
+    } catch (err) {
+      console.error("Failed to send message:", err);
+      const errorMessage = {
+        id: Math.random().toString(36).substring(2, 9),
+        role: "system",
+        content: "Unable to connect to the assistant. Please try again.",
+        createdAt: (/* @__PURE__ */ new Date()).toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" }),
+        status: "error"
+      };
+      setMessages((prev) => [...prev, errorMessage]);
+    } finally {
+      setLoading(false);
+    }
+  };
+  return /* @__PURE__ */ jsxs17(
+    ChatRoot,
+    {
+      messages,
+      onSendMessage: handleSendMessage,
+      loading,
+      slotHooks,
+      className,
+      children: [
+        /* @__PURE__ */ jsx25(ChatThread, {}),
+        /* @__PURE__ */ jsx25(ChatComposer, {})
+      ]
+    }
+  );
+}
+
+// src/chat/ActivityLogDrawer.tsx
+import { jsx as jsx26, jsxs as jsxs18 } from "react/jsx-runtime";
+function ActivityLogDrawer({
+  traces,
+  open,
+  onOpenChange,
+  trigger
+}) {
+  return /* @__PURE__ */ jsxs18(Sheet, { open, onOpenChange, children: [
+    trigger && /* @__PURE__ */ jsx26(SheetTrigger, { asChild: true, children: trigger }),
+    /* @__PURE__ */ jsxs18(SheetContent, { side: "end", className: "yc-ActivityLogDrawer-content flex flex-col gap-4", children: [
+      /* @__PURE__ */ jsxs18(SheetHeader, { children: [
+        /* @__PURE__ */ jsx26(SheetTitle, { children: "Activity Log" }),
+        /* @__PURE__ */ jsx26(SheetDescription, { children: "Audit log of agent execution traces and tool calls." })
+      ] }),
+      /* @__PURE__ */ jsx26(
+        "div",
+        {
+          "data-slot": "activity-log-drawer",
+          className: "yc-ActivityLogDrawer-root flex-1 overflow-y-auto space-y-2 pe-1",
+          children: traces.length === 0 ? /* @__PURE__ */ jsx26("div", { className: "text-center text-xs text-fg-muted py-8", children: "No activity recorded for this session." }) : traces.map((trace) => /* @__PURE__ */ jsx26(ToolTraceCard, { trace, defaultExpanded: false }, trace.id))
+        }
+      )
+    ] })
+  ] });
+}
+
+// src/chat/ModelSelector.tsx
+import { jsx as jsx27, jsxs as jsxs19 } from "react/jsx-runtime";
+function ModelSelector({
+  models,
+  selectedModelId,
+  onSelectModel,
+  className
+}) {
+  const currentModel = models.find((m) => m.id === selectedModelId) || models[0];
+  return /* @__PURE__ */ jsx27(
+    "div",
+    {
+      "data-slot": "model-selector",
+      className: cn("yc-ModelSelector-root inline-block", className),
+      children: /* @__PURE__ */ jsxs19(Menu, { children: [
+        /* @__PURE__ */ jsxs19(MenuTrigger, { className: "rounded-md border border-border bg-surface px-2.5 py-1 text-xs font-medium text-fg shadow-1 hover:bg-surface-2", children: [
+          /* @__PURE__ */ jsx27("span", { className: "me-1 text-fg-muted font-normal", children: "Model:" }),
+          /* @__PURE__ */ jsx27("span", { children: currentModel ? currentModel.name : "Select model" }),
+          /* @__PURE__ */ jsx27("span", { className: "ms-1.5 text-fg-muted", children: "\u25BE" })
+        ] }),
+        /* @__PURE__ */ jsx27(MenuContent, { align: "start", children: models.map((m) => /* @__PURE__ */ jsx27(
+          MenuItem,
+          {
+            onClick: () => onSelectModel?.(m.id),
+            className: cn(m.id === currentModel?.id && "font-semibold text-primary"),
+            children: /* @__PURE__ */ jsxs19("div", { className: "flex flex-col text-start", children: [
+              /* @__PURE__ */ jsx27("span", { children: m.name }),
+              m.provider && /* @__PURE__ */ jsx27("span", { className: "text-[10px] text-fg-muted font-normal", children: m.provider })
+            ] })
+          },
+          m.id
+        )) })
+      ] })
+    }
+  );
+}
+
+// src/notes/RecordSearch.tsx
+import { jsx as jsx28, jsxs as jsxs20 } from "react/jsx-runtime";
+function RecordSearch({
+  searchQuery,
+  onSearchChange,
+  selectedFilter,
+  onFilterChange,
+  filterOptions = [
+    { id: "all", label: "All Records" },
+    { id: "pinned", label: "Pinned" },
+    { id: "recent", label: "Recent" }
+  ],
+  placeholder = "Search records...",
+  className
+}) {
+  return /* @__PURE__ */ jsxs20(
+    "div",
+    {
+      "data-slot": "record-search",
+      className: cn("yc-RecordSearch-root flex flex-col gap-2.5", className),
+      children: [
+        /* @__PURE__ */ jsxs20("div", { className: "relative flex items-center", children: [
+          /* @__PURE__ */ jsx28("span", { className: "absolute start-3 text-fg-muted text-sm", children: "\u{1F50D}" }),
+          /* @__PURE__ */ jsx28(
+            "input",
+            {
+              type: "text",
+              value: searchQuery,
+              onChange: (e) => onSearchChange(e.target.value),
+              placeholder,
+              className: "w-full rounded-lg border border-border bg-surface-2 py-2 ps-9 pe-3 text-sm text-fg placeholder:text-fg-muted focus:border-primary focus:outline-none focus:ring-1 focus:ring-primary",
+              "data-slot": "search-input"
+            }
+          ),
+          searchQuery && /* @__PURE__ */ jsx28(
+            "button",
+            {
+              type: "button",
+              onClick: () => onSearchChange(""),
+              className: "absolute end-3 text-fg-muted hover:text-fg text-xs",
+              "aria-label": "Clear search",
+              children: "\u2715"
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx28(
+          "div",
+          {
+            "data-slot": "filter-chips",
+            className: "yc-RecordSearch-chips flex flex-wrap gap-1.5",
+            children: filterOptions.map((opt) => {
+              const isSelected = opt.id === selectedFilter;
+              return /* @__PURE__ */ jsxs20(
+                Chip,
+                {
+                  selected: isSelected,
+                  onClick: () => onFilterChange(opt.id),
+                  children: [
+                    opt.label,
+                    opt.count !== void 0 && /* @__PURE__ */ jsxs20("span", { className: "ms-1.5 text-xs text-fg-muted font-normal", children: [
+                      "(",
+                      opt.count,
+                      ")"
+                    ] })
+                  ]
+                },
+                opt.id
+              );
+            })
+          }
+        )
+      ]
+    }
+  );
+}
+
+// src/notes/NotesList.tsx
+import { jsx as jsx29, jsxs as jsxs21 } from "react/jsx-runtime";
+function NotesList({
+  notes,
+  selectedNoteId,
+  onSelectNote,
+  className,
+  emptyTitle = "No notes found",
+  emptyDescription = "Create a new note or adjust your search filter."
+}) {
+  if (notes.length === 0) {
+    return /* @__PURE__ */ jsx29(EmptyState, { title: emptyTitle, description: emptyDescription, className });
+  }
+  return /* @__PURE__ */ jsx29(
+    "div",
+    {
+      "data-slot": "notes-list",
+      className: cn("yc-NotesList-root flex flex-col gap-2 overflow-y-auto", className),
+      children: notes.map((note) => {
+        const isSelected = note.id === selectedNoteId;
+        return /* @__PURE__ */ jsxs21(
+          "button",
+          {
+            type: "button",
+            onClick: () => onSelectNote(note),
+            "data-slot": "note-item",
+            "data-selected": isSelected ? "true" : void 0,
+            className: cn(
+              "yc-NotesList-item flex flex-col text-start rounded-lg border p-3 transition-colors duration-fast shadow-1",
+              isSelected ? "border-primary bg-primary-subtle/20" : "border-border bg-surface hover:bg-surface-2"
+            ),
+            children: [
+              /* @__PURE__ */ jsxs21("div", { className: "flex items-center justify-between gap-2 pb-1", children: [
+                /* @__PURE__ */ jsxs21("span", { className: "font-semibold text-sm text-fg truncate", children: [
+                  note.pinned && /* @__PURE__ */ jsx29("span", { className: "me-1 text-primary", children: "\u{1F4CC}" }),
+                  note.title || "Untitled Note"
+                ] }),
+                /* @__PURE__ */ jsx29("span", { className: "text-[11px] text-fg-muted shrink-0", children: note.updatedAt })
+              ] }),
+              /* @__PURE__ */ jsx29("p", { className: "text-xs text-fg-muted line-clamp-2 leading-relaxed", children: note.content || "No content" }),
+              note.tags && note.tags.length > 0 && /* @__PURE__ */ jsx29("div", { className: "mt-2 flex flex-wrap gap-1", children: note.tags.map((tag) => /* @__PURE__ */ jsx29(Badge, { variant: "neutral", children: tag }, tag)) })
+            ]
+          },
+          note.id
+        );
+      })
+    }
+  );
+}
+
+// src/notes/NoteView.tsx
+import { jsx as jsx30, jsxs as jsxs22 } from "react/jsx-runtime";
+function NoteView({
+  note,
+  onEdit,
+  onDelete,
+  onTogglePin,
+  className
+}) {
+  return /* @__PURE__ */ jsxs22(
+    "div",
+    {
+      "data-slot": "note-view",
+      className: cn(
+        "yc-NoteView-root flex flex-col h-full rounded-lg border border-border bg-surface p-6 shadow-1",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxs22("div", { className: "flex items-start justify-between gap-4 border-b border-border pb-4", children: [
+          /* @__PURE__ */ jsxs22("div", { children: [
+            /* @__PURE__ */ jsxs22("h2", { className: "yc-NoteView-title text-xl font-bold text-fg flex items-center gap-2", children: [
+              note.pinned && /* @__PURE__ */ jsx30("span", { className: "text-primary text-base", children: "\u{1F4CC}" }),
+              note.title || "Untitled Note"
+            ] }),
+            /* @__PURE__ */ jsxs22("div", { className: "mt-1 flex items-center gap-3 text-xs text-fg-muted", children: [
+              /* @__PURE__ */ jsxs22("span", { children: [
+                "Updated ",
+                note.updatedAt
+              ] }),
+              /* @__PURE__ */ jsxs22("span", { children: [
+                "Created ",
+                note.createdAt
+              ] })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs22("div", { className: "flex items-center gap-2", children: [
+            onTogglePin && /* @__PURE__ */ jsx30(
+              Button,
+              {
+                size: "sm",
+                variant: "ghost",
+                onClick: () => onTogglePin(note.id),
+                "aria-label": note.pinned ? "Unpin note" : "Pin note",
+                children: note.pinned ? "Unpin" : "Pin"
+              }
+            ),
+            onEdit && /* @__PURE__ */ jsx30(Button, { size: "sm", variant: "secondary", onClick: () => onEdit(note), children: "Edit" }),
+            onDelete && /* @__PURE__ */ jsx30(Button, { size: "sm", variant: "danger", onClick: () => onDelete(note.id), children: "Delete" })
+          ] })
+        ] }),
+        note.tags && note.tags.length > 0 && /* @__PURE__ */ jsx30("div", { className: "mt-3 flex flex-wrap gap-1.5 pb-2", children: note.tags.map((tag) => /* @__PURE__ */ jsx30(Badge, { variant: "neutral", children: tag }, tag)) }),
+        /* @__PURE__ */ jsx30(
+          "div",
+          {
+            "data-slot": "note-content",
+            className: "yc-NoteView-content mt-4 flex-1 overflow-y-auto text-sm text-fg leading-relaxed whitespace-pre-wrap",
+            children: note.content
+          }
+        )
+      ]
+    }
+  );
+}
+
+// src/calendar/Calendar.tsx
+import * as React23 from "react";
+import { jsx as jsx31, jsxs as jsxs23 } from "react/jsx-runtime";
+function Calendar({
+  events,
+  selectedDate = /* @__PURE__ */ new Date(),
+  onSelectDate,
+  onSelectEvent,
+  viewMode = "month",
+  onViewModeChange,
+  className
+}) {
+  const [currentDate, setCurrentDate] = React23.useState(selectedDate);
+  const [currentView, setCurrentView] = React23.useState(viewMode);
+  const activeView = onViewModeChange ? viewMode : currentView;
+  const setView = (v) => {
+    setCurrentView(v);
+    onViewModeChange?.(v);
+  };
+  const handlePrev = () => {
+    const next = new Date(currentDate);
+    if (activeView === "month") {
+      next.setMonth(next.getMonth() - 1);
+    } else if (activeView === "week") {
+      next.setDate(next.getDate() - 7);
+    } else {
+      next.setDate(next.getDate() - 1);
+    }
+    setCurrentDate(next);
+    onSelectDate?.(next);
+  };
+  const handleNext = () => {
+    const next = new Date(currentDate);
+    if (activeView === "month") {
+      next.setMonth(next.getMonth() + 1);
+    } else if (activeView === "week") {
+      next.setDate(next.getDate() + 7);
+    } else {
+      next.setDate(next.getDate() + 1);
+    }
+    setCurrentDate(next);
+    onSelectDate?.(next);
+  };
+  const handleToday = () => {
+    const today = /* @__PURE__ */ new Date();
+    setCurrentDate(today);
+    onSelectDate?.(today);
+  };
+  const monthName = currentDate.toLocaleString("default", { month: "long", year: "numeric" });
+  const monthDays = React23.useMemo(() => {
+    const year = currentDate.getFullYear();
+    const month = currentDate.getMonth();
+    const firstDayIndex = new Date(year, month, 1).getDay();
+    const daysCount = new Date(year, month + 1, 0).getDate();
+    const days = [];
+    const prevMonthDaysCount = new Date(year, month, 0).getDate();
+    for (let i = firstDayIndex - 1; i >= 0; i--) {
+      days.push({
+        dayNumber: prevMonthDaysCount - i,
+        date: new Date(year, month - 1, prevMonthDaysCount - i),
+        isCurrentMonth: false
+      });
+    }
+    for (let i = 1; i <= daysCount; i++) {
+      days.push({
+        dayNumber: i,
+        date: new Date(year, month, i),
+        isCurrentMonth: true
+      });
+    }
+    return days;
+  }, [currentDate]);
+  return /* @__PURE__ */ jsxs23(
+    "div",
+    {
+      "data-slot": "calendar",
+      "data-view": activeView,
+      className: cn(
+        "yc-Calendar-root flex flex-col rounded-xl border border-border bg-surface p-4 shadow-1",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxs23("div", { className: "flex flex-wrap items-center justify-between gap-3 pb-4 border-b border-border", children: [
+          /* @__PURE__ */ jsxs23("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ jsx31("h2", { className: "text-lg font-bold text-fg", children: monthName }),
+            /* @__PURE__ */ jsx31(Button, { size: "sm", variant: "outline", onClick: handleToday, children: "Today" }),
+            /* @__PURE__ */ jsxs23("div", { className: "flex items-center gap-1", children: [
+              /* @__PURE__ */ jsx31(Button, { size: "sm", variant: "ghost", onClick: handlePrev, "aria-label": "Previous", children: "\u2039" }),
+              /* @__PURE__ */ jsx31(Button, { size: "sm", variant: "ghost", onClick: handleNext, "aria-label": "Next", children: "\u203A" })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsx31(
+            SegmentedControl,
+            {
+              size: "sm",
+              value: activeView,
+              onChange: (v) => setView(v),
+              options: [
+                { value: "month", label: "Month" },
+                { value: "week", label: "Week" },
+                { value: "agenda", label: "Agenda" }
+              ]
+            }
+          )
+        ] }),
+        activeView === "month" && /* @__PURE__ */ jsxs23("div", { "data-slot": "month-view", className: "mt-4 flex flex-col", children: [
+          /* @__PURE__ */ jsx31("div", { className: "grid grid-cols-7 text-center text-xs font-semibold text-fg-muted pb-2", children: ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"].map((d) => /* @__PURE__ */ jsx31("div", { className: "py-1", children: d }, d)) }),
+          /* @__PURE__ */ jsx31("div", { className: "grid grid-cols-7 gap-px bg-border rounded-lg overflow-hidden border border-border", children: monthDays.map((d, idx) => {
+            const dateStr = d.date.toISOString().split("T")[0];
+            const dayEvents = events.filter((e) => {
+              const s = typeof e.start === "string" ? e.start : e.start.toISOString();
+              return s.startsWith(dateStr);
+            });
+            const hasConflict = dayEvents.some((e) => e.conflict);
+            return /* @__PURE__ */ jsxs23(
+              "div",
+              {
+                onClick: () => onSelectDate?.(d.date),
+                className: cn(
+                  "min-h-[80px] p-1.5 flex flex-col justify-between cursor-pointer transition-colors",
+                  d.isCurrentMonth ? "bg-surface hover:bg-surface-2" : "bg-surface-2/50 text-fg-muted"
+                ),
+                children: [
+                  /* @__PURE__ */ jsxs23("div", { className: "flex items-center justify-between", children: [
+                    /* @__PURE__ */ jsx31("span", { className: "text-xs font-medium", children: d.dayNumber }),
+                    hasConflict && /* @__PURE__ */ jsx31(Badge, { variant: "danger", className: "text-[10px] px-1 py-0", children: "Conflict" })
+                  ] }),
+                  /* @__PURE__ */ jsxs23("div", { className: "flex flex-col gap-1 mt-1", children: [
+                    dayEvents.slice(0, 2).map((ev) => /* @__PURE__ */ jsx31(
+                      "button",
+                      {
+                        type: "button",
+                        onClick: (e) => {
+                          e.stopPropagation();
+                          onSelectEvent?.(ev);
+                        },
+                        className: cn(
+                          "truncate rounded px-1 text-[11px] text-start font-medium",
+                          ev.conflict ? "bg-danger-bg text-danger-fg" : "bg-primary-subtle text-primary"
+                        ),
+                        children: ev.title
+                      },
+                      ev.id
+                    )),
+                    dayEvents.length > 2 && /* @__PURE__ */ jsxs23("span", { className: "text-[10px] text-fg-muted ps-1", children: [
+                      "+",
+                      dayEvents.length - 2,
+                      " more"
+                    ] })
+                  ] })
+                ]
+              },
+              idx
+            );
+          }) })
+        ] }),
+        activeView === "week" && /* @__PURE__ */ jsx31("div", { "data-slot": "week-view", className: "mt-4 p-4 text-center text-sm text-fg-muted", children: /* @__PURE__ */ jsx31("div", { className: "grid grid-cols-7 gap-2", children: ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"].map((dayName, idx) => /* @__PURE__ */ jsxs23("div", { className: "rounded-lg border border-border p-2 bg-surface-2", children: [
+          /* @__PURE__ */ jsx31("div", { className: "font-semibold text-fg text-xs pb-1", children: dayName }),
+          /* @__PURE__ */ jsx31("div", { className: "space-y-1 mt-2", children: events.slice(0, 2).map((ev) => /* @__PURE__ */ jsx31(
+            "div",
+            {
+              onClick: () => onSelectEvent?.(ev),
+              className: cn(
+                "cursor-pointer rounded p-1 text-[11px] truncate text-start",
+                ev.conflict ? "bg-danger-bg text-danger-fg" : "bg-surface text-fg shadow-1"
+              ),
+              children: ev.title
+            },
+            ev.id
+          )) })
+        ] }, idx)) }) }),
+        activeView === "agenda" && /* @__PURE__ */ jsx31("div", { "data-slot": "agenda-view", className: "mt-4 flex flex-col gap-2", children: events.length === 0 ? /* @__PURE__ */ jsx31("div", { className: "py-8 text-center text-sm text-fg-muted", children: "No scheduled events." }) : events.map((ev) => /* @__PURE__ */ jsxs23(
+          "div",
+          {
+            onClick: () => onSelectEvent?.(ev),
+            className: cn(
+              "flex items-center justify-between rounded-lg border p-3 cursor-pointer hover:bg-surface-2 transition-colors",
+              ev.conflict ? "border-danger-border bg-danger-bg/20" : "border-border bg-surface"
+            ),
+            children: [
+              /* @__PURE__ */ jsxs23("div", { children: [
+                /* @__PURE__ */ jsx31("h4", { className: "text-sm font-semibold text-fg", children: ev.title }),
+                /* @__PURE__ */ jsxs23("p", { className: "text-xs text-fg-muted", children: [
+                  String(ev.start),
+                  " ",
+                  ev.location && `\u2022 ${ev.location}`
+                ] })
+              ] }),
+              ev.conflict && /* @__PURE__ */ jsx31(Badge, { variant: "danger", children: "Conflict" })
+            ]
+          },
+          ev.id
+        )) })
+      ]
+    }
+  );
+}
+
+// src/calendar/ScheduleAgenda.tsx
+import { jsx as jsx32, jsxs as jsxs24 } from "react/jsx-runtime";
+function ScheduleAgenda({
+  events,
+  onSelectEvent,
+  className
+}) {
+  return /* @__PURE__ */ jsx32(
+    "div",
+    {
+      "data-slot": "schedule-agenda",
+      className: cn("yc-ScheduleAgenda-root flex flex-col gap-3", className),
+      children: events.length === 0 ? /* @__PURE__ */ jsx32("div", { className: "py-6 text-center text-sm text-fg-muted", children: "No scheduled agenda items." }) : events.map((event) => /* @__PURE__ */ jsxs24(
+        "div",
+        {
+          onClick: () => onSelectEvent?.(event),
+          "data-slot": "agenda-item",
+          className: cn(
+            "yc-ScheduleAgenda-item flex items-center justify-between rounded-lg border p-3 shadow-1 cursor-pointer transition-colors",
+            event.conflict ? "border-danger-border bg-danger-bg/20" : "border-border bg-surface hover:bg-surface-2"
+          ),
+          children: [
+            /* @__PURE__ */ jsxs24("div", { className: "flex flex-col gap-0.5", children: [
+              /* @__PURE__ */ jsx32("span", { className: "text-sm font-semibold text-fg", children: event.title }),
+              /* @__PURE__ */ jsxs24("span", { className: "text-xs text-fg-muted", children: [
+                String(event.start),
+                " ",
+                event.location && `\u2022 ${event.location}`
+              ] })
+            ] }),
+            event.conflict && /* @__PURE__ */ jsx32(Badge, { variant: "danger", children: "Conflict" })
+          ]
+        },
+        event.id
+      ))
+    }
+  );
+}
+
+// src/calendar/Reminders.tsx
+import { jsx as jsx33, jsxs as jsxs25 } from "react/jsx-runtime";
+function Reminders({
+  reminders,
+  onComplete,
+  onSnooze,
+  className
+}) {
+  return /* @__PURE__ */ jsx33(
+    "div",
+    {
+      "data-slot": "reminders",
+      className: cn("yc-Reminders-root flex flex-col gap-2", className),
+      children: reminders.length === 0 ? /* @__PURE__ */ jsx33("div", { className: "py-6 text-center text-sm text-fg-muted", children: "No reminders pending." }) : reminders.map((reminder) => {
+        const isDone = reminder.completed;
+        return /* @__PURE__ */ jsxs25(
+          "div",
+          {
+            "data-slot": "reminder-item",
+            "data-completed": isDone ? "true" : void 0,
+            className: cn(
+              "yc-Reminders-item flex items-center justify-between rounded-lg border border-border bg-surface p-3 shadow-1 transition-opacity",
+              isDone && "opacity-60"
+            ),
+            children: [
+              /* @__PURE__ */ jsxs25("div", { className: "flex items-center gap-3", children: [
+                /* @__PURE__ */ jsx33(
+                  "input",
+                  {
+                    type: "checkbox",
+                    checked: isDone,
+                    onChange: (e) => onComplete?.(reminder.id, e.target.checked),
+                    className: "h-4 w-4 rounded border-border text-primary focus:ring-primary",
+                    "aria-label": `Mark ${reminder.title} as completed`
+                  }
+                ),
+                /* @__PURE__ */ jsxs25("div", { className: "flex flex-col", children: [
+                  /* @__PURE__ */ jsx33(
+                    "span",
+                    {
+                      className: cn(
+                        "text-sm font-medium text-fg",
+                        isDone && "line-through text-fg-muted"
+                      ),
+                      children: reminder.title
+                    }
+                  ),
+                  /* @__PURE__ */ jsxs25("div", { className: "flex items-center gap-2 text-xs text-fg-muted", children: [
+                    /* @__PURE__ */ jsxs25("span", { children: [
+                      "Due: ",
+                      reminder.dueAt
+                    ] }),
+                    reminder.rrule && /* @__PURE__ */ jsxs25(Badge, { variant: "neutral", className: "text-[10px] px-1 py-0", children: [
+                      "\u{1F504} ",
+                      reminder.rrule
+                    ] }),
+                    reminder.snoozedUntil && /* @__PURE__ */ jsxs25("span", { className: "text-warn-fg", children: [
+                      "Snoozed until ",
+                      reminder.snoozedUntil
+                    ] })
+                  ] })
+                ] })
+              ] }),
+              !isDone && onSnooze && /* @__PURE__ */ jsx33(
+                Button,
+                {
+                  size: "sm",
+                  variant: "ghost",
+                  onClick: () => onSnooze(reminder.id, 15),
+                  className: "text-xs",
+                  children: "Snooze 15m"
+                }
+              )
+            ]
+          },
+          reminder.id
+        );
+      })
+    }
+  );
+}
+
+// src/calendar/Routines.tsx
+import { jsx as jsx34, jsxs as jsxs26 } from "react/jsx-runtime";
+function Routines({
+  routines,
+  onToggleActive,
+  className
+}) {
+  return /* @__PURE__ */ jsx34(
+    "div",
+    {
+      "data-slot": "routines",
+      className: cn("yc-Routines-root flex flex-col gap-2.5", className),
+      children: routines.length === 0 ? /* @__PURE__ */ jsx34("div", { className: "py-6 text-center text-sm text-fg-muted", children: "No active routines configured." }) : routines.map((routine) => /* @__PURE__ */ jsxs26(
+        "div",
+        {
+          "data-slot": "routine-item",
+          className: "yc-Routines-item flex items-center justify-between rounded-lg border border-border bg-surface p-3 shadow-1",
+          children: [
+            /* @__PURE__ */ jsxs26("div", { className: "flex flex-col gap-1", children: [
+              /* @__PURE__ */ jsx34("span", { className: "text-sm font-semibold text-fg", children: routine.title }),
+              /* @__PURE__ */ jsxs26("div", { className: "flex items-center gap-2 text-xs text-fg-muted", children: [
+                /* @__PURE__ */ jsx34(Badge, { variant: "neutral", children: routine.frequency }),
+                /* @__PURE__ */ jsx34("span", { children: routine.timeOfDay }),
+                routine.durationMinutes && /* @__PURE__ */ jsxs26("span", { children: [
+                  "(",
+                  routine.durationMinutes,
+                  " mins)"
+                ] })
+              ] })
+            ] }),
+            /* @__PURE__ */ jsxs26("label", { className: "relative inline-flex cursor-pointer items-center", children: [
+              /* @__PURE__ */ jsx34(
+                "input",
+                {
+                  type: "checkbox",
+                  checked: routine.active,
+                  onChange: (e) => onToggleActive?.(routine.id, e.target.checked),
+                  className: "sr-only peer",
+                  "aria-label": `Toggle ${routine.title} routine`
+                }
+              ),
+              /* @__PURE__ */ jsx34("div", { className: "h-6 w-11 rounded-full bg-surface-3 peer peer-checked:bg-primary peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:start-[2px] after:bg-white after:border-border after:border after:rounded-full after:h-5 after:w-5 after:transition-all" })
+            ] })
+          ]
+        },
+        routine.id
+      ))
+    }
+  );
+}
+
+// src/calendar/ActivityTimeline.tsx
+import { jsx as jsx35, jsxs as jsxs27 } from "react/jsx-runtime";
+var statusColors = {
+  info: "bg-info-fg",
+  success: "bg-success-fg",
+  warn: "bg-warn-fg",
+  danger: "bg-danger-fg"
+};
+function ActivityTimeline({ events, className }) {
+  return /* @__PURE__ */ jsx35(
+    "div",
+    {
+      "data-slot": "activity-timeline",
+      className: cn("yc-ActivityTimeline-root flex flex-col", className),
+      children: events.length === 0 ? /* @__PURE__ */ jsx35("div", { className: "py-6 text-center text-sm text-fg-muted", children: "No timeline activities." }) : /* @__PURE__ */ jsx35("div", { className: "relative border-s border-border ms-3.5 space-y-6 my-2", children: events.map((ev) => /* @__PURE__ */ jsxs27(
+        "div",
+        {
+          "data-slot": "timeline-item",
+          className: "yc-ActivityTimeline-item relative ps-6",
+          children: [
+            /* @__PURE__ */ jsx35(
+              "span",
+              {
+                className: cn(
+                  "absolute -start-1.5 top-1 h-3 w-3 rounded-full border-2 border-surface",
+                  statusColors[ev.status || "info"]
+                )
+              }
+            ),
+            /* @__PURE__ */ jsxs27("div", { className: "flex flex-col", children: [
+              /* @__PURE__ */ jsxs27("div", { className: "flex items-center justify-between gap-2", children: [
+                /* @__PURE__ */ jsx35("span", { className: "text-sm font-semibold text-fg", children: ev.title }),
+                /* @__PURE__ */ jsx35("span", { className: "text-xs text-fg-muted", children: ev.timestamp })
+              ] }),
+              ev.description && /* @__PURE__ */ jsx35("p", { className: "mt-1 text-xs text-fg-muted leading-relaxed", children: ev.description })
+            ] })
+          ]
+        },
+        ev.id
+      )) })
+    }
+  );
+}
+
+// src/profiles/ProfileSwitcher.tsx
+import { jsx as jsx36, jsxs as jsxs28 } from "react/jsx-runtime";
+function ProfileSwitcher({
+  members,
+  activeMemberId,
+  onSelectMember,
+  className
+}) {
+  const activeMember = members.find((m) => m.id === activeMemberId) || members[0];
+  return /* @__PURE__ */ jsx36(
+    "div",
+    {
+      "data-slot": "profile-switcher",
+      className: cn("yc-ProfileSwitcher-root inline-block", className),
+      children: /* @__PURE__ */ jsxs28(Menu, { children: [
+        /* @__PURE__ */ jsxs28(MenuTrigger, { className: "flex items-center gap-2 rounded-lg border border-border bg-surface px-2.5 py-1.5 shadow-1 hover:bg-surface-2 transition-colors", children: [
+          /* @__PURE__ */ jsx36(Avatar, { size: "sm", children: activeMember?.avatarUrl ? /* @__PURE__ */ jsx36(AvatarImage, { src: activeMember.avatarUrl, alt: activeMember.displayName }) : /* @__PURE__ */ jsx36(AvatarFallback, { children: activeMember ? activeMember.displayName.substring(0, 2).toUpperCase() : "ME" }) }),
+          /* @__PURE__ */ jsxs28("div", { className: "flex flex-col text-start", children: [
+            /* @__PURE__ */ jsx36("span", { className: "text-xs font-semibold text-fg", children: activeMember ? activeMember.displayName : "Select Profile" }),
+            activeMember?.relationship && /* @__PURE__ */ jsx36("span", { className: "text-[10px] text-fg-muted", children: activeMember.relationship })
+          ] }),
+          /* @__PURE__ */ jsx36("span", { className: "ms-1 text-xs text-fg-muted", children: "\u25BE" })
+        ] }),
+        /* @__PURE__ */ jsx36(MenuContent, { align: "start", children: members.map((member) => /* @__PURE__ */ jsxs28(
+          MenuItem,
+          {
+            onClick: () => onSelectMember(member.id),
+            className: cn(
+              "flex items-center gap-2.5 py-2",
+              member.id === activeMemberId && "bg-surface-2 font-semibold"
+            ),
+            children: [
+              /* @__PURE__ */ jsx36(Avatar, { size: "sm", children: member.avatarUrl ? /* @__PURE__ */ jsx36(AvatarImage, { src: member.avatarUrl, alt: member.displayName }) : /* @__PURE__ */ jsx36(AvatarFallback, { children: member.displayName.substring(0, 2).toUpperCase() }) }),
+              /* @__PURE__ */ jsxs28("div", { className: "flex flex-col text-start", children: [
+                /* @__PURE__ */ jsx36("span", { className: "text-xs text-fg", children: member.displayName }),
+                /* @__PURE__ */ jsx36("span", { className: "text-[10px] text-fg-muted", children: member.relationship || member.role })
+              ] })
+            ]
+          },
+          member.id
+        )) })
+      ] })
+    }
+  );
+}
+
+// src/profiles/MemberCard.tsx
+import { jsx as jsx37, jsxs as jsxs29 } from "react/jsx-runtime";
+var roleBadgeVariant = {
+  owner: "primary",
+  steward: "info",
+  member: "neutral",
+  viewer: "warn"
+};
+function MemberCard({ member, onEdit, className }) {
+  return /* @__PURE__ */ jsxs29(
+    "div",
+    {
+      "data-slot": "member-card",
+      className: cn(
+        "yc-MemberCard-root flex items-center justify-between rounded-xl border border-border bg-surface p-4 shadow-1",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxs29("div", { className: "flex items-center gap-3", children: [
+          /* @__PURE__ */ jsx37(Avatar, { size: "md", children: member.avatarUrl ? /* @__PURE__ */ jsx37(AvatarImage, { src: member.avatarUrl, alt: member.displayName }) : /* @__PURE__ */ jsx37(AvatarFallback, { children: member.displayName.substring(0, 2).toUpperCase() }) }),
+          /* @__PURE__ */ jsxs29("div", { className: "flex flex-col", children: [
+            /* @__PURE__ */ jsxs29("div", { className: "flex items-center gap-2", children: [
+              /* @__PURE__ */ jsx37("span", { className: "text-sm font-bold text-fg", children: member.displayName }),
+              /* @__PURE__ */ jsx37(Badge, { variant: roleBadgeVariant[member.role], children: member.role })
+            ] }),
+            member.relationship && /* @__PURE__ */ jsx37("span", { className: "text-xs text-fg-muted", children: member.relationship }),
+            member.scopes && member.scopes.length > 0 && /* @__PURE__ */ jsx37("div", { className: "mt-1 flex flex-wrap gap-1", children: member.scopes.map((scope) => /* @__PURE__ */ jsx37(
+              "span",
+              {
+                className: "rounded bg-surface-2 px-1.5 py-0.5 text-[10px] text-fg-muted",
+                children: scope
+              },
+              scope
+            )) })
+          ] })
+        ] }),
+        onEdit && /* @__PURE__ */ jsx37(Button, { size: "sm", variant: "ghost", onClick: () => onEdit(member), children: "Edit" })
+      ]
+    }
+  );
+}
+
+// src/profiles/ProfileEditModal.tsx
+import * as React24 from "react";
+import { jsx as jsx38, jsxs as jsxs30 } from "react/jsx-runtime";
+function ProfileEditModal({
+  member,
+  open,
+  onOpenChange,
+  onSave
+}) {
+  const [displayName, setDisplayName] = React24.useState(member?.displayName || "");
+  const [relationship, setRelationship] = React24.useState(member?.relationship || "");
+  const [role, setRole] = React24.useState(member?.role || "member");
+  React24.useEffect(() => {
+    if (member) {
+      setDisplayName(member.displayName);
+      setRelationship(member.relationship || "");
+      setRole(member.role);
+    }
+  }, [member]);
+  const handleSubmit = (e) => {
+    e.preventDefault();
+    if (!member) return;
+    onSave({
+      ...member,
+      displayName,
+      relationship,
+      role
+    });
+    onOpenChange(false);
+  };
+  return /* @__PURE__ */ jsx38(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsx38(DialogContent, { className: "yc-ProfileEditModal-content max-w-md", children: /* @__PURE__ */ jsxs30("form", { onSubmit: handleSubmit, "data-slot": "profile-edit-modal", children: [
+    /* @__PURE__ */ jsx38(DialogHeader, { children: /* @__PURE__ */ jsx38(DialogTitle, { children: "Edit Profile" }) }),
+    /* @__PURE__ */ jsxs30("div", { className: "space-y-4 py-4 text-xs", children: [
+      /* @__PURE__ */ jsxs30("div", { children: [
+        /* @__PURE__ */ jsx38("label", { className: "block font-medium text-fg mb-1", children: "Display Name" }),
+        /* @__PURE__ */ jsx38(
+          "input",
+          {
+            type: "text",
+            required: true,
+            value: displayName,
+            onChange: (e) => setDisplayName(e.target.value),
+            className: "w-full rounded-md border border-border bg-surface-2 p-2 text-sm text-fg focus:border-primary focus:outline-none"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs30("div", { children: [
+        /* @__PURE__ */ jsx38("label", { className: "block font-medium text-fg mb-1", children: "Relationship" }),
+        /* @__PURE__ */ jsx38(
+          "input",
+          {
+            type: "text",
+            value: relationship,
+            onChange: (e) => setRelationship(e.target.value),
+            placeholder: "e.g. Self, Spouse, Child, Ward",
+            className: "w-full rounded-md border border-border bg-surface-2 p-2 text-sm text-fg focus:border-primary focus:outline-none"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs30("div", { children: [
+        /* @__PURE__ */ jsx38("label", { className: "block font-medium text-fg mb-1", children: "Role" }),
+        /* @__PURE__ */ jsxs30(
+          "select",
+          {
+            value: role,
+            onChange: (e) => setRole(e.target.value),
+            className: "w-full rounded-md border border-border bg-surface-2 p-2 text-sm text-fg focus:border-primary focus:outline-none",
+            children: [
+              /* @__PURE__ */ jsx38("option", { value: "owner", children: "Owner" }),
+              /* @__PURE__ */ jsx38("option", { value: "steward", children: "Steward" }),
+              /* @__PURE__ */ jsx38("option", { value: "member", children: "Member" }),
+              /* @__PURE__ */ jsx38("option", { value: "viewer", children: "Viewer" })
+            ]
+          }
+        )
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs30(DialogFooter, { className: "gap-2", children: [
+      /* @__PURE__ */ jsx38(DialogClose, { asChild: true, children: /* @__PURE__ */ jsx38(Button, { type: "button", variant: "ghost", size: "sm", children: "Cancel" }) }),
+      /* @__PURE__ */ jsx38(Button, { type: "submit", variant: "primary", size: "sm", children: "Save Changes" })
+    ] })
+  ] }) }) });
+}
+
+// src/profiles/RoleMatrix.tsx
+import { jsx as jsx39, jsxs as jsxs31 } from "react/jsx-runtime";
+function RoleMatrix({
+  permissions,
+  onChange,
+  readOnly = false,
+  className
+}) {
+  const handleToggle = (domainIndex, field, val) => {
+    if (readOnly || !onChange) return;
+    const next = [...permissions];
+    next[domainIndex] = {
+      ...next[domainIndex],
+      [field]: val
+    };
+    onChange(next);
+  };
+  return /* @__PURE__ */ jsx39(
+    "div",
+    {
+      "data-slot": "role-matrix",
+      className: cn(
+        "yc-RoleMatrix-root overflow-x-auto rounded-xl border border-border bg-surface text-fg shadow-1",
+        className
+      ),
+      children: /* @__PURE__ */ jsxs31("table", { className: "w-full text-start text-xs", children: [
+        /* @__PURE__ */ jsx39("thead", { className: "border-b border-border bg-surface-2 text-fg-muted font-semibold", children: /* @__PURE__ */ jsxs31("tr", { children: [
+          /* @__PURE__ */ jsx39("th", { className: "p-3 text-start", children: "Domain Scope" }),
+          /* @__PURE__ */ jsx39("th", { className: "p-3 text-center", children: "Read" }),
+          /* @__PURE__ */ jsx39("th", { className: "p-3 text-center", children: "Write" }),
+          /* @__PURE__ */ jsx39("th", { className: "p-3 text-center", children: "Approve" })
+        ] }) }),
+        /* @__PURE__ */ jsx39("tbody", { className: "divide-y divide-border", children: permissions.map((perm, idx) => /* @__PURE__ */ jsxs31("tr", { className: "hover:bg-surface-2/50 transition-colors", children: [
+          /* @__PURE__ */ jsx39("td", { className: "p-3 font-medium text-fg capitalize", children: perm.domain }),
+          /* @__PURE__ */ jsx39("td", { className: "p-3 text-center", children: /* @__PURE__ */ jsx39(
+            "input",
+            {
+              type: "checkbox",
+              checked: perm.read,
+              disabled: readOnly,
+              onChange: (e) => handleToggle(idx, "read", e.target.checked),
+              className: "h-4 w-4 rounded border-border text-primary focus:ring-primary disabled:opacity-50",
+              "aria-label": `Read permission for ${perm.domain}`
+            }
+          ) }),
+          /* @__PURE__ */ jsx39("td", { className: "p-3 text-center", children: /* @__PURE__ */ jsx39(
+            "input",
+            {
+              type: "checkbox",
+              checked: perm.write,
+              disabled: readOnly,
+              onChange: (e) => handleToggle(idx, "write", e.target.checked),
+              className: "h-4 w-4 rounded border-border text-primary focus:ring-primary disabled:opacity-50",
+              "aria-label": `Write permission for ${perm.domain}`
+            }
+          ) }),
+          /* @__PURE__ */ jsx39("td", { className: "p-3 text-center", children: /* @__PURE__ */ jsx39(
+            "input",
+            {
+              type: "checkbox",
+              checked: perm.approve,
+              disabled: readOnly,
+              onChange: (e) => handleToggle(idx, "approve", e.target.checked),
+              className: "h-4 w-4 rounded border-border text-primary focus:ring-primary disabled:opacity-50",
+              "aria-label": `Approve permission for ${perm.domain}`
+            }
+          ) })
+        ] }, perm.domain)) })
+      ] })
+    }
+  );
+}
+
+// src/profiles/ViewerInvite.tsx
+import * as React25 from "react";
+import { jsx as jsx40, jsxs as jsxs32 } from "react/jsx-runtime";
+function ViewerInvite({
+  availableScopes = ["general", "notes", "calendar", "finances", "records"],
+  onSendInvite,
+  className
+}) {
+  const [email, setEmail] = React25.useState("");
+  const [selectedScopes, setSelectedScopes] = React25.useState(["general"]);
+  const [expiresInDays, setExpiresInDays] = React25.useState(7);
+  const [sent, setSent] = React25.useState(false);
+  const [loading, setLoading] = React25.useState(false);
+  const toggleScope = (scope) => {
+    setSelectedScopes(
+      (prev) => prev.includes(scope) ? prev.filter((s) => s !== scope) : [...prev, scope]
+    );
+  };
+  const handleSubmit = async (e) => {
+    e.preventDefault();
+    if (!email) return;
+    setLoading(true);
+    try {
+      await onSendInvite?.({
+        email,
+        role: "viewer",
+        scopes: selectedScopes,
+        expiresInDays
+      });
+      setSent(true);
+    } finally {
+      setLoading(false);
+    }
+  };
+  return /* @__PURE__ */ jsxs32(
+    "div",
+    {
+      "data-slot": "viewer-invite",
+      className: cn(
+        "yc-ViewerInvite-root rounded-xl border border-border bg-surface p-6 shadow-1 text-xs",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsx40("h3", { className: "text-base font-bold text-fg", children: "Invite Viewer" }),
+        /* @__PURE__ */ jsx40("p", { className: "mt-1 text-fg-muted leading-relaxed", children: "Grant time-limited, read-only access to selected record scopes." }),
+        sent ? /* @__PURE__ */ jsxs32("div", { className: "mt-4 rounded-lg bg-success-bg/30 border border-success-border p-4 text-center", children: [
+          /* @__PURE__ */ jsx40("span", { className: "font-semibold text-success-fg", children: "Invitation Sent!" }),
+          /* @__PURE__ */ jsxs32("p", { className: "mt-1 text-fg-muted", children: [
+            "An invitation link has been dispatched to ",
+            email,
+            "."
+          ] }),
+          /* @__PURE__ */ jsx40(
+            Button,
+            {
+              size: "sm",
+              variant: "ghost",
+              className: "mt-3",
+              onClick: () => {
+                setSent(false);
+                setEmail("");
+              },
+              children: "Invite Another"
+            }
+          )
+        ] }) : /* @__PURE__ */ jsxs32("form", { onSubmit: handleSubmit, className: "mt-4 space-y-4", children: [
+          /* @__PURE__ */ jsxs32("div", { children: [
+            /* @__PURE__ */ jsx40("label", { className: "block font-medium text-fg mb-1", children: "Viewer Email Address" }),
+            /* @__PURE__ */ jsx40(
+              "input",
+              {
+                type: "email",
+                required: true,
+                value: email,
+                onChange: (e) => setEmail(e.target.value),
+                placeholder: "e.g. viewer@example.com",
+                className: "w-full rounded-md border border-border bg-surface-2 p-2 text-sm text-fg focus:border-primary focus:outline-none"
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs32("div", { children: [
+            /* @__PURE__ */ jsx40("label", { className: "block font-medium text-fg mb-1", children: "Allowed Scopes" }),
+            /* @__PURE__ */ jsx40("div", { className: "flex flex-wrap gap-1.5 mt-1", children: availableScopes.map((scope) => /* @__PURE__ */ jsx40(
+              Chip,
+              {
+                selected: selectedScopes.includes(scope),
+                onClick: () => toggleScope(scope),
+                children: scope
+              },
+              scope
+            )) })
+          ] }),
+          /* @__PURE__ */ jsxs32("div", { children: [
+            /* @__PURE__ */ jsx40("label", { className: "block font-medium text-fg mb-1", children: "Access Expiration" }),
+            /* @__PURE__ */ jsxs32(
+              "select",
+              {
+                value: expiresInDays,
+                onChange: (e) => setExpiresInDays(Number(e.target.value)),
+                className: "w-full rounded-md border border-border bg-surface-2 p-2 text-sm text-fg focus:border-primary focus:outline-none",
+                children: [
+                  /* @__PURE__ */ jsx40("option", { value: 1, children: "24 hours" }),
+                  /* @__PURE__ */ jsx40("option", { value: 7, children: "7 days" }),
+                  /* @__PURE__ */ jsx40("option", { value: 30, children: "30 days" }),
+                  /* @__PURE__ */ jsx40("option", { value: 90, children: "90 days" })
+                ]
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsx40(Button, { type: "submit", variant: "primary", size: "sm", loading, className: "w-full", children: "Send Secure Invitation" })
+        ] })
+      ]
+    }
+  );
+}
+
+// src/profiles/ShareBundle.tsx
+import * as React26 from "react";
+import { jsx as jsx41, jsxs as jsxs33 } from "react/jsx-runtime";
+function ShareBundle({
+  availableScopes = ["general", "notes", "calendar", "finances", "records"],
+  onCreateBundle,
+  className
+}) {
+  const [name, setName] = React26.useState("");
+  const [selectedScopes, setSelectedScopes] = React26.useState(["general"]);
+  const [requiresPasscode, setRequiresPasscode] = React26.useState(false);
+  const [bundleLink, setBundleLink] = React26.useState(null);
+  const [loading, setLoading] = React26.useState(false);
+  const toggleScope = (scope) => {
+    setSelectedScopes(
+      (prev) => prev.includes(scope) ? prev.filter((s) => s !== scope) : [...prev, scope]
+    );
+  };
+  const handleCreate = async (e) => {
+    e.preventDefault();
+    if (!name) return;
+    setLoading(true);
+    try {
+      const link = await onCreateBundle?.({
+        name,
+        scopes: selectedScopes,
+        requiresPasscode
+      });
+      setBundleLink(typeof link === "string" ? link : "https://yarvelle.local/bundles/b7a9c3");
+    } finally {
+      setLoading(false);
+    }
+  };
+  return /* @__PURE__ */ jsxs33(
+    "div",
+    {
+      "data-slot": "share-bundle",
+      className: cn(
+        "yc-ShareBundle-root rounded-xl border border-border bg-surface p-6 shadow-1 text-xs",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsx41("h3", { className: "text-base font-bold text-fg", children: "Create Share Bundle" }),
+        /* @__PURE__ */ jsx41("p", { className: "mt-1 text-fg-muted leading-relaxed", children: "Package records into an encrypted export bundle." }),
+        bundleLink ? /* @__PURE__ */ jsxs33("div", { className: "mt-4 rounded-lg bg-surface-2 border border-border p-4 text-center", children: [
+          /* @__PURE__ */ jsx41("span", { className: "font-semibold text-fg", children: "Bundle Created!" }),
+          /* @__PURE__ */ jsx41("p", { className: "mt-1 text-fg-muted", children: "Shareable bundle link:" }),
+          /* @__PURE__ */ jsx41("div", { className: "mt-2 rounded bg-surface p-2 font-mono text-xs text-primary border border-border", children: bundleLink }),
+          /* @__PURE__ */ jsx41(
+            Button,
+            {
+              size: "sm",
+              variant: "ghost",
+              className: "mt-3",
+              onClick: () => {
+                setBundleLink(null);
+                setName("");
+              },
+              children: "Create Another"
+            }
+          )
+        ] }) : /* @__PURE__ */ jsxs33("form", { onSubmit: handleCreate, className: "mt-4 space-y-4", children: [
+          /* @__PURE__ */ jsxs33("div", { children: [
+            /* @__PURE__ */ jsx41("label", { className: "block font-medium text-fg mb-1", children: "Bundle Name" }),
+            /* @__PURE__ */ jsx41(
+              "input",
+              {
+                type: "text",
+                required: true,
+                value: name,
+                onChange: (e) => setName(e.target.value),
+                placeholder: "e.g. Annual Record Dossier",
+                className: "w-full rounded-md border border-border bg-surface-2 p-2 text-sm text-fg focus:border-primary focus:outline-none"
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs33("div", { children: [
+            /* @__PURE__ */ jsx41("label", { className: "block font-medium text-fg mb-1", children: "Included Scopes" }),
+            /* @__PURE__ */ jsx41("div", { className: "flex flex-wrap gap-1.5 mt-1", children: availableScopes.map((scope) => /* @__PURE__ */ jsx41(
+              Chip,
+              {
+                selected: selectedScopes.includes(scope),
+                onClick: () => toggleScope(scope),
+                children: scope
+              },
+              scope
+            )) })
+          ] }),
+          /* @__PURE__ */ jsxs33("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ jsx41(
+              "input",
+              {
+                id: "passcode-opt",
+                type: "checkbox",
+                checked: requiresPasscode,
+                onChange: (e) => setRequiresPasscode(e.target.checked),
+                className: "h-4 w-4 rounded border-border text-primary focus:ring-primary"
+              }
+            ),
+            /* @__PURE__ */ jsx41("label", { htmlFor: "passcode-opt", className: "font-medium text-fg cursor-pointer", children: "Protect bundle with passkey / PIN" })
+          ] }),
+          /* @__PURE__ */ jsx41(Button, { type: "submit", variant: "primary", size: "sm", loading, className: "w-full", children: "Generate Secure Bundle" })
+        ] })
+      ]
+    }
+  );
+}
+
+// src/profiles/TeenHandoverBanner.tsx
+import { jsx as jsx42, jsxs as jsxs34 } from "react/jsx-runtime";
+function TeenHandoverBanner({
+  memberName,
+  handoverDate,
+  onInitiateHandover,
+  onDismiss,
+  className
+}) {
+  return /* @__PURE__ */ jsxs34(
+    "div",
+    {
+      "data-slot": "teen-handover-banner",
+      className: cn(
+        "yc-TeenHandoverBanner-root flex flex-col sm:flex-row items-start sm:items-center justify-between gap-3 rounded-xl border border-warn-border bg-warn-bg/30 p-4 text-xs text-fg shadow-1",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxs34("div", { className: "flex items-start gap-3", children: [
+          /* @__PURE__ */ jsx42("span", { className: "text-warn-fg text-lg leading-none", children: "\u26A0\uFE0F" }),
+          /* @__PURE__ */ jsxs34("div", { children: [
+            /* @__PURE__ */ jsx42("h4", { className: "font-semibold text-fg", children: "Privacy & Age-of-Majority Transition" }),
+            /* @__PURE__ */ jsxs34("p", { className: "mt-0.5 text-fg-muted", children: [
+              /* @__PURE__ */ jsx42("span", { className: "font-medium text-fg", children: memberName }),
+              " reaches transition age on",
+              " ",
+              /* @__PURE__ */ jsx42("span", { className: "font-medium text-fg", children: handoverDate }),
+              ". Account stewardship and record privacy settings should be reviewed."
+            ] })
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs34("div", { className: "flex items-center gap-2 shrink-0", children: [
+          onDismiss && /* @__PURE__ */ jsx42(Button, { size: "sm", variant: "ghost", onClick: onDismiss, children: "Dismiss" }),
+          onInitiateHandover && /* @__PURE__ */ jsx42(Button, { size: "sm", variant: "outline", onClick: onInitiateHandover, children: "Review Privacy" })
+        ] })
+      ]
+    }
+  );
+}
+
+// src/tasks/TaskItem.tsx
+import { jsx as jsx43, jsxs as jsxs35 } from "react/jsx-runtime";
+var priorityBadgeVariant = {
+  low: "neutral",
+  medium: "warn",
+  high: "danger"
+};
+function TaskItem({
+  task,
+  onToggleComplete,
+  onDelete,
+  className
+}) {
+  const isDone = task.completed;
+  return /* @__PURE__ */ jsxs35(
+    "div",
+    {
+      "data-slot": "task-item",
+      "data-completed": isDone ? "true" : void 0,
+      className: cn(
+        "yc-TaskItem-root flex items-center justify-between rounded-lg border border-border bg-surface p-3 shadow-1 transition-all",
+        isDone && "opacity-60",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxs35("div", { className: "flex items-center gap-3", children: [
+          /* @__PURE__ */ jsx43(
+            "input",
+            {
+              type: "checkbox",
+              checked: isDone,
+              onChange: (e) => onToggleComplete?.(task.id, e.target.checked),
+              className: "h-4 w-4 rounded border-border text-primary focus:ring-primary",
+              "aria-label": `Mark task ${task.title} as ${isDone ? "incomplete" : "complete"}`
+            }
+          ),
+          /* @__PURE__ */ jsxs35("div", { className: "flex flex-col", children: [
+            /* @__PURE__ */ jsxs35("div", { className: "flex items-center gap-2", children: [
+              /* @__PURE__ */ jsx43(
+                "span",
+                {
+                  className: cn(
+                    "text-sm font-medium text-fg",
+                    isDone && "line-through text-fg-muted"
+                  ),
+                  children: task.title
+                }
+              ),
+              task.priority && /* @__PURE__ */ jsx43(Badge, { variant: priorityBadgeVariant[task.priority], className: "text-[10px] px-1 py-0", children: task.priority })
+            ] }),
+            (task.description || task.dueAt) && /* @__PURE__ */ jsxs35("div", { className: "mt-0.5 flex items-center gap-2 text-xs text-fg-muted", children: [
+              task.description && /* @__PURE__ */ jsx43("span", { children: task.description }),
+              task.dueAt && /* @__PURE__ */ jsxs35("span", { children: [
+                "Due: ",
+                task.dueAt
+              ] })
+            ] })
+          ] })
+        ] }),
+        onDelete && /* @__PURE__ */ jsx43(
+          "button",
+          {
+            type: "button",
+            onClick: () => onDelete(task.id),
+            className: "text-fg-muted hover:text-danger-fg text-xs p-1",
+            "aria-label": `Delete task ${task.title}`,
+            children: "\u2715"
+          }
+        )
+      ]
+    }
+  );
+}
+
+// src/tasks/TaskList.tsx
+import * as React27 from "react";
+import { jsx as jsx44, jsxs as jsxs36 } from "react/jsx-runtime";
+function TaskList({
+  tasks,
+  onToggleComplete,
+  onAddTask,
+  onDeleteTask,
+  className,
+  emptyTitle = "No tasks",
+  emptyDescription = "You have no tasks in this view."
+}) {
+  const [filter, setFilter] = React27.useState("all");
+  const [newTitle, setNewTitle] = React27.useState("");
+  const filtered = tasks.filter((t) => {
+    if (filter === "active") return !t.completed;
+    if (filter === "completed") return t.completed;
+    return true;
+  });
+  const handleAdd = (e) => {
+    e.preventDefault();
+    const trimmed = newTitle.trim();
+    if (!trimmed) return;
+    onAddTask?.(trimmed);
+    setNewTitle("");
+  };
+  return /* @__PURE__ */ jsxs36(
+    "div",
+    {
+      "data-slot": "task-list",
+      className: cn("yc-TaskList-root flex flex-col gap-3", className),
+      children: [
+        /* @__PURE__ */ jsxs36("div", { className: "flex items-center justify-between gap-3", children: [
+          /* @__PURE__ */ jsx44(
+            SegmentedControl,
+            {
+              size: "sm",
+              value: filter,
+              onChange: (v) => setFilter(v),
+              options: [
+                { value: "all", label: "All" },
+                { value: "active", label: "Active" },
+                { value: "completed", label: "Completed" }
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsxs36("span", { className: "text-xs text-fg-muted", children: [
+            tasks.filter((t) => !t.completed).length,
+            " remaining"
+          ] })
+        ] }),
+        onAddTask && /* @__PURE__ */ jsxs36("form", { onSubmit: handleAdd, className: "flex gap-2", children: [
+          /* @__PURE__ */ jsx44(
+            "input",
+            {
+              type: "text",
+              value: newTitle,
+              onChange: (e) => setNewTitle(e.target.value),
+              placeholder: "Add a new task...",
+              className: "flex-1 rounded-lg border border-border bg-surface-2 p-2 text-sm text-fg placeholder:text-fg-muted focus:border-primary focus:outline-none"
+            }
+          ),
+          /* @__PURE__ */ jsx44(Button, { type: "submit", variant: "primary", size: "sm", children: "Add" })
+        ] }),
+        filtered.length === 0 ? /* @__PURE__ */ jsx44(EmptyState, { title: emptyTitle, description: emptyDescription }) : /* @__PURE__ */ jsx44("div", { className: "flex flex-col gap-2", children: filtered.map((task) => /* @__PURE__ */ jsx44(
+          TaskItem,
+          {
+            task,
+            onToggleComplete,
+            onDelete: onDeleteTask
+          },
+          task.id
+        )) })
+      ]
+    }
+  );
+}
+
+// src/notifications/NotificationCenter.tsx
+import { jsx as jsx45, jsxs as jsxs37 } from "react/jsx-runtime";
+var levelBadgeVariant2 = {
+  info: "info",
+  warn: "warn",
+  danger: "danger",
+  success: "success"
+};
+function NotificationCenter({
+  notifications,
+  onMarkAllRead,
+  onDismiss,
+  onSelectNotification,
+  className
+}) {
+  const unreadCount = notifications.filter((n) => !n.read).length;
+  return /* @__PURE__ */ jsx45(
+    "div",
+    {
+      "data-slot": "notification-center",
+      className: cn("yc-NotificationCenter-root inline-block", className),
+      children: /* @__PURE__ */ jsxs37(Popover, { children: [
+        /* @__PURE__ */ jsxs37(PopoverTrigger, { className: "relative flex items-center justify-center p-2 rounded-lg border border-border bg-surface hover:bg-surface-2 transition-colors", children: [
+          /* @__PURE__ */ jsx45("span", { className: "text-base", role: "img", "aria-label": "Notifications", children: "\u{1F514}" }),
+          unreadCount > 0 && /* @__PURE__ */ jsx45("span", { className: "absolute -top-1 -end-1 flex h-4 w-4 items-center justify-center rounded-full bg-danger-fg text-[10px] font-bold text-white", children: unreadCount > 9 ? "9+" : unreadCount })
+        ] }),
+        /* @__PURE__ */ jsxs37(PopoverContent, { align: "end", className: "w-80 p-0 shadow-3", children: [
+          /* @__PURE__ */ jsxs37("div", { className: "flex items-center justify-between border-b border-border p-3", children: [
+            /* @__PURE__ */ jsxs37("div", { className: "flex items-center gap-2", children: [
+              /* @__PURE__ */ jsx45("span", { className: "font-semibold text-sm text-fg", children: "Notifications" }),
+              unreadCount > 0 && /* @__PURE__ */ jsxs37(Badge, { variant: "primary", children: [
+                unreadCount,
+                " new"
+              ] })
+            ] }),
+            unreadCount > 0 && onMarkAllRead && /* @__PURE__ */ jsx45(
+              "button",
+              {
+                type: "button",
+                onClick: onMarkAllRead,
+                className: "text-xs text-primary hover:underline font-medium",
+                children: "Mark all read"
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsx45("div", { className: "max-h-80 overflow-y-auto divide-y divide-border", children: notifications.length === 0 ? /* @__PURE__ */ jsx45("div", { className: "p-6 text-center text-xs text-fg-muted", children: "No notifications right now." }) : notifications.map((n) => /* @__PURE__ */ jsxs37(
+            "div",
+            {
+              onClick: () => onSelectNotification?.(n),
+              "data-slot": "notification-item",
+              "data-read": n.read ? "true" : void 0,
+              className: cn(
+                "flex items-start justify-between p-3 transition-colors text-start cursor-pointer",
+                n.read ? "bg-surface opacity-75" : "bg-surface-2/60"
+              ),
+              children: [
+                /* @__PURE__ */ jsxs37("div", { className: "flex flex-col gap-0.5 flex-1 pe-2", children: [
+                  /* @__PURE__ */ jsxs37("div", { className: "flex items-center gap-1.5", children: [
+                    n.level && /* @__PURE__ */ jsx45(Badge, { variant: levelBadgeVariant2[n.level], className: "text-[9px] px-1 py-0", children: n.level }),
+                    /* @__PURE__ */ jsx45("span", { className: "font-medium text-xs text-fg", children: n.title })
+                  ] }),
+                  n.description && /* @__PURE__ */ jsx45("p", { className: "text-[11px] text-fg-muted line-clamp-2", children: n.description }),
+                  /* @__PURE__ */ jsx45("span", { className: "text-[10px] text-fg-muted mt-1", children: n.timestamp })
+                ] }),
+                onDismiss && /* @__PURE__ */ jsx45(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: (e) => {
+                      e.stopPropagation();
+                      onDismiss(n.id);
+                    },
+                    className: "text-fg-muted hover:text-fg text-xs p-1",
+                    "aria-label": "Dismiss notification",
+                    children: "\u2715"
+                  }
+                )
+              ]
+            },
+            n.id
+          )) })
+        ] })
+      ] })
+    }
+  );
+}
+
+// src/settings/SettingsLayout.tsx
+import * as React29 from "react";
+
+// src/slots/SlotRenderer.tsx
+import { useEffect as useEffect7, useState as useState22 } from "react";
+import { Fragment as Fragment3, jsx as jsx46, jsxs as jsxs38 } from "react/jsx-runtime";
+var SlotRenderer = ({
+  contribution,
+  slotProps,
+  fallback = null
+}) => {
+  const [LoadedComp, setLoadedComp] = useState22(() => contribution.component ?? null);
+  const [error, setError] = useState22(null);
+  useEffect7(() => {
+    let cancelled = false;
+    if (contribution.component) {
+      setLoadedComp(() => contribution.component ?? null);
+      return;
+    }
+    if (contribution.load) {
+      contribution.load().then((mod) => {
+        if (!cancelled) {
+          setLoadedComp(() => mod.default);
+        }
+      }).catch((err) => {
+        if (!cancelled) {
+          setError(err instanceof Error ? err : new Error(String(err)));
+        }
+      });
+    }
+    return () => {
+      cancelled = true;
+    };
+  }, [contribution]);
+  if (error) {
+    return /* @__PURE__ */ jsxs38("div", { className: "yc-SlotRenderer-error text-danger text-sm p-4", "data-slot": "error", children: [
+      "Failed to load slot: ",
+      contribution.id
+    ] });
+  }
+  if (!LoadedComp) {
+    return /* @__PURE__ */ jsx46(Fragment3, { children: fallback });
+  }
+  return /* @__PURE__ */ jsx46("div", { className: "yc-SlotRenderer-root", "data-slot": "root", "data-pack": contribution.pack, "data-contribution": contribution.id, children: /* @__PURE__ */ jsx46(LoadedComp, { ...slotProps }) });
+};
+
+// src/settings/SettingsLayout.tsx
+import { jsx as jsx47, jsxs as jsxs39 } from "react/jsx-runtime";
+function SettingsLayout({
+  sections,
+  activeSectionId,
+  onSelectSection,
+  contributions = [],
+  slotProps,
+  children,
+  className
+}) {
+  const mergedSections = React29.useMemo(() => {
+    const list = [...sections];
+    const slotSections = contributions.filter((c) => c.slot === "settings.section").map((c) => ({
+      id: c.id,
+      title: c.title,
+      order: c.order ?? 50,
+      slotContribution: c
+    }));
+    list.push(...slotSections);
+    return list.sort((a, b) => (a.order ?? 50) - (b.order ?? 50));
+  }, [sections, contributions]);
+  const [selectedId, setSelectedId] = React29.useState(
+    activeSectionId || (mergedSections[0]?.id ?? "")
+  );
+  const currentId = activeSectionId !== void 0 ? activeSectionId : selectedId;
+  const currentSection = mergedSections.find((s) => s.id === currentId) || mergedSections[0];
+  const handleSelect = (id) => {
+    setSelectedId(id);
+    onSelectSection?.(id);
+  };
+  return /* @__PURE__ */ jsxs39(
+    "div",
+    {
+      "data-slot": "settings-layout",
+      className: cn(
+        "yc-SettingsLayout-root flex flex-col md:flex-row gap-6 w-full max-w-6xl mx-auto p-4 md:p-6",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxs39(
+          "nav",
+          {
+            "data-slot": "nav",
+            className: "yc-SettingsLayout-nav w-full md:w-64 shrink-0 flex flex-col gap-1",
+            "aria-label": "Settings navigation",
+            children: [
+              /* @__PURE__ */ jsx47("h2", { className: "text-lg font-bold text-fg px-3 pb-3", children: "Settings" }),
+              mergedSections.map((sec) => {
+                const isActive = sec.id === currentId;
+                return /* @__PURE__ */ jsxs39(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: () => handleSelect(sec.id),
+                    "data-slot": "nav-item",
+                    "data-active": isActive ? "true" : void 0,
+                    className: cn(
+                      "flex items-center gap-2.5 rounded-lg px-3 py-2 text-sm font-medium transition-colors text-start",
+                      isActive ? "bg-surface-2 text-fg font-semibold shadow-1" : "text-fg-muted hover:bg-surface-2/60 hover:text-fg"
+                    ),
+                    children: [
+                      sec.icon && /* @__PURE__ */ jsx47("span", { className: "inline-flex shrink-0", children: sec.icon }),
+                      /* @__PURE__ */ jsx47("span", { className: "truncate", children: sec.title })
+                    ]
+                  },
+                  sec.id
+                );
+              })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsx47(
+          "main",
+          {
+            "data-slot": "content",
+            className: "yc-SettingsLayout-content flex-1 rounded-xl border border-border bg-surface p-6 shadow-1",
+            children: currentSection && /* @__PURE__ */ jsxs39("div", { children: [
+              /* @__PURE__ */ jsxs39("div", { className: "border-b border-border pb-4 mb-6", children: [
+                /* @__PURE__ */ jsx47("h3", { className: "text-xl font-bold text-fg", children: currentSection.title }),
+                currentSection.description && /* @__PURE__ */ jsx47("p", { className: "mt-1 text-sm text-fg-muted", children: currentSection.description })
+              ] }),
+              currentSection.slotContribution && slotProps ? /* @__PURE__ */ jsx47(
+                SlotRenderer,
+                {
+                  contribution: currentSection.slotContribution,
+                  slotProps
+                }
+              ) : currentSection.component ? /* @__PURE__ */ jsx47(currentSection.component, {}) : children
+            ] })
+          }
+        )
+      ]
+    }
+  );
+}
+
+// src/settings/SettingsSectionSlotRenderer.tsx
+import { jsx as jsx48, jsxs as jsxs40 } from "react/jsx-runtime";
+function SettingsSectionSlotRenderer({
+  contributions,
+  slotProps,
+  className
+}) {
+  const sectionSlots = contributions.filter((c) => c.slot === "settings.section");
+  return /* @__PURE__ */ jsx48(
+    "div",
+    {
+      "data-slot": "settings-section-slot-renderer",
+      className: cn("yc-SettingsSectionSlotRenderer-root space-y-6", className),
+      children: sectionSlots.map((c) => /* @__PURE__ */ jsxs40(
+        "div",
+        {
+          className: "rounded-xl border border-border bg-surface p-6 shadow-1",
+          "data-slot": "slot-section",
+          children: [
+            /* @__PURE__ */ jsx48("div", { className: "border-b border-border pb-3 mb-4", children: /* @__PURE__ */ jsx48("h3", { className: "text-base font-semibold text-fg", children: c.title }) }),
+            /* @__PURE__ */ jsx48(SlotRenderer, { contribution: c, slotProps })
+          ]
+        },
+        c.id
+      ))
+    }
+  );
+}
+
+// src/shell/AppRail.tsx
+import * as React30 from "react";
+import { jsx as jsx49, jsxs as jsxs41 } from "react/jsx-runtime";
+function AppRail({
+  items,
+  contributions = [],
+  activeItemId,
+  onSelectItem,
+  brand,
+  footer,
+  collapsed = false,
+  className
+}) {
+  const allItems = React30.useMemo(() => {
+    const list = [...items];
+    const slotItems = contributions.filter((c) => c.slot === "sidebar.item").map((c) => ({
+      id: c.id,
+      label: c.title,
+      route: c.route,
+      slotContribution: c
+    }));
+    list.push(...slotItems);
+    return list;
+  }, [items, contributions]);
+  return /* @__PURE__ */ jsxs41(
+    "aside",
+    {
+      "data-slot": "app-rail",
+      "data-collapsed": collapsed ? "true" : void 0,
+      className: cn(
+        "yc-AppRail-root flex flex-col justify-between border-e border-border bg-surface text-fg transition-all duration-normal",
+        collapsed ? "w-16" : "w-64",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxs41("div", { className: "flex flex-col", children: [
+          brand && /* @__PURE__ */ jsx49("div", { className: "flex items-center gap-3 border-b border-border p-4", "data-slot": "brand", children: brand }),
+          /* @__PURE__ */ jsx49("nav", { className: "flex flex-col gap-1 p-2", "aria-label": "Main Navigation", children: allItems.map((item) => {
+            const isActive = item.active || item.id === activeItemId;
+            return /* @__PURE__ */ jsxs41(
+              "button",
+              {
+                type: "button",
+                onClick: () => {
+                  item.onClick?.();
+                  onSelectItem?.(item);
+                },
+                "data-slot": "rail-item",
+                "data-active": isActive ? "true" : void 0,
+                className: cn(
+                  "flex items-center gap-3 rounded-lg px-3 py-2 text-sm font-medium transition-colors text-start",
+                  collapsed && "justify-center px-2",
+                  isActive ? "bg-surface-2 text-primary font-semibold shadow-1" : "text-fg-muted hover:bg-surface-2/60 hover:text-fg"
+                ),
+                title: collapsed ? item.label : void 0,
+                children: [
+                  item.icon && /* @__PURE__ */ jsx49("span", { className: "inline-flex shrink-0", children: item.icon }),
+                  !collapsed && /* @__PURE__ */ jsx49("span", { className: "truncate flex-1", children: item.label }),
+                  !collapsed && item.badge !== void 0 && /* @__PURE__ */ jsx49("span", { className: "rounded-full bg-primary-subtle px-1.5 py-0.5 text-[10px] font-bold text-primary", children: item.badge })
+                ]
+              },
+              item.id
+            );
+          }) })
+        ] }),
+        footer && /* @__PURE__ */ jsx49("div", { className: "border-t border-border p-3", "data-slot": "footer", children: footer })
+      ]
+    }
+  );
+}
+
+// src/shell/MobileTopBar.tsx
+import { jsx as jsx50, jsxs as jsxs42 } from "react/jsx-runtime";
+function MobileTopBar({
+  title,
+  startSlot,
+  endSlot,
+  leftSlot,
+  rightSlot,
+  className
+}) {
+  const leading = startSlot || leftSlot;
+  const trailing = endSlot || rightSlot;
+  return /* @__PURE__ */ jsxs42(
+    "header",
+    {
+      "data-slot": "mobile-top-bar",
+      className: cn(
+        "yc-MobileTopBar-root flex items-center justify-between border-b border-border bg-surface px-4 py-2.5 text-fg md:hidden z-30 sticky top-0",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsx50("div", { className: "flex items-center gap-2", "data-slot": "start-slot", children: leading }),
+        title && /* @__PURE__ */ jsx50("h1", { className: "text-base font-bold text-fg truncate text-center flex-1 px-2", "data-slot": "title", children: title }),
+        /* @__PURE__ */ jsx50("div", { className: "flex items-center gap-2", "data-slot": "end-slot", children: trailing })
+      ]
+    }
+  );
+}
+
+// src/shell/MobileTabBar.tsx
+import { jsx as jsx51, jsxs as jsxs43 } from "react/jsx-runtime";
+function MobileTabBar({
+  items,
+  activeItemId,
+  onSelectItem,
+  className
+}) {
+  return /* @__PURE__ */ jsx51(
+    "nav",
+    {
+      "data-slot": "mobile-tab-bar",
+      className: cn(
+        "yc-MobileTabBar-root fixed bottom-0 inset-x-0 z-30 flex items-center justify-around border-t border-border bg-surface px-2 py-1 md:hidden",
+        className
+      ),
+      "aria-label": "Mobile Navigation",
+      children: items.map((item) => {
+        const isActive = item.active || item.id === activeItemId;
+        return /* @__PURE__ */ jsxs43(
+          "button",
+          {
+            type: "button",
+            onClick: () => {
+              item.onClick?.();
+              onSelectItem?.(item);
+            },
+            "data-slot": "tab-item",
+            "data-active": isActive ? "true" : void 0,
+            className: cn(
+              "flex flex-col items-center justify-center flex-1 py-1.5 px-1 text-[11px] font-medium transition-colors min-h-[44px]",
+              isActive ? "text-primary font-bold" : "text-fg-muted hover:text-fg"
+            ),
+            children: [
+              item.icon && /* @__PURE__ */ jsx51("span", { className: "text-lg leading-none mb-0.5", children: item.icon }),
+              /* @__PURE__ */ jsx51("span", { className: "truncate max-w-[64px]", children: item.label })
+            ]
+          },
+          item.id
+        );
+      })
+    }
+  );
+}
+
+// src/shell/AppLayout.tsx
+import { jsx as jsx52, jsxs as jsxs44 } from "react/jsx-runtime";
+function AppLayout({
+  items,
+  contributions = [],
+  activeItemId,
+  onSelectItem,
+  brand,
+  railFooter,
+  mobileTopLeft,
+  mobileTopRight,
+  children,
+  className
+}) {
+  const activeItem = items.find((i) => i.id === activeItemId) || items[0];
+  return /* @__PURE__ */ jsxs44(
+    "div",
+    {
+      "data-slot": "app-layout",
+      className: cn(
+        "yc-AppLayout-root flex h-screen w-screen overflow-hidden bg-bg text-fg",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsx52("div", { className: "hidden md:flex h-full shrink-0", children: /* @__PURE__ */ jsx52(
+          AppRail,
+          {
+            items,
+            contributions,
+            activeItemId,
+            onSelectItem,
+            brand,
+            footer: railFooter
+          }
+        ) }),
+        /* @__PURE__ */ jsxs44("div", { className: "flex flex-1 flex-col h-full overflow-hidden", children: [
+          /* @__PURE__ */ jsx52(
+            MobileTopBar,
+            {
+              title: activeItem?.label,
+              leftSlot: mobileTopLeft,
+              rightSlot: mobileTopRight
+            }
+          ),
+          /* @__PURE__ */ jsx52(
+            "main",
+            {
+              "data-slot": "main-content",
+              className: "yc-AppLayout-content flex-1 overflow-y-auto pb-16 md:pb-0",
+              children
+            }
+          ),
+          /* @__PURE__ */ jsx52(
+            MobileTabBar,
+            {
+              items: items.slice(0, 5),
+              activeItemId,
+              onSelectItem
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}
+
+// src/slots/types.ts
+function definePackUi(def) {
+  return {
+    pack: def.pack,
+    contributions: def.contributions,
+    messages: def.messages
+  };
+}
+function matchesScopePattern(pattern, target) {
+  if (pattern === "*" || pattern === target) return true;
+  if (pattern.endsWith(".*")) {
+    const prefix = pattern.slice(0, -2);
+    return target === prefix || target.startsWith(`${prefix}.`);
+  }
+  return false;
+}
+function isScopeSatisfied(requiredScope, activeScopes) {
+  return activeScopes.some((active) => matchesScopePattern(active, requiredScope));
+}
+function filterSlotContributions(contributions, options = {}) {
+  const { slot, enabledPacks, activeScopes, hiddenPanels = [], audience } = options;
+  return contributions.filter((c) => {
+    if (slot && c.slot !== slot) return false;
+    if (enabledPacks && !enabledPacks.includes(c.pack)) return false;
+    if (hiddenPanels.includes(c.id)) return false;
+    if (audience && c.audiences && c.audiences.length > 0 && !c.audiences.includes(audience)) {
+      return false;
+    }
+    if (activeScopes && c.requiredScopes && c.requiredScopes.length > 0) {
+      const allSatisfied = c.requiredScopes.every((req) => isScopeSatisfied(req, activeScopes));
+      if (!allSatisfied) return false;
+    }
+    return true;
+  }).sort((a, b) => (a.order ?? 100) - (b.order ?? 100));
+}
+
+// src/provider/UiProvider.tsx
+import { createContext as createContext8, useContext as useContext8, useEffect as useEffect8, useState as useState24 } from "react";
+import { jsx as jsx53 } from "react/jsx-runtime";
+var defaultI18n = {
+  locale: "en-US",
+  t: (_id, defaultText) => defaultText || _id
+};
+var UiContext = createContext8({
+  theme: "system",
+  resolvedTheme: "light",
+  setTheme: () => {
+  },
+  product: { name: "Yarvelle" },
+  storageNamespace: "yarvelle",
+  i18n: defaultI18n
+});
+var UiProvider = ({
+  children,
+  defaultTheme = "system",
+  product = { name: "Yarvelle" },
+  storageNamespace = "yarvelle",
+  locale = "en-US",
+  messages = {}
+}) => {
+  const [theme, setThemeState] = useState24(defaultTheme);
+  const [resolvedTheme, setResolvedTheme] = useState24("light");
+  useEffect8(() => {
+    const root = document.documentElement;
+    const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
+    const updateTheme = () => {
+      let isDark = false;
+      if (theme === "dark") {
+        isDark = true;
+      } else if (theme === "system") {
+        isDark = mediaQuery.matches;
+      }
+      setResolvedTheme(isDark ? "dark" : "light");
+      root.setAttribute("data-theme", isDark ? "dark" : "light");
+      if (isDark) {
+        root.classList.add("dark");
+      } else {
+        root.classList.remove("dark");
+      }
+    };
+    updateTheme();
+    mediaQuery.addEventListener("change", updateTheme);
+    return () => mediaQuery.removeEventListener("change", updateTheme);
+  }, [theme]);
+  const t = (id, defaultText) => {
+    if (messages[id]) {
+      return messages[id];
+    }
+    return defaultText || id;
+  };
+  const value = {
+    theme,
+    resolvedTheme,
+    setTheme: setThemeState,
+    product,
+    storageNamespace,
+    i18n: { locale, t }
+  };
+  return /* @__PURE__ */ jsx53(UiContext.Provider, { value, children });
+};
+var useUi = () => useContext8(UiContext);
+var useTheme = () => {
+  const { theme, resolvedTheme, setTheme } = useUi();
+  return { theme, resolvedTheme, setTheme };
+};
+var useProduct = () => useUi().product;
+var useStorageNamespace = () => useUi().storageNamespace;
+var useI18n = () => useUi().i18n;
+
+// src/testing/index.ts
+function createMockSlotContribution(overrides) {
+  return {
+    id: "test-slot-1",
+    pack: "test-pack",
+    slot: "dashboard.card",
+    title: "Test Card",
+    requiredScopes: ["general"],
+    order: 10,
+    ...overrides
+  };
+}
+function createMockProfile(overrides) {
+  return {
+    id: "profile-1",
+    displayName: "Primary User",
+    role: "owner",
+    scopes: ["general", "notes", "calendar"],
+    ...overrides
+  };
+}
+function createMockChatMessage(overrides) {
+  return {
+    id: "msg-1",
+    role: "user",
+    content: "Hello, world!",
+    createdAt: "12:00 PM",
+    ...overrides
+  };
+}
+
+// src/lib/storage-namespace.ts
+function getStorageKey(namespace, key, suffix) {
+  const base = `${namespace}_${key}`;
+  return suffix ? `${base}_${suffix}` : base;
+}
+function getScopedItem(namespace, key, suffix) {
+  if (typeof window === "undefined") return null;
+  try {
+    return localStorage.getItem(getStorageKey(namespace, key, suffix));
+  } catch {
+    return null;
+  }
+}
+function setScopedItem(namespace, key, value, suffix) {
+  if (typeof window === "undefined") return;
+  try {
+    localStorage.setItem(getStorageKey(namespace, key, suffix), value);
+  } catch {
+  }
+}
+function removeScopedItem(namespace, key, suffix) {
+  if (typeof window === "undefined") return;
+  try {
+    localStorage.removeItem(getStorageKey(namespace, key, suffix));
+  } catch {
+  }
+}
+export {
+  ActivityLogDrawer,
+  ActivityTimeline,
+  AppLayout,
+  AppRail,
+  ApprovalCard,
+  Avatar,
+  AvatarFallback,
+  AvatarImage,
+  Badge,
+  Button,
+  Calendar,
+  Card,
+  CardContent,
+  CardDescription,
+  CardFooter,
+  CardHeader,
+  CardTitle,
+  Chat,
+  ChatAttachments,
+  ChatComposer,
+  ChatConnected,
+  ChatMarkdown,
+  ChatMessageItem,
+  ChatRoot,
+  ChatThread,
+  Chip,
+  CodeBlock,
+  Dialog,
+  DialogClose,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+  DialogTrigger,
+  EmptyState,
+  ExecutionPlanCard,
+  InlineError,
+  MemberCard,
+  Menu,
+  MenuContent,
+  MenuItem,
+  MenuSeparator,
+  MenuTrigger,
+  MermaidDiagram,
+  MessageToolbar,
+  MobileTabBar,
+  MobileTopBar,
+  ModelSelector,
+  NoteView,
+  NotesList,
+  NotificationCenter,
+  Popover,
+  PopoverContent,
+  PopoverTrigger,
+  ProfileEditModal,
+  ProfileSwitcher,
+  RecordSearch,
+  Reminders,
+  RoleMatrix,
+  Routines,
+  ScheduleAgenda,
+  SegmentedControl,
+  SettingsLayout,
+  SettingsSectionSlotRenderer,
+  ShareBundle,
+  Sheet,
+  SheetClose,
+  SheetContent,
+  SheetDescription,
+  SheetFooter,
+  SheetHeader,
+  SheetTitle,
+  SheetTrigger,
+  Skeleton,
+  SlotRenderer,
+  Tabs,
+  TabsContent,
+  TabsList,
+  TabsTrigger,
+  TaskItem,
+  TaskList,
+  TeenHandoverBanner,
+  ThinkingIndicator,
+  ToastProvider,
+  Toaster,
+  ToolTraceCard,
+  UiProvider,
+  ViewerInvite,
+  cn,
+  createMockChatMessage,
+  createMockProfile,
+  createMockSlotContribution,
+  definePackUi,
+  filterSlotContributions,
+  getScopedItem,
+  getStorageKey,
+  isScopeSatisfied,
+  matchesScopePattern,
+  removeScopedItem,
+  setScopedItem,
+  useChatContext,
+  useI18n,
+  useProduct,
+  useStorageNamespace,
+  useTheme,
+  useToast,
+  useUi,
+  yarvellePreset
+};
+//# sourceMappingURL=index.js.map