From 4baf53acf4b0d2ab1631a672fb79b45aff7b174b Mon Sep 17 00:00:00 2001
From: sarayourfriend <24264157+sarayourfriend@users.noreply.github.com>
Date: Fri, 7 May 2021 13:53:16 -0700
Subject: [PATCH] components: Promote Elevation

---
 docs/manifest.json                                   |  6 ++++++
 packages/components/src/{ui => }/elevation/README.md |  2 +-
 .../components/src/{ui => }/elevation/component.js   |  4 ++--
 packages/components/src/{ui => }/elevation/hook.js   |  6 +++---
 packages/components/src/{ui => }/elevation/index.js  |  0
 .../src/{ui => }/elevation/stories/index.js          | 12 ++++++------
 packages/components/src/{ui => }/elevation/styles.js |  0
 .../elevation/test/__snapshots__/index.js.snap       |  0
 .../components/src/{ui => }/elevation/test/index.js  |  0
 packages/components/src/{ui => }/elevation/types.ts  |  0
 packages/components/src/index.js                     |  1 +
 packages/components/src/ui/card/component.js         |  2 +-
 packages/components/src/ui/index.js                  |  1 -
 packages/components/tsconfig.json                    |  1 +
 14 files changed, 21 insertions(+), 14 deletions(-)
 rename packages/components/src/{ui => }/elevation/README.md (99%)
 rename packages/components/src/{ui => }/elevation/component.js (91%)
 rename packages/components/src/{ui => }/elevation/hook.js (92%)
 rename packages/components/src/{ui => }/elevation/index.js (100%)
 rename packages/components/src/{ui => }/elevation/stories/index.js (91%)
 rename packages/components/src/{ui => }/elevation/styles.js (100%)
 rename packages/components/src/{ui => }/elevation/test/__snapshots__/index.js.snap (100%)
 rename packages/components/src/{ui => }/elevation/test/index.js (100%)
 rename packages/components/src/{ui => }/elevation/types.ts (100%)

diff --git a/docs/manifest.json b/docs/manifest.json
index b65c0aead24a5..1ecb319023039 100644
--- a/docs/manifest.json
+++ b/docs/manifest.json
@@ -809,6 +809,12 @@
 		"markdown_source": "../packages/components/src/duotone-picker/README.md",
 		"parent": "components"
 	},
