@sankhyalabs/sankhyablocks 1.4.0-beta.1 → 1.4.0-beta.11

package/dist/esm/snk-config-modal.entry.js

@@ -0,0 +1,58 @@
+import { r as registerInstance, c as createEvent, h, H as Host } from './index-e4121713.js';
+import { ApplicationContext } from '@sankhyalabs/core';
+import { c as VIEW_MODE } from './constants-c6039d3d.js';
+import { C as ConfigurableElementsStorage } from './configurableElementsStorage-cdc144b5.js';
+
+const snkConfigModalCss = ".sc-snk-config-modal-h{--snk-config-modal__button-close--padding-left:var(--space--medium, 12px);--snk-config-modal__title--color:var(--title--primary, #2B3A54);--snk-config-modal__title--font-family:var(--font-pattern, \"Roboto\");--snk-config-modal__title--font-size:var(--title--large, 20px);--snk-config-modal__title--font-weight:var(--text-weight--extra-large, 700);--snk-config-modal__subtitle--color:var(--title--primary, #2B3A54);--snk-config-modal__subtitle--font-family:var(--font-pattern, \"Roboto\");--snk-config-modal__subtitle--font-size:var(--text--medium, 14px);--snk-config-modal__subtitle--font-weight:var(--text-weight--large, 600);--snk-config-modal__scrollbar--border-radius:var(--border--radius-small, 6px);--snk-config-modal__scrollbar--width:var(--space--medium, 12px);--snk-config-modal__scrollbar--background-color-primary:var(--scrollbar--primary, #2B3A54);--snk-config-modal__scrollbar--background-color-secondary:var(--scrollbar--secondary, #E5EAF0);display:grid;grid-template-rows:auto 1fr auto;max-height:100%;width:100%}@media screen and (min-width: 480px){.sc-snk-config-modal-h{width:359px;max-width:359px}}.snk-config-modal__button-config.sc-snk-config-modal{--ez-button--min-width:100%}.snk-config-modal__header.sc-snk-config-modal{display:flex;justify-content:space-between;align-items:center;width:100%}.snk-config-modal__title.sc-snk-config-modal{display:flex;margin:0;line-height:normal;letter-spacing:0em;text-align:left;color:var(--snk-config-modal__title--color);font-size:var(--snk-config-modal__title--font-size);font-family:var(--snk-config-modal__title--font-family);font-weight:var(--snk-config-modal__title--font-weight)}.snk-config-modal__subtitle.sc-snk-config-modal{display:flex;margin:0;padding-top:var(--space--medium);padding-bottom:var(--space--small);color:var(--snk-config-modal__subtitle--color);font-size:var(--snk-config-modal__subtitle--font-size);font-family:var(--snk-config-modal__subtitle--font-family);font-weight:var(--snk-config-modal__subtitle--font-weight)}.snk-config-modal__button-close.sc-snk-config-modal{padding-left:var(--snk-config-modal__button-close--padding-left)}.snk-config-modal__main.sc-snk-config-modal{overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--snk-config-modal__scrollbar--background-color-primary) var(--snk-config-modal__scrollbar--background-color-secondary)}.snk-config-modal__main.sc-snk-config-modal::-webkit-scrollbar-track{background-color:var(--snk-config-modal__scrollbar--background-color-secondary)}.snk-config-modal__main.sc-snk-config-modal::-webkit-scrollbar-thumb{background-color:var(--snk-config-modal__scrollbar--background-color-primary);border-radius:var(--snk-config-modal__scrollbar--border-radius)}.snk-config-modal__main.sc-snk-config-modal::-webkit-scrollbar{background-color:var(--snk-config-modal__scrollbar--background-color-secondary);width:var(--snk-config-modal__scrollbar--width);max-width:var(--snk-config-modal__scrollbar--width);min-width:var(--snk-config-modal__scrollbar--width)}";
+
+const GRID_MODE = VIEW_MODE.grid;
+const FORM_MODE = VIEW_MODE.form;
+const SnkConfigModal = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.cancelConfig = createEvent(this, "cancelConfig", 7);
+    this.changeConfig = createEvent(this, "changeConfig", 7);
+    /**
+     * Define se o modo grid está ativo.
+     */
+    this.gridMode = true;
+  }
+  dispatchChange(openConfig = false) {
+    const data = {
+      viewMode: this.gridMode ? GRID_MODE.index : FORM_MODE.index,
+      openConfig
+    };
+    this.changeConfig.emit(data);
+  }
+  closeConfig() {
+    this.cancelConfig.emit();
+  }
+  onChecked(evt) {
+    const value = evt === null || evt === void 0 ? void 0 : evt.detail;
+    this.gridMode = value === "G" ? true : false;
+    this.dispatchChange();
+  }
+  onClicked() {
+    this.dispatchChange(true);
+  }
+  /**
+   * Conforme mecanismo de mensagens, é possível customizar as mensagens dos blocos de construção
+   * através de um pequeno modulo na estrutura da aplicação:
+   * - Criar um arquivo no seguinte caminho: /messages/appmessages.msg.js.
+   * Para conhecer os detalhes do módulo, vide o arquivo neste projeto "/src/lib/message/resources/snk-configurator.msg.ts"
+   */
+  getMessage(key) {
+    return this._application.messagesBuilder.getMessage(key, {});
+  }
+  componentWillLoad() {
+    this._application = ApplicationContext.getContextValue("__SNK__APPLICATION__");
+  }
+  render() {
+    return (h(Host, null, h("div", { class: "snk-config-modal__header" }, h("label", { class: "snk-config-modal__title" }, this.getMessage("snkConfigModal.titleConfigurations")), h("div", { class: "snk-config-modal__button-close" }, h("ez-button", { mode: 'icon', iconName: "close", size: 'medium', onClick: () => this.closeConfig() }))), h("div", { class: "snk-config-modal__main" }, h("ez-radio-button", { class: "ez-margin-top--medium", label: this.getMessage("snkConfigModal.subTitleModeConfig"), value: this.gridMode ? "G" : "F", onEzChange: (evt) => this.onChecked(evt) }, ConfigurableElementsStorage.getForm(this.configName) && h("ez-radio-button-option", { label: this.getMessage("snkConfigModal.labelGrid"), value: "G" }), ConfigurableElementsStorage.getGrid(this.configName) && h("ez-radio-button-option", { label: this.getMessage("snkConfigModal.labelForm"), value: "F" })), h("ez-button", { mode: "slim", label: this.gridMode
+        ? this.getMessage("snkConfigModal.labelConfigGrid")
+        : this.getMessage("snkConfigModal.labelConfigForm"), class: "snk-config-modal__button-config ez-button--primary", onClick: () => this.onClicked() }), h("hr", { class: "ez-divider-horizontal ez-margin-vertical--medium" }))));
+  }
+};
+SnkConfigModal.style = snkConfigModalCss;
+
+export { SnkConfigModal as snk_config_modal };

