@stackframe/tanstack-start 0.0.1 → 2.8.91

package/dist/components/team-switcher.d.ts

@@ -0,0 +1,31 @@
+import { Team } from "../lib/stack-app/teams/index.js";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/team-switcher.d.ts
+type MockTeam = {
+  id: string;
+  displayName: string;
+  profileImageUrl?: string | null;
+};
+type TeamSwitcherProps<AllowNull extends boolean = false> = {
+  team?: Team;
+  teamId?: string;
+  teams?: Team[];
+  allowNull?: AllowNull;
+  nullLabel?: string;
+  triggerClassName?: string;
+  onChange?: (team: AllowNull extends true ? Team | null : Team) => Promise<void>;
+  mockUser?: {
+    team?: MockTeam;
+  };
+  mockTeams?: MockTeam[];
+  mockProject?: {
+    config: {
+      clientTeamCreationEnabled: boolean;
+    };
+  };
+};
+declare function TeamSwitcher<AllowNull extends boolean = false>(props: TeamSwitcherProps<AllowNull>): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { TeamSwitcher };
+//# sourceMappingURL=team-switcher.d.ts.map

package/dist/components/team-switcher.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"team-switcher.d.ts","names":[],"sources":["../../src/components/team-switcher.tsx"],"mappings":";;;;KA4BK,QAAA;EACH,EAAA;EACA,WAAA;EACA,eAAA;AAAA;AAAA,KAGG,iBAAA;EACH,IAAA,GAAO,IAAA;EACP,MAAA;EACA,KAAA,GAAQ,IAAA;EACR,SAAA,GAAY,SAAA;EACZ,SAAA;EACA,gBAAA;EACA,QAAA,IAAY,IAAA,EAAM,SAAA,gBAAyB,IAAA,UAAc,IAAA,KAAS,OAAA;EAElE,QAAA;IACE,IAAA,GAAO,QAAA;EAAA;EAET,SAAA,GAAY,QAAA;EACZ,WAAA;IACE,MAAA;MACE,yBAAA;IAAA;EAAA;AAAA;AAAA,iBAKU,YAAA,mCAAA,CAAgD,KAAA,EAAO,iBAAA,CAAkB,SAAA,IAAU,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/team-switcher.js

@@ -0,0 +1,123 @@
+'use client';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+const require_chunk = require('../chunk-BE-pF4vm.js');
+let _stackframe_stack_shared_dist_utils_errors = require("@stackframe/stack-shared/dist/utils/errors");
+let _stackframe_stack_shared_dist_utils_promises = require("@stackframe/stack-shared/dist/utils/promises");
+let _stackframe_stack_ui = require("@stackframe/stack-ui");
+let react = require("react");
+let ___index_js = require("../index.js");
+let ___lib_translations_js = require("../lib/translations.js");
+let react_jsx_runtime = require("react/jsx-runtime");
+let lucide_react = require("lucide-react");
+let __team_icon_js = require("./team-icon.js");
+
+//#region src/components/team-switcher.tsx
+function TeamSwitcher(props) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react.Suspense, {
+		fallback: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Fallback, {}),
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Inner, { ...props })
+	});
+}
+function Fallback() {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.Skeleton, { className: "h-9 w-full max-w-64 stack-scope" });
+}
+function Inner(props) {
+	const { t } = (0, ___lib_translations_js.useTranslation)();
+	const appFromHook = (0, ___index_js.useStackApp)();
+	const userFromHook = (0, ___index_js.useUser)();
+	const app = props.mockUser ? {
+		useProject: () => props.mockProject || { config: { clientTeamCreationEnabled: false } },
+		useNavigate: () => () => {},
+		urls: { accountSettings: "/account-settings" }
+	} : appFromHook;
+	const user = props.mockUser ? {
+		selectedTeam: props.mockUser.team,
+		useTeams: () => props.mockTeams || [],
+		setSelectedTeam: async () => {}
+	} : userFromHook;
+	const navigate = app.useNavigate();
+	const project = app.useProject();
+	const rawTeams = props.teams ?? user?.useTeams();
+	const selectedTeam = props.team || rawTeams?.find((team) => team.id === props.teamId);
+	const teams = (0, react.useMemo)(() => rawTeams?.sort((a, b) => b.id === selectedTeam?.id ? 1 : -1), [rawTeams, selectedTeam]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_stackframe_stack_ui.Select, {
+		value: selectedTeam?.id || (props.allowNull ? "null-sentinel" : void 0),
+		onValueChange: (value) => {
+			(0, _stackframe_stack_shared_dist_utils_promises.runAsynchronouslyWithAlert)(async () => {
+				let team = null;
+				if (value !== "null-sentinel") {
+					team = teams?.find((team) => team.id === value) || null;
+					if (!team) throw new _stackframe_stack_shared_dist_utils_errors.StackAssertionError("Team not found, this should not happen");
+				} else team = null;
+				if (props.onChange) await props.onChange(team);
+			});
+		},
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.SelectTrigger, {
+			className: (0, _stackframe_stack_ui.cn)("stack-scope max-w-64", props.triggerClassName),
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.SelectValue, { placeholder: "Select team" })
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_stackframe_stack_ui.SelectContent, {
+			className: "stack-scope",
+			children: [
+				selectedTeam ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_stackframe_stack_ui.SelectGroup, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.SelectLabel, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "flex items-center justify-between",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: t("Current team") }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.Button, {
+						variant: "ghost",
+						size: "icon",
+						className: "h-6 w-6",
+						onClick: () => {
+							if (!props.mockUser) navigate(`${app.urls.accountSettings}#team-${selectedTeam.id}`);
+						},
+						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Settings, { className: "h-4 w-4" })
+					})]
+				}) }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.SelectItem, {
+					value: selectedTeam.id,
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: "flex items-center gap-2",
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__team_icon_js.TeamIcon, { team: selectedTeam }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.Typography, {
+							className: "max-w-40 truncate",
+							children: selectedTeam.displayName
+						})]
+					})
+				})] }) : void 0,
+				props.allowNull && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.SelectGroup, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.SelectItem, {
+					value: "null-sentinel",
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: "flex items-center gap-2",
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__team_icon_js.TeamIcon, { team: "personal" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.Typography, {
+							className: "max-w-40 truncate",
+							children: props.nullLabel || t("No team")
+						})]
+					})
+				}) }),
+				teams?.length ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_stackframe_stack_ui.SelectGroup, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.SelectLabel, { children: t("Other teams") }), teams.filter((team) => team.id !== selectedTeam?.id).map((team) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.SelectItem, {
+					value: team.id,
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: "flex items-center gap-2",
+						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__team_icon_js.TeamIcon, { team }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.Typography, {
+							className: "max-w-64 truncate",
+							children: team.displayName
+						})]
+					})
+				}, team.id))] }) : null,
+				!teams?.length && !props.allowNull ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.SelectGroup, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.SelectLabel, { children: t("No teams yet") }) }) : null,
+				project.config.clientTeamCreationEnabled && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.SelectSeparator, {}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_stackframe_stack_ui.Button, {
+					onClick: () => {
+						if (!props.mockUser) navigate(`${app.urls.accountSettings}#team-creation`);
+					},
+					className: "w-full",
+					variant: "ghost",
+					children: [
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.PlusCircle, { className: "mr-2 h-4 w-4" }),
+						" ",
+						t("Create a team")
+					]
+				}) })] })
+			]
+		})]
+	});
+}
+
+//#endregion
+exports.TeamSwitcher = TeamSwitcher;
+//# sourceMappingURL=team-switcher.js.map

