@atlaskit/link-datasource 4.32.0 → 4.32.1

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @atlaskit/link-datasource
 
+## 4.32.1
+
+### Patch Changes
+
+- [`1d8c8a19192b2`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/1d8c8a19192b2) -
+  [ux] For Jira inlne editing dropdown (status, assignee) are now show over the edge of scrallable
+  table. Behind FG platform_navx_sllv_j2ws_dropdown_for_single_row
+
 ## 4.32.0
 
 ### Minor Changes

package/dist/cjs/ui/issue-like-table/edit-type/icon/index.js

@@ -48,6 +48,7 @@ var IconEditType = function IconEditType(props) {
   return /*#__PURE__*/_react.default.createElement(_layering.Layering, {
     isDisabled: false
   }, /*#__PURE__*/_react.default.createElement(_select.default, (0, _extends2.default)({}, (0, _utils.getCleanedSelectProps)(props), {
+    menuPortalTarget: (0, _platformFeatureFlags.fg)('platform_navx_sllv_j2ws_dropdown_for_single_row') ? document.body : undefined,
     autoFocus: true,
     blurInputOnSelect: true,
     defaultMenuIsOpen: true

package/dist/cjs/ui/issue-like-table/edit-type/status/index.js

@@ -48,6 +48,7 @@ var StatusEditType = function StatusEditType(props) {
   return /*#__PURE__*/_react.default.createElement(_layering.Layering, {
     isDisabled: false
   }, /*#__PURE__*/_react.default.createElement(_select.default, (0, _extends2.default)({}, (0, _utils.getCleanedSelectProps)(props), {
+    menuPortalTarget: (0, _platformFeatureFlags.fg)('platform_navx_sllv_j2ws_dropdown_for_single_row') ? document.body : undefined,
     autoFocus: true,
     options: options,
     defaultMenuIsOpen: true,

package/dist/cjs/ui/issue-like-table/edit-type/user/index.js

@@ -78,6 +78,7 @@ var UserEditType = function UserEditType(props) {
   return /*#__PURE__*/_react.default.createElement(_layering.Layering, {
     isDisabled: false
   }, /*#__PURE__*/_react.default.createElement(_select.default, (0, _extends2.default)({}, (0, _utils.getCleanedSelectProps)(props), {
+    menuPortalTarget: (0, _platformFeatureFlags.fg)('platform_navx_sllv_j2ws_dropdown_for_single_row') ? document.body : undefined,
     autoFocus: true,
     defaultMenuIsOpen: true,
     blurInputOnSelect: true,

package/dist/es2019/ui/issue-like-table/edit-type/icon/index.js

@@ -42,6 +42,7 @@ const IconEditType = props => {
   return /*#__PURE__*/React.createElement(Layering, {
     isDisabled: false
   }, /*#__PURE__*/React.createElement(Select, _extends({}, getCleanedSelectProps(props), {
+    menuPortalTarget: fg('platform_navx_sllv_j2ws_dropdown_for_single_row') ? document.body : undefined,
     autoFocus: true,
     blurInputOnSelect: true,
     defaultMenuIsOpen: true

package/dist/es2019/ui/issue-like-table/edit-type/status/index.js

@@ -42,6 +42,7 @@ const StatusEditType = props => {
   return /*#__PURE__*/React.createElement(Layering, {
     isDisabled: false
   }, /*#__PURE__*/React.createElement(Select, _extends({}, getCleanedSelectProps(props), {
+    menuPortalTarget: fg('platform_navx_sllv_j2ws_dropdown_for_single_row') ? document.body : undefined,
     autoFocus: true,
     options: options,
     defaultMenuIsOpen: true,

package/dist/es2019/ui/issue-like-table/edit-type/user/index.js

@@ -63,6 +63,7 @@ const UserEditType = props => {
   return /*#__PURE__*/React.createElement(Layering, {
     isDisabled: false
   }, /*#__PURE__*/React.createElement(Select, _extends({}, getCleanedSelectProps(props), {
+    menuPortalTarget: fg('platform_navx_sllv_j2ws_dropdown_for_single_row') ? document.body : undefined,
     autoFocus: true,
     defaultMenuIsOpen: true,
     blurInputOnSelect: true,

package/dist/esm/ui/issue-like-table/edit-type/icon/index.js

@@ -39,6 +39,7 @@ var IconEditType = function IconEditType(props) {
   return /*#__PURE__*/React.createElement(Layering, {
     isDisabled: false
   }, /*#__PURE__*/React.createElement(Select, _extends({}, getCleanedSelectProps(props), {
+    menuPortalTarget: fg('platform_navx_sllv_j2ws_dropdown_for_single_row') ? document.body : undefined,
     autoFocus: true,
     blurInputOnSelect: true,
     defaultMenuIsOpen: true

package/dist/esm/ui/issue-like-table/edit-type/status/index.js

@@ -39,6 +39,7 @@ var StatusEditType = function StatusEditType(props) {
   return /*#__PURE__*/React.createElement(Layering, {
     isDisabled: false
   }, /*#__PURE__*/React.createElement(Select, _extends({}, getCleanedSelectProps(props), {
+    menuPortalTarget: fg('platform_navx_sllv_j2ws_dropdown_for_single_row') ? document.body : undefined,
     autoFocus: true,
     options: options,
     defaultMenuIsOpen: true,

package/dist/esm/ui/issue-like-table/edit-type/user/index.js

@@ -69,6 +69,7 @@ var UserEditType = function UserEditType(props) {
   return /*#__PURE__*/React.createElement(Layering, {
     isDisabled: false
   }, /*#__PURE__*/React.createElement(Select, _extends({}, getCleanedSelectProps(props), {
+    menuPortalTarget: fg('platform_navx_sllv_j2ws_dropdown_for_single_row') ? document.body : undefined,
     autoFocus: true,
     defaultMenuIsOpen: true,
     blurInputOnSelect: true,

package/dist/types/ui/issue-like-table/types.d.ts

@@ -73,7 +73,7 @@ export interface IssueLikeDataTableViewProps {
     renderItem?: TableViewPropsRenderType;
     /**
      * If this number is set it will restrict (max-height) maximum size of the component AND make main container a scrollable container.
-     * It this number is undefined it will not restrict height and not make container scrollable.
+     * It this number is 0 it will not restrict height and not make container scrollable.
      */
     scrollableContainerHeight?: number;
     status: DatasourceTableStatusType;

package/dist/types-ts4.5/ui/issue-like-table/types.d.ts

@@ -73,7 +73,7 @@ export interface IssueLikeDataTableViewProps {
     renderItem?: TableViewPropsRenderType;
     /**
      * If this number is set it will restrict (max-height) maximum size of the component AND make main container a scrollable container.
-     * It this number is undefined it will not restrict height and not make container scrollable.
+     * It this number is 0 it will not restrict height and not make container scrollable.
      */
     scrollableContainerHeight?: number;
     status: DatasourceTableStatusType;

package/examples-helpers/buildIssueLikeTable.tsx

@@ -23,16 +23,12 @@ import { useCommonTableProps } from './useCommonTableProps';
 type Props = {
 	canControlWrapping?: boolean;
 	canResizeColumns?: boolean;
+	cloudId?: string;
 	forceLoading?: boolean;
 	isReadonly?: boolean;
-	/**
-	 * Use infinity for an infinite delay (promise never resolves or rejects)
-	 * Default is 600ms
-	 */
-	mockExecutionDelay?: number;
 	skipIntl?: boolean;
 	visibleColumnKeys?: string[];
-};
+} & Parameters<typeof mockDatasourceFetchRequests>[0];
 
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-styled -- To migrate as part of go/ui-styling-standard
 const TableViewWrapper = styled.div({
@@ -50,13 +46,14 @@ const ExampleBody = ({
 	forceLoading = false,
 	visibleColumnKeys: overrideVisibleColumnKeys,
 	mockExecutionDelay = 600,
+	cloudId,
 }: Props) => {
 	const parameters = useMemo<JiraIssueDatasourceParameters>(
 		() => ({
-			cloudId: 'some-cloud-id',
+			cloudId: cloudId ?? 'some-cloud-id',
 			jql: 'some-jql',
 		}),
-		[],
+		[cloudId],
 	);
 
 	useEffect(() => {

package/examples-helpers/fakeModalDialogContainer.tsx

@@ -0,0 +1,28 @@
+import React from 'react';
+
+import { cssMap, cx } from '@atlaskit/css';
+import { Box } from '@atlaskit/primitives/compiled';
+import { token } from '@atlaskit/tokens';
+
+const styles = cssMap({
+	tableWrapper: {
+		marginInline: 'auto',
+		marginTop: token('space.200'),
+		width: '90%',
+		borderRadius: token('radius.large'),
+		borderWidth: token('border.width'),
+		borderStyle: 'solid',
+		borderColor: token('color.border'),
+	},
+	hasOverflow: {
+		overflow: 'hidden',
+	},
+});
+
+export const FakeModalDialogContainer = ({ children, hasOverflow = true }: { children: React.ReactNode, hasOverflow?: boolean }): React.JSX.Element => {
+	return (
+		<Box xcss={cx(styles.tableWrapper, hasOverflow && styles.hasOverflow)}>
+			{children}
+		</Box>
+	);
+};

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/link-datasource",
-	"version": "4.32.0",
+	"version": "4.32.1",
 	"description": "UI Components to support linking platform dataset feature",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -186,6 +186,9 @@
 		},
 		"lp_disable_datasource_table_max_height_restriction": {
 			"type": "boolean"
+		},
+		"platform_navx_sllv_j2ws_dropdown_for_single_row": {
+			"type": "boolean"
 		}
 	},
 	"compassUnitTestMetricSourceId": "ari:cloud:compass:a436116f-02ce-4520-8fbb-7301462a1674:metric-source/c5751cc6-3513-4070-9deb-af31e86aed34/9c893299-a527-4457-9b46-f3bc4c828766"