@atlaskit/navigation-system 11.3.3 → 11.4.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.
Files changed (97) hide show
  1. package/CHANGELOG.md +26 -0
  2. package/README.md +20 -0
  3. package/constellation/layout/code.mdx +1 -1
  4. package/constellation/layout/examples.mdx +4 -16
  5. package/constellation/layout/images/layout-anatomy-dark.png +0 -0
  6. package/constellation/layout/images/layout-anatomy-light.png +0 -0
  7. package/constellation/layout/images/layout-do-dark.png +0 -0
  8. package/constellation/layout/images/layout-do-light.png +0 -0
  9. package/constellation/layout/images/layout-dont-dark.png +0 -0
  10. package/constellation/layout/images/layout-dont-light.png +0 -0
  11. package/constellation/layout/images/layout-example-dark.png +0 -0
  12. package/constellation/layout/images/layout-example-light.png +0 -0
  13. package/constellation/layout/images/layout-example-sideNav-dark.png +0 -0
  14. package/constellation/layout/images/layout-example-sideNav-light.png +0 -0
  15. package/constellation/layout/images/layout-example-topNav-1-dark.png +0 -0
  16. package/constellation/layout/images/layout-example-topNav-1-light.png +0 -0
  17. package/constellation/layout/usage.mdx +1 -2
  18. package/constellation/top-nav-items/examples.mdx +7 -13
  19. package/dist/cjs/entry-points/layout/panel-layout.js +19 -0
  20. package/dist/cjs/ui/page-layout/calculate-layout-area-states.js +4 -4
  21. package/dist/cjs/ui/page-layout/chat-panel.js +1 -1
  22. package/dist/cjs/ui/page-layout/constants.js +15 -1
  23. package/dist/cjs/ui/page-layout/get-panel-layout-defaults.js +22 -0
  24. package/dist/cjs/ui/page-layout/layout-area-sizing-provider.js +2 -1
  25. package/dist/cjs/ui/page-layout/layout-area-sizing-runtime.js +5 -4
  26. package/dist/cjs/ui/page-layout/local-panel-surface.compiled.css +26 -0
  27. package/dist/cjs/ui/page-layout/local-panel-surface.js +206 -0
  28. package/dist/cjs/ui/page-layout/main/main.js +5 -2
  29. package/dist/cjs/ui/page-layout/main-min-width-context.js +10 -0
  30. package/dist/cjs/ui/page-layout/panel-layout-shell.compiled.css +27 -0
  31. package/dist/cjs/ui/page-layout/panel-layout-shell.js +67 -0
  32. package/dist/cjs/ui/page-layout/panel-layout.js +162 -0
  33. package/dist/cjs/ui/page-layout/panel-splitter/panel-splitter.js +12 -5
  34. package/dist/cjs/ui/page-layout/root.js +3 -1
  35. package/dist/cjs/ui/page-layout/side-nav/bind-open-layer-change.js +56 -0
  36. package/dist/cjs/ui/page-layout/side-nav/side-nav.js +167 -57
  37. package/dist/cjs/ui/page-layout/side-nav/toggle-button.js +8 -1
  38. package/dist/cjs/ui/page-layout/side-nav/use-side-nav-toggle-keyboard-shortcut.js +15 -1
  39. package/dist/cjs/ui/page-layout/top-nav/top-nav-end.js +3 -2
  40. package/dist/cjs/ui/page-layout/top-nav/top-nav-middle.js +2 -1
  41. package/dist/es2019/entry-points/layout/panel-layout.js +2 -0
  42. package/dist/es2019/ui/page-layout/calculate-layout-area-states.js +4 -4
  43. package/dist/es2019/ui/page-layout/chat-panel.js +2 -2
  44. package/dist/es2019/ui/page-layout/constants.js +14 -0
  45. package/dist/es2019/ui/page-layout/get-panel-layout-defaults.js +16 -0
  46. package/dist/es2019/ui/page-layout/layout-area-sizing-provider.js +2 -1
  47. package/dist/es2019/ui/page-layout/layout-area-sizing-runtime.js +4 -3
  48. package/dist/es2019/ui/page-layout/local-panel-surface.compiled.css +26 -0
  49. package/dist/es2019/ui/page-layout/local-panel-surface.js +193 -0
  50. package/dist/es2019/ui/page-layout/main/main.js +6 -3
  51. package/dist/es2019/ui/page-layout/main-min-width-context.js +5 -0
  52. package/dist/es2019/ui/page-layout/panel-layout-shell.compiled.css +27 -0
  53. package/dist/es2019/ui/page-layout/panel-layout-shell.js +74 -0
  54. package/dist/es2019/ui/page-layout/panel-layout.js +147 -0
  55. package/dist/es2019/ui/page-layout/panel-splitter/panel-splitter.js +12 -5
  56. package/dist/es2019/ui/page-layout/root.js +3 -1
  57. package/dist/es2019/ui/page-layout/side-nav/bind-open-layer-change.js +51 -0
  58. package/dist/es2019/ui/page-layout/side-nav/side-nav.js +123 -10
  59. package/dist/es2019/ui/page-layout/side-nav/toggle-button.js +8 -1
  60. package/dist/es2019/ui/page-layout/side-nav/use-side-nav-toggle-keyboard-shortcut.js +15 -1
  61. package/dist/es2019/ui/page-layout/top-nav/top-nav-end.js +3 -2
  62. package/dist/es2019/ui/page-layout/top-nav/top-nav-middle.js +2 -1
  63. package/dist/esm/entry-points/layout/panel-layout.js +2 -0
  64. package/dist/esm/ui/page-layout/calculate-layout-area-states.js +4 -4
  65. package/dist/esm/ui/page-layout/chat-panel.js +2 -2
  66. package/dist/esm/ui/page-layout/constants.js +14 -0
  67. package/dist/esm/ui/page-layout/get-panel-layout-defaults.js +16 -0
  68. package/dist/esm/ui/page-layout/layout-area-sizing-provider.js +2 -1
  69. package/dist/esm/ui/page-layout/layout-area-sizing-runtime.js +4 -3
  70. package/dist/esm/ui/page-layout/local-panel-surface.compiled.css +26 -0
  71. package/dist/esm/ui/page-layout/local-panel-surface.js +197 -0
  72. package/dist/esm/ui/page-layout/main/main.js +6 -3
  73. package/dist/esm/ui/page-layout/main-min-width-context.js +5 -0
  74. package/dist/esm/ui/page-layout/panel-layout-shell.compiled.css +27 -0
  75. package/dist/esm/ui/page-layout/panel-layout-shell.js +59 -0
  76. package/dist/esm/ui/page-layout/panel-layout.js +154 -0
  77. package/dist/esm/ui/page-layout/panel-splitter/panel-splitter.js +12 -5
  78. package/dist/esm/ui/page-layout/root.js +3 -1
  79. package/dist/esm/ui/page-layout/side-nav/bind-open-layer-change.js +50 -0
  80. package/dist/esm/ui/page-layout/side-nav/side-nav.js +168 -58
  81. package/dist/esm/ui/page-layout/side-nav/toggle-button.js +8 -1
  82. package/dist/esm/ui/page-layout/side-nav/use-side-nav-toggle-keyboard-shortcut.js +15 -1
  83. package/dist/esm/ui/page-layout/top-nav/top-nav-end.js +3 -2
  84. package/dist/esm/ui/page-layout/top-nav/top-nav-middle.js +2 -1
  85. package/dist/types/entry-points/layout/panel-layout.d.ts +3 -0
  86. package/dist/types/ui/page-layout/constants.d.ts +12 -0
  87. package/dist/types/ui/page-layout/get-panel-layout-defaults.d.ts +10 -0
  88. package/dist/types/ui/page-layout/layout-area-sizing-context.d.ts +5 -1
  89. package/dist/types/ui/page-layout/local-panel-surface.d.ts +32 -0
  90. package/dist/types/ui/page-layout/main-min-width-context.d.ts +2 -0
  91. package/dist/types/ui/page-layout/panel-layout-shell.d.ts +47 -0
  92. package/dist/types/ui/page-layout/panel-layout.d.ts +74 -0
  93. package/dist/types/ui/page-layout/side-nav/bind-open-layer-change.d.ts +17 -0
  94. package/layout/panel-layout/package.json +10 -0
  95. package/package.json +6 -6
  96. package/constellation/layout/images/layout-example-topNav-2-dark.png +0 -0
  97. package/constellation/layout/images/layout-example-topNav-2-light.png +0 -0
