AUI: Added layout wrap support (#244)

bheston · web-flow · commit c57e54f9d4ea · 2025-01-13T15:19:06.000-08:00
diff --git a/change/@adaptive-web-adaptive-ui-ad0b92ba-bcd2-46f0-b98b-80a5741b05a0.json b/change/@adaptive-web-adaptive-ui-ad0b92ba-bcd2-46f0-b98b-80a5741b05a0.json
@@ -0,0 +1,7 @@
+{
+  "type": "minor",
+  "comment": "AUI: Added layout wrap support",
+  "packageName": "@adaptive-web/adaptive-ui",
+  "email": "47367562+bheston@users.noreply.github.com",
+  "dependentChangeType": "patch"
+}
diff --git a/package-lock.json b/package-lock.json
diff --git a/packages/adaptive-ui/docs/api-report.md b/packages/adaptive-ui/docs/api-report.md
@@ -634,6 +634,7 @@ export const StyleProperty: {
     readonly layoutDirection: "layoutDirection";
     readonly layoutMainAxisAlignItems: "layoutMainAxisAlignItems";
     readonly layoutCrossAxisAlignItems: "layoutCrossAxisAlignItems";
+    readonly layoutWrap: "layoutWrap";
     readonly opacity: "opacity";
     readonly cursor: "cursor";
     readonly outlineColor: "outlineColor";
diff --git a/packages/adaptive-ui/src/core/modules/css.ts b/packages/adaptive-ui/src/core/modules/css.ts
@@ -97,6 +97,8 @@ export const stylePropertyToCssProperty = (usage: StyleProperty): string => {
             return "justify-content";
         case StyleProperty.layoutCrossAxisAlignItems:
             return "align-items";
+        case StyleProperty.layoutWrap:
+            return "flex-wrap";
         case StyleProperty.opacity:
             return "opacity";
         case StyleProperty.cursor:
diff --git a/packages/adaptive-ui/src/core/modules/types.ts b/packages/adaptive-ui/src/core/modules/types.ts
@@ -346,6 +346,7 @@ export const StyleProperty = {
     layoutDirection: "layoutDirection",
     layoutMainAxisAlignItems: "layoutMainAxisAlignItems",
     layoutCrossAxisAlignItems: "layoutCrossAxisAlignItems",
+    layoutWrap: "layoutWrap",
     opacity: "opacity",
     cursor: "cursor",
     outlineColor: "outlineColor",
