@admin-layout/tailwind-ui 12.2.4-alpha.1 → 12.2.4-alpha.103

package/lib/components/ErrorPages/403.d.ts

@@ -1,3 +1,2 @@
-import * as React from 'react';
-export declare const Error403: () => React.JSX.Element;
+export declare const Error403: () => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=403.d.ts.map

package/lib/components/ErrorPages/403.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"403.d.ts","sourceRoot":"","sources":["../../../src/components/ErrorPages/403.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,eAAO,MAAM,QAAQ,yBAuBpB,CAAC"}
+{"version":3,"file":"403.d.ts","sourceRoot":"","sources":["../../../src/components/ErrorPages/403.tsx"],"names":[],"mappings":"AAKA,eAAO,MAAM,QAAQ,+CAwBpB,CAAC"}

package/lib/components/ErrorPages/403.js

@@ -1,21 +1,30 @@
-import*as React from'react';import {useNavigate}from'@remix-run/react';import assets from'@admin-layout/assets';const Error403 = () => {
+import {jsx,jsxs}from'react/jsx-runtime';import {useNavigate}from'@remix-run/react';import {useErrorAsset}from'./useErrorAsset.js';const Error403 = () => {
   const navigate = useNavigate();
   const goBack = () => navigate(-1);
-  return React.createElement("div", {
-    className: "flex justify-center items-center"
-  }, React.createElement("div", null, React.createElement("div", {
-    className: "text-center"
-  }, React.createElement("h5", {
-    className: "text-2xl font-bold"
-  }, "Error: 403 Forbidden")), React.createElement("div", {
-    className: "mt-10"
-  }, React.createElement("img", {
-    src: assets['error-403-540x432.png'],
-    alt: "403 Error"
-  })), React.createElement("div", {
-    className: "flex justify-center"
-  }, React.createElement("button", {
-    className: "mt-8 mb-8 w-64 h-20 bg-yellow-400 rounded-full text-white hover:bg-yellow-500 transition-colors",
-    onClick: goBack
-  }, "Go Home"))));
+  const imgSrc = useErrorAsset('error-403-540x432.png');
+  return jsx("div", {
+    className: "flex justify-center items-center",
+    children: jsxs("div", {
+      children: [jsx("div", {
+        className: "text-center",
+        children: jsx("h5", {
+          className: "text-2xl font-bold",
+          children: "Error: 403 Forbidden"
+        })
+      }), jsx("div", {
+        className: "mt-10",
+        children: jsx("img", {
+          src: imgSrc,
+          alt: "403 Error"
+        })
+      }), jsx("div", {
+        className: "flex justify-center",
+        children: jsx("button", {
+          className: "mt-8 mb-8 w-64 h-20 bg-yellow-400 rounded-full text-white hover:bg-yellow-500 transition-colors",
+          onClick: goBack,
+          children: "Go Home"
+        })
+      })]
+    })
+  });
 };export{Error403};//# sourceMappingURL=403.js.map

package/lib/components/ErrorPages/403.js.map

@@ -1 +1 @@
-{"version":3,"file":"403.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"403.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/lib/components/ErrorPages/404.d.ts

@@ -1,3 +1,2 @@
-import * as React from 'react';
-export declare const Error404: () => React.JSX.Element;
+export declare const Error404: () => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=404.d.ts.map

package/lib/components/ErrorPages/404.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"404.d.ts","sourceRoot":"","sources":["../../../src/components/ErrorPages/404.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,eAAO,MAAM,QAAQ,yBAuBpB,CAAC"}
+{"version":3,"file":"404.d.ts","sourceRoot":"","sources":["../../../src/components/ErrorPages/404.tsx"],"names":[],"mappings":"AAKA,eAAO,MAAM,QAAQ,+CAwBpB,CAAC"}

package/lib/components/ErrorPages/404.js

@@ -1,21 +1,30 @@
-import*as React from'react';import {useNavigate}from'@remix-run/react';import assets from'@admin-layout/assets';const Error404 = () => {
+import {jsx,jsxs}from'react/jsx-runtime';import {useNavigate}from'@remix-run/react';import {useErrorAsset}from'./useErrorAsset.js';const Error404 = () => {
   const navigate = useNavigate();
   const goBack = () => navigate(-1);
-  return React.createElement("div", {
-    className: "flex justify-center items-center"
-  }, React.createElement("div", null, React.createElement("div", {
-    className: "text-center"
-  }, React.createElement("h5", {
-    className: "text-2xl font-bold"
-  }, "Error: 404 Page Not Found")), React.createElement("div", {
-    className: "mt-10"
-  }, React.createElement("img", {
-    src: assets['error-404-540x432.png'],
-    alt: "404 Error"
-  })), React.createElement("div", {
-    className: "flex justify-center"
-  }, React.createElement("button", {
-    className: "mt-8 mb-8 w-64 h-20 bg-yellow-400 rounded-full text-white hover:bg-yellow-500 transition-colors",
-    onClick: goBack
-  }, "Go Home"))));
+  const imgSrc = useErrorAsset('error-404-540x432.png');
+  return jsx("div", {
+    className: "flex justify-center items-center",
+    children: jsxs("div", {
+      children: [jsx("div", {
+        className: "text-center",
+        children: jsx("h5", {
+          className: "text-2xl font-bold",
+          children: "Error: 404 Page Not Found"
+        })
+      }), jsx("div", {
+        className: "mt-10",
+        children: jsx("img", {
+          src: imgSrc,
+          alt: "404 Error"
+        })
+      }), jsx("div", {
+        className: "flex justify-center",
+        children: jsx("button", {
+          className: "mt-8 mb-8 w-64 h-20 bg-yellow-400 rounded-full text-white hover:bg-yellow-500 transition-colors",
+          onClick: goBack,
+          children: "Go Home"
+        })
+      })]
+    })
+  });
 };export{Error404};//# sourceMappingURL=404.js.map

package/lib/components/ErrorPages/404.js.map

@@ -1 +1 @@
-{"version":3,"file":"404.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"404.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/lib/components/ErrorPages/500.d.ts

@@ -1,3 +1,2 @@
-import * as React from 'react';
-export declare const Error500: () => React.JSX.Element;
+export declare const Error500: () => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=500.d.ts.map

package/lib/components/ErrorPages/500.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"500.d.ts","sourceRoot":"","sources":["../../../src/components/ErrorPages/500.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,eAAO,MAAM,QAAQ,yBAuBpB,CAAC"}
+{"version":3,"file":"500.d.ts","sourceRoot":"","sources":["../../../src/components/ErrorPages/500.tsx"],"names":[],"mappings":"AAKA,eAAO,MAAM,QAAQ,+CAwBpB,CAAC"}

package/lib/components/ErrorPages/500.js

@@ -1,21 +1,30 @@
-import*as React from'react';import {useNavigate}from'@remix-run/react';import assets from'@admin-layout/assets';const Error500 = () => {
+import {jsx,jsxs}from'react/jsx-runtime';import {useNavigate}from'@remix-run/react';import {useErrorAsset}from'./useErrorAsset.js';const Error500 = () => {
   const navigate = useNavigate();
   const goBack = () => navigate(-1);
-  return React.createElement("div", {
-    className: "flex justify-center items-center"
-  }, React.createElement("div", null, React.createElement("div", {
-    className: "text-center"
-  }, React.createElement("h5", {
-    className: "text-2xl font-bold"
-  }, "Error: 500 Unexpected Error")), React.createElement("div", {
-    className: "mt-10"
-  }, React.createElement("img", {
-    src: assets['error-500-252x475.png'],
-    alt: "500 Error"
-  })), React.createElement("div", {
-    className: "flex justify-center"
-  }, React.createElement("button", {
-    className: "mt-8 mb-8 w-64 h-20 bg-yellow-400 rounded-full text-white hover:bg-yellow-500 transition-colors",
-    onClick: goBack
-  }, "Go Home"))));
+  const imgSrc = useErrorAsset('error-500-252x475.png');
+  return jsx("div", {
+    className: "flex justify-center items-center",
+    children: jsxs("div", {
+      children: [jsx("div", {
+        className: "text-center",
+        children: jsx("h5", {
+          className: "text-2xl font-bold",
+          children: "Error: 500 Unexpected Error"
+        })
+      }), jsx("div", {
+        className: "mt-10",
+        children: jsx("img", {
+          src: imgSrc,
+          alt: "500 Error"
+        })
+      }), jsx("div", {
+        className: "flex justify-center",
+        children: jsx("button", {
+          className: "mt-8 mb-8 w-64 h-20 bg-yellow-400 rounded-full text-white hover:bg-yellow-500 transition-colors",
+          onClick: goBack,
+          children: "Go Home"
+        })
+      })]
+    })
+  });
 };export{Error500};//# sourceMappingURL=500.js.map

package/lib/components/ErrorPages/500.js.map

@@ -1 +1 @@
-{"version":3,"file":"500.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"500.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/lib/components/ErrorPages/useErrorAsset.d.ts

@@ -0,0 +1,11 @@
+/**
+ * The `@admin-layout/assets` barrel bakes EVERY image in as a base64 data URI
+ * (~335 KB of JS, ~233 KB gzipped - login backgrounds, logos, error
+ * illustrations). A static `import assets from '@admin-layout/assets'` here
+ * dragged that whole blob into the initial bundle of every app that imports
+ * anything from the tailwind-ui barrel - to show images that only render on
+ * ERROR pages. Load the map on demand instead: the blob becomes one async
+ * chunk fetched the first time an error page actually renders.
+ */
+export declare function useErrorAsset(key: string): string | undefined;
+//# sourceMappingURL=useErrorAsset.d.ts.map

package/lib/components/ErrorPages/useErrorAsset.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useErrorAsset.d.ts","sourceRoot":"","sources":["../../../src/components/ErrorPages/useErrorAsset.ts"],"names":[],"mappings":"AAEA;;;;;;;;GAQG;AACH,wBAAgB,aAAa,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAgB7D"}

package/lib/components/ErrorPages/useErrorAsset.js

@@ -0,0 +1,24 @@
+import {useState,useEffect}from'react';/**
+ * The `@admin-layout/assets` barrel bakes EVERY image in as a base64 data URI
+ * (~335 KB of JS, ~233 KB gzipped - login backgrounds, logos, error
+ * illustrations). A static `import assets from '@admin-layout/assets'` here
+ * dragged that whole blob into the initial bundle of every app that imports
+ * anything from the tailwind-ui barrel - to show images that only render on
+ * ERROR pages. Load the map on demand instead: the blob becomes one async
+ * chunk fetched the first time an error page actually renders.
+ */
+function useErrorAsset(key) {
+  const [src, setSrc] = useState(undefined);
+  useEffect(() => {
+    let cancelled = false;
+    import('@admin-layout/assets').then(mod => {
+      if (!cancelled) setSrc(mod.default[key]);
+    }).catch(() => {
+      /* image is decorative - the error text already rendered */
+    });
+    return () => {
+      cancelled = true;
+    };
+  }, [key]);
+  return src;
+}export{useErrorAsset};//# sourceMappingURL=useErrorAsset.js.map

package/lib/components/ErrorPages/useErrorAsset.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useErrorAsset.js","sources":["../../../src/components/ErrorPages/useErrorAsset.ts"],"sourcesContent":[null],"names":[],"mappings":";;;;;;;AAUG;AACH;;;;;;;;;;;;;;;"}

package/lib/components/Inbox/Channels/ChannelBar.d.ts

@@ -0,0 +1,33 @@
+import React from 'react';
+import { type ChannelMeta } from './channelsMeta';
+import { type PairingTokenResult } from './ChannelConnectModal';
+export interface ChannelBarProps {
+    /** Override the default channel list (Telegram/Discord/Slack/WhatsApp/Teams) */
+    channels?: ChannelMeta[];
+    /** Ids of currently connected channels (controlled) */
+    connectedChannelIds?: string[];
+    /** Called when a disconnected channel is clicked. If onConnect returns a PairingTokenResult
+     *  (or a Promise that resolves to one), the modal switches to pairing mode and displays the
+     *  QR + deep-link. Return void to render the token-entry / placeholder modal. */
+    onConnect?: (channel: ChannelMeta) => void | PairingTokenResult | Promise<void | PairingTokenResult>;
+    /** Called when the modal submits a token (non-pairing flow). */
+    onSubmitToken?: (channel: ChannelMeta, token: string) => void | Promise<void>;
+    /** Called when a connected channel is clicked. */
+    onDisconnect?: (channel: ChannelMeta) => void | Promise<void>;
+    /** Called when the modal is closed (cancel/X/backdrop). */
+    onModalClose?: (channel: ChannelMeta) => void;
+    /** External loading flag for the modal (e.g. while a parent gateway call is in flight) */
+    loading?: boolean;
+    /** External error string for the modal */
+    error?: string;
+    /** When supplied while modal is open, modal renders in pairing mode (QR + deep link). */
+    pairing?: PairingTokenResult;
+    className?: string;
+}
+declare function ChannelBar({ channels, connectedChannelIds, onConnect, onSubmitToken, onDisconnect, onModalClose, loading, error, pairing, className, }: ChannelBarProps): import("react/jsx-runtime").JSX.Element;
+declare namespace ChannelBar {
+    var displayName: string;
+}
+declare const _default: React.MemoExoticComponent<typeof ChannelBar>;
+export default _default;
+//# sourceMappingURL=ChannelBar.d.ts.map

package/lib/components/Inbox/Channels/ChannelBar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChannelBar.d.ts","sourceRoot":"","sources":["../../../../src/components/Inbox/Channels/ChannelBar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAyC,MAAM,OAAO,CAAC;AAC9D,OAAO,EAAY,KAAK,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC5D,OAA4B,EAAE,KAAK,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAIrF,MAAM,WAAW,eAAe;IAC5B,gFAAgF;IAChF,QAAQ,CAAC,EAAE,WAAW,EAAE,CAAC;IACzB,uDAAuD;IACvD,mBAAmB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC/B;;qFAEiF;IACjF,SAAS,CAAC,EAAE,CAAC,OAAO,EAAE,WAAW,KAAK,IAAI,GAAG,kBAAkB,GAAG,OAAO,CAAC,IAAI,GAAG,kBAAkB,CAAC,CAAC;IACrG,gEAAgE;IAChE,aAAa,CAAC,EAAE,CAAC,OAAO,EAAE,WAAW,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAC9E,kDAAkD;IAClD,YAAY,CAAC,EAAE,CAAC,OAAO,EAAE,WAAW,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAC9D,2DAA2D;IAC3D,YAAY,CAAC,EAAE,CAAC,OAAO,EAAE,WAAW,KAAK,IAAI,CAAC;IAC9C,0FAA0F;IAC1F,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,0CAA0C;IAC1C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,yFAAyF;IACzF,OAAO,CAAC,EAAE,kBAAkB,CAAC;IAC7B,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB;AAID,iBAAS,UAAU,CAAC,EAChB,QAAmB,EACnB,mBAAmB,EACnB,SAAS,EACT,aAAa,EACb,YAAY,EACZ,YAAY,EACZ,OAAO,EACP,KAAK,EACL,OAAO,EACP,SAAS,GACZ,EAAE,eAAe,2CA8FjB;kBAzGQ,UAAU;;;;AA6GnB,wBAAsC"}

package/lib/components/Inbox/Channels/ChannelBar.js

@@ -0,0 +1,79 @@
+import {jsxs,Fragment,jsx}from'react/jsx-runtime';import React__default,{useState,useMemo,useCallback}from'react';import {CHANNELS}from'./channelsMeta.js';import ChannelConnectModal from'./ChannelConnectModal.js';// main component
+function ChannelBar({
+  channels = CHANNELS,
+  connectedChannelIds,
+  onConnect,
+  onSubmitToken,
+  onDisconnect,
+  onModalClose,
+  loading,
+  error,
+  pairing,
+  className
+}) {
+  const [selected, setSelected] = useState(null);
+  const [internalPairing, setInternalPairing] = useState(null);
+  const [internalLoading, setInternalLoading] = useState(false);
+  const connectedSet = useMemo(() => new Set(connectedChannelIds ?? []), [connectedChannelIds]);
+  const handleClose = useCallback(() => {
+    const ch = selected;
+    setSelected(null);
+    setInternalPairing(null);
+    setInternalLoading(false);
+    if (ch) onModalClose?.(ch);
+  }, [selected, onModalClose]);
+  const handleClick = useCallback(async channel => {
+    if (connectedSet.has(channel.id)) {
+      await onDisconnect?.(channel);
+      return;
+    }
+    setSelected(channel);
+    setInternalPairing(null);
+    if (!onConnect) return;
+    setInternalLoading(true);
+    try {
+      const result = await onConnect(channel);
+      if (result && typeof result === 'object' && 'token' in result) {
+        setInternalPairing(result);
+      }
+    } finally {
+      setInternalLoading(false);
+    }
+  }, [connectedSet, onConnect, onDisconnect]);
+  const handleSubmitToken = useCallback(async token => {
+    if (!selected) return;
+    await onSubmitToken?.(selected, token);
+    handleClose();
+  }, [selected, onSubmitToken, handleClose]);
+  const effectivePairing = pairing ?? internalPairing ?? undefined;
+  const effectiveLoading = loading || internalLoading;
+  return jsxs(Fragment, {
+    children: [jsx("div", {
+      className: `flex items-center justify-center gap-1 mt-2 flex-wrap max-w-xs mx-auto ${className ?? ''}`,
+      children: channels.map(channel => {
+        const isConnected = connectedSet.has(channel.id);
+        return jsxs("button", {
+          type: "button",
+          onClick: () => handleClick(channel),
+          className: `relative group flex items-center justify-center w-8 h-8 rounded-lg transition-all ${isConnected ? 'text-green-600 bg-green-500/10 hover:bg-green-500/20' : 'text-gray-500 hover:text-gray-900 hover:bg-gray-100'}`,
+          title: `${channel.name}${isConnected ? ' (connected — click to disconnect)' : ''}`,
+          "aria-label": `Connect ${channel.name}`,
+          children: [channel.icon, isConnected && jsx("span", {
+            className: "absolute -bottom-0.5 -right-0.5 block w-3 h-3 rounded-full bg-green-500 ring-2 ring-white",
+            "aria-hidden": "true"
+          })]
+        }, channel.id);
+      })
+    }), selected && jsx(ChannelConnectModal, {
+      isOpen: !!selected,
+      channel: selected,
+      loading: effectiveLoading,
+      error: error,
+      pairing: effectivePairing,
+      onClose: handleClose,
+      onConnect: handleSubmitToken
+    })]
+  });
+}
+ChannelBar.displayName = 'ChannelBar';
+var ChannelBar_default = React__default.memo(ChannelBar);export{ChannelBar_default as default};//# sourceMappingURL=ChannelBar.js.map

package/lib/components/Inbox/Channels/ChannelBar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChannelBar.js","sources":["../../../../src/components/Inbox/Channels/ChannelBar.tsx"],"sourcesContent":[null],"names":[],"mappings":";AAQI,SAAA,UAAW,CAAA;UACX,GAAA,QAAA;AACA,EAAA,mBAAA;AACA,EAAA,SAAA;;AAEiF,EAAA,YAAA;AACjF,EAAA,YAAU;SACV;AACA,EAAA,KAAA;SACA;AACA,EAAA;;QAEA,CAAA,QAAa,EAAE,WAAU,CAAA,GAAA,QAAW,CAAA;QACpC,CAAA,eAAA,EAAA,kBAAA,CAAA,GAAA,QAAA,CAAA,IAAA,CAAA;QACA,CAAA,eAAkB,EAAA,kBAAA,CAAA,GAAA,QAAA,CAAA,KAAA,CAAA;QAClB,YAAA,GAAA,OAAA,CAAA,MAAA,IAAA,GAAA,CAAA,mBAA0C,IAAA,EAAA,CAAA,EAAA,CAAA,mBAAA,CAAA,CAAA;QAC1C,WAAe,GAAA,WAAA,CAAA,MAAA;IACf,MAAA,EAAA,GAAA,QAAA;IACA,WAAU,CAAA,IAAA,CAAA;IACV,kBAAkB,CAAC,IAAA,CAAA;AACtB,IAAA,kBAAA,CAAA,KAAA,CAAA;AAID,IAAA,IAAA,EAAA,EAAA,YAAS,GAAU,EAAC,CAChB;4BADe,CAAA,CAAA;;;;AA6GnB,MAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/lib/components/Inbox/Channels/ChannelConnectModal.d.ts

@@ -0,0 +1,24 @@
+import React from 'react';
+import { type ChannelMeta } from './channelsMeta';
+export interface PairingTokenResult {
+    token: string;
+    deepLink?: string;
+    expiresAt?: number;
+}
+export interface ChannelConnectModalProps {
+    isOpen: boolean;
+    channel: ChannelMeta;
+    loading?: boolean;
+    error?: string;
+    /** When present, modal renders QR + deep-link pairing UI instead of token entry. */
+    pairing?: PairingTokenResult;
+    onClose: () => void;
+    onConnect: (token: string) => Promise<void> | void;
+}
+declare function ChannelConnectModal({ isOpen, channel, loading, error, pairing, onClose, onConnect, }: ChannelConnectModalProps): import("react/jsx-runtime").JSX.Element;
+declare namespace ChannelConnectModal {
+    var displayName: string;
+}
+declare const _default: React.MemoExoticComponent<typeof ChannelConnectModal>;
+export default _default;
+//# sourceMappingURL=ChannelConnectModal.d.ts.map

package/lib/components/Inbox/Channels/ChannelConnectModal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChannelConnectModal.d.ts","sourceRoot":"","sources":["../../../../src/components/Inbox/Channels/ChannelConnectModal.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2C,MAAM,OAAO,CAAC;AAChE,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAIlD,MAAM,WAAW,kBAAkB;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,MAAM,WAAW,wBAAwB;IACrC,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,WAAW,CAAC;IACrB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,oFAAoF;IACpF,OAAO,CAAC,EAAE,kBAAkB,CAAC;IAC7B,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,SAAS,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC;CACtD;AAUD,iBAAS,mBAAmB,CAAC,EACzB,MAAM,EACN,OAAO,EACP,OAAO,EACP,KAAK,EACL,OAAO,EACP,OAAO,EACP,SAAS,GACZ,EAAE,wBAAwB,2CAuM1B;kBA/MQ,mBAAmB;;;;AAmN5B,wBAA+C"}

package/lib/components/Inbox/Channels/ChannelConnectModal.js

@@ -0,0 +1,177 @@
+import {jsx,jsxs,Fragment}from'react/jsx-runtime';import React__default,{useState,useEffect,useCallback}from'react';// helper functions
+function buildQrUrl(data) {
+  return `https://api.qrserver.com/v1/create-qr-code/?size=250x250&data=${encodeURIComponent(data)}`;
+}
+// main component
+function ChannelConnectModal({
+  isOpen,
+  channel,
+  loading,
+  error,
+  pairing,
+  onClose,
+  onConnect
+}) {
+  const [token, setToken] = useState('');
+  const [copied, setCopied] = useState(false);
+  useEffect(() => {
+    if (isOpen) {
+      setToken('');
+      setCopied(false);
+    }
+  }, [isOpen, channel.id]);
+  const handleSubmit = useCallback(e => {
+    e.preventDefault();
+    onConnect(token.trim());
+  }, [token, onConnect]);
+  const handleBackdropClick = useCallback(e => {
+    if (e.target === e.currentTarget && !loading) onClose();
+  }, [onClose, loading]);
+  const handleCopy = useCallback(() => {
+    if (!pairing?.token) return;
+    navigator.clipboard?.writeText(pairing.token).then(() => {
+      setCopied(true);
+      setTimeout(() => setCopied(false), 1500);
+    });
+  }, [pairing]);
+  if (!isOpen) return null;
+  const inPairingMode = !!pairing;
+  const tokenRequired = !inPairingMode && channel.tokenLabel.length > 0;
+  const canSubmit = tokenRequired ? token.trim().length > 0 && !loading : !loading;
+  const qrPayload = pairing ? pairing.deepLink ?? pairing.token : '';
+  return jsx("div", {
+    className: "fixed inset-0 z-50 flex items-center justify-center bg-black/40 backdrop-blur-sm px-4",
+    onClick: handleBackdropClick,
+    role: "dialog",
+    "aria-modal": "true",
+    "aria-labelledby": "channel-connect-title",
+    children: jsx("div", {
+      className: "w-full max-w-md bg-white rounded-2xl shadow-xl overflow-hidden",
+      children: jsxs("form", {
+        onSubmit: handleSubmit,
+        children: [jsxs("div", {
+          className: "px-6 py-5 border-b border-gray-100 flex items-center gap-3",
+          children: [jsx("div", {
+            className: "flex items-center justify-center w-10 h-10 rounded-lg bg-gray-50 text-gray-700",
+            children: channel.icon
+          }), jsxs("div", {
+            className: "flex-1 min-w-0",
+            children: [jsxs("h3", {
+              id: "channel-connect-title",
+              className: "text-base font-semibold text-gray-900 truncate",
+              children: ["Connect ", channel.name]
+            }), jsx("p", {
+              className: "text-xs text-gray-500 truncate",
+              children: channel.description
+            })]
+          }), jsx("button", {
+            type: "button",
+            onClick: onClose,
+            disabled: loading,
+            className: "text-gray-400 hover:text-gray-700 disabled:opacity-50",
+            "aria-label": "Close",
+            children: jsx("svg", {
+              width: 20,
+              height: 20,
+              viewBox: "0 0 24 24",
+              fill: "none",
+              stroke: "currentColor",
+              strokeWidth: 2,
+              children: jsx("path", {
+                d: "M18 6L6 18M6 6l12 12"
+              })
+            })
+          })]
+        }), jsxs("div", {
+          className: "px-6 py-5 space-y-4",
+          children: [inPairingMode ? jsxs("div", {
+            className: "flex flex-col items-center gap-3",
+            children: [jsx("div", {
+              className: "flex items-center justify-center p-3 rounded-lg bg-white border border-gray-200",
+              children: jsx("img", {
+                src: buildQrUrl(qrPayload),
+                alt: `QR code to pair ${channel.name}`,
+                width: 200,
+                height: 200,
+                className: "block"
+              })
+            }), pairing?.deepLink && jsxs("a", {
+              href: pairing.deepLink,
+              target: "_blank",
+              rel: "noopener noreferrer",
+              className: "inline-flex items-center gap-1 px-3 py-1.5 text-sm rounded-lg bg-blue-600 text-white hover:bg-blue-700",
+              children: ["Open ", channel.name]
+            }), pairing?.token && jsx("button", {
+              type: "button",
+              onClick: handleCopy,
+              className: "text-xs text-gray-600 hover:text-gray-900 underline",
+              children: copied ? 'Copied!' : 'Copy pairing token'
+            }), jsxs("div", {
+              className: "flex items-center gap-2 text-xs text-gray-500",
+              children: [jsx("svg", {
+                className: "animate-spin",
+                width: 14,
+                height: 14,
+                viewBox: "0 0 24 24",
+                fill: "none",
+                stroke: "currentColor",
+                strokeWidth: 2,
+                children: jsx("path", {
+                  d: "M12 2v4M12 18v4M4.93 4.93l2.83 2.83M16.24 16.24l2.83 2.83M2 12h4M18 12h4M4.93 19.07l2.83-2.83M16.24 7.76l2.83-2.83"
+                })
+              }), "Waiting for pairing\u2026"]
+            })]
+          }) : tokenRequired ? jsxs("div", {
+            children: [jsx("label", {
+              htmlFor: "channel-token-input",
+              className: "block text-sm font-medium text-gray-700 mb-1.5",
+              children: channel.tokenLabel
+            }), jsx("input", {
+              id: "channel-token-input",
+              type: "text",
+              autoComplete: "off",
+              spellCheck: false,
+              value: token,
+              onChange: e => setToken(e.target.value),
+              placeholder: channel.tokenPlaceholder,
+              disabled: loading,
+              className: "w-full px-3 py-2 text-sm rounded-lg border border-gray-300 focus:outline-none focus:ring-2 focus:ring-blue-500/40 focus:border-blue-500 disabled:bg-gray-50"
+            })]
+          }) : jsx("div", {
+            className: "flex items-center justify-center h-32 rounded-lg border border-dashed border-gray-300 bg-gray-50 text-xs text-gray-500",
+            children: loading ? 'Generating pairing token…' : 'Click Connect to start pairing.'
+          }), jsxs("p", {
+            className: "text-xs text-gray-500 leading-relaxed whitespace-pre-line",
+            children: [channel.tokenHelp, channel.docsLink && jsxs(Fragment, {
+              children: [' ', jsx("a", {
+                href: channel.docsLink,
+                target: "_blank",
+                rel: "noopener noreferrer",
+                className: "text-blue-600 hover:underline",
+                children: "Learn more"
+              })]
+            })]
+          }), error && jsx("div", {
+            className: "text-xs text-red-600 bg-red-50 border border-red-200 rounded-lg px-3 py-2",
+            children: error
+          })]
+        }), jsxs("div", {
+          className: "px-6 py-4 bg-gray-50 flex items-center justify-end gap-2",
+          children: [jsx("button", {
+            type: "button",
+            onClick: onClose,
+            className: "px-4 py-2 text-sm rounded-lg text-gray-700 hover:bg-gray-200",
+            children: inPairingMode ? 'Close' : 'Cancel'
+          }), !inPairingMode && jsx("button", {
+            type: "submit",
+            disabled: !canSubmit,
+            className: "px-4 py-2 text-sm rounded-lg bg-blue-600 text-white hover:bg-blue-700 disabled:opacity-50 disabled:cursor-not-allowed",
+            children: loading ? 'Connecting…' : 'Connect'
+          })]
+        })]
+      })
+    })
+  });
+}
+ChannelConnectModal.displayName = 'ChannelConnectModal';
+var ChannelConnectModal$1 = React__default.memo(ChannelConnectModal);export{ChannelConnectModal$1 as default};//# sourceMappingURL=ChannelConnectModal.js.map

package/lib/components/Inbox/Channels/ChannelConnectModal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChannelConnectModal.js","sources":["../../../../src/components/Inbox/Channels/ChannelConnectModal.tsx"],"sourcesContent":[null],"names":[],"mappings":"oHAKA;SACS,UAAS,CAAA,IAAA,EAAA;SACd,CAAA,8DAAkB,EAAA,kBAAA,CAAA,IAAA,CAAA,CAAA,CAAA;;AAErB;AAED,4BAAiB,CAAA;QACb;SACA;SACA;OACA;SACA;SACA;;AAEA,CAAA,EAAA;AACH,EAAA,MAAA,CAAA,KAAA,EAAA,QAAA,CAAA,GAAA,QAAA,CAAA,EAAA,CAAA;AAUD,EAAA,MAAA,CAAA,MAAA,EAAS,qBAAoB,CACzB,MAAM;kBADD;;;;AAmNT,IAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/lib/components/Inbox/Channels/channelsMeta.d.ts

@@ -0,0 +1,16 @@
+import { type ReactNode } from 'react';
+export interface ChannelMeta {
+    id: string;
+    name: string;
+    description: string;
+    icon: ReactNode;
+    /** Backend channel-type identifier consumers can map to their own gateway (e.g. 'telegram-webhook'). */
+    channelType?: string;
+    /** Token field label (empty string => pairing-only flow with no manual token entry) */
+    tokenLabel: string;
+    tokenPlaceholder: string;
+    tokenHelp: string;
+    docsLink?: string;
+}
+export declare const CHANNELS: ChannelMeta[];
+//# sourceMappingURL=channelsMeta.d.ts.map

package/lib/components/Inbox/Channels/channelsMeta.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"channelsMeta.d.ts","sourceRoot":"","sources":["../../../../src/components/Inbox/Channels/channelsMeta.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAI9C,MAAM,WAAW,WAAW;IACxB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,EAAE,MAAM,CAAC;IACpB,IAAI,EAAE,SAAS,CAAC;IAChB,wGAAwG;IACxG,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,uFAAuF;IACvF,UAAU,EAAE,MAAM,CAAC;IACnB,gBAAgB,EAAE,MAAM,CAAC;IACzB,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACrB;AAkED,eAAO,MAAM,QAAQ,EAAE,WAAW,EA0DjC,CAAC"}