@kadoui/react 1.1.3 → 1.2.4

package/dist/components/Popover/Popover.d.ts

@@ -0,0 +1,8 @@
+import { PopoverMenu } from "./PopoverMenu";
+import { PopoverRoot } from "./PopoverRoot";
+import { PopoverToggle } from "./PopoverToggle";
+export declare const Popover: typeof PopoverRoot & {
+    Toggle: typeof PopoverToggle;
+    Menu: typeof PopoverMenu;
+};
+//# sourceMappingURL=Popover.d.ts.map

package/dist/components/Popover/Popover.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Popover.d.ts","sourceRoot":"","sources":["../../../src/components/Popover/Popover.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAEhD,eAAO,MAAM,OAAO;;;CAGlB,CAAC"}

package/dist/components/Popover/Popover.js

@@ -0,0 +1,7 @@
+import { PopoverMenu } from "./PopoverMenu";
+import { PopoverRoot } from "./PopoverRoot";
+import { PopoverToggle } from "./PopoverToggle";
+export const Popover = Object.assign(PopoverRoot, {
+    Toggle: PopoverToggle,
+    Menu: PopoverMenu
+});

package/dist/components/Popover/PopoverContext.d.ts

@@ -0,0 +1,10 @@
+import { Dispatch, RefObject, SetStateAction } from "react";
+export type PopoverContextT = {
+    isOpen: boolean;
+    setOpen: Dispatch<SetStateAction<boolean>>;
+    toggleRef: RefObject<HTMLButtonElement | null>;
+    menuRef: RefObject<HTMLDivElement | null>;
+    mode: "click" | "hover" | "both";
+};
+export declare const PopoverContext: import("react").Context<PopoverContextT>;
+//# sourceMappingURL=PopoverContext.d.ts.map

package/dist/components/Popover/PopoverContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PopoverContext.d.ts","sourceRoot":"","sources":["../../../src/components/Popover/PopoverContext.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,QAAQ,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAE3E,MAAM,MAAM,eAAe,GAAG;IAC5B,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,QAAQ,CAAC,cAAc,CAAC,OAAO,CAAC,CAAC,CAAC;IAC3C,SAAS,EAAE,SAAS,CAAC,iBAAiB,GAAG,IAAI,CAAC,CAAC;IAC/C,OAAO,EAAE,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IAC1C,IAAI,EAAE,OAAO,GAAG,OAAO,GAAG,MAAM,CAAC;CAClC,CAAA;AAED,eAAO,MAAM,cAAc,0CAAwD,CAAC"}

package/dist/components/Popover/PopoverContext.js

@@ -0,0 +1,2 @@
+import { createContext } from "react";
+export const PopoverContext = createContext({});

package/dist/components/Popover/PopoverMenu.d.ts

@@ -0,0 +1,6 @@
+import { HTMLAttributes } from "react";
+export type PopoverMenuPropsT = HTMLAttributes<HTMLDivElement> & {
+    preventClose?: boolean;
+};
+export declare function PopoverMenu({ preventClose, onClick, ...p }: PopoverMenuPropsT): import("react").JSX.Element | null;
+//# sourceMappingURL=PopoverMenu.d.ts.map

package/dist/components/Popover/PopoverMenu.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PopoverMenu.d.ts","sourceRoot":"","sources":["../../../src/components/Popover/PopoverMenu.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAO,MAAM,OAAO,CAAC;AAI5C,MAAM,MAAM,iBAAiB,GAAG,cAAc,CAAC,cAAc,CAAC,GAAG;IAC/D,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB,CAAA;AAED,wBAAgB,WAAW,CAAC,EAAE,YAAY,EAAE,OAAO,EAAE,GAAG,CAAC,EAAE,EAAE,iBAAiB,sCAkB7E"}

package/dist/components/Popover/PopoverMenu.jsx

@@ -0,0 +1,12 @@
+"use client";
+import { use } from "react";
+import { PopoverContext } from "./PopoverContext";
+export function PopoverMenu({ preventClose, onClick, ...p }) {
+    const { menuRef, isOpen } = use(PopoverContext);
+    return (isOpen ? (<div ref={menuRef} onClick={ev => {
+            if (preventClose) {
+                ev.stopPropagation();
+            }
+            onClick?.(ev);
+        }} {...p}/>) : null);
+}

package/dist/components/Popover/PopoverRoot.d.ts

@@ -0,0 +1,8 @@
+import { HTMLAttributes } from "react";
+import { PopoverContextT } from "./PopoverContext";
+export type PopoverRootPropsT = HTMLAttributes<HTMLDivElement> & {
+    mode?: PopoverContextT["mode"];
+    accessHorizontalArrows?: "ArrowRight" | "ArrowLeft";
+};
+export declare function PopoverRoot({ mode, accessHorizontalArrows, onKeyDown, onMouseEnter, onMouseLeave, ...p }: PopoverRootPropsT): import("react").JSX.Element;
+//# sourceMappingURL=PopoverRoot.d.ts.map