package/dist/components/team-switcher.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"team-switcher.js","names":["Suspense","Skeleton","Select","StackAssertionError","SelectTrigger","SelectValue","SelectContent","SelectGroup","SelectLabel","Button","Settings","SelectItem","TeamIcon","Typography","SelectSeparator","PlusCircle"],"sources":["../../src/components/team-switcher.tsx"],"sourcesContent":["'use client';\n\n\n//===========================================\n// THIS FILE IS AUTO-GENERATED FROM TEMPLATE. DO NOT EDIT IT DIRECTLY, INSTEAD EDIT THE CORRESPONDING FILE IN packages/template\n//===========================================\nimport { StackAssertionError } from \"@stackframe/stack-shared/dist/utils/errors\";\nimport { runAsynchronouslyWithAlert } from \"@stackframe/stack-shared/dist/utils/promises\";\nimport {\n  Button,\n  Select,\n  SelectContent,\n  SelectGroup,\n  SelectItem,\n  SelectLabel,\n  SelectSeparator,\n  SelectTrigger,\n  SelectValue,\n  Skeleton,\n  Typography,\n  cn,\n} from \"@stackframe/stack-ui\";\nimport { PlusCircle, Settings } from \"lucide-react\";\nimport { Suspense, useMemo } from \"react\";\nimport { Team, useStackApp, useUser } from \"..\";\nimport { useTranslation } from \"../lib/translations\";\nimport { TeamIcon } from \"./team-icon\";\n\ntype MockTeam = {\n  id: string,\n  displayName: string,\n  profileImageUrl?: string | null,\n};\n\ntype TeamSwitcherProps<AllowNull extends boolean = false> = {\n  team?: Team,\n  teamId?: string,\n  teams?: Team[],\n  allowNull?: AllowNull,\n  nullLabel?: string,\n  triggerClassName?: string,\n  onChange?: (team: AllowNull extends true ? Team | null : Team) => Promise<void>,\n  // Mock data props\n  mockUser?: {\n    team?: MockTeam,\n  },\n  mockTeams?: MockTeam[],\n  mockProject?: {\n    config: {\n      clientTeamCreationEnabled: boolean,\n    },\n  },\n};\n\nexport function TeamSwitcher<AllowNull extends boolean = false>(props: TeamSwitcherProps<AllowNull>) {\n  return <Suspense fallback={<Fallback />}>\n    <Inner {...props} />\n  </Suspense>;\n}\n\nfunction Fallback() {\n  return <Skeleton className=\"h-9 w-full max-w-64 stack-scope\" />;\n}\n\nfunction Inner<AllowNull extends boolean>(props: TeamSwitcherProps<AllowNull>) {\n  const { t } = useTranslation();\n  const appFromHook = useStackApp();\n  const userFromHook = useUser();\n\n  // Use mock data if provided, otherwise use real data\n  const app = props.mockUser ? {\n    useProject: () => props.mockProject || { config: { clientTeamCreationEnabled: false } },\n    useNavigate: () => () => {}, // Mock navigate function\n    urls: { accountSettings: '/account-settings' },\n  } : appFromHook;\n\n  const user = props.mockUser ? {\n    selectedTeam: props.mockUser.team,\n    useTeams: () => props.mockTeams || [],\n    setSelectedTeam: async () => {}, // Mock function\n  } : userFromHook;\n\n  const navigate = app.useNavigate();\n  const project = app.useProject();\n  const rawTeams = props.teams ?? user?.useTeams();\n  const selectedTeam = props.team || rawTeams?.find(team => team.id === props.teamId);\n  const teams = useMemo(() => rawTeams?.sort((a, b) => b.id === selectedTeam?.id ? 1 : -1), [rawTeams, selectedTeam]);\n\n\n  return (\n    <Select\n      value={selectedTeam?.id || (props.allowNull ? 'null-sentinel' : undefined)}\n      onValueChange={(value) => {\n        runAsynchronouslyWithAlert(async () => {\n          let team: MockTeam | null = null;\n          if (value !== 'null-sentinel') {\n            team = teams?.find(team => team.id === value) || null;\n            if (!team) {\n              throw new StackAssertionError('Team not found, this should not happen');\n            }\n          } else {\n            team = null;\n          }\n\n          // Call onChange callback if provided\n          if (props.onChange) {\n            await props.onChange(team as Team);\n          }\n        });\n      }}\n    >\n      <SelectTrigger className={cn(\"stack-scope max-w-64\", props.triggerClassName)}>\n        <SelectValue placeholder=\"Select team\"/>\n      </SelectTrigger>\n      <SelectContent className=\"stack-scope\">\n        {selectedTeam ? <SelectGroup>\n          <SelectLabel>\n            <div className=\"flex items-center justify-between\">\n              <span>\n                {t('Current team')}\n              </span>\n              <Button\n                variant='ghost'\n                size='icon'\n                className=\"h-6 w-6\"\n                onClick={() => {\n                  if (!props.mockUser) {\n                    navigate(`${app.urls.accountSettings}#team-${selectedTeam.id}`);\n                  }\n                }}\n              >\n                <Settings className=\"h-4 w-4\"/>\n              </Button>\n            </div>\n          </SelectLabel>\n          <SelectItem value={selectedTeam.id}>\n            <div className=\"flex items-center gap-2\">\n              <TeamIcon team={selectedTeam as Team} />\n              <Typography className=\"max-w-40 truncate\">{selectedTeam.displayName}</Typography>\n            </div>\n          </SelectItem>\n        </SelectGroup> : undefined}\n\n        {props.allowNull && <SelectGroup>\n          <SelectItem value=\"null-sentinel\">\n            <div className=\"flex items-center gap-2\">\n              <TeamIcon team='personal' />\n              <Typography className=\"max-w-40 truncate\">{props.nullLabel || t('No team')}</Typography>\n            </div>\n          </SelectItem>\n        </SelectGroup>}\n\n        {teams?.length ?\n          <SelectGroup>\n            <SelectLabel>{t('Other teams')}</SelectLabel>\n            {teams.filter(team => team.id !== selectedTeam?.id)\n              .map(team => (\n                <SelectItem value={team.id} key={team.id}>\n                  <div className=\"flex items-center gap-2\">\n                    <TeamIcon team={team as Team} />\n                    <Typography className=\"max-w-64 truncate\">{team.displayName}</Typography>\n                  </div>\n                </SelectItem>\n              ))}\n          </SelectGroup> : null}\n\n        {!teams?.length && !props.allowNull ?\n          <SelectGroup>\n            <SelectLabel>{t('No teams yet')}</SelectLabel>\n          </SelectGroup> : null}\n\n        {project.config.clientTeamCreationEnabled && <>\n          <SelectSeparator/>\n          <div>\n            <Button\n              onClick={() => {\n                if (!props.mockUser) {\n                  navigate(`${app.urls.accountSettings}#team-creation`);\n                }\n              }}\n              className=\"w-full\"\n              variant='ghost'\n            >\n              <PlusCircle className=\"mr-2 h-4 w-4\"/> {t('Create a team')}\n            </Button>\n          </div>\n        </>}\n      </SelectContent>\n    </Select>\n  );\n}\n"],"mappings":"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"}

