@tamagui/react-native-web-internals 1.112.2

package/dist/cjs/StyleSheet/__tests__/compiler-test.native.js

@@ -0,0 +1,417 @@
+"use strict";
+var import_compiler = require("../compiler");
+describe("StyleSheet/compile", function() {
+  describe("atomic", function() {
+    test("converts style to atomic CSS", function() {
+      var result = (0, import_compiler.atomic)({
+        animationDirection: [
+          "alternate",
+          "alternate-reverse"
+        ],
+        animationKeyframes: [
+          {
+            "0%": {
+              top: 0
+            },
+            "50%": {
+              top: 5
+            },
+            "100%": {
+              top: 10
+            }
+          },
+          {
+            from: {
+              left: 0
+            },
+            to: {
+              left: 10
+            }
+          }
+        ],
+        fontFamily: "System",
+        marginHorizontal: 10,
+        marginStart: 1,
+        marginEnd: 2,
+        placeholderTextColor: "gray",
+        scrollbarWidth: "none",
+        pointerEvents: "box-only",
+        start: "12.34%",
+        textAlign: "start",
+        transform: [
+          {
+            translateX: 50,
+            scale: -1
+          }
+        ]
+      });
+      expect(result).toMatchInlineSnapshot(`
+        [
+          {
+            "$$css": true,
+            "$$css$localize": true,
+            "animationDirection": "r-animationDirection-1kmv48j",
+            "animationKeyframes": "r-animationKeyframes-zacbmr",
+            "fontFamily": "r-fontFamily-1qd0xha",
+            "marginEnd": [
+              "r-marginRight-a5pmau",
+              "r-marginLeft-9cviqr",
+            ],
+            "marginHorizontal": "r-marginHorizontal-vlx1xi",
+            "marginStart": [
+              "r-marginLeft-13kc5u0",
+              "r-marginRight-1knfw1x",
+            ],
+            "placeholderTextColor": "r-placeholderTextColor-1418aci",
+            "pointerEvents": "r-pointerEvents-ah5dr5",
+            "scrollbarWidth": "r-scrollbarWidth-2eszeu",
+            "start": [
+              "r-left-2s0hu9",
+              "r-right-1bnbe1j",
+            ],
+            "textAlign": [
+              "r-textAlign-fdjqy7",
+              "r-textAlign-1ff274t",
+            ],
+            "transform": "r-transform-1ehiua4",
+          },
+          [
+            [
+              [
+                ".r-animationDirection-1kmv48j{animation-direction:alternate,alternate-reverse;}",
+              ],
+              2.2,
+            ],
+            [
+              [
+                ".r-animationKeyframes-zacbmr{animation-name:r-animation-8jhqzh,r-animation-5azpl5;}",
+                "@-webkit-keyframes r-animation-8jhqzh{0%{top:0px;}50%{top:5px;}100%{top:10px;}}",
+                "@keyframes r-animation-8jhqzh{0%{top:0px;}50%{top:5px;}100%{top:10px;}}",
+                "@-webkit-keyframes r-animation-5azpl5{from{left:0px;}to{left:10px;}}",
+                "@keyframes r-animation-5azpl5{from{left:0px;}to{left:10px;}}",
+              ],
+              2.2,
+            ],
+            [
+              [
+                ".r-fontFamily-1qd0xha{font-family:-apple-system,BlinkMacSystemFont,\\"Segoe UI\\",Roboto,Helvetica,Arial,sans-serif;}",
+              ],
+              2.2,
+            ],
+            [
+              [
+                ".r-marginRight-a5pmau{margin-right:2px;}",
+              ],
+              2.2,
+            ],
+            [
+              [
+                ".r-marginLeft-9cviqr{margin-left:2px;}",
+              ],
+              2.2,
+            ],
+            [
+              [
+                ".r-marginHorizontal-vlx1xi{margin-left:10px;margin-right:10px;}",
+              ],
+              2.1,
+            ],
+            [
+              [
+                ".r-marginLeft-13kc5u0{margin-left:1px;}",
+              ],
+              2.2,
+            ],
+            [
+              [
+                ".r-marginRight-1knfw1x{margin-right:1px;}",
+              ],
+              2.2,
+            ],
+            [
+              [
+                ".r-placeholderTextColor-1418aci::-webkit-input-placeholder{color:rgba(128,128,128,1.00);opacity:1;}",
+                ".r-placeholderTextColor-1418aci::-moz-placeholder{color:rgba(128,128,128,1.00);opacity:1;}",
+                ".r-placeholderTextColor-1418aci:-ms-input-placeholder{color:rgba(128,128,128,1.00);opacity:1;}",
+                ".r-placeholderTextColor-1418aci::placeholder{color:rgba(128,128,128,1.00);opacity:1;}",
+              ],
+              2.2,
+            ],
+            [
+              [
+                ".r-pointerEvents-ah5dr5>*{pointer-events:none;}",
+                ".r-pointerEvents-ah5dr5{pointer-events:auto!important;}",
+              ],
+              2.2,
+            ],
+            [
+              [
+                ".r-scrollbarWidth-2eszeu::-webkit-scrollbar{display:none}",
+                ".r-scrollbarWidth-2eszeu{scrollbar-width:none;}",
+              ],
+              2.2,
+            ],
+            [
+              [
+                ".r-left-2s0hu9{left:12.34%;}",
+              ],
+              2.2,
+            ],
+            [
+              [
+                ".r-right-1bnbe1j{right:12.34%;}",
+              ],
+              2.2,
+            ],
+            [
+              [
+                ".r-textAlign-fdjqy7{text-align:left;}",
+              ],
+              2.2,
+            ],
+            [
+              [
+                ".r-textAlign-1ff274t{text-align:right;}",
+              ],
+              2.2,
+            ],
+            [
+              [
+                ".r-transform-1ehiua4{transform:translateX(50px);}",
+              ],
+              2.2,
+            ],
+          ],
+        ]
+      `);
+    });
+  }), describe("classic", function() {
+    test("converts style to classic CSS", function() {
+      var result = (0, import_compiler.classic)({
+        animationDirection: [
+          "alternate",
+          "alternate-reverse"
+        ],
+        animationKeyframes: [
+          {
+            "0%": {
+              top: 0
+            },
+            "50%": {
+              top: 5
+            },
+            "100%": {
+              top: 10
+            }
+          },
+          {
+            from: {
+              left: 0
+            },
+            to: {
+              left: 10
+            }
+          }
+        ],
+        marginHorizontal: 10,
+        font: "14px System",
+        transform: [
+          {
+            translateX: 50,
+            scale: -1
+          }
+        ]
+      }, "text");
+      expect(result).toMatchInlineSnapshot(`
+        [
+          {
+            "$$css": true,
+            "css-text-1jr0ypv": "css-text-1jr0ypv",
+          },
+          [
+            [
+              [
+                "@-webkit-keyframes r-animation-8jhqzh{0%{top:0px;}50%{top:5px;}100%{top:10px;}}",
+                "@keyframes r-animation-8jhqzh{0%{top:0px;}50%{top:5px;}100%{top:10px;}}",
+                "@-webkit-keyframes r-animation-5azpl5{from{left:0px;}to{left:10px;}}",
+                "@keyframes r-animation-5azpl5{from{left:0px;}to{left:10px;}}",
+                ".css-text-1jr0ypv{animation-direction:alternate,alternate-reverse;animation-name:r-animation-8jhqzh,r-animation-5azpl5;font:14px -apple-system,BlinkMacSystemFont,\\"Segoe UI\\",Roboto,Helvetica,Arial,sans-serif;margin-left:10px;margin-right:10px;transform:translateX(50px);}",
+              ],
+              1,
+            ],
+          ],
+        ]
+      `);
+    });
+  }), describe("inline", function() {
+    test("converts style to inline styles", function() {
+      var result = (0, import_compiler.inline)({
+        marginHorizontal: 10,
+        display: "flex",
+        flexShrink: 1
+      });
+      expect(result).toMatchInlineSnapshot(`
+        {
+          "display": "flex",
+          "flexShrink": 1,
+          "marginLeft": "10px",
+          "marginRight": "10px",
+        }
+      `);
+    }), describe("logical style polyfill", function() {
+      [
+        !1,
+        !0
+      ].forEach(function(isRTL) {
+        var dir = isRTL ? "rtl" : "ltr";
+        test(`ignores "left" properties for ${dir}`, function() {
+          var initial = {
+            borderLeftColor: "rgba(255,0,0,1.00)",
+            borderLeftStyle: "solid",
+            borderLeftWidth: "1px",
+            left: "1px",
+            marginLeft: "5px",
+            paddingLeft: "10px"
+          };
+          expect((0, import_compiler.inline)(initial, isRTL)).toEqual(initial);
+        }), test(`ignores "right" properties for ${dir}`, function() {
+          var initial = {
+            borderRightColor: "rgba(255,0,0,1.00)",
+            borderRightStyle: "solid",
+            borderRightWidth: "1px",
+            right: "1px",
+            marginRight: "5px",
+            paddingRight: "10px"
+          };
+          expect((0, import_compiler.inline)(initial, isRTL)).toEqual(initial);
+        }), test(`ignores "left" values for ${dir}`, function() {
+          var initial = {
+            clear: "left",
+            float: "left",
+            textAlign: "left",
+            transitionProperty: "left"
+          };
+          expect((0, import_compiler.inline)(initial, isRTL)).toEqual(initial);
+        }), test(`ignores "right" values for ${dir}`, function() {
+          var initial = {
+            clear: "right",
+            float: "right",
+            textAlign: "right",
+            transitionProperty: "right"
+          };
+          expect((0, import_compiler.inline)(initial, isRTL)).toEqual(initial);
+        }), test(`converts "start" properties for ${dir}`, function() {
+          var initial = {
+            borderStartColor: "red",
+            borderStartStyle: "solid",
+            borderStartWidth: 1,
+            start: 1,
+            marginStart: 5,
+            paddingStart: 10
+          }, expectedLTR = {
+            borderLeftColor: "rgba(255,0,0,1.00)",
+            borderLeftStyle: "solid",
+            borderLeftWidth: "1px",
+            left: "1px",
+            marginLeft: "5px",
+            paddingLeft: "10px"
+          }, expectedRTL = {
+            borderRightColor: "rgba(255,0,0,1.00)",
+            borderRightStyle: "solid",
+            borderRightWidth: "1px",
+            right: "1px",
+            marginRight: "5px",
+            paddingRight: "10px"
+          };
+          expect((0, import_compiler.inline)(initial, isRTL)).toEqual(isRTL ? expectedRTL : expectedLTR);
+        }), test(`converts "end" properties for ${dir}`, function() {
+          var initial = {
+            borderEndColor: "red",
+            borderEndStyle: "solid",
+            borderEndWidth: 1,
+            end: 1,
+            marginEnd: 5,
+            paddingEnd: 10
+          }, expectedLTR = {
+            borderRightColor: "rgba(255,0,0,1.00)",
+            borderRightStyle: "solid",
+            borderRightWidth: "1px",
+            right: "1px",
+            marginRight: "5px",
+            paddingRight: "10px"
+          }, expectedRTL = {
+            borderLeftColor: "rgba(255,0,0,1.00)",
+            borderLeftStyle: "solid",
+            borderLeftWidth: "1px",
+            left: "1px",
+            marginLeft: "5px",
+            paddingLeft: "10px"
+          };
+          expect((0, import_compiler.inline)(initial, isRTL)).toEqual(isRTL ? expectedRTL : expectedLTR);
+        }), test(`converts "start" values for ${dir}`, function() {
+          var initial = {
+            clear: "start",
+            float: "start",
+            textAlign: "start",
+            transitionProperty: "start"
+          }, expectedLTR = {
+            clear: "left",
+            float: "left",
+            textAlign: "left",
+            transitionProperty: "left"
+          }, expectedRTL = {
+            clear: "right",
+            float: "right",
+            textAlign: "right",
+            transitionProperty: "right"
+          };
+          expect((0, import_compiler.inline)(initial, isRTL)).toEqual(isRTL ? expectedRTL : expectedLTR);
+        }), test(`converts "end" values for ${dir}`, function() {
+          var initial = {
+            clear: "end",
+            float: "end",
+            textAlign: "end",
+            transitionProperty: "end"
+          }, expectedLTR = {
+            clear: "right",
+            float: "right",
+            textAlign: "right",
+            transitionProperty: "right"
+          }, expectedRTL = {
+            clear: "left",
+            float: "left",
+            textAlign: "left",
+            transitionProperty: "left"
+          };
+          expect((0, import_compiler.inline)(initial, isRTL)).toEqual(isRTL ? expectedRTL : expectedLTR);
+        }), test("end/start properties take precedence over left/right", function() {
+          var initialLTR = {
+            borderStartWidth: 10,
+            borderLeftWidth: 0,
+            end: 10,
+            right: 0,
+            marginStart: 10,
+            marginLeft: 0
+          }, expectedLTR = {
+            borderLeftWidth: "10px",
+            marginLeft: "10px",
+            right: "10px"
+          }, initialRTL = {
+            borderStartWidth: 10,
+            borderRightWidth: 0,
+            end: 10,
+            left: 0,
+            marginStart: 10,
+            marginRight: 0
+          }, expectedRTL = {
+            borderRightWidth: "10px",
+            marginRight: "10px",
+            left: "10px"
+          };
+          expect((0, import_compiler.inline)(isRTL ? initialRTL : initialLTR, isRTL)).toEqual(isRTL ? expectedRTL : expectedLTR);
+        });
+      });
+    });
+  });
+});
+//# sourceMappingURL=compiler-test.js.map

