@fluentui/web-components 3.0.0-alpha.3 → 3.0.0-alpha.5

package/dist/esm/text/text.stories.js

@@ -1,111 +0,0 @@
-import { html } from '@microsoft/fast-element';
-import { renderComponent } from '../__test__/helpers.js';
-import './define.js';
-import { TextAlign, TextFont, TextSize, TextWeight } from './text.options.js';
-/**
- * Used to generate slotted content for stories
- * @param as - the element to generate
- * @param content - the content for the element
- * @returns ViewTemplate
- */
-const generateSemanticElementTemplate = (as, content) => {
-    switch (as) {
-        case 'h1':
-            return html `<h1>${content}</h1>`;
-        case 'h2':
-            return html `<h2>${content}</h2>`;
-        case 'h3':
-            return html `<h3>${content}</h3>`;
-        case 'h4':
-            return html `<h4>${content}</h4>`;
-        case 'h5':
-            return html `<h5>${content}</h5>`;
-        case 'h6':
-            return html `<h6>${content}</h6>`;
-        case 'p':
-            return html `<p>${content}</p>`;
-        case 'pre':
-            return html `<pre>${content}</pre>`;
-        case 'span':
-        default:
-            return html `<span>${content}</span>`;
-    }
-};
-const storyTemplate = html `
-  <fluent-text
-    align=${x => x.align}
-    font=${x => x.font}
-    size=${x => x.size}
-    weight=${x => x.weight}
-    ?nowrap=${x => x.nowrap}
-    ?truncate=${x => x.truncate}
-    ?italic=${x => x.italic}
-    ?underline=${x => x.underline}
-    ?strikethrough=${x => x.strikethrough}
-    ?block=${x => x.block}
-    >${x => generateSemanticElementTemplate(x.as, x.content)}</fluent-text
-  >
-`;
-export default {
-    title: 'Components/Text',
-    args: {
-        content: 'Text',
-        nowrap: false,
-        truncate: false,
-        italic: false,
-        underline: false,
-        strikethrough: false,
-        block: false,
-    },
-    argTypes: {
-        as: {
-            options: ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'p', 'pre', 'span'],
-            control: {
-                type: 'select',
-            },
-        },
-        size: {
-            options: Object.values(TextSize),
-            control: {
-                type: 'select',
-            },
-        },
-        weight: {
-            options: Object.keys(TextWeight),
-            control: {
-                type: 'select',
-            },
-        },
-        align: {
-            options: Object.keys(TextAlign),
-            control: {
-                type: 'select',
-            },
-        },
-        font: {
-            options: Object.keys(TextFont),
-            control: {
-                type: 'select',
-            },
-        },
-        nowrap: {
-            control: 'boolean',
-        },
-        truncate: {
-            control: 'boolean',
-        },
-        italic: {
-            control: 'boolean',
-        },
-        underline: {
-            control: 'boolean',
-        },
-        strikethrough: {
-            control: 'boolean',
-        },
-        block: {
-            control: 'boolean',
-        },
-    },
-};
-export const Text = renderComponent(storyTemplate).bind({});

package/dist/esm/theme/theme.stories.js

@@ -1,21 +0,0 @@
-import { DesignToken } from '@microsoft/fast-foundation';
-import * as tokens from '../theme/design-tokens.js';
-DesignToken.registerDefaultStyleTarget();
-export default {
-    title: 'Theme/Tokens',
-};
-export const Tokens = () => `
-<div>
-  <h3>Theme Tokens</h3>
-  <p>Debug story which uses theme tokens to style the element below.</p>
-  <div style="
-    font-family: ${tokens.fontFamilyBase.createCSS()};
-    font-size: ${tokens.fontSizeBase300.createCSS()};
-    background: var(${tokens.colorBrandBackground.cssCustomProperty});
-    color: ${tokens.colorNeutralForegroundOnBrand.createCSS()};
-    border: ${tokens.strokeWidthThicker.createCSS()} solid ${tokens.colorNeutralStroke1.createCSS()};
-    padding: ${tokens.spacingVerticalS.createCSS()} ${tokens.spacingHorizontalM.createCSS()};
-    box-shadow: ${tokens.shadow28.createCSS()};
-  ">colorNeutralForegroundOnBrand on colorBrandBackground with shadow28</div>
-</div>
-`;

package/public/theme-switch.ts

@@ -1,13 +0,0 @@
-import { teamsDarkTheme, teamsLightTheme, webDarkTheme, webLightTheme } from '@fluentui/tokens';
-import { setTheme } from '../src/theme';
-
-const themes = {
-  'web-light': webLightTheme,
-  'web-dark': webDarkTheme,
-  'teams-light': teamsLightTheme,
-  'teams-dark': teamsDarkTheme,
-};
-
-export function switchTheme(themeName: keyof typeof themes) {
-  setTheme(themes[themeName]);
-}

package/rollup.config.js

@@ -1,58 +0,0 @@
-import commonJS from 'rollup-plugin-commonjs';
-import filesize from 'rollup-plugin-filesize';
-import resolve from 'rollup-plugin-node-resolve';
-import { terser } from 'rollup-plugin-terser';
-import transformTaggedTemplate from 'rollup-plugin-transform-tagged-template';
-import typescript from 'rollup-plugin-typescript2';
-import { transformCSSFragment, transformHTMLFragment } from './build/transform-fragments';
-
-// eslint-disable-next-line no-undef
-const tsBin = require.resolve('typescript');
-
-const parserOptions = {
-  sourceType: 'module',
-};
-
-export default [
-  {
-    input: 'src/index-rollup.ts',
-    output: [
-      {
-        file: 'dist/web-components.js',
-        format: 'esm',
-      },
-      {
-        file: 'dist/web-components.min.js',
-        format: 'esm',
-        plugins: [terser()],
-      },
-    ],
-    plugins: [
-      resolve(),
-      commonJS(),
-      typescript({
-        // eslint-disable-next-line no-undef
-        typescript: require(tsBin),
-        tsconfigOverride: {
-          compilerOptions: {
-            declaration: false,
-          },
-        },
-      }),
-      transformTaggedTemplate({
-        tagsToProcess: ['css'],
-        transformer: transformCSSFragment,
-        parserOptions,
-      }),
-      transformTaggedTemplate({
-        tagsToProcess: ['html'],
-        transformer: transformHTMLFragment,
-        parserOptions,
-      }),
-      filesize({
-        showMinifiedSize: false,
-        showBrotliSize: true,
-      }),
-    ],
-  },
-];

package/storybook-typings.d.ts

@@ -1,4 +0,0 @@
-declare module '*.html' {
-  const value: string;
-  export default value;
-}