package/dist/components/use-in-iframe.d.ts

@@ -0,0 +1,5 @@
+//#region src/components/use-in-iframe.d.ts
+declare function useInIframe(): boolean;
+//#endregion
+export { useInIframe };
+//# sourceMappingURL=use-in-iframe.d.ts.map

package/dist/components/use-in-iframe.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-in-iframe.d.ts","names":[],"sources":["../../src/components/use-in-iframe.tsx"],"mappings":";iBAQgB,WAAA,CAAA"}

package/dist/components/use-in-iframe.js

@@ -0,0 +1,18 @@
+'use client';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+const require_chunk = require('../chunk-BE-pF4vm.js');
+let react = require("react");
+
+//#region src/components/use-in-iframe.tsx
+function useInIframe() {
+	const [isIframe, setIsIframe] = (0, react.useState)(false);
+	(0, react.useEffect)(() => {
+		if (window.self !== window.top) setIsIframe(true);
+	}, []);
+	return isIframe;
+}
+
+//#endregion
+exports.useInIframe = useInIframe;
+//# sourceMappingURL=use-in-iframe.js.map

package/dist/components/use-in-iframe.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-in-iframe.js","names":[],"sources":["../../src/components/use-in-iframe.tsx"],"sourcesContent":["'use client';\n\n\n//===========================================\n// THIS FILE IS AUTO-GENERATED FROM TEMPLATE. DO NOT EDIT IT DIRECTLY, INSTEAD EDIT THE CORRESPONDING FILE IN packages/template\n//===========================================\nimport { useEffect, useState } from \"react\";\n\nexport function useInIframe() {\n  const [isIframe, setIsIframe] = useState(false);\n  useEffect(() => {\n    if (window.self !== window.top) {\n      setIsIframe(true);\n    }\n  }, []);\n\n  return isIframe;\n}\n"],"mappings":";;;;;;;AAQA,SAAgB,cAAc;CAC5B,MAAM,CAAC,UAAU,mCAAwB,MAAM;AAC/C,4BAAgB;AACd,MAAI,OAAO,SAAS,OAAO,IACzB,aAAY,KAAK;IAElB,EAAE,CAAC;AAEN,QAAO"}

