feat: implement into for all applicable props

src/components/panel.rs

@@ -0,0 +1,37 @@
+use leptos::prelude::*;
+
+/// A panel for use in visual separation of a group of components. A `Panel` arranges
+/// a series of elements within a shaded rectangle using the flexbox column layout.
+/// 
+/// It takes a series of children. Usually these would be in the form of a `Row` element,
+/// which will arrange its own children in a row within the panel, however it can be any
+/// HTML element.
+/// 
+/// Example:
+/// ```
+/// view! {
+///     <Panel>
+///         <Row>
+///             <OutlinedTextField
+///                 // ...
+///             />
+///             <CheckboxList
+///                 // ...
+///             />
+///         </Row>
+///     </Panel>
+/// }
+/// ```
+#[component]
+pub fn Panel(
+    children: Children
+) -> impl IntoView {
+    view! {
+        <div
+            class="flex flex-col gap-2 p-2 m-4 flex-1
+                border-1 border-gray-600/10
+                rounded-md shadow-[0_0_6px_rgba(0,0,0,0.50)]">
+            {children()}
+        </div>
+    }
+}