@stylexjs/stylex 0.2.0-beta.19 → 0.2.0-beta.21

package/lib/native/CSSLengthUnitValue.d.ts

@@ -7,16 +7,12 @@
  *
  */
 
+import type { SpreadOptions } from './SpreadOptions';
 type CSSLengthUnitType = 'em' | 'px' | 'rem' | 'vh' | 'vmax' | 'vmin' | 'vw';
 export declare class CSSLengthUnitValue {
-  static parse(inp: string): CSSLengthUnitValue | null;
+  static parse(inp: string): [number, CSSLengthUnitType] | null;
   value: number;
   unit: CSSLengthUnitType;
   constructor(value: number, unit: CSSLengthUnitType);
-  resolvePixelValue(
-    viewportWidth: number,
-    viewportHeight: number,
-    fontScale: number,
-    inheritedFontSize: null | undefined | number,
-  ): number;
+  resolvePixelValue(options: SpreadOptions): number;
 }

package/lib/native/CSSLengthUnitValue.js

@@ -13,13 +13,19 @@ class CSSLengthUnitValue {
     }
     const [, value, unit] = match;
     const parsedValue = parseFloat(value);
-    return new CSSLengthUnitValue(parsedValue, unit);
+    return [parsedValue, unit];
   }
   constructor(value, unit) {
     this.value = value;
     this.unit = unit;
   }
-  resolvePixelValue(viewportWidth, viewportHeight, fontScale, inheritedFontSize) {
+  resolvePixelValue(options) {
+    const {
+      viewportWidth,
+      viewportHeight,
+      fontScale = 1,
+      inheritedFontSize
+    } = options;
     const unit = this.unit;
     const value = this.value;
     const valuePercent = value / 100;

package/lib/native/CSSLengthUnitValue.js.flow

@@ -7,18 +7,15 @@
  * @flow strict
  */
 
+import type { SpreadOptions } from './SpreadOptions';
+
 type CSSLengthUnitType = 'em' | 'px' | 'rem' | 'vh' | 'vmax' | 'vmin' | 'vw';
 
 // TODO: this only works on simple values
 declare export class CSSLengthUnitValue {
-  static parse(inp: string): CSSLengthUnitValue | null;
+  static parse(inp: string): [number, CSSLengthUnitType] | null;
   value: number;
   unit: CSSLengthUnitType;
   constructor(value: number, unit: CSSLengthUnitType): void;
-  resolvePixelValue(
-    viewportWidth: number,
-    viewportHeight: number,
-    fontScale: number,
-    inheritedFontSize: ?number,
-  ): number;
+  resolvePixelValue(options: SpreadOptions): number;
 }

package/lib/native/SpreadOptions.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ *
+ */
+
+export type SpreadOptions = {
+  customProperties: {};
+  inheritedFontSize: null | undefined | number;
+  fontScale: number | void;
+  passthroughProperties: Array<string>;
+  viewportHeight: number;
+  viewportWidth: number;
+  writingDirection: 'ltr' | 'rtl';
+};

package/lib/native/SpreadOptions.js

@@ -0,0 +1 @@
+"use strict";

package/lib/native/SpreadOptions.js.flow

@@ -0,0 +1,18 @@
+/**
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow strict
+ */
+
+export type SpreadOptions = {|
+  customProperties: {},
+  inheritedFontSize: ?number,
+  fontScale: number | void,
+  passthroughProperties: Array<string>,
+  viewportHeight: number,
+  viewportWidth: number,
+  writingDirection: 'ltr' | 'rtl',
+|};

package/lib/native/__tests__/__snapshots__/stylex-css-var-test.js.snap

@@ -0,0 +1,48 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`stylex CSSCustomProperty value test falls back to a default value with spaces 1`] = `
+{
+  "style": {
+    "shadowColor": "0px 0px 0px black",
+    "shadowOffset": {
+      "height": undefined,
+      "width": undefined,
+    },
+    "shadowOpacity": 1,
+  },
+}
+`;
+
+exports[`stylex CSSCustomProperty value test parses a variable with a default value with spaces 1`] = `
+{
+  "style": {
+    "shadowColor": "5px 5px 5px black",
+    "shadowOffset": {
+      "height": undefined,
+      "width": undefined,
+    },
+    "shadowOpacity": 1,
+  },
+}
+`;
+
+exports[`stylex CSSCustomProperty value test parses and falls back to a default value containing spaces and embedded variables 1`] = `
+{
+  "style": {
+    "shadowColor": "var(--boxShadowVarNotFound",
+    "shadowOffset": {
+      "height": undefined,
+      "width": undefined,
+    },
+    "shadowOpacity": 1,
+  },
+}
+`;
+
+exports[`stylex CSSCustomProperty value test parses and falls back to default value containing a variable 1`] = `
+{
+  "style": {
+    "color": "blue",
+  },
+}
+`;