[feat]: new docs

.gitignore

@@ -222,3 +222,8 @@ generated
 # Reactuse
 
 **/registry.json
+
+
+# Docgen. Generated content
+packages/docs/content/docs/hooks/
+.source

.prettierignore

@@ -1,4 +1,5 @@
 **/dist
 **/node_modules
 **/cache
-**/pnpm-lock.yaml
+**/pnpm-lock.yaml
+**/.next

.prettierrc.mjs

@@ -1,3 +1,3 @@
-import { prettier } from "@siberiacancode/prettier";
+import { prettier } from '@siberiacancode/prettier';
 
-export default { ...prettier, plugins: ["prettier-plugin-tailwindcss"] };
+export default { ...prettier, plugins: ['prettier-plugin-tailwindcss'] };

packages/cli/src/registry/utils/extractDependencies.ts

@@ -4,9 +4,7 @@ export const extractDependencies = (content: string) => {
   const packages = new Set<string>();
 
   const hookMatches = Array.from(
-    content.matchAll(
-      /import\s+\{([^}]+)\}\s+from\s+['"]((?:@\/hooks)|(?:[^'"]*use[^'"]*))['"]/g
-    )
+    content.matchAll(/import\s+\{([^}]+)\}\s+from\s+['"]((?:@\/hooks)|(?:[^'"]*use[^'"]*))['"]/g)
   );
   for (const match of hookMatches) {
     const imports = match[1].split(',').map((item) => item.trim());

packages/core/eslint.config.mjs

@@ -1,47 +1,47 @@
-import { eslint } from "@siberiacancode/eslint";
+import { eslint } from '@siberiacancode/eslint';
 
 export default eslint(
   {
     typescript: true,
     javascript: true,
     react: true,
     jsx: true,
-    vue: true,
+    vue: true
   },
   {
-    name: "siberiacancode/core/md",
-    files: ["*.md"],
+    name: 'siberiacancode/core/md',
+    files: ['*.md'],
     rules: {
-      "react-refresh/only-export-components": "warn",
-    },
+      'react-refresh/only-export-components': 'warn'
+    }
   },
   {
-    name: "siberiacancode/core/ignores",
-    ignores: ["**/bundle/**/*.js"],
+    name: 'siberiacancode/core/ignores',
+    ignores: ['**/bundle/**/*.js']
   },
   {
-    name: "siberiacancode/core/hooks",
-    files: ["**/{hooks,helpers}/**/*.{ts,tsx}"],
+    name: 'siberiacancode/core/hooks',
+    files: ['**/{hooks,helpers}/**/*.{ts,tsx}'],
     rules: {
-      "react-dom/no-flush-sync": "warn",
-      "jsdoc/no-defaults": "off",
-      "react-hooks/rules-of-hooks": "warn",
-      "react/no-use-context": "off",
-      "react/no-context-provider": "off",
-    },
+      'react-dom/no-flush-sync': 'warn',
+      'jsdoc/no-defaults': 'off',
+      'react-hooks/rules-of-hooks': 'warn',
+      'react/no-use-context': 'off',
+      'react/no-context-provider': 'off'
+    }
   },
   {
-    name: "siberiacancode/core/tests",
-    files: ["**/*.test.ts"],
+    name: 'siberiacancode/core/tests',
+    files: ['**/*.test.ts'],
     rules: {
-      "react/no-create-ref": "off",
-    },
+      'react/no-create-ref': 'off'
+    }
   },
   {
-    name: "siberiacancode/core/demo",
-    files: ["**/*.demo.tsx"],
+    name: 'siberiacancode/core/demo',
+    files: ['**/*.demo.tsx'],
     rules: {
-      "no-alert": "off",
-    },
+      'no-alert': 'off'
+    }
   }
 );

packages/core/src/bundle/hooks/useDropZone/useDropZone.js

