@weavy/uikit-react 29.2.1 → 29.3.0

package/dist/types/hooks/useWeavyContext.d.ts

@@ -1,4 +1,3 @@
-import { default as React } from 'react';
 import { WeavyContext } from '@weavy/uikit-web';
 import { Context } from '@weavy/uikit-web/dist/types/contexts/index.js';
 /**
@@ -6,8 +5,8 @@ import { Context } from '@weavy/uikit-web/dist/types/contexts/index.js';
  * The useWeavyContext(ref) must be used with an element reference from any child from the DOM tree since it relies on standard events in the DOM.
  *
  * @see https://github.com/webcomponents-cg/community-protocols/blob/main/proposals/context.md
- * @param ref { React.RefObject | HTMLElement } - Reference object that needs to be placed in the DOM.
- * @param context { Context } - The context to use. Defaults to WeavyContext from ukit-web.
+ * @param ref { (() => HTMLElement) | HTMLElement } - Reference object or function returning a reference object. The object needs to be placed in the DOM.
+ * @param context { Context } - The context to use. Defaults to WeavyContext from uikit-web.
  * @returns Weavy instance
  * @example
  * import React, { useRef } from "react"
@@ -15,7 +14,7 @@ import { Context } from '@weavy/uikit-web/dist/types/contexts/index.js';
  *
  * export const MyComponent = () => {
  *   const domRef = useRef(null)
- *   const weavy = useWeavyContext(domRef)
+ *   const weavy = useWeavyContext(() => domRef.current)
  *
  *   useEffect(() => {
  *     if (weavy) {
@@ -31,5 +30,5 @@ import { Context } from '@weavy/uikit-web/dist/types/contexts/index.js';
  *   )
  * }
  */
-export declare function useWeavyContext<TContext extends Context<unknown, unknown> = typeof WeavyContext, TElement extends HTMLElement = HTMLElement>(ref: React.RefObject<TElement> | TElement | null, context?: TContext): import('@weavy/uikit-web').WeavyType | import('@weavy/uikit-web/dist/types/utils/context/create-context.js').ContextType<TContext> | undefined;
+export declare function useWeavyContext<TContext extends Context<unknown, unknown> = typeof WeavyContext, TElement extends HTMLElement = HTMLElement>(ref: (() => TElement | null) | TElement | null, context?: TContext): import('@weavy/uikit-web').WeavyType | import('@weavy/uikit-web/dist/types/utils/context/create-context.js').ContextType<TContext> | undefined;
 export type { Context };

package/lib/client/WyContext.tsx

