@abyss-project/commons-front-core 9.1.1 → 9.2.0

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

@@ -0,0 +1,50 @@
+/** A user the picker offers. */
+export interface UserPickerOption {
+    id: string;
+    /** Display name: the option's title, the chip's label and the avatar's initial. */
+    name: string;
+    /** Shown under the name and searched; `null` when the host does not know it. */
+    email: string | null;
+    /** URL of the user's picture; `null` draws the initial of the name. */
+    pictureUrl: string | null;
+}
+interface UserPickerBaseProps {
+    options: UserPickerOption[];
+    /**
+     * Remote search: called with the typed text at each keystroke (the host debounces and fetches),
+     * and the options are shown as given. Without it, the options are filtered on the name and the
+     * email.
+     */
+    onSearch?(query: string): void;
+    /** A remote search is in flight: the list says so instead of « no option ». */
+    loading?: boolean;
+    /** Label above the field, its accessible name. */
+    label: string;
+    placeholder?: string;
+    /** Users listed but not selectable (already members, the current owner…). */
+    disabledIds?: string[];
+    /** What the list says when nothing matches. */
+    noOptionsText: string;
+    disabled?: boolean;
+}
+export interface UserPickerSingleProps extends UserPickerBaseProps {
+    multiple?: false;
+    /** Id of the selected user, `null` when none. */
+    value: string | null;
+    onChange(value: string | null): void;
+}
+export interface UserPickerMultipleProps extends UserPickerBaseProps {
+    multiple: true;
+    /** Ids of the selected users, in the order they were picked. */
+    value: string[];
+    onChange(value: string[]): void;
+}
+export type UserPickerProps = UserPickerSingleProps | UserPickerMultipleProps;
+/**
+ * A field to pick one user or several among a list: each option shows the avatar, the name and
+ * the email. Typing filters the list on the name and the email, or hands the text to `onSearch`
+ * for a server-side search. In multiple mode, the selected users are chips in the field; the left
+ * arrow walks them from the text and Backspace or Delete removes the focused one.
+ */
+export declare function UserPicker(props: UserPickerProps): import("react/jsx-runtime").JSX.Element;
+export {};

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

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

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

@@ -10,3 +10,6 @@ export * from './CopyField/CopyField';
 export * from './ContextSelector/ContextSelector';
 export * from './DropZone/DropZone';
 export * from './ImportButton/ImportButton';
+export * from './UserPicker/UserPicker';
+export * from './CompanySearchField/CompanySearchField';
+export * from './EntityImageField/EntityImageField';

package/dist/components/layers/ConfirmDialog/useConfirmDialog.d.ts