@@ -0,0 +1,17 @@
1
+ type TCleanupFn = () => void;
2
+ /**
3
+ * Calls `onChange` after any popover or dialog inside `within` opens or closes.
4
+ * Read the new state with `hasOpenDialogOrPopover`.
5
+ *
6
+ * `beforetoggle`, `toggle` and `close` do not bubble, so they are observed in the capture phase.
7
+ *
8
+ * `toggle` and `close` are queued tasks. When a surface closes because it unmounts,
9
+ * they fire after the element has left the DOM, so they never reach `within`.
10
+ * `beforetoggle` fires synchronously while the element is still inside `within`,
11
+ * so it also schedules `onChange` in a microtask, after the state has changed.
12
+ */
13
+ export declare function bindOpenLayerChange({ within, onChange, }: {
14
+ within: Element | Document;
15
+ onChange: () => void;
16
+ }): TCleanupFn;
17
+ export {};
@@ -0,0 +1,10 @@
1
+ {
2
+ "name": "@atlaskit/navigation-system/layout/panel-layout",
3
+ "main": "../../dist/cjs/entry-points/layout/panel-layout.js",
4
+ "module": "../../dist/esm/entry-points/layout/panel-layout.js",
5
+ "module:es2019": "../../dist/es2019/entry-points/layout/panel-layout.js",
6
+ "sideEffects": [
7
+ "*.compiled.css"
8
+ ],
9
+ "types": "../../dist/types/entry-points/layout/panel-layout.d.ts"
10
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/navigation-system",
3
- "version": "11.3.3",
3
+ "version": "11.4.0",
4
4
  "description": "The latest navigation system for Atlassian apps.",
5
5
  "repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
6
6
  "license": "Apache-2.0",
@@ -64,7 +64,7 @@
64
64
  "@atlaskit/css": "^1.1.0",
65
65
  "@atlaskit/ds-lib": "^8.0.0",
66
66
  "@atlaskit/icon": "^38.0.0",
67
- "@atlaskit/layering": "^6.0.0",
67
+ "@atlaskit/layering": "^6.1.0",
68
68
  "@atlaskit/logo": "^23.3.0",
69
69
  "@atlaskit/motion": "^9.4.0",
70
70
  "@atlaskit/platform-feature-flags": "^2.2.0",
@@ -74,8 +74,9 @@
74
74
  "@atlaskit/primitives": "^22.6.0",
75
75
  "@atlaskit/react-compiler-gating": "^0.2.0",
76
76
  "@atlaskit/side-nav-items": "^2.6.0",
77
- "@atlaskit/tokens": "^20.6.0",
77
+ "@atlaskit/tokens": "^20.7.0",
78
78
  "@atlaskit/tooltip": "^24.4.0",
79
+ "@atlaskit/top-layer": "^6.6.0",
79
80
  "@atlaskit/visually-hidden": "^4.4.0",
80
81
  "@babel/runtime": "^7.0.0",
81
82
  "@compiled/react": "^1.0.2",
@@ -123,13 +124,12 @@
123
124
  "@atlaskit/tag": "^17.0.0",
124
125
  "@atlaskit/textarea": "^10.2.0",
125
126
  "@atlaskit/textfield": "^10.2.0",
126
- "@atlaskit/top-layer": "^6.5.0",
127
127
  "@atlassian/feature-flags-test-utils": "^1.3.0",
128
128
  "@atlassian/gemini": "^1.54.0",
129
- "@atlassian/panel-system": "^1.14.0",
129
+ "@atlassian/panel-system": "^2.0.0",
130
130
  "@atlassian/react-async": "^0.23.0",
131
131
  "@atlassian/react-entrypoint": "^1.1.0",
132
- "@atlassian/search-dialog": "^10.23.0",
132
+ "@atlassian/search-dialog": "^10.24.0",
133
133
  "@atlassian/ssr-tests": "workspace:^",
134
134
  "@atlassian/test-utils": "^1.1.0",
135
135
  "@atlassian/testing-library": "^0.12.0",