@lattice-ui/tooltip 0.3.2 → 0.4.1

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.
@@ -36,7 +36,6 @@ local function TooltipContentImpl(props)
36
36
  enabled = props.enabled,
37
37
  modal = false,
38
38
  onDismiss = props.onDismiss,
39
- onEscapeKeyDown = props.onEscapeKeyDown,
40
39
  onInteractOutside = props.onInteractOutside,
41
40
  onPointerDownOutside = props.onPointerDownOutside,
42
41
  }, React.createElement(Slot, {
@@ -50,7 +49,6 @@ local function TooltipContentImpl(props)
50
49
  enabled = props.enabled,
51
50
  modal = false,
52
51
  onDismiss = props.onDismiss,
53
- onEscapeKeyDown = props.onEscapeKeyDown,
54
52
  onInteractOutside = props.onInteractOutside,
55
53
  onPointerDownOutside = props.onPointerDownOutside,
56
54
  }, React.createElement("frame", {
@@ -79,7 +77,6 @@ local function TooltipContent(props)
79
77
  enabled = open,
80
78
  offset = props.offset,
81
79
  onDismiss = handleDismiss,
82
- onEscapeKeyDown = props.onEscapeKeyDown,
83
80
  onInteractOutside = props.onInteractOutside,
84
81
  onPointerDownOutside = props.onPointerDownOutside,
85
82
  padding = props.padding,
@@ -96,7 +93,6 @@ local function TooltipContent(props)
96
93
  enabled = state.isPresent,
97
94
  offset = props.offset,
98
95
  onDismiss = handleDismiss,
99
- onEscapeKeyDown = props.onEscapeKeyDown,
100
96
  onInteractOutside = props.onInteractOutside,
101
97
  onPointerDownOutside = props.onPointerDownOutside,
102
98
  padding = props.padding,
@@ -3,6 +3,9 @@ local TS = _G[script]
3
3
  local _core = TS.import(script, TS.getModule(script, "@lattice-ui", "core").out)
4
4
  local React = _core.React
5
5
  local Slot = _core.Slot
6
+ local _activity = TS.import(script, script.Parent, "activity")
7
+ local DEFAULT_TOOLTIP_TRIGGER_ACTIVITY_STATE = _activity.DEFAULT_TOOLTIP_TRIGGER_ACTIVITY_STATE
8
+ local updateTooltipTriggerActivity = _activity.updateTooltipTriggerActivity
6
9
  local useTooltipContext = TS.import(script, script.Parent, "context").useTooltipContext
7
10
  local function toGuiObject(instance)
8
11
  if not instance or not instance:IsA("GuiObject") then
@@ -12,33 +15,59 @@ local function toGuiObject(instance)
12
15
  end
13
16
  local function TooltipTrigger(props)
14
17
  local tooltipContext = useTooltipContext()
18
+ local activityStateRef = React.useRef(DEFAULT_TOOLTIP_TRIGGER_ACTIVITY_STATE)
15
19
  local setTriggerRef = React.useCallback(function(instance)
16
20
  tooltipContext.triggerRef.current = toGuiObject(instance)
17
21
  end, { tooltipContext.triggerRef })
18
- local handleOpen = React.useCallback(function()
22
+ local applyActivity = React.useCallback(function(kind, active)
23
+ local result = updateTooltipTriggerActivity(activityStateRef.current, kind, active)
24
+ activityStateRef.current = result.state
19
25
  if props.disabled then
26
+ if not active then
27
+ tooltipContext.close()
28
+ end
20
29
  return nil
21
30
  end
22
- tooltipContext.openWithDelay()
31
+ if result.action == "open" then
32
+ tooltipContext.openWithDelay()
33
+ return nil
34
+ end
35
+ if result.action == "close" then
36
+ tooltipContext.close()
37
+ end
23
38
  end, { props.disabled, tooltipContext })
24
- local handleClose = React.useCallback(function()
39
+ React.useEffect(function()
40
+ if not props.disabled then
41
+ return nil
42
+ end
43
+ activityStateRef.current = DEFAULT_TOOLTIP_TRIGGER_ACTIVITY_STATE
25
44
  tooltipContext.close()
26
- end, { tooltipContext })
45
+ end, { props.disabled, tooltipContext })
27
46
  local eventHandlers = React.useMemo(function()
28
47
  return {
29
- MouseEnter = handleOpen,
30
- MouseLeave = handleClose,
31
- SelectionGained = handleOpen,
32
- SelectionLost = handleClose,
48
+ MouseEnter = function()
49
+ return applyActivity("hover", true)
50
+ end,
51
+ MouseLeave = function()
52
+ return applyActivity("hover", false)
53
+ end,
54
+ SelectionGained = function()
55
+ return applyActivity("focus", true)
56
+ end,
57
+ SelectionLost = function()
58
+ return applyActivity("focus", false)
59
+ end,
33
60
  }
34
- end, { handleClose, handleOpen })
61
+ end, { applyActivity })
35
62
  if props.asChild then
36
63
  local child = props.children
37
64
  if not child then
38
65
  error("[TooltipTrigger] `asChild` requires a child element.")
39
66
  end
40
67
  return React.createElement(Slot, {
68
+ Active = props.disabled ~= true,
41
69
  Event = eventHandlers,
70
+ Selectable = props.disabled ~= true,
42
71
  ref = setTriggerRef,
43
72
  }, child)
44
73
  end
@@ -0,0 +1,11 @@
1
+ export type TooltipTriggerActivityKind = "hover" | "focus";
2
+ export type TooltipTriggerActivityState = {
3
+ hover: boolean;
4
+ focus: boolean;
5
+ };
6
+ export type TooltipTriggerActivityResult = {
7
+ action: "open" | "close" | "none";
8
+ state: TooltipTriggerActivityState;
9
+ };
10
+ export declare const DEFAULT_TOOLTIP_TRIGGER_ACTIVITY_STATE: TooltipTriggerActivityState;
11
+ export declare function updateTooltipTriggerActivity(state: TooltipTriggerActivityState, kind: TooltipTriggerActivityKind, active: boolean): TooltipTriggerActivityResult;
@@ -0,0 +1,33 @@
1
+ -- Compiled with roblox-ts v3.0.0
2
+ local DEFAULT_TOOLTIP_TRIGGER_ACTIVITY_STATE = {
3
+ hover = false,
4
+ focus = false,
5
+ }
6
+ local function updateTooltipTriggerActivity(state, kind, active)
7
+ local _object = table.clone(state)
8
+ setmetatable(_object, nil)
9
+ _object[kind] = active
10
+ local nextState = _object
11
+ local wasActive = state.hover or state.focus
12
+ local isActive = nextState.hover or nextState.focus
13
+ if not wasActive and isActive then
14
+ return {
15
+ action = "open",
16
+ state = nextState,
17
+ }
18
+ end
19
+ if wasActive and not isActive then
20
+ return {
21
+ action = "close",
22
+ state = nextState,
23
+ }
24
+ end
25
+ return {
26
+ action = "none",
27
+ state = nextState,
28
+ }
29
+ end
30
+ return {
31
+ updateTooltipTriggerActivity = updateTooltipTriggerActivity,
32
+ DEFAULT_TOOLTIP_TRIGGER_ACTIVITY_STATE = DEFAULT_TOOLTIP_TRIGGER_ACTIVITY_STATE,
33
+ }
@@ -44,7 +44,6 @@ export type TooltipContentProps = {
44
44
  placement?: PopperPlacement;
45
45
  offset?: Vector2;
46
46
  padding?: number;
47
- onEscapeKeyDown?: (event: LayerInteractEvent) => void;
48
47
  onPointerDownOutside?: (event: LayerInteractEvent) => void;
49
48
  onInteractOutside?: (event: LayerInteractEvent) => void;
50
49
  children?: React.ReactNode;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lattice-ui/tooltip",
3
- "version": "0.3.2",
3
+ "version": "0.4.1",
4
4
  "private": false,
5
5
  "main": "out/init.luau",
6
6
  "types": "out/index.d.ts",
@@ -9,9 +9,9 @@
9
9
  "README.md"
10
10
  ],
11
11
  "dependencies": {
12
- "@lattice-ui/core": "0.3.2",
13
- "@lattice-ui/popper": "0.3.2",
14
- "@lattice-ui/layer": "0.3.2"
12
+ "@lattice-ui/core": "0.4.1",
13
+ "@lattice-ui/popper": "0.4.1",
14
+ "@lattice-ui/layer": "0.4.1"
15
15
  },
16
16
  "devDependencies": {
17
17
  "@rbxts/react": "17.3.7-ts.1",