@krizaka/ui 3.24.0 → 3.26.0

package/README.md

@@ -147,7 +147,8 @@ light or a product's — is a set of tokens.
 | `@krizaka/ui/skip-link` | `SkipLink` (`href`, default `#content`; the label as children): the first tab stop, hidden until focused, Enter moves focus to the content (WCAG 2.4.1) | client |
 | `@krizaka/ui/kbd` | `Kbd` (`size` sm·md), `kbdVariants` | server |
 | `@krizaka/ui/tabs` | `Tabs.Root/List/Trigger/Content` (`variant` underline·segmented·pills on the root, `orientation`, `value`/`defaultValue` + `onValueChange`; one light glides to the active tab), `tabs` (the slots) | client |
-| `@krizaka/ui/nav-bar` | `NavBar.Root` (`label`, `compactAfter`, `floating`) `/Brand` `/Family` (`current`, `labels`, `defaultOpen`: the family switcher on the brand, the mobile panel's last group inside `Mobile`) `/Badge` (`env`, `version`) `/Items/Link` (`active`) `/Menu` (`label`, `columns`) `/MenuLink` (`title`, `description`, `icon`) `/Actions` `/Repo` (`href`, `label`) `/Mobile` (`openLabel`, `closeLabel`) `/MobileLink`, `navBar` (the slots) | client |
+| `@krizaka/ui/language-switch` | `LanguageSwitch` (`label`, `current`, `languages`, `variant`, `linkAs`), `languagesFor(path)`, `languageHref(path, to)` | client |
+| `@krizaka/ui/nav-bar` | `NavBar.Root` (`label`, `compactAfter`, `floating`) `/Brand` `/Family` (`current`, `labels`, `defaultOpen`: the family switcher on the brand, the mobile panel's last group inside `Mobile`) `/Badge` (`env`, `version`) `/Items/Link` (`active`) `/Menu` (`label`, `columns`) `/MenuLink` (`title`, `description`, `icon`) `/Actions` `/Repo` (`href`, `label`) `/Language` (the language switch: a menu in the bar, a row in the mobile panel) `/Mobile` (`openLabel`, `closeLabel`) `/MobilePreferences` (`label`) `/MobileLink`, `navBar` (the slots) | client |
 | `@krizaka/ui/sites` | The Krizaka family as data: `sites` (id, name, url, host, kind, group, status, mark, repo), `siteGroups`, `siteById`, `sitesByGroup`, `familyLabels` (`en`, `fr`) | server |
 | `@krizaka/ui/site-footer` | `SiteFooter` (`current`, `labels`, `version`, `env`, `legal`; own columns as children) `.Column` (`title`) `.Link` (`active`, `asChild`): the footer of every Krizaka site — the family in columns, “A Krizaka company / product / open-source project”, the version, Montréal | client |
 | `@krizaka/ui/chip` | `Chip` (`selected`/`defaultSelected` + `onSelectedChange`, `size` sm·md; `removable` + `removeLabel` + `onRemove`), `Chip.Group` (`type` single·multiple, `label`, `required` for single), `chip` (the slots) | client |
@@ -212,8 +213,15 @@ light or a product's — is a set of tokens.
 | `@krizaka/ui/app-shell` | `AppShell.Root` (`defaultCollapsed`, `collapsed` + `onCollapsedChange`) `/Sidebar` (`label`, `brand`, `footer`, `collapseLabels`, `closeLabel`; a drawer on a phone) `/Group/Item` (`icon`, `label`, `current`, `badge`, `shortcut`, `asChild`) `/Body/Header` (`title`, `menuLabel`, `actions`) `/Search` (`label`, `onOpen`, `shortcut` ⌘K — opens the app's `CommandDialog`) `/Main`; `collapseShortcut` (⌘B), `useShortcuts` — see [Layouts and templates](#layouts-and-templates) | client |
 | `@krizaka/ui/rail-nav` | `RailNav.Shell/Root/Item/Body`: `Root` (`label`, `mark`, `accent`, `footer`, `expandable` + `expanded`/`onExpandedChange`, `expandLabels`) is a vertical rail of icons on a desktop — the mark on top, a tooltip per icon, an accent bar on the current item — and a bottom tab bar on a phone; `Item` (`icon`, `label`, `current`, `badge`, `badgeLabel`, `asChild`); arrow keys, Home and End move between items | client |
 | `@krizaka/ui/app-header` | `AppHeader` (`name`, `mark`, `href` or `homeLink`, `chips`, `actions`): the bar beside a `RailNav` — the name as text, the mark below `md` only (the rail carries it above), so one mark shows at every width | server |
+| `@krizaka/ui/service-card` | `ServiceCard` (`name`, `price`, `priceFrom`, `duration`, `capacity`, `description`, `included`, `tag`, `icon`, `media`, `selected`, `actionLabel`, `href` + `linkAs` or `onSelect`): a service a shop sells as a card with one way in | server |
+| `@krizaka/ui/slot-picker` | `SlotPicker` (`days` of `{ id, label, sub, slots }`, `label`, `emptyLabel`, `value`, `onValueChange`, `linkAs`): the next free times as chips by day — links (`slot.href`) or toggles | client |
+| `@krizaka/ui/opening-hours` | `OpeningHours` (`days`, `today`, `status`, `label`): the weekly hours in one row (open now · closes at…) that unfolds into the week, today marked | server |
+| `@krizaka/ui/cover-hero` | `CoverHero` (`cover` `{ src, alt, video }`, `eyebrow`, `title`, `lead`, `facts`, `actions`, `back`, `linkAs`): a shop's first screen over its photo or muted loop (a still under reduced motion), brand colours without a cover | client |
+| `@krizaka/ui/sticky-action` | `StickyAction`: the page's one action held at the bottom edge of a phone (pure CSS, last child of `main`, not drawn from `md`) | server |
+| `@krizaka/ui/media-gallery` | `MediaGallery` (`items` of `{ id, src, alt, video, caption, shape }`, `label`): a shop's photos and loops in tiles, the first featured, loops play while seen | client |
 | `@krizaka/ui/dashboard-layout` | `DashboardLayout` (`title`, `eyebrow`, `description`, `actions`, `toolbar`, `headingAs`), `Widget` (`title`, `description`, `action`, `span` 1·2·3·full, `level`) | server |
 | `@krizaka/ui/settings-layout` | `SettingsLayout` (`title`, `description`, `nav`, `navLabel`, `linkAs`), `SettingsSection` (`title`, `description`, `footer`) | server |
+| `@krizaka/ui/account-menu` | `AccountMenu` (`label`, `name`, `email`, `avatar`, `links`, `language`, `signOut`) | client |
 | `@krizaka/ui/auth-layout` | `AuthLayout` (`brand`, `title`, `description`, `footer`, `legal`, `promise`, `aside`, `asideFooter`) | server |
 | `@krizaka/ui/detail-layout` | `DetailLayout` (`back`, `media`, `eyebrow`, `title`, `status`, `meta`, `actions`, `tabs`, `aside`) | server |
 | `@krizaka/ui/split-view` | `SplitView` (`listTitle`, `listActions`, `list`, `detailHead`, `detail`, `empty`, `showDetail`, `back`) | server |

package/dist/account-menu.d.ts

@@ -0,0 +1,163 @@
+import * as React from 'react';
+import * as tailwind_variants from 'tailwind-variants';
+import { VariantProps } from 'tailwind-variants';
+
+type DefaultAvatarBrand = "krizaka" | "orazaka" | "orochia" | "yasakia" | "yororis" | "yomizaka" | "kachizaka" | "akinaza";
+/** `person`: a neutral silhouette. `plain`: the brand's gradient alone, ready for initials. */
+type DefaultAvatarKind = "person" | "plain";
+interface DefaultAvatar {
+    /** The brand of the product showing the avatar: its gradient, its hues. */
+    brand: DefaultAvatarBrand;
+    /** Any stable text or number of the person (their id): the same seed gives the same tone everywhere. */
+    seed?: string | number;
+    /** Force a tone, 1 to 6, instead of deriving it from `seed`. */
+    tone?: number;
+    /**
+     * `person` (default): a silhouette. `plain`: the gradient alone.
+     * @default "person"
+     */
+    kind?: DefaultAvatarKind;
+}
+
+declare const avatar: tailwind_variants.TVReturnType<{
+    size: {
+        xs: {
+            root: string;
+        };
+        sm: {
+            root: string;
+        };
+        md: {
+            root: string;
+        };
+        lg: {
+            root: string;
+        };
+        xl: {
+            root: string;
+        };
+    };
+}, {
+    root: string;
+    image: string;
+    fallback: string;
+    group: string;
+}, undefined, {
+    size: {
+        xs: {
+            root: string;
+        };
+        sm: {
+            root: string;
+        };
+        md: {
+            root: string;
+        };
+        lg: {
+            root: string;
+        };
+        xl: {
+            root: string;
+        };
+    };
+}, {
+    root: string;
+    image: string;
+    fallback: string;
+    group: string;
+}, tailwind_variants.TVReturnTypeLike<{
+    size: {
+        xs: {
+            root: string;
+        };
+        sm: {
+            root: string;
+        };
+        md: {
+            root: string;
+        };
+        lg: {
+            root: string;
+        };
+        xl: {
+            root: string;
+        };
+    };
+}, {
+    root: string;
+    image: string;
+    fallback: string;
+    group: string;
+}>>;
+type AvatarSize = NonNullable<VariantProps<typeof avatar>["size"]>;
+type AvatarProps = Omit<React.ComponentProps<"span">, "children"> & {
+    /** The image's URL; `null` or nothing shows the `fallback`. */
+    src?: string | null;
+    /** The image's text alternative (the person's name); empty when a visible name sits next to the avatar. */
+    alt?: string;
+    /** Shown while the image loads, when it fails or when there is none: initials, an icon. */
+    fallback?: React.ReactNode;
+    /** The picture to show instead when `src` is missing or fails to load (an image URL). The `fallback` still covers its own loading. */
+    fallbackSrc?: string;
+    /**
+     * The Krizaka default picture when the person has no photo (or it fails): their brand's gradient and a silhouette,
+     * one of six tones from `seed` — `defaultAvatar={{ brand: "orochia", seed: user.id }}`. `fallbackSrc` wins over it.
+     */
+    defaultAvatar?: DefaultAvatar;
+    /**
+     * xs · sm · md · lg · xl.
+     * @default "md"
+     */
+    size?: AvatarSize;
+};
+
+interface AccountMenuLink {
+    id: string;
+    label: string;
+    href: string;
+    /** A signature icon. */
+    icon?: React.ReactNode;
+}
+interface AccountMenuLanguage {
+    /** The row's words (`Language`). */
+    label: string;
+    /** The current value (`en`). */
+    value: string;
+    options: readonly {
+        value: string;
+        label: string;
+    }[];
+    onChange: (value: string) => void;
+}
+interface AccountMenuProps {
+    /** The trigger's accessible name (`Account`). */
+    label: string;
+    /** Their name; falls back to the e-mail. */
+    name?: string;
+    /** Their e-mail, shown under the name. */
+    email?: string;
+    /** The picture: `src`, or `defaultAvatar` (`{ brand, seed }`) for the product's default person. */
+    avatar?: Omit<AvatarProps, "size">;
+    /** Show the name beside the avatar in the trigger from the `sm` breakpoint. */
+    showName?: boolean;
+    /** Where to go: profile, settings… */
+    links?: readonly AccountMenuLink[];
+    /** The app's link component (Next's `Link`); an `<a>` otherwise. */
+    linkAs?: React.ElementType;
+    /** The language, as a submenu that shows the current one. */
+    language?: AccountMenuLanguage;
+    /** Extra rows between the language and Sign out (a theme switch…). */
+    children?: React.ReactNode;
+    /** The last row: its words, what it does, an optional icon. */
+    signOut: {
+        label: string;
+        onSelect: () => void;
+        icon?: React.ReactNode;
+    };
+    /** Classes for the trigger. */
+    className?: string;
+}
+/** The account menu: avatar trigger → identity header, links, language submenu, Sign out. */
+declare function AccountMenu({ label, name, email, avatar, showName, links, linkAs: Link, language, children, signOut, className }: AccountMenuProps): React.JSX.Element;
+
+export { AccountMenu, type AccountMenuLanguage, type AccountMenuLink, type AccountMenuProps };

package/dist/account-menu.js

@@ -0,0 +1,211 @@
+import {
+  cn
+} from "./chunk-KH3JOEPY.js";
+
+// src/avatar/avatar.tsx
+import { Avatar as AvatarPrimitive } from "radix-ui";
+import * as React from "react";
+import { tv } from "tailwind-variants";
+
+// src/avatar/default-avatar.ts
+var DEFAULT_AVATAR_TONES = 6;
+var DEFAULT_AVATAR_BASE = "https://krizaka-assets.b-cdn.net/people/defaults/v1";
+var clampTone = (tone) => Math.min(DEFAULT_AVATAR_TONES, Math.max(1, Math.round(tone)));
+function defaultAvatarToneOf(seed) {
+  if (seed === void 0) return 1;
+  let h = 2166136261;
+  for (const ch of String(seed)) {
+    h ^= ch.codePointAt(0) ?? 0;
+    h = Math.imul(h, 16777619) >>> 0;
+  }
+  return h % DEFAULT_AVATAR_TONES + 1;
+}
+var resolveTone = (a) => a.tone === void 0 ? defaultAvatarToneOf(a.seed) : clampTone(a.tone);
+function defaultAvatarFile(kind, tone, size) {
+  return size === "svg" ? `${kind}-${tone}.svg` : `${kind}-${tone}-${size}.webp`;
+}
+function trimTrailingSlashes(value) {
+  let end = value.length;
+  while (end > 0 && value.charCodeAt(end - 1) === 47) end--;
+  return value.slice(0, end);
+}
+function defaultAvatarUrl(avatar2, { size = 256, base = DEFAULT_AVATAR_BASE } = {}) {
+  return `${trimTrailingSlashes(base)}/${avatar2.brand}/${defaultAvatarFile(avatar2.kind ?? "person", resolveTone(avatar2), size)}`;
+}
+
+// src/avatar/avatar.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var avatar = tv({
+  slots: {
+    root: "relative inline-flex shrink-0 overflow-hidden rounded-full bg-surface-3 align-middle",
+    image: "h-full w-full object-cover",
+    fallback: "flex h-full w-full items-center justify-center font-semibold uppercase text-fg-secondary",
+    group: "flex items-center -space-x-2 [&>*]:ring-2 [&>*]:ring-surface-0"
+  },
+  variants: {
+    size: {
+      xs: { root: "h-5 w-5 text-[9px]" },
+      sm: { root: "h-8 w-8 text-xs" },
+      md: { root: "h-10 w-10 text-sm" },
+      lg: { root: "h-14 w-14 text-base" },
+      xl: { root: "h-20 w-20 text-lg" }
+    }
+  },
+  defaultVariants: { size: "md" }
+});
+function AvatarRoot({ src, alt = "", fallback, fallbackSrc, defaultAvatar, size, className, ...props }) {
+  const s2 = avatar({ size });
+  const [failed, setFailed] = React.useState(null);
+  const backup = fallbackSrc ?? (defaultAvatar ? defaultAvatarUrl(defaultAvatar, { size: size === "xl" || size === "lg" ? 512 : 256 }) : void 0);
+  const shown = src && failed !== src ? src : backup;
+  return /* @__PURE__ */ jsxs(AvatarPrimitive.Root, { "data-size": size ?? "md", className: s2.root({ className }), ...props, children: [
+    shown && /* @__PURE__ */ jsx(
+      AvatarPrimitive.Image,
+      {
+        src: shown,
+        alt,
+        className: s2.image(),
+        onLoadingStatusChange: (status) => {
+          if (status === "error" && shown === src) setFailed(src);
+        }
+      }
+    ),
+    /* @__PURE__ */ jsx(AvatarPrimitive.Fallback, { delayMs: shown ? 300 : 0, className: s2.fallback(), children: fallback })
+  ] });
+}
+function AvatarGroup({ max, size, className, children, ...props }) {
+  const items = React.Children.toArray(children);
+  const shown = max === void 0 ? items : items.slice(0, max);
+  const rest = items.length - shown.length;
+  return /* @__PURE__ */ jsxs("div", { className: avatar().group({ className }), ...props, children: [
+    shown,
+    rest > 0 && /* @__PURE__ */ jsx(AvatarRoot, { size, fallback: `+${rest}` })
+  ] });
+}
+var Avatar = Object.assign(AvatarRoot, { Group: AvatarGroup });
+
+// src/dropdown-menu/dropdown-menu.tsx
+import { DropdownMenu as MenuPrimitive } from "radix-ui";
+import { tv as tv2 } from "tailwind-variants";
+
+// src/floating.ts
+var floating = "kz-pop z-50 rounded-lg border border-border-default bg-surface-2 text-fg shadow-lg outline-hidden";
+
+// src/dropdown-menu/dropdown-menu.tsx
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+var menu = tv2({
+  slots: {
+    content: cn(floating, "min-w-48 max-h-(--radix-dropdown-menu-content-available-height) overflow-y-auto overflow-x-hidden overscroll-contain p-1 origin-(--radix-dropdown-menu-content-transform-origin)"),
+    item: "relative flex cursor-pointer select-none items-center gap-2 rounded-md px-2.5 py-2 text-sm text-fg outline-hidden transition-colors data-highlighted:bg-surface-3 data-disabled:pointer-events-none data-disabled:opacity-40 [&>svg]:h-4 [&>svg]:w-4 [&>svg]:shrink-0 [&>svg]:text-fg-secondary",
+    indicator: "ml-auto flex h-4 w-4 items-center justify-center text-fg-accent",
+    label: "px-2.5 pb-1 pt-2 text-[11px] font-semibold uppercase tracking-wider text-fg-secondary",
+    separator: "-mx-1 my-1 h-px bg-border-subtle"
+  },
+  variants: {
+    // The label reads in the danger text role (≥ 4.5:1 on the menu surface, both themes); the icon and the highlight
+    // carry the danger fill.
+    tone: { default: {}, danger: { item: "text-fg-danger data-highlighted:bg-danger/15 [&>svg]:text-danger" } }
+  },
+  defaultVariants: { tone: "default" }
+});
+var s = menu();
+function DropdownMenuContent({ sideOffset = 6, align = "end", collisionPadding = 8, container, className, ...props }) {
+  return /* @__PURE__ */ jsx2(MenuPrimitive.Portal, { container, children: /* @__PURE__ */ jsx2(MenuPrimitive.Content, { sideOffset, align, collisionPadding, className: s.content({ className }), ...props }) });
+}
+function DropdownMenuItem({ tone, className, ...props }) {
+  return /* @__PURE__ */ jsx2(MenuPrimitive.Item, { "data-tone": tone ?? "default", className: menu({ tone }).item({ className }), ...props });
+}
+function DropdownMenuCheckboxItem({ className, children, ...props }) {
+  return /* @__PURE__ */ jsxs2(MenuPrimitive.CheckboxItem, { className: s.item({ className }), ...props, children: [
+    children,
+    /* @__PURE__ */ jsx2(MenuPrimitive.ItemIndicator, { className: s.indicator(), children: /* @__PURE__ */ jsx2("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx2("path", { d: "M20 6 9 17l-5-5" }) }) })
+  ] });
+}
+function DropdownMenuSubTrigger({ className, children, ...props }) {
+  return /* @__PURE__ */ jsxs2(MenuPrimitive.SubTrigger, { className: s.item({ className: cn("data-[state=open]:bg-surface-3", className) }), ...props, children: [
+    children,
+    /* @__PURE__ */ jsx2("svg", { className: "ml-auto !h-4 !w-4 text-fg-secondary", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx2("path", { d: "m9 18 6-6-6-6" }) })
+  ] });
+}
+function DropdownMenuSubContent({ sideOffset = 4, collisionPadding = 8, className, ...props }) {
+  return /* @__PURE__ */ jsx2(MenuPrimitive.Portal, { children: /* @__PURE__ */ jsx2(MenuPrimitive.SubContent, { sideOffset, collisionPadding, className: s.content({ className: cn("max-h-(--radix-dropdown-menu-content-available-height)", className) }), ...props }) });
+}
+function DropdownMenuRadioItem({ className, children, ...props }) {
+  return /* @__PURE__ */ jsxs2(MenuPrimitive.RadioItem, { className: s.item({ className }), ...props, children: [
+    children,
+    /* @__PURE__ */ jsx2(MenuPrimitive.ItemIndicator, { className: s.indicator(), children: /* @__PURE__ */ jsx2("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": true, children: /* @__PURE__ */ jsx2("path", { d: "M20 6 9 17l-5-5" }) }) })
+  ] });
+}
+function DropdownMenuLabel({ className, ...props }) {
+  return /* @__PURE__ */ jsx2(MenuPrimitive.Label, { className: s.label({ className }), ...props });
+}
+function DropdownMenuSeparator({ className, ...props }) {
+  return /* @__PURE__ */ jsx2(MenuPrimitive.Separator, { className: s.separator({ className }), ...props });
+}
+var DropdownMenu = {
+  Root: MenuPrimitive.Root,
+  Trigger: MenuPrimitive.Trigger,
+  Content: DropdownMenuContent,
+  Item: DropdownMenuItem,
+  CheckboxItem: DropdownMenuCheckboxItem,
+  Label: DropdownMenuLabel,
+  Separator: DropdownMenuSeparator,
+  Group: MenuPrimitive.Group,
+  Sub: MenuPrimitive.Sub,
+  SubTrigger: DropdownMenuSubTrigger,
+  SubContent: DropdownMenuSubContent,
+  RadioGroup: MenuPrimitive.RadioGroup,
+  RadioItem: DropdownMenuRadioItem
+};
+
+// src/account-menu/account-menu.tsx
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+function AccountMenu({ label, name, email, avatar: avatar2, showName = true, links = [], linkAs: Link = "a", language, children, signOut, className }) {
+  const title = name || email || "";
+  const current = language?.options.find((o) => o.value === language.value)?.label;
+  return /* @__PURE__ */ jsxs3(DropdownMenu.Root, { children: [
+    /* @__PURE__ */ jsxs3(
+      DropdownMenu.Trigger,
+      {
+        "aria-label": label,
+        className: cn("flex items-center gap-2.5 rounded-lg p-1 transition-colors duration-150 hover:bg-surface-2 focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring", className),
+        children: [
+          /* @__PURE__ */ jsx3(Avatar, { size: "sm", fallback: title.charAt(0).toUpperCase() || "?", ...avatar2 }),
+          showName && title && /* @__PURE__ */ jsx3("span", { "aria-hidden": true, "data-name": title, className: "hidden max-w-40 truncate text-sm font-medium text-fg-secondary after:content-[attr(data-name)] sm:inline-block" })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxs3(DropdownMenu.Content, { align: "end", className: "w-64", children: [
+      /* @__PURE__ */ jsxs3(DropdownMenu.Label, { className: "flex items-center gap-3 py-2 normal-case tracking-normal", children: [
+        /* @__PURE__ */ jsx3(Avatar, { size: "md", fallback: title.charAt(0).toUpperCase() || "?", ...avatar2 }),
+        /* @__PURE__ */ jsxs3("span", { className: "min-w-0", children: [
+          /* @__PURE__ */ jsx3("span", { className: "block truncate text-sm font-semibold text-fg", children: title }),
+          name && email && /* @__PURE__ */ jsx3("span", { className: "block truncate text-xs font-normal text-fg-secondary", children: email })
+        ] })
+      ] }),
+      links.length > 0 && /* @__PURE__ */ jsx3(DropdownMenu.Separator, {}),
+      links.map((link) => /* @__PURE__ */ jsx3(DropdownMenu.Item, { asChild: true, children: /* @__PURE__ */ jsxs3(Link, { href: link.href, children: [
+        link.icon,
+        link.label
+      ] }) }, link.id)),
+      (language || children) && /* @__PURE__ */ jsx3(DropdownMenu.Separator, {}),
+      language && /* @__PURE__ */ jsxs3(DropdownMenu.Sub, { children: [
+        /* @__PURE__ */ jsxs3(DropdownMenu.SubTrigger, { children: [
+          language.label,
+          current && /* @__PURE__ */ jsx3("span", { className: "ml-auto mr-1 text-xs text-fg-secondary", children: current })
+        ] }),
+        /* @__PURE__ */ jsx3(DropdownMenu.SubContent, { children: /* @__PURE__ */ jsx3(DropdownMenu.RadioGroup, { value: language.value, onValueChange: language.onChange, children: language.options.map((o) => /* @__PURE__ */ jsx3(DropdownMenu.RadioItem, { value: o.value, children: o.label }, o.value)) }) })
+      ] }),
+      children,
+      /* @__PURE__ */ jsx3(DropdownMenu.Separator, {}),
+      /* @__PURE__ */ jsxs3(DropdownMenu.Item, { onSelect: () => signOut.onSelect(), children: [
+        signOut.icon,
+        signOut.label
+      ] })
+    ] })
+  ] });
+}
+export {
+  AccountMenu
+};
+//# sourceMappingURL=account-menu.js.map

package/dist/account-menu.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/avatar/avatar.tsx","../src/avatar/default-avatar.ts","../src/dropdown-menu/dropdown-menu.tsx","../src/floating.ts","../src/account-menu/account-menu.tsx"],"sourcesContent":["// Client: Radix tracks the image's loading state and shows the fallback until it has loaded (or when it fails).\nimport { Avatar as AvatarPrimitive } from \"radix-ui\";\nimport * as React from \"react\";\nimport { tv, type VariantProps } from \"tailwind-variants\";\n\nimport { type DefaultAvatar, defaultAvatarUrl } from \"./default-avatar\";\n\nconst avatar = tv({\n  slots: {\n    root: \"relative inline-flex shrink-0 overflow-hidden rounded-full bg-surface-3 align-middle\",\n    image: \"h-full w-full object-cover\",\n    fallback: \"flex h-full w-full items-center justify-center font-semibold uppercase text-fg-secondary\",\n    group: \"flex items-center -space-x-2 [&>*]:ring-2 [&>*]:ring-surface-0\",\n  },\n  variants: {\n    size: {\n      xs: { root: \"h-5 w-5 text-[9px]\" },\n      sm: { root: \"h-8 w-8 text-xs\" },\n      md: { root: \"h-10 w-10 text-sm\" },\n      lg: { root: \"h-14 w-14 text-base\" },\n      xl: { root: \"h-20 w-20 text-lg\" },\n    },\n  },\n  defaultVariants: { size: \"md\" },\n});\n\nexport type AvatarSize = NonNullable<VariantProps<typeof avatar>[\"size\"]>;\n\nexport type AvatarProps = Omit<React.ComponentProps<\"span\">, \"children\"> & {\n  /** The image's URL; `null` or nothing shows the `fallback`. */\n  src?: string | null;\n  /** The image's text alternative (the person's name); empty when a visible name sits next to the avatar. */\n  alt?: string;\n  /** Shown while the image loads, when it fails or when there is none: initials, an icon. */\n  fallback?: React.ReactNode;\n  /** The picture to show instead when `src` is missing or fails to load (an image URL). The `fallback` still covers its own loading. */\n  fallbackSrc?: string;\n  /**\n   * The Krizaka default picture when the person has no photo (or it fails): their brand's gradient and a silhouette,\n   * one of six tones from `seed` — `defaultAvatar={{ brand: \"orochia\", seed: user.id }}`. `fallbackSrc` wins over it.\n   */\n  defaultAvatar?: DefaultAvatar;\n  /**\n   * xs · sm · md · lg · xl.\n   * @default \"md\"\n   */\n  size?: AvatarSize;\n};\n\nexport function AvatarRoot({ src, alt = \"\", fallback, fallbackSrc, defaultAvatar, size, className, ...props }: AvatarProps) {\n  const s = avatar({ size });\n  const [failed, setFailed] = React.useState<string | null>(null);\n  // 512 px for the big sizes, 256 for the others: sharp on a 2x screen either way.\n  const backup = fallbackSrc ?? (defaultAvatar ? defaultAvatarUrl(defaultAvatar, { size: size === \"xl\" || size === \"lg\" ? 512 : 256 }) : undefined);\n  const shown = src && failed !== src ? src : backup;\n  return (\n    <AvatarPrimitive.Root data-size={size ?? \"md\"} className={s.root({ className })} {...props}>\n      {shown && (\n        <AvatarPrimitive.Image\n          src={shown}\n          alt={alt}\n          className={s.image()}\n          onLoadingStatusChange={(status) => {\n            if (status === \"error\" && shown === src) setFailed(src);\n          }}\n        />\n      )}\n      <AvatarPrimitive.Fallback delayMs={shown ? 300 : 0} className={s.fallback()}>\n        {fallback}\n      </AvatarPrimitive.Fallback>\n    </AvatarPrimitive.Root>\n  );\n}\n\nexport type AvatarGroupProps = React.ComponentProps<\"div\"> & {\n  /** How many avatars are shown; the rest becomes a `+n` avatar. */\n  max?: number;\n  /** The size of the `+n` avatar (match the avatars of the group). */\n  size?: AvatarSize;\n};\n\n/** Overlapping avatars; past `max`, a `+n` avatar counts the rest. */\nexport function AvatarGroup({ max, size, className, children, ...props }: AvatarGroupProps) {\n  const items = React.Children.toArray(children);\n  const shown = max === undefined ? items : items.slice(0, max);\n  const rest = items.length - shown.length;\n  return (\n    <div className={avatar().group({ className })} {...props}>\n      {shown}\n      {rest > 0 && <AvatarRoot size={size} fallback={`+${rest}`} />}\n    </div>\n  );\n}\n\n/** `Avatar` (an image with a fallback) and `Avatar.Group`. */\nexport const Avatar = Object.assign(AvatarRoot, { Group: AvatarGroup });\n","// The default profile pictures of the Krizaka family: what a product shows when a person has no photo.\n// They are generated from this file (tools/export-brand.mjs renders them to SVG and WebP and uploads them to Bunny,\n// `people/defaults/v1/<brand>/…`), so the pictures and the URLs that name them cannot drift apart.\n\nexport type DefaultAvatarBrand = \"krizaka\" | \"orazaka\" | \"orochia\" | \"yasakia\" | \"yororis\" | \"yomizaka\" | \"kachizaka\" | \"akinaza\";\n/** `person`: a neutral silhouette. `plain`: the brand's gradient alone, ready for initials. */\nexport type DefaultAvatarKind = \"person\" | \"plain\";\nexport type DefaultAvatarSize = 256 | 512;\n\nexport const DEFAULT_AVATAR_BRANDS: readonly DefaultAvatarBrand[] = [\"krizaka\", \"orazaka\", \"orochia\", \"yasakia\", \"yororis\", \"yomizaka\", \"kachizaka\", \"akinaza\"];\nexport const DEFAULT_AVATAR_KINDS: readonly DefaultAvatarKind[] = [\"person\", \"plain\"];\nexport const DEFAULT_AVATAR_SIZES: readonly DefaultAvatarSize[] = [256, 512];\n/** How many tones each brand has: a person always gets the same one from their seed, so a list is not one colour. */\nexport const DEFAULT_AVATAR_TONES = 6;\n\n/** Where the set lives. `v1` is the set's version: a changed picture is a new version folder, never an overwrite. */\nexport const DEFAULT_AVATAR_BASE = \"https://krizaka-assets.b-cdn.net/people/defaults/v1\";\n\nexport interface DefaultAvatar {\n  /** The brand of the product showing the avatar: its gradient, its hues. */\n  brand: DefaultAvatarBrand;\n  /** Any stable text or number of the person (their id): the same seed gives the same tone everywhere. */\n  seed?: string | number;\n  /** Force a tone, 1 to 6, instead of deriving it from `seed`. */\n  tone?: number;\n  /**\n   * `person` (default): a silhouette. `plain`: the gradient alone.\n   * @default \"person\"\n   */\n  kind?: DefaultAvatarKind;\n}\n\n/** The mark gradient of each brand (BRAND.md, `$extensions[\"com.krizaka\"].mark`) as [hue, saturation %, lightness %] and the hue spread of its tones. */\nconst BRANDS: Record<DefaultAvatarBrand, { from: [number, number, number]; to: [number, number, number]; spread: number }> = {\n  krizaka: { from: [217, 92, 53], to: [217, 92, 68], spread: 14 },\n  orazaka: { from: [26, 90.5, 37.1], to: [26, 92, 45], spread: 7 },\n  orochia: { from: [262.1, 83.3, 57.8], to: [328.6, 85.5, 70.2], spread: 12 },\n  yasakia: { from: [156, 92, 32], to: [178, 90, 32], spread: 12 },\n  yororis: { from: [34, 46, 44], to: [104, 28, 42], spread: 10 },\n  yomizaka: { from: [232, 50, 55], to: [248, 50, 58], spread: 10 },\n  kachizaka: { from: [226, 80, 56], to: [44, 92, 33], spread: 10 },\n  akinaza: { from: [140, 48, 34], to: [22, 60, 46], spread: 10 },\n};\n\n/** White on top of a stop must stay visible: a stop is darkened until the contrast reaches this (WCAG 1.4.11, non-text). */\nconst MIN_CONTRAST = 3.2;\nconst OFFSETS = [0, -1, 1, -2, 2, 3] as const;\n\nfunction hslToHex([h, s, l]: [number, number, number]): string {\n  const sat = s / 100;\n  const light = l / 100;\n  const k = (n: number) => (n + (((h % 360) + 360) % 360) / 30) % 12;\n  const a = sat * Math.min(light, 1 - light);\n  const channel = (n: number) => Math.round(255 * (light - a * Math.max(-1, Math.min(k(n) - 3, Math.min(9 - k(n), 1)))));\n  return `#${[0, 8, 4].map((n) => channel(n).toString(16).padStart(2, \"0\")).join(\"\")}`;\n}\n\nconst channelLuminance = (v: number) => (v <= 0.03928 ? v / 12.92 : ((v + 0.055) / 1.055) ** 2.4);\nconst whiteContrast = (hex: string) => {\n  const [r, g, b] = [1, 3, 5].map((i) => channelLuminance(Number.parseInt(hex.slice(i, i + 2), 16) / 255));\n  return 1.05 / (0.2126 * r! + 0.7152 * g! + 0.0722 * b! + 0.05);\n};\n/** The stop, darkened one point of lightness at a time until white reads on it. */\nfunction readable([h, s, l]: [number, number, number]): string {\n  let hex = hslToHex([h, s, l]);\n  for (let light = l; whiteContrast(hex) < MIN_CONTRAST && light > 10; light -= 1) hex = hslToHex([h, s, light]);\n  return hex;\n}\n\n/** The two stops (hex) of tone `tone` (1 to 6) of a brand. */\nexport function defaultAvatarTone(brand: DefaultAvatarBrand, tone: number): readonly [string, string] {\n  const b = BRANDS[brand];\n  const o = OFFSETS[(clampTone(tone) - 1) % OFFSETS.length] * b.spread;\n  return [readable([b.from[0] + o, b.from[1], b.from[2]]), readable([b.to[0] + o, b.to[1], b.to[2]])];\n}\n\nconst clampTone = (tone: number) => Math.min(DEFAULT_AVATAR_TONES, Math.max(1, Math.round(tone)));\n\n/** 1 to 6 from a seed (FNV-1a): stable across renders, devices and products. */\nexport function defaultAvatarToneOf(seed: string | number | undefined): number {\n  if (seed === undefined) return 1;\n  let h = 0x811c9dc5;\n  for (const ch of String(seed)) {\n    h ^= ch.codePointAt(0) ?? 0;\n    h = Math.imul(h, 0x01000193) >>> 0;\n  }\n  return (h % DEFAULT_AVATAR_TONES) + 1;\n}\n\nconst resolveTone = (a: DefaultAvatar) => (a.tone === undefined ? defaultAvatarToneOf(a.seed) : clampTone(a.tone));\n\n/** The file name of a picture in the set: `person-3` + 256 → `person-3-256.webp`; `svg` has no size. */\nexport function defaultAvatarFile(kind: DefaultAvatarKind, tone: number, size: DefaultAvatarSize | \"svg\"): string {\n  return size === \"svg\" ? `${kind}-${tone}.svg` : `${kind}-${tone}-${size}.webp`;\n}\n\n/** Linear on purpose: a `/\\/+$/` regex backtracks quadratically on a long run of slashes. */\nfunction trimTrailingSlashes(value: string): string {\n  let end = value.length;\n  while (end > 0 && value.charCodeAt(end - 1) === 47) end--;\n  return value.slice(0, end);\n}\n\n/**\n * The URL of a default avatar: `defaultAvatarUrl({ brand: \"orochia\", seed: user.id })`.\n * @param size 256 for lists, 512 for a profile; `\"svg\"` for the vector.\n * @param base Another host or version of the set (a self-hosted copy); the default is the Krizaka CDN.\n */\nexport function defaultAvatarUrl(avatar: DefaultAvatar, { size = 256, base = DEFAULT_AVATAR_BASE }: { size?: DefaultAvatarSize | \"svg\"; base?: string } = {}): string {\n  return `${trimTrailingSlashes(base)}/${avatar.brand}/${defaultAvatarFile(avatar.kind ?? \"person\", resolveTone(avatar), size)}`;\n}\n\n/** The SVG source of a default avatar, 512 × 512 and square (the Avatar clips it round). */\nexport function defaultAvatarSvg(avatar: DefaultAvatar): string {\n  const [from, to] = defaultAvatarTone(avatar.brand, resolveTone(avatar));\n  const person =\n    (avatar.kind ?? \"person\") === \"person\"\n      ? `<circle cx=\"256\" cy=\"200\" r=\"86\" fill=\"#fff\" fill-opacity=\".92\"/><path d=\"M84 512c0-108 78-182 172-182s172 74 172 182z\" fill=\"#fff\" fill-opacity=\".92\"/>`\n      : \"\";\n  return `<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\" width=\"512\" height=\"512\"><defs><linearGradient id=\"g\" x1=\"0\" y1=\"0\" x2=\"1\" y2=\"1\"><stop offset=\"0\" stop-color=\"${from}\"/><stop offset=\"1\" stop-color=\"${to}\"/></linearGradient><radialGradient id=\"l\" cx=\".28\" cy=\".18\" r=\".85\"><stop offset=\"0\" stop-color=\"#fff\" stop-opacity=\".24\"/><stop offset=\"1\" stop-color=\"#fff\" stop-opacity=\"0\"/></radialGradient></defs><rect width=\"512\" height=\"512\" fill=\"url(#g)\"/><rect width=\"512\" height=\"512\" fill=\"url(#l)\"/>${person}</svg>`;\n}\n","// Client (a portal). Radix does the roving focus, the arrows, Home/End, typeahead, Escape and the focus return.\nimport { DropdownMenu as MenuPrimitive } from \"radix-ui\";\nimport type * as React from \"react\";\nimport { tv } from \"tailwind-variants\";\n\nimport { cn } from \"../cn\";\nimport { floating } from \"../floating\";\n\nexport const menu = tv({\n  slots: {\n    content: cn(floating, \"min-w-48 max-h-(--radix-dropdown-menu-content-available-height) overflow-y-auto overflow-x-hidden overscroll-contain p-1 origin-(--radix-dropdown-menu-content-transform-origin)\"),\n    item:\n      \"relative flex cursor-pointer select-none items-center gap-2 rounded-md px-2.5 py-2 text-sm text-fg outline-hidden transition-colors \" +\n      \"data-highlighted:bg-surface-3 data-disabled:pointer-events-none data-disabled:opacity-40 [&>svg]:h-4 [&>svg]:w-4 [&>svg]:shrink-0 \" +\n      \"[&>svg]:text-fg-secondary\",\n    indicator: \"ml-auto flex h-4 w-4 items-center justify-center text-fg-accent\",\n    label: \"px-2.5 pb-1 pt-2 text-[11px] font-semibold uppercase tracking-wider text-fg-secondary\",\n    separator: \"-mx-1 my-1 h-px bg-border-subtle\",\n  },\n  variants: {\n    // The label reads in the danger text role (≥ 4.5:1 on the menu surface, both themes); the icon and the highlight\n    // carry the danger fill.\n    tone: { default: {}, danger: { item: \"text-fg-danger data-highlighted:bg-danger/15 [&>svg]:text-danger\" } },\n  },\n  defaultVariants: { tone: \"default\" },\n});\nconst s = menu();\n\nexport type DropdownMenuContentProps = React.ComponentProps<typeof MenuPrimitive.Content> & {\n  /** The element the portal renders into (default: document.body). */\n  container?: HTMLElement | null;\n};\n\nexport function DropdownMenuContent({ sideOffset = 6, align = \"end\", collisionPadding = 8, container, className, ...props }: DropdownMenuContentProps) {\n  return (\n    <MenuPrimitive.Portal container={container}>\n      <MenuPrimitive.Content sideOffset={sideOffset} align={align} collisionPadding={collisionPadding} className={s.content({ className })} {...props} />\n    </MenuPrimitive.Portal>\n  );\n}\n\nexport type DropdownMenuItemProps = React.ComponentProps<typeof MenuPrimitive.Item> & {\n  /** `danger` for a destructive action: the icon and the highlight carry the danger, the label stays legible. */\n  tone?: \"default\" | \"danger\";\n};\n\n/** An action. `tone=\"danger\"` for a destructive one; `onSelect` runs it (the menu closes). */\nexport function DropdownMenuItem({ tone, className, ...props }: DropdownMenuItemProps) {\n  return <MenuPrimitive.Item data-tone={tone ?? \"default\"} className={menu({ tone }).item({ className })} {...props} />;\n}\n\n/** A toggled option: `checked` + `onCheckedChange`. */\nexport function DropdownMenuCheckboxItem({ className, children, ...props }: React.ComponentProps<typeof MenuPrimitive.CheckboxItem>) {\n  return (\n    <MenuPrimitive.CheckboxItem className={s.item({ className })} {...props}>\n      {children}\n      <MenuPrimitive.ItemIndicator className={s.indicator()}>\n        <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" aria-hidden>\n          <path d=\"M20 6 9 17l-5-5\" />\n        </svg>\n      </MenuPrimitive.ItemIndicator>\n    </MenuPrimitive.CheckboxItem>\n  );\n}\n\n/** A submenu's trigger: an item that opens `DropdownMenu.SubContent`, with a chevron. */\nexport function DropdownMenuSubTrigger({ className, children, ...props }: React.ComponentProps<typeof MenuPrimitive.SubTrigger>) {\n  return (\n    <MenuPrimitive.SubTrigger className={s.item({ className: cn(\"data-[state=open]:bg-surface-3\", className) })} {...props}>\n      {children}\n      <svg className=\"ml-auto !h-4 !w-4 text-fg-secondary\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" aria-hidden>\n        <path d=\"m9 18 6-6-6-6\" />\n      </svg>\n    </MenuPrimitive.SubTrigger>\n  );\n}\n\n/** The submenu's panel (same material as the menu). */\nexport function DropdownMenuSubContent({ sideOffset = 4, collisionPadding = 8, className, ...props }: React.ComponentProps<typeof MenuPrimitive.SubContent>) {\n  return (\n    <MenuPrimitive.Portal>\n      <MenuPrimitive.SubContent sideOffset={sideOffset} collisionPadding={collisionPadding} className={s.content({ className: cn(\"max-h-(--radix-dropdown-menu-content-available-height)\", className) })} {...props} />\n    </MenuPrimitive.Portal>\n  );\n}\n\n/** One choice among several (`DropdownMenu.RadioGroup` holds the value): a language, a sort order. */\nexport function DropdownMenuRadioItem({ className, children, ...props }: React.ComponentProps<typeof MenuPrimitive.RadioItem>) {\n  return (\n    <MenuPrimitive.RadioItem className={s.item({ className })} {...props}>\n      {children}\n      <MenuPrimitive.ItemIndicator className={s.indicator()}>\n        <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\" aria-hidden>\n          <path d=\"M20 6 9 17l-5-5\" />\n        </svg>\n      </MenuPrimitive.ItemIndicator>\n    </MenuPrimitive.RadioItem>\n  );\n}\n\nexport function DropdownMenuLabel({ className, ...props }: React.ComponentProps<typeof MenuPrimitive.Label>) {\n  return <MenuPrimitive.Label className={s.label({ className })} {...props} />;\n}\n\nexport function DropdownMenuSeparator({ className, ...props }: React.ComponentProps<typeof MenuPrimitive.Separator>) {\n  return <MenuPrimitive.Separator className={s.separator({ className })} {...props} />;\n}\n\n/** `DropdownMenu.Root/Trigger/Content/Item/CheckboxItem/Label/Separator/Group`. `open`/`defaultOpen` + `onOpenChange`. */\nexport const DropdownMenu = {\n  Root: MenuPrimitive.Root,\n  Trigger: MenuPrimitive.Trigger,\n  Content: DropdownMenuContent,\n  Item: DropdownMenuItem,\n  CheckboxItem: DropdownMenuCheckboxItem,\n  Label: DropdownMenuLabel,\n  Separator: DropdownMenuSeparator,\n  Group: MenuPrimitive.Group,\n  Sub: MenuPrimitive.Sub,\n  SubTrigger: DropdownMenuSubTrigger,\n  SubContent: DropdownMenuSubContent,\n  RadioGroup: MenuPrimitive.RadioGroup,\n  RadioItem: DropdownMenuRadioItem,\n};\n","// The one surface of everything that floats next to its trigger (popover, menu, tooltip): a raised surface, a border,\n// the large shadow and the `kz-pop` entrance from the side Radix measured (`--radix-*-transform-origin`).\nexport const floating =\n  \"kz-pop z-50 rounded-lg border border-border-default bg-surface-2 text-fg shadow-lg outline-hidden\";\n","// Client (a portal). The signed-in person's menu under their avatar — who you are first (picture, name, e-mail), then\n// the places (profile, settings), the language as a compact submenu, the extras, and Sign out (a quiet item, not a\n// red alert). Built on DropdownMenu, so the keyboard, the focus return and the collisions are Radix's.\nimport * as React from \"react\";\n\nimport { Avatar, type AvatarProps } from \"../avatar/avatar\";\nimport { cn } from \"../cn\";\nimport { DropdownMenu } from \"../dropdown-menu/dropdown-menu\";\n\nexport interface AccountMenuLink {\n  id: string;\n  label: string;\n  href: string;\n  /** A signature icon. */\n  icon?: React.ReactNode;\n}\n\nexport interface AccountMenuLanguage {\n  /** The row's words (`Language`). */\n  label: string;\n  /** The current value (`en`). */\n  value: string;\n  options: readonly { value: string; label: string }[];\n  onChange: (value: string) => void;\n}\n\nexport interface AccountMenuProps {\n  /** The trigger's accessible name (`Account`). */\n  label: string;\n  /** Their name; falls back to the e-mail. */\n  name?: string;\n  /** Their e-mail, shown under the name. */\n  email?: string;\n  /** The picture: `src`, or `defaultAvatar` (`{ brand, seed }`) for the product's default person. */\n  avatar?: Omit<AvatarProps, \"size\">;\n  /** Show the name beside the avatar in the trigger from the `sm` breakpoint. */\n  showName?: boolean;\n  /** Where to go: profile, settings… */\n  links?: readonly AccountMenuLink[];\n  /** The app's link component (Next's `Link`); an `<a>` otherwise. */\n  linkAs?: React.ElementType;\n  /** The language, as a submenu that shows the current one. */\n  language?: AccountMenuLanguage;\n  /** Extra rows between the language and Sign out (a theme switch…). */\n  children?: React.ReactNode;\n  /** The last row: its words, what it does, an optional icon. */\n  signOut: { label: string; onSelect: () => void; icon?: React.ReactNode };\n  /** Classes for the trigger. */\n  className?: string;\n}\n\n/** The account menu: avatar trigger → identity header, links, language submenu, Sign out. */\nexport function AccountMenu({ label, name, email, avatar, showName = true, links = [], linkAs: Link = \"a\", language, children, signOut, className }: AccountMenuProps) {\n  const title = name || email || \"\";\n  const current = language?.options.find((o) => o.value === language.value)?.label;\n  return (\n    <DropdownMenu.Root>\n      <DropdownMenu.Trigger\n        aria-label={label}\n        className={cn(\"flex items-center gap-2.5 rounded-lg p-1 transition-colors duration-150 hover:bg-surface-2 focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring\", className)}\n      >\n        <Avatar size=\"sm\" fallback={title.charAt(0).toUpperCase() || \"?\"} {...avatar} />\n        {/* Drawn by CSS: the name is not text of the button, so its accessible name stays `label` with no label-content-name-mismatch. */}\n        {showName && title && <span aria-hidden data-name={title} className=\"hidden max-w-40 truncate text-sm font-medium text-fg-secondary after:content-[attr(data-name)] sm:inline-block\" />}\n      </DropdownMenu.Trigger>\n      <DropdownMenu.Content align=\"end\" className=\"w-64\">\n        <DropdownMenu.Label className=\"flex items-center gap-3 py-2 normal-case tracking-normal\">\n          <Avatar size=\"md\" fallback={title.charAt(0).toUpperCase() || \"?\"} {...avatar} />\n          <span className=\"min-w-0\">\n            <span className=\"block truncate text-sm font-semibold text-fg\">{title}</span>\n            {name && email && <span className=\"block truncate text-xs font-normal text-fg-secondary\">{email}</span>}\n          </span>\n        </DropdownMenu.Label>\n        {links.length > 0 && <DropdownMenu.Separator />}\n        {links.map((link) => (\n          <DropdownMenu.Item key={link.id} asChild>\n            <Link href={link.href}>\n              {link.icon}\n              {link.label}\n            </Link>\n          </DropdownMenu.Item>\n        ))}\n        {(language || children) && <DropdownMenu.Separator />}\n        {language && (\n          <DropdownMenu.Sub>\n            <DropdownMenu.SubTrigger>\n              {language.label}\n              {current && <span className=\"ml-auto mr-1 text-xs text-fg-secondary\">{current}</span>}\n            </DropdownMenu.SubTrigger>\n            <DropdownMenu.SubContent>\n              <DropdownMenu.RadioGroup value={language.value} onValueChange={language.onChange}>\n                {language.options.map((o) => (\n                  <DropdownMenu.RadioItem key={o.value} value={o.value}>\n                    {o.label}\n                  </DropdownMenu.RadioItem>\n                ))}\n              </DropdownMenu.RadioGroup>\n            </DropdownMenu.SubContent>\n          </DropdownMenu.Sub>\n        )}\n        {children}\n        <DropdownMenu.Separator />\n        <DropdownMenu.Item onSelect={() => signOut.onSelect()}>\n          {signOut.icon}\n          {signOut.label}\n        </DropdownMenu.Item>\n      </DropdownMenu.Content>\n    </DropdownMenu.Root>\n  );\n}\n"],"mappings":"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","names":["avatar","s","tv","jsx","jsxs","tv","jsx","jsxs","avatar"]}

package/dist/app-shell.js

@@ -1,15 +1,15 @@
 "use client";
+import {
+  SkipLink
+} from "./chunk-QDXV544C.js";
 import {
   ChevronGlyph,
   CloseGlyph,
   SearchGlyph
-} from "./chunk-AFY35UCB.js";
+} from "./chunk-P7GZR5CU.js";
 import {
   cn
 } from "./chunk-WU4VLSEA.js";
-import {
-  SkipLink
-} from "./chunk-QDXV544C.js";
 
 // src/app-shell/app-shell.tsx
 import { Dialog as DialogPrimitive, Slot } from "radix-ui";

package/dist/changelog-page.d.ts

@@ -100,5 +100,17 @@ declare function changelogRss(opts: {
 }): string;
 /** The template's kind for a tag: feature → added, fix → fixed, security and breaking stay themselves, the rest → changed. */
 declare const kindOfTag: (tag: ChangeTag) => ChangeKind;
+interface MergedPull {
+    title: string;
+    html_url: string;
+    /** ISO timestamp, `null` for a pull request closed without merging. */
+    merged_at: string | null;
+}
+/**
+ * For a repository that publishes no releases (a product still in development): its merged pull requests, by week.
+ * Each week is one entry (`version` = the Monday, `date` = the last merge), its changes the conventional titles in plain
+ * language — housekeeping (chore, ci, test, docs…) is left out, weeks with nothing to say are dropped.
+ */
+declare function releasesFromPulls(pulls: readonly MergedPull[], source: string, url?: string): Release[];
 
-export { CHANGE_TAGS, type ChangeItem, type ChangeKind, type ChangeTag, type ChangelogEntry, ChangelogPage, type ChangelogPageProps, type Release, anchorOf, changeFromTitle, changelogRss, draftFromTitles, kindOfTag, newestFirst, parseChangesets, parseReleaseBody, plain, prOf, tagOf };
+export { CHANGE_TAGS, type ChangeItem, type ChangeKind, type ChangeTag, type ChangelogEntry, ChangelogPage, type ChangelogPageProps, type MergedPull, type Release, anchorOf, changeFromTitle, changelogRss, draftFromTitles, kindOfTag, newestFirst, parseChangesets, parseReleaseBody, plain, prOf, releasesFromPulls, tagOf };

package/dist/changelog-page.js

@@ -101,6 +101,25 @@ function changelogRss(opts) {
   return `<?xml version="1.0" encoding="UTF-8"?><rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom"><channel><title>${esc(opts.title)}</title><link>${esc(opts.pageUrl)}</link><description>${esc(opts.description)}</description><language>${opts.language}</language><atom:link href="${esc(opts.feedUrl)}" rel="self" type="application/rss+xml"/>${items}</channel></rss>`;
 }
 var kindOfTag = (tag) => tag === "feature" ? "added" : tag === "fix" ? "fixed" : tag === "change" ? "changed" : tag;
+var mondayOf = (iso) => {
+  const d = /* @__PURE__ */ new Date(`${iso.slice(0, 10)}T12:00:00Z`);
+  d.setUTCDate(d.getUTCDate() - (d.getUTCDay() + 6) % 7);
+  return d.toISOString().slice(0, 10);
+};
+function releasesFromPulls(pulls, source, url) {
+  const weeks = /* @__PURE__ */ new Map();
+  for (const p of pulls) {
+    if (!p.merged_at) continue;
+    const item = changeFromTitle(p.title, p.html_url);
+    if (!item) continue;
+    const key = mondayOf(p.merged_at);
+    const week = weeks.get(key) ?? { date: p.merged_at.slice(0, 10), changes: [] };
+    if (p.merged_at.slice(0, 10) > week.date) week.date = p.merged_at.slice(0, 10);
+    week.changes.push(item);
+    weeks.set(key, week);
+  }
+  return [...weeks].map(([version, w]) => ({ source, version, date: w.date, url, changes: w.changes })).sort(newestFirst);
+}
 
 // src/changelog-page/changelog-page.tsx
 import { Page } from "@krizaka/ui/page";
@@ -138,6 +157,7 @@ export {
   parseReleaseBody,
   plain,
   prOf,
+  releasesFromPulls,
   tagOf
 };
 //# sourceMappingURL=changelog-page.js.map