@gtkx/css 0.9.1 → 0.9.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -22,7 +22,7 @@ GTKX lets you build native Linux desktop applications using React and TypeScript
22
22
  ## Features
23
23
 
24
24
  - **React** — Hooks, state, props, and components you already know
25
- - **Hot Reload** — Edit code and see changes instantly via Vite
25
+ - **HMR** — Edit code and see changes instantly via Vite
26
26
  - **Native** — Direct FFI bindings to GTK4 via Rust and libffi
27
27
  - **CLI** — `npx @gtkx/cli@latest create` scaffolds a ready-to-go project
28
28
  - **CSS-in-JS** — Emotion-style `css` template literals for GTK styling
@@ -41,14 +41,7 @@ Edit your code and see changes instantly—no restart needed.
41
41
  ### Example
42
42
 
43
43
  ```tsx
44
- import {
45
- render,
46
- ApplicationWindow,
47
- Box,
48
- Button,
49
- Label,
50
- quit,
51
- } from "@gtkx/react";
44
+ import { render, ApplicationWindow, Box, Button, quit } from "@gtkx/react";
52
45
  import * as Gtk from "@gtkx/ffi/gtk";
53
46
  import { useState } from "react";
54
47
 
@@ -58,7 +51,7 @@ const App = () => {
58
51
  return (
59
52
  <ApplicationWindow title="Counter" onCloseRequest={quit}>
60
53
  <Box orientation={Gtk.Orientation.VERTICAL} spacing={12}>
61
- <Label label={`Count: ${count}`} />
54
+ {`Count: ${count}`}
62
55
  <Button label="Increment" onClicked={() => setCount((c) => c + 1)} />
63
56
  </Box>
64
57
  </ApplicationWindow>
@@ -84,8 +77,6 @@ const primary = css`
84
77
  <Button label="Click me" cssClasses={[primary]} />;
85
78
  ```
86
79
 
87
- GTK also provides built-in classes like `suggested-action`, `destructive-action`, `card`, and `heading`.
88
-
89
80
  ## Testing
90
81
 
91
82
  ```tsx
@@ -109,9 +100,8 @@ test("increments count", async () => {
109
100
 
110
101
  ## Requirements
111
102
 
112
- - Node.js 20+
103
+ - Node.js 20+ (Deno support experimental)
113
104
  - GTK4 Runtime (`gtk4` on Fedora, `libgtk-4-1` on Ubuntu)
114
- - Linux
115
105
 
116
106
  ## Contributing
117
107
 
package/dist/cache.d.ts CHANGED
@@ -1,9 +1,2 @@
1
1
  import type { EmotionCache } from "@emotion/cache";
2
- /**
3
- * Creates and returns a singleton Emotion cache configured for GTK.
4
- * Uses StyleSheet to inject styles into GTK's CssProvider.
5
- *
6
- * Implementation note: Emotion's internal sheet type is not publicly exported,
7
- * so we cast our StyleSheet which implements the required interface.
8
- */
9
2
  export declare const getGtkCache: () => EmotionCache;
package/dist/cache.js CHANGED
@@ -1,13 +1,6 @@
1
1
  import createCache from "@emotion/cache";
2
2
  import { StyleSheet } from "./style-sheet.js";
3
3
  let gtkCache = null;
4
- /**
5
- * Creates and returns a singleton Emotion cache configured for GTK.
6
- * Uses StyleSheet to inject styles into GTK's CssProvider.
7
- *
8
- * Implementation note: Emotion's internal sheet type is not publicly exported,
9
- * so we cast our StyleSheet which implements the required interface.
10
- */
11
4
  export const getGtkCache = () => {
12
5
  if (!gtkCache) {
13
6
  const sheet = new StyleSheet({ key: "gtkx" });
@@ -5,12 +5,6 @@ type StyleSheetOptions = {
5
5
  speedy?: boolean;
6
6
  prepend?: boolean;
7
7
  };
8
- /**
9
- * Custom StyleSheet implementation for Emotion that outputs to GTK's CssProvider.
10
- * Implements Emotion's StyleSheet interface to enable CSS-in-JS with GTK widgets.
11
- *
12
- * Rules are queued until GTK is initialized, then applied automatically.
13
- */
14
8
  export declare class StyleSheet {
15
9
  key: string;
16
10
  private rules;
@@ -20,12 +20,6 @@ const resetGtkState = () => {
20
20
  events.once("start", flushPendingStyles);
21
21
  // Handle stop to reset state and prepare for potential restart
22
22
  events.on("stop", resetGtkState);
23
- /**
24
- * Custom StyleSheet implementation for Emotion that outputs to GTK's CssProvider.
25
- * Implements Emotion's StyleSheet interface to enable CSS-in-JS with GTK widgets.
26
- *
27
- * Rules are queued until GTK is initialized, then applied automatically.
28
- */
29
23
  export class StyleSheet {
30
24
  key;
31
25
  rules = [];
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gtkx/css",
3
- "version": "0.9.1",
3
+ "version": "0.9.2",
4
4
  "description": "Emotion-style CSS-in-JS for GTKX applications",
5
5
  "keywords": [
6
6
  "gtk",
@@ -35,7 +35,7 @@
35
35
  "dependencies": {
36
36
  "@emotion/cache": "^11.14.0",
37
37
  "@emotion/serialize": "^1.3.3",
38
- "@gtkx/ffi": "0.9.1"
38
+ "@gtkx/ffi": "0.9.2"
39
39
  },
40
40
  "scripts": {
41
41
  "build": "tsc -b && cp ../../README.md .",