npm - udp-stencil-component-library - Versions diffs - 25.18.1-beta.7 → 25.18.1-beta.8 - Mend

udp-stencil-component-library 25.18.1-beta.7 → 25.18.1-beta.8

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 (324) hide show

package/dist/esm/ag-grid-base_5.entry.js CHANGED Viewed

@@ -991,7 +991,7 @@ const AgGridBase = class {
     render() {
         var _a;
         const variantClass = `variant-${((_a = this.headerConfig) === null || _a === void 0 ? void 0 : _a.variant) || 'light'}`;
-        return (h("div", { key: '315a73b730d7d5d044b6bbf5f60a15e3b9582976', class: variantClass, ref: el => (this.gridContainerEl = el) }, h("ghost-render", { key: '466bccfb96cd71bb4d49cc8cea9293d76e8ef974' }, h("div", { key: '39de56375c5fc7ba94add149473348bf18060848' }, h("udp-dialog", { key: 'e1a537dae7065f89ccc1749c05ccd6f0043b54f7' }), h("udp-list-item", { key: '239b637a36feb02ec191203240b721a647997782' }), h("hint-panel", { key: 'd8ccc7f25ec0c3704b85496bed34a67b1e81f0cd' }))), h("div", { key: '74640f93605ecb67015daceb356c4b1fba30d069', class: "grid-base-header" }, h("grid-header", { key: 'a1eaa9bce2b9ce5f70631bb1d5e75270c00f96e8', headerConfig: this.headerConfig, gridFunctions: this.gridFunctions, onHeaderAction: this.onHeaderAction }), h("div", { key: '3edcb8130744665fd8570c738c8c61e51f3a096b', class: "action-bar", style: { viewTransitionName: `action-bar` } }, this.gridFunctionInstances.map(fn => { var _a; return (_a = fn.render) === null || _a === void 0 ? void 0 : _a.call(fn); }))), h("div", { key: '32f44119cc6bb374e08e3c5160b9d86d3f1d3c49', id: "myNewGrid", ref: el => (this.gridEl = el), style: {
+        return (h("div", { key: '09ef0f0e4491de19f4b7b06ee20d0ee1384005f9', class: variantClass, ref: el => (this.gridContainerEl = el) }, h("ghost-render", { key: '74ec21f0fc099e50c68be0915a1af7cda74d0776' }, h("div", { key: '850311d288c09fddd394086540eb5fe9730efd28' }, h("udp-dialog", { key: 'afcac5ce1b9fa78e59d2dcc05ccce773ec14a39a' }), h("udp-list-item", { key: 'a78311218bb58edf424a185d562955bedcace44d' }), h("hint-panel", { key: 'aeebbfbbadd7d97ef59893a4ab74d8f520e2c9b5' }))), h("div", { key: 'f0eb54721ab03eb3b66b7c94bc2c1edb2b503e19', class: "grid-base-header" }, h("grid-header", { key: '688303601e82c2755ad7261e61eee24a453ebe38', headerConfig: this.headerConfig, gridFunctions: this.gridFunctions, onHeaderAction: this.onHeaderAction }), h("div", { key: 'b99099543b7c32516f25931a4a3554d3b735510b', class: "action-bar", style: { viewTransitionName: `action-bar` } }, this.gridFunctionInstances.map(fn => { var _a; return (_a = fn.render) === null || _a === void 0 ? void 0 : _a.call(fn); }))), h("div", { key: 'fc409e24001a190d9a5b78e487522bb7259ba97e', id: "myNewGrid", ref: el => (this.gridEl = el), style: {
                 viewTransitionName: `my-new-grid`,
             } })));
     }
@@ -1078,7 +1078,7 @@ const GhostRender = class {
         // The <slot /> is necessary to prevent the Stencil compiler from
         // overly optimizing this component's output and aliasing the
         // defineCustomElement export, which breaks downstream wrappers.
-        return (h(Host, { key: '1e77fbfc7ab0bc5ca00ee2351f547ef3d752f7c9' }, h("slot", { key: '092e556509b9c77f9c54da22fd41ed35c2ce65b2' })));
+        return (h(Host, { key: 'a15d6cd564f8aef008068decd2c423239e7caa89' }, h("slot", { key: '6e79729b7819373e24a9b7f91c31a15960a09363' })));
     }
 };
 GhostRender.style = ":host {\n      display: none;\n    }";
@@ -1182,7 +1182,7 @@ const UdpDialog = class {
         document.removeEventListener('keydown', this.handleKeyDown);
     }
     render() {
-        return (h(Host, { key: '4adbe541f2902a9d92c243a40388bdc3b121b645', onClick: this.handleOverlayClick }, h("div", { key: '9614c5df4fbe7e94c73b5aacc37174d6b16555c9', class: "dialog-container", role: "dialog", "aria-modal": "true", "aria-labelledby": this.titleId, "aria-describedby": this.descriptionId, onClick: (event) => event.stopPropagation() }, h("div", { key: 'adb9fc377065a01d3b3266d99f3ffe640058fa73', class: "dialog-title", id: this.titleId }, h("unity-typography", { key: 'e03c5fc91c29a384eabab75c1509488eac44d6f0', variant: "h3" }, this.title)), h("div", { key: 'e0f011fb41be303e8779e128e02c2b9aed43e645', class: "dialog-content", id: this.descriptionId }, this.message && h("unity-typography", { key: 'fef802596e0859df5774da1497eb91e4f2a6d193', variant: "body" }, this.message), h("slot", { key: '1cb32eb5d979ad00ed1e9fa9e284e46562defb05' })), h("div", { key: '1b1043c981af31c3b3e51f61017e09e856da5f71', class: "dialog-actions" }, !this.buttonTwoHidden && (h("udp-button", { key: '3dced852ea4bb0741eb0de0809f8e75b3b3b4c30', variant: 'text', disabled: this.disableTwo, onClick: () => this.actionTwo() }, this.labelTwo)), !this.buttonThreeHidden && (h("udp-button", { key: 'ca50eec078c3f5a3947d5377547fc2c689d7cc33', variant: 'text', disabled: this.disableThree, onClick: () => this.actionThree() }, this.labelThree)), !this.buttonOneHidden && (h("udp-button", { key: 'ab4c062175324d22f85900dd7713df93624dd7ef', variant: 'contained', disabled: this.disableOne, onClick: () => this.actionOne(), loading: !!this.progress }, this.labelOne))))));
+        return (h(Host, { key: '01757cb710b4621a69e4ed790374d9b16a139031', onClick: this.handleOverlayClick }, h("div", { key: '669805ff6826420f397e97cf1051022ecf33451a', class: "dialog-container", role: "dialog", "aria-modal": "true", "aria-labelledby": this.titleId, "aria-describedby": this.descriptionId, onClick: (event) => event.stopPropagation() }, h("div", { key: '6c4ce9f296e970e49f9d582e260f49eb847eb42b', class: "dialog-title", id: this.titleId }, h("unity-typography", { key: 'd5565820bca213943b5406ce63e967e1c9895684', variant: "h3" }, this.title)), h("div", { key: 'af030ddb399c0a9805e13f2025d585fa37f5193c', class: "dialog-content", id: this.descriptionId }, this.message && h("unity-typography", { key: 'ea821f4f8dc91cafd77b49f351b960bc2ea86fcb', variant: "body" }, this.message), h("slot", { key: '10fd10148354b8072bbd247436c649a6625afd4c' })), h("div", { key: 'a4be76d0999841f2ce0a05e52f22930cffacf140', class: "dialog-actions" }, !this.buttonTwoHidden && (h("udp-button", { key: '69fee918e7319ed67e98f6fbc6c568167f839a09', variant: 'text', disabled: this.disableTwo, onClick: () => this.actionTwo() }, this.labelTwo)), !this.buttonThreeHidden && (h("udp-button", { key: '91cc57acd1d201f7828c8c34ec399ba25715a054', variant: 'text', disabled: this.disableThree, onClick: () => this.actionThree() }, this.labelThree)), !this.buttonOneHidden && (h("udp-button", { key: 'b6672709b4432743f0ac7ba740cea49ccd085dfe', variant: 'contained', disabled: this.disableOne, onClick: () => this.actionOne(), loading: !!this.progress }, this.labelOne))))));
     }
     get hostEl() { return getElement(this); }
     static get watchers() { return {
@@ -1245,11 +1245,11 @@ const UdpListRenderer = class {
     render() {
         const showPrimaryText = this.primaryText || this.hasPrimaryTextSlot;
         const showSecondaryText = this.secondaryText || this.hasSecondaryTextSlot;
-        return (h(Host, { key: 'a7fdc84e454e4415e41b494b874c5cd58093781b' }, h("div", { key: 'b708146bf6886d5822cc3784c1b1dde0a41531a8', class: {
+        return (h(Host, { key: '41eb6d0141ee4439623ec120ee274bb787f1bfee' }, h("div", { key: '2b210540274910e64292519574d5bb67a770bdf5', class: {
                 'list-item': true,
                 'clickable': this.clickable,
                 'variant-compact': this.variant === 'compact',
-            }, onClick: this.handleClick, onKeyPress: this.handleKeyPress, role: this.clickable ? 'button' : undefined, tabindex: this.clickable ? 0 : -1 }, this.iconName && (h("div", { key: 'bf2122fa1d51b1ad1e4d1248b863b2971459a67e', class: "avatar-container" }, h("udp-avatar", { key: '32d1956f5cf2e506bfcd7f5c85862349d1b394d2', iconName: this.iconName, variant: this.avatarVariant, color: this.avatarBackgroundColor }))), h("div", { key: '238cf5b9acc5504e56d8ed7c652e00f94ff75716', class: "text-container" }, showPrimaryText && (h("div", { key: 'ae15ea2fcd67fbd01f9eaf997acc5a21089cd6d2', class: "primary-text" }, h("slot", { key: '1a629990a4721c7281b5f1dd1c3db680b29a3e72', name: "primary-text" }, h("unity-typography", { key: 'ac76e535367c2a00ac1ae5ffd0fb08671a37c61f', variant: "body" }, this.primaryText)))), showSecondaryText && (h("div", { key: 'a48a9103abd12c8a2c5cdd36f5bdf720ebd9731f', class: "secondary-text" }, h("slot", { key: '1ac630c59426e4b6ecb9c3b891d9731cbcff3384', name: "secondary-text" }, h("unity-typography", { key: '6da8fd733530cddb27e5588ecdfa6f4d288d9c50', variant: "caption-text", color: "textSecondary" }, this.secondaryText))))), this.hasStatusChipSlot && (h("div", { key: '3987c5c8b83c77990706d376714444aae78ae7b9', class: "status-chip-container" }, h("slot", { key: '485ef815359ed98fd4269e1748ab25fd67f2119c', name: "status-chip" }))), this.hasActionsSlot && (h("div", { key: '3c34b44562e3077eba9e824e1a581aabb6662684', class: "actions-container" }, h("slot", { key: '011c682eb2fa5c1e7f730b028252489f24056e5c', name: "actions" }))))));
+            }, onClick: this.handleClick, onKeyPress: this.handleKeyPress, role: this.clickable ? 'button' : undefined, tabindex: this.clickable ? 0 : -1 }, this.iconName && (h("div", { key: '913f2b8c672493d7316e64ca3c26cea222b0281d', class: "avatar-container" }, h("udp-avatar", { key: '114fa2f5a4d3395aad73fff0fa6d239c7eecaf2a', iconName: this.iconName, variant: this.avatarVariant, color: this.avatarBackgroundColor }))), h("div", { key: 'bf27da4ea3959f2330e910ccf4964519941e7336', class: "text-container" }, showPrimaryText && (h("div", { key: '9f644311da4b3f144f2afc9f5a57f17e6c6b84a3', class: "primary-text" }, h("slot", { key: 'd7590409f59e534c5a057942ce30f9512e1a7b94', name: "primary-text" }, h("unity-typography", { key: 'a023f31b04cdc9c60514140d9f47681b2ab800d3', variant: "body" }, this.primaryText)))), showSecondaryText && (h("div", { key: '40f57bd6c501910e200d4cd145c9fed2a36d2fe8', class: "secondary-text" }, h("slot", { key: '62fbe0222b1d4866c61fe07a8d84d1567cbc4d56', name: "secondary-text" }, h("unity-typography", { key: 'e33b76e74015dd4e7176c06cdf84e8c40b3ba554', variant: "caption-text", color: "textSecondary" }, this.secondaryText))))), this.hasStatusChipSlot && (h("div", { key: '97542efce1a23b6e504cd541e41254e83da48baf', class: "status-chip-container" }, h("slot", { key: '432f5cc6a98b82c7ee53906dce053e95e097c588', name: "status-chip" }))), this.hasActionsSlot && (h("div", { key: '9e8065713ec74f83cd6bd7a00dac7c54c92355c0', class: "actions-container" }, h("slot", { key: '949296f60d37ed3cd5fdfc8c5cb39f8e38ef30f6', name: "actions" }))))));
     }
     get hostEl() { return getElement(this); }
 };

package/dist/esm/api-method-instance-grid.entry.js CHANGED Viewed

@@ -173,7 +173,7 @@ const ApiMethodInstanceGrid = class {
         this.getApiMethodInstanceData();
     }
     render() {
-        return (h("search-method-grid", { key: '8e3fb4dfef4bb0c63230e88205ccf31e9fb821c9', onGridReady: e => this.handleGridReady(e), gridFunctions: this.gridFunctions, gridOptions: this.gridOptions, gridHeaderConfig: this.gridHeaderConfig, gridId: this.gridId, entityName: this.entityName, gridHeight: this.gridHeight, searchMethodConfig: this.searchMethodConfig, gridApiCallback: this.gridApiCallback }));
+        return (h("search-method-grid", { key: '1d8da53919c04c8c2b29fc294b0f3f216dcbee56', onGridReady: e => this.handleGridReady(e), gridFunctions: this.gridFunctions, gridOptions: this.gridOptions, gridHeaderConfig: this.gridHeaderConfig, gridId: this.gridId, entityName: this.entityName, gridHeight: this.gridHeight, searchMethodConfig: this.searchMethodConfig, gridApiCallback: this.gridApiCallback }));
     }
     static get watchers() { return {
         "apiMethodInstanceData": ["createColumnDefs", "updateSearchMethodConfig"],

package/dist/esm/check-box.entry.js CHANGED Viewed

@@ -95,13 +95,13 @@ const Checkbox = class {
      */
     render() {
         const isError = !!this.errorMessage;
-        return (h(Host, { key: '1b19d7ccee69d41e46403cb411ceea2e4fb6f763', class: {
+        return (h(Host, { key: '35ce165e99a01b2cfad1bdb370f08be53c3b107f', class: {
                 'udp-input': true,
                 'udp-input--error': isError,
                 'udp-input--disabled': this.disabled,
                 'udp-input--required': this.required,
                 'udp-input--checked': this.internalChecked
-            }, "aria-invalid": isError ? 'true' : 'false', "aria-required": this.required ? 'true' : 'false' }, h("div", { key: 'aa94500be1431e4ebed9d3093626a9d72bb7a44d', class: "checkbox-container" }, h("input", { key: '16f2c2c5b1c79102a499ce0c91c4c4fbbb2fce6f', type: "checkbox", checked: this.internalChecked, onChange: this.handleChange, id: this.id, name: this.name, disabled: this.disabled, required: this.required }), this.label && h("label", { key: '7119c395bd36ff76d6d45ff03523f6002cabc4dc', htmlFor: this.id }, this.label), this.errorMessage && h("div", { key: 'ef7d59c2816e281c6f479d00d5bbd5a9cc3b3d07', class: "error-message" }, this.errorMessage))));
+            }, "aria-invalid": isError ? 'true' : 'false', "aria-required": this.required ? 'true' : 'false' }, h("div", { key: 'ffe57d475dbe7fd4941e548b278e5d3c4358e3ef', class: "checkbox-container" }, h("input", { key: 'c9599f48b9c95cf0533b4bd34b0bf9a21519f58d', type: "checkbox", checked: this.internalChecked, onChange: this.handleChange, id: this.id, name: this.name, disabled: this.disabled, required: this.required }), this.label && h("label", { key: '5645ddfd96f922401f73289323bd4d56a9d5ef5a', htmlFor: this.id }, this.label), this.errorMessage && h("div", { key: '4e38d91bfaed14e571d0deec40be7ab4cfa94da9', class: "error-message" }, this.errorMessage))));
     }
     static get watchers() { return {
         "error": ["updateError"],

package/dist/esm/chip-section.entry.js CHANGED Viewed

@@ -98,13 +98,13 @@ const ChipSection = class {
     }
     render() {
         console.log("Rendering ChipSection", this.visibleFilterChips);
-        return (h("div", { key: '567b5925fcedb62ecf4f0435b7a564da46e21465', class: "wrapper", id: "chipSectionContainer" }, h("div", { key: '41c9dfc9f98d2d2d42261d1a28a6755faea2def9', class: "chipHolder" }, h("div", { key: 'aef7cada00ecb04c01a80967a07871ced2f8fe29', id: "viewChipsContainer" }, this.viewChips.map((chip, index) => (h("stencil-chip", { onOnDelete: () => this.handleDelete('view', index), text: chip.label, class: "viewChip" })))), h("udp-dynamic-container-with-menu", { key: 'c82f515501ffdc2e33e4b147f370c3e88302afbb', id: "filterChipsContainer", menuItems: this.menuItems }, this.selectedFilterChip && (h("stencil-chip", { key: '760c303eb392690316ea61e466ea70f2e3c32c6c', onOnDelete: this.handleFilterChipUntoggle, text: this.selectedFilterChip.label, class: "viewChip" })), console.log('filtering here...', this.filterChips), this.filterChips.map((chip) => {
+        return (h("div", { key: '9a1b452a244c22fdb6566acb2972f42bdddb5621', class: "wrapper", id: "chipSectionContainer" }, h("div", { key: '0c03e15b9ce04d0da54ee83a9e56dbcab0553580', class: "chipHolder" }, h("div", { key: '9a55382935f37510948d8d978b1171509f05cba2', id: "viewChipsContainer" }, this.viewChips.map((chip, index) => (h("stencil-chip", { onOnDelete: () => this.handleDelete('view', index), text: chip.label, class: "viewChip" })))), h("udp-dynamic-container-with-menu", { key: '13b4e97701d984df535637f10302a96bfca4ee6f', id: "filterChipsContainer", menuItems: this.menuItems }, this.selectedFilterChip && (h("stencil-chip", { key: 'f0c6749140c629a2c864a0341818c8ca632df701', onOnDelete: this.handleFilterChipUntoggle, text: this.selectedFilterChip.label, class: "viewChip" })), console.log('filtering here...', this.filterChips), this.filterChips.map((chip) => {
             if (this.selectedFilterChip && chip.id === this.selectedFilterChip.id) {
                 console.log('returning null...');
                 return null;
             }
             return (h("stencil-chip", { text: `${chip.label} ${chip.value}`, class: "filterChip", onClick: () => this.handleFilterChipToggle(chip) }));
-        })), h("div", { key: '3651cb76022e5b363edd49428df66638114b52dc', id: "additionalFilterChipsContainer" }, this.additionalFilterChips.map((chip, index) => (h("stencil-chip", { onOnDelete: () => this.handleDelete('additionalFilter', index), text: chip.label, class: "additionalFilterChip" })))), !this.hideKpiSection && (h("div", { key: '931110b82bf127b6a571a8b312e4d21a691423ef', class: "KPI", id: "kpiContainer" }, this.kpiValues.slice(0, this.maxKPIsDisplayed).map((kpi) => (h("div", { class: "kpiItem" }, h("span", { class: "kpiLabel" }, this.abbreviateLabel(kpi.label) || kpi.label), h("span", { class: "kpiValue" }, this.abbrNum(kpi.value, 1))))))))));
+        })), h("div", { key: '26e8ed21c6d420b82efd005c8ebbcff532674dae', id: "additionalFilterChipsContainer" }, this.additionalFilterChips.map((chip, index) => (h("stencil-chip", { onOnDelete: () => this.handleDelete('additionalFilter', index), text: chip.label, class: "additionalFilterChip" })))), !this.hideKpiSection && (h("div", { key: '79450b2d263970db47b70a7d4ec0a28c3522d2a1', class: "KPI", id: "kpiContainer" }, this.kpiValues.slice(0, this.maxKPIsDisplayed).map((kpi) => (h("div", { class: "kpiItem" }, h("span", { class: "kpiLabel" }, this.abbreviateLabel(kpi.label) || kpi.label), h("span", { class: "kpiValue" }, this.abbrNum(kpi.value, 1))))))))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/client-side-grid_2.entry.js CHANGED Viewed

@@ -108,7 +108,7 @@ const ClientSideGrid = class {
         this.clientSideConfig = Object.assign(Object.assign({}, this.gridOptions), { rowModelType: 'clientSide' });
     }
     render() {
-        return (h("ag-grid-base", { key: 'f98ef8ab8467a6167650ece8054f8064c3ded664', columnDefs: this.columnDefs, gridOptions: this.clientSideConfig, headerConfig: this.gridHeaderConfig, onGridReady: e => this.handleGridReady(e), gridFunctions: this.gridFunctions, gridId: this.gridId, gridApiCallback: this.gridApiCallback }));
+        return (h("ag-grid-base", { key: '698ddb81a86b3fa53050202f8ee4b42fc5840329', columnDefs: this.columnDefs, gridOptions: this.clientSideConfig, headerConfig: this.gridHeaderConfig, onGridReady: e => this.handleGridReady(e), gridFunctions: this.gridFunctions, gridId: this.gridId, gridApiCallback: this.gridApiCallback }));
     }
     static get watchers() { return {
         "rowData": ["updateRowData"]
@@ -128,12 +128,12 @@ const ResourceTimelinePrimaryBar = class {
     }
     render() {
         var _a, _b, _c, _d, _e, _f, _g, _h;
-        return (h("div", { key: 'e833fd32de19aec8b8409849ad251222991ec584', class: "header-bar" }, h("div", { key: 'fb33e6f247071a91f6f12663e9429f060b160783', class: "title-section" }, this.gridBarTitle || this.gridBarTitle === '' ? (h("unity-typography", { variant: "body1", bold: true }, this.gridBarTitle, ' ')) : (h("udp-skeleton-loading", { width: "200px" })), h("div", { key: '27658219740c3d09a860e5add1e7b9b9d8352d38', class: "subtitle" }, this.subTitle || this.subTitle === '' ? (h("unity-typography", { variant: "body1" }, this.subTitle, " ")) : (h("udp-skeleton-loading", { width: "200px" })), h("div", { key: 'eed427fbafcd94c59297851cb94e9c48afaa7e28', class: "subtitle-status" }, this.subtitleStatus && (h("udp-chip", { key: 'a37c003646fecffa65e355303daf11828e2df62c', variant: "outlined", size: "small", label: this.subtitleStatus, color: this.subtitleStatusMappingClasses[this.subtitleStatus] })), this.showLockedIcon && (h("udp-icon-button", { key: 'dbb077ef7541b6e19d52ad5a4ece1d65d30e906a', icon: getIconFromName('lock'), variant: "outlined", size: "x-small", disabled: true }))))), h("div", { key: 'aa2076968454f8ac782ec9a2d379c6ce6f5fd0d9', class: "button-section" }, h("udp-icon-button", { key: 'b56f9a0ec21be3aa96f0cb486aca2c566a3f659e', class: {
+        return (h("div", { key: '2a66de4fa2a5788af431094dad4ed1d738707235', class: "header-bar" }, h("div", { key: 'c26898574eb9bd8d9410aef63a369a3cde6afa80', class: "title-section" }, this.gridBarTitle || this.gridBarTitle === '' ? (h("unity-typography", { variant: "body1", bold: true }, this.gridBarTitle, ' ')) : (h("udp-skeleton-loading", { width: "200px" })), h("div", { key: 'd178f920fb58eb6e6850e91790657d619a9cdd11', class: "subtitle" }, this.subTitle || this.subTitle === '' ? (h("unity-typography", { variant: "body1" }, this.subTitle, " ")) : (h("udp-skeleton-loading", { width: "200px" })), h("div", { key: 'e8f598c0ca91d62e7326a227479e52c50fc123b1', class: "subtitle-status" }, this.subtitleStatus && (h("udp-chip", { key: '74bfd5f3ecf4966896f443bc702068f913235526', variant: "outlined", size: "small", label: this.subtitleStatus, color: this.subtitleStatusMappingClasses[this.subtitleStatus] })), this.showLockedIcon && (h("udp-icon-button", { key: '98b2d80ceacca1130ae6b99f326613b582144ca9', icon: getIconFromName('lock'), variant: "outlined", size: "x-small", disabled: true }))))), h("div", { key: '5524d1bd00864118ee4d45ebb05226f301e8cb4f', class: "button-section" }, h("udp-icon-button", { key: 'e2d0c6cd6bc38f61d86ee122a32cdf171b92d3c1', class: {
                 'settings-button': true,
                 'is-open': this.isMenuOpen,
             }, onClick: this.toggleSettingsMenu, ref: (el) => {
                 this.menuAnchorEl = el ? el : undefined;
-            }, icon: getIconFromName('settings'), variant: 'outlined', size: "small", color: "inherit" }), h("udp-menu", { key: 'a48459399724333efdfa72ff1dd62eddec9ab2e7', open: this.isMenuOpen, anchor: this.menuAnchorEl, handleClose: () => (this.isMenuOpen = false) }, h("udp-menu-item", { key: 'a35fdb3c767535ff8a6e3ee6bd83656f0670f8b9', label: "Expand Groups", onItemClick: this.expandAll }), h("udp-menu-item", { key: '5b6ebd79a84022644b8eb8fb7627301b236d8e1a', label: "Collapse Groups", onItemClick: this.collapseAll })), this.clickBackward && (h("div", { key: '83cdda300ac910486e19f1bdab1a81c92ca60afc', class: "date-navigation" }, this.clickBackward && (h("udp-icon-button", { key: '3ac9e797490b209ec668f4efaf9257d7a0bf1333', tooltip: "Previous period", icon: ChevronLeft16, onClick: this.clickBackward, size: "small", color: "inherit", disabled: this.disableHeaderActions })), this.clickToday && (h("udp-button", { key: 'f48e3a752414f6b5121b2bc21928dae309dfc03b', onClick: this.clickToday, size: "small", color: "inherit", disabled: this.disableHeaderActions }, "Today")), this.clickForward && (h("udp-icon-button", { key: '75a395dd9b53169d3c65e4d78da318e77cc6d78a', tooltip: "Next period", icon: ChevronRight24, onClick: this.clickForward, size: "small", color: "inherit", disabled: this.disableHeaderActions })))), ((_a = this.secondaryAction) === null || _a === void 0 ? void 0 : _a.onClick) && (h("udp-button", { key: '337fa812c70ac00ee93c729974e53cfd4eea6aae', disabled: ((_b = this.secondaryAction) === null || _b === void 0 ? void 0 : _b.disabled) || this.disableHeaderActions, variant: "outlined", color: "secondary", onButtonClick: this.secondaryAction.onClick, startIcon: h("udp-icon", { iconName: (_c = this.secondaryAction) === null || _c === void 0 ? void 0 : _c.iconName, color: 'inherit' }), size: "medium" }, (_d = this.secondaryAction) === null || _d === void 0 ? void 0 : _d.label)), ((_e = this.primaryAction) === null || _e === void 0 ? void 0 : _e.onClick) && (h("udp-button", { key: 'e765055e5426c4e15e2440d3e45e3ced77acfb0e', disabled: ((_f = this.primaryAction) === null || _f === void 0 ? void 0 : _f.disabled) || this.disableHeaderActions, startIcon: h("udp-icon", { iconName: (_g = this.primaryAction) === null || _g === void 0 ? void 0 : _g.iconName, color: 'inherit' }), variant: "contained", onButtonClick: this.primaryAction.onClick, color: "secondary" }, (_h = this.primaryAction) === null || _h === void 0 ? void 0 : _h.label)))));
+            }, icon: getIconFromName('settings'), variant: 'outlined', size: "small", color: "inherit" }), h("udp-menu", { key: '7a04742387e28f0a78d6539ff0b03c4985137229', open: this.isMenuOpen, anchor: this.menuAnchorEl, handleClose: () => (this.isMenuOpen = false) }, h("udp-menu-item", { key: '3acb2cc1a9421d1e582e2ee3ff9d2c8c5374a4f7', label: "Expand Groups", onItemClick: this.expandAll }), h("udp-menu-item", { key: 'f1fbb4cfa270ced88a9f1c3b09fb892b5743b1c2', label: "Collapse Groups", onItemClick: this.collapseAll })), this.clickBackward && (h("div", { key: '8393e52e0494161fe016eb4bfc4f50f75745f703', class: "date-navigation" }, this.clickBackward && (h("udp-icon-button", { key: '43d6d92184f28d5ae16658970eb0668526e3b809', tooltip: "Previous period", icon: ChevronLeft16, onClick: this.clickBackward, size: "small", color: "inherit", disabled: this.disableHeaderActions })), this.clickToday && (h("udp-button", { key: '86e85c4af0d74d1d1573195be66187697313c8e8', onClick: this.clickToday, size: "small", color: "inherit", disabled: this.disableHeaderActions }, "Today")), this.clickForward && (h("udp-icon-button", { key: '9b009045cf9be2d7b8bc11e674fdc9134baae28b', tooltip: "Next period", icon: ChevronRight24, onClick: this.clickForward, size: "small", color: "inherit", disabled: this.disableHeaderActions })))), ((_a = this.secondaryAction) === null || _a === void 0 ? void 0 : _a.onClick) && (h("udp-button", { key: '9320445c97b12fa6403d33765a76ad4e54baa567', disabled: ((_b = this.secondaryAction) === null || _b === void 0 ? void 0 : _b.disabled) || this.disableHeaderActions, variant: "outlined", color: "secondary", onButtonClick: this.secondaryAction.onClick, startIcon: h("udp-icon", { iconName: (_c = this.secondaryAction) === null || _c === void 0 ? void 0 : _c.iconName, color: 'inherit' }), size: "medium" }, (_d = this.secondaryAction) === null || _d === void 0 ? void 0 : _d.label)), ((_e = this.primaryAction) === null || _e === void 0 ? void 0 : _e.onClick) && (h("udp-button", { key: '47862c1898db0b9c979eaaa6dbb2a0a4c750bbe2', disabled: ((_f = this.primaryAction) === null || _f === void 0 ? void 0 : _f.disabled) || this.disableHeaderActions, startIcon: h("udp-icon", { iconName: (_g = this.primaryAction) === null || _g === void 0 ? void 0 : _g.iconName, color: 'inherit' }), variant: "contained", onButtonClick: this.primaryAction.onClick, color: "secondary" }, (_h = this.primaryAction) === null || _h === void 0 ? void 0 : _h.label)))));
     }
 };
 ResourceTimelinePrimaryBar.style = resourceTimelinePrimaryBarCss;

package/dist/esm/color-preview.entry.js CHANGED Viewed

@@ -16,7 +16,7 @@ const ColorPreview = class {
         return (h("div", { class: "color-section" }, h("unity-typography", { variant: "h4" }, title), h("div", { class: "color-grid" }, this.renderColorBox(`--${prefix}-color-main`, `--${prefix}-contrast-text`), this.renderColorBox(`--${prefix}-color-dark`, `--${prefix}-contrast-text`), this.renderColorBox(`--${prefix}-color-light`, `--${prefix}-contrast-text`), this.renderColorBox(`--${prefix}-color-hint`, `--${prefix}-contrast-text`))));
     }
     render() {
-        return (h("div", { key: '98a80f4e8502dd50d6f8f76a74196d1306456ddb', class: "container" }, h("unity-typography", { key: '70dfefd7b9032e0bea9ac6bd1c38e737ece1e034', variant: "h2" }, "Unity Theme"), h("div", { key: 'cdd7efeb53f12d6363e1ff391708eaeeb2cd89ab', class: "theme-section" }, h("div", { key: 'c698420ae9fb2fa3ca1067aa12f388ddccf5a566', class: "unity-theme" }, this.renderColorSection('Primary Colors', 'primary'), this.renderColorSection('Secondary Colors', 'secondary'))), h("unity-typography", { key: 'c2cadbc40e7a4d1af6395ee98c2021af275e5187', variant: "h2" }, "SAP Theme"), h("div", { key: 'ce4312afaedc584183c85e356dad6c050bd13164', class: "theme-section" }, h("div", { key: '7460ef49884a7dd3a7c4e5e4c46dbd65d367b44a', class: "sap-theme" }, this.renderColorSection('Primary Colors', 'primary'), this.renderColorSection('Secondary Colors', 'secondary'))), h("unity-typography", { key: '110cdc21e09f0089365989ba4f7af4a38225f7cb', variant: "h2" }, "Status Colors"), h("div", { key: '15b1b26a27b44cef9da3de647dfed23c5744300f', class: "status-section" }, this.renderStatusSection('Success', 'success'), this.renderStatusSection('Error', 'error'), this.renderStatusSection('Warning', 'warning'), this.renderStatusSection('Info', 'info'), this.renderStatusSection('Note', 'note'))));
+        return (h("div", { key: 'de905a4b5da8d7e06bafc3e1da7ed57548c29beb', class: "container" }, h("unity-typography", { key: '635febd73647ff8ccfd2655750cca80a6a038ee6', variant: "h2" }, "Unity Theme"), h("div", { key: 'cd50d5641d3af9b9430c490b565b1a6de9cd4d71', class: "theme-section" }, h("div", { key: '74ca31a3e63f5342dadc50f3be4f0f4682b6c2aa', class: "unity-theme" }, this.renderColorSection('Primary Colors', 'primary'), this.renderColorSection('Secondary Colors', 'secondary'))), h("unity-typography", { key: '4df9f7aff314abaef0cee198c400fd8527780566', variant: "h2" }, "SAP Theme"), h("div", { key: '7e3185d9f54d46618711fa522a28f44e936e835d', class: "theme-section" }, h("div", { key: 'e9fcc854930e8645bd725d34e1f354bbaf4dc78f', class: "sap-theme" }, this.renderColorSection('Primary Colors', 'primary'), this.renderColorSection('Secondary Colors', 'secondary'))), h("unity-typography", { key: 'd3573c966fe9ddd40f9af2f1ed6a3d6c61abf962', variant: "h2" }, "Status Colors"), h("div", { key: '5330d30d62ebbd57886015e8b27f542d76a402fe', class: "status-section" }, this.renderStatusSection('Success', 'success'), this.renderStatusSection('Error', 'error'), this.renderStatusSection('Warning', 'warning'), this.renderStatusSection('Info', 'info'), this.renderStatusSection('Note', 'note'))));
     }
 };
 ColorPreview.style = colorPreviewCss;

package/dist/esm/date-time-renderer_6.entry.js CHANGED Viewed

@@ -168,13 +168,13 @@ const FileUploadRenderer = class {
     }
     render() {
         var _a, _b;
-        return (h("div", { key: '7bae103e4f3c903e235c531232e8e60550116872', class: "file-upload-input-container" }, h("div", { key: 'a94a3b4c78fa9dff01f72afa3c4f7347eae4ccc5' }, h("stencil-toggle", { key: '49074098410e770f2b45b461a3e3e83ed8dd808e', label: "Hide Drag And Drop", disabled: this.isViewOnly, checked: !!((_a = this.question.fieldProperties) === null || _a === void 0 ? void 0 : _a.hideDragAndDrop), onToggledChange: () => {
+        return (h("div", { key: 'e2731af080ba720c9ef099659ae3e9fd93d65faf', class: "file-upload-input-container" }, h("div", { key: '1aa8b9814bf572b110a03c52a564f490e35b9a85' }, h("stencil-toggle", { key: '35594baad0a698ad53bd106b5376f0ea742a59ac', label: "Hide Drag And Drop", disabled: this.isViewOnly, checked: !!((_a = this.question.fieldProperties) === null || _a === void 0 ? void 0 : _a.hideDragAndDrop), onToggledChange: () => {
                 if (this.isViewOnly)
                     return;
                 const handler = this.getHandler(this.question.fieldTypeId, 'handleFieldPropertyBooleanToggle');
                 const updated = handler(this.formSectionsDraft, this.sIndex, this.qIndex, 'hideDragAndDrop');
                 this.onFormSectionsDraftChange(updated);
-            }, labelPosition: "right" })), h("div", { key: 'dd4c05c0024585e84f1428f74381370344b67cfa' }, h("stencil-toggle", { key: '3815653d5f5af22d07b0df67c23cb9ab3754f68b', label: "Hide Button", disabled: this.isViewOnly, checked: !!((_b = this.question.fieldProperties) === null || _b === void 0 ? void 0 : _b.hideButton), onToggledChange: () => {
+            }, labelPosition: "right" })), h("div", { key: '4a66f75eb851e666f0f8fcef7b12d2943b0e809d' }, h("stencil-toggle", { key: '01da84e7d49d5a0443c6b7803465c25d33fc1407', label: "Hide Button", disabled: this.isViewOnly, checked: !!((_b = this.question.fieldProperties) === null || _b === void 0 ? void 0 : _b.hideButton), onToggledChange: () => {
                 if (this.isViewOnly)
                     return;
                 const handler = this.getHandler(this.question.fieldTypeId, 'handleFieldPropertyBooleanToggle');
@@ -193,16 +193,16 @@ const ListOptionsRenderer = class {
     }
     render() {
         var _a, _b, _c;
-        return (h(Host, { key: '88da9b03e4f8727bee83e9e47594a9b0316dce16' }, h("div", { key: 'be5648d79d761f31cc48bd6e396d32971a928511', class: "question-item-options-list-container" }, h("stencil-toggle", { key: 'c9485efb69819db4662dd3b0de27f5d0a1fc0676', label: "Use Lookup Options", disabled: this.isViewOnly, checked: 'lookupId' in this.question.fieldProperties, labelPosition: "right", onToggledChange: () => {
+        return (h(Host, { key: '8dbb0c525b3862b708dd8696eaafc99b324f5a06' }, h("div", { key: 'd341bdff2838fcbfadd826b5f9eb11bd470ca4e5', class: "question-item-options-list-container" }, h("stencil-toggle", { key: 'd7a486294420828851cfc0fc79378cad9b8a279a', label: "Use Lookup Options", disabled: this.isViewOnly, checked: 'lookupId' in this.question.fieldProperties, labelPosition: "right", onToggledChange: () => {
                 const handler = this.getHandler(this.question.fieldTypeId, 'handleFieldPropertyToggleManualOrLookupOptions');
                 const updated = handler(this.formSectionsDraft, this.sIndex, this.qIndex);
                 this.onFormSectionsDraftChange(updated);
                 console.log(this.lookupOptions);
-            } }), 'lookupId' in this.question.fieldProperties && (h("div", { key: '2c2a85f7d53a3688ae75fcfc0c16bd2342c346f1' }, h("udp-selector", { label: "Lookup Source", key: "lookup-selector", initialValue: ((_a = this.question.fieldProperties) === null || _a === void 0 ? void 0 : _a.lookupId) || '', options: this.lookupOptions, disabled: this.isViewOnly, required: true, onChange: (e) => {
+            } }), 'lookupId' in this.question.fieldProperties && (h("div", { key: '6e33b7772c80a37cc7bc2c2822d3ec73ad6fe78d' }, h("udp-selector", { label: "Lookup Source", key: "lookup-selector", initialValue: ((_a = this.question.fieldProperties) === null || _a === void 0 ? void 0 : _a.lookupId) || '', options: this.lookupOptions, disabled: this.isViewOnly, required: true, onChange: (e) => {
                 const handler = this.getHandler(this.question.fieldTypeId, 'handleFieldPropertyLookupChange');
                 const updated = handler(e.detail, this.formSectionsDraft, this.sIndex, this.qIndex);
                 this.onFormSectionsDraftChange(updated);
-            } }))), 'items' in this.question.fieldProperties && (h("div", { key: '2680419fe88ec8c795b80f14cf2758f521b505af' }, h("div", { key: 'fddd398a9f53b4d22914c72269104c2f46e8dc5b', class: "list-options-header" }, h("unity-typography", { key: '0039ba09b09f0d729adedca34685c40b9b550942', variant: "h6" }, "Configure Select Options"), !this.isViewOnly && 'items' in this.question.fieldProperties && (h("udp-button", { key: 'e86709f8b34a203a0747fe3adaa87106ca57c960', variant: "text", onClick: () => {
+            } }))), 'items' in this.question.fieldProperties && (h("div", { key: 'fc5ccae0b8e426da2c6f4ebab5130b857bddd68b' }, h("div", { key: 'dfddc472fc1b4f16e5cde9b05503472e28edfd4c', class: "list-options-header" }, h("unity-typography", { key: 'c7e50f1718771723c8a4e8870069c6956d9d8ed3', variant: "h6" }, "Configure Select Options"), !this.isViewOnly && 'items' in this.question.fieldProperties && (h("udp-button", { key: '6e60334e97d3536131763dd3ed5899cd290e1210', variant: "text", onClick: () => {
                 const handler = this.getHandler(this.question.fieldTypeId, 'handleFieldPropertyAddListItem');
                 const updated = handler(this.formSectionsDraft, this.sIndex, this.qIndex, '', '');
                 this.onFormSectionsDraftChange(updated);
@@ -281,7 +281,7 @@ const SignatureRenderer = class {
     }
     render() {
         var _a;
-        return (h("div", { key: '2d95e17d08bf8acf5038df33eb237b46d7f6a657', class: "signature-input-container" }, h("div", { key: 'c86a5cb610f475bd5fb562d357f17c6762a1790a' }, h("stencil-toggle", { key: 'd5c2775d4e7b97992b71b4450cf06d21855b509f', label: "Include Location", disabled: this.isViewOnly, checked: !!((_a = this.question.fieldProperties) === null || _a === void 0 ? void 0 : _a.includeLocation), onToggledChange: () => {
+        return (h("div", { key: '8adad99da3fc4ce5619aefe9241611b18f438f00', class: "signature-input-container" }, h("div", { key: 'f8560dbdaf0ac00d36e47f25e2cbdf96ec22ba5d' }, h("stencil-toggle", { key: '3ef497fd72c45913e7525fcbc950006841eeecc9', label: "Include Location", disabled: this.isViewOnly, checked: !!((_a = this.question.fieldProperties) === null || _a === void 0 ? void 0 : _a.includeLocation), onToggledChange: () => {
                 if (this.isViewOnly)
                     return;
                 const handler = this.getHandler(this.question.fieldTypeId, 'handleFieldPropertyBooleanToggle');
@@ -300,12 +300,12 @@ const TextInputRenderer = class {
     }
     render() {
         var _a, _b;
-        return (h("div", { key: '7b7704ab1b0a0a03ec7ac4610771597bb9df1270', class: "question-item-text-input-container" }, h("div", { key: '9a891cdbe9bab555b4a0d74fbc85d38df939117c' }, h("numeric-field", { key: '7df5db3f96241627c05d09401f044ed9919ee911', label: "Min Character Length", value: (_a = this.question.fieldProperties.minCharacter) === null || _a === void 0 ? void 0 : _a.toString(), disabled: this.isViewOnly, onChange: e => {
+        return (h("div", { key: '6a0849eb03b2ea53cbd7cc63726b0df265c86804', class: "question-item-text-input-container" }, h("div", { key: '09ad4e05a1c0dc87b0ece7b6714225b9e6a83418' }, h("numeric-field", { key: '534601d103d860383bb71ca9b2010b9ad60361c2', label: "Min Character Length", value: (_a = this.question.fieldProperties.minCharacter) === null || _a === void 0 ? void 0 : _a.toString(), disabled: this.isViewOnly, onChange: e => {
                 const handler = this.getHandler(this.question.fieldTypeId, 'handleFieldPropertyMinMaxCharacter');
                 const mockEvent = { target: { value: e.detail } };
                 const updated = handler(mockEvent, this.formSectionsDraft, this.sIndex, this.qIndex, 'minCharacter');
                 this.onFormSectionsDraftChange(updated);
-            } })), h("div", { key: '62d6ee97fc6e04f2d1d10169e883dfa03bd8229c' }, h("numeric-field", { key: '87f43539d6810cde970cb4ad1d416564f907487e', label: "Max Character Length", value: (_b = this.question.fieldProperties.maxCharacter) === null || _b === void 0 ? void 0 : _b.toString(), disabled: this.isViewOnly, onChange: e => {
+            } })), h("div", { key: '6129da73ddd6fbc65db5f334f651510b9ef2fda5' }, h("numeric-field", { key: '494a619533c2bae64fa30dcb755100050a400015', label: "Max Character Length", value: (_b = this.question.fieldProperties.maxCharacter) === null || _b === void 0 ? void 0 : _b.toString(), disabled: this.isViewOnly, onChange: e => {
                 const handler = this.getHandler(this.question.fieldTypeId, 'handleFieldPropertyMinMaxCharacter');
                 const mockEvent = { target: { value: e.detail } };
                 const updated = handler(mockEvent, this.formSectionsDraft, this.sIndex, this.qIndex, 'maxCharacter');

package/dist/esm/entity-maintenance-grid.entry.js CHANGED Viewed

@@ -38,7 +38,7 @@ const EntityMaintenanceGrid = class {
         this.getPromotedMethods();
     }
     render() {
-        return (h("api-method-grid", { key: 'c82234be766aa7de23694055daf01e63d688f32f', onGridReady: e => this.handleGridReady(e), gridHeaderConfig: this.gridHeaderConfig }));
+        return (h("api-method-grid", { key: '1abb80d39f7ca1aa4bda3231fb5cadbbfbc3b511', onGridReady: e => this.handleGridReady(e), gridHeaderConfig: this.gridHeaderConfig }));
     }
 };

package/dist/esm/feature-details-card_2.entry.js CHANGED Viewed

@@ -187,19 +187,19 @@ const FeatureDetailsCard = class {
     render() {
         var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
         const currentMessageIcon = (_a = this.messageIcon) !== null && _a !== void 0 ? _a : this.getDefaultMessageIcon();
-        return (h("div", { key: '0f48ef1f064a7716ffb4ec27d8e77ddae408ea4e', class: "card-wrapper", style: { width: (_b = this.width) !== null && _b !== void 0 ? _b : '100%' } }, this.showAdornment && this.status && (h("div", { key: '9164d74a21825455b5ce1b0f2c1faf51ae9fd0d6', class: "adornment" }, h("udp-adornment", { key: 'd118ef020ff45b8cff1f1e5aaa0bf40a62b47670', status: (_c = this.status) !== null && _c !== void 0 ? _c : 'info' }))), h("div", { key: '8d90a41f5746d178f8eed681aaff6280de22e7fb', class: "content-wrapper" }, h("div", { key: 'b6f7270300a2c2a576fc3596c13c18e1f84f9ce4', class: "header-wrapper", style: { backgroundColor: this.getHeaderBackgroundColor() } }, h("div", { key: '79f1b6cae1fe69126ab99bc988d97b9221ebc9b4', class: "title-wrapper" }, h("stencil-icon-button", { key: 'f1dc3606a00577bfa270dfc2bf74bdd8f96ed95e', onClick: this.onClose, icon: Close24, tooltip: "Close", noBackground: true }), h("unity-typography", { key: '30dfa7fe22120433bbe02affa8f75bce0b3612b2', variant: 'h6' }, this.title)), ((_d = this.moreIconActions) === null || _d === void 0 ? void 0 : _d.length) > 0 && (h("div", { key: '5a5368d74eb5e171697e3d03e3d167f02d7f2c66' }, h("div", { key: 'f4c1fe6b4da6bcec91d83f27d116d8cd1ab9770a', id: "moreHeaderIconButton1" }, h("stencil-icon-button", { key: '9e1b5310e1bf4dc402b4f29e25667dfe956e0f64', onClick: this.handleOnClickMoreIcon, icon: OverflowMenuVertical24, tooltip: "More", noBackground: true, buttonId: "moreHeaderIconButton" })), this.moreIconAnchor && (h("udp-pop-over", { key: 'd7e28b157beaab735cd880f6e3fe73ec93be8b31', anchorElement: this.moreIconAnchor, isOpen: this.showMoreHeaderPopover, popoverWidth: '200px', popoverMaxHeight: '300px', handleOnClose: this.handleClosePopover, container: this.popoverContainer }, h("div", { key: '0449f6aa16eeb67bac9ab2599e30a22677dc43c1', class: "menu" }, (_e = this.moreIconActions) === null || _e === void 0 ? void 0 : _e.map(action => {
+        return (h("div", { key: '9781ea11818aaa6eaae88eb0c6f4c0b43b5a99e5', class: "card-wrapper", style: { width: (_b = this.width) !== null && _b !== void 0 ? _b : '100%' } }, this.showAdornment && this.status && (h("div", { key: '209fc91b2d98c079102074dbd8a0c060c053b2d4', class: "adornment" }, h("udp-adornment", { key: '1c09dc89841fda0747ad70a04adf70e800fe6a83', status: (_c = this.status) !== null && _c !== void 0 ? _c : 'info' }))), h("div", { key: '9afa54bd54a12b5931d31fa4eeee7c2b7df6f30b', class: "content-wrapper" }, h("div", { key: '7c23194810bc7fc58a97f94eee8f9f2408e019b9', class: "header-wrapper", style: { backgroundColor: this.getHeaderBackgroundColor() } }, h("div", { key: 'bb4840f16d4e448a958bd41405e29415aa6a1612', class: "title-wrapper" }, h("stencil-icon-button", { key: 'b46623a2a8c65049725a1bca325b9a9cb4d94aaf', onClick: this.onClose, icon: Close24, tooltip: "Close", noBackground: true }), h("unity-typography", { key: 'db5d074812e16b98a688dabb0abc71542b4e30bb', variant: 'h6' }, this.title)), ((_d = this.moreIconActions) === null || _d === void 0 ? void 0 : _d.length) > 0 && (h("div", { key: '6bf4e8d3123f062c42f183af8a3f07ff72364b79' }, h("div", { key: '7885e3bb96bd2f3ced77600b56e2043bcbb83963', id: "moreHeaderIconButton1" }, h("stencil-icon-button", { key: '8bc4a4c8181b0e4e6870023b4b948eed253ef80f', onClick: this.handleOnClickMoreIcon, icon: OverflowMenuVertical24, tooltip: "More", noBackground: true, buttonId: "moreHeaderIconButton" })), this.moreIconAnchor && (h("udp-pop-over", { key: '376a5488530604b63cc13ef8f94dff86f06fc9c9', anchorElement: this.moreIconAnchor, isOpen: this.showMoreHeaderPopover, popoverWidth: '200px', popoverMaxHeight: '300px', handleOnClose: this.handleClosePopover, container: this.popoverContainer }, h("div", { key: '2016252e992ee3988d12d6c1158c48f6bb6f67d6', class: "menu" }, (_e = this.moreIconActions) === null || _e === void 0 ? void 0 : _e.map(action => {
             var _a;
             return (h("udp-menu-item", { label: action === null || action === void 0 ? void 0 : action.name, iconName: action === null || action === void 0 ? void 0 : action.iconName, handleOnClick: () => {
                     action.onClick(this.data);
                 }, disabled: (action === null || action === void 0 ? void 0 : action.checkDisabled) ? action === null || action === void 0 ? void 0 : action.checkDisabled(this.data) : (_a = action === null || action === void 0 ? void 0 : action.disabled) !== null && _a !== void 0 ? _a : false }));
-        }))))))), this.message && (h("div", { key: 'ce1ffc85e445542b5fc8c0585ab4c4597b9f7ffc', class: "message-wrapper", style: { backgroundColor: this.getMessageBackgroundColor() } }, !this.hideMessageIcon && (h("div", { key: 'd6b21e7b4386340382a0d14d05ebdcfd90ae82a1', class: "icon-message" }, h("udp-icon", { key: '7043ed6a01bc10803a2e053d4ecc556f5b7db573', iconName: currentMessageIcon }))), h("div", { key: '566fba8595867e4f33e2c6b06bfae4e0cee0ad0e', class: "message" }, h("unity-typography", { key: 'b4061afebe60a2aecba26f06607f892212978929' }, this.message)))), h("div", { key: '0a2f353d57524636c259b01df78cd3a5960fd034', class: "data-section" }, (_f = this.listData) === null || _f === void 0 ? void 0 : _f.map(({ subject, value }) => (h("div", { class: "data-row" }, h("div", { class: "key" }, h("unity-typography", { variant: 'data-display-three' }, `${subject}: `)), h("div", { class: "value" }, h("unity-typography", { variant: 'data-display-three' }, value)))))), h("div", { key: '6c87017e6ae56ccf64ab3e87e662988830aa2266', class: "options" }, this.enableViewFeature && this.data && (h("div", { key: 'bf9aead97dc27b42be7cfaf935d40370391ecd95', id: "viewFeatureOption" }, h("stencil-icon-button", { key: 'dbccb36cdd3bf46a4f976a64189ab0489e97fc12', tooltip: 'View', icon: getIconFromName('view'), buttonId: 'viewFeatureButton', onClick: () => this.handleViewFeature({
+        }))))))), this.message && (h("div", { key: 'f4e32de4e683d044decbfd69e391583f8ccb92db', class: "message-wrapper", style: { backgroundColor: this.getMessageBackgroundColor() } }, !this.hideMessageIcon && (h("div", { key: 'e06a6965667b324abaa9fd0d869174fa60dc2579', class: "icon-message" }, h("udp-icon", { key: '6980a16b88790e0455e387ac442ec7e8481468a3', iconName: currentMessageIcon }))), h("div", { key: '4293a6bdc84ac43b6f613809efdf6926b119291c', class: "message" }, h("unity-typography", { key: 'f84db35a63f7c504486d6d549fd0672c98037229' }, this.message)))), h("div", { key: '7251c146dd425b62d8f0659ffa825faa84e7b110', class: "data-section" }, (_f = this.listData) === null || _f === void 0 ? void 0 : _f.map(({ subject, value }) => (h("div", { class: "data-row" }, h("div", { class: "key" }, h("unity-typography", { variant: 'data-display-three' }, `${subject}: `)), h("div", { class: "value" }, h("unity-typography", { variant: 'data-display-three' }, value)))))), h("div", { key: '2df27e38d9092c04d6d4fa4428108b55f1b62f77', class: "options" }, this.enableViewFeature && this.data && (h("div", { key: 'b8c8364d7fd1a3e2442abea73db19ac5bff4b5fa', id: "viewFeatureOption" }, h("stencil-icon-button", { key: '31f87917589d61040ebb3e46b1ad630b31eeec34', tooltip: 'View', icon: getIconFromName('view'), buttonId: 'viewFeatureButton', onClick: () => this.handleViewFeature({
                 selectedFeature: this.data,
                 formattedSelectedFeature: this.listData,
-            }) }))), ((_g = this.primaryActions) === null || _g === void 0 ? void 0 : _g.length) > 0 && (h("div", { key: '00951c8e348acb7d887359ba78674f6fbd9cb478' }, h("div", { key: '41dff2c40a6532f9c49c6a1388c2146c23180054', class: "options" }, (_h = this.visiblePrimaryActions) === null || _h === void 0 ? void 0 :
+            }) }))), ((_g = this.primaryActions) === null || _g === void 0 ? void 0 : _g.length) > 0 && (h("div", { key: 'b1a1c7c4ea2e602eaaa983993e814fbd2de8d976' }, h("div", { key: '88d88f99f4b41d48e87ab7894e826d0043dbb5c4', class: "options" }, (_h = this.visiblePrimaryActions) === null || _h === void 0 ? void 0 :
             _h.map((action, index) => {
                 var _a, _b;
                 return (h("stencil-icon-button", { tooltip: action === null || action === void 0 ? void 0 : action.name, icon: getIconFromName(action === null || action === void 0 ? void 0 : action.iconName), buttonId: (_a = action === null || action === void 0 ? void 0 : action.id) !== null && _a !== void 0 ? _a : `primary-icon-action-${index}`, onClick: () => action.onClick(this.data), disabled: (action === null || action === void 0 ? void 0 : action.checkDisabled) ? action === null || action === void 0 ? void 0 : action.checkDisabled(this.data) : (_b = action === null || action === void 0 ? void 0 : action.disabled) !== null && _b !== void 0 ? _b : false }));
-            }), ((_j = this.overflowPrimaryActions) === null || _j === void 0 ? void 0 : _j.length) > 0 && (h("stencil-icon-button", { key: '4bb9bd45120c494f181299295c8757c98e1da65b', onClick: this.handleOnClickPrimaryAction, icon: OverflowMenuVertical24, tooltip: "More", noBackground: true, buttonId: "morePrimaryIconButton" }))), this.primaryActionAnchor && (h("udp-pop-over", { key: 'edb84a9d52ff94e336e2ee5360b9ef189fde34f7', anchorElement: this.primaryActionAnchor, isOpen: this.showPrimaryPopover, popoverWidth: '200px', popoverMaxHeight: '300px', handleOnClose: this.handleClosePopover, container: this.popoverContainer }, h("div", { key: 'b63a280d184467cb7f9f0dac5c80805c6fb6c20f', class: "menu" }, (_k = this.overflowPrimaryActions) === null || _k === void 0 ? void 0 : _k.map(action => {
+            }), ((_j = this.overflowPrimaryActions) === null || _j === void 0 ? void 0 : _j.length) > 0 && (h("stencil-icon-button", { key: '93371bedffe6f7d2d0c88d5b24a46da780b9b0f3', onClick: this.handleOnClickPrimaryAction, icon: OverflowMenuVertical24, tooltip: "More", noBackground: true, buttonId: "morePrimaryIconButton" }))), this.primaryActionAnchor && (h("udp-pop-over", { key: '5559e811a2912ceccb8e28d4a9fe8bf42e0afcb8', anchorElement: this.primaryActionAnchor, isOpen: this.showPrimaryPopover, popoverWidth: '200px', popoverMaxHeight: '300px', handleOnClose: this.handleClosePopover, container: this.popoverContainer }, h("div", { key: 'a181790896fd98c30a9475ee7d10ac99697f9d84', class: "menu" }, (_k = this.overflowPrimaryActions) === null || _k === void 0 ? void 0 : _k.map(action => {
             var _a;
             return (h("udp-menu-item", { label: action === null || action === void 0 ? void 0 : action.name, iconName: action === null || action === void 0 ? void 0 : action.iconName, handleOnClick: () => {
                     action.onClick(this.data);
@@ -256,7 +256,7 @@ const FeatureDetailsPopUp = class {
         var _a, _b, _c;
         const message = this.getMessage ? this.getMessage(this.data) : null;
         const messageIcon = this.getMessageIcon ? this.getMessageIcon(this.data) : null;
-        return (h("div", { key: '1b5195214872ac0f1e3593d4de57c6d3b26bce96' }, this.showPopOver && (h("feature-details-card", { key: '07d39ad98391f84657bb4451b1a4857ec05bc88c', data: this.currentSelectedFeature, title: this.cardTitle, listData: this.listData, status: (_c = (_a = this.data) === null || _a === void 0 ? void 0 : _a[(_b = this.cardConfig) === null || _b === void 0 ? void 0 : _b.statusColor]) === null || _c === void 0 ? void 0 : _c.toLowerCase(), enableViewFeature: this.enableViewFeature, handleViewFeature: this.handleViewFeature, primaryActions: this.isReadOnly ? [] : this.primaryActions, moreIconActions: this.isReadOnly ? [] : this.moreIconActions, message: message, messageIcon: messageIcon, hideMessageIcon: this.hideMessageIcon, onClose: this.additionalOnclosePopover, width: this.popoverWidth, popoverContainer: this.popoverContainer }))));
+        return (h("div", { key: 'deaed233d3e7bb551c0573d572e726e89478b0c1' }, this.showPopOver && (h("feature-details-card", { key: '1032dce713a053da66036992fc43dfcf860f3ad3', data: this.currentSelectedFeature, title: this.cardTitle, listData: this.listData, status: (_c = (_a = this.data) === null || _a === void 0 ? void 0 : _a[(_b = this.cardConfig) === null || _b === void 0 ? void 0 : _b.statusColor]) === null || _c === void 0 ? void 0 : _c.toLowerCase(), enableViewFeature: this.enableViewFeature, handleViewFeature: this.handleViewFeature, primaryActions: this.isReadOnly ? [] : this.primaryActions, moreIconActions: this.isReadOnly ? [] : this.moreIconActions, message: message, messageIcon: messageIcon, hideMessageIcon: this.hideMessageIcon, onClose: this.additionalOnclosePopover, width: this.popoverWidth, popoverContainer: this.popoverContainer }))));
     }
     static get watchers() { return {
         "cardConfig": ["updateListData", "updateTitle"],

package/dist/esm/image-upload_7.entry.js CHANGED Viewed

@@ -140,7 +140,7 @@ const ImageUpload = class {
         };
     }
     render() {
-        return (h(Host, { key: '19a51f64e9f42e14ed0db598cbe14afed29e0223' }, h("file-upload", { key: 'a08353c21e8a684e56dce14b09323bb8793c735e', allowMultiple: false, allowedMimeTypes: this.allowedMimeTypes, fullWidth: this.fullWidth, required: this.required, error: this.error, dragAndDropMessage: this.dragAndDropMessage, browseFileMessage: this.browseFileMessage, hideDragAndDrop: this.hideDragAndDrop, hideButton: this.hideButton, id: this.id, name: this.name, label: this.label, disabled: this.disabled, readonly: this.readonly, initialValue: this.initialValue, renderImage: true, onChange: this.handleFileChange })));
+        return (h(Host, { key: 'ca8412c0a65495f53c5bce53f1d2705be3dc2fb5' }, h("file-upload", { key: 'd36166a2fe50d71f63bf5420fedf149aa2591c93', allowMultiple: false, allowedMimeTypes: this.allowedMimeTypes, fullWidth: this.fullWidth, required: this.required, error: this.error, dragAndDropMessage: this.dragAndDropMessage, browseFileMessage: this.browseFileMessage, hideDragAndDrop: this.hideDragAndDrop, hideButton: this.hideButton, id: this.id, name: this.name, label: this.label, disabled: this.disabled, readonly: this.readonly, initialValue: this.initialValue, renderImage: true, onChange: this.handleFileChange })));
     }
 };
 ImageUpload.style = imageUploadCss;
@@ -445,7 +445,7 @@ const SignatureInput = class {
             'readonly': this.readonly,
             'disabled': this.disabled,
         };
-        return (h(Host, { key: 'dc034f05df499549cd7034bce6e88c91bfbfaf96', class: {
+        return (h(Host, { key: 'ac2fb4bedc1622ba4828a3643e6166e622ff098b', class: {
                 'udp-input': true,
                 'udp-input--error': isError,
                 'udp-input--disabled': this.disabled,
@@ -453,7 +453,7 @@ const SignatureInput = class {
                 'udp-input--readonly': this.readonly,
                 [`udp-input--size-${this.size}`]: true,
                 [`udp-input--margin-${this.margin}`]: true,
-            } }, h("div", { key: '4f4d51ecfe59f538eb99b855ae9707af6bd899ea', class: "bx--form-item" }, this.label && (h("unity-typography", { key: 'd8fee693974965ab6898e69524f3915fbd0fc27f', variant: "caption-text" }, h("label", { key: '919a7adc4696078c797a7c5c7c19957ff26c9d13', htmlFor: this.id, class: "bx--label" }, this.label, this.required && '*'))), h("div", { key: '7570d0119751556158487a82b05c3bf97aefeba9', class: containerClasses }, h("canvas", { key: '5262809218c69e88bf3d9050d70e3eba3f7d392c', ref: el => (this.canvasEl = el), class: { 'signature-canvas': true, 'readonly': this.readonly || this.disabled }, id: this.id }), !this.readonly && !this.disabled && (h("button", { key: 'f52033e90c57c4297d6fa31649de86f518c30fc7', type: "button", class: "clear-button", onClick: this.clearSignature, disabled: this.disabled }, "Clear"))), isError && (h("div", { key: '39733f96d4a39c92ae7d6da16eac0512502a9d2b', class: "error-message" }, h("unity-typography", { key: 'cb5d2a2b8f48d6b6b3753bd4cf6882a19f29706c', variant: "caption-text", color: "error" }, this.internalError))))));
+            } }, h("div", { key: 'c693c76ba9b1ceb16c73d33cbcfac0b420598d14', class: "bx--form-item" }, this.label && (h("unity-typography", { key: 'b60f4376e231e25a49a92a7920ef4c444ff3d216', variant: "caption-text" }, h("label", { key: 'a871803a7bea487a82addc1f0be9b5a53cc5f7c9', htmlFor: this.id, class: "bx--label" }, this.label, this.required && '*'))), h("div", { key: '8f6d974eaf18bc2a5261954b965c9c5c14cc5df0', class: containerClasses }, h("canvas", { key: '1a93840f73735d672361d2858a7db3e35809797c', ref: el => (this.canvasEl = el), class: { 'signature-canvas': true, 'readonly': this.readonly || this.disabled }, id: this.id }), !this.readonly && !this.disabled && (h("button", { key: '2d04e634eea1328df6af7adff22bff3e7da49418', type: "button", class: "clear-button", onClick: this.clearSignature, disabled: this.disabled }, "Clear"))), isError && (h("div", { key: '2395b6d8806600af6158a7a5464ca01a131046d4', class: "error-message" }, h("unity-typography", { key: '2afe4c3e248e467c3781e90b45f1fa80cb927265', variant: "caption-text", color: "error" }, this.internalError))))));
     }
     get el() { return getElement(this); }
     static get watchers() { return {
@@ -696,7 +696,7 @@ const StencilForm = class {
         debounce(submitFunction, 1000, { leading: true, trailing: false })();
     }
     render() {
-        return (h("form", { key: 'fd790369f0e37d43c8bafcaccde0e440e0746e08' }, h("slot", { key: 'd748fb1bb8a0946f8966b4799535865b466a1442' })));
+        return (h("form", { key: 'd4f22ff5b96b35639d98dae8c1d3adfbab8f493f' }, h("slot", { key: '4c460485b67440935235d078c08c92f6736f1a1a' })));
     }
     get el() { return getElement(this); }
 };
@@ -747,14 +747,14 @@ const TallyDisplay = class {
         const isError = !!this.error;
         const answeredCount = this.yesCount + this.noCount + this.naCount;
         const unansweredCount = this.totalFields - answeredCount;
-        return (h(Host, { key: 'c9e96cdb5d91e8c2cd45e32d07001a62a3e8a49c', class: {
+        return (h(Host, { key: 'eab9aa9216ed658bcdf6915bd909d918cf830d00', class: {
                 'udp-input': true,
                 'udp-input--error': isError,
                 'udp-input--disabled': this.disabled,
                 'udp-input--readonly': this.readonly,
                 [`udp-input--size-${this.size}`]: true,
                 [`udp-input--margin-${this.margin}`]: true,
-            } }, h("div", { key: '6083ef795c4eab017a38d1902ec6a579878457a8', class: "tally-container" }, this.label && (h("unity-typography", { key: '049187840fd2aa82ea7e41c5fba09e3b9e19606c', variant: "caption-text" }, h("label", { key: '474ff2713c3ae424d3f06c564a0b25eb7986aa99', htmlFor: this.id, class: "tally-label" }, this.label))), h("div", { key: 'e6c19c979f1ecad44499266ede07f3a3015c76ed', class: "tally-content", id: this.id }, h("div", { key: '78a94b2e9558e3762b992fcc3a6c836c0b434cdc', class: "tally-stats" }, h("div", { key: '685067252f8387392cc49431ca940495d2650814', class: "tally-item tally-yes" }, h("unity-typography", { key: '78b2bef3a168663ab7afd794edb4d86d92f21b97', variant: "h4", class: "tally-count" }, this.yesCount), h("unity-typography", { key: 'a66f44b5e0fecbd1b42d3ced6b04cd1c3f329695', variant: "caption-text", class: "tally-label" }, "Yes")), h("div", { key: 'f942f4ef520684801f6cf3b0a817d1b199c9a16e', class: "tally-item tally-no" }, h("unity-typography", { key: '3b7fced2e98e8d923d8a052143c9a38e59be384e', variant: "h4", class: "tally-count" }, this.noCount), h("unity-typography", { key: '17a86ebf26dc706a355231fd43b7ee61818014a7', variant: "caption-text", class: "tally-label" }, "No")), h("div", { key: '01f7f70b709df656b299a890bba6e244fd7a08c6', class: "tally-item tally-na" }, h("unity-typography", { key: 'abec06e4efc5197ff7e01923851567d3416374b2', variant: "h4", class: "tally-count" }, this.naCount), h("unity-typography", { key: 'a3463b0a120b74e916ee38e7d6f8228f8b23492c', variant: "caption-text", class: "tally-label" }, "Not Applicable")), unansweredCount > 0 && (h("div", { key: 'e3b2232988a7e14b73d6b1e31636567fb49d3c77', class: "tally-item tally-unanswered" }, h("unity-typography", { key: '7f6a2467b952c6e0a09d0b449a02b8695493dcae', variant: "h4", class: "tally-count" }, unansweredCount), h("unity-typography", { key: '2e07bfd707c22f956d012be6ba1a3e63cd173d31', variant: "caption-text", class: "tally-label" }, "Unanswered")))), h("div", { key: 'c6d57248f93e8a1983972c526d3ec59643d51314', class: "tally-summary" }, h("unity-typography", { key: 'ddefe0eb812b31360f4a6cf0859bf3b1075dbcd7', variant: "caption-text" }, "Total Questions: ", this.totalFields))), isError && (h("div", { key: '3fbc95f85065d432106d99c2b7b45a8560820f5d', class: "error-message" }, h("unity-typography", { key: 'd9a4969364ee1787d60933e0560a99ebdf50c8e8', variant: "caption-text", color: "error" }, this.error))))));
+            } }, h("div", { key: '452e354e6500687871b8ddc804bba7d02070653f', class: "tally-container" }, this.label && (h("unity-typography", { key: '390535267249c7ab8a49e450eb85e9e910c866e8', variant: "caption-text" }, h("label", { key: '79de1a53b126cf298fc2fbad6381d84c7dba603e', htmlFor: this.id, class: "tally-label" }, this.label))), h("div", { key: 'acc4abaaa1cde58775d5b7dbc7d8ef8a98973f42', class: "tally-content", id: this.id }, h("div", { key: '81e95ddfbb3b5d0aae68bc82f6ce1a15817e11c8', class: "tally-stats" }, h("div", { key: 'efd9128195ca7c1fd69f85041ee21bad9e361b19', class: "tally-item tally-yes" }, h("unity-typography", { key: '010828f5cf33fb524a8b49de10ee6ff5375a5ffa', variant: "h4", class: "tally-count" }, this.yesCount), h("unity-typography", { key: '1caa0b78ed65e044c305eba486747c885d69047a', variant: "caption-text", class: "tally-label" }, "Yes")), h("div", { key: '81dc0d4d7fa66889b43ff4a8e15fea32b103a548', class: "tally-item tally-no" }, h("unity-typography", { key: '31202d70b04ccfea2c1965785e00f652151da8c6', variant: "h4", class: "tally-count" }, this.noCount), h("unity-typography", { key: '570f3e5f948eb667e7f9654e8202328b91c1d2fa', variant: "caption-text", class: "tally-label" }, "No")), h("div", { key: '599f0bb878631926a87cef3b33b5a2177a77caae', class: "tally-item tally-na" }, h("unity-typography", { key: 'df06748f2d4a701121367a903c266bab529b6a9c', variant: "h4", class: "tally-count" }, this.naCount), h("unity-typography", { key: '93859a85e24afc9e618630bece8dfc077b6e1cce', variant: "caption-text", class: "tally-label" }, "Not Applicable")), unansweredCount > 0 && (h("div", { key: '11d6c252737deb5054204247cde155109c2b63af', class: "tally-item tally-unanswered" }, h("unity-typography", { key: 'bb7a25001e7a888c8f35d5f5053f06ad9b243c9c', variant: "h4", class: "tally-count" }, unansweredCount), h("unity-typography", { key: '59f54186a96be7fbef4dab69a54510f6096430e5', variant: "caption-text", class: "tally-label" }, "Unanswered")))), h("div", { key: '9e83fc8f1d30495483330c8a0d89248d129fa38a', class: "tally-summary" }, h("unity-typography", { key: '7ab06473f80d661975b742613c790fa71ac50a66', variant: "caption-text" }, "Total Questions: ", this.totalFields))), isError && (h("div", { key: '60c0d66b3d362e26c39b6511a7cfd8b1ba82ba8a', class: "error-message" }, h("unity-typography", { key: '3d45e76018c6cc6f8e27d8e1f76003b51382c73e', variant: "caption-text", color: "error" }, this.error))))));
     }
 };
 TallyDisplay.style = tallyCss;

package/dist/esm/inputs-example.entry.js CHANGED Viewed

@@ -86,7 +86,7 @@ const InputsExample = class {
         };
     }
     render() {
-        return (h("div", { key: '2c9774c01a36f857e6433aba926627a1257791c7', class: "inputs-example" }, h("h1", { key: '5c19b71a3f023b51f0c34ed8e7c5f37434ad091b' }, "Input Components Examples"), h("section", { key: 'f2447d8dfe430b466c61a2574ca753b9d5319ee9', class: "example-section" }, h("h2", { key: '818dcaa4f4c7dc505cdcccc3ffc484f70a3fb071' }, "Controlled Components"), h("p", { key: 'ea4ef0d9251996f67b861638238de0ad0a940e81' }, "Parent component manages state and passes values to child components."), h("div", { key: 'ee6a1e5c706fdb5f944e83624337a01331cc8d95', class: "input-grid" }, h("div", { key: '3ea82c30422559f59d4a0e10dddd02d918077eca', class: "input-example" }, h("h3", { key: '6c5ae1f68f5fa8e43a2b93176e610d88936982dd' }, "Text Field"), h("text-field", { key: '72ee35e0669b46c6c1707c079e87205c99155b00', label: "Controlled Text Input", placeholder: "Enter text...", value: this.controlledTextValue }), h("p", { key: '6c7607e7b5cd9e0d942d2a890e90a1c43d8b1089', class: "value-display" }, "Value: ", this.controlledTextValue)), h("div", { key: '4d1b4ee2ccdd1f1da7568de5c33c6180dbac9a73', class: "input-example" }, h("h3", { key: '378a2d4ae669e03703cc9296529812ca7f0e7afc' }, "Numeric Field"), h("numeric-field", { key: '8827d06eeb38b3658909dbbe20cbed16aef1ded7', label: "Controlled Numeric Input", placeholder: "Enter number...", value: this.controlledNumericValue, min: "0", max: "100", step: "1", onChange: this.handleControlledNumericChange }), h("p", { key: '11797ec1b07020faee2cf620597c29b7ec3c91e3', class: "value-display" }, "Value: ", this.controlledNumericValue)), h("div", { key: 'c49569a4b48b03d0ba2846acd84a20ee0474f9e5', class: "input-example" }, h("h3", { key: '655878f8956003849b894125c2fb876c4e787acb' }, "Text Area"), h("text-area", { key: '3e3045fed0d2e5230a84658a7d7acb2d3a6bc3c8', label: "Controlled Text Area", placeholder: "Enter description...", value: this.controlledTextAreaValue, minRows: 3, maxRows: 6 }), h("p", { key: 'b6a093c2a16379f854f8ec1890aca57d6b841685', class: "value-display" }, "Value: ", this.controlledTextAreaValue)), h("div", { key: 'f00587ad5255ac95ca7ef73ad525c9f2b7ad2e32', class: "input-example" }, h("h3", { key: '9e0ff081e371c2877d432d2e5c99e9b3447e1d73' }, "Checkbox"), h("check-box", { key: '1b3039be849d1fc56ee1b3cb35fde57d90dbe9b2', label: "Controlled Checkbox", checked: this.controlledCheckboxValue, onChange: this.handleControlledCheckboxChange }), h("p", { key: 'a5a2487cb7a5ece6ef34cafd22886aa3bb180682', class: "value-display" }, "Checked: ", this.controlledCheckboxValue.toString())), h("div", { key: '5297030b195b03b2a0406ee4578f458e787abf6a', class: "input-example" }, h("h3", { key: '58004f9d68fa3c844424b4f7365a0cca9479f968' }, "Toggle"), h("stencil-toggle", { key: '8b8f04ab81e681ab9520f89fa82e32a3d4250409', label: "Controlled Toggle", checked: this.controlledToggleValue, onChange: this.handleControlledToggleChange }), h("p", { key: 'd2492200be23d7444fe71267e11c549f16d8bc9a', class: "value-display" }, "Toggled: ", this.controlledToggleValue.toString())), h("div", { key: '698863a621af9c58672847f4505aaa5e2482bd05', class: "input-example" }, h("h3", { key: '39e0bcc2b2f04b9730352bd305823d6b5a9f8e6a' }, "Date Selector"), h("udp-date-selector", { key: 'b3338f8cf609764338d6be2a7b87dbf1d2b70f7f', label: "Controlled Date", value: this.controlledDateValue, onChange: this.handleControlledDateChange }), h("p", { key: '09904cafd32d18a5cd7f576e576c6269f47dab94', class: "value-display" }, "Date: ", this.controlledDateValue)), h("div", { key: '13ec4f54ac0fbbaa74c67b56a5cadd6a9fc45252', class: "input-example" }, h("h3", { key: '5b899dea25c2f3cad64165988817c9d78afd6049' }, "DateTime Selector"), h("udp-datetime-selector", { key: '531b20feccea342c3308a373bb920f4060179f0f', label: "Controlled DateTime", value: this.controlledDateTimeValue, onChange: this.handleControlledDateTimeChange }), h("p", { key: '60d6d1e1e93897d5ff04fa269b8d79105e95e2fa', class: "value-display" }, "DateTime: ", this.controlledDateTimeValue)), h("div", { key: '29fefc86c4645769ce32ef9312518dd681eeeaf6', class: "input-example" }, h("h3", { key: '3cc3d33c55281e80a2a447bf68412aec3f0ba527' }, "Time Selector"), h("udp-time-selector", { key: 'b7bf0408622231fc893f7f5c5a8746e95775c8a7', label: "Controlled Time", value: this.controlledTimeValue, onChange: this.handleControlledTimeChange }), h("p", { key: '34234c591167b563554a6671ee294a1a3b426510', class: "value-display" }, "Time: ", this.controlledTimeValue)), h("div", { key: '6632d633fcdaf187024a726b95a4b67decb44126', class: "input-example" }, h("h3", { key: '6c35d09bda887f3128fe648392faffd00f8e2514' }, "UDP Selector"), h("udp-selector", { key: '03b8b44a84c3db73b74b0738e602d09e91f5f228', label: "Controlled Selector", options: this.selectorOptions, value: this.controlledSelectorValue, onChange: this.handleControlledSelectorChange }), h("p", { key: '73d475e90a204b46a15383d0e6b74269f29e59e4', class: "value-display" }, "Selected: ", this.controlledSelectorValue)), h("div", { key: 'd470e5bd6e16be2a67bdba2fca5fe0f494dabc12', class: "input-example" }, h("h3", { key: '703cadb6d041bc560fd72c60bfd562d409c4b653' }, "File Upload"), h("file-upload", { key: '94b4d3a82bc92353d5ebb8f3c7bc8b321902eb59', label: "Controlled File Upload", allowMultiple: true, onChange: this.handleControlledFileChange }), h("p", { key: '1b9eaac708bbd6ea3a13b1f405e70c717de4361c', class: "value-display" }, "Files: ", this.controlledFileValue.length, " selected")))), h("section", { key: '0a017099bef0d138db8311c2607aa96e829f2db9', class: "example-section" }, h("h2", { key: '3a299379ae5f9d8b66b723aaa151514c9664e147' }, "Uncontrolled Components"), h("p", { key: '62b6c718844eb84971a5e8533fe51ae4ce9185d7' }, "Components manage their own state with initial values."), h("div", { key: 'b0270fdf7b8d96560fc49c7830e6192d9b34c583', class: "input-grid" }, h("div", { key: '52af146f389abe67d9c6edf239b80dbb553f4b48', class: "input-example" }, h("h3", { key: '5f5e36b240ad4f7f5e952d91c7ab08d907180738' }, "Text Field"), h("text-field", { key: '779daef1e8f1f0184b7ed60e3432c4bbb6d78aa5', label: "Uncontrolled Text Input", placeholder: "Enter text...", initialValue: "Initial text value", onChange: (e) => console.log('Text changed:', e.detail) })), h("div", { key: '925845b446b549ae12d3f67f40153ff88c1237ec', class: "input-example" }, h("h3", { key: '7b6eb7dfac92fcef0972f61bed2cc14c65c35a1f' }, "Numeric Field"), h("numeric-field", { key: 'f9e990f8a8b24fff7eda8513c0f33bb62c7a2522', label: "Uncontrolled Numeric Input", placeholder: "Enter number...", initialValue: "42", min: "0", max: "100", onChange: (e) => console.log('Number changed:', e.detail) })), h("div", { key: 'dc700898e6043c871e81ba4215775e0b8ad86e64', class: "input-example" }, h("h3", { key: '89025e16958ad38e0de9a4fd2784617a434bb7b4' }, "Text Area"), h("text-area", { key: 'f89870ede0138fbd4c451de97b442a5eb440674d', label: "Uncontrolled Text Area", placeholder: "Enter description...", initialValue: "Initial description text", minRows: 3, onChange: (e) => console.log('Text area changed:', e.detail) })), h("div", { key: '840cdd4c554cb6f30a9660136586744e4df8391b', class: "input-example" }, h("h3", { key: '4af04e761094cf33faeda3366718ed912caa7d74' }, "Checkbox"), h("check-box", { key: '9263a3e6db5684bf304111ff8e7b7b12a6ed247b', label: "Uncontrolled Checkbox", initialValue: "true", onChange: (e) => console.log('Checkbox changed:', e.detail) })), h("div", { key: 'e2ee60bd202d614335a35ad0344c2117061f40ca', class: "input-example" }, h("h3", { key: 'e8af0e815f5a89de6ec1596c6f0b457c0a413bd7' }, "Toggle"), h("stencil-toggle", { key: 'f6231a4394eb6d0f6b35c48b8850b98139df413e', label: "Uncontrolled Toggle", initialValue: "false", onChange: (e) => console.log('Toggle changed:', e.detail) })), h("div", { key: 'bc457a401665ddcd8761555d1e664448ae240029', class: "input-example" }, h("h3", { key: '27c031274e7b4eefb1f629c9499d1f9d028714f6' }, "Date Selector"), h("udp-date-selector", { key: '0d001fa6aea835854f59a5adce3f86e91ecedad9', label: "Uncontrolled Date", initialValue: "2024-01-15", onChange: (e) => console.log('Date changed:', e.detail) })), h("div", { key: '2adb1279494c4bef294fc4cdfab08a1e9d5dd51f', class: "input-example" }, h("h3", { key: 'b345f7f9dd7613ae3c90af685c6d7363b1fa5694' }, "Time Selector"), h("udp-time-selector", { key: '0b81754404c91875178909823c51a77821ba713c', label: "Uncontrolled Time", initialValue: "14:30", onChange: (e) => console.log('Time changed:', e.detail) })), h("div", { key: 'e612112a0cfbad0378ce23559301468bbab528dd', class: "input-example" }, h("h3", { key: '58e3be8c3091b4375728653aa1025dd0800dea3a' }, "DateTime Selector"), h("udp-datetime-selector", { key: 'a66319f6db6bc35756b3cf0ed3f224024eecf0c4', label: "Uncontrolled DateTime", initialValue: "2024-01-15T14:30", onChange: (e) => console.log('DateTime changed:', e.detail) })), h("div", { key: '1b71ad2e2c0b7e8087202fa03abdd0ec68a3f397', class: "input-example" }, h("h3", { key: '1b4818d107d60a9fca534ccba3c858860078b371' }, "UDP Selector"), h("udp-selector", { key: 'b53bdbabed328bc79fb7ea4597ffe36a26474d93', label: "Uncontrolled Selector", options: this.selectorOptions, initialValue: "option2", onChange: (e) => console.log('Selector changed:', e.detail) })))), h("section", { key: 'beaa194b45bd4fac58599a4a5e0d373c8101a743', class: "example-section" }, h("h2", { key: '05164bd4b352c81513d5c4c41fdd8998e5426534' }, "Form-wrapped Components"), h("p", { key: '0c4485a9dacf1f32b9c80f17d2521bf50fab2029' }, "Components integrated with stencil-form and stencil-field for validation and state management."), h("stencil-form", { key: '05de0c6af9963c337286a07a7058dc19174dd69a', handleSubmit: this.handleFormSubmit, handleChange: this.handleFormChange, handleValidate: this.validateForm, initialValues: {
+        return (h("div", { key: '6b50ded2b5937f9d1c0a103393b99e2a6f48c6e8', class: "inputs-example" }, h("h1", { key: '7b2298487532b8508bc4fe15e7b46879fd60399d' }, "Input Components Examples"), h("section", { key: '475beb2ff7e6f0d2a94f545efc068c93ebcbd6e8', class: "example-section" }, h("h2", { key: 'bb8636068a53c2be053bba146de8d6a079f5df2d' }, "Controlled Components"), h("p", { key: '2d29719a77cafa91d6daf88380dacd0978e1915a' }, "Parent component manages state and passes values to child components."), h("div", { key: '293c65cb3f38c26cabe875d9ab104d2e276b4b3c', class: "input-grid" }, h("div", { key: 'b88953b136c63c09704ae12a864997a6899c3d6f', class: "input-example" }, h("h3", { key: '8d27f5037a4064c4ae7df9622fd2a42314782fc0' }, "Text Field"), h("text-field", { key: '19190ab403f17711e8a4f344ac44d4542ac127fc', label: "Controlled Text Input", placeholder: "Enter text...", value: this.controlledTextValue }), h("p", { key: 'feaeed71f390846c35eee957cafb60fc1600d98b', class: "value-display" }, "Value: ", this.controlledTextValue)), h("div", { key: '20c5515f35e06ad1648682ea752ec0561008150a', class: "input-example" }, h("h3", { key: '4345172c87f8c427166b2e5533007470513e5c7f' }, "Numeric Field"), h("numeric-field", { key: '27556ce43e88bb47073731c8383bcd4f8eb741be', label: "Controlled Numeric Input", placeholder: "Enter number...", value: this.controlledNumericValue, min: "0", max: "100", step: "1", onChange: this.handleControlledNumericChange }), h("p", { key: 'cfd7b6473c71ae63e2d337a0ed38cac7fe488249', class: "value-display" }, "Value: ", this.controlledNumericValue)), h("div", { key: '1a5ab5c84878d698b23129dc8f8b7f2a46a74488', class: "input-example" }, h("h3", { key: '8ff0bd3644b2027f1ccf4607a001fa896ee74809' }, "Text Area"), h("text-area", { key: '8b54d457a09424321443dc4e48e140431ae45a1a', label: "Controlled Text Area", placeholder: "Enter description...", value: this.controlledTextAreaValue, minRows: 3, maxRows: 6 }), h("p", { key: 'e24c877d209de29cbb9aa8596d022036182388c4', class: "value-display" }, "Value: ", this.controlledTextAreaValue)), h("div", { key: 'cb3d16fcfef9bd860c9c789cdde68990c91735c4', class: "input-example" }, h("h3", { key: '8e91f172f4e98d293845738a8afb9584bb5198bf' }, "Checkbox"), h("check-box", { key: '676dbaabea69be3f5f91d17c7986adca52b06da1', label: "Controlled Checkbox", checked: this.controlledCheckboxValue, onChange: this.handleControlledCheckboxChange }), h("p", { key: '43a8f4032222fd5368f7fca421ff66f2f292b26c', class: "value-display" }, "Checked: ", this.controlledCheckboxValue.toString())), h("div", { key: '17a38692b2912c00977d22a89cf900fe4db8413f', class: "input-example" }, h("h3", { key: '3715bf330765086639bc0980352f1c826a7e54db' }, "Toggle"), h("stencil-toggle", { key: 'b62845365cf967114fc651ec4588cdb5af35994f', label: "Controlled Toggle", checked: this.controlledToggleValue, onChange: this.handleControlledToggleChange }), h("p", { key: '97565ba674f96a56f053c15ee4b305b00fca3cd9', class: "value-display" }, "Toggled: ", this.controlledToggleValue.toString())), h("div", { key: '7f52b0eb5bf59430918c4742de2d90a24bb22b72', class: "input-example" }, h("h3", { key: 'd8648dd0e8239f2f8e15e7177048b2586930e1aa' }, "Date Selector"), h("udp-date-selector", { key: '8e8bc3b6eba6dc91cb2ba8f19b8c16f810fa101b', label: "Controlled Date", value: this.controlledDateValue, onChange: this.handleControlledDateChange }), h("p", { key: '5e0f507d8f80e3a5506eb03a50e00341fb7f089d', class: "value-display" }, "Date: ", this.controlledDateValue)), h("div", { key: 'f96eee6cc3a0035c4d170b4675ce4b42ae0316f2', class: "input-example" }, h("h3", { key: '869940774405ef3881864c796082b6748b9d312b' }, "DateTime Selector"), h("udp-datetime-selector", { key: 'c7359174b839e386b879fce4bdbcbc94bc16f47f', label: "Controlled DateTime", value: this.controlledDateTimeValue, onChange: this.handleControlledDateTimeChange }), h("p", { key: '89f0e05b0becbfe819f400614efe04a3ba0146d0', class: "value-display" }, "DateTime: ", this.controlledDateTimeValue)), h("div", { key: 'fe08bb2860efc4214cd1c84a01324153fd42a6d6', class: "input-example" }, h("h3", { key: '9cc8d81ee4f85a69a8f15eb5daa16dbfd92b9f7a' }, "Time Selector"), h("udp-time-selector", { key: 'fae61e563015df43d76b31b6cb46e6518d45bc04', label: "Controlled Time", value: this.controlledTimeValue, onChange: this.handleControlledTimeChange }), h("p", { key: '62315ae45eb080ea450f35fee1f2fe76e83bd829', class: "value-display" }, "Time: ", this.controlledTimeValue)), h("div", { key: '571735fe6c7a126591c891da131bc6484e161bbc', class: "input-example" }, h("h3", { key: 'bbdba518d050d2442a6a2f55978e45f49ddf6e3f' }, "UDP Selector"), h("udp-selector", { key: '85bbdda76d8029a9bd0984484f57732aa7b66f67', label: "Controlled Selector", options: this.selectorOptions, value: this.controlledSelectorValue, onChange: this.handleControlledSelectorChange }), h("p", { key: 'c4d6858e679bafdb072c6e2f24df9fe979e9a2b1', class: "value-display" }, "Selected: ", this.controlledSelectorValue)), h("div", { key: '086135c1f8cfeb2eb5f9cd54436356856f6594b0', class: "input-example" }, h("h3", { key: '342be830da34c811266d9a467faa011f07c17c10' }, "File Upload"), h("file-upload", { key: '9344549ecc1570026cd900d6a80d3eb1975f0f94', label: "Controlled File Upload", allowMultiple: true, onChange: this.handleControlledFileChange }), h("p", { key: 'd5c32410a303357356be7710ac8bc51c3f6d8d71', class: "value-display" }, "Files: ", this.controlledFileValue.length, " selected")))), h("section", { key: '90a91939cbf4b5cd5d0e714ec6dbc572148a2530', class: "example-section" }, h("h2", { key: '40c14e1baae2826964bc2e41bb6230c6ece00d31' }, "Uncontrolled Components"), h("p", { key: '0216bbfb7442780936edc44866341ec2d1b7b996' }, "Components manage their own state with initial values."), h("div", { key: '75fc67742f1edf4fafe87417bcfcbde428f86d44', class: "input-grid" }, h("div", { key: 'dc2f84e6792250d96d4e82b0474701e568540375', class: "input-example" }, h("h3", { key: '6d17fcce74341e47330f203a1251a37ecc3c6498' }, "Text Field"), h("text-field", { key: '436a46aa93ffa40592380ea36be25e5ad78ac913', label: "Uncontrolled Text Input", placeholder: "Enter text...", initialValue: "Initial text value", onChange: (e) => console.log('Text changed:', e.detail) })), h("div", { key: '013560293f04950fd08cd1d9829830adc9050c42', class: "input-example" }, h("h3", { key: '54d50556c57fec37819b0a64ed6c58788ad8dcda' }, "Numeric Field"), h("numeric-field", { key: 'de05429463b1619df59ccbb378610ead45276acd', label: "Uncontrolled Numeric Input", placeholder: "Enter number...", initialValue: "42", min: "0", max: "100", onChange: (e) => console.log('Number changed:', e.detail) })), h("div", { key: 'ccdd65e720e78172bbdf79223807fde6fce10b2c', class: "input-example" }, h("h3", { key: '4bc9cb7c8a5473cc35e25955dd755be1b13c0748' }, "Text Area"), h("text-area", { key: 'e6620c10db672e8184ccf43895bd6805808c2cf4', label: "Uncontrolled Text Area", placeholder: "Enter description...", initialValue: "Initial description text", minRows: 3, onChange: (e) => console.log('Text area changed:', e.detail) })), h("div", { key: '352cfd880f026ff7a14d596599aa665734ff21a0', class: "input-example" }, h("h3", { key: '7c6b5e8b1d83b85fb02d4107a5598a696e0bdc86' }, "Checkbox"), h("check-box", { key: '171a78ba1b898c08cf73e84e1aa91e24c20ae1c0', label: "Uncontrolled Checkbox", initialValue: "true", onChange: (e) => console.log('Checkbox changed:', e.detail) })), h("div", { key: 'ff81933cfb80a36b515ca5c0ebed3a8172bcf152', class: "input-example" }, h("h3", { key: '06d7c7657af8c0d0b57fbf301bf675b6f401f1d8' }, "Toggle"), h("stencil-toggle", { key: 'c3fa6566984d2f8efa177f336d9c4b21400753e3', label: "Uncontrolled Toggle", initialValue: "false", onChange: (e) => console.log('Toggle changed:', e.detail) })), h("div", { key: '52428a2236893246268e976eccefc5d0ed420077', class: "input-example" }, h("h3", { key: '4bd154912f6328e88fae791898b0a74942b7e948' }, "Date Selector"), h("udp-date-selector", { key: 'a206c079f63dc834363c1a13df8593571ef31924', label: "Uncontrolled Date", initialValue: "2024-01-15", onChange: (e) => console.log('Date changed:', e.detail) })), h("div", { key: '797b0a55e6cb4c66e642bab72e68da01c212bb73', class: "input-example" }, h("h3", { key: '20b438beff287b412d2e692e12f1b96f8c8fa5aa' }, "Time Selector"), h("udp-time-selector", { key: '74e861d9f070225bdc7b8b7b9d6f9fb87a27fb1e', label: "Uncontrolled Time", initialValue: "14:30", onChange: (e) => console.log('Time changed:', e.detail) })), h("div", { key: '8a43ae37f986fd8c81d091be946e9d3407b593a1', class: "input-example" }, h("h3", { key: 'bdbf60f7deddef385c78a9bf7f05e50ef788792c' }, "DateTime Selector"), h("udp-datetime-selector", { key: 'f3917bebe83cc1a55d7caa1acec5ec991fab115c', label: "Uncontrolled DateTime", initialValue: "2024-01-15T14:30", onChange: (e) => console.log('DateTime changed:', e.detail) })), h("div", { key: '1782c0c0af9bf367d5a65748da1b5f4882ff478f', class: "input-example" }, h("h3", { key: 'a530d1d5750b4e6927bafb056211d420cd86cb02' }, "UDP Selector"), h("udp-selector", { key: 'e6935be37209f2872a10429544651ed8ae3ae9eb', label: "Uncontrolled Selector", options: this.selectorOptions, initialValue: "option2", onChange: (e) => console.log('Selector changed:', e.detail) })))), h("section", { key: '526277689a5ab71c53aea1a15dc1e005e3513337', class: "example-section" }, h("h2", { key: '52b1138ff192ed102b15db303cd565a64d2bfe40' }, "Form-wrapped Components"), h("p", { key: 'd7e086a0b2a635d184c324219e6fa2137da4c717' }, "Components integrated with stencil-form and stencil-field for validation and state management."), h("stencil-form", { key: 'b9914d0287d025ce6065f5985d49fbfc230b2b7f', handleSubmit: this.handleFormSubmit, handleChange: this.handleFormChange, handleValidate: this.validateForm, initialValues: {
                 formTextField: 'Initial form text',
                 formNumericField: '25',
                 formTextArea: 'Initial form description',
@@ -95,7 +95,7 @@ const InputsExample = class {
                 formDate: '2024-02-01',
                 formTime: '09:00',
                 formSelector: 'option1'
-            } }, h("div", { key: 'd35fe74a1e26cf0b8f398e9c894c8f1a5da45a48', class: "form-grid" }, h("stencil-field", { key: 'd77c0d4cc9d9cffb255eff419a5b0af8b561947e', name: "formTextField" }, h("text-field", { key: '0410f7248f9b229be53fcd674caeda0c65b05fe2', label: "Form Text Field", placeholder: "Enter text...", required: true })), h("stencil-field", { key: '48fba9a081504e2a0bea41f27ce0325dc914991d', name: "formNumericField" }, h("numeric-field", { key: '7f9ec15a7f6f0dbe373edff972efb2c81e2b558d', label: "Form Numeric Field", placeholder: "Enter number...", min: "0", max: "100", required: true })), h("stencil-field", { key: '2825b9b6932a7d66869f9ec08c60dc86a7d913da', name: "formTextArea" }, h("text-area", { key: '34b58939f90b746909880b22902bd7329d236cf4', label: "Form Text Area", placeholder: "Enter description...", required: true, minRows: 3 })), h("stencil-field", { key: '8ee8d90cf1c56d1a8f5f6d0dfd87fb8369a474e3', name: "formCheckbox" }, h("check-box", { key: 'f63e26765d059b3d950b06e00cb1e3f398247e9e', label: "Accept Terms and Conditions", required: true })), h("stencil-field", { key: '9c3412c4e9b54d1ef35b53af12246e81af00ff1b', name: "formToggle" }, h("stencil-toggle", { key: '700b07f98704353b99c936b26eb0b4142ff6a62a', label: "Enable Notifications" })), h("stencil-field", { key: '1698b7eee1656bf216498f09f7817307b74666b8', name: "formDate" }, h("udp-date-selector", { key: '8e8fc86fa7d371fabc6bf9eb72fbdd6e5e798102', label: "Form Date", required: true })), h("stencil-field", { key: 'b38b2317b83b226d34c0dc9491b8357ea8db261c', name: "formTime" }, h("udp-time-selector", { key: '570831455cbdc786acb1c06cff4c0089364999a9', label: "Form Time" })), h("stencil-field", { key: '71fc5f623dc700cfe77456d012dfa6e53a9d169e', name: "formSelector" }, h("udp-selector", { key: '22573dcbcb86203b9fe3ba0e79679225ad93eed8', label: "Form Selector", options: this.selectorOptions, required: true })), h("stencil-field", { key: '3455ddb62d6e341a58c78dd2a9820d2eb326399c', name: "formFiles" }, h("file-upload", { key: '2ca7724c7443075b94da339efdf7b23e404a72d8', label: "Form File Upload", allowMultiple: true }))), h("div", { key: '6d070a36e05b2bdf3928fce96d51a8e7bc42e9e0', class: "form-actions" }, h("button", { key: '7233a784011bd65fd5fe25105a4afa36cfad9bbd', type: "submit", class: "submit-button" }, "Submit Form"))), h("div", { key: 'b9b2382fa2f27d159a7e586479e2325b385b3163', class: "form-values" }, h("h3", { key: 'fc96b6c576f8198514a7c7aee5ae953eb8a752cd' }, "Current Form Values:"), h("pre", { key: '8fdc93279968950235a62a5b4022b0f578bbe993' }, JSON.stringify(this.formValues, null, 2)))), h("section", { key: '2731e1a0beedccacb1bbb34efb3608855769bbcb', class: "example-section" }, h("h2", { key: 'bb06ef8c5593615f101046e448291d512d6b4375' }, "Additional Examples"), h("p", { key: 'ab93ddb0de3d6606cc6285a0ec2e397f453846b5' }, "More complex configurations and specialized use cases."), h("div", { key: 'b1d7de6e2daa82f758e147e93831f4c3a327756e', class: "input-grid" }, h("div", { key: 'a65e4e5ff0a7950743529e441eeb6c0c67d16774', class: "input-example" }, h("h3", { key: '787e43f64af484ea59ad6a860be0aae3ea8ec95d' }, "Multi-Select UDP Selector"), h("udp-selector", { key: '0b79b2f43a252f631176f73403aac729f69c5af6', label: "Multi-Select Selector", options: this.selectorOptions, multiSelect: true, initialValue: "option1,option3", onChange: (e) => console.log('Multi-select changed:', e.detail) })), h("div", { key: '270209ebf674a2c4ce1b8211e11254f92c581735', class: "input-example" }, h("h3", { key: '967bc8d45e1c62d6a019f179a957f8e496160ba3' }, "Large UDP Selector"), h("udp-selector", { key: 'dbcd9fb9acf787233a62c4ff3bba8fbdbc982a71', label: "Large Selector", options: this.selectorOptions, large: true, initialValue: "option2", onChange: (e) => console.log('Large selector changed:', e.detail) })), h("div", { key: 'bc60bade3cb2b8b71f3cd7c55ce41faac4ad1d5f', class: "input-example" }, h("h3", { key: 'a9e11f6c997cd208d46f13e9aa7a74343d0c6e58' }, "File Upload with Type Restrictions"), h("file-upload", { key: '7dff9c55cf4741c542c4aae3dc60e36e4a9caa3e', label: "Image Upload Only", allowedFileTypes: ['jpg', 'jpeg', 'png', 'gif'], allowMultiple: false, browseFileMessage: "Select an Image", onChange: (e) => console.log('Image upload changed:', e.detail) })), h("div", { key: 'cc464aa2b13e6a7852c735279094097675f68a71', class: "input-example" }, h("h3", { key: 'd06ed109dc3967f56f369a2806514d4c3987c2ca' }, "Disabled Components"), h("div", { key: 'f7295d2fdd1a89191aba44a0948e74228a8f056b', class: "disabled-examples" }, h("text-field", { key: '9cafed2788920b6f772abb0cda0006f94c7f7076', label: "Disabled Text Field", value: "Cannot edit this", disabled: true }), h("check-box", { key: 'f7189fc4fd08c68970c5d97a1cc6516eb927e75c', label: "Disabled Checkbox", checked: true, disabled: true }), h("udp-selector", { key: 'b34905240d9b8f957a32791f3cba99cdf1128eb9', label: "Disabled Selector", options: this.selectorOptions, value: "option1", disabled: true })))))));
+            } }, h("div", { key: 'c988f4199f89b9d28a444ca6f262d0f7a4d7086f', class: "form-grid" }, h("stencil-field", { key: 'e61edacce18a1080604cca6c83a47eb9bf853dca', name: "formTextField" }, h("text-field", { key: '52a4fb8ad33fb5eb5f4c03a6b34f0352daecb227', label: "Form Text Field", placeholder: "Enter text...", required: true })), h("stencil-field", { key: '2fde12d1bc8562d727b9c16486f3cebc8d0ef0a1', name: "formNumericField" }, h("numeric-field", { key: 'cce90a03f97a7ce519e769cbf5568557e8da5172', label: "Form Numeric Field", placeholder: "Enter number...", min: "0", max: "100", required: true })), h("stencil-field", { key: '483c179ef0e6e057b0038c44ad35d758e8da72c0', name: "formTextArea" }, h("text-area", { key: '54bf5a7d1a29f00a4db885e70a4fff18c25ccc8b', label: "Form Text Area", placeholder: "Enter description...", required: true, minRows: 3 })), h("stencil-field", { key: '5b9b92bc986d8247e0d29580d16ea1af1d6dd811', name: "formCheckbox" }, h("check-box", { key: '9b697664e89f5e88964e740cb713e783cb7e5eaf', label: "Accept Terms and Conditions", required: true })), h("stencil-field", { key: '04e214cc1e402cd5d8cc4a902530ce3e5abfab93', name: "formToggle" }, h("stencil-toggle", { key: '90264b08f1fde534454cc62bbbc94148de7d357b', label: "Enable Notifications" })), h("stencil-field", { key: 'c2b32a971b1ff98067606c621cde478eddf532dc', name: "formDate" }, h("udp-date-selector", { key: '38d4277f734bfe478a07f3137424608646a48848', label: "Form Date", required: true })), h("stencil-field", { key: 'be40b541a17d729c6140931d05fce1baf2db7273', name: "formTime" }, h("udp-time-selector", { key: 'f3c10e03320cbd983b5573cee4ec99c737a0d389', label: "Form Time" })), h("stencil-field", { key: 'f0ec76807e7ac9caae2c216665934d5668abee6d', name: "formSelector" }, h("udp-selector", { key: 'a887013efc6d25c8119ec1ead75de3e3779e1d20', label: "Form Selector", options: this.selectorOptions, required: true })), h("stencil-field", { key: '662c9e1b54e9eb2926dd5405c17e7c9774bddba5', name: "formFiles" }, h("file-upload", { key: '08c9b118f3582f93086a5da3fa4d45446a967f5e', label: "Form File Upload", allowMultiple: true }))), h("div", { key: '951a514199520009da7df0798a6b9a6a8c8fb696', class: "form-actions" }, h("button", { key: '8550d0b23137a65a279390fcd083b75280e5c2ff', type: "submit", class: "submit-button" }, "Submit Form"))), h("div", { key: '194547ea02a3a71691c9721456def235b1ca0aa1', class: "form-values" }, h("h3", { key: '9f2237ad72e7dc8a89a3b76eb2a85489ef784b0f' }, "Current Form Values:"), h("pre", { key: 'b9e2cbee72e21f3640dba65eab05d2af47c4a284' }, JSON.stringify(this.formValues, null, 2)))), h("section", { key: '58723614fb40ff513d99eb984324848e68e26690', class: "example-section" }, h("h2", { key: '1c3528c6fa28d8c47bddd005523b2b2203433c24' }, "Additional Examples"), h("p", { key: '663507cd004a87e188acd89611a6f719dc236a0d' }, "More complex configurations and specialized use cases."), h("div", { key: 'c09839477af2b59587589b71730736fbe11f10f6', class: "input-grid" }, h("div", { key: '05be4e05ea40a32b44f8486ac36ec648617667ce', class: "input-example" }, h("h3", { key: '1a55bc8af2155bb961dd087ec28f1894604cf181' }, "Multi-Select UDP Selector"), h("udp-selector", { key: 'e39700fb3d1c54346e51ba22408c677ccc00fa93', label: "Multi-Select Selector", options: this.selectorOptions, multiSelect: true, initialValue: "option1,option3", onChange: (e) => console.log('Multi-select changed:', e.detail) })), h("div", { key: '8f18b41bb0f8fde3e7ea57e0a127885d3888039e', class: "input-example" }, h("h3", { key: '2627a3d0bfdcd7dc23fd67f4563733f2300c27de' }, "Large UDP Selector"), h("udp-selector", { key: '33c8e46f5e98b732c8e861de3fa1a8dadf8e75e1', label: "Large Selector", options: this.selectorOptions, large: true, initialValue: "option2", onChange: (e) => console.log('Large selector changed:', e.detail) })), h("div", { key: 'e74f1ccfac444c1058b03006c7516a90090704fc', class: "input-example" }, h("h3", { key: 'c13665d87d1ab26ce42084f5b497514df758336b' }, "File Upload with Type Restrictions"), h("file-upload", { key: 'fdbcbce5f0ad21427b10c69b1ff14faa5ff5bcd6', label: "Image Upload Only", allowedFileTypes: ['jpg', 'jpeg', 'png', 'gif'], allowMultiple: false, browseFileMessage: "Select an Image", onChange: (e) => console.log('Image upload changed:', e.detail) })), h("div", { key: 'e485136314ce4c0ea095ad532a3729e72d731e79', class: "input-example" }, h("h3", { key: 'fd9026adbfe0a0da04dba6d8e58d096e0e88cda1' }, "Disabled Components"), h("div", { key: '1a35bfda54b5bf67f50c460a028cec1e9a7979dd', class: "disabled-examples" }, h("text-field", { key: '163bd27c789de9fadaf4e7a509f59d36ef41a35e', label: "Disabled Text Field", value: "Cannot edit this", disabled: true }), h("check-box", { key: '6d94b2842459b07cd8a093c17555613e02ecdc27', label: "Disabled Checkbox", checked: true, disabled: true }), h("udp-selector", { key: 'db1da592947e1f072f2fc88026a3643059f8e405', label: "Disabled Selector", options: this.selectorOptions, value: "option1", disabled: true })))))));
     }
 };
 InputsExample.style = inputsExampleCss;