+	{
+		"title": "Elevation",
+		"slug": "elevation",
+		"markdown_source": "../packages/components/src/elevation/README.md",
+		"parent": "components"
+	},
 	{
 		"title": "ExternalLink",
 		"slug": "external-link",
diff --git a/packages/components/src/ui/elevation/README.md b/packages/components/src/elevation/README.md
similarity index 99%
rename from packages/components/src/ui/elevation/README.md
rename to packages/components/src/elevation/README.md
index 6c57b501daf18..02aa099edb77a 100644
--- a/packages/components/src/ui/elevation/README.md
+++ b/packages/components/src/elevation/README.md
@@ -7,7 +7,7 @@
 The shadow effect is generated using the `value` prop.
 
 ```jsx
-import { Elevation, Surface, Text, View } from '@wordpress/components/ui';
+import { Elevation, Surface, Text, View } from '@wordpress/components';
 
 function Example() {
 	return (
diff --git a/packages/components/src/ui/elevation/component.js b/packages/components/src/elevation/component.js
similarity index 91%
rename from packages/components/src/ui/elevation/component.js
rename to packages/components/src/elevation/component.js
index 3d525c099ceea..b4aa774ac0668 100644
--- a/packages/components/src/ui/elevation/component.js
+++ b/packages/components/src/elevation/component.js
@@ -2,7 +2,7 @@
  * Internal dependencies
  */
 import { useElevation } from './hook';
-import { createComponent } from '../utils';
+import { createComponent } from '../ui/utils';
 
 /**
  * `Elevation` is a core component that renders shadow, using the library's shadow system.
@@ -11,7 +11,7 @@ import { createComponent } from '../utils';
  *
  * @example
  * ```jsx
- * import { Elevation, Surface, Text, View } from `@wordpress/components/ui`;
+ * import { Elevation, Surface, Text, View } from `@wordpress/components`;
  *
  * function Example() {
  * 	return (
diff --git a/packages/components/src/ui/elevation/hook.js b/packages/components/src/elevation/hook.js
similarity index 92%
rename from packages/components/src/ui/elevation/hook.js
rename to packages/components/src/elevation/hook.js
index 0489698745574..7dff760846c84 100644
--- a/packages/components/src/ui/elevation/hook.js
+++ b/packages/components/src/elevation/hook.js
@@ -12,9 +12,9 @@ import { useMemo } from '@wordpress/element';
 /**
  * Internal dependencies
  */
-import { useContextSystem } from '../context';
+import { useContextSystem } from '../ui/context';
 import * as styles from './styles';
-import CONFIG from '../../utils/config-values';
+import CONFIG from '../utils/config-values';
 
 /**
  * @param {number} value
@@ -29,7 +29,7 @@ export function getBoxShadow( value ) {
 }
 
 /**
- * @param {import('../context').ViewOwnProps<import('./types').Props, 'div'>} props
+ * @param {import('../ui/context').ViewOwnProps<import('./types').Props, 'div'>} props
  */
 export function useElevation( props ) {
 	const {
diff --git a/packages/components/src/ui/elevation/index.js b/packages/components/src/elevation/index.js
similarity index 100%
rename from packages/components/src/ui/elevation/index.js
rename to packages/components/src/elevation/index.js
diff --git a/packages/components/src/ui/elevation/stories/index.js b/packages/components/src/elevation/stories/index.js
similarity index 91%
rename from packages/components/src/ui/elevation/stories/index.js
rename to packages/components/src/elevation/stories/index.js
index 70b157bf5d0f0..f52c1f8ae3216 100644
--- a/packages/components/src/ui/elevation/stories/index.js
+++ b/packages/components/src/elevation/stories/index.js
@@ -7,15 +7,15 @@ import { number } from '@storybook/addon-knobs';
  * Internal dependencies
  */
 import { Elevation } from '../index';
-import { Grid } from '../../../grid';
-import { View } from '../../../view';
-import { HStack } from '../../../h-stack';
-import { Divider } from '../../../divider';
+import { Grid } from '../../grid';
+import { View } from '../../view';
+import { HStack } from '../../h-stack';
+import { Divider } from '../../divider';
 import {
 	ExampleGrid,
 	ExampleGridItem,
 	ExampleMetaContent,
-} from '../../__storybook-utils';
+} from '../../ui/__storybook-utils';
 
 /**
  * WordPress dependencies
@@ -24,7 +24,7 @@ import { useCallback } from '@wordpress/element';
 
 export default {
 	component: Elevation,
-	title: 'G2 Components (Experimental)/Elevation',
+	title: 'Components (Experimental)/Elevation',
 };
 
 const ElevationWrapper = ( { children } ) => (
diff --git a/packages/components/src/ui/elevation/styles.js b/packages/components/src/elevation/styles.js
similarity index 100%
rename from packages/components/src/ui/elevation/styles.js
rename to packages/components/src/elevation/styles.js
diff --git a/packages/components/src/ui/elevation/test/__snapshots__/index.js.snap b/packages/components/src/elevation/test/__snapshots__/index.js.snap
similarity index 100%
rename from packages/components/src/ui/elevation/test/__snapshots__/index.js.snap
rename to packages/components/src/elevation/test/__snapshots__/index.js.snap
diff --git a/packages/components/src/ui/elevation/test/index.js b/packages/components/src/elevation/test/index.js
similarity index 100%
rename from packages/components/src/ui/elevation/test/index.js
rename to packages/components/src/elevation/test/index.js
diff --git a/packages/components/src/ui/elevation/types.ts b/packages/components/src/elevation/types.ts
similarity index 100%
rename from packages/components/src/ui/elevation/types.ts
rename to packages/components/src/elevation/types.ts
diff --git a/packages/components/src/index.js b/packages/components/src/index.js
index 7d3da34a689b1..4a561ab367ffe 100644
--- a/packages/components/src/index.js
+++ b/packages/components/src/index.js
@@ -57,6 +57,7 @@ export { default as DropZoneProvider } from './drop-zone/provider';
 export { default as Dropdown } from './dropdown';
 export { default as DropdownMenu } from './dropdown-menu';
 export { DuotoneSwatch, DuotonePicker } from './duotone-picker';
+export { Elevation as __experimentalElevation } from './elevation';
 export { default as ExternalLink } from './external-link';
 export { Flex, FlexBlock, FlexItem } from './flex';
 export { default as FocalPointPicker } from './focal-point-picker';
diff --git a/packages/components/src/ui/card/component.js b/packages/components/src/ui/card/component.js
index 9f169ad4df40f..97e600b152ac6 100644
--- a/packages/components/src/ui/card/component.js
+++ b/packages/components/src/ui/card/component.js
@@ -12,7 +12,7 @@ import { useMemo } from '@wordpress/element';
  * Internal dependencies
  */
 import { contextConnect } from '../context';
-import { Elevation } from '../elevation';
+import { Elevation } from '../../elevation';
 import { View } from '../../view';
 import * as styles from './styles';
 import { useCard } from './hook';
diff --git a/packages/components/src/ui/index.js b/packages/components/src/ui/index.js
index 25a8bb636b8da..090c2dde8a7c2 100644
--- a/packages/components/src/ui/index.js
+++ b/packages/components/src/ui/index.js
@@ -1,7 +1,6 @@
 export * from './card';
 export * from './control-group';
 export * from './control-label';
-export * from './elevation';
 export * from './form-group';
 export * from './shortcut';
 export * from './spinner';
diff --git a/packages/components/tsconfig.json b/packages/components/tsconfig.json
index ad80a95934e81..c120b57320352 100644
--- a/packages/components/tsconfig.json
+++ b/packages/components/tsconfig.json
@@ -20,6 +20,7 @@
 		"src/base-control/**/*",
 		"src/dashicon/**/*",
 		"src/draggable/**/*",
+		"src/elevation/**/*",
 		"src/flex/**/*",
 		"src/form-group/**/*",
 		"src/scroll-lock/**/*",