@stackframe/stack 2.4.4 → 2.4.6

package/dist/components/card-frame.d.mts

@@ -4,6 +4,6 @@ import React__default from 'react';
 declare function CardFrame({ children, fullPage }: {
     children: React__default.ReactNode;
     fullPage?: boolean;
-}): string | number | boolean | Iterable<React__default.ReactNode> | Promise<React__default.AwaitedReactNode> | react_jsx_runtime.JSX.Element | null | undefined;
+}): string | number | boolean | react_jsx_runtime.JSX.Element | Iterable<React__default.ReactNode> | Promise<React__default.AwaitedReactNode> | null | undefined;
 
 export { CardFrame as default };

package/dist/components/card-frame.d.ts

@@ -4,6 +4,6 @@ import React__default from 'react';
 declare function CardFrame({ children, fullPage }: {
     children: React__default.ReactNode;
     fullPage?: boolean;
-}): string | number | boolean | Iterable<React__default.ReactNode> | Promise<React__default.AwaitedReactNode> | react_jsx_runtime.JSX.Element | null | undefined;
+}): string | number | boolean | react_jsx_runtime.JSX.Element | Iterable<React__default.ReactNode> | Promise<React__default.AwaitedReactNode> | null | undefined;
 
 export { CardFrame as default };

package/dist/components/user-avatar.js

@@ -1,7 +1,9 @@
 "use strict";
+var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __export = (target, all) => {
   for (var name in all)
@@ -15,6 +17,14 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
 // src/components/user-avatar.tsx
@@ -25,12 +35,20 @@ __export(user_avatar_exports, {
 module.exports = __toCommonJS(user_avatar_exports);
 var import_rx = require("react-icons/rx");
 var import__ = require("..");
+var import_constants = require("../utils/constants");
+var import_styled_components = __toESM(require("styled-components"));
 var import_jsx_runtime = require("react/jsx-runtime");
+var StyledIcon = (0, import_styled_components.default)(import_rx.RxPerson)`
+  color: ${import_constants.SECONDARY_FONT_COLORS.light};
+  html[data-stack-theme='dark'] & {
+    color: ${import_constants.SECONDARY_FONT_COLORS.dark};
+  }
+`;
 function UserAvatar(props) {
   const user = props.user;
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import__.Avatar, { style: { height: props.size, width: props.size }, children: [
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import__.AvatarImage, { src: user?.profileImageUrl || "" }),
-    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import__.AvatarFallback, { children: user ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import__.Text, { style: { fontWeight: 500 }, children: (user?.displayName || user?.primaryEmail)?.slice(0, 2).toUpperCase() }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_rx.RxPerson, { size: props.size }) })
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import__.AvatarFallback, { children: user ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import__.Text, { style: { fontWeight: 500 }, children: (user?.displayName || user?.primaryEmail)?.slice(0, 2).toUpperCase() }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StyledIcon, { size: props.size }) })
   ] });
 }
 //# sourceMappingURL=user-avatar.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/user-avatar.tsx"],"sourcesContent":["import { RxPerson } from \"react-icons/rx\";\nimport { Avatar, AvatarFallback, AvatarImage, Text } from \"..\";\nimport { User } from \"../lib/stack-app\";\n\nexport default function UserAvatar(props: { size?: number, user: User | null }) {\n  const user = props.user;\n  return (\n    <Avatar style={{ height: props.size, width: props.size }}>\n      <AvatarImage src={user?.profileImageUrl || ''} />\n      <AvatarFallback>\n        {user ? \n          <Text style={{ fontWeight: 500 }}>\n            {(user?.displayName || user?.primaryEmail)?.slice(0, 2).toUpperCase()}\n          </Text> :\n          <RxPerson size={props.size} />}\n      </AvatarFallback>\n    </Avatar>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAAyB;AACzB,eAA0D;AAMtD;AAHW,SAAR,WAA4B,OAA6C;AAC9E,QAAM,OAAO,MAAM;AACnB,SACE,6CAAC,mBAAO,OAAO,EAAE,QAAQ,MAAM,MAAM,OAAO,MAAM,KAAK,GACrD;AAAA,gDAAC,wBAAY,KAAK,MAAM,mBAAmB,IAAI;AAAA,IAC/C,4CAAC,2BACE,iBACC,4CAAC,iBAAK,OAAO,EAAE,YAAY,IAAI,GAC3B,iBAAM,eAAe,MAAM,eAAe,MAAM,GAAG,CAAC,EAAE,YAAY,GACtE,IACA,4CAAC,sBAAS,MAAM,MAAM,MAAM,GAChC;AAAA,KACF;AAEJ;","names":[]}
