@stylexjs/shared 0.2.0-beta.9 → 0.4.0

package/lib/preprocess-rules/PreRule.js

@@ -0,0 +1,87 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.PreRuleSet = exports.PreRule = exports.PreIncludedStylesRule = exports.NullPreRule = void 0;
+var _convertToClassName = require("../convert-to-className");
+var _objectUtils = require("../utils/object-utils");
+class NullPreRule {
+  compiled(_options) {
+    return [null];
+  }
+  equals(other) {
+    return other instanceof NullPreRule;
+  }
+}
+exports.NullPreRule = NullPreRule;
+class PreIncludedStylesRule {
+  constructor(IncludedStyles) {
+    this.includedStyles = IncludedStyles;
+  }
+  equals(other) {
+    return other instanceof PreIncludedStylesRule && this.includedStyles === other.includedStyles;
+  }
+  compiled(_options) {
+    return this.includedStyles;
+  }
+}
+exports.PreIncludedStylesRule = PreIncludedStylesRule;
+const stringComparator = (a, b) => {
+  if (a === 'default') {
+    return -1;
+  }
+  if (b === 'default') {
+    return 1;
+  }
+  return a.localeCompare(b);
+};
+class PreRule {
+  constructor(property, value, pseudos, atRules) {
+    this.property = property;
+    this.value = value;
+    this.pseudos = pseudos ? (0, _objectUtils.arraySort)(pseudos, stringComparator) : [];
+    this.atRules = atRules ? (0, _objectUtils.arraySort)(atRules) : [];
+  }
+  compiled(options) {
+    const [_key, className, rule] = (0, _convertToClassName.convertStyleToClassName)([this.property, this.value], this.pseudos ?? [], this.atRules ?? [], options);
+    return [[className, rule]];
+  }
+  equals(other) {
+    if (!(other instanceof PreRule)) {
+      return false;
+    }
+    const valuesEqual = Array.isArray(this.value) && Array.isArray(other.value) ? (0, _objectUtils.arrayEquals)(this.value, other.value) : this.value === other.value;
+    return this.property === other.property && valuesEqual && (0, _objectUtils.arrayEquals)(this.pseudos, other.pseudos) && (0, _objectUtils.arrayEquals)(this.atRules, other.atRules);
+  }
+}
+exports.PreRule = PreRule;
+class PreRuleSet {
+  constructor(rules) {
+    this.rules = rules;
+  }
+  static create(rules) {
+    const flatRules = rules.flatMap(rule => rule instanceof PreRuleSet ? rule.rules : [rule]);
+    if (flatRules.length === 0) {
+      return new NullPreRule();
+    }
+    if (flatRules.length === 1) {
+      return flatRules[0];
+    }
+    return new PreRuleSet(flatRules);
+  }
+  compiled(options) {
+    const styleTuple = this.rules.flatMap(rule => rule.compiled(options)).filter(Boolean);
+    return styleTuple.length > 0 ? styleTuple : [null];
+  }
+  equals(other) {
+    if (!(other instanceof PreRuleSet)) {
+      return false;
+    }
+    if (this.rules.length !== other.rules.length) {
+      return false;
+    }
+    return (0, _objectUtils.arrayEquals)(this.rules, other.rules, (a, b) => a.equals(b));
+  }
+}
+exports.PreRuleSet = PreRuleSet;

package/lib/preprocess-rules/PreRule.js.flow

