stable examples change (#2497)

This commit is contained in:
Sam Judelson
2024-04-04 23:11:28 -04:00
committed by GitHub
parent a82af6110f
commit ca07d29db5
90 changed files with 168 additions and 1089 deletions

View File

@@ -7,7 +7,7 @@ edition = "2021"
codegen-units = 1
lto = true
[dependencies]
[dependencies]
leptos = { path = "../../leptos", features = ["csr"] }
console_log = "1"
log = "0.4"

View File

@@ -8,7 +8,7 @@ codegen-units = 1
lto = true
[dependencies]
leptos = { path = "../../leptos", features = ["csr", "nightly"] }
leptos = { path = "../../leptos", features = ["csr"] }
console_log = "1"
log = "0.4"
console_error_panic_hook = "0.1.7"

View File

@@ -14,9 +14,9 @@ pub fn SimpleCounter(
view! {
<div>
<button on:click=move |_| set_value(0)>"Clear"</button>
<button on:click=move |_| set_value.set(0)>"Clear"</button>
<button on:click=move |_| set_value.update(|value| *value -= step)>"-1"</button>
<span>"Value: " {value} "!"</span>
<span>"Value: " {move || value.get()} "!"</span>
<button on:click=move |_| set_value.update(|value| *value += step)>"+1"</button>
</div>
}

View File

@@ -31,7 +31,6 @@ simple_logger = "4.3"
tracing = { version = "0.1", optional = true }
[features]
default = ["nightly"]
hydrate = ["leptos/hydrate", "leptos_meta/hydrate", "leptos_router/hydrate"]
ssr = [
"dep:actix-files",
@@ -45,7 +44,7 @@ ssr = [
nightly = ["leptos/nightly", "leptos_router/nightly"]
[package.metadata.cargo-all-features]
denylist = ["actix-files", "actix-web", "leptos_actix", "nightly"]
denylist = ["actix-files", "actix-web", "leptos_actix"]
skip_feature_sets = [["ssr", "hydrate"]]
[package.metadata.leptos]

View File

@@ -4,7 +4,7 @@ version = "0.1.0"
edition = "2021"
[dependencies]
leptos = { path = "../../leptos", features = ["csr", "nightly"] }
leptos = { path = "../../leptos", features = ["csr"] }
log = "0.4"
console_log = "1"
console_error_panic_hook = "0.1.7"

View File

@@ -16,14 +16,14 @@ pub fn Counters() -> impl IntoView {
provide_context(CounterUpdater { set_counters });
let add_counter = move |_| {
let id = next_counter_id();
let id = next_counter_id.get();
let sig = create_signal(0);
set_counters.update(move |counters| counters.push((id, sig)));
set_next_counter_id.update(|id| *id += 1);
};
let add_many_counters = move |_| {
let next_id = next_counter_id();
let next_id = next_counter_id.get();
let new_counters = (next_id..next_id + MANY_COUNTERS).map(|id| {
let signal = create_signal(0);
(id, signal)
@@ -53,17 +53,17 @@ pub fn Counters() -> impl IntoView {
<span>{move ||
counters.get()
.iter()
.map(|(_, (count, _))| count())
.map(|(_, (count, _))| count.get())
.sum::<i32>()
.to_string()
}</span>
" from "
<span>{move || counters().len().to_string()}</span>
<span>{move || counters.get().len().to_string()}</span>
" counters."
</p>
<ul>
<For
each=counters
each=move||counters.get()
key=|counter| counter.0
children=move |(id, (value, set_value)): (usize, (ReadSignal<i32>, WriteSignal<i32>))| {
view! {
@@ -85,7 +85,8 @@ fn Counter(
let CounterUpdater { set_counters } = use_context().unwrap();
let input = move |ev| {
set_value(event_target_value(&ev).parse::<i32>().unwrap_or_default())
set_value
.set(event_target_value(&ev).parse::<i32>().unwrap_or_default())
};
// this will run when the scope is disposed, i.e., when this row is deleted

View File

@@ -1,20 +0,0 @@
# Generated by Cargo
# will have compiled files and executables
/target/
# Remove Cargo.lock from gitignore if creating an executable, leave it for libraries
# More information here https://doc.rust-lang.org/cargo/guide/cargo-toml-vs-cargo-lock.html
Cargo.lock
# These are backup files generated by rustfmt
**/*.rs.bk
# Support playwright testing
node_modules/
test-results/
end2end/playwright-report/
playwright/.cache/
pnpm-lock.yaml
# Support trunk
dist

View File

@@ -1,28 +0,0 @@
[package]
name = "counters_stable"
version = "0.1.0"
edition = "2021"
rust-version = "1.75"
[dependencies]
leptos = { path = "../../leptos", features = ["csr"] }
leptos_meta = { path = "../../meta", features = ["csr"] }
log = "0.4"
console_log = "1"
console_error_panic_hook = "0.1.7"
[dev-dependencies]
wasm-bindgen = "0.2"
wasm-bindgen-test = "0.3.37"
pretty_assertions = "1.4.0"
[dev-dependencies.web-sys]
features = [
"Event",
"EventInit",
"EventTarget",
"HtmlElement",
"HtmlInputElement",
"XPathResult",
]
version = "0.3.64"

View File

@@ -1,18 +0,0 @@
extend = [
{ path = "../cargo-make/main.toml" },
{ path = "../cargo-make/wasm-test.toml" },
{ path = "../cargo-make/trunk_server.toml" },
{ path = "../cargo-make/playwright-test.toml" },
]
[tasks.build]
toolchain = "stable"
command = "cargo"
args = ["build-all-features"]
install_crate = "cargo-all-features"
[tasks.check]
toolchain = "stable"
command = "cargo"
args = ["check-all-features"]
install_crate = "cargo-all-features"

View File

@@ -1,11 +0,0 @@
# Leptos Counters Example on Rust Stable
This example showcases a basic Leptos app with many counters. It is a good example of how to setup a basic reactive app with signals and effects, and how to interact with browser events. Unlike the other counters example, it will compile on Rust stable, because it has the `stable` feature enabled.
## Getting Started
See the [Examples README](../README.md) for setup and run instructions.
## Quick Start
Run `trunk serve --open` to run this example.

View File

@@ -1,4 +0,0 @@
node_modules/
/test-results/
/playwright-report/
/playwright/.cache/

View File

@@ -1,83 +0,0 @@
{
"name": "grip",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "grip",
"devDependencies": {
"@playwright/test": "^1.35.1"
}
},
"node_modules/.pnpm/@playwright+test@1.33.0": {
"extraneous": true
},
"node_modules/.pnpm/@types+node@20.2.1/node_modules/@types/node": {
"version": "20.2.1",
"extraneous": true,
"license": "MIT"
},
"node_modules/.pnpm/playwright-core@1.33.0/node_modules/playwright-core": {
"version": "1.33.0",
"extraneous": true,
"license": "Apache-2.0",
"bin": {
"playwright": "cli.js"
},
"engines": {
"node": ">=14"
}
},
"node_modules/@playwright/test": {
"version": "1.35.1",
"resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.35.1.tgz",
"integrity": "sha512-b5YoFe6J9exsMYg0pQAobNDR85T1nLumUYgUTtKm4d21iX2L7WqKq9dW8NGJ+2vX0etZd+Y7UeuqsxDXm9+5ZA==",
"dev": true,
"dependencies": {
"@types/node": "*",
"playwright-core": "1.35.1"
},
"bin": {
"playwright": "cli.js"
},
"engines": {
"node": ">=16"
},
"optionalDependencies": {
"fsevents": "2.3.2"
}
},
"node_modules/@types/node": {
"version": "20.3.1",
"resolved": "https://registry.npmjs.org/@types/node/-/node-20.3.1.tgz",
"integrity": "sha512-EhcH/wvidPy1WeML3TtYFGR83UzjxeWRen9V402T8aUGYsCHOmfoisV3ZSg03gAFIbLq8TnWOJ0f4cALtnSEUg==",
"dev": true
},
"node_modules/fsevents": {
"version": "2.3.2",
"resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
"integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
"dev": true,
"hasInstallScript": true,
"optional": true,
"os": [
"darwin"
],
"engines": {
"node": "^8.16.0 || ^10.6.0 || >=11.0.0"
}
},
"node_modules/playwright-core": {
"version": "1.35.1",
"resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.35.1.tgz",
"integrity": "sha512-pNXb6CQ7OqmGDRspEjlxE49w+4YtR6a3X6mT1hZXeJHWmsEz7SunmvZeiG/+y1yyMZdHnnn73WKYdtV1er0Xyg==",
"dev": true,
"bin": {
"playwright-core": "cli.js"
},
"engines": {
"node": ">=16"
}
}
}
}

View File

@@ -1,7 +0,0 @@
{
"private": "true",
"scripts": {},
"devDependencies": {
"@playwright/test": "^1.35.1"
}
}

View File

@@ -1,77 +0,0 @@
import { defineConfig, devices } from "@playwright/test";
/**
* Read environment variables from file.
* https://github.com/motdotla/dotenv
*/
// require('dotenv').config();
/**
* See https://playwright.dev/docs/test-configuration.
*/
export default defineConfig({
testDir: "./tests",
/* Run tests in files in parallel */
fullyParallel: true,
/* Fail the build on CI if you accidentally left test.only in the source code. */
forbidOnly: !process.env.DEV,
/* Retry on CI only */
retries: process.env.DEV ? 0 : 10,
/* Opt out of parallel tests on CI. */
workers: process.env.DEV ? 1 : 1,
/* Reporter to use. See https://playwright.dev/docs/test-reporters */
reporter: [["html", { open: "never" }], ["list"]],
/* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
use: {
/* Base URL to use in actions like `await page.goto('/')`. */
baseURL: "http://127.0.0.1:8080",
/* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
trace: "on-first-retry",
},
/* Configure projects for major browsers */
projects: [
{
name: "chromium",
use: { ...devices["Desktop Chrome"] },
},
// {
// name: "firefox",
// use: { ...devices["Desktop Firefox"] },
// },
// {
// name: "webkit",
// use: { ...devices["Desktop Safari"] },
// },
/* Test against mobile viewports. */
// {
// name: 'Mobile Chrome',
// use: { ...devices['Pixel 5'] },
// },
// {
// name: 'Mobile Safari',
// use: { ...devices['iPhone 12'] },
// },
/* Test against branded browsers. */
// {
// name: 'Microsoft Edge',
// use: { ...devices['Desktop Edge'], channel: 'msedge' },
// },
// {
// name: 'Google Chrome',
// use: { ..devices['Desktop Chrome'], channel: 'chrome' },
// },
],
/* Run your local dev server before starting the tests */
// webServer: {
// command: "cd ../ && trunk serve",
// url: "http://127.0.0.1:8080",
// reuseExistingServer: false, //!process.env.CI,
// },
});

View File

@@ -1,19 +0,0 @@
import { test, expect } from "@playwright/test";
import { CountersPage } from "./fixtures/counters_page";
test.describe("Add 1000 Counters", () => {
test("should increase the number of counters", async ({ page }) => {
const ui = new CountersPage(page);
await Promise.all([
await ui.goto(),
await ui.addOneThousandCountersButton.waitFor(),
]);
await ui.addOneThousandCounters();
await ui.addOneThousandCounters();
await ui.addOneThousandCounters();
await expect(ui.counters).toHaveText("3000");
});
});

View File

@@ -1,15 +0,0 @@
import { test, expect } from "@playwright/test";
import { CountersPage } from "./fixtures/counters_page";
test.describe("Add Counter", () => {
test("should increase the number of counters", async ({ page }) => {
const ui = new CountersPage(page);
await ui.goto();
await ui.addCounter();
await ui.addCounter();
await ui.addCounter();
await expect(ui.counters).toHaveText("3");
});
});

View File

@@ -1,18 +0,0 @@
import { test, expect } from "@playwright/test";
import { CountersPage } from "./fixtures/counters_page";
test.describe("Clear Counters", () => {
test("should reset the counts", async ({ page }) => {
const ui = new CountersPage(page);
await ui.goto();
await ui.addCounter();
await ui.addCounter();
await ui.addCounter();
await ui.clearCounters();
await expect(ui.total).toHaveText("0");
await expect(ui.counters).toHaveText("0");
});
});

View File

@@ -1,16 +0,0 @@
import { test, expect } from "@playwright/test";
import { CountersPage } from "./fixtures/counters_page";
test.describe("Decrement Count", () => {
test("should decrease the total count", async ({ page }) => {
const ui = new CountersPage(page);
await ui.goto();
await ui.addCounter();
await ui.decrementCount();
await ui.decrementCount();
await ui.decrementCount();
await expect(ui.total).toHaveText("-3");
});
});

View File

@@ -1,30 +0,0 @@
import { test, expect } from "@playwright/test";
import { CountersPage } from "./fixtures/counters_page";
test.describe("Enter Count", () => {
test("should increase the total count", async ({ page }) => {
const ui = new CountersPage(page);
await ui.goto();
await ui.addCounter();
await ui.enterCount("5");
await expect(ui.total).toHaveText("5");
await expect(ui.counters).toHaveText("1");
});
test("should decrease the total count", async ({ page }) => {
const ui = new CountersPage(page);
await ui.goto();
await ui.addCounter();
await ui.addCounter();
await ui.addCounter();
await ui.enterCount("100");
await ui.enterCount("100", 1);
await ui.enterCount("100", 2);
await ui.enterCount("50", 1);
await expect(ui.total).toHaveText("250");
});
});

View File

@@ -1,98 +0,0 @@
import { expect, Locator, Page } from "@playwright/test";
export class CountersPage {
readonly page: Page;
readonly addCounterButton: Locator;
readonly addOneThousandCountersButton: Locator;
readonly clearCountersButton: Locator;
readonly incrementCountButton: Locator;
readonly counterInput: Locator;
readonly decrementCountButton: Locator;
readonly removeCountButton: Locator;
readonly total: Locator;
readonly counters: Locator;
constructor(page: Page) {
this.page = page;
this.addCounterButton = page.locator("button", { hasText: "Add Counter" });
this.addOneThousandCountersButton = page.locator("button", {
hasText: "Add 1000 Counters",
});
this.clearCountersButton = page.locator("button", {
hasText: "Clear Counters",
});
this.decrementCountButton = page.locator("button", {
hasText: "-1",
});
this.incrementCountButton = page.locator("button", {
hasText: "+1",
});
this.removeCountButton = page.locator("button", {
hasText: "x",
});
this.total = page.getByTestId("total");
this.counters = page.getByTestId("counters");
this.counterInput = page.getByRole("textbox");
}
async goto() {
await this.page.goto("/");
}
async addCounter() {
await Promise.all([
this.addCounterButton.waitFor(),
this.addCounterButton.click(),
]);
}
async addOneThousandCounters() {
this.addOneThousandCountersButton.click();
}
async decrementCount(index: number = 0) {
await Promise.all([
this.decrementCountButton.nth(index).waitFor(),
this.decrementCountButton.nth(index).click(),
]);
}
async incrementCount(index: number = 0) {
await Promise.all([
this.incrementCountButton.nth(index).waitFor(),
this.incrementCountButton.nth(index).click(),
]);
}
async clearCounters() {
await Promise.all([
this.clearCountersButton.waitFor(),
this.clearCountersButton.click(),
]);
}
async enterCount(count: string, index: number = 0) {
await Promise.all([
this.counterInput.nth(index).waitFor(),
this.counterInput.nth(index).fill(count),
]);
}
async removeCounter(index: number = 0) {
await Promise.all([
this.removeCountButton.nth(index).waitFor(),
this.removeCountButton.nth(index).click(),
]);
}
}

View File

@@ -1,16 +0,0 @@
import { test, expect } from "@playwright/test";
import { CountersPage } from "./fixtures/counters_page";
test.describe("Increment Count", () => {
test("should increase the total count", async ({ page }) => {
const ui = new CountersPage(page);
await ui.goto();
await ui.addCounter();
await ui.incrementCount();
await ui.incrementCount();
await ui.incrementCount();
await expect(ui.total).toHaveText("3");
});
});

View File

@@ -1,17 +0,0 @@
import { test, expect } from "@playwright/test";
import { CountersPage } from "./fixtures/counters_page";
test.describe("Remove Counter", () => {
test("should decrement the number of counters", async ({ page }) => {
const ui = new CountersPage(page);
await ui.goto();
await ui.addCounter();
await ui.addCounter();
await ui.addCounter();
await ui.removeCounter(1);
await expect(ui.counters).toHaveText("2");
});
});

View File

@@ -1,19 +0,0 @@
import { test, expect } from "@playwright/test";
import { CountersPage } from "./fixtures/counters_page";
test.describe("View Counters", () => {
test("should see the title", async ({ page }) => {
const ui = new CountersPage(page);
await ui.goto();
await expect(page).toHaveTitle("Counters (Stable)");
});
test("should see the initial counts", async ({ page }) => {
const counters = new CountersPage(page);
await counters.goto();
await expect(counters.total).toHaveText("0");
await expect(counters.counters).toHaveText("0");
});
});

View File

@@ -1,7 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<link data-trunk rel="rust" data-wasm-opt="z" data-weak-refs />
</head>
<body></body>
</html>

View File

@@ -1,11 +0,0 @@
{
"private": "true",
"scripts": {
"start-server": "trunk serve",
"e2e": "cargo make test-playwright",
"e2e:auto-start": "start-server-and-test start-server http://127.0.0.1:8080 e2e"
},
"devDependencies": {
"start-server-and-test": "^1.15.4"
}
}

View File

@@ -1,118 +0,0 @@
use leptos::*;
use leptos_meta::*;
const MANY_COUNTERS: usize = 1000;
type CounterHolder = Vec<(usize, (ReadSignal<i32>, WriteSignal<i32>))>;
#[derive(Copy, Clone)]
struct CounterUpdater {
set_counters: WriteSignal<CounterHolder>,
}
#[component]
pub fn Counters() -> impl IntoView {
let (next_counter_id, set_next_counter_id) = create_signal(0);
let (counters, set_counters) = create_signal::<CounterHolder>(vec![]);
provide_context(CounterUpdater { set_counters });
let add_counter = move |_| {
let id = next_counter_id.get();
let sig = create_signal(0);
set_counters.update(move |counters| counters.push((id, sig)));
set_next_counter_id.update(|id| *id += 1);
};
let add_many_counters = move |_| {
let next_id = next_counter_id.get();
let new_counters = (next_id..next_id + MANY_COUNTERS).map(|id| {
let signal = create_signal(0);
(id, signal)
});
set_counters.update(move |counters| counters.extend(new_counters));
set_next_counter_id.update(|id| *id += MANY_COUNTERS);
};
let clear_counters = move |_| {
set_counters.update(|counters| counters.clear());
};
view! {
<Title text="Counters (Stable)" />
<div>
<button on:click=add_counter>
"Add Counter"
</button>
<button on:click=add_many_counters>
{format!("Add {MANY_COUNTERS} Counters")}
</button>
<button on:click=clear_counters>
"Clear Counters"
</button>
<p>
"Total: "
<span data-testid="total">{move ||
counters.get()
.iter()
.map(|(_, (count, _))| count.get())
.sum::<i32>()
.to_string()
}</span>
" from "
<span data-testid="counters">{move || counters.with(|counters| counters.len()).to_string()}</span>
" counters."
</p>
<ul>
<For
each={move || counters.get()}
key={|counter| counter.0}
children=move |(id, (value, set_value))| {
view! {
<Counter id value set_value/>
}
}
/>
</ul>
</div>
}
}
#[component]
fn Counter(
id: usize,
value: ReadSignal<i32>,
set_value: WriteSignal<i32>,
) -> impl IntoView {
let CounterUpdater { set_counters } = use_context().unwrap();
let input = move |ev| {
set_value
.set(event_target_value(&ev).parse::<i32>().unwrap_or_default())
};
// this will run when the scope is disposed, i.e., when this row is deleted
// because the signal was created in the parent scope, it won't be disposed
// of until the parent scope is. but we no longer need it, so we'll dispose of
// it when this row is deleted, instead. if we don't dispose of it here,
// this memory will "leak," i.e., the signal will continue to exist until the
// parent component is removed. in the case of this component, where it's the
// root, that's the lifetime of the program.
on_cleanup(move || {
log::debug!("deleted a row");
value.dispose();
});
view! {
<li>
<button data-testid="decrement_count" on:click=move |_| set_value.update(move |value| *value -= 1)>"-1"</button>
<input data-testid="counter_input" type="text"
prop:value={move || value.get().to_string()}
on:input=input
/>
<span>{value}</span>
<button data-testid="increment_count" on:click=move |_| set_value.update(move |value| *value += 1)>"+1"</button>
<button data-testid="remove_counter" on:click=move |_| set_counters.update(move |counters| counters.retain(|(counter_id, _)| counter_id != &id))>"x"</button>
</li>
}
}

View File

@@ -1,8 +0,0 @@
use counters_stable::Counters;
use leptos::*;
fn main() {
_ = console_log::init_with_level(log::Level::Debug);
console_error_panic_hook::set_once();
mount_to_body(|| view! { <Counters/> })
}

View File

@@ -1,17 +0,0 @@
use super::*;
use crate::counters_page as ui;
use pretty_assertions::assert_eq;
#[wasm_bindgen_test]
fn should_increase_the_number_of_counters() {
// Given
ui::view_counters();
// When
ui::add_1k_counters();
ui::add_1k_counters();
ui::add_1k_counters();
// Then
assert_eq!(ui::counters(), 3000);
}

View File

@@ -1,17 +0,0 @@
use super::*;
use crate::counters_page as ui;
use pretty_assertions::assert_eq;
#[wasm_bindgen_test]
fn should_increase_the_number_of_counters() {
// Given
ui::view_counters();
// When
ui::add_counter();
ui::add_counter();
ui::add_counter();
// Then
assert_eq!(ui::counters(), 3);
}

View File

@@ -1,19 +0,0 @@
use super::*;
use crate::counters_page as ui;
use pretty_assertions::assert_eq;
#[wasm_bindgen_test]
fn should_reset_the_counts() {
// Given
ui::view_counters();
ui::add_counter();
ui::add_counter();
ui::add_counter();
// When
ui::clear_counters();
// Then
assert_eq!(ui::total(), 0);
assert_eq!(ui::counters(), 0);
}

View File

@@ -1,18 +0,0 @@
use super::*;
use crate::counters_page as ui;
use pretty_assertions::assert_eq;
#[wasm_bindgen_test]
fn should_decrease_the_total_count() {
// Given
ui::view_counters();
ui::add_counter();
// When
ui::decrement_counter(1);
ui::decrement_counter(1);
ui::decrement_counter(1);
// Then
assert_eq!(ui::total(), -3);
}

View File

@@ -1,34 +0,0 @@
use super::*;
use crate::counters_page as ui;
use pretty_assertions::assert_eq;
#[wasm_bindgen_test]
fn should_increase_the_total_count() {
// Given
ui::view_counters();
ui::add_counter();
// When
ui::enter_count(1, 5);
// Then
assert_eq!(ui::total(), 5);
}
#[wasm_bindgen_test]
fn should_decrease_the_total_count() {
// Given
ui::view_counters();
ui::add_counter();
ui::add_counter();
ui::add_counter();
// When
ui::enter_count(1, 100);
ui::enter_count(2, 100);
ui::enter_count(3, 100);
ui::enter_count(1, 50);
// Then
assert_eq!(ui::total(), 250);
}

View File

@@ -1,112 +0,0 @@
use counters_stable::Counters;
use leptos::*;
use wasm_bindgen::JsCast;
use web_sys::{Element, Event, EventInit, HtmlElement, HtmlInputElement};
// Actions
pub fn add_1k_counters() {
find_by_text("Add 1000 Counters").click();
}
pub fn add_counter() {
find_by_text("Add Counter").click();
}
pub fn clear_counters() {
find_by_text("Clear Counters").click();
}
pub fn decrement_counter(index: u32) {
counter_html_element(index, "decrement_count").click();
}
pub fn enter_count(index: u32, count: i32) {
let input = counter_input_element(index, "counter_input");
input.set_value(count.to_string().as_str());
let mut event_init = EventInit::new();
event_init.bubbles(true);
let event = Event::new_with_event_init_dict("input", &event_init).unwrap();
input.dispatch_event(&event).unwrap();
}
pub fn increment_counter(index: u32) {
counter_html_element(index, "increment_count").click();
}
pub fn remove_counter(index: u32) {
counter_html_element(index, "remove_counter").click();
}
pub fn view_counters() {
remove_existing_counters();
mount_to_body(|| view! { <Counters/> });
}
// Results
pub fn counters() -> i32 {
data_test_id("counters").parse::<i32>().unwrap()
}
pub fn title() -> String {
leptos::document().title()
}
pub fn total() -> i32 {
data_test_id("total").parse::<i32>().unwrap()
}
// Internal
fn counter_element(index: u32, text: &str) -> Element {
let selector =
format!("li:nth-child({}) [data-testid=\"{}\"]", index, text);
leptos::document()
.query_selector(&selector)
.unwrap()
.unwrap()
}
fn counter_html_element(index: u32, text: &str) -> HtmlElement {
counter_element(index, text)
.dyn_into::<HtmlElement>()
.unwrap()
}
fn counter_input_element(index: u32, text: &str) -> HtmlInputElement {
counter_element(index, text)
.dyn_into::<HtmlInputElement>()
.unwrap()
}
fn data_test_id(id: &str) -> String {
let selector = format!("[data-testid=\"{}\"]", id);
leptos::document()
.query_selector(&selector)
.unwrap()
.expect("counters not found")
.text_content()
.unwrap()
}
fn find_by_text(text: &str) -> HtmlElement {
let xpath = format!("//*[text()='{}']", text);
let document = leptos::document();
document
.evaluate(&xpath, &document)
.unwrap()
.iterate_next()
.unwrap()
.unwrap()
.dyn_into::<HtmlElement>()
.unwrap()
}
fn remove_existing_counters() {
if let Some(counter) =
leptos::document().query_selector("body div").unwrap()
{
counter.remove();
}
}

View File

@@ -1 +0,0 @@
pub mod counters_page;

View File

@@ -1,18 +0,0 @@
use super::*;
use crate::counters_page as ui;
use pretty_assertions::assert_eq;
#[wasm_bindgen_test]
fn should_increase_the_total_count() {
// Given
ui::view_counters();
ui::add_counter();
// When
ui::increment_counter(1);
ui::increment_counter(1);
ui::increment_counter(1);
// Then
assert_eq!(ui::total(), 3);
}

View File

@@ -1,16 +0,0 @@
use wasm_bindgen_test::*;
// Test Suites
pub mod add_1k_counters;
pub mod add_counter;
pub mod clear_counters;
pub mod decrement_counter;
pub mod enter_count;
pub mod increment_counter;
pub mod remove_counter;
pub mod view_counters;
pub mod fixtures;
pub use fixtures::*;
wasm_bindgen_test_configure!(run_in_browser);

View File

@@ -1,18 +0,0 @@
use super::*;
use crate::counters_page as ui;
use pretty_assertions::assert_eq;
#[wasm_bindgen_test]
fn should_decrement_the_number_of_counters() {
// Given
ui::view_counters();
ui::add_counter();
ui::add_counter();
ui::add_counter();
// When
ui::remove_counter(2);
// Then
assert_eq!(ui::counters(), 2);
}

View File

@@ -1,22 +0,0 @@
use super::*;
use crate::counters_page as ui;
use pretty_assertions::assert_eq;
#[wasm_bindgen_test]
fn should_see_the_initial_counts() {
// When
ui::view_counters();
// Then
assert_eq!(ui::total(), 0);
assert_eq!(ui::counters(), 0);
}
#[wasm_bindgen_test]
fn should_see_the_title() {
// When
ui::view_counters();
// Then
assert_eq!(ui::title(), "Counters (Stable)");
}

View File

@@ -4,7 +4,7 @@ version = "0.1.0"
edition = "2021"
[dependencies]
leptos = { path = "../../leptos", features = ["csr", "nightly"] }
leptos = { path = "../../leptos", features = ["csr"] }
log = "0.4"
console_log = "1"
console_error_panic_hook = "0.1.7"

View File

@@ -9,7 +9,7 @@ crate-type = ["cdylib", "rlib"]
[dependencies]
console_log = "1.0"
console_error_panic_hook = "0.1"
leptos = { path = "../../leptos", features = ["nightly"] }
leptos = { path = "../../leptos" }
leptos_axum = { path = "../../integrations/axum", optional = true }
leptos_meta = { path = "../../meta" }
leptos_router = { path = "../../router" }

View File

@@ -8,7 +8,7 @@ codegen-units = 1
lto = true
[dependencies]
leptos = { path = "../../leptos", features = ["csr", "nightly"] }
leptos = { path = "../../leptos", features = ["csr"] }
reqwasm = "0.5"
serde = { version = "1", features = ["derive"] }
log = "0.4"

View File

@@ -44,7 +44,7 @@ pub fn fetch_example() -> impl IntoView {
// 1) our error type isn't serializable/deserializable
// 2) we're not doing server-side rendering in this example anyway
// (during SSR, create_resource will begin loading on the server and resolve on the client)
let cats = create_local_resource(cat_count, fetch_cats);
let cats = create_local_resource(move || cat_count.get(), fetch_cats);
let fallback = move |errors: RwSignal<Errors>| {
let error_list = move || {
@@ -85,7 +85,7 @@ pub fn fetch_example() -> impl IntoView {
prop:value=move || cat_count.get().to_string()
on:input=move |ev| {
let val = event_target_value(&ev).parse::<CatCount>().unwrap_or(0);
set_cat_count(val);
set_cat_count.set(val);
}
/>
</label>

View File

@@ -4,5 +4,5 @@ version = "0.1.0"
edition = "2021"
[dependencies]
leptos = { path = "../../leptos", features = ["csr", "nightly"] }
leptos = { path = "../../leptos", features = ["csr"] }
gtk = { version = "0.5.0", package = "gtk4" }

View File

@@ -51,7 +51,7 @@ fn counter_button() -> Button {
create_effect({
let button = button.clone();
move |_| {
button.set_label(&format!("Count: {}", value()));
button.set_label(&format!("Count: {}", value.get()));
}
});

View File

@@ -7,7 +7,7 @@ use leptos_router::*;
pub fn Story() -> impl IntoView {
let params = use_params_map();
let story = create_resource(
move || params().get("id").cloned().unwrap_or_default(),
move || params.get().get("id").cloned().unwrap_or_default(),
move |id| async move {
if id.is_empty() {
None

View File

@@ -6,7 +6,7 @@ use leptos_router::*;
pub fn User() -> impl IntoView {
let params = use_params_map();
let user = create_resource(
move || params().get("id").cloned().unwrap_or_default(),
move || params.get().get("id").cloned().unwrap_or_default(),
move |id| async move {
if id.is_empty() {
None

View File

@@ -13,10 +13,10 @@ lto = true
[dependencies]
console_log = "1.0"
console_error_panic_hook = "0.1"
leptos = { path = "../../leptos", features = ["nightly"] }
leptos = { path = "../../leptos" }
leptos_axum = { path = "../../integrations/axum", optional = true }
leptos_meta = { path = "../../meta", features = ["nightly"] }
leptos_router = { path = "../../router", features = ["nightly"] }
leptos_meta = { path = "../../meta" }
leptos_router = { path = "../../router" }
log = "0.4"
simple_logger = "4.0"
serde = { version = "1.0", features = ["derive"] }

View File

@@ -1,4 +1,4 @@
use leptos::{view, Errors, For, IntoView, RwSignal, View};
use leptos::{view, Errors, For, IntoView, RwSignal, SignalGet, View};
// A basic function to display errors served by the error boundaries. Feel free to do more complicated things
// here than just displaying them
@@ -11,7 +11,7 @@ pub fn error_template(errors: Option<RwSignal<Errors>>) -> View {
<h1>"Errors"</h1>
<For
// a function that returns the items we're iterating over; a signal is fine
each=errors
each=move||errors.get()
// a unique key for each item as a reference
key=|(key, _)| key.clone()
// renders each item to a view

View File

@@ -37,7 +37,7 @@ pub fn Stories() -> impl IntoView {
let hide_more_link = move || {
stories.get().unwrap_or(None).unwrap_or_default().len() < 28
|| pending()
|| pending.get()
};
view! {

View File

@@ -7,7 +7,7 @@ use leptos_router::*;
pub fn Story() -> impl IntoView {
let params = use_params_map();
let story = create_resource(
move || params().get("id").cloned().unwrap_or_default(),
move || params.get().get("id").cloned().unwrap_or_default(),
move |id| async move {
if id.is_empty() {
None
@@ -80,14 +80,14 @@ pub fn Comment(comment: api::Comment) -> impl IntoView {
{format!(" {}", comment.time_ago)}
</div>
<div class="text" inner_html=comment.content></div>
{(!comment.comments.is_empty()).then(|| {
{(!comment.comments.is_empty()).then(move || {
view! {
<div>
<div class="toggle" class:open=open>
<div class="toggle" class:open=move ||open.get()>
<a on:click=move |_| set_open.update(|n| *n = !*n)>
{
let comments_len = comment.comments.len();
move || if open() {
move || if open.get() {
"[-]".into()
} else {
format!("[+] {}{} collapsed", comments_len, pluralize(comments_len))
@@ -95,7 +95,7 @@ pub fn Comment(comment: api::Comment) -> impl IntoView {
}
</a>
</div>
{move || open().then({
{move || open.get().then({
let comments = comment.comments.clone();
move || view! {
<ul class="comment-children">

View File

@@ -6,7 +6,7 @@ use leptos_router::*;
pub fn User() -> impl IntoView {
let params = use_params_map();
let user = create_resource(
move || params().get("id").cloned().unwrap_or_default(),
move || params.get().get("id").cloned().unwrap_or_default(),
move |id| async move {
if id.is_empty() {
None

View File

@@ -14,14 +14,13 @@ lto = true
console_log = "1.0"
console_error_panic_hook = "0.1"
leptos = { path = "../../leptos", features = [
"nightly",
"experimental-islands",
] }
leptos_axum = { path = "../../integrations/axum", optional = true, features = [
"experimental-islands",
] }
leptos_meta = { path = "../../meta", features = ["nightly"] }
leptos_router = { path = "../../router", features = ["nightly"] }
leptos_meta = { path = "../../meta" }
leptos_router = { path = "../../router"}
log = "0.4"
simple_logger = "4.0"
serde = { version = "1.0", features = ["derive"] }

View File

@@ -1,4 +1,4 @@
use leptos::{view, Errors, For, IntoView, RwSignal, View};
use leptos::{view, Errors, For, IntoView, RwSignal, SignalGet, View};
// A basic function to display errors served by the error boundaries. Feel free to do more complicated things
// here than just displaying them
@@ -11,7 +11,7 @@ pub fn error_template(errors: Option<RwSignal<Errors>>) -> View {
<h1>"Errors"</h1>
<For
// a function that returns the items we're iterating over; a signal is fine
each=errors
each=move||errors.get()
// a unique key for each item as a reference
key=|(key, _)| key.clone()
// renders each item to a view

View File

@@ -45,7 +45,7 @@ pub fn Stories() -> impl IntoView {
let (pending, set_pending) = create_signal(false);
let hide_more_link = move || {
pending()
pending.get()
|| stories
.map(|stories| {
stories.as_ref().map(|s| s.len() < 28).unwrap_or_default()

View File

@@ -17,7 +17,7 @@ pub async fn fetch_story(
pub fn Story() -> impl IntoView {
let params = use_params_map();
let story = create_resource(
move || params().get("id").cloned().unwrap_or_default(),
move || params.get().get("id").cloned().unwrap_or_default(),
move |id| async move {
if id.is_empty() {
Ok(RefCell::new(None))
@@ -92,9 +92,9 @@ pub fn Story() -> impl IntoView {
pub fn Toggle(children: Children) -> impl IntoView {
let (open, set_open) = create_signal(true);
view! {
<div class="toggle" class:open=open>
<div class="toggle" class:open=move||open.get()>
<a on:click=move |_| set_open.update(|n| *n = !*n)>
{move || if open() {
{move || if open.get() {
"[-]"
} else {
"[+] comments collapsed"
@@ -103,7 +103,7 @@ pub fn Toggle(children: Children) -> impl IntoView {
</div>
<ul
class="comment-children"
style:display=move || if open() {
style:display=move || if open.get() {
"block"
} else {
"none"

View File

@@ -14,7 +14,7 @@ pub async fn fetch_user(
pub fn User() -> impl IntoView {
let params = use_params_map();
let user = create_resource(
move || params().get("id").cloned().unwrap_or_default(),
move || params.get().get("id").cloned().unwrap_or_default(),
move |id| async move {
if id.is_empty() {
Ok(None)

View File

@@ -14,10 +14,10 @@ lto = true
console_log = "1.0.0"
console_error_panic_hook = "0.1.7"
cfg-if = "1.0.0"
leptos = { version = "0.5", features = ["nightly"] }
leptos = { version = "0.5" }
leptos_axum = { version = "0.5", default-features = false, optional = true }
leptos_meta = { version = "0.5", features = ["nightly"] }
leptos_router = { version = "0.5", features = ["nightly"] }
leptos_meta = { version = "0.5" }
leptos_router = { version = "0.5" }
log = "0.4.17"
simple_logger = "4.0.0"
serde = { version = "1.0.148", features = ["derive"] }

View File

@@ -1,4 +1,4 @@
use leptos::{view, Errors, For, IntoView, RwSignal, View};
use leptos::{view, Errors, For, IntoView, RwSignal, SignalGet, View};
// A basic function to display errors served by the error boundaries. Feel free to do more complicated things
// here than just displaying them
@@ -11,7 +11,7 @@ pub fn error_template(errors: Option<RwSignal<Errors>>) -> View {
<h1>"Errors"</h1>
<For
// a function that returns the items we're iterating over; a signal is fine
each=errors
each=move||errors.get()
// a unique key for each item as a reference
key=|(key, _)| key.clone()
// renders each item to a view

View File

@@ -37,7 +37,7 @@ pub fn Stories() -> impl IntoView {
let hide_more_link = move || {
stories.get().unwrap_or(None).unwrap_or_default().len() < 28
|| pending()
|| pending.get()
};
view! {

View File

@@ -7,7 +7,7 @@ use leptos_router::*;
pub fn Story() -> impl IntoView {
let params = use_params_map();
let story = create_resource(
move || params().get("id").cloned().unwrap_or_default(),
move || params.get().get("id").cloned().unwrap_or_default(),
move |id| async move {
if id.is_empty() {
None
@@ -83,11 +83,11 @@ pub fn Comment(comment: api::Comment) -> impl IntoView {
{(!comment.comments.is_empty()).then(|| {
view! {
<div>
<div class="toggle" class:open=open>
<div class="toggle" class:open=move||open.get()>
<a on:click=move |_| set_open.update(|n| *n = !*n)>
{
let comments_len = comment.comments.len();
move || if open() {
move || if open.get() {
"[-]".into()
} else {
format!("[+] {}{} collapsed", comments_len, pluralize(comments_len))
@@ -95,7 +95,7 @@ pub fn Comment(comment: api::Comment) -> impl IntoView {
}
</a>
</div>
{move || open().then({
{move || open.get().then({
let comments = comment.comments.clone();
move || view! {
<ul class="comment-children">

View File

@@ -6,7 +6,7 @@ use leptos_router::*;
pub fn User() -> impl IntoView {
let params = use_params_map();
let user = create_resource(
move || params().get("id").cloned().unwrap_or_default(),
move || params.get().get("id").cloned().unwrap_or_default(),
move |id| async move {
if id.is_empty() {
None

View File

@@ -8,7 +8,7 @@ codegen-units = 1
lto = true
[dependencies]
leptos = { path = "../../leptos", features = ["csr", "nightly", "template_macro"] }
leptos = { path = "../../leptos", features = ["csr","template_macro"] }
console_log = "1"
log = "0.4"
# used in rand, but we need to enable js feature

View File

@@ -109,13 +109,13 @@ pub fn App() -> impl IntoView {
};
let run = move |_| {
set_data(build_data(1000));
set_selected(None);
set_data.set(build_data(1000));
set_selected.set(None);
};
let run_lots = move |_| {
set_data(build_data(10000));
set_selected(None);
set_data.set(build_data(10000));
set_selected.set(None);
};
let add = move |_| {
@@ -131,8 +131,8 @@ pub fn App() -> impl IntoView {
};
let clear = move |_| {
set_data(Vec::new());
set_selected(None);
set_data.set(Vec::new());
set_selected.set(None);
};
let swap_rows = move |_| {
@@ -143,7 +143,7 @@ pub fn App() -> impl IntoView {
});
};
let is_selected = create_selector(selected);
let is_selected = create_selector(move || selected.get());
view! {
@@ -166,7 +166,7 @@ pub fn App() -> impl IntoView {
<table class="table table-hover table-striped test-data">
<tbody>
<For
each={data}
each=move||data.get()
key={|row| row.id}
children=move |row: RowData| {
let row_id = row.id;
@@ -182,7 +182,7 @@ pub fn App() -> impl IntoView {
template! {
<tr class:danger={move || is_selected.selected(Some(row_id))}>
<td class="col-md-1">{row_id.to_string()}</td>
<td class="col-md-4"><a on:click=move |_| set_selected(Some(row_id))>{move || label.get()}</a></td>
<td class="col-md-4"><a on:click=move |_| set_selected.set(Some(row_id))>{move || label.get()}</a></td>
<td class="col-md-1"><a on:click=move |_| remove(row_id)><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></a></td>
<td class="col-md-6"/>
</tr>

View File

@@ -7,6 +7,6 @@ codegen-units = 1
lto = true
[patch.crates-io]
leptos = { path = "../../leptos", features = ["nightly"] }
leptos_router = { path = "../../router", features = ["nightly"] }
leptos = { path = "../../leptos" }
leptos_router = { path = "../../router" }
api-boundary = { path = "api-boundary" }

View File

@@ -8,7 +8,7 @@ codegen-units = 1
lto = true
[dependencies]
leptos = { path = "../../leptos", features = ["csr", "nightly"] }
leptos = { path = "../../leptos", features = ["csr"] }
console_log = "1"
log = "0.4"
console_error_panic_hook = "0.1.7"

View File

@@ -31,10 +31,10 @@ pub fn App() -> impl IntoView {
<main>
<p
// class: attributes take F: Fn() => bool, and these signals all implement Fn()
class:red=red
class:right=right
class:italics=italics
class:smallcaps=smallcaps
class:red=move||red.get()
class:right=move||right.get()
class:italics=move||italics.get()
class:smallcaps=move||smallcaps.get()
>
"Lorem ipsum sit dolor amet."
</p>
@@ -82,7 +82,7 @@ pub fn ButtonB(
view! {
<button
on:click=on_click
on:click=move|ev|on_click.call(ev)
>
"Toggle Right"
</button>

View File

@@ -4,7 +4,7 @@ version = "0.1.0"
edition = "2021"
[dependencies]
leptos = { path = "../../leptos", features = ["csr", "nightly"] }
leptos = { path = "../../leptos", features = ["csr"] }
log = "0.4"
console_log = "1"
console_error_panic_hook = "0.1.7"

View File

@@ -7,23 +7,23 @@ pub fn App() -> impl IntoView {
view! {
<div>
<button id="btn-show" on:click=move |_| set_show_overlay(true)>
<button id="btn-show" on:click=move |_| set_show_overlay.set(true)>
Show Overlay
</button>
<Show when=show_overlay fallback=|| ()>
<Show when=move||show_overlay.get() fallback=|| ()>
<div>Show</div>
<Portal mount=document().get_element_by_id("app").unwrap()>
<div style="position: fixed; z-index: 10; width: 100vw; height: 100vh; top: 0; left: 0; background: rgba(0, 0, 0, 0.8); color: white;">
<p>This is in the body element</p>
<button id="btn-hide" on:click=move |_| set_show_overlay(false)>
<button id="btn-hide" on:click=move |_| set_show_overlay.set(false)>
Close Overlay
</button>
<button id="btn-toggle" on:click=move |_| set_show_inside_overlay(!show_inside_overlay())>
<button id="btn-toggle" on:click=move |_| set_show_inside_overlay.set(!show_inside_overlay.get())>
Toggle inner
</button>
<Show when=show_inside_overlay fallback=|| view! { "Hidden" }>
<Show when=move||show_inside_overlay.get() fallback=|| view! { "Hidden" }>
Visible
</Show>
</div>

View File

@@ -10,12 +10,12 @@ lto = true
[dependencies]
console_log = "1"
log = "0.4"
leptos = { path = "../../leptos", features = ["csr", "nightly"] }
leptos_router = { path = "../../router", features = ["csr", "nightly"] }
leptos = { path = "../../leptos", features = ["csr"] }
leptos_router = { path = "../../router", features = ["csr"] }
serde = { version = "1", features = ["derive"] }
futures = "0.3"
console_error_panic_hook = "0.1.7"
leptos_meta = { path = "../../meta", features = ["csr", "nightly"] }
leptos_meta = { path = "../../meta", features = ["csr"] }
[dev-dependencies]
wasm-bindgen-test = "0.3.0"

View File

@@ -117,7 +117,8 @@ pub fn ContactList() -> impl IntoView {
#[derive(Params, PartialEq, Clone, Debug)]
pub struct ContactParams {
id: usize,
// Params isn't implemented for usize, only Option<usize>
id: Option<usize>,
}
#[component]
@@ -135,7 +136,12 @@ pub fn Contact() -> impl IntoView {
let params = use_params::<ContactParams>();
let contact = create_resource(
move || params().map(|params| params.id).ok(),
move || {
params
.get()
.map(|params| params.id.unwrap_or_default())
.ok()
},
// any of the following would work (they're identical)
// move |id| async move { get_contact(id).await }
// move |id| get_contact(id),

View File

@@ -11,10 +11,10 @@ console_log = "1.0"
console_error_panic_hook = "0.1"
futures = "0.3"
http = "1.0"
leptos = { path = "../../leptos", features = ["nightly"] }
leptos = { path = "../../leptos" }
leptos_axum = { path = "../../integrations/axum", optional = true }
leptos_meta = { path = "../../meta", features = ["nightly"] }
leptos_router = { path = "../../router", features = ["nightly"] }
leptos_meta = { path = "../../meta" }
leptos_router = { path = "../../router" }
server_fn = { path = "../../server_fn", features = ["serde-lite", "rkyv", "multipart"] }
log = "0.4"
simple_logger = "4.0"

View File

@@ -102,7 +102,7 @@ pub fn SpawnLocal() -> impl IntoView {
let value = input_ref.get().unwrap().value();
spawn_local(async move {
let uppercase_text = shouting_text(value).await.unwrap_or_else(|e| e.to_string());
set_shout_result(uppercase_text);
set_shout_result.set(uppercase_text);
});
}
>
@@ -167,7 +167,8 @@ pub fn WithAnAction() -> impl IntoView {
// this resource will hold the total number of rows
// passing it action.version() means it will refetch whenever the action resolves successfully
let row_count = create_resource(action.version(), |_| get_rows());
let row_count =
create_resource(move || action.version().get(), |_| get_rows());
view! {
<h3>Using <code>create_action</code></h3>
@@ -192,7 +193,7 @@ pub fn WithAnAction() -> impl IntoView {
<p>You submitted: {move || format!("{:?}", action.input().get())}</p>
<p>The result was: {move || format!("{:?}", action.value().get())}</p>
<Transition>
<p>Total rows: {row_count}</p>
<p>Total rows: {move || row_count.get()}</p>
</Transition>
}
}
@@ -206,7 +207,8 @@ pub fn WithAnAction() -> impl IntoView {
#[component]
pub fn WithActionForm() -> impl IntoView {
let action = create_server_action::<AddRow>();
let row_count = create_resource(action.version(), |_| get_rows());
let row_count =
create_resource(move || action.version().get(), |_| get_rows());
view! {
<h3>Using <code>"<ActionForm/>"</code></h3>
@@ -225,7 +227,7 @@ pub fn WithActionForm() -> impl IntoView {
<p>You submitted: {move || format!("{:?}", action.input().get())}</p>
<p>The result was: {move || format!("{:?}", action.value().get())}</p>
<Transition>archive underaligned: need alignment 4 but have alignment 1
<p>Total rows: {row_count}</p>
<p>Total rows: {move || row_count.get()}</p>
</Transition>
}
}
@@ -277,13 +279,13 @@ pub fn ServerFnArgumentExample() -> impl IntoView {
let value = input_ref.get().unwrap().value();
spawn_local(async move {
let length = length_of_input(value).await.unwrap_or(0);
set_result(length);
set_result.set(length);
});
}
>
Click to see length
</button>
<p>Length is {result}</p>
<p>Length is {move||result.get()}</p>
}
}
@@ -307,7 +309,7 @@ pub async fn rkyv_example(input: String) -> Result<String, ServerFnError> {
pub fn RkyvExample() -> impl IntoView {
let input_ref = NodeRef::<Input>::new();
let (input, set_input) = create_signal(String::new());
let rkyv_result = create_resource(input, rkyv_example);
let rkyv_result = create_resource(move || input.get(), rkyv_example);
view! {
<h3>Using <code>rkyv</code> encoding</h3>
@@ -317,14 +319,14 @@ pub fn RkyvExample() -> impl IntoView {
<button
on:click=move |_| {
let value = input_ref.get().unwrap().value();
set_input(value);
set_input.set(value);
}
>
Click to capitalize
</button>
<p>{input}</p>
<p>{move||input.get()}</p>
<Transition>
{rkyv_result}
{move || rkyv_result.get()}
</Transition>
}
}
@@ -507,9 +509,9 @@ pub fn FileUploadWithProgress() -> impl IntoView {
.unchecked_into::<web_sys::File>();
let filename = file.name();
let size = file.size() as usize;
set_filename(Some(filename.clone()));
set_max(Some(size));
set_current(None::<usize>);
set_filename.set(Some(filename.clone()));
set_max.set(Some(size));
set_current.set(None::<usize>);
spawn_local(async move {
let mut progress = file_progress(filename)
@@ -532,7 +534,7 @@ pub fn FileUploadWithProgress() -> impl IntoView {
)
.parse::<usize>()
.expect("invalid length");
set_current(Some(len));
set_current.set(Some(len));
}
});
spawn_local(async move {
@@ -550,9 +552,9 @@ pub fn FileUploadWithProgress() -> impl IntoView {
<input type="file" name="file_to_upload"/>
<input type="submit"/>
</form>
{move || filename().map(|filename| view! { <p>Uploading {filename}</p> })}
{move || max().map(|max| view! {
<progress max=max value=move || current().unwrap_or_default()/>
{move || filename.get().map(|filename| view! { <p>Uploading {filename}</p> })}
{move || max.get().map(|max| view! {
<progress max=max value=move || current.get().unwrap_or_default()/>
})}
}
}
@@ -665,7 +667,7 @@ pub fn CustomErrorTypes() -> impl IntoView {
let value = input_ref.get().unwrap().value();
spawn_local(async move {
let data = ascii_uppercase(value).await;
set_result(Some(data));
set_result.set(Some(data));
});
}
>
@@ -789,13 +791,13 @@ pub fn CustomEncoding() -> impl IntoView {
let value = input_ref.get().unwrap().value();
spawn_local(async move {
let new_value = why_not(value, ", but in TOML!!!".to_string()).await.unwrap();
set_result(new_value.0.modified);
set_result.set(new_value.0.modified);
});
}
>
Submit
</button>
<p>{result}</p>
<p>{move||result.get()}</p>
}
}

View File

@@ -12,10 +12,10 @@ console_log = "1.0"
rand = { version = "0.8", features = ["min_const_gen"], optional = true }
console_error_panic_hook = "0.1"
futures = "0.3"
leptos = { path = "../../leptos", features = ["nightly"] }
leptos_meta = { path = "../../meta", features = ["nightly"] }
leptos = { path = "../../leptos" }
leptos_meta = { path = "../../meta"}
leptos_axum = { path = "../../integrations/axum", optional = true }
leptos_router = { path = "../../router", features = ["nightly"] }
leptos_router = { path = "../../router" }
log = "0.4"
simple_logger = "4.0"
serde = { version = "1.0", features = ["derive"] }

View File

@@ -8,7 +8,7 @@ codegen-units = 1
lto = true
[dependencies]
leptos = { path = "../../leptos", features = ["csr", "nightly"] }
leptos = { path = "../../leptos", features = ["csr"] }
console_log = "1"
log = "0.4"
console_error_panic_hook = "0.1.7"

View File

@@ -28,9 +28,9 @@ fn SlotIf(
#[prop(optional)] fallback: Option<Fallback>,
) -> impl IntoView {
move || {
if cond() {
if cond.get() {
(then.children)().into_view()
} else if let Some(else_if) = else_if.iter().find(|i| (i.cond)()) {
} else if let Some(else_if) = else_if.iter().find(|i| i.cond.get()) {
(else_if.children)().into_view()
} else if let Some(fallback) = &fallback {
(fallback.children)().into_view()
@@ -43,13 +43,13 @@ fn SlotIf(
#[component]
pub fn App() -> impl IntoView {
let (count, set_count) = create_signal(0);
let is_even = MaybeSignal::derive(move || count() % 2 == 0);
let is_div5 = MaybeSignal::derive(move || count() % 5 == 0);
let is_div7 = MaybeSignal::derive(move || count() % 7 == 0);
let is_even = MaybeSignal::derive(move || count.get() % 2 == 0);
let is_div5 = MaybeSignal::derive(move || count.get() % 5 == 0);
let is_div7 = MaybeSignal::derive(move || count.get() % 7 == 0);
view! {
<button on:click=move |_| set_count.update(|value| *value += 1)>"+1"</button>
" "{count}" is "
" "{move||count.get()}" is "
<SlotIf cond=is_even>
// The slot name can be emitted if it would match the slot struct name (in snake case).
<Then slot>"even"</Then>

View File

@@ -12,10 +12,10 @@ actix-web = { version = "4", optional = true, features = ["macros"] }
console_error_panic_hook = "0.1"
console_log = "1"
lazy_static = "1"
leptos = { path = "../../leptos", features = ["nightly"] }
leptos_meta = { path = "../../meta", features = ["nightly"] }
leptos = { path = "../../leptos"}
leptos_meta = { path = "../../meta" }
leptos_actix = { path = "../../integrations/actix", optional = true }
leptos_router = { path = "../../router", features = ["nightly"] }
leptos_router = { path = "../../router" }
log = "0.4"
serde = { version = "1", features = ["derive"] }
thiserror = "1"

View File

@@ -67,7 +67,7 @@ fn HomePage() -> impl IntoView {
#[derive(Params, Copy, Clone, Debug, PartialEq, Eq)]
pub struct PostParams {
id: usize,
id: Option<usize>,
}
#[component]
@@ -75,7 +75,9 @@ fn Post() -> impl IntoView {
let query = use_params::<PostParams>();
let id = move || {
query.with(|q| {
q.as_ref().map(|q| q.id).map_err(|_| PostError::InvalidId)
q.as_ref()
.map(|q| q.id.unwrap_or_default())
.map_err(|_| PostError::InvalidId)
})
};
let post = create_resource(id, |id| async move {

View File

@@ -10,10 +10,10 @@ crate-type = ["cdylib", "rlib"]
console_error_panic_hook = "0.1"
console_log = "1"
lazy_static = "1"
leptos = { path = "../../leptos", features = ["nightly"] }
leptos_meta = { path = "../../meta", features = ["nightly"] }
leptos = { path = "../../leptos"}
leptos_meta = { path = "../../meta" }
leptos_axum = { path = "../../integrations/axum", optional = true }
leptos_router = { path = "../../router", features = ["nightly"] }
leptos_router = { path = "../../router" }
log = "0.4"
serde = { version = "1", features = ["derive"] }
thiserror = "1"

View File

@@ -67,7 +67,7 @@ fn HomePage() -> impl IntoView {
#[derive(Params, Copy, Clone, Debug, PartialEq, Eq)]
pub struct PostParams {
id: usize,
id: Option<usize>,
}
#[component]
@@ -75,7 +75,9 @@ fn Post() -> impl IntoView {
let query = use_params::<PostParams>();
let id = move || {
query.with(|q| {
q.as_ref().map(|q| q.id).map_err(|_| PostError::InvalidId)
q.as_ref()
.map(|q| q.id.unwrap_or_default())
.map_err(|_| PostError::InvalidId)
})
};
let post = create_resource(id, |id| async move {

View File

@@ -9,10 +9,10 @@ crate-type = ["cdylib", "rlib"]
# See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html
[dependencies]
leptos = { path = "../../leptos", features = ["nightly"] }
leptos = { path = "../../leptos" }
leptos_actix = { path = "../../integrations/actix", optional = true }
leptos_meta = { path = "../../meta", features = ["nightly"] }
leptos_router = { path = "../../router", features = ["nightly"] }
leptos_meta = { path = "../../meta" }
leptos_router = { path = "../../router" }
gloo-net = { version = "0.2", features = ["http"] }
log = "0.4"

View File

@@ -31,10 +31,10 @@ fn Home() -> impl IntoView {
on:click=move |_| set_count.update(|count| *count += 1)
>
"Something's here | "
{move || if count() == 0 {
{move || if count.get() == 0 {
"Click me!".to_string()
} else {
count().to_string()
count.get().to_string()
}}
" | Some more text"
</button>

View File

@@ -10,10 +10,10 @@ crate-type = ["cdylib", "rlib"]
axum = { version = "0.7", optional = true }
console_error_panic_hook = "0.1"
console_log = "1"
leptos = { path = "../../leptos", features = ["nightly"] }
leptos_meta = { path = "../../meta", features = ["nightly"] }
leptos = { path = "../../leptos" }
leptos_meta = { path = "../../meta" }
leptos_axum = { path = "../../integrations/axum", optional = true }
leptos_router = { path = "../../router", features = ["nightly"] }
leptos_router = { path = "../../router" }
log = "0.4.17"
simple_logger = "4"
tokio = { version = "1", features = ["rt-multi-thread", "macros"], optional = true }

View File

@@ -31,7 +31,7 @@ fn Home() -> impl IntoView {
"+"
</button>
<button class="rounded px-3 py-2 m-1 border-b-4 border-l-2 shadow-lg bg-blue-800 border-blue-900 text-white">
{value}
{move||value.get()}
</button>
<button on:click=move |_| set_value.update(|value| *value -= 1) class="rounded px-3 py-2 m-1 border-b-4 border-l-2 shadow-lg bg-blue-700 border-blue-800 text-white">
"-"

View File

@@ -4,9 +4,9 @@ version = "0.1.0"
edition = "2021"
[dependencies]
leptos = { path = "../../leptos", features = ["csr", "nightly"] }
leptos_meta = { path = "../../meta", features = ["csr", "nightly"] }
leptos_router = { path = "../../router", features = ["csr", "nightly"] }
leptos = { path = "../../leptos", features = ["csr"] }
leptos_meta = { path = "../../meta", features = ["csr"] }
leptos_router = { path = "../../router", features = ["csr"] }
log = "0.4"
gloo-net = { version = "0.2", features = ["http"] }

View File

@@ -31,10 +31,10 @@ fn Home() -> impl IntoView {
on:click=move |_| set_count.update(|count| *count += 1)
>
"Something's here | "
{move || if count() == 0 {
{move || if count.get() == 0 {
"Click me!".to_string()
} else {
count().to_string()
count.get().to_string()
}}
" | Some more text"
</button>

View File

@@ -8,7 +8,7 @@ codegen-units = 1
lto = true
[dependencies]
leptos = { path = "../../leptos", features = ["csr", "nightly"] }
leptos = { path = "../../leptos", features = ["csr"] }
console_log = "1"
log = "0.4"
console_error_panic_hook = "0.1.7"

View File

@@ -21,12 +21,12 @@ pub fn TimerDemo() -> impl IntoView {
view! {
<div>
<div>"Count A (fixed interval of 1000 ms)"</div>
<div>{count_a}</div>
<div>"Count B (dynamic interval, currently " {interval} " ms)"</div>
<div>{count_b}</div>
<div>{move||count_a.get()}</div>
<div>"Count B (dynamic interval, currently " {move||interval.get()} " ms)"</div>
<div>{move||count_b.get()}</div>
<input prop:value=interval on:input=move |ev| {
if let Ok(value) = event_target_value(&ev).parse::<u64>() {
set_interval(value);
set_interval.set(value);
}
}/>
</div>

View File

@@ -15,10 +15,10 @@ console_log = "1.0.0"
console_error_panic_hook = "0.1.7"
serde = { version = "1.0.152", features = ["derive"] }
futures = "0.3.25"
leptos = { path = "../../leptos", features = ["nightly"] }
leptos = { path = "../../leptos"}
leptos_actix = { path = "../../integrations/actix", optional = true }
leptos_meta = { path = "../../meta", features = ["nightly"] }
leptos_router = { path = "../../router", features = ["nightly"] }
leptos_meta = { path = "../../meta" }
leptos_router = { path = "../../router" }
log = "0.4.17"
simple_logger = "4.0.0"
gloo = { git = "https://github.com/rustwasm/gloo" }

View File

@@ -11,11 +11,11 @@ console_log = "1.0"
console_error_panic_hook = "0.1"
futures = "0.3"
http = "1.0"
leptos = { path = "../../leptos", features = ["nightly"] }
leptos = { path = "../../leptos" }
server_fn = { path = "../../server_fn", features = ["serde-lite"] }
leptos_axum = { path = "../../integrations/axum", optional = true }
leptos_meta = { path = "../../meta", features = ["nightly"] }
leptos_router = { path = "../../router", features = ["nightly"] }
leptos_meta = { path = "../../meta" }
leptos_router = { path = "../../router" }
log = "0.4"
simple_logger = "4.0"
serde = { version = "1", features = ["derive"] }

View File

@@ -10,10 +10,10 @@ crate-type = ["cdylib", "rlib"]
console_log = "1.0"
console_error_panic_hook = "0.1"
futures = "0.3"
leptos = { path = "../../leptos", features = ["nightly"] }
leptos = { path = "../../leptos" }
leptos_axum = { path = "../../integrations/axum", optional = true }
leptos_meta = { path = "../../meta", features = ["nightly"] }
leptos_router = { path = "../../router", features = ["nightly"] }
leptos_meta = { path = "../../meta"}
leptos_router = { path = "../../router" }
leptos_integration_utils = { path = "../../integrations/utils", optional = true }
log = "0.4"
simple_logger = "4.0"