@ni/nimble-components 1.0.0-beta.99 → 1.0.0

package/dist/tokens-internal.scss

@@ -0,0 +1,255 @@
+// Nimble Components Internal Tokens SCSS
+// Used by Nimble Components Tokens SCSS
+// For more information see https://github.com/ni/nimble/tree/main/packages/nimble-components#theming
+
+/// Internal property for $ni-nimble-action-color-rgb-partial.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-action-color-rgb-partial}: <new value>;`.
+$ni-nimble-internal-action-color-rgb-partial: --ni-nimble-action-color-rgb-partial;
+
+/// Internal property for $ni-nimble-application-background-color.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-application-background-color}: <new value>;`.
+$ni-nimble-internal-application-background-color: --ni-nimble-application-background-color;
+
+/// Internal property for $ni-nimble-fill-color-selected.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-fill-color-selected}: <new value>;`.
+$ni-nimble-internal-fill-color-selected: --ni-nimble-fill-color-selected;
+
+/// Internal property for $ni-nimble-fill-color-selected-rgb-partial.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-fill-color-selected-rgb-partial}: <new value>;`.
+$ni-nimble-internal-fill-color-selected-rgb-partial: --ni-nimble-fill-color-selected-rgb-partial;
+
+/// Internal property for $ni-nimble-fill-color-selected-hover.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-fill-color-selected-hover}: <new value>;`.
+$ni-nimble-internal-fill-color-selected-hover: --ni-nimble-fill-color-selected-hover;
+
+/// Internal property for $ni-nimble-fill-color-hover.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-fill-color-hover}: <new value>;`.
+$ni-nimble-internal-fill-color-hover: --ni-nimble-fill-color-hover;
+
+/// Internal property for $ni-nimble-border-color.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-border-color}: <new value>;`.
+$ni-nimble-internal-border-color: --ni-nimble-border-color;
+
+/// Internal property for $ni-nimble-border-color-rgb-partial.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-border-color-rgb-partial}: <new value>;`.
+$ni-nimble-internal-border-color-rgb-partial: --ni-nimble-border-color-rgb-partial;
+
+/// Internal property for $ni-nimble-fail-color.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-fail-color}: <new value>;`.
+$ni-nimble-internal-fail-color: --ni-nimble-fail-color;
+
+/// Internal property for $ni-nimble-warning-color.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-warning-color}: <new value>;`.
+$ni-nimble-internal-warning-color: --ni-nimble-warning-color;
+
+/// Internal property for $ni-nimble-pass-color.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-pass-color}: <new value>;`.
+$ni-nimble-internal-pass-color: --ni-nimble-pass-color;
+
+/// Internal property for $ni-nimble-border-color-hover.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-border-color-hover}: <new value>;`.
+$ni-nimble-internal-border-color-hover: --ni-nimble-border-color-hover;
+
+/// Internal property for $ni-nimble-icon-color.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-icon-color}: <new value>;`.
+$ni-nimble-internal-icon-color: --ni-nimble-icon-color;
+
+/// Internal property for $ni-nimble-popup-box-shadow-color.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-popup-box-shadow-color}: <new value>;`.
+$ni-nimble-internal-popup-box-shadow-color: --ni-nimble-popup-box-shadow-color;
+
+/// Internal property for $ni-nimble-popup-border-color.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-popup-border-color}: <new value>;`.
+$ni-nimble-internal-popup-border-color: --ni-nimble-popup-border-color;
+
+/// Internal property for $ni-nimble-control-height.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-control-height}: <new value>;`.
+$ni-nimble-internal-control-height: --ni-nimble-control-height;
+
+/// Internal property for $ni-nimble-standard-padding.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-standard-padding}: <new value>;`.
+$ni-nimble-internal-standard-padding: --ni-nimble-standard-padding;
+
+/// Internal property for $ni-nimble-label-height.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-label-height}: <new value>;`.
+$ni-nimble-internal-label-height: --ni-nimble-label-height;
+
+/// Internal property for $ni-nimble-border-width.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-border-width}: <new value>;`.
+$ni-nimble-internal-border-width: --ni-nimble-border-width;
+
+/// Internal property for $ni-nimble-icon-size.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-icon-size}: <new value>;`.
+$ni-nimble-internal-icon-size: --ni-nimble-icon-size;
+
+/// Internal property for $ni-nimble-drawer-width.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-drawer-width}: <new value>;`.
+$ni-nimble-internal-drawer-width: --ni-nimble-drawer-width;
+
+/// Internal property for $ni-nimble-font-family.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-font-family}: <new value>;`.
+$ni-nimble-internal-font-family: --ni-nimble-font-family;
+
+/// Internal property for $ni-nimble-label-font-family.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-label-font-family}: <new value>;`.
+$ni-nimble-internal-label-font-family: --ni-nimble-label-font-family;
+
+/// Internal property for $ni-nimble-group-label-font-family.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-group-label-font-family}: <new value>;`.
+$ni-nimble-internal-group-label-font-family: --ni-nimble-group-label-font-family;
+
+/// Internal property for $ni-nimble-drawer-header-font-family.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-drawer-header-font-family}: <new value>;`.
+$ni-nimble-internal-drawer-header-font-family: --ni-nimble-drawer-header-font-family;
+
+/// Internal property for $ni-nimble-label-font-size.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-label-font-size}: <new value>;`.
+$ni-nimble-internal-label-font-size: --ni-nimble-label-font-size;
+
+/// Internal property for $ni-nimble-content-font-size.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-content-font-size}: <new value>;`.
+$ni-nimble-internal-content-font-size: --ni-nimble-content-font-size;
+
+/// Internal property for $ni-nimble-group-label-font-size.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-group-label-font-size}: <new value>;`.
+$ni-nimble-internal-group-label-font-size: --ni-nimble-group-label-font-size;
+
+/// Internal property for $ni-nimble-drawer-header-font-size.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-drawer-header-font-size}: <new value>;`.
+$ni-nimble-internal-drawer-header-font-size: --ni-nimble-drawer-header-font-size;
+
+/// Internal property for $ni-nimble-group-label-font-weight.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-group-label-font-weight}: <new value>;`.
+$ni-nimble-internal-group-label-font-weight: --ni-nimble-group-label-font-weight;
+
+/// Internal property for $ni-nimble-label-font-weight.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-label-font-weight}: <new value>;`.
+$ni-nimble-internal-label-font-weight: --ni-nimble-label-font-weight;
+
+/// Internal property for $ni-nimble-label-font-color.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-label-font-color}: <new value>;`.
+$ni-nimble-internal-label-font-color: --ni-nimble-label-font-color;
+
+/// Internal property for $ni-nimble-group-label-font-color.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-group-label-font-color}: <new value>;`.
+$ni-nimble-internal-group-label-font-color: --ni-nimble-group-label-font-color;
+
+/// Internal property for $ni-nimble-content-font-color.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-content-font-color}: <new value>;`.
+$ni-nimble-internal-content-font-color: --ni-nimble-content-font-color;
+
+/// Internal property for $ni-nimble-button-content-font-color.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-button-content-font-color}: <new value>;`.
+$ni-nimble-internal-button-content-font-color: --ni-nimble-button-content-font-color;
+
+/// Internal property for $ni-nimble-label-font-color-disabled.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-label-font-color-disabled}: <new value>;`.
+$ni-nimble-internal-label-font-color-disabled: --ni-nimble-label-font-color-disabled;
+
+/// Internal property for $ni-nimble-label-text-transform.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-label-text-transform}: <new value>;`.
+$ni-nimble-internal-label-text-transform: --ni-nimble-label-text-transform;
+
+/// Internal property for $ni-nimble-group-label-text-transform.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-group-label-text-transform}: <new value>;`.
+$ni-nimble-internal-group-label-text-transform: --ni-nimble-group-label-text-transform;
+
+/// Internal property for $ni-nimble-content-font-color-disabled.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-content-font-color-disabled}: <new value>;`.
+$ni-nimble-internal-content-font-color-disabled: --ni-nimble-content-font-color-disabled;
+
+/// Internal property for $ni-nimble-small-delay.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-small-delay}: <new value>;`.
+$ni-nimble-internal-small-delay: --ni-nimble-small-delay;
+
+/// Internal property for $ni-nimble-medium-delay.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-medium-delay}: <new value>;`.
+$ni-nimble-internal-medium-delay: --ni-nimble-medium-delay;
+
+/// Internal property for $ni-nimble-drawer-animation-duration-ms.
+/// Not intended for general use. If used, inform Nimble squad of use-case.
+/// Used to override a token value (generally making it no longer theme-aware).
+/// Requires SCSS interpolation to set, ie `#{$ni-nimble-internal-drawer-animation-duration-ms}: <new value>;`.
+$ni-nimble-internal-drawer-animation-duration-ms: --ni-nimble-drawer-animation-duration-ms;