package/dist/esm/snk-config-options.entry.js

@@ -0,0 +1,226 @@
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-e4121713.js';
+import { UserInterface, ObjectUtils, ApplicationContext } from '@sankhyalabs/core';
+import { DataType, getConvertedValue } from '@sankhyalabs/core/dist/dataunit/metadata/DataType';
+import { CheckMode } from '@sankhyalabs/ezui/dist/collection/utils';
+import { V as VARS_BY_TYPE, D as DEFAULT_TYPE, a as TAGS_BY_TYPE } from './constants-c6039d3d.js';
+
+const snkConfigOptionsCss = ".sc-snk-config-options-h{width:100%;border:2px solid var(--color--secondary-200);border-radius:15px}.config-options__switch-row.sc-snk-config-options{margin-top:-30px}";
+
+const SnkConfigOptions = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.configOptionsChanged = createEvent(this, "configOptionsChanged", 7);
+    /**
+     * Armazena as propriedades do campo
+     */
+    this.fieldConfig = {};
+  }
+  onConfigDefault(optionSelected) {
+    if (optionSelected != undefined) {
+      this._defaultType = optionSelected;
+      this.fieldConfig.defaultValue = {
+        type: this._defaultType
+      };
+      this.configOptionsChanged.emit(this.fieldConfig);
+    }
+  }
+  buildOptions() {
+    var _a, _b, _c;
+    const interfaceField = (_c = (_a = this.dataUnit) === null || _a === void 0 ? void 0 : _a.getField((_b = this.fieldConfig) === null || _b === void 0 ? void 0 : _b.name)) === null || _c === void 0 ? void 0 : _c.userInterface;
+    return VARS_BY_TYPE.UserInterface[interfaceField];
+  }
+  enabledValueDefault() {
+    var _a, _b, _c;
+    const field = (_a = this.dataUnit) === null || _a === void 0 ? void 0 : _a.getField((_b = this.fieldConfig) === null || _b === void 0 ? void 0 : _b.name);
+    const allowDefault = (_c = field === null || field === void 0 ? void 0 : field.properties) === null || _c === void 0 ? void 0 : _c.allowDefault;
+    const hasVariableVar = VARS_BY_TYPE.UserInterface.hasOwnProperty(field === null || field === void 0 ? void 0 : field.userInterface);
+    if ((allowDefault == undefined || allowDefault === "true") && hasVariableVar) {
+      return true;
+    }
+    return false;
+  }
+  isAllowDefault() {
+    var _a, _b;
+    const allowDefault = (_b = (_a = this._fieldProperties) === null || _a === void 0 ? void 0 : _a.properties) === null || _b === void 0 ? void 0 : _b.allowDefault;
+    if (allowDefault == undefined) {
+      return true;
+    }
+    return allowDefault === "true";
+  }
+  loadDefaultValue() {
+    var _a;
+    if (this.fieldConfig == undefined) {
+      this._defaultType = DEFAULT_TYPE.fixed;
+      this.fieldConfig = {
+        defaultValue: {
+          type: this._defaultType
+        }
+      };
+    }
+    else if (((_a = this.fieldConfig.defaultValue) === null || _a === void 0 ? void 0 : _a.type) == undefined) {
+      this._defaultType = DEFAULT_TYPE.fixed;
+      this.fieldConfig.defaultValue = {
+        type: this._defaultType
+      };
+    }
+    else {
+      this._defaultType = this.fieldConfig.defaultValue.type;
+    }
+  }
+  getFieldProperties(field) {
+    var _a;
+    if (field != undefined) {
+      return (_a = this.dataUnit) === null || _a === void 0 ? void 0 : _a.getField(field);
+    }
+  }
+  getMessage(key, params) {
+    return this._application.messagesBuilder.getMessage(key, params);
+  }
+  getDefaultType() {
+    var _a;
+    return (_a = this.fieldConfig.defaultValue.type) !== null && _a !== void 0 ? _a : DEFAULT_TYPE.fixed;
+  }
+  getEnabledByProperty(property) {
+    const properties = this._fieldProperties;
+    if (properties != undefined && properties[property] === true) {
+      return false;
+    }
+    return true;
+  }
+  getValueByProperty(property) {
+    const properties = this._fieldProperties;
+    if (properties != undefined && properties[property] === true) {
+      return true;
+    }
+    return this.fieldConfig[property];
+  }
+  getValidatedValue(fieldValue) {
+    var _a, _b;
+    if (fieldValue == undefined) {
+      return;
+    }
+    const field = (_a = this.dataUnit) === null || _a === void 0 ? void 0 : _a.getField((_b = this.fieldConfig) === null || _b === void 0 ? void 0 : _b.name);
+    const dataType = field === null || field === void 0 ? void 0 : field.dataType;
+    if (dataType == undefined) {
+      return;
+    }
+    const value = (fieldValue === null || fieldValue === void 0 ? void 0 : fieldValue.waitmessage) != undefined ? undefined :
+      dataType !== DataType.OBJECT && dataType !== DataType.DATE
+        && typeof fieldValue === "object"
+        ? fieldValue.value
+        : fieldValue;
+    return dataType === DataType.OBJECT ? JSON.stringify(value) : value;
+  }
+  buildInputDefault({ value, enabled, label, name, required, userInterface }, properties = undefined, mode = undefined) {
+    let options;
+    let precision = 0;
+    let prettyPrecision = 0;
+    const TagName = userInterface == undefined || TAGS_BY_TYPE[userInterface] == undefined
+      ? TAGS_BY_TYPE.DEFAULT
+      : TAGS_BY_TYPE[userInterface];
+    if (userInterface === UserInterface.OPTIONSELECTOR) {
+      const prop = properties === null || properties === void 0 ? void 0 : properties.options;
+      if (typeof prop === "string") {
+        const parsed = ObjectUtils.stringToObject(prop);
+        options = Object.keys(parsed).map(key => { return { value: key, label: parsed[key] }; });
+      }
+      else {
+        options = prop;
+      }
+    }
+    else if (userInterface === UserInterface.DECIMALNUMBER) {
+      precision = Number((properties === null || properties === void 0 ? void 0 : properties.precision) || 2);
+      prettyPrecision = Number((properties === null || properties === void 0 ? void 0 : properties.prettyPrecision) || precision);
+    }
+    return h(TagName, Object.assign({ value: value, enabled: enabled, label: label, "data-field-name": name, key: name, onEzChange: (evt) => this.onChange(evt === null || evt === void 0 ? void 0 : evt.detail) }, (this.getConditionalAttributes(userInterface, required, options, precision, prettyPrecision, mode))));
+  }
+  getConditionalAttributes(userInterface, required, options, precision, prettyPrecision, mode) {
+    switch (userInterface) {
+      case UserInterface.SEARCH:
+        return {
+          suppressEmptyOption: required,
+          optionLoader: (searchArgument) => this.onSearch(searchArgument)
+        };
+      case UserInterface.OPTIONSELECTOR:
+        return {
+          suppressEmptyOption: required,
+          options
+        };
+      case UserInterface.CHECKBOX:
+      case UserInterface.SWITCH:
+        return {
+          mode
+        };
+      case UserInterface.INTEGERNUMBER:
+      case UserInterface.DECIMALNUMBER:
+        return {
+          precision,
+          prettyPrecision,
+          onEzStartChange: (evt) => this.onChange(evt === null || evt === void 0 ? void 0 : evt.detail)
+        };
+      case UserInterface.DATE:
+      case UserInterface.DATETIME:
+      case UserInterface.TIME:
+        return {
+          onEzStartChange: (evt) => this.onChange(evt === null || evt === void 0 ? void 0 : evt.detail)
+        };
+      default:
+        return {};
+    }
+  }
+  onChange(fieldValue) {
+    this.fieldConfig.defaultValue.value = this.getValidatedValue(fieldValue);
+    this.configOptionsChanged.emit(this.fieldConfig);
+  }
+  onSearch(searchArgument) {
+    if (this._application != undefined && this.fieldConfig != undefined) {
+      return this._application.executeSearch(searchArgument, this.fieldConfig.name, this.dataUnit);
+    }
+  }
+  buildField(field) {
+    const { config, descriptor } = field;
+    const { name, label, readOnly, required, defaultValue } = config;
+    const { userInterface, properties } = descriptor;
+    const enabled = (properties === null || properties === void 0 ? void 0 : properties.allowDefault) != undefined ? properties.allowDefault === "true" : !readOnly;
+    let value;
+    if (enabled) {
+      value = defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.value;
+      if (value != undefined) {
+        value = getConvertedValue(descriptor === null || descriptor === void 0 ? void 0 : descriptor.dataType, value);
+      }
+    }
+    const configField = { value, enabled, label, name, required, userInterface };
+    switch (userInterface) {
+      case UserInterface.SWITCH:
+        return this.buildInputDefault(configField, undefined, CheckMode.SWITCH);
+      case UserInterface.CHECKBOX:
+        return this.buildInputDefault(configField, undefined, CheckMode.REGULAR);
+      case UserInterface.OPTIONSELECTOR:
+      case UserInterface.DECIMALNUMBER:
+        return this.buildInputDefault(configField, properties);
+      default:
+        return this.buildInputDefault(configField);
+    }
+  }
+  componentWillLoad() {
+    var _a;
+    this.loadDefaultValue();
+    this._application = ApplicationContext.getContextValue("__SNK__APPLICATION__");
+    this._fieldProperties = this.getFieldProperties((_a = this.fieldConfig) === null || _a === void 0 ? void 0 : _a.name);
+  }
+  render() {
+    var _a, _b;
+    return (h(Host, null, h("div", { id: this.idConfig }, h("div", { class: "ez-row ez-padding--medium" }, h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-4 ez-padding--small" }, h("ez-text-input", { label: this.getMessage("snkConfigOptions.label.nameField"), value: (_a = this.fieldConfig) === null || _a === void 0 ? void 0 : _a.label, onEzChange: (evt) => { this.fieldConfig.label = evt.detail; this.configOptionsChanged.emit(this.fieldConfig); } })), h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-4 ez-padding--small" }, h("ez-combo-box", { label: this.getMessage("snkConfigOptions.label.typeValueDefault"), suppressEmptyOption: true, enabled: this.enabledValueDefault(), onEzChange: (evt) => { var _a; return this.onConfigDefault((_a = evt.detail) === null || _a === void 0 ? void 0 : _a.value); }, value: this.getDefaultType() }, h("option", { value: DEFAULT_TYPE.fixed }, this.getMessage("snkConfigOptions.options.valueFixed")), h("option", { value: DEFAULT_TYPE.variable }, this.getMessage("snkConfigOptions.options.variable")))), h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-4 ez-padding--small" }, this._defaultType === DEFAULT_TYPE.variable ?
+      h("ez-combo-box", { label: this.getMessage("snkConfigOptions.label.valueDefault"), enabled: this.isAllowDefault(), onEzChange: (evt) => { var _a; this.fieldConfig.defaultValue.value = (_a = evt.detail) === null || _a === void 0 ? void 0 : _a.value; this.configOptionsChanged.emit(this.fieldConfig); }, value: this.fieldConfig.defaultValue.value, options: this.buildOptions() })
+      :
+        ((_b = this._fieldProperties) === null || _b === void 0 ? void 0 : _b.userInterface) &&
+          this.buildField({
+            descriptor: this._fieldProperties,
+            config: this.fieldConfig
+          }))), h("div", { class: "ez-row ez-padding--medium config-options__switch-row" }, h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-4 ez-padding--small" }, h("ez-check", { mode: CheckMode.SWITCH, label: this.getMessage("snkConfigOptions.label.clearDuplicate"), value: this.fieldConfig.cleanOnCopy, onEzChange: (evt) => { this.fieldConfig.cleanOnCopy = evt.detail; this.configOptionsChanged.emit(this.fieldConfig); } })), h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-4 ez-padding--small" }, h("ez-check", { mode: CheckMode.SWITCH, label: this.getMessage("snkConfigOptions.label.requiredField"), enabled: this.getEnabledByProperty("required"), value: this.getValueByProperty("required"), onEzChange: (evt) => { this.fieldConfig.required = evt.detail; this.configOptionsChanged.emit(this.fieldConfig); } })), h("div", { class: "ez-col ez-col--sd-12 ez-col--tb-4 ez-padding--small" }, h("ez-check", { mode: CheckMode.SWITCH, label: this.getMessage("snkConfigOptions.label.protectedField"), enabled: this.getEnabledByProperty("readOnly"), value: this.getValueByProperty("readOnly"), onEzChange: (evt) => { this.fieldConfig.readOnly = evt.detail; this.configOptionsChanged.emit(this.fieldConfig); } }))))));
+  }
+  get _element() { return getElement(this); }
+};
+SnkConfigOptions.style = snkConfigOptionsCss;
+
+export { SnkConfigOptions as snk_config_options };