creo 0.2.0 → 0.2.2

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Nik Mostovoy (xnim.me)
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,31 +1,48 @@
-# Creo
+# Creo: Lightweight UI framework
 
-> _"There is a point of no return"_
+> _"There are many UI framework but this one is mine!"_
 
-- A "streaming" UI framework.
-- No JSX, no templates, no compiler — views are function calls that flow top-down, rendered as they execute.
+- Lightweight, "Streaming" UI framework.
+- No JSX / templates / compiler
 - Simplicity over tons of features
+- Easy to start, easy to work with
+- Extendability by defining renderers
 
 ## Philosophy
 
 ### Streaming the UI
 
-Most frameworks build a tree and diff it. Creo streams it. When `render()` runs, each `div()`, `text()`, `span()` call immediately registers a child in sequence — there is no intermediate representation between your code and the virtual DOM. The render function IS the tree, read top to bottom. What you call is what you get, in the order you call it.
+> _"There is a point of no return"_
+
+Most frameworks are based on "returning" the data. Creo started back in (early 2025)[https://x.com/xnimorz/status/1876212381568905348] with the idea, that "return" is not the point. We can intersect the components during rendering cycle to handle it.
+
+It comes with some limitations, yes, like using VirtualDOM, instead of compiling it all and putting just renderer instructions but I believe VDOM is not the weakest point of modern software engineering.
+
+The weakest point is complexity. Every time I looked at "framework A/B/C" I always find myself struggling with remembering all "you should do X/Y/Z in order to make it work".
+
+And look.. I get it, it's important to follow the rules (e.g. I remember early svelte they experience problems with props, where incorrect usage de-optimised perfromance a lot). But after getting to the point where "a little bit too much" of the rules, I experience mental overload.
+
+This is why I want to have a framework which I enjoy using on daily basis. And one major thing I don't like is "too many DSLs" to remember.
+
+So... Why not just to use JAVASCRIPT?
 
 ```ts
 render() {
-  h1({}, () => text("Title"));     // first child
-  p({}, () => text("Paragraph"));  // second child
-  ul({}, () => {                   // third child, with its own children streamed inside
-    li({}, () => text("One"));
-    li({}, () => text("Two"));
+  h1(_, "Title");                  // first child
+  p(_, "Paragraph");               // second child
+  ul(_, () => {                    // third child, with its own children streamed inside
+    li(_, "One");
+    li(_, "Two");
   });
 }
 ```
 
 ### Native control flow
 
-No `v-if`, no `{condition && <X/>}`, no `.map()` wrappers. Creo renders imperatively — use `if`, `for`, `while`, `switch`, or any JavaScript you want. The language IS the template language.
+No `v-if`, no `{condition && <X/>}`, no `.map()` wrappers.
+Creo renders imperatively: use `if`, `for`, `while`, `switch`, or any JavaScript you want.
+
+**The language is the template language on its own**:
 
 ```ts
 render() {
@@ -41,30 +58,21 @@ render() {
 }
 ```
 
-Say _NO_ to:
+It reduces mental load. We don't require people to learn:
 
-- special syntax to learn.
-- framework-specific iteration helpers.
-- ternary gymnastics.
+- Any specific templating syntax
+- Framework-specific iteration helpers.
+- Ternary gymnastics.
 
 ### Minimal model
 
 The entire reactivity model is three concepts:
 
-- **`use(value)`** — local state. Call `.get()`, `.set()`, `.update()`. That's it.
-- **`store.new(value)`** — global state. Same interface. Any view can subscribe with `use(store)`.
-- **`props()`** — read-only, passed by parent. A function call, not a magic object.
-
-No:
-
-- Computed properties
-- Watchers
-- Dependency arrays
-- Selectors
-
-State is explicit: you set it, you read it, you control when things update via `shouldUpdate`.
+- **`use(value)`**: local state. Call `.get()`, `.set()`, `.update()`;
+- **`store.new(value)`**: global store. Same interface. Any view can subscribe with `use(store)`, same to state mechanics. Library takes a shot to manage subscriptions;
+- **`props()`**: read-only, passed by parent;
 
-One of major ideas under the framework "if user can do it with same efficiency, let it outside framework zone"
+One of major ideas under the framework "if user can do it with same efficiency, let it outside framework zone". I want to keep the framework efficient, but with super limited API blast radius.
 
 ### Pluggable renderers
 
@@ -72,7 +80,7 @@ Creo allows any renderer overrides.
 
 - **`HtmlRender`** — DOM output for browsers
 - **`JsonRender`** — JSON AST for testing and serialization
-- **`StringRender`** — HTML strings for SSR
+- **`HtmlStringRenderer`** — HTML strings for SSR
 
 ```ts
 // Browser
@@ -89,7 +97,7 @@ return renderer.renderToString();
 ## Quick Start
 
 ```ts
-import { createApp, view, div, text, button } from "creo";
+import { createApp, view, div, text, button, _ } from "creo";
 import { HtmlRender } from "creo";
 
 const Counter = view<{ initial: number }>(({ props, use }) => {
@@ -120,9 +128,7 @@ Views are components. Define them with `view<Props>()`, which takes a setup func
 ```ts
 const Greeting = view<{ name: string }>(({ props }) => ({
   render() {
-    div({ class: "greeting" }, () => {
-      text(`Hello, ${props().name}!`);
-    });
+    div({ class: "greeting" }, `Hello, ${props().name}!`);
   },
 }));
 
@@ -180,7 +186,7 @@ Pass children via a slot callback — the second argument to any view or primiti
 const Card = view<{ title: string }>(({ props, slot }) => ({
   render() {
     div({ class: "card" }, () => {
-      h1({}, () => text(props().title));
+      h1(_, () => text(props().title));
       div({ class: "card-body" }, slot);
     });
   },
@@ -188,7 +194,7 @@ const Card = view<{ title: string }>(({ props, slot }) => ({
 
 // Usage:
 Card({ title: "Hello" }, () => {
-  p({}, () => text("Card content here."));
+  p(_, "Card content here.");
 });
 ```
 
@@ -238,6 +244,66 @@ render() {
 }
 ```
 
+## Conventions
+
+### `_` for Empty Props
+
+Use `_` (exported from `creo`) instead of `{}` when no props are needed:
+
+```ts
+h1(_, "Title");          // not h1({}, "Title")
+div(_, () => { ... });   // not div({}, () => { ... })
+```
+
+### Inline Strings
+
+Pass strings directly as slots instead of wrapping in `() => text(...)`:
+
+```ts
+button({ onClick: handler }, "Click me"); // not () => text("Click me")
+li(_, "Item text"); // not () => text("Item text")
+```
+
+Use `text()` only for dynamic values or when mixing text with other elements in a function slot.
+
+## Create App
+
+Scaffold a new Creo project with one command:
+
+```bash
+bunx creo-create-app my-app
+cd my-app
+bun install
+bun run dev
+```
+
+The CLI prompts whether to include a **Hono server**. When enabled, the generated project includes:
+
+- A Hono backend (`src/server.ts`) serving static files from `dist/` by default
+- Vite dev server with `/api` proxy to Hono
+- Scripts for both dev (`dev:server` + `dev`) and production (`build` + `start`)
+
+Without a server, you get a pure client-side Vite + Creo setup.
+
+See [`packages/creo-create-app/`](./packages/creo-create-app/) for full details.
+
+## Create Tauri App
+
+Build cross-platform desktop and mobile apps with Creo + Tauri v2:
+
+```bash
+bunx creo-create-tauri-app my-app
+cd my-app
+bun install
+bun run tauri:dev
+```
+
+The CLI lets you select target platforms: **macOS**, **Windows**, **Linux**, **iOS**, **Android**, and **Web**. Desktop targets work immediately; mobile targets require a one-time `tauri ios init` / `tauri android init` after scaffolding.
+
+The generated project includes a full Tauri v2 setup (`src-tauri/`) with Rust backend, Vite frontend, and a sample Tauri command.
+
+See [`packages/creo-create-tauri-app/`](./packages/creo-create-tauri-app/) for full details.
+
 ## Router
 
 Hash-based router available as `creo-router` (separate package):
@@ -254,7 +320,7 @@ const { routeStore, navigate, RouterView, Link } = createRouter({
 });
 
 // Navigation:
-Link({ href: "/users/42" }, () => text("User 42"));
+Link({ href: "/users/42" }, "User 42");
 navigate("/users/42"); // programmatic
 
 // Read params:
@@ -266,11 +332,19 @@ route.get().params.id; // "42"
 
 ```bash
 bun install
-bun test src/          # Run tests
-bun tsc      # Type-check
-bun run build          # Build to dist/
+bun test packages/creo/src/    # Run tests
+bun run build                  # Build all packages
+bun run typecheck              # Type-check
 
 # Run examples:
 cd examples/todo && bun install && bun run dev
 cd examples/router && bun install && bun run dev
-```
+
+# Version management:
+bun run version:patch          # Bump patch version across all packages
+bun run version:minor          # Bump minor version
+bun run version:major          # Bump major version
+
+# Publishing:
+bun run publish:all            # Dry-run publish (pass --no-dry-run to publish for real)
+```

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 export { createApp } from "./public/app";
 export { view } from "./public/view";
-export type { ViewBody, ViewFn, Slot, PublicView } from "./public/view";
+export type { ViewBody, ViewFn, Slot, SlotContent, PublicView } from "./public/view";
 export type { Reactive, Use } from "./public/state";
 export { State } from "./public/state";
 export { Store, store, isStore } from "./public/store";