diff --git a/thaw/src/date_picker/mod.rs b/thaw/src/date_picker/mod.rs
index de35d39..bc1a362 100644
--- a/thaw/src/date_picker/mod.rs
+++ b/thaw/src/date_picker/mod.rs
@@ -13,9 +13,9 @@ pub fn DatePicker(
     #[prop(attrs)] attrs: Vec<(&'static str, Attribute)>,
 ) -> impl IntoView {
     mount_style("date-picker", include_str!("./date-picker.css"));
-    let date_picker_ref = create_node_ref::<html::Div>();
-    let is_show_panel = create_rw_signal(false);
-    let show_date_text = create_rw_signal(String::new());
+    let date_picker_ref = NodeRef::<html::Div>::new();
+    let is_show_panel = RwSignal::new(false);
+    let show_date_text = RwSignal::new(String::new());
     let show_date_format = "%Y-%m-%d";
     let update_show_date_text = move || {
         value.with_untracked(move |date| {
@@ -27,7 +27,7 @@ pub fn DatePicker(
     };
     update_show_date_text();
     let panel_ref = ComponentRef::<PanelRef>::default();
-    let panel_selected_date = create_rw_signal(None::<NaiveDate>);
+    let panel_selected_date = RwSignal::new(None::<NaiveDate>);
     _ = panel_selected_date.watch(move |date| {
         let text = date.as_ref().map_or(String::new(), |date| {
             date.format(show_date_format).to_string()
diff --git a/thaw/src/date_picker/panel/date_panel.rs b/thaw/src/date_picker/panel/date_panel.rs
index 7691bfb..8b1df88 100644
--- a/thaw/src/date_picker/panel/date_panel.rs
+++ b/thaw/src/date_picker/panel/date_panel.rs
@@ -1,5 +1,5 @@
 use super::PanelVariant;
-use crate::{Button, ButtonSize, ButtonAppearance, CalendarItemDate};
+use crate::{Button, ButtonAppearance, ButtonSize, CalendarItemDate};
 use chrono::{Datelike, Days, Month, Months, NaiveDate};
 use leptos::*;
 use std::ops::Deref;
@@ -12,7 +12,7 @@ pub fn DatePanel(
     close_panel: Callback<Option<NaiveDate>>,
     panel_variant: RwSignal<PanelVariant>,
 ) -> impl IntoView {
-    let dates = create_memo(move |_| {
+    let dates = Memo::new(move |_| {
         let show_date = show_date.get();
         let show_date_month = show_date.month();
         let mut dates = vec![];
@@ -167,7 +167,7 @@ pub fn DatePanel(
 
 #[component]
 fn DatePanelItem(value: RwSignal<Option<NaiveDate>>, date: CalendarItemDate) -> impl IntoView {
-    let is_selected = create_memo({
+    let is_selected = Memo::new({
         let date = date.clone();
         move |_| value.with(|value_date| value_date.as_ref() == Some(date.deref()))
     });
diff --git a/thaw/src/date_picker/panel/mod.rs b/thaw/src/date_picker/panel/mod.rs
index ddba399..f19b614 100644
--- a/thaw/src/date_picker/panel/mod.rs
+++ b/thaw/src/date_picker/panel/mod.rs
@@ -20,34 +20,7 @@ pub fn Panel(
     #[prop(optional)] comp_ref: ComponentRef<PanelRef>,
 ) -> impl IntoView {
     let config_provider = ConfigInjection::use_();
-    // let css_vars = create_memo(move |_| {
-    //     let mut css_vars = String::new();
-    //     theme.with(|theme| {
-    //         css_vars.push_str(&format!(
-    //             "--thaw-background-color-today: {};",
-    //             theme.common.color_primary
-    //         ));
-    //         css_vars.push_str(&format!(
-    //             "--thaw-font-color-other-month: {};",
-    //             theme.date_picker.panel_other_month_font_color,
-    //         ));
-    //         css_vars.push_str(&format!(
-    //             "--thaw-background-color: {};",
-    //             theme.date_picker.panel_background_color
-    //         ));
-    //         css_vars.push_str(&format!(
-    //             "--thaw-item-background-color-hover: {};",
-    //             theme.date_picker.panel_date_item_background_color_hover
-    //         ));
-    //         css_vars.push_str(&format!(
-    //             "--thaw-item-border-color: {};",
-    //             theme.date_picker.panel_border_color
-    //         ));
-    //     });
-    //     css_vars
-    // });
-
-    let panel_ref = create_node_ref::<html::Div>();
+    let panel_ref = NodeRef::<html::Div>::new();
     #[cfg(any(feature = "csr", feature = "hydrate"))]
     {
         use leptos::wasm_bindgen::__rt::IntoJsResult;
@@ -82,8 +55,8 @@ pub fn Panel(
         _ = date_picker_ref;
         _ = panel_ref;
     }
-    let panel_variant = create_rw_signal(PanelVariant::Date);
-    let show_date = create_rw_signal(selected_date.get_untracked().unwrap_or(now_date()));
+    let panel_variant = RwSignal::new(PanelVariant::Date);
+    let show_date = RwSignal::new(selected_date.get_untracked().unwrap_or(now_date()));
     comp_ref.load(PanelRef {
         show_date,
         variant: panel_variant,
diff --git a/thaw/src/date_picker/panel/month_panel.rs b/thaw/src/date_picker/panel/month_panel.rs
index 9b32170..ef35d69 100644
--- a/thaw/src/date_picker/panel/month_panel.rs
+++ b/thaw/src/date_picker/panel/month_panel.rs
@@ -1,5 +1,5 @@
 use super::PanelVariant;
-use crate::{Button, ButtonSize, ButtonAppearance};
+use crate::{Button, ButtonAppearance, ButtonSize};
 use chrono::{Datelike, Month, Months, NaiveDate};
 use leptos::*;
 
@@ -8,7 +8,7 @@ pub fn MonthPanel(
     date_panel_show_date: RwSignal<NaiveDate>,
     panel_variant: RwSignal<PanelVariant>,
 ) -> impl IntoView {
-    let show_date = create_rw_signal(date_panel_show_date.get_untracked());
+    let show_date = RwSignal::new(date_panel_show_date.get_untracked());
     let previous_year = move |_| {
         show_date.update(|date| {
             *date = *date - Months::new(12);
@@ -72,7 +72,7 @@ pub fn MonthPanel(
 
 #[component]
 fn MonthPanelItem(date_panel_show_date: RwSignal<NaiveDate>, month: Month) -> impl IntoView {
-    let is_selected = create_memo(move |_| {
+    let is_selected = Memo::new(move |_| {
         date_panel_show_date.with(|date| date.month() == month.number_from_month())
     });