@atlaskit/top-layer 1.6.0 → 1.6.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.
Files changed (36) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/compass.yml +10 -1
  3. package/dist/cjs/dialog/dialog-content.compiled.css +0 -10
  4. package/dist/cjs/dialog/dialog-content.js +5 -28
  5. package/dist/cjs/entry-points/animations.js +1 -49
  6. package/dist/cjs/internal/use-animated-visibility.js +14 -17
  7. package/dist/cjs/popover/animations.js +1 -147
  8. package/dist/cjs/popover/popover.compiled.css +0 -10
  9. package/dist/cjs/popover/popover.js +8 -11
  10. package/dist/cjs/testing/polyfill.js +3 -0
  11. package/dist/es2019/dialog/dialog-content.compiled.css +0 -10
  12. package/dist/es2019/dialog/dialog-content.js +4 -28
  13. package/dist/es2019/entry-points/animations.js +0 -2
  14. package/dist/es2019/internal/use-animated-visibility.js +14 -18
  15. package/dist/es2019/popover/animations.js +1 -145
  16. package/dist/es2019/popover/popover.compiled.css +0 -10
  17. package/dist/es2019/popover/popover.js +7 -11
  18. package/dist/es2019/testing/polyfill.js +3 -0
  19. package/dist/esm/dialog/dialog-content.compiled.css +0 -10
  20. package/dist/esm/dialog/dialog-content.js +5 -28
  21. package/dist/esm/entry-points/animations.js +0 -2
  22. package/dist/esm/internal/use-animated-visibility.js +14 -18
  23. package/dist/esm/popover/animations.js +1 -144
  24. package/dist/esm/popover/popover.compiled.css +0 -10
  25. package/dist/esm/popover/popover.js +8 -11
  26. package/dist/esm/testing/polyfill.js +3 -0
  27. package/dist/types/dialog/types.d.ts +5 -5
  28. package/dist/types/entry-points/animations.d.ts +0 -2
  29. package/dist/types/internal/use-animated-visibility.d.ts +15 -33
  30. package/dist/types/popover/animations.d.ts +7 -52
  31. package/dist/types/popover/types.d.ts +6 -3
  32. package/package.json +4 -4
  33. package/dist/cjs/dialog/animations.js +0 -90
  34. package/dist/es2019/dialog/animations.js +0 -80
  35. package/dist/esm/dialog/animations.js +0 -82
  36. package/dist/types/dialog/animations.d.ts +0 -57
@@ -1,82 +0,0 @@
1
- // `custom` variant currently exists for typing reasons for Drawer
2
- // not indicative of final API
3
-
4
- /**
5
- * Dialog motion animation.
6
- *
7
- * Includes backdrop fade animation.
8
- *
9
- * @example
10
- * ```tsx
11
- * import { dialogMotion } from '@atlaskit/top-layer/animations';
12
- *
13
- * <Dialog animate={dialogMotion()} isOpen={isOpen} onClose={handleClose} label="...">
14
- * ...
15
- * </Dialog>
16
- * ```
17
- */
18
- // eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
19
- export function dialogMotion() {
20
- return {
21
- kind: 'dialog',
22
- name: 'motion'
23
- };
24
- }
25
-
26
- /**
27
- * Slide up + opacity animation for dialogs.
28
- *
29
- * Entry slides up from below; exit slides up and out (asymmetric).
30
- * Includes backdrop fade animation.
31
- *
32
- * @param options.distance - Slide distance in pixels. Defaults to `12`.
33
- *
34
- * @example
35
- * ```tsx
36
- * import { dialogSlideUpAndFade } from '@atlaskit/top-layer/animations';
37
- *
38
- * const animation = dialogSlideUpAndFade();
39
- * <Dialog animate={animation} isOpen={isOpen} onClose={handleClose} label="...">
40
- * ...
41
- * </Dialog>
42
- * ```
43
- */
44
- // eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
45
- export function dialogSlideUpAndFade(options) {
46
- var _options$distance;
47
- var distance = (_options$distance = options === null || options === void 0 ? void 0 : options.distance) !== null && _options$distance !== void 0 ? _options$distance : 12;
48
-
49
- // The configurable distance is applied via the `--ds-dialog-ty` custom property
50
- return {
51
- kind: 'dialog',
52
- name: 'slide-up-and-fade',
53
- getStyles: function getStyles() {
54
- return [{
55
- property: '--ds-dialog-ty',
56
- value: "".concat(distance, "px")
57
- }];
58
- }
59
- };
60
- }
61
-
62
- /**
63
- * Simple opacity transition for dialogs, no transform.
64
- *
65
- * Includes backdrop fade animation.
66
- *
67
- * @example
68
- * ```tsx
69
- * import { dialogFade } from '@atlaskit/top-layer/animations';
70
- *
71
- * <Dialog animate={dialogFade()} isOpen={isOpen} onClose={handleClose} label="...">
72
- * ...
73
- * </Dialog>
74
- * ```
75
- */
76
- // eslint-disable-next-line @atlaskit/volt-strict-mode/no-multiple-exports
77
- export function dialogFade() {
78
- return {
79
- kind: 'dialog',
80
- name: 'fade'
81
- };
82
- }
@@ -1,57 +0,0 @@
1
- import type { TAnimationPreset } from '../internal/use-animated-visibility';
2
- export type TDialogAnimationPresetName = 'motion' | 'slide-up-and-fade' | 'fade' | 'custom';
3
- export type TDialogAnimationPreset = TAnimationPreset<'dialog', TDialogAnimationPresetName>;
4
- /**
5
- * Dialog motion animation.
6
- *
7
- * Includes backdrop fade animation.
8
- *
9
- * @example
10
- * ```tsx
11
- * import { dialogMotion } from '@atlaskit/top-layer/animations';
12
- *
13
- * <Dialog animate={dialogMotion()} isOpen={isOpen} onClose={handleClose} label="...">
14
- * ...
15
- * </Dialog>
16
- * ```
17
- */
18
- export declare function dialogMotion(): TDialogAnimationPreset;
19
- /**
20
- * Slide up + opacity animation for dialogs.
21
- *
22
- * Entry slides up from below; exit slides up and out (asymmetric).
23
- * Includes backdrop fade animation.
24
- *
25
- * @param options.distance - Slide distance in pixels. Defaults to `12`.
26
- *
27
- * @example
28
- * ```tsx
29
- * import { dialogSlideUpAndFade } from '@atlaskit/top-layer/animations';
30
- *
31
- * const animation = dialogSlideUpAndFade();
32
- * <Dialog animate={animation} isOpen={isOpen} onClose={handleClose} label="...">
33
- * ...
34
- * </Dialog>
35
- * ```
36
- */
37
- export declare function dialogSlideUpAndFade(options?: {
38
- /**
39
- * Slide distance in pixels. Defaults to `12`.
40
- */
41
- distance?: number;
42
- }): TDialogAnimationPreset;
43
- /**
44
- * Simple opacity transition for dialogs, no transform.
45
- *
46
- * Includes backdrop fade animation.
47
- *
48
- * @example
49
- * ```tsx
50
- * import { dialogFade } from '@atlaskit/top-layer/animations';
51
- *
52
- * <Dialog animate={dialogFade()} isOpen={isOpen} onClose={handleClose} label="...">
53
- * ...
54
- * </Dialog>
55
- * ```
56
- */
57
- export declare function dialogFade(): TDialogAnimationPreset;