Update docs

Author: rawilk

CHANGELOG.md

@@ -16,6 +16,9 @@ All notable changes to `laravel-form-components` will be documented in this file
 - **Breaking Change:** Move styles into `resources/css` directory, which will require a different directory and file to import into stylesheets
 - **Breaking Change:** Change `textField` prop on `customSelect` to `labelField`
 - **Breaking Change:** Change defaults of `valueField` and `labelField` on custom select component to `id` and `name`, respectively
+- **Breaking Change:** Rename `min` and `max` props on custom select to `minSelected` and `maxSelected`, respectively
+- **Breaking Change:** Require a flat array of options on custom select, even if they contain "opt groups"
+- **Breaking Change:** Remove `wire-listeners` from custom select
 - Add various new props to custom select component
 - Change default styling of custom select component
 - Add Laravel 9.* compatibility

README.md

@@ -8,9 +8,6 @@
 
 Laravel form components provides common form components to help build forms faster using Tailwind CSS. Supports validation, old form values, and wire:model.
 
-**Notice:** Laravel Form Components v7 is currently not in a stable release and shouldn't be used in a production environment. It is not advised to upgrade to it until
-a stable release has been made.
-
 ## Installation
 
 You can install the package via composer:

docs/_index.md

@@ -1,5 +1,5 @@
 ---
-title: v6
+title: v7
 slogan: A set of Blade components for TailwindCSS forms.
 githubUrl: https://github.com/rawilk/laravel-form-components
 branch: main

docs/advanced-usage/customizing-css.md

@@ -6,7 +6,7 @@ sort: 1
 If you want to change the look of the Laravel Form Components to match the style of your own app, you have multiple options.
 
 ## Option 1: Use Your Own Tailwind CSS Configuration
-Instead of importing/linking the pre-built `dist/styles.css` from the package, you can import the `src/styles.css` and run every `@apply` rule through your own `tailwind.config.js`.
+You can import the `index.css` and run every `@apply` rule through your own `tailwind.config.js`.
 
 ```css
 /* app.css */
@@ -15,33 +15,17 @@ Instead of importing/linking the pre-built `dist/styles.css` from the package, y
 @tailwind components;
 @tailwind utilities;
 
-@import '../../vendor/rawilk/laravel-form-components/resources/js/laravel-form-components-styles/src/styles.css';
+@import '../../vendor/rawilk/laravel-form-components/resources/css/index.css';
 
 /* override our styles here */
 ```
 
 > {note} If you choose this option, make sure you have the [required variants](#required-variants) included in your `tailwind.config.js` configuration.
 
-## Option 2: Override Only Portions In Your CSS
-If you only want to tinker with certain aspects of the components but like to keep the CSS in sync with future package updates, nothing stops you from overriding only certain CSS rules with your own tweaks. Most DOM elements have their own custom class names.
+You may also import only the stylesheets you need instead of everything in the index.css file. Most components have their own stylesheets (i.e. `input.css` for input elements).
 
-Let's say your inputs aren't rounded, and you want to remove the border radius from them. To do that, you can write your own CSS for this class:
-
-```css
-/* app.css */
-...
-
-@import '../../vendor/rawilk/laravel-form-components/resources/js/laravel-form-components-styles/dist/styles.css';
-/* or */
-@import '../../vendor/rawilk/laravel-form-components/resources/js/laravel-form-components-styles/dist/styles.min.css';
-
-.form-text {
-    @apply rounded-none;
-}
-```
-
-## Option 3: Copy the CSS To Your Own Project
-If you want full-control, you can always copy the `src/styles.css` to your own project and go wild. In this example, we renamed the file to `custom/laravel-form-components.css`.
+## Option 2: Copy the CSS To Your Own Project
+If you want full-control, you can always copy the each of the stylesheets from `resources/css` to your own project and go wild. In this example, we renamed the file to `custom/laravel-form-components.css`.
 Beware: you will have to manually keep this CSS in sync with changes in future package updates:
 
 ```css
@@ -154,8 +138,6 @@ in a `/* purgecss start ignore */`:
 
 ```css
 /* purgecss start ignore */
-@import '../../vendor/rawilk/laravel-form-components/resources/js/laravel-form-components-styles/dist/styles.css';
-/* or */
-@import '../../vendor/rawilk/laravel-form-components/resources/js/laravel-form-components-styles/dist/styles.min.css';
+@import '../../vendor/rawilk/laravel-form-components/resources/css/index.css';
 /* purgecss end ignore */
 ```

docs/installation.md

@@ -79,12 +79,11 @@ You have a couple options for how you can use the UI components' CSS, depending
 
 ### Using Laravel Mix or Webpack with CSS-Loader
 
-You can import the built CSS in your own CSS files using `@import '../../vendor/rawilk/laravel-form-components/resources/js/laravel-form-components-styles/dist/styles.css';`.
+You can import the CSS files into your own stylesheets using `@import '../../vendor/rawilk/laravel-form-components/resources/css/index.css';'`.
 This is assuming your stylesheet is located in the `./resources/css/` directory of your project.
 
-### Directly in Blade/HTML
-
-You could copy the built CSS from `vendor/rawilk/laravel-components/resources/js/laravel-form-components-styles/dist/styles.css` into your public folder, and then use a `link` tag in your blade/html to get it: `<link rel="stylesheet" href="{{ asset('css/laravel-form-components.css') }}">`.
+This will import all the package's styles into your project, however you are free to import only the stylesheets you need as well. They are all located
+in the same directory as the `index.css` stylesheet.
 
 If you would like to customize the CSS we provide, head over to [the section on Customizing CSS](/docs/laravel-form-components/{version}/advanced-usage/customizing-css).
 

docs/requirements.md

@@ -6,7 +6,7 @@ sort: 2
 ## General Requirements
 
 -   PHP **8.0** or greater
--   Laravel **8.56** or greater
+-   Laravel **8.70** or greater
 -   TailwindUI for styling
 -   Alpine.js
 -   Popper.js (when using components like custom-select)
@@ -15,6 +15,7 @@ sort: 2
 ## Version Matrix
 
 | Laravel    | Minimum Version | Maximum Version |
-| ---------- | --------------- | --------------- |
+| ---------- | --------------- |-----------------|
 | 8.0 - 8.55 | 1.0.0           | 5.1.0           |
-| 8.56       | 6.0.0           |                 |
+| 8.56       | 6.0.0           | 6.0.2           |
+ | 8.70      | 7.0.0           |                  |