@kadoui/react 1.10.14 → 1.11.15
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/AccessNavigation/AccessNavigation.d.ts.map +1 -1
- package/dist/components/AccessNavigation/AccessNavigation.js +2 -0
- package/dist/components/Choice/Choice.d.ts +6 -0
- package/dist/components/Choice/Choice.d.ts.map +1 -0
- package/dist/components/Choice/Choice.js +5 -0
- package/dist/components/Choice/ChoiceContext.d.ts +18 -0
- package/dist/components/Choice/ChoiceContext.d.ts.map +1 -0
- package/dist/components/Choice/ChoiceContext.js +3 -0
- package/dist/components/Choice/ChoiceRoot.d.ts +6 -0
- package/dist/components/Choice/ChoiceRoot.d.ts.map +1 -0
- package/dist/components/Choice/ChoiceRoot.js +6 -0
- package/dist/components/Choice/ChoiceTrigger.d.ts +7 -0
- package/dist/components/Choice/ChoiceTrigger.d.ts.map +1 -0
- package/dist/components/Choice/ChoiceTrigger.js +33 -0
- package/dist/components/Popover/Popover.d.ts +2 -0
- package/dist/components/Popover/Popover.d.ts.map +1 -1
- package/dist/components/Popover/Popover.js +3 -1
- package/dist/components/Popover/PopoverAccessNavigation.d.ts +3 -0
- package/dist/components/Popover/PopoverAccessNavigation.d.ts.map +1 -0
- package/dist/components/Popover/PopoverAccessNavigation.js +5 -0
- package/dist/components/Popover/PopoverBody.d.ts.map +1 -1
- package/dist/components/Popover/PopoverBody.js +2 -2
- package/dist/components/Popover/PopoverContext.d.ts.map +1 -1
- package/dist/components/Popover/PopoverRoot.d.ts +1 -2
- package/dist/components/Popover/PopoverRoot.d.ts.map +1 -1
- package/dist/components/Popover/PopoverRoot.js +2 -30
- package/dist/components/Popover/PopoverToggle.js +2 -2
- package/dist/components/Toggle/Toggle.d.ts +6 -0
- package/dist/components/Toggle/Toggle.d.ts.map +1 -0
- package/dist/components/Toggle/Toggle.js +5 -0
- package/dist/components/Toggle/ToggleContext.d.ts +18 -0
- package/dist/components/Toggle/ToggleContext.d.ts.map +1 -0
- package/dist/components/Toggle/ToggleContext.js +3 -0
- package/dist/components/Toggle/ToggleRoot.d.ts +6 -0
- package/dist/components/Toggle/ToggleRoot.d.ts.map +1 -0
- package/dist/components/Toggle/ToggleRoot.js +6 -0
- package/dist/components/Toggle/ToggleTrigger.d.ts +7 -0
- package/dist/components/Toggle/ToggleTrigger.d.ts.map +1 -0
- package/dist/components/Toggle/ToggleTrigger.js +33 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1 -0
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AccessNavigation.d.ts","sourceRoot":"","sources":["../../../src/components/AccessNavigation/AccessNavigation.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAiB,SAAS,EAAqB,MAAM,OAAO,CAAC;AAIpF,MAAM,MAAM,sBAAsB,GAAG,cAAc,CAAC,cAAc,CAAC,GAAG;IACpE,GAAG,CAAC,EAAE,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IACvC,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,SAAS,CAAC,EAAE,GAAG,GAAG,GAAG,CAAC;CACvB,CAAC;AAEF,wBAAgB,gBAAgB,CAAC,EAC/B,GAAG,EACH,YAAY,EACZ,SAAe,EACf,GAAG,EACH,SAAS,EACT,GAAG,CAAC,EACL,EAAE,sBAAsB,
|
|
1
|
+
{"version":3,"file":"AccessNavigation.d.ts","sourceRoot":"","sources":["../../../src/components/AccessNavigation/AccessNavigation.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAiB,SAAS,EAAqB,MAAM,OAAO,CAAC;AAIpF,MAAM,MAAM,sBAAsB,GAAG,cAAc,CAAC,cAAc,CAAC,GAAG;IACpE,GAAG,CAAC,EAAE,SAAS,CAAC,cAAc,GAAG,IAAI,CAAC,CAAC;IACvC,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,SAAS,CAAC,EAAE,GAAG,GAAG,GAAG,CAAC;CACvB,CAAC;AAEF,wBAAgB,gBAAgB,CAAC,EAC/B,GAAG,EACH,YAAY,EACZ,SAAe,EACf,GAAG,EACH,SAAS,EACT,GAAG,CAAC,EACL,EAAE,sBAAsB,2CAsExB"}
|
|
@@ -28,6 +28,7 @@ export function AccessNavigation({ ref, focusOnMount, direction = "y", dir, onKe
|
|
|
28
28
|
? "ArrowRight"
|
|
29
29
|
: "ArrowLeft")) {
|
|
30
30
|
ev.preventDefault();
|
|
31
|
+
ev.stopPropagation();
|
|
31
32
|
const nextIndex = currentIndex === -1 || currentIndex === focusableChildren.length - 1
|
|
32
33
|
? 0
|
|
33
34
|
: currentIndex + 1;
|
|
@@ -36,6 +37,7 @@ export function AccessNavigation({ ref, focusOnMount, direction = "y", dir, onKe
|
|
|
36
37
|
if (ev.key ===
|
|
37
38
|
(direction === "y" ? "ArrowUp" : currentDir === "ltr" ? "ArrowLeft" : "ArrowRight")) {
|
|
38
39
|
ev.preventDefault();
|
|
40
|
+
ev.stopPropagation();
|
|
39
41
|
const prevIndex = currentIndex <= 0 ? focusableChildren.length - 1 : currentIndex - 1;
|
|
40
42
|
focusableChildren[prevIndex]?.focus();
|
|
41
43
|
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Choice.d.ts","sourceRoot":"","sources":["../../../src/components/Choice/Choice.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAEhD,eAAO,MAAM,MAAM;;CAEjB,CAAC"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { Dispatch, SetStateAction } from "react";
|
|
2
|
+
type MultiModeT = {
|
|
3
|
+
multiple: true;
|
|
4
|
+
activeChoice: string[];
|
|
5
|
+
setActiveChoice: Dispatch<SetStateAction<string[]>>;
|
|
6
|
+
};
|
|
7
|
+
type SingleModeT = {
|
|
8
|
+
multiple?: false;
|
|
9
|
+
activeChoice: string | null;
|
|
10
|
+
setActiveChoice: Dispatch<SetStateAction<string | null>>;
|
|
11
|
+
};
|
|
12
|
+
type MergedModeT = SingleModeT | MultiModeT;
|
|
13
|
+
export type ChoiceContextT = MergedModeT & {
|
|
14
|
+
requiredOne?: boolean;
|
|
15
|
+
};
|
|
16
|
+
export declare const ChoiceContext: import("react").Context<ChoiceContextT>;
|
|
17
|
+
export {};
|
|
18
|
+
//# sourceMappingURL=ChoiceContext.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ChoiceContext.d.ts","sourceRoot":"","sources":["../../../src/components/Choice/ChoiceContext.ts"],"names":[],"mappings":"AAEA,OAAO,EAAiB,QAAQ,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAEhE,KAAK,UAAU,GAAG;IAChB,QAAQ,EAAE,IAAI,CAAC;IACf,YAAY,EAAE,MAAM,EAAE,CAAC;IACvB,eAAe,EAAE,QAAQ,CAAC,cAAc,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC;CACrD,CAAC;AAEF,KAAK,WAAW,GAAG;IACjB,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB,YAAY,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B,eAAe,EAAE,QAAQ,CAAC,cAAc,CAAC,MAAM,GAAG,IAAI,CAAC,CAAC,CAAC;CAC1D,CAAC;AAEF,KAAK,WAAW,GAAG,WAAW,GAAG,UAAU,CAAC;AAE5C,MAAM,MAAM,cAAc,GAAG,WAAW,GAAG;IACzC,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AAEF,eAAO,MAAM,aAAa,yCAAsD,CAAC"}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { ComponentProps } from "react";
|
|
2
|
+
import { ChoiceContextT } from "./ChoiceContext";
|
|
3
|
+
type ChoiceRootPropsT = ComponentProps<"div"> & ChoiceContextT;
|
|
4
|
+
export declare function ChoiceRoot({ multiple, activeChoice, setActiveChoice, requiredOne, ...p }: ChoiceRootPropsT): import("react/jsx-runtime").JSX.Element;
|
|
5
|
+
export {};
|
|
6
|
+
//# sourceMappingURL=ChoiceRoot.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ChoiceRoot.d.ts","sourceRoot":"","sources":["../../../src/components/Choice/ChoiceRoot.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAiB,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAEhE,KAAK,gBAAgB,GAAG,cAAc,CAAC,KAAK,CAAC,GAAG,cAAc,CAAC;AAE/D,wBAAgB,UAAU,CAAC,EACzB,QAAQ,EACR,YAAY,EACZ,eAAe,EACf,WAAW,EACX,GAAG,CAAC,EACL,EAAE,gBAAgB,2CAOlB"}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
+
import { ChoiceContext } from "./ChoiceContext";
|
|
4
|
+
export function ChoiceRoot({ multiple, activeChoice, setActiveChoice, requiredOne, ...p }) {
|
|
5
|
+
return (_jsx(ChoiceContext, { value: { multiple, activeChoice, setActiveChoice, requiredOne }, children: _jsx("div", { ...p }) }));
|
|
6
|
+
}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { ComponentProps } from "react";
|
|
2
|
+
type ChoiceTriggerPropsT = ComponentProps<"button"> & {
|
|
3
|
+
choiceName: string;
|
|
4
|
+
};
|
|
5
|
+
export declare function ChoiceTrigger({ choiceName, onClick, ...p }: ChoiceTriggerPropsT): import("react/jsx-runtime").JSX.Element;
|
|
6
|
+
export {};
|
|
7
|
+
//# sourceMappingURL=ChoiceTrigger.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ChoiceTrigger.d.ts","sourceRoot":"","sources":["../../../src/components/Choice/ChoiceTrigger.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAO,MAAM,OAAO,CAAC;AAI5C,KAAK,mBAAmB,GAAG,cAAc,CAAC,QAAQ,CAAC,GAAG;IACpD,UAAU,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,wBAAgB,aAAa,CAAC,EAC5B,UAAU,EACV,OAAO,EACP,GAAG,CAAC,EACL,EAAE,mBAAmB,2CAiCrB"}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
+
import { use } from "react";
|
|
4
|
+
import { ChoiceContext } from "./ChoiceContext";
|
|
5
|
+
export function ChoiceTrigger({ choiceName, onClick, ...p }) {
|
|
6
|
+
const { multiple, activeChoice, setActiveChoice, requiredOne } = use(ChoiceContext);
|
|
7
|
+
const isActive = multiple
|
|
8
|
+
? activeChoice.includes(choiceName)
|
|
9
|
+
: activeChoice === choiceName;
|
|
10
|
+
return (_jsx("button", { "data-state": isActive, onClick: (ev) => {
|
|
11
|
+
onClick?.(ev);
|
|
12
|
+
if (isActive) {
|
|
13
|
+
if (multiple) {
|
|
14
|
+
if (!requiredOne || activeChoice.length > 1) {
|
|
15
|
+
setActiveChoice((prev) => prev.filter((item) => item !== choiceName));
|
|
16
|
+
}
|
|
17
|
+
}
|
|
18
|
+
else {
|
|
19
|
+
if (!requiredOne) {
|
|
20
|
+
setActiveChoice(null);
|
|
21
|
+
}
|
|
22
|
+
}
|
|
23
|
+
}
|
|
24
|
+
else {
|
|
25
|
+
if (multiple) {
|
|
26
|
+
setActiveChoice((prev) => [...prev, choiceName]);
|
|
27
|
+
}
|
|
28
|
+
else {
|
|
29
|
+
setActiveChoice(choiceName);
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
}, ...p }));
|
|
33
|
+
}
|
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
import { PopoverBody } from "./PopoverBody";
|
|
2
2
|
import { PopoverRoot } from "./PopoverRoot";
|
|
3
3
|
import { PopoverToggle } from "./PopoverToggle";
|
|
4
|
+
import { PopoverAccessNavigation } from "./PopoverAccessNavigation";
|
|
4
5
|
export declare const Popover: typeof PopoverRoot & {
|
|
6
|
+
AccessNavigation: typeof PopoverAccessNavigation;
|
|
5
7
|
Toggle: typeof PopoverToggle;
|
|
6
8
|
Body: typeof PopoverBody;
|
|
7
9
|
};
|
|
@@ -1 +1 @@
|
|
|
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;
|
|
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;AAChD,OAAO,EAAE,uBAAuB,EAAE,MAAM,2BAA2B,CAAC;AAEpE,eAAO,MAAM,OAAO;;;;CAIlB,CAAC"}
|
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
import { PopoverBody } from "./PopoverBody";
|
|
2
2
|
import { PopoverRoot } from "./PopoverRoot";
|
|
3
3
|
import { PopoverToggle } from "./PopoverToggle";
|
|
4
|
+
import { PopoverAccessNavigation } from "./PopoverAccessNavigation";
|
|
4
5
|
export const Popover = Object.assign(PopoverRoot, {
|
|
6
|
+
AccessNavigation: PopoverAccessNavigation,
|
|
5
7
|
Toggle: PopoverToggle,
|
|
6
|
-
Body: PopoverBody
|
|
8
|
+
Body: PopoverBody,
|
|
7
9
|
});
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"PopoverAccessNavigation.d.ts","sourceRoot":"","sources":["../../../src/components/Popover/PopoverAccessNavigation.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,sBAAsB,EACvB,MAAM,sCAAsC,CAAC;AAE9C,wBAAgB,uBAAuB,CAAC,CAAC,EAAE,sBAAsB,2CAEhE"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PopoverBody.d.ts","sourceRoot":"","sources":["../../../src/components/Popover/PopoverBody.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,
|
|
1
|
+
{"version":3,"file":"PopoverBody.d.ts","sourceRoot":"","sources":["../../../src/components/Popover/PopoverBody.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,CAAC;AAEF,wBAAgB,WAAW,CAAC,EAAE,YAAY,EAAE,OAAO,EAAE,GAAG,CAAC,EAAE,EAAE,iBAAiB,kDAiB7E"}
|
|
@@ -4,10 +4,10 @@ import { use } from "react";
|
|
|
4
4
|
import { PopoverContext } from "./PopoverContext";
|
|
5
5
|
export function PopoverBody({ preventClose, onClick, ...p }) {
|
|
6
6
|
const { bodyRef, isOpen } = use(PopoverContext);
|
|
7
|
-
return
|
|
7
|
+
return isOpen ? (_jsx("div", { ref: bodyRef, "data-state": isOpen, onClick: (ev) => {
|
|
8
8
|
if (preventClose) {
|
|
9
9
|
ev.stopPropagation();
|
|
10
10
|
}
|
|
11
11
|
onClick?.(ev);
|
|
12
|
-
}, ...p })) : null
|
|
12
|
+
}, ...p })) : null;
|
|
13
13
|
}
|
|
@@ -1 +1 @@
|
|
|
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,
|
|
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,CAAC;AAEF,eAAO,MAAM,cAAc,0CAAwD,CAAC"}
|
|
@@ -2,7 +2,6 @@ import { HTMLAttributes } from "react";
|
|
|
2
2
|
import { PopoverContextT } from "./PopoverContext";
|
|
3
3
|
export type PopoverRootPropsT = HTMLAttributes<HTMLDivElement> & {
|
|
4
4
|
mode?: PopoverContextT["mode"];
|
|
5
|
-
accessHorizontalArrows?: "ArrowRight" | "ArrowLeft";
|
|
6
5
|
};
|
|
7
|
-
export declare function PopoverRoot({ mode,
|
|
6
|
+
export declare function PopoverRoot({ mode, onMouseEnter, onMouseLeave, ...p }: PopoverRootPropsT): import("react/jsx-runtime").JSX.Element;
|
|
8
7
|
//# sourceMappingURL=PopoverRoot.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PopoverRoot.d.ts","sourceRoot":"","sources":["../../../src/components/Popover/PopoverRoot.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,cAAc,
|
|
1
|
+
{"version":3,"file":"PopoverRoot.d.ts","sourceRoot":"","sources":["../../../src/components/Popover/PopoverRoot.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,cAAc,EAA+B,MAAM,OAAO,CAAC;AAGpE,OAAO,EAAkB,eAAe,EAAE,MAAM,kBAAkB,CAAC;AAEnE,MAAM,MAAM,iBAAiB,GAAG,cAAc,CAAC,cAAc,CAAC,GAAG;IAC/D,IAAI,CAAC,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;CAChC,CAAC;AAEF,wBAAgB,WAAW,CAAC,EAC1B,IAAc,EACd,YAAY,EACZ,YAAY,EACZ,GAAG,CAAC,EACL,EAAE,iBAAiB,2CAiEnB"}
|
|
@@ -4,7 +4,7 @@ import { usePathname } from "next/navigation";
|
|
|
4
4
|
import { useEffect, useRef, useState } from "react";
|
|
5
5
|
import { selectAccessibleChildren } from "../../utils";
|
|
6
6
|
import { PopoverContext } from "./PopoverContext";
|
|
7
|
-
export function PopoverRoot({ mode = "click",
|
|
7
|
+
export function PopoverRoot({ mode = "click", onMouseEnter, onMouseLeave, ...p }) {
|
|
8
8
|
const pathname = usePathname();
|
|
9
9
|
const [isOpen, setOpen] = useState(false);
|
|
10
10
|
const toggleRef = useRef(null);
|
|
@@ -35,35 +35,7 @@ export function PopoverRoot({ mode = "click", accessHorizontalArrows, onKeyDown,
|
|
|
35
35
|
}
|
|
36
36
|
firstChild.focus();
|
|
37
37
|
};
|
|
38
|
-
|
|
39
|
-
if (!accessHorizontalArrows) {
|
|
40
|
-
return null;
|
|
41
|
-
}
|
|
42
|
-
if (ev.key === "ArrowRight") {
|
|
43
|
-
if (accessHorizontalArrows === "ArrowRight") {
|
|
44
|
-
setOpen(true);
|
|
45
|
-
selectFirstMenuChild();
|
|
46
|
-
}
|
|
47
|
-
else {
|
|
48
|
-
setOpen(false);
|
|
49
|
-
toggleRef.current?.focus();
|
|
50
|
-
}
|
|
51
|
-
}
|
|
52
|
-
if (ev.key === "ArrowLeft") {
|
|
53
|
-
if (accessHorizontalArrows === "ArrowLeft") {
|
|
54
|
-
setOpen(true);
|
|
55
|
-
selectFirstMenuChild();
|
|
56
|
-
}
|
|
57
|
-
else {
|
|
58
|
-
setOpen(false);
|
|
59
|
-
toggleRef.current?.focus();
|
|
60
|
-
}
|
|
61
|
-
}
|
|
62
|
-
};
|
|
63
|
-
return (_jsx(PopoverContext, { value: { isOpen, setOpen, toggleRef, bodyRef, mode }, children: _jsx("div", { "data-state": isOpen ? "active" : "inactive", onKeyDown: (ev) => {
|
|
64
|
-
onKeyDown?.(ev);
|
|
65
|
-
handleKeyDown(ev);
|
|
66
|
-
}, onMouseEnter: (ev) => {
|
|
38
|
+
return (_jsx(PopoverContext, { value: { isOpen, setOpen, toggleRef, bodyRef, mode }, children: _jsx("div", { "data-state": isOpen, onMouseEnter: (ev) => {
|
|
67
39
|
onMouseEnter?.(ev);
|
|
68
40
|
if (["hover", "both"].includes(mode)) {
|
|
69
41
|
ev.stopPropagation();
|
|
@@ -4,11 +4,11 @@ import { use } from "react";
|
|
|
4
4
|
import { PopoverContext } from "./PopoverContext";
|
|
5
5
|
export function PopoverToggle({ onClick, ...props }) {
|
|
6
6
|
const { mode, toggleRef, isOpen, setOpen } = use(PopoverContext);
|
|
7
|
-
return (_jsx("button", { ref: toggleRef, "data-state": isOpen
|
|
7
|
+
return (_jsx("button", { ref: toggleRef, "data-state": isOpen, onClick: (ev) => {
|
|
8
8
|
onClick?.(ev);
|
|
9
9
|
ev.stopPropagation();
|
|
10
10
|
if (["click", "both"].includes(mode)) {
|
|
11
|
-
setOpen(prev => !prev);
|
|
11
|
+
setOpen((prev) => !prev);
|
|
12
12
|
}
|
|
13
13
|
}, ...props }));
|
|
14
14
|
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Toggle.d.ts","sourceRoot":"","sources":["../../../src/components/Toggle/Toggle.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAEhD,eAAO,MAAM,MAAM;;CAEjB,CAAC"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { Dispatch, SetStateAction } from "react";
|
|
2
|
+
type MultiModeT = {
|
|
3
|
+
multiple: true;
|
|
4
|
+
activeToggle: string[];
|
|
5
|
+
setActiveToggle: Dispatch<SetStateAction<string[]>>;
|
|
6
|
+
};
|
|
7
|
+
type SingleModeT = {
|
|
8
|
+
multiple?: false;
|
|
9
|
+
activeToggle: string | null;
|
|
10
|
+
setActiveToggle: Dispatch<SetStateAction<string | null>>;
|
|
11
|
+
};
|
|
12
|
+
type MergedModeT = SingleModeT | MultiModeT;
|
|
13
|
+
export type ToggleContextT = MergedModeT & {
|
|
14
|
+
requiredOne?: boolean;
|
|
15
|
+
};
|
|
16
|
+
export declare const ToggleContext: import("react").Context<ToggleContextT>;
|
|
17
|
+
export {};
|
|
18
|
+
//# sourceMappingURL=ToggleContext.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ToggleContext.d.ts","sourceRoot":"","sources":["../../../src/components/Toggle/ToggleContext.ts"],"names":[],"mappings":"AAEA,OAAO,EAAiB,QAAQ,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAEhE,KAAK,UAAU,GAAG;IAChB,QAAQ,EAAE,IAAI,CAAC;IACf,YAAY,EAAE,MAAM,EAAE,CAAC;IACvB,eAAe,EAAE,QAAQ,CAAC,cAAc,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC;CACrD,CAAC;AAEF,KAAK,WAAW,GAAG;IACjB,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB,YAAY,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B,eAAe,EAAE,QAAQ,CAAC,cAAc,CAAC,MAAM,GAAG,IAAI,CAAC,CAAC,CAAC;CAC1D,CAAC;AAEF,KAAK,WAAW,GAAG,WAAW,GAAG,UAAU,CAAC;AAE5C,MAAM,MAAM,cAAc,GAAG,WAAW,GAAG;IACzC,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AAEF,eAAO,MAAM,aAAa,yCAAsD,CAAC"}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { ComponentProps } from "react";
|
|
2
|
+
import { ToggleContextT } from "./ToggleContext";
|
|
3
|
+
type ToggleRootPropsT = ComponentProps<"div"> & ToggleContextT;
|
|
4
|
+
export declare function ToggleRoot({ multiple, activeToggle, setActiveToggle, requiredOne, ...p }: ToggleRootPropsT): import("react/jsx-runtime").JSX.Element;
|
|
5
|
+
export {};
|
|
6
|
+
//# sourceMappingURL=ToggleRoot.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ToggleRoot.d.ts","sourceRoot":"","sources":["../../../src/components/Toggle/ToggleRoot.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAEvC,OAAO,EAAiB,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAEhE,KAAK,gBAAgB,GAAG,cAAc,CAAC,KAAK,CAAC,GAAG,cAAc,CAAC;AAE/D,wBAAgB,UAAU,CAAC,EACzB,QAAQ,EACR,YAAY,EACZ,eAAe,EACf,WAAW,EACX,GAAG,CAAC,EACL,EAAE,gBAAgB,2CAOlB"}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
+
import { ToggleContext } from "./ToggleContext";
|
|
4
|
+
export function ToggleRoot({ multiple, activeToggle, setActiveToggle, requiredOne, ...p }) {
|
|
5
|
+
return (_jsx(ToggleContext, { value: { multiple, activeToggle, setActiveToggle, requiredOne }, children: _jsx("div", { ...p }) }));
|
|
6
|
+
}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { ComponentProps } from "react";
|
|
2
|
+
type ToggleTriggerPropsT = ComponentProps<"button"> & {
|
|
3
|
+
toggleName: string;
|
|
4
|
+
};
|
|
5
|
+
export declare function ToggleTrigger({ toggleName, onClick, ...p }: ToggleTriggerPropsT): import("react/jsx-runtime").JSX.Element;
|
|
6
|
+
export {};
|
|
7
|
+
//# sourceMappingURL=ToggleTrigger.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ToggleTrigger.d.ts","sourceRoot":"","sources":["../../../src/components/Toggle/ToggleTrigger.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAO,MAAM,OAAO,CAAC;AAI5C,KAAK,mBAAmB,GAAG,cAAc,CAAC,QAAQ,CAAC,GAAG;IACpD,UAAU,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,wBAAgB,aAAa,CAAC,EAC5B,UAAU,EACV,OAAO,EACP,GAAG,CAAC,EACL,EAAE,mBAAmB,2CAiCrB"}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
3
|
+
import { use } from "react";
|
|
4
|
+
import { ToggleContext } from "./ToggleContext";
|
|
5
|
+
export function ToggleTrigger({ toggleName, onClick, ...p }) {
|
|
6
|
+
const { multiple, activeToggle, setActiveToggle, requiredOne } = use(ToggleContext);
|
|
7
|
+
const isActive = multiple
|
|
8
|
+
? activeToggle.includes(toggleName)
|
|
9
|
+
: activeToggle === toggleName;
|
|
10
|
+
return (_jsx("button", { "data-state": isActive, onClick: (ev) => {
|
|
11
|
+
onClick?.(ev);
|
|
12
|
+
if (isActive) {
|
|
13
|
+
if (multiple) {
|
|
14
|
+
if (!requiredOne || activeToggle.length > 1) {
|
|
15
|
+
setActiveToggle((prev) => prev.filter((item) => item !== toggleName));
|
|
16
|
+
}
|
|
17
|
+
}
|
|
18
|
+
else {
|
|
19
|
+
if (!requiredOne) {
|
|
20
|
+
setActiveToggle(null);
|
|
21
|
+
}
|
|
22
|
+
}
|
|
23
|
+
}
|
|
24
|
+
else {
|
|
25
|
+
if (multiple) {
|
|
26
|
+
setActiveToggle((prev) => [...prev, toggleName]);
|
|
27
|
+
}
|
|
28
|
+
else {
|
|
29
|
+
setActiveToggle(toggleName);
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
}, ...p }));
|
|
33
|
+
}
|
package/dist/index.d.ts
CHANGED
|
@@ -22,6 +22,7 @@ export * from "./components/ShowMore/ShowMore";
|
|
|
22
22
|
export * from "./components/Spoiler/Spoiler";
|
|
23
23
|
export * from "./components/Swap/Swap";
|
|
24
24
|
export * from "./components/Tabs/Tabs";
|
|
25
|
+
export * from "./components/Choice/Choice";
|
|
25
26
|
export * from "./components/Submit/Submit";
|
|
26
27
|
export * from "./components/LinkLoader/LinkLoader";
|
|
27
28
|
export * from "./components/ThemeAdapter/ThemeAdapter";
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +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,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,kCAAkC,CAAC;AACjD,cAAc,0BAA0B,CAAC;AACzC,cAAc,gCAAgC,CAAC;AAC/C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,wBAAwB,CAAC;AACvC,cAAc,wBAAwB,CAAC;AACvC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,oCAAoC,CAAC;AACnD,cAAc,wCAAwC,CAAC"}
|
|
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,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,kCAAkC,CAAC;AACjD,cAAc,0BAA0B,CAAC;AACzC,cAAc,gCAAgC,CAAC;AAC/C,cAAc,8BAA8B,CAAC;AAC7C,cAAc,wBAAwB,CAAC;AACvC,cAAc,wBAAwB,CAAC;AACvC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,4BAA4B,CAAC;AAC3C,cAAc,oCAAoC,CAAC;AACnD,cAAc,wCAAwC,CAAC"}
|
package/dist/index.js
CHANGED
|
@@ -22,6 +22,7 @@ export * from "./components/ShowMore/ShowMore";
|
|
|
22
22
|
export * from "./components/Spoiler/Spoiler";
|
|
23
23
|
export * from "./components/Swap/Swap";
|
|
24
24
|
export * from "./components/Tabs/Tabs";
|
|
25
|
+
export * from "./components/Choice/Choice";
|
|
25
26
|
export * from "./components/Submit/Submit";
|
|
26
27
|
export * from "./components/LinkLoader/LinkLoader";
|
|
27
28
|
export * from "./components/ThemeAdapter/ThemeAdapter";
|