package/dist/components/user-button.d.ts

@@ -0,0 +1,22 @@
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+import React from "react";
+
+//#region src/components/user-button.d.ts
+type UserButtonProps = {
+  showUserInfo?: boolean;
+  colorModeToggle?: () => void | Promise<void>;
+  extraItems?: {
+    text: string;
+    icon: React.ReactNode;
+    onClick: () => void | Promise<void>;
+  }[];
+  mockUser?: {
+    displayName?: string;
+    primaryEmail?: string;
+    profileImageUrl?: string;
+  };
+};
+declare function UserButton(props: UserButtonProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { UserButton };
+//# sourceMappingURL=user-button.d.ts.map

package/dist/components/user-button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"user-button.d.ts","names":[],"sources":["../../src/components/user-button.tsx"],"mappings":";;;;KA0BK,eAAA;EACH,YAAA;EACA,eAAA,gBAA+B,OAAA;EAC/B,UAAA;IACE,IAAA;IACA,IAAA,EAAM,KAAA,CAAM,SAAA;IACZ,OAAA,eAAsB,OAAA;EAAA;EAExB,QAAA;IACE,WAAA;IACA,YAAA;IACA,eAAA;EAAA;AAAA;AAAA,iBAIY,UAAA,CAAW,KAAA,EAAO,eAAA,GAAe,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/user-button.js

@@ -0,0 +1,134 @@
+'use client';
+
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+const require_chunk = require('../chunk-BE-pF4vm.js');
+let _stackframe_stack_shared_dist_utils_promises = require("@stackframe/stack-shared/dist/utils/promises");
+let _stackframe_stack_ui = require("@stackframe/stack-ui");
+let react = require("react");
+react = require_chunk.__toESM(react);
+let ___index_js = require("../index.js");
+let ___lib_translations_js = require("../lib/translations.js");
+let react_jsx_runtime = require("react/jsx-runtime");
+let lucide_react = require("lucide-react");
+let __elements_user_avatar_js = require("./elements/user-avatar.js");
+
+//#region src/components/user-button.tsx
+function Item(props) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.DropdownMenuItem, {
+		onClick: () => (0, _stackframe_stack_shared_dist_utils_promises.runAsynchronouslyWithAlert)(props.onClick),
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "flex gap-2 items-center",
+			children: [props.icon, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.Typography, { children: props.text })]
+		})
+	});
+}
+function UserButton(props) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react.Suspense, {
+		fallback: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.Skeleton, { className: "h-[34px] w-[34px] rounded-full stack-scope" }),
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(UserButtonInner, { ...props })
+	});
+}
+function UserButtonInner(props) {
+	const userFromHook = (0, ___index_js.useUser)();
+	const user = props.mockUser ? {
+		displayName: props.mockUser.displayName || "Mock User",
+		primaryEmail: props.mockUser.primaryEmail || "mock@example.com",
+		profileImageUrl: props.mockUser.profileImageUrl,
+		signOut: () => {
+			console.log("Mock sign out - no action taken in demo mode");
+			return Promise.resolve();
+		}
+	} : userFromHook;
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(UserButtonInnerInner, {
+		...props,
+		user
+	});
+}
+function UserButtonInnerInner(props) {
+	const { t } = (0, ___lib_translations_js.useTranslation)();
+	const user = props.user;
+	const app = (0, ___index_js.useStackApp)();
+	const iconProps = {
+		size: 20,
+		className: "h-4 w-4"
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_stackframe_stack_ui.DropdownMenu, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.DropdownMenuTrigger, {
+		className: "outline-none stack-scope rounded-lg hover:bg-muted/50 transition-colors hover:transition-none p-1.5",
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "flex gap-2 items-center",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__elements_user_avatar_js.UserAvatar, { user }), user && props.showUserInfo && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "flex flex-col justify-center text-left min-w-0",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "max-w-40 truncate text-sm font-medium",
+					children: user.displayName
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "max-w-40 truncate text-xs text-muted-foreground",
+					children: user.primaryEmail
+				})]
+			})]
+		})
+	}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_stackframe_stack_ui.DropdownMenuContent, {
+		className: "stack-scope",
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.DropdownMenuLabel, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "flex gap-2 items-center",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__elements_user_avatar_js.UserAvatar, { user }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [
+					user && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.Typography, {
+						className: "max-w-40 truncate",
+						children: user.displayName
+					}),
+					user && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.Typography, {
+						className: "max-w-40 truncate",
+						variant: "secondary",
+						type: "label",
+						children: user.primaryEmail
+					}),
+					!user && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.Typography, { children: t("Not signed in") })
+				] })]
+			}) }),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.DropdownMenuSeparator, {}),
+			user && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Item, {
+				text: t("Account settings"),
+				onClick: async () => {
+					if (props.mockUser) console.log("Mock account settings - no navigation in demo mode");
+					else await app.redirectToAccountSettings();
+				},
+				icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.CircleUser, { ...iconProps })
+			}),
+			!user && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Item, {
+				text: t("Sign in"),
+				onClick: async () => {
+					if (props.mockUser) console.log("Mock sign in - no navigation in demo mode");
+					else await app.redirectToSignIn();
+				},
+				icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.LogIn, { ...iconProps })
+			}),
+			!user && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Item, {
+				text: t("Sign up"),
+				onClick: async () => {
+					if (props.mockUser) console.log("Mock sign up - no navigation in demo mode");
+					else await app.redirectToSignUp();
+				},
+				icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.UserPlus, { ...iconProps })
+			}),
+			user && props.extraItems && props.extraItems.map((item, index) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Item, { ...item }, index)),
+			props.colorModeToggle && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Item, {
+				text: t("Toggle theme"),
+				onClick: props.colorModeToggle,
+				icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.SunMoon, { ...iconProps })
+			}),
+			user && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Item, {
+				text: t("Sign out"),
+				onClick: async () => {
+					if (props.mockUser) console.log("Mock sign out - no action taken in demo mode");
+					else await user.signOut();
+				},
+				icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.LogOut, { ...iconProps })
+			})
+		]
+	})] });
+}
+
+//#endregion
+exports.UserButton = UserButton;
+//# sourceMappingURL=user-button.js.map