package/dist/cjs/StyleSheet/__tests__/compiler-test.native.js.map

@@ -0,0 +1,6 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/StyleSheet/__tests__/Users/n8/tamagui/code/core/react-native-web-internals/src/StyleSheet/__tests__/compiler-test.tsx"],
+  "mappings": ";AAOA,sBAAwC;AAExCA,SAAS,sBAAsB,WAAA;AAC7BA,WAAS,UAAU,WAAA;AACjBC,SAAK,gCAAgC,WAAA;AACnC,UAAMC,aAASC,wBAAO;QACpBC,oBAAoB;UAAC;UAAa;;QAClCC,oBAAoB;UAClB;YAAE,MAAM;cAAEC,KAAK;YAAE;YAAG,OAAO;cAAEA,KAAK;YAAE;YAAG,QAAQ;cAAEA,KAAK;YAAG;UAAE;UAC3D;YAAEC,MAAM;cAAEC,MAAM;YAAE;YAAGC,IAAI;cAAED,MAAM;YAAG;UAAE;;QAExCE,YAAY;QACZC,kBAAkB;QAClBC,aAAa;QACbC,WAAW;QACXC,sBAAsB;QACtBC,gBAAgB;QAChBC,eAAe;QACfC,OAAO;QACPC,WAAW;QACXC,WAAW;UACT;YACEC,YAAY;YACZC,OAAO;UACT;;MAEJ,CAAA;AAEAC,aAAOpB,MAAAA,EAAQqB,sBAAsB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OA0IpC;IACH,CAAA;EACF,CAAA,GAEAvB,SAAS,WAAW,WAAA;AAClBC,SAAK,iCAAiC,WAAA;AACpC,UAAMC,aAASsB,yBACb;QACEpB,oBAAoB;UAAC;UAAa;;QAClCC,oBAAoB;UAClB;YAAE,MAAM;cAAEC,KAAK;YAAE;YAAG,OAAO;cAAEA,KAAK;YAAE;YAAG,QAAQ;cAAEA,KAAK;YAAG;UAAE;UAC3D;YAAEC,MAAM;cAAEC,MAAM;YAAE;YAAGC,IAAI;cAAED,MAAM;YAAG;UAAE;;QAExCG,kBAAkB;QAClBc,MAAM;QACNN,WAAW;UACT;YACEC,YAAY;YACZC,OAAO;UACT;;MAEJ,GACA,MAAA;AAEFC,aAAOpB,MAAAA,EAAQqB,sBAAsB;;;;;;;;;;;;;;;;;;;OAmBpC;IACH,CAAA;EACF,CAAA,GAEAvB,SAAS,UAAU,WAAA;AACjBC,SAAK,mCAAmC,WAAA;AACtC,UAAMC,aAASwB,wBAAO;QACpBf,kBAAkB;QAClBgB,SAAS;QACTC,YAAY;MACd,CAAA;AAEAN,aAAOpB,MAAAA,EAAQqB,sBAAsB;;;;;;;OAOpC;IACH,CAAA,GAEAvB,SAAS,0BAA0B,WAAA;AAChC;QAAC;QAAO;QAAM6B,QAAQ,SAACC,OAAAA;AACtB,YAAMC,MAAMD,QAAQ,QAAQ;AAE5B7B,aAAK,iCAAiC8B,GAAAA,IAAO,WAAA;AAC3C,cAAMC,UAAU;YACdC,iBAAiB;YACjBC,iBAAiB;YACjBC,iBAAiB;YACjB3B,MAAM;YACN4B,YAAY;YACZC,aAAa;UACf;AACAf,qBAAOI,wBAAOM,SAASF,KAAAA,CAAAA,EAAQQ,QAAQN,OAAAA;QACzC,CAAA,GAEA/B,KAAK,kCAAkC8B,GAAAA,IAAO,WAAA;AAC5C,cAAMC,UAAU;YACdO,kBAAkB;YAClBC,kBAAkB;YAClBC,kBAAkB;YAClBC,OAAO;YACPC,aAAa;YACbC,cAAc;UAChB;AACAtB,qBAAOI,wBAAOM,SAASF,KAAAA,CAAAA,EAAQQ,QAAQN,OAAAA;QACzC,CAAA,GAEA/B,KAAK,6BAA6B8B,GAAAA,IAAO,WAAA;AACvC,cAAMC,UAAU;YACda,OAAO;YACPC,OAAO;YACP5B,WAAW;YACX6B,oBAAoB;UACtB;AACAzB,qBAAOI,wBAAOM,SAASF,KAAAA,CAAAA,EAAQQ,QAAQN,OAAAA;QACzC,CAAA,GAEA/B,KAAK,8BAA8B8B,GAAAA,IAAO,WAAA;AACxC,cAAMC,UAAU;YACda,OAAO;YACPC,OAAO;YACP5B,WAAW;YACX6B,oBAAoB;UACtB;AACAzB,qBAAOI,wBAAOM,SAASF,KAAAA,CAAAA,EAAQQ,QAAQN,OAAAA;QACzC,CAAA,GAEA/B,KAAK,mCAAmC8B,GAAAA,IAAO,WAAA;AAC7C,cAAMC,UAAU;YACdgB,kBAAkB;YAClBC,kBAAkB;YAClBC,kBAAkB;YAClBjC,OAAO;YACPL,aAAa;YACbuC,cAAc;UAChB,GAEMC,cAAc;YAClBnB,iBAAiB;YACjBC,iBAAiB;YACjBC,iBAAiB;YACjB3B,MAAM;YACN4B,YAAY;YACZC,aAAa;UACf,GACMgB,cAAc;YAClBd,kBAAkB;YAClBC,kBAAkB;YAClBC,kBAAkB;YAClBC,OAAO;YACPC,aAAa;YACbC,cAAc;UAChB;AACAtB,qBAAOI,wBAAOM,SAASF,KAAAA,CAAAA,EAAQQ,QAAQR,QAAQuB,cAAcD,WAAAA;QAC/D,CAAA,GAEAnD,KAAK,iCAAiC8B,GAAAA,IAAO,WAAA;AAC3C,cAAMC,UAAU;YACdsB,gBAAgB;YAChBC,gBAAgB;YAChBC,gBAAgB;YAChBC,KAAK;YACL5C,WAAW;YACX6C,YAAY;UACd,GAEMN,cAAc;YAClBb,kBAAkB;YAClBC,kBAAkB;YAClBC,kBAAkB;YAClBC,OAAO;YACPC,aAAa;YACbC,cAAc;UAChB,GACMS,cAAc;YAClBpB,iBAAiB;YACjBC,iBAAiB;YACjBC,iBAAiB;YACjB3B,MAAM;YACN4B,YAAY;YACZC,aAAa;UACf;AACAf,qBAAOI,wBAAOM,SAASF,KAAAA,CAAAA,EAAQQ,QAAQR,QAAQuB,cAAcD,WAAAA;QAC/D,CAAA,GAEAnD,KAAK,+BAA+B8B,GAAAA,IAAO,WAAA;AACzC,cAAMC,UAAU;YACda,OAAO;YACPC,OAAO;YACP5B,WAAW;YACX6B,oBAAoB;UACtB,GAEMK,cAAc;YAClBP,OAAO;YACPC,OAAO;YACP5B,WAAW;YACX6B,oBAAoB;UACtB,GACMM,cAAc;YAClBR,OAAO;YACPC,OAAO;YACP5B,WAAW;YACX6B,oBAAoB;UACtB;AACAzB,qBAAOI,wBAAOM,SAASF,KAAAA,CAAAA,EAAQQ,QAAQR,QAAQuB,cAAcD,WAAAA;QAC/D,CAAA,GAEAnD,KAAK,6BAA6B8B,GAAAA,IAAO,WAAA;AACvC,cAAMC,UAAU;YACda,OAAO;YACPC,OAAO;YACP5B,WAAW;YACX6B,oBAAoB;UACtB,GAEMK,cAAc;YAClBP,OAAO;YACPC,OAAO;YACP5B,WAAW;YACX6B,oBAAoB;UACtB,GACMM,cAAc;YAClBR,OAAO;YACPC,OAAO;YACP5B,WAAW;YACX6B,oBAAoB;UACtB;AACAzB,qBAAOI,wBAAOM,SAASF,KAAAA,CAAAA,EAAQQ,QAAQR,QAAQuB,cAAcD,WAAAA;QAC/D,CAAA,GAEAnD,KAAK,wDAAwD,WAAA;AAC3D,cAAM0D,aAAa;YACjBT,kBAAkB;YAClBf,iBAAiB;YACjBsB,KAAK;YACLf,OAAO;YACP9B,aAAa;YACbwB,YAAY;UACd,GACMgB,cAAc;YAClBjB,iBAAiB;YACjBC,YAAY;YACZM,OAAO;UACT,GAEMkB,aAAa;YACjBV,kBAAkB;YAClBT,kBAAkB;YAClBgB,KAAK;YACLjD,MAAM;YACNI,aAAa;YACb+B,aAAa;UACf,GACMU,cAAc;YAClBZ,kBAAkB;YAClBE,aAAa;YACbnC,MAAM;UACR;AACAc,qBAAOI,wBAAOI,QAAQ8B,aAAaD,YAAY7B,KAAAA,CAAAA,EAAQQ,QACrDR,QAAQuB,cAAcD,WAAAA;QAE1B,CAAA;MACF,CAAA;IACF,CAAA;EACF,CAAA;AACF,CAAA;",
+  "names": ["describe", "test", "result", "atomic", "animationDirection", "animationKeyframes", "top", "from", "left", "to", "fontFamily", "marginHorizontal", "marginStart", "marginEnd", "placeholderTextColor", "scrollbarWidth", "pointerEvents", "start", "textAlign", "transform", "translateX", "scale", "expect", "toMatchInlineSnapshot", "classic", "font", "inline", "display", "flexShrink", "forEach", "isRTL", "dir", "initial", "borderLeftColor", "borderLeftStyle", "borderLeftWidth", "marginLeft", "paddingLeft", "toEqual", "borderRightColor", "borderRightStyle", "borderRightWidth", "right", "marginRight", "paddingRight", "clear", "float", "transitionProperty", "borderStartColor", "borderStartStyle", "borderStartWidth", "paddingStart", "expectedLTR", "expectedRTL", "borderEndColor", "borderEndStyle", "borderEndWidth", "end", "paddingEnd", "initialLTR", "initialRTL"]
+}

