@owlmeans/web-panel 0.1.18-rc.2 → 0.1.18-rc.21

package/build/consent/component.d.ts

@@ -0,0 +1,11 @@
+import type { FC } from 'react';
+import type { CookieConsentProps, CookiePolicyProps } from '@owlmeans/web-consent';
+/**
+ * The consent dialog, bound to this application's language and translations.
+ *
+ * `@owlmeans/web-consent` deliberately knows nothing about OwlMeans i18n — one of its consumers is
+ * an Astro site with none — so this is where the two meet.
+ */
+export declare const PanelCookieConsent: FC<CookieConsentProps>;
+export declare const PanelCookiePolicy: FC<CookiePolicyProps>;
+//# sourceMappingURL=component.d.ts.map

package/build/consent/component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"component.d.ts","sourceRoot":"","sources":["../../src/consent/component.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,OAAO,CAAA;AAE/B,OAAO,KAAK,EAAE,kBAAkB,EAAE,iBAAiB,EAAiB,MAAM,uBAAuB,CAAA;AA6BjG;;;;;GAKG;AACH,eAAO,MAAM,kBAAkB,EAAE,EAAE,CAAC,kBAAkB,CAMrD,CAAA;AAED,eAAO,MAAM,iBAAiB,EAAE,EAAE,CAAC,iBAAiB,CAMnD,CAAA"}

package/build/consent/component.js

@@ -0,0 +1,53 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useCallback } from 'react';
+import { CookieConsent, CookiePolicy, defaultConsentTranslate } from '@owlmeans/web-consent';
+import { useI18nLib, useLanguage } from '@owlmeans/client-i18n';
+import { SUPPORTED_LNGS } from '@owlmeans/i18n';
+/**
+ * Resolve consent copy through the application first, and the packaged bundle second.
+ *
+ * The chain matters. `@owlmeans/web-consent` takes `translate` as a prop and, once given one,
+ * stops consulting its own translations — so a wrapper that forwarded the framework resolver
+ * alone would render the ENGLISH default for every key the application had not overridden, in
+ * every language. Falling through to the packaged bundle for the current locale means an
+ * application overrides what it wants to and inherits seven languages for the rest.
+ */
+const useConsentTranslate = (locale, override) => {
+    const t = useI18nLib('consent');
+    return useCallback((key, defaultValue) => {
+        if (override != null) {
+            return override(key, defaultValue);
+        }
+        const packaged = defaultConsentTranslate(locale)(key, defaultValue);
+        // `t` answers with whatever it is given when the key is unknown, so the packaged string is
+        // what it is given — an application's override wins, and everything else stays translated.
+        return t(key, { defaultValue: packaged });
+    }, [t, locale, override]);
+};
+/**
+ * The consent dialog, bound to this application's language and translations.
+ *
+ * `@owlmeans/web-consent` deliberately knows nothing about OwlMeans i18n — one of its consumers is
+ * an Astro site with none — so this is where the two meet.
+ */
+export const PanelCookieConsent = props => {
+    const [lng] = useLanguage();
+    const locale = props.locale ?? lng;
+    const translate = useConsentTranslate(locale, props.translate);
+    return _jsx(CookieConsent, { ...props, locale: locale, translate: translate });
+};
+export const PanelCookiePolicy = props => {
+    const [lng] = useLanguage();
+    const locale = props.locale ?? lng;
+    const translate = useConsentTranslate(locale, props.translate);
+    return _jsx(CookiePolicy, { ...props, locale: locale, translate: translate });
+};
+/**
+ * The consent package carries its own locale list because it must build with no dependency on the
+ * i18n package at all. This assertion is what keeps the two from drifting: a language added to the
+ * framework and not to the bundle fails here, at build time, rather than as a dialog rendering
+ * English to the one reader who cannot report it.
+ */
+const _localeParity = SUPPORTED_LNGS;
+void _localeParity;
+//# sourceMappingURL=component.js.map

