@inkeep/cxkit-primitives 0.5.111 → 0.5.113

package/dist/hooks/use-scroll-to-bottom.cjs

@@ -1 +1 @@
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react");function d(h={}){const{threshold:i=150,interactionTimeout:a=150}=h,o=r.useRef(null),f=r.useRef(!0),u=r.useRef(!1),l=r.useCallback(()=>{const e=o.current;return e?e.scrollHeight-e.clientHeight-e.scrollTop<i:!1},[i]),n=r.useCallback((e=!1)=>{const t=o.current;!t||u.current||t.scrollTo({top:t.scrollHeight,behavior:e?"smooth":"auto"})},[]);return r.useEffect(()=>{const e=o.current;if(!e)return;let t;const s=()=>{u.current=!0,f.current=l(),window.clearTimeout(t),t=window.setTimeout(()=>{u.current=!1},a)};return e.addEventListener("scroll",s,{passive:!0}),()=>{e.removeEventListener("scroll",s),window.clearTimeout(t)}},[l,a]),r.useEffect(()=>{const e=o.current;if(!e)return;const t=new MutationObserver(s=>{s.some(c=>c.type==="childList"||c.type==="characterData"||c.type==="attributes"&&c.attributeName==="style")&&f.current&&n(!0)});return t.observe(e,{childList:!0,subtree:!0,attributes:!0,attributeFilter:["style"],characterData:!0}),()=>t.disconnect()},[n]),r.useEffect(()=>{o.current&&n()},[n]),{containerRef:o,scrollToBottom:n,isNearBottom:l}}exports.useScrollToBottom=d;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react");function b(h={}){const{threshold:a=150,interactionTimeout:f=150}=h,o=r.useRef(null),l=r.useRef(!0),s=r.useRef(!1),i=r.useCallback(()=>{const e=o.current;return e?e.scrollHeight-e.clientHeight-e.scrollTop<a:!1},[a]),n=r.useCallback((e=!1)=>{const t=o.current;!t||s.current||t.scrollTo({top:t.scrollHeight,behavior:e?"smooth":"auto"})},[]);return r.useEffect(()=>{const e=o.current;if(!e)return;let t;const c=()=>{s.current=!0,l.current=i(),window.clearTimeout(t),t=window.setTimeout(()=>{s.current=!1},f)};return e.addEventListener("scroll",c,{passive:!0}),()=>{e.removeEventListener("scroll",c),window.clearTimeout(t)}},[i,f]),r.useEffect(()=>{const e=o.current;if(!e)return;const t=new MutationObserver(c=>{c.some(u=>u.type==="childList"||u.type==="characterData"||u.type==="attributes"&&u.attributeName==="style")&&l.current&&n(!0)});return t.observe(e,{childList:!0,subtree:!0,attributes:!0,attributeFilter:["style"],characterData:!0}),()=>t.disconnect()},[n]),r.useEffect(()=>{o.current&&n()},[n]),r.useEffect(()=>{const e=o.current;if(!e)return;const t=new ResizeObserver(()=>{l.current&&(s.current=!1,n(!1))});return t.observe(e),()=>t.disconnect()},[n]),{containerRef:o,scrollToBottom:n,isNearBottom:i}}exports.useScrollToBottom=b;

package/dist/hooks/use-scroll-to-bottom.js

@@ -1,52 +1,59 @@
 "use client";
