@krrli/cm-designsystem 1.33.1 → 1.33.3

package/dist/cm-designsystem.css

@@ -394,6 +394,10 @@
     top: calc(var(--spacing) * 6);
   }
 
+  .top-60 {
+    top: calc(var(--spacing) * 60);
+  }
+
   .right-2 {
     right: calc(var(--spacing) * 2);
   }
@@ -406,10 +410,6 @@
     right: calc(var(--spacing) * 6);
   }
 
-  .-bottom-20 {
-    bottom: calc(var(--spacing) * -20);
-  }
-
   .bottom-2 {
     bottom: calc(var(--spacing) * 2);
   }

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

@@ -89,7 +89,7 @@ interface AvatarProps extends AvatarVariants {
     /**
      * The URL source of the avatar image.
      */
-    src: string | undefined;
+    src?: string | null;
     /**
      * Accessible label for the action button that appears on extra-large (`xl`)
      * avatars when `onActionClick` is provided.

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

@@ -1 +1 @@
-{"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../../src/components/avatar/Avatar.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAM,KAAK,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAK1D,QAAA,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;2CAwDhB,CAAC;AAEH,KAAK,cAAc,GAAG,YAAY,CAAC,OAAO,YAAY,CAAC,CAAC;AACxD,KAAK,UAAU,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE5C;;GAEG;AACH,UAAU,WAAY,SAAQ,cAAc;IAC1C;;OAEG;IACH,GAAG,EAAE,MAAM,CAAC;IAEZ;;OAEG;IACH,IAAI,EAAE,UAAU,CAAC;IAEjB;;OAEG;IACH,GAAG,EAAE,MAAM,GAAG,SAAS,CAAC;IAExB;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAE3B;;;;;;;OAOG;IACH,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;CAC5B;AAED;;;GAGG;AACH,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CA6BxC,CAAC"}
+{"version":3,"file":"Avatar.d.ts","sourceRoot":"","sources":["../../../src/components/avatar/Avatar.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAM,KAAK,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAK1D,QAAA,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;2CAwDhB,CAAC;AAEH,KAAK,cAAc,GAAG,YAAY,CAAC,OAAO,YAAY,CAAC,CAAC;AACxD,KAAK,UAAU,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE5C;;GAEG;AACH,UAAU,WAAY,SAAQ,cAAc;IAC1C;;OAEG;IACH,GAAG,EAAE,MAAM,CAAC;IAEZ;;OAEG;IACH,IAAI,EAAE,UAAU,CAAC;IAEjB;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEpB;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAE3B;;;;;;;OAOG;IACH,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;CAC5B;AAED;;;GAGG;AACH,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CA4BxC,CAAC"}

package/dist/components/avatar/Avatar.js

@@ -62,7 +62,10 @@ const avatarStyles = tv({
     }
   }
 });
-const Avatar = (props) => {
+const Avatar = ({
+  src = "",
+  ...props
+}) => {
   const { base, avatar, action } = avatarStyles(props);
   return /* @__PURE__ */ jsxs(
     RadixAvatar.Root,
@@ -71,14 +74,7 @@ const Avatar = (props) => {
       className: base({ isClickable: !!props.onAvatarClick, ...props }),
       "data-testid": "avatar",
       children: [
-        /* @__PURE__ */ jsx(
-          RadixAvatar.Image,
-          {
-            src: props.src,
-            alt: props.alt,
-            className: avatar(props)
-          }
-        ),
+        /* @__PURE__ */ jsx(RadixAvatar.Image, { src, alt: props.alt, className: avatar(props) }),
         props.size === "xl" && props.onActionClick && /* @__PURE__ */ jsx("div", { className: action(props), children: /* @__PURE__ */ jsx(
           RoundButton,
           {

package/dist/components/like-toggle/LikeToggle.d.ts

@@ -90,7 +90,7 @@ declare const toggleStyles: import('tailwind-variants').TVReturnType<{
 type LikeToggleVariants = VariantProps<typeof toggleStyles>;
 interface LikeToggleProps extends LikeToggleVariants {
     pressed?: boolean;
-    likes?: number;
+    likes?: number | null;
     onLikeChange: (liked: boolean) => void;
 }
 export declare const LikeToggle: ({ pressed, likes, onLikeChange, }: LikeToggleProps) => import("react/jsx-runtime").JSX.Element;

package/dist/components/like-toggle/LikeToggle.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"LikeToggle.d.ts","sourceRoot":"","sources":["../../../src/components/like-toggle/LikeToggle.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAM,KAAK,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAI1D,QAAA,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;2CA0IhB,CAAC;AAEH,KAAK,kBAAkB,GAAG,YAAY,CAAC,OAAO,YAAY,CAAC,CAAC;AAE5D,UAAU,eAAgB,SAAQ,kBAAkB;IAClD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;CACxC;AAED,eAAO,MAAM,UAAU,GAAI,mCAIxB,eAAe,4CAwEjB,CAAC"}
+{"version":3,"file":"LikeToggle.d.ts","sourceRoot":"","sources":["../../../src/components/like-toggle/LikeToggle.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAM,KAAK,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAI1D,QAAA,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;2CA0IhB,CAAC;AAEH,KAAK,kBAAkB,GAAG,YAAY,CAAC,OAAO,YAAY,CAAC,CAAC;AAE5D,UAAU,eAAgB,SAAQ,kBAAkB;IAClD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,YAAY,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;CACxC;AAED,eAAO,MAAM,UAAU,GAAI,mCAIxB,eAAe,4CAwEjB,CAAC"}

package/dist/compositions/post/Post.d.ts

@@ -45,25 +45,25 @@ interface PostProps extends PostVariants {
     /** Size of the post, affecting layout and styling. */
     size: PostSize;
     /** The display name of the user who created the post. */
-    displayName: string | undefined;
+    displayName?: string | null;
     /** The username or handle associated with the post. */
-    userName: string | undefined;
+    userName?: string | null;
     /** The date and time when the post was created. */
-    timestamp: Date | undefined;
+    timestamp?: Date | null;
     /** The main text content of the post. */
-    text: string | undefined;
+    text?: string;
     /** Avatar image URL */
-    src: string | undefined;
-    /** Triggered when the avatar is clicked. */
-    onAvatarClick: () => void;
+    avatarSrc?: string | null;
     /** Number of likes the post has received. */
-    nbrOfLikes: number;
+    nbrOfLikes?: number | null;
     /** Number of comments the post has received. */
-    nbrOfComments: number;
+    nbrOfComments?: number | null;
     /** Optional image source URL displayed within the post. */
-    imageSrc?: string | undefined;
+    imageSrc?: string | null;
     /** Optional alt text for the post image, used for accessibility. */
-    imageAlt?: string;
+    imageAlt?: string | null;
+    /** Triggered when the avatar is clicked. */
+    onAvatarClick: () => void;
     /** Callback fired when the comment button is clicked. */
     onCommentClick: () => void;
     /** Callback fired when the like button is clicked. */

package/dist/compositions/post/Post.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Post.d.ts","sourceRoot":"","sources":["../../../src/compositions/post/Post.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAM,KAAK,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAc1D,QAAA,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;2CAmBd,CAAC;AAEH,KAAK,YAAY,GAAG,YAAY,CAAC,OAAO,UAAU,CAAC,CAAC;AACpD,KAAK,QAAQ,GAAG,IAAI,GAAG,IAAI,CAAC;AAE5B,UAAU,SAAU,SAAQ,YAAY;IACtC,sDAAsD;IACtD,IAAI,EAAE,QAAQ,CAAC;IAEf,yDAAyD;IACzD,WAAW,EAAE,MAAM,GAAG,SAAS,CAAC;IAEhC,uDAAuD;IACvD,QAAQ,EAAE,MAAM,GAAG,SAAS,CAAC;IAE7B,mDAAmD;IACnD,SAAS,EAAE,IAAI,GAAG,SAAS,CAAC;IAE5B,yCAAyC;IACzC,IAAI,EAAE,MAAM,GAAG,SAAS,CAAC;IAEzB,uBAAuB;IACvB,GAAG,EAAE,MAAM,GAAG,SAAS,CAAC;IAExB,4CAA4C;IAC5C,aAAa,EAAE,MAAM,IAAI,CAAC;IAE1B,6CAA6C;IAC7C,UAAU,EAAE,MAAM,CAAC;IAEnB,gDAAgD;IAChD,aAAa,EAAE,MAAM,CAAC;IAEtB,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAE9B,oEAAoE;IACpE,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB,yDAAyD;IACzD,cAAc,EAAE,MAAM,IAAI,CAAC;IAE3B,sDAAsD;IACtD,WAAW,EAAE,MAAM,IAAI,CAAC;IAExB,uDAAuD;IACvD,YAAY,EAAE,MAAM,IAAI,CAAC;CAC1B;AAED;;;GAGG;AACH,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CA2DpC,CAAC"}
+{"version":3,"file":"Post.d.ts","sourceRoot":"","sources":["../../../src/compositions/post/Post.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAM,KAAK,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAc1D,QAAA,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;2CAmBd,CAAC;AAEH,KAAK,YAAY,GAAG,YAAY,CAAC,OAAO,UAAU,CAAC,CAAC;AACpD,KAAK,QAAQ,GAAG,IAAI,GAAG,IAAI,CAAC;AAE5B,UAAU,SAAU,SAAQ,YAAY;IACtC,sDAAsD;IACtD,IAAI,EAAE,QAAQ,CAAC;IAEf,yDAAyD;IACzD,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAE5B,uDAAuD;IACvD,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEzB,mDAAmD;IACnD,SAAS,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IAExB,yCAAyC;IACzC,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd,uBAAuB;IACvB,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAE1B,6CAA6C;IAC7C,UAAU,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAE3B,gDAAgD;IAChD,aAAa,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAE9B,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEzB,oEAAoE;IACpE,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEzB,4CAA4C;IAC5C,aAAa,EAAE,MAAM,IAAI,CAAC;IAE1B,yDAAyD;IACzD,cAAc,EAAE,MAAM,IAAI,CAAC;IAE3B,sDAAsD;IACtD,WAAW,EAAE,MAAM,IAAI,CAAC;IAExB,uDAAuD;IACvD,YAAY,EAAE,MAAM,IAAI,CAAC;CAC1B;AAED;;;GAGG;AACH,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CA4DpC,CAAC"}

package/dist/compositions/post/Post.js

@@ -31,7 +31,11 @@ const PostStyles = tv({
     }
   }
 });
-const Post = (props) => {
+const Post = ({
+  nbrOfLikes = 0,
+  nbrOfComments = 0,
+  ...props
+}) => {
   const { base, avatar, content, text, action } = PostStyles(props);
   return /* @__PURE__ */ jsxs(PostBase, { className: base(), children: [
     /* @__PURE__ */ jsx("div", { className: avatar(), children: /* @__PURE__ */ jsx(
@@ -39,7 +43,7 @@ const Post = (props) => {
       {
         alt: "Profile",
         size: "md",
-        src: props.src,
+        src: props.avatarSrc,
         onAvatarClick: props.onAvatarClick
       }
     ) }),
@@ -69,18 +73,12 @@ const Post = (props) => {
           Toggle,
           {
             ariaLabel: "Comment",
-            labelText: props.nbrOfComments === 0 ? "Comment" : props.nbrOfComments === 1 ? "1 Comment" : `${props.nbrOfComments} Comments`,
-            pressed: props.nbrOfComments !== 0,
+            labelText: nbrOfComments === 0 ? "Comment" : nbrOfComments === 1 ? "1 Comment" : `${nbrOfComments} Comments`,
+            pressed: nbrOfComments !== 0,
             onToggle: props.onCommentClick
           }
         ),
-        /* @__PURE__ */ jsx(
-          LikeToggle,
-          {
-            likes: props.nbrOfLikes,
-            onLikeChange: props.onLikeClick
-          }
-        ),
+        /* @__PURE__ */ jsx(LikeToggle, { likes: nbrOfLikes, onLikeChange: props.onLikeClick }),
         /* @__PURE__ */ jsx(
           TimedButton,
           {

package/dist/compositions/post-creator/PostCreator.d.ts

@@ -51,7 +51,7 @@ declare const PostCreatorStyles: import('tailwind-variants').TVReturnType<{
 type PostCreatorVariants = VariantProps<typeof PostCreatorStyles>;
 interface PostCreatorProps extends PostCreatorVariants {
     /** Avatar image URL */
-    src: string | undefined;
+    src: string | null;
     /** Triggered when the avatar is clicked. */
     onAvatarClick: () => void;
     /**

package/dist/compositions/post-creator/PostCreator.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PostCreator.d.ts","sourceRoot":"","sources":["../../../src/compositions/post-creator/PostCreator.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAM,KAAK,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAS1D,QAAA,MAAM,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;2CAQrB,CAAC;AAEH,KAAK,mBAAmB,GAAG,YAAY,CAAC,OAAO,iBAAiB,CAAC,CAAC;AAElE,UAAU,gBAAiB,SAAQ,mBAAmB;IACpD,uBAAuB;IACvB,GAAG,EAAE,MAAM,GAAG,SAAS,CAAC;IAExB,4CAA4C;IAC5C,aAAa,EAAE,MAAM,IAAI,CAAC;IAE1B;;;OAGG;IACH,WAAW,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,GAAG,IAAI,KAAK,IAAI,CAAC;CACxD;AAED;;;;GAIG;AACH,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAuDlD,CAAC"}
+{"version":3,"file":"PostCreator.d.ts","sourceRoot":"","sources":["../../../src/compositions/post-creator/PostCreator.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAM,KAAK,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAS1D,QAAA,MAAM,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;2CAQrB,CAAC;AAEH,KAAK,mBAAmB,GAAG,YAAY,CAAC,OAAO,iBAAiB,CAAC,CAAC;AAElE,UAAU,gBAAiB,SAAQ,mBAAmB;IACpD,uBAAuB;IACvB,GAAG,EAAE,MAAM,GAAG,IAAI,CAAC;IAEnB,4CAA4C;IAC5C,aAAa,EAAE,MAAM,IAAI,CAAC;IAE1B;;;OAGG;IACH,WAAW,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,GAAG,IAAI,KAAK,IAAI,CAAC;CACxD;AAED;;;;GAIG;AACH,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAuDlD,CAAC"}

package/dist/compositions/profile-banner/ProfileBanner.d.ts

@@ -45,23 +45,23 @@ declare const ProfileBannerStyles: import('tailwind-variants').TVReturnType<{
 type ProfileBannerVariants = VariantProps<typeof ProfileBannerStyles>;
 interface ProfileBannerProps extends ProfileBannerVariants {
     /** URL of the user's avatar image. */
-    avatarSrc: string;
+    avatarSrc?: string | null;
     /** Alt text for the avatar image. */
     avatarAlt: string;
     /** URL of the profile banner or main image. */
-    imageSrc: string;
+    imageSrc?: string | null;
     /** Alt text for the main image. */
     imageAlt: string;
     /** The user's display name. */
-    displayName: string;
+    displayName?: string | null;
     /** The user’s username/handle. */
-    userName: string;
+    userName?: string | null;
     /** The user’s location string. */
-    location: string;
+    location?: string | null;
     /** Date when the user joined. */
-    joinedTimestamp: Date;
+    joinedTimestamp?: Date | null;
     /** Bio or profile description text. */
-    description: string;
+    description?: string | null;
     /** Whether the profile being viewed belongs to the logged-in user. */
     isCurrentUser: boolean;
     /**

package/dist/compositions/profile-banner/ProfileBanner.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ProfileBanner.d.ts","sourceRoot":"","sources":["../../../src/compositions/profile-banner/ProfileBanner.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAM,KAAK,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAS1D,QAAA,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;2CAOvB,CAAC;AAEH,KAAK,qBAAqB,GAAG,YAAY,CAAC,OAAO,mBAAmB,CAAC,CAAC;AAEtE,UAAU,kBAAmB,SAAQ,qBAAqB;IACxD,sCAAsC;IACtC,SAAS,EAAE,MAAM,CAAC;IAElB,qCAAqC;IACrC,SAAS,EAAE,MAAM,CAAC;IAElB,+CAA+C;IAC/C,QAAQ,EAAE,MAAM,CAAC;IAEjB,mCAAmC;IACnC,QAAQ,EAAE,MAAM,CAAC;IAEjB,+BAA+B;IAC/B,WAAW,EAAE,MAAM,CAAC;IAEpB,kCAAkC;IAClC,QAAQ,EAAE,MAAM,CAAC;IAEjB,kCAAkC;IAClC,QAAQ,EAAE,MAAM,CAAC;IAEjB,iCAAiC;IACjC,eAAe,EAAE,IAAI,CAAC;IAEtB,uCAAuC;IACvC,WAAW,EAAE,MAAM,CAAC;IAEpB,sEAAsE;IACtE,aAAa,EAAE,OAAO,CAAC;IAEvB;;;OAGG;IACH,oBAAoB,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,KAAK,IAAI,CAAC;IAEnD;;;OAGG;IACH,mBAAmB,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,KAAK,IAAI,CAAC;CACnD;AAED;;GAEG;AACH,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAoDtD,CAAC"}
+{"version":3,"file":"ProfileBanner.d.ts","sourceRoot":"","sources":["../../../src/compositions/profile-banner/ProfileBanner.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAM,KAAK,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAS1D,QAAA,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;2CAOvB,CAAC;AAEH,KAAK,qBAAqB,GAAG,YAAY,CAAC,OAAO,mBAAmB,CAAC,CAAC;AAEtE,UAAU,kBAAmB,SAAQ,qBAAqB;IACxD,sCAAsC;IACtC,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAE1B,qCAAqC;IACrC,SAAS,EAAE,MAAM,CAAC;IAElB,+CAA+C;IAC/C,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEzB,mCAAmC;IACnC,QAAQ,EAAE,MAAM,CAAC;IAEjB,+BAA+B;IAC/B,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAE5B,kCAAkC;IAClC,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEzB,kCAAkC;IAClC,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEzB,iCAAiC;IACjC,eAAe,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IAE9B,uCAAuC;IACvC,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAE5B,sEAAsE;IACtE,aAAa,EAAE,OAAO,CAAC;IAEvB;;;OAGG;IACH,oBAAoB,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,KAAK,IAAI,CAAC;IAEnD;;;OAGG;IACH,mBAAmB,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,KAAK,IAAI,CAAC;CACnD;AAED;;GAEG;AACH,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAmDtD,CAAC"}

package/dist/compositions/profile-banner/ProfileBanner.js

@@ -9,8 +9,8 @@ import { Avatar } from "../../components/avatar/Avatar.js";
 import { Paragraph } from "../../components/typography/Paragraph.js";
 const ProfileBannerStyles = tv({
   slots: {
-    base: ["flex", "flex-col", "gap-6", "w-170", "h-80", "relative"],
-    avatar: ["absolute", "-bottom-20", "right-6"],
+    base: ["flex", "flex-col", "gap-6", "w-170", "relative"],
+    avatar: ["absolute", "top-60", "right-6"],
     info: ["flex", "flex-col", "gap-3"],
     description: ["text-slate-500"]
   }
@@ -46,9 +46,7 @@ const ProfileBanner = (props) => {
             displayName: props.displayName,
             userName: props.userName,
             location: props.location,
-            joinedTimestamp: props.joinedTimestamp,
-            onProfileClick: () => {
-            }
+            joinedTimestamp: props.joinedTimestamp
           }
         ),
         /* @__PURE__ */ jsx(Paragraph, { size: "md", className: description(), children: props.description })

package/dist/compositions/profile-banner-image/ProfileBannerImage.d.ts

@@ -36,7 +36,7 @@ declare const ProfileBannerImageStyles: import('tailwind-variants').TVReturnType
 type ProfileBannerImageVariants = VariantProps<typeof ProfileBannerImageStyles>;
 interface ProfileBannerImageProps extends ProfileBannerImageVariants {
     /** Avatar image URL */
-    src: string;
+    src?: string | null;
     /**
      * Alternative text for the image, used for accessibility.
      */

package/dist/compositions/profile-banner-image/ProfileBannerImage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ProfileBannerImage.d.ts","sourceRoot":"","sources":["../../../src/compositions/profile-banner-image/ProfileBannerImage.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAU,KAAK,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAG9D,QAAA,MAAM,wBAAwB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;2CAwC5B,CAAC;AAEH,KAAK,0BAA0B,GAAG,YAAY,CAAC,OAAO,wBAAwB,CAAC,CAAC;AAEhF,UAAU,uBAAwB,SAAQ,0BAA0B;IAClE,uBAAuB;IACvB,GAAG,EAAE,MAAM,CAAC;IAEZ;;OAEG;IACH,GAAG,EAAE,MAAM,CAAC;IAEZ,+DAA+D;IAC/D,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED;;;;;GAKG;AACH,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CA0BhE,CAAC"}
+{"version":3,"file":"ProfileBannerImage.d.ts","sourceRoot":"","sources":["../../../src/compositions/profile-banner-image/ProfileBannerImage.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAU,KAAK,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAG9D,QAAA,MAAM,wBAAwB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;2CAwC5B,CAAC;AAEH,KAAK,0BAA0B,GAAG,YAAY,CAAC,OAAO,wBAAwB,CAAC,CAAC;AAEhF,UAAU,uBAAwB,SAAQ,0BAA0B;IAClE,uBAAuB;IACvB,GAAG,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEpB;;OAEG;IACH,GAAG,EAAE,MAAM,CAAC;IAEZ,+DAA+D;IAC/D,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAED;;;;;GAKG;AACH,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CA0BhE,CAAC"}

package/dist/compositions/profile-banner-image/ProfileBannerImage.js

@@ -47,7 +47,7 @@ const ProfileBannerImageStyles = tv({
 });
 const ProfileBannerImage = (props) => {
   const { base, image, overlay, icon } = ProfileBannerImageStyles(props);
-  const [src, setSrc] = useState(props.src);
+  const [src, setSrc] = useState(props.src ?? "");
   return /* @__PURE__ */ jsx("div", { className: base(), children: src ? /* @__PURE__ */ jsxs(AspectRatio.Root, { ratio: 17 / 8, children: [
     /* @__PURE__ */ jsx(
       "img",

package/dist/compositions/profile-banner-info/ProfileBannerInfo.d.ts

@@ -2,7 +2,7 @@ import { VariantProps } from 'tailwind-variants';
 declare const profileBannerInfoStyles: import('tailwind-variants').TVReturnType<{
     [key: string]: {
         [key: string]: import('tailwind-merge').ClassNameValue | {
-            displayName?: import('tailwind-merge').ClassNameValue;
+            name?: import('tailwind-merge').ClassNameValue;
             base?: import('tailwind-merge').ClassNameValue;
             title?: import('tailwind-merge').ClassNameValue;
             icon?: import('tailwind-merge').ClassNameValue;
@@ -13,7 +13,7 @@ declare const profileBannerInfoStyles: import('tailwind-variants').TVReturnType<
 } | {
     [x: string]: {
         [x: string]: import('tailwind-merge').ClassNameValue | {
-            displayName?: import('tailwind-merge').ClassNameValue;
+            name?: import('tailwind-merge').ClassNameValue;
             base?: import('tailwind-merge').ClassNameValue;
             title?: import('tailwind-merge').ClassNameValue;
             icon?: import('tailwind-merge').ClassNameValue;
@@ -25,13 +25,13 @@ declare const profileBannerInfoStyles: import('tailwind-variants').TVReturnType<
     base: string[];
     title: string[];
     icon: string[];
-    displayName: string[];
+    name: string[];
     detailInfo: string[];
     secondaryInfo: string[];
 }, undefined, {
     [key: string]: {
         [key: string]: import('tailwind-merge').ClassNameValue | {
-            displayName?: import('tailwind-merge').ClassNameValue;
+            name?: import('tailwind-merge').ClassNameValue;
             base?: import('tailwind-merge').ClassNameValue;
             title?: import('tailwind-merge').ClassNameValue;
             icon?: import('tailwind-merge').ClassNameValue;
@@ -43,14 +43,14 @@ declare const profileBannerInfoStyles: import('tailwind-variants').TVReturnType<
     base: string[];
     title: string[];
     icon: string[];
-    displayName: string[];
+    name: string[];
     detailInfo: string[];
     secondaryInfo: string[];
 }, import('tailwind-variants').TVReturnType<unknown, {
     base: string[];
     title: string[];
     icon: string[];
-    displayName: string[];
+    name: string[];
     detailInfo: string[];
     secondaryInfo: string[];
 }, undefined, unknown, unknown, undefined>>;
@@ -61,25 +61,25 @@ interface ProfileBannerInfoProps extends ProfileBannerInfoVariants {
     /**
      * The user's full display name (e.g., "John Doe").
      */
-    displayName: string;
+    displayName?: string | null;
     /**
      * The user's username or handle (e.g., "@john").
      */
-    userName: string;
+    userName?: string | null;
     /**
      * The user's location as a readable text label.
      */
-    location: string;
+    location?: string | null;
     /**
      * A timestamp representing when the user joined.
      * Used to generate the "Member since" relative date.
      */
-    joinedTimestamp: Date;
+    joinedTimestamp?: Date | null;
     /**
      * Callback fired whenever any profile-related element is clicked.
      * Typically used to open the profile or navigate to a user page.
      */
-    onProfileClick: () => void;
+    onProfileClick?: () => void;
     /** A function called when the settings button is clicked. */
     onSettingsClick?: () => void;
 }

package/dist/compositions/profile-banner-info/ProfileBannerInfo.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ProfileBannerInfo.d.ts","sourceRoot":"","sources":["../../../src/compositions/profile-banner-info/ProfileBannerInfo.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAM,KAAK,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAU1D,QAAA,MAAM,uBAAuB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;2CAS3B,CAAC;AAEH,KAAK,yBAAyB,GAAG,YAAY,CAAC,OAAO,uBAAuB,CAAC,CAAC;AAE9E,UAAU,sBAAuB,SAAQ,yBAAyB;IAChE,sEAAsE;IACtE,aAAa,EAAE,OAAO,CAAC;IAEvB;;OAEG;IACH,WAAW,EAAE,MAAM,CAAC;IAEpB;;OAEG;IACH,QAAQ,EAAE,MAAM,CAAC;IAEjB;;OAEG;IACH,QAAQ,EAAE,MAAM,CAAC;IAEjB;;;OAGG;IACH,eAAe,EAAE,IAAI,CAAC;IAEtB;;;OAGG;IACH,cAAc,EAAE,MAAM,IAAI,CAAC;IAE3B,6DAA6D;IAC7D,eAAe,CAAC,EAAE,MAAM,IAAI,CAAC;CAC9B;AAwBD;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CAgD9D,CAAC"}
+{"version":3,"file":"ProfileBannerInfo.d.ts","sourceRoot":"","sources":["../../../src/compositions/profile-banner-info/ProfileBannerInfo.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAM,KAAK,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAU1D,QAAA,MAAM,uBAAuB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;2CAS3B,CAAC;AAEH,KAAK,yBAAyB,GAAG,YAAY,CAAC,OAAO,uBAAuB,CAAC,CAAC;AAE9E,UAAU,sBAAuB,SAAQ,yBAAyB;IAChE,sEAAsE;IACtE,aAAa,EAAE,OAAO,CAAC;IAEvB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAE5B;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEzB;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEzB;;;OAGG;IACH,eAAe,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IAE9B;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAE5B,6DAA6D;IAC7D,eAAe,CAAC,EAAE,MAAM,IAAI,CAAC;CAC9B;AAwBD;;;;GAIG;AACH,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CAoD9D,CAAC"}

package/dist/compositions/profile-banner-info/ProfileBannerInfo.js

@@ -12,7 +12,7 @@ const profileBannerInfoStyles = tv({
     base: ["flex", "flex-col", "gap-2", "items-start"],
     title: ["flex", "gap-1", "items-center", "**:cursor-pointer"],
     icon: ["text-violet-600", "-mt-0.5"],
-    displayName: ["text-slate-900"],
+    name: ["text-slate-900"],
     detailInfo: ["flex", "gap-4"],
     secondaryInfo: ["text-slate-500"]
   }
@@ -35,11 +35,17 @@ function timeSince(timestamp) {
   return seconds <= 1 ? "just now" : `${seconds} seconds`;
 }
 const memberSincePrefix = "Member since ";
-const ProfileBannerInfo = (props) => {
-  const { base, title, icon, displayName, detailInfo, secondaryInfo } = profileBannerInfoStyles(props);
+const ProfileBannerInfo = ({
+  displayName = "New User",
+  userName = "newuser",
+  location = "Location",
+  joinedTimestamp = /* @__PURE__ */ new Date(),
+  ...props
+}) => {
+  const { base, title, icon, name, detailInfo, secondaryInfo } = profileBannerInfoStyles(props);
   return /* @__PURE__ */ jsxs("div", { className: base(), children: [
     /* @__PURE__ */ jsxs("div", { className: title(), children: [
-      /* @__PURE__ */ jsx("button", { onClick: props.onProfileClick, className: displayName(), children: /* @__PURE__ */ jsx(Label, { size: "xl", children: props.displayName }) }),
+      /* @__PURE__ */ jsx("button", { onClick: props.onProfileClick, className: name(), children: /* @__PURE__ */ jsx(Label, { size: "xl", children: displayName }) }),
       props.isCurrentUser && /* @__PURE__ */ jsx("button", { onClick: props.onSettingsClick, children: /* @__PURE__ */ jsx(Settings, { className: icon() }) })
     ] }),
     /* @__PURE__ */ jsxs("div", { className: detailInfo(), children: [
@@ -49,7 +55,7 @@ const ProfileBannerInfo = (props) => {
           intent: "secondary",
           icon: Profile,
           onClick: props.onProfileClick,
-          children: props.userName
+          children: userName
         }
       ),
       /* @__PURE__ */ jsx(
@@ -59,7 +65,7 @@ const ProfileBannerInfo = (props) => {
           icon: Location,
           onClick: props.onProfileClick,
           className: secondaryInfo(),
-          children: props.location
+          children: location
         }
       ),
       /* @__PURE__ */ jsx(
@@ -69,7 +75,7 @@ const ProfileBannerInfo = (props) => {
           icon: Calendar,
           onClick: props.onProfileClick,
           className: secondaryInfo(),
-          children: memberSincePrefix + timeSince(props.joinedTimestamp)
+          children: memberSincePrefix + timeSince(joinedTimestamp)
         }
       )
     ] })

package/dist/compositions/response/Response.d.ts

@@ -45,21 +45,21 @@ declare const ResponseStyles: import('tailwind-variants').TVReturnType<{
 type ResponseVariants = VariantProps<typeof ResponseStyles>;
 interface ResponseProps extends ResponseVariants {
     /** The display name of the user who created the Response. */
-    displayName: string;
+    displayName?: string | null;
     /** The username or handle associated with the Response. */
-    userName: string;
+    userName?: string | null;
     /** The date and time when the Response was created. */
-    timestamp: Date;
+    timestamp?: Date | null;
     /** The main text content of the Response. */
-    text: string;
+    text?: string | null;
     /** Avatar image URL */
-    src: string;
+    avatarSrc?: string | null;
     /** Triggered when the avatar is clicked. */
     onAvatarClick: () => void;
     /** Number of likes the post has received. */
-    nbrOfLikes: number;
+    nbrOfLikes?: number | null;
     /** Number of comments the post has received. */
-    nbrOfComments: number;
+    nbrOfComments?: number | null;
     /** Optional image source URL displayed within the Response. */
     imageSrc?: string;
     /** Optional alt text for the Response image, used for accessibility. */

package/dist/compositions/response/Response.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Response.d.ts","sourceRoot":"","sources":["../../../src/compositions/response/Response.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAM,KAAK,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAQ1D,QAAA,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;2CAYlB,CAAC;AAEH,KAAK,gBAAgB,GAAG,YAAY,CAAC,OAAO,cAAc,CAAC,CAAC;AAE5D,UAAU,aAAc,SAAQ,gBAAgB;IAC9C,6DAA6D;IAC7D,WAAW,EAAE,MAAM,CAAC;IAEpB,2DAA2D;IAC3D,QAAQ,EAAE,MAAM,CAAC;IAEjB,uDAAuD;IACvD,SAAS,EAAE,IAAI,CAAC;IAEhB,6CAA6C;IAC7C,IAAI,EAAE,MAAM,CAAC;IAEb,uBAAuB;IACvB,GAAG,EAAE,MAAM,CAAC;IAEZ,4CAA4C;IAC5C,aAAa,EAAE,MAAM,IAAI,CAAC;IAE1B,6CAA6C;IAC7C,UAAU,EAAE,MAAM,CAAC;IAEnB,gDAAgD;IAChD,aAAa,EAAE,MAAM,CAAC;IAEtB,+DAA+D;IAC/D,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB,wEAAwE;IACxE,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB,yDAAyD;IACzD,cAAc,EAAE,MAAM,IAAI,CAAC;IAE3B,sDAAsD;IACtD,WAAW,EAAE,MAAM,IAAI,CAAC;IAExB,uDAAuD;IACvD,YAAY,EAAE,MAAM,IAAI,CAAC;CAC1B;AAED;;;GAGG;AACH,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAmD5C,CAAC"}
+{"version":3,"file":"Response.d.ts","sourceRoot":"","sources":["../../../src/compositions/response/Response.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAM,KAAK,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAQ1D,QAAA,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;2CAYlB,CAAC;AAEH,KAAK,gBAAgB,GAAG,YAAY,CAAC,OAAO,cAAc,CAAC,CAAC;AAE5D,UAAU,aAAc,SAAQ,gBAAgB;IAC9C,6DAA6D;IAC7D,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAE5B,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEzB,uDAAuD;IACvD,SAAS,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IAExB,6CAA6C;IAC7C,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAErB,uBAAuB;IACvB,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAE1B,4CAA4C;IAC5C,aAAa,EAAE,MAAM,IAAI,CAAC;IAE1B,6CAA6C;IAC7C,UAAU,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAE3B,gDAAgD;IAChD,aAAa,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAE9B,+DAA+D;IAC/D,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB,wEAAwE;IACxE,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB,yDAAyD;IACzD,cAAc,EAAE,MAAM,IAAI,CAAC;IAE3B,sDAAsD;IACtD,WAAW,EAAE,MAAM,IAAI,CAAC;IAExB,uDAAuD;IACvD,YAAY,EAAE,MAAM,IAAI,CAAC;CAC1B;AAED;;;GAGG;AACH,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAoD5C,CAAC"}

package/dist/compositions/response/Response.js

@@ -23,14 +23,18 @@ const ResponseStyles = tv({
     action: ["flex", "gap-10", "justify-start", "-ml-3"]
   }
 });
-const Response = (props) => {
+const Response = ({
+  nbrOfLikes = 0,
+  nbrOfComments = 0,
+  ...props
+}) => {
   const { base, content, text, action } = ResponseStyles(props);
   return /* @__PURE__ */ jsx(PostBase, { className: base(), children: /* @__PURE__ */ jsxs("div", { className: content(), children: [
     /* @__PURE__ */ jsx(
       UserInfo,
       {
         size: "sm",
-        src: props.src,
+        src: props.avatarSrc,
         displayName: props.displayName,
         userName: props.userName,
         timestamp: props.timestamp,
@@ -52,18 +56,12 @@ const Response = (props) => {
         Toggle,
         {
           ariaLabel: "Comment",
-          labelText: props.nbrOfComments === 0 ? "Comment" : props.nbrOfComments === 1 ? "1 Comment" : `${props.nbrOfComments} Comments`,
-          pressed: props.nbrOfComments !== 0,
+          labelText: nbrOfComments === 0 ? "Comment" : nbrOfComments === 1 ? "1 Comment" : `${nbrOfComments} Comments`,
+          pressed: nbrOfComments !== 0,
           onToggle: props.onCommentClick
         }
       ),
-      /* @__PURE__ */ jsx(
-        LikeToggle,
-        {
-          likes: props.nbrOfLikes,
-          onLikeChange: props.onLikeClick
-        }
-      ),
+      /* @__PURE__ */ jsx(LikeToggle, { likes: nbrOfLikes, onLikeChange: props.onLikeClick }),
       /* @__PURE__ */ jsx(
         TimedButton,
         {

package/dist/compositions/response-creator/ResponseCreator.d.ts

@@ -39,11 +39,11 @@ declare const ResponseCreatorStyles: import('tailwind-variants').TVReturnType<{
 type ResponseCreatorVariants = VariantProps<typeof ResponseCreatorStyles>;
 interface ResponseCreatorProps extends ResponseCreatorVariants {
     /** Avatar image URL */
-    src: string;
+    src?: string | null;
     /** Display name of the user */
-    displayName: string;
+    displayName?: string | null;
     /** Username of the user */
-    userName: string;
+    userName?: string | null;
     /**
      * Callback fired when the "Send" button is clicked.
      *   Receives the textarea text and the optionally uploaded file.

package/dist/compositions/response-creator/ResponseCreator.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ResponseCreator.d.ts","sourceRoot":"","sources":["../../../src/compositions/response-creator/ResponseCreator.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAM,KAAK,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAU1D,QAAA,MAAM,qBAAqB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;2CAMzB,CAAC;AAEH,KAAK,uBAAuB,GAAG,YAAY,CAAC,OAAO,qBAAqB,CAAC,CAAC;AAE1E,UAAU,oBAAqB,SAAQ,uBAAuB;IAC5D,uBAAuB;IACvB,GAAG,EAAE,MAAM,CAAC;IAEZ,+BAA+B;IAC/B,WAAW,EAAE,MAAM,CAAC;IAEpB,2BAA2B;IAC3B,QAAQ,EAAE,MAAM,CAAC;IAEjB;;;OAGG;IACH,WAAW,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,GAAG,IAAI,KAAK,IAAI,CAAC;IAEvD;;OAEG;IACH,aAAa,EAAE,MAAM,IAAI,CAAC;CAC3B;AAED;;;;GAIG;AACH,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAkD1D,CAAC"}
+{"version":3,"file":"ResponseCreator.d.ts","sourceRoot":"","sources":["../../../src/compositions/response-creator/ResponseCreator.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAM,KAAK,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAU1D,QAAA,MAAM,qBAAqB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;2CAMzB,CAAC;AAEH,KAAK,uBAAuB,GAAG,YAAY,CAAC,OAAO,qBAAqB,CAAC,CAAC;AAE1E,UAAU,oBAAqB,SAAQ,uBAAuB;IAC5D,uBAAuB;IACvB,GAAG,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEpB,+BAA+B;IAC/B,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAE5B,2BAA2B;IAC3B,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEzB;;;OAGG;IACH,WAAW,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,GAAG,IAAI,KAAK,IAAI,CAAC;IAEvD;;OAEG;IACH,aAAa,EAAE,MAAM,IAAI,CAAC;CAC3B;AAED;;;;GAIG;AACH,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAkD1D,CAAC"}

package/dist/compositions/user-info/UserInfo.d.ts

@@ -2,7 +2,7 @@ import { VariantProps } from 'tailwind-variants';
 declare const userInfoStyles: import('tailwind-variants').TVReturnType<{
     [key: string]: {
         [key: string]: import('tailwind-merge').ClassNameValue | {
-            displayName?: import('tailwind-merge').ClassNameValue;
+            name?: import('tailwind-merge').ClassNameValue;
             base?: import('tailwind-merge').ClassNameValue;
             userInfo?: import('tailwind-merge').ClassNameValue;
             detailInfo?: import('tailwind-merge').ClassNameValue;
@@ -12,7 +12,7 @@ declare const userInfoStyles: import('tailwind-variants').TVReturnType<{
 } | {
     [x: string]: {
         [x: string]: import('tailwind-merge').ClassNameValue | {
-            displayName?: import('tailwind-merge').ClassNameValue;
+            name?: import('tailwind-merge').ClassNameValue;
             base?: import('tailwind-merge').ClassNameValue;
             userInfo?: import('tailwind-merge').ClassNameValue;
             detailInfo?: import('tailwind-merge').ClassNameValue;
@@ -22,13 +22,13 @@ declare const userInfoStyles: import('tailwind-variants').TVReturnType<{
 } | {}, {
     base: string[];
     userInfo: string[];
-    displayName: string[];
+    name: string[];
     detailInfo: string[];
     timeInfo: string[];
 }, undefined, {
     [key: string]: {
         [key: string]: import('tailwind-merge').ClassNameValue | {
-            displayName?: import('tailwind-merge').ClassNameValue;
+            name?: import('tailwind-merge').ClassNameValue;
             base?: import('tailwind-merge').ClassNameValue;
             userInfo?: import('tailwind-merge').ClassNameValue;
             detailInfo?: import('tailwind-merge').ClassNameValue;
@@ -38,13 +38,13 @@ declare const userInfoStyles: import('tailwind-variants').TVReturnType<{
 } | {}, {
     base: string[];
     userInfo: string[];
-    displayName: string[];
+    name: string[];
     detailInfo: string[];
     timeInfo: string[];
 }, import('tailwind-variants').TVReturnType<unknown, {
     base: string[];
     userInfo: string[];
-    displayName: string[];
+    name: string[];
     detailInfo: string[];
     timeInfo: string[];
 }, undefined, unknown, unknown, undefined>>;
@@ -52,15 +52,15 @@ type UserInfoVariants = VariantProps<typeof userInfoStyles>;
 type UserInfoSize = "sm" | "md" | "lg";
 interface UserInfoProps extends UserInfoVariants {
     /** Avatar image URL */
-    src?: string;
+    src?: string | null;
     /** Size variant of the component */
     size: UserInfoSize;
     /** Display name of the user */
-    displayName: string | undefined;
+    displayName?: string | null;
     /** Username of the user */
-    userName: string | undefined;
+    userName?: string | null;
     /** Timestamp for the user activity */
-    timestamp?: Date;
+    timestamp?: Date | null;
     /** Click handler for the whole UserInfo component */
     onClick: () => void;
 }

package/dist/compositions/user-info/UserInfo.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"UserInfo.d.ts","sourceRoot":"","sources":["../../../src/compositions/user-info/UserInfo.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAM,KAAK,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAM1D,QAAA,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;2CAQlB,CAAC;AAEH,KAAK,gBAAgB,GAAG,YAAY,CAAC,OAAO,cAAc,CAAC,CAAC;AAC5D,KAAK,YAAY,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEvC,UAAU,aAAc,SAAQ,gBAAgB;IAC9C,uBAAuB;IACvB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,oCAAoC;IACpC,IAAI,EAAE,YAAY,CAAC;IACnB,+BAA+B;IAC/B,WAAW,EAAE,MAAM,GAAG,SAAS,CAAC;IAChC,2BAA2B;IAC3B,QAAQ,EAAE,MAAM,GAAG,SAAS,CAAC;IAC7B,sCAAsC;IACtC,SAAS,CAAC,EAAE,IAAI,CAAC;IACjB,qDAAqD;IACrD,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAoCD;;;;;;GAMG;AACH,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CA6C5C,CAAC"}
+{"version":3,"file":"UserInfo.d.ts","sourceRoot":"","sources":["../../../src/compositions/user-info/UserInfo.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAM,KAAK,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAM1D,QAAA,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;2CAQlB,CAAC;AAEH,KAAK,gBAAgB,GAAG,YAAY,CAAC,OAAO,cAAc,CAAC,CAAC;AAC5D,KAAK,YAAY,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAEvC,UAAU,aAAc,SAAQ,gBAAgB;IAC9C,uBAAuB;IACvB,GAAG,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACpB,oCAAoC;IACpC,IAAI,EAAE,YAAY,CAAC;IACnB,+BAA+B;IAC/B,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B,2BAA2B;IAC3B,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,sCAAsC;IACtC,SAAS,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IACxB,qDAAqD;IACrD,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB;AAoCD;;;;;;GAMG;AACH,eAAO,MAAM,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,aAAa,CAqC5C,CAAC"}

package/dist/compositions/user-info/UserInfo.js

@@ -10,7 +10,7 @@ const userInfoStyles = tv({
   slots: {
     base: ["flex", "gap-2", "items-center"],
     userInfo: ["flex", "flex-col", "gap-2", "justify-center", "items-start"],
-    displayName: ["text-slate-900", "**:cursor-pointer"],
+    name: ["text-slate-900", "**:cursor-pointer"],
     detailInfo: ["flex", "flex", "gap-4"],
     timeInfo: ["text-slate-500"]
   }
@@ -45,10 +45,15 @@ function getLabelSize(size) {
       return "md";
   }
 }
-const UserInfo = (props) => {
-  const { base, userInfo, displayName, detailInfo, timeInfo } = userInfoStyles(props);
+const UserInfo = ({
+  displayName = "New User",
+  userName = "newuser",
+  timestamp = /* @__PURE__ */ new Date(),
+  ...props
+}) => {
+  const { base, userInfo, name, detailInfo, timeInfo } = userInfoStyles(props);
   return /* @__PURE__ */ jsxs("div", { className: base(), children: [
-    props.src && /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsx(
       Avatar,
       {
         alt: "Profile",
@@ -58,25 +63,17 @@ const UserInfo = (props) => {
       }
     ),
     /* @__PURE__ */ jsxs("div", { className: userInfo(), children: [
-      /* @__PURE__ */ jsx("button", { onClick: props.onClick, className: displayName(), children: props.displayName && /* @__PURE__ */ jsx(Label, { size: getLabelSize(props.size), children: props.displayName }) }),
+      /* @__PURE__ */ jsx("button", { onClick: props.onClick, className: name(), children: /* @__PURE__ */ jsx(Label, { size: getLabelSize(props.size), children: displayName }) }),
       /* @__PURE__ */ jsxs("div", { className: detailInfo(), children: [
-        props.userName && /* @__PURE__ */ jsx(
-          IconButton,
-          {
-            intent: "secondary",
-            icon: Profile,
-            onClick: props.onClick,
-            children: props.userName
-          }
-        ),
-        props.timestamp && /* @__PURE__ */ jsx(
+        /* @__PURE__ */ jsx(IconButton, { intent: "secondary", icon: Profile, onClick: props.onClick, children: userName }),
+        /* @__PURE__ */ jsx(
           IconButton,
           {
             intent: "primary",
             icon: Time,
             className: timeInfo(),
             onClick: props.onClick,
-            children: timeSince(props.timestamp)
+            children: timeSince(timestamp)
           }
         )
       ] })

package/dist/compositions/utils/keyword.utils.d.ts

@@ -9,5 +9,5 @@
  * @param {string} text - The input text that may contain hashtags.
  * @returns {(string | React.ReactNode)[]} A list of text segments and `<Keyword>` components.
  */
-export declare function renderWithHashtags(text?: string): (string | import("react/jsx-runtime").JSX.Element)[];
+export declare function renderWithHashtags(text?: string | null): (string | import("react/jsx-runtime").JSX.Element)[];
 //# sourceMappingURL=keyword.utils.d.ts.map

package/dist/compositions/utils/keyword.utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"keyword.utils.d.ts","sourceRoot":"","sources":["../../../src/compositions/utils/keyword.utils.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;GAUG;AACH,wBAAgB,kBAAkB,CAAC,IAAI,GAAE,MAAW,wDA0BnD"}
+{"version":3,"file":"keyword.utils.d.ts","sourceRoot":"","sources":["../../../src/compositions/utils/keyword.utils.tsx"],"names":[],"mappings":"AAEA;;;;;;;;;;GAUG;AACH,wBAAgB,kBAAkB,CAAC,IAAI,GAAE,MAAM,GAAG,IAAS,wDA0B1D"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@krrli/cm-designsystem",
   "repository": "https://github.com/ost-cas-fea-25-26/cm-designsystem",
-  "version": "1.33.1",
+  "version": "1.33.3",
   "type": "module",
   "main": "dist/index.js",
   "module": "dist/index.js",
@@ -62,9 +62,9 @@
     "@types/react": "19.2.7",
     "@types/react-dom": "19.2.3",
     "@vitejs/plugin-react": "5.1.2",
-    "@vitest/browser": "4.0.15",
-    "@vitest/browser-playwright": "4.0.15",
-    "@vitest/coverage-v8": "4.0.15",
+    "@vitest/browser": "4.0.16",
+    "@vitest/browser-playwright": "4.0.16",
+    "@vitest/coverage-v8": "4.0.16",
     "eslint": "9.39.2",
     "eslint-config-prettier": "10.1.8",
     "eslint-import-resolver-typescript": "4.4.4",
@@ -72,12 +72,12 @@
     "eslint-plugin-jsx-a11y": "6.10.2",
     "eslint-plugin-react": "7.37.5",
     "eslint-plugin-react-hooks": "7.0.1",
-    "eslint-plugin-react-refresh": "0.4.25",
+    "eslint-plugin-react-refresh": "0.4.26",
     "eslint-plugin-storybook": "10.1.9",
     "eslint-plugin-unused-imports": "4.3.0",
     "globals": "16.5.0",
     "jsdom": "27.3.0",
-    "knip": "5.74.0",
+    "knip": "5.75.1",
     "playwright": "1.57.0",
     "prettier": "3.7.4",
     "prettier-plugin-tailwindcss": "0.7.2",
@@ -91,6 +91,6 @@
     "vite": "7.3.0",
     "vite-plugin-dts": "4.5.4",
     "vite-plugin-svgr": "^4.5.0",
-    "vitest": "4.0.15"
+    "vitest": "4.0.16"
   }
 }