` to be selected by default
- */
- defaultSelected: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-
- /**
- * Specify whether the group is disabled
- */
- disabled: PropTypes.bool,
-
- /**
- * Provide where label text should be placed
- */
- labelPosition: PropTypes.oneOf(['left', 'right']),
-
- /**
- * Provide a legend to the RadioButtonGroup input that you are
- * exposing to the user
- */
- legendText: PropTypes.node,
-
- /**
- * Specify the name of the underlying `` nodes
- */
- name: PropTypes.string.isRequired,
-
- /**
- * Provide an optional `onChange` hook that is called whenever the value of
- * the group changes
- */
- onChange: PropTypes.func,
-
- /**
- * Provide where radio buttons should be placed
- */
- orientation: PropTypes.oneOf(['horizontal', 'vertical']),
-
- /**
- * Specify the value that is currently selected in the group
- */
- valueSelected: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-};
-
-export default RadioButtonGroup;
diff --git a/packages/react/src/components/Slider/Slider.js b/packages/react/src/components/Slider/Slider.js
index 140de1487499..fd0ba7b59acf 100644
--- a/packages/react/src/components/Slider/Slider.js
+++ b/packages/react/src/components/Slider/Slider.js
@@ -635,6 +635,7 @@ export default class Slider extends PureComponent {
aria-valuemin={min}
aria-valuenow={value}
style={thumbStyle}
+ aria-labelledby={labelId}
/>
{},
onKeyDown: () => {},
};
diff --git a/packages/react/src/components/UIShell/HeaderMenu.js b/packages/react/src/components/UIShell/HeaderMenu.js
index eda66ff10d48..6a9edb49dba9 100644
--- a/packages/react/src/components/UIShell/HeaderMenu.js
+++ b/packages/react/src/components/UIShell/HeaderMenu.js
@@ -241,4 +241,6 @@ const HeaderMenuForwardRef = React.forwardRef((props, ref) => {
});
HeaderMenuForwardRef.displayName = 'HeaderMenu';
+
+export { HeaderMenu };
export default HeaderMenuForwardRef;
diff --git a/packages/react/src/components/UIShell/HeaderMenuButton.js b/packages/react/src/components/UIShell/HeaderMenuButton.js
index 0da4aaedec38..a7a910500d0b 100644
--- a/packages/react/src/components/UIShell/HeaderMenuButton.js
+++ b/packages/react/src/components/UIShell/HeaderMenuButton.js
@@ -65,6 +65,9 @@ HeaderMenuButton.propTypes = {
*/
className: PropTypes.string,
+ /**
+ * Specify whether the menu button is "active".
+ */
isActive: PropTypes.bool,
/**
diff --git a/packages/react/src/components/UIShell/SideNavLink.js b/packages/react/src/components/UIShell/SideNavLink.js
index bc6c729f9748..ff8fb4772e9c 100644
--- a/packages/react/src/components/UIShell/SideNavLink.js
+++ b/packages/react/src/components/UIShell/SideNavLink.js
@@ -16,11 +16,11 @@ import { usePrefix } from '../../internal/usePrefix';
const SideNavLink = React.forwardRef(function SideNavLink(
{
- className: customClassName,
children,
+ className: customClassName,
renderIcon: IconElement,
isActive,
- large,
+ large = false,
...rest
},
ref
@@ -71,11 +71,6 @@ SideNavLink.propTypes = {
renderIcon: PropTypes.oneOfType([PropTypes.func, PropTypes.object]),
};
-SideNavLink.defaultProps = {
- element: 'a',
- large: false,
-};
-
// eslint-disable-next-line react/display-name
export const createCustomSideNavLink = (element) => (props) => {
return ;
diff --git a/packages/react/src/components/UIShell/UIShell.stories.js b/packages/react/src/components/UIShell/UIShell.stories.js
index 0fad7864e155..1dda7bf0a942 100644
--- a/packages/react/src/components/UIShell/UIShell.stories.js
+++ b/packages/react/src/components/UIShell/UIShell.stories.js
@@ -32,6 +32,7 @@ import {
SwitcherItem,
SwitcherDivider,
} from './';
+import { HeaderMenu as HeaderMenuNative } from './HeaderMenu';
import Modal from '../Modal';
import Button from '../Button';
import {
@@ -132,13 +133,13 @@ const StoryContent = ({ useResponsiveOffset = true }) => {
// eslint-disable-next-line storybook/csf-component
export default {
title: 'Components/UI Shell',
+ component: Header,
subcomponents: {
Content,
- Header,
HeaderMenuButton,
HeaderName,
HeaderNavigation,
- HeaderMenu,
+ HeaderMenu: HeaderMenuNative,
HeaderMenuItem,
HeaderGlobalBar,
HeaderGlobalAction,
@@ -160,6 +161,13 @@ export default {
page: mdx,
},
},
+ argTypes: {
+ className: {
+ table: {
+ disable: true,
+ },
+ },
+ },
};
export const HeaderBase = () => (
diff --git a/packages/react/src/index.js b/packages/react/src/index.js
index cef8a5c8435b..5177775ed5dc 100644
--- a/packages/react/src/index.js
+++ b/packages/react/src/index.js
@@ -17,7 +17,8 @@ export Checkbox from './components/Checkbox';
export { ClassPrefix } from './components/ClassPrefix';
export CodeSnippet from './components/CodeSnippet';
export ComboBox from './components/ComboBox';
-export ComposedModal, {
+export {
+ ComposedModal,
ModalHeader,
ModalBody,
ModalFooter,
@@ -82,7 +83,6 @@ export {
InlineNotification,
NotificationActionButton,
NotificationButton,
- NotificationTextDetails,
} from './components/Notification';
export NumberInput from './components/NumberInput';
export OrderedList from './components/OrderedList';
diff --git a/packages/styles/scss/components/aspect-ratio/_aspect-ratio.scss b/packages/styles/scss/components/aspect-ratio/_aspect-ratio.scss
index 4fd8e664a9da..5ced3c3c9329 100644
--- a/packages/styles/scss/components/aspect-ratio/_aspect-ratio.scss
+++ b/packages/styles/scss/components/aspect-ratio/_aspect-ratio.scss
@@ -63,11 +63,7 @@ $aspect-ratios: (
$height: list.nth($aspect-ratio, 2);
.#{$prefix}--aspect-ratio--#{$width}x#{$height}::before {
- @if meta.function-exists('div', 'math') {
- padding-top: math.percentage(math.div($height, $width));
- } @else {
- padding-top: math.percentage(($height / $width));
- }
+ padding-top: math.percentage(math.div($height, $width));
}
}
}
diff --git a/packages/styles/scss/components/data-table/_data-table.scss b/packages/styles/scss/components/data-table/_data-table.scss
index dc65169b4f22..4e8854ec1dc9 100644
--- a/packages/styles/scss/components/data-table/_data-table.scss
+++ b/packages/styles/scss/components/data-table/_data-table.scss
@@ -348,7 +348,7 @@
.#{$prefix}--data-table thead th.#{$prefix}--table-column-checkbox,
.#{$prefix}--data-table tbody td.#{$prefix}--table-column-checkbox {
- width: 2.5rem;
+ min-width: 2.5rem;
// spacing between checkbox / chevron and next cell should be 8px / 0.5rem
padding-right: rem(4px);
padding-left: 1rem;
diff --git a/packages/styles/scss/utilities/_convert.scss b/packages/styles/scss/utilities/_convert.scss
index 317e676044ef..44df985cec9a 100644
--- a/packages/styles/scss/utilities/_convert.scss
+++ b/packages/styles/scss/utilities/_convert.scss
@@ -23,11 +23,7 @@ $base-font-size: 16px !default;
@error "Expected argument $px to be of type `px`, instead received: `#{unit($px)}`";
}
- @if meta.function-exists('div', 'math') {
- @return math.div($px, $base-font-size) * 1rem;
- } @else {
- @return ($px / $base-font-size) * 1rem;
- }
+ @return math.div($px, $base-font-size) * 1rem;
}
/// Convert a given px unit to a em unit
@@ -40,9 +36,5 @@ $base-font-size: 16px !default;
@error "Expected argument $px to be of type `px`, instead received: `#{unit($px)}`";
}
- @if meta.function-exists('div', 'math') {
- @return math.div($px, $base-font-size) * 1em;
- } @else {
- @return ($px / $base-font-size) * 1em;
- }
+ @return math.div($px, $base-font-size) * 1em;
}
diff --git a/yarn.lock b/yarn.lock
index d2341ac8d329..28b58dad0c5c 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2166,7 +2166,7 @@ __metadata:
lodash.throttle: ^4.1.1
mini-css-extract-plugin: ^2.4.5
postcss: ^8.4.5
- postcss-loader: ^6.2.1
+ postcss-loader: ^7.0.0
process: ^0.11.10
prop-types: ^15.7.2
react: ^17.0.2
@@ -24560,6 +24560,20 @@ fsevents@^1.2.7:
languageName: node
linkType: hard
+"postcss-loader@npm:^7.0.0":
+ version: 7.0.0
+ resolution: "postcss-loader@npm:7.0.0"
+ dependencies:
+ cosmiconfig: ^7.0.0
+ klona: ^2.0.5
+ semver: ^7.3.7
+ peerDependencies:
+ postcss: ^7.0.0 || ^8.0.1
+ webpack: ^5.0.0
+ checksum: b8e51e99898cae8400de8690752b64af2ca1e3eed7c0d696c9e1ec6fc45dd334c958748247632c48109a519fb59f7545d0b8fe4b52479d982ca3ec4eb8e3b0c9
+ languageName: node
+ linkType: hard
+
"postcss-logical@npm:^5.0.4":
version: 5.0.4
resolution: "postcss-logical@npm:5.0.4"
@@ -27838,7 +27852,7 @@ resolve@^2.0.0-next.3:
languageName: node
linkType: hard
-"semver@npm:7.3.7, semver@npm:^7.1.1, semver@npm:^7.1.3, semver@npm:^7.2.1, semver@npm:^7.3.2, semver@npm:^7.3.4, semver@npm:^7.3.5":
+"semver@npm:7.3.7, semver@npm:^7.1.1, semver@npm:^7.1.3, semver@npm:^7.2.1, semver@npm:^7.3.2, semver@npm:^7.3.4, semver@npm:^7.3.5, semver@npm:^7.3.7":
version: 7.3.7
resolution: "semver@npm:7.3.7"
dependencies: