1 files changed, 60 insertions, 0 deletions
diff --git a/src/components/textarea_placeholder.rs b/src/components/textarea_placeholder.rs
new file mode 100644
index 0000000..a0bae6d
--- /dev/null
+++ b/src/components/textarea_placeholder.rs
@@ -0,0 +1,60 @@
+use leptos::{
+    IntoView, component,
+    html::Textarea,
+    prelude::{ClassAttribute, ElementChild, GlobalAttributes, NodeRef, NodeRefAttribute},
+    view,
+};
+
+use crate::components::get_id;
+
+#[component]
+pub fn TextareaPlaceholder(
+    label: &'static str,
+    node_ref: NodeRef<Textarea>,
+    #[prop(default = None)] initial_value: Option<String>,
+) -> impl IntoView {
+    let id = get_id();
+
+    view! {
+        <div class="relative h-80">
+            <textarea
+                id=id.to_string()
+                class="\
+                absolute \
+                bottom-0 \
+                bg-gray-200 \
+                border-2 \
+                border-b-2 \
+                border-b-trasparent \
+                border-gray-200 \
+                focus:border-indigo-600 \
+                focus:border-b-transparent \
+                focus:outline-none \
+                h-[300px] \
+                placeholder-transparent \
+                rounded-t-lg \
+                text-gray-900 \
+                w-full \
+                "
+                placeholder="sentinel value"
+                node_ref=node_ref
+            >
+                {initial_value}
+            </textarea>
+
+            <label
+                for=id.to_string()
+                class="\
+                absolute \
+                transition-all \
+                text-sm \
+                text-gray-700 \
+                top-0 \
+                left-0 \
+                "
+            >
+                {label}
+            </label>
+        </div>
+    }
+}