@atlaskit/page-layout 3.11.2 → 3.11.4

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 (9) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/dist/cjs/components/resize-control/index.js +5 -8
  3. package/dist/cjs/components/skip-links/skip-link-components.js +22 -19
  4. package/dist/cjs/components/slots/left-sidebar.js +1 -2
  5. package/dist/es2019/components/skip-links/skip-link-components.js +21 -18
  6. package/dist/esm/components/resize-control/index.js +5 -8
  7. package/dist/esm/components/skip-links/skip-link-components.js +22 -19
  8. package/dist/esm/components/slots/left-sidebar.js +1 -2
  9. package/package.json +13 -9
package/CHANGELOG.md CHANGED
@@ -1,5 +1,19 @@
1
1
  # @atlaskit/page-layout
2
2
 
3
+ ## 3.11.4
4
+
5
+ ### Patch Changes
6
+
7
+ - [#178053](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/178053)
8
+ [`cb318c8c28c26`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/cb318c8c28c26) -
9
+ Internal changes to typography.
10
+
11
+ ## 3.11.3
12
+
13
+ ### Patch Changes
14
+
15
+ - Updated dependencies
16
+
3
17
  ## 3.11.2
4
18
 
5
19
  ### Patch Changes
package/dist/cjs/components/resize-control/index.js CHANGED
@@ -239,18 +239,16 @@ var ResizeControl = function ResizeControl(_ref) {
239
239
  // min threshold and default width
240
240
  // expand the nav to the default width
241
241
  else if (sidebarWidth.current > _constants.MIN_LEFT_SIDEBAR_DRAG_THRESHOLD && sidebarWidth.current < _constants.DEFAULT_LEFT_SIDEBAR_WIDTH) {
242
- var _objectSpread2;
243
242
  document.documentElement.style.setProperty("--".concat(_constants.VAR_LEFT_SIDEBAR_WIDTH), "".concat(_constants.DEFAULT_LEFT_SIDEBAR_WIDTH, "px"));
244
- updatedLeftSidebarState = _objectSpread(_objectSpread({}, leftSidebarState), {}, (_objectSpread2 = {
243
+ updatedLeftSidebarState = _objectSpread(_objectSpread({}, leftSidebarState), {}, (0, _defineProperty2.default)((0, _defineProperty2.default)({
245
244
  isResizing: false
246
- }, (0, _defineProperty2.default)(_objectSpread2, _constants.VAR_LEFT_SIDEBAR_WIDTH, _constants.DEFAULT_LEFT_SIDEBAR_WIDTH), (0, _defineProperty2.default)(_objectSpread2, "lastLeftSidebarWidth", _constants.DEFAULT_LEFT_SIDEBAR_WIDTH), _objectSpread2));
245
+ }, _constants.VAR_LEFT_SIDEBAR_WIDTH, _constants.DEFAULT_LEFT_SIDEBAR_WIDTH), "lastLeftSidebarWidth", _constants.DEFAULT_LEFT_SIDEBAR_WIDTH));
247
246
  setLeftSidebarState(updatedLeftSidebarState);
248
247
  } else {
249
- var _objectSpread3;
250
248
  // otherwise resize it to the desired width
251
- updatedLeftSidebarState = _objectSpread(_objectSpread({}, leftSidebarState), {}, (_objectSpread3 = {
249
+ updatedLeftSidebarState = _objectSpread(_objectSpread({}, leftSidebarState), {}, (0, _defineProperty2.default)((0, _defineProperty2.default)({
252
250
  isResizing: false
253
- }, (0, _defineProperty2.default)(_objectSpread3, _constants.VAR_LEFT_SIDEBAR_WIDTH, sidebarWidth.current), (0, _defineProperty2.default)(_objectSpread3, "lastLeftSidebarWidth", sidebarWidth.current), _objectSpread3));
251
+ }, _constants.VAR_LEFT_SIDEBAR_WIDTH, sidebarWidth.current), "lastLeftSidebarWidth", sidebarWidth.current));
254
252
  setLeftSidebarState(updatedLeftSidebarState);
255
253
  }
256
254
  (_unbindEvents$current2 = unbindEvents.current) === null || _unbindEvents$current2 === void 0 || _unbindEvents$current2.call(unbindEvents);
@@ -302,10 +300,9 @@ var ResizeControl = function ResizeControl(_ref) {
302
300
  // the browser schedule the setTimeout call in an efficient manner
303
301
  requestAnimationFrame(function () {
304
302
  keyboardEventTimeout.current = window.setTimeout(function () {
305
- var _objectSpread4;
306
303
  keyboardEventTimeout.current && clearTimeout(keyboardEventTimeout.current);
307
304
  document.documentElement.style.setProperty("--".concat(_constants.VAR_LEFT_SIDEBAR_WIDTH), "".concat(width, "px"));
308
- var updatedLeftSidebarState = _objectSpread(_objectSpread({}, leftSidebarState), {}, (_objectSpread4 = {}, (0, _defineProperty2.default)(_objectSpread4, _constants.VAR_LEFT_SIDEBAR_WIDTH, width), (0, _defineProperty2.default)(_objectSpread4, "lastLeftSidebarWidth", width), _objectSpread4));
305
+ var updatedLeftSidebarState = _objectSpread(_objectSpread({}, leftSidebarState), {}, (0, _defineProperty2.default)((0, _defineProperty2.default)({}, _constants.VAR_LEFT_SIDEBAR_WIDTH, width), "lastLeftSidebarWidth", width));
309
306
  setLeftSidebarState(updatedLeftSidebarState);
310
307
  onResizeEnd && onResizeEnd(updatedLeftSidebarState);
311
308
  }, 50);
package/dist/cjs/components/skip-links/skip-link-components.js CHANGED
@@ -41,7 +41,7 @@ var skipLinkStyles = (0, _react.css)({
41
41
  }
42
42
  });
43
43
  var skipLinkHeadingStyles = (0, _react.css)({
44
- fontWeight: 600
44
+ fontWeight: "var(--ds-font-weight-semibold, 600)"
45
45
  });
46
46
  var skipLinkListStyles = (0, _react.css)({
47
47
  listStylePosition: 'outside',
@@ -112,24 +112,27 @@ var SkipLinkWrapper = exports.SkipLinkWrapper = function SkipLinkWrapper(_ref) {
112
112
  };
113
113
  var emptyLabelOverride = !!(skipLinksLabel !== null && skipLinksLabel !== void 0 && skipLinksLabel.match(/^\s+$/));
114
114
  var label = skipLinksLabel || _constants.DEFAULT_I18N_PROPS_SKIP_LINKS;
115
- return (0, _react.jsx)("div", {
116
- onFocus: attachEscHandler,
117
- onBlur: removeEscHandler,
118
- css: [skipLinkStyles, prefersReducedMotionStyles],
119
- "data-skip-link-wrapper": true
120
- }, emptyLabelOverride ? null : (0, _react.jsx)("p", {
121
- css: skipLinkHeadingStyles
122
- }, label), (0, _react.jsx)("ol", {
123
- css: skipLinkListStyles
124
- }, sortSkipLinks(skipLinksData).map(function (_ref2) {
125
- var id = _ref2.id,
126
- skipLinkTitle = _ref2.skipLinkTitle;
127
- return (0, _react.jsx)(SkipLink, {
128
- key: id,
129
- href: "#".concat(id),
130
- isFocusable: true
131
- }, skipLinkTitle);
132
- })));
115
+ return (
116
+ // eslint-disable-next-line jsx-a11y/no-static-element-interactions
117
+ (0, _react.jsx)("div", {
118
+ onFocus: attachEscHandler,
119
+ onBlur: removeEscHandler,
120
+ css: [skipLinkStyles, prefersReducedMotionStyles],
121
+ "data-skip-link-wrapper": true
122
+ }, emptyLabelOverride ? null : (0, _react.jsx)("p", {
123
+ css: skipLinkHeadingStyles
124
+ }, label), (0, _react.jsx)("ol", {
125
+ css: skipLinkListStyles
126
+ }, sortSkipLinks(skipLinksData).map(function (_ref2) {
127
+ var id = _ref2.id,
128
+ skipLinkTitle = _ref2.skipLinkTitle;
129
+ return (0, _react.jsx)(SkipLink, {
130
+ key: id,
131
+ href: "#".concat(id),
132
+ isFocusable: true
133
+ }, skipLinkTitle);
134
+ })))
135
+ );
133
136
  };
134
137
  var handleBlur = function handleBlur(event) {
135
138
  // @ts-ignore
package/dist/cjs/components/slots/left-sidebar.js CHANGED
@@ -154,8 +154,7 @@ var LeftSidebar = function LeftSidebar(props) {
154
154
  var notFirstRun = (0, _react.useRef)(false);
155
155
  (0, _react.useEffect)(function () {
156
156
  if (notFirstRun.current) {
157
- var _publishGridState;
158
- (0, _controllers.publishGridState)((_publishGridState = {}, (0, _defineProperty2.default)(_publishGridState, _constants.VAR_LEFT_SIDEBAR_WIDTH, leftSidebarWidth || leftSidebarWidthOnMount), (0, _defineProperty2.default)(_publishGridState, _constants.VAR_LEFT_SIDEBAR_FLYOUT, lastLeftSidebarWidth), _publishGridState));
157
+ (0, _controllers.publishGridState)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _constants.VAR_LEFT_SIDEBAR_WIDTH, leftSidebarWidth || leftSidebarWidthOnMount), _constants.VAR_LEFT_SIDEBAR_FLYOUT, lastLeftSidebarWidth));
159
158
  (0, _utils.mergeGridStateIntoStorage)('isLeftSidebarCollapsed', isLeftSidebarCollapsed);
160
159
  }
161
160
  if (!notFirstRun.current) {
package/dist/es2019/components/skip-links/skip-link-components.js CHANGED
@@ -34,7 +34,7 @@ const skipLinkStyles = css({
34
34
  }
35
35
  });
36
36
  const skipLinkHeadingStyles = css({
37
- fontWeight: 600
37
+ fontWeight: "var(--ds-font-weight-semibold, 600)"
38
38
  });
39
39
  const skipLinkListStyles = css({
40
40
  listStylePosition: 'outside',
@@ -96,23 +96,26 @@ export const SkipLinkWrapper = ({
96
96
  const removeEscHandler = () => window.removeEventListener('keydown', escapeHandler, false);
97
97
  const emptyLabelOverride = !!(skipLinksLabel !== null && skipLinksLabel !== void 0 && skipLinksLabel.match(/^\s+$/));
98
98
  const label = skipLinksLabel || DEFAULT_I18N_PROPS_SKIP_LINKS;
99
- return jsx("div", {
100
- onFocus: attachEscHandler,
101
- onBlur: removeEscHandler,
102
- css: [skipLinkStyles, prefersReducedMotionStyles],
103
- "data-skip-link-wrapper": true
104
- }, emptyLabelOverride ? null : jsx("p", {
105
- css: skipLinkHeadingStyles
106
- }, label), jsx("ol", {
107
- css: skipLinkListStyles
108
- }, sortSkipLinks(skipLinksData).map(({
109
- id,
110
- skipLinkTitle
111
- }) => jsx(SkipLink, {
112
- key: id,
113
- href: `#${id}`,
114
- isFocusable: true
115
- }, skipLinkTitle))));
99
+ return (
100
+ // eslint-disable-next-line jsx-a11y/no-static-element-interactions
101
+ jsx("div", {
102
+ onFocus: attachEscHandler,
103
+ onBlur: removeEscHandler,
104
+ css: [skipLinkStyles, prefersReducedMotionStyles],
105
+ "data-skip-link-wrapper": true
106
+ }, emptyLabelOverride ? null : jsx("p", {
107
+ css: skipLinkHeadingStyles
108
+ }, label), jsx("ol", {
109
+ css: skipLinkListStyles
110
+ }, sortSkipLinks(skipLinksData).map(({
111
+ id,
112
+ skipLinkTitle
113
+ }) => jsx(SkipLink, {
114
+ key: id,
115
+ href: `#${id}`,
116
+ isFocusable: true
117
+ }, skipLinkTitle))))
118
+ );
116
119
  };
117
120
  const handleBlur = event => {
118
121
  // @ts-ignore
package/dist/esm/components/resize-control/index.js CHANGED
@@ -236,18 +236,16 @@ var ResizeControl = function ResizeControl(_ref) {
236
236
  // min threshold and default width
237
237
  // expand the nav to the default width
238
238
  else if (sidebarWidth.current > MIN_LEFT_SIDEBAR_DRAG_THRESHOLD && sidebarWidth.current < DEFAULT_LEFT_SIDEBAR_WIDTH) {
239
- var _objectSpread2;
240
239
  document.documentElement.style.setProperty("--".concat(VAR_LEFT_SIDEBAR_WIDTH), "".concat(DEFAULT_LEFT_SIDEBAR_WIDTH, "px"));
241
- updatedLeftSidebarState = _objectSpread(_objectSpread({}, leftSidebarState), {}, (_objectSpread2 = {
240
+ updatedLeftSidebarState = _objectSpread(_objectSpread({}, leftSidebarState), {}, _defineProperty(_defineProperty({
242
241
  isResizing: false
243
- }, _defineProperty(_objectSpread2, VAR_LEFT_SIDEBAR_WIDTH, DEFAULT_LEFT_SIDEBAR_WIDTH), _defineProperty(_objectSpread2, "lastLeftSidebarWidth", DEFAULT_LEFT_SIDEBAR_WIDTH), _objectSpread2));
242
+ }, VAR_LEFT_SIDEBAR_WIDTH, DEFAULT_LEFT_SIDEBAR_WIDTH), "lastLeftSidebarWidth", DEFAULT_LEFT_SIDEBAR_WIDTH));
244
243
  setLeftSidebarState(updatedLeftSidebarState);
245
244
  } else {
246
- var _objectSpread3;
247
245
  // otherwise resize it to the desired width
248
- updatedLeftSidebarState = _objectSpread(_objectSpread({}, leftSidebarState), {}, (_objectSpread3 = {
246
+ updatedLeftSidebarState = _objectSpread(_objectSpread({}, leftSidebarState), {}, _defineProperty(_defineProperty({
249
247
  isResizing: false
250
- }, _defineProperty(_objectSpread3, VAR_LEFT_SIDEBAR_WIDTH, sidebarWidth.current), _defineProperty(_objectSpread3, "lastLeftSidebarWidth", sidebarWidth.current), _objectSpread3));
248
+ }, VAR_LEFT_SIDEBAR_WIDTH, sidebarWidth.current), "lastLeftSidebarWidth", sidebarWidth.current));
251
249
  setLeftSidebarState(updatedLeftSidebarState);
252
250
  }
253
251
  (_unbindEvents$current2 = unbindEvents.current) === null || _unbindEvents$current2 === void 0 || _unbindEvents$current2.call(unbindEvents);
@@ -299,10 +297,9 @@ var ResizeControl = function ResizeControl(_ref) {
299
297
  // the browser schedule the setTimeout call in an efficient manner
300
298
  requestAnimationFrame(function () {
301
299
  keyboardEventTimeout.current = window.setTimeout(function () {
302
- var _objectSpread4;
303
300
  keyboardEventTimeout.current && clearTimeout(keyboardEventTimeout.current);
304
301
  document.documentElement.style.setProperty("--".concat(VAR_LEFT_SIDEBAR_WIDTH), "".concat(width, "px"));
305
- var updatedLeftSidebarState = _objectSpread(_objectSpread({}, leftSidebarState), {}, (_objectSpread4 = {}, _defineProperty(_objectSpread4, VAR_LEFT_SIDEBAR_WIDTH, width), _defineProperty(_objectSpread4, "lastLeftSidebarWidth", width), _objectSpread4));
302
+ var updatedLeftSidebarState = _objectSpread(_objectSpread({}, leftSidebarState), {}, _defineProperty(_defineProperty({}, VAR_LEFT_SIDEBAR_WIDTH, width), "lastLeftSidebarWidth", width));
306
303
  setLeftSidebarState(updatedLeftSidebarState);
307
304
  onResizeEnd && onResizeEnd(updatedLeftSidebarState);
308
305
  }, 50);
package/dist/esm/components/skip-links/skip-link-components.js CHANGED
@@ -38,7 +38,7 @@ var skipLinkStyles = css({
38
38
  }
39
39
  });
40
40
  var skipLinkHeadingStyles = css({
41
- fontWeight: 600
41
+ fontWeight: "var(--ds-font-weight-semibold, 600)"
42
42
  });
43
43
  var skipLinkListStyles = css({
44
44
  listStylePosition: 'outside',
@@ -109,24 +109,27 @@ export var SkipLinkWrapper = function SkipLinkWrapper(_ref) {
109
109
  };
110
110
  var emptyLabelOverride = !!(skipLinksLabel !== null && skipLinksLabel !== void 0 && skipLinksLabel.match(/^\s+$/));
111
111
  var label = skipLinksLabel || DEFAULT_I18N_PROPS_SKIP_LINKS;
112
- return jsx("div", {
113
- onFocus: attachEscHandler,
114
- onBlur: removeEscHandler,
115
- css: [skipLinkStyles, prefersReducedMotionStyles],
116
- "data-skip-link-wrapper": true
117
- }, emptyLabelOverride ? null : jsx("p", {
118
- css: skipLinkHeadingStyles
119
- }, label), jsx("ol", {
120
- css: skipLinkListStyles
121
- }, sortSkipLinks(skipLinksData).map(function (_ref2) {
122
- var id = _ref2.id,
123
- skipLinkTitle = _ref2.skipLinkTitle;
124
- return jsx(SkipLink, {
125
- key: id,
126
- href: "#".concat(id),
127
- isFocusable: true
128
- }, skipLinkTitle);
129
- })));
112
+ return (
113
+ // eslint-disable-next-line jsx-a11y/no-static-element-interactions
114
+ jsx("div", {
115
+ onFocus: attachEscHandler,
116
+ onBlur: removeEscHandler,
117
+ css: [skipLinkStyles, prefersReducedMotionStyles],
118
+ "data-skip-link-wrapper": true
119
+ }, emptyLabelOverride ? null : jsx("p", {
120
+ css: skipLinkHeadingStyles
121
+ }, label), jsx("ol", {
122
+ css: skipLinkListStyles
123
+ }, sortSkipLinks(skipLinksData).map(function (_ref2) {
124
+ var id = _ref2.id,
125
+ skipLinkTitle = _ref2.skipLinkTitle;
126
+ return jsx(SkipLink, {
127
+ key: id,
128
+ href: "#".concat(id),
129
+ isFocusable: true
130
+ }, skipLinkTitle);
131
+ })))
132
+ );
130
133
  };
131
134
  var handleBlur = function handleBlur(event) {
132
135
  // @ts-ignore
package/dist/esm/components/slots/left-sidebar.js CHANGED
@@ -151,8 +151,7 @@ var LeftSidebar = function LeftSidebar(props) {
151
151
  var notFirstRun = useRef(false);
152
152
  useEffect(function () {
153
153
  if (notFirstRun.current) {
154
- var _publishGridState;
155
- publishGridState((_publishGridState = {}, _defineProperty(_publishGridState, VAR_LEFT_SIDEBAR_WIDTH, leftSidebarWidth || leftSidebarWidthOnMount), _defineProperty(_publishGridState, VAR_LEFT_SIDEBAR_FLYOUT, lastLeftSidebarWidth), _publishGridState));
154
+ publishGridState(_defineProperty(_defineProperty({}, VAR_LEFT_SIDEBAR_WIDTH, leftSidebarWidth || leftSidebarWidthOnMount), VAR_LEFT_SIDEBAR_FLYOUT, lastLeftSidebarWidth));
156
155
  mergeGridStateIntoStorage('isLeftSidebarCollapsed', isLeftSidebarCollapsed);
157
156
  }
158
157
  if (!notFirstRun.current) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/page-layout",
3
- "version": "3.11.2",
3
+ "version": "3.11.4",
4
4
  "description": "A collection of components which let you compose an application's page layout.",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -31,19 +31,23 @@
31
31
  "team": "Design System Team",
32
32
  "website": {
33
33
  "name": "Page layout",
34
- "category": "Components"
34
+ "category": "Layout and structure",
35
+ "status": {
36
+ "type": "intent-to-deprecate",
37
+ "description": "We are in the process of building a new page layout component: [@atlassian/navigation-system](https://staging.atlassian.design/components/navigation-system/page-layout/examples) (For Atlassian employees only at this stage)"
38
+ }
35
39
  },
36
40
  "runReact18": true
37
41
  },
38
42
  "homepage": "https://atlassian.design/components/page-layout/",
39
43
  "dependencies": {
40
- "@atlaskit/ds-lib": "^3.2.0",
41
- "@atlaskit/icon": "^22.24.0",
44
+ "@atlaskit/ds-lib": "^3.3.0",
45
+ "@atlaskit/icon": "^23.1.0",
42
46
  "@atlaskit/link": "^1.2.0",
43
47
  "@atlaskit/motion": "^1.9.0",
44
- "@atlaskit/primitives": "^13.2.0",
48
+ "@atlaskit/primitives": "^13.3.0",
45
49
  "@atlaskit/theme": "^14.0.0",
46
- "@atlaskit/tokens": "^2.2.0",
50
+ "@atlaskit/tokens": "^2.4.0",
47
51
  "@babel/runtime": "^7.0.0",
48
52
  "@emotion/react": "^11.7.1",
49
53
  "bind-event-listener": "^3.0.0",
@@ -59,15 +63,15 @@
59
63
  "@atlaskit/atlassian-navigation": "^4.9.0",
60
64
  "@atlaskit/atlassian-notifications": "^0.5.0",
61
65
  "@atlaskit/drawer": "^9.2.0",
62
- "@atlaskit/logo": "^14.3.0",
66
+ "@atlaskit/logo": "^15.1.0",
63
67
  "@atlaskit/menu": "^2.13.0",
64
68
  "@atlaskit/notification-indicator": "^9.4.0",
65
69
  "@atlaskit/notification-log-client": "^6.1.0",
66
- "@atlaskit/popup": "^1.29.0",
70
+ "@atlaskit/popup": "^1.30.0",
67
71
  "@atlaskit/side-navigation": "^3.6.0",
68
72
  "@atlaskit/ssr": "*",
69
73
  "@atlaskit/toggle": "^13.4.0",
70
- "@atlaskit/tooltip": "^18.9.0",
74
+ "@atlaskit/tooltip": "^19.0.0",
71
75
  "@atlaskit/visual-regression": "*",
72
76
  "@testing-library/dom": "^10.1.0",
73
77
  "@testing-library/react": "^12.1.5",