Revamp Color Theme and Docs/Features

README.md

@@ -82,7 +82,7 @@ sudo apt-get install xorg-dev
 You can add `dioxus-sdk` to your application by adding it to your dependencies.
 ```toml
 [dependencies]
-dioxus-sdk=  { version = "0.5", features = [] }
+dioxus-sdk = { version = "0.5", features = [] }
 ```
 
 ## License

examples/README.md

@@ -1,7 +1,7 @@
 # Examples
 
-### [`color_scheme`](./color_scheme/)
-Learn how to use `use_preferred_color_scheme`.
+### [`system_theme`](./system_theme/)
+Learn how to use `use_system_theme`.
 
 ### [`geolocation`](./geolocation/)
 Learn how to use the `geolocation` abstraction.

examples/storage/src/main.rs

@@ -1,5 +1,4 @@
 use dioxus::prelude::*;
-use dioxus_router::prelude::*;
 use dioxus_sdk::storage::*;
 
 fn main() {

examples/color_scheme/Cargo.toml → examples/system_theme/Cargo.toml

@@ -4,8 +4,8 @@ version = "0.1.0"
 edition = "2021"
 
 [dependencies]
-dioxus-sdk = { workspace = true, features = ["color_scheme"] }
-dioxus = { workspace = true, features = ["web"]}
+dioxus-sdk = { workspace = true, features = ["system_theme"] }
+dioxus = { workspace = true, features = ["desktop"]}
 
 log = "0.4.6"
 

examples/system_theme/src/main.rs

@@ -0,0 +1,47 @@
+use dioxus::prelude::*;
+use dioxus_sdk::theme::use_system_theme;
+
+fn main() {
+    // init debug tool for WebAssembly
+    wasm_logger::init(wasm_logger::Config::default());
+    console_error_panic_hook::set_once();
+
+    launch(App);
+}
+
+#[component]
+fn App() -> Element {
+    let theme = use_system_theme();
+
+    let theme_text = match theme() {
+        Ok(theme) => rsx! { h3 { "Your system theme is {theme}." } },
+        Err(err) => rsx! { h3 {"Error getting system theme: {err:?}" } },
+    };
+
+    rsx!(
+        div {
+            style: "text-align: center;",
+            h1 { "🌗 Dioxus 🚀" }
+            {theme_text}
+        }
+
+        Other {}
+    )
+}
+
+#[component]
+fn Other() -> Element {
+    let theme = use_system_theme();
+
+    let theme_text = match theme() {
+        Ok(theme) => rsx! { h3 { "Your system theme x2 is {theme}." } },
+        Err(err) => rsx! { h3 {"Error getting system theme: {err:?}" } },
+    };
+
+    rsx!(
+        div {
+            style: "text-align: center;",
+            {theme_text}
+        }
+    )
+}

examples/use_window_size/Cargo.toml → examples/window_size/Cargo.toml

@@ -4,7 +4,7 @@ version = "0.1.0"
 edition = "2021"
 
 [dependencies]
-dioxus-sdk = { workspace = true, features = ["use_window_size"] }
+dioxus-sdk = { workspace = true, features = ["window_size"] }
 dioxus = { workspace = true }
 
 [features]

examples/use_window_size/src/main.rs → examples/window_size/src/main.rs

@@ -2,15 +2,17 @@ use dioxus::prelude::*;
 use dioxus_sdk::utils::window::{get_window_size, use_window_size};
 
 fn main() {
-    launch(app);
+    launch(App);
 }
 
-fn app() -> Element {
+#[component]
+fn App() -> Element {
     let initial_size = use_signal(get_window_size);
     let window_size = use_window_size();
 
     rsx!(
-        div { style: "text-align: center;",
+        div {
+            style: "text-align: center;",
             h1 { "↕️ Window Size Utilities ↔️" }
             h3 { "Initial Size" }
             p { "Width: {initial_size().width}" }

sdk/Cargo.toml

@@ -34,14 +34,20 @@ geolocation = [
     "web-sys/PositionOptions",
     "dep:wasm-bindgen",
 ]
-color_scheme = [
+system_theme = [
+    # Shared
+    "dep:futures",
+
+    # Desktop (not linux)
+    "dep:dioxus-desktop",
+
     # Wasm
     "web-sys/Window",
     "web-sys/MediaQueryList",
     "dep:wasm-bindgen",
     "dep:wasm-bindgen-futures",
 ]
-use_window_size = [
+window_size = [
     # Shared
     "dep:futures-util",
 
@@ -70,6 +76,7 @@ storage = [
     "dep:tokio",
     "tokio/sync",
     "dep:yazi",
+    "web-sys/Storage",
     "web-sys/StorageEvent",
     "dep:serde",
     "dep:futures-util",
@@ -94,21 +101,24 @@ timing = [
 
 # CI testing
 wasm-testing = [
-    "color_scheme",
+    "system_theme",
     "geolocation",
     "channel",
-    "use_window_size",
+    "window_size",
     "timing",
     "i18n",
+    "storage",
 ]
 desktop-testing = [
+    "system_theme",
     "clipboard",
     "notifications",
     "geolocation",
     "channel",
-    "use_window_size",
+    "window_size",
     "i18n",
     "timing",
+    "storage",
 ]
 
 
@@ -131,7 +141,7 @@ notify-rust = { version = "4.8.0", optional = true }
 uuid = { version = "1.3.2", optional = true }
 async-broadcast = { version = "0.5.1", optional = true }
 
-# Used by: geolocation, storage
+# Used by: geolocation, storage, timing, window_size, system_theme
 futures = { version = "0.3.28", features = ["std"], optional = true }
 futures-util = { version = "0.3.28", optional = true }
 
@@ -144,7 +154,7 @@ unic-langid = { version = "0.9.1", features = ["serde"], optional = true }
 rustc-hash = { version = "1.1.0", optional = true }
 postcard = { version = "1.0.2", features = ["use-std"], optional = true }
 once_cell = { version = "1.17.0", optional = true }
-dioxus-signals = { version = "0.5.0-alpha.2", features = [
+dioxus-signals = { version = "0.5.1", features = [
     "serialize",
 ], optional = true }
 
@@ -170,7 +180,7 @@ windows = { version = "0.48.0", optional = true }
 
 [target.'cfg(target_family = "wasm")'.dependencies]
 
-# Used by: color_scheme, geolocation, use_window_size
+# Used by: color_scheme, geolocation, window_size
 web-sys = { version = "0.3.60", optional = true }
 wasm-bindgen = { version = "0.2.87", optional = true }
 wasm-bindgen-futures = { version = "0.4.35", optional = true }
@@ -184,18 +194,19 @@ uuid = { version = "1.3.2", features = ["js"] }
 # Used by: timing
 gloo-timers = { version = "0.3.0", optional = true, features = ["futures"] }
 
-[target.'cfg(not(target_arch = "wasm32"))'.dependencies]
+[target.'cfg(not(target_family = "wasm"))'.dependencies]
+
 # Used by: storage
 directories = { version = "4.0.1", optional = true }
 
-# Used by: use_window_size
+# Used by: window_size, system_theme
 dioxus-desktop = { workspace = true, optional = true }
 
 # # # # #
 # Docs. #
 # # # # #
 
 [package.metadata.docs.rs]
-default-target = "x86_64-pc-windows-msvc"
+targets = ["x86_64-pc-windows-msvc", "wasm32-unknown-unknown"]
 no-default-features = true
-features = ["desktop-testing"]
+features = ["desktop-testing", "wasm-testing"]

sdk/src/clipboard/mod.rs

@@ -1,3 +1,5 @@
+//! Interact with the clipboard.
+
 cfg_if::cfg_if! {
     if #[cfg(not(target_family = "wasm"))] {
         mod use_clipboard;

sdk/src/clipboard/use_clipboard.rs

@@ -42,7 +42,7 @@ impl UseClipboard {
 ///
 /// # Examples
 ///
-/// ```ignore
+/// ```rust,ignore
 /// use dioxus_sdk::clipboard::use_clipboard;
 ///
 /// // Get a handle to the clipboard

sdk/src/geolocation/mod.rs

@@ -1,3 +1,5 @@
+//! Interact with location services.
+
 cfg_if::cfg_if! {
     if #[cfg(any(windows, target_family = "wasm"))] {
         pub mod core;

sdk/src/i18n/mod.rs

@@ -1,3 +1,5 @@
+//! Provide translations for your app.
+
 mod tanslate;
 mod use_i18n;
 mod use_init_i18n;