@fgv/ts-app-shell 5.1.0-31 → 5.1.0-32

package/dist/packlets/messages/MessagesContext.js

@@ -33,8 +33,8 @@ export function MessagesProvider(props) {
     const { maxMessages = 200, children } = props;
     const [messages, setMessages] = useState([]);
     const [dismissedIds, setDismissedIds] = useState(new Set());
-    const addMessage = useCallback((severity, text, action) => {
-        const msg = createMessage(severity, text, action);
+    const addMessage = useCallback((level, text, options) => {
+        const msg = createMessage(level, text, options);
         setMessages((prev) => {
             const next = [...prev, msg];
             return next.length > maxMessages ? next.slice(next.length - maxMessages) : next;

package/dist/packlets/messages/MessagesContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"MessagesContext.js","sourceRoot":"","sources":["../../../src/packlets/messages/MessagesContext.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;GAoBG;AAEH,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,UAAU,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE1E,OAAO,EAAE,aAAa,EAA6C,MAAM,SAAS,CAAC;AAuBnF,+EAA+E;AAC/E,UAAU;AACV,+EAA+E;AAE/E,MAAM,eAAe,GAAqD,KAAK,CAAC,aAAa,CAE3F,SAAS,CAAC,CAAC;AAiBb;;;GAGG;AACH,MAAM,UAAU,gBAAgB,CAAC,KAA6B;IAC5D,MAAM,EAAE,WAAW,GAAG,GAAG,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC;IAC9C,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAa,EAAE,CAAC,CAAC;IACzD,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAc,IAAI,GAAG,EAAE,CAAC,CAAC;IAEzE,MAAM,UAAU,GAAG,WAAW,CAC5B,CAAC,QAAyB,EAAE,IAAY,EAAE,MAAuB,EAAY,EAAE;QAC7E,MAAM,GAAG,GAAG,aAAa,CAAC,QAAQ,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC;QAClD,WAAW,CAAC,CAAC,IAAI,EAAE,EAAE;YACnB,MAAM,IAAI,GAAG,CAAC,GAAG,IAAI,EAAE,GAAG,CAAC,CAAC;YAC5B,OAAO,IAAI,CAAC,MAAM,GAAG,WAAW,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,GAAG,WAAW,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;QAClF,CAAC,CAAC,CAAC;QACH,OAAO,GAAG,CAAC;IACb,CAAC,EACD,CAAC,WAAW,CAAC,CACd,CAAC;IAEF,MAAM,cAAc,GAAG,WAAW,CAAC,CAAC,EAAU,EAAQ,EAAE;QACtD,eAAe,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC;IACnD,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,aAAa,GAAG,WAAW,CAAC,GAAS,EAAE;QAC3C,WAAW,CAAC,EAAE,CAAC,CAAC;QAChB,eAAe,CAAC,IAAI,GAAG,EAAE,CAAC,CAAC;IAC7B,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,YAAY,GAAG,OAAO,CAC1B,GAAG,EAAE,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,YAAY,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,EACrD,CAAC,QAAQ,EAAE,YAAY,CAAC,CACzB,CAAC;IAEF,MAAM,KAAK,GAAG,OAAO,CACnB,GAAG,EAAE,CAAC,CAAC;QACL,QAAQ;QACR,UAAU;QACV,cAAc;QACd,aAAa;QACb,YAAY;KACb,CAAC,EACF,CAAC,QAAQ,EAAE,UAAU,EAAE,cAAc,EAAE,aAAa,EAAE,YAAY,CAAC,CACpE,CAAC;IAEF,OAAO,oBAAC,eAAe,CAAC,QAAQ,IAAC,KAAK,EAAE,KAAK,IAAG,QAAQ,CAA4B,CAAC;AACvF,CAAC;AAED,+EAA+E;AAC/E,OAAO;AACP,+EAA+E;AAE/E;;;;GAIG;AACH,MAAM,UAAU,WAAW;IACzB,MAAM,GAAG,GAAG,UAAU,CAAC,eAAe,CAAC,CAAC;IACxC,IAAI,GAAG,KAAK,SAAS,EAAE,CAAC;QACtB,MAAM,IAAI,KAAK,CAAC,oDAAoD,CAAC,CAAC;IACxE,CAAC;IACD,OAAO,GAAG,CAAC;AACb,CAAC","sourcesContent":["/*\n * Copyright (c) 2026 Erik Fortune\n *\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n *\n * The above copyright notice and this permission notice shall be included in all\n * copies or substantial portions of the Software.\n *\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\n * SOFTWARE.\n */\n\nimport React, { useCallback, useContext, useMemo, useState } from 'react';\n\nimport { createMessage, IMessage, IMessageAction, MessageSeverity } from './model';\n\n// ============================================================================\n// Context Value\n// ============================================================================\n\n/**\n * Value provided by the MessagesContext.\n * @public\n */\nexport interface IMessagesContextValue {\n  /** All messages in the stream (newest last) */\n  readonly messages: ReadonlyArray<IMessage>;\n  /** Add a message to the stream */\n  readonly addMessage: (severity: MessageSeverity, text: string, action?: IMessageAction) => IMessage;\n  /** Dismiss a specific message (removes from toast display, keeps in log) */\n  readonly dismissMessage: (id: string) => void;\n  /** Clear all messages */\n  readonly clearMessages: () => void;\n  /** Messages currently visible as toasts (not yet dismissed) */\n  readonly activeToasts: ReadonlyArray<IMessage>;\n}\n\n// ============================================================================\n// Context\n// ============================================================================\n\nconst MessagesContext: React.Context<IMessagesContextValue | undefined> = React.createContext<\n  IMessagesContextValue | undefined\n>(undefined);\n\n// ============================================================================\n// Provider\n// ============================================================================\n\n/**\n * Props for the MessagesProvider.\n * @public\n */\nexport interface IMessagesProviderProps {\n  /** Maximum number of messages to retain in the log */\n  readonly maxMessages?: number;\n  /** Children */\n  readonly children: React.ReactNode;\n}\n\n/**\n * Provides the global message stream to the component tree.\n * @public\n */\nexport function MessagesProvider(props: IMessagesProviderProps): React.ReactElement {\n  const { maxMessages = 200, children } = props;\n  const [messages, setMessages] = useState<IMessage[]>([]);\n  const [dismissedIds, setDismissedIds] = useState<Set<string>>(new Set());\n\n  const addMessage = useCallback(\n    (severity: MessageSeverity, text: string, action?: IMessageAction): IMessage => {\n      const msg = createMessage(severity, text, action);\n      setMessages((prev) => {\n        const next = [...prev, msg];\n        return next.length > maxMessages ? next.slice(next.length - maxMessages) : next;\n      });\n      return msg;\n    },\n    [maxMessages]\n  );\n\n  const dismissMessage = useCallback((id: string): void => {\n    setDismissedIds((prev) => new Set(prev).add(id));\n  }, []);\n\n  const clearMessages = useCallback((): void => {\n    setMessages([]);\n    setDismissedIds(new Set());\n  }, []);\n\n  const activeToasts = useMemo(\n    () => messages.filter((m) => !dismissedIds.has(m.id)),\n    [messages, dismissedIds]\n  );\n\n  const value = useMemo<IMessagesContextValue>(\n    () => ({\n      messages,\n      addMessage,\n      dismissMessage,\n      clearMessages,\n      activeToasts\n    }),\n    [messages, addMessage, dismissMessage, clearMessages, activeToasts]\n  );\n\n  return <MessagesContext.Provider value={value}>{children}</MessagesContext.Provider>;\n}\n\n// ============================================================================\n// Hook\n// ============================================================================\n\n/**\n * Hook to access the messages context.\n * Must be used within a MessagesProvider.\n * @public\n */\nexport function useMessages(): IMessagesContextValue {\n  const ctx = useContext(MessagesContext);\n  if (ctx === undefined) {\n    throw new Error('useMessages must be used within a MessagesProvider');\n  }\n  return ctx;\n}\n"]}
+{"version":3,"file":"MessagesContext.js","sourceRoot":"","sources":["../../../src/packlets/messages/MessagesContext.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;GAoBG;AAEH,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,UAAU,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAI1E,OAAO,EAAE,aAAa,EAAmC,MAAM,SAAS,CAAC;AA0BzE,+EAA+E;AAC/E,UAAU;AACV,+EAA+E;AAE/E,MAAM,eAAe,GAAqD,KAAK,CAAC,aAAa,CAE3F,SAAS,CAAC,CAAC;AAiBb;;;GAGG;AACH,MAAM,UAAU,gBAAgB,CAAC,KAA6B;IAC5D,MAAM,EAAE,WAAW,GAAG,GAAG,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC;IAC9C,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAa,EAAE,CAAC,CAAC;IACzD,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAc,IAAI,GAAG,EAAE,CAAC,CAAC;IAEzE,MAAM,UAAU,GAAG,WAAW,CAC5B,CAAC,KAAsB,EAAE,IAAY,EAAE,OAA+B,EAAY,EAAE;QAClF,MAAM,GAAG,GAAG,aAAa,CAAC,KAAK,EAAE,IAAI,EAAE,OAAO,CAAC,CAAC;QAChD,WAAW,CAAC,CAAC,IAAI,EAAE,EAAE;YACnB,MAAM,IAAI,GAAG,CAAC,GAAG,IAAI,EAAE,GAAG,CAAC,CAAC;YAC5B,OAAO,IAAI,CAAC,MAAM,GAAG,WAAW,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,GAAG,WAAW,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;QAClF,CAAC,CAAC,CAAC;QACH,OAAO,GAAG,CAAC;IACb,CAAC,EACD,CAAC,WAAW,CAAC,CACd,CAAC;IAEF,MAAM,cAAc,GAAG,WAAW,CAAC,CAAC,EAAU,EAAQ,EAAE;QACtD,eAAe,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,CAAC;IACnD,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,aAAa,GAAG,WAAW,CAAC,GAAS,EAAE;QAC3C,WAAW,CAAC,EAAE,CAAC,CAAC;QAChB,eAAe,CAAC,IAAI,GAAG,EAAE,CAAC,CAAC;IAC7B,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,YAAY,GAAG,OAAO,CAC1B,GAAG,EAAE,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,YAAY,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,EACrD,CAAC,QAAQ,EAAE,YAAY,CAAC,CACzB,CAAC;IAEF,MAAM,KAAK,GAAG,OAAO,CACnB,GAAG,EAAE,CAAC,CAAC;QACL,QAAQ;QACR,UAAU;QACV,cAAc;QACd,aAAa;QACb,YAAY;KACb,CAAC,EACF,CAAC,QAAQ,EAAE,UAAU,EAAE,cAAc,EAAE,aAAa,EAAE,YAAY,CAAC,CACpE,CAAC;IAEF,OAAO,oBAAC,eAAe,CAAC,QAAQ,IAAC,KAAK,EAAE,KAAK,IAAG,QAAQ,CAA4B,CAAC;AACvF,CAAC;AAED,+EAA+E;AAC/E,OAAO;AACP,+EAA+E;AAE/E;;;;GAIG;AACH,MAAM,UAAU,WAAW;IACzB,MAAM,GAAG,GAAG,UAAU,CAAC,eAAe,CAAC,CAAC;IACxC,IAAI,GAAG,KAAK,SAAS,EAAE,CAAC;QACtB,MAAM,IAAI,KAAK,CAAC,oDAAoD,CAAC,CAAC;IACxE,CAAC;IACD,OAAO,GAAG,CAAC;AACb,CAAC","sourcesContent":["/*\n * Copyright (c) 2026 Erik Fortune\n *\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n *\n * The above copyright notice and this permission notice shall be included in all\n * copies or substantial portions of the Software.\n *\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\n * SOFTWARE.\n */\n\nimport React, { useCallback, useContext, useMemo, useState } from 'react';\n\nimport { type MessageLogLevel } from '@fgv/ts-utils';\n\nimport { createMessage, ICreateMessageOptions, IMessage } from './model';\n\n// ============================================================================\n// Context Value\n// ============================================================================\n\n/**\n * Value provided by the MessagesContext.\n * @public\n */\nexport interface IMessagesContextValue {\n  /** All messages in the stream (newest last) */\n  readonly messages: ReadonlyArray<IMessage>;\n  /**\n   * Add a message to the stream. The `level` drives filtering; pass `options.severity`\n   * only to override display styling (e.g. `'success'`).\n   */\n  readonly addMessage: (level: MessageLogLevel, text: string, options?: ICreateMessageOptions) => IMessage;\n  /** Dismiss a specific message (removes from toast display, keeps in log) */\n  readonly dismissMessage: (id: string) => void;\n  /** Clear all messages */\n  readonly clearMessages: () => void;\n  /** Messages currently visible as toasts (not yet dismissed) */\n  readonly activeToasts: ReadonlyArray<IMessage>;\n}\n\n// ============================================================================\n// Context\n// ============================================================================\n\nconst MessagesContext: React.Context<IMessagesContextValue | undefined> = React.createContext<\n  IMessagesContextValue | undefined\n>(undefined);\n\n// ============================================================================\n// Provider\n// ============================================================================\n\n/**\n * Props for the MessagesProvider.\n * @public\n */\nexport interface IMessagesProviderProps {\n  /** Maximum number of messages to retain in the log */\n  readonly maxMessages?: number;\n  /** Children */\n  readonly children: React.ReactNode;\n}\n\n/**\n * Provides the global message stream to the component tree.\n * @public\n */\nexport function MessagesProvider(props: IMessagesProviderProps): React.ReactElement {\n  const { maxMessages = 200, children } = props;\n  const [messages, setMessages] = useState<IMessage[]>([]);\n  const [dismissedIds, setDismissedIds] = useState<Set<string>>(new Set());\n\n  const addMessage = useCallback(\n    (level: MessageLogLevel, text: string, options?: ICreateMessageOptions): IMessage => {\n      const msg = createMessage(level, text, options);\n      setMessages((prev) => {\n        const next = [...prev, msg];\n        return next.length > maxMessages ? next.slice(next.length - maxMessages) : next;\n      });\n      return msg;\n    },\n    [maxMessages]\n  );\n\n  const dismissMessage = useCallback((id: string): void => {\n    setDismissedIds((prev) => new Set(prev).add(id));\n  }, []);\n\n  const clearMessages = useCallback((): void => {\n    setMessages([]);\n    setDismissedIds(new Set());\n  }, []);\n\n  const activeToasts = useMemo(\n    () => messages.filter((m) => !dismissedIds.has(m.id)),\n    [messages, dismissedIds]\n  );\n\n  const value = useMemo<IMessagesContextValue>(\n    () => ({\n      messages,\n      addMessage,\n      dismissMessage,\n      clearMessages,\n      activeToasts\n    }),\n    [messages, addMessage, dismissMessage, clearMessages, activeToasts]\n  );\n\n  return <MessagesContext.Provider value={value}>{children}</MessagesContext.Provider>;\n}\n\n// ============================================================================\n// Hook\n// ============================================================================\n\n/**\n * Hook to access the messages context.\n * Must be used within a MessagesProvider.\n * @public\n */\nexport function useMessages(): IMessagesContextValue {\n  const ctx = useContext(MessagesContext);\n  if (ctx === undefined) {\n    throw new Error('useMessages must be used within a MessagesProvider');\n  }\n  return ctx;\n}\n"]}

package/dist/packlets/messages/MessagesLogger.js

@@ -29,28 +29,6 @@
  */
 import { Logging, succeed } from '@fgv/ts-utils';
 // ============================================================================
-// Level Mapping
-// ============================================================================
-/**
- * Maps ts-utils MessageLogLevel to our MessageSeverity.
- * `detail` maps to `'info'` (shown when logLevel is 'detail' or 'all').
- * `quiet` is always suppressed (only shown when reporter level is 'all', handled upstream).
- * @internal
- */
-function mapLogLevel(level) {
-    switch (level) {
-        case 'detail':
-        case 'info':
-            return 'info';
-        case 'warning':
-            return 'warning';
-        case 'error':
-            return 'error';
-        case 'quiet':
-            return undefined;
-    }
-}
-// ============================================================================
 // MessagesLogger
 // ============================================================================
 /**
@@ -85,19 +63,20 @@ export class MessagesLogger extends Logging.LoggerBase {
         this._defaultAction = defaultAction;
     }
     /**
-     * Routes a formatted log message into the MessagesContext.
+     * Routes a formatted log message into the MessagesContext, setting the message `level`
+     * straight through from the log call (lossless). Display styling `severity` is left
+     * undefined so it is derived from the level for display.
+     *
+     * Suppression by threshold is handled upstream by {@link @fgv/ts-utils#Logging.LoggerBase | LoggerBase}
+     * (`shouldLog` against `logLevel`) before this method is invoked.
      * @param message - The formatted message string
-     * @param level - The log level
-     * @returns Success with the message if it was logged, or Success with undefined if suppressed
+     * @param level - The {@link @fgv/ts-utils#MessageLogLevel | log level}
+     * @returns Success with the message that was logged
      * @internal
      */
     _log(message, level) {
-        const severity = mapLogLevel(level);
-        if (severity !== undefined) {
-            this._addMessage(severity, message, this._defaultAction);
-            return succeed(message);
-        }
-        return succeed(undefined);
+        this._addMessage(level, message, { action: this._defaultAction });
+        return succeed(message);
     }
 }
 //# sourceMappingURL=MessagesLogger.js.map

package/dist/packlets/messages/MessagesLogger.js.map

@@ -1 +1 @@
-{"version":3,"file":"MessagesLogger.js","sourceRoot":"","sources":["../../../src/packlets/messages/MessagesLogger.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;GAoBG;AAEH;;;;;;;GAOG;AAEH,OAAO,EAAE,OAAO,EAAiC,OAAO,EAAE,MAAM,eAAe,CAAC;AAKhF,+EAA+E;AAC/E,gBAAgB;AAChB,+EAA+E;AAE/E;;;;;GAKG;AACH,SAAS,WAAW,CAAC,KAAsB;IACzC,QAAQ,KAAK,EAAE,CAAC;QACd,KAAK,QAAQ,CAAC;QACd,KAAK,MAAM;YACT,OAAO,MAAM,CAAC;QAChB,KAAK,SAAS;YACZ,OAAO,SAAS,CAAC;QACnB,KAAK,OAAO;YACV,OAAO,OAAO,CAAC;QACjB,KAAK,OAAO;YACV,OAAO,SAAS,CAAC;IACrB,CAAC;AACH,CAAC;AAED,+EAA+E;AAC/E,iBAAiB;AACjB,+EAA+E;AAE/E;;;;;;;;;;;;;;;;;;GAkBG;AACH,MAAM,OAAO,cAAe,SAAQ,OAAO,CAAC,UAAU;IAIpD;;;;;OAKG;IACH,YACE,UAA+C,EAC/C,QAAmC,EACnC,aAA8B;QAE9B,KAAK,CAAC,QAAQ,CAAC,CAAC;QAChB,IAAI,CAAC,WAAW,GAAG,UAAU,CAAC;QAC9B,IAAI,CAAC,cAAc,GAAG,aAAa,CAAC;IACtC,CAAC;IAED;;;;;;OAMG;IACO,IAAI,CAAC,OAAe,EAAE,KAAsB;QACpD,MAAM,QAAQ,GAAG,WAAW,CAAC,KAAK,CAAC,CAAC;QACpC,IAAI,QAAQ,KAAK,SAAS,EAAE,CAAC;YAC3B,IAAI,CAAC,WAAW,CAAC,QAAQ,EAAE,OAAO,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC;YACzD,OAAO,OAAO,CAAC,OAAO,CAAC,CAAC;QAC1B,CAAC;QACD,OAAO,OAAO,CAAC,SAAS,CAAC,CAAC;IAC5B,CAAC;CACF","sourcesContent":["/*\n * Copyright (c) 2026 Erik Fortune\n *\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n *\n * The above copyright notice and this permission notice shall be included in all\n * copies or substantial portions of the Software.\n *\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\n * SOFTWARE.\n */\n\n/**\n * Bridge between the MessagesContext and the ts-utils ILogger/LogReporter system.\n *\n * Provides an ILogger implementation that routes log messages into the\n * MessagesContext, enabling Result.report() integration in React components.\n *\n * @packageDocumentation\n */\n\nimport { Logging, type MessageLogLevel, Success, succeed } from '@fgv/ts-utils';\n\nimport { type IMessageAction, type MessageSeverity } from './model';\nimport { type IMessagesContextValue } from './MessagesContext';\n\n// ============================================================================\n// Level Mapping\n// ============================================================================\n\n/**\n * Maps ts-utils MessageLogLevel to our MessageSeverity.\n * `detail` maps to `'info'` (shown when logLevel is 'detail' or 'all').\n * `quiet` is always suppressed (only shown when reporter level is 'all', handled upstream).\n * @internal\n */\nfunction mapLogLevel(level: MessageLogLevel): MessageSeverity | undefined {\n  switch (level) {\n    case 'detail':\n    case 'info':\n      return 'info';\n    case 'warning':\n      return 'warning';\n    case 'error':\n      return 'error';\n    case 'quiet':\n      return undefined;\n  }\n}\n\n// ============================================================================\n// MessagesLogger\n// ============================================================================\n\n/**\n * An {@link @fgv/ts-utils#Logging.ILogger | ILogger} implementation that routes\n * messages into a {@link IMessagesContextValue | MessagesContext}.\n *\n * Use this as the `logger` parameter when creating a `LogReporter` to get\n * full `Result.report()` integration that feeds into the app's toast/log system.\n *\n * @example\n * ```typescript\n * const { addMessage } = useMessages();\n * const logger = new MessagesLogger(addMessage);\n * const reporter = new LogReporter<unknown>({ logger });\n *\n * // Now Result.report() flows into toasts + log panel\n * someResult.report(reporter, { success: 'info', failure: 'error' });\n * ```\n *\n * @public\n */\nexport class MessagesLogger extends Logging.LoggerBase {\n  private readonly _addMessage: IMessagesContextValue['addMessage'];\n  private readonly _defaultAction: IMessageAction | undefined;\n\n  /**\n   * Creates a new MessagesLogger.\n   * @param addMessage - The addMessage function from MessagesContext\n   * @param logLevel - The minimum log level to display (default: 'info')\n   * @param defaultAction - Optional default action to attach to all messages\n   */\n  public constructor(\n    addMessage: IMessagesContextValue['addMessage'],\n    logLevel?: Logging.ReporterLogLevel,\n    defaultAction?: IMessageAction\n  ) {\n    super(logLevel);\n    this._addMessage = addMessage;\n    this._defaultAction = defaultAction;\n  }\n\n  /**\n   * Routes a formatted log message into the MessagesContext.\n   * @param message - The formatted message string\n   * @param level - The log level\n   * @returns Success with the message if it was logged, or Success with undefined if suppressed\n   * @internal\n   */\n  protected _log(message: string, level: MessageLogLevel): Success<string | undefined> {\n    const severity = mapLogLevel(level);\n    if (severity !== undefined) {\n      this._addMessage(severity, message, this._defaultAction);\n      return succeed(message);\n    }\n    return succeed(undefined);\n  }\n}\n"]}
+{"version":3,"file":"MessagesLogger.js","sourceRoot":"","sources":["../../../src/packlets/messages/MessagesLogger.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;GAoBG;AAEH;;;;;;;GAOG;AAEH,OAAO,EAAE,OAAO,EAAiC,OAAO,EAAE,MAAM,eAAe,CAAC;AAKhF,+EAA+E;AAC/E,iBAAiB;AACjB,+EAA+E;AAE/E;;;;;;;;;;;;;;;;;;GAkBG;AACH,MAAM,OAAO,cAAe,SAAQ,OAAO,CAAC,UAAU;IAIpD;;;;;OAKG;IACH,YACE,UAA+C,EAC/C,QAAmC,EACnC,aAA8B;QAE9B,KAAK,CAAC,QAAQ,CAAC,CAAC;QAChB,IAAI,CAAC,WAAW,GAAG,UAAU,CAAC;QAC9B,IAAI,CAAC,cAAc,GAAG,aAAa,CAAC;IACtC,CAAC;IAED;;;;;;;;;;;OAWG;IACO,IAAI,CAAC,OAAe,EAAE,KAAsB;QACpD,IAAI,CAAC,WAAW,CAAC,KAAK,EAAE,OAAO,EAAE,EAAE,MAAM,EAAE,IAAI,CAAC,cAAc,EAAE,CAAC,CAAC;QAClE,OAAO,OAAO,CAAC,OAAO,CAAC,CAAC;IAC1B,CAAC;CACF","sourcesContent":["/*\n * Copyright (c) 2026 Erik Fortune\n *\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n *\n * The above copyright notice and this permission notice shall be included in all\n * copies or substantial portions of the Software.\n *\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\n * SOFTWARE.\n */\n\n/**\n * Bridge between the MessagesContext and the ts-utils ILogger/LogReporter system.\n *\n * Provides an ILogger implementation that routes log messages into the\n * MessagesContext, enabling Result.report() integration in React components.\n *\n * @packageDocumentation\n */\n\nimport { Logging, type MessageLogLevel, Success, succeed } from '@fgv/ts-utils';\n\nimport { type IMessageAction } from './model';\nimport { type IMessagesContextValue } from './MessagesContext';\n\n// ============================================================================\n// MessagesLogger\n// ============================================================================\n\n/**\n * An {@link @fgv/ts-utils#Logging.ILogger | ILogger} implementation that routes\n * messages into a {@link IMessagesContextValue | MessagesContext}.\n *\n * Use this as the `logger` parameter when creating a `LogReporter` to get\n * full `Result.report()` integration that feeds into the app's toast/log system.\n *\n * @example\n * ```typescript\n * const { addMessage } = useMessages();\n * const logger = new MessagesLogger(addMessage);\n * const reporter = new LogReporter<unknown>({ logger });\n *\n * // Now Result.report() flows into toasts + log panel\n * someResult.report(reporter, { success: 'info', failure: 'error' });\n * ```\n *\n * @public\n */\nexport class MessagesLogger extends Logging.LoggerBase {\n  private readonly _addMessage: IMessagesContextValue['addMessage'];\n  private readonly _defaultAction: IMessageAction | undefined;\n\n  /**\n   * Creates a new MessagesLogger.\n   * @param addMessage - The addMessage function from MessagesContext\n   * @param logLevel - The minimum log level to display (default: 'info')\n   * @param defaultAction - Optional default action to attach to all messages\n   */\n  public constructor(\n    addMessage: IMessagesContextValue['addMessage'],\n    logLevel?: Logging.ReporterLogLevel,\n    defaultAction?: IMessageAction\n  ) {\n    super(logLevel);\n    this._addMessage = addMessage;\n    this._defaultAction = defaultAction;\n  }\n\n  /**\n   * Routes a formatted log message into the MessagesContext, setting the message `level`\n   * straight through from the log call (lossless). Display styling `severity` is left\n   * undefined so it is derived from the level for display.\n   *\n   * Suppression by threshold is handled upstream by {@link @fgv/ts-utils#Logging.LoggerBase | LoggerBase}\n   * (`shouldLog` against `logLevel`) before this method is invoked.\n   * @param message - The formatted message string\n   * @param level - The {@link @fgv/ts-utils#MessageLogLevel | log level}\n   * @returns Success with the message that was logged\n   * @internal\n   */\n  protected _log(message: string, level: MessageLogLevel): Success<string | undefined> {\n    this._addMessage(level, message, { action: this._defaultAction });\n    return succeed(message);\n  }\n}\n"]}

package/dist/packlets/messages/StatusBar.js

@@ -21,8 +21,9 @@
  */
 import React, { useCallback, useMemo, useState } from 'react';
 import { Logging } from '@fgv/ts-utils';
-import { FunnelIcon, DocumentDuplicateIcon, MagnifyingGlassIcon } from '@heroicons/react/24/outline';
+import { FunnelIcon, DocumentDuplicateIcon, MagnifyingGlassIcon, XMarkIcon } from '@heroicons/react/24/outline';
 import { CheckIcon } from '@heroicons/react/24/solid';
+import { deriveSeverityFromLevel } from './model';
 import { useResponsive } from '../responsive';
 // ============================================================================
 // Severity display config
@@ -49,17 +50,25 @@ const LOG_ROW_COLORS = {
 // Level filter config
 // ============================================================================
 /**
- * Maps MessageSeverity to MessageLogLevel for shouldLog filtering.
- * 'success' is treated as 'info' since it doesn't exist in the log level hierarchy.
+ * Effective display severity for a message: its explicit `severity` styling override,
+ * or the severity derived from its canonical log level.
  */
-function severityToLogLevel(severity) {
-    return severity === 'success' ? 'info' : severity;
+function effectiveSeverity(message) {
+    var _a;
+    return (_a = message.severity) !== null && _a !== void 0 ? _a : deriveSeverityFromLevel(message.level);
 }
 /**
  * Filter choices exposed in the UI, mapping labels to ReporterLogLevel values.
+ *
+ * The full log-level granularity is exposed (the core gap fix): `Detail+` lets the panel
+ * filter at the same granularity a ts-utils logger records, including `detail` messages
+ * that the previous severity-based filter could not represent. `All` additionally surfaces
+ * `quiet`-level messages (per {@link @fgv/ts-utils#Logging.shouldLog | shouldLog} semantics,
+ * `quiet` is only visible under the `all` threshold).
  */
 const FILTER_LEVELS = [
     { label: 'All', level: 'all' },
+    { label: 'Detail+', level: 'detail' },
     { label: 'Info+', level: 'info' },
     { label: 'Warn+', level: 'warning' },
     { label: 'Error', level: 'error' }
@@ -68,14 +77,15 @@ const FILTER_LEVELS = [
  * Collapsible status bar / log panel at the bottom of the application.
  *
  * Collapsed: shows severity counts.
- * Expanded: filterable, searchable, copyable log of all messages.
+ * Expanded: filterable, searchable, copyable log of all messages, bounded to
+ * {@link IStatusBarProps.maxExpandedHeight} with the list scrolling within the bound.
  * @public
  */
 export function StatusBar(props) {
-    const { messages, onClear, initialFilterLevel } = props;
+    const { messages, onClear, initialFilterLevel, maxExpandedHeight = '40vh', defaultExpanded = false } = props;
     const { layoutMode } = useResponsive();
     const isMobile = layoutMode === 'mobile';
-    const [expanded, setExpanded] = useState(false);
+    const [expanded, setExpanded] = useState(defaultExpanded);
     const [showFilters, setShowFilters] = useState(false);
     const [filterLevel, setFilterLevel] = useState(initialFilterLevel !== null && initialFilterLevel !== void 0 ? initialFilterLevel : 'all');
     const [searchTerm, setSearchTerm] = useState('');
@@ -83,13 +93,13 @@ export function StatusBar(props) {
     const counts = useMemo(() => {
         const result = { info: 0, success: 0, warning: 0, error: 0 };
         for (const msg of messages) {
-            result[msg.severity]++;
+            result[effectiveSeverity(msg)]++;
         }
         return result;
     }, [messages]);
     const filteredMessages = useMemo(() => {
         return messages.filter((msg) => {
-            const passesLevel = Logging.shouldLog(severityToLogLevel(msg.severity), filterLevel);
+            const passesLevel = Logging.shouldLog(msg.level, filterLevel);
             const passesSearch = searchTerm === '' || msg.text.toLowerCase().includes(searchTerm.toLowerCase());
             return passesLevel && passesSearch;
         });
@@ -109,7 +119,7 @@ export function StatusBar(props) {
     }, []);
     const copyAllFiltered = useCallback(() => {
         const text = filteredMessages
-            .map((msg) => `[${msg.severity.toUpperCase()}] ${formatTime(msg.timestamp)} - ${msg.text}`)
+            .map((msg) => `[${msg.level.toUpperCase()}] ${formatTime(msg.timestamp)} - ${msg.text}`)
             .join('\n');
         copyToClipboard(text, '__all__');
     }, [filteredMessages, formatTime, copyToClipboard]);
@@ -122,10 +132,8 @@ export function StatusBar(props) {
                 messages.length === 0 && React.createElement("span", { className: "text-muted" }, "No messages")),
             React.createElement("span", { className: "text-muted" }, expanded ? '\u25BC' : '\u25B2')),
         expanded && (React.createElement(React.Fragment, null,
-            isMobile && (React.createElement("div", { className: "fixed inset-0 z-40 bg-backdrop", onClick: () => setExpanded(false) })),
-            React.createElement("div", { className: isMobile
-                    ? 'fixed inset-x-0 bottom-8 z-50 flex flex-col bg-surface border-t border-border shadow-xl rounded-t-lg max-h-[70vh]'
-                    : 'border-t border-border-subtle' },
+            isMobile && (React.createElement("div", { className: "fixed inset-0 z-40 bg-backdrop", onClick: () => setExpanded(false), "aria-hidden": "true" })),
+            React.createElement("div", { className: `flex flex-col border-t border-border-subtle ${isMobile ? 'relative z-50 bg-surface shadow-xl rounded-t-lg' : ''}`, style: { maxHeight: maxExpandedHeight } },
                 React.createElement("div", { className: "flex items-center justify-between px-4 py-1 bg-surface-alt border-b border-border-subtle shrink-0" },
                     React.createElement("span", { className: "text-xs font-medium text-muted" }, isFiltered
                         ? `${filteredMessages.length} of ${messages.length} messages`
@@ -134,7 +142,9 @@ export function StatusBar(props) {
                         React.createElement("button", { onClick: () => setShowFilters(!showFilters), className: `p-1 rounded hover:bg-surface-raised ${showFilters ? 'bg-surface-raised' : ''}`, title: "Filter messages" },
                             React.createElement(FunnelIcon, { className: "h-3.5 w-3.5 text-muted" })),
                         React.createElement("button", { onClick: copyAllFiltered, className: `p-1 rounded transition-colors ${copySuccessId === '__all__' ? 'bg-status-success-bg' : 'hover:bg-surface-raised'}`, title: copySuccessId === '__all__' ? 'Copied!' : 'Copy filtered messages' }, copySuccessId === '__all__' ? (React.createElement(CheckIcon, { className: "h-3.5 w-3.5 text-status-success-icon" })) : (React.createElement(DocumentDuplicateIcon, { className: "h-3.5 w-3.5 text-muted" }))),
-                        React.createElement("button", { onClick: onClear, className: "text-xs text-muted hover:text-secondary ml-1" }, "Clear"))),
+                        React.createElement("button", { onClick: onClear, className: "text-xs text-muted hover:text-secondary ml-1" }, "Clear"),
+                        React.createElement("button", { onClick: () => setExpanded(false), className: "p-1 rounded hover:bg-surface-raised ml-1", title: "Collapse log panel", "aria-label": "Collapse log panel" },
+                            React.createElement(XMarkIcon, { className: "h-3.5 w-3.5 text-muted" })))),
                 showFilters && (React.createElement("div", { className: "px-4 py-1.5 bg-surface-raised border-b border-border-subtle flex items-center gap-3 shrink-0" },
                     React.createElement("div", { className: "flex items-center gap-1" }, FILTER_LEVELS.map(({ label, level }) => (React.createElement("button", { key: level, onClick: () => setFilterLevel(level), className: `text-xs px-2 py-0.5 rounded border ${filterLevel === level
                             ? 'bg-status-info-bg border-status-info-border text-status-info-text'
@@ -143,12 +153,15 @@ export function StatusBar(props) {
                         React.createElement(MagnifyingGlassIcon, { className: "absolute left-2 top-1/2 -translate-y-1/2 h-3.5 w-3.5 text-muted" }),
                         React.createElement("input", { type: "text", placeholder: "Search messages...", value: searchTerm, onChange: (e) => setSearchTerm(e.target.value), className: "w-full pl-7 pr-6 py-0.5 text-xs border border-border rounded bg-surface text-primary focus:outline-none focus:ring-1 focus:ring-focus-ring focus:border-focus-ring" }),
                         searchTerm.length > 0 && (React.createElement("button", { onClick: () => setSearchTerm(''), className: "absolute right-2 top-1/2 -translate-y-1/2 text-muted hover:text-secondary text-xs", "aria-label": "Clear search" }, "\u00D7"))))),
-                React.createElement("div", { className: `overflow-y-auto ${isMobile ? 'flex-1' : 'max-h-48'}` }, filteredMessages.length === 0 ? (React.createElement("div", { className: "px-4 py-3 text-xs text-muted text-center" }, isFiltered ? 'No messages match the current filter' : 'No messages')) : (filteredMessages.map((msg) => (React.createElement("div", { key: msg.id, className: `group flex items-start gap-2 px-4 py-1.5 text-xs border-b border-border-subtle ${LOG_ROW_COLORS[msg.severity]}` },
-                    React.createElement("span", { className: `shrink-0 ${SEVERITY_COLORS[msg.severity]}` }, SEVERITY_ICONS[msg.severity]),
-                    React.createElement("span", { className: "flex-1 text-secondary" }, msg.text),
-                    React.createElement("button", { onClick: () => copyToClipboard(msg.text, msg.id), className: `shrink-0 p-0.5 rounded transition-colors ${copySuccessId === msg.id
-                            ? 'opacity-100 bg-status-success-surface'
-                            : 'opacity-0 group-hover:opacity-100 hover:bg-surface-raised'}`, title: copySuccessId === msg.id ? 'Copied!' : 'Copy message' }, copySuccessId === msg.id ? (React.createElement(CheckIcon, { className: "h-3 w-3 text-status-success-icon" })) : (React.createElement(DocumentDuplicateIcon, { className: "h-3 w-3 text-muted" }))),
-                    React.createElement("span", { className: "shrink-0 text-muted" }, formatTime(msg.timestamp))))))))))));
+                React.createElement("div", { className: "flex-1 min-h-0 overflow-y-auto" }, filteredMessages.length === 0 ? (React.createElement("div", { className: "px-4 py-3 text-xs text-muted text-center" }, isFiltered ? 'No messages match the current filter' : 'No messages')) : (filteredMessages.map((msg) => {
+                    const severity = effectiveSeverity(msg);
+                    return (React.createElement("div", { key: msg.id, className: `group flex items-start gap-2 px-4 py-1.5 text-xs border-b border-border-subtle ${LOG_ROW_COLORS[severity]}` },
+                        React.createElement("span", { className: `shrink-0 ${SEVERITY_COLORS[severity]}` }, SEVERITY_ICONS[severity]),
+                        React.createElement("span", { className: "flex-1 text-secondary" }, msg.text),
+                        React.createElement("button", { onClick: () => copyToClipboard(msg.text, msg.id), className: `shrink-0 p-0.5 rounded transition-colors ${copySuccessId === msg.id
+                                ? 'opacity-100 bg-status-success-surface'
+                                : 'opacity-0 group-hover:opacity-100 hover:bg-surface-raised'}`, title: copySuccessId === msg.id ? 'Copied!' : 'Copy message' }, copySuccessId === msg.id ? (React.createElement(CheckIcon, { className: "h-3 w-3 text-status-success-icon" })) : (React.createElement(DocumentDuplicateIcon, { className: "h-3 w-3 text-muted" }))),
+                        React.createElement("span", { className: "shrink-0 text-muted" }, formatTime(msg.timestamp))));
+                }))))))));
 }
 //# sourceMappingURL=StatusBar.js.map

package/dist/packlets/messages/StatusBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"StatusBar.js","sourceRoot":"","sources":["../../../src/packlets/messages/StatusBar.tsx"],"names":[],"mappings":"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","sourcesContent":["/*\n * Copyright (c) 2026 Erik Fortune\n *\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n *\n * The above copyright notice and this permission notice shall be included in all\n * copies or substantial portions of the Software.\n *\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\n * SOFTWARE.\n */\n\nimport React, { useCallback, useMemo, useState } from 'react';\n\nimport { Logging, type MessageLogLevel } from '@fgv/ts-utils';\nimport { FunnelIcon, DocumentDuplicateIcon, MagnifyingGlassIcon } from '@heroicons/react/24/outline';\nimport { CheckIcon } from '@heroicons/react/24/solid';\n\nimport { IMessage, MessageSeverity } from './model';\nimport { useResponsive } from '../responsive';\n\n// ============================================================================\n// Severity display config\n// ============================================================================\n\nconst SEVERITY_ICONS: Record<MessageSeverity, string> = {\n  info: '\\u2139',\n  success: '\\u2713',\n  warning: '\\u26A0',\n  error: '\\u2717'\n};\n\nconst SEVERITY_COLORS: Record<MessageSeverity, string> = {\n  info: 'text-status-info-icon',\n  success: 'text-status-success-icon',\n  warning: 'text-status-warning-icon',\n  error: 'text-status-error-icon'\n};\n\nconst LOG_ROW_COLORS: Record<MessageSeverity, string> = {\n  info: '',\n  success: 'bg-status-success-bg',\n  warning: 'bg-status-warning-bg',\n  error: 'bg-status-error-bg'\n};\n\n// ============================================================================\n// Level filter config\n// ============================================================================\n\n/**\n * Maps MessageSeverity to MessageLogLevel for shouldLog filtering.\n * 'success' is treated as 'info' since it doesn't exist in the log level hierarchy.\n */\nfunction severityToLogLevel(severity: MessageSeverity): MessageLogLevel {\n  return severity === 'success' ? 'info' : severity;\n}\n\n/**\n * Filter choices exposed in the UI, mapping labels to ReporterLogLevel values.\n */\nconst FILTER_LEVELS: ReadonlyArray<{ readonly label: string; readonly level: Logging.ReporterLogLevel }> = [\n  { label: 'All', level: 'all' },\n  { label: 'Info+', level: 'info' },\n  { label: 'Warn+', level: 'warning' },\n  { label: 'Error', level: 'error' }\n] as const;\n\n// ============================================================================\n// Status Bar\n// ============================================================================\n\n/**\n * Props for the StatusBar component.\n * @public\n */\nexport interface IStatusBarProps {\n  readonly messages: ReadonlyArray<IMessage>;\n  readonly onClear: () => void;\n  /** Initial filter level for the log panel. Defaults to 'all'. */\n  readonly initialFilterLevel?: Logging.ReporterLogLevel;\n}\n\n/**\n * Collapsible status bar / log panel at the bottom of the application.\n *\n * Collapsed: shows severity counts.\n * Expanded: filterable, searchable, copyable log of all messages.\n * @public\n */\nexport function StatusBar(props: IStatusBarProps): React.ReactElement {\n  const { messages, onClear, initialFilterLevel } = props;\n  const { layoutMode } = useResponsive();\n  const isMobile = layoutMode === 'mobile';\n  const [expanded, setExpanded] = useState(false);\n  const [showFilters, setShowFilters] = useState(false);\n  const [filterLevel, setFilterLevel] = useState<Logging.ReporterLogLevel>(initialFilterLevel ?? 'all');\n  const [searchTerm, setSearchTerm] = useState('');\n  const [copySuccessId, setCopySuccessId] = useState<string | null>(null);\n\n  const counts = useMemo(() => {\n    const result: Record<MessageSeverity, number> = { info: 0, success: 0, warning: 0, error: 0 };\n    for (const msg of messages) {\n      result[msg.severity]++;\n    }\n    return result;\n  }, [messages]);\n\n  const filteredMessages = useMemo(() => {\n    return messages.filter((msg) => {\n      const passesLevel = Logging.shouldLog(severityToLogLevel(msg.severity), filterLevel);\n      const passesSearch = searchTerm === '' || msg.text.toLowerCase().includes(searchTerm.toLowerCase());\n      return passesLevel && passesSearch;\n    });\n  }, [messages, filterLevel, searchTerm]);\n\n  const isFiltered = filteredMessages.length !== messages.length;\n\n  const formatTime = useCallback((timestamp: number): string => {\n    return new Date(timestamp).toLocaleTimeString();\n  }, []);\n\n  const copyToClipboard = useCallback((text: string, id: string): void => {\n    navigator.clipboard\n      .writeText(text)\n      .then(() => {\n        setCopySuccessId(id);\n        setTimeout(() => setCopySuccessId(null), 2000);\n      })\n      .catch(() => undefined);\n  }, []);\n\n  const copyAllFiltered = useCallback((): void => {\n    const text = filteredMessages\n      .map((msg) => `[${msg.severity.toUpperCase()}] ${formatTime(msg.timestamp)} - ${msg.text}`)\n      .join('\\n');\n    copyToClipboard(text, '__all__');\n  }, [filteredMessages, formatTime, copyToClipboard]);\n\n  return (\n    <div className=\"border-t border-border bg-surface\">\n      {/* Collapsed bar */}\n      <button\n        onClick={(): void => setExpanded(!expanded)}\n        className=\"flex items-center justify-between w-full px-4 py-1.5 text-xs text-secondary hover:bg-hover\"\n      >\n        <div className=\"flex items-center gap-4\">\n          {(Object.keys(counts) as MessageSeverity[]).map((severity) =>\n            counts[severity] > 0 ? (\n              <span key={severity} className={`flex items-center gap-1 ${SEVERITY_COLORS[severity]}`}>\n                <span>{SEVERITY_ICONS[severity]}</span>\n                <span>{counts[severity]}</span>\n              </span>\n            ) : null\n          )}\n          {messages.length === 0 && <span className=\"text-muted\">No messages</span>}\n        </div>\n        <span className=\"text-muted\">{expanded ? '\\u25BC' : '\\u25B2'}</span>\n      </button>\n\n      {/* Expanded log — fixed slide-up sheet on mobile, inline on desktop */}\n      {expanded && (\n        <>\n          {isMobile && (\n            <div className=\"fixed inset-0 z-40 bg-backdrop\" onClick={(): void => setExpanded(false)} />\n          )}\n          <div\n            className={\n              isMobile\n                ? 'fixed inset-x-0 bottom-8 z-50 flex flex-col bg-surface border-t border-border shadow-xl rounded-t-lg max-h-[70vh]'\n                : 'border-t border-border-subtle'\n            }\n          >\n            {/* Header toolbar */}\n            <div className=\"flex items-center justify-between px-4 py-1 bg-surface-alt border-b border-border-subtle shrink-0\">\n              <span className=\"text-xs font-medium text-muted\">\n                {isFiltered\n                  ? `${filteredMessages.length} of ${messages.length} messages`\n                  : `${messages.length} message${messages.length !== 1 ? 's' : ''}`}\n              </span>\n              <div className=\"flex items-center gap-1\">\n                <button\n                  onClick={(): void => setShowFilters(!showFilters)}\n                  className={`p-1 rounded hover:bg-surface-raised ${showFilters ? 'bg-surface-raised' : ''}`}\n                  title=\"Filter messages\"\n                >\n                  <FunnelIcon className=\"h-3.5 w-3.5 text-muted\" />\n                </button>\n                <button\n                  onClick={copyAllFiltered}\n                  className={`p-1 rounded transition-colors ${\n                    copySuccessId === '__all__' ? 'bg-status-success-bg' : 'hover:bg-surface-raised'\n                  }`}\n                  title={copySuccessId === '__all__' ? 'Copied!' : 'Copy filtered messages'}\n                >\n                  {copySuccessId === '__all__' ? (\n                    <CheckIcon className=\"h-3.5 w-3.5 text-status-success-icon\" />\n                  ) : (\n                    <DocumentDuplicateIcon className=\"h-3.5 w-3.5 text-muted\" />\n                  )}\n                </button>\n                <button onClick={onClear} className=\"text-xs text-muted hover:text-secondary ml-1\">\n                  Clear\n                </button>\n              </div>\n            </div>\n\n            {/* Filter toolbar */}\n            {showFilters && (\n              <div className=\"px-4 py-1.5 bg-surface-raised border-b border-border-subtle flex items-center gap-3 shrink-0\">\n                {/* Level filter buttons */}\n                <div className=\"flex items-center gap-1\">\n                  {FILTER_LEVELS.map(({ label, level }) => (\n                    <button\n                      key={level}\n                      onClick={(): void => setFilterLevel(level)}\n                      className={`text-xs px-2 py-0.5 rounded border ${\n                        filterLevel === level\n                          ? 'bg-status-info-bg border-status-info-border text-status-info-text'\n                          : 'bg-surface border-border text-secondary hover:bg-hover'\n                      }`}\n                    >\n                      {label}\n                    </button>\n                  ))}\n                </div>\n\n                {/* Search input */}\n                <div className=\"relative flex-1\">\n                  <MagnifyingGlassIcon className=\"absolute left-2 top-1/2 -translate-y-1/2 h-3.5 w-3.5 text-muted\" />\n                  <input\n                    type=\"text\"\n                    placeholder=\"Search messages...\"\n                    value={searchTerm}\n                    onChange={(e): void => setSearchTerm(e.target.value)}\n                    className=\"w-full pl-7 pr-6 py-0.5 text-xs border border-border rounded bg-surface text-primary focus:outline-none focus:ring-1 focus:ring-focus-ring focus:border-focus-ring\"\n                  />\n                  {searchTerm.length > 0 && (\n                    <button\n                      onClick={(): void => setSearchTerm('')}\n                      className=\"absolute right-2 top-1/2 -translate-y-1/2 text-muted hover:text-secondary text-xs\"\n                      aria-label=\"Clear search\"\n                    >\n                      &times;\n                    </button>\n                  )}\n                </div>\n              </div>\n            )}\n\n            {/* Message list */}\n            <div className={`overflow-y-auto ${isMobile ? 'flex-1' : 'max-h-48'}`}>\n              {filteredMessages.length === 0 ? (\n                <div className=\"px-4 py-3 text-xs text-muted text-center\">\n                  {isFiltered ? 'No messages match the current filter' : 'No messages'}\n                </div>\n              ) : (\n                filteredMessages.map((msg) => (\n                  <div\n                    key={msg.id}\n                    className={`group flex items-start gap-2 px-4 py-1.5 text-xs border-b border-border-subtle ${\n                      LOG_ROW_COLORS[msg.severity]\n                    }`}\n                  >\n                    <span className={`shrink-0 ${SEVERITY_COLORS[msg.severity]}`}>\n                      {SEVERITY_ICONS[msg.severity]}\n                    </span>\n                    <span className=\"flex-1 text-secondary\">{msg.text}</span>\n                    <button\n                      onClick={(): void => copyToClipboard(msg.text, msg.id)}\n                      className={`shrink-0 p-0.5 rounded transition-colors ${\n                        copySuccessId === msg.id\n                          ? 'opacity-100 bg-status-success-surface'\n                          : 'opacity-0 group-hover:opacity-100 hover:bg-surface-raised'\n                      }`}\n                      title={copySuccessId === msg.id ? 'Copied!' : 'Copy message'}\n                    >\n                      {copySuccessId === msg.id ? (\n                        <CheckIcon className=\"h-3 w-3 text-status-success-icon\" />\n                      ) : (\n                        <DocumentDuplicateIcon className=\"h-3 w-3 text-muted\" />\n                      )}\n                    </button>\n                    <span className=\"shrink-0 text-muted\">{formatTime(msg.timestamp)}</span>\n                  </div>\n                ))\n              )}\n            </div>\n          </div>\n        </>\n      )}\n    </div>\n  );\n}\n"]}
+{"version":3,"file":"StatusBar.js","sourceRoot":"","sources":["../../../src/packlets/messages/StatusBar.tsx"],"names":[],"mappings":"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","sourcesContent":["/*\n * Copyright (c) 2026 Erik Fortune\n *\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n *\n * The above copyright notice and this permission notice shall be included in all\n * copies or substantial portions of the Software.\n *\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\n * SOFTWARE.\n */\n\nimport React, { useCallback, useMemo, useState } from 'react';\n\nimport { Logging } from '@fgv/ts-utils';\nimport {\n  FunnelIcon,\n  DocumentDuplicateIcon,\n  MagnifyingGlassIcon,\n  XMarkIcon\n} from '@heroicons/react/24/outline';\nimport { CheckIcon } from '@heroicons/react/24/solid';\n\nimport { deriveSeverityFromLevel, IMessage, MessageSeverity } from './model';\nimport { useResponsive } from '../responsive';\n\n// ============================================================================\n// Severity display config\n// ============================================================================\n\nconst SEVERITY_ICONS: Record<MessageSeverity, string> = {\n  info: '\\u2139',\n  success: '\\u2713',\n  warning: '\\u26A0',\n  error: '\\u2717'\n};\n\nconst SEVERITY_COLORS: Record<MessageSeverity, string> = {\n  info: 'text-status-info-icon',\n  success: 'text-status-success-icon',\n  warning: 'text-status-warning-icon',\n  error: 'text-status-error-icon'\n};\n\nconst LOG_ROW_COLORS: Record<MessageSeverity, string> = {\n  info: '',\n  success: 'bg-status-success-bg',\n  warning: 'bg-status-warning-bg',\n  error: 'bg-status-error-bg'\n};\n\n// ============================================================================\n// Level filter config\n// ============================================================================\n\n/**\n * Effective display severity for a message: its explicit `severity` styling override,\n * or the severity derived from its canonical log level.\n */\nfunction effectiveSeverity(message: IMessage): MessageSeverity {\n  return message.severity ?? deriveSeverityFromLevel(message.level);\n}\n\n/**\n * Filter choices exposed in the UI, mapping labels to ReporterLogLevel values.\n *\n * The full log-level granularity is exposed (the core gap fix): `Detail+` lets the panel\n * filter at the same granularity a ts-utils logger records, including `detail` messages\n * that the previous severity-based filter could not represent. `All` additionally surfaces\n * `quiet`-level messages (per {@link @fgv/ts-utils#Logging.shouldLog | shouldLog} semantics,\n * `quiet` is only visible under the `all` threshold).\n */\nconst FILTER_LEVELS: ReadonlyArray<{ readonly label: string; readonly level: Logging.ReporterLogLevel }> = [\n  { label: 'All', level: 'all' },\n  { label: 'Detail+', level: 'detail' },\n  { label: 'Info+', level: 'info' },\n  { label: 'Warn+', level: 'warning' },\n  { label: 'Error', level: 'error' }\n] as const;\n\n// ============================================================================\n// Status Bar\n// ============================================================================\n\n/**\n * Props for the StatusBar component.\n * @public\n */\nexport interface IStatusBarProps {\n  readonly messages: ReadonlyArray<IMessage>;\n  readonly onClear: () => void;\n  /** Initial filter level for the log panel. Defaults to 'all'. */\n  readonly initialFilterLevel?: Logging.ReporterLogLevel;\n  /**\n   * Maximum height of the expanded panel as a CSS length (e.g. `'40vh'`, `'320px'`).\n   * The panel is bounded to this height on both desktop and mobile; the message list\n   * scrolls within the bound while the header and filter controls stay fixed. Defaults to `'40vh'`.\n   */\n  readonly maxExpandedHeight?: string;\n  /** Whether the panel is expanded on mount. Defaults to `false` (collapsed). */\n  readonly defaultExpanded?: boolean;\n}\n\n/**\n * Collapsible status bar / log panel at the bottom of the application.\n *\n * Collapsed: shows severity counts.\n * Expanded: filterable, searchable, copyable log of all messages, bounded to\n * {@link IStatusBarProps.maxExpandedHeight} with the list scrolling within the bound.\n * @public\n */\nexport function StatusBar(props: IStatusBarProps): React.ReactElement {\n  const {\n    messages,\n    onClear,\n    initialFilterLevel,\n    maxExpandedHeight = '40vh',\n    defaultExpanded = false\n  } = props;\n  const { layoutMode } = useResponsive();\n  const isMobile = layoutMode === 'mobile';\n  const [expanded, setExpanded] = useState(defaultExpanded);\n  const [showFilters, setShowFilters] = useState(false);\n  const [filterLevel, setFilterLevel] = useState<Logging.ReporterLogLevel>(initialFilterLevel ?? 'all');\n  const [searchTerm, setSearchTerm] = useState('');\n  const [copySuccessId, setCopySuccessId] = useState<string | null>(null);\n\n  const counts = useMemo(() => {\n    const result: Record<MessageSeverity, number> = { info: 0, success: 0, warning: 0, error: 0 };\n    for (const msg of messages) {\n      result[effectiveSeverity(msg)]++;\n    }\n    return result;\n  }, [messages]);\n\n  const filteredMessages = useMemo(() => {\n    return messages.filter((msg) => {\n      const passesLevel = Logging.shouldLog(msg.level, filterLevel);\n      const passesSearch = searchTerm === '' || msg.text.toLowerCase().includes(searchTerm.toLowerCase());\n      return passesLevel && passesSearch;\n    });\n  }, [messages, filterLevel, searchTerm]);\n\n  const isFiltered = filteredMessages.length !== messages.length;\n\n  const formatTime = useCallback((timestamp: number): string => {\n    return new Date(timestamp).toLocaleTimeString();\n  }, []);\n\n  const copyToClipboard = useCallback((text: string, id: string): void => {\n    navigator.clipboard\n      .writeText(text)\n      .then(() => {\n        setCopySuccessId(id);\n        setTimeout(() => setCopySuccessId(null), 2000);\n      })\n      .catch(() => undefined);\n  }, []);\n\n  const copyAllFiltered = useCallback((): void => {\n    const text = filteredMessages\n      .map((msg) => `[${msg.level.toUpperCase()}] ${formatTime(msg.timestamp)} - ${msg.text}`)\n      .join('\\n');\n    copyToClipboard(text, '__all__');\n  }, [filteredMessages, formatTime, copyToClipboard]);\n\n  return (\n    <div className=\"border-t border-border bg-surface\">\n      {/* Collapsed bar */}\n      <button\n        onClick={(): void => setExpanded(!expanded)}\n        className=\"flex items-center justify-between w-full px-4 py-1.5 text-xs text-secondary hover:bg-hover\"\n      >\n        <div className=\"flex items-center gap-4\">\n          {(Object.keys(counts) as MessageSeverity[]).map((severity) =>\n            counts[severity] > 0 ? (\n              <span key={severity} className={`flex items-center gap-1 ${SEVERITY_COLORS[severity]}`}>\n                <span>{SEVERITY_ICONS[severity]}</span>\n                <span>{counts[severity]}</span>\n              </span>\n            ) : null\n          )}\n          {messages.length === 0 && <span className=\"text-muted\">No messages</span>}\n        </div>\n        <span className=\"text-muted\">{expanded ? '\\u25BC' : '\\u25B2'}</span>\n      </button>\n\n      {/* Expanded log — bounded bottom-sheet on mobile, bounded inline panel on desktop.\n          The panel stays in document flow on both layouts (no `fixed` takeover); the mobile\n          backdrop is the only fixed element, dimming the rest and supporting tap-to-dismiss. */}\n      {expanded && (\n        <>\n          {isMobile && (\n            <div\n              className=\"fixed inset-0 z-40 bg-backdrop\"\n              onClick={(): void => setExpanded(false)}\n              aria-hidden=\"true\"\n            />\n          )}\n          <div\n            className={`flex flex-col border-t border-border-subtle ${\n              isMobile ? 'relative z-50 bg-surface shadow-xl rounded-t-lg' : ''\n            }`}\n            style={{ maxHeight: maxExpandedHeight }}\n          >\n            {/* Header toolbar */}\n            <div className=\"flex items-center justify-between px-4 py-1 bg-surface-alt border-b border-border-subtle shrink-0\">\n              <span className=\"text-xs font-medium text-muted\">\n                {isFiltered\n                  ? `${filteredMessages.length} of ${messages.length} messages`\n                  : `${messages.length} message${messages.length !== 1 ? 's' : ''}`}\n              </span>\n              <div className=\"flex items-center gap-1\">\n                <button\n                  onClick={(): void => setShowFilters(!showFilters)}\n                  className={`p-1 rounded hover:bg-surface-raised ${showFilters ? 'bg-surface-raised' : ''}`}\n                  title=\"Filter messages\"\n                >\n                  <FunnelIcon className=\"h-3.5 w-3.5 text-muted\" />\n                </button>\n                <button\n                  onClick={copyAllFiltered}\n                  className={`p-1 rounded transition-colors ${\n                    copySuccessId === '__all__' ? 'bg-status-success-bg' : 'hover:bg-surface-raised'\n                  }`}\n                  title={copySuccessId === '__all__' ? 'Copied!' : 'Copy filtered messages'}\n                >\n                  {copySuccessId === '__all__' ? (\n                    <CheckIcon className=\"h-3.5 w-3.5 text-status-success-icon\" />\n                  ) : (\n                    <DocumentDuplicateIcon className=\"h-3.5 w-3.5 text-muted\" />\n                  )}\n                </button>\n                <button onClick={onClear} className=\"text-xs text-muted hover:text-secondary ml-1\">\n                  Clear\n                </button>\n                <button\n                  onClick={(): void => setExpanded(false)}\n                  className=\"p-1 rounded hover:bg-surface-raised ml-1\"\n                  title=\"Collapse log panel\"\n                  aria-label=\"Collapse log panel\"\n                >\n                  <XMarkIcon className=\"h-3.5 w-3.5 text-muted\" />\n                </button>\n              </div>\n            </div>\n\n            {/* Filter toolbar */}\n            {showFilters && (\n              <div className=\"px-4 py-1.5 bg-surface-raised border-b border-border-subtle flex items-center gap-3 shrink-0\">\n                {/* Level filter buttons */}\n                <div className=\"flex items-center gap-1\">\n                  {FILTER_LEVELS.map(({ label, level }) => (\n                    <button\n                      key={level}\n                      onClick={(): void => setFilterLevel(level)}\n                      className={`text-xs px-2 py-0.5 rounded border ${\n                        filterLevel === level\n                          ? 'bg-status-info-bg border-status-info-border text-status-info-text'\n                          : 'bg-surface border-border text-secondary hover:bg-hover'\n                      }`}\n                    >\n                      {label}\n                    </button>\n                  ))}\n                </div>\n\n                {/* Search input */}\n                <div className=\"relative flex-1\">\n                  <MagnifyingGlassIcon className=\"absolute left-2 top-1/2 -translate-y-1/2 h-3.5 w-3.5 text-muted\" />\n                  <input\n                    type=\"text\"\n                    placeholder=\"Search messages...\"\n                    value={searchTerm}\n                    onChange={(e): void => setSearchTerm(e.target.value)}\n                    className=\"w-full pl-7 pr-6 py-0.5 text-xs border border-border rounded bg-surface text-primary focus:outline-none focus:ring-1 focus:ring-focus-ring focus:border-focus-ring\"\n                  />\n                  {searchTerm.length > 0 && (\n                    <button\n                      onClick={(): void => setSearchTerm('')}\n                      className=\"absolute right-2 top-1/2 -translate-y-1/2 text-muted hover:text-secondary text-xs\"\n                      aria-label=\"Clear search\"\n                    >\n                      &times;\n                    </button>\n                  )}\n                </div>\n              </div>\n            )}\n\n            {/* Message list — scrolls within the bounded panel; header/filters stay fixed */}\n            <div className=\"flex-1 min-h-0 overflow-y-auto\">\n              {filteredMessages.length === 0 ? (\n                <div className=\"px-4 py-3 text-xs text-muted text-center\">\n                  {isFiltered ? 'No messages match the current filter' : 'No messages'}\n                </div>\n              ) : (\n                filteredMessages.map((msg) => {\n                  const severity = effectiveSeverity(msg);\n                  return (\n                    <div\n                      key={msg.id}\n                      className={`group flex items-start gap-2 px-4 py-1.5 text-xs border-b border-border-subtle ${LOG_ROW_COLORS[severity]}`}\n                    >\n                      <span className={`shrink-0 ${SEVERITY_COLORS[severity]}`}>\n                        {SEVERITY_ICONS[severity]}\n                      </span>\n                      <span className=\"flex-1 text-secondary\">{msg.text}</span>\n                      <button\n                        onClick={(): void => copyToClipboard(msg.text, msg.id)}\n                        className={`shrink-0 p-0.5 rounded transition-colors ${\n                          copySuccessId === msg.id\n                            ? 'opacity-100 bg-status-success-surface'\n                            : 'opacity-0 group-hover:opacity-100 hover:bg-surface-raised'\n                        }`}\n                        title={copySuccessId === msg.id ? 'Copied!' : 'Copy message'}\n                      >\n                        {copySuccessId === msg.id ? (\n                          <CheckIcon className=\"h-3 w-3 text-status-success-icon\" />\n                        ) : (\n                          <DocumentDuplicateIcon className=\"h-3 w-3 text-muted\" />\n                        )}\n                      </button>\n                      <span className=\"shrink-0 text-muted\">{formatTime(msg.timestamp)}</span>\n                    </div>\n                  );\n                })\n              )}\n            </div>\n          </div>\n        </>\n      )}\n    </div>\n  );\n}\n"]}

package/dist/packlets/messages/Toast.js

@@ -20,7 +20,7 @@
  * SOFTWARE.
  */
 import React, { useEffect } from 'react';
-import { DEFAULT_TOAST_CONFIG } from './model';
+import { DEFAULT_TOAST_CONFIG, deriveSeverityFromLevel } from './model';
 import { useResponsive } from '../responsive';
 // ============================================================================
 // Severity Styles
@@ -36,8 +36,10 @@ const SEVERITY_STYLES = {
  * @public
  */
 export function ToastItem(props) {
+    var _a;
     const { message, onDismiss } = props;
-    const config = DEFAULT_TOAST_CONFIG[message.severity];
+    const severity = (_a = message.severity) !== null && _a !== void 0 ? _a : deriveSeverityFromLevel(message.level);
+    const config = DEFAULT_TOAST_CONFIG[severity];
     const { layoutMode } = useResponsive();
     useEffect(() => {
         if (config.autoDismissMs > 0) {
@@ -46,7 +48,7 @@ export function ToastItem(props) {
         }
         return undefined;
     }, [message.id, config.autoDismissMs, onDismiss]);
-    return (React.createElement("div", { className: `flex items-start gap-3 px-4 py-3 rounded-lg border shadow-lg ${layoutMode === 'mobile' ? 'w-full' : 'max-w-sm'} ${SEVERITY_STYLES[message.severity]}`, role: "alert" },
+    return (React.createElement("div", { className: `flex items-start gap-3 px-4 py-3 rounded-lg border shadow-lg ${layoutMode === 'mobile' ? 'w-full' : 'max-w-sm'} ${SEVERITY_STYLES[severity]}`, role: "alert" },
         React.createElement("div", { className: "flex-1 text-sm line-clamp-4", title: message.text }, message.text),
         React.createElement("div", { className: "flex items-center gap-2 shrink-0" },
             message.action && (React.createElement("button", { onClick: message.action.onAction, className: "text-sm font-medium underline hover:no-underline" }, message.action.label)),

package/dist/packlets/messages/Toast.js.map

@@ -1 +1 @@
-{"version":3,"file":"Toast.js","sourceRoot":"","sources":["../../../src/packlets/messages/Toast.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;GAoBG;AAEH,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEzC,OAAO,EAAE,oBAAoB,EAA6B,MAAM,SAAS,CAAC;AAC1E,OAAO,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAE9C,+EAA+E;AAC/E,kBAAkB;AAClB,+EAA+E;AAE/E,MAAM,eAAe,GAAoC;IACvD,IAAI,EAAE,mEAAmE;IACzE,OAAO,EAAE,4EAA4E;IACrF,OAAO,EAAE,4EAA4E;IACrF,KAAK,EAAE,sEAAsE;CAC9E,CAAC;AAeF;;;GAGG;AACH,MAAM,UAAU,SAAS,CAAC,KAAsB;IAC9C,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,KAAK,CAAC;IACrC,MAAM,MAAM,GAAG,oBAAoB,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;IACtD,MAAM,EAAE,UAAU,EAAE,GAAG,aAAa,EAAE,CAAC;IAEvC,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,MAAM,CAAC,aAAa,GAAG,CAAC,EAAE,CAAC;YAC7B,MAAM,KAAK,GAAG,UAAU,CAAC,GAAG,EAAE,CAAC,SAAS,CAAC,OAAO,CAAC,EAAE,CAAC,EAAE,MAAM,CAAC,aAAa,CAAC,CAAC;YAC5E,OAAO,GAAS,EAAE,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC;QACzC,CAAC;QACD,OAAO,SAAS,CAAC;IACnB,CAAC,EAAE,CAAC,OAAO,CAAC,EAAE,EAAE,MAAM,CAAC,aAAa,EAAE,SAAS,CAAC,CAAC,CAAC;IAElD,OAAO,CACL,6BACE,SAAS,EAAE,gEACT,UAAU,KAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,UACvC,IAAI,eAAe,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE,EACvC,IAAI,EAAC,OAAO;QAEZ,6BAAK,SAAS,EAAC,6BAA6B,EAAC,KAAK,EAAE,OAAO,CAAC,IAAI,IAC7D,OAAO,CAAC,IAAI,CACT;QACN,6BAAK,SAAS,EAAC,kCAAkC;YAC9C,OAAO,CAAC,MAAM,IAAI,CACjB,gCACE,OAAO,EAAE,OAAO,CAAC,MAAM,CAAC,QAAQ,EAChC,SAAS,EAAC,kDAAkD,IAE3D,OAAO,CAAC,MAAM,CAAC,KAAK,CACd,CACV;YACD,gCACE,OAAO,EAAE,GAAS,EAAE,CAAC,SAAS,CAAC,OAAO,CAAC,EAAE,CAAC,EAC1C,SAAS,EAAC,2CAA2C,gBAC1C,SAAS,aAGb,CACL,CACF,CACP,CAAC;AACJ,CAAC;AAiBD;;;GAGG;AACH,MAAM,UAAU,cAAc,CAAC,KAA2B;IACxD,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,UAAU,GAAG,CAAC,EAAE,GAAG,KAAK,CAAC;IACpD,MAAM,EAAE,UAAU,EAAE,GAAG,aAAa,EAAE,CAAC;IACvC,MAAM,OAAO,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC,UAAU,CAAC,CAAC;IAE1C,IAAI,OAAO,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;QACzB,OAAO,IAAI,CAAC;IACd,CAAC;IAED,OAAO,CACL,6BACE,SAAS,EAAE,4CACT,UAAU,KAAK,QAAQ,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,SAC/C,EAAE,IAED,OAAO,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CACtB,oBAAC,SAAS,IAAC,GAAG,EAAE,KAAK,CAAC,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,SAAS,GAAI,CACnE,CAAC,CACE,CACP,CAAC;AACJ,CAAC","sourcesContent":["/*\n * Copyright (c) 2026 Erik Fortune\n *\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n *\n * The above copyright notice and this permission notice shall be included in all\n * copies or substantial portions of the Software.\n *\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\n * SOFTWARE.\n */\n\nimport React, { useEffect } from 'react';\n\nimport { DEFAULT_TOAST_CONFIG, IMessage, MessageSeverity } from './model';\nimport { useResponsive } from '../responsive';\n\n// ============================================================================\n// Severity Styles\n// ============================================================================\n\nconst SEVERITY_STYLES: Record<MessageSeverity, string> = {\n  info: 'bg-status-info-bg border-status-info-border text-status-info-text',\n  success: 'bg-status-success-bg border-status-success-border text-status-success-text',\n  warning: 'bg-status-warning-bg border-status-warning-border text-status-warning-text',\n  error: 'bg-status-error-bg border-status-error-border text-status-error-text'\n};\n\n// ============================================================================\n// Single Toast\n// ============================================================================\n\n/**\n * Props for a single Toast item.\n * @public\n */\nexport interface IToastItemProps {\n  readonly message: IMessage;\n  readonly onDismiss: (id: string) => void;\n}\n\n/**\n * A single toast notification.\n * @public\n */\nexport function ToastItem(props: IToastItemProps): React.ReactElement {\n  const { message, onDismiss } = props;\n  const config = DEFAULT_TOAST_CONFIG[message.severity];\n  const { layoutMode } = useResponsive();\n\n  useEffect(() => {\n    if (config.autoDismissMs > 0) {\n      const timer = setTimeout(() => onDismiss(message.id), config.autoDismissMs);\n      return (): void => clearTimeout(timer);\n    }\n    return undefined;\n  }, [message.id, config.autoDismissMs, onDismiss]);\n\n  return (\n    <div\n      className={`flex items-start gap-3 px-4 py-3 rounded-lg border shadow-lg ${\n        layoutMode === 'mobile' ? 'w-full' : 'max-w-sm'\n      } ${SEVERITY_STYLES[message.severity]}`}\n      role=\"alert\"\n    >\n      <div className=\"flex-1 text-sm line-clamp-4\" title={message.text}>\n        {message.text}\n      </div>\n      <div className=\"flex items-center gap-2 shrink-0\">\n        {message.action && (\n          <button\n            onClick={message.action.onAction}\n            className=\"text-sm font-medium underline hover:no-underline\"\n          >\n            {message.action.label}\n          </button>\n        )}\n        <button\n          onClick={(): void => onDismiss(message.id)}\n          className=\"text-current opacity-50 hover:opacity-100\"\n          aria-label=\"Dismiss\"\n        >\n          &times;\n        </button>\n      </div>\n    </div>\n  );\n}\n\n// ============================================================================\n// Toast Container\n// ============================================================================\n\n/**\n * Props for the ToastContainer.\n * @public\n */\nexport interface IToastContainerProps {\n  readonly toasts: ReadonlyArray<IMessage>;\n  readonly onDismiss: (id: string) => void;\n  /** Maximum number of toasts to show simultaneously */\n  readonly maxVisible?: number;\n}\n\n/**\n * Container that renders active toasts in the bottom-right corner.\n * @public\n */\nexport function ToastContainer(props: IToastContainerProps): React.ReactElement | null {\n  const { toasts, onDismiss, maxVisible = 5 } = props;\n  const { layoutMode } = useResponsive();\n  const visible = toasts.slice(-maxVisible);\n\n  if (visible.length === 0) {\n    return null;\n  }\n\n  return (\n    <div\n      className={`fixed bottom-16 z-50 flex flex-col gap-2 ${\n        layoutMode === 'mobile' ? 'left-4 right-4' : 'right-4'\n      }`}\n    >\n      {visible.map((toast) => (\n        <ToastItem key={toast.id} message={toast} onDismiss={onDismiss} />\n      ))}\n    </div>\n  );\n}\n"]}
+{"version":3,"file":"Toast.js","sourceRoot":"","sources":["../../../src/packlets/messages/Toast.tsx"],"names":[],"mappings":"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","sourcesContent":["/*\n * Copyright (c) 2026 Erik Fortune\n *\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n *\n * The above copyright notice and this permission notice shall be included in all\n * copies or substantial portions of the Software.\n *\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\n * SOFTWARE.\n */\n\nimport React, { useEffect } from 'react';\n\nimport { DEFAULT_TOAST_CONFIG, deriveSeverityFromLevel, IMessage, MessageSeverity } from './model';\nimport { useResponsive } from '../responsive';\n\n// ============================================================================\n// Severity Styles\n// ============================================================================\n\nconst SEVERITY_STYLES: Record<MessageSeverity, string> = {\n  info: 'bg-status-info-bg border-status-info-border text-status-info-text',\n  success: 'bg-status-success-bg border-status-success-border text-status-success-text',\n  warning: 'bg-status-warning-bg border-status-warning-border text-status-warning-text',\n  error: 'bg-status-error-bg border-status-error-border text-status-error-text'\n};\n\n// ============================================================================\n// Single Toast\n// ============================================================================\n\n/**\n * Props for a single Toast item.\n * @public\n */\nexport interface IToastItemProps {\n  readonly message: IMessage;\n  readonly onDismiss: (id: string) => void;\n}\n\n/**\n * A single toast notification.\n * @public\n */\nexport function ToastItem(props: IToastItemProps): React.ReactElement {\n  const { message, onDismiss } = props;\n  const severity = message.severity ?? deriveSeverityFromLevel(message.level);\n  const config = DEFAULT_TOAST_CONFIG[severity];\n  const { layoutMode } = useResponsive();\n\n  useEffect(() => {\n    if (config.autoDismissMs > 0) {\n      const timer = setTimeout(() => onDismiss(message.id), config.autoDismissMs);\n      return (): void => clearTimeout(timer);\n    }\n    return undefined;\n  }, [message.id, config.autoDismissMs, onDismiss]);\n\n  return (\n    <div\n      className={`flex items-start gap-3 px-4 py-3 rounded-lg border shadow-lg ${\n        layoutMode === 'mobile' ? 'w-full' : 'max-w-sm'\n      } ${SEVERITY_STYLES[severity]}`}\n      role=\"alert\"\n    >\n      <div className=\"flex-1 text-sm line-clamp-4\" title={message.text}>\n        {message.text}\n      </div>\n      <div className=\"flex items-center gap-2 shrink-0\">\n        {message.action && (\n          <button\n            onClick={message.action.onAction}\n            className=\"text-sm font-medium underline hover:no-underline\"\n          >\n            {message.action.label}\n          </button>\n        )}\n        <button\n          onClick={(): void => onDismiss(message.id)}\n          className=\"text-current opacity-50 hover:opacity-100\"\n          aria-label=\"Dismiss\"\n        >\n          &times;\n        </button>\n      </div>\n    </div>\n  );\n}\n\n// ============================================================================\n// Toast Container\n// ============================================================================\n\n/**\n * Props for the ToastContainer.\n * @public\n */\nexport interface IToastContainerProps {\n  readonly toasts: ReadonlyArray<IMessage>;\n  readonly onDismiss: (id: string) => void;\n  /** Maximum number of toasts to show simultaneously */\n  readonly maxVisible?: number;\n}\n\n/**\n * Container that renders active toasts in the bottom-right corner.\n * @public\n */\nexport function ToastContainer(props: IToastContainerProps): React.ReactElement | null {\n  const { toasts, onDismiss, maxVisible = 5 } = props;\n  const { layoutMode } = useResponsive();\n  const visible = toasts.slice(-maxVisible);\n\n  if (visible.length === 0) {\n    return null;\n  }\n\n  return (\n    <div\n      className={`fixed bottom-16 z-50 flex flex-col gap-2 ${\n        layoutMode === 'mobile' ? 'left-4 right-4' : 'right-4'\n      }`}\n    >\n      {visible.map((toast) => (\n        <ToastItem key={toast.id} message={toast} onDismiss={onDismiss} />\n      ))}\n    </div>\n  );\n}\n"]}

package/dist/packlets/messages/index.js

@@ -2,7 +2,7 @@
  * Messages packlet - observability context, toast system, and log panel.
  * @packageDocumentation
  */
-export { DEFAULT_TOAST_CONFIG, createMessage, generateMessageId } from './model';
+export { DEFAULT_TOAST_CONFIG, deriveSeverityFromLevel, createMessage, generateMessageId } from './model';
 export { MessagesProvider, useMessages } from './MessagesContext';
 export { ToastItem, ToastContainer } from './Toast';
 export { StatusBar } from './StatusBar';

package/dist/packlets/messages/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/packlets/messages/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAKL,oBAAoB,EACpB,aAAa,EACb,iBAAiB,EAClB,MAAM,SAAS,CAAC;AAEjB,OAAO,EAGL,gBAAgB,EAChB,WAAW,EACZ,MAAM,mBAAmB,CAAC;AAE3B,OAAO,EAAE,SAAS,EAAE,cAAc,EAAmD,MAAM,SAAS,CAAC;AAErG,OAAO,EAAE,SAAS,EAAwB,MAAM,aAAa,CAAC;AAE9D,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAElD,OAAO,EAAE,cAAc,EAA+B,MAAM,kBAAkB,CAAC","sourcesContent":["/**\n * Messages packlet - observability context, toast system, and log panel.\n * @packageDocumentation\n */\n\nexport {\n  type MessageSeverity,\n  type IMessage,\n  type IMessageAction,\n  type IToastConfig,\n  DEFAULT_TOAST_CONFIG,\n  createMessage,\n  generateMessageId\n} from './model';\n\nexport {\n  type IMessagesContextValue,\n  type IMessagesProviderProps,\n  MessagesProvider,\n  useMessages\n} from './MessagesContext';\n\nexport { ToastItem, ToastContainer, type IToastItemProps, type IToastContainerProps } from './Toast';\n\nexport { StatusBar, type IStatusBarProps } from './StatusBar';\n\nexport { MessagesLogger } from './MessagesLogger';\n\nexport { useLogReporter, type IUseLogReporterOptions } from './useLogReporter';\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/packlets/messages/index.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAML,oBAAoB,EACpB,uBAAuB,EACvB,aAAa,EACb,iBAAiB,EAClB,MAAM,SAAS,CAAC;AAEjB,OAAO,EAGL,gBAAgB,EAChB,WAAW,EACZ,MAAM,mBAAmB,CAAC;AAE3B,OAAO,EAAE,SAAS,EAAE,cAAc,EAAmD,MAAM,SAAS,CAAC;AAErG,OAAO,EAAE,SAAS,EAAwB,MAAM,aAAa,CAAC;AAE9D,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAElD,OAAO,EAAE,cAAc,EAA+B,MAAM,kBAAkB,CAAC","sourcesContent":["/**\n * Messages packlet - observability context, toast system, and log panel.\n * @packageDocumentation\n */\n\nexport {\n  type MessageSeverity,\n  type IMessage,\n  type IMessageAction,\n  type ICreateMessageOptions,\n  type IToastConfig,\n  DEFAULT_TOAST_CONFIG,\n  deriveSeverityFromLevel,\n  createMessage,\n  generateMessageId\n} from './model';\n\nexport {\n  type IMessagesContextValue,\n  type IMessagesProviderProps,\n  MessagesProvider,\n  useMessages\n} from './MessagesContext';\n\nexport { ToastItem, ToastContainer, type IToastItemProps, type IToastContainerProps } from './Toast';\n\nexport { StatusBar, type IStatusBarProps } from './StatusBar';\n\nexport { MessagesLogger } from './MessagesLogger';\n\nexport { useLogReporter, type IUseLogReporterOptions } from './useLogReporter';\n"]}

package/dist/packlets/messages/model.js

@@ -19,6 +19,26 @@
  * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
  * SOFTWARE.
  */
+/**
+ * Derives a display {@link MessageSeverity} from a canonical
+ * {@link @fgv/ts-utils#MessageLogLevel | log level}, used when a message carries no explicit
+ * `severity` styling override. `'success'` is never derived — it is a UI-only affordance.
+ * @param level - The canonical log level.
+ * @returns The styling severity to use for display.
+ * @public
+ */
+export function deriveSeverityFromLevel(level) {
+    switch (level) {
+        case 'warning':
+            return 'warning';
+        case 'error':
+            return 'error';
+        case 'quiet':
+        case 'detail':
+        case 'info':
+            return 'info';
+    }
+}
 /**
  * Default toast configuration by severity.
  * @public
@@ -41,16 +61,23 @@ export function generateMessageId() {
     return `msg-${++_nextId}-${Date.now().toString(36)}`;
 }
 /**
- * Creates a new message.
+ * Creates a new message at the given canonical {@link @fgv/ts-utils#MessageLogLevel | log level}.
+ * The level drives filtering; pass `options.severity` only to override display styling
+ * (e.g. `'success'`).
+ * @param level - The canonical log level (filter axis).
+ * @param text - The message text.
+ * @param options - Optional styling severity and action.
+ * @returns The created message.
  * @public
  */
-export function createMessage(severity, text, action) {
+export function createMessage(level, text, options) {
     return {
         id: generateMessageId(),
-        severity,
+        level,
+        severity: options === null || options === void 0 ? void 0 : options.severity,
         text,
         timestamp: Date.now(),
-        action
+        action: options === null || options === void 0 ? void 0 : options.action
     };
 }
 //# sourceMappingURL=model.js.map

package/dist/packlets/messages/model.js.map

@@ -1 +1 @@
-{"version":3,"file":"model.js","sourceRoot":"","sources":["../../../src/packlets/messages/model.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;GAoBG;AA8DH;;;GAGG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAA0C;IACzE,IAAI,EAAE,EAAE,aAAa,EAAE,IAAI,EAAE;IAC7B,OAAO,EAAE,EAAE,aAAa,EAAE,IAAI,EAAE;IAChC,OAAO,EAAE,EAAE,aAAa,EAAE,IAAI,EAAE;IAChC,KAAK,EAAE,EAAE,aAAa,EAAE,CAAC,EAAE;CACnB,CAAC;AAEX,+EAA+E;AAC/E,UAAU;AACV,+EAA+E;AAE/E,IAAI,OAAO,GAAW,CAAC,CAAC;AAExB;;;GAGG;AACH,MAAM,UAAU,iBAAiB;IAC/B,OAAO,OAAO,EAAE,OAAO,IAAI,IAAI,CAAC,GAAG,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,EAAE,CAAC;AACvD,CAAC;AAED;;;GAGG;AACH,MAAM,UAAU,aAAa,CAAC,QAAyB,EAAE,IAAY,EAAE,MAAuB;IAC5F,OAAO;QACL,EAAE,EAAE,iBAAiB,EAAE;QACvB,QAAQ;QACR,IAAI;QACJ,SAAS,EAAE,IAAI,CAAC,GAAG,EAAE;QACrB,MAAM;KACP,CAAC;AACJ,CAAC","sourcesContent":["/*\n * Copyright (c) 2026 Erik Fortune\n *\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n *\n * The above copyright notice and this permission notice shall be included in all\n * copies or substantial portions of the Software.\n *\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\n * SOFTWARE.\n */\n\n/**\n * Message model types for the observability system.\n * @packageDocumentation\n */\n\n// ============================================================================\n// Message Severity\n// ============================================================================\n\n/**\n * Severity levels for messages.\n * @public\n */\nexport type MessageSeverity = 'info' | 'success' | 'warning' | 'error';\n\n// ============================================================================\n// Message\n// ============================================================================\n\n/**\n * A single message in the observability stream.\n * @public\n */\nexport interface IMessage {\n  /** Unique message ID */\n  readonly id: string;\n  /** Message severity */\n  readonly severity: MessageSeverity;\n  /** Message text */\n  readonly text: string;\n  /** Timestamp (ms since epoch) */\n  readonly timestamp: number;\n  /** Optional action (e.g., a link or callback) */\n  readonly action?: IMessageAction;\n}\n\n/**\n * An actionable element attached to a message (e.g., \"Go to Session\" link).\n * @public\n */\nexport interface IMessageAction {\n  /** Action label */\n  readonly label: string;\n  /** Callback when the action is triggered */\n  readonly onAction: () => void;\n}\n\n// ============================================================================\n// Toast Configuration\n// ============================================================================\n\n/**\n * Configuration for toast auto-dismiss behavior.\n * @public\n */\nexport interface IToastConfig {\n  /** Auto-dismiss duration in ms. 0 = no auto-dismiss. */\n  readonly autoDismissMs: number;\n}\n\n/**\n * Default toast configuration by severity.\n * @public\n */\nexport const DEFAULT_TOAST_CONFIG: Record<MessageSeverity, IToastConfig> = {\n  info: { autoDismissMs: 3000 },\n  success: { autoDismissMs: 3000 },\n  warning: { autoDismissMs: 5000 },\n  error: { autoDismissMs: 0 }\n} as const;\n\n// ============================================================================\n// Helpers\n// ============================================================================\n\nlet _nextId: number = 0;\n\n/**\n * Generates a unique message ID.\n * @internal\n */\nexport function generateMessageId(): string {\n  return `msg-${++_nextId}-${Date.now().toString(36)}`;\n}\n\n/**\n * Creates a new message.\n * @public\n */\nexport function createMessage(severity: MessageSeverity, text: string, action?: IMessageAction): IMessage {\n  return {\n    id: generateMessageId(),\n    severity,\n    text,\n    timestamp: Date.now(),\n    action\n  };\n}\n"]}
+{"version":3,"file":"model.js","sourceRoot":"","sources":["../../../src/packlets/messages/model.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;GAoBG;AAuBH;;;;;;;GAOG;AACH,MAAM,UAAU,uBAAuB,CAAC,KAAsB;IAC5D,QAAQ,KAAK,EAAE,CAAC;QACd,KAAK,SAAS;YACZ,OAAO,SAAS,CAAC;QACnB,KAAK,OAAO;YACV,OAAO,OAAO,CAAC;QACjB,KAAK,OAAO,CAAC;QACb,KAAK,QAAQ,CAAC;QACd,KAAK,MAAM;YACT,OAAO,MAAM,CAAC;IAClB,CAAC;AACH,CAAC;AAwDD;;;GAGG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAA0C;IACzE,IAAI,EAAE,EAAE,aAAa,EAAE,IAAI,EAAE;IAC7B,OAAO,EAAE,EAAE,aAAa,EAAE,IAAI,EAAE;IAChC,OAAO,EAAE,EAAE,aAAa,EAAE,IAAI,EAAE;IAChC,KAAK,EAAE,EAAE,aAAa,EAAE,CAAC,EAAE;CACnB,CAAC;AAEX,+EAA+E;AAC/E,UAAU;AACV,+EAA+E;AAE/E,IAAI,OAAO,GAAW,CAAC,CAAC;AAExB;;;GAGG;AACH,MAAM,UAAU,iBAAiB;IAC/B,OAAO,OAAO,EAAE,OAAO,IAAI,IAAI,CAAC,GAAG,EAAE,CAAC,QAAQ,CAAC,EAAE,CAAC,EAAE,CAAC;AACvD,CAAC;AAgBD;;;;;;;;;GASG;AACH,MAAM,UAAU,aAAa,CAC3B,KAAsB,EACtB,IAAY,EACZ,OAA+B;IAE/B,OAAO;QACL,EAAE,EAAE,iBAAiB,EAAE;QACvB,KAAK;QACL,QAAQ,EAAE,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,QAAQ;QAC3B,IAAI;QACJ,SAAS,EAAE,IAAI,CAAC,GAAG,EAAE;QACrB,MAAM,EAAE,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,MAAM;KACxB,CAAC;AACJ,CAAC","sourcesContent":["/*\n * Copyright (c) 2026 Erik Fortune\n *\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n *\n * The above copyright notice and this permission notice shall be included in all\n * copies or substantial portions of the Software.\n *\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\n * SOFTWARE.\n */\n\n/**\n * Message model types for the observability system.\n * @packageDocumentation\n */\n\nimport { type MessageLogLevel } from '@fgv/ts-utils';\n\n// ============================================================================\n// Message Severity\n// ============================================================================\n\n/**\n * Display styling levels for messages — drives color, icon, and toast behavior.\n *\n * This is the styling axis, orthogonal to the {@link @fgv/ts-utils#MessageLogLevel | log level}\n * filter axis on {@link IMessage.level}. `'success'` lives here (a UI affordance with no\n * log-level analog) and is only ever set explicitly — never derived from a logger bridge.\n * @public\n */\nexport type MessageSeverity = 'info' | 'success' | 'warning' | 'error';\n\n/**\n * Derives a display {@link MessageSeverity} from a canonical\n * {@link @fgv/ts-utils#MessageLogLevel | log level}, used when a message carries no explicit\n * `severity` styling override. `'success'` is never derived — it is a UI-only affordance.\n * @param level - The canonical log level.\n * @returns The styling severity to use for display.\n * @public\n */\nexport function deriveSeverityFromLevel(level: MessageLogLevel): MessageSeverity {\n  switch (level) {\n    case 'warning':\n      return 'warning';\n    case 'error':\n      return 'error';\n    case 'quiet':\n    case 'detail':\n    case 'info':\n      return 'info';\n  }\n}\n\n// ============================================================================\n// Message\n// ============================================================================\n\n/**\n * A single message in the observability stream.\n * @public\n */\nexport interface IMessage {\n  /** Unique message ID */\n  readonly id: string;\n  /**\n   * Canonical {@link @fgv/ts-utils#MessageLogLevel | log level} — drives FILTERING.\n   * Set losslessly from a ts-utils logger when a message originates from the logger bridge.\n   */\n  readonly level: MessageLogLevel;\n  /**\n   * Display styling override (color / icon / toast). Optional; when absent, styling is\n   * derived from {@link IMessage.level} via {@link deriveSeverityFromLevel}. `'success'`\n   * lives here — set explicitly for UI-originated messages, never from a logger bridge.\n   */\n  readonly severity?: MessageSeverity;\n  /** Message text */\n  readonly text: string;\n  /** Timestamp (ms since epoch) */\n  readonly timestamp: number;\n  /** Optional action (e.g., a link or callback) */\n  readonly action?: IMessageAction;\n}\n\n/**\n * An actionable element attached to a message (e.g., \"Go to Session\" link).\n * @public\n */\nexport interface IMessageAction {\n  /** Action label */\n  readonly label: string;\n  /** Callback when the action is triggered */\n  readonly onAction: () => void;\n}\n\n// ============================================================================\n// Toast Configuration\n// ============================================================================\n\n/**\n * Configuration for toast auto-dismiss behavior.\n * @public\n */\nexport interface IToastConfig {\n  /** Auto-dismiss duration in ms. 0 = no auto-dismiss. */\n  readonly autoDismissMs: number;\n}\n\n/**\n * Default toast configuration by severity.\n * @public\n */\nexport const DEFAULT_TOAST_CONFIG: Record<MessageSeverity, IToastConfig> = {\n  info: { autoDismissMs: 3000 },\n  success: { autoDismissMs: 3000 },\n  warning: { autoDismissMs: 5000 },\n  error: { autoDismissMs: 0 }\n} as const;\n\n// ============================================================================\n// Helpers\n// ============================================================================\n\nlet _nextId: number = 0;\n\n/**\n * Generates a unique message ID.\n * @internal\n */\nexport function generateMessageId(): string {\n  return `msg-${++_nextId}-${Date.now().toString(36)}`;\n}\n\n/**\n * Options for {@link createMessage} (and `addMessage`).\n * @public\n */\nexport interface ICreateMessageOptions {\n  /**\n   * Explicit display styling override. Omit to derive styling from the level via\n   * {@link deriveSeverityFromLevel}. Set to `'success'` for UI-originated success messages.\n   */\n  readonly severity?: MessageSeverity;\n  /** Optional action (e.g., a link or callback). */\n  readonly action?: IMessageAction;\n}\n\n/**\n * Creates a new message at the given canonical {@link @fgv/ts-utils#MessageLogLevel | log level}.\n * The level drives filtering; pass `options.severity` only to override display styling\n * (e.g. `'success'`).\n * @param level - The canonical log level (filter axis).\n * @param text - The message text.\n * @param options - Optional styling severity and action.\n * @returns The created message.\n * @public\n */\nexport function createMessage(\n  level: MessageLogLevel,\n  text: string,\n  options?: ICreateMessageOptions\n): IMessage {\n  return {\n    id: generateMessageId(),\n    level,\n    severity: options?.severity,\n    text,\n    timestamp: Date.now(),\n    action: options?.action\n  };\n}\n"]}

package/lib/packlets/messages/MessagesContext.d.ts

@@ -1,5 +1,6 @@
 import React from 'react';
-import { IMessage, IMessageAction, MessageSeverity } from './model';
+import { type MessageLogLevel } from '@fgv/ts-utils';
+import { ICreateMessageOptions, IMessage } from './model';
 /**
  * Value provided by the MessagesContext.
  * @public
@@ -7,8 +8,11 @@ import { IMessage, IMessageAction, MessageSeverity } from './model';
 export interface IMessagesContextValue {
     /** All messages in the stream (newest last) */
     readonly messages: ReadonlyArray<IMessage>;
-    /** Add a message to the stream */
-    readonly addMessage: (severity: MessageSeverity, text: string, action?: IMessageAction) => IMessage;
+    /**
+     * Add a message to the stream. The `level` drives filtering; pass `options.severity`
+     * only to override display styling (e.g. `'success'`).
+     */
+    readonly addMessage: (level: MessageLogLevel, text: string, options?: ICreateMessageOptions) => IMessage;
     /** Dismiss a specific message (removes from toast display, keeps in log) */
     readonly dismissMessage: (id: string) => void;
     /** Clear all messages */

package/lib/packlets/messages/MessagesContext.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MessagesContext.d.ts","sourceRoot":"","sources":["../../../src/packlets/messages/MessagesContext.tsx"],"names":[],"mappings":"AAsBA,OAAO,KAAqD,MAAM,OAAO,CAAC;AAE1E,OAAO,EAAiB,QAAQ,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAMnF;;;GAGG;AACH,MAAM,WAAW,qBAAqB;IACpC,+CAA+C;IAC/C,QAAQ,CAAC,QAAQ,EAAE,aAAa,CAAC,QAAQ,CAAC,CAAC;IAC3C,kCAAkC;IAClC,QAAQ,CAAC,UAAU,EAAE,CAAC,QAAQ,EAAE,eAAe,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,cAAc,KAAK,QAAQ,CAAC;IACpG,4EAA4E;IAC5E,QAAQ,CAAC,cAAc,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9C,yBAAyB;IACzB,QAAQ,CAAC,aAAa,EAAE,MAAM,IAAI,CAAC;IACnC,+DAA+D;IAC/D,QAAQ,CAAC,YAAY,EAAE,aAAa,CAAC,QAAQ,CAAC,CAAC;CAChD;AAcD;;;GAGG;AACH,MAAM,WAAW,sBAAsB;IACrC,sDAAsD;IACtD,QAAQ,CAAC,WAAW,CAAC,EAAE,MAAM,CAAC;IAC9B,eAAe;IACf,QAAQ,CAAC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CACpC;AAED;;;GAGG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,sBAAsB,GAAG,KAAK,CAAC,YAAY,CA2ClF;AAMD;;;;GAIG;AACH,wBAAgB,WAAW,IAAI,qBAAqB,CAMnD"}
+{"version":3,"file":"MessagesContext.d.ts","sourceRoot":"","sources":["../../../src/packlets/messages/MessagesContext.tsx"],"names":[],"mappings":"AAsBA,OAAO,KAAqD,MAAM,OAAO,CAAC;AAE1E,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,eAAe,CAAC;AAErD,OAAO,EAAiB,qBAAqB,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAMzE;;;GAGG;AACH,MAAM,WAAW,qBAAqB;IACpC,+CAA+C;IAC/C,QAAQ,CAAC,QAAQ,EAAE,aAAa,CAAC,QAAQ,CAAC,CAAC;IAC3C;;;OAGG;IACH,QAAQ,CAAC,UAAU,EAAE,CAAC,KAAK,EAAE,eAAe,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,qBAAqB,KAAK,QAAQ,CAAC;IACzG,4EAA4E;IAC5E,QAAQ,CAAC,cAAc,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9C,yBAAyB;IACzB,QAAQ,CAAC,aAAa,EAAE,MAAM,IAAI,CAAC;IACnC,+DAA+D;IAC/D,QAAQ,CAAC,YAAY,EAAE,aAAa,CAAC,QAAQ,CAAC,CAAC;CAChD;AAcD;;;GAGG;AACH,MAAM,WAAW,sBAAsB;IACrC,sDAAsD;IACtD,QAAQ,CAAC,WAAW,CAAC,EAAE,MAAM,CAAC;IAC9B,eAAe;IACf,QAAQ,CAAC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CACpC;AAED;;;GAGG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,sBAAsB,GAAG,KAAK,CAAC,YAAY,CA2ClF;AAMD;;;;GAIG;AACH,wBAAgB,WAAW,IAAI,qBAAqB,CAMnD"}