@imfusion/web-ui 0.11.1-dev.49.gcda1589f → 0.11.1-dev.52.g8c3c8d4b

package/CHANGELOG.md

@@ -53,9 +53,15 @@
 - Focus ring tokens: `--imf-ui-focus-ring-width`, `--imf-ui-focus-ring-color`, and two offsets for a ring outside the
   element or inside it (`-offset`, `-offset-inset`).
   ([WEBSDK-274](https://imfusion.atlassian.net/browse/WEBSDK-274)) — Nikolaus Brunner <brunner@imfusion.com>
+- `initialsFromName` gives one or two initials from a display name for `Avatar.Fallback`: `Mona Keller` gives `MK`, a single
+  word gives its first two letters, and an empty name gives `?`. [Avatar](src/components/avatar/avatar.mdx) — Nikolaus
+  Brunner <brunner@imfusion.com>
 
 ### Changed
 
+- `initialsFromEmail` gives the first two letters of a single-segment local part, `jkeller@…` gives `JK`, and `?` for an
+  empty one, the same rule as `initialsFromName`. [Avatar](src/components/avatar/avatar.mdx) — Nikolaus Brunner
+  <brunner@imfusion.com>
 - `Input`, `Field.Control`, `NumberField`, `Select`, `Combobox`, and `Autocomplete` show focus by turning their 1px border
   primary, with no outline. [Input](src/components/input/input.mdx) — Nikolaus Brunner <brunner@imfusion.com>
 - `Drawer` draws no border by default; `borderColor` adds one, such as `borderColor="primary"` for the previous look.
@@ -91,13 +97,15 @@
     lazily, and only the largest paint gets `fetchpriority="high"`.
   - The `imf-web-ui-conventions` `components` topic names the landmarks `AppShell` renders and asks for one `Typo.H1` per
     page, `Button` for actions, and `Link` for destinations.
+  - The `imf-web-ui-conventions` `library-boundary` topic reports a native element or local function that duplicates a Web
+    UI component, part, or helper such as `initialsFromName`.
   - `web-ui-dev-new-component`, `web-ui-dev-update-component`, and `web-ui-dev-design-component` draft on the shared
     Web UI Component Drafts canvas: a block per component on its Storybook group's page, one row per fidelity rung.
   - `web-ui-dev-new-component` and `web-ui-dev-update-component` wait for the user to approve the design on the canvas
     before writing the plan.
   - Agents verify visual work on their own Storybook, started with `npm run dev`, against the approved canvas design.
-  - `web-ui-dev-teardown-worktree` lands local base-branch commits together with the worktree branch, and Bitbucket pull
-    requests merge with rebase and fast-forward.
+  - `web-ui-dev-teardown-worktree` lands local base-branch commits together with the worktree branch, and a branch with
+    an open Bitbucket pull request merges in Bitbucket with `bkt pr merge`.
   - `web-ui-dev-new-component` and `web-ui-dev-update-component` open a drafts-canvas block with an API table and short
     usage snippets.
   - The `imf-web-ui-conventions` `styling` topic shows a container setting a custom property that its child reads with

package/dist/components/avatar/avatar.d.ts

@@ -23,7 +23,7 @@ declare namespace Root {
 }
 /**
  * Avatar.Fallback — the initials the consumer passes, one or two letters. Without children it shows a person glyph.
- * It derives nothing from a name or email.
+ * It derives nothing from a name or email; `initialsFromName` and `initialsFromEmail` do.
  */
 declare function Fallback({ children, ...props }: React.ComponentProps<typeof AvatarPrimitive.Fallback>): import("react/jsx-runtime").JSX.Element;
 declare namespace Fallback {

package/dist/index.d.ts

@@ -57,6 +57,7 @@ export { minWidth } from './breakpoints';
 export type { BreakpointName } from './breakpoints';
 export { cva, cx } from 'class-variance-authority';
 export { initialsFromEmail, splitEmail } from './utils/email';
+export { initialsFromName } from './utils/initials';
 export { withBreakHints } from './utils/break-hints';
 export { config } from './config';
 export type { ColorScheme, ColorSchemePreference } from './types/theme';

package/dist/index.js

@@ -5754,16 +5754,25 @@ function cp({ children: e, icons: t, colorScheme: n }) {
 	});
 }
 //#endregion
-//#region src/utils/email.ts
+//#region src/utils/initials.ts
 function lp(e) {
+	let t = e.filter(Boolean);
+	return t.length === 0 ? "?" : t.length === 1 ? t[0].slice(0, 2).toLocaleUpperCase() : t.slice(0, 2).map((e) => e.charAt(0)).join("").toLocaleUpperCase();
+}
+function up(e) {
+	return lp(e.trim().split(/\s+/));
+}
+//#endregion
+//#region src/utils/email.ts
+function dp(e) {
 	let t = e.lastIndexOf("@");
 	return t <= 0 || t === e.length - 1 ? { local: e } : {
 		local: e.slice(0, t),
 		domain: e.slice(t + 1)
 	};
 }
-function up(e) {
-	return lp(e).local.split(/[._-]+/).filter(Boolean).slice(0, 2).map((e) => e.charAt(0).toUpperCase()).join("");
+function fp(e) {
+	return lp(dp(e).local.split(/[._-]+/));
 }
 //#endregion
-export { eu as AccountCard, tc as AppShell, mn as Autocomplete, Kl as Avatar, ge as Button, di as Callout, bi as Card, Hn as Checkbox, fu as Chip, vt as ChipLink, be as Code, hu as Collapsible, or as ColorSchemeToggle, cr as Combobox, g as ComponentCategories, St as CopyButton, Fc as Dialog, ls as Drawer, Hr as Field, ii as Fieldset, Pa as FileDropZone, s as Icon, _e as IconButton, Ws as ImFusionLogo, eo as Input, _ as Kbd, zs as Logo, wu as Meter, xd as NavigationMenu, no as NumberField, pl as Popover, Zs as ProductLogo, Ai as Progress, Bl as Prose, Et as RichLink, De as Row, ke as ScrollArea, xo as Select, Ve as Separator, wd as Skeleton, Ie as Slider, Rd as Spinner, Ee as Stack, Re as Switch, pf as TabNav, Bd as Table, Be as Tabs, as as Textarea, yf as Toast, ue as Toggle, de as ToggleGroup, Wf as Tooltip, Ui as Typo, cp as WebUIProvider, uu as accountCardMeta, Pc as appShellMeta, Vn as autocompleteMeta, du as avatarMeta, ve as buttonMeta, yi as calloutMeta, ki as cardMeta, Gn as checkboxMeta, yt as chipLinkMeta, pu as chipMeta, Ce as codeMeta, Su as collapsibleMeta, sr as colorSchemeToggleMeta, Br as comboboxMeta, qn as config, Ct as copyButtonMeta, Ue as cva, We as cx, fl as dialogMeta, Ls as drawerMeta, ni as fieldMeta, li as fieldsetMeta, Za as fileDropZoneMeta, ye as iconButtonMeta, p as iconMeta, up as initialsFromEmail, to as inputMeta, le as kbdMeta, Bs as logoMeta, Fu as meterMeta, cs as minWidth, Sd as navigationMenuMeta, bo as numberFieldMeta, Rl as popoverMeta, Vi as progressMeta, Vl as proseMeta, Dt as richLinkMeta, Hl as rowMeta, Ul as scrollAreaMeta, ts as selectMeta, Wl as separatorMeta, jd as skeletonMeta, ns as sliderMeta, zd as spinnerMeta, lp as splitEmail, Hi as stackMeta, rs as switchMeta, _f as tabNavMeta, df as tableMeta, vf as tabsMeta, os as textareaMeta, Uf as toastMeta, Te as toggleGroupMeta, we as toggleMeta, op as tooltipMeta, ca as typoMeta, xe as useClipboard, rr as useColorScheme, Qs as useDisclosure, ec as useMediaQuery, Ql as withBreakHints };
+export { eu as AccountCard, tc as AppShell, mn as Autocomplete, Kl as Avatar, ge as Button, di as Callout, bi as Card, Hn as Checkbox, fu as Chip, vt as ChipLink, be as Code, hu as Collapsible, or as ColorSchemeToggle, cr as Combobox, g as ComponentCategories, St as CopyButton, Fc as Dialog, ls as Drawer, Hr as Field, ii as Fieldset, Pa as FileDropZone, s as Icon, _e as IconButton, Ws as ImFusionLogo, eo as Input, _ as Kbd, zs as Logo, wu as Meter, xd as NavigationMenu, no as NumberField, pl as Popover, Zs as ProductLogo, Ai as Progress, Bl as Prose, Et as RichLink, De as Row, ke as ScrollArea, xo as Select, Ve as Separator, wd as Skeleton, Ie as Slider, Rd as Spinner, Ee as Stack, Re as Switch, pf as TabNav, Bd as Table, Be as Tabs, as as Textarea, yf as Toast, ue as Toggle, de as ToggleGroup, Wf as Tooltip, Ui as Typo, cp as WebUIProvider, uu as accountCardMeta, Pc as appShellMeta, Vn as autocompleteMeta, du as avatarMeta, ve as buttonMeta, yi as calloutMeta, ki as cardMeta, Gn as checkboxMeta, yt as chipLinkMeta, pu as chipMeta, Ce as codeMeta, Su as collapsibleMeta, sr as colorSchemeToggleMeta, Br as comboboxMeta, qn as config, Ct as copyButtonMeta, Ue as cva, We as cx, fl as dialogMeta, Ls as drawerMeta, ni as fieldMeta, li as fieldsetMeta, Za as fileDropZoneMeta, ye as iconButtonMeta, p as iconMeta, fp as initialsFromEmail, up as initialsFromName, to as inputMeta, le as kbdMeta, Bs as logoMeta, Fu as meterMeta, cs as minWidth, Sd as navigationMenuMeta, bo as numberFieldMeta, Rl as popoverMeta, Vi as progressMeta, Vl as proseMeta, Dt as richLinkMeta, Hl as rowMeta, Ul as scrollAreaMeta, ts as selectMeta, Wl as separatorMeta, jd as skeletonMeta, ns as sliderMeta, zd as spinnerMeta, dp as splitEmail, Hi as stackMeta, rs as switchMeta, _f as tabNavMeta, df as tableMeta, vf as tabsMeta, os as textareaMeta, Uf as toastMeta, Te as toggleGroupMeta, we as toggleMeta, op as tooltipMeta, ca as typoMeta, xe as useClipboard, rr as useColorScheme, Qs as useDisclosure, ec as useMediaQuery, Ql as withBreakHints };

package/dist/utils/email.d.ts

@@ -3,5 +3,8 @@ export declare function splitEmail(email: string): {
     local: string;
     domain?: string;
 };
-/** Up to two initials from the email's local part, split at dots, dashes, and underscores: `m.rossi@…` gives `MR`. */
+/**
+ * One or two initials from the email's local part, split at dots, dashes, and underscores: `m.rossi@…` gives `MR`,
+ * `jkeller@…` gives `JK`.
+ */
 export declare function initialsFromEmail(email: string): string;

package/dist/utils/initials.d.ts

@@ -0,0 +1,4 @@
+/** One or two letters from words: the first letter of the first two, or the first two letters of a single word. */
+export declare function initialsFromWords(words: string[]): string;
+/** One or two initials from a display name, split at whitespace: `Mona Keller` gives `MK`, `Bob` gives `BO`. */
+export declare function initialsFromName(name: string): string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@imfusion/web-ui",
-  "version": "0.11.1-dev.49.gcda1589f",
+  "version": "0.11.1-dev.52.g8c3c8d4b",
   "description": "The official Web UI component library for ImFusion web apps",
   "author": "ImFusion GmbH",
   "homepage": "https://imfusion.com",

package/src/docgen/doc.gen.json

@@ -1507,7 +1507,7 @@
     "subComponents": [
       {
         "name": "Avatar.Fallback",
-        "description": "Avatar.Fallback — the initials the consumer passes, one or two letters. Without children it shows a person glyph.\nIt derives nothing from a name or email.",
+        "description": "Avatar.Fallback — the initials the consumer passes, one or two letters. Without children it shows a person glyph.\nIt derives nothing from a name or email; `initialsFromName` and `initialsFromEmail` do.",
         "props": [
           {
             "name": "className",

package/src/llms/skills/imf-web-ui-conventions/topics/library-boundary.md

@@ -7,6 +7,9 @@ integration seams.
 
 - Do not import Base UI or another implementation package directly, including its stylesheet.
 - If Web UI is missing a component or part, report the gap instead of reaching around it.
+- Use what Web UI already ships before building your own: a component, a part, or a helper such as `initialsFromName`. A
+  native element or local function that duplicates one, such as a `div role="separator"` or a hand-written initials function,
+  is a finding.
 - Import glyphs from `@imfusion/web-ui/icons` and render them with `Icon`.
 
 ## Stand in for a missing component