@devalok/shilp-sutra 0.19.0 → 0.20.0

package/dist/ui/banner.js

@@ -1,13 +1,13 @@
 "use client";
-import { jsx as e, jsxs as b } from "react/jsx-runtime";
-import { IconInfoCircle as o, IconAlertCircle as g, IconAlertTriangle as p, IconCircleCheck as h, IconX as x } from "@tabler/icons-react";
+import { jsx as e, jsxs as h } from "react/jsx-runtime";
+import { IconInfoCircle as n, IconAlertCircle as p, IconAlertTriangle as x, IconCircleCheck as v, IconX as w } from "@tabler/icons-react";
 import * as r from "react";
-import { ag as v } from "../_chunks/vendor-utils.js";
-import { cn as w } from "./lib/utils.js";
-import { springs as N, motionProps as I } from "./lib/motion.js";
-import { A as C, m as y } from "../_chunks/framer.js";
-const k = v(
-  "flex items-center gap-ds-04 px-ds-06 py-ds-04 text-ds-md font-medium border-b",
+import { ag as k } from "../_chunks/vendor-utils.js";
+import { cn as N } from "./lib/utils.js";
+import { springs as I, motionProps as C } from "./lib/motion.js";
+import { A as y, m as A } from "../_chunks/framer.js";
+const _ = k(
+  "flex flex-wrap items-center gap-ds-04 px-ds-06 py-ds-04 text-ds-md font-medium border-b",
   {
     variants: {
       color: {
@@ -20,39 +20,39 @@ const k = v(
     },
     defaultVariants: { color: "info" }
   }
-), A = {
-  info: o,
-  success: h,
-  warning: p,
-  error: g,
-  neutral: o
-}, V = r.forwardRef(
-  ({ className: t, color: s = "info", action: n, onDismiss: i, children: a, ...c }, l) => {
-    const m = A[s ?? "info"], [f, d] = r.useState(!0), u = r.useCallback(() => {
-      d(!1);
+), V = {
+  info: n,
+  success: v,
+  warning: x,
+  error: p,
+  neutral: n
+}, j = r.forwardRef(
+  ({ className: t, color: s = "info", action: a, actions: c, onDismiss: o, children: l, ...d }, m) => {
+    const i = c ?? a, f = V[s ?? "info"], [u, b] = r.useState(!0), g = r.useCallback(() => {
+      b(!1);
     }, []);
-    return /* @__PURE__ */ e(C, { onExitComplete: i, children: f && /* @__PURE__ */ b(
-      y.div,
+    return /* @__PURE__ */ e(y, { onExitComplete: o, children: u && /* @__PURE__ */ h(
+      A.div,
       {
-        ref: l,
+        ref: m,
         initial: { height: "auto", opacity: 1 },
         exit: { height: 0, opacity: 0 },
-        transition: N.snappy,
-        className: w(k({ color: s }), "overflow-hidden", t),
+        transition: I.snappy,
+        className: N(_({ color: s }), "overflow-hidden", t),
         role: "alert",
-        ...I(c),
+        ...C(d),
         children: [
-          /* @__PURE__ */ e(m, { className: "h-ico-md w-ico-md shrink-0", "aria-hidden": "true" }),
-          /* @__PURE__ */ e("span", { className: "flex-1", children: a }),
-          n && /* @__PURE__ */ e("span", { className: "shrink-0", children: n }),
-          i && /* @__PURE__ */ e(
+          /* @__PURE__ */ e(f, { className: "h-ico-md w-ico-md shrink-0", "aria-hidden": "true" }),
+          /* @__PURE__ */ e("div", { className: "min-w-0 flex-1", children: l }),
+          i && /* @__PURE__ */ e("div", { className: "flex shrink-0 items-center gap-ds-02 [&_button]:transition-colors [&_button]:duration-150 [&_button:hover]:bg-black/10 [&_button:hover]:dark:bg-white/10", children: i }),
+          o && /* @__PURE__ */ e(
             "button",
             {
               type: "button",
-              onClick: u,
-              className: "shrink-0 min-h-ds-xs min-w-ds-xs flex items-center justify-center rounded-ds-sm text-surface-fg-subtle transition-colors hover:text-surface-fg-muted hover:bg-surface-3 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent-9",
+              onClick: g,
+              className: "shrink-0 min-h-ds-xs min-w-ds-xs flex items-center justify-center rounded-ds-sm transition-colors duration-150 hover:bg-black/10 dark:hover:bg-white/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-accent-9",
               "aria-label": "Dismiss",
-              children: /* @__PURE__ */ e(x, { className: "h-ico-sm w-ico-sm" })
+              children: /* @__PURE__ */ e(w, { className: "h-ico-sm w-ico-sm" })
             }
           )
         ]
@@ -60,8 +60,8 @@ const k = v(
     ) });
   }
 );
-V.displayName = "Banner";
+j.displayName = "Banner";
 export {
-  V as Banner,
-  k as bannerVariants
+  j as Banner,
+  _ as bannerVariants
 };

package/dist/ui/chip.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"chip.d.ts","sourceRoot":"","sources":["../../src/ui/chip.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAQjE,QAAA,MAAM,YAAY;;;;8EA6DjB,CAAA;AAED,KAAK,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,GAAG,QAAQ,GAAG,SAAS,CAAA;AAEzJ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH,KAAK,SAAS,GAAG,IAAI,CAAC,YAAY,CAAC,OAAO,YAAY,CAAC,EAAE,OAAO,CAAC,GAAG;IAClE,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAA;IACjC,SAAS,CAAC,EAAE,MAAM,IAAI,CAAA;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA;AAED,QAAA,MAAM,IAAI;;;;;WATD,MAAM;YACL,SAAS;WACV,KAAK,CAAC,SAAS;cACZ,KAAK,CAAC,iBAAiB;gBACrB,MAAM,IAAI;eACX,OAAO;gBACN,MAAM;qCA6CnB,CAAA;AAGD,OAAO,EAAE,eAAe,IAAI,SAAS,EAAE,MAAM,eAAe,CAAA;AAC5D,OAAO,EAAE,IAAI,EAAE,YAAY,EAAE,KAAK,SAAS,EAAE,CAAA"}
+{"version":3,"file":"chip.d.ts","sourceRoot":"","sources":["../../src/ui/chip.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAQjE,QAAA,MAAM,YAAY;;;;8EA6DjB,CAAA;AAED,KAAK,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,GAAG,QAAQ,GAAG,SAAS,CAAA;AAEzJ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiCG;AACH,KAAK,SAAS,GAAG,IAAI,CAAC,YAAY,CAAC,OAAO,YAAY,CAAC,EAAE,OAAO,CAAC,GAAG;IAClE,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,OAAO,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAA;IACjC,SAAS,CAAC,EAAE,MAAM,IAAI,CAAA;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA;AAED,QAAA,MAAM,IAAI;;;;;WATD,MAAM;YACL,SAAS;WACV,KAAK,CAAC,SAAS;cACZ,KAAK,CAAC,iBAAiB;gBACrB,MAAM,IAAI;eACX,OAAO;gBACN,MAAM;qCA8CnB,CAAA;AAGD,OAAO,EAAE,eAAe,IAAI,SAAS,EAAE,MAAM,eAAe,CAAA;AAC5D,OAAO,EAAE,IAAI,EAAE,YAAY,EAAE,KAAK,SAAS,EAAE,CAAA"}

package/dist/ui/chip.js

@@ -1,12 +1,12 @@
 "use client";
-import { jsxs as f, jsx as r } from "react/jsx-runtime";
+import { jsxs as f, jsx as a } from "react/jsx-runtime";
 import * as v from "react";
 import { IconX as N } from "@tabler/icons-react";
 import { ag as h } from "../_chunks/vendor-utils.js";
 import { springs as w, motionProps as C } from "./lib/motion.js";
 import { cn as k } from "./lib/utils.js";
 import { m as n } from "../_chunks/framer.js";
-import { A as $ } from "../_chunks/framer.js";
+import { A as X } from "../_chunks/framer.js";
 const j = h(
   "inline-flex items-center gap-ds-02 font-sans leading-ds-relaxed rounded-ds-full transition-colors duration-fast-01",
   {
@@ -69,8 +69,8 @@ const j = h(
     }
   }
 ), R = v.forwardRef(
-  ({ label: t, variant: i, size: l, color: g, icon: o, onClick: s, onDismiss: c, disabled: a, className: d, ...m }, b) => {
-    const e = !!s, u = e ? n.button : n.span, y = e && !a ? "cursor-pointer hover:bg-surface-4 active:scale-95" : "", x = a ? "opacity-action-disabled cursor-not-allowed" : "";
+  ({ label: t, variant: i, size: l, color: g, icon: o, onClick: s, onDismiss: c, disabled: e, className: d, ...m }, b) => {
+    const r = !!s, u = r ? n.button : n.span, y = r && !e ? "cursor-pointer hover:bg-surface-4" : "", x = e ? "opacity-action-disabled cursor-not-allowed" : "";
     return /* @__PURE__ */ f(
       u,
       {
@@ -78,16 +78,17 @@ const j = h(
         layout: !0,
         initial: { opacity: 1, scale: 1 },
         exit: { opacity: 0, scale: 0.8 },
+        whileTap: r && !e ? { scale: 0.95 } : void 0,
         transition: w.snappy,
         className: k(j({ variant: i, size: l, color: g }), y, x, d),
-        onClick: e ? s : void 0,
-        disabled: e ? a : void 0,
-        type: e ? "button" : void 0,
+        onClick: r ? s : void 0,
+        disabled: r ? e : void 0,
+        type: r ? "button" : void 0,
         ...C(m),
         children: [
-          o && /* @__PURE__ */ r("span", { className: "flex-shrink-0 [&>svg]:w-ico-sm [&>svg]:h-ico-sm", children: o }),
-          /* @__PURE__ */ r("span", { children: t }),
-          c && /* @__PURE__ */ r(
+          o && /* @__PURE__ */ a("span", { className: "flex-shrink-0 [&>svg]:w-ico-sm [&>svg]:h-ico-sm", children: o }),
+          /* @__PURE__ */ a("span", { children: t }),
+          c && /* @__PURE__ */ a(
             "button",
             {
               type: "button",
@@ -96,7 +97,7 @@ const j = h(
               onClick: (p) => {
                 p.stopPropagation(), c();
               },
-              children: /* @__PURE__ */ r(N, { className: "h-ico-sm w-ico-sm" })
+              children: /* @__PURE__ */ a(N, { className: "h-ico-sm w-ico-sm" })
             }
           )
         ]
@@ -107,6 +108,6 @@ const j = h(
 R.displayName = "Chip";
 export {
   R as Chip,
-  $ as ChipGroup,
+  X as ChipGroup,
   j as chipVariants
 };

package/dist/ui/dialog.js

@@ -56,12 +56,12 @@ const H = t.forwardRef(({ className: a, children: s, ...e }, r) => {
         children: /* @__PURE__ */ d(
           g.div,
           {
-            initial: { opacity: 0, scale: 0.95 },
-            animate: { opacity: 1, scale: 1 },
-            exit: { opacity: 0, scale: 0.95 },
+            initial: { opacity: 0, scale: 0.95, x: "-50%", y: "-50%" },
+            animate: { opacity: 1, scale: 1, x: "-50%", y: "-50%" },
+            exit: { opacity: 0, scale: 0.95, x: "-50%", y: "-50%" },
             transition: { ...T.smooth, opacity: p.fade },
             className: i(
-              "fixed left-[50%] top-[50%] z-modal grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-ds-05 border border-surface-border-strong bg-surface-1 p-ds-06 shadow-04 rounded-ds-xl",
+              "fixed left-[50%] top-[50%] z-modal grid w-full max-w-lg gap-ds-05 border border-surface-border-strong bg-surface-1 p-ds-06 shadow-04 rounded-ds-xl",
               a
             ),
             children: [

package/docs/components/composed/activity-feed.md

@@ -12,9 +12,11 @@
     emptyState?: ReactNode — empty state content
     compact: boolean — tighter spacing, no avatars, smaller text
     maxInitialItems: number — truncate with "Show all (N)" toggle
+    groupBy?: 'time' | 'none' — group items by time buckets (today, yesterday, this week, older)
+    groupLabels?: GroupLabels — custom labels for time groups: { today?, yesterday?, thisWeek?, older? }
 
 ## Defaults
-    loading=false, compact=false, hasMore=false
+    loading=false, compact=false, hasMore=false, groupBy='none'
 
 ## Example
 ```jsx
@@ -29,13 +31,23 @@
 />
 ```
 
+## Exported Utilities
+    groupItemsByTime(items: ActivityItem[], labels?: GroupLabels) — pure function that buckets items into time groups; returns { label: string, items: ActivityItem[] }[]
+
 ## Gotchas
 - `items` is required — passing an empty array renders the `emptyState` content
 - `color` on each item controls the timeline dot color
 - `actor.image` is optional — falls back to initials from `actor.name`
 - `maxInitialItems` truncates with a "Show all (N)" toggle button
+- `maxInitialItems` applies to the flat list BEFORE grouping — items are sliced first, then grouped
+- Empty time groups are automatically skipped
 
 ## Changes
+### v0.20.0
+- **Added** `groupBy="time"` prop — groups items into Today, Yesterday, This Week, Older with section headers
+- **Added** `groupLabels` prop for custom group label text
+- **Added** `groupItemsByTime()` exported pure utility function
+
 ### v0.18.0
 - **Fixed** `bg-accent-9` changed to `bg-info-9` (info color, not accent)
 

package/docs/components/ui/alert-dialog.md

@@ -46,6 +46,9 @@
 - AlertDialogAction does NOT have color="error" styling — add it yourself via className or wrap a Button
 
 ## Changes
+### v0.19.1
+- **Fixed** AlertDialog not centered after Framer Motion animation completes — same `transform: none` fix as Dialog.
+
 ### v0.18.0
 - **Changed** Overlay animations migrated to Framer Motion (physics-based springs)
 - **Added** `AlertDialogContentProps`, `AlertDialogActionProps`, `AlertDialogCancelProps` type exports

package/docs/components/ui/banner.md

@@ -6,7 +6,8 @@
 
 ## Props
     color: "info" | "success" | "warning" | "error" | "neutral"
-    action: ReactNode (optional action slot, typically a ghost Button)
+    actions: ReactNode (optional action slot for one or more buttons; wraps on narrow viewports)
+    action: ReactNode (DEPRECATED — use `actions` instead)
     onDismiss: () => void (optional, shows X button)
     children: ReactNode (message text)
 
@@ -26,6 +27,11 @@
 - `onDismiss` fires after the exit animation completes, not immediately on dismiss button click
 
 ## Changes
+### v0.20.0
+- **Added** `actions` prop (plural) for multiple action buttons with mobile-friendly flex-wrap
+- **Deprecated** `action` prop — use `actions` instead (both still work; `actions` takes priority)
+- **Changed** Root layout uses `flex-wrap` and children wrapper uses `min-w-0` for better text truncation
+
 ### v0.3.1
 - **Fixed** BannerProps uses `Omit<HTMLAttributes, 'color'>` to resolve TypeScript conflict with CVA `color` variant
 

package/docs/components/ui/chip.md

@@ -33,6 +33,9 @@
 - `color="primary"` will be renamed to `color="brand"` in v1.0 — use `color="primary"` for now
 
 ## Changes
+### v0.19.1
+- **Fixed** `active:scale-95` tap feedback broken by Framer Motion transform override — replaced with `whileTap={{ scale: 0.95 }}`
+
 ### v0.4.2
 - **Changed** (BREAKING) `variant="filled"` renamed to `"subtle"`, `variant="outlined"` renamed to `"outline"`, `onDelete` renamed to `onDismiss`
 

package/docs/components/ui/dialog.md

@@ -39,6 +39,9 @@
 - DialogTitle is required for accessibility — screen readers announce it when the dialog opens
 
 ## Changes
+### v0.19.1
+- **Fixed** Dialog not centered after Framer Motion animation completes — `transform: none` inline style overrode Tailwind `translate-x/y` classes. Centering now handled via Framer Motion `x`/`y` properties.
+
 ### v0.18.0
 - **Changed** Overlay animations migrated to Framer Motion (physics-based springs)
 - **Added** `DialogContentProps`, `DialogTitleProps` type exports

package/llms-full.txt

@@ -5,7 +5,7 @@
 > All variant values and props verified from source CVA definitions.
 >
 > Package: @devalok/shilp-sutra
-> Version: 0.19.0
+> Version: 0.20.0
 
 ---
 
@@ -231,6 +231,9 @@ Note: getFormFieldA11y() was removed in favor of useFormField() hook.
 - AlertDialogAction does NOT have color="error" styling — add it yourself via className or wrap a Button
 
 ## Changes
+### v0.19.1
+- **Fixed** AlertDialog not centered after Framer Motion animation completes — same `transform: none` fix as Dialog.
+
 ### v0.18.0
 - **Changed** Overlay animations migrated to Framer Motion (physics-based springs)
 - **Added** `AlertDialogContentProps`, `AlertDialogActionProps`, `AlertDialogCancelProps` type exports
@@ -404,7 +407,8 @@ Note: getFormFieldA11y() was removed in favor of useFormField() hook.
 
 ## Props
     color: "info" | "success" | "warning" | "error" | "neutral"
-    action: ReactNode (optional action slot, typically a ghost Button)
+    actions: ReactNode (optional action slot for one or more buttons; wraps on narrow viewports)
+    action: ReactNode (DEPRECATED — use `actions` instead)
     onDismiss: () => void (optional, shows X button)
     children: ReactNode (message text)
 
@@ -424,6 +428,11 @@ Note: getFormFieldA11y() was removed in favor of useFormField() hook.
 - `onDismiss` fires after the exit animation completes, not immediately on dismiss button click
 
 ## Changes
+### v0.20.0
+- **Added** `actions` prop (plural) for multiple action buttons with mobile-friendly flex-wrap
+- **Deprecated** `action` prop — use `actions` instead (both still work; `actions` takes priority)
+- **Changed** Root layout uses `flex-wrap` and children wrapper uses `min-w-0` for better text truncation
+
 ### v0.3.1
 - **Fixed** BannerProps uses `Omit<HTMLAttributes, 'color'>` to resolve TypeScript conflict with CVA `color` variant
 
@@ -713,6 +722,9 @@ import { BarChart } from '@devalok/shilp-sutra/ui/charts'
 - `color="primary"` will be renamed to `color="brand"` in v1.0 — use `color="primary"` for now
 
 ## Changes
+### v0.19.1
+- **Fixed** `active:scale-95` tap feedback broken by Framer Motion transform override — replaced with `whileTap={{ scale: 0.95 }}`
+
 ### v0.4.2
 - **Changed** (BREAKING) `variant="filled"` renamed to `"subtle"`, `variant="outlined"` renamed to `"outline"`, `onDelete` renamed to `onDismiss`
 
@@ -1126,6 +1138,9 @@ import { DataTableToolbar } from '@devalok/shilp-sutra/ui/data-table-toolbar'
 - DialogTitle is required for accessibility — screen readers announce it when the dialog opens
 
 ## Changes
+### v0.19.1
+- **Fixed** Dialog not centered after Framer Motion animation completes — `transform: none` inline style overrode Tailwind `translate-x/y` classes. Centering now handled via Framer Motion `x`/`y` properties.
+
 ### v0.18.0
 - **Changed** Overlay animations migrated to Framer Motion (physics-based springs)
 - **Added** `DialogContentProps`, `DialogTitleProps` type exports
@@ -2902,9 +2917,11 @@ export default function RootLayout({ children }) {
     emptyState?: ReactNode — empty state content
     compact: boolean — tighter spacing, no avatars, smaller text
     maxInitialItems: number — truncate with "Show all (N)" toggle
+    groupBy?: 'time' | 'none' — group items by time buckets (today, yesterday, this week, older)
+    groupLabels?: GroupLabels — custom labels for time groups: { today?, yesterday?, thisWeek?, older? }
 
 ## Defaults
-    loading=false, compact=false, hasMore=false
+    loading=false, compact=false, hasMore=false, groupBy='none'
 
 ## Example
 ```jsx
@@ -2919,13 +2936,23 @@ export default function RootLayout({ children }) {
 />
 ```
 
+## Exported Utilities
+    groupItemsByTime(items: ActivityItem[], labels?: GroupLabels) — pure function that buckets items into time groups; returns { label: string, items: ActivityItem[] }[]
+
 ## Gotchas
 - `items` is required — passing an empty array renders the `emptyState` content
 - `color` on each item controls the timeline dot color
 - `actor.image` is optional — falls back to initials from `actor.name`
 - `maxInitialItems` truncates with a "Show all (N)" toggle button
+- `maxInitialItems` applies to the flat list BEFORE grouping — items are sliced first, then grouped
+- Empty time groups are automatically skipped
 
 ## Changes
+### v0.20.0
+- **Added** `groupBy="time"` prop — groups items into Today, Yesterday, This Week, Older with section headers
+- **Added** `groupLabels` prop for custom group label text
+- **Added** `groupItemsByTime()` exported pure utility function
+
 ### v0.18.0
 - **Fixed** `bg-accent-9` changed to `bg-info-9` (info color, not accent)
 

package/llms.txt

@@ -167,7 +167,7 @@ Components with two-axis system: Button, Badge, Alert, Chip, Banner, Progress, S
 
 ### Feedback & Notifications
 - Alert: variant(subtle|filled|outline) color(info|success|warning|error|neutral) + title, onDismiss
-- Banner: color(info|success|warning|error|neutral) + title, onDismiss
+- Banner: color(info|success|warning|error|neutral) + actions?(ReactNode), onDismiss. `action` (singular) deprecated, use `actions`. Mobile flex-wrap for multiple buttons.
 - Toast: imperative API via toast.success/error/warning/info/loading/message/undo/promise/upload/custom — REQUIRES <Toaster> at layout root
 - Spinner: size(sm|md|lg) — renders with role="status"
 - Progress: track size(sm|md|lg), indicator color(default|success|warning|error)
@@ -238,7 +238,7 @@ NOTIFICATION SELECTION GUIDE:
 - (UploadProgress REMOVED — upload tracking is now built into toast.upload())
 - RichTextEditor: Tiptap editor — bold/italic/underline/strike/highlight, headings, blockquote, lists (bullet/ordered/task), code, links, images (paste/drop/upload), file attachments, @mentions, emoji picker + :shortcode:, text alignment, HR. Props: onImageUpload?, onFileUpload?, mentions?, onMentionSearch?, onMentionSelect?(item: MentionItem)
 - RichTextViewer: read-only renderer for RichTextEditor HTML content (renders all above content types)
-- ActivityFeed: items(ActivityItem[]), onLoadMore, loading, hasMore, emptyState, compact, maxInitialItems. Type: ActivityItem = { id, actor?, action, timestamp, icon?, color?, detail? }
+- ActivityFeed: items(ActivityItem[]), onLoadMore, loading, hasMore, emptyState, compact, maxInitialItems, groupBy?('time'|'none'), groupLabels?({ today, yesterday, thisWeek, older }). Type: ActivityItem = { id, actor?, action, timestamp, icon?, color?, detail? }. Utility: groupItemsByTime(items, labels) exported.
 - CommandPalette, MemberPicker
 - ErrorDisplay, GlobalLoading
 - Loading skeletons: CardSkeleton, TableSkeleton, BoardSkeleton, ListSkeleton