chore(cwc): generate cwc internal vendor package (carbon-design-syste…

…m#9899)

### Related Ticket(s)

[carbon-web-components]: updating build scripts to use internal vendor packages carbon-design-system#9763

### Description

This PR adds the the gulp tasks to build cwc to the internal vendor folder and changes the paths in web-components to reference the internal files instead.

### Changelog

**New**

- add to the gulp tasks in `web-components` to build out the `carbon-web-components` internal vendor package

**Changed**

- change paths to reference the internal `carbon-web-components` vendor files instead

<!-- React and Web Component deploy previews are enabled by default. -->
<!-- To enable additional available deploy previews, apply the following -->
<!-- labels for the corresponding package: -->
<!-- *** "test: e2e": Codesandbox examples and e2e integration tests -->
<!-- *** "package: services": Services -->
<!-- *** "package: utilities": Utilities -->
<!-- *** "RTL": React / Web Components (RTL) -->
<!-- *** "feature flag": React / Web Components (experimental) -->

web-components/packages/carbon-web-components/.storybook/main.js

@@ -1,7 +1,7 @@
 /**
  * @license
  *
- * Copyright IBM Corp. 2020, 2022
+ * Copyright IBM Corp. 2020, 2023
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
@@ -171,9 +171,9 @@ module.exports = {
     if (!config.resolve.alias) {
       config.resolve.alias = {};
     }
-    // In our development environment (where `carbon-web-components/es/icons` may not have been built yet),
+    // In our development environment (where `@carbon/web-components/es/icons` may not have been built yet),
     // we load icons from `@carbon/icons` and use a WebPack loader to convert the icons to `lit-html` version
-    config.resolve.alias['carbon-web-components/es/icons'] =
+    config.resolve.alias['@carbon/web-components/es/icons'] =
       '@carbon/icons/lib';
 
     return config;

web-components/packages/carbon-web-components/README.md

@@ -23,13 +23,13 @@ with no framework tax, no framework silo.
   </a>
 </p>
 
-# `carbon-web-components`
+# `@carbon/web-components`
 
-`carbon-web-components` is a variant of Carbon Design System with Custom
+`@carbon/web-components` is a variant of Carbon Design System with Custom
 Elements v1 and Shadow DOM v1 specs.
 
-> The original `carbon-web-components` repository has been archived. All future
-> work for the package will take place in this monorepo. Please visit the
+> The original repository, `carbon-web-components`, has been archived. All
+> future work for the package will take place in this monorepo. Please visit the
 > [original repository](https://github.com/carbon-design-system/carbon-web-components)
 > for full history of the files.
 
@@ -294,7 +294,7 @@ import { AppComponent } from './app.component';
 export class AppModule {}
 ```
 
-The `.d.ts` files in `carbon-web-components` package are compiled with
+The `.d.ts` files in `@carbon/web-components` package are compiled with
 TypeScript 3.7. You can use TypeScript 3.7 in your Angular application with
 upcoming Angular `9.0` release, or with the following instructions, so your
 application can use those `.d.ts` files:
@@ -312,7 +312,7 @@ application can use those `.d.ts` files:
 [![Edit carbon-web-components with React](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/github/carbon-design-system/carbon-web-components/tree/main/examples/codesandbox/react)
 
 You can use wrapper React components in
-`carbon-web-components/es/components-react` generated
+`@carbon/web-components/es/components-react` generated
 [automatically from the custom elements](./src/globals/wrappers/createReactCustomElementType.ts)
 which allows you to use our components seamlessly in your React code. Here's an
 example:

web-components/packages/carbon-web-components/docs/form.md

@@ -33,12 +33,12 @@ You can use our form components with Redux Form by creating a React component th
 
 ```javascript
 import { Field } from 'redux-form';
-import BXFormItem from 'carbon-web-components/es/components-react/form/form-item';
-import BXInput from 'carbon-web-components/es/components-react/input/input';
+import BXFormItem from '@carbon/web-components/es/components-react/form/form-item';
+import BXInput from '@carbon/web-components/es/components-react/input/input';
 
 ...
 
-// A React component that wraps form components from `carbon-web-components`
+// A React component that wraps form components from `@carbon/web-components`
 const FieldImpl = ({ input, label, type, meta: { touched, error } }) => {
   const validityMessage = !touched ? undefined : error;
   return (

web-components/packages/carbon-web-components/docs/styling-story.mdx

@@ -92,7 +92,7 @@ You can create a derived class of our component and override [static `styles` pr
 
 ```javascript
 import { css, customElement } from 'lit-element';
-import BXDropdown from 'carbon-web-components/es/components/dropdown/dropdown';
+import BXDropdown from '@carbon/web-components/es/components/dropdown/dropdown';
 
 @customElement('my-dropdown')
 class MyDropdown extends BXDropdown {

web-components/packages/carbon-web-components/docs/styling.md

@@ -1,6 +1,6 @@
 # Using custom styles in components
 
-As Shadow DOM (one of the Web Components specs that `carbon-web-components` uses) promises, styles that `carbon-web-components` defines does not affect styles in your application, or vice versa.
+As Shadow DOM (one of the Web Components specs that `@carbon/web-components` uses) promises, styles that `@carbon/web-components` defines does not affect styles in your application, or vice versa.
 
 However, in cases where your application or a Carbon-derived style guide wants to change the styles of our components, there are a few options.
 
@@ -93,7 +93,7 @@ You can create a derived class of our component and override [static `styles` pr
 
 ```javascript
 import { css, customElement } from 'lit-element';
-import BXDropdown from 'carbon-web-components/es/components/dropdown/dropdown';
+import BXDropdown from '@carbon/web-components/es/components/dropdown/dropdown';
 
 @customElement('my-dropdown')
 class MyDropdown extends BXDropdown {

web-components/packages/carbon-web-components/docs/welcome-story.mdx

@@ -60,8 +60,8 @@ The first thing you need is **setting up a module bundler** to resolve ECMAScrip
 Once you set up a module bundler, you can start importing our component modules, for example:
 
 ```javascript
-import 'carbon-web-components/es/components/dropdown/dropdown';
-import 'carbon-web-components/es/components/dropdown/dropdown-item';
+import '@carbon/web-components/es/components/dropdown/dropdown';
+import '@carbon/web-components/es/components/dropdown/dropdown-item';
 ```
 
 Once you've imported the component modules, you can use our components in the same manner as native HTML tags, for example:

web-components/packages/carbon-web-components/src/components/button/button-story.ts

@@ -1,7 +1,7 @@
 /**
  * @license
  *
- * Copyright IBM Corp. 2019, 2022
+ * Copyright IBM Corp. 2019, 2023
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
@@ -10,10 +10,10 @@
 import { html } from 'lit-html';
 import { action } from '@storybook/addon-actions';
 import { boolean, select } from '@storybook/addon-knobs';
-// Below path will be there when an application installs `carbon-web-components` package.
+// Below path will be there when an application installs `@carbon/web-components` package.
 // In our dev env, we auto-generate the file and re-map below path to to point to the generated file.
 // @ts-ignore
-import Add16 from 'carbon-web-components/es/icons/add/16';
+import Add16 from '@carbon/web-components/es/icons/add/16';
 import ifNonNull from '../../globals/directives/if-non-null';
 import { BUTTON_KIND, BUTTON_SIZE, BUTTON_ICON_LAYOUT } from './button';
 import './button-skeleton';

web-components/packages/carbon-web-components/src/components/data-table/data-table-story.ts

@@ -1,7 +1,7 @@
 /**
  * @license
  *
- * Copyright IBM Corp. 2019, 2022
+ * Copyright IBM Corp. 2019, 2023
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
@@ -12,14 +12,14 @@ import { html, property, LitElement } from 'lit-element';
 import { repeat } from 'lit-html/directives/repeat';
 import { action } from '@storybook/addon-actions';
 import { boolean, select } from '@storybook/addon-knobs';
-// Below path will be there when an application installs `carbon-web-components` package.
+// Below path will be there when an application installs `@carbon/web-components` package.
 // In our dev env, we auto-generate the file and re-map below path to to point to the generated file.
 // @ts-ignore
-import Delete16 from 'carbon-web-components/es/icons/delete/16';
+import Delete16 from '@carbon/web-components/es/icons/delete/16';
 // @ts-ignore
-import Download16 from 'carbon-web-components/es/icons/download/16';
+import Download16 from '@carbon/web-components/es/icons/download/16';
 // @ts-ignore
-import Settings16 from 'carbon-web-components/es/icons/settings/16';
+import Settings16 from '@carbon/web-components/es/icons/settings/16';
 import BXBtn from '../button/button';
 import ifNonNull from '../../globals/directives/if-non-null';
 import '../overflow-menu/overflow-menu';
@@ -114,9 +114,9 @@ class BXCEDemoDataTable extends LitElement {
    * @param lhs A value.
    * @param rhs Another value.
    * @returns
-   *   * `0` if the given two values are equal
-   *   * A negative value to sort `lhs` to an index lower than `rhs`
-   *   * A positive value to sort `rhs` to an index lower than `lhs`
+   *   `0` if the given two values are equal
+   *   A negative value to sort `lhs` to an index lower than `rhs`
+   *   A positive value to sort `rhs` to an index lower than `lhs`
    */
   private _compare(lhs, rhs) {
     if (typeof lhs === 'number' && typeof rhs === 'number') {

web-components/packages/carbon-web-components/src/components/icon/icon-story.ts

@@ -1,24 +1,24 @@
 /**
  * @license
  *
- * Copyright IBM Corp. 2019, 2022
+ * Copyright IBM Corp. 2019, 2023
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
 
 import { html, svg } from 'lit-html';
 
-// Below path will be there when an application installs `carbon-web-components` package.
+// Below path will be there when an application installs `@carbon/web-components` package.
 // In our dev env, we auto-generate the file and re-map below path to to point to the generated file.
 // @ts-ignore
-import Add16 from 'carbon-web-components/es/icons/add/16';
+import Add16 from '@carbon/web-components/es/icons/add/16';
 // @ts-ignore
-import Add20 from 'carbon-web-components/es/icons/add/20';
+import Add20 from '@carbon/web-components/es/icons/add/20';
 // @ts-ignore
-import Add24 from 'carbon-web-components/es/icons/add/24';
+import Add24 from '@carbon/web-components/es/icons/add/24';
 // @ts-ignore
-import Add32 from 'carbon-web-components/es/icons/add/32';
+import Add32 from '@carbon/web-components/es/icons/add/32';
 
 import storyDocs from './icon-story.mdx';
 

web-components/packages/carbon-web-components/src/components/link/link-story.ts

@@ -1,7 +1,7 @@
 /**
  * @license
  *
- * Copyright IBM Corp. 2019, 2022
+ * Copyright IBM Corp. 2019, 2023
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
@@ -10,10 +10,10 @@
 import { html } from 'lit-element';
 import { action } from '@storybook/addon-actions';
 import { boolean, select } from '@storybook/addon-knobs';
-// Below path will be there when an application installs `carbon-web-components` package.
+// Below path will be there when an application installs `@carbon/web-components` package.
 // In our dev env, we auto-generate the file and re-map below path to to point to the generated file.
 // @ts-ignore
-import Download16 from 'carbon-web-components/es/icons/download/16';
+import Download16 from '@carbon/web-components/es/icons/download/16';
 import textNullable from '../../../.storybook/knob-text-nullable';
 import ifNonNull from '../../globals/directives/if-non-null';
 import { LINK_SIZE } from './link';

web-components/packages/carbon-web-components/src/components/tooltip/tooltip-story.ts

@@ -1,18 +1,18 @@
 /**
  * @license
  *
- * Copyright IBM Corp. 2019, 2022
+ * Copyright IBM Corp. 2019, 2023
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
 
 import { html } from 'lit-element';
 import { boolean, select } from '@storybook/addon-knobs';
-// Below path will be there when an application installs `carbon-web-components` package.
+// Below path will be there when an application installs `@carbon/web-components` package.
 // In our dev env, we auto-generate the file and re-map below path to to point to the generated file.
 // @ts-ignore
-import Filter16 from 'carbon-web-components/es/icons/filter/16';
+import Filter16 from '@carbon/web-components/es/icons/filter/16';
 import textNullable from '../../../.storybook/knob-text-nullable';
 import ifNonNull from '../../globals/directives/if-non-null';
 import '../button/button';

web-components/packages/carbon-web-components/src/components/ui-shell/ui-shell-story.ts

@@ -1,18 +1,18 @@
 /**
  * @license
  *
- * Copyright IBM Corp. 2019, 2022
+ * Copyright IBM Corp. 2019, 2023
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
 
 import { html } from 'lit-element';
 import { boolean, select } from '@storybook/addon-knobs';
-// Below path will be there when an application installs `carbon-web-components` package.
+// Below path will be there when an application installs `@carbon/web-components` package.
 // In our dev env, we auto-generate the file and re-map below path to to point to the generated file.
 // @ts-ignore
-import Fade16 from 'carbon-web-components/es/icons/fade/16';
+import Fade16 from '@carbon/web-components/es/icons/fade/16';
 import contentStyles from 'carbon-components/scss/components/ui-shell/_content.scss';
 import textNullable from '../../../.storybook/knob-text-nullable';
 import ifNonNull from '../../globals/directives/if-non-null';

web-components/packages/carbon-web-components/tests/karma.conf.js

@@ -1,7 +1,7 @@
 /**
  * @license
  *
- * Copyright IBM Corp. 2019, 2022
+ * Copyright IBM Corp. 2019, 2023
  *
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
@@ -68,9 +68,9 @@ module.exports = function setupKarma(config) {
       devtool: 'inline-source-maps',
       resolve: {
         alias: {
-          // In our development environment (where `carbon-web-components/es/icons` may not have been built yet),
+          // In our development environment (where `@carbon/web-components/es/icons` may not have been built yet),
           // we load icons from `@carbon/icons` and use a Webpack loader to convert the icons to `lit-html` version
-          'carbon-web-components/es/icons': '@carbon/icons/lib',
+          '@carbon/web-components/es/icons': '@carbon/icons/lib',
         },
         extensions: ['.js', '.ts'],
       },