clean up sheets a bit

basicmachines-co · Oct 28, 2024 · ce1963c · ce1963c
1 parent 2f9ac84
commit ce1963c
Show file tree

Hide file tree

Showing 5 changed files with 6 additions and 13 deletions.
diff --git a/components/ui/Sheet.jinja b/components/ui/Sheet.jinja
@@ -1,5 +1,4 @@
 {#def
-    id: str = "sheet",
+    className: str = "",
 #}
-<!-- Sheet -->
-<div x-data="{ open: false }" {{ attrs.render() }}>{{ content }}</div>
+<div x-data="{ open: false }" {{ attrs.render() }} class="{{ className }}">{{ content }}</div>
diff --git a/components/ui/SheetClose.jinja b/components/ui/SheetClose.jinja
@@ -1,8 +1,6 @@
 {#def
-    id: str = "sheet-close",
     className: str = "",
 #}
-<!-- SheetClose -->
 <button
     type="button"
     @click="open = false"

diff --git a/components/ui/SheetContent.jinja b/components/ui/SheetContent.jinja
@@ -3,7 +3,6 @@
     className: str = "",
 #}
 <SheetOverlay/>
-<!-- SheetContent -->
 <div
     x-show="open"
     @keydown.escape.window="open = false"

diff --git a/components/ui/SheetTrigger.jinja b/components/ui/SheetTrigger.jinja
@@ -1,5 +1,4 @@
 {#def
     className: str = "",
 #}
-<!-- SheetTrigger -->
 <div @click="open = true" class="inline-block {{ className }}">{{ content }}</div>
diff --git a/documentation/docs/components/sheet.md b/documentation/docs/components/sheet.md
@@ -1,6 +1,6 @@
 # Sheet
 
-Extends the Dialog component to display content that complements the main content of the screen.
+Displays content one side of the screen in a modal dialog.
 
 ## Preview
 
@@ -9,16 +9,14 @@ src="{{ preview_url}}/components/Sheet"
 style="width: 100%; height: 400px; border: none;">
 </iframe>
 
-The value of the Sheeted item is stored in a hidden input field. 
-
 ## Props
 
 | Component        | Prop        | Type   | Default           | Description                                    |
 |------------------|-------------|--------|-------------------|------------------------------------------------|
-| Sheet            | `id`        | String | `"sheet"`         | Unique identifier for the sheet component.     |
-| SheetClose       | `id`        | String | `"sheet-close"`   | Unique identifier for the close button.        |
+| Sheet            | `className` | String | `"sheet"`         | Additional CSS classes for customization.      |
+| SheetClose       | `className` | String | `"sheet-close"`   | Additional CSS classes for customization.      |
 | SheetClose       | `className` | String | `""`              | Additional CSS classes for customization.      |
-| SheetContent     | `id`        | String | `"sheet-content"` | Unique identifier for the content.             |
+| SheetContent     | `className` | String | `"sheet-content"` | Additional CSS classes for customization.      |
 | SheetContent     | `side`      | String | `"right"`         | Position of the sheet (top/bottom/left/right). |
 | SheetContent     | `className` | String | `""`              | Additional CSS classes for customization.      |
 | SheetDescription | `className` | String | `""`              | Additional CSS classes for customization.      |