@wise/dynamic-flow-client 3.15.3 → 3.16.1

package/build/main.js

@@ -1452,11 +1452,19 @@ var stepComponentToProps = ({
 
 // src/revamp/renderers/mappers/alertComponentToProps.ts
 var alertComponentToProps = ({
+  callToAction,
+  context,
+  control,
+  margin,
+  markdown
+}) => ({
+  type: "alert",
+  callToAction,
   context,
   control,
   margin,
   markdown
-}) => ({ type: "alert", context, control, margin, markdown });
+});
 
 // src/revamp/renderers/mappers/allOfComponentToProps.ts
 var allOfComponentToProps = ({ control, description, help, title }, children) => ({
@@ -5951,13 +5959,6 @@ var loadingIndicatorLayoutSchema = z.object({
   control: z.string().optional(),
   margin: sizeSchema.optional()
 });
-var alertLayoutSchema = z.object({
-  type: z.literal("alert"),
-  markdown: z.string(),
-  context: contextSchema.optional(),
-  control: z.string().optional(),
-  margin: sizeSchema.optional()
-});
 var paragraphLayoutSchema = z.object({
   type: z.literal("paragraph"),
   text: z.string(),
@@ -6112,6 +6113,9 @@ var actionTypeSchema = z.union([
   z.literal("negative")
 ]);
 var summarySchema = z.union([summaryProviderSchema, summarySummariserSchema]);
+var linkSchema = z.object({
+  url: z.string()
+});
 var actionSchema = z.object({
   title: z.string().optional(),
   type: actionTypeSchema.optional(),
@@ -6170,6 +6174,10 @@ var reviewLayoutFieldSchema = z.object({
   value: z.string(),
   help: helpSchema.optional()
 });
+var behaviorSchema = z.object({
+  action: actionSchema.optional(),
+  link: linkSchema.optional()
+});
 var searchResultSearchSchema = z.object({
   type: z.literal("search"),
   title: z.string(),
@@ -6200,44 +6208,6 @@ var linkHandlerSchema = z.object({
   regexPattern: z.string(),
   action: actionSchema
 });
-var blobSchemaSchema = z.object({
-  type: z.literal("blob"),
-  promoted: z.boolean().optional(),
-  $id: z.string().optional(),
-  title: z.string().optional(),
-  description: z.string().optional(),
-  control: z.string().optional(),
-  hidden: z.boolean().optional(),
-  icon: iconSchema.optional(),
-  image: imageSchema.optional(),
-  keywords: z.array(z.string()).optional(),
-  summary: summaryProviderSchema.optional(),
-  analyticsId: z.string().optional(),
-  validationAsync: validateAsyncSchema.optional(),
-  validationMessages: z.record(z.string()).optional(),
-  alert: alertLayoutSchema.optional(),
-  cameraConfig: jsonElementSchema.optional(),
-  accepts: z.array(z.string()).optional(),
-  maxSize: z.number().optional(),
-  source: uploadSourceSchema.optional(),
-  disabled: z.boolean().optional()
-});
-var constSchemaSchema = z.object({
-  hidden: z.boolean().optional(),
-  alert: alertLayoutSchema.optional(),
-  control: z.string().optional(),
-  promoted: z.boolean().optional(),
-  $id: z.string().optional(),
-  const: jsonElementSchema,
-  title: z.string().optional(),
-  description: z.string().optional(),
-  icon: iconSchema.optional(),
-  image: imageSchema.optional(),
-  keywords: z.array(z.string()).optional(),
-  summary: summaryProviderSchema.optional(),
-  analyticsId: z.string().optional(),
-  disabled: z.boolean().optional()
-});
 var pollingOnErrorSchema = z.object({
   action: actionSchema
 });
@@ -6249,6 +6219,11 @@ var reviewLayoutCallToActionSchema = z.object({
   title: z.string(),
   action: actionSchema
 });
+var alertLayoutCallToActionSchema = z.object({
+  title: z.string(),
+  accessibilityDescription: z.string().optional(),
+  behavior: behaviorSchema
+});
 var listLayoutSchema = z.object({
   type: z.literal("list"),
   items: z.array(listLayoutItemSchema),
@@ -6292,9 +6267,55 @@ var navigationSchema = z.object({
   back: navigationBackBehaviourSchema.optional(),
   stackBehavior: navigationStackBehaviorSchema.optional()
 });
+var alertLayoutSchema = z.object({
+  type: z.literal("alert"),
+  markdown: z.string(),
+  context: contextSchema.optional(),
+  control: z.string().optional(),
+  margin: sizeSchema.optional(),
+  callToAction: alertLayoutCallToActionSchema.optional()
+});
 var searchResponseBodySchema = z.object({
   results: z.array(searchResultSchema)
 });
+var blobSchemaSchema = z.object({
+  type: z.literal("blob"),
+  promoted: z.boolean().optional(),
+  $id: z.string().optional(),
+  title: z.string().optional(),
+  description: z.string().optional(),
+  control: z.string().optional(),
+  hidden: z.boolean().optional(),
+  icon: iconSchema.optional(),
+  image: imageSchema.optional(),
+  keywords: z.array(z.string()).optional(),
+  summary: summaryProviderSchema.optional(),
+  analyticsId: z.string().optional(),
+  validationAsync: validateAsyncSchema.optional(),
+  validationMessages: z.record(z.string()).optional(),
+  alert: alertLayoutSchema.optional(),
+  cameraConfig: jsonElementSchema.optional(),
+  accepts: z.array(z.string()).optional(),
+  maxSize: z.number().optional(),
+  source: uploadSourceSchema.optional(),
+  disabled: z.boolean().optional()
+});
+var constSchemaSchema = z.object({
+  hidden: z.boolean().optional(),
+  alert: alertLayoutSchema.optional(),
+  control: z.string().optional(),
+  promoted: z.boolean().optional(),
+  $id: z.string().optional(),
+  const: jsonElementSchema,
+  title: z.string().optional(),
+  description: z.string().optional(),
+  icon: iconSchema.optional(),
+  image: imageSchema.optional(),
+  keywords: z.array(z.string()).optional(),
+  summary: summaryProviderSchema.optional(),
+  analyticsId: z.string().optional(),
+  disabled: z.boolean().optional()
+});
 var layoutSchema = z.lazy(
   () => z.union([
     alertLayoutSchema,
@@ -6939,13 +6960,39 @@ var legacyActionTypeToControl = {
 var mapLegacyActionTypeToControl = (type) => type && type in legacyActionTypeToControl ? legacyActionTypeToControl[type] : "secondary";
 
 // src/revamp/domain/mappers/layout/alertLayoutToComponent.ts
-var alertLayoutToComponent = (uid, { control, markdown, margin = "md", context = "neutral" }) => createAlertComponent({
-  uid,
-  control,
-  markdown,
-  margin,
-  context: mapLegacyContext(context)
-});
+var alertLayoutToComponent = (uid, { control, markdown, margin = "md", context = "neutral", callToAction }, { onAction }) => {
+  return createAlertComponent({
+    uid,
+    control,
+    markdown,
+    margin,
+    callToAction: callToAction ? getComponentCallToAction(callToAction, onAction) : void 0,
+    context: mapLegacyContext(context)
+  });
+};
+var getComponentCallToAction = (callToAction, onAction) => {
+  const { accessibilityDescription, behavior, title } = callToAction;
+  if (behavior.link) {
+    const { url } = behavior.link;
+    return {
+      type: "link",
+      accessibilityDescription,
+      href: url,
+      title
+    };
+  }
+  if (behavior.action) {
+    const { action } = behavior;
+    return {
+      type: "action",
+      accessibilityDescription,
+      title,
+      onClick: () => {
+        void onAction(action);
+      }
+    };
+  }
+};
 
 // src/revamp/domain/components/BoxComponent.ts
 var createBoxComponent = (boxProps) => __spreadProps(__spreadValues({}, boxProps), {
@@ -9629,7 +9676,7 @@ var mapSchemaToComponent = (schemaMapperProps, mapperProps) => {
     return createContainerComponent({
       uid,
       components: [
-        alertLayoutToComponent(`${uid}.container.alert`, alert),
+        alertLayoutToComponent(`${uid}.container.alert`, alert, mapperProps),
         getSchemaComponent(__spreadProps(__spreadValues({}, schemaMapperProps), { uid: `${uid}.container` }), mapperProps)
       ]
     });
@@ -9925,13 +9972,17 @@ var getReviewAction = (onAction, callToAction, action) => {
   if (callToAction) {
     return {
       title: callToAction.title,
-      onClick: () => onAction(callToAction.action)
+      onClick: () => {
+        void onAction(callToAction.action);
+      }
     };
   }
   if (action == null ? void 0 : action.title) {
     return {
       title: action.title,
-      onClick: () => onAction(action)
+      onClick: () => {
+        void onAction(action);
+      }
     };
   }
   return void 0;
@@ -10128,7 +10179,7 @@ var mapLegacyStatus = (status) => {
 var mapLayoutToComponent = (uid, layout, mapperProps) => {
   switch (layout.type) {
     case "alert":
-      return alertLayoutToComponent(uid, layout);
+      return alertLayoutToComponent(uid, layout, mapperProps);
     case "box":
       return boxLayoutToComponent(uid, layout, mapperProps);
     case "button":
@@ -10901,7 +10952,20 @@ var getTextAlignmentAndMargin = (component) => `${getTextAlignment(component.ali
 var import_jsx_runtime7 = require("react/jsx-runtime");
 var AlertRenderer = {
   canRenderType: "alert",
-  render: ({ context, markdown, margin }) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_components2.Alert, { type: context, className: getMargin(margin), message: markdown })
+  render: ({ context, markdown, margin, callToAction }) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    import_components2.Alert,
+    {
+      type: context,
+      className: getMargin(margin),
+      message: markdown,
+      action: (callToAction == null ? void 0 : callToAction.type) === "link" ? {
+        text: callToAction.title,
+        "aria-label": callToAction.accessibilityDescription,
+        href: callToAction.href,
+        target: "_blank"
+      } : void 0
+    }
+  )
 };
 var AlertRenderer_default = AlertRenderer;
 
@@ -12123,23 +12187,26 @@ function SearchResults({
   state
 }) {
   const trackEvent = useTrackEvent();
-  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_components26.NavigationOptionsList, { children: state.results.map((result) => /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
-    import_components26.NavigationOption,
-    {
-      title: result.title,
-      content: result.description,
-      media: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(NavigationOptionMedia, __spreadValues({}, result)),
-      showMediaCircle: false,
-      showMediaAtAllSizes: true,
-      onClick: () => {
-        trackEvent("Search Result Selected", __spreadValues({
-          type: result.type
-        }, result.type === "action" ? { actionId: result.id } : {}));
-        result.onClick();
-      }
-    },
-    JSON.stringify(result)
-  )) });
+  return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_components26.NavigationOptionsList, { children: state.results.map((result) => {
+    const { icon, image } = result;
+    return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+      import_components26.NavigationOption,
+      {
+        title: result.title,
+        content: result.description,
+        media: NavigationOptionMedia({ icon, image }),
+        showMediaCircle: false,
+        showMediaAtAllSizes: true,
+        onClick: () => {
+          trackEvent("Search Result Selected", __spreadValues({
+            type: result.type
+          }, result.type === "action" ? { actionId: result.id } : {}));
+          result.onClick();
+        }
+      },
+      JSON.stringify(result)
+    );
+  }) });
 }
 var BlockSearchRendererComponent_default = BlockSearchRendererComponent;
 
@@ -12837,7 +12904,7 @@ function StepRendererComponent(props) {
   }
   return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)(StepRendererContextProvider, { value, children: [
     back ? /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(BackButton_default, __spreadValues({}, back)) : null,
-    title ? /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("h2", { className: "text-xs-center m-b-2", children: title }) : void 0,
+    title ? /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_components39.Title, { as: "h1", type: "title-section", className: "text-xs-center m-b-2", children: title }) : void 0,
     description ? /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("p", { className: "text-xs-center m-b-2", children: description }) : void 0,
     error ? /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_components39.Alert, { type: "negative", className: "m-b-2", message: error }) : void 0,
     children
@@ -14367,17 +14434,36 @@ var getTextAlignmentAndMargin2 = (component) => `${getTextAlignment2(component.a
 
 // src/legacy/layout/alert/DynamicAlert.tsx
 var import_jsx_runtime71 = require("react/jsx-runtime");
-var DynamicAlert = (props) => {
-  const alert = props.component;
+var DynamicAlert = ({ component: alert }) => {
+  const { context, markdown, margin } = alert;
   return /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
     import_components41.Alert,
     {
-      type: mapContextToAlertType(legacy_mapContext(alert.context)),
-      className: getMargin2(alert.margin),
-      message: alert.markdown
+      type: mapContextToAlertType(legacy_mapContext(context)),
+      className: getMargin2(margin),
+      message: markdown,
+      action: getAlertAction(alert)
     }
   );
 };
+var isAlertLayout = (layout) => {
+  return Object.hasOwnProperty.call(layout, "type") && layout.type === "alert";
+};
+var getAlertAction = (component) => {
+  if (!isAlertLayout(component) || !component.callToAction) {
+    return void 0;
+  }
+  const { title, accessibilityDescription, behavior } = component.callToAction;
+  if (!behavior.link) {
+    return void 0;
+  }
+  return {
+    text: title,
+    "aria-label": accessibilityDescription,
+    href: behavior.link.url,
+    target: "_blank"
+  };
+};
 var legacy_mapContext = (context) => {
   switch (context) {
     case "success":
@@ -16065,7 +16151,8 @@ var _FormControl = class _FormControl extends import_react39.PureComponent {
       maxDate,
       value,
       mode,
-      describedBy
+      describedBy,
+      labelledBy
     } = this.props;
     switch (type) {
       case FormControlType.RADIO:
@@ -16230,6 +16317,7 @@ var _FormControl = class _FormControl extends import_react39.PureComponent {
         return /* @__PURE__ */ (0, import_jsx_runtime90.jsx)(
           import_components54.DateInput,
           {
+            "aria-labelledby": labelledBy,
             dayAutoComplete: this.getAutocompleteValue({ suffix: "-day" }),
             yearAutoComplete: this.getAutocompleteValue({ suffix: "-year" }),
             disabled,
@@ -16480,7 +16568,8 @@ function SchemaFormControl(props) {
     onFocus,
     onBlur,
     onSearchChange,
-    describedBy
+    describedBy,
+    labelledBy
   } = props;
   const log = useLogger();
   const intl = (0, import_react_intl31.useIntl)();
@@ -16517,6 +16606,7 @@ function SchemaFormControl(props) {
       intl
     }, mapSchemaToUploadOptions(schema)),
     describedBy,
+    labelledBy,
     required
   };
   return /* @__PURE__ */ (0, import_jsx_runtime91.jsx)("div", { "aria-describedby": describedBy, children: /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(FormControl, __spreadValues(__spreadValues({ type: controlType, value: safeValue }, events), controlProps)) });
@@ -18041,11 +18131,12 @@ var BasicTypeSchema = (props) => {
   const showLabel = props.schema.format !== "file" && props.schema.type !== "boolean";
   const schemaHelp = props.schema.help;
   const feedbackId = `${id}-feedback`;
+  const labelId = `${id}-label`;
   return !isHidden ? /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)(import_jsx_runtime117.Fragment, { children: [
     props.schema.alert && /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(DynamicAlert_default, { component: props.schema.alert }),
     /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)("div", { className: (0, import_classnames15.default)(formGroupClasses), children: [
       showLabel && /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)("div", { className: "d-inline-block m-b-1", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime117.jsx)("label", { className: "control-label d-inline", htmlFor: id, children: props.schema.title }),
+        /* @__PURE__ */ (0, import_jsx_runtime117.jsx)("label", { className: "control-label d-inline", htmlFor: id, id: labelId, children: props.schema.title }),
         !!schemaHelp && /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(Help_default2, { help: schemaHelp })
       ] }),
       !showLabel && !!schemaHelp && /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(Help_default2, { help: schemaHelp }),
@@ -18059,7 +18150,8 @@ var BasicTypeSchema = (props) => {
           onChange,
           onFocus,
           onBlur,
-          describedBy: feedbackId
+          describedBy: feedbackId,
+          labelledBy: labelId
         }
       ),
       /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(