+{"version":3,"sources":["../../src/components/user-avatar.tsx"],"sourcesContent":["import { RxPerson } from \"react-icons/rx\";\nimport { Avatar, AvatarFallback, AvatarImage, Text } from \"..\";\nimport { User } from \"../lib/stack-app\";\nimport { SECONDARY_FONT_COLORS } from \"../utils/constants\";\nimport styled from \"styled-components\";\n\n\nconst StyledIcon = styled(RxPerson)`\n  color: ${SECONDARY_FONT_COLORS.light};\n  html[data-stack-theme='dark'] & {\n    color: ${SECONDARY_FONT_COLORS.dark};\n  }\n`;\n\nexport default function UserAvatar(props: { size?: number, user: User | null }) {\n  const user = props.user;\n  return (\n    <Avatar style={{ height: props.size, width: props.size }}>\n      <AvatarImage src={user?.profileImageUrl || ''} />\n      <AvatarFallback>\n        {user ? \n          <Text style={{ fontWeight: 500 }}>\n            {(user?.displayName || user?.primaryEmail)?.slice(0, 2).toUpperCase()}\n          </Text> :\n          <StyledIcon size={props.size} />}\n      </AvatarFallback>\n    </Avatar>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAAyB;AACzB,eAA0D;AAE1D,uBAAsC;AACtC,+BAAmB;AAaf;AAVJ,IAAM,iBAAa,yBAAAA,SAAO,kBAAQ;AAAA,WACvB,uCAAsB,KAAK;AAAA;AAAA,aAEzB,uCAAsB,IAAI;AAAA;AAAA;AAIxB,SAAR,WAA4B,OAA6C;AAC9E,QAAM,OAAO,MAAM;AACnB,SACE,6CAAC,mBAAO,OAAO,EAAE,QAAQ,MAAM,MAAM,OAAO,MAAM,KAAK,GACrD;AAAA,gDAAC,wBAAY,KAAK,MAAM,mBAAmB,IAAI;AAAA,IAC/C,4CAAC,2BACE,iBACC,4CAAC,iBAAK,OAAO,EAAE,YAAY,IAAI,GAC3B,iBAAM,eAAe,MAAM,eAAe,MAAM,GAAG,CAAC,EAAE,YAAY,GACtE,IACA,4CAAC,cAAW,MAAM,MAAM,MAAM,GAClC;AAAA,KACF;AAEJ;","names":["styled"]}

package/dist/components-core/button.js

@@ -130,7 +130,7 @@ var StyledButton = import_styled_components.default.button`
   font-family: ${import_constants.FONT_FAMILY};
   font-size: ${import_constants.FONT_SIZES.md};
   opacity: ${(props) => props.disabled ? 0.5 : 1};
-  transition: background-color 0.2s;
+  transition: background-color 0.05s;
   cursor: pointer;
   position: relative;
   &:disabled {

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

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components-core/button.tsx"],"sourcesContent":["'use client';\n\nimport React, { useMemo } from \"react\";\nimport { useDesign } from \"../providers/design-provider\";\nimport Color from 'color';\nimport styled from 'styled-components';\nimport { BORDER_RADIUS, FONT_FAMILY, FONT_SIZES } from \"../utils/constants\";\nimport LoadingIndicator from \"./loading-indicator\";\n\nfunction getColors({\n  propsColor, \n  colors, \n  variant, \n}: {\n  propsColor?: string, \n  colors: { primaryColor: string, secondaryColor: string, backgroundColor: string },\n  variant: 'primary' | 'secondary' | 'warning',\n}): { \n  bgColor: string, \n  hoverBgColor: string,\n  activeBgColor: string,\n  textColor: string,\n} {\n  let bgColor;\n  switch (variant) {\n    case 'primary': {\n      bgColor = colors.primaryColor;\n      break;\n    }\n    case 'secondary': {\n      bgColor = colors.secondaryColor;\n      break;\n    }\n    case 'warning': {\n      bgColor = '#ff4500';\n      break;\n    }\n  }\n  if (propsColor) {\n    bgColor = propsColor;\n  }\n\n  const c = Color(bgColor);\n  const pc = Color(colors.primaryColor);\n\n  const changeColor = (value: number) => {\n    return c.hsl(c.hue(), c.saturationl(), c.lightness() + value).toString();\n  };\n  \n  const getAlpha = (alpha: number) => {\n    return Color(\n      pc.isDark() ? 'white' : 'black'\n    ).alpha(alpha).toString();\n  };\n\n  if (c.alpha() === 0) {\n    return {\n      bgColor: 'transparent',\n      hoverBgColor: getAlpha(0.1),\n      activeBgColor: getAlpha(0.2),\n      textColor: colors.primaryColor,\n    };\n  } else if (c.isLight()) {\n    return {\n      bgColor,\n      hoverBgColor: changeColor(-10),\n      activeBgColor: changeColor(-20),\n      textColor: 'black',\n    };\n  } else {\n    return {\n      bgColor,\n      hoverBgColor: changeColor(10),\n      activeBgColor: changeColor(20),\n      textColor: 'white',\n    };\n  }\n}\n\nexport type ButtonProps = {\n  variant?: 'primary' | 'secondary' | 'warning',\n  color?: string,\n  size?: 'sm' | 'md' | 'lg',\n  loading?: boolean,\n  onClick?: (() => void) | (() => Promise<void>),\n} & Omit<React.HTMLProps<HTMLButtonElement>, 'size' | 'type' | 'onClick'>\n\ntype ButtonColors = {\n  bgColor: string, \n  hoverBgColor: string,\n  activeBgColor: string,\n  textColor: string,\n}\n\nconst StyledButton = styled.button<{\n  $size: 'sm' | 'md' | 'lg',\n  $loading: boolean,\n  $colors: {\n    dark: ButtonColors,\n    light: ButtonColors,\n  },\n}>`\n  border: 0;\n  border-radius: ${BORDER_RADIUS};\n  padding: ${props => {\n    switch (props.$size) {\n      case 'sm': { return '0rem 0.75rem'; }\n      case 'md': { return '0rem 1rem'; }\n      case 'lg': { return '0rem 2rem'; }\n    }\n  }};\n  height: ${props => {\n    switch (props.$size) {\n      case 'sm': { return '2rem'; }\n      case 'md': { return '2.5rem'; }\n      case 'lg': { return '3rem'; }\n    }\n  }};\n  font-family: ${FONT_FAMILY};\n  font-size: ${FONT_SIZES.md};\n  opacity: ${props => props.disabled ? 0.5 : 1};\n  transition: background-color 0.2s;\n  cursor: pointer;\n  position: relative;\n  &:disabled {\n    cursor: auto;\n    opacity: 0.5;\n  }\n\n  background-color: ${props => props.$colors.light.bgColor};\n  color: ${props => props.$colors.light.textColor};\n  &:not([disabled]) {\n    &:active,&:hover:active {\n      background-color: ${props => props.$colors.light.activeBgColor};\n    }\n    &:hover {\n      background-color: ${props => props.$colors.light.hoverBgColor};\n    }\n  }\n\n  html[data-stack-theme='dark'] & {\n    background-color: ${props => props.$colors.dark.bgColor};\n    color: ${props => props.$colors.dark.textColor};\n    &:not([disabled]) {\n      &:active,&:hover:active {\n        background-color: ${props => props.$colors.dark.activeBgColor};\n      }\n      &:hover {\n        background-color: ${props => props.$colors.dark.hoverBgColor};\n      }\n    }\n  }\n`;\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n  ({\n    variant='primary',\n    size='md',\n    loading=false,\n    ...props\n  }, ref) => {\n    const { colors } = useDesign();\n\n    const { dark, light } = useMemo(() => {\n      return {\n        dark: getColors({ propsColor: props.color, colors: colors.dark, variant }),\n        light: getColors({ propsColor: props.color, colors: colors.light, variant }),\n      };\n    }, [props.color, colors, variant]);\n\n    return (\n      <StyledButton\n        ref={ref}\n        $size={size}\n        $loading={loading}\n        $colors={{ dark, light }}\n        {...props}\n      >\n        <span style={{ position: 'absolute', top: '50%', left: '50%', transform: 'translate(-50%, -50%)', visibility: loading ? 'visible' : 'hidden' }}>\n          <LoadingIndicator color={{ light: light.textColor, dark: dark.textColor }}/>\n        </span>\n        <span style={{ visibility: loading ? 'hidden' : 'visible', whiteSpace: 'nowrap' }}>\n          {props.children}\n        </span>\n      </StyledButton>\n    );\n  }\n);\n\nButton.displayName = 'Button';\n\nexport {\n  Button,\n};\n"],"mappings":"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","names":["Color","styled","React","LoadingIndicator"]}
+{"version":3,"sources":["../../src/components-core/button.tsx"],"sourcesContent":["'use client';\n\nimport React, { useMemo } from \"react\";\nimport { useDesign } from \"../providers/design-provider\";\nimport Color from 'color';\nimport styled from 'styled-components';\nimport { BORDER_RADIUS, FONT_FAMILY, FONT_SIZES } from \"../utils/constants\";\nimport LoadingIndicator from \"./loading-indicator\";\n\nfunction getColors({\n  propsColor, \n  colors, \n  variant, \n}: {\n  propsColor?: string, \n  colors: { primaryColor: string, secondaryColor: string, backgroundColor: string },\n  variant: 'primary' | 'secondary' | 'warning',\n}): { \n  bgColor: string, \n  hoverBgColor: string,\n  activeBgColor: string,\n  textColor: string,\n} {\n  let bgColor;\n  switch (variant) {\n    case 'primary': {\n      bgColor = colors.primaryColor;\n      break;\n    }\n    case 'secondary': {\n      bgColor = colors.secondaryColor;\n      break;\n    }\n    case 'warning': {\n      bgColor = '#ff4500';\n      break;\n    }\n  }\n  if (propsColor) {\n    bgColor = propsColor;\n  }\n\n  const c = Color(bgColor);\n  const pc = Color(colors.primaryColor);\n\n  const changeColor = (value: number) => {\n    return c.hsl(c.hue(), c.saturationl(), c.lightness() + value).toString();\n  };\n  \n  const getAlpha = (alpha: number) => {\n    return Color(\n      pc.isDark() ? 'white' : 'black'\n    ).alpha(alpha).toString();\n  };\n\n  if (c.alpha() === 0) {\n    return {\n      bgColor: 'transparent',\n      hoverBgColor: getAlpha(0.1),\n      activeBgColor: getAlpha(0.2),\n      textColor: colors.primaryColor,\n    };\n  } else if (c.isLight()) {\n    return {\n      bgColor,\n      hoverBgColor: changeColor(-10),\n      activeBgColor: changeColor(-20),\n      textColor: 'black',\n    };\n  } else {\n    return {\n      bgColor,\n      hoverBgColor: changeColor(10),\n      activeBgColor: changeColor(20),\n      textColor: 'white',\n    };\n  }\n}\n\nexport type ButtonProps = {\n  variant?: 'primary' | 'secondary' | 'warning',\n  color?: string,\n  size?: 'sm' | 'md' | 'lg',\n  loading?: boolean,\n  onClick?: (() => void) | (() => Promise<void>),\n} & Omit<React.HTMLProps<HTMLButtonElement>, 'size' | 'type' | 'onClick'>\n\ntype ButtonColors = {\n  bgColor: string, \n  hoverBgColor: string,\n  activeBgColor: string,\n  textColor: string,\n}\n\nconst StyledButton = styled.button<{\n  $size: 'sm' | 'md' | 'lg',\n  $loading: boolean,\n  $colors: {\n    dark: ButtonColors,\n    light: ButtonColors,\n  },\n}>`\n  border: 0;\n  border-radius: ${BORDER_RADIUS};\n  padding: ${props => {\n    switch (props.$size) {\n      case 'sm': { return '0rem 0.75rem'; }\n      case 'md': { return '0rem 1rem'; }\n      case 'lg': { return '0rem 2rem'; }\n    }\n  }};\n  height: ${props => {\n    switch (props.$size) {\n      case 'sm': { return '2rem'; }\n      case 'md': { return '2.5rem'; }\n      case 'lg': { return '3rem'; }\n    }\n  }};\n  font-family: ${FONT_FAMILY};\n  font-size: ${FONT_SIZES.md};\n  opacity: ${props => props.disabled ? 0.5 : 1};\n  transition: background-color 0.05s;\n  cursor: pointer;\n  position: relative;\n  &:disabled {\n    cursor: auto;\n    opacity: 0.5;\n  }\n\n  background-color: ${props => props.$colors.light.bgColor};\n  color: ${props => props.$colors.light.textColor};\n  &:not([disabled]) {\n    &:active,&:hover:active {\n      background-color: ${props => props.$colors.light.activeBgColor};\n    }\n    &:hover {\n      background-color: ${props => props.$colors.light.hoverBgColor};\n    }\n  }\n\n  html[data-stack-theme='dark'] & {\n    background-color: ${props => props.$colors.dark.bgColor};\n    color: ${props => props.$colors.dark.textColor};\n    &:not([disabled]) {\n      &:active,&:hover:active {\n        background-color: ${props => props.$colors.dark.activeBgColor};\n      }\n      &:hover {\n        background-color: ${props => props.$colors.dark.hoverBgColor};\n      }\n    }\n  }\n`;\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n  ({\n    variant='primary',\n    size='md',\n    loading=false,\n    ...props\n  }, ref) => {\n    const { colors } = useDesign();\n\n    const { dark, light } = useMemo(() => {\n      return {\n        dark: getColors({ propsColor: props.color, colors: colors.dark, variant }),\n        light: getColors({ propsColor: props.color, colors: colors.light, variant }),\n      };\n    }, [props.color, colors, variant]);\n\n    return (\n      <StyledButton\n        ref={ref}\n        $size={size}\n        $loading={loading}\n        $colors={{ dark, light }}\n        {...props}\n      >\n        <span style={{ position: 'absolute', top: '50%', left: '50%', transform: 'translate(-50%, -50%)', visibility: loading ? 'visible' : 'hidden' }}>\n          <LoadingIndicator color={{ light: light.textColor, dark: dark.textColor }}/>\n        </span>\n        <span style={{ visibility: loading ? 'hidden' : 'visible', whiteSpace: 'nowrap' }}>\n          {props.children}\n        </span>\n      </StyledButton>\n    );\n  }\n);\n\nButton.displayName = 'Button';\n\nexport {\n  Button,\n};\n"],"mappings":"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","names":["Color","styled","React","LoadingIndicator"]}

package/dist/components-core/index.d.mts

@@ -12,18 +12,18 @@ import React__default from 'react';
 declare const Button: React__default.ForwardRefExoticComponent<Omit<Omit<ButtonProps, "ref"> & React__default.RefAttributes<HTMLButtonElement>, "ref"> & React__default.RefAttributes<HTMLButtonElement>>;
 declare const Input: React__default.ForwardRefExoticComponent<Omit<Omit<React__default.InputHTMLAttributes<HTMLInputElement> & Pick<React__default.HTMLProps<HTMLInputElement>, "ref">, "ref"> & React__default.RefAttributes<HTMLInputElement>, "ref"> & React__default.RefAttributes<HTMLInputElement>>;
 declare const Container: React__default.ForwardRefExoticComponent<Omit<{
-    size?: number | "xs" | "sm" | "md" | "lg" | "xl" | undefined;
+    size?: number | "sm" | "md" | "lg" | "xs" | "xl" | undefined;
 } & Omit<React__default.HTMLProps<HTMLDivElement>, "size">, "ref"> & React__default.RefAttributes<HTMLDivElement>>;
 declare const Separator: React__default.ForwardRefExoticComponent<Omit<Omit<_radix_ui_react_separator.SeparatorProps & React__default.RefAttributes<HTMLDivElement>, "ref"> & React__default.RefAttributes<HTMLDivElement>, "ref"> & React__default.RefAttributes<HTMLDivElement>>;
 declare const Label: React__default.ForwardRefExoticComponent<Omit<Omit<_radix_ui_react_label.LabelProps & React__default.RefAttributes<HTMLLabelElement>, "ref"> & React__default.RefAttributes<HTMLLabelElement>, "ref"> & React__default.RefAttributes<HTMLLabelElement>>;
 declare const Link: React__default.ForwardRefExoticComponent<Omit<Omit<{
-    size?: "xs" | "sm" | "md" | "lg" | "xl" | undefined;
+    size?: "sm" | "md" | "lg" | "xs" | "xl" | undefined;
     href: string | url.Url;
 } & Omit<React__default.HTMLProps<HTMLLinkElement>, "size" | "href">, "ref"> & React__default.RefAttributes<HTMLAnchorElement>, "ref"> & React__default.RefAttributes<HTMLAnchorElement>>;
 declare const Text: React__default.ForwardRefExoticComponent<Omit<Omit<{
     variant?: "primary" | "secondary" | "warning" | "success" | undefined;
-    as?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "p" | undefined;
-    size?: "xs" | "sm" | "md" | "lg" | "xl" | undefined;
+    as?: "h2" | "h3" | "p" | "h1" | "h4" | "h5" | "h6" | undefined;
+    size?: "sm" | "md" | "lg" | "xs" | "xl" | undefined;
 } & Omit<React__default.HTMLProps<HTMLParagraphElement>, "size">, "ref"> & React__default.RefAttributes<HTMLParagraphElement>, "ref"> & React__default.RefAttributes<HTMLParagraphElement>>;
 declare const Popover: React__default.ForwardRefExoticComponent<_radix_ui_react_popover.PopoverProps & React__default.RefAttributes<never>>;
 declare const PopoverTrigger: React__default.ForwardRefExoticComponent<Omit<_radix_ui_react_popover.PopoverTriggerProps & React__default.RefAttributes<HTMLButtonElement>, "ref"> & React__default.RefAttributes<HTMLButtonElement>>;

package/dist/components-core/index.d.ts

@@ -12,18 +12,18 @@ import React__default from 'react';
 declare const Button: React__default.ForwardRefExoticComponent<Omit<Omit<ButtonProps, "ref"> & React__default.RefAttributes<HTMLButtonElement>, "ref"> & React__default.RefAttributes<HTMLButtonElement>>;
 declare const Input: React__default.ForwardRefExoticComponent<Omit<Omit<React__default.InputHTMLAttributes<HTMLInputElement> & Pick<React__default.HTMLProps<HTMLInputElement>, "ref">, "ref"> & React__default.RefAttributes<HTMLInputElement>, "ref"> & React__default.RefAttributes<HTMLInputElement>>;
 declare const Container: React__default.ForwardRefExoticComponent<Omit<{
-    size?: number | "xs" | "sm" | "md" | "lg" | "xl" | undefined;
+    size?: number | "sm" | "md" | "lg" | "xs" | "xl" | undefined;
 } & Omit<React__default.HTMLProps<HTMLDivElement>, "size">, "ref"> & React__default.RefAttributes<HTMLDivElement>>;
 declare const Separator: React__default.ForwardRefExoticComponent<Omit<Omit<_radix_ui_react_separator.SeparatorProps & React__default.RefAttributes<HTMLDivElement>, "ref"> & React__default.RefAttributes<HTMLDivElement>, "ref"> & React__default.RefAttributes<HTMLDivElement>>;
 declare const Label: React__default.ForwardRefExoticComponent<Omit<Omit<_radix_ui_react_label.LabelProps & React__default.RefAttributes<HTMLLabelElement>, "ref"> & React__default.RefAttributes<HTMLLabelElement>, "ref"> & React__default.RefAttributes<HTMLLabelElement>>;
 declare const Link: React__default.ForwardRefExoticComponent<Omit<Omit<{
-    size?: "xs" | "sm" | "md" | "lg" | "xl" | undefined;
+    size?: "sm" | "md" | "lg" | "xs" | "xl" | undefined;
     href: string | url.Url;
 } & Omit<React__default.HTMLProps<HTMLLinkElement>, "size" | "href">, "ref"> & React__default.RefAttributes<HTMLAnchorElement>, "ref"> & React__default.RefAttributes<HTMLAnchorElement>>;
 declare const Text: React__default.ForwardRefExoticComponent<Omit<Omit<{
     variant?: "primary" | "secondary" | "warning" | "success" | undefined;
-    as?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "p" | undefined;
-    size?: "xs" | "sm" | "md" | "lg" | "xl" | undefined;
+    as?: "h2" | "h3" | "p" | "h1" | "h4" | "h5" | "h6" | undefined;
+    size?: "sm" | "md" | "lg" | "xs" | "xl" | undefined;
 } & Omit<React__default.HTMLProps<HTMLParagraphElement>, "size">, "ref"> & React__default.RefAttributes<HTMLParagraphElement>, "ref"> & React__default.RefAttributes<HTMLParagraphElement>>;
 declare const Popover: React__default.ForwardRefExoticComponent<_radix_ui_react_popover.PopoverProps & React__default.RefAttributes<never>>;
 declare const PopoverTrigger: React__default.ForwardRefExoticComponent<Omit<_radix_ui_react_popover.PopoverTriggerProps & React__default.RefAttributes<HTMLButtonElement>, "ref"> & React__default.RefAttributes<HTMLButtonElement>>;

package/dist/esm/components/user-avatar.js

@@ -1,12 +1,20 @@
 // src/components/user-avatar.tsx
 import { RxPerson } from "react-icons/rx";
 import { Avatar, AvatarFallback, AvatarImage, Text } from "..";
+import { SECONDARY_FONT_COLORS } from "../utils/constants";
+import styled from "styled-components";
 import { jsx, jsxs } from "react/jsx-runtime";
+var StyledIcon = styled(RxPerson)`
+  color: ${SECONDARY_FONT_COLORS.light};
+  html[data-stack-theme='dark'] & {
+    color: ${SECONDARY_FONT_COLORS.dark};
+  }
+`;
 function UserAvatar(props) {
   const user = props.user;
   return /* @__PURE__ */ jsxs(Avatar, { style: { height: props.size, width: props.size }, children: [
     /* @__PURE__ */ jsx(AvatarImage, { src: user?.profileImageUrl || "" }),
-    /* @__PURE__ */ jsx(AvatarFallback, { children: user ? /* @__PURE__ */ jsx(Text, { style: { fontWeight: 500 }, children: (user?.displayName || user?.primaryEmail)?.slice(0, 2).toUpperCase() }) : /* @__PURE__ */ jsx(RxPerson, { size: props.size }) })
+    /* @__PURE__ */ jsx(AvatarFallback, { children: user ? /* @__PURE__ */ jsx(Text, { style: { fontWeight: 500 }, children: (user?.displayName || user?.primaryEmail)?.slice(0, 2).toUpperCase() }) : /* @__PURE__ */ jsx(StyledIcon, { size: props.size }) })
   ] });
 }
 export {

package/dist/esm/components/user-avatar.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/user-avatar.tsx"],"sourcesContent":["import { RxPerson } from \"react-icons/rx\";\nimport { Avatar, AvatarFallback, AvatarImage, Text } from \"..\";\nimport { User } from \"../lib/stack-app\";\n\nexport default function UserAvatar(props: { size?: number, user: User | null }) {\n  const user = props.user;\n  return (\n    <Avatar style={{ height: props.size, width: props.size }}>\n      <AvatarImage src={user?.profileImageUrl || ''} />\n      <AvatarFallback>\n        {user ? \n          <Text style={{ fontWeight: 500 }}>\n            {(user?.displayName || user?.primaryEmail)?.slice(0, 2).toUpperCase()}\n          </Text> :\n          <RxPerson size={props.size} />}\n      </AvatarFallback>\n    </Avatar>\n  );\n}\n"],"mappings":";AAAA,SAAS,gBAAgB;AACzB,SAAS,QAAQ,gBAAgB,aAAa,YAAY;AAMtD,SACE,KADF;AAHW,SAAR,WAA4B,OAA6C;AAC9E,QAAM,OAAO,MAAM;AACnB,SACE,qBAAC,UAAO,OAAO,EAAE,QAAQ,MAAM,MAAM,OAAO,MAAM,KAAK,GACrD;AAAA,wBAAC,eAAY,KAAK,MAAM,mBAAmB,IAAI;AAAA,IAC/C,oBAAC,kBACE,iBACC,oBAAC,QAAK,OAAO,EAAE,YAAY,IAAI,GAC3B,iBAAM,eAAe,MAAM,eAAe,MAAM,GAAG,CAAC,EAAE,YAAY,GACtE,IACA,oBAAC,YAAS,MAAM,MAAM,MAAM,GAChC;AAAA,KACF;AAEJ;","names":[]}
+{"version":3,"sources":["../../../src/components/user-avatar.tsx"],"sourcesContent":["import { RxPerson } from \"react-icons/rx\";\nimport { Avatar, AvatarFallback, AvatarImage, Text } from \"..\";\nimport { User } from \"../lib/stack-app\";\nimport { SECONDARY_FONT_COLORS } from \"../utils/constants\";\nimport styled from \"styled-components\";\n\n\nconst StyledIcon = styled(RxPerson)`\n  color: ${SECONDARY_FONT_COLORS.light};\n  html[data-stack-theme='dark'] & {\n    color: ${SECONDARY_FONT_COLORS.dark};\n  }\n`;\n\nexport default function UserAvatar(props: { size?: number, user: User | null }) {\n  const user = props.user;\n  return (\n    <Avatar style={{ height: props.size, width: props.size }}>\n      <AvatarImage src={user?.profileImageUrl || ''} />\n      <AvatarFallback>\n        {user ? \n          <Text style={{ fontWeight: 500 }}>\n            {(user?.displayName || user?.primaryEmail)?.slice(0, 2).toUpperCase()}\n          </Text> :\n          <StyledIcon size={props.size} />}\n      </AvatarFallback>\n    </Avatar>\n  );\n}\n"],"mappings":";AAAA,SAAS,gBAAgB;AACzB,SAAS,QAAQ,gBAAgB,aAAa,YAAY;AAE1D,SAAS,6BAA6B;AACtC,OAAO,YAAY;AAaf,SACE,KADF;AAVJ,IAAM,aAAa,OAAO,QAAQ;AAAA,WACvB,sBAAsB,KAAK;AAAA;AAAA,aAEzB,sBAAsB,IAAI;AAAA;AAAA;AAIxB,SAAR,WAA4B,OAA6C;AAC9E,QAAM,OAAO,MAAM;AACnB,SACE,qBAAC,UAAO,OAAO,EAAE,QAAQ,MAAM,MAAM,OAAO,MAAM,KAAK,GACrD;AAAA,wBAAC,eAAY,KAAK,MAAM,mBAAmB,IAAI;AAAA,IAC/C,oBAAC,kBACE,iBACC,oBAAC,QAAK,OAAO,EAAE,YAAY,IAAI,GAC3B,iBAAM,eAAe,MAAM,eAAe,MAAM,GAAG,CAAC,EAAE,YAAY,GACtE,IACA,oBAAC,cAAW,MAAM,MAAM,MAAM,GAClC;AAAA,KACF;AAEJ;","names":[]}

package/dist/esm/components-core/button.js

@@ -97,7 +97,7 @@ var StyledButton = styled.button`
   font-family: ${FONT_FAMILY};
   font-size: ${FONT_SIZES.md};
   opacity: ${(props) => props.disabled ? 0.5 : 1};
-  transition: background-color 0.2s;
+  transition: background-color 0.05s;
   cursor: pointer;
   position: relative;
   &:disabled {

package/dist/esm/components-core/button.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components-core/button.tsx"],"sourcesContent":["'use client';\n\nimport React, { useMemo } from \"react\";\nimport { useDesign } from \"../providers/design-provider\";\nimport Color from 'color';\nimport styled from 'styled-components';\nimport { BORDER_RADIUS, FONT_FAMILY, FONT_SIZES } from \"../utils/constants\";\nimport LoadingIndicator from \"./loading-indicator\";\n\nfunction getColors({\n  propsColor, \n  colors, \n  variant, \n}: {\n  propsColor?: string, \n  colors: { primaryColor: string, secondaryColor: string, backgroundColor: string },\n  variant: 'primary' | 'secondary' | 'warning',\n}): { \n  bgColor: string, \n  hoverBgColor: string,\n  activeBgColor: string,\n  textColor: string,\n} {\n  let bgColor;\n  switch (variant) {\n    case 'primary': {\n      bgColor = colors.primaryColor;\n      break;\n    }\n    case 'secondary': {\n      bgColor = colors.secondaryColor;\n      break;\n    }\n    case 'warning': {\n      bgColor = '#ff4500';\n      break;\n    }\n  }\n  if (propsColor) {\n    bgColor = propsColor;\n  }\n\n  const c = Color(bgColor);\n  const pc = Color(colors.primaryColor);\n\n  const changeColor = (value: number) => {\n    return c.hsl(c.hue(), c.saturationl(), c.lightness() + value).toString();\n  };\n  \n  const getAlpha = (alpha: number) => {\n    return Color(\n      pc.isDark() ? 'white' : 'black'\n    ).alpha(alpha).toString();\n  };\n\n  if (c.alpha() === 0) {\n    return {\n      bgColor: 'transparent',\n      hoverBgColor: getAlpha(0.1),\n      activeBgColor: getAlpha(0.2),\n      textColor: colors.primaryColor,\n    };\n  } else if (c.isLight()) {\n    return {\n      bgColor,\n      hoverBgColor: changeColor(-10),\n      activeBgColor: changeColor(-20),\n      textColor: 'black',\n    };\n  } else {\n    return {\n      bgColor,\n      hoverBgColor: changeColor(10),\n      activeBgColor: changeColor(20),\n      textColor: 'white',\n    };\n  }\n}\n\nexport type ButtonProps = {\n  variant?: 'primary' | 'secondary' | 'warning',\n  color?: string,\n  size?: 'sm' | 'md' | 'lg',\n  loading?: boolean,\n  onClick?: (() => void) | (() => Promise<void>),\n} & Omit<React.HTMLProps<HTMLButtonElement>, 'size' | 'type' | 'onClick'>\n\ntype ButtonColors = {\n  bgColor: string, \n  hoverBgColor: string,\n  activeBgColor: string,\n  textColor: string,\n}\n\nconst StyledButton = styled.button<{\n  $size: 'sm' | 'md' | 'lg',\n  $loading: boolean,\n  $colors: {\n    dark: ButtonColors,\n    light: ButtonColors,\n  },\n}>`\n  border: 0;\n  border-radius: ${BORDER_RADIUS};\n  padding: ${props => {\n    switch (props.$size) {\n      case 'sm': { return '0rem 0.75rem'; }\n      case 'md': { return '0rem 1rem'; }\n      case 'lg': { return '0rem 2rem'; }\n    }\n  }};\n  height: ${props => {\n    switch (props.$size) {\n      case 'sm': { return '2rem'; }\n      case 'md': { return '2.5rem'; }\n      case 'lg': { return '3rem'; }\n    }\n  }};\n  font-family: ${FONT_FAMILY};\n  font-size: ${FONT_SIZES.md};\n  opacity: ${props => props.disabled ? 0.5 : 1};\n  transition: background-color 0.2s;\n  cursor: pointer;\n  position: relative;\n  &:disabled {\n    cursor: auto;\n    opacity: 0.5;\n  }\n\n  background-color: ${props => props.$colors.light.bgColor};\n  color: ${props => props.$colors.light.textColor};\n  &:not([disabled]) {\n    &:active,&:hover:active {\n      background-color: ${props => props.$colors.light.activeBgColor};\n    }\n    &:hover {\n      background-color: ${props => props.$colors.light.hoverBgColor};\n    }\n  }\n\n  html[data-stack-theme='dark'] & {\n    background-color: ${props => props.$colors.dark.bgColor};\n    color: ${props => props.$colors.dark.textColor};\n    &:not([disabled]) {\n      &:active,&:hover:active {\n        background-color: ${props => props.$colors.dark.activeBgColor};\n      }\n      &:hover {\n        background-color: ${props => props.$colors.dark.hoverBgColor};\n      }\n    }\n  }\n`;\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n  ({\n    variant='primary',\n    size='md',\n    loading=false,\n    ...props\n  }, ref) => {\n    const { colors } = useDesign();\n\n    const { dark, light } = useMemo(() => {\n      return {\n        dark: getColors({ propsColor: props.color, colors: colors.dark, variant }),\n        light: getColors({ propsColor: props.color, colors: colors.light, variant }),\n      };\n    }, [props.color, colors, variant]);\n\n    return (\n      <StyledButton\n        ref={ref}\n        $size={size}\n        $loading={loading}\n        $colors={{ dark, light }}\n        {...props}\n      >\n        <span style={{ position: 'absolute', top: '50%', left: '50%', transform: 'translate(-50%, -50%)', visibility: loading ? 'visible' : 'hidden' }}>\n          <LoadingIndicator color={{ light: light.textColor, dark: dark.textColor }}/>\n        </span>\n        <span style={{ visibility: loading ? 'hidden' : 'visible', whiteSpace: 'nowrap' }}>\n          {props.children}\n        </span>\n      </StyledButton>\n    );\n  }\n);\n\nButton.displayName = 'Button';\n\nexport {\n  Button,\n};\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../src/components-core/button.tsx"],"sourcesContent":["'use client';\n\nimport React, { useMemo } from \"react\";\nimport { useDesign } from \"../providers/design-provider\";\nimport Color from 'color';\nimport styled from 'styled-components';\nimport { BORDER_RADIUS, FONT_FAMILY, FONT_SIZES } from \"../utils/constants\";\nimport LoadingIndicator from \"./loading-indicator\";\n\nfunction getColors({\n  propsColor, \n  colors, \n  variant, \n}: {\n  propsColor?: string, \n  colors: { primaryColor: string, secondaryColor: string, backgroundColor: string },\n  variant: 'primary' | 'secondary' | 'warning',\n}): { \n  bgColor: string, \n  hoverBgColor: string,\n  activeBgColor: string,\n  textColor: string,\n} {\n  let bgColor;\n  switch (variant) {\n    case 'primary': {\n      bgColor = colors.primaryColor;\n      break;\n    }\n    case 'secondary': {\n      bgColor = colors.secondaryColor;\n      break;\n    }\n    case 'warning': {\n      bgColor = '#ff4500';\n      break;\n    }\n  }\n  if (propsColor) {\n    bgColor = propsColor;\n  }\n\n  const c = Color(bgColor);\n  const pc = Color(colors.primaryColor);\n\n  const changeColor = (value: number) => {\n    return c.hsl(c.hue(), c.saturationl(), c.lightness() + value).toString();\n  };\n  \n  const getAlpha = (alpha: number) => {\n    return Color(\n      pc.isDark() ? 'white' : 'black'\n    ).alpha(alpha).toString();\n  };\n\n  if (c.alpha() === 0) {\n    return {\n      bgColor: 'transparent',\n      hoverBgColor: getAlpha(0.1),\n      activeBgColor: getAlpha(0.2),\n      textColor: colors.primaryColor,\n    };\n  } else if (c.isLight()) {\n    return {\n      bgColor,\n      hoverBgColor: changeColor(-10),\n      activeBgColor: changeColor(-20),\n      textColor: 'black',\n    };\n  } else {\n    return {\n      bgColor,\n      hoverBgColor: changeColor(10),\n      activeBgColor: changeColor(20),\n      textColor: 'white',\n    };\n  }\n}\n\nexport type ButtonProps = {\n  variant?: 'primary' | 'secondary' | 'warning',\n  color?: string,\n  size?: 'sm' | 'md' | 'lg',\n  loading?: boolean,\n  onClick?: (() => void) | (() => Promise<void>),\n} & Omit<React.HTMLProps<HTMLButtonElement>, 'size' | 'type' | 'onClick'>\n\ntype ButtonColors = {\n  bgColor: string, \n  hoverBgColor: string,\n  activeBgColor: string,\n  textColor: string,\n}\n\nconst StyledButton = styled.button<{\n  $size: 'sm' | 'md' | 'lg',\n  $loading: boolean,\n  $colors: {\n    dark: ButtonColors,\n    light: ButtonColors,\n  },\n}>`\n  border: 0;\n  border-radius: ${BORDER_RADIUS};\n  padding: ${props => {\n    switch (props.$size) {\n      case 'sm': { return '0rem 0.75rem'; }\n      case 'md': { return '0rem 1rem'; }\n      case 'lg': { return '0rem 2rem'; }\n    }\n  }};\n  height: ${props => {\n    switch (props.$size) {\n      case 'sm': { return '2rem'; }\n      case 'md': { return '2.5rem'; }\n      case 'lg': { return '3rem'; }\n    }\n  }};\n  font-family: ${FONT_FAMILY};\n  font-size: ${FONT_SIZES.md};\n  opacity: ${props => props.disabled ? 0.5 : 1};\n  transition: background-color 0.05s;\n  cursor: pointer;\n  position: relative;\n  &:disabled {\n    cursor: auto;\n    opacity: 0.5;\n  }\n\n  background-color: ${props => props.$colors.light.bgColor};\n  color: ${props => props.$colors.light.textColor};\n  &:not([disabled]) {\n    &:active,&:hover:active {\n      background-color: ${props => props.$colors.light.activeBgColor};\n    }\n    &:hover {\n      background-color: ${props => props.$colors.light.hoverBgColor};\n    }\n  }\n\n  html[data-stack-theme='dark'] & {\n    background-color: ${props => props.$colors.dark.bgColor};\n    color: ${props => props.$colors.dark.textColor};\n    &:not([disabled]) {\n      &:active,&:hover:active {\n        background-color: ${props => props.$colors.dark.activeBgColor};\n      }\n      &:hover {\n        background-color: ${props => props.$colors.dark.hoverBgColor};\n      }\n    }\n  }\n`;\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n  ({\n    variant='primary',\n    size='md',\n    loading=false,\n    ...props\n  }, ref) => {\n    const { colors } = useDesign();\n\n    const { dark, light } = useMemo(() => {\n      return {\n        dark: getColors({ propsColor: props.color, colors: colors.dark, variant }),\n        light: getColors({ propsColor: props.color, colors: colors.light, variant }),\n      };\n    }, [props.color, colors, variant]);\n\n    return (\n      <StyledButton\n        ref={ref}\n        $size={size}\n        $loading={loading}\n        $colors={{ dark, light }}\n        {...props}\n      >\n        <span style={{ position: 'absolute', top: '50%', left: '50%', transform: 'translate(-50%, -50%)', visibility: loading ? 'visible' : 'hidden' }}>\n          <LoadingIndicator color={{ light: light.textColor, dark: dark.textColor }}/>\n        </span>\n        <span style={{ visibility: loading ? 'hidden' : 'visible', whiteSpace: 'nowrap' }}>\n          {props.children}\n        </span>\n      </StyledButton>\n    );\n  }\n);\n\nButton.displayName = 'Button';\n\nexport {\n  Button,\n};\n"],"mappings":"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","names":[]}