package/dist/components/user-button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"user-button.js","names":["DropdownMenuItem","Typography","Suspense","Skeleton","DropdownMenu","DropdownMenuTrigger","UserAvatar","DropdownMenuContent","DropdownMenuLabel","DropdownMenuSeparator","CircleUser","LogIn","UserPlus","SunMoon","LogOut"],"sources":["../../src/components/user-button.tsx"],"sourcesContent":["'use client';\n\n\n//===========================================\n// THIS FILE IS AUTO-GENERATED FROM TEMPLATE. DO NOT EDIT IT DIRECTLY, INSTEAD EDIT THE CORRESPONDING FILE IN packages/template\n//===========================================\n\nimport { runAsynchronouslyWithAlert } from \"@stackframe/stack-shared/dist/utils/promises\";\nimport { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger, Skeleton, Typography } from \"@stackframe/stack-ui\";\nimport { CircleUser, LogIn, LogOut, SunMoon, UserPlus } from \"lucide-react\";\nimport React, { Suspense } from \"react\";\nimport { CurrentUser, useStackApp, useUser } from \"..\";\nimport { useTranslation } from \"../lib/translations\";\nimport { UserAvatar } from \"./elements/user-avatar\";\n\nfunction Item(props: { text: string, icon: React.ReactNode, onClick: () => void | Promise<void> }) {\n  return (\n    <DropdownMenuItem onClick={() => runAsynchronouslyWithAlert(props.onClick)}>\n      <div className=\"flex gap-2 items-center\">\n        {props.icon}\n        <Typography>{props.text}</Typography>\n      </div>\n    </DropdownMenuItem>\n  );\n}\n\ntype UserButtonProps = {\n  showUserInfo?: boolean,\n  colorModeToggle?: () => void | Promise<void>,\n  extraItems?: {\n    text: string,\n    icon: React.ReactNode,\n    onClick: () => void | Promise<void>,\n  }[],\n  mockUser?: {\n    displayName?: string,\n    primaryEmail?: string,\n    profileImageUrl?: string,\n  },\n};\n\nexport function UserButton(props: UserButtonProps) {\n  return (\n    <Suspense fallback={<Skeleton className=\"h-[34px] w-[34px] rounded-full stack-scope\" />}>\n      <UserButtonInner {...props} />\n    </Suspense>\n  );\n}\n\nfunction UserButtonInner(props: UserButtonProps) {\n  const userFromHook = useUser();\n\n  // Use mock user if provided, otherwise use real user\n  const user = props.mockUser ? {\n    displayName: props.mockUser.displayName || 'Mock User',\n    primaryEmail: props.mockUser.primaryEmail || 'mock@example.com',\n    profileImageUrl: props.mockUser.profileImageUrl,\n    signOut: () => {\n      console.log('Mock sign out - no action taken in demo mode');\n      return Promise.resolve();\n    }\n  } as CurrentUser : userFromHook;\n\n  return <UserButtonInnerInner {...props} user={user} />;\n}\n\n\nfunction UserButtonInnerInner(props: UserButtonProps & { user: CurrentUser | null }) {\n  const { t } = useTranslation();\n  const user = props.user;\n  const app = useStackApp();\n\n  const iconProps = { size: 20, className: 'h-4 w-4' };\n\n  return (\n    <DropdownMenu>\n      <DropdownMenuTrigger className=\"outline-none stack-scope rounded-lg hover:bg-muted/50 transition-colors hover:transition-none p-1.5\">\n        <div className=\"flex gap-2 items-center\">\n          <UserAvatar user={user} />\n          {user && props.showUserInfo &&\n            <div className=\"flex flex-col justify-center text-left min-w-0\">\n              <div className=\"max-w-40 truncate text-sm font-medium\">{user.displayName}</div>\n              <div className=\"max-w-40 truncate text-xs text-muted-foreground\">{user.primaryEmail}</div>\n            </div>\n          }\n        </div>\n      </DropdownMenuTrigger>\n      <DropdownMenuContent className=\"stack-scope\">\n        <DropdownMenuLabel>\n          <div className=\"flex gap-2 items-center\">\n            <UserAvatar user={user} />\n            <div>\n              {user && <Typography className=\"max-w-40 truncate\">{user.displayName}</Typography>}\n              {user && <Typography className=\"max-w-40 truncate\" variant=\"secondary\" type='label'>{user.primaryEmail}</Typography>}\n              {!user && <Typography>{t('Not signed in')}</Typography>}\n            </div>\n          </div>\n        </DropdownMenuLabel>\n        <DropdownMenuSeparator />\n        {user && <Item\n          text={t('Account settings')}\n          onClick={async () => {\n            if (props.mockUser) {\n              console.log('Mock account settings - no navigation in demo mode');\n            } else {\n              await app.redirectToAccountSettings();\n            }\n          }}\n          icon={<CircleUser {...iconProps} />}\n        />}\n        {!user && <Item\n          text={t('Sign in')}\n          onClick={async () => {\n            if (props.mockUser) {\n              console.log('Mock sign in - no navigation in demo mode');\n            } else {\n              await app.redirectToSignIn();\n            }\n          }}\n          icon={<LogIn {...iconProps} />}\n        />}\n        {!user && <Item\n          text={t('Sign up')}\n          onClick={async () => {\n            if (props.mockUser) {\n              console.log('Mock sign up - no navigation in demo mode');\n            } else {\n              await app.redirectToSignUp();\n            }\n          }}\n          icon={<UserPlus {...iconProps}/> }\n        />}\n        {user && props.extraItems && props.extraItems.map((item, index) => (\n          <Item key={index} {...item} />\n        ))}\n        {props.colorModeToggle && (\n          <Item\n            text={t('Toggle theme')}\n            onClick={props.colorModeToggle}\n            icon={<SunMoon {...iconProps} />}\n          />\n        )}\n        {user && <Item\n          text={t('Sign out')}\n          onClick={async () => {\n            if (props.mockUser) {\n              console.log('Mock sign out - no action taken in demo mode');\n            } else {\n              await user.signOut();\n            }\n          }}\n          icon={<LogOut {...iconProps} />}\n        />}\n      </DropdownMenuContent>\n    </DropdownMenu>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;AAeA,SAAS,KAAK,OAAqF;AACjG,QACE,2CAACA;EAAiB,4FAA0C,MAAM,QAAQ;YACxE,4CAAC;GAAI,WAAU;cACZ,MAAM,MACP,2CAACC,6CAAY,MAAM,OAAkB;IACjC;GACW;;AAmBvB,SAAgB,WAAW,OAAwB;AACjD,QACE,2CAACC;EAAS,UAAU,2CAACC,iCAAS,WAAU,+CAA+C;YACrF,2CAAC,mBAAgB,GAAI,QAAS;GACrB;;AAIf,SAAS,gBAAgB,OAAwB;CAC/C,MAAM,yCAAwB;CAG9B,MAAM,OAAO,MAAM,WAAW;EAC5B,aAAa,MAAM,SAAS,eAAe;EAC3C,cAAc,MAAM,SAAS,gBAAgB;EAC7C,iBAAiB,MAAM,SAAS;EAChC,eAAe;AACb,WAAQ,IAAI,+CAA+C;AAC3D,UAAO,QAAQ,SAAS;;EAE3B,GAAkB;AAEnB,QAAO,2CAAC;EAAqB,GAAI;EAAa;GAAQ;;AAIxD,SAAS,qBAAqB,OAAuD;CACnF,MAAM,EAAE,kDAAsB;CAC9B,MAAM,OAAO,MAAM;CACnB,MAAM,oCAAmB;CAEzB,MAAM,YAAY;EAAE,MAAM;EAAI,WAAW;EAAW;AAEpD,QACE,4CAACC,gDACC,2CAACC;EAAoB,WAAU;YAC7B,4CAAC;GAAI,WAAU;cACb,2CAACC,wCAAiB,OAAQ,EACzB,QAAQ,MAAM,gBACb,4CAAC;IAAI,WAAU;eACb,2CAAC;KAAI,WAAU;eAAyC,KAAK;MAAkB,EAC/E,2CAAC;KAAI,WAAU;eAAmD,KAAK;MAAmB;KACtF;IAEJ;GACc,EACtB,4CAACC;EAAoB,WAAU;;GAC7B,2CAACC,oDACC,4CAAC;IAAI,WAAU;eACb,2CAACF,wCAAiB,OAAQ,EAC1B,4CAAC;KACE,QAAQ,2CAACL;MAAW,WAAU;gBAAqB,KAAK;OAAyB;KACjF,QAAQ,2CAACA;MAAW,WAAU;MAAoB,SAAQ;MAAY,MAAK;gBAAS,KAAK;OAA0B;KACnH,CAAC,QAAQ,2CAACA,6CAAY,EAAE,gBAAgB,GAAc;QACnD;KACF,GACY;GACpB,2CAACQ,+CAAwB;GACxB,QAAQ,2CAAC;IACR,MAAM,EAAE,mBAAmB;IAC3B,SAAS,YAAY;AACnB,SAAI,MAAM,SACR,SAAQ,IAAI,qDAAqD;SAEjE,OAAM,IAAI,2BAA2B;;IAGzC,MAAM,2CAACC,2BAAW,GAAI,YAAa;KACnC;GACD,CAAC,QAAQ,2CAAC;IACT,MAAM,EAAE,UAAU;IAClB,SAAS,YAAY;AACnB,SAAI,MAAM,SACR,SAAQ,IAAI,4CAA4C;SAExD,OAAM,IAAI,kBAAkB;;IAGhC,MAAM,2CAACC,sBAAM,GAAI,YAAa;KAC9B;GACD,CAAC,QAAQ,2CAAC;IACT,MAAM,EAAE,UAAU;IAClB,SAAS,YAAY;AACnB,SAAI,MAAM,SACR,SAAQ,IAAI,4CAA4C;SAExD,OAAM,IAAI,kBAAkB;;IAGhC,MAAM,2CAACC,yBAAS,GAAI,YAAY;KAChC;GACD,QAAQ,MAAM,cAAc,MAAM,WAAW,KAAK,MAAM,UACvD,2CAAC,QAAiB,GAAI,QAAX,MAAmB,CAC9B;GACD,MAAM,mBACL,2CAAC;IACC,MAAM,EAAE,eAAe;IACvB,SAAS,MAAM;IACf,MAAM,2CAACC,wBAAQ,GAAI,YAAa;KAChC;GAEH,QAAQ,2CAAC;IACR,MAAM,EAAE,WAAW;IACnB,SAAS,YAAY;AACnB,SAAI,MAAM,SACR,SAAQ,IAAI,+CAA+C;SAE3D,OAAM,KAAK,SAAS;;IAGxB,MAAM,2CAACC,uBAAO,GAAI,YAAa;KAC/B;;GACkB,IACT"}

