Content Pass On Non-Component Files (#169)

Description of changes

In preparation for public release, conducted a pass on non-component files for typos, language clarity, branding, and so on.

.github/workflows/docs-cd.yml

@@ -22,5 +22,5 @@ jobs:
             - name: Deploy Docs 🚀
               uses: JamesIves/github-pages-deploy-action@4.1.3
               with:
-                  branch: gh-pages # The branch the action should deploy to.
-                  folder: storybook-static # The folder the action should deploy.
+                  branch: gh-pages
+                  folder: storybook-static

.storybook/customTheme.js

@@ -2,7 +2,6 @@ import {create} from '@storybook/theming/create';
 
 export default create({
 	base: 'light',
-	brandTitle: 'VS Code Webview Toolkit',
+	brandTitle: 'Webview UI Toolkit',
 	brandUrl: 'https://github.com/microsoft/vscode-webview-toolkit',
-	// brandImage: "https://placehold.it/350x150",
 });

CONTRIBUTING.md

@@ -8,7 +8,7 @@ This project has adopted the [Microsoft Open Source Code of Conduct](https://ope
 
 ## Initial set up
 
-To start off, fork the `vscode-webview-toolkit` repo on GitHub.
+To start off, fork this repo on GitHub.
 
 ### Clone the forked repo
 
@@ -58,7 +58,7 @@ Create a branch for local development. Once that is complete, you can start maki
 git checkout -b {branch-name}
 ```
 
-## Submitting changes
+## Validate changes
 
 When you're done making changes, check that your changes pass linting, formatting, tests, and that both the toolkit package and docs site can be built without errors.
 
@@ -70,7 +70,7 @@ npm run build
 npm run build:docs
 ```
 
-### Add & commit changes
+### Add and commit changes
 
 Commit your changes and push your branch to GitHub.
 
@@ -85,7 +85,7 @@ If there are new commits from upstream's `main` branch since your last git pull,
 to merge the latest commits from upstream's `main` into your branch and resolve any
 merge conflicts locally.
 
-If there are no new commits from upstream's `main`, you can skip steps 1, 2, and 3.
+If there are no new commits from upstream's `main`, you can skip the following steps.
 
 1. Get the latest commits.
 
@@ -123,7 +123,7 @@ npm run deploy:docs
 
 Once deployed, the site should be viewable at the following link: https://{your-github-username}.github.io/vscode-webview-toolkit/
 
-Finally, note that the first time you deploy the docs site, navigating to this link will likely result in a 401 error. This is because GitHub Pages defaults to private visibility. To change this:
+The first time you deploy the docs site, navigating to this link will likely result in a 401 error. This is because GitHub Pages defaults to private visibility. To change this:
 
 -   Navigate to the "Settings" page of your forked repo
 -   Click the "Pages" sidebar tab
@@ -133,7 +133,7 @@ Finally, note that the first time you deploy the docs site, navigating to this l
 
 ### Submit a pull request
 
-Finally, submit a pull request through the GitHub website.
+Finally, submit a pull request to the main toolkit repository through the GitHub website.
 
 ## Long term repo maintenance
 

README.md

@@ -1,12 +1,12 @@
-# Visual Studio Code Webview Toolkit
+# Visual Studio Code Webview UI Toolkit
 
 [![License: MIT](https://img.shields.io/badge/License-MIT-brightgreen)](https://opensource.org/licenses/MIT)
-[![NPM Version](https://img.shields.io/badge/npm-v0.5.0-blue)](https://github.com/microsoft/vscode-webview-toolkit)
+[![NPM Version](https://img.shields.io/badge/npm-v0.6.1-blue)](https://github.com/microsoft/vscode-webview-toolkit)
 [![TypeScript](https://img.shields.io/badge/%3C%2F%3E-TypeScript-blue)](https://www.typescriptlang.org/)
 
 ## Introduction
 
-The VS Code Webview Toolkit is a component library made for building webview-based extensions in VS Code that match the native look and behavior of VS Code itself. Features of the library include:
+The VS Code Webview UI Toolkit is a component library made for building webview-based extension UIs in VS Code that match the native look and behavior of VS Code itself. Features of the library include:
 
 -   **Implements The VS Code Design Language:** All components implement the VS Code design language, enabling developers to create extensions that have a consistent look and feel with the rest of VS Code.
 -   **Theming As A First Class Citizen:** All components were designed with theming in mind and the toolkit ships with utilities that automatically consume and apply VS Code color theme changes.

azure-pipelines.yml

@@ -15,14 +15,11 @@ jobs:
                 result: 'PoliCheck.xml'
                 optionsXS: 1 # Scan subfolders
                 optionsPE: 1 # Enable exclusions
-                # Exclude folders like node_modules, dist, .git etc.
                 optionsUEPATH: '$(Build.SourcesDirectory)/policheck/UserExclusion.xml'
 
-      # Guardian and ESLint are built on dotnet and need a Windows VM to run
     - job: Security
       pool:
           vmImage: 'windows-latest'
-      # Run the 1ES ESLint task using Guardian
       steps:
           - task: ESLint@1
             displayName: '🛡 Guardian: ESLint'

docs/components.md

@@ -1,6 +1,6 @@
-# VS Code Webview Toolkit Component Docs
+# Component Documentation List
 
-Here you can find a list of all the components currently available in this toolkit with links to documentation for each component.
+Here you can find a list of all the components currently available in the toolkit with links to documentation for each component.
 
 | Component         | Doc Link                                                          |
 | ----------------- | ----------------------------------------------------------------- |

docs/getting-started.md

@@ -1,6 +1,6 @@
 # Getting Started Guide
 
-This guide will cover the following steps to get you up and running with the VS Code Webview Toolkit.
+This guide will cover the following steps to get you up and running with the Webview UI Toolkit.
 
 1. Create a webview-based extension
 2. Install and set up the toolkit
@@ -92,7 +92,7 @@ When the host window opens, open the Command Palette (`Crtl + Shift + P` or `Cmd
 
 ![Testing That The Webview Extension Works](./assets/webview-test.gif)
 
-## Install & set up the toolkit
+## Install and set up the toolkit
 
 With an extension created, we can now install the toolkit via a private Azure NPM package.
 
@@ -110,7 +110,7 @@ Install the package using this command.
 npm install --save vscode-webview-toolkit
 ```
 
-### Using The toolkit inside a webview
+### Using the toolkit inside a webview
 
 With the package installed, we need to adjust the project so the toolkit is usable within our webview. We'll start by updating the `getWebviewContent` content function we defined earlier to accept two new parameters.
 
@@ -206,7 +206,7 @@ Open the Command Pallette (`Crtl + Shift + P` or `Cmd + Shift + P` on Mac), sear
 
 ## Next steps
 
-Congratulations on getting started with the VS Code Webview Toolkit! 🎊
+Congratulations on getting started with the VS Code Webview UI Toolkit! 🎊
 
 Now that you're set up, checkout the component docs for further documentation on what components are available and how to use them. Further component documentation and some guides on how to work with webviews is also provided too. Happy hacking!
 

docs/storybook/Introduction.stories.mdx

@@ -2,11 +2,11 @@ import {Meta} from '@storybook/addon-docs/blocks';
 
 <Meta title="Docs/Introduction" parameters={{options: {isToolshown: false}}} />
 
-# Visual Studio Code Webview Toolkit
+# Visual Studio Code Webview UI Toolkit
 
-Welcome to the VS Code Webview Toolkit Storybook! 👋
+Welcome to the Webview UI Toolkit Storybook! 👋
 
-The [VS Code Webview Toolkit](https://github.com/microsoft/vscode-webview-toolkit) is a component library made for building webview-based extensions in VS Code that match the native look and behavior of VS Code itself. Features of the library include:
+The [VS Code UI Webview Toolkit](https://github.com/microsoft/vscode-webview-toolkit) is a component library made for building webview-based extensions in Visual Studio Code that match the native look and behavior of VS Code itself. Features of the library include:
 
 -   **Implements The VS Code Design Language:** All components implement the VS Code design language, enabling developers to create extensions that have a consistent look and feel with the rest of VS Code.
 -   **Theming As A First Class Citizen:** All components were designed with theming in mind and the toolkit ships with utilities that automatically consume and apply VS Code color theme changes.

package.json

@@ -1,7 +1,7 @@
 {
 	"name": "vscode-webview-toolkit",
 	"version": "0.6.1",
-	"description": "A component library for building webview-based extensions in Visual Studio Code.",
+	"description": "A component library for building webview-based extension UIs in Visual Studio Code.",
 	"homepage": "https://github.com/microsoft/vscode-webview-toolkit#readme",
 	"license": "MIT",
 	"author": {

src/utilities/theme/applyTheme.ts

@@ -3,7 +3,7 @@
 
 /**
  * This script configures a MutationObserver to watch for VS Code theme changes and
- * applies the current VS Code theme to the VS Code Webview Toolkit components.
+ * applies the current VS Code theme to the toolkit components.
  */
 
 import {tokenMappings} from './tokenMappings';
@@ -19,8 +19,7 @@ window.addEventListener('load', () => {
 });
 
 /**
- * Applies the current VS Code theme to the VS Code Webview Toolkit
- * components.
+ * Applies the current VS Code theme to the toolkit components.
  */
 function applyCurrentTheme() {
 	// Get all the styles applied to the <body> tag in the webview HTML