package/dist/esm/lib/stack-app.js

@@ -16,6 +16,7 @@ import { filterUndefined, omit } from "@stackframe/stack-shared/dist/utils/objec
 import { neverResolve, resolved, runAsynchronously, wait } from "@stackframe/stack-shared/dist/utils/promises";
 import { AsyncCache } from "@stackframe/stack-shared/dist/utils/caches";
 import { suspend } from "@stackframe/stack-shared/dist/utils/react";
+var clientVersion = "js @stackframe/stack@2.4.6";
 function permissionDefinitionScopeToType(scope) {
   return { "any-team": "team", "specific-team": "team", "global": "global" }[scope.type];
 }
@@ -195,6 +196,7 @@ var _StackClientAppImpl = class __StackClientAppImpl {
       this._interface = new StackClientInterface({
         baseUrl: options.baseUrl ?? getDefaultBaseUrl(),
         projectId: options.projectId ?? getDefaultProjectId(),
+        clientVersion,
         publishableClientKey: options.publishableClientKey ?? getDefaultPublishableClientKey()
       });
     }
@@ -308,8 +310,7 @@ var _StackClientAppImpl = class __StackClientAppImpl {
         return permissions.find((p) => p.id === permissionId) ?? null;
       },
       async hasPermission(scope, permissionId) {
-        const permissions = await this.listPermissions(scope);
-        return permissions.some((p) => p.id === permissionId);
+        return await this.getPermission(scope, permissionId) !== null;
       },
       toJson() {
         return json;
@@ -368,22 +369,6 @@ var _StackClientAppImpl = class __StackClientAppImpl {
       return currentUser;
     }
   }
