helfy-create 0.0.6 → 0.1.0

package/template/src/context/ThemeContext.tsx

@@ -1,60 +0,0 @@
-import { View, Context, state, useCtx, computed, effect } from "@helfy/helfy";
-
-export type TThemeMode = "light" | "dark";
-
-@Context
-export class ThemeContext {
-  @state mode: TThemeMode = "dark";
-
-  @state toggle = () => {
-    this.mode = this.mode === "dark" ? "light" : "dark";
-  };
-
-  @effect
-  syncToDom() {
-    document.documentElement.classList.toggle("dark", this.mode === "dark");
-  }
-}
-
-@View
-export class ThemeSync {
-  @useCtx(ThemeContext)
-  private theme!: ThemeContext;
-
-  onMount() {
-    document.documentElement.classList.toggle("dark", this.theme.mode === "dark");
-  }
-
-  render() {
-    document.documentElement.classList.toggle("dark", this.theme.mode === "dark");
-    return <span class="hidden" aria-hidden="true"></span>;
-  }
-}
-
-@View
-export class ThemeToggle {
-  @useCtx(ThemeContext, "toggle")
-  private toggle!: ThemeContext["toggle"];
-
-  @useCtx(ThemeContext, "mode")
-  private mode!: ThemeContext["mode"];
-
-  render() {
-    const isDark = this.mode === "dark";
-    return (
-      <button
-        type="button"
-        class="theme-toggle"
-        onclick={this.toggle}
-        title={isDark ? "Light theme" : "Dark theme"}
-        aria-label={isDark ? "Switch to light theme" : "Switch to dark theme"}
-      >
-        {isDark ? (
-          <span>Светлая</span>
-        ) : (
-          <span>Тёмная</span>
-        )}
-      </button>
-    );
-  }
-}

package/template/src/pages/AboutPage.tsx

@@ -1,18 +0,0 @@
-import { View } from "@helfy/helfy";
-
-@View
-export class AboutPage {
-  render() {
-    return (
-      <div class="page">
-        <h1>About</h1>
-        <p>
-          This is a Helfy application with routing, slots, and theme context.
-        </p>
-        <p>
-          Helfy is a declarative framework with decorators, reactive state, and built-in TypeScript support.
-        </p>
-      </div>
-    );
-  }
-}

package/template/src/pages/CounterPage.tsx

@@ -1,17 +0,0 @@
-import { View, state } from "@helfy/helfy";
-
-@View
-export class CounterPage {
-  @state private count = 0;
-
-  render() {
-    return (
-      <div class="page">
-        <h1>Counter</h1>
-        <p>Count: <strong>{this.count}</strong></p>
-        <button class="btn" onclick={() => this.count++}>Increment</button>
-        <button class="btn" onclick={() => this.count--}>Decrement</button>
-      </div>
-    );
-  }
-}

package/template/src/pages/HomePage.tsx

@@ -1,22 +0,0 @@
-import { View } from "@helfy/helfy";
-
-@View
-export class HomePage {
-  render() {
-    return (
-      <div class="page">
-        <h1>Welcome to Helfy</h1>
-        <p>
-          Welcome to Helfy — a modern TypeScript framework for web applications.
-        </p>
-        <p>
-          Edit <code>src/App.tsx</code> and save the file — changes will appear automatically.
-        </p>
-        <h2>Quick Start</h2>
-        <p>
-          Use the sidebar for navigation. Try the Counter page to see reactivity in action and toggle the theme in the top-right corner.
-        </p>
-      </div>
-    );
-  }
-}

package/template/src/pages/_router.tsx

@@ -1,15 +0,0 @@
-import { RouterView, View } from "@helfy/helfy";
-import { NotFound } from "@widgets/NotFound/NotFound";
-
-@View
-export class AppRouter {
-  render() {
-    return (
-      <RouterView>
-        @slot.notFound({ pathname }) {
-          <NotFound pathname={pathname} />
-        }
-      </RouterView>
-    );
-  }
-}

package/template/src/pages/layouts/MainLayout.tsx

@@ -1,29 +0,0 @@
-import { View } from "@helfy/helfy";
-
-@View
-export class MainLayout {
-  render() {
-    return (
-      <div class="layout">
-        <header class="header">
-          @slot:header()
-        </header>
-        <div class="layout__body">
-          <aside class="sidebar">
-            @slot:sidebar()
-          </aside>
-          <main class="main">
-            <div class="main__content">
-              @slot:content()
-            </div>
-          </main>
-        </div>
-        <footer class="footer">
-          @slot:footer() fallback {
-            <span>© 2026</span>
-          }
-        </footer>
-      </div>
-    );
-  }
-}

package/template/src/widgets/Footer/Footer.tsx

@@ -1,8 +0,0 @@
-import { View } from "@helfy/helfy";
-
-@View
-export class Footer {
-  render() {
-    return (<span>Powered by HelfyFramework — © 2026</span>);
-  }
-}

package/template/src/widgets/Header/Header.tsx

@@ -1,34 +0,0 @@
-import { ThemeToggle } from "@context/ThemeContext";
-import { Link, path, View } from "@helfy/helfy";
-
-@View
-export class Header {
-  @path()
-  private pathname?: string;
-
-  render() {
-    return (
-      <div class="header__inner">
-        <Link to="/" label="Helfy" class="header__logo" />
-        <nav class="nav">
-          <Link
-            to="/"
-            label="Home"
-            class={this.pathname === "/" ? "nav-link--active" : ""}
-          />
-          <Link
-            to="/counter"
-            label="Counter"
-            class={this.pathname === "/counter" ? "nav-link--active" : ""}
-          />
-          <Link
-            to="/about"
-            label="About"
-            class={this.pathname === "/about" ? "nav-link--active" : ""}
-          />
-        </nav>
-        <ThemeToggle />
-      </div>
-    );
-  }
-}

package/template/src/widgets/Navbar/Navbar.tsx

@@ -1,29 +0,0 @@
-import { Link, path, View } from "@helfy/helfy";
-
-@View
-export class NavBar {
-  @path()
-  private pathname?: string;
-
-  render() {
-    return (
-      <nav class="sidebar-nav">
-        <Link
-          to="/"
-          label="Home"
-          class={this.pathname === "/" ? "nav-link nav-link--active" : "nav-link"}
-        />
-        <Link
-          to="/counter"
-          label="Counter"
-          class={this.pathname === "/counter" ? "nav-link nav-link--active" : "nav-link"}
-        />
-        <Link
-          to="/about"
-          label="About"
-          class={this.pathname === "/about" ? "nav-link nav-link--active" : "nav-link"}
-        />
-      </nav>
-    );
-  }
-}

package/template/src/widgets/NotFound/NotFound.tsx

@@ -1,31 +0,0 @@
-import { Link, View } from "@helfy/helfy";
-
-export interface Props {
-  pathname?: string;
-}
-
-@View
-/** Custom 404 page — overrides the fallback RouterView. */
-export class NotFound {
-  constructor(private readonly props: Props = {}) {}
-
-  render() {
-    return (
-      <section class="not-found">
-        <div class="not-found__code">404</div>
-        <h1 class="not-found__title">Oops! Page not found</h1>
-        <p class="not-found__text">
-          The requested address does not exist or has been moved.
-        </p>
-        {(this.props.pathname ?? "") && (
-          <p class="not-found__path">{this.props.pathname}</p>
-        )}
-        <Link
-          to="/"
-          label="Back to home"
-          class="btn btn--primary"
-        />
-      </section>
-    );
-  }
-}