feat: make flowbite-button usable as directive (#109)

## PR Checklist

Please check if your PR fulfills the following requirements:

<!--- [ ] Tests for the changes have been added (for bug
fixes/features)-->

- [x] Docs have been added/updated (for bug fixes/features)

## PR Type

What kind of change does this PR introduce?

<!-- Please check the one that applies to this PR using "x". -->

- [ ] Bugfix
- [X] Feature
- [ ] Code style update (formatting, local variables)
- [ ] Refactoring (no functional changes, no API changes)
- [ ] Build related changes
- [ ] CI-related changes
- [ ] Documentation content changes
- [ ] Other... Please describe:

## Issue Number

<!-- Bugs and features must be linked to an issue. -->

Issue Number: N/A

## Does this PR introduce a breaking change?

<!-- If this PR contains a breaking change, please describe the impact
and migration path for existing applications below. -->

- [ ] Yes
- [x] No

## Other information

@coderabbitai summary

Author: MGREMY

apps/docs/docs/components/button/component.md

@@ -0,0 +1,141 @@
+---
+title: Component
+route: component
+keyword: ButtonComponentPage
+---
+
+{% import "../../shared/component-deprecated-usage.md" as cdu %}
+
+{{ cdu.deprecated() }}
+
+## Default button
+
+{{ NgDocActions.demo('c_default', {container: false}) }}
+
+```angular-html file="./component/_default.component.html" group="default" name="html"
+
+```
+
+```angular-ts file="./component/_default.component.ts"#L1-L1 group="default" name="typescript"
+
+```
+
+## Button pills
+
+{{ NgDocActions.demo('c_pill', {container: false}) }}
+
+```angular-html file="./component/_pill.component.html" group="pill" name="html"
+
+```
+
+```angular-ts file="./component/_pill.component.ts"#L1-L1 group="pill" name="typescript"
+
+```
+
+## Gradient monochrome
+
+{{ NgDocActions.demo('c_gradient_monochrome', {container: false}) }}
+
+```angular-html file="./component/_gradient-monochrome.component.html" group="gradient-monochrome" name="html"
+
+```
+
+```angular-ts file="./component/_gradient-monochrome.component.ts"#L1-L1 group="gradient-monochrome" name="typescript"
+
+```
+
+## Gradient duo-tone
+
+{{ NgDocActions.demo('c_gradient_duotone', {container: false}) }}
+
+```angular-html file="./component/_gradient-duotone.component.html" group="gradient-duotone" name="html"
+
+```
+
+```angular-ts file="./component/_gradient-duotone.component.ts"#L1-L1 group="gradient-duotone" name="typescript"
+
+```
+
+## Gradient outline
+
+{{ NgDocActions.demo('c_gradient_outline', {container: false}) }}
+
+```angular-html file="./component/_gradient-outline.component.html" group="gradient-outline" name="html"
+
+```
+
+```angular-ts file="./component/_gradient-outline.component.ts"#L1-L1 group="gradient-outline" name="typescript"
+
+```
+
+## Outline buttons
+
+{{ NgDocActions.demo('c_outline', {container: false}) }}
+
+```angular-html file="./component/_outline.component.html" group="outline" name="html"
+
+```
+
+```angular-ts file="./component/_outline.component.ts"#L1-L1 group="outline" name="typescript"
+
+```
+
+## Button sizes
+
+{{ NgDocActions.demo('c_size', {container: false}) }}
+
+```angular-html file="./component/_size.component.html" group="size" name="html"
+
+```
+
+```angular-ts file="./component/_size.component.ts"#L1-L1 group="size" name="typescript"
+
+```
+
+## Button with icon
+
+{{ NgDocActions.demo('c_icon', {container: false}) }}
+
+```angular-html file="./component/_icon.component.html" group="icon" name="html"
+
+```
+
+```angular-ts file="./component/_icon.component.ts"#L1-L2 group="icon" name="typescript"
+
+```
+
+## Button with label
+
+{{ NgDocActions.demo('c_label', {container: false}) }}
+
+```angular-html file="./component/_label.component.html" group="label" name="html"
+
+```
+
+```angular-ts file="./component/_label.component.ts"#L1-L2 group="label" name="typescript"
+
+```
+
+## Icon buttons
+
+{{ NgDocActions.demo('c_icon_only', {container: false}) }}
+
+```angular-html file="./component/_icon-only.component.html" group="icon-only" name="html"
+
+```
+
+```angular-ts file="./component/_icon-only.component.ts"#L1-L2 group="icon-only" name="typescript"
+
+```
+
+## Disabled
+
+{{ NgDocActions.demo('c_disabled', {container: false}) }}
+
+```angular-html file="./component/_disabled.component.html" group="disabled" name="html"
+
+```
+
+```angular-ts file="./component/_disabled.component.ts"#L1-L1 group="disabled" name="typescript"
+
+```