@carbon/ibm-products-web-components 0.3.0 → 0.4.0-rc.0

package/src/globals/internal/storybook-cdn.ts

@@ -0,0 +1,69 @@
+/**
+ * @license
+ *
+ * Copyright IBM Corp. 2021, 2024
+ *
+ * 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 packageJson from '../../../package.json';
+
+/* eslint-disable max-len */
+
+/**
+ *
+ */
+/**
+ * Renders the component(s) script tag content and returns back the string
+ *
+ * @param {Array} components array of component names
+ * @param {string} tag tag folder
+ */
+function _renderScript(components, tag) {
+  let scripts = '';
+  components.forEach((component) => {
+    scripts += `<script type="module" src="https://1.www.s81c.com/common/carbon/web-components/${tag}/${component}.min.js"></script>\n`;
+  });
+  return scripts;
+}
+
+/**
+ * This is the markdown block for JS via CDN
+ *
+ * @param {Array} components array of components to render
+ * @param components.components components to render
+ */
+export const cdnJs = ({ components }) => {
+  return `
+### JS (via CDN)
+
+ > NOTE: Only one version of artifacts should be used. Mixing versions will cause rendering issues.
+
+ \`\`\`html
+ // SPECIFIC VERSION (available starting v2.0.0)
+ ${_renderScript(components, `version/v${packageJson.version}`)}
+ \`\`\`
+
+ #### Right-to-left (RTL) versions
+
+ \`\`\`html
+ // SPECIFIC VERSION (available starting v2.0.0)
+ ${_renderScript(components, `version/v${packageJson.version}`)}
+ \`\`\`
+   `;
+};
+
+/**
+ * This is the markdown block for CSS via CDN
+ */
+export const cdnCss = () => {
+  return `
+### Carbon CDN style helpers (optional)
+
+There are optional CDN artifacts available that can assist with global Carbon
+styles in lieu of including into your specific application bundle.
+
+[Click here to learn more](https://github.com/carbon-design-system/carbon-for-ibm-dotcom/blob/main/packages/web-components/docs/carbon-cdn-style-helpers.md)\n\n
+  `;
+};

package/tasks/build.js

@@ -22,6 +22,7 @@ import nodeResolve from '@rollup/plugin-node-resolve';
 import path from 'path';
 import postcss from 'postcss';
 import typescript from '@rollup/plugin-typescript';
+import json from '@rollup/plugin-json';
 
 import * as packageJson from '../package.json' assert { type: 'json' };
 
@@ -125,6 +126,7 @@ function getRollupConfig(input, rootDir, outDir, iconInput) {
         targets: [{ src: 'src/components/**/*.scss', dest: 'scss' }],
         flatten: false,
       }),
+      [json()],
       nodeResolve({
         browser: true,
         mainFields: ['jsnext', 'module', 'main'],