@replicated/portal-components 0.0.19 → 0.0.21

package/dist/esm/login.js

@@ -60,6 +60,9 @@ var Button = forwardRef(
   }
 );
 Button.displayName = "Button";
+
+// src/utils/constants.ts
+var DEFAULT_PRIMARY_COLOR = "#4f46e5";
 var Login = forwardRef(
   ({
     logo,
@@ -70,6 +73,8 @@ var Login = forwardRef(
     ctaLabel = "Continue with email \u2192",
     initialEmail = "",
     isSubmitting = false,
+    primaryColor,
+    secondaryColor,
     onContinue,
     onVerifyCode,
     redirectPath = "/",
@@ -140,15 +145,18 @@ var Login = forwardRef(
       {
         ref,
         className: [
-          "w-full max-w-xl rounded-3xl border-2 border-gray-900 bg-white p-12 shadow-xl",
+          "w-full max-w-xl rounded-3xl border-2 bg-white p-12 shadow-xl",
           "text-gray-900 transition-shadow",
           className
         ].filter(Boolean).join(" "),
+        style: {
+          borderColor: secondaryColor || "#111827"
+        },
         onSubmit: handleSubmit,
         ...props,
         children: [
           /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-6 text-center", children: [
-            logo ?? /* @__PURE__ */ jsx("div", { className: "flex h-16 w-16 items-center justify-center rounded-2xl bg-gradient-to-br from-blue-500 to-violet-500 text-lg font-semibold leading-tight text-white", children: "EP" }),
+            logo,
             /* @__PURE__ */ jsxs("div", { children: [
               /* @__PURE__ */ jsx("h1", { className: "text-3xl font-bold tracking-tight text-gray-900", children: title }),
               /* @__PURE__ */ jsx("p", { className: "mt-3 text-base text-gray-600", children: description })
@@ -204,7 +212,11 @@ var Login = forwardRef(
               {
                 type: "submit",
                 size: "lg",
-                className: "w-full justify-center rounded-xl bg-indigo-600 text-white hover:bg-indigo-700",
+                className: "w-full justify-center rounded-xl text-white transition-[filter] hover:brightness-90",
+                style: {
+                  backgroundColor: primaryColor || DEFAULT_PRIMARY_COLOR,
+                  borderColor: primaryColor || DEFAULT_PRIMARY_COLOR
+                },
                 disabled,
                 isLoading: disabled,
                 children: ctaLabel
@@ -241,7 +253,11 @@ var Login = forwardRef(
               {
                 type: "button",
                 size: "lg",
-                className: "w-full justify-center rounded-xl bg-indigo-600 text-white hover:bg-indigo-700",
+                className: "w-full justify-center rounded-xl text-white transition-[filter] hover:brightness-90",
+                style: {
+                  backgroundColor: primaryColor || DEFAULT_PRIMARY_COLOR,
+                  borderColor: primaryColor || DEFAULT_PRIMARY_COLOR
+                },
                 disabled: verificationCode.length !== 12 || verifying,
                 isLoading: verifying,
                 onClick: handleVerify,

package/dist/esm/login.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/button.tsx","../../src/components/login.tsx"],"names":["forwardRef","jsxs","jsx"],"mappings":"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","file":"login.js","sourcesContent":["import {\n  forwardRef,\n  type ComponentPropsWithoutRef,\n  type ReactNode\n} from \"react\";\n\nconst buttonVariants = [\"primary\", \"secondary\", \"ghost\", \"destructive\"] as const;\nconst buttonSizes = [\"sm\", \"md\", \"lg\"] as const;\n\nconst variantStyles: Record<ButtonVariant, string> = {\n  primary:\n    \"bg-primary text-primary-foreground hover:bg-primary/90 focus-visible:ring-primary\",\n  secondary:\n    \"bg-secondary/20 text-secondary-foreground hover:bg-secondary/30 focus-visible:ring-secondary\",\n  ghost:\n    \"bg-transparent text-primary hover:bg-primary/10 focus-visible:ring-primary/60\",\n  destructive:\n    \"bg-danger text-white hover:bg-danger/90 focus-visible:ring-danger\"\n};\n\nconst sizeStyles: Record<ButtonSize, string> = {\n  sm: \"h-8 px-3 text-sm\",\n  md: \"h-10 px-4 text-sm\",\n  lg: \"h-12 px-6 text-base\"\n};\n\nconst inlineFlexBase =\n  \"inline-flex items-center justify-center gap-2 rounded-md font-medium tracking-tight transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-60\";\n\nconst Spinner = () => (\n  <span className=\"inline-flex h-3.5 w-3.5 animate-spin items-center justify-center\">\n    <span className=\"h-3 w-3 rounded-full border-2 border-transparent border-t-current\" />\n  </span>\n);\n\nexport type ButtonVariant = (typeof buttonVariants)[number];\nexport type ButtonSize = (typeof buttonSizes)[number];\n\nexport interface ButtonProps extends ComponentPropsWithoutRef<\"button\"> {\n  variant?: ButtonVariant;\n  size?: ButtonSize;\n  isLoading?: boolean;\n  leadingIcon?: ReactNode;\n  trailingIcon?: ReactNode;\n}\n\nconst composeClassName = (\n  ...values: Array<string | undefined | false>\n): string => values.filter(Boolean).join(\" \");\n\n/**\n * Button is the primary interactive primitive for triggering portal actions.\n * It is theme aware via CSS variables generated from portal tokens.\n */\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n  (\n    {\n      variant = \"primary\",\n      size = \"md\",\n      type = \"button\",\n      isLoading = false,\n      leadingIcon,\n      trailingIcon,\n      disabled,\n      className,\n      children,\n      ...props\n    },\n    ref\n  ) => {\n    const computedLeading = isLoading ? <Spinner /> : leadingIcon;\n    const computedDisabled = disabled ?? isLoading;\n\n    return (\n      <button\n        ref={ref}\n        type={type}\n        className={composeClassName(\n          inlineFlexBase,\n          variantStyles[variant],\n          sizeStyles[size],\n          className\n        )}\n        aria-busy={isLoading || undefined}\n        disabled={computedDisabled}\n        {...props}\n      >\n        {computedLeading ? (\n          <span aria-hidden=\"true\" className=\"inline-flex\">\n            {computedLeading}\n          </span>\n        ) : null}\n        <span className=\"flex-1 whitespace-nowrap\">{children}</span>\n        {trailingIcon ? (\n          <span aria-hidden=\"true\" className=\"inline-flex\">\n            {trailingIcon}\n          </span>\n        ) : null}\n      </button>\n    );\n  }\n);\n\nButton.displayName = \"Button\";\n","'use client';\n\nimport {\n  forwardRef,\n  useMemo,\n  useState,\n  type ComponentPropsWithoutRef,\n  type FormEvent,\n  type ReactNode\n} from \"react\";\n\nimport { Button } from \"./button\";\n\nexport interface LoginProps\n  extends Omit<ComponentPropsWithoutRef<\"form\">, \"onSubmit\" | \"children\"> {\n  logo?: ReactNode;\n  title?: string;\n  description?: string;\n  label?: string;\n  placeholder?: string;\n  ctaLabel?: string;\n  initialEmail?: string;\n  isSubmitting?: boolean;\n  /** \n   * Called when user submits email. Return { showVerification: false } to prevent\n   * showing the verification code form (e.g., for SAML redirect).\n   */\n  onContinue?: (email: string) => Promise<void | { showVerification: boolean }> | void | { showVerification: boolean };\n  onVerifyCode?: (\n    code: string,\n    redirectPath: string\n  ) => Promise<\n    | void\n    | { success: true }\n    | { success: false; message?: string }\n  >;\n  redirectPath?: string;\n}\n\n/**\n * Login renders a compact form card tailored for portal authentication flows.\n * The component keeps styling self-contained so it can be dropped into the\n * local Next.js template without additional wrappers.\n */\nexport const Login = forwardRef<HTMLFormElement, LoginProps>(\n  (\n    {\n      logo,\n      title = \"Enterprise Factory Installation Portal\",\n      description = \"Sign in to manage your enterprise installation\",\n      label = \"Work email address\",\n      placeholder = \"you@company.com\",\n      ctaLabel = \"Continue with email →\",\n      initialEmail = \"\",\n      isSubmitting = false,\n      onContinue,\n      onVerifyCode,\n      redirectPath = \"/\",\n      className,\n      ...props\n    },\n    ref\n  ) => {\n    const [mode, setMode] = useState<\"email\" | \"verify\">(\"email\");\n    const [email, setEmail] = useState(initialEmail);\n    const [submittedEmail, setSubmittedEmail] = useState(initialEmail);\n    const [verificationCode, setVerificationCode] = useState(\"\");\n    const [verifying, setVerifying] = useState(false);\n    const [pending, setPending] = useState(false);\n    const [verificationError, setVerificationError] = useState<string | null>(\n      null\n    );\n\n    const handleSubmit = async (event: FormEvent<HTMLFormElement>) => {\n      event.preventDefault();\n      if (!onContinue || mode !== \"email\") {\n        return;\n      }\n\n      try {\n        setPending(true);\n        const result = await onContinue(email);\n        \n        // Check if we should show verification form\n        // If result is { showVerification: false }, don't show it (e.g., SAML redirect)\n        if (result && typeof result === \"object\" && \"showVerification\" in result && result.showVerification === false) {\n          // Don't transition to verify mode - caller is handling redirect\n          return;\n        }\n        \n        // Show verification code form\n        setSubmittedEmail(email);\n        setVerificationCode(\"\");\n        setVerificationError(null);\n        setMode(\"verify\");\n      } finally {\n        setPending(false);\n      }\n    };\n\n    const disabled = mode === \"email\" && (isSubmitting || pending);\n    const verificationMessage = useMemo(() => {\n      if (!submittedEmail) {\n        return null;\n      }\n      return `If there is an account for ${submittedEmail}, an email will be sent with a login code.`;\n    }, [submittedEmail]);\n\n    const handleVerify = async () => {\n      if (!onVerifyCode || !verificationCode) {\n        return;\n      }\n      try {\n        setVerificationError(null);\n        setVerifying(true);\n        const result = await onVerifyCode(verificationCode, redirectPath);\n        if (\n          result &&\n          typeof result === \"object\" &&\n          \"success\" in result &&\n          (result as { success?: unknown }).success === false\n        ) {\n          const message =\n            (result as { message?: string }).message ??\n            \"Unable to verify code. Try again.\";\n          setVerificationError(message);\n          return;\n        }\n        setVerificationCode(\"\");\n      } catch (error) {\n        if (\n          typeof error === \"object\" &&\n          error !== null &&\n          \"message\" in error &&\n          typeof (error as { message?: unknown }).message === \"string\"\n        ) {\n          setVerificationError((error as { message: string }).message);\n        } else {\n          setVerificationError(\"Unable to verify code. Try again.\");\n        }\n      } finally {\n        setVerifying(false);\n      }\n    };\n\n    return (\n      <form\n        ref={ref}\n        className={[\n          \"w-full max-w-xl rounded-3xl border-2 border-gray-900 bg-white p-12 shadow-xl\",\n          \"text-gray-900 transition-shadow\",\n          className\n        ]\n          .filter(Boolean)\n          .join(\" \")}\n        onSubmit={handleSubmit}\n        {...props}\n      >\n        <div className=\"flex flex-col items-center gap-6 text-center\">\n          {logo ?? (\n            <div className=\"flex h-16 w-16 items-center justify-center rounded-2xl bg-gradient-to-br from-blue-500 to-violet-500 text-lg font-semibold leading-tight text-white\">\n              EP\n            </div>\n          )}\n          <div>\n            <h1 className=\"text-3xl font-bold tracking-tight text-gray-900\">\n              {title}\n            </h1>\n            <p className=\"mt-3 text-base text-gray-600\">{description}</p>\n          </div>\n        </div>\n        {mode === \"email\" ? (\n          <div className=\"mt-10 space-y-4\">\n            <label\n              htmlFor=\"login-email\"\n              className=\"block text-sm font-medium text-gray-700\"\n            >\n              {label}\n            </label>\n            <div className=\"relative\">\n              <div className=\"pointer-events-none absolute inset-y-0 left-0 flex items-center pl-4\">\n                <svg\n                  className=\"h-5 w-5 text-gray-400\"\n                  fill=\"none\"\n                  viewBox=\"0 0 24 24\"\n                  stroke=\"currentColor\"\n                >\n                  <path\n                    strokeLinecap=\"round\"\n                    strokeLinejoin=\"round\"\n                    strokeWidth={2}\n                    d=\"M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z\"\n                  />\n                </svg>\n              </div>\n              <input\n                id=\"login-email\"\n                type=\"email\"\n                inputMode=\"email\"\n                autoComplete=\"email\"\n                placeholder={placeholder}\n                value={email}\n                onChange={(event) => setEmail(event.target.value)}\n                className=\"portal-input w-full py-4 pr-4 text-base\"\n                style={{ paddingLeft: '3rem' }}\n                disabled={disabled}\n                required\n              />\n            </div>\n            <Button\n              type=\"submit\"\n              size=\"lg\"\n              className=\"w-full justify-center rounded-xl bg-indigo-600 text-white hover:bg-indigo-700\"\n              disabled={disabled}\n              isLoading={disabled}\n            >\n              {ctaLabel}\n            </Button>\n          </div>\n        ) : (\n          <div className=\"mt-10 space-y-4\">\n            <div>\n              <p className=\"text-sm font-semibold text-gray-900\">\n                Verification Code\n              </p>\n              {verificationMessage ? (\n                <p className=\"mt-2 text-sm text-gray-600\">{verificationMessage}</p>\n              ) : null}\n              {verificationError ? (\n                <p className=\"mt-2 text-sm font-medium text-red-600\">\n                  {verificationError}\n                </p>\n              ) : null}\n            </div>\n            <label\n              htmlFor=\"login-code\"\n              className=\"block text-sm font-medium text-gray-700\"\n            >\n              One-time code\n            </label>\n            <input\n              id=\"login-code\"\n              inputMode=\"numeric\"\n              maxLength={12}\n              placeholder=\"Enter 12 digit code\"\n              className=\"portal-input w-full px-5 py-4 text-base\"\n              value={verificationCode}\n              onChange={(event) => setVerificationCode(event.target.value)}\n            />\n            <Button\n              type=\"button\"\n              size=\"lg\"\n              className=\"w-full justify-center rounded-xl bg-indigo-600 text-white hover:bg-indigo-700\"\n              disabled={verificationCode.length !== 12 || verifying}\n              isLoading={verifying}\n              onClick={handleVerify}\n            >\n              Verify code\n            </Button>\n          </div>\n        )}\n      </form>\n    );\n  }\n);\n\nLogin.displayName = \"Login\";\n"]}
+{"version":3,"sources":["../../src/components/button.tsx","../../src/utils/constants.ts","../../src/components/login.tsx"],"names":["forwardRef","jsxs","jsx"],"mappings":"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","file":"login.js","sourcesContent":["import {\n  forwardRef,\n  type ComponentPropsWithoutRef,\n  type ReactNode\n} from \"react\";\n\nconst buttonVariants = [\"primary\", \"secondary\", \"ghost\", \"destructive\"] as const;\nconst buttonSizes = [\"sm\", \"md\", \"lg\"] as const;\n\nconst variantStyles: Record<ButtonVariant, string> = {\n  primary:\n    \"bg-primary text-primary-foreground hover:bg-primary/90 focus-visible:ring-primary\",\n  secondary:\n    \"bg-secondary/20 text-secondary-foreground hover:bg-secondary/30 focus-visible:ring-secondary\",\n  ghost:\n    \"bg-transparent text-primary hover:bg-primary/10 focus-visible:ring-primary/60\",\n  destructive:\n    \"bg-danger text-white hover:bg-danger/90 focus-visible:ring-danger\"\n};\n\nconst sizeStyles: Record<ButtonSize, string> = {\n  sm: \"h-8 px-3 text-sm\",\n  md: \"h-10 px-4 text-sm\",\n  lg: \"h-12 px-6 text-base\"\n};\n\nconst inlineFlexBase =\n  \"inline-flex items-center justify-center gap-2 rounded-md font-medium tracking-tight transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-60\";\n\nconst Spinner = () => (\n  <span className=\"inline-flex h-3.5 w-3.5 animate-spin items-center justify-center\">\n    <span className=\"h-3 w-3 rounded-full border-2 border-transparent border-t-current\" />\n  </span>\n);\n\nexport type ButtonVariant = (typeof buttonVariants)[number];\nexport type ButtonSize = (typeof buttonSizes)[number];\n\nexport interface ButtonProps extends ComponentPropsWithoutRef<\"button\"> {\n  variant?: ButtonVariant;\n  size?: ButtonSize;\n  isLoading?: boolean;\n  leadingIcon?: ReactNode;\n  trailingIcon?: ReactNode;\n}\n\nconst composeClassName = (\n  ...values: Array<string | undefined | false>\n): string => values.filter(Boolean).join(\" \");\n\n/**\n * Button is the primary interactive primitive for triggering portal actions.\n * It is theme aware via CSS variables generated from portal tokens.\n */\nexport const Button = forwardRef<HTMLButtonElement, ButtonProps>(\n  (\n    {\n      variant = \"primary\",\n      size = \"md\",\n      type = \"button\",\n      isLoading = false,\n      leadingIcon,\n      trailingIcon,\n      disabled,\n      className,\n      children,\n      ...props\n    },\n    ref\n  ) => {\n    const computedLeading = isLoading ? <Spinner /> : leadingIcon;\n    const computedDisabled = disabled ?? isLoading;\n\n    return (\n      <button\n        ref={ref}\n        type={type}\n        className={composeClassName(\n          inlineFlexBase,\n          variantStyles[variant],\n          sizeStyles[size],\n          className\n        )}\n        aria-busy={isLoading || undefined}\n        disabled={computedDisabled}\n        {...props}\n      >\n        {computedLeading ? (\n          <span aria-hidden=\"true\" className=\"inline-flex\">\n            {computedLeading}\n          </span>\n        ) : null}\n        <span className=\"flex-1 whitespace-nowrap\">{children}</span>\n        {trailingIcon ? (\n          <span aria-hidden=\"true\" className=\"inline-flex\">\n            {trailingIcon}\n          </span>\n        ) : null}\n      </button>\n    );\n  }\n);\n\nButton.displayName = \"Button\";\n","/**\n * Default globe favicon matching the CiGlobe icon (Circum Icons)\n * Used as fallback when custom branding doesn't provide a favicon\n */\nexport const DEFAULT_FAVICON = \"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239ca3af' stroke-width='1.5'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cellipse cx='12' cy='12' rx='4' ry='10'/%3E%3Cpath d='M2 12h20'/%3E%3C/svg%3E\";\n\n/**\n * Default primary brand color\n */\nexport const DEFAULT_PRIMARY_COLOR = \"#4f46e5\";\n\n/**\n * Default secondary brand color\n */\nexport const DEFAULT_SECONDARY_COLOR = \"#6366f1\";\n\n/**\n * Check if the API origin is HTTP (used for repldev environments)\n * This determines cookie security settings for cross-origin iframes\n * @returns true if the API origin starts with http:// (not https://)\n */\nexport const isHttpApiOrigin = (): boolean => {\n  return process.env.REPLICATED_APP_ORIGIN?.startsWith('http://') || false;\n};\n","'use client';\n\nimport {\n  forwardRef,\n  useMemo,\n  useState,\n  type ComponentPropsWithoutRef,\n  type FormEvent,\n  type ReactNode\n} from \"react\";\n\nimport { Button } from \"./button\";\nimport { DEFAULT_PRIMARY_COLOR } from \"../utils/constants\";\n\nexport interface LoginProps\n  extends Omit<ComponentPropsWithoutRef<\"form\">, \"onSubmit\" | \"children\"> {\n  logo?: ReactNode;\n  title?: string;\n  description?: string;\n  label?: string;\n  placeholder?: string;\n  ctaLabel?: string;\n  initialEmail?: string;\n  isSubmitting?: boolean;\n  /** Primary color for buttons */\n  primaryColor?: string;\n  /** Secondary color for borders/accents */\n  secondaryColor?: string;\n  /** \n   * Called when user submits email. Return { showVerification: false } to prevent\n   * showing the verification code form (e.g., for SAML redirect).\n   */\n  onContinue?: (email: string) => Promise<void | { showVerification: boolean }> | void | { showVerification: boolean };\n  onVerifyCode?: (\n    code: string,\n    redirectPath: string\n  ) => Promise<\n    | void\n    | { success: true }\n    | { success: false; message?: string }\n  >;\n  redirectPath?: string;\n}\n\n/**\n * Login renders a compact form card tailored for portal authentication flows.\n * The component keeps styling self-contained so it can be dropped into the\n * local Next.js template without additional wrappers.\n */\nexport const Login = forwardRef<HTMLFormElement, LoginProps>(\n  (\n    {\n      logo,\n      title = \"Enterprise Factory Installation Portal\",\n      description = \"Sign in to manage your enterprise installation\",\n      label = \"Work email address\",\n      placeholder = \"you@company.com\",\n      ctaLabel = \"Continue with email →\",\n      initialEmail = \"\",\n      isSubmitting = false,\n      primaryColor,\n      secondaryColor,\n      onContinue,\n      onVerifyCode,\n      redirectPath = \"/\",\n      className,\n      ...props\n    },\n    ref\n  ) => {\n    const [mode, setMode] = useState<\"email\" | \"verify\">(\"email\");\n    const [email, setEmail] = useState(initialEmail);\n    const [submittedEmail, setSubmittedEmail] = useState(initialEmail);\n    const [verificationCode, setVerificationCode] = useState(\"\");\n    const [verifying, setVerifying] = useState(false);\n    const [pending, setPending] = useState(false);\n    const [verificationError, setVerificationError] = useState<string | null>(\n      null\n    );\n\n    const handleSubmit = async (event: FormEvent<HTMLFormElement>) => {\n      event.preventDefault();\n      if (!onContinue || mode !== \"email\") {\n        return;\n      }\n\n      try {\n        setPending(true);\n        const result = await onContinue(email);\n        \n        // Check if we should show verification form\n        // If result is { showVerification: false }, don't show it (e.g., SAML redirect)\n        if (result && typeof result === \"object\" && \"showVerification\" in result && result.showVerification === false) {\n          // Don't transition to verify mode - caller is handling redirect\n          return;\n        }\n        \n        // Show verification code form\n        setSubmittedEmail(email);\n        setVerificationCode(\"\");\n        setVerificationError(null);\n        setMode(\"verify\");\n      } finally {\n        setPending(false);\n      }\n    };\n\n    const disabled = mode === \"email\" && (isSubmitting || pending);\n    const verificationMessage = useMemo(() => {\n      if (!submittedEmail) {\n        return null;\n      }\n      return `If there is an account for ${submittedEmail}, an email will be sent with a login code.`;\n    }, [submittedEmail]);\n\n    const handleVerify = async () => {\n      if (!onVerifyCode || !verificationCode) {\n        return;\n      }\n      try {\n        setVerificationError(null);\n        setVerifying(true);\n        const result = await onVerifyCode(verificationCode, redirectPath);\n        if (\n          result &&\n          typeof result === \"object\" &&\n          \"success\" in result &&\n          (result as { success?: unknown }).success === false\n        ) {\n          const message =\n            (result as { message?: string }).message ??\n            \"Unable to verify code. Try again.\";\n          setVerificationError(message);\n          return;\n        }\n        setVerificationCode(\"\");\n      } catch (error) {\n        if (\n          typeof error === \"object\" &&\n          error !== null &&\n          \"message\" in error &&\n          typeof (error as { message?: unknown }).message === \"string\"\n        ) {\n          setVerificationError((error as { message: string }).message);\n        } else {\n          setVerificationError(\"Unable to verify code. Try again.\");\n        }\n      } finally {\n        setVerifying(false);\n      }\n    };\n\n    return (\n      <form\n        ref={ref}\n        className={[\n          \"w-full max-w-xl rounded-3xl border-2 bg-white p-12 shadow-xl\",\n          \"text-gray-900 transition-shadow\",\n          className\n        ]\n          .filter(Boolean)\n          .join(\" \")}\n        style={{\n          borderColor: secondaryColor || '#111827',\n        }}\n        onSubmit={handleSubmit}\n        {...props}\n      >\n        <div className=\"flex flex-col items-center gap-6 text-center\">\n          {logo}\n          <div>\n            <h1 className=\"text-3xl font-bold tracking-tight text-gray-900\">\n              {title}\n            </h1>\n            <p className=\"mt-3 text-base text-gray-600\">{description}</p>\n          </div>\n        </div>\n        {mode === \"email\" ? (\n          <div className=\"mt-10 space-y-4\">\n            <label\n              htmlFor=\"login-email\"\n              className=\"block text-sm font-medium text-gray-700\"\n            >\n              {label}\n            </label>\n            <div className=\"relative\">\n              <div className=\"pointer-events-none absolute inset-y-0 left-0 flex items-center pl-4\">\n                <svg\n                  className=\"h-5 w-5 text-gray-400\"\n                  fill=\"none\"\n                  viewBox=\"0 0 24 24\"\n                  stroke=\"currentColor\"\n                >\n                  <path\n                    strokeLinecap=\"round\"\n                    strokeLinejoin=\"round\"\n                    strokeWidth={2}\n                    d=\"M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z\"\n                  />\n                </svg>\n              </div>\n              <input\n                id=\"login-email\"\n                type=\"email\"\n                inputMode=\"email\"\n                autoComplete=\"email\"\n                placeholder={placeholder}\n                value={email}\n                onChange={(event) => setEmail(event.target.value)}\n                className=\"portal-input w-full py-4 pr-4 text-base\"\n                style={{ paddingLeft: '3rem' }}\n                disabled={disabled}\n                required\n              />\n            </div>\n            <Button\n              type=\"submit\"\n              size=\"lg\"\n              className=\"w-full justify-center rounded-xl text-white transition-[filter] hover:brightness-90\"\n              style={{\n                backgroundColor: primaryColor || DEFAULT_PRIMARY_COLOR,\n                borderColor: primaryColor || DEFAULT_PRIMARY_COLOR,\n              }}\n              disabled={disabled}\n              isLoading={disabled}\n            >\n              {ctaLabel}\n            </Button>\n          </div>\n        ) : (\n          <div className=\"mt-10 space-y-4\">\n            <div>\n              <p className=\"text-sm font-semibold text-gray-900\">\n                Verification Code\n              </p>\n              {verificationMessage ? (\n                <p className=\"mt-2 text-sm text-gray-600\">{verificationMessage}</p>\n              ) : null}\n              {verificationError ? (\n                <p className=\"mt-2 text-sm font-medium text-red-600\">\n                  {verificationError}\n                </p>\n              ) : null}\n            </div>\n            <label\n              htmlFor=\"login-code\"\n              className=\"block text-sm font-medium text-gray-700\"\n            >\n              One-time code\n            </label>\n            <input\n              id=\"login-code\"\n              inputMode=\"numeric\"\n              maxLength={12}\n              placeholder=\"Enter 12 digit code\"\n              className=\"portal-input w-full px-5 py-4 text-base\"\n              value={verificationCode}\n              onChange={(event) => setVerificationCode(event.target.value)}\n            />\n            <Button\n              type=\"button\"\n              size=\"lg\"\n              className=\"w-full justify-center rounded-xl text-white transition-[filter] hover:brightness-90\"\n              style={{\n                backgroundColor: primaryColor || DEFAULT_PRIMARY_COLOR,\n                borderColor: primaryColor || DEFAULT_PRIMARY_COLOR,\n              }}\n              disabled={verificationCode.length !== 12 || verifying}\n              isLoading={verifying}\n              onClick={handleVerify}\n            >\n              Verify code\n            </Button>\n          </div>\n        )}\n      </form>\n    );\n  }\n);\n\nLogin.displayName = \"Login\";\n"]}

package/dist/esm/middleware.js

@@ -0,0 +1,33 @@
+import { NextResponse } from 'next/server';
+
+/**
+ * Enterprise Portal Components
+ * This file is generated by tsup. Do not edit manually.
+ */
+
+function portalMiddleware(request) {
+  const url = request.nextUrl;
+  const pathname = url.pathname;
+  if (pathname === "/" && url.searchParams.get("expired") === "1") {
+    const basePath = process.env.NEXT_PUBLIC_BASE_PATH;
+    const redirectUrl = new URL(basePath || "/", request.url);
+    const response = NextResponse.redirect(redirectUrl);
+    response.cookies.delete("portal_session");
+    return response;
+  }
+  const appSlug = process.env.PORTAL_APP_SLUG;
+  if (appSlug && (pathname === `/${appSlug}` || pathname.startsWith(`/${appSlug}/`))) {
+    const basePath = process.env.NEXT_PUBLIC_BASE_PATH;
+    const newPathname = pathname.slice(appSlug.length + 1) || "/";
+    const fullPath = basePath ? `${basePath}${newPathname}` : newPathname;
+    const normalizedPath = fullPath.length > 1 ? fullPath.replace(/\/$/, "") : fullPath;
+    const newUrl = new URL(normalizedPath, request.url);
+    newUrl.search = url.search;
+    return NextResponse.redirect(newUrl);
+  }
+  return NextResponse.next();
+}
+
+export { portalMiddleware };
+//# sourceMappingURL=middleware.js.map
+//# sourceMappingURL=middleware.js.map

package/dist/esm/middleware.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/middleware.ts"],"names":[],"mappings":";;;;;;;AAWO,SAAS,iBAAiB,OAAA,EAAsB;AACrD,EAAA,MAAM,MAAM,OAAA,CAAQ,OAAA;AACpB,EAAA,MAAM,WAAW,GAAA,CAAI,QAAA;AAGrB,EAAA,IAAI,aAAa,GAAA,IAAO,GAAA,CAAI,aAAa,GAAA,CAAI,SAAS,MAAM,GAAA,EAAK;AAE/D,IAAA,MAAM,QAAA,GAAW,QAAQ,GAAA,CAAI,qBAAA;AAC7B,IAAA,MAAM,cAAc,IAAI,GAAA,CAAI,QAAA,IAAY,GAAA,EAAK,QAAQ,GAAG,CAAA;AACxD,IAAA,MAAM,QAAA,GAAW,YAAA,CAAa,QAAA,CAAS,WAAW,CAAA;AAGlD,IAAA,QAAA,CAAS,OAAA,CAAQ,OAAO,gBAAgB,CAAA;AAExC,IAAA,OAAO,QAAA;AAAA,EACT;AAIA,EAAA,MAAM,OAAA,GAAU,QAAQ,GAAA,CAAI,eAAA;AAC5B,EAAA,IAAI,OAAA,KAAY,QAAA,KAAa,CAAA,CAAA,EAAI,OAAO,CAAA,CAAA,IAAM,SAAS,UAAA,CAAW,CAAA,CAAA,EAAI,OAAO,CAAA,CAAA,CAAG,CAAA,CAAA,EAAI;AAElF,IAAA,MAAM,QAAA,GAAW,QAAQ,GAAA,CAAI,qBAAA;AAC7B,IAAA,MAAM,cAAc,QAAA,CAAS,KAAA,CAAM,OAAA,CAAQ,MAAA,GAAS,CAAC,CAAA,IAAK,GAAA;AAC1D,IAAA,MAAM,WAAW,QAAA,GAAW,CAAA,EAAG,QAAQ,CAAA,EAAG,WAAW,CAAA,CAAA,GAAK,WAAA;AAE1D,IAAA,MAAM,cAAA,GAAiB,SAAS,MAAA,GAAS,CAAA,GAAI,SAAS,OAAA,CAAQ,KAAA,EAAO,EAAE,CAAA,GAAI,QAAA;AAC3E,IAAA,MAAM,MAAA,GAAS,IAAI,GAAA,CAAI,cAAA,EAAgB,QAAQ,GAAG,CAAA;AAClD,IAAA,MAAA,CAAO,SAAS,GAAA,CAAI,MAAA;AACpB,IAAA,OAAO,YAAA,CAAa,SAAS,MAAM,CAAA;AAAA,EACrC;AAEA,EAAA,OAAO,aAAa,IAAA,EAAK;AAC3B","file":"middleware.js","sourcesContent":["import { NextResponse } from \"next/server\";\nimport type { NextRequest } from \"next/server\";\n\n/**\n * Shared middleware for enterprise portal applications.\n * \n * Handles:\n * - Expired session redirects (deletes cookie and redirects to root)\n * - App slug prefix redirects (/{appSlug}/path → /path)\n * - Respects NEXT_PUBLIC_BASE_PATH for reverse proxy scenarios\n */\nexport function portalMiddleware(request: NextRequest) {\n  const url = request.nextUrl;\n  const pathname = url.pathname;\n\n  // Check if this is a logout/expired session redirect\n  if (pathname === \"/\" && url.searchParams.get(\"expired\") === \"1\") {\n    // Redirect to the app's root (respecting basePath for proxied scenarios)\n    const basePath = process.env.NEXT_PUBLIC_BASE_PATH;\n    const redirectUrl = new URL(basePath || \"/\", request.url);\n    const response = NextResponse.redirect(redirectUrl);\n    \n    // Delete the expired session cookie\n    response.cookies.delete(\"portal_session\");\n    \n    return response;\n  }\n\n  // Handle app slug prefix: /{appSlug}/... → /...\n  // Redirect to remove the app slug prefix from the URL (respecting basePath for proxied scenarios)\n  const appSlug = process.env.PORTAL_APP_SLUG;\n  if (appSlug && (pathname === `/${appSlug}` || pathname.startsWith(`/${appSlug}/`))) {\n    // Redirect /{appSlug} → /, /{appSlug}/invite → /invite, etc.\n    const basePath = process.env.NEXT_PUBLIC_BASE_PATH;\n    const newPathname = pathname.slice(appSlug.length + 1) || \"/\";\n    const fullPath = basePath ? `${basePath}${newPathname}` : newPathname;\n    // Remove trailing slash unless it's the root path\n    const normalizedPath = fullPath.length > 1 ? fullPath.replace(/\\/$/, '') : fullPath;\n    const newUrl = new URL(normalizedPath, request.url);\n    newUrl.search = url.search;\n    return NextResponse.redirect(newUrl);\n  }\n\n  return NextResponse.next();\n}\n\n/**\n * Note: The middleware config matcher cannot be exported from this module.\n * Next.js requires it to be defined as a static object literal in each\n * template's middleware.ts file for build-time analysis.\n * \n * Recommended config for templates:\n * \n * export const config = {\n *   matcher: [\n *     \"/((?!api|_next/static|_next/image|favicon.ico).*)\",\n *   ],\n * };\n */\n"]}

package/dist/esm/online-instance-list.js

@@ -1,96 +1,38 @@
 "use client";
 import { useState } from 'react';
 import Link from 'next/link';
+import cx from 'classnames';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
 /**
  * Enterprise Portal Components
  * This file is generated by tsup. Do not edit manually.
  */
-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 __commonJS = (cb, mod) => function __require() {
-  return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  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.
-  !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
 
-// node_modules/classnames/index.js
-var require_classnames = __commonJS({
-  "node_modules/classnames/index.js"(exports$1, module) {
-    (function() {
-      var hasOwn = {}.hasOwnProperty;
-      function classNames() {
-        var classes = "";
-        for (var i = 0; i < arguments.length; i++) {
-          var arg = arguments[i];
-          if (arg) {
-            classes = appendClass(classes, parseValue(arg));
-          }
-        }
-        return classes;
-      }
-      function parseValue(arg) {
-        if (typeof arg === "string" || typeof arg === "number") {
-          return arg;
-        }
-        if (typeof arg !== "object") {
-          return "";
-        }
-        if (Array.isArray(arg)) {
-          return classNames.apply(null, arg);
-        }
-        if (arg.toString !== Object.prototype.toString && !arg.toString.toString().includes("[native code]")) {
-          return arg.toString();
-        }
-        var classes = "";
-        for (var key in arg) {
-          if (hasOwn.call(arg, key) && arg[key]) {
-            classes = appendClass(classes, key);
-          }
-        }
-        return classes;
-      }
-      function appendClass(value, newClass) {
-        if (!newClass) {
-          return value;
-        }
-        if (value) {
-          return value + " " + newClass;
-        }
-        return value + newClass;
-      }
-      if (typeof module !== "undefined" && module.exports) {
-        classNames.default = classNames;
-        module.exports = classNames;
-      } else if (typeof define === "function" && typeof define.amd === "object" && define.amd) {
-        define("classnames", [], function() {
-          return classNames;
-        });
-      } else {
-        window.classNames = classNames;
-      }
-    })();
+
+// src/utils/constants.ts
+var DEFAULT_SECONDARY_COLOR = "#6366f1";
+
+// src/utils/format.ts
+function formatDateTimeLocal(dateString) {
+  if (!dateString) return "N/A";
+  try {
+    const date = new Date(dateString);
+    if (isNaN(date.getTime())) {
+      return dateString;
+    }
+    return date.toLocaleDateString("en-US", {
+      month: "numeric",
+      day: "numeric",
+      year: "numeric",
+      hour: "numeric",
+      minute: "2-digit",
+      hour12: true
+    });
+  } catch {
+    return "N/A";
   }
-});
+}
 
 // src/actions/instances.ts
 var ACTIVE_INSTANCE_THRESHOLD_MS = 24 * 60 * 60 * 1e3;
@@ -150,9 +92,6 @@ function getInstanceName(instance) {
   const nameTag = instance.tags?.find((tag) => tag.key === "name");
   return nameTag?.value || instance.id.slice(0, 7);
 }
-
-// src/components/app-status-badge.tsx
-var import_classnames = __toESM(require_classnames());
 var toTitle = (value) => {
   const s = value.trim();
   if (!s) return s;
@@ -276,7 +215,7 @@ function AppStatusBadge({
   return /* @__PURE__ */ jsxs(
     "span",
     {
-      className: (0, import_classnames.default)(
+      className: cx(
         "inline-flex items-center gap-1 rounded-full px-2 py-0.5 text-xs font-medium",
         getClassNameForType(type),
         className
@@ -288,18 +227,6 @@ function AppStatusBadge({
     }
   );
 }
-function formatDateTime(dateString) {
-  if (!dateString) return "N/A";
-  const date = new Date(dateString);
-  return date.toLocaleDateString("en-US", {
-    month: "numeric",
-    day: "numeric",
-    year: "numeric",
-    hour: "numeric",
-    minute: "2-digit",
-    hour12: true
-  });
-}
 function UpdateBadge({ count }) {
   if (count <= 0) return null;
   return /* @__PURE__ */ jsx("span", { className: "ml-1.5 inline-flex h-5 w-5 items-center justify-center rounded-full bg-rose-500 text-xs font-medium text-white", children: count });
@@ -337,7 +264,7 @@ function InstanceCard({
   channelReleases = [],
   installOptions = [],
   onUpdateClick,
-  primaryColor = "#6366f1",
+  primaryColor = DEFAULT_SECONDARY_COLOR,
   securityData = {},
   securityDiffData = {},
   securityEnabled = false
@@ -437,18 +364,28 @@ function InstanceCard({
           instance.versionLabel || "Unknown",
           /* @__PURE__ */ jsx(UpdateBadge, { count: availableUpdates })
         ] }),
-        instance.isAirgap && /* @__PURE__ */ jsx("span", { className: "rounded-full bg-indigo-100 px-2 py-0.5 text-xs font-medium text-indigo-700", children: "air gap" }),
+        instance.isAirgap && /* @__PURE__ */ jsx(
+          "span",
+          {
+            className: "rounded-full px-2 py-0.5 text-xs font-medium",
+            style: {
+              backgroundColor: `var(--portal-branding-primary-light, ${DEFAULT_SECONDARY_COLOR}20)`,
+              color: `var(--portal-branding-primary, ${DEFAULT_SECONDARY_COLOR})`
+            },
+            children: "air gap"
+          }
+        ),
         installType && /* @__PURE__ */ jsx("span", { className: "rounded-full bg-gray-100 px-2 py-0.5 text-xs font-medium text-gray-600", children: installType }),
         (instance.appStatus || instance.resourceStates && instance.resourceStates.length > 0) && /* @__PURE__ */ jsx(AppStatusBadge, { status: statusForBadge })
       ] }),
       /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap gap-4", children: [
         /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
           /* @__PURE__ */ jsx("span", { className: "text-xs text-gray-500", children: "First check-in:" }),
-          /* @__PURE__ */ jsx("span", { className: "text-xs text-gray-600", children: formatDateTime(instance.firstCheckin) })
+          /* @__PURE__ */ jsx("span", { className: "text-xs text-gray-600", children: formatDateTimeLocal(instance.firstCheckin) })
         ] }),
         /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
           /* @__PURE__ */ jsx("span", { className: "text-xs text-gray-500", children: "Last check-in:" }),
-          /* @__PURE__ */ jsx("span", { className: "text-xs text-gray-600", children: formatDateTime(instance.lastCheckin) })
+          /* @__PURE__ */ jsx("span", { className: "text-xs text-gray-600", children: formatDateTimeLocal(instance.lastCheckin) })
         ] })
       ] }),
       securityEnabled && hasSecurityInfo && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
@@ -495,7 +432,7 @@ var OnlineInstanceList = ({
   channelReleases = [],
   installOptions = [],
   onUpdateClick,
-  primaryColor = "#6366f1",
+  primaryColor = DEFAULT_SECONDARY_COLOR,
   securityData = {},
   securityDiffData = {},
   securityEnabled = false,
@@ -573,15 +510,6 @@ var OnlineInstanceList = ({
   ] });
 };
 OnlineInstanceList.displayName = "OnlineInstanceList";
-/*! Bundled license information:
-
-classnames/index.js:
-  (*!
-  	Copyright (c) 2018 Jed Watson.
-  	Licensed under the MIT License (MIT), see
-  	http://jedwatson.github.io/classnames
-  *)
-*/
 
 export { OnlineInstanceList };
 //# sourceMappingURL=online-instance-list.js.map