@sme.up/ketchup 10.3.0 → 10.3.2

package/dist/collection/components/kup-calendar/kup-calendar.js

@@ -1,4 +1,4 @@
-import { forceUpdate, getAssetPath, h, Host, } from "@stencil/core";
+import { forceUpdate, h, Host, } from "@stencil/core";
 import { Calendar, } from "@fullcalendar/core";
 import dayGridPlugin from "@fullcalendar/daygrid";
 import interactionPlugin from "@fullcalendar/interaction";
@@ -144,24 +144,42 @@ export class KupCalendar {
                     row: event.extendedProps.row,
                 });
             },
+            eventTimeFormat: {
+                hour: '2-digit',
+                minute: '2-digit',
+            },
             eventDidMount: (info) => {
+                // In the calendar component, we handle two cases:
+                // if the '.fc-event-main' div exists, the event don't has start/end time;
+                const content = document.createElement('div');
+                const mainEvent = info.el.querySelector('.fc-event-main');
+                if (!mainEvent) {
+                    const title = info.el.querySelector('.fc-event-title');
+                    const time = info.el.querySelector('.fc-event-time');
+                    content.append(time, title);
+                    content.style.display = 'flex';
+                    content.style.flexDirection = 'column';
+                    info.el.appendChild(content);
+                }
                 if (this.iconCol) {
                     const row = info.event.extendedProps.row;
                     const cell = row.cells[this.iconCol];
                     if (cell === null || cell === void 0 ? void 0 : cell.value) {
                         const wrapper = document.createElement('div');
                         wrapper.classList.add('icon-wrapper');
-                        cell.value.split(';').forEach((icon) => {
-                            if (icon) {
-                                const span = document.createElement('span');
-                                span.className = 'custom-icon';
-                                const path = getAssetPath(`./assets/svg/${icon}.svg`);
-                                span.style.mask = `url('${path}') no-repeat center`;
-                                span.style.webkitMask = `url('${path}') no-repeat center`;
-                                wrapper.appendChild(span);
-                            }
-                        });
-                        info.el.appendChild(wrapper);
+                        const propsFImage = {
+                            resource: cell.value,
+                            placeholderResource: cell.placeholderIcon,
+                            sizeX: '1.5em',
+                            sizeY: '1.5em',
+                            wrapperClass: 'custom-icon',
+                        };
+                        const fImage = document.createElement('kup-image');
+                        Object.keys(propsFImage).forEach((prop) => (fImage[prop] = propsFImage[prop]));
+                        wrapper.appendChild(fImage);
+                        mainEvent
+                            ? mainEvent.appendChild(wrapper)
+                            : info.el.appendChild(wrapper);
                     }
                 }
                 if (this.imageCol) {
@@ -443,11 +461,11 @@ export class KupCalendar {
         this.kupManager.debug.logRender(this, true);
     }
     render() {
-        return (h(Host, { key: '2e09ca9ff59ee7119bd48ef2755c753027524b3d' }, h("style", { key: '49aba4781dead4d8a7610a9a73058ff86f57cdf6' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: 'a8c561b5f047f1cd95cd2c0efa085585d80c1c62', id: componentWrapperId }, h("div", { key: '3924302e0abe429b7c2b79f0af5c5455f492d1e4', class: "navigation" }, !this.hideNavigation ? (h("div", { class: "navigation__left" }, h(FButton, { icon: "chevron_left", onClick: () => this.onPrev(), title: this.kupManager.language.translate(KupLanguageGeneric.PREVIOUS), wrapperClass: "navigation__prev" }), h(FButton, { icon: "calendar", onClick: () => this.onToday(), title: this.kupManager.language.translate(KupLanguageGeneric.TODAY), wrapperClass: "navigation__today" }), h(FButton, { icon: "chevron_right", onClick: () => this.onNext(), title: this.kupManager.language.translate(KupLanguageGeneric.NEXT), wrapperClass: "navigation__next" }))) : null, h("div", { key: 'eff283c43cf7d63dd4f33ab01294f627bd03446d', class: `navigation__title ${this.hideNavigation
+        return (h(Host, { key: '694d6c782eed06ec64232acc3ef163236c157711' }, h("style", { key: 'eaa3dca371969bb1cedb5b45e019ad6b563d3a0f' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '8d1d89e4526d1b50649d9486f5f292ff328d5457', id: componentWrapperId }, h("div", { key: 'fd7ce40682db901688644ff02e4fcd56f79c9256', class: "navigation" }, !this.hideNavigation ? (h("div", { class: "navigation__left" }, h(FButton, { icon: "chevron_left", onClick: () => this.onPrev(), title: this.kupManager.language.translate(KupLanguageGeneric.PREVIOUS), wrapperClass: "navigation__prev" }), h(FButton, { icon: "calendar", onClick: () => this.onToday(), title: this.kupManager.language.translate(KupLanguageGeneric.TODAY), wrapperClass: "navigation__today" }), h(FButton, { icon: "chevron_right", onClick: () => this.onNext(), title: this.kupManager.language.translate(KupLanguageGeneric.NEXT), wrapperClass: "navigation__next" }))) : null, h("div", { key: '832adde7b78762398fb46d100159bc9e3ad31ea3', class: `navigation__title ${this.hideNavigation
                 ? 'navigation__title--centered'
                 : ''}`, ref: (el) => {
                 this.navTitle = el;
-            } }), h("div", { key: '5b5ad62259d36a33641b8a12c5f983f11a4fb962', class: "navigation__right" }, this.enableChangeView ? (h(FChip, Object.assign({}, this.setChipProps()))) : null)), h("div", { key: '06df126df2c243ddea639a30934d61190057f0fc', class: "calendar", ref: (el) => (this.calendarContainer = el) }))));
+            } }), h("div", { key: '93d4d527539c090ca8a29ee76c04ef8ee0c36d29', class: "navigation__right" }, this.enableChangeView ? (h(FChip, Object.assign({}, this.setChipProps()))) : null)), h("div", { key: 'cf94727499fdd2dd62a8e0fb0481575b631efb4f', class: "calendar", ref: (el) => (this.calendarContainer = el) }))));
     }
     disconnectedCallback() {
         if (this.calendar) {

package/dist/collection/components/kup-card/built-in/kup-card-column-drop-menu.js

@@ -143,7 +143,7 @@ async function applyFormula(component) {
             ? parts[1].trim()
             : valueString;
         if (premadeFormulas.includes(value)) {
-            dom.ketchup.data.column.new(options.data, KupDataNewColumnTypes.MATH, {
+            const result = dom.ketchup.data.column.new(options.data, KupDataNewColumnTypes.MATH, {
                 columns: [
                     options.receivingColumn.name,
                     options.starterColumn.name,
@@ -154,7 +154,7 @@ async function applyFormula(component) {
                 operation: value,
             });
             if (options.formulaCb !== undefined) {
-                options.formulaCb();
+                options.formulaCb(result);
             }
         }
         else {
@@ -170,7 +170,7 @@ async function applyFormula(component) {
                 combobox.refresh();
             }
             else if (options.formulaCb !== undefined) {
-                options.formulaCb();
+                options.formulaCb(result);
             }
         }
     }

package/dist/collection/components/kup-card/kup-card-helper.js

@@ -7,11 +7,12 @@ import { KupThemeColorValues } from "../../managers/kup-theme/kup-theme-declarat
  * This function returns a list of components.
  * @param {GenericObject[]} compArray - Components' props.
  * @param {string} compType - Components' type.
+ * @param {number} maxLength - Maximum number of components to return.
  * @returns {JSX.Element[]} List of components.
  */
-export function compList(compArray, compType) {
+export function compList(compArray, compType, maxLength = compArray.length) {
     let list = [];
-    for (let index = 0; index < compArray.length; index++) {
+    for (let index = 0; index < Math.min(maxLength, compArray.length); index++) {
         if (typeof compArray[0] !== 'string' &&
             !compArray[index].id) {
             compArray[index]['id'] = compType + index;

package/dist/collection/components/kup-card/kup-card.css

@@ -3128,6 +3128,14 @@
   margin-left: 0;
   margin-right: auto;
 }
+.standard-layout-12 .sub-filters-warning {
+  display: flex;
+  justify-content: center;
+  padding-top: var(--kup-space-05);
+}
+.standard-layout-12 .sub-filters-warning label {
+  font-size: var(--kup-label-01-font-size, 12px);
+}
 
 .standard-layout-13 {
   background-color: var(--kup-background-color);
@@ -3303,6 +3311,14 @@
   margin-left: 0;
   margin-right: auto;
 }
+.standard-layout-14 .sub-filters-warning {
+  display: flex;
+  justify-content: center;
+  padding-top: var(--kup-space-05);
+}
+.standard-layout-14 .sub-filters-warning label {
+  font-size: var(--kup-label-01-font-size, 12px);
+}
 .standard-layout-14 .sub-formula {
   padding: 0.5em 0;
 }

package/dist/collection/components/kup-card/standard/kup-card-standard.js

@@ -1,4 +1,4 @@
-import { h } from "@stencil/core";
+import { Fragment, h } from "@stencil/core";
 import { FImage } from "../../../f-components/f-image/f-image";
 import { compList } from "../kup-card-helper";
 import { KupLanguageColumn, KupLanguageGeneric, KupLanguageSearch, } from "../../../managers/kup-language/kup-language-declarations";
@@ -7,7 +7,9 @@ import { KupCardCSSClasses, KupCardIds } from "../kup-card-declarations";
 import { KupColumnMenuIds } from "../../../utils/kup-column-menu/kup-column-menu-declarations";
 import { KupThemeColorValues } from "../../../managers/kup-theme/kup-theme-declarations";
 import { FButtonStyling } from "../../../f-components/f-button/f-button-declarations";
+import { kupManagerInstance } from "../../../managers/kup-manager/kup-manager";
 const dom = document.documentElement;
+const kupManager = kupManagerInstance();
 /**
  * 1st standard card layout, inspired by Material Design.
  * @param {KupCard} component - Card component.
@@ -370,6 +372,7 @@ export function create12(component) {
             buttonsIds.push(button['id']);
         }
     }
+    const filtersMaxLen = kupManager.perfTuning.data.filtersMaxLength;
     return (h("div", { class: `standard-layout-${component.layoutNumber} ` }, buttonsIds.includes(KupColumnMenuIds.BUTTON_REMOVE) ||
         buttonsIds.includes(KupColumnMenuIds.BUTTON_GROUP) ||
         buttonsIds.includes(KupColumnMenuIds.BUTTON_ADD_COLUMNS) ? (h("div", { class: "section-1" }, buttonsIds.includes(KupColumnMenuIds.BUTTON_REMOVE) ? (h("kup-button", Object.assign({}, buttonArray.find((x) => x.id === KupColumnMenuIds.BUTTON_REMOVE)))) : null, buttonsIds.includes(KupColumnMenuIds.BUTTON_GROUP) ? (h("kup-button", Object.assign({}, buttonArray.find((x) => x.id === KupColumnMenuIds.BUTTON_GROUP)))) : null, buttonsIds.includes(KupColumnMenuIds.BUTTON_ADD_COLUMNS) ? (h("kup-button", Object.assign({}, buttonArray.find((x) => x.id === KupColumnMenuIds.BUTTON_ADD_COLUMNS)))) : null)) : null, h("div", { class: `section-2 ${textfieldArray.length > 0 ||
@@ -382,7 +385,7 @@ export function create12(component) {
         ? compList(textfieldArray, 'textfield')
         : null, timepickerArray.length > 0
         ? compList(timepickerArray, 'timepicker')
-        : null), checkboxArray.length > 0 ? (h("div", { class: "section-3" }, compList(checkboxArray, 'checkbox'))) : null));
+        : null), checkboxArray.length > 0 ? (h(Fragment, null, getFiltersWarningElement(checkboxArray, filtersMaxLen), h("div", { class: "section-3" }, compList(checkboxArray, 'checkbox', filtersMaxLen)))) : null));
 }
 /**
  * 13th standard card layout, buttons and text lines, used for debug window.
@@ -491,6 +494,7 @@ export function create14(component) {
         }
     }
     const tooltipText = dom.ketchup.language.translate(KupLanguageSearch.TOOLTIP);
+    const filtersMaxLen = kupManager.perfTuning.data.filtersMaxLength;
     return (h("div", { class: `standard-layout-${component.layoutNumber} ` }, objectArray[0] ? (h("div", { class: "section-1" }, imageArray[0] ? (h(FImage, Object.assign({ id: "image1" }, imageArray[0], { sizeX: "84px", sizeY: "84px" }))) : (h("div", { class: "sub-spinner" }, h("kup-spinner", { active: true, dimensions: "7px", layout: 14 }))), h("div", { class: "sub-1" }, textArray[0] ||
         buttonsIds.includes(KupColumnMenuIds.BUTTON_OPEN_IN_NEW) ||
         buttonsIds.includes(KupColumnMenuIds.BUTTON_SEARCH) ? (h("div", { class: "top" }, textArray[0] ? (h("div", { class: "title" }, h("span", { class: `label ${KupCardCSSClasses.CLICKABLE_LINK}`, id: "title-link" }, textArray[0]))) : null, buttonsIds.includes(KupColumnMenuIds.BUTTON_OPEN_IN_NEW) ||
@@ -510,7 +514,7 @@ export function create14(component) {
         ? compList(textfieldArray, 'textfield')
         : null, timepickerArray.length > 0
         ? compList(timepickerArray, 'timepicker')
-        : null), checkboxArray.length > 0 ? (h("div", { class: "sub-checkbox" }, compList(checkboxArray, 'checkbox'))) : null)) : null, tabsValues.includes(KupLanguageColumn.COLUMNS) ? (h("div", { class: `${KupCardCSSClasses.CARD_VIEW} ${KupCardCSSClasses.VIEW_PREFIX}${viewIndex} ${visibleView === viewIndex++
+        : null), checkboxArray.length > 0 ? (h(Fragment, null, getFiltersWarningElement(checkboxArray, filtersMaxLen), h("div", { class: "sub-checkbox" }, compList(checkboxArray, 'checkbox', filtersMaxLen)))) : null)) : null, tabsValues.includes(KupLanguageColumn.COLUMNS) ? (h("div", { class: `${KupCardCSSClasses.CARD_VIEW} ${KupCardCSSClasses.VIEW_PREFIX}${viewIndex} ${visibleView === viewIndex++
             ? KupCardCSSClasses.VISIBLE
             : ''}` }, h("div", { class: "sub-button" }, buttonsIds.includes(KupColumnMenuIds.BUTTON_REMOVE) ? (h("kup-button", Object.assign({}, buttonArray.find((x) => x.id ===
         KupColumnMenuIds.BUTTON_REMOVE)))) : null, buttonsIds.includes(KupColumnMenuIds.BUTTON_GROUP) ? (h("kup-button", Object.assign({}, buttonArray.find((x) => x.id ===
@@ -650,3 +654,6 @@ export function create17(component) {
         return h("kup-list", Object.assign({}, b));
     }))) : null)));
 }
+function getFiltersWarningElement(checkboxArray, filtersMaxLength) {
+    return checkboxArray.length > filtersMaxLength ? (h("div", { class: 'sub-filters-warning' }, h("label", null, kupManager.language.translate(KupLanguageGeneric.PARTIAL_FILTERS_LIST)))) : null;
+}

package/dist/collection/components/kup-chip/kup-chip.js

@@ -196,13 +196,15 @@ export class KupChip {
             props.onFocus.push((chip) => this.onKupFocus(chip));
             props.onIconClick.push((chip) => this.onKupIconClick(chip));
         }
-        return (h(Host, { key: 'bf8bf0a53796849610faed0eb1424a10db852338', "onKup-autocomplete-itemclick": (e) => {
+        return (h(Host, { key: 'd8cfebdb07ba8edd6dc3537932d0bc0af691f35b', "onKup-autocomplete-itemclick": (e) => {
                 __classPrivateFieldGet(this, _KupChip_instances, "m", _KupChip_changeHandler).call(this, e);
             }, "onKup-combobox-itemclick": (e) => {
                 __classPrivateFieldGet(this, _KupChip_instances, "m", _KupChip_changeHandler).call(this, e);
             }, "onKup-textfield-change": (e) => {
                 __classPrivateFieldGet(this, _KupChip_instances, "m", _KupChip_changeHandler).call(this, e);
-            } }, h("style", { key: '66132a3e1baf71ff1703cc2a5760f83afc41841f' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '09690424ee34a1ec12e8a4f1a368fb6b1f3da1db', id: componentWrapperId }, this.label ? (h("div", { class: "mdc-text-field__label-container" }, h("label", { class: "mdc-label" }, this.label))) : null, ((_a = this.data) === null || _a === void 0 ? void 0 : _a.length) > 0 ? h(FChip, Object.assign({}, props)) : null, h("slot", { key: '74a0bb6b61c03cf41f46091ccef2efd8eabdc48a', name: "field" }))));
+            }, "onKup-textfield-submit": (e) => {
+                __classPrivateFieldGet(this, _KupChip_instances, "m", _KupChip_changeHandler).call(this, e);
+            } }, h("style", { key: '752eb1a7d0ac346204c4c1cf05c02a7d4d95fd7d' }, this.kupManager.theme.setKupStyle(this.rootElement)), h("div", { key: '70df2afbe8e3a484cb6894607fe6e951bf60679d', id: componentWrapperId }, this.label ? (h("div", { class: "mdc-text-field__label-container" }, h("label", { class: "mdc-label" }, this.label))) : null, ((_a = this.data) === null || _a === void 0 ? void 0 : _a.length) > 0 ? h(FChip, Object.assign({}, props)) : null, h("slot", { key: 'f3c578d5f21090cd839b4048e4a5996d96c36eb0', name: "field" }))));
     }
     disconnectedCallback() {
         this.kupManager.theme.unregister(this);
@@ -692,7 +694,5 @@ _KupChip_instances = new WeakSet(), _KupChip_changeHandler =
         stringifiedValues: __classPrivateFieldGet(this, _KupChip_instances, "m", _KupChip_stringifiedValues).call(this),
     });
 }, _KupChip_stringifiedValues = function _KupChip_stringifiedValues() {
-    let stringifiedValues = '';
-    this.data.forEach((node) => (stringifiedValues += node.id + ';'));
-    return stringifiedValues;
+    return this.data.map((node) => node.id).join(';');
 };

package/dist/collection/components/kup-combobox/kup-combobox-declarations.js

@@ -18,4 +18,5 @@ export var KupComboboxProps;
     KupComboboxProps["leadingLabel"] = "When set to true, the label will be on the left of the component.";
     KupComboboxProps["showMarker"] = "When true shows a small marker on the component";
     KupComboboxProps["legacyLook"] = "When true enables the monospaced look for the CMB component";
+    KupComboboxProps["size"] = "Sets the size of the input element";
 })(KupComboboxProps || (KupComboboxProps = {}));

package/dist/collection/components/kup-combobox/kup-combobox.js

@@ -27,6 +27,7 @@ import { KupThemeIconValues } from "../../managers/kup-theme/kup-theme-declarati
 import { getProps, setProps } from "../../utils/utils";
 import { componentWrapperId } from "../../variables/GenericVariables";
 import { KupDynamicPositionPlacement } from "../../managers/kup-dynamic-position/kup-dynamic-position-declarations";
+import { getSizeOfInputElement } from "../../utils/cell-utils";
 export class KupCombobox {
     constructor() {
         _KupCombobox_instances.add(this);
@@ -63,6 +64,7 @@ export class KupCombobox {
         this.trailingIcon = false;
         this.showMarker = false;
         this.legacyLook = false;
+        this.size = undefined;
     }
     onKupBlur() {
         if (!__classPrivateFieldGet(this, _KupCombobox_instances, "m", _KupCombobox_isListOpened).call(this)) {
@@ -139,6 +141,19 @@ export class KupCombobox {
             inputValue: __classPrivateFieldGet(this, _KupCombobox_textfieldEl, "f").value,
         });
     }
+    onKupClearIconClick() {
+        this.value = '';
+        this.displayedValue = '';
+        __classPrivateFieldGet(this, _KupCombobox_textfieldEl, "f").value = '';
+        this.kupChange.emit({
+            comp: this,
+            id: this.rootElement.id,
+            value: this.value,
+            inputValue: __classPrivateFieldGet(this, _KupCombobox_textfieldEl, "f").value,
+            node: { value: '' },
+        });
+        __classPrivateFieldGet(this, _KupCombobox_instances, "m", _KupCombobox_closeList).call(this);
+    }
     /*-------------------------------------------------*/
     /*                  W a t c h e r s                */
     /*-------------------------------------------------*/
@@ -282,6 +297,7 @@ export class KupCombobox {
         __classPrivateFieldGet(this, _KupCombobox_kupManager, "f").debug.logRender(this, true);
     }
     render() {
+        var _a;
         const props = {
             alert: this.alert,
             danger: this.rootElement.classList.contains('kup-danger')
@@ -308,12 +324,14 @@ export class KupCombobox {
                 : false,
             showMarker: this.showMarker,
             legacyLook: this.legacyLook,
+            size: getSizeOfInputElement(this.data, this.displayMode, this.size),
+            title: (_a = this.displayedValue) !== null && _a !== void 0 ? _a : '',
         };
         const fullHeight = this.rootElement.classList.contains('kup-full-height');
         const fullWidth = this.rootElement.classList.contains('kup-full-width');
-        return (h(Host, { key: 'd724bfd8c4b33e0756be8a9669d218e7a3f15dd9', class: `${fullHeight ? 'kup-full-height' : ''} ${fullWidth ? 'kup-full-width' : ''}`, style: __classPrivateFieldGet(this, _KupCombobox_elStyle, "f") }, h("style", { key: '2115e4d44f5d28d72de809e98818e81e14f955b3' }, __classPrivateFieldGet(this, _KupCombobox_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: 'd907dc96d2dbf1c680ce181f868be5daea0f6f1f', id: componentWrapperId, style: __classPrivateFieldGet(this, _KupCombobox_elStyle, "f") }, h(FTextField, Object.assign({ key: 'b305bb5e3f2408217ff82abf854d82a3caca5886' }, props, this.data['kup-text-field'], { disabled: this.disabled, fullHeight: fullHeight, fullWidth: fullWidth, trailingIcon: true, icon: this.showDropDownIcon
+        return (h(Host, { key: '3a668e909d00508d820581ceb71cec02bf640fa6', class: `${fullHeight ? 'kup-full-height' : ''} ${fullWidth ? 'kup-full-width' : ''}`, style: __classPrivateFieldGet(this, _KupCombobox_elStyle, "f") }, h("style", { key: '8fe26ceec376d17b2fb81825d9e7c3ed9839d8a4' }, __classPrivateFieldGet(this, _KupCombobox_kupManager, "f").theme.setKupStyle(this.rootElement)), h("div", { key: '56d4ec7e7dc9ec8d95082d7f0f53830c0cd66170', id: componentWrapperId, style: __classPrivateFieldGet(this, _KupCombobox_elStyle, "f") }, h(FTextField, Object.assign({ key: '61a0a16cb31b1dcdb5d91d5ebe4be550c81a93f2' }, props, this.data['kup-text-field'], { disabled: this.disabled, fullHeight: fullHeight, fullWidth: fullWidth, trailingIcon: true, icon: this.showDropDownIcon
                 ? KupThemeIconValues.DROPDOWN
-                : null, value: this.displayedValue, onBlur: () => this.onKupBlur(), onClick: () => this.onKupIconClick(), onChange: (e) => this.onKupChange(e.target.value), onFocus: () => this.onKupFocus(), onInput: () => this.onKupInput(), onIconClick: () => this.onKupIconClick() }))), __classPrivateFieldGet(this, _KupCombobox_instances, "m", _KupCombobox_prepList).call(this)));
+                : null, value: this.displayedValue, onBlur: () => this.onKupBlur(), onClick: () => this.onKupIconClick(), onChange: (e) => this.onKupChange(e.target.value), onFocus: () => this.onKupFocus(), onInput: () => this.onKupInput(), onIconClick: () => this.onKupIconClick(), onClearIconClick: () => this.onKupClearIconClick() }))), __classPrivateFieldGet(this, _KupCombobox_instances, "m", _KupCombobox_prepList).call(this)));
     }
     disconnectedCallback() {
         if (__classPrivateFieldGet(this, _KupCombobox_listEl, "f")) {
@@ -779,6 +797,23 @@ export class KupCombobox {
                 "attribute": "legacy-look",
                 "reflect": false,
                 "defaultValue": "false"
+            },
+            "size": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Sets the size of the input element"
+                },
+                "attribute": "size",
+                "reflect": false
             }
         };
     }