@abyss-project/commons-front-core 13.3.0 → 14.0.0

package/dist/auth/components/AuthHeroLayout/auth-hero-gradient.d.ts

@@ -0,0 +1,18 @@
+/**
+ * The ends of the hero's brand gradient. Those of the light theme in both modes: the dark theme's
+ * (a pale blue) are made for a surface that is lit from below, and put the hero's white text under
+ * 4.5:1 (CA12). The hero is a brand surface that carries white text, so it keeps one dark enough
+ * background whatever the mode.
+ */
+export declare const HERO_GRADIENT_FROM: string;
+export declare const HERO_GRADIENT_TO: string;
+/** The shade under the text: transparent up to this share of the hero's height, then growing. */
+export declare const HERO_SHADE_START = 0.15;
+/** Opacity of the black shade at the bottom edge of the hero. */
+export declare const HERO_SHADE_ALPHA = 0.5;
+/**
+ * The highest point of the hero, as a share of its height, where its text can start (the compact
+ * row, its name centred next to the tile): from there down, the shade is what the contrast is
+ * measured with.
+ */
+export declare const HERO_TEXT_TOP = 0.5;

package/dist/auth/components/shared/AuthLoadingScreen.component.d.ts

@@ -0,0 +1,5 @@
+/**
+ * The full-frame loading state shown while the session is restored: the `PageState` loading status
+ * (a named, busy `status`) with a centered progress indicator as its skeleton.
+ */
+export declare const AuthLoadingScreen: () => import("react/jsx-runtime").JSX.Element;

package/dist/auth/components/shared/use-async-resource.hook.d.ts

@@ -13,6 +13,9 @@ export interface AsyncResource<T> {
 }
 /**
  * Loads `load()` on mount and on every `reload()`. An answer that a later load overtook is
- * dropped, so a slow first answer never overwrites a fresh one.
+ * dropped, so a slow first answer never overwrites a fresh one. One load per version: React's
+ * development double-run of effects reuses the request in flight instead of sending a second one,
+ * which matters when the call is not idempotent (the authenticator setup draws a new secret each
+ * time, and the one shown must be the one the server kept).
  */
 export declare const useAsyncResource: <T>(load: () => Promise<T>) => AsyncResource<T>;

package/dist/auth/components/shared/use-async-resource.hook.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/business/CookieConsent/AbyssCookieConsentProvider.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/business/CookieConsent/CookieConsent.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/{legacy/components/CookieConsent/CookieConsentBanner.component.d.ts → components/business/CookieConsent/CookieConsentBanner.d.ts}

@@ -1,6 +1,5 @@
-import { default as React } from 'react';
 import { UseCookieConsent } from '../../../hooks/use-cookie-consent.hook';
 export interface CookieConsentBannerProps {
     api: UseCookieConsent;
 }
