tailwind-styled-v4 5.1.17 → 5.1.19
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/dist/index.browser.mjs +0 -3
- package/dist/index.browser.mjs.map +1 -1
- package/dist/index.d.mts +24 -35
- package/dist/index.d.ts +24 -35
- package/dist/index.js +23 -450
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +23 -441
- package/dist/index.mjs.map +1 -1
- package/dist/runtime.d.mts +1 -1
- package/dist/runtime.d.ts +1 -1
- package/dist/runtime.js +2 -3
- package/dist/runtime.js.map +1 -1
- package/dist/runtime.mjs +1 -3
- package/dist/runtime.mjs.map +1 -1
- package/dist/theme.d.mts +23 -76
- package/dist/theme.d.ts +23 -76
- package/dist/theme.js +4 -221
- package/dist/theme.js.map +1 -1
- package/dist/theme.mjs +3 -208
- package/dist/theme.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
"use client";
|
|
2
1
|
"use strict";
|
|
3
2
|
var __create = Object.create;
|
|
4
3
|
var __defProp = Object.defineProperty;
|
|
@@ -6,9 +5,6 @@ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
|
6
5
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
7
6
|
var __getProtoOf = Object.getPrototypeOf;
|
|
8
7
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
9
|
-
var __esm = (fn, res) => function __init() {
|
|
10
|
-
return fn && (res = (0, fn[__getOwnPropNames(fn)[0]])(fn = 0)), res;
|
|
11
|
-
};
|
|
12
8
|
var __export = (target, all) => {
|
|
13
9
|
for (var name in all)
|
|
14
10
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
@@ -31,172 +27,24 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
|
|
|
31
27
|
));
|
|
32
28
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
33
29
|
|
|
34
|
-
// node_modules/tsup/assets/cjs_shims.js
|
|
35
|
-
var getImportMetaUrl, importMetaUrl;
|
|
36
|
-
var init_cjs_shims = __esm({
|
|
37
|
-
"node_modules/tsup/assets/cjs_shims.js"() {
|
|
38
|
-
"use strict";
|
|
39
|
-
getImportMetaUrl = () => typeof document === "undefined" ? new URL(`file:${__filename}`).href : document.currentScript && document.currentScript.tagName.toUpperCase() === "SCRIPT" ? document.currentScript.src : new URL("main.js", document.baseURI).href;
|
|
40
|
-
importMetaUrl = /* @__PURE__ */ getImportMetaUrl();
|
|
41
|
-
}
|
|
42
|
-
});
|
|
43
|
-
|
|
44
|
-
// packages/domain/shared/src/native-resolution.ts
|
|
45
|
-
function _safeCreateRequire() {
|
|
46
|
-
if (typeof import_meta !== "undefined" && importMetaUrl && !importMetaUrl.includes("unknown")) {
|
|
47
|
-
return (0, import_node_module.createRequire)(importMetaUrl);
|
|
48
|
-
}
|
|
49
|
-
if (typeof __filename !== "undefined") {
|
|
50
|
-
return (0, import_node_module.createRequire)(__filename);
|
|
51
|
-
}
|
|
52
|
-
return (0, import_node_module.createRequire)(new URL(`file://${process.cwd()}/`).href);
|
|
53
|
-
}
|
|
54
|
-
function platformKey() {
|
|
55
|
-
if (isBrowser) return "browser";
|
|
56
|
-
return `${process.platform}-${process.arch}`;
|
|
57
|
-
}
|
|
58
|
-
function resolveNativeBinary(runtimeDir) {
|
|
59
|
-
const platform = platformKey();
|
|
60
|
-
const tried = [];
|
|
61
|
-
if (isBrowser) {
|
|
62
|
-
return { path: null, source: "not-found", platform, tried: ["not available in browser"] };
|
|
63
|
-
}
|
|
64
|
-
if (process.env.TWS_NO_NATIVE === "1" || process.env.TWS_DISABLE_NATIVE === "1") {
|
|
65
|
-
return { path: null, source: "not-found", platform, tried: [] };
|
|
66
|
-
}
|
|
67
|
-
const envPath = process.env.TW_NATIVE_PATH?.trim();
|
|
68
|
-
if (envPath) {
|
|
69
|
-
if (fs.existsSync(envPath)) {
|
|
70
|
-
return { path: envPath, source: "env", platform, tried };
|
|
71
|
-
}
|
|
72
|
-
tried.push(`env:${envPath} (not found)`);
|
|
73
|
-
}
|
|
74
|
-
const prebuiltPkgs = PLATFORM_MAP[platform] ?? [];
|
|
75
|
-
for (const pkg of prebuiltPkgs) {
|
|
76
|
-
try {
|
|
77
|
-
const candidate = _require.resolve(`${pkg}/tailwind_styled_parser.node`);
|
|
78
|
-
if (fs.existsSync(candidate)) {
|
|
79
|
-
return { path: candidate, source: "prebuilt", platform, tried };
|
|
80
|
-
}
|
|
81
|
-
tried.push(`prebuilt:${pkg} (resolved but missing)`);
|
|
82
|
-
} catch {
|
|
83
|
-
tried.push(`prebuilt:${pkg} (not installed)`);
|
|
84
|
-
}
|
|
85
|
-
}
|
|
86
|
-
const napiPlatform = platform === "linux-x64" ? "linux-x64-gnu" : platform === "linux-arm64" ? "linux-arm64-gnu" : platform;
|
|
87
|
-
const BINARY_NAMES_SELF = ["tailwind-styled-native", "tailwind_styled_parser"];
|
|
88
|
-
if (runtimeDir) {
|
|
89
|
-
for (const depth of ["..", path.join("..", ".."), path.join("..", "..", "..")]) {
|
|
90
|
-
const pkgRoot = path.resolve(runtimeDir, depth);
|
|
91
|
-
for (const bin of BINARY_NAMES_SELF) {
|
|
92
|
-
for (const suffix of ["", `.${platform}`, `.${napiPlatform}`]) {
|
|
93
|
-
const candidate = path.resolve(pkgRoot, "native", `${bin}${suffix}.node`);
|
|
94
|
-
tried.push(`self-bundled:${candidate}`);
|
|
95
|
-
if (fs.existsSync(candidate)) {
|
|
96
|
-
return { path: candidate, source: "prebuilt", platform, tried };
|
|
97
|
-
}
|
|
98
|
-
}
|
|
99
|
-
}
|
|
100
|
-
}
|
|
101
|
-
}
|
|
102
|
-
const cwd = process.cwd();
|
|
103
|
-
const base = runtimeDir ?? cwd;
|
|
104
|
-
const BINARY_NAMES = ["tailwind-styled-native", "tailwind_styled_parser"];
|
|
105
|
-
const localCandidates = [];
|
|
106
|
-
for (const bin of BINARY_NAMES) {
|
|
107
|
-
localCandidates.push(path.resolve(base, `${bin}.node`));
|
|
108
|
-
localCandidates.push(path.resolve(base, "..", `${bin}.node`));
|
|
109
|
-
localCandidates.push(path.resolve(base, `${bin}.${platform}.node`));
|
|
110
|
-
localCandidates.push(path.resolve(base, `${bin}.${napiPlatform}.node`));
|
|
111
|
-
}
|
|
112
|
-
for (const startDir of [cwd, base]) {
|
|
113
|
-
let dir = startDir;
|
|
114
|
-
for (let i = 0; i < 6; i++) {
|
|
115
|
-
const nativeDir = path.resolve(dir, "native");
|
|
116
|
-
for (const bin of BINARY_NAMES) {
|
|
117
|
-
localCandidates.push(path.resolve(nativeDir, `${bin}.node`));
|
|
118
|
-
localCandidates.push(path.resolve(nativeDir, `${bin}.${platform}.node`));
|
|
119
|
-
localCandidates.push(path.resolve(nativeDir, `${bin}.${napiPlatform}.node`));
|
|
120
|
-
localCandidates.push(path.resolve(nativeDir, "target", "release", `${bin}.node`));
|
|
121
|
-
}
|
|
122
|
-
const parent = path.resolve(dir, "..");
|
|
123
|
-
if (parent === dir) break;
|
|
124
|
-
dir = parent;
|
|
125
|
-
}
|
|
126
|
-
}
|
|
127
|
-
for (const candidate of localCandidates) {
|
|
128
|
-
tried.push(`local:${candidate}`);
|
|
129
|
-
if (fs.existsSync(candidate)) {
|
|
130
|
-
return { path: candidate, source: "local", platform, tried };
|
|
131
|
-
}
|
|
132
|
-
}
|
|
133
|
-
return { path: null, source: "not-found", platform, tried };
|
|
134
|
-
}
|
|
135
|
-
var import_node_module, fs, path, import_meta, isBrowser, _require, PLATFORM_MAP;
|
|
136
|
-
var init_native_resolution = __esm({
|
|
137
|
-
"packages/domain/shared/src/native-resolution.ts"() {
|
|
138
|
-
"use strict";
|
|
139
|
-
init_cjs_shims();
|
|
140
|
-
import_node_module = require("module");
|
|
141
|
-
fs = __toESM(require("fs"));
|
|
142
|
-
path = __toESM(require("path"));
|
|
143
|
-
import_meta = {};
|
|
144
|
-
isBrowser = typeof window !== "undefined" || typeof document !== "undefined";
|
|
145
|
-
_require = _safeCreateRequire();
|
|
146
|
-
PLATFORM_MAP = {
|
|
147
|
-
"linux-x64": ["@tailwind-styled/native-linux-x64-gnu", "@tailwind-styled/native-linux-x64"],
|
|
148
|
-
"linux-arm64": ["@tailwind-styled/native-linux-arm64-gnu", "@tailwind-styled/native-linux-arm64"],
|
|
149
|
-
"darwin-x64": ["@tailwind-styled/native-darwin-x64"],
|
|
150
|
-
"darwin-arm64": ["@tailwind-styled/native-darwin-arm64"],
|
|
151
|
-
"win32-x64": ["@tailwind-styled/native-win32-x64-msvc", "@tailwind-styled/native-win32-x64"],
|
|
152
|
-
"win32-arm64": ["@tailwind-styled/native-win32-arm64-msvc", "@tailwind-styled/native-win32-arm64"]
|
|
153
|
-
};
|
|
154
|
-
}
|
|
155
|
-
});
|
|
156
|
-
|
|
157
|
-
// packages/domain/shared/src/index.ts
|
|
158
|
-
var import_node_crypto, import_node_fs, import_node_path, import_node_url, import_node_module2, _require2;
|
|
159
|
-
var init_src = __esm({
|
|
160
|
-
"packages/domain/shared/src/index.ts"() {
|
|
161
|
-
"use strict";
|
|
162
|
-
init_cjs_shims();
|
|
163
|
-
import_node_crypto = require("crypto");
|
|
164
|
-
import_node_fs = __toESM(require("fs"));
|
|
165
|
-
import_node_path = __toESM(require("path"));
|
|
166
|
-
import_node_url = require("url");
|
|
167
|
-
import_node_module2 = require("module");
|
|
168
|
-
init_native_resolution();
|
|
169
|
-
_require2 = (0, import_node_module2.createRequire)(
|
|
170
|
-
typeof __filename !== "undefined" ? `file://${__filename}` : importMetaUrl ?? "file://unknown"
|
|
171
|
-
);
|
|
172
|
-
}
|
|
173
|
-
});
|
|
174
|
-
|
|
175
30
|
// src/umbrella/index.ts
|
|
176
31
|
var umbrella_exports = {};
|
|
177
32
|
__export(umbrella_exports, {
|
|
178
|
-
applyTokenSet: () => applyTokenSet,
|
|
179
33
|
cn: () => cn,
|
|
180
|
-
containerRef: () => tokenRef,
|
|
181
34
|
createComponent: () => createComponent,
|
|
182
35
|
createStyledSystem: () => createStyledSystem,
|
|
183
36
|
createTheme: () => createTheme,
|
|
184
37
|
createTwMerge: () => createTwMerge,
|
|
185
|
-
createUseTokens: () => createUseTokens,
|
|
186
38
|
cssVar: () => cssVar,
|
|
187
39
|
cv: () => cv,
|
|
188
40
|
cx: () => cx,
|
|
189
41
|
cxm: () => cxm,
|
|
190
42
|
generateContainerCss: () => generateContainerCss,
|
|
191
43
|
generateStateCss: () => generateStateCss,
|
|
192
|
-
generateTokenCssString: () => generateTokenCssString,
|
|
193
44
|
getAllSubComponents: () => getAllSubComponents,
|
|
194
45
|
getContainerRegistry: () => getContainerRegistry,
|
|
195
46
|
getStateRegistry: () => getStateRegistry,
|
|
196
47
|
getSubComponent: () => getSubComponent,
|
|
197
|
-
getToken: () => getToken,
|
|
198
|
-
getTokens: () => getTokens,
|
|
199
|
-
liveToken: () => liveToken,
|
|
200
48
|
mergeWithRules: () => mergeWithRules,
|
|
201
49
|
processContainer: () => processContainer,
|
|
202
50
|
processState: () => processState,
|
|
@@ -204,13 +52,8 @@ __export(umbrella_exports, {
|
|
|
204
52
|
registerVariantTable: () => registerVariantTable,
|
|
205
53
|
resolveStyledClassName: () => resolveStyledClassName,
|
|
206
54
|
server: () => server,
|
|
207
|
-
setToken: () => setToken,
|
|
208
|
-
setTokens: () => setTokens,
|
|
209
55
|
styled: () => styled,
|
|
210
|
-
subscribeTokens: () => subscribeTokens,
|
|
211
56
|
t: () => t,
|
|
212
|
-
tokenRef: () => tokenRef,
|
|
213
|
-
tokenVar: () => tokenVar,
|
|
214
57
|
tw: () => tw,
|
|
215
58
|
twMerge: () => twMerge,
|
|
216
59
|
twVar: () => twVar,
|
|
@@ -218,63 +61,15 @@ __export(umbrella_exports, {
|
|
|
218
61
|
withSubComponents: () => withSubComponents
|
|
219
62
|
});
|
|
220
63
|
module.exports = __toCommonJS(umbrella_exports);
|
|
221
|
-
init_cjs_shims();
|
|
222
64
|
|
|
223
65
|
// packages/domain/core/src/twProxy.ts
|
|
224
|
-
init_cjs_shims();
|
|
225
66
|
var import_react2 = __toESM(require("react"), 1);
|
|
226
67
|
|
|
227
68
|
// packages/domain/core/src/createComponent.ts
|
|
228
|
-
init_cjs_shims();
|
|
229
69
|
var import_react = __toESM(require("react"), 1);
|
|
230
70
|
|
|
231
|
-
// packages/domain/core/src/
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
// packages/domain/core/src/native.ts
|
|
235
|
-
init_cjs_shims();
|
|
236
|
-
var import_node_module3 = require("module");
|
|
237
|
-
var import_node_path2 = require("path");
|
|
238
|
-
var import_node_url2 = require("url");
|
|
239
|
-
init_src();
|
|
240
|
-
var import_meta2 = {};
|
|
241
|
-
var isBrowser2 = typeof window !== "undefined" || typeof document !== "undefined";
|
|
242
|
-
var NATIVE_UNAVAILABLE_MESSAGE = "[tailwind-styled/core] Native binding is required but not available.\nPlease ensure you have run: npm run build:rust";
|
|
243
|
-
var _nodeRequire = (0, import_node_module3.createRequire)(
|
|
244
|
-
typeof __filename !== "undefined" ? `file://${__filename}` : typeof import_meta2 !== "undefined" && importMetaUrl ? importMetaUrl : "file://unknown"
|
|
245
|
-
);
|
|
246
|
-
var _loadNative = (path3) => _nodeRequire(path3);
|
|
247
|
-
var nativeBinding = null;
|
|
248
|
-
var bindingLoadAttempted = false;
|
|
249
|
-
var getBinding = () => {
|
|
250
|
-
if (isBrowser2) {
|
|
251
|
-
return null;
|
|
252
|
-
}
|
|
253
|
-
if (nativeBinding) return nativeBinding;
|
|
254
|
-
if (bindingLoadAttempted) {
|
|
255
|
-
throw new Error(NATIVE_UNAVAILABLE_MESSAGE);
|
|
256
|
-
}
|
|
257
|
-
bindingLoadAttempted = true;
|
|
258
|
-
try {
|
|
259
|
-
const runtimeDir = (0, import_node_path2.dirname)(
|
|
260
|
-
typeof __filename !== "undefined" ? __filename : typeof import_meta2 !== "undefined" && importMetaUrl ? (0, import_node_url2.fileURLToPath)(importMetaUrl) : process.cwd()
|
|
261
|
-
);
|
|
262
|
-
const result = resolveNativeBinary(runtimeDir);
|
|
263
|
-
if (result.path && result.path.endsWith(".node")) {
|
|
264
|
-
const mod = _loadNative(result.path);
|
|
265
|
-
if (mod?.batchSplitClasses) {
|
|
266
|
-
nativeBinding = mod;
|
|
267
|
-
return nativeBinding;
|
|
268
|
-
}
|
|
269
|
-
}
|
|
270
|
-
throw new Error(`${NATIVE_UNAVAILABLE_MESSAGE}
|
|
271
|
-
|
|
272
|
-
Tried: ${result.tried.join("\n")}`);
|
|
273
|
-
} catch (err) {
|
|
274
|
-
throw err instanceof Error ? err : new Error(String(err));
|
|
275
|
-
}
|
|
276
|
-
};
|
|
277
|
-
var getNativeBinding = getBinding;
|
|
71
|
+
// packages/domain/core/src/native.browser.ts
|
|
72
|
+
var getNativeBinding = () => null;
|
|
278
73
|
|
|
279
74
|
// packages/domain/core/src/containerQuery.ts
|
|
280
75
|
var CONTAINER_BREAKPOINTS = {
|
|
@@ -401,11 +196,7 @@ function getContainerRegistry() {
|
|
|
401
196
|
return containerRegistry;
|
|
402
197
|
}
|
|
403
198
|
|
|
404
|
-
// packages/domain/core/src/merge.ts
|
|
405
|
-
init_cjs_shims();
|
|
406
|
-
|
|
407
199
|
// packages/domain/core/src/mergeFallback.ts
|
|
408
|
-
init_cjs_shims();
|
|
409
200
|
var TEXT_SIZE_SUFFIXES = /* @__PURE__ */ new Set([
|
|
410
201
|
"xs",
|
|
411
202
|
"sm",
|
|
@@ -721,7 +512,6 @@ function mergeWithRules(rules, ...classLists) {
|
|
|
721
512
|
}
|
|
722
513
|
|
|
723
514
|
// packages/domain/core/src/parseTemplateFallback.ts
|
|
724
|
-
init_cjs_shims();
|
|
725
515
|
var SUB_RE = /(?:\[([a-zA-Z][a-zA-Z0-9_-]*)\]|([a-zA-Z][a-zA-Z0-9_-]*))\s*\{([^}]*)\}/g;
|
|
726
516
|
var COMMENT_RE = /\/\/[^\n]*/g;
|
|
727
517
|
function collapseSpaces(s) {
|
|
@@ -752,7 +542,6 @@ function parseTemplateJs(raw) {
|
|
|
752
542
|
}
|
|
753
543
|
|
|
754
544
|
// packages/domain/core/src/stateEngine.ts
|
|
755
|
-
init_cjs_shims();
|
|
756
545
|
var stateRegistry = /* @__PURE__ */ new Map();
|
|
757
546
|
if (typeof window !== "undefined") {
|
|
758
547
|
window.__TW_STATE_REGISTRY__ = stateRegistry;
|
|
@@ -1427,7 +1216,6 @@ var tw = Object.assign(twCallable, tagFactories, {
|
|
|
1427
1216
|
});
|
|
1428
1217
|
|
|
1429
1218
|
// packages/domain/core/src/cv.ts
|
|
1430
|
-
init_cjs_shims();
|
|
1431
1219
|
var __generatedRegistry = {};
|
|
1432
1220
|
function registerVariantTable(componentId, table) {
|
|
1433
1221
|
__generatedRegistry[componentId] = table;
|
|
@@ -1563,7 +1351,6 @@ function cv(config, componentId) {
|
|
|
1563
1351
|
}
|
|
1564
1352
|
|
|
1565
1353
|
// packages/domain/core/src/cx.ts
|
|
1566
|
-
init_cjs_shims();
|
|
1567
1354
|
function cn(...inputs) {
|
|
1568
1355
|
const strings = [];
|
|
1569
1356
|
for (const item of inputs) {
|
|
@@ -1600,7 +1387,6 @@ function cx(...inputs) {
|
|
|
1600
1387
|
var cxm = cx;
|
|
1601
1388
|
|
|
1602
1389
|
// packages/domain/core/src/styledSystem.ts
|
|
1603
|
-
init_cjs_shims();
|
|
1604
1390
|
function tokenVarName(prefix, group, name) {
|
|
1605
1391
|
return `--${prefix}-${group}-${name}`;
|
|
1606
1392
|
}
|
|
@@ -1609,8 +1395,8 @@ function tokenVarRef(prefix, group, name) {
|
|
|
1609
1395
|
}
|
|
1610
1396
|
function resolveTokenRef(tokens, prefix, value) {
|
|
1611
1397
|
if (value.startsWith("token:")) {
|
|
1612
|
-
const
|
|
1613
|
-
const [group, name] =
|
|
1398
|
+
const path = value.slice(6);
|
|
1399
|
+
const [group, name] = path.split(".");
|
|
1614
1400
|
if (group && name && tokens[group]?.[name] !== void 0) {
|
|
1615
1401
|
return tokenVarRef(prefix, group, name);
|
|
1616
1402
|
}
|
|
@@ -1725,17 +1511,17 @@ function createStyledSystem(config) {
|
|
|
1725
1511
|
return createComponent(runtimeTag, merged);
|
|
1726
1512
|
};
|
|
1727
1513
|
}
|
|
1728
|
-
function token(
|
|
1729
|
-
const [group, name] =
|
|
1730
|
-
if (!group || !name) return
|
|
1514
|
+
function token(path) {
|
|
1515
|
+
const [group, name] = path.split(".");
|
|
1516
|
+
if (!group || !name) return path;
|
|
1731
1517
|
return tokenVarRef(prefix, group, name);
|
|
1732
1518
|
}
|
|
1733
|
-
function rawToken(
|
|
1734
|
-
const [group, name] =
|
|
1519
|
+
function rawToken(path) {
|
|
1520
|
+
const [group, name] = path.split(".");
|
|
1735
1521
|
if (!group || !name) return void 0;
|
|
1736
1522
|
return tokens[group]?.[name];
|
|
1737
1523
|
}
|
|
1738
|
-
function
|
|
1524
|
+
function setTokens(updates) {
|
|
1739
1525
|
if (typeof document === "undefined") return;
|
|
1740
1526
|
const styleId = `__tw-sys-tokens-${prefix}`;
|
|
1741
1527
|
const style = document.getElementById(styleId) ?? (() => {
|
|
@@ -1759,14 +1545,13 @@ function createStyledSystem(config) {
|
|
|
1759
1545
|
return Object.assign(factories, {
|
|
1760
1546
|
token,
|
|
1761
1547
|
rawToken,
|
|
1762
|
-
setTokens
|
|
1548
|
+
setTokens,
|
|
1763
1549
|
getConfig,
|
|
1764
1550
|
tokens
|
|
1765
1551
|
});
|
|
1766
1552
|
}
|
|
1767
1553
|
|
|
1768
1554
|
// packages/domain/core/src/styled.ts
|
|
1769
|
-
init_cjs_shims();
|
|
1770
1555
|
function resolveVariantClass(options, props) {
|
|
1771
1556
|
const out = [];
|
|
1772
1557
|
const variants = options.variants ?? {};
|
|
@@ -1798,7 +1583,6 @@ function styled(options) {
|
|
|
1798
1583
|
}
|
|
1799
1584
|
|
|
1800
1585
|
// packages/domain/core/src/twTheme.ts
|
|
1801
|
-
init_cjs_shims();
|
|
1802
1586
|
function cssVar(varName, fallback) {
|
|
1803
1587
|
const name = varName.startsWith("--") ? varName : `--${varName}`;
|
|
1804
1588
|
return fallback ? `var(${name}, ${fallback})` : `var(${name})`;
|
|
@@ -1863,207 +1647,8 @@ var v4Tokens = {
|
|
|
1863
1647
|
fontMono: twVar("font", "font-mono")
|
|
1864
1648
|
};
|
|
1865
1649
|
|
|
1866
|
-
// packages/domain/core/src/liveTokenEngine.ts
|
|
1867
|
-
init_cjs_shims();
|
|
1868
|
-
|
|
1869
|
-
// packages/domain/theme/src/liveTokens.ts
|
|
1870
|
-
init_cjs_shims();
|
|
1871
|
-
|
|
1872
|
-
// packages/domain/theme/src/liveTokenEngine.ts
|
|
1873
|
-
init_cjs_shims();
|
|
1874
|
-
var import_react3 = __toESM(require("react"), 1);
|
|
1875
|
-
var TOKEN_ENGINE_KEY = "__TW_TOKEN_ENGINE__";
|
|
1876
|
-
function tokenVar(name) {
|
|
1877
|
-
const normalized = name.replace(/[^a-zA-Z0-9-]/g, "-").toLowerCase();
|
|
1878
|
-
return `--tw-token-${normalized}`;
|
|
1879
|
-
}
|
|
1880
|
-
function tokenRef(name) {
|
|
1881
|
-
return `var(${tokenVar(name)})`;
|
|
1882
|
-
}
|
|
1883
|
-
var buildRootCss = (tokens) => {
|
|
1884
|
-
const vars = Object.entries(tokens).map(([name, value]) => ` ${tokenVar(name)}: ${value};`).join("\n");
|
|
1885
|
-
return `:root {
|
|
1886
|
-
${vars}
|
|
1887
|
-
}`;
|
|
1888
|
-
};
|
|
1889
|
-
var createLiveTokenEngine = () => {
|
|
1890
|
-
const state = {
|
|
1891
|
-
currentTokens: {},
|
|
1892
|
-
styleEl: null,
|
|
1893
|
-
// Belum boleh nyentuh live DOM sampai komponen pertama selesai mount.
|
|
1894
|
-
// Ini yang nyegah hydration mismatch: tanpa flag ini, liveToken() yang
|
|
1895
|
-
// dipanggil di module top-level akan langsung document.documentElement
|
|
1896
|
-
// .style.setProperty(...) saat bundle client di-evaluasi — JAUH sebelum
|
|
1897
|
-
// React selesai hydrate — sehingga <html> versi live DOM beda dengan
|
|
1898
|
-
// <html> yang di-render server (yang gak pernah nyentuh `document`).
|
|
1899
|
-
hydrated: false
|
|
1900
|
-
};
|
|
1901
|
-
const subscribers = /* @__PURE__ */ new Set();
|
|
1902
|
-
const syncStyleEl = () => {
|
|
1903
|
-
if (!state.hydrated || typeof document === "undefined") return;
|
|
1904
|
-
if (!state.styleEl) {
|
|
1905
|
-
const styleEl = document.createElement("style");
|
|
1906
|
-
styleEl.id = "tw-live-tokens";
|
|
1907
|
-
styleEl.setAttribute("data-tw-tokens", "true");
|
|
1908
|
-
document.head.appendChild(styleEl);
|
|
1909
|
-
state.styleEl = styleEl;
|
|
1910
|
-
}
|
|
1911
|
-
state.styleEl.textContent = buildRootCss(state.currentTokens);
|
|
1912
|
-
};
|
|
1913
|
-
const notifySubscribers = () => {
|
|
1914
|
-
const snapshot = { ...state.currentTokens };
|
|
1915
|
-
for (const subscriber of subscribers) {
|
|
1916
|
-
try {
|
|
1917
|
-
subscriber(snapshot);
|
|
1918
|
-
} catch {
|
|
1919
|
-
}
|
|
1920
|
-
}
|
|
1921
|
-
};
|
|
1922
|
-
const setToken2 = (name, value) => {
|
|
1923
|
-
state.currentTokens = { ...state.currentTokens, [name]: value };
|
|
1924
|
-
if (state.hydrated && typeof document !== "undefined") {
|
|
1925
|
-
document.documentElement.style.setProperty(tokenVar(name), value);
|
|
1926
|
-
}
|
|
1927
|
-
syncStyleEl();
|
|
1928
|
-
notifySubscribers();
|
|
1929
|
-
};
|
|
1930
|
-
const setTokens2 = (tokens) => {
|
|
1931
|
-
state.currentTokens = { ...state.currentTokens, ...tokens };
|
|
1932
|
-
if (state.hydrated && typeof document !== "undefined") {
|
|
1933
|
-
const root = document.documentElement;
|
|
1934
|
-
for (const [name, value] of Object.entries(tokens)) {
|
|
1935
|
-
root.style.setProperty(tokenVar(name), value);
|
|
1936
|
-
}
|
|
1937
|
-
}
|
|
1938
|
-
syncStyleEl();
|
|
1939
|
-
notifySubscribers();
|
|
1940
|
-
};
|
|
1941
|
-
const applyTokenSet2 = (tokens) => {
|
|
1942
|
-
if (state.hydrated && typeof document !== "undefined") {
|
|
1943
|
-
const root = document.documentElement;
|
|
1944
|
-
for (const name of Object.keys(state.currentTokens)) {
|
|
1945
|
-
if (!(name in tokens)) {
|
|
1946
|
-
root.style.removeProperty(tokenVar(name));
|
|
1947
|
-
}
|
|
1948
|
-
}
|
|
1949
|
-
for (const [name, value] of Object.entries(tokens)) {
|
|
1950
|
-
root.style.setProperty(tokenVar(name), value);
|
|
1951
|
-
}
|
|
1952
|
-
}
|
|
1953
|
-
state.currentTokens = { ...tokens };
|
|
1954
|
-
syncStyleEl();
|
|
1955
|
-
notifySubscribers();
|
|
1956
|
-
};
|
|
1957
|
-
const markHydrated = () => {
|
|
1958
|
-
if (state.hydrated || typeof document === "undefined") return;
|
|
1959
|
-
state.hydrated = true;
|
|
1960
|
-
const root = document.documentElement;
|
|
1961
|
-
for (const [name, value] of Object.entries(state.currentTokens)) {
|
|
1962
|
-
root.style.setProperty(tokenVar(name), value);
|
|
1963
|
-
}
|
|
1964
|
-
syncStyleEl();
|
|
1965
|
-
};
|
|
1966
|
-
if (typeof window !== "undefined") {
|
|
1967
|
-
requestAnimationFrame(() => requestAnimationFrame(markHydrated));
|
|
1968
|
-
}
|
|
1969
|
-
return {
|
|
1970
|
-
markHydrated,
|
|
1971
|
-
liveToken(tokens) {
|
|
1972
|
-
setTokens2(tokens);
|
|
1973
|
-
const vars = {};
|
|
1974
|
-
for (const name of Object.keys(tokens)) {
|
|
1975
|
-
vars[name] = tokenRef(name);
|
|
1976
|
-
}
|
|
1977
|
-
return {
|
|
1978
|
-
vars,
|
|
1979
|
-
get(name) {
|
|
1980
|
-
return state.currentTokens[name];
|
|
1981
|
-
},
|
|
1982
|
-
set(name, value) {
|
|
1983
|
-
setToken2(name, value);
|
|
1984
|
-
},
|
|
1985
|
-
setAll(nextTokens) {
|
|
1986
|
-
setTokens2(nextTokens);
|
|
1987
|
-
},
|
|
1988
|
-
snapshot() {
|
|
1989
|
-
return { ...state.currentTokens };
|
|
1990
|
-
}
|
|
1991
|
-
};
|
|
1992
|
-
},
|
|
1993
|
-
getToken(name) {
|
|
1994
|
-
return state.currentTokens[name];
|
|
1995
|
-
},
|
|
1996
|
-
getTokens() {
|
|
1997
|
-
return { ...state.currentTokens };
|
|
1998
|
-
},
|
|
1999
|
-
setToken: setToken2,
|
|
2000
|
-
setTokens: setTokens2,
|
|
2001
|
-
applyTokenSet: applyTokenSet2,
|
|
2002
|
-
generateTokenCssString() {
|
|
2003
|
-
return buildRootCss(state.currentTokens);
|
|
2004
|
-
},
|
|
2005
|
-
subscribe(fn) {
|
|
2006
|
-
subscribers.add(fn);
|
|
2007
|
-
return () => {
|
|
2008
|
-
subscribers.delete(fn);
|
|
2009
|
-
};
|
|
2010
|
-
}
|
|
2011
|
-
};
|
|
2012
|
-
};
|
|
2013
|
-
var engine = createLiveTokenEngine();
|
|
2014
|
-
function liveToken(tokens) {
|
|
2015
|
-
return engine.liveToken(tokens);
|
|
2016
|
-
}
|
|
2017
|
-
function setToken(name, value) {
|
|
2018
|
-
engine.setToken(name, value);
|
|
2019
|
-
}
|
|
2020
|
-
function setTokens(tokens) {
|
|
2021
|
-
engine.setTokens(tokens);
|
|
2022
|
-
}
|
|
2023
|
-
function applyTokenSet(tokens) {
|
|
2024
|
-
engine.applyTokenSet(tokens);
|
|
2025
|
-
}
|
|
2026
|
-
function getToken(name) {
|
|
2027
|
-
return engine.getToken(name);
|
|
2028
|
-
}
|
|
2029
|
-
function getTokens() {
|
|
2030
|
-
return engine.getTokens();
|
|
2031
|
-
}
|
|
2032
|
-
function subscribeTokens(fn) {
|
|
2033
|
-
return engine.subscribe(fn);
|
|
2034
|
-
}
|
|
2035
|
-
function generateTokenCssString() {
|
|
2036
|
-
return engine.generateTokenCssString();
|
|
2037
|
-
}
|
|
2038
|
-
function createUseTokens() {
|
|
2039
|
-
return function useTokens() {
|
|
2040
|
-
const [tokens, setTokensState] = import_react3.default.useState({});
|
|
2041
|
-
import_react3.default.useEffect(() => {
|
|
2042
|
-
engine.markHydrated();
|
|
2043
|
-
setTokensState(engine.getTokens());
|
|
2044
|
-
return engine.subscribe((nextTokens) => setTokensState(nextTokens));
|
|
2045
|
-
}, []);
|
|
2046
|
-
return tokens;
|
|
2047
|
-
};
|
|
2048
|
-
}
|
|
2049
|
-
var liveTokenEngine = {
|
|
2050
|
-
getToken: engine.getToken,
|
|
2051
|
-
getTokens: engine.getTokens,
|
|
2052
|
-
setToken: engine.setToken,
|
|
2053
|
-
setTokens: engine.setTokens,
|
|
2054
|
-
applyTokenSet: engine.applyTokenSet,
|
|
2055
|
-
subscribeTokens: engine.subscribe,
|
|
2056
|
-
subscribe: engine.subscribe
|
|
2057
|
-
};
|
|
2058
|
-
var globalTokenEngine = globalThis;
|
|
2059
|
-
globalTokenEngine[TOKEN_ENGINE_KEY] = liveTokenEngine;
|
|
2060
|
-
if (typeof window !== "undefined") {
|
|
2061
|
-
window.__TW_TOKEN_ENGINE__ = liveTokenEngine;
|
|
2062
|
-
}
|
|
2063
|
-
|
|
2064
1650
|
// packages/domain/core/src/registry.ts
|
|
2065
|
-
|
|
2066
|
-
var import_react4 = __toESM(require("react"), 1);
|
|
1651
|
+
var import_react3 = __toESM(require("react"), 1);
|
|
2067
1652
|
var subComponentRegistry = /* @__PURE__ */ new Map();
|
|
2068
1653
|
function registerSubComponent(entry) {
|
|
2069
1654
|
subComponentRegistry.set(entry.name, entry);
|
|
@@ -2084,17 +1669,17 @@ function withSubComponents(Component, subComponentNames) {
|
|
|
2084
1669
|
}
|
|
2085
1670
|
registerSubComponent({
|
|
2086
1671
|
name: "icon",
|
|
2087
|
-
component: ({ children, className }) =>
|
|
1672
|
+
component: ({ children, className }) => import_react3.default.createElement("span", { className }, children),
|
|
2088
1673
|
defaultClasses: ""
|
|
2089
1674
|
});
|
|
2090
1675
|
registerSubComponent({
|
|
2091
1676
|
name: "text",
|
|
2092
|
-
component: ({ children, className }) =>
|
|
1677
|
+
component: ({ children, className }) => import_react3.default.createElement("span", { className }, children),
|
|
2093
1678
|
defaultClasses: ""
|
|
2094
1679
|
});
|
|
2095
1680
|
registerSubComponent({
|
|
2096
1681
|
name: "badge",
|
|
2097
|
-
component: ({ children, className }) =>
|
|
1682
|
+
component: ({ children, className }) => import_react3.default.createElement(
|
|
2098
1683
|
"span",
|
|
2099
1684
|
{
|
|
2100
1685
|
className: `ml-2 px-2 py-0.5 text-xs rounded-full bg-red-500 text-white ${className || ""}`
|
|
@@ -2105,68 +1690,61 @@ registerSubComponent({
|
|
|
2105
1690
|
});
|
|
2106
1691
|
registerSubComponent({
|
|
2107
1692
|
name: "header",
|
|
2108
|
-
component: ({ children, className }) =>
|
|
1693
|
+
component: ({ children, className }) => import_react3.default.createElement("header", { className: `font-bold text-lg ${className || ""}` }, children),
|
|
2109
1694
|
defaultClasses: "font-bold text-lg"
|
|
2110
1695
|
});
|
|
2111
1696
|
registerSubComponent({
|
|
2112
1697
|
name: "body",
|
|
2113
|
-
component: ({ children, className }) =>
|
|
1698
|
+
component: ({ children, className }) => import_react3.default.createElement("div", { className: `flex-1 ${className || ""}` }, children),
|
|
2114
1699
|
defaultClasses: "flex-1"
|
|
2115
1700
|
});
|
|
2116
1701
|
registerSubComponent({
|
|
2117
1702
|
name: "footer",
|
|
2118
|
-
component: ({ children, className }) =>
|
|
1703
|
+
component: ({ children, className }) => import_react3.default.createElement("footer", { className: `border-t pt-4 ${className || ""}` }, children),
|
|
2119
1704
|
defaultClasses: "border-t pt-4"
|
|
2120
1705
|
});
|
|
2121
1706
|
registerSubComponent({
|
|
2122
1707
|
name: "content",
|
|
2123
|
-
component: ({ children, className }) =>
|
|
1708
|
+
component: ({ children, className }) => import_react3.default.createElement("div", { className }, children),
|
|
2124
1709
|
defaultClasses: ""
|
|
2125
1710
|
});
|
|
2126
1711
|
registerSubComponent({
|
|
2127
1712
|
name: "title",
|
|
2128
|
-
component: ({ children, className }) =>
|
|
1713
|
+
component: ({ children, className }) => import_react3.default.createElement("div", { className: `font-semibold ${className || ""}` }, children),
|
|
2129
1714
|
defaultClasses: "font-semibold"
|
|
2130
1715
|
});
|
|
2131
1716
|
registerSubComponent({
|
|
2132
1717
|
name: "message",
|
|
2133
|
-
component: ({ children, className }) =>
|
|
1718
|
+
component: ({ children, className }) => import_react3.default.createElement("div", { className: `text-sm ${className || ""}` }, children),
|
|
2134
1719
|
defaultClasses: "text-sm"
|
|
2135
1720
|
});
|
|
2136
1721
|
registerSubComponent({
|
|
2137
1722
|
name: "close",
|
|
2138
|
-
component: ({ children, className }) =>
|
|
1723
|
+
component: ({ children, className }) => import_react3.default.createElement("span", { className: `cursor-pointer ${className || ""}` }, children),
|
|
2139
1724
|
defaultClasses: "cursor-pointer"
|
|
2140
1725
|
});
|
|
2141
1726
|
registerSubComponent({
|
|
2142
1727
|
name: "image",
|
|
2143
|
-
component: ({ className }) =>
|
|
1728
|
+
component: ({ className }) => import_react3.default.createElement("img", { className }),
|
|
2144
1729
|
defaultClasses: ""
|
|
2145
1730
|
});
|
|
2146
1731
|
// Annotate the CommonJS export names for ESM import in node:
|
|
2147
1732
|
0 && (module.exports = {
|
|
2148
|
-
applyTokenSet,
|
|
2149
1733
|
cn,
|
|
2150
|
-
containerRef,
|
|
2151
1734
|
createComponent,
|
|
2152
1735
|
createStyledSystem,
|
|
2153
1736
|
createTheme,
|
|
2154
1737
|
createTwMerge,
|
|
2155
|
-
createUseTokens,
|
|
2156
1738
|
cssVar,
|
|
2157
1739
|
cv,
|
|
2158
1740
|
cx,
|
|
2159
1741
|
cxm,
|
|
2160
1742
|
generateContainerCss,
|
|
2161
1743
|
generateStateCss,
|
|
2162
|
-
generateTokenCssString,
|
|
2163
1744
|
getAllSubComponents,
|
|
2164
1745
|
getContainerRegistry,
|
|
2165
1746
|
getStateRegistry,
|
|
2166
1747
|
getSubComponent,
|
|
2167
|
-
getToken,
|
|
2168
|
-
getTokens,
|
|
2169
|
-
liveToken,
|
|
2170
1748
|
mergeWithRules,
|
|
2171
1749
|
processContainer,
|
|
2172
1750
|
processState,
|
|
@@ -2174,13 +1752,8 @@ registerSubComponent({
|
|
|
2174
1752
|
registerVariantTable,
|
|
2175
1753
|
resolveStyledClassName,
|
|
2176
1754
|
server,
|
|
2177
|
-
setToken,
|
|
2178
|
-
setTokens,
|
|
2179
1755
|
styled,
|
|
2180
|
-
subscribeTokens,
|
|
2181
1756
|
t,
|
|
2182
|
-
tokenRef,
|
|
2183
|
-
tokenVar,
|
|
2184
1757
|
tw,
|
|
2185
1758
|
twMerge,
|
|
2186
1759
|
twVar,
|