@clivly/chat-widget 0.11.0-next.0 → 0.12.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -256,6 +256,13 @@ const WIDGET_STYLES = `
256
256
  padding: 0.5rem 1rem;
257
257
  text-align: center;
258
258
  }
259
+ /* Only the name carries the gradient. "Powered by" is ordinary running text
260
+ and inherits the muted colour of the line, so the mark reads as a signature
261
+ rather than the whole sentence being branded. */
262
+ .clivly-chat-widget__powered a {
263
+ color: inherit;
264
+ text-decoration: none;
265
+ }
259
266
  /* The attribution is Clivly's mark, not the host's, so it uses the stops from
260
267
  the logo itself rather than --clivly-chat-accent: the accent is driven by
261
268
  each customer's own brandColor, and a signature that changed colour per
@@ -265,20 +272,23 @@ const WIDGET_STYLES = `
265
272
  background-clip is painted over it, so anything that drops the background —
266
273
  forced-colors, an older engine, a copied-out snippet — degrades to solid
267
274
  coral rather than to invisible text. */
268
- .clivly-chat-widget__powered a {
275
+ .clivly-chat-widget__powered-mark {
269
276
  background-image: linear-gradient(90deg, #ff5a4a 0%, #c0231a 100%);
270
277
  -webkit-background-clip: text;
271
278
  background-clip: text;
272
279
  color: #c0231a;
273
- text-decoration: none;
274
280
  -webkit-text-fill-color: transparent;
275
281
  }
276
282
  /* Forced-colors mode strips background-image outright, which would leave the
277
- text painted in a transparent fill. Hand the colour back to the UA. */
283
+ text painted in a transparent fill. Hand the colour back to the UA so the
284
+ mark inherits the link colour the UA picked rather than re-pinning coral. */
278
285
  @media (forced-colors: active) {
279
286
  .clivly-chat-widget__powered a {
280
- background-image: none;
281
287
  color: LinkText;
288
+ }
289
+ .clivly-chat-widget__powered-mark {
290
+ background-image: none;
291
+ color: currentColor;
282
292
  -webkit-text-fill-color: currentColor;
283
293
  }
284
294
  }
@@ -800,11 +810,18 @@ function ChatWidget({ className, createTransport, defaultVisitor, getSession, in
800
810
  }),
801
811
  /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
802
812
  className: "clivly-chat-widget__powered",
803
- children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("a", {
813
+ children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("a", {
804
814
  href: "https://clivly.com",
805
815
  rel: "noopener",
806
816
  target: "_blank",
807
- children: "Powered by Clivly"
817
+ children: [
818
+ "Powered by",
819
+ " ",
820
+ /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
821
+ className: "clivly-chat-widget__powered-mark",
822
+ children: "Clivly"
823
+ })
824
+ ]
808
825
  })
809
826
  })
810
827
  ]
@@ -148,13 +148,13 @@ interface ChatWidgetProps {
148
148
  }
149
149
  //#endregion
150
150
  //#region src/browser-mount.d.ts
