@atlaskit/renderer 132.1.0 → 132.1.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 (13) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/dist/cjs/react/nodes/multiBodiedExtension/context.js +36 -7
  3. package/dist/cjs/react/nodes/multiBodiedExtension.js +2 -0
  4. package/dist/cjs/ui/Renderer/index.js +1 -1
  5. package/dist/es2019/react/nodes/multiBodiedExtension/context.js +34 -4
  6. package/dist/es2019/react/nodes/multiBodiedExtension.js +2 -0
  7. package/dist/es2019/ui/Renderer/index.js +1 -1
  8. package/dist/esm/react/nodes/multiBodiedExtension/context.js +36 -7
  9. package/dist/esm/react/nodes/multiBodiedExtension.js +2 -0
  10. package/dist/esm/ui/Renderer/index.js +1 -1
  11. package/dist/types/react/nodes/multiBodiedExtension/context.d.ts +3 -1
  12. package/dist/types-ts4.5/react/nodes/multiBodiedExtension/context.d.ts +3 -1
  13. package/package.json +5 -2
package/CHANGELOG.md CHANGED
@@ -1,5 +1,13 @@
1
1
  # @atlaskit/renderer
2
2
 
3
+ ## 132.1.1
4
+
5
+ ### Patch Changes
6
+
7
+ - [`03ac1a9785ec4`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/03ac1a9785ec4) -
8
+ Use extension handler renderers for multi-bodied extensions.
9
+ - Updated dependencies
10
+
3
11
  ## 132.1.0
4
12
 
5
13
  ### Minor Changes
package/dist/cjs/react/nodes/multiBodiedExtension/context.js CHANGED
@@ -10,9 +10,20 @@ var _react = _interopRequireDefault(require("react"));
10
10
  var _memoizeOne = _interopRequireDefault(require("memoize-one"));
11
11
  var _extensions = require("@atlaskit/editor-common/extensions");
12
12
  var _providerFactory = require("@atlaskit/editor-common/provider-factory");
