@wise/dynamic-flow-client 5.1.0 → 5.1.1

package/build/main.css

@@ -1,7 +1,7 @@
 /* We should move to CSS modules when we move this to the Wise layer */
 .df-box-renderer-border {
   border: 1px solid var(--color-border-neutral);
-  border-radius: var(--radius-small);
+  border-radius: var(--radius-medium);
   padding: var(--size-16);
 }
 .df-box-renderer-fixed-width {

package/build/main.js

@@ -1313,8 +1313,8 @@ var mapLegacyActionTypeToControl = (type) => type && type in legacyActionTypeToC
 var alertLayoutToComponent = (uid, {
   control,
   markdown,
-  margin = "md",
-  context = "neutral",
+  margin,
+  context,
   callToAction,
   analyticsId,
   tags
@@ -1325,9 +1325,9 @@ var alertLayoutToComponent = (uid, {
     analyticsId,
     control,
     markdown,
-    margin,
+    margin: margin != null ? margin : "md",
     callToAction: cta,
-    context: mapLegacyContext(context),
+    context: mapLegacyContext(context != null ? context : "neutral"),
     tags
   });
 };
@@ -1353,8 +1353,8 @@ var boxLayoutToComponent = (uid, {
   border = false,
   components,
   control,
-  margin = "md",
-  width = "xl",
+  margin,
+  width,
   analyticsId,
   tags
 }, mapperProps, schemaComponents) => createBoxComponent({
@@ -1362,8 +1362,8 @@ var boxLayoutToComponent = (uid, {
   analyticsId,
   border,
   control,
-  margin,
-  width,
+  margin: margin != null ? margin : "md",
+  width: width != null ? width : "xl",
   tags,
   components: components.map((component, index) => {
     const shouldRemoveMargin = index === components.length - 1 && component.margin === void 0;
@@ -1401,7 +1401,7 @@ var buttonLayoutToComponentWithBehavior = (uid, button, mapperProps) => {
     context,
     control,
     disabled,
-    margin = "md",
+    margin,
     pinOrder,
     size,
     title,
@@ -1422,7 +1422,7 @@ var buttonLayoutToComponentWithBehavior = (uid, button, mapperProps) => {
     context: mapLegacyContext(context != null ? context : "neutral"),
     control,
     disabled: disabled != null ? disabled : false,
-    margin,
+    margin: margin != null ? margin : "md",
     pinOrder,
     size,
     title: title != null ? title : "",
@@ -1496,12 +1496,12 @@ var createColumnsComponent = (columnsProps) => __spreadProps(__spreadValues({},
 });
 
 // src/domain/mappers/layout/columnsLayoutToComponent.ts
-var columnsLayoutToComponent = (uid, { control, left, right, bias = "none", margin = "md", analyticsId, tags }, mapperProps, schemaComponents) => createColumnsComponent({
+var columnsLayoutToComponent = (uid, { control, left, right, bias, margin, analyticsId, tags }, mapperProps, schemaComponents) => createColumnsComponent({
   uid,
   analyticsId,
   control,
-  margin,
-  bias: mapLegacyBias(bias),
+  margin: margin != null ? margin : "md",
+  bias: mapLegacyBias(bias != null ? bias : "none"),
   tags,
   startComponents: left.map(
     (component, index) => mapLayoutToComponent(
@@ -1582,7 +1582,7 @@ var mapSchemaAlert = (alert) => {
 var decisionLayoutToComponent = (uid, {
   analyticsId,
   control,
-  margin = "md",
+  margin,
   options,
   tags,
   title
@@ -1590,7 +1590,7 @@ var decisionLayoutToComponent = (uid, {
   uid,
   analyticsId,
   control,
-  margin,
+  margin: margin != null ? margin : "md",
   options: options.map((option) => mapOption(option, mapperProps)),
   tags,
   title
@@ -1621,7 +1621,7 @@ var createStatusListComponent = (statusListProps) => __spreadValues({
 var isDeprecatedListLayout = (layout) => {
   return layout.items.some((item) => item.status);
 };
-var deprecatedListLayoutToComponent = (uid, { analyticsId, control, items, margin = "md", title, tags }) => createStatusListComponent({
+var deprecatedListLayoutToComponent = (uid, { analyticsId, control, items, margin, title, tags }) => createStatusListComponent({
   uid,
   analyticsId,
   control,
@@ -1632,7 +1632,7 @@ var deprecatedListLayoutToComponent = (uid, { analyticsId, control, items, margi
     status: status ? mapLegacyStatus(status) : void 0,
     tags: itemTags
   })),
-  margin,
+  margin: margin != null ? margin : "md",
   title,
   tags
 });
@@ -1655,7 +1655,7 @@ var createDividerComponent = (props) => __spreadValues({
 }, props);
 
 // src/domain/mappers/layout/dividerLayoutToComponent.ts
-var dividerLayoutToComponent = (uid, { control, margin = "md", analyticsId, tags }) => createDividerComponent({ uid, analyticsId, control, margin, tags });
+var dividerLayoutToComponent = (uid, { control, margin, analyticsId, tags }) => createDividerComponent({ uid, analyticsId, control, margin: margin != null ? margin : "md", tags });
 
 // src/domain/components/FormComponent.ts
 var createFormComponent = (formProps) => __spreadProps(__spreadValues({}, formProps), {
@@ -1667,7 +1667,7 @@ var createFormComponent = (formProps) => __spreadProps(__spreadValues({}, formPr
 });
 
 // src/domain/mappers/layout/formLayoutToComponent.ts
-var formLayoutToComponent = (uid, { analyticsId, schemaId, schema: schemaRef, control, margin = "md", tags }, schemaComponents) => {
+var formLayoutToComponent = (uid, { analyticsId, schemaId, schema: schemaRef, control, margin, tags }, schemaComponents) => {
   const id = schemaId != null ? schemaId : schemaRef == null ? void 0 : schemaRef.$ref;
   if (id == null) {
     throw new Error(
@@ -1685,7 +1685,7 @@ var formLayoutToComponent = (uid, { analyticsId, schemaId, schema: schemaRef, co
     analyticsId,
     schemaComponent,
     control,
-    margin,
+    margin: margin != null ? margin : "md",
     tags
   });
 };
@@ -1697,13 +1697,13 @@ var createHeadingComponent = (headingProps) => __spreadValues({
 }, headingProps);
 
 // src/domain/mappers/layout/headingLayoutToComponent.ts
-var headingLayoutToComponent = (uid, { analyticsId, align = "left", margin = "md", size = "md", control, tags, text }) => createHeadingComponent({
+var headingLayoutToComponent = (uid, { analyticsId, align, margin, size, control, tags, text }) => createHeadingComponent({
   uid,
   analyticsId,
-  align: mapLegacyAlign(align),
+  align: mapLegacyAlign(align != null ? align : "left"),
   control,
-  margin,
-  size,
+  margin: margin != null ? margin : "md",
+  size: size != null ? size : "md",
   tags,
   text
 });
@@ -1718,11 +1718,11 @@ var createImageComponent = (imageProps) => __spreadValues({
 var imageLayoutToComponent = (uid, {
   analyticsId,
   accessibilityDescription,
-  align = "center",
+  align,
   content,
   control,
-  margin = "md",
-  size = "md",
+  margin,
+  size,
   tags,
   text,
   url
@@ -1731,14 +1731,14 @@ var imageLayoutToComponent = (uid, {
   return createImageComponent({
     uid,
     analyticsId,
-    align: mapLegacyAlign(align),
+    align: mapLegacyAlign(align != null ? align : "center"),
     content: content ? {
       uri: (_b = (_a = content.uri) != null ? _a : content.url) != null ? _b : "",
       accessibilityDescription: (_c = content.accessibilityDescription) != null ? _c : content.text
     } : { accessibilityDescription: accessibilityDescription != null ? accessibilityDescription : text, uri: url != null ? url : "" },
     control,
-    margin,
-    size,
+    margin: margin != null ? margin : "md",
+    size: size != null ? size : "md",
     tags
   });
 };
@@ -1750,13 +1750,13 @@ var createMarkdownComponent = (markdownProps) => __spreadValues({
 }, markdownProps);
 
 // src/domain/mappers/layout/infoLayoutToComponent.ts
-var infoLayoutToComponent = (uid, { analyticsId, align = "left", control, margin = "md", markdown: content, tags }) => createMarkdownComponent({
+var infoLayoutToComponent = (uid, { analyticsId, align, control, margin, markdown: content, tags }) => createMarkdownComponent({
   uid,
   analyticsId,
-  align: mapLegacyAlign(align),
+  align: mapLegacyAlign(align != null ? align : "left"),
   content,
   control,
-  margin,
+  margin: margin != null ? margin : "md",
   tags,
   size: "md"
 });
@@ -1768,7 +1768,7 @@ var createInstructionsComponent = (instructionsProps) => __spreadValues({
 }, instructionsProps);
 
 // src/domain/mappers/layout/instructionsLayoutToComponent.ts
-var instructionsLayoutToComponent = (uid, { analyticsId, control, items, margin = "md", tags, title }) => createInstructionsComponent({
+var instructionsLayoutToComponent = (uid, { analyticsId, control, items, margin, tags, title }) => createInstructionsComponent({
   uid,
   analyticsId,
   control,
@@ -1776,7 +1776,7 @@ var instructionsLayoutToComponent = (uid, { analyticsId, control, items, margin
     context: mapLegacyContext(item.context),
     tags: mapTags(item)
   })),
-  margin,
+  margin: margin != null ? margin : "md",
   tags,
   title
 });
@@ -1788,14 +1788,14 @@ var createListComponent = (listProps) => __spreadValues({
 }, listProps);
 
 // src/domain/mappers/layout/listLayoutToComponent.ts
-var listLayoutToComponent = (uid, { analyticsId, callToAction, control, items, margin = "md", tags, title }, mapperProps) => {
+var listLayoutToComponent = (uid, { analyticsId, callToAction, control, items, margin, tags, title }, mapperProps) => {
   return createListComponent({
     uid,
     analyticsId,
     control,
     items: items.map((item) => mapItem(item, mapperProps)),
     callToAction: getDomainLayerCallToAction(callToAction, mapperProps),
-    margin,
+    margin: margin != null ? margin : "md",
     tags,
     title
   });
@@ -1849,33 +1849,33 @@ var createLoadingIndicatorComponent = (loadingIndicatorProps) => __spreadValues(
 }, loadingIndicatorProps);
 
 // src/domain/mappers/layout/loadingIndicatorLayoutToComponent.ts
-var loadingIndicatorLayoutToComponent = (uid, { analyticsId, control, margin = "md", size = "md", tags }) => createLoadingIndicatorComponent({
+var loadingIndicatorLayoutToComponent = (uid, { analyticsId, control, margin, size, tags }) => createLoadingIndicatorComponent({
   uid,
   analyticsId,
   control,
-  margin,
-  size,
+  margin: margin != null ? margin : "md",
+  size: size != null ? size : "md",
   tags
 });
 
 // src/domain/mappers/layout/markdownLayoutToComponent.ts
 var markdownLayoutToComponent = (uid, {
   analyticsId,
-  align = "left",
-  margin = "md",
+  align,
+  margin,
   control,
   content,
-  size = "md",
+  size,
   tags
 }) => createMarkdownComponent({
   uid,
   analyticsId,
-  align: mapLegacyAlign(align),
+  align: mapLegacyAlign(align != null ? align : "left"),
   control,
   content,
-  margin,
+  margin: margin != null ? margin : "md",
   tags,
-  size
+  size: size != null ? size : "md"
 });
 
 // src/domain/components/ModalLayoutComponent.ts
@@ -1889,7 +1889,7 @@ var createModalComponent = (modalProps) => __spreadProps(__spreadValues({
 });
 
 // src/domain/mappers/layout/modalLayoutToComponent.ts
-var modalLayoutToComponent = (uid, { analyticsId, content, control, margin = "md", tags, trigger }, mapperProps, schemaComponents) => {
+var modalLayoutToComponent = (uid, { analyticsId, content, control, margin, tags, trigger }, mapperProps, schemaComponents) => {
   const { components, title } = content;
   return createModalComponent({
     uid,
@@ -1901,7 +1901,7 @@ var modalLayoutToComponent = (uid, { analyticsId, content, control, margin = "md
       title
     },
     control,
-    margin,
+    margin: margin != null ? margin : "md",
     tags,
     trigger
   });
@@ -1914,15 +1914,15 @@ var createParagraphComponent = (paragraphProps) => __spreadValues({
 }, paragraphProps);
 
 // src/domain/mappers/layout/paragraphLayoutToComponent.ts
-var paragraphLayoutToComponent = (uid, { analyticsId, align = "left", control, margin = "md", size = "md", tags, text }) => createParagraphComponent({
+var paragraphLayoutToComponent = (uid, { analyticsId, align, control, margin, size, tags, text }) => createParagraphComponent({
   uid,
   analyticsId,
   text,
   control,
-  align: mapLegacyAlign(align),
-  margin,
+  align: mapLegacyAlign(align != null ? align : "left"),
+  margin: margin != null ? margin : "md",
   tags,
-  size
+  size: size != null ? size : "md"
 });
 
 // src/domain/components/ReviewComponent.ts
@@ -1938,7 +1938,7 @@ var reviewLayoutToComponent = (uid, {
   title,
   callToAction,
   control,
-  margin = "md",
+  margin,
   tags,
   orientation,
   action
@@ -1948,7 +1948,7 @@ var reviewLayoutToComponent = (uid, {
   callToAction: getCallToAction2({ mapperProps, callToAction, action }),
   control: getOrientationControl({ control, orientation }),
   fields: fields.map((field) => mapReviewField(field, mapperProps)),
-  margin,
+  margin: margin != null ? margin : "md",
   tags,
   title
 });
@@ -2159,17 +2159,7 @@ var isValidResponseBody = (body) => isObject(body) && "results" in body && isArr
 var hashRequest = (query, config) => JSON.stringify({ query, config });
 
 // src/domain/mappers/layout/searchLayoutToComponent.ts
-var searchLayoutToComponent = (uid, {
-  analyticsId,
-  control,
-  emptyMessage = "",
-  method,
-  param,
-  title,
-  url,
-  margin = "md",
-  tags
-}, mapperProps) => {
+var searchLayoutToComponent = (uid, { analyticsId, control, emptyMessage, method, param, title, url, margin, tags }, mapperProps) => {
   const { httpClient, onBehavior, updateComponent } = mapperProps;
   const search = getPerformSearchFunction(httpClient, { method, param, url });
   return createSearchComponent(
@@ -2177,8 +2167,8 @@ var searchLayoutToComponent = (uid, {
       uid,
       analyticsId,
       control,
-      emptyMessage,
-      margin,
+      emptyMessage: emptyMessage != null ? emptyMessage : "",
+      margin: margin != null ? margin : "md",
       tags,
       title
     },
@@ -2189,7 +2179,7 @@ var searchLayoutToComponent = (uid, {
 };
 
 // src/domain/mappers/layout/statusListLayoutToComponent.ts
-var statusListLayoutToComponent = (uid, { analyticsId, control, items, margin = "md", tags, title }, mapperProps) => createStatusListComponent({
+var statusListLayoutToComponent = (uid, { analyticsId, control, items, margin, tags, title }, mapperProps) => createStatusListComponent({
   uid,
   analyticsId,
   control,
@@ -2197,7 +2187,7 @@ var statusListLayoutToComponent = (uid, { analyticsId, control, items, margin =
     const callToAction = getDomainLayerCallToAction(item.callToAction, mapperProps);
     return __spreadProps(__spreadValues({}, item), { callToAction, tags: mapTags(item) });
   }),
-  margin,
+  margin: margin != null ? margin : "md",
   tags,
   title
 });
@@ -2214,7 +2204,7 @@ var createSectionComponent = (props) => {
 };
 
 // src/domain/mappers/layout/sectionLayoutToComponent.ts
-var sectionLayoutToComponent = (uid, { analyticsId, control, title, components, callToAction, margin = "md", tags }, mapperProps, schemaComponents) => {
+var sectionLayoutToComponent = (uid, { analyticsId, control, title, components, callToAction, margin, tags }, mapperProps, schemaComponents) => {
   return createSectionComponent({
     uid,
     analyticsId,
@@ -2223,7 +2213,7 @@ var sectionLayoutToComponent = (uid, { analyticsId, control, title, components,
     components: components.map(
       (component, index) => mapLayoutToComponent(`${uid}.section-${index}`, component, mapperProps, schemaComponents)
     ),
-    margin,
+    margin: margin != null ? margin : "md",
     callToAction: getDomainLayerCallToAction(callToAction, mapperProps),
     tags
   });
@@ -2236,11 +2226,11 @@ var createTabsComponent = (tabsProps) => __spreadProps(__spreadValues({}, tabsPr
 });
 
 // src/domain/mappers/layout/tabsLayoutToComponent.ts
-var tabsLayoutToComponent = (uid, { analyticsId, control, margin = "md", tags, tabs }, mapperProps, schemaComponents) => createTabsComponent({
+var tabsLayoutToComponent = (uid, { analyticsId, control, margin, tags, tabs }, mapperProps, schemaComponents) => createTabsComponent({
   uid,
   analyticsId,
   control,
-  margin,
+  margin: margin != null ? margin : "md",
   tags,
   tabs: mapTabs(tabs, uid, mapperProps, schemaComponents)
 });
@@ -2266,11 +2256,11 @@ var createProgressComponent = (progressProps) => __spreadValues({
 // src/domain/mappers/layout/progressLayoutToComponent.ts
 var progressLayoutToComponent = (uid, {
   analyticsId,
-  context = "neutral",
+  context,
   control,
   description,
   help,
-  margin = "md",
+  margin,
   progress,
   progressText,
   tags,
@@ -2278,11 +2268,11 @@ var progressLayoutToComponent = (uid, {
 }) => createProgressComponent({
   uid,
   analyticsId,
-  context: mapLegacyContext(context),
+  context: mapLegacyContext(context != null ? context : "neutral"),
   control,
   description,
   help: help == null ? void 0 : help.markdown,
-  margin,
+  margin: margin != null ? margin : "md",
   progress,
   progressText,
   tags,

package/build/main.mjs

@@ -1286,8 +1286,8 @@ var mapLegacyActionTypeToControl = (type) => type && type in legacyActionTypeToC
 var alertLayoutToComponent = (uid, {
   control,
   markdown,
-  margin = "md",
-  context = "neutral",
+  margin,
+  context,
   callToAction,
   analyticsId,
   tags
@@ -1298,9 +1298,9 @@ var alertLayoutToComponent = (uid, {
     analyticsId,
     control,
     markdown,
-    margin,
+    margin: margin != null ? margin : "md",
     callToAction: cta,
-    context: mapLegacyContext(context),
+    context: mapLegacyContext(context != null ? context : "neutral"),
     tags
   });
 };
@@ -1326,8 +1326,8 @@ var boxLayoutToComponent = (uid, {
   border = false,
   components,
   control,
-  margin = "md",
-  width = "xl",
+  margin,
+  width,
   analyticsId,
   tags
 }, mapperProps, schemaComponents) => createBoxComponent({
@@ -1335,8 +1335,8 @@ var boxLayoutToComponent = (uid, {
   analyticsId,
   border,
   control,
-  margin,
-  width,
+  margin: margin != null ? margin : "md",
+  width: width != null ? width : "xl",
   tags,
   components: components.map((component, index) => {
     const shouldRemoveMargin = index === components.length - 1 && component.margin === void 0;
@@ -1374,7 +1374,7 @@ var buttonLayoutToComponentWithBehavior = (uid, button, mapperProps) => {
     context,
     control,
     disabled,
-    margin = "md",
+    margin,
     pinOrder,
     size,
     title,
@@ -1395,7 +1395,7 @@ var buttonLayoutToComponentWithBehavior = (uid, button, mapperProps) => {
     context: mapLegacyContext(context != null ? context : "neutral"),
     control,
     disabled: disabled != null ? disabled : false,
-    margin,
+    margin: margin != null ? margin : "md",
     pinOrder,
     size,
     title: title != null ? title : "",
@@ -1469,12 +1469,12 @@ var createColumnsComponent = (columnsProps) => __spreadProps(__spreadValues({},
 });
 
 // src/domain/mappers/layout/columnsLayoutToComponent.ts
-var columnsLayoutToComponent = (uid, { control, left, right, bias = "none", margin = "md", analyticsId, tags }, mapperProps, schemaComponents) => createColumnsComponent({
+var columnsLayoutToComponent = (uid, { control, left, right, bias, margin, analyticsId, tags }, mapperProps, schemaComponents) => createColumnsComponent({
   uid,
   analyticsId,
   control,
-  margin,
-  bias: mapLegacyBias(bias),
+  margin: margin != null ? margin : "md",
+  bias: mapLegacyBias(bias != null ? bias : "none"),
   tags,
   startComponents: left.map(
     (component, index) => mapLayoutToComponent(
@@ -1555,7 +1555,7 @@ var mapSchemaAlert = (alert) => {
 var decisionLayoutToComponent = (uid, {
   analyticsId,
   control,
-  margin = "md",
+  margin,
   options,
   tags,
   title
@@ -1563,7 +1563,7 @@ var decisionLayoutToComponent = (uid, {
   uid,
   analyticsId,
   control,
-  margin,
+  margin: margin != null ? margin : "md",
   options: options.map((option) => mapOption(option, mapperProps)),
   tags,
   title
@@ -1594,7 +1594,7 @@ var createStatusListComponent = (statusListProps) => __spreadValues({
 var isDeprecatedListLayout = (layout) => {
   return layout.items.some((item) => item.status);
 };
-var deprecatedListLayoutToComponent = (uid, { analyticsId, control, items, margin = "md", title, tags }) => createStatusListComponent({
+var deprecatedListLayoutToComponent = (uid, { analyticsId, control, items, margin, title, tags }) => createStatusListComponent({
   uid,
   analyticsId,
   control,
@@ -1605,7 +1605,7 @@ var deprecatedListLayoutToComponent = (uid, { analyticsId, control, items, margi
     status: status ? mapLegacyStatus(status) : void 0,
     tags: itemTags
   })),
-  margin,
+  margin: margin != null ? margin : "md",
   title,
   tags
 });
@@ -1628,7 +1628,7 @@ var createDividerComponent = (props) => __spreadValues({
 }, props);
 
 // src/domain/mappers/layout/dividerLayoutToComponent.ts
-var dividerLayoutToComponent = (uid, { control, margin = "md", analyticsId, tags }) => createDividerComponent({ uid, analyticsId, control, margin, tags });
+var dividerLayoutToComponent = (uid, { control, margin, analyticsId, tags }) => createDividerComponent({ uid, analyticsId, control, margin: margin != null ? margin : "md", tags });
 
 // src/domain/components/FormComponent.ts
 var createFormComponent = (formProps) => __spreadProps(__spreadValues({}, formProps), {
@@ -1640,7 +1640,7 @@ var createFormComponent = (formProps) => __spreadProps(__spreadValues({}, formPr
 });
 
 // src/domain/mappers/layout/formLayoutToComponent.ts
-var formLayoutToComponent = (uid, { analyticsId, schemaId, schema: schemaRef, control, margin = "md", tags }, schemaComponents) => {
+var formLayoutToComponent = (uid, { analyticsId, schemaId, schema: schemaRef, control, margin, tags }, schemaComponents) => {
   const id = schemaId != null ? schemaId : schemaRef == null ? void 0 : schemaRef.$ref;
   if (id == null) {
     throw new Error(
@@ -1658,7 +1658,7 @@ var formLayoutToComponent = (uid, { analyticsId, schemaId, schema: schemaRef, co
     analyticsId,
     schemaComponent,
     control,
-    margin,
+    margin: margin != null ? margin : "md",
     tags
   });
 };
@@ -1670,13 +1670,13 @@ var createHeadingComponent = (headingProps) => __spreadValues({
 }, headingProps);
 
 // src/domain/mappers/layout/headingLayoutToComponent.ts
-var headingLayoutToComponent = (uid, { analyticsId, align = "left", margin = "md", size = "md", control, tags, text }) => createHeadingComponent({
+var headingLayoutToComponent = (uid, { analyticsId, align, margin, size, control, tags, text }) => createHeadingComponent({
   uid,
   analyticsId,
-  align: mapLegacyAlign(align),
+  align: mapLegacyAlign(align != null ? align : "left"),
   control,
-  margin,
-  size,
+  margin: margin != null ? margin : "md",
+  size: size != null ? size : "md",
   tags,
   text
 });
@@ -1691,11 +1691,11 @@ var createImageComponent = (imageProps) => __spreadValues({
 var imageLayoutToComponent = (uid, {
   analyticsId,
   accessibilityDescription,
-  align = "center",
+  align,
   content,
   control,
-  margin = "md",
-  size = "md",
+  margin,
+  size,
   tags,
   text,
   url
@@ -1704,14 +1704,14 @@ var imageLayoutToComponent = (uid, {
   return createImageComponent({
     uid,
     analyticsId,
-    align: mapLegacyAlign(align),
+    align: mapLegacyAlign(align != null ? align : "center"),
     content: content ? {
       uri: (_b = (_a = content.uri) != null ? _a : content.url) != null ? _b : "",
       accessibilityDescription: (_c = content.accessibilityDescription) != null ? _c : content.text
     } : { accessibilityDescription: accessibilityDescription != null ? accessibilityDescription : text, uri: url != null ? url : "" },
     control,
-    margin,
-    size,
+    margin: margin != null ? margin : "md",
+    size: size != null ? size : "md",
     tags
   });
 };
@@ -1723,13 +1723,13 @@ var createMarkdownComponent = (markdownProps) => __spreadValues({
 }, markdownProps);
 
 // src/domain/mappers/layout/infoLayoutToComponent.ts
-var infoLayoutToComponent = (uid, { analyticsId, align = "left", control, margin = "md", markdown: content, tags }) => createMarkdownComponent({
+var infoLayoutToComponent = (uid, { analyticsId, align, control, margin, markdown: content, tags }) => createMarkdownComponent({
   uid,
   analyticsId,
-  align: mapLegacyAlign(align),
+  align: mapLegacyAlign(align != null ? align : "left"),
   content,
   control,
-  margin,
+  margin: margin != null ? margin : "md",
   tags,
   size: "md"
 });
@@ -1741,7 +1741,7 @@ var createInstructionsComponent = (instructionsProps) => __spreadValues({
 }, instructionsProps);
 
 // src/domain/mappers/layout/instructionsLayoutToComponent.ts
-var instructionsLayoutToComponent = (uid, { analyticsId, control, items, margin = "md", tags, title }) => createInstructionsComponent({
+var instructionsLayoutToComponent = (uid, { analyticsId, control, items, margin, tags, title }) => createInstructionsComponent({
   uid,
   analyticsId,
   control,
@@ -1749,7 +1749,7 @@ var instructionsLayoutToComponent = (uid, { analyticsId, control, items, margin
     context: mapLegacyContext(item.context),
     tags: mapTags(item)
   })),
-  margin,
+  margin: margin != null ? margin : "md",
   tags,
   title
 });
@@ -1761,14 +1761,14 @@ var createListComponent = (listProps) => __spreadValues({
 }, listProps);
 
 // src/domain/mappers/layout/listLayoutToComponent.ts
-var listLayoutToComponent = (uid, { analyticsId, callToAction, control, items, margin = "md", tags, title }, mapperProps) => {
+var listLayoutToComponent = (uid, { analyticsId, callToAction, control, items, margin, tags, title }, mapperProps) => {
   return createListComponent({
     uid,
     analyticsId,
     control,
     items: items.map((item) => mapItem(item, mapperProps)),
     callToAction: getDomainLayerCallToAction(callToAction, mapperProps),
-    margin,
+    margin: margin != null ? margin : "md",
     tags,
     title
   });
@@ -1822,33 +1822,33 @@ var createLoadingIndicatorComponent = (loadingIndicatorProps) => __spreadValues(
 }, loadingIndicatorProps);
 
 // src/domain/mappers/layout/loadingIndicatorLayoutToComponent.ts
-var loadingIndicatorLayoutToComponent = (uid, { analyticsId, control, margin = "md", size = "md", tags }) => createLoadingIndicatorComponent({
+var loadingIndicatorLayoutToComponent = (uid, { analyticsId, control, margin, size, tags }) => createLoadingIndicatorComponent({
   uid,
   analyticsId,
   control,
-  margin,
-  size,
+  margin: margin != null ? margin : "md",
+  size: size != null ? size : "md",
   tags
 });
 
 // src/domain/mappers/layout/markdownLayoutToComponent.ts
 var markdownLayoutToComponent = (uid, {
   analyticsId,
-  align = "left",
-  margin = "md",
+  align,
+  margin,
   control,
   content,
-  size = "md",
+  size,
   tags
 }) => createMarkdownComponent({
   uid,
   analyticsId,
-  align: mapLegacyAlign(align),
+  align: mapLegacyAlign(align != null ? align : "left"),
   control,
   content,
-  margin,
+  margin: margin != null ? margin : "md",
   tags,
-  size
+  size: size != null ? size : "md"
 });
 
 // src/domain/components/ModalLayoutComponent.ts
@@ -1862,7 +1862,7 @@ var createModalComponent = (modalProps) => __spreadProps(__spreadValues({
 });
 
 // src/domain/mappers/layout/modalLayoutToComponent.ts
-var modalLayoutToComponent = (uid, { analyticsId, content, control, margin = "md", tags, trigger }, mapperProps, schemaComponents) => {
+var modalLayoutToComponent = (uid, { analyticsId, content, control, margin, tags, trigger }, mapperProps, schemaComponents) => {
   const { components, title } = content;
   return createModalComponent({
     uid,
@@ -1874,7 +1874,7 @@ var modalLayoutToComponent = (uid, { analyticsId, content, control, margin = "md
       title
     },
     control,
-    margin,
+    margin: margin != null ? margin : "md",
     tags,
     trigger
   });
@@ -1887,15 +1887,15 @@ var createParagraphComponent = (paragraphProps) => __spreadValues({
 }, paragraphProps);
 
 // src/domain/mappers/layout/paragraphLayoutToComponent.ts
-var paragraphLayoutToComponent = (uid, { analyticsId, align = "left", control, margin = "md", size = "md", tags, text }) => createParagraphComponent({
+var paragraphLayoutToComponent = (uid, { analyticsId, align, control, margin, size, tags, text }) => createParagraphComponent({
   uid,
   analyticsId,
   text,
   control,
-  align: mapLegacyAlign(align),
-  margin,
+  align: mapLegacyAlign(align != null ? align : "left"),
+  margin: margin != null ? margin : "md",
   tags,
-  size
+  size: size != null ? size : "md"
 });
 
 // src/domain/components/ReviewComponent.ts
@@ -1911,7 +1911,7 @@ var reviewLayoutToComponent = (uid, {
   title,
   callToAction,
   control,
-  margin = "md",
+  margin,
   tags,
   orientation,
   action
@@ -1921,7 +1921,7 @@ var reviewLayoutToComponent = (uid, {
   callToAction: getCallToAction2({ mapperProps, callToAction, action }),
   control: getOrientationControl({ control, orientation }),
   fields: fields.map((field) => mapReviewField(field, mapperProps)),
-  margin,
+  margin: margin != null ? margin : "md",
   tags,
   title
 });
@@ -2132,17 +2132,7 @@ var isValidResponseBody = (body) => isObject(body) && "results" in body && isArr
 var hashRequest = (query, config) => JSON.stringify({ query, config });
 
 // src/domain/mappers/layout/searchLayoutToComponent.ts
-var searchLayoutToComponent = (uid, {
-  analyticsId,
-  control,
-  emptyMessage = "",
-  method,
-  param,
-  title,
-  url,
-  margin = "md",
-  tags
-}, mapperProps) => {
+var searchLayoutToComponent = (uid, { analyticsId, control, emptyMessage, method, param, title, url, margin, tags }, mapperProps) => {
   const { httpClient, onBehavior, updateComponent } = mapperProps;
   const search = getPerformSearchFunction(httpClient, { method, param, url });
   return createSearchComponent(
@@ -2150,8 +2140,8 @@ var searchLayoutToComponent = (uid, {
       uid,
       analyticsId,
       control,
-      emptyMessage,
-      margin,
+      emptyMessage: emptyMessage != null ? emptyMessage : "",
+      margin: margin != null ? margin : "md",
       tags,
       title
     },
@@ -2162,7 +2152,7 @@ var searchLayoutToComponent = (uid, {
 };
 
 // src/domain/mappers/layout/statusListLayoutToComponent.ts
-var statusListLayoutToComponent = (uid, { analyticsId, control, items, margin = "md", tags, title }, mapperProps) => createStatusListComponent({
+var statusListLayoutToComponent = (uid, { analyticsId, control, items, margin, tags, title }, mapperProps) => createStatusListComponent({
   uid,
   analyticsId,
   control,
@@ -2170,7 +2160,7 @@ var statusListLayoutToComponent = (uid, { analyticsId, control, items, margin =
     const callToAction = getDomainLayerCallToAction(item.callToAction, mapperProps);
     return __spreadProps(__spreadValues({}, item), { callToAction, tags: mapTags(item) });
   }),
-  margin,
+  margin: margin != null ? margin : "md",
   tags,
   title
 });
@@ -2187,7 +2177,7 @@ var createSectionComponent = (props) => {
 };
 
 // src/domain/mappers/layout/sectionLayoutToComponent.ts
-var sectionLayoutToComponent = (uid, { analyticsId, control, title, components, callToAction, margin = "md", tags }, mapperProps, schemaComponents) => {
+var sectionLayoutToComponent = (uid, { analyticsId, control, title, components, callToAction, margin, tags }, mapperProps, schemaComponents) => {
   return createSectionComponent({
     uid,
     analyticsId,
@@ -2196,7 +2186,7 @@ var sectionLayoutToComponent = (uid, { analyticsId, control, title, components,
     components: components.map(
       (component, index) => mapLayoutToComponent(`${uid}.section-${index}`, component, mapperProps, schemaComponents)
     ),
-    margin,
+    margin: margin != null ? margin : "md",
     callToAction: getDomainLayerCallToAction(callToAction, mapperProps),
     tags
   });
@@ -2209,11 +2199,11 @@ var createTabsComponent = (tabsProps) => __spreadProps(__spreadValues({}, tabsPr
 });
 
 // src/domain/mappers/layout/tabsLayoutToComponent.ts
-var tabsLayoutToComponent = (uid, { analyticsId, control, margin = "md", tags, tabs }, mapperProps, schemaComponents) => createTabsComponent({
+var tabsLayoutToComponent = (uid, { analyticsId, control, margin, tags, tabs }, mapperProps, schemaComponents) => createTabsComponent({
   uid,
   analyticsId,
   control,
-  margin,
+  margin: margin != null ? margin : "md",
   tags,
   tabs: mapTabs(tabs, uid, mapperProps, schemaComponents)
 });
@@ -2239,11 +2229,11 @@ var createProgressComponent = (progressProps) => __spreadValues({
 // src/domain/mappers/layout/progressLayoutToComponent.ts
 var progressLayoutToComponent = (uid, {
   analyticsId,
-  context = "neutral",
+  context,
   control,
   description,
   help,
-  margin = "md",
+  margin,
   progress,
   progressText,
   tags,
@@ -2251,11 +2241,11 @@ var progressLayoutToComponent = (uid, {
 }) => createProgressComponent({
   uid,
   analyticsId,
-  context: mapLegacyContext(context),
+  context: mapLegacyContext(context != null ? context : "neutral"),
   control,
   description,
   help: help == null ? void 0 : help.markdown,
-  margin,
+  margin: margin != null ? margin : "md",
   progress,
   progressText,
   tags,

package/build/types/domain/mappers/layout/searchLayoutToComponent.d.ts

@@ -1,3 +1,3 @@
 import type { SearchLayout } from '@wise/dynamic-flow-types/spec';
 import type { MapperProps } from '../schema/types';
-export declare const searchLayoutToComponent: (uid: string, { analyticsId, control, emptyMessage, method, param, title, url, margin, tags, }: SearchLayout, mapperProps: MapperProps) => import("../../components/searchComponent/SearchComponent").SearchComponent;
+export declare const searchLayoutToComponent: (uid: string, { analyticsId, control, emptyMessage, method, param, title, url, margin, tags }: SearchLayout, mapperProps: MapperProps) => import("../../components/searchComponent/SearchComponent").SearchComponent;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wise/dynamic-flow-client",
-  "version": "5.1.0",
+  "version": "5.1.1",
   "description": "Dynamic Flow web client",
   "license": "Apache-2.0",
   "main": "./build/main.js",
@@ -33,29 +33,29 @@
   "devDependencies": {
     "@chromatic-com/storybook": "4.1.3",
     "@formatjs/cli": "^6.7.4",
-    "@storybook/addon-a11y": "^10.1.4",
-    "@storybook/addon-docs": "^10.1.4",
-    "@storybook/addon-links": "^10.1.4",
-    "@storybook/react-vite": "10.1.4",
+    "@storybook/addon-a11y": "^10.1.8",
+    "@storybook/addon-docs": "^10.1.8",
+    "@storybook/addon-links": "^10.1.8",
+    "@storybook/react-vite": "10.1.8",
     "@testing-library/dom": "10.4.1",
     "@testing-library/jest-dom": "6.9.1",
     "@testing-library/react": "16.3.0",
     "@testing-library/user-event": "14.6.1",
-    "@transferwise/components": "^46.115.1",
+    "@transferwise/components": "^46.116.1",
     "@transferwise/formatting": "^2.13.4",
     "@transferwise/icons": "4.0.0",
     "@transferwise/navigation-ui": "4.41.0",
     "@transferwise/neptune-css": "14.25.2",
-    "@types/node": "22.19.1",
+    "@types/node": "22.19.2",
     "@types/react": "18.3.27",
     "@types/react-dom": "18.3.7",
     "@types/react-intl": "3.0.0",
-    "@vitejs/plugin-react": "5.1.1",
+    "@vitejs/plugin-react": "5.1.2",
     "@wise/art": "2.24.7",
-    "@wise/components-theming": "^1.9.0",
+    "@wise/components-theming": "^1.9.1",
     "esbuild": "0.27.0",
-    "eslint-plugin-storybook": "10.1.4",
-    "framer-motion": "^12.23.25",
+    "eslint-plugin-storybook": "10.1.8",
+    "framer-motion": "^12.23.26",
     "npm-run-all2": "8.0.4",
     "postcss": "^8.5.6",
     "postcss-cli": "^11.0.1",
@@ -63,7 +63,7 @@
     "react": "18.3.1",
     "react-dom": "18.3.1",
     "react-intl": "6.8.9",
-    "storybook": "^10.1.4",
+    "storybook": "^10.1.8",
     "stylelint": "16.26.1",
     "stylelint-config-standard": "36.0.1",
     "stylelint-no-unsupported-browser-features": "8.0.5",
@@ -72,8 +72,8 @@
     "typescript": "5.9.3",
     "vitest": "4.0.15",
     "vitest-fetch-mock": "0.4.5",
-    "@wise/dynamic-flow-fixtures": "0.0.1",
-    "@wise/dynamic-flow-renderers": "0.0.0"
+    "@wise/dynamic-flow-renderers": "0.0.0",
+    "@wise/dynamic-flow-fixtures": "0.0.1"
   },
   "peerDependencies": {
     "@transferwise/components": "^46.104.0",
@@ -86,7 +86,7 @@
     "react-intl": "^6"
   },
   "dependencies": {
-    "@wise/dynamic-flow-types": "4.1.0"
+    "@wise/dynamic-flow-types": "4.1.1"
   },
   "scripts": {
     "dev": "EXCLUDE_VISUAL_TESTS=true pnpm storybook dev -p 3003",