ditox-react 3.2.0 → 3.3.1

package/dist/index.umd.js

@@ -0,0 +1,179 @@
+(function(global, factory) {
+  typeof exports === 'object' && typeof module !== 'undefined' ?  factory(exports, require('ditox'), require('react')) :
+  typeof define === 'function' && define.amd ? define(['exports', 'ditox', 'react'], factory) :
+  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.DitoxReact = {}), global.Ditox,global.React));
+})(this, function(exports, ditox, react) {
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+//#region \0rolldown/runtime.js
+	var __create = Object.create;
+	var __defProp = Object.defineProperty;
+	var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+	var __getOwnPropNames = Object.getOwnPropertyNames;
+	var __getProtoOf = Object.getPrototypeOf;
+	var __hasOwnProp = Object.prototype.hasOwnProperty;
+	var __copyProps = (to, from, except, desc) => {
+		if (from && typeof from === "object" || typeof from === "function") {
+			for (var keys = __getOwnPropNames(from), i = 0, n = keys.length, key; i < n; i++) {
+				key = keys[i];
+				if (!__hasOwnProp.call(to, key) && key !== except) {
+					__defProp(to, key, {
+						get: ((k) => from[k]).bind(null, key),
+						enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+					});
+				}
+			}
+		}
+		return to;
+	};
+	var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", {
+		value: mod,
+		enumerable: true
+	}) : target, mod));
+
+//#endregion
+react = __toESM(react);
+
+//#region src/DependencyContainer.tsx
+	const DependencyContainerContext = (0, react.createContext)(void 0);
+	/**
+	* Provides a new dependency container to React app
+	*
+	* This component creates a new container and provides it to React children.
+	*
+	* If a `binder` callback is specified, it will be called for the new container
+	* to bind it with dependencies.
+	*
+	* If a parent container exists, it is connected to the current one by default.
+	* To create a root container specify `root` parameter as `true`,
+	* and the container will not depend on any parent container.
+	*
+	* @param params.binder - A callback which sets up bindings for the container.
+	* @param params.root - If `true` then a new container does not depend on any parent containers
+	*
+	* @example
+	*
+	* ```tsx
+	* const TOKEN = token();
+	*
+	* function appDependencyBinder(container: Container) {
+	*   container.bindValue(TOKEN, 'value');
+	* }
+	*
+	* function App() {
+	*   return (
+	*     <DependencyContainer root binder={appDependencyBinder}>
+	*       <NestedComponent />
+	*     </DependencyContainer>
+	*   );
+	* }
+	* ```
+	*
+	*/
+	function DependencyContainer(params) {
+		const { children, root, binder } = params;
+		const parentContainer = (0, react.useContext)(DependencyContainerContext);
+		const container = (0, react.useMemo)(() => {
+			const container = (0, ditox.createContainer)(root ? void 0 : parentContainer);
+			binder === null || binder === void 0 || binder(container);
+			return container;
+		}, [
+			binder,
+			parentContainer,
+			root
+		]);
+		(0, react.useEffect)(() => {
+			return () => container.removeAll();
+		}, [container]);
+		return /* @__PURE__ */ react.default.createElement(DependencyContainerContext.Provider, { value: container }, children);
+	}
+	/**
+	* Provides a custom dependency container to React app
+	*
+	* @param params.container - a custom container
+	*
+	* @example
+	* ```tsx
+	* const container = useMemo(() => {
+	*   return createContainer();
+	* });
+	*
+	* return (
+	*   <CustomDependencyContainer container={container}>
+	*     {children}
+	*   </CustomDependencyContainer>
+	* );
+	* ```
+	*/
+	function CustomDependencyContainer(params) {
+		const { children, container } = params;
+		return /* @__PURE__ */ react.default.createElement(DependencyContainerContext.Provider, { value: container }, children);
+	}
+
+//#endregion
+//#region src/DependencyModule.tsx
+/**
+	* Binds the module to a new dependency container.
+	*
+	* If a parent container exists, it is connected to the current one by default.
+	*
+	* @param params.module - Module declaration for binding
+	* @param params.scope - Optional scope for binding: `singleton` (default) or `scoped`.
+	*
+	* @example
+	*
+	* ```tsx
+	* const LOGGER_MODULE: ModuleDeclaration<LoggerModule> = {};
+	*
+	* function App() {
+	*   return (
+	*     <DependencyModule module={LOGGER_MODULE}>
+	*       <NestedComponent />
+	*     </DependencyModule>
+	*   );
+	* }
+	* ```
+	*/
+	function DependencyModule(params) {
+		const { children, module, scope } = params;
+		const binder = (0, react.useCallback)((container) => (0, ditox.bindModule)(container, module, { scope }), [module, scope]);
+		return /* @__PURE__ */ react.default.createElement(DependencyContainer, { binder }, children);
+	}
+
+//#endregion
+//#region src/hooks.ts
+/**
+	* @internal
+	*/
+	function useDependencyContainer(mode) {
+		const container = (0, react.useContext)(DependencyContainerContext);
+		if (!container && mode === "strict") throw new Error("Container is not provided by DependencyContainer component");
+		return container;
+	}
+	/**
+	* @category Hook
+	*
+	* Returns a dependency by token, or fails with an error.
+	*/
+	function useDependency(token) {
+		const container = useDependencyContainer("strict");
+		return (0, react.useMemo)(() => container.resolve(token), [container, token]);
+	}
+	/**
+	* @category Hook
+	*
+	* Returns a dependency by token, or `undefined` in case the dependency is not provided.
+	*/
+	function useOptionalDependency(token) {
+		const container = useDependencyContainer();
+		return (0, react.useMemo)(() => container === null || container === void 0 ? void 0 : container.get(token), [container, token]);
+	}
+
+//#endregion
+exports.CustomDependencyContainer = CustomDependencyContainer;
+exports.DependencyContainer = DependencyContainer;
+exports.DependencyModule = DependencyModule;
+exports.useDependency = useDependency;
+exports.useDependencyContainer = useDependencyContainer;
+exports.useOptionalDependency = useOptionalDependency;
+});
+//# sourceMappingURL=index.umd.js.map

