@stylexjs/shared 0.7.5 → 0.9.0-beta.1

package/lib/transform-value.js

@@ -7,7 +7,7 @@ exports.default = transformValue;
 exports.getNumberSuffix = getNumberSuffix;
 exports.timeUnits = exports.lengthUnits = void 0;
 var _normalizeValue = _interopRequireDefault(require("./utils/normalize-value"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function transformValue(key, rawValue, options) {
   const value = typeof rawValue === 'number' ? String(Math.round(rawValue * 10000) / 10000) + getNumberSuffix(key) : rawValue;
   if ((key === 'content' || key === 'hyphenateCharacter' || key === 'hyphenate-character') && typeof value === 'string') {
@@ -22,9 +22,12 @@ function transformValue(key, rawValue, options) {
   return (0, _normalizeValue.default)(value, key, options);
 }
 function getNumberSuffix(key) {
-  if (unitlessNumberProperties.has(key)) {
+  if (unitlessNumberProperties.has(key) || key.startsWith('--')) {
     return '';
   }
+  if (!(key in numberPropertySuffixes)) {
+    return 'px';
+  }
   const suffix = numberPropertySuffixes[key];
   if (suffix == null) {
     return 'px';
@@ -32,7 +35,7 @@ function getNumberSuffix(key) {
     return suffix;
   }
 }
-const unitlessNumberProperties = new Set(['WebkitLineClamp', 'animationIterationCount', 'aspectRatio', 'borderImageOutset', 'borderImageSlice', 'borderImageWidth', 'counterSet', 'columnCount', 'flex', 'flexGrow', 'flexPositive', 'flexShrink', 'flexOrder', 'gridRow', 'gridColumn', 'fontWeight', 'hyphenateLimitChars', 'lineClamp', 'lineHeight', 'maskBorderOutset', 'maskBorderSlice', 'maskBorderWidth', 'opacity', 'order', 'orphans', 'tabSize', 'widows', 'zIndex', 'fillOpacity', 'floodOpacity', 'rotate', 'scale', 'stopOpacity', 'strokeDasharray', 'strokeDashoffset', 'strokeMiterlimit', 'strokeOpacity', 'strokeWidth', 'scale', 'mathDepth']);
+const unitlessNumberProperties = new Set(['WebkitLineClamp', 'animationIterationCount', 'aspectRatio', 'borderImageOutset', 'borderImageSlice', 'borderImageWidth', 'counterSet', 'counterReset', 'columnCount', 'flex', 'flexGrow', 'flexShrink', 'flexOrder', 'gridRow', 'gridRowStart', 'gridRowEnd', 'gridColumn', 'gridColumnStart', 'gridColumnEnd', 'gridArea', 'fontWeight', 'hyphenateLimitChars', 'lineClamp', 'lineHeight', 'maskBorderOutset', 'maskBorderSlice', 'maskBorderWidth', 'opacity', 'order', 'orphans', 'tabSize', 'widows', 'zIndex', 'fillOpacity', 'floodOpacity', 'rotate', 'scale', 'shapeImageThreshold', 'stopOpacity', 'strokeDasharray', 'strokeDashoffset', 'strokeMiterlimit', 'strokeOpacity', 'strokeWidth', 'scale', 'mathDepth']);
 const numberPropertySuffixes = {
   animationDelay: 'ms',
   animationDuration: 'ms',
@@ -41,4 +44,4 @@ const numberPropertySuffixes = {
   voiceDuration: 'ms'
 };
 const timeUnits = exports.timeUnits = new Set(Object.keys(numberPropertySuffixes));
-const lengthUnits = exports.lengthUnits = new Set(['backgroundPositionX', 'backgroundPositionY', 'blockSize', 'borderBlockEndWidth', 'borderBlockStartWidth', 'borderBlockWidth', 'borderVerticalWidth', 'borderVerticalWidth', 'borderBottomLeftRadius', 'borderBottomRightRadius', 'borderBottomWidth', 'borderEndEndRadius', 'borderEndStartRadius', 'borderImageWidth', 'borderInlineEndWidth', 'borderEndWidth', 'borderInlineStartWidth', 'borderStartWidth', 'borderInlineWidth', 'borderHorizontalWidth', 'borderLeftWidth', 'borderRightWidth', 'borderSpacing', 'borderStartEndRadius', 'borderStartStartRadius', 'borderTopLeftRadius', 'borderTopRightRadius', 'borderTopWidth', 'bottom', 'columnGap', 'columnRuleWidth', 'columnWidth', 'containIntrinsicBlockSize', 'containIntrinsicHeight', 'containIntrinsicInlineSize', 'containIntrinsicWidth', 'flexBasis', 'fontSize', 'fontSmooth', 'height', 'inlineSize', 'insetBlockEnd', 'insetBlockStart', 'insetInlineEnd', 'insetInlineStart', 'left', 'letterSpacing', 'marginBlockEnd', 'marginBlockStart', 'marginBottom', 'marginInlineEnd', 'marginEnd', 'marginInlineStart', 'marginStart', 'marginLeft', 'marginRight', 'marginTop', 'maskBorderOutset', 'maskBorderWidth', 'maxBlockSize', 'maxHeight', 'maxInlineSize', 'maxWidth', 'minBlockSize', 'minHeight', 'minInlineSize', 'minWidth', 'offsetDistance', 'outlineOffset', 'outlineWidth', 'overflowClipMargin', 'paddingBlockEnd', 'paddingBlockStart', 'paddingBottom', 'paddingInlineEnd', 'paddingEnd', 'paddingInlineStart', 'paddingStart', 'paddingLeft', 'paddingRight', 'paddingTop', 'perspective', 'right', 'rowGap', 'scrollMarginBlockEnd', 'scrollMarginBlockStart', 'scrollMarginBottom', 'scrollMarginInlineEnd', 'scrollMarginInlineStart', 'scrollMarginLeft', 'scrollMarginRight', 'scrollMarginTop', 'scrollPaddingBlockEnd', 'scrollPaddingBlockStart', 'scrollPaddingBottom', 'scrollPaddingInlineEnd', 'scrollPaddingInlineStart', 'scrollPaddingLeft', 'scrollPaddingRight', 'scrollPaddingTop', 'scrollSnapMarginBottom', 'scrollSnapMarginLeft', 'scrollSnapMarginRight', 'scrollSnapMarginTop', 'shapeMargin', 'tabSize', 'textDecorationThickness', 'textIndent', 'textUnderlineOffset', 'top', 'transformOrigin', 'translate', 'verticalAlign', 'width', 'wordSpacing', 'border', 'borderBlock', 'borderBlockEnd', 'borderBlockStart', 'borderBottom', 'borderLeft', 'borderRadius', 'borderRight', 'borderTop', 'borderWidth', 'columnRule', 'containIntrinsicSize', 'gap', 'inset', 'insetBlock', 'insetInline', 'margin', 'marginBlock', 'marginVertical', 'marginInline', 'marginHorizontal', 'offset', 'outline', 'padding', 'paddingBlock', 'paddingVertical', 'paddingInline', 'paddingHorizontal', 'scrollMargin', 'scrollMarginBlock', 'scrollMarginInline', 'scrollPadding', 'scrollPaddingBlock', 'scrollPaddingInline', 'scrollSnapMargin']);
+const lengthUnits = exports.lengthUnits = new Set(['backgroundPositionX', 'backgroundPositionY', 'blockSize', 'borderBlockEndWidth', 'borderBlockStartWidth', 'borderBlockWidth', 'borderVerticalWidth', 'borderVerticalWidth', 'borderBottomLeftRadius', 'borderBottomRightRadius', 'borderBottomWidth', 'borderEndEndRadius', 'borderEndStartRadius', 'borderInlineEndWidth', 'borderEndWidth', 'borderInlineStartWidth', 'borderStartWidth', 'borderInlineWidth', 'borderHorizontalWidth', 'borderLeftWidth', 'borderRightWidth', 'borderSpacing', 'borderStartEndRadius', 'borderStartStartRadius', 'borderTopLeftRadius', 'borderTopRightRadius', 'borderTopWidth', 'bottom', 'columnGap', 'columnRuleWidth', 'columnWidth', 'containIntrinsicBlockSize', 'containIntrinsicHeight', 'containIntrinsicInlineSize', 'containIntrinsicWidth', 'flexBasis', 'fontSize', 'fontSmooth', 'height', 'inlineSize', 'insetBlockEnd', 'insetBlockStart', 'insetInlineEnd', 'insetInlineStart', 'left', 'letterSpacing', 'marginBlockEnd', 'marginBlockStart', 'marginBottom', 'marginInlineEnd', 'marginEnd', 'marginInlineStart', 'marginStart', 'marginLeft', 'marginRight', 'marginTop', 'maxBlockSize', 'maxHeight', 'maxInlineSize', 'maxWidth', 'minBlockSize', 'minHeight', 'minInlineSize', 'minWidth', 'offsetDistance', 'outlineOffset', 'outlineWidth', 'overflowClipMargin', 'paddingBlockEnd', 'paddingBlockStart', 'paddingBottom', 'paddingInlineEnd', 'paddingEnd', 'paddingInlineStart', 'paddingStart', 'paddingLeft', 'paddingRight', 'paddingTop', 'perspective', 'right', 'rowGap', 'scrollMarginBlockEnd', 'scrollMarginBlockStart', 'scrollMarginBottom', 'scrollMarginInlineEnd', 'scrollMarginInlineStart', 'scrollMarginLeft', 'scrollMarginRight', 'scrollMarginTop', 'scrollPaddingBlockEnd', 'scrollPaddingBlockStart', 'scrollPaddingBottom', 'scrollPaddingInlineEnd', 'scrollPaddingInlineStart', 'scrollPaddingLeft', 'scrollPaddingRight', 'scrollPaddingTop', 'scrollSnapMarginBottom', 'scrollSnapMarginLeft', 'scrollSnapMarginRight', 'scrollSnapMarginTop', 'shapeMargin', 'tabSize', 'textDecorationThickness', 'textIndent', 'textUnderlineOffset', 'top', 'transformOrigin', 'translate', 'verticalAlign', 'width', 'wordSpacing', 'border', 'borderBlock', 'borderBlockEnd', 'borderBlockStart', 'borderBottom', 'borderLeft', 'borderRadius', 'borderRight', 'borderTop', 'borderWidth', 'columnRule', 'containIntrinsicSize', 'gap', 'inset', 'insetBlock', 'insetInline', 'margin', 'marginBlock', 'marginVertical', 'marginInline', 'marginHorizontal', 'offset', 'outline', 'padding', 'paddingBlock', 'paddingVertical', 'paddingInline', 'paddingHorizontal', 'scrollMargin', 'scrollMarginBlock', 'scrollMarginInline', 'scrollPadding', 'scrollPaddingBlock', 'scrollPaddingInline', 'scrollSnapMargin']);

package/lib/types/index.js.flow

@@ -65,7 +65,7 @@ export interface CSSType<+_T: string | number = string | number> {
 
 declare export const isCSSType: (
   value: mixed,
-) => value is CSSType<string | number>;
+) => implies value is CSSType<string | number>;
 
 type AngleValue = string;
 declare export class Angle<+T: AngleValue>

package/lib/utils/default-options.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.defaultOptions = void 0;
 const defaultOptions = exports.defaultOptions = {
   dev: false,
+  debug: false,
   useRemForFontSize: true,
   test: false,
   classNamePrefix: 'x',

package/lib/utils/normalize-value.js

@@ -13,7 +13,7 @@ var _zeroDimensions = _interopRequireDefault(require("./normalizers/zero-dimensi
 var _detectUnclosedFns = _interopRequireDefault(require("./normalizers/detect-unclosed-fns"));
 var _postcssValueParser = _interopRequireDefault(require("postcss-value-parser"));
 var _convertCamelCaseValues = _interopRequireDefault(require("./normalizers/convert-camel-case-values"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const normalizers = [_detectUnclosedFns.default, _whitespace.default, _timings.default, _zeroDimensions.default, _leadingZero.default, _quotes.default, _convertCamelCaseValues.default];
 function normalizeValue(value, key, _ref) {
   let {

package/lib/utils/normalizers/convert-camel-case-values.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = convertCamelCasedValues;
 var _dashify = _interopRequireDefault(require("../dashify"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function convertCamelCasedValues(ast, key) {
   if (key !== 'transitionProperty' && key !== 'willChange') {
     return ast;

package/lib/utils/normalizers/detect-unclosed-fns.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = detectUnclosedFns;
 var messages = _interopRequireWildcard(require("../../messages"));
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function detectUnclosedFns(ast, _) {
   ast.walk(node => {
     if (node.type === 'function' && node.unclosed) {

package/lib/utils/normalizers/font-size-px-to-rem.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = convertFontSizeToRem;
 var _postcssValueParser = _interopRequireDefault(require("postcss-value-parser"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const ROOT_FONT_SIZE = 16;
 function convertFontSizeToRem(ast, key) {
   if (key !== 'fontSize') {

package/lib/utils/normalizers/leading-zero.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = normalizeLeadingZero;
 var _postcssValueParser = _interopRequireDefault(require("postcss-value-parser"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function normalizeLeadingZero(ast, _) {
   ast.walk(node => {
     if (node.type !== 'word') {

package/lib/utils/normalizers/timings.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = normalizeTimings;
 var _postcssValueParser = _interopRequireDefault(require("postcss-value-parser"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function normalizeTimings(ast, _) {
   ast.walk(node => {
     if (node.type !== 'word') {

package/lib/utils/normalizers/zero-dimensions.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = normalizeZeroDimensions;
 var _postcssValueParser = _interopRequireDefault(require("postcss-value-parser"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const angles = ['deg', 'grad', 'turn', 'rad'];
 const timings = ['ms', 's'];
 const fraction = 'fr';

package/lib/utils/object-utils.d.ts

@@ -9,7 +9,8 @@
 
 import type { CompiledStyles } from '../common-types';
 import { IncludedStyles } from '../stylex-include';
-export declare function isPlainObject(obj: unknown): void;
+type AnyObject = { readonly [$$Key$$: string]: unknown };
+export declare function isPlainObject(obj: unknown): obj is AnyObject;
 export declare function flattenObject(obj: CompiledStyles): {
   readonly [$$Key$$: string]: null | string | IncludedStyles;
 };
@@ -42,7 +43,7 @@ export declare function objMapEntry<
   K2 extends string = string,
 >(
   obj: { readonly [$$Key$$: K1]: V },
-  mapper: ($$PARAM_0$$: [K1, V]) => [K2, V2],
+  mapper: ($$PARAM_0$$: Readonly<[K1, V]>) => Readonly<[K2, V2]>,
 ): { readonly [$$Key$$: K2]: V2 };
 export declare function objMap<V, V2, K extends string = string>(
   obj: { readonly [$$Key$$: K]: V },

package/lib/utils/object-utils.js.flow

@@ -13,7 +13,10 @@ import type { CompiledStyles } from '../common-types';
 
 import { IncludedStyles } from '../stylex-include';
 
-declare export function isPlainObject(obj: mixed): void;
+// eslint-disable-next-line no-unused-vars
+type AnyObject = { +[string]: mixed };
+
+declare export function isPlainObject(obj: mixed): implies obj is AnyObject;
 
 declare export function flattenObject(obj: CompiledStyles): {
   +[string]: null | string | IncludedStyles,
@@ -48,7 +51,7 @@ declare export function objMapEntry<
   K2: string = string,
 >(
   obj: { +[K1]: V },
-  mapper: ([K1, V]) => [K2, V2],
+  mapper: ($ReadOnly<[K1, V]>) => $ReadOnly<[K2, V2]>,
 ): { +[K2]: V2 };
 
 declare export function objMap<V, V2, K: string = string>(

package/lib/utils/property-priorities.d.ts

@@ -7,62 +7,9 @@
  *
  */
 
-type PseudoClassPriorities = {
-  ':is': 40;
-  ':where': 40;
-  ':not': 40;
-  ':has': 45;
-  ':dir': 50;
-  ':lang': 51;
-  ':first-child': 52;
-  ':first-of-type': 53;
-  ':last-child': 54;
-  ':last-of-type': 55;
-  ':only-child': 56;
-  ':only-of-type': 57;
-  ':nth-child': 60;
-  ':nth-last-child': 61;
-  ':nth-of-type': 62;
-  ':nth-last-of-type': 63;
-  ':empty': 70;
-  ':link': 80;
-  ':any-link': 81;
-  ':local-link': 82;
-  ':target-within': 83;
-  ':target': 84;
-  ':visited': 85;
-  ':enabled': 91;
-  ':disabled': 92;
-  ':required': 93;
-  ':optional': 94;
-  ':read-only': 95;
-  ':read-write': 96;
-  ':placeholder-shown': 97;
-  ':in-range': 98;
-  ':out-of-range': 99;
-  ':default': 100;
-  ':checked': 101;
-  ':indeterminate': 101;
-  ':blank': 102;
-  ':valid': 103;
-  ':invalid': 104;
-  ':user-invalid': 105;
-  ':autofill': 110;
-  ':picture-in-picture': 120;
-  ':modal': 121;
-  ':fullscreen': 122;
-  ':paused': 123;
-  ':playing': 124;
-  ':current': 125;
-  ':past': 126;
-  ':future': 127;
-  ':hover': 130;
-  ':focusWithin': 140;
-  ':focus': 150;
-  ':focusVisible': 160;
-  ':active': 170;
-};
-export declare const PSEUDO_CLASS_PRIORITIES: Readonly<PseudoClassPriorities>;
+export declare const PSEUDO_CLASS_PRIORITIES: Readonly<{
+  [$$Key$$: string]: number;
+}>;
 type AtRulePriorities = { '@supports': 30; '@media': 200; '@container': 300 };
 export declare const AT_RULE_PRIORITIES: Readonly<AtRulePriorities>;
 export declare const PSEUDO_ELEMENT_PRIORITY: number;

package/lib/utils/property-priorities.js.flow

@@ -7,63 +7,63 @@
  * @flow strict
  */
 
-type PseudoClassPriorities = {
-  ':is': 40,
-  ':where': 40,
-  ':not': 40,
-  ':has': 45,
-  ':dir': 50,
-  ':lang': 51,
-  ':first-child': 52,
-  ':first-of-type': 53,
-  ':last-child': 54,
-  ':last-of-type': 55,
-  ':only-child': 56,
-  ':only-of-type': 57,
-  ':nth-child': 60,
-  ':nth-last-child': 61,
-  ':nth-of-type': 62,
-  ':nth-last-of-type': 63, // 'nth-last-of-type' is the same priority as 'nth-of-type
-  ':empty': 70,
-  ':link': 80,
-  ':any-link': 81,
-  ':local-link': 82,
-  ':target-within': 83,
-  ':target': 84,
-  ':visited': 85,
-  ':enabled': 91,
-  ':disabled': 92,
-  ':required': 93,
-  ':optional': 94,
-  ':read-only': 95,
-  ':read-write': 96,
-  ':placeholder-shown': 97,
-  ':in-range': 98,
-  ':out-of-range': 99,
-  ':default': 100,
-  ':checked': 101,
-  ':indeterminate': 101,
-  ':blank': 102,
-  ':valid': 103,
-  ':invalid': 104,
-  ':user-invalid': 105,
-  ':autofill': 110,
-  ':picture-in-picture': 120,
-  ':modal': 121,
-  ':fullscreen': 122,
-  ':paused': 123,
-  ':playing': 124,
-  ':current': 125,
-  ':past': 126,
-  ':future': 127,
-  ':hover': 130,
-  ':focusWithin': 140,
-  ':focus': 150,
-  ':focusVisible': 160,
-  ':active': 170,
-};
+// type PseudoClassPriorities = {
+//   ':is': 40,
+//   ':where': 40,
+//   ':not': 40,
+//   ':has': 45,
+//   ':dir': 50,
+//   ':lang': 51,
+//   ':first-child': 52,
+//   ':first-of-type': 53,
+//   ':last-child': 54,
+//   ':last-of-type': 55,
+//   ':only-child': 56,
+//   ':only-of-type': 57,
+//   ':nth-child': 60,
+//   ':nth-last-child': 61,
+//   ':nth-of-type': 62,
+//   ':nth-last-of-type': 63, // 'nth-last-of-type' is the same priority as 'nth-of-type
+//   ':empty': 70,
+//   ':link': 80,
+//   ':any-link': 81,
+//   ':local-link': 82,
+//   ':target-within': 83,
+//   ':target': 84,
+//   ':visited': 85,
+//   ':enabled': 91,
+//   ':disabled': 92,
+//   ':required': 93,
+//   ':optional': 94,
+//   ':read-only': 95,
+//   ':read-write': 96,
+//   ':placeholder-shown': 97,
+//   ':in-range': 98,
+//   ':out-of-range': 99,
+//   ':default': 100,
+//   ':checked': 101,
+//   ':indeterminate': 101,
+//   ':blank': 102,
+//   ':valid': 103,
+//   ':invalid': 104,
+//   ':user-invalid': 105,
+//   ':autofill': 110,
+//   ':picture-in-picture': 120,
+//   ':modal': 121,
+//   ':fullscreen': 122,
+//   ':paused': 123,
+//   ':playing': 124,
+//   ':current': 125,
+//   ':past': 126,
+//   ':future': 127,
+//   ':hover': 130,
+//   ':focusWithin': 140,
+//   ':focus': 150,
+//   ':focusVisible': 160,
+//   ':active': 170,
+// };
 
-declare export const PSEUDO_CLASS_PRIORITIES: $ReadOnly<PseudoClassPriorities>;
+declare export const PSEUDO_CLASS_PRIORITIES: $ReadOnly<{ [string]: number }>;
 
 type AtRulePriorities = {
   '@supports': 30,

package/lib/utils/rule-utils.d.ts

@@ -0,0 +1,15 @@
+/**
+ * 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 declare const sortPseudos: (
+  pseudos: ReadonlyArray<string>,
+) => ReadonlyArray<string>;
+export declare const sortAtRules: (
+  atRules: ReadonlyArray<string>,
+) => ReadonlyArray<string>;

package/lib/utils/rule-utils.js

@@ -0,0 +1,41 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.sortPseudos = exports.sortAtRules = void 0;
+var _objectUtils = require("./object-utils");
+const sortPseudos = pseudos => {
+  if (pseudos.length < 2) {
+    return pseudos;
+  }
+  return pseudos.reduce((acc, pseudo) => {
+    if (pseudo.startsWith('::')) {
+      return [...acc, pseudo];
+    }
+    const lastElement = acc[acc.length - 1];
+    const allButLast = acc.slice(0, acc.length - 1);
+    if (Array.isArray(lastElement)) {
+      return [...allButLast, [...lastElement, pseudo]];
+    } else {
+      return [...allButLast, lastElement, [pseudo]].filter(Boolean);
+    }
+  }, []).flatMap(pseudo => {
+    if (Array.isArray(pseudo)) {
+      return (0, _objectUtils.arraySort)(pseudo, stringComparator);
+    }
+    return [pseudo];
+  });
+};
+exports.sortPseudos = sortPseudos;
+const sortAtRules = atRules => (0, _objectUtils.arraySort)(atRules);
+exports.sortAtRules = sortAtRules;
+const stringComparator = (a, b) => {
+  if (a === 'default') {
+    return -1;
+  }
+  if (b === 'default') {
+    return 1;
+  }
+  return a.localeCompare(b);
+};

package/lib/utils/rule-utils.js.flow

@@ -0,0 +1,16 @@
+/**
+ * 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
+ */
+
+declare export const sortPseudos: (
+  pseudos: $ReadOnlyArray<string>,
+) => $ReadOnlyArray<string>;
+
+declare export const sortAtRules: (
+  atRules: $ReadOnlyArray<string>,
+) => $ReadOnlyArray<string>;

package/lib/utils/split-css-value.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = splitValue;
 var _postcssValueParser = _interopRequireDefault(require("postcss-value-parser"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function printNode(node) {
   switch (node.type) {
     case 'word':

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stylexjs/shared",
-  "version": "0.7.5",
+  "version": "0.9.0-beta.1",
   "main": "lib/index.js",
   "repository": "https://www.github.com/facebook/stylex",
   "license": "MIT",
@@ -13,7 +13,7 @@
     "postcss-value-parser": "^4.1.0"
   },
   "devDependencies": {
-    "@stylexjs/scripts": "0.7.5"
+    "@stylexjs/scripts": "0.9.0-beta.1"
   },
   "jest": {
     "snapshotFormat": {