@stylexjs/stylex 0.3.0 → 0.4.1

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

@@ -1,1046 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`custom properties filters out the property and emits a warning when encountering a variable name which has not been provided 1`] = `{}`;
-
-exports[`custom properties resolves custom properties' values 1`] = `
-{
-  "style": {
-    "color": "#333",
-    "width": 42,
-  },
-}
-`;
-
-exports[`length units 10 "em" units are resolved to pixels 1`] = `
-{
-  "style": {
-    "width": 160,
-  },
-}
-`;
-
-exports[`length units 10 "em" units based on inherited font-size 1`] = `
-{
-  "style": {
-    "width": 120,
-  },
-}
-`;
-
-exports[`length units 10 "px" units are resolved to pixels 1`] = `
-{
-  "style": {
-    "width": 10,
-  },
-}
-`;
-
-exports[`length units 10 "rem" units are resolved to pixels 1`] = `
-{
-  "style": {
-    "width": 160,
-  },
-}
-`;
-
-exports[`length units 10 "vh" units are resolved to pixels 1`] = `
-{
-  "style": {
-    "width": 60,
-  },
-}
-`;
-
-exports[`length units 10 "vmax" units are resolved to pixels 1`] = `
-{
-  "style": {
-    "width": 60,
-  },
-}
-`;
-
-exports[`length units 10 "vmin" units are resolved to pixels 1`] = `
-{
-  "style": {
-    "width": 32,
-  },
-}
-`;
-
-exports[`length units 10 "vw" units are resolved to pixels 1`] = `
-{
-  "style": {
-    "width": 32,
-  },
-}
-`;
-
-exports[`logical styles blockSize: blockSize 1`] = `
-{
-  "style": {
-    "height": 100,
-  },
-}
-`;
-
-exports[`logical styles blockSize: blockSize after height 1`] = `
-{
-  "style": {
-    "height": 200,
-  },
-}
-`;
-
-exports[`logical styles blockSize: maxBlockSize 1`] = `
-{
-  "style": {
-    "maxHeight": 100,
-  },
-}
-`;
-
-exports[`logical styles blockSize: maxBlockSize after maxHeight 1`] = `
-{
-  "style": {
-    "maxHeight": 200,
-  },
-}
-`;
-
-exports[`logical styles blockSize: minBlockSize 1`] = `
-{
-  "style": {
-    "minHeight": 100,
-  },
-}
-`;
-
-exports[`logical styles blockSize: minBlockSize after minHeight 1`] = `
-{
-  "style": {
-    "minHeight": 200,
-  },
-}
-`;
-
-exports[`logical styles borderBlock: borderBlock 1`] = `
-{
-  "style": {
-    "borderBottomColor": "black",
-    "borderBottomStyle": "solid",
-    "borderBottomWidth": 1,
-    "borderTopColor": "black",
-    "borderTopStyle": "solid",
-    "borderTopWidth": 1,
-  },
-}
-`;
-
-exports[`logical styles borderBlock: borderBlock after borderBlockEnd 1`] = `
-{
-  "style": {
-    "borderBottomColor": "red",
-    "borderBottomStyle": "dotted",
-    "borderBottomWidth": 2,
-    "borderTopColor": "black",
-    "borderTopStyle": "solid",
-    "borderTopWidth": 1,
-  },
-}
-`;
-
-exports[`logical styles borderBlock: borderBlock after borderBlockStart 1`] = `
-{
-  "style": {
-    "borderBottomColor": "black",
-    "borderBottomStyle": "solid",
-    "borderBottomWidth": 1,
-    "borderTopColor": "green",
-    "borderTopStyle": "dashed",
-    "borderTopWidth": 3,
-  },
-}
-`;
-
-exports[`logical styles borderBlock: borderBlockEnd 1`] = `
-{
-  "style": {
-    "borderBottomColor": "red",
-    "borderBottomStyle": "dotted",
-    "borderBottomWidth": 2,
-  },
-}
-`;
-
-exports[`logical styles borderBlock: borderBlockStart 1`] = `
-{
-  "style": {
-    "borderTopColor": "green",
-    "borderTopStyle": "dashed",
-    "borderTopWidth": 3,
-  },
-}
-`;
-
-exports[`logical styles borderInline: borderInline 1`] = `
-{
-  "style": {
-    "borderEndColor": "black",
-    "borderEndStyle": "solid",
-    "borderEndWidth": 1,
-    "borderStartColor": "black",
-    "borderStartStyle": "solid",
-    "borderStartWidth": 1,
-  },
-}
-`;
-
-exports[`logical styles borderInline: borderInline after borderInlineEnd 1`] = `
-{
-  "style": {
-    "borderEndColor": "red",
-    "borderEndStyle": "dotted",
-    "borderEndWidth": 2,
-    "borderStartColor": "black",
-    "borderStartStyle": "solid",
-    "borderStartWidth": 1,
-  },
-}
-`;
-
-exports[`logical styles borderInline: borderInline after borderInlineStart 1`] = `
-{
-  "style": {
-    "borderEndColor": "black",
-    "borderEndStyle": "solid",
-    "borderEndWidth": 1,
-    "borderStartColor": "green",
-    "borderStartStyle": "dashed",
-    "borderStartWidth": 3,
-  },
-}
-`;
-
-exports[`logical styles borderInline: borderInlineEnd 1`] = `
-{
-  "style": {
-    "borderEndColor": "red",
-    "borderEndStyle": "dotted",
-    "borderEndWidth": 2,
-  },
-}
-`;
-
-exports[`logical styles borderInline: borderInlineStart 1`] = `
-{
-  "style": {
-    "borderStartColor": "green",
-    "borderStartStyle": "dashed",
-    "borderStartWidth": 3,
-  },
-}
-`;
-
-exports[`logical styles borderRadius: endend 1`] = `
-{
-  "style": {
-    "borderBottomEndRadius": 10,
-  },
-}
-`;
-
-exports[`logical styles borderRadius: endstart 1`] = `
-{
-  "style": {
-    "borderBottomStartRadius": 10,
-  },
-}
-`;
-
-exports[`logical styles borderRadius: startend 1`] = `
-{
-  "style": {
-    "borderTopEndRadius": 10,
-  },
-}
-`;
-
-exports[`logical styles borderRadius: startstart 1`] = `
-{
-  "style": {
-    "borderTopStartRadius": 10,
-  },
-}
-`;
-
-exports[`logical styles inlineSize: inlineSize 1`] = `
-{
-  "style": {
-    "width": 100,
-  },
-}
-`;
-
-exports[`logical styles inlineSize: inlineSize after width 1`] = `
-{
-  "style": {
-    "width": 200,
-  },
-}
-`;
-
-exports[`logical styles inlineSize: maxInlineSize 1`] = `
-{
-  "style": {
-    "maxWidth": 100,
-  },
-}
-`;
-
-exports[`logical styles inlineSize: maxInlineSize after maxWidth 1`] = `
-{
-  "style": {
-    "maxWidth": 200,
-  },
-}
-`;
-
-exports[`logical styles inlineSize: minInlineSize 1`] = `
-{
-  "style": {
-    "minWidth": 100,
-  },
-}
-`;
-
-exports[`logical styles inlineSize: minInlineSize after minWidth 1`] = `
-{
-  "style": {
-    "minWidth": 200,
-  },
-}
-`;
-
-exports[`logical styles inset: inset 1`] = `
-{
-  "style": {
-    "bottom": 1,
-    "end": 1,
-    "start": 1,
-    "top": 1,
-  },
-}
-`;
-
-exports[`logical styles inset: inset vs top 1`] = `
-{
-  "style": {
-    "bottom": 100,
-    "left": 10,
-    "right": 10,
-    "top": 100,
-  },
-}
-`;
-
-exports[`logical styles inset: insetBlock 1`] = `
-{
-  "style": {
-    "bottom": 2,
-    "top": 2,
-  },
-}
-`;
-
-exports[`logical styles inset: insetBlock vs top 1`] = `
-{
-  "style": {
-    "bottom": 100,
-    "top": 100,
-  },
-}
-`;
-
-exports[`logical styles inset: insetBlockEnd 1`] = `
-{
-  "style": {
-    "bottom": 4,
-  },
-}
-`;
-
-exports[`logical styles inset: insetBlockEnd vs bottom 1`] = `
-{
-  "style": {
-    "bottom": 100,
-  },
-}
-`;
-
-exports[`logical styles inset: insetBlockStart 1`] = `
-{
-  "style": {
-    "top": 3,
-  },
-}
-`;
-
-exports[`logical styles inset: insetBlockStart vs top 1`] = `
-{
-  "style": {
-    "top": 100,
-  },
-}
-`;
-
-exports[`logical styles inset: insetInline 1`] = `
-{
-  "style": {
-    "end": 5,
-    "start": 5,
-  },
-}
-`;
-
-exports[`logical styles inset: insetInlineEnd 1`] = `
-{
-  "style": {
-    "end": 7,
-  },
-}
-`;
-
-exports[`logical styles inset: insetInlineStart 1`] = `
-{
-  "style": {
-    "start": 6,
-  },
-}
-`;
-
-exports[`logical styles margin: marginBlock 1`] = `
-{
-  "style": {
-    "marginVertical": 1,
-  },
-}
-`;
-
-exports[`logical styles margin: marginBlockEnd 1`] = `
-{
-  "style": {
-    "marginBottom": 3,
-  },
-}
-`;
-
-exports[`logical styles margin: marginBlockStart 1`] = `
-{
-  "style": {
-    "marginTop": 2,
-  },
-}
-`;
-
-exports[`logical styles margin: marginInline 1`] = `
-{
-  "style": {
-    "marginHorizontal": 1,
-  },
-}
-`;
-
-exports[`logical styles margin: marginInlineEnd 1`] = `
-{
-  "style": {
-    "marginEnd": 3,
-  },
-}
-`;
-
-exports[`logical styles margin: marginInlineStart 1`] = `
-{
-  "style": {
-    "marginStart": 2,
-  },
-}
-`;
-
-exports[`logical styles padding: paddingBlock 1`] = `
-{
-  "style": {
-    "paddingVertical": 1,
-  },
-}
-`;
-
-exports[`logical styles padding: paddingBlockEnd 1`] = `
-{
-  "style": {
-    "paddingBottom": 3,
-  },
-}
-`;
-
-exports[`logical styles padding: paddingBlockStart 1`] = `
-{
-  "style": {
-    "paddingTop": 2,
-  },
-}
-`;
-
-exports[`logical styles padding: paddingInline 1`] = `
-{
-  "style": {
-    "paddingHorizontal": 1,
-  },
-}
-`;
-
-exports[`logical styles padding: paddingInlineEnd 1`] = `
-{
-  "style": {
-    "paddingEnd": 3,
-  },
-}
-`;
-
-exports[`logical styles padding: paddingInlineStart 1`] = `
-{
-  "style": {
-    "paddingStart": 2,
-  },
-}
-`;
-
-exports[`logical styles textAlign: end 1`] = `
-{
-  "style": {
-    "textAlign": "end",
-  },
-}
-`;
-
-exports[`logical styles textAlign: start 1`] = `
-{
-  "style": {
-    "textAlign": "start",
-  },
-}
-`;
-
-exports[`styles :hover syntax: hovered 1`] = `
-{
-  "style": {
-    "backgroundColor": "blue",
-  },
-}
-`;
-
-exports[`styles :hover syntax: not hovered 1`] = `
-{
-  "style": {
-    "backgroundColor": "red",
-  },
-}
-`;
-
-exports[`styles animation-delay 1`] = `
-{
-  "style": {
-    "animationDelay": 300,
-  },
-}
-`;
-
-exports[`styles animation-duration 1`] = `
-{
-  "style": {
-    "animationDuration": 500,
-  },
-}
-`;
-
-exports[`styles border-style 1`] = `
-{
-  "style": {
-    "borderWidth": 0,
-  },
-}
-`;
-
-exports[`styles border-style 2`] = `
-{
-  "style": {
-    "borderStyle": "solid",
-    "borderWidth": 10,
-  },
-}
-`;
-
-exports[`styles box-shadow 1`] = `
-{
-  "style": {
-    "shadowColor": "red",
-    "shadowOffset": {
-      "height": 2,
-      "width": 1,
-    },
-    "shadowOpacity": 1,
-    "shadowRadius": 3,
-  },
-}
-`;
-
-exports[`styles box-sizing: content-box: allDifferent 1`] = `
-{
-  "style": {
-    "borderBottomWidth": 3,
-    "borderLeftWidth": 4,
-    "borderRightWidth": 2,
-    "borderTopWidth": 1,
-    "height": 144,
-    "paddingBottom": 30,
-    "paddingLeft": 40,
-    "paddingRight": 20,
-    "paddingTop": 10,
-    "width": 166,
-  },
-}
-`;
-
-exports[`styles box-sizing: content-box: auto 1`] = `
-{
-  "style": {
-    "borderWidth": 2,
-    "height": 74,
-    "padding": 10,
-    "width": "auto",
-  },
-}
-`;
-
-exports[`styles box-sizing: content-box: height 1`] = `
-{
-  "style": {
-    "borderWidth": 2,
-    "height": 74,
-    "padding": 10,
-  },
-}
-`;
-
-exports[`styles box-sizing: content-box: maxHeight 1`] = `
-{
-  "style": {
-    "borderWidth": 2,
-    "maxHeight": 74,
-    "padding": 10,
-  },
-}
-`;
-
-exports[`styles box-sizing: content-box: maxWidth 1`] = `
-{
-  "style": {
-    "borderWidth": 2,
-    "maxWidth": 124,
-    "padding": 10,
-  },
-}
-`;
-
-exports[`styles box-sizing: content-box: minHeight 1`] = `
-{
-  "style": {
-    "borderWidth": 2,
-    "minHeight": 74,
-    "padding": 10,
-  },
-}
-`;
-
-exports[`styles box-sizing: content-box: minWidth 1`] = `
-{
-  "style": {
-    "borderWidth": 2,
-    "minWidth": 124,
-    "padding": 10,
-  },
-}
-`;
-
-exports[`styles box-sizing: content-box: units 1`] = `
-{
-  "style": {
-    "borderWidth": 2,
-    "height": 86,
-    "padding": 16,
-    "width": 136,
-  },
-}
-`;
-
-exports[`styles box-sizing: content-box: width 1`] = `
-{
-  "style": {
-    "borderWidth": 2,
-    "overflow": "hidden",
-    "padding": 10,
-    "width": 124,
-  },
-}
-`;
-
-exports[`styles direction 1`] = `
-{
-  "style": {
-    "direction": "ltr",
-  },
-}
-`;
-
-exports[`styles direction 2`] = `
-{
-  "style": {
-    "direction": "rtl",
-  },
-}
-`;
-
-exports[`styles font-size: default 1`] = `
-{
-  "style": {
-    "fontSize": 40,
-  },
-}
-`;
-
-exports[`styles font-size: fontScale:2 1`] = `
-{
-  "style": {
-    "fontSize": 80,
-  },
-}
-`;
-
-exports[`styles font-variant 1`] = `
-{
-  "style": {
-    "fontVariant": "common-ligatures small-caps",
-  },
-}
-`;
-
-exports[`styles font-weight 1`] = `
-{
-  "style": {
-    "fontWeight": "900",
-  },
-}
-`;
-
-exports[`styles font-weight 2`] = `
-{
-  "style": {
-    "fontWeight": "bold",
-  },
-}
-`;
-
-exports[`styles line-clamp 1`] = `
-{
-  "numberOfLines": 3,
-}
-`;
-
-exports[`styles line-height: px 1`] = `
-{
-  "style": {
-    "lineHeight": 24,
-  },
-}
-`;
-
-exports[`styles line-height: rem 1`] = `
-{
-  "style": {
-    "lineHeight": 24,
-  },
-}
-`;
-
-exports[`styles line-height: unitless number 1`] = `
-{
-  "style": {
-    "lineHeight": 24,
-  },
-}
-`;
-
-exports[`styles line-height: unitless string 1`] = `
-{
-  "style": {
-    "lineHeight": 24,
-  },
-}
-`;
-
-exports[`styles object-fit: contain 1`] = `
-{
-  "style": {
-    "objectFit": "contain",
-  },
-}
-`;
-
-exports[`styles object-fit: contain 2`] = `
-{
-  "style": {
-    "objectFit": "cover",
-  },
-}
-`;
-
-exports[`styles object-fit: fill 1`] = `
-{
-  "style": {
-    "objectFit": "fill",
-  },
-}
-`;
-
-exports[`styles object-fit: none 1`] = `
-{
-  "style": {
-    "objectFit": "none",
-  },
-}
-`;
-
-exports[`styles object-fit: scaleDown 1`] = `
-{
-  "style": {
-    "objectFit": "scale-down",
-  },
-}
-`;
-
-exports[`styles pointer-events 1`] = `
-{
-  "style": {
-    "pointerEvents": "none",
-  },
-}
-`;
-
-exports[`styles position: absolute 1`] = `
-{
-  "style": {
-    "position": "absolute",
-  },
-}
-`;
-
-exports[`styles position: fixed 1`] = `
-{
-  "style": {
-    "position": "absolute",
-  },
-}
-`;
-
-exports[`styles position: relative 1`] = `
-{
-  "style": {
-    "position": "relative",
-  },
-}
-`;
-
-exports[`styles position: static 1`] = `
-{
-  "style": {
-    "position": "relative",
-  },
-}
-`;
-
-exports[`styles position: sticky 1`] = `
-{
-  "style": {
-    "position": "relative",
-  },
-}
-`;
-
-exports[`styles text-shadow 1`] = `
-{
-  "style": {
-    "textShadowColor": "red",
-    "textShadowOffset": {
-      "height": 2,
-      "width": 1,
-    },
-    "textShadowRadius": 3,
-  },
-}
-`;
-
-exports[`styles text-shadow 2`] = `
-{
-  "style": {
-    "textShadowColor": "red",
-    "textShadowOffset": {
-      "height": 2,
-      "width": 1,
-    },
-    "textShadowRadius": 3,
-  },
-}
-`;
-
-exports[`styles transform: matrix 1`] = `
-{
-  "style": {
-    "transform": "matrix(0.1, 1, -0.3, 1, 0, 0)",
-  },
-}
-`;
-
-exports[`styles transform: mixed 1`] = `
-{
-  "style": {
-    "transform": "
-          rotateX(1deg) rotateY(2deg) rotateZ(3deg) rotate3d(1deg, 2deg, 3deg)
-          scale(1) scaleX(2) scaleY(3) scaleZ(4) scale3d(1,2,3)
-          translateX(1px) translateY(1em) translateZ(1rem) translate3d(1px, 1em, 1rem)
-        ",
-  },
-}
-`;
-
-exports[`styles transform: none 1`] = `
-{
-  "style": {
-    "transform": "none",
-  },
-}
-`;
-
-exports[`styles transform: perspective 1`] = `
-{
-  "style": {
-    "transform": "perspective(10px)",
-  },
-}
-`;
-
-exports[`styles transform: rotate 1`] = `
-{
-  "style": {
-    "transform": "rotate(10deg) rotateX(20deg) rotateY(30deg) rotateZ(40deg) rotate3d(0, 0.5, 1, 90deg)",
-  },
-}
-`;
-
-exports[`styles transform: rotate 2`] = `
-{
-  "style": {
-    "transform": "rotate(10deg) rotateX(20deg) rotateY(30deg) rotateZ(40deg) rotate3d(0, 0.5, 1, 90deg)",
-  },
-}
-`;
-
-exports[`styles transform: scale 1`] = `
-{
-  "style": {
-    "transform": "scale(1, 2) scaleX(1) scaleY(2) scaleZ(3) scale3d(1, 2, 3)",
-  },
-}
-`;
-
-exports[`styles transform: skew 1`] = `
-{
-  "style": {
-    "transform": "skew(10deg, 15deg) skewX(20deg) skewY(30deg)",
-  },
-}
-`;
-
-exports[`styles transform: translate 1`] = `
-{
-  "style": {
-    "transform": "translate(10px, 20px) translateX(11px) translateY(12px) translateZ(13px) translate3d(20px, 30px, 40px)",
-  },
-}
-`;
-
-exports[`styles transition-delay 1`] = `
-{
-  "style": {
-    "transitionDelay": 300,
-  },
-}
-`;
-
-exports[`styles transition-duration 1`] = `
-{
-  "style": {
-    "transitionDuration": 500,
-  },
-}
-`;
-
-exports[`styles user-select 1`] = `
-{
-  "style": {
-    "userSelect": "none",
-  },
-}
-`;
-
-exports[`styles vertical-align: middle 1`] = `
-{
-  "style": {
-    "verticalAlign": "middle",
-  },
-}
-`;
-
-exports[`styles vertical-align: top 1`] = `
-{
-  "style": {
-    "verticalAlign": "top",
-  },
-}
-`;
-
-exports[`unsupported style properties "filter" 1`] = `{}`;
-
-exports[`unsupported style properties "marginEnd" 1`] = `{}`;
-
-exports[`unsupported style properties "marginHorizontal" 1`] = `{}`;
-
-exports[`unsupported style properties "marginStart" 1`] = `{}`;
-
-exports[`unsupported style properties "marginVertical" 1`] = `{}`;
-
-exports[`unsupported style properties "paddingHorizontal" 1`] = `{}`;
-
-exports[`unsupported style properties "paddingVertical" 1`] = `{}`;
-
-exports[`unsupported style properties "transitionProperty" passthrough 1`] = `
-{
-  "style": {
-    "transitionProperty": "opacity",
-  },
-}
-`;
-
-exports[`unsupported style values calc 1`] = `{}`;
-
-exports[`unsupported style values inherit 1`] = `{}`;
-
-exports[`unsupported style values initial 1`] = `{}`;