@g4rcez/components 1.0.1 → 1.0.2
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/index.js +19 -19
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +2681 -2681
- package/dist/index.mjs.map +1 -1
- package/dist/index.umd.js +19 -19
- package/dist/index.umd.js.map +1 -1
- package/dist/src/components/floating/menu.d.ts +5 -2
- package/dist/src/components/floating/menu.d.ts.map +1 -1
- package/dist/src/components/floating/menu.js +2 -2
- package/dist/src/components/floating/modal.js +1 -1
- package/package.json +1 -1
|
@@ -6,6 +6,7 @@ export type MenuProps = Partial<{
|
|
|
6
6
|
nested: boolean;
|
|
7
7
|
asChild: boolean;
|
|
8
8
|
isParent: boolean;
|
|
9
|
+
restoreFocus: boolean;
|
|
9
10
|
children: React.ReactNode;
|
|
10
11
|
floatingClassName: string;
|
|
11
12
|
FloatingComponent: React.ElementType;
|
|
@@ -21,23 +22,25 @@ type MenuItemProps = {
|
|
|
21
22
|
Right?: React.FC<LucideProps>;
|
|
22
23
|
};
|
|
23
24
|
export declare const MenuItem: React.ForwardRefExoticComponent<Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, keyof MenuItemProps> & MenuItemProps & React.RefAttributes<HTMLButtonElement>>;
|
|
24
|
-
export declare const Menu: React.ForwardRefExoticComponent<(Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "children" | "open" | "hover" | "asChild" | "nested" | "isParent" | "floatingClassName" | "FloatingComponent"> & Partial<{
|
|
25
|
+
export declare const Menu: React.ForwardRefExoticComponent<(Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "children" | "open" | "hover" | "asChild" | "restoreFocus" | "nested" | "isParent" | "floatingClassName" | "FloatingComponent"> & Partial<{
|
|
25
26
|
hover: boolean;
|
|
26
27
|
open?: boolean;
|
|
27
28
|
nested: boolean;
|
|
28
29
|
asChild: boolean;
|
|
29
30
|
isParent: boolean;
|
|
31
|
+
restoreFocus: boolean;
|
|
30
32
|
children: React.ReactNode;
|
|
31
33
|
floatingClassName: string;
|
|
32
34
|
FloatingComponent: React.ElementType;
|
|
33
35
|
} & {
|
|
34
36
|
label: string;
|
|
35
|
-
}>, "ref"> | Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "children" | "open" | "hover" | "asChild" | "nested" | "isParent" | "floatingClassName" | "FloatingComponent"> & Partial<{
|
|
37
|
+
}>, "ref"> | Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "label" | "children" | "open" | "hover" | "asChild" | "restoreFocus" | "nested" | "isParent" | "floatingClassName" | "FloatingComponent"> & Partial<{
|
|
36
38
|
hover: boolean;
|
|
37
39
|
open?: boolean;
|
|
38
40
|
nested: boolean;
|
|
39
41
|
asChild: boolean;
|
|
40
42
|
isParent: boolean;
|
|
43
|
+
restoreFocus: boolean;
|
|
41
44
|
children: React.ReactNode;
|
|
42
45
|
floatingClassName: string;
|
|
43
46
|
FloatingComponent: React.ElementType;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"menu.d.ts","sourceRoot":"","sources":["../../../../src/components/floating/menu.tsx"],"names":[],"mappings":"AA0BA,OAAO,EAAoB,WAAW,EAAE,MAAM,cAAc,CAAC;AAC7D,OAAO,KAA2E,MAAM,OAAO,CAAC;AA6BhG,MAAM,MAAM,SAAS,GAAG,OAAO,CAC3B;IACI,KAAK,EAAE,OAAO,CAAC;IACf,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,iBAAiB,EAAE,MAAM,CAAC;IAC1B,iBAAiB,EAAE,KAAK,CAAC,WAAW,CAAC;CACxC,GAAG,CAAC;IAAE,KAAK,EAAE,MAAM,CAAA;CAAE,GAAG;IAAE,KAAK,EAAE,KAAK,CAAC,YAAY,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC,CACzE,CAAC;AAkKF,KAAK,aAAa,GAAG;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAAC,KAAK,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAAC,CAAA;CAAE,CAAC;AAE1F,eAAO,MAAM,QAAQ,oKAmCpB,CAAC;AAEF,eAAO,MAAM,IAAI;
|
|
1
|
+
{"version":3,"file":"menu.d.ts","sourceRoot":"","sources":["../../../../src/components/floating/menu.tsx"],"names":[],"mappings":"AA0BA,OAAO,EAAoB,WAAW,EAAE,MAAM,cAAc,CAAC;AAC7D,OAAO,KAA2E,MAAM,OAAO,CAAC;AA6BhG,MAAM,MAAM,SAAS,GAAG,OAAO,CAC3B;IACI,KAAK,EAAE,OAAO,CAAC;IACf,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,MAAM,EAAE,OAAO,CAAC;IAChB,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,OAAO,CAAC;IAClB,YAAY,EAAE,OAAO,CAAC;IACtB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,iBAAiB,EAAE,MAAM,CAAC;IAC1B,iBAAiB,EAAE,KAAK,CAAC,WAAW,CAAC;CACxC,GAAG,CAAC;IAAE,KAAK,EAAE,MAAM,CAAA;CAAE,GAAG;IAAE,KAAK,EAAE,KAAK,CAAC,YAAY,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC,CACzE,CAAC;AAkKF,KAAK,aAAa,GAAG;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAAC,KAAK,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAAC,CAAA;CAAE,CAAC;AAE1F,eAAO,MAAM,QAAQ,oKAmCpB,CAAC;AAEF,eAAO,MAAM,IAAI;WAnNF,OAAO;WACP,OAAO;YACN,OAAO;aACN,OAAO;cACN,OAAO;kBACH,OAAO;cACX,KAAK,CAAC,SAAS;uBACN,MAAM;uBACN,KAAK,CAAC,WAAW;;WAC1B,MAAM;;WATT,OAAO;WACP,OAAO;YACN,OAAO;aACN,OAAO;cACN,OAAO;kBACH,OAAO;cACX,KAAK,CAAC,SAAS;uBACN,MAAM;uBACN,KAAK,CAAC,WAAW;;WACN,KAAK,CAAC,YAAY;WAAS,MAAM;qDAmNrE,CAAC"}
|
|
@@ -14,7 +14,7 @@ const MenuContext = createContext({
|
|
|
14
14
|
setActiveIndex: () => { },
|
|
15
15
|
setHasFocusInside: () => { },
|
|
16
16
|
});
|
|
17
|
-
const MenuComponent = React.forwardRef(({ children, FloatingComponent = "div", hover = true, open, isParent, floatingClassName = "", label, ...props }, forwardedRef) => {
|
|
17
|
+
const MenuComponent = React.forwardRef(({ children, FloatingComponent = "div", hover = true, open, isParent = false, restoreFocus = false, floatingClassName = "", label, ...props }, forwardedRef) => {
|
|
18
18
|
const [isOpen, setIsOpen] = useState(open ?? false);
|
|
19
19
|
const [hasFocusInside, setHasFocusInside] = useState(false);
|
|
20
20
|
const [activeIndex, setActiveIndex] = useState(null);
|
|
@@ -98,7 +98,7 @@ const MenuComponent = React.forwardRef(({ children, FloatingComponent = "div", h
|
|
|
98
98
|
setHasFocusInside(false);
|
|
99
99
|
parent.setHasFocusInside(true);
|
|
100
100
|
},
|
|
101
|
-
})), children: [label, isNested && (_jsxs("span", { style: { marginLeft: 10, fontSize: 10 }, children: [_jsx("span", { className: "sr-only", children: "Next menu" }), _jsx(ChevronRightIcon, { size: 14 })] }))] })) }), _jsx(MenuContext.Provider, { value: { activeIndex, setActiveIndex, getItemProps, setHasFocusInside, isOpen }, children: _jsx(FloatingList, { elementsRef: elementsRef, labelsRef: labelsRef, children: isOpen && (_jsx(FloatingPortal, { preserveTabOrder: true, children: _jsx(FloatingFocusManager, { context: context, modal: false, initialFocus: isNested ? -1 : 0, returnFocus: !isNested, children: _jsx(FloatingComponent, { ...getFloatingProps(), ref: refs.setFloating, style: { ...props.style, ...floatingStyles }, className: css("isolate z-tooltip flex max-h-80 flex-col items-start overflow-y-auto rounded-lg border border-floating-border bg-floating-background text-left shadow-xl outline-none", floatingClassName), children: children }) }) })) }) })] }));
|
|
101
|
+
})), children: [label, isNested && (_jsxs("span", { style: { marginLeft: 10, fontSize: 10 }, children: [_jsx("span", { className: "sr-only", children: "Next menu" }), _jsx(ChevronRightIcon, { size: 14 })] }))] })) }), _jsx(MenuContext.Provider, { value: { activeIndex, setActiveIndex, getItemProps, setHasFocusInside, isOpen }, children: _jsx(FloatingList, { elementsRef: elementsRef, labelsRef: labelsRef, children: isOpen && (_jsx(FloatingPortal, { preserveTabOrder: true, children: _jsx(FloatingFocusManager, { context: context, modal: false, initialFocus: isNested ? -1 : 0, returnFocus: isParent ? restoreFocus : !isNested, children: _jsx(FloatingComponent, { ...getFloatingProps(), ref: refs.setFloating, style: { ...props.style, ...floatingStyles }, className: css("isolate z-tooltip flex max-h-80 flex-col items-start overflow-y-auto rounded-lg border border-floating-border bg-floating-background text-left shadow-xl outline-none", floatingClassName), children: children }) }) })) }) })] }));
|
|
102
102
|
});
|
|
103
103
|
export const MenuItem = React.forwardRef(({ title, Right, disabled, children, ...props }, forwardedRef) => {
|
|
104
104
|
const menu = useContext(MenuContext);
|
|
@@ -156,5 +156,5 @@ export const Modal = forwardRef(({ open, title, footer, asChild, trigger, childr
|
|
|
156
156
|
"aria-modal": open,
|
|
157
157
|
ref: mergeRefs(floating.refs.setFloating, removeScrollRef),
|
|
158
158
|
className: css(variants({ position, type }), className, "overscroll-contain"),
|
|
159
|
-
}), "data-component": "modal", style: type === "drawer" ? { width: floatingSize } : { height: floatingSize }, children: [title ? (_jsx("header", { className: "relative w-full", children: title ? (_jsx("h2", { id: headingId, className: "px-8 pb-2 text-3xl font-medium leading-relaxed border-b select-text border-floating-border", children: title })) : null })) : null, _jsx("section", { className: css("flex-1 overflow-y-auto px-8 select-text py-1", bodyClassName), children: children }), footer ? _jsx("footer", { className: "px-8 pt-4 w-full border-t select-text border-floating-border", children: footer }) : null, closable ? (_jsx("nav", { className: "absolute top-1 right-4 z-floating", children: _jsx("button", { type: "button", onClick: onClose, className: "p-1 opacity-70 transition-colors hover:opacity-100 hover:text-danger focus:text-danger", children: _jsx(XIcon, {}) }) })) : null, useResizer && resizer ? (_jsx(Draggable, { onChange: onChange,
|
|
159
|
+
}), "data-component": "modal", style: type === "drawer" ? { width: floatingSize } : { height: floatingSize }, children: [title ? (_jsx("header", { className: "relative w-full", children: title ? (_jsx("h2", { id: headingId, className: "px-8 pb-2 text-3xl font-medium leading-relaxed border-b select-text border-floating-border", children: title })) : null })) : null, _jsx("section", { className: css("flex-1 overflow-y-auto px-8 select-text py-1", bodyClassName), children: children }), footer ? _jsx("footer", { className: "px-8 pt-4 w-full border-t select-text border-floating-border", children: footer }) : null, closable ? (_jsx("nav", { className: "absolute top-1 right-4 z-floating", children: _jsx("button", { type: "button", onClick: onClose, className: "p-1 opacity-70 transition-colors hover:opacity-100 hover:text-danger focus:text-danger", children: _jsx(XIcon, {}) }) })) : null, useResizer && resizer ? (_jsx(Draggable, { onChange: onChange, value: floatingSize, sheet: type === "sheet", position: position, parent: floating.refs.floating })) : null] }) }) })) : null }) })] }));
|
|
160
160
|
});
|