package/dist/index.umd.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.umd.js","names":[],"sources":["../src/DependencyContainer.tsx","../src/DependencyModule.tsx","../src/hooks.ts"],"sourcesContent":["import type { Container } from 'ditox';\nimport { createContainer } from 'ditox';\nimport React, {\n  createContext,\n  ReactElement,\n  ReactNode,\n  useContext,\n  useEffect,\n  useMemo,\n} from 'react';\n\nexport const DependencyContainerContext = createContext<Container | undefined>(\n  undefined,\n);\n\n/**\n * A callback for binding dependencies to a container\n */\nexport type DependencyContainerBinder = (container: Container) => unknown;\n\n/**\n * Specifies options for a new container:\n * @property binder - A callback which sets up bindings for the container.\n * @property root - If `true` then a new container does not depend on any parent containers\n */\nexport type DependencyContainerParams = {\n  children: ReactNode;\n  root?: boolean;\n  binder?: DependencyContainerBinder;\n};\n\n/**\n * Provides a new dependency container to React app\n *\n * This component creates a new container and provides it to React children.\n *\n * If a `binder` callback is specified, it will be called for the new container\n * to bind it with dependencies.\n *\n * If a parent container exists, it is connected to the current one by default.\n * To create a root container specify `root` parameter as `true`,\n * and the container will not depend on any parent container.\n *\n * @param params.binder - A callback which sets up bindings for the container.\n * @param params.root - If `true` then a new container does not depend on any parent containers\n *\n * @example\n *\n * ```tsx\n * const TOKEN = token();\n *\n * function appDependencyBinder(container: Container) {\n *   container.bindValue(TOKEN, 'value');\n * }\n *\n * function App() {\n *   return (\n *     <DependencyContainer root binder={appDependencyBinder}>\n *       <NestedComponent />\n *     </DependencyContainer>\n *   );\n * }\n * ```\n *\n */\nexport function DependencyContainer(\n  params: DependencyContainerParams,\n): ReactElement {\n  const { children, root, binder } = params;\n  const parentContainer = useContext(DependencyContainerContext);\n\n  const container = useMemo(() => {\n    const container = createContainer(root ? undefined : parentContainer);\n    binder?.(container);\n\n    return container;\n  }, [binder, parentContainer, root]);\n\n  useEffect(() => {\n    return () => container.removeAll();\n  }, [container]);\n\n  return (\n    <DependencyContainerContext.Provider value={container}>\n      {children}\n    </DependencyContainerContext.Provider>\n  );\n}\n\n/**\n * Provides a custom dependency container to React app\n *\n * @param params.container - a custom container\n *\n * @example\n * ```tsx\n * const container = useMemo(() => {\n *   return createContainer();\n * });\n *\n * return (\n *   <CustomDependencyContainer container={container}>\n *     {children}\n *   </CustomDependencyContainer>\n * );\n * ```\n */\nexport function CustomDependencyContainer(params: {\n  children: ReactNode;\n  container: Container;\n}): ReactElement {\n  const { children, container } = params;\n\n  return (\n    <DependencyContainerContext.Provider value={container}>\n      {children}\n    </DependencyContainerContext.Provider>\n  );\n}\n","import type { Module, ModuleDeclaration } from 'ditox';\nimport { bindModule } from 'ditox';\nimport React, { ReactElement, ReactNode, useCallback } from 'react';\nimport {\n  DependencyContainer,\n  DependencyContainerBinder,\n} from './DependencyContainer';\n\n/**\n * Binds the module to a new dependency container.\n *\n * If a parent container exists, it is connected to the current one by default.\n *\n * @param params.module - Module declaration for binding\n * @param params.scope - Optional scope for binding: `singleton` (default) or `scoped`.\n *\n * @example\n *\n * ```tsx\n * const LOGGER_MODULE: ModuleDeclaration<LoggerModule> = {};\n *\n * function App() {\n *   return (\n *     <DependencyModule module={LOGGER_MODULE}>\n *       <NestedComponent />\n *     </DependencyModule>\n *   );\n * }\n * ```\n */\nexport function DependencyModule(params: {\n  children: ReactNode;\n  module: ModuleDeclaration<Module<Record<string, unknown>>>;\n  scope?: 'scoped' | 'singleton';\n}): ReactElement {\n  const { children, module, scope } = params;\n\n  const binder: DependencyContainerBinder = useCallback(\n    (container) => bindModule(container, module, { scope }),\n    [module, scope],\n  );\n\n  return <DependencyContainer binder={binder}>{children}</DependencyContainer>;\n}\n","import { Container, Token } from 'ditox';\nimport { useContext, useMemo } from 'react';\nimport { DependencyContainerContext } from './DependencyContainer';\n\n/**\n * @category Hook\n *\n * Returns a dependency container. Throws an error in case the container is not provided.\n */\nexport function useDependencyContainer(mode: 'strict'): Container;\n/**\n * @category Hook\n *\n * Returns a dependency container, or `undefined` in case the container is not provided.\n */\nexport function useDependencyContainer(\n  mode?: 'optional',\n): Container | undefined;\n/**\n * @internal\n */\nexport function useDependencyContainer(\n  mode?: 'strict' | 'optional',\n): Container | undefined {\n  const container = useContext(DependencyContainerContext);\n\n  if (!container && mode === 'strict') {\n    throw new Error(\n      'Container is not provided by DependencyContainer component',\n    );\n  }\n\n  return container;\n}\n\n/**\n * @category Hook\n *\n * Returns a dependency by token, or fails with an error.\n */\nexport function useDependency<T>(token: Token<T>): T {\n  const container = useDependencyContainer('strict');\n  const value = useMemo(() => container.resolve(token), [container, token]);\n  return value;\n}\n\n/**\n * @category Hook\n *\n * Returns a dependency by token, or `undefined` in case the dependency is not provided.\n */\nexport function useOptionalDependency<T>(token: Token<T>): T | undefined {\n  const container = useDependencyContainer();\n  const value = useMemo(() => container?.get(token), [container, token]);\n  return value;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAWA,MAAa,sDACX,OACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoDD,SAAgB,oBACd,QACc;EACd,MAAM,EAAE,UAAU,MAAM,WAAW;EACnC,MAAM,wCAA6B,2BAA2B;EAE9D,MAAM,qCAA0B;GAC9B,MAAM,uCAA4B,OAAO,SAAY,gBAAgB;AACrE,kDAAS,UAAU;AAEnB,UAAO;KACN;GAAC;GAAQ;GAAiB;GAAK,CAAC;AAEnC,6BAAgB;AACd,gBAAa,UAAU,WAAW;KACjC,CAAC,UAAU,CAAC;AAEf,SACE,4CAAC,2BAA2B,YAAS,OAAO,aACzC,SACmC;;;;;;;;;;;;;;;;;;;;CAsB1C,SAAgB,0BAA0B,QAGzB;EACf,MAAM,EAAE,UAAU,cAAc;AAEhC,SACE,4CAAC,2BAA2B,YAAS,OAAO,aACzC,SACmC;;;;;;;;;;;;;;;;;;;;;;;;;;;CCtF1C,SAAgB,iBAAiB,QAIhB;EACf,MAAM,EAAE,UAAU,QAAQ,UAAU;EAEpC,MAAM,iCACH,oCAAyB,WAAW,QAAQ,EAAE,OAAO,CAAC,EACvD,CAAC,QAAQ,MAAM,CAChB;AAED,SAAO,4CAAC,uBAA4B,UAAS,SAA+B;;;;;;;;CCrB9E,SAAgB,uBACd,MACuB;EACvB,MAAM,kCAAuB,2BAA2B;AAExD,MAAI,CAAC,aAAa,SAAS,SACzB,OAAM,IAAI,MACR,6DACD;AAGH,SAAO;;;;;;;CAQT,SAAgB,cAAiB,OAAoB;EACnD,MAAM,YAAY,uBAAuB,SAAS;AAElD,kCAD4B,UAAU,QAAQ,MAAM,EAAE,CAAC,WAAW,MAAM,CAAC;;;;;;;CAS3E,SAAgB,sBAAyB,OAAgC;EACvE,MAAM,YAAY,wBAAwB;AAE1C,wFAD4B,UAAW,IAAI,MAAM,EAAE,CAAC,WAAW,MAAM,CAAC"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "ditox-react",
-  "version": "3.2.0",
-  "description": "Dependency injection container for React.js",
+  "version": "3.3.1",
+  "description": "Dependency injection for web applications: adapters for React.js",
   "publishConfig": {
     "access": "public"
   },
@@ -11,7 +11,7 @@
   "bugs": "https://github.com/mnasyrov/ditox/issues",
   "repository": {
     "type": "git",
-    "url": "https://github.com/mnasyrov/ditox.git"
+    "url": "git+https://github.com/mnasyrov/ditox.git"
   },
   "keywords": [
     "react",
@@ -31,16 +31,6 @@
   "engines": {
     "node": ">=12"
   },
-  "main": "dist/cjs/index.js",
-  "module": "dist/esm/index.js",
-  "jsnext:main": "dist/esm/index.js",
-  "unpkg": "dist/umd/index.js",
-  "umd:main": "dist/umd/index.js",
-  "browser": "dist/browser/index.js",
-  "react-native": "dist/browser/index.js",
-  "types": "dist/esm/index.d.ts",
-  "source": "src/index.ts",
-  "sideEffects": false,
   "files": [
     "dist",
     "docs",
@@ -48,18 +38,29 @@
     "LICENSE",
     "README.md"
   ],
+  "type": "module",
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
+  "unpkg": "dist/index.umd.js",
+  "umd:main": "dist/index.umd.js",
+  "browser": "dist/index.js",
+  "react-native": "dist/index.js",
+  "types": "./dist/index.d.cts",
+  "source": "src/index.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/index.js",
+      "require": "./dist/index.cjs"
+    },
+    "./package.json": "./package.json"
+  },
   "scripts": {
-    "clean": "shx rm -rf dist lib",
-    "build": "npm run build:cjs && npm run build:esm && npm run build:rollup",
-    "build:cjs": "tsc -p tsconfig.build.json --outDir dist/cjs --module commonjs",
-    "build:esm": "tsc -p tsconfig.build.json --outDir dist/esm --module es2015",
-    "build:rollup": "rollup -c",
+    "clean": "rm -rf dist lib",
+    "build": "tsdown",
     "typedoc": "typedoc"
   },
