@atlaskit/dropdown-menu 11.10.4 → 11.10.6

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/dropdown-menu
 
+## 11.10.6
+
+### Patch Changes
+
+- [`2e2ebbe71fc`](https://bitbucket.org/atlassian/atlassian-frontend/commits/2e2ebbe71fc) - Fix keyboard arrow controls for dropdown item custom component.
+
+## 11.10.5
+
+### Patch Changes
+
+- [`4ae083a7e66`](https://bitbucket.org/atlassian/atlassian-frontend/commits/4ae083a7e66) - Use `@af/accessibility-testing` for default jest-axe config and jest-axe import in accessibility testing.
+
 ## 11.10.4
 
 ### Patch Changes

package/dist/cjs/dropdown-menu-item.js

@@ -42,6 +42,7 @@ var DropdownMenuItem = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref)
       component: component,
       iconBefore: elemBefore,
       iconAfter: elemAfter,
+      ref: (0, _mergeRefs.default)([ref, itemRef]),
       shouldTitleWrap: shouldTitleWrap,
       shouldDescriptionWrap: shouldDescriptionWrap
     }, rest), children);

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/dropdown-menu",
-	"version": "11.10.4",
+	"version": "11.10.6",
 	"sideEffects": false
 }

package/dist/es2019/dropdown-menu-item.js

@@ -30,6 +30,7 @@ const DropdownMenuItem = /*#__PURE__*/forwardRef((props, ref) => {
       component: component,
       iconBefore: elemBefore,
       iconAfter: elemAfter,
+      ref: mergeRefs([ref, itemRef]),
       shouldTitleWrap: shouldTitleWrap,
       shouldDescriptionWrap: shouldDescriptionWrap
     }, rest), children);

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/dropdown-menu",
-	"version": "11.10.4",
+	"version": "11.10.6",
 	"sideEffects": false
 }

package/dist/esm/dropdown-menu-item.js

@@ -32,6 +32,7 @@ var DropdownMenuItem = /*#__PURE__*/forwardRef(function (props, ref) {
       component: component,
       iconBefore: elemBefore,
       iconAfter: elemAfter,
+      ref: mergeRefs([ref, itemRef]),
       shouldTitleWrap: shouldTitleWrap,
       shouldDescriptionWrap: shouldDescriptionWrap
     }, rest), children);

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/dropdown-menu",
-	"version": "11.10.4",
+	"version": "11.10.6",
 	"sideEffects": false
 }

package/dist/types/types.d.ts

@@ -134,6 +134,7 @@ export interface DropdownItemProps {
     children: React.ReactNode;
     /**
      * Custom component to render as an item.
+     * Should be wrapped in `forwardRef` to avoid accessibility issues when controlling keyboard focus.
      */
     component?: CustomItemProps['component'];
     /**

package/dist/types-ts4.5/types.d.ts

@@ -134,6 +134,7 @@ export interface DropdownItemProps {
     children: React.ReactNode;
     /**
      * Custom component to render as an item.
+     * Should be wrapped in `forwardRef` to avoid accessibility issues when controlling keyboard focus.
      */
     component?: CustomItemProps['component'];
     /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/dropdown-menu",
-  "version": "11.10.4",
+  "version": "11.10.6",
   "description": "A dropdown menu displays a list of actions or options to a user.",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -41,7 +41,7 @@
     "@atlaskit/primitives": "^1.0.0",
     "@atlaskit/spinner": "^15.5.0",
     "@atlaskit/theme": "^12.5.0",
-    "@atlaskit/tokens": "^1.11.0",
+    "@atlaskit/tokens": "^1.12.0",
     "@atlaskit/visually-hidden": "^1.2.0",
     "@babel/runtime": "^7.0.0",
     "@emotion/react": "^11.7.1",
@@ -52,6 +52,7 @@
     "react-dom": "^16.8.0"
   },
   "devDependencies": {
+    "@af/accessibility-testing": "*",
     "@atlaskit/visual-regression": "*",
     "@atlaskit/webdriver-runner": "*",
     "@atlassian/atlassian-frontend-prettier-config-1.0.1": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.1",
@@ -59,7 +60,6 @@
     "@testing-library/dom": "^8.17.1",
     "@testing-library/react": "^12.1.5",
     "@testing-library/react-hooks": "^8.0.1",
-    "jest-axe": "^4.0.0",
     "jscodeshift": "^0.13.0",
     "raf-stub": "^2.0.1",
     "react-dom": "^16.8.0",
@@ -109,4 +109,4 @@
   },
   "homepage": "https://atlassian.design/components/dropdown-menu/",
   "prettier": "@atlassian/atlassian-frontend-prettier-config-1.0.1"
-}
+}

package/tmp/api-report-tmp.d.ts

