diff --git a/.scripts/generate-templates-matrix.js b/.scripts/generate-templates-matrix.js index 7b58c936e6..fc42d47470 100644 --- a/.scripts/generate-templates-matrix.js +++ b/.scripts/generate-templates-matrix.js @@ -18,6 +18,7 @@ const nodeJsTemplates = [ "preact", "preact-ts", "angular", + "ripple", ]; const matrixConfig = [ diff --git a/src/package_manager.rs b/src/package_manager.rs index b912dc196f..3001756a80 100644 --- a/src/package_manager.rs +++ b/src/package_manager.rs @@ -97,6 +97,7 @@ impl PackageManager { Template::Vue, Template::Svelte, Template::React, + Template::Ripple, Template::Solid, Template::Angular, Template::Preact, @@ -127,6 +128,7 @@ impl PackageManager { Template::SvelteTs, Template::React, Template::ReactTs, + Template::Ripple, Template::Solid, Template::SolidTs, Template::Angular, diff --git a/src/template.rs b/src/template.rs index 13e76ff4fd..d1ced17cc9 100644 --- a/src/template.rs +++ b/src/template.rs @@ -50,6 +50,7 @@ pub enum Template { SvelteTs, React, ReactTs, + Ripple, Solid, SolidTs, Yew, @@ -73,6 +74,7 @@ impl Display for Template { Template::SvelteTs => write!(f, "svelte-ts"), Template::React => write!(f, "react"), Template::ReactTs => write!(f, "react-ts"), + Template::Ripple => write!(f, "ripple"), Template::Solid => write!(f, "solid"), Template::SolidTs => write!(f, "solid-ts"), Template::Yew => write!(f, "yew"), @@ -99,6 +101,7 @@ impl FromStr for Template { "svelte-ts" => Ok(Template::SvelteTs), "react" => Ok(Template::React), "react-ts" => Ok(Template::ReactTs), + "ripple" => Ok(Template::Ripple), "solid" => Ok(Template::Solid), "solid-ts" => Ok(Template::SolidTs), "yew" => Ok(Template::Yew), @@ -128,6 +131,7 @@ impl Template { Template::Vue => "Vue - (https://vuejs.org/)", Template::Svelte => "Svelte - (https://svelte.dev/)", Template::React => "React - (https://react.dev/)", + Template::Ripple => "Ripple - (https://www.ripplejs.com/)", Template::Solid => "Solid - (https://solidjs.com/)", Template::Yew => "Yew - (https://yew.rs/)", Template::Leptos => "Leptos - (https://leptos.dev/)", @@ -153,6 +157,7 @@ impl Template { Template::SvelteTs, Template::React, Template::ReactTs, + Template::Ripple, Template::Solid, Template::SolidTs, Template::Yew, @@ -177,6 +182,7 @@ impl Template { Template::Vue => Some(&[Flavor::TypeScript, Flavor::JavaScript]), Template::Svelte => Some(&[Flavor::TypeScript, Flavor::JavaScript]), Template::React => Some(&[Flavor::TypeScript, Flavor::JavaScript]), + Template::Ripple => Some(&[Flavor::TypeScript]), Template::Solid => Some(&[Flavor::TypeScript, Flavor::JavaScript]), Template::Preact => Some(&[Flavor::TypeScript, Flavor::JavaScript]), _ => None, @@ -223,6 +229,7 @@ impl Template { | Template::SvelteTs | Template::React | Template::ReactTs + | Template::Ripple | Template::Solid | Template::SolidTs | Template::Angular diff --git a/templates/_assets_/ripple.svg b/templates/_assets_/ripple.svg new file mode 100644 index 0000000000..292f4fd632 --- /dev/null +++ b/templates/_assets_/ripple.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + + + diff --git a/templates/template-ripple/.manifest b/templates/template-ripple/.manifest new file mode 100644 index 0000000000..e3d9e6f786 --- /dev/null +++ b/templates/template-ripple/.manifest @@ -0,0 +1,14 @@ +# Copyright 2019-2022 Tauri Programme within The Commons Conservancy +# SPDX-License-Identifier: Apache-2.0 +# SPDX-License-Identifier: MIT + +beforeDevCommand = {% pkg_manager_run_command %} dev +beforeBuildCommand = {% pkg_manager_run_command %} build +devUrl = http://localhost:1420 +frontendDist = ../dist + +[files] +ripple.svg = src/assets/ripple-logo.svg +vite.svg = public/vite.svg +tauri.svg = public/tauri.svg +styles.css = src/App.css diff --git a/templates/template-ripple/.prettierignore b/templates/template-ripple/.prettierignore new file mode 100644 index 0000000000..4d291627c4 --- /dev/null +++ b/templates/template-ripple/.prettierignore @@ -0,0 +1,6 @@ +node_modules/ +dist/ +build/ +coverage/ +*.min.js +*.min.css diff --git a/templates/template-ripple/.prettierrc b/templates/template-ripple/.prettierrc new file mode 100644 index 0000000000..15d4afec2a --- /dev/null +++ b/templates/template-ripple/.prettierrc @@ -0,0 +1,8 @@ +{ + "useTabs": true, + "singleQuote": true, + "trailingComma": "es5", + "printWidth": 100, + "tabWidth": 4, + "plugins": ["@ripple-ts/prettier-plugin"] +} diff --git a/templates/template-ripple/README.md b/templates/template-ripple/README.md new file mode 100644 index 0000000000..4932ba1ed6 --- /dev/null +++ b/templates/template-ripple/README.md @@ -0,0 +1,7 @@ +# Tauri + Ripple + +This template should help get you started developing with Tauri, Ripple in Vite. + +## Recommended IDE Setup + +- [VS Code](https://code.visualstudio.com/) + [Tauri](https://marketplace.visualstudio.com/items?itemName=tauri-apps.tauri-vscode) + [rust-analyzer](https://marketplace.visualstudio.com/items?itemName=rust-lang.rust-analyzer) diff --git a/templates/template-ripple/_gitignore b/templates/template-ripple/_gitignore new file mode 100644 index 0000000000..48d7bb29d1 --- /dev/null +++ b/templates/template-ripple/_gitignore @@ -0,0 +1,2 @@ +node_modules/ +*.env diff --git a/templates/template-ripple/eslint.config.js b/templates/template-ripple/eslint.config.js new file mode 100644 index 0000000000..2902159db9 --- /dev/null +++ b/templates/template-ripple/eslint.config.js @@ -0,0 +1,3 @@ +import ripple from '@ripple-ts/eslint-plugin'; + +export default [...ripple.configs.recommended]; diff --git a/templates/template-ripple/index.html b/templates/template-ripple/index.html new file mode 100644 index 0000000000..bda6362b6e --- /dev/null +++ b/templates/template-ripple/index.html @@ -0,0 +1,16 @@ + + + + + + + + Ripple App + + + +
+ + + + diff --git a/templates/template-ripple/package.json.lte b/templates/template-ripple/package.json.lte new file mode 100644 index 0000000000..759693c156 --- /dev/null +++ b/templates/template-ripple/package.json.lte @@ -0,0 +1,38 @@ +{ + "name": "tauri-ripple", + "version": "1.0.0", + "description": "A Ripple application created with create-ripple", + "type": "module", + "engines": { + "node": ">=20.0.0" + }, + "scripts": { + "start": "vite", + "dev": "vite", + "build": "vite build", + "lint": "eslint .", + "serve": "vite preview", + "format": "prettier --write .", + "format:check": "prettier --check .", + "tauri": "tauri" + }, + "license": "MIT", + "devDependencies": { + "@ripple-ts/eslint-plugin": "latest", + "@ripple-ts/prettier-plugin": "latest", + "@ripple-ts/typescript-plugin": "latest", + "@ripple-ts/vite-plugin": "latest", + "@tailwindcss/vite": "^4.1.12", + "@tauri-apps/cli": "^2.9.4", + "eslint": "^9.0.0", + "prettier": "^3.6.2", + "tailwindcss": "^4.1.12", + "typescript": "^5.9.2", + "vite": "^7.1.4" + }, + "dependencies": { + "ripple": "latest", + "@tauri-apps/api": "^2", + "@tauri-apps/plugin-opener": "^2" + } +} diff --git a/templates/template-ripple/public/tauri.svg b/templates/template-ripple/public/tauri.svg new file mode 100644 index 0000000000..31b62c9280 --- /dev/null +++ b/templates/template-ripple/public/tauri.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/templates/template-ripple/public/vite.svg b/templates/template-ripple/public/vite.svg new file mode 100644 index 0000000000..ee9fadaf9c --- /dev/null +++ b/templates/template-ripple/public/vite.svg @@ -0,0 +1 @@ + diff --git a/templates/template-ripple/src/App.ripple.lte b/templates/template-ripple/src/App.ripple.lte new file mode 100644 index 0000000000..6615eb96f8 --- /dev/null +++ b/templates/template-ripple/src/App.ripple.lte @@ -0,0 +1,166 @@ +import { track } from 'ripple'; +import { invoke } from '@tauri-apps/api/core'; + +export component App() { + let count = track(0); + let greetMsg = track(""); + let name = track(""); + async function greet() { + console.log("ola"); + @greetMsg = await invoke("greet", { name: @name }); + } + +
+
+

{'Welcome to Tauri + Ripple'}

+ +
+ + + + + + + + + +
+

{'Click on the Tauri, Vite, and Ripple logos to learn more.'}

+ +
{ + e.preventDefault(); + greet(); + }} + > + @name=e.currentTarget.value} + placeholder="Enter a name..." + /> + +
+

{@greetMsg}

+
+
+ +} diff --git a/templates/template-ripple/src/assets/favicon.ico b/templates/template-ripple/src/assets/favicon.ico new file mode 100644 index 0000000000..ac2f97da22 Binary files /dev/null and b/templates/template-ripple/src/assets/favicon.ico differ diff --git a/templates/template-ripple/src/assets/ripple-logo-horizontal.png b/templates/template-ripple/src/assets/ripple-logo-horizontal.png new file mode 100644 index 0000000000..764f9b77e8 Binary files /dev/null and b/templates/template-ripple/src/assets/ripple-logo-horizontal.png differ diff --git a/templates/template-ripple/src/assets/ripple-logo.svg b/templates/template-ripple/src/assets/ripple-logo.svg new file mode 100644 index 0000000000..292f4fd632 --- /dev/null +++ b/templates/template-ripple/src/assets/ripple-logo.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + + + diff --git a/templates/template-ripple/src/index.css b/templates/template-ripple/src/index.css new file mode 100644 index 0000000000..f16c066d5d --- /dev/null +++ b/templates/template-ripple/src/index.css @@ -0,0 +1,2 @@ +@import "tailwindcss"; +@config "../tailwind.config.ts"; \ No newline at end of file diff --git a/templates/template-ripple/src/index.ts b/templates/template-ripple/src/index.ts new file mode 100644 index 0000000000..e9d2bc966d --- /dev/null +++ b/templates/template-ripple/src/index.ts @@ -0,0 +1,8 @@ +import './index.css'; +import { mount } from 'ripple'; +// @ts-expect-error: known issue, we're working on it +import { App } from './App.ripple'; + +mount(App, { + target: document.getElementById('root'), +}); diff --git a/templates/template-ripple/tailwind.config.ts b/templates/template-ripple/tailwind.config.ts new file mode 100644 index 0000000000..5758d0e8c8 --- /dev/null +++ b/templates/template-ripple/tailwind.config.ts @@ -0,0 +1,11 @@ +import type { Config } from 'tailwindcss'; +export default { + content: [ + "./index.html", + "./src/**/*.{ts,ripple}", + ], + theme: { + extend: {}, + }, + plugins: [] +} satisfies Config diff --git a/templates/template-ripple/tsconfig.json b/templates/template-ripple/tsconfig.json new file mode 100644 index 0000000000..36d6eb73f0 --- /dev/null +++ b/templates/template-ripple/tsconfig.json @@ -0,0 +1,15 @@ +{ + "compilerOptions": { + "target": "ESNext", + "module": "ESNext", + "lib": ["ES2022", "DOM", "DOM.Iterable"], + "allowSyntheticDefaultImports": true, + "esModuleInterop": true, + "moduleResolution": "bundler", + "jsx": "preserve", + "jsxImportSource": "ripple", + "noEmit": true, + "isolatedModules": true, + "plugins": [{ "name": "@ripple-ts/typescript-plugin" }] + } +} diff --git a/templates/template-ripple/vite.config.js.lte b/templates/template-ripple/vite.config.js.lte new file mode 100644 index 0000000000..88b7c40e89 --- /dev/null +++ b/templates/template-ripple/vite.config.js.lte @@ -0,0 +1,25 @@ +import { defineConfig } from 'vite'; +import tailwindcss from '@tailwindcss/vite'; +import { ripple } from '@ripple-ts/vite-plugin';{% if v2 %} + +const host = process.env.TAURI_DEV_HOST;{% endif %} + +export default defineConfig({ + plugins: [ripple(), tailwindcss()], + server: { + port: 1420, + strictPort: true,{% if v2 %} + host: host || false, + hmr: host + ? { + protocol: "ws", + host, + port: 1421, + } + : undefined,{% endif %} + watch: { + // 3. tell Vite to ignore watching `src-tauri` + ignored: ["**/src-tauri/**"], + }, + } +});