@olmocms/front 0.1.2 → 0.1.6

package/dist/components/index.cjs

@@ -25,6 +25,7 @@ __export(components_exports, {
   JsonLd: () => JsonLd,
   RouteProvider: () => RouteProvider,
   RouteSetter: () => RouteSetter,
+  StageLogin: () => StageLogin,
   gtmClick: () => gtmClick,
   gtmFormSent: () => gtmFormSent,
   gtmPageView: () => gtmPageView,
@@ -100,12 +101,104 @@ function gtmClick({ category, action, label }) {
     label: cleanLabel[cleanLabel.length - 1]
   });
 }
+
+// src/components/StageLogin.tsx
+var import_react4 = require("react");
+var import_navigation = require("next/navigation");
+var import_jsx_runtime4 = require("react/jsx-runtime");
+function OlmoLogo({ className }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+    "svg",
+    {
+      role: "img",
+      "aria-label": "Olmo",
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 225 232",
+      className,
+      children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M102.3,12.2c75-6.4,129.5,63.8,108.1,135.4-23.3,77.6-124.6,98.3-176.6,36.2C-18.2,121.7,19.1,19.2,102.4,12.2h-.1ZM87.4,202.3c35.6,9.9,73.6-2.3,95.6-32.1,37.4-50.9,12.4-125.6-49.4-140.8C59.5,11.2,1.3,86.9,32.6,154.9c7.7,16.8,23.8,34.9,41.6,40.8l5.5-20.1c-20-27-17.3-63.2,7.3-86.4,11-10.3,38.6-24.9,53.1-28.9s8.1-.9,10.4,3.2,6.5,23.1,7.4,28.4c4,22.6,2.1,44.6-13,62.8-13.1,15.8-31,22.5-50.8,25.5l-6.6,22.1h0ZM139.2,77c-33.7,10.7-72,38.9-54.1,79.1l11-20.1c4.1-4.6,12.6-23.1,17.7-24.7,6.3-2,10.9,3.5,8.7,9.7s-11.8,18.1-15.5,25.1-9,17.8-8.3,18.5c43-8.8,54.8-49.5,40.5-87.6h0Z" })
+    }
+  );
+}
+function StageLogin({
+  action,
+  title = "Olmo Staging access",
+  description = "This environment is restricted. Please sign in to continue.",
+  usernameLabel = "Username",
+  passwordLabel = "Password",
+  submitLabel = "Sign in",
+  invalidCredentialsMessage = "Invalid username or password.",
+  missingConfigMessage = "Stage authentication is not configured."
+}) {
+  const params = (0, import_navigation.useSearchParams)();
+  const router = (0, import_navigation.useRouter)();
+  const from = params.get("from") ?? "/";
+  const [state, formAction, pending] = (0, import_react4.useActionState)(action, {});
+  (0, import_react4.useEffect)(() => {
+    if (state.redirectTo) router.replace(state.redirectTo);
+  }, [state.redirectTo, router]);
+  const errorMessage = state.error === "invalid_credentials" ? invalidCredentialsMessage : state.error === "missing_config" ? missingConfigMessage : null;
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_jsx_runtime4.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex min-h-full flex-col justify-center px-6 py-12 lg:px-8", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "sm:mx-auto sm:w-full sm:max-w-[384px]", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(OlmoLogo, { className: "mx-auto h-10 w-auto " }),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("header", { className: "space-y-1", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("h1", { className: "text-xl text-center font-semibold text-neutral-900", children: title }),
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("p", { className: "text-sm text-center text-neutral-600", children: description })
+      ] })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "mt-10 sm:mx-auto sm:w-full sm:max-w-[384px]", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("form", { action: formAction, method: "POST", className: "space-y-6", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("input", { type: "hidden", name: "from", value: from }),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("label", { htmlFor: "username", className: "block text-sm/6 font-medium text-gray-900", children: usernameLabel }),
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "mt-2", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+          "input",
+          {
+            id: "username",
+            name: "username",
+            type: "username",
+            disabled: pending,
+            required: true,
+            autoComplete: "username",
+            className: "block w-full rounded-md bg-white px-3 py-1.5 text-base text-gray-900 outline-1 -outline-offset-1 outline-gray-300 placeholder:text-gray-400 focus:outline-2 focus:-outline-offset-2 focus:outline-black sm:text-sm/6"
+          }
+        ) })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "flex items-center justify-between", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("label", { htmlFor: "password", className: "block text-sm/6 font-medium text-gray-900", children: passwordLabel }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "mt-2", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+          "input",
+          {
+            id: "password",
+            name: "password",
+            type: "password",
+            disabled: pending,
+            required: true,
+            autoComplete: "current-password",
+            className: "block w-full rounded-md bg-white px-3 py-1.5 text-base text-gray-900 outline-1 -outline-offset-1 outline-gray-300 placeholder:text-gray-400 focus:outline-2 focus:-outline-offset-2 focus:outline-black sm:text-sm/6"
+          }
+        ) })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { children: [
+        errorMessage ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("p", { role: "alert", className: "text-sm text-red-600", children: errorMessage }) : null,
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+          "button",
+          {
+            type: "submit",
+            disabled: pending,
+            className: "cursor-pointer flex w-full justify-center rounded-md bg-black px-3 py-1.5 text-sm/6 font-semibold text-white shadow-xs hover:bg-black focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-black",
+            children: pending ? "\u2026" : submitLabel
+          }
+        )
+      ] })
+    ] }) })
+  ] }) });
+}
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   GtmPage,
   JsonLd,
   RouteProvider,
   RouteSetter,
+  StageLogin,
   gtmClick,
   gtmFormSent,
   gtmPageView,

