@atlaskit/color-picker 3.2.14 → 3.2.16

package/codemods/utils/helpers.ts

@@ -1,261 +1,256 @@
 import { type NodePath } from 'ast-types/lib/node-path';
 import {
-  type default as core,
-  type ASTPath,
-  type ImportDeclaration,
-  type JSXAttribute,
-  type JSXElement,
-  type Node,
+	type default as core,
+	type ASTPath,
+	type ImportDeclaration,
+	type JSXAttribute,
+	type JSXElement,
+	type Node,
 } from 'jscodeshift';
 import { type Collection } from 'jscodeshift/src/Collection';
 
 export type Nullable<T> = T | null;
 
 export function hasImportDeclaration(
-  j: core.JSCodeshift,
-  source: string,
-  importPath: string,
+	j: core.JSCodeshift,
+	source: string,
+	importPath: string,
 ): boolean {
-  return (
-    j(source)
-      .find(j.ImportDeclaration)
-      .filter(
-        (path: ASTPath<ImportDeclaration>) =>
-          path.node.source.value === importPath,
-      ).length > 0
-  );
+	return (
+		j(source)
+			.find(j.ImportDeclaration)
+			.filter((path: ASTPath<ImportDeclaration>) => path.node.source.value === importPath).length >
+		0
+	);
 }
 
 export function getDefaultSpecifierName({
-  j,
-  base,
-  packageName,
+	j,
+	base,
+	packageName,
 }: {
-  j: core.JSCodeshift;
-  base: Collection<any>;
-  packageName: string;
+	j: core.JSCodeshift;
+	base: Collection<any>;
+	packageName: string;
 }): Nullable<string> {
-  const specifiers = base
-    .find(j.ImportDeclaration)
-    .filter((path) => path.node.source.value === packageName)
-    .find(j.ImportDefaultSpecifier);
+	const specifiers = base
+		.find(j.ImportDeclaration)
+		.filter((path) => path.node.source.value === packageName)
+		.find(j.ImportDefaultSpecifier);
 
-  if (!specifiers.length) {
-    return null;
-  }
-  return specifiers.nodes()[0]!.local!.name;
+	if (!specifiers.length) {
+		return null;
+	}
+	return specifiers.nodes()[0]!.local!.name;
 }
 
 export function getSpecifierName({
-  j,
-  base,
-  packageName,
-  component,
+	j,
+	base,
+	packageName,
+	component,
 }: {
-  j: core.JSCodeshift;
-  base: Collection<any>;
-  packageName: string;
-  component: string;
+	j: core.JSCodeshift;
+	base: Collection<any>;
+	packageName: string;
+	component: string;
 }): Nullable<string> {
-  const specifiers = base
-    .find(j.ImportDeclaration)
-    .filter((path) => path.node.source.value === packageName)
-    .find(j.ImportSpecifier);
+	const specifiers = base
+		.find(j.ImportDeclaration)
+		.filter((path) => path.node.source.value === packageName)
+		.find(j.ImportSpecifier);
 
-  if (!specifiers.length) {
-    return null;
-  }
-  const specifierNode = specifiers
-    .nodes()
-    .find((node) => node.imported.name === component);
-  if (!specifierNode) {
-    return null;
-  }
-  // @ts-ignore
-  return specifierNode.local.name;
+	if (!specifiers.length) {
+		return null;
+	}
+	const specifierNode = specifiers.nodes().find((node) => node.imported.name === component);
+	if (!specifierNode) {
+		return null;
+	}
+	// @ts-ignore
+	return specifierNode.local.name;
 }
 
 export function getJSXAttributesByName({
-  j,
-  element,
-  attributeName,
+	j,
+	element,
+	attributeName,
 }: {
-  j: core.JSCodeshift;
-  element: JSXElement | ASTPath<JSXElement>;
-  attributeName: string;
+	j: core.JSCodeshift;
+	element: JSXElement | ASTPath<JSXElement>;
+	attributeName: string;
 }): Collection<JSXAttribute> {
-  return j(element)
-    .find(j.JSXOpeningElement)
-    .find(j.JSXAttribute)
-    .filter((attribute) => {
-      const matches = j(attribute)
-        .find(j.JSXIdentifier)
-        .filter((identifier) => identifier.value.name === attributeName);
-      return Boolean(matches.length);
-    });
+	return j(element)
+		.find(j.JSXOpeningElement)
+		.find(j.JSXAttribute)
+		.filter((attribute) => {
+			const matches = j(attribute)
+				.find(j.JSXIdentifier)
+				.filter((identifier) => identifier.value.name === attributeName);
+			return Boolean(matches.length);
+		});
 }
 
 export function hasJSXAttributesByName({
-  j,
-  element,
-  attributeName,
+	j,
+	element,
+	attributeName,
 }: {
-  j: core.JSCodeshift;
-  element: JSXElement;
-  attributeName: string;
+	j: core.JSCodeshift;
+	element: JSXElement;
+	attributeName: string;
 }): boolean {
-  return getJSXAttributesByName({ j, element, attributeName }).length > 0;
+	return getJSXAttributesByName({ j, element, attributeName }).length > 0;
 }
 
 export function isUsingSupportedSpread({
-  j,
-  base,
-  element,
+	j,
+	base,
+	element,
 }: {
-  j: core.JSCodeshift;
-  base: Collection<any>;
-  element: NodePath<JSXElement, JSXElement>;
+	j: core.JSCodeshift;
+	base: Collection<any>;
+	element: NodePath<JSXElement, JSXElement>;
 }): boolean {
-  const isUsingSpread: boolean =
-    j(element).find(j.JSXSpreadAttribute).length > 0;
+	const isUsingSpread: boolean = j(element).find(j.JSXSpreadAttribute).length > 0;
 
-  if (!isUsingSpread) {
-    return true;
-  }
+	if (!isUsingSpread) {
+		return true;
+	}
 
-  return (
-    j(element)
-      .find(j.JSXSpreadAttribute)
-      .filter((spread) => {
-        const argument = spread.value.argument;
-        // in place expression is supported
-        if (argument.type === 'ObjectExpression') {
-          return true;
-        }
+	return (
+		j(element)
+			.find(j.JSXSpreadAttribute)
+			.filter((spread) => {
+				const argument = spread.value.argument;
+				// in place expression is supported
+				if (argument.type === 'ObjectExpression') {
+					return true;
+				}
 
-        // Supporting identifiers that point to an a local object expression
-        if (argument.type === 'Identifier') {
-          return (
-            base.find(j.VariableDeclarator).filter((declarator): boolean => {
-              return (
-                declarator.value.id.type === 'Identifier' &&
-                // @ts-ignore
-                declarator.value.init.type === 'ObjectExpression'
-              );
-            }).length > 0
-          );
-        }
+				// Supporting identifiers that point to an a local object expression
+				if (argument.type === 'Identifier') {
+					return (
+						base.find(j.VariableDeclarator).filter((declarator): boolean => {
+							return (
+								declarator.value.id.type === 'Identifier' &&
+								// @ts-ignore
+								declarator.value.init.type === 'ObjectExpression'
+							);
+						}).length > 0
+					);
+				}
 
-        // We don't support anything else
-        return false;
-      }).length > 0
-  );
+				// We don't support anything else
+				return false;
+			}).length > 0
+	);
 }
 
 export function isUsingThroughSpread({
-  j,
-  base,
-  element,
-  propName,
+	j,
+	base,
+	element,
+	propName,
 }: {
-  j: core.JSCodeshift;
-  base: Collection<any>;
-  element: NodePath<JSXElement, JSXElement>;
-  propName: string;
+	j: core.JSCodeshift;
+	base: Collection<any>;
+	element: NodePath<JSXElement, JSXElement>;
+	propName: string;
 }): boolean {
-  if (!isUsingSupportedSpread({ j, base, element })) {
-    return false;
-  }
+	if (!isUsingSupportedSpread({ j, base, element })) {
+		return false;
+	}
 
-  const isUsedThroughExpression: boolean =
-    j(element)
-      .find(j.JSXSpreadAttribute)
-      .find(j.ObjectExpression)
-      .filter((item) => {
-        const match: boolean =
-          item.value.properties.filter(
-            (property) =>
-              property.type === 'ObjectProperty' &&
-              property.key.type === 'Identifier' &&
-              property.key.name === propName,
-          ).length > 0;
+	const isUsedThroughExpression: boolean =
+		j(element)
+			.find(j.JSXSpreadAttribute)
+			.find(j.ObjectExpression)
+			.filter((item) => {
+				const match: boolean =
+					item.value.properties.filter(
+						(property) =>
+							property.type === 'ObjectProperty' &&
+							property.key.type === 'Identifier' &&
+							property.key.name === propName,
+					).length > 0;
 
-        return match;
-      }).length > 0;
+				return match;
+			}).length > 0;
 
-  if (isUsedThroughExpression) {
-    return true;
-  }
+	if (isUsedThroughExpression) {
+		return true;
+	}
 
-  const isUsedThroughIdentifier: boolean =
-    j(element)
-      .find(j.JSXSpreadAttribute)
-      .find(j.Identifier)
-      .filter((identifier): boolean => {
-        return (
-          base
-            .find(j.VariableDeclarator)
-            .filter(
-              (declarator) =>
-                declarator.value.id.type === 'Identifier' &&
-                declarator.value.id.name === identifier.value.name,
-            )
-            .filter((declarator) => {
-              const value = declarator.value;
-              if (value.id.type !== 'Identifier') {
-                return false;
-              }
+	const isUsedThroughIdentifier: boolean =
+		j(element)
+			.find(j.JSXSpreadAttribute)
+			.find(j.Identifier)
+			.filter((identifier): boolean => {
+				return (
+					base
+						.find(j.VariableDeclarator)
+						.filter(
+							(declarator) =>
+								declarator.value.id.type === 'Identifier' &&
+								declarator.value.id.name === identifier.value.name,
+						)
+						.filter((declarator) => {
+							const value = declarator.value;
+							if (value.id.type !== 'Identifier') {
+								return false;
+							}
 
-              if (value.id.name !== identifier.value.name) {
-                return false;
-              }
-              // @ts-ignore
-              if (value.init.type !== 'ObjectExpression') {
-                return false;
-              }
+							if (value.id.name !== identifier.value.name) {
+								return false;
+							}
+							// @ts-ignore
+							if (value.init.type !== 'ObjectExpression') {
+								return false;
+							}
 
-              const match: boolean =
-                // @ts-ignore
-                value.init.properties.filter(
-                  // @ts-ignore
-                  (property) =>
-                    property.type === 'ObjectProperty' &&
-                    property.key.type === 'Identifier' &&
-                    property.key.name === propName,
-                ).length > 0;
+							const match: boolean =
+								// @ts-ignore
+								value.init.properties.filter(
+									// @ts-ignore
+									(property) =>
+										property.type === 'ObjectProperty' &&
+										property.key.type === 'Identifier' &&
+										property.key.name === propName,
+								).length > 0;
 
-              return match;
-            }).length > 0
-        );
-      }).length > 0;
+							return match;
+						}).length > 0
+				);
+			}).length > 0;
 
-  return isUsedThroughIdentifier;
+	return isUsedThroughIdentifier;
 }
 
 export function isUsingProp({
-  j,
-  base,
-  element,
-  propName,
+	j,
+	base,
+	element,
+	propName,
 }: {
-  j: core.JSCodeshift;
-  base: Collection<any>;
-  element: NodePath<JSXElement, JSXElement>;
-  propName: string;
+	j: core.JSCodeshift;
+	base: Collection<any>;
+	element: NodePath<JSXElement, JSXElement>;
+	propName: string;
 }): boolean {
-  return (
-    hasJSXAttributesByName({
-      j,
-      element: element.value,
-      attributeName: propName,
-    }) ||
-    isUsingThroughSpread({
-      j,
-      base,
-      element,
-      propName,
-    })
-  );
+	return (
+		hasJSXAttributesByName({
+			j,
+			element: element.value,
+			attributeName: propName,
+		}) ||
+		isUsingThroughSpread({
+			j,
+			base,
+			element,
+			propName,
+		})
+	);
 }
 
 // not replacing newlines (which \s does)
