@tcn/ui 0.2.0 → 0.3.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/dist/divider.module-FptFV0PX.js +5 -0
- package/dist/divider.module-FptFV0PX.js.map +1 -0
- package/dist/form/field/field.js +1 -1
- package/dist/frame.css +1 -0
- package/dist/inputs/color_input/color_input.js +1 -1
- package/dist/inputs/color_input/color_input.js.map +1 -1
- package/dist/inputs/color_input/color_picker.js +1 -1
- package/dist/inputs/combo_box/combo_box.js +1 -1
- package/dist/inputs/date_picker/date_picker.js +1 -1
- package/dist/inputs/date_picker/date_picker_input.js +2 -2
- package/dist/inputs/date_picker/date_picker_input.js.map +1 -1
- package/dist/inputs/date_picker/date_picker_year_input.js +1 -1
- package/dist/inputs/date_picker/date_picker_year_input.js.map +1 -1
- package/dist/inputs/date_picker/date_picker_year_selector.js +1 -1
- package/dist/inputs/mask_input/key_capture_input.js +1 -1
- package/dist/inputs/mask_input/mask_input.js +1 -1
- package/dist/inputs/multiselect/multiselect.js +1 -1
- package/dist/inputs/phone_number_input/phone_number_input.js +1 -1
- package/dist/inputs/select/select.js +1 -1
- package/dist/inputs/slider/slider.js +1 -1
- package/dist/inputs/suggestions/suggestion_list.js +2 -2
- package/dist/inputs/suggestions/suggestion_list.js.map +1 -1
- package/dist/inputs/switch/switch.js +1 -1
- package/dist/inputs/unit_input/unit_input.js +1 -1
- package/dist/layouts/divider/divider.js +24 -23
- package/dist/layouts/divider/divider.js.map +1 -1
- package/dist/layouts/index.d.ts +6 -5
- package/dist/layouts/index.d.ts.map +1 -1
- package/dist/layouts/index.js +28 -26
- package/dist/layouts/index.js.map +1 -1
- package/dist/layouts/scaffold/scaffold.d.ts +9 -0
- package/dist/layouts/scaffold/scaffold.d.ts.map +1 -0
- package/dist/layouts/scaffold/scaffold.js +55 -0
- package/dist/layouts/scaffold/scaffold.js.map +1 -0
- package/dist/modal.css +1 -1
- package/dist/overlay/frame/frame.d.ts.map +1 -1
- package/dist/overlay/frame/frame.js +22 -5
- package/dist/overlay/frame/frame.js.map +1 -1
- package/dist/overlay/index.d.ts +9 -2
- package/dist/overlay/index.d.ts.map +1 -1
- package/dist/overlay/index.js +22 -10
- package/dist/overlay/index.js.map +1 -1
- package/dist/overlay/menu/menu.d.ts +1 -1
- package/dist/overlay/menu/menu.d.ts.map +1 -1
- package/dist/overlay/menu/menu.js +2 -2
- package/dist/overlay/menu/menu.js.map +1 -1
- package/dist/overlay/popper/base/base_popper.d.ts +11 -0
- package/dist/overlay/popper/base/base_popper.d.ts.map +1 -0
- package/dist/overlay/popper/base/base_popper.js +27 -0
- package/dist/overlay/popper/base/base_popper.js.map +1 -0
- package/dist/overlay/popper/base/dismissal_decorator.d.ts +16 -0
- package/dist/overlay/popper/base/dismissal_decorator.d.ts.map +1 -0
- package/dist/overlay/popper/base/dismissal_decorator.js +69 -0
- package/dist/overlay/popper/base/dismissal_decorator.js.map +1 -0
- package/dist/overlay/popper/context_popper.d.ts +11 -0
- package/dist/overlay/popper/context_popper.d.ts.map +1 -0
- package/dist/overlay/popper/context_popper.js +33 -0
- package/dist/overlay/popper/context_popper.js.map +1 -0
- package/dist/overlay/popper/element_popper.d.ts +7 -0
- package/dist/overlay/popper/element_popper.d.ts.map +1 -0
- package/dist/overlay/popper/element_popper.js +33 -0
- package/dist/overlay/popper/element_popper.js.map +1 -0
- package/dist/overlay/popper/hooks/use_context_trigger.d.ts +7 -0
- package/dist/overlay/popper/hooks/use_context_trigger.d.ts.map +1 -0
- package/dist/overlay/popper/hooks/use_context_trigger.js +31 -0
- package/dist/overlay/popper/hooks/use_context_trigger.js.map +1 -0
- package/dist/overlay/popper/hooks/use_hover_trigger.d.ts +6 -0
- package/dist/overlay/popper/hooks/use_hover_trigger.d.ts.map +1 -0
- package/dist/overlay/popper/hooks/use_hover_trigger.js +17 -0
- package/dist/overlay/popper/hooks/use_hover_trigger.js.map +1 -0
- package/dist/overlay/popper/hooks/use_restore_focus.d.ts +2 -0
- package/dist/overlay/popper/hooks/use_restore_focus.d.ts.map +1 -0
- package/dist/overlay/popper/hooks/use_restore_focus.js +18 -0
- package/dist/overlay/popper/hooks/use_restore_focus.js.map +1 -0
- package/dist/overlay/popper/legacy/popper.d.ts.map +1 -0
- package/dist/overlay/popper/{popper.js → legacy/popper.js} +6 -6
- package/dist/overlay/popper/legacy/popper.js.map +1 -0
- package/dist/overlay/popper/preview_popper.d.ts +7 -0
- package/dist/overlay/popper/preview_popper.d.ts.map +1 -0
- package/dist/overlay/popper/preview_popper.js +46 -0
- package/dist/overlay/popper/preview_popper.js.map +1 -0
- package/dist/overlay/tethered/element_tethered.d.ts +8 -0
- package/dist/overlay/tethered/element_tethered.d.ts.map +1 -0
- package/dist/overlay/tethered/element_tethered.js +33 -0
- package/dist/overlay/tethered/element_tethered.js.map +1 -0
- package/dist/overlay/tethered/hooks/calculate_position.d.ts +19 -0
- package/dist/overlay/tethered/hooks/calculate_position.d.ts.map +1 -0
- package/dist/overlay/tethered/hooks/calculate_position.js +43 -0
- package/dist/overlay/tethered/hooks/calculate_position.js.map +1 -0
- package/dist/overlay/tethered/hooks/useTether.d.ts +19 -0
- package/dist/overlay/tethered/hooks/useTether.d.ts.map +1 -0
- package/dist/overlay/tethered/hooks/useTether.js +61 -0
- package/dist/overlay/tethered/hooks/useTether.js.map +1 -0
- package/dist/overlay/tethered/tethered.d.ts +20 -0
- package/dist/overlay/tethered/tethered.d.ts.map +1 -0
- package/dist/overlay/tethered/tethered.js +59 -0
- package/dist/overlay/tethered/tethered.js.map +1 -0
- package/dist/overlay/tethered/types.d.ts +3 -0
- package/dist/overlay/tethered/types.d.ts.map +1 -0
- package/dist/overlay/tethered/types.js +2 -0
- package/dist/overlay/tethered/types.js.map +1 -0
- package/dist/popper.css +1 -1
- package/dist/scaffold.css +1 -0
- package/dist/stacks/box/box.js +1 -1
- package/dist/stacks/h_collapsible_box.js +1 -1
- package/dist/stacks/v_collapsible_box.js +1 -1
- package/dist/surfaces/card/card.d.ts +2 -2
- package/dist/surfaces/card/card.d.ts.map +1 -1
- package/dist/surfaces/card/card.js +7 -7
- package/dist/surfaces/card/card.js.map +1 -1
- package/dist/surfaces/index.d.ts +2 -0
- package/dist/surfaces/index.d.ts.map +1 -1
- package/dist/surfaces/index.js +22 -18
- package/dist/surfaces/index.js.map +1 -1
- package/dist/surfaces/modal/modal.d.ts +3 -3
- package/dist/surfaces/modal/modal.d.ts.map +1 -1
- package/dist/surfaces/modal/modal.js +14 -14
- package/dist/surfaces/modal/modal.js.map +1 -1
- package/dist/surfaces/panel/h_panel.js +23 -24
- package/dist/surfaces/panel/h_panel.js.map +1 -1
- package/dist/surfaces/panel/v_panel.d.ts +3 -7
- package/dist/surfaces/panel/v_panel.d.ts.map +1 -1
- package/dist/surfaces/panel/v_panel.js +12 -54
- package/dist/surfaces/panel/v_panel.js.map +1 -1
- package/dist/surfaces/pop_confirm/pop_confirm.d.ts +5 -0
- package/dist/surfaces/pop_confirm/pop_confirm.d.ts.map +1 -0
- package/dist/surfaces/pop_confirm/pop_confirm.js +37 -0
- package/dist/surfaces/pop_confirm/pop_confirm.js.map +1 -0
- package/dist/surfaces/popconfirm/pop_confirm.d.ts +5 -0
- package/dist/surfaces/popconfirm/pop_confirm.d.ts.map +1 -0
- package/dist/surfaces/popconfirm/pop_confirm.js +13 -0
- package/dist/surfaces/popconfirm/pop_confirm.js.map +1 -0
- package/dist/surfaces/popover/popover.d.ts +1 -1
- package/dist/surfaces/popover/popover.d.ts.map +1 -1
- package/dist/surfaces/popover/popover.js +1 -1
- package/dist/surfaces/popover/popover.js.map +1 -1
- package/dist/surfaces/tooltip/tooltip.d.ts +10 -0
- package/dist/surfaces/tooltip/tooltip.d.ts.map +1 -0
- package/dist/surfaces/tooltip/tooltip.js +38 -0
- package/dist/surfaces/tooltip/tooltip.js.map +1 -0
- package/dist/surfaces/window/window.d.ts +3 -3
- package/dist/surfaces/window/window.d.ts.map +1 -1
- package/dist/surfaces/window/window.js +16 -14
- package/dist/surfaces/window/window.js.map +1 -1
- package/dist/tethered.css +1 -0
- package/dist/themes/themes/ergo/ergo_theme.js +144 -205
- package/dist/themes/themes/ergo/ergo_theme.js.map +1 -1
- package/dist/tooltip.css +1 -1
- package/dist/utility_bar.css +1 -1
- package/dist/utils/click_away_listener.d.ts +1 -0
- package/dist/utils/click_away_listener.d.ts.map +1 -1
- package/dist/utils/click_away_listener.js +2 -1
- package/dist/utils/click_away_listener.js.map +1 -1
- package/dist/utils/index.d.ts +6 -5
- package/dist/utils/index.d.ts.map +1 -1
- package/dist/utils/index.js +26 -23
- package/dist/utils/index.js.map +1 -1
- package/dist/utils/mouse_leave_region.d.ts +8 -0
- package/dist/utils/mouse_leave_region.d.ts.map +1 -0
- package/dist/utils/mouse_leave_region.js +26 -0
- package/dist/utils/mouse_leave_region.js.map +1 -0
- package/dist/utils/types/dimensions.d.ts +11 -1
- package/dist/utils/types/dimensions.d.ts.map +1 -1
- package/package.json +3 -3
- package/src/inputs/color_input/color_input.tsx +1 -1
- package/src/inputs/date_picker/date_picker_input.tsx +1 -1
- package/src/inputs/date_picker/date_picker_year_input.tsx +1 -1
- package/src/inputs/suggestions/suggestion_list.tsx +1 -1
- package/src/layouts/index.ts +7 -5
- package/src/layouts/scaffold/scaffold.module.css +5 -0
- package/src/layouts/scaffold/scaffold.tsx +60 -0
- package/src/layouts/utility_bar/utility_bar.module.css +0 -3
- package/src/overlay/frame/frame.module.css +5 -0
- package/src/overlay/frame/frame.stories.tsx +1 -1
- package/src/overlay/frame/frame.tsx +19 -3
- package/src/overlay/index.ts +29 -2
- package/src/overlay/menu/menu.tsx +1 -1
- package/src/overlay/popper/__stories__/base_args.ts +75 -0
- package/src/overlay/popper/__stories__/context_popper.stories.tsx +77 -0
- package/src/overlay/popper/__stories__/element_popper.stories.tsx +80 -0
- package/src/overlay/popper/__stories__/preview_popper.stories.tsx +73 -0
- package/src/overlay/popper/base/base_popper.tsx +55 -0
- package/src/overlay/popper/base/dismissal_decorator.tsx +80 -0
- package/src/overlay/popper/context_popper.tsx +43 -0
- package/src/overlay/popper/element_popper.tsx +42 -0
- package/src/overlay/popper/hooks/use_context_trigger.ts +50 -0
- package/src/overlay/popper/hooks/use_hover_trigger.ts +24 -0
- package/src/overlay/popper/hooks/use_restore_focus.ts +16 -0
- package/src/overlay/popper/{popper.stories.tsx → legacy/popper.stories.tsx} +11 -5
- package/src/overlay/popper/{popper.tsx → legacy/popper.tsx} +3 -2
- package/src/overlay/popper/preview_popper.tsx +54 -0
- package/src/overlay/tethered/__stories__/element/element_tethered.stories.tsx +57 -0
- package/src/overlay/tethered/__stories__/element/element_tethered_stories.module.css +14 -0
- package/src/overlay/tethered/__stories__/shared/base_story_config.ts +52 -0
- package/src/overlay/tethered/__stories__/shared/components/sb_point.module.css +20 -0
- package/src/overlay/tethered/__stories__/shared/components/sb_point.tsx +34 -0
- package/src/overlay/tethered/__stories__/shared/components/sb_reference_points.tsx +54 -0
- package/src/overlay/tethered/__stories__/tethered/tethered.stories.tsx +90 -0
- package/src/overlay/tethered/__stories__/tethered/tethered_stories.module.css +25 -0
- package/src/overlay/tethered/element_tethered.tsx +62 -0
- package/src/overlay/tethered/hooks/calculate_position.ts +110 -0
- package/src/overlay/tethered/hooks/useTether.ts +85 -0
- package/src/overlay/tethered/tethered.module.css +8 -0
- package/src/overlay/tethered/tethered.tsx +72 -0
- package/src/overlay/tethered/types.ts +2 -0
- package/src/stacks/h_stack.stories.tsx +2 -2
- package/src/stacks/v_stack.stories.tsx +2 -2
- package/src/surfaces/card/card.stories.tsx +64 -0
- package/src/surfaces/card/card.tsx +4 -4
- package/src/surfaces/card/card_stories.module.css +13 -0
- package/src/surfaces/index.ts +2 -0
- package/src/surfaces/modal/__stories__/modal.stories.tsx +12 -1
- package/src/surfaces/modal/modal.module.css +2 -2
- package/src/surfaces/modal/modal.tsx +14 -12
- package/src/surfaces/panel/__stories__/panel.stories.tsx +1 -1
- package/src/surfaces/panel/v_panel.tsx +8 -53
- package/src/surfaces/pop_confirm/pop_confirm.stories.tsx +70 -0
- package/src/surfaces/pop_confirm/pop_confirm.tsx +30 -0
- package/src/surfaces/popconfirm/pop_confirm.tsx +18 -0
- package/src/surfaces/popover/popover.tsx +1 -1
- package/src/surfaces/tooltip/tooltip.stories.tsx +54 -0
- package/src/surfaces/tooltip/tooltip.tsx +59 -0
- package/src/surfaces/window/window.stories.tsx +15 -1
- package/src/surfaces/window/window.tsx +16 -12
- package/src/themes/themes/ergo/__stories__/components/tone_picker/sb_tone_picker.tsx +7 -9
- package/src/themes/themes/ergo/__stories__/material.stories.tsx +2 -6
- package/src/themes/themes/ergo/__stories__/sb_materials.module.css +29 -21
- package/src/themes/themes/ergo/ergo_theme.css +144 -205
- package/src/utils/click_away_listener.tsx +1 -1
- package/src/utils/index.ts +7 -5
- package/src/utils/mouse_leave_region.tsx +38 -0
- package/src/utils/types/dimensions.ts +13 -1
- package/tsconfig.json +3 -0
- package/dist/overlay/popper/popper.d.ts.map +0 -1
- package/dist/overlay/popper/popper.js.map +0 -1
- package/dist/overlay/tooltip/tooltip.d.ts +0 -7
- package/dist/overlay/tooltip/tooltip.d.ts.map +0 -1
- package/dist/overlay/tooltip/tooltip.js +0 -20
- package/dist/overlay/tooltip/tooltip.js.map +0 -1
- package/dist/panel.module-DwGKncon.js +0 -5
- package/dist/panel.module-DwGKncon.js.map +0 -1
- package/src/overlay/tooltip/tooltip.stories.tsx +0 -22
- package/src/overlay/tooltip/tooltip.tsx +0 -24
- /package/dist/{panel.css → h_panel.css} +0 -0
- /package/dist/overlay/popper/{popper.d.ts → legacy/popper.d.ts} +0 -0
- /package/src/overlay/popper/{popper.module.css → legacy/popper.module.css} +0 -0
- /package/src/{overlay → surfaces}/tooltip/tooltip.module.css +0 -0
package/dist/layouts/index.js
CHANGED
|
@@ -1,29 +1,31 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
8
|
-
import {
|
|
9
|
-
import {
|
|
10
|
-
import {
|
|
11
|
-
import {
|
|
12
|
-
import {
|
|
13
|
-
import {
|
|
1
|
+
import { Column as e } from "./column/column.js";
|
|
2
|
+
import { Divider as f } from "./divider/divider.js";
|
|
3
|
+
import { Grid as p } from "./grid/grid.js";
|
|
4
|
+
import { Item as d } from "./list/item.js";
|
|
5
|
+
import { List as a } from "./list/list.js";
|
|
6
|
+
import { SectionHeader as l } from "./list/section_header.js";
|
|
7
|
+
import { SidebarEnd as y } from "./sidebar_end/sidebar_end.js";
|
|
8
|
+
import { SidebarStart as H } from "./sidebar_start/sidebar_start.js";
|
|
9
|
+
import { Scaffold as c } from "./scaffold/scaffold.js";
|
|
10
|
+
import { HBody as u } from "./body/h_body.js";
|
|
11
|
+
import { VBody as C } from "./body/v_body.js";
|
|
12
|
+
import { Footer as E } from "./footer/footer.js";
|
|
13
|
+
import { Header as G } from "./header/header.js";
|
|
14
|
+
import { UtilityBar as L } from "./utility_bar/utility_bar.js";
|
|
14
15
|
export {
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
16
|
+
e as Column,
|
|
17
|
+
f as Divider,
|
|
18
|
+
E as Footer,
|
|
19
|
+
p as Grid,
|
|
20
|
+
u as HBody,
|
|
21
|
+
G as Header,
|
|
22
|
+
d as Item,
|
|
23
|
+
a as List,
|
|
24
|
+
c as Scaffold,
|
|
25
|
+
l as SectionHeader,
|
|
26
|
+
y as SidebarEnd,
|
|
27
|
+
H as SidebarStart,
|
|
28
|
+
L as UtilityBar,
|
|
29
|
+
C as VBody
|
|
28
30
|
};
|
|
29
31
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;"}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
import { BoxProps } from '../../stacks/box/box.js';
|
|
3
|
+
import { Alignment } from '../../stacks/types/alignment.js';
|
|
4
|
+
export interface ScaffoldProps extends Omit<BoxProps, 'as'> {
|
|
5
|
+
vAlign?: Alignment;
|
|
6
|
+
hAlign?: Alignment;
|
|
7
|
+
}
|
|
8
|
+
export declare const Scaffold: React.ForwardRefExoticComponent<ScaffoldProps & React.RefAttributes<HTMLElement>>;
|
|
9
|
+
//# sourceMappingURL=scaffold.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"scaffold.d.ts","sourceRoot":"","sources":["../../../src/layouts/scaffold/scaffold.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAO,KAAK,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AAC7D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAKjE,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC;IACzD,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,MAAM,CAAC,EAAE,SAAS,CAAC;CACpB;AAED,eAAO,MAAM,QAAQ,mFA8CnB,CAAC"}
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
import { jsx as l } from "react/jsx-runtime";
|
|
2
|
+
import S from "react";
|
|
3
|
+
import { clsx as d } from "clsx";
|
|
4
|
+
import { Box as x } from "../../stacks/box/box.js";
|
|
5
|
+
import { VStack as i } from "../../stacks/v_stack.js";
|
|
6
|
+
import '../../scaffold.css';const u = "_scaffold-stack_8f97a6a", N = { "scaffold-stack": u }, B = S.forwardRef(function({
|
|
7
|
+
children: n,
|
|
8
|
+
width: m,
|
|
9
|
+
height: e = "100%",
|
|
10
|
+
minWidth: a,
|
|
11
|
+
maxWidth: c,
|
|
12
|
+
minHeight: o,
|
|
13
|
+
maxHeight: f,
|
|
14
|
+
hAlign: s,
|
|
15
|
+
vAlign: t = "start",
|
|
16
|
+
className: k,
|
|
17
|
+
...p
|
|
18
|
+
}, r) {
|
|
19
|
+
return /* @__PURE__ */ l(
|
|
20
|
+
x,
|
|
21
|
+
{
|
|
22
|
+
ref: r,
|
|
23
|
+
width: m,
|
|
24
|
+
height: e,
|
|
25
|
+
minWidth: a,
|
|
26
|
+
maxWidth: c,
|
|
27
|
+
minHeight: o,
|
|
28
|
+
maxHeight: f,
|
|
29
|
+
"data-h-alignment": s,
|
|
30
|
+
"data-v-alignment": t,
|
|
31
|
+
className: d(k, "tcn-scaffold"),
|
|
32
|
+
...p,
|
|
33
|
+
children: /* @__PURE__ */ l(
|
|
34
|
+
i,
|
|
35
|
+
{
|
|
36
|
+
as: "section",
|
|
37
|
+
minWidth: a,
|
|
38
|
+
maxWidth: c,
|
|
39
|
+
minHeight: o,
|
|
40
|
+
maxHeight: f,
|
|
41
|
+
hAlign: s,
|
|
42
|
+
vAlign: t,
|
|
43
|
+
ref: r,
|
|
44
|
+
className: d(N["scaffold-stack"], "tcn-scaffold-stack"),
|
|
45
|
+
zIndex: 0,
|
|
46
|
+
children: n
|
|
47
|
+
}
|
|
48
|
+
)
|
|
49
|
+
}
|
|
50
|
+
);
|
|
51
|
+
});
|
|
52
|
+
export {
|
|
53
|
+
B as Scaffold
|
|
54
|
+
};
|
|
55
|
+
//# sourceMappingURL=scaffold.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"scaffold.js","sources":["../../../src/layouts/scaffold/scaffold.tsx"],"sourcesContent":["import React from 'react';\nimport { clsx } from 'clsx';\nimport { Box, type BoxProps } from '../../stacks/box/box.js';\nimport type { Alignment } from '../../stacks/types/alignment.js';\nimport { VStack } from '../../stacks/v_stack.js';\n// Styles\nimport styles from './scaffold.module.css';\n\nexport interface ScaffoldProps extends Omit<BoxProps, 'as'> {\n vAlign?: Alignment;\n hAlign?: Alignment;\n}\n\nexport const Scaffold = React.forwardRef<HTMLElement, ScaffoldProps>(function Scaffold(\n {\n children,\n width,\n height = '100%',\n minWidth,\n maxWidth,\n minHeight,\n maxHeight,\n hAlign,\n vAlign = 'start',\n className,\n ...props\n }: ScaffoldProps,\n ref\n) {\n return (\n <Box\n ref={ref}\n width={width}\n height={height}\n minWidth={minWidth}\n maxWidth={maxWidth}\n minHeight={minHeight}\n maxHeight={maxHeight}\n data-h-alignment={hAlign}\n data-v-alignment={vAlign}\n className={clsx(className, 'tcn-scaffold')}\n {...props}\n >\n <VStack\n as=\"section\"\n minWidth={minWidth}\n maxWidth={maxWidth}\n minHeight={minHeight}\n maxHeight={maxHeight}\n hAlign={hAlign}\n vAlign={vAlign}\n ref={ref}\n className={clsx(styles['scaffold-stack'], 'tcn-scaffold-stack')}\n zIndex={0}\n >\n {children}\n </VStack>\n </Box>\n );\n});\n"],"names":["Scaffold","React","children","width","height","minWidth","maxWidth","minHeight","maxHeight","hAlign","vAlign","className","props","ref","jsx","Box","clsx","VStack","styles"],"mappings":";;;;;kEAaaA,IAAWC,EAAM,WAAuC,SACnE;AAAA,EACE,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,WAAAC;AAAA,EACA,QAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,WAAAC;AAAA,EACA,GAAGC;AACL,GACAC,GACA;AACA,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,KAAAF;AAAA,MACA,OAAAV;AAAA,MACA,QAAAC;AAAA,MACA,UAAAC;AAAA,MACA,UAAAC;AAAA,MACA,WAAAC;AAAA,MACA,WAAAC;AAAA,MACA,oBAAkBC;AAAA,MAClB,oBAAkBC;AAAA,MAClB,WAAWM,EAAKL,GAAW,cAAc;AAAA,MACxC,GAAGC;AAAA,MAEJ,UAAA,gBAAAE;AAAA,QAACG;AAAA,QAAA;AAAA,UACC,IAAG;AAAA,UACH,UAAAZ;AAAA,UACA,UAAAC;AAAA,UACA,WAAAC;AAAA,UACA,WAAAC;AAAA,UACA,QAAAC;AAAA,UACA,QAAAC;AAAA,UACA,KAAAG;AAAA,UACA,WAAWG,EAAKE,EAAO,gBAAgB,GAAG,oBAAoB;AAAA,UAC9D,QAAQ;AAAA,UAEP,UAAAhB;AAAA,QAAA;AAAA,MAAA;AAAA,IACH;AAAA,EAAA;AAGN,CAAC;"}
|
package/dist/modal.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
._modal_473c6ef{width:
|
|
1
|
+
._modal_473c6ef{width:auto;height:auto}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"frame.d.ts","sourceRoot":"","sources":["../../../src/overlay/frame/frame.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,uBAAuB,CAAC;
|
|
1
|
+
{"version":3,"file":"frame.d.ts","sourceRoot":"","sources":["../../../src/overlay/frame/frame.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,uBAAuB,CAAC;AAQjE,MAAM,WAAW,aAAa;IAC5B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AAED,MAAM,MAAM,UAAU,GAAG,WAAW,GAAG,aAAa,CAAC;AAErD,eAAO,MAAM,KAAK,oHA+BhB,CAAC"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { jsx as r } from "react/jsx-runtime";
|
|
2
|
-
import
|
|
2
|
+
import c from "react";
|
|
3
3
|
import "../../stacks/box/box.js";
|
|
4
4
|
import "../../stacks/h_collapsible_box.js";
|
|
5
5
|
import "../../stacks/h_stack.js";
|
|
@@ -7,12 +7,29 @@ import "../../stacks/spacer.js";
|
|
|
7
7
|
import "../../stacks/v_collapsible_box.js";
|
|
8
8
|
import "../../stacks/v_stack.js";
|
|
9
9
|
import { ZStack as t } from "../../stacks/z_stack.js";
|
|
10
|
-
import { Portal as
|
|
10
|
+
import { Portal as s } from "../portal/portal.js";
|
|
11
11
|
import { Draggable as n } from "../../utils/dnd/draggable/draggable.js";
|
|
12
|
-
|
|
13
|
-
|
|
12
|
+
import { clsx as p } from "clsx";
|
|
13
|
+
import '../../frame.css';const d = "_frame_ce82001", h = { frame: d }, D = c.forwardRef(function({
|
|
14
|
+
children: m,
|
|
15
|
+
isOpen: e = !1,
|
|
16
|
+
draggable: o = !0,
|
|
17
|
+
veil: a = !1,
|
|
18
|
+
className: i,
|
|
19
|
+
...f
|
|
20
|
+
}, l) {
|
|
21
|
+
return e ? /* @__PURE__ */ r(s, { children: /* @__PURE__ */ r(t, { width: "100%", height: "100%", "data-is-veil": a, className: "tcn-frame-veil", children: /* @__PURE__ */ r(n, { draggable: o, children: /* @__PURE__ */ r(
|
|
22
|
+
t,
|
|
23
|
+
{
|
|
24
|
+
as: "dialog",
|
|
25
|
+
ref: l,
|
|
26
|
+
className: p(h.frame, "tcn-frame", i),
|
|
27
|
+
...f,
|
|
28
|
+
children: m
|
|
29
|
+
}
|
|
30
|
+
) }) }) }) : null;
|
|
14
31
|
});
|
|
15
32
|
export {
|
|
16
|
-
|
|
33
|
+
D as Frame
|
|
17
34
|
};
|
|
18
35
|
//# sourceMappingURL=frame.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"frame.js","sources":["../../../src/overlay/frame/frame.tsx"],"sourcesContent":["import React from 'react';\nimport { ZStack, type ZStackProps } from '../../stacks/index.js';\nimport { Portal } from '../portal/portal.js';\nimport { Draggable } from '../../utils/dnd/draggable/draggable.js';\n\nexport interface FrameOwnProps {\n isOpen?: boolean;\n children?: React.ReactNode;\n draggable?: boolean;\n veil?: boolean;\n}\n\nexport type FrameProps = ZStackProps & FrameOwnProps;\n\nexport const Frame = React.forwardRef<HTMLDialogElement, FrameProps>(function Frame(\n {
|
|
1
|
+
{"version":3,"file":"frame.js","sources":["../../../src/overlay/frame/frame.tsx"],"sourcesContent":["import React from 'react';\nimport { ZStack, type ZStackProps } from '../../stacks/index.js';\nimport { Portal } from '../portal/portal.js';\nimport { Draggable } from '../../utils/dnd/draggable/draggable.js';\n\n// Styles\nimport styles from './frame.module.css';\nimport { clsx } from 'clsx';\n\nexport interface FrameOwnProps {\n isOpen?: boolean;\n children?: React.ReactNode;\n draggable?: boolean;\n veil?: boolean;\n}\n\nexport type FrameProps = ZStackProps & FrameOwnProps;\n\nexport const Frame = React.forwardRef<HTMLDialogElement, FrameProps>(function Frame(\n {\n children,\n isOpen = false,\n draggable = true,\n veil = false,\n className,\n ...rest\n }: FrameProps,\n ref\n) {\n if (!isOpen) {\n return null;\n }\n\n return (\n <Portal>\n <ZStack width=\"100%\" height=\"100%\" data-is-veil={veil} className=\"tcn-frame-veil\">\n <Draggable draggable={draggable}>\n <ZStack\n as=\"dialog\"\n ref={ref}\n className={clsx(styles['frame'], 'tcn-frame', className)}\n {...rest}\n >\n {children}\n </ZStack>\n </Draggable>\n </ZStack>\n </Portal>\n );\n});\n"],"names":["Frame","React","children","isOpen","draggable","veil","className","rest","ref","jsx","Portal","ZStack","Draggable","clsx","styles"],"mappings":";;;;;;;;;;;;8CAkBaA,IAAQC,EAAM,WAA0C,SACnE;AAAA,EACE,UAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,WAAAC,IAAY;AAAA,EACZ,MAAAC,IAAO;AAAA,EACP,WAAAC;AAAA,EACA,GAAGC;AACL,GACAC,GACA;AACA,SAAKL,IAKH,gBAAAM,EAACC,GAAA,EACC,UAAA,gBAAAD,EAACE,GAAA,EAAO,OAAM,QAAO,QAAO,QAAO,gBAAcN,GAAM,WAAU,kBAC/D,UAAA,gBAAAI,EAACG,KAAU,WAAAR,GACT,UAAA,gBAAAK;AAAA,IAACE;AAAA,IAAA;AAAA,MACC,IAAG;AAAA,MACH,KAAAH;AAAA,MACA,WAAWK,EAAKC,EAAO,OAAU,aAAaR,CAAS;AAAA,MACtD,GAAGC;AAAA,MAEH,UAAAL;AAAA,IAAA;AAAA,EAAA,EACH,CACF,GACF,GACF,IAjBO;AAmBX,CAAC;"}
|
package/dist/overlay/index.d.ts
CHANGED
|
@@ -1,7 +1,14 @@
|
|
|
1
1
|
export * from './portal/portal.js';
|
|
2
2
|
export * from './context_menu/context_menu.js';
|
|
3
3
|
export * from './menu/menu.js';
|
|
4
|
-
export * from './tooltip/tooltip.js';
|
|
5
|
-
export * from './popper/popper.js';
|
|
6
4
|
export { Frame, type FrameOwnProps, type FrameProps } from './frame/frame.js';
|
|
5
|
+
export { ElementTethered, type ElementTetheredProps, } from './tethered/element_tethered.js';
|
|
6
|
+
export { Tethered, type TetheredProps } from './tethered/tethered.js';
|
|
7
|
+
export { type HorizontalTether, type VerticalTether } from './tethered/types.js';
|
|
8
|
+
export * from './popper/legacy/popper.js';
|
|
9
|
+
export { PopperDismissal, type PopperDismissalDecoratorProps, } from './popper/base/dismissal_decorator.js';
|
|
10
|
+
export { PreviewPopper, type PreviewPopperProps, } from './popper/preview_popper.js';
|
|
11
|
+
export { ContextPopper, type ContextPopperProps, } from './popper/context_popper.js';
|
|
12
|
+
export { ElementPopper, type ElementPopperProps, } from './popper/element_popper.js';
|
|
13
|
+
export { type BasePopperOwnProps, type BasePopperProps, BasePopper, } from './popper/base/base_popper.js';
|
|
7
14
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/overlay/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC;AACnC,cAAc,gCAAgC,CAAC;AAC/C,cAAc,gBAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/overlay/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC;AACnC,cAAc,gCAAgC,CAAC;AAC/C,cAAc,gBAAgB,CAAC;AAE/B,OAAO,EAAE,KAAK,EAAE,KAAK,aAAa,EAAE,KAAK,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC9E,OAAO,EACL,eAAe,EACf,KAAK,oBAAoB,GAC1B,MAAM,gCAAgC,CAAC;AACxC,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,wBAAwB,CAAC;AACtE,OAAO,EAAE,KAAK,gBAAgB,EAAE,KAAK,cAAc,EAAE,MAAM,qBAAqB,CAAC;AACjF,cAAc,2BAA2B,CAAC;AAC1C,OAAO,EACL,eAAe,EACf,KAAK,6BAA6B,GACnC,MAAM,sCAAsC,CAAC;AAC9C,OAAO,EACL,aAAa,EACb,KAAK,kBAAkB,GACxB,MAAM,4BAA4B,CAAC;AACpC,OAAO,EACL,aAAa,EACb,KAAK,kBAAkB,GACxB,MAAM,4BAA4B,CAAC;AACpC,OAAO,EACL,aAAa,EACb,KAAK,kBAAkB,GACxB,MAAM,4BAA4B,CAAC;AACpC,OAAO,EACL,KAAK,kBAAkB,EACvB,KAAK,eAAe,EACpB,UAAU,GACX,MAAM,8BAA8B,CAAC"}
|
package/dist/overlay/index.js
CHANGED
|
@@ -1,16 +1,28 @@
|
|
|
1
|
-
import { Portal as
|
|
2
|
-
import { ContextMenu as
|
|
1
|
+
import { Portal as o } from "./portal/portal.js";
|
|
2
|
+
import { ContextMenu as t } from "./context_menu/context_menu.js";
|
|
3
3
|
import { Menu as x, MenuItem as f } from "./menu/menu.js";
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
4
|
+
import { Frame as n } from "./frame/frame.js";
|
|
5
|
+
import { ElementTethered as l } from "./tethered/element_tethered.js";
|
|
6
|
+
import { Tethered as i } from "./tethered/tethered.js";
|
|
7
|
+
import { Popper as M } from "./popper/legacy/popper.js";
|
|
8
|
+
import { PopperDismissal as h } from "./popper/base/dismissal_decorator.js";
|
|
9
|
+
import { PreviewPopper as E } from "./popper/preview_popper.js";
|
|
10
|
+
import { ContextPopper as v } from "./popper/context_popper.js";
|
|
11
|
+
import { ElementPopper as B } from "./popper/element_popper.js";
|
|
12
|
+
import { BasePopper as F } from "./popper/base/base_popper.js";
|
|
7
13
|
export {
|
|
8
|
-
|
|
9
|
-
|
|
14
|
+
F as BasePopper,
|
|
15
|
+
t as ContextMenu,
|
|
16
|
+
v as ContextPopper,
|
|
17
|
+
B as ElementPopper,
|
|
18
|
+
l as ElementTethered,
|
|
19
|
+
n as Frame,
|
|
10
20
|
x as Menu,
|
|
11
21
|
f as MenuItem,
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
22
|
+
M as Popper,
|
|
23
|
+
h as PopperDismissal,
|
|
24
|
+
o as Portal,
|
|
25
|
+
E as PreviewPopper,
|
|
26
|
+
i as Tethered
|
|
15
27
|
};
|
|
16
28
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { HStackProps } from '../../stacks/h_stack.js';
|
|
2
2
|
import { VStackProps } from '../../stacks/v_stack.js';
|
|
3
|
-
import { PopperProps } from '
|
|
3
|
+
import { PopperProps } from '../popper/legacy/popper.js';
|
|
4
4
|
import { default as React } from 'react';
|
|
5
5
|
export type MenuProps = Omit<PopperProps & VStackProps, 'children'> & {
|
|
6
6
|
children?: React.ReactNode;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"menu.d.ts","sourceRoot":"","sources":["../../../src/overlay/menu/menu.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAC3D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAC3D,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"menu.d.ts","sourceRoot":"","sources":["../../../src/overlay/menu/menu.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAC3D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAC3D,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,4BAA4B,CAAC;AACtE,OAAO,KAA4C,MAAM,OAAO,CAAC;AAIjE,MAAM,MAAM,SAAS,GAAG,IAAI,CAAC,WAAW,GAAG,WAAW,EAAE,UAAU,CAAC,GAAG;IACpE,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,eAAe,CAAC,EAAE,CAAC,aAAa,EAAE,OAAO,KAAK,IAAI,CAAC;IACnD,SAAS,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC;CAC3B,CAAC;AAEF,eAAO,MAAM,IAAI;eALJ,KAAK,CAAC,SAAS;sBACR,CAAC,aAAa,EAAE,OAAO,KAAK,IAAI;gBACtC,IAAI,GAAG,MAAM;wCAkGzB,CAAC;AAEH,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,WAAW,EAAE,UAAU,CAAC;IAClE,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,aAAa,CAAC,EAAE,CAAC;IAC/C,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,SAAS,CAAC,EAAE,IAAI,GAAG,MAAM,CAAC;IAC1B,cAAc,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAC;IAC7C,cAAc,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,QAAQ,CAAC;IAC7C,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,gBAAgB,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,KAAK,CAAC;IAC9C,gBAAgB,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,KAAK,CAAC;IAC9C,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B;AAED,eAAO,MAAM,QAAQ,sFA0InB,CAAC"}
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import { jsx as g, jsxs as W, Fragment as q } from "react/jsx-runtime";
|
|
2
2
|
import { BodyText as O } from "../../typography/body_text/body_text.js";
|
|
3
|
-
import "../../utils/focus_redirect.js";
|
|
4
3
|
import "../../utils/click_away_listener.js";
|
|
4
|
+
import "../../utils/focus_redirect.js";
|
|
5
5
|
import "../../utils/scroll_away_listener.js";
|
|
6
6
|
import f, { useState as F, useLayoutEffect as _, useRef as M } from "react";
|
|
7
7
|
import { useForkRef as T } from "../../utils/hooks/use_fork_ref.js";
|
|
8
8
|
import "../../utils/hooks/use_resize_observer.js";
|
|
9
9
|
import { HStack as G } from "../../stacks/h_stack.js";
|
|
10
10
|
import { VStack as J } from "../../stacks/v_stack.js";
|
|
11
|
-
import { Popper as K } from "../popper/popper.js";
|
|
11
|
+
import { Popper as K } from "../popper/legacy/popper.js";
|
|
12
12
|
import { clsx as L } from "clsx";
|
|
13
13
|
import '../../menu.css';const Q = "_menu_9ce21e3", U = "_menu-item_68b387f", j = { menu: Q, "menu-item": U }, Z = f.forwardRef(function({
|
|
14
14
|
anchorElement: R,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"menu.js","sources":["../../../src/overlay/menu/menu.tsx"],"sourcesContent":["import { BodyText } from '../../typography/body_text/body_text.js';\nimport { useForkRef } from '../../utils/index.js';\nimport { HStack } from '../../stacks/h_stack.js';\nimport { VStack } from '../../stacks/v_stack.js';\nimport type { HStackProps } from '../../stacks/h_stack.js';\nimport type { VStackProps } from '../../stacks/v_stack.js';\nimport { Popper, type PopperProps } from '../../overlay/popper/popper.js';\nimport React, { useLayoutEffect, useRef, useState } from 'react';\nimport styles from './menu.module.css';\nimport { clsx } from 'clsx';\n\nexport type MenuProps = Omit<PopperProps & VStackProps, 'children'> & {\n children?: React.ReactNode;\n onActivatedMenu?: (hasActiveMenu: boolean) => void;\n direction?: 'up' | 'down';\n};\n\nexport const Menu = React.forwardRef(function Menu(\n {\n anchorElement,\n verticalAnchor,\n verticalOrigin,\n verticalOffset,\n horizontalAnchor,\n horizontalOrigin,\n horizontalOffset,\n direction,\n open,\n onClose,\n restoreFocus,\n veil,\n onActivatedMenu,\n children = [],\n className,\n ...props\n }: MenuProps,\n ref: React.Ref<HTMLDivElement>\n) {\n const [focusedIndex, setFocusedIndex] = useState(-1);\n const clonedChildren = React.Children.toArray(children).map((child, index) => {\n if (!React.isValidElement(child)) {\n return child;\n }\n\n if (child.type !== MenuItem) {\n return React.cloneElement(child, {\n ...child.props,\n onClick: (e: React.MouseEvent<HTMLElement>) => {\n e.stopPropagation();\n child.props.onClick && child.props.onClick(e);\n },\n });\n }\n\n const props = {\n ...child.props,\n key: index,\n verticalAnchor: direction === 'up' ? 'bottom' : 'top',\n verticalOrigin: direction === 'up' ? 'bottom' : 'top',\n verticalOffset,\n horizontalAnchor: 'end',\n horizontalOrigin: 'start',\n horizontalOffset,\n direction,\n onClick: (e: React.MouseEvent<HTMLDivElement>) => {\n if (child.props.children == null) {\n onClose && onClose();\n }\n child.props.onClick && child.props.onClick(e);\n },\n onMouseEnter: (e: React.MouseEvent<HTMLDivElement>) => {\n setFocusedIndex(index);\n onActivatedMenu && onActivatedMenu(true);\n child.props.onMouseEnter && child.props.onMouseEnter(e);\n },\n };\n\n if (child.type === MenuItem) {\n props.open = focusedIndex === index;\n }\n\n return React.cloneElement(child, props);\n });\n\n direction === 'up' && clonedChildren.reverse();\n\n useLayoutEffect(() => {\n if (!open) {\n setFocusedIndex(-1);\n onActivatedMenu && onActivatedMenu(false);\n }\n }, [open, onActivatedMenu]);\n\n return (\n <Popper\n anchorElement={anchorElement}\n verticalAnchor={verticalAnchor}\n verticalOrigin={verticalOrigin}\n verticalOffset={verticalOffset}\n horizontalAnchor={horizontalAnchor || 'end'}\n horizontalOrigin={horizontalOrigin || 'end'}\n horizontalOffset={horizontalOffset}\n open={open}\n onClose={onClose}\n restoreFocus={restoreFocus}\n veil={veil}\n >\n <VStack ref={ref} className={clsx(styles.menu, className, 'menu')} {...props}>\n {clonedChildren}\n </VStack>\n </Popper>\n );\n});\n\nexport interface MenuItemProps extends Omit<HStackProps, 'children'> {\n open?: boolean;\n children?: React.ReactElement<MenuItemProps>[];\n selected?: boolean;\n label?: React.ReactNode;\n direction?: 'up' | 'down';\n verticalAnchor?: 'top' | 'center' | 'bottom';\n verticalOrigin?: 'top' | 'center' | 'bottom';\n verticalOffset?: number;\n horizontalAnchor?: 'center' | 'start' | 'end';\n horizontalOrigin?: 'center' | 'start' | 'end';\n horizontalOffset?: number;\n}\n\nexport const MenuItem = React.forwardRef(function MenuItem(\n {\n selected,\n label,\n className,\n children,\n direction = 'down',\n verticalAnchor = 'top',\n verticalOrigin = 'top',\n verticalOffset,\n horizontalAnchor = 'end',\n horizontalOrigin = 'start',\n horizontalOffset,\n open = false,\n ...props\n }: MenuItemProps,\n ref: React.Ref<HTMLDivElement>\n) {\n const hasEnteredMenuRef = useRef(false);\n const cursorPositionRef = useRef({ x: -1, y: -1 });\n const cursorDeltaRef = useRef({ x: -1, y: -1 });\n const [showVeil, setShowVeil] = useState(false);\n const itemRef = useRef<HTMLElement | null>(null);\n const forkedRef = useForkRef(ref, itemRef);\n const hasSubmenu = children != null && children.length > 0;\n\n function close() {\n setShowVeil(false);\n }\n\n useLayoutEffect(() => {\n const itemElement = itemRef.current;\n\n if (itemElement && hasSubmenu && open) {\n const direction = window.getComputedStyle(itemElement).direction;\n\n const startPosition = cursorPositionRef.current;\n const delta = cursorDeltaRef.current;\n\n const calculateSlope = (event: MouseEvent) => {\n if (startPosition.x === -1) {\n startPosition.x = event.clientX;\n startPosition.y = event.clientY;\n }\n\n const deltaX = event.clientX - startPosition.x;\n const deltaY = event.clientY - startPosition.y;\n delta.x = Math.max(Math.abs(deltaX), 0.001);\n delta.y = Math.max(Math.abs(deltaY), 0.001);\n\n const isSlopeWrongDirection =\n ((deltaX < 0 ||\n (direction === 'down' && deltaY < 0) ||\n (direction === 'up' && deltaY > 0)) &&\n direction === 'ltr') ||\n ((deltaX > 0 ||\n (direction === 'down' && deltaY < 0) ||\n (direction === 'up' && deltaY > 0)) &&\n direction === 'rtl');\n\n if (isSlopeWrongDirection) {\n startPosition.x = event.clientX;\n startPosition.y = event.clientY;\n setShowVeil(false);\n return;\n }\n\n const distance = Math.sqrt(delta.x ** 2 + delta.y ** 2);\n\n if (hasEnteredMenuRef.current) {\n startPosition.x = event.clientX;\n startPosition.y = event.clientY;\n setShowVeil(false);\n return;\n }\n\n if (distance > 5) {\n const movingHorizontal = delta.x / delta.y > 0.2;\n\n if (movingHorizontal) {\n setShowVeil(true);\n } else {\n setShowVeil(false);\n }\n\n startPosition.x = event.clientX;\n startPosition.y = event.clientY;\n }\n };\n\n window.addEventListener('mousemove', calculateSlope);\n\n return () => {\n window.removeEventListener('mousemove', calculateSlope);\n };\n }\n }, [hasSubmenu, open]);\n\n useLayoutEffect(() => {\n setShowVeil(open);\n }, [open]);\n\n return (\n <>\n <HStack\n as=\"button\"\n ref={forkedRef}\n data-is-selected={Boolean(selected)}\n data-has-children={Boolean(hasSubmenu)}\n className={clsx(className, styles['menu-item'], 'menu-item')}\n data-is-open={open}\n {...props}\n >\n {typeof label === 'string' ? <BodyText color=\"inherit\">{label}</BodyText> : label}\n </HStack>\n {children && (\n <Menu\n anchorElement={itemRef.current}\n veil={showVeil}\n onClose={close}\n open={open}\n direction={direction}\n verticalAnchor={verticalAnchor}\n verticalOrigin={verticalOrigin}\n verticalOffset={verticalOffset}\n horizontalAnchor={horizontalAnchor}\n horizontalOrigin={horizontalOrigin}\n horizontalOffset={horizontalOffset}\n hAlign=\"start\"\n onActivatedMenu={hasActiveMenu => {\n hasEnteredMenuRef.current = hasActiveMenu;\n }}\n >\n {children}\n </Menu>\n )}\n </>\n );\n});\n"],"names":["Menu","React","anchorElement","verticalAnchor","verticalOrigin","verticalOffset","horizontalAnchor","horizontalOrigin","horizontalOffset","direction","open","onClose","restoreFocus","veil","onActivatedMenu","children","className","props","ref","focusedIndex","setFocusedIndex","useState","clonedChildren","child","index","MenuItem","useLayoutEffect","jsx","Popper","VStack","clsx","styles","selected","label","hasEnteredMenuRef","useRef","cursorPositionRef","cursorDeltaRef","showVeil","setShowVeil","itemRef","forkedRef","useForkRef","hasSubmenu","close","itemElement","startPosition","delta","calculateSlope","event","deltaX","deltaY","distance","movingHorizontal","jsxs","Fragment","HStack","BodyText","hasActiveMenu"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"menu.js","sources":["../../../src/overlay/menu/menu.tsx"],"sourcesContent":["import { BodyText } from '../../typography/body_text/body_text.js';\nimport { useForkRef } from '../../utils/index.js';\nimport { HStack } from '../../stacks/h_stack.js';\nimport { VStack } from '../../stacks/v_stack.js';\nimport type { HStackProps } from '../../stacks/h_stack.js';\nimport type { VStackProps } from '../../stacks/v_stack.js';\nimport { Popper, type PopperProps } from '../popper/legacy/popper.js';\nimport React, { useLayoutEffect, useRef, useState } from 'react';\nimport styles from './menu.module.css';\nimport { clsx } from 'clsx';\n\nexport type MenuProps = Omit<PopperProps & VStackProps, 'children'> & {\n children?: React.ReactNode;\n onActivatedMenu?: (hasActiveMenu: boolean) => void;\n direction?: 'up' | 'down';\n};\n\nexport const Menu = React.forwardRef(function Menu(\n {\n anchorElement,\n verticalAnchor,\n verticalOrigin,\n verticalOffset,\n horizontalAnchor,\n horizontalOrigin,\n horizontalOffset,\n direction,\n open,\n onClose,\n restoreFocus,\n veil,\n onActivatedMenu,\n children = [],\n className,\n ...props\n }: MenuProps,\n ref: React.Ref<HTMLDivElement>\n) {\n const [focusedIndex, setFocusedIndex] = useState(-1);\n const clonedChildren = React.Children.toArray(children).map((child, index) => {\n if (!React.isValidElement(child)) {\n return child;\n }\n\n if (child.type !== MenuItem) {\n return React.cloneElement(child, {\n ...child.props,\n onClick: (e: React.MouseEvent<HTMLElement>) => {\n e.stopPropagation();\n child.props.onClick && child.props.onClick(e);\n },\n });\n }\n\n const props = {\n ...child.props,\n key: index,\n verticalAnchor: direction === 'up' ? 'bottom' : 'top',\n verticalOrigin: direction === 'up' ? 'bottom' : 'top',\n verticalOffset,\n horizontalAnchor: 'end',\n horizontalOrigin: 'start',\n horizontalOffset,\n direction,\n onClick: (e: React.MouseEvent<HTMLDivElement>) => {\n if (child.props.children == null) {\n onClose && onClose();\n }\n child.props.onClick && child.props.onClick(e);\n },\n onMouseEnter: (e: React.MouseEvent<HTMLDivElement>) => {\n setFocusedIndex(index);\n onActivatedMenu && onActivatedMenu(true);\n child.props.onMouseEnter && child.props.onMouseEnter(e);\n },\n };\n\n if (child.type === MenuItem) {\n props.open = focusedIndex === index;\n }\n\n return React.cloneElement(child, props);\n });\n\n direction === 'up' && clonedChildren.reverse();\n\n useLayoutEffect(() => {\n if (!open) {\n setFocusedIndex(-1);\n onActivatedMenu && onActivatedMenu(false);\n }\n }, [open, onActivatedMenu]);\n\n return (\n <Popper\n anchorElement={anchorElement}\n verticalAnchor={verticalAnchor}\n verticalOrigin={verticalOrigin}\n verticalOffset={verticalOffset}\n horizontalAnchor={horizontalAnchor || 'end'}\n horizontalOrigin={horizontalOrigin || 'end'}\n horizontalOffset={horizontalOffset}\n open={open}\n onClose={onClose}\n restoreFocus={restoreFocus}\n veil={veil}\n >\n <VStack ref={ref} className={clsx(styles.menu, className, 'menu')} {...props}>\n {clonedChildren}\n </VStack>\n </Popper>\n );\n});\n\nexport interface MenuItemProps extends Omit<HStackProps, 'children'> {\n open?: boolean;\n children?: React.ReactElement<MenuItemProps>[];\n selected?: boolean;\n label?: React.ReactNode;\n direction?: 'up' | 'down';\n verticalAnchor?: 'top' | 'center' | 'bottom';\n verticalOrigin?: 'top' | 'center' | 'bottom';\n verticalOffset?: number;\n horizontalAnchor?: 'center' | 'start' | 'end';\n horizontalOrigin?: 'center' | 'start' | 'end';\n horizontalOffset?: number;\n}\n\nexport const MenuItem = React.forwardRef(function MenuItem(\n {\n selected,\n label,\n className,\n children,\n direction = 'down',\n verticalAnchor = 'top',\n verticalOrigin = 'top',\n verticalOffset,\n horizontalAnchor = 'end',\n horizontalOrigin = 'start',\n horizontalOffset,\n open = false,\n ...props\n }: MenuItemProps,\n ref: React.Ref<HTMLDivElement>\n) {\n const hasEnteredMenuRef = useRef(false);\n const cursorPositionRef = useRef({ x: -1, y: -1 });\n const cursorDeltaRef = useRef({ x: -1, y: -1 });\n const [showVeil, setShowVeil] = useState(false);\n const itemRef = useRef<HTMLElement | null>(null);\n const forkedRef = useForkRef(ref, itemRef);\n const hasSubmenu = children != null && children.length > 0;\n\n function close() {\n setShowVeil(false);\n }\n\n useLayoutEffect(() => {\n const itemElement = itemRef.current;\n\n if (itemElement && hasSubmenu && open) {\n const direction = window.getComputedStyle(itemElement).direction;\n\n const startPosition = cursorPositionRef.current;\n const delta = cursorDeltaRef.current;\n\n const calculateSlope = (event: MouseEvent) => {\n if (startPosition.x === -1) {\n startPosition.x = event.clientX;\n startPosition.y = event.clientY;\n }\n\n const deltaX = event.clientX - startPosition.x;\n const deltaY = event.clientY - startPosition.y;\n delta.x = Math.max(Math.abs(deltaX), 0.001);\n delta.y = Math.max(Math.abs(deltaY), 0.001);\n\n const isSlopeWrongDirection =\n ((deltaX < 0 ||\n (direction === 'down' && deltaY < 0) ||\n (direction === 'up' && deltaY > 0)) &&\n direction === 'ltr') ||\n ((deltaX > 0 ||\n (direction === 'down' && deltaY < 0) ||\n (direction === 'up' && deltaY > 0)) &&\n direction === 'rtl');\n\n if (isSlopeWrongDirection) {\n startPosition.x = event.clientX;\n startPosition.y = event.clientY;\n setShowVeil(false);\n return;\n }\n\n const distance = Math.sqrt(delta.x ** 2 + delta.y ** 2);\n\n if (hasEnteredMenuRef.current) {\n startPosition.x = event.clientX;\n startPosition.y = event.clientY;\n setShowVeil(false);\n return;\n }\n\n if (distance > 5) {\n const movingHorizontal = delta.x / delta.y > 0.2;\n\n if (movingHorizontal) {\n setShowVeil(true);\n } else {\n setShowVeil(false);\n }\n\n startPosition.x = event.clientX;\n startPosition.y = event.clientY;\n }\n };\n\n window.addEventListener('mousemove', calculateSlope);\n\n return () => {\n window.removeEventListener('mousemove', calculateSlope);\n };\n }\n }, [hasSubmenu, open]);\n\n useLayoutEffect(() => {\n setShowVeil(open);\n }, [open]);\n\n return (\n <>\n <HStack\n as=\"button\"\n ref={forkedRef}\n data-is-selected={Boolean(selected)}\n data-has-children={Boolean(hasSubmenu)}\n className={clsx(className, styles['menu-item'], 'menu-item')}\n data-is-open={open}\n {...props}\n >\n {typeof label === 'string' ? <BodyText color=\"inherit\">{label}</BodyText> : label}\n </HStack>\n {children && (\n <Menu\n anchorElement={itemRef.current}\n veil={showVeil}\n onClose={close}\n open={open}\n direction={direction}\n verticalAnchor={verticalAnchor}\n verticalOrigin={verticalOrigin}\n verticalOffset={verticalOffset}\n horizontalAnchor={horizontalAnchor}\n horizontalOrigin={horizontalOrigin}\n horizontalOffset={horizontalOffset}\n hAlign=\"start\"\n onActivatedMenu={hasActiveMenu => {\n hasEnteredMenuRef.current = hasActiveMenu;\n }}\n >\n {children}\n </Menu>\n )}\n </>\n );\n});\n"],"names":["Menu","React","anchorElement","verticalAnchor","verticalOrigin","verticalOffset","horizontalAnchor","horizontalOrigin","horizontalOffset","direction","open","onClose","restoreFocus","veil","onActivatedMenu","children","className","props","ref","focusedIndex","setFocusedIndex","useState","clonedChildren","child","index","MenuItem","useLayoutEffect","jsx","Popper","VStack","clsx","styles","selected","label","hasEnteredMenuRef","useRef","cursorPositionRef","cursorDeltaRef","showVeil","setShowVeil","itemRef","forkedRef","useForkRef","hasSubmenu","close","itemElement","startPosition","delta","calculateSlope","event","deltaX","deltaY","distance","movingHorizontal","jsxs","Fragment","HStack","BodyText","hasActiveMenu"],"mappings":"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"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { PropsWithChildren } from 'react';
|
|
2
|
+
import { PopperDismissalDecoratorProps } from './dismissal_decorator.js';
|
|
3
|
+
export interface BasePopperOwnProps {
|
|
4
|
+
open: boolean;
|
|
5
|
+
restoreFocus?: boolean;
|
|
6
|
+
veil?: boolean;
|
|
7
|
+
}
|
|
8
|
+
export interface BasePopperProps extends BasePopperOwnProps, PopperDismissalDecoratorProps {
|
|
9
|
+
}
|
|
10
|
+
export declare const BasePopper: React.FC<PropsWithChildren<BasePopperProps>>;
|
|
11
|
+
//# sourceMappingURL=base_popper.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"base_popper.d.ts","sourceRoot":"","sources":["../../../../src/overlay/popper/base/base_popper.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE/C,OAAO,EAEL,KAAK,6BAA6B,EACnC,MAAM,0BAA0B,CAAC;AAElC,MAAM,WAAW,kBAAkB;IACjC,IAAI,EAAE,OAAO,CAAC;IACd,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AAED,MAAM,WAAW,eACf,SAAQ,kBAAkB,EACxB,6BAA6B;CAAG;AAEpC,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAAC,eAAe,CAAC,CAqCnE,CAAC"}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import { jsx as i } from "react/jsx-runtime";
|
|
2
|
+
import { useRestoreFocus as f } from "../hooks/use_restore_focus.js";
|
|
3
|
+
import { PopperDismissalDecorator as u } from "./dismissal_decorator.js";
|
|
4
|
+
const n = ({
|
|
5
|
+
restoreFocus: o = !1,
|
|
6
|
+
open: r,
|
|
7
|
+
onDismissal: e,
|
|
8
|
+
isException: s,
|
|
9
|
+
dismissals: t = [],
|
|
10
|
+
acceptedRefs: m,
|
|
11
|
+
// TODO: add veil
|
|
12
|
+
// veil = false,
|
|
13
|
+
children: p
|
|
14
|
+
}) => (f(r, o), r ? /* @__PURE__ */ i(
|
|
15
|
+
u,
|
|
16
|
+
{
|
|
17
|
+
dismissals: t,
|
|
18
|
+
onDismissal: e,
|
|
19
|
+
isException: s,
|
|
20
|
+
acceptedRefs: m,
|
|
21
|
+
children: p
|
|
22
|
+
}
|
|
23
|
+
) : null);
|
|
24
|
+
export {
|
|
25
|
+
n as BasePopper
|
|
26
|
+
};
|
|
27
|
+
//# sourceMappingURL=base_popper.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"base_popper.js","sources":["../../../../src/overlay/popper/base/base_popper.tsx"],"sourcesContent":["import { type PropsWithChildren } from 'react';\nimport { useRestoreFocus } from '../hooks/use_restore_focus.js';\nimport {\n PopperDismissalDecorator,\n type PopperDismissalDecoratorProps,\n} from './dismissal_decorator.js';\n\nexport interface BasePopperOwnProps {\n open: boolean;\n restoreFocus?: boolean;\n veil?: boolean;\n}\n\nexport interface BasePopperProps\n extends BasePopperOwnProps,\n PopperDismissalDecoratorProps {}\n\nexport const BasePopper: React.FC<PropsWithChildren<BasePopperProps>> = ({\n restoreFocus = false,\n open,\n onDismissal,\n isException,\n dismissals = [],\n acceptedRefs,\n // TODO: add veil\n // veil = false,\n children,\n}) => {\n useRestoreFocus(open, restoreFocus);\n\n if (!open) return null;\n\n // if (veil) {\n // content = (\n // <div\n // // TODO: add ref and onClick\n // // ref={veilRef}\n // // onClick={e => veilRef.current === e.target && onVeilClick && onVeilClick(e)}\n // >\n // {content}\n // </div>\n // );\n // }\n\n return (\n <PopperDismissalDecorator\n dismissals={dismissals}\n onDismissal={onDismissal}\n isException={isException}\n acceptedRefs={acceptedRefs}\n >\n {children}\n </PopperDismissalDecorator>\n );\n};\n"],"names":["BasePopper","restoreFocus","open","onDismissal","isException","dismissals","acceptedRefs","children","useRestoreFocus","jsx","PopperDismissalDecorator"],"mappings":";;;AAiBO,MAAMA,IAA2D,CAAC;AAAA,EACvE,cAAAC,IAAe;AAAA,EACf,MAAAC;AAAA,EACA,aAAAC;AAAA,EACA,aAAAC;AAAA,EACA,YAAAC,IAAa,CAAA;AAAA,EACb,cAAAC;AAAA;AAAA;AAAA,EAGA,UAAAC;AACF,OACEC,EAAgBN,GAAMD,CAAY,GAE7BC,IAeH,gBAAAO;AAAA,EAACC;AAAA,EAAA;AAAA,IACC,YAAAL;AAAA,IACA,aAAAF;AAAA,IACA,aAAAC;AAAA,IACA,cAAAE;AAAA,IAEC,UAAAC;AAAA,EAAA;AAAA,IArBa;"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
export declare enum PopperDismissal {
|
|
2
|
+
CLICK_AWAY = "clickAway",
|
|
3
|
+
SCROLL_AWAY = "scrollAway",
|
|
4
|
+
MOUSE_LEAVE = "mouseLeave",
|
|
5
|
+
VEIL_CLICK = "veilClick"
|
|
6
|
+
}
|
|
7
|
+
export interface PopperDismissalDecoratorProps {
|
|
8
|
+
dismissals?: PopperDismissal[];
|
|
9
|
+
onDismissal?: (dismissal: PopperDismissal) => void;
|
|
10
|
+
isException?: (dismissal: PopperDismissal, target: HTMLElement) => boolean;
|
|
11
|
+
acceptedRefs?: React.RefObject<HTMLElement>[];
|
|
12
|
+
}
|
|
13
|
+
export declare const PopperDismissalDecorator: import('react').ForwardRefExoticComponent<PopperDismissalDecoratorProps & {
|
|
14
|
+
children?: import('react').ReactNode | undefined;
|
|
15
|
+
} & import('react').RefAttributes<HTMLElement>>;
|
|
16
|
+
//# sourceMappingURL=dismissal_decorator.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dismissal_decorator.d.ts","sourceRoot":"","sources":["../../../../src/overlay/popper/base/dismissal_decorator.tsx"],"names":[],"mappings":"AAKA,oBAAY,eAAe;IACzB,UAAU,cAAc;IACxB,WAAW,eAAe;IAC1B,WAAW,eAAe;IAC1B,UAAU,cAAc;CACzB;AAED,MAAM,WAAW,6BAA6B;IAC5C,UAAU,CAAC,EAAE,eAAe,EAAE,CAAC;IAC/B,WAAW,CAAC,EAAE,CAAC,SAAS,EAAE,eAAe,KAAK,IAAI,CAAC;IACnD,WAAW,CAAC,EAAE,CAAC,SAAS,EAAE,eAAe,EAAE,MAAM,EAAE,WAAW,KAAK,OAAO,CAAC;IAC3E,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,EAAE,CAAC;CAC/C;AAED,eAAO,MAAM,wBAAwB;;+CA4DnC,CAAC"}
|
|
@@ -0,0 +1,69 @@
|
|
|
1
|
+
import { jsxs as L, Fragment as m, jsx as l } from "react/jsx-runtime";
|
|
2
|
+
import { forwardRef as C } from "react";
|
|
3
|
+
import { ClickAwayListener as k } from "../../../utils/click_away_listener.js";
|
|
4
|
+
import { ScrollAwayListener as v } from "../../../utils/scroll_away_listener.js";
|
|
5
|
+
import { MouseLeaveRegion as E } from "../../../utils/mouse_leave_region.js";
|
|
6
|
+
var d = /* @__PURE__ */ ((e) => (e.CLICK_AWAY = "clickAway", e.SCROLL_AWAY = "scrollAway", e.MOUSE_LEAVE = "mouseLeave", e.VEIL_CLICK = "veilClick", e))(d || {});
|
|
7
|
+
const I = C(function({ onDismissal: a, isException: A, dismissals: r = [], children: s, acceptedRefs: i = [] }, h) {
|
|
8
|
+
const u = r.includes(
|
|
9
|
+
"clickAway"
|
|
10
|
+
/* CLICK_AWAY */
|
|
11
|
+
), f = r.includes(
|
|
12
|
+
"scrollAway"
|
|
13
|
+
/* SCROLL_AWAY */
|
|
14
|
+
), w = r.includes(
|
|
15
|
+
"mouseLeave"
|
|
16
|
+
/* MOUSE_LEAVE */
|
|
17
|
+
), n = (c) => () => {
|
|
18
|
+
a?.(c);
|
|
19
|
+
};
|
|
20
|
+
function t(c) {
|
|
21
|
+
return c in r ? (y) => A?.(c, y) ?? !1 : () => !1;
|
|
22
|
+
}
|
|
23
|
+
let o = /* @__PURE__ */ L(m, { children: [
|
|
24
|
+
s,
|
|
25
|
+
w && /* @__PURE__ */ l(
|
|
26
|
+
E,
|
|
27
|
+
{
|
|
28
|
+
elementsRefs: i,
|
|
29
|
+
onMouseLeave: n(
|
|
30
|
+
"mouseLeave"
|
|
31
|
+
/* MOUSE_LEAVE */
|
|
32
|
+
)
|
|
33
|
+
}
|
|
34
|
+
)
|
|
35
|
+
] });
|
|
36
|
+
return f && (o = /* @__PURE__ */ l(
|
|
37
|
+
v,
|
|
38
|
+
{
|
|
39
|
+
onScrollAway: n(
|
|
40
|
+
"scrollAway"
|
|
41
|
+
/* SCROLL_AWAY */
|
|
42
|
+
),
|
|
43
|
+
isException: t(
|
|
44
|
+
"scrollAway"
|
|
45
|
+
/* SCROLL_AWAY */
|
|
46
|
+
),
|
|
47
|
+
children: o
|
|
48
|
+
}
|
|
49
|
+
)), u && (o = /* @__PURE__ */ l(
|
|
50
|
+
k,
|
|
51
|
+
{
|
|
52
|
+
onClickAway: n(
|
|
53
|
+
"clickAway"
|
|
54
|
+
/* CLICK_AWAY */
|
|
55
|
+
),
|
|
56
|
+
refs: i,
|
|
57
|
+
isException: t(
|
|
58
|
+
"clickAway"
|
|
59
|
+
/* CLICK_AWAY */
|
|
60
|
+
),
|
|
61
|
+
children: o
|
|
62
|
+
}
|
|
63
|
+
)), o;
|
|
64
|
+
});
|
|
65
|
+
export {
|
|
66
|
+
d as PopperDismissal,
|
|
67
|
+
I as PopperDismissalDecorator
|
|
68
|
+
};
|
|
69
|
+
//# sourceMappingURL=dismissal_decorator.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dismissal_decorator.js","sources":["../../../../src/overlay/popper/base/dismissal_decorator.tsx"],"sourcesContent":["import { forwardRef, type PropsWithChildren } from 'react';\nimport { ClickAwayListener } from '../../../utils/click_away_listener.js';\nimport { ScrollAwayListener } from '../../../utils/scroll_away_listener.js';\nimport { MouseLeaveRegion } from '../../../utils/mouse_leave_region.js';\n\nexport enum PopperDismissal {\n CLICK_AWAY = 'clickAway',\n SCROLL_AWAY = 'scrollAway',\n MOUSE_LEAVE = 'mouseLeave',\n VEIL_CLICK = 'veilClick',\n}\n\nexport interface PopperDismissalDecoratorProps {\n dismissals?: PopperDismissal[];\n onDismissal?: (dismissal: PopperDismissal) => void;\n isException?: (dismissal: PopperDismissal, target: HTMLElement) => boolean;\n acceptedRefs?: React.RefObject<HTMLElement>[];\n}\n\nexport const PopperDismissalDecorator = forwardRef<\n HTMLElement,\n PropsWithChildren<PopperDismissalDecoratorProps>\n>(function DismissalDecorator(\n { onDismissal, isException, dismissals = [], children, acceptedRefs = [] },\n ref\n) {\n const hasClickAway = dismissals.includes(PopperDismissal.CLICK_AWAY);\n const hasScrollAway = dismissals.includes(PopperDismissal.SCROLL_AWAY);\n const hasMouseLeave = dismissals.includes(PopperDismissal.MOUSE_LEAVE);\n // TODO:\n // const hasVeilClick = dismissals.includes(PopperDismissal.VEIL_CLICK);\n\n const buildHandleDismissal = (dismissal: PopperDismissal) => () => {\n onDismissal?.(dismissal);\n };\n\n function buildExceptionHandler(dismissal: PopperDismissal) {\n if (dismissal in dismissals) {\n return target => isException?.(dismissal, target) ?? false;\n }\n return () => false;\n }\n\n let content: React.ReactNode = (\n <>\n {children}\n {hasMouseLeave && (\n <MouseLeaveRegion\n elementsRefs={acceptedRefs}\n onMouseLeave={buildHandleDismissal(PopperDismissal.MOUSE_LEAVE)}\n />\n )}\n </>\n );\n\n if (hasScrollAway) {\n content = (\n <ScrollAwayListener\n onScrollAway={buildHandleDismissal(PopperDismissal.SCROLL_AWAY)}\n isException={buildExceptionHandler(PopperDismissal.SCROLL_AWAY)}\n >\n {content}\n </ScrollAwayListener>\n );\n }\n\n if (hasClickAway) {\n content = (\n <ClickAwayListener\n onClickAway={buildHandleDismissal(PopperDismissal.CLICK_AWAY)}\n refs={acceptedRefs}\n isException={buildExceptionHandler(PopperDismissal.CLICK_AWAY)}\n >\n {content}\n </ClickAwayListener>\n );\n }\n\n return content;\n});\n"],"names":["PopperDismissal","PopperDismissalDecorator","forwardRef","onDismissal","isException","dismissals","children","acceptedRefs","ref","hasClickAway","hasScrollAway","hasMouseLeave","buildHandleDismissal","dismissal","buildExceptionHandler","target","content","jsxs","Fragment","jsx","MouseLeaveRegion","ScrollAwayListener","ClickAwayListener"],"mappings":";;;;;AAKO,IAAKA,sBAAAA,OACVA,EAAA,aAAa,aACbA,EAAA,cAAc,cACdA,EAAA,cAAc,cACdA,EAAA,aAAa,aAJHA,IAAAA,KAAA,CAAA,CAAA;AAcL,MAAMC,IAA2BC,EAGtC,SACA,EAAE,aAAAC,GAAa,aAAAC,GAAa,YAAAC,IAAa,CAAA,GAAI,UAAAC,GAAU,cAAAC,IAAe,CAAA,EAAC,GACvEC,GACA;AACA,QAAMC,IAAeJ,EAAW;AAAA,IAAS;AAAA;AAAA,EAAA,GACnCK,IAAgBL,EAAW;AAAA,IAAS;AAAA;AAAA,EAAA,GACpCM,IAAgBN,EAAW;AAAA,IAAS;AAAA;AAAA,EAAA,GAIpCO,IAAuB,CAACC,MAA+B,MAAM;AACjE,IAAAV,IAAcU,CAAS;AAAA,EACzB;AAEA,WAASC,EAAsBD,GAA4B;AACzD,WAAIA,KAAaR,IACR,CAAAU,MAAUX,IAAcS,GAAWE,CAAM,KAAK,KAEhD,MAAM;AAAA,EACf;AAEA,MAAIC,IACF,gBAAAC,EAAAC,GAAA,EACG,UAAA;AAAA,IAAAZ;AAAA,IACAK,KACC,gBAAAQ;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,cAAcb;AAAA,QACd,cAAcK;AAAA,UAAqB;AAAA;AAAA,QAAA;AAAA,MAA2B;AAAA,IAAA;AAAA,EAChE,GAEJ;AAGF,SAAIF,MACFM,IACE,gBAAAG;AAAA,IAACE;AAAA,IAAA;AAAA,MACC,cAAcT;AAAA,QAAqB;AAAA;AAAA,MAAA;AAAA,MACnC,aAAaE;AAAA,QAAsB;AAAA;AAAA,MAAA;AAAA,MAElC,UAAAE;AAAA,IAAA;AAAA,EAAA,IAKHP,MACFO,IACE,gBAAAG;AAAA,IAACG;AAAA,IAAA;AAAA,MACC,aAAaV;AAAA,QAAqB;AAAA;AAAA,MAAA;AAAA,MAClC,MAAML;AAAA,MACN,aAAaO;AAAA,QAAsB;AAAA;AAAA,MAAA;AAAA,MAElC,UAAAE;AAAA,IAAA;AAAA,EAAA,IAKAA;AACT,CAAC;"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { BasePopperProps } from './base/base_popper.js';
|
|
2
|
+
import { TetheredProps } from '../tethered/tethered.js';
|
|
3
|
+
export type ContextPopperProps = Omit<BasePopperProps, 'open' | 'onDismissal'> & Omit<TetheredProps, 'anchor'> & {
|
|
4
|
+
anchorElement: React.RefObject<HTMLElement>;
|
|
5
|
+
};
|
|
6
|
+
export declare const ContextPopper: import('react').ForwardRefExoticComponent<Omit<BasePopperProps, "open" | "onDismissal"> & Omit<TetheredProps, "anchor"> & {
|
|
7
|
+
anchorElement: React.RefObject<HTMLElement>;
|
|
8
|
+
} & {
|
|
9
|
+
children?: import('react').ReactNode | undefined;
|
|
10
|
+
} & import('react').RefAttributes<HTMLDivElement>>;
|
|
11
|
+
//# sourceMappingURL=context_popper.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"context_popper.d.ts","sourceRoot":"","sources":["../../../src/overlay/popper/context_popper.tsx"],"names":[],"mappings":"AACA,OAAO,EAAc,KAAK,eAAe,EAAE,MAAM,uBAAuB,CAAC;AACzE,OAAO,EAAY,KAAK,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAIvE,MAAM,MAAM,kBAAkB,GAAG,IAAI,CAAC,eAAe,EAAE,MAAM,GAAG,aAAa,CAAC,GAC5E,IAAI,CAAC,aAAa,EAAE,QAAQ,CAAC,GAAG;IAC9B,aAAa,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;CAC7C,CAAC;AAEJ,eAAO,MAAM,aAAa;mBAHP,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC;;;kDAkC7C,CAAC"}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import { jsx as r } from "react/jsx-runtime";
|
|
2
|
+
import { forwardRef as C } from "react";
|
|
3
|
+
import { BasePopper as x } from "./base/base_popper.js";
|
|
4
|
+
import { Tethered as u } from "../tethered/tethered.js";
|
|
5
|
+
import { useContextTrigger as A } from "./hooks/use_context_trigger.js";
|
|
6
|
+
import { PopperDismissal as e } from "./base/dismissal_decorator.js";
|
|
7
|
+
const R = C(function({
|
|
8
|
+
anchorElement: t,
|
|
9
|
+
restoreFocus: p,
|
|
10
|
+
children: n,
|
|
11
|
+
acceptedRefs: i = [],
|
|
12
|
+
isException: m,
|
|
13
|
+
dismissals: s = [e.CLICK_AWAY, e.SCROLL_AWAY],
|
|
14
|
+
...f
|
|
15
|
+
}, c) {
|
|
16
|
+
const { isOpen: l, close: a, rectangle: o } = A(t);
|
|
17
|
+
return /* @__PURE__ */ r(
|
|
18
|
+
x,
|
|
19
|
+
{
|
|
20
|
+
open: l && o != null,
|
|
21
|
+
onDismissal: a,
|
|
22
|
+
restoreFocus: p,
|
|
23
|
+
dismissals: s,
|
|
24
|
+
acceptedRefs: i,
|
|
25
|
+
isException: m,
|
|
26
|
+
children: /* @__PURE__ */ r(u, { ref: c, anchor: o, ...f, children: n })
|
|
27
|
+
}
|
|
28
|
+
);
|
|
29
|
+
});
|
|
30
|
+
export {
|
|
31
|
+
R as ContextPopper
|
|
32
|
+
};
|
|
33
|
+
//# sourceMappingURL=context_popper.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"context_popper.js","sources":["../../../src/overlay/popper/context_popper.tsx"],"sourcesContent":["import { forwardRef, type PropsWithChildren } from 'react';\nimport { BasePopper, type BasePopperProps } from './base/base_popper.js';\nimport { Tethered, type TetheredProps } from '../tethered/tethered.js';\nimport { useContextTrigger } from './hooks/use_context_trigger.js';\nimport { PopperDismissal } from './base/dismissal_decorator.js';\n\nexport type ContextPopperProps = Omit<BasePopperProps, 'open' | 'onDismissal'> &\n Omit<TetheredProps, 'anchor'> & {\n anchorElement: React.RefObject<HTMLElement>;\n };\n\nexport const ContextPopper = forwardRef<\n HTMLDivElement,\n PropsWithChildren<ContextPopperProps>\n>(function ContextPopper(\n {\n anchorElement,\n restoreFocus,\n children,\n acceptedRefs = [],\n isException,\n dismissals = [PopperDismissal.CLICK_AWAY, PopperDismissal.SCROLL_AWAY],\n ...tetheredProps\n },\n ref\n) {\n const { isOpen, close, rectangle } = useContextTrigger(anchorElement);\n\n return (\n <BasePopper\n open={isOpen && rectangle != null}\n onDismissal={close}\n restoreFocus={restoreFocus}\n dismissals={dismissals}\n acceptedRefs={acceptedRefs}\n isException={isException}\n >\n <Tethered ref={ref} anchor={rectangle} {...tetheredProps}>\n {children}\n </Tethered>\n </BasePopper>\n );\n});\n"],"names":["ContextPopper","forwardRef","anchorElement","restoreFocus","children","acceptedRefs","isException","dismissals","PopperDismissal","tetheredProps","ref","isOpen","close","rectangle","useContextTrigger","jsx","BasePopper","Tethered"],"mappings":";;;;;;AAWO,MAAMA,IAAgBC,EAG3B,SACA;AAAA,EACE,eAAAC;AAAA,EACA,cAAAC;AAAA,EACA,UAAAC;AAAA,EACA,cAAAC,IAAe,CAAA;AAAA,EACf,aAAAC;AAAA,EACA,YAAAC,IAAa,CAACC,EAAgB,YAAYA,EAAgB,WAAW;AAAA,EACrE,GAAGC;AACL,GACAC,GACA;AACA,QAAM,EAAE,QAAAC,GAAQ,OAAAC,GAAO,WAAAC,EAAA,IAAcC,EAAkBZ,CAAa;AAEpE,SACE,gBAAAa;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAML,KAAUE,KAAa;AAAA,MAC7B,aAAaD;AAAA,MACb,cAAAT;AAAA,MACA,YAAAI;AAAA,MACA,cAAAF;AAAA,MACA,aAAAC;AAAA,MAEA,4BAACW,GAAA,EAAS,KAAAP,GAAU,QAAQG,GAAY,GAAGJ,GACxC,UAAAL,EAAA,CACH;AAAA,IAAA;AAAA,EAAA;AAGN,CAAC;"}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { BasePopperProps } from './base/base_popper.js';
|
|
2
|
+
import { ElementTetheredProps } from '../tethered/element_tethered.js';
|
|
3
|
+
export type ElementPopperProps = BasePopperProps & ElementTetheredProps;
|
|
4
|
+
export declare const ElementPopper: import('react').ForwardRefExoticComponent<BasePopperProps & ElementTetheredProps & {
|
|
5
|
+
children?: import('react').ReactNode | undefined;
|
|
6
|
+
} & import('react').RefAttributes<HTMLDivElement>>;
|
|
7
|
+
//# sourceMappingURL=element_popper.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"element_popper.d.ts","sourceRoot":"","sources":["../../../src/overlay/popper/element_popper.tsx"],"names":[],"mappings":"AACA,OAAO,EAAc,KAAK,eAAe,EAAE,MAAM,uBAAuB,CAAC;AACzE,OAAO,EAEL,KAAK,oBAAoB,EAC1B,MAAM,iCAAiC,CAAC;AAEzC,MAAM,MAAM,kBAAkB,GAAG,eAAe,GAAG,oBAAoB,CAAC;AAExE,eAAO,MAAM,aAAa;;kDAgCxB,CAAC"}
|