@refraction-ui/react 0.12.3 → 0.13.0

package/dist/index.cjs

@@ -36105,19 +36105,33 @@ function InlineEditor({
 InlineEditor.displayName = "InlineEditor";
 
 // ../input/dist/index.js
+function resolveAriaInvalid(ariaInvalid, validationState) {
+  if (ariaInvalid !== void 0) {
+    return ariaInvalid;
+  }
+  if (validationState === "invalid") {
+    return true;
+  }
+  if (validationState === "valid") {
+    return false;
+  }
+  return void 0;
+}
 function createInput(props = {}) {
   const {
     disabled = false,
     readOnly = false,
     required = false,
-    "aria-invalid": ariaInvalid
+    "aria-invalid": ariaInvalid,
+    validationState
   } = props;
+  const resolvedInvalid = resolveAriaInvalid(ariaInvalid, validationState);
   const ariaProps = {};
   if (disabled) {
     ariaProps["aria-disabled"] = true;
   }
-  if (ariaInvalid) {
-    ariaProps["aria-invalid"] = true;
+  if (resolvedInvalid !== void 0) {
+    ariaProps["aria-invalid"] = resolvedInvalid;
   }
   if (required) {
     ariaProps["aria-required"] = true;
@@ -36129,7 +36143,7 @@ function createInput(props = {}) {
   if (readOnly) {
     dataAttributes["data-readonly"] = "";
   }
-  if (ariaInvalid) {
+  if (resolvedInvalid === true) {
     dataAttributes["data-invalid"] = "";
   }
   return {
@@ -36144,22 +36158,58 @@ var inputVariants = cva({
       sm: "h-8 text-xs",
       default: "h-9",
       lg: "h-10 text-base"
+    },
+    validationState: {
+      valid: "border-green-500 focus-visible:ring-green-500",
+      invalid: "border-destructive focus-visible:ring-destructive"
     }
   },
   defaultVariants: {
     size: "default"
   }
 });
+var CheckIcon = /* @__PURE__ */ jsxRuntime.jsx(
+  "svg",
+  {
+    "aria-hidden": "true",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    className: "pointer-events-none absolute right-3 top-1/2 size-4 -translate-y-1/2 text-green-500",
+    children: /* @__PURE__ */ jsxRuntime.jsx("polyline", { points: "20 6 9 17 4 12" })
+  }
+);
 var Input = React11__namespace.forwardRef(
-  ({ type = "text", size, className, disabled, readOnly, required, "aria-invalid": ariaInvalid, ...props }, ref) => {
+  ({
+    type = "text",
+    size,
+    className,
+    disabled,
+    readOnly,
+    required,
+    validationState,
+    leadingIcon,
+    "aria-invalid": ariaInvalid,
+    ...props
+  }, ref) => {
     const api = createInput({
       disabled,
       readOnly,
       required,
-      "aria-invalid": ariaInvalid === true ? true : void 0
+      "aria-invalid": ariaInvalid === void 0 ? void 0 : ariaInvalid === true || ariaInvalid === "true",
+      validationState
     });
-    const classes = cn(inputVariants({ size }), className);
-    return /* @__PURE__ */ jsxRuntime.jsx(
+    const hasWrapper = leadingIcon != null || validationState != null;
+    const classes = cn(
+      inputVariants({ size, validationState }),
+      leadingIcon != null && "pl-9",
+      validationState === "valid" && "pr-9",
+      className
+    );
+    const inputEl = /* @__PURE__ */ jsxRuntime.jsx(
       "input",
       {
         ref,
@@ -36173,6 +36223,21 @@ var Input = React11__namespace.forwardRef(
         ...props
       }
     );
+    if (!hasWrapper) {
+      return inputEl;
+    }
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
+      leadingIcon != null && /* @__PURE__ */ jsxRuntime.jsx(
+        "span",
+        {
+          "aria-hidden": "true",
+          className: "pointer-events-none absolute left-3 top-1/2 flex size-4 -translate-y-1/2 items-center justify-center text-muted-foreground",
+          children: leadingIcon
+        }
+      ),
+      inputEl,
+      validationState === "valid" && CheckIcon
+    ] });
   }
 );
 Input.displayName = "Input";
@@ -47081,6 +47146,590 @@ function useTrackEvent(options) {
     [analytics]
   );
 }
+
+// ../segmented-control/dist/index.js
+function createSegmentedControl(props = {}) {
+  const { value, size = "md" } = props;
+  const ariaProps = {
+    role: "radiogroup"
+  };
+  const dataAttributes = {
+    "data-size": size
+  };
+  if (value !== void 0) {
+    dataAttributes["data-value"] = value;
+  }
+  return { ariaProps, dataAttributes };
+}
+function getNextSegmentIndex(current, key, count) {
+  if (count <= 0) return current;
+  switch (key) {
+    case "ArrowRight":
+    case "ArrowDown":
+      return (current + 1) % count;
+    case "ArrowLeft":
+    case "ArrowUp":
+      return (current - 1 + count) % count;
+    case "Home":
+      return 0;
+    case "End":
+      return count - 1;
+    default:
+      return current;
+  }
+}
+var segmentedControlVariants = cva({
+  base: "inline-flex items-center gap-1 rounded-lg bg-muted p-1",
+  variants: {
+    size: {
+      sm: "",
+      md: ""
+    }
+  },
+  defaultVariants: {
+    size: "md"
+  }
+});
+var segmentedControlItemVariants = cva({
+  base: [
+    "inline-flex items-center justify-center gap-1.5 rounded-md font-medium",
+    "whitespace-nowrap transition-colors",
+    "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+    "focus-visible:ring-offset-2 focus-visible:ring-offset-muted"
+  ].join(" "),
+  variants: {
+    size: {
+      sm: "px-2.5 py-1 text-xs",
+      md: "px-3 py-1.5 text-sm"
+    },
+    state: {
+      checked: "bg-background text-foreground shadow-sm",
+      unchecked: "text-muted-foreground hover:text-foreground"
+    }
+  },
+  defaultVariants: {
+    size: "md",
+    state: "unchecked"
+  }
+});
+var SegmentedControlContext = React11__namespace.createContext(null);
+function useSegmentedControlContext(component) {
+  const ctx = React11__namespace.useContext(SegmentedControlContext);
+  if (!ctx) {
+    throw new Error(`<${component}> must be used within <SegmentedControl>`);
+  }
+  return ctx;
+}
+var SegmentedControl = React11__namespace.forwardRef(
+  ({
+    value: valueProp,
+    defaultValue,
+    onValueChange,
+    size = "md",
+    className,
+    children,
+    ...props
+  }, ref) => {
+    const isControlled = valueProp !== void 0;
+    const [internalValue, setInternalValue] = React11__namespace.useState(defaultValue);
+    const value = isControlled ? valueProp : internalValue;
+    const itemsRef = React11__namespace.useRef([]);
+    const select = React11__namespace.useCallback(
+      (next) => {
+        if (!isControlled) setInternalValue(next);
+        onValueChange?.(next);
+      },
+      [isControlled, onValueChange]
+    );
+    const register = React11__namespace.useCallback((itemValue, focus) => {
+      const entry = { value: itemValue, focus };
+      itemsRef.current.push(entry);
+      return () => {
+        itemsRef.current = itemsRef.current.filter((e2) => e2 !== entry);
+      };
+    }, []);
+    const move = React11__namespace.useCallback(
+      (from, key) => {
+        const items = itemsRef.current;
+        const currentIndex = items.findIndex((e2) => e2.value === from);
+        if (currentIndex === -1) return;
+        const targetIndex = getNextSegmentIndex(currentIndex, key, items.length);
+        if (targetIndex === currentIndex) return;
+        const target = items[targetIndex];
+        select(target.value);
+        target.focus();
+      },
+      [select]
+    );
+    const ctx = React11__namespace.useMemo(
+      () => ({ value, size, select, register, move }),
+      [value, size, select, register, move]
+    );
+    const api = createSegmentedControl({ value, size });
+    return /* @__PURE__ */ jsxRuntime.jsx(SegmentedControlContext.Provider, { value: ctx, children: /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        ref,
+        className: cn(segmentedControlVariants({ size }), className),
+        ...api.ariaProps,
+        ...api.dataAttributes,
+        ...props,
+        children
+      }
+    ) });
+  }
+);
+SegmentedControl.displayName = "SegmentedControl";
+var SegmentedControlItem = React11__namespace.forwardRef(({ value, className, children, onKeyDown, onClick, ...props }, ref) => {
+  const ctx = useSegmentedControlContext("SegmentedControlItem");
+  const selected = ctx.value === value;
+  const internalRef = React11__namespace.useRef(null);
+  const mergedRef = React11__namespace.useCallback(
+    (node) => {
+      internalRef.current = node;
+      if (typeof ref === "function") ref(node);
+      else if (ref) ref.current = node;
+    },
+    [ref]
+  );
+  React11__namespace.useEffect(() => {
+    return ctx.register(value, () => internalRef.current?.focus());
+  }, [ctx, value]);
+  const handleKeyDown = (event) => {
+    onKeyDown?.(event);
+    if (event.defaultPrevented) return;
+    switch (event.key) {
+      case "ArrowRight":
+      case "ArrowDown":
+      case "ArrowLeft":
+      case "ArrowUp":
+      case "Home":
+      case "End":
+        event.preventDefault();
+        ctx.move(value, event.key);
+        break;
+      case " ":
+      case "Enter":
+        event.preventDefault();
+        ctx.select(value);
+        break;
+    }
+  };
+  const handleClick = (event) => {
+    onClick?.(event);
+    if (event.defaultPrevented) return;
+    ctx.select(value);
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "button",
+    {
+      ref: mergedRef,
+      type: "button",
+      role: "radio",
+      "aria-checked": selected,
+      tabIndex: selected ? 0 : -1,
+      "data-state": selected ? "checked" : "unchecked",
+      className: cn(
+        segmentedControlItemVariants({
+          size: ctx.size,
+          state: selected ? "checked" : "unchecked"
+        }),
+        className
+      ),
+      onKeyDown: handleKeyDown,
+      onClick: handleClick,
+      ...props,
+      children
+    }
+  );
+});
+SegmentedControlItem.displayName = "SegmentedControlItem";
+
+// ../password-input/dist/index.js
+var DEFAULT_REVEAL_LABEL = "Show password";
+var DEFAULT_HIDE_LABEL = "Hide password";
+function createPasswordInput(props = {}) {
+  const {
+    revealed = false,
+    revealLabel = DEFAULT_REVEAL_LABEL,
+    hideLabel = DEFAULT_HIDE_LABEL
+  } = props;
+  return {
+    inputType: revealed ? "text" : "password",
+    toggleLabel: revealed ? hideLabel : revealLabel,
+    togglePressed: revealed
+  };
+}
+var passwordToggleVariants = cva({
+  base: "absolute right-2 top-1/2 flex size-7 -translate-y-1/2 items-center justify-center rounded-md text-muted-foreground transition-colors hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+});
+var EyeIcon = /* @__PURE__ */ jsxRuntime.jsxs(
+  "svg",
+  {
+    "aria-hidden": "true",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    className: "size-4",
+    children: [
+      /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M2 12s3-7 10-7 10 7 10 7-3 7-10 7-10-7-10-7Z" }),
+      /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "3" })
+    ]
+  }
+);
+var EyeOffIcon = /* @__PURE__ */ jsxRuntime.jsxs(
+  "svg",
+  {
+    "aria-hidden": "true",
+    viewBox: "0 0 24 24",
+    fill: "none",
+    stroke: "currentColor",
+    strokeWidth: "2",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    className: "size-4",
+    children: [
+      /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M9.88 9.88a3 3 0 1 0 4.24 4.24" }),
+      /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M10.73 5.08A10.43 10.43 0 0 1 12 5c7 0 10 7 10 7a13.16 13.16 0 0 1-1.67 2.68" }),
+      /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M6.61 6.61A13.526 13.526 0 0 0 2 12s3 7 10 7a9.74 9.74 0 0 0 5.39-1.61" }),
+      /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "2", x2: "22", y1: "2", y2: "22" })
+    ]
+  }
+);
+var PasswordInput = React11__namespace.forwardRef(
+  ({ revealLabel = "Show password", hideLabel = "Hide password", className, ...props }, ref) => {
+    const [revealed, setRevealed] = React11__namespace.useState(false);
+    const { inputType, toggleLabel, togglePressed } = createPasswordInput({
+      revealed,
+      revealLabel,
+      hideLabel
+    });
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        Input,
+        {
+          ref,
+          type: inputType,
+          className: cn("pr-10", className),
+          ...props
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          type: "button",
+          "aria-label": toggleLabel,
+          "aria-pressed": togglePressed,
+          onClick: () => setRevealed((v2) => !v2),
+          className: passwordToggleVariants(),
+          children: revealed ? EyeOffIcon : EyeIcon
+        }
+      )
+    ] });
+  }
+);
+PasswordInput.displayName = "PasswordInput";
+
+// ../social-auth-button/dist/index.js
+var PROVIDER_LABELS = {
+  google: "Continue with Google",
+  github: "Continue with GitHub",
+  microsoft: "Continue with Microsoft",
+  apple: "Continue with Apple"
+};
+var PROVIDER_MONO = {
+  google: false,
+  github: true,
+  microsoft: false,
+  apple: true
+};
+function createSocialAuthButton(props) {
+  const { provider } = props;
+  return {
+    dataAttributes: { "data-provider": provider },
+    label: PROVIDER_LABELS[provider],
+    mono: PROVIDER_MONO[provider]
+  };
+}
+var socialAuthButtonVariants = cva({
+  base: "relative"
+});
+var socialAuthRowVariants = cva({
+  base: "grid grid-cols-1 sm:grid-cols-2 gap-3"
+});
+var lastUsedBadgeVariants = cva({
+  base: "absolute -top-2 -right-2 rounded-full bg-primary text-primary-foreground text-[10px] px-1.5"
+});
+var baseProps = {
+  width: 18,
+  height: 18,
+  viewBox: "0 0 24 24",
+  xmlns: "http://www.w3.org/2000/svg",
+  "aria-hidden": true
+};
+function GoogleIcon({ mono, ...props }) {
+  if (mono) {
+    return /* @__PURE__ */ jsxRuntime.jsx("svg", { ...baseProps, ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
+      "path",
+      {
+        fill: "currentColor",
+        d: "M21.35 11.1H12v2.92h5.35c-.23 1.4-1.65 4.1-5.35 4.1a5.99 5.99 0 0 1 0-11.98c1.71 0 2.86.73 3.52 1.36l2.4-2.31C16.46 3.7 14.43 2.8 12 2.8a9.2 9.2 0 1 0 0 18.4c5.31 0 8.82-3.73 8.82-8.99 0-.6-.07-1.06-.17-1.51Z"
+      }
+    ) });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs("svg", { ...baseProps, ...props, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "path",
+      {
+        fill: "#4285F4",
+        d: "M21.35 11.1H12v2.92h5.35c-.23 1.4-1.65 4.1-5.35 4.1a5.99 5.99 0 0 1 0-11.98c1.71 0 2.86.73 3.52 1.36l2.4-2.31C16.46 3.7 14.43 2.8 12 2.8a9.2 9.2 0 0 0 0 18.4c5.31 0 8.82-3.73 8.82-8.99 0-.6-.07-1.06-.17-1.51Z"
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "path",
+      {
+        fill: "#34A853",
+        d: "M3.88 7.55l2.41 1.77C6.93 7.76 8.32 6.74 10 6.4l-.34-2.85C7.06 4.02 4.93 5.5 3.88 7.55Z",
+        opacity: 0
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "path",
+      {
+        fill: "#FBBC05",
+        d: "M12 21.2c2.43 0 4.46-.8 5.95-2.18l-2.74-2.13c-.74.5-1.74.86-3.21.86-2.66 0-4.92-1.79-5.73-4.2l-2.84 2.18A9.2 9.2 0 0 0 12 21.2Z",
+        opacity: 0
+      }
+    )
+  ] });
+}
+function GitHubIcon({ mono: _mono, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("svg", { ...baseProps, ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
+    "path",
+    {
+      fill: "currentColor",
+      d: "M12 2a10 10 0 0 0-3.16 19.49c.5.09.68-.22.68-.48l-.01-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.11-1.46-1.11-1.46-.91-.62.07-.61.07-.61 1 .07 1.53 1.03 1.53 1.03.9 1.53 2.36 1.09 2.94.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.65 0 0 .84-.27 2.75 1.02a9.6 9.6 0 0 1 5 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.38.2 2.4.1 2.65.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.69-4.57 4.94.36.31.68.92.68 1.85l-.01 2.74c0 .27.18.58.69.48A10 10 0 0 0 12 2Z"
+    }
+  ) });
+}
+function MicrosoftIcon({ mono, ...props }) {
+  if (mono) {
+    return /* @__PURE__ */ jsxRuntime.jsxs("svg", { ...baseProps, ...props, children: [
+      /* @__PURE__ */ jsxRuntime.jsx("path", { fill: "currentColor", d: "M3 3h8v8H3z" }),
+      /* @__PURE__ */ jsxRuntime.jsx("path", { fill: "currentColor", d: "M13 3h8v8h-8z", opacity: 0.7 }),
+      /* @__PURE__ */ jsxRuntime.jsx("path", { fill: "currentColor", d: "M3 13h8v8H3z", opacity: 0.7 }),
+      /* @__PURE__ */ jsxRuntime.jsx("path", { fill: "currentColor", d: "M13 13h8v8h-8z", opacity: 0.4 })
+    ] });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxs("svg", { ...baseProps, ...props, children: [
+    /* @__PURE__ */ jsxRuntime.jsx("path", { fill: "#F25022", d: "M3 3h8v8H3z" }),
+    /* @__PURE__ */ jsxRuntime.jsx("path", { fill: "#7FBA00", d: "M13 3h8v8h-8z" }),
+    /* @__PURE__ */ jsxRuntime.jsx("path", { fill: "#00A4EF", d: "M3 13h8v8H3z" }),
+    /* @__PURE__ */ jsxRuntime.jsx("path", { fill: "#FFB900", d: "M13 13h8v8h-8z" })
+  ] });
+}
+function AppleIcon({ mono: _mono, ...props }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("svg", { ...baseProps, ...props, children: /* @__PURE__ */ jsxRuntime.jsx(
+    "path",
+    {
+      fill: "currentColor",
+      d: "M16.37 12.78c-.03-2.62 2.14-3.88 2.24-3.94-1.22-1.79-3.12-2.03-3.79-2.06-1.61-.16-3.15.95-3.97.95-.82 0-2.08-.93-3.42-.9-1.76.03-3.39 1.02-4.29 2.6-1.83 3.18-.47 7.88 1.31 10.46.87 1.26 1.91 2.67 3.27 2.62 1.31-.05 1.81-.85 3.4-.85 1.58 0 2.03.85 3.42.82 1.41-.02 2.31-1.28 3.17-2.55.99-1.46 1.4-2.88 1.42-2.95-.03-.01-2.73-1.05-2.76-4.15M13.9 5.1c.72-.88 1.21-2.09 1.08-3.3-1.04.04-2.3.69-3.04 1.56-.66.77-1.24 2.01-1.09 3.19 1.16.09 2.34-.59 3.05-1.45"
+    }
+  ) });
+}
+var PROVIDER_ICONS = {
+  google: GoogleIcon,
+  github: GitHubIcon,
+  microsoft: MicrosoftIcon,
+  apple: AppleIcon
+};
+var SocialAuthButton = React11__namespace.forwardRef(({ provider, lastUsed, loading, disabled, className, ...props }, ref) => {
+  const { label, mono, dataAttributes } = createSocialAuthButton({ provider });
+  const Icon = PROVIDER_ICONS[provider];
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: socialAuthButtonVariants(), children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      Button,
+      {
+        ref,
+        variant: "outline",
+        loading,
+        disabled,
+        className: cn("w-full justify-center gap-2", className),
+        ...dataAttributes,
+        ...props,
+        children: [
+          !loading && /* @__PURE__ */ jsxRuntime.jsx(Icon, { mono, className: "shrink-0" }),
+          label
+        ]
+      }
+    ),
+    lastUsed && /* @__PURE__ */ jsxRuntime.jsx("span", { className: lastUsedBadgeVariants(), children: "Last used" })
+  ] });
+});
+SocialAuthButton.displayName = "SocialAuthButton";
+var SocialAuthRow = React11__namespace.forwardRef(
+  ({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ref,
+      className: cn(socialAuthRowVariants(), className),
+      ...props,
+      children
+    }
+  )
+);
+SocialAuthRow.displayName = "SocialAuthRow";
+
+// ../separator/dist/index.js
+function createSeparator(props = {}) {
+  const { orientation = "horizontal", decorative = true } = props;
+  const ariaProps = decorative ? { role: "none" } : { role: "separator", "aria-orientation": orientation };
+  const dataAttributes = {
+    "data-orientation": orientation
+  };
+  return {
+    ariaProps,
+    dataAttributes
+  };
+}
+var separatorVariants = cva({
+  base: "",
+  variants: {
+    orientation: {
+      horizontal: "h-px w-full bg-border",
+      vertical: "w-px h-full bg-border"
+    },
+    labeled: {
+      true: "flex items-center",
+      false: ""
+    }
+  },
+  defaultVariants: {
+    orientation: "horizontal",
+    labeled: "false"
+  }
+});
+var separatorLineClass = "h-px flex-1 bg-border";
+var separatorLabelClass = "px-3 text-xs uppercase tracking-wide text-muted-foreground";
+var Separator = React11__namespace.forwardRef(
+  ({
+    orientation = "horizontal",
+    label,
+    decorative = true,
+    className,
+    ...props
+  }, ref) => {
+    if (orientation === "horizontal" && label != null) {
+      return /* @__PURE__ */ jsxRuntime.jsxs(
+        "div",
+        {
+          ref,
+          role: "none",
+          className: cn(separatorVariants({ labeled: "true" }), className),
+          ...props,
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: separatorLineClass }),
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: separatorLabelClass, children: label }),
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: separatorLineClass })
+          ]
+        }
+      );
+    }
+    const { ariaProps, dataAttributes } = createSeparator({
+      orientation,
+      decorative
+    });
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        ref,
+        className: cn(separatorVariants({ orientation }), className),
+        ...ariaProps,
+        ...dataAttributes,
+        ...props
+      }
+    );
+  }
+);
+Separator.displayName = "Separator";
+
+// ../empty-state/dist/index.js
+function createEmptyState(options = {}) {
+  const { tone = "neutral" } = options;
+  const dataAttributes = {
+    "data-tone": tone
+  };
+  return {
+    dataAttributes
+  };
+}
+var emptyStateVariants = cva({
+  base: "flex flex-col items-center text-center gap-3 p-8",
+  variants: {
+    bordered: {
+      true: "rounded-xl border border-border bg-card",
+      false: ""
+    }
+  },
+  defaultVariants: {
+    bordered: "false"
+  }
+});
+var emptyStateIconChipVariants = cva({
+  base: "flex size-12 items-center justify-center rounded-full",
+  variants: {
+    tone: {
+      neutral: "bg-muted text-muted-foreground",
+      success: "bg-green-500/10 text-green-600",
+      warning: "bg-yellow-500/10 text-yellow-600",
+      danger: "bg-destructive/10 text-destructive"
+    }
+  },
+  defaultVariants: {
+    tone: "neutral"
+  }
+});
+var emptyStateTitleClass = "text-lg font-semibold text-foreground";
+var emptyStateDescriptionClass = "text-sm text-muted-foreground";
+var emptyStateActionsClass = "flex items-center justify-center gap-2";
+var EmptyState = React11__namespace.forwardRef(
+  ({
+    icon,
+    tone = "neutral",
+    title,
+    description,
+    actions,
+    bordered = false,
+    className,
+    ...props
+  }, ref) => {
+    const api = createEmptyState({ tone });
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        ref,
+        className: cn(
+          emptyStateVariants({ bordered: bordered ? "true" : "false" }),
+          className
+        ),
+        ...api.dataAttributes,
+        ...props,
+        children: [
+          icon != null && /* @__PURE__ */ jsxRuntime.jsx("div", { "aria-hidden": "true", className: emptyStateIconChipVariants({ tone }), children: icon }),
+          /* @__PURE__ */ jsxRuntime.jsx("h3", { className: emptyStateTitleClass, children: title }),
+          description != null && /* @__PURE__ */ jsxRuntime.jsx("p", { className: emptyStateDescriptionClass, children: description }),
+          actions != null && /* @__PURE__ */ jsxRuntime.jsx("div", { className: emptyStateActionsClass, children: actions })
+        ]
+      }
+    );
+  }
+);
+EmptyState.displayName = "EmptyState";
+var ConfirmationCard = React11__namespace.forwardRef(({ bordered = true, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(EmptyState, { ref, bordered, ...props }));
+ConfirmationCard.displayName = "ConfirmationCard";
 /*! Bundled license information:
 
 @nevware21/ts-utils/dist/es5/mod/ts-utils.js:
@@ -47157,6 +47806,7 @@ exports.CommandItem = CommandItem;
 exports.CommandList = CommandList;
 exports.CommandSeparator = CommandSeparator;
 exports.Composer = Composer;
+exports.ConfirmationCard = ConfirmationCard;
 exports.ContentProtection = ContentProtection;
 exports.CookieConsent = CookieConsent;
 exports.DEFAULT_CATEGORIES = DEFAULT_CATEGORIES;
@@ -47188,6 +47838,7 @@ exports.DropdownMenuTrigger = DropdownMenuTrigger;
 exports.EMOJI_CATEGORIES = EMOJI_CATEGORIES;
 exports.EMOJI_DATA = EMOJI_DATA;
 exports.EmojiPicker = EmojiPicker;
+exports.EmptyState = EmptyState;
 exports.FeedbackButton = FeedbackButton;
 exports.FeedbackDialog = FeedbackDialog;
 exports.FileTree = FileTree;
@@ -47214,6 +47865,7 @@ exports.OtpInput = OtpInput;
 exports.PRESENCE_STATUS_COLORS = STATUS_COLORS;
 exports.PRESENCE_STATUS_LABELS = STATUS_LABELS;
 exports.Pagination = Pagination;
+exports.PasswordInput = PasswordInput;
 exports.Payment = Payment;
 exports.Popover = Popover;
 exports.PopoverClose = PopoverClose;
@@ -47233,10 +47885,13 @@ exports.STATUS_LABELS = STATUS_INDICATOR_LABELS;
 exports.SearchBar = SearchBar;
 exports.SearchResultItem = SearchResultItem;
 exports.SearchResults = SearchResults;
+exports.SegmentedControl = SegmentedControl;
+exports.SegmentedControlItem = SegmentedControlItem;
 exports.Select = Select;
 exports.SelectContent = SelectContent;
 exports.SelectItem = SelectItem;
 exports.SelectTrigger = SelectTrigger;
+exports.Separator = Separator;
 exports.Sheet = Sheet;
 exports.SheetClose = SheetClose;
 exports.SheetContent = SheetContent;
@@ -47256,6 +47911,8 @@ exports.Skeleton = Skeleton;
 exports.SkeletonText = SkeletonText;
 exports.SkipToContent = SkipToContent;
 exports.SlideViewer = SlideViewer;
+exports.SocialAuthButton = SocialAuthButton;
+exports.SocialAuthRow = SocialAuthRow;
 exports.StatsGrid = StatsGrid;
 exports.StatusIndicator = StatusIndicator;
 exports.Step = Step;
@@ -47344,6 +48001,7 @@ exports.createIntensitySamples = createIntensitySamples;
 exports.createPostHogClientSdkSink = createPostHogClientSdkSink;
 exports.createPostHogHttpSink = createPostHogHttpSink;
 exports.createPostHogSink = createPostHogSink;
+exports.createSegmentedControl = createSegmentedControl;
 exports.createSilentSamples = createSilentSamples;
 exports.createTelemetry = createTelemetry;
 exports.createVoicePill = createVoicePill;
@@ -47369,6 +48027,7 @@ exports.formatTimestamp = formatTimestamp;
 exports.getAssignableRoles = getAssignableRoles;
 exports.getDefaultPortal = getDefaultPortal;
 exports.getInitials = getInitials;
+exports.getNextSegmentIndex = getNextSegmentIndex;
 exports.getReplyCount = getReplyCount;
 exports.getVoicePillAriaLabel = getVoicePillAriaLabel;
 exports.getVoicePillInitials = getVoicePillInitials;
@@ -47436,6 +48095,8 @@ exports.rowVariants = rowVariants;
 exports.scaleWaveformSamples = scaleWaveformSamples;
 exports.searchBarVariants = searchBarVariants;
 exports.searchResultVariants = searchResultVariants;
+exports.segmentedControlItemVariants = segmentedControlItemVariants;
+exports.segmentedControlVariants = segmentedControlVariants;
 exports.selectContentVariants = selectContentVariants;
 exports.selectItemVariants = selectItemVariants;
 exports.selectMainTimeline = selectMainTimeline;