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

package/package.json

@@ -1,8 +1,7 @@
 {
   "name": "@fluentui/web-components",
   "description": "A library of Fluent Web Components",
-  "sideEffects": false,
-  "version": "3.0.0-alpha.3",
+  "version": "3.0.0-alpha.31",
   "author": {
     "name": "Microsoft",
     "url": "https://discord.gg/FcSNfg4"
@@ -24,88 +23,176 @@
       "types": "./dist/dts/index.d.ts",
       "default": "./dist/esm/index.js"
     },
-    "./badge": {
+    "./accordion.js": {
+      "types": "./dist/esm/accordion/define.d.ts",
+      "default": "./dist/esm/accordion/define.js"
+    },
+    "./accordion-item.js": {
+      "types": "./dist/esm/accordion-item/define.d.ts",
+      "default": "./dist/esm/accordion-item/define.js"
+    },
+    "./anchor-button.js": {
+      "types": "./dist/esm/anchor-button/define.d.ts",
+      "default": "./dist/esm/anchor-button/define.js"
+    },
+    "./avatar.js": {
+      "types": "./dist/esm/avatar/define.d.ts",
+      "default": "./dist/esm/avatar/define.js"
+    },
+    "./badge.js": {
       "types": "./dist/esm/badge/define.d.ts",
       "default": "./dist/esm/badge/define.js"
     },
-    "./counter-badge": {
+    "./button.js": {
+      "types": "./dist/esm/button/define.d.ts",
+      "default": "./dist/esm/button/define.js"
+    },
+    "./checkbox.js": {
+      "types": "./dist/esm/checkbox/define.d.ts",
+      "default": "./dist/esm/checkbox/define.js"
+    },
+    "./compound-button.js": {
+      "types": "./dist/esm/compound-button/define.d.ts",
+      "default": "./dist/esm/compound-button/define.js"
+    },
+    "./counter-badge.js": {
       "types": "./dist/esm/counter-badge/define.d.ts",
       "default": "./dist/esm/counter-badge/define.js"
     },
-    "./text": {
-      "types": "./dist/esm/text/define.d.ts",
-      "default": "./dist/esm/text/define.js"
+    "./divider.js": {
+      "types": "./dist/esm/divider/define.d.ts",
+      "default": "./dist/esm/divider/define.js"
+    },
+    "./image.js": {
+      "types": "./dist/esm/image/define.d.ts",
+      "default": "./dist/esm/image/define.js"
+    },
+    "./label.js": {
+      "types": "./dist/esm/label/define.d.ts",
+      "default": "./dist/esm/label/define.js"
+    },
+    "./menu-list.js": {
+      "types": "./dist/esm/menu-list/define.d.ts",
+      "default": "./dist/esm/menu-list/define.js"
     },
-    "./progress-bar": {
+    "./menu-button.js": {
+      "types": "./dist/esm/menu-button/define.d.ts",
+      "default": "./dist/esm/menu-button/define.js"
+    },
+    "./menu-item.js": {
+      "types": "./dist/esm/menu-item/define.d.ts",
+      "default": "./dist/esm/menu-item/define.js"
+    },
+    "./progress-bar.js": {
       "types": "./dist/esm/progress-bar/define.d.ts",
       "default": "./dist/esm/progress-bar/define.js"
     },
-    "./spinner": {
+    "./radio.js": {
+      "types": "./dist/esm/radio/define.d.ts",
+      "default": "./dist/esm/radio/define.js"
+    },
+    "./radio-group.js": {
+      "types": "./dist/esm/radio-group/define.d.ts",
+      "default": "./dist/esm/radio-group/define.js"
+    },
+    "./slider.js": {
+      "types": "./dist/esm/slider/define.d.ts",
+      "default": "./dist/esm/slider/define.js"
+    },
+    "./spinner.js": {
       "types": "./dist/esm/spinner/define.d.ts",
       "default": "./dist/esm/spinner/define.js"
+    },
+    "./switch.js": {
+      "types": "./dist/esm/switch/define.d.ts",
+      "default": "./dist/esm/switch/define.js"
+    },
+    "./tab.js": {
+      "types": "./dist/esm/tab/define.d.ts",
+      "default": "./dist/esm/tab/define.js"
+    },
+    "./tabs.js": {
+      "types": "./dist/esm/tabs/define.d.ts",
+      "default": "./dist/esm/tabs/define.js"
+    },
+    "./tab-panel.js": {
+      "types": "./dist/esm/tab-panel/define.d.ts",
+      "default": "./dist/esm/tab-panel/define.js"
+    },
+    "./text.js": {
+      "types": "./dist/esm/text/define.d.ts",
+      "default": "./dist/esm/text/define.js"
+    },
+    "./text-input.js": {
+      "types": "./dist/esm/text-input/define.d.ts",
+      "default": "./dist/esm/text-input/define.js"
+    },
+    "./toggle-button.js": {
+      "types": "./dist/esm/toggle-button/define.d.ts",
+      "default": "./dist/esm/toggle-button/define.js"
+    },
+    "./theme.js": {
+      "types": "./dist/esm/theme/index.d.ts",
+      "default": "./dist/esm/theme/index.js"
     }
   },
+  "sideEffects": [
+    "./dist/esm/accordion/define.js",
+    "./dist/esm/accordion-item/define.js",
+    "./dist/esm/anchor-button/define.js",
+    "./dist/esm/avatar/define.js",
+    "./dist/esm/badge/define.js",
+    "./dist/esm/button/define.js",
+    "./dist/esm/checkbox/define.js",
+    "./dist/esm/compound-button/define.js",
+    "./dist/esm/counter-badge/define.js",
+    "./dist/esm/divider/define.js",
+    "./dist/esm/image/define.js",
+    "./dist/esm/label/define.js",
+    "./dist/esm/menu-list/define.js",
+    "./dist/esm/menu-button/define.js",
+    "./dist/esm/menu-item/define.js",
+    "./dist/esm/progress-bar/define.js",
+    "./dist/esm/radio/define.js",
+    "./dist/esm/radio-group/define.js",
+    "./dist/esm/slider/define.js",
+    "./dist/esm/spinner/define.js",
+    "./dist/esm/switch/define.js",
+    "./dist/esm/tab/define.js",
+    "./dist/esm/tabs/define.js",
+    "./dist/esm/tab-panel/define.js",
+    "./dist/esm/text/define.js",
+    "./dist/esm/text-input/define.js",
+    "./dist/esm/toggle-button/define.js"
+  ],
   "scripts": {
     "tsc": "tsc",
     "api-extractor": "api-extractor",
-    "clean": "node ./build/clean.cjs dist",
-    "doc": "api-extractor run --local",
-    "doc:ci": "yarn doc",
-    "build": "tsc -p ./tsconfig.json && rollup -c && yarn doc",
-    "dev": "tsc -p ./tsconfig.json -w",
-    "tdd": "yarn dev & yarn test-chrome:watch",
-    "prepare": "yarn clean && yarn build",
+    "compile": "node ./scripts/compile",
+    "clean": "node ./scripts/clean dist",
+    "generate-api": "api-extractor run --local",
+    "build": "yarn compile && rollup -c && yarn generate-api",
     "lint": "eslint . --ext .ts",
     "lint:fix": "eslint . --ext .ts --fix",
     "format": "prettier -w 'src/**/(*.ts|*.html)' --ignore-path ../../.prettierignore",
     "format:check": "yarn format -c",
     "code-style": "yarn format:check && yarn lint",
-    "start": "yarn start-storybook -p 6006 --docs",
+    "start": "yarn start-storybook -p 6006 --docs --no-manager-cache",
     "start-storybook": "node node_modules/@storybook/html/bin/index",
     "build-storybook": "node node_modules/@storybook/html/bin/build -o ./dist/storybook --docs",
-    "test": "yarn doc:ci && yarn test-chrome:verbose",
-    "test-node": "mocha --reporter min --exit dist/esm/__test__/setup-node.js './dist/esm/**/*.spec.js'",
-    "test-node:verbose": "mocha --reporter spec --exit dist/esm/__test__/setup-node.js './dist/esm/**/*.spec.js'",
-    "test-chrome": "karma start karma.conf.cjs --browsers=ChromeHeadlessOpt --single-run --coverage",
-    "test-chrome:verbose": "karma start karma.conf.cjs --no-fail-on-empty-test-suite --browsers=ChromeHeadlessOpt --single-run --coverage --reporter=mocha",
-    "test-chrome:watch": "karma start karma.conf.cjs --browsers=ChromeHeadlessOpt --coverage --watch-extensions js",
-    "test-chrome:debugger": "karma start karma.conf.cjs --browsers=ChromeDebugging",
-    "test-chrome:verbose:watch": "karma start karma.conf.cjs --browsers=ChromeHeadlessOpt --coverage --watch-extensions js --reporter=mocha ",
-    "test-chrome:verbose:debugger": "karma start karma.conf.cjs --browsers=ChromeDebugging --reporter=mocha",
-    "test-firefox": "karma start karma.conf.cjs --browsers=FirefoxHeadless --single-run --coverage",
-    "test-firefox:verbose": "karma start karma.conf.cjs --browsers=FirefoxHeadless --single-run --coverage --reporter=mocha"
+    "pretest": "yarn build-storybook --quiet",
+    "test": "npx playwright test",
+    "test:dev": "playwright test"
   },
   "devDependencies": {
-    "@storybook/html": "6.5.15",
-    "@types/chai": "4.3.3",
-    "@types/chai-spies": "1.0.3",
-    "@types/karma": "6.3.3",
-    "@types/mocha": "7.0.2",
-    "chai": "4.3.6",
-    "chai-spies": "1.0.0",
-    "esm": "3.2.25",
-    "ignore-loader": "0.1.2",
-    "istanbul": "0.4.5",
-    "istanbul-instrumenter-loader": "3.0.1",
-    "jsdom-global": "3.0.2",
-    "karma": "6.4.0",
-    "karma-chrome-launcher": "3.1.1",
-    "karma-coverage": "2.2.0",
-    "karma-coverage-istanbul-reporter": "3.0.3",
-    "karma-firefox-launcher": "^1.3.0",
-    "karma-mocha": "2.0.1",
-    "karma-mocha-reporter": "2.2.5",
-    "karma-source-map-support": "1.4.0",
-    "karma-sourcemap-loader": "0.3.8",
-    "karma-webpack": "5.0.0",
-    "mocha": "7.2.0",
     "@microsoft/api-extractor": "7.31.2",
+    "@storybook/html": "6.5.15",
     "rimraf": "^3.0.2",
     "typescript": "4.7.4"
   },
   "dependencies": {
-    "@microsoft/fast-element": "^2.0.0-beta.21",
-    "@microsoft/fast-foundation": "^3.0.0-alpha.25",
+    "@microsoft/fast-element": "2.0.0-beta.26",
+    "@microsoft/fast-foundation": "3.0.0-alpha.31",
     "@microsoft/fast-web-utilities": "^6.0.0",
     "@fluentui/tokens": "1.0.0-alpha.2",
     "tslib": "^2.1.0"

package/playwright.config.ts

@@ -0,0 +1,25 @@
+import type { PlaywrightTestConfig } from '@playwright/test';
+
+const config: PlaywrightTestConfig = {
+  projects: [{ name: 'chromium' }, { name: 'firefox' }, { name: 'webkit' }],
+  reporter: 'list',
+  testMatch: /.*\.spec\.ts$/,
+  retries: 3,
+  fullyParallel: process.env.CI ? false : true,
+  timeout: process.env.CI ? 10000 : 30000,
+  use: {
+    baseURL: 'http://localhost:6006/iframe.html',
+    viewport: {
+      height: 1280,
+      width: 720,
+    },
+  },
+  webServer: {
+    // double-quotes are required for Windows
+    command: `node -e "import('express').then(({ default: e }) => e().use(e.static('./dist/storybook')).listen(6006))"`,
+    port: 6006,
+    reuseExistingServer: process.env.CI ? false : true,
+  },
+};
+
+export default config;

package/.eslintrc.json

@@ -1,62 +0,0 @@
-{
-  "root": true,
-  "parser": "@typescript-eslint/parser",
-  "plugins": ["@typescript-eslint", "import"],
-  "extends": [
-    "eslint:recommended",
-    "plugin:@typescript-eslint/eslint-recommended",
-    "plugin:@typescript-eslint/recommended",
-    "prettier"
-  ],
-  "settings": {
-    "react": {
-      "version": "latest"
-    }
-  },
-  "rules": {
-    "no-extra-boolean-cast": "off",
-    "no-prototype-builtins": "off",
-    "no-fallthrough": "off",
-    "no-unexpected-multiline": "off",
-    "import/order": "error",
-    "sort-imports": [
-      "error",
-      {
-        "ignoreCase": true,
-        "ignoreDeclarationSort": true
-      }
-    ],
-    "comma-dangle": "off",
-    "@typescript-eslint/no-non-null-assertion": "off",
-    "@typescript-eslint/no-use-before-define": "off",
-    "@typescript-eslint/explicit-module-boundary-types": "off",
-    "@typescript-eslint/explicit-function-return-type": "off",
-    "@typescript-eslint/camelcase": "off",
-    "@typescript-eslint/no-inferrable-types": "off",
-    "@typescript-eslint/no-unused-vars": [
-      "warn",
-      {
-        "args": "none"
-      }
-    ],
-    "@typescript-eslint/no-explicit-any": "off",
-    "@typescript-eslint/naming-convention": [
-      "error",
-      {
-        "selector": "default",
-        "format": ["UPPER_CASE", "camelCase", "PascalCase"],
-        "leadingUnderscore": "allow"
-      },
-      {
-        "selector": "property",
-        "format": null // disable for property names because of our foo__expanded convention for JSS
-        // TODO: I think we can come up with a regex that ignores variables with __ in them
-      },
-      {
-        "selector": "variable",
-        "format": null // disable for variable names because of our foo__expanded convention for JSS
-        // TODO: I think we can come up with a regex that ignores variables with __ in them
-      }
-    ]
-  }
-}