13
- var useMultiBodiedExtensionContext = exports.useMultiBodiedExtensionContext = function useMultiBodiedExtensionContext(_ref) {
14
- var extensionType = _ref.extensionType,
15
- extensionKey = _ref.extensionKey;
13
+ var _utils = require("@atlaskit/editor-common/utils");
14
+ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
15
+ var getExtensionHandlerNode = function getExtensionHandlerNode(extensionHandler) {
16
+ return function (_ref) {
17
+ var node = _ref.node,
18
+ doc = _ref.doc,
19
+ actions = _ref.actions;
20
+ return extensionHandler(node, doc, actions);
21
+ };
22
+ };
23
+ var useMultiBodiedExtensionContext = exports.useMultiBodiedExtensionContext = function useMultiBodiedExtensionContext(_ref2) {
24
+ var extensionHandlers = _ref2.extensionHandlers,
25
+ extensionType = _ref2.extensionType,
26
+ extensionKey = _ref2.extensionKey;
16
27
  var isMounted = _react.default.useRef(true);
17
28
  var localGetNodeRenderer = _react.default.useMemo(function () {
18
29
  return (0, _memoizeOne.default)(_extensions.getNodeRenderer);
@@ -27,6 +38,13 @@ var useMultiBodiedExtensionContext = exports.useMultiBodiedExtensionContext = fu
27
38
  privateProps = _React$useState4[0],
28
39
  setPrivateProps = _React$useState4[1];
29
40
  var providerPromise = (0, _providerFactory.useProvider)('extensionProvider');
41
+ var ExtensionHandlerNode = _react.default.useMemo(function () {
42
+ var extensionHandler = extensionHandlers && extensionHandlers[extensionType] && (0, _utils.getExtensionRenderer)(extensionHandlers[extensionType]);
43
+ if (extensionHandler) {
44
+ return getExtensionHandlerNode(extensionHandler);
45
+ }
46
+ return null;
47
+ }, [extensionHandlers, extensionType]);
30
48
  _react.default.useEffect(function () {
31
49
  if (providerPromise) {
32
50
  providerPromise.then(function (p) {
@@ -41,7 +59,7 @@ var useMultiBodiedExtensionContext = exports.useMultiBodiedExtensionContext = fu
41
59
  });
42
60
  }
43
61
  }, [providerPromise, extensionType, extensionKey]);
44
- var NodeRenderer = _react.default.useMemo(function () {
62
+ var ExtensionProviderNode = _react.default.useMemo(function () {
45
63
  if (!provider) {
46
64
  return null;
47
65
  }
@@ -54,7 +72,18 @@ var useMultiBodiedExtensionContext = exports.useMultiBodiedExtensionContext = fu
54
72
  };
55
73
  }, []);
56
74
  return _react.default.useMemo(function () {
57
- if (!provider || !NodeRenderer || !privateProps) {
75
+ if (ExtensionHandlerNode && (0, _platformFeatureFlags.fg)('confluence_frontend_native_tabs_extension')) {
76
+ return {
77
+ extensionContext: {
78
+ NodeRenderer: ExtensionHandlerNode,
79
+ privateProps: {
80
+ __allowBodiedOverride: true
81
+ }
82
+ },
83
+ loading: false
84
+ };
85
+ }
86
+ if (!provider || !ExtensionProviderNode || !privateProps) {
58
87
  return {
59
88
  extensionContext: null,
60
89
  loading: true
@@ -62,10 +91,10 @@ var useMultiBodiedExtensionContext = exports.useMultiBodiedExtensionContext = fu
62
91
  }
63
92
  return {
64
93
  extensionContext: {
65
- NodeRenderer: NodeRenderer,
94
+ NodeRenderer: ExtensionProviderNode,
66
95
  privateProps: privateProps
67
96
  },
68
97
  loading: false
69
98
  };
70
- }, [provider, NodeRenderer, privateProps]);
99
+ }, [ExtensionHandlerNode, provider, ExtensionProviderNode, privateProps]);
71
100
  };
package/dist/cjs/react/nodes/multiBodiedExtension.js CHANGED
@@ -115,6 +115,7 @@ var MultiBodiedExtension = function MultiBodiedExtension(props) {
115
115
  parameters = props.parameters,
116
116
  extensionType = props.extensionType,
117
117
  extensionKey = props.extensionKey,
118
+ extensionHandlers = props.extensionHandlers,
118
119
  content = props.content,
119
120
  marks = props.marks,
120
121
  localId = props.localId,
@@ -124,6 +125,7 @@ var MultiBodiedExtension = function MultiBodiedExtension(props) {
124
125
  activeChildIndex = _useState2[0],
125
126
  setActiveChildIndex = _useState2[1];
126
127
  var _useMultiBodiedExtens = (0, _context.useMultiBodiedExtensionContext)({
128
+ extensionHandlers: extensionHandlers,
127
129
  extensionType: extensionType,
128
130
  extensionKey: extensionKey
129
131
  }),
package/dist/cjs/ui/Renderer/index.js CHANGED
@@ -72,7 +72,7 @@ var DEGRADED_SEVERITY_THRESHOLD = exports.DEGRADED_SEVERITY_THRESHOLD = 3000;
72
72
  var TABLE_INFO_TIMEOUT = 10000;
73
73
  var RENDER_EVENT_SAMPLE_RATE = 0.2;
74
74
  var packageName = "@atlaskit/renderer";
75
- var packageVersion = "132.0.4";
75
+ var packageVersion = "132.1.0";
76
76
  var setAsQueryContainerStyles = (0, _react2.css)({
77
77
  containerName: 'ak-renderer-wrapper',
78
78
  containerType: 'inline-size'
package/dist/es2019/react/nodes/multiBodiedExtension/context.js CHANGED
@@ -2,7 +2,19 @@ import React from 'react';
2
2
  import memoizeOne from 'memoize-one';
3
3
  import { getExtensionModuleNodePrivateProps, getNodeRenderer } from '@atlaskit/editor-common/extensions';
4
4
  import { useProvider } from '@atlaskit/editor-common/provider-factory';
5
+ import { getExtensionRenderer } from '@atlaskit/editor-common/utils';
6
+ import { fg } from '@atlaskit/platform-feature-flags';
7
+ const getExtensionHandlerNode = extensionHandler => {
8
+ return ({
9
+ node,
10
+ doc,
11
+ actions
12
+ }) => {
13
+ return extensionHandler(node, doc, actions);
14
+ };
15
+ };
5
16
  export const useMultiBodiedExtensionContext = ({
17
+ extensionHandlers,
6
18
  extensionType,
7
19
  extensionKey
8
20
  }) => {
@@ -12,6 +24,13 @@ export const useMultiBodiedExtensionContext = ({
12
24
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
13
25
  const [privateProps, setPrivateProps] = React.useState();
14
26
  const providerPromise = useProvider('extensionProvider');
27
+ const ExtensionHandlerNode = React.useMemo(() => {
28
+ const extensionHandler = extensionHandlers && extensionHandlers[extensionType] && getExtensionRenderer(extensionHandlers[extensionType]);
29
+ if (extensionHandler) {
30
+ return getExtensionHandlerNode(extensionHandler);
31
+ }
32
+ return null;
33
+ }, [extensionHandlers, extensionType]);
15
34
  React.useEffect(() => {
16
35
  if (providerPromise) {
17
36
  providerPromise.then(p => {
@@ -26,7 +45,7 @@ export const useMultiBodiedExtensionContext = ({
26
45
  });
27
46
  }
28
47
  }, [providerPromise, extensionType, extensionKey]);
29
- const NodeRenderer = React.useMemo(() => {
48
+ const ExtensionProviderNode = React.useMemo(() => {
30
49
  if (!provider) {
31
50
  return null;
32
51
  }
@@ -39,7 +58,18 @@ export const useMultiBodiedExtensionContext = ({
39
58
  };
40
59
  }, []);
41
60
  return React.useMemo(() => {
42
- if (!provider || !NodeRenderer || !privateProps) {
61
+ if (ExtensionHandlerNode && fg('confluence_frontend_native_tabs_extension')) {
62
+ return {
63
+ extensionContext: {
64
+ NodeRenderer: ExtensionHandlerNode,
65
+ privateProps: {
66
+ __allowBodiedOverride: true
67
+ }
68
+ },
69
+ loading: false
70
+ };
71
+ }
72
+ if (!provider || !ExtensionProviderNode || !privateProps) {
43
73
  return {
44
74
  extensionContext: null,
45
75
  loading: true
@@ -47,10 +77,10 @@ export const useMultiBodiedExtensionContext = ({
47
77
  }
48
78
  return {
49
79
  extensionContext: {
50
- NodeRenderer,
80
+ NodeRenderer: ExtensionProviderNode,
51
81
  privateProps
52
82
  },
53
83
  loading: false
54
84
  };
55
- }, [provider, NodeRenderer, privateProps]);
85
+ }, [ExtensionHandlerNode, provider, ExtensionProviderNode, privateProps]);
56
86
  };
package/dist/es2019/react/nodes/multiBodiedExtension.js CHANGED
@@ -107,6 +107,7 @@ const MultiBodiedExtension = props => {
107
107
  parameters,
108
108
  extensionType,
109
109
  extensionKey,
110
+ extensionHandlers,
110
111
  content,
111
112
  marks,
112
113
  localId,
@@ -117,6 +118,7 @@ const MultiBodiedExtension = props => {
117
118
  loading,
118
119
  extensionContext
119
120
  } = useMultiBodiedExtensionContext({
121
+ extensionHandlers,
120
122
  extensionType,
121
123
  extensionKey
122
124
  });
package/dist/es2019/ui/Renderer/index.js CHANGED
@@ -58,7 +58,7 @@ export const DEGRADED_SEVERITY_THRESHOLD = 3000;
58
58
  const TABLE_INFO_TIMEOUT = 10000;
59
59
  const RENDER_EVENT_SAMPLE_RATE = 0.2;
60
60
  const packageName = "@atlaskit/renderer";
61
- const packageVersion = "132.0.4";
61
+ const packageVersion = "132.1.0";
62
62
  const setAsQueryContainerStyles = css({
63
63
  containerName: 'ak-renderer-wrapper',
64
64
  containerType: 'inline-size'
package/dist/esm/react/nodes/multiBodiedExtension/context.js CHANGED
@@ -3,9 +3,20 @@ import React from 'react';
3
3
  import memoizeOne from 'memoize-one';
4
4
  import { getExtensionModuleNodePrivateProps, getNodeRenderer } from '@atlaskit/editor-common/extensions';
5
5
  import { useProvider } from '@atlaskit/editor-common/provider-factory';
6
- export var useMultiBodiedExtensionContext = function useMultiBodiedExtensionContext(_ref) {
7
- var extensionType = _ref.extensionType,
8
- extensionKey = _ref.extensionKey;
6
+ import { getExtensionRenderer } from '@atlaskit/editor-common/utils';
7
+ import { fg } from '@atlaskit/platform-feature-flags';
8
+ var getExtensionHandlerNode = function getExtensionHandlerNode(extensionHandler) {
9
+ return function (_ref) {
10
+ var node = _ref.node,
11
+ doc = _ref.doc,
12
+ actions = _ref.actions;
13
+ return extensionHandler(node, doc, actions);
14
+ };
15
+ };
16
+ export var useMultiBodiedExtensionContext = function useMultiBodiedExtensionContext(_ref2) {
17
+ var extensionHandlers = _ref2.extensionHandlers,
18
+ extensionType = _ref2.extensionType,
19
+ extensionKey = _ref2.extensionKey;
9
20
  var isMounted = React.useRef(true);
10
21
  var localGetNodeRenderer = React.useMemo(function () {
11
22
  return memoizeOne(getNodeRenderer);
@@ -20,6 +31,13 @@ export var useMultiBodiedExtensionContext = function useMultiBodiedExtensionCont
20
31
  privateProps = _React$useState4[0],
21
32
  setPrivateProps = _React$useState4[1];
22
33
  var providerPromise = useProvider('extensionProvider');
34
+ var ExtensionHandlerNode = React.useMemo(function () {
35
+ var extensionHandler = extensionHandlers && extensionHandlers[extensionType] && getExtensionRenderer(extensionHandlers[extensionType]);
36
+ if (extensionHandler) {
37
+ return getExtensionHandlerNode(extensionHandler);
38
+ }
39
+ return null;
40
+ }, [extensionHandlers, extensionType]);
23
41
  React.useEffect(function () {
24
42
  if (providerPromise) {
25
43
  providerPromise.then(function (p) {
@@ -34,7 +52,7 @@ export var useMultiBodiedExtensionContext = function useMultiBodiedExtensionCont
34
52
  });
35
53
  }
36
54
  }, [providerPromise, extensionType, extensionKey]);
37
- var NodeRenderer = React.useMemo(function () {
55
+ var ExtensionProviderNode = React.useMemo(function () {
38
56
  if (!provider) {
39
57
  return null;
40
58
  }
@@ -47,7 +65,18 @@ export var useMultiBodiedExtensionContext = function useMultiBodiedExtensionCont
47
65
  };
48
66
  }, []);
49
67
  return React.useMemo(function () {
50
- if (!provider || !NodeRenderer || !privateProps) {
68
+ if (ExtensionHandlerNode && fg('confluence_frontend_native_tabs_extension')) {
69
+ return {
70
+ extensionContext: {
71
+ NodeRenderer: ExtensionHandlerNode,
72
+ privateProps: {
73
+ __allowBodiedOverride: true
74
+ }
75
+ },
76
+ loading: false
77
+ };
78
+ }
79
+ if (!provider || !ExtensionProviderNode || !privateProps) {
51
80
  return {
52
81
  extensionContext: null,
53
82
  loading: true
@@ -55,10 +84,10 @@ export var useMultiBodiedExtensionContext = function useMultiBodiedExtensionCont
55
84
  }
56
85
  return {
57
86
  extensionContext: {
58
- NodeRenderer: NodeRenderer,
87
+ NodeRenderer: ExtensionProviderNode,
59
88
  privateProps: privateProps
60
89
  },
61
90
  loading: false
62
91
  };
63
- }, [provider, NodeRenderer, privateProps]);
92
+ }, [ExtensionHandlerNode, provider, ExtensionProviderNode, privateProps]);
64
93
  };
package/dist/esm/react/nodes/multiBodiedExtension.js CHANGED
@@ -107,6 +107,7 @@ var MultiBodiedExtension = function MultiBodiedExtension(props) {
107
107
  parameters = props.parameters,
108
108
  extensionType = props.extensionType,
109
109
  extensionKey = props.extensionKey,
110
+ extensionHandlers = props.extensionHandlers,
110
111
  content = props.content,
111
112
  marks = props.marks,
112
113
  localId = props.localId,
@@ -116,6 +117,7 @@ var MultiBodiedExtension = function MultiBodiedExtension(props) {
116
117
  activeChildIndex = _useState2[0],
117
118
  setActiveChildIndex = _useState2[1];
118
119
  var _useMultiBodiedExtens = useMultiBodiedExtensionContext({
120
+ extensionHandlers: extensionHandlers,
119
121
  extensionType: extensionType,
120
122
  extensionKey: extensionKey
121
123
  }),
package/dist/esm/ui/Renderer/index.js CHANGED
@@ -63,7 +63,7 @@ export var DEGRADED_SEVERITY_THRESHOLD = 3000;
63
63
  var TABLE_INFO_TIMEOUT = 10000;
64
64
  var RENDER_EVENT_SAMPLE_RATE = 0.2;
65
65
  var packageName = "@atlaskit/renderer";
66
- var packageVersion = "132.0.4";
66
+ var packageVersion = "132.1.0";
67
67
  var setAsQueryContainerStyles = css({
68
68
  containerName: 'ak-renderer-wrapper',
69
69
  containerType: 'inline-size'
package/dist/types/react/nodes/multiBodiedExtension/context.d.ts CHANGED
@@ -1,5 +1,7 @@
1
1
  import React from 'react';
2
+ import type { ExtensionHandlers } from '@atlaskit/editor-common/extensions';
2
3
  type useMultiBodiedExtensionContextProps = {
4
+ extensionHandlers?: ExtensionHandlers;
3
5
  extensionKey: string;
4
6
  extensionType: string;
5
7
  };
@@ -13,5 +15,5 @@ export type MultiBodiedExtensionContext = {
13
15
  [prop: string]: any;
14
16
  };
15
17
  };
16
- export declare const useMultiBodiedExtensionContext: ({ extensionType, extensionKey, }: useMultiBodiedExtensionContextProps) => MultiBodiedExtensionLoadingContext;
18
+ export declare const useMultiBodiedExtensionContext: ({ extensionHandlers, extensionType, extensionKey, }: useMultiBodiedExtensionContextProps) => MultiBodiedExtensionLoadingContext;
17
19
  export {};
package/dist/types-ts4.5/react/nodes/multiBodiedExtension/context.d.ts CHANGED
@@ -1,5 +1,7 @@
1
1
  import React from 'react';
2
+ import type { ExtensionHandlers } from '@atlaskit/editor-common/extensions';
2
3
  type useMultiBodiedExtensionContextProps = {
4
+ extensionHandlers?: ExtensionHandlers;
3
5
  extensionKey: string;
4
6
  extensionType: string;
5
7
  };
@@ -13,5 +15,5 @@ export type MultiBodiedExtensionContext = {
13
15
  [prop: string]: any;
14
16
  };
15
17
  };
16
- export declare const useMultiBodiedExtensionContext: ({ extensionType, extensionKey, }: useMultiBodiedExtensionContextProps) => MultiBodiedExtensionLoadingContext;
18
+ export declare const useMultiBodiedExtensionContext: ({ extensionHandlers, extensionType, extensionKey, }: useMultiBodiedExtensionContextProps) => MultiBodiedExtensionLoadingContext;
17
19
  export {};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/renderer",
3
- "version": "132.1.0",
3
+ "version": "132.1.1",
4
4
  "description": "Renderer component",
5
5
  "publishConfig": {
6
6
  "registry": "https://registry.npmjs.org/"
@@ -66,7 +66,7 @@
66
66
  "@atlaskit/status": "^4.1.0",
67
67
  "@atlaskit/task-decision": "^20.1.0",
68
68
  "@atlaskit/theme": "^25.0.0",
69
- "@atlaskit/tmp-editor-statsig": "^91.0.0",
69
+ "@atlaskit/tmp-editor-statsig": "^92.0.0",
70
70
  "@atlaskit/tokens": "^13.3.0",
71
71
  "@atlaskit/tooltip": "^22.6.0",
72
72
  "@atlaskit/visually-hidden": "^3.1.0",
@@ -152,6 +152,9 @@
152
152
  "confluence_frontend_table_scrollbar_ttvc_fix": {
153
153
  "type": "boolean"
154
154
  },
155
+ "confluence_frontend_native_tabs_extension": {
156
+ "type": "boolean"
157
+ },
155
158
  "cc_comments_log_draft_annotation_ancestor_nodes": {
156
159
  "type": "boolean"
157
160
  },