@worknice/whiteboard 0.55.4 → 0.57.0

package/dist/presentation/RichList/stories/Tasks.js

@@ -1,11 +1,11 @@
 import * as __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__ from "react/jsx-runtime";
+import * as __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_9566133d__ from "../../../utils/storybook.js";
+import * as __WEBPACK_EXTERNAL_MODULE__Avatar_js_1229b6e4__ from "../../Avatar.js";
 import * as __WEBPACK_EXTERNAL_MODULE__Badge_js_56d6dba9__ from "../../Badge.js";
 import * as __WEBPACK_EXTERNAL_MODULE__HStack_js_d2f77bae__ from "../../HStack.js";
 import * as __WEBPACK_EXTERNAL_MODULE__Icon_js_b85e52f7__ from "../../Icon.js";
-import * as __WEBPACK_EXTERNAL_MODULE__PersonAvatar_js_0117b3ba__ from "../../PersonAvatar.js";
 import * as __WEBPACK_EXTERNAL_MODULE__PlainText_js_acfb96d1__ from "../../PlainText.js";
 import * as __WEBPACK_EXTERNAL_MODULE__RichList_js_64f3f04c__ from "../RichList.js";
-import * as __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__ from "./shared.js";
 const rows = [
     {
         id: "t1",
@@ -14,8 +14,8 @@ const rows = [
         dueText: "in 3 days",
         dueStyle: "soon",
         assigneeName: "Caity Dewer",
-        assigneeImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(7),
-        secondaryImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(8)
+        assigneeImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_9566133d__.avatarUrl)(7),
+        secondaryImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_9566133d__.avatarUrl)(8)
     },
     {
         id: "t2",
@@ -24,8 +24,8 @@ const rows = [
         dueText: "in 2 months",
         dueStyle: "later",
         assigneeName: "James Ford",
-        assigneeImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(30),
-        secondaryImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(12)
+        assigneeImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_9566133d__.avatarUrl)(30),
+        secondaryImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_9566133d__.avatarUrl)(12)
     },
     {
         id: "t3",
@@ -34,8 +34,8 @@ const rows = [
         dueText: "2 days ago",
         dueStyle: "overdue",
         assigneeName: "Greg Evans",
-        assigneeImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(31),
-        secondaryImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(5)
+        assigneeImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_9566133d__.avatarUrl)(31),
+        secondaryImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_9566133d__.avatarUrl)(5)
     },
     {
         id: "t4",
@@ -44,8 +44,8 @@ const rows = [
         dueText: "in 5 days",
         dueStyle: "soon",
         assigneeName: "Daisy Smith",
-        assigneeImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(1),
-        secondaryImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(2)
+        assigneeImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_9566133d__.avatarUrl)(1),
+        secondaryImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_9566133d__.avatarUrl)(2)
     },
     {
         id: "t5",
@@ -54,8 +54,8 @@ const rows = [
         dueText: "tomorrow",
         dueStyle: "soon",
         assigneeName: "Daisy Smith",
-        assigneeImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(1),
-        secondaryImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(3)
+        assigneeImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_9566133d__.avatarUrl)(1),
+        secondaryImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_9566133d__.avatarUrl)(3)
     },
     {
         id: "t6",
@@ -64,8 +64,8 @@ const rows = [
         dueText: "No due date",
         dueStyle: "later",
         assigneeName: "Jane Dawson",
-        assigneeImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(32),
-        secondaryImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(14)
+        assigneeImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_9566133d__.avatarUrl)(32),
+        secondaryImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_9566133d__.avatarUrl)(14)
     },
     {
         id: "t7",
@@ -74,8 +74,8 @@ const rows = [
         dueText: "in 2 weeks",
         dueStyle: "later",
         assigneeName: "Jane Dawson",
-        assigneeImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(32),
-        secondaryImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(15)
+        assigneeImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_9566133d__.avatarUrl)(32),
+        secondaryImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_9566133d__.avatarUrl)(15)
     },
     {
         id: "t8",
@@ -84,8 +84,8 @@ const rows = [
         dueText: "in 14 days",
         dueStyle: "later",
         assigneeName: "Nadia Ora",
-        assigneeImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(6),
-        secondaryImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(16)
+        assigneeImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_9566133d__.avatarUrl)(6),
+        secondaryImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_9566133d__.avatarUrl)(16)
     },
     {
         id: "t9",
@@ -94,8 +94,8 @@ const rows = [
         dueText: "in 1 month",
         dueStyle: "later",
         assigneeName: "Andy Samson",
-        assigneeImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(4),
-        secondaryImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(11)
+        assigneeImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_9566133d__.avatarUrl)(4),
+        secondaryImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_9566133d__.avatarUrl)(11)
     },
     {
         id: "t10",
@@ -104,8 +104,8 @@ const rows = [
         dueText: "No due date",
         dueStyle: "later",
         assigneeName: "Andy Samson",
-        assigneeImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(4),
-        secondaryImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(12)
+        assigneeImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_9566133d__.avatarUrl)(4),
+        secondaryImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_9566133d__.avatarUrl)(12)
     },
     {
         id: "t11",
@@ -114,8 +114,8 @@ const rows = [
         dueText: "No due date",
         dueStyle: "later",
         assigneeName: "Jessica Smith",
-        assigneeImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(33),
-        secondaryImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(18)
+        assigneeImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_9566133d__.avatarUrl)(33),
+        secondaryImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_9566133d__.avatarUrl)(18)
     },
     {
         id: "t12",
@@ -124,8 +124,8 @@ const rows = [
         dueText: "1 week ago",
         dueStyle: "overdue",
         assigneeName: "Sarah Cruden",
-        assigneeImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(35),
-        secondaryImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(19)
+        assigneeImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_9566133d__.avatarUrl)(35),
+        secondaryImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_9566133d__.avatarUrl)(19)
     },
     {
         id: "t13",
@@ -134,8 +134,8 @@ const rows = [
         dueText: "in 1 week",
         dueStyle: "later",
         assigneeName: "Matthew Knee",
-        assigneeImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(36),
-        secondaryImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(20)
+        assigneeImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_9566133d__.avatarUrl)(36),
+        secondaryImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_9566133d__.avatarUrl)(20)
     },
     {
         id: "t14",
@@ -144,8 +144,8 @@ const rows = [
         dueText: "in 3 weeks",
         dueStyle: "later",
         assigneeName: "Jake Smith",
-        assigneeImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(37),
-        secondaryImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(22)
+        assigneeImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_9566133d__.avatarUrl)(37),
+        secondaryImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_9566133d__.avatarUrl)(22)
     },
     {
         id: "t15",
@@ -154,8 +154,8 @@ const rows = [
         dueText: "in 4 days",
         dueStyle: "soon",
         assigneeName: "Iris Sing",
-        assigneeImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(38),
-        secondaryImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__shared_js_cc7b7cda__.avatarUrl)(23)
+        assigneeImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_9566133d__.avatarUrl)(38),
+        secondaryImageUrl: (0, __WEBPACK_EXTERNAL_MODULE__utils_storybook_js_9566133d__.avatarUrl)(23)
     }
 ];
 const uniqueAssigneeNames = [
@@ -279,7 +279,7 @@ const TasksList = ({ compactBreakpoint, contentAlignment, enableSorting, rowHeig
                 align: "center",
                 tagName: "div",
                 children: [
-                    /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__PersonAvatar_js_0117b3ba__["default"], {
+                    /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__Avatar_js_1229b6e4__["default"], {
                         id: `${r.id}-as`,
                         name: r.assigneeName,
                         imageUrl: r.assigneeImageUrl,
@@ -305,7 +305,7 @@ const TasksList = ({ compactBreakpoint, contentAlignment, enableSorting, rowHeig
                     display: "flex",
                     justifyContent: "flex-end"
                 },
-                children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__PersonAvatar_js_0117b3ba__["default"], {
+                children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)(__WEBPACK_EXTERNAL_MODULE__Avatar_js_1229b6e4__["default"], {
                     id: `${r.id}-sec`,
                     name: "Secondary",
                     imageUrl: r.secondaryImageUrl,

package/dist/presentation/RichList/stories/shared.d.ts

@@ -1,5 +1,4 @@
 import type { CSSProperties } from "react";
-export declare const avatarUrl: (img: number) => string;
 export type CommonProps = {
     compactBreakpoint?: number;
     contentAlignment?: NonNullable<CSSProperties["justifyContent"]>;

package/dist/presentation/RichList/stories/shared.js

@@ -1,2 +0,0 @@
-const avatarUrl = (img)=>`https://i.pravatar.cc/50?img=${img}`;
-export { avatarUrl };

package/dist/presentation/RichList/types.d.ts

@@ -306,13 +306,18 @@ export type RichListRowAction<Type> = {
      * @default `false` (falsy/omitted: overflow menu only)
      */
     alwaysVisible?: boolean;
-    onClick: (row: Type) => void;
     /**
      * If set, the action is not offered when this returns `false` for that row.
      * @default (omitted) the action is always considered for the row.
      */
     predicate?: (row: Type) => boolean;
-};
+} & ({
+    onClick: (row: Type) => void;
+    type: "onClick";
+} | {
+    render: (onClose: () => void) => ReactNode;
+    type: "render";
+});
 /**
  * An action on the **selected** rows. Used with `bulkActions` on the list. The `render`
  * function usually returns a panel (confirm, form, etc.) and receives the matching

package/dist/presentation/Tag_module.css

@@ -3,51 +3,52 @@
   font: var(--font-small);
   padding: var(--size-n4) var(--size-n2);
   text-wrap: noWrap;
+  font-weight: 500;
   display: inline-flex;
 }
 
 .blue-Q5gzQs {
   background: var(--color-blue-t09);
-  color: var(--color-blue-s04);
+  color: var(--color-blue-000);
 }
 
 .green-ghtuPZ {
   background: var(--color-green-t09);
-  color: var(--color-green-s04);
+  color: var(--color-green-000);
 }
 
 .grey-KtqgiE {
   background: var(--color-grey-t09);
-  color: var(--color-grey-s04);
+  color: var(--color-grey-000);
 }
 
 .maroon-sTPflh {
   background: var(--color-maroon-t09);
-  color: var(--color-maroon-s04);
+  color: var(--color-maroon-000);
 }
 
 .orange-UyzB74 {
   background: var(--color-orange-t09);
-  color: var(--color-orange-s04);
+  color: var(--color-orange-000);
 }
 
 .purple-tJJoGZ {
   background: var(--color-purple-t09);
-  color: var(--color-purple-s04);
+  color: var(--color-purple-000);
 }
 
 .red-cHhhpj {
   background: var(--color-red-t09);
-  color: var(--color-red-s04);
+  color: var(--color-red-000);
 }
 
 .teal-ZuyYmA {
   background: var(--color-teal-t09);
-  color: var(--color-teal-s04);
+  color: var(--color-teal-000);
 }
 
 .yellow-NwCKSj {
   background: var(--color-yellow-t09);
-  color: var(--color-yellow-s04);
+  color: var(--color-yellow-000);
 }
 

package/dist/shared.css

@@ -244,6 +244,7 @@ body {
   --shadow-heavy: 0px 2px 8px 0px #00000029;
   --tone-default: var(--color-grey-s01);
   --tone-primary: var(--color-purple-000);
+  --tone-subtle: var(--color-grey-t01);
   --tone-muted: var(--color-grey-t04);
   --tone-danger: var(--color-red-t02);
   --tone-warning: var(--color-yellow-t02);

package/dist/utils/storybook.d.ts

@@ -1,2 +1,4 @@
 import type { ArgTypes } from "@storybook/nextjs-vite";
+/** Demo image URLs for Storybook stories (fixtures). Not for production. */
+export declare const avatarUrl: (img: number) => string;
 export declare const iconStoryControl: () => ArgTypes[string];

package/dist/utils/storybook.js

@@ -1,6 +1,7 @@
 import * as __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__ from "react/jsx-runtime";
 import * as __WEBPACK_EXTERNAL_MODULE__icons_index_js_d6af4ddb__ from "../icons/index.js";
 import * as __WEBPACK_EXTERNAL_MODULE__presentation_Icon_js_6961aa57__ from "../presentation/Icon.js";
+const avatarUrl = (img)=>`https://i.pravatar.cc/100?img=${img}`;
 const iconStoryControl = ()=>{
     const availableIcons = Object.keys(__WEBPACK_EXTERNAL_MODULE__icons_index_js_d6af4ddb__);
     const options = [
@@ -23,4 +24,4 @@ const iconStoryControl = ()=>{
         }
     };
 };
-export { iconStoryControl };
+export { avatarUrl, iconStoryControl };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@worknice/whiteboard",
   "description": "",
-  "version": "0.55.4",
+  "version": "0.57.0",
   "license": "MIT",
   "private": false,
   "files": [
@@ -39,7 +39,7 @@
     "react-markdown": "^10.1.0",
     "utf8": "^3.0.0",
     "zod": "^4.1.13",
-    "@worknice/utils": "^0.38.4"
+    "@worknice/utils": "^0.40.0"
   },
   "devDependencies": {
     "@anolilab/semantic-release-pnpm": "^3.2.2",
@@ -64,7 +64,7 @@
     "eslint-plugin-react": "^7.34.2",
     "eslint-plugin-react-hooks": "^4.6.2",
     "eslint-plugin-storybook": "^10.1.2",
-    "next": "~15.5.9",
+    "next": "~15.5.18",
     "nodemon": "^3.1.4",
     "prettier": "^3.5.3",
     "prettier-plugin-embed": "^0.5.0",
@@ -81,7 +81,7 @@
   "peerDependencies": {
     "@react-email/components": "^0.0.7",
     "clsx": "^2.0.0",
-    "next": "~15.5.9",
+    "next": "~15.5.18",
     "react": "~19.1.2",
     "react-dom": "~19.1.2",
     "temporal-polyfill": "^0.2.1",

package/dist/presentation/PersonAvatar.d.ts

@@ -1,18 +0,0 @@
-import { type ReactNode } from "react";
-type Props = {
-    id: string;
-    size?: keyof typeof SIZES;
-    name: string;
-    imageUrl?: string | null;
-    children?: (onClose: () => void) => ReactNode;
-    hue: string;
-};
-declare const SIZES: {
-    xtiny: number;
-    tiny: number;
-    small: number;
-    large: number;
-    xlarge: number;
-};
-declare const PersonAvatar: ({ id, size, name, imageUrl, children, hue }: Props) => import("react/jsx-runtime").JSX.Element;
-export default PersonAvatar;

package/dist/presentation/PersonAvatar.js

@@ -1,90 +0,0 @@
-"use client";
-import * as __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__ from "react/jsx-runtime";
-import * as __WEBPACK_EXTERNAL_MODULE_react__ from "react";
-const SIZES = {
-    xtiny: 16,
-    tiny: 24,
-    small: 48,
-    large: 96,
-    xlarge: 192
-};
-const getInitials = (name)=>{
-    const names = name.trim().split(/[\s-]+/);
-    return names.length <= 3 ? names.map((name)=>[
-            ...name
-        ][0]).join("") : [
-        ...names[0]
-    ][0] + [
-        ...names[names.length - 1]
-    ][0];
-};
-const PersonAvatar = ({ id, size = "large", name, imageUrl, children, hue })=>{
-    const [showProfile, setShowProfile] = (0, __WEBPACK_EXTERNAL_MODULE_react__.useState)(false);
-    return /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsxs)(__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.Fragment, {
-        children: [
-            /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("svg", {
-                style: {
-                    cursor: children ? "pointer" : "inherit"
-                },
-                width: SIZES[size],
-                height: SIZES[size],
-                viewBox: "0 0 96 96",
-                onClick: children ? ()=>{
-                    setShowProfile(true);
-                } : void 0,
-                children: imageUrl ? /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsxs)(__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.Fragment, {
-                    children: [
-                        /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("defs", {
-                            children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("pattern", {
-                                id: `${id}-pattern`,
-                                patternUnits: "userSpaceOnUse",
-                                width: "96",
-                                height: "96",
-                                children: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("image", {
-                                    href: imageUrl,
-                                    height: "96",
-                                    width: "96",
-                                    preserveAspectRatio: "xMidYMid slice"
-                                })
-                            })
-                        }),
-                        /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("circle", {
-                            cx: "48",
-                            cy: "48",
-                            r: "48",
-                            fill: "none"
-                        }),
-                        /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("circle", {
-                            cx: "48",
-                            cy: "48",
-                            r: "48",
-                            fill: `url(#${id}-pattern)`
-                        })
-                    ]
-                }) : /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsxs)(__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.Fragment, {
-                    children: [
-                        /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("circle", {
-                            cx: "48",
-                            cy: "48",
-                            r: "48",
-                            fill: `oklch(67.4% 0.1215 ${hue})`
-                        }),
-                        /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime_225474f2__.jsx)("text", {
-                            fill: "#fff",
-                            x: 48,
-                            y: 62,
-                            fontSize: 36,
-                            textAnchor: "middle",
-                            children: getInitials(name)
-                        })
-                    ]
-                })
-            }),
-            showProfile && children ? children(()=>{
-                setShowProfile(false);
-            }) : null
-        ]
-    });
-};
-const PersonAvatar_rslib_entry_ = PersonAvatar;
-export { PersonAvatar_rslib_entry_ as default };