@atlaskit/top-layer 0.12.1 → 0.13.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/CHANGELOG.md +23 -0
- package/dist/cjs/animations/presets.js +5 -5
- package/dist/cjs/dialog/create-close-event.js +1 -1
- package/dist/cjs/dialog/dialog-content.js +5 -5
- package/dist/cjs/entry-points/focus.js +6 -4
- package/dist/cjs/entry-points/use-anchor-position-at-point.js +12 -0
- package/dist/cjs/focus/get-first-focusable.js +19 -0
- package/dist/cjs/focus/get-focusables.js +30 -0
- package/dist/cjs/focus/get-last-focusable.js +19 -0
- package/dist/cjs/focus/get-next-focusable.js +43 -0
- package/dist/cjs/focus/is-in-same-layer.js +23 -0
- package/dist/cjs/focus/is-nested-layer-focused.js +32 -0
- package/dist/cjs/focus/selectors.js +19 -0
- package/dist/cjs/focus/types.js +1 -0
- package/dist/cjs/internal/ensure-preset-styles.js +1 -1
- package/dist/cjs/internal/reduced-motion.js +1 -1
- package/dist/cjs/internal/resolve-placement.js +2 -2
- package/dist/cjs/internal/role-to-aria-has-popup.js +37 -0
- package/dist/cjs/internal/role-types.js +1 -97
- package/dist/cjs/internal/should-focus-into-popover.js +19 -0
- package/dist/cjs/internal/slot.js +3 -3
- package/dist/cjs/internal/use-anchor-position-at-point.js +127 -0
- package/dist/cjs/internal/use-anchor-position.js +22 -33
- package/dist/cjs/internal/use-animated-visibility.js +10 -10
- package/dist/cjs/internal/use-animation-preset.js +1 -1
- package/dist/cjs/internal/use-focus-wrap.js +8 -5
- package/dist/cjs/internal/use-initial-focus.js +4 -4
- package/dist/cjs/internal/use-preset-styles.js +1 -1
- package/dist/cjs/internal/use-width-from-anchor.js +4 -4
- package/dist/cjs/placement-map/index.js +2 -2
- package/dist/cjs/placement-map/legacy-placements.js +2 -101
- package/dist/cjs/placement-map/placement-mapping.js +103 -0
- package/dist/cjs/popover/create-close-event.js +1 -1
- package/dist/cjs/popover/popover.js +3 -3
- package/dist/cjs/popup/popup-content.js +8 -7
- package/dist/cjs/testing/polyfill.js +8 -8
- package/dist/cjs/testing/to-be-visible.js +5 -5
- package/dist/cjs/use-arrow-navigation/is-at-current-menu-level.js +19 -12
- package/dist/cjs/use-arrow-navigation/use-arrow-navigation.js +7 -5
- package/dist/cjs/use-simple-light-dismiss/index.js +3 -3
- package/dist/es2019/animations/presets.js +5 -5
- package/dist/es2019/dialog/create-close-event.js +1 -1
- package/dist/es2019/dialog/dialog-content.js +5 -5
- package/dist/es2019/entry-points/focus.js +3 -1
- package/dist/es2019/entry-points/use-anchor-position-at-point.js +1 -0
- package/dist/es2019/focus/get-first-focusable.js +14 -0
- package/dist/es2019/focus/get-focusables.js +19 -0
- package/dist/es2019/focus/get-last-focusable.js +14 -0
- package/dist/es2019/focus/get-next-focusable.js +38 -0
- package/dist/es2019/focus/is-in-same-layer.js +18 -0
- package/dist/es2019/focus/is-nested-layer-focused.js +28 -0
- package/dist/es2019/focus/selectors.js +11 -0
- package/dist/es2019/focus/types.js +0 -0
- package/dist/es2019/internal/ensure-preset-styles.js +1 -1
- package/dist/es2019/internal/reduced-motion.js +1 -1
- package/dist/es2019/internal/resolve-placement.js +2 -2
- package/dist/es2019/internal/role-to-aria-has-popup.js +32 -0
- package/dist/es2019/internal/role-types.js +0 -92
- package/dist/es2019/internal/should-focus-into-popover.js +14 -0
- package/dist/es2019/internal/slot.js +3 -3
- package/dist/es2019/internal/use-anchor-position-at-point.js +122 -0
- package/dist/es2019/internal/use-anchor-position.js +19 -19
- package/dist/es2019/internal/use-animated-visibility.js +10 -10
- package/dist/es2019/internal/use-animation-preset.js +1 -1
- package/dist/es2019/internal/use-focus-wrap.js +4 -1
- package/dist/es2019/internal/use-initial-focus.js +1 -1
- package/dist/es2019/internal/use-preset-styles.js +1 -1
- package/dist/es2019/internal/use-width-from-anchor.js +4 -4
- package/dist/es2019/placement-map/index.js +1 -1
- package/dist/es2019/placement-map/legacy-placements.js +1 -100
- package/dist/es2019/placement-map/placement-mapping.js +97 -0
- package/dist/es2019/popover/create-close-event.js +1 -1
- package/dist/es2019/popover/popover.js +3 -3
- package/dist/es2019/popup/popup-content.js +6 -5
- package/dist/es2019/testing/polyfill.js +8 -8
- package/dist/es2019/testing/to-be-visible.js +5 -5
- package/dist/es2019/use-arrow-navigation/is-at-current-menu-level.js +19 -12
- package/dist/es2019/use-arrow-navigation/use-arrow-navigation.js +3 -1
- package/dist/es2019/use-simple-light-dismiss/index.js +3 -3
- package/dist/esm/animations/presets.js +5 -5
- package/dist/esm/dialog/create-close-event.js +1 -1
- package/dist/esm/dialog/dialog-content.js +5 -5
- package/dist/esm/entry-points/focus.js +3 -1
- package/dist/esm/entry-points/use-anchor-position-at-point.js +1 -0
- package/dist/esm/focus/get-first-focusable.js +13 -0
- package/dist/esm/focus/get-focusables.js +24 -0
- package/dist/esm/focus/get-last-focusable.js +13 -0
- package/dist/esm/focus/get-next-focusable.js +37 -0
- package/dist/esm/focus/is-in-same-layer.js +17 -0
- package/dist/esm/focus/is-nested-layer-focused.js +27 -0
- package/dist/esm/focus/selectors.js +13 -0
- package/dist/esm/focus/types.js +0 -0
- package/dist/esm/internal/ensure-preset-styles.js +1 -1
- package/dist/esm/internal/reduced-motion.js +1 -1
- package/dist/esm/internal/resolve-placement.js +2 -2
- package/dist/esm/internal/role-to-aria-has-popup.js +31 -0
- package/dist/esm/internal/role-types.js +0 -90
- package/dist/esm/internal/should-focus-into-popover.js +13 -0
- package/dist/esm/internal/slot.js +3 -3
- package/dist/esm/internal/use-anchor-position-at-point.js +122 -0
- package/dist/esm/internal/use-anchor-position.js +22 -33
- package/dist/esm/internal/use-animated-visibility.js +10 -10
- package/dist/esm/internal/use-animation-preset.js +1 -1
- package/dist/esm/internal/use-focus-wrap.js +4 -1
- package/dist/esm/internal/use-initial-focus.js +1 -1
- package/dist/esm/internal/use-preset-styles.js +1 -1
- package/dist/esm/internal/use-width-from-anchor.js +4 -4
- package/dist/esm/placement-map/index.js +1 -1
- package/dist/esm/placement-map/legacy-placements.js +1 -100
- package/dist/esm/placement-map/placement-mapping.js +97 -0
- package/dist/esm/popover/create-close-event.js +1 -1
- package/dist/esm/popover/popover.js +3 -3
- package/dist/esm/popup/popup-content.js +6 -5
- package/dist/esm/testing/polyfill.js +8 -8
- package/dist/esm/testing/to-be-visible.js +5 -5
- package/dist/esm/use-arrow-navigation/is-at-current-menu-level.js +19 -12
- package/dist/esm/use-arrow-navigation/use-arrow-navigation.js +3 -1
- package/dist/esm/use-simple-light-dismiss/index.js +3 -3
- package/dist/types/dialog/create-close-event.d.ts +1 -1
- package/dist/types/dialog/types.d.ts +8 -0
- package/dist/types/entry-points/focus.d.ts +4 -2
- package/dist/types/entry-points/use-anchor-position-at-point.d.ts +1 -0
- package/dist/types/focus/get-first-focusable.d.ts +8 -0
- package/dist/types/focus/get-focusables.d.ts +13 -0
- package/dist/types/focus/get-last-focusable.d.ts +8 -0
- package/dist/types/focus/get-next-focusable.d.ts +13 -0
- package/dist/types/focus/is-in-same-layer.d.ts +8 -0
- package/dist/types/focus/is-nested-layer-focused.d.ts +8 -0
- package/dist/types/focus/selectors.d.ts +4 -0
- package/dist/types/focus/types.d.ts +5 -0
- package/dist/types/internal/reduced-motion.d.ts +1 -1
- package/dist/types/internal/resolve-placement.d.ts +2 -2
- package/dist/types/internal/role-to-aria-has-popup.d.ts +13 -0
- package/dist/types/internal/role-types.d.ts +0 -19
- package/dist/types/internal/should-focus-into-popover.d.ts +8 -0
- package/dist/types/internal/slot.d.ts +4 -4
- package/dist/types/internal/use-anchor-position-at-point.d.ts +62 -0
- package/dist/types/internal/use-anchor-position.d.ts +6 -1
- package/dist/types/internal/use-animated-visibility.d.ts +3 -3
- package/dist/types/internal/use-animation-preset.d.ts +1 -1
- package/dist/types/internal/use-preset-styles.d.ts +1 -1
- package/dist/types/internal/use-width-from-anchor.d.ts +2 -2
- package/dist/types/placement-map/index.d.ts +1 -1
- package/dist/types/placement-map/legacy-placements.d.ts +0 -12
- package/dist/types/placement-map/placement-mapping.d.ts +13 -0
- package/dist/types/popover/create-close-event.d.ts +1 -1
- package/dist/types/popover/popover.d.ts +1 -1
- package/dist/types/popup/popup-context.d.ts +1 -1
- package/dist/types/testing/to-be-visible.d.ts +3 -3
- package/dist/types/use-arrow-navigation/use-arrow-navigation.d.ts +1 -1
- package/dist/types/use-simple-light-dismiss/index.d.ts +1 -1
- package/dist/types-ts4.5/dialog/create-close-event.d.ts +1 -1
- package/dist/types-ts4.5/dialog/types.d.ts +8 -0
- package/dist/types-ts4.5/entry-points/focus.d.ts +4 -2
- package/dist/types-ts4.5/entry-points/use-anchor-position-at-point.d.ts +1 -0
- package/dist/types-ts4.5/focus/get-first-focusable.d.ts +8 -0
- package/dist/types-ts4.5/focus/get-focusables.d.ts +13 -0
- package/dist/types-ts4.5/focus/get-last-focusable.d.ts +8 -0
- package/dist/types-ts4.5/focus/get-next-focusable.d.ts +13 -0
- package/dist/types-ts4.5/focus/is-in-same-layer.d.ts +8 -0
- package/dist/types-ts4.5/focus/is-nested-layer-focused.d.ts +8 -0
- package/dist/types-ts4.5/focus/selectors.d.ts +4 -0
- package/dist/types-ts4.5/focus/types.d.ts +5 -0
- package/dist/types-ts4.5/internal/reduced-motion.d.ts +1 -1
- package/dist/types-ts4.5/internal/resolve-placement.d.ts +2 -2
- package/dist/types-ts4.5/internal/role-to-aria-has-popup.d.ts +13 -0
- package/dist/types-ts4.5/internal/role-types.d.ts +0 -19
- package/dist/types-ts4.5/internal/should-focus-into-popover.d.ts +8 -0
- package/dist/types-ts4.5/internal/slot.d.ts +4 -4
- package/dist/types-ts4.5/internal/use-anchor-position-at-point.d.ts +62 -0
- package/dist/types-ts4.5/internal/use-anchor-position.d.ts +6 -1
- package/dist/types-ts4.5/internal/use-animated-visibility.d.ts +3 -3
- package/dist/types-ts4.5/internal/use-animation-preset.d.ts +1 -1
- package/dist/types-ts4.5/internal/use-preset-styles.d.ts +1 -1
- package/dist/types-ts4.5/internal/use-width-from-anchor.d.ts +2 -2
- package/dist/types-ts4.5/placement-map/index.d.ts +1 -1
- package/dist/types-ts4.5/placement-map/legacy-placements.d.ts +0 -12
- package/dist/types-ts4.5/placement-map/placement-mapping.d.ts +13 -0
- package/dist/types-ts4.5/popover/create-close-event.d.ts +1 -1
- package/dist/types-ts4.5/popover/popover.d.ts +1 -1
- package/dist/types-ts4.5/popup/popup-context.d.ts +1 -1
- package/dist/types-ts4.5/testing/to-be-visible.d.ts +3 -3
- package/dist/types-ts4.5/use-arrow-navigation/use-arrow-navigation.d.ts +1 -1
- package/dist/types-ts4.5/use-simple-light-dismiss/index.d.ts +1 -1
- package/package.json +1 -1
- package/use-anchor-position-at-point/package.json +17 -0
- package/dist/cjs/focus/focus.js +0 -169
- package/dist/cjs/focus/index.js +0 -24
- package/dist/es2019/focus/focus.js +0 -158
- package/dist/es2019/focus/index.js +0 -1
- package/dist/esm/focus/focus.js +0 -160
- package/dist/esm/focus/index.js +0 -1
- package/dist/types/focus/focus.d.ts +0 -50
- package/dist/types/focus/index.d.ts +0 -2
- package/dist/types-ts4.5/focus/focus.d.ts +0 -50
- package/dist/types-ts4.5/focus/index.d.ts +0 -2
|
@@ -34,7 +34,7 @@ import { type TPlacementOptions } from '../internal/resolve-placement';
|
|
|
34
34
|
* comparison is used internally so re-runs are skipped when the resolved
|
|
35
35
|
* placement shape is unchanged.
|
|
36
36
|
*/
|
|
37
|
-
export declare function useAnchorPosition({ anchorRef, popoverRef, placement, forceFallbackPositioning, }: {
|
|
37
|
+
export declare function useAnchorPosition({ anchorRef, popoverRef, placement, forceFallbackPositioning, isEnabled, }: {
|
|
38
38
|
/**
|
|
39
39
|
* Element to position relative to.
|
|
40
40
|
*/
|
|
@@ -70,4 +70,9 @@ export declare function useAnchorPosition({ anchorRef, popoverRef, placement, fo
|
|
|
70
70
|
* behavior in any environment, including production.
|
|
71
71
|
*/
|
|
72
72
|
forceFallbackPositioning?: boolean;
|
|
73
|
+
/**
|
|
74
|
+
* When `false`, the hook is a no-op and applies no positioning.
|
|
75
|
+
* Defaults to `true`.
|
|
76
|
+
*/
|
|
77
|
+
isEnabled?: boolean;
|
|
73
78
|
}): void;
|
|
@@ -44,19 +44,19 @@ type TUseAnimatedVisibilityResult = {
|
|
|
44
44
|
*
|
|
45
45
|
* Used by both `Popover` and `Dialog` to share the same animation lifecycle
|
|
46
46
|
* logic. Those components own their own show/hide mechanisms (showPopover /
|
|
47
|
-
* hidePopover vs showModal / close) and event handling
|
|
47
|
+
* hidePopover vs showModal / close) and event handling - this hook only
|
|
48
48
|
* manages the relationship between `isOpen` and when children are rendered.
|
|
49
49
|
*
|
|
50
50
|
* ## Problem
|
|
51
51
|
*
|
|
52
52
|
* We want to delay the unmount of children until a CSS exit transition has
|
|
53
53
|
* finished playing. If we unmount children the moment `isOpen` becomes
|
|
54
|
-
* `false`, the exit animation is never visible
|
|
54
|
+
* `false`, the exit animation is never visible - the content just disappears.
|
|
55
55
|
*
|
|
56
56
|
* ## How it works
|
|
57
57
|
*
|
|
58
58
|
* `showChildren` tracks whether the consumer's children should be in the DOM.
|
|
59
|
-
* It does not mirror `isOpen` exactly
|
|
59
|
+
* It does not mirror `isOpen` exactly - it intentionally lags behind during
|
|
60
60
|
* exit animations:
|
|
61
61
|
*
|
|
62
62
|
* ```
|
|
@@ -5,7 +5,7 @@ type TPresetWithCssAndName = {
|
|
|
5
5
|
/**
|
|
6
6
|
* Normalizes the `animate` prop to a preset (or null) and ensures its CSS
|
|
7
7
|
* is injected once into document.head. Used by PopupContent, Popover, and
|
|
8
|
-
* DialogContent so they
|
|
8
|
+
* DialogContent so they do not duplicate this logic.
|
|
9
9
|
*/
|
|
10
10
|
export declare function useAnimationPreset<T extends TPresetWithCssAndName>(animate: T | false | null | undefined): T | null;
|
|
11
11
|
export {};
|
|
@@ -6,7 +6,7 @@ type TPresetWithCssAndName = {
|
|
|
6
6
|
* Normalizes a preset prop to a value (or null) and ensures its CSS
|
|
7
7
|
* is injected once into `document.head`.
|
|
8
8
|
*
|
|
9
|
-
* Works with any preset that has `{ css, name }`
|
|
9
|
+
* Works with any preset that has `{ css, name }` - animation presets
|
|
10
10
|
* (TAnimationPreset) satisfies this shape.
|
|
11
11
|
*/
|
|
12
12
|
export declare function usePresetStyles<T extends TPresetWithCssAndName>({ preset, }: {
|
|
@@ -3,8 +3,8 @@ import type { TWidthFromAnchorMode } from '../popover/types';
|
|
|
3
3
|
/**
|
|
4
4
|
* Sets the width of a popover element relative to its anchor element.
|
|
5
5
|
*
|
|
6
|
-
* - `'match-anchor'` → `width: anchor-size(width)`
|
|
7
|
-
* - `'min-anchor'` → `min-width: anchor-size(width)`
|
|
6
|
+
* - `'match-anchor'` → `width: anchor-size(width)` - popover matches anchor width exactly.
|
|
7
|
+
* - `'min-anchor'` → `min-width: anchor-size(width)` - popover is at least as wide as anchor,
|
|
8
8
|
* but can grow wider.
|
|
9
9
|
* - `'none'` → no explicit width is set (default behaviour)
|
|
10
10
|
*
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { type TPlacementOptions } from '../internal/resolve-placement';
|
|
2
|
-
import {
|
|
2
|
+
import type { TLegacyPlacement } from './legacy-placements';
|
|
3
3
|
/**
|
|
4
4
|
* Maps legacy Popper.js placement values to the new object-based
|
|
5
5
|
* `Placement` values used by `@atlaskit/top-layer/popover`.
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import { type TPlacementOptions } from '../internal/resolve-placement';
|
|
2
1
|
/**
|
|
3
2
|
* Legacy Popper.js placement values (used by `@atlaskit/popper`,
|
|
4
3
|
* `@atlaskit/popup`, `@atlaskit/tooltip`, etc.). Re-exported from
|
|
@@ -8,14 +7,3 @@ import { type TPlacementOptions } from '../internal/resolve-placement';
|
|
|
8
7
|
*/
|
|
9
8
|
export declare const LEGACY_PLACEMENTS: readonly ["auto", "auto-start", "auto-end", "top", "top-start", "top-center", "top-end", "bottom", "bottom-start", "bottom-center", "bottom-end", "right", "right-start", "right-end", "left", "left-start", "left-end"];
|
|
10
9
|
export type TLegacyPlacement = (typeof LEGACY_PLACEMENTS)[number];
|
|
11
|
-
/**
|
|
12
|
-
* The full mapping record. Internal - use `fromLegacyPlacement` from the
|
|
13
|
-
* public entry-point so the offset-tuple translation is applied consistently.
|
|
14
|
-
*
|
|
15
|
-
* Note: `auto`, `auto-start`, `auto-end` map to `block-end` placements. This
|
|
16
|
-
* is a reduction in expressiveness vs Popper.js (which picked the best
|
|
17
|
-
* placement at runtime). CSS `position-try-fallbacks` flips at the edge but
|
|
18
|
-
* the initial placement is fixed. Migration consumers who relied on Popper's
|
|
19
|
-
* dynamic auto-flip should pick an explicit placement instead.
|
|
20
|
-
*/
|
|
21
|
-
export declare const placementMapping: Record<TLegacyPlacement, TPlacementOptions>;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { type TPlacementOptions } from '../internal/resolve-placement';
|
|
2
|
+
import type { TLegacyPlacement } from './legacy-placements';
|
|
3
|
+
/**
|
|
4
|
+
* The full mapping record. Internal - use `fromLegacyPlacement` from the
|
|
5
|
+
* public entry-point so the offset-tuple translation is applied consistently.
|
|
6
|
+
*
|
|
7
|
+
* Note: `auto`, `auto-start`, `auto-end` map to `block-end` placements. This
|
|
8
|
+
* is a reduction in expressiveness vs Popper.js (which picked the best
|
|
9
|
+
* placement at runtime). CSS `position-try-fallbacks` flips at the edge but
|
|
10
|
+
* the initial placement is fixed. Migration consumers who relied on Popper's
|
|
11
|
+
* dynamic auto-flip should pick an explicit placement instead.
|
|
12
|
+
*/
|
|
13
|
+
export declare const placementMapping: Record<TLegacyPlacement, TPlacementOptions>;
|
|
@@ -3,7 +3,7 @@ import type { TPopoverCloseReason } from './types';
|
|
|
3
3
|
* Creates a synthetic DOM event from a `TPopoverCloseReason`.
|
|
4
4
|
*
|
|
5
5
|
* Useful when bridging the Popover primitive's `onClose({ reason })` callback
|
|
6
|
-
* to a legacy API that expects a native DOM event
|
|
6
|
+
* to a legacy API that expects a native DOM event - for example,
|
|
7
7
|
* `@atlaskit/inline-dialog`'s `onClose(event)` contract.
|
|
8
8
|
*
|
|
9
9
|
* - `'escape'` → `KeyboardEvent('keydown', { key: 'Escape' })`
|
|
@@ -8,7 +8,7 @@ import { type TPopoverForwardedProps } from './types';
|
|
|
8
8
|
* Unopinionated top-layer primitive.
|
|
9
9
|
*
|
|
10
10
|
* Manages only visibility (isOpen) and animation (animate). Has no knowledge
|
|
11
|
-
* of positioning
|
|
11
|
+
* of positioning - compose with `useAnchorPosition` for anchor positioning
|
|
12
12
|
* and optionally `useWidthFromAnchor` for setting the width of a popover element
|
|
13
13
|
* relative to its anchor trigger.
|
|
14
14
|
*
|
|
@@ -79,7 +79,7 @@ export type TPopupContextValue = {
|
|
|
79
79
|
*/
|
|
80
80
|
ariaHasPopup: TAriaHasPopupValue;
|
|
81
81
|
/**
|
|
82
|
-
* Updates `ariaHasPopup`
|
|
82
|
+
* Updates `ariaHasPopup` - called by Content on mount/role change.
|
|
83
83
|
*/
|
|
84
84
|
setAriaHasPopup: (value: TAriaHasPopupValue) => void;
|
|
85
85
|
/**
|
|
@@ -3,13 +3,13 @@
|
|
|
3
3
|
*
|
|
4
4
|
* jest-dom's `toBeVisible()` does not know about the Popover API. In real
|
|
5
5
|
* browsers the UA stylesheet hides `[popover]` with `display: none`, but
|
|
6
|
-
* jsdom has no such stylesheet
|
|
6
|
+
* jsdom has no such stylesheet - so closed popovers incorrectly appear visible.
|
|
7
7
|
*
|
|
8
8
|
* Raw jest-dom results in jsdom:
|
|
9
9
|
*
|
|
10
|
-
* closed popover / child → true (WRONG
|
|
10
|
+
* closed popover / child → true (WRONG - should be false)
|
|
11
11
|
* open popover / child → true (correct)
|
|
12
|
-
* closed dialog / child → false (correct
|
|
12
|
+
* closed dialog / child → false (correct - jsdom natively hides <dialog>)
|
|
13
13
|
* open dialog / child → true (correct)
|
|
14
14
|
*
|
|
15
15
|
* We correct both false positives and false negatives:
|
|
@@ -34,7 +34,7 @@ type TUseSimpleLightDismissOptions = {
|
|
|
34
34
|
* **No stacking awareness:** This hook does not track a popover stack.
|
|
35
35
|
* If multiple manual popovers are open and all use this hook, a single
|
|
36
36
|
* Escape press or outside click will dismiss **all of them simultaneously**.
|
|
37
|
-
* This is by design
|
|
37
|
+
* This is by design - the hook is intentionally simple for cases where
|
|
38
38
|
* only one manual popover is open at a time.
|
|
39
39
|
*
|
|
40
40
|
* For stacked/nested popovers that should dismiss one-at-a-time, use
|
|
@@ -3,7 +3,7 @@ import type { TDialogCloseReason } from './types';
|
|
|
3
3
|
* Creates a synthetic DOM event from a `TDialogCloseReason`.
|
|
4
4
|
*
|
|
5
5
|
* Useful when bridging the Dialog primitive's `onClose({ reason })` callback
|
|
6
|
-
* to a legacy API that expects a `KeyboardEvent` or `MouseEvent`
|
|
6
|
+
* to a legacy API that expects a `KeyboardEvent` or `MouseEvent` - for example,
|
|
7
7
|
* `@atlaskit/modal-dialog`'s `onClose(event, analyticsEvent)` contract.
|
|
8
8
|
*
|
|
9
9
|
* - `'escape'` → `KeyboardEvent('keydown', { key: 'Escape' })`
|
|
@@ -49,6 +49,14 @@ type TDialogBaseProps = {
|
|
|
49
49
|
* Additional inline styles applied to the `<dialog>` element.
|
|
50
50
|
*
|
|
51
51
|
* Use for custom width, height, transform, or other overrides.
|
|
52
|
+
*
|
|
53
|
+
* Rule deviation: the house rules ban unbounded `style` props on
|
|
54
|
+
* components. `Dialog` is a low-level primitive that intentionally has
|
|
55
|
+
* no visual opinions of its own; consumers such as `@atlaskit/modal-dialog`
|
|
56
|
+
* must be able to set width, height, and transforms on the native
|
|
57
|
+
* `<dialog>` element. Removing this prop would be a breaking change
|
|
58
|
+
* and is tracked separately. Keep until an xcss-based replacement
|
|
59
|
+
* exists on the primitive.
|
|
52
60
|
*/
|
|
53
61
|
style?: CSSProperties;
|
|
54
62
|
/**
|
|
@@ -1,2 +1,4 @@
|
|
|
1
|
-
export {
|
|
2
|
-
export
|
|
1
|
+
export type { TFocusableFilter } from '../focus/types';
|
|
2
|
+
export { getFirstFocusable } from '../focus/get-first-focusable';
|
|
3
|
+
export { getLastFocusable } from '../focus/get-last-focusable';
|
|
4
|
+
export { getNextFocusable } from '../focus/get-next-focusable';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { useAnchorPositionAtPoint, type TAnchorPoint, } from '../internal/use-anchor-position-at-point';
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import type { TFocusableFilter } from './types';
|
|
2
|
+
/**
|
|
3
|
+
* Returns the first focusable element within the container.
|
|
4
|
+
*/
|
|
5
|
+
export declare function getFirstFocusable({ container, filter, }: {
|
|
6
|
+
container: HTMLElement;
|
|
7
|
+
filter?: TFocusableFilter;
|
|
8
|
+
}): HTMLElement | null;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import type { TFocusableFilter } from './types';
|
|
2
|
+
/**
|
|
3
|
+
* Returns all focusable HTMLElements within the container, optionally filtered.
|
|
4
|
+
*
|
|
5
|
+
* Focusables that belong to a nested top-layer scope (a `[popover]` or
|
|
6
|
+
* `<dialog>` descendant of the container) are excluded - those elements
|
|
7
|
+
* are owned by the inner layer's focus management. The container itself
|
|
8
|
+
* is allowed to be a popover/dialog; only nested ones are filtered.
|
|
9
|
+
*/
|
|
10
|
+
export declare function getFocusables({ container, filter, }: {
|
|
11
|
+
container: HTMLElement;
|
|
12
|
+
filter?: TFocusableFilter;
|
|
13
|
+
}): HTMLElement[];
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import type { TFocusableFilter } from './types';
|
|
2
|
+
/**
|
|
3
|
+
* Returns the last focusable element within the container.
|
|
4
|
+
*/
|
|
5
|
+
export declare function getLastFocusable({ container, filter, }: {
|
|
6
|
+
container: HTMLElement;
|
|
7
|
+
filter?: TFocusableFilter;
|
|
8
|
+
}): HTMLElement | null;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Returns the next focusable element in the given direction relative to the
|
|
3
|
+
* currently focused element within the container. Wraps around at both ends.
|
|
4
|
+
*
|
|
5
|
+
* Returns `null` if there is no focused element within the container or if
|
|
6
|
+
* the focused element is not in the list of focusable elements.
|
|
7
|
+
*/
|
|
8
|
+
import type { TFocusableFilter } from './types';
|
|
9
|
+
export declare function getNextFocusable({ container, direction, filter, }: {
|
|
10
|
+
container: HTMLElement;
|
|
11
|
+
direction: 'forwards' | 'backwards';
|
|
12
|
+
filter?: TFocusableFilter;
|
|
13
|
+
}): HTMLElement | null;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Returns true when `element` and `container` resolve to the same nearest
|
|
3
|
+
* top-layer host (or both resolve to `null`, meaning the document layer).
|
|
4
|
+
*/
|
|
5
|
+
export declare function isInSameLayer({ element, container, }: {
|
|
6
|
+
element: HTMLElement;
|
|
7
|
+
container: HTMLElement;
|
|
8
|
+
}): boolean;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Returns `true` when `document.activeElement` is inside a nested top-layer
|
|
3
|
+
* descendant of `container` (a `[popover]`, `<dialog>`, `[role="dialog"]` or
|
|
4
|
+
* `[role="alertdialog"]` that is itself a descendant of `container`).
|
|
5
|
+
*/
|
|
6
|
+
export declare function isNestedLayerFocused({ container }: {
|
|
7
|
+
container: HTMLElement;
|
|
8
|
+
}): boolean;
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
*
|
|
6
6
|
* The result is cached after the first call via `once`. This avoids
|
|
7
7
|
* calling `matchMedia` on every render. The trade-off is that if a user
|
|
8
|
-
* toggles the OS reduced-motion setting mid-session, the change
|
|
8
|
+
* toggles the OS reduced-motion setting mid-session, the change will not
|
|
9
9
|
* take effect until the next page load. This is acceptable because
|
|
10
10
|
* toggling this system-level preference mid-session is extremely rare,
|
|
11
11
|
* and a page refresh is a reasonable expectation for system accessibility
|
|
@@ -30,8 +30,8 @@ export type TPlacement = {
|
|
|
30
30
|
* CSS length string (e.g. `token('space.100')`).
|
|
31
31
|
*
|
|
32
32
|
* The two offset axes are named for clarity at the call site:
|
|
33
|
-
* - `gap`
|
|
34
|
-
* - `crossAxisShift`
|
|
33
|
+
* - `gap` - distance away from the trigger along the placement axis
|
|
34
|
+
* - `crossAxisShift` - nudge along the trigger edge (perpendicular to the placement axis)
|
|
35
35
|
*/
|
|
36
36
|
export type TPlacementOptions = {
|
|
37
37
|
axis?: 'block' | 'inline';
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import type { TAriaHasPopupValue, TRoleRequiringAccessibleName, TRoleWithImplicitName } from './role-types';
|
|
2
|
+
/**
|
|
3
|
+
* Maps a popover content role to the correct `aria-haspopup` value
|
|
4
|
+
* for its trigger element.
|
|
5
|
+
*
|
|
6
|
+
* Returns `undefined` for roles that are not popups in the ARIA sense
|
|
7
|
+
* (`tooltip`, `note`, `status`, `alert`, `log`). Triggers for those roles
|
|
8
|
+
* should not announce a popup at all - emitting `aria-haspopup="dialog"`
|
|
9
|
+
* on a tooltip trigger would mislead assistive technology.
|
|
10
|
+
*/
|
|
11
|
+
export declare function roleToAriaHasPopup({ role, }: {
|
|
12
|
+
role: TRoleRequiringAccessibleName | TRoleWithImplicitName | undefined;
|
|
13
|
+
}): TAriaHasPopupValue;
|
|
@@ -61,23 +61,4 @@ export type TAriaRoleOptional = ({
|
|
|
61
61
|
} & TAccessibleNameRequired) | ({
|
|
62
62
|
role?: TRoleWithImplicitName;
|
|
63
63
|
} & TAccessibleNameOptional);
|
|
64
|
-
/**
|
|
65
|
-
* Maps a popover content role to the correct `aria-haspopup` value
|
|
66
|
-
* for its trigger element.
|
|
67
|
-
*
|
|
68
|
-
* Returns `undefined` for roles that are not popups in the ARIA sense
|
|
69
|
-
* (`tooltip`, `note`, `status`, `alert`, `log`). Triggers for those roles
|
|
70
|
-
* should not announce a popup at all - emitting `aria-haspopup="dialog"`
|
|
71
|
-
* on a tooltip trigger would mislead assistive technology.
|
|
72
|
-
*/
|
|
73
|
-
export declare function roleToAriaHasPopup({ role, }: {
|
|
74
|
-
role: TRoleRequiringAccessibleName | TRoleWithImplicitName | undefined;
|
|
75
|
-
}): TAriaHasPopupValue;
|
|
76
|
-
/**
|
|
77
|
-
* Returns `true` when the given popover role moves focus into the popover
|
|
78
|
-
* on open, and `false` otherwise (including when `role` is `undefined`).
|
|
79
|
-
*/
|
|
80
|
-
export declare function shouldFocusIntoPopover({ role, }: {
|
|
81
|
-
role: TRoleRequiringAccessibleName | TRoleWithImplicitName | undefined;
|
|
82
|
-
}): boolean;
|
|
83
64
|
export {};
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import type { TRoleRequiringAccessibleName, TRoleWithImplicitName } from './role-types';
|
|
2
|
+
/**
|
|
3
|
+
* Returns `true` when the given popover role moves focus into the popover
|
|
4
|
+
* on open, and `false` otherwise (including when `role` is `undefined`).
|
|
5
|
+
*/
|
|
6
|
+
export declare function shouldFocusIntoPopover({ role, }: {
|
|
7
|
+
role: TRoleRequiringAccessibleName | TRoleWithImplicitName | undefined;
|
|
8
|
+
}): boolean;
|
|
@@ -2,21 +2,21 @@ import { type ForwardRefExoticComponent, type ReactNode, type RefAttributes } fr
|
|
|
2
2
|
/**
|
|
3
3
|
* Extra DOM/event props are passed through to the cloned child.
|
|
4
4
|
*/
|
|
5
|
-
export type
|
|
5
|
+
export type TSlotProps = {
|
|
6
6
|
children: ReactNode;
|
|
7
7
|
} & Record<string, unknown>;
|
|
8
8
|
/**
|
|
9
9
|
* Merges props (including ref) onto a single React element child.
|
|
10
10
|
*
|
|
11
11
|
* A safer alternative to raw `cloneElement` that:
|
|
12
|
-
* 1. Guards with `isValidElement`
|
|
12
|
+
* 1. Guards with `isValidElement` - non-element children (strings,
|
|
13
13
|
* fragments, null) are returned as-is instead of crashing.
|
|
14
14
|
* 2. Merges refs via `mergeRefs` so both the caller's ref and the
|
|
15
15
|
* child's existing ref are honoured.
|
|
16
16
|
* 3. Spreads any additional props (ARIA attributes, event handlers, etc.)
|
|
17
17
|
* onto the child element.
|
|
18
18
|
*
|
|
19
|
-
* Event handlers (e.g. `onClick`) are **not** auto-merged
|
|
19
|
+
* Event handlers (e.g. `onClick`) are **not** auto-merged - the caller's
|
|
20
20
|
* handler replaces the child's. Compose handlers before passing them in.
|
|
21
21
|
*
|
|
22
22
|
* @example
|
|
@@ -26,4 +26,4 @@ export type SlotProps = {
|
|
|
26
26
|
* </Slot>
|
|
27
27
|
* ```
|
|
28
28
|
*/
|
|
29
|
-
export declare const Slot: ForwardRefExoticComponent<
|
|
29
|
+
export declare const Slot: ForwardRefExoticComponent<TSlotProps & RefAttributes<HTMLElement>>;
|
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
import { type RefObject } from 'react';
|
|
2
|
+
import { type TPlacementOptions } from './resolve-placement';
|
|
3
|
+
/**
|
|
4
|
+
* A point in viewport coordinates (CSS pixels) at which the synthetic
|
|
5
|
+
* anchor should be placed.
|
|
6
|
+
*
|
|
7
|
+
* Axis-named (`x`/`y`) rather than edge-named (`left`/`top`) so the
|
|
8
|
+
* shape is unambiguous in RTL writing modes — there is no ambiguity
|
|
9
|
+
* about whether a coordinate is logical (`inline-start`/`block-start`)
|
|
10
|
+
* or physical (`left`/`top`). Viewport coordinates are always
|
|
11
|
+
* physical, so we name them with the physical axis labels.
|
|
12
|
+
*/
|
|
13
|
+
export type TAnchorPoint = {
|
|
14
|
+
x: number;
|
|
15
|
+
y: number;
|
|
16
|
+
};
|
|
17
|
+
/**
|
|
18
|
+
* Positions a popover at a consumer-supplied viewport coordinate using a
|
|
19
|
+
* hidden synthetic anchor.
|
|
20
|
+
*
|
|
21
|
+
* @example
|
|
22
|
+
* ```tsx
|
|
23
|
+
* function PointPositionedPopover({ popoverRef, placement, mousePos }) {
|
|
24
|
+
* useAnchorPositionAtPoint({
|
|
25
|
+
* popoverRef,
|
|
26
|
+
* placement,
|
|
27
|
+
* isEnabled: Boolean(mousePos),
|
|
28
|
+
* getPoint: () => {
|
|
29
|
+
* if (!mousePos) return null;
|
|
30
|
+
* return { x: mousePos.clientX, y: mousePos.clientY };
|
|
31
|
+
* },
|
|
32
|
+
* });
|
|
33
|
+
* return <Popover ref={popoverRef}>...</Popover>;
|
|
34
|
+
* }
|
|
35
|
+
* ```
|
|
36
|
+
*/
|
|
37
|
+
export declare function useAnchorPositionAtPoint({ popoverRef, placement, getPoint, isEnabled, }: {
|
|
38
|
+
/**
|
|
39
|
+
* Element being positioned. Passed to `useAnchorPosition`.
|
|
40
|
+
*/
|
|
41
|
+
popoverRef: RefObject<HTMLElement | null>;
|
|
42
|
+
/**
|
|
43
|
+
* Where the popover sits relative to the anchor.
|
|
44
|
+
*/
|
|
45
|
+
placement: TPlacementOptions;
|
|
46
|
+
/**
|
|
47
|
+
* Lazy callback returning the viewport coordinate to anchor at.
|
|
48
|
+
* Called once per activation (every `isEnabled: false → true`
|
|
49
|
+
* transition); the result is latched and not re-read.
|
|
50
|
+
*
|
|
51
|
+
* Return `null` to signal "no point yet" — the hook stays in a
|
|
52
|
+
* no-DOM state so another positioning strategy can own the popover.
|
|
53
|
+
*
|
|
54
|
+
* Read from a ref, so it does not need to be memoized.
|
|
55
|
+
*/
|
|
56
|
+
getPoint: () => TAnchorPoint | null;
|
|
57
|
+
/**
|
|
58
|
+
* When `false`, the hook is a no-op: no synthetic anchor is created
|
|
59
|
+
* and no positioning is applied. Defaults to `true`.
|
|
60
|
+
*/
|
|
61
|
+
isEnabled?: boolean;
|
|
62
|
+
}): void;
|
|
@@ -34,7 +34,7 @@ import { type TPlacementOptions } from '../internal/resolve-placement';
|
|
|
34
34
|
* comparison is used internally so re-runs are skipped when the resolved
|
|
35
35
|
* placement shape is unchanged.
|
|
36
36
|
*/
|
|
37
|
-
export declare function useAnchorPosition({ anchorRef, popoverRef, placement, forceFallbackPositioning, }: {
|
|
37
|
+
export declare function useAnchorPosition({ anchorRef, popoverRef, placement, forceFallbackPositioning, isEnabled, }: {
|
|
38
38
|
/**
|
|
39
39
|
* Element to position relative to.
|
|
40
40
|
*/
|
|
@@ -70,4 +70,9 @@ export declare function useAnchorPosition({ anchorRef, popoverRef, placement, fo
|
|
|
70
70
|
* behavior in any environment, including production.
|
|
71
71
|
*/
|
|
72
72
|
forceFallbackPositioning?: boolean;
|
|
73
|
+
/**
|
|
74
|
+
* When `false`, the hook is a no-op and applies no positioning.
|
|
75
|
+
* Defaults to `true`.
|
|
76
|
+
*/
|
|
77
|
+
isEnabled?: boolean;
|
|
73
78
|
}): void;
|
|
@@ -44,19 +44,19 @@ type TUseAnimatedVisibilityResult = {
|
|
|
44
44
|
*
|
|
45
45
|
* Used by both `Popover` and `Dialog` to share the same animation lifecycle
|
|
46
46
|
* logic. Those components own their own show/hide mechanisms (showPopover /
|
|
47
|
-
* hidePopover vs showModal / close) and event handling
|
|
47
|
+
* hidePopover vs showModal / close) and event handling - this hook only
|
|
48
48
|
* manages the relationship between `isOpen` and when children are rendered.
|
|
49
49
|
*
|
|
50
50
|
* ## Problem
|
|
51
51
|
*
|
|
52
52
|
* We want to delay the unmount of children until a CSS exit transition has
|
|
53
53
|
* finished playing. If we unmount children the moment `isOpen` becomes
|
|
54
|
-
* `false`, the exit animation is never visible
|
|
54
|
+
* `false`, the exit animation is never visible - the content just disappears.
|
|
55
55
|
*
|
|
56
56
|
* ## How it works
|
|
57
57
|
*
|
|
58
58
|
* `showChildren` tracks whether the consumer's children should be in the DOM.
|
|
59
|
-
* It does not mirror `isOpen` exactly
|
|
59
|
+
* It does not mirror `isOpen` exactly - it intentionally lags behind during
|
|
60
60
|
* exit animations:
|
|
61
61
|
*
|
|
62
62
|
* ```
|
|
@@ -5,7 +5,7 @@ type TPresetWithCssAndName = {
|
|
|
5
5
|
/**
|
|
6
6
|
* Normalizes the `animate` prop to a preset (or null) and ensures its CSS
|
|
7
7
|
* is injected once into document.head. Used by PopupContent, Popover, and
|
|
8
|
-
* DialogContent so they
|
|
8
|
+
* DialogContent so they do not duplicate this logic.
|
|
9
9
|
*/
|
|
10
10
|
export declare function useAnimationPreset<T extends TPresetWithCssAndName>(animate: T | false | null | undefined): T | null;
|
|
11
11
|
export {};
|
|
@@ -6,7 +6,7 @@ type TPresetWithCssAndName = {
|
|
|
6
6
|
* Normalizes a preset prop to a value (or null) and ensures its CSS
|
|
7
7
|
* is injected once into `document.head`.
|
|
8
8
|
*
|
|
9
|
-
* Works with any preset that has `{ css, name }`
|
|
9
|
+
* Works with any preset that has `{ css, name }` - animation presets
|
|
10
10
|
* (TAnimationPreset) satisfies this shape.
|
|
11
11
|
*/
|
|
12
12
|
export declare function usePresetStyles<T extends TPresetWithCssAndName>({ preset, }: {
|
|
@@ -3,8 +3,8 @@ import type { TWidthFromAnchorMode } from '../popover/types';
|
|
|
3
3
|
/**
|
|
4
4
|
* Sets the width of a popover element relative to its anchor element.
|
|
5
5
|
*
|
|
6
|
-
* - `'match-anchor'` → `width: anchor-size(width)`
|
|
7
|
-
* - `'min-anchor'` → `min-width: anchor-size(width)`
|
|
6
|
+
* - `'match-anchor'` → `width: anchor-size(width)` - popover matches anchor width exactly.
|
|
7
|
+
* - `'min-anchor'` → `min-width: anchor-size(width)` - popover is at least as wide as anchor,
|
|
8
8
|
* but can grow wider.
|
|
9
9
|
* - `'none'` → no explicit width is set (default behaviour)
|
|
10
10
|
*
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { type TPlacementOptions } from '../internal/resolve-placement';
|
|
2
|
-
import {
|
|
2
|
+
import type { TLegacyPlacement } from './legacy-placements';
|
|
3
3
|
/**
|
|
4
4
|
* Maps legacy Popper.js placement values to the new object-based
|
|
5
5
|
* `Placement` values used by `@atlaskit/top-layer/popover`.
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
import { type TPlacementOptions } from '../internal/resolve-placement';
|
|
2
1
|
/**
|
|
3
2
|
* Legacy Popper.js placement values (used by `@atlaskit/popper`,
|
|
4
3
|
* `@atlaskit/popup`, `@atlaskit/tooltip`, etc.). Re-exported from
|
|
@@ -26,14 +25,3 @@ export declare const LEGACY_PLACEMENTS: readonly [
|
|
|
26
25
|
"left-end"
|
|
27
26
|
];
|
|
28
27
|
export type TLegacyPlacement = (typeof LEGACY_PLACEMENTS)[number];
|
|
29
|
-
/**
|
|
30
|
-
* The full mapping record. Internal - use `fromLegacyPlacement` from the
|
|
31
|
-
* public entry-point so the offset-tuple translation is applied consistently.
|
|
32
|
-
*
|
|
33
|
-
* Note: `auto`, `auto-start`, `auto-end` map to `block-end` placements. This
|
|
34
|
-
* is a reduction in expressiveness vs Popper.js (which picked the best
|
|
35
|
-
* placement at runtime). CSS `position-try-fallbacks` flips at the edge but
|
|
36
|
-
* the initial placement is fixed. Migration consumers who relied on Popper's
|
|
37
|
-
* dynamic auto-flip should pick an explicit placement instead.
|
|
38
|
-
*/
|
|
39
|
-
export declare const placementMapping: Record<TLegacyPlacement, TPlacementOptions>;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { type TPlacementOptions } from '../internal/resolve-placement';
|
|
2
|
+
import type { TLegacyPlacement } from './legacy-placements';
|
|
3
|
+
/**
|
|
4
|
+
* The full mapping record. Internal - use `fromLegacyPlacement` from the
|
|
5
|
+
* public entry-point so the offset-tuple translation is applied consistently.
|
|
6
|
+
*
|
|
7
|
+
* Note: `auto`, `auto-start`, `auto-end` map to `block-end` placements. This
|
|
8
|
+
* is a reduction in expressiveness vs Popper.js (which picked the best
|
|
9
|
+
* placement at runtime). CSS `position-try-fallbacks` flips at the edge but
|
|
10
|
+
* the initial placement is fixed. Migration consumers who relied on Popper's
|
|
11
|
+
* dynamic auto-flip should pick an explicit placement instead.
|
|
12
|
+
*/
|
|
13
|
+
export declare const placementMapping: Record<TLegacyPlacement, TPlacementOptions>;
|
|
@@ -3,7 +3,7 @@ import type { TPopoverCloseReason } from './types';
|
|
|
3
3
|
* Creates a synthetic DOM event from a `TPopoverCloseReason`.
|
|
4
4
|
*
|
|
5
5
|
* Useful when bridging the Popover primitive's `onClose({ reason })` callback
|
|
6
|
-
* to a legacy API that expects a native DOM event
|
|
6
|
+
* to a legacy API that expects a native DOM event - for example,
|
|
7
7
|
* `@atlaskit/inline-dialog`'s `onClose(event)` contract.
|
|
8
8
|
*
|
|
9
9
|
* - `'escape'` → `KeyboardEvent('keydown', { key: 'Escape' })`
|
|
@@ -8,7 +8,7 @@ import { type TPopoverForwardedProps } from './types';
|
|
|
8
8
|
* Unopinionated top-layer primitive.
|
|
9
9
|
*
|
|
10
10
|
* Manages only visibility (isOpen) and animation (animate). Has no knowledge
|
|
11
|
-
* of positioning
|
|
11
|
+
* of positioning - compose with `useAnchorPosition` for anchor positioning
|
|
12
12
|
* and optionally `useWidthFromAnchor` for setting the width of a popover element
|
|
13
13
|
* relative to its anchor trigger.
|
|
14
14
|
*
|
|
@@ -79,7 +79,7 @@ export type TPopupContextValue = {
|
|
|
79
79
|
*/
|
|
80
80
|
ariaHasPopup: TAriaHasPopupValue;
|
|
81
81
|
/**
|
|
82
|
-
* Updates `ariaHasPopup`
|
|
82
|
+
* Updates `ariaHasPopup` - called by Content on mount/role change.
|
|
83
83
|
*/
|
|
84
84
|
setAriaHasPopup: (value: TAriaHasPopupValue) => void;
|
|
85
85
|
/**
|