update base class to not include namespace, update class usage

Author: chrisdholt

src/badge/fixtures/createBadge.ts

@@ -1,14 +1,14 @@
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT License.
 
-import {VSCodeBadge} from '../index';
+import {Badge} from '../index';
 
 export type BadgeArgs = {
 	label: string;
 };
 
 export function createBadge({label}: BadgeArgs) {
-	const badge = new VSCodeBadge();
+	const badge = new Badge();
 
 	if (label) {
 		badge.textContent = label;

src/badge/index.ts

@@ -1,15 +1,18 @@
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT License.
 
-import {Badge, badgeTemplate as template} from '@microsoft/fast-foundation';
+import {
+	Badge as FoundationBadge,
+	badgeTemplate as template,
+} from '@microsoft/fast-foundation';
 import {BadgeStyles as styles} from './badge.styles';
 
 /**
  * The Visual Studio Code badge class.
  *
  * @public
  */
-export class VSCodeBadge extends Badge {
+export class Badge extends FoundationBadge {
 	/**
 	 * Component lifecycle method that runs when the component is inserted
 	 * into the DOM.
@@ -21,7 +24,7 @@ export class VSCodeBadge extends Badge {
 
 		// This will override any usage of the circular attribute
 		// inherited by the FAST Foundation Badge component so
-		// that VSCodeBadges are always circular
+		// that VSCode Badges are always circular
 		if (!this.circular) {
 			this.circular = true;
 		}
@@ -36,7 +39,7 @@ export class VSCodeBadge extends Badge {
  *
  * @public
  */
-export const vsCodeBadge = VSCodeBadge.compose({
+export const vsCodeBadge = Badge.compose({
 	baseName: 'badge',
 	template,
 	styles,

src/button/fixtures/createButton.ts

@@ -1,7 +1,7 @@
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT License.
 
-import {ButtonAppearance, VSCodeButton} from '../index';
+import {Button, ButtonAppearance} from '../index';
 import {
 	createCodiconIcon,
 	focusObserver,
@@ -28,7 +28,7 @@ export function createButton({
 	ariaLabel,
 	onClick,
 }: ButtonArgs) {
-	const button = new VSCodeButton();
+	const button = new Button();
 
 	if (label && !iconOnly) {
 		button.textContent = label;

src/button/index.ts

@@ -3,8 +3,8 @@
 
 import {attr} from '@microsoft/fast-element';
 import {
-	Button,
 	ButtonOptions,
+	Button as FoundationButton,
 	buttonTemplate as template,
 } from '@microsoft/fast-foundation';
 import {ButtonStyles as styles} from './button.styles';
@@ -20,7 +20,7 @@ export type ButtonAppearance = 'primary' | 'secondary' | 'icon';
  *
  * @public
  */
-export class VSCodeButton extends Button {
+export class Button extends FoundationButton {
 	/**
 	 * The appearance the button should have.
 	 *
@@ -93,7 +93,7 @@ export class VSCodeButton extends Button {
  *
  * @public
  */
-export const vsCodeButton = VSCodeButton.compose<ButtonOptions>({
+export const vsCodeButton = Button.compose<ButtonOptions>({
 	baseName: 'button',
 	template,
 	styles,

src/checkbox/fixtures/createCheckbox.ts

@@ -1,7 +1,7 @@
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT License.
 
-import {VSCodeCheckbox} from '../index';
+import {Checkbox} from '../index';
 import {focusObserver} from '../../utilities/storybook/index';
 
 export type CheckboxArgs = {
@@ -25,7 +25,7 @@ export function createCheckbox({
 	hasValue,
 	onChange,
 }: CheckboxArgs) {
-	const checkbox = new VSCodeCheckbox();
+	const checkbox = new Checkbox();
 
 	if (label) {
 		checkbox.textContent = label;

src/checkbox/index.ts

@@ -2,8 +2,8 @@
 // Licensed under the MIT License.
 
 import {
-	Checkbox,
 	CheckboxOptions,
+	Checkbox as FoundationCheckbox,
 	checkboxTemplate as template,
 } from '@microsoft/fast-foundation';
 import {CheckboxStyles as styles} from './checkbox.styles';
@@ -13,7 +13,7 @@ import {CheckboxStyles as styles} from './checkbox.styles';
  *
  * @public
  */
-export class VSCodeCheckbox extends Checkbox {
+export class Checkbox extends FoundationCheckbox {
 	/**
 	 * Component lifecycle method that runs when the component is inserted
 	 * into the DOM.
@@ -39,7 +39,7 @@ export class VSCodeCheckbox extends Checkbox {
  *
  * @public
  */
-export const vsCodeCheckbox = VSCodeCheckbox.compose<CheckboxOptions>({
+export const vsCodeCheckbox = Checkbox.compose<CheckboxOptions>({
 	baseName: 'checkbox',
 	template,
 	styles,

src/data-grid/fixtures/createDataGrid.ts

@@ -1,7 +1,7 @@
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT License.
 
-import {VSCodeDataGrid} from '../index';
+import {DataGrid} from '../index';
 
 export type DataGridArgs = {
 	gridData: any;
@@ -18,7 +18,7 @@ export function createDataGrid({
 	hasCustomTitles,
 	ariaLabel,
 }: DataGridArgs) {
-	const dataGrid = new VSCodeDataGrid();
+	const dataGrid = new DataGrid();
 
 	if (gridData) {
 		dataGrid.rowsData = gridData;

src/data-grid/index.ts

@@ -3,9 +3,9 @@
 
 import {
 	dataGridCellTemplate as cellTemplate,
-	DataGrid,
-	DataGridCell,
-	DataGridRow,
+	DataGrid as FoundationDataGrid,
+	DataGridCell as FoundationDataGridCell,
+	DataGridRow as FoundationDataGridRow,
 	dataGridTemplate as gridTemplate,
 	dataGridRowTemplate as rowTemplate,
 } from '@microsoft/fast-foundation';
@@ -18,7 +18,7 @@ import {DataGridCellStyles as cellStyles} from './data-grid-cell.styles';
  *
  * @public
  */
-export class VSCodeDataGrid extends DataGrid {
+export class DataGrid extends FoundationDataGrid {
 	/**
 	 * Component lifecycle method that runs when the component is inserted
 	 * into the DOM.
@@ -45,7 +45,7 @@ export class VSCodeDataGrid extends DataGrid {
  *
  * @public
  */
-export const vsCodeDataGrid = VSCodeDataGrid.compose({
+export const vsCodeDataGrid = DataGrid.compose({
 	baseName: 'data-grid',
 	template: gridTemplate,
 	styles: gridStyles,
@@ -56,7 +56,7 @@ export const vsCodeDataGrid = VSCodeDataGrid.compose({
  *
  * @public
  */
-export class VSCodeDataGridRow extends DataGridRow {}
+export class DataGridRow extends FoundationDataGridRow {}
 
 /**
  * The Visual Studio Code data grid row component registration.
@@ -66,7 +66,7 @@ export class VSCodeDataGridRow extends DataGridRow {}
  *
  * @public
  */
-export const vsCodeDataGridRow = VSCodeDataGridRow.compose({
+export const vsCodeDataGridRow = DataGridRow.compose({
 	baseName: 'data-grid-row',
 	template: rowTemplate,
 	styles: rowStyles,
@@ -77,7 +77,7 @@ export const vsCodeDataGridRow = VSCodeDataGridRow.compose({
  *
  * @public
  */
-export class VSCodeDataGridCell extends DataGridCell {}
+export class DataGridCell extends FoundationDataGridCell {}
 
 /**
  * The Visual Studio Code data grid cell component registration.
@@ -87,7 +87,7 @@ export class VSCodeDataGridCell extends DataGridCell {}
  *
  * @public
  */
-export const vsCodeDataGridCell = VSCodeDataGridCell.compose({
+export const vsCodeDataGridCell = DataGridCell.compose({
 	baseName: 'data-grid-cell',
 	template: cellTemplate,
 	styles: cellStyles,

src/divider/fixtures/createDivider.ts

@@ -1,14 +1,14 @@
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT License.
 
-import {VSCodeDivider} from '../index';
+import {Divider} from '../index';
 
 export type DividerArgs = {
 	role: string;
 };
 
 export function createDivider({role}: DividerArgs) {
-	const divider = new VSCodeDivider();
+	const divider = new Divider();
 
 	if (role && role.toLocaleLowerCase() === 'presentation') {
 		divider.setAttribute('role', role.toLocaleLowerCase());

src/divider/index.ts

@@ -1,15 +1,18 @@
 // Copyright (c) Microsoft Corporation.
 // Licensed under the MIT License.
 
-import {Divider, dividerTemplate as template} from '@microsoft/fast-foundation';
+import {
+	Divider as FoundationDivider,
+	dividerTemplate as template,
+} from '@microsoft/fast-foundation';
 import {DividerStyles as styles} from './divider.styles';
 
 /**
  * The Visual Studio Code divider class.
  *
  * @public
  */
-export class VSCodeDivider extends Divider {}
+export class Divider extends FoundationDivider {}
 
 /**
  * The Visual Studio Code divider component registration.
@@ -19,7 +22,7 @@ export class VSCodeDivider extends Divider {}
  *
  * @public
  */
-export const vsCodeDivider = VSCodeDivider.compose({
+export const vsCodeDivider = Divider.compose({
 	baseName: 'divider',
 	template,
 	styles,