@gtkx/css 0.21.0 → 1.0.0-rc.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 +137 -34
- package/dist/create-css.d.ts +12 -0
- package/dist/create-css.d.ts.map +1 -0
- package/dist/create-css.js +87 -0
- package/dist/create-css.js.map +1 -0
- package/dist/index.d.ts +17 -2
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +18 -2
- package/dist/index.js.map +1 -1
- package/dist/named-colors.d.ts +6 -0
- package/dist/named-colors.d.ts.map +1 -0
- package/dist/named-colors.js +8 -0
- package/dist/named-colors.js.map +1 -0
- package/dist/provider.d.ts +6 -0
- package/dist/provider.d.ts.map +1 -0
- package/dist/provider.js +28 -0
- package/dist/provider.js.map +1 -0
- package/dist/stylesheet.d.ts +10 -0
- package/dist/stylesheet.d.ts.map +1 -0
- package/dist/stylesheet.js +33 -0
- package/dist/stylesheet.js.map +1 -0
- package/package.json +12 -12
- package/src/create-css.ts +125 -0
- package/src/index.ts +19 -2
- package/src/named-colors.ts +13 -0
- package/src/provider.ts +36 -0
- package/src/stylesheet.ts +43 -0
- package/dist/cache.d.ts +0 -3
- package/dist/cache.d.ts.map +0 -1
- package/dist/cache.js +0 -15
- package/dist/cache.js.map +0 -1
- package/dist/css.d.ts +0 -95
- package/dist/css.d.ts.map +0 -1
- package/dist/css.js +0 -145
- package/dist/css.js.map +0 -1
- package/dist/style-sheet.d.ts +0 -26
- package/dist/style-sheet.d.ts.map +0 -1
- package/dist/style-sheet.js +0 -85
- package/dist/style-sheet.js.map +0 -1
- package/src/cache.ts +0 -20
- package/src/css.ts +0 -163
- package/src/style-sheet.ts +0 -111
|
@@ -0,0 +1,125 @@
|
|
|
1
|
+
import type { CSSInterpolation, RegisteredCache, SerializedStyles } from "@emotion/serialize";
|
|
2
|
+
import type { Element } from "stylis";
|
|
3
|
+
import { serializeStyles } from "@emotion/serialize";
|
|
4
|
+
import { compile, middleware, rulesheet, stringify, serialize as stylisSerialize } from "stylis";
|
|
5
|
+
import { escapeNamedColors, restoreNamedColors } from "./named-colors.js";
|
|
6
|
+
import { StyleSheet } from "./stylesheet.js";
|
|
7
|
+
|
|
8
|
+
type CxToken = string | boolean | undefined | null;
|
|
9
|
+
|
|
10
|
+
type Css = {
|
|
11
|
+
css: (...args: CSSInterpolation[]) => string;
|
|
12
|
+
cx: (...classNames: CxToken[]) => string[];
|
|
13
|
+
injectGlobal: (...args: CSSInterpolation[]) => void;
|
|
14
|
+
};
|
|
15
|
+
|
|
16
|
+
type TokenPartition = { rawClasses: string[]; registeredStyles: string[] };
|
|
17
|
+
type CssState = { sheet: StyleSheet; inserted: Set<string>; registered: RegisteredCache };
|
|
18
|
+
|
|
19
|
+
const KEY = "gtkx";
|
|
20
|
+
const LABEL_DECL_FIRST_CHAR = 108;
|
|
21
|
+
const LABEL_DECL_THIRD_CHAR = 98;
|
|
22
|
+
|
|
23
|
+
const removeLabel = (element: Element): void => {
|
|
24
|
+
if (!(element.type === "decl" &&
|
|
25
|
+
element.value.codePointAt(0) === LABEL_DECL_FIRST_CHAR &&
|
|
26
|
+
element.value.codePointAt(2) === LABEL_DECL_THIRD_CHAR)) {
|
|
27
|
+
return;
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
element.return = "";
|
|
31
|
+
element.value = "";
|
|
32
|
+
};
|
|
33
|
+
|
|
34
|
+
const getClassName = (serialized: SerializedStyles): string => `${KEY}-${serialized.name}`;
|
|
35
|
+
const isNonEmptyString = (token: CxToken): token is string => typeof token === "string" && token.length > 0;
|
|
36
|
+
|
|
37
|
+
const partitionTokens = (tokens: string[], registered: RegisteredCache): TokenPartition => {
|
|
38
|
+
const rawClasses: string[] = [];
|
|
39
|
+
const registeredStyles: string[] = [];
|
|
40
|
+
|
|
41
|
+
for (const token of tokens) {
|
|
42
|
+
const styles = registered[token];
|
|
43
|
+
|
|
44
|
+
if (styles === undefined) {
|
|
45
|
+
rawClasses.push(token);
|
|
46
|
+
} else {
|
|
47
|
+
registeredStyles.push(styles);
|
|
48
|
+
}
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
return { rawClasses, registeredStyles };
|
|
52
|
+
};
|
|
53
|
+
|
|
54
|
+
const runStylis = (sheet: StyleSheet, input: string): void => {
|
|
55
|
+
stylisSerialize(
|
|
56
|
+
compile(escapeNamedColors(input)),
|
|
57
|
+
middleware([
|
|
58
|
+
removeLabel,
|
|
59
|
+
stringify,
|
|
60
|
+
rulesheet((rule) => {
|
|
61
|
+
sheet.insert(restoreNamedColors(rule));
|
|
62
|
+
}),
|
|
63
|
+
]),
|
|
64
|
+
);
|
|
65
|
+
};
|
|
66
|
+
|
|
67
|
+
const didMarkNewStyle = (state: CssState, serialized: SerializedStyles): boolean => {
|
|
68
|
+
if (state.inserted.has(serialized.name)) {
|
|
69
|
+
return false;
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
state.inserted.add(serialized.name);
|
|
73
|
+
|
|
74
|
+
return true;
|
|
75
|
+
};
|
|
76
|
+
|
|
77
|
+
const insertStyles = (state: CssState, serialized: SerializedStyles): void => {
|
|
78
|
+
if (!didMarkNewStyle(state, serialized)) {
|
|
79
|
+
return;
|
|
80
|
+
}
|
|
81
|
+
|
|
82
|
+
const className = getClassName(serialized);
|
|
83
|
+
runStylis(state.sheet, `.${className}{${serialized.styles}}`);
|
|
84
|
+
state.registered[className] = serialized.styles;
|
|
85
|
+
};
|
|
86
|
+
|
|
87
|
+
const insertWithoutScoping = (state: CssState, serialized: SerializedStyles): void => {
|
|
88
|
+
if (!didMarkNewStyle(state, serialized)) {
|
|
89
|
+
return;
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
runStylis(state.sheet, serialized.styles);
|
|
93
|
+
};
|
|
94
|
+
|
|
95
|
+
const cssClassName = (state: CssState, args: CSSInterpolation[]): string => {
|
|
96
|
+
const serialized = serializeStyles(args, state.registered);
|
|
97
|
+
insertStyles(state, serialized);
|
|
98
|
+
|
|
99
|
+
return getClassName(serialized);
|
|
100
|
+
};
|
|
101
|
+
|
|
102
|
+
const cxClassNames = (state: CssState, classNames: CxToken[]): string[] => {
|
|
103
|
+
const tokens = classNames.filter(isNonEmptyString);
|
|
104
|
+
const { rawClasses, registeredStyles } = partitionTokens(tokens, state.registered);
|
|
105
|
+
|
|
106
|
+
if (registeredStyles.length < 2) {
|
|
107
|
+
return tokens;
|
|
108
|
+
}
|
|
109
|
+
|
|
110
|
+
return [...rawClasses, cssClassName(state, [registeredStyles.join("")])];
|
|
111
|
+
};
|
|
112
|
+
|
|
113
|
+
const createCss = (): Css => {
|
|
114
|
+
const state: CssState = { sheet: new StyleSheet(), inserted: new Set(), registered: {} };
|
|
115
|
+
|
|
116
|
+
return {
|
|
117
|
+
css: (...args) => cssClassName(state, args),
|
|
118
|
+
cx: (...classNames) => cxClassNames(state, classNames),
|
|
119
|
+
injectGlobal: (...args) => {
|
|
120
|
+
insertWithoutScoping(state, serializeStyles(args, state.registered));
|
|
121
|
+
},
|
|
122
|
+
};
|
|
123
|
+
};
|
|
124
|
+
|
|
125
|
+
export { removeLabel, createCss, type Css };
|
package/src/index.ts
CHANGED
|
@@ -1,3 +1,20 @@
|
|
|
1
|
-
|
|
1
|
+
import { createCss, type Css } from "./create-css.js";
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
const instance = createCss();
|
|
4
|
+
/**
|
|
5
|
+
* Serializes the given style interpolations, inserts the resulting rules into
|
|
6
|
+
* the default stylesheet, and returns the generated GTK4 CSS class name.
|
|
7
|
+
*/
|
|
8
|
+
const css: Css["css"] = instance.css;
|
|
9
|
+
/**
|
|
10
|
+
* Combines class name tokens, filtering out falsy values and merging any
|
|
11
|
+
* gtkx-registered styles into a single generated class.
|
|
12
|
+
*/
|
|
13
|
+
const cx: Css["cx"] = instance.cx;
|
|
14
|
+
/**
|
|
15
|
+
* Serializes and inserts the given styles into the default stylesheet globally,
|
|
16
|
+
* without scoping them to a generated class.
|
|
17
|
+
*/
|
|
18
|
+
const injectGlobal: Css["injectGlobal"] = instance.injectGlobal;
|
|
19
|
+
|
|
20
|
+
export { css, cx, injectGlobal };
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
const AT_RULE_KEYWORDS: Set<string> = new Set(["define-color", "import", "keyframes", "media"]);
|
|
2
|
+
const AT_IDENTIFIER_PATTERN = /@([A-Za-z_][\w-]*)/g;
|
|
3
|
+
const NAMED_COLOR_TOKEN = "gtkx-named-color__";
|
|
4
|
+
const NAMED_COLOR_TOKEN_PATTERN = new RegExp(String.raw`${NAMED_COLOR_TOKEN}([\w-]+)`, "g");
|
|
5
|
+
|
|
6
|
+
const escapeNamedColors = (input: string): string =>
|
|
7
|
+
input.replaceAll(AT_IDENTIFIER_PATTERN, (match, name: string) =>
|
|
8
|
+
AT_RULE_KEYWORDS.has(name) ? match : `${NAMED_COLOR_TOKEN}${name}`,
|
|
9
|
+
);
|
|
10
|
+
|
|
11
|
+
const restoreNamedColors = (rule: string): string => rule.replaceAll(NAMED_COLOR_TOKEN_PATTERN, "@$1");
|
|
12
|
+
|
|
13
|
+
export { AT_RULE_KEYWORDS, NAMED_COLOR_TOKEN, escapeNamedColors, restoreNamedColors };
|
package/src/provider.ts
ADDED
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
import type { Logger } from "@gtkx/utils";
|
|
2
|
+
import { type Display, DisplayManager } from "@gtkx/gi/gdk";
|
|
3
|
+
import { CssProvider, STYLE_PROVIDER_PRIORITY_APPLICATION, StyleContext } from "@gtkx/gi/gtk";
|
|
4
|
+
|
|
5
|
+
const registerProviderForDefaultDisplay = (
|
|
6
|
+
priority: number = STYLE_PROVIDER_PRIORITY_APPLICATION,
|
|
7
|
+
): CssProvider => {
|
|
8
|
+
const provider = new CssProvider();
|
|
9
|
+
const manager = DisplayManager.get();
|
|
10
|
+
|
|
11
|
+
const attach = (display: Display): void => {
|
|
12
|
+
StyleContext.addProviderForDisplay(display, provider, priority);
|
|
13
|
+
};
|
|
14
|
+
|
|
15
|
+
const initialDisplay = manager.getDefaultDisplay();
|
|
16
|
+
|
|
17
|
+
if (initialDisplay) {
|
|
18
|
+
attach(initialDisplay);
|
|
19
|
+
} else {
|
|
20
|
+
manager.once("display-opened", (openedDisplay: Display): void => {
|
|
21
|
+
attach(openedDisplay);
|
|
22
|
+
});
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
return provider;
|
|
26
|
+
};
|
|
27
|
+
|
|
28
|
+
const attachParsingErrorLogger = (provider: CssProvider, log: Logger, subject: string): void => {
|
|
29
|
+
if (process.env.NODE_ENV !== "production") {
|
|
30
|
+
provider.on("parsing-error", (section, error) => {
|
|
31
|
+
log.warn(`GTK4 rejected ${subject} at ${section.toString()}: ${error.message}`);
|
|
32
|
+
});
|
|
33
|
+
}
|
|
34
|
+
};
|
|
35
|
+
|
|
36
|
+
export { registerProviderForDefaultDisplay, attachParsingErrorLogger };
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import type * as Gtk from "@gtkx/gi/gtk";
|
|
2
|
+
import { createLogger } from "@gtkx/utils";
|
|
3
|
+
import { attachParsingErrorLogger, registerProviderForDefaultDisplay } from "./provider.js";
|
|
4
|
+
|
|
5
|
+
const log = createLogger("css");
|
|
6
|
+
|
|
7
|
+
class StyleSheet {
|
|
8
|
+
private css = "";
|
|
9
|
+
private provider: Gtk.CssProvider | null = null;
|
|
10
|
+
private updateScheduled = false;
|
|
11
|
+
|
|
12
|
+
private ensureProvider(): Gtk.CssProvider {
|
|
13
|
+
if (this.provider) {
|
|
14
|
+
return this.provider;
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
const provider = registerProviderForDefaultDisplay();
|
|
18
|
+
this.provider = provider;
|
|
19
|
+
attachParsingErrorLogger(provider, log, "CSS");
|
|
20
|
+
|
|
21
|
+
return provider;
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
private scheduleUpdate(): void {
|
|
25
|
+
if (this.updateScheduled) {
|
|
26
|
+
return;
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
this.updateScheduled = true;
|
|
30
|
+
|
|
31
|
+
queueMicrotask(() => {
|
|
32
|
+
this.updateScheduled = false;
|
|
33
|
+
this.ensureProvider().loadFromString(this.css);
|
|
34
|
+
});
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
insert(rule: string): void {
|
|
38
|
+
this.css += this.css.length > 0 ? `\n${rule}` : rule;
|
|
39
|
+
this.scheduleUpdate();
|
|
40
|
+
}
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
export { StyleSheet };
|
package/dist/cache.d.ts
DELETED
package/dist/cache.d.ts.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"cache.d.ts","sourceRoot":"","sources":["../src/cache.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAMnD,eAAO,MAAM,WAAW,QAAO,YAa9B,CAAC"}
|
package/dist/cache.js
DELETED
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import createCache from "@emotion/cache";
|
|
2
|
-
import { StyleSheet } from "./style-sheet.js";
|
|
3
|
-
let gtkCache = null;
|
|
4
|
-
export const getGtkCache = () => {
|
|
5
|
-
if (!gtkCache) {
|
|
6
|
-
const sheet = new StyleSheet({ key: "gtkx" });
|
|
7
|
-
gtkCache = createCache({
|
|
8
|
-
key: "gtkx",
|
|
9
|
-
container: null,
|
|
10
|
-
});
|
|
11
|
-
gtkCache.sheet = sheet;
|
|
12
|
-
}
|
|
13
|
-
return gtkCache;
|
|
14
|
-
};
|
|
15
|
-
//# sourceMappingURL=cache.js.map
|
package/dist/cache.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"cache.js","sourceRoot":"","sources":["../src/cache.ts"],"names":[],"mappings":"AACA,OAAO,WAAW,MAAM,gBAAgB,CAAC;AACzC,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAE9C,IAAI,QAAQ,GAAwB,IAAI,CAAC;AAEzC,MAAM,CAAC,MAAM,WAAW,GAAG,GAAiB,EAAE;IAC1C,IAAI,CAAC,QAAQ,EAAE,CAAC;QACZ,MAAM,KAAK,GAAG,IAAI,UAAU,CAAC,EAAE,GAAG,EAAE,MAAM,EAAE,CAAC,CAAC;QAE9C,QAAQ,GAAG,WAAW,CAAC;YACnB,GAAG,EAAE,MAAM;YACX,SAAS,EAAE,IAAI;SAClB,CAAC,CAAC;QAEH,QAAQ,CAAC,KAAK,GAAG,KAAyC,CAAC;IAC/D,CAAC;IAED,OAAO,QAAQ,CAAC;AACpB,CAAC,CAAC"}
|
package/dist/css.d.ts
DELETED
|
@@ -1,95 +0,0 @@
|
|
|
1
|
-
import type { CSSInterpolation } from "@emotion/serialize";
|
|
2
|
-
/**
|
|
3
|
-
* Branded type for CSS class names generated by {@link css}.
|
|
4
|
-
* @internal
|
|
5
|
-
*/
|
|
6
|
-
type CSSClassName = string & {
|
|
7
|
-
__brand: "css";
|
|
8
|
-
};
|
|
9
|
-
/**
|
|
10
|
-
* Creates a CSS class from style definitions.
|
|
11
|
-
*
|
|
12
|
-
* Uses Emotion's CSS-in-JS system adapted for GTK CSS. Supports nested selectors
|
|
13
|
-
* using `&` for the parent selector reference.
|
|
14
|
-
*
|
|
15
|
-
* @param args - CSS style definitions (objects, template literals, or interpolations)
|
|
16
|
-
* @returns A unique class name to use with `cssClasses` prop
|
|
17
|
-
*
|
|
18
|
-
* @example
|
|
19
|
-
* ```tsx
|
|
20
|
-
* import { css } from "@gtkx/css";
|
|
21
|
-
*
|
|
22
|
-
* const buttonStyle = css({
|
|
23
|
-
* padding: "8px 16px",
|
|
24
|
-
* borderRadius: "4px",
|
|
25
|
-
* "&:hover": {
|
|
26
|
-
* backgroundColor: "@accent_bg_color",
|
|
27
|
-
* },
|
|
28
|
-
* });
|
|
29
|
-
*
|
|
30
|
-
* <GtkButton cssClasses={[buttonStyle]} label="Styled Button" />
|
|
31
|
-
* ```
|
|
32
|
-
*
|
|
33
|
-
* @example
|
|
34
|
-
* ```tsx
|
|
35
|
-
* // Template literal syntax
|
|
36
|
-
* const labelStyle = css`
|
|
37
|
-
* font-size: 14px;
|
|
38
|
-
* color: @theme_text_color;
|
|
39
|
-
* `;
|
|
40
|
-
* ```
|
|
41
|
-
*
|
|
42
|
-
* @see {@link cx} for combining class names
|
|
43
|
-
* @see {@link injectGlobal} for global styles
|
|
44
|
-
*/
|
|
45
|
-
export declare const css: (...args: CSSInterpolation[]) => CSSClassName;
|
|
46
|
-
/**
|
|
47
|
-
* Combines multiple class names into an array for use with cssClasses prop.
|
|
48
|
-
*
|
|
49
|
-
* Filters out falsy values, allowing conditional class application.
|
|
50
|
-
*
|
|
51
|
-
* @param classNames - Class names, booleans, undefined, or null values
|
|
52
|
-
* @returns Array of valid class names
|
|
53
|
-
*
|
|
54
|
-
* @example
|
|
55
|
-
* ```tsx
|
|
56
|
-
* import { css, cx } from "@gtkx/css";
|
|
57
|
-
*
|
|
58
|
-
* const base = css({ padding: "8px" });
|
|
59
|
-
* const active = css({ backgroundColor: "@accent_bg_color" });
|
|
60
|
-
*
|
|
61
|
-
* <GtkButton
|
|
62
|
-
* cssClasses={cx(base, isActive && active, "custom-class")}
|
|
63
|
-
* label="Button"
|
|
64
|
-
* />
|
|
65
|
-
* ```
|
|
66
|
-
*/
|
|
67
|
-
export declare const cx: (...classNames: (string | boolean | undefined | null)[]) => string[];
|
|
68
|
-
/**
|
|
69
|
-
* Injects global CSS styles without a wrapping class.
|
|
70
|
-
*
|
|
71
|
-
* Use for application-wide styles, CSS variables, or styling native GTK widgets.
|
|
72
|
-
*
|
|
73
|
-
* @param args - CSS style definitions
|
|
74
|
-
*
|
|
75
|
-
* @example
|
|
76
|
-
* ```tsx
|
|
77
|
-
* import { injectGlobal } from "@gtkx/css";
|
|
78
|
-
*
|
|
79
|
-
* injectGlobal`
|
|
80
|
-
* window {
|
|
81
|
-
* background-color: @theme_bg_color;
|
|
82
|
-
* }
|
|
83
|
-
*
|
|
84
|
-
* .title-1 {
|
|
85
|
-
* font-size: 24px;
|
|
86
|
-
* font-weight: bold;
|
|
87
|
-
* }
|
|
88
|
-
* `;
|
|
89
|
-
* ```
|
|
90
|
-
*
|
|
91
|
-
* @see {@link css} for scoped class-based styles
|
|
92
|
-
*/
|
|
93
|
-
export declare const injectGlobal: (...args: CSSInterpolation[]) => void;
|
|
94
|
-
export {};
|
|
95
|
-
//# sourceMappingURL=css.d.ts.map
|
package/dist/css.d.ts.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"css.d.ts","sourceRoot":"","sources":["../src/css.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAI3D;;;GAGG;AACH,KAAK,YAAY,GAAG,MAAM,GAAG;IAAE,OAAO,EAAE,KAAK,CAAA;CAAE,CAAC;AA6ChD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmCG;AACH,eAAO,MAAM,GAAG,GAAI,GAAG,MAAM,gBAAgB,EAAE,KAAG,YAcjD,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,eAAO,MAAM,EAAE,GAAI,GAAG,YAAY,CAAC,MAAM,GAAG,OAAO,GAAG,SAAS,GAAG,IAAI,CAAC,EAAE,KAAG,MAAM,EACE,CAAC;AAErF;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,eAAO,MAAM,YAAY,GAAI,GAAG,MAAM,gBAAgB,EAAE,KAAG,IAQ1D,CAAC"}
|
package/dist/css.js
DELETED
|
@@ -1,145 +0,0 @@
|
|
|
1
|
-
import { serializeStyles } from "@emotion/serialize";
|
|
2
|
-
import { getGtkCache } from "./cache.js";
|
|
3
|
-
function expandNestedRules(styles, className) {
|
|
4
|
-
const selector = `.${className}`;
|
|
5
|
-
const expandedStyles = styles.replace(/&/g, selector);
|
|
6
|
-
const rules = [];
|
|
7
|
-
let topLevelProperties = "";
|
|
8
|
-
let currentSegment = "";
|
|
9
|
-
let braceDepth = 0;
|
|
10
|
-
for (let i = 0; i < expandedStyles.length; i++) {
|
|
11
|
-
const char = expandedStyles[i];
|
|
12
|
-
if (char === "{") {
|
|
13
|
-
currentSegment += char;
|
|
14
|
-
braceDepth++;
|
|
15
|
-
}
|
|
16
|
-
else if (char === "}") {
|
|
17
|
-
braceDepth--;
|
|
18
|
-
currentSegment += char;
|
|
19
|
-
if (braceDepth === 0) {
|
|
20
|
-
rules.push(currentSegment.trim());
|
|
21
|
-
currentSegment = "";
|
|
22
|
-
}
|
|
23
|
-
}
|
|
24
|
-
else if (char === ";" && braceDepth === 0) {
|
|
25
|
-
topLevelProperties += currentSegment + char;
|
|
26
|
-
currentSegment = "";
|
|
27
|
-
}
|
|
28
|
-
else {
|
|
29
|
-
currentSegment += char;
|
|
30
|
-
}
|
|
31
|
-
}
|
|
32
|
-
if (currentSegment.trim() && braceDepth === 0) {
|
|
33
|
-
topLevelProperties += currentSegment;
|
|
34
|
-
}
|
|
35
|
-
const allRules = [];
|
|
36
|
-
if (topLevelProperties.trim()) {
|
|
37
|
-
allRules.push(`${selector}{${topLevelProperties.trim()}}`);
|
|
38
|
-
}
|
|
39
|
-
allRules.push(...rules);
|
|
40
|
-
return allRules.join("\n");
|
|
41
|
-
}
|
|
42
|
-
/**
|
|
43
|
-
* Creates a CSS class from style definitions.
|
|
44
|
-
*
|
|
45
|
-
* Uses Emotion's CSS-in-JS system adapted for GTK CSS. Supports nested selectors
|
|
46
|
-
* using `&` for the parent selector reference.
|
|
47
|
-
*
|
|
48
|
-
* @param args - CSS style definitions (objects, template literals, or interpolations)
|
|
49
|
-
* @returns A unique class name to use with `cssClasses` prop
|
|
50
|
-
*
|
|
51
|
-
* @example
|
|
52
|
-
* ```tsx
|
|
53
|
-
* import { css } from "@gtkx/css";
|
|
54
|
-
*
|
|
55
|
-
* const buttonStyle = css({
|
|
56
|
-
* padding: "8px 16px",
|
|
57
|
-
* borderRadius: "4px",
|
|
58
|
-
* "&:hover": {
|
|
59
|
-
* backgroundColor: "@accent_bg_color",
|
|
60
|
-
* },
|
|
61
|
-
* });
|
|
62
|
-
*
|
|
63
|
-
* <GtkButton cssClasses={[buttonStyle]} label="Styled Button" />
|
|
64
|
-
* ```
|
|
65
|
-
*
|
|
66
|
-
* @example
|
|
67
|
-
* ```tsx
|
|
68
|
-
* // Template literal syntax
|
|
69
|
-
* const labelStyle = css`
|
|
70
|
-
* font-size: 14px;
|
|
71
|
-
* color: @theme_text_color;
|
|
72
|
-
* `;
|
|
73
|
-
* ```
|
|
74
|
-
*
|
|
75
|
-
* @see {@link cx} for combining class names
|
|
76
|
-
* @see {@link injectGlobal} for global styles
|
|
77
|
-
*/
|
|
78
|
-
export const css = (...args) => {
|
|
79
|
-
const cache = getGtkCache();
|
|
80
|
-
const serialized = serializeStyles(args, cache.registered);
|
|
81
|
-
const className = `${cache.key}-${serialized.name}`;
|
|
82
|
-
if (cache.inserted[serialized.name] === undefined) {
|
|
83
|
-
const cssRule = expandNestedRules(serialized.styles, className);
|
|
84
|
-
cache.sheet.insert(cssRule);
|
|
85
|
-
cache.inserted[serialized.name] = serialized.styles;
|
|
86
|
-
cache.registered[className] = serialized.styles;
|
|
87
|
-
}
|
|
88
|
-
return className;
|
|
89
|
-
};
|
|
90
|
-
/**
|
|
91
|
-
* Combines multiple class names into an array for use with cssClasses prop.
|
|
92
|
-
*
|
|
93
|
-
* Filters out falsy values, allowing conditional class application.
|
|
94
|
-
*
|
|
95
|
-
* @param classNames - Class names, booleans, undefined, or null values
|
|
96
|
-
* @returns Array of valid class names
|
|
97
|
-
*
|
|
98
|
-
* @example
|
|
99
|
-
* ```tsx
|
|
100
|
-
* import { css, cx } from "@gtkx/css";
|
|
101
|
-
*
|
|
102
|
-
* const base = css({ padding: "8px" });
|
|
103
|
-
* const active = css({ backgroundColor: "@accent_bg_color" });
|
|
104
|
-
*
|
|
105
|
-
* <GtkButton
|
|
106
|
-
* cssClasses={cx(base, isActive && active, "custom-class")}
|
|
107
|
-
* label="Button"
|
|
108
|
-
* />
|
|
109
|
-
* ```
|
|
110
|
-
*/
|
|
111
|
-
export const cx = (...classNames) => classNames.filter((cn) => typeof cn === "string" && cn.length > 0);
|
|
112
|
-
/**
|
|
113
|
-
* Injects global CSS styles without a wrapping class.
|
|
114
|
-
*
|
|
115
|
-
* Use for application-wide styles, CSS variables, or styling native GTK widgets.
|
|
116
|
-
*
|
|
117
|
-
* @param args - CSS style definitions
|
|
118
|
-
*
|
|
119
|
-
* @example
|
|
120
|
-
* ```tsx
|
|
121
|
-
* import { injectGlobal } from "@gtkx/css";
|
|
122
|
-
*
|
|
123
|
-
* injectGlobal`
|
|
124
|
-
* window {
|
|
125
|
-
* background-color: @theme_bg_color;
|
|
126
|
-
* }
|
|
127
|
-
*
|
|
128
|
-
* .title-1 {
|
|
129
|
-
* font-size: 24px;
|
|
130
|
-
* font-weight: bold;
|
|
131
|
-
* }
|
|
132
|
-
* `;
|
|
133
|
-
* ```
|
|
134
|
-
*
|
|
135
|
-
* @see {@link css} for scoped class-based styles
|
|
136
|
-
*/
|
|
137
|
-
export const injectGlobal = (...args) => {
|
|
138
|
-
const cache = getGtkCache();
|
|
139
|
-
const serialized = serializeStyles(args, cache.registered);
|
|
140
|
-
if (cache.inserted[`global-${serialized.name}`] === undefined) {
|
|
141
|
-
cache.sheet.insert(serialized.styles);
|
|
142
|
-
cache.inserted[`global-${serialized.name}`] = serialized.styles;
|
|
143
|
-
}
|
|
144
|
-
};
|
|
145
|
-
//# sourceMappingURL=css.js.map
|
package/dist/css.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"css.js","sourceRoot":"","sources":["../src/css.ts"],"names":[],"mappings":"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"}
|
package/dist/style-sheet.d.ts
DELETED
|
@@ -1,26 +0,0 @@
|
|
|
1
|
-
type StyleSheetOptions = {
|
|
2
|
-
key: string;
|
|
3
|
-
container?: unknown;
|
|
4
|
-
nonce?: string;
|
|
5
|
-
speedy?: boolean;
|
|
6
|
-
prepend?: boolean;
|
|
7
|
-
};
|
|
8
|
-
export declare class StyleSheet {
|
|
9
|
-
key: string;
|
|
10
|
-
private rules;
|
|
11
|
-
private provider;
|
|
12
|
-
private display;
|
|
13
|
-
private isRegistered;
|
|
14
|
-
private hasPendingRules;
|
|
15
|
-
private updateScheduled;
|
|
16
|
-
constructor(options: StyleSheetOptions);
|
|
17
|
-
private ensureProvider;
|
|
18
|
-
private updateProvider;
|
|
19
|
-
private scheduleUpdate;
|
|
20
|
-
insert(rule: string): void;
|
|
21
|
-
applyQueuedRules(): void;
|
|
22
|
-
flush(): void;
|
|
23
|
-
hydrate(_elements: unknown[]): void;
|
|
24
|
-
}
|
|
25
|
-
export {};
|
|
26
|
-
//# sourceMappingURL=style-sheet.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"style-sheet.d.ts","sourceRoot":"","sources":["../src/style-sheet.ts"],"names":[],"mappings":"AAIA,KAAK,iBAAiB,GAAG;IACrB,GAAG,EAAE,MAAM,CAAC;IACZ,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC;AAqBF,qBAAa,UAAU;IACnB,GAAG,EAAE,MAAM,CAAC;IACZ,OAAO,CAAC,KAAK,CAAgB;IAC7B,OAAO,CAAC,QAAQ,CAAgC;IAChD,OAAO,CAAC,OAAO,CAA4B;IAC3C,OAAO,CAAC,YAAY,CAAS;IAC7B,OAAO,CAAC,eAAe,CAAS;IAChC,OAAO,CAAC,eAAe,CAAS;gBAEpB,OAAO,EAAE,iBAAiB;IAItC,OAAO,CAAC,cAAc;IAgBtB,OAAO,CAAC,cAAc;IAOtB,OAAO,CAAC,cAAc;IAUtB,MAAM,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI;IAW1B,gBAAgB,IAAI,IAAI;IAQxB,KAAK,IAAI,IAAI;IAab,OAAO,CAAC,SAAS,EAAE,OAAO,EAAE,GAAG,IAAI;CACtC"}
|
package/dist/style-sheet.js
DELETED
|
@@ -1,85 +0,0 @@
|
|
|
1
|
-
import { events, isStarted } from "@gtkx/ffi";
|
|
2
|
-
import * as Gdk from "@gtkx/ffi/gdk";
|
|
3
|
-
import * as Gtk from "@gtkx/ffi/gtk";
|
|
4
|
-
const STYLE_PROVIDER_PRIORITY_APPLICATION = 600;
|
|
5
|
-
const pendingSheets = [];
|
|
6
|
-
const flushPendingStyles = () => {
|
|
7
|
-
for (const sheet of pendingSheets) {
|
|
8
|
-
sheet.applyQueuedRules();
|
|
9
|
-
}
|
|
10
|
-
pendingSheets.length = 0;
|
|
11
|
-
};
|
|
12
|
-
const registerStartListener = () => {
|
|
13
|
-
events.once("start", flushPendingStyles);
|
|
14
|
-
};
|
|
15
|
-
if (!isStarted()) {
|
|
16
|
-
registerStartListener();
|
|
17
|
-
}
|
|
18
|
-
export class StyleSheet {
|
|
19
|
-
key;
|
|
20
|
-
rules = [];
|
|
21
|
-
provider = null;
|
|
22
|
-
display = null;
|
|
23
|
-
isRegistered = false;
|
|
24
|
-
hasPendingRules = false;
|
|
25
|
-
updateScheduled = false;
|
|
26
|
-
constructor(options) {
|
|
27
|
-
this.key = options.key;
|
|
28
|
-
}
|
|
29
|
-
ensureProvider() {
|
|
30
|
-
if (!this.provider) {
|
|
31
|
-
this.provider = new Gtk.CssProvider();
|
|
32
|
-
this.display = Gdk.DisplayManager.get().getDefaultDisplay();
|
|
33
|
-
if (this.display) {
|
|
34
|
-
Gtk.StyleContext.addProviderForDisplay(this.display, this.provider, STYLE_PROVIDER_PRIORITY_APPLICATION);
|
|
35
|
-
this.isRegistered = true;
|
|
36
|
-
}
|
|
37
|
-
}
|
|
38
|
-
}
|
|
39
|
-
updateProvider() {
|
|
40
|
-
if (this.provider && this.rules.length > 0) {
|
|
41
|
-
const css = this.rules.join("\n");
|
|
42
|
-
this.provider.loadFromString(css);
|
|
43
|
-
}
|
|
44
|
-
}
|
|
45
|
-
scheduleUpdate() {
|
|
46
|
-
if (this.updateScheduled)
|
|
47
|
-
return;
|
|
48
|
-
this.updateScheduled = true;
|
|
49
|
-
queueMicrotask(() => {
|
|
50
|
-
this.updateScheduled = false;
|
|
51
|
-
this.ensureProvider();
|
|
52
|
-
this.updateProvider();
|
|
53
|
-
});
|
|
54
|
-
}
|
|
55
|
-
insert(rule) {
|
|
56
|
-
this.rules.push(rule);
|
|
57
|
-
if (isStarted()) {
|
|
58
|
-
this.scheduleUpdate();
|
|
59
|
-
}
|
|
60
|
-
else if (!this.hasPendingRules) {
|
|
61
|
-
this.hasPendingRules = true;
|
|
62
|
-
pendingSheets.push(this);
|
|
63
|
-
}
|
|
64
|
-
}
|
|
65
|
-
applyQueuedRules() {
|
|
66
|
-
if (this.rules.length > 0) {
|
|
67
|
-
this.ensureProvider();
|
|
68
|
-
this.updateProvider();
|
|
69
|
-
}
|
|
70
|
-
this.hasPendingRules = false;
|
|
71
|
-
}
|
|
72
|
-
flush() {
|
|
73
|
-
if (this.provider && this.display && this.isRegistered) {
|
|
74
|
-
Gtk.StyleContext.removeProviderForDisplay(this.display, this.provider);
|
|
75
|
-
this.isRegistered = false;
|
|
76
|
-
}
|
|
77
|
-
this.rules = [];
|
|
78
|
-
this.provider = null;
|
|
79
|
-
this.display = null;
|
|
80
|
-
this.hasPendingRules = false;
|
|
81
|
-
this.updateScheduled = false;
|
|
82
|
-
}
|
|
83
|
-
hydrate(_elements) { }
|
|
84
|
-
}
|
|
85
|
-
//# sourceMappingURL=style-sheet.js.map
|
package/dist/style-sheet.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"style-sheet.js","sourceRoot":"","sources":["../src/style-sheet.ts"],"names":[],"mappings":"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"}
|
package/src/cache.ts
DELETED
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
import type { EmotionCache } from "@emotion/cache";
|
|
2
|
-
import createCache from "@emotion/cache";
|
|
3
|
-
import { StyleSheet } from "./style-sheet.js";
|
|
4
|
-
|
|
5
|
-
let gtkCache: EmotionCache | null = null;
|
|
6
|
-
|
|
7
|
-
export const getGtkCache = (): EmotionCache => {
|
|
8
|
-
if (!gtkCache) {
|
|
9
|
-
const sheet = new StyleSheet({ key: "gtkx" });
|
|
10
|
-
|
|
11
|
-
gtkCache = createCache({
|
|
12
|
-
key: "gtkx",
|
|
13
|
-
container: null,
|
|
14
|
-
});
|
|
15
|
-
|
|
16
|
-
gtkCache.sheet = sheet as unknown as typeof gtkCache.sheet;
|
|
17
|
-
}
|
|
18
|
-
|
|
19
|
-
return gtkCache;
|
|
20
|
-
};
|