node_modules ignore

This commit is contained in:
2025-05-08 23:43:47 +02:00
parent e19d52f172
commit 4574544c9f
65041 changed files with 10593536 additions and 0 deletions

13
server/node_modules/@radix-ui/react-menu/README.md generated vendored Normal file
View File

@@ -0,0 +1,13 @@
# `react-menu`
## Installation
```sh
$ yarn add @radix-ui/react-menu
# or
$ npm install @radix-ui/react-menu
```
## Usage
This is an internal utility, not intended for public usage.

View File

@@ -0,0 +1,168 @@
import * as React from "react";
import { DismissableLayer } from "@radix-ui/react-dismissable-layer";
import { FocusScope } from "@radix-ui/react-focus-scope";
import * as PopperPrimitive from "@radix-ui/react-popper";
import { Portal as _Portal1 } from "@radix-ui/react-portal";
import * as Radix from "@radix-ui/react-primitive";
import { Primitive } from "@radix-ui/react-primitive";
import * as RovingFocusGroup from "@radix-ui/react-roving-focus";
type Direction = 'ltr' | 'rtl';
export const createMenuScope: import("@radix-ui/react-context").CreateScope;
export interface MenuProps {
children?: React.ReactNode;
open?: boolean;
onOpenChange?(open: boolean): void;
dir?: Direction;
modal?: boolean;
}
export const Menu: React.FC<MenuProps>;
type PopperAnchorProps = Radix.ComponentPropsWithoutRef<typeof PopperPrimitive.Anchor>;
export interface MenuAnchorProps extends PopperAnchorProps {
}
export const MenuAnchor: React.ForwardRefExoticComponent<MenuAnchorProps & React.RefAttributes<HTMLDivElement>>;
type PortalProps = React.ComponentPropsWithoutRef<typeof _Portal1>;
export interface MenuPortalProps {
children?: React.ReactNode;
/**
* Specify a container element to portal the content into.
*/
container?: PortalProps['container'];
/**
* Used to force mounting when more control is needed. Useful when
* controlling animation with React animation libraries.
*/
forceMount?: true;
}
export const MenuPortal: React.FC<MenuPortalProps>;
/**
* We purposefully don't union MenuRootContent and MenuSubContent props here because
* they have conflicting prop types. We agreed that we would allow MenuSubContent to
* accept props that it would just ignore.
*/
export interface MenuContentProps extends MenuRootContentTypeProps {
/**
* Used to force mounting when more control is needed. Useful when
* controlling animation with React animation libraries.
*/
forceMount?: true;
}
export const MenuContent: React.ForwardRefExoticComponent<MenuContentProps & React.RefAttributes<HTMLDivElement>>;
interface MenuRootContentTypeProps extends Omit<MenuContentImplProps, keyof MenuContentImplPrivateProps> {
}
type FocusScopeProps = Radix.ComponentPropsWithoutRef<typeof FocusScope>;
type DismissableLayerProps = Radix.ComponentPropsWithoutRef<typeof DismissableLayer>;
type RovingFocusGroupProps = Radix.ComponentPropsWithoutRef<typeof RovingFocusGroup.Root>;
type PopperContentProps = Radix.ComponentPropsWithoutRef<typeof PopperPrimitive.Content>;
type MenuContentImplPrivateProps = {
onOpenAutoFocus?: FocusScopeProps['onMountAutoFocus'];
onDismiss?: DismissableLayerProps['onDismiss'];
disableOutsidePointerEvents?: DismissableLayerProps['disableOutsidePointerEvents'];
/**
* Whether scrolling outside the `MenuContent` should be prevented
* (default: `false`)
*/
disableOutsideScroll?: boolean;
/**
* Whether focus should be trapped within the `MenuContent`
* (default: false)
*/
trapFocus?: FocusScopeProps['trapped'];
};
interface MenuContentImplProps extends MenuContentImplPrivateProps, Omit<PopperContentProps, 'dir' | 'onPlaced'> {
/**
* Event handler called when auto-focusing on close.
* Can be prevented.
*/
onCloseAutoFocus?: FocusScopeProps['onUnmountAutoFocus'];
/**
* Whether keyboard navigation should loop around
* @defaultValue false
*/
loop?: RovingFocusGroupProps['loop'];
onEntryFocus?: RovingFocusGroupProps['onEntryFocus'];
onEscapeKeyDown?: DismissableLayerProps['onEscapeKeyDown'];
onPointerDownOutside?: DismissableLayerProps['onPointerDownOutside'];
onFocusOutside?: DismissableLayerProps['onFocusOutside'];
onInteractOutside?: DismissableLayerProps['onInteractOutside'];
}
type PrimitiveDivProps = Radix.ComponentPropsWithoutRef<typeof Primitive.div>;
export interface MenuGroupProps extends PrimitiveDivProps {
}
export const MenuGroup: React.ForwardRefExoticComponent<MenuGroupProps & React.RefAttributes<HTMLDivElement>>;
export interface MenuLabelProps extends PrimitiveDivProps {
}
export const MenuLabel: React.ForwardRefExoticComponent<MenuLabelProps & React.RefAttributes<HTMLDivElement>>;
export interface MenuItemProps extends Omit<MenuItemImplProps, 'onSelect'> {
onSelect?: (event: Event) => void;
}
export const MenuItem: React.ForwardRefExoticComponent<MenuItemProps & React.RefAttributes<HTMLDivElement>>;
interface MenuItemImplProps extends PrimitiveDivProps {
disabled?: boolean;
textValue?: string;
}
type CheckedState = boolean | 'indeterminate';
export interface MenuCheckboxItemProps extends MenuItemProps {
checked?: CheckedState;
onCheckedChange?: (checked: boolean) => void;
}
export const MenuCheckboxItem: React.ForwardRefExoticComponent<MenuCheckboxItemProps & React.RefAttributes<HTMLDivElement>>;
export interface MenuRadioGroupProps extends MenuGroupProps {
value?: string;
onValueChange?: (value: string) => void;
}
export const MenuRadioGroup: React.ForwardRefExoticComponent<MenuRadioGroupProps & React.RefAttributes<HTMLDivElement>>;
export interface MenuRadioItemProps extends MenuItemProps {
value: string;
}
export const MenuRadioItem: React.ForwardRefExoticComponent<MenuRadioItemProps & React.RefAttributes<HTMLDivElement>>;
type PrimitiveSpanProps = Radix.ComponentPropsWithoutRef<typeof Primitive.span>;
export interface MenuItemIndicatorProps extends PrimitiveSpanProps {
/**
* Used to force mounting when more control is needed. Useful when
* controlling animation with React animation libraries.
*/
forceMount?: true;
}
export const MenuItemIndicator: React.ForwardRefExoticComponent<MenuItemIndicatorProps & React.RefAttributes<HTMLSpanElement>>;
export interface MenuSeparatorProps extends PrimitiveDivProps {
}
export const MenuSeparator: React.ForwardRefExoticComponent<MenuSeparatorProps & React.RefAttributes<HTMLDivElement>>;
type PopperArrowProps = Radix.ComponentPropsWithoutRef<typeof PopperPrimitive.Arrow>;
export interface MenuArrowProps extends PopperArrowProps {
}
export const MenuArrow: React.ForwardRefExoticComponent<MenuArrowProps & React.RefAttributes<SVGSVGElement>>;
export interface MenuSubProps {
children?: React.ReactNode;
open?: boolean;
onOpenChange?(open: boolean): void;
}
export const MenuSub: React.FC<MenuSubProps>;
export interface MenuSubTriggerProps extends MenuItemImplProps {
}
export const MenuSubTrigger: React.ForwardRefExoticComponent<MenuSubTriggerProps & React.RefAttributes<HTMLDivElement>>;
export interface MenuSubContentProps extends Omit<MenuContentImplProps, keyof MenuContentImplPrivateProps | 'onCloseAutoFocus' | 'onEntryFocus' | 'side' | 'align'> {
/**
* Used to force mounting when more control is needed. Useful when
* controlling animation with React animation libraries.
*/
forceMount?: true;
}
export const MenuSubContent: React.ForwardRefExoticComponent<MenuSubContentProps & React.RefAttributes<HTMLDivElement>>;
export const Root: React.FC<MenuProps>;
export const Anchor: React.ForwardRefExoticComponent<MenuAnchorProps & React.RefAttributes<HTMLDivElement>>;
export const Portal: React.FC<MenuPortalProps>;
export const Content: React.ForwardRefExoticComponent<MenuContentProps & React.RefAttributes<HTMLDivElement>>;
export const Group: React.ForwardRefExoticComponent<MenuGroupProps & React.RefAttributes<HTMLDivElement>>;
export const Label: React.ForwardRefExoticComponent<MenuLabelProps & React.RefAttributes<HTMLDivElement>>;
export const Item: React.ForwardRefExoticComponent<MenuItemProps & React.RefAttributes<HTMLDivElement>>;
export const CheckboxItem: React.ForwardRefExoticComponent<MenuCheckboxItemProps & React.RefAttributes<HTMLDivElement>>;
export const RadioGroup: React.ForwardRefExoticComponent<MenuRadioGroupProps & React.RefAttributes<HTMLDivElement>>;
export const RadioItem: React.ForwardRefExoticComponent<MenuRadioItemProps & React.RefAttributes<HTMLDivElement>>;
export const ItemIndicator: React.ForwardRefExoticComponent<MenuItemIndicatorProps & React.RefAttributes<HTMLSpanElement>>;
export const Separator: React.ForwardRefExoticComponent<MenuSeparatorProps & React.RefAttributes<HTMLDivElement>>;
export const Arrow: React.ForwardRefExoticComponent<MenuArrowProps & React.RefAttributes<SVGSVGElement>>;
export const Sub: React.FC<MenuSubProps>;
export const SubTrigger: React.ForwardRefExoticComponent<MenuSubTriggerProps & React.RefAttributes<HTMLDivElement>>;
export const SubContent: React.ForwardRefExoticComponent<MenuSubContentProps & React.RefAttributes<HTMLDivElement>>;
//# sourceMappingURL=index.d.ts.map

View File

@@ -0,0 +1,168 @@
import * as React from "react";
import { DismissableLayer } from "@radix-ui/react-dismissable-layer";
import { FocusScope } from "@radix-ui/react-focus-scope";
import * as PopperPrimitive from "@radix-ui/react-popper";
import { Portal as _Portal1 } from "@radix-ui/react-portal";
import * as Radix from "@radix-ui/react-primitive";
import { Primitive } from "@radix-ui/react-primitive";
import * as RovingFocusGroup from "@radix-ui/react-roving-focus";
type Direction = 'ltr' | 'rtl';
export const createMenuScope: import("@radix-ui/react-context").CreateScope;
export interface MenuProps {
children?: React.ReactNode;
open?: boolean;
onOpenChange?(open: boolean): void;
dir?: Direction;
modal?: boolean;
}
export const Menu: React.FC<MenuProps>;
type PopperAnchorProps = Radix.ComponentPropsWithoutRef<typeof PopperPrimitive.Anchor>;
export interface MenuAnchorProps extends PopperAnchorProps {
}
export const MenuAnchor: React.ForwardRefExoticComponent<MenuAnchorProps & React.RefAttributes<HTMLDivElement>>;
type PortalProps = React.ComponentPropsWithoutRef<typeof _Portal1>;
export interface MenuPortalProps {
children?: React.ReactNode;
/**
* Specify a container element to portal the content into.
*/
container?: PortalProps['container'];
/**
* Used to force mounting when more control is needed. Useful when
* controlling animation with React animation libraries.
*/
forceMount?: true;
}
export const MenuPortal: React.FC<MenuPortalProps>;
/**
* We purposefully don't union MenuRootContent and MenuSubContent props here because
* they have conflicting prop types. We agreed that we would allow MenuSubContent to
* accept props that it would just ignore.
*/
export interface MenuContentProps extends MenuRootContentTypeProps {
/**
* Used to force mounting when more control is needed. Useful when
* controlling animation with React animation libraries.
*/
forceMount?: true;
}
export const MenuContent: React.ForwardRefExoticComponent<MenuContentProps & React.RefAttributes<HTMLDivElement>>;
interface MenuRootContentTypeProps extends Omit<MenuContentImplProps, keyof MenuContentImplPrivateProps> {
}
type FocusScopeProps = Radix.ComponentPropsWithoutRef<typeof FocusScope>;
type DismissableLayerProps = Radix.ComponentPropsWithoutRef<typeof DismissableLayer>;
type RovingFocusGroupProps = Radix.ComponentPropsWithoutRef<typeof RovingFocusGroup.Root>;
type PopperContentProps = Radix.ComponentPropsWithoutRef<typeof PopperPrimitive.Content>;
type MenuContentImplPrivateProps = {
onOpenAutoFocus?: FocusScopeProps['onMountAutoFocus'];
onDismiss?: DismissableLayerProps['onDismiss'];
disableOutsidePointerEvents?: DismissableLayerProps['disableOutsidePointerEvents'];
/**
* Whether scrolling outside the `MenuContent` should be prevented
* (default: `false`)
*/
disableOutsideScroll?: boolean;
/**
* Whether focus should be trapped within the `MenuContent`
* (default: false)
*/
trapFocus?: FocusScopeProps['trapped'];
};
interface MenuContentImplProps extends MenuContentImplPrivateProps, Omit<PopperContentProps, 'dir' | 'onPlaced'> {
/**
* Event handler called when auto-focusing on close.
* Can be prevented.
*/
onCloseAutoFocus?: FocusScopeProps['onUnmountAutoFocus'];
/**
* Whether keyboard navigation should loop around
* @defaultValue false
*/
loop?: RovingFocusGroupProps['loop'];
onEntryFocus?: RovingFocusGroupProps['onEntryFocus'];
onEscapeKeyDown?: DismissableLayerProps['onEscapeKeyDown'];
onPointerDownOutside?: DismissableLayerProps['onPointerDownOutside'];
onFocusOutside?: DismissableLayerProps['onFocusOutside'];
onInteractOutside?: DismissableLayerProps['onInteractOutside'];
}
type PrimitiveDivProps = Radix.ComponentPropsWithoutRef<typeof Primitive.div>;
export interface MenuGroupProps extends PrimitiveDivProps {
}
export const MenuGroup: React.ForwardRefExoticComponent<MenuGroupProps & React.RefAttributes<HTMLDivElement>>;
export interface MenuLabelProps extends PrimitiveDivProps {
}
export const MenuLabel: React.ForwardRefExoticComponent<MenuLabelProps & React.RefAttributes<HTMLDivElement>>;
export interface MenuItemProps extends Omit<MenuItemImplProps, 'onSelect'> {
onSelect?: (event: Event) => void;
}
export const MenuItem: React.ForwardRefExoticComponent<MenuItemProps & React.RefAttributes<HTMLDivElement>>;
interface MenuItemImplProps extends PrimitiveDivProps {
disabled?: boolean;
textValue?: string;
}
type CheckedState = boolean | 'indeterminate';
export interface MenuCheckboxItemProps extends MenuItemProps {
checked?: CheckedState;
onCheckedChange?: (checked: boolean) => void;
}
export const MenuCheckboxItem: React.ForwardRefExoticComponent<MenuCheckboxItemProps & React.RefAttributes<HTMLDivElement>>;
export interface MenuRadioGroupProps extends MenuGroupProps {
value?: string;
onValueChange?: (value: string) => void;
}
export const MenuRadioGroup: React.ForwardRefExoticComponent<MenuRadioGroupProps & React.RefAttributes<HTMLDivElement>>;
export interface MenuRadioItemProps extends MenuItemProps {
value: string;
}
export const MenuRadioItem: React.ForwardRefExoticComponent<MenuRadioItemProps & React.RefAttributes<HTMLDivElement>>;
type PrimitiveSpanProps = Radix.ComponentPropsWithoutRef<typeof Primitive.span>;
export interface MenuItemIndicatorProps extends PrimitiveSpanProps {
/**
* Used to force mounting when more control is needed. Useful when
* controlling animation with React animation libraries.
*/
forceMount?: true;
}
export const MenuItemIndicator: React.ForwardRefExoticComponent<MenuItemIndicatorProps & React.RefAttributes<HTMLSpanElement>>;
export interface MenuSeparatorProps extends PrimitiveDivProps {
}
export const MenuSeparator: React.ForwardRefExoticComponent<MenuSeparatorProps & React.RefAttributes<HTMLDivElement>>;
type PopperArrowProps = Radix.ComponentPropsWithoutRef<typeof PopperPrimitive.Arrow>;
export interface MenuArrowProps extends PopperArrowProps {
}
export const MenuArrow: React.ForwardRefExoticComponent<MenuArrowProps & React.RefAttributes<SVGSVGElement>>;
export interface MenuSubProps {
children?: React.ReactNode;
open?: boolean;
onOpenChange?(open: boolean): void;
}
export const MenuSub: React.FC<MenuSubProps>;
export interface MenuSubTriggerProps extends MenuItemImplProps {
}
export const MenuSubTrigger: React.ForwardRefExoticComponent<MenuSubTriggerProps & React.RefAttributes<HTMLDivElement>>;
export interface MenuSubContentProps extends Omit<MenuContentImplProps, keyof MenuContentImplPrivateProps | 'onCloseAutoFocus' | 'onEntryFocus' | 'side' | 'align'> {
/**
* Used to force mounting when more control is needed. Useful when
* controlling animation with React animation libraries.
*/
forceMount?: true;
}
export const MenuSubContent: React.ForwardRefExoticComponent<MenuSubContentProps & React.RefAttributes<HTMLDivElement>>;
export const Root: React.FC<MenuProps>;
export const Anchor: React.ForwardRefExoticComponent<MenuAnchorProps & React.RefAttributes<HTMLDivElement>>;
export const Portal: React.FC<MenuPortalProps>;
export const Content: React.ForwardRefExoticComponent<MenuContentProps & React.RefAttributes<HTMLDivElement>>;
export const Group: React.ForwardRefExoticComponent<MenuGroupProps & React.RefAttributes<HTMLDivElement>>;
export const Label: React.ForwardRefExoticComponent<MenuLabelProps & React.RefAttributes<HTMLDivElement>>;
export const Item: React.ForwardRefExoticComponent<MenuItemProps & React.RefAttributes<HTMLDivElement>>;
export const CheckboxItem: React.ForwardRefExoticComponent<MenuCheckboxItemProps & React.RefAttributes<HTMLDivElement>>;
export const RadioGroup: React.ForwardRefExoticComponent<MenuRadioGroupProps & React.RefAttributes<HTMLDivElement>>;
export const RadioItem: React.ForwardRefExoticComponent<MenuRadioItemProps & React.RefAttributes<HTMLDivElement>>;
export const ItemIndicator: React.ForwardRefExoticComponent<MenuItemIndicatorProps & React.RefAttributes<HTMLSpanElement>>;
export const Separator: React.ForwardRefExoticComponent<MenuSeparatorProps & React.RefAttributes<HTMLDivElement>>;
export const Arrow: React.ForwardRefExoticComponent<MenuArrowProps & React.RefAttributes<SVGSVGElement>>;
export const Sub: React.FC<MenuSubProps>;
export const SubTrigger: React.ForwardRefExoticComponent<MenuSubTriggerProps & React.RefAttributes<HTMLDivElement>>;
export const SubContent: React.ForwardRefExoticComponent<MenuSubContentProps & React.RefAttributes<HTMLDivElement>>;
//# sourceMappingURL=index.d.ts.map

View File