-  _userToJson(user) {
-    return {
-      projectId: user.projectId,
-      id: user.id,
-      displayName: user.displayName,
-      primaryEmail: user.primaryEmail,
-      primaryEmailVerified: user.primaryEmailVerified,
-      profileImageUrl: user.profileImageUrl,
-      signedUpAtMillis: user.signedUpAt.getTime(),
-      clientMetadata: user.clientMetadata,
-      authMethod: user.authMethod,
-      hasPassword: user.hasPassword,
-      authWithEmail: user.authWithEmail,
-      oauthProviders: user.oauthProviders
-    };
-  }
   _projectAdminFromJson(data, adminInterface, onRefresh) {
     if (data.id !== adminInterface.projectId) {
       throw new Error(`The project ID of the provided project JSON (${data.id}) does not match the project ID of the app (${adminInterface.projectId})! This is a Stack bug.`);
@@ -421,6 +406,7 @@ var _StackClientAppImpl = class __StackClientAppImpl {
     return new StackAdminInterface({
       baseUrl: this._interface.options.baseUrl,
       projectId: forProjectId,
+      clientVersion,
       projectOwnerTokens: tokenStore
     });
   }
@@ -755,24 +741,21 @@ var _StackServerAppImpl = class extends _StackClientAppImpl {
     return await this._interface.listTeamMemberPermissions({ teamId, userId, type, direct });
   });
   constructor(options) {
-    if ("interface" in options) {
-      super({
-        interface: options.interface,
-        tokenStore: options.tokenStore,
-        urls: options.urls
-      });
-    } else {
-      super({
-        interface: new StackServerInterface({
-          baseUrl: options.baseUrl ?? getDefaultBaseUrl(),
-          projectId: options.projectId ?? getDefaultProjectId(),
-          publishableClientKey: options.publishableClientKey ?? getDefaultPublishableClientKey(),
-          secretServerKey: options.secretServerKey ?? getDefaultSecretServerKey()
-        }),
-        tokenStore: options.tokenStore,
-        urls: options.urls ?? {}
-      });
-    }
+    super("interface" in options ? {
+      interface: options.interface,
+      tokenStore: options.tokenStore,
+      urls: options.urls
+    } : {
+      interface: new StackServerInterface({
+        baseUrl: options.baseUrl ?? getDefaultBaseUrl(),
+        projectId: options.projectId ?? getDefaultProjectId(),
+        clientVersion,
+        publishableClientKey: options.publishableClientKey ?? getDefaultPublishableClientKey(),
+        secretServerKey: options.secretServerKey ?? getDefaultSecretServerKey()
+      }),
+      tokenStore: options.tokenStore,
+      urls: options.urls ?? {}
+    });
   }
   _serverUserFromJson(json) {
     if (json === null)
@@ -856,7 +839,7 @@ var _StackServerAppImpl = class extends _StackClientAppImpl {
         return permissions.some((p) => p.id === permissionId);
       },
       toJson() {
-        return app._serverUserToJson(this);
+        return json;
       }
     };
   }
