Experimenting with v0 prompt + llms.txt

component_list.txt

@@ -0,0 +1,63 @@
+# Shad4FastHtml Component Documentation
+
+## Setup
+
+Make sure the relevant packages are installed, and setup the imports as shown below.
+
+> [!NOTE]
+> If you wish to seperately import components you can do so too. Make sure to import and setup `ShadHead()` as well.
+
+```python
+from fasthtml import *
+from shad4fast import *
+
+app, rt = fast_app(pico=False, hdrs=(ShadHead(),))
+```
+
+## Components
+
+- [Alert](https://raw.githubusercontent.com/curtis-allan/shadcn-fasthtml-framework/refs/heads/main/docs/md/alert_template.md): Displays a short, important message in a way that attracts the user's attention.
+
+- [Button](https://raw.githubusercontent.com/curtis-allan/shadcn-fasthtml-framework/refs/heads/main/docs/md/button_template.md): A button that can be used to trigger actions in your app.
+
+- [Card](https://raw.githubusercontent.com/curtis-allan/shadcn-fasthtml-framework/refs/heads/main/docs/md/card_template.md): A flexible container that can be used to display content in a variety of ways.
+
+- [Dialog](https://raw.githubusercontent.com/curtis-allan/shadcn-fasthtml-framework/refs/heads/main/docs/md/dialog_template.md): A dialog is a type of modal that appears in front of an app's content to provide critical information or ask for a decision.
+
+- [Input](https://raw.githubusercontent.com/curtis-allan/shadcn-fasthtml-framework/refs/heads/main/docs/md/input_template.md): An input is a component that allows users to enter text into a form.
+
+- [Label](https://raw.githubusercontent.com/curtis-allan/shadcn-fasthtml-framework/refs/heads/main/docs/md/label_template.md): A label is a component that provides a name or title for an input.
+
+- [Select](https://raw.githubusercontent.com/curtis-allan/shadcn-fasthtml-framework/refs/heads/main/docs/md/select_template.md): A select is a component that allows users to select an option from a list of options.
+
+- [Sheet](https://raw.githubusercontent.com/curtis-allan/shadcn-fasthtml-framework/refs/heads/main/docs/md/sheet_template.md): A sheet is a component that appears from the bottom of the screen and can be used to display content in a variety of ways.
+
+- [AspectRatio](https://raw.githubusercontent.com/curtis-allan/shadcn-fasthtml-framework/refs/heads/main/docs/md/aspect_ratio_template.md): An aspect ratio is a component that ensures a container maintains a specific aspect ratio.
+
+- [Textarea](https://raw.githubusercontent.com/curtis-allan/shadcn-fasthtml-framework/refs/heads/main/docs/md/textarea_template.md): A textarea is a component that allows users to enter text into a form.
+
+- [Separator](https://raw.githubusercontent.com/curtis-allan/shadcn-fasthtml-framework/refs/heads/main/docs/md/separator_template.md): A separator is a component that separates content in a variety of ways.
+
+- [Switch](https://raw.githubusercontent.com/curtis-allan/shadcn-fasthtml-framework/refs/heads/main/docs/md/switch_template.md): A switch is a component that allows users to toggle a boolean value.
+
+- [Slider](https://raw.githubusercontent.com/curtis-allan/shadcn-fasthtml-framework/refs/heads/main/docs/md/slider_template.md): A slider is a component that allows users to select a value from a range of values.
+
+- [Table](https://raw.githubusercontent.com/curtis-allan/shadcn-fasthtml-framework/refs/heads/main/docs/md/table_template.md): A table is a component that allows users to display and interact with tabular data.
+
+- [Tabs](https://raw.githubusercontent.com/curtis-allan/shadcn-fasthtml-framework/refs/heads/main/docs/md/tabs_template.md): A tab is a component that allows users to switch between different views or content.
+
+- [Toast](https://raw.githubusercontent.com/curtis-allan/shadcn-fasthtml-framework/refs/heads/main/docs/md/toast_template.md): A toast is a component that displays a short message to the user.
+
+- [Carousel](https://raw.githubusercontent.com/curtis-allan/shadcn-fasthtml-framework/refs/heads/main/docs/md/carousel_template.md): A carousel is a component that allows users to scroll through a list of items.
+
+- [Checkbox](https://raw.githubusercontent.com/curtis-allan/shadcn-fasthtml-framework/refs/heads/main/docs/md/checkbox_template.md): A checkbox is a component that allows users to select one or more options from a list.
+
+- [Avatar](https://raw.githubusercontent.com/curtis-allan/shadcn-fasthtml-framework/refs/heads/main/docs/md/avatar_template.md): An avatar is a component that displays a user's profile picture.
+
+- [Radio](https://raw.githubusercontent.com/curtis-allan/shadcn-fasthtml-framework/refs/heads/main/docs/md/radio_template.md): A radio is a component that allows users to select one option from a list of options.
+
+- [Progress](https://raw.githubusercontent.com/curtis-allan/shadcn-fasthtml-framework/refs/heads/main/docs/md/progress_template.md): A progress is a component that displays the progress of a task.
+
+- [ScrollArea](https://raw.githubusercontent.com/curtis-allan/shadcn-fasthtml-framework/refs/heads/main/docs/md/scroll_area_template.md): A scroll area is a component that allows users to scroll through content.
+
+- [Badge](https://raw.githubusercontent.com/curtis-allan/shadcn-fasthtml-framework/refs/heads/main/docs/md/badge_template.md): A badge is a component that displays a small amount of information.

llms.txt

@@ -0,0 +1,26 @@
+# Shad4FastHtml
+
+> Shad4FastHtml is a python package that integrates Shadcn/UI components with FastHtml. It provides the same styling as the Shadcn/UI library, but doesn't require using React/ Radix UI primitives.
+ This is done by using vanilla javascript to add functionality to the components. This library aims to be functionally equivalent to Shadcn/UI, but some caveats apply.
+
+Things to remember when using Shad4FastHtml components:
+
+- Before using a Shad4FastHtml component, make sure the `ShadHead()` function is added to the app headers.
+- Ensure that the `pico` parameter is set to `False` when creating the app (i.e. `app, rt = fast_app(pico=False, hdrs=(ShadHead(),))`).
+- TailwindCSS styles must be included in the app headers. There are scripts available in the package to assist with local setup if needed. Otherwise, the tailwind cdn is available.
+- Component implementation differs from one to another, so refer to the documentation for each component to see how it should be used.
+- When using a component in the standard Shadcn/UI layout, make sure the top component has the attribute `standard` set to `True` so it renders correctly.
+
+## Docs
+
+- [Shad4FastHtml getting started](https://shad4fasthtml.com/docs/getting_started.md): A brief overview of installing and setting up Shad4FastHtml
+- [FastHTML quick start](https://docs.fastht.ml/tutorials/quickstart_for_web_devs.html.md): A brief overview of many FastHTML features
+
+## API
+
+- [Component List](https://shad4fasthtml.com/component_list.txt): A succint list of all current Shad4FastHtml components, with links to their documentation.
+
+## Examples
+
+- [Shad4FastHtml Todo list application](https://shad4fasthtml.com/docs/shad4fast_example.md): Detailed walk-thru of a complete CRUD app in FastHTML showing idiomatic use of FastHTML and HTMX patterns.
+- [Component demos](https://shad4fasthtml.com/docs/demos/comp_demos.py): A series of demos for each component, with code snippets. Provides an `alt` snippet for certain components that have multiple implementation methods.

main.py

@@ -94,6 +94,10 @@
     htmlkw={"lang": "en"},
 )
 
+app.static_route(".md", prefix="/docs",static_path="docs/md")
+
+app.static_route(".py", prefix="/docs/demos", static_path="docs")
+
 toast_setup(app)