package/dist/tokens.scss

@@ -0,0 +1,132 @@
+// Nimble Components Tokens SCSS
+// Used to integrate theme-aware design tokens in an application.
+// Requires using a <nimble-theme-provider> in the page.
+// For more information see https://github.com/ni/nimble/tree/main/packages/nimble-components#theming
+
+@import './tokens-internal';
+
+
+$ni-nimble-action-color-rgb-partial: var($ni-nimble-internal-action-color-rgb-partial);
+
+/// Background color for the application.
+$ni-nimble-application-background-color: var($ni-nimble-internal-application-background-color);
+
+
+$ni-nimble-fill-color-selected: var($ni-nimble-internal-fill-color-selected);
+
+
+$ni-nimble-fill-color-selected-rgb-partial: var($ni-nimble-internal-fill-color-selected-rgb-partial);
+
+
+$ni-nimble-fill-color-selected-hover: var($ni-nimble-internal-fill-color-selected-hover);
+
+
+$ni-nimble-fill-color-hover: var($ni-nimble-internal-fill-color-hover);
+
+
+$ni-nimble-border-color: var($ni-nimble-internal-border-color);
+
+
+$ni-nimble-border-color-rgb-partial: var($ni-nimble-internal-border-color-rgb-partial);
+
+
+$ni-nimble-fail-color: var($ni-nimble-internal-fail-color);
+
+
+$ni-nimble-warning-color: var($ni-nimble-internal-warning-color);
+
+
+$ni-nimble-pass-color: var($ni-nimble-internal-pass-color);
+
+
+$ni-nimble-border-color-hover: var($ni-nimble-internal-border-color-hover);
+
+
+$ni-nimble-icon-color: var($ni-nimble-internal-icon-color);
+
+
+$ni-nimble-popup-box-shadow-color: var($ni-nimble-internal-popup-box-shadow-color);
+
+
+$ni-nimble-popup-border-color: var($ni-nimble-internal-popup-border-color);
+
+
+$ni-nimble-control-height: var($ni-nimble-internal-control-height);
+
+
+$ni-nimble-standard-padding: var($ni-nimble-internal-standard-padding);
+
+
+$ni-nimble-label-height: var($ni-nimble-internal-label-height);
+
+
+$ni-nimble-border-width: var($ni-nimble-internal-border-width);
+
+
+$ni-nimble-icon-size: var($ni-nimble-internal-icon-size);
+
+
+$ni-nimble-drawer-width: var($ni-nimble-internal-drawer-width);
+
+
+$ni-nimble-font-family: var($ni-nimble-internal-font-family);
+
+
+$ni-nimble-label-font-family: var($ni-nimble-internal-label-font-family);
+
+
+$ni-nimble-group-label-font-family: var($ni-nimble-internal-group-label-font-family);
+
+
+$ni-nimble-drawer-header-font-family: var($ni-nimble-internal-drawer-header-font-family);
+
+
+$ni-nimble-label-font-size: var($ni-nimble-internal-label-font-size);
+
+
+$ni-nimble-content-font-size: var($ni-nimble-internal-content-font-size);
+
+
+$ni-nimble-group-label-font-size: var($ni-nimble-internal-group-label-font-size);
+
+
+$ni-nimble-drawer-header-font-size: var($ni-nimble-internal-drawer-header-font-size);
+
+
+$ni-nimble-group-label-font-weight: var($ni-nimble-internal-group-label-font-weight);
+
+
+$ni-nimble-label-font-weight: var($ni-nimble-internal-label-font-weight);
+
+
+$ni-nimble-label-font-color: var($ni-nimble-internal-label-font-color);
+
+
+$ni-nimble-group-label-font-color: var($ni-nimble-internal-group-label-font-color);
+
+
+$ni-nimble-content-font-color: var($ni-nimble-internal-content-font-color);
+
+
+$ni-nimble-button-content-font-color: var($ni-nimble-internal-button-content-font-color);
+
+
+$ni-nimble-label-font-color-disabled: var($ni-nimble-internal-label-font-color-disabled);
+
+
+$ni-nimble-label-text-transform: var($ni-nimble-internal-label-text-transform);
+
+
+$ni-nimble-group-label-text-transform: var($ni-nimble-internal-group-label-text-transform);
+
+
+$ni-nimble-content-font-color-disabled: var($ni-nimble-internal-content-font-color-disabled);
+
+
+$ni-nimble-small-delay: var($ni-nimble-internal-small-delay);
+
+
+$ni-nimble-medium-delay: var($ni-nimble-internal-medium-delay);
+
+
+$ni-nimble-drawer-animation-duration-ms: var($ni-nimble-internal-drawer-animation-duration-ms);

