docs: add release note for v21.8

.changeset/angry-days-swim.md

@@ -14,7 +14,7 @@ function MyComponent() {
 
   return (
     <div>
-      <h1>Project images regex: {imageRegex}</h1>
+      <h1>Project images regex: {JSON.stringify(imageRegex)}</h1>
     </div>
   );
 }

.changeset/quick-plums-wonder.md

@@ -2,8 +2,8 @@
 '@commercetools-frontend/application-shell': patch
 ---
 
-Fixed aria role names.
+Fixed ARIA role names.
 
 We were using invalid role names in some of the component's elements.
 
-Special mention to the element wrapping the notifications as it now uses the aria-live [attribute](https://www.w3.org/TR/wai-aria/#aria-live) (with **polite** value).
+Special mention to the element wrapping the notifications as it now uses the `aria-live` [attribute](https://www.w3.org/TR/wai-aria/#aria-live) (with **polite** value).

.changeset/quick-rocks-rhyme.md

@@ -2,4 +2,4 @@
 '@commercetools-frontend/assets': patch
 ---
 
-Convert entry point to typescript
+Convert entry point to typescript.

.changeset/red-trainers-behave.md

@@ -1,5 +1,5 @@
 ---
-"@commercetools-frontend/application-shell": patch
+'@commercetools-frontend/application-shell': patch
 ---
 
-Fix `ApplicationShell` header selectors a11y issues
+Fix `<ApplicationShell>` header selectors accessibility issues.

.changeset/silver-cobras-switch.md

@@ -2,4 +2,4 @@
 '@commercetools-frontend/application-shell-connectors': patch
 ---
 
-Export `TImageRegexContext` type
+Export `TImageRegexContext` type.

website/src/content/api-reference/commercetools-frontend-application-shell-connectors.mdx

@@ -215,6 +215,34 @@ This component must be defined in a parent component where children of this comp
 | `skip`                          | `boolean`                  |    -     | -                 | false     | Disables loading images configuration.                                   |
 
 
+### useProjectExtensionImageRegex
+
+A React hook that allows to access the project images configuration.
+
+```jsx highlightLines="4-6"
+import { useProjectExtensionImageRegex } from '@commercetools-frontend/application-shell-connectors';
+
+function MyComponent() {
+  const { isLoading, imageRegex } = useProjectExtensionImageRegex();
+
+  if (isLoading) return <LoadingSpinner />;
+
+  return (
+    <div>
+      <h1>Project images regex: {JSON.stringify(imageRegex)}</h1>
+    </div>
+  );
+}
+
+function MyApp() {
+  return (
+    <ProjectExtensionProviderForImageRegex>
+      <MyComponent />
+    </ProjectExtensionProviderForImageRegex>
+  );
+}
+```
+
 ### GetProjectExtensionImageRegex
 
 Use this component to access the project images configuration, using a `render` prop function.

website/src/content/getting-started.mdx

@@ -24,6 +24,8 @@ npx @commercetools-frontend/create-mc-app \
   --template starter
 ```
 
+If you want to start with a [TypeScript](https://www.typescriptlang.org/) project you can use the `--template=starter-typescript` option. Read more about TypeScript in the [Adding TypeScript](/development/adding-typescript) page.
+
 <Info>
 
 Local development and login are only allowed for users being part of the `Administrators` Team of your Organization. Therefore, choose a Project that is part of an Organization where you are an administrator of.

website/src/releases/2022-07/release-v21.8.mdx

@@ -0,0 +1,48 @@
+---
+date: 2022-07-04
+title: Custom Applications v21.8
+description: The Application Kit packages have been released with several new features.
+type: feature
+topics:
+  - CLI
+  - Configuration
+  - Templates
+  - UI Components
+---
+
+The Application Kit packages have been released with a minor version `v21.8`.
+
+This release includes several new features that we would like to present:
+
+* Official support for developing Custom Applications in [TypeScript](https://www.typescriptlang.org/), including a new starter template. Read more about TypeScript in the [Adding TypeScript](/development/adding-typescript) page.
+* New policy option for configuring the `audience` field when [integrating your Custom Application with an external API](/concepts/integrate-with-your-own-api#configuring-the-audience-policy).
+* Improved accessibility of different elements to use correct ARIA attributes.
+* Simpler and more readable list of time zone data, available from the `@commercetools-frontend/l10n` package.
+* New React hook `useProjectExtensionImageRegex` for accessing the project images configuration, available from the `@commercetools-frontend/application-shell-connectors` package.
+
+As always, if you have questions or feedback you can open a [GitHub Discussion](https://github.com/commercetools/merchant-center-application-kit/discussions) or a [GitHub Issue](https://github.com/commercetools/merchant-center-application-kit/issues).
+
+<!--more-->
+
+# Deprecations
+
+The `mc-scripts` CLI has deprecated some entry points.
+
+Importing the function `createPostcssConfig` from the main entry point `@commercetools-frontend/mc-scripts` is now deprecated. Use the entry point `@commercetools-frontend/mc-scripts/postcss` instead.
+
+```diff
+const {
+  createPostcssConfig,
+-} = require('@commercetools-frontend/mc-scripts');
++} = require('@commercetools-frontend/mc-scripts/postcss');
+```
+
+Importing the functions `createWebpackConfigForDevelopment` and `createWebpackConfigForProduction` from the main entry point `@commercetools-frontend/mc-scripts` is now deprecated. Use the entry point `@commercetools-frontend/mc-scripts/webpack` instead.
+
+```diff
+const {
+  createWebpackConfigForDevelopment,
+  createWebpackConfigForProduction,
+-} = require('@commercetools-frontend/mc-scripts');
++} = require('@commercetools-frontend/mc-scripts/webpack');
+```