package/dist/components-page/account-settings/active-sessions/active-sessions-page.d.ts

@@ -0,0 +1,20 @@
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components-page/account-settings/active-sessions/active-sessions-page.d.ts
+declare function ActiveSessionsPage(props?: {
+  mockSessions?: Array<{
+    id: string;
+    isCurrentSession: boolean;
+    isImpersonation?: boolean;
+    createdAt: string;
+    lastUsedAt?: string;
+    geoInfo?: {
+      ip?: string;
+      cityName?: string;
+    };
+  }>;
+  mockMode?: boolean;
+}): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { ActiveSessionsPage };
+//# sourceMappingURL=active-sessions-page.d.ts.map

package/dist/components-page/account-settings/active-sessions/active-sessions-page.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"active-sessions-page.d.ts","names":[],"sources":["../../../../src/components-page/account-settings/active-sessions/active-sessions-page.tsx"],"mappings":";;;iBAcgB,kBAAA,CAAmB,KAAA;EACjC,YAAA,GAAe,KAAA;IACb,EAAA;IACA,gBAAA;IACA,eAAA;IACA,SAAA;IACA,UAAA;IACA,OAAA;MACE,EAAA;MACA,QAAA;IAAA;EAAA;EAGJ,QAAA;AAAA,IACD,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components-page/account-settings/active-sessions/active-sessions-page.js

