From 7e299c0dbafcd8b4161a70217d8b6848017663ff Mon Sep 17 00:00:00 2001 From: TJ Egan Date: Thu, 30 Jan 2020 15:45:56 -0800 Subject: [PATCH 01/13] fix(data-table): remove hover styles from thead checkbox (#5209) --- .../components/src/components/data-table/_data-table-core.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/components/src/components/data-table/_data-table-core.scss b/packages/components/src/components/data-table/_data-table-core.scss index 9ea488eeb3a1..b85d5fb1cba7 100644 --- a/packages/components/src/components/data-table/_data-table-core.scss +++ b/packages/components/src/components/data-table/_data-table-core.scss @@ -266,7 +266,7 @@ padding-bottom: 0; } - th.#{$prefix}--table-column-checkbox:hover { + .#{$prefix}--date-table tbody th.#{$prefix}--table-column-checkbox:hover { background: $data-table-column-hover; } From 0b5ca7a70dfbfa86ff6f53f01c5e4988c2d5e840 Mon Sep 17 00:00:00 2001 From: carbon-bot Date: Thu, 30 Jan 2020 23:56:32 +0000 Subject: [PATCH 02/13] chore(project): sync generated files --- packages/components/docs/sass.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/components/docs/sass.md b/packages/components/docs/sass.md index 278c2efa1295..07c632e1170b 100644 --- a/packages/components/docs/sass.md +++ b/packages/components/docs/sass.md @@ -15060,7 +15060,7 @@ Data table core styles padding-bottom: 0; } - th.#{$prefix}--table-column-checkbox:hover { + .#{$prefix}--date-table tbody th.#{$prefix}--table-column-checkbox:hover { background: $data-table-column-hover; } From 51a3c0a318807a004a1c9b48d9db99ad8a526c25 Mon Sep 17 00:00:00 2001 From: TJ Egan Date: Thu, 30 Jan 2020 16:13:22 -0800 Subject: [PATCH 03/13] fix(search): update search icon to correct token (#5222) --- packages/components/src/components/search/_search.scss | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/packages/components/src/components/search/_search.scss b/packages/components/src/components/search/_search.scss index 1fe5a6bdfc05..2a95ec8d5431 100644 --- a/packages/components/src/components/search/_search.scss +++ b/packages/components/src/components/search/_search.scss @@ -104,8 +104,7 @@ width: rem(16px); top: 50%; transform: translateY(-50%); - // Ensure clear icon is rendered in Firefox (#1127) - fill: $text-02; + fill: $icon-02; pointer-events: none; } From c5fddd108bade91e59c1c98a7bbf2e2bba47f57e Mon Sep 17 00:00:00 2001 From: carbon-bot Date: Fri, 31 Jan 2020 00:27:53 +0000 Subject: [PATCH 04/13] chore(project): sync generated files --- packages/components/docs/sass.md | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/packages/components/docs/sass.md b/packages/components/docs/sass.md index 07c632e1170b..16aeb87407cd 100644 --- a/packages/components/docs/sass.md +++ b/packages/components/docs/sass.md @@ -6395,7 +6395,6 @@ $text-02: if( - [modal [mixin]](#modal-mixin) - [overflow-menu [mixin]](#overflow-menu-mixin) - [pagination [mixin]](#pagination-mixin) - - [search [mixin]](#search-mixin) - [tabs [mixin]](#tabs-mixin) - [toggle [mixin]](#toggle-mixin) - [toolbar [mixin]](#toolbar-mixin) @@ -6568,6 +6567,7 @@ $icon-02: if( - [file-uploader [mixin]](#file-uploader-mixin) - [listbox [mixin]](#listbox-mixin) - [overflow-menu [mixin]](#overflow-menu-mixin) + - [search [mixin]](#search-mixin) - [text-input [mixin]](#text-input-mixin) - [tile [mixin]](#tile-mixin) - [tooltip--icon--legacy [mixin]](#tooltip--icon--legacy-mixin) @@ -20934,8 +20934,7 @@ Search styles width: rem(16px); top: 50%; transform: translateY(-50%); - // Ensure clear icon is rendered in Firefox (#1127) - fill: $text-02; + fill: $icon-02; pointer-events: none; } @@ -21083,7 +21082,7 @@ Search styles - [ui-04 [variable]](#ui-04-variable) - [text-05 [variable]](#text-05-variable) - [field-02 [variable]](#field-02-variable) - - [text-02 [variable]](#text-02-variable) + - [icon-02 [variable]](#icon-02-variable) - [carbon--spacing-01 [variable]](#carbon--spacing-01-variable) - [icon-01 [variable]](#icon-01-variable) - [hover-field [variable]](#hover-field-variable) From d6a36a9d9fd73373c0e618f778521f8c16fb41a0 Mon Sep 17 00:00:00 2001 From: Akira Sudoh Date: Fri, 31 Jan 2020 10:27:21 +0900 Subject: [PATCH 05/13] fix(Tab): hoist tab role to upper element (#5173) This change hoists `tab` role and its associated ARIA attributes from `` to `
  • `, given putting `tab` role to `` makes VoiceOver think it's a single tab in a container. No new DAP error is observed by this change. Fixes #5083. --- packages/react/src/components/Tab/Tab-test.js | 8 ++------ packages/react/src/components/Tab/Tab.js | 10 ++++------ 2 files changed, 6 insertions(+), 12 deletions(-) diff --git a/packages/react/src/components/Tab/Tab-test.js b/packages/react/src/components/Tab/Tab-test.js index b7d526f8b9c1..11db72768bb9 100644 --- a/packages/react/src/components/Tab/Tab-test.js +++ b/packages/react/src/components/Tab/Tab-test.js @@ -27,12 +27,8 @@ describe('Tab', () => { ); }); - it('renders
  • with [role="presentation"]', () => { - expect(wrapper.props().role).toEqual('presentation'); - }); - - it('renders with [role="tab"]', () => { - expect(wrapper.find('a').props().role).toEqual('tab'); + it('renders
  • with [role="tab"]', () => { + expect(wrapper.props().role).toEqual('tab'); }); it('renders with tabindex set to 0', () => { diff --git a/packages/react/src/components/Tab/Tab.js b/packages/react/src/components/Tab/Tab.js index ead5751e62c3..43ef38b5c72c 100644 --- a/packages/react/src/components/Tab/Tab.js +++ b/packages/react/src/components/Tab/Tab.js @@ -135,11 +135,7 @@ export default class Tab extends React.Component { id, className: `${prefix}--tabs__nav-link`, href, - role: 'tab', tabIndex: !disabled ? tabIndex : -1, - ['aria-selected']: selected, - ['aria-disabled']: disabled, - ['aria-controls']: id && `${id}__panel`, ref: e => { this.tabAnchor = e; }, @@ -164,8 +160,10 @@ export default class Tab extends React.Component { handleTabKeyDown(index, evt); onKeyDown(evt); }} - role="presentation" - selected={selected}> + role="tab" + aria-selected={selected} + aria-disabled={disabled} + aria-controls={`${id}__panel`}> {renderAnchor ? ( renderAnchor(anchorProps) ) : ( From 7059be47e86cfce94424e8bc2bf0759758d71945 Mon Sep 17 00:00:00 2001 From: TJ Egan Date: Fri, 31 Jan 2020 08:47:56 -0800 Subject: [PATCH 06/13] fix(inline-dropdown): vanilla style fixes (#5223) --- packages/components/src/components/dropdown/_dropdown.scss | 7 ------- 1 file changed, 7 deletions(-) diff --git a/packages/components/src/components/dropdown/_dropdown.scss b/packages/components/src/components/dropdown/_dropdown.scss index f71bacef30ef..8ba340fbe38c 100644 --- a/packages/components/src/components/dropdown/_dropdown.scss +++ b/packages/components/src/components/dropdown/_dropdown.scss @@ -399,13 +399,6 @@ .#{$prefix}--dropdown--inline .#{$prefix}--dropdown-link { font-weight: normal; - margin-right: $carbon--spacing-04; - margin-left: rem(10px); - - &:focus { - margin: 0; - padding-left: rem(10px); - } } .#{$prefix}--dropdown--show-selected .#{$prefix}--dropdown--selected { From 90900d25cfa858b11cdf8f8417c4b5c6ef708826 Mon Sep 17 00:00:00 2001 From: carbon-bot Date: Fri, 31 Jan 2020 17:00:26 +0000 Subject: [PATCH 07/13] chore(project): sync generated files --- packages/components/docs/sass.md | 7 ------- 1 file changed, 7 deletions(-) diff --git a/packages/components/docs/sass.md b/packages/components/docs/sass.md index 16aeb87407cd..5c2a4a504dc7 100644 --- a/packages/components/docs/sass.md +++ b/packages/components/docs/sass.md @@ -16797,13 +16797,6 @@ Dropdown styles .#{$prefix}--dropdown--inline .#{$prefix}--dropdown-link { font-weight: normal; - margin-right: $carbon--spacing-04; - margin-left: rem(10px); - - &:focus { - margin: 0; - padding-left: rem(10px); - } } .#{$prefix}--dropdown--show-selected .#{$prefix}--dropdown--selected { From 0000bb2143e1c7752f036563d6550aea4578d72d Mon Sep 17 00:00:00 2001 From: Josh Black Date: Fri, 31 Jan 2020 12:23:22 -0600 Subject: [PATCH 08/13] refactor(react): update wildcard exports (#5220) Co-authored-by: TJ Egan --- packages/react/src/components/FileUploader/index.js | 2 +- packages/react/src/components/ListBox/index.js | 3 ++- packages/react/src/components/Pagination/index.js | 2 +- 3 files changed, 4 insertions(+), 3 deletions(-) diff --git a/packages/react/src/components/FileUploader/index.js b/packages/react/src/components/FileUploader/index.js index 74611ad9bd09..3099453e1fce 100644 --- a/packages/react/src/components/FileUploader/index.js +++ b/packages/react/src/components/FileUploader/index.js @@ -6,7 +6,7 @@ */ export * from './FileUploader.Skeleton'; +export * from './FileUploader'; export FileUploaderItem from './FileUploaderItem'; export FileUploaderDropContainer from './FileUploaderDropContainer'; -export * from './FileUploader'; export default from './FileUploader'; diff --git a/packages/react/src/components/ListBox/index.js b/packages/react/src/components/ListBox/index.js index 68480788e743..1bf90ffcfcac 100644 --- a/packages/react/src/components/ListBox/index.js +++ b/packages/react/src/components/ListBox/index.js @@ -5,6 +5,8 @@ * LICENSE file in the root directory of this source tree. */ +export * as PropTypes from './ListBoxPropTypes'; + import ListBox from './ListBox'; import ListBoxField from './ListBoxField'; import ListBoxMenu from './ListBoxMenu'; @@ -19,4 +21,3 @@ ListBox.MenuItem = ListBoxMenuItem; ListBox.Selection = ListBoxSelection; export default ListBox; -export * as PropTypes from './ListBoxPropTypes'; diff --git a/packages/react/src/components/Pagination/index.js b/packages/react/src/components/Pagination/index.js index d745d5860682..8dce1279733c 100644 --- a/packages/react/src/components/Pagination/index.js +++ b/packages/react/src/components/Pagination/index.js @@ -5,5 +5,5 @@ * LICENSE file in the root directory of this source tree. */ -export default from './Pagination'; export * from './Pagination.Skeleton'; +export default from './Pagination'; From eb9412f9d32f656924fa852f2646d6b4b3dd3c84 Mon Sep 17 00:00:00 2001 From: TJ Egan Date: Fri, 31 Jan 2020 15:05:34 -0800 Subject: [PATCH 09/13] fix(ui-shell): remove role='menu' from ui-shell (#5235) --- .../src/components/ui-shell/_header.scss | 4 +-- .../src/components/ui-shell/_side-nav.scss | 21 ++++++-------- .../src/components/ui-shell/header-nav.hbs | 12 ++++---- .../components/ui-shell/navigation-menu.hbs | 18 +++++++----- .../components/ui-shell/side-nav-fixed.hbs | 20 ++++++------- .../src/components/ui-shell/side-nav.hbs | 28 +++++++++++-------- .../src/components/UIShell/HeaderMenu.js | 15 ++-------- .../src/components/UIShell/SideNavMenu.js | 4 +-- .../react/src/components/UIShell/Switcher.js | 2 +- .../src/components/UIShell/UIShell-story.js | 2 +- .../__snapshots__/HeaderMenu-test.js.snap | 16 ++--------- .../__snapshots__/SideNavMenu-test.js.snap | 1 - 12 files changed, 64 insertions(+), 79 deletions(-) diff --git a/packages/components/src/components/ui-shell/_header.scss b/packages/components/src/components/ui-shell/_header.scss index 78f2b0fc8d4f..d4fb4dc67037 100644 --- a/packages/components/src/components/ui-shell/_header.scss +++ b/packages/components/src/components/ui-shell/_header.scss @@ -167,7 +167,7 @@ } } - .#{$prefix}--header__menu-bar[role='menubar'] { + .#{$prefix}--header__menu-bar { display: flex; height: 100%; list-style: none; @@ -240,7 +240,7 @@ transform: rotate(180deg); } - .#{$prefix}--header__menu[role='menu'] { + .#{$prefix}--header__menu { display: none; list-style: none; padding: 0; diff --git a/packages/components/src/components/ui-shell/_side-nav.scss b/packages/components/src/components/ui-shell/_side-nav.scss index 3aee0dac9da9..c3879da74ca4 100644 --- a/packages/components/src/components/ui-shell/_side-nav.scss +++ b/packages/components/src/components/ui-shell/_side-nav.scss @@ -328,8 +328,8 @@ > .#{$prefix}--side-nav__submenu:hover, .#{$prefix}--side-nav__item:not(.#{$prefix}--side-nav__item--active) > .#{$prefix}--side-nav__link:hover, - .#{$prefix}--side-nav__menu[role='menu'] - a.#{$prefix}--side-nav__link[role='menuitem']:not(.#{$prefix}--side-nav__link--current):not([aria-current='page']):hover, + .#{$prefix}--side-nav__menu + a.#{$prefix}--side-nav__link:not(.#{$prefix}--side-nav__link--current):not([aria-current='page']):hover, .#{$prefix}--side-nav a.#{$prefix}--header__menu-item:hover, .#{$prefix}--side-nav .#{$prefix}--header__menu-title[aria-expanded='true']:hover { @@ -433,20 +433,19 @@ color: $ibm-color__gray-100; } - .#{$prefix}--side-nav__menu[role='menu'] { + .#{$prefix}--side-nav__menu { display: block; visibility: hidden; max-height: 0; } .#{$prefix}--side-nav__submenu[aria-expanded='true'] - + .#{$prefix}--side-nav__menu[role='menu'] { + + .#{$prefix}--side-nav__menu { max-height: rem(1500px); visibility: inherit; } - .#{$prefix}--side-nav__menu[role='menu'] - a.#{$prefix}--side-nav__link[role='menuitem'] { + .#{$prefix}--side-nav__menu a.#{$prefix}--side-nav__link { height: mini-units(4); min-height: mini-units(4); padding-left: mini-units(4); @@ -454,13 +453,11 @@ } .#{$prefix}--side-nav__item.#{$prefix}--side-nav__item--icon - a.#{$prefix}--side-nav__link[role='menuitem'] { + a.#{$prefix}--side-nav__link { padding-left: mini-units(9); } - .#{$prefix}--side-nav__menu[role='menu'] - a.#{$prefix}--side-nav__link--current, - .#{$prefix}--side-nav__menu[role='menu'] - a.#{$prefix}--side-nav__link[aria-current='page'], + .#{$prefix}--side-nav__menu a.#{$prefix}--side-nav__link--current, + .#{$prefix}--side-nav__menu a.#{$prefix}--side-nav__link[aria-current='page'], a.#{$prefix}--side-nav__link--current { background-color: $ibm-color__gray-20; @@ -584,7 +581,7 @@ } .#{$prefix}--side-nav--fixed - .#{$prefix}--side-nav__menu[role='menu'] + .#{$prefix}--side-nav__menu a.#{$prefix}--side-nav__link { padding-left: mini-units(4); } diff --git a/packages/components/src/components/ui-shell/header-nav.hbs b/packages/components/src/components/ui-shell/header-nav.hbs index 6018b2c21d53..7c67a16deadc 100644 --- a/packages/components/src/components/ui-shell/header-nav.hbs +++ b/packages/components/src/components/ui-shell/header-nav.hbs @@ -1,4 +1,4 @@ -