@stylexjs/babel-plugin 0.14.0 → 0.14.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/lib/index.js CHANGED
@@ -740,6 +740,7 @@ class StateManager {
740
740
  const enableFontSizePxToRem = logAndDefault(boolean(), options.enableFontSizePxToRem ?? false, false, 'options.enableFontSizePxToRem');
741
741
  const enableInlinedConditionalMerge = logAndDefault(boolean(), options.enableInlinedConditionalMerge ?? true, true, 'options.enableInlinedConditionalMerge');
742
742
  const enableMinifiedKeys = logAndDefault(boolean(), options.enableMinifiedKeys ?? true, true, 'options.enableMinifiedKeys');
743
+ const enableLegacyValueFlipping = logAndDefault(boolean(), options.enableLegacyValueFlipping ?? false, false, 'options.enableLegacyValueFlipping');
743
744
  const enableLogicalStylesPolyfill = logAndDefault(boolean(), options.enableLogicalStylesPolyfill ?? false, false, 'options.enableLogicalStylesPolyfill');
744
745
  const test = logAndDefault(boolean(), options.test ?? false, false, 'options.test');
745
746
  const configRuntimeInjection = logAndDefault(checkRuntimeInjection, options.runtimeInjection ?? false, false, 'options.runtimeInjection');
@@ -770,6 +771,7 @@ class StateManager {
770
771
  enableFontSizePxToRem,
771
772
  enableInlinedConditionalMerge,
772
773
  enableMinifiedKeys,
774
+ enableLegacyValueFlipping,
773
775
  enableLogicalStylesPolyfill,
774
776
  importSources,
775
777
  rewriteAliases: typeof options.rewriteAliases === 'boolean' ? options.rewriteAliases : false,
@@ -1278,6 +1280,7 @@ const defaultOptions = {
1278
1280
  enableDevClassNames: false,
1279
1281
  enableDebugDataProp: true,
1280
1282
  enableFontSizePxToRem: false,
1283
+ enableLegacyValueFlipping: false,
1281
1284
  enableLogicalStylesPolyfill: false,
1282
1285
  enableMinifiedKeys: true,
1283
1286
  styleResolution: 'property-specificity',
@@ -2120,9 +2123,18 @@ const shorthands$1 = {
2120
2123
  }, []);
2121
2124
  return [['containIntrinsicWidth', width], ['containIntrinsicHeight', height]];
2122
2125
  },
2123
- inset: rawValue => [['top', rawValue], ['insetInlineEnd', rawValue], ['bottom', rawValue], ['insetInlineStart', rawValue]],
2124
- insetInline: rawValue => [...shorthands$1.start(rawValue), ...shorthands$1.end(rawValue)],
2125
- insetBlock: rawValue => [['top', rawValue], ['bottom', rawValue]],
2126
+ inset: rawValue => {
2127
+ const [top, right = top, bottom = top, left = right] = splitValue(rawValue);
2128
+ return [['top', top], ['insetInlineEnd', right], ['bottom', bottom], ['insetInlineStart', left]];
2129
+ },
2130
+ insetInline: rawValue => {
2131
+ const [start, end = start] = splitValue(rawValue);
2132
+ return [...shorthands$1.start(start), ...shorthands$1.end(end)];
2133
+ },
2134
+ insetBlock: rawValue => {
2135
+ const [top, bottom = top] = splitValue(rawValue);
2136
+ return [['top', top], ['bottom', bottom]];
2137
+ },
2126
2138
  start: rawValue => [['insetInlineStart', rawValue], ['left', null], ['right', null]],
2127
2139
  end: rawValue => [['insetInlineEnd', rawValue], ['left', null], ['right', null]],
2128
2140
  left: rawValue => [['left', rawValue], ['insetInlineStart', null], ['insetInlineEnd', null]],
@@ -2135,13 +2147,17 @@ const shorthands$1 = {
2135
2147
  const [top, right = top, bottom = top, left = right] = splitValue(rawValue);
2136
2148
  return [['marginTop', top], ['marginInlineEnd', right], ['marginBottom', bottom], ['marginInlineStart', left]];
2137
2149
  },
2138
- marginHorizontal: rawValue => [...shorthands$1.marginStart(rawValue), ...shorthands$1.marginEnd(rawValue)],
2150
+ marginHorizontal: rawValue => {
2151
+ const [start, end = start] = splitValue(rawValue);
2152
+ return [...shorthands$1.marginStart(start), ...shorthands$1.marginEnd(end)];
2153
+ },
2139
2154
  marginStart: rawValue => [['marginInlineStart', rawValue], ['marginLeft', null], ['marginRight', null]],
2140
2155
  marginEnd: rawValue => [['marginInlineEnd', rawValue], ['marginLeft', null], ['marginRight', null]],
2141
2156
  marginLeft: rawValue => [['marginLeft', rawValue], ['marginInlineStart', null], ['marginInlineEnd', null]],
2142
2157
  marginRight: rawValue => [['marginRight', rawValue], ['marginInlineStart', null], ['marginInlineEnd', null]],
2143
2158
  marginVertical: rawValue => {
2144
- return [['marginTop', rawValue], ['marginBottom', rawValue]];
2159
+ const [top, bottom = top] = splitValue(rawValue);
2160
+ return [['marginTop', top], ['marginBottom', bottom]];
2145
2161
  },
2146
2162
  overflow: rawValue => {
2147
2163
  const [x, y = x] = splitValue(rawValue);
@@ -2151,12 +2167,18 @@ const shorthands$1 = {
2151
2167
  const [top, right = top, bottom = top, left = right] = splitValue(rawValue);
2152
2168
  return [['paddingTop', top], ['paddingInlineEnd', right], ['paddingBottom', bottom], ['paddingInlineStart', left]];
2153
2169
  },
2154
- paddingHorizontal: val => [...shorthands$1.paddingStart(val), ...shorthands$1.paddingEnd(val)],
2170
+ paddingHorizontal: val => {
2171
+ const [start, end = start] = splitValue(val);
2172
+ return [...shorthands$1.paddingStart(start), ...shorthands$1.paddingEnd(end)];
2173
+ },
2155
2174
  paddingStart: val => [['paddingInlineStart', val], ['paddingLeft', null], ['paddingRight', null]],
2156
2175
  paddingEnd: val => [['paddingInlineEnd', val], ['paddingLeft', null], ['paddingRight', null]],
2157
2176
  paddingLeft: val => [['paddingLeft', val], ['paddingStart', null], ['paddingEnd', null]],
2158
2177
  paddingRight: val => [['paddingRight', val], ['paddingInlineStart', null], ['paddingInlineEnd', null]],
2159
- paddingVertical: val => [['paddingTop', val], ['paddingBottom', val]]
2178
+ paddingVertical: val => {
2179
+ const [top, bottom = top] = splitValue(val);
2180
+ return [['paddingTop', top], ['paddingBottom', bottom]];
2181
+ }
2160
2182
  };
2161
2183
  const aliases$1 = {
2162
2184
  insetBlockStart: val => [['top', val]],
@@ -2482,6 +2504,7 @@ const nonStaticValue = fn => `Only static values are allowed inside of a ${fn}()
2482
2504
  const nonStyleObject = fn => `${fn}() can only accept an object.`;
2483
2505
  const nonExportNamedDeclaration = fn => `The return value of ${fn}() must be bound to a named export.`;
2484
2506
  const unboundCallValue = fn => `${fn}() calls must be bound to a bare variable.`;
2507
+ const cannotGenerateHash = fn => `Unable to generate hash for ${fn}(). Check that the file has a valid extension and that unstable_moduleResolution is configured.`;
2485
2508
  const DUPLICATE_CONDITIONAL = 'The same pseudo selector or at-rule cannot be used more than once.';
2486
2509
  const ESCAPED_STYLEX_VALUE = 'Escaping a create() value is not allowed.';
2487
2510
  const ILLEGAL_NESTED_PSEUDO = "Pseudo objects can't be nested more than one level deep.";
@@ -2523,6 +2546,7 @@ var m = /*#__PURE__*/Object.freeze({
2523
2546
  POSITION_TRY_INVALID_PROPERTY: POSITION_TRY_INVALID_PROPERTY,
2524
2547
  UNKNOWN_PROP_KEY: UNKNOWN_PROP_KEY,
2525
2548
  VIEW_TRANSITION_CLASS_INVALID_PROPERTY: VIEW_TRANSITION_CLASS_INVALID_PROPERTY,
2549
+ cannotGenerateHash: cannotGenerateHash,
2526
2550
  illegalArgumentLength: illegalArgumentLength,
2527
2551
  nonExportNamedDeclaration: nonExportNamedDeclaration,
2528
2552
  nonStaticValue: nonStaticValue,
@@ -3042,17 +3066,29 @@ const propertyToRTL = {
3042
3066
  }
3043
3067
  return [key, words.map(word => word === 'start' || word === 'insetInlineStart' ? 'right' : word === 'end' || word === 'insetInlineEnd' ? 'left' : word).join(' ')];
3044
3068
  },
3045
- cursor: _ref40 => {
3069
+ cursor: function (_ref40) {
3046
3070
  let [key, val] = _ref40;
3071
+ let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : defaultOptions;
3072
+ if (!options.enableLegacyValueFlipping) {
3073
+ return null;
3074
+ }
3047
3075
  return cursorFlip[val] != null ? [key, cursorFlip[val]] : null;
3048
3076
  },
3049
- 'box-shadow': _ref41 => {
3077
+ 'box-shadow': function (_ref41) {
3050
3078
  let [key, val] = _ref41;
3079
+ let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : defaultOptions;
3080
+ if (!options.enableLegacyValueFlipping) {
3081
+ return null;
3082
+ }
3051
3083
  const rtlVal = flipShadow(val);
3052
3084
  return rtlVal ? [key, rtlVal] : null;
3053
3085
  },
3054
- 'text-shadow': _ref42 => {
3086
+ 'text-shadow': function (_ref42) {
3055
3087
  let [key, val] = _ref42;
3088
+ let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : defaultOptions;
3089
+ if (!options.enableLegacyValueFlipping) {
3090
+ return null;
3091
+ }
3056
3092
  const rtlVal = flipShadow(val);
3057
3093
  return rtlVal ? [key, rtlVal] : null;
3058
3094
  }
@@ -3078,7 +3114,7 @@ function generateRTL(_ref43) {
3078
3114
  if (!propertyToRTL[key]) {
3079
3115
  return null;
3080
3116
  }
3081
- return propertyToRTL[key]([key, value]);
3117
+ return propertyToRTL[key]([key, value], options);
3082
3118
  }
3083
3119
 
3084
3120
  const longHandPhysical = new Set();
@@ -4286,18 +4322,18 @@ function getDefaultValue(value) {
4286
4322
  function styleXDefineVars(variables, options) {
4287
4323
  const {
4288
4324
  classNamePrefix,
4289
- themeName,
4325
+ exportId,
4290
4326
  debug,
4291
4327
  enableDebugClassNames
4292
4328
  } = {
4293
4329
  ...defaultOptions,
4294
4330
  ...options
4295
4331
  };
4296
- const themeNameHash = classNamePrefix + hash(themeName);
4332
+ const varGroupHash = classNamePrefix + hash(exportId);
4297
4333
  const typedVariables = {};
4298
4334
  const variablesMap = objMap(variables, (value, key) => {
4299
4335
  const varSafeKey = (key[0] >= '0' && key[0] <= '9' ? `_${key}` : key).replace(/[^a-zA-Z0-9]/g, '_');
4300
- const nameHash = key.startsWith('--') ? key.slice(2) : debug && enableDebugClassNames ? varSafeKey + '-' + classNamePrefix + hash(`${themeName}.${key}`) : classNamePrefix + hash(`${themeName}.${key}`);
4336
+ const nameHash = key.startsWith('--') ? key.slice(2) : debug && enableDebugClassNames ? varSafeKey + '-' + classNamePrefix + hash(`${exportId}.${key}`) : classNamePrefix + hash(`${exportId}.${key}`);
4301
4337
  if (isCSSType(value)) {
4302
4338
  const v = value;
4303
4339
  typedVariables[nameHash] = {
@@ -4320,7 +4356,7 @@ function styleXDefineVars(variables, options) {
4320
4356
  } = _ref;
4321
4357
  return `var(--${nameHash})`;
4322
4358
  });
4323
- const injectableStyles = constructCssVariablesString(variablesMap, themeNameHash);
4359
+ const injectableStyles = constructCssVariablesString(variablesMap, varGroupHash);
4324
4360
  const injectableTypes = objMap(typedVariables, (_ref2, nameHash) => {
4325
4361
  let {
4326
4362
  initialValue: iv,
@@ -4334,13 +4370,13 @@ function styleXDefineVars(variables, options) {
4334
4370
  });
4335
4371
  return [{
4336
4372
  ...themeVariablesObject,
4337
- __themeName__: themeNameHash
4373
+ __varGroupHash__: varGroupHash
4338
4374
  }, {
4339
4375
  ...injectableTypes,
4340
4376
  ...injectableStyles
4341
4377
  }];
4342
4378
  }
4343
- function constructCssVariablesString(variables, themeNameHash) {
4379
+ function constructCssVariablesString(variables, varGroupHash) {
4344
4380
  const rulesByAtRule = {};
4345
4381
  for (const [key, {
4346
4382
  nameHash,
@@ -4354,12 +4390,12 @@ function constructCssVariablesString(variables, themeNameHash) {
4354
4390
  const result = {};
4355
4391
  for (const [atRule, value] of Object.entries(rulesByAtRule)) {
4356
4392
  const suffix = atRule === 'default' ? '' : `-${hash(atRule)}`;
4357
- const selector = `:root, .${themeNameHash}`;
4393
+ const selector = `:root, .${varGroupHash}`;
4358
4394
  let ltr = `${selector}{${value.join('')}}`;
4359
4395
  if (atRule !== 'default') {
4360
4396
  ltr = wrapWithAtRules(ltr, atRule);
4361
4397
  }
4362
- result[themeNameHash + suffix] = {
4398
+ result[varGroupHash + suffix] = {
4363
4399
  ltr,
4364
4400
  rtl: null,
4365
4401
  priority: priorityForAtRule(atRule) * 0.1
@@ -4371,7 +4407,7 @@ function constructCssVariablesString(variables, themeNameHash) {
4371
4407
  function styleXDefineConsts(constants, options) {
4372
4408
  const {
4373
4409
  classNamePrefix,
4374
- themeName,
4410
+ exportId,
4375
4411
  debug,
4376
4412
  enableDebugClassNames
4377
4413
  } = {
@@ -4385,10 +4421,10 @@ function styleXDefineConsts(constants, options) {
4385
4421
  throw new Error(INVALID_CONST_KEY);
4386
4422
  }
4387
4423
  const varSafeKey = (key[0] >= '0' && key[0] <= '9' ? `_${key}` : key).replace(/[^a-zA-Z0-9]/g, '_');
4388
- const nameHash = debug && enableDebugClassNames ? `${varSafeKey}-${classNamePrefix}${hash(`${themeName}.${key}`)}` : `${classNamePrefix}${hash(`${themeName}.${key}`)}`;
4424
+ const constKey = debug && enableDebugClassNames ? `${varSafeKey}-${classNamePrefix}${hash(`${exportId}.${key}`)}` : `${classNamePrefix}${hash(`${exportId}.${key}`)}`;
4389
4425
  jsOutput[key] = value;
4390
- injectableStyles[nameHash] = {
4391
- constKey: nameHash,
4426
+ injectableStyles[constKey] = {
4427
+ constKey,
4392
4428
  constVal: value,
4393
4429
  priority: 0,
4394
4430
  ltr: '',
@@ -4399,7 +4435,7 @@ function styleXDefineConsts(constants, options) {
4399
4435
  }
4400
4436
 
4401
4437
  function styleXCreateTheme(themeVars, variables, options) {
4402
- if (typeof themeVars.__themeName__ !== 'string') {
4438
+ if (typeof themeVars.__varGroupHash__ !== 'string') {
4403
4439
  throw new Error('Can only override variables theme created with defineVars().');
4404
4440
  }
4405
4441
  const {
@@ -4439,9 +4475,9 @@ function styleXCreateTheme(themeVars, variables, options) {
4439
4475
  };
4440
4476
  }
4441
4477
  }
4442
- const themeClass = `${overrideClassName} ${themeVars.__themeName__}`;
4478
+ const themeClass = `${overrideClassName} ${themeVars.__varGroupHash__}`;
4443
4479
  return [{
4444
- [themeVars.__themeName__]: themeClass,
4480
+ [themeVars.__varGroupHash__]: themeClass,
4445
4481
  $$css: true
4446
4482
  }, stylesToInject];
4447
4483
  }
@@ -4755,7 +4791,7 @@ function evaluateThemeRef(fileName, exportName, state) {
4755
4791
  if (key.startsWith('--')) {
4756
4792
  return `var(${key})`;
4757
4793
  }
4758
- const strToHash = key === '__themeName__' ? utils.genFileBasedIdentifier({
4794
+ const strToHash = key === '__varGroupHash__' ? utils.genFileBasedIdentifier({
4759
4795
  fileName,
4760
4796
  exportName
4761
4797
  }) : utils.genFileBasedIdentifier({
@@ -4767,9 +4803,9 @@ function evaluateThemeRef(fileName, exportName, state) {
4767
4803
  debug,
4768
4804
  enableDebugClassNames
4769
4805
  } = state.traversalState.options;
4770
- const varSafeKey = key === '__themeName__' ? '' : (key[0] >= '0' && key[0] <= '9' ? `_${key}` : key).replace(/[^a-zA-Z0-9]/g, '_') + '-';
4806
+ const varSafeKey = key === '__varGroupHash__' ? '' : (key[0] >= '0' && key[0] <= '9' ? `_${key}` : key).replace(/[^a-zA-Z0-9]/g, '_') + '-';
4771
4807
  const varName = debug && enableDebugClassNames ? varSafeKey + state.traversalState.options.classNamePrefix + utils.hash(strToHash) : state.traversalState.options.classNamePrefix + utils.hash(strToHash);
4772
- if (key === '__themeName__') {
4808
+ if (key === '__varGroupHash__') {
4773
4809
  return varName;
4774
4810
  }
4775
4811
  return `var(--${varName})`;
@@ -5834,7 +5870,7 @@ function transformStyleXCreateTheme(callExpressionPath, state) {
5834
5870
  if (typeof overrides !== 'object' || overrides == null) {
5835
5871
  throw callExpressionPath.buildCodeFrameError(messages.nonStyleObject('createTheme'), SyntaxError);
5836
5872
  }
5837
- if (typeof variables.__themeName__ !== 'string' || variables.__themeName__ === '') {
5873
+ if (typeof variables.__varGroupHash__ !== 'string' || variables.__varGroupHash__ === '') {
5838
5874
  throw callExpressionPath.buildCodeFrameError('Can only override variables theme created with defineVars().', SyntaxError);
5839
5875
  }
5840
5876
  let [overridesObj, injectedStyles] = createTheme(variables, overrides, state.options);
@@ -5953,12 +5989,12 @@ function transformStyleXDefineVars(callExpressionPath, state) {
5953
5989
  }
5954
5990
  const fileName = state.fileNameForHashing;
5955
5991
  if (fileName == null) {
5956
- throw new Error('No filename found for generating defineVars key name.');
5992
+ throw new Error(messages.cannotGenerateHash('defineVars'));
5957
5993
  }
5958
5994
  const exportName = varId.name;
5959
5995
  const [variablesObj, injectedStylesSansKeyframes] = defineVars(value, {
5960
5996
  ...state.options,
5961
- themeName: utils.genFileBasedIdentifier({
5997
+ exportId: utils.genFileBasedIdentifier({
5962
5998
  fileName,
5963
5999
  exportName
5964
6000
  })
@@ -6016,16 +6052,16 @@ function transformStyleXDefineConsts(callExpressionPath, state) {
6016
6052
  }
6017
6053
  const fileName = state.fileNameForHashing;
6018
6054
  if (fileName == null) {
6019
- throw new Error('No filename found for generating defineConsts key name.');
6055
+ throw new Error(messages.cannotGenerateHash('defineConsts'));
6020
6056
  }
6021
6057
  const exportName = varId.name;
6022
- const themeName = utils.genFileBasedIdentifier({
6058
+ const exportId = utils.genFileBasedIdentifier({
6023
6059
  fileName,
6024
6060
  exportName
6025
6061
  });
6026
6062
  const [transformedJsOutput, jsOutput] = defineConsts(value, {
6027
6063
  ...state.options,
6028
- themeName
6064
+ exportId
6029
6065
  });
6030
6066
  callExpressionPath.replaceWith(convertObjectToAST(transformedJsOutput));
6031
6067
  const styles = Object.entries(jsOutput).map(_ref => {
@@ -46,6 +46,7 @@ export type StyleXOptions = Readonly<{
46
46
  enableDebugDataProp?: null | undefined | boolean;
47
47
  enableDevClassNames?: null | undefined | boolean;
48
48
  enableFontSizePxToRem?: null | undefined | boolean;
49
+ enableLegacyValueFlipping?: null | undefined | boolean;
49
50
  enableLogicalStylesPolyfill?: null | undefined | boolean;
50
51
  enableMinifiedKeys?: null | undefined | boolean;
51
52
  styleResolution:
@@ -52,6 +52,7 @@ export type StyleXOptions = $ReadOnly<{
52
52
  enableDebugDataProp?: ?boolean,
53
53
  enableDevClassNames?: ?boolean,
54
54
  enableFontSizePxToRem?: ?boolean,
55
+ enableLegacyValueFlipping?: ?boolean,
55
56
  enableLogicalStylesPolyfill?: ?boolean,
56
57
  enableMinifiedKeys?: ?boolean,
57
58
  styleResolution:
@@ -15,6 +15,7 @@ export declare const nonStaticValue: (fn: string) => string;
15
15
  export declare const nonStyleObject: (fn: string) => string;
16
16
  export declare const nonExportNamedDeclaration: (fn: string) => string;
17
17
  export declare const unboundCallValue: (fn: string) => string;
18
+ export declare const cannotGenerateHash: (fn: string) => string;
18
19
  export declare const DUPLICATE_CONDITIONAL: 'The same pseudo selector or at-rule cannot be used more than once.';
19
20
  export declare const ESCAPED_STYLEX_VALUE: 'Escaping a create() value is not allowed.';
20
21
  export declare const ILLEGAL_NESTED_PSEUDO: "Pseudo objects can't be nested more than one level deep.";
@@ -18,6 +18,7 @@ declare export const nonStaticValue: (fn: string) => string;
18
18
  declare export const nonStyleObject: (fn: string) => string;
19
19
  declare export const nonExportNamedDeclaration: (fn: string) => string;
20
20
  declare export const unboundCallValue: (fn: string) => string;
21
+ declare export const cannotGenerateHash: (fn: string) => string;
21
22
 
22
23
  declare export const DUPLICATE_CONDITIONAL: 'The same pseudo selector or at-rule cannot be used more than once.';
23
24
  declare export const ESCAPED_STYLEX_VALUE: 'Escaping a create() value is not allowed.';
@@ -10,7 +10,7 @@
10
10
  import type { InjectableStyle, StyleXOptions } from './common-types';
11
11
  declare function styleXCreateTheme(
12
12
  themeVars: {
13
- readonly __themeName__: string;
13
+ readonly __varGroupHash__: string;
14
14
  readonly [$$Key$$: string]: string;
15
15
  },
16
16
  variables: {
@@ -13,7 +13,7 @@ import type { InjectableStyle, StyleXOptions } from './common-types';
13
13
  // and returns a hashed className with variables overrides.
14
14
  //
15
15
  declare export default function styleXCreateTheme(
16
- themeVars: { +__themeName__: string, +[string]: string },
16
+ themeVars: { +__varGroupHash__: string, +[string]: string },
17
17
  variables: { +[string]: string | { default: string, +[string]: string } },
18
18
  options?: StyleXOptions,
19
19
  ): [{ $$css: true, +[string]: string }, { [string]: InjectableStyle }];
@@ -12,8 +12,8 @@ import type { ConstsConfig } from './stylex-consts-utils';
12
12
  declare function styleXDefineConsts<Vars extends ConstsConfig>(
13
13
  constants: Vars,
14
14
  options: Readonly<
15
- Omit<Partial<StyleXOptions>, keyof ({ themeName: string })> & {
16
- themeName: string;
15
+ Omit<Partial<StyleXOptions>, keyof ({ exportId: string })> & {
16
+ exportId: string;
17
17
  }
18
18
  >,
19
19
  ): [
@@ -12,7 +12,7 @@ import type { ConstsConfig } from './stylex-consts-utils';
12
12
 
13
13
  declare export default function styleXDefineConsts<Vars: ConstsConfig>(
14
14
  constants: Vars,
15
- options: $ReadOnly<{ ...Partial<StyleXOptions>, themeName: string, ... }>,
15
+ options: $ReadOnly<{ ...Partial<StyleXOptions>, exportId: string, ... }>,
16
16
  ): [
17
17
  { [string]: string | number }, // jsOutput JS output
18
18
  { [string]: InjectableConstStyle }, // metadata for registerinjectableStyles
@@ -13,15 +13,15 @@ type VarsKeysWithStringValues<Vars extends VarsConfig> = Readonly<{
13
13
  [$$Key$$: keyof Vars]: string;
14
14
  }>;
15
15
  type VarsObject<Vars extends VarsConfig> = Readonly<
16
- Omit<VarsKeysWithStringValues<Vars>, keyof ({ __themeName__: string })> & {
17
- __themeName__: string;
16
+ Omit<VarsKeysWithStringValues<Vars>, keyof ({ __varGroupHash__: string })> & {
17
+ __varGroupHash__: string;
18
18
  }
19
19
  >;
20
20
  declare function styleXDefineVars<Vars extends VarsConfig>(
21
21
  variables: Vars,
22
22
  options: Readonly<
23
- Omit<Partial<StyleXOptions>, keyof ({ themeName: string })> & {
24
- themeName: string;
23
+ Omit<Partial<StyleXOptions>, keyof ({ exportId: string })> & {
24
+ exportId: string;
25
25
  }
26
26
  >,
27
27
  ): [VarsObject<Vars>, { [$$Key$$: string]: InjectableStyle }];
@@ -15,12 +15,12 @@ type VarsKeysWithStringValues<Vars: VarsConfig> = $ReadOnly<{
15
15
 
16
16
  type VarsObject<Vars: VarsConfig> = $ReadOnly<{
17
17
  ...VarsKeysWithStringValues<Vars>,
18
- __themeName__: string,
18
+ __varGroupHash__: string,
19
19
  }>;
20
20
 
21
21
  // Similar to `stylex.create` it takes an object of variables with their values
22
22
  // and returns a string after hashing it.
23
23
  declare export default function styleXDefineVars<Vars: VarsConfig>(
24
24
  variables: Vars,
25
- options: $ReadOnly<{ ...Partial<StyleXOptions>, themeName: string, ... }>,
25
+ options: $ReadOnly<{ ...Partial<StyleXOptions>, exportId: string, ... }>,
26
26
  ): [VarsObject<Vars>, { [string]: InjectableStyle }];
@@ -46,6 +46,7 @@ export type StyleXOptions = Readonly<
46
46
  enableDebugDataProp?: boolean;
47
47
  enableDevClassNames?: boolean;
48
48
  enableInlinedConditionalMerge?: boolean;
49
+ enableLegacyValueFlipping?: boolean;
49
50
  enableLogicalStylesPolyfill?: boolean;
50
51
  enableMinifiedKeys?: boolean;
51
52
  importSources: ReadonlyArray<
@@ -68,6 +69,7 @@ export type StyleXOptions = Readonly<
68
69
  enableDebugDataProp?: boolean;
69
70
  enableDevClassNames?: boolean;
70
71
  enableInlinedConditionalMerge?: boolean;
72
+ enableLegacyValueFlipping?: boolean;
71
73
  enableLogicalStylesPolyfill?: boolean;
72
74
  enableMinifiedKeys?: boolean;
73
75
  importSources: ReadonlyArray<
@@ -48,6 +48,7 @@ export type StyleXOptions = $ReadOnly<{
48
48
  enableDebugDataProp?: boolean,
49
49
  enableDevClassNames?: boolean,
50
50
  enableInlinedConditionalMerge?: boolean,
51
+ enableLegacyValueFlipping?: boolean,
51
52
  enableLogicalStylesPolyfill?: boolean,
52
53
  enableMinifiedKeys?: boolean,
53
54
  importSources: $ReadOnlyArray<
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@stylexjs/babel-plugin",
3
- "version": "0.14.0",
3
+ "version": "0.14.2",
4
4
  "description": "StyleX babel plugin.",
5
5
  "main": "lib/index.js",
6
6
  "repository": {
@@ -21,7 +21,7 @@
21
21
  "@babel/traverse": "^7.26.8",
22
22
  "@babel/types": "^7.26.8",
23
23
  "@dual-bundle/import-meta-resolve": "^4.1.0",
24
- "@stylexjs/stylex": "0.14.0",
24
+ "@stylexjs/stylex": "0.14.2",
25
25
  "postcss-value-parser": "^4.1.0"
26
26
  },
27
27
  "devDependencies": {
@@ -33,7 +33,7 @@
33
33
  "@rollup/plugin-replace": "^6.0.1",
34
34
  "babel-plugin-syntax-hermes-parser": "^0.26.0",
35
35
  "rollup": "^4.24.0",
36
- "scripts": "0.14.0"
36
+ "scripts": "0.14.2"
37
37
  },
38
38
  "files": [
39
39
  "flow_modules/*",