@sankhyalabs/ezui 5.22.0-dev.12 → 5.22.0-dev.120

package/dist/cjs/ez-custom-form-input_2.cjs.entry.js

@@ -1,206 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-9e5554cb.js');
-const ICustomRender = require('./ICustomRender-6fafffce.js');
-const core = require('@sankhyalabs/core');
-const ApplicationUtils = require('./ApplicationUtils-c9d1205c.js');
-require('./DialogType-2114c337.js');
-require('./CheckMode-ecb90b87.js');
-
-const EzCustomFormInput = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.gui = undefined;
-    this.customEditor = undefined;
-    this.formViewField = undefined;
-    this.value = undefined;
-    this.detailContext = undefined;
-    this.builderFallback = undefined;
-    this.selectedRecord = undefined;
-  }
-  /**
-   * Aplica foco no campo.
-   */
-  async setFocus() {
-    var _a, _b;
-    (_b = (_a = this.gui) === null || _a === void 0 ? void 0 : _a["setFocus"]) === null || _b === void 0 ? void 0 : _b.call(_a);
-  }
-  /**
-   * Remove o foco do campo.
-   */
-  async setBlur() {
-    var _a, _b;
-    (_b = (_a = this.gui) === null || _a === void 0 ? void 0 : _a["setBlur"]) === null || _b === void 0 ? void 0 : _b.call(_a);
-  }
-  /**
-   * Retorna se o conteúdo é inválido.
-   */
-  async isInvalid() {
-    var _a, _b;
-    return ((_b = (_a = this.gui) === null || _a === void 0 ? void 0 : _a["isInvalid"]) === null || _b === void 0 ? void 0 : _b.call(_a)) || false;
-  }
-  getContent() {
-    var _a, _b;
-    const fieldProps = new Map();
-    for (const prop in this.formViewField.props) {
-      fieldProps.set(prop, this.formViewField.props[prop]);
-    }
-    const params = {
-      value: this.value,
-      name: this.formViewField.name,
-      currentEditor: this.builderFallback(this.formViewField),
-      setValue: (value) => this.setValue(value),
-      getValue: this.getValue,
-      record: this.selectedRecord,
-      editorMetadata: {
-        label: this.formViewField.label,
-        hidden: ((_a = this.formViewField.props) === null || _a === void 0 ? void 0 : _a.visible) === false,
-        userInterface: this.formViewField.userInterface,
-        options: (_b = this.formViewField.props) === null || _b === void 0 ? void 0 : _b.options,
-        props: this.formViewField.props ? fieldProps : undefined,
-        optionLoader: this.formViewField.optionLoader
-      },
-      source: ICustomRender.CustomEditorSource.FORM,
-      detailContext: this.detailContext
-    };
-    let gui = this.customEditor.getEditorElement(params);
-    if (!gui) {
-      gui = this.builderFallback(this.formViewField);
-      this.handleValue(gui);
-      this.gui = gui;
-      return;
-    }
-    if (!(gui instanceof index.H) && typeof gui !== 'string') {
-      this.handleValue(gui);
-      this.gui = gui;
-      return;
-    }
-    if (typeof gui === 'string') {
-      gui = core.HTMLBuilder.parseElement(gui);
-    }
-    if (this.value) {
-      gui.setAttribute('value', typeof this.value === 'object' ? this.value.value : this.value);
-    }
-    this.gui = index.h("div", { key: core.StringUtils.generateUUID(), ref: el => el && el.appendChild(gui) });
-  }
-  setValue(value) {
-    this.value = value;
-  }
-  getValue() {
-    return this.value;
-  }
-  handleValue(gui) {
-    var _a;
-    //@ts-ignore
-    (_a = gui.$children$) === null || _a === void 0 ? void 0 : _a.forEach((child) => {
-      child.$attrs$.value = this.value;
-    });
-  }
-  componentWillRender() {
-    this.getContent();
-  }
-  render() {
-    return (index.h(index.Host, null, this.gui));
-  }
-};
-
-const ezTextEditCss = ":host{display:flex;align-items:center;gap:5px}.text-edit__form-input{width:auto;--ez-text-input__input--padding:0px}.text-edit__hidden-value{visibility:hidden;position:absolute;white-space:nowrap;z-index:-1;top:0;left:0}";
-
-const EzTextEdit = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.saveEdition = index.createEvent(this, "saveEdition", 7);
-    this.cancelEdition = index.createEvent(this, "cancelEdition", 7);
-    this._newValue = undefined;
-    this.value = undefined;
-    this.styled = undefined;
-  }
-  /**
-   * Aplica foco no campo.
-   */
-  async applyFocusSelect() {
-    this.calcSizeInput(this.value, true);
-  }
-  calcSizeInput(value, setSelect = false) {
-    var _a, _b;
-    const textInput = (_b = (_a = this._inputElement) === null || _a === void 0 ? void 0 : _a.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('input');
-    if (textInput != undefined) {
-      const sizeText = this.getWidthValue(value);
-      textInput.style.width = sizeText + 'px';
-      if (setSelect) {
-        setTimeout(() => textInput.select(), 100);
-      }
-    }
-  }
-  getWidthValue(value) {
-    if (this._valueBasis != undefined) {
-      const span = this._valueBasis;
-      if (value != undefined) {
-        const cursorSpace = 2;
-        span.innerHTML = value;
-        return span.clientWidth > 0 ? (span.clientWidth + cursorSpace) : cursorSpace;
-      }
-      else {
-        span.innerHTML = "";
-      }
-    }
-    return 0;
-  }
-  setStyledInput() {
-    var _a, _b;
-    let fontSize = "";
-    let fontWeight = "";
-    let fontFamily = "";
-    if (this.styled != undefined) {
-      fontSize = this.styled.fontSize;
-      fontWeight = this.styled.fontWeight;
-      fontFamily = this.styled.fontFamily;
-    }
-    const textInput = (_b = (_a = this._inputElement) === null || _a === void 0 ? void 0 : _a.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('input');
-    if (textInput != undefined) {
-      textInput.style.fontSize = fontSize;
-      textInput.style.fontWeight = fontWeight;
-      textInput.style.fontFamily = fontFamily;
-    }
-    const span = this._valueBasis;
-    if (span != undefined) {
-      span.style.fontSize = fontSize;
-      span.style.fontWeight = fontWeight;
-      span.style.fontFamily = fontFamily;
-    }
-  }
-  handleSaveEdition() {
-    if (!this._newValue) {
-      ApplicationUtils.ApplicationUtils.alert("Aviso", "Não é possível salvar um campo em branco.").then(() => {
-        this.setNewValue(this.value, true);
-      });
-      return;
-    }
-    this.saveEdition.emit({ value: this.value, newValue: this._newValue });
-  }
-  handleCancelEdition() {
-    this.cancelEdition.emit();
-  }
-  setNewValue(value, setSelect = false) {
-    this._newValue = value;
-    this.calcSizeInput(this._newValue, setSelect);
-  }
-  componentDidLoad() {
-    this.applyFocusSelect();
-    this.setNewValue(this.value);
-  }
-  componentDidRender() {
-    this.setStyledInput();
-  }
-  render() {
-    core.ElementIDUtils.addIDInfoIfNotExists(this._element, 'input');
-    return (index.h(index.Host, null, index.h("span", { class: "text-edit__hidden-value", ref: elem => this._valueBasis = elem }), index.h("ez-text-input", { "data-element-id": core.ElementIDUtils.getInternalIDInfo("textInput"), onInput: () => { this.calcSizeInput(this._newValue); }, class: "text-edit__form-input", value: this._newValue, ref: (elem) => this._inputElement = elem, mode: "slim", onEzChange: (evt) => this.setNewValue(evt === null || evt === void 0 ? void 0 : evt.detail), noBorder: true }), index.h("ez-button", { class: "text-edit__icon-check", mode: "icon", iconName: "check", size: "small", onClick: () => { this.handleSaveEdition(); } }), index.h("ez-button", { class: "text-edit__icon-close", mode: "icon", iconName: "close", size: "small", onClick: () => { this.handleCancelEdition(); } })));
-  }
-  get _element() { return index.getElement(this); }
-};
-EzTextEdit.style = ezTextEditCss;
-
-exports.ez_custom_form_input = EzCustomFormInput;
-exports.ez_text_edit = EzTextEdit;

package/dist/esm/RecordValidationProcessor-b00b8b77.js

@@ -1,99 +0,0 @@
-import { UserInterface } from '@sankhyalabs/core';
-import { A as ApplicationUtils } from './ApplicationUtils-eaf91331.js';
-
-const buildFieldMetadata = (descriptor, config) => {
-  let { name, label, group } = Object.assign({}, config);
-  let { readOnly, required } = Object.assign({}, config);
-  let props;
-  let userInterface;
-  if (descriptor) {
-    label = label || descriptor.label;
-    name = name || descriptor.name;
-    required = descriptor.required || (config === null || config === void 0 ? void 0 : config.required);
-    readOnly = descriptor.readOnly || (config === null || config === void 0 ? void 0 : config.readOnly);
-    props = descriptor.properties;
-    userInterface = descriptor.userInterface;
-  }
-  return {
-    name, label, group,
-    readOnly, required,
-    props,
-    userInterface: userInterface || UserInterface.SHORTTEXT
-  };
-};
-
-class RecordValidationProcessor {
-  constructor(dataUnit, validationSource, validator) {
-    this._dataUnit = dataUnit;
-    this._validationSource = validationSource;
-    this._validator = validator;
-  }
-  validate() {
-    return new Promise((accept, reject) => {
-      const records = this._dataUnit.getModifiedRecords();
-      for (let i = 0; i < records.length; i++) {
-        const record = records[i];
-        const invalidResults = [];
-        let validationResult = this.validateRequired(record);
-        if (validationResult && !validationResult.isValid) {
-          invalidResults.push(validationResult);
-        }
-        if (this._validator) {
-          validationResult = this._validator.validateRecord(record);
-          if (validationResult && !validationResult.isValid) {
-            invalidResults.push(validationResult);
-          }
-        }
-        if (invalidResults.length > 0) {
-          this.processValidationResult(invalidResults, record.__record__id__);
-          reject();
-          break;
-        }
-      }
-      return accept();
-    });
-  }
-  validateRequired(record) {
-    const requiredFields = this._validationSource.getRequiredFields();
-    const invalidFields = [];
-    new Set(requiredFields).forEach(field => {
-      const value = record[field];
-      if (value == undefined || value === "") {
-        const errorMessage = this._validationSource.getMessageForField(field, record.__record__id__);
-        if (errorMessage) {
-          invalidFields.push({ name: field, message: errorMessage });
-        }
-        else {
-          invalidFields.push({ name: field, message: "Essa informação é obrigatória" });
-        }
-      }
-    });
-    if (invalidFields.length > 0) {
-      return { isValid: false, invalidFields, infoMessage: "Há pelo menos um campo obrigatório não preenchido." };
-    }
-    return undefined;
-  }
-  processValidationResult(validationResult, recordId) {
-    validationResult.forEach(invalidResult => {
-      const invalidFields = invalidResult.invalidFields;
-      if (invalidFields) {
-        invalidFields.forEach(field => {
-          this.markAsInvalid(field, recordId);
-        });
-      }
-      if (invalidResult.infoMessage) {
-        ApplicationUtils.info(invalidResult.infoMessage);
-      }
-      if (invalidResult.errorMessage) {
-        const { errorTitle, errorMessage } = invalidResult;
-        ApplicationUtils.error(errorTitle, errorMessage);
-      }
-    });
-  }
-  markAsInvalid(field, recordId) {
-    this._dataUnit.setInvalidField(field.name, field.message, recordId);
-    this._validationSource.markAsInvalid(field, recordId);
-  }
-}
-
-export { RecordValidationProcessor as R, buildFieldMetadata as b };

package/dist/esm/constants-4e0d35b7.js

@@ -1,5 +0,0 @@
-const REQUIRED_INFO = " (obrigatório) *";
-const DISTINCT_FILTER_NAME_PREFIX = 'FILTRO_COLUNA_';
-const EZ_GRID_LOADING_SOURCE = "EZ_GRID_LOADING_SOURCE";
-
-export { DISTINCT_FILTER_NAME_PREFIX as D, EZ_GRID_LOADING_SOURCE as E, REQUIRED_INFO as R };

package/dist/esm/ez-card-item_3.entry.js

@@ -1,177 +0,0 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-5a720e56.js';
-import { StringUtils, ElementIDUtils } from '@sankhyalabs/core';
-import { C as CSSVarsUtils } from './CSSVarsUtils-71ce76be.js';
-
-const ezCardItemCss = ":host {\n  /*@doc Define o tamanho da fonte do componente.*/\n  --ez-card-item--font-size: var(--text--medium, 14px);\n\n  /*@doc Define a família da fonte do componente.*/\n  --ez-card-item--font-family: var(--font-pattern, Arial);\n\n  /*@doc Define o peso da fonte do componente.*/\n  --ez-card-item--font-weight: var(--text-weight--medium, 400);\n\n  /*@doc Define o peso da fonte do title do componente.*/\n  --ez-card-item--font-weight-large: var(--text-weight--large, 600);\n\n  /*@doc Define a cor da fonte do componente.*/\n  --ez-card-item--color: var(--title--primary, #2B3A54);\n\n  /*@doc Define a cor da fonte da key do componente.*/\n  --ez-card-item__key--color: var(--text--primary, #626e82);\n\n  /*@doc Define a cor da fonte do label do detalhe do componente.*/\n  --ez-card-item__detail-label--color: var(--text--secondary, #A2ABB9);\n\n  /*@doc Define o espaçamento inferior dos detalhes do componente.*/\n  --ez-card-item__detail--padding-bottom: var(--space--extra-small, 3px);\n\n  /*@doc Define o espaçamento inferior do title do componente.*/\n  --ez-card-item__title--padding-bottom: var(--space--extra-small, 3px);\n\n  /*@doc Define a cor do highlight / marcação nos textos do componente.*/\n  --ez-card-item__highlight--color: var(--color--primary-300, #E2F4EF);\n\n  width: 100%;\n  display: flex;\n  cursor: pointer;\n}\n\n.card-item {\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  cursor: pointer;\n  padding: 12px;\n  z-index: 0;\n  position: relative;\n  container-type: inline-size;\n  container-name: box;\n  white-space: pre-line;\n}\n\n.card-item:hover {\n  background: #F0F3F7;\n  border-radius: 12px;\n}\n\n.card-item__title {\n  display: flex;\n  align-items: center;\n  line-height: 18px;\n  cursor: pointer;\n\n  /*public*/\n  font-size: var(--ez-card-item--font-size);\n  font-family: var(--ez-card-item--font-family);\n  font-weight: var(--ez-card-item--font-weight-large);\n  color: var(--ez-card-item--color);\n  padding-bottom: var(--ez-card-item__title--padding-bottom);\n  gap: var(--space--small, 6px);\n}\n\n.card-item__key {\n  /*public*/\n  color: var(--ez-card-item__key--color);\n}\n\n.card-item__details {\n  display: flex;\n  flex-direction: column;\n  cursor: pointer;\n  justify-content: space-between;\n  width: 100%;\n}\n\n.card-item__details-container__left {\n  white-space: pre-line;\n  cursor: pointer;\n  width: 50%;\n}\n\n.card-item__details-container__right {\n  white-space: pre-line;\n  width: 50%;\n  cursor: pointer;\n}\n\n.card-item__detail:not(:last-child) {\n  cursor: pointer;\n  white-space: pre-line;\n\n  /*public*/\n  padding-bottom: var(--ez-card-item__detail--padding-bottom);\n}\n\n.card-item__detail-label {\n  cursor: pointer;\n\n  /*public*/\n  font-size: var(--ez-card-item--font-size);\n  font-family: var(--ez-card-item--font-family);\n  font-weight: var(--ez-card-item--font-weight);\n  color: var(--ez-card-item__detail-label--color);\n}\n\n.card-item__detail-value {\n  cursor: pointer;\n  line-break: anywhere;\n\n  /*public*/\n  font-size: var(--ez-card-item--font-size);\n  font-family: var(--ez-card-item--font-family);\n  font-weight: var(--ez-card-item--font-weight);\n  color: var(--ez-card-item--color);\n}\n\n.card-item__highlight {\n  position: relative;\n  border-radius: 8px;\n  z-index: -1;\n\n  /*public*/\n  background-color: var(--ez-card-item__highlight--color);\n  outline: 2px solid var(--ez-card-item__highlight--color);\n  box-shadow: -4px 0px 0px 0px var(--ez-card-item__highlight--color), \n               4px 0px 0px 0px var(--ez-card-item__highlight--color);\n}\n\n.card-item__content{\n  display: flex;\n  align-items: center;\n}\n\n.card-item__details-container{\n  display: flex;\n}\n\n.card-item__details-slot{\n  margin-left: auto;\n}\n\n@container box (max-width: 550px) {\n  .card-item__details {\n    flex-direction: column;\n  }\n\n  .card-item__details-container__left {\n    width: 100%;\n  }\n  \n  .card-item__details-container__right {\n    width: 100%;\n  }\n}\n\n@container box (max-width: 200px) {\n  .card-item__title {\n    font-size: 10px;\n  }\n\n  .card-item__detail-label {\n    font-size: 10px;\n  }\n\n  .card-item__detail-value {\n    font-size: 10px;\n  }\n\n}";
-
-const EzCardItem = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.ezClick = createEvent(this, "ezClick", 7);
-    this.item = undefined;
-    this.enableKey = true;
-  }
-  componentWillRender() {
-    this.createDetailList();
-  }
-  componentDidLoad() {
-    var _a, _b;
-    const dataInfo = { id: StringUtils.toCamelCase(((_a = this.item) === null || _a === void 0 ? void 0 : _a.key) || ((_b = this.item) === null || _b === void 0 ? void 0 : _b.title) || "") };
-    ElementIDUtils.addIDInfo(this._element, null, dataInfo);
-  }
-  createDetailList() {
-    var _a, _b, _c;
-    this._details = { detailsLeft: [], detailsRight: [] };
-    let cont = 0;
-    if ((_a = this.item) === null || _a === void 0 ? void 0 : _a.details) {
-      for (const attribute in this.item.details) {
-        cont < 3 ?
-          this._details.detailsLeft.push({ label: attribute, value: (_b = this.item.details[attribute]) === null || _b === void 0 ? void 0 : _b.toString() }) :
-          this._details.detailsRight.push({ label: attribute, value: (_c = this.item.details[attribute]) === null || _c === void 0 ? void 0 : _c.toString() });
-        cont++;
-      }
-    }
-  }
-  buildDetailContent(detail) {
-    return h("div", { class: "card-item__detail" }, h("label", { class: "card-item__detail-label" }, detail.label), ": ", h("label", { class: "card-item__detail-value", innerHTML: detail.value }));
-  }
-  render() {
-    return (h(Host, null, this.item &&
-      h("div", { class: "card-item", onClick: () => { this.ezClick.emit(this.item); } }, h("div", { class: "ez-row card-item__content" }, h("div", { class: "ez-col ez-col--sd-11 card-item__details" }, h("label", { class: "card-item__title" }, this.enableKey && (h("span", { class: "card-item__key", innerHTML: this.item.key })), h("span", { innerHTML: this.item.title })), h("div", { class: "card-item__details-container" }, h("div", { class: "card-item__details-container__left" }, this._details.detailsLeft.map(detail => {
-        return this.buildDetailContent(detail);
-      })), h("div", { class: "card-item__details-container__right" }, this._details.detailsRight.map(detail => {
-        return this.buildDetailContent(detail);
-      })))), h("div", { class: "ez-col ez-col--sd-1 card-item__details-slot" }, h("slot", { name: "rightSlot" }))))));
-  }
-  get _element() { return getElement(this); }
-};
-EzCardItem.style = ezCardItemCss;
-
-const ezFilterInputCss = ":host{display:block;width:100%}";
-
-const EzFilterInput = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.ezChange = createEvent(this, "ezChange", 7);
-    this.ezSearching = createEvent(this, "ezSearching", 7);
-    this.ezFocusIn = createEvent(this, "ezFocusIn", 7);
-    this._searchingText = "";
-    this.handleFocus = () => {
-      if (this._searchingText === "") {
-        this._textInput.value = "";
-      }
-      else {
-        this._textInput.value = this._searchingText;
-      }
-      this.ezFocusIn.emit();
-    };
-    this.label = undefined;
-    this.value = undefined;
-    this.enabled = true;
-    this.errorMessage = undefined;
-    this.restrict = undefined;
-    this.mode = "regular";
-    this.asyncSearch = false;
-    this.canShowError = true;
-  }
-  observeLabel() {
-    if (this._textInput) {
-      this._textInput.label = this.label;
-    }
-  }
-  observeErrorMessage() {
-    if (this._textInput) {
-      this._textInput.errorMessage = this.errorMessage;
-    }
-  }
-  observeValue(newValue, oldValue) {
-    if (this._textInput && newValue != oldValue) {
-      this._textInput.value = newValue;
-      this.ezChange.emit(newValue);
-    }
-  }
-  /**
-   * Aplica o foco no campo.
-   */
-  async setFocus() {
-    this._textInput.setFocus();
-  }
-  /**
-   * Remove o foco do campo.
-   */
-  async setBlur() {
-    this._textInput.setBlur();
-  }
-  /**
-   * Retorna se o conteúdo é inválido.
-   */
-  async isInvalid() {
-    return typeof this.errorMessage === "string" && this.errorMessage.trim() !== "";
-  }
-  /**
-   * Método responsável por setar um novo valor ao campo.
-   */
-  async setValue(newValue) {
-    if (!this.asyncSearch || this._textInput == undefined) {
-      return;
-    }
-    if (newValue !== this.value) {
-      this.value = newValue;
-      this._searchingText = "";
-    }
-    else {
-      this._textInput.value = newValue;
-    }
-  }
-  /**
-   * Método responsável por resetar o valor do campo para o ultimo valor inputado.
-   */
-  async endSearch() {
-    if (!this.asyncSearch || this._textInput == undefined) {
-      return;
-    }
-    if (this._textInput.value !== this.value) {
-      this._textInput.value = this.value;
-    }
-  }
-  handleChange(evt) {
-    const newValue = evt.detail;
-    this.errorMessage = "";
-    if (this.asyncSearch) {
-      this._searchingText = newValue;
-      this.ezSearching.emit(newValue);
-    }
-    else if (newValue !== this.value) {
-      this.value = newValue;
-    }
-  }
-  componentDidLoad() {
-    CSSVarsUtils.applyVarsTextInput(this._elem, this._textInput);
-  }
-  render() {
-    ElementIDUtils.addIDInfoIfNotExists(this._elem, 'input');
-    return (h("ez-text-input", { "data-element-id": ElementIDUtils.getInternalIDInfo("textInput"), ref: elem => this._textInput = elem, label: this.label, onEzChange: evt => this.handleChange(evt), value: this.value, enabled: this.enabled, errorMessage: this.errorMessage, restrict: this.restrict, mode: this.mode, onFocusin: this.handleFocus, canShowError: this.canShowError }, h("ez-icon", { slot: "leftIcon", iconName: "search" })));
-  }
-  get _elem() { return getElement(this); }
-  static get watchers() { return {
-    "label": ["observeLabel"],
-    "errorMessage": ["observeErrorMessage"],
-    "value": ["observeValue"]
-  }; }
-};
-EzFilterInput.style = ezFilterInputCss;
-
-const multiSelectionBoxMessageCss = ".multi-selection__message{display:flex;flex-direction:row;align-items:center;justify-content:center;width:100%;min-height:320px;text-align:center}.multi-selection__text-message{margin-top:-30px;font-family:var(--font-pattern);font-size:var(--text--meduim);padding:var(--space-xs);color:var(--text--primary)}";
-
-const MultiSelectionBoxMessage = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.message = undefined;
-  }
-  render() {
-    return (h("div", { class: "multi-selection__message" }, h("span", { class: "multi-selection__text-message" }, this.message)));
-  }
-};
-MultiSelectionBoxMessage.style = multiSelectionBoxMessageCss;
-
-export { EzCardItem as ez_card_item, EzFilterInput as ez_filter_input, MultiSelectionBoxMessage as multi_selection_box_message };