package/dist/components/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/index.ts","../../src/components/RouteContext.tsx","../../src/components/RouteSetter.tsx","../../src/components/JsonLd.tsx","../../src/components/GtmPage.tsx"],"sourcesContent":["export { RouteProvider, useRoute } from './RouteContext.js';\nexport { RouteSetter } from './RouteSetter.js';\nexport { JsonLd } from './JsonLd.js';\nexport { GtmPage, gtmPageView, gtmFormSent, gtmClick } from './GtmPage.js';\n","'use client';\n\nimport { createContext, useContext, useState } from 'react';\nimport type { ReactNode } from 'react';\n\ntype LocaleSlugs = Record<string, string>;\n\nconst RouteContext = createContext<{\n  slugs: LocaleSlugs;\n  setSlugs: (slugs: LocaleSlugs) => void;\n}>({ slugs: {}, setSlugs: () => {} });\n\nexport function RouteProvider({ children }: { children: ReactNode }) {\n  const [slugs, setSlugs] = useState<LocaleSlugs>({});\n  return (\n    <RouteContext.Provider value={{ slugs, setSlugs }}>\n      {children}\n    </RouteContext.Provider>\n  );\n}\n\nexport const useRoute = () => useContext(RouteContext);\n","'use client';\n\nimport { useEffect } from 'react';\nimport { useRoute } from './RouteContext.js';\n\nexport function RouteSetter({ slugs }: { slugs: Record<string, string> }) {\n  const { setSlugs } = useRoute();\n\n  useEffect(() => {\n    const leafSlugs = Object.fromEntries(\n      Object.entries(slugs).map(([locale, slug]) => [locale, slug.split('/').pop() ?? slug]),\n    );\n    setSlugs(leafSlugs);\n    return () => setSlugs({});\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [JSON.stringify(slugs)]);\n\n  return null;\n}\n","export function JsonLd({ schema }: { schema: object }) {\n  return (\n    <script\n      type=\"application/ld+json\"\n      dangerouslySetInnerHTML={{ __html: JSON.stringify(schema) }}\n    />\n  );\n}\n","'use client';\n\nimport { useEffect } from 'react';\n\ninterface GtmPageProps {\n  slug: string | null;\n  lang: string | null;\n  name: string | null;\n  template: string | null;\n}\n\ninterface GtmFormProps {\n  data: object | null;\n  name: string | null;\n}\n\ninterface GtmClickProps {\n  category: string | null;\n  action: string | null;\n  label: string | null;\n}\n\ndeclare global {\n  interface Window {\n    dataLayer: any[];\n  }\n}\n\nexport function GtmPage({ slug, lang, name, template }: GtmPageProps) {\n  useEffect(() => {\n    if (slug) {\n      gtmPageView({\n        page_name: name,\n        page_category: (template as any)?.name,\n        page_language: lang,\n        path_clean: slug,\n      });\n    }\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [slug]);\n\n  return <></>;\n}\n\nexport function gtmPageView(props: Record<string, any>) {\n  return window.dataLayer?.push({ event: 'page_view', url: window.location.href, ...props });\n}\n\nexport function gtmFormSent({ data, name }: GtmFormProps) {\n  return window.dataLayer?.push({ ...data, event: 'form_sent', form: name });\n}\n\nexport function gtmClick({ category, action, label }: GtmClickProps) {\n  const cleanLabel = label?.split('/') ?? [];\n  return window.dataLayer?.push({\n    event: 'click',\n    category,\n    action,\n    label: cleanLabel[cleanLabel.length - 1],\n  });\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACEA,mBAAoD;AAahD;AARJ,IAAM,mBAAe,4BAGlB,EAAE,OAAO,CAAC,GAAG,UAAU,MAAM;AAAC,EAAE,CAAC;AAE7B,SAAS,cAAc,EAAE,SAAS,GAA4B;AACnE,QAAM,CAAC,OAAO,QAAQ,QAAI,uBAAsB,CAAC,CAAC;AAClD,SACE,4CAAC,aAAa,UAAb,EAAsB,OAAO,EAAE,OAAO,SAAS,GAC7C,UACH;AAEJ;AAEO,IAAM,WAAW,UAAM,yBAAW,YAAY;;;ACnBrD,IAAAA,gBAA0B;AAGnB,SAAS,YAAY,EAAE,MAAM,GAAsC;AACxE,QAAM,EAAE,SAAS,IAAI,SAAS;AAE9B,+BAAU,MAAM;AACd,UAAM,YAAY,OAAO;AAAA,MACvB,OAAO,QAAQ,KAAK,EAAE,IAAI,CAAC,CAAC,QAAQ,IAAI,MAAM,CAAC,QAAQ,KAAK,MAAM,GAAG,EAAE,IAAI,KAAK,IAAI,CAAC;AAAA,IACvF;AACA,aAAS,SAAS;AAClB,WAAO,MAAM,SAAS,CAAC,CAAC;AAAA,EAE1B,GAAG,CAAC,KAAK,UAAU,KAAK,CAAC,CAAC;AAE1B,SAAO;AACT;;;AChBI,IAAAC,sBAAA;AAFG,SAAS,OAAO,EAAE,OAAO,GAAuB;AACrD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,yBAAyB,EAAE,QAAQ,KAAK,UAAU,MAAM,EAAE;AAAA;AAAA,EAC5D;AAEJ;;;ACLA,IAAAC,gBAA0B;AAuCjB,IAAAC,sBAAA;AAbF,SAAS,QAAQ,EAAE,MAAM,MAAM,MAAM,SAAS,GAAiB;AACpE,+BAAU,MAAM;AACd,QAAI,MAAM;AACR,kBAAY;AAAA,QACV,WAAW;AAAA,QACX,eAAgB,UAAkB;AAAA,QAClC,eAAe;AAAA,QACf,YAAY;AAAA,MACd,CAAC;AAAA,IACH;AAAA,EAEF,GAAG,CAAC,IAAI,CAAC;AAET,SAAO,6EAAE;AACX;AAEO,SAAS,YAAY,OAA4B;AACtD,SAAO,OAAO,WAAW,KAAK,EAAE,OAAO,aAAa,KAAK,OAAO,SAAS,MAAM,GAAG,MAAM,CAAC;AAC3F;AAEO,SAAS,YAAY,EAAE,MAAM,KAAK,GAAiB;AACxD,SAAO,OAAO,WAAW,KAAK,EAAE,GAAG,MAAM,OAAO,aAAa,MAAM,KAAK,CAAC;AAC3E;AAEO,SAAS,SAAS,EAAE,UAAU,QAAQ,MAAM,GAAkB;AACnE,QAAM,aAAa,OAAO,MAAM,GAAG,KAAK,CAAC;AACzC,SAAO,OAAO,WAAW,KAAK;AAAA,IAC5B,OAAO;AAAA,IACP;AAAA,IACA;AAAA,IACA,OAAO,WAAW,WAAW,SAAS,CAAC;AAAA,EACzC,CAAC;AACH;","names":["import_react","import_jsx_runtime","import_react","import_jsx_runtime"]}
+{"version":3,"sources":["../../src/components/index.ts","../../src/components/RouteContext.tsx","../../src/components/RouteSetter.tsx","../../src/components/JsonLd.tsx","../../src/components/GtmPage.tsx","../../src/components/StageLogin.tsx"],"sourcesContent":["export { RouteProvider, useRoute } from './RouteContext.js';\nexport { RouteSetter } from './RouteSetter.js';\nexport { JsonLd } from './JsonLd.js';\nexport { GtmPage, gtmPageView, gtmFormSent, gtmClick } from './GtmPage.js';\nexport { StageLogin } from './StageLogin.js';\nexport type { StageLoginProps } from './StageLogin.js';\n","'use client';\n\nimport { createContext, useContext, useState } from 'react';\nimport type { ReactNode } from 'react';\n\ntype LocaleSlugs = Record<string, string>;\n\nconst RouteContext = createContext<{\n  slugs: LocaleSlugs;\n  setSlugs: (slugs: LocaleSlugs) => void;\n}>({ slugs: {}, setSlugs: () => {} });\n\nexport function RouteProvider({ children }: { children: ReactNode }) {\n  const [slugs, setSlugs] = useState<LocaleSlugs>({});\n  return (\n    <RouteContext.Provider value={{ slugs, setSlugs }}>\n      {children}\n    </RouteContext.Provider>\n  );\n}\n\nexport const useRoute = () => useContext(RouteContext);\n","'use client';\n\nimport { useEffect } from 'react';\nimport { useRoute } from './RouteContext.js';\n\nexport function RouteSetter({ slugs }: { slugs: Record<string, string> }) {\n  const { setSlugs } = useRoute();\n\n  useEffect(() => {\n    const leafSlugs = Object.fromEntries(\n      Object.entries(slugs).map(([locale, slug]) => [locale, slug.split('/').pop() ?? slug]),\n    );\n    setSlugs(leafSlugs);\n    return () => setSlugs({});\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [JSON.stringify(slugs)]);\n\n  return null;\n}\n","export function JsonLd({ schema }: { schema: object }) {\n  return (\n    <script\n      type=\"application/ld+json\"\n      dangerouslySetInnerHTML={{ __html: JSON.stringify(schema) }}\n    />\n  );\n}\n","'use client';\n\nimport { useEffect } from 'react';\n\ninterface GtmPageProps {\n  slug: string | null;\n  lang: string | null;\n  name: string | null;\n  template: string | null;\n}\n\ninterface GtmFormProps {\n  data: object | null;\n  name: string | null;\n}\n\ninterface GtmClickProps {\n  category: string | null;\n  action: string | null;\n  label: string | null;\n}\n\ndeclare global {\n  interface Window {\n    dataLayer: any[];\n  }\n}\n\nexport function GtmPage({ slug, lang, name, template }: GtmPageProps) {\n  useEffect(() => {\n    if (slug) {\n      gtmPageView({\n        page_name: name,\n        page_category: (template as any)?.name,\n        page_language: lang,\n        path_clean: slug,\n      });\n    }\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [slug]);\n\n  return <></>;\n}\n\nexport function gtmPageView(props: Record<string, any>) {\n  return window.dataLayer?.push({ event: 'page_view', url: window.location.href, ...props });\n}\n\nexport function gtmFormSent({ data, name }: GtmFormProps) {\n  return window.dataLayer?.push({ ...data, event: 'form_sent', form: name });\n}\n\nexport function gtmClick({ category, action, label }: GtmClickProps) {\n  const cleanLabel = label?.split('/') ?? [];\n  return window.dataLayer?.push({\n    event: 'click',\n    category,\n    action,\n    label: cleanLabel[cleanLabel.length - 1],\n  });\n}\n","import { useActionState, useEffect } from 'react';\nimport { useSearchParams, useRouter } from 'next/navigation';\n\nfunction OlmoLogo({ className }: { className?: string }) {\n  return (\n    <svg\n      role=\"img\"\n      aria-label=\"Olmo\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      viewBox=\"0 0 225 232\"\n      className={className}\n    >\n      <path d=\"M102.3,12.2c75-6.4,129.5,63.8,108.1,135.4-23.3,77.6-124.6,98.3-176.6,36.2C-18.2,121.7,19.1,19.2,102.4,12.2h-.1ZM87.4,202.3c35.6,9.9,73.6-2.3,95.6-32.1,37.4-50.9,12.4-125.6-49.4-140.8C59.5,11.2,1.3,86.9,32.6,154.9c7.7,16.8,23.8,34.9,41.6,40.8l5.5-20.1c-20-27-17.3-63.2,7.3-86.4,11-10.3,38.6-24.9,53.1-28.9s8.1-.9,10.4,3.2,6.5,23.1,7.4,28.4c4,22.6,2.1,44.6-13,62.8-13.1,15.8-31,22.5-50.8,25.5l-6.6,22.1h0ZM139.2,77c-33.7,10.7-72,38.9-54.1,79.1l11-20.1c4.1-4.6,12.6-23.1,17.7-24.7,6.3-2,10.9,3.5,8.7,9.7s-11.8,18.1-15.5,25.1-9,17.8-8.3,18.5c43-8.8,54.8-49.5,40.5-87.6h0Z\" />\n    </svg>\n  );\n}\n\ntype StageLoginState = {\n  error?: 'missing_config' | 'invalid_credentials' | null;\n  redirectTo?: string | null;\n};\n\ntype StageLoginAction = (prev: StageLoginState, formData: FormData) => Promise<StageLoginState>;\n\nexport type StageLoginProps = {\n  action: StageLoginAction;\n  title?: string;\n  description?: string;\n  usernameLabel?: string;\n  passwordLabel?: string;\n  submitLabel?: string;\n  invalidCredentialsMessage?: string;\n  missingConfigMessage?: string;\n};\n\nexport function StageLoginOLD({\n  action,\n  title = 'Staging access',\n  description = 'This environment is restricted. Please sign in to continue.',\n  usernameLabel = 'Username',\n  passwordLabel = 'Password',\n  submitLabel = 'Sign in',\n  invalidCredentialsMessage = 'Invalid username or password.',\n  missingConfigMessage = 'Stage authentication is not configured.',\n}: StageLoginProps) {\n  const params = useSearchParams();\n  const from = params.get('from') ?? '/';\n  const [state, formAction, pending] = useActionState<StageLoginState, FormData>(action, {});\n\n  const errorMessage =\n    state.error === 'invalid_credentials'\n      ? invalidCredentialsMessage\n      : state.error === 'missing_config'\n        ? missingConfigMessage\n        : null;\n\n  return (\n    <main className=\"flex min-h-screen items-center justify-center bg-neutral-50 px-4 py-12\">\n      <form\n        action={formAction}\n        className=\"relative w-full max-w-md space-y-5 rounded-lg border border-neutral-200 bg-white p-8 shadow-sm\"\n      >\n        <div className=\"w-full min-w-[200px]\">\n          <header className=\"space-y-1 text-center\">\n            <h1 className=\"text-xl font-semibold text-neutral-900\">{title}</h1>\n            <p className=\"text-sm text-neutral-600\">{description}</p>\n          </header>\n\n          <input type=\"hidden\" name=\"from\" value={from} />\n\n          <label className=\"block space-y-1\">\n            <span className=\"text-sm font-medium text-neutral-800\">{usernameLabel}</span>\n            <input\n              name=\"username\"\n              type=\"text\"\n              autoComplete=\"username\"\n              required\n              disabled={pending}\n              className=\"w-full rounded border border-neutral-300 px-3 py-2 text-sm outline-none focus:border-neutral-900\"\n            />\n          </label>\n\n          <label className=\"block space-y-1\">\n            <span className=\"text-sm font-medium text-neutral-800\">{passwordLabel}</span>\n            <input\n              name=\"password\"\n              type=\"password\"\n              autoComplete=\"current-password\"\n              required\n              disabled={pending}\n              className=\"w-full rounded border border-neutral-300 px-3 py-2 text-sm outline-none focus:border-neutral-900\"\n            />\n          </label>\n\n          {errorMessage ? (\n            <p role=\"alert\" className=\"text-sm text-red-600\">\n              {errorMessage}\n            </p>\n          ) : null}\n\n          <button\n            type=\"submit\"\n            disabled={pending}\n            className=\"w-full rounded bg-neutral-900 px-4 py-2 text-sm font-medium text-white transition hover:bg-neutral-800 disabled:opacity-60\"\n          >\n            {pending ? '…' : submitLabel}\n          </button>\n        </div>\n      </form>\n    </main>\n  );\n}\n\n\nexport function StageLogin({\n  action,\n  title = 'Olmo Staging access',\n  description = 'This environment is restricted. Please sign in to continue.',\n  usernameLabel = 'Username',\n  passwordLabel = 'Password',\n  submitLabel = 'Sign in',\n  invalidCredentialsMessage = 'Invalid username or password.',\n  missingConfigMessage = 'Stage authentication is not configured.',  \n}: StageLoginProps) {\n  \n  const params = useSearchParams();\n  const router = useRouter();\n  const from = params.get('from') ?? '/';\n  const [state, formAction, pending] = useActionState<StageLoginState, FormData>(action, {});\n\n  // Once the action returns a redirect target the cookie is already in the\n  // browser's jar (it shipped as Set-Cookie on the action response). Only\n  // then do we navigate, so the next GET carries the session and middleware\n  // doesn't bounce the user back to login.\n  useEffect(() => {\n    if (state.redirectTo) router.replace(state.redirectTo);\n  }, [state.redirectTo, router]);\n\n  const errorMessage =\n    state.error === 'invalid_credentials'\n      ? invalidCredentialsMessage\n      : state.error === 'missing_config'\n        ? missingConfigMessage\n        : null;\n\n  return (\n    <>\n      <div className=\"flex min-h-full flex-col justify-center px-6 py-12 lg:px-8\">\n        <div className=\"sm:mx-auto sm:w-full sm:max-w-[384px]\">\n          <OlmoLogo className=\"mx-auto h-10 w-auto \" />\n          {/* <h2 className=\"mt-10 text-center text-2xl/9 font-bold tracking-tight text-gray-900\">\n            Sign in to your account\n          </h2> */}\n          <header className=\"space-y-1\">\n            <h1 className=\"text-xl text-center font-semibold text-neutral-900\">{title}</h1>\n            <p className=\"text-sm text-center text-neutral-600\">{description}</p>\n          </header>          \n        </div>\n\n        <div className=\"mt-10 sm:mx-auto sm:w-full sm:max-w-[384px]\">\n          <form action={formAction} method=\"POST\" className=\"space-y-6\">\n            <input type=\"hidden\" name=\"from\" value={from} />\n            <div>\n              <label htmlFor=\"username\" className=\"block text-sm/6 font-medium text-gray-900\">\n                {usernameLabel}\n              </label>\n              <div className=\"mt-2\">\n                <input\n                  id=\"username\"\n                  name=\"username\"\n                  type=\"username\"\n                  disabled={pending}\n                  required\n                  autoComplete=\"username\"\n                  className=\"block w-full rounded-md bg-white px-3 py-1.5 text-base text-gray-900 outline-1 -outline-offset-1 outline-gray-300 placeholder:text-gray-400 focus:outline-2 focus:-outline-offset-2 focus:outline-black sm:text-sm/6\"\n                />\n              </div>\n            </div>\n\n            <div>\n              <div className=\"flex items-center justify-between\">\n                <label htmlFor=\"password\" className=\"block text-sm/6 font-medium text-gray-900\">\n                  {passwordLabel}\n                </label>\n              </div>\n              <div className=\"mt-2\">\n                <input\n                  id=\"password\"\n                  name=\"password\"\n                  type=\"password\"\n                  disabled={pending}\n                  required\n                  autoComplete=\"current-password\"\n                  className=\"block w-full rounded-md bg-white px-3 py-1.5 text-base text-gray-900 outline-1 -outline-offset-1 outline-gray-300 placeholder:text-gray-400 focus:outline-2 focus:-outline-offset-2 focus:outline-black sm:text-sm/6\"\n                />\n              </div>\n            </div>\n\n            <div>\n              {errorMessage ? (\n                <p role=\"alert\" className=\"text-sm text-red-600\">\n                  {errorMessage}\n                </p>\n              ) : null}              \n              <button\n                type=\"submit\"\n                disabled={pending}\n                className=\"cursor-pointer flex w-full justify-center rounded-md bg-black px-3 py-1.5 text-sm/6 font-semibold text-white shadow-xs hover:bg-black focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-black\"\n              >\n                {pending ? '…' : submitLabel}\n              </button>\n            </div>\n          </form>\n\n        </div>\n      </div>\n    </>\n  )\n}\n"],"mappings":"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","names":["import_react","import_jsx_runtime","import_react","import_jsx_runtime","import_react","import_jsx_runtime"]}

package/dist/components/index.d.cts

@@ -43,4 +43,21 @@ declare function gtmPageView(props: Record<string, any>): number;
 declare function gtmFormSent({ data, name }: GtmFormProps): number;
 declare function gtmClick({ category, action, label }: GtmClickProps): number;
 
-export { GtmPage, JsonLd, RouteProvider, RouteSetter, gtmClick, gtmFormSent, gtmPageView, useRoute };
+type StageLoginState = {
+    error?: 'missing_config' | 'invalid_credentials' | null;
+    redirectTo?: string | null;
+};
+type StageLoginAction = (prev: StageLoginState, formData: FormData) => Promise<StageLoginState>;
+type StageLoginProps = {
+    action: StageLoginAction;
+    title?: string;
+    description?: string;
+    usernameLabel?: string;
+    passwordLabel?: string;
+    submitLabel?: string;
+    invalidCredentialsMessage?: string;
+    missingConfigMessage?: string;
+};
+declare function StageLogin({ action, title, description, usernameLabel, passwordLabel, submitLabel, invalidCredentialsMessage, missingConfigMessage, }: StageLoginProps): react_jsx_runtime.JSX.Element;
+
+export { GtmPage, JsonLd, RouteProvider, RouteSetter, StageLogin, type StageLoginProps, gtmClick, gtmFormSent, gtmPageView, useRoute };

package/dist/components/index.d.ts

@@ -43,4 +43,21 @@ declare function gtmPageView(props: Record<string, any>): number;
 declare function gtmFormSent({ data, name }: GtmFormProps): number;
 declare function gtmClick({ category, action, label }: GtmClickProps): number;
 
-export { GtmPage, JsonLd, RouteProvider, RouteSetter, gtmClick, gtmFormSent, gtmPageView, useRoute };
+type StageLoginState = {
+    error?: 'missing_config' | 'invalid_credentials' | null;
+    redirectTo?: string | null;
+};
+type StageLoginAction = (prev: StageLoginState, formData: FormData) => Promise<StageLoginState>;
+type StageLoginProps = {
+    action: StageLoginAction;
+    title?: string;
+    description?: string;
+    usernameLabel?: string;
+    passwordLabel?: string;
+    submitLabel?: string;
+    invalidCredentialsMessage?: string;
+    missingConfigMessage?: string;
+};
+declare function StageLogin({ action, title, description, usernameLabel, passwordLabel, submitLabel, invalidCredentialsMessage, missingConfigMessage, }: StageLoginProps): react_jsx_runtime.JSX.Element;
+
+export { GtmPage, JsonLd, RouteProvider, RouteSetter, StageLogin, type StageLoginProps, gtmClick, gtmFormSent, gtmPageView, useRoute };

package/dist/components/index.js

@@ -68,11 +68,103 @@ function gtmClick({ category, action, label }) {
     label: cleanLabel[cleanLabel.length - 1]
   });
 }
