@pandacss/generator 0.5.0 → 0.6.0
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 +78 -75
- package/dist/index.d.ts +78 -75
- package/dist/index.js +323 -302
- package/dist/index.mjs +324 -303
- package/package.json +8 -8
package/dist/index.js
CHANGED
|
@@ -73,7 +73,7 @@ var artifactsGenerated = (ctx) => {
|
|
|
73
73
|
${tick} ${(0, import_logger.quote)(outdir, "/recipes")}: functions to create multi-variant styles
|
|
74
74
|
`,
|
|
75
75
|
jsx.framework && import_outdent.outdent`
|
|
76
|
-
${tick} ${(0, import_logger.quote)(outdir, "/jsx")}:
|
|
76
|
+
${tick} ${(0, import_logger.quote)(outdir, "/jsx")}: styled jsx elements for ${jsx.framework}
|
|
77
77
|
`,
|
|
78
78
|
"\n"
|
|
79
79
|
].filter(Boolean).join("\n");
|
|
@@ -128,12 +128,9 @@ var getMessages = (ctx) => ({
|
|
|
128
128
|
configWatch
|
|
129
129
|
});
|
|
130
130
|
|
|
131
|
-
// src/generator.ts
|
|
132
|
-
var import_lil_fp3 = require("lil-fp");
|
|
133
|
-
|
|
134
131
|
// src/artifacts/index.ts
|
|
135
132
|
var import_shared4 = require("@pandacss/shared");
|
|
136
|
-
var
|
|
133
|
+
var import_outdent42 = __toESM(require("outdent"));
|
|
137
134
|
|
|
138
135
|
// src/artifacts/css/global-css.ts
|
|
139
136
|
var generateGlobalCss = (ctx) => {
|
|
@@ -209,199 +206,197 @@ function generateKeyframeCss(ctx) {
|
|
|
209
206
|
var css = String.raw;
|
|
210
207
|
function generateResetCss(ctx, scope = "") {
|
|
211
208
|
const selector = scope ? `${scope} ` : "";
|
|
212
|
-
const output = css
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
}
|
|
209
|
+
const output = css`@layer reset {
|
|
210
|
+
${selector}* {
|
|
211
|
+
margin: 0;
|
|
212
|
+
padding: 0;
|
|
213
|
+
font: inherit;
|
|
214
|
+
}
|
|
219
215
|
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
216
|
+
${selector}*,
|
|
217
|
+
${selector}*::before,
|
|
218
|
+
${selector}*::after {
|
|
219
|
+
box-sizing: border-box;
|
|
220
|
+
border-width: 0;
|
|
221
|
+
border-style: solid;
|
|
222
|
+
border-color: var(--global-color-border, currentColor);
|
|
223
|
+
}
|
|
228
224
|
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
225
|
+
${scope || "html"} {
|
|
226
|
+
line-height: 1.5;
|
|
227
|
+
--font-fallback: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
|
|
228
|
+
'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',
|
|
229
|
+
'Noto Color Emoji';
|
|
230
|
+
-webkit-text-size-adjust: 100%;
|
|
231
|
+
-webkit-text-size-adjust: 100%;
|
|
232
|
+
-webkit-font-smoothing: antialiased;
|
|
233
|
+
-moz-tab-size: 4;
|
|
234
|
+
tab-size: 4;
|
|
235
|
+
font-family: var(--global-font-body, var(--font-fallback));
|
|
236
|
+
}
|
|
241
237
|
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
238
|
+
${selector}hr {
|
|
239
|
+
height: 0;
|
|
240
|
+
color: inherit;
|
|
241
|
+
border-top-width: 1px;
|
|
242
|
+
}
|
|
247
243
|
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
244
|
+
body {
|
|
245
|
+
height: 100%;
|
|
246
|
+
line-height: inherit;
|
|
247
|
+
}
|
|
252
248
|
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
249
|
+
${selector}img {
|
|
250
|
+
border-style: none;
|
|
251
|
+
}
|
|
256
252
|
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
253
|
+
${selector}img,
|
|
254
|
+
${selector}svg,
|
|
255
|
+
${selector}video,
|
|
256
|
+
${selector}canvas,
|
|
257
|
+
${selector}audio,
|
|
258
|
+
${selector}iframe,
|
|
259
|
+
${selector}embed,
|
|
260
|
+
${selector}object {
|
|
261
|
+
display: block;
|
|
262
|
+
vertical-align: middle;
|
|
263
|
+
}
|
|
268
264
|
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
265
|
+
${selector}img,
|
|
266
|
+
${selector}video {
|
|
267
|
+
max-width: 100%;
|
|
268
|
+
height: auto;
|
|
269
|
+
}
|
|
274
270
|
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
271
|
+
${selector}p,
|
|
272
|
+
${selector}h1,
|
|
273
|
+
${selector}h2,
|
|
274
|
+
${selector}h3,
|
|
275
|
+
${selector}h4,
|
|
276
|
+
${selector}h5,
|
|
277
|
+
${selector}h6 {
|
|
278
|
+
overflow-wrap: break-word;
|
|
279
|
+
}
|
|
284
280
|
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
281
|
+
${selector}ol,
|
|
282
|
+
${selector}ul {
|
|
283
|
+
list-style: none;
|
|
284
|
+
}
|
|
289
285
|
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
286
|
+
${selector}code,
|
|
287
|
+
${selector}kbd,
|
|
288
|
+
${selector}pre,
|
|
289
|
+
${selector}samp {
|
|
290
|
+
font-size: 1em;
|
|
291
|
+
}
|
|
296
292
|
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
293
|
+
${selector}button,
|
|
294
|
+
${selector}[type='button'],
|
|
295
|
+
${selector}[type='reset'],
|
|
296
|
+
${selector}[type='submit'] {
|
|
297
|
+
-webkit-appearance: button;
|
|
298
|
+
background-color: transparent;
|
|
299
|
+
background-image: none;
|
|
300
|
+
}
|
|
305
301
|
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
302
|
+
${selector}button,
|
|
303
|
+
${selector}select {
|
|
304
|
+
text-transform: none;
|
|
305
|
+
}
|
|
310
306
|
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
307
|
+
${selector}table {
|
|
308
|
+
text-indent: 0;
|
|
309
|
+
border-color: inherit;
|
|
310
|
+
border-collapse: collapse;
|
|
311
|
+
}
|
|
316
312
|
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
313
|
+
${selector}input::placeholder,
|
|
314
|
+
${selector}textarea::placeholder {
|
|
315
|
+
opacity: 1;
|
|
316
|
+
color: var(--global-color-placeholder, #9ca3af);
|
|
317
|
+
}
|
|
322
318
|
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
319
|
+
${selector}textarea {
|
|
320
|
+
resize: vertical;
|
|
321
|
+
}
|
|
326
322
|
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
323
|
+
${selector}summary {
|
|
324
|
+
display: list-item;
|
|
325
|
+
}
|
|
330
326
|
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
327
|
+
${selector}small {
|
|
328
|
+
font-size: 80%;
|
|
329
|
+
}
|
|
334
330
|
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
|
|
331
|
+
${selector}sub,
|
|
332
|
+
${selector}sup {
|
|
333
|
+
font-size: 75%;
|
|
334
|
+
line-height: 0;
|
|
335
|
+
position: relative;
|
|
336
|
+
vertical-align: baseline;
|
|
337
|
+
}
|
|
342
338
|
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
|
|
339
|
+
${selector}sub {
|
|
340
|
+
bottom: -0.25em;
|
|
341
|
+
}
|
|
346
342
|
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
|
|
343
|
+
${selector}sup {
|
|
344
|
+
top: -0.5em;
|
|
345
|
+
}
|
|
350
346
|
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
|
|
347
|
+
${selector}dialog {
|
|
348
|
+
padding: 0;
|
|
349
|
+
}
|
|
354
350
|
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
|
|
351
|
+
${selector}a {
|
|
352
|
+
color: inherit;
|
|
353
|
+
text-decoration: inherit;
|
|
354
|
+
}
|
|
359
355
|
|
|
360
|
-
|
|
361
|
-
|
|
362
|
-
|
|
356
|
+
${selector}abbr:where([title]) {
|
|
357
|
+
text-decoration: underline dotted;
|
|
358
|
+
}
|
|
363
359
|
|
|
364
|
-
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
360
|
+
${selector}b,
|
|
361
|
+
${selector}strong {
|
|
362
|
+
font-weight: bolder;
|
|
363
|
+
}
|
|
368
364
|
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
365
|
+
${selector}code,
|
|
366
|
+
${selector}kbd,
|
|
367
|
+
${selector}samp,
|
|
368
|
+
${selector}pre {
|
|
369
|
+
font-size: 1em;
|
|
370
|
+
--font-mono-fallback: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New';
|
|
371
|
+
font-family: var(--global-font-mono, var(--font-fallback));
|
|
372
|
+
}
|
|
377
373
|
|
|
378
|
-
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
|
|
374
|
+
${selector}[type='search'] {
|
|
375
|
+
-webkit-appearance: textfield;
|
|
376
|
+
outline-offset: -2px;
|
|
377
|
+
}
|
|
382
378
|
|
|
383
|
-
|
|
384
|
-
|
|
385
|
-
|
|
379
|
+
${selector}::-webkit-search-decoration {
|
|
380
|
+
-webkit-appearance: none;
|
|
381
|
+
}
|
|
386
382
|
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
|
|
383
|
+
${selector}::-webkit-file-upload-button {
|
|
384
|
+
-webkit-appearance: button;
|
|
385
|
+
}
|
|
390
386
|
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
387
|
+
${selector}::-webkit-inner-spin-button,
|
|
388
|
+
${selector}::-webkit-outer-spin-button {
|
|
389
|
+
height: auto;
|
|
390
|
+
}
|
|
395
391
|
|
|
396
|
-
|
|
397
|
-
|
|
398
|
-
|
|
392
|
+
${selector}:-moz-ui-invalid {
|
|
393
|
+
box-shadow: none;
|
|
394
|
+
}
|
|
399
395
|
|
|
400
|
-
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
|
|
404
|
-
`;
|
|
396
|
+
${selector}:-moz-focusring {
|
|
397
|
+
outline: auto;
|
|
398
|
+
}
|
|
399
|
+
}`;
|
|
405
400
|
ctx.hooks.callHook("generator:css", "reset.css", output);
|
|
406
401
|
return output;
|
|
407
402
|
}
|
|
@@ -415,7 +410,15 @@ var generateStaticCss = (ctx) => {
|
|
|
415
410
|
const fn = (0, import_core2.getStaticCss)(staticCss);
|
|
416
411
|
const results = fn({
|
|
417
412
|
breakpoints: Object.keys(theme.breakpoints ?? {}),
|
|
418
|
-
getPropertyKeys:
|
|
413
|
+
getPropertyKeys: (prop) => {
|
|
414
|
+
const propConfig = utility.config[prop];
|
|
415
|
+
if (!propConfig)
|
|
416
|
+
return [];
|
|
417
|
+
const values = utility.getPropertyValues(propConfig);
|
|
418
|
+
if (!values)
|
|
419
|
+
return [];
|
|
420
|
+
return Object.keys(values);
|
|
421
|
+
},
|
|
419
422
|
getRecipeKeys: (recipe) => recipes.details.find((detail) => detail.config.name === recipe)?.variantKeyMap ?? {}
|
|
420
423
|
});
|
|
421
424
|
results.css.forEach((css2) => {
|
|
@@ -750,7 +753,7 @@ function generateCvaFn(ctx) {
|
|
|
750
753
|
|
|
751
754
|
return Object.assign(cvaFn, {
|
|
752
755
|
__cva__: true,
|
|
753
|
-
|
|
756
|
+
variantMap,
|
|
754
757
|
variantKeys,
|
|
755
758
|
resolve,
|
|
756
759
|
config,
|
|
@@ -829,7 +832,7 @@ var import_outdent8 = require("outdent");
|
|
|
829
832
|
|
|
830
833
|
// src/artifacts/generated/helpers.mjs.json
|
|
831
834
|
var helpers_mjs_default = {
|
|
832
|
-
content: '// src/assert.ts\nfunction isObject(value) {\n return typeof value === "object" && value != null && !Array.isArray(value);\n}\n\n// src/astish.ts\nvar newRule = /(?:([\\u0080-\\uFFFF\\w-%@]+) *:? *([^{;]+?);|([^;}{]*?) *{)|(}\\s*)/g;\nvar ruleClean = /\\/\\*[^]*?\\*\\/|\\s\\s+|\\n/g;\nvar astish = (val, tree = [{}]) => {\n const block = newRule.exec(val.replace(ruleClean, ""));\n if (!block)\n return tree[0];\n if (block[4])\n tree.shift();\n else if (block[3])\n tree.unshift(tree[0][block[3]] = tree[0][block[3]] || {});\n else\n tree[0][block[1]] = block[2];\n return astish(val, tree);\n};\n\n// src/compact.ts\nfunction compact(value) {\n return Object.fromEntries(Object.entries(value ?? {}).filter(([_, value2]) => value2 !== void 0));\n}\n\n// src/condition.ts\nvar isBaseCondition = (v) => v === "base";\nfunction filterBaseConditions(c) {\n return c.slice().filter((v) => !isBaseCondition(v));\n}\n\n// src/css-important.ts\nvar importantRegex = /!(important)?$/;\nfunction isImportant(value) {\n return typeof value === "string" ? importantRegex.test(value) : false;\n}\nfunction withoutImportant(value) {\n return typeof value === "string" ? value.replace(importantRegex, "").trim() : value;\n}\nfunction withoutSpace(str) {\n return typeof str === "string" ? str.replaceAll(" ", "_") : str;\n}\n\n// src/hash.ts\nfunction toChar(code) {\n return String.fromCharCode(code + (code > 25 ? 39 : 97));\n}\nfunction toName(code) {\n let name = "";\n let x;\n for (x = Math.abs(code); x > 52; x = x / 52 | 0)\n name = toChar(x % 52) + name;\n return toChar(x % 52) + name;\n}\nfunction toPhash(h, x) {\n let i = x.length;\n while (i)\n h = h * 33 ^ x.charCodeAt(--i);\n return h;\n}\nfunction toHash(value) {\n return toName(toPhash(5381, value) >>> 0);\n}\n\n// src/merge-props.ts\nfunction mergeProps(...sources) {\n const result = {};\n for (const source of sources) {\n for (const [key, value] of Object.entries(source)) {\n if (isObject(value)) {\n result[key] = mergeProps(result[key] || {}, value);\n } else {\n result[key] = value;\n }\n }\n }\n return result;\n}\n\n// src/walk-object.ts\nfunction walkObject(target, predicate, options = {}) {\n const { stop, getKey } = options;\n function inner(value, path = []) {\n if (isObject(value) || Array.isArray(value)) {\n const result = {};\n for (const [prop, child] of Object.entries(value)) {\n const key = getKey?.(prop) ?? prop;\n const childPath = [...path, key];\n if (stop?.(value, childPath)) {\n return predicate(value, path);\n }\n
|
|
835
|
+
content: '// src/assert.ts\nfunction isObject(value) {\n return typeof value === "object" && value != null && !Array.isArray(value);\n}\n\n// src/astish.ts\nvar newRule = /(?:([\\u0080-\\uFFFF\\w-%@]+) *:? *([^{;]+?);|([^;}{]*?) *{)|(}\\s*)/g;\nvar ruleClean = /\\/\\*[^]*?\\*\\/|\\s\\s+|\\n/g;\nvar astish = (val, tree = [{}]) => {\n const block = newRule.exec((val ?? "").replace(ruleClean, ""));\n if (!block)\n return tree[0];\n if (block[4])\n tree.shift();\n else if (block[3])\n tree.unshift(tree[0][block[3]] = tree[0][block[3]] || {});\n else\n tree[0][block[1]] = block[2];\n return astish(val, tree);\n};\n\n// src/compact.ts\nfunction compact(value) {\n return Object.fromEntries(Object.entries(value ?? {}).filter(([_, value2]) => value2 !== void 0));\n}\n\n// src/condition.ts\nvar isBaseCondition = (v) => v === "base";\nfunction filterBaseConditions(c) {\n return c.slice().filter((v) => !isBaseCondition(v));\n}\n\n// src/css-important.ts\nvar importantRegex = /!(important)?$/;\nfunction isImportant(value) {\n return typeof value === "string" ? importantRegex.test(value) : false;\n}\nfunction withoutImportant(value) {\n return typeof value === "string" ? value.replace(importantRegex, "").trim() : value;\n}\nfunction withoutSpace(str) {\n return typeof str === "string" ? str.replaceAll(" ", "_") : str;\n}\n\n// src/hash.ts\nfunction toChar(code) {\n return String.fromCharCode(code + (code > 25 ? 39 : 97));\n}\nfunction toName(code) {\n let name = "";\n let x;\n for (x = Math.abs(code); x > 52; x = x / 52 | 0)\n name = toChar(x % 52) + name;\n return toChar(x % 52) + name;\n}\nfunction toPhash(h, x) {\n let i = x.length;\n while (i)\n h = h * 33 ^ x.charCodeAt(--i);\n return h;\n}\nfunction toHash(value) {\n return toName(toPhash(5381, value) >>> 0);\n}\n\n// src/merge-props.ts\nfunction mergeProps(...sources) {\n const result = {};\n for (const source of sources) {\n for (const [key, value] of Object.entries(source)) {\n if (isObject(value)) {\n result[key] = mergeProps(result[key] || {}, value);\n } else {\n result[key] = value;\n }\n }\n }\n return result;\n}\n\n// src/walk-object.ts\nvar isNotNullish = (element) => element != null;\nfunction walkObject(target, predicate, options = {}) {\n const { stop, getKey } = options;\n function inner(value, path = []) {\n if (isObject(value) || Array.isArray(value)) {\n const result = {};\n for (const [prop, child] of Object.entries(value)) {\n const key = getKey?.(prop) ?? prop;\n const childPath = [...path, key];\n if (stop?.(value, childPath)) {\n return predicate(value, path);\n }\n const next = inner(child, childPath);\n if (isNotNullish(next)) {\n result[key] = next;\n }\n }\n return result;\n }\n return predicate(value, path);\n }\n return inner(target);\n}\nfunction mapObject(obj, fn) {\n if (!isObject(obj))\n return fn(obj);\n return walkObject(obj, (value) => fn(value));\n}\n\n// src/normalize-style-object.ts\nfunction toResponsiveObject(values, breakpoints) {\n return values.reduce((acc, current, index) => {\n const key = breakpoints[index];\n if (current != null) {\n acc[key] = current;\n }\n return acc;\n }, {});\n}\nfunction normalizeShorthand(styles, context) {\n const { hasShorthand, resolveShorthand } = context.utility;\n return walkObject(styles, (v) => v, {\n getKey: (prop) => {\n return hasShorthand ? resolveShorthand(prop) : prop;\n }\n });\n}\nfunction normalizeStyleObject(styles, context) {\n const { utility, conditions } = context;\n const { hasShorthand, resolveShorthand } = utility;\n return walkObject(\n styles,\n (value) => {\n return Array.isArray(value) ? toResponsiveObject(value, conditions.breakpoints.keys) : value;\n },\n {\n stop: (value) => Array.isArray(value),\n getKey: (prop) => {\n return hasShorthand ? resolveShorthand(prop) : prop;\n }\n }\n );\n}\n\n// src/classname.ts\nvar fallbackCondition = {\n shift: (v) => v,\n finalize: (v) => v,\n breakpoints: { keys: [] }\n};\nvar sanitize = (value) => typeof value === "string" ? value.replaceAll(/[\\n\\s]+/g, " ") : value;\nfunction createCss(context) {\n const { utility, hash, conditions: conds = fallbackCondition } = context;\n const formatClassName = (str) => [utility.prefix, str].filter(Boolean).join("-");\n const hashFn = (conditions, className) => {\n let result;\n if (hash) {\n const baseArray = [...conds.finalize(conditions), className];\n result = formatClassName(toHash(baseArray.join(":")));\n } else {\n const baseArray = [...conds.finalize(conditions), formatClassName(className)];\n result = baseArray.join(":");\n }\n return result;\n };\n return (styleObject = {}) => {\n const normalizedObject = normalizeStyleObject(styleObject, context);\n const classNames = /* @__PURE__ */ new Set();\n walkObject(normalizedObject, (value, paths) => {\n const important = isImportant(value);\n if (value == null)\n return;\n const [prop, ...allConditions] = conds.shift(paths);\n const conditions = filterBaseConditions(allConditions);\n const transformed = utility.transform(prop, withoutImportant(sanitize(value)));\n let className = hashFn(conditions, transformed.className);\n if (important)\n className = `${className}!`;\n classNames.add(className);\n });\n return Array.from(classNames).join(" ");\n };\n}\nfunction compactStyles(...styles) {\n return styles.filter((style) => isObject(style) && Object.keys(compact(style)).length > 0);\n}\nfunction createMergeCss(context) {\n function resolve(styles) {\n const allStyles = compactStyles(...styles);\n if (allStyles.length === 1)\n return allStyles;\n return allStyles.map((style) => normalizeShorthand(style, context));\n }\n function mergeCss(...styles) {\n return mergeProps(...resolve(styles));\n }\n function assignCss(...styles) {\n return Object.assign({}, ...resolve(styles));\n }\n return { mergeCss, assignCss };\n}\n\n// src/memo.ts\nvar memo = (fn) => {\n const cache = /* @__PURE__ */ new Map();\n const get = (...args) => {\n const key = JSON.stringify(args);\n if (cache.has(key)) {\n return cache.get(key);\n }\n const result = fn(...args);\n cache.set(key, result);\n return result;\n };\n return get;\n};\n\n// src/hypenate-property.ts\nvar wordRegex = /([A-Z])/g;\nvar msRegex = /^ms-/;\nvar hypenateProperty = memo((property) => {\n if (property.startsWith("--"))\n return property;\n return property.replace(wordRegex, "-$1").replace(msRegex, "-ms-").toLowerCase();\n});\n\n// src/normalize-html.ts\nvar htmlProps = ["htmlSize", "htmlTranslate", "htmlWidth", "htmlHeight"];\nfunction convert(key) {\n return htmlProps.includes(key) ? key.replace("html", "").toLowerCase() : key;\n}\nfunction normalizeHTMLProps(props) {\n return Object.fromEntries(Object.entries(props).map(([key, value]) => [convert(key), value]));\n}\nnormalizeHTMLProps.keys = htmlProps;\n\n// src/split-props.ts\nfunction splitProps(props, ...keys) {\n const descriptors = Object.getOwnPropertyDescriptors(props);\n const dKeys = Object.keys(descriptors);\n const split = (k) => {\n const clone = {};\n for (let i = 0; i < k.length; i++) {\n const key = k[i];\n if (descriptors[key]) {\n Object.defineProperty(clone, key, descriptors[key]);\n delete descriptors[key];\n }\n }\n return clone;\n };\n const fn = (key) => split(Array.isArray(key) ? key : dKeys.filter(key));\n return keys.map(fn).concat(split(dKeys));\n}\nexport {\n astish,\n compact,\n createCss,\n createMergeCss,\n filterBaseConditions,\n hypenateProperty,\n isBaseCondition,\n isObject,\n mapObject,\n mergeProps,\n normalizeHTMLProps,\n splitProps,\n toHash,\n walkObject,\n withoutSpace\n};\n'
|
|
833
836
|
};
|
|
834
837
|
|
|
835
838
|
// src/artifacts/js/helpers.ts
|
|
@@ -855,6 +858,7 @@ var is_valid_prop_mjs_default = {
|
|
|
855
858
|
};
|
|
856
859
|
|
|
857
860
|
// src/artifacts/js/is-valid-prop.ts
|
|
861
|
+
var import_outdent9 = require("outdent");
|
|
858
862
|
function generateisValidProp(ctx) {
|
|
859
863
|
if (ctx.isTemplateLiteralSyntax)
|
|
860
864
|
return;
|
|
@@ -864,14 +868,19 @@ function generateisValidProp(ctx) {
|
|
|
864
868
|
`var userGenerated = [${ctx.properties.map((key) => JSON.stringify(key)).join(",")}]`
|
|
865
869
|
);
|
|
866
870
|
return {
|
|
867
|
-
js: content
|
|
871
|
+
js: content,
|
|
872
|
+
dts: import_outdent9.outdent`
|
|
873
|
+
declare const isCssProperty: (value: string) => boolean;
|
|
874
|
+
|
|
875
|
+
export { isCssProperty };
|
|
876
|
+
`
|
|
868
877
|
};
|
|
869
878
|
}
|
|
870
879
|
|
|
871
880
|
// src/artifacts/js/pattern.ts
|
|
872
881
|
var import_shared = require("@pandacss/shared");
|
|
873
882
|
var import_javascript_stringify = require("javascript-stringify");
|
|
874
|
-
var
|
|
883
|
+
var import_outdent10 = require("outdent");
|
|
875
884
|
var import_ts_pattern = require("ts-pattern");
|
|
876
885
|
function generatePattern(ctx) {
|
|
877
886
|
if (ctx.patterns.isEmpty())
|
|
@@ -889,7 +898,7 @@ function generatePattern(ctx) {
|
|
|
889
898
|
}
|
|
890
899
|
return {
|
|
891
900
|
name: dashName,
|
|
892
|
-
dts:
|
|
901
|
+
dts: import_outdent10.outdent`
|
|
893
902
|
import type { SystemStyleObject, ConditionalValue } from '../types'
|
|
894
903
|
import type { PropertyValue } from '../types/prop-type'
|
|
895
904
|
import type { Properties } from '../types/csstype'
|
|
@@ -913,7 +922,7 @@ function generatePattern(ctx) {
|
|
|
913
922
|
}).join("\n ")}
|
|
914
923
|
}
|
|
915
924
|
|
|
916
|
-
${strict ?
|
|
925
|
+
${strict ? import_outdent10.outdent`export declare function ${name}(options: ${upperName}Properties): string` : import_outdent10.outdent`
|
|
917
926
|
|
|
918
927
|
type ${upperName}Options = ${upperName}Properties & Omit<SystemStyleObject, keyof ${upperName}Properties ${blocklistType}>
|
|
919
928
|
|
|
@@ -922,7 +931,7 @@ function generatePattern(ctx) {
|
|
|
922
931
|
`}
|
|
923
932
|
|
|
924
933
|
`,
|
|
925
|
-
js:
|
|
934
|
+
js: import_outdent10.outdent`
|
|
926
935
|
${ctx.file.import(helperImports.join(", "), "../helpers")}
|
|
927
936
|
${ctx.file.import("css", "../css/index")}
|
|
928
937
|
|
|
@@ -939,7 +948,7 @@ transform`)}
|
|
|
939
948
|
|
|
940
949
|
// src/artifacts/js/recipe.ts
|
|
941
950
|
var import_shared2 = require("@pandacss/shared");
|
|
942
|
-
var
|
|
951
|
+
var import_outdent11 = require("outdent");
|
|
943
952
|
var stringify3 = (value) => JSON.stringify(value, null, 2);
|
|
944
953
|
var isBooleanValue = (value) => value === "true" || value === "false";
|
|
945
954
|
function generateRecipes(ctx) {
|
|
@@ -953,7 +962,7 @@ function generateRecipes(ctx) {
|
|
|
953
962
|
const createRecipeFn = {
|
|
954
963
|
name: "create-recipe",
|
|
955
964
|
dts: "",
|
|
956
|
-
js:
|
|
965
|
+
js: import_outdent11.outdent`
|
|
957
966
|
${ctx.file.import("css", "../css/css")}
|
|
958
967
|
${ctx.file.import("assertCompoundVariant, getCompoundVariantCss", "../css/cva")}
|
|
959
968
|
${ctx.file.import("cx", "../css/cx")}
|
|
@@ -1000,7 +1009,7 @@ function generateRecipes(ctx) {
|
|
|
1000
1009
|
const { name, description, defaultVariants, compoundVariants } = config;
|
|
1001
1010
|
return {
|
|
1002
1011
|
name: dashName,
|
|
1003
|
-
js:
|
|
1012
|
+
js: import_outdent11.outdent`
|
|
1004
1013
|
${ctx.file.import("splitProps", "../helpers")}
|
|
1005
1014
|
${ctx.file.import("createRecipe", "./create-recipe")}
|
|
1006
1015
|
|
|
@@ -1021,7 +1030,7 @@ function generateRecipes(ctx) {
|
|
|
1021
1030
|
splitVariantProps,
|
|
1022
1031
|
})
|
|
1023
1032
|
`,
|
|
1024
|
-
dts:
|
|
1033
|
+
dts: import_outdent11.outdent`
|
|
1025
1034
|
import type { ConditionalValue } from '../types'
|
|
1026
1035
|
import type { Pretty } from '../types/helpers'
|
|
1027
1036
|
|
|
@@ -1059,7 +1068,7 @@ function generateRecipes(ctx) {
|
|
|
1059
1068
|
}
|
|
1060
1069
|
|
|
1061
1070
|
// src/artifacts/js/token.ts
|
|
1062
|
-
var
|
|
1071
|
+
var import_outdent12 = __toESM(require("outdent"));
|
|
1063
1072
|
function generateTokenJs(ctx) {
|
|
1064
1073
|
const { tokens } = ctx;
|
|
1065
1074
|
const map = /* @__PURE__ */ new Map();
|
|
@@ -1070,7 +1079,7 @@ function generateTokenJs(ctx) {
|
|
|
1070
1079
|
});
|
|
1071
1080
|
const obj = Object.fromEntries(map);
|
|
1072
1081
|
return {
|
|
1073
|
-
js:
|
|
1082
|
+
js: import_outdent12.default`
|
|
1074
1083
|
const tokens = ${JSON.stringify(obj, null, 2)}
|
|
1075
1084
|
|
|
1076
1085
|
export function token(path, fallback) {
|
|
@@ -1083,7 +1092,7 @@ function generateTokenJs(ctx) {
|
|
|
1083
1092
|
|
|
1084
1093
|
token.var = tokenVar
|
|
1085
1094
|
`,
|
|
1086
|
-
dts:
|
|
1095
|
+
dts: import_outdent12.default`
|
|
1087
1096
|
import type { Token } from './tokens'
|
|
1088
1097
|
|
|
1089
1098
|
export declare const token: {
|
|
@@ -1097,11 +1106,11 @@ function generateTokenJs(ctx) {
|
|
|
1097
1106
|
}
|
|
1098
1107
|
|
|
1099
1108
|
// src/artifacts/preact-jsx/jsx.ts
|
|
1100
|
-
var
|
|
1109
|
+
var import_outdent13 = require("outdent");
|
|
1101
1110
|
function generatePreactJsxFactory(ctx) {
|
|
1102
1111
|
const { factoryName, componentName } = ctx.jsx;
|
|
1103
1112
|
return {
|
|
1104
|
-
js:
|
|
1113
|
+
js: import_outdent13.outdent`
|
|
1105
1114
|
import { h } from 'preact'
|
|
1106
1115
|
import { forwardRef } from 'preact/compat'
|
|
1107
1116
|
import { useMemo } from 'preact/hooks'
|
|
@@ -1168,7 +1177,7 @@ function generatePreactJsxFactory(ctx) {
|
|
|
1168
1177
|
}
|
|
1169
1178
|
|
|
1170
1179
|
// src/artifacts/preact-jsx/pattern.ts
|
|
1171
|
-
var
|
|
1180
|
+
var import_outdent14 = require("outdent");
|
|
1172
1181
|
var import_ts_pattern2 = require("ts-pattern");
|
|
1173
1182
|
function generatePreactJsxPattern(ctx) {
|
|
1174
1183
|
const { typeName, factoryName } = ctx.jsx;
|
|
@@ -1177,7 +1186,7 @@ function generatePreactJsxPattern(ctx) {
|
|
|
1177
1186
|
const { description, jsxElement = "div" } = pattern.config;
|
|
1178
1187
|
return {
|
|
1179
1188
|
name: dashName,
|
|
1180
|
-
js:
|
|
1189
|
+
js: import_outdent14.outdent`
|
|
1181
1190
|
import { h } from 'preact'
|
|
1182
1191
|
import { forwardRef } from 'preact/compat'
|
|
1183
1192
|
${ctx.file.import(factoryName, "./factory")}
|
|
@@ -1186,12 +1195,12 @@ function generatePreactJsxPattern(ctx) {
|
|
|
1186
1195
|
export const ${jsxName} = forwardRef(function ${jsxName}(props, ref) {
|
|
1187
1196
|
${(0, import_ts_pattern2.match)(props.length).with(
|
|
1188
1197
|
0,
|
|
1189
|
-
() =>
|
|
1198
|
+
() => import_outdent14.outdent`
|
|
1190
1199
|
const styleProps = ${styleFnName}()
|
|
1191
1200
|
return h(${factoryName}.${jsxElement}, { ref, ...styleProps, ...props })
|
|
1192
1201
|
`
|
|
1193
1202
|
).otherwise(
|
|
1194
|
-
() =>
|
|
1203
|
+
() => import_outdent14.outdent`
|
|
1195
1204
|
const { ${props.join(", ")}, ...restProps } = props
|
|
1196
1205
|
const styleProps = ${styleFnName}({${props.join(", ")}})
|
|
1197
1206
|
return h(${factoryName}.${jsxElement}, { ref, ...styleProps, ...restProps })
|
|
@@ -1199,7 +1208,7 @@ function generatePreactJsxPattern(ctx) {
|
|
|
1199
1208
|
)}
|
|
1200
1209
|
})
|
|
1201
1210
|
`,
|
|
1202
|
-
dts:
|
|
1211
|
+
dts: import_outdent14.outdent`
|
|
1203
1212
|
import type { FunctionComponent } from 'preact'
|
|
1204
1213
|
import type { ${upperName}Properties } from '../patterns/${dashName}'
|
|
1205
1214
|
import type { ${typeName} } from '../types/jsx'
|
|
@@ -1214,15 +1223,15 @@ function generatePreactJsxPattern(ctx) {
|
|
|
1214
1223
|
}
|
|
1215
1224
|
|
|
1216
1225
|
// src/artifacts/preact-jsx/types.ts
|
|
1217
|
-
var
|
|
1226
|
+
var import_outdent15 = require("outdent");
|
|
1218
1227
|
function generatePreactJsxTypes(ctx) {
|
|
1219
1228
|
const { factoryName, componentName, upperName, typeName } = ctx.jsx;
|
|
1220
1229
|
return {
|
|
1221
|
-
jsxFactory:
|
|
1230
|
+
jsxFactory: import_outdent15.outdent`
|
|
1222
1231
|
import type { ${upperName} } from '../types/jsx'
|
|
1223
1232
|
export declare const ${factoryName}: ${upperName}
|
|
1224
1233
|
`,
|
|
1225
|
-
jsxType:
|
|
1234
|
+
jsxType: import_outdent15.outdent`
|
|
1226
1235
|
import type { ComponentProps, JSX } from 'preact'
|
|
1227
1236
|
import type { Assign, JsxStyleProps, JsxHTMLProps } from './system-types'
|
|
1228
1237
|
import type { RecipeDefinition, RecipeSelection, RecipeVariantRecord } from './recipe'
|
|
@@ -1257,11 +1266,11 @@ export type ${typeName}<T extends ElementType> = JsxHTMLProps<ComponentProps<T>,
|
|
|
1257
1266
|
}
|
|
1258
1267
|
|
|
1259
1268
|
// src/artifacts/preact-jsx/jsx.string-literal.ts
|
|
1260
|
-
var
|
|
1269
|
+
var import_outdent16 = require("outdent");
|
|
1261
1270
|
function generatePreactJsxStringLiteralFactory(ctx) {
|
|
1262
1271
|
const { factoryName, componentName } = ctx.jsx;
|
|
1263
1272
|
return {
|
|
1264
|
-
js:
|
|
1273
|
+
js: import_outdent16.outdent`
|
|
1265
1274
|
import { h } from 'preact'
|
|
1266
1275
|
import { forwardRef } from 'preact/compat'
|
|
1267
1276
|
${ctx.file.import("css, cx", "../css/index")}
|
|
@@ -1307,15 +1316,15 @@ function generatePreactJsxStringLiteralFactory(ctx) {
|
|
|
1307
1316
|
}
|
|
1308
1317
|
|
|
1309
1318
|
// src/artifacts/preact-jsx/types.string-literal.ts
|
|
1310
|
-
var
|
|
1319
|
+
var import_outdent17 = require("outdent");
|
|
1311
1320
|
function generatePreactJsxStringLiteralTypes(ctx) {
|
|
1312
1321
|
const { factoryName, componentName, upperName, typeName } = ctx.jsx;
|
|
1313
1322
|
return {
|
|
1314
|
-
jsxFactory:
|
|
1323
|
+
jsxFactory: import_outdent17.outdent`
|
|
1315
1324
|
import type { ${upperName} } from '../types/jsx'
|
|
1316
1325
|
export declare const ${factoryName}: ${upperName}
|
|
1317
1326
|
`,
|
|
1318
|
-
jsxType:
|
|
1327
|
+
jsxType: import_outdent17.outdent`
|
|
1319
1328
|
import type { ComponentProps, JSX } from 'preact'
|
|
1320
1329
|
|
|
1321
1330
|
type ElementType = keyof JSX.IntrinsicElements
|
|
@@ -1341,11 +1350,11 @@ export type ${typeName}<T extends ElementType> = ComponentProps<T>
|
|
|
1341
1350
|
}
|
|
1342
1351
|
|
|
1343
1352
|
// src/artifacts/qwik-jsx/jsx.ts
|
|
1344
|
-
var
|
|
1353
|
+
var import_outdent18 = require("outdent");
|
|
1345
1354
|
function generateQwikJsxFactory(ctx) {
|
|
1346
1355
|
const { factoryName, componentName } = ctx.jsx;
|
|
1347
1356
|
return {
|
|
1348
|
-
js:
|
|
1357
|
+
js: import_outdent18.outdent`
|
|
1349
1358
|
import { h } from '@builder.io/qwik'
|
|
1350
1359
|
${ctx.file.import("css, cx, cva, assignCss", "../css/index")}
|
|
1351
1360
|
${ctx.file.import("splitProps, normalizeHTMLProps", "../helpers")}
|
|
@@ -1409,7 +1418,7 @@ function generateQwikJsxFactory(ctx) {
|
|
|
1409
1418
|
}
|
|
1410
1419
|
|
|
1411
1420
|
// src/artifacts/qwik-jsx/pattern.ts
|
|
1412
|
-
var
|
|
1421
|
+
var import_outdent19 = require("outdent");
|
|
1413
1422
|
var import_ts_pattern3 = require("ts-pattern");
|
|
1414
1423
|
function generateQwikJsxPattern(ctx) {
|
|
1415
1424
|
const { typeName, factoryName } = ctx.jsx;
|
|
@@ -1418,7 +1427,7 @@ function generateQwikJsxPattern(ctx) {
|
|
|
1418
1427
|
const { description, jsxElement = "div" } = pattern.config;
|
|
1419
1428
|
return {
|
|
1420
1429
|
name: dashName,
|
|
1421
|
-
js:
|
|
1430
|
+
js: import_outdent19.outdent`
|
|
1422
1431
|
import { h } from '@builder.io/qwik'
|
|
1423
1432
|
${ctx.file.import(factoryName, "./factory")}
|
|
1424
1433
|
${ctx.file.import(styleFnName, `../patterns/${dashName}`)}
|
|
@@ -1426,12 +1435,12 @@ function generateQwikJsxPattern(ctx) {
|
|
|
1426
1435
|
export const ${jsxName} = function ${jsxName}(props) {
|
|
1427
1436
|
${(0, import_ts_pattern3.match)(props.length).with(
|
|
1428
1437
|
0,
|
|
1429
|
-
() =>
|
|
1438
|
+
() => import_outdent19.outdent`
|
|
1430
1439
|
const styleProps = ${styleFnName}()
|
|
1431
1440
|
return h(${factoryName}.${jsxElement}, { ...styleProps, ...props })
|
|
1432
1441
|
`
|
|
1433
1442
|
).otherwise(
|
|
1434
|
-
() =>
|
|
1443
|
+
() => import_outdent19.outdent`
|
|
1435
1444
|
const { ${props.join(", ")}, ...restProps } = props
|
|
1436
1445
|
const styleProps = ${styleFnName}({${props.join(", ")}})
|
|
1437
1446
|
return h(${factoryName}.${jsxElement}, { ...styleProps, ...restProps })
|
|
@@ -1439,7 +1448,7 @@ function generateQwikJsxPattern(ctx) {
|
|
|
1439
1448
|
)}
|
|
1440
1449
|
}
|
|
1441
1450
|
`,
|
|
1442
|
-
dts:
|
|
1451
|
+
dts: import_outdent19.outdent`
|
|
1443
1452
|
import type { FunctionComponent } from '@builder.io/qwik'
|
|
1444
1453
|
import type { ${upperName}Properties } from '../patterns/${dashName}'
|
|
1445
1454
|
import type { ${typeName} } from '../types/jsx'
|
|
@@ -1458,15 +1467,15 @@ function generateQwikJsxPattern(ctx) {
|
|
|
1458
1467
|
}
|
|
1459
1468
|
|
|
1460
1469
|
// src/artifacts/qwik-jsx/types.ts
|
|
1461
|
-
var
|
|
1470
|
+
var import_outdent20 = require("outdent");
|
|
1462
1471
|
function generateQwikJsxTypes(ctx) {
|
|
1463
1472
|
const { factoryName, componentName, upperName, typeName } = ctx.jsx;
|
|
1464
1473
|
return {
|
|
1465
|
-
jsxFactory:
|
|
1474
|
+
jsxFactory: import_outdent20.outdent`
|
|
1466
1475
|
import { ${upperName} } from '../types/jsx'
|
|
1467
1476
|
export declare const ${factoryName}: ${upperName}
|
|
1468
1477
|
`,
|
|
1469
|
-
jsxType:
|
|
1478
|
+
jsxType: import_outdent20.outdent`
|
|
1470
1479
|
import type { FunctionComponent, QwikIntrinsicElements } from '@builder.io/qwik'
|
|
1471
1480
|
import type { Assign as _Assign, JsxStyleProps, PatchedHTMLProps } from './system-types'
|
|
1472
1481
|
import type { RecipeDefinition, RecipeSelection, RecipeVariantRecord } from './recipe'
|
|
@@ -1520,11 +1529,11 @@ export type ${typeName}<T extends ElementType> = Assign<ComponentProps<T>, JsxSt
|
|
|
1520
1529
|
}
|
|
1521
1530
|
|
|
1522
1531
|
// src/artifacts/qwik-jsx/jsx.string-literal.ts
|
|
1523
|
-
var
|
|
1532
|
+
var import_outdent21 = require("outdent");
|
|
1524
1533
|
function generateQwikJsxStringLiteralFactory(ctx) {
|
|
1525
1534
|
const { factoryName, componentName } = ctx.jsx;
|
|
1526
1535
|
return {
|
|
1527
|
-
js:
|
|
1536
|
+
js: import_outdent21.outdent`
|
|
1528
1537
|
import { h } from '@builder.io/qwik'
|
|
1529
1538
|
${ctx.file.import("css, cx", "../css/index")}
|
|
1530
1539
|
|
|
@@ -1569,15 +1578,15 @@ function generateQwikJsxStringLiteralFactory(ctx) {
|
|
|
1569
1578
|
}
|
|
1570
1579
|
|
|
1571
1580
|
// src/artifacts/qwik-jsx/types.string-literal.ts
|
|
1572
|
-
var
|
|
1581
|
+
var import_outdent22 = require("outdent");
|
|
1573
1582
|
function generateQwikJsxStringLiteralTypes(ctx) {
|
|
1574
1583
|
const { factoryName, componentName, upperName, typeName } = ctx.jsx;
|
|
1575
1584
|
return {
|
|
1576
|
-
jsxFactory:
|
|
1585
|
+
jsxFactory: import_outdent22.outdent`
|
|
1577
1586
|
import { ${upperName} } from '../types/jsx'
|
|
1578
1587
|
export declare const ${factoryName}: ${upperName}
|
|
1579
1588
|
`,
|
|
1580
|
-
jsxType:
|
|
1589
|
+
jsxType: import_outdent22.outdent`
|
|
1581
1590
|
import type { FunctionComponent, QwikIntrinsicElements } from '@builder.io/qwik'
|
|
1582
1591
|
|
|
1583
1592
|
type ElementType = keyof QwikIntrinsicElements | FunctionComponent<any>
|
|
@@ -1608,11 +1617,11 @@ export type ${typeName}<T extends ElementType> = ComponentProps<T>
|
|
|
1608
1617
|
}
|
|
1609
1618
|
|
|
1610
1619
|
// src/artifacts/react-jsx/jsx.ts
|
|
1611
|
-
var
|
|
1620
|
+
var import_outdent23 = require("outdent");
|
|
1612
1621
|
function generateReactJsxFactory(ctx) {
|
|
1613
1622
|
const { factoryName, componentName } = ctx.jsx;
|
|
1614
1623
|
return {
|
|
1615
|
-
js:
|
|
1624
|
+
js: import_outdent23.outdent`
|
|
1616
1625
|
import { createElement, forwardRef, useMemo } from 'react'
|
|
1617
1626
|
${ctx.file.import("css, cx, cva, assignCss", "../css/index")}
|
|
1618
1627
|
${ctx.file.import("splitProps, normalizeHTMLProps", "../helpers")}
|
|
@@ -1678,7 +1687,7 @@ function generateReactJsxFactory(ctx) {
|
|
|
1678
1687
|
}
|
|
1679
1688
|
|
|
1680
1689
|
// src/artifacts/react-jsx/pattern.ts
|
|
1681
|
-
var
|
|
1690
|
+
var import_outdent24 = require("outdent");
|
|
1682
1691
|
var import_ts_pattern4 = require("ts-pattern");
|
|
1683
1692
|
function generateReactJsxPattern(ctx) {
|
|
1684
1693
|
const { typeName, factoryName } = ctx.jsx;
|
|
@@ -1687,7 +1696,7 @@ function generateReactJsxPattern(ctx) {
|
|
|
1687
1696
|
const { description, jsxElement = "div" } = pattern.config;
|
|
1688
1697
|
return {
|
|
1689
1698
|
name: dashName,
|
|
1690
|
-
js:
|
|
1699
|
+
js: import_outdent24.outdent`
|
|
1691
1700
|
import { createElement, forwardRef } from 'react'
|
|
1692
1701
|
${ctx.file.import(factoryName, "./factory")}
|
|
1693
1702
|
${ctx.file.import(styleFnName, `../patterns/${dashName}`)}
|
|
@@ -1695,12 +1704,12 @@ function generateReactJsxPattern(ctx) {
|
|
|
1695
1704
|
export const ${jsxName} = forwardRef(function ${jsxName}(props, ref) {
|
|
1696
1705
|
${(0, import_ts_pattern4.match)(props.length).with(
|
|
1697
1706
|
0,
|
|
1698
|
-
() =>
|
|
1707
|
+
() => import_outdent24.outdent`
|
|
1699
1708
|
const styleProps = ${styleFnName}()
|
|
1700
1709
|
return createElement(${factoryName}.${jsxElement}, { ref, ...styleProps, ...props })
|
|
1701
1710
|
`
|
|
1702
1711
|
).otherwise(
|
|
1703
|
-
() =>
|
|
1712
|
+
() => import_outdent24.outdent`
|
|
1704
1713
|
const { ${props.join(", ")}, ...restProps } = props
|
|
1705
1714
|
const styleProps = ${styleFnName}({${props.join(", ")}})
|
|
1706
1715
|
return createElement(${factoryName}.${jsxElement}, { ref, ...styleProps, ...restProps })
|
|
@@ -1708,7 +1717,7 @@ function generateReactJsxPattern(ctx) {
|
|
|
1708
1717
|
)}
|
|
1709
1718
|
})
|
|
1710
1719
|
`,
|
|
1711
|
-
dts:
|
|
1720
|
+
dts: import_outdent24.outdent`
|
|
1712
1721
|
import type { FunctionComponent } from 'react'
|
|
1713
1722
|
import type { ${upperName}Properties } from '../patterns/${dashName}'
|
|
1714
1723
|
import type { ${typeName} } from '../types/jsx'
|
|
@@ -1723,15 +1732,15 @@ function generateReactJsxPattern(ctx) {
|
|
|
1723
1732
|
}
|
|
1724
1733
|
|
|
1725
1734
|
// src/artifacts/react-jsx/types.ts
|
|
1726
|
-
var
|
|
1735
|
+
var import_outdent25 = require("outdent");
|
|
1727
1736
|
function generateReactJsxTypes(ctx) {
|
|
1728
1737
|
const { factoryName, componentName, upperName, typeName } = ctx.jsx;
|
|
1729
1738
|
return {
|
|
1730
|
-
jsxFactory:
|
|
1739
|
+
jsxFactory: import_outdent25.outdent`
|
|
1731
1740
|
import { ${upperName} } from '../types/jsx'
|
|
1732
1741
|
export declare const ${factoryName}: ${upperName}
|
|
1733
1742
|
`,
|
|
1734
|
-
jsxType:
|
|
1743
|
+
jsxType: import_outdent25.outdent`
|
|
1735
1744
|
import type { ComponentProps, ElementType } from 'react'
|
|
1736
1745
|
import type { Assign, JsxStyleProps, JsxHTMLProps } from './system-types'
|
|
1737
1746
|
import type { RecipeDefinition, RecipeSelection, RecipeVariantRecord } from './recipe'
|
|
@@ -1764,11 +1773,11 @@ export type ${typeName}<T extends ElementType> = JsxHTMLProps<ComponentProps<T>,
|
|
|
1764
1773
|
}
|
|
1765
1774
|
|
|
1766
1775
|
// src/artifacts/react-jsx/jsx.string-literal.ts
|
|
1767
|
-
var
|
|
1776
|
+
var import_outdent26 = require("outdent");
|
|
1768
1777
|
function generateReactJsxStringLiteralFactory(ctx) {
|
|
1769
1778
|
const { factoryName, componentName } = ctx.jsx;
|
|
1770
1779
|
return {
|
|
1771
|
-
js:
|
|
1780
|
+
js: import_outdent26.outdent`
|
|
1772
1781
|
import { createElement, forwardRef } from 'react'
|
|
1773
1782
|
${ctx.file.import("css, cx", "../css/index")}
|
|
1774
1783
|
|
|
@@ -1814,15 +1823,15 @@ function generateReactJsxStringLiteralFactory(ctx) {
|
|
|
1814
1823
|
}
|
|
1815
1824
|
|
|
1816
1825
|
// src/artifacts/react-jsx/types.string-literal.ts
|
|
1817
|
-
var
|
|
1826
|
+
var import_outdent27 = require("outdent");
|
|
1818
1827
|
function generateReactJsxStringLiteralTypes(ctx) {
|
|
1819
1828
|
const { factoryName, componentName, upperName, typeName } = ctx.jsx;
|
|
1820
1829
|
return {
|
|
1821
|
-
jsxFactory:
|
|
1830
|
+
jsxFactory: import_outdent27.outdent`
|
|
1822
1831
|
import { ${upperName} } from '../types/jsx'
|
|
1823
1832
|
export declare const ${factoryName}: ${upperName}
|
|
1824
1833
|
`,
|
|
1825
|
-
jsxType:
|
|
1834
|
+
jsxType: import_outdent27.outdent`
|
|
1826
1835
|
import type { ComponentProps, ElementType } from 'react'
|
|
1827
1836
|
|
|
1828
1837
|
type Dict = Record<string, unknown>
|
|
@@ -1846,11 +1855,11 @@ export type ${typeName}<T extends ElementType> = ComponentProps<T>
|
|
|
1846
1855
|
}
|
|
1847
1856
|
|
|
1848
1857
|
// src/artifacts/solid-jsx/jsx.ts
|
|
1849
|
-
var
|
|
1858
|
+
var import_outdent28 = require("outdent");
|
|
1850
1859
|
function generateSolidJsxFactory(ctx) {
|
|
1851
1860
|
const { componentName, factoryName } = ctx.jsx;
|
|
1852
1861
|
return {
|
|
1853
|
-
js:
|
|
1862
|
+
js: import_outdent28.outdent`
|
|
1854
1863
|
import { Dynamic } from 'solid-js/web'
|
|
1855
1864
|
import { mergeProps, splitProps } from 'solid-js'
|
|
1856
1865
|
import { createComponent } from 'solid-js/web'
|
|
@@ -1927,7 +1936,7 @@ function generateSolidJsxFactory(ctx) {
|
|
|
1927
1936
|
}
|
|
1928
1937
|
|
|
1929
1938
|
// src/artifacts/solid-jsx/pattern.ts
|
|
1930
|
-
var
|
|
1939
|
+
var import_outdent29 = require("outdent");
|
|
1931
1940
|
var import_ts_pattern5 = require("ts-pattern");
|
|
1932
1941
|
function generateSolidJsxPattern(ctx) {
|
|
1933
1942
|
const { typeName, factoryName } = ctx.jsx;
|
|
@@ -1936,7 +1945,7 @@ function generateSolidJsxPattern(ctx) {
|
|
|
1936
1945
|
const { description, jsxElement = "div" } = pattern.config;
|
|
1937
1946
|
return {
|
|
1938
1947
|
name: dashName,
|
|
1939
|
-
js:
|
|
1948
|
+
js: import_outdent29.outdent`
|
|
1940
1949
|
import { splitProps, mergeProps } from 'solid-js'
|
|
1941
1950
|
import { createComponent } from 'solid-js/web'
|
|
1942
1951
|
${ctx.file.import(factoryName, "./factory")}
|
|
@@ -1945,12 +1954,12 @@ function generateSolidJsxPattern(ctx) {
|
|
|
1945
1954
|
export function ${jsxName}(props) {
|
|
1946
1955
|
${(0, import_ts_pattern5.match)(props.length).with(
|
|
1947
1956
|
0,
|
|
1948
|
-
() =>
|
|
1957
|
+
() => import_outdent29.outdent`
|
|
1949
1958
|
const styleProps = ${styleFnName}()
|
|
1950
1959
|
return createComponent(${factoryName}.${jsxElement}, mergeProps(styleProps, props))
|
|
1951
1960
|
`
|
|
1952
1961
|
).otherwise(
|
|
1953
|
-
() =>
|
|
1962
|
+
() => import_outdent29.outdent`
|
|
1954
1963
|
const [patternProps, restProps] = splitProps(props, [${props.map((v) => JSON.stringify(v)).join(", ")}]);
|
|
1955
1964
|
const styleProps = ${styleFnName}(patternProps)
|
|
1956
1965
|
return createComponent(${factoryName}.${jsxElement}, mergeProps(styleProps, restProps))
|
|
@@ -1958,7 +1967,7 @@ function generateSolidJsxPattern(ctx) {
|
|
|
1958
1967
|
)}
|
|
1959
1968
|
}
|
|
1960
1969
|
`,
|
|
1961
|
-
dts:
|
|
1970
|
+
dts: import_outdent29.outdent`
|
|
1962
1971
|
import { Component } from 'solid-js'
|
|
1963
1972
|
import { ${upperName}Properties } from '../patterns/${dashName}'
|
|
1964
1973
|
import { ${typeName} } from '../types/jsx'
|
|
@@ -1973,15 +1982,15 @@ function generateSolidJsxPattern(ctx) {
|
|
|
1973
1982
|
}
|
|
1974
1983
|
|
|
1975
1984
|
// src/artifacts/solid-jsx/types.ts
|
|
1976
|
-
var
|
|
1985
|
+
var import_outdent30 = require("outdent");
|
|
1977
1986
|
function generateSolidJsxTypes(ctx) {
|
|
1978
1987
|
const { factoryName, componentName, upperName, typeName } = ctx.jsx;
|
|
1979
1988
|
return {
|
|
1980
|
-
jsxFactory:
|
|
1989
|
+
jsxFactory: import_outdent30.outdent`
|
|
1981
1990
|
import type { ${upperName} } from '../types/jsx'
|
|
1982
1991
|
export declare const ${factoryName}: ${upperName}
|
|
1983
1992
|
`,
|
|
1984
|
-
jsxType:
|
|
1993
|
+
jsxType: import_outdent30.outdent`
|
|
1985
1994
|
import type { ComponentProps, Component, JSX } from 'solid-js'
|
|
1986
1995
|
import type { Assign, JsxStyleProps, JsxHTMLProps } from './system-types'
|
|
1987
1996
|
import type { RecipeDefinition, RecipeSelection, RecipeVariantRecord } from './recipe'
|
|
@@ -2016,11 +2025,11 @@ export type ${typeName}<T extends ElementType> = JsxHTMLProps<ComponentProps<T>,
|
|
|
2016
2025
|
}
|
|
2017
2026
|
|
|
2018
2027
|
// src/artifacts/solid-jsx/jsx.string-literal.ts
|
|
2019
|
-
var
|
|
2028
|
+
var import_outdent31 = require("outdent");
|
|
2020
2029
|
function generateSolidJsxStringLiteralFactory(ctx) {
|
|
2021
2030
|
const { componentName, factoryName } = ctx.jsx;
|
|
2022
2031
|
return {
|
|
2023
|
-
js:
|
|
2032
|
+
js: import_outdent31.outdent`
|
|
2024
2033
|
import { mergeProps, splitProps } from 'solid-js'
|
|
2025
2034
|
import { Dynamic, createComponent } from 'solid-js/web'
|
|
2026
2035
|
${ctx.file.import("css, cx", "../css/index")}
|
|
@@ -2072,15 +2081,15 @@ export const ${factoryName} = createJsxFactory()
|
|
|
2072
2081
|
}
|
|
2073
2082
|
|
|
2074
2083
|
// src/artifacts/solid-jsx/types.string-literal.ts
|
|
2075
|
-
var
|
|
2084
|
+
var import_outdent32 = require("outdent");
|
|
2076
2085
|
function generateSolidJsxStringLiteralTypes(ctx) {
|
|
2077
2086
|
const { factoryName, componentName, upperName, typeName } = ctx.jsx;
|
|
2078
2087
|
return {
|
|
2079
|
-
jsxFactory:
|
|
2088
|
+
jsxFactory: import_outdent32.outdent`
|
|
2080
2089
|
import type { ${upperName} } from '../types/jsx'
|
|
2081
2090
|
export declare const ${factoryName}: ${upperName}
|
|
2082
2091
|
`,
|
|
2083
|
-
jsxType:
|
|
2092
|
+
jsxType: import_outdent32.outdent`
|
|
2084
2093
|
import type { Component, ComponentProps, JSX } from 'solid-js'
|
|
2085
2094
|
|
|
2086
2095
|
type Dict = Record<string, unknown>
|
|
@@ -2106,11 +2115,11 @@ export type ${typeName}<T extends ElementType> = ComponentProps<T>
|
|
|
2106
2115
|
}
|
|
2107
2116
|
|
|
2108
2117
|
// src/artifacts/vue-jsx/jsx.ts
|
|
2109
|
-
var
|
|
2118
|
+
var import_outdent33 = require("outdent");
|
|
2110
2119
|
function generateVueJsxFactory(ctx) {
|
|
2111
2120
|
const { factoryName } = ctx.jsx;
|
|
2112
2121
|
return {
|
|
2113
|
-
js:
|
|
2122
|
+
js: import_outdent33.outdent`
|
|
2114
2123
|
import { defineComponent, h, computed } from 'vue'
|
|
2115
2124
|
${ctx.file.import("css, cx, cva, assignCss", "../css/index")}
|
|
2116
2125
|
${ctx.file.import("splitProps, normalizeHTMLProps", "../helpers")}
|
|
@@ -2184,11 +2193,11 @@ function generateVueJsxFactory(ctx) {
|
|
|
2184
2193
|
}
|
|
2185
2194
|
|
|
2186
2195
|
// src/artifacts/vue-jsx/jsx.string-literal.ts
|
|
2187
|
-
var
|
|
2196
|
+
var import_outdent34 = require("outdent");
|
|
2188
2197
|
function generateVueJsxStringLiteralFactory(ctx) {
|
|
2189
2198
|
const { factoryName } = ctx.jsx;
|
|
2190
2199
|
return {
|
|
2191
|
-
js:
|
|
2200
|
+
js: import_outdent34.outdent`
|
|
2192
2201
|
import { defineComponent, h, computed } from 'vue'
|
|
2193
2202
|
${ctx.file.import("css, cx", "../css/index")}
|
|
2194
2203
|
|
|
@@ -2238,7 +2247,7 @@ function generateVueJsxStringLiteralFactory(ctx) {
|
|
|
2238
2247
|
}
|
|
2239
2248
|
|
|
2240
2249
|
// src/artifacts/vue-jsx/pattern.ts
|
|
2241
|
-
var
|
|
2250
|
+
var import_outdent35 = require("outdent");
|
|
2242
2251
|
function generateVueJsxPattern(ctx) {
|
|
2243
2252
|
const { typeName, factoryName } = ctx.jsx;
|
|
2244
2253
|
return ctx.patterns.details.map((pattern) => {
|
|
@@ -2247,7 +2256,7 @@ function generateVueJsxPattern(ctx) {
|
|
|
2247
2256
|
const propList = props.map((v) => JSON.stringify(v)).join(", ");
|
|
2248
2257
|
return {
|
|
2249
2258
|
name: dashName,
|
|
2250
|
-
js:
|
|
2259
|
+
js: import_outdent35.outdent`
|
|
2251
2260
|
import { defineComponent, h, computed } from 'vue'
|
|
2252
2261
|
${ctx.file.import(factoryName, "./factory")}
|
|
2253
2262
|
${ctx.file.import(styleFnName, `../patterns/${dashName}`)}
|
|
@@ -2265,7 +2274,7 @@ function generateVueJsxPattern(ctx) {
|
|
|
2265
2274
|
}
|
|
2266
2275
|
})
|
|
2267
2276
|
`,
|
|
2268
|
-
dts:
|
|
2277
|
+
dts: import_outdent35.outdent`
|
|
2269
2278
|
import { FunctionalComponent } from 'vue'
|
|
2270
2279
|
import { ${upperName}Properties } from '../patterns/${dashName}'
|
|
2271
2280
|
import { ${typeName} } from '../types/jsx'
|
|
@@ -2280,15 +2289,15 @@ function generateVueJsxPattern(ctx) {
|
|
|
2280
2289
|
}
|
|
2281
2290
|
|
|
2282
2291
|
// src/artifacts/vue-jsx/types.ts
|
|
2283
|
-
var
|
|
2292
|
+
var import_outdent36 = require("outdent");
|
|
2284
2293
|
function generateVueJsxTypes(ctx) {
|
|
2285
2294
|
const { factoryName, componentName, upperName, typeName } = ctx.jsx;
|
|
2286
2295
|
return {
|
|
2287
|
-
jsxFactory:
|
|
2296
|
+
jsxFactory: import_outdent36.outdent`
|
|
2288
2297
|
import { ${upperName} } from '../types/jsx'
|
|
2289
2298
|
export declare const ${factoryName}: ${upperName}
|
|
2290
2299
|
`,
|
|
2291
|
-
jsxType:
|
|
2300
|
+
jsxType: import_outdent36.outdent`
|
|
2292
2301
|
import type { Component, FunctionalComponent } from 'vue'
|
|
2293
2302
|
import type { Assign, JsxStyleProps, JsxHTMLProps } from './system-types'
|
|
2294
2303
|
import type { RecipeDefinition, RecipeSelection, RecipeVariantRecord } from './recipe'
|
|
@@ -2445,15 +2454,15 @@ type IntrinsicElement =
|
|
|
2445
2454
|
}
|
|
2446
2455
|
|
|
2447
2456
|
// src/artifacts/vue-jsx/types.string-literal.ts
|
|
2448
|
-
var
|
|
2457
|
+
var import_outdent37 = require("outdent");
|
|
2449
2458
|
function generateVueJsxStringLiteralTypes(ctx) {
|
|
2450
2459
|
const { factoryName, componentName, upperName, typeName } = ctx.jsx;
|
|
2451
2460
|
return {
|
|
2452
|
-
jsxFactory:
|
|
2461
|
+
jsxFactory: import_outdent37.outdent`
|
|
2453
2462
|
import { ${upperName} } from '../types/jsx'
|
|
2454
2463
|
export declare const ${factoryName}: ${upperName}
|
|
2455
2464
|
`,
|
|
2456
|
-
jsxType:
|
|
2465
|
+
jsxType: import_outdent37.outdent`
|
|
2457
2466
|
import type { Component, FunctionalComponent } from 'vue'
|
|
2458
2467
|
|
|
2459
2468
|
type IntrinsicElement =
|
|
@@ -2668,22 +2677,27 @@ function generatePackageJson(ctx) {
|
|
|
2668
2677
|
exports: {
|
|
2669
2678
|
"./css": {
|
|
2670
2679
|
types: "./css/index.d.ts",
|
|
2680
|
+
require: "./css/index.mjs",
|
|
2671
2681
|
import: "./css/index.mjs"
|
|
2672
2682
|
},
|
|
2673
2683
|
"./jsx": {
|
|
2674
2684
|
types: "./jsx/index.d.ts",
|
|
2685
|
+
require: "./jsx/index.mjs",
|
|
2675
2686
|
import: "./jsx/index.mjs"
|
|
2676
2687
|
},
|
|
2677
2688
|
"./patterns": {
|
|
2678
2689
|
types: "./patterns/index.d.ts",
|
|
2690
|
+
require: "./patterns/index.mjs",
|
|
2679
2691
|
import: "./patterns/index.mjs"
|
|
2680
2692
|
},
|
|
2681
2693
|
"./recipes": {
|
|
2682
2694
|
types: "./recipes/index.d.ts",
|
|
2695
|
+
require: "./recipes/index.mjs",
|
|
2683
2696
|
import: "./recipes/index.mjs"
|
|
2684
2697
|
},
|
|
2685
2698
|
"./tokens": {
|
|
2686
2699
|
types: "./tokens/index.d.ts",
|
|
2700
|
+
require: "./tokens/index.mjs",
|
|
2687
2701
|
import: "./tokens/index.mjs"
|
|
2688
2702
|
},
|
|
2689
2703
|
"./types": {
|
|
@@ -2717,7 +2731,7 @@ var recipe_d_ts_default = {
|
|
|
2717
2731
|
|
|
2718
2732
|
// src/artifacts/generated/pattern.d.ts.json
|
|
2719
2733
|
var pattern_d_ts_default = {
|
|
2720
|
-
content: "import type { CssProperty, SystemStyleObject } from './system-types'\nimport type { TokenCategory } from '../tokens'\n\ntype Primitive = string | number | boolean | null | undefined\ntype LiteralUnion<T, K extends Primitive = string> = T | (K & Record<never, never>)\n\nexport type PatternProperty =\n | { type: 'property'; value: CssProperty }\n | { type: 'enum'; value: string[] }\n | { type: 'token'; value: TokenCategory; property?: CssProperty }\n | { type: 'string' | 'boolean' | 'number' }\n\nexport type PatternHelpers = {\n map: (value: any, fn: (value: string) => string | undefined) => any\n}\n\
|
|
2734
|
+
content: "import type { CssProperty, SystemStyleObject } from './system-types'\nimport type { TokenCategory } from '../tokens'\n\ntype Primitive = string | number | boolean | null | undefined\ntype LiteralUnion<T, K extends Primitive = string> = T | (K & Record<never, never>)\n\nexport type PatternProperty =\n | { type: 'property'; value: CssProperty }\n | { type: 'enum'; value: string[] }\n | { type: 'token'; value: TokenCategory; property?: CssProperty }\n | { type: 'string' | 'boolean' | 'number' }\n\nexport type PatternHelpers = {\n map: (value: any, fn: (value: string) => string | undefined) => any\n}\n\nexport type PatternProperties = Record<string, PatternProperty>\n\ntype Props<T> = Record<LiteralUnion<keyof T>, any>\n\nexport type PatternConfig<T extends PatternProperties = PatternProperties> = {\n /**\n * The description of the pattern. This will be used in the JSDoc comment.\n */\n description?: string\n /**\n * The JSX element rendered by the pattern\n * @default 'div'\n */\n jsxElement?: string\n /**\n * The properties of the pattern.\n */\n properties?: T\n /**\n * The css object this pattern will generate.\n */\n transform?: (props: Props<T>, helpers: PatternHelpers) => SystemStyleObject\n /**\n * The jsx element name this pattern will generate.\n */\n jsx?: string\n /**\n * Whether to only generate types for the specified properties.\n * This will disallow css properties\n */\n strict?: boolean\n /**\n * @experimental\n * Disallow certain css properties for this pattern\n */\n blocklist?: LiteralUnion<CssProperty>[]\n}\n"
|
|
2721
2735
|
};
|
|
2722
2736
|
|
|
2723
2737
|
// src/artifacts/generated/parts.d.ts.json
|
|
@@ -2744,12 +2758,12 @@ function getGeneratedTypes() {
|
|
|
2744
2758
|
}
|
|
2745
2759
|
|
|
2746
2760
|
// src/artifacts/types/main.ts
|
|
2747
|
-
var
|
|
2761
|
+
var import_outdent38 = require("outdent");
|
|
2748
2762
|
var generateTypesEntry = () => ({
|
|
2749
|
-
global:
|
|
2763
|
+
global: import_outdent38.outdent`
|
|
2750
2764
|
import type { RecipeVariantRecord, RecipeConfig } from './recipe'
|
|
2751
2765
|
import type { Parts } from './parts'
|
|
2752
|
-
import type { PatternConfig } from './pattern'
|
|
2766
|
+
import type { PatternConfig, PatternProperties } from './pattern'
|
|
2753
2767
|
import type { GlobalStyleObject, SystemStyleObject } from './system-types'
|
|
2754
2768
|
import type { CompositionStyles } from './composition'
|
|
2755
2769
|
|
|
@@ -2759,23 +2773,23 @@ var generateTypesEntry = () => ({
|
|
|
2759
2773
|
export function defineGlobalStyles(definition: GlobalStyleObject): GlobalStyleObject
|
|
2760
2774
|
export function defineTextStyles(definition: CompositionStyles['textStyles']): CompositionStyles['textStyles']
|
|
2761
2775
|
export function defineLayerStyles(definition: CompositionStyles['layerStyles']): CompositionStyles['layerStyles']
|
|
2762
|
-
export function definePattern<T>(config: PatternConfig<T>): PatternConfig
|
|
2776
|
+
export function definePattern<T extends PatternProperties>(config: PatternConfig<T>): PatternConfig
|
|
2763
2777
|
export function defineParts<T extends Parts>(parts: T): (config: Partial<Record<keyof T, SystemStyleObject>>) => Partial<Record<keyof T, SystemStyleObject>>;
|
|
2764
2778
|
}
|
|
2765
2779
|
`,
|
|
2766
|
-
index:
|
|
2780
|
+
index: import_outdent38.outdent`
|
|
2767
2781
|
import './global'
|
|
2768
2782
|
export type { ConditionalValue } from './conditions'
|
|
2769
2783
|
export type { GlobalStyleObject, JsxStyleProps, SystemStyleObject } from './system-types'
|
|
2770
2784
|
|
|
2771
2785
|
`,
|
|
2772
|
-
helpers:
|
|
2786
|
+
helpers: import_outdent38.outdent`
|
|
2773
2787
|
export type Pretty<T> = T extends infer U ? { [K in keyof U]: U[K] } : never
|
|
2774
2788
|
`
|
|
2775
2789
|
});
|
|
2776
2790
|
|
|
2777
2791
|
// src/artifacts/types/prop-types.ts
|
|
2778
|
-
var
|
|
2792
|
+
var import_outdent39 = require("outdent");
|
|
2779
2793
|
function generatePropTypes(ctx) {
|
|
2780
2794
|
const {
|
|
2781
2795
|
config: { strictTokens },
|
|
@@ -2783,7 +2797,7 @@ function generatePropTypes(ctx) {
|
|
|
2783
2797
|
} = ctx;
|
|
2784
2798
|
const strictText = `${strictTokens ? "" : " | CssValue<T>"}`;
|
|
2785
2799
|
const result = [
|
|
2786
|
-
|
|
2800
|
+
import_outdent39.outdent`
|
|
2787
2801
|
import type { ConditionalValue } from './conditions';
|
|
2788
2802
|
import type { CssProperties } from './system-types'
|
|
2789
2803
|
import type { Tokens } from '../tokens'
|
|
@@ -2806,7 +2820,7 @@ function generatePropTypes(ctx) {
|
|
|
2806
2820
|
result.push(` ${key}: Shorthand<${JSON.stringify(value)}>;`);
|
|
2807
2821
|
});
|
|
2808
2822
|
result.push("}");
|
|
2809
|
-
return
|
|
2823
|
+
return import_outdent39.outdent`
|
|
2810
2824
|
${result.join("\n")}
|
|
2811
2825
|
|
|
2812
2826
|
export type PropertyValue<T extends string> = T extends keyof PropertyTypes
|
|
@@ -2819,10 +2833,10 @@ function generatePropTypes(ctx) {
|
|
|
2819
2833
|
|
|
2820
2834
|
// src/artifacts/types/style-props.ts
|
|
2821
2835
|
var import_is_valid_prop = require("@pandacss/is-valid-prop");
|
|
2822
|
-
var
|
|
2836
|
+
var import_outdent40 = __toESM(require("outdent"));
|
|
2823
2837
|
function generateStyleProps(ctx) {
|
|
2824
2838
|
const props = new Set(import_is_valid_prop.allCssProperties.concat(ctx.utility.keys()));
|
|
2825
|
-
return
|
|
2839
|
+
return import_outdent40.default`
|
|
2826
2840
|
import type { ConditionalValue } from './conditions'
|
|
2827
2841
|
import type { PropertyValue } from './prop-type'
|
|
2828
2842
|
import type { Token } from '../tokens'
|
|
@@ -2839,7 +2853,7 @@ function generateStyleProps(ctx) {
|
|
|
2839
2853
|
|
|
2840
2854
|
// src/artifacts/types/token-types.ts
|
|
2841
2855
|
var import_shared3 = require("@pandacss/shared");
|
|
2842
|
-
var
|
|
2856
|
+
var import_outdent41 = require("outdent");
|
|
2843
2857
|
var import_pluralize = __toESM(require("pluralize"));
|
|
2844
2858
|
var categories = [
|
|
2845
2859
|
"zIndex",
|
|
@@ -2884,7 +2898,7 @@ function generateTokenTypes(ctx) {
|
|
|
2884
2898
|
result.add("} & { [token: string]: never }");
|
|
2885
2899
|
set.add(Array.from(result).join("\n"));
|
|
2886
2900
|
set.add(`export type TokenCategory = ${(0, import_shared3.unionType)(categories)}`);
|
|
2887
|
-
return
|
|
2901
|
+
return import_outdent41.outdent.string(Array.from(set).join("\n\n"));
|
|
2888
2902
|
}
|
|
2889
2903
|
|
|
2890
2904
|
// src/artifacts/index.ts
|
|
@@ -2981,8 +2995,8 @@ function setupRecipes(ctx) {
|
|
|
2981
2995
|
return;
|
|
2982
2996
|
const indexFiles = files.filter((file) => !file.name.includes("create-recipe"));
|
|
2983
2997
|
const index = {
|
|
2984
|
-
js:
|
|
2985
|
-
dts:
|
|
2998
|
+
js: import_outdent42.default.string(indexFiles.map((file) => ctx.file.export(`./${file.name}`)).join("\n")),
|
|
2999
|
+
dts: import_outdent42.default.string(indexFiles.map((file) => `export * from './${file.name}'`).join("\n"))
|
|
2986
3000
|
};
|
|
2987
3001
|
return {
|
|
2988
3002
|
dir: ctx.paths.recipe,
|
|
@@ -3001,8 +3015,8 @@ function setupPatterns(ctx) {
|
|
|
3001
3015
|
if (!files)
|
|
3002
3016
|
return;
|
|
3003
3017
|
const index = {
|
|
3004
|
-
js:
|
|
3005
|
-
dts:
|
|
3018
|
+
js: import_outdent42.default.string(files.map((file) => ctx.file.export(`./${file.name}`)).join("\n")),
|
|
3019
|
+
dts: import_outdent42.default.string(files.map((file) => `export * from './${file.name}'`).join("\n"))
|
|
3006
3020
|
};
|
|
3007
3021
|
return {
|
|
3008
3022
|
dir: ctx.paths.pattern,
|
|
@@ -3022,13 +3036,15 @@ function setupJsx(ctx) {
|
|
|
3022
3036
|
const factory = generateJsxFactory(ctx);
|
|
3023
3037
|
const patterns = generateJsxPatterns(ctx);
|
|
3024
3038
|
const index = {
|
|
3025
|
-
js:
|
|
3039
|
+
js: import_outdent42.default`
|
|
3026
3040
|
${ctx.file.export("./factory")}
|
|
3027
|
-
${
|
|
3041
|
+
${isValidProp?.js ? ctx.file.export("./is-valid-prop") : ""}
|
|
3042
|
+
${import_outdent42.default.string(patterns.map((file) => ctx.file.export(`./${file.name}`)).join("\n"))}
|
|
3028
3043
|
`,
|
|
3029
|
-
dts:
|
|
3044
|
+
dts: import_outdent42.default`
|
|
3030
3045
|
export * from './factory'
|
|
3031
|
-
${
|
|
3046
|
+
${isValidProp?.dts ? `export * from './is-valid-prop'` : ""}
|
|
3047
|
+
${import_outdent42.default.string(patterns.map((file) => `export * from './${file.name}'`).join("\n"))}
|
|
3032
3048
|
export type { ${ctx.jsx.typeName} } from '../types/jsx'
|
|
3033
3049
|
`
|
|
3034
3050
|
};
|
|
@@ -3038,6 +3054,7 @@ function setupJsx(ctx) {
|
|
|
3038
3054
|
...patterns.map((file) => ({ file: ctx.file.ext(file.name), code: file.js })),
|
|
3039
3055
|
...patterns.map((file) => ({ file: `${file.name}.d.ts`, code: file.dts })),
|
|
3040
3056
|
{ file: ctx.file.ext("is-valid-prop"), code: isValidProp?.js },
|
|
3057
|
+
{ file: "is-valid-prop.d.ts", code: isValidProp?.dts },
|
|
3041
3058
|
{ file: "factory.d.ts", code: types.jsxFactory },
|
|
3042
3059
|
{ file: ctx.file.ext("factory"), code: factory?.js },
|
|
3043
3060
|
{ file: "index.d.ts", code: index.dts },
|
|
@@ -3047,12 +3064,12 @@ function setupJsx(ctx) {
|
|
|
3047
3064
|
}
|
|
3048
3065
|
function setupCssIndex(ctx) {
|
|
3049
3066
|
const index = {
|
|
3050
|
-
js:
|
|
3067
|
+
js: import_outdent42.default`
|
|
3051
3068
|
${ctx.file.export("./css")}
|
|
3052
3069
|
${ctx.file.export("./cx")}
|
|
3053
3070
|
${ctx.isTemplateLiteralSyntax ? "" : ctx.file.export("./cva")}
|
|
3054
3071
|
`,
|
|
3055
|
-
dts:
|
|
3072
|
+
dts: import_outdent42.default`
|
|
3056
3073
|
export * from './css'
|
|
3057
3074
|
export * from './cx'
|
|
3058
3075
|
${ctx.isTemplateLiteralSyntax ? "" : `export * from './cva'`}
|
|
@@ -3127,9 +3144,9 @@ var generateFlattenedCss = (ctx) => (options) => {
|
|
|
3127
3144
|
const { theme: { keyframes } = {}, preflight, minify, staticCss } = ctx.config;
|
|
3128
3145
|
const unresolved = [
|
|
3129
3146
|
"@layer reset, base, tokens, recipes, utilities;",
|
|
3147
|
+
preflight && "@import './reset.css';",
|
|
3130
3148
|
"@import './global.css';",
|
|
3131
3149
|
staticCss && "@import './static.css';",
|
|
3132
|
-
preflight && "@import './reset.css';",
|
|
3133
3150
|
!ctx.tokens.isEmpty && "@import './tokens/index.css';",
|
|
3134
3151
|
keyframes && "@import './tokens/keyframes.css';"
|
|
3135
3152
|
].filter(Boolean).join("\n\n");
|
|
@@ -3150,7 +3167,6 @@ var generateFlattenedCss = (ctx) => (options) => {
|
|
|
3150
3167
|
var import_logger2 = require("@pandacss/logger");
|
|
3151
3168
|
var import_func = require("lil-fp/func");
|
|
3152
3169
|
var import_ts_pattern6 = require("ts-pattern");
|
|
3153
|
-
var flattenStyles = (data) => Object.assign({}, data, { css: void 0 }, data.css ?? {});
|
|
3154
3170
|
var generateParserCss = (ctx) => (result) => (0, import_func.pipe)(
|
|
3155
3171
|
{ ...ctx, sheet: ctx.createSheet(), result },
|
|
3156
3172
|
(0, import_func.tap)(({ sheet, result: result2, patterns, recipes }) => {
|
|
@@ -3166,7 +3182,7 @@ var generateParserCss = (ctx) => (result) => (0, import_func.pipe)(
|
|
|
3166
3182
|
});
|
|
3167
3183
|
result2.jsx.forEach((jsx) => {
|
|
3168
3184
|
jsx.data.forEach((data) => {
|
|
3169
|
-
sheet.
|
|
3185
|
+
sheet.processStyleProps(data);
|
|
3170
3186
|
});
|
|
3171
3187
|
});
|
|
3172
3188
|
result2.recipe.forEach((recipeSet, name) => {
|
|
@@ -3177,8 +3193,8 @@ var generateParserCss = (ctx) => (result) => (0, import_func.pipe)(
|
|
|
3177
3193
|
continue;
|
|
3178
3194
|
(0, import_ts_pattern6.match)(recipe).with({ type: "jsx-recipe", name: import_ts_pattern6.P.string }, ({ name: name2 }) => {
|
|
3179
3195
|
recipe.data.forEach((data) => {
|
|
3180
|
-
const [recipeProps, styleProps] = recipes.splitProps(name2,
|
|
3181
|
-
sheet.
|
|
3196
|
+
const [recipeProps, styleProps] = recipes.splitProps(name2, data);
|
|
3197
|
+
sheet.processStyleProps(styleProps);
|
|
3182
3198
|
sheet.processRecipe(recipeConfig, recipeProps);
|
|
3183
3199
|
});
|
|
3184
3200
|
}).otherwise(() => {
|
|
@@ -3197,8 +3213,8 @@ var generateParserCss = (ctx) => (result) => (0, import_func.pipe)(
|
|
|
3197
3213
|
(0, import_ts_pattern6.match)(pattern).with({ type: "jsx-pattern", name: import_ts_pattern6.P.string }, ({ name: name2 }) => {
|
|
3198
3214
|
pattern.data.forEach((data) => {
|
|
3199
3215
|
const fnName = patterns.getFnName(name2);
|
|
3200
|
-
const styleProps = patterns.transform(fnName,
|
|
3201
|
-
sheet.
|
|
3216
|
+
const styleProps = patterns.transform(fnName, data);
|
|
3217
|
+
sheet.processStyleProps(styleProps);
|
|
3202
3218
|
});
|
|
3203
3219
|
}).otherwise(() => {
|
|
3204
3220
|
pattern.data.forEach((data) => {
|
|
@@ -3431,25 +3447,30 @@ var getImportMap = (outdir) => ({
|
|
|
3431
3447
|
pattern: `${outdir}/patterns`,
|
|
3432
3448
|
jsx: `${outdir}/jsx`
|
|
3433
3449
|
});
|
|
3434
|
-
var createGenerator = (conf) =>
|
|
3435
|
-
getEngine(defaults(conf))
|
|
3436
|
-
|
|
3450
|
+
var createGenerator = (conf) => {
|
|
3451
|
+
const ctx = getEngine(defaults(conf));
|
|
3452
|
+
const { config, jsx, isValidProperty, patterns, recipes } = ctx;
|
|
3453
|
+
const compilerOptions = conf.tsconfig?.compilerOptions ?? {};
|
|
3454
|
+
const baseUrl = compilerOptions.baseUrl ?? "";
|
|
3455
|
+
const cwd = conf.config.cwd;
|
|
3456
|
+
const relativeBaseUrl = baseUrl ? baseUrl.replace(cwd, "").slice(1) + "/" : cwd;
|
|
3457
|
+
return {
|
|
3458
|
+
...ctx,
|
|
3437
3459
|
getArtifacts: generateArtifacts(ctx),
|
|
3438
3460
|
getCss: generateFlattenedCss(ctx),
|
|
3439
3461
|
getParserCss: generateParserCss(ctx),
|
|
3440
|
-
messages: getMessages(ctx)
|
|
3441
|
-
|
|
3442
|
-
|
|
3443
|
-
|
|
3444
|
-
|
|
3445
|
-
|
|
3446
|
-
|
|
3447
|
-
|
|
3448
|
-
|
|
3449
|
-
|
|
3450
|
-
|
|
3451
|
-
|
|
3452
|
-
);
|
|
3462
|
+
messages: getMessages(ctx),
|
|
3463
|
+
parserOptions: {
|
|
3464
|
+
importMap: getImportMap(config.outdir.replace(relativeBaseUrl, "")),
|
|
3465
|
+
jsx: {
|
|
3466
|
+
factory: jsx.factoryName,
|
|
3467
|
+
isStyleProp: isValidProperty,
|
|
3468
|
+
nodes: [...patterns.nodes, ...recipes.nodes]
|
|
3469
|
+
},
|
|
3470
|
+
getRecipesByJsxName: recipes.filter
|
|
3471
|
+
}
|
|
3472
|
+
};
|
|
3473
|
+
};
|
|
3453
3474
|
// Annotate the CommonJS export names for ESM import in node:
|
|
3454
3475
|
0 && (module.exports = {
|
|
3455
3476
|
createGenerator,
|