@@ -0,0 +1,21 @@
+import { ReactNode } from 'react';
+import { ConfirmDialogProps } from './ConfirmDialog';
+/** What a confirmation asks: the texts and the tone of `ConfirmDialog`. */
+export type ConfirmDialogOptions = Pick<ConfirmDialogProps, 'title' | 'body' | 'confirmLabel' | 'tone' | 'confirmationText'>;
+export interface ConfirmDialogApi {
+    /**
+     * Opens a confirmation and resolves `true` when the user confirms, `false` when they cancel.
+     * While a confirmation is open, the next one waits for it to close.
+     */
+    confirm(options: ConfirmDialogOptions): Promise<boolean>;
+}
+/**
+ * Hosts the confirmations asked through `useConfirmDialog`: one `ConfirmDialog` at a time, the
+ * requests made meanwhile queued in their order. Requests still waiting when the provider unmounts
+ * are answered `false`.
+ */
+export declare function ConfirmDialogProvider({ children }: {
+    children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+/** The `confirm` of the nearest `ConfirmDialogProvider`. */
+export declare function useConfirmDialog(): ConfirmDialogApi;

package/dist/components/layers/ConfirmDialog/useConfirmDialog.spec.d.ts

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

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

@@ -4,4 +4,5 @@ export * from './Drawer/Drawer';
 export * from './Menu/Menu';
 export * from './Toast/Toast';
 export * from './CommandPalette/CommandPalette';
+export * from './ConfirmDialog/useConfirmDialog';
 export * from './ProductTour/ProductTour';

package/dist/components/meaning/AvatarGroup/AvatarGroup.d.ts

@@ -0,0 +1,22 @@
+export interface AvatarGroupPerson {
+    id: string;
+    /** Accessible name of the avatar, and its initial while there is no picture. */
+    name: string;
+    /** URL of the person's picture; `null` when they have none. */
+    pictureUrl: string | null;
+}
+export interface AvatarGroupProps {
+    people: AvatarGroupPerson[];
+    /** Number of avatars drawn; the others are counted in a "+N" (at least one avatar is drawn). */
+    max?: number;
+    /** Side of each avatar in px. Defaults to `AVATAR_DEFAULT_SIZE`. */
+    size?: number;
+    /** Accessible name of the group ("Membres de l'équipe Ops"). */
+    label: string;
+}
+/**
+ * People side by side in an overlapping stack: their picture in a disc, or their initial. Beyond
+ * `max`, a "+N" counts the others; it is named after them and lists them in a tooltip on hover.
+ * Nothing is interactive: an avatar that opens something is placed in a button by the host.
+ */
+export declare function AvatarGroup({ people, max, size, label, }: AvatarGroupProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/components/meaning/AvatarGroup/AvatarGroup.spec.d.ts

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

package/dist/components/meaning/TeamAvatar/TeamAvatar.d.ts

@@ -0,0 +1,14 @@
+export interface TeamAvatarProps {
+    /** The team's name: accessible name, and its initial. */
+    name: string;
+    /** The team's stored color (free text); `null` when it has none. */
+    color: string | null;
+    /** Side in px. Defaults to `AVATAR_DEFAULT_SIZE`. */
+    size?: number;
+}
+/**
+ * A team: the initial of its name on its own color, in a rounded square. The initial takes the
+ * paper ink (light or dark, whatever the theme) that contrasts best with the team color. A
+ * missing or unreadable color gives the neutral tint of the other avatars, never an exception.
+ */
+export declare function TeamAvatar({ name, color, size, }: TeamAvatarProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/meaning/TeamAvatar/TeamAvatar.spec.d.ts

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

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

@@ -5,3 +5,5 @@ export * from './ScanBadge/ScanBadge';
 export * from './RoleBadge/RoleBadge';
 export * from './ToolIcon/ToolIcon';
 export * from './Avatar/Avatar';
+export * from './AvatarGroup/AvatarGroup';
+export * from './TeamAvatar/TeamAvatar';

package/dist/components/structure/Section/Section.d.ts

@@ -1,14 +1,22 @@
 import { ReactNode } from 'react';
+export declare enum SectionTone {
+    Default = "default",
+    /** A danger zone (deletion, transfer of ownership): title and top rule in `status.danger`. */
+    Danger = "danger"
+}
 export interface SectionProps {
     title: string;
     /** Number of items in the section, shown next to the title in mono. */
     count?: number;
     /** Actions aligned to the right of the title (a link, a button, a `Toolbar`). */
     actions?: ReactNode;
+    /** Defaults to `SectionTone.Default`. */
+    tone?: SectionTone;
     children: ReactNode;
 }
 /**
  * A titled block of a page (mock-up `.sec`, `.sech`): section title, optional count and actions,
- * then its content. The `<section>` is named by its title.
+ * then its content. The `<section>` is named by its title. In the danger tone, a rule in
+ * `status.danger` sets the block apart and the title takes the same color.
  */
-export declare function Section({ title, count, actions, children }: SectionProps): import("react/jsx-runtime").JSX.Element;
+export declare function Section({ title, count, actions, tone, children, }: SectionProps): import("react/jsx-runtime").JSX.Element;

package/dist/cookie-consent.js

@@ -1,5 +1,5 @@
-import { A as e, c as a, C as n, D as C, R as i, V as t, d as r, f as A, r as k, e as c, u as l, b, a as f, w as u } from "./AbyssCookieConsentProvider-B7-F6osY.js";
-import { C as E } from "./CookieConsentSettings.component-DxQL4ULz.js";
+import { A as e, c as a, C as n, D as C, R as i, V as t, d as r, f as A, r as k, e as c, u as l, b, a as f, w as u } from "./AbyssCookieConsentProvider-DUYUEZaO.js";
+import { C as E } from "./CookieConsentSettings.component-aVDMZLIs.js";
 export {
   e as AbyssCookieConsentProvider,
   a as COOKIE_NAME,