151
- interface MountChatWidgetOptions extends Omit<ChatWidgetProps, "getSession" | "widgetId"> {
151
+ export interface MountChatWidgetOptions extends Omit<ChatWidgetProps, "getSession" | "widgetId"> {
152
152
  container: Element | ShadowRoot;
153
153
  sessionUrl: string;
154
154
  socketUrlTemplate?: string;
155
155
  widgetId: string;
156
156
  }
157
- interface ChatWidgetMount {
157
+ export interface ChatWidgetMount {
158
158
  root: Root;
159
159
  /**
160
160
  * Repaint the widget in a different theme. `"auto"` resumes following the
@@ -166,11 +166,10 @@ interface ChatWidgetMount {
166
166
  */
167
167
  setTheme: (theme: ChatWidgetTheme) => void;
168
168
  }
169
- declare function mountChatWidget(options: MountChatWidgetOptions): Root;
170
- interface ScriptMountResult extends ChatWidgetMount {
169
+ export declare function mountChatWidget(options: MountChatWidgetOptions): Root;
170
+ export interface ScriptMountResult extends ChatWidgetMount {
171
171
  shadowRoot: ShadowRoot;
172
172
  }
173
- declare function mountChatWidgetScript(script?: HTMLScriptElement): ScriptMountResult;
174
- declare function autoMountChatWidgetScript(script?: HTMLScriptElement | null): ScriptMountResult | null;
175
- //#endregion
176
- export { ChatWidgetMount, MountChatWidgetOptions, ScriptMountResult, autoMountChatWidgetScript, mountChatWidget, mountChatWidgetScript };
173
+ export declare function mountChatWidgetScript(script?: HTMLScriptElement): ScriptMountResult;
174
+ export declare function autoMountChatWidgetScript(script?: HTMLScriptElement | null): ScriptMountResult | null;
175
+ //#endregion
@@ -148,13 +148,13 @@ interface ChatWidgetProps {
148
148
  }
149
149
  //#endregion
150
150
  //#region src/browser-mount.d.ts
151
- interface MountChatWidgetOptions extends Omit<ChatWidgetProps, "getSession" | "widgetId"> {
151
+ export interface MountChatWidgetOptions extends Omit<ChatWidgetProps, "getSession" | "widgetId"> {
152
152
  container: Element | ShadowRoot;
153
153
  sessionUrl: string;
154
154
  socketUrlTemplate?: string;
155
155
  widgetId: string;
156
156
  }
157
- interface ChatWidgetMount {
157
+ export interface ChatWidgetMount {
158
158
  root: Root;
159
159
  /**
160
160
  * Repaint the widget in a different theme. `"auto"` resumes following the
@@ -166,11 +166,10 @@ interface ChatWidgetMount {
166
166
  */
167
167
  setTheme: (theme: ChatWidgetTheme) => void;
168
168
  }
169
- declare function mountChatWidget(options: MountChatWidgetOptions): Root;
170
- interface ScriptMountResult extends ChatWidgetMount {
169
+ export declare function mountChatWidget(options: MountChatWidgetOptions): Root;
170
+ export interface ScriptMountResult extends ChatWidgetMount {
171
171
  shadowRoot: ShadowRoot;
172
172
  }
173
- declare function mountChatWidgetScript(script?: HTMLScriptElement): ScriptMountResult;
174
- declare function autoMountChatWidgetScript(script?: HTMLScriptElement | null): ScriptMountResult | null;
175
- //#endregion
176
- export { ChatWidgetMount, MountChatWidgetOptions, ScriptMountResult, autoMountChatWidgetScript, mountChatWidget, mountChatWidgetScript };
173
+ export declare function mountChatWidgetScript(script?: HTMLScriptElement): ScriptMountResult;
174
+ export declare function autoMountChatWidgetScript(script?: HTMLScriptElement | null): ScriptMountResult | null;
175
+ //#endregion
@@ -255,6 +255,13 @@ const WIDGET_STYLES = `
255
255
  padding: 0.5rem 1rem;
256
256
  text-align: center;
257
257
  }
258
+ /* Only the name carries the gradient. "Powered by" is ordinary running text
259
+ and inherits the muted colour of the line, so the mark reads as a signature
260
+ rather than the whole sentence being branded. */
261
+ .clivly-chat-widget__powered a {
262
+ color: inherit;
263
+ text-decoration: none;
264
+ }
258
265
  /* The attribution is Clivly's mark, not the host's, so it uses the stops from
259
266
  the logo itself rather than --clivly-chat-accent: the accent is driven by
260
267
  each customer's own brandColor, and a signature that changed colour per
@@ -264,20 +271,23 @@ const WIDGET_STYLES = `
264
271
  background-clip is painted over it, so anything that drops the background —
265
272
  forced-colors, an older engine, a copied-out snippet — degrades to solid
266
273
  coral rather than to invisible text. */
267
- .clivly-chat-widget__powered a {
274
+ .clivly-chat-widget__powered-mark {
268
275
  background-image: linear-gradient(90deg, #ff5a4a 0%, #c0231a 100%);
269
276
  -webkit-background-clip: text;
270
277
  background-clip: text;
271
278
  color: #c0231a;
272
- text-decoration: none;
273
279
  -webkit-text-fill-color: transparent;
274
280
  }
275
281
  /* Forced-colors mode strips background-image outright, which would leave the
276
- text painted in a transparent fill. Hand the colour back to the UA. */
282
+ text painted in a transparent fill. Hand the colour back to the UA so the
283
+ mark inherits the link colour the UA picked rather than re-pinning coral. */
277
284
  @media (forced-colors: active) {
278
285
  .clivly-chat-widget__powered a {
279
- background-image: none;
280
286
  color: LinkText;
287
+ }
288
+ .clivly-chat-widget__powered-mark {
289
+ background-image: none;
290
+ color: currentColor;
281
291
  -webkit-text-fill-color: currentColor;
282
292
  }
283
293
  }
@@ -799,11 +809,18 @@ function ChatWidget({ className, createTransport, defaultVisitor, getSession, in
799
809
  }),
800
810
  /* @__PURE__ */ jsx("p", {
801
811
  className: "clivly-chat-widget__powered",
802
- children: /* @__PURE__ */ jsx("a", {
812
+ children: /* @__PURE__ */ jsxs("a", {
803
813
  href: "https://clivly.com",
804
814
  rel: "noopener",
805
815
  target: "_blank",
806
- children: "Powered by Clivly"
816
+ children: [
817
+ "Powered by",
818
+ " ",
819
+ /* @__PURE__ */ jsx("span", {
820
+ className: "clivly-chat-widget__powered-mark",
821
+ children: "Clivly"
822
+ })
823
+ ]
807
824
  })
808
825
  })
809
826
  ]
package/dist/browser.cjs CHANGED
@@ -256,6 +256,13 @@ const WIDGET_STYLES = `
256
256
  padding: 0.5rem 1rem;
257
257
  text-align: center;
258
258
  }
259
+ /* Only the name carries the gradient. "Powered by" is ordinary running text
260
+ and inherits the muted colour of the line, so the mark reads as a signature
261
+ rather than the whole sentence being branded. */
262
+ .clivly-chat-widget__powered a {
263
+ color: inherit;
264
+ text-decoration: none;
265
+ }
259
266
  /* The attribution is Clivly's mark, not the host's, so it uses the stops from
260
267
  the logo itself rather than --clivly-chat-accent: the accent is driven by
261
268
  each customer's own brandColor, and a signature that changed colour per
@@ -265,20 +272,23 @@ const WIDGET_STYLES = `
265
272
  background-clip is painted over it, so anything that drops the background —
266
273
  forced-colors, an older engine, a copied-out snippet — degrades to solid
267
274
  coral rather than to invisible text. */
268
- .clivly-chat-widget__powered a {
275
+ .clivly-chat-widget__powered-mark {
269
276
  background-image: linear-gradient(90deg, #ff5a4a 0%, #c0231a 100%);
270
277
  -webkit-background-clip: text;
271
278
  background-clip: text;
272
279
  color: #c0231a;
273
- text-decoration: none;
274
280
  -webkit-text-fill-color: transparent;
275
281
  }
276
282
  /* Forced-colors mode strips background-image outright, which would leave the
277
- text painted in a transparent fill. Hand the colour back to the UA. */
283
+ text painted in a transparent fill. Hand the colour back to the UA so the
284
+ mark inherits the link colour the UA picked rather than re-pinning coral. */
278
285
  @media (forced-colors: active) {
279
286
  .clivly-chat-widget__powered a {
280
- background-image: none;
281
287
  color: LinkText;
288
+ }
289
+ .clivly-chat-widget__powered-mark {
290
+ background-image: none;
291
+ color: currentColor;
282
292
  -webkit-text-fill-color: currentColor;
283
293
  }
284
294
  }
@@ -800,11 +810,18 @@ function ChatWidget({ className, createTransport, defaultVisitor, getSession, in
800
810
  }),
801
811
  /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
802
812
  className: "clivly-chat-widget__powered",
803
- children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("a", {
813
+ children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("a", {
804
814
  href: "https://clivly.com",
805
815
  rel: "noopener",
806
816
  target: "_blank",
807
- children: "Powered by Clivly"
817
+ children: [
818
+ "Powered by",
819
+ " ",
820
+ /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
821
+ className: "clivly-chat-widget__powered-mark",
822
+ children: "Clivly"
823
+ })
824
+ ]
808
825
  })
809
826
  })
810
827
  ]
@@ -174,11 +174,10 @@ declare function mountChatWidgetScript$1(script?: HTMLScriptElement): ScriptMoun
174
174
  declare function autoMountChatWidgetScript$1(script?: HTMLScriptElement | null): ScriptMountResult$1 | null;
175
175
  //#endregion
176
176
  //#region src/browser.d.ts
177
- type ChatWidgetMount = ChatWidgetMount$1;
178
- type MountChatWidgetOptions = MountChatWidgetOptions$1;
179
- type ScriptMountResult = ScriptMountResult$1;
180
- declare const mountChatWidget: typeof mountChatWidget$1;
181
- declare const mountChatWidgetScript: typeof mountChatWidgetScript$1;
182
- declare const autoMountChatWidgetScript: typeof autoMountChatWidgetScript$1;
183
- //#endregion
184
- export { ChatWidgetMount, MountChatWidgetOptions, ScriptMountResult, autoMountChatWidgetScript, mountChatWidget, mountChatWidgetScript };
177
+ export type ChatWidgetMount = ChatWidgetMount$1;
178
+ export type MountChatWidgetOptions = MountChatWidgetOptions$1;
179
+ export type ScriptMountResult = ScriptMountResult$1;
180
+ export declare const mountChatWidget: typeof mountChatWidget$1;
181
+ export declare const mountChatWidgetScript: typeof mountChatWidgetScript$1;
182
+ export declare const autoMountChatWidgetScript: typeof autoMountChatWidgetScript$1;
183
+ //#endregion
@@ -174,11 +174,10 @@ declare function mountChatWidgetScript$1(script?: HTMLScriptElement): ScriptMoun
174
174
  declare function autoMountChatWidgetScript$1(script?: HTMLScriptElement | null): ScriptMountResult$1 | null;
175
175
  //#endregion
176
176
  //#region src/browser.d.ts
177
- type ChatWidgetMount = ChatWidgetMount$1;
178
- type MountChatWidgetOptions = MountChatWidgetOptions$1;
179
- type ScriptMountResult = ScriptMountResult$1;
180
- declare const mountChatWidget: typeof mountChatWidget$1;
181
- declare const mountChatWidgetScript: typeof mountChatWidgetScript$1;
182
- declare const autoMountChatWidgetScript: typeof autoMountChatWidgetScript$1;
183
- //#endregion
184
- export { ChatWidgetMount, MountChatWidgetOptions, ScriptMountResult, autoMountChatWidgetScript, mountChatWidget, mountChatWidgetScript };
177
+ export type ChatWidgetMount = ChatWidgetMount$1;
178
+ export type MountChatWidgetOptions = MountChatWidgetOptions$1;
179
+ export type ScriptMountResult = ScriptMountResult$1;
180
+ export declare const mountChatWidget: typeof mountChatWidget$1;
181
+ export declare const mountChatWidgetScript: typeof mountChatWidgetScript$1;
182
+ export declare const autoMountChatWidgetScript: typeof autoMountChatWidgetScript$1;
183
+ //#endregion
package/dist/browser.mjs CHANGED
@@ -255,6 +255,13 @@ const WIDGET_STYLES = `
255
255
  padding: 0.5rem 1rem;
256
256
  text-align: center;
257
257
  }
258
+ /* Only the name carries the gradient. "Powered by" is ordinary running text
259
+ and inherits the muted colour of the line, so the mark reads as a signature
260
+ rather than the whole sentence being branded. */
261
+ .clivly-chat-widget__powered a {
262
+ color: inherit;
263
+ text-decoration: none;
264
+ }
258
265
  /* The attribution is Clivly's mark, not the host's, so it uses the stops from
259
266
  the logo itself rather than --clivly-chat-accent: the accent is driven by
260
267
  each customer's own brandColor, and a signature that changed colour per
@@ -264,20 +271,23 @@ const WIDGET_STYLES = `
264
271
  background-clip is painted over it, so anything that drops the background —
265
272
  forced-colors, an older engine, a copied-out snippet — degrades to solid
266
273
  coral rather than to invisible text. */
267
- .clivly-chat-widget__powered a {
274
+ .clivly-chat-widget__powered-mark {
268
275
  background-image: linear-gradient(90deg, #ff5a4a 0%, #c0231a 100%);
269
276
  -webkit-background-clip: text;
270
277
  background-clip: text;
271
278
  color: #c0231a;
272
- text-decoration: none;
273
279
  -webkit-text-fill-color: transparent;
274
280
  }
275
281
  /* Forced-colors mode strips background-image outright, which would leave the
276
- text painted in a transparent fill. Hand the colour back to the UA. */
282
+ text painted in a transparent fill. Hand the colour back to the UA so the
283
+ mark inherits the link colour the UA picked rather than re-pinning coral. */
277
284
  @media (forced-colors: active) {
278
285
  .clivly-chat-widget__powered a {
279
- background-image: none;
280
286
  color: LinkText;
287
+ }
288
+ .clivly-chat-widget__powered-mark {
289
+ background-image: none;
290
+ color: currentColor;
281
291
  -webkit-text-fill-color: currentColor;
282
292
  }
283
293
  }
@@ -799,11 +809,18 @@ function ChatWidget({ className, createTransport, defaultVisitor, getSession, in
799
809
  }),
800
810
  /* @__PURE__ */ jsx("p", {
801
811
  className: "clivly-chat-widget__powered",
802
- children: /* @__PURE__ */ jsx("a", {
812
+ children: /* @__PURE__ */ jsxs("a", {
803
813
  href: "https://clivly.com",
804
814
  rel: "noopener",
805
815
  target: "_blank",
806
- children: "Powered by Clivly"
816
+ children: [
817
+ "Powered by",
818
+ " ",
819
+ /* @__PURE__ */ jsx("span", {
820
+ className: "clivly-chat-widget__powered-mark",
821
+ children: "Clivly"
822
+ })
823
+ ]
807
824
  })
808
825
  })
809
826
  ]
package/dist/index.cjs CHANGED
@@ -256,6 +256,13 @@ const WIDGET_STYLES = `
256
256
  padding: 0.5rem 1rem;
257
257
  text-align: center;
258
258
  }
259
+ /* Only the name carries the gradient. "Powered by" is ordinary running text
260
+ and inherits the muted colour of the line, so the mark reads as a signature
261
+ rather than the whole sentence being branded. */
262
+ .clivly-chat-widget__powered a {
263
+ color: inherit;
264
+ text-decoration: none;
265
+ }
259
266
  /* The attribution is Clivly's mark, not the host's, so it uses the stops from
260
267
  the logo itself rather than --clivly-chat-accent: the accent is driven by
261
268
  each customer's own brandColor, and a signature that changed colour per
@@ -265,20 +272,23 @@ const WIDGET_STYLES = `
265
272
  background-clip is painted over it, so anything that drops the background —
266
273
  forced-colors, an older engine, a copied-out snippet — degrades to solid
267
274
  coral rather than to invisible text. */
268
- .clivly-chat-widget__powered a {
275
+ .clivly-chat-widget__powered-mark {
269
276
  background-image: linear-gradient(90deg, #ff5a4a 0%, #c0231a 100%);
270
277
  -webkit-background-clip: text;
271
278
  background-clip: text;
272
279
  color: #c0231a;
273
- text-decoration: none;
274
280
  -webkit-text-fill-color: transparent;
275
281
  }
276
282
  /* Forced-colors mode strips background-image outright, which would leave the
277
- text painted in a transparent fill. Hand the colour back to the UA. */
283
+ text painted in a transparent fill. Hand the colour back to the UA so the
284
+ mark inherits the link colour the UA picked rather than re-pinning coral. */
278
285
  @media (forced-colors: active) {
279
286
  .clivly-chat-widget__powered a {
280
- background-image: none;
281
287
  color: LinkText;
288
+ }
289
+ .clivly-chat-widget__powered-mark {
290
+ background-image: none;
291
+ color: currentColor;
282
292
  -webkit-text-fill-color: currentColor;
283
293
  }
284
294
  }
@@ -800,11 +810,18 @@ function ChatWidget({ className, createTransport, defaultVisitor, getSession, in
800
810
  }),
801
811
  /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
802
812
  className: "clivly-chat-widget__powered",
803
- children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("a", {
813
+ children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("a", {
804
814
  href: "https://clivly.com",
805
815
  rel: "noopener",
806
816
  target: "_blank",
807
- children: "Powered by Clivly"
817
+ children: [
818
+ "Powered by",
819
+ " ",
820
+ /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
821
+ className: "clivly-chat-widget__powered-mark",
822
+ children: "Clivly"
823
+ })
824
+ ]
808
825
  })
809
826
  })
810
827
  ]
package/dist/index.d.cts CHANGED
@@ -24,7 +24,7 @@ interface ResolveThemeOptions {
24
24
  * document, and guessing dark would flash the wrong palette on hydration for
25
25
  * the majority of pages.
26
26
  */
27
- declare function resolveTheme(theme: ChatWidgetTheme, { root, view }?: ResolveThemeOptions): ResolvedTheme;
27
+ export declare function resolveTheme(theme: ChatWidgetTheme, { root, view }?: ResolveThemeOptions): ResolvedTheme;
28
28
  //#endregion
29
29
  //#region src/types.d.ts
30
30
  type WidgetSenderType = "visitor" | "operator" | "system";
@@ -125,13 +125,13 @@ interface CreateWebSocketTransportOptions {
125
125
  getProtocols?: (session: WidgetSessionPayload) => string | string[] | undefined;
126
126
  resolveUrl: (session: WidgetSessionPayload) => string;
127
127
  }
128
- declare function createWebSocketTransport({ createSocket, getProtocols, resolveUrl }: CreateWebSocketTransportOptions): CreateChatTransport;
128
+ export declare function createWebSocketTransport({ createSocket, getProtocols, resolveUrl }: CreateWebSocketTransportOptions): CreateChatTransport;
129
129
  interface CreateLoopbackTransportOptions {
130
130
  operatorName?: string;
131
131
  operatorReply?: (body: string) => string | null;
132
132
  replyDelayMs?: number;
133
133
  }
134
- declare function createLoopbackTransport({ operatorName, operatorReply, replyDelayMs }?: CreateLoopbackTransportOptions): CreateChatTransport;
134
+ export declare function createLoopbackTransport({ operatorName, operatorReply, replyDelayMs }?: CreateLoopbackTransportOptions): CreateChatTransport;
135
135
  //#endregion
136
136
  //#region src/chat-widget.d.ts
137
137
  interface ChatWidgetProps {
@@ -173,12 +173,12 @@ interface ChatWidgetProps {
173
173
  theme?: ChatWidgetTheme;
174
174
  widgetId: string;
175
175
  }
176
- declare function ChatWidget({ className, createTransport, defaultVisitor, getSession, initiallyOpen, launcherLabel, storage, style, theme, widgetId }: ChatWidgetProps): ReactElement;
177
- declare function ChatLauncher(): null;
178
- declare function ChatPanel(): null;
179
- declare function MessageComposer(): null;
180
- declare function PreChatForm(): null;
181
- declare function ConversationView(): null;
176
+ export declare function ChatWidget({ className, createTransport, defaultVisitor, getSession, initiallyOpen, launcherLabel, storage, style, theme, widgetId }: ChatWidgetProps): ReactElement;
177
+ export declare function ChatLauncher(): null;
178
+ export declare function ChatPanel(): null;
179
+ export declare function MessageComposer(): null;
180
+ export declare function PreChatForm(): null;
181
+ export declare function ConversationView(): null;
182
182
  //#endregion
183
183
  //#region src/browser-mount.d.ts
184
184
  interface MountChatWidgetOptions$1 extends Omit<ChatWidgetProps, "getSession" | "widgetId"> {
@@ -224,16 +224,16 @@ interface CreateSessionFetcherOptions {
224
224
  fetchImpl?: typeof fetch;
225
225
  sessionUrl: string;
226
226
  }
227
- declare function createSessionFetcher({ fetchImpl, sessionUrl }: CreateSessionFetcherOptions): GetSession;
227
+ export declare function createSessionFetcher({ fetchImpl, sessionUrl }: CreateSessionFetcherOptions): GetSession;
228
228
  //#endregion
229
229
  //#region src/index.d.ts
230
- type ChatWidgetMount = ChatWidgetMount$1;
231
- type MountChatWidgetOptions = MountChatWidgetOptions$1;
232
- type ScriptMountResult = ScriptMountResult$1;
233
- declare const autoMountChatWidgetScript: typeof autoMountChatWidgetScript$1;
234
- type CreateClivlyTransportOptions = CreateClivlyTransportOptions$1;
235
- declare const createClivlyTransport: typeof createClivlyTransport$1;
236
- declare const mountChatWidget: typeof mountChatWidget$1;
237
- declare const mountChatWidgetScript: typeof mountChatWidgetScript$1;
230
+ export type ChatWidgetMount = ChatWidgetMount$1;
231
+ export type MountChatWidgetOptions = MountChatWidgetOptions$1;
232
+ export type ScriptMountResult = ScriptMountResult$1;
233
+ export declare const autoMountChatWidgetScript: typeof autoMountChatWidgetScript$1;
234
+ export type CreateClivlyTransportOptions = CreateClivlyTransportOptions$1;
235
+ export declare const createClivlyTransport: typeof createClivlyTransport$1;
236
+ export declare const mountChatWidget: typeof mountChatWidget$1;
237
+ export declare const mountChatWidgetScript: typeof mountChatWidgetScript$1;
238
238
  //#endregion
239
- export { ChatLauncher, ChatPanel, type ChatTransportConnection, type ChatTransportHandlers, ChatWidget, ChatWidgetMount, type ChatWidgetProps, type ChatWidgetTheme, type ChatWidgetVisitor, ConversationView, type CreateChatTransport, type CreateChatTransportOptions, CreateClivlyTransportOptions, type CreateLoopbackTransportOptions, type CreateWebSocketTransportOptions, type GetSession, type GetSessionOptions, MessageComposer, MountChatWidgetOptions, PreChatForm, type ResolvedTheme, ScriptMountResult, type WidgetClientCreateMessageEvent, type WidgetClientEvent, type WidgetConfig, type WidgetContact, type WidgetConversation, type WidgetConversationSnapshotEvent, type WidgetErrorEvent, type WidgetMessage, type WidgetMessageAckEvent, type WidgetMessageCreatedEvent, type WidgetSenderType, type WidgetServerEvent, type WidgetSessionPayload, type WidgetSessionReadyEvent, type WidgetSummary, autoMountChatWidgetScript, createClivlyTransport, createLoopbackTransport, createSessionFetcher, createWebSocketTransport, mountChatWidget, mountChatWidgetScript, resolveTheme };
239
+ export type { ChatTransportConnection, ChatTransportHandlers, ChatWidgetProps, ChatWidgetTheme, ChatWidgetVisitor, CreateChatTransport, CreateChatTransportOptions, CreateLoopbackTransportOptions, CreateWebSocketTransportOptions, GetSession, GetSessionOptions, ResolvedTheme, WidgetClientCreateMessageEvent, WidgetClientEvent, WidgetConfig, WidgetContact, WidgetConversation, WidgetConversationSnapshotEvent, WidgetErrorEvent, WidgetMessage, WidgetMessageAckEvent, WidgetMessageCreatedEvent, WidgetSenderType, WidgetServerEvent, WidgetSessionPayload, WidgetSessionReadyEvent, WidgetSummary };
package/dist/index.d.mts CHANGED
@@ -24,7 +24,7 @@ interface ResolveThemeOptions {
24
24
  * document, and guessing dark would flash the wrong palette on hydration for
25
25
  * the majority of pages.
26
26
  */
27
- declare function resolveTheme(theme: ChatWidgetTheme, { root, view }?: ResolveThemeOptions): ResolvedTheme;
27
+ export declare function resolveTheme(theme: ChatWidgetTheme, { root, view }?: ResolveThemeOptions): ResolvedTheme;
28
28
  //#endregion
29
29
  //#region src/types.d.ts
30
30
  type WidgetSenderType = "visitor" | "operator" | "system";
@@ -125,13 +125,13 @@ interface CreateWebSocketTransportOptions {
125
125
  getProtocols?: (session: WidgetSessionPayload) => string | string[] | undefined;
126
126
  resolveUrl: (session: WidgetSessionPayload) => string;
127
127
  }
128
- declare function createWebSocketTransport({ createSocket, getProtocols, resolveUrl }: CreateWebSocketTransportOptions): CreateChatTransport;
128
+ export declare function createWebSocketTransport({ createSocket, getProtocols, resolveUrl }: CreateWebSocketTransportOptions): CreateChatTransport;
129
129
  interface CreateLoopbackTransportOptions {
130
130
  operatorName?: string;
131
131
  operatorReply?: (body: string) => string | null;
132
132
  replyDelayMs?: number;
133
133
  }
134
- declare function createLoopbackTransport({ operatorName, operatorReply, replyDelayMs }?: CreateLoopbackTransportOptions): CreateChatTransport;
134
+ export declare function createLoopbackTransport({ operatorName, operatorReply, replyDelayMs }?: CreateLoopbackTransportOptions): CreateChatTransport;
135
135
  //#endregion
136
136
  //#region src/chat-widget.d.ts
137
137
  interface ChatWidgetProps {
@@ -173,12 +173,12 @@ interface ChatWidgetProps {
173
173
  theme?: ChatWidgetTheme;
174
174
  widgetId: string;
175
175
  }
176
- declare function ChatWidget({ className, createTransport, defaultVisitor, getSession, initiallyOpen, launcherLabel, storage, style, theme, widgetId }: ChatWidgetProps): ReactElement;
177
- declare function ChatLauncher(): null;
178
- declare function ChatPanel(): null;
179
- declare function MessageComposer(): null;
180
- declare function PreChatForm(): null;
181
- declare function ConversationView(): null;
176
+ export declare function ChatWidget({ className, createTransport, defaultVisitor, getSession, initiallyOpen, launcherLabel, storage, style, theme, widgetId }: ChatWidgetProps): ReactElement;
177
+ export declare function ChatLauncher(): null;
178
+ export declare function ChatPanel(): null;
179
+ export declare function MessageComposer(): null;
180
+ export declare function PreChatForm(): null;
181
+ export declare function ConversationView(): null;
182
182
  //#endregion
183
183
  //#region src/browser-mount.d.ts
184
184
  interface MountChatWidgetOptions$1 extends Omit<ChatWidgetProps, "getSession" | "widgetId"> {
@@ -224,16 +224,16 @@ interface CreateSessionFetcherOptions {
224
224
  fetchImpl?: typeof fetch;
225
225
  sessionUrl: string;
226
226
  }
227
- declare function createSessionFetcher({ fetchImpl, sessionUrl }: CreateSessionFetcherOptions): GetSession;
227
+ export declare function createSessionFetcher({ fetchImpl, sessionUrl }: CreateSessionFetcherOptions): GetSession;
228
228
  //#endregion
229
229
  //#region src/index.d.ts
230
- type ChatWidgetMount = ChatWidgetMount$1;
231
- type MountChatWidgetOptions = MountChatWidgetOptions$1;
232
- type ScriptMountResult = ScriptMountResult$1;
233
- declare const autoMountChatWidgetScript: typeof autoMountChatWidgetScript$1;
234
- type CreateClivlyTransportOptions = CreateClivlyTransportOptions$1;
235
- declare const createClivlyTransport: typeof createClivlyTransport$1;
236
- declare const mountChatWidget: typeof mountChatWidget$1;
237
- declare const mountChatWidgetScript: typeof mountChatWidgetScript$1;
230
+ export type ChatWidgetMount = ChatWidgetMount$1;
231
+ export type MountChatWidgetOptions = MountChatWidgetOptions$1;
232
+ export type ScriptMountResult = ScriptMountResult$1;
233
+ export declare const autoMountChatWidgetScript: typeof autoMountChatWidgetScript$1;
234
+ export type CreateClivlyTransportOptions = CreateClivlyTransportOptions$1;
235
+ export declare const createClivlyTransport: typeof createClivlyTransport$1;
236
+ export declare const mountChatWidget: typeof mountChatWidget$1;
237
+ export declare const mountChatWidgetScript: typeof mountChatWidgetScript$1;
238
238
  //#endregion
239
- export { ChatLauncher, ChatPanel, type ChatTransportConnection, type ChatTransportHandlers, ChatWidget, ChatWidgetMount, type ChatWidgetProps, type ChatWidgetTheme, type ChatWidgetVisitor, ConversationView, type CreateChatTransport, type CreateChatTransportOptions, CreateClivlyTransportOptions, type CreateLoopbackTransportOptions, type CreateWebSocketTransportOptions, type GetSession, type GetSessionOptions, MessageComposer, MountChatWidgetOptions, PreChatForm, type ResolvedTheme, ScriptMountResult, type WidgetClientCreateMessageEvent, type WidgetClientEvent, type WidgetConfig, type WidgetContact, type WidgetConversation, type WidgetConversationSnapshotEvent, type WidgetErrorEvent, type WidgetMessage, type WidgetMessageAckEvent, type WidgetMessageCreatedEvent, type WidgetSenderType, type WidgetServerEvent, type WidgetSessionPayload, type WidgetSessionReadyEvent, type WidgetSummary, autoMountChatWidgetScript, createClivlyTransport, createLoopbackTransport, createSessionFetcher, createWebSocketTransport, mountChatWidget, mountChatWidgetScript, resolveTheme };
239
+ export type { ChatTransportConnection, ChatTransportHandlers, ChatWidgetProps, ChatWidgetTheme, ChatWidgetVisitor, CreateChatTransport, CreateChatTransportOptions, CreateLoopbackTransportOptions, CreateWebSocketTransportOptions, GetSession, GetSessionOptions, ResolvedTheme, WidgetClientCreateMessageEvent, WidgetClientEvent, WidgetConfig, WidgetContact, WidgetConversation, WidgetConversationSnapshotEvent, WidgetErrorEvent, WidgetMessage, WidgetMessageAckEvent, WidgetMessageCreatedEvent, WidgetSenderType, WidgetServerEvent, WidgetSessionPayload, WidgetSessionReadyEvent, WidgetSummary };
package/dist/index.mjs CHANGED
@@ -255,6 +255,13 @@ const WIDGET_STYLES = `
255
255
  padding: 0.5rem 1rem;
256
256
  text-align: center;
257
257
  }
258
+ /* Only the name carries the gradient. "Powered by" is ordinary running text
259
+ and inherits the muted colour of the line, so the mark reads as a signature
260
+ rather than the whole sentence being branded. */
261
+ .clivly-chat-widget__powered a {
262
+ color: inherit;
263
+ text-decoration: none;
264
+ }
258
265
  /* The attribution is Clivly's mark, not the host's, so it uses the stops from
259
266
  the logo itself rather than --clivly-chat-accent: the accent is driven by
260
267
  each customer's own brandColor, and a signature that changed colour per
@@ -264,20 +271,23 @@ const WIDGET_STYLES = `
264
271
  background-clip is painted over it, so anything that drops the background —
265
272
  forced-colors, an older engine, a copied-out snippet — degrades to solid
266
273
  coral rather than to invisible text. */
267
- .clivly-chat-widget__powered a {
274
+ .clivly-chat-widget__powered-mark {
268
275
  background-image: linear-gradient(90deg, #ff5a4a 0%, #c0231a 100%);
269
276
  -webkit-background-clip: text;
270
277
  background-clip: text;
271
278
  color: #c0231a;
272
- text-decoration: none;
273
279
  -webkit-text-fill-color: transparent;
274
280
  }
275
281
  /* Forced-colors mode strips background-image outright, which would leave the
276
- text painted in a transparent fill. Hand the colour back to the UA. */
282
+ text painted in a transparent fill. Hand the colour back to the UA so the
283
+ mark inherits the link colour the UA picked rather than re-pinning coral. */
277
284
  @media (forced-colors: active) {
278
285
  .clivly-chat-widget__powered a {
279
- background-image: none;
280
286
  color: LinkText;
287
+ }
288
+ .clivly-chat-widget__powered-mark {
289
+ background-image: none;
290
+ color: currentColor;
281
291
  -webkit-text-fill-color: currentColor;
282
292
  }
283
293
  }
@@ -799,11 +809,18 @@ function ChatWidget({ className, createTransport, defaultVisitor, getSession, in
799
809
  }),
800
810
  /* @__PURE__ */ jsx("p", {
801
811
  className: "clivly-chat-widget__powered",
802
- children: /* @__PURE__ */ jsx("a", {
812
+ children: /* @__PURE__ */ jsxs("a", {
803
813
  href: "https://clivly.com",
804
814
  rel: "noopener",
805
815
  target: "_blank",
806
- children: "Powered by Clivly"
816
+ children: [
817
+ "Powered by",
818
+ " ",
819
+ /* @__PURE__ */ jsx("span", {
820
+ className: "clivly-chat-widget__powered-mark",
821
+ children: "Clivly"
822
+ })
823
+ ]
807
824
  })
808
825
  })
809
826
  ]