package/dist/cjs/StyleSheet/__tests__/dom-createOrderedCSSStyleSheet-test.js

@@ -0,0 +1,117 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf, __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from == "object" || typeof from == "function")
+    for (let key of __getOwnPropNames(from))
+      !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: !0 }) : target,
+  mod
+));
+var import_createOrderedCSSStyleSheet = __toESM(require("../dom/createOrderedCSSStyleSheet"));
+const insertStyleElement = () => {
+  const element = document.createElement("style"), head = document.head;
+  return head.insertBefore(element, head.firstChild), element;
+}, removeStyleElement = (element) => {
+  document.head.removeChild(element);
+};
+describe("createOrderedCSSStyleSheet", () => {
+  describe("#insert", () => {
+    test("insertion order for same group", () => {
+      const sheet = (0, import_createOrderedCSSStyleSheet.default)();
+      expect(sheet.getTextContent()).toMatchInlineSnapshot('""'), sheet.insert(".a {}", 0), expect(sheet.getTextContent()).toMatchInlineSnapshot(`
+        "[stylesheet-group=\\"0\\"]{}
+        .a {}"
+      `), sheet.insert(".b {}", 0), expect(sheet.getTextContent()).toMatchInlineSnapshot(`
+        "[stylesheet-group=\\"0\\"]{}
+        .a {}
+        .b {}"
+      `), sheet.insert(".c {}", 0), expect(sheet.getTextContent()).toMatchInlineSnapshot(`
+        "[stylesheet-group=\\"0\\"]{}
+        .a {}
+        .b {}
+        .c {}"
+      `);
+    }), test("deduplication for same group", () => {
+      const sheet = (0, import_createOrderedCSSStyleSheet.default)();
+      sheet.insert(".a {}", 0), sheet.insert(".a {}", 0), sheet.insert(".a {}", 0), expect(sheet.getTextContent()).toMatchInlineSnapshot(`
+        "[stylesheet-group=\\"0\\"]{}
+        .a {}"
+      `);
+    }), test("order for same group", () => {
+      const sheet = (0, import_createOrderedCSSStyleSheet.default)();
+      sheet.insert(".c {}", 0), sheet.insert(".b {}", 0), sheet.insert(".a {}", 0), expect(sheet.getTextContent()).toMatchInlineSnapshot(`
+        "[stylesheet-group=\\"0\\"]{}
+        .a {}
+        .b {}
+        .c {}"
+      `);
+    }), test("insertion order for different groups", () => {
+      const sheet = (0, import_createOrderedCSSStyleSheet.default)();
+      sheet.insert(".nine-1 {}", 9.9), sheet.insert(".nine-2 {}", 9.9), sheet.insert(".three {}", 3), sheet.insert(".one {}", 1), sheet.insert(".two {}", 2.2), sheet.insert(".four-1 {}", 4), sheet.insert(".four-2 {}", 4), sheet.insert(".twenty {}", 20), sheet.insert(".ten {}", 10), sheet.insert(".twenty-point2 {}", 20.2), expect(sheet.getTextContent()).toMatchInlineSnapshot(`
+        "[stylesheet-group=\\"1\\"]{}
+        .one {}
+        [stylesheet-group=\\"2.2\\"]{}
+        .two {}
+        [stylesheet-group=\\"3\\"]{}
+        .three {}
+        [stylesheet-group=\\"4\\"]{}
+        .four-1 {}
+        .four-2 {}
+        [stylesheet-group=\\"9.9\\"]{}
+        .nine-1 {}
+        .nine-2 {}
+        [stylesheet-group=\\"10\\"]{}
+        .ten {}
+        [stylesheet-group=\\"20\\"]{}
+        .twenty {}
+        [stylesheet-group=\\"20.2\\"]{}
+        .twenty-point2 {}"
+      `);
+    });
+  }), describe("client-side hydration", () => {
+    let element;
+    beforeEach(() => {
+      element != null && removeStyleElement(element), element = insertStyleElement();
+    }), test("from SSR CSS", () => {
+      const serverSheet = (0, import_createOrderedCSSStyleSheet.default)();
+      serverSheet.insert(".one { width: 10px; }", 1), serverSheet.insert(".two-1 { height: 20px; }", 2), serverSheet.insert(".two-2 { color: red; }", 2), serverSheet.insert("@keyframes anim { 0% { opacity: 1; } }", 2);
+      const textContent = serverSheet.getTextContent();
+      element.appendChild(document.createTextNode(textContent));
+      const clientSheet = (0, import_createOrderedCSSStyleSheet.default)(element.sheet);
+      expect(clientSheet.getTextContent()).toMatchInlineSnapshot(`
+        "[stylesheet-group=\\"1\\"] {}
+        .one {width: 10px;}
+        [stylesheet-group=\\"2\\"] {}
+        .two-1 {height: 20px;}
+        .two-2 {color: red;}
+        @keyframes anim { 
+          0% {opacity: 1;} 
+        }"
+      `);
+    }), test("works when the group marker is in single quotes", () => {
+      const serverSheet = (0, import_createOrderedCSSStyleSheet.default)();
+      serverSheet.insert(".a { color: red }", 0), serverSheet.insert(".b { color: red }", 1);
+      const textContent = serverSheet.getTextContent().replace(/"/g, "'");
+      element.appendChild(document.createTextNode(textContent));
+      const clientSheet = (0, import_createOrderedCSSStyleSheet.default)(element.sheet);
+      clientSheet.insert(".c { color: red }", 0), expect(clientSheet.getTextContent()).toMatchInlineSnapshot(`
+        "[stylesheet-group='0'] {}
+        .a {color: red;}
+        .c { color: red }
+        [stylesheet-group='1'] {}
+        .b {color: red;}"
+      `);
+    });
+  });
+});
+//# sourceMappingURL=dom-createOrderedCSSStyleSheet-test.js.map

package/dist/cjs/StyleSheet/__tests__/dom-createOrderedCSSStyleSheet-test.js.map

@@ -0,0 +1,6 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/StyleSheet/__tests__/dom-createOrderedCSSStyleSheet-test.tsx"],
+  "mappings": "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",
+  "names": ["createOrderedCSSStyleSheet"]
+}

