jebamo 0.0.13 → 0.0.14

package/dist/cjs/loader.cjs.js

@@ -6,7 +6,7 @@ var appGlobals = require('./app-globals-V2Kpy_OQ.js');
 const defineCustomElements = async (win, options) => {
   if (typeof window === 'undefined') return undefined;
   await appGlobals.globalScripts();
-  return index.bootstrapLazy([["je-textfield.cjs",[[81,"je-textfield",{"originalValue":[1025,"original-value"],"label":[1],"disabled":[4],"autoCapitalize":[1,"auto-capitalize"],"autoComplete":[1,"auto-complete"],"autoCorrect":[1,"auto-correct"],"autoFocus":[4,"auto-focus"],"inputMode":[1,"input-mode"],"min":[8],"max":[8],"minlength":[2],"maxlength":[2],"wrap":[1],"pattern":[1],"readonly":[4],"required":[4],"spellcheck":[4],"step":[1],"size":[1],"type":[1025],"value":[1032],"placeholder":[1],"debounce":[2],"format":[16],"validators":[16],"note":[1],"transform":[1],"multiline":[4],"pending":[4],"error":[6152],"success":[4],"touched":[32],"showPassword":[32],"getInputElement":[64],"markAsTouched":[64],"getErrors":[64],"isTouched":[64]},[[0,"keydown","handleKeyDown"],[0,"invalid","handleInvalid"]],{"value":["handleValueChange"]}]]],["je-datepicker.cjs",[[1,"je-datepicker",{"type":[1],"includeSeconds":[4,"include-seconds"],"min":[2],"max":[2],"isDateDisabled":[16,"is-date-disabled"],"value":[1026],"currentDate":[32]},null,{"value":["valueChangeHandler"]}]]],["je-details.cjs",[[1,"je-details",{"summary":[1],"open":[1540],"iconToggle":[4,"icon-toggle"],"iconSide":[1,"icon-side"]},null,{"open":["watchOpen"]}]]],["je-select.cjs",[[81,"je-select",{"value":[8],"label":[1],"disabled":[4],"required":[4],"placeholder":[1],"note":[1],"multiple":[4],"originalValue":[8,"original-value"],"options":[16],"size":[1],"open":[32],"content":[32]},[[0,"click","onClick"]]]]],["je-alert.cjs",[[1,"je-alert",{"icon":[1],"header":[1],"message":[1],"closable":[4],"color":[513],"duration":[2],"progress":[4],"open":[1028],"paused":[32],"show":[64],"hide":[64],"didDismiss":[64]},[[0,"animationend","onAnimationEnd"],[1,"mouseenter","onMouseEnter"],[1,"mouseleave","onMouseLeave"],[0,"slotchange","onSlotChange"]]]]],["je-radio-group.cjs",[[65,"je-radio-group",{"required":[4],"disabled":[4],"originalValue":[8,"original-value"],"label":[1],"note":[1],"value":[1032],"tabindex":[32]},[[0,"focus","onFocus"],[0,"focusin","onFocusIn"],[0,"focusout","onFocusOut"],[0,"click","handleNewValue"],[2,"keydown","handleKeyDown"]],{"value":["handleValueChange"]}]]],["je-branch.cjs",[[17,"je-branch",{"selection":[1],"indentation":[4],"open":[1028],"value":[1],"label":[1],"selected":[4],"isLeaf":[64]}]]],["je-checkbox.cjs",[[65,"je-checkbox",{"originalValue":[4,"original-value"],"data":[1],"value":[1028],"labelPlacement":[1,"label-placement"],"indeterminate":[4],"required":[4]},[[0,"click","onClick"],[0,"keydown","onKeyDown"]],{"value":["handleValueChange"]}]]],["je-radio.cjs",[[1,"je-radio",{"value":[8],"selected":[4]}]]],["je-accordion.cjs",[[1,"je-accordion",null,[[0,"expand","onExpand"],[0,"keydown","onKeydown"]]]]],["je-action-sheet.cjs",[[1,"je-action-sheet",{"open":[1028],"init":[16],"destroy":[16],"minPercent":[2,"min-percent"],"midPercent":[2,"mid-percent"],"maxPercent":[2,"max-percent"],"currentHeightPx":[32],"show":[64],"hide":[64]},[[0,"click","onClick"]],{"open":["onOpenChange"]}]]],["je-breadcrumb.cjs",[[1,"je-breadcrumb"]]],["je-breadcrumbs.cjs",[[1,"je-breadcrumbs",{"itemsBeforeCollapse":[2,"items-before-collapse"],"itemsAfterCollapse":[2,"items-after-collapse"],"maxItems":[2,"max-items"]}]]],["je-button-group.cjs",[[0,"je-button-group"]]],["je-calendar.cjs",[[1,"je-calendar"]]],["je-card.cjs",[[1,"je-card",{"color":[513],"button":[516]}]]],["je-column.cjs",[[1,"je-column",{"size":[1],"sizeXs":[1,"size-xs"],"sizeSm":[1,"size-sm"],"sizeMd":[1,"size-md"],"sizeLg":[1,"size-lg"],"sizeXl":[1,"size-xl"]},[[9,"resize","onResize"]]]]],["je-column-group.cjs",[[1,"je-column-group",{"columns":[2],"wrap":[516],"align":[513],"justify":[513],"gap":[513]}]]],["je-divider.cjs",[[1,"je-divider",{"type":[513],"spacing":[513]}]]],["je-drawer.cjs",[[1,"je-drawer",{"backdropDismiss":[4,"backdrop-dismiss"],"open":[1028],"side":[513],"init":[16],"destroy":[16],"show":[64],"hide":[64]},[[0,"click","onClick"]],{"open":["onOpenChange"]}]]],["je-dropzone.cjs",[[1,"je-dropzone",null,[[16,"themeChange","handleThemeChange"],[0,"drop","onDrop"],[0,"dragover","onDragOver"],[0,"dragleave","onDragLeave"]]]]],["je-form.cjs",[[6,"je-form",null,[[0,"submit","handleSubmit"],[0,"keydown","handleKeyup"]]]]],["je-infinite.cjs",[[1,"je-infinite",{"loading":[4],"threshold":[2],"rootMargin":[1,"root-margin"]}]]],["je-item.cjs",[[17,"je-item"]]],["je-link.cjs",[[17,"je-link",{"underline":[4],"bold":[4],"href":[1],"target":[1],"rel":[1],"download":[1]}]]],["je-menu.cjs",[[1,"je-menu"]]],["je-modal.cjs",[[1,"je-modal",{"showBackdrop":[4,"show-backdrop"],"backdropDismiss":[4,"backdrop-dismiss"],"open":[1028],"size":[513],"init":[16],"destroy":[16],"show":[64],"hide":[64],"didDismiss":[64]},[[0,"click","onClick"]],{"open":["onOpenChange"]}]]],["je-nav.cjs",[[4,"je-nav",{"mode":[513]}]]],["je-page.cjs",[[0,"je-page",{"layout":[513],"headerHeight":[32],"subTop":[32],"footerHeight":[32]}]]],["je-placeholder.cjs",[[1,"je-placeholder",{"animated":[4]}]]],["je-radio-button.cjs",[[1,"je-radio-button",{"value":[1],"selected":[4]}]]],["je-refresher.cjs",[[1,"je-refresher"]]],["je-tab.cjs",[[65,"je-tab",{"value":[1],"active":[4]}]]],["je-tabs.cjs",[[1,"je-tabs",{"mode":[513],"value":[1025]},[[0,"click","onClick"]],{"value":["handleValueChange"]}]]],["je-toast-container.cjs",[[1,"je-toast-container",{"position":[513]}]]],["je-toggle.cjs",[[65,"je-toggle",{"originalValue":[4,"original-value"],"value":[1028],"labelPlacement":[1,"label-placement"]},[[2,"click","onClick"],[2,"keydown","onKeyDown"]]]]],["je-tree.cjs",[[1,"je-tree",{"value":[1025],"selection":[1],"indentation":[4]},[[0,"click","onClick"],[0,"keyup","onKeyup"]],{"value":["valueChanged"]}]]],["je-wizard.cjs",[[1,"je-wizard",{"steps":[16],"completedSteps":[32],"currentStep":[32],"next":[64],"previous":[64],"skip":[64],"reset":[64],"canSkip":[64]},null,{"completedSteps":["onCompletedStepsChange"],"currentStep":["onCurrentStepChange"]}]]],["je-option.cjs",[[1,"je-option",{"value":[8],"selected":[4],"disabled":[4]},[[2,"click","onClick"],[2,"keydown","onKeyDown"]]]]],["je-pill.cjs",[[1,"je-pill",{"outline":[516],"button":[516],"disabled":[516]}]]],["je-toolbar.cjs",[[1,"je-toolbar"]]],["je-color_2.cjs",[[1,"je-color",{"color":[513],"light":[1],"dark":[1]}],[1,"je-tooltip",{"content":[1],"offsetX":[2,"offset-x"],"offsetY":[2,"offset-y"],"open":[32]},null,{"open":["onOpenChange"]}]]],["je-popover.cjs",[[1,"je-popover",{"open":[1028],"placement":[1],"backdropDismiss":[4,"backdrop-dismiss"],"dismissOnClick":[4,"dismiss-on-click"],"positionStrategy":[1,"position-strategy"],"offsetX":[2,"offset-x"],"offsetY":[2,"offset-y"],"triggerAction":[1,"trigger-action"],"matchWidth":[4,"match-width"],"arrow":[4],"init":[16],"destroy":[16],"arrowPadding":[2,"arrow-padding"],"show":[64],"hide":[64]},[[10,"click","handleWindowClick"],[10,"contextmenu","handleWindowContextMenu"]],{"open":["handleOpenChange"]}]]],["je-label_2.cjs",[[1,"je-label",{"required":[516]}],[1,"je-note",{"invalid":[516]}]]],["je-icon.cjs",[[17,"je-icon",{"size":[1],"fill":[4],"grade":[1],"weight":[2]}]]],["je-button_3.cjs",[[1,"je-icon-button",{"disabled":[4],"type":[1],"pending":[4],"fill":[1],"size":[1],"color":[1],"icon":[1]}],[17,"je-button",{"disabled":[4],"type":[1],"form":[1],"expand":[4],"pending":[4],"fill":[513],"size":[513],"color":[513]},[[0,"click","handleClick"]],{"pending":["onPendingChange"]}],[1,"je-loading"]]]], options);
+  return index.bootstrapLazy([["je-textfield.cjs",[[81,"je-textfield",{"originalValue":[1025,"original-value"],"label":[1],"disabled":[4],"autoCapitalize":[1,"auto-capitalize"],"autoComplete":[1,"auto-complete"],"autoCorrect":[1,"auto-correct"],"autoFocus":[4,"auto-focus"],"inputMode":[1,"input-mode"],"min":[8],"max":[8],"minlength":[2],"maxlength":[2],"wrap":[1],"pattern":[1],"readonly":[4],"required":[4],"spellcheck":[4],"step":[1],"size":[1],"type":[1025],"value":[1032],"placeholder":[1],"debounce":[2],"format":[16],"validators":[16],"note":[1],"suppressDefaultBehavior":[4,"suppress-default-behavior"],"transform":[1],"multiline":[4],"pending":[4],"error":[6152],"success":[4],"touched":[32],"showPassword":[32],"getInputElement":[64],"markAsTouched":[64],"getErrors":[64],"isTouched":[64]},[[0,"keydown","handleKeyDown"],[0,"invalid","handleInvalid"]],{"value":["handleValueChange"]}]]],["je-datepicker.cjs",[[1,"je-datepicker",{"type":[1],"includeSeconds":[4,"include-seconds"],"min":[2],"max":[2],"isDateDisabled":[16,"is-date-disabled"],"value":[1026],"currentDate":[32]},null,{"value":["valueChangeHandler"]}]]],["je-details.cjs",[[1,"je-details",{"summary":[1],"open":[1540],"iconToggle":[4,"icon-toggle"],"iconSide":[1,"icon-side"]},null,{"open":["watchOpen"]}]]],["je-select.cjs",[[81,"je-select",{"value":[8],"label":[1],"disabled":[4],"required":[4],"placeholder":[1],"note":[1],"multiple":[4],"originalValue":[8,"original-value"],"options":[16],"size":[1],"open":[32],"content":[32]},[[0,"click","onClick"]]]]],["je-alert.cjs",[[1,"je-alert",{"icon":[1],"header":[1],"message":[1],"closable":[4],"color":[513],"duration":[2],"progress":[4],"open":[1028],"paused":[32],"show":[64],"hide":[64],"didDismiss":[64]},[[0,"animationend","onAnimationEnd"],[1,"mouseenter","onMouseEnter"],[1,"mouseleave","onMouseLeave"],[0,"slotchange","onSlotChange"]]]]],["je-radio-group.cjs",[[65,"je-radio-group",{"required":[4],"disabled":[4],"originalValue":[8,"original-value"],"label":[1],"note":[1],"value":[1032],"tabindex":[32]},[[0,"focus","onFocus"],[0,"focusin","onFocusIn"],[0,"focusout","onFocusOut"],[0,"click","handleNewValue"],[2,"keydown","handleKeyDown"]],{"value":["handleValueChange"]}]]],["je-branch.cjs",[[17,"je-branch",{"selection":[1],"indentation":[4],"open":[1028],"value":[1],"label":[1],"selected":[4],"isLeaf":[64]}]]],["je-checkbox.cjs",[[65,"je-checkbox",{"originalValue":[4,"original-value"],"data":[1],"value":[1028],"labelPlacement":[1,"label-placement"],"indeterminate":[4],"required":[4]},[[0,"click","onClick"],[0,"keydown","onKeyDown"]],{"value":["handleValueChange"]}]]],["je-radio.cjs",[[1,"je-radio",{"value":[8],"selected":[4]}]]],["je-accordion.cjs",[[1,"je-accordion",null,[[0,"expand","onExpand"],[0,"keydown","onKeydown"]]]]],["je-action-sheet.cjs",[[1,"je-action-sheet",{"open":[1028],"init":[16],"destroy":[16],"minPercent":[2,"min-percent"],"midPercent":[2,"mid-percent"],"maxPercent":[2,"max-percent"],"currentHeightPx":[32],"show":[64],"hide":[64]},[[0,"click","onClick"]],{"open":["onOpenChange"]}]]],["je-breadcrumb.cjs",[[1,"je-breadcrumb"]]],["je-breadcrumbs.cjs",[[1,"je-breadcrumbs",{"itemsBeforeCollapse":[2,"items-before-collapse"],"itemsAfterCollapse":[2,"items-after-collapse"],"maxItems":[2,"max-items"]}]]],["je-button-group.cjs",[[0,"je-button-group"]]],["je-calendar.cjs",[[1,"je-calendar"]]],["je-card.cjs",[[1,"je-card",{"color":[513],"button":[516]}]]],["je-column.cjs",[[1,"je-column",{"size":[1],"sizeXs":[1,"size-xs"],"sizeSm":[1,"size-sm"],"sizeMd":[1,"size-md"],"sizeLg":[1,"size-lg"],"sizeXl":[1,"size-xl"]},[[9,"resize","onResize"]]]]],["je-column-group.cjs",[[1,"je-column-group",{"columns":[2],"wrap":[516],"align":[513],"justify":[513],"gap":[513]}]]],["je-divider.cjs",[[1,"je-divider",{"type":[513],"spacing":[513]}]]],["je-drawer.cjs",[[1,"je-drawer",{"backdropDismiss":[4,"backdrop-dismiss"],"open":[1028],"side":[513],"init":[16],"destroy":[16],"show":[64],"hide":[64]},[[0,"click","onClick"]],{"open":["onOpenChange"]}]]],["je-dropzone.cjs",[[1,"je-dropzone",null,[[16,"themeChange","handleThemeChange"],[0,"drop","onDrop"],[0,"dragover","onDragOver"],[0,"dragleave","onDragLeave"]]]]],["je-form.cjs",[[6,"je-form",null,[[0,"submit","handleSubmit"],[0,"keydown","handleKeyup"]]]]],["je-infinite.cjs",[[1,"je-infinite",{"loading":[4],"threshold":[2],"rootMargin":[1,"root-margin"]}]]],["je-item.cjs",[[17,"je-item"]]],["je-link.cjs",[[17,"je-link",{"underline":[4],"bold":[4],"href":[1],"target":[1],"rel":[1],"download":[1]}]]],["je-menu.cjs",[[1,"je-menu"]]],["je-modal.cjs",[[1,"je-modal",{"showBackdrop":[4,"show-backdrop"],"backdropDismiss":[4,"backdrop-dismiss"],"open":[1028],"size":[513],"init":[16],"destroy":[16],"show":[64],"hide":[64],"didDismiss":[64]},[[0,"click","onClick"]],{"open":["onOpenChange"]}]]],["je-nav.cjs",[[4,"je-nav",{"mode":[513]}]]],["je-page.cjs",[[0,"je-page",{"layout":[513],"headerHeight":[32],"subTop":[32],"footerHeight":[32]}]]],["je-placeholder.cjs",[[1,"je-placeholder",{"animated":[4]}]]],["je-radio-button.cjs",[[1,"je-radio-button",{"value":[1],"selected":[4]}]]],["je-refresher.cjs",[[1,"je-refresher"]]],["je-tab.cjs",[[65,"je-tab",{"value":[1],"active":[4]}]]],["je-tabs.cjs",[[1,"je-tabs",{"mode":[513],"value":[1025]},[[0,"click","onClick"]],{"value":["handleValueChange"]}]]],["je-toast-container.cjs",[[1,"je-toast-container",{"position":[513]}]]],["je-toggle.cjs",[[65,"je-toggle",{"originalValue":[4,"original-value"],"value":[1028],"labelPlacement":[1,"label-placement"]},[[2,"click","onClick"],[2,"keydown","onKeyDown"]]]]],["je-tree.cjs",[[1,"je-tree",{"value":[1025],"selection":[1],"indentation":[4]},[[0,"click","onClick"],[0,"keyup","onKeyup"]],{"value":["valueChanged"]}]]],["je-wizard.cjs",[[1,"je-wizard",{"steps":[16],"completedSteps":[32],"currentStep":[32],"next":[64],"previous":[64],"skip":[64],"reset":[64],"canSkip":[64]},null,{"completedSteps":["onCompletedStepsChange"],"currentStep":["onCurrentStepChange"]}]]],["je-option.cjs",[[1,"je-option",{"value":[8],"selected":[4],"disabled":[4]},[[2,"click","onClick"],[2,"keydown","onKeyDown"]]]]],["je-pill.cjs",[[1,"je-pill",{"outline":[516]},[[2,"keydown","onClick"]]]]],["je-toolbar.cjs",[[1,"je-toolbar"]]],["je-color_2.cjs",[[1,"je-color",{"color":[513],"light":[1],"dark":[1]}],[1,"je-tooltip",{"content":[1],"offsetX":[2,"offset-x"],"offsetY":[2,"offset-y"],"open":[32]},null,{"open":["onOpenChange"]}]]],["je-popover.cjs",[[1,"je-popover",{"open":[1028],"placement":[1],"backdropDismiss":[4,"backdrop-dismiss"],"dismissOnClick":[4,"dismiss-on-click"],"positionStrategy":[1,"position-strategy"],"offsetX":[2,"offset-x"],"offsetY":[2,"offset-y"],"triggerAction":[1,"trigger-action"],"matchWidth":[4,"match-width"],"arrow":[4],"init":[16],"destroy":[16],"arrowPadding":[2,"arrow-padding"],"show":[64],"hide":[64]},[[10,"click","handleWindowClick"],[10,"contextmenu","handleWindowContextMenu"]],{"open":["handleOpenChange"]}]]],["je-label_2.cjs",[[1,"je-label",{"required":[516]}],[1,"je-note",{"invalid":[516]}]]],["je-icon.cjs",[[17,"je-icon",{"size":[1],"fill":[4],"grade":[1],"weight":[2]}]]],["je-button_3.cjs",[[1,"je-icon-button",{"disabled":[4],"type":[1],"pending":[4],"fill":[1],"size":[1],"color":[1],"icon":[1]}],[17,"je-button",{"disabled":[4],"type":[1],"form":[1],"expand":[4],"pending":[4],"fill":[513],"size":[513],"color":[513]},[[0,"click","handleClick"]],{"pending":["onPendingChange"]}],[1,"je-loading"]]]], options);
 };
 
 exports.setNonce = index.setNonce;

