feat: remove styled endpoints and update readme and installation docs

BREAKING CHANGE: No more styled endpoints, so the advanced styling
method now requires that you import the Sass yourself.

Author: hperrin

CONTRIBUTING.md

@@ -30,7 +30,7 @@ cd packages/site
 npm run dev
 ```
 
-Once that starts, you should be able to see the site at http://localhost:3000/ and the site will refresh automatically when you make a change.
+Once that starts, you should be able to see the site at http://localhost:3000/ and the site will refresh automatically when you make a change. You will have to go into whichever package you're working on and run `npm run build` before you'll see the change.
 
 ## Commiting Changes
 

INSTALL.md

@@ -1,6 +1,6 @@
 # Installation
 
-To get started, you'll need the [Svelte Preprocess](https://github.com/sveltejs/svelte-preprocess) package installed and working, then install the SMUI packages.
+To get started, install the SMUI packages you need.
 
 ```sh
 npm install --save-dev @smui/button
@@ -16,24 +16,12 @@ You can also [use SMUI in the Svelte REPL](/REPL.md).
 
 You will always import Svelte components from the individual packages.
 
-This method will only include the JavaScript. Use this for the Default Theme or the [Easy Styling Method](/SASS.md#easy-styling-method).
-
 ```svelte
 <script>
   import Button from '@smui/button';
 </script>
 ```
 
-This method will include Sass files as well. Use this for the [Advanced Styling Method](/SASS.md#advanced-styling-method).
-
-```svelte
-<script>
-  import Button from '@smui/button/styled';
-</script>
-```
-
-Notice that adding "/styled" to your import path means Sass files will be imported.
-
 ## Material Fonts
 
 If you want the Material Icon, Roboto, and Roboto Mono fonts, be sure to include these stylesheets (or include them from a package).
@@ -68,20 +56,20 @@ npm install --save svelte-material-ui
 <link rel="stylesheet" href="node_modules/svelte-material-ui/bare.css" />
 ```
 
-If that's not working (probably because your dependencies aren't copied to your build folder), you can also use a CDN. Just be sure you update the version here when you update to a new version of SMUI. (This is already an outdated version, so update it now too.)
+If that's not working (probably because your dependencies aren't copied to your build folder), you can also use a CDN. Just be sure you update the version here when you update to a new version of SMUI. (This may already be an outdated version, so update it now too.)
 
 ```html
 <link
   rel="stylesheet"
-  href="https://cdn.jsdelivr.net/npm/svelte-material-ui@4.0.0/bare.min.css"
+  href="https://cdn.jsdelivr.net/npm/svelte-material-ui@6.0.0/bare.min.css"
 />
 ```
 
 You can also use the "bare.css" files from the individual packages if you don't use many components and want smaller file sizes.
 
 ## Using a Custom Theme
 
-Check out the [Sass instructions](/SASS.md) for setting up a custom theme.
+Check out the [theming instructions](/THEMING.md) for setting up a custom theme.
 
 ## SvelteKit
 

MIGRATING.md

@@ -11,6 +11,7 @@ https://github.com/material-components/material-components-web/blob/master/CHANG
 
 - For `@smui/common`, `@smui/textfield`, `@smui/select`, and `@smui/snackbar`, if you ever import something like `@smui/snackbar/kitchen/index` or `@smui/textfield/helper-text/index`, you need to remove the `/index` from the end of that import. (This does not apply to Sass imports.)
   - Here's a regex you can use in VS Code to search for these: @smui/(common|textfield|select|snackbar)/[\w-]+/index
+- The '/styled' import endpoints have been removed. You will need to import the '/index' endpoint from Sass yourself if you were using the Advanced Styling Method.
 
 ## Changes
 

README.md

@@ -16,7 +16,7 @@ Here are some features you should know about:
 - You can add arbitrary attributes to all of the components and many of the elements within them.
 - You can add actions to the components with `use={[Action1, [Action2, action2Props], Action3]}`.
 - You can add props to lower components and elements with "$" props, like `input$maxlength="15"`.
-- **All** events are forwarded. This includes DOM events, MDC events, and custom events.
+- **All** events are forwarded. This includes DOM events, SMUI events, MDC events, and custom events.
   - You can add event modifiers with the `on:click$preventDefault$capture={handler}` syntax.
     - If you use Svelte's native `on:click|preventDefault={handler}` syntax, it will not compile. You have to use "$" instead of "|". (The extra S inside the | stands for SMUI.)
   - Supported modifiers are:
@@ -31,26 +31,24 @@ Here are some features you should know about:
 
 # Installation
 
-To get started, check out the [installation docs](INSTALL.md) or the [SvelteKit docs](SVELTEKIT.md). You'll also need to install the [Svelte preprocessor](https://github.com/sveltejs/svelte-preprocess).
+To get started, check out the [installation docs](INSTALL.md) or the [SvelteKit docs](SVELTEKIT.md).
 
 # Migration
 
 Upgrading from an old version? Be sure to read the [migration doc](MIGRATING.md).
 
-Upgrading from v2? There are **lots** of changes listed in the [upgrade instructions](MIGRATING.md#smui-2---smui-3).
+Upgrading from v5? If you're still using the advanced styling method, it's really time to switch to the easy styling method. '/styled' endpoints are no longer provided. Check out the [upgrade instructions](MIGRATING.md#smui-5---smui-6).
+
+Upgrading from v4? SMUI v5 requires the [TypeScript preprocessor](https://github.com/sveltejs/svelte-preprocess). SMUI v6 does not though, so if you upgrade straight to v6, don't worry. Check out the [upgrade instructions](MIGRATING.md#smui-4---smui-5).
 
 Upgrading from v3? SMUI's styling method has been simplified. Check out the [upgrade instructions](MIGRATING.md#smui-3---smui-4).
 
-Upgrading from v4? SMUI now requires the [TypeScript preprocessor](https://github.com/sveltejs/svelte-preprocess). Check out the [upgrade instructions](MIGRATING.md#smui-4---smui-5).
+Upgrading from v2? There are **lots** of changes listed in the [upgrade instructions](MIGRATING.md#smui-2---smui-3).
 
 # Need Help?
 
 If you need help using SMUI, join the new [Discord server](https://discord.gg/aFzmkrmg9P).
 
-# Get Typed!
-
-I'm super typed to announce, SMUI 5 introduces TypeScript support! All the benefits of TypeScript, all the beauty of SMUI!
-
 # Components
 
 Click a component/package below to go to the documentation. (Note that this documentation is a work in progress. The demo code should be your main source of truth for how something works.)

REPL.md

@@ -1,7 +1,5 @@
 # Using SMUI in the Svelte REPL
 
-Note: The latest version of SMUI doesn't work in the REPL, because the REPL doesn't support TypeScript.
-
 Check out an [example REPL](https://svelte.dev/repl/aa857c3bb5eb478cbe6b1fd6c6da522a?version=3.37.0).
 
 SMUI components provide "bare.css" files to use in the REPL. In a `<svelte:head>` section, load from a CDN like UNPKG the CSS files for the fonts, for Material typography, and for SMUI:
@@ -21,7 +19,7 @@ SMUI components provide "bare.css" files to use in the REPL. In a `<svelte:head>
   <!-- Material Typography -->
   <link
     rel="stylesheet"
-    href="https://unpkg.com/@material/typography@11.0.0/dist/mdc.typography.css"
+    href="https://unpkg.com/@material/typography@13.0.0/dist/mdc.typography.css"
   />
 
   <!-- SMUI -->