diff --git a/packages/react/src/components/IconButton/IconButton.mdx b/packages/react/src/components/IconButton/IconButton.mdx
new file mode 100644
index 000000000000..bf5b8c20dc7e
--- /dev/null
+++ b/packages/react/src/components/IconButton/IconButton.mdx
@@ -0,0 +1,64 @@
+import { ArgsTable, Canvas, Story } from '@storybook/addon-docs';
+
+# IconButton
+
+[Source
+code](https://github.com/carbon-design-system/carbon/tree/main/packages/react/src/components/IconButton)
+ | 
+[Usage guidelines](https://www.carbondesignsystem.com/components/button/usage)
+
+<!-- START doctoc generated TOC please keep comment here to allow auto update -->
+<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
+
+## Table of Contents
+
+- [Overview](#overview)
+- [Component API](#component-api)
+- [Feedback](#feedback)
+
+<!-- END doctoc generated TOC please keep comment here to allow auto update -->
+
+## Overview
+
+The `IconButton` component is useful when you have a button where the
+content is an icon. In this situation, it's important that the button itself is
+labeled in a way that can be understandable by mouse, keyboard, and screen
+readers. As a result, this component makes it easy to create accessible icon buttons
+
+```jsx
+import { IconButton } from '@carbon/react';
+import { Add } from '@carbon/react/icons';
+
+function ExampleComponent() {
+  return (
+    <IconButton label="Add">
+      <Add />
+    </IconButton>
+  );
+}
+```
+
+## Alignment
+
+The `align` prop allows you to specify where your content should be placed
+relative to the `IconButton`. For example, if you provide `align="top"` to the
+`IconButton` component then the tooltip will render above your component.
+Similarly, if you provide `align="bottom"` then the tooltip will render below
+your component.
+
+## Customizing the label
+
+You can customize the label, or tooltip, of the `IconButton` with the `label`
+prop. However, it's important that this label contain no interactive content so
+that the component remains accessible.
+
+## Component API
+
+<ArgsTable />
+
+## Feedback
+
+Help us improve this component by providing feedback, asking questions on Slack,
+or updating this file on
+[GitHub](https://github.com/carbon-design-system/carbon/edit/main/packages/react/src/components/IconButton/IconButton.mdx).
+
diff --git a/packages/react/src/components/IconButton/next/IconButton.stories.js b/packages/react/src/components/IconButton/IconButton.stories.js
similarity index 93%
rename from packages/react/src/components/IconButton/next/IconButton.stories.js
rename to packages/react/src/components/IconButton/IconButton.stories.js
index 0cb6f640e964..0e62a195027c 100644
--- a/packages/react/src/components/IconButton/next/IconButton.stories.js
+++ b/packages/react/src/components/IconButton/IconButton.stories.js
@@ -7,7 +7,8 @@
 
 import { Edit } from '@carbon/icons-react';
 import React from 'react';
-import { IconButton } from '../';
+import { IconButton } from '../IconButton';
+import mdx from './IconButton.mdx';
 
 export default {
   title: 'Components/IconButton',
@@ -16,6 +17,9 @@ export default {
     controls: {
       hideNoControlsWarning: true,
     },
+    docs: {
+      page: mdx,
+    },
     layout: 'centered',
   },
   argTypes: {
diff --git a/packages/react/src/components/IconButton/index.js b/packages/react/src/components/IconButton/index.js
index ac1a32997ad4..112a7329b985 100644
--- a/packages/react/src/components/IconButton/index.js
+++ b/packages/react/src/components/IconButton/index.js
@@ -40,7 +40,7 @@ const IconButton = React.forwardRef(function IconButton(props, ref) {
         kind={kind}
         ref={ref}
         size={size}
-        className={cx(`${prefix}--btn--icon-only`, { [className]: className })}>
+        className={cx(`${prefix}--btn--icon-only`, className)}>
         {children}
       </Button>
     </Tooltip>
diff --git a/packages/react/src/components/StructuredList/next/StructuredList.js b/packages/react/src/components/StructuredList/next/StructuredList.js
index 8c2d7d275e11..d502d57a1d01 100644
--- a/packages/react/src/components/StructuredList/next/StructuredList.js
+++ b/packages/react/src/components/StructuredList/next/StructuredList.js
@@ -36,7 +36,7 @@ export function StructuredListWrapper(props) {
   return (
     <GridSelectedRowStateContext.Provider value={selectedRow}>
       <GridSelectedRowDispatchContext.Provider value={setSelectedRow}>
-        <div role="grid" className={classes} {...other} aria-label={ariaLabel}>
+        <div role="table" className={classes} {...other} aria-label={ariaLabel}>
           {children}
         </div>
       </GridSelectedRowDispatchContext.Provider>
diff --git a/packages/react/src/components/Toggletip/next/Toggletip.mdx b/packages/react/src/components/Toggletip/Toggletip.mdx
similarity index 97%
rename from packages/react/src/components/Toggletip/next/Toggletip.mdx
rename to packages/react/src/components/Toggletip/Toggletip.mdx
index b6ca8bfff8ad..55d1a5b6fbf2 100644
--- a/packages/react/src/components/Toggletip/next/Toggletip.mdx
+++ b/packages/react/src/components/Toggletip/Toggletip.mdx
@@ -83,4 +83,4 @@ example:
 
 Help us improve this component by providing feedback, asking questions on Slack,
 or updating this file on
-[GitHub](https://github.com/carbon-design-system/carbon/edit/main/packages/react/src/components/Toggletip/next/Toggletip.mdx).
+[GitHub](https://github.com/carbon-design-system/carbon/edit/main/packages/react/src/components/Toggletip/Toggletip.mdx).
diff --git a/packages/react/src/components/Toggletip/next/Toggletip.stories.js b/packages/react/src/components/Toggletip/Toggletip.stories.js
similarity index 95%
rename from packages/react/src/components/Toggletip/next/Toggletip.stories.js
rename to packages/react/src/components/Toggletip/Toggletip.stories.js
index b1163c54abbd..767b6bdc380c 100644
--- a/packages/react/src/components/Toggletip/next/Toggletip.stories.js
+++ b/packages/react/src/components/Toggletip/Toggletip.stories.js
@@ -7,15 +7,15 @@
 
 import { Information } from '@carbon/icons-react';
 import React from 'react';
-import { default as Button } from '../../Button';
-import { default as Link } from '../../Link';
+import { default as Button } from '../Button';
+import { default as Link } from '../Link';
 import {
   ToggletipLabel,
   Toggletip,
   ToggletipButton,
   ToggletipContent,
   ToggletipActions,
-} from '../../Toggletip';
+} from '../Toggletip';
 import mdx from './Toggletip.mdx';
 
 export default {
diff --git a/packages/styles/scss/__tests__/type-test.js b/packages/styles/scss/__tests__/type-test.js
index 009116fbe24c..87e7915d8213 100644
--- a/packages/styles/scss/__tests__/type-test.js
+++ b/packages/styles/scss/__tests__/type-test.js
@@ -27,19 +27,27 @@ describe('@carbon/styles/scss/type', () => {
           reset: meta.mixin-exists('reset', 'type'),
           type-style: meta.mixin-exists('type-style', 'type'),
           font-family: meta.mixin-exists('font-family', 'type'),
+          font-weight: meta.mixin-exists('font-family', 'type'),
           default-type: meta.mixin-exists('default-type', 'type'),
           type-classes: meta.mixin-exists('type-classes', 'type'),
         ),
+        functions: (
+          font-weight: meta.function-exists('font-family', 'type'),
+        ),
       ));
     `);
 
     const { value: api } = get('api');
+    expect(api.functions).toEqual({
+      'font-weight': true,
+    });
     expect(api.mixins).toEqual({
       reset: true,
       'type-style': true,
       'font-family': true,
       'default-type': true,
       'type-classes': true,
+      'font-weight': true,
     });
     expect(api.variables).toMatchInlineSnapshot(`
       Array [
@@ -73,6 +81,8 @@ describe('@carbon/styles/scss/type', () => {
         "display-02",
         "display-03",
         "display-04",
+        "font-families",
+        "font-weights",
         "tokens",
       ]
     `);
diff --git a/packages/styles/scss/type/_index.scss b/packages/styles/scss/type/_index.scss
index 22bdb0f36324..717bef66a179 100644
--- a/packages/styles/scss/type/_index.scss
+++ b/packages/styles/scss/type/_index.scss
@@ -13,6 +13,7 @@
   font-family,
   default-type,
   type-classes,
+  font-weight,
 
   // Variables
   $caption-01,
@@ -46,6 +47,8 @@
   $display-02,
   $display-03,
   $display-04,
+  $font-families, 
+  $font-weights,
   $tokens;
 
 @use '@carbon/type';