npm - @sankhyalabs/ezui - Versions diffs - 7.3.1-rc.3 → 7.3.2 - Mend

@sankhyalabs/ezui 7.3.1-rc.3 → 7.3.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1245) hide show

package/dist/cjs/ez-dropdown.cjs.entry.js CHANGED Viewed

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-a7b0c73d.js');
+const index = require('./index-9e5554cb.js');
 const core = require('@sankhyalabs/core');
 const DropdownItem = ({ item, hasIcon, hasChildren, isLockedLevels, onSubActionClick }) => {
@@ -279,7 +279,7 @@ class SubmenuControl {
   }
 }
-const ezDropdownCss = ":host{--ez-dropdown--z-index:var(--more-visible, 2);--ez-dropdown--padding:var(--space--16, 16px);--ez-dropdown--box-shadow:var(--shadow--medium, 0px 8px 24px rgba(0, 38, 111, 0.1));--ez-dropdown--border-radius:var(--border--radius-medium, 12px);--ez-dropdown--background-color:var(--background--xlight, #fff);--ez-dropdown--font-family:var(--font-pattern, 'Roboto');--ez-dropdown--max-height:415px;--ez-dropdown__item--padding:var(--space--small, 6px);--ez-dropdown__item--gap:var(--space--small, 6px);--ez-dropdown__item--border-radius:var(--border--radius-small, 6px);--ez-dropdown__item--color:var(--title--primary, #2b3a54);--ez-dropdown__item--font-weight:var(--text-weight--medium, 400);--ez-dropdown__item--font-size:var(--text--medium, 14px);--ez-dropdown__item--line-height:calc(var(--ez-dropdown__item--font-size) + 4px);--ez-dropdown__item--background-color:var(--background--medium, #f0f3f7);--ez-dropdown__item--transition:var(--transition, .2s linear);--ez-dropdown__item-label--margin-right:var(--space--medium, 12px);--ez-dropdown__icon--size:var(--icon--medium, 18px);--ez-dropdown__divider--background-color:var(--color--disable-secondary, #f2f5f8);--ez-dropdown__divider--margin:var(--space--extra-small, 3px) 0;--ez-dropdown__group-label--color:var(--text--secondary, #A2ABB9);--ez-dropdown__group-label--font-weight:var(--text-weight--large, 600);--ez-dropdown__group-label--font-size:var(--text--small, 12px);--ez-dropdown__group-label--line-height:var(--text--medium, 14px);--ez-dropdown__group-label--padding:var(--space--small, 6px);--ez-dropdown__submenu--z-index:var(--most-visible, 3);--ez-dropdown__link--font-weight:var(--text-weight--large, 600);--ez-dropdown__link--primary--color:var(--color--primary, #008561);--ez-dropdown__link--critical--color:var(--color-alert--error-800, #BD0025);--ez-dropdown__scrollbar--color-default:var(--scrollbar--default, #626e82);--ez-dropdown__scrollbar--color-background:var(--scrollbar--background, #E5EAF0);--ez-dropdown__scrollbar--color-hover:var(--scrollbar--hover, #2B3A54);--ez-dropdown__scrollbar--color-clicked:var(--scrollbar--clicked, #a2abb9);--ez-dropdown__scrollbar--border-radius:var(--border--radius-small, 6px);--ez-dropdown__scrollbar--width:var(--space--small, 6px);--ez-dropdown__scrollbar--padding-right:var(--space--extra-small, 3px);display:flex;flex-direction:column;height:fit-content;user-select:none;box-sizing:border-box;position:fixed;z-index:var(--ez-dropdown--z-index)}:host *{box-sizing:border-box}.ez-dropdown{display:flex;padding:var(--ez-dropdown--padding);box-shadow:var(--ez-dropdown--box-shadow);border-radius:var(--ez-dropdown--border-radius);background-color:var(--ez-dropdown--background-color);max-width:var(--ez-dropdown--max-width)}.ez-dropdown__max-height{max-height:var(--ez-dropdown--max-height)}.ez-dropdown *{font-family:var(--ez-dropdown--font-family)}.ez-dropdown__container{display:flex;flex-direction:column;overflow-y:auto;scrollbar-width:thin;flex:auto;scrollbar-color:var(--ez-dropdown__scrollbar--color-clicked) var(--ez-dropdown__scrollbar--color-background)}.ez-dropdown__container::-webkit-scrollbar{background-color:var(--ez-dropdown__scrollbar--color-background);width:var(--ez-dropdown__scrollbar--width);max-width:var(--ez-dropdown__scrollbar--width);min-width:var(--ez-dropdown__scrollbar--width)}.ez-dropdown__container::-webkit-scrollbar-track{background-color:var(--ez-dropdown__scrollbar--color-background);border-radius:var(--ez-dropdown__scrollbar--border-radius)}.ez-dropdown__container::-webkit-scrollbar-thumb{background-color:var(--ez-dropdown__scrollbar--color-default);border-radius:var(--ez-dropdown__scrollbar--border-radius)}.ez-dropdown__container::-webkit-scrollbar-thumb:vertical:hover,.ez-dropdown__container::-webkit-scrollbar-thumb:horizontal:hover{background-color:var(--ez-dropdown__scrollbar--color-hover)}.ez-dropdown__container::-webkit-scrollbar-thumb:vertical:active,.ez-dropdown__container::-webkit-scrollbar-thumb:horizontal:active{background-color:var(--ez-dropdown__scrollbar--color-clicked)}.ez-dropdown__container--spacer{padding-right:var(--ez-dropdown__scrollbar--padding-right)}.ez-dropdown__item{display:flex;align-items:center;background-color:transparent;border-radius:var(--ez-dropdown__item--border-radius);transition:var(--ez-dropdown__item--transition)}.ez-dropdown__item:not(:has(.ez-dropdown__item-builder)):hover{background-color:var(--ez-dropdown__item--background-color)}.ez-dropdown__item-wrapper{display:flex;align-items:center;position:relative;cursor:pointer;width:100%;margin:0;white-space:nowrap;gap:var(--ez-dropdown__item--gap);color:var(--ez-dropdown__item--color);font-weight:var(--ez-dropdown__item--font-weight);font-size:var(--ez-dropdown__item--font-size);line-height:var(--ez-dropdown__item--line-height);padding:var(--ez-dropdown__item--padding)}.ez-dropdown__item-wrapper ez-icon{display:flex;justify-content:center;align-items:center;width:var(--ez-dropdown__icon--size);height:var(--ez-dropdown__icon--size);min-width:var(--ez-dropdown__icon--size);min-height:var(--ez-dropdown__icon--size)}.ez-dropdown__item-content{display:flex;align-items:center;flex:auto;overflow:hidden;gap:var(--ez-dropdown__item--gap)}.ez-dropdown__item-label{text-align:left;text-overflow:ellipsis;overflow:hidden;flex:auto}.ez-dropdown__item-label:not(:last-child){margin-right:var(--ez-dropdown__item-label--margin-right)}.ez-dropdown__item-content+.ez-dropdown__link{margin-left:var(--ez-dropdown__item-label--margin-right);margin-right:var(--ez-dropdown__item--padding)}.ez-dropdown__item-builder{flex:auto}.ez-dropdown__divider{width:100%;height:2px;border-radius:1px;border:none;display:block;background-color:var(--ez-dropdown__divider--background-color);margin:var(--ez-dropdown__divider--margin)}.ez-dropdown__hidden{visibility:hidden}.ez-dropdown__group{display:flex;flex-direction:column}.ez-dropdown__group-label{display:block;width:100%;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ez-dropdown__group-label--color);font-weight:var(--ez-dropdown__group-label--font-weight);font-size:var(--ez-dropdown__group-label--font-size);line-height:var(--ez-dropdown__group-label--line-height);padding:var(--ez-dropdown__group-label--padding)}.ez-dropdown__icon-right{margin-left:auto}.ez-dropdown__submenu{position:fixed;z-index:var(--ez-dropdown__submenu--z-index);margin-top:calc(var(--ez-dropdown__item--padding) * -1)}.ez-dropdown__submenu--hide{display:none}.ez-dropdown__link{display:block;margin-left:auto;cursor:pointer;text-overflow:ellipsis;overflow:hidden;font-weight:var(--ez-dropdown__link--font-weight);max-width:calc(var(--ez-dropdown--max-width) * 0.43)}.ez-dropdown__link--primary{color:var(--ez-dropdown__link--primary--color)}.ez-dropdown__link--critical{color:var(--ez-dropdown__link--critical--color)}.ez-dropdown__link:hover{text-decoration:underline}";
+const ezDropdownCss = ":host{--ez-dropdown--z-index:var(--more-visible, 2);--ez-dropdown--padding:var(--space--small, 6px);--ez-dropdown--box-shadow:var(--shadow--medium, 0px 8px 24px rgba(0, 38, 111, 0.1));--ez-dropdown--border-radius:var(--border--radius-medium, 12px);--ez-dropdown--background-color:var(--background--xlight, #fff);--ez-dropdown--font-family:var(--font-pattern, 'Roboto');--ez-dropdown--max-height:415px;--ez-dropdown__item--padding:var(--space--small, 6px);--ez-dropdown__item--gap:var(--space--small, 6px);--ez-dropdown__item--border-radius:var(--border--radius-small, 6px);--ez-dropdown__item--color:var(--title--primary, #2b3a54);--ez-dropdown__item--font-weight:var(--text-weight--medium, 400);--ez-dropdown__item--font-size:var(--text--medium, 14px);--ez-dropdown__item--line-height:calc(var(--ez-dropdown__item--font-size) + 4px);--ez-dropdown__item--background-color:var(--background--medium, #f0f3f7);--ez-dropdown__item--transition:var(--transition, .2s linear);--ez-dropdown__item-label--margin-right:var(--space--medium, 12px);--ez-dropdown__icon--size:var(--icon--medium, 18px);--ez-dropdown__divider--background-color:var(--color--disable-secondary, #f2f5f8);--ez-dropdown__divider--margin:var(--space--extra-small, 3px) 0;--ez-dropdown__group-label--color:var(--text--secondary, #A2ABB9);--ez-dropdown__group-label--font-weight:var(--text-weight--large, 600);--ez-dropdown__group-label--font-size:var(--text--small, 12px);--ez-dropdown__group-label--line-height:var(--text--medium, 14px);--ez-dropdown__group-label--padding:var(--space--small, 6px);--ez-dropdown__submenu--z-index:var(--most-visible, 3);--ez-dropdown__link--font-weight:var(--text-weight--large, 600);--ez-dropdown__link--primary--color:var(--color--primary, #008561);--ez-dropdown__link--critical--color:var(--color-alert--error-800, #BD0025);--ez-dropdown__scrollbar--color-default:var(--scrollbar--default, #626e82);--ez-dropdown__scrollbar--color-background:var(--scrollbar--background, #E5EAF0);--ez-dropdown__scrollbar--color-hover:var(--scrollbar--hover, #2B3A54);--ez-dropdown__scrollbar--color-clicked:var(--scrollbar--clicked, #a2abb9);--ez-dropdown__scrollbar--border-radius:var(--border--radius-small, 6px);--ez-dropdown__scrollbar--width:var(--space--small, 6px);--ez-dropdown__scrollbar--padding-right:var(--space--extra-small, 3px);display:flex;flex-direction:column;height:fit-content;user-select:none;box-sizing:border-box;position:fixed;z-index:var(--ez-dropdown--z-index)}:host *{box-sizing:border-box}.ez-dropdown{display:flex;padding:var(--ez-dropdown--padding);box-shadow:var(--ez-dropdown--box-shadow);border-radius:var(--ez-dropdown--border-radius);background-color:var(--ez-dropdown--background-color);max-width:var(--ez-dropdown--max-width)}.ez-dropdown__max-height{max-height:var(--ez-dropdown--max-height)}.ez-dropdown *{font-family:var(--ez-dropdown--font-family)}.ez-dropdown__container{display:flex;flex-direction:column;overflow-y:auto;scrollbar-width:thin;flex:auto;scrollbar-color:var(--ez-dropdown__scrollbar--color-clicked) var(--ez-dropdown__scrollbar--color-background)}.ez-dropdown__container::-webkit-scrollbar{background-color:var(--ez-dropdown__scrollbar--color-background);width:var(--ez-dropdown__scrollbar--width);max-width:var(--ez-dropdown__scrollbar--width);min-width:var(--ez-dropdown__scrollbar--width)}.ez-dropdown__container::-webkit-scrollbar-track{background-color:var(--ez-dropdown__scrollbar--color-background);border-radius:var(--ez-dropdown__scrollbar--border-radius)}.ez-dropdown__container::-webkit-scrollbar-thumb{background-color:var(--ez-dropdown__scrollbar--color-default);border-radius:var(--ez-dropdown__scrollbar--border-radius)}.ez-dropdown__container::-webkit-scrollbar-thumb:vertical:hover,.ez-dropdown__container::-webkit-scrollbar-thumb:horizontal:hover{background-color:var(--ez-dropdown__scrollbar--color-hover)}.ez-dropdown__container::-webkit-scrollbar-thumb:vertical:active,.ez-dropdown__container::-webkit-scrollbar-thumb:horizontal:active{background-color:var(--ez-dropdown__scrollbar--color-clicked)}.ez-dropdown__container--spacer{padding-right:var(--ez-dropdown__scrollbar--padding-right)}.ez-dropdown__item{display:flex;align-items:center;background-color:transparent;border-radius:var(--ez-dropdown__item--border-radius);transition:var(--ez-dropdown__item--transition)}.ez-dropdown__item:hover{background-color:var(--ez-dropdown__item--background-color)}.ez-dropdown__item-wrapper{display:flex;align-items:center;position:relative;cursor:pointer;width:100%;margin:0;white-space:nowrap;gap:var(--ez-dropdown__item--gap);color:var(--ez-dropdown__item--color);font-weight:var(--ez-dropdown__item--font-weight);font-size:var(--ez-dropdown__item--font-size);line-height:var(--ez-dropdown__item--line-height);padding:var(--ez-dropdown__item--padding)}.ez-dropdown__item-wrapper ez-icon{display:flex;justify-content:center;align-items:center;width:var(--ez-dropdown__icon--size);height:var(--ez-dropdown__icon--size);min-width:var(--ez-dropdown__icon--size);min-height:var(--ez-dropdown__icon--size)}.ez-dropdown__item-content{display:flex;align-items:center;flex:auto;overflow:hidden;gap:var(--ez-dropdown__item--gap)}.ez-dropdown__item-label{text-align:left;text-overflow:ellipsis;overflow:hidden;flex:auto}.ez-dropdown__item-label:not(:last-child){margin-right:var(--ez-dropdown__item-label--margin-right)}.ez-dropdown__item-content+.ez-dropdown__link{margin-left:var(--ez-dropdown__item-label--margin-right);margin-right:var(--ez-dropdown__item--padding)}.ez-dropdown__item-builder{flex:auto}.ez-dropdown__divider{width:100%;height:2px;border-radius:1px;border:none;display:block;background-color:var(--ez-dropdown__divider--background-color);margin:var(--ez-dropdown__divider--margin)}.ez-dropdown__hidden{visibility:hidden}.ez-dropdown__group{display:flex;flex-direction:column}.ez-dropdown__group-label{display:block;width:100%;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ez-dropdown__group-label--color);font-weight:var(--ez-dropdown__group-label--font-weight);font-size:var(--ez-dropdown__group-label--font-size);line-height:var(--ez-dropdown__group-label--line-height);padding:var(--ez-dropdown__group-label--padding)}.ez-dropdown__icon-right{margin-left:auto}.ez-dropdown__submenu{position:fixed;z-index:var(--ez-dropdown__submenu--z-index);margin-top:calc(var(--ez-dropdown__item--padding) * -1)}.ez-dropdown__submenu--hide{display:none}.ez-dropdown__link{display:block;margin-left:auto;cursor:pointer;text-overflow:ellipsis;overflow:hidden;font-weight:var(--ez-dropdown__link--font-weight);max-width:calc(var(--ez-dropdown--max-width) * 0.43)}.ez-dropdown__link--primary{color:var(--ez-dropdown__link--primary--color)}.ez-dropdown__link--critical{color:var(--ez-dropdown__link--critical--color)}.ez-dropdown__link:hover{text-decoration:underline}";
 const EzDropdown = class {
   constructor(hostRef) {

package/dist/cjs/ez-dropdown.cjs.entry.js.gz CHANGED Viewed

Binary file

package/dist/cjs/ez-empty-card.cjs.entry.js CHANGED Viewed

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-a7b0c73d.js');
+const index = require('./index-9e5554cb.js');
 const core = require('@sankhyalabs/core');
 const ezEmptyCardCss = ":host{--ez-empty-card--width:335px;--ez-empty-card--height:155px;--ez-empty-card--padding:var(--space--24, 24px);--ez-empty-card--border-radius:var(--border--radius-24, 24px);--ez-empty-card--background-color:var(--color--gray-70, #ffffff)}div{width:var(--ez-empty-card--custom-width, var(--ez-empty-card--width));height:var(--ez-empty-card--custom-height, var(--ez-empty-card--height));border-radius:var(--ez-empty-card--border-radius);background-color:var(--ez-empty-card--background-color);padding:var(--ez-empty-card--padding);display:block;overflow:hidden;outline:none;box-shadow:none;border:none;box-sizing:border-box}.gray{--ez-empty-card--background-color:var(--color--gray-80)}.green{--ez-empty-card--background-color:var(--color--ocean-green-90)}.yellow{--ez-empty-card--background-color:var(--color--yellow-100)}.red{--ez-empty-card--background-color:var(--color--red-100)}.petroleum{--ez-empty-card--background-color:var(--color--petroleum-90)}";
@@ -24,7 +24,7 @@ const EzEmptyCard = class {
     }
   }
   render() {
-    const customStyleVars = Object.assign(Object.assign({}, (this.height ? { '--ez-empty-card--custom-height': `${this.height}${typeof this.height == "number" ? 'px' : ''}` } : {})), (this.width ? { '--ez-empty-card--custom-width': `${this.width}${typeof this.width == "number" ? 'px' : ''}` } : {}));
+    const customStyleVars = Object.assign(Object.assign({}, (this.height ? { '--ez-empty-card--custom-height': `${this.height}px` } : {})), (this.width ? { '--ez-empty-card--custom-width': `${this.width}px` } : {}));
     return (index.h(index.Host, { style: customStyleVars }, index.h("div", { ref: element => this._container = element, class: `card_container ${this.color}` }, index.h("slot", null))));
   }
   get _element() { return index.getElement(this); }

package/dist/cjs/ez-empty-card.cjs.entry.js.gz CHANGED Viewed

Binary file

package/dist/cjs/ez-file-item.cjs.entry.js CHANGED Viewed

@@ -2,9 +2,9 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-a7b0c73d.js');
+const index = require('./index-9e5554cb.js');
 const core = require('@sankhyalabs/core');
-const index$1 = require('./index-d4a1cad8.js');
+const index$1 = require('./index-1be40f19.js');
 const ezFileItemCss = ":host{display:flex;width:100%;--ez-file-item--height:42px;--ez-file-item--padding:9px;--ez-file-item--border-radius:var(--border--radius-medium, 12px);--ez-file-item--border-color:var(--color--strokes, #DCE0E8);--ez-file-item--border-style:var(--border--small, 1px solid);--ez-file-item--font-family:var(--font-pattern, Arial);--ez-file-item--font-size:var(--text--medium, 14px);--ez-file-item--font-weight:var(--text-weight--medium, 400);--ez-file-item--color:var(--title--primary, #2B3A54);--ez-file-item__file-size--font-weight:var(--text-weight--large, 600);--ez-file-item__file-size--color:var(--color--primary, #008561);--ez-file-item__background-progress--color:var(--color--primary-300, E2F4EF);--ez-file-item--icon-color:var(--title--primary, #2B3A54)}.box{display:flex;box-sizing:border-box;position:relative;align-items:center;justify-content:space-between;width:100%;padding:var(--ez-file-item--padding);border:var(--ez-file-item--border-color) var(--ez-file-item--border-style);border-radius:var(--ez-file-item--border-radius);height:var(--ez-file-item--height)}.box::before{content:\"\";position:absolute;top:0;left:0;width:100%;height:100%;clip-path:inset(2px calc(var(--ez-file-item--upload-progress, 0%) + 2px) 2px 2px round calc(var(--ez-file-item--border-radius) - 4px));background-color:var(--ez-file-item__background-progress--color)}.content{display:flex;align-items:center;z-index:0;overflow:hidden}.file-name{text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-family:var(--ez-file-item--font-family);font-size:var(--ez-file-item--font-size);font-weight:var(--ez-file-item--font-weight);color:var(--ez-file-item--color)}.file-type-icon{flex-shrink:0;--ez-icon--color:var(--ez-file-item--icon-color);padding-right:var(--ez-file-item--padding)}.file-size{padding-left:2px;overflow:hidden;flex-shrink:0;white-space:nowrap;font-family:var(--ez-file-item--font-family);font-size:var(--ez-file-item--font-size);font-weight:var(--ez-file-item__file-size--font-weight);color:var(--ez-file-item__file-size--color)}.btn-remove{cursor:pointer;flex-shrink:0;--ez-icon--color:var(--ez-file-item--icon-color)}";

package/dist/cjs/ez-file-item.cjs.entry.js.gz CHANGED Viewed

Binary file

package/dist/cjs/ez-filter-input.cjs.entry.js CHANGED Viewed

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-a7b0c73d.js');
+const index = require('./index-9e5554cb.js');
 const core = require('@sankhyalabs/core');
 const CSSVarsUtils = require('./CSSVarsUtils-f20973d1.js');

package/dist/cjs/ez-filter-input.cjs.entry.js.gz CHANGED Viewed

Binary file

package/dist/cjs/ez-form-view.cjs.entry.js CHANGED Viewed

@@ -2,29 +2,23 @@
 Object.defineProperty(exports, '__esModule', { value: true });
-const index = require('./index-a7b0c73d.js');
+const index = require('./index-9e5554cb.js');
 const core = require('@sankhyalabs/core');
-const FormLayout = require('./FormLayout-fe8da83c.js');
 const CheckMode = require('./CheckMode-ecb90b87.js');
-const index$1 = require('./index-d4a1cad8.js');
+const index$1 = require('./index-1be40f19.js');
-const buildSwitch = (field, context) => {
-  return buildField(field.name, field.label, field.readOnly, field.contextName, true, context);
+const buildSwitch = (field) => {
+  return buildField(field.name, field.label, field.readOnly, field.contextName, true);
 };
-const buildCheckBox = (field, context) => {
-  return buildField(field.name, field.label, field.readOnly, field.contextName, false, context);
+const buildCheckBox = (field) => {
+  return buildField(field.name, field.label, field.readOnly, field.contextName, false);
 };
-function buildField(fieldName, fieldLabel, readOnly, contextName, switchMode, context) {
-  const shouldUseClassic = (context === null || context === void 0 ? void 0 : context.formLayout) === FormLayout.FormLayout.CLASSIC_CASCADE ||
-    (context === null || context === void 0 ? void 0 : context.formLayout) === FormLayout.FormLayout.CLASSIC_SIDE_BY_SIDE;
-  return (index.h("div", { class: `ez-col ez-col--sd-12 ez-align--middle ez-padding-top--medium ez-padding-bottom--medium ez-size-height--full ${shouldUseClassic ? "ez-margin-top--small" : ""}` },
+function buildField(fieldName, fieldLabel, readOnly, contextName, switchMode) {
+  return (index.h("div", { class: "ez-col ez-col--sd-12 ez-align--middle ez-padding-top--medium ez-padding-bottom--medium" },
     index.h("ez-check", { enabled: !readOnly, label: fieldLabel, mode: switchMode ? CheckMode.CheckMode.SWITCH : CheckMode.CheckMode.REGULAR, "data-field-name": fieldName, "data-context-name": contextName, key: fieldName })));
 }
-const buildComboBox = ({ name, label, readOnly, required, props, contextName, canShowError }, context) => {
-  var _a;
-  const shouldUseClassic = (context === null || context === void 0 ? void 0 : context.formLayout) === FormLayout.FormLayout.CLASSIC_CASCADE ||
-    (context === null || context === void 0 ? void 0 : context.formLayout) === FormLayout.FormLayout.CLASSIC_SIDE_BY_SIDE;
+const buildComboBox = ({ name, label, readOnly, required, props, contextName, canShowError }) => {
   const prop = props === null || props === void 0 ? void 0 : props.options;
   let options;
   if (typeof prop === "string") {
@@ -34,60 +28,29 @@ const buildComboBox = ({ name, label, readOnly, required, props, contextName, ca
   else {
     options = prop;
   }
-  if (shouldUseClassic) {
-    return (index.h("div", { class: "ez-col ez-col--sd-12" },
-      index.h("ez-classic-combo-box", { class: "ez-input__no-margin", enabled: !readOnly, suppressEmptyOption: required, label: label, "data-field-name": name, "data-context-name": contextName, key: name, options: options, size: (_a = context === null || context === void 0 ? void 0 : context.size) !== null && _a !== void 0 ? _a : "small", required: required })));
-  }
   return (index.h("div", { class: "ez-col ez-col--sd-12" },
     index.h("ez-combo-box", { class: "ez-input__no-margin", enabled: !readOnly, suppressEmptyOption: required, label: label, "data-field-name": name, "data-context-name": contextName, key: name, options: options, canShowError: canShowError })));
 };
-const buildDate = ({ name, label, readOnly, canShowError, props, required }, context) => {
-  var _a;
-  const shouldUseClassic = (context === null || context === void 0 ? void 0 : context.formLayout) === FormLayout.FormLayout.CLASSIC_CASCADE ||
-    (context === null || context === void 0 ? void 0 : context.formLayout) === FormLayout.FormLayout.CLASSIC_SIDE_BY_SIDE;
-  if (shouldUseClassic) {
-    return (index.h("div", { class: "ez-col ez-col--sd-12" },
-      index.h("ez-classic-date-input", { class: "ez-input__no-margin", enabled: !readOnly, label: label, "data-field-name": name, key: name, canShowError: canShowError, size: (_a = context === null || context === void 0 ? void 0 : context.size) !== null && _a !== void 0 ? _a : "small", required: required })));
-  }
+const buildDate = ({ name, label, readOnly, canShowError }) => {
   return (index.h("div", { class: "ez-col ez-col--sd-12" },
     index.h("ez-date-input", { class: "ez-input__no-margin", enabled: !readOnly, label: label, "data-field-name": name, key: name, canShowError: canShowError })));
 };
-const buildTime = ({ name, label, readOnly, canShowError, props, required }, context) => {
-  var _a, _b, _c;
-  const shouldUseClassic = (context === null || context === void 0 ? void 0 : context.formLayout) === FormLayout.FormLayout.CLASSIC_CASCADE ||
-    (context === null || context === void 0 ? void 0 : context.formLayout) === FormLayout.FormLayout.CLASSIC_SIDE_BY_SIDE;
-  if (shouldUseClassic) {
-    return (index.h("div", { class: "ez-col ez-col--sd-12" },
-      index.h("ez-classic-time-input", { class: "ez-input__no-margin", enabled: !readOnly, label: label, "data-field-name": name, key: name, canShowError: canShowError, "show-seconds": (_a = props === null || props === void 0 ? void 0 : props.showSeconds) !== null && _a !== void 0 ? _a : false, size: (_b = context === null || context === void 0 ? void 0 : context.size) !== null && _b !== void 0 ? _b : "small", required: required })));
-  }
+const buildTime = ({ name, label, readOnly, canShowError, props }) => {
+  var _a;
   return (index.h("div", { class: "ez-col ez-col--sd-12" },
-    index.h("ez-time-input", { class: "ez-input__no-margin", enabled: !readOnly, label: label, "data-field-name": name, key: name, canShowError: canShowError, "show-seconds": (_c = props === null || props === void 0 ? void 0 : props.showSeconds) !== null && _c !== void 0 ? _c : false })));
+    index.h("ez-time-input", { class: "ez-input__no-margin", enabled: !readOnly, label: label, "data-field-name": name, key: name, canShowError: canShowError, "show-seconds": (_a = props === null || props === void 0 ? void 0 : props.showSeconds) !== null && _a !== void 0 ? _a : false })));
 };
-const buildTimeSeconds = ({ name, label, readOnly, canShowError, props, required }, context) => {
-  var _a;
-  const shouldUseClassic = (context === null || context === void 0 ? void 0 : context.formLayout) === FormLayout.FormLayout.CLASSIC_CASCADE ||
-    (context === null || context === void 0 ? void 0 : context.formLayout) === FormLayout.FormLayout.CLASSIC_SIDE_BY_SIDE;
-  if (shouldUseClassic) {
-    return (index.h("div", { class: "ez-col ez-col--sd-12" },
-      index.h("ez-classic-time-input", { class: "ez-input__no-margin", enabled: !readOnly, label: label, "data-field-name": name, key: name, canShowError: canShowError, showSeconds: true, size: (_a = context === null || context === void 0 ? void 0 : context.size) !== null && _a !== void 0 ? _a : "small", required: required })));
-  }
+const buildTimeSeconds = ({ name, label, readOnly, canShowError }) => {
   return (index.h("div", { class: "ez-col ez-col--sd-12" },
     index.h("ez-time-input", { class: "ez-input__no-margin", enabled: !readOnly, label: label, "data-field-name": name, key: name, canShowError: canShowError, showSeconds: true })));
 };
-const buildDateTime = ({ name, label, readOnly, contextName, canShowError, props, required }, context) => {
-  var _a;
-  const shouldUseClassic = (context === null || context === void 0 ? void 0 : context.formLayout) === FormLayout.FormLayout.CLASSIC_CASCADE ||
-    (context === null || context === void 0 ? void 0 : context.formLayout) === FormLayout.FormLayout.CLASSIC_SIDE_BY_SIDE;
-  if (shouldUseClassic) {
-    return (index.h("div", { class: "ez-col ez-col--sd-12" },
-      index.h("ez-classic-date-time-input", { class: "ez-input__no-margin", enabled: !readOnly, label: label, "data-field-name": name, "data-context-name": contextName, key: name, canShowError: canShowError, size: (_a = context === null || context === void 0 ? void 0 : context.size) !== null && _a !== void 0 ? _a : "small", required: required })));
-  }
+const buildDateTime = ({ name, label, readOnly, contextName, canShowError }) => {
   return (index.h("div", { class: "ez-col ez-col--sd-12" },
     index.h("ez-date-time-input", { class: "ez-input__no-margin", enabled: !readOnly, label: label, "data-field-name": name, "data-context-name": contextName, key: name, canShowError: canShowError })));
 };
-const buildFile = ({ name, label, readOnly, contextName, props }, context) => {
+const buildFile = ({ name, label, readOnly, contextName, props }) => {
   const uploadProps = core.ObjectUtils.removeEmptyValues({
     subTitle: props.subTitle,
     requestHeaders: Object.assign(Object.assign({}, (props.STORAGESTRATEGY && {
@@ -100,86 +63,48 @@ const buildFile = ({ name, label, readOnly, contextName, props }, context) => {
     index.h("ez-upload", Object.assign({ enabled: !readOnly, label: label, "data-field-name": name, "data-context-name": contextName, key: name }, uploadProps))));
 };
-const buildDecimal = ({ name, label, readOnly, props, contextName, canShowError, required }, context) => {
+const buildDecimal = ({ name, label, readOnly, props, contextName, canShowError }) => {
   var _a, _b;
   const precision = Number((_a = props === null || props === void 0 ? void 0 : props.precision) !== null && _a !== void 0 ? _a : 2);
   const prettyPrecision = Number((_b = props === null || props === void 0 ? void 0 : props.prettyPrecision) !== null && _b !== void 0 ? _b : precision);
-  return buildNumeric(name, label, readOnly, precision, prettyPrecision, contextName, canShowError, props, required, context);
+  return buildNumeric(name, label, readOnly, precision, prettyPrecision, contextName, canShowError);
 };
-const buildInteger = ({ name, label, readOnly, contextName, canShowError, props, required }, context) => {
-  return buildNumeric(name, label, readOnly, 0, 0, contextName, canShowError, props, required, context);
+const buildInteger = ({ name, label, readOnly, contextName, canShowError }) => {
+  return buildNumeric(name, label, readOnly, 0, 0, contextName, canShowError);
 };
-function buildNumeric(fieldName, fieldLabel, readOnly, precision, prettyPrecision, contextName, canShowError, props, required, context) {
-  var _a;
-  const shouldUseClassic = (context === null || context === void 0 ? void 0 : context.formLayout) === FormLayout.FormLayout.CLASSIC_CASCADE ||
-    (context === null || context === void 0 ? void 0 : context.formLayout) === FormLayout.FormLayout.CLASSIC_SIDE_BY_SIDE;
-  if (shouldUseClassic) {
-    return (index.h("div", { class: "ez-col ez-col--sd-12" },
-      index.h("ez-classic-number-input", { class: "ez-input__no-margin", enabled: !readOnly, label: fieldLabel, precision: precision, prettyPrecision: prettyPrecision, "data-field-name": fieldName, "data-context-name": contextName, key: fieldName, canShowError: canShowError, size: (_a = context === null || context === void 0 ? void 0 : context.size) !== null && _a !== void 0 ? _a : "small", required: required })));
-  }
+function buildNumeric(fieldName, fieldLabel, readOnly, precision, prettyPrecision, contextName, canShowError) {
   return (index.h("div", { class: "ez-col ez-col--sd-12" },
     index.h("ez-number-input", { class: "ez-input__no-margin", enabled: !readOnly, label: fieldLabel, precision: precision, prettyPrecision: prettyPrecision, "data-field-name": fieldName, "data-context-name": contextName, key: fieldName, canShowError: canShowError })));
 }
-const buildTextArea = ({ name, label, readOnly, rows, contextName, canShowError, props, required }, context) => {
-  const shouldUseClassic = (context === null || context === void 0 ? void 0 : context.formLayout) === FormLayout.FormLayout.CLASSIC_CASCADE ||
-    (context === null || context === void 0 ? void 0 : context.formLayout) === FormLayout.FormLayout.CLASSIC_SIDE_BY_SIDE;
-  if (shouldUseClassic) {
-    return (index.h("div", { class: "ez-col ez-col--sd-12", key: name },
-      index.h("ez-classic-text-area", { enabled: !readOnly, label: label, "data-field-name": name, "data-context-name": contextName, rows: rows })));
-  }
+const buildTextArea = ({ name, label, readOnly, contextName, rows, canShowError }) => {
   return (index.h("div", { class: "ez-col ez-col--sd-12", key: name },
     index.h("ez-text-area", { enabled: !readOnly, label: label, "data-field-name": name, "data-context-name": contextName, rows: rows, canShowError: canShowError })));
 };
-const buildTextInput = ({ name, label, readOnly, contextName, canShowError, props, required }, context) => {
-  var _a;
-  const shouldUseClassic = (context === null || context === void 0 ? void 0 : context.formLayout) === FormLayout.FormLayout.CLASSIC_CASCADE ||
-    (context === null || context === void 0 ? void 0 : context.formLayout) === FormLayout.FormLayout.CLASSIC_SIDE_BY_SIDE;
-  if (shouldUseClassic) {
-    return (index.h("div", { class: "ez-col ez-col--sd-12" },
-      index.h("ez-classic-input", { class: "ez-input__no-margin", label: label, "data-field-name": name, "data-context-name": contextName, key: name, enabled: !readOnly, mask: props === null || props === void 0 ? void 0 : props.mask, "clean-value-mask": props === null || props === void 0 ? void 0 : props.cleanValueMask, size: (_a = context === null || context === void 0 ? void 0 : context.size) !== null && _a !== void 0 ? _a : "small", required: required })));
-  }
+const buildTextInput = ({ name, label, readOnly, contextName, canShowError, props }) => {
   return (index.h("div", { class: "ez-col ez-col--sd-12" },
     index.h("ez-text-input", { class: "ez-input__no-margin", label: label, "data-field-name": name, "data-context-name": contextName, key: name, enabled: !readOnly, canShowError: canShowError, mask: props === null || props === void 0 ? void 0 : props.mask, "clean-value-mask": props === null || props === void 0 ? void 0 : props.cleanValueMask })));
 };
-const buildSearchPlus = ({ name, label, readOnly, contextName, canShowError, optionLoader, props, required }, context) => {
-  var _a;
-  const shouldUseClassic = (context === null || context === void 0 ? void 0 : context.formLayout) === FormLayout.FormLayout.CLASSIC_CASCADE ||
-    (context === null || context === void 0 ? void 0 : context.formLayout) === FormLayout.FormLayout.CLASSIC_SIDE_BY_SIDE;
+const buildSearchPlus = ({ name, label, readOnly, contextName, canShowError, optionLoader, props }) => {
   const hasDescriptionField = !core.StringUtils.isEmpty(props === null || props === void 0 ? void 0 : props.DESCRIPTIONFIELD);
-  if (shouldUseClassic) {
-    return (index.h("div", { class: "ez-col ez-col--sd-12" },
-      index.h("ez-classic-search-plus", { class: "ez-input__no-margin", enabled: !readOnly, label: label, "data-field-name": name, "data-context-name": contextName, key: name, canShowError: canShowError, optionLoader: optionLoader, hideDescriptionInput: !hasDescriptionField, size: (_a = context === null || context === void 0 ? void 0 : context.size) !== null && _a !== void 0 ? _a : "small", required: required })));
-  }
   return (index.h("div", { class: "ez-col ez-col--sd-12" },
     index.h("ez-search-plus", { class: "ez-input__no-margin", enabled: !readOnly, label: label, "data-field-name": name, "data-context-name": contextName, key: name, canShowError: canShowError, optionLoader: optionLoader, hideDescriptionInput: !hasDescriptionField })));
 };
-const buildSearch = ({ name, label, readOnly, required, contextName, canShowError, optionLoader, props }, context) => {
-  var _a, _b, _c;
+const buildSearch = ({ name, label, readOnly, required, contextName, canShowError, optionLoader, props }) => {
+  var _a;
   const hasDescriptionField = !core.StringUtils.isEmpty(props === null || props === void 0 ? void 0 : props.DESCRIPTIONFIELD);
-  const shouldUseClassic = (context === null || context === void 0 ? void 0 : context.formLayout) === FormLayout.FormLayout.CLASSIC_CASCADE ||
-    (context === null || context === void 0 ? void 0 : context.formLayout) === FormLayout.FormLayout.CLASSIC_SIDE_BY_SIDE;
-  if (shouldUseClassic) {
-    return (index.h("div", { class: "ez-col ez-col--sd-12" },
-      index.h("ez-classic-search", { class: "ez-input__no-margin", enabled: !readOnly, suppressEmptyOption: required, label: label, "data-field-name": name, "data-context-name": contextName, key: name, canShowError: canShowError, optionLoader: optionLoader, ignoreLimitCharsToSearch: (_a = props === null || props === void 0 ? void 0 : props.ignoreLimitCharsToSearch) !== null && _a !== void 0 ? _a : false, hideDescriptionInput: !hasDescriptionField, size: (_b = context === null || context === void 0 ? void 0 : context.size) !== null && _b !== void 0 ? _b : "small", required: required })));
-  }
   return (index.h("div", { class: "ez-col ez-col--sd-12" },
-    index.h("ez-search", { class: "ez-input__no-margin", enabled: !readOnly, suppressEmptyOption: required, label: label, "data-field-name": name, "data-context-name": contextName, key: name, canShowError: canShowError, optionLoader: optionLoader, ignoreLimitCharsToSearch: (_c = props === null || props === void 0 ? void 0 : props.ignoreLimitCharsToSearch) !== null && _c !== void 0 ? _c : false, hideDescriptionInput: !hasDescriptionField })));
+    index.h("ez-search", { class: "ez-input__no-margin", enabled: !readOnly, suppressEmptyOption: required, label: label, "data-field-name": name, "data-context-name": contextName, key: name, canShowError: canShowError, optionLoader: optionLoader, ignoreLimitCharsToSearch: (_a = props === null || props === void 0 ? void 0 : props.ignoreLimitCharsToSearch) !== null && _a !== void 0 ? _a : false, hideDescriptionInput: !hasDescriptionField })));
 };
-const buildRichText = ({ name, label, readOnly, contextName, rows, canShowError }, context) => {
+const buildRichText = ({ name, label, readOnly, contextName, rows, canShowError }) => {
   return (index.h("div", { class: "ez-col ez-col--sd-12" },
     index.h("ez-rich-text", { key: name, enabled: !readOnly, label: label, "data-field-name": name, "data-context-name": contextName, rows: rows, canShowError: canShowError })));
 };
-const buildImage = ({ name, label, readOnly, contextName, props }) => {
-  return (index.h("div", { class: "ez-col ez-col--sd-12" },
-    index.h("ez-image-input", Object.assign({ enabled: !readOnly, label: label, "data-field-name": name, "data-context-name": contextName, key: name, maxFileSize: Infinity }, props))));
-};
 const buildMultiSelectInput = ({ name, label, readOnly, contextName, canShowError, props }) => {
   var _a, _b, _c, _d;
   const rawOptions = props === null || props === void 0 ? void 0 : props.options;
@@ -213,15 +138,12 @@ uiBuilders.set(core.UserInterface.SEARCH, buildSearch);
 uiBuilders.set(core.UserInterface.SEARCHPLUS, buildSearchPlus);
 uiBuilders.set(core.UserInterface.LONGTEXT, buildTextArea);
 uiBuilders.set(core.UserInterface.HTML, buildRichText);
-uiBuilders.set(core.UserInterface.IMAGE, buildImage);
 uiBuilders.set(core.UserInterface.MULTISELECTOR, buildMultiSelectInput);
-const fieldBuilder = (field, customUiBuilders = new Map(), context) => {
+const fieldBuilder = (field) => {
   const i18n = index$1.getI18n();
-  const shouldUseClassic = (context === null || context === void 0 ? void 0 : context.formLayout) === FormLayout.FormLayout.CLASSIC_CASCADE ||
-    (context === null || context === void 0 ? void 0 : context.formLayout) === FormLayout.FormLayout.CLASSIC_SIDE_BY_SIDE;
-  const builder = (customUiBuilders.get(field.userInterface) || uiBuilders.get(field.userInterface)) || buildTextInput;
-  const label = !shouldUseClassic && field.required ? `${field.label}${i18n("app.requiredInfo")}` : field.label;
-  const builtElement = builder(Object.assign(Object.assign({}, field), { label }), context);
+  const builder = uiBuilders.get(field.userInterface) || buildTextInput;
+  const label = field.required ? `${field.label}${i18n("app.requiredInfo")}` : field.label;
+  const builtElement = builder(Object.assign(Object.assign({}, field), { label }));
   //@ts-ignore
   builtElement.$attrs$['data-form-item'] = field.name;
   return builtElement;
@@ -233,7 +155,7 @@ class FormItem {
   }
   addRightElement(el) {
     this.removeRightElement();
-    el.classList.add('ez-padding-left--small', 'ez-margin-top--auto', 'ez-margin-bottom--extra-small');
+    el.classList.add('ez-padding-left--small');
     el.setAttribute('data-custom-item', 'true');
     this.elem.classList.add('ez-col--nowrap');
     this.elem.appendChild(el);
@@ -262,20 +184,17 @@ class FormItems {
   }
 }
-const ezFormViewCss = ".sc-ez-form-view-h{display:flex;flex-wrap:wrap;width:100%;--ez-form-view__item--min-width:250px;--ez-form-view__long-item--min-width:530px;--ez-form-view__item--max-width:512px;--ez-form-view__long-item--max-width:100%;--ez-form-view__item--gap:var(--space--14, 14px);--ez-form-view__item--padding:var(--space--small)}.form-view__content.sc-ez-form-view{display:grid;grid-template-columns:repeat(auto-fill, minmax(var(--ez-form-view__item--min-width), 1fr));gap:var(--ez-form-view__item--gap);padding-inline:var(--ez-form-view__item--padding);width:100%}.form-view__content--single-column.sc-ez-form-view{grid-template-columns:1fr}.form-view__content--single-column.sc-ez-form-view>div.sc-ez-form-view:not(.input-full_width){width:clamp(var(--ez-form-view__item--min-width), 70%, var(--ez-form-view__item--max-width))}.input-full_width.sc-ez-form-view{grid-column:1/-1;width:clamp(var(--ez-form-view__long-item--min-width), 100%, var(--ez-form-view__long-item--max-width))}.single-column.sc-ez-form-view{--ez-form-view__long-item--max-width:1024px}*.sc-ez-form-view:has(*)+ez-collapsible-box.sc-ez-form-view{margin-top:var(--space--16, 16px)}";
+const ezFormViewCss = ".sc-ez-form-view-h{display:flex;flex-wrap:wrap;width:100%;--ez-form-view__item--min-width:220px;--ez-form-view__item--max-width:440px;--ez-form-view__item--width:var(--space--small);--ez-form-view__item--padding:var(--space--small)}.form-view__content.sc-ez-form-view{display:grid;grid-template-columns:repeat(auto-fill, minmax(var(--ez-form-view__item--min-width), 1fr));gap:var(--ez-form-view__item--width);padding-inline:var(--ez-form-view__item--padding);width:100%}.form-view__content--single-column.sc-ez-form-view{grid-template-columns:repeat(1, minmax(var(--ez-form-view__item--min-width), var(--ez-form-view__item--max-width)))}.input-full_width.sc-ez-form-view{grid-column:1 / -1;width:100%}";
 const EzFormView = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.ezContentReady = index.createEvent(this, "ezContentReady", 7);
     this.formItemsReady = index.createEvent(this, "formItemsReady", 7);
-    this.MAIN_GROUP_NAME = "__main";
     this._customEditors = new Map();
     this.fields = undefined;
     this.selectedRecord = undefined;
     this.singleColumn = false;
-    this.formLayout = undefined;
-    this.customUiBuilders = new Map();
   }
   async showUp() {
     if (this.singleColumn)
@@ -303,18 +222,10 @@ const EzFormView = class {
     });
     this.fields = [...fields];
   }
-  getGroupByField(field) {
-    var _a, _b;
-    const group = (_a = field.group) !== null && _a !== void 0 ? _a : (_b = field.props) === null || _b === void 0 ? void 0 : _b["UITabName"];
-    if (group && group !== this.MAIN_GROUP_NAME) {
-      return group;
-    }
-    return undefined;
-  }
   groupFields(fields) {
     const result = new Map();
     fields.forEach(item => {
-      const groupLabel = this.getGroupByField(item);
+      const groupLabel = item.group;
       if (groupLabel) {
         let groupFields = result.get(groupLabel);
         if (groupFields == undefined) {
@@ -345,18 +256,14 @@ const EzFormView = class {
   buildFormItemElement(item, classItem = "") {
     var _a;
     if (this.isItemFullWidth(item.userInterface)) {
-      classItem += ` input-full_width ${this.singleColumn && `single-column`}`;
+      classItem += " input-full_width";
     }
-    const context = {
-      formLayout: this.formLayout,
-      size: "xsmall",
-    };
     if (this._customEditors.has(item.name)) {
       const value = (_a = this._formElements.map(el => ({ name: el.dataset.fieldName, value: el['value'] })).find(field => field.name === item.name)) === null || _a === void 0 ? void 0 : _a.value;
       const customEditor = this._customEditors.get(item.name).customEditor;
-      return index.h("div", { class: classItem }, index.h("ez-custom-form-input", { "data-field-name": item.name, customEditor: customEditor, formViewField: item, builderFallback: (field) => fieldBuilder(field, this.customUiBuilders, context), value: value, selectedRecord: this.selectedRecord }));
+      return index.h("div", { class: classItem }, index.h("ez-custom-form-input", { "data-field-name": item.name, customEditor: customEditor, formViewField: item, builderFallback: fieldBuilder, value: value, selectedRecord: this.selectedRecord }));
     }
-    return index.h("div", { class: classItem }, fieldBuilder(item, this.customUiBuilders, context));
+    return index.h("div", { class: classItem }, fieldBuilder(item));
   }
   render() {
     core.ElementIDUtils.addIDInfoIfNotExists(this._element, 'ezFormView');

package/dist/cjs/ez-form-view.cjs.entry.js.gz CHANGED Viewed

Binary file