+
+// src/components/StageLogin.tsx
+import { useActionState, useEffect as useEffect3 } from "react";
+import { useSearchParams, useRouter } from "next/navigation";
+import { Fragment as Fragment2, jsx as jsx4, jsxs } from "react/jsx-runtime";
+function OlmoLogo({ className }) {
+  return /* @__PURE__ */ jsx4(
+    "svg",
+    {
+      role: "img",
+      "aria-label": "Olmo",
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 225 232",
+      className,
+      children: /* @__PURE__ */ jsx4("path", { d: "M102.3,12.2c75-6.4,129.5,63.8,108.1,135.4-23.3,77.6-124.6,98.3-176.6,36.2C-18.2,121.7,19.1,19.2,102.4,12.2h-.1ZM87.4,202.3c35.6,9.9,73.6-2.3,95.6-32.1,37.4-50.9,12.4-125.6-49.4-140.8C59.5,11.2,1.3,86.9,32.6,154.9c7.7,16.8,23.8,34.9,41.6,40.8l5.5-20.1c-20-27-17.3-63.2,7.3-86.4,11-10.3,38.6-24.9,53.1-28.9s8.1-.9,10.4,3.2,6.5,23.1,7.4,28.4c4,22.6,2.1,44.6-13,62.8-13.1,15.8-31,22.5-50.8,25.5l-6.6,22.1h0ZM139.2,77c-33.7,10.7-72,38.9-54.1,79.1l11-20.1c4.1-4.6,12.6-23.1,17.7-24.7,6.3-2,10.9,3.5,8.7,9.7s-11.8,18.1-15.5,25.1-9,17.8-8.3,18.5c43-8.8,54.8-49.5,40.5-87.6h0Z" })
+    }
+  );
+}
+function StageLogin({
+  action,
+  title = "Olmo Staging access",
+  description = "This environment is restricted. Please sign in to continue.",
+  usernameLabel = "Username",
+  passwordLabel = "Password",
+  submitLabel = "Sign in",
+  invalidCredentialsMessage = "Invalid username or password.",
+  missingConfigMessage = "Stage authentication is not configured."
+}) {
+  const params = useSearchParams();
+  const router = useRouter();
+  const from = params.get("from") ?? "/";
+  const [state, formAction, pending] = useActionState(action, {});
+  useEffect3(() => {
+    if (state.redirectTo) router.replace(state.redirectTo);
+  }, [state.redirectTo, router]);
+  const errorMessage = state.error === "invalid_credentials" ? invalidCredentialsMessage : state.error === "missing_config" ? missingConfigMessage : null;
+  return /* @__PURE__ */ jsx4(Fragment2, { children: /* @__PURE__ */ jsxs("div", { className: "flex min-h-full flex-col justify-center px-6 py-12 lg:px-8", children: [
+    /* @__PURE__ */ jsxs("div", { className: "sm:mx-auto sm:w-full sm:max-w-[384px]", children: [
+      /* @__PURE__ */ jsx4(OlmoLogo, { className: "mx-auto h-10 w-auto " }),
+      /* @__PURE__ */ jsxs("header", { className: "space-y-1", children: [
+        /* @__PURE__ */ jsx4("h1", { className: "text-xl text-center font-semibold text-neutral-900", children: title }),
+        /* @__PURE__ */ jsx4("p", { className: "text-sm text-center text-neutral-600", children: description })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsx4("div", { className: "mt-10 sm:mx-auto sm:w-full sm:max-w-[384px]", children: /* @__PURE__ */ jsxs("form", { action: formAction, method: "POST", className: "space-y-6", children: [
+      /* @__PURE__ */ jsx4("input", { type: "hidden", name: "from", value: from }),
+      /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx4("label", { htmlFor: "username", className: "block text-sm/6 font-medium text-gray-900", children: usernameLabel }),
+        /* @__PURE__ */ jsx4("div", { className: "mt-2", children: /* @__PURE__ */ jsx4(
+          "input",
+          {
+            id: "username",
+            name: "username",
+            type: "username",
+            disabled: pending,
+            required: true,
+            autoComplete: "username",
+            className: "block w-full rounded-md bg-white px-3 py-1.5 text-base text-gray-900 outline-1 -outline-offset-1 outline-gray-300 placeholder:text-gray-400 focus:outline-2 focus:-outline-offset-2 focus:outline-black sm:text-sm/6"
+          }
+        ) })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { children: [
+        /* @__PURE__ */ jsx4("div", { className: "flex items-center justify-between", children: /* @__PURE__ */ jsx4("label", { htmlFor: "password", className: "block text-sm/6 font-medium text-gray-900", children: passwordLabel }) }),
+        /* @__PURE__ */ jsx4("div", { className: "mt-2", children: /* @__PURE__ */ jsx4(
+          "input",
+          {
+            id: "password",
+            name: "password",
+            type: "password",
+            disabled: pending,
+            required: true,
+            autoComplete: "current-password",
+            className: "block w-full rounded-md bg-white px-3 py-1.5 text-base text-gray-900 outline-1 -outline-offset-1 outline-gray-300 placeholder:text-gray-400 focus:outline-2 focus:-outline-offset-2 focus:outline-black sm:text-sm/6"
+          }
+        ) })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { children: [
+        errorMessage ? /* @__PURE__ */ jsx4("p", { role: "alert", className: "text-sm text-red-600", children: errorMessage }) : null,
+        /* @__PURE__ */ jsx4(
+          "button",
+          {
+            type: "submit",
+            disabled: pending,
+            className: "cursor-pointer flex w-full justify-center rounded-md bg-black px-3 py-1.5 text-sm/6 font-semibold text-white shadow-xs hover:bg-black focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-black",
+            children: pending ? "\u2026" : submitLabel
+          }
+        )
+      ] })
+    ] }) })
+  ] }) });
+}
 export {
   GtmPage,
   JsonLd,
   RouteProvider,
   RouteSetter,
+  StageLogin,
   gtmClick,
   gtmFormSent,
   gtmPageView,

package/dist/components/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/RouteContext.tsx","../../src/components/RouteSetter.tsx","../../src/components/JsonLd.tsx","../../src/components/GtmPage.tsx"],"sourcesContent":["'use client';\n\nimport { createContext, useContext, useState } from 'react';\nimport type { ReactNode } from 'react';\n\ntype LocaleSlugs = Record<string, string>;\n\nconst RouteContext = createContext<{\n  slugs: LocaleSlugs;\n  setSlugs: (slugs: LocaleSlugs) => void;\n}>({ slugs: {}, setSlugs: () => {} });\n\nexport function RouteProvider({ children }: { children: ReactNode }) {\n  const [slugs, setSlugs] = useState<LocaleSlugs>({});\n  return (\n    <RouteContext.Provider value={{ slugs, setSlugs }}>\n      {children}\n    </RouteContext.Provider>\n  );\n}\n\nexport const useRoute = () => useContext(RouteContext);\n","'use client';\n\nimport { useEffect } from 'react';\nimport { useRoute } from './RouteContext.js';\n\nexport function RouteSetter({ slugs }: { slugs: Record<string, string> }) {\n  const { setSlugs } = useRoute();\n\n  useEffect(() => {\n    const leafSlugs = Object.fromEntries(\n      Object.entries(slugs).map(([locale, slug]) => [locale, slug.split('/').pop() ?? slug]),\n    );\n    setSlugs(leafSlugs);\n    return () => setSlugs({});\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [JSON.stringify(slugs)]);\n\n  return null;\n}\n","export function JsonLd({ schema }: { schema: object }) {\n  return (\n    <script\n      type=\"application/ld+json\"\n      dangerouslySetInnerHTML={{ __html: JSON.stringify(schema) }}\n    />\n  );\n}\n","'use client';\n\nimport { useEffect } from 'react';\n\ninterface GtmPageProps {\n  slug: string | null;\n  lang: string | null;\n  name: string | null;\n  template: string | null;\n}\n\ninterface GtmFormProps {\n  data: object | null;\n  name: string | null;\n}\n\ninterface GtmClickProps {\n  category: string | null;\n  action: string | null;\n  label: string | null;\n}\n\ndeclare global {\n  interface Window {\n    dataLayer: any[];\n  }\n}\n\nexport function GtmPage({ slug, lang, name, template }: GtmPageProps) {\n  useEffect(() => {\n    if (slug) {\n      gtmPageView({\n        page_name: name,\n        page_category: (template as any)?.name,\n        page_language: lang,\n        path_clean: slug,\n      });\n    }\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [slug]);\n\n  return <></>;\n}\n\nexport function gtmPageView(props: Record<string, any>) {\n  return window.dataLayer?.push({ event: 'page_view', url: window.location.href, ...props });\n}\n\nexport function gtmFormSent({ data, name }: GtmFormProps) {\n  return window.dataLayer?.push({ ...data, event: 'form_sent', form: name });\n}\n\nexport function gtmClick({ category, action, label }: GtmClickProps) {\n  const cleanLabel = label?.split('/') ?? [];\n  return window.dataLayer?.push({\n    event: 'click',\n    category,\n    action,\n    label: cleanLabel[cleanLabel.length - 1],\n  });\n}\n"],"mappings":";;;AAEA,SAAS,eAAe,YAAY,gBAAgB;AAahD;AARJ,IAAM,eAAe,cAGlB,EAAE,OAAO,CAAC,GAAG,UAAU,MAAM;AAAC,EAAE,CAAC;AAE7B,SAAS,cAAc,EAAE,SAAS,GAA4B;AACnE,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAsB,CAAC,CAAC;AAClD,SACE,oBAAC,aAAa,UAAb,EAAsB,OAAO,EAAE,OAAO,SAAS,GAC7C,UACH;AAEJ;AAEO,IAAM,WAAW,MAAM,WAAW,YAAY;;;ACnBrD,SAAS,iBAAiB;AAGnB,SAAS,YAAY,EAAE,MAAM,GAAsC;AACxE,QAAM,EAAE,SAAS,IAAI,SAAS;AAE9B,YAAU,MAAM;AACd,UAAM,YAAY,OAAO;AAAA,MACvB,OAAO,QAAQ,KAAK,EAAE,IAAI,CAAC,CAAC,QAAQ,IAAI,MAAM,CAAC,QAAQ,KAAK,MAAM,GAAG,EAAE,IAAI,KAAK,IAAI,CAAC;AAAA,IACvF;AACA,aAAS,SAAS;AAClB,WAAO,MAAM,SAAS,CAAC,CAAC;AAAA,EAE1B,GAAG,CAAC,KAAK,UAAU,KAAK,CAAC,CAAC;AAE1B,SAAO;AACT;;;AChBI,gBAAAA,YAAA;AAFG,SAAS,OAAO,EAAE,OAAO,GAAuB;AACrD,SACE,gBAAAA;AAAA,IAAC;AAAA;AAAA,MACC,MAAK;AAAA,MACL,yBAAyB,EAAE,QAAQ,KAAK,UAAU,MAAM,EAAE;AAAA;AAAA,EAC5D;AAEJ;;;ACLA,SAAS,aAAAC,kBAAiB;AAuCjB,0BAAAC,YAAA;AAbF,SAAS,QAAQ,EAAE,MAAM,MAAM,MAAM,SAAS,GAAiB;AACpE,EAAAD,WAAU,MAAM;AACd,QAAI,MAAM;AACR,kBAAY;AAAA,QACV,WAAW;AAAA,QACX,eAAgB,UAAkB;AAAA,QAClC,eAAe;AAAA,QACf,YAAY;AAAA,MACd,CAAC;AAAA,IACH;AAAA,EAEF,GAAG,CAAC,IAAI,CAAC;AAET,SAAO,gBAAAC,KAAA,YAAE;AACX;AAEO,SAAS,YAAY,OAA4B;AACtD,SAAO,OAAO,WAAW,KAAK,EAAE,OAAO,aAAa,KAAK,OAAO,SAAS,MAAM,GAAG,MAAM,CAAC;AAC3F;AAEO,SAAS,YAAY,EAAE,MAAM,KAAK,GAAiB;AACxD,SAAO,OAAO,WAAW,KAAK,EAAE,GAAG,MAAM,OAAO,aAAa,MAAM,KAAK,CAAC;AAC3E;AAEO,SAAS,SAAS,EAAE,UAAU,QAAQ,MAAM,GAAkB;AACnE,QAAM,aAAa,OAAO,MAAM,GAAG,KAAK,CAAC;AACzC,SAAO,OAAO,WAAW,KAAK;AAAA,IAC5B,OAAO;AAAA,IACP;AAAA,IACA;AAAA,IACA,OAAO,WAAW,WAAW,SAAS,CAAC;AAAA,EACzC,CAAC;AACH;","names":["jsx","useEffect","jsx"]}
+{"version":3,"sources":["../../src/components/RouteContext.tsx","../../src/components/RouteSetter.tsx","../../src/components/JsonLd.tsx","../../src/components/GtmPage.tsx","../../src/components/StageLogin.tsx"],"sourcesContent":["'use client';\n\nimport { createContext, useContext, useState } from 'react';\nimport type { ReactNode } from 'react';\n\ntype LocaleSlugs = Record<string, string>;\n\nconst RouteContext = createContext<{\n  slugs: LocaleSlugs;\n  setSlugs: (slugs: LocaleSlugs) => void;\n}>({ slugs: {}, setSlugs: () => {} });\n\nexport function RouteProvider({ children }: { children: ReactNode }) {\n  const [slugs, setSlugs] = useState<LocaleSlugs>({});\n  return (\n    <RouteContext.Provider value={{ slugs, setSlugs }}>\n      {children}\n    </RouteContext.Provider>\n  );\n}\n\nexport const useRoute = () => useContext(RouteContext);\n","'use client';\n\nimport { useEffect } from 'react';\nimport { useRoute } from './RouteContext.js';\n\nexport function RouteSetter({ slugs }: { slugs: Record<string, string> }) {\n  const { setSlugs } = useRoute();\n\n  useEffect(() => {\n    const leafSlugs = Object.fromEntries(\n      Object.entries(slugs).map(([locale, slug]) => [locale, slug.split('/').pop() ?? slug]),\n    );\n    setSlugs(leafSlugs);\n    return () => setSlugs({});\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [JSON.stringify(slugs)]);\n\n  return null;\n}\n","export function JsonLd({ schema }: { schema: object }) {\n  return (\n    <script\n      type=\"application/ld+json\"\n      dangerouslySetInnerHTML={{ __html: JSON.stringify(schema) }}\n    />\n  );\n}\n","'use client';\n\nimport { useEffect } from 'react';\n\ninterface GtmPageProps {\n  slug: string | null;\n  lang: string | null;\n  name: string | null;\n  template: string | null;\n}\n\ninterface GtmFormProps {\n  data: object | null;\n  name: string | null;\n}\n\ninterface GtmClickProps {\n  category: string | null;\n  action: string | null;\n  label: string | null;\n}\n\ndeclare global {\n  interface Window {\n    dataLayer: any[];\n  }\n}\n\nexport function GtmPage({ slug, lang, name, template }: GtmPageProps) {\n  useEffect(() => {\n    if (slug) {\n      gtmPageView({\n        page_name: name,\n        page_category: (template as any)?.name,\n        page_language: lang,\n        path_clean: slug,\n      });\n    }\n  // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [slug]);\n\n  return <></>;\n}\n\nexport function gtmPageView(props: Record<string, any>) {\n  return window.dataLayer?.push({ event: 'page_view', url: window.location.href, ...props });\n}\n\nexport function gtmFormSent({ data, name }: GtmFormProps) {\n  return window.dataLayer?.push({ ...data, event: 'form_sent', form: name });\n}\n\nexport function gtmClick({ category, action, label }: GtmClickProps) {\n  const cleanLabel = label?.split('/') ?? [];\n  return window.dataLayer?.push({\n    event: 'click',\n    category,\n    action,\n    label: cleanLabel[cleanLabel.length - 1],\n  });\n}\n","import { useActionState, useEffect } from 'react';\nimport { useSearchParams, useRouter } from 'next/navigation';\n\nfunction OlmoLogo({ className }: { className?: string }) {\n  return (\n    <svg\n      role=\"img\"\n      aria-label=\"Olmo\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      viewBox=\"0 0 225 232\"\n      className={className}\n    >\n      <path d=\"M102.3,12.2c75-6.4,129.5,63.8,108.1,135.4-23.3,77.6-124.6,98.3-176.6,36.2C-18.2,121.7,19.1,19.2,102.4,12.2h-.1ZM87.4,202.3c35.6,9.9,73.6-2.3,95.6-32.1,37.4-50.9,12.4-125.6-49.4-140.8C59.5,11.2,1.3,86.9,32.6,154.9c7.7,16.8,23.8,34.9,41.6,40.8l5.5-20.1c-20-27-17.3-63.2,7.3-86.4,11-10.3,38.6-24.9,53.1-28.9s8.1-.9,10.4,3.2,6.5,23.1,7.4,28.4c4,22.6,2.1,44.6-13,62.8-13.1,15.8-31,22.5-50.8,25.5l-6.6,22.1h0ZM139.2,77c-33.7,10.7-72,38.9-54.1,79.1l11-20.1c4.1-4.6,12.6-23.1,17.7-24.7,6.3-2,10.9,3.5,8.7,9.7s-11.8,18.1-15.5,25.1-9,17.8-8.3,18.5c43-8.8,54.8-49.5,40.5-87.6h0Z\" />\n    </svg>\n  );\n}\n\ntype StageLoginState = {\n  error?: 'missing_config' | 'invalid_credentials' | null;\n  redirectTo?: string | null;\n};\n\ntype StageLoginAction = (prev: StageLoginState, formData: FormData) => Promise<StageLoginState>;\n\nexport type StageLoginProps = {\n  action: StageLoginAction;\n  title?: string;\n  description?: string;\n  usernameLabel?: string;\n  passwordLabel?: string;\n  submitLabel?: string;\n  invalidCredentialsMessage?: string;\n  missingConfigMessage?: string;\n};\n\nexport function StageLoginOLD({\n  action,\n  title = 'Staging access',\n  description = 'This environment is restricted. Please sign in to continue.',\n  usernameLabel = 'Username',\n  passwordLabel = 'Password',\n  submitLabel = 'Sign in',\n  invalidCredentialsMessage = 'Invalid username or password.',\n  missingConfigMessage = 'Stage authentication is not configured.',\n}: StageLoginProps) {\n  const params = useSearchParams();\n  const from = params.get('from') ?? '/';\n  const [state, formAction, pending] = useActionState<StageLoginState, FormData>(action, {});\n\n  const errorMessage =\n    state.error === 'invalid_credentials'\n      ? invalidCredentialsMessage\n      : state.error === 'missing_config'\n        ? missingConfigMessage\n        : null;\n\n  return (\n    <main className=\"flex min-h-screen items-center justify-center bg-neutral-50 px-4 py-12\">\n      <form\n        action={formAction}\n        className=\"relative w-full max-w-md space-y-5 rounded-lg border border-neutral-200 bg-white p-8 shadow-sm\"\n      >\n        <div className=\"w-full min-w-[200px]\">\n          <header className=\"space-y-1 text-center\">\n            <h1 className=\"text-xl font-semibold text-neutral-900\">{title}</h1>\n            <p className=\"text-sm text-neutral-600\">{description}</p>\n          </header>\n\n          <input type=\"hidden\" name=\"from\" value={from} />\n\n          <label className=\"block space-y-1\">\n            <span className=\"text-sm font-medium text-neutral-800\">{usernameLabel}</span>\n            <input\n              name=\"username\"\n              type=\"text\"\n              autoComplete=\"username\"\n              required\n              disabled={pending}\n              className=\"w-full rounded border border-neutral-300 px-3 py-2 text-sm outline-none focus:border-neutral-900\"\n            />\n          </label>\n\n          <label className=\"block space-y-1\">\n            <span className=\"text-sm font-medium text-neutral-800\">{passwordLabel}</span>\n            <input\n              name=\"password\"\n              type=\"password\"\n              autoComplete=\"current-password\"\n              required\n              disabled={pending}\n              className=\"w-full rounded border border-neutral-300 px-3 py-2 text-sm outline-none focus:border-neutral-900\"\n            />\n          </label>\n\n          {errorMessage ? (\n            <p role=\"alert\" className=\"text-sm text-red-600\">\n              {errorMessage}\n            </p>\n          ) : null}\n\n          <button\n            type=\"submit\"\n            disabled={pending}\n            className=\"w-full rounded bg-neutral-900 px-4 py-2 text-sm font-medium text-white transition hover:bg-neutral-800 disabled:opacity-60\"\n          >\n            {pending ? '…' : submitLabel}\n          </button>\n        </div>\n      </form>\n    </main>\n  );\n}\n\n\nexport function StageLogin({\n  action,\n  title = 'Olmo Staging access',\n  description = 'This environment is restricted. Please sign in to continue.',\n  usernameLabel = 'Username',\n  passwordLabel = 'Password',\n  submitLabel = 'Sign in',\n  invalidCredentialsMessage = 'Invalid username or password.',\n  missingConfigMessage = 'Stage authentication is not configured.',  \n}: StageLoginProps) {\n  \n  const params = useSearchParams();\n  const router = useRouter();\n  const from = params.get('from') ?? '/';\n  const [state, formAction, pending] = useActionState<StageLoginState, FormData>(action, {});\n\n  // Once the action returns a redirect target the cookie is already in the\n  // browser's jar (it shipped as Set-Cookie on the action response). Only\n  // then do we navigate, so the next GET carries the session and middleware\n  // doesn't bounce the user back to login.\n  useEffect(() => {\n    if (state.redirectTo) router.replace(state.redirectTo);\n  }, [state.redirectTo, router]);\n\n  const errorMessage =\n    state.error === 'invalid_credentials'\n      ? invalidCredentialsMessage\n      : state.error === 'missing_config'\n        ? missingConfigMessage\n        : null;\n\n  return (\n    <>\n      <div className=\"flex min-h-full flex-col justify-center px-6 py-12 lg:px-8\">\n        <div className=\"sm:mx-auto sm:w-full sm:max-w-[384px]\">\n          <OlmoLogo className=\"mx-auto h-10 w-auto \" />\n          {/* <h2 className=\"mt-10 text-center text-2xl/9 font-bold tracking-tight text-gray-900\">\n            Sign in to your account\n          </h2> */}\n          <header className=\"space-y-1\">\n            <h1 className=\"text-xl text-center font-semibold text-neutral-900\">{title}</h1>\n            <p className=\"text-sm text-center text-neutral-600\">{description}</p>\n          </header>          \n        </div>\n\n        <div className=\"mt-10 sm:mx-auto sm:w-full sm:max-w-[384px]\">\n          <form action={formAction} method=\"POST\" className=\"space-y-6\">\n            <input type=\"hidden\" name=\"from\" value={from} />\n            <div>\n              <label htmlFor=\"username\" className=\"block text-sm/6 font-medium text-gray-900\">\n                {usernameLabel}\n              </label>\n              <div className=\"mt-2\">\n                <input\n                  id=\"username\"\n                  name=\"username\"\n                  type=\"username\"\n                  disabled={pending}\n                  required\n                  autoComplete=\"username\"\n                  className=\"block w-full rounded-md bg-white px-3 py-1.5 text-base text-gray-900 outline-1 -outline-offset-1 outline-gray-300 placeholder:text-gray-400 focus:outline-2 focus:-outline-offset-2 focus:outline-black sm:text-sm/6\"\n                />\n              </div>\n            </div>\n\n            <div>\n              <div className=\"flex items-center justify-between\">\n                <label htmlFor=\"password\" className=\"block text-sm/6 font-medium text-gray-900\">\n                  {passwordLabel}\n                </label>\n              </div>\n              <div className=\"mt-2\">\n                <input\n                  id=\"password\"\n                  name=\"password\"\n                  type=\"password\"\n                  disabled={pending}\n                  required\n                  autoComplete=\"current-password\"\n                  className=\"block w-full rounded-md bg-white px-3 py-1.5 text-base text-gray-900 outline-1 -outline-offset-1 outline-gray-300 placeholder:text-gray-400 focus:outline-2 focus:-outline-offset-2 focus:outline-black sm:text-sm/6\"\n                />\n              </div>\n            </div>\n\n            <div>\n              {errorMessage ? (\n                <p role=\"alert\" className=\"text-sm text-red-600\">\n                  {errorMessage}\n                </p>\n              ) : null}              \n              <button\n                type=\"submit\"\n                disabled={pending}\n                className=\"cursor-pointer flex w-full justify-center rounded-md bg-black px-3 py-1.5 text-sm/6 font-semibold text-white shadow-xs hover:bg-black focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-black\"\n              >\n                {pending ? '…' : submitLabel}\n              </button>\n            </div>\n          </form>\n\n        </div>\n      </div>\n    </>\n  )\n}\n"],"mappings":"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","names":["jsx","useEffect","jsx","useEffect","Fragment","jsx","useEffect","jsx","Fragment"]}

package/dist/index.cjs

@@ -24,6 +24,7 @@ __export(src_exports, {
   JsonLd: () => JsonLd,
   RouteProvider: () => RouteProvider,
   RouteSetter: () => RouteSetter,
+  StageLogin: () => StageLogin,
   buildArticle: () => buildArticle,
   buildBreadcrumb: () => buildBreadcrumb,
   buildItemList: () => buildItemList,
@@ -38,6 +39,7 @@ __export(src_exports, {
   posting: () => posting,
   redirectmiddleware: () => redirectmiddleware,
   setSeoData: () => setSeoData,
+  stagegatemiddleware: () => stagegatemiddleware,
   useRoute: () => useRoute
 });
 module.exports = __toCommonJS(src_exports);
@@ -277,6 +279,108 @@ var redirectmiddleware = (next) => {
   };
 };
 
+// src/middleware/stagegatemiddleware.ts
+var import_server4 = require("next/server");
+
+// src/auth/stage.ts
+var COOKIE_NAME = "olmo_stage_auth";
+var DEFAULT_SESSION_DAYS = 7;
+function readStageEnv() {
+  const username = process.env.OLMO_STAGE_USERNAME;
+  const password = process.env.OLMO_STAGE_PASSWORD;
+  const secret = process.env.OLMO_STAGE_SECRET;
+  if (!username || !password || !secret) return null;
+  const days = Number(process.env.OLMO_STAGE_SESSION_DAYS);
+  return {
+    username,
+    password,
+    secret,
+    sessionDays: Number.isFinite(days) && days > 0 ? days : DEFAULT_SESSION_DAYS
+  };
+}
+function getStageCookieName() {
+  return COOKIE_NAME;
+}
+function fromBase64Url(input) {
+  const pad = input.length % 4 === 0 ? "" : "=".repeat(4 - input.length % 4);
+  const b64 = input.replace(/-/g, "+").replace(/_/g, "/") + pad;
+  const bin = atob(b64);
+  const out = new Uint8Array(bin.length);
+  for (let i = 0; i < bin.length; i++) out[i] = bin.charCodeAt(i);
+  return out;
+}
+async function importKey(secret) {
+  return crypto.subtle.importKey(
+    "raw",
+    new TextEncoder().encode(secret),
+    { name: "HMAC", hash: "SHA-256" },
+    false,
+    ["sign", "verify"]
+  );
+}
+async function verifySession(token, secret) {
+  if (!token || typeof token !== "string" || token.indexOf(".") === -1) return null;
+  const [body, sig] = token.split(".");
+  if (!body || !sig) return null;
+  let key;
+  try {
+    key = await importKey(secret);
+  } catch {
+    return null;
+  }
+  let valid = false;
+  try {
+    valid = await crypto.subtle.verify("HMAC", key, fromBase64Url(sig), new TextEncoder().encode(body));
+  } catch {
+    return null;
+  }
+  if (!valid) return null;
+  let payload;
+  try {
+    payload = JSON.parse(new TextDecoder().decode(fromBase64Url(body)));
+  } catch {
+    return null;
+  }
+  if (!payload || typeof payload.exp !== "number" || payload.exp < Date.now()) return null;
+  return payload;
+}
+
+// src/middleware/stagegatemiddleware.ts
+var LOGIN_PATH = "/olmo-stage-login/";
+var NOINDEX = "noindex, nofollow, noarchive";
+function withNoindex(res) {
+  res.headers.set("X-Robots-Tag", NOINDEX);
+  return res;
+}
+var stagegatemiddleware = (next) => {
+  return async (request, _next) => {
+    if (process.env.NEXT_PUBLIC_ENV !== "stage") {
+      return next(request, _next);
+    }
+    const { pathname, search } = request.nextUrl;
+    if (pathname === LOGIN_PATH) {
+      return withNoindex(import_server4.NextResponse.next());
+    }
+    const env = readStageEnv();
+    if (!env) {
+      const url2 = request.nextUrl.clone();
+      url2.pathname = LOGIN_PATH;
+      url2.search = "";
+      return withNoindex(import_server4.NextResponse.redirect(url2, { status: 307 }));
+    }
+    const token = request.cookies.get(getStageCookieName())?.value;
+    const session = await verifySession(token, env.secret);
+    if (session) {
+      const res = await next(request, _next);
+      return withNoindex(res instanceof import_server4.NextResponse ? res : import_server4.NextResponse.next());
+    }
+    const url = request.nextUrl.clone();
+    url.pathname = LOGIN_PATH;
+    url.search = `?from=${encodeURIComponent(pathname + search)}`;
+    return withNoindex(import_server4.NextResponse.redirect(url, { status: 307 }));
+  };
+};
+
 // src/components/RouteContext.tsx
 var import_react = require("react");
 var import_jsx_runtime = require("react/jsx-runtime");
@@ -345,12 +449,104 @@ function gtmClick({ category, action, label }) {
     label: cleanLabel[cleanLabel.length - 1]
   });
 }
+
+// src/components/StageLogin.tsx
+var import_react4 = require("react");
+var import_navigation = require("next/navigation");
+var import_jsx_runtime4 = require("react/jsx-runtime");
+function OlmoLogo({ className }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+    "svg",
+    {
+      role: "img",
+      "aria-label": "Olmo",
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 225 232",
+      className,
+      children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("path", { d: "M102.3,12.2c75-6.4,129.5,63.8,108.1,135.4-23.3,77.6-124.6,98.3-176.6,36.2C-18.2,121.7,19.1,19.2,102.4,12.2h-.1ZM87.4,202.3c35.6,9.9,73.6-2.3,95.6-32.1,37.4-50.9,12.4-125.6-49.4-140.8C59.5,11.2,1.3,86.9,32.6,154.9c7.7,16.8,23.8,34.9,41.6,40.8l5.5-20.1c-20-27-17.3-63.2,7.3-86.4,11-10.3,38.6-24.9,53.1-28.9s8.1-.9,10.4,3.2,6.5,23.1,7.4,28.4c4,22.6,2.1,44.6-13,62.8-13.1,15.8-31,22.5-50.8,25.5l-6.6,22.1h0ZM139.2,77c-33.7,10.7-72,38.9-54.1,79.1l11-20.1c4.1-4.6,12.6-23.1,17.7-24.7,6.3-2,10.9,3.5,8.7,9.7s-11.8,18.1-15.5,25.1-9,17.8-8.3,18.5c43-8.8,54.8-49.5,40.5-87.6h0Z" })
+    }
+  );
+}
+function StageLogin({
+  action,
+  title = "Olmo Staging access",
+  description = "This environment is restricted. Please sign in to continue.",
+  usernameLabel = "Username",
+  passwordLabel = "Password",
+  submitLabel = "Sign in",
+  invalidCredentialsMessage = "Invalid username or password.",
+  missingConfigMessage = "Stage authentication is not configured."
+}) {
+  const params = (0, import_navigation.useSearchParams)();
+  const router = (0, import_navigation.useRouter)();
+  const from = params.get("from") ?? "/";
+  const [state, formAction, pending] = (0, import_react4.useActionState)(action, {});
+  (0, import_react4.useEffect)(() => {
+    if (state.redirectTo) router.replace(state.redirectTo);
+  }, [state.redirectTo, router]);
+  const errorMessage = state.error === "invalid_credentials" ? invalidCredentialsMessage : state.error === "missing_config" ? missingConfigMessage : null;
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_jsx_runtime4.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "flex min-h-full flex-col justify-center px-6 py-12 lg:px-8", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "sm:mx-auto sm:w-full sm:max-w-[384px]", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(OlmoLogo, { className: "mx-auto h-10 w-auto " }),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("header", { className: "space-y-1", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("h1", { className: "text-xl text-center font-semibold text-neutral-900", children: title }),
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("p", { className: "text-sm text-center text-neutral-600", children: description })
+      ] })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "mt-10 sm:mx-auto sm:w-full sm:max-w-[384px]", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("form", { action: formAction, method: "POST", className: "space-y-6", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("input", { type: "hidden", name: "from", value: from }),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("label", { htmlFor: "username", className: "block text-sm/6 font-medium text-gray-900", children: usernameLabel }),
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "mt-2", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+          "input",
+          {
+            id: "username",
+            name: "username",
+            type: "username",
+            disabled: pending,
+            required: true,
+            autoComplete: "username",
+            className: "block w-full rounded-md bg-white px-3 py-1.5 text-base text-gray-900 outline-1 -outline-offset-1 outline-gray-300 placeholder:text-gray-400 focus:outline-2 focus:-outline-offset-2 focus:outline-black sm:text-sm/6"
+          }
+        ) })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "flex items-center justify-between", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("label", { htmlFor: "password", className: "block text-sm/6 font-medium text-gray-900", children: passwordLabel }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("div", { className: "mt-2", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+          "input",
+          {
+            id: "password",
+            name: "password",
+            type: "password",
+            disabled: pending,
+            required: true,
+            autoComplete: "current-password",
+            className: "block w-full rounded-md bg-white px-3 py-1.5 text-base text-gray-900 outline-1 -outline-offset-1 outline-gray-300 placeholder:text-gray-400 focus:outline-2 focus:-outline-offset-2 focus:outline-black sm:text-sm/6"
+          }
+        ) })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { children: [
+        errorMessage ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("p", { role: "alert", className: "text-sm text-red-600", children: errorMessage }) : null,
+        /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+          "button",
+          {
+            type: "submit",
+            disabled: pending,
+            className: "cursor-pointer flex w-full justify-center rounded-md bg-black px-3 py-1.5 text-sm/6 font-semibold text-white shadow-xs hover:bg-black focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-black",
+            children: pending ? "\u2026" : submitLabel
+          }
+        )
+      ] })
+    ] }) })
+  ] }) });
+}
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   GtmPage,
   JsonLd,
   RouteProvider,
   RouteSetter,
+  StageLogin,
   buildArticle,
   buildBreadcrumb,
   buildItemList,
@@ -365,6 +561,7 @@ function gtmClick({ category, action, label }) {
   posting,
   redirectmiddleware,
   setSeoData,
+  stagegatemiddleware,
   useRoute
 });
 //# sourceMappingURL=index.cjs.map