tailwind-styled-v4 5.1.18 → 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.d.mts +24 -35
- package/dist/index.d.ts +24 -35
- package/dist/index.js +23 -447
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +23 -438
- 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 -0
- package/dist/runtime.js.map +1 -1
- package/dist/runtime.mjs +1 -0
- 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 -218
- package/dist/theme.js.map +1 -1
- package/dist/theme.mjs +3 -205
- 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,204 +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
|
-
return {
|
|
1967
|
-
markHydrated,
|
|
1968
|
-
liveToken(tokens) {
|
|
1969
|
-
setTokens2(tokens);
|
|
1970
|
-
const vars = {};
|
|
1971
|
-
for (const name of Object.keys(tokens)) {
|
|
1972
|
-
vars[name] = tokenRef(name);
|
|
1973
|
-
}
|
|
1974
|
-
return {
|
|
1975
|
-
vars,
|
|
1976
|
-
get(name) {
|
|
1977
|
-
return state.currentTokens[name];
|
|
1978
|
-
},
|
|
1979
|
-
set(name, value) {
|
|
1980
|
-
setToken2(name, value);
|
|
1981
|
-
},
|
|
1982
|
-
setAll(nextTokens) {
|
|
1983
|
-
setTokens2(nextTokens);
|
|
1984
|
-
},
|
|
1985
|
-
snapshot() {
|
|
1986
|
-
return { ...state.currentTokens };
|
|
1987
|
-
}
|
|
1988
|
-
};
|
|
1989
|
-
},
|
|
1990
|
-
getToken(name) {
|
|
1991
|
-
return state.currentTokens[name];
|
|
1992
|
-
},
|
|
1993
|
-
getTokens() {
|
|
1994
|
-
return { ...state.currentTokens };
|
|
1995
|
-
},
|
|
1996
|
-
setToken: setToken2,
|
|
1997
|
-
setTokens: setTokens2,
|
|
1998
|
-
applyTokenSet: applyTokenSet2,
|
|
1999
|
-
generateTokenCssString() {
|
|
2000
|
-
return buildRootCss(state.currentTokens);
|
|
2001
|
-
},
|
|
2002
|
-
subscribe(fn) {
|
|
2003
|
-
subscribers.add(fn);
|
|
2004
|
-
return () => {
|
|
2005
|
-
subscribers.delete(fn);
|
|
2006
|
-
};
|
|
2007
|
-
}
|
|
2008
|
-
};
|
|
2009
|
-
};
|
|
2010
|
-
var engine = createLiveTokenEngine();
|
|
2011
|
-
function liveToken(tokens) {
|
|
2012
|
-
return engine.liveToken(tokens);
|
|
2013
|
-
}
|
|
2014
|
-
function setToken(name, value) {
|
|
2015
|
-
engine.setToken(name, value);
|
|
2016
|
-
}
|
|
2017
|
-
function setTokens(tokens) {
|
|
2018
|
-
engine.setTokens(tokens);
|
|
2019
|
-
}
|
|
2020
|
-
function applyTokenSet(tokens) {
|
|
2021
|
-
engine.applyTokenSet(tokens);
|
|
2022
|
-
}
|
|
2023
|
-
function getToken(name) {
|
|
2024
|
-
return engine.getToken(name);
|
|
2025
|
-
}
|
|
2026
|
-
function getTokens() {
|
|
2027
|
-
return engine.getTokens();
|
|
2028
|
-
}
|
|
2029
|
-
function subscribeTokens(fn) {
|
|
2030
|
-
return engine.subscribe(fn);
|
|
2031
|
-
}
|
|
2032
|
-
function generateTokenCssString() {
|
|
2033
|
-
return engine.generateTokenCssString();
|
|
2034
|
-
}
|
|
2035
|
-
function createUseTokens() {
|
|
2036
|
-
return function useTokens() {
|
|
2037
|
-
const [tokens, setTokensState] = import_react3.default.useState({});
|
|
2038
|
-
import_react3.default.useEffect(() => {
|
|
2039
|
-
engine.markHydrated();
|
|
2040
|
-
setTokensState(engine.getTokens());
|
|
2041
|
-
return engine.subscribe((nextTokens) => setTokensState(nextTokens));
|
|
2042
|
-
}, []);
|
|
2043
|
-
return tokens;
|
|
2044
|
-
};
|
|
2045
|
-
}
|
|
2046
|
-
var liveTokenEngine = {
|
|
2047
|
-
getToken: engine.getToken,
|
|
2048
|
-
getTokens: engine.getTokens,
|
|
2049
|
-
setToken: engine.setToken,
|
|
2050
|
-
setTokens: engine.setTokens,
|
|
2051
|
-
applyTokenSet: engine.applyTokenSet,
|
|
2052
|
-
subscribeTokens: engine.subscribe,
|
|
2053
|
-
subscribe: engine.subscribe
|
|
2054
|
-
};
|
|
2055
|
-
var globalTokenEngine = globalThis;
|
|
2056
|
-
globalTokenEngine[TOKEN_ENGINE_KEY] = liveTokenEngine;
|
|
2057
|
-
if (typeof window !== "undefined") {
|
|
2058
|
-
window.__TW_TOKEN_ENGINE__ = liveTokenEngine;
|
|
2059
|
-
}
|
|
2060
|
-
|
|
2061
1650
|
// packages/domain/core/src/registry.ts
|
|
2062
|
-
|
|
2063
|
-
var import_react4 = __toESM(require("react"), 1);
|
|
1651
|
+
var import_react3 = __toESM(require("react"), 1);
|
|
2064
1652
|
var subComponentRegistry = /* @__PURE__ */ new Map();
|
|
2065
1653
|
function registerSubComponent(entry) {
|
|
2066
1654
|
subComponentRegistry.set(entry.name, entry);
|
|
@@ -2081,17 +1669,17 @@ function withSubComponents(Component, subComponentNames) {
|
|
|
2081
1669
|
}
|
|
2082
1670
|
registerSubComponent({
|
|
2083
1671
|
name: "icon",
|
|
2084
|
-
component: ({ children, className }) =>
|
|
1672
|
+
component: ({ children, className }) => import_react3.default.createElement("span", { className }, children),
|
|
2085
1673
|
defaultClasses: ""
|
|
2086
1674
|
});
|
|
2087
1675
|
registerSubComponent({
|
|
2088
1676
|
name: "text",
|
|
2089
|
-
component: ({ children, className }) =>
|
|
1677
|
+
component: ({ children, className }) => import_react3.default.createElement("span", { className }, children),
|
|
2090
1678
|
defaultClasses: ""
|
|
2091
1679
|
});
|
|
2092
1680
|
registerSubComponent({
|
|
2093
1681
|
name: "badge",
|
|
2094
|
-
component: ({ children, className }) =>
|
|
1682
|
+
component: ({ children, className }) => import_react3.default.createElement(
|
|
2095
1683
|
"span",
|
|
2096
1684
|
{
|
|
2097
1685
|
className: `ml-2 px-2 py-0.5 text-xs rounded-full bg-red-500 text-white ${className || ""}`
|
|
@@ -2102,68 +1690,61 @@ registerSubComponent({
|
|
|
2102
1690
|
});
|
|
2103
1691
|
registerSubComponent({
|
|
2104
1692
|
name: "header",
|
|
2105
|
-
component: ({ children, className }) =>
|
|
1693
|
+
component: ({ children, className }) => import_react3.default.createElement("header", { className: `font-bold text-lg ${className || ""}` }, children),
|
|
2106
1694
|
defaultClasses: "font-bold text-lg"
|
|
2107
1695
|
});
|
|
2108
1696
|
registerSubComponent({
|
|
2109
1697
|
name: "body",
|
|
2110
|
-
component: ({ children, className }) =>
|
|
1698
|
+
component: ({ children, className }) => import_react3.default.createElement("div", { className: `flex-1 ${className || ""}` }, children),
|
|
2111
1699
|
defaultClasses: "flex-1"
|
|
2112
1700
|
});
|
|
2113
1701
|
registerSubComponent({
|
|
2114
1702
|
name: "footer",
|
|
2115
|
-
component: ({ children, className }) =>
|
|
1703
|
+
component: ({ children, className }) => import_react3.default.createElement("footer", { className: `border-t pt-4 ${className || ""}` }, children),
|
|
2116
1704
|
defaultClasses: "border-t pt-4"
|
|
2117
1705
|
});
|
|
2118
1706
|
registerSubComponent({
|
|
2119
1707
|
name: "content",
|
|
2120
|
-
component: ({ children, className }) =>
|
|
1708
|
+
component: ({ children, className }) => import_react3.default.createElement("div", { className }, children),
|
|
2121
1709
|
defaultClasses: ""
|
|
2122
1710
|
});
|
|
2123
1711
|
registerSubComponent({
|
|
2124
1712
|
name: "title",
|
|
2125
|
-
component: ({ children, className }) =>
|
|
1713
|
+
component: ({ children, className }) => import_react3.default.createElement("div", { className: `font-semibold ${className || ""}` }, children),
|
|
2126
1714
|
defaultClasses: "font-semibold"
|
|
2127
1715
|
});
|
|
2128
1716
|
registerSubComponent({
|
|
2129
1717
|
name: "message",
|
|
2130
|
-
component: ({ children, className }) =>
|
|
1718
|
+
component: ({ children, className }) => import_react3.default.createElement("div", { className: `text-sm ${className || ""}` }, children),
|
|
2131
1719
|
defaultClasses: "text-sm"
|
|
2132
1720
|
});
|
|
2133
1721
|
registerSubComponent({
|
|
2134
1722
|
name: "close",
|
|
2135
|
-
component: ({ children, className }) =>
|
|
1723
|
+
component: ({ children, className }) => import_react3.default.createElement("span", { className: `cursor-pointer ${className || ""}` }, children),
|
|
2136
1724
|
defaultClasses: "cursor-pointer"
|
|
2137
1725
|
});
|
|
2138
1726
|
registerSubComponent({
|
|
2139
1727
|
name: "image",
|
|
2140
|
-
component: ({ className }) =>
|
|
1728
|
+
component: ({ className }) => import_react3.default.createElement("img", { className }),
|
|
2141
1729
|
defaultClasses: ""
|
|
2142
1730
|
});
|
|
2143
1731
|
// Annotate the CommonJS export names for ESM import in node:
|
|
2144
1732
|
0 && (module.exports = {
|
|
2145
|
-
applyTokenSet,
|
|
2146
1733
|
cn,
|
|
2147
|
-
containerRef,
|
|
2148
1734
|
createComponent,
|
|
2149
1735
|
createStyledSystem,
|
|
2150
1736
|
createTheme,
|
|
2151
1737
|
createTwMerge,
|
|
2152
|
-
createUseTokens,
|
|
2153
1738
|
cssVar,
|
|
2154
1739
|
cv,
|
|
2155
1740
|
cx,
|
|
2156
1741
|
cxm,
|
|
2157
1742
|
generateContainerCss,
|
|
2158
1743
|
generateStateCss,
|
|
2159
|
-
generateTokenCssString,
|
|
2160
1744
|
getAllSubComponents,
|
|
2161
1745
|
getContainerRegistry,
|
|
2162
1746
|
getStateRegistry,
|
|
2163
1747
|
getSubComponent,
|
|
2164
|
-
getToken,
|
|
2165
|
-
getTokens,
|
|
2166
|
-
liveToken,
|
|
2167
1748
|
mergeWithRules,
|
|
2168
1749
|
processContainer,
|
|
2169
1750
|
processState,
|
|
@@ -2171,13 +1752,8 @@ registerSubComponent({
|
|
|
2171
1752
|
registerVariantTable,
|
|
2172
1753
|
resolveStyledClassName,
|
|
2173
1754
|
server,
|
|
2174
|
-
setToken,
|
|
2175
|
-
setTokens,
|
|
2176
1755
|
styled,
|
|
2177
|
-
subscribeTokens,
|
|
2178
1756
|
t,
|
|
2179
|
-
tokenRef,
|
|
2180
|
-
tokenVar,
|
|
2181
1757
|
tw,
|
|
2182
1758
|
twMerge,
|
|
2183
1759
|
twVar,
|