@@ -263,82 +258,76 @@ const spacesAndTabs: RegExp = /[ \t]{2,}/g;
 const lineStartWithSpaces: RegExp = /^[ \t]*/gm;
 
 function clean(value: string): string {
-  return (
-    value
-      .replace(spacesAndTabs, ' ')
-      .replace(lineStartWithSpaces, '')
-      // using .trim() to clear the any newlines before the first text and after last text
-      .trim()
-  );
+	return (
+		value
+			.replace(spacesAndTabs, ' ')
+			.replace(lineStartWithSpaces, '')
+			// using .trim() to clear the any newlines before the first text and after last text
+			.trim()
+	);
 }
 
 export function addCommentToStartOfFile({
-  j,
-  base,
-  message,
+	j,
+	base,
+	message,
 }: {
-  j: core.JSCodeshift;
-  base: Collection<Node>;
-  message: string;
+	j: core.JSCodeshift;
+	base: Collection<Node>;
+	message: string;
 }) {
-  addCommentBefore({
-    j,
-    // @ts-ignore
-    target: base.find(j.Program),
-    message,
-  });
+	addCommentBefore({
+		j,
+		// @ts-ignore
+		target: base.find(j.Program),
+		message,
+	});
 }
 
 export function addCommentBefore({
-  j,
-  target,
-  message,
+	j,
+	target,
+	message,
 }: {
-  j: core.JSCodeshift;
-  target: Collection<Node>;
-  message: string;
+	j: core.JSCodeshift;
+	target: Collection<Node>;
+	message: string;
 }) {
-  const content: string = ` TODO: (from codemod) ${clean(message)} `;
-  target.forEach((path) => {
-    path.value.comments = path.value.comments || [];
+	const content: string = ` TODO: (from codemod) ${clean(message)} `;
+	target.forEach((path) => {
+		path.value.comments = path.value.comments || [];
 
-    const exists = path.value.comments.find(
-      (comment) => comment.value === content,
-    );
+		const exists = path.value.comments.find((comment) => comment.value === content);
 
-    // avoiding duplicates of the same comment
-    if (exists) {
-      return;
-    }
+		// avoiding duplicates of the same comment
+		if (exists) {
+			return;
+		}
 
-    path.value.comments.push(j.commentBlock(content));
-  });
+		path.value.comments.push(j.commentBlock(content));
+	});
 }
 
 export function updateRenderProps(
-  j: core.JSCodeshift,
-  source: Collection<any>,
-  specifier: string,
-  oldProperty: string,
-  newProperty: string,
+	j: core.JSCodeshift,
+	source: Collection<any>,
+	specifier: string,
+	oldProperty: string,
+	newProperty: string,
 ) {
-  source.findJSXElements(specifier).forEach((element: ASTPath<JSXElement>) => {
-    j(element)
-      .find(j.ArrowFunctionExpression)
-      .find(j.ObjectPattern)
-      .find(j.ObjectProperty)
-      .filter(
-        // @ts-ignore
-        (path: ASTPath<ObjectProperty>) => path.value.key.name === oldProperty,
-      )
-      .forEach((path) => {
-        j(path).replaceWith(
-          j.property(
-            'init',
-            j.identifier(newProperty),
-            j.identifier(oldProperty),
-          ),
-        );
-      });
-  });
+	source.findJSXElements(specifier).forEach((element: ASTPath<JSXElement>) => {
+		j(element)
+			.find(j.ArrowFunctionExpression)
+			.find(j.ObjectPattern)
+			.find(j.ObjectProperty)
+			.filter(
+				// @ts-ignore
+				(path: ASTPath<ObjectProperty>) => path.value.key.name === oldProperty,
+			)
+			.forEach((path) => {
+				j(path).replaceWith(
+					j.property('init', j.identifier(newProperty), j.identifier(oldProperty)),
+				);
+			});
+	});
 }