@@ -27,7 +27,7 @@ export function WyContext({
   ...props
 }: React.ComponentProps<typeof WyContextComponent>) {
   const contextRef = useRef(null);
-  const weavy = useWeavyContext(contextRef.current);
+  const weavy = useWeavyContext(() => contextRef.current);
   return (
     <WyContextComponent ref={contextRef} {...props}>
       <WeavyContext.Provider value={weavy ?? null}>

package/lib/hooks/useWeavyContext.ts

@@ -8,8 +8,8 @@ import { Context } from "@weavy/uikit-web/dist/types/contexts/index.js";
  * The useWeavyContext(ref) must be used with an element reference from any child from the DOM tree since it relies on standard events in the DOM.
  * 
  * @see https://github.com/webcomponents-cg/community-protocols/blob/main/proposals/context.md
- * @param ref { React.RefObject | HTMLElement } - Reference object that needs to be placed in the DOM.
- * @param context { Context } - The context to use. Defaults to WeavyContext from ukit-web.
+ * @param ref { (() => HTMLElement) | HTMLElement } - Reference object or function returning a reference object. The object needs to be placed in the DOM.
+ * @param context { Context } - The context to use. Defaults to WeavyContext from uikit-web.
  * @returns Weavy instance 
  * @example
  * import React, { useRef } from "react"
@@ -17,7 +17,7 @@ import { Context } from "@weavy/uikit-web/dist/types/contexts/index.js";
  * 
  * export const MyComponent = () => {
  *   const domRef = useRef(null)
- *   const weavy = useWeavyContext(domRef)
+ *   const weavy = useWeavyContext(() => domRef.current)
  * 
  *   useEffect(() => {
  *     if (weavy) {
@@ -34,13 +34,13 @@ import { Context } from "@weavy/uikit-web/dist/types/contexts/index.js";
  * }
  */
 export function useWeavyContext<TContext extends Context<unknown, unknown> = typeof WeavyContext, TElement extends HTMLElement = HTMLElement>(
-  ref: React.RefObject<TElement> | TElement | null,
+  ref: (() => TElement | null) | TElement | null,
   context?: TContext
 ) {
-  const isRef = (r: typeof ref): r is React.RefObject<TElement> => {
-    return Boolean(r) && (r as React.RefObject<TElement>).current !== undefined
-}
-  const domRef = (isRef(ref) ? ref.current : ref) || undefined;
+  // Using ref.current for backward compatibility only
+
+  // eslint-disable-next-line react-hooks/refs
+  const domRef = (typeof ref === "function" ? ref() : (ref && "current" in ref) ? ref.current as HTMLElement : ref) || undefined;
 
   const controller = useController(
     React,
@@ -49,8 +49,9 @@ export function useWeavyContext<TContext extends Context<unknown, unknown> = typ
 
   useEffect(() => {
     if (domRef) {
-      controller.ref = domRef;
+      controller.setRef(domRef);
     }
+  // eslint-disable-next-line react-hooks/refs
   }, [controller, domRef]);
 
   return controller.context?.value;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@weavy/uikit-react",
-  "version": "29.2.1",
+  "version": "29.3.0",
   "author": "Weavy",
   "description": "React components UI-kit for Weavy",
   "homepage": "https://github.com/weavy/weavy-uikit-react",
@@ -39,38 +39,38 @@
     "lint": "eslint lib"
   },
   "dependencies": {
-    "@lit/react": "^1.0.7",
-    "@weavy/uikit-web": "^29.2.1"
+    "@lit/react": "^1.0.8",
+    "@weavy/uikit-web": "^29.3.0"
   },
   "peerDependencies": {
     "react": ">=16",
     "react-dom": ">=16"
   },
   "devDependencies": {
-    "@babel/preset-env": "^7.27.2",
-    "@babel/preset-react": "^7.27.1",
+    "@babel/preset-env": "^7.28.5",
+    "@babel/preset-react": "^7.28.5",
     "@eslint/js": "^9.29.0",
-    "@rollup/plugin-babel": "^6.0.4",
-    "@rollup/plugin-node-resolve": "^16.0.1",
-    "@types/node": "^22.15.32",
-    "@types/react": "^18.3.23",
+    "@rollup/plugin-babel": "^6.1.0",
+    "@rollup/plugin-node-resolve": "^16.0.3",
+    "@types/node": "^22.19.0",
+    "@types/react": "^18.3.26",
     "@types/react-dom": "^18.3.7",
-    "@vitejs/plugin-react": "^4.5.2",
-    "dotenv": "^16.5.0",
-    "eslint": "^9.29.0",
+    "@vitejs/plugin-react": "^5.1.0",
+    "dotenv": "^17.2.3",
+    "eslint": "^9.39.1",
     "eslint-plugin-react": "^7.37.5",
-    "eslint-plugin-react-hooks": "^5.2.0",
-    "eslint-plugin-react-refresh": "^0.4.20",
-    "globals": "^16.2.0",
+    "eslint-plugin-react-hooks": "^7.0.1",
+    "eslint-plugin-react-refresh": "^0.4.24",
+    "globals": "^16.5.0",
     "npm-run-all": "^4.1.5",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
-    "rimraf": "^6.0.1",
+    "rimraf": "^6.1.0",
     "rollup-preserve-directives": "^1.1.3",
-    "sass": "^1.89.2",
-    "typescript": "^5.8.3",
-    "typescript-eslint": "^8.34.1",
-    "vite": "^6.3.5",
+    "sass": "^1.93.3",
+    "typescript": "^5.9.3",
+    "typescript-eslint": "^8.46.3",
+    "vite": "^7.2.0",
     "vite-plugin-dts": "^4.5.4"
   }
 }