@react-hive/honey-layout 5.2.0-beta → 5.6.0-beta
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/__mocks__/index.d.ts +1 -0
- package/dist/__mocks__/theme-mock.d.ts +2 -0
- package/dist/components/HoneyBox/HoneyBox.d.ts +8 -0
- package/dist/components/HoneyBox/index.d.ts +1 -0
- package/dist/components/HoneyContextMenu/HoneyContextMenu.d.ts +3 -2
- package/dist/components/HoneyContextMenu/HoneyContextMenu.types.d.ts +1 -1
- package/dist/components/HoneyContextMenu/HoneyContextMenuContent.d.ts +3 -2
- package/dist/components/HoneyContextMenu/HoneyContextMenuContentOption.d.ts +2 -3
- package/dist/components/HoneyFlexBox.d.ts +3 -2
- package/dist/components/HoneyGrid/HoneyGrid.d.ts +1 -4
- package/dist/components/HoneyGrid/HoneyGridStyled.d.ts +2 -3
- package/dist/components/HoneyGridColumn/HoneyGridColumn.d.ts +2 -2
- package/dist/components/HoneyGridColumn/HoneyGridColumn.types.d.ts +2 -1
- package/dist/components/HoneyGridColumn/HoneyGridColumnStyled.d.ts +4 -4
- package/dist/components/HoneyLazyContent/index.d.ts +1 -0
- package/dist/components/HoneyList/HoneyList.d.ts +3 -8
- package/dist/components/HoneyList/HoneyListStyled.d.ts +3 -1
- package/dist/components/HoneyOverlay.d.ts +21 -9
- package/dist/components/HoneyPopup/HoneyPopup.d.ts +4 -9
- package/dist/components/HoneyPopup/HoneyPopupStyled.d.ts +2 -4
- package/dist/components/HoneyPopup/hooks/use-honey-popup-interactions.d.ts +2 -1
- package/dist/components/HoneyPopup/hooks/use-honey-popup.d.ts +40 -6
- package/dist/components/index.d.ts +0 -1
- package/dist/constants.d.ts +2 -2
- package/dist/contexts/HoneyLayoutContext.d.ts +4 -4
- package/dist/helpers/helpers.d.ts +37 -25
- package/dist/hooks/index.d.ts +1 -2
- package/dist/hooks/use-honey-document-key-up-handler.d.ts +30 -9
- package/dist/hooks/use-honey-drag.d.ts +36 -18
- package/dist/hooks/use-honey-layout.d.ts +2 -3
- package/dist/hooks/use-honey-on-change.d.ts +27 -0
- package/dist/hooks/use-honey-overlay.d.ts +10 -5
- package/dist/index.js +2251 -2273
- package/dist/providers/HoneyLayoutProvider.d.ts +2 -2
- package/dist/types/css.types.d.ts +140 -31
- package/dist/types/dom.types.d.ts +6 -2
- package/dist/{utils.d.ts → utils/data-utils.d.ts} +1 -80
- package/dist/utils/index.d.ts +2 -0
- package/dist/utils/utils.d.ts +80 -0
- package/package.json +19 -15
- package/dist/components/HoneyBox.d.ts +0 -10
- package/dist/components/HoneyLoopingList/HoneyLoopingList.d.ts +0 -12
- package/dist/components/HoneyLoopingList/index.d.ts +0 -1
- package/dist/hooks/use-honey-infinite-scroll.d.ts +0 -6
- package/dist/hooks/use-honey-synthetic-scrollable-container.d.ts +0 -21
- /package/dist/components/{HoneyLazyContent.d.ts → HoneyLazyContent/HoneyLazyContent.d.ts} +0 -0
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './theme-mock';
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { DataAttributes } from 'styled-components';
|
|
2
|
+
import { ComponentPropsWithRef, ElementType } from 'react';
|
|
3
|
+
import { HoneyPrefixedCSSProperties, HoneyEffectResultFn } from '../../types';
|
|
4
|
+
export type HoneyBoxProps<Element extends ElementType = 'div'> = DataAttributes & ComponentPropsWithRef<Element> & HoneyPrefixedCSSProperties & {
|
|
5
|
+
as?: Element;
|
|
6
|
+
effects?: HoneyEffectResultFn<object>[];
|
|
7
|
+
};
|
|
8
|
+
export declare const HoneyBox: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('styled-components/dist/types').Substitute<import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, HoneyBoxProps<"div">>, never>> & string;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './HoneyBox';
|
|
@@ -2,7 +2,8 @@ import { ReactNode } from 'react';
|
|
|
2
2
|
import { HoneyPopupProps, HoneyPopupChildrenContextProps } from '../HoneyPopup';
|
|
3
3
|
import { HoneyContextMenuOption } from './HoneyContextMenu.types';
|
|
4
4
|
import { HoneyContextMenuContentProps } from './HoneyContextMenuContent';
|
|
5
|
-
export interface HoneyContextMenuProps<Option extends HoneyContextMenuOption<Context>, Context = undefined> extends
|
|
5
|
+
export interface HoneyContextMenuProps<Option extends HoneyContextMenuOption<Context>, Context = undefined, UseAutoSize extends boolean = boolean> extends Omit<HoneyPopupProps<Context, UseAutoSize>, 'content'>, Pick<HoneyContextMenuContentProps<Option, Context>, 'options' | 'optionProps'> {
|
|
6
6
|
children: (context: HoneyPopupChildrenContextProps) => ReactNode;
|
|
7
|
+
subProps?: Omit<HoneyContextMenuContentProps<Option, Context>, 'options' | 'optionProps'>;
|
|
7
8
|
}
|
|
8
|
-
export declare const HoneyContextMenu: <Option extends HoneyContextMenuOption<Context>, Context = undefined>({ children, options, optionProps, context, }: HoneyContextMenuProps<Option, Context>) => import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export declare const HoneyContextMenu: <Option extends HoneyContextMenuOption<Context>, Context = undefined, UseAutoSize extends boolean = boolean>({ children, subProps, options, optionProps, clickOptions, context, ...popupProps }: HoneyContextMenuProps<Option, Context, UseAutoSize>) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -5,7 +5,7 @@ export interface HoneyContextMenuOption<Context = undefined> {
|
|
|
5
5
|
id: string;
|
|
6
6
|
label: string;
|
|
7
7
|
options?: HoneyContextMenuOption<Context>[];
|
|
8
|
-
|
|
8
|
+
visible?: boolean | ((executionContext: HoneyContextMenuOptionExecutionContext<Context>) => boolean);
|
|
9
9
|
onClick?: (executionContext: HoneyContextMenuOptionExecutionContext<Context>) => void;
|
|
10
10
|
}
|
|
11
11
|
export {};
|
|
@@ -1,7 +1,8 @@
|
|
|
1
|
+
import { HoneyPopupProps } from '../HoneyPopup';
|
|
1
2
|
import { HoneyContextMenuOption } from './HoneyContextMenu.types';
|
|
2
3
|
import { HoneyContextMenuContentOptionProps } from './HoneyContextMenuContentOption';
|
|
3
|
-
export interface HoneyContextMenuContentProps<Option extends HoneyContextMenuOption<Context>, Context> {
|
|
4
|
+
export interface HoneyContextMenuContentProps<Option extends HoneyContextMenuOption<Context>, Context> extends Omit<HoneyPopupProps<Context>, 'children' | 'context' | 'content'> {
|
|
4
5
|
options: Option[] | undefined;
|
|
5
6
|
optionProps?: Omit<HoneyContextMenuContentOptionProps<Option, Context>, 'option'>;
|
|
6
7
|
}
|
|
7
|
-
export declare const HoneyContextMenuContent: <Option extends HoneyContextMenuOption<Context>, Context = undefined>({ options, optionProps, }: HoneyContextMenuContentProps<Option, Context>) => import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
export declare const HoneyContextMenuContent: <Option extends HoneyContextMenuOption<Context>, Context = undefined>({ options, optionProps, floatingOptions, ...popupProps }: HoneyContextMenuContentProps<Option, Context>) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,7 +1,6 @@
|
|
|
1
|
-
import { HTMLAttributes } from 'react';
|
|
2
1
|
import { HoneyBoxProps } from '../HoneyBox';
|
|
3
2
|
import { HoneyContextMenuOption } from './HoneyContextMenu.types';
|
|
4
|
-
export interface HoneyContextMenuContentOptionProps<Option extends HoneyContextMenuOption<Context>, Context> extends
|
|
3
|
+
export interface HoneyContextMenuContentOptionProps<Option extends HoneyContextMenuOption<Context>, Context> extends HoneyBoxProps {
|
|
5
4
|
option: Option;
|
|
6
5
|
}
|
|
7
|
-
export declare const HoneyContextMenuContentOption: <Option extends HoneyContextMenuOption<Context>, Context
|
|
6
|
+
export declare const HoneyContextMenuContentOption: <Option extends HoneyContextMenuOption<Context>, Context>({ option, ...props }: HoneyContextMenuContentOptionProps<Option, Context>) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { ElementType } from 'react';
|
|
1
2
|
import { HoneyBoxProps } from './HoneyBox';
|
|
2
|
-
export type HoneyFlexBoxProps = HoneyBoxProps
|
|
3
|
-
export declare const HoneyFlexBox: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('styled-components').FastOmit<import('styled-components/dist/types').Substitute<import('styled-components').
|
|
3
|
+
export type HoneyFlexBoxProps<Element extends ElementType = 'div'> = HoneyBoxProps<Element>;
|
|
4
|
+
export declare const HoneyFlexBox: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('styled-components/dist/types').Substitute<import('styled-components/dist/types').Substitute<import('styled-components').FastOmit<import('styled-components/dist/types').Substitute<import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, HoneyBoxProps<"div">>, never>, import('styled-components').FastOmit<import('styled-components/dist/types').Substitute<import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, HoneyBoxProps<"div">>, never>>, HoneyFlexBoxProps<"div">>, never>> & string;
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import { default as React } from 'react';
|
|
2
1
|
import { HoneyGridStyledProps } from './HoneyGridStyled';
|
|
3
2
|
import { HoneyGridColumnStyledProps } from '../HoneyGridColumn';
|
|
4
3
|
export interface HoneyGridProps extends HoneyGridStyledProps {
|
|
@@ -20,6 +19,4 @@ export interface HoneyGridProps extends HoneyGridStyledProps {
|
|
|
20
19
|
*/
|
|
21
20
|
applyColumnMaxWidth?: HoneyGridColumnStyledProps['applyMaxWidth'];
|
|
22
21
|
}
|
|
23
|
-
export declare const HoneyGrid:
|
|
24
|
-
children?: React.ReactNode | undefined;
|
|
25
|
-
} & React.RefAttributes<HTMLDivElement>>;
|
|
22
|
+
export declare const HoneyGrid: ({ ref, children, columns, spacing, isColumnGrowing, applyColumnMaxWidth, ...props }: HoneyGridProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,7 +1,6 @@
|
|
|
1
|
-
import { HTMLAttributes } from 'react';
|
|
2
1
|
import { HoneyBoxProps } from '../HoneyBox';
|
|
3
2
|
import * as CSS from 'csstype';
|
|
4
|
-
export interface HoneyGridStyledProps extends
|
|
3
|
+
export interface HoneyGridStyledProps extends Omit<HoneyBoxProps, '$gap'> {
|
|
5
4
|
/**
|
|
6
5
|
* The height of each grid column.
|
|
7
6
|
*/
|
|
@@ -17,4 +16,4 @@ export interface HoneyGridStyledProps extends HTMLAttributes<HTMLDivElement>, Om
|
|
|
17
16
|
*/
|
|
18
17
|
spacing?: number;
|
|
19
18
|
}
|
|
20
|
-
export declare const HoneyGridStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('styled-components').FastOmit<import('styled-components/dist/types').Substitute<import('styled-components').
|
|
19
|
+
export declare const HoneyGridStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('styled-components/dist/types').Substitute<import('styled-components/dist/types').Substitute<import('styled-components').FastOmit<import('styled-components/dist/types').Substitute<import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, HoneyBoxProps<"div">>, never>, import('styled-components').FastOmit<import('styled-components/dist/types').Substitute<import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, HoneyBoxProps<"div">>, never>>, HoneyGridStyledProps>, never>> & string;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { ElementType } from 'react';
|
|
2
2
|
import { HoneyGridColumnProps } from './HoneyGridColumn.types';
|
|
3
|
-
export declare const HoneyGridColumn: ({ children, ...props }:
|
|
3
|
+
export declare const HoneyGridColumn: <Element extends ElementType = "div">({ children, ...props }: Omit<HoneyGridColumnProps<Element>, "$flexGrow">) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,2 +1,3 @@
|
|
|
1
|
+
import { ElementType } from 'react';
|
|
1
2
|
import { HoneyGridColumnStyledProps } from './HoneyGridColumnStyled';
|
|
2
|
-
export type HoneyGridColumnProps = Omit<HoneyGridColumnStyledProps
|
|
3
|
+
export type HoneyGridColumnProps<Element extends ElementType = 'div'> = Omit<HoneyGridColumnStyledProps<Element>, 'columns' | 'spacing' | 'totalColumns' | 'totalTakeColumns' | 'applyMaxWidth'>;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { ElementType } from 'react';
|
|
2
2
|
import { HoneyBreakpointName } from '../../types';
|
|
3
3
|
import { HoneyBoxProps } from '../HoneyBox';
|
|
4
|
-
export
|
|
4
|
+
export type HoneyGridColumnStyledProps<Element extends ElementType = 'div'> = HoneyBoxProps<Element> & {
|
|
5
5
|
/**
|
|
6
6
|
* Total number of columns in the grid.
|
|
7
7
|
*/
|
|
@@ -23,10 +23,10 @@ export interface HoneyGridColumnStyledProps extends HTMLAttributes<HTMLDivElemen
|
|
|
23
23
|
* Can be a breakpoint name.
|
|
24
24
|
*/
|
|
25
25
|
applyMaxWidth?: HoneyBreakpointName | false;
|
|
26
|
-
}
|
|
26
|
+
};
|
|
27
27
|
/**
|
|
28
28
|
* This styled component defines the layout and styling for individual columns in a grid layout.
|
|
29
29
|
* It provides flexibility in specifying the number of columns to take, the total number of columns in the grid,
|
|
30
30
|
* and the spacing between columns.
|
|
31
31
|
*/
|
|
32
|
-
export declare const HoneyGridColumnStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('styled-components').FastOmit<import('styled-components').
|
|
32
|
+
export declare const HoneyGridColumnStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('styled-components').FastOmit<import('styled-components/dist/types').Substitute<import('styled-components/dist/types').Substitute<import('styled-components').FastOmit<import('styled-components/dist/types').Substitute<import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, HoneyBoxProps<"div">>, never>, import('styled-components').FastOmit<import('styled-components/dist/types').Substitute<import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, HoneyBoxProps<"div">>, never>>, import('../HoneyFlexBox').HoneyFlexBoxProps<"div">>, never>, HoneyGridColumnStyledProps<"div">>> & string;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './HoneyLazyContent';
|
|
@@ -1,9 +1,7 @@
|
|
|
1
|
-
import { default as React, HTMLAttributes, RefAttributes } from 'react';
|
|
2
1
|
import { HoneyListGenericProps, HoneyListItem } from './HoneyList.types';
|
|
3
|
-
import { HoneyBoxProps } from '../HoneyBox';
|
|
4
2
|
import { HoneyStatusContentProps } from '../HoneyStatusContent';
|
|
5
|
-
|
|
6
|
-
|
|
3
|
+
import { HoneyListStyledProps } from './HoneyListStyled';
|
|
4
|
+
export type HoneyListProps<Item extends HoneyListItem> = Omit<HoneyListStyledProps, 'children'> & HoneyListGenericProps<Item> & Omit<HoneyStatusContentProps, 'isNoContent'>;
|
|
7
5
|
/**
|
|
8
6
|
* A generic and reusable list component that handles different states such as loading, error, or no content,
|
|
9
7
|
* and dynamically renders a list of items with custom content for each item.
|
|
@@ -14,8 +12,5 @@ export interface HoneyListProps<Item extends HoneyListItem> extends Omit<HTMLAtt
|
|
|
14
12
|
*
|
|
15
13
|
* @template Item - Represents the type of the items to be rendered in the list. This allows the component
|
|
16
14
|
* to be used with any item type.
|
|
17
|
-
*
|
|
18
|
-
* @template Element - Represents the type of the HTML element (e.g., `HTMLDivElement`, `HTMLUListElement`)
|
|
19
|
-
* that will receive the forwarded ref. This allows precise typing for the element.
|
|
20
15
|
*/
|
|
21
|
-
export declare const HoneyList: <Item extends HoneyListItem,
|
|
16
|
+
export declare const HoneyList: <Item extends HoneyListItem>({ ref, children, items, itemKey, isLoading, isLoadingOverContent, loadingContent, isError, errorContent, noContent, ...props }: HoneyListProps<Item>) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1 +1,3 @@
|
|
|
1
|
-
|
|
1
|
+
import { HoneyFlexBoxProps } from '../HoneyFlexBox';
|
|
2
|
+
export type HoneyListStyledProps = HoneyFlexBoxProps;
|
|
3
|
+
export declare const HoneyListStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('styled-components/dist/types').Substitute<import('styled-components/dist/types').Substitute<import('styled-components').FastOmit<import('styled-components/dist/types').Substitute<import('styled-components/dist/types').Substitute<import('styled-components').FastOmit<import('styled-components/dist/types').Substitute<import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, import('..').HoneyBoxProps<"div">>, never>, import('styled-components').FastOmit<import('styled-components/dist/types').Substitute<import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, import('..').HoneyBoxProps<"div">>, never>>, HoneyFlexBoxProps<"div">>, never>, import('styled-components').FastOmit<import('styled-components/dist/types').Substitute<import('styled-components/dist/types').Substitute<import('styled-components').FastOmit<import('styled-components/dist/types').Substitute<import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, import('..').HoneyBoxProps<"div">>, never>, import('styled-components').FastOmit<import('styled-components/dist/types').Substitute<import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, import('..').HoneyBoxProps<"div">>, never>>, HoneyFlexBoxProps<"div">>, never>>, HoneyListStyledProps>, never>> & string;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
2
|
import { HoneyActiveOverlay, HoneyOverlayId, Nullable } from '../types';
|
|
3
3
|
import { HoneyFlexBoxProps } from './HoneyFlexBox';
|
|
4
4
|
export interface HoneyOverlayContext {
|
|
@@ -11,7 +11,7 @@ export interface HoneyOverlayContext {
|
|
|
11
11
|
*/
|
|
12
12
|
deactivateOverlay: () => void;
|
|
13
13
|
}
|
|
14
|
-
export interface HoneyOverlayProps extends Omit<
|
|
14
|
+
export interface HoneyOverlayProps extends Omit<HoneyFlexBoxProps, 'children'> {
|
|
15
15
|
/**
|
|
16
16
|
* The content of the overlay, either as static nodes or a function that receives the object
|
|
17
17
|
* with the current overlay state and helper methods.
|
|
@@ -32,13 +32,25 @@ export interface HoneyOverlayProps extends Omit<HTMLAttributes<HTMLDivElement>,
|
|
|
32
32
|
onDeactivate: () => void;
|
|
33
33
|
}
|
|
34
34
|
/**
|
|
35
|
-
* A reusable overlay component
|
|
35
|
+
* A reusable overlay component integrated with the `HoneyLayoutProvider` system.
|
|
36
36
|
*
|
|
37
|
-
*
|
|
38
|
-
* - Automatically register/deregister the overlay.
|
|
39
|
-
* - Handle keyboard events, such as closing the overlay with the "Escape" key.
|
|
40
|
-
* - Provide a context to dynamically manage overlay content and state.
|
|
37
|
+
* Automatically registers/unregisters itself with the layout system and handles key events.
|
|
41
38
|
*
|
|
42
|
-
* @param props -
|
|
39
|
+
* @param props - Component configuration.
|
|
40
|
+
*
|
|
41
|
+
* @example
|
|
42
|
+
* ```tsx
|
|
43
|
+
* <HoneyOverlay
|
|
44
|
+
* active={isOpen}
|
|
45
|
+
* onDeactivate={() => setIsOpen(false)}
|
|
46
|
+
* >
|
|
47
|
+
* {({ deactivateOverlay }) => (
|
|
48
|
+
* <div>
|
|
49
|
+
* <h2>Settings</h2>
|
|
50
|
+
* <button onClick={deactivateOverlay}>Close</button>
|
|
51
|
+
* </div>
|
|
52
|
+
* )}
|
|
53
|
+
* </HoneyOverlay>
|
|
54
|
+
* ```
|
|
43
55
|
*/
|
|
44
|
-
export declare const HoneyOverlay:
|
|
56
|
+
export declare const HoneyOverlay: ({ ref, children, active, overlayId, onDeactivate, ...props }: HoneyOverlayProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -9,8 +9,9 @@ export interface HoneyPopupChildrenContextProps {
|
|
|
9
9
|
referenceProps: ReturnType<UseInteractionsReturn['getReferenceProps']>;
|
|
10
10
|
}
|
|
11
11
|
type InheritedHoneyOverlayProps = Omit<HoneyOverlayProps, 'children' | 'active' | 'onDeactivate'>;
|
|
12
|
-
export interface HoneyPopupProps<Context = undefined
|
|
12
|
+
export interface HoneyPopupProps<Context = undefined, UseAutoSize extends boolean = boolean> extends UseHoneyPopupOptions<UseAutoSize> {
|
|
13
13
|
children: (context: HoneyPopupChildrenContextProps) => ReactNode;
|
|
14
|
+
referenceProps?: Omit<HoneyPopupStyledProps, 'children' | 'content'>;
|
|
14
15
|
/**
|
|
15
16
|
* Content inside the popup.
|
|
16
17
|
*/
|
|
@@ -18,19 +19,13 @@ export interface HoneyPopupProps<Context = undefined> extends Omit<HoneyPopupSty
|
|
|
18
19
|
/**
|
|
19
20
|
* Additional props for the floating content.
|
|
20
21
|
*/
|
|
21
|
-
contentProps?: InheritedHoneyOverlayProps;
|
|
22
|
+
contentProps?: UseAutoSize extends true ? Omit<InheritedHoneyOverlayProps, '$minWidth' | '$minHeight' | '$maxWidth' | '$maxHeight'> : InheritedHoneyOverlayProps;
|
|
22
23
|
/**
|
|
23
24
|
* Props for managing focus inside the popup.
|
|
24
25
|
*
|
|
25
26
|
* @see https://floating-ui.com/docs/floatingfocusmanager#props
|
|
26
27
|
*/
|
|
27
28
|
focusManagerProps?: Omit<FloatingFocusManagerProps, 'children' | 'context'>;
|
|
28
|
-
/**
|
|
29
|
-
* Whether to show an arrow indicator.
|
|
30
|
-
*
|
|
31
|
-
* @default false
|
|
32
|
-
*/
|
|
33
|
-
showArrow?: boolean;
|
|
34
29
|
/**
|
|
35
30
|
* Properties for an arrow component.
|
|
36
31
|
*
|
|
@@ -57,5 +52,5 @@ export interface HoneyPopupProps<Context = undefined> extends Omit<HoneyPopupSty
|
|
|
57
52
|
*
|
|
58
53
|
* @template Context - Optional context type.
|
|
59
54
|
*/
|
|
60
|
-
export declare const HoneyPopup: <Context = undefined
|
|
55
|
+
export declare const HoneyPopup: <Context = undefined, UseAutoSize extends boolean = boolean>({ children, referenceProps, content, contentProps, focusManagerProps, arrowProps, portalProps, adjustStyles, context, ...popupOptions }: HoneyPopupProps<Context, UseAutoSize>) => import("react/jsx-runtime").JSX.Element;
|
|
61
56
|
export {};
|
|
@@ -1,5 +1,3 @@
|
|
|
1
|
-
import { HTMLAttributes } from 'react';
|
|
2
1
|
import { HoneyFlexBoxProps } from '../HoneyFlexBox';
|
|
3
|
-
export
|
|
4
|
-
|
|
5
|
-
export declare const HoneyPopupStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('styled-components').FastOmit<import('styled-components/dist/types').Substitute<import('styled-components').FastOmit<import('styled-components').FastOmit<import('styled-components/dist/types').Substitute<import('styled-components').FastOmit<import('react').DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof HTMLAttributes<HTMLDivElement> | keyof import('..').HoneyBoxProps> & HTMLAttributes<HTMLDivElement> & import('..').HoneyBoxProps, import('styled-components').FastOmit<import('react').DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof HTMLAttributes<HTMLDivElement> | keyof import('..').HoneyBoxProps> & HTMLAttributes<HTMLDivElement> & import('..').HoneyBoxProps>, never>, keyof import('..').HoneyBoxProps> & import('..').HoneyBoxProps, import('styled-components').FastOmit<import('styled-components').FastOmit<import('styled-components/dist/types').Substitute<import('styled-components').FastOmit<import('react').DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof HTMLAttributes<HTMLDivElement> | keyof import('..').HoneyBoxProps> & HTMLAttributes<HTMLDivElement> & import('..').HoneyBoxProps, import('styled-components').FastOmit<import('react').DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof HTMLAttributes<HTMLDivElement> | keyof import('..').HoneyBoxProps> & HTMLAttributes<HTMLDivElement> & import('..').HoneyBoxProps>, never>, keyof import('..').HoneyBoxProps> & import('..').HoneyBoxProps>, never>, HoneyPopupStyledProps>> & string;
|
|
2
|
+
export type HoneyPopupStyledProps = HoneyFlexBoxProps;
|
|
3
|
+
export declare const HoneyPopupStyled: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('styled-components/dist/types').Substitute<import('styled-components/dist/types').Substitute<import('styled-components').FastOmit<import('styled-components/dist/types').Substitute<import('styled-components/dist/types').Substitute<import('styled-components').FastOmit<import('styled-components/dist/types').Substitute<import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, import('..').HoneyBoxProps<"div">>, never>, import('styled-components').FastOmit<import('styled-components/dist/types').Substitute<import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, import('..').HoneyBoxProps<"div">>, never>>, HoneyFlexBoxProps<"div">>, never>, import('styled-components').FastOmit<import('styled-components/dist/types').Substitute<import('styled-components/dist/types').Substitute<import('styled-components').FastOmit<import('styled-components/dist/types').Substitute<import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, import('..').HoneyBoxProps<"div">>, never>, import('styled-components').FastOmit<import('styled-components/dist/types').Substitute<import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>>, import('..').HoneyBoxProps<"div">>, never>>, HoneyFlexBoxProps<"div">>, never>>, HoneyPopupStyledProps>, never>> & string;
|
|
@@ -18,7 +18,7 @@ export interface UseHoneyPopupInteractionsOptions {
|
|
|
18
18
|
*
|
|
19
19
|
* @see https://floating-ui.com/docs/usedismiss
|
|
20
20
|
*/
|
|
21
|
-
dismissOptions?: Omit<UseDismissProps, '
|
|
21
|
+
dismissOptions?: Omit<UseDismissProps, 'escapeKey'>;
|
|
22
22
|
/**
|
|
23
23
|
* Configuration for click interactions.
|
|
24
24
|
*
|
|
@@ -29,6 +29,7 @@ export interface UseHoneyPopupInteractionsOptions {
|
|
|
29
29
|
* Configuration for hover interactions.
|
|
30
30
|
*
|
|
31
31
|
* @prop restMs Default is 150.
|
|
32
|
+
* @prop handleClose Default is `safePolygon()`.
|
|
32
33
|
*
|
|
33
34
|
* @see https://floating-ui.com/docs/usehover
|
|
34
35
|
*/
|
|
@@ -2,12 +2,8 @@ import { useTransitionStyles, AutoUpdateOptions, ArrowOptions, FlipOptions, Offs
|
|
|
2
2
|
import { RefObject } from 'react';
|
|
3
3
|
import { Nullable } from '../../../types';
|
|
4
4
|
import { UseHoneyPopupInteractionsOptions } from './use-honey-popup-interactions';
|
|
5
|
-
export interface UseHoneyPopupOptions extends UseHoneyPopupInteractionsOptions {
|
|
5
|
+
export interface UseHoneyPopupOptions<UseAutoSize extends boolean = boolean> extends UseHoneyPopupInteractionsOptions {
|
|
6
6
|
open?: boolean;
|
|
7
|
-
/**
|
|
8
|
-
* Configuration for the floating arrow.
|
|
9
|
-
*/
|
|
10
|
-
arrowOptions?: Omit<ArrowOptions, 'element'>;
|
|
11
7
|
/**
|
|
12
8
|
* Options for configuring the floating UI behavior.
|
|
13
9
|
*/
|
|
@@ -31,6 +27,16 @@ export interface UseHoneyPopupOptions extends UseHoneyPopupInteractionsOptions {
|
|
|
31
27
|
* @see https://floating-ui.com/docs/shift
|
|
32
28
|
*/
|
|
33
29
|
shiftOptions?: ShiftOptions;
|
|
30
|
+
/**
|
|
31
|
+
* Whether to show an arrow indicator.
|
|
32
|
+
*
|
|
33
|
+
* @default false
|
|
34
|
+
*/
|
|
35
|
+
useArrow?: boolean;
|
|
36
|
+
/**
|
|
37
|
+
* Configuration for the floating arrow.
|
|
38
|
+
*/
|
|
39
|
+
arrowOptions?: Omit<ArrowOptions, 'element'>;
|
|
34
40
|
/**
|
|
35
41
|
* @prop duration Default is 250.
|
|
36
42
|
*
|
|
@@ -49,6 +55,34 @@ export interface UseHoneyPopupOptions extends UseHoneyPopupInteractionsOptions {
|
|
|
49
55
|
* @see https://floating-ui.com/docs/autoupdate
|
|
50
56
|
*/
|
|
51
57
|
autoUpdateOptions?: AutoUpdateOptions;
|
|
58
|
+
/**
|
|
59
|
+
* @default false
|
|
60
|
+
*/
|
|
61
|
+
useAutoSize?: UseAutoSize;
|
|
62
|
+
/**
|
|
63
|
+
* @default 0
|
|
64
|
+
*
|
|
65
|
+
* @remarks Only works when `useAutoSize` is `true`.
|
|
66
|
+
*/
|
|
67
|
+
minAcceptableWidth?: number;
|
|
68
|
+
/**
|
|
69
|
+
* @default 0
|
|
70
|
+
*
|
|
71
|
+
* @remarks Only works when `useAutoSize` is `true`.
|
|
72
|
+
*/
|
|
73
|
+
minAcceptableHeight?: number;
|
|
74
|
+
/**
|
|
75
|
+
* @default undefined
|
|
76
|
+
*
|
|
77
|
+
* @remarks Only works when `useAutoSize` is `true`.
|
|
78
|
+
*/
|
|
79
|
+
maxAcceptableWidth?: number;
|
|
80
|
+
/**
|
|
81
|
+
* @default undefined
|
|
82
|
+
*
|
|
83
|
+
* @remarks Only works when `useAutoSize` is `true`.
|
|
84
|
+
*/
|
|
85
|
+
maxAcceptableHeight?: number;
|
|
52
86
|
/**
|
|
53
87
|
* Callback invoked when the popup opens.
|
|
54
88
|
*/
|
|
@@ -92,5 +126,5 @@ interface UseHoneyPopupApi {
|
|
|
92
126
|
*
|
|
93
127
|
* @returns An object containing state and utilities for managing the popup.
|
|
94
128
|
*/
|
|
95
|
-
export declare const useHoneyPopup: ({ enabled, event, dismissOptions, clickOptions, hoverOptions, focusOptions, clientPointsOptions, roleOptions, open,
|
|
129
|
+
export declare const useHoneyPopup: ({ enabled, event, dismissOptions, clickOptions, hoverOptions, focusOptions, clientPointsOptions, roleOptions, open, floatingOptions, offsetOptions, flipOptions, shiftOptions, useArrow, arrowOptions, transitionOptions, useAutoUpdate, autoUpdateOptions, useAutoSize, minAcceptableWidth, minAcceptableHeight, maxAcceptableWidth, maxAcceptableHeight, onOpen, onClose, }: UseHoneyPopupOptions) => UseHoneyPopupApi;
|
|
96
130
|
export {};
|
|
@@ -3,7 +3,6 @@ export * from './HoneyFlexBox';
|
|
|
3
3
|
export * from './HoneyGrid';
|
|
4
4
|
export * from './HoneyGridColumn';
|
|
5
5
|
export * from './HoneyList';
|
|
6
|
-
export * from './HoneyLoopingList';
|
|
7
6
|
export * from './HoneyStatusContent';
|
|
8
7
|
export * from './HoneyLazyContent';
|
|
9
8
|
export * from './HoneyOverlay';
|
package/dist/constants.d.ts
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import { HoneyCSSColorProperty,
|
|
2
|
-
export declare const
|
|
1
|
+
import { HoneyCSSColorProperty, HoneyCSSSpacingProperty } from './types';
|
|
2
|
+
export declare const CSS_SPACING_PROPERTIES: readonly HoneyCSSSpacingProperty[];
|
|
3
3
|
export declare const CSS_COLOR_PROPERTIES: readonly HoneyCSSColorProperty[];
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { DefaultTheme, Interpolation } from 'styled-components';
|
|
2
|
-
import { HoneyColorKey, HoneyCSSColor, HoneyDimensionName, HoneyFontName, HoneyOverlayConfig, HoneySpacings, Nullable, HoneyScreenState, HoneyCSSDimensionUnit, HoneyCSSDimensionValue,
|
|
3
|
-
import {
|
|
2
|
+
import { HoneyColorKey, HoneyCSSColor, HoneyDimensionName, HoneyFontName, HoneyOverlayConfig, HoneySpacings, Nullable, HoneyScreenState, HoneyCSSDimensionUnit, HoneyCSSDimensionValue, HoneyOverlayId, HoneyActiveOverlay, HoneyCSSSpacingValue } from '../types';
|
|
3
|
+
import { HoneyResolveSpacingResult } from '../helpers';
|
|
4
4
|
/**
|
|
5
5
|
* Function to unregister a previously registered overlay.
|
|
6
6
|
*/
|
|
@@ -35,7 +35,7 @@ export interface HoneyLayoutContextValue {
|
|
|
35
35
|
/**
|
|
36
36
|
* Function to resolve spacing values based on a given theme.
|
|
37
37
|
*
|
|
38
|
-
* @template
|
|
38
|
+
* @template Value - A type representing the spacing value(s), which could be a single value or an array of values.
|
|
39
39
|
* @template Unit - The CSS unit used for the resolved spacing value, e.g., 'px', 'em'.
|
|
40
40
|
*
|
|
41
41
|
* @param value - The spacing value(s) to be applied, which could be a single number or an array of numbers.
|
|
@@ -44,7 +44,7 @@ export interface HoneyLayoutContextValue {
|
|
|
44
44
|
*
|
|
45
45
|
* @returns The resolved spacing value, formatted as a string with the appropriate unit.
|
|
46
46
|
*/
|
|
47
|
-
resolveSpacing: <
|
|
47
|
+
resolveSpacing: <Value extends HoneyCSSSpacingValue, Unit extends Nullable<HoneyCSSDimensionUnit> = 'px'>(value: Value, unit?: Unit, type?: keyof HoneySpacings) => HoneyResolveSpacingResult<Value, Unit>;
|
|
48
48
|
/**
|
|
49
49
|
* Function to resolve color values based on the theme.
|
|
50
50
|
*
|
|
@@ -1,37 +1,49 @@
|
|
|
1
|
+
import { css, ExecutionContext, StyleFunction } from 'styled-components';
|
|
1
2
|
import { HTMLAttributes } from 'react';
|
|
2
|
-
import {
|
|
3
|
-
import { Nullable, HoneyBreakpointName, HoneyCSSArrayValue, HoneyCSSDimensionShortHandValue, HoneyCSSDimensionUnit, HoneyCSSMultiValue, HoneyCSSMediaRule, HoneySpacings, HoneyColorKey, HoneyFontName, HoneyCSSColor, HoneyDimensionName, HoneyPrefixedCSSProperties, HoneyBreakpoints, HoneyScreenState, HoneyCSSDimensionValue } from '../types';
|
|
3
|
+
import { Nullable, HoneyBreakpointName, HoneyCSSShorthandTuple, HoneyCSSShorthandDimensionOutput, HoneyCSSDimensionUnit, HoneyCSSSpacingValue, HoneyCSSMediaRule, HoneySpacings, HoneyColorKey, HoneyFontName, HoneyCSSColor, HoneyDimensionName, HoneyPrefixedCSSProperties, HoneyBreakpoints, HoneyScreenState, HoneyCSSDimensionValue } from '../types';
|
|
4
4
|
export declare const noop: () => void;
|
|
5
5
|
export declare function assert(condition: any, message: string): asserts condition;
|
|
6
6
|
export declare const generateUniqueId: () => string;
|
|
7
7
|
/**
|
|
8
|
-
*
|
|
8
|
+
* Determines the resolved type for spacing values when processed by `resolveSpacing`.
|
|
9
9
|
*
|
|
10
|
-
*
|
|
11
|
-
*
|
|
10
|
+
* The return type adapts based on the shape of the `Value` and presence of a CSS `Unit`:
|
|
11
|
+
*
|
|
12
|
+
* - If `Value` is a `string` (e.g., raw `'10px'` or `'auto'`), it is returned as-is.
|
|
13
|
+
* - If `Unit` is `null`, the original value is returned (either number or shorthand array).
|
|
14
|
+
* - If `Unit` is provided and `Value` is a shorthand array (e.g., `[1, 2, 3, 4]`),
|
|
15
|
+
* it is resolved to a space-separated dimension string (e.g., `'8px 16px 24px 32px'`).
|
|
16
|
+
* - If `Unit` is provided and `Value` is a number, it is resolved to a single dimension string (e.g., `'16px'`).
|
|
17
|
+
*
|
|
18
|
+
* This type helps enforce correct resolution behavior depending on user input and configuration.
|
|
19
|
+
*
|
|
20
|
+
* @template Value - The input spacing value (number, shorthand array, or raw string).
|
|
21
|
+
* @template Unit - A CSS length unit (e.g., 'px', 'em'), or `null` to skip unit formatting.
|
|
12
22
|
*/
|
|
13
|
-
export type
|
|
23
|
+
export type HoneyResolveSpacingResult<Value extends HoneyCSSSpacingValue, Unit extends Nullable<HoneyCSSDimensionUnit>> = Value extends HoneyCSSDimensionValue ? Value : Unit extends null ? Value : Value extends HoneyCSSShorthandTuple<number | HoneyCSSDimensionValue> ? HoneyCSSShorthandDimensionOutput<Value, NonNullable<Unit>> : HoneyCSSDimensionValue<NonNullable<Unit>>;
|
|
14
24
|
/**
|
|
15
|
-
* Resolves a spacing value or
|
|
16
|
-
*
|
|
17
|
-
*
|
|
18
|
-
*
|
|
19
|
-
*
|
|
20
|
-
*
|
|
21
|
-
* @
|
|
22
|
-
*
|
|
23
|
-
*
|
|
24
|
-
*
|
|
25
|
-
*
|
|
26
|
-
*
|
|
27
|
-
*
|
|
28
|
-
*
|
|
29
|
-
* @
|
|
30
|
-
*
|
|
31
|
-
*
|
|
32
|
-
*
|
|
25
|
+
* Resolves a spacing value or shorthand spacing array using the theme and optional unit.
|
|
26
|
+
*
|
|
27
|
+
* This function takes spacing multipliers and converts them into pixel or unit-based values
|
|
28
|
+
* using a theme spacing scale (e.g., `theme.spacings.base`). Useful for applying consistent
|
|
29
|
+
* layout spacing with theming and token support.
|
|
30
|
+
*
|
|
31
|
+
* @template Value - The spacing value(s) to resolve. Can be:
|
|
32
|
+
* - A number (e.g., `1`) representing a multiplier.
|
|
33
|
+
* - An array of numbers (e.g., `[1, 2, 3, 4]`) for shorthand spacing.
|
|
34
|
+
* - A dimension string (e.g., `'10px'`) will be returned as `never`.
|
|
35
|
+
* @template Unit - Optional CSS unit (`'px'`, `'em'`, etc.), or `null` to skip units.
|
|
36
|
+
*
|
|
37
|
+
* @param value - Spacing multiplier(s) to apply.
|
|
38
|
+
* @param [unit='px'] - The CSS unit to append. If `null`, values remain numeric.
|
|
39
|
+
* @param [type='base'] - The spacing type to use from the theme (e.g., `'base'`, `'small'`).
|
|
40
|
+
*
|
|
41
|
+
* @returns A function that takes a theme context and returns:
|
|
42
|
+
* - A single resolved value (e.g., `'16px'`) if `value` is a number.
|
|
43
|
+
* - A space-separated string (e.g., `'8px 12px'`) if `value` is an array.
|
|
44
|
+
* - `never` if the input is a raw string (unsupported).
|
|
33
45
|
*/
|
|
34
|
-
export declare const resolveSpacing: <
|
|
46
|
+
export declare const resolveSpacing: <Value extends HoneyCSSSpacingValue, Unit extends Nullable<HoneyCSSDimensionUnit> = "px">(value: Value, unit?: Unit, type?: keyof HoneySpacings) => ((context: ExecutionContext) => HoneyResolveSpacingResult<Value, Unit>);
|
|
35
47
|
/**
|
|
36
48
|
* Resolves a color value from the theme or returns the input color directly if it's a standalone color name or HEX value.
|
|
37
49
|
*
|
package/dist/hooks/index.d.ts
CHANGED
|
@@ -1,7 +1,6 @@
|
|
|
1
|
+
export * from './use-honey-on-change';
|
|
1
2
|
export * from './use-honey-media-query';
|
|
2
3
|
export * from './use-honey-drag';
|
|
3
|
-
export * from './use-honey-infinite-scroll';
|
|
4
|
-
export * from './use-honey-synthetic-scrollable-container';
|
|
5
4
|
export * from './use-honey-document-key-up-handler';
|
|
6
5
|
export * from './use-honey-layout';
|
|
7
6
|
export * from './use-register-honey-overlay';
|
|
@@ -1,19 +1,40 @@
|
|
|
1
1
|
import { HoneyKeyboardEventCode } from '../types';
|
|
2
2
|
export type HoneyDocumentKeyUpHandler = (keyCode: HoneyKeyboardEventCode, e: KeyboardEvent) => void;
|
|
3
|
-
|
|
3
|
+
interface UseHoneyDocumentKeyUpHandlerOptions {
|
|
4
4
|
/**
|
|
5
|
-
*
|
|
5
|
+
* Whether the event listener should be active.
|
|
6
6
|
*
|
|
7
7
|
* @default true
|
|
8
8
|
*/
|
|
9
|
-
|
|
10
|
-
|
|
9
|
+
enabled?: boolean;
|
|
10
|
+
/**
|
|
11
|
+
* Whether to call `preventDefault()` on matching keyup events.
|
|
12
|
+
*
|
|
13
|
+
* This is useful for suppressing default browser behavior (e.g., scrolling with Space key).
|
|
14
|
+
*
|
|
15
|
+
* @default true
|
|
16
|
+
*/
|
|
17
|
+
preventDefault?: boolean;
|
|
18
|
+
}
|
|
11
19
|
/**
|
|
12
|
-
*
|
|
20
|
+
* Hook for handling specific key up events on the `document` object.
|
|
21
|
+
*
|
|
22
|
+
* This hook adds a `keyup` event listener at the document level and triggers the provided `keyUpHandler`
|
|
23
|
+
* when one of the specified `listenKeys` is released.
|
|
24
|
+
*
|
|
25
|
+
* @param keyUpHandler - The callback function invoked when a matching key is released.
|
|
26
|
+
* @param listenKeys - An array of key codes (`KeyboardEvent.code`) to listen for.
|
|
27
|
+
* @param options - Optional configuration to control event behavior and listener activation.
|
|
13
28
|
*
|
|
14
|
-
* @
|
|
15
|
-
*
|
|
16
|
-
*
|
|
29
|
+
* @example
|
|
30
|
+
* ```tsx
|
|
31
|
+
* useHoneyDocumentKeyUpHandler(
|
|
32
|
+
* (keyCode, event) => {
|
|
33
|
+
* console.log('Key released:', keyCode);
|
|
34
|
+
* },
|
|
35
|
+
* ['Escape'],
|
|
36
|
+
* );
|
|
37
|
+
* ```
|
|
17
38
|
*/
|
|
18
|
-
export declare const useHoneyDocumentKeyUpHandler: (keyUpHandler: HoneyDocumentKeyUpHandler, listenKeys: HoneyKeyboardEventCode[], {
|
|
39
|
+
export declare const useHoneyDocumentKeyUpHandler: (keyUpHandler: HoneyDocumentKeyUpHandler, listenKeys: HoneyKeyboardEventCode[], { enabled, preventDefault }?: UseHoneyDocumentKeyUpHandlerOptions) => void;
|
|
19
40
|
export {};
|