package/dist/cjs/components/ColorCard.js

@@ -12,8 +12,10 @@ var _done = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/done"));
 var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
 var _constants = require("../constants");
 var _react2 = require("@emotion/react");
+var _reactIntlNext = require("react-intl-next");
 var _colors = require("@atlaskit/theme/colors");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
+var _messages = _interopRequireDefault(require("../messages"));
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 /** @jsx jsx */
@@ -29,6 +31,8 @@ var ColorCard = function ColorCard(props) {
     onClick = props.onClick,
     onKeyDown = props.onKeyDown;
   var ref = (0, _react.useRef)(null);
+  var _useIntl = (0, _reactIntlNext.useIntl)(),
+    formatMessage = _useIntl.formatMessage;
   var handleMouseDown = (0, _react.useCallback)(function (event) {
     event.preventDefault();
   }, []);
@@ -49,19 +53,17 @@ var ColorCard = function ColorCard(props) {
     }
   }, [isTabbing, onKeyDown, value]);
   (0, _react.useEffect)(function () {
-    if ((0, _platformFeatureFlags.getBooleanFF)('platform.color-picker-radio-button-functionality_6hkcy')) {
-      var refCurrent = ref.current;
-      var _handleKeyDown = function _handleKeyDown(e) {
-        if (e.key === 'Tab') {
-          e.stopPropagation();
-          e.preventDefault();
-        }
-      };
-      refCurrent === null || refCurrent === void 0 || refCurrent.addEventListener('keydown', _handleKeyDown);
-      return function () {
-        refCurrent === null || refCurrent === void 0 || refCurrent.removeEventListener('keydown', _handleKeyDown);
-      };
-    }
+    var refCurrent = ref.current;
+    var handleKeyDown = function handleKeyDown(e) {
+      if (e.key === 'Tab') {
+        e.stopPropagation();
+        e.preventDefault();
+      }
+    };
+    refCurrent === null || refCurrent === void 0 || refCurrent.addEventListener('keydown', handleKeyDown);
+    return function () {
+      refCurrent === null || refCurrent === void 0 || refCurrent.removeEventListener('keydown', handleKeyDown);
+    };
   }, []);
   return (0, _react2.jsx)(_tooltip.default, {
     content: label
@@ -72,11 +74,10 @@ var ColorCard = function ColorCard(props) {
     onKeyDown: handleKeyDown,
     role: "radio",
     "aria-checked": selected
-  }, !(0, _platformFeatureFlags.getBooleanFF)('platform.jca11y-1559-dashboard-view-dashboard-remove-duplicate-aria-label_g5i3i') && {
-    'aria-label': label
+  }, (0, _platformFeatureFlags.getBooleanFF)('platform.jca11y-2997-remove-duplicate-screen-reader-announcements_fz13s') && {
+    'aria-label': formatMessage(_messages.default.colorCardRadioItemLabel)
   }, {
-    tabIndex: 0
-  }, (0, _platformFeatureFlags.getBooleanFF)('platform.color-picker-radio-button-functionality_6hkcy') && {
+    tabIndex: 0,
     ref: ref
   }), (0, _react2.jsx)("div", {
     css: colorCardWrapperStyles
@@ -94,6 +95,7 @@ var ColorCard = function ColorCard(props) {
 };
 var _default = exports.default = ColorCard;
 var colorCardOptionTabbingStyles = (0, _react2.css)({
+  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-selectors -- Ignored via go/DSP-18766
   ':hover, :focus': {
     borderColor: "var(--ds-border-focused, ".concat(_colors.B75, ")")
   }