@@ -0,0 +1,64 @@
+/**
+ * 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
+ */
+
+import type { InjectableStyle, StyleXOptions } from '../common-types';
+import type { IncludedStyles } from '../stylex-include';
+
+export type ComputedStyle = null | $ReadOnly<[string, InjectableStyle]>;
+
+// The classes in this file are used to represent objects that
+// can be compiled into one or CSS rules.
+//
+// These are thin wrappers around the "values" in Raw Style Objects
+// with all the metadata needed to compile them into CSS.
+export interface IPreRule {
+  compiled(
+    options: StyleXOptions,
+  ): IncludedStyles | $ReadOnlyArray<ComputedStyle>;
+  equals(other: IPreRule): boolean;
+}
+
+export type AnyPreRule = NullPreRule | PreRule | PreRuleSet;
+
+declare export class NullPreRule implements IPreRule {
+  compiled(_options: StyleXOptions): [null];
+  equals(other: IPreRule): boolean;
+}
+
+declare export class PreIncludedStylesRule implements IPreRule {
+  +includedStyles: IncludedStyles;
+  constructor(IncludedStyles: IncludedStyles): void;
+  equals(other: IPreRule): boolean;
+  compiled(_options: StyleXOptions): IncludedStyles;
+}
+
+declare export class PreRule implements IPreRule {
+  +property: string;
+  +value: string | number | $ReadOnlyArray<string | number>;
+  +pseudos: $ReadOnlyArray<string>;
+  +atRules: $ReadOnlyArray<string>;
+  constructor(
+    property: string,
+    value: string | number | $ReadOnlyArray<string | number>,
+    pseudos?: ?$ReadOnlyArray<string>,
+    atRules?: ?$ReadOnlyArray<string>,
+  ): void;
+  compiled(options: StyleXOptions): $ReadOnlyArray<[string, InjectableStyle]>;
+  equals(other: IPreRule): boolean;
+}
+
+declare export class PreRuleSet implements IPreRule {
+  +rules: $ReadOnlyArray<PreRule | NullPreRule>;
+  constructor(rules: $ReadOnlyArray<PreRule | NullPreRule>): void;
+  static create(
+    rules: $ReadOnlyArray<PreRule | NullPreRule | PreRuleSet>,
+  ): AnyPreRule;
+  compiled(options: StyleXOptions): $ReadOnlyArray<ComputedStyle>;
+  equals(other: IPreRule): boolean;
+}

package/lib/preprocess-rules/application-order.d.ts

