@prediktif/ui 0.1.22 → 0.1.23

package/dist/index.d.mts

@@ -3,6 +3,7 @@ import { ReactNode, ComponentProps } from 'react';
 import * as _tanstack_react_table from '@tanstack/react-table';
 import { RowData, Table, ColumnDef, ColumnFiltersState, Row, SortingState, ColumnVisibilityState } from '@tanstack/react-table';
 export { ColumnDef, ColumnFiltersState, ColumnVisibilityState, FilterFn, Row, RowData, SortingState, Table, flexRender, useTable } from '@tanstack/react-table';
+import { z } from 'zod';
 import * as class_variance_authority_types from 'class-variance-authority/types';
 import { Button as Button$1 } from '@base-ui/react/button';
 import { VariantProps } from 'class-variance-authority';
@@ -334,6 +335,24 @@ interface HeaderTitleProps {
 }
 declare const HeaderTitle: react.NamedExoticComponent<HeaderTitleProps>;
 
+type GoogleIconProps = ComponentProps<"svg">;
+declare function GoogleIcon({ className, ...props }: GoogleIconProps): react.JSX.Element;
+
+declare const loginSchema: z.ZodObject<{
+    email: z.ZodPipe<z.ZodString, z.ZodEmail>;
+    password: z.ZodString;
+}, z.core.$strip>;
+type LoginValues = z.infer<typeof loginSchema>;
+type LoginSubmitResult = {
+    error?: string;
+} | undefined;
+interface LoginServerProps {
+    onSubmit?: (values: LoginValues) => Promise<LoginSubmitResult> | LoginSubmitResult;
+    onGoogleSignIn?: () => Promise<void> | void;
+    isSubmitting?: boolean;
+}
+declare function LoginServer({ onSubmit, onGoogleSignIn, isSubmitting: externalIsSubmitting, }: LoginServerProps): react.JSX.Element;
+
 declare const buttonVariants: (props?: ({
     variant?: "default" | "outline" | "secondary" | "ghost" | "destructive" | "link" | null | undefined;
     size?: "default" | "xs" | "sm" | "lg" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined;
@@ -353,4 +372,4 @@ interface StateEmptyProps {
 }
 declare const StateEmpty: react.NamedExoticComponent<StateEmptyProps>;
 
-export { AppSidebar, type AppSidebarProps, AvatarUser, type AvatarUserProps, type ColumnMetaCustom, DataTable, DataTableContentBody, type DataTableContentBodyProps, DataTableContentHeader, type DataTableContentHeaderProps, type DataTableFeatures, DataTableFooterEntries, type DataTableFooterEntriesProps, DataTableFooterPagination, type DataTableFooterPaginationProps, DataTableHeaderAdd, type DataTableHeaderAddProps, DataTableHeaderDownload, type DataTableHeaderDownloadProps, DataTableHeaderFilter, type DataTableHeaderFilterProps, DataTableHeaderRefresh, DataTableHeaderSearch, type DataTableHeaderSearchProps, DataTableHeaderSort, type DataTableHeaderSortProps, DataTableHeaderToggle, type DataTableHeaderToggleProps, type DataTableProps, EmailLabel, type EmailLabelProps, EmailVerified, type EmailVerifiedProps, type FilterSelectOption, type FilterVariant, type HeaderTabItem, HeaderTabs, type HeaderTabsProps, HeaderTitle, type HeaderTitleProps, JoinedLabel, type JoinedLabelProps, type NavItem, type OrganizationItem, type RowActionItem, RowActions, type RowActionsProps, StateEmpty, type StateEmptyProps, UserRole, type UserRoleProps, UserStatus, type UserStatusProps, exportToCSV, exportToPDF, exportToXLSX, features, getTableExportData, printTable, smartFilterFn };
+export { AppSidebar, type AppSidebarProps, AvatarUser, type AvatarUserProps, type ColumnMetaCustom, DataTable, DataTableContentBody, type DataTableContentBodyProps, DataTableContentHeader, type DataTableContentHeaderProps, type DataTableFeatures, DataTableFooterEntries, type DataTableFooterEntriesProps, DataTableFooterPagination, type DataTableFooterPaginationProps, DataTableHeaderAdd, type DataTableHeaderAddProps, DataTableHeaderDownload, type DataTableHeaderDownloadProps, DataTableHeaderFilter, type DataTableHeaderFilterProps, DataTableHeaderRefresh, DataTableHeaderSearch, type DataTableHeaderSearchProps, DataTableHeaderSort, type DataTableHeaderSortProps, DataTableHeaderToggle, type DataTableHeaderToggleProps, type DataTableProps, EmailLabel, type EmailLabelProps, EmailVerified, type EmailVerifiedProps, type FilterSelectOption, type FilterVariant, GoogleIcon, type GoogleIconProps, type HeaderTabItem, HeaderTabs, type HeaderTabsProps, HeaderTitle, type HeaderTitleProps, JoinedLabel, type JoinedLabelProps, LoginServer, type LoginServerProps, type LoginSubmitResult, type LoginValues, type NavItem, type OrganizationItem, type RowActionItem, RowActions, type RowActionsProps, StateEmpty, type StateEmptyProps, UserRole, type UserRoleProps, UserStatus, type UserStatusProps, exportToCSV, exportToPDF, exportToXLSX, features, getTableExportData, loginSchema, printTable, smartFilterFn };

package/dist/index.d.ts

@@ -3,6 +3,7 @@ import { ReactNode, ComponentProps } from 'react';
 import * as _tanstack_react_table from '@tanstack/react-table';
 import { RowData, Table, ColumnDef, ColumnFiltersState, Row, SortingState, ColumnVisibilityState } from '@tanstack/react-table';
 export { ColumnDef, ColumnFiltersState, ColumnVisibilityState, FilterFn, Row, RowData, SortingState, Table, flexRender, useTable } from '@tanstack/react-table';
+import { z } from 'zod';
 import * as class_variance_authority_types from 'class-variance-authority/types';
 import { Button as Button$1 } from '@base-ui/react/button';
 import { VariantProps } from 'class-variance-authority';
@@ -334,6 +335,24 @@ interface HeaderTitleProps {
 }
 declare const HeaderTitle: react.NamedExoticComponent<HeaderTitleProps>;
 
+type GoogleIconProps = ComponentProps<"svg">;
+declare function GoogleIcon({ className, ...props }: GoogleIconProps): react.JSX.Element;
+
+declare const loginSchema: z.ZodObject<{
+    email: z.ZodPipe<z.ZodString, z.ZodEmail>;
+    password: z.ZodString;
+}, z.core.$strip>;
+type LoginValues = z.infer<typeof loginSchema>;
+type LoginSubmitResult = {
+    error?: string;
+} | undefined;
+interface LoginServerProps {
+    onSubmit?: (values: LoginValues) => Promise<LoginSubmitResult> | LoginSubmitResult;
+    onGoogleSignIn?: () => Promise<void> | void;
+    isSubmitting?: boolean;
+}
+declare function LoginServer({ onSubmit, onGoogleSignIn, isSubmitting: externalIsSubmitting, }: LoginServerProps): react.JSX.Element;
+
 declare const buttonVariants: (props?: ({
     variant?: "default" | "outline" | "secondary" | "ghost" | "destructive" | "link" | null | undefined;
     size?: "default" | "xs" | "sm" | "lg" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined;
@@ -353,4 +372,4 @@ interface StateEmptyProps {
 }
 declare const StateEmpty: react.NamedExoticComponent<StateEmptyProps>;
 
-export { AppSidebar, type AppSidebarProps, AvatarUser, type AvatarUserProps, type ColumnMetaCustom, DataTable, DataTableContentBody, type DataTableContentBodyProps, DataTableContentHeader, type DataTableContentHeaderProps, type DataTableFeatures, DataTableFooterEntries, type DataTableFooterEntriesProps, DataTableFooterPagination, type DataTableFooterPaginationProps, DataTableHeaderAdd, type DataTableHeaderAddProps, DataTableHeaderDownload, type DataTableHeaderDownloadProps, DataTableHeaderFilter, type DataTableHeaderFilterProps, DataTableHeaderRefresh, DataTableHeaderSearch, type DataTableHeaderSearchProps, DataTableHeaderSort, type DataTableHeaderSortProps, DataTableHeaderToggle, type DataTableHeaderToggleProps, type DataTableProps, EmailLabel, type EmailLabelProps, EmailVerified, type EmailVerifiedProps, type FilterSelectOption, type FilterVariant, type HeaderTabItem, HeaderTabs, type HeaderTabsProps, HeaderTitle, type HeaderTitleProps, JoinedLabel, type JoinedLabelProps, type NavItem, type OrganizationItem, type RowActionItem, RowActions, type RowActionsProps, StateEmpty, type StateEmptyProps, UserRole, type UserRoleProps, UserStatus, type UserStatusProps, exportToCSV, exportToPDF, exportToXLSX, features, getTableExportData, printTable, smartFilterFn };
+export { AppSidebar, type AppSidebarProps, AvatarUser, type AvatarUserProps, type ColumnMetaCustom, DataTable, DataTableContentBody, type DataTableContentBodyProps, DataTableContentHeader, type DataTableContentHeaderProps, type DataTableFeatures, DataTableFooterEntries, type DataTableFooterEntriesProps, DataTableFooterPagination, type DataTableFooterPaginationProps, DataTableHeaderAdd, type DataTableHeaderAddProps, DataTableHeaderDownload, type DataTableHeaderDownloadProps, DataTableHeaderFilter, type DataTableHeaderFilterProps, DataTableHeaderRefresh, DataTableHeaderSearch, type DataTableHeaderSearchProps, DataTableHeaderSort, type DataTableHeaderSortProps, DataTableHeaderToggle, type DataTableHeaderToggleProps, type DataTableProps, EmailLabel, type EmailLabelProps, EmailVerified, type EmailVerifiedProps, type FilterSelectOption, type FilterVariant, GoogleIcon, type GoogleIconProps, type HeaderTabItem, HeaderTabs, type HeaderTabsProps, HeaderTitle, type HeaderTitleProps, JoinedLabel, type JoinedLabelProps, LoginServer, type LoginServerProps, type LoginSubmitResult, type LoginValues, type NavItem, type OrganizationItem, type RowActionItem, RowActions, type RowActionsProps, StateEmpty, type StateEmptyProps, UserRole, type UserRoleProps, UserStatus, type UserStatusProps, exportToCSV, exportToPDF, exportToXLSX, features, getTableExportData, loginSchema, printTable, smartFilterFn };

package/dist/index.js

@@ -76,9 +76,11 @@ __export(index_exports, {
   DataTableHeaderToggle: () => DataTableHeaderToggle,
   EmailLabel: () => EmailLabel,
   EmailVerified: () => EmailVerified,
+  GoogleIcon: () => GoogleIcon,
   HeaderTabs: () => HeaderTabs,
   HeaderTitle: () => HeaderTitle,
   JoinedLabel: () => JoinedLabel,
+  LoginServer: () => LoginServer,
   RowActions: () => RowActions,
   StateEmpty: () => StateEmpty,
   UserRole: () => UserRole,
@@ -89,6 +91,7 @@ __export(index_exports, {
   features: () => features,
   flexRender: () => import_react_table4.flexRender,
   getTableExportData: () => getTableExportData,
+  loginSchema: () => loginSchema,
   printTable: () => printTable,
   smartFilterFn: () => smartFilterFn,
   useTable: () => import_react_table4.useTable
@@ -3671,6 +3674,513 @@ var HeaderTitle = (0, import_react14.memo)(function HeaderTitle2({
     children
   ] });
 });
+
+// src/components/composed/icons/google.tsx
+var import_jsx_runtime41 = require("react/jsx-runtime");
+function GoogleIcon(_a) {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
+    "svg",
+    __spreadProps(__spreadValues({
+      role: "img",
+      viewBox: "0 0 24 24",
+      "aria-label": "Google logo",
+      className,
+      xmlns: "http://www.w3.org/2000/svg"
+    }, props), {
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+          "path",
+          {
+            fill: "#4285F4",
+            d: "M23.745 12.27c0-.7-.06-1.4-.19-2.07H12v4.51h6.6c-.29 1.52-1.14 2.82-2.4 3.68v3.05h3.88c2.27-2.09 3.665-5.17 3.665-9.17z"
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+          "path",
+          {
+            fill: "#34A853",
+            d: "M12 24c3.24 0 5.95-1.08 7.93-2.91l-3.88-3.05c-1.08.72-2.45 1.16-4.05 1.16-3.12 0-5.77-2.1-6.72-4.93H1.24v3.15C3.26 21.36 7.33 24 12 24z"
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+          "path",
+          {
+            fill: "#FBBC05",
+            d: "M5.28 14.27c-.25-.72-.38-1.49-.38-2.27s.13-1.55.38-2.27V6.58H1.24C.45 8.16 0 9.97 0 12s.45 3.84 1.24 5.42l4.04-3.15z"
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+          "path",
+          {
+            fill: "#EA4335",
+            d: "M12 4.75c1.77 0 3.35.61 4.6 1.8l3.42-3.42C17.95 1.19 15.24 0 12 0 7.33 0 3.26 2.64 1.24 6.58l4.04 3.15c.95-2.83 3.6-4.98 6.72-4.98z"
+          }
+        )
+      ]
+    })
+  );
+}
+
+// src/components/composed/login-server.tsx
+var import_zod = require("@hookform/resolvers/zod");
+var import_cn24 = require("cn");
+var import_lucide_react23 = require("lucide-react");
+var import_link3 = __toESM(require("next/link"));
+var import_react16 = require("react");
+var import_react_hook_form = require("react-hook-form");
+var import_zod2 = require("zod");
+
+// src/components/ui/card.tsx
+var import_cn20 = require("cn");
+var import_jsx_runtime42 = require("react/jsx-runtime");
+function Card(_a) {
+  var _b = _a, {
+    className,
+    size = "default"
+  } = _b, props = __objRest(_b, [
+    "className",
+    "size"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+    "div",
+    __spreadValues({
+      "data-slot": "card",
+      "data-size": size,
+      className: (0, import_cn20.cn)(
+        "group/card flex flex-col gap-(--card-spacing) overflow-hidden rounded-lg bg-card py-(--card-spacing) text-xs/relaxed text-card-foreground ring-1 ring-foreground/10 [--card-spacing:--spacing(4)] has-[>img:first-child]:pt-0 data-[size=sm]:[--card-spacing:--spacing(3)] *:[img:first-child]:rounded-t-lg *:[img:last-child]:rounded-b-lg",
+        className
+      )
+    }, props)
+  );
+}
+function CardHeader(_a) {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+    "div",
+    __spreadValues({
+      "data-slot": "card-header",
+      className: (0, import_cn20.cn)(
+        "group/card-header @container/card-header grid auto-rows-min items-start gap-1 rounded-t-lg px-(--card-spacing) has-data-[slot=card-action]:grid-cols-[1fr_auto] has-data-[slot=card-description]:grid-rows-[auto_auto] [.border-b]:pb-(--card-spacing)",
+        className
+      )
+    }, props)
+  );
+}
+function CardTitle(_a) {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+    "div",
+    __spreadValues({
+      "data-slot": "card-title",
+      className: (0, import_cn20.cn)("font-heading text-sm font-medium", className)
+    }, props)
+  );
+}
+function CardDescription(_a) {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+    "div",
+    __spreadValues({
+      "data-slot": "card-description",
+      className: (0, import_cn20.cn)("text-xs/relaxed text-muted-foreground", className)
+    }, props)
+  );
+}
+function CardContent(_a) {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+    "div",
+    __spreadValues({
+      "data-slot": "card-content",
+      className: (0, import_cn20.cn)("px-(--card-spacing)", className)
+    }, props)
+  );
+}
+
+// src/components/ui/field.tsx
+var import_class_variance_authority6 = require("class-variance-authority");
+var import_cn22 = require("cn");
+var import_react15 = require("react");
+
+// src/components/ui/label.tsx
+var import_cn21 = require("cn");
+var import_jsx_runtime43 = require("react/jsx-runtime");
+function Label(_a) {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
+    "label",
+    __spreadValues({
+      "data-slot": "label",
+      className: (0, import_cn21.cn)(
+        "flex items-center gap-2 text-xs/relaxed leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50",
+        className
+      )
+    }, props)
+  );
+}
+
+// src/components/ui/field.tsx
+var import_jsx_runtime44 = require("react/jsx-runtime");
+function FieldGroup(_a) {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+    "div",
+    __spreadValues({
+      "data-slot": "field-group",
+      className: (0, import_cn22.cn)(
+        "group/field-group @container/field-group flex w-full flex-col gap-4 data-[slot=checkbox-group]:gap-3 *:data-[slot=field-group]:gap-4",
+        className
+      )
+    }, props)
+  );
+}
+var fieldVariants = (0, import_class_variance_authority6.cva)(
+  "group/field flex w-full gap-2 data-[invalid=true]:text-destructive",
+  {
+    variants: {
+      orientation: {
+        vertical: "flex-col *:w-full [&>.sr-only]:w-auto",
+        horizontal: "flex-row items-center has-[>[data-slot=field-content]]:items-start *:data-[slot=field-label]:flex-auto has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px",
+        responsive: "flex-col *:w-full @md/field-group:flex-row @md/field-group:items-center @md/field-group:*:w-auto @md/field-group:has-[>[data-slot=field-content]]:items-start @md/field-group:*:data-[slot=field-label]:flex-auto [&>.sr-only]:w-auto @md/field-group:has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px"
+      }
+    },
+    defaultVariants: {
+      orientation: "vertical"
+    }
+  }
+);
+function Field(_a) {
+  var _b = _a, {
+    className,
+    orientation = "vertical"
+  } = _b, props = __objRest(_b, [
+    "className",
+    "orientation"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+    "div",
+    __spreadValues({
+      role: "group",
+      "data-slot": "field",
+      "data-orientation": orientation,
+      className: (0, import_cn22.cn)(fieldVariants({ orientation }), className)
+    }, props)
+  );
+}
+function FieldLabel(_a) {
+  var _b = _a, {
+    className
+  } = _b, props = __objRest(_b, [
+    "className"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+    Label,
+    __spreadValues({
+      "data-slot": "field-label",
+      className: (0, import_cn22.cn)(
+        "group/field-label peer/field-label flex w-fit gap-2 leading-snug group-data-[disabled=true]/field:opacity-50 has-data-checked:bg-primary/5 has-[>[data-slot=field]]:rounded-md has-[>[data-slot=field]]:border has-[>[data-slot=field]]:not-has-[:disabled,[data-disabled]]:hover:bg-input/40 has-[>[data-slot=field]]:has-[:focus-visible]:border-ring has-[>[data-slot=field]]:has-[:focus-visible]:ring-2 has-[>[data-slot=field]]:has-[:focus-visible]:ring-ring/30 *:data-[slot=field]:p-2 dark:has-data-checked:bg-primary/10",
+        "has-[>[data-slot=field]]:w-full has-[>[data-slot=field]]:flex-col",
+        className
+      )
+    }, props)
+  );
+}
+function FieldDescription(_a) {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+    "p",
+    __spreadValues({
+      "data-slot": "field-description",
+      className: (0, import_cn22.cn)(
+        "text-left text-xs/relaxed leading-normal font-normal text-muted-foreground group-has-data-horizontal/field:text-balance [[data-variant=legend]+&]:-mt-1.5",
+        "last:mt-0 nth-last-2:-mt-1",
+        "[&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary",
+        className
+      )
+    }, props)
+  );
+}
+function FieldSeparator(_a) {
+  var _b = _a, {
+    children,
+    className
+  } = _b, props = __objRest(_b, [
+    "children",
+    "className"
+  ]);
+  return /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(
+    "div",
+    __spreadProps(__spreadValues({
+      "data-slot": "field-separator",
+      "data-content": !!children,
+      className: (0, import_cn22.cn)(
+        "relative -my-2 h-5 text-xs/relaxed group-data-[variant=outline]/field-group:-mb-2",
+        className
+      )
+    }, props), {
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(Separator, { className: "absolute inset-0 top-1/2" }),
+        children && /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+          "span",
+          {
+            className: "relative mx-auto block w-fit bg-background px-2 text-muted-foreground",
+            "data-slot": "field-separator-content",
+            children
+          }
+        )
+      ]
+    })
+  );
+}
+function FieldError(_a) {
+  var _b = _a, {
+    className,
+    children,
+    errors
+  } = _b, props = __objRest(_b, [
+    "className",
+    "children",
+    "errors"
+  ]);
+  const content = (0, import_react15.useMemo)(() => {
+    var _a2;
+    if (children) {
+      return children;
+    }
+    if (!(errors == null ? void 0 : errors.length)) {
+      return null;
+    }
+    const uniqueErrors = [
+      ...new Map(errors.map((error) => [error == null ? void 0 : error.message, error])).values()
+    ];
+    if ((uniqueErrors == null ? void 0 : uniqueErrors.length) === 1) {
+      return (_a2 = uniqueErrors[0]) == null ? void 0 : _a2.message;
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("ul", { className: "ml-4 flex list-disc flex-col gap-1", children: uniqueErrors.map(
+      (error, index) => (error == null ? void 0 : error.message) && /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("li", { children: error.message }, index)
+    ) });
+  }, [children, errors]);
+  if (!content) {
+    return null;
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+    "div",
+    __spreadProps(__spreadValues({
+      role: "alert",
+      "data-slot": "field-error",
+      className: (0, import_cn22.cn)("text-xs/relaxed font-normal text-destructive", className)
+    }, props), {
+      children: content
+    })
+  );
+}
+
+// src/components/ui/toast.tsx
+var import_toast = require("@base-ui/react/toast");
+var import_cn23 = require("cn");
+var import_lucide_react22 = require("lucide-react");
+var import_jsx_runtime45 = require("react/jsx-runtime");
+var toast = import_toast.Toast.createToastManager();
+var createToastManager = import_toast.Toast.createToastManager;
+var useToastManager = import_toast.Toast.useToastManager;
+
+// src/components/composed/login-server.tsx
+var import_jsx_runtime46 = require("react/jsx-runtime");
+var loginSchema = import_zod2.z.object({
+  email: import_zod2.z.string().trim().toLowerCase().min(1, "Email is required").max(254, "Email is too long").pipe(import_zod2.z.email("Invalid email format")),
+  password: import_zod2.z.string().min(1, "Password is required").min(8, "Password must be at least 8 characters").max(128, "Password must not exceed 128 characters")
+});
+function LoginServer({
+  onSubmit,
+  onGoogleSignIn,
+  isSubmitting: externalIsSubmitting
+}) {
+  const [isRedirecting, setIsRedirecting] = (0, import_react16.useState)(false);
+  const [isGoogleLoading, setIsGoogleLoading] = (0, import_react16.useState)(false);
+  const form = (0, import_react_hook_form.useForm)({
+    resolver: (0, import_zod.zodResolver)(loginSchema),
+    defaultValues: {
+      email: "",
+      password: ""
+    }
+  });
+  const isPending = externalIsSubmitting != null ? externalIsSubmitting : form.formState.isSubmitting || isRedirecting || isGoogleLoading;
+  const handleFormSubmit = async (values) => {
+    try {
+      if (!onSubmit) {
+        toast.add({
+          description: "Login action handler is not configured."
+        });
+        return;
+      }
+      const res = await onSubmit(values);
+      if (res && typeof res === "object" && "error" in res && typeof res.error === "string" && res.error) {
+        setIsRedirecting(false);
+        toast.add({ description: res.error });
+        return;
+      }
+      setIsRedirecting(true);
+    } catch (e) {
+      setIsRedirecting(false);
+      toast.add({ description: "Unable to process your login request." });
+    }
+  };
+  const handleGoogleSignIn = async () => {
+    if (isPending) return;
+    if (!onGoogleSignIn) {
+      toast.add({
+        description: "Google Sign-In is not currently available."
+      });
+      return;
+    }
+    try {
+      setIsGoogleLoading(true);
+      await onGoogleSignIn();
+    } catch (e) {
+      setIsGoogleLoading(false);
+      toast.add({ description: "Google Sign-In failed to initialize." });
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { className: "flex min-h-svh flex-col items-center justify-center gap-6 bg-muted p-6 md:p-10", children: /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "flex w-full max-w-sm flex-col gap-6", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "flex items-center gap-2 self-center font-medium", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("div", { className: "flex size-6 items-center justify-center rounded-md bg-primary text-primary-foreground", children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_lucide_react23.GalleryVerticalEndIcon, { className: "size-4" }) }),
+      "Prediktif"
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "flex flex-col gap-6", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(Card, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(CardHeader, { className: "text-center", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(CardTitle, { children: "Welcome back" }),
+          /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(CardDescription, { children: "Login with your Google account" })
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(CardContent, { children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)("form", { onSubmit: form.handleSubmit(handleFormSubmit), noValidate: true, children: /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(FieldGroup, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Field, { children: /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(
+            Button,
+            {
+              type: "button",
+              variant: "outline",
+              disabled: isPending,
+              onClick: handleGoogleSignIn,
+              children: [
+                isGoogleLoading ? /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+                  import_lucide_react23.LoaderCircleIcon,
+                  {
+                    className: "animate-spin",
+                    "data-icon": "inline-start"
+                  }
+                ) : /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(GoogleIcon, { className: "size-4 shrink-0" }),
+                "Login with Google"
+              ]
+            }
+          ) }),
+          /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(FieldSeparator, { className: "*:data-[slot=field-separator-content]:bg-card", children: "Or continue with" }),
+          /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+            import_react_hook_form.Controller,
+            {
+              name: "email",
+              control: form.control,
+              render: ({ field, fieldState }) => /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(Field, { "data-invalid": fieldState.invalid, children: [
+                /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(FieldLabel, { htmlFor: field.name, children: "Email" }),
+                /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+                  Input,
+                  __spreadProps(__spreadValues({}, field), {
+                    id: field.name,
+                    "aria-invalid": fieldState.invalid,
+                    disabled: isPending,
+                    placeholder: "m@example.com",
+                    type: "email",
+                    autoComplete: "email"
+                  })
+                ),
+                /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(FieldDescription, { children: "Enter the email address associated with your account." }),
+                fieldState.invalid && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(FieldError, { errors: [fieldState.error] })
+              ] })
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+            import_react_hook_form.Controller,
+            {
+              name: "password",
+              control: form.control,
+              render: ({ field, fieldState }) => /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(Field, { "data-invalid": fieldState.invalid, children: [
+                /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "flex items-center", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(FieldLabel, { htmlFor: field.name, children: "Password" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+                    import_link3.default,
+                    {
+                      href: "/forgot-password",
+                      className: "ml-auto inline-block underline-offset-4 hover:underline",
+                      children: "Forgot your password?"
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+                  Input,
+                  __spreadProps(__spreadValues({}, field), {
+                    id: field.name,
+                    "aria-invalid": fieldState.invalid,
+                    disabled: isPending,
+                    placeholder: "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022",
+                    type: "password",
+                    autoComplete: "current-password"
+                  })
+                ),
+                /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(FieldDescription, { children: "Enter your account password." }),
+                fieldState.invalid && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(FieldError, { errors: [fieldState.error] })
+              ] })
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(Field, { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(
+              Button,
+              {
+                type: "submit",
+                disabled: isPending,
+                className: "w-full",
+                children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+                    import_lucide_react23.LoaderCircleIcon,
+                    {
+                      className: (0, import_cn24.cn)(
+                        "animate-spin",
+                        isPending && !isGoogleLoading ? "block" : "hidden"
+                      ),
+                      "data-icon": "inline-start"
+                    }
+                  ),
+                  /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
+                    import_lucide_react23.LogInIcon,
+                    {
+                      className: (0, import_cn24.cn)(
+                        !isPending || isGoogleLoading ? "block" : "hidden"
+                      ),
+                      "data-icon": "inline-start"
+                    }
+                  ),
+                  isRedirecting ? "Redirecting to application..." : form.formState.isSubmitting ? "Signing in..." : "Login"
+                ]
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(FieldDescription, { className: "text-center", children: [
+              "Don't have an account?",
+              " ",
+              /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_link3.default, { href: "/register", children: "Sign up" })
+            ] })
+          ] })
+        ] }) }) })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(FieldDescription, { className: "px-6 text-center", children: [
+        "By clicking continue, you agree to our",
+        " ",
+        /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_link3.default, { href: "/terms", children: "Terms of Service" }),
+        " and",
+        " ",
+        /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_link3.default, { href: "/privacy", children: "Privacy Policy" }),
+        "."
+      ] })
+    ] })
+  ] }) });
+}
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   AppSidebar,
@@ -3689,9 +4199,11 @@ var HeaderTitle = (0, import_react14.memo)(function HeaderTitle2({
   DataTableHeaderToggle,
   EmailLabel,
   EmailVerified,
+  GoogleIcon,
   HeaderTabs,
   HeaderTitle,
   JoinedLabel,
+  LoginServer,
   RowActions,
   StateEmpty,
   UserRole,
@@ -3702,6 +4214,7 @@ var HeaderTitle = (0, import_react14.memo)(function HeaderTitle2({
   features,
   flexRender,
   getTableExportData,
+  loginSchema,
   printTable,
   smartFilterFn,
   useTable

package/dist/index.mjs

@@ -3644,6 +3644,524 @@ var HeaderTitle = memo10(function HeaderTitle2({
     children
   ] });
 });
+
+// src/components/composed/icons/google.tsx
+import { jsx as jsx41, jsxs as jsxs27 } from "react/jsx-runtime";
+function GoogleIcon(_a) {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ jsxs27(
+    "svg",
+    __spreadProps(__spreadValues({
+      role: "img",
+      viewBox: "0 0 24 24",
+      "aria-label": "Google logo",
+      className,
+      xmlns: "http://www.w3.org/2000/svg"
+    }, props), {
+      children: [
+        /* @__PURE__ */ jsx41(
+          "path",
+          {
+            fill: "#4285F4",
+            d: "M23.745 12.27c0-.7-.06-1.4-.19-2.07H12v4.51h6.6c-.29 1.52-1.14 2.82-2.4 3.68v3.05h3.88c2.27-2.09 3.665-5.17 3.665-9.17z"
+          }
+        ),
+        /* @__PURE__ */ jsx41(
+          "path",
+          {
+            fill: "#34A853",
+            d: "M12 24c3.24 0 5.95-1.08 7.93-2.91l-3.88-3.05c-1.08.72-2.45 1.16-4.05 1.16-3.12 0-5.77-2.1-6.72-4.93H1.24v3.15C3.26 21.36 7.33 24 12 24z"
+          }
+        ),
+        /* @__PURE__ */ jsx41(
+          "path",
+          {
+            fill: "#FBBC05",
+            d: "M5.28 14.27c-.25-.72-.38-1.49-.38-2.27s.13-1.55.38-2.27V6.58H1.24C.45 8.16 0 9.97 0 12s.45 3.84 1.24 5.42l4.04-3.15z"
+          }
+        ),
+        /* @__PURE__ */ jsx41(
+          "path",
+          {
+            fill: "#EA4335",
+            d: "M12 4.75c1.77 0 3.35.61 4.6 1.8l3.42-3.42C17.95 1.19 15.24 0 12 0 7.33 0 3.26 2.64 1.24 6.58l4.04 3.15c.95-2.83 3.6-4.98 6.72-4.98z"
+          }
+        )
+      ]
+    })
+  );
+}
+
+// src/components/composed/login-server.tsx
+import { zodResolver } from "@hookform/resolvers/zod";
+import { cn as cn24 } from "cn";
+import {
+  GalleryVerticalEndIcon,
+  LoaderCircleIcon,
+  LogInIcon
+} from "lucide-react";
+import Link3 from "next/link";
+import { useState as useState6 } from "react";
+import { Controller, useForm } from "react-hook-form";
+import { z } from "zod";
+
+// src/components/ui/card.tsx
+import { cn as cn20 } from "cn";
+import { jsx as jsx42 } from "react/jsx-runtime";
+function Card(_a) {
+  var _b = _a, {
+    className,
+    size = "default"
+  } = _b, props = __objRest(_b, [
+    "className",
+    "size"
+  ]);
+  return /* @__PURE__ */ jsx42(
+    "div",
+    __spreadValues({
+      "data-slot": "card",
+      "data-size": size,
+      className: cn20(
+        "group/card flex flex-col gap-(--card-spacing) overflow-hidden rounded-lg bg-card py-(--card-spacing) text-xs/relaxed text-card-foreground ring-1 ring-foreground/10 [--card-spacing:--spacing(4)] has-[>img:first-child]:pt-0 data-[size=sm]:[--card-spacing:--spacing(3)] *:[img:first-child]:rounded-t-lg *:[img:last-child]:rounded-b-lg",
+        className
+      )
+    }, props)
+  );
+}
+function CardHeader(_a) {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ jsx42(
+    "div",
+    __spreadValues({
+      "data-slot": "card-header",
+      className: cn20(
+        "group/card-header @container/card-header grid auto-rows-min items-start gap-1 rounded-t-lg px-(--card-spacing) has-data-[slot=card-action]:grid-cols-[1fr_auto] has-data-[slot=card-description]:grid-rows-[auto_auto] [.border-b]:pb-(--card-spacing)",
+        className
+      )
+    }, props)
+  );
+}
+function CardTitle(_a) {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ jsx42(
+    "div",
+    __spreadValues({
+      "data-slot": "card-title",
+      className: cn20("font-heading text-sm font-medium", className)
+    }, props)
+  );
+}
+function CardDescription(_a) {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ jsx42(
+    "div",
+    __spreadValues({
+      "data-slot": "card-description",
+      className: cn20("text-xs/relaxed text-muted-foreground", className)
+    }, props)
+  );
+}
+function CardContent(_a) {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ jsx42(
+    "div",
+    __spreadValues({
+      "data-slot": "card-content",
+      className: cn20("px-(--card-spacing)", className)
+    }, props)
+  );
+}
+
+// src/components/ui/field.tsx
+import { cva as cva6 } from "class-variance-authority";
+import { cn as cn22 } from "cn";
+import { useMemo as useMemo4 } from "react";
+
+// src/components/ui/label.tsx
+import { cn as cn21 } from "cn";
+import { jsx as jsx43 } from "react/jsx-runtime";
+function Label(_a) {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ jsx43(
+    "label",
+    __spreadValues({
+      "data-slot": "label",
+      className: cn21(
+        "flex items-center gap-2 text-xs/relaxed leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50",
+        className
+      )
+    }, props)
+  );
+}
+
+// src/components/ui/field.tsx
+import { jsx as jsx44, jsxs as jsxs28 } from "react/jsx-runtime";
+function FieldGroup(_a) {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ jsx44(
+    "div",
+    __spreadValues({
+      "data-slot": "field-group",
+      className: cn22(
+        "group/field-group @container/field-group flex w-full flex-col gap-4 data-[slot=checkbox-group]:gap-3 *:data-[slot=field-group]:gap-4",
+        className
+      )
+    }, props)
+  );
+}
+var fieldVariants = cva6(
+  "group/field flex w-full gap-2 data-[invalid=true]:text-destructive",
+  {
+    variants: {
+      orientation: {
+        vertical: "flex-col *:w-full [&>.sr-only]:w-auto",
+        horizontal: "flex-row items-center has-[>[data-slot=field-content]]:items-start *:data-[slot=field-label]:flex-auto has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px",
+        responsive: "flex-col *:w-full @md/field-group:flex-row @md/field-group:items-center @md/field-group:*:w-auto @md/field-group:has-[>[data-slot=field-content]]:items-start @md/field-group:*:data-[slot=field-label]:flex-auto [&>.sr-only]:w-auto @md/field-group:has-[>[data-slot=field-content]]:[&>[role=checkbox],[role=radio]]:mt-px"
+      }
+    },
+    defaultVariants: {
+      orientation: "vertical"
+    }
+  }
+);
+function Field(_a) {
+  var _b = _a, {
+    className,
+    orientation = "vertical"
+  } = _b, props = __objRest(_b, [
+    "className",
+    "orientation"
+  ]);
+  return /* @__PURE__ */ jsx44(
+    "div",
+    __spreadValues({
+      role: "group",
+      "data-slot": "field",
+      "data-orientation": orientation,
+      className: cn22(fieldVariants({ orientation }), className)
+    }, props)
+  );
+}
+function FieldLabel(_a) {
+  var _b = _a, {
+    className
+  } = _b, props = __objRest(_b, [
+    "className"
+  ]);
+  return /* @__PURE__ */ jsx44(
+    Label,
+    __spreadValues({
+      "data-slot": "field-label",
+      className: cn22(
+        "group/field-label peer/field-label flex w-fit gap-2 leading-snug group-data-[disabled=true]/field:opacity-50 has-data-checked:bg-primary/5 has-[>[data-slot=field]]:rounded-md has-[>[data-slot=field]]:border has-[>[data-slot=field]]:not-has-[:disabled,[data-disabled]]:hover:bg-input/40 has-[>[data-slot=field]]:has-[:focus-visible]:border-ring has-[>[data-slot=field]]:has-[:focus-visible]:ring-2 has-[>[data-slot=field]]:has-[:focus-visible]:ring-ring/30 *:data-[slot=field]:p-2 dark:has-data-checked:bg-primary/10",
+        "has-[>[data-slot=field]]:w-full has-[>[data-slot=field]]:flex-col",
+        className
+      )
+    }, props)
+  );
+}
+function FieldDescription(_a) {
+  var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
+  return /* @__PURE__ */ jsx44(
+    "p",
+    __spreadValues({
+      "data-slot": "field-description",
+      className: cn22(
+        "text-left text-xs/relaxed leading-normal font-normal text-muted-foreground group-has-data-horizontal/field:text-balance [[data-variant=legend]+&]:-mt-1.5",
+        "last:mt-0 nth-last-2:-mt-1",
+        "[&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary",
+        className
+      )
+    }, props)
+  );
+}
+function FieldSeparator(_a) {
+  var _b = _a, {
+    children,
+    className
+  } = _b, props = __objRest(_b, [
+    "children",
+    "className"
+  ]);
+  return /* @__PURE__ */ jsxs28(
+    "div",
+    __spreadProps(__spreadValues({
+      "data-slot": "field-separator",
+      "data-content": !!children,
+      className: cn22(
+        "relative -my-2 h-5 text-xs/relaxed group-data-[variant=outline]/field-group:-mb-2",
+        className
+      )
+    }, props), {
+      children: [
+        /* @__PURE__ */ jsx44(Separator, { className: "absolute inset-0 top-1/2" }),
+        children && /* @__PURE__ */ jsx44(
+          "span",
+          {
+            className: "relative mx-auto block w-fit bg-background px-2 text-muted-foreground",
+            "data-slot": "field-separator-content",
+            children
+          }
+        )
+      ]
+    })
+  );
+}
+function FieldError(_a) {
+  var _b = _a, {
+    className,
+    children,
+    errors
+  } = _b, props = __objRest(_b, [
+    "className",
+    "children",
+    "errors"
+  ]);
+  const content = useMemo4(() => {
+    var _a2;
+    if (children) {
+      return children;
+    }
+    if (!(errors == null ? void 0 : errors.length)) {
+      return null;
+    }
+    const uniqueErrors = [
+      ...new Map(errors.map((error) => [error == null ? void 0 : error.message, error])).values()
+    ];
+    if ((uniqueErrors == null ? void 0 : uniqueErrors.length) === 1) {
+      return (_a2 = uniqueErrors[0]) == null ? void 0 : _a2.message;
+    }
+    return /* @__PURE__ */ jsx44("ul", { className: "ml-4 flex list-disc flex-col gap-1", children: uniqueErrors.map(
+      (error, index) => (error == null ? void 0 : error.message) && /* @__PURE__ */ jsx44("li", { children: error.message }, index)
+    ) });
+  }, [children, errors]);
+  if (!content) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx44(
+    "div",
+    __spreadProps(__spreadValues({
+      role: "alert",
+      "data-slot": "field-error",
+      className: cn22("text-xs/relaxed font-normal text-destructive", className)
+    }, props), {
+      children: content
+    })
+  );
+}
+
+// src/components/ui/toast.tsx
+import { Toast as ToastPrimitive } from "@base-ui/react/toast";
+import { cn as cn23 } from "cn";
+import {
+  CircleCheckIcon,
+  InfoIcon,
+  Loader2Icon,
+  OctagonXIcon,
+  TriangleAlertIcon,
+  XIcon as XIcon3
+} from "lucide-react";
+import { jsx as jsx45, jsxs as jsxs29 } from "react/jsx-runtime";
+var toast = ToastPrimitive.createToastManager();
+var createToastManager = ToastPrimitive.createToastManager;
+var useToastManager = ToastPrimitive.useToastManager;
+
+// src/components/composed/login-server.tsx
+import { jsx as jsx46, jsxs as jsxs30 } from "react/jsx-runtime";
+var loginSchema = z.object({
+  email: z.string().trim().toLowerCase().min(1, "Email is required").max(254, "Email is too long").pipe(z.email("Invalid email format")),
+  password: z.string().min(1, "Password is required").min(8, "Password must be at least 8 characters").max(128, "Password must not exceed 128 characters")
+});
+function LoginServer({
+  onSubmit,
+  onGoogleSignIn,
+  isSubmitting: externalIsSubmitting
+}) {
+  const [isRedirecting, setIsRedirecting] = useState6(false);
+  const [isGoogleLoading, setIsGoogleLoading] = useState6(false);
+  const form = useForm({
+    resolver: zodResolver(loginSchema),
+    defaultValues: {
+      email: "",
+      password: ""
+    }
+  });
+  const isPending = externalIsSubmitting != null ? externalIsSubmitting : form.formState.isSubmitting || isRedirecting || isGoogleLoading;
+  const handleFormSubmit = async (values) => {
+    try {
+      if (!onSubmit) {
+        toast.add({
+          description: "Login action handler is not configured."
+        });
+        return;
+      }
+      const res = await onSubmit(values);
+      if (res && typeof res === "object" && "error" in res && typeof res.error === "string" && res.error) {
+        setIsRedirecting(false);
+        toast.add({ description: res.error });
+        return;
+      }
+      setIsRedirecting(true);
+    } catch (e) {
+      setIsRedirecting(false);
+      toast.add({ description: "Unable to process your login request." });
+    }
+  };
+  const handleGoogleSignIn = async () => {
+    if (isPending) return;
+    if (!onGoogleSignIn) {
+      toast.add({
+        description: "Google Sign-In is not currently available."
+      });
+      return;
+    }
+    try {
+      setIsGoogleLoading(true);
+      await onGoogleSignIn();
+    } catch (e) {
+      setIsGoogleLoading(false);
+      toast.add({ description: "Google Sign-In failed to initialize." });
+    }
+  };
+  return /* @__PURE__ */ jsx46("div", { className: "flex min-h-svh flex-col items-center justify-center gap-6 bg-muted p-6 md:p-10", children: /* @__PURE__ */ jsxs30("div", { className: "flex w-full max-w-sm flex-col gap-6", children: [
+    /* @__PURE__ */ jsxs30("div", { className: "flex items-center gap-2 self-center font-medium", children: [
+      /* @__PURE__ */ jsx46("div", { className: "flex size-6 items-center justify-center rounded-md bg-primary text-primary-foreground", children: /* @__PURE__ */ jsx46(GalleryVerticalEndIcon, { className: "size-4" }) }),
+      "Prediktif"
+    ] }),
+    /* @__PURE__ */ jsxs30("div", { className: "flex flex-col gap-6", children: [
+      /* @__PURE__ */ jsxs30(Card, { children: [
+        /* @__PURE__ */ jsxs30(CardHeader, { className: "text-center", children: [
+          /* @__PURE__ */ jsx46(CardTitle, { children: "Welcome back" }),
+          /* @__PURE__ */ jsx46(CardDescription, { children: "Login with your Google account" })
+        ] }),
+        /* @__PURE__ */ jsx46(CardContent, { children: /* @__PURE__ */ jsx46("form", { onSubmit: form.handleSubmit(handleFormSubmit), noValidate: true, children: /* @__PURE__ */ jsxs30(FieldGroup, { children: [
+          /* @__PURE__ */ jsx46(Field, { children: /* @__PURE__ */ jsxs30(
+            Button,
+            {
+              type: "button",
+              variant: "outline",
+              disabled: isPending,
+              onClick: handleGoogleSignIn,
+              children: [
+                isGoogleLoading ? /* @__PURE__ */ jsx46(
+                  LoaderCircleIcon,
+                  {
+                    className: "animate-spin",
+                    "data-icon": "inline-start"
+                  }
+                ) : /* @__PURE__ */ jsx46(GoogleIcon, { className: "size-4 shrink-0" }),
+                "Login with Google"
+              ]
+            }
+          ) }),
+          /* @__PURE__ */ jsx46(FieldSeparator, { className: "*:data-[slot=field-separator-content]:bg-card", children: "Or continue with" }),
+          /* @__PURE__ */ jsx46(
+            Controller,
+            {
+              name: "email",
+              control: form.control,
+              render: ({ field, fieldState }) => /* @__PURE__ */ jsxs30(Field, { "data-invalid": fieldState.invalid, children: [
+                /* @__PURE__ */ jsx46(FieldLabel, { htmlFor: field.name, children: "Email" }),
+                /* @__PURE__ */ jsx46(
+                  Input,
+                  __spreadProps(__spreadValues({}, field), {
+                    id: field.name,
+                    "aria-invalid": fieldState.invalid,
+                    disabled: isPending,
+                    placeholder: "m@example.com",
+                    type: "email",
+                    autoComplete: "email"
+                  })
+                ),
+                /* @__PURE__ */ jsx46(FieldDescription, { children: "Enter the email address associated with your account." }),
+                fieldState.invalid && /* @__PURE__ */ jsx46(FieldError, { errors: [fieldState.error] })
+              ] })
+            }
+          ),
+          /* @__PURE__ */ jsx46(
+            Controller,
+            {
+              name: "password",
+              control: form.control,
+              render: ({ field, fieldState }) => /* @__PURE__ */ jsxs30(Field, { "data-invalid": fieldState.invalid, children: [
+                /* @__PURE__ */ jsxs30("div", { className: "flex items-center", children: [
+                  /* @__PURE__ */ jsx46(FieldLabel, { htmlFor: field.name, children: "Password" }),
+                  /* @__PURE__ */ jsx46(
+                    Link3,
+                    {
+                      href: "/forgot-password",
+                      className: "ml-auto inline-block underline-offset-4 hover:underline",
+                      children: "Forgot your password?"
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ jsx46(
+                  Input,
+                  __spreadProps(__spreadValues({}, field), {
+                    id: field.name,
+                    "aria-invalid": fieldState.invalid,
+                    disabled: isPending,
+                    placeholder: "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022",
+                    type: "password",
+                    autoComplete: "current-password"
+                  })
+                ),
+                /* @__PURE__ */ jsx46(FieldDescription, { children: "Enter your account password." }),
+                fieldState.invalid && /* @__PURE__ */ jsx46(FieldError, { errors: [fieldState.error] })
+              ] })
+            }
+          ),
+          /* @__PURE__ */ jsxs30(Field, { children: [
+            /* @__PURE__ */ jsxs30(
+              Button,
+              {
+                type: "submit",
+                disabled: isPending,
+                className: "w-full",
+                children: [
+                  /* @__PURE__ */ jsx46(
+                    LoaderCircleIcon,
+                    {
+                      className: cn24(
+                        "animate-spin",
+                        isPending && !isGoogleLoading ? "block" : "hidden"
+                      ),
+                      "data-icon": "inline-start"
+                    }
+                  ),
+                  /* @__PURE__ */ jsx46(
+                    LogInIcon,
+                    {
+                      className: cn24(
+                        !isPending || isGoogleLoading ? "block" : "hidden"
+                      ),
+                      "data-icon": "inline-start"
+                    }
+                  ),
+                  isRedirecting ? "Redirecting to application..." : form.formState.isSubmitting ? "Signing in..." : "Login"
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsxs30(FieldDescription, { className: "text-center", children: [
+              "Don't have an account?",
+              " ",
+              /* @__PURE__ */ jsx46(Link3, { href: "/register", children: "Sign up" })
+            ] })
+          ] })
+        ] }) }) })
+      ] }),
+      /* @__PURE__ */ jsxs30(FieldDescription, { className: "px-6 text-center", children: [
+        "By clicking continue, you agree to our",
+        " ",
+        /* @__PURE__ */ jsx46(Link3, { href: "/terms", children: "Terms of Service" }),
+        " and",
+        " ",
+        /* @__PURE__ */ jsx46(Link3, { href: "/privacy", children: "Privacy Policy" }),
+        "."
+      ] })
+    ] })
+  ] }) });
+}
 export {
   AppSidebar,
   AvatarUser,
@@ -3661,9 +4179,11 @@ export {
   DataTableHeaderToggle,
   EmailLabel,
   EmailVerified,
+  GoogleIcon,
   HeaderTabs,
   HeaderTitle,
   JoinedLabel,
+  LoginServer,
   RowActions,
   StateEmpty,
   UserRole,
@@ -3674,6 +4194,7 @@ export {
   features,
   flexRender3 as flexRender,
   getTableExportData,
+  loginSchema,
   printTable,
   smartFilterFn,
   useTable

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@prediktif/ui",
-  "version": "0.1.22",
+  "version": "0.1.23",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
   "types": "./dist/index.d.ts",
@@ -31,6 +31,7 @@
   },
   "dependencies": {
     "@base-ui/react": "^1.8.0",
+    "@hookform/resolvers": "^5.9.1",
     "@radix-ui/react-use-controllable-state": "^1.2.6",
     "@rive-app/react-webgl2": "^4.34.2",
     "@shadcn/react": "^0.3.1",
@@ -59,6 +60,7 @@
     "react": "19.2.8",
     "react-day-picker": "^10.0.1",
     "react-dom": "19.2.8",
+    "react-hook-form": "^7.88.0",
     "react-jsx-parser": "^2.4.1",
     "react-resizable-panels": "^4.12.4",
     "recharts": "3.8.0",
@@ -68,7 +70,8 @@
     "tokenlens": "^1.3.1",
     "tw-animate-css": "^1.4.0",
     "use-stick-to-bottom": "^1.1.6",
-    "xlsx": "^0.18.5"
+    "xlsx": "^0.18.5",
+    "zod": "^4.6.5"
   },
   "devDependencies": {
     "@biomejs/biome": "2.4.2",