-export declare const CookieConsentBanner: React.FC<CookieConsentBannerProps>;
+export declare function CookieConsentBanner({ api }: CookieConsentBannerProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/business/CookieConsent/CookieConsentSettings.d.ts

@@ -0,0 +1 @@
+export declare function CookieConsentSettings(): import("react/jsx-runtime").JSX.Element;

package/dist/{legacy/components → components/business}/CookieConsent/index.d.ts

@@ -1,7 +1,7 @@
 export * from './AbyssCookieConsentProvider';
 export * from '../../../utils/privacy-link.constant';
-export * from './CookieConsentBanner.component';
-export * from './CookieConsentSettings.component';
+export * from './CookieConsentBanner';
+export * from './CookieConsentSettings';
 export * from '../../../hooks/use-cookie-consent.hook';
 export * from '../../../utils/cookie-storage.utils';
 export * from '../../../utils/cookie-consent-reconcile.utils';

package/dist/components/business/index.d.ts

@@ -2,3 +2,6 @@ export * from './InfectedDownloadModal/InfectedDownloadModal';
 export * from './CloudImport/CloudImport';
 export * from './ImportFromCloudModal/ImportFromCloudModal';
 export * from './QRCodeModal/QRCodeModal';
+export * from './CookieConsent/AbyssCookieConsentProvider';
+export * from './CookieConsent/CookieConsentBanner';
+export * from './CookieConsent/CookieConsentSettings';

package/dist/components/inputs/FormField/FormField.d.ts

@@ -3,7 +3,11 @@ export interface FormFieldProps {
     label: string;
     /** A hint under the field, always shown. */
     help?: ReactNode;
-    /** The error message: the field turns to the danger color and is marked invalid. */
+    /**
+     * The error message: the field turns to the danger color and is marked invalid. `true` marks the
+     * field invalid with no message line (the error is said elsewhere); `false`, `null` and `''`
+     * leave the field valid or without a line.
+     */
     error?: ReactNode;
     required?: boolean;
     /**

package/dist/components/inputs/PasswordField/PasswordField.d.ts

@@ -0,0 +1,40 @@
+import { ChangeEvent, FocusEvent, KeyboardEvent, ReactNode, Ref } from 'react';
+export interface PasswordFieldProps {
+    label: string;
+    name: string;
+    value: string;
+    onChange(event: ChangeEvent<HTMLInputElement>): void;
+    /** A hint under the field, always shown. */
+    help?: ReactNode;
+    /** The error message: the field turns to the danger color and is marked invalid. */
+    error?: ReactNode;
+    required?: boolean;
+    disabled?: boolean;
+    autoFocus?: boolean;
+    /**
+     * Password-manager hint. Always set it on a real auth form: `current-password` to sign in,
+     * `new-password` to sign up, reset or change. Leave it unset for a secret that belongs to no
+     * account (a protected link, an archive).
+     */
+    autoComplete?: string;
+    /** Id of the input; generated when omitted. */
+    id?: string;
+    inputRef?: Ref<HTMLInputElement>;
+    /** Raw attributes of the `input` with no dedicated prop (`passwordrules`). */
+    inputProps?: Record<string, string | number | boolean | undefined>;
+    placeholder?: string;
+    onBlur?(event: FocusEvent<HTMLInputElement>): void;
+    onKeyDown?(event: KeyboardEvent<HTMLInputElement>): void;
+    /** Where caps-lock detection goes (`event.getModifierState('CapsLock')`). */
+    onKeyUp?(event: KeyboardEvent<HTMLInputElement>): void;
+    /** `data-testid` of the input. */
+    testId?: string;
+}
+/**
+ * A password input on `FormField`: same label, hint and error contract as the other fields, and a
+ * 44 px toggle that reveals or hides the typed text. The toggle is in the tab order (WCAG 2.1.1: a
+ * keyboard user can reveal the text); it is a `type="button"`, so Enter in the input still submits
+ * the form instead of flipping the visibility. The field does no validation and shows no strength meter: the
+ * caller validates and passes `error`.
+ */
+export declare function PasswordField({ label, name, value, onChange, help, error, required, disabled, autoFocus, autoComplete, id, inputRef, inputProps, placeholder, onBlur, onKeyDown, onKeyUp, testId, }: PasswordFieldProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/inputs/PasswordField/PasswordField.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/inputs/index.d.ts

@@ -4,6 +4,7 @@ export * from './DateRangeField/DateRangeField';
 export * from './ColorField/ColorField';
 export * from './SegmentedControl/SegmentedControl';
 export * from './FormField/FormField';
+export * from './PasswordField/PasswordField';
 export * from './NumberField/NumberField';
 export * from './SettingsRow/SettingsRow';
 export * from './CopyField/CopyField';

package/dist/components/layers/Toast/Toast.d.ts

@@ -1,22 +1,7 @@
 import { ReactNode } from 'react';
-export declare enum ToastTone {
-    Success = "success",
-    Warning = "warning",
-    Danger = "danger",
-    Info = "info"
-}
-export interface ToastAction {
-    label: string;
-    onPress(): void;
-}
-export interface ToastOptions {
-    tone: ToastTone;
-    message: string;
-    action?: ToastAction;
-}
-export interface ToastApi {
-    show(toast: ToastOptions): void;
-}
+import { ToastApi } from './toast-store';
+export { toast, ToastTone } from './toast-store';
+export type { ToastAction, ToastApi, ToastCallOptions, ToastOptions, ToastProgressOptions, ToastUpdate, } from './toast-store';
 export interface ToastProviderProps {
     children: ReactNode;
 }

package/dist/components/layers/Toast/toast-clearance.d.ts

@@ -0,0 +1,6 @@
+/**
+ * The distance, from the bottom of the viewport, up to the top of what already occupies the bottom
+ * right corner (the cookie-consent banner). The toast region keeps above it, so a notification
+ * never covers the banner. Unset while nothing occupies the corner.
+ */
+export declare const TOAST_CLEARANCE_VAR = "--abyss-toast-clearance";

package/dist/components/layers/Toast/toast-store.d.ts

@@ -0,0 +1,76 @@
+export declare enum ToastTone {
+    Success = "success",
+    Warning = "warning",
+    Danger = "danger",
+    Info = "info"
+}
+export interface ToastAction {
+    label: string;
+    onPress(): void;
+}
+export interface ToastOptions {
+    tone: ToastTone;
+    message: string;
+    action?: ToastAction;
+}
+/** Options of `toast.success`, `toast.error`, `toast.info` and `toast.warning`. */
+export interface ToastCallOptions {
+    action?: ToastAction;
+    /** Showing again with the same id replaces the notification instead of stacking another one. */
+    id?: string;
+    /** Time on screen in ms; defaults to `TOAST_DURATION`. */
+    durationMs?: number;
+}
+export interface ToastProgressOptions {
+    id?: string;
+}
+export interface ToastUpdate {
+    /** A tone ends the progress: the notification then leaves like any other. */
+    tone?: ToastTone;
+    message?: string;
+    /** Between 0 and 1; shown while the notification has no final tone. */
+    progress?: number;
+}
+/** A notification as the store holds it. `revision` restarts its timer whenever it changes. */
+export interface ToastItem {
+    id: string;
+    tone: ToastTone;
+    message: string;
+    action?: ToastAction;
+    durationMs?: number;
+    /** True for a progress notification that has not received its final tone yet. */
+    pending: boolean;
+    progress?: number;
+    revision: number;
+}
+export interface ToastApi {
+    show(toast: ToastOptions): void;
+}
+type Listener = () => void;
+/**
+ * Store read by the mounted `ToastProvider`. Calls made before it mounts are kept and shown when
+ * it does.
+ */
+export declare const toastStore: {
+    subscribe(listener: Listener): () => void;
+    getItems(): readonly ToastItem[];
+    /** Claims the single display; returns its release function, or null if a provider already has it. */
+    attachProvider(): (() => void) | null;
+};
+/**
+ * Imperative notifications, usable from a hook, a utility or an axios interceptor. They show in the
+ * mounted `ToastProvider`. Every call returns the id of its notification.
+ */
+export declare const toast: {
+    success: (message: string, options?: ToastCallOptions) => string;
+    error: (message: string, options?: ToastCallOptions) => string;
+    info: (message: string, options?: ToastCallOptions) => string;
+    warning: (message: string, options?: ToastCallOptions) => string;
+    /** A persistent notification, ended with `toast.update(id, { tone })`. */
+    progress(message: string, options?: ToastProgressOptions): string;
+    /** Does nothing when the notification has already left. */
+    update(id: string, changes: ToastUpdate): void;
+    /** Removes one notification, or all of them without an id. */
+    dismiss(id?: string): void;
+};
+export {};

package/dist/components/states/ErrorBoundary/ErrorBoundary.d.ts

@@ -0,0 +1,17 @@
+import { ReactNode } from 'react';
+export interface ErrorBoundaryProps {
+    /** Name of the app, carried by the technical detail so a report says where it came from. */
+    appName: string;
+    children: ReactNode;
+    /** Called when the user retries, before the children render again. */
+    onReset?(): void;
+    /** The boundary resets by itself when one of these values changes (the route, for instance). */
+    resetKeys?: unknown[];
+    /** Fills the viewport (the error replaces the whole app); otherwise the block sits in its slot. */
+    fullHeight?: boolean;
+}
+/**
+ * Catches the render errors of its children, reports them to the front's RUM and shows an error
+ * block in their place, with « Réessayer » and the technical detail on demand.
+ */
+export declare function ErrorBoundary({ appName, children, onReset, resetKeys, fullHeight, }: ErrorBoundaryProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/states/ErrorBoundary/ErrorBoundary.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/states/PageState/PageState.d.ts

@@ -14,7 +14,9 @@ export interface PageStateEmpty {
     action?: ReactNode;
 }
 export interface PageStateError {
-    /** Replaces the generic description; the title stays « Le chargement a échoué ». */
+    /** Replaces the title « Le chargement a échoué » (a crash is not a failed load). */
+    title?: string;
+    /** Replaces the generic description; the title stays the default one unless `title` is set. */
     message?: string;
     onRetry(): void;
 }

package/dist/components/states/index.d.ts

@@ -1,2 +1,3 @@
 export * from './PageState/PageState';
 export * from './Callout/Callout';
+export * from './ErrorBoundary/ErrorBoundary';

package/dist/cookie-consent.d.ts

@@ -1,2 +1,2 @@
-export * from './legacy/components/CookieConsent/index'
+export * from './components/business/CookieConsent/index'
 export {}

package/dist/cookie-consent.js

@@ -1,20 +1,19 @@
-import { A as s, c as a, C as n, D as C, R as i, V as t, d as r, r as A, e as k, u as c, b as l, a as f, w as b } from "./AbyssCookieConsentProvider-Ds99df0E.js";
-import { C as u } from "./CookieConsentSettings.component-DoWLHqw5.js";
-import { f as E } from "./use-rich-intl.hook-BETUyCkW.js";
+import { A as e, d as a, C as n, b as C, D as i, R as t, V as r, e as A, r as k, f as c, u as l, c as f, a as b, w as u } from "./CookieConsentSettings-DyJGEnVA.js";
+import { f as E } from "./Surface-B_J_I_1i.js";
 export {
-  s as AbyssCookieConsentProvider,
+  e as AbyssCookieConsentProvider,
   a as COOKIE_NAME,
   n as CookieConsentBanner,
-  u as CookieConsentSettings,
-  C as DEFAULT_PRIVACY_HREF,
-  i as ReconcileAction,
-  t as VALIDITY_DAYS,
-  r as clearCookie,
+  C as CookieConsentSettings,
+  i as DEFAULT_PRIVACY_HREF,
+  t as ReconcileAction,
+  r as VALIDITY_DAYS,
+  A as clearCookie,
   E as flattenTranslations,
-  A as readCookie,
-  k as reconcile,
-  c as useAbyssCookieConsent,
-  l as useCookieConsent,
-  f as useOptionalAbyssCookieConsent,
-  b as writeCookie
+  k as readCookie,
+  c as reconcile,
+  l as useAbyssCookieConsent,
+  f as useCookieConsent,
+  b as useOptionalAbyssCookieConsent,
+  u as writeCookie
 };

package/dist/demo/DemoBanner/DemoBanner.d.ts

@@ -0,0 +1,16 @@
+/** The page of abyss-docs that says what a demo account blocks (same base as the legacy layout's documentation link). */
+export declare const DEMO_DOCS_URL = "https://docs.abyss-project.fr/abyss-project/demo-account";
+/** CSS variable carrying the height of a pinned banner, read by the fixed chrome pushed below it. */
+export declare const DEMO_BANNER_HEIGHT_VAR = "--demo-banner-height";
+/**
+ * The permanent banner of a demo account: its group, when the group expires, « Réinitialiser »
+ * (after a confirmation that names the whole group) and « En savoir plus » (abyss-docs). It has no
+ * close button. Renders nothing outside a demo, or while the group is loading.
+ *
+ * `pinned` is for an app that mounts it at the root, above its router: the banner then stays on top
+ * of the page and the fixed header and sidebar of the app start under it. A banner placed inside a
+ * layout, in the flow of the page, keeps the default.
+ */
+export declare const DemoBanner: ({ pinned }: {
+    pinned?: boolean;
+}) => import("react/jsx-runtime").JSX.Element | null;

package/dist/demo/DemoBanner/DemoBanner.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/demo/DemoBanner/index.d.ts

@@ -0,0 +1 @@
+export * from './DemoBanner';

package/dist/demo/demo-blocked.interceptor.d.ts

@@ -0,0 +1,7 @@
+import { AxiosInstance } from 'axios';
+/**
+ * Tells the user, through `notify`, that a demo account may not do what it just tried (the API
+ * answers 403 `DEMO_ACTION_BLOCKED`). The error is still rejected so callers keep their own
+ * handling. Returns the function that detaches the interceptor.
+ */
+export declare const attachDemoBlockedInterceptor: (instance: AxiosInstance, notify: (message: string) => void) => (() => void);

package/dist/demo/demo.en.d.ts

@@ -0,0 +1,17 @@
+declare const _default: {
+    banner: {
+        title: string;
+        summary: string;
+        'expires-in': string;
+        'expires-today': string;
+        reset: string;
+        'learn-more': string;
+        'reset-dialog': {
+            title: string;
+            body: string;
+            confirm: string;
+        };
+    };
+    blocked: string;
+};
+export default _default;

package/dist/demo/demo.fr.d.ts

@@ -0,0 +1,17 @@
+declare const _default: {
+    banner: {
+        title: string;
+        summary: string;
+        'expires-in': string;
+        'expires-today': string;
+        reset: string;
+        'learn-more': string;
+        'reset-dialog': {
+            title: string;
+            body: string;
+            confirm: string;
+        };
+    };
+    blocked: string;
+};
+export default _default;

package/dist/demo/index.d.ts

@@ -0,0 +1,3 @@
+export * from './DemoBanner';
+export * from './use-demo-account.hook';
+export * from './demo-blocked.interceptor';

package/dist/demo/tests/demo-blocked.interceptor.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/demo/use-demo-account.hook.d.ts

@@ -0,0 +1,19 @@
+export interface DemoGroup {
+    label: string;
+    expiresAt: Date;
+}
+export interface DemoAccount {
+    /** The signed-in user belongs to a demo group. */
+    isDemo: boolean;
+    /** The group, once loaded; `null` outside a demo and while it loads or cannot be read. */
+    group: DemoGroup | null;
+    /** Resets the whole group to its seeded state (all its accounts), then reloads the group. */
+    reset(): Promise<void>;
+}
+/**
+ * The demo state of the signed-in user (`IUser.demoGroupId`) and its group (`GET /demo/me`).
+ * Outside an `<AuthProvider>` or signed out, it is not a demo. The group is only read for a demo
+ * user; a group that cannot be read leaves `group` null (the server enforces the demo either way,
+ * the banner only announces it).
+ */
+export declare const useDemoAccount: () => DemoAccount;