-import { useRef as u, useCallback as d, useEffect as i } from "react";
-function v(m = {}) {
-  const { threshold: a = 150, interactionTimeout: f = 150 } = m, r = u(null), h = u(!0), s = u(!1), l = d(() => {
-    const t = r.current;
-    return t ? t.scrollHeight - t.clientHeight - t.scrollTop < a : !1;
-  }, [a]), o = d((t = !1) => {
+import { useRef as a, useCallback as d, useEffect as u } from "react";
+function T(b = {}) {
+  const { threshold: f = 150, interactionTimeout: h = 150 } = b, r = a(null), i = a(!0), o = a(!1), l = d(() => {
     const e = r.current;
-    !e || s.current || e.scrollTo({
-      top: e.scrollHeight,
-      behavior: t ? "smooth" : "auto"
+    return e ? e.scrollHeight - e.clientHeight - e.scrollTop < f : !1;
+  }, [f]), n = d((e = !1) => {
+    const t = r.current;
+    !t || o.current || t.scrollTo({
+      top: t.scrollHeight,
+      behavior: e ? "smooth" : "auto"
     });
   }, []);
-  return i(() => {
-    const t = r.current;
-    if (!t) return;
-    let e;
-    const n = () => {
-      s.current = !0, h.current = l(), window.clearTimeout(e), e = window.setTimeout(() => {
-        s.current = !1;
-      }, f);
+  return u(() => {
+    const e = r.current;
+    if (!e) return;
+    let t;
+    const s = () => {
+      o.current = !0, i.current = l(), window.clearTimeout(t), t = window.setTimeout(() => {
+        o.current = !1;
+      }, h);
     };
-    return t.addEventListener("scroll", n, { passive: !0 }), () => {
-      t.removeEventListener("scroll", n), window.clearTimeout(e);
+    return e.addEventListener("scroll", s, { passive: !0 }), () => {
+      e.removeEventListener("scroll", s), window.clearTimeout(t);
     };
-  }, [l, f]), i(() => {
-    const t = r.current;
-    if (!t) return;
-    const e = new MutationObserver((n) => {
-      n.some(
+  }, [l, h]), u(() => {
+    const e = r.current;
+    if (!e) return;
+    const t = new MutationObserver((s) => {
+      s.some(
         (c) => c.type === "childList" || c.type === "characterData" || c.type === "attributes" && c.attributeName === "style"
-      ) && h.current && o(!0);
+      ) && i.current && n(!0);
     });
-    return e.observe(t, {
+    return t.observe(e, {
       childList: !0,
       subtree: !0,
       attributes: !0,
       attributeFilter: ["style"],
       // Only watch style changes
       characterData: !0
-    }), () => e.disconnect();
-  }, [o]), i(() => {
-    r.current && o();
-  }, [o]), {
+    }), () => t.disconnect();
+  }, [n]), u(() => {
+    r.current && n();
+  }, [n]), u(() => {
+    const e = r.current;
+    if (!e) return;
+    const t = new ResizeObserver(() => {
+      i.current && (o.current = !1, n(!1));
+    });
+    return t.observe(e), () => t.disconnect();
+  }, [n]), {
     containerRef: r,
-    scrollToBottom: o,
+    scrollToBottom: n,
     isNearBottom: l
   };
 }
 export {
-  v as useScrollToBottom
+  T as useScrollToBottom
 };

package/dist/index.d.cts

@@ -1400,6 +1400,54 @@ declare const defaultInkeepBaseSettings: {
             '8xl': string;
             '9xl': string;
         };
+        spacing: {
+            0: string;
+            px: string;
+            0.5: string;
+            1: string;
+            1.5: string;
+            2: string;
+            2.5: string;
+            3: string;
+            3.5: string;
+            4: string;
+            5: string;
+            6: string;
+            7: string;
+            8: string;
+            9: string;
+            10: string;
+            11: string;
+            12: string;
+            14: string;
+            16: string;
+            20: string;
+            24: string;
+            28: string;
+            32: string;
+            36: string;
+            40: string;
+            44: string;
+            48: string;
+            52: string;
+            56: string;
+            60: string;
+            64: string;
+            72: string;
+            80: string;
+            96: string;
+        };
+        borderRadius: {
+            none: string;
+            sm: string;
+            DEFAULT: string;
+            md: string;
+            lg: string;
+            xl: string;
+            '2xl': string;
+            '3xl': string;
+            full: string;
+        };
         zIndex: {
             hide: number;
             auto: string;

package/dist/index.d.ts

@@ -1400,6 +1400,54 @@ declare const defaultInkeepBaseSettings: {
             '8xl': string;
             '9xl': string;
         };
+        spacing: {
+            0: string;
+            px: string;
+            0.5: string;
+            1: string;
+            1.5: string;
+            2: string;
+            2.5: string;
+            3: string;
+            3.5: string;
+            4: string;
+            5: string;
+            6: string;
+            7: string;
+            8: string;
+            9: string;
+            10: string;
+            11: string;
+            12: string;
+            14: string;
+            16: string;
+            20: string;
+            24: string;
+            28: string;
+            32: string;
+            36: string;
+            40: string;
+            44: string;
+            48: string;
+            52: string;
+            56: string;
+            60: string;
+            64: string;
+            72: string;
+            80: string;
+            96: string;
+        };
+        borderRadius: {
+            none: string;
+            sm: string;
+            DEFAULT: string;
+            md: string;
+            lg: string;
+            xl: string;
+            '2xl': string;
+            '3xl': string;
+            full: string;
+        };
         zIndex: {
             hide: number;
             auto: string;

package/dist/providers/base-events-provider.cjs

@@ -1 +1 @@
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const B=require("react/jsx-runtime"),t=require("react"),f=require("../atoms/api/analytics/events.cjs"),b=require("./config-provider.cjs"),x=require("./user-provider.cjs"),E=t.createContext(void 0),q=({children:e})=>{const{baseSettings:s,componentType:r}=b.useInkeepConfig(),{apiKey:i,analyticsApiBaseUrl:c,tags:a,privacyPreferences:m,env:g,analyticsProperties:v}=s,{userProperties:u}=x.useUser(),l=t.useMemo(()=>({widgetLibraryVersion:"0.5.111",componentType:r,tags:a}),[r,a]),d=!m.optOutAllAnalytics&&g!=="development",P={logEvent:t.useCallback(async n=>{const o={...l,...n.properties,...v},p={eventName:n.eventName,properties:o,userProperties:u},y=["modal_opened","modal_closed"].includes(n.eventName);if(d&&!y){if("conversation"in o&&!o.conversation?.id)return;f.logEvent(p,i,c)}s.onEvent?.(p)},[d,s,i,c,u,l,v])};return B.jsx(E.Provider,{value:P,children:e})},C=()=>{const e=t.useContext(E);if(!e)throw new Error("useBaseEvents must be used within a BaseEventsProvider");return e};exports.BaseEventsProvider=q;exports.useBaseEvents=C;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const B=require("react/jsx-runtime"),t=require("react"),f=require("../atoms/api/analytics/events.cjs"),b=require("./config-provider.cjs"),x=require("./user-provider.cjs"),E=t.createContext(void 0),q=({children:e})=>{const{baseSettings:s,componentType:r}=b.useInkeepConfig(),{apiKey:i,analyticsApiBaseUrl:c,tags:a,privacyPreferences:m,env:g,analyticsProperties:v}=s,{userProperties:u}=x.useUser(),l=t.useMemo(()=>({widgetLibraryVersion:"0.5.113",componentType:r,tags:a}),[r,a]),d=!m.optOutAllAnalytics&&g!=="development",P={logEvent:t.useCallback(async n=>{const o={...l,...n.properties,...v},p={eventName:n.eventName,properties:o,userProperties:u},y=["modal_opened","modal_closed"].includes(n.eventName);if(d&&!y){if("conversation"in o&&!o.conversation?.id)return;f.logEvent(p,i,c)}s.onEvent?.(p)},[d,s,i,c,u,l,v])};return B.jsx(E.Provider,{value:P,children:e})},C=()=>{const e=t.useContext(E);if(!e)throw new Error("useBaseEvents must be used within a BaseEventsProvider");return e};exports.BaseEventsProvider=q;exports.useBaseEvents=C;

package/dist/providers/base-events-provider.js

@@ -7,7 +7,7 @@ import { useUser as A } from "./user-provider.js";
 const u = B(void 0), $ = ({ children: e }) => {
   const { baseSettings: t, componentType: s } = w(), { apiKey: r, analyticsApiBaseUrl: i, tags: a, privacyPreferences: d, env: E, analyticsProperties: c } = t, { userProperties: v } = A(), p = P(
     () => ({
-      widgetLibraryVersion: "0.5.111",
+      widgetLibraryVersion: "0.5.113",
       componentType: s,
       tags: a
     }),

package/dist/providers/theme-provider.cjs

@@ -1,3 +1,3 @@
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),m=require("@inkeep/cxkit-theme"),D=require("@inkeep/cxkit-color-mode"),H=require("./config-provider.cjs"),L=require("merge-anything"),z=require("../atoms/custom-styles.cjs"),i=require("react"),E=({children:g})=>{const{baseSettings:y}=H.useInkeepConfig(),{theme:s,primaryBrandColor:h,shadowHost:f,rootElement:b,colorMode:S}=y,{primaryColors:C,varsClassName:M}=s,{disableLoadingDefaultFont:p,fontFamily:v,fontSize:x,zIndex:q}=s,k=m.createColorScheme(C,h),T={colors:L.merge(s.colors,k),fontFamily:v,fontSize:x,zIndex:q},j=m.createCSSVariables(T),{customStyles:I,loaded:w}=z.useCustomStyles(),{sync:e,forcedColorMode:P,...F}=S??{},[R,l]=i.useState(),V=i.useRef(null);return i.useEffect(()=>{if(!e?.target)return;const o=typeof e.target=="string"?document.querySelector(e.target):e.target;if(!o)return;function a(c,r){return r.reduce((A,d)=>({...A,[d]:c.getAttribute(d)}),{})}const n=new MutationObserver(()=>{const c=a(o,e.attributes),r=e.isDarkMode?.(c)?"dark":"light";e.onChange?.(r),l(r)});n.observe(o,{attributes:!0,attributeFilter:e.attributes,childList:!1,subtree:!1}),V.current=n;const u=e.isDarkMode?.(a(o,e?.attributes))?"dark":"light";return e.onChange?.(u),l(u),()=>n.disconnect()},[e]),t.jsxs(t.Fragment,{children:[!p&&t.jsx("style",{type:"text/css",dangerouslySetInnerHTML:{__html:`
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),m=require("@inkeep/cxkit-theme"),L=require("@inkeep/cxkit-color-mode"),z=require("./config-provider.cjs"),E=require("merge-anything"),N=require("../atoms/custom-styles.cjs"),i=require("react"),O=({children:g})=>{const{baseSettings:y}=z.useInkeepConfig(),{theme:s,primaryBrandColor:h,shadowHost:f,rootElement:b,colorMode:S}=y,{primaryColors:C,varsClassName:M}=s,{disableLoadingDefaultFont:p,fontFamily:v,fontSize:x,spacing:q,borderRadius:k,zIndex:T}=s,j=m.createColorScheme(C,h),I={colors:E.merge(s.colors,j),fontFamily:v,fontSize:x,spacing:q,borderRadius:k,zIndex:T},w=m.createCSSVariables(I),{customStyles:P,loaded:R}=N.useCustomStyles(),{sync:e,forcedColorMode:F,...V}=S??{},[A,l]=i.useState(),D=i.useRef(null);return i.useEffect(()=>{if(!e?.target)return;const o=typeof e.target=="string"?document.querySelector(e.target):e.target;if(!o)return;function a(c,r){return r.reduce((H,d)=>({...H,[d]:c.getAttribute(d)}),{})}const n=new MutationObserver(()=>{const c=a(o,e.attributes),r=e.isDarkMode?.(c)?"dark":"light";e.onChange?.(r),l(r)});n.observe(o,{attributes:!0,attributeFilter:e.attributes,childList:!1,subtree:!1}),D.current=n;const u=e.isDarkMode?.(a(o,e?.attributes))?"dark":"light";return e.onChange?.(u),l(u),()=>n.disconnect()},[e]),t.jsxs(t.Fragment,{children:[!p&&t.jsx("style",{type:"text/css",dangerouslySetInnerHTML:{__html:`
           @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;900&display=swap');
-        `}}),I,w&&t.jsx(D.ColorModeProvider,{forcedColorMode:P??R,...F,shadowHostId:f?.id,rootId:b?.id,children:t.jsx("div",{className:M,style:{display:"contents",...j},children:g})})]})};exports.ThemeProvider=E;
+        `}}),P,R&&t.jsx(L.ColorModeProvider,{forcedColorMode:F??A,...V,shadowHostId:f?.id,rootId:b?.id,children:t.jsx("div",{className:M,style:{display:"contents",...w},children:g})})]})};exports.ThemeProvider=O;

package/dist/providers/theme-provider.js

@@ -1,26 +1,28 @@
 "use client";
-import { jsxs as j, Fragment as z, jsx as c } from "react/jsx-runtime";
-import { createColorScheme as A, createCSSVariables as E } from "@inkeep/cxkit-theme";
-import { ColorModeProvider as N } from "@inkeep/cxkit-color-mode";
-import { useInkeepConfig as P } from "./config-provider.js";
-import { merge as R } from "merge-anything";
-import { useCustomStyles as _ } from "../atoms/custom-styles.js";
-import { useState as q, useRef as B, useEffect as O } from "react";
-const Z = ({ children: u }) => {
-  const { baseSettings: m } = P(), { theme: r, primaryBrandColor: f, shadowHost: g, rootElement: p, colorMode: y } = m, { primaryColors: h, varsClassName: b } = r, { disableLoadingDefaultFont: C, fontFamily: M, fontSize: S, zIndex: v } = r, I = A(h, f), k = {
-    colors: R(r.colors, I),
+import { jsxs as z, Fragment as A, jsx as c } from "react/jsx-runtime";
+import { createColorScheme as E, createCSSVariables as N } from "@inkeep/cxkit-theme";
+import { ColorModeProvider as P } from "@inkeep/cxkit-color-mode";
+import { useInkeepConfig as _ } from "./config-provider.js";
+import { merge as q } from "merge-anything";
+import { useCustomStyles as B } from "../atoms/custom-styles.js";
+import { useState as O, useRef as G, useEffect as J } from "react";
+const ee = ({ children: u }) => {
+  const { baseSettings: m } = _(), { theme: r, primaryBrandColor: f, shadowHost: g, rootElement: p, colorMode: y } = m, { primaryColors: h, varsClassName: b } = r, { disableLoadingDefaultFont: C, fontFamily: M, fontSize: S, spacing: v, borderRadius: I, zIndex: k } = r, w = E(h, f), x = {
+    colors: q(r.colors, w),
     fontFamily: M,
     fontSize: S,
-    zIndex: v
-  }, w = E(k), { customStyles: x, loaded: F } = _(), { sync: e, forcedColorMode: T, ...V } = y ?? {}, [D, a] = q(), H = B(null);
-  return O(() => {
+    spacing: v,
+    borderRadius: I,
+    zIndex: k
+  }, F = N(x), { customStyles: T, loaded: V } = B(), { sync: e, forcedColorMode: D, ...H } = y ?? {}, [L, a] = O(), R = G(null);
+  return J(() => {
     if (!e?.target) return;
     const t = typeof e.target == "string" ? document.querySelector(e.target) : e.target;
     if (!t) return;
     function i(n, o) {
       return o.reduce(
-        (L, d) => ({
-          ...L,
+        (j, d) => ({
+          ...j,
           [d]: n.getAttribute(d)
         }),
         {}
@@ -35,10 +37,10 @@ const Z = ({ children: u }) => {
       attributeFilter: e.attributes,
       childList: !1,
       subtree: !1
-    }), H.current = s;
+    }), R.current = s;
     const l = e.isDarkMode?.(i(t, e?.attributes)) ? "dark" : "light";
     return e.onChange?.(l), a(l), () => s.disconnect();
-  }, [e]), /* @__PURE__ */ j(z, { children: [
+  }, [e]), /* @__PURE__ */ z(A, { children: [
     !C && /* @__PURE__ */ c(
       "style",
       {
@@ -50,12 +52,12 @@ const Z = ({ children: u }) => {
         }
       }
     ),
-    x,
-    F && /* @__PURE__ */ c(
-      N,
+    T,
+    V && /* @__PURE__ */ c(
+      P,
       {
-        forcedColorMode: T ?? D,
-        ...V,
+        forcedColorMode: D ?? L,
+        ...H,
         shadowHostId: g?.id,
         rootId: p?.id,
         children: /* @__PURE__ */ c(
@@ -64,7 +66,7 @@ const Z = ({ children: u }) => {
             className: b,
             style: {
               display: "contents",
-              ...w
+              ...F
             },
             children: u
           }
@@ -74,5 +76,5 @@ const Z = ({ children: u }) => {
   ] });
 };
 export {
-  Z as ThemeProvider
+  ee as ThemeProvider
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@inkeep/cxkit-primitives",
-  "version": "0.5.111",
+  "version": "0.5.113",
   "description": "",
   "license": "Inkeep, Inc. Customer License (IICL) v1.1",
   "homepage": "",
@@ -67,9 +67,9 @@
     "remark-gfm": "^4.0.1",
     "unist-util-visit": "^5.0.0",
     "use-sync-external-store": "^1.4.0",
-    "@inkeep/cxkit-color-mode": "^0.5.111",
-    "@inkeep/cxkit-theme": "0.5.111",
-    "@inkeep/cxkit-types": "0.5.111"
+    "@inkeep/cxkit-color-mode": "^0.5.113",
+    "@inkeep/cxkit-theme": "0.5.113",
+    "@inkeep/cxkit-types": "0.5.113"
   },
   "devDependencies": {
     "@biomejs/biome": "1.9.4",