@@ -0,0 +1,208 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+const require_chunk = require('../../../chunk-BE-pF4vm.js');
+let _stackframe_stack_shared_dist_utils_errors = require("@stackframe/stack-shared/dist/utils/errors");
+let _stackframe_stack_shared_dist_utils_promises = require("@stackframe/stack-shared/dist/utils/promises");
+let _stackframe_stack_ui = require("@stackframe/stack-ui");
+let react = require("react");
+let react_jsx_runtime = require("react/jsx-runtime");
+let _stackframe_stack_shared_dist_utils_dates = require("@stackframe/stack-shared/dist/utils/dates");
+let _________lib_hooks_js = require("../../../lib/hooks.js");
+let _________lib_translations_js = require("../../../lib/translations.js");
+let ___page_layout_js = require("../page-layout.js");
+
+//#region src/components-page/account-settings/active-sessions/active-sessions-page.tsx
+function ActiveSessionsPage(props) {
+	const { t } = (0, _________lib_translations_js.useTranslation)();
+	const userFromHook = (0, _________lib_hooks_js.useUser)({ or: props?.mockSessions || props?.mockMode ? "return-null" : "throw" });
+	const [isLoading, setIsLoading] = (0, react.useState)(!props?.mockSessions);
+	const [isRevokingAll, setIsRevokingAll] = (0, react.useState)(false);
+	const [sessions, setSessions] = (0, react.useState)([]);
+	const [showConfirmRevokeAll, setShowConfirmRevokeAll] = (0, react.useState)(false);
+	const mockSessionsData = props?.mockSessions ? props.mockSessions.map((session) => ({
+		id: session.id,
+		isCurrentSession: session.isCurrentSession,
+		isImpersonation: session.isImpersonation || false,
+		createdAt: session.createdAt,
+		lastUsedAt: session.lastUsedAt,
+		geoInfo: session.geoInfo
+	})) : [{
+		id: "current-session",
+		isCurrentSession: true,
+		createdAt: (/* @__PURE__ */ new Date()).toISOString(),
+		lastUsedAt: (/* @__PURE__ */ new Date()).toISOString(),
+		geoInfo: {
+			ip: "192.168.1.1",
+			cityName: "San Francisco"
+		}
+	}, {
+		id: "mobile-session",
+		isCurrentSession: false,
+		createdAt: (/* @__PURE__ */ new Date(Date.now() - 864e5)).toISOString(),
+		lastUsedAt: (/* @__PURE__ */ new Date(Date.now() - 72e5)).toISOString(),
+		geoInfo: {
+			ip: "10.0.0.1",
+			cityName: "New York"
+		}
+	}];
+	(0, react.useEffect)(() => {
+		if (props?.mockSessions) {
+			setSessions(mockSessionsData);
+			setIsLoading(false);
+			return;
+		}
+		if (props?.mockMode && !userFromHook) {
+			setSessions(mockSessionsData);
+			setIsLoading(false);
+			return;
+		}
+		if (!userFromHook) return;
+		(0, _stackframe_stack_shared_dist_utils_promises.runAsynchronously)(async () => {
+			setIsLoading(true);
+			setSessions(await userFromHook.getActiveSessions());
+			setIsLoading(false);
+		});
+	}, [userFromHook, props?.mockSessions]);
+	const handleRevokeSession = async (sessionId) => {
+		if (props?.mockSessions) {
+			setSessions((prev) => prev.filter((session) => session.id !== sessionId));
+			return;
+		}
+		if (!userFromHook) return;
+		try {
+			await userFromHook.revokeSession(sessionId);
+			setSessions((prev) => prev.filter((session) => session.id !== sessionId));
+		} catch (error) {
+			(0, _stackframe_stack_shared_dist_utils_errors.captureError)("session-revoke", {
+				sessionId,
+				error
+			});
+			throw error;
+		}
+	};
+	const handleRevokeAllSessions = async () => {
+		setIsRevokingAll(true);
+		try {
+			if (props?.mockSessions) setSessions((prevSessions) => prevSessions.filter((session) => session.isCurrentSession));
+			else if (userFromHook) {
+				const deletionPromises = sessions.filter((session) => !session.isCurrentSession).map((session) => userFromHook.revokeSession(session.id));
+				await Promise.all(deletionPromises);
+				setSessions((prevSessions) => prevSessions.filter((session) => session.isCurrentSession));
+			}
+		} catch (error) {
+			(0, _stackframe_stack_shared_dist_utils_errors.captureError)("all-sessions-revoke", {
+				error,
+				sessionIds: sessions.map((session) => session.id)
+			});
+			throw error;
+		} finally {
+			setIsRevokingAll(false);
+			setShowConfirmRevokeAll(false);
+		}
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(___page_layout_js.PageLayout, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [
+		/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "flex justify-between items-center mb-2",
+			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.Typography, {
+				className: "font-medium",
+				children: t("Active Sessions")
+			}), sessions.filter((s) => !s.isCurrentSession).length > 0 && !isLoading && (showConfirmRevokeAll ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "flex gap-2",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.Button, {
+					variant: "destructive",
+					size: "sm",
+					loading: isRevokingAll,
+					onClick: handleRevokeAllSessions,
+					children: t("Confirm")
+				}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.Button, {
+					variant: "secondary",
+					size: "sm",
+					disabled: isRevokingAll,
+					onClick: () => setShowConfirmRevokeAll(false),
+					children: t("Cancel")
+				})]
+			}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.Button, {
+				variant: "outline",
+				size: "sm",
+				onClick: () => setShowConfirmRevokeAll(true),
+				children: t("Revoke All Other Sessions")
+			}))]
+		}),
+		/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.Typography, {
+			variant: "secondary",
+			type: "footnote",
+			className: "mb-4",
+			children: t("These are devices where you're currently logged in. You can revoke access to end a session.")
+		}),
+		isLoading ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.Skeleton, { className: "h-[300px] w-full rounded-md" }) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: "border rounded-md",
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_stackframe_stack_ui.Table, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.TableHeader, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_stackframe_stack_ui.TableRow, { children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.TableHead, {
+					className: "w-[200px]",
+					children: t("Session")
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.TableHead, {
+					className: "w-[150px]",
+					children: t("IP Address")
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.TableHead, {
+					className: "w-[150px]",
+					children: t("Location")
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.TableHead, {
+					className: "w-[150px]",
+					children: t("Last used")
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.TableHead, { className: "w-[80px]" })
+			] }) }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.TableBody, { children: sessions.length === 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.TableRow, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.TableCell, {
+				colSpan: 5,
+				className: "text-center py-6",
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.Typography, {
+					variant: "secondary",
+					children: t("No active sessions found")
+				})
+			}) }) : sessions.map((session) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_stackframe_stack_ui.TableRow, { children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.TableCell, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "flex flex-col",
+					children: [
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.Typography, { children: session.isCurrentSession ? t("Current Session") : t("Other Session") }),
+						session.isImpersonation && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.Badge, {
+							variant: "secondary",
+							className: "w-fit mt-1",
+							children: t("Impersonation")
+						}),
+						/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.Typography, {
+							variant: "secondary",
+							type: "footnote",
+							children: t("Signed in {time}", { time: new Date(session.createdAt).toLocaleDateString() })
+						})
+					]
+				}) }),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.TableCell, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.Typography, { children: session.geoInfo?.ip || t("-") }) }),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.TableCell, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.Typography, { children: session.geoInfo?.cityName || t("Unknown") }) }),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.TableCell, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					className: "flex flex-col",
+					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.Typography, { children: session.lastUsedAt ? (0, _stackframe_stack_shared_dist_utils_dates.fromNow)(new Date(session.lastUsedAt)) : t("Never") }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.Typography, {
+						variant: "secondary",
+						type: "footnote",
+						title: session.lastUsedAt ? new Date(session.lastUsedAt).toLocaleString() : "",
+						children: session.lastUsedAt ? new Date(session.lastUsedAt).toLocaleDateString() : ""
+					})]
+				}) }),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.TableCell, {
+					align: "right",
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_stackframe_stack_ui.ActionCell, { items: [{
+						item: t("Revoke"),
+						onClick: () => handleRevokeSession(session.id),
+						danger: true,
+						disabled: session.isCurrentSession,
+						disabledTooltip: session.isCurrentSession ? t("You cannot revoke your current session") : void 0
+					}] })
+				})
+			] }, session.id)) })] })
+		})
+	] }) });
+}
+
+//#endregion
+exports.ActiveSessionsPage = ActiveSessionsPage;
+//# sourceMappingURL=active-sessions-page.js.map