@@ -928,23 +911,6 @@ var _StackServerAppImpl = class extends _StackClientAppImpl {
       }
     };
   }
-  _serverUserToJson(user) {
-    return {
-      projectId: user.projectId,
-      id: user.id,
-      displayName: user.displayName,
-      primaryEmail: user.primaryEmail,
-      primaryEmailVerified: user.primaryEmailVerified,
-      profileImageUrl: user.profileImageUrl,
-      signedUpAtMillis: user.signedUpAt.getTime(),
-      clientMetadata: user.clientMetadata,
-      serverMetadata: user.serverMetadata,
-      authMethod: user.authMethod,
-      hasPassword: user.hasPassword,
-      authWithEmail: user.authWithEmail,
-      oauthProviders: user.oauthProviders
-    };
-  }
   _serverTeamFromJson(json) {
     const app = this;
     return {
@@ -1105,6 +1071,7 @@ var _StackAdminAppImpl = class extends _StackServerAppImpl {
       interface: new StackAdminInterface({
         baseUrl: options.baseUrl ?? getDefaultBaseUrl(),
         projectId: options.projectId ?? getDefaultProjectId(),
+        clientVersion,
         ..."projectOwnerTokens" in options ? {
           projectOwnerTokens: options.projectOwnerTokens
         } : {