@@ -0,0 +1,290 @@
+/**
+ * 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.
+ *
+ *
+ */
+
+import type { TStyleValue } from '../common-types';
+/**
+ * Shorthand properties:
+ * - [x] all - Should be banned
+ * - [x] animation
+ * - [x] background
+ * - [x] border
+ * - [x] border-block-end
+ * - [x] border-block-start
+ * - [x] border-bottom
+ * - [x] border-color
+ * - [x] border-image
+ * - [x] border-inline-end
+ * - [x] border-inline-start
+ * - [x] border-left
+ * - [x] border-radius
+ * - [x] border-right
+ * - [x] border-style
+ * - [x] border-top
+ * - [x] border-width
+ * - [x] column-rule
+ * - [x] columns
+ * - [x] container
+ * - [x] flex
+ * - [x] flex-flow
+ * - [x] font
+ * - [x] gap
+ * - [x] grid
+ * - [x] grid-area
+ * - [x] grid-column
+ * - [x] grid-row
+ * - [x] grid-template
+ * - [x] inset
+ * - [x] inset-block
+ * - [x] inset-inline
+ * - [x] list-style
+ * - [x] margin
+ * - [x] mask
+ * - [x] offset
+ * - [x] outline
+ * - [x] overflow
+ * - [x] padding
+ * - [x] place-content
+ * - [x] place-items
+ * - [x] place-self
+ * - [x] scroll-margin
+ * - [x] scroll-padding
+ * - [x] text-decoration
+ * - [x] text-emphasis
+ * - [x] transition
+ */
+
+/**
+ * Shorthand properties:
+ * - [x] all - Should be banned
+ * - [x] animation
+ * - [x] background
+ * - [x] border
+ * - [x] border-block-end
+ * - [x] border-block-start
+ * - [x] border-bottom
+ * - [x] border-color
+ * - [x] border-image
+ * - [x] border-inline-end
+ * - [x] border-inline-start
+ * - [x] border-left
+ * - [x] border-radius
+ * - [x] border-right
+ * - [x] border-style
+ * - [x] border-top
+ * - [x] border-width
+ * - [x] column-rule
+ * - [x] columns
+ * - [x] container
+ * - [x] flex
+ * - [x] flex-flow
+ * - [x] font
+ * - [x] gap
+ * - [x] grid
+ * - [x] grid-area
+ * - [x] grid-column
+ * - [x] grid-row
+ * - [x] grid-template
+ * - [x] inset
+ * - [x] inset-block
+ * - [x] inset-inline
+ * - [x] list-style
+ * - [x] margin
+ * - [x] mask
+ * - [x] offset
+ * - [x] outline
+ * - [x] overflow
+ * - [x] padding
+ * - [x] place-content
+ * - [x] place-items
+ * - [x] place-self
+ * - [x] scroll-margin
+ * - [x] scroll-padding
+ * - [x] text-decoration
+ * - [x] text-emphasis
+ * - [x] transition
+ */
+
+type TReturn = ReadonlyArray<[string, TStyleValue]>;
+declare const shorthands: {
+  all: (_: TStyleValue) => TReturn;
+  animation: (value: TStyleValue) => Array<[string, TStyleValue]>;
+  animationRange: (value: TStyleValue) => TReturn;
+  background: (value: TStyleValue) => TReturn;
+  backgroundPosition: (value: TStyleValue) => TReturn;
+  border: (rawValue: TStyleValue) => TReturn;
+  borderInline: (rawValue: TStyleValue) => TReturn;
+  borderBlock: (rawValue: TStyleValue) => TReturn;
+  borderTop: (rawValue: TStyleValue) => TReturn;
+  borderInlineEnd: (rawValue: TStyleValue) => TReturn;
+  borderRight: (rawValue: TStyleValue) => TReturn;
+  borderBottom: (rawValue: TStyleValue) => TReturn;
+  borderInlineStart: (rawValue: TStyleValue) => TReturn;
+  borderLeft: (rawValue: TStyleValue) => TReturn;
+  borderInlineWidth: (rawValue: TStyleValue) => TReturn;
+  borderInlineStyle: (rawValue: TStyleValue) => TReturn;
+  borderInlineColor: (rawValue: TStyleValue) => TReturn;
+  borderBlockWidth: (rawValue: TStyleValue) => TReturn;
+  borderBlockStyle: (rawValue: TStyleValue) => TReturn;
+  borderBlockColor: (rawValue: TStyleValue) => TReturn;
+  borderColor: (value: TStyleValue) => TReturn;
+  borderStyle: (value: TStyleValue) => TReturn;
+  borderWidth: (value: TStyleValue) => TReturn;
+  borderInlineStartColor: (value: TStyleValue) => TReturn;
+  borderInlineEndColor: (value: TStyleValue) => TReturn;
+  borderInlineStartStyle: (value: TStyleValue) => TReturn;
+  borderInlineEndStyle: (value: TStyleValue) => TReturn;
+  borderInlineStartWidth: (value: TStyleValue) => TReturn;
+  borderInlineEndWidth: (value: TStyleValue) => TReturn;
+  borderLeftColor: (value: TStyleValue) => TReturn;
+  borderRightColor: (value: TStyleValue) => TReturn;
+  borderLeftStyle: (value: TStyleValue) => TReturn;
+  borderRightStyle: (value: TStyleValue) => TReturn;
+  borderLeftWidth: (value: TStyleValue) => TReturn;
+  borderRightWidth: (value: TStyleValue) => TReturn;
+  borderRadius: (value: TStyleValue) => TReturn;
+  borderStartStartRadius: (value: TStyleValue) => TReturn;
+  borderStartEndRadius: (value: TStyleValue) => TReturn;
+  borderEndStartRadius: (value: TStyleValue) => TReturn;
+  borderEndEndRadius: (value: TStyleValue) => TReturn;
+  borderTopLeftRadius: (value: TStyleValue) => TReturn;
+  borderTopRightRadius: (value: TStyleValue) => TReturn;
+  borderBottomLeftRadius: (value: TStyleValue) => TReturn;
+  borderBottomRightRadius: (value: TStyleValue) => TReturn;
+  borderImage: (value: TStyleValue) => TReturn;
+  columnRule: (value: TStyleValue) => TReturn;
+  columns: (value: TStyleValue) => TReturn;
+  container: (value: TStyleValue) => TReturn;
+  containIntrinsicSize: (value: TStyleValue) => TReturn;
+  flex: (value: TStyleValue) => TReturn;
+  flexFlow: (value: TStyleValue) => TReturn;
+  font: (value: TStyleValue) => TReturn;
+  fontVariant: (value: TStyleValue) => TReturn;
+  gap: (value: TStyleValue) => TReturn;
+  grid: (value: TStyleValue) => TReturn;
+  gridArea: (value: TStyleValue) => TReturn;
+  gridRow: (value: TStyleValue) => TReturn;
+  gridColumn: (value: TStyleValue) => TReturn;
+  gridTemplate: (value: TStyleValue) => TReturn;
+  inset: (value: TStyleValue) => TReturn;
+  insetInline: (value: TStyleValue) => TReturn;
+  insetBlock: (value: TStyleValue) => TReturn;
+  insetInlineStart: (value: TStyleValue) => TReturn;
+  insetInlineEnd: (value: TStyleValue) => TReturn;
+  left: (value: TStyleValue) => TReturn;
+  right: (value: TStyleValue) => TReturn;
+  listStyle: (value: TStyleValue) => TReturn;
+  margin: (value: TStyleValue) => TReturn;
+  marginInline: (value: TStyleValue) => TReturn;
+  marginBlock: (value: TStyleValue) => TReturn;
+  marginInlineStart: (value: TStyleValue) => TReturn;
+  marginInlineEnd: (value: TStyleValue) => TReturn;
+  marginLeft: (value: TStyleValue) => TReturn;
+  marginRight: (value: TStyleValue) => TReturn;
+  mask: (value: TStyleValue) => TReturn;
+  maskBorder: (value: TStyleValue) => TReturn;
+  offset: (value: TStyleValue) => TReturn;
+  outline: (value: TStyleValue) => TReturn;
+  overflow: (value: TStyleValue) => TReturn;
+  padding: (rawValue: TStyleValue) => TReturn;
+  paddingInline: (rawValue: TStyleValue) => TReturn;
+  paddingBlock: (rawValue: TStyleValue) => TReturn;
+  paddingInlineStart: (value: TStyleValue) => TReturn;
+  paddingInlineEnd: (value: TStyleValue) => TReturn;
+  paddingLeft: (value: TStyleValue) => TReturn;
+  paddingRight: (value: TStyleValue) => TReturn;
+  placeContent: (value: TStyleValue) => TReturn;
+  placeItems: (value: TStyleValue) => TReturn;
+  placeSelf: (value: TStyleValue) => TReturn;
+  scrollMargin: (value: TStyleValue) => TReturn;
+  scrollMarginBlock: (value: TStyleValue) => TReturn;
+  scrollMarginInline: (value: TStyleValue) => TReturn;
+  scrollMarginInlineStart: (value: TStyleValue) => TReturn;
+  scrollMarginInlineEnd: (value: TStyleValue) => TReturn;
+  scrollMarginLeft: (value: TStyleValue) => TReturn;
+  scrollMarginRight: (value: TStyleValue) => TReturn;
+  scrollPadding: (value: TStyleValue) => TReturn;
+  scrollPaddingBlock: (value: TStyleValue) => TReturn;
+  scrollPaddingInline: (value: TStyleValue) => TReturn;
+  scrollPaddingInlineStart: (value: TStyleValue) => TReturn;
+  scrollPaddingInlineEnd: (value: TStyleValue) => TReturn;
+  scrollPaddingLeft: (value: TStyleValue) => TReturn;
+  scrollPaddingRight: (value: TStyleValue) => TReturn;
+  scrollSnapType: (value: TStyleValue) => TReturn;
+  scrollTimeline: (value: TStyleValue) => TReturn;
+  textDecoration: (value: TStyleValue) => TReturn;
+  textEmphasis: (value: TStyleValue) => TReturn;
+  transition: (value: TStyleValue) => TReturn;
+};
+declare const aliases: {
+  borderHorizontal: any;
+  borderVertical: any;
+  borderBlockStart: any;
+  borderEnd: any;
+  borderBlockEnd: any;
+  borderStart: any;
+  blockSize: (val: TStyleValue) => TReturn;
+  inlineSize: (val: TStyleValue) => TReturn;
+  minBlockSize: (val: TStyleValue) => TReturn;
+  minInlineSize: (val: TStyleValue) => TReturn;
+  maxBlockSize: (val: TStyleValue) => TReturn;
+  maxInlineSize: (val: TStyleValue) => TReturn;
+  borderHorizontalWidth: any;
+  borderHorizontalStyle: any;
+  borderHorizontalColor: any;
+  borderVerticalWidth: any;
+  borderVerticalStyle: any;
+  borderVerticalColor: any;
+  borderBlockStartColor: (value: TStyleValue) => TReturn;
+  borderBlockEndColor: (value: TStyleValue) => TReturn;
+  borderBlockStartStyle: (value: TStyleValue) => TReturn;
+  borderBlockEndStyle: (value: TStyleValue) => TReturn;
+  borderBlockStartWidth: (value: TStyleValue) => TReturn;
+  borderBlockEndWidth: (value: TStyleValue) => TReturn;
+  borderStartColor: any;
+  borderEndColor: any;
+  borderStartStyle: any;
+  borderEndStyle: any;
+  borderStartWidth: any;
+  borderEndWidth: any;
+  borderTopStartRadius: (value: TStyleValue) => TReturn;
+  borderTopEndRadius: (value: TStyleValue) => TReturn;
+  borderBottomStartRadius: (value: TStyleValue) => TReturn;
+  borderBottomEndRadius: (value: TStyleValue) => TReturn;
+  containIntrinsicBlockSize: (value: TStyleValue) => TReturn;
+  containIntrinsicInlineSize: (value: TStyleValue) => TReturn;
+  gridGap: any;
+  gridRowGap: (value: TStyleValue) => TReturn;
+  gridColumnGap: (value: TStyleValue) => TReturn;
+  marginBlockStart: (value: TStyleValue) => TReturn;
+  marginBlockEnd: (value: TStyleValue) => TReturn;
+  marginStart: any;
+  marginEnd: any;
+  marginHorizontal: any;
+  marginVertical: any;
+  overflowBlock: (value: TStyleValue) => TReturn;
+  overflowInline: (value: TStyleValue) => TReturn;
+  paddingBlockStart: (rawValue: TStyleValue) => TReturn;
+  paddingBlockEnd: (rawValue: TStyleValue) => TReturn;
+  paddingStart: any;
+  paddingEnd: any;
+  paddingHorizontal: any;
+  paddingVertical: any;
+  scrollMarginBlockStart: (value: TStyleValue) => TReturn;
+  scrollMarginBlockEnd: (value: TStyleValue) => TReturn;
+  insetBlockStart: (value: TStyleValue) => TReturn;
+  insetBlockEnd: (value: TStyleValue) => TReturn;
+  start: any;
+  end: any;
+};
+declare const $$EXPORT_DEFAULT_DECLARATION$$: Readonly</**
+ * > 239 |   ...typeof shorthands,
+ *       |   ^^^^^^^^^^^^^^^^^^^^ Unsupported feature: Translating "object types with complex spreads" is currently not supported.
+ **/
+any>;
+export default $$EXPORT_DEFAULT_DECLARATION$$;