@seamly/web-ui 22.3.0-beta.1 → 22.3.0-beta.2

package/build/dist/lib/style-guide.js

@@ -2622,7 +2622,7 @@ _API_ready = new WeakMap(), _API_externalId = new WeakMap(), _API_conversationAu
   return {
     clientName: "@seamly/web-ui",
     clientVariant: api_classPrivateFieldGet(this, _API_layoutMode, "f"),
-    clientVersion: "22.3.0-beta.1",
+    clientVersion: "22.3.0-beta.2",
     currentUrl: window.location.toString(),
     screenResolution: `${window.screen.width}x${window.screen.height}`,
     timezone: getTimeZone(),
@@ -10843,7 +10843,8 @@ function CarouselMessageSlide({
 /* harmony default export */ const icon_send_32 = ("<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32px\" height=\"32px\" x=\"0px\" y=\"0px\" viewBox=\"0 0 32 32\"><defs/><path fill=\"#4A48C1\" d=\"M6.714,14.985l17.837-7.906c0.681-0.302,1.414,0.301,1.25,1.027L22.273,23.59\tc-0.13,0.566-0.751,0.865-1.275,0.613l-3.623-1.752l-2.334,2.287c-0.572,0.562-1.538,0.156-1.538-0.645V21.01\tc0-0.217,0.078-0.43,0.222-0.594l7.676-8.841l-10.414,7.472l-4.351-2.445C5.987,16.236,6.033,15.287,6.714,14.985L6.714,14.985z\"/></svg>");
 ;// CONCATENATED MODULE: ./node_modules/raw-loader/dist/cjs.js!./src/icons/icon_upload-32.svg
 /* harmony default export */ const icon_upload_32 = ("<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32px\" height=\"32px\" x=\"0px\" y=\"0px\" viewBox=\"0 0 32 32\"><defs/><path fill=\"#4A48C1\" d=\"M9.488,13.481c-0.391-0.391-0.391-1.023,0-1.414l5.805-5.805c0.026-0.026,0.06-0.036,0.088-0.058\tc0.073-0.06,0.146-0.119,0.235-0.156c0.246-0.103,0.522-0.103,0.769,0c0.093,0.039,0.171,0.101,0.249,0.165\tc0.023,0.02,0.053,0.027,0.074,0.049l5.805,5.805c0.391,0.391,0.391,1.023,0,1.414c-0.195,0.195-0.451,0.293-0.707,0.293\ts-0.512-0.098-0.707-0.293L17,9.383V20.33c0,0.553-0.447,1-1,1c-0.552,0-1-0.447-1-1V9.383l-4.098,4.098\tC10.512,13.872,9.879,13.872,9.488,13.481z M22.819,24.031H9.181c-0.552,0-1,0.447-1,1s0.448,1,1,1h13.639c0.553,0,1-0.447,1-1\tS23.372,24.031,22.819,24.031z\"/></svg>");
-;// CONCATENATED MODULE: ./src/javascripts/ui/components/layout/icon.js
+;// CONCATENATED MODULE: ./src/javascripts/ui/components/layout/icon.tsx
+
 /* eslint-disable import/no-webpack-loader-syntax */
 // The eslint rules are disabled for this as otherwsise we'd need to include the loader rule in all implementations
 // this can again be changed when we can import pre-built packages in implementations
@@ -10868,58 +10869,70 @@ function CarouselMessageSlide({
 
 
 
-
 
 
 /* eslint-enable import/no-webpack-loader-syntax */
-
-
-
 const ICONS = {
-  send32: icon_send_32,
-  balloon32: icon_balloon_32,
-  newTopic32: icon_newtopic_32,
-  newTranslation16: icon_newtranslation_16,
-  newTranslation32: icon_newtranslation_32,
-  avatar32: avatar_bot_32,
-  chevronDown8: icon_chevron_down_8,
-  chevronDown32: icon_chevron_down_32,
-  chevronRight8: icon_chevron_right_8,
-  chevronRight16: icon_chevron_right_16,
-  close8: icon_close_8,
-  close16: icon_close_16,
-  enlarge32: icon_enlarge_32,
-  options32: icon_options_32,
-  file32: icon_file_32,
-  upload32: icon_upload_32,
-  download16: icon_download_16,
-  error16: icon_error_16,
-  arrowLeft16: icon_arrow_left_16,
-  arrowRight16: icon_arrow_right_16,
-  check32: icon_check_32,
-  check16: icon_check_16
-};
-const Icon = ({
-  name,
-  size = '32',
-  className = undefined,
-  alt
-}) => {
-  const iconName = `${name}${size}`;
-  return (0,jsx_runtime_namespaceObject.jsxs)(jsx_runtime_namespaceObject.Fragment, {
-    children: [(0,jsx_runtime_namespaceObject.jsx)("div", {
-      "aria-hidden": "true",
-      className: className || css_className('icon'),
-      dangerouslySetInnerHTML: {
-        __html: ICONS[iconName]
-      }
-    }), alt && (0,jsx_runtime_namespaceObject.jsx)("span", {
-      className: css_className('visually-hidden'),
-      children: alt
-    })]
-  });
+    send: {
+        32: icon_send_32,
+    },
+    balloon: {
+        32: icon_balloon_32,
+    },
+    newTopic: {
+        32: icon_newtopic_32,
+    },
+    newTranslation: {
+        16: icon_newtranslation_16,
+        32: icon_newtranslation_32,
+    },
+    avatar: {
+        32: avatar_bot_32,
+    },
+    chevronDown: {
+        8: icon_chevron_down_8,
+        32: icon_chevron_down_32,
+    },
+    chevronRight: {
+        8: icon_chevron_right_8,
+        16: icon_chevron_right_16,
+    },
+    close: {
+        8: icon_close_8,
+        16: icon_close_16,
+    },
+    enlarge: {
+        32: icon_enlarge_32,
+    },
+    options: {
+        32: icon_options_32,
+    },
+    file: {
+        32: icon_file_32,
+    },
+    upload: {
+        32: icon_upload_32,
+    },
+    download: {
+        16: icon_download_16,
+    },
+    error: {
+        16: icon_error_16,
+    },
+    arrowLeft: {
+        16: icon_arrow_left_16,
+    },
+    arrowRight: {
+        16: icon_arrow_right_16,
+    },
+    check: {
+        16: icon_check_16,
+        32: icon_check_32,
+    },
 };
+const Icon = ({ name, size = '32', className, alt }) => ((0,jsx_runtime_namespaceObject.jsxs)(jsx_runtime_namespaceObject.Fragment, { children: [(0,jsx_runtime_namespaceObject.jsx)("div", { "aria-hidden": "true", className: className || css_className('icon'), dangerouslySetInnerHTML: { __html: ICONS[name][size] } }), alt && (0,jsx_runtime_namespaceObject.jsx)("span", { className: css_className('visually-hidden'), children: alt })] }));
 /* harmony default export */ const layout_icon = (Icon);
+
 ;// CONCATENATED MODULE: ./src/javascripts/ui/components/conversation/event/carousel-component/components/controls.js
 
 
@@ -10950,7 +10963,8 @@ function CarouselControls({
       onClick: handlePrevious,
       children: (0,jsx_runtime_namespaceObject.jsx)(layout_icon, {
         name: "arrowLeft",
-        size: "16"
+        size: "16",
+        alt: ""
       })
     }), children, (0,jsx_runtime_namespaceObject.jsx)("button", {
       className: css_className('button', 'button--next'),
@@ -10958,7 +10972,8 @@ function CarouselControls({
       onClick: handleNext,
       children: (0,jsx_runtime_namespaceObject.jsx)(layout_icon, {
         name: "arrowRight",
-        size: "16"
+        size: "16",
+        alt: ""
       })
     })]
   });
@@ -11245,7 +11260,8 @@ const ChoicePrompt = ({
       "aria-describedby": descriptorId,
       children: [showOptions ? t('message.choicePrompts.cancelChooseAgain') : t('message.choicePrompts.chooseAgain'), (0,jsx_runtime_namespaceObject.jsx)(layout_icon, {
         name: "chevronDown",
-        size: "8"
+        size: "8",
+        alt: ""
       })]
     }), showOptions && (0,jsx_runtime_namespaceObject.jsx)(message_container, {
       type: "choice-prompt",
@@ -11305,7 +11321,8 @@ const SuggestionsItem = ({
       className: css_className('button', 'button--primary'),
       children: [hasIcon && (0,jsx_runtime_namespaceObject.jsx)(layout_icon, {
         name: "chevronRight",
-        size: "8"
+        size: "8",
+        alt: ""
       }), question]
     })
   });
@@ -11535,7 +11552,8 @@ function EventDivider({
       children: iconName ? (0,jsx_runtime_namespaceObject.jsx)(layout_icon, {
         name: iconName,
         size: iconSize,
-        className: iconClassName
+        className: iconClassName,
+        alt: ""
       }) : (0,jsx_runtime_namespaceObject.jsx)("img", {
         src: graphicSrc,
         className: css_className({
@@ -13423,7 +13441,8 @@ const Lightbox = ({
         onClick: onClose,
         children: [(0,jsx_runtime_namespaceObject.jsx)(layout_icon, {
           name: "close",
-          size: "16"
+          size: "16",
+          alt: ""
         }), t('lightbox.closeLabel')]
       })]
     })
@@ -13471,7 +13490,8 @@ const ImageLightbox = ({
         description
       }), (0,jsx_runtime_namespaceObject.jsx)(layout_icon, {
         name: "enlarge",
-        size: "32"
+        size: "32",
+        alt: ""
       })]
     }), showLightBox && (0,jsx_runtime_namespaceObject.jsx)(lightbox, {
       url: url,
@@ -15797,7 +15817,8 @@ function error_Error({
       className: css_className('error__message'),
       children: [(0,jsx_runtime_namespaceObject.jsx)(layout_icon, {
         name: "error",
-        size: "16"
+        size: "16",
+        alt: ""
       }), error]
     })
   });
@@ -16174,7 +16195,8 @@ const OptionsButton = () => {
       "aria-disabled": !multiMenu && !firstOption.available ? 'true' : null,
       children: [multiMenu && (0,jsx_runtime_namespaceObject.jsx)(layout_icon, {
         name: "options",
-        size: "32"
+        size: "32",
+        alt: ""
       }), (0,jsx_runtime_namespaceObject.jsx)("span", {
         className: css_className('button__text'),
         children: multiMenu ? t('options.openButtonText') : `${firstOption.title}${!firstOption.available ? ' ' : ''}`
@@ -16197,7 +16219,7 @@ const TranslationOption = ({ label, checked, description, onChange, id, itemClas
             onChange();
         }
     };
-    return ((0,jsx_runtime_namespaceObject.jsxs)("li", { className: css_className([itemClassName, 'translation-options__item']), "aria-selected": checked, role: "option", tabIndex: 0, onClick: onChange, onKeyDown: onKeyDown, id: id, children: [(0,jsx_runtime_namespaceObject.jsx)(layout_icon, { alt: "", name: "check", size: "16" }), label, " ", description && (0,jsx_runtime_namespaceObject.jsxs)("span", { children: ["(", description, ")"] })] }));
+    return ((0,jsx_runtime_namespaceObject.jsxs)("li", { className: css_className([itemClassName, 'translation-options__item']), "aria-selected": checked, role: "option", tabIndex: 0, onClick: onChange, onKeyDown: onKeyDown, id: id, children: [(0,jsx_runtime_namespaceObject.jsx)(layout_icon, { name: "check", size: "16", alt: "" }), label, " ", description && (0,jsx_runtime_namespaceObject.jsxs)("span", { children: ["(", description, ")"] })] }));
 };
 /* harmony default export */ const translation_option = (TranslationOption);
 
@@ -17024,7 +17046,8 @@ function FileInput({
         className: css_className('upload__label'),
         children: [(0,jsx_runtime_namespaceObject.jsx)(layout_icon, {
           name: "upload",
-          size: "32"
+          size: "32",
+          alt: ""
         }), (0,jsx_runtime_namespaceObject.jsxs)("div", {
           children: [(0,jsx_runtime_namespaceObject.jsx)("span", {
             className: css_className(['upload__label--text']),
@@ -17767,7 +17790,8 @@ const ButtonIcon = () => {
     alt: ""
   }) : (0,jsx_runtime_namespaceObject.jsx)(layout_icon, {
     name: "avatar",
-    size: "32"
+    size: "32",
+    alt: ""
   });
 };
 const WindowOpenButton = ({
@@ -19763,7 +19787,7 @@ const standardState = {
         type: 'carousel',
         id: randomId(),
         body: {
-          cards: [cardAskText.payload.body, cardNavigate.payload.body, cardTopic.payload.body]
+          cards: [cardAskText.payload.body, cardNavigate.payload.body, cardTopic.payload.body, cardNoImage.payload.body]
         }
       }
     }]
@@ -20162,6 +20186,13 @@ const standardState = {
         }
       }
     },
+    config: {
+      ...baseState.config,
+      context: {
+        ...baseState.context,
+        locale: 'nl'
+      }
+    },
     translations: {
       ...translationsSlice,
       isAvailable: true,