singularity-components 0.1.193 → 0.1.195

package/dist/components/blocks/cards/blogpost-card.d.ts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
 
 interface Props {
     id: number;
@@ -8,6 +8,6 @@ interface Props {
     title: string;
     excerpt: string;
 }
-declare function BlogPostCard({ id, image, title, categories, date, excerpt, }: Props): react_jsx_runtime.JSX.Element;
+declare function BlogPostCard({ id, image, title, categories, date, excerpt, }: Props): React.JSX.Element;
 
 export { BlogPostCard as default };

package/dist/components/blocks/cards/card.d.ts

@@ -1,14 +1,13 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
 
 declare function Card({ className, size, ...props }: React.ComponentProps<"div"> & {
     size?: "default" | "sm";
-}): react_jsx_runtime.JSX.Element;
-declare function CardHeader({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
-declare function CardTitle({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
-declare function CardDescription({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
-declare function CardAction({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
-declare function CardContent({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
-declare function CardFooter({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+}): React.JSX.Element;
+declare function CardHeader({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function CardTitle({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function CardDescription({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function CardAction({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function CardContent({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function CardFooter({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
 
 export { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle };

package/dist/components/blocks/empty-state/EmptyState.d.ts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
 import { icons } from 'lucide-react';
 
 interface Props {
@@ -10,6 +10,6 @@ interface Props {
     onAction?: () => void;
     className?: string;
 }
-declare function EmptyState({ icon, title, description, actionLabel, actionTo, onAction, className, }: Props): react_jsx_runtime.JSX.Element;
+declare function EmptyState({ icon, title, description, actionLabel, actionTo, onAction, className, }: Props): React.JSX.Element;
 
 export { EmptyState as default };

package/dist/components/blocks/index.d.ts

@@ -1,5 +1,5 @@
 export { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from './cards/card.js';
+export { Login, LoginCredentials, LoginProps } from './login/login.js';
 export { PostListWithFilters } from './post-list/post-list-with-filters.js';
-import 'react/jsx-runtime';
 import 'react';
 import '../../data/posts.js';

package/dist/components/blocks/index.js

@@ -1,5 +1,6 @@
 export * from "./cards/blogpost-card.js";
 export * from "./cards/card.js";
 export * from "./empty-state/EmptyState.js";
+export * from "./login/login.js";
 export * from "./post-list/post-list-with-filters.js";
 //# sourceMappingURL=index.js.map

package/dist/components/blocks/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/blocks/index.ts"],"sourcesContent":["/**\n * Blocks index\n *\n * Please keep exports sorted alphabetically by path!\n */\n\nexport * from \"./cards/blogpost-card\";\nexport * from \"./cards/card\";\nexport * from \"./empty-state/EmptyState\";\nexport * from \"./post-list/post-list-with-filters\";\n"],"mappings":"AAMA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;","names":[]}
+{"version":3,"sources":["../../../src/components/blocks/index.ts"],"sourcesContent":["/**\n * Blocks index\n *\n * Please keep exports sorted alphabetically by path!\n */\n\nexport * from \"./cards/blogpost-card\";\nexport * from \"./cards/card\";\nexport * from \"./empty-state/EmptyState\";\nexport * from \"./login/login\";\nexport * from \"./post-list/post-list-with-filters\";\n"],"mappings":"AAMA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;","names":[]}

package/dist/components/blocks/login/login.d.ts

@@ -0,0 +1,78 @@
+import * as React from 'react';
+
+type LoginCredentials = {
+    username: string;
+    password: string;
+};
+type LoginProps = {
+    /**
+     * Form heading text.
+     */
+    title?: string;
+    /**
+     * Supporting text shown below the heading.
+     */
+    description?: string;
+    /**
+     * Label for the username or email field.
+     */
+    usernameLabel?: string;
+    /**
+     * Input type for the identifier field.
+     */
+    usernameType?: "text" | "email";
+    /**
+     * Placeholder for the identifier field.
+     */
+    usernamePlaceholder?: string;
+    /**
+     * Label for the password field.
+     */
+    passwordLabel?: string;
+    /**
+     * Placeholder for the password field.
+     */
+    passwordPlaceholder?: string;
+    /**
+     * Submit button label when not loading.
+     */
+    submitLabel?: string;
+    /**
+     * Submit button label while loading.
+     */
+    loadingLabel?: string;
+    /**
+     * Disables the form and shows the loading label on submit.
+     */
+    loading?: boolean;
+    /**
+     * Label for the optional sign-up link.
+     */
+    signUpLabel?: string;
+    /**
+     * Destination for the optional sign-up link.
+     */
+    signUpHref?: string;
+    /**
+     * Heading level for the title.
+     */
+    titleVariant?: "h1" | "h2" | "h3" | "h4";
+    /**
+     * Called when the form is submitted with valid credentials.
+     */
+    onSubmit?: (credentials: LoginCredentials) => void | Promise<void>;
+    /**
+     * Additional classes for the root wrapper.
+     */
+    className?: string;
+    /**
+     * Focuses the identifier field on mount.
+     */
+    autoFocus?: boolean;
+};
+/**
+ * Reusable login form with username/email and password fields.
+ */
+declare function Login({ title, description, usernameLabel, usernameType, usernamePlaceholder, passwordLabel, passwordPlaceholder, submitLabel, loadingLabel, loading, signUpLabel, signUpHref, titleVariant, onSubmit, className, autoFocus, }: LoginProps): React.JSX.Element;
+
+export { Login, type LoginCredentials, type LoginProps };

package/dist/components/blocks/login/login.js

@@ -0,0 +1,95 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useId, useState } from "react";
+import { Button } from "../../primitives/buttons/button.js";
+import { Input } from "../../primitives/forms/input.js";
+import { Label } from "../../primitives/label/label.js";
+import { Heading, Link, Text } from "../../primitives/index.js";
+import { cn } from "../../../utils/index.js";
+function Login({
+  title = "Log in",
+  description,
+  usernameLabel = "Username",
+  usernameType = "text",
+  usernamePlaceholder = "johndoe",
+  passwordLabel = "Password",
+  passwordPlaceholder = "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022",
+  submitLabel = "Log in",
+  loadingLabel = "Logging in...",
+  loading = false,
+  signUpLabel,
+  signUpHref,
+  titleVariant = "h1",
+  onSubmit,
+  className,
+  autoFocus = false
+}) {
+  const id = useId();
+  const usernameId = `${id}-username`;
+  const passwordId = `${id}-password`;
+  const titleId = `${id}-title`;
+  const [username, setUsername] = useState("");
+  const [password, setPassword] = useState("");
+  const handleSubmit = async (event) => {
+    event.preventDefault();
+    await onSubmit?.({ username, password });
+  };
+  return /* @__PURE__ */ jsxs("div", { className: cn("sg:w-full sg:max-w-sm sg:space-y-6", className), children: [
+    /* @__PURE__ */ jsxs("div", { className: "sg:text-center", children: [
+      /* @__PURE__ */ jsx(Heading, { variant: titleVariant, id: titleId, children: title }),
+      description && /* @__PURE__ */ jsx(Text, { className: "sg:mt-2", foreground: "muted-foreground", children: description })
+    ] }),
+    /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, className: "sg:space-y-4", "aria-labelledby": titleId, children: [
+      /* @__PURE__ */ jsxs("div", { className: "sg:space-y-2", children: [
+        /* @__PURE__ */ jsx(Label, { htmlFor: usernameId, children: usernameLabel }),
+        /* @__PURE__ */ jsx(
+          Input,
+          {
+            id: usernameId,
+            type: usernameType,
+            placeholder: usernamePlaceholder,
+            value: username,
+            onChange: (event) => setUsername(event.target.value),
+            required: true,
+            autoFocus,
+            disabled: loading,
+            autoComplete: "username"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "sg:space-y-2", children: [
+        /* @__PURE__ */ jsx(Label, { htmlFor: passwordId, children: passwordLabel }),
+        /* @__PURE__ */ jsx(
+          Input,
+          {
+            id: passwordId,
+            type: "password",
+            placeholder: passwordPlaceholder,
+            value: password,
+            onChange: (event) => setPassword(event.target.value),
+            required: true,
+            disabled: loading,
+            autoComplete: "current-password"
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsx(Button, { type: "submit", className: "sg:w-full", disabled: loading, children: loading ? loadingLabel : submitLabel })
+    ] }),
+    signUpLabel && signUpHref && /* @__PURE__ */ jsxs(
+      Text,
+      {
+        size: "sm",
+        foreground: "muted-foreground",
+        className: "sg:text-center",
+        children: [
+          "Don't have an account? ",
+          /* @__PURE__ */ jsx(Link, { to: signUpHref, children: signUpLabel })
+        ]
+      }
+    )
+  ] });
+}
+export {
+  Login
+};
+//# sourceMappingURL=login.js.map

package/dist/components/blocks/login/login.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/blocks/login/login.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { useId, useState } from \"react\";\r\nimport { Button } from \"../../primitives/buttons/button\";\r\nimport { Input } from \"../../primitives/forms/input\";\r\nimport { Label } from \"../../primitives/label/label\";\r\nimport { Heading, Link, Text } from \"../../primitives/index\";\r\nimport { cn } from \"../../../utils/index\";\r\n\r\nexport type LoginCredentials = {\r\n  username: string;\r\n  password: string;\r\n};\r\n\r\nexport type LoginProps = {\r\n  /**\r\n   * Form heading text.\r\n   */\r\n  title?: string;\r\n  /**\r\n   * Supporting text shown below the heading.\r\n   */\r\n  description?: string;\r\n  /**\r\n   * Label for the username or email field.\r\n   */\r\n  usernameLabel?: string;\r\n  /**\r\n   * Input type for the identifier field.\r\n   */\r\n  usernameType?: \"text\" | \"email\";\r\n  /**\r\n   * Placeholder for the identifier field.\r\n   */\r\n  usernamePlaceholder?: string;\r\n  /**\r\n   * Label for the password field.\r\n   */\r\n  passwordLabel?: string;\r\n  /**\r\n   * Placeholder for the password field.\r\n   */\r\n  passwordPlaceholder?: string;\r\n  /**\r\n   * Submit button label when not loading.\r\n   */\r\n  submitLabel?: string;\r\n  /**\r\n   * Submit button label while loading.\r\n   */\r\n  loadingLabel?: string;\r\n  /**\r\n   * Disables the form and shows the loading label on submit.\r\n   */\r\n  loading?: boolean;\r\n  /**\r\n   * Label for the optional sign-up link.\r\n   */\r\n  signUpLabel?: string;\r\n  /**\r\n   * Destination for the optional sign-up link.\r\n   */\r\n  signUpHref?: string;\r\n  /**\r\n   * Heading level for the title.\r\n   */\r\n  titleVariant?: \"h1\" | \"h2\" | \"h3\" | \"h4\";\r\n  /**\r\n   * Called when the form is submitted with valid credentials.\r\n   */\r\n  onSubmit?: (credentials: LoginCredentials) => void | Promise<void>;\r\n  /**\r\n   * Additional classes for the root wrapper.\r\n   */\r\n  className?: string;\r\n  /**\r\n   * Focuses the identifier field on mount.\r\n   */\r\n  autoFocus?: boolean;\r\n};\r\n\r\n/**\r\n * Reusable login form with username/email and password fields.\r\n */\r\nexport function Login({\r\n  title = \"Log in\",\r\n  description,\r\n  usernameLabel = \"Username\",\r\n  usernameType = \"text\",\r\n  usernamePlaceholder = \"johndoe\",\r\n  passwordLabel = \"Password\",\r\n  passwordPlaceholder = \"••••••••\",\r\n  submitLabel = \"Log in\",\r\n  loadingLabel = \"Logging in...\",\r\n  loading = false,\r\n  signUpLabel,\r\n  signUpHref,\r\n  titleVariant = \"h1\",\r\n  onSubmit,\r\n  className,\r\n  autoFocus = false,\r\n}: LoginProps) {\r\n  const id = useId();\r\n  const usernameId = `${id}-username`;\r\n  const passwordId = `${id}-password`;\r\n  const titleId = `${id}-title`;\r\n  const [username, setUsername] = useState(\"\");\r\n  const [password, setPassword] = useState(\"\");\r\n\r\n  const handleSubmit = async (event: React.FormEvent) => {\r\n    event.preventDefault();\r\n    await onSubmit?.({ username, password });\r\n  };\r\n\r\n  return (\r\n    <div className={cn(\"sg:w-full sg:max-w-sm sg:space-y-6\", className)}>\r\n      <div className=\"sg:text-center\">\r\n        <Heading variant={titleVariant} id={titleId}>\r\n          {title}\r\n        </Heading>\r\n        {description && (\r\n          <Text className=\"sg:mt-2\" foreground=\"muted-foreground\">\r\n            {description}\r\n          </Text>\r\n        )}\r\n      </div>\r\n\r\n      <form onSubmit={handleSubmit} className=\"sg:space-y-4\" aria-labelledby={titleId}>\r\n        <div className=\"sg:space-y-2\">\r\n          <Label htmlFor={usernameId}>{usernameLabel}</Label>\r\n          <Input\r\n            id={usernameId}\r\n            type={usernameType}\r\n            placeholder={usernamePlaceholder}\r\n            value={username}\r\n            onChange={(event) => setUsername(event.target.value)}\r\n            required\r\n            autoFocus={autoFocus}\r\n            disabled={loading}\r\n            autoComplete=\"username\"\r\n          />\r\n        </div>\r\n        <div className=\"sg:space-y-2\">\r\n          <Label htmlFor={passwordId}>{passwordLabel}</Label>\r\n          <Input\r\n            id={passwordId}\r\n            type=\"password\"\r\n            placeholder={passwordPlaceholder}\r\n            value={password}\r\n            onChange={(event) => setPassword(event.target.value)}\r\n            required\r\n            disabled={loading}\r\n            autoComplete=\"current-password\"\r\n          />\r\n        </div>\r\n        <Button type=\"submit\" className=\"sg:w-full\" disabled={loading}>\r\n          {loading ? loadingLabel : submitLabel}\r\n        </Button>\r\n      </form>\r\n\r\n      {signUpLabel && signUpHref && (\r\n        <Text\r\n          size=\"sm\"\r\n          foreground=\"muted-foreground\"\r\n          className=\"sg:text-center\"\r\n        >\r\n          Don&apos;t have an account? <Link to={signUpHref}>{signUpLabel}</Link>\r\n        </Text>\r\n      )}\r\n    </div>\r\n  );\r\n}\r\n"],"mappings":";AAoHM,SACE,KADF;AAlHN,SAAS,OAAO,gBAAgB;AAChC,SAAS,cAAc;AACvB,SAAS,aAAa;AACtB,SAAS,aAAa;AACtB,SAAS,SAAS,MAAM,YAAY;AACpC,SAAS,UAAU;AA6EZ,SAAS,MAAM;AAAA,EACpB,QAAQ;AAAA,EACR;AAAA,EACA,gBAAgB;AAAA,EAChB,eAAe;AAAA,EACf,sBAAsB;AAAA,EACtB,gBAAgB;AAAA,EAChB,sBAAsB;AAAA,EACtB,cAAc;AAAA,EACd,eAAe;AAAA,EACf,UAAU;AAAA,EACV;AAAA,EACA;AAAA,EACA,eAAe;AAAA,EACf;AAAA,EACA;AAAA,EACA,YAAY;AACd,GAAe;AACb,QAAM,KAAK,MAAM;AACjB,QAAM,aAAa,GAAG,EAAE;AACxB,QAAM,aAAa,GAAG,EAAE;AACxB,QAAM,UAAU,GAAG,EAAE;AACrB,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS,EAAE;AAC3C,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS,EAAE;AAE3C,QAAM,eAAe,OAAO,UAA2B;AACrD,UAAM,eAAe;AACrB,UAAM,WAAW,EAAE,UAAU,SAAS,CAAC;AAAA,EACzC;AAEA,SACE,qBAAC,SAAI,WAAW,GAAG,sCAAsC,SAAS,GAChE;AAAA,yBAAC,SAAI,WAAU,kBACb;AAAA,0BAAC,WAAQ,SAAS,cAAc,IAAI,SACjC,iBACH;AAAA,MACC,eACC,oBAAC,QAAK,WAAU,WAAU,YAAW,oBAClC,uBACH;AAAA,OAEJ;AAAA,IAEA,qBAAC,UAAK,UAAU,cAAc,WAAU,gBAAe,mBAAiB,SACtE;AAAA,2BAAC,SAAI,WAAU,gBACb;AAAA,4BAAC,SAAM,SAAS,YAAa,yBAAc;AAAA,QAC3C;AAAA,UAAC;AAAA;AAAA,YACC,IAAI;AAAA,YACJ,MAAM;AAAA,YACN,aAAa;AAAA,YACb,OAAO;AAAA,YACP,UAAU,CAAC,UAAU,YAAY,MAAM,OAAO,KAAK;AAAA,YACnD,UAAQ;AAAA,YACR;AAAA,YACA,UAAU;AAAA,YACV,cAAa;AAAA;AAAA,QACf;AAAA,SACF;AAAA,MACA,qBAAC,SAAI,WAAU,gBACb;AAAA,4BAAC,SAAM,SAAS,YAAa,yBAAc;AAAA,QAC3C;AAAA,UAAC;AAAA;AAAA,YACC,IAAI;AAAA,YACJ,MAAK;AAAA,YACL,aAAa;AAAA,YACb,OAAO;AAAA,YACP,UAAU,CAAC,UAAU,YAAY,MAAM,OAAO,KAAK;AAAA,YACnD,UAAQ;AAAA,YACR,UAAU;AAAA,YACV,cAAa;AAAA;AAAA,QACf;AAAA,SACF;AAAA,MACA,oBAAC,UAAO,MAAK,UAAS,WAAU,aAAY,UAAU,SACnD,oBAAU,eAAe,aAC5B;AAAA,OACF;AAAA,IAEC,eAAe,cACd;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,YAAW;AAAA,QACX,WAAU;AAAA,QACX;AAAA;AAAA,UAC6B,oBAAC,QAAK,IAAI,YAAa,uBAAY;AAAA;AAAA;AAAA,IACjE;AAAA,KAEJ;AAEJ;","names":[]}

package/dist/components/blocks/post-list/post-filters.d.ts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
 
 type SortOption = "newest" | "oldest" | "a-z" | "z-a";
 interface FilterControlsProps {
@@ -14,6 +14,6 @@ interface FilterControlsProps {
     setSortBy: (s: SortOption) => void;
     hideAuthorFilter?: boolean;
 }
-declare function FilterControls({ categories, authors, selectedCategories, selectedAuthors, toggleCategory, toggleAuthor, clearFilters, activeCount, sortBy, setSortBy, hideAuthorFilter, }: FilterControlsProps): react_jsx_runtime.JSX.Element;
+declare function FilterControls({ categories, authors, selectedCategories, selectedAuthors, toggleCategory, toggleAuthor, clearFilters, activeCount, sortBy, setSortBy, hideAuthorFilter, }: FilterControlsProps): React.JSX.Element;
 
 export { FilterControls };

package/dist/components/blocks/post-list/post-list-with-filters.d.ts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
 import { BlogPost } from '../../../data/posts.js';
 
 type LoadMode = "pagination" | "load-more";
@@ -14,6 +14,6 @@ interface PostListWithFiltersProps {
     /** Default load mode. "load-more" (default) or "pagination". User can still toggle. */
     defaultLoadMode?: LoadMode;
 }
-declare function PostListWithFilters({ posts: sourcePosts, hideSearch, hideAuthorFilter, filterMode, defaultLoadMode, }: PostListWithFiltersProps): react_jsx_runtime.JSX.Element;
+declare function PostListWithFilters({ posts: sourcePosts, hideSearch, hideAuthorFilter, filterMode, defaultLoadMode, }: PostListWithFiltersProps): React.JSX.Element;
 
 export { PostListWithFilters };

package/dist/components/index.d.ts

@@ -1,4 +1,5 @@
 export { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from './blocks/cards/card.js';
+export { Login, LoginCredentials, LoginProps } from './blocks/login/login.js';
 export { PostListWithFilters } from './blocks/post-list/post-list-with-filters.js';
 export { AdminPage, AdminPageProps } from './pages/admin/admin-page.js';
 export { BlogPost } from './pages/blogpost/blogpost.js';
@@ -32,7 +33,7 @@ export { Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHe
 export { Skeleton } from './primitives/skeleton/skeleton.js';
 export { Toaster } from './primitives/sonner/sonner.js';
 export { Spinner } from './primitives/spinner/spinner.js';
-export { Stack, StackProps, stackVariants } from './primitives/stack/stack.js';
+export { Stack, StackProps, stackVariantOptions, stackVariants } from './primitives/stack/stack.js';
 export { Heading, HeadingProps, headingVariants, headingVariantsProps } from './primitives/text/heading.js';
 export { TextCode, TextCodeProps, textCodeVariants, textCodeVariantsProps } from './primitives/text/text-code.js';
 export { TextDiv } from './primitives/text/text-div.js';
@@ -50,7 +51,6 @@ export { Container } from './templates/container/container.js';
 export { Footer } from './templates/footer/footer.js';
 export { Header, HeaderProps, NavLink } from './templates/navigation/header.js';
 export { toast } from 'sonner';
-import 'react/jsx-runtime';
 import 'react';
 import '../data/posts.js';
 import '@base-ui/react/accordion';

package/dist/components/pages/admin/admin-page.d.ts

@@ -1,8 +1,8 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
 
 interface AdminPageProps {
     initialEditId?: number;
 }
-declare function AdminPage({ initialEditId }: AdminPageProps): react_jsx_runtime.JSX.Element;
+declare function AdminPage({ initialEditId }: AdminPageProps): React.JSX.Element;
 
 export { AdminPage, type AdminPageProps };

package/dist/components/pages/blogpost/blogpost.d.ts

@@ -1,5 +1,5 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
 
-declare function BlogPost(): react_jsx_runtime.JSX.Element;
+declare function BlogPost(): React.JSX.Element;
 
 export { BlogPost };

package/dist/components/pages/category/category-page.d.ts

@@ -1,8 +1,8 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
 
 interface Props {
     category?: string;
 }
-declare function CategoryPage({ category: propCategory }: Props): react_jsx_runtime.JSX.Element;
+declare function CategoryPage({ category: propCategory }: Props): React.JSX.Element;
 
 export { CategoryPage };

package/dist/components/pages/chat/chat-page.d.ts

@@ -1,5 +1,5 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
 
-declare function ChatPage(): react_jsx_runtime.JSX.Element;
+declare function ChatPage(): React.JSX.Element;
 
 export { ChatPage };

package/dist/components/pages/index.d.ts

@@ -8,4 +8,4 @@ export { PrivacyPage } from './privacy/privacy-page.js';
 export { SearchPage } from './search/search-page.js';
 export { StartPage } from './startpage/startpage.js';
 export { TermsPage } from './terms/terms-page.js';
-import 'react/jsx-runtime';
+import 'react';

package/dist/components/pages/login/login-page.d.ts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
 
 interface LoginPageProps {
     /**
@@ -14,6 +14,6 @@ interface LoginPageProps {
      */
     signUpHref?: string;
 }
-declare function LoginPage({ onLoginSuccess, signUpLabel, signUpHref, }: LoginPageProps): react_jsx_runtime.JSX.Element;
+declare function LoginPage({ onLoginSuccess, signUpLabel, signUpHref, }: LoginPageProps): React.JSX.Element;
 
 export { LoginPage };

package/dist/components/pages/login/login-page.js

@@ -1,34 +1,16 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { useState } from "react";
-import {
-  Layout,
-  Button,
-  Input,
-  Label,
-  Heading,
-  Text,
-  Link
-} from "../../primitives/index.js";
+import { Layout, Button, Heading, Text } from "../../primitives/index.js";
 import { useToast } from "../../primitives/sonner/use-toast.js";
+import { Login } from "../../blocks/login/login.js";
 import { useAuth } from "singularity-components/components/providers/auth-provider";
 function LoginPage({
   onLoginSuccess,
   signUpLabel = "Sign up",
   signUpHref = "#"
 }) {
-  const [email, setEmail] = useState("");
-  const [password, setPassword] = useState("");
   const { toast } = useToast();
   const { isLoggedIn, login, logout, userName } = useAuth();
-  const handleSubmit = (e) => {
-    e.preventDefault();
-    login(email.split("@")[0]);
-    toast.success("Logged in!", {
-      description: `Welcome back, ${email}!`
-    });
-    onLoginSuccess?.();
-  };
   if (isLoggedIn) {
     return /* @__PURE__ */ jsx(Layout, { type: "col", className: "sg:py-20", as: "main", children: /* @__PURE__ */ jsx(Layout.Col1, { centerContent: true, children: /* @__PURE__ */ jsxs("div", { className: "sg:w-full sg:max-w-sm sg:space-y-6", children: [
       /* @__PURE__ */ jsxs(Heading, { variant: "h1", className: "sg:text-foreground", children: [
@@ -51,56 +33,24 @@ function LoginPage({
       )
     ] }) }) });
   }
-  return /* @__PURE__ */ jsx(Layout, { type: "col", className: "sg:py-20", as: "main", children: /* @__PURE__ */ jsx(Layout.Col1, { centerContent: true, children: /* @__PURE__ */ jsxs("div", { className: "sg:w-full sg:max-w-sm sg:space-y-6", children: [
-    /* @__PURE__ */ jsxs("div", { className: "sg:text-center", children: [
-      /* @__PURE__ */ jsx(Heading, { variant: "h1", children: "Log in" }),
-      /* @__PURE__ */ jsx(Text, { className: "sg:mt-2", foreground: "muted-foreground", children: "Welcome back to Storied." })
-    ] }),
-    /* @__PURE__ */ jsxs("form", { onSubmit: handleSubmit, className: "sg:space-y-4", children: [
-      /* @__PURE__ */ jsxs("div", { className: "sg:space-y-2", children: [
-        /* @__PURE__ */ jsx(Label, { htmlFor: "email", children: "Email" }),
-        /* @__PURE__ */ jsx(
-          Input,
-          {
-            id: "email",
-            type: "email",
-            placeholder: "you@example.com",
-            value: email,
-            onChange: (e) => setEmail(e.target.value),
-            required: true
-          }
-        )
-      ] }),
-      /* @__PURE__ */ jsxs("div", { className: "sg:space-y-2", children: [
-        /* @__PURE__ */ jsx(Label, { htmlFor: "password", children: "Password" }),
-        /* @__PURE__ */ jsx(
-          Input,
-          {
-            id: "password",
-            type: "password",
-            placeholder: "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022",
-            value: password,
-            onChange: (e) => setPassword(e.target.value),
-            required: true
-          }
-        )
-      ] }),
-      /* @__PURE__ */ jsx(Button, { type: "submit", className: "sg:w-full", children: "Log in" })
-    ] }),
-    /* @__PURE__ */ jsxs(
-      Text,
-      {
-        size: "sm",
-        foreground: "muted-foreground",
-        className: "sg:text-center",
-        children: [
-          "Don't have an account?",
-          " ",
-          /* @__PURE__ */ jsx(Link, { to: signUpHref, children: signUpLabel })
-        ]
+  return /* @__PURE__ */ jsx(Layout, { type: "col", className: "sg:py-20", as: "main", children: /* @__PURE__ */ jsx(Layout.Col1, { centerContent: true, children: /* @__PURE__ */ jsx(
+    Login,
+    {
+      description: "Welcome back to Storied.",
+      usernameLabel: "Email",
+      usernameType: "email",
+      usernamePlaceholder: "you@example.com",
+      signUpLabel,
+      signUpHref,
+      onSubmit: ({ username }) => {
+        login(username.split("@")[0]);
+        toast.success("Logged in!", {
+          description: `Welcome back, ${username}!`
+        });
+        onLoginSuccess?.();
       }
-    )
-  ] }) }) });
+    }
+  ) }) });
 }
 export {
   LoginPage

package/dist/components/pages/login/login-page.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/pages/login/login-page.tsx"],"sourcesContent":["\"use client\";\nimport { useState } from \"react\";\nimport {\n  Layout,\n  Button,\n  Input,\n  Label,\n  Heading,\n  Text,\n  Link,\n} from \"../../primitives/index\";\nimport { useToast } from \"../../primitives/sonner/use-toast\";\nimport { useAuth } from \"singularity-components/components/providers/auth-provider\";\n\ninterface LoginPageProps {\n  /**\n   * Callback fired when login is successful\n   */\n  onLoginSuccess?: () => void;\n  /**\n   * Label for the \"Sign up\" link\n   */\n  signUpLabel?: string;\n  /**\n   * URL for the \"Sign up\" link\n   */\n  signUpHref?: string;\n}\n\nexport function LoginPage({\n  onLoginSuccess,\n  signUpLabel = \"Sign up\",\n  signUpHref = \"#\",\n}: LoginPageProps) {\n  const [email, setEmail] = useState(\"\");\n  const [password, setPassword] = useState(\"\");\n  const { toast } = useToast();\n  const { isLoggedIn, login, logout, userName } = useAuth();\n\n  const handleSubmit = (e: React.FormEvent) => {\n    e.preventDefault();\n    login(email.split(\"@\")[0]);\n    toast.success(\"Logged in!\", {\n      description: `Welcome back, ${email}!`,\n    });\n    onLoginSuccess?.();\n  };\n\n  if (isLoggedIn) {\n    return (\n      <Layout type=\"col\" className=\"sg:py-20\" as=\"main\">\n        <Layout.Col1 centerContent>\n          <div className=\"sg:w-full sg:max-w-sm sg:space-y-6\">\n            <Heading variant=\"h1\" className=\"sg:text-foreground\">\n              Welcome, {userName}\n            </Heading>\n            <Text foreground=\"muted-foreground\">\n              You are currently logged in.\n            </Text>\n            <Button\n              variant=\"outline\"\n              onClick={() => {\n                logout();\n                toast.message(\"Logged out\", {\n                  description: \"See you next time!\",\n                });\n              }}\n            >\n              Log out\n            </Button>\n          </div>\n        </Layout.Col1>\n      </Layout>\n    );\n  }\n\n  return (\n    <Layout type=\"col\" className=\"sg:py-20\" as=\"main\">\n      <Layout.Col1 centerContent>\n        <div className=\"sg:w-full sg:max-w-sm sg:space-y-6\">\n          <div className=\"sg:text-center\">\n            <Heading variant=\"h1\">Log in</Heading>\n            <Text className=\"sg:mt-2\" foreground=\"muted-foreground\">\n              Welcome back to Storied.\n            </Text>\n          </div>\n\n          <form onSubmit={handleSubmit} className=\"sg:space-y-4\">\n            <div className=\"sg:space-y-2\">\n              <Label htmlFor=\"email\">Email</Label>\n              <Input\n                id=\"email\"\n                type=\"email\"\n                placeholder=\"you@example.com\"\n                value={email}\n                onChange={(e) => setEmail(e.target.value)}\n                required\n              />\n            </div>\n            <div className=\"sg:space-y-2\">\n              <Label htmlFor=\"password\">Password</Label>\n              <Input\n                id=\"password\"\n                type=\"password\"\n                placeholder=\"••••••••\"\n                value={password}\n                onChange={(e) => setPassword(e.target.value)}\n                required\n              />\n            </div>\n            <Button type=\"submit\" className=\"sg:w-full\">\n              Log in\n            </Button>\n          </form>\n\n          <Text\n            size=\"sm\"\n            foreground=\"muted-foreground\"\n            className=\"sg:text-center\"\n          >\n            Don&apos;t have an account?{\" \"}\n            <Link to={signUpHref}>{signUpLabel}</Link>\n          </Text>\n        </div>\n      </Layout.Col1>\n    </Layout>\n  );\n}\n"],"mappings":";AAqDY,SAGA,KAHA;AApDZ,SAAS,gBAAgB;AACzB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,gBAAgB;AACzB,SAAS,eAAe;AAiBjB,SAAS,UAAU;AAAA,EACxB;AAAA,EACA,cAAc;AAAA,EACd,aAAa;AACf,GAAmB;AACjB,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAS,EAAE;AACrC,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS,EAAE;AAC3C,QAAM,EAAE,MAAM,IAAI,SAAS;AAC3B,QAAM,EAAE,YAAY,OAAO,QAAQ,SAAS,IAAI,QAAQ;AAExD,QAAM,eAAe,CAAC,MAAuB;AAC3C,MAAE,eAAe;AACjB,UAAM,MAAM,MAAM,GAAG,EAAE,CAAC,CAAC;AACzB,UAAM,QAAQ,cAAc;AAAA,MAC1B,aAAa,iBAAiB,KAAK;AAAA,IACrC,CAAC;AACD,qBAAiB;AAAA,EACnB;AAEA,MAAI,YAAY;AACd,WACE,oBAAC,UAAO,MAAK,OAAM,WAAU,YAAW,IAAG,QACzC,8BAAC,OAAO,MAAP,EAAY,eAAa,MACxB,+BAAC,SAAI,WAAU,sCACb;AAAA,2BAAC,WAAQ,SAAQ,MAAK,WAAU,sBAAqB;AAAA;AAAA,QACzC;AAAA,SACZ;AAAA,MACA,oBAAC,QAAK,YAAW,oBAAmB,0CAEpC;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACC,SAAQ;AAAA,UACR,SAAS,MAAM;AACb,mBAAO;AACP,kBAAM,QAAQ,cAAc;AAAA,cAC1B,aAAa;AAAA,YACf,CAAC;AAAA,UACH;AAAA,UACD;AAAA;AAAA,MAED;AAAA,OACF,GACF,GACF;AAAA,EAEJ;AAEA,SACE,oBAAC,UAAO,MAAK,OAAM,WAAU,YAAW,IAAG,QACzC,8BAAC,OAAO,MAAP,EAAY,eAAa,MACxB,+BAAC,SAAI,WAAU,sCACb;AAAA,yBAAC,SAAI,WAAU,kBACb;AAAA,0BAAC,WAAQ,SAAQ,MAAK,oBAAM;AAAA,MAC5B,oBAAC,QAAK,WAAU,WAAU,YAAW,oBAAmB,sCAExD;AAAA,OACF;AAAA,IAEA,qBAAC,UAAK,UAAU,cAAc,WAAU,gBACtC;AAAA,2BAAC,SAAI,WAAU,gBACb;AAAA,4BAAC,SAAM,SAAQ,SAAQ,mBAAK;AAAA,QAC5B;AAAA,UAAC;AAAA;AAAA,YACC,IAAG;AAAA,YACH,MAAK;AAAA,YACL,aAAY;AAAA,YACZ,OAAO;AAAA,YACP,UAAU,CAAC,MAAM,SAAS,EAAE,OAAO,KAAK;AAAA,YACxC,UAAQ;AAAA;AAAA,QACV;AAAA,SACF;AAAA,MACA,qBAAC,SAAI,WAAU,gBACb;AAAA,4BAAC,SAAM,SAAQ,YAAW,sBAAQ;AAAA,QAClC;AAAA,UAAC;AAAA;AAAA,YACC,IAAG;AAAA,YACH,MAAK;AAAA,YACL,aAAY;AAAA,YACZ,OAAO;AAAA,YACP,UAAU,CAAC,MAAM,YAAY,EAAE,OAAO,KAAK;AAAA,YAC3C,UAAQ;AAAA;AAAA,QACV;AAAA,SACF;AAAA,MACA,oBAAC,UAAO,MAAK,UAAS,WAAU,aAAY,oBAE5C;AAAA,OACF;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,YAAW;AAAA,QACX,WAAU;AAAA,QACX;AAAA;AAAA,UAC6B;AAAA,UAC5B,oBAAC,QAAK,IAAI,YAAa,uBAAY;AAAA;AAAA;AAAA,IACrC;AAAA,KACF,GACF,GACF;AAEJ;","names":[]}
+{"version":3,"sources":["../../../../src/components/pages/login/login-page.tsx"],"sourcesContent":["\"use client\";\nimport { Layout, Button, Heading, Text } from \"../../primitives/index\";\nimport { useToast } from \"../../primitives/sonner/use-toast\";\nimport { Login } from \"../../blocks/login/login\";\nimport { useAuth } from \"singularity-components/components/providers/auth-provider\";\n\ninterface LoginPageProps {\n  /**\n   * Callback fired when login is successful\n   */\n  onLoginSuccess?: () => void;\n  /**\n   * Label for the \"Sign up\" link\n   */\n  signUpLabel?: string;\n  /**\n   * URL for the \"Sign up\" link\n   */\n  signUpHref?: string;\n}\n\nexport function LoginPage({\n  onLoginSuccess,\n  signUpLabel = \"Sign up\",\n  signUpHref = \"#\",\n}: LoginPageProps) {\n  const { toast } = useToast();\n  const { isLoggedIn, login, logout, userName } = useAuth();\n\n  if (isLoggedIn) {\n    return (\n      <Layout type=\"col\" className=\"sg:py-20\" as=\"main\">\n        <Layout.Col1 centerContent>\n          <div className=\"sg:w-full sg:max-w-sm sg:space-y-6\">\n            <Heading variant=\"h1\" className=\"sg:text-foreground\">\n              Welcome, {userName}\n            </Heading>\n            <Text foreground=\"muted-foreground\">\n              You are currently logged in.\n            </Text>\n            <Button\n              variant=\"outline\"\n              onClick={() => {\n                logout();\n                toast.message(\"Logged out\", {\n                  description: \"See you next time!\",\n                });\n              }}\n            >\n              Log out\n            </Button>\n          </div>\n        </Layout.Col1>\n      </Layout>\n    );\n  }\n\n  return (\n    <Layout type=\"col\" className=\"sg:py-20\" as=\"main\">\n      <Layout.Col1 centerContent>\n        <Login\n          description=\"Welcome back to Storied.\"\n          usernameLabel=\"Email\"\n          usernameType=\"email\"\n          usernamePlaceholder=\"you@example.com\"\n          signUpLabel={signUpLabel}\n          signUpHref={signUpHref}\n          onSubmit={({ username }) => {\n            login(username.split(\"@\")[0]);\n            toast.success(\"Logged in!\", {\n              description: `Welcome back, ${username}!`,\n            });\n            onLoginSuccess?.();\n          }}\n        />\n      </Layout.Col1>\n    </Layout>\n  );\n}\n"],"mappings":";AAkCY,SAGA,KAHA;AAjCZ,SAAS,QAAQ,QAAQ,SAAS,YAAY;AAC9C,SAAS,gBAAgB;AACzB,SAAS,aAAa;AACtB,SAAS,eAAe;AAiBjB,SAAS,UAAU;AAAA,EACxB;AAAA,EACA,cAAc;AAAA,EACd,aAAa;AACf,GAAmB;AACjB,QAAM,EAAE,MAAM,IAAI,SAAS;AAC3B,QAAM,EAAE,YAAY,OAAO,QAAQ,SAAS,IAAI,QAAQ;AAExD,MAAI,YAAY;AACd,WACE,oBAAC,UAAO,MAAK,OAAM,WAAU,YAAW,IAAG,QACzC,8BAAC,OAAO,MAAP,EAAY,eAAa,MACxB,+BAAC,SAAI,WAAU,sCACb;AAAA,2BAAC,WAAQ,SAAQ,MAAK,WAAU,sBAAqB;AAAA;AAAA,QACzC;AAAA,SACZ;AAAA,MACA,oBAAC,QAAK,YAAW,oBAAmB,0CAEpC;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACC,SAAQ;AAAA,UACR,SAAS,MAAM;AACb,mBAAO;AACP,kBAAM,QAAQ,cAAc;AAAA,cAC1B,aAAa;AAAA,YACf,CAAC;AAAA,UACH;AAAA,UACD;AAAA;AAAA,MAED;AAAA,OACF,GACF,GACF;AAAA,EAEJ;AAEA,SACE,oBAAC,UAAO,MAAK,OAAM,WAAU,YAAW,IAAG,QACzC,8BAAC,OAAO,MAAP,EAAY,eAAa,MACxB;AAAA,IAAC;AAAA;AAAA,MACC,aAAY;AAAA,MACZ,eAAc;AAAA,MACd,cAAa;AAAA,MACb,qBAAoB;AAAA,MACpB;AAAA,MACA;AAAA,MACA,UAAU,CAAC,EAAE,SAAS,MAAM;AAC1B,cAAM,SAAS,MAAM,GAAG,EAAE,CAAC,CAAC;AAC5B,cAAM,QAAQ,cAAc;AAAA,UAC1B,aAAa,iBAAiB,QAAQ;AAAA,QACxC,CAAC;AACD,yBAAiB;AAAA,MACnB;AAAA;AAAA,EACF,GACF,GACF;AAEJ;","names":[]}

package/dist/components/pages/maintenance/maintenance-page.d.ts

@@ -1,5 +1,5 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
 
-declare function MaintenancePage(): react_jsx_runtime.JSX.Element;
+declare function MaintenancePage(): React.JSX.Element;
 
 export { MaintenancePage };

package/dist/components/pages/not-found/not-found.d.ts

@@ -1,10 +1,10 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
 
 interface NotFoundProps {
     pathname?: string;
     homeHref?: string;
     onGoBack?: () => void;
 }
-declare const NotFound: ({ pathname, homeHref, onGoBack, }: NotFoundProps) => react_jsx_runtime.JSX.Element;
+declare const NotFound: ({ pathname, homeHref, onGoBack, }: NotFoundProps) => React.JSX.Element;
 
 export { NotFound };

package/dist/components/pages/privacy/privacy-page.d.ts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
 
 interface Section {
     title: string;
@@ -10,6 +10,6 @@ interface PrivacyPageProps {
     introText?: string;
     sections?: Section[];
 }
-declare const PrivacyPage: ({ title, effectiveDate, introText, sections, }: PrivacyPageProps) => react_jsx_runtime.JSX.Element;
+declare const PrivacyPage: ({ title, effectiveDate, introText, sections, }: PrivacyPageProps) => React.JSX.Element;
 
 export { PrivacyPage };

package/dist/components/pages/search/search-page.d.ts

@@ -1,5 +1,5 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
 
-declare function SearchPage(): react_jsx_runtime.JSX.Element;
+declare function SearchPage(): React.JSX.Element;
 
 export { SearchPage };

package/dist/components/pages/startpage/startpage.d.ts

@@ -1,5 +1,5 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
 
-declare function StartPage(): react_jsx_runtime.JSX.Element;
+declare function StartPage(): React.JSX.Element;
 
 export { StartPage };

package/dist/components/pages/terms/terms-page.d.ts

@@ -1,4 +1,4 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
 
 interface Section {
     title: string;
@@ -10,6 +10,6 @@ interface TermsPageProps {
     introText?: string;
     sections?: Section[];
 }
-declare const TermsPage: ({ title, effectiveDate, introText, sections, }: TermsPageProps) => react_jsx_runtime.JSX.Element;
+declare const TermsPage: ({ title, effectiveDate, introText, sections, }: TermsPageProps) => React.JSX.Element;
 
 export { TermsPage };

package/dist/components/primitives/accordion/accordion.d.ts

@@ -1,9 +1,9 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
 import { Accordion as Accordion$1 } from '@base-ui/react/accordion';
 
-declare function Accordion({ className, ...props }: Accordion$1.Root.Props): react_jsx_runtime.JSX.Element;
-declare function AccordionItem({ className, ...props }: Accordion$1.Item.Props): react_jsx_runtime.JSX.Element;
-declare function AccordionTrigger({ className, children, ...props }: Accordion$1.Trigger.Props): react_jsx_runtime.JSX.Element;
-declare function AccordionContent({ className, children, ...props }: Accordion$1.Panel.Props): react_jsx_runtime.JSX.Element;
+declare function Accordion({ className, ...props }: Accordion$1.Root.Props): React.JSX.Element;
+declare function AccordionItem({ className, ...props }: Accordion$1.Item.Props): React.JSX.Element;
+declare function AccordionTrigger({ className, children, ...props }: Accordion$1.Trigger.Props): React.JSX.Element;
+declare function AccordionContent({ className, children, ...props }: Accordion$1.Panel.Props): React.JSX.Element;
 
 export { Accordion, AccordionContent, AccordionItem, AccordionTrigger };

package/dist/components/primitives/alert/alert.d.ts

@@ -1,4 +1,3 @@
-import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as class_variance_authority_types from 'class-variance-authority/types';
 import * as React from 'react';
 import { VariantProps } from 'class-variance-authority';
@@ -12,9 +11,9 @@ declare const alertVariants: {
 declare const alertVariantsProps: (props?: ({
     variant?: "default" | "destructive" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
-declare function Alert({ className, variant, ...props }: React.ComponentProps<"div"> & VariantProps<typeof alertVariantsProps>): react_jsx_runtime.JSX.Element;
-declare function AlertTitle({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
-declare function AlertDescription({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
-declare function AlertAction({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+declare function Alert({ className, variant, ...props }: React.ComponentProps<"div"> & VariantProps<typeof alertVariantsProps>): React.JSX.Element;
+declare function AlertTitle({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function AlertDescription({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function AlertAction({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
 
 export { Alert, AlertAction, AlertDescription, AlertTitle, alertVariants };