-  "dependencies": {
-    "ditox": "3.2.0"
-  },
   "peerDependencies": {
+    "ditox": "^3.2.0",
     "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
   },
   "devDependencies": {
@@ -68,6 +69,5 @@
     "react": "19.0.0",
     "react-dom": "19.0.0",
     "react-test-renderer": "19.0.0"
-  },
-  "gitHead": "493e9ba9fcb36feea88e3948a23a4249a119d03e"
+  }
 }

package/src/DependencyContainer.test.tsx

@@ -1,20 +1,17 @@
-/**
- * @jest-environment jsdom
- */
-
-import {render, renderHook} from '@testing-library/react';
-import {Container, createContainer, Token, token} from 'ditox';
-import React, {useEffect} from 'react';
+import { render, renderHook } from '@testing-library/react';
+import { Container, createContainer, Token, token } from 'ditox';
+import React, { useEffect } from 'react';
+import { describe, expect, it, Mock, vi } from 'vitest';
 import {
   CustomDependencyContainer,
   DependencyContainer,
 } from './DependencyContainer';
-import {useDependencyContainer} from './hooks';
+import { useDependencyContainer } from './hooks';
 
 describe('DependencyContainer', () => {
   it('should provide a new container', () => {
-    const {result} = renderHook(useDependencyContainer, {
-      wrapper: ({children}) => (
+    const { result } = renderHook(useDependencyContainer, {
+      wrapper: ({ children }) => (
         <DependencyContainer>{children}</DependencyContainer>
       ),
     });
@@ -33,8 +30,8 @@ describe('DependencyContainer', () => {
       container.bindValue(BAR, 'bar');
     };
 
-    const {result} = renderHook(() => useDependencyContainer('strict'), {
-      wrapper: ({children}) => (
+    const { result } = renderHook(() => useDependencyContainer('strict'), {
+      wrapper: ({ children }) => (
         <CustomDependencyContainer container={parentContainer}>
           <DependencyContainer binder={binder}>{children}</DependencyContainer>
         </CustomDependencyContainer>
@@ -56,8 +53,8 @@ describe('DependencyContainer', () => {
       container.bindValue(BAR, 'bar');
     };
 
-    const {result} = renderHook(() => useDependencyContainer('strict'), {
-      wrapper: ({children}) => (
+    const { result } = renderHook(() => useDependencyContainer('strict'), {
+      wrapper: ({ children }) => (
         <CustomDependencyContainer container={parentContainer}>
           <DependencyContainer root binder={binder}>
             {children}
@@ -82,7 +79,7 @@ describe('DependencyContainer', () => {
     const [FooMonitor, fooCallback] = createMonitor(FOO);
     const [BarMonitor, barCallback] = createMonitor(BAR);
 
-    const {rerender} = render(
+    const { rerender } = render(
       <CustomDependencyContainer container={parentContainer}>
         <DependencyContainer root={false} binder={binder}>
           <FooMonitor />
@@ -126,7 +123,7 @@ describe('DependencyContainer', () => {
     const [FooMonitor, fooCallback] = createMonitor(FOO);
     const [BarMonitor, barCallback] = createMonitor(BAR);
 
-    const {rerender} = render(
+    const { rerender } = render(
       <CustomDependencyContainer container={parentContainer}>
         <DependencyContainer root={true} binder={binder}>
           <FooMonitor />
@@ -163,8 +160,8 @@ describe('DependencyContainer', () => {
 
     const binder = (container: Container) => container.bindValue(FOO, 'foo');
 
-    const {result} = renderHook(() => useDependencyContainer('strict'), {
-      wrapper: ({children}) => (
+    const { result } = renderHook(() => useDependencyContainer('strict'), {
+      wrapper: ({ children }) => (
         <DependencyContainer binder={binder}>{children}</DependencyContainer>
       ),
     });
@@ -175,17 +172,17 @@ describe('DependencyContainer', () => {
   it('should remove all bindings from a previous container in case "binder" is changed', () => {
     const FOO = token('FOO');
 
-    const removeHandler1 = jest.fn();
+    const removeHandler1 = vi.fn();
     const binder1 = (container: Container) =>
-      container.bindFactory(FOO, () => 'foo1', {onRemoved: removeHandler1});
+      container.bindFactory(FOO, () => 'foo1', { onRemoved: removeHandler1 });
 
-    const removeHandler2 = jest.fn();
+    const removeHandler2 = vi.fn();
     const binder2 = (container: Container) =>
-      container.bindFactory(FOO, () => 'foo2', {onRemoved: removeHandler2});
+      container.bindFactory(FOO, () => 'foo2', { onRemoved: removeHandler2 });
 
     const [Monitor, monitorCallback] = createMonitor(FOO);
 
-    const {rerender} = render(
+    const { rerender } = render(
       <DependencyContainer binder={binder1}>
         <Monitor />
       </DependencyContainer>,
@@ -220,13 +217,13 @@ describe('DependencyContainer', () => {
   it('should remove all bindings from a previous container in case "root" is changed', () => {
     const FOO = token('FOO');
 
-    const removeHandler1 = jest.fn();
+    const removeHandler1 = vi.fn();
     const binder1 = (container: Container) =>
-      container.bindFactory(FOO, () => 'foo1', {onRemoved: removeHandler1});
+      container.bindFactory(FOO, () => 'foo1', { onRemoved: removeHandler1 });
 
     const [Monitor, monitorCallback] = createMonitor(FOO);
 
-    const {rerender} = render(
+    const { rerender } = render(
       <DependencyContainer binder={binder1} root={false}>
         <Monitor />
       </DependencyContainer>,
@@ -261,8 +258,8 @@ describe('CustomDependencyContainer', () => {
     const container = createContainer();
     container.bindValue(FOO, 'foo');
 
-    const {result} = renderHook(useDependencyContainer, {
-      wrapper: ({children}) => (
+    const { result } = renderHook(useDependencyContainer, {
+      wrapper: ({ children }) => (
         <CustomDependencyContainer container={container}>
           {children}
         </CustomDependencyContainer>
@@ -275,17 +272,17 @@ describe('CustomDependencyContainer', () => {
   it('should not clean a custom container on rerender or unmount', () => {
     const FOO = token('FOO');
 
-    const removeHandler1 = jest.fn();
+    const removeHandler1 = vi.fn();
     const container1 = createContainer();
-    container1.bindFactory(FOO, () => 'foo1', {onRemoved: removeHandler1});
+    container1.bindFactory(FOO, () => 'foo1', { onRemoved: removeHandler1 });
 
-    const removeHandler2 = jest.fn();
+    const removeHandler2 = vi.fn();
     const container2 = createContainer();
-    container2.bindFactory(FOO, () => 'foo2', {onRemoved: removeHandler2});
+    container2.bindFactory(FOO, () => 'foo2', { onRemoved: removeHandler2 });
 
     const [Monitor, monitorCallback] = createMonitor(FOO);
 
-    const {rerender} = render(
+    const { rerender } = render(
       <CustomDependencyContainer container={container1}>
         <Monitor />
       </CustomDependencyContainer>,
@@ -307,8 +304,8 @@ describe('CustomDependencyContainer', () => {
   });
 });
 
-function createMonitor<T>(token: Token<T>): [() => null, jest.Mock] {
-  const callback = jest.fn();
+function createMonitor<T>(token: Token<T>): [() => null, Mock] {
+  const callback = vi.fn();
 
   const Monitor = () => {
     const container = useDependencyContainer();

package/src/DependencyContainer.tsx

@@ -1,5 +1,5 @@
-import type {Container} from 'ditox';
-import {createContainer} from 'ditox';
+import type { Container } from 'ditox';
+import { createContainer } from 'ditox';
 import React, {
   createContext,
   ReactElement,
@@ -66,7 +66,7 @@ export type DependencyContainerParams = {
 export function DependencyContainer(
   params: DependencyContainerParams,
 ): ReactElement {
-  const {children, root, binder} = params;
+  const { children, root, binder } = params;
   const parentContainer = useContext(DependencyContainerContext);
 
   const container = useMemo(() => {
@@ -96,7 +96,7 @@ export function DependencyContainer(
  * ```tsx
  * const container = useMemo(() => {
  *   return createContainer();
- * }
+ * });
  *
  * return (
  *   <CustomDependencyContainer container={container}>
@@ -109,7 +109,7 @@ export function CustomDependencyContainer(params: {
   children: ReactNode;
   container: Container;
 }): ReactElement {
-  const {children, container} = params;
+  const { children, container } = params;
 
   return (
     <DependencyContainerContext.Provider value={container}>

package/src/DependencyModule.test.tsx

@@ -1,4 +1,4 @@
-import {renderHook} from '@testing-library/react';
+import { renderHook } from '@testing-library/react';
 import {
   bindModule,
   createContainer,
@@ -7,12 +7,13 @@ import {
   token,
 } from 'ditox';
 import React from 'react';
-import {CustomDependencyContainer} from './DependencyContainer';
-import {DependencyModule} from './DependencyModule';
-import {useDependency} from './hooks';
+import { describe, expect, it } from 'vitest';
+import { CustomDependencyContainer } from './DependencyContainer';
+import { DependencyModule } from './DependencyModule';
+import { useDependency } from './hooks';
 
 describe('DependencyModule', () => {
-  type TestModule = Module<{value: number}>;
+  type TestModule = Module<{ value: number }>;
 
   const MODULE_TOKEN = token<TestModule>();
   const VALUE_TOKEN = token<number>();
@@ -28,8 +29,8 @@ describe('DependencyModule', () => {
   };
 
   it('should bind a module and its provided values', () => {
-    const {result} = renderHook(() => useDependency(VALUE_TOKEN), {
-      wrapper: ({children}) => (
+    const { result } = renderHook(() => useDependency(VALUE_TOKEN), {
+      wrapper: ({ children }) => (
         <DependencyModule module={MODULE}>{children}</DependencyModule>
       ),
     });
@@ -42,8 +43,8 @@ describe('DependencyModule', () => {
     bindModule(parent, MODULE);
     const parentModule = parent.resolve(MODULE_TOKEN);
 
-    const {result} = renderHook(() => useDependency(MODULE_TOKEN), {
-      wrapper: ({children}) => (
+    const { result } = renderHook(() => useDependency(MODULE_TOKEN), {
+      wrapper: ({ children }) => (
         <CustomDependencyContainer container={parent}>
           <DependencyModule module={MODULE} scope="scoped">
             {children}

package/src/DependencyModule.tsx

@@ -1,6 +1,6 @@
-import type {Module, ModuleDeclaration} from 'ditox';
-import {bindModule} from 'ditox';
-import React, {ReactElement, ReactNode, useCallback} from 'react';
+import type { Module, ModuleDeclaration } from 'ditox';
+import { bindModule } from 'ditox';
+import React, { ReactElement, ReactNode, useCallback } from 'react';
 import {
   DependencyContainer,
   DependencyContainerBinder,
@@ -17,7 +17,7 @@ import {
  * @example
  *
  * ```tsx
- * const LOGGER_MODULE: ModuleDeclaration<LoggerModule> = {
+ * const LOGGER_MODULE: ModuleDeclaration<LoggerModule> = {};
  *
  * function App() {
  *   return (
@@ -33,10 +33,10 @@ export function DependencyModule(params: {
   module: ModuleDeclaration<Module<Record<string, unknown>>>;
   scope?: 'scoped' | 'singleton';
 }): ReactElement {
-  const {children, module, scope} = params;
+  const { children, module, scope } = params;
 
   const binder: DependencyContainerBinder = useCallback(
-    (container) => bindModule(container, module, {scope}),
+    (container) => bindModule(container, module, { scope }),
     [module, scope],
   );
 

package/src/hooks.test.tsx

@@ -1,7 +1,8 @@
-import {renderHook} from '@testing-library/react';
-import {createContainer, token} from 'ditox';
+import { renderHook } from '@testing-library/react';
+import { createContainer, token } from 'ditox';
 import React from 'react';
-import {CustomDependencyContainer} from './DependencyContainer';
+import { beforeAll, describe, expect, it, vi } from 'vitest';
+import { CustomDependencyContainer } from './DependencyContainer';
 import {
   useDependency,
   useDependencyContainer,
@@ -9,15 +10,15 @@ import {
 } from './hooks';
 
 beforeAll(() => {
-  jest.spyOn(console, 'error').mockImplementation();
+  vi.spyOn(console, 'error').mockImplementation(() => {});
 });
 
 describe('useDependencyContainer()', () => {
   it('should return a provided container in "strict" mode', () => {
     const container = createContainer();
 
-    const {result} = renderHook(() => useDependencyContainer('strict'), {
-      wrapper: ({children}) => (
+    const { result } = renderHook(() => useDependencyContainer('strict'), {
+      wrapper: ({ children }) => (
         <CustomDependencyContainer container={container}>
           {children}
         </CustomDependencyContainer>
@@ -36,8 +37,8 @@ describe('useDependencyContainer()', () => {
   it('should return a provided container in "optional" mode', () => {
     const container = createContainer();
 
-    const {result} = renderHook(() => useDependencyContainer(), {
-      wrapper: ({children}) => (
+    const { result } = renderHook(() => useDependencyContainer(), {
+      wrapper: ({ children }) => (
         <CustomDependencyContainer container={container}>
           {children}
         </CustomDependencyContainer>
@@ -48,7 +49,7 @@ describe('useDependencyContainer()', () => {
   });
 
   it('should return "undefined" in "optional" mode in case a container is not provided', () => {
-    const {result} = renderHook(() => useDependencyContainer());
+    const { result } = renderHook(() => useDependencyContainer());
     expect(result.current).toBeUndefined();
   });
 });
@@ -59,8 +60,8 @@ describe('useDependency()', () => {
     const container = createContainer();
     container.bindValue(TOKEN, 'value');
 
-    const {result} = renderHook(() => useDependency(TOKEN), {
-      wrapper: ({children}) => (
+    const { result } = renderHook(() => useDependency(TOKEN), {
+      wrapper: ({ children }) => (
         <CustomDependencyContainer container={container}>
           {children}
         </CustomDependencyContainer>
@@ -84,7 +85,7 @@ describe('useDependency()', () => {
 
     expect(() => {
       renderHook(() => useDependency(TOKEN), {
-        wrapper: ({children}) => (
+        wrapper: ({ children }) => (
           <CustomDependencyContainer container={container}>
             {children}
           </CustomDependencyContainer>
@@ -100,8 +101,8 @@ describe('useOptionalDependency()', () => {
     const container = createContainer();
     container.bindValue(TOKEN, 'value');
 
-    const {result} = renderHook(() => useOptionalDependency(TOKEN), {
-      wrapper: ({children}) => (
+    const { result } = renderHook(() => useOptionalDependency(TOKEN), {
+      wrapper: ({ children }) => (
         <CustomDependencyContainer container={container}>
           {children}
         </CustomDependencyContainer>
@@ -114,7 +115,7 @@ describe('useOptionalDependency()', () => {
   it('should return "undefined" in case a container is not provided', () => {
     const TOKEN = token('token');
 
-    const {result} = renderHook(() => useOptionalDependency(TOKEN));
+    const { result } = renderHook(() => useOptionalDependency(TOKEN));
 
     expect(result.current).toBeUndefined();
   });
@@ -123,8 +124,8 @@ describe('useOptionalDependency()', () => {
     const TOKEN = token('token');
     const container = createContainer();
 
-    const {result} = renderHook(() => useOptionalDependency(TOKEN), {
-      wrapper: ({children}) => (
+    const { result } = renderHook(() => useOptionalDependency(TOKEN), {
+      wrapper: ({ children }) => (
         <CustomDependencyContainer container={container}>
           {children}
         </CustomDependencyContainer>

package/src/hooks.ts

@@ -1,6 +1,6 @@
-import {Container, Token} from 'ditox';
-import {useContext, useMemo} from 'react';
-import {DependencyContainerContext} from './DependencyContainer';
+import { Container, Token } from 'ditox';
+import { useContext, useMemo } from 'react';
+import { DependencyContainerContext } from './DependencyContainer';
 
 /**
  * @category Hook