@@ -0,0 +1 @@
{"mappings":";;;;;;;;AAyBA,iBAAiB,KAAK,GAAG,KAAK,CAAC;AA4B/B,OAAA,sFAIE,CAAC;AAsBH;IACE,QAAQ,CAAC,EAAE,MAAM,SAAS,CAAC;IAC3B,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,YAAY,CAAC,CAAC,IAAI,EAAE,OAAO,GAAG,IAAI,CAAC;IACnC,GAAG,CAAC,EAAE,SAAS,CAAC;IAChB,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED,OAAA,MAAM,MAAM,MAAM,EAAE,CAAC,SAAS,CA8C7B,CAAC;AAWF,yBAAyB,MAAM,wBAAwB,CAAC,OAAO,gBAAgB,MAAM,CAAC,CAAC;AACvF,gCAA0B,SAAQ,iBAAiB;CAAG;AAEtD,OAAA,MAAM,kGAML,CAAC;AAeF,mBAAmB,MAAM,wBAAwB,CAAC,eAAsB,CAAC,CAAC;AAC1E;IACE,QAAQ,CAAC,EAAE,MAAM,SAAS,CAAC;IAC3B;;OAEG;IACH,SAAS,CAAC,EAAE,WAAW,CAAC,WAAW,CAAC,CAAC;IACrC;;;OAGG;IACH,UAAU,CAAC,EAAE,IAAI,CAAC;CACnB;AAED,OAAA,MAAM,YAAY,MAAM,EAAE,CAAC,eAAe,CAYzC,CAAC;AAsBF;;;;GAIG;AACH,iCAA2B,SAAQ,wBAAwB;IACzD;;;OAGG;IACH,UAAU,CAAC,EAAE,IAAI,CAAC;CACnB;AAED,OAAA,MAAM,oGAqBL,CAAC;AAKF,kCACE,SAAQ,IAAI,CAAC,oBAAoB,EAAE,MAAM,2BAA2B,CAAC;CAAG;AA0D1E,uBAAuB,MAAM,wBAAwB,CAAC,iBAAiB,CAAC,CAAC;AACzE,6BAA6B,MAAM,wBAAwB,CAAC,uBAAuB,CAAC,CAAC;AACrF,6BAA6B,MAAM,wBAAwB,CAAC,OAAO,iBAAiB,IAAI,CAAC,CAAC;AAC1F,0BAA0B,MAAM,wBAAwB,CAAC,OAAO,gBAAgB,OAAO,CAAC,CAAC;AACzF,mCAAmC;IACjC,eAAe,CAAC,EAAE,eAAe,CAAC,kBAAkB,CAAC,CAAC;IACtD,SAAS,CAAC,EAAE,qBAAqB,CAAC,WAAW,CAAC,CAAC;IAC/C,2BAA2B,CAAC,EAAE,qBAAqB,CAAC,6BAA6B,CAAC,CAAC;IAEnF;;;OAGG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAE/B;;;OAGG;IACH,SAAS,CAAC,EAAE,eAAe,CAAC,SAAS,CAAC,CAAC;CACxC,CAAC;AACF,8BACE,SAAQ,2BAA2B,EACjC,IAAI,CAAC,kBAAkB,EAAE,KAAK,GAAG,UAAU,CAAC;IAC9C;;;OAGG;IACH,gBAAgB,CAAC,EAAE,eAAe,CAAC,oBAAoB,CAAC,CAAC;IAEzD;;;OAGG;IACH,IAAI,CAAC,EAAE,qBAAqB,CAAC,MAAM,CAAC,CAAC;IAErC,YAAY,CAAC,EAAE,qBAAqB,CAAC,cAAc,CAAC,CAAC;IACrD,eAAe,CAAC,EAAE,qBAAqB,CAAC,iBAAiB,CAAC,CAAC;IAC3D,oBAAoB,CAAC,EAAE,qBAAqB,CAAC,sBAAsB,CAAC,CAAC;IACrE,cAAc,CAAC,EAAE,qBAAqB,CAAC,gBAAgB,CAAC,CAAC;IACzD,iBAAiB,CAAC,EAAE,qBAAqB,CAAC,mBAAmB,CAAC,CAAC;CAChE;AAsND,yBAAyB,MAAM,wBAAwB,CAAC,OAAO,UAAU,GAAG,CAAC,CAAC;AAC9E,+BAAyB,SAAQ,iBAAiB;CAAG;AAErD,OAAA,MAAM,gGAKL,CAAC;AAWF,+BAAyB,SAAQ,iBAAiB;CAAG;AAErD,OAAA,MAAM,gGAKL,CAAC;AAYF,8BAAwB,SAAQ,IAAI,CAAC,iBAAiB,EAAE,UAAU,CAAC;IACjE,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;CACnC;AAED,OAAA,MAAM,8FAwDL,CAAC;AAOF,2BAA4B,SAAQ,iBAAiB;IACnD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAgFD,oBAAoB,OAAO,GAAG,eAAe,CAAC;AAE9C,sCAAgC,SAAQ,aAAa;IACnD,OAAO,CAAC,EAAE,YAAY,CAAC;IAEvB,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;CAC9C;AAED,OAAA,MAAM,8GAoBL,CAAC;AAgBF,oCAA8B,SAAQ,cAAc;IAClD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACzC;AAED,OAAA,MAAM,0GAUL,CAAC;AAWF,mCAA6B,SAAQ,aAAa;IAChD,KAAK,EAAE,MAAM,CAAC;CACf;AAED,OAAA,MAAM,wGAsBL,CAAC;AAkBF,0BAA0B,MAAM,wBAAwB,CAAC,OAAO,UAAU,IAAI,CAAC,CAAC;AAChF,uCAAiC,SAAQ,kBAAkB;IACzD;;;OAGG;IACH,UAAU,CAAC,EAAE,IAAI,CAAC;CACnB;AAED,OAAA,MAAM,iHAoBL,CAAC;AAWF,mCAA6B,SAAQ,iBAAiB;CAAG;AAEzD,OAAA,MAAM,wGAYL,CAAC;AAWF,wBAAwB,MAAM,wBAAwB,CAAC,OAAO,gBAAgB,KAAK,CAAC,CAAC;AACrF,+BAAyB,SAAQ,gBAAgB;CAAG;AAEpD,OAAA,MAAM,+FAML,CAAC;AAmBF;IACE,QAAQ,CAAC,EAAE,MAAM,SAAS,CAAC;IAC3B,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,YAAY,CAAC,CAAC,IAAI,EAAE,OAAO,GAAG,IAAI,CAAC;CACpC;AAED,OAAA,MAAM,SAAS,MAAM,EAAE,CAAC,YAAY,CAmCnC,CAAC;AAWF,oCAA8B,SAAQ,iBAAiB;CAAG;AAE1D,OAAA,MAAM,0GAuHL,CAAC;AAWF,oCACE,SAAQ,IAAI,CACV,oBAAoB,EACpB,MAAM,2BAA2B,GAAG,kBAAkB,GAAG,cAAc,GAAG,MAAM,GAAG,OAAO,CAC3F;IACD;;;OAGG;IACH,UAAU,CAAC,EAAE,IAAI,CAAC;CACnB;AAED,OAAA,MAAM,0GA2DL,CAAC;AAoGF,OAAA,MAAM,yBAAW,CAAC;AAClB,OAAA,MAAM,8FAAmB,CAAC;AAC1B,OAAA,MAAM,iCAAmB,CAAC;AAC1B,OAAA,MAAM,gGAAqB,CAAC;AAC5B,OAAA,MAAM,4FAAiB,CAAC;AACxB,OAAA,MAAM,4FAAiB,CAAC;AACxB,OAAA,MAAM,0FAAe,CAAC;AACtB,OAAA,MAAM,0GAA+B,CAAC;AACtC,OAAA,MAAM,sGAA2B,CAAC;AAClC,OAAA,MAAM,oGAAyB,CAAC;AAChC,OAAA,MAAM,6GAAiC,CAAC;AACxC,OAAA,MAAM,oGAAyB,CAAC;AAChC,OAAA,MAAM,2FAAiB,CAAC;AACxB,OAAA,MAAM,2BAAa,CAAC;AACpB,OAAA,MAAM,sGAA2B,CAAC;AAClC,OAAA,MAAM,sGAA2B,CAAC","sources":["packages/react/menu/src/packages/react/menu/src/Menu.tsx","packages/react/menu/src/packages/react/menu/src/index.ts","packages/react/menu/src/index.ts"],"sourcesContent":[null,null,"export {\n createMenuScope,\n //\n Menu,\n MenuAnchor,\n MenuPortal,\n MenuContent,\n MenuGroup,\n MenuLabel,\n MenuItem,\n MenuCheckboxItem,\n MenuRadioGroup,\n MenuRadioItem,\n MenuItemIndicator,\n MenuSeparator,\n MenuArrow,\n MenuSub,\n MenuSubTrigger,\n MenuSubContent,\n //\n Root,\n Anchor,\n Portal,\n Content,\n Group,\n Label,\n Item,\n CheckboxItem,\n RadioGroup,\n RadioItem,\n ItemIndicator,\n Separator,\n Arrow,\n Sub,\n SubTrigger,\n SubContent,\n} from './Menu';\nexport type {\n MenuProps,\n MenuAnchorProps,\n MenuPortalProps,\n MenuContentProps,\n MenuGroupProps,\n MenuLabelProps,\n MenuItemProps,\n MenuCheckboxItemProps,\n MenuRadioGroupProps,\n MenuRadioItemProps,\n MenuItemIndicatorProps,\n MenuSeparatorProps,\n MenuArrowProps,\n MenuSubProps,\n MenuSubTriggerProps,\n MenuSubContentProps,\n} from './Menu';\n"],"names":[],"version":3,"file":"index.d.ts.map"}

1029
server/node_modules/@radix-ui/react-menu/dist/index.js generated vendored Normal file

File diff suppressed because it is too large Load Diff

File diff suppressed because one or more lines are too long

990
server/node_modules/@radix-ui/react-menu/dist/index.mjs generated vendored Normal file
View File