package/package.json

@@ -1,9 +1,9 @@
 {
   "name": "@ni/nimble-components",
-  "version": "1.0.0-beta.99",
+  "version": "1.0.0",
   "description": "Styled web components for the NI Nimble Design System",
   "scripts": {
-    "build": "npm run build-components && npm run build-storybook",
+    "build": "npm run build-components && npm run generate-scss && npm run build-storybook",
     "lint": "npm run eslint && npm run prettier",
     "format": "npm run eslint-fix && npm run prettier-fix",
     "eslint": "eslint .",
@@ -11,10 +11,14 @@
     "prettier": "prettier-eslint \"**/*.*\" --list-different --prettier-ignore",
     "prettier-fix": "prettier-eslint \"**/*.*\" --write --prettier-ignore",
     "pack": "npm pack",
+    "invoke-publish": "npm publish",
     "storybook": "start-storybook -p 6006",
     "build-storybook": "build-storybook -o dist/storybook",
     "build-components": "tsc -p ./tsconfig.json",
     "build-components:watch": "tsc -p ./tsconfig.json -w",
+    "generate-scss": "npm run generate-scss:bundle && npm run generate-scss:run",
+    "generate-scss:bundle": "rollup build/generate-scss/source/index.js --format cjs --file build/generate-scss/dist/index.js",
+    "generate-scss:run": "node build/generate-scss/dist/index.js",
     "chromatic": "chromatic",
     "tdd": "npm run build-components && npm run test-chrome",
     "tdd:watch": "npm run build-components:watch & npm run test-chrome:watch",
@@ -39,28 +43,31 @@
   "homepage": "https://github.com/ni/nimble#readme",
   "dependencies": {
     "@microsoft/fast-animation": "^4.1.5",
-    "@microsoft/fast-components": "^2.0.0",
     "@microsoft/fast-element": "^1.6.1",
     "@microsoft/fast-foundation": "^2.22.0",
-    "@ni/nimble-tokens": "^1.0.0-beta.29",
-    "hex-rgb": "^5.0.0",
-    "lodash-es": "^4.17.21"
+    "@microsoft/fast-web-utilities": "^5.0.2",
+    "@ni/nimble-tokens": "^1.0.0",
+    "hex-rgb": "^5.0.0"
   },
   "devDependencies": {
     "@babel/cli": "^7.13.16",
     "@babel/core": "^7.14.6",
     "@babel/preset-env": "^7.13.15",
-    "@ni/eslint-config-typescript": "^3.0.0",
-    "@storybook/addon-a11y": "^6.4.0-alpha.28",
-    "@storybook/addon-actions": "^6.4.0-alpha.28",
-    "@storybook/addon-docs": "^6.4.0-alpha.28",
-    "@storybook/addon-essentials": "^6.4.0-alpha.28",
-    "@storybook/addon-links": "^6.4.0-alpha.28",
-    "@storybook/addons": "^6.4.0-alpha.28",
-    "@storybook/builder-webpack5": "^6.4.0-alpha.28",
-    "@storybook/html": "^6.4.0-alpha.28",
-    "@storybook/manager-webpack5": "^6.4.0-alpha.28",
-    "@storybook/theming": "^6.4.0-alpha.28",
+    "@ni/eslint-config-javascript": "^3.1.0",
+    "@ni/eslint-config-typescript": "^3.0.5",
+    "@storybook/addon-a11y": "^6.4.0",
+    "@storybook/addon-actions": "^6.4.0",
+    "@storybook/addon-docs": "^6.4.0",
+    "@storybook/addon-essentials": "^6.4.0",
+    "@storybook/addon-interactions": "^6.4.0",
+    "@storybook/addon-links": "^6.4.0",
+    "@storybook/addons": "^6.4.0",
+    "@storybook/builder-webpack5": "^6.4.0",
+    "@storybook/html": "^6.4.0",
+    "@storybook/jest": "^0.0.5",
+    "@storybook/manager-webpack5": "^6.4.0",
+    "@storybook/testing-library": "^0.0.7",
+    "@storybook/theming": "^6.4.0",
     "@types/jasmine": "^3.6.0",
     "@types/webpack-env": "^1.15.2",
     "babel-loader": "^8.2.2",
@@ -69,6 +76,7 @@
     "css-loader": "^6.2.0",
     "dotenv-webpack": "^7.0.2",
     "eslint-plugin-jsdoc": "^36.1.0",
+    "eslint-plugin-storybook": "^0.5.1",
     "html-webpack-plugin": "^5.3.1",
     "jasmine-core": "^3.7.0",
     "karma": "^6.3.0",
@@ -84,6 +92,7 @@
     "prettier-eslint": "^13.0.0",
     "prettier-eslint-cli": "^5.0.1",
     "puppeteer": "^10.1.0",
+    "rollup": "^2.61.1",
     "storybook-addon-xd-designs": "file:storybook-addon-xd-designs-6.0.0.tgz",
     "ts-loader": "^9.2.5",
     "typescript": "^4.3.2",

package/dist/esm/testing/dom-next-update.d.ts

@@ -1,4 +0,0 @@
-/**
- * Allows test code to wait for the render update cycle of the components.
- */
-export declare const domNextUpdate: () => Promise<void>;

package/dist/esm/testing/dom-next-update.js

@@ -1,6 +0,0 @@
-import { DOM } from '@microsoft/fast-element';
-/**
- * Allows test code to wait for the render update cycle of the components.
- */
-export const domNextUpdate = async () => DOM.nextUpdate();
-//# sourceMappingURL=dom-next-update.js.map

package/dist/esm/testing/dom-next-update.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"dom-next-update.js","sourceRoot":"","sources":["../../../src/testing/dom-next-update.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,yBAAyB,CAAC;AAE9C;;GAEG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,KAAK,IAAmB,EAAE,CAAC,GAAG,CAAC,UAAU,EAAE,CAAC"}

package/dist/esm/theme-provider/themes.js

@@ -1,8 +0,0 @@
-export var NimbleTheme;
-(function (NimbleTheme) {
-    NimbleTheme["Light"] = "light";
-    NimbleTheme["Dark"] = "dark";
-    NimbleTheme["Color"] = "color";
-    NimbleTheme["LegacyBlue"] = "legacy-blue"; // ⛔️ only for use within SystemLink apps that haven't been updated to brand-aligned controls
-})(NimbleTheme || (NimbleTheme = {}));
-//# sourceMappingURL=themes.js.map

package/dist/esm/theme-provider/themes.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"themes.js","sourceRoot":"","sources":["../../../src/theme-provider/themes.ts"],"names":[],"mappings":"AAAA,MAAM,CAAN,IAAY,WAKX;AALD,WAAY,WAAW;IACnB,8BAAe,CAAA;IACf,4BAAa,CAAA;IACb,8BAAe,CAAA;IACf,yCAA0B,CAAA,CAAC,6FAA6F;AAC5H,CAAC,EALW,WAAW,KAAX,WAAW,QAKtB"}