From 1a06ab5a69427c1b64424b7be07ed966cd1787ac Mon Sep 17 00:00:00 2001 From: Chris Holt Date: Tue, 4 Aug 2020 16:27:49 -0700 Subject: [PATCH 1/3] chore: update documentation to reflect rebranding of fast-components-msft to fluent --- README.md | 4 ++-- examples/site-rebrand-tutorial/walk-through.md | 4 ++-- examples/todo-app-tutorial/package.json | 2 +- examples/todo-app-tutorial/src/design-property-panel.ts | 5 +---- examples/todo-app-tutorial/src/main.ts | 2 +- examples/todo-app-tutorial/src/todo-form.ts | 2 +- packages/web-components/README.md | 4 ++-- packages/web-components/fast-foundation/src/anchor/README.md | 2 +- packages/web-components/fast-foundation/src/badge/README.md | 2 +- packages/web-components/fast-foundation/src/button/README.md | 2 +- sites/website/src/docs/components/getting-started.md | 4 ++-- sites/website/src/docs/introduction.md | 4 ++-- sites/website/src/docs/resources/faq.md | 4 ++-- 13 files changed, 19 insertions(+), 22 deletions(-) diff --git a/README.md b/README.md index ffaf7c71905..f297a296c5f 100644 --- a/README.md +++ b/README.md @@ -67,11 +67,11 @@ This package does not export Web Components registered as [custom elements](http `fast-components` is a library of Web Components that *composes* the exports of `fast-foundation` with stylesheets aligning to the FAST design language. This composition step registers a custom element. See the [quick start](http://fast.design/components/getting-started) to get started using the components. ### fast-components-msft -**This package has been moved to [FluentUI](https://github.com/microsoft/fluentui/)** +**This package has been moved to [FluentUI](https://github.com/microsoft/fluentui/) and has been renamed to `@fluentui/web-components`** [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT) [![npm version](https://badge.fury.io/js/%40microsoft%2Ffast-components-msft.svg)](https://badge.fury.io/js/%40microsoft%2Ffast-components-msft) -`fast-components-msft` is a library of Web Components that *composes* `fast-foundation`. `fast-components-msft` uses the same custom element names as `fast-components`, but makes use of different stylesheets and may include components that specifically support Microsoft's Fluent design language. +`@fluentui/web-components` is a library of Web Components that *composes* `fast-foundation`. `@fluentui/web-components` uses the same custom element names as `fast-components`, but makes use of different stylesheets and may include components that specifically support Microsoft's Fluent design language. ### Component Explorer diff --git a/examples/site-rebrand-tutorial/walk-through.md b/examples/site-rebrand-tutorial/walk-through.md index a872cbc1df9..f8d300af0a0 100644 --- a/examples/site-rebrand-tutorial/walk-through.md +++ b/examples/site-rebrand-tutorial/walk-through.md @@ -542,14 +542,14 @@ As the design system and components are all defined in the pre-bundled FAST Java Change line 247 to: ```html - + ``` And the import statement at line 253 to: ```javascript - from "https://unpkg.com/@microsoft/fast-components-msft"; + from "https://unpkg.com/@fluentui/web-components"; ``` ![The website using the Fluent design system versus FAST](side-by-side.png) diff --git a/examples/todo-app-tutorial/package.json b/examples/todo-app-tutorial/package.json index 4a0b67ee056..952dfa864e3 100644 --- a/examples/todo-app-tutorial/package.json +++ b/examples/todo-app-tutorial/package.json @@ -12,7 +12,7 @@ "license": "ISC", "dependencies": { "@microsoft/fast-colors": "^5.0.12", - "@microsoft/fast-components-msft": "latest", + "@fluentui/web-components": "latest", "@microsoft/fast-element": "latest", "@microsoft/fast-foundation": "latest", "lodash-es": "^4.17.15", diff --git a/examples/todo-app-tutorial/src/design-property-panel.ts b/examples/todo-app-tutorial/src/design-property-panel.ts index dd58b18b96a..926aafe03f1 100644 --- a/examples/todo-app-tutorial/src/design-property-panel.ts +++ b/examples/todo-app-tutorial/src/design-property-panel.ts @@ -6,10 +6,7 @@ import { customElement, ExecutionContext, } from "@microsoft/fast-element"; -import { - neutralLayerL1Behavior, - parseColorString, -} from "@microsoft/fast-components-msft"; +import { neutralLayerL1Behavior, parseColorString } from "@fluentui/web-components"; import { ComponentStateColorPalette, ColorRGBA64 } from "@microsoft/fast-colors"; import { typography } from "./typography"; diff --git a/examples/todo-app-tutorial/src/main.ts b/examples/todo-app-tutorial/src/main.ts index 4216ee420c5..b4479e69a96 100644 --- a/examples/todo-app-tutorial/src/main.ts +++ b/examples/todo-app-tutorial/src/main.ts @@ -6,7 +6,7 @@ import { FASTCard, FASTSlider, FASTSliderLabel, -} from "@microsoft/fast-components-msft"; +} from "@fluentui/web-components"; import { TodoApp } from "./todo-app"; import { TodoForm } from "./todo-form"; import { DesignPropertyPanel } from "./design-property-panel"; diff --git a/examples/todo-app-tutorial/src/todo-form.ts b/examples/todo-app-tutorial/src/todo-form.ts index 0fdb800636e..af81a3b869b 100644 --- a/examples/todo-app-tutorial/src/todo-form.ts +++ b/examples/todo-app-tutorial/src/todo-form.ts @@ -5,7 +5,7 @@ import { customElement, css, } from "@microsoft/fast-element"; -import { FASTTextField } from "@microsoft/fast-components-msft"; +import { FASTTextField } from "@fluentui/web-components"; const template = html`
x.submitTodo()}> diff --git a/packages/web-components/README.md b/packages/web-components/README.md index 1dc0fa70b93..b4ff47a0b6d 100644 --- a/packages/web-components/README.md +++ b/packages/web-components/README.md @@ -26,8 +26,8 @@ This package does not export Web Components registered as [custom elements](http `fast-components` is a library of Web Components that *composes* the exports of `fast-foundation` with stylesheets aligning to the FAST design language. This composition step registers a custom element. See the [quick start](http://fast.design/components/getting-started) to get started using the components. ## fast-components-msft - +**This package has been moved to [FluentUI](https://github.com/microsoft/fluentui/) and has been renamed to `@fluentui/web-components`** [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT) [![npm version](https://badge.fury.io/js/%40microsoft%2Ffast-components-msft.svg)](https://badge.fury.io/js/%40microsoft%2Ffast-components-msft) -`fast-components-msft` is a library of Web Components that *composes* `fast-foundation`. `fast-components-msft` uses the same custom element names as `fast-components`, but makes use of different stylesheets that support Microsoft's Fluent design language. \ No newline at end of file +`@fluentui/web-components` is a library of Web Components that *composes* `fast-foundation`. `@fluentui/web-components` uses the same custom element names as `fast-components`, but makes use of different stylesheets and may include components that specifically support Microsoft's Fluent design language. \ No newline at end of file diff --git a/packages/web-components/fast-foundation/src/anchor/README.md b/packages/web-components/fast-foundation/src/anchor/README.md index 920064f24ed..9b36b755fbc 100644 --- a/packages/web-components/fast-foundation/src/anchor/README.md +++ b/packages/web-components/fast-foundation/src/anchor/README.md @@ -5,7 +5,7 @@ sidebar_label: anchor custom_edit_url: https://github.com/microsoft/fast/edit/master/packages/web-components/fast-foundation/src/anchor/README.md --- -`fast-anchor` is a web component implementation of an [HTML anchor element](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a). The `fast-components` and `fast-components-msft` components support the same visual appearances as the button component (accent, lightweight, neutral, outline, stealth) as well as a hypertext appearance for use inline with text. +`fast-anchor` is a web component implementation of an [HTML anchor element](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a). The `fast-components anchor supports the same visual appearances as the button component (accent, lightweight, neutral, outline, stealth) as well as a hypertext appearance for use inline with text. ## Usage diff --git a/packages/web-components/fast-foundation/src/badge/README.md b/packages/web-components/fast-foundation/src/badge/README.md index bc29162ac25..214365080c2 100644 --- a/packages/web-components/fast-foundation/src/badge/README.md +++ b/packages/web-components/fast-foundation/src/badge/README.md @@ -28,7 +28,7 @@ fast-badge { ``` :::note -In addition to the color map support detailed above, the `fast-badge` from the Microsoft component implementation (`@microsoft/fast-components-msft`) includes an attribute to set default appearances which ensure WCAG 2.1 AA contrast requirements. +In addition to the color map support detailed above, the `fast-badge` from the Microsoft component implementation (`@fluentui/web-components`) includes an attribute to set default appearances which ensure WCAG 2.1 AA contrast requirements. ::: ## Applying custom styles diff --git a/packages/web-components/fast-foundation/src/button/README.md b/packages/web-components/fast-foundation/src/button/README.md index 02cd8b206b2..840abe3a3f0 100644 --- a/packages/web-components/fast-foundation/src/button/README.md +++ b/packages/web-components/fast-foundation/src/button/README.md @@ -5,7 +5,7 @@ sidebar_label: button custom_edit_url: https://github.com/microsoft/fast/edit/master/packages/web-components/fast-foundation/src/button/README.md --- -`fast-button` is a web component implementation of an [HTML button element](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button). The `fast-components` and `fast-components-msft` components supports several visual appearances (accent, lightweight, neutral, outline, stealth). +`fast-button` is a web component implementation of an [HTML button element](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button). The `fast-components` button supports several visual appearances (accent, lightweight, neutral, outline, stealth). ## Usage diff --git a/sites/website/src/docs/components/getting-started.md b/sites/website/src/docs/components/getting-started.md index 34e983e4d28..151bae50fad 100644 --- a/sites/website/src/docs/components/getting-started.md +++ b/sites/website/src/docs/components/getting-started.md @@ -6,13 +6,13 @@ custom_edit_url: https://github.com/microsoft/fast/edit/master/sites/website/src [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT) [![npm version](https://badge.fury.io/js/%40microsoft%2Ffast-components.svg)](https://badge.fury.io/js/%40microsoft%2Ffast-components) -The `fast-components` and `fast-components-msft` libraries contain Web Components built on top of our standard component and design system foundation. `fast-components` express the FAST design language while `fast-components-msft` expresses Microsoft's Fluent design language. +The `fast-components` and `@fluentui/web-components` libraries contain Web Components built on top of our standard component and design system foundation. `fast-components` express the FAST design language while `@fluentui/web-components` expresses Microsoft's Fluent design language. ## Installation ### From NPM -To install the components, first, choose between `fast-components` and `fast-components-msft`. Assuming a selection of `fast-components`, you would use either `npm` or `yarn` as follows: +To install the components, first, choose between `fast-components` and `@fluentui/web-components`. Assuming a selection of `fast-components`, you would use either `npm` or `yarn` as follows: ```shell npm install --save @microsoft/fast-components diff --git a/sites/website/src/docs/introduction.md b/sites/website/src/docs/introduction.md index aba7f8fbb09..8a78c04cfe0 100644 --- a/sites/website/src/docs/introduction.md +++ b/sites/website/src/docs/introduction.md @@ -47,11 +47,11 @@ This package does not export Web Components registered as [custom elements](http `fast-components` is a library of Web Components that *composes* the exports of `fast-foundation` with stylesheets aligning to the FAST design language. This composition step registers a custom element. See the [quick start](/docs/components/getting-started) to get started using the components. ### fast-components-msft - +**This package has been moved to [FluentUI](https://github.com/microsoft/fluentui/) and has been renamed to `@fluentui/web-components`** [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT) [![npm version](https://badge.fury.io/js/%40microsoft%2Ffast-components-msft.svg)](https://badge.fury.io/js/%40microsoft%2Ffast-components-msft) -`fast-components-msft` is a library of Web Components that *composes* `fast-foundation`. `fast-components-msft` uses the same custom element names as `fast-components`, but makes use of different stylesheets that support Microsoft's Fluent design language. +`@fluentui/web-components` is a library of Web Components that *composes* `fast-foundation`. `@fluentui/web-components` uses the same custom element names as `fast-components`, but makes use of different stylesheets and may include components that specifically support Microsoft's Fluent design language. ### Component Explorer diff --git a/sites/website/src/docs/resources/faq.md b/sites/website/src/docs/resources/faq.md index 3111f1ede3b..f7a3d6b344d 100644 --- a/sites/website/src/docs/resources/faq.md +++ b/sites/website/src/docs/resources/faq.md @@ -15,11 +15,11 @@ When the project was originally founded, it went by the name FAST-DNA, which sto ### What's the difference between FAST and Fluent? -Fluent is Microsoft's design language, independent of any particular implementation technology. FAST is an agnostic tech stack that enables implementing web components, design systems, and apps. `fast-element` is the lowest level of FAST, providing core features for building performant web components. `fast-foundation` is layered on top of `fast-element` and provides primarily two things: core features for building design systems, and a core set of components that are design-system-independent. With `fast-foundation` you can implement any design system. For example, you could implement Fluent Design, Material Design, Lightning Design, Bootstrap, etc. Once the design system is implemented, it can connect with any component built with `fast-element` or `fast-foundation` to enable a particular component to present itself using the visual language of the chosen design system. The FAST team ships two design systems: `fast-components`, which provide our team's own FAST Design system, and `fast-components-msft`, which provides Microsoft's Fluent Design system. If you want to build an app or site with Fluent Design, and you want to use web components as a technology solution, you can use `fast-components-msft` to meet that need today. +Fluent is Microsoft's design language, independent of any particular implementation technology. FAST is an agnostic tech stack that enables implementing web components, design systems, and apps. `fast-element` is the lowest level of FAST, providing core features for building performant web components. `fast-foundation` is layered on top of `fast-element` and provides primarily two things: core features for building design systems, and a core set of components that are design-system-independent. With `fast-foundation` you can implement any design system. For example, you could implement Fluent Design, Material Design, Lightning Design, Bootstrap, etc. Once the design system is implemented, it can connect with any component built with `fast-element` or `fast-foundation` to enable a particular component to present itself using the visual language of the chosen design system. The FAST team ships two design systems: `fast-components`, which provide our team's own FAST Design system, and `@fluentui/web-components`, located in the [Fluent UI repo](https://github.com/microsoft/fluentui/), which provides Microsoft's Fluent Design system. If you want to build an app or site with Fluent Design, and you want to use web components as a technology solution, you can use `@fluentui/web-components` to meet that need today. ### What's the difference between FAST and Fluent UI? -Fluent UI refers to an implementation of the Fluent Design language that focuses on Microsoft scenarios, implemented in React. FAST is an agnostic tech stack that enables implementing web components, design systems, and apps (see "What's the difference between FAST and Fluent?"). While FAST provides an implementation of Fluent for web components, via its `fast-components-msft` package, it can be used for other design systems and non-Microsoft related projects. +Fluent UI refers to an implementation of the Fluent Design language that focuses on Microsoft scenarios, implemented in React. FAST is an agnostic tech stack that enables implementing web components, design systems, and apps (see "What's the difference between FAST and Fluent?"). While FAST provides an implementation of Fluent for web components, via its `@fluentui/web-components` package, it can be used for other design systems and non-Microsoft related projects. ### How does `fast-element` compare to "Framework X"? From 4ea3a54dd322973c691d3901fee823fac1d41fc6 Mon Sep 17 00:00:00 2001 From: Chris Holt Date: Tue, 4 Aug 2020 17:35:04 -0700 Subject: [PATCH 2/3] prrefix fast element and fast foundation packages --- README.md | 10 +++++----- sites/website/src/docs/introduction.md | 10 +++++----- 2 files changed, 10 insertions(+), 10 deletions(-) diff --git a/README.md b/README.md index f297a296c5f..f3ee22743b1 100644 --- a/README.md +++ b/README.md @@ -48,14 +48,14 @@ Let's take a look at what each of FAST's core packages gives us today. [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT) [![npm version](https://badge.fury.io/js/%40microsoft%2Ffast-element.svg)](https://badge.fury.io/js/%40microsoft%2Ffast-element) -The `fast-element` library is a lightweight means to easily building performant, memory-efficient, standards-compliant Web Components. FAST Elements work in every major browser and can be used in combination with any front-end framework or even without a framework. To get up and running with `fast-element` see [the Getting Started guide](http://fast.design/docs/fast-element/getting-started). +The `@microsoft/fast-element` library is a lightweight means to easily building performant, memory-efficient, standards-compliant Web Components. FAST Elements work in every major browser and can be used in combination with any front-end framework or even without a framework. To get up and running with `@microsoft/fast-element` see [the Getting Started guide](http://fast.design/docs/fast-element/getting-started). ### fast-foundation [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT) [![npm version](https://badge.fury.io/js/%40microsoft%2Ffast-foundation.svg)](https://badge.fury.io/js/%40microsoft%2Ffast-foundation) -The `fast-foundation` package is a library of Web Component classes, templates, and other utilities intended to be composed into registered Web Components by design systems (e.g. Fluent Design, Material Design, etc.). The exports of this package can generally be thought of as un-styled base components that implement semantic and accessible markup and behavior. +The `@microsoft/fast-foundation` package is a library of Web Component classes, templates, and other utilities intended to be composed into registered Web Components by design systems (e.g. Fluent Design, Material Design, etc.). The exports of this package can generally be thought of as un-styled base components that implement semantic and accessible markup and behavior. This package does not export Web Components registered as [custom elements](https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_custom_elements) - it exports parts and pieces intended to be *composed* into Web Components, allowing you to implement your own design language by simply applying CSS styles and behaviors without having to write all the JavaScript that's involved in building production-quality component implementations. @@ -64,14 +64,14 @@ This package does not export Web Components registered as [custom elements](http [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT) [![npm version](https://badge.fury.io/js/%40microsoft%2Ffast-components.svg)](https://badge.fury.io/js/%40microsoft%2Ffast-components) -`fast-components` is a library of Web Components that *composes* the exports of `fast-foundation` with stylesheets aligning to the FAST design language. This composition step registers a custom element. See the [quick start](http://fast.design/components/getting-started) to get started using the components. +`@microsoft/fast-components` is a library of Web Components that *composes* the exports of `@microsoft/fast-foundation` with stylesheets aligning to the FAST design language. This composition step registers a custom element. See the [quick start](http://fast.design/components/getting-started) to get started using the components. ### fast-components-msft **This package has been moved to [FluentUI](https://github.com/microsoft/fluentui/) and has been renamed to `@fluentui/web-components`** [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT) [![npm version](https://badge.fury.io/js/%40microsoft%2Ffast-components-msft.svg)](https://badge.fury.io/js/%40microsoft%2Ffast-components-msft) -`@fluentui/web-components` is a library of Web Components that *composes* `fast-foundation`. `@fluentui/web-components` uses the same custom element names as `fast-components`, but makes use of different stylesheets and may include components that specifically support Microsoft's Fluent design language. +`@fluentui/web-components` is a library of Web Components that *composes* `@microsoft/fast-foundation`. `@fluentui/web-components` uses the same custom element names as `@microsoft/fast-components`, but makes use of different stylesheets and may include components that specifically support Microsoft's Fluent design language. ### Component Explorer @@ -79,7 +79,7 @@ Launch our [Component Explorer](https://explore.fast.design) to experience our [ ## Getting Started -If you're looking to get started using our components right away, take a look at [the components quick start](http://fast.design/docs/components/getting-started). You'll also want to check out [our integrations](http://fast.design/docs/integrations/introduction) if you're looking to add the components into a Webpack build or incorporate them with another front-end framework. For those interested in implementing their own design system or customizing the styles of the components, after you [have a look at the components](http://fast.design/docs/components/getting-started), you'll want to read through [our styling docs](http://fast.design/docs/design/introduction). Finally, if your goal is to build your own components or apps with `fast-element`, you can learn all about that in our [guide to building web components with FASTElement](http://fast.design/docs/fast-element/getting-started). +If you're looking to get started using our components right away, take a look at [the components quick start](http://fast.design/docs/components/getting-started). You'll also want to check out [our integrations](http://fast.design/docs/integrations/introduction) if you're looking to add the components into a Webpack build or incorporate them with another front-end framework. For those interested in implementing their own design system or customizing the styles of the components, after you [have a look at the components](http://fast.design/docs/components/getting-started), you'll want to read through [our styling docs](http://fast.design/docs/design/introduction). Finally, if your goal is to build your own components or apps with `@microsoft/fast-element`, you can learn all about that in our [guide to building web components with FASTElement](http://fast.design/docs/fast-element/getting-started). ## Joining the Community diff --git a/sites/website/src/docs/introduction.md b/sites/website/src/docs/introduction.md index 8a78c04cfe0..17d32c46ba1 100644 --- a/sites/website/src/docs/introduction.md +++ b/sites/website/src/docs/introduction.md @@ -28,14 +28,14 @@ Let's take a look at what each of FAST's core packages gives us today. [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT) [![npm version](https://badge.fury.io/js/%40microsoft%2Ffast-element.svg)](https://badge.fury.io/js/%40microsoft%2Ffast-element) -The `fast-element` library is a lightweight means to easily building performant, memory-efficient, standards-compliant Web Components. FAST Elements work in every major browser and can be used in combination with any front-end framework or even without a framework. To get up and running with `fast-element` see [the Getting Started guide](/docs/fast-element/getting-started). +The `@microsoft/fast-element` library is a lightweight means to easily building performant, memory-efficient, standards-compliant Web Components. FAST Elements work in every major browser and can be used in combination with any front-end framework or even without a framework. To get up and running with `@microsoft/fast-element` see [the Getting Started guide](/docs/fast-element/getting-started). ### fast-foundation [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT) [![npm version](https://badge.fury.io/js/%40microsoft%2Ffast-foundation.svg)](https://badge.fury.io/js/%40microsoft%2Ffast-foundation) -The `fast-foundation` package is a library of Web Component classes, templates, and other utilities intended to be composed into registered Web Components by design systems (e.g. Fluent Design, Material Design, etc.). The exports of this package can generally be thought of as un-styled base components that implement semantic and accessible markup and behavior. +The `@microsoft/fast-foundation` package is a library of Web Component classes, templates, and other utilities intended to be composed into registered Web Components by design systems (e.g. Fluent Design, Material Design, etc.). The exports of this package can generally be thought of as un-styled base components that implement semantic and accessible markup and behavior. This package does not export Web Components registered as [custom elements](https://developer.mozilla.org/en-US/docs/Web/Web_Components/Using_custom_elements) - it exports parts and pieces intended to be *composed* into Web Components, allowing you to implement your own design language by simply applying CSS styles and behaviors without having to write all the JavaScript that's involved in building production-quality component implementations. @@ -44,14 +44,14 @@ This package does not export Web Components registered as [custom elements](http [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT) [![npm version](https://badge.fury.io/js/%40microsoft%2Ffast-components.svg)](https://badge.fury.io/js/%40microsoft%2Ffast-components) -`fast-components` is a library of Web Components that *composes* the exports of `fast-foundation` with stylesheets aligning to the FAST design language. This composition step registers a custom element. See the [quick start](/docs/components/getting-started) to get started using the components. +`@microsoft/fast-components` is a library of Web Components that *composes* the exports of `@microsoft/fast-foundation` with stylesheets aligning to the FAST design language. This composition step registers a custom element. See the [quick start](/docs/components/getting-started) to get started using the components. ### fast-components-msft **This package has been moved to [FluentUI](https://github.com/microsoft/fluentui/) and has been renamed to `@fluentui/web-components`** [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT) [![npm version](https://badge.fury.io/js/%40microsoft%2Ffast-components-msft.svg)](https://badge.fury.io/js/%40microsoft%2Ffast-components-msft) -`@fluentui/web-components` is a library of Web Components that *composes* `fast-foundation`. `@fluentui/web-components` uses the same custom element names as `fast-components`, but makes use of different stylesheets and may include components that specifically support Microsoft's Fluent design language. +`@fluentui/web-components` is a library of Web Components that *composes* `@microsoft/fast-foundation`. `@fluentui/web-components` uses the same custom element names as `@microsoft/fast-components`, but makes use of different stylesheets and may include components that specifically support Microsoft's Fluent design language. ### Component Explorer @@ -59,7 +59,7 @@ Launch our [Component Explorer](https://explore.fast.design) to experience our [ ## Getting started -If you're looking to get started using our components right away, take a look at [the components quick start](/docs/components/getting-started). You'll also want to check out [our integrations](/docs/integrations/introduction) if you're looking to add the components into a Webpack build or incorporate them with another front-end framework. For those interested in implementing their own design system or customizing the styles of the components, after you [have a look at the components](/docs/components/getting-started), you'll want to read through [our styling docs](/docs/design/introduction). Finally, if your goal is to build your own components or apps with `fast-element`, you can learn all about that in our [guide to building web components with FASTElement](/docs/fast-element/getting-started). +If you're looking to get started using our components right away, take a look at [the components quick start](/docs/components/getting-started). You'll also want to check out [our integrations](/docs/integrations/introduction) if you're looking to add the components into a Webpack build or incorporate them with another front-end framework. For those interested in implementing their own design system or customizing the styles of the components, after you [have a look at the components](/docs/components/getting-started), you'll want to read through [our styling docs](/docs/design/introduction). Finally, if your goal is to build your own components or apps with `@microsoft/fast-element`, you can learn all about that in our [guide to building web components with FASTElement](/docs/fast-element/getting-started). ## Joining the community From b1cc5d985148e11a902a5b86cafe917b6f19ae0c Mon Sep 17 00:00:00 2001 From: Chris Holt Date: Tue, 4 Aug 2020 17:43:07 -0700 Subject: [PATCH 3/3] update oopsies --- README.md | 2 +- packages/web-components/fast-foundation/src/anchor/README.md | 2 +- sites/website/src/docs/introduction.md | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index f3ee22743b1..50ff904ee83 100644 --- a/README.md +++ b/README.md @@ -71,7 +71,7 @@ This package does not export Web Components registered as [custom elements](http [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT) [![npm version](https://badge.fury.io/js/%40microsoft%2Ffast-components-msft.svg)](https://badge.fury.io/js/%40microsoft%2Ffast-components-msft) -`@fluentui/web-components` is a library of Web Components that *composes* `@microsoft/fast-foundation`. `@fluentui/web-components` uses the same custom element names as `@microsoft/fast-components`, but makes use of different stylesheets and may include components that specifically support Microsoft's Fluent design language. +`@fluentui/web-components` is a library of Web Components that *composes* `@microsoft/fast-foundation`. `@fluentui/web-components` makes use of different stylesheets and may include components that specifically support Microsoft's Fluent design language. ### Component Explorer diff --git a/packages/web-components/fast-foundation/src/anchor/README.md b/packages/web-components/fast-foundation/src/anchor/README.md index 9b36b755fbc..7e32ac7b43f 100644 --- a/packages/web-components/fast-foundation/src/anchor/README.md +++ b/packages/web-components/fast-foundation/src/anchor/README.md @@ -5,7 +5,7 @@ sidebar_label: anchor custom_edit_url: https://github.com/microsoft/fast/edit/master/packages/web-components/fast-foundation/src/anchor/README.md --- -`fast-anchor` is a web component implementation of an [HTML anchor element](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a). The `fast-components anchor supports the same visual appearances as the button component (accent, lightweight, neutral, outline, stealth) as well as a hypertext appearance for use inline with text. +`fast-anchor` is a web component implementation of an [HTML anchor element](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a). The `fast-components` anchor supports the same visual appearances as the button component (accent, lightweight, neutral, outline, stealth) as well as a hypertext appearance for use inline with text. ## Usage diff --git a/sites/website/src/docs/introduction.md b/sites/website/src/docs/introduction.md index 17d32c46ba1..1800d4317f3 100644 --- a/sites/website/src/docs/introduction.md +++ b/sites/website/src/docs/introduction.md @@ -51,7 +51,7 @@ This package does not export Web Components registered as [custom elements](http [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT) [![npm version](https://badge.fury.io/js/%40microsoft%2Ffast-components-msft.svg)](https://badge.fury.io/js/%40microsoft%2Ffast-components-msft) -`@fluentui/web-components` is a library of Web Components that *composes* `@microsoft/fast-foundation`. `@fluentui/web-components` uses the same custom element names as `@microsoft/fast-components`, but makes use of different stylesheets and may include components that specifically support Microsoft's Fluent design language. +`@fluentui/web-components` is a library of Web Components that *composes* `@microsoft/fast-foundation`. `@fluentui/web-components` makes use of different stylesheets and may include components that specifically support Microsoft's Fluent design language. ### Component Explorer