package/build/consent/component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"component.js","sourceRoot":"","sources":["../../src/consent/component.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,OAAO,CAAA;AAEnC,OAAO,EAAE,aAAa,EAAE,YAAY,EAAE,uBAAuB,EAAE,MAAM,uBAAuB,CAAA;AAE5F,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAA;AAC/D,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAA;AAE/C;;;;;;;;GAQG;AACH,MAAM,mBAAmB,GAAG,CAC1B,MAAc,EAAE,QAAwD,EACvB,EAAE;IACnD,MAAM,CAAC,GAAG,UAAU,CAAC,SAAS,CAAC,CAAA;IAE/B,OAAO,WAAW,CAAC,CAAC,GAAW,EAAE,YAAoB,EAAE,EAAE;QACvD,IAAI,QAAQ,IAAI,IAAI,EAAE,CAAC;YACrB,OAAO,QAAQ,CAAC,GAAG,EAAE,YAAY,CAAC,CAAA;QACpC,CAAC;QACD,MAAM,QAAQ,GAAG,uBAAuB,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,YAAY,CAAC,CAAA;QACnE,2FAA2F;QAC3F,2FAA2F;QAC3F,OAAO,CAAC,CAAC,GAAG,EAAE,EAAE,YAAY,EAAE,QAAQ,EAAE,CAAC,CAAA;IAC3C,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,EAAE,QAAQ,CAAC,CAAC,CAAA;AAC3B,CAAC,CAAA;AAED;;;;;GAKG;AACH,MAAM,CAAC,MAAM,kBAAkB,GAA2B,KAAK,CAAC,EAAE;IAChE,MAAM,CAAC,GAAG,CAAC,GAAG,WAAW,EAAE,CAAA;IAC3B,MAAM,MAAM,GAAG,KAAK,CAAC,MAAM,IAAI,GAAG,CAAA;IAClC,MAAM,SAAS,GAAG,mBAAmB,CAAC,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC,CAAA;IAE9D,OAAO,KAAC,aAAa,OAAK,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,SAAS,GAAI,CAAA;AAC3E,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,iBAAiB,GAA0B,KAAK,CAAC,EAAE;IAC9D,MAAM,CAAC,GAAG,CAAC,GAAG,WAAW,EAAE,CAAA;IAC3B,MAAM,MAAM,GAAG,KAAK,CAAC,MAAM,IAAI,GAAG,CAAA;IAClC,MAAM,SAAS,GAAG,mBAAmB,CAAC,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC,CAAA;IAE9D,OAAO,KAAC,YAAY,OAAK,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,SAAS,GAAI,CAAA;AAC1E,CAAC,CAAA;AAED;;;;;GAKG;AACH,MAAM,aAAa,GAA6B,cAA0C,CAAA;AAC1F,KAAK,aAAa,CAAA"}

package/build/consent/index.d.ts

@@ -0,0 +1,4 @@
+export * from './component.js';
+export { useConsent, useConsentCategory, consentStore, openConsent, isConsented, readConsent, writeConsent, clearConsent, DEFAULT_CONSENT_CATEGORIES, CONSENT_KEY, CONSENT_ESSENTIAL, CONSENT_ANALYTICS, CONSENT_MARKETING, consentBootstrapScript, } from '@owlmeans/web-consent';
+export type { ConsentCategory, ConsentOptions, ConsentRecord, ConsentSignal, ConsentState, CookieConsentProps, CookiePolicyProps, } from '@owlmeans/web-consent';
+//# sourceMappingURL=index.d.ts.map

package/build/consent/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/consent/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAA;AAC9B,OAAO,EACL,UAAU,EAAE,kBAAkB,EAAE,YAAY,EAAE,WAAW,EAAE,WAAW,EACtE,WAAW,EAAE,YAAY,EAAE,YAAY,EAAE,0BAA0B,EACnE,WAAW,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,iBAAiB,EACpE,sBAAsB,GACvB,MAAM,uBAAuB,CAAA;AAC9B,YAAY,EACV,eAAe,EAAE,cAAc,EAAE,aAAa,EAAE,aAAa,EAAE,YAAY,EAC3E,kBAAkB,EAAE,iBAAiB,GACtC,MAAM,uBAAuB,CAAA"}

package/build/consent/index.js

@@ -0,0 +1,3 @@
+export * from './component.js';
+export { useConsent, useConsentCategory, consentStore, openConsent, isConsented, readConsent, writeConsent, clearConsent, DEFAULT_CONSENT_CATEGORIES, CONSENT_KEY, CONSENT_ESSENTIAL, CONSENT_ANALYTICS, CONSENT_MARKETING, consentBootstrapScript, } from '@owlmeans/web-consent';
+//# sourceMappingURL=index.js.map

package/build/consent/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/consent/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAA;AAC9B,OAAO,EACL,UAAU,EAAE,kBAAkB,EAAE,YAAY,EAAE,WAAW,EAAE,WAAW,EACtE,WAAW,EAAE,YAAY,EAAE,YAAY,EAAE,0BAA0B,EACnE,WAAW,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,iBAAiB,EACpE,sBAAsB,GACvB,MAAM,uBAAuB,CAAA"}

