admin-ui-starter-kit 0.1.4 → 0.4.2

package/dist/showcase/assets/event-log-ckmsCPmG.js

@@ -1,330 +0,0 @@
-import{n as e,r as t}from"./chunk-QTnfLwEv.js";import{n}from"./react-dom-Bz4cALsF.js";import{Cr as r,Pr as i,Tr as a,hr as o,mr as s,t as c}from"./example-C6-_Sy6B.js";import{o as l,r as u,t as d}from"./comment-composer-DTJtqYGP.js";import{t as f}from"./bell-CVEeEWw4.js";import{t as p}from"./circle-check-BCxORlAM.js";import{t as m}from"./circle-BBmNFtO8.js";import{t as h}from"./comment-item-DIEYMmV_.js";import{t as g}from"./credit-card-BoDfW0R8.js";import{t as _}from"./git-branch-BO9i8XkJ.js";import{t as v}from"./package-CUNvdlBi.js";import{t as y}from"./shield-alert-DNOTmkwG.js";import{t as b}from"./user-CGcV8Ppb.js";import{D as x,a as S}from"./index-B8DVXCmf.js";import{t as C}from"./props-table-CM_1cocj.js";import{t as w}from"./smart-card-7szg_qSt.js";var T={listAriaLabel:`Activity timeline`,emptyMessage:`No activity yet.`},E=S(),D={primary:`bg-primary/10 text-primary`,success:`bg-success/15 text-success`,warning:`bg-warning/40 text-warning-foreground`,destructive:`bg-destructive/10 text-destructive`,info:`bg-info/15 text-info`,secondary:`bg-muted text-muted-foreground`},O=({entry:e,resources:t,formatRelativeTime:n,isLast:i})=>{let o=e.icon??m,s=e.tone??`secondary`,c=e.timestamp&&n?n(e.timestamp):e.timestamp;return(0,E.jsxs)(`li`,{className:`relative flex gap-3`,"data-event-id":e.id,children:[(0,E.jsxs)(`div`,{className:`relative flex flex-col items-center pt-1`,children:[(0,E.jsx)(`div`,{className:a(`flex size-6 shrink-0 items-center justify-center rounded-full ring-1 ring-foreground/[0.04]`,D[s]),children:(0,E.jsx)(o,{className:`size-3`,"aria-hidden":!0})}),!i&&(0,E.jsx)(`div`,{className:`bg-border/60 mt-1 w-px flex-1`,"aria-hidden":!0})]}),(0,E.jsxs)(`div`,{className:`min-w-0 flex-1 pb-3`,children:[(0,E.jsxs)(`div`,{className:`flex flex-wrap items-baseline gap-x-1.5`,children:[!!e.actor&&(0,E.jsx)(r,{tag:`span`,weight:`semibold`,children:e.actor}),!!e.action&&(0,E.jsx)(r,{tag:`span`,type:`secondary`,children:e.action}),!!e.target&&(0,E.jsx)(r,{tag:`span`,weight:`medium`,children:e.target}),!!e.headline&&!e.action&&!e.target&&(0,E.jsx)(r,{tag:`span`,children:e.headline}),!!c&&(0,E.jsx)(r,{tag:`span`,size:`xs`,type:`secondary`,className:`ml-auto shrink-0 tabular-nums`,children:c})]}),!!e.description&&(0,E.jsx)(`div`,{className:`mt-1 text-sm leading-relaxed`,children:(0,E.jsx)(u,{html:e.description,mentions:e.mentions,resources:t})}),e.metadata&&e.metadata.length>0&&(0,E.jsx)(`div`,{className:`mt-1 flex flex-wrap gap-x-3 gap-y-0.5`,children:e.metadata.map(e=>(0,E.jsxs)(r,{size:`xs`,type:`secondary`,className:`inline-flex items-baseline gap-1`,children:[(0,E.jsxs)(r,{tag:`span`,size:`xs`,type:`discrete`,children:[e.label,`:`]}),(0,E.jsx)(r,{tag:`span`,size:`xs`,type:`secondary`,children:e.value})]},e.label))})]})]})},k=t(n(),1);function A(e){if(!e)return()=>{};let t={setErrors:()=>{},reset:()=>{},setSubmitting:()=>{}};return n=>{e(n,t)}}function j(e,t){let n=[...e];return n.sort((e,n)=>{let r=e.timestamp?new Date(e.timestamp).getTime():0,i=n.timestamp?new Date(n.timestamp).getTime():0;return t===`asc`?r-i:i-r}),n}function M(e){let{entries:t,order:n=`desc`,resources:o,onResourceSearch:s,canModerate:c,onCommentDelete:l,onCommentReact:u,onCommentReply:f,onCommentPinToggle:p,strings:m,eventLogStrings:g,renderers:_,composer:v,bare:y=!1,title:b,getMediaUrl:S,getMediaName:C,getStatusLabel:D,formatRelativeTime:M,className:N}=e,P=o,F=s,I=(0,k.useMemo)(()=>j(t,n),[t,n]),L=x(T,g),{formatRelativeTime:R}=i(),z=M??R??(e=>e),B=(e,t,n)=>{let r=t===n-1,i=_?.[e.kind];if(i)return i(e,{resources:P,accessors:{getMediaUrl:S,getMediaName:C,getStatusLabel:D,formatRelativeTime:z},strings:m});if(e.kind===`comment`){let t=e;return(0,E.jsx)(`li`,{className:a(`event-log--component`,`relative`),"data-event-id":t.id,children:(0,E.jsx)(h,{comment:t.comment,canModerate:c,onDelete:l,onPinToggle:p,onReact:u,onReply:f,strings:m,resources:P,getMediaUrl:S,getMediaName:C,getStatusLabel:D,formatRelativeTime:z})},t.id)}let o=e;return(0,E.jsx)(O,{entry:o,resources:P,formatRelativeTime:z,isLast:r},o.id)},V=v?.enabled?(0,E.jsx)(`div`,{children:(0,E.jsx)(d,{context:v.context,canComment:!0,onSubmit:A(v.onSubmit),resources:P,onResourceSearch:F,placeholder:v.placeholder,autoFocus:v.autoFocus})}):null,H=v?.position??`top`,U=I.length===0?(0,E.jsx)(r,{type:`secondary`,className:`py-2`,children:L.emptyMessage}):(0,E.jsx)(`ul`,{"aria-label":L.listAriaLabel,className:`flex flex-col gap-2.5`,children:I.map((e,t)=>B(e,t,I.length))}),W=(0,E.jsxs)(`div`,{className:`flex flex-col gap-4`,children:[H===`top`&&V,U,H===`bottom`&&V]});return y?W:(0,E.jsx)(w,{title:b,padding:`sm`,className:N,children:W})}M.displayName=`EventLog`;var N=e({APISurface:()=>W,CommentsEventsUnderOneLog:()=>G,ReadOnlyTimelineNoComposer:()=>K}),P=[{id:`maria`,label:`Sarah Smitha`,description:`Head of Operations`,kind:`user`},{id:`ivana`,label:`Davida Todorova`,description:`Refunds Specialist`,kind:`user`},{id:`stefan`,label:`Daniel Kowalski`,description:`Customer`,kind:`user`},{id:`kris`,label:`Kris Dineva`,description:`Engineering`,kind:`user`}],F=[{id:`BKG-2026-0408`,label:`BKG-2026-0408`,description:`Daniel Kowalski · Apr 12 → Apr 14`,kind:`booking`},{id:`BKG-2026-0421`,label:`BKG-2026-0421`,description:`Sarah Smitha · Apr 19 → Apr 22`,kind:`booking`}],I=[{id:`ORD-A219`,label:`ORD-A219`,description:`€420.00 · Refund pending`,kind:`order`},{id:`ORD-A284`,label:`ORD-A284`,description:`€88.50 · Captured`,kind:`order`}],L=[{id:`SPR-Q2-W3`,label:`Sprint Q2-W3`,description:`Refund flows`,kind:`sprint`}],R={user:{icon:b,label:`Person`,trigger:`@`,tone:`info`,buildHref:e=>`/people/${e.id}`},booking:{icon:l,label:`Booking`,trigger:`#`,tone:`success`,buildHref:e=>`/bookings/${e.id}`},order:{icon:v,label:`Order`,trigger:`$`,tone:`warning`,buildHref:e=>`/orders/${e.id}`},sprint:{icon:_,label:`Sprint`,tone:`secondary`,buildHref:e=>`/sprints/${e.id}`}};function z(e,t){let n=t===`user`?P:t===`booking`?F:t===`order`?I:L,r=e.trim().toLowerCase();return r.length===0?n:n.filter(e=>e.label.toLowerCase().includes(r)||(e.description??``).toLowerCase().includes(r))}var B=Date.now(),V=e=>new Date(B-e*60*60*1e3).toISOString(),H=(e,t,n)=>({id:`${e}:${t}`,kind:e,label:n,href:`/${e}s/${t}`}),U=[{id:`evt-1`,kind:`event`,timestamp:V(48),icon:p,tone:`success`,actor:`System`,action:`created`,target:`BKG-2026-0408`,description:`New booking opened by <span data-ref-id="user:stefan" data-ref-kind="user">@Daniel Kowalski</span>.`,mentions:[H(`user`,`stefan`,`Daniel Kowalski`)]},{id:`evt-2`,kind:`system`,timestamp:V(36),icon:g,tone:`info`,actor:`Payments`,action:`captured`,target:`€420.00`,description:`Captured for <span data-ref-id="order:ORD-A219" data-ref-kind="order">ORD-A219</span> via Visa •• 4242.`,mentions:[H(`order`,`ORD-A219`,`ORD-A219`)],metadata:[{label:`Method`,value:`card`},{label:`Receipt`,value:`rcpt_8z2`}]},{id:`1`,kind:`comment`,timestamp:V(2),comment:{id:`1`,user:{id:`maria`,name:`Sarah Smitha`},createdAt:V(2),contentType:`html`,content:`Approving the refund for <span data-ref-id="user:stefan" data-ref-kind="user">@Daniel Kowalski</span> on <span data-ref-id="booking:BKG-2026-0408" data-ref-kind="booking">BKG-2026-0408</span> — please process before EOD so the payout window doesn't shift.`,references:[H(`user`,`stefan`,`Daniel Kowalski`),H(`booking`,`BKG-2026-0408`,`BKG-2026-0408`)],isPinned:!0,canDelete:!0,reactions:[{emoji:`👍`,count:2,mine:!0}]}},{id:`evt-3`,kind:`audit`,timestamp:V(1.5),icon:y,tone:`warning`,actor:`Sarah Smitha`,action:`overrode policy`,target:`partial-refund`,description:`Bypassed the 24h refund cap for <span data-ref-id="booking:BKG-2026-0408" data-ref-kind="booking">BKG-2026-0408</span>.`,mentions:[H(`booking`,`BKG-2026-0408`,`BKG-2026-0408`)],metadata:[{label:`Reason`,value:`customer-double-booked`}]},{id:`2`,kind:`comment`,timestamp:V(1),comment:{id:`2`,user:{id:`ivana`,name:`Davida Todorova`},createdAt:V(1),contentType:`html`,content:`Done — refund issued via the original Visa ending 4242 for <span data-ref-id="order:ORD-A219" data-ref-kind="order">ORD-A219</span>. ETA Apr 14 per the gateway.`,references:[H(`order`,`ORD-A219`,`ORD-A219`)],attachments:[{id:`m1`,name:`refund-receipt.pdf`,url:`#`,size:184320,mimeType:`application/pdf`,status:`uploaded`}]}},{id:`evt-4`,kind:`event`,timestamp:V(.5),icon:f,tone:`secondary`,actor:`Notifier`,action:`sent email to`,target:`Daniel Kowalski`,description:`Refund confirmation dispatched. Linked sprint: <span data-ref-id="sprint:SPR-Q2-W3" data-ref-kind="sprint">Sprint Q2-W3</span>.`,mentions:[H(`sprint`,`SPR-Q2-W3`,`Sprint Q2-W3`)]}];function W(){return(0,E.jsx)(E.Fragment,{children:(0,E.jsxs)(r,{type:`secondary`,children:[(0,E.jsx)(`code`,{className:`rounded bg-muted px-1 py-0.5 text-xs`,children:`<EventLog entries={EventLogEntry[]} resources={…} onResourceSearch={…} composer={{…}} renderers={{…}} />`}),`  `,`Each entry's `,(0,E.jsx)(`code`,{className:`rounded bg-muted px-1 py-0.5 text-xs`,children:`kind`}),` selects a renderer — built-in`,` `,(0,E.jsx)(`code`,{className:`rounded bg-muted px-1 py-0.5 text-xs`,children:`'comment'`}),` uses`,` `,(0,E.jsx)(`code`,{className:`rounded bg-muted px-1 py-0.5 text-xs`,children:`<CommentItem>`}),`; everything else (events, audit, system, custom kinds) renders as an icon-rail row with full mention support in the description.`]})})}function G(){let[e,t]=(0,k.useState)(U);return(0,E.jsx)(E.Fragment,{children:(0,E.jsx)(`div`,{className:`w-full max-w-3xl`,children:(0,E.jsx)(M,{entries:e,canModerate:!0,order:`asc`,resources:R,onResourceSearch:z,onCommentDelete:e=>{t(t=>t.filter(t=>!(t.kind===`comment`&&t.id===e)))},onCommentReact:(e,n)=>{t(t=>t.map(t=>{if(t.kind!==`comment`)return t;let r=t;if(r.comment.id!==e)return t;let i=r.comment.reactions??[],a=i.find(e=>e.emoji===n)?i.map(e=>e.emoji===n?{...e,mine:!e.mine,count:e.mine?e.count-1:e.count+1}:e):[...i,{emoji:n,count:1,mine:!0}];return{...r,comment:{...r.comment,reactions:a}}}))},composer:{enabled:!0,position:`top`,context:{id:`BKG-2026-0408`,type:`booking`},placeholder:"Add a note — try `@`, `#`, or `$`…",onSubmit:(e,n)=>{t(t=>[...t,{id:`local-${t.length+1}`,kind:`comment`,timestamp:new Date().toISOString(),comment:{id:`local-${t.length+1}`,user:{id:`me`,name:`You`},createdAt:new Date().toISOString(),contentType:`html`,content:e.content,references:e.references?[...e.references]:[],attachments:e.attachments?[...e.attachments]:[],canDelete:!0}}]),n.reset()}}})})})}function K(){let[e]=(0,k.useState)(U);return(0,E.jsx)(E.Fragment,{children:(0,E.jsx)(`div`,{className:`w-full max-w-3xl`,children:(0,E.jsx)(M,{entries:e.slice(0,4),order:`asc`,resources:R})})})}var q=`import {
-    Bell,
-    CalendarRange,
-    CheckCircle2,
-    CreditCard,
-    GitBranch,
-    Package,
-    ShieldAlert,
-    User,
-} from 'lucide-react';
-import { useState } from 'react';
-import {
-    EventLog,
-    type EventLogEntry,
-} from '@/components/features/event-log';
-import {
-    type CommentFormValues,
-    type CommentSubmitHelpers,
-} from '@/components/features/comments';
-import {
-    type MentionResource,
-    type MentionSuggestion,
-} from '@/components/features/mentions';
-import { Text } from '@/components/typography';
-
-/**
- * EventLog preview — demonstrates the unified \`<EventLog>\` feature.
- * Shows comments + audit events + system messages
- * mixed under one chronological surface, all using the shared
- * \`features/mentions\` registry for inline \`@user\` / \`#booking\` /
- * \`$order\` references.
- */
-
-
-
-
-
-
-
-/* ------------------------------------------------------------------ */
-/*  Resource registry — same shape as the comments demo               */
-/* ------------------------------------------------------------------ */
-
-type ResourceKind = 'user' | 'booking' | 'order' | 'sprint';
-
-const PEOPLE: MentionSuggestion<ResourceKind>[] = [
-    { id: 'maria', label: 'Sarah Smitha', description: 'Head of Operations', kind: 'user' },
-    { id: 'ivana', label: 'Davida Todorova', description: 'Refunds Specialist', kind: 'user' },
-    { id: 'stefan', label: 'Daniel Kowalski', description: 'Customer', kind: 'user' },
-    { id: 'kris', label: 'Kris Dineva', description: 'Engineering', kind: 'user' },
-];
-
-const BOOKINGS: MentionSuggestion<ResourceKind>[] = [
-    { id: 'BKG-2026-0408', label: 'BKG-2026-0408', description: 'Daniel Kowalski · Apr 12 → Apr 14', kind: 'booking' },
-    { id: 'BKG-2026-0421', label: 'BKG-2026-0421', description: 'Sarah Smitha · Apr 19 → Apr 22', kind: 'booking' },
-];
-
-const ORDERS: MentionSuggestion<ResourceKind>[] = [
-    { id: 'ORD-A219', label: 'ORD-A219', description: '€420.00 · Refund pending', kind: 'order' },
-    { id: 'ORD-A284', label: 'ORD-A284', description: '€88.50 · Captured', kind: 'order' },
-];
-
-const SPRINTS: MentionSuggestion<ResourceKind>[] = [
-    { id: 'SPR-Q2-W3', label: 'Sprint Q2-W3', description: 'Refund flows', kind: 'sprint' },
-];
-
-const RESOURCES: Partial<Record<ResourceKind, MentionResource<ResourceKind>>> = {
-    user:    { icon: User,          label: 'Person',  trigger: '@', tone: 'info',      buildHref: (s) => \`/people/\${s.id}\` },
-    booking: { icon: CalendarRange, label: 'Booking', trigger: '#', tone: 'success',   buildHref: (s) => \`/bookings/\${s.id}\` },
-    order:   { icon: Package,       label: 'Order',   trigger: '$', tone: 'warning',   buildHref: (s) => \`/orders/\${s.id}\` },
-    sprint:  { icon: GitBranch,     label: 'Sprint',                tone: 'secondary', buildHref: (s) => \`/sprints/\${s.id}\` },
-};
-
-function onResourceSearch(needle: string, kind: ResourceKind) {
-    const haystack: MentionSuggestion<ResourceKind>[] =
-        kind === 'user' ? PEOPLE
-        : kind === 'booking' ? BOOKINGS
-        : kind === 'order' ? ORDERS
-        : SPRINTS;
-    const q = needle.trim().toLowerCase();
-    return q.length === 0
-        ? haystack
-        : haystack.filter(
-              (item) =>
-                  item.label.toLowerCase().includes(q) ||
-                  (item.description ?? '').toLowerCase().includes(q),
-          );
-}
-
-/* ------------------------------------------------------------------ */
-/*  Mock entries — comments + audit/system/custom events              */
-/* ------------------------------------------------------------------ */
-
-const NOW = Date.now();
-const HOURS = (n: number) => new Date(NOW - n * 60 * 60 * 1000).toISOString();
-
-const REF = (kind: ResourceKind, id: string, label: string) => ({
-    id: \`\${kind}:\${id}\`,
-    kind,
-    label,
-    href: \`/\${kind}s/\${id}\`,
-});
-
-const INITIAL_ENTRIES: EventLogEntry<
-    { id: string; name: string },
-    unknown,
-    ResourceKind
->[] = [
-    {
-        id: 'evt-1',
-        kind: 'event',
-        timestamp: HOURS(48),
-        icon: CheckCircle2,
-        tone: 'success',
-        actor: 'System',
-        action: 'created',
-        target: 'BKG-2026-0408',
-        description:
-            'New booking opened by <span data-ref-id="user:stefan" data-ref-kind="user">@Daniel Kowalski</span>.',
-        mentions: [REF('user', 'stefan', 'Daniel Kowalski')],
-    },
-    {
-        id: 'evt-2',
-        kind: 'system',
-        timestamp: HOURS(36),
-        icon: CreditCard,
-        tone: 'info',
-        actor: 'Payments',
-        action: 'captured',
-        target: '€420.00',
-        description:
-            'Captured for <span data-ref-id="order:ORD-A219" data-ref-kind="order">ORD-A219</span> via Visa •• 4242.',
-        mentions: [REF('order', 'ORD-A219', 'ORD-A219')],
-        metadata: [
-            { label: 'Method', value: 'card' },
-            { label: 'Receipt', value: 'rcpt_8z2' },
-        ],
-    },
-    {
-        id: '1',
-        kind: 'comment',
-        timestamp: HOURS(2),
-        comment: {
-            id: '1',
-            user: { id: 'maria', name: 'Sarah Smitha' },
-            createdAt: HOURS(2),
-            contentType: 'html',
-            content:
-                'Approving the refund for <span data-ref-id="user:stefan" data-ref-kind="user">@Daniel Kowalski</span> on <span data-ref-id="booking:BKG-2026-0408" data-ref-kind="booking">BKG-2026-0408</span> — please process before EOD so the payout window doesn\\'t shift.',
-            references: [
-                REF('user', 'stefan', 'Daniel Kowalski'),
-                REF('booking', 'BKG-2026-0408', 'BKG-2026-0408'),
-            ],
-            isPinned: true,
-            canDelete: true,
-            reactions: [{ emoji: '👍', count: 2, mine: true }],
-        },
-    },
-    {
-        id: 'evt-3',
-        kind: 'audit',
-        timestamp: HOURS(1.5),
-        icon: ShieldAlert,
-        tone: 'warning',
-        actor: 'Sarah Smitha',
-        action: 'overrode policy',
-        target: 'partial-refund',
-        description:
-            'Bypassed the 24h refund cap for <span data-ref-id="booking:BKG-2026-0408" data-ref-kind="booking">BKG-2026-0408</span>.',
-        mentions: [REF('booking', 'BKG-2026-0408', 'BKG-2026-0408')],
-        metadata: [{ label: 'Reason', value: 'customer-double-booked' }],
-    },
-    {
-        id: '2',
-        kind: 'comment',
-        timestamp: HOURS(1),
-        comment: {
-            id: '2',
-            user: { id: 'ivana', name: 'Davida Todorova' },
-            createdAt: HOURS(1),
-            contentType: 'html',
-            content:
-                'Done — refund issued via the original Visa ending 4242 for <span data-ref-id="order:ORD-A219" data-ref-kind="order">ORD-A219</span>. ETA Apr 14 per the gateway.',
-            references: [REF('order', 'ORD-A219', 'ORD-A219')],
-            attachments: [
-                {
-                    id: 'm1',
-                    name: 'refund-receipt.pdf',
-                    url: '#',
-                    size: 184_320,
-                    mimeType: 'application/pdf',
-                    status: 'uploaded',
-                },
-            ],
-        },
-    },
-    {
-        id: 'evt-4',
-        kind: 'event',
-        timestamp: HOURS(0.5),
-        icon: Bell,
-        tone: 'secondary',
-        actor: 'Notifier',
-        action: 'sent email to',
-        target: 'Daniel Kowalski',
-        description:
-            'Refund confirmation dispatched. Linked sprint: <span data-ref-id="sprint:SPR-Q2-W3" data-ref-kind="sprint">Sprint Q2-W3</span>.',
-        mentions: [REF('sprint', 'SPR-Q2-W3', 'Sprint Q2-W3')],
-    },
-];
-
-/* ------------------------------------------------------------------ */
-/*  Page                                                                */
-/* ------------------------------------------------------------------ */
-
-export function APISurface() {
-	return (
-		<>
-			<Text type="secondary">
-			                    <code className="rounded bg-muted px-1 py-0.5 text-xs">
-			                        {'<EventLog entries={EventLogEntry[]} resources={…} onResourceSearch={…} composer={{…}} renderers={{…}} />'}
-			                    </code>
-			                    {'  '}
-			                    Each entry's <code className="rounded bg-muted px-1 py-0.5 text-xs">kind</code> selects a renderer — built-in
-			                    {' '}<code className="rounded bg-muted px-1 py-0.5 text-xs">'comment'</code> uses{' '}
-			                    <code className="rounded bg-muted px-1 py-0.5 text-xs">{'<CommentItem>'}</code>; everything else (events,
-			                    audit, system, custom kinds) renders as an icon-rail row with full mention support in the description.
-			                </Text>
-		</>
-	);
-}
-
-export function CommentsEventsUnderOneLog() {
-	const [entries, setEntries] = useState<typeof INITIAL_ENTRIES>(INITIAL_ENTRIES);
-	const handleCommentSubmit = (
-	        values: CommentFormValues<ResourceKind>,
-	        helpers: CommentSubmitHelpers,
-	    ) => {
-	        setEntries((prev) => [
-	            ...prev,
-	            {
-	                id: \`local-\${prev.length + 1}\`,
-	                kind: 'comment',
-	                timestamp: new Date().toISOString(),
-	                comment: {
-	                    id: \`local-\${prev.length + 1}\`,
-	                    user: { id: 'me', name: 'You' },
-	                    createdAt: new Date().toISOString(),
-	                    contentType: 'html',
-	                    content: values.content,
-	                    references: values.references ? [...values.references] : [],
-	                    attachments: values.attachments ? [...values.attachments] : [],
-	                    canDelete: true,
-	                },
-	            },
-	        ]);
-	        helpers.reset();
-	    };
-	const handleCommentDelete = (id: string) => {
-	        setEntries((prev) =>
-	            prev.filter(
-	                (e) => !(e.kind === 'comment' && (e as { id: string }).id === id),
-	            ),
-	        );
-	    };
-	const handleCommentReact = (commentId: string, emoji: string) => {
-	        setEntries((prev) =>
-	            prev.map((e) => {
-	                if (e.kind !== 'comment') return e;
-	                const ce = e as Extract<typeof INITIAL_ENTRIES[number], { kind: 'comment' }>;
-	                if (ce.comment.id !== commentId) return e;
-	                const reactions = ce.comment.reactions ?? [];
-	                const existing = reactions.find((r) => r.emoji === emoji);
-	                const nextReactions = existing
-	                    ? reactions.map((r) =>
-	                          r.emoji === emoji
-	                              ? {
-	                                    ...r,
-	                                    mine: !r.mine,
-	                                    count: r.mine ? r.count - 1 : r.count + 1,
-	                                }
-	                              : r,
-	                      )
-	                    : [...reactions, { emoji, count: 1, mine: true }];
-	                return {
-	                    ...ce,
-	                    comment: { ...ce.comment, reactions: nextReactions },
-	                };
-	            }),
-	        );
-	    };
-	return (
-		<>
-			<div className="w-full max-w-3xl">
-				<EventLog
-			                    entries={entries}
-			                    canModerate
-			                    order="asc"
-			                    resources={RESOURCES}
-			                    onResourceSearch={onResourceSearch}
-			                    onCommentDelete={handleCommentDelete}
-			                    onCommentReact={handleCommentReact}
-			                    composer={{
-			                        enabled: true,
-			                        position: 'top',
-			                        context: { id: 'BKG-2026-0408', type: 'booking' },
-			                        placeholder: 'Add a note — try \`@\`, \`#\`, or \`$\`…',
-			                        onSubmit: handleCommentSubmit,
-			                    }}
-			                />
-			</div>
-		</>
-	);
-}
-
-export function ReadOnlyTimelineNoComposer() {
-	const [entries] = useState<typeof INITIAL_ENTRIES>(INITIAL_ENTRIES);
-	return (
-		<>
-			<div className="w-full max-w-3xl">
-				<EventLog
-			                    entries={entries.slice(0, 4)}
-			                    order="asc"
-			                    resources={RESOURCES}
-			                />
-			</div>
-		</>
-	);
-}
-`;function J(e){let t={h4:`h4`,...e.components};return N||X(`Examples`,!1),W||X(`Examples.APISurface`,!0),G||X(`Examples.CommentsEventsUnderOneLog`,!0),K||X(`Examples.ReadOnlyTimelineNoComposer`,!0),(0,E.jsxs)(o,{title:`Features · Event log`,description:"Unified, mentions-aware mixed-source log: comments + audit events + system messages + custom kinds under one chronological surface. Inline `@user` / `#booking` / `$order` triggers work in the composer; resource chips render with tone-driven Badge variants in every entry kind.",layer:`features`,status:`ready`,children:[(0,E.jsxs)(s,{title:`Examples`,id:`examples`,children:[(0,E.jsx)(c,{name:`APISurface`,source:q,children:(0,E.jsx)(W,{})}),(0,E.jsx)(c,{name:`CommentsEventsUnderOneLog`,source:q,children:(0,E.jsx)(G,{})}),(0,E.jsx)(c,{name:`ReadOnlyTimelineNoComposer`,source:q,children:(0,E.jsx)(K,{})})]}),(0,E.jsxs)(s,{title:`API`,id:`api`,children:[(0,E.jsx)(t.h4,{children:`EventLog`}),(0,E.jsx)(C,{component:`EventLog`})]})]})}function Y(e={}){let{wrapper:t}=e.components||{};return t?(0,E.jsx)(t,{...e,children:(0,E.jsx)(J,{...e})}):J(e)}function X(e,t){throw Error(`Expected `+(t?`component`:`object`)+" `"+e+"` to be defined: you likely forgot to import, pass, or provide it.")}export{Y as default};