@plumeria/turbopack-loader 9.1.2 → 10.0.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.js +701 -508
- package/package.json +2 -2
package/dist/index.js
CHANGED
|
@@ -249,6 +249,8 @@ async function loader(source) {
|
|
|
249
249
|
if (obj) {
|
|
250
250
|
const hashMap = {};
|
|
251
251
|
Object.entries(obj).forEach(([key, style]) => {
|
|
252
|
+
if (typeof style !== 'object' || style === null)
|
|
253
|
+
return;
|
|
252
254
|
const records = (0, utils_1.getStyleRecords)(style);
|
|
253
255
|
if (!isProduction) {
|
|
254
256
|
(0, utils_1.extractOndemandStyles)(style, extractedSheets, scannedTables);
|
|
@@ -260,6 +262,57 @@ async function loader(source) {
|
|
|
260
262
|
records.forEach((r) => (atomMap[r.key] = r.hash));
|
|
261
263
|
hashMap[key] = atomMap;
|
|
262
264
|
});
|
|
265
|
+
const objExpr = node.init.arguments[0].expression;
|
|
266
|
+
objExpr.properties.forEach((prop) => {
|
|
267
|
+
if (prop.type !== 'KeyValueProperty' ||
|
|
268
|
+
prop.key.type !== 'Identifier')
|
|
269
|
+
return;
|
|
270
|
+
const isArrow = prop.value.type === 'ArrowFunctionExpression';
|
|
271
|
+
const isFunc = prop.value.type === 'FunctionExpression';
|
|
272
|
+
if (!isArrow && !isFunc)
|
|
273
|
+
return;
|
|
274
|
+
const key = prop.key.value;
|
|
275
|
+
const params = prop.value.params.map((p) => p.type === 'Identifier' ? p.value : (p.pat?.value ?? 'arg'));
|
|
276
|
+
const cssVarInfo = {};
|
|
277
|
+
const tempStaticTable = { ...mergedStaticTable };
|
|
278
|
+
const substitutedArgs = params.map((paramName) => {
|
|
279
|
+
const cssVar = `--${key}-${paramName}`;
|
|
280
|
+
cssVarInfo[paramName] = { cssVar, propKey: '' };
|
|
281
|
+
return `var(${cssVar})`;
|
|
282
|
+
});
|
|
283
|
+
params.forEach((paramName, i) => {
|
|
284
|
+
tempStaticTable[paramName] = substitutedArgs[i];
|
|
285
|
+
});
|
|
286
|
+
let actualBody = prop.value.body;
|
|
287
|
+
if (actualBody?.type === 'ParenthesisExpression')
|
|
288
|
+
actualBody = actualBody.expression;
|
|
289
|
+
if (actualBody?.type === 'BlockStatement') {
|
|
290
|
+
const first = actualBody.stmts?.[0];
|
|
291
|
+
if (first?.type === 'ReturnStatement')
|
|
292
|
+
actualBody = first.argument;
|
|
293
|
+
if (actualBody?.type === 'ParenthesisExpression')
|
|
294
|
+
actualBody = actualBody.expression;
|
|
295
|
+
}
|
|
296
|
+
if (!actualBody || actualBody.type !== 'ObjectExpression')
|
|
297
|
+
return;
|
|
298
|
+
const substituted = (0, utils_1.objectExpressionToObject)(actualBody, tempStaticTable, mergedKeyframesTable, mergedViewTransitionTable, mergedCreateThemeHashTable, scannedTables.createThemeObjectTable, mergedCreateTable, mergedCreateStaticHashTable, scannedTables.createStaticObjectTable, mergedVariantsTable);
|
|
299
|
+
if (!substituted)
|
|
300
|
+
return;
|
|
301
|
+
for (const [, info] of Object.entries(cssVarInfo)) {
|
|
302
|
+
const cssVar = info.cssVar;
|
|
303
|
+
const propKey = Object.keys(substituted).find((k) => typeof substituted[k] === 'string' &&
|
|
304
|
+
substituted[k].includes(cssVar));
|
|
305
|
+
if (propKey) {
|
|
306
|
+
info.propKey = propKey;
|
|
307
|
+
}
|
|
308
|
+
}
|
|
309
|
+
const records = (0, utils_1.getStyleRecords)(substituted);
|
|
310
|
+
records.forEach((r) => addSheet(r.sheet));
|
|
311
|
+
const atomMap = {};
|
|
312
|
+
records.forEach((r) => (atomMap[r.key] = r.hash));
|
|
313
|
+
atomMap['__cssVars__'] = JSON.stringify(cssVarInfo);
|
|
314
|
+
hashMap[key] = atomMap;
|
|
315
|
+
});
|
|
263
316
|
if (utils_1.t.isIdentifier(node.id)) {
|
|
264
317
|
idSpans.add(node.id.span.start);
|
|
265
318
|
}
|
|
@@ -446,7 +499,11 @@ async function loader(source) {
|
|
|
446
499
|
}
|
|
447
500
|
},
|
|
448
501
|
});
|
|
502
|
+
const jsxOpeningElementMap = new Map();
|
|
449
503
|
(0, utils_1.traverse)(ast, {
|
|
504
|
+
JSXOpeningElement({ node }) {
|
|
505
|
+
jsxOpeningElementMap.set(node.span.start, node.attributes);
|
|
506
|
+
},
|
|
450
507
|
MemberExpression({ node }) {
|
|
451
508
|
if (utils_1.t.isIdentifier(node.object) && utils_1.t.isIdentifier(node.property)) {
|
|
452
509
|
const varName = node.object.value;
|
|
@@ -465,7 +522,7 @@ async function loader(source) {
|
|
|
465
522
|
replacements.push({
|
|
466
523
|
start: node.span.start - baseByteOffset,
|
|
467
524
|
end: node.span.end - baseByteOffset,
|
|
468
|
-
content: JSON.stringify(atomMap)
|
|
525
|
+
content: `(${JSON.stringify(atomMap)})`,
|
|
469
526
|
});
|
|
470
527
|
}
|
|
471
528
|
}
|
|
@@ -479,7 +536,7 @@ async function loader(source) {
|
|
|
479
536
|
replacements.push({
|
|
480
537
|
start: node.span.start - baseByteOffset,
|
|
481
538
|
end: node.span.end - baseByteOffset,
|
|
482
|
-
content: JSON.stringify(atomicMap[propName])
|
|
539
|
+
content: `(${JSON.stringify(atomicMap[propName])})`,
|
|
483
540
|
});
|
|
484
541
|
}
|
|
485
542
|
}
|
|
@@ -493,7 +550,7 @@ async function loader(source) {
|
|
|
493
550
|
replacements.push({
|
|
494
551
|
start: node.span.start - baseByteOffset,
|
|
495
552
|
end: node.span.end - baseByteOffset,
|
|
496
|
-
content: JSON.stringify(staticObj[propName])
|
|
553
|
+
content: `(${JSON.stringify(staticObj[propName])})`,
|
|
497
554
|
});
|
|
498
555
|
}
|
|
499
556
|
}
|
|
@@ -509,7 +566,7 @@ async function loader(source) {
|
|
|
509
566
|
replacements.push({
|
|
510
567
|
start: node.span.start - baseByteOffset,
|
|
511
568
|
end: node.span.end - baseByteOffset,
|
|
512
|
-
content: JSON.stringify(styleInfo.hashMap)
|
|
569
|
+
content: `(${JSON.stringify(styleInfo.hashMap)})`,
|
|
513
570
|
});
|
|
514
571
|
return;
|
|
515
572
|
}
|
|
@@ -532,7 +589,7 @@ async function loader(source) {
|
|
|
532
589
|
replacements.push({
|
|
533
590
|
start: node.span.start - baseByteOffset,
|
|
534
591
|
end: node.span.end - baseByteOffset,
|
|
535
|
-
content: JSON.stringify(hashMap)
|
|
592
|
+
content: `(${JSON.stringify(hashMap)})`,
|
|
536
593
|
});
|
|
537
594
|
}
|
|
538
595
|
}
|
|
@@ -546,7 +603,7 @@ async function loader(source) {
|
|
|
546
603
|
replacements.push({
|
|
547
604
|
start: node.span.start - baseByteOffset,
|
|
548
605
|
end: node.span.end - baseByteOffset,
|
|
549
|
-
content: JSON.stringify(atomicMap)
|
|
606
|
+
content: `(${JSON.stringify(atomicMap)})`,
|
|
550
607
|
});
|
|
551
608
|
return;
|
|
552
609
|
}
|
|
@@ -561,589 +618,725 @@ async function loader(source) {
|
|
|
561
618
|
replacements.push({
|
|
562
619
|
start: node.span.start - baseByteOffset,
|
|
563
620
|
end: node.span.end - baseByteOffset,
|
|
564
|
-
content: JSON.stringify(staticObj)
|
|
621
|
+
content: `(${JSON.stringify(staticObj)})`,
|
|
565
622
|
});
|
|
566
623
|
}
|
|
567
624
|
}
|
|
568
625
|
},
|
|
569
|
-
|
|
570
|
-
|
|
571
|
-
|
|
572
|
-
if (
|
|
573
|
-
|
|
574
|
-
|
|
575
|
-
|
|
576
|
-
|
|
577
|
-
|
|
578
|
-
|
|
579
|
-
|
|
626
|
+
JSXAttribute({ node }) {
|
|
627
|
+
if (node.name.type !== 'Identifier' || node.name.value !== 'styleName')
|
|
628
|
+
return;
|
|
629
|
+
if (!node.value || node.value.type !== 'JSXExpressionContainer')
|
|
630
|
+
return;
|
|
631
|
+
const expr = node.value.expression;
|
|
632
|
+
const args = expr.type === 'ArrayExpression'
|
|
633
|
+
? expr.elements
|
|
634
|
+
.filter(Boolean)
|
|
635
|
+
.map((el) => ({ expression: el.expression ?? el }))
|
|
636
|
+
: [{ expression: expr }];
|
|
637
|
+
const dynamicClassParts = [];
|
|
638
|
+
const dynamicStyleParts = [];
|
|
639
|
+
let attributes = [];
|
|
640
|
+
for (const [, attrs] of jsxOpeningElementMap) {
|
|
641
|
+
const found = attrs.find((a) => a.span?.start === node.span.start);
|
|
642
|
+
if (found) {
|
|
643
|
+
attributes = attrs;
|
|
644
|
+
break;
|
|
580
645
|
}
|
|
581
646
|
}
|
|
582
|
-
|
|
583
|
-
|
|
584
|
-
|
|
585
|
-
|
|
586
|
-
|
|
647
|
+
const classNameAttr = attributes.find((attr) => attr.name?.value === 'className');
|
|
648
|
+
let existingClass = '';
|
|
649
|
+
if (classNameAttr?.value?.type === 'StringLiteral') {
|
|
650
|
+
existingClass = classNameAttr.value.value;
|
|
651
|
+
replacements.push({
|
|
652
|
+
start: classNameAttr.span.start - baseByteOffset,
|
|
653
|
+
end: classNameAttr.span.end - baseByteOffset,
|
|
654
|
+
content: '',
|
|
655
|
+
});
|
|
656
|
+
}
|
|
657
|
+
const styleAttrExisting = attributes.find((attr) => attr.name?.value === 'style');
|
|
658
|
+
if (styleAttrExisting) {
|
|
659
|
+
replacements.push({
|
|
660
|
+
start: styleAttrExisting.span.start - baseByteOffset,
|
|
661
|
+
end: styleAttrExisting.span.end - baseByteOffset,
|
|
662
|
+
content: '',
|
|
663
|
+
});
|
|
664
|
+
const innerExpr = styleAttrExisting.value?.expression;
|
|
665
|
+
if (innerExpr?.type === 'ObjectExpression') {
|
|
666
|
+
const start = innerExpr.span.start - baseByteOffset;
|
|
667
|
+
const end = innerExpr.span.end - baseByteOffset;
|
|
668
|
+
const innerSource = sourceBuffer
|
|
669
|
+
.subarray(start, end)
|
|
670
|
+
.toString('utf-8');
|
|
671
|
+
const stripped = innerSource.slice(1, -1).trim();
|
|
672
|
+
if (stripped)
|
|
673
|
+
dynamicStyleParts.push(stripped);
|
|
587
674
|
}
|
|
588
675
|
}
|
|
589
|
-
|
|
590
|
-
|
|
591
|
-
|
|
592
|
-
|
|
593
|
-
|
|
676
|
+
const resolveStyleObject = (expr) => {
|
|
677
|
+
if (utils_1.t.isObjectExpression(expr)) {
|
|
678
|
+
return (0, utils_1.objectExpressionToObject)(expr, mergedStaticTable, mergedKeyframesTable, mergedViewTransitionTable, mergedCreateThemeHashTable, scannedTables.createThemeObjectTable, mergedCreateTable, mergedCreateStaticHashTable, scannedTables.createStaticObjectTable, mergedVariantsTable);
|
|
679
|
+
}
|
|
680
|
+
else if (utils_1.t.isMemberExpression(expr) &&
|
|
681
|
+
utils_1.t.isIdentifier(expr.object) &&
|
|
682
|
+
(utils_1.t.isIdentifier(expr.property) ||
|
|
683
|
+
expr.property.type === 'Computed')) {
|
|
684
|
+
if (expr.property.type === 'Computed') {
|
|
685
|
+
return {};
|
|
594
686
|
}
|
|
595
|
-
|
|
596
|
-
|
|
597
|
-
|
|
598
|
-
|
|
599
|
-
|
|
600
|
-
|
|
687
|
+
const varName = expr.object.value;
|
|
688
|
+
const propName = expr.property.value;
|
|
689
|
+
const styleInfo = localCreateStyles[varName];
|
|
690
|
+
if (styleInfo && styleInfo.obj[propName]) {
|
|
691
|
+
const style = styleInfo.obj[propName];
|
|
692
|
+
if (typeof style === 'object' && style !== null) {
|
|
693
|
+
return style;
|
|
601
694
|
}
|
|
602
|
-
|
|
603
|
-
|
|
604
|
-
|
|
605
|
-
|
|
606
|
-
|
|
695
|
+
}
|
|
696
|
+
const hash = mergedCreateTable[varName];
|
|
697
|
+
if (hash) {
|
|
698
|
+
const obj = scannedTables.createObjectTable[hash];
|
|
699
|
+
if (obj && obj[propName]) {
|
|
700
|
+
const style = obj[propName];
|
|
607
701
|
if (typeof style === 'object' && style !== null) {
|
|
608
702
|
return style;
|
|
609
703
|
}
|
|
610
704
|
}
|
|
611
|
-
const hash = mergedCreateTable[varName];
|
|
612
|
-
if (hash) {
|
|
613
|
-
const obj = scannedTables.createObjectTable[hash];
|
|
614
|
-
if (obj && obj[propName]) {
|
|
615
|
-
const style = obj[propName];
|
|
616
|
-
if (typeof style === 'object' && style !== null) {
|
|
617
|
-
return style;
|
|
618
|
-
}
|
|
619
|
-
}
|
|
620
|
-
}
|
|
621
705
|
}
|
|
622
|
-
|
|
623
|
-
|
|
624
|
-
|
|
625
|
-
|
|
626
|
-
|
|
627
|
-
|
|
628
|
-
|
|
629
|
-
|
|
630
|
-
|
|
631
|
-
|
|
632
|
-
|
|
633
|
-
|
|
706
|
+
}
|
|
707
|
+
else if (utils_1.t.isIdentifier(expr)) {
|
|
708
|
+
const varName = expr.value;
|
|
709
|
+
const uniqueKey = `${resourcePath}-${varName}`;
|
|
710
|
+
let hash = scannedTables.createHashTable[uniqueKey];
|
|
711
|
+
if (!hash) {
|
|
712
|
+
hash = mergedCreateTable[varName];
|
|
713
|
+
}
|
|
714
|
+
if (hash) {
|
|
715
|
+
const obj = scannedTables.createObjectTable[hash];
|
|
716
|
+
if (obj && typeof obj === 'object') {
|
|
717
|
+
return obj;
|
|
634
718
|
}
|
|
719
|
+
}
|
|
720
|
+
const styleInfo = localCreateStyles[varName];
|
|
721
|
+
if (styleInfo && styleInfo.obj) {
|
|
722
|
+
return styleInfo.obj;
|
|
723
|
+
}
|
|
724
|
+
if (localCreateStyles[varName]) {
|
|
725
|
+
return localCreateStyles[varName].obj;
|
|
726
|
+
}
|
|
727
|
+
const vHash = mergedVariantsTable[varName];
|
|
728
|
+
if (vHash) {
|
|
729
|
+
return scannedTables.variantsObjectTable[vHash];
|
|
730
|
+
}
|
|
731
|
+
}
|
|
732
|
+
return null;
|
|
733
|
+
};
|
|
734
|
+
const conditionals = [];
|
|
735
|
+
let groupIdCounter = 0;
|
|
736
|
+
let baseStyle = {};
|
|
737
|
+
let isOptimizable = true;
|
|
738
|
+
for (const arg of args) {
|
|
739
|
+
const expr = arg.expression;
|
|
740
|
+
if (utils_1.t.isCallExpression(expr) &&
|
|
741
|
+
utils_1.t.isMemberExpression(expr.callee)) {
|
|
742
|
+
const callee = expr.callee;
|
|
743
|
+
if (utils_1.t.isIdentifier(callee.object) &&
|
|
744
|
+
utils_1.t.isIdentifier(callee.property)) {
|
|
745
|
+
const varName = callee.object.value;
|
|
746
|
+
const propKey = callee.property.value;
|
|
635
747
|
const styleInfo = localCreateStyles[varName];
|
|
636
|
-
|
|
637
|
-
|
|
638
|
-
|
|
639
|
-
|
|
640
|
-
|
|
641
|
-
|
|
642
|
-
|
|
643
|
-
|
|
644
|
-
|
|
748
|
+
const atomMap = styleInfo?.hashMap?.[propKey];
|
|
749
|
+
if (atomMap?.['__cssVars__']) {
|
|
750
|
+
const cssVarInfo = JSON.parse(atomMap['__cssVars__']);
|
|
751
|
+
const hashes = Object.entries(atomMap)
|
|
752
|
+
.filter(([k]) => k !== '__cssVars__')
|
|
753
|
+
.map(([, v]) => v)
|
|
754
|
+
.join(' ');
|
|
755
|
+
if (hashes)
|
|
756
|
+
dynamicClassParts.push(JSON.stringify(hashes));
|
|
757
|
+
const args = expr.arguments;
|
|
758
|
+
Object.entries(cssVarInfo).forEach(([_, { cssVar, propKey: targetProp }], i) => {
|
|
759
|
+
const callArg = args[i];
|
|
760
|
+
if (!callArg)
|
|
761
|
+
return;
|
|
762
|
+
const argStart = callArg.expression.span.start - baseByteOffset;
|
|
763
|
+
const argEnd = callArg.expression.span.end - baseByteOffset;
|
|
764
|
+
const argSource = sourceBuffer
|
|
765
|
+
.subarray(argStart, argEnd)
|
|
766
|
+
.toString('utf-8');
|
|
767
|
+
let valueExpr;
|
|
768
|
+
try {
|
|
769
|
+
const maybeNumber = Number(argSource);
|
|
770
|
+
if (!isNaN(maybeNumber) &&
|
|
771
|
+
argSource.trim() === String(maybeNumber)) {
|
|
772
|
+
const processed = (0, zss_engine_1.applyCssValue)(maybeNumber, targetProp);
|
|
773
|
+
valueExpr = JSON.stringify(processed);
|
|
774
|
+
}
|
|
775
|
+
else if (argSource.startsWith('"') &&
|
|
776
|
+
argSource.endsWith('"')) {
|
|
777
|
+
const processed = (0, zss_engine_1.applyCssValue)(argSource.slice(1, -1), targetProp);
|
|
778
|
+
valueExpr = JSON.stringify(processed);
|
|
779
|
+
}
|
|
780
|
+
else {
|
|
781
|
+
const exception = [
|
|
782
|
+
'animationIterationCount',
|
|
783
|
+
'aspectRatio',
|
|
784
|
+
'columnCount',
|
|
785
|
+
'columns',
|
|
786
|
+
'fillOpacity',
|
|
787
|
+
'flex',
|
|
788
|
+
'flexGrow',
|
|
789
|
+
'flexShrink',
|
|
790
|
+
'floodOpacity',
|
|
791
|
+
'fontSizeAdjust',
|
|
792
|
+
'fontWeight',
|
|
793
|
+
'gridColumn',
|
|
794
|
+
'gridColumnEnd',
|
|
795
|
+
'gridColumnStart',
|
|
796
|
+
'gridRow',
|
|
797
|
+
'gridRowEnd',
|
|
798
|
+
'gridRowStart',
|
|
799
|
+
'hyphenateLimitChars',
|
|
800
|
+
'initialLetter',
|
|
801
|
+
'lineHeight',
|
|
802
|
+
'mathDepth',
|
|
803
|
+
'opacity',
|
|
804
|
+
'order',
|
|
805
|
+
'orphans',
|
|
806
|
+
'scale',
|
|
807
|
+
'shapeImageThreshold',
|
|
808
|
+
'stopOpacity',
|
|
809
|
+
'strokeMiterlimit',
|
|
810
|
+
'strokeOpacity',
|
|
811
|
+
'tabSize',
|
|
812
|
+
'widows',
|
|
813
|
+
'zIndex',
|
|
814
|
+
'zoom',
|
|
815
|
+
];
|
|
816
|
+
if (!exception.includes(targetProp)) {
|
|
817
|
+
valueExpr = `(typeof ${argSource} === 'number' ? ${argSource} + 'px' : ${argSource})`;
|
|
818
|
+
}
|
|
819
|
+
else {
|
|
820
|
+
valueExpr = argSource;
|
|
821
|
+
}
|
|
822
|
+
}
|
|
823
|
+
}
|
|
824
|
+
catch {
|
|
825
|
+
valueExpr = argSource;
|
|
826
|
+
}
|
|
827
|
+
dynamicStyleParts.push(`"${cssVar}": ${valueExpr}`);
|
|
828
|
+
});
|
|
829
|
+
continue;
|
|
645
830
|
}
|
|
646
831
|
}
|
|
647
|
-
|
|
648
|
-
|
|
649
|
-
|
|
650
|
-
|
|
651
|
-
|
|
652
|
-
|
|
653
|
-
|
|
654
|
-
|
|
655
|
-
|
|
656
|
-
|
|
657
|
-
|
|
658
|
-
|
|
659
|
-
|
|
660
|
-
if (
|
|
661
|
-
|
|
662
|
-
}
|
|
663
|
-
if (hash && scannedTables.variantsObjectTable[hash]) {
|
|
664
|
-
variantObj = scannedTables.variantsObjectTable[hash];
|
|
665
|
-
}
|
|
666
|
-
if (!variantObj) {
|
|
667
|
-
if (localCreateStyles[varName] &&
|
|
668
|
-
localCreateStyles[varName].obj) {
|
|
669
|
-
variantObj = localCreateStyles[varName].obj;
|
|
670
|
-
}
|
|
832
|
+
}
|
|
833
|
+
if (utils_1.t.isCallExpression(expr) && utils_1.t.isIdentifier(expr.callee)) {
|
|
834
|
+
const varName = expr.callee.value;
|
|
835
|
+
let variantObj;
|
|
836
|
+
const uniqueKey = `${resourcePath}-${varName}`;
|
|
837
|
+
let hash = scannedTables.variantsHashTable[uniqueKey];
|
|
838
|
+
if (!hash) {
|
|
839
|
+
hash = mergedVariantsTable[varName];
|
|
840
|
+
}
|
|
841
|
+
if (hash && scannedTables.variantsObjectTable[hash]) {
|
|
842
|
+
variantObj = scannedTables.variantsObjectTable[hash];
|
|
843
|
+
}
|
|
844
|
+
if (!variantObj) {
|
|
845
|
+
if (localCreateStyles[varName] && localCreateStyles[varName].obj) {
|
|
846
|
+
variantObj = localCreateStyles[varName].obj;
|
|
671
847
|
}
|
|
672
|
-
|
|
673
|
-
|
|
674
|
-
|
|
675
|
-
|
|
676
|
-
|
|
677
|
-
|
|
678
|
-
|
|
679
|
-
|
|
680
|
-
|
|
681
|
-
|
|
682
|
-
|
|
683
|
-
|
|
684
|
-
|
|
685
|
-
|
|
686
|
-
|
|
687
|
-
|
|
688
|
-
|
|
689
|
-
|
|
690
|
-
|
|
691
|
-
|
|
692
|
-
|
|
693
|
-
|
|
694
|
-
|
|
695
|
-
|
|
696
|
-
|
|
697
|
-
|
|
698
|
-
|
|
699
|
-
|
|
700
|
-
|
|
701
|
-
|
|
702
|
-
|
|
703
|
-
continue;
|
|
848
|
+
}
|
|
849
|
+
if (variantObj) {
|
|
850
|
+
const callArgs = expr.arguments;
|
|
851
|
+
if (callArgs.length === 1 && !callArgs[0].spread) {
|
|
852
|
+
const arg = callArgs[0].expression;
|
|
853
|
+
if (arg.type === 'ObjectExpression') {
|
|
854
|
+
for (const prop of arg.properties) {
|
|
855
|
+
let groupName;
|
|
856
|
+
let valExpr;
|
|
857
|
+
if (prop.type === 'KeyValueProperty' &&
|
|
858
|
+
prop.key.type === 'Identifier') {
|
|
859
|
+
groupName = prop.key.value;
|
|
860
|
+
valExpr = prop.value;
|
|
861
|
+
}
|
|
862
|
+
else if (prop.type === 'Identifier') {
|
|
863
|
+
groupName = prop.value;
|
|
864
|
+
valExpr = prop;
|
|
865
|
+
}
|
|
866
|
+
if (groupName && valExpr) {
|
|
867
|
+
const groupVariants = variantObj[groupName];
|
|
868
|
+
if (!groupVariants)
|
|
869
|
+
continue;
|
|
870
|
+
const currentGroupId = ++groupIdCounter;
|
|
871
|
+
const valStart = valExpr.span.start - baseByteOffset;
|
|
872
|
+
const valEnd = valExpr.span.end - baseByteOffset;
|
|
873
|
+
const valSource = sourceBuffer
|
|
874
|
+
.subarray(valStart, valEnd)
|
|
875
|
+
.toString('utf-8');
|
|
876
|
+
if (valExpr.type === 'StringLiteral') {
|
|
877
|
+
if (groupVariants[valExpr.value]) {
|
|
878
|
+
baseStyle = (0, utils_1.deepMerge)(baseStyle, groupVariants[valExpr.value]);
|
|
704
879
|
}
|
|
705
|
-
|
|
706
|
-
conditionals.push({
|
|
707
|
-
test: valExpr,
|
|
708
|
-
testLHS: valSource,
|
|
709
|
-
testString: `${valSource} === '${optionName}'`,
|
|
710
|
-
truthy: style,
|
|
711
|
-
falsy: {},
|
|
712
|
-
groupId: currentGroupId,
|
|
713
|
-
groupName,
|
|
714
|
-
valueName: optionName,
|
|
715
|
-
varName,
|
|
716
|
-
});
|
|
717
|
-
});
|
|
880
|
+
continue;
|
|
718
881
|
}
|
|
882
|
+
Object.entries(groupVariants).forEach(([optionName, style]) => {
|
|
883
|
+
conditionals.push({
|
|
884
|
+
test: valExpr,
|
|
885
|
+
testLHS: valSource,
|
|
886
|
+
testString: `${valSource} === '${optionName}'`,
|
|
887
|
+
truthy: style,
|
|
888
|
+
falsy: {},
|
|
889
|
+
groupId: currentGroupId,
|
|
890
|
+
groupName,
|
|
891
|
+
valueName: optionName,
|
|
892
|
+
varName,
|
|
893
|
+
});
|
|
894
|
+
});
|
|
719
895
|
}
|
|
720
|
-
continue;
|
|
721
896
|
}
|
|
722
|
-
|
|
723
|
-
|
|
724
|
-
|
|
725
|
-
|
|
726
|
-
|
|
727
|
-
|
|
728
|
-
|
|
729
|
-
|
|
730
|
-
|
|
731
|
-
|
|
897
|
+
continue;
|
|
898
|
+
}
|
|
899
|
+
const argStart = arg.span.start - baseByteOffset;
|
|
900
|
+
const argEnd = arg.span.end - baseByteOffset;
|
|
901
|
+
const argSource = sourceBuffer
|
|
902
|
+
.subarray(argStart, argEnd)
|
|
903
|
+
.toString('utf-8');
|
|
904
|
+
if (utils_1.t.isStringLiteral(arg)) {
|
|
905
|
+
if (variantObj[arg.value]) {
|
|
906
|
+
baseStyle = (0, utils_1.deepMerge)(baseStyle, variantObj[arg.value]);
|
|
732
907
|
}
|
|
733
|
-
const currentGroupId = ++groupIdCounter;
|
|
734
|
-
Object.entries(variantObj).forEach(([key, style]) => {
|
|
735
|
-
conditionals.push({
|
|
736
|
-
test: arg,
|
|
737
|
-
testLHS: argSource,
|
|
738
|
-
testString: `${argSource} === '${key}'`,
|
|
739
|
-
truthy: style,
|
|
740
|
-
falsy: {},
|
|
741
|
-
groupId: currentGroupId,
|
|
742
|
-
groupName: undefined,
|
|
743
|
-
valueName: key,
|
|
744
|
-
varName,
|
|
745
|
-
});
|
|
746
|
-
});
|
|
747
908
|
continue;
|
|
748
909
|
}
|
|
749
|
-
|
|
750
|
-
|
|
910
|
+
const currentGroupId = ++groupIdCounter;
|
|
911
|
+
Object.entries(variantObj).forEach(([key, style]) => {
|
|
912
|
+
conditionals.push({
|
|
913
|
+
test: arg,
|
|
914
|
+
testLHS: argSource,
|
|
915
|
+
testString: `${argSource} === '${key}'`,
|
|
916
|
+
truthy: style,
|
|
917
|
+
falsy: {},
|
|
918
|
+
groupId: currentGroupId,
|
|
919
|
+
groupName: undefined,
|
|
920
|
+
valueName: key,
|
|
921
|
+
varName,
|
|
922
|
+
});
|
|
923
|
+
});
|
|
924
|
+
continue;
|
|
751
925
|
}
|
|
926
|
+
isOptimizable = false;
|
|
927
|
+
break;
|
|
752
928
|
}
|
|
753
|
-
|
|
754
|
-
|
|
755
|
-
|
|
756
|
-
|
|
757
|
-
|
|
758
|
-
|
|
759
|
-
|
|
760
|
-
|
|
761
|
-
|
|
762
|
-
|
|
763
|
-
|
|
764
|
-
|
|
765
|
-
|
|
766
|
-
|
|
767
|
-
|
|
768
|
-
}
|
|
929
|
+
}
|
|
930
|
+
else if (utils_1.t.isIdentifier(expr)) {
|
|
931
|
+
const varName = expr.value;
|
|
932
|
+
let variantObj;
|
|
933
|
+
const uniqueKey = `${resourcePath}-${varName}`;
|
|
934
|
+
let hash = scannedTables.variantsHashTable[uniqueKey];
|
|
935
|
+
if (!hash) {
|
|
936
|
+
hash = mergedVariantsTable[varName];
|
|
937
|
+
}
|
|
938
|
+
if (hash && scannedTables.variantsObjectTable[hash]) {
|
|
939
|
+
variantObj = scannedTables.variantsObjectTable[hash];
|
|
940
|
+
}
|
|
941
|
+
if (!variantObj) {
|
|
942
|
+
if (localCreateStyles[varName] && localCreateStyles[varName].obj) {
|
|
943
|
+
variantObj = localCreateStyles[varName].obj;
|
|
769
944
|
}
|
|
770
|
-
|
|
771
|
-
|
|
772
|
-
|
|
773
|
-
|
|
774
|
-
|
|
775
|
-
|
|
776
|
-
|
|
777
|
-
|
|
778
|
-
|
|
779
|
-
|
|
780
|
-
|
|
781
|
-
|
|
782
|
-
|
|
783
|
-
|
|
784
|
-
|
|
785
|
-
|
|
786
|
-
|
|
945
|
+
}
|
|
946
|
+
if (variantObj) {
|
|
947
|
+
Object.entries(variantObj).forEach(([groupName, groupVariants]) => {
|
|
948
|
+
if (!groupVariants)
|
|
949
|
+
return;
|
|
950
|
+
const currentGroupId = ++groupIdCounter;
|
|
951
|
+
Object.entries(groupVariants).forEach(([optionName, style]) => {
|
|
952
|
+
conditionals.push({
|
|
953
|
+
test: expr,
|
|
954
|
+
testLHS: `props["${groupName}"]`,
|
|
955
|
+
testString: `props["${groupName}"] === '${optionName}'`,
|
|
956
|
+
truthy: style,
|
|
957
|
+
falsy: {},
|
|
958
|
+
groupId: currentGroupId,
|
|
959
|
+
groupName: groupName,
|
|
960
|
+
valueName: optionName,
|
|
961
|
+
varName: varName,
|
|
787
962
|
});
|
|
788
963
|
});
|
|
789
|
-
|
|
964
|
+
});
|
|
965
|
+
continue;
|
|
966
|
+
}
|
|
967
|
+
}
|
|
968
|
+
const getSource = (node) => {
|
|
969
|
+
const start = node.span.start - baseByteOffset;
|
|
970
|
+
const end = node.span.end - baseByteOffset;
|
|
971
|
+
return sourceBuffer.subarray(start, end).toString('utf-8');
|
|
972
|
+
};
|
|
973
|
+
const collectConditions = (node, currentTestStrings = []) => {
|
|
974
|
+
const staticStyle = resolveStyleObject(node);
|
|
975
|
+
if (staticStyle) {
|
|
976
|
+
if (currentTestStrings.length === 0) {
|
|
977
|
+
baseStyle = (0, utils_1.deepMerge)(baseStyle, staticStyle);
|
|
978
|
+
}
|
|
979
|
+
else {
|
|
980
|
+
const combinedTest = currentTestStrings.join(' && ');
|
|
981
|
+
conditionals.push({
|
|
982
|
+
test: node,
|
|
983
|
+
testString: combinedTest,
|
|
984
|
+
truthy: staticStyle,
|
|
985
|
+
falsy: {},
|
|
986
|
+
varName: undefined,
|
|
987
|
+
});
|
|
790
988
|
}
|
|
989
|
+
return true;
|
|
791
990
|
}
|
|
792
|
-
|
|
793
|
-
const
|
|
794
|
-
|
|
795
|
-
|
|
796
|
-
|
|
797
|
-
|
|
798
|
-
const staticStyle = resolveStyleObject(node);
|
|
799
|
-
if (staticStyle) {
|
|
800
|
-
if (currentTestStrings.length === 0) {
|
|
801
|
-
baseStyle = (0, utils_1.deepMerge)(baseStyle, staticStyle);
|
|
802
|
-
}
|
|
803
|
-
else {
|
|
804
|
-
const combinedTest = currentTestStrings.join(' && ');
|
|
991
|
+
if (node.type === 'ConditionalExpression') {
|
|
992
|
+
const testSource = getSource(node.test);
|
|
993
|
+
if (currentTestStrings.length === 0) {
|
|
994
|
+
const trueStyle = resolveStyleObject(node.consequent);
|
|
995
|
+
const falseStyle = resolveStyleObject(node.alternate);
|
|
996
|
+
if (trueStyle && falseStyle) {
|
|
805
997
|
conditionals.push({
|
|
806
998
|
test: node,
|
|
807
|
-
testString:
|
|
808
|
-
truthy:
|
|
809
|
-
falsy:
|
|
999
|
+
testString: testSource,
|
|
1000
|
+
truthy: trueStyle,
|
|
1001
|
+
falsy: falseStyle,
|
|
810
1002
|
varName: undefined,
|
|
811
1003
|
});
|
|
1004
|
+
return true;
|
|
812
1005
|
}
|
|
813
|
-
return true;
|
|
814
|
-
}
|
|
815
|
-
if (node.type === 'ConditionalExpression') {
|
|
816
|
-
const testSource = getSource(node.test);
|
|
817
|
-
if (currentTestStrings.length === 0) {
|
|
818
|
-
const trueStyle = resolveStyleObject(node.consequent);
|
|
819
|
-
const falseStyle = resolveStyleObject(node.alternate);
|
|
820
|
-
if (trueStyle && falseStyle) {
|
|
821
|
-
conditionals.push({
|
|
822
|
-
test: node,
|
|
823
|
-
testString: testSource,
|
|
824
|
-
truthy: trueStyle,
|
|
825
|
-
falsy: falseStyle,
|
|
826
|
-
varName: undefined,
|
|
827
|
-
});
|
|
828
|
-
return true;
|
|
829
|
-
}
|
|
830
|
-
}
|
|
831
|
-
collectConditions(node.consequent, [
|
|
832
|
-
...currentTestStrings,
|
|
833
|
-
`(${testSource})`,
|
|
834
|
-
]);
|
|
835
|
-
collectConditions(node.alternate, [
|
|
836
|
-
...currentTestStrings,
|
|
837
|
-
`!(${testSource})`,
|
|
838
|
-
]);
|
|
839
|
-
return true;
|
|
840
1006
|
}
|
|
841
|
-
|
|
842
|
-
|
|
843
|
-
|
|
844
|
-
|
|
845
|
-
|
|
846
|
-
|
|
847
|
-
|
|
848
|
-
|
|
849
|
-
|
|
850
|
-
else if (node.type === 'ParenthesisExpression') {
|
|
851
|
-
return collectConditions(node.expression, currentTestStrings);
|
|
852
|
-
}
|
|
853
|
-
return false;
|
|
854
|
-
};
|
|
855
|
-
const handled = collectConditions(expr);
|
|
856
|
-
if (handled)
|
|
857
|
-
continue;
|
|
858
|
-
isOptimizable = false;
|
|
859
|
-
break;
|
|
860
|
-
}
|
|
861
|
-
if (isOptimizable &&
|
|
862
|
-
(args.length > 0 || Object.keys(baseStyle).length > 0)) {
|
|
863
|
-
if (conditionals.length === 0) {
|
|
864
|
-
const records = (0, utils_1.getStyleRecords)(baseStyle);
|
|
865
|
-
const className = records.map((r) => r.hash).join(' ');
|
|
866
|
-
replacements.push({
|
|
867
|
-
start: node.span.start - baseByteOffset,
|
|
868
|
-
end: node.span.end - baseByteOffset,
|
|
869
|
-
content: JSON.stringify(className),
|
|
870
|
-
});
|
|
1007
|
+
collectConditions(node.consequent, [
|
|
1008
|
+
...currentTestStrings,
|
|
1009
|
+
`(${testSource})`,
|
|
1010
|
+
]);
|
|
1011
|
+
collectConditions(node.alternate, [
|
|
1012
|
+
...currentTestStrings,
|
|
1013
|
+
`!(${testSource})`,
|
|
1014
|
+
]);
|
|
1015
|
+
return true;
|
|
871
1016
|
}
|
|
872
|
-
else
|
|
873
|
-
|
|
874
|
-
const
|
|
875
|
-
|
|
876
|
-
|
|
877
|
-
})
|
|
878
|
-
|
|
879
|
-
|
|
880
|
-
|
|
881
|
-
|
|
882
|
-
|
|
883
|
-
|
|
884
|
-
|
|
885
|
-
|
|
886
|
-
|
|
887
|
-
|
|
888
|
-
|
|
889
|
-
|
|
890
|
-
|
|
891
|
-
|
|
892
|
-
|
|
893
|
-
|
|
894
|
-
|
|
1017
|
+
else if (node.type === 'BinaryExpression' &&
|
|
1018
|
+
node.operator === '&&') {
|
|
1019
|
+
const leftSource = getSource(node.left);
|
|
1020
|
+
collectConditions(node.right, [
|
|
1021
|
+
...currentTestStrings,
|
|
1022
|
+
`(${leftSource})`,
|
|
1023
|
+
]);
|
|
1024
|
+
return true;
|
|
1025
|
+
}
|
|
1026
|
+
else if (node.type === 'ParenthesisExpression') {
|
|
1027
|
+
return collectConditions(node.expression, currentTestStrings);
|
|
1028
|
+
}
|
|
1029
|
+
return false;
|
|
1030
|
+
};
|
|
1031
|
+
const handled = collectConditions(expr);
|
|
1032
|
+
if (handled)
|
|
1033
|
+
continue;
|
|
1034
|
+
isOptimizable = false;
|
|
1035
|
+
break;
|
|
1036
|
+
}
|
|
1037
|
+
const styleAttr = dynamicStyleParts.length > 0
|
|
1038
|
+
? ` style={{${dynamicStyleParts.join(', ')}}}`
|
|
1039
|
+
: '';
|
|
1040
|
+
if (isOptimizable &&
|
|
1041
|
+
(args.length > 0 || Object.keys(baseStyle).length > 0)) {
|
|
1042
|
+
if (conditionals.length === 0) {
|
|
1043
|
+
const records = (0, utils_1.getStyleRecords)(baseStyle);
|
|
1044
|
+
const staticClass = records.map((r) => r.hash).join(' ');
|
|
1045
|
+
const allParts = [
|
|
1046
|
+
...(existingClass ? [JSON.stringify(existingClass)] : []),
|
|
1047
|
+
...(staticClass ? [JSON.stringify(staticClass)] : []),
|
|
1048
|
+
...dynamicClassParts,
|
|
1049
|
+
].join(' + " " + ');
|
|
1050
|
+
replacements.push({
|
|
1051
|
+
start: node.span.start - baseByteOffset,
|
|
1052
|
+
end: node.span.end - baseByteOffset,
|
|
1053
|
+
content: `className={${allParts || '""'}}${styleAttr}`,
|
|
1054
|
+
});
|
|
1055
|
+
}
|
|
1056
|
+
else {
|
|
1057
|
+
const propertyCounts = {};
|
|
1058
|
+
const addCounts = (style) => {
|
|
1059
|
+
Object.keys(style).forEach((key) => {
|
|
1060
|
+
propertyCounts[key] = (propertyCounts[key] || 0) + 1;
|
|
895
1061
|
});
|
|
896
|
-
|
|
897
|
-
|
|
898
|
-
|
|
899
|
-
|
|
900
|
-
|
|
901
|
-
|
|
902
|
-
|
|
1062
|
+
};
|
|
1063
|
+
addCounts(baseStyle);
|
|
1064
|
+
const participation = {};
|
|
1065
|
+
const registerParticipation = (style, sourceId) => {
|
|
1066
|
+
Object.keys(style).forEach((key) => {
|
|
1067
|
+
if (!participation[key])
|
|
1068
|
+
participation[key] = new Set();
|
|
1069
|
+
participation[key].add(sourceId);
|
|
903
1070
|
});
|
|
904
|
-
|
|
905
|
-
|
|
906
|
-
|
|
907
|
-
|
|
908
|
-
|
|
909
|
-
|
|
1071
|
+
};
|
|
1072
|
+
registerParticipation(baseStyle, 'base');
|
|
1073
|
+
conditionals
|
|
1074
|
+
.filter((c) => c.groupId === undefined)
|
|
1075
|
+
.forEach((c, idx) => {
|
|
1076
|
+
const sourceId = `std_${idx}`;
|
|
1077
|
+
registerParticipation(c.truthy, sourceId);
|
|
1078
|
+
registerParticipation(c.falsy, sourceId);
|
|
1079
|
+
});
|
|
1080
|
+
const variantGroups = {};
|
|
1081
|
+
conditionals.forEach((c) => {
|
|
1082
|
+
if (c.groupId !== undefined) {
|
|
1083
|
+
if (!variantGroups[c.groupId])
|
|
1084
|
+
variantGroups[c.groupId] = [];
|
|
1085
|
+
variantGroups[c.groupId].push(c);
|
|
1086
|
+
}
|
|
1087
|
+
});
|
|
1088
|
+
Object.entries(variantGroups).forEach(([groupId, opts]) => {
|
|
1089
|
+
const sourceId = `var_${groupId}`;
|
|
1090
|
+
opts.forEach((opt) => {
|
|
1091
|
+
registerParticipation(opt.truthy, sourceId);
|
|
1092
|
+
registerParticipation(opt.falsy, sourceId);
|
|
910
1093
|
});
|
|
911
|
-
|
|
912
|
-
|
|
913
|
-
|
|
914
|
-
|
|
1094
|
+
});
|
|
1095
|
+
const conflictingKeys = new Set();
|
|
1096
|
+
Object.entries(participation).forEach(([key, sources]) => {
|
|
1097
|
+
if (sources.size > 1) {
|
|
1098
|
+
conflictingKeys.add(key);
|
|
1099
|
+
}
|
|
1100
|
+
});
|
|
1101
|
+
const baseIndependent = {};
|
|
1102
|
+
const baseConflict = {};
|
|
1103
|
+
Object.entries(baseStyle).forEach(([key, val]) => {
|
|
1104
|
+
if (conflictingKeys.has(key)) {
|
|
1105
|
+
baseConflict[key] = val;
|
|
1106
|
+
}
|
|
1107
|
+
else {
|
|
1108
|
+
baseIndependent[key] = val;
|
|
1109
|
+
}
|
|
1110
|
+
});
|
|
1111
|
+
const indepConditionals = [];
|
|
1112
|
+
const conflictConditionals = [];
|
|
1113
|
+
const splitConditional = (c) => {
|
|
1114
|
+
const truthyIndep = {};
|
|
1115
|
+
const truthyConf = {};
|
|
1116
|
+
const falsyIndep = {};
|
|
1117
|
+
const falsyConf = {};
|
|
1118
|
+
let hasIndep = false;
|
|
1119
|
+
let hasConf = false;
|
|
1120
|
+
Object.entries(c.truthy).forEach(([k, v]) => {
|
|
1121
|
+
if (conflictingKeys.has(k)) {
|
|
1122
|
+
truthyConf[k] = v;
|
|
1123
|
+
hasConf = true;
|
|
1124
|
+
}
|
|
1125
|
+
else {
|
|
1126
|
+
truthyIndep[k] = v;
|
|
1127
|
+
hasIndep = true;
|
|
915
1128
|
}
|
|
916
1129
|
});
|
|
917
|
-
|
|
918
|
-
|
|
919
|
-
|
|
920
|
-
|
|
921
|
-
baseConflict[key] = val;
|
|
1130
|
+
Object.entries(c.falsy).forEach(([k, v]) => {
|
|
1131
|
+
if (conflictingKeys.has(k)) {
|
|
1132
|
+
falsyConf[k] = v;
|
|
1133
|
+
hasConf = true;
|
|
922
1134
|
}
|
|
923
1135
|
else {
|
|
924
|
-
|
|
1136
|
+
falsyIndep[k] = v;
|
|
1137
|
+
hasIndep = true;
|
|
925
1138
|
}
|
|
926
1139
|
});
|
|
927
|
-
|
|
928
|
-
|
|
929
|
-
|
|
930
|
-
|
|
931
|
-
|
|
932
|
-
const falsyIndep = {};
|
|
933
|
-
const falsyConf = {};
|
|
934
|
-
let hasIndep = false;
|
|
935
|
-
let hasConf = false;
|
|
936
|
-
Object.entries(c.truthy).forEach(([k, v]) => {
|
|
937
|
-
if (conflictingKeys.has(k)) {
|
|
938
|
-
truthyConf[k] = v;
|
|
939
|
-
hasConf = true;
|
|
940
|
-
}
|
|
941
|
-
else {
|
|
942
|
-
truthyIndep[k] = v;
|
|
943
|
-
hasIndep = true;
|
|
944
|
-
}
|
|
1140
|
+
if (hasIndep) {
|
|
1141
|
+
indepConditionals.push({
|
|
1142
|
+
...c,
|
|
1143
|
+
truthy: truthyIndep,
|
|
1144
|
+
falsy: falsyIndep,
|
|
945
1145
|
});
|
|
946
|
-
|
|
947
|
-
|
|
948
|
-
|
|
949
|
-
|
|
950
|
-
|
|
951
|
-
|
|
952
|
-
falsyIndep[k] = v;
|
|
953
|
-
hasIndep = true;
|
|
954
|
-
}
|
|
1146
|
+
}
|
|
1147
|
+
if (hasConf) {
|
|
1148
|
+
conflictConditionals.push({
|
|
1149
|
+
...c,
|
|
1150
|
+
truthy: truthyConf,
|
|
1151
|
+
falsy: falsyConf,
|
|
955
1152
|
});
|
|
956
|
-
|
|
957
|
-
|
|
958
|
-
|
|
959
|
-
|
|
960
|
-
|
|
961
|
-
|
|
1153
|
+
}
|
|
1154
|
+
};
|
|
1155
|
+
conditionals.forEach(splitConditional);
|
|
1156
|
+
const classParts = [];
|
|
1157
|
+
if (existingClass)
|
|
1158
|
+
classParts.push(JSON.stringify(existingClass));
|
|
1159
|
+
if (Object.keys(baseIndependent).length > 0) {
|
|
1160
|
+
const records = (0, utils_1.getStyleRecords)(baseIndependent);
|
|
1161
|
+
const className = records.map((r) => r.hash).join(' ');
|
|
1162
|
+
if (className)
|
|
1163
|
+
classParts.push(JSON.stringify(className));
|
|
1164
|
+
}
|
|
1165
|
+
const indepStd = indepConditionals.filter((c) => c.groupId === undefined);
|
|
1166
|
+
indepStd.forEach((c) => {
|
|
1167
|
+
const processBranch = (style) => {
|
|
1168
|
+
if (Object.keys(style).length === 0)
|
|
1169
|
+
return '""';
|
|
1170
|
+
const records = (0, utils_1.getStyleRecords)(style);
|
|
1171
|
+
return JSON.stringify(records.map((r) => r.hash).join(' '));
|
|
1172
|
+
};
|
|
1173
|
+
const tClass = processBranch(c.truthy);
|
|
1174
|
+
const fClass = processBranch(c.falsy);
|
|
1175
|
+
let testStr = c.testString;
|
|
1176
|
+
if (!testStr && c.test) {
|
|
1177
|
+
const start = c.test.span.start - baseByteOffset;
|
|
1178
|
+
const end = c.test.span.end - baseByteOffset;
|
|
1179
|
+
testStr = sourceBuffer.subarray(start, end).toString('utf-8');
|
|
1180
|
+
}
|
|
1181
|
+
classParts.push(`(${testStr} ? ${tClass} : ${fClass})`);
|
|
1182
|
+
});
|
|
1183
|
+
const indepVarGroups = {};
|
|
1184
|
+
indepConditionals.forEach((c) => {
|
|
1185
|
+
if (c.groupId !== undefined) {
|
|
1186
|
+
if (!indepVarGroups[c.groupId])
|
|
1187
|
+
indepVarGroups[c.groupId] = [];
|
|
1188
|
+
indepVarGroups[c.groupId].push(c);
|
|
1189
|
+
}
|
|
1190
|
+
});
|
|
1191
|
+
Object.values(indepVarGroups).forEach((options) => {
|
|
1192
|
+
let commonTestExpr = null;
|
|
1193
|
+
const lookupMap = {};
|
|
1194
|
+
if (options.length > 0) {
|
|
1195
|
+
if (options[0].testLHS) {
|
|
1196
|
+
commonTestExpr = options[0].testLHS;
|
|
962
1197
|
}
|
|
963
|
-
if (
|
|
964
|
-
|
|
965
|
-
...c,
|
|
966
|
-
truthy: truthyConf,
|
|
967
|
-
falsy: falsyConf,
|
|
968
|
-
});
|
|
1198
|
+
else if (options[0].testString) {
|
|
1199
|
+
commonTestExpr = options[0].testString;
|
|
969
1200
|
}
|
|
970
|
-
|
|
971
|
-
|
|
972
|
-
|
|
973
|
-
|
|
974
|
-
|
|
975
|
-
|
|
976
|
-
|
|
977
|
-
|
|
1201
|
+
else {
|
|
1202
|
+
const firstTest = options[0].test;
|
|
1203
|
+
const firstStart = firstTest.span.start - baseByteOffset;
|
|
1204
|
+
const firstEnd = firstTest.span.end - baseByteOffset;
|
|
1205
|
+
commonTestExpr = sourceBuffer
|
|
1206
|
+
.subarray(firstStart, firstEnd)
|
|
1207
|
+
.toString('utf-8');
|
|
1208
|
+
}
|
|
1209
|
+
options.forEach((opt) => {
|
|
1210
|
+
if (opt.valueName && opt.truthy) {
|
|
1211
|
+
const records = (0, utils_1.getStyleRecords)(opt.truthy);
|
|
1212
|
+
const className = records.map((r) => r.hash).join(' ');
|
|
1213
|
+
if (className) {
|
|
1214
|
+
lookupMap[opt.valueName] = className;
|
|
1215
|
+
}
|
|
1216
|
+
}
|
|
1217
|
+
});
|
|
978
1218
|
}
|
|
979
|
-
|
|
980
|
-
|
|
981
|
-
|
|
982
|
-
|
|
983
|
-
|
|
984
|
-
|
|
985
|
-
|
|
986
|
-
|
|
987
|
-
|
|
988
|
-
|
|
1219
|
+
if (commonTestExpr && Object.keys(lookupMap).length > 0) {
|
|
1220
|
+
const entries = Object.entries(lookupMap)
|
|
1221
|
+
.map(([key, val]) => `"${key}":"${val}"`)
|
|
1222
|
+
.join(',');
|
|
1223
|
+
classParts.push(`({${entries}}[${commonTestExpr}] || "")`);
|
|
1224
|
+
}
|
|
1225
|
+
});
|
|
1226
|
+
if (Object.keys(baseConflict).length > 0 ||
|
|
1227
|
+
conflictConditionals.length > 0) {
|
|
1228
|
+
const conflictStd = conflictConditionals.filter((c) => c.groupId === undefined);
|
|
1229
|
+
const conflictVarGroups = {};
|
|
1230
|
+
conflictConditionals.forEach((c) => {
|
|
1231
|
+
if (c.groupId !== undefined) {
|
|
1232
|
+
if (!conflictVarGroups[c.groupId])
|
|
1233
|
+
conflictVarGroups[c.groupId] = [];
|
|
1234
|
+
conflictVarGroups[c.groupId].push(c);
|
|
1235
|
+
}
|
|
1236
|
+
});
|
|
1237
|
+
const dimensions = [];
|
|
1238
|
+
conflictStd.forEach((c) => {
|
|
989
1239
|
let testStr = c.testString;
|
|
990
1240
|
if (!testStr && c.test) {
|
|
991
1241
|
const start = c.test.span.start - baseByteOffset;
|
|
992
1242
|
const end = c.test.span.end - baseByteOffset;
|
|
993
1243
|
testStr = sourceBuffer.subarray(start, end).toString('utf-8');
|
|
994
1244
|
}
|
|
995
|
-
|
|
996
|
-
|
|
997
|
-
|
|
998
|
-
|
|
999
|
-
|
|
1000
|
-
|
|
1001
|
-
|
|
1002
|
-
|
|
1003
|
-
}
|
|
1245
|
+
dimensions.push({
|
|
1246
|
+
type: 'std',
|
|
1247
|
+
testExpr: testStr,
|
|
1248
|
+
options: [
|
|
1249
|
+
{ value: 0, style: c.falsy, label: 'false' },
|
|
1250
|
+
{ value: 1, style: c.truthy, label: 'true' },
|
|
1251
|
+
],
|
|
1252
|
+
});
|
|
1004
1253
|
});
|
|
1005
|
-
Object.
|
|
1254
|
+
Object.entries(conflictVarGroups).forEach(([_groupId, opts]) => {
|
|
1006
1255
|
let commonTestExpr = null;
|
|
1007
|
-
|
|
1008
|
-
|
|
1009
|
-
|
|
1010
|
-
commonTestExpr = options[0].testLHS;
|
|
1256
|
+
if (opts.length > 0) {
|
|
1257
|
+
if (opts[0].testLHS) {
|
|
1258
|
+
commonTestExpr = opts[0].testLHS;
|
|
1011
1259
|
}
|
|
1012
|
-
else if (
|
|
1013
|
-
commonTestExpr =
|
|
1260
|
+
else if (opts[0].testString) {
|
|
1261
|
+
commonTestExpr = opts[0].testString;
|
|
1014
1262
|
}
|
|
1015
1263
|
else {
|
|
1016
|
-
const firstTest =
|
|
1264
|
+
const firstTest = opts[0].test;
|
|
1017
1265
|
const firstStart = firstTest.span.start - baseByteOffset;
|
|
1018
1266
|
const firstEnd = firstTest.span.end - baseByteOffset;
|
|
1019
1267
|
commonTestExpr = sourceBuffer
|
|
1020
1268
|
.subarray(firstStart, firstEnd)
|
|
1021
1269
|
.toString('utf-8');
|
|
1022
1270
|
}
|
|
1023
|
-
options.forEach((opt) => {
|
|
1024
|
-
if (opt.valueName && opt.truthy) {
|
|
1025
|
-
const records = (0, utils_1.getStyleRecords)(opt.truthy);
|
|
1026
|
-
const className = records.map((r) => r.hash).join(' ');
|
|
1027
|
-
if (className) {
|
|
1028
|
-
lookupMap[opt.valueName] = className;
|
|
1029
|
-
}
|
|
1030
|
-
}
|
|
1031
|
-
});
|
|
1032
|
-
}
|
|
1033
|
-
if (commonTestExpr && Object.keys(lookupMap).length > 0) {
|
|
1034
|
-
const entries = Object.entries(lookupMap)
|
|
1035
|
-
.map(([key, val]) => `"${key}":"${val}"`)
|
|
1036
|
-
.join(',');
|
|
1037
|
-
classParts.push(`({${entries}}[${commonTestExpr}] || "")`);
|
|
1038
1271
|
}
|
|
1039
|
-
|
|
1040
|
-
|
|
1041
|
-
|
|
1042
|
-
|
|
1043
|
-
|
|
1044
|
-
|
|
1045
|
-
|
|
1046
|
-
|
|
1047
|
-
|
|
1048
|
-
conflictVarGroups[c.groupId].push(c);
|
|
1049
|
-
}
|
|
1050
|
-
});
|
|
1051
|
-
const dimensions = [];
|
|
1052
|
-
conflictStd.forEach((c) => {
|
|
1053
|
-
let testStr = c.testString;
|
|
1054
|
-
if (!testStr && c.test) {
|
|
1055
|
-
const start = c.test.span.start - baseByteOffset;
|
|
1056
|
-
const end = c.test.span.end - baseByteOffset;
|
|
1057
|
-
testStr = sourceBuffer.subarray(start, end).toString('utf-8');
|
|
1058
|
-
}
|
|
1059
|
-
dimensions.push({
|
|
1060
|
-
type: 'std',
|
|
1061
|
-
testExpr: testStr,
|
|
1062
|
-
options: [
|
|
1063
|
-
{ value: 0, style: c.falsy, label: 'false' },
|
|
1064
|
-
{ value: 1, style: c.truthy, label: 'true' },
|
|
1065
|
-
],
|
|
1066
|
-
});
|
|
1272
|
+
const options = opts.map((opt) => ({
|
|
1273
|
+
value: opt.valueName,
|
|
1274
|
+
style: opt.truthy,
|
|
1275
|
+
label: opt.valueName || 'default',
|
|
1276
|
+
}));
|
|
1277
|
+
dimensions.push({
|
|
1278
|
+
type: 'var',
|
|
1279
|
+
testExpr: commonTestExpr || '""',
|
|
1280
|
+
options: options,
|
|
1067
1281
|
});
|
|
1068
|
-
|
|
1069
|
-
|
|
1070
|
-
|
|
1071
|
-
|
|
1072
|
-
|
|
1073
|
-
|
|
1074
|
-
|
|
1075
|
-
|
|
1076
|
-
|
|
1077
|
-
|
|
1078
|
-
const firstTest = opts[0].test;
|
|
1079
|
-
const firstStart = firstTest.span.start - baseByteOffset;
|
|
1080
|
-
const firstEnd = firstTest.span.end - baseByteOffset;
|
|
1081
|
-
commonTestExpr = sourceBuffer
|
|
1082
|
-
.subarray(firstStart, firstEnd)
|
|
1083
|
-
.toString('utf-8');
|
|
1084
|
-
}
|
|
1085
|
-
}
|
|
1086
|
-
const options = opts.map((opt) => ({
|
|
1087
|
-
value: opt.valueName,
|
|
1088
|
-
style: opt.truthy,
|
|
1089
|
-
label: opt.valueName || 'default',
|
|
1090
|
-
}));
|
|
1091
|
-
dimensions.push({
|
|
1092
|
-
type: 'var',
|
|
1093
|
-
testExpr: commonTestExpr || '""',
|
|
1094
|
-
options: options,
|
|
1095
|
-
});
|
|
1096
|
-
});
|
|
1097
|
-
const results = {};
|
|
1098
|
-
const recurse = (dimIndex, currentStyle, keyParts) => {
|
|
1099
|
-
if (dimIndex >= dimensions.length) {
|
|
1100
|
-
const records = (0, utils_1.getStyleRecords)(currentStyle);
|
|
1101
|
-
const className = records.map((r) => r.hash).join(' ');
|
|
1102
|
-
const finalKey = keyParts.join('__');
|
|
1103
|
-
if (className)
|
|
1104
|
-
results[finalKey] = className;
|
|
1105
|
-
return;
|
|
1106
|
-
}
|
|
1107
|
-
const dim = dimensions[dimIndex];
|
|
1108
|
-
dim.options.forEach((opt) => {
|
|
1109
|
-
const nextStyle = (0, utils_1.deepMerge)(currentStyle, opt.style);
|
|
1110
|
-
recurse(dimIndex + 1, nextStyle, [
|
|
1111
|
-
...keyParts,
|
|
1112
|
-
String(opt.value),
|
|
1113
|
-
]);
|
|
1114
|
-
});
|
|
1115
|
-
};
|
|
1116
|
-
recurse(0, baseConflict, []);
|
|
1117
|
-
let baseConflictClass = '';
|
|
1118
|
-
if (Object.keys(baseConflict).length > 0) {
|
|
1119
|
-
const records = (0, utils_1.getStyleRecords)(baseConflict);
|
|
1120
|
-
baseConflictClass = records.map((r) => r.hash).join(' ');
|
|
1282
|
+
});
|
|
1283
|
+
const results = {};
|
|
1284
|
+
const recurse = (dimIndex, currentStyle, keyParts) => {
|
|
1285
|
+
if (dimIndex >= dimensions.length) {
|
|
1286
|
+
const records = (0, utils_1.getStyleRecords)(currentStyle);
|
|
1287
|
+
const className = records.map((r) => r.hash).join(' ');
|
|
1288
|
+
const finalKey = keyParts.join('__');
|
|
1289
|
+
if (className)
|
|
1290
|
+
results[finalKey] = className;
|
|
1291
|
+
return;
|
|
1121
1292
|
}
|
|
1122
|
-
const
|
|
1123
|
-
|
|
1124
|
-
|
|
1125
|
-
|
|
1126
|
-
|
|
1127
|
-
|
|
1128
|
-
|
|
1129
|
-
}
|
|
1293
|
+
const dim = dimensions[dimIndex];
|
|
1294
|
+
dim.options.forEach((opt) => {
|
|
1295
|
+
const nextStyle = (0, utils_1.deepMerge)(currentStyle, opt.style);
|
|
1296
|
+
recurse(dimIndex + 1, nextStyle, [
|
|
1297
|
+
...keyParts,
|
|
1298
|
+
String(opt.value),
|
|
1299
|
+
]);
|
|
1130
1300
|
});
|
|
1131
|
-
|
|
1132
|
-
|
|
1133
|
-
|
|
1134
|
-
|
|
1135
|
-
|
|
1136
|
-
|
|
1301
|
+
};
|
|
1302
|
+
recurse(0, baseConflict, []);
|
|
1303
|
+
let baseConflictClass = '';
|
|
1304
|
+
if (Object.keys(baseConflict).length > 0) {
|
|
1305
|
+
const records = (0, utils_1.getStyleRecords)(baseConflict);
|
|
1306
|
+
baseConflictClass = records.map((r) => r.hash).join(' ');
|
|
1137
1307
|
}
|
|
1138
|
-
const
|
|
1139
|
-
|
|
1140
|
-
|
|
1141
|
-
|
|
1142
|
-
|
|
1308
|
+
const keyExprs = [];
|
|
1309
|
+
dimensions.forEach((dim) => {
|
|
1310
|
+
if (dim.type === 'std') {
|
|
1311
|
+
keyExprs.push(`(${dim.testExpr} ? "1" : "0")`);
|
|
1312
|
+
}
|
|
1313
|
+
else {
|
|
1314
|
+
keyExprs.push(dim.testExpr || '""');
|
|
1315
|
+
}
|
|
1143
1316
|
});
|
|
1317
|
+
const masterKeyExpr = keyExprs.length > 0 ? keyExprs.join(' + "__" + ') : '""';
|
|
1318
|
+
const tableJson = JSON.stringify(results);
|
|
1319
|
+
const fallback = baseConflictClass
|
|
1320
|
+
? JSON.stringify(baseConflictClass)
|
|
1321
|
+
: '""';
|
|
1322
|
+
classParts.push(`(${tableJson}[${masterKeyExpr}] || ${fallback})`);
|
|
1144
1323
|
}
|
|
1324
|
+
classParts.push(...dynamicClassParts);
|
|
1325
|
+
const replacement = classParts.length > 0 ? classParts.join(' + " " + ') : '""';
|
|
1326
|
+
replacements.push({
|
|
1327
|
+
start: node.span.start - baseByteOffset,
|
|
1328
|
+
end: node.span.end - baseByteOffset,
|
|
1329
|
+
content: `className={${replacement}}${styleAttr}`,
|
|
1330
|
+
});
|
|
1145
1331
|
}
|
|
1146
1332
|
}
|
|
1333
|
+
else {
|
|
1334
|
+
replacements.push({
|
|
1335
|
+
start: node.span.start - baseByteOffset,
|
|
1336
|
+
end: node.span.end - baseByteOffset,
|
|
1337
|
+
content: styleAttr || '',
|
|
1338
|
+
});
|
|
1339
|
+
}
|
|
1147
1340
|
},
|
|
1148
1341
|
});
|
|
1149
1342
|
Object.values(localCreateStyles).forEach((info) => {
|