@@ -64,7 +64,7 @@ export const useDropZone = (...params) => {
   const dataTypes = options.dataTypes;
   const getFiles = (event) => {
     if (!event.dataTransfer) return null;
-    const list = Array.from(event.dataTransfer.files);
+    const list = [...event.dataTransfer.files];
     if (options.multiple) return list;
     if (!list.length) return null;
     return [list[0]];
@@ -77,7 +77,7 @@ export const useDropZone = (...params) => {
     return types.every((type) => dataTypes.some((dataType) => type.includes(dataType)));
   };
   const checkValidity = (items) => {
-    const types = Array.from(items).map((item) => item.type);
+    const types = Array.from(items, (item) => item.type);
     const dataTypesValid = checkDataTypes(types);
     const multipleFilesValid = options.multiple || items.length <= 1;
     return dataTypesValid && multipleFilesValid;

packages/core/src/hooks/useClickOutside/useClickOutside.demo.tsx

@@ -1,4 +1,4 @@
-import { cn } from '@siberiacancode/docs/utils';
+import { cn } from '../../../../docs/lib/utils';
 import { useClickOutside, useCounter } from '@siberiacancode/reactuse';
 
 const Demo = () => {

packages/core/src/hooks/useControllableState/useControllableState.demo.tsx

@@ -56,11 +56,11 @@ const Demo = () => {
       </Collapse>
 
       <div className='mt-4 flex flex-wrap gap-1'>
-        <button type='button' onClick={controlledCollapse.toggle}>
+        <button type='button' onClick={() => controlledCollapse.toggle()}>
           {controlledCollapse.opened ? 'Close' : 'Open'}
         </button>
 
-        <button type='button' onClick={controlledCollapse.toggle}>
+        <button type='button' onClick={() => controlledCollapse.toggle()}>
           Toggle
         </button>
       </div>

packages/core/src/hooks/useDropZone/useDropZone.ts

@@ -125,7 +125,7 @@ export const useDropZone = ((...params: any[]) => {
 
   const getFiles = (event: DragEvent) => {
     if (!event.dataTransfer) return null;
-    const list = Array.from(event.dataTransfer.files);
+    const list = [...event.dataTransfer.files];
     if (options.multiple) return list;
     if (!list.length) return null;
     return [list[0]];
@@ -141,7 +141,7 @@ export const useDropZone = ((...params: any[]) => {
   };
 
   const checkValidity = (items: DataTransferItemList) => {
-    const types = Array.from(items).map((item) => item.type);
+    const types = Array.from(items, (item) => item.type);
     const dataTypesValid = checkDataTypes(types);
     const multipleFilesValid = options.multiple || items.length <= 1;
 

packages/core/src/hooks/useIdle/useIdle.demo.tsx

@@ -1,4 +1,4 @@
-import { cn } from '@siberiacancode/docs/utils';
+import { cn } from '../../../../docs/lib/utils';
 import { useIdle } from '@siberiacancode/reactuse';
 
 const Demo = () => {

packages/core/src/hooks/useMergedRef/useMergedRef.demo.tsx

@@ -1,4 +1,3 @@
-import { cn } from '@siberiacancode/docs/utils';
 import {
   useClickOutside,
   useCounter,
@@ -8,6 +7,8 @@ import {
 } from '@siberiacancode/reactuse';
 import { useRef } from 'react';
 
+import { cn } from '../../../../docs/lib/utils';
+
 const Demo = () => {
   const counter = useCounter();
 

packages/core/src/hooks/useMouse/useMouse.demo.tsx

@@ -1,7 +1,8 @@
-import { cn } from '@siberiacancode/docs/utils';
 import { useHover, useMouse } from '@siberiacancode/reactuse';
 import { useRef } from 'react';
 
+import { cn } from '../../../../docs/lib/utils';
+
 const Demo = () => {
   const modalRef = useRef<HTMLDivElement>(null);
   const mouse = useMouse<HTMLDivElement>((value) => {