fix: allow width/height 'auto' value (#144)

Author: marklawlor

src/__tests__/vendor/tailwind/accessibility.test.tsx

@@ -26,18 +26,16 @@ describe("Accessibility - Screen Readers", () => {
     expect(result).toStrictEqual({
       props: {
         style: {
+          height: "auto",
           margin: 0,
           overflow: "visible",
           padding: 0,
           position: "static",
+          width: "auto",
         },
       },
       warnings: {
         properties: ["clip", "white-space"],
-        values: {
-          width: "auto",
-          height: "auto",
-        },
       },
     });
   });

src/__tests__/vendor/tailwind/sizing.test.tsx

@@ -30,8 +30,7 @@ describe("Sizing - Width", () => {
   });
   test("w-auto", async () => {
     expect(await renderCurrentTest()).toStrictEqual({
-      props: {},
-      warnings: { values: { width: "auto" } },
+      props: { style: { width: "auto" } },
     });
   });
   test("w-min", async () => {
@@ -149,8 +148,7 @@ describe("Sizing - Height", () => {
   });
   test("h-auto", async () => {
     expect(await renderCurrentTest()).toStrictEqual({
-      props: {},
-      warnings: { values: { height: "auto" } },
+      props: { style: { height: "auto" } },
     });
   });
   test("h-min", async () => {
@@ -268,8 +266,7 @@ describe("Sizing - Size", () => {
   });
   test("size-auto", async () => {
     expect(await renderCurrentTest()).toStrictEqual({
-      props: {},
-      warnings: { values: { width: "auto", height: "auto" } },
+      props: { style: { width: "auto", height: "auto" } },
     });
   });
   test("size-min", async () => {

src/compiler/declarations.ts

@@ -174,8 +174,8 @@ const parsers: {
   "font-variant-caps": parseFontVariantCapsDeclaration,
   "font-weight": parseFontWeightDeclaration,
   "gap": parseGap,
-  "height": parseSizeDeclaration,
-  "inline-size": parseSizeDeclaration,
+  "height": parseSizeWithAutoDeclaration,
+  "inline-size": parseSizeWithAutoDeclaration,
   "inset": parseInset,
   "inset-block": parseInsetBlock,
   "inset-block-end": parseLengthPercentageDeclaration,
@@ -247,7 +247,7 @@ const parsers: {
   "user-select": parseUserSelect,
   "vertical-align": parseVerticalAlign,
   "visibility": parseVisibility,
-  "width": parseSizeDeclaration,
+  "width": parseSizeWithAutoDeclaration,
   "z-index": parseZIndex,
 };