package/build/context.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../src/context.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAG,UAAU,EAAE,MAAM,YAAY,CAAA;AAIxD,eAAO,MAAM,WAAW,GAAI,CAAC,SAAS,SAAS,EAAE,CAAC,SAAS,UAAU,CAAC,CAAC,CAAC,OAAO,CAAC,KAAG,CASlF,CAAA;AAED,eAAO,MAAM,UAAU,GAAI,CAAC,SAAS,SAAS,GAAG,SAAS,EAAC,CAAC,SAAS,UAAU,CAAC,CAAC,CAAC,GAAG,UAAU,CAAC,CAAC,CAAC,QACnF,CAAA"}
+{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../src/context.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAG,UAAU,EAAE,MAAM,YAAY,CAAA;AAKxD,eAAO,MAAM,WAAW,GAAI,CAAC,SAAS,SAAS,EAAE,CAAC,SAAS,UAAU,CAAC,CAAC,CAAC,OAAO,CAAC,KAAG,CAalF,CAAA;AAED,eAAO,MAAM,UAAU,GAAI,CAAC,SAAS,SAAS,GAAG,SAAS,EAAC,CAAC,SAAS,UAAU,CAAC,CAAC,CAAC,GAAG,UAAU,CAAC,CAAC,CAAC,QACnF,CAAA"}

package/build/context.js

@@ -1,11 +1,15 @@
 import { appendFlowService } from '@owlmeans/web-flow';
 import { makeContext as makeClientContext, useContext as useCtx } from '@owlmeans/web-client';
 import { apiConfigMiddleware } from '@owlmeans/api-config-client';
+import { appendLoginScreen } from './components/login/append.js';
 export const makeContext = (cfg) => {
     const context = makeClientContext(cfg);
     context.registerMiddleware(apiConfigMiddleware);
     appendFlowService(context);
     context.flow = () => context.service('flow');
+    // Every app on this package gets the shadcn sign-in screen with no wiring of its own; one that
+    // wants its logo on it calls `appendLoginScreen` again, which is idempotent.
+    appendLoginScreen(context);
     return context;
 };
 export const useContext = () => useCtx();

package/build/context.js.map

@@ -1 +1 @@
-{"version":3,"file":"context.js","sourceRoot":"","sources":["../src/context.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAA;AAEtD,OAAO,EAAE,WAAW,IAAI,iBAAiB,EAAE,UAAU,IAAI,MAAM,EAAE,MAAM,sBAAsB,CAAA;AAC7F,OAAO,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAA;AAEjE,MAAM,CAAC,MAAM,WAAW,GAAG,CAA+C,GAAM,EAAK,EAAE;IACrF,MAAM,OAAO,GAAG,iBAAiB,CAAC,GAAG,CAAM,CAAA;IAE3C,OAAO,CAAC,kBAAkB,CAAC,mBAAmB,CAAC,CAAA;IAE/C,iBAAiB,CAAO,OAAO,CAAC,CAAA;IAChC,OAAO,CAAC,IAAI,GAAG,GAAG,EAAE,CAAC,OAAO,CAAC,OAAO,CAAC,MAAM,CAAC,CAAA;IAE5C,OAAO,OAAO,CAAA;AAChB,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,UAAU,GAAG,GAA4E,EAAE,CACtG,MAAM,EAAO,CAAA"}
+{"version":3,"file":"context.js","sourceRoot":"","sources":["../src/context.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAA;AAEtD,OAAO,EAAE,WAAW,IAAI,iBAAiB,EAAE,UAAU,IAAI,MAAM,EAAE,MAAM,sBAAsB,CAAA;AAC7F,OAAO,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAA;AACjE,OAAO,EAAE,iBAAiB,EAAE,MAAM,8BAA8B,CAAA;AAEhE,MAAM,CAAC,MAAM,WAAW,GAAG,CAA+C,GAAM,EAAK,EAAE;IACrF,MAAM,OAAO,GAAG,iBAAiB,CAAC,GAAG,CAAM,CAAA;IAE3C,OAAO,CAAC,kBAAkB,CAAC,mBAAmB,CAAC,CAAA;IAE/C,iBAAiB,CAAO,OAAO,CAAC,CAAA;IAChC,OAAO,CAAC,IAAI,GAAG,GAAG,EAAE,CAAC,OAAO,CAAC,OAAO,CAAC,MAAM,CAAC,CAAA;IAE5C,+FAA+F;IAC/F,6EAA6E;IAC7E,iBAAiB,CAAO,OAAO,CAAC,CAAA;IAEhC,OAAO,OAAO,CAAA;AAChB,CAAC,CAAA;AAED,MAAM,CAAC,MAAM,UAAU,GAAG,GAA4E,EAAE,CACtG,MAAM,EAAO,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@owlmeans/web-panel",
-  "version": "0.1.18-rc.2",
+  "version": "0.1.18-rc.21",
   "license": "MIT",
   "type": "module",
   "scripts": {
@@ -33,40 +33,50 @@
       "default": "./build/auth/modules.js",
       "module": "./build/auth/modules.js",
       "types": "./build/auth/modules.d.ts"
+    },
+    "./consent": {
+      "import": "./build/consent/index.js",
+      "require": "./build/consent/index.js",
+      "default": "./build/consent/index.js",
+      "module": "./build/consent/index.js",
+      "types": "./build/consent/index.d.ts"
     }
   },
   "dependencies": {
     "@hookform/resolvers": "^5.2.2",
-    "@owlmeans/api-config-client": "^0.1.18-rc.2",
-    "@owlmeans/auth": "^0.1.18-rc.2",
-    "@owlmeans/auth-common": "^0.1.18-rc.2",
-    "@owlmeans/basic-envelope": "^0.1.18-rc.2",
-    "@owlmeans/client": "^0.1.18-rc.2",
-    "@owlmeans/client-auth": "^0.1.18-rc.2",
-    "@owlmeans/client-config": "^0.1.18-rc.2",
-    "@owlmeans/client-context": "^0.1.18-rc.2",
-    "@owlmeans/client-flow": "^0.1.18-rc.2",
-    "@owlmeans/client-i18n": "^0.1.18-rc.2",
-    "@owlmeans/client-entrypoint": "^0.1.18-rc.2",
-    "@owlmeans/client-panel": "^0.1.18-rc.2",
-    "@owlmeans/client-route": "^0.1.18-rc.2",
-    "@owlmeans/config": "^0.1.18-rc.2",
-    "@owlmeans/context": "^0.1.18-rc.2",
-    "@owlmeans/error": "^0.1.18-rc.2",
-    "@owlmeans/flow": "^0.1.18-rc.2",
-    "@owlmeans/i18n": "^0.1.18-rc.2",
-    "@owlmeans/entrypoint": "^0.1.18-rc.2",
-    "@owlmeans/route": "^0.1.18-rc.2",
-    "@owlmeans/web-client": "^0.1.18-rc.2",
-    "@owlmeans/web-db": "^0.1.18-rc.2",
-    "@owlmeans/web-flow": "^0.1.18-rc.2",
-    "@owlmeans/web-router": "^0.1.18-rc.2",
+    "@owlmeans/api-config-client": "^0.1.18-rc.9",
+    "@owlmeans/auth": "^0.1.18-rc.7",
+    "@owlmeans/auth-common": "^0.1.18-rc.9",
+    "@owlmeans/basic-envelope": "^0.1.18-rc.9",
+    "@owlmeans/client": "^0.1.18-rc.11",
+    "@owlmeans/client-auth": "^0.1.18-rc.13",
+    "@owlmeans/client-config": "^0.1.18-rc.8",
+    "@owlmeans/client-context": "^0.1.18-rc.9",
+    "@owlmeans/client-entrypoint": "^0.1.18-rc.9",
+    "@owlmeans/client-flow": "^0.1.18-rc.12",
+    "@owlmeans/client-i18n": "^0.1.18-rc.10",
+    "@owlmeans/client-panel": "^0.1.18-rc.17",
+    "@owlmeans/client-route": "^0.1.18-rc.9",
+    "@owlmeans/config": "^0.1.18-rc.8",
+    "@owlmeans/context": "^0.1.18-rc.6",
+    "@owlmeans/entrypoint": "^0.1.18-rc.8",
+    "@owlmeans/error": "^0.1.18-rc.6",
+    "@owlmeans/flow": "^0.1.18-rc.10",
+    "@owlmeans/i18n": "^0.1.18-rc.6",
+    "@owlmeans/route": "^0.1.18-rc.6",
+    "@owlmeans/web-client": "^0.1.18-rc.15",
+    "@owlmeans/web-consent": "^0.1.18-rc.3",
+    "@owlmeans/web-db": "^0.1.18-rc.10",
+    "@owlmeans/web-flow": "^0.1.18-rc.12",
+    "@owlmeans/web-router": "^0.1.18-rc.9",
     "i18next-browser-languagedetector": "^8.0.0",
     "qrcode.react": "^4.2.0",
-    "react-google-recaptcha": "^3.1.0"
+    "react-google-recaptcha": "^3.1.0",
+    "sonner": "^2.0.7"
   },
   "peerDependencies": {
     "@radix-ui/react-label": "*",
+    "@radix-ui/react-navigation-menu": "*",
     "@radix-ui/react-progress": "*",
     "@radix-ui/react-separator": "*",
     "@radix-ui/react-slot": "*",
@@ -82,8 +92,9 @@
   },
   "devDependencies": {
     "@owlmeans/dep-config": "workspace:*",
-    "@owlmeans/test-ui": "^0.1.18-rc.2",
+    "@owlmeans/test-ui": "^0.1.18-rc.9",
     "@radix-ui/react-label": "^2.1.0",
+    "@radix-ui/react-navigation-menu": "^1.2.14",
     "@radix-ui/react-progress": "^1.1.0",
     "@radix-ui/react-separator": "^1.1.0",
     "@radix-ui/react-slot": "^1.1.0",

package/src/@/components/ui/navigation-menu.tsx

@@ -0,0 +1,169 @@
+// shadcn navigation-menu — sourced from shadcn/ui (new-york) 2026-08-24
+import * as React from "react"
+import * as NavigationMenuPrimitive from "@radix-ui/react-navigation-menu"
+import { cva } from "class-variance-authority"
+import { ChevronDownIcon } from "lucide-react"
+
+import { cn } from "@/lib/utils"
+
+function NavigationMenu({
+  className,
+  children,
+  viewport = true,
+  ...props
+}: React.ComponentProps<typeof NavigationMenuPrimitive.Root> & {
+  viewport?: boolean
+}) {
+  return (
+    <NavigationMenuPrimitive.Root
+      data-slot="navigation-menu"
+      data-viewport={viewport}
+      className={cn(
+        "group/navigation-menu relative flex max-w-max flex-1 items-center justify-center",
+        className
+      )}
+      {...props}
+    >
+      {children}
+      {viewport && <NavigationMenuViewport />}
+    </NavigationMenuPrimitive.Root>
+  )
+}
+
+function NavigationMenuList({
+  className,
+  ...props
+}: React.ComponentProps<typeof NavigationMenuPrimitive.List>) {
+  return (
+    <NavigationMenuPrimitive.List
+      data-slot="navigation-menu-list"
+      className={cn(
+        "group flex flex-1 list-none items-center justify-center gap-1",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function NavigationMenuItem({
+  className,
+  ...props
+}: React.ComponentProps<typeof NavigationMenuPrimitive.Item>) {
+  return (
+    <NavigationMenuPrimitive.Item
+      data-slot="navigation-menu-item"
+      className={cn("relative", className)}
+      {...props}
+    />
+  )
+}
+
+const navigationMenuTriggerStyle = cva(
+  "group inline-flex h-9 w-max items-center justify-center rounded-md bg-background px-4 py-2 text-sm font-medium hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground disabled:pointer-events-none disabled:opacity-50 data-[state=open]:hover:bg-accent data-[state=open]:text-accent-foreground data-[state=open]:focus:bg-accent data-[state=open]:bg-accent/50 focus-visible:ring-ring/50 outline-none transition-[color,box-shadow] focus-visible:ring-[3px] focus-visible:outline-1"
+)
+
+function NavigationMenuTrigger({
+  className,
+  children,
+  ...props
+}: React.ComponentProps<typeof NavigationMenuPrimitive.Trigger>) {
+  return (
+    <NavigationMenuPrimitive.Trigger
+      data-slot="navigation-menu-trigger"
+      className={cn(navigationMenuTriggerStyle(), "group", className)}
+      {...props}
+    >
+      {children}{" "}
+      <ChevronDownIcon
+        className="relative top-[1px] ml-1 size-3 transition duration-300 group-data-[state=open]:rotate-180"
+        aria-hidden="true"
+      />
+    </NavigationMenuPrimitive.Trigger>
+  )
+}
+
+function NavigationMenuContent({
+  className,
+  ...props
+}: React.ComponentProps<typeof NavigationMenuPrimitive.Content>) {
+  return (
+    <NavigationMenuPrimitive.Content
+      data-slot="navigation-menu-content"
+      className={cn(
+        "data-[motion^=from-]:animate-in data-[motion^=to-]:animate-out data-[motion^=from-]:fade-in data-[motion^=to-]:fade-out data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 top-0 left-0 w-full p-2 pr-2.5 md:absolute md:w-auto",
+        "group-data-[viewport=false]/navigation-menu:bg-popover group-data-[viewport=false]/navigation-menu:text-popover-foreground group-data-[viewport=false]/navigation-menu:data-[state=open]:animate-in group-data-[viewport=false]/navigation-menu:data-[state=closed]:animate-out group-data-[viewport=false]/navigation-menu:data-[state=closed]:zoom-out-95 group-data-[viewport=false]/navigation-menu:data-[state=open]:zoom-in-95 group-data-[viewport=false]/navigation-menu:data-[state=open]:fade-in-0 group-data-[viewport=false]/navigation-menu:data-[state=closed]:fade-out-0 group-data-[viewport=false]/navigation-menu:top-full group-data-[viewport=false]/navigation-menu:mt-1.5 group-data-[viewport=false]/navigation-menu:overflow-hidden group-data-[viewport=false]/navigation-menu:rounded-md group-data-[viewport=false]/navigation-menu:border group-data-[viewport=false]/navigation-menu:shadow group-data-[viewport=false]/navigation-menu:duration-200 **:data-[slot=navigation-menu-link]:focus:ring-0 **:data-[slot=navigation-menu-link]:focus:outline-none",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function NavigationMenuViewport({
+  className,
+  ...props
+}: React.ComponentProps<typeof NavigationMenuPrimitive.Viewport>) {
+  return (
+    <div
+      className={cn(
+        "absolute top-full left-0 isolate z-50 flex justify-center"
+      )}
+    >
+      <NavigationMenuPrimitive.Viewport
+        data-slot="navigation-menu-viewport"
+        className={cn(
+          "origin-top-center bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-90 relative mt-1.5 h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-md border shadow md:w-[var(--radix-navigation-menu-viewport-width)]",
+          className
+        )}
+        {...props}
+      />
+    </div>
+  )
+}
+
+function NavigationMenuLink({
+  className,
+  ...props
+}: React.ComponentProps<typeof NavigationMenuPrimitive.Link>) {
+  return (
+    <NavigationMenuPrimitive.Link
+      data-slot="navigation-menu-link"
+      className={cn(
+        "data-[active=true]:focus:bg-accent data-[active=true]:hover:bg-accent data-[active=true]:bg-accent/50 data-[active=true]:text-accent-foreground hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus-visible:ring-ring/50 [&_svg:not([class*='text-'])]:text-muted-foreground flex flex-col gap-1 rounded-sm p-2 text-sm transition-all outline-none focus-visible:ring-[3px] focus-visible:outline-1 [&_svg:not([class*='size-'])]:size-4",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function NavigationMenuIndicator({
+  className,
+  ...props
+}: React.ComponentProps<typeof NavigationMenuPrimitive.Indicator>) {
+  return (
+    <NavigationMenuPrimitive.Indicator
+      data-slot="navigation-menu-indicator"
+      className={cn(
+        "data-[state=visible]:animate-in data-[state=hidden]:animate-out data-[state=hidden]:fade-out data-[state=visible]:fade-in top-full z-[1] flex h-1.5 items-end justify-center overflow-hidden",
+        className
+      )}
+      {...props}
+    >
+      <div className="bg-border relative top-[60%] h-2 w-2 rotate-45 rounded-tl-sm shadow-md" />
+    </NavigationMenuPrimitive.Indicator>
+  )
+}
+
+export {
+  NavigationMenu,
+  NavigationMenuList,
+  NavigationMenuItem,
+  NavigationMenuContent,
+  NavigationMenuTrigger,
+  NavigationMenuLink,
+  NavigationMenuIndicator,
+  NavigationMenuViewport,
+  navigationMenuTriggerStyle,
+}

package/src/auth/plugins/basic-ed25519.tsx

@@ -37,7 +37,7 @@ export const Ed22519BasicAuthUIPlugin: AuthenticationRenderer = ({ type, stage,
 
 const createSubmit = (context: AppContext, control: AuthenticationControl) => async (data: FormData) => {
   const token = await control.authenticate({
-    entityId: data.entityId,
+    entitySlug: data.entityId,
     userId: data.address,
     credential: data.privateKey
   })

package/src/components/footer/component.tsx

@@ -0,0 +1,37 @@
+import type { FC } from 'react'
+import { defaultNavTranslate, resolveNavLabel } from '@owlmeans/client-panel'
+import { cn } from '@/lib/utils'
+import { Link } from '../link.js'
+
+import type { FooterProps } from './types.js'
+
+/**
+ * The standard footer — a row of links plus whatever the app adds as children.
+ *
+ * Labels are resolved HERE and handed to `Link` as children: `Link`'s own default label
+ * looks up `modules.<alias>` with no fallback, so an app without i18n would print the raw
+ * key. Resolving first means a literal label, a translation, or a humanized alias — never
+ * a key.
+ */
+export const Footer: FC<FooterProps> = ({
+  links, translate = defaultNavTranslate, children, className, style, containerClassName
+}) => {
+  if ((links == null || links.length < 1) && children == null) {
+    return null
+  }
+
+  return <footer className={cn('border-t py-6', className)} style={style}>
+    <div className={cn('flex flex-wrap items-center gap-4 text-sm px-4', containerClassName)}>
+      {links?.map((link, idx) => {
+        const label = resolveNavLabel(
+          translate, link.label, `modules.${link.alias ?? link.href ?? ''}`, link.alias ?? link.href
+        )
+
+        return link.href != null
+          ? <Link key={`${link.href}:${idx}`} src={link.href} open={link.open}>{label}</Link>
+          : <Link key={`${link.alias}:${idx}`} module={link.alias} open={link.open}>{label}</Link>
+      })}
+      {children}
+    </div>
+  </footer>
+}

package/src/components/footer/index.ts

@@ -0,0 +1,3 @@
+export type * from './types.js'
+
+export * from './component.js'

package/src/components/footer/types.ts

@@ -0,0 +1,11 @@
+import type { PropsWithChildren } from 'react'
+import type { NavTranslate, PanelNavLink } from '@owlmeans/client-panel'
+import type { StyledProps } from '../types.js'
+
+export interface FooterProps extends PropsWithChildren<StyledProps> {
+  links?: PanelNavLink[]
+  /** The shell's horizontal rhythm, so the footer row lines up with the header and the content. */
+  containerClassName?: string
+  /** See {@link NavTranslate} — omitted, literal labels and humanized aliases are used. */
+  translate?: NavTranslate
+}

package/src/components/index.ts

@@ -2,6 +2,9 @@ export type * from './types.js'
 
 export * from './panel-app/index.js'
 export * from './layout/index.js'
+export * from './nav/index.js'
+export * from './footer/index.js'
+export * from './login/index.js'
 
 export * from './form/index.js'
 export * from './form/text/index.js'
@@ -15,3 +18,4 @@ export * from './text.js'
 export * from './link.js'
 export * from './helper.js'
 export * from './status.js'
+export * from './toaster.js'

package/src/components/login/append.ts

@@ -0,0 +1,34 @@
+import type { ComponentType, ReactNode } from 'react'
+import { ensureLoginService } from '@owlmeans/client-auth/login'
+import type { LoginScreenProps } from '@owlmeans/client-auth/login'
+import type { BasicConfig, BasicContext } from '@owlmeans/context'
+import { LocalizedLoginScreen } from './screen.js'
+
+export interface LoginScreenSetup extends Omit<LoginScreenProps, 'translate'> {
+  /** The one thing an application is expected to supply. */
+  Logo?: ComponentType<{ className?: string }> | ReactNode
+}
+
+/**
+ * Give this context the shadcn sign-in screen, with the application's own logo and copy on it.
+ *
+ * Registered on the login SERVICE rather than imported by a dispatcher, because a relying party
+ * (`web-oidc-rp`, `mui-oidc-rp`) must never depend on a UI family — that edge would make every
+ * relying party pick one, and there are two. The dispatcher asks `login().screen()` and falls back
+ * to the plain screen `@owlmeans/client-auth` ships, so an app that never calls this still gets a
+ * chooser rather than an auto-redirect.
+ *
+ * Idempotent: called by `makeContext` with defaults, and again by the app with its own logo.
+ */
+export const appendLoginScreen = <C extends BasicConfig, T extends BasicContext<C>>(
+  ctx: T, setup?: LoginScreenSetup
+): T => {
+  const service = ensureLoginService(ctx)
+  service.registerScreen(
+    setup == null || Object.keys(setup).length < 1
+      ? LocalizedLoginScreen
+      : props => LocalizedLoginScreen({ ...setup, ...props })
+  )
+
+  return ctx
+}

package/src/components/login/credit.tsx

@@ -0,0 +1,34 @@
+import type { FC } from 'react'
+import { cn } from '@/lib/utils'
+import type { LoginCreditModel } from '@owlmeans/client-panel/auth'
+
+export interface LoginCreditProps {
+  model: LoginCreditModel
+  translate: (key: string, defaultValue: string) => string
+  className?: string
+}
+
+/**
+ * The line at the bottom of a sign-in screen.
+ *
+ * Two halves, and each may stand alone: the platform credit, and who the application belongs to.
+ * A generated application shows both — "Powered by OwlMeans" beside its own product and
+ * organization — and an application whose owner has paid to drop the credit shows only the second.
+ * Rendering nothing at all is also correct, for an app that is neither.
+ */
+export const LoginCredit: FC<LoginCreditProps> = ({ model, translate, className }) => {
+  if (!model.poweredBy && model.line == null) {
+    return null
+  }
+
+  return <p
+    data-login-credit
+    className={cn('text-center text-xs text-muted-foreground', className)}
+  >
+    {model.poweredBy && <span data-login-powered>
+      {translate('login.credit.powered', 'Powered by OwlMeans')}
+    </span>}
+    {model.poweredBy && model.line != null && <span aria-hidden="true"> · </span>}
+    {model.line != null && <span>{model.line}</span>}
+  </p>
+}

package/src/components/login/icons.tsx

@@ -0,0 +1,39 @@
+import type { FC } from 'react'
+import { KeyRound, LogIn, Mail, ShieldCheck, Wallet } from 'lucide-react'
+
+/**
+ * Google's mark, inline.
+ *
+ * Lucide carries no brand marks, and a remote image on a sign-in screen is a third-party request
+ * before consent. Four paths cost less than either.
+ */
+const GoogleMark: FC<{ className?: string }> = ({ className }) => (
+  <svg className={className} viewBox="0 0 48 48" aria-hidden="true" role="presentation">
+    <path fill="#EA4335" d="M24 9.5c3.54 0 6.71 1.22 9.21 3.6l6.85-6.85C35.9 2.38 30.47 0 24 0 14.62 0 6.51 5.38 2.56 13.22l7.98 6.19C12.43 13.72 17.74 9.5 24 9.5z" />
+    <path fill="#4285F4" d="M46.98 24.55c0-1.57-.15-3.09-.38-4.55H24v9.02h12.94c-.58 2.96-2.26 5.48-4.78 7.18l7.73 6c4.51-4.18 7.09-10.36 7.09-17.65z" />
+    <path fill="#FBBC05" d="M10.53 28.59c-.48-1.45-.76-2.99-.76-4.59s.27-3.14.76-4.59l-7.98-6.19C.92 16.46 0 20.12 0 24c0 3.88.92 7.54 2.56 10.78l7.97-6.19z" />
+    <path fill="#34A853" d="M24 48c6.48 0 11.93-2.13 15.89-5.81l-7.73-6c-2.15 1.45-4.92 2.3-8.16 2.3-6.26 0-11.57-4.22-13.47-9.91l-7.98 6.19C6.51 42.62 14.62 48 24 48z" />
+  </svg>
+)
+
+const ICONS: Record<string, FC<{ className?: string }>> = {
+  google: GoogleMark,
+  key: KeyRound,
+  shield: ShieldCheck,
+  wallet: Wallet,
+  mail: Mail,
+}
+
+/**
+ * A method's icon, resolved from a NAME.
+ *
+ * The registry carries names rather than components so that `@owlmeans/client-auth` and
+ * `@owlmeans/oidc` — neither of which may depend on an icon library — can describe a method
+ * completely. An unknown name renders the generic sign-in glyph rather than nothing, because a row
+ * of buttons where one has no icon reads as a rendering fault.
+ */
+export const LoginMethodIcon: FC<{ name?: string, className?: string }> = ({ name, className }) => {
+  const Icon = (name != null ? ICONS[name] : undefined) ?? LogIn
+
+  return <Icon className={className} />
+}

package/src/components/login/index.ts

@@ -0,0 +1,5 @@
+export * from './screen.js'
+export * from './terms.js'
+export * from './credit.js'
+export * from './icons.js'
+export * from './append.js'