@trackunit/react-components 0.1.241 → 0.1.242-alpha-b966be6066.0
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/index.cjs.js
CHANGED
|
@@ -14,12 +14,12 @@ var reactUse = require('react-use');
|
|
|
14
14
|
var reactDayPicker = require('react-day-picker');
|
|
15
15
|
var locale = require('date-fns/locale');
|
|
16
16
|
var react = require('@floating-ui/react');
|
|
17
|
+
var lodash = require('lodash');
|
|
17
18
|
var usePortal = require('react-useportal');
|
|
18
19
|
var reactRouterDom = require('react-router-dom');
|
|
19
20
|
var reactHelmetAsync = require('react-helmet-async');
|
|
20
21
|
var reactTabs = require('@radix-ui/react-tabs');
|
|
21
22
|
var dateFns = require('date-fns');
|
|
22
|
-
var lodash = require('lodash');
|
|
23
23
|
|
|
24
24
|
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
25
25
|
|
|
@@ -1185,7 +1185,7 @@ const usePopover = (_a) => {
|
|
|
1185
1185
|
dismissInteraction,
|
|
1186
1186
|
roleInteraction,
|
|
1187
1187
|
]);
|
|
1188
|
-
return React.useMemo(() => (Object.assign(Object.assign(Object.assign({ isOpen, setIsOpen: setUncontrolledIsOpen }, popoverData), combinedInteractions), { isModal,
|
|
1188
|
+
return React.useMemo(() => (Object.assign(Object.assign(Object.assign(Object.assign({ isOpen, setIsOpen: setUncontrolledIsOpen }, lodash.omit(popoverData, "middlewareData", "floatingStyles", "elements")), { x: popoverData.x, y: popoverData.y, isPositioned: popoverData.isPositioned, refs: popoverData.refs, update: popoverData.update, placement: popoverData.placement, strategy: popoverData.strategy }), combinedInteractions), { isModal,
|
|
1189
1189
|
labelId,
|
|
1190
1190
|
descriptionId,
|
|
1191
1191
|
setLabelId,
|
package/index.esm.js
CHANGED
|
@@ -11,12 +11,12 @@ import { useMeasure, useCopyToClipboard, usePrevious } from 'react-use';
|
|
|
11
11
|
import { DayPicker as DayPicker$1 } from 'react-day-picker';
|
|
12
12
|
import { enGB, enUS, da, de, cs, nl, fr, fi, hu, it, nb, pl, pt, ru, ro, es, sv, ja, th } from 'date-fns/locale';
|
|
13
13
|
import { useFloating, autoUpdate, offset, flip, shift, size, useClick, useDismiss, useHover as useHover$1, useRole, useInteractions, useMergeRefs, FloatingPortal, FloatingFocusManager, arrow, useTransitionStatus, FloatingArrow } from '@floating-ui/react';
|
|
14
|
+
import { omit, isEqual } from 'lodash';
|
|
14
15
|
import usePortal from 'react-useportal';
|
|
15
16
|
import { Link, UNSAFE_NavigationContext } from 'react-router-dom';
|
|
16
17
|
import { HelmetProvider, Helmet } from 'react-helmet-async';
|
|
17
18
|
import { Trigger, Content, List, Root } from '@radix-ui/react-tabs';
|
|
18
19
|
import { format, formatDistance } from 'date-fns';
|
|
19
|
-
import { isEqual } from 'lodash';
|
|
20
20
|
|
|
21
21
|
const docs = {
|
|
22
22
|
source: {
|
|
@@ -1155,7 +1155,7 @@ const usePopover = (_a) => {
|
|
|
1155
1155
|
dismissInteraction,
|
|
1156
1156
|
roleInteraction,
|
|
1157
1157
|
]);
|
|
1158
|
-
return useMemo(() => (Object.assign(Object.assign(Object.assign({ isOpen, setIsOpen: setUncontrolledIsOpen }, popoverData), combinedInteractions), { isModal,
|
|
1158
|
+
return useMemo(() => (Object.assign(Object.assign(Object.assign(Object.assign({ isOpen, setIsOpen: setUncontrolledIsOpen }, omit(popoverData, "middlewareData", "floatingStyles", "elements")), { x: popoverData.x, y: popoverData.y, isPositioned: popoverData.isPositioned, refs: popoverData.refs, update: popoverData.update, placement: popoverData.placement, strategy: popoverData.strategy }), combinedInteractions), { isModal,
|
|
1159
1159
|
labelId,
|
|
1160
1160
|
descriptionId,
|
|
1161
1161
|
setLabelId,
|
package/package.json
CHANGED
|
@@ -1,63 +1,13 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import { PopoverProps } from "./PopoverTypes";
|
|
2
|
+
import { PopoverProps, UsePopoverType } from "./PopoverTypes";
|
|
3
|
+
export type ContextType = UsePopoverType | null;
|
|
3
4
|
/**
|
|
4
5
|
* A hook to get the popover context.
|
|
5
6
|
* It should only be used by the Popover components.
|
|
6
7
|
*
|
|
7
8
|
* @returns {ContextType} The popover context
|
|
8
9
|
*/
|
|
9
|
-
export declare const usePopoverContext: () =>
|
|
10
|
-
isModal: boolean | undefined;
|
|
11
|
-
labelId: string | undefined;
|
|
12
|
-
descriptionId: string | undefined;
|
|
13
|
-
setLabelId: import("react").Dispatch<import("react").SetStateAction<string | undefined>>;
|
|
14
|
-
setDescriptionId: import("react").Dispatch<import("react").SetStateAction<string | undefined>>;
|
|
15
|
-
customProps: {
|
|
16
|
-
className?: string | undefined;
|
|
17
|
-
dataTestId?: string | undefined;
|
|
18
|
-
};
|
|
19
|
-
getReferenceProps: (userProps?: import("react").HTMLProps<Element> | undefined) => Record<string, unknown>;
|
|
20
|
-
getFloatingProps: (userProps?: import("react").HTMLProps<HTMLElement> | undefined) => Record<string, unknown>;
|
|
21
|
-
getItemProps: (userProps?: import("react").HTMLProps<HTMLElement> | undefined) => Record<string, unknown>;
|
|
22
|
-
placement: import("@floating-ui/utils").Placement;
|
|
23
|
-
strategy: import("@floating-ui/utils").Strategy;
|
|
24
|
-
middlewareData: import("@floating-ui/core").MiddlewareData;
|
|
25
|
-
x: number;
|
|
26
|
-
y: number;
|
|
27
|
-
isPositioned: boolean;
|
|
28
|
-
update: () => void;
|
|
29
|
-
floatingStyles: import("react").CSSProperties;
|
|
30
|
-
refs: {
|
|
31
|
-
reference: import("react").MutableRefObject<import("@floating-ui/react-dom").ReferenceType | null>;
|
|
32
|
-
floating: import("react").MutableRefObject<HTMLElement | null>;
|
|
33
|
-
setReference: (node: import("@floating-ui/react-dom").ReferenceType | null) => void;
|
|
34
|
-
setFloating: (node: HTMLElement | null) => void;
|
|
35
|
-
} & import("@floating-ui/react").ExtendedRefs<import("@floating-ui/react").ReferenceType>;
|
|
36
|
-
elements: {
|
|
37
|
-
reference: import("@floating-ui/react-dom").ReferenceType | null;
|
|
38
|
-
floating: HTMLElement | null;
|
|
39
|
-
} & import("@floating-ui/react").ExtendedElements<import("@floating-ui/react").ReferenceType>;
|
|
40
|
-
context: {
|
|
41
|
-
placement: import("@floating-ui/utils").Placement;
|
|
42
|
-
strategy: import("@floating-ui/utils").Strategy;
|
|
43
|
-
x: number;
|
|
44
|
-
y: number;
|
|
45
|
-
middlewareData: import("@floating-ui/core").MiddlewareData;
|
|
46
|
-
isPositioned: boolean;
|
|
47
|
-
update: () => void;
|
|
48
|
-
floatingStyles: import("react").CSSProperties;
|
|
49
|
-
open: boolean;
|
|
50
|
-
onOpenChange: (open: boolean, event?: Event | undefined, reason?: import("@floating-ui/react").OpenChangeReason | undefined) => void;
|
|
51
|
-
events: import("@floating-ui/react").FloatingEvents;
|
|
52
|
-
dataRef: import("react").MutableRefObject<import("@floating-ui/react").ContextData>;
|
|
53
|
-
nodeId: string | undefined;
|
|
54
|
-
floatingId: string;
|
|
55
|
-
refs: import("@floating-ui/react").ExtendedRefs<import("@floating-ui/react").ReferenceType>;
|
|
56
|
-
elements: import("@floating-ui/react").ExtendedElements<import("@floating-ui/react").ReferenceType>;
|
|
57
|
-
};
|
|
58
|
-
isOpen: boolean;
|
|
59
|
-
setIsOpen: import("react").Dispatch<import("react").SetStateAction<boolean>>;
|
|
60
|
-
};
|
|
10
|
+
export declare const usePopoverContext: () => UsePopoverType;
|
|
61
11
|
/**
|
|
62
12
|
* The popover component.
|
|
63
13
|
* - This component should wrap all the popover components.
|
|
@@ -1,11 +1,13 @@
|
|
|
1
|
-
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
import { ExtendedRefs, ReferenceType, UseDismissProps, UseFloatingReturn } from "@floating-ui/react";
|
|
2
3
|
import { CommonProps } from "../../common";
|
|
3
4
|
export type PopoverActivation = {
|
|
4
5
|
click?: boolean;
|
|
5
6
|
hover?: boolean;
|
|
6
7
|
};
|
|
7
8
|
export type PopoverDismissal = Pick<UseDismissProps, "ancestorScroll" | "enabled" | "outsidePress" | "referencePress">;
|
|
8
|
-
export type PopoverPlacement =
|
|
9
|
+
export type PopoverPlacement = "top" | "right" | "bottom" | "left" | "top-start" | "top-end" | "right-start" | "right-end" | "bottom-start" | "bottom-end" | "left-start" | "left-end";
|
|
10
|
+
export type Strategy = "absolute" | "fixed";
|
|
9
11
|
export interface PopoverProps extends CommonProps {
|
|
10
12
|
/**
|
|
11
13
|
* Whether the popover should be open on initial render
|
|
@@ -36,3 +38,22 @@ export interface PopoverProps extends CommonProps {
|
|
|
36
38
|
*/
|
|
37
39
|
onOpenStateChange?: (open: boolean) => void;
|
|
38
40
|
}
|
|
41
|
+
export type FloatingType = Omit<UseFloatingReturn, "middlewareData" | "floatingStyles" | "elements" | "refs">;
|
|
42
|
+
export type ExtendedRefsType = ExtendedRefs<ReferenceType>;
|
|
43
|
+
export type UsePopoverType = {
|
|
44
|
+
isOpen: boolean;
|
|
45
|
+
setIsOpen: (open: boolean) => void;
|
|
46
|
+
isModal: boolean | undefined;
|
|
47
|
+
labelId?: string;
|
|
48
|
+
descriptionId?: string;
|
|
49
|
+
setLabelId: (id: string) => void;
|
|
50
|
+
setDescriptionId: (id: string) => void;
|
|
51
|
+
customProps: PopoverProps;
|
|
52
|
+
strategy: Strategy;
|
|
53
|
+
x: number;
|
|
54
|
+
y: number;
|
|
55
|
+
refs: ExtendedRefsType;
|
|
56
|
+
getReferenceProps: (userProps?: React.HTMLProps<Element>) => Record<string, unknown>;
|
|
57
|
+
getFloatingProps: (userProps?: React.HTMLProps<HTMLElement>) => Record<string, unknown>;
|
|
58
|
+
getItemProps: (userProps?: React.HTMLProps<HTMLElement>) => Record<string, unknown>;
|
|
59
|
+
} & FloatingType;
|
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
import { PopoverProps } from "./PopoverTypes";
|
|
1
|
+
import { PopoverProps, UsePopoverType } from "./PopoverTypes";
|
|
3
2
|
/**
|
|
4
3
|
* The hook that powers the Popover component.
|
|
5
4
|
* It should not be used directly, but rather through the Popover component.
|
|
@@ -7,55 +6,4 @@ import { PopoverProps } from "./PopoverTypes";
|
|
|
7
6
|
* @param {PopoverProps} options The options for the popover
|
|
8
7
|
* @returns {ReturnType<usePopover>} The data for the popover
|
|
9
8
|
*/
|
|
10
|
-
export declare const usePopover: ({ initialOpen, placement, isModal, isOpen: controlledIsOpen, activation, dismissal, onOpenStateChange, ...restOptions }: PopoverProps) =>
|
|
11
|
-
isModal: boolean | undefined;
|
|
12
|
-
labelId: string | undefined;
|
|
13
|
-
descriptionId: string | undefined;
|
|
14
|
-
setLabelId: import("react").Dispatch<import("react").SetStateAction<string | undefined>>;
|
|
15
|
-
setDescriptionId: import("react").Dispatch<import("react").SetStateAction<string | undefined>>;
|
|
16
|
-
customProps: {
|
|
17
|
-
className?: string | undefined;
|
|
18
|
-
dataTestId?: string | undefined;
|
|
19
|
-
};
|
|
20
|
-
getReferenceProps: (userProps?: import("react").HTMLProps<Element> | undefined) => Record<string, unknown>;
|
|
21
|
-
getFloatingProps: (userProps?: import("react").HTMLProps<HTMLElement> | undefined) => Record<string, unknown>;
|
|
22
|
-
getItemProps: (userProps?: import("react").HTMLProps<HTMLElement> | undefined) => Record<string, unknown>;
|
|
23
|
-
placement: import("@floating-ui/utils").Placement;
|
|
24
|
-
strategy: import("@floating-ui/utils").Strategy;
|
|
25
|
-
middlewareData: import("@floating-ui/core").MiddlewareData;
|
|
26
|
-
x: number;
|
|
27
|
-
y: number;
|
|
28
|
-
isPositioned: boolean;
|
|
29
|
-
update: () => void;
|
|
30
|
-
floatingStyles: import("react").CSSProperties;
|
|
31
|
-
refs: {
|
|
32
|
-
reference: import("react").MutableRefObject<import("@floating-ui/react-dom").ReferenceType | null>;
|
|
33
|
-
floating: import("react").MutableRefObject<HTMLElement | null>;
|
|
34
|
-
setReference: (node: import("@floating-ui/react-dom").ReferenceType | null) => void;
|
|
35
|
-
setFloating: (node: HTMLElement | null) => void;
|
|
36
|
-
} & import("@floating-ui/react").ExtendedRefs<import("@floating-ui/react").ReferenceType>;
|
|
37
|
-
elements: {
|
|
38
|
-
reference: import("@floating-ui/react-dom").ReferenceType | null;
|
|
39
|
-
floating: HTMLElement | null;
|
|
40
|
-
} & import("@floating-ui/react").ExtendedElements<import("@floating-ui/react").ReferenceType>;
|
|
41
|
-
context: {
|
|
42
|
-
placement: import("@floating-ui/utils").Placement;
|
|
43
|
-
strategy: import("@floating-ui/utils").Strategy;
|
|
44
|
-
x: number;
|
|
45
|
-
y: number;
|
|
46
|
-
middlewareData: import("@floating-ui/core").MiddlewareData;
|
|
47
|
-
isPositioned: boolean;
|
|
48
|
-
update: () => void;
|
|
49
|
-
floatingStyles: import("react").CSSProperties;
|
|
50
|
-
open: boolean;
|
|
51
|
-
onOpenChange: (open: boolean, event?: Event | undefined, reason?: import("@floating-ui/react").OpenChangeReason | undefined) => void;
|
|
52
|
-
events: import("@floating-ui/react").FloatingEvents;
|
|
53
|
-
dataRef: import("react").MutableRefObject<import("@floating-ui/react").ContextData>;
|
|
54
|
-
nodeId: string | undefined;
|
|
55
|
-
floatingId: string;
|
|
56
|
-
refs: import("@floating-ui/react").ExtendedRefs<import("@floating-ui/react").ReferenceType>;
|
|
57
|
-
elements: import("@floating-ui/react").ExtendedElements<import("@floating-ui/react").ReferenceType>;
|
|
58
|
-
};
|
|
59
|
-
isOpen: boolean;
|
|
60
|
-
setIsOpen: import("react").Dispatch<import("react").SetStateAction<boolean>>;
|
|
61
|
-
};
|
|
9
|
+
export declare const usePopover: ({ initialOpen, placement, isModal, isOpen: controlledIsOpen, activation, dismissal, onOpenStateChange, ...restOptions }: PopoverProps) => UsePopoverType;
|