@@ -0,0 +1,990 @@
import $epM9y$babelruntimehelpersesmextends from "@babel/runtime/helpers/esm/extends";
import {useState as $epM9y$useState, useRef as $epM9y$useRef, useEffect as $epM9y$useEffect, createElement as $epM9y$createElement, useCallback as $epM9y$useCallback, forwardRef as $epM9y$forwardRef, Fragment as $epM9y$Fragment} from "react";
import {composeEventHandlers as $epM9y$composeEventHandlers} from "@radix-ui/primitive";
import {createCollection as $epM9y$createCollection} from "@radix-ui/react-collection";
import {useComposedRefs as $epM9y$useComposedRefs, composeRefs as $epM9y$composeRefs} from "@radix-ui/react-compose-refs";
import {createContextScope as $epM9y$createContextScope} from "@radix-ui/react-context";
import {useDirection as $epM9y$useDirection} from "@radix-ui/react-direction";
import {DismissableLayer as $epM9y$DismissableLayer} from "@radix-ui/react-dismissable-layer";
import {useFocusGuards as $epM9y$useFocusGuards} from "@radix-ui/react-focus-guards";
import {FocusScope as $epM9y$FocusScope} from "@radix-ui/react-focus-scope";
import {useId as $epM9y$useId} from "@radix-ui/react-id";
import {createPopperScope as $epM9y$createPopperScope, Root as $epM9y$Root, Anchor as $epM9y$Anchor, Content as $epM9y$Content, Arrow as $epM9y$Arrow} from "@radix-ui/react-popper";
import {Portal as $epM9y$Portal} from "@radix-ui/react-portal";
import {Presence as $epM9y$Presence} from "@radix-ui/react-presence";
import {Primitive as $epM9y$Primitive, dispatchDiscreteCustomEvent as $epM9y$dispatchDiscreteCustomEvent} from "@radix-ui/react-primitive";
import {createRovingFocusGroupScope as $epM9y$createRovingFocusGroupScope, Root as $epM9y$Root1, Item as $epM9y$Item} from "@radix-ui/react-roving-focus";
import {Slot as $epM9y$Slot} from "@radix-ui/react-slot";
import {useCallbackRef as $epM9y$useCallbackRef} from "@radix-ui/react-use-callback-ref";
import {hideOthers as $epM9y$hideOthers} from "aria-hidden";
import {RemoveScroll as $epM9y$RemoveScroll} from "react-remove-scroll";
const $6cc32821e9371a1c$var$SELECTION_KEYS = [
'Enter',
' '
];
const $6cc32821e9371a1c$var$FIRST_KEYS = [
'ArrowDown',
'PageUp',
'Home'
];
const $6cc32821e9371a1c$var$LAST_KEYS = [
'ArrowUp',
'PageDown',
'End'
];
const $6cc32821e9371a1c$var$FIRST_LAST_KEYS = [
...$6cc32821e9371a1c$var$FIRST_KEYS,
...$6cc32821e9371a1c$var$LAST_KEYS
];
const $6cc32821e9371a1c$var$SUB_OPEN_KEYS = {
ltr: [
...$6cc32821e9371a1c$var$SELECTION_KEYS,
'ArrowRight'
],
rtl: [
...$6cc32821e9371a1c$var$SELECTION_KEYS,
'ArrowLeft'
]
};
const $6cc32821e9371a1c$var$SUB_CLOSE_KEYS = {
ltr: [
'ArrowLeft'
],
rtl: [
'ArrowRight'
]
};
/* -------------------------------------------------------------------------------------------------
* Menu
* -----------------------------------------------------------------------------------------------*/ const $6cc32821e9371a1c$var$MENU_NAME = 'Menu';
const [$6cc32821e9371a1c$var$Collection, $6cc32821e9371a1c$var$useCollection, $6cc32821e9371a1c$var$createCollectionScope] = $epM9y$createCollection($6cc32821e9371a1c$var$MENU_NAME);
const [$6cc32821e9371a1c$var$createMenuContext, $6cc32821e9371a1c$export$4027731b685e72eb] = $epM9y$createContextScope($6cc32821e9371a1c$var$MENU_NAME, [
$6cc32821e9371a1c$var$createCollectionScope,
$epM9y$createPopperScope,
$epM9y$createRovingFocusGroupScope
]);
const $6cc32821e9371a1c$var$usePopperScope = $epM9y$createPopperScope();
const $6cc32821e9371a1c$var$useRovingFocusGroupScope = $epM9y$createRovingFocusGroupScope();
const [$6cc32821e9371a1c$var$MenuProvider, $6cc32821e9371a1c$var$useMenuContext] = $6cc32821e9371a1c$var$createMenuContext($6cc32821e9371a1c$var$MENU_NAME);
const [$6cc32821e9371a1c$var$MenuRootProvider, $6cc32821e9371a1c$var$useMenuRootContext] = $6cc32821e9371a1c$var$createMenuContext($6cc32821e9371a1c$var$MENU_NAME);
const $6cc32821e9371a1c$export$d9b273488cd8ce6f = (props)=>{
const { __scopeMenu: __scopeMenu , open: open = false , children: children , dir: dir , onOpenChange: onOpenChange , modal: modal = true } = props;
const popperScope = $6cc32821e9371a1c$var$usePopperScope(__scopeMenu);
const [content, setContent] = $epM9y$useState(null);
const isUsingKeyboardRef = $epM9y$useRef(false);
const handleOpenChange = $epM9y$useCallbackRef(onOpenChange);
const direction = $epM9y$useDirection(dir);
$epM9y$useEffect(()=>{
// Capture phase ensures we set the boolean before any side effects execute
// in response to the key or pointer event as they might depend on this value.
const handleKeyDown = ()=>{
isUsingKeyboardRef.current = true;
document.addEventListener('pointerdown', handlePointer, {
capture: true,
once: true
});
document.addEventListener('pointermove', handlePointer, {
capture: true,
once: true
});
};
const handlePointer = ()=>isUsingKeyboardRef.current = false
;
document.addEventListener('keydown', handleKeyDown, {
capture: true
});
return ()=>{
document.removeEventListener('keydown', handleKeyDown, {
capture: true
});
document.removeEventListener('pointerdown', handlePointer, {
capture: true
});
document.removeEventListener('pointermove', handlePointer, {
capture: true
});
};
}, []);
return /*#__PURE__*/ $epM9y$createElement($epM9y$Root, popperScope, /*#__PURE__*/ $epM9y$createElement($6cc32821e9371a1c$var$MenuProvider, {
scope: __scopeMenu,
open: open,
onOpenChange: handleOpenChange,
content: content,
onContentChange: setContent
}, /*#__PURE__*/ $epM9y$createElement($6cc32821e9371a1c$var$MenuRootProvider, {
scope: __scopeMenu,
onClose: $epM9y$useCallback(()=>handleOpenChange(false)
, [
handleOpenChange
]),
isUsingKeyboardRef: isUsingKeyboardRef,
dir: direction,
modal: modal
}, children)));
};
/*#__PURE__*/ Object.assign($6cc32821e9371a1c$export$d9b273488cd8ce6f, {
displayName: $6cc32821e9371a1c$var$MENU_NAME
});
/* -------------------------------------------------------------------------------------------------
* MenuAnchor
* -----------------------------------------------------------------------------------------------*/ const $6cc32821e9371a1c$var$ANCHOR_NAME = 'MenuAnchor';
const $6cc32821e9371a1c$export$9fa5ebd18bee4d43 = /*#__PURE__*/ $epM9y$forwardRef((props, forwardedRef)=>{
const { __scopeMenu: __scopeMenu , ...anchorProps } = props;
const popperScope = $6cc32821e9371a1c$var$usePopperScope(__scopeMenu);
return /*#__PURE__*/ $epM9y$createElement($epM9y$Anchor, $epM9y$babelruntimehelpersesmextends({}, popperScope, anchorProps, {
ref: forwardedRef
}));
});
/*#__PURE__*/ Object.assign($6cc32821e9371a1c$export$9fa5ebd18bee4d43, {
displayName: $6cc32821e9371a1c$var$ANCHOR_NAME
});
/* -------------------------------------------------------------------------------------------------
* MenuPortal
* -----------------------------------------------------------------------------------------------*/ const $6cc32821e9371a1c$var$PORTAL_NAME = 'MenuPortal';
const [$6cc32821e9371a1c$var$PortalProvider, $6cc32821e9371a1c$var$usePortalContext] = $6cc32821e9371a1c$var$createMenuContext($6cc32821e9371a1c$var$PORTAL_NAME, {
forceMount: undefined
});
const $6cc32821e9371a1c$export$793392f970497feb = (props)=>{
const { __scopeMenu: __scopeMenu , forceMount: forceMount , children: children , container: container } = props;
const context = $6cc32821e9371a1c$var$useMenuContext($6cc32821e9371a1c$var$PORTAL_NAME, __scopeMenu);
return /*#__PURE__*/ $epM9y$createElement($6cc32821e9371a1c$var$PortalProvider, {
scope: __scopeMenu,
forceMount: forceMount
}, /*#__PURE__*/ $epM9y$createElement($epM9y$Presence, {
present: forceMount || context.open
}, /*#__PURE__*/ $epM9y$createElement($epM9y$Portal, {
asChild: true,
container: container
}, children)));
};
/*#__PURE__*/ Object.assign($6cc32821e9371a1c$export$793392f970497feb, {
displayName: $6cc32821e9371a1c$var$PORTAL_NAME
});
/* -------------------------------------------------------------------------------------------------
* MenuContent
* -----------------------------------------------------------------------------------------------*/ const $6cc32821e9371a1c$var$CONTENT_NAME = 'MenuContent';
const [$6cc32821e9371a1c$var$MenuContentProvider, $6cc32821e9371a1c$var$useMenuContentContext] = $6cc32821e9371a1c$var$createMenuContext($6cc32821e9371a1c$var$CONTENT_NAME);
const $6cc32821e9371a1c$export$479f0f2f71193efe = /*#__PURE__*/ $epM9y$forwardRef((props, forwardedRef)=>{
const portalContext = $6cc32821e9371a1c$var$usePortalContext($6cc32821e9371a1c$var$CONTENT_NAME, props.__scopeMenu);
const { forceMount: forceMount = portalContext.forceMount , ...contentProps } = props;
const context = $6cc32821e9371a1c$var$useMenuContext($6cc32821e9371a1c$var$CONTENT_NAME, props.__scopeMenu);
const rootContext = $6cc32821e9371a1c$var$useMenuRootContext($6cc32821e9371a1c$var$CONTENT_NAME, props.__scopeMenu);
return /*#__PURE__*/ $epM9y$createElement($6cc32821e9371a1c$var$Collection.Provider, {
scope: props.__scopeMenu
}, /*#__PURE__*/ $epM9y$createElement($epM9y$Presence, {
present: forceMount || context.open
}, /*#__PURE__*/ $epM9y$createElement($6cc32821e9371a1c$var$Collection.Slot, {
scope: props.__scopeMenu
}, rootContext.modal ? /*#__PURE__*/ $epM9y$createElement($6cc32821e9371a1c$var$MenuRootContentModal, $epM9y$babelruntimehelpersesmextends({}, contentProps, {
ref: forwardedRef
})) : /*#__PURE__*/ $epM9y$createElement($6cc32821e9371a1c$var$MenuRootContentNonModal, $epM9y$babelruntimehelpersesmextends({}, contentProps, {
ref: forwardedRef
})))));
});
/* ---------------------------------------------------------------------------------------------- */ const $6cc32821e9371a1c$var$MenuRootContentModal = /*#__PURE__*/ $epM9y$forwardRef((props, forwardedRef)=>{
const context = $6cc32821e9371a1c$var$useMenuContext($6cc32821e9371a1c$var$CONTENT_NAME, props.__scopeMenu);
const ref = $epM9y$useRef(null);
const composedRefs = $epM9y$useComposedRefs(forwardedRef, ref); // Hide everything from ARIA except the `MenuContent`
$epM9y$useEffect(()=>{
const content = ref.current;
if (content) return $epM9y$hideOthers(content);
}, []);
return /*#__PURE__*/ $epM9y$createElement($6cc32821e9371a1c$var$MenuContentImpl, $epM9y$babelruntimehelpersesmextends({}, props, {
ref: composedRefs // we make sure we're not trapping once it's been closed
,
trapFocus: context.open // make sure to only disable pointer events when open
,
disableOutsidePointerEvents: context.open,
disableOutsideScroll: true // When focus is trapped, a `focusout` event may still happen.
,
onFocusOutside: $epM9y$composeEventHandlers(props.onFocusOutside, (event)=>event.preventDefault()
, {
checkForDefaultPrevented: false
}),
onDismiss: ()=>context.onOpenChange(false)
}));
});
const $6cc32821e9371a1c$var$MenuRootContentNonModal = /*#__PURE__*/ $epM9y$forwardRef((props, forwardedRef)=>{
const context = $6cc32821e9371a1c$var$useMenuContext($6cc32821e9371a1c$var$CONTENT_NAME, props.__scopeMenu);
return /*#__PURE__*/ $epM9y$createElement($6cc32821e9371a1c$var$MenuContentImpl, $epM9y$babelruntimehelpersesmextends({}, props, {
ref: forwardedRef,
trapFocus: false,
disableOutsidePointerEvents: false,
disableOutsideScroll: false,
onDismiss: ()=>context.onOpenChange(false)
}));
});
/* ---------------------------------------------------------------------------------------------- */ const $6cc32821e9371a1c$var$MenuContentImpl = /*#__PURE__*/ $epM9y$forwardRef((props, forwardedRef)=>{
const { __scopeMenu: __scopeMenu , loop: loop = false , trapFocus: trapFocus , onOpenAutoFocus: onOpenAutoFocus , onCloseAutoFocus: onCloseAutoFocus , disableOutsidePointerEvents: disableOutsidePointerEvents , onEntryFocus: onEntryFocus , onEscapeKeyDown: onEscapeKeyDown , onPointerDownOutside: onPointerDownOutside , onFocusOutside: onFocusOutside , onInteractOutside: onInteractOutside , onDismiss: onDismiss , disableOutsideScroll: disableOutsideScroll , ...contentProps } = props;
const context = $6cc32821e9371a1c$var$useMenuContext($6cc32821e9371a1c$var$CONTENT_NAME, __scopeMenu);
const rootContext = $6cc32821e9371a1c$var$useMenuRootContext($6cc32821e9371a1c$var$CONTENT_NAME, __scopeMenu);
const popperScope = $6cc32821e9371a1c$var$usePopperScope(__scopeMenu);
const rovingFocusGroupScope = $6cc32821e9371a1c$var$useRovingFocusGroupScope(__scopeMenu);
const getItems = $6cc32821e9371a1c$var$useCollection(__scopeMenu);
const [currentItemId, setCurrentItemId] = $epM9y$useState(null);
const contentRef = $epM9y$useRef(null);
const composedRefs = $epM9y$useComposedRefs(forwardedRef, contentRef, context.onContentChange);
const timerRef = $epM9y$useRef(0);
const searchRef = $epM9y$useRef('');
const pointerGraceTimerRef = $epM9y$useRef(0);
const pointerGraceIntentRef = $epM9y$useRef(null);
const pointerDirRef = $epM9y$useRef('right');
const lastPointerXRef = $epM9y$useRef(0);
const ScrollLockWrapper = disableOutsideScroll ? $epM9y$RemoveScroll : $epM9y$Fragment;
const scrollLockWrapperProps = disableOutsideScroll ? {
as: $epM9y$Slot,
allowPinchZoom: true
} : undefined;
const handleTypeaheadSearch = (key)=>{
var _items$find, _items$find2;
const search = searchRef.current + key;
const items = getItems().filter((item)=>!item.disabled
);
const currentItem = document.activeElement;
const currentMatch = (_items$find = items.find((item)=>item.ref.current === currentItem
)) === null || _items$find === void 0 ? void 0 : _items$find.textValue;
const values = items.map((item)=>item.textValue
);
const nextMatch = $6cc32821e9371a1c$var$getNextMatch(values, search, currentMatch);
const newItem = (_items$find2 = items.find((item)=>item.textValue === nextMatch
)) === null || _items$find2 === void 0 ? void 0 : _items$find2.ref.current; // Reset `searchRef` 1 second after it was last updated
(function updateSearch(value) {
searchRef.current = value;
window.clearTimeout(timerRef.current);
if (value !== '') timerRef.current = window.setTimeout(()=>updateSearch('')
, 1000);
})(search);
if (newItem) /**
* Imperative focus during keydown is risky so we prevent React's batching updates
* to avoid potential bugs. See: https://github.com/facebook/react/issues/20332
*/ setTimeout(()=>newItem.focus()
);
};
$epM9y$useEffect(()=>{
return ()=>window.clearTimeout(timerRef.current)
;
}, []); // Make sure the whole tree has focus guards as our `MenuContent` may be
// the last element in the DOM (beacuse of the `Portal`)
$epM9y$useFocusGuards();
const isPointerMovingToSubmenu = $epM9y$useCallback((event)=>{
var _pointerGraceIntentRe, _pointerGraceIntentRe2;
const isMovingTowards = pointerDirRef.current === ((_pointerGraceIntentRe = pointerGraceIntentRef.current) === null || _pointerGraceIntentRe === void 0 ? void 0 : _pointerGraceIntentRe.side);
return isMovingTowards && $6cc32821e9371a1c$var$isPointerInGraceArea(event, (_pointerGraceIntentRe2 = pointerGraceIntentRef.current) === null || _pointerGraceIntentRe2 === void 0 ? void 0 : _pointerGraceIntentRe2.area);
}, []);
return /*#__PURE__*/ $epM9y$createElement($6cc32821e9371a1c$var$MenuContentProvider, {
scope: __scopeMenu,
searchRef: searchRef,
onItemEnter: $epM9y$useCallback((event)=>{
if (isPointerMovingToSubmenu(event)) event.preventDefault();
}, [
isPointerMovingToSubmenu
]),
onItemLeave: $epM9y$useCallback((event)=>{
var _contentRef$current;
if (isPointerMovingToSubmenu(event)) return;
(_contentRef$current = contentRef.current) === null || _contentRef$current === void 0 || _contentRef$current.focus();
setCurrentItemId(null);
}, [
isPointerMovingToSubmenu
]),
onTriggerLeave: $epM9y$useCallback((event)=>{
if (isPointerMovingToSubmenu(event)) event.preventDefault();
}, [
isPointerMovingToSubmenu
]),
pointerGraceTimerRef: pointerGraceTimerRef,
onPointerGraceIntentChange: $epM9y$useCallback((intent)=>{
pointerGraceIntentRef.current = intent;
}, [])
}, /*#__PURE__*/ $epM9y$createElement(ScrollLockWrapper, scrollLockWrapperProps, /*#__PURE__*/ $epM9y$createElement($epM9y$FocusScope, {
asChild: true,
trapped: trapFocus,
onMountAutoFocus: $epM9y$composeEventHandlers(onOpenAutoFocus, (event)=>{
var _contentRef$current2;
// when opening, explicitly focus the content area only and leave
// `onEntryFocus` in control of focusing first item
event.preventDefault();
(_contentRef$current2 = contentRef.current) === null || _contentRef$current2 === void 0 || _contentRef$current2.focus();
}),
onUnmountAutoFocus: onCloseAutoFocus
}, /*#__PURE__*/ $epM9y$createElement($epM9y$DismissableLayer, {
asChild: true,
disableOutsidePointerEvents: disableOutsidePointerEvents,
onEscapeKeyDown: onEscapeKeyDown,
onPointerDownOutside: onPointerDownOutside,
onFocusOutside: onFocusOutside,
onInteractOutside: onInteractOutside,
onDismiss: onDismiss
}, /*#__PURE__*/ $epM9y$createElement($epM9y$Root1, $epM9y$babelruntimehelpersesmextends({
asChild: true
}, rovingFocusGroupScope, {
dir: rootContext.dir,
orientation: "vertical",
loop: loop,
currentTabStopId: currentItemId,
onCurrentTabStopIdChange: setCurrentItemId,
onEntryFocus: $epM9y$composeEventHandlers(onEntryFocus, (event)=>{
// only focus first item when using keyboard
if (!rootContext.isUsingKeyboardRef.current) event.preventDefault();
})
}), /*#__PURE__*/ $epM9y$createElement($epM9y$Content, $epM9y$babelruntimehelpersesmextends({
role: "menu",
"aria-orientation": "vertical",
"data-state": $6cc32821e9371a1c$var$getOpenState(context.open),
"data-radix-menu-content": "",
dir: rootContext.dir
}, popperScope, contentProps, {
ref: composedRefs,
style: {
outline: 'none',
...contentProps.style
},
onKeyDown: $epM9y$composeEventHandlers(contentProps.onKeyDown, (event)=>{
// submenu key events bubble through portals. We only care about keys in this menu.
const target = event.target;
const isKeyDownInside = target.closest('[data-radix-menu-content]') === event.currentTarget;
const isModifierKey = event.ctrlKey || event.altKey || event.metaKey;
const isCharacterKey = event.key.length === 1;
if (isKeyDownInside) {
// menus should not be navigated using tab key so we prevent it
if (event.key === 'Tab') event.preventDefault();
if (!isModifierKey && isCharacterKey) handleTypeaheadSearch(event.key);
} // focus first/last item based on key pressed
const content = contentRef.current;
if (event.target !== content) return;
if (!$6cc32821e9371a1c$var$FIRST_LAST_KEYS.includes(event.key)) return;
event.preventDefault();
const items = getItems().filter((item)=>!item.disabled
);
const candidateNodes = items.map((item)=>item.ref.current
);
if ($6cc32821e9371a1c$var$LAST_KEYS.includes(event.key)) candidateNodes.reverse();
$6cc32821e9371a1c$var$focusFirst(candidateNodes);
}),
onBlur: $epM9y$composeEventHandlers(props.onBlur, (event)=>{
// clear search buffer when leaving the menu
if (!event.currentTarget.contains(event.target)) {
window.clearTimeout(timerRef.current);
searchRef.current = '';
}
}),
onPointerMove: $epM9y$composeEventHandlers(props.onPointerMove, $6cc32821e9371a1c$var$whenMouse((event)=>{
const target = event.target;
const pointerXHasChanged = lastPointerXRef.current !== event.clientX; // We don't use `event.movementX` for this check because Safari will
// always return `0` on a pointer event.
if (event.currentTarget.contains(target) && pointerXHasChanged) {
const newDir = event.clientX > lastPointerXRef.current ? 'right' : 'left';
pointerDirRef.current = newDir;
lastPointerXRef.current = event.clientX;
}
}))
})))))));
});
/*#__PURE__*/ Object.assign($6cc32821e9371a1c$export$479f0f2f71193efe, {
displayName: $6cc32821e9371a1c$var$CONTENT_NAME
});
/* -------------------------------------------------------------------------------------------------
* MenuGroup
* -----------------------------------------------------------------------------------------------*/ const $6cc32821e9371a1c$var$GROUP_NAME = 'MenuGroup';
const $6cc32821e9371a1c$export$22a631d1f72787bb = /*#__PURE__*/ $epM9y$forwardRef((props, forwardedRef)=>{
const { __scopeMenu: __scopeMenu , ...groupProps } = props;
return /*#__PURE__*/ $epM9y$createElement($epM9y$Primitive.div, $epM9y$babelruntimehelpersesmextends({
role: "group"
}, groupProps, {
ref: forwardedRef
}));
});
/*#__PURE__*/ Object.assign($6cc32821e9371a1c$export$22a631d1f72787bb, {
displayName: $6cc32821e9371a1c$var$GROUP_NAME
});
/* -------------------------------------------------------------------------------------------------
* MenuLabel
* -----------------------------------------------------------------------------------------------*/ const $6cc32821e9371a1c$var$LABEL_NAME = 'MenuLabel';
const $6cc32821e9371a1c$export$dd37bec0e8a99143 = /*#__PURE__*/ $epM9y$forwardRef((props, forwardedRef)=>{
const { __scopeMenu: __scopeMenu , ...labelProps } = props;
return /*#__PURE__*/ $epM9y$createElement($epM9y$Primitive.div, $epM9y$babelruntimehelpersesmextends({}, labelProps, {
ref: forwardedRef
}));
});
/*#__PURE__*/ Object.assign($6cc32821e9371a1c$export$dd37bec0e8a99143, {
displayName: $6cc32821e9371a1c$var$LABEL_NAME
});
/* -------------------------------------------------------------------------------------------------
* MenuItem
* -----------------------------------------------------------------------------------------------*/ const $6cc32821e9371a1c$var$ITEM_NAME = 'MenuItem';
const $6cc32821e9371a1c$var$ITEM_SELECT = 'menu.itemSelect';
const $6cc32821e9371a1c$export$2ce376c2cc3355c8 = /*#__PURE__*/ $epM9y$forwardRef((props, forwardedRef)=>{
const { disabled: disabled = false , onSelect: onSelect , ...itemProps } = props;
const ref = $epM9y$useRef(null);
const rootContext = $6cc32821e9371a1c$var$useMenuRootContext($6cc32821e9371a1c$var$ITEM_NAME, props.__scopeMenu);
const contentContext = $6cc32821e9371a1c$var$useMenuContentContext($6cc32821e9371a1c$var$ITEM_NAME, props.__scopeMenu);
const composedRefs = $epM9y$useComposedRefs(forwardedRef, ref);
const isPointerDownRef = $epM9y$useRef(false);
const handleSelect = ()=>{
const menuItem = ref.current;
if (!disabled && menuItem) {
const itemSelectEvent = new CustomEvent($6cc32821e9371a1c$var$ITEM_SELECT, {
bubbles: true,
cancelable: true
});
menuItem.addEventListener($6cc32821e9371a1c$var$ITEM_SELECT, (event)=>onSelect === null || onSelect === void 0 ? void 0 : onSelect(event)
, {
once: true
});
$epM9y$dispatchDiscreteCustomEvent(menuItem, itemSelectEvent);
if (itemSelectEvent.defaultPrevented) isPointerDownRef.current = false;
else rootContext.onClose();
}
};
return /*#__PURE__*/ $epM9y$createElement($6cc32821e9371a1c$var$MenuItemImpl, $epM9y$babelruntimehelpersesmextends({}, itemProps, {
ref: composedRefs,
disabled: disabled,
onClick: $epM9y$composeEventHandlers(props.onClick, handleSelect),
onPointerDown: (event)=>{
var _props$onPointerDown;
(_props$onPointerDown = props.onPointerDown) === null || _props$onPointerDown === void 0 || _props$onPointerDown.call(props, event);
isPointerDownRef.current = true;
},
onPointerUp: $epM9y$composeEventHandlers(props.onPointerUp, (event)=>{
var _event$currentTarget;
// Pointer down can move to a different menu item which should activate it on pointer up.
// We dispatch a click for selection to allow composition with click based triggers and to
// prevent Firefox from getting stuck in text selection mode when the menu closes.
if (!isPointerDownRef.current) (_event$currentTarget = event.currentTarget) === null || _event$currentTarget === void 0 || _event$currentTarget.click();
}),
onKeyDown: $epM9y$composeEventHandlers(props.onKeyDown, (event)=>{
const isTypingAhead = contentContext.searchRef.current !== '';
if (disabled || isTypingAhead && event.key === ' ') return;
if ($6cc32821e9371a1c$var$SELECTION_KEYS.includes(event.key)) {
event.currentTarget.click();
/**
* We prevent default browser behaviour for selection keys as they should trigger
* a selection only:
* - prevents space from scrolling the page.
* - if keydown causes focus to move, prevents keydown from firing on the new target.
*/ event.preventDefault();
}
})
}));
});
/*#__PURE__*/ Object.assign($6cc32821e9371a1c$export$2ce376c2cc3355c8, {
displayName: $6cc32821e9371a1c$var$ITEM_NAME
});
/* ---------------------------------------------------------------------------------------------- */ const $6cc32821e9371a1c$var$MenuItemImpl = /*#__PURE__*/ $epM9y$forwardRef((props, forwardedRef)=>{
const { __scopeMenu: __scopeMenu , disabled: disabled = false , textValue: textValue , ...itemProps } = props;
const contentContext = $6cc32821e9371a1c$var$useMenuContentContext($6cc32821e9371a1c$var$ITEM_NAME, __scopeMenu);
const rovingFocusGroupScope = $6cc32821e9371a1c$var$useRovingFocusGroupScope(__scopeMenu);
const ref = $epM9y$useRef(null);
const composedRefs = $epM9y$useComposedRefs(forwardedRef, ref);
const [isFocused, setIsFocused] = $epM9y$useState(false); // get the item's `.textContent` as default strategy for typeahead `textValue`
const [textContent, setTextContent] = $epM9y$useState('');
$epM9y$useEffect(()=>{
const menuItem = ref.current;
if (menuItem) {
var _menuItem$textContent;
setTextContent(((_menuItem$textContent = menuItem.textContent) !== null && _menuItem$textContent !== void 0 ? _menuItem$textContent : '').trim());
}
}, [
itemProps.children
]);
return /*#__PURE__*/ $epM9y$createElement($6cc32821e9371a1c$var$Collection.ItemSlot, {
scope: __scopeMenu,
disabled: disabled,
textValue: textValue !== null && textValue !== void 0 ? textValue : textContent
}, /*#__PURE__*/ $epM9y$createElement($epM9y$Item, $epM9y$babelruntimehelpersesmextends({
asChild: true
}, rovingFocusGroupScope, {
focusable: !disabled
}), /*#__PURE__*/ $epM9y$createElement($epM9y$Primitive.div, $epM9y$babelruntimehelpersesmextends({
role: "menuitem",
"data-highlighted": isFocused ? '' : undefined,
"aria-disabled": disabled || undefined,
"data-disabled": disabled ? '' : undefined
}, itemProps, {
ref: composedRefs,
onPointerMove: $epM9y$composeEventHandlers(props.onPointerMove, $6cc32821e9371a1c$var$whenMouse((event)=>{
if (disabled) contentContext.onItemLeave(event);
else {
contentContext.onItemEnter(event);
if (!event.defaultPrevented) {
const item = event.currentTarget;
item.focus();
}
}
})),
onPointerLeave: $epM9y$composeEventHandlers(props.onPointerLeave, $6cc32821e9371a1c$var$whenMouse((event)=>contentContext.onItemLeave(event)
)),
onFocus: $epM9y$composeEventHandlers(props.onFocus, ()=>setIsFocused(true)
),
onBlur: $epM9y$composeEventHandlers(props.onBlur, ()=>setIsFocused(false)
)
}))));
});
/* -------------------------------------------------------------------------------------------------
* MenuCheckboxItem
* -----------------------------------------------------------------------------------------------*/ const $6cc32821e9371a1c$var$CHECKBOX_ITEM_NAME = 'MenuCheckboxItem';
const $6cc32821e9371a1c$export$f6f243521332502d = /*#__PURE__*/ $epM9y$forwardRef((props, forwardedRef)=>{
const { checked: checked = false , onCheckedChange: onCheckedChange , ...checkboxItemProps } = props;
return /*#__PURE__*/ $epM9y$createElement($6cc32821e9371a1c$var$ItemIndicatorProvider, {
scope: props.__scopeMenu,
checked: checked
}, /*#__PURE__*/ $epM9y$createElement($6cc32821e9371a1c$export$2ce376c2cc3355c8, $epM9y$babelruntimehelpersesmextends({
role: "menuitemcheckbox",
"aria-checked": $6cc32821e9371a1c$var$isIndeterminate(checked) ? 'mixed' : checked
}, checkboxItemProps, {
ref: forwardedRef,
"data-state": $6cc32821e9371a1c$var$getCheckedState(checked),
onSelect: $epM9y$composeEventHandlers(checkboxItemProps.onSelect, ()=>onCheckedChange === null || onCheckedChange === void 0 ? void 0 : onCheckedChange($6cc32821e9371a1c$var$isIndeterminate(checked) ? true : !checked)
, {
checkForDefaultPrevented: false
})
})));
});
/*#__PURE__*/ Object.assign($6cc32821e9371a1c$export$f6f243521332502d, {
displayName: $6cc32821e9371a1c$var$CHECKBOX_ITEM_NAME
});
/* -------------------------------------------------------------------------------------------------
* MenuRadioGroup
* -----------------------------------------------------------------------------------------------*/ const $6cc32821e9371a1c$var$RADIO_GROUP_NAME = 'MenuRadioGroup';
const [$6cc32821e9371a1c$var$RadioGroupProvider, $6cc32821e9371a1c$var$useRadioGroupContext] = $6cc32821e9371a1c$var$createMenuContext($6cc32821e9371a1c$var$RADIO_GROUP_NAME, {
value: undefined,
onValueChange: ()=>{}
});
const $6cc32821e9371a1c$export$ea2200c9eee416b3 = /*#__PURE__*/ $epM9y$forwardRef((props, forwardedRef)=>{
const { value: value , onValueChange: onValueChange , ...groupProps } = props;
const handleValueChange = $epM9y$useCallbackRef(onValueChange);
return /*#__PURE__*/ $epM9y$createElement($6cc32821e9371a1c$var$RadioGroupProvider, {
scope: props.__scopeMenu,
value: value,
onValueChange: handleValueChange
}, /*#__PURE__*/ $epM9y$createElement($6cc32821e9371a1c$export$22a631d1f72787bb, $epM9y$babelruntimehelpersesmextends({}, groupProps, {
ref: forwardedRef
})));
});
/*#__PURE__*/ Object.assign($6cc32821e9371a1c$export$ea2200c9eee416b3, {
displayName: $6cc32821e9371a1c$var$RADIO_GROUP_NAME
});
/* -------------------------------------------------------------------------------------------------
* MenuRadioItem
* -----------------------------------------------------------------------------------------------*/ const $6cc32821e9371a1c$var$RADIO_ITEM_NAME = 'MenuRadioItem';
const $6cc32821e9371a1c$export$69bd225e9817f6d0 = /*#__PURE__*/ $epM9y$forwardRef((props, forwardedRef)=>{
const { value: value , ...radioItemProps } = props;
const context = $6cc32821e9371a1c$var$useRadioGroupContext($6cc32821e9371a1c$var$RADIO_ITEM_NAME, props.__scopeMenu);
const checked = value === context.value;
return /*#__PURE__*/ $epM9y$createElement($6cc32821e9371a1c$var$ItemIndicatorProvider, {
scope: props.__scopeMenu,
checked: checked
}, /*#__PURE__*/ $epM9y$createElement($6cc32821e9371a1c$export$2ce376c2cc3355c8, $epM9y$babelruntimehelpersesmextends({
role: "menuitemradio",
"aria-checked": checked
}, radioItemProps, {
ref: forwardedRef,
"data-state": $6cc32821e9371a1c$var$getCheckedState(checked),
onSelect: $epM9y$composeEventHandlers(radioItemProps.onSelect, ()=>{
var _context$onValueChang;
return (_context$onValueChang = context.onValueChange) === null || _context$onValueChang === void 0 ? void 0 : _context$onValueChang.call(context, value);
}, {
checkForDefaultPrevented: false
})
})));
});
/*#__PURE__*/ Object.assign($6cc32821e9371a1c$export$69bd225e9817f6d0, {
displayName: $6cc32821e9371a1c$var$RADIO_ITEM_NAME
});
/* -------------------------------------------------------------------------------------------------
* MenuItemIndicator
* -----------------------------------------------------------------------------------------------*/ const $6cc32821e9371a1c$var$ITEM_INDICATOR_NAME = 'MenuItemIndicator';
const [$6cc32821e9371a1c$var$ItemIndicatorProvider, $6cc32821e9371a1c$var$useItemIndicatorContext] = $6cc32821e9371a1c$var$createMenuContext($6cc32821e9371a1c$var$ITEM_INDICATOR_NAME, {
checked: false
});
const $6cc32821e9371a1c$export$a2593e23056970a3 = /*#__PURE__*/ $epM9y$forwardRef((props, forwardedRef)=>{
const { __scopeMenu: __scopeMenu , forceMount: forceMount , ...itemIndicatorProps } = props;
const indicatorContext = $6cc32821e9371a1c$var$useItemIndicatorContext($6cc32821e9371a1c$var$ITEM_INDICATOR_NAME, __scopeMenu);
return /*#__PURE__*/ $epM9y$createElement($epM9y$Presence, {
present: forceMount || $6cc32821e9371a1c$var$isIndeterminate(indicatorContext.checked) || indicatorContext.checked === true
}, /*#__PURE__*/ $epM9y$createElement($epM9y$Primitive.span, $epM9y$babelruntimehelpersesmextends({}, itemIndicatorProps, {
ref: forwardedRef,
"data-state": $6cc32821e9371a1c$var$getCheckedState(indicatorContext.checked)
})));
});
/*#__PURE__*/ Object.assign($6cc32821e9371a1c$export$a2593e23056970a3, {
displayName: $6cc32821e9371a1c$var$ITEM_INDICATOR_NAME
});
/* -------------------------------------------------------------------------------------------------
* MenuSeparator
* -----------------------------------------------------------------------------------------------*/ const $6cc32821e9371a1c$var$SEPARATOR_NAME = 'MenuSeparator';
const $6cc32821e9371a1c$export$1cec7dcdd713e220 = /*#__PURE__*/ $epM9y$forwardRef((props, forwardedRef)=>{
const { __scopeMenu: __scopeMenu , ...separatorProps } = props;
return /*#__PURE__*/ $epM9y$createElement($epM9y$Primitive.div, $epM9y$babelruntimehelpersesmextends({
role: "separator",
"aria-orientation": "horizontal"
}, separatorProps, {
ref: forwardedRef
}));
});
/*#__PURE__*/ Object.assign($6cc32821e9371a1c$export$1cec7dcdd713e220, {
displayName: $6cc32821e9371a1c$var$SEPARATOR_NAME
});
/* -------------------------------------------------------------------------------------------------
* MenuArrow
* -----------------------------------------------------------------------------------------------*/ const $6cc32821e9371a1c$var$ARROW_NAME = 'MenuArrow';
const $6cc32821e9371a1c$export$bcdda4773debf5fa = /*#__PURE__*/ $epM9y$forwardRef((props, forwardedRef)=>{
const { __scopeMenu: __scopeMenu , ...arrowProps } = props;
const popperScope = $6cc32821e9371a1c$var$usePopperScope(__scopeMenu);
return /*#__PURE__*/ $epM9y$createElement($epM9y$Arrow, $epM9y$babelruntimehelpersesmextends({}, popperScope, arrowProps, {
ref: forwardedRef
}));
});
/*#__PURE__*/ Object.assign($6cc32821e9371a1c$export$bcdda4773debf5fa, {
displayName: $6cc32821e9371a1c$var$ARROW_NAME
});
/* -------------------------------------------------------------------------------------------------
* MenuSub
* -----------------------------------------------------------------------------------------------*/ const $6cc32821e9371a1c$var$SUB_NAME = 'MenuSub';
const [$6cc32821e9371a1c$var$MenuSubProvider, $6cc32821e9371a1c$var$useMenuSubContext] = $6cc32821e9371a1c$var$createMenuContext($6cc32821e9371a1c$var$SUB_NAME);
const $6cc32821e9371a1c$export$71bdb9d1e2909932 = (props)=>{
const { __scopeMenu: __scopeMenu , children: children , open: open = false , onOpenChange: onOpenChange } = props;
const parentMenuContext = $6cc32821e9371a1c$var$useMenuContext($6cc32821e9371a1c$var$SUB_NAME, __scopeMenu);
const popperScope = $6cc32821e9371a1c$var$usePopperScope(__scopeMenu);
const [trigger, setTrigger] = $epM9y$useState(null);
const [content, setContent] = $epM9y$useState(null);
const handleOpenChange = $epM9y$useCallbackRef(onOpenChange); // Prevent the parent menu from reopening with open submenus.
$epM9y$useEffect(()=>{
if (parentMenuContext.open === false) handleOpenChange(false);
return ()=>handleOpenChange(false)
;
}, [
parentMenuContext.open,
handleOpenChange
]);
return /*#__PURE__*/ $epM9y$createElement($epM9y$Root, popperScope, /*#__PURE__*/ $epM9y$createElement($6cc32821e9371a1c$var$MenuProvider, {
scope: __scopeMenu,
open: open,
onOpenChange: handleOpenChange,
content: content,
onContentChange: setContent
}, /*#__PURE__*/ $epM9y$createElement($6cc32821e9371a1c$var$MenuSubProvider, {
scope: __scopeMenu,
contentId: $epM9y$useId(),
triggerId: $epM9y$useId(),
trigger: trigger,
onTriggerChange: setTrigger
}, children)));
};
/*#__PURE__*/ Object.assign($6cc32821e9371a1c$export$71bdb9d1e2909932, {
displayName: $6cc32821e9371a1c$var$SUB_NAME
});
/* -------------------------------------------------------------------------------------------------
* MenuSubTrigger
* -----------------------------------------------------------------------------------------------*/ const $6cc32821e9371a1c$var$SUB_TRIGGER_NAME = 'MenuSubTrigger';
const $6cc32821e9371a1c$export$5fbbb3ba7297405f = /*#__PURE__*/ $epM9y$forwardRef((props, forwardedRef)=>{
const context = $6cc32821e9371a1c$var$useMenuContext($6cc32821e9371a1c$var$SUB_TRIGGER_NAME, props.__scopeMenu);
const rootContext = $6cc32821e9371a1c$var$useMenuRootContext($6cc32821e9371a1c$var$SUB_TRIGGER_NAME, props.__scopeMenu);
const subContext = $6cc32821e9371a1c$var$useMenuSubContext($6cc32821e9371a1c$var$SUB_TRIGGER_NAME, props.__scopeMenu);
const contentContext = $6cc32821e9371a1c$var$useMenuContentContext($6cc32821e9371a1c$var$SUB_TRIGGER_NAME, props.__scopeMenu);
const openTimerRef = $epM9y$useRef(null);
const { pointerGraceTimerRef: pointerGraceTimerRef , onPointerGraceIntentChange: onPointerGraceIntentChange } = contentContext;
const scope = {
__scopeMenu: props.__scopeMenu
};
const clearOpenTimer = $epM9y$useCallback(()=>{
if (openTimerRef.current) window.clearTimeout(openTimerRef.current);
openTimerRef.current = null;
}, []);
$epM9y$useEffect(()=>clearOpenTimer
, [
clearOpenTimer
]);
$epM9y$useEffect(()=>{
const pointerGraceTimer = pointerGraceTimerRef.current;
return ()=>{
window.clearTimeout(pointerGraceTimer);
onPointerGraceIntentChange(null);
};
}, [
pointerGraceTimerRef,
onPointerGraceIntentChange
]);
return /*#__PURE__*/ $epM9y$createElement($6cc32821e9371a1c$export$9fa5ebd18bee4d43, $epM9y$babelruntimehelpersesmextends({
asChild: true
}, scope), /*#__PURE__*/ $epM9y$createElement($6cc32821e9371a1c$var$MenuItemImpl, $epM9y$babelruntimehelpersesmextends({
id: subContext.triggerId,
"aria-haspopup": "menu",
"aria-expanded": context.open,
"aria-controls": subContext.contentId,
"data-state": $6cc32821e9371a1c$var$getOpenState(context.open)
}, props, {
ref: $epM9y$composeRefs(forwardedRef, subContext.onTriggerChange) // This is redundant for mouse users but we cannot determine pointer type from
,
onClick: (event)=>{
var _props$onClick;
(_props$onClick = props.onClick) === null || _props$onClick === void 0 || _props$onClick.call(props, event);
if (props.disabled || event.defaultPrevented) return;
/**
* We manually focus because iOS Safari doesn't always focus on click (e.g. buttons)
* and we rely heavily on `onFocusOutside` for submenus to close when switching
* between separate submenus.
*/ event.currentTarget.focus();
if (!context.open) context.onOpenChange(true);
},
onPointerMove: $epM9y$composeEventHandlers(props.onPointerMove, $6cc32821e9371a1c$var$whenMouse((event)=>{
contentContext.onItemEnter(event);
if (event.defaultPrevented) return;
if (!props.disabled && !context.open && !openTimerRef.current) {
contentContext.onPointerGraceIntentChange(null);
openTimerRef.current = window.setTimeout(()=>{
context.onOpenChange(true);
clearOpenTimer();
}, 100);
}
})),
onPointerLeave: $epM9y$composeEventHandlers(props.onPointerLeave, $6cc32821e9371a1c$var$whenMouse((event)=>{
var _context$content;
clearOpenTimer();
const contentRect = (_context$content = context.content) === null || _context$content === void 0 ? void 0 : _context$content.getBoundingClientRect();
if (contentRect) {
var _context$content2;
// TODO: make sure to update this when we change positioning logic
const side = (_context$content2 = context.content) === null || _context$content2 === void 0 ? void 0 : _context$content2.dataset.side;
const rightSide = side === 'right';
const bleed = rightSide ? -5 : 5;
const contentNearEdge = contentRect[rightSide ? 'left' : 'right'];
const contentFarEdge = contentRect[rightSide ? 'right' : 'left'];
contentContext.onPointerGraceIntentChange({
area: [
// consistently within polygon bounds
{
x: event.clientX + bleed,
y: event.clientY
},
{
x: contentNearEdge,
y: contentRect.top
},
{
x: contentFarEdge,
y: contentRect.top
},
{
x: contentFarEdge,
y: contentRect.bottom
},
{
x: contentNearEdge,
y: contentRect.bottom
}
],
side: side
});
window.clearTimeout(pointerGraceTimerRef.current);
pointerGraceTimerRef.current = window.setTimeout(()=>contentContext.onPointerGraceIntentChange(null)
, 300);
} else {
contentContext.onTriggerLeave(event);
if (event.defaultPrevented) return; // There's 100ms where the user may leave an item before the submenu was opened.
contentContext.onPointerGraceIntentChange(null);
}
})),
onKeyDown: $epM9y$composeEventHandlers(props.onKeyDown, (event)=>{
const isTypingAhead = contentContext.searchRef.current !== '';
if (props.disabled || isTypingAhead && event.key === ' ') return;
if ($6cc32821e9371a1c$var$SUB_OPEN_KEYS[rootContext.dir].includes(event.key)) {
var _context$content3;
context.onOpenChange(true); // The trigger may hold focus if opened via pointer interaction
// so we ensure content is given focus again when switching to keyboard.
(_context$content3 = context.content) === null || _context$content3 === void 0 || _context$content3.focus(); // prevent window from scrolling
event.preventDefault();
}
})
})));
});
/*#__PURE__*/ Object.assign($6cc32821e9371a1c$export$5fbbb3ba7297405f, {
displayName: $6cc32821e9371a1c$var$SUB_TRIGGER_NAME
});
/* -------------------------------------------------------------------------------------------------
* MenuSubContent
* -----------------------------------------------------------------------------------------------*/ const $6cc32821e9371a1c$var$SUB_CONTENT_NAME = 'MenuSubContent';
const $6cc32821e9371a1c$export$e7142ab31822bde6 = /*#__PURE__*/ $epM9y$forwardRef((props, forwardedRef)=>{
const portalContext = $6cc32821e9371a1c$var$usePortalContext($6cc32821e9371a1c$var$CONTENT_NAME, props.__scopeMenu);
const { forceMount: forceMount = portalContext.forceMount , ...subContentProps } = props;
const context = $6cc32821e9371a1c$var$useMenuContext($6cc32821e9371a1c$var$CONTENT_NAME, props.__scopeMenu);
const rootContext = $6cc32821e9371a1c$var$useMenuRootContext($6cc32821e9371a1c$var$CONTENT_NAME, props.__scopeMenu);
const subContext = $6cc32821e9371a1c$var$useMenuSubContext($6cc32821e9371a1c$var$SUB_CONTENT_NAME, props.__scopeMenu);
const ref = $epM9y$useRef(null);
const composedRefs = $epM9y$useComposedRefs(forwardedRef, ref);
return /*#__PURE__*/ $epM9y$createElement($6cc32821e9371a1c$var$Collection.Provider, {
scope: props.__scopeMenu
}, /*#__PURE__*/ $epM9y$createElement($epM9y$Presence, {
present: forceMount || context.open
}, /*#__PURE__*/ $epM9y$createElement($6cc32821e9371a1c$var$Collection.Slot, {
scope: props.__scopeMenu
}, /*#__PURE__*/ $epM9y$createElement($6cc32821e9371a1c$var$MenuContentImpl, $epM9y$babelruntimehelpersesmextends({
id: subContext.contentId,
"aria-labelledby": subContext.triggerId
}, subContentProps, {
ref: composedRefs,
align: "start",
side: rootContext.dir === 'rtl' ? 'left' : 'right',
disableOutsidePointerEvents: false,
disableOutsideScroll: false,
trapFocus: false,
onOpenAutoFocus: (event)=>{
var _ref$current;
// when opening a submenu, focus content for keyboard users only
if (rootContext.isUsingKeyboardRef.current) (_ref$current = ref.current) === null || _ref$current === void 0 || _ref$current.focus();
event.preventDefault();
} // The menu might close because of focusing another menu item in the parent menu. We
,
onCloseAutoFocus: (event)=>event.preventDefault()
,
onFocusOutside: $epM9y$composeEventHandlers(props.onFocusOutside, (event)=>{
// We prevent closing when the trigger is focused to avoid triggering a re-open animation
// on pointer interaction.
if (event.target !== subContext.trigger) context.onOpenChange(false);
}),
onEscapeKeyDown: $epM9y$composeEventHandlers(props.onEscapeKeyDown, (event)=>{
rootContext.onClose(); // ensure pressing escape in submenu doesn't escape full screen mode
event.preventDefault();
}),
onKeyDown: $epM9y$composeEventHandlers(props.onKeyDown, (event)=>{
// Submenu key events bubble through portals. We only care about keys in this menu.
const isKeyDownInside = event.currentTarget.contains(event.target);
const isCloseKey = $6cc32821e9371a1c$var$SUB_CLOSE_KEYS[rootContext.dir].includes(event.key);
if (isKeyDownInside && isCloseKey) {
var _subContext$trigger;
context.onOpenChange(false); // We focus manually because we prevented it in `onCloseAutoFocus`
(_subContext$trigger = subContext.trigger) === null || _subContext$trigger === void 0 || _subContext$trigger.focus(); // prevent window from scrolling
event.preventDefault();
}
})
})))));
});
/*#__PURE__*/ Object.assign($6cc32821e9371a1c$export$e7142ab31822bde6, {
displayName: $6cc32821e9371a1c$var$SUB_CONTENT_NAME
});
/* -----------------------------------------------------------------------------------------------*/ function $6cc32821e9371a1c$var$getOpenState(open) {
return open ? 'open' : 'closed';
}
function $6cc32821e9371a1c$var$isIndeterminate(checked) {
return checked === 'indeterminate';
}
function $6cc32821e9371a1c$var$getCheckedState(checked) {
return $6cc32821e9371a1c$var$isIndeterminate(checked) ? 'indeterminate' : checked ? 'checked' : 'unchecked';
}
function $6cc32821e9371a1c$var$focusFirst(candidates) {
const PREVIOUSLY_FOCUSED_ELEMENT = document.activeElement;
for (const candidate of candidates){
// if focus is already where we want to go, we don't want to keep going through the candidates
if (candidate === PREVIOUSLY_FOCUSED_ELEMENT) return;
candidate.focus();
if (document.activeElement !== PREVIOUSLY_FOCUSED_ELEMENT) return;
}
}
/**
* Wraps an array around itself at a given start index
* Example: `wrapArray(['a', 'b', 'c', 'd'], 2) === ['c', 'd', 'a', 'b']`
*/ function $6cc32821e9371a1c$var$wrapArray(array, startIndex) {
return array.map((_, index)=>array[(startIndex + index) % array.length]
);
}
/**
* This is the "meat" of the typeahead matching logic. It takes in all the values,
* the search and the current match, and returns the next match (or `undefined`).
*
* We normalize the search because if a user has repeatedly pressed a character,
* we want the exact same behavior as if we only had that one character
* (ie. cycle through options starting with that character)
*
* We also reorder the values by wrapping the array around the current match.
* This is so we always look forward from the current match, and picking the first
* match will always be the correct one.
*
* Finally, if the normalized search is exactly one character, we exclude the
* current match from the values because otherwise it would be the first to match always
* and focus would never move. This is as opposed to the regular case, where we
* don't want focus to move if the current match still matches.
*/ function $6cc32821e9371a1c$var$getNextMatch(values, search, currentMatch) {
const isRepeated = search.length > 1 && Array.from(search).every((char)=>char === search[0]
);
const normalizedSearch = isRepeated ? search[0] : search;
const currentMatchIndex = currentMatch ? values.indexOf(currentMatch) : -1;
let wrappedValues = $6cc32821e9371a1c$var$wrapArray(values, Math.max(currentMatchIndex, 0));
const excludeCurrentMatch = normalizedSearch.length === 1;
if (excludeCurrentMatch) wrappedValues = wrappedValues.filter((v)=>v !== currentMatch
);
const nextMatch = wrappedValues.find((value)=>value.toLowerCase().startsWith(normalizedSearch.toLowerCase())
);
return nextMatch !== currentMatch ? nextMatch : undefined;
}
// Determine if a point is inside of a polygon.
// Based on https://github.com/substack/point-in-polygon
function $6cc32821e9371a1c$var$isPointInPolygon(point, polygon) {
const { x: x , y: y } = point;
let inside = false;
for(let i = 0, j = polygon.length - 1; i < polygon.length; j = i++){
const xi = polygon[i].x;
const yi = polygon[i].y;
const xj = polygon[j].x;
const yj = polygon[j].y; // prettier-ignore
const intersect = yi > y !== yj > y && x < (xj - xi) * (y - yi) / (yj - yi) + xi;
if (intersect) inside = !inside;
}
return inside;
}
function $6cc32821e9371a1c$var$isPointerInGraceArea(event, area) {
if (!area) return false;
const cursorPos = {
x: event.clientX,
y: event.clientY
};
return $6cc32821e9371a1c$var$isPointInPolygon(cursorPos, area);
}
function $6cc32821e9371a1c$var$whenMouse(handler) {
return (event)=>event.pointerType === 'mouse' ? handler(event) : undefined
;
}
const $6cc32821e9371a1c$export$be92b6f5f03c0fe9 = $6cc32821e9371a1c$export$d9b273488cd8ce6f;
const $6cc32821e9371a1c$export$b688253958b8dfe7 = $6cc32821e9371a1c$export$9fa5ebd18bee4d43;
const $6cc32821e9371a1c$export$602eac185826482c = $6cc32821e9371a1c$export$793392f970497feb;
const $6cc32821e9371a1c$export$7c6e2c02157bb7d2 = $6cc32821e9371a1c$export$479f0f2f71193efe;
const $6cc32821e9371a1c$export$eb2fcfdbd7ba97d4 = $6cc32821e9371a1c$export$22a631d1f72787bb;
const $6cc32821e9371a1c$export$b04be29aa201d4f5 = $6cc32821e9371a1c$export$dd37bec0e8a99143;
const $6cc32821e9371a1c$export$6d08773d2e66f8f2 = $6cc32821e9371a1c$export$2ce376c2cc3355c8;
const $6cc32821e9371a1c$export$16ce288f89fa631c = $6cc32821e9371a1c$export$f6f243521332502d;
const $6cc32821e9371a1c$export$a98f0dcb43a68a25 = $6cc32821e9371a1c$export$ea2200c9eee416b3;
const $6cc32821e9371a1c$export$371ab307eab489c0 = $6cc32821e9371a1c$export$69bd225e9817f6d0;
const $6cc32821e9371a1c$export$c3468e2714d175fa = $6cc32821e9371a1c$export$a2593e23056970a3;
const $6cc32821e9371a1c$export$1ff3c3f08ae963c0 = $6cc32821e9371a1c$export$1cec7dcdd713e220;
const $6cc32821e9371a1c$export$21b07c8f274aebd5 = $6cc32821e9371a1c$export$bcdda4773debf5fa;
const $6cc32821e9371a1c$export$d7a01e11500dfb6f = $6cc32821e9371a1c$export$71bdb9d1e2909932;
const $6cc32821e9371a1c$export$2ea8a7a591ac5eac = $6cc32821e9371a1c$export$5fbbb3ba7297405f;
const $6cc32821e9371a1c$export$6d4de93b380beddf = $6cc32821e9371a1c$export$e7142ab31822bde6;
export {$6cc32821e9371a1c$export$4027731b685e72eb as createMenuScope, $6cc32821e9371a1c$export$d9b273488cd8ce6f as Menu, $6cc32821e9371a1c$export$9fa5ebd18bee4d43 as MenuAnchor, $6cc32821e9371a1c$export$793392f970497feb as MenuPortal, $6cc32821e9371a1c$export$479f0f2f71193efe as MenuContent, $6cc32821e9371a1c$export$22a631d1f72787bb as MenuGroup, $6cc32821e9371a1c$export$dd37bec0e8a99143 as MenuLabel, $6cc32821e9371a1c$export$2ce376c2cc3355c8 as MenuItem, $6cc32821e9371a1c$export$f6f243521332502d as MenuCheckboxItem, $6cc32821e9371a1c$export$ea2200c9eee416b3 as MenuRadioGroup, $6cc32821e9371a1c$export$69bd225e9817f6d0 as MenuRadioItem, $6cc32821e9371a1c$export$a2593e23056970a3 as MenuItemIndicator, $6cc32821e9371a1c$export$1cec7dcdd713e220 as MenuSeparator, $6cc32821e9371a1c$export$bcdda4773debf5fa as MenuArrow, $6cc32821e9371a1c$export$71bdb9d1e2909932 as MenuSub, $6cc32821e9371a1c$export$5fbbb3ba7297405f as MenuSubTrigger, $6cc32821e9371a1c$export$e7142ab31822bde6 as MenuSubContent, $6cc32821e9371a1c$export$be92b6f5f03c0fe9 as Root, $6cc32821e9371a1c$export$b688253958b8dfe7 as Anchor, $6cc32821e9371a1c$export$602eac185826482c as Portal, $6cc32821e9371a1c$export$7c6e2c02157bb7d2 as Content, $6cc32821e9371a1c$export$eb2fcfdbd7ba97d4 as Group, $6cc32821e9371a1c$export$b04be29aa201d4f5 as Label, $6cc32821e9371a1c$export$6d08773d2e66f8f2 as Item, $6cc32821e9371a1c$export$16ce288f89fa631c as CheckboxItem, $6cc32821e9371a1c$export$a98f0dcb43a68a25 as RadioGroup, $6cc32821e9371a1c$export$371ab307eab489c0 as RadioItem, $6cc32821e9371a1c$export$c3468e2714d175fa as ItemIndicator, $6cc32821e9371a1c$export$1ff3c3f08ae963c0 as Separator, $6cc32821e9371a1c$export$21b07c8f274aebd5 as Arrow, $6cc32821e9371a1c$export$d7a01e11500dfb6f as Sub, $6cc32821e9371a1c$export$2ea8a7a591ac5eac as SubTrigger, $6cc32821e9371a1c$export$6d4de93b380beddf as SubContent};
//# sourceMappingURL=index.mjs.map

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,21 @@
MIT License
Copyright (c) 2017 Anton Korzunov
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.