@@ -1,146 +0,0 @@
-## API Report File for "@atlaskit/dropdown-menu"
-
-> Do not edit this file. It is a report generated by [API Extractor](https://api-extractor.com/).
-
-```ts
-
-/// <reference types="react" />
-
-import type { CustomItemProps } from '@atlaskit/menu/types';
-import { default as DropdownItemGroup } from '@atlaskit/menu/section';
-import { KeyboardEvent as KeyboardEvent_2 } from 'react';
-import type { MenuGroupProps } from '@atlaskit/menu/types';
-import { MouseEvent as MouseEvent_2 } from 'react';
-import { default as React_2 } from 'react';
-import { ReactElement } from 'react';
-import { ReactNode } from 'react';
-import { Ref } from 'react';
-import type { SectionProps } from '@atlaskit/menu';
-import type { SectionProps as SectionProps_2 } from '@atlaskit/menu/types';
-import type { TriggerProps } from '@atlaskit/popup/types';
-
-// @public (undocumented)
-export interface CustomTriggerProps<TriggerElement extends HTMLElement = HTMLElement> extends Omit<TriggerProps, 'ref'> {
-    isSelected?: boolean;
-    onClick?: (e: KeyboardEvent_2 | MouseEvent_2) => void;
-    testId?: string;
-    triggerRef: Ref<TriggerElement>;
-}
-
-// @public
-export const DropdownItem: React_2.ForwardRefExoticComponent<DropdownItemProps & React_2.RefAttributes<HTMLElement>>;
-
-// @public
-export const DropdownItemCheckbox: (props: DropdownItemCheckboxProps) => JSX.Element;
-
-// @public
-export const DropdownItemCheckboxGroup: (props: DropdownItemCheckboxGroupProps) => JSX.Element;
-
-// @public (undocumented)
-interface DropdownItemCheckboxGroupProps extends SectionProps {
-    id: string;
-}
-
-// @public (undocumented)
-interface DropdownItemCheckboxProps {
-    children: React.ReactNode;
-    defaultSelected?: boolean;
-    description?: JSX.Element | string;
-    id: string;
-    isDisabled?: boolean;
-    isSelected?: boolean;
-    onClick?: (e: KeyboardEvent_2 | MouseEvent_2) => void;
-    shouldDescriptionWrap?: boolean;
-    shouldTitleWrap?: boolean;
-    testId?: string;
-    title?: string;
-}
-
-export { DropdownItemGroup }
-
-// @public (undocumented)
-export interface DropdownItemProps {
-    children: React.ReactNode;
-    component?: CustomItemProps['component'];
-    description?: JSX.Element | string;
-    elemAfter?: React.ReactNode;
-    elemBefore?: React.ReactNode;
-    href?: string;
-    isDisabled?: boolean;
-    isSelected?: boolean;
-    onClick?: (e: KeyboardEvent_2 | MouseEvent_2) => void;
-    rel?: string;
-    shouldDescriptionWrap?: boolean;
-    shouldTitleWrap?: boolean;
-    target?: string;
-    testId?: string;
-    title?: string;
-}
-
-// @public
-export const DropdownItemRadio: (props: DropdownItemRadioProps) => JSX.Element;
-
-// @public
-export const DropdownItemRadioGroup: (props: DropdownItemRadioGroupProps) => JSX.Element;
-
-// @public (undocumented)
-interface DropdownItemRadioGroupProps extends SectionProps {
-    // (undocumented)
-    id: string;
-}
-
-// @public (undocumented)
-interface DropdownItemRadioProps {
-    children: React.ReactNode;
-    defaultSelected?: boolean;
-    description?: JSX.Element | string;
-    id: string;
-    isDisabled?: boolean;
-    isSelected?: boolean;
-    onClick?: (e: KeyboardEvent_2 | MouseEvent_2) => void;
-    shouldDescriptionWrap?: boolean;
-    shouldTitleWrap?: boolean;
-    testId?: string;
-    title?: string;
-}
-
-// @public
-const DropdownMenu: <T extends HTMLElement = HTMLElement>(props: DropdownMenuProps<T>) => JSX.Element;
-export default DropdownMenu;
-
-// @public (undocumented)
-export interface DropdownMenuGroupProps extends SectionProps_2 {
-}
-
-// @public (undocumented)
-export interface DropdownMenuProps<TriggerElement extends HTMLElement = HTMLElement> {
-    appearance?: 'default' | 'tall';
-    autoFocus?: boolean;
-    children?: ReactNode;
-    defaultOpen?: boolean;
-    isLoading?: boolean;
-    isOpen?: boolean;
-    onOpenChange?: (args: OnOpenChangeArgs) => void;
-    placement?: Placement;
-    shouldFlip?: boolean;
-    spacing?: Extract<MenuGroupProps['spacing'], 'compact' | 'cozy'>;
-    statusLabel?: string;
-    testId?: string;
-    trigger?: ((triggerButtonProps: CustomTriggerProps<TriggerElement>) => ReactElement) | string;
-    zIndex?: number;
-}
-
-// @public (undocumented)
-export interface OnOpenChangeArgs {
-    // (undocumented)
-    event: KeyboardEvent_2 | MouseEvent_2;
-    // (undocumented)
-    isOpen: boolean;
-}
-
-// @public (undocumented)
-type Placement = 'auto' | 'auto-end' | 'auto-start' | 'bottom' | 'bottom-end' | 'bottom-start' | 'left' | 'left-end' | 'left-start' | 'right' | 'right-end' | 'right-start' | 'top' | 'top-end' | 'top-start';
-
-// (No @packageDocumentation comment for this package)
-
-```