package/dist/components/Popover/PopoverRoot.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PopoverRoot.d.ts","sourceRoot":"","sources":["../../../src/components/Popover/PopoverRoot.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAA8C,MAAM,OAAO,CAAC;AAEnF,OAAO,EAAkB,eAAe,EAAE,MAAM,kBAAkB,CAAC;AAInE,MAAM,MAAM,iBAAiB,GAAG,cAAc,CAAC,cAAc,CAAC,GAAG;IAC/D,IAAI,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IAC/B,sBAAsB,CAAC,EAAE,YAAY,GAAG,WAAW,CAAC;CACrD,CAAA;AAED,wBAAgB,WAAW,CAAC,EAAE,IAAc,EAAE,sBAAsB,EAAE,SAAS,EAAE,YAAY,EAAE,YAAY,EAAE,GAAG,CAAC,EAAE,EAAE,iBAAiB,+BAwFrI"}

package/dist/components/Popover/PopoverRoot.jsx

@@ -0,0 +1,75 @@
+"use client";
+import { useEffect, useRef, useState } from "react";
+import { PopoverContext } from "./PopoverContext";
+import { selectAccessibleChildren } from "../../utils";
+export function PopoverRoot({ mode = "click", accessHorizontalArrows, onKeyDown, onMouseEnter, onMouseLeave, ...p }) {
+    const [isOpen, setOpen] = useState(false);
+    const toggleRef = useRef(null);
+    const menuRef = useRef(null);
+    useEffect(() => {
+        const closeHandler = () => {
+            setOpen(false);
+        };
+        window.addEventListener("click", closeHandler);
+        return () => window.removeEventListener("click", closeHandler);
+    }, []);
+    useEffect(() => {
+        if (isOpen) {
+            selectFirstMenuChild();
+        }
+    }, [isOpen]);
+    const selectFirstMenuChild = () => {
+        if (!menuRef.current) {
+            return;
+        }
+        const children = selectAccessibleChildren(menuRef.current);
+        const firstChild = children[0];
+        if (!firstChild) {
+            return;
+        }
+        firstChild.focus();
+    };
+    const handleKeyDown = (ev) => {
+        if (!accessHorizontalArrows) {
+            return null;
+        }
+        if (ev.key === "ArrowRight") {
+            if (accessHorizontalArrows === "ArrowRight") {
+                setOpen(true);
+                selectFirstMenuChild();
+            }
+            else {
+                setOpen(false);
+                toggleRef.current?.focus();
+            }
+        }
+        if (ev.key === "ArrowLeft") {
+            if (accessHorizontalArrows === "ArrowLeft") {
+                setOpen(true);
+                selectFirstMenuChild();
+            }
+            else {
+                setOpen(false);
+                toggleRef.current?.focus();
+            }
+        }
+    };
+    return (<PopoverContext value={{ isOpen, setOpen, toggleRef, menuRef, mode }}>
+      <div onKeyDown={ev => {
+            onKeyDown?.(ev);
+            handleKeyDown(ev);
+        }} onMouseEnter={ev => {
+            onMouseEnter?.(ev);
+            if (["hover", "both"].includes(mode)) {
+                ev.stopPropagation();
+                setOpen(true);
+            }
+        }} onMouseLeave={ev => {
+            onMouseLeave?.(ev);
+            if (["hover", "both"].includes(mode)) {
+                ev.stopPropagation();
+                setOpen(false);
+            }
+        }} {...p}/>
+    </PopoverContext>);
+}

package/dist/components/Popover/PopoverToggle.d.ts

@@ -0,0 +1,4 @@
+import { HTMLAttributes } from "react";
+export type PopoverTogglePropsT = HTMLAttributes<HTMLButtonElement>;
+export declare function PopoverToggle({ onClick, ...props }: PopoverTogglePropsT): import("react").JSX.Element;
+//# sourceMappingURL=PopoverToggle.d.ts.map

package/dist/components/Popover/PopoverToggle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PopoverToggle.d.ts","sourceRoot":"","sources":["../../../src/components/Popover/PopoverToggle.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAO,MAAM,OAAO,CAAC;AAI5C,MAAM,MAAM,mBAAmB,GAAG,cAAc,CAAC,iBAAiB,CAAC,CAAC;AAEpE,wBAAgB,aAAa,CAAC,EAAE,OAAO,EAAE,GAAG,KAAK,EAAE,EAAE,mBAAmB,+BAgBvE"}

package/dist/components/Popover/PopoverToggle.jsx

@@ -0,0 +1,13 @@
+"use client";
+import { use } from "react";
+import { PopoverContext } from "./PopoverContext";
+export function PopoverToggle({ onClick, ...props }) {
+    const { mode, toggleRef, setOpen } = use(PopoverContext);
+    return (<button ref={toggleRef} onClick={ev => {
+            onClick?.(ev);
+            ev.stopPropagation();
+            if (["click", "both"].includes(mode)) {
+                setOpen(prev => !prev);
+            }
+        }} {...props}/>);
+}

package/dist/index.d.ts

@@ -7,12 +7,12 @@ export * from "./components/ClientOnly/ClientOnly";
 export * from "./components/Clipboard/Clipboard";
 export * from "./components/ContextMenu/ContextMenu";
 export * from "./components/Drawer/Drawer";
-export * from "./components/Dropdown/Dropdown";
 export * from "./components/LoaderLink/LoaderLink";
 export * from "./components/Modal/Modal";
 export * from "./components/Otp/Otp";
 export * from "./components/Pagination/Pagination";
 export * from "./components/PasswordInput/PasswordInput";
+export * from "./components/Popover/Popover";
 export * from "./components/Portal/Portal";
 export * from "./components/Progress/Progress";
 export * from "./components/QrCode/QrCode";

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,gDAAgD,CAAC;AAC/D,cAAc,kCAAkC,CAAC;AACjD,cAAc,0BAA0B,CAAC;AACzC,cAAc,sCAAsC,CAAC;AACrD,cAAc,gCAAgC,CAAC;AAC/C,cAAc,oCAAoC,CAAC;AACnD,cAAc,kCAAkC,CAAC;AACjD,cAAc,sCAAsC,CAAC;AACrD,cAAc,4BAA4B,CAAC;AAC3C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,oCAAoC,CAAC;AACnD,cAAc,0BAA0B,CAAC;AACzC,cAAc,sBAAsB,CAAC;AACrC,cAAc,oCAAoC,CAAC;AACnD,cAAc,0CAA0C,CAAC;AACzD,cAAc,4BAA4B,CAAC;AAC3C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,0BAA0B,CAAC;AACzC,cAAc,gCAAgC,CAAC;AAC/C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,0BAA0B,CAAC;AACzC,cAAc,wBAAwB,CAAC;AACvC,cAAc,wBAAwB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,gDAAgD,CAAC;AAC/D,cAAc,kCAAkC,CAAC;AACjD,cAAc,0BAA0B,CAAC;AACzC,cAAc,sCAAsC,CAAC;AACrD,cAAc,gCAAgC,CAAC;AAC/C,cAAc,oCAAoC,CAAC;AACnD,cAAc,kCAAkC,CAAC;AACjD,cAAc,sCAAsC,CAAC;AACrD,cAAc,4BAA4B,CAAC;AAC3C,cAAc,oCAAoC,CAAC;AACnD,cAAc,0BAA0B,CAAC;AACzC,cAAc,sBAAsB,CAAC;AACrC,cAAc,oCAAoC,CAAC;AACnD,cAAc,0CAA0C,CAAC;AACzD,cAAc,8BAA8B,CAAC;AAC7C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,gCAAgC,CAAC;AAC/C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,0BAA0B,CAAC;AACzC,cAAc,gCAAgC,CAAC;AAC/C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,0BAA0B,CAAC;AACzC,cAAc,wBAAwB,CAAC;AACvC,cAAc,wBAAwB,CAAC"}

package/dist/index.js

@@ -7,12 +7,12 @@ export * from "./components/ClientOnly/ClientOnly";
 export * from "./components/Clipboard/Clipboard";
 export * from "./components/ContextMenu/ContextMenu";
 export * from "./components/Drawer/Drawer";
-export * from "./components/Dropdown/Dropdown";
 export * from "./components/LoaderLink/LoaderLink";
 export * from "./components/Modal/Modal";
 export * from "./components/Otp/Otp";
 export * from "./components/Pagination/Pagination";
 export * from "./components/PasswordInput/PasswordInput";
+export * from "./components/Popover/Popover";
 export * from "./components/Portal/Portal";
 export * from "./components/Progress/Progress";
 export * from "./components/QrCode/QrCode";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kadoui/react",
-  "version": "1.1.3",
+  "version": "1.2.4",
   "description": "Kadoui primitive components for React",
   "author": "Jstation",
   "license": "MIT",
@@ -27,7 +27,6 @@
     "next": "15.4.5",
     "@mantine/hooks": "^8.1.3",
     "framer-motion": "^12.23.0",
-    "lucide-react": "^0.525.0",
     "qrcode": "^1.5.4",
     "zustand": "^5.0.6",
     "nanoid": "^5.1.5",
@@ -35,7 +34,7 @@
     "tailwind-merge": "^3.3.1"
   },
   "devDependencies": {
-    "@repo/tsconfig": "workspace:*",
+    "tsconfig": "workspace:*",
     "typescript": "^5",
     "@types/node": "^20",
     "@types/react": "^19",

package/tsconfig.json

@@ -1,5 +1,5 @@
 {
-  "extends": "@repo/tsconfig",
+  "extends": "tsconfig",
   "compilerOptions": {
     "module": "ESNext",
     "moduleResolution": "Bundler",