package/dist/cjs/StyleSheet/__tests__/dom-createOrderedCSSStyleSheet-test.native.js

@@ -0,0 +1,117 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf, __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from == "object" || typeof from == "function")
+    for (let key of __getOwnPropNames(from))
+      !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: !0 }) : target,
+  mod
+));
+var import_createOrderedCSSStyleSheet = __toESM(require("../dom/createOrderedCSSStyleSheet")), insertStyleElement = function() {
+  var element = document.createElement("style"), head = document.head;
+  return head.insertBefore(element, head.firstChild), element;
+}, removeStyleElement = function(element) {
+  document.head.removeChild(element);
+};
+describe("createOrderedCSSStyleSheet", function() {
+  describe("#insert", function() {
+    test("insertion order for same group", function() {
+      var sheet = (0, import_createOrderedCSSStyleSheet.default)();
+      expect(sheet.getTextContent()).toMatchInlineSnapshot('""'), sheet.insert(".a {}", 0), expect(sheet.getTextContent()).toMatchInlineSnapshot(`
+        "[stylesheet-group=\\"0\\"]{}
+        .a {}"
+      `), sheet.insert(".b {}", 0), expect(sheet.getTextContent()).toMatchInlineSnapshot(`
+        "[stylesheet-group=\\"0\\"]{}
+        .a {}
+        .b {}"
+      `), sheet.insert(".c {}", 0), expect(sheet.getTextContent()).toMatchInlineSnapshot(`
+        "[stylesheet-group=\\"0\\"]{}
+        .a {}
+        .b {}
+        .c {}"
+      `);
+    }), test("deduplication for same group", function() {
+      var sheet = (0, import_createOrderedCSSStyleSheet.default)();
+      sheet.insert(".a {}", 0), sheet.insert(".a {}", 0), sheet.insert(".a {}", 0), expect(sheet.getTextContent()).toMatchInlineSnapshot(`
+        "[stylesheet-group=\\"0\\"]{}
+        .a {}"
+      `);
+    }), test("order for same group", function() {
+      var sheet = (0, import_createOrderedCSSStyleSheet.default)();
+      sheet.insert(".c {}", 0), sheet.insert(".b {}", 0), sheet.insert(".a {}", 0), expect(sheet.getTextContent()).toMatchInlineSnapshot(`
+        "[stylesheet-group=\\"0\\"]{}
+        .a {}
+        .b {}
+        .c {}"
+      `);
+    }), test("insertion order for different groups", function() {
+      var sheet = (0, import_createOrderedCSSStyleSheet.default)();
+      sheet.insert(".nine-1 {}", 9.9), sheet.insert(".nine-2 {}", 9.9), sheet.insert(".three {}", 3), sheet.insert(".one {}", 1), sheet.insert(".two {}", 2.2), sheet.insert(".four-1 {}", 4), sheet.insert(".four-2 {}", 4), sheet.insert(".twenty {}", 20), sheet.insert(".ten {}", 10), sheet.insert(".twenty-point2 {}", 20.2), expect(sheet.getTextContent()).toMatchInlineSnapshot(`
+        "[stylesheet-group=\\"1\\"]{}
+        .one {}
+        [stylesheet-group=\\"2.2\\"]{}
+        .two {}
+        [stylesheet-group=\\"3\\"]{}
+        .three {}
+        [stylesheet-group=\\"4\\"]{}
+        .four-1 {}
+        .four-2 {}
+        [stylesheet-group=\\"9.9\\"]{}
+        .nine-1 {}
+        .nine-2 {}
+        [stylesheet-group=\\"10\\"]{}
+        .ten {}
+        [stylesheet-group=\\"20\\"]{}
+        .twenty {}
+        [stylesheet-group=\\"20.2\\"]{}
+        .twenty-point2 {}"
+      `);
+    });
+  }), describe("client-side hydration", function() {
+    var element;
+    beforeEach(function() {
+      element != null && removeStyleElement(element), element = insertStyleElement();
+    }), test("from SSR CSS", function() {
+      var serverSheet = (0, import_createOrderedCSSStyleSheet.default)();
+      serverSheet.insert(".one { width: 10px; }", 1), serverSheet.insert(".two-1 { height: 20px; }", 2), serverSheet.insert(".two-2 { color: red; }", 2), serverSheet.insert("@keyframes anim { 0% { opacity: 1; } }", 2);
+      var textContent = serverSheet.getTextContent();
+      element.appendChild(document.createTextNode(textContent));
+      var clientSheet = (0, import_createOrderedCSSStyleSheet.default)(element.sheet);
+      expect(clientSheet.getTextContent()).toMatchInlineSnapshot(`
+        "[stylesheet-group=\\"1\\"] {}
+        .one {width: 10px;}
+        [stylesheet-group=\\"2\\"] {}
+        .two-1 {height: 20px;}
+        .two-2 {color: red;}
+        @keyframes anim { 
+          0% {opacity: 1;} 
+        }"
+      `);
+    }), test("works when the group marker is in single quotes", function() {
+      var serverSheet = (0, import_createOrderedCSSStyleSheet.default)();
+      serverSheet.insert(".a { color: red }", 0), serverSheet.insert(".b { color: red }", 1);
+      var textContent = serverSheet.getTextContent().replace(/"/g, "'");
+      element.appendChild(document.createTextNode(textContent));
+      var clientSheet = (0, import_createOrderedCSSStyleSheet.default)(element.sheet);
+      clientSheet.insert(".c { color: red }", 0), expect(clientSheet.getTextContent()).toMatchInlineSnapshot(`
+        "[stylesheet-group='0'] {}
+        .a {color: red;}
+        .c { color: red }
+        [stylesheet-group='1'] {}
+        .b {color: red;}"
+      `);
+    });
+  });
+});
+//# sourceMappingURL=dom-createOrderedCSSStyleSheet-test.js.map