Skip to content

Commit db9e494

Browse files
committed
more progress
1 parent 45979d4 commit db9e494

File tree

5 files changed

+350
-295
lines changed

5 files changed

+350
-295
lines changed

packages/floating-ui-svelte/src/hooks/use-click.svelte.ts

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -52,7 +52,7 @@ function isSpaceIgnored(element: ReferenceType | null) {
5252
return isTypeableElement(element);
5353
}
5454

55-
class ClickState {
55+
class ClickInteraction {
5656
#enabled = $derived.by(() => this.options.enabled ?? "true");
5757
#eventOption = $derived.by(() => this.options.event ?? "click");
5858
#toggle = $derived.by(() => this.options.toggle ?? true);
@@ -175,10 +175,14 @@ class ClickState {
175175
onkeyup: this.#onkeyup,
176176
};
177177
});
178+
179+
get enabled() {
180+
return this.#enabled;
181+
}
178182
}
179183

180184
function useClick(context: FloatingContext, options: UseClickOptions = {}) {
181-
return new ClickState(context, options);
185+
return new ClickInteraction(context, options);
182186
}
183187

184188
export type { UseClickOptions };

packages/floating-ui-svelte/src/hooks/use-dismiss.svelte.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -114,7 +114,7 @@ interface UseDismissOptions {
114114
capture?: boolean | { escapeKey?: boolean; outsidePress?: boolean };
115115
}
116116

117-
class DismissState {
117+
class DismissInteraction {
118118
#enabled = $derived.by(() => this.options.enabled ?? true);
119119
#escapeKey = $derived.by(() => this.options.escapeKey ?? true);
120120
#unstable_outsidePress = $derived.by(() => this.options.outsidePress ?? true);
@@ -486,8 +486,8 @@ class DismissState {
486486
}
487487

488488
function useDismiss(context: FloatingContext, options: UseDismissOptions = {}) {
489-
return new DismissState(context, options);
489+
return new DismissInteraction(context, options);
490490
}
491491

492492
export type { UseDismissOptions };
493-
export { useDismiss, DismissState };
493+
export { useDismiss, DismissInteraction as DismissState };

packages/floating-ui-svelte/src/hooks/use-floating.svelte.ts

Lines changed: 56 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,9 @@
11
import { isElement } from "@floating-ui/utils/dom";
22
import { useFloatingTree } from "../components/floating-tree/hooks.svelte.js";
33
import type {
4+
ContextData,
45
ExtendedElements,
6+
FloatingEvents,
57
FloatingTreeType,
68
NarrowedElement,
79
OpenChangeReason,
@@ -12,6 +14,8 @@ import {
1214
PositionState,
1315
type UsePositionOptions,
1416
} from "./use-position.svelte.js";
17+
import type { Placement, Strategy } from "@floating-ui/utils";
18+
import type { MiddlewareData } from "@floating-ui/dom";
1519

1620
interface UseFloatingOptions<RT extends ReferenceType = ReferenceType>
1721
extends Omit<UsePositionOptions<RT>, "elements"> {
@@ -47,9 +51,59 @@ type FloatingContextOptions<RT extends ReferenceType = ReferenceType> = {
4751
getElements: (state: FloatingState<RT>) => ExtendedElements<RT>;
4852
};
4953

50-
class FloatingContext<RT extends ReferenceType = ReferenceType> {
54+
interface FloatingContextData<RT extends ReferenceType = ReferenceType> {
55+
elements: ExtendedElements<RT>;
56+
x: number;
57+
y: number;
58+
placement: Placement;
59+
strategy: Strategy;
60+
middlewareData: MiddlewareData;
61+
isPositioned: boolean;
62+
update: () => Promise<void>;
63+
floatingStyles: string;
64+
onOpenChange: (
65+
open: boolean,
66+
event?: Event,
67+
reason?: OpenChangeReason,
68+
) => void;
69+
open: boolean;
70+
data: ContextData<RT>;
71+
floatingId: string;
72+
events: FloatingEvents;
73+
nodeId: string | undefined;
74+
}
75+
76+
class FloatingContext<RT extends ReferenceType = ReferenceType>
77+
implements FloatingContextData<RT>
78+
{
5179
constructor(private readonly opts: FloatingContextOptions<RT>) {}
5280

81+
/**
82+
* INTERNAL ONLY. DO NOT USE.
83+
*
84+
* @internal
85+
*/
86+
// prefix with `z` to push to bottom of intellisense
87+
readonly z_internal_current: FloatingContextData<RT> = $derived.by(() => {
88+
return {
89+
elements: this.opts.getElements(this.opts.floating),
90+
x: this.opts.floating.x,
91+
y: this.opts.floating.y,
92+
placement: this.opts.floating.placement,
93+
strategy: this.opts.floating.strategy,
94+
middlewareData: this.opts.floating.middlewareData,
95+
isPositioned: this.opts.floating.isPositioned,
96+
update: this.opts.floating.update,
97+
floatingStyles: this.opts.floating.floatingStyles,
98+
onOpenChange: this.opts.rootContext.onOpenChange,
99+
open: this.opts.rootContext.open,
100+
data: this.opts.rootContext.data,
101+
floatingId: this.opts.rootContext.floatingId,
102+
events: this.opts.rootContext.events,
103+
nodeId: this.opts.floatingOptions.nodeId,
104+
};
105+
});
106+
53107
get elements() {
54108
return this.opts.getElements(this.opts.floating);
55109
}
@@ -251,4 +305,4 @@ function useFloating<RT extends ReferenceType = ReferenceType>(
251305
}
252306

253307
export { FloatingState, FloatingContext, useFloating };
254-
export type { UseFloatingOptions };
308+
export type { UseFloatingOptions, FloatingContextData };

packages/floating-ui-svelte/src/hooks/use-focus.svelte.ts

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ interface UseFocusOptions {
2929
visibleOnly?: boolean;
3030
}
3131

32-
class FocusState {
32+
class FocusInteraction {
3333
#enabled = $derived.by(() => this.options.enabled ?? true);
3434
#visibleOnly = $derived.by(() => this.options.visibleOnly ?? true);
3535
#blockFocus = false;
@@ -173,11 +173,15 @@ class FocusState {
173173
onblur: this.#onblur,
174174
};
175175
});
176+
177+
get enabled() {
178+
return this.#enabled;
179+
}
176180
}
177181

178182
function useFocus(context: FloatingContext, options: UseFocusOptions = {}) {
179-
return new FocusState(context, options);
183+
return new FocusInteraction(context, options);
180184
}
181185

182186
export type { UseFocusOptions };
183-
export { useFocus, FocusState };
187+
export { useFocus, FocusInteraction as FocusState };

0 commit comments

Comments
 (0)