View File

@@ -0,0 +1,152 @@
<div align="center">
<h1>React-remove-📜</h1>
<br/>
dont even scroll
<br/>
<a href="https://www.npmjs.com/package/react-remove-scroll">
<img src="https://img.shields.io/npm/v/react-remove-scroll.svg?style=flat-square" />
</a>
<a href="https://travis-ci.org/theKashey/react-remove-scroll">
<img src="https://img.shields.io/travis/theKashey/react-remove-scroll.svg?style=flat-square" alt="Build status">
</a>
<a href="https://www.npmjs.com/package/react-remove-scroll">
<img src="https://img.shields.io/npm/dm/react-remove-scroll.svg" alt="npm downloads">
</a>
<a href="https://bundlephobia.com/result?p=react-remove-scroll">
<img src="https://img.shields.io/bundlephobia/minzip/react-remove-scroll.svg" alt="bundle size">
</a>
<br/>
</div>
react-remove-scroll
====
[![NPM version](https://img.shields.io/npm/v/react-remove-scroll.svg)](https://www.npmjs.com/package/react-remove-scroll)
Disables scroll outside of `children` node.
- 🖱 mouse and touch devices friendly
- 📈 vertical and horizontal
- 📜 removes document scroll bar maintaining it space
- ✅ support nested scrollable elements
- 🕳 supports react-portals (uses React Event system)
- ☠️ it could block literally any scroll anywhere
# Usage
Just wrap content, which should be scrollable, and everything else would not.
```js
import {RemoveScroll} from 'react-remove-scroll';
<RemoveScroll>
Only this content would be scrollable
</RemoveScroll>
```
`RemoveScroll` accept following props
- `children`
- `[enabled]` - activate or deactivate component behaviour without removing it.
- `[allowPinchZoom=false]` - enabled "pinch-n-zoom" behavior. By default it might be prevented. However - pinch and zoom might break "scroll isolation", and __disabled by default__.
- `[noIsolation=false]` - disables outer event capturing. Event capturing is React friendly and unlikely be a problem.
But if you are using _shadowbox_ of some sort - you dont need it.
- `[inert=false]` - ☠️(be careful) disables events the rest of page completely using `pointer-events` except the Lock(+shards).
React portals not friendly, might lead to production issues. Enable only for __rare__ cases, when you have to disable scrollbars somewhere on the page(except body, Lock and shards).
- `[forwardProps]` - will forward all props to the `children`
- `[className]` - className for an internal div
- `[removeScrollBar]` - to control scroll bar removal. Set to false, if you prefer to keep it (wheel and touch scroll is still disabled).
# Size
- (🧩 full) 1.7kb after compression (excluding tslib).
---
- (👁 UI) __400b__, visual elements only
- (🚗 sidecar) 1.5kb, side effects
```js
import {sidecar} from "react-remove-scroll";
import {RemoveScroll} from 'react-remove-scroll/UI';
const sidecar = sidecar(() => import('react-remove-scroll/sidecar'));
<RemoveScroll sideCar={sidecar}>
Will load logic from a sidecar when needed
</RemoveScroll>
```
> Consider setting `-webkit-overflow-scrolling: touch;` on a document level for a proper mobile experience.
## Internal div
But default RemoveScroll will create a div to handle and capture events.
You may specify `className` for it, if you need, or __remove it__.
The following code samples will produce the same output
```js
<RemoveScroll className="scroll">
Only this content would be scrollable
</RemoveScroll>
```
```js
<RemoveScroll forwardProps>
<div className="scroll"> //RemoveScroll will inject props to this div
Only this content would be scrollable
</div>
</RemoveScroll>
```
Pick the first one if you don't need a second.
## Position:fixed elements
To properly size these elements please add a special className to them.
```jsx
import {RemoveScroll} from 'react-remove-scroll';
// to make "width: 100%"
<div className={cx(classWithPositionFixed, RemoveScroll.classNames.fullWidth)} />
// to make "right:0"
<div className={cx(classWithPositionFixed, RemoveScroll.classNames.zeroRight)} />
```
See [react-remove-scroll-bar](https://github.com/theKashey/react-remove-scroll-bar) documentation for details.
## More than one lock
When stacked more is active (default) only one (last) component would be active.
## Over isolation
That could happen -
you disable scroll on the body,
you are suppressing all scroll and wheel events,
and you are ghosting the rest of the page by the `inert` prop.
Only something inside Lock does exists for the browser, and that might be less than you expected.
Dont forget about `shard`, dont forget - `inert` is not portals friendly, dont forget - you dont need over isolation in most of the cases.
> just be careful!
# Performance
To do the job this library setup _non_ passive event listener. Chrome dev tools would complain about it, as a
performance no-op.
We have to use synchronous scroll/touch handler, and it may affect scrolling performance.
Consider using `noIsolation` mode, if you have large scrollable areas.
# Supported React versions
- v1 supports React 15/16
- v2 requires 16.8.0+ (hooks)
# Scroll-Locky
This is a refactoring of another library - [react-scroll-locky](https://github.com/theKashey/react-scroll-locky) -
to make package smaller and more react-portals friendly.
## See also
- [react-focus-on](https://github.com/theKashey/react-focus-on) - Finite Modal creator (uses Scroll-Locky) underneath.
- [react-locky](https://github.com/theKashey/react-locky) - React event canceler
- [react-scrolllock](https://github.com/jossmac/react-scrolllock) - React scroll lock
- [scroll-lock](https://github.com/FL3NKEY/scroll-lock) - DOM scroll lock
- [body-scroll-lock](https://github.com/willmcpo/body-scroll-lock) - DOM scroll lock
> This package is relative smaller(1), more react friendly(2), works with non zero body margins(3), and has a better "overscroll" management.
# License
MIT

View File

@@ -0,0 +1 @@
export * from '../dist/es2015/UI'

View File

@@ -0,0 +1,8 @@
{
"private": true,
"main": "../dist/es5/UI.js",
"jsnext:main": "../dist/es2015/UI.js",
"module": "../dist/es2015/UI.js",
"types": "UI.d.ts",
"sideEffects": false
}

View File

@@ -0,0 +1,3 @@
import { RemoveScrollType } from './types';
declare const ReactRemoveScroll: RemoveScrollType;
export default ReactRemoveScroll;

View File

@@ -0,0 +1,7 @@
import { __assign } from "tslib";
import * as React from 'react';
import { RemoveScroll } from './UI';
import SideCar from './sidecar';
var ReactRemoveScroll = React.forwardRef(function (props, ref) { return (React.createElement(RemoveScroll, __assign({}, props, { ref: ref, sideCar: SideCar }))); });
ReactRemoveScroll.classNames = RemoveScroll.classNames;
export default ReactRemoveScroll;

View File

@@ -0,0 +1,5 @@
import { TouchEvent } from 'react';
import { IRemoveScrollEffectProps } from './types';
export declare const getTouchXY: (event: TouchEvent | WheelEvent) => number[];
export declare const getDeltaXY: (event: WheelEvent) => number[];
export declare function RemoveScrollSideCar(props: IRemoveScrollEffectProps): JSX.Element;

View File

@@ -0,0 +1,146 @@
import { __spreadArray } from "tslib";
import * as React from 'react';
import { RemoveScrollBar } from 'react-remove-scroll-bar';
import { styleSingleton } from 'react-style-singleton';
import { nonPassive } from './aggresiveCapture';
import { handleScroll, locationCouldBeScrolled } from './handleScroll';
export var getTouchXY = function (event) {
return 'changedTouches' in event ? [event.changedTouches[0].clientX, event.changedTouches[0].clientY] : [0, 0];
};
export var getDeltaXY = function (event) { return [event.deltaX, event.deltaY]; };
var extractRef = function (ref) {
return ref && 'current' in ref ? ref.current : ref;
};
var deltaCompare = function (x, y) { return x[0] === y[0] && x[1] === y[1]; };
var generateStyle = function (id) { return "\n .block-interactivity-".concat(id, " {pointer-events: none;}\n .allow-interactivity-").concat(id, " {pointer-events: all;}\n"); };
var idCounter = 0;
var lockStack = [];
export function RemoveScrollSideCar(props) {
var shouldPreventQueue = React.useRef([]);
var touchStartRef = React.useRef([0, 0]);
var activeAxis = React.useRef();
var id = React.useState(idCounter++)[0];
var Style = React.useState(function () { return styleSingleton(); })[0];
var lastProps = React.useRef(props);
React.useEffect(function () {
lastProps.current = props;
}, [props]);
React.useEffect(function () {
if (props.inert) {
document.body.classList.add("block-interactivity-".concat(id));
var allow_1 = __spreadArray([props.lockRef.current], (props.shards || []).map(extractRef), true).filter(Boolean);
allow_1.forEach(function (el) { return el.classList.add("allow-interactivity-".concat(id)); });
return function () {
document.body.classList.remove("block-interactivity-".concat(id));
allow_1.forEach(function (el) { return el.classList.remove("allow-interactivity-".concat(id)); });
};
}
return;
}, [props.inert, props.lockRef.current, props.shards]);
var shouldCancelEvent = React.useCallback(function (event, parent) {
if ('touches' in event && event.touches.length === 2) {
return !lastProps.current.allowPinchZoom;
}
var touch = getTouchXY(event);
var touchStart = touchStartRef.current;
var deltaX = 'deltaX' in event ? event.deltaX : touchStart[0] - touch[0];
var deltaY = 'deltaY' in event ? event.deltaY : touchStart[1] - touch[1];
var currentAxis;
var target = event.target;
var moveDirection = Math.abs(deltaX) > Math.abs(deltaY) ? 'h' : 'v';
// allow horizontal touch move on Range inputs. They will not cause any scroll
if ('touches' in event && moveDirection === 'h' && target.type === 'range') {
return false;
}
var canBeScrolledInMainDirection = locationCouldBeScrolled(moveDirection, target);
if (!canBeScrolledInMainDirection) {
return true;
}
if (canBeScrolledInMainDirection) {
currentAxis = moveDirection;
}
else {
currentAxis = moveDirection === 'v' ? 'h' : 'v';
canBeScrolledInMainDirection = locationCouldBeScrolled(moveDirection, target);
// other axis might be not scrollable
}
if (!canBeScrolledInMainDirection) {
return false;
}
if (!activeAxis.current && 'changedTouches' in event && (deltaX || deltaY)) {
activeAxis.current = currentAxis;
}
if (!currentAxis) {
return true;
}
var cancelingAxis = activeAxis.current || currentAxis;
return handleScroll(cancelingAxis, parent, event, cancelingAxis === 'h' ? deltaX : deltaY, true);
}, []);
var shouldPrevent = React.useCallback(function (_event) {
var event = _event;
if (!lockStack.length || lockStack[lockStack.length - 1] !== Style) {
// not the last active
return;
}
var delta = 'deltaY' in event ? getDeltaXY(event) : getTouchXY(event);
var sourceEvent = shouldPreventQueue.current.filter(function (e) { return e.name === event.type && e.target === event.target && deltaCompare(e.delta, delta); })[0];
// self event, and should be canceled
if (sourceEvent && sourceEvent.should) {
if (event.cancelable) {
event.preventDefault();
}
return;
}
// outside or shard event
if (!sourceEvent) {
var shardNodes = (lastProps.current.shards || [])
.map(extractRef)
.filter(Boolean)
.filter(function (node) { return node.contains(event.target); });
var shouldStop = shardNodes.length > 0 ? shouldCancelEvent(event, shardNodes[0]) : !lastProps.current.noIsolation;
if (shouldStop) {
if (event.cancelable) {
event.preventDefault();
}
}
}
}, []);
var shouldCancel = React.useCallback(function (name, delta, target, should) {
var event = { name: name, delta: delta, target: target, should: should };
shouldPreventQueue.current.push(event);
setTimeout(function () {
shouldPreventQueue.current = shouldPreventQueue.current.filter(function (e) { return e !== event; });
}, 1);
}, []);
var scrollTouchStart = React.useCallback(function (event) {
touchStartRef.current = getTouchXY(event);
activeAxis.current = undefined;
}, []);
var scrollWheel = React.useCallback(function (event) {
shouldCancel(event.type, getDeltaXY(event), event.target, shouldCancelEvent(event, props.lockRef.current));
}, []);
var scrollTouchMove = React.useCallback(function (event) {
shouldCancel(event.type, getTouchXY(event), event.target, shouldCancelEvent(event, props.lockRef.current));
}, []);
React.useEffect(function () {
lockStack.push(Style);
props.setCallbacks({
onScrollCapture: scrollWheel,
onWheelCapture: scrollWheel,
onTouchMoveCapture: scrollTouchMove,
});
document.addEventListener('wheel', shouldPrevent, nonPassive);
document.addEventListener('touchmove', shouldPrevent, nonPassive);
document.addEventListener('touchstart', scrollTouchStart, nonPassive);
return function () {
lockStack = lockStack.filter(function (inst) { return inst !== Style; });
document.removeEventListener('wheel', shouldPrevent, nonPassive);
document.removeEventListener('touchmove', shouldPrevent, nonPassive);
document.removeEventListener('touchstart', scrollTouchStart, nonPassive);
};
}, []);
var removeScrollBar = props.removeScrollBar, inert = props.inert;
return (React.createElement(React.Fragment, null,
inert ? React.createElement(Style, { styles: generateStyle(id) }) : null,
removeScrollBar ? React.createElement(RemoveScrollBar, { gapMode: "margin" }) : null));
}

View File

@@ -0,0 +1,7 @@
import { RemoveScrollUIType, IRemoveScrollSelfProps } from './types';
export type { IRemoveScrollSelfProps, RemoveScrollUIType };
/**
* Removes scrollbar from the page and contain the scroll within the Lock
*/
declare const RemoveScroll: RemoveScrollUIType;
export { RemoveScroll };

View File

@@ -0,0 +1,36 @@
import { __assign, __rest } from "tslib";
import * as React from 'react';
import { fullWidthClassName, zeroRightClassName } from 'react-remove-scroll-bar/constants';
import { useMergeRefs } from 'use-callback-ref';
import { effectCar } from './medium';
var nothing = function () {
return;
};
/**
* Removes scrollbar from the page and contain the scroll within the Lock
*/
var RemoveScroll = React.forwardRef(function (props, parentRef) {
var ref = React.useRef(null);
var _a = React.useState({
onScrollCapture: nothing,
onWheelCapture: nothing,
onTouchMoveCapture: nothing,
}), callbacks = _a[0], setCallbacks = _a[1];
var forwardProps = props.forwardProps, children = props.children, className = props.className, removeScrollBar = props.removeScrollBar, enabled = props.enabled, shards = props.shards, sideCar = props.sideCar, noIsolation = props.noIsolation, inert = props.inert, allowPinchZoom = props.allowPinchZoom, _b = props.as, Container = _b === void 0 ? 'div' : _b, rest = __rest(props, ["forwardProps", "children", "className", "removeScrollBar", "enabled", "shards", "sideCar", "noIsolation", "inert", "allowPinchZoom", "as"]);
var SideCar = sideCar;
var containerRef = useMergeRefs([ref, parentRef]);
var containerProps = __assign(__assign({}, rest), callbacks);
return (React.createElement(React.Fragment, null,
enabled && (React.createElement(SideCar, { sideCar: effectCar, removeScrollBar: removeScrollBar, shards: shards, noIsolation: noIsolation, inert: inert, setCallbacks: setCallbacks, allowPinchZoom: !!allowPinchZoom, lockRef: ref })),
forwardProps ? (React.cloneElement(React.Children.only(children), __assign(__assign({}, containerProps), { ref: containerRef }))) : (React.createElement(Container, __assign({}, containerProps, { className: className, ref: containerRef }), children))));
});
RemoveScroll.defaultProps = {
enabled: true,
removeScrollBar: true,
inert: false,
};
RemoveScroll.classNames = {
fullWidth: fullWidthClassName,
zeroRight: zeroRightClassName,
};
export { RemoveScroll };

View File

@@ -0,0 +1,3 @@
export declare const nonPassive: boolean | {
passive: boolean;
};

View File

@@ -0,0 +1,19 @@
var passiveSupported = false;
if (typeof window !== 'undefined') {
try {
var options = Object.defineProperty({}, 'passive', {
get: function () {
passiveSupported = true;
return true;
},
});
// @ts-ignore
window.addEventListener('test', options, options);
// @ts-ignore
window.removeEventListener('test', options, options);
}
catch (err) {
passiveSupported = false;
}
}
export var nonPassive = passiveSupported ? { passive: false } : false;

View File

@@ -0,0 +1,3 @@
import { Axis } from './types';
export declare const locationCouldBeScrolled: (axis: Axis, node: HTMLElement) => boolean;
export declare const handleScroll: (axis: Axis, endTarget: HTMLElement, event: any, sourceDelta: number, noOverscroll: boolean) => boolean;

View File

@@ -0,0 +1,96 @@
var alwaysContainsScroll = function (node) {
// textarea will always _contain_ scroll inside self. It only can be hidden
return node.tagName === 'TEXTAREA';
};
var elementCanBeScrolled = function (node, overflow) {
var styles = window.getComputedStyle(node);
return (
// not-not-scrollable
styles[overflow] !== 'hidden' &&
// contains scroll inside self
!(styles.overflowY === styles.overflowX && !alwaysContainsScroll(node) && styles[overflow] === 'visible'));
};
var elementCouldBeVScrolled = function (node) { return elementCanBeScrolled(node, 'overflowY'); };
var elementCouldBeHScrolled = function (node) { return elementCanBeScrolled(node, 'overflowX'); };
export var locationCouldBeScrolled = function (axis, node) {
var current = node;
do {
// Skip over shadow root
if (typeof ShadowRoot !== 'undefined' && current instanceof ShadowRoot) {
current = current.host;
}
var isScrollable = elementCouldBeScrolled(axis, current);
if (isScrollable) {
var _a = getScrollVariables(axis, current), s = _a[1], d = _a[2];
if (s > d) {
return true;
}
}
current = current.parentNode;
} while (current && current !== document.body);
return false;
};
var getVScrollVariables = function (_a) {
var scrollTop = _a.scrollTop, scrollHeight = _a.scrollHeight, clientHeight = _a.clientHeight;
return [
scrollTop,
scrollHeight,
clientHeight,
];
};
var getHScrollVariables = function (_a) {
var scrollLeft = _a.scrollLeft, scrollWidth = _a.scrollWidth, clientWidth = _a.clientWidth;
return [
scrollLeft,
scrollWidth,
clientWidth,
];
};
var elementCouldBeScrolled = function (axis, node) {
return axis === 'v' ? elementCouldBeVScrolled(node) : elementCouldBeHScrolled(node);
};
var getScrollVariables = function (axis, node) {
return axis === 'v' ? getVScrollVariables(node) : getHScrollVariables(node);
};
var getDirectionFactor = function (axis, direction) {
/**
* If the element's direction is rtl (right-to-left), then scrollLeft is 0 when the scrollbar is at its rightmost position,
* and then increasingly negative as you scroll towards the end of the content.
* @see https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollLeft
*/
return axis === 'h' && direction === 'rtl' ? -1 : 1;
};
export var handleScroll = function (axis, endTarget, event, sourceDelta, noOverscroll) {
var directionFactor = getDirectionFactor(axis, window.getComputedStyle(endTarget).direction);
var delta = directionFactor * sourceDelta;
// find scrollable target
var target = event.target;
var targetInLock = endTarget.contains(target);
var shouldCancelScroll = false;
var isDeltaPositive = delta > 0;
var availableScroll = 0;
var availableScrollTop = 0;
do {
var _a = getScrollVariables(axis, target), position = _a[0], scroll_1 = _a[1], capacity = _a[2];
var elementScroll = scroll_1 - capacity - directionFactor * position;
if (position || elementScroll) {
if (elementCouldBeScrolled(axis, target)) {
availableScroll += elementScroll;
availableScrollTop += position;
}
}
target = target.parentNode;
} while (
// portaled content
(!targetInLock && target !== document.body) ||
// self content
(targetInLock && (endTarget.contains(target) || endTarget === target)));
if (isDeltaPositive && ((noOverscroll && availableScroll === 0) || (!noOverscroll && delta > availableScroll))) {
shouldCancelScroll = true;
}
else if (!isDeltaPositive &&
((noOverscroll && availableScrollTop === 0) || (!noOverscroll && -delta > availableScrollTop))) {
shouldCancelScroll = true;
}
return shouldCancelScroll;
};

View File

@@ -0,0 +1,2 @@
import RemoveScroll from './Combination';
export { RemoveScroll };

View File

@@ -0,0 +1,2 @@
import RemoveScroll from './Combination';
export { RemoveScroll };

View File

@@ -0,0 +1,2 @@
import { IRemoveScrollEffectProps } from './types';
export declare const effectCar: Readonly<import("use-sidecar/dist/es5/types").SideCarMedium<IRemoveScrollEffectProps>>;

View File

@@ -0,0 +1,2 @@
import { createSidecarMedium } from 'use-sidecar';
export var effectCar = createSidecarMedium();

View File

@@ -0,0 +1,8 @@
import { Touch } from 'react';
export declare const pinchOrZoom: (event: TouchEvent, cache: Record<number, Touch>) => false | {
action: string;
coords?: undefined;
} | {
action: string;
coords: number[];
};

View File

@@ -0,0 +1,33 @@
var ds = function (ab) { return (ab[0] <= 0 && ab[1] >= 0) || (ab[0] >= 0 && ab[1] <= 0); };
var sign = function (x) { return (x < 0 ? -1 : 1); };
export var pinchOrZoom = function (event, cache) {
if (!event.changedTouches) {
return false;
}
if (event.touches.length === 2) {
var oldPoints = [cache[event.touches[0].identifier], cache[event.touches[1].identifier]];
var newPoints = [event.touches[0], event.touches[1]];
if (oldPoints[0] && oldPoints[1]) {
// Calculate the difference between the start and move coordinates
var diffx = [oldPoints[0].clientX - newPoints[0].clientX, oldPoints[1].clientX - newPoints[1].clientX];
var diffy = [oldPoints[0].clientY - newPoints[0].clientY, oldPoints[1].clientY - newPoints[1].clientY];
console.log(diffx, diffy);
if (ds(diffx) || ds(diffy)) {
return {
action: 'zoom',
};
}
var mx = Math.max(Math.abs(diffx[0]), Math.abs(diffx[1]));
var my = Math.max(Math.abs(diffy[0]), Math.abs(diffy[1]));
return {
action: 'pinch',
coords: [mx * sign(diffx[0]), my * sign(diffx[1])],
};
}
}
Array.from(event.changedTouches).forEach(function (touch) { return (cache[touch.identifier] = touch); });
return {
action: 'move',
coords: [event.changedTouches[0].clientX, event.changedTouches[0].clientY],
};
};

View File

@@ -0,0 +1,2 @@
declare const _default: import("use-sidecar").SideCarComponent<import("./types").IRemoveScrollEffectProps>;
export default _default;

View File

@@ -0,0 +1,4 @@
import { exportSidecar } from 'use-sidecar';
import { RemoveScrollSideCar } from './SideEffect';
import { effectCar } from './medium';
export default exportSidecar(effectCar, RemoveScrollSideCar);

View File

@@ -0,0 +1,90 @@
import * as React from 'react';
import { Ref, RefObject } from 'react';
import { ForwardRefExoticComponent } from 'react';
import { RefAttributes } from 'react';
export declare type Axis = 'v' | 'h';
export interface RemoveScrollEffectCallbacks {
onScrollCapture(event: any): void;
onWheelCapture(event: any): void;
onTouchMoveCapture(event: any): void;
}
export interface ChildrenNode {
/**
* if forwardProps is false - children should be ReactNode
* and it would be wrapper with a div
* @see {@link IRemoveScrollSelfProps.as}
*/
forwardProps?: false;
children: React.ReactNode;
}
export interface ChildrenForward {
/**
* if forwardProps is true - children should be single Element
* which would NOT with a div
* @see {@link IRemoveScrollSelfProps.as}
*/
forwardProps: true;
children: React.ReactElement;
}
export interface IRemoveScrollSelfProps {
ref?: Ref<HTMLElement>;
/**
* disables "event isolation" (suppressing of events happening outside of the Lock)
* @default false
*/
noIsolation?: boolean;
/**
* enabled complete Lock isolation using `pointer-events:none` for anything outside the Lock
* you probably don't need it, except you do
* @default false
* @see {IRemoveScrollSelfProps.noIsolation}
*/
inert?: boolean;
/**
* allows pinch-zoom, however might work not perfectly for normal scroll
*/
allowPinchZoom?: boolean;
/**
* switches on/off the behavior of the component
*/
enabled?: boolean;
/**
* Controls the body scroll bar removal
* @default false
*/
removeScrollBar?: boolean;
className?: string;
style?: React.CSSProperties;
/**
* array of refs to other Elements, which should be considered as a part of the Lock
*/
shards?: Array<React.RefObject<any> | HTMLElement>;
/**
* Control host node used for the lock.
* @default 'div'
*/
as?: string | React.ElementType;
}
export declare type IRemoveScrollProps = IRemoveScrollSelfProps & (ChildrenForward | ChildrenNode);
export declare type IRemoveScrollUIProps = IRemoveScrollProps & {
sideCar: React.FC<any>;
};
export interface IRemoveScrollEffectProps {
noIsolation?: boolean;
removeScrollBar?: boolean;
allowPinchZoom: boolean;
inert?: boolean;
shards?: Array<React.RefObject<any> | HTMLElement>;
lockRef: RefObject<HTMLElement>;
setCallbacks(cb: RemoveScrollEffectCallbacks): void;
}
interface WithClassNames {
classNames: {
fullWidth: string;
zeroRight: string;
};
}
declare type RefForwarded<T> = ForwardRefExoticComponent<T & RefAttributes<HTMLElement>> & WithClassNames;
export declare type RemoveScrollType = RefForwarded<IRemoveScrollProps>;
export declare type RemoveScrollUIType = RefForwarded<IRemoveScrollUIProps>;
export {};

View File

@@ -0,0 +1 @@
export {};

View File

@@ -0,0 +1,3 @@
import { RemoveScrollType } from './types';
declare const ReactRemoveScroll: RemoveScrollType;
export default ReactRemoveScroll;

View File

@@ -0,0 +1,6 @@
import * as React from 'react';
import { RemoveScroll } from './UI';
import SideCar from './sidecar';
const ReactRemoveScroll = React.forwardRef((props, ref) => (React.createElement(RemoveScroll, { ...props, ref: ref, sideCar: SideCar })));
ReactRemoveScroll.classNames = RemoveScroll.classNames;
export default ReactRemoveScroll;

View File

@@ -0,0 +1,5 @@
import { TouchEvent } from 'react';
import { IRemoveScrollEffectProps } from './types';
export declare const getTouchXY: (event: TouchEvent | WheelEvent) => number[];
export declare const getDeltaXY: (event: WheelEvent) => number[];
export declare function RemoveScrollSideCar(props: IRemoveScrollEffectProps): JSX.Element;

View File

@@ -0,0 +1,144 @@
import * as React from 'react';
import { RemoveScrollBar } from 'react-remove-scroll-bar';
import { styleSingleton } from 'react-style-singleton';
import { nonPassive } from './aggresiveCapture';
import { handleScroll, locationCouldBeScrolled } from './handleScroll';
export const getTouchXY = (event) => 'changedTouches' in event ? [event.changedTouches[0].clientX, event.changedTouches[0].clientY] : [0, 0];
export const getDeltaXY = (event) => [event.deltaX, event.deltaY];
const extractRef = (ref) => ref && 'current' in ref ? ref.current : ref;
const deltaCompare = (x, y) => x[0] === y[0] && x[1] === y[1];
const generateStyle = (id) => `
.block-interactivity-${id} {pointer-events: none;}
.allow-interactivity-${id} {pointer-events: all;}
`;
let idCounter = 0;
let lockStack = [];
export function RemoveScrollSideCar(props) {
const shouldPreventQueue = React.useRef([]);
const touchStartRef = React.useRef([0, 0]);
const activeAxis = React.useRef();
const [id] = React.useState(idCounter++);
const [Style] = React.useState(() => styleSingleton());
const lastProps = React.useRef(props);
React.useEffect(() => {
lastProps.current = props;
}, [props]);
React.useEffect(() => {
if (props.inert) {
document.body.classList.add(`block-interactivity-${id}`);
const allow = [props.lockRef.current, ...(props.shards || []).map(extractRef)].filter(Boolean);
allow.forEach((el) => el.classList.add(`allow-interactivity-${id}`));
return () => {
document.body.classList.remove(`block-interactivity-${id}`);
allow.forEach((el) => el.classList.remove(`allow-interactivity-${id}`));
};
}
return;
}, [props.inert, props.lockRef.current, props.shards]);
const shouldCancelEvent = React.useCallback((event, parent) => {
if ('touches' in event && event.touches.length === 2) {
return !lastProps.current.allowPinchZoom;
}
const touch = getTouchXY(event);
const touchStart = touchStartRef.current;
const deltaX = 'deltaX' in event ? event.deltaX : touchStart[0] - touch[0];
const deltaY = 'deltaY' in event ? event.deltaY : touchStart[1] - touch[1];
let currentAxis;
const target = event.target;
const moveDirection = Math.abs(deltaX) > Math.abs(deltaY) ? 'h' : 'v';
// allow horizontal touch move on Range inputs. They will not cause any scroll
if ('touches' in event && moveDirection === 'h' && target.type === 'range') {
return false;
}
let canBeScrolledInMainDirection = locationCouldBeScrolled(moveDirection, target);
if (!canBeScrolledInMainDirection) {
return true;
}
if (canBeScrolledInMainDirection) {
currentAxis = moveDirection;
}
else {
currentAxis = moveDirection === 'v' ? 'h' : 'v';
canBeScrolledInMainDirection = locationCouldBeScrolled(moveDirection, target);
// other axis might be not scrollable
}
if (!canBeScrolledInMainDirection) {
return false;
}
if (!activeAxis.current && 'changedTouches' in event && (deltaX || deltaY)) {
activeAxis.current = currentAxis;
}
if (!currentAxis) {
return true;
}
const cancelingAxis = activeAxis.current || currentAxis;
return handleScroll(cancelingAxis, parent, event, cancelingAxis === 'h' ? deltaX : deltaY, true);
}, []);
const shouldPrevent = React.useCallback((_event) => {
const event = _event;
if (!lockStack.length || lockStack[lockStack.length - 1] !== Style) {
// not the last active
return;
}
const delta = 'deltaY' in event ? getDeltaXY(event) : getTouchXY(event);
const sourceEvent = shouldPreventQueue.current.filter((e) => e.name === event.type && e.target === event.target && deltaCompare(e.delta, delta))[0];
// self event, and should be canceled
if (sourceEvent && sourceEvent.should) {
if (event.cancelable) {
event.preventDefault();
}
return;
}
// outside or shard event
if (!sourceEvent) {
const shardNodes = (lastProps.current.shards || [])
.map(extractRef)
.filter(Boolean)
.filter((node) => node.contains(event.target));
const shouldStop = shardNodes.length > 0 ? shouldCancelEvent(event, shardNodes[0]) : !lastProps.current.noIsolation;
if (shouldStop) {
if (event.cancelable) {
event.preventDefault();
}
}
}
}, []);
const shouldCancel = React.useCallback((name, delta, target, should) => {
const event = { name, delta, target, should };
shouldPreventQueue.current.push(event);
setTimeout(() => {
shouldPreventQueue.current = shouldPreventQueue.current.filter((e) => e !== event);
}, 1);
}, []);
const scrollTouchStart = React.useCallback((event) => {
touchStartRef.current = getTouchXY(event);
activeAxis.current = undefined;
}, []);
const scrollWheel = React.useCallback((event) => {
shouldCancel(event.type, getDeltaXY(event), event.target, shouldCancelEvent(event, props.lockRef.current));
}, []);
const scrollTouchMove = React.useCallback((event) => {
shouldCancel(event.type, getTouchXY(event), event.target, shouldCancelEvent(event, props.lockRef.current));
}, []);
React.useEffect(() => {
lockStack.push(Style);
props.setCallbacks({
onScrollCapture: scrollWheel,
onWheelCapture: scrollWheel,
onTouchMoveCapture: scrollTouchMove,
});
document.addEventListener('wheel', shouldPrevent, nonPassive);
document.addEventListener('touchmove', shouldPrevent, nonPassive);
document.addEventListener('touchstart', scrollTouchStart, nonPassive);
return () => {
lockStack = lockStack.filter((inst) => inst !== Style);
document.removeEventListener('wheel', shouldPrevent, nonPassive);
document.removeEventListener('touchmove', shouldPrevent, nonPassive);
document.removeEventListener('touchstart', scrollTouchStart, nonPassive);
};
}, []);
const { removeScrollBar, inert } = props;
return (React.createElement(React.Fragment, null,
inert ? React.createElement(Style, { styles: generateStyle(id) }) : null,
removeScrollBar ? React.createElement(RemoveScrollBar, { gapMode: "margin" }) : null));
}

View File

@@ -0,0 +1,7 @@
import { RemoveScrollUIType, IRemoveScrollSelfProps } from './types';
export type { IRemoveScrollSelfProps, RemoveScrollUIType };
/**
* Removes scrollbar from the page and contain the scroll within the Lock
*/
declare const RemoveScroll: RemoveScrollUIType;
export { RemoveScroll };

View File

@@ -0,0 +1,41 @@
import * as React from 'react';
import { fullWidthClassName, zeroRightClassName } from 'react-remove-scroll-bar/constants';
import { useMergeRefs } from 'use-callback-ref';
import { effectCar } from './medium';
const nothing = () => {
return;
};
/**
* Removes scrollbar from the page and contain the scroll within the Lock
*/
const RemoveScroll = React.forwardRef((props, parentRef) => {
const ref = React.useRef(null);
const [callbacks, setCallbacks] = React.useState({
onScrollCapture: nothing,
onWheelCapture: nothing,
onTouchMoveCapture: nothing,
});
const { forwardProps, children, className, removeScrollBar, enabled, shards, sideCar, noIsolation, inert, allowPinchZoom, as: Container = 'div', ...rest } = props;
const SideCar = sideCar;
const containerRef = useMergeRefs([ref, parentRef]);
const containerProps = {
...rest,
...callbacks,
};
return (React.createElement(React.Fragment, null,
enabled && (React.createElement(SideCar, { sideCar: effectCar, removeScrollBar: removeScrollBar, shards: shards, noIsolation: noIsolation, inert: inert, setCallbacks: setCallbacks, allowPinchZoom: !!allowPinchZoom, lockRef: ref })),
forwardProps ? (React.cloneElement(React.Children.only(children), {
...containerProps,
ref: containerRef,
})) : (React.createElement(Container, { ...containerProps, className: className, ref: containerRef }, children))));
});
RemoveScroll.defaultProps = {
enabled: true,
removeScrollBar: true,
inert: false,
};
RemoveScroll.classNames = {
fullWidth: fullWidthClassName,
zeroRight: zeroRightClassName,
};
export { RemoveScroll };

View File

@@ -0,0 +1,3 @@
export declare const nonPassive: boolean | {
passive: boolean;
};

View File

@@ -0,0 +1,19 @@
let passiveSupported = false;
if (typeof window !== 'undefined') {
try {
const options = Object.defineProperty({}, 'passive', {
get() {
passiveSupported = true;
return true;
},
});
// @ts-ignore
window.addEventListener('test', options, options);
// @ts-ignore
window.removeEventListener('test', options, options);
}
catch (err) {
passiveSupported = false;
}
}
export const nonPassive = passiveSupported ? { passive: false } : false;

View File

@@ -0,0 +1,3 @@
import { Axis } from './types';
export declare const locationCouldBeScrolled: (axis: Axis, node: HTMLElement) => boolean;
export declare const handleScroll: (axis: Axis, endTarget: HTMLElement, event: any, sourceDelta: number, noOverscroll: boolean) => boolean;

View File

@@ -0,0 +1,84 @@
const alwaysContainsScroll = (node) =>
// textarea will always _contain_ scroll inside self. It only can be hidden
node.tagName === 'TEXTAREA';
const elementCanBeScrolled = (node, overflow) => {
const styles = window.getComputedStyle(node);
return (
// not-not-scrollable
styles[overflow] !== 'hidden' &&
// contains scroll inside self
!(styles.overflowY === styles.overflowX && !alwaysContainsScroll(node) && styles[overflow] === 'visible'));
};
const elementCouldBeVScrolled = (node) => elementCanBeScrolled(node, 'overflowY');
const elementCouldBeHScrolled = (node) => elementCanBeScrolled(node, 'overflowX');
export const locationCouldBeScrolled = (axis, node) => {
let current = node;
do {
// Skip over shadow root
if (typeof ShadowRoot !== 'undefined' && current instanceof ShadowRoot) {
current = current.host;
}
const isScrollable = elementCouldBeScrolled(axis, current);
if (isScrollable) {
const [, s, d] = getScrollVariables(axis, current);
if (s > d) {
return true;
}
}
current = current.parentNode;
} while (current && current !== document.body);
return false;
};
const getVScrollVariables = ({ scrollTop, scrollHeight, clientHeight }) => [
scrollTop,
scrollHeight,
clientHeight,
];
const getHScrollVariables = ({ scrollLeft, scrollWidth, clientWidth }) => [
scrollLeft,
scrollWidth,
clientWidth,
];
const elementCouldBeScrolled = (axis, node) => axis === 'v' ? elementCouldBeVScrolled(node) : elementCouldBeHScrolled(node);
const getScrollVariables = (axis, node) => axis === 'v' ? getVScrollVariables(node) : getHScrollVariables(node);
const getDirectionFactor = (axis, direction) =>
/**
* If the element's direction is rtl (right-to-left), then scrollLeft is 0 when the scrollbar is at its rightmost position,
* and then increasingly negative as you scroll towards the end of the content.
* @see https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollLeft
*/
axis === 'h' && direction === 'rtl' ? -1 : 1;
export const handleScroll = (axis, endTarget, event, sourceDelta, noOverscroll) => {
const directionFactor = getDirectionFactor(axis, window.getComputedStyle(endTarget).direction);
const delta = directionFactor * sourceDelta;
// find scrollable target
let target = event.target;
const targetInLock = endTarget.contains(target);
let shouldCancelScroll = false;
const isDeltaPositive = delta > 0;
let availableScroll = 0;
let availableScrollTop = 0;
do {
const [position, scroll, capacity] = getScrollVariables(axis, target);
const elementScroll = scroll - capacity - directionFactor * position;
if (position || elementScroll) {
if (elementCouldBeScrolled(axis, target)) {
availableScroll += elementScroll;
availableScrollTop += position;
}
}
target = target.parentNode;
} while (
// portaled content
(!targetInLock && target !== document.body) ||
// self content
(targetInLock && (endTarget.contains(target) || endTarget === target)));
if (isDeltaPositive && ((noOverscroll && availableScroll === 0) || (!noOverscroll && delta > availableScroll))) {
shouldCancelScroll = true;
}
else if (!isDeltaPositive &&
((noOverscroll && availableScrollTop === 0) || (!noOverscroll && -delta > availableScrollTop))) {
shouldCancelScroll = true;
}
return shouldCancelScroll;
};

View File

@@ -0,0 +1,2 @@
import RemoveScroll from './Combination';
export { RemoveScroll };

View File

@@ -0,0 +1,2 @@
import RemoveScroll from './Combination';
export { RemoveScroll };

View File

@@ -0,0 +1,2 @@
import { IRemoveScrollEffectProps } from './types';
export declare const effectCar: Readonly<import("use-sidecar/dist/es5/types").SideCarMedium<IRemoveScrollEffectProps>>;

View File

@@ -0,0 +1,2 @@
import { createSidecarMedium } from 'use-sidecar';
export const effectCar = createSidecarMedium();

View File

@@ -0,0 +1,8 @@
import { Touch } from 'react';
export declare const pinchOrZoom: (event: TouchEvent, cache: Record<number, Touch>) => false | {
action: string;
coords?: undefined;
} | {
action: string;
coords: number[];
};

View File

@@ -0,0 +1,33 @@
const ds = (ab) => (ab[0] <= 0 && ab[1] >= 0) || (ab[0] >= 0 && ab[1] <= 0);
const sign = (x) => (x < 0 ? -1 : 1);
export const pinchOrZoom = (event, cache) => {
if (!event.changedTouches) {
return false;
}
if (event.touches.length === 2) {
const oldPoints = [cache[event.touches[0].identifier], cache[event.touches[1].identifier]];
const newPoints = [event.touches[0], event.touches[1]];
if (oldPoints[0] && oldPoints[1]) {
// Calculate the difference between the start and move coordinates
const diffx = [oldPoints[0].clientX - newPoints[0].clientX, oldPoints[1].clientX - newPoints[1].clientX];
const diffy = [oldPoints[0].clientY - newPoints[0].clientY, oldPoints[1].clientY - newPoints[1].clientY];
console.log(diffx, diffy);
if (ds(diffx) || ds(diffy)) {
return {
action: 'zoom',
};
}
const mx = Math.max(Math.abs(diffx[0]), Math.abs(diffx[1]));
const my = Math.max(Math.abs(diffy[0]), Math.abs(diffy[1]));
return {
action: 'pinch',
coords: [mx * sign(diffx[0]), my * sign(diffx[1])],
};
}
}
Array.from(event.changedTouches).forEach((touch) => (cache[touch.identifier] = touch));
return {
action: 'move',
coords: [event.changedTouches[0].clientX, event.changedTouches[0].clientY],
};
};

View File

@@ -0,0 +1,2 @@
declare const _default: import("use-sidecar").SideCarComponent<import("./types").IRemoveScrollEffectProps>;
export default _default;

View File

@@ -0,0 +1,4 @@
import { exportSidecar } from 'use-sidecar';
import { RemoveScrollSideCar } from './SideEffect';
import { effectCar } from './medium';
export default exportSidecar(effectCar, RemoveScrollSideCar);

View File

@@ -0,0 +1,90 @@
import * as React from 'react';
import { Ref, RefObject } from 'react';
import { ForwardRefExoticComponent } from 'react';
import { RefAttributes } from 'react';
export declare type Axis = 'v' | 'h';
export interface RemoveScrollEffectCallbacks {
onScrollCapture(event: any): void;
onWheelCapture(event: any): void;
onTouchMoveCapture(event: any): void;
}
export interface ChildrenNode {
/**
* if forwardProps is false - children should be ReactNode
* and it would be wrapper with a div
* @see {@link IRemoveScrollSelfProps.as}
*/
forwardProps?: false;
children: React.ReactNode;
}
export interface ChildrenForward {
/**
* if forwardProps is true - children should be single Element
* which would NOT with a div
* @see {@link IRemoveScrollSelfProps.as}
*/
forwardProps: true;
children: React.ReactElement;
}
export interface IRemoveScrollSelfProps {
ref?: Ref<HTMLElement>;
/**
* disables "event isolation" (suppressing of events happening outside of the Lock)
* @default false
*/
noIsolation?: boolean;
/**
* enabled complete Lock isolation using `pointer-events:none` for anything outside the Lock
* you probably don't need it, except you do
* @default false
* @see {IRemoveScrollSelfProps.noIsolation}
*/
inert?: boolean;
/**
* allows pinch-zoom, however might work not perfectly for normal scroll
*/
allowPinchZoom?: boolean;
/**
* switches on/off the behavior of the component
*/
enabled?: boolean;
/**
* Controls the body scroll bar removal
* @default false
*/
removeScrollBar?: boolean;
className?: string;
style?: React.CSSProperties;
/**
* array of refs to other Elements, which should be considered as a part of the Lock
*/
shards?: Array<React.RefObject<any> | HTMLElement>;
/**
* Control host node used for the lock.
* @default 'div'
*/
as?: string | React.ElementType;
}
export declare type IRemoveScrollProps = IRemoveScrollSelfProps & (ChildrenForward | ChildrenNode);
export declare type IRemoveScrollUIProps = IRemoveScrollProps & {
sideCar: React.FC<any>;
};
export interface IRemoveScrollEffectProps {
noIsolation?: boolean;
removeScrollBar?: boolean;
allowPinchZoom: boolean;
inert?: boolean;
shards?: Array<React.RefObject<any> | HTMLElement>;
lockRef: RefObject<HTMLElement>;
setCallbacks(cb: RemoveScrollEffectCallbacks): void;
}
interface WithClassNames {
classNames: {
fullWidth: string;
zeroRight: string;
};
}
declare type RefForwarded<T> = ForwardRefExoticComponent<T & RefAttributes<HTMLElement>> & WithClassNames;
export declare type RemoveScrollType = RefForwarded<IRemoveScrollProps>;
export declare type RemoveScrollUIType = RefForwarded<IRemoveScrollUIProps>;
export {};

View File

@@ -0,0 +1 @@
export {};

View File

@@ -0,0 +1,3 @@
import { RemoveScrollType } from './types';
declare const ReactRemoveScroll: RemoveScrollType;
export default ReactRemoveScroll;

View File

@@ -0,0 +1,9 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var tslib_1 = require("tslib");
var React = tslib_1.__importStar(require("react"));
var UI_1 = require("./UI");
var sidecar_1 = tslib_1.__importDefault(require("./sidecar"));
var ReactRemoveScroll = React.forwardRef(function (props, ref) { return (React.createElement(UI_1.RemoveScroll, tslib_1.__assign({}, props, { ref: ref, sideCar: sidecar_1.default }))); });
ReactRemoveScroll.classNames = UI_1.RemoveScroll.classNames;
exports.default = ReactRemoveScroll;

View File

@@ -0,0 +1,5 @@
import { TouchEvent } from 'react';
import { IRemoveScrollEffectProps } from './types';
export declare const getTouchXY: (event: TouchEvent | WheelEvent) => number[];
export declare const getDeltaXY: (event: WheelEvent) => number[];
export declare function RemoveScrollSideCar(props: IRemoveScrollEffectProps): JSX.Element;

View File

@@ -0,0 +1,152 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.RemoveScrollSideCar = exports.getDeltaXY = exports.getTouchXY = void 0;
var tslib_1 = require("tslib");
var React = tslib_1.__importStar(require("react"));
var react_remove_scroll_bar_1 = require("react-remove-scroll-bar");
var react_style_singleton_1 = require("react-style-singleton");
var aggresiveCapture_1 = require("./aggresiveCapture");
var handleScroll_1 = require("./handleScroll");
var getTouchXY = function (event) {
return 'changedTouches' in event ? [event.changedTouches[0].clientX, event.changedTouches[0].clientY] : [0, 0];
};
exports.getTouchXY = getTouchXY;
var getDeltaXY = function (event) { return [event.deltaX, event.deltaY]; };
exports.getDeltaXY = getDeltaXY;
var extractRef = function (ref) {
return ref && 'current' in ref ? ref.current : ref;
};
var deltaCompare = function (x, y) { return x[0] === y[0] && x[1] === y[1]; };
var generateStyle = function (id) { return "\n .block-interactivity-".concat(id, " {pointer-events: none;}\n .allow-interactivity-").concat(id, " {pointer-events: all;}\n"); };
var idCounter = 0;
var lockStack = [];
function RemoveScrollSideCar(props) {
var shouldPreventQueue = React.useRef([]);
var touchStartRef = React.useRef([0, 0]);
var activeAxis = React.useRef();
var id = React.useState(idCounter++)[0];
var Style = React.useState(function () { return (0, react_style_singleton_1.styleSingleton)(); })[0];
var lastProps = React.useRef(props);
React.useEffect(function () {
lastProps.current = props;
}, [props]);
React.useEffect(function () {
if (props.inert) {
document.body.classList.add("block-interactivity-".concat(id));
var allow_1 = tslib_1.__spreadArray([props.lockRef.current], (props.shards || []).map(extractRef), true).filter(Boolean);
allow_1.forEach(function (el) { return el.classList.add("allow-interactivity-".concat(id)); });
return function () {
document.body.classList.remove("block-interactivity-".concat(id));
allow_1.forEach(function (el) { return el.classList.remove("allow-interactivity-".concat(id)); });
};
}
return;
}, [props.inert, props.lockRef.current, props.shards]);
var shouldCancelEvent = React.useCallback(function (event, parent) {
if ('touches' in event && event.touches.length === 2) {
return !lastProps.current.allowPinchZoom;
}
var touch = (0, exports.getTouchXY)(event);
var touchStart = touchStartRef.current;
var deltaX = 'deltaX' in event ? event.deltaX : touchStart[0] - touch[0];
var deltaY = 'deltaY' in event ? event.deltaY : touchStart[1] - touch[1];
var currentAxis;
var target = event.target;
var moveDirection = Math.abs(deltaX) > Math.abs(deltaY) ? 'h' : 'v';
// allow horizontal touch move on Range inputs. They will not cause any scroll
if ('touches' in event && moveDirection === 'h' && target.type === 'range') {
return false;
}
var canBeScrolledInMainDirection = (0, handleScroll_1.locationCouldBeScrolled)(moveDirection, target);
if (!canBeScrolledInMainDirection) {
return true;
}
if (canBeScrolledInMainDirection) {
currentAxis = moveDirection;
}
else {
currentAxis = moveDirection === 'v' ? 'h' : 'v';
canBeScrolledInMainDirection = (0, handleScroll_1.locationCouldBeScrolled)(moveDirection, target);
// other axis might be not scrollable
}
if (!canBeScrolledInMainDirection) {
return false;
}
if (!activeAxis.current && 'changedTouches' in event && (deltaX || deltaY)) {
activeAxis.current = currentAxis;
}
if (!currentAxis) {
return true;
}
var cancelingAxis = activeAxis.current || currentAxis;
return (0, handleScroll_1.handleScroll)(cancelingAxis, parent, event, cancelingAxis === 'h' ? deltaX : deltaY, true);
}, []);
var shouldPrevent = React.useCallback(function (_event) {
var event = _event;
if (!lockStack.length || lockStack[lockStack.length - 1] !== Style) {
// not the last active
return;
}
var delta = 'deltaY' in event ? (0, exports.getDeltaXY)(event) : (0, exports.getTouchXY)(event);
var sourceEvent = shouldPreventQueue.current.filter(function (e) { return e.name === event.type && e.target === event.target && deltaCompare(e.delta, delta); })[0];
// self event, and should be canceled
if (sourceEvent && sourceEvent.should) {
if (event.cancelable) {
event.preventDefault();
}
return;
}
// outside or shard event
if (!sourceEvent) {
var shardNodes = (lastProps.current.shards || [])
.map(extractRef)
.filter(Boolean)
.filter(function (node) { return node.contains(event.target); });
var shouldStop = shardNodes.length > 0 ? shouldCancelEvent(event, shardNodes[0]) : !lastProps.current.noIsolation;
if (shouldStop) {
if (event.cancelable) {
event.preventDefault();
}
}
}
}, []);
var shouldCancel = React.useCallback(function (name, delta, target, should) {
var event = { name: name, delta: delta, target: target, should: should };
shouldPreventQueue.current.push(event);
setTimeout(function () {
shouldPreventQueue.current = shouldPreventQueue.current.filter(function (e) { return e !== event; });
}, 1);
}, []);
var scrollTouchStart = React.useCallback(function (event) {
touchStartRef.current = (0, exports.getTouchXY)(event);
activeAxis.current = undefined;
}, []);
var scrollWheel = React.useCallback(function (event) {
shouldCancel(event.type, (0, exports.getDeltaXY)(event), event.target, shouldCancelEvent(event, props.lockRef.current));
}, []);
var scrollTouchMove = React.useCallback(function (event) {
shouldCancel(event.type, (0, exports.getTouchXY)(event), event.target, shouldCancelEvent(event, props.lockRef.current));
}, []);
React.useEffect(function () {
lockStack.push(Style);
props.setCallbacks({
onScrollCapture: scrollWheel,
onWheelCapture: scrollWheel,
onTouchMoveCapture: scrollTouchMove,
});
document.addEventListener('wheel', shouldPrevent, aggresiveCapture_1.nonPassive);
document.addEventListener('touchmove', shouldPrevent, aggresiveCapture_1.nonPassive);
document.addEventListener('touchstart', scrollTouchStart, aggresiveCapture_1.nonPassive);
return function () {
lockStack = lockStack.filter(function (inst) { return inst !== Style; });
document.removeEventListener('wheel', shouldPrevent, aggresiveCapture_1.nonPassive);
document.removeEventListener('touchmove', shouldPrevent, aggresiveCapture_1.nonPassive);
document.removeEventListener('touchstart', scrollTouchStart, aggresiveCapture_1.nonPassive);
};
}, []);
var removeScrollBar = props.removeScrollBar, inert = props.inert;
return (React.createElement(React.Fragment, null,
inert ? React.createElement(Style, { styles: generateStyle(id) }) : null,
removeScrollBar ? React.createElement(react_remove_scroll_bar_1.RemoveScrollBar, { gapMode: "margin" }) : null));
}
exports.RemoveScrollSideCar = RemoveScrollSideCar;

View File

@@ -0,0 +1,7 @@
import { RemoveScrollUIType, IRemoveScrollSelfProps } from './types';
export type { IRemoveScrollSelfProps, RemoveScrollUIType };
/**
* Removes scrollbar from the page and contain the scroll within the Lock
*/
declare const RemoveScroll: RemoveScrollUIType;
export { RemoveScroll };

View File

@@ -0,0 +1,39 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.RemoveScroll = void 0;
var tslib_1 = require("tslib");
var React = tslib_1.__importStar(require("react"));
var constants_1 = require("react-remove-scroll-bar/constants");
var use_callback_ref_1 = require("use-callback-ref");
var medium_1 = require("./medium");
var nothing = function () {
return;
};
/**
* Removes scrollbar from the page and contain the scroll within the Lock
*/
var RemoveScroll = React.forwardRef(function (props, parentRef) {
var ref = React.useRef(null);
var _a = React.useState({
onScrollCapture: nothing,
onWheelCapture: nothing,
onTouchMoveCapture: nothing,
}), callbacks = _a[0], setCallbacks = _a[1];
var forwardProps = props.forwardProps, children = props.children, className = props.className, removeScrollBar = props.removeScrollBar, enabled = props.enabled, shards = props.shards, sideCar = props.sideCar, noIsolation = props.noIsolation, inert = props.inert, allowPinchZoom = props.allowPinchZoom, _b = props.as, Container = _b === void 0 ? 'div' : _b, rest = tslib_1.__rest(props, ["forwardProps", "children", "className", "removeScrollBar", "enabled", "shards", "sideCar", "noIsolation", "inert", "allowPinchZoom", "as"]);
var SideCar = sideCar;
var containerRef = (0, use_callback_ref_1.useMergeRefs)([ref, parentRef]);
var containerProps = tslib_1.__assign(tslib_1.__assign({}, rest), callbacks);
return (React.createElement(React.Fragment, null,
enabled && (React.createElement(SideCar, { sideCar: medium_1.effectCar, removeScrollBar: removeScrollBar, shards: shards, noIsolation: noIsolation, inert: inert, setCallbacks: setCallbacks, allowPinchZoom: !!allowPinchZoom, lockRef: ref })),
forwardProps ? (React.cloneElement(React.Children.only(children), tslib_1.__assign(tslib_1.__assign({}, containerProps), { ref: containerRef }))) : (React.createElement(Container, tslib_1.__assign({}, containerProps, { className: className, ref: containerRef }), children))));
});
exports.RemoveScroll = RemoveScroll;
RemoveScroll.defaultProps = {
enabled: true,
removeScrollBar: true,
inert: false,
};
RemoveScroll.classNames = {
fullWidth: constants_1.fullWidthClassName,
zeroRight: constants_1.zeroRightClassName,
};

View File

@@ -0,0 +1,3 @@
export declare const nonPassive: boolean | {
passive: boolean;
};

View File

@@ -0,0 +1,22 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.nonPassive = void 0;
var passiveSupported = false;
if (typeof window !== 'undefined') {
try {
var options = Object.defineProperty({}, 'passive', {
get: function () {
passiveSupported = true;
return true;
},
});
// @ts-ignore
window.addEventListener('test', options, options);
// @ts-ignore
window.removeEventListener('test', options, options);
}
catch (err) {
passiveSupported = false;
}
}
exports.nonPassive = passiveSupported ? { passive: false } : false;

View File

@@ -0,0 +1,3 @@
import { Axis } from './types';
export declare const locationCouldBeScrolled: (axis: Axis, node: HTMLElement) => boolean;
export declare const handleScroll: (axis: Axis, endTarget: HTMLElement, event: any, sourceDelta: number, noOverscroll: boolean) => boolean;

View File

@@ -0,0 +1,101 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.handleScroll = exports.locationCouldBeScrolled = void 0;
var alwaysContainsScroll = function (node) {
// textarea will always _contain_ scroll inside self. It only can be hidden
return node.tagName === 'TEXTAREA';
};
var elementCanBeScrolled = function (node, overflow) {
var styles = window.getComputedStyle(node);
return (
// not-not-scrollable
styles[overflow] !== 'hidden' &&
// contains scroll inside self
!(styles.overflowY === styles.overflowX && !alwaysContainsScroll(node) && styles[overflow] === 'visible'));
};
var elementCouldBeVScrolled = function (node) { return elementCanBeScrolled(node, 'overflowY'); };
var elementCouldBeHScrolled = function (node) { return elementCanBeScrolled(node, 'overflowX'); };
var locationCouldBeScrolled = function (axis, node) {
var current = node;
do {
// Skip over shadow root
if (typeof ShadowRoot !== 'undefined' && current instanceof ShadowRoot) {
current = current.host;
}
var isScrollable = elementCouldBeScrolled(axis, current);
if (isScrollable) {
var _a = getScrollVariables(axis, current), s = _a[1], d = _a[2];
if (s > d) {
return true;
}
}
current = current.parentNode;
} while (current && current !== document.body);
return false;
};
exports.locationCouldBeScrolled = locationCouldBeScrolled;
var getVScrollVariables = function (_a) {
var scrollTop = _a.scrollTop, scrollHeight = _a.scrollHeight, clientHeight = _a.clientHeight;
return [
scrollTop,
scrollHeight,
clientHeight,
];
};
var getHScrollVariables = function (_a) {
var scrollLeft = _a.scrollLeft, scrollWidth = _a.scrollWidth, clientWidth = _a.clientWidth;
return [
scrollLeft,
scrollWidth,
clientWidth,
];
};
var elementCouldBeScrolled = function (axis, node) {
return axis === 'v' ? elementCouldBeVScrolled(node) : elementCouldBeHScrolled(node);
};
var getScrollVariables = function (axis, node) {
return axis === 'v' ? getVScrollVariables(node) : getHScrollVariables(node);
};
var getDirectionFactor = function (axis, direction) {
/**
* If the element's direction is rtl (right-to-left), then scrollLeft is 0 when the scrollbar is at its rightmost position,
* and then increasingly negative as you scroll towards the end of the content.
* @see https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollLeft
*/
return axis === 'h' && direction === 'rtl' ? -1 : 1;
};
var handleScroll = function (axis, endTarget, event, sourceDelta, noOverscroll) {
var directionFactor = getDirectionFactor(axis, window.getComputedStyle(endTarget).direction);
var delta = directionFactor * sourceDelta;
// find scrollable target
var target = event.target;
var targetInLock = endTarget.contains(target);
var shouldCancelScroll = false;
var isDeltaPositive = delta > 0;
var availableScroll = 0;
var availableScrollTop = 0;
do {
var _a = getScrollVariables(axis, target), position = _a[0], scroll_1 = _a[1], capacity = _a[2];
var elementScroll = scroll_1 - capacity - directionFactor * position;
if (position || elementScroll) {
if (elementCouldBeScrolled(axis, target)) {
availableScroll += elementScroll;
availableScrollTop += position;
}
}
target = target.parentNode;
} while (
// portaled content
(!targetInLock && target !== document.body) ||
// self content
(targetInLock && (endTarget.contains(target) || endTarget === target)));
if (isDeltaPositive && ((noOverscroll && availableScroll === 0) || (!noOverscroll && delta > availableScroll))) {
shouldCancelScroll = true;
}
else if (!isDeltaPositive &&
((noOverscroll && availableScrollTop === 0) || (!noOverscroll && -delta > availableScrollTop))) {
shouldCancelScroll = true;
}
return shouldCancelScroll;
};
exports.handleScroll = handleScroll;

View File

@@ -0,0 +1,2 @@
import RemoveScroll from './Combination';
export { RemoveScroll };

View File

@@ -0,0 +1,6 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.RemoveScroll = void 0;
var tslib_1 = require("tslib");
var Combination_1 = tslib_1.__importDefault(require("./Combination"));
exports.RemoveScroll = Combination_1.default;

View File

@@ -0,0 +1,2 @@
import { IRemoveScrollEffectProps } from './types';
export declare const effectCar: Readonly<import("use-sidecar/dist/es5/types").SideCarMedium<IRemoveScrollEffectProps>>;

View File

@@ -0,0 +1,5 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.effectCar = void 0;
var use_sidecar_1 = require("use-sidecar");
exports.effectCar = (0, use_sidecar_1.createSidecarMedium)();

View File

@@ -0,0 +1,8 @@
import { Touch } from 'react';
export declare const pinchOrZoom: (event: TouchEvent, cache: Record<number, Touch>) => false | {
action: string;
coords?: undefined;
} | {
action: string;
coords: number[];
};

View File

@@ -0,0 +1,37 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.pinchOrZoom = void 0;
var ds = function (ab) { return (ab[0] <= 0 && ab[1] >= 0) || (ab[0] >= 0 && ab[1] <= 0); };
var sign = function (x) { return (x < 0 ? -1 : 1); };
var pinchOrZoom = function (event, cache) {
if (!event.changedTouches) {
return false;
}
if (event.touches.length === 2) {
var oldPoints = [cache[event.touches[0].identifier], cache[event.touches[1].identifier]];
var newPoints = [event.touches[0], event.touches[1]];
if (oldPoints[0] && oldPoints[1]) {
// Calculate the difference between the start and move coordinates
var diffx = [oldPoints[0].clientX - newPoints[0].clientX, oldPoints[1].clientX - newPoints[1].clientX];
var diffy = [oldPoints[0].clientY - newPoints[0].clientY, oldPoints[1].clientY - newPoints[1].clientY];
console.log(diffx, diffy);
if (ds(diffx) || ds(diffy)) {
return {
action: 'zoom',
};
}
var mx = Math.max(Math.abs(diffx[0]), Math.abs(diffx[1]));
var my = Math.max(Math.abs(diffy[0]), Math.abs(diffy[1]));
return {
action: 'pinch',
coords: [mx * sign(diffx[0]), my * sign(diffx[1])],
};
}
}
Array.from(event.changedTouches).forEach(function (touch) { return (cache[touch.identifier] = touch); });
return {
action: 'move',
coords: [event.changedTouches[0].clientX, event.changedTouches[0].clientY],
};
};
exports.pinchOrZoom = pinchOrZoom;

View File

@@ -0,0 +1,2 @@
declare const _default: import("use-sidecar").SideCarComponent<import("./types").IRemoveScrollEffectProps>;
export default _default;

View File

@@ -0,0 +1,6 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var use_sidecar_1 = require("use-sidecar");
var SideEffect_1 = require("./SideEffect");
var medium_1 = require("./medium");
exports.default = (0, use_sidecar_1.exportSidecar)(medium_1.effectCar, SideEffect_1.RemoveScrollSideCar);

View File

@@ -0,0 +1,90 @@
import * as React from 'react';
import { Ref, RefObject } from 'react';
import { ForwardRefExoticComponent } from 'react';
import { RefAttributes } from 'react';
export declare type Axis = 'v' | 'h';
export interface RemoveScrollEffectCallbacks {
onScrollCapture(event: any): void;
onWheelCapture(event: any): void;
onTouchMoveCapture(event: any): void;
}
export interface ChildrenNode {
/**
* if forwardProps is false - children should be ReactNode
* and it would be wrapper with a div
* @see {@link IRemoveScrollSelfProps.as}
*/
forwardProps?: false;
children: React.ReactNode;
}
export interface ChildrenForward {
/**
* if forwardProps is true - children should be single Element
* which would NOT with a div
* @see {@link IRemoveScrollSelfProps.as}
*/
forwardProps: true;
children: React.ReactElement;
}
export interface IRemoveScrollSelfProps {
ref?: Ref<HTMLElement>;
/**
* disables "event isolation" (suppressing of events happening outside of the Lock)
* @default false
*/
noIsolation?: boolean;
/**
* enabled complete Lock isolation using `pointer-events:none` for anything outside the Lock
* you probably don't need it, except you do
* @default false
* @see {IRemoveScrollSelfProps.noIsolation}
*/
inert?: boolean;
/**
* allows pinch-zoom, however might work not perfectly for normal scroll
*/
allowPinchZoom?: boolean;
/**
* switches on/off the behavior of the component
*/
enabled?: boolean;
/**
* Controls the body scroll bar removal
* @default false
*/
removeScrollBar?: boolean;
className?: string;
style?: React.CSSProperties;
/**
* array of refs to other Elements, which should be considered as a part of the Lock
*/
shards?: Array<React.RefObject<any> | HTMLElement>;
/**
* Control host node used for the lock.
* @default 'div'
*/
as?: string | React.ElementType;
}
export declare type IRemoveScrollProps = IRemoveScrollSelfProps & (ChildrenForward | ChildrenNode);
export declare type IRemoveScrollUIProps = IRemoveScrollProps & {
sideCar: React.FC<any>;
};
export interface IRemoveScrollEffectProps {
noIsolation?: boolean;
removeScrollBar?: boolean;
allowPinchZoom: boolean;
inert?: boolean;
shards?: Array<React.RefObject<any> | HTMLElement>;
lockRef: RefObject<HTMLElement>;
setCallbacks(cb: RemoveScrollEffectCallbacks): void;
}
interface WithClassNames {
classNames: {
fullWidth: string;
zeroRight: string;
};
}
declare type RefForwarded<T> = ForwardRefExoticComponent<T & RefAttributes<HTMLElement>> & WithClassNames;
export declare type RemoveScrollType = RefForwarded<IRemoveScrollProps>;
export declare type RemoveScrollUIType = RefForwarded<IRemoveScrollUIProps>;
export {};

View File

@@ -0,0 +1,2 @@
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });

View File

@@ -0,0 +1,96 @@
{
"name": "react-remove-scroll",
"version": "2.5.5",
"description": "Disables scroll outside of `children` node.",
"main": "dist/es5/index.js",
"jsnext:main": "dist/es2015/index.js",
"module": "dist/es2015/index.js",
"types": "dist/es5/index.d.ts",
"module:es2019": "dist/es2019/index.js",
"scripts": {
"dev": "lib-builder dev",
"test": "jest",
"test:ci": "jest --runInBand --coverage",
"build": "lib-builder build && yarn size:report",
"release": "yarn build && yarn test",
"size": "npx size-limit",
"size:report": "npx size-limit --json > .size.json",
"lint": "lib-builder lint",
"format": "lib-builder format",
"update": "lib-builder update",
"prepublish": "yarn build && yarn changelog",
"changelog": "conventional-changelog -p angular -i CHANGELOG.md -s",
"changelog:rewrite": "conventional-changelog -p angular -i CHANGELOG.md -s -r 0",
"storybook": "start-storybook -p 6006"
},
"keywords": [
"scroll"
],
"author": "Anton Korzunov <thekashey@gmail.com>",
"license": "MIT",
"devDependencies": {
"@types/react": "^18.0.0",
"@babel/core": "^7.17.9",
"@size-limit/preset-small-lib": "^2.1.6",
"@storybook/react": "^6.4.22",
"@theuiteam/lib-builder": "^0.1.4",
"@types/enzyme-adapter-react-16": "^1.0.6",
"babel-loader": "^8.2.4",
"enzyme-adapter-react-16": "^1.15.6"
},
"resolutions": {
"@types/react": "^18.0.0",
"tslib": "^2.1.0"
},
"engines": {
"node": ">=10"
},
"peerDependencies": {
"@types/react": "^16.8.0 || ^17.0.0 || ^18.0.0",
"react": "^16.8.0 || ^17.0.0 || ^18.0.0"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
}
},
"files": [
"dist",
"UI",
"sidecar"
],
"repository": "https://github.com/theKashey/react-remove-scroll",
"dependencies": {
"react-remove-scroll-bar": "^2.3.3",
"react-style-singleton": "^2.2.1",
"tslib": "^2.1.0",
"use-callback-ref": "^1.3.0",
"use-sidecar": "^1.1.2"
},
"sideEffects": [
"**/sidecar.js"
],
"husky": {
"hooks": {
"pre-commit": "lint-staged"
}
},
"lint-staged": {
"*.{ts,tsx}": [
"prettier --write",
"eslint --fix",
"git add"
],
"*.{js,css,json,md}": [
"prettier --write",
"git add"
]
},
"prettier": {
"printWidth": 120,
"trailingComma": "es5",
"tabWidth": 2,
"semi": true,
"singleQuote": true
}
}

View File

@@ -0,0 +1,7 @@
{
"private": true,
"main": "../dist/es5/sidecar.js",
"jsnext:main": "../dist/es2015/sidecar.js",
"module": "../dist/es2015/sidecar.js",
"types": "sidecar.d.ts"
}

View File

@@ -0,0 +1,5 @@
import * as React from 'react';
declare let sidecar: React.FC;
export default sidecar;

73
server/node_modules/@radix-ui/react-menu/package.json generated vendored Normal file
View File

@@ -0,0 +1,73 @@
{
"name": "@radix-ui/react-menu",
"version": "2.0.6",
"license": "MIT",
"exports": {
".": {
"import": {
"types": "./dist/index.d.mts",
"default": "./dist/index.mjs"
},
"require": {
"types": "./dist/index.d.ts",
"default": "./dist/index.js"
}
}
},
"source": "./src/index.ts",
"main": "./dist/index.js",
"module": "./dist/index.mjs",
"types": "./dist/index.d.ts",
"files": [
"dist",
"README.md"
],
"sideEffects": false,
"scripts": {
"clean": "rm -rf dist",
"version": "yarn version"
},
"dependencies": {
"@babel/runtime": "^7.13.10",
"@radix-ui/primitive": "1.0.1",
"@radix-ui/react-collection": "1.0.3",
"@radix-ui/react-compose-refs": "1.0.1",
"@radix-ui/react-context": "1.0.1",
"@radix-ui/react-direction": "1.0.1",
"@radix-ui/react-dismissable-layer": "1.0.5",
"@radix-ui/react-focus-guards": "1.0.1",
"@radix-ui/react-focus-scope": "1.0.4",
"@radix-ui/react-id": "1.0.1",
"@radix-ui/react-popper": "1.1.3",
"@radix-ui/react-portal": "1.0.4",
"@radix-ui/react-presence": "1.0.1",
"@radix-ui/react-primitive": "1.0.3",
"@radix-ui/react-roving-focus": "1.0.4",
"@radix-ui/react-slot": "1.0.2",
"@radix-ui/react-use-callback-ref": "1.0.1",
"aria-hidden": "^1.1.1",
"react-remove-scroll": "2.5.5"
},
"peerDependencies": {
"@types/react": "*",
"@types/react-dom": "*",
"react": "^16.8 || ^17.0 || ^18.0",
"react-dom": "^16.8 || ^17.0 || ^18.0"
},
"peerDependenciesMeta": {
"@types/react": {
"optional": true
},
"@types/react-dom": {
"optional": true
}
},
"homepage": "https://radix-ui.com/primitives",
"repository": {
"type": "git",
"url": "git+https://github.com/radix-ui/primitives.git"
},
"bugs": {
"url": "https://github.com/radix-ui/primitives/issues"
}
}