package/dist/collection/components/je-button/je-button.js

@@ -14,8 +14,8 @@ export class JeButton {
     }
     componentDidLoad() {
         if (this.type) {
-            let formEl = this.form ? document.getElementById(this.form) : this.el.closest('form');
-            //if (formEl.tagName === 'JE-FORM') formEl = formEl.querySelector('form')
+            const formEl = this.form ? document.getElementById(this.form) : this.el.closest('form');
+            console.log(formEl);
             if (formEl) {
                 this.formButtonEl = document.createElement('button');
                 this.formButtonEl.type = this.type;
@@ -40,7 +40,7 @@ export class JeButton {
             pending: this.pending,
             [this.color]: !!this.color
         };
-        return (h(Host, { key: '45b91d0c61dfb35b39891757ff682c44a0aac684' }, h("button", { key: '2e1619be06c3e54f47281cc477e9de4bbc6fa724', part: 'inner-button', ref: el => this.buttonEl = el, disabled: this.disabled || this.pending, type: 'button', tabindex: 0, class: classes }, this.pending ? h("je-loading", null) : h("slot", null), h("slot", { key: '75f476ba5e7d226db0b611566c40fb982d2d0ce1', name: 'badge' }))));
+        return (h(Host, { key: 'f5e0a14366f5cfc859f7d9ad4ff5f340fe6bc7e5' }, h("button", { key: 'dd84638d95708f044ccca7917e3601ba2a939516', part: 'inner-button', ref: el => this.buttonEl = el, disabled: this.disabled || this.pending, type: 'button', tabindex: 0, class: classes }, this.pending ? h("je-loading", null) : h("slot", null), h("slot", { key: '8999e86079957e886e45e0cc9e9410f611f0a86a', name: 'badge' }))));
     }
     static get is() { return "je-button"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/je-button/je-button.js.map

@@ -1 +1 @@
-{"version":3,"file":"je-button.js","sourceRoot":"","sources":["../../../src/components/je-button/je-button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAUjF,MAAM,OAAO,QAAQ;IAPrB;QAYE,sBAAsB;QACd,aAAQ,GAAG,KAAK,CAAC;QAWzB,6DAA6D;QACrD,WAAM,GAAG,KAAK,CAAC;QAEvB,sDAAsD;QAC9C,YAAO,GAAG,KAAK,CAAC;QAExB,kBAAkB;QACO,SAAI,GAAkC,OAAO,CAAC;QAEvE,kBAAkB;QACO,SAAI,GAAuB,IAAI,CAAC;KA8C1D;IAzCC,gBAAgB;QACd,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;YACd,IAAI,MAAM,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,QAAQ,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;YACtF,yEAAyE;YACzE,IAAI,MAAM,EAAE,CAAC;gBACX,IAAI,CAAC,YAAY,GAAG,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;gBACrD,IAAI,CAAC,YAAY,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC;gBACnC,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,OAAO,GAAG,MAAM,CAAC;gBACzC,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;YACnC,CAAC;QACH,CAAC;IACH,CAAC;IAGD,WAAW;;QACT,MAAA,IAAI,CAAC,YAAY,0CAAE,KAAK,EAAE,CAAC;IAC7B,CAAC;IAGD,eAAe;QACb,IAAI,IAAI,CAAC,OAAO,EAAE,CAAC;YACjB,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,WAAW,CAAC,iBAAiB,EAAE,GAAG,IAAI,CAAC,QAAQ,CAAC,WAAW,IAAI,CAAC,CAAC;QACvF,CAAC;IACH,CAAC;IAED,MAAM;QACJ,MAAM,OAAO,GAAG;YACd,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,IAAI;YACjB,MAAM,EAAE,IAAI,CAAC,MAAM;YACnB,OAAO,EAAE,IAAI,CAAC,OAAO;YACrB,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,KAAK;SAC3B,CAAA;QACD,OAAO,CACL,EAAC,IAAI;YACH,+DAAQ,IAAI,EAAC,cAAc,EAAC,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,IAAI,CAAC,QAAQ,GAAG,EAAE,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,OAAO,EAAE,IAAI,EAAC,QAAQ,EAAC,QAAQ,EAAE,CAAC,EAAE,KAAK,EAAE,OAAO;gBAC1I,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,qBAAa,CAAC,CAAC,CAAC,eAAO;gBACvC,6DAAM,IAAI,EAAC,OAAO,GAAE,CACb,CACJ,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, h, Element, Listen, Host, Watch } from '@stencil/core';\nimport { Color } from '../../utils/utils';\n\n@Component({\n  tag: 'je-button',\n  styleUrl: 'je-button.scss',\n  shadow: {\n    delegatesFocus: true\n  },\n})\nexport class JeButton {\n  @Element() el: HTMLJeButtonElement;\n  private formButtonEl?: HTMLButtonElement;\n  private buttonEl: HTMLButtonElement;\n\n  /** Disables button */\n  @Prop() disabled = false;\n\n  /** Can set to submit or reset to participate in forms */\n  @Prop() type?: 'submit' | 'reset';\n\n  /**\n   * Can set form id to participate in forms. Use this if you need to place\n   * submit/reset button outside the form element\n   */\n  @Prop() form?: string;\n\n  /** Expands the button to the full width of it's container */\n  @Prop() expand = false;\n\n  /** Shows a loading spinner and disables the button */\n  @Prop() pending = false;\n\n  /** Button fill */\n  @Prop({ reflect: true }) fill: 'solid' | 'outline' | 'clear' = 'solid';\n\n  /** Button size */\n  @Prop({ reflect: true }) size: 'md' | 'lg' | 'sm' = 'md';\n\n  /** Predefined colors */\n  @Prop({ reflect: true }) color?: Color;\n\n  componentDidLoad() {\n    if (this.type) {\n      let formEl = this.form ? document.getElementById(this.form) : this.el.closest('form');\n      //if (formEl.tagName === 'JE-FORM') formEl = formEl.querySelector('form')\n      if (formEl) {\n        this.formButtonEl = document.createElement('button');\n        this.formButtonEl.type = this.type;\n        this.formButtonEl.style.display = 'none';\n        formEl.append(this.formButtonEl);\n      }\n    }\n  }\n\n  @Listen('click')\n  handleClick() {\n    this.formButtonEl?.click();\n  }\n\n  @Watch('pending')\n  onPendingChange() {\n    if (this.pending) {\n      this.buttonEl.style.setProperty('--pending-width', `${this.buttonEl.clientWidth}px`);\n    }\n  }\n\n  render() {\n    const classes = {\n      [this.fill]: true,\n      expand: this.expand,\n      pending: this.pending,\n      [this.color]: !!this.color\n    }\n    return (\n      <Host>\n        <button part='inner-button' ref={el => this.buttonEl = el} disabled={this.disabled || this.pending} type='button' tabindex={0} class={classes}>\n          {this.pending ? <je-loading/> : <slot/>}\n          <slot name='badge'/>\n        </button>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"je-button.js","sourceRoot":"","sources":["../../../src/components/je-button/je-button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAC;AAUjF,MAAM,OAAO,QAAQ;IAPrB;QAYE,sBAAsB;QACd,aAAQ,GAAG,KAAK,CAAC;QAWzB,6DAA6D;QACrD,WAAM,GAAG,KAAK,CAAC;QAEvB,sDAAsD;QAC9C,YAAO,GAAG,KAAK,CAAC;QAExB,kBAAkB;QACO,SAAI,GAAkC,OAAO,CAAC;QAEvE,kBAAkB;QACO,SAAI,GAAuB,IAAI,CAAC;KA8C1D;IAzCC,gBAAgB;QACd,IAAI,IAAI,CAAC,IAAI,EAAE,CAAC;YACd,MAAM,MAAM,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,QAAQ,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;YACxF,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC;YACpB,IAAI,MAAM,EAAE,CAAC;gBACX,IAAI,CAAC,YAAY,GAAG,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;gBACrD,IAAI,CAAC,YAAY,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC;gBACnC,IAAI,CAAC,YAAY,CAAC,KAAK,CAAC,OAAO,GAAG,MAAM,CAAC;gBACzC,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC;YACnC,CAAC;QACH,CAAC;IACH,CAAC;IAGD,WAAW;;QACT,MAAA,IAAI,CAAC,YAAY,0CAAE,KAAK,EAAE,CAAC;IAC7B,CAAC;IAGD,eAAe;QACb,IAAI,IAAI,CAAC,OAAO,EAAE,CAAC;YACjB,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,WAAW,CAAC,iBAAiB,EAAE,GAAG,IAAI,CAAC,QAAQ,CAAC,WAAW,IAAI,CAAC,CAAC;QACvF,CAAC;IACH,CAAC;IAED,MAAM;QACJ,MAAM,OAAO,GAAG;YACd,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,IAAI;YACjB,MAAM,EAAE,IAAI,CAAC,MAAM;YACnB,OAAO,EAAE,IAAI,CAAC,OAAO;YACrB,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,IAAI,CAAC,KAAK;SAC3B,CAAA;QACD,OAAO,CACL,EAAC,IAAI;YACH,+DAAQ,IAAI,EAAC,cAAc,EAAC,GAAG,EAAE,EAAE,CAAC,EAAE,CAAC,IAAI,CAAC,QAAQ,GAAG,EAAE,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,OAAO,EAAE,IAAI,EAAC,QAAQ,EAAC,QAAQ,EAAE,CAAC,EAAE,KAAK,EAAE,OAAO;gBAC1I,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,qBAAa,CAAC,CAAC,CAAC,eAAO;gBACvC,6DAAM,IAAI,EAAC,OAAO,GAAE,CACb,CACJ,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, h, Element, Listen, Host, Watch } from '@stencil/core';\nimport { Color } from '../../utils/utils';\n\n@Component({\n  tag: 'je-button',\n  styleUrl: 'je-button.scss',\n  shadow: {\n    delegatesFocus: true\n  },\n})\nexport class JeButton {\n  @Element() el: HTMLJeButtonElement;\n  private formButtonEl?: HTMLButtonElement;\n  private buttonEl: HTMLButtonElement;\n\n  /** Disables button */\n  @Prop() disabled = false;\n\n  /** Can set to submit or reset to participate in forms */\n  @Prop() type?: 'submit' | 'reset';\n\n  /**\n   * Can set form id to participate in forms. Use this if you need to place\n   * submit/reset button outside the form element\n   */\n  @Prop() form?: string;\n\n  /** Expands the button to the full width of it's container */\n  @Prop() expand = false;\n\n  /** Shows a loading spinner and disables the button */\n  @Prop() pending = false;\n\n  /** Button fill */\n  @Prop({ reflect: true }) fill: 'solid' | 'outline' | 'clear' = 'solid';\n\n  /** Button size */\n  @Prop({ reflect: true }) size: 'md' | 'lg' | 'sm' = 'md';\n\n  /** Predefined colors */\n  @Prop({ reflect: true }) color?: Color;\n\n  componentDidLoad() {\n    if (this.type) {\n      const formEl = this.form ? document.getElementById(this.form) : this.el.closest('form');\n      console.log(formEl);\n      if (formEl) {\n        this.formButtonEl = document.createElement('button');\n        this.formButtonEl.type = this.type;\n        this.formButtonEl.style.display = 'none';\n        formEl.append(this.formButtonEl);\n      }\n    }\n  }\n\n  @Listen('click')\n  handleClick() {\n    this.formButtonEl?.click();\n  }\n\n  @Watch('pending')\n  onPendingChange() {\n    if (this.pending) {\n      this.buttonEl.style.setProperty('--pending-width', `${this.buttonEl.clientWidth}px`);\n    }\n  }\n\n  render() {\n    const classes = {\n      [this.fill]: true,\n      expand: this.expand,\n      pending: this.pending,\n      [this.color]: !!this.color\n    }\n    return (\n      <Host>\n        <button part='inner-button' ref={el => this.buttonEl = el} disabled={this.disabled || this.pending} type='button' tabindex={0} class={classes}>\n          {this.pending ? <je-loading/> : <slot/>}\n          <slot name='badge'/>\n        </button>\n      </Host>\n    );\n  }\n}\n"]}

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

@@ -1,5 +1,6 @@
 :host {
   display: block;
+  width: fit-content;
   border: solid 1px var(--border-color);
   border-radius: var(--je-radius-sm, 0.125rem);
   overflow: hidden;

package/dist/collection/components/je-datepicker/je-datepicker.css

@@ -9,11 +9,11 @@
 }
 
 je-button.day {
-  --height: var(--je-spacing-xl, 1.5rem);
+  --height: var(--je-spacing-2xl, 2rem);
   --padding-inline: 0px;
 }
 je-button.day::part(inner-button) {
-  width: var(--je-spacing-xl, 1.5rem);
+  width: var(--je-spacing-2xl, 2rem);
   font-weight: 400;
 }
 
@@ -36,8 +36,8 @@ je-button.day::part(inner-button) {
   gap: var(--je-spacing-2xs, 0.25rem);
 }
 .weekdays-grid div {
-  height: var(--je-spacing-xl, 1.5rem);
-  width: var(--je-spacing-xl, 1.5rem);
+  height: var(--je-spacing-2xl, 2rem);
+  width: var(--je-spacing-2xl, 2rem);
   font-size: var(--je-font-md, 1rem);
   font-weight: 400;
   color: color-mix(in srgb, var(--je-secondary, #99becb) 80%, black 20%);

package/dist/collection/components/je-datepicker/je-datepicker.js

@@ -1,5 +1,5 @@
 import { Fragment, Host, h } from "@stencil/core";
-import { startOfMonth, endOfMonth, eachDayOfInterval, addMonths, subMonths, isSameDay, isToday, format, getDay, set, setHours, setMinutes, setSeconds } from "date-fns";
+import { startOfMonth, endOfMonth, eachDayOfInterval, addMonths, subMonths, isSameDay, isToday, format, getDay, set } from "date-fns";
 const daysOfWeek = ['S', 'M', 'T', 'W', 'T', 'F', 'S'];
 export class JeDatepicker {
     constructor() {
@@ -18,26 +18,23 @@ export class JeDatepicker {
         this.prevYear = () => {
             this.currentDate = subMonths(this.currentDate, 12);
         };
-        this.setDay = (day) => {
-            this.value = set(this.value, {
-                year: day.getFullYear(),
-                month: day.getMonth(),
-                date: day.getDate()
-            }).getTime();
-        };
-        this.setHour = (hour) => {
-            this.value = setHours(this.value, hour).getTime();
-        };
-        this.setMinute = (minute) => {
-            this.value = setMinutes(this.value, minute).getTime();
-        };
-        this.setSecond = (second) => {
-            this.value = setSeconds(this.value, second).getTime();
+        this.setValue = (opts) => {
+            var _a, _b, _c, _d;
+            const newValue = set((_a = this.value) !== null && _a !== void 0 ? _a : new Date(), {
+                year: (_b = opts.day) === null || _b === void 0 ? void 0 : _b.getFullYear(),
+                month: (_c = opts.day) === null || _c === void 0 ? void 0 : _c.getMonth(),
+                date: (_d = opts.day) === null || _d === void 0 ? void 0 : _d.getDate(),
+                hours: opts.hour,
+                minutes: opts.minute,
+                seconds: opts.second
+            });
+            this.value = newValue.getTime();
+            this.valueChange.emit(this.value);
         };
         this.scrollTimeIntoView = () => {
             this.el.shadowRoot.querySelectorAll('.timepicker-column').forEach(column => {
-                var _a;
-                (_a = column.querySelector('je-button[color="primary"][fill="solid"]')) === null || _a === void 0 ? void 0 : _a.scrollIntoView({ block: 'center', behavior: 'smooth' });
+                var _a, _b;
+                (_b = (_a = column.querySelector('je-button[color="primary"][fill="solid"]')) === null || _a === void 0 ? void 0 : _a.shadowRoot.querySelector('button')) === null || _b === void 0 ? void 0 : _b.scrollIntoView({ block: 'center', behavior: 'instant' });
             });
         };
     }
@@ -50,7 +47,6 @@ export class JeDatepicker {
         if (this.value) {
             this.currentDate = new Date(this.value);
         }
-        this.valueChange.emit(this.value ? new Date(this.value).getTime() : undefined);
     }
     render() {
         const firstDayOfMonth = startOfMonth(this.currentDate);
@@ -62,12 +58,12 @@ export class JeDatepicker {
         const daysBefore = Array.from({ length: firstDayOfWeek }).map((_, i) => subMonths(this.currentDate, 1).setDate(prevMonthEnd.getDate() - (firstDayOfWeek - i - 1)));
         const lastDayOfWeek = getDay(lastDayOfMonth);
         const daysAfter = Array.from({ length: 6 - lastDayOfWeek }).map((_, i) => addMonths(this.currentDate, 1).setDate(i + 1));
-        return (h(Host, { key: 'b98a066fbe52dbdfd1cbdceaa2f0dee60b33cc23' }, (this.type == 'date' || this.type == 'datetime') && (h(Fragment, { key: '7d0b6573e3e5093da30d34c1477e2e83ca826a82' }, h("div", { key: '0011cf847d1211351d4d11b387fa5d3af5505c35', class: "header" }, h("je-icon-button", { key: 'b95ca07bdd17ea031822ce26be1d757cbf36904b', icon: 'keyboard_double_arrow_left', onClick: this.prevYear }), h("je-icon-button", { key: '6c29c5a3387fcb722847fe1323f31e28bc407450', icon: 'keyboard_arrow_left', onClick: this.prevMonth }), h("span", { key: 'bc2f58d9906e06d025a7b57ad3cd2d401a2bca68' }, format(this.currentDate, 'MMMM yyyy')), h("je-icon-button", { key: '3f8ddca9bf1b02a4967350625aa1f2ddaa44b816', icon: 'keyboard_arrow_right', onClick: this.nextMonth }), h("je-icon-button", { key: '773923004e744dfbd3e789e205a89b07b6a2d5e5', icon: 'keyboard_double_arrow_right', onClick: this.nextYear })), h("div", { key: '5f7d1d002add648381ab42fd0bfb782c24f7bb02', class: "weekdays-grid" }, daysOfWeek.map(day => h("div", null, day))), h("div", { key: '8f3cd3f021d9a0945bd90c3e196096bd62d78558', class: "days-grid" }, daysBefore.map(day => (h("je-button", { expand: true, disabled: true, color: 'secondary', fill: 'clear', class: 'day' }, format(day, 'd')))), daysInMonth.map(day => {
+        return (h(Host, { key: '001acd2a99d94de7f0e33fd6453d7c4f5c9779da' }, (this.type == 'date' || this.type == 'datetime') && (h(Fragment, { key: 'c30cbabed1c5e0c25383e5ed8965a93155f39eb8' }, h("div", { key: 'bf665a24f3756940db6823e0d54c1db147374e71', class: "header" }, h("je-icon-button", { key: '535074bbfe25a0af354569f6628f45294cda650d', icon: 'keyboard_double_arrow_left', onClick: this.prevYear }), h("je-icon-button", { key: 'a284b3c39e1fe1f1beb444d0f91e04510c978194', icon: 'keyboard_arrow_left', onClick: this.prevMonth }), h("span", { key: '30c22009f6114f781654626cf1889a2c7f84b6ac' }, format(this.currentDate, 'MMMM yyyy')), h("je-icon-button", { key: '6bf8cc4cd9482203c927f68efdf735644f783bc7', icon: 'keyboard_arrow_right', onClick: this.nextMonth }), h("je-icon-button", { key: 'c7895236c227bed7709d863518d7867112fa9c12', icon: 'keyboard_double_arrow_right', onClick: this.nextYear })), h("div", { key: '39f1be73032a4d63958751a8ea3e66706d0413d2', class: "weekdays-grid" }, daysOfWeek.map(day => h("div", null, day))), h("div", { key: '2a38bbb66188746c867ce37dce552869793c19c8', class: "days-grid" }, daysBefore.map(day => (h("je-button", { expand: true, disabled: true, color: 'secondary', fill: 'clear', class: 'day' }, format(day, 'd')))), daysInMonth.map(day => {
             const selected = this.value && isSameDay(day, this.value);
             const today = isToday(day);
             const isDisabled = (this.isDateDisabled && this.isDateDisabled(day)) || (this.min && day < new Date(this.min)) || (this.max && day > new Date(this.max));
-            return (h("je-button", { expand: true, disabled: isDisabled, color: selected || today ? 'primary' : isDisabled ? 'secondary' : undefined, fill: selected ? 'solid' : 'clear', class: 'day', onClick: () => this.setDay(day) }, format(day, 'd')));
-        }), daysAfter.map(day => (h("je-button", { expand: true, disabled: true, color: 'secondary', fill: 'clear', class: 'day' }, format(day, 'd'))))))), (this.type == 'time' || this.type == 'datetime') && (h("div", { key: 'f50f591eeb16d5a8732e9b30a42eba673f32384d', class: 'timepicker' }, h("span", { key: '6927deea9958b340cca4cd7637ca2603c6edc63c' }, "Time"), h("je-popover", { key: '12138f92fcef7386ea1ab7288ba25fa7af2c6796', arrow: true, onPresent: this.scrollTimeIntoView }, h("je-pill", { key: 'a905c257376113e808b35616c94e5cf2b413270d', slot: 'trigger' }, this.value ? (this.includeSeconds ? format(this.value, 'hh:mm:ss a') : format(this.value, 'hh:mm a')) : '-'), h("div", { key: '2af6bb66e76ec0858cbfa92694648bede547dbf0', class: 'timepicker-content' }, h("div", { key: '57ec7f9421eefe59194357a6ab6813f889a52a3f', class: 'timepicker-column' }, Array.from({ length: 24 }).map((_, hour) => (h("je-button", { size: 'sm', color: this.currentDate.getHours() === hour ? 'primary' : undefined, fill: this.currentDate.getHours() === hour ? 'solid' : 'clear', onClick: () => this.setHour(hour) }, format(new Date().setHours(hour), 'hh a'))))), h("div", { key: '14daad853052b211b6a491a00b0e43a492129502', class: 'timepicker-column' }, Array.from({ length: 60 }).map((_, minute) => (h("je-button", { size: 'sm', color: this.currentDate.getMinutes() === minute ? 'primary' : undefined, fill: this.currentDate.getMinutes() === minute ? 'solid' : 'clear', onClick: () => this.setMinute(minute) }, format(new Date().setMinutes(minute), 'mm'))))), this.includeSeconds && (h("div", { key: '2f892c17024c84abdd0c9e94f839943738696248', class: 'timepicker-column' }, Array.from({ length: 60 }).map((_, second) => (h("je-button", { size: 'sm', color: this.currentDate.getSeconds() === second ? 'primary' : undefined, fill: this.currentDate.getSeconds() === second ? 'solid' : 'clear', onClick: () => this.setSecond(second) }, format(new Date().setSeconds(second), 'ss'))))))))))));
+            return (h("je-button", { expand: true, disabled: isDisabled, color: selected || today ? 'primary' : isDisabled ? 'secondary' : undefined, fill: selected ? 'solid' : 'clear', class: 'day', onClick: () => this.setValue({ day }) }, format(day, 'd')));
+        }), daysAfter.map(day => (h("je-button", { expand: true, disabled: true, color: 'secondary', fill: 'clear', class: 'day' }, format(day, 'd'))))))), (this.type == 'time' || this.type == 'datetime') && (h("div", { key: 'ccfdb4a84c2738633e12715ad549f5816fdeae54', class: 'timepicker' }, h("span", { key: 'bc4dfa532659ed667f470f22e8c2a9c90a4657cf' }, "Time"), h("je-popover", { key: '835045046be299fb244ba91982443eeb4bc7a669', arrow: true, onPresent: this.scrollTimeIntoView }, h("je-pill", { key: 'fa9f3cb90597b04b44563dc77493652a9d0d8d9e', role: 'button', tabindex: 0, slot: 'trigger' }, this.value ? (this.includeSeconds ? format(this.value, 'hh:mm:ss a') : format(this.value, 'hh:mm a')) : '-'), h("div", { key: '8385bf430461cde71f485cee75018f6cf94351b4', class: 'timepicker-content' }, h("div", { key: 'c4cb33fd35308410c9b00151d8d8b715bc7d1202', class: 'timepicker-column' }, Array.from({ length: 24 }).map((_, hour) => (h("je-button", { size: 'sm', color: this.currentDate.getHours() === hour ? 'primary' : undefined, fill: this.currentDate.getHours() === hour ? 'solid' : 'clear', onClick: () => this.setValue({ hour }) }, format(new Date().setHours(hour), 'hh a'))))), h("div", { key: 'a954cbd332a79376ff5be0eb151f49d91ed5d3b1', class: 'timepicker-column' }, Array.from({ length: 60 }).map((_, minute) => (h("je-button", { size: 'sm', color: this.currentDate.getMinutes() === minute ? 'primary' : undefined, fill: this.currentDate.getMinutes() === minute ? 'solid' : 'clear', onClick: () => this.setValue({ minute }) }, format(new Date().setMinutes(minute), 'mm'))))), this.includeSeconds && (h("div", { key: '1919fa66ede1f38866550d5b376a27d7d040a56a', class: 'timepicker-column' }, Array.from({ length: 60 }).map((_, second) => (h("je-button", { size: 'sm', color: this.currentDate.getSeconds() === second ? 'primary' : undefined, fill: this.currentDate.getSeconds() === second ? 'solid' : 'clear', onClick: () => this.setValue({ second }) }, format(new Date().setSeconds(second), 'ss'))))))))))));
     }
     static get is() { return "je-datepicker"; }
     static get encapsulation() { return "shadow"; }
@@ -222,7 +218,7 @@ export class JeDatepicker {
                     "text": ""
                 },
                 "complexType": {
-                    "original": "number | undefined",
+                    "original": "number",
                     "resolved": "number",
                     "references": {}
                 }

package/dist/collection/components/je-datepicker/je-datepicker.js.map

@@ -1 +1 @@
-{"version":3,"file":"je-datepicker.js","sourceRoot":"","sources":["../../../src/components/je-datepicker/je-datepicker.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, Fragment, Host, Prop, State, Watch, h } from '@stencil/core';\nimport { startOfMonth, endOfMonth, eachDayOfInterval, addMonths, subMonths, isSameDay, isToday, format, getDay, set, setHours, setMinutes, setSeconds } from 'date-fns';\n\nconst daysOfWeek = ['S', 'M', 'T', 'W', 'T', 'F', 'S'] as const;\n\n@Component({\n  tag: 'je-datepicker',\n  styleUrl: 'je-datepicker.scss',\n  shadow: true,\n})\nexport class JeDatepicker {\n  @Element() el!: HTMLJeDatepickerElement;\n  @State() currentDate = new Date();\n  @Prop() type: 'date' | 'datetime' | 'time' = 'datetime';\n  @Prop() includeSeconds = false;\n  @Prop() min?: number;\n  @Prop() max?: number;\n  @Prop() isDateDisabled?: (date: Date) => boolean;\n  @Prop({ mutable: true }) value?: number;\n  @Event() valueChange: EventEmitter<number | undefined>;\n\n  componentWillLoad() {\n    if (this.value) {\n      this.currentDate = new Date(this.value);\n    }\n  }\n\n  @Watch('value')\n  valueChangeHandler() {\n    if (this.value) {\n      this.currentDate = new Date(this.value);\n    }\n    this.valueChange.emit(this.value ? new Date(this.value).getTime() : undefined);\n  }\n\n  nextMonth = () => {\n    this.currentDate = addMonths(this.currentDate, 1);\n  }\n\n  prevMonth = () => {\n    this.currentDate = subMonths(this.currentDate, 1);\n  }\n\n  nextYear = () => {\n    this.currentDate = addMonths(this.currentDate, 12);\n  }\n\n  prevYear = () => {\n    this.currentDate = subMonths(this.currentDate, 12);\n  }\n\n  setDay = (day: Date) => {\n    this.value = set(this.value, {\n      year: day.getFullYear(),\n      month: day.getMonth(),\n      date: day.getDate()\n    }).getTime();\n  }\n\n  setHour = (hour: number) => {\n    this.value = setHours(this.value, hour).getTime();\n  }\n\n  setMinute = (minute: number) => {\n    this.value = setMinutes(this.value, minute).getTime();\n  }\n\n  setSecond = (second: number) => {\n    this.value = setSeconds(this.value, second).getTime();\n  }\n\n  scrollTimeIntoView = () => {\n    this.el.shadowRoot.querySelectorAll('.timepicker-column').forEach(column => {\n      column.querySelector('je-button[color=\"primary\"][fill=\"solid\"]')?.scrollIntoView({ block: 'center', behavior: 'smooth'});\n    });\n  }\n\n  render() {\n    const firstDayOfMonth = startOfMonth(this.currentDate);\n    const lastDayOfMonth = endOfMonth(this.currentDate);\n    const daysInMonth = eachDayOfInterval({ start: firstDayOfMonth, end: lastDayOfMonth });\n\n    const prevMonth = subMonths(this.currentDate, 1);\n    const prevMonthEnd = endOfMonth(prevMonth);\n\n    const firstDayOfWeek = getDay(firstDayOfMonth);\n    const daysBefore = Array.from({ length: firstDayOfWeek }).map((_, i) =>\n      subMonths(this.currentDate, 1).setDate(prevMonthEnd.getDate() - (firstDayOfWeek - i - 1))\n    );\n\n    const lastDayOfWeek = getDay(lastDayOfMonth);\n    const daysAfter = Array.from({ length: 6 - lastDayOfWeek }).map((_, i) =>\n      addMonths(this.currentDate, 1).setDate(i + 1)\n    );\n\n    return (\n      <Host>\n        {(this.type == 'date' || this.type == 'datetime') && (\n          <Fragment>\n            <div class=\"header\">\n              <je-icon-button icon='keyboard_double_arrow_left' onClick={this.prevYear} />\n              <je-icon-button icon='keyboard_arrow_left' onClick={this.prevMonth} />\n              <span>{format(this.currentDate, 'MMMM yyyy')}</span>\n              <je-icon-button icon='keyboard_arrow_right' onClick={this.nextMonth} />\n              <je-icon-button icon='keyboard_double_arrow_right' onClick={this.nextYear} />\n            </div>\n\n            <div class=\"weekdays-grid\">\n              {daysOfWeek.map(day => <div>{day}</div>)}\n            </div>\n\n            <div class=\"days-grid\">\n              {daysBefore.map(day => (\n                <je-button expand={true} disabled={true} color='secondary' fill='clear' class='day'>\n                  {format(day, 'd')}\n                </je-button>\n              ))}\n\n              {daysInMonth.map(day => {\n                const selected = this.value && isSameDay(day, this.value);\n                const today = isToday(day);\n                const isDisabled = (this.isDateDisabled && this.isDateDisabled(day)) || (this.min && day < new Date(this.min)) || (this.max && day > new Date(this.max));\n                return (\n                  <je-button\n                    expand={true}\n                    disabled={isDisabled}\n                    color={selected || today ? 'primary' : isDisabled ? 'secondary' : undefined}\n                    fill={selected ? 'solid' : 'clear'}\n                    class='day'\n                    onClick={() => this.setDay(day)}\n                  >\n                    {format(day, 'd')}\n                  </je-button>\n                );\n              })}\n\n              {daysAfter.map(day => (\n                <je-button expand={true} disabled={true} color='secondary' fill='clear' class='day'>\n                  {format(day, 'd')}\n                </je-button>\n              ))}\n            </div>\n          </Fragment>\n        )}\n        {(this.type == 'time' || this.type == 'datetime') && (\n          <div class='timepicker'>\n            <span>Time</span>\n            <je-popover arrow={true} onPresent={this.scrollTimeIntoView}>\n              <je-pill slot='trigger'>\n                {this.value ? (\n                  this.includeSeconds ? format(this.value, 'hh:mm:ss a') : format(this.value, 'hh:mm a')\n                ) : '-'}\n              </je-pill>\n              <div class='timepicker-content'>\n                <div class='timepicker-column'>\n                  {Array.from({ length: 24 }).map((_, hour) => (\n                    <je-button\n                      size='sm'\n                      color={this.currentDate.getHours() === hour ? 'primary' : undefined}\n                      fill={this.currentDate.getHours() === hour ? 'solid' : 'clear'}\n                      onClick={() => this.setHour(hour)}\n                    >\n                      {format(new Date().setHours(hour), 'hh a')}\n                    </je-button>\n                  ))}\n                </div>\n                <div class='timepicker-column'>\n                  {Array.from({ length: 60 }).map((_, minute) => (\n                    <je-button\n                      size='sm'\n                      color={this.currentDate.getMinutes() === minute ? 'primary' : undefined}\n                      fill={this.currentDate.getMinutes() === minute ? 'solid' : 'clear'}\n                      onClick={() => this.setMinute(minute)}\n                    >\n                      {format(new Date().setMinutes(minute), 'mm')}\n                    </je-button>\n                  ))}\n                </div>\n                {this.includeSeconds && (\n                  <div class='timepicker-column'>\n                    {Array.from({ length: 60 }).map((_, second) => (\n                      <je-button\n                        size='sm'\n                        color={this.currentDate.getSeconds() === second ? 'primary' : undefined}\n                        fill={this.currentDate.getSeconds() === second ? 'solid' : 'clear'}\n                        onClick={() => this.setSecond(second)}\n                      >\n                        {format(new Date().setSeconds(second), 'ss')}\n                      </je-button>\n                    ))}\n                  </div>\n                )}\n              </div>\n            </je-popover>\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"je-datepicker.js","sourceRoot":"","sources":["../../../src/components/je-datepicker/je-datepicker.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, Fragment, Host, Prop, State, Watch, h } from '@stencil/core';\nimport { startOfMonth, endOfMonth, eachDayOfInterval, addMonths, subMonths, isSameDay, isToday, format, getDay, set } from 'date-fns';\n\nconst daysOfWeek = ['S', 'M', 'T', 'W', 'T', 'F', 'S'] as const;\n\n@Component({\n  tag: 'je-datepicker',\n  styleUrl: 'je-datepicker.scss',\n  shadow: true,\n})\nexport class JeDatepicker {\n  @Element() el!: HTMLJeDatepickerElement;\n  @State() currentDate = new Date();\n  @Prop() type: 'date' | 'datetime' | 'time' = 'datetime';\n  @Prop() includeSeconds = false;\n  @Prop() min?: number;\n  @Prop() max?: number;\n  @Prop() isDateDisabled?: (date: Date) => boolean;\n  @Prop({ mutable: true }) value?: number;\n  @Event() valueChange: EventEmitter<number>;\n\n  componentWillLoad() {\n    if (this.value) {\n      this.currentDate = new Date(this.value);\n    }\n  }\n\n  @Watch('value')\n  valueChangeHandler() {\n    if (this.value) {\n      this.currentDate = new Date(this.value);\n    }\n  }\n\n  nextMonth = () => {\n    this.currentDate = addMonths(this.currentDate, 1);\n  }\n\n  prevMonth = () => {\n    this.currentDate = subMonths(this.currentDate, 1);\n  }\n\n  nextYear = () => {\n    this.currentDate = addMonths(this.currentDate, 12);\n  }\n\n  prevYear = () => {\n    this.currentDate = subMonths(this.currentDate, 12);\n  }\n\n  setValue = (opts: { day?: Date, hour?: number, minute?: number, second?: number }) => {\n    const newValue = set(this.value ?? new Date(), {\n      year: opts.day?.getFullYear(),\n      month: opts.day?.getMonth(),\n      date: opts.day?.getDate(),\n      hours: opts.hour,\n      minutes: opts.minute,\n      seconds: opts.second\n    })\n    this.value = newValue.getTime();\n    this.valueChange.emit(this.value);\n  }\n\n  scrollTimeIntoView = () => {\n    this.el.shadowRoot.querySelectorAll('.timepicker-column').forEach(column => {\n      column.querySelector('je-button[color=\"primary\"][fill=\"solid\"]')\n        ?.shadowRoot.querySelector('button')\n        ?.scrollIntoView({ block: 'center', behavior: 'instant' });\n    });\n  }\n\n  render() {\n    const firstDayOfMonth = startOfMonth(this.currentDate);\n    const lastDayOfMonth = endOfMonth(this.currentDate);\n    const daysInMonth = eachDayOfInterval({ start: firstDayOfMonth, end: lastDayOfMonth });\n\n    const prevMonth = subMonths(this.currentDate, 1);\n    const prevMonthEnd = endOfMonth(prevMonth);\n\n    const firstDayOfWeek = getDay(firstDayOfMonth);\n    const daysBefore = Array.from({ length: firstDayOfWeek }).map((_, i) =>\n      subMonths(this.currentDate, 1).setDate(prevMonthEnd.getDate() - (firstDayOfWeek - i - 1))\n    );\n\n    const lastDayOfWeek = getDay(lastDayOfMonth);\n    const daysAfter = Array.from({ length: 6 - lastDayOfWeek }).map((_, i) =>\n      addMonths(this.currentDate, 1).setDate(i + 1)\n    );\n\n    return (\n      <Host>\n        {(this.type == 'date' || this.type == 'datetime') && (\n          <Fragment>\n            <div class=\"header\">\n              <je-icon-button icon='keyboard_double_arrow_left' onClick={this.prevYear} />\n              <je-icon-button icon='keyboard_arrow_left' onClick={this.prevMonth} />\n              <span>{format(this.currentDate, 'MMMM yyyy')}</span>\n              <je-icon-button icon='keyboard_arrow_right' onClick={this.nextMonth} />\n              <je-icon-button icon='keyboard_double_arrow_right' onClick={this.nextYear} />\n            </div>\n\n            <div class=\"weekdays-grid\">\n              {daysOfWeek.map(day => <div>{day}</div>)}\n            </div>\n\n            <div class=\"days-grid\">\n              {daysBefore.map(day => (\n                <je-button expand={true} disabled={true} color='secondary' fill='clear' class='day'>\n                  {format(day, 'd')}\n                </je-button>\n              ))}\n\n              {daysInMonth.map(day => {\n                const selected = this.value && isSameDay(day, this.value);\n                const today = isToday(day);\n                const isDisabled = (this.isDateDisabled && this.isDateDisabled(day)) || (this.min && day < new Date(this.min)) || (this.max && day > new Date(this.max));\n                return (\n                  <je-button\n                    expand={true}\n                    disabled={isDisabled}\n                    color={selected || today ? 'primary' : isDisabled ? 'secondary' : undefined}\n                    fill={selected ? 'solid' : 'clear'}\n                    class='day'\n                    onClick={() => this.setValue({day})}\n                  >\n                    {format(day, 'd')}\n                  </je-button>\n                );\n              })}\n\n              {daysAfter.map(day => (\n                <je-button expand={true} disabled={true} color='secondary' fill='clear' class='day'>\n                  {format(day, 'd')}\n                </je-button>\n              ))}\n            </div>\n          </Fragment>\n        )}\n        {(this.type == 'time' || this.type == 'datetime') && (\n          <div class='timepicker'>\n            <span>Time</span>\n            <je-popover arrow={true} onPresent={this.scrollTimeIntoView}>\n              <je-pill role='button' {...{tabindex: 0}} slot='trigger'>\n                {this.value ? (\n                  this.includeSeconds ? format(this.value, 'hh:mm:ss a') : format(this.value, 'hh:mm a')\n                ) : '-'}\n              </je-pill>\n              <div class='timepicker-content'>\n                <div class='timepicker-column'>\n                  {Array.from({ length: 24 }).map((_, hour) => (\n                    <je-button\n                      size='sm'\n                      color={this.currentDate.getHours() === hour ? 'primary' : undefined}\n                      fill={this.currentDate.getHours() === hour ? 'solid' : 'clear'}\n                      onClick={() => this.setValue({hour})}\n                    >\n                      {format(new Date().setHours(hour), 'hh a')}\n                    </je-button>\n                  ))}\n                </div>\n                <div class='timepicker-column'>\n                  {Array.from({ length: 60 }).map((_, minute) => (\n                    <je-button\n                      size='sm'\n                      color={this.currentDate.getMinutes() === minute ? 'primary' : undefined}\n                      fill={this.currentDate.getMinutes() === minute ? 'solid' : 'clear'}\n                      onClick={() => this.setValue({minute})}\n                    >\n                      {format(new Date().setMinutes(minute), 'mm')}\n                    </je-button>\n                  ))}\n                </div>\n                {this.includeSeconds && (\n                  <div class='timepicker-column'>\n                    {Array.from({ length: 60 }).map((_, second) => (\n                      <je-button\n                        size='sm'\n                        color={this.currentDate.getSeconds() === second ? 'primary' : undefined}\n                        fill={this.currentDate.getSeconds() === second ? 'solid' : 'clear'}\n                        onClick={() => this.setValue({second})}\n                      >\n                        {format(new Date().setSeconds(second), 'ss')}\n                      </je-button>\n                    ))}\n                  </div>\n                )}\n              </div>\n            </je-popover>\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/je-pill/je-pill.css

@@ -3,39 +3,36 @@
   align-items: center;
   justify-content: center;
   box-sizing: border-box;
-  gap: var(--je-spacing-2xs);
-  padding-inline: 4px;
-  border-radius: var(--je-border-radius, 2px);
-  height: 20px;
-  min-width: 40px;
+  gap: var(--je-spacing-xs, 0.5rem);
+  padding-inline: var(--je-spacing-xs, 0.5rem);
+  border-radius: var(--je-radius-md, 0.375rem);
+  height: 1.5rem;
+  min-width: 2.5rem;
   -webkit-user-select: none;
   user-select: none;
   transition: all 125ms ease-in-out;
   color: var(--je-pill-color);
   background-color: var(--je-pill-background);
-  --je-pill-color: var(--je-primary-500, buttonface);
-  --je-pill-background: var(--je-primary-100, buttontext);
-  --je-pill-hover-background: var(--je-primary-200, buttontext);
+  --je-pill-color: var(--je-primary, #4141e8);
+  --je-pill-background: color-mix(in srgb, var(--je-primary, #4141e8) 20%, white 80%);
+  --je-pill-hover-background: color-mix(in srgb, var(--je-primary, #4141e8) 40%, white 60%);
 }
 
-:host(:not([button=false])) {
+:host([role=button]) {
   cursor: pointer;
 }
-:host(:not([button=false])) ::slotted(je-icon) {
-  cursor: pointer;
+
+:host([role=button][disabled]) {
+  opacity: 0.6;
+  cursor: not-allowed;
 }
 
 @media (hover: hover) {
-  :host(:not([button=false]):not([disabled]):hover) {
+  :host([role=button]:not([disabled]):hover) {
     --je-pill-background: var(--je-pill-hover-background);
   }
 }
 
-:host([disabled]) {
-  opacity: 0.8;
-  cursor: default;
-}
-
 :host([outline]) {
   background-color: transparent;
   color: var(--je-pill-color);

package/dist/collection/components/je-pill/je-pill.js

@@ -2,11 +2,14 @@ import { Host, h } from "@stencil/core";
 export class JePill {
     constructor() {
         this.outline = false;
-        this.button = true;
-        this.disabled = false;
+    }
+    onClick(ev) {
+        if (this.el.role == 'button' && (ev.key == ' ' || ev.key == 'Enter')) {
+            this.el.click();
+        }
     }
     render() {
-        return (h(Host, { key: '8e8b4caf9684c5ac5d4e92aac5988a7bab70393a' }, h("slot", { key: '459f21016cd0577bcccff43252b9a7c0b8e2e4b7' })));
+        return (h(Host, { key: '821cec5f9cdf0da827cc016dd303b7e7d453b142' }, h("slot", { key: 'e16c13a98cedb8434cb471adbbd6f2b1ddf74f2b' })));
     }
     static get is() { return "je-pill"; }
     static get encapsulation() { return "shadow"; }
@@ -41,48 +44,18 @@ export class JePill {
                 "setter": false,
                 "reflect": true,
                 "defaultValue": "false"
-            },
-            "button": {
-                "type": "boolean",
-                "attribute": "button",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": true,
-                "defaultValue": "true"
-            },
-            "disabled": {
-                "type": "boolean",
-                "attribute": "disabled",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": true,
-                "defaultValue": "false"
             }
         };
     }
+    static get elementRef() { return "el"; }
+    static get listeners() {
+        return [{
+                "name": "keydown",
+                "method": "onClick",
+                "target": undefined,
+                "capture": true,
+                "passive": false
+            }];
+    }
 }
 //# sourceMappingURL=je-pill.js.map

package/dist/collection/components/je-pill/je-pill.js.map

@@ -1 +1 @@
-{"version":3,"file":"je-pill.js","sourceRoot":"","sources":["../../../src/components/je-pill/je-pill.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAOzD,MAAM,OAAO,MAAM;IALnB;QAM2B,YAAO,GAAG,KAAK,CAAC;QAChB,WAAM,GAAG,IAAI,CAAC;QACd,aAAQ,GAAG,KAAK,CAAC;KAS3C;IAPC,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,8DAAa,CACR,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Host, Prop, h } from '@stencil/core';\n\n@Component({\n  tag: 'je-pill',\n  styleUrl: 'je-pill.scss',\n  shadow: true,\n})\nexport class JePill {\n  @Prop({ reflect: true }) outline = false;\n  @Prop({ reflect: true }) button = true;\n  @Prop({ reflect: true }) disabled = false;\n\n  render() {\n    return (\n      <Host>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"je-pill.js","sourceRoot":"","sources":["../../../src/components/je-pill/je-pill.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAO1E,MAAM,OAAO,MAAM;IALnB;QAO2B,YAAO,GAAG,KAAK,CAAC;KAgB1C;IAbC,OAAO,CAAC,EAAiB;QACvB,IAAI,IAAI,CAAC,EAAE,CAAC,IAAI,IAAI,QAAQ,IAAI,CAAC,EAAE,CAAC,GAAG,IAAI,GAAG,IAAI,EAAE,CAAC,GAAG,IAAI,OAAO,CAAC,EAAE,CAAC;YACrE,IAAI,CAAC,EAAE,CAAC,KAAK,EAAE,CAAA;QACjB,CAAC;IACH,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI;YACH,8DAAa,CACR,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Element, Host, Listen, Prop, h } from '@stencil/core';\n\n@Component({\n  tag: 'je-pill',\n  styleUrl: 'je-pill.scss',\n  shadow: true,\n})\nexport class JePill {\n  @Element() el: HTMLJePillElement\n  @Prop({ reflect: true }) outline = false;\n\n  @Listen('keydown', { capture: true })\n  onClick(ev: KeyboardEvent) {\n    if (this.el.role == 'button' && (ev.key == ' ' || ev.key == 'Enter')) {\n      this.el.click()\n    }\n  }\n\n  render() {\n    return (\n      <Host>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/je-textfield/je-textfield.css

@@ -31,12 +31,25 @@ div[part=container] {
 div[part=container].sm {
   height: 2.5rem;
 }
+div[part=container].sm textarea {
+  height: 6rem;
+}
 div[part=container].md {
   height: 3rem;
 }
+div[part=container].md textarea {
+  height: 8rem;
+}
 div[part=container].lg {
   height: 3.5rem;
 }
+div[part=container].lg textarea {
+  height: 10rem;
+}
+div[part=container].multiline {
+  align-items: baseline;
+  height: fit-content;
+}
 div[part=container].disabled {
   opacity: 0.6;
   cursor: not-allowed;
@@ -47,8 +60,10 @@ textarea {
   background-color: inherit;
   color: inherit;
   font-family: inherit;
+  box-shadow: none;
   flex: 1;
   min-width: 0;
+  box-sizing: border-box;
   outline: 0;
   border: 0;
   margin: 0;
@@ -68,4 +83,12 @@ input[type=password]::-ms-reveal, input[type=password]::-ms-clear,
 textarea[type=password]::-ms-reveal,
 textarea[type=password]::-ms-clear {
   display: none !important;
+}
+input.suppress::-webkit-calendar-picker-indicator,
+textarea.suppress::-webkit-calendar-picker-indicator {
+  display: none;
+}
+
+textarea {
+  resize: none;
 }

package/dist/collection/components/je-textfield/je-textfield.js

@@ -46,6 +46,10 @@ export class JeTextfield {
          * Optional debounce of the didInput event
          */
         this.debounce = 0;
+        /**
+         * Whether to suppress the default behavior of the input event
+         */
+        this.suppressDefaultBehavior = false;
         /**
          * Whether the control is a multiline textarea
          */
@@ -92,6 +96,7 @@ export class JeTextfield {
             if (input) {
                 const transformer = this.getTransformer();
                 this.value = (transformer === null || transformer === void 0 ? void 0 : transformer.to) ? transformer.to(input.value) : input.value;
+                this.valueChange.emit(this.value);
             }
         };
         this.onFocus = () => {
@@ -100,6 +105,10 @@ export class JeTextfield {
             else
                 this.touched = true;
         };
+        this.suppress = (ev) => {
+            if (this.suppressDefaultBehavior)
+                ev.preventDefault();
+        };
     }
     /**
      * Shows an error icon in the end slot when true. If a string is passed in, it will render the icon as a tooltip.
@@ -182,10 +191,10 @@ export class JeTextfield {
     formResetCallback() {
         this.touched = false;
         this.value = this.originalValue;
+        this.valueChange.emit(this.value);
     }
     handleValueChange() {
         this.internals.setFormValue(this.value || null);
-        this.valueChange.emit(this.value);
     }
     async getInputElement() {
         return this.inputEl;
@@ -227,7 +236,7 @@ export class JeTextfield {
     }
     render() {
         const transformer = this.getTransformer();
-        return (h(Host, { key: 'e915a37a76122280cee8da35b550d02e9c9d683e' }, h("div", { key: 'c18271cadd20d74433b7c24be91665dafa7a66bd', part: "container", class: { [this.size]: true, disabled: this.disabled, multiline: this.multiline } }, h("slot", { key: '0caa8875e650a1a3ce8c49df57ffea4888d2f557', name: "start" }), h("slot", { key: 'a1828ab2bf143cf9c1c72bc22c23a06732b63077', name: 'label' }, this.label && h("je-label", { key: 'c864e7fac1744d2ecb94319725b03f96497b760f', part: 'label', required: this.required }, this.label)), this.multiline ? (h("textarea", { part: "textarea", tabindex: 0, ref: el => (this.inputEl = el), onInputCapture: this.formatInput, onInput: this.handleInput, onFocus: this.onFocus, autoCapitalize: this.autoCapitalize, autoComplete: this.autoComplete, autoCorrect: this.autoCorrect, autoFocus: this.autoFocus, disabled: this.disabled, maxLength: this.maxlength, minLength: this.minlength, placeholder: this.placeholder, readonly: this.readonly, required: this.required, spellcheck: this.spellcheck, wrap: this.wrap, value: (transformer === null || transformer === void 0 ? void 0 : transformer.from) ? transformer.from(this.value) : this.value })) : (h("input", { part: 'input', tabindex: 0, ref: el => (this.inputEl = el), onInputCapture: this.formatInput, onInput: this.handleInput, onFocus: this.onFocus, disabled: this.disabled, autoCapitalize: this.autoCapitalize, autoComplete: this.autoComplete, autoCorrect: this.autoCorrect, autoFocus: this.autoFocus, inputMode: this.inputMode, min: this.min, max: this.max, minLength: this.minlength, maxLength: this.maxlength, pattern: this.pattern, readOnly: this.readonly, required: this.required, spellcheck: this.spellcheck, step: this.step, type: this.type == 'password' && this.showPassword ? 'text' : this.type, value: (transformer === null || transformer === void 0 ? void 0 : transformer.from) ? transformer.from(this.value) : this.value, placeholder: this.placeholder })), this.type === 'password' && (h("je-icon-button", { key: '49e207840f34d5f5209c6aaf5cbd9b89031cd996', size: "sm", icon: this.showPassword ? 'visibility_off' : 'visibility', onClick: () => (this.showPassword = !this.showPassword) })), h("slot", { key: '1b1120d947f0b2533bda4e9dcb0c8f62c4d65eb7', name: "end" }), this.pending && h("je-loading", { key: '49076313553802f11de04229fc0cd49ad081add0' }), this.success && h("je-color", { key: 'e375dcc72f93967d8ac1c7658ba6ac380e0721ad', color: "success" }, h("je-icon", { key: '0eca75698695c4c93e41d088724de99b06e3d3ee', fill: true, size: "sm" }, "check_circle")), this.error && typeof this.error === 'string' ? (h("je-tooltip", null, h("je-color", { color: "danger" }, h("je-icon", { fill: true, size: "sm" }, "error")), h("div", { slot: "content" }, this.error))) : this.error ? (h("je-color", { color: "danger" }, h("je-icon", { fill: true, size: "sm" }, "error"))) : null), h("slot", { key: '677a608f2f5017598ef8eb4bd14f1aedfb45073b', name: 'note' }, this.invalid && this.touched ? (h("je-note", { part: 'note', invalid: true }, this.internals.validationMessage)) : this.note ? (h("je-note", { part: 'note' }, this.note)) : null)));
+        return (h(Host, { key: 'a52d3a7bd3e5e0c4e6c859a72f48f893fb866bab' }, h("div", { key: 'c27748e651021af13d1ae02d13ff9c9cdca446f5', part: "container", class: { [this.size]: true, disabled: this.disabled, multiline: this.multiline } }, h("slot", { key: '6548366035abda07c31d9706bc1769e0bc5930d6', name: "start" }), h("slot", { key: '4d2d4f82ede98bb949dd6332fd41e51cce2910b8', name: 'label' }, this.label && h("je-label", { key: '7f73f66c833a4a998446d61bb3b169f8382da4c9', part: 'label', required: this.required }, this.label)), this.multiline ? (h("textarea", { part: "textarea", tabindex: 0, ref: el => (this.inputEl = el), onInputCapture: this.formatInput, onInput: this.handleInput, onFocus: this.onFocus, autoCapitalize: this.autoCapitalize, autoComplete: this.autoComplete, autoCorrect: this.autoCorrect, autoFocus: this.autoFocus, disabled: this.disabled, maxLength: this.maxlength, minLength: this.minlength, placeholder: this.placeholder, readonly: this.readonly, required: this.required, spellcheck: this.spellcheck, wrap: this.wrap, value: (transformer === null || transformer === void 0 ? void 0 : transformer.from) ? transformer.from(this.value) : this.value })) : (h("input", { part: 'input', tabindex: 0, ref: el => (this.inputEl = el), class: { suppress: this.suppressDefaultBehavior }, onInputCapture: this.formatInput, onInput: this.handleInput, onClick: this.suppress, onFocus: this.onFocus, disabled: this.disabled, autoCapitalize: this.autoCapitalize, autoComplete: this.autoComplete, autoCorrect: this.autoCorrect, autoFocus: this.autoFocus, inputMode: this.inputMode, min: this.min, max: this.max, minLength: this.minlength, maxLength: this.maxlength, pattern: this.pattern, readOnly: this.readonly, required: this.required, spellcheck: this.spellcheck, step: this.step, type: this.type == 'password' && this.showPassword ? 'text' : this.type, value: (transformer === null || transformer === void 0 ? void 0 : transformer.from) ? transformer.from(this.value) : this.value, placeholder: this.placeholder })), this.type === 'password' && (h("je-icon-button", { key: '86ac59f2f95280f02dc8613b95f94e4058ec3eb6', size: "sm", icon: this.showPassword ? 'visibility_off' : 'visibility', onClick: () => (this.showPassword = !this.showPassword) })), h("slot", { key: 'dc85d54775294f0f4959bea0b2bde250ac5b3fe9', name: "end" }), this.pending && h("je-loading", { key: '35d31a52673fee756bb81005ba20d625e1af0384' }), this.success && h("je-color", { key: 'f7cb7c4b7ef2f80749035dc92253d966d7264cc0', color: "success" }, h("je-icon", { key: '5a96015088e709dfe9cbe4456483007b136c9c10', fill: true, size: "sm" }, "check_circle")), this.error && typeof this.error === 'string' ? (h("je-tooltip", null, h("je-color", { color: "danger" }, h("je-icon", { fill: true, size: "sm" }, "error")), h("div", { slot: "content" }, this.error))) : this.error ? (h("je-color", { color: "danger" }, h("je-icon", { fill: true, size: "sm" }, "error"))) : null), h("slot", { key: 'db5b8163b06878b5a9cdf9d8884ffe2a0badedf6', name: 'note' }, this.invalid && this.touched ? (h("je-note", { part: 'note', invalid: true }, this.internals.validationMessage)) : this.note ? (h("je-note", { part: 'note' }, this.note)) : null)));
     }
     static get is() { return "je-textfield"; }
     static get encapsulation() { return "shadow"; }
@@ -759,6 +768,26 @@ export class JeTextfield {
                 "setter": false,
                 "reflect": false
             },
+            "suppressDefaultBehavior": {
+                "type": "boolean",
+                "attribute": "suppress-default-behavior",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Whether to suppress the default behavior of the input event"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "defaultValue": "false"
+            },
             "transform": {
                 "type": "string",
                 "attribute": "transform",