@haiilo/catalyst 10.17.1 → 10.19.0
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.
- package/dist/catalyst/catalyst.esm.js +1 -1
- package/dist/catalyst/catalyst.esm.js.map +1 -1
- package/dist/catalyst/{p-b1cd12bb.entry.js → p-b130db4e.entry.js} +4 -4
- package/dist/catalyst/p-b130db4e.entry.js.map +1 -0
- package/dist/cjs/cat-alert_29.cjs.entry.js +72 -61
- package/dist/cjs/cat-alert_29.cjs.entry.js.map +1 -1
- package/dist/cjs/catalyst.cjs.js +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/collection-manifest.json +2 -2
- package/dist/collection/components/cat-alert/cat-alert.js +1 -1
- package/dist/collection/components/cat-badge/cat-badge.js +1 -1
- package/dist/collection/components/cat-button/cat-button.css +3 -0
- package/dist/collection/components/cat-button/cat-button.js +14 -1
- package/dist/collection/components/cat-button/cat-button.js.map +1 -1
- package/dist/collection/components/cat-button/cat-button.spec.js +1 -1
- package/dist/collection/components/cat-button/cat-button.spec.js.map +1 -1
- package/dist/collection/components/cat-button-group/cat-button-group.js +1 -1
- package/dist/collection/components/cat-card/cat-card.js +1 -1
- package/dist/collection/components/cat-checkbox/cat-checkbox.js +2 -2
- package/dist/collection/components/cat-date/cat-date.js +2 -2
- package/dist/collection/components/cat-date-inline/cat-date-inline.js +4 -4
- package/dist/collection/components/cat-datepicker/cat-datepicker.js +3 -3
- package/dist/collection/components/cat-datepicker-inline/cat-datepicker-inline.js +2 -2
- package/dist/collection/components/cat-dropdown/cat-dropdown.js +1 -1
- package/dist/collection/components/cat-form-group/cat-form-group.js +1 -1
- package/dist/collection/components/cat-icon/cat-icon.js +1 -1
- package/dist/collection/components/cat-input/cat-input.js +4 -4
- package/dist/collection/components/cat-pagination/cat-pagination.js +2 -2
- package/dist/collection/components/cat-radio/cat-radio.js +2 -2
- package/dist/collection/components/cat-radio-group/cat-radio-group.js +1 -1
- package/dist/collection/components/cat-scrollable/cat-scrollable.js +3 -3
- package/dist/collection/components/cat-select-demo/cat-select-demo.js +1 -1
- package/dist/collection/components/cat-skeleton/cat-skeleton.js +1 -1
- package/dist/collection/components/cat-spinner/cat-spinner.js +2 -2
- package/dist/collection/components/cat-tab/cat-tab.js +1 -1
- package/dist/collection/components/cat-tabs/cat-tabs.js +1 -1
- package/dist/collection/components/cat-textarea/cat-textarea.js +3 -3
- package/dist/collection/components/cat-time/cat-time.js +2 -2
- package/dist/collection/components/cat-toggle/cat-toggle.js +2 -2
- package/dist/collection/components/cat-tooltip/cat-tooltip.js +7 -7
- package/dist/collection/components/cat-tooltip/cat-tooltip.js.map +1 -1
- package/dist/collection/index.js.map +1 -1
- package/dist/components/cat-alert.js +1 -1
- package/dist/components/cat-badge.js +1 -1
- package/dist/components/cat-button-group.js +1 -1
- package/dist/components/cat-button2.js +27 -2
- package/dist/components/cat-button2.js.map +1 -1
- package/dist/components/cat-card.js +1 -1
- package/dist/components/cat-checkbox2.js +2 -2
- package/dist/components/cat-date-inline2.js +4 -4
- package/dist/components/cat-date.js +2 -2
- package/dist/components/cat-datepicker-inline.js +2 -2
- package/dist/components/cat-datepicker.js +4 -17
- package/dist/components/cat-datepicker.js.map +1 -1
- package/dist/components/cat-dropdown2.js +1 -1
- package/dist/components/cat-form-group.js +1 -1
- package/dist/components/cat-icon2.js +1 -1
- package/dist/components/cat-input2.js +4 -4
- package/dist/components/cat-pagination.js +2 -2
- package/dist/components/cat-radio-group.js +1 -1
- package/dist/components/cat-radio.js +2 -2
- package/dist/components/cat-scrollable2.js +3 -3
- package/dist/components/cat-select-demo.js +1 -1
- package/dist/components/cat-skeleton2.js +1 -1
- package/dist/components/cat-spinner2.js +2 -2
- package/dist/components/cat-tab.js +1 -1
- package/dist/components/cat-tabs.js +1 -1
- package/dist/components/cat-textarea.js +3 -3
- package/dist/components/cat-time.js +2 -2
- package/dist/components/cat-toggle.js +2 -2
- package/dist/components/cat-tooltip.js +2 -2
- package/dist/components/cat-tooltip.js.map +1 -1
- package/dist/esm/cat-alert_29.entry.js +72 -61
- package/dist/esm/cat-alert_29.entry.js.map +1 -1
- package/dist/esm/catalyst.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/types/components/cat-button/cat-button.d.ts +3 -0
- package/dist/types/components/cat-tooltip/cat-tooltip.d.ts +2 -1
- package/dist/types/components.d.ts +4 -2
- package/dist/types/index.d.ts +1 -0
- package/package.json +2 -2
- package/dist/catalyst/p-b1cd12bb.entry.js.map +0 -1
|
@@ -819,7 +819,7 @@ const CatAlert = class {
|
|
|
819
819
|
setAttributeDefault(this, 'role', this.mapRole.get(this.color));
|
|
820
820
|
}
|
|
821
821
|
render() {
|
|
822
|
-
return (h(Host, { key: '
|
|
822
|
+
return (h(Host, { key: 'c02988c259d20cfb381b69a43cd9800a075f9c97' }, !this.noIcon && h("cat-icon", { key: 'fee7a2b021437de0c7617187e48c3e436218b50f', size: "l", icon: this.icon || this.mapIcon.get(this.color) }), h("div", { key: '4bb19866ff246d7ec956c213e39f8d09080f02da', class: "content" }, h("slot", { key: 'a3356a8b51747570f01c33cd77106156aed5c404' }))));
|
|
823
823
|
}
|
|
824
824
|
get hostElement() { return getElement(this); }
|
|
825
825
|
};
|
|
@@ -916,7 +916,7 @@ const CatBadge = class {
|
|
|
916
916
|
this.pulse = false;
|
|
917
917
|
}
|
|
918
918
|
render() {
|
|
919
|
-
return h("slot", { key: '
|
|
919
|
+
return h("slot", { key: '23ddf7fc9b33cb4410ba74dbafda8d084cdc3606' });
|
|
920
920
|
}
|
|
921
921
|
get hostElement() { return getElement(this); }
|
|
922
922
|
};
|
|
@@ -1037,7 +1037,20 @@ function createEmptyStyleRule(query) {
|
|
|
1037
1037
|
}
|
|
1038
1038
|
}
|
|
1039
1039
|
|
|
1040
|
-
const catButtonCss = ":host{display:inline-block;max-width:100%;vertical-align:middle;-webkit-user-select:none;-ms-user-select:none;user-select:none;}:host([hidden]){display:none}.cat-button{position:relative;font:inherit;display:flex;align-items:center;justify-content:center;border:none;border-radius:var(--cat-border-radius-m, 0.25rem);text-decoration:none;width:100%;box-sizing:border-box;cursor:pointer;transition:color 125ms linear, border-color 125ms linear, background-color 125ms linear, box-shadow 125ms linear}.cat-button:focus-visible{outline:2px solid rgb(var(--cat-border-color-focus, 0, 113, 255));outline-offset:1px}.cat-button-content{display:flex;flex-direction:column;min-width:0}.cat-button-content-inner{word-wrap:break-word;word-break:break-word}.cat-button-ellipsed .cat-button-content-inner{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.cat-button-disabled{cursor:not-allowed}.cat-button-round{border-radius:10rem}.cat-button-loading{cursor:default}.cat-button-loading cat-spinner{position:absolute}.cat-button-loading>*:not(cat-spinner){visibility:hidden}.cat-group-button-first{border-top-right-radius:0;border-bottom-right-radius:0}.cat-group-button-middle{border-radius:0}.cat-group-button-last{border-top-left-radius:0;border-bottom-left-radius:0}.cat-group-button:hover{z-index:1}.cat-group-button:focus-visible{z-index:2}.cat-button-filled{background-color:rgb(var(--bg));color:rgb(var(--fill));font-weight:var(--cat-font-weight-button, 600);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:greyscale}.cat-button-filled.cat-button-disabled{--bg:242, 244, 247;--fill:var(--cat-font-color-muted, 81, 92, 108)}.cat-button-outlined{background-color:white;box-shadow:inset 0 0 0 1px rgba(var(--base), 0.2);color:rgb(var(--text))}.cat-button-outlined.cat-button-disabled{--base:var(--cat-font-color-muted, 81, 92, 108);--text:var(--cat-font-color-muted, 81, 92, 108)}.cat-button-outlined:hover:not(.cat-button-disabled):not(.cat-button-loading){background-color:rgba(var(--base), 0.1)}.cat-button-outlined.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading){background-color:rgba(var(--base), 0.1)}.cat-button-outlined:active:not(.cat-button-disabled):not(.cat-button-loading){background-color:rgba(var(--base), 0.1)}.cat-button-text{background-color:transparent;color:rgb(var(--text));text-decoration:var(--cat-link-button-decoration, none)}.cat-button-text.cat-button-disabled{--text:var(--cat-font-color-muted, 81, 92, 108)}.cat-button-text:hover:not(.cat-button-disabled):not(.cat-button-loading){background-color:rgba(var(--base), 0.1)}.cat-button-text.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading){background-color:rgba(var(--base), 0.1)}.cat-button-link{background-color:transparent;color:rgb(var(--text))}.cat-button-link.cat-button-disabled{--text:var(--cat-font-color-muted, 81, 92, 108)}.cat-button-link:hover:not(.cat-button-disabled):not(.cat-button-loading){text-decoration:var(--cat-link-decoration-hover, underline)}.cat-button-link.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading){text-decoration:var(--cat-link-decoration-hover, underline)}.cat-button-primary{--bg:var(--cat-primary-bg, 0, 129, 148);--fill:var(--cat-primary-fill, 255, 255, 255);--text:var(--cat-primary-text, 0, 129, 148);--base:var(--cat-primary-text, 0, 129, 148)}.cat-button-primary:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-primary-bg-hover, 1, 115, 132);--fill:var(--cat-primary-fill-hover, 255, 255, 255);--text:var(--cat-primary-text-hover, 1, 115, 132)}.cat-button-primary.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading),.cat-button-primary:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-primary-bg-active, 2, 99, 113);--fill:var(--cat-primary-fill-active, 255, 255, 255);--text:var(--cat-primary-text-active, 2, 99, 113)}.cat-button-secondary{--bg:var(--cat-secondary-bg, 105, 118, 135);--fill:var(--cat-secondary-fill, 255, 255, 255);--text:var(--cat-secondary-text, 0, 0, 0);--base:var(--cat-secondary-bg, 105, 118, 135)}.cat-button-secondary:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-secondary-bg-hover, 105, 118, 135);--fill:var(--cat-secondary-fill-hover, 255, 255, 255);--text:var(--cat-secondary-text-hover, 0, 0, 0)}.cat-button-secondary.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading),.cat-button-secondary:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-secondary-bg-active, 105, 118, 135);--fill:var(--cat-secondary-fill-active, 255, 255, 255);--text:var(--cat-secondary-text-active, 0, 0, 0)}.cat-button-info{--bg:var(--cat-info-bg, 0, 115, 230);--fill:var(--cat-info-fill, 255, 255, 255);--text:var(--cat-info-text, 0, 115, 230);--base:var(--cat-info-text, 0, 115, 230)}.cat-button-info:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-info-bg-hover, 0, 107, 227);--fill:var(--cat-info-fill-hover, 255, 255, 255);--text:var(--cat-info-text-hover, 0, 107, 227)}.cat-button-info.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading),.cat-button-info:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-info-bg-active, 0, 96, 223);--fill:var(--cat-info-fill-active, 255, 255, 255);--text:var(--cat-info-text-active, 0, 96, 223)}.cat-button-success{--bg:var(--cat-success-bg, 0, 132, 88);--fill:var(--cat-success-fill, 255, 255, 255);--text:var(--cat-success-text, 0, 132, 88);--base:var(--cat-success-text, 0, 132, 88)}.cat-button-success:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-success-bg-hover, 0, 117, 78);--fill:var(--cat-success-fill-hover, 255, 255, 255);--text:var(--cat-success-text-hover, 0, 117, 78)}.cat-button-success.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading),.cat-button-success:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-success-bg-active, 0, 105, 70);--fill:var(--cat-success-fill-active, 255, 255, 255);--text:var(--cat-success-text-active, 0, 105, 70)}.cat-button-warning{--bg:var(--cat-warning-bg, 255, 206, 128);--fill:var(--cat-warning-fill, 0, 0, 0);--text:var(--cat-warning-text, 159, 97, 0);--base:var(--cat-warning-text, 159, 97, 0)}.cat-button-warning:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-warning-bg-hover, 255, 214, 148);--fill:var(--cat-warning-fill-hover, 0, 0, 0);--text:var(--cat-warning-text-hover, 159, 97, 0)}.cat-button-warning.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading),.cat-button-warning:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-warning-bg-active, 255, 222, 168);--fill:var(--cat-warning-fill-active, 0, 0, 0);--text:var(--cat-warning-text-active, 159, 97, 0)}.cat-button-danger{--bg:var(--cat-danger-bg, 217, 52, 13);--fill:var(--cat-danger-fill, 255, 255, 255);--text:var(--cat-danger-text, 217, 52, 13);--base:var(--cat-danger-text, 217, 52, 13)}.cat-button-danger:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-danger-bg-hover, 194, 46, 11);--fill:var(--cat-danger-fill-hover, 255, 255, 255);--text:var(--cat-danger-text-hover, 194, 46, 11)}.cat-button-danger.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading),.cat-button-danger:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-danger-bg-active, 174, 42, 10);--fill:var(--cat-danger-fill-active, 255, 255, 255);--text:var(--cat-danger-text-active, 174, 42, 10)}:host(.cat-button-pull:not([size])){margin:-0.625rem -0.75rem}:host(.cat-button-pull-h:not([size])){margin-left:-0.75rem;margin-right:-0.75rem}:host(.cat-button-pull-v:not([size])){margin-top:-0.625rem;margin-bottom:-0.625rem}:host(.cat-button-pull-t:not([size])){margin-top:-0.625rem}:host(.cat-button-pull-l:not([size])){margin-left:-0.75rem}:host(.cat-button-pull-b:not([size])){margin-bottom:-0.625rem}:host(.cat-button-pull-r:not([size])){margin-right:-0.75rem}.cat-button-xs{min-width:1.5rem;padding:0.1875rem 0.25rem;font-size:0.875rem;line-height:1.125rem;gap:0.25rem}.cat-button-xs.cat-button-icon{width:1.5rem;height:1.5rem;padding:0}:host(.cat-button-pull[size=xs]){margin:-0.1875rem -0.25rem}:host(.cat-button-pull-h[size=xs]){margin-left:-0.25rem;margin-right:-0.25rem}:host(.cat-button-pull-v[size=xs]){margin-top:-0.1875rem;margin-bottom:-0.1875rem}:host(.cat-button-pull-t[size=xs]){margin-top:-0.1875rem}:host(.cat-button-pull-l[size=xs]){margin-left:-0.25rem}:host(.cat-button-pull-b[size=xs]){margin-bottom:-0.1875rem}:host(.cat-button-pull-r[size=xs]){margin-right:-0.25rem}.cat-button-s{min-width:2rem;padding:0.375rem 0.5rem;font-size:0.9375rem;line-height:1.25rem;gap:0.25rem}.cat-button-s cat-icon{margin-top:-0.125rem;margin-bottom:-0.125rem}.cat-button-s.cat-button-icon{width:2rem;height:2rem;padding:0}:host(.cat-button-pull[size=s]){margin:-0.375rem -0.5rem}:host(.cat-button-pull-h[size=s]){margin-left:-0.5rem;margin-right:-0.5rem}:host(.cat-button-pull-v[size=s]){margin-top:-0.375rem;margin-bottom:-0.375rem}:host(.cat-button-pull-t[size=s]){margin-top:-0.375rem}:host(.cat-button-pull-l[size=s]){margin-left:-0.5rem}:host(.cat-button-pull-b[size=s]){margin-bottom:-0.375rem}:host(.cat-button-pull-r[size=s]){margin-right:-0.5rem}.cat-button-m{min-width:2.5rem;padding:0.625rem 0.75rem;font-size:0.9375rem;line-height:1.25rem;gap:0.25rem}.cat-button-m cat-icon{margin-top:-0.125rem;margin-bottom:-0.125rem}.cat-button-m.cat-button-icon{width:2.5rem;height:2.5rem;padding:0}:host(.cat-button-pull[size=m]){margin:-0.625rem -0.75rem}:host(.cat-button-pull-h[size=m]){margin-left:-0.75rem;margin-right:-0.75rem}:host(.cat-button-pull-v[size=m]){margin-top:-0.625rem;margin-bottom:-0.625rem}:host(.cat-button-pull-t[size=m]){margin-top:-0.625rem}:host(.cat-button-pull-l[size=m]){margin-left:-0.75rem}:host(.cat-button-pull-b[size=m]){margin-bottom:-0.625rem}:host(.cat-button-pull-r[size=m]){margin-right:-0.75rem}.cat-button-l{min-width:3rem;padding:0.875rem 1rem;font-size:0.9375rem;line-height:1.25rem;gap:0.25rem}.cat-button-l cat-icon{margin-top:-0.125rem;margin-bottom:-0.125rem}.cat-button-l.cat-button-icon{width:3rem;height:3rem;padding:0}:host(.cat-button-pull[size=l]){margin:-0.875rem -1rem}:host(.cat-button-pull-h[size=l]){margin-left:-1rem;margin-right:-1rem}:host(.cat-button-pull-v[size=l]){margin-top:-0.875rem;margin-bottom:-0.875rem}:host(.cat-button-pull-t[size=l]){margin-top:-0.875rem}:host(.cat-button-pull-l[size=l]){margin-left:-1rem}:host(.cat-button-pull-b[size=l]){margin-bottom:-0.875rem}:host(.cat-button-pull-r[size=l]){margin-right:-1rem}.cat-button-xl{min-width:3.5rem;padding:1rem 1.25rem;font-size:1.125rem;line-height:1.5rem;gap:0.25rem}.cat-button-xl.cat-button-icon{width:3.5rem;height:3.5rem;padding:0}:host(.cat-button-pull[size=xl]){margin:-1rem -1.25rem}:host(.cat-button-pull-h[size=xl]){margin-left:-1.25rem;margin-right:-1.25rem}:host(.cat-button-pull-v[size=xl]){margin-top:-1rem;margin-bottom:-1rem}:host(.cat-button-pull-t[size=xl]){margin-top:-1rem}:host(.cat-button-pull-l[size=xl]){margin-left:-1.25rem}:host(.cat-button-pull-b[size=xl]){margin-bottom:-1rem}:host(.cat-button-pull-r[size=xl]){margin-right:-1.25rem}:host(.cat-tab)::part(button){padding:1.125rem 0.75rem;--cat-secondary-bg:transparent;--cat-primary-text:transparent;--cat-danger-text:transparent}:host(.cat-tab)::part(content)::before{content:attr(data-text);content:attr(data-text)/\"\";height:0;visibility:hidden;overflow:hidden;user-select:none;pointer-events:none;font-weight:700}:host(.cat-text-left) .cat-button{justify-content:left;text-align:left}:host(.cat-text-right) .cat-button{justify-content:right;text-align:right}:host(.cat-nav-item){width:100%}:host(.cat-nav-item) .cat-button{box-shadow:none;justify-content:left;gap:0.5rem}:host(.cat-nav-item) .cat-button:focus-visible{outline-offset:-2px}:host(.cat-time-format) .cat-button{border-radius:0}:host(.cat-date-toggle) .cat-button,:host(.cat-time-toggle) .cat-button{margin-left:-1px;border-top-left-radius:0;border-bottom-left-radius:0}:host(.cat-date-item) .cat-button:hover,:host(.cat-date-toggle) .cat-button:hover,:host(.cat-time-format) .cat-button:hover,:host(.cat-time-toggle) .cat-button:hover{z-index:1}:host(.cat-date-item) .cat-button:focus-visible,:host(.cat-date-toggle) .cat-button:focus-visible,:host(.cat-time-format) .cat-button:focus-visible,:host(.cat-time-toggle) .cat-button:focus-visible{z-index:2}:host(.cat-date-item) .cat-button{padding:0;min-width:2rem;max-height:3rem;aspect-ratio:1}:host(.date-start:not(.date-end)) .cat-button{border-top-right-radius:0;border-bottom-right-radius:0}:host(.date-end:not(.date-start)) .cat-button{border-top-left-radius:0;border-bottom-left-radius:0}";
|
|
1040
|
+
/**
|
|
1041
|
+
* Find the closest parent element matching the given selector while traversing
|
|
1042
|
+
* up the DOM tree (including Shadow DOM).
|
|
1043
|
+
*/
|
|
1044
|
+
function findClosest(selector, element) {
|
|
1045
|
+
if (element instanceof Element && element.matches(selector)) {
|
|
1046
|
+
return element;
|
|
1047
|
+
}
|
|
1048
|
+
// Search in parent element or Shadow DOM host
|
|
1049
|
+
const nextElement = element instanceof ShadowRoot ? element.host : element.parentElement || element.getRootNode().host;
|
|
1050
|
+
return nextElement ? findClosest(selector, nextElement) : null;
|
|
1051
|
+
}
|
|
1052
|
+
|
|
1053
|
+
const catButtonCss = ":host{display:inline-block;max-width:100%;vertical-align:middle;-webkit-user-select:none;-ms-user-select:none;user-select:none;}:host([hidden]){display:none}.cat-button{position:relative;font:inherit;display:flex;align-items:center;justify-content:center;border:none;border-radius:var(--cat-border-radius-m, 0.25rem);text-decoration:none;width:100%;box-sizing:border-box;cursor:pointer;transition:color 125ms linear, border-color 125ms linear, background-color 125ms linear, box-shadow 125ms linear}.cat-button:focus-visible{outline:2px solid rgb(var(--cat-border-color-focus, 0, 113, 255));outline-offset:1px}.cat-button-content{display:flex;flex-direction:column;min-width:0}.cat-button-empty .cat-button-content{display:none}.cat-button-content-inner{word-wrap:break-word;word-break:break-word}.cat-button-ellipsed .cat-button-content-inner{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.cat-button-disabled{cursor:not-allowed}.cat-button-round{border-radius:10rem}.cat-button-loading{cursor:default}.cat-button-loading cat-spinner{position:absolute}.cat-button-loading>*:not(cat-spinner){visibility:hidden}.cat-group-button-first{border-top-right-radius:0;border-bottom-right-radius:0}.cat-group-button-middle{border-radius:0}.cat-group-button-last{border-top-left-radius:0;border-bottom-left-radius:0}.cat-group-button:hover{z-index:1}.cat-group-button:focus-visible{z-index:2}.cat-button-filled{background-color:rgb(var(--bg));color:rgb(var(--fill));font-weight:var(--cat-font-weight-button, 600);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:greyscale}.cat-button-filled.cat-button-disabled{--bg:242, 244, 247;--fill:var(--cat-font-color-muted, 81, 92, 108)}.cat-button-outlined{background-color:white;box-shadow:inset 0 0 0 1px rgba(var(--base), 0.2);color:rgb(var(--text))}.cat-button-outlined.cat-button-disabled{--base:var(--cat-font-color-muted, 81, 92, 108);--text:var(--cat-font-color-muted, 81, 92, 108)}.cat-button-outlined:hover:not(.cat-button-disabled):not(.cat-button-loading){background-color:rgba(var(--base), 0.1)}.cat-button-outlined.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading){background-color:rgba(var(--base), 0.1)}.cat-button-outlined:active:not(.cat-button-disabled):not(.cat-button-loading){background-color:rgba(var(--base), 0.1)}.cat-button-text{background-color:transparent;color:rgb(var(--text));text-decoration:var(--cat-link-button-decoration, none)}.cat-button-text.cat-button-disabled{--text:var(--cat-font-color-muted, 81, 92, 108)}.cat-button-text:hover:not(.cat-button-disabled):not(.cat-button-loading){background-color:rgba(var(--base), 0.1)}.cat-button-text.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading){background-color:rgba(var(--base), 0.1)}.cat-button-link{background-color:transparent;color:rgb(var(--text))}.cat-button-link.cat-button-disabled{--text:var(--cat-font-color-muted, 81, 92, 108)}.cat-button-link:hover:not(.cat-button-disabled):not(.cat-button-loading){text-decoration:var(--cat-link-decoration-hover, underline)}.cat-button-link.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading){text-decoration:var(--cat-link-decoration-hover, underline)}.cat-button-primary{--bg:var(--cat-primary-bg, 0, 129, 148);--fill:var(--cat-primary-fill, 255, 255, 255);--text:var(--cat-primary-text, 0, 129, 148);--base:var(--cat-primary-text, 0, 129, 148)}.cat-button-primary:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-primary-bg-hover, 1, 115, 132);--fill:var(--cat-primary-fill-hover, 255, 255, 255);--text:var(--cat-primary-text-hover, 1, 115, 132)}.cat-button-primary.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading),.cat-button-primary:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-primary-bg-active, 2, 99, 113);--fill:var(--cat-primary-fill-active, 255, 255, 255);--text:var(--cat-primary-text-active, 2, 99, 113)}.cat-button-secondary{--bg:var(--cat-secondary-bg, 105, 118, 135);--fill:var(--cat-secondary-fill, 255, 255, 255);--text:var(--cat-secondary-text, 0, 0, 0);--base:var(--cat-secondary-bg, 105, 118, 135)}.cat-button-secondary:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-secondary-bg-hover, 105, 118, 135);--fill:var(--cat-secondary-fill-hover, 255, 255, 255);--text:var(--cat-secondary-text-hover, 0, 0, 0)}.cat-button-secondary.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading),.cat-button-secondary:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-secondary-bg-active, 105, 118, 135);--fill:var(--cat-secondary-fill-active, 255, 255, 255);--text:var(--cat-secondary-text-active, 0, 0, 0)}.cat-button-info{--bg:var(--cat-info-bg, 0, 115, 230);--fill:var(--cat-info-fill, 255, 255, 255);--text:var(--cat-info-text, 0, 115, 230);--base:var(--cat-info-text, 0, 115, 230)}.cat-button-info:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-info-bg-hover, 0, 107, 227);--fill:var(--cat-info-fill-hover, 255, 255, 255);--text:var(--cat-info-text-hover, 0, 107, 227)}.cat-button-info.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading),.cat-button-info:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-info-bg-active, 0, 96, 223);--fill:var(--cat-info-fill-active, 255, 255, 255);--text:var(--cat-info-text-active, 0, 96, 223)}.cat-button-success{--bg:var(--cat-success-bg, 0, 132, 88);--fill:var(--cat-success-fill, 255, 255, 255);--text:var(--cat-success-text, 0, 132, 88);--base:var(--cat-success-text, 0, 132, 88)}.cat-button-success:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-success-bg-hover, 0, 117, 78);--fill:var(--cat-success-fill-hover, 255, 255, 255);--text:var(--cat-success-text-hover, 0, 117, 78)}.cat-button-success.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading),.cat-button-success:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-success-bg-active, 0, 105, 70);--fill:var(--cat-success-fill-active, 255, 255, 255);--text:var(--cat-success-text-active, 0, 105, 70)}.cat-button-warning{--bg:var(--cat-warning-bg, 255, 206, 128);--fill:var(--cat-warning-fill, 0, 0, 0);--text:var(--cat-warning-text, 159, 97, 0);--base:var(--cat-warning-text, 159, 97, 0)}.cat-button-warning:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-warning-bg-hover, 255, 214, 148);--fill:var(--cat-warning-fill-hover, 0, 0, 0);--text:var(--cat-warning-text-hover, 159, 97, 0)}.cat-button-warning.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading),.cat-button-warning:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-warning-bg-active, 255, 222, 168);--fill:var(--cat-warning-fill-active, 0, 0, 0);--text:var(--cat-warning-text-active, 159, 97, 0)}.cat-button-danger{--bg:var(--cat-danger-bg, 217, 52, 13);--fill:var(--cat-danger-fill, 255, 255, 255);--text:var(--cat-danger-text, 217, 52, 13);--base:var(--cat-danger-text, 217, 52, 13)}.cat-button-danger:hover:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-danger-bg-hover, 194, 46, 11);--fill:var(--cat-danger-fill-hover, 255, 255, 255);--text:var(--cat-danger-text-hover, 194, 46, 11)}.cat-button-danger.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading),.cat-button-danger:active:not(.cat-button-disabled):not(.cat-button-loading){--bg:var(--cat-danger-bg-active, 174, 42, 10);--fill:var(--cat-danger-fill-active, 255, 255, 255);--text:var(--cat-danger-text-active, 174, 42, 10)}:host(.cat-button-pull:not([size])){margin:-0.625rem -0.75rem}:host(.cat-button-pull-h:not([size])){margin-left:-0.75rem;margin-right:-0.75rem}:host(.cat-button-pull-v:not([size])){margin-top:-0.625rem;margin-bottom:-0.625rem}:host(.cat-button-pull-t:not([size])){margin-top:-0.625rem}:host(.cat-button-pull-l:not([size])){margin-left:-0.75rem}:host(.cat-button-pull-b:not([size])){margin-bottom:-0.625rem}:host(.cat-button-pull-r:not([size])){margin-right:-0.75rem}.cat-button-xs{min-width:1.5rem;padding:0.1875rem 0.25rem;font-size:0.875rem;line-height:1.125rem;gap:0.25rem}.cat-button-xs.cat-button-icon{width:1.5rem;height:1.5rem;padding:0}:host(.cat-button-pull[size=xs]){margin:-0.1875rem -0.25rem}:host(.cat-button-pull-h[size=xs]){margin-left:-0.25rem;margin-right:-0.25rem}:host(.cat-button-pull-v[size=xs]){margin-top:-0.1875rem;margin-bottom:-0.1875rem}:host(.cat-button-pull-t[size=xs]){margin-top:-0.1875rem}:host(.cat-button-pull-l[size=xs]){margin-left:-0.25rem}:host(.cat-button-pull-b[size=xs]){margin-bottom:-0.1875rem}:host(.cat-button-pull-r[size=xs]){margin-right:-0.25rem}.cat-button-s{min-width:2rem;padding:0.375rem 0.5rem;font-size:0.9375rem;line-height:1.25rem;gap:0.25rem}.cat-button-s cat-icon{margin-top:-0.125rem;margin-bottom:-0.125rem}.cat-button-s.cat-button-icon{width:2rem;height:2rem;padding:0}:host(.cat-button-pull[size=s]){margin:-0.375rem -0.5rem}:host(.cat-button-pull-h[size=s]){margin-left:-0.5rem;margin-right:-0.5rem}:host(.cat-button-pull-v[size=s]){margin-top:-0.375rem;margin-bottom:-0.375rem}:host(.cat-button-pull-t[size=s]){margin-top:-0.375rem}:host(.cat-button-pull-l[size=s]){margin-left:-0.5rem}:host(.cat-button-pull-b[size=s]){margin-bottom:-0.375rem}:host(.cat-button-pull-r[size=s]){margin-right:-0.5rem}.cat-button-m{min-width:2.5rem;padding:0.625rem 0.75rem;font-size:0.9375rem;line-height:1.25rem;gap:0.25rem}.cat-button-m cat-icon{margin-top:-0.125rem;margin-bottom:-0.125rem}.cat-button-m.cat-button-icon{width:2.5rem;height:2.5rem;padding:0}:host(.cat-button-pull[size=m]){margin:-0.625rem -0.75rem}:host(.cat-button-pull-h[size=m]){margin-left:-0.75rem;margin-right:-0.75rem}:host(.cat-button-pull-v[size=m]){margin-top:-0.625rem;margin-bottom:-0.625rem}:host(.cat-button-pull-t[size=m]){margin-top:-0.625rem}:host(.cat-button-pull-l[size=m]){margin-left:-0.75rem}:host(.cat-button-pull-b[size=m]){margin-bottom:-0.625rem}:host(.cat-button-pull-r[size=m]){margin-right:-0.75rem}.cat-button-l{min-width:3rem;padding:0.875rem 1rem;font-size:0.9375rem;line-height:1.25rem;gap:0.25rem}.cat-button-l cat-icon{margin-top:-0.125rem;margin-bottom:-0.125rem}.cat-button-l.cat-button-icon{width:3rem;height:3rem;padding:0}:host(.cat-button-pull[size=l]){margin:-0.875rem -1rem}:host(.cat-button-pull-h[size=l]){margin-left:-1rem;margin-right:-1rem}:host(.cat-button-pull-v[size=l]){margin-top:-0.875rem;margin-bottom:-0.875rem}:host(.cat-button-pull-t[size=l]){margin-top:-0.875rem}:host(.cat-button-pull-l[size=l]){margin-left:-1rem}:host(.cat-button-pull-b[size=l]){margin-bottom:-0.875rem}:host(.cat-button-pull-r[size=l]){margin-right:-1rem}.cat-button-xl{min-width:3.5rem;padding:1rem 1.25rem;font-size:1.125rem;line-height:1.5rem;gap:0.25rem}.cat-button-xl.cat-button-icon{width:3.5rem;height:3.5rem;padding:0}:host(.cat-button-pull[size=xl]){margin:-1rem -1.25rem}:host(.cat-button-pull-h[size=xl]){margin-left:-1.25rem;margin-right:-1.25rem}:host(.cat-button-pull-v[size=xl]){margin-top:-1rem;margin-bottom:-1rem}:host(.cat-button-pull-t[size=xl]){margin-top:-1rem}:host(.cat-button-pull-l[size=xl]){margin-left:-1.25rem}:host(.cat-button-pull-b[size=xl]){margin-bottom:-1rem}:host(.cat-button-pull-r[size=xl]){margin-right:-1.25rem}:host(.cat-tab)::part(button){padding:1.125rem 0.75rem;--cat-secondary-bg:transparent;--cat-primary-text:transparent;--cat-danger-text:transparent}:host(.cat-tab)::part(content)::before{content:attr(data-text);content:attr(data-text)/\"\";height:0;visibility:hidden;overflow:hidden;user-select:none;pointer-events:none;font-weight:700}:host(.cat-text-left) .cat-button{justify-content:left;text-align:left}:host(.cat-text-right) .cat-button{justify-content:right;text-align:right}:host(.cat-nav-item){width:100%}:host(.cat-nav-item) .cat-button{box-shadow:none;justify-content:left;gap:0.5rem}:host(.cat-nav-item) .cat-button:focus-visible{outline-offset:-2px}:host(.cat-time-format) .cat-button{border-radius:0}:host(.cat-date-toggle) .cat-button,:host(.cat-time-toggle) .cat-button{margin-left:-1px;border-top-left-radius:0;border-bottom-left-radius:0}:host(.cat-date-item) .cat-button:hover,:host(.cat-date-toggle) .cat-button:hover,:host(.cat-time-format) .cat-button:hover,:host(.cat-time-toggle) .cat-button:hover{z-index:1}:host(.cat-date-item) .cat-button:focus-visible,:host(.cat-date-toggle) .cat-button:focus-visible,:host(.cat-time-format) .cat-button:focus-visible,:host(.cat-time-toggle) .cat-button:focus-visible{z-index:2}:host(.cat-date-item) .cat-button{padding:0;min-width:2rem;max-height:3rem;aspect-ratio:1}:host(.date-start:not(.date-end)) .cat-button{border-top-right-radius:0;border-bottom-right-radius:0}:host(.date-end:not(.date-start)) .cat-button{border-top-left-radius:0;border-bottom-left-radius:0}";
|
|
1041
1054
|
const CatButtonStyle0 = catButtonCss;
|
|
1042
1055
|
|
|
1043
1056
|
const CatButton = class {
|
|
@@ -1047,6 +1060,7 @@ const CatButton = class {
|
|
|
1047
1060
|
this.catFocus = createEvent(this, "catFocus", 7);
|
|
1048
1061
|
this.catBlur = createEvent(this, "catBlur", 7);
|
|
1049
1062
|
this._iconOnly = true;
|
|
1063
|
+
this.hasSlottedContent = false;
|
|
1050
1064
|
this.variant = 'outlined';
|
|
1051
1065
|
this.color = 'secondary';
|
|
1052
1066
|
this.active = false;
|
|
@@ -1091,11 +1105,18 @@ const CatButton = class {
|
|
|
1091
1105
|
componentWillLoad() {
|
|
1092
1106
|
this.onIconOnlyChanged(this.iconOnly);
|
|
1093
1107
|
}
|
|
1108
|
+
componentWillRender() {
|
|
1109
|
+
this.hasSlottedContent = this.hostElement.hasChildNodes();
|
|
1110
|
+
}
|
|
1094
1111
|
haltDisabledEvents(event) {
|
|
1095
1112
|
if (this.disabled || this.loading) {
|
|
1096
1113
|
event.preventDefault();
|
|
1097
1114
|
event.stopImmediatePropagation();
|
|
1098
1115
|
}
|
|
1116
|
+
else if (this.submit) {
|
|
1117
|
+
const form = findClosest('form', this.hostElement);
|
|
1118
|
+
form?.dispatchEvent(new SubmitEvent('submit', { submitter: this.button }));
|
|
1119
|
+
}
|
|
1099
1120
|
}
|
|
1100
1121
|
/**
|
|
1101
1122
|
* Programmatically move focus to the button. Use this method instead of
|
|
@@ -1124,6 +1145,7 @@ const CatButton = class {
|
|
|
1124
1145
|
if (this.url) {
|
|
1125
1146
|
return (h("a", { ...this.nativeAttributes, ref: el => (this.button = el), href: this.disabled ? undefined : this.url, target: this.urlTarget, "aria-disabled": this.disabled ? 'true' : null, "aria-label": this.a11yLabel, "aria-current": this.a11yCurrent, id: this.buttonId, part: "button", class: {
|
|
1126
1147
|
'cat-button': true,
|
|
1148
|
+
'cat-button-empty': !this.hasSlottedContent,
|
|
1127
1149
|
'cat-button-active': this.active,
|
|
1128
1150
|
'cat-button-icon': this.isIconButton,
|
|
1129
1151
|
'cat-button-round': this.round,
|
|
@@ -1138,6 +1160,7 @@ const CatButton = class {
|
|
|
1138
1160
|
else {
|
|
1139
1161
|
return (h("button", { ...this.nativeAttributes, ref: el => (this.button = el), type: this.submit ? 'submit' : 'button', name: this.name, value: this.value, disabled: this.disabled, "aria-disabled": this.disabled ? 'true' : null, "aria-label": this.a11yLabel, "aria-current": this.a11yCurrent, id: this.buttonId, part: "button", class: {
|
|
1140
1162
|
'cat-button': true,
|
|
1163
|
+
'cat-button-empty': !this.hasSlottedContent,
|
|
1141
1164
|
'cat-button-active': this.active,
|
|
1142
1165
|
'cat-button-icon': this.isIconButton,
|
|
1143
1166
|
'cat-button-round': this.round ?? this.isIconButton,
|
|
@@ -1194,6 +1217,7 @@ const CatButton = class {
|
|
|
1194
1217
|
onBlur(event) {
|
|
1195
1218
|
this.catBlur.emit(event);
|
|
1196
1219
|
}
|
|
1220
|
+
get hostElement() { return getElement(this); }
|
|
1197
1221
|
static get watchers() { return {
|
|
1198
1222
|
"iconOnly": ["onIconOnlyChanged"]
|
|
1199
1223
|
}; }
|
|
@@ -1210,7 +1234,7 @@ const CatButtonGroup = class {
|
|
|
1210
1234
|
this.a11yLabel = undefined;
|
|
1211
1235
|
}
|
|
1212
1236
|
render() {
|
|
1213
|
-
return (h(Host, { key: '
|
|
1237
|
+
return (h(Host, { key: 'ca23ccee6536ec2cef9d82832cf16dacac31ef2a', role: "group", "aria-label": this.a11yLabel }, h("slot", { key: 'b4a3485c8595874779ef41468e5af98163c6573c', onSlotchange: this.onSlotChange.bind(this) })));
|
|
1214
1238
|
}
|
|
1215
1239
|
onSlotChange() {
|
|
1216
1240
|
this.formElements = Array.from(this.hostElement.querySelectorAll('cat-button'));
|
|
@@ -1231,7 +1255,7 @@ const CatCard = class {
|
|
|
1231
1255
|
this.catLoad = createEvent(this, "catLoad", 7);
|
|
1232
1256
|
}
|
|
1233
1257
|
render() {
|
|
1234
|
-
return h("slot", { key: '
|
|
1258
|
+
return h("slot", { key: '4d88ab8e5cf1e13a3242b646314f034f5fa0fdfe' });
|
|
1235
1259
|
}
|
|
1236
1260
|
componentDidLoad() {
|
|
1237
1261
|
this.catLoad.emit();
|
|
@@ -1314,13 +1338,13 @@ const CatCheckbox = class {
|
|
|
1314
1338
|
this.input.blur();
|
|
1315
1339
|
}
|
|
1316
1340
|
render() {
|
|
1317
|
-
return (h(Host, { key: '
|
|
1341
|
+
return (h(Host, { key: '93377a710ae9dca69f2377c48d18786f0d603479' }, h("label", { key: 'ee24cfed4f031089d3ab23611315634b584bf847', htmlFor: this.id, class: {
|
|
1318
1342
|
'is-hidden': this.labelHidden,
|
|
1319
1343
|
'is-disabled': this.disabled,
|
|
1320
1344
|
'label-left': this.labelLeft,
|
|
1321
1345
|
'align-center': this.alignment === 'center',
|
|
1322
1346
|
'align-end': this.alignment === 'bottom'
|
|
1323
|
-
} }, h("input", { key: '
|
|
1347
|
+
} }, h("input", { key: '01bfbcdf293f523835d1610359a211adfcf2a954', ...this.nativeAttributes, part: "input", ref: el => (this.input = el), id: this.id, type: "checkbox", name: this.name, value: this.value, checked: this.checked, required: this.required, disabled: this.disabled, indeterminate: this.indeterminate, onInput: this.onInput.bind(this), onFocus: this.onFocus.bind(this), onBlur: this.onBlur.bind(this), "aria-describedby": this.hasHint ? this.id + '-hint' : undefined }), h("span", { key: 'e46c25bca3339feb71a2f59f7aef4ec757394131', class: "box", "aria-hidden": "true" }, h("svg", { key: '7ac0adfde7c9b388f0a2207d5320b95250efd940', class: "check", viewBox: "0 0 12 10" }, h("polyline", { key: 'a60caaa7644dc3607410634d505eecf836241da3', points: "1.5 6 4.5 9 10.5 1" })), h("svg", { key: '151c84f2ba3e0ea9a32ffb1a6cff3378d12bb802', class: "dash", viewBox: "0 0 12 10" }, h("polyline", { key: '057ca182a51794ced52f1034e9e9eb305da9797f', points: "1.5 5 10.5 5" }))), h("span", { key: 'c4fe4df0fd4e2cc1d3c2efc408a7216ddbb4c2f1', class: "label", part: "label" }, (this.hasSlottedLabel && h("slot", { key: '44578da3c031ab6c1393b20beaf3f930ed4c3c84', name: "label" })) || this.label)), this.hasHint && (h("div", { key: 'f8c397dd0db96c87a5d07a9cd9b6ef21015ce07c', class: { 'hint-wrapper': true, 'label-left': this.labelLeft } }, h("div", { key: 'b7860816d92e4738ae5865304e9177e11749331c', class: "box-placeholder" }), h(CatFormHint, { key: '6ca384cd514070939e9cafcd60091ecfc009a738', id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && h("slot", { name: "hint" }) })))));
|
|
1324
1348
|
}
|
|
1325
1349
|
get hasHint() {
|
|
1326
1350
|
return !!this.hint || !!this.hasSlottedHint;
|
|
@@ -1536,13 +1560,13 @@ const CatDate = class {
|
|
|
1536
1560
|
this.input?.clear();
|
|
1537
1561
|
}
|
|
1538
1562
|
render() {
|
|
1539
|
-
return (h(Host, { key: '
|
|
1563
|
+
return (h(Host, { key: '188058ee5792af5b325c708388c2f7e56955626a' }, h("cat-input", { key: '5d5d3e034bacea1e586237c4f44c3b74ac6e7d5e', class: "cat-date-input", ref: el => (this.input = el), requiredMarker: this.requiredMarker, horizontal: this.horizontal, autoComplete: this.autoComplete, clearable: this.clearable, disabled: this.disabled, hint: this.hint, icon: this.icon, iconRight: this.iconRight, identifier: this.identifier, labelHidden: this.labelHidden, name: this.name, placeholder: this.placeholder, textPrefix: this.textPrefix, textSuffix: this.textSuffix, readonly: this.readonly, required: this.required, errors: this.errors, errorUpdate: this.errorUpdate, nativeAttributes: this.nativeAttributes, value: this.inputValue, onCatFocus: e => {
|
|
1540
1564
|
e.stopPropagation();
|
|
1541
1565
|
this.catFocus.emit(e.detail);
|
|
1542
1566
|
}, onCatBlur: e => {
|
|
1543
1567
|
e.stopPropagation();
|
|
1544
1568
|
this.onInputBlur(e.detail);
|
|
1545
|
-
} }, h("span", { key: '
|
|
1569
|
+
} }, h("span", { key: 'a4851b76d931f0d8e26384df0b17ae4f374d9475', slot: "label" }, this.label, h("span", { key: '94168a4f4f9f48051e223659d3e183e324c4a830', class: "label-aria" }, " (", this.locale.formatStr, ")")), h("cat-dropdown", { key: 'afcc0c1c40c30f06848eeadfc59c7eb31daab623', slot: "addon", placement: this.placement, arrowNavigation: "none", noResize: true, onCatOpen: () => this.dateInline?.resetView() }, h("cat-button", { key: '0b23f131caefde13d038907a126bccecb916b53c', slot: "trigger", icon: "$cat:datepicker-calendar", iconOnly: true, class: "cat-date-toggle", disabled: this.disabled, a11yLabel: this.getTriggerA11yLabel() }), h("div", { key: '206e03a2fb05382c9fcf8747593fe394bfa6f107', slot: "content" }, h("cat-date-inline", { key: 'be8031848a9900e5dea30435cf0d3d8a7d87169c', ref: el => (this.dateInline = el), min: this.min, max: this.max, value: this.value, hint: true, weeks: true, noClear: true, onCatChange: this.onDateChange.bind(this) }))))));
|
|
1546
1570
|
}
|
|
1547
1571
|
getTriggerA11yLabel() {
|
|
1548
1572
|
const date = this.locale.fromLocalISO(this.value);
|
|
@@ -2340,12 +2364,12 @@ const CatDateInline = class {
|
|
|
2340
2364
|
const [minDate, maxDate] = this.getMinMaxDate();
|
|
2341
2365
|
const dateGrid = this.dateGrid(this.viewDate.getFullYear(), this.viewDate.getMonth());
|
|
2342
2366
|
const [dateStart, dateEnd] = this.getValue();
|
|
2343
|
-
return (h(Host, { key: '
|
|
2367
|
+
return (h(Host, { key: 'fb573205f50b9f793bcd8f88107be6e28d0b9dad', "aria-label": this.label || undefined }, h("div", { key: '81d5094ccc8f56c93d160a72c928c530da9bf947', class: { 'label-container': true, 'label-hidden': this.labelHidden } }, (this.hasSlottedLabel || this.label) && (h("label", { key: 'ebd2d90309e689ed7461a91fd68ecd6c8dedd24d', id: `${this.id}-label`, htmlFor: this.id, part: "label", onClick: () => this.doFocus() }, h("span", { key: '12e9aef96e6ec5db1007f7060e54cea4d490d495', class: "label-wrapper" }, (this.hasSlottedLabel && h("slot", { key: '6120e89de299fedf25649c9293b9f1aad3e53c96', name: "label" })) || this.label, h("div", { key: '91c833bee02d1cdadee631df24794bd3625544fc', class: "label-metadata" }, !this.required && (this.requiredMarker ?? 'optional').startsWith('optional') && (h("span", { key: 'f8fd54451ab0a7d62c5a572d5052377357dbdc2d', class: "label-optional", "aria-hidden": "true" }, "(", catI18nRegistry.t('input.optional'), ")")), this.required && this.requiredMarker?.startsWith('required') && (h("span", { key: '5dfb4b3ae8ac7276ba5b119bbe0ae50627f17fb9', class: "label-optional", "aria-hidden": "true" }, "(", catI18nRegistry.t('input.required'), ")"))))))), h("div", { key: '3015096d18e1eb2fc3ad151602971393300142cf', class: { picker: true, 'picker-weeks': this.weeks }, id: this.id, "aria-describedby": `${this.id}-label` }, h("div", { key: '85232561729e6cad9f0c689255cbcaad3fdb41d2', class: "picker-head" }, h("cat-button", { key: 'e504a2e13094f3b286ab642dda5811e36469ab16', icon: "$cat:datepicker-year-prev", iconOnly: true, size: "xs", variant: "text", "a11y-label": this.locale.prevYear, disabled: isSameYear(this.viewDate, minDate), onClick: () => this.navigate('prev', 'year'), "data-dropdown-no-close": true }), h("cat-button", { key: '6edbea5866ebb34842f3854b2f01d491baf13f9a', icon: "$cat:datepicker-month-prev", iconOnly: true, size: "xs", variant: "text", "a11y-label": this.locale.prevMonth, disabled: isSameMonth(this.viewDate, minDate), onClick: () => this.navigate('prev', 'month'), "data-dropdown-no-close": true }), h("h3", { key: '8b4a2621adedf1cbe7843a060b095c7c13b8f1ba' }, this.getHeadline()), h("cat-button", { key: 'af5053d050c8f2b90c1296a85f933a48bda5316b', icon: "$cat:datepicker-month-next", iconOnly: true, size: "xs", variant: "text", "a11y-label": this.locale.nextMonth, disabled: isSameMonth(this.viewDate, maxDate), onClick: () => this.navigate('next', 'month'), "data-dropdown-no-close": true }), h("cat-button", { key: '518c7da2705b55c55856446d481a61ae08b6326f', icon: "$cat:datepicker-year-next", iconOnly: true, size: "xs", variant: "text", "a11y-label": this.locale.nextYear, disabled: isSameYear(this.viewDate, maxDate), onClick: () => this.navigate('next', 'year'), "data-dropdown-no-close": true })), h("div", { key: '70b0c1c279d3ecebf76d8df4b082c3df348aab32', class: "picker-grid", onFocusin: () => this.setAriaLive(this.locale.arrowKeys) }, h("div", { key: 'e931b9d0e668673f1b954f8f59e1c35fa4389152', class: "picker-grid-head" }, Array.from(Array(7), (_, i) => {
|
|
2344
2368
|
const day = (i + this.locale.weekInfo.firstDay) % 7;
|
|
2345
2369
|
return h("abbr", { title: this.locale.days.long[day] }, this.locale.days.short[day]);
|
|
2346
|
-
})), this.weeks && (h("div", { key: '
|
|
2370
|
+
})), this.weeks && (h("div", { key: '4c9d503a6d6b51e52a06f5110c49d531e38ad8f3', class: "picker-grid-weeks" }, dateGrid
|
|
2347
2371
|
.filter((_, i) => i % 7 === 0)
|
|
2348
|
-
.map(day => (h("div", null, this.getWeekNumber(day)))))), h("div", { key: '
|
|
2372
|
+
.map(day => (h("div", null, this.getWeekNumber(day)))))), h("div", { key: 'c617bb9cb7d02f93f063111d8245ce2adff80bb9', class: "picker-grid-days" }, dateGrid.map(day => {
|
|
2349
2373
|
const isStartDate = isSameDay(dateStart, day);
|
|
2350
2374
|
const isEndDate = isSameDay(dateEnd, day);
|
|
2351
2375
|
const isRange = !!dateStart && !!dateEnd && day > dateStart && day < dateEnd;
|
|
@@ -2362,7 +2386,7 @@ const CatDateInline = class {
|
|
|
2362
2386
|
'date-focusable': this.canFocus(day),
|
|
2363
2387
|
'date-disabled': !this.canClick(day)
|
|
2364
2388
|
}, nativeAttributes: !this.canFocus(day) ? { tabindex: '-1' } : {}, variant: isStartDate || isEndDate ? 'filled' : isToday ? 'outlined' : 'text', a11yLabel: this.locale.toLocalStr(day), active: isStartDate || isEndDate || isRange, color: isStartDate || isEndDate || isToday ? 'primary' : 'secondary', disabled: !this.canClick(day), onClick: () => this.select(day), "data-date": this.locale.toLocalISO(day) }, day.getDate()));
|
|
2365
|
-
}))), h("div", { key: '
|
|
2389
|
+
}))), h("div", { key: '9a5ebf824cda12748ca74812976c660404277f75', class: "picker-foot" }, !this.noToday && this.canClick(this.locale.now()) && (h("cat-button", { key: '84547723903adbe887b9e03a9849f15efbf5ac76', size: "s", "data-dropdown-no-close": true, onClick: () => this.select(this.locale.now()) }, this.locale.today)), this.hint && h("p", { key: '3b959f5d28bc5330687a1243c283a913feb54120', class: "cursor-help" }, this.locale.arrowKeys), !this.noClear && (h("cat-button", { key: '25e7894bf4b153169f103e9350a2e52446d3a085', size: "s", disabled: !this.value, "data-dropdown-no-close": true, onClick: () => this.clear() }, this.locale.clear)))), h("p", { key: '8ff0cfbb0d94fbdbcdb825462c12e2ab5d6497ea', class: "cursor-aria", "aria-live": "polite" })));
|
|
2366
2390
|
}
|
|
2367
2391
|
focus(date, focus = true) {
|
|
2368
2392
|
const [minDate, maxDate] = this.getMinMaxDate();
|
|
@@ -5010,19 +5034,6 @@ if (typeof window !== "undefined") {
|
|
|
5010
5034
|
window.flatpickr = flatpickr;
|
|
5011
5035
|
}
|
|
5012
5036
|
|
|
5013
|
-
/**
|
|
5014
|
-
* Find the closest parent element matching the given selector while traversing
|
|
5015
|
-
* up the DOM tree (including Shadow DOM).
|
|
5016
|
-
*/
|
|
5017
|
-
function findClosest(selector, element) {
|
|
5018
|
-
if (element instanceof Element && element.matches(selector)) {
|
|
5019
|
-
return element;
|
|
5020
|
-
}
|
|
5021
|
-
// Search in parent element or Shadow DOM host
|
|
5022
|
-
const nextElement = element instanceof ShadowRoot ? element.host : element.parentElement || element.getRootNode().host;
|
|
5023
|
-
return nextElement ? findClosest(selector, nextElement) : null;
|
|
5024
|
-
}
|
|
5025
|
-
|
|
5026
5037
|
var weekSelect = {exports: {}};
|
|
5027
5038
|
|
|
5028
5039
|
(function (module, exports) {
|
|
@@ -7345,7 +7356,7 @@ const CatDatepickerFlat = class {
|
|
|
7345
7356
|
}
|
|
7346
7357
|
render() {
|
|
7347
7358
|
return [
|
|
7348
|
-
h("cat-input", { key: '
|
|
7359
|
+
h("cat-input", { key: '2d6dfdb538dc299632dd45d9a0bca8abb0facada', ref: el => (this._input = el), requiredMarker: this.requiredMarker, horizontal: this.horizontal, autoComplete: this.autoComplete, clearable: this.clearable, disabled: this.disabled, hint: this.hint, icon: this.icon, iconRight: this.iconRight, identifier: this.identifier, label: this.label, labelHidden: this.labelHidden, name: this.name, placeholder: this.placeholder, textPrefix: this.textPrefix, textSuffix: this.textSuffix, readonly: this.readonly, required: this.required, value: this.value, errors: this.errors, errorUpdate: this.errorUpdate, nativeAttributes: this.nativeAttributes, onCatChange: e => {
|
|
7349
7360
|
e.stopPropagation();
|
|
7350
7361
|
this.value = e.detail || undefined;
|
|
7351
7362
|
}, onCatFocus: e => {
|
|
@@ -7354,8 +7365,8 @@ const CatDatepickerFlat = class {
|
|
|
7354
7365
|
}, onCatBlur: e => {
|
|
7355
7366
|
e.stopPropagation();
|
|
7356
7367
|
this.catBlur.emit(e.detail);
|
|
7357
|
-
} }, this.hasSlottedLabel && (h("span", { key: '
|
|
7358
|
-
h("div", { key: '
|
|
7368
|
+
} }, this.hasSlottedLabel && (h("span", { key: '8500ea8ab6598c38f38c6c7362922023a0494e9a', slot: "label" }, h("slot", { key: '357a72e4c47e627a688fa9ee0d4cab643f35bd3b', name: "label" }))), this.hasSlottedHint && (h("span", { key: 'e29eea36582b820c78d0a38528e8e9a7e66504fa', slot: "hint" }, h("slot", { key: 'a1bb049de876518a9511d0488af8597268780385', name: "hint" })))),
|
|
7369
|
+
h("div", { key: '1fb7d22213191b0f57e32ec052b1d6259c90d3a5', ref: el => (this._calendarWrapper = el), class: "datepicker-wrapper" })
|
|
7359
7370
|
];
|
|
7360
7371
|
}
|
|
7361
7372
|
initDatepicker(input) {
|
|
@@ -7458,11 +7469,11 @@ const CatDatepickerInline = class {
|
|
|
7458
7469
|
this.pickr = this.initDatepicker(this.input);
|
|
7459
7470
|
}
|
|
7460
7471
|
render() {
|
|
7461
|
-
return (h(Host, { key: '
|
|
7472
|
+
return (h(Host, { key: '217d0c22a5cef5de2d06e510be8928d9bc3eecf6' }, h("div", { key: 'bf37ff1a4b39188d978750646105c394bb7dc21c', tabIndex: this.disabled || this.readonly ? -1 : undefined, class: {
|
|
7462
7473
|
'datepicker-wrapper': true,
|
|
7463
7474
|
'datepicker-disabled': this.disabled,
|
|
7464
7475
|
'datepicker-readonly': this.readonly
|
|
7465
|
-
} }, h("input", { key: '
|
|
7476
|
+
} }, h("input", { key: '9ac04234b09faf655b5d558ffd2548cc1a0a0cd8', ref: el => (this.input = el), value: this.value, disabled: this.disabled, readonly: this.readonly }))));
|
|
7466
7477
|
}
|
|
7467
7478
|
initDatepicker(input) {
|
|
7468
7479
|
if (!input) {
|
|
@@ -8553,7 +8564,7 @@ const CatDropdown = class {
|
|
|
8553
8564
|
}, timeTransitionS);
|
|
8554
8565
|
}
|
|
8555
8566
|
render() {
|
|
8556
|
-
return (h(Host, { key: '
|
|
8567
|
+
return (h(Host, { key: '1951b5cb7a1f89280d414c50782e5879f20b6ca5' }, h("slot", { key: 'b53c9a9703692c6a3da8b05ae812fbcb38ecbfe4', name: "anchor", ref: el => (this.anchorSlot = el) }), h("slot", { key: '0d2a5216a6eb29dfc07ca7c812453e45edec5d07', name: "trigger", ref: el => (this.triggerSlot = el) }), h("div", { key: '4f39545ff55528e141a0957b001fdeb96453fe32', id: this.contentId, class: { content: true, 'overflow-auto': !this.overflow }, ref: el => (this.content = el) }, h("slot", { key: '1ea2c4bae869a5aae43817ea9d37a21cb541974c', name: "content" }))));
|
|
8557
8568
|
}
|
|
8558
8569
|
componentDidLoad() {
|
|
8559
8570
|
this.initAnchor();
|
|
@@ -8650,7 +8661,7 @@ const CatFormGroup = class {
|
|
|
8650
8661
|
});
|
|
8651
8662
|
}
|
|
8652
8663
|
render() {
|
|
8653
|
-
return (h(Host, { key: '
|
|
8664
|
+
return (h(Host, { key: '7f307d064a9d25e9a6c15808dc973675d4a55bbe', style: { '--label-size': this.labelSize } }, h("slot", { key: '4f272c3286cbf740363ab7b0e006830185b5007a', onSlotchange: this.onSlotChange.bind(this) })));
|
|
8654
8665
|
}
|
|
8655
8666
|
onSlotChange() {
|
|
8656
8667
|
this.formElements = Array.from(this.hostElement.querySelectorAll('cat-input, cat-textarea, cat-select, cat-datepicker'));
|
|
@@ -8682,7 +8693,7 @@ const CatIcon = class {
|
|
|
8682
8693
|
this.a11yLabel = undefined;
|
|
8683
8694
|
}
|
|
8684
8695
|
render() {
|
|
8685
|
-
return (h("span", { key: '
|
|
8696
|
+
return (h("span", { key: '64a4d2cb95d9ca81c6fd5d5e57ae10c3dc37fd4b', innerHTML: this.iconSrc || (this.icon ? catIconRegistry.getIcon(this.icon) : ''), "aria-label": this.a11yLabel, "aria-hidden": this.a11yLabel ? null : 'true', part: "icon", class: {
|
|
8686
8697
|
icon: true,
|
|
8687
8698
|
[`icon-${this.size}`]: this.size !== 'inline'
|
|
8688
8699
|
} }));
|
|
@@ -10360,19 +10371,19 @@ const CatInput = class {
|
|
|
10360
10371
|
}
|
|
10361
10372
|
}
|
|
10362
10373
|
render() {
|
|
10363
|
-
return (h("div", { key: '
|
|
10374
|
+
return (h("div", { key: '7258b5dca8a1bb2660421411399376affcd7412b', class: {
|
|
10364
10375
|
'input-field': true,
|
|
10365
10376
|
'input-horizontal': this.horizontal
|
|
10366
|
-
} }, h("div", { key: '
|
|
10377
|
+
} }, h("div", { key: '9c02edf0f50dcd805d503d8d9b7c6ecde3b3714c', class: { 'label-container': true, hidden: this.labelHidden } }, (this.hasSlottedLabel || this.label) && (h("label", { key: '06ce0c061f259aaf206d201d41b4d4c005b0cc84', htmlFor: this.id, part: "label" }, h("span", { key: '2de7d35216fa0beea4b614da4b8b7df8d99d5b04', class: "label-wrapper" }, (this.hasSlottedLabel && h("slot", { key: '495aebfd1bf2ee81012f98f3a4a0658c90c9e804', name: "label" })) || this.label, h("div", { key: '4192b2e57f8d8a7b378bc0425f5330bc7a04f401', class: "label-metadata" }, !this.required && (this.requiredMarker ?? 'optional').startsWith('optional') && (h("span", { key: '5f426128dcf6ddc8bcab0c6438aec0568a35b23c', class: "label-optional", "aria-hidden": "true" }, "(", catI18nRegistry.t('input.optional'), ")")), this.required && this.requiredMarker?.startsWith('required') && (h("span", { key: 'f2f1a36e5e1066724db5a4da99c1d06c8cc86f66', class: "label-optional", "aria-hidden": "true" }, "(", catI18nRegistry.t('input.required'), ")")), this.maxLength && (h("div", { key: 'e29f07bfa9f91c295be6037aaa05038809c91fe6', class: "label-character-count", "aria-hidden": "true" }, this.value?.toString().length ?? 0, "/", this.maxLength))))))), h("div", { key: '85efdbe3dbfdd4e85651b7e8329e5f9f15e052d7', class: "input-container" }, h("div", { key: 'b8829ba90a01a17fe88ee48b715b4350322ad6f6', class: "input-outer-wrapper" }, h("div", { key: '76a04b883427a20af6e03b9677e4caec28c2caaa', class: {
|
|
10367
10378
|
'input-wrapper': true,
|
|
10368
10379
|
'input-round': this.round,
|
|
10369
10380
|
'input-readonly': this.readonly,
|
|
10370
10381
|
'input-disabled': this.disabled,
|
|
10371
10382
|
'input-invalid': this.invalid
|
|
10372
|
-
}, onClick: () => this.input.focus() }, this.textPrefix && (h("span", { key: '
|
|
10383
|
+
}, onClick: () => this.input.focus() }, this.textPrefix && (h("span", { key: '62386cdfd8f78d6c53837d7ab98dc1fe4a29ef98', class: "text-prefix", part: "prefix" }, this.textPrefix)), this.icon && !this.iconRight && (h("cat-icon", { key: 'e1412bc20af17cd70c0b23ba10d2ce078137b3b8', icon: this.icon, class: "icon-prefix", size: "l", onClick: () => this.doFocus() })), h("div", { key: '03cc4198c7880a0e5c0addac542b5aa43c39302f', class: "input-inner-wrapper" }, h("input", { key: '9275ba8b28f73ab8d017f861da0edbcbf0ef9e28', ...this.nativeAttributes, part: "input", ref: el => (this.input = el), id: this.id, class: {
|
|
10373
10384
|
'has-clearable': this.clearable && !this.disabled && !this.readonly && !!this.value,
|
|
10374
10385
|
'has-toggle-password': this.togglePassword && !this.disabled && !this.readonly && !!this.value
|
|
10375
|
-
}, autocomplete: this.autoComplete, disabled: this.disabled, max: this.max, maxlength: this.maxLength, min: this.min, minlength: this.minLength, name: this.name, placeholder: this.placeholder, readonly: this.readonly, required: this.required, type: this.isPasswordShown ? 'text' : this.type, value: this.value, onInput: this.onInput.bind(this), onFocus: this.onFocus.bind(this), onBlur: this.onBlur.bind(this), "aria-invalid": this.invalid ? 'true' : undefined, "aria-describedby": this.hasHint ? this.id + '-hint' : undefined }), this.clearable && !this.disabled && !this.readonly && this.value && (h("cat-button", { key: '
|
|
10386
|
+
}, autocomplete: this.autoComplete, disabled: this.disabled, max: this.max, maxlength: this.maxLength, min: this.min, minlength: this.minLength, name: this.name, placeholder: this.placeholder, readonly: this.readonly, required: this.required, type: this.isPasswordShown ? 'text' : this.type, value: this.value, onInput: this.onInput.bind(this), onFocus: this.onFocus.bind(this), onBlur: this.onBlur.bind(this), "aria-invalid": this.invalid ? 'true' : undefined, "aria-describedby": this.hasHint ? this.id + '-hint' : undefined }), this.clearable && !this.disabled && !this.readonly && this.value && (h("cat-button", { key: '22bafaef74f81c9d5548ee1090d1e9633cc138d3', class: "clearable", icon: "$cat:input-close", "icon-only": "true", size: "s", variant: "text", "a11y-label": catI18nRegistry.t('input.clear'), onClick: this.clear.bind(this), "data-dropdown-no-close": true })), this.togglePassword && !this.disabled && !this.readonly && this.value && (h("cat-button", { key: '766c223a69c50dfb040f5bad604fcfc91a06a54e', class: "toggle-password", icon: this.isPasswordShown ? '$cat:input-password-hide' : '$cat:input-password-show', "icon-only": "true", size: "s", variant: "text", "a11y-label": catI18nRegistry.t(this.isPasswordShown ? 'input.hidePassword' : 'input.showPassword'), onClick: this.doTogglePassword.bind(this) }))), !this.invalid && this.icon && this.iconRight && (h("cat-icon", { key: '67c5389ac4d9e782fc067d1c13078574e563e974', icon: this.icon, class: "icon-suffix", size: "l", onClick: () => this.doFocus() })), this.invalid && (h("cat-icon", { key: 'a30da2261ddb64eedd211c2d1b9a3d581763836f', icon: "$cat:input-error", class: "icon-suffix cat-text-danger", size: "l" })), this.textSuffix && (h("span", { key: 'c9847ed51bac5908df4d370bd18a86a0d61e544e', class: "text-suffix", part: "suffix" }, this.textSuffix))), h("slot", { key: '78f753ce80a50aa9c82f1fe2e12cdb929d4dd0dd', name: "addon" })), this.hasHint && (h(CatFormHint, { key: '27c27c004374fcf6348551199d0bb78f33f2eec5', id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && h("slot", { name: "hint" }), errorMap: this.errorMap })))));
|
|
10376
10387
|
}
|
|
10377
10388
|
get hasHint() {
|
|
10378
10389
|
return !!this.hint || !!this.hasSlottedHint || this.invalid;
|
|
@@ -10450,9 +10461,9 @@ const CatPagination = class {
|
|
|
10450
10461
|
this.iconNext = '$cat:pagination-right';
|
|
10451
10462
|
}
|
|
10452
10463
|
render() {
|
|
10453
|
-
return (h("nav", { key: '
|
|
10464
|
+
return (h("nav", { key: '817cbf68d26fef6f6603a2455e7586fefea63b77', role: "navigation" }, h("ol", { key: '8cc898b619508d2ef2c05fed178d0976fb0c5abf', class: {
|
|
10454
10465
|
[`cat-pagination-${this.size}`]: Boolean(this.size)
|
|
10455
|
-
} }, h("li", { key: '
|
|
10466
|
+
} }, h("li", { key: 'b4df49303de82b5bca6eb32e1b984f3204675baa' }, h("cat-button", { key: 'b73cd4eadf9811bfbc681d77d9339738227c5e24', variant: this.variant, size: this.size, round: this.round, disabled: this.isFirst, a11yLabel: catI18nRegistry.t('pagination.prev'), icon: this.iconPrev, iconOnly: true, onClick: () => this.setPage(this.page - 1) })), this.content, h("li", { key: '119fbe96e02ab847e1a70dd2a7778f31488eb42e' }, h("cat-button", { key: '903151fcd987ef8a106715a37dcadc294c14567f', variant: this.variant, size: this.size, round: this.round, disabled: this.isLast, a11yLabel: catI18nRegistry.t('pagination.next'), icon: this.iconNext, iconOnly: true, onClick: () => this.setPage(this.page + 1) })))));
|
|
10456
10467
|
}
|
|
10457
10468
|
get isFirst() {
|
|
10458
10469
|
return this.page === 0;
|
|
@@ -10555,13 +10566,13 @@ const CatRadio = class {
|
|
|
10555
10566
|
this.input.blur();
|
|
10556
10567
|
}
|
|
10557
10568
|
render() {
|
|
10558
|
-
return (h(Host, { key: '
|
|
10569
|
+
return (h(Host, { key: 'e49a46a798bf9e1763c3bb7d393d017bc717b867' }, h("label", { key: '2c54e7ce7635e828d08c57a6dec3dac6f9655ea7', htmlFor: this.id, class: {
|
|
10559
10570
|
'is-hidden': this.labelHidden,
|
|
10560
10571
|
'is-disabled': this.disabled,
|
|
10561
10572
|
'label-left': this.labelLeft,
|
|
10562
10573
|
'align-center': this.alignment === 'center',
|
|
10563
10574
|
'align-end': this.alignment === 'bottom'
|
|
10564
|
-
}, role: "radio", "aria-checked": this.checked ? 'true' : 'false' }, h("span", { key: '
|
|
10575
|
+
}, role: "radio", "aria-checked": this.checked ? 'true' : 'false' }, h("span", { key: '750a09db89be9e14bd0b830f6ab9d667b5154faa', class: "radio" }, h("input", { key: 'd34a558d03b1af53eb8afe65f33cdf400a38dd8a', ...this.nativeAttributes, part: "input", ref: el => (this.input = el), id: this.identifier || this.id, type: "radio", name: this.name, value: this.value, checked: this.checked, required: this.required, disabled: this.disabled, onInput: this.onInput.bind(this), onFocus: this.onFocus.bind(this), onBlur: this.onBlur.bind(this), "aria-describedby": this.hasHint ? this.id + '-hint' : undefined }), h("span", { key: '4da4710794e6a1939e947461986798f952a43c28', class: "circle" })), h("span", { key: '812920e2ce41d6415fb39306a3c5c90c547292ed', class: "label", part: "label" }, (this.hasSlottedLabel && h("slot", { key: '141e716d778a2838dc5da2f36342483a07a887e0', name: "label" })) || this.label)), this.hasHint && (h("div", { key: '84e7ed4970ff487801c96dfdd16fbc5bf5fa7ee0', class: { 'hint-wrapper': true, 'label-left': this.labelLeft } }, h("div", { key: '7067ca10bf24d84beaf5f89a8e2e65a22766784c', class: "circle-placeholder" }), h(CatFormHint, { key: 'a6a006b626516a1fa3f86d25eb6ae5da93ff9d66', id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && h("slot", { name: "hint" }) })))));
|
|
10565
10576
|
}
|
|
10566
10577
|
get hasHint() {
|
|
10567
10578
|
return !!this.hint || !!this.hasSlottedHint;
|
|
@@ -10652,7 +10663,7 @@ const CatRadioGroup = class {
|
|
|
10652
10663
|
}
|
|
10653
10664
|
}
|
|
10654
10665
|
render() {
|
|
10655
|
-
return (h("div", { key: '
|
|
10666
|
+
return (h("div", { key: '3ca0cc9f011a75bbe5fbe78f3ccc34f2b89cfa0d', role: "radiogroup", "aria-label": this.a11yLabel }, h("slot", { key: 'ab891802eba920792de0dbbd645df119cbbfd35a' })));
|
|
10656
10667
|
}
|
|
10657
10668
|
init() {
|
|
10658
10669
|
this.catRadioGroup = Array.from(this.hostElement.querySelectorAll(`cat-radio`));
|
|
@@ -10741,13 +10752,13 @@ const CatScrollable = class {
|
|
|
10741
10752
|
}
|
|
10742
10753
|
render() {
|
|
10743
10754
|
return [
|
|
10744
|
-
h("div", { key: '
|
|
10745
|
-
h("div", { key: '
|
|
10755
|
+
h("div", { key: '1639675c47648368c53430e764a8add07e9452ae', class: "scrollable-wrapper", ref: el => (this.scrollWrapperElement = el) }, !this.noShadowY && h("div", { key: '1ee0d5c5bfc7b726addac6474b098237ff447c3c', class: "shadow-top" }), !this.noShadowX && h("div", { key: '266026a4369bdcd9464deb4aa44d1e438a05e191', class: "shadow-left" }), !this.noShadowX && h("div", { key: 'd4ec793e68cde3ca8aa14e4eec57995112722d9b', class: "shadow-right" }), !this.noShadowY && h("div", { key: 'c30408dc0b5e10a9dceece389ce0729d46fdcbe2', class: "shadow-bottom" })),
|
|
10756
|
+
h("div", { key: '8e17123e46a59b561122d07a2124ab20bf0cc58f', ref: el => (this.scrollElement = el), class: {
|
|
10746
10757
|
'scrollable-content': true,
|
|
10747
10758
|
'scroll-x': !this.noOverflowX,
|
|
10748
10759
|
'scroll-y': !this.noOverflowY,
|
|
10749
10760
|
'no-overscroll': this.noOverscroll
|
|
10750
|
-
} }, h("slot", { key: '
|
|
10761
|
+
} }, h("slot", { key: '026b0d81a1de88cbd4b401bde7fb98caaabfe811' }))
|
|
10751
10762
|
];
|
|
10752
10763
|
}
|
|
10753
10764
|
attachEmitter(from, emitter) {
|
|
@@ -11688,7 +11699,7 @@ const CatSelectTest = class {
|
|
|
11688
11699
|
setTimeout(() => this.multipleSelect && (this.multipleSelect.value = []), 5000);
|
|
11689
11700
|
}
|
|
11690
11701
|
render() {
|
|
11691
|
-
return (h(Host, { key: '
|
|
11702
|
+
return (h(Host, { key: '4d1262f7c176a3699eec1b24dcfd24eb73e4794d', style: { display: 'flex', flexDirection: 'column' }, class: "cat-form" }, h("cat-select", { key: '50af5fabe85cf9d5cabc22e8eaac0fd79ca37ef6', label: "Multiple Select", hint: "This is a hint!", ref: el => (this.multipleSelect = el), value: ['1'], placeholder: "Hello World", onCatChange: () => console.log('Multiple change', this.multipleSelect?.value), onCatBlur: e => console.log('Multiple blur', e), multiple: true, noItems: "No results", clearable: true, errorUpdate: false }, h("span", { key: 'd0b3ff47fa0ae1fcaca58fa1c978d160bd90ec25', slot: "hint" }, "Searching for \"no\" -", '>', " no options are returned!")), h("cat-select", { key: '8b279857cb7bc615049315d3347ad2167f79f515', label: "Multiple with img", ref: el => (this.multipleSelectAvatar = el), value: ['1'], placeholder: "Hello World", multiple: true, clearable: true, errorUpdate: false }), h("cat-select", { key: '8133ad06671dda0dec6847558cc5f2298ffd0910', label: "Multiple with initials", ref: el => (this.multipleSelectAvatarInitials = el), value: ['1'], placeholder: "Hello World", multiple: true, clearable: true, errorUpdate: false }), h("cat-select", { key: 'fe7e7c01ed578dbccea9dedb77722ccc873aa882', label: "Multiple with tagging support", hint: "This is a hint!", ref: el => (this.multipleSelectTagging = el), value: { ids: ['1'], tags: ['Test', 'Albania', 'Algeria'] }, placeholder: "Select country", onCatChange: () => console.log('Multiple tagging change', this.multipleSelectTagging?.value), multiple: true, tags: true, clearable: true, errorUpdate: false }), h("cat-select", { key: 'f632770bcf0100328294b4722bf788619d381ba9', label: "Single Select", hint: "This is a hint!", ref: el => (this.singleSelect = el), placeholder: "Search for a country or capital", onCatBlur: e => console.log('Single blur', e), clearable: true, errorUpdate: false }), h("cat-select", { key: 'b38796d22f1f88bead1e97820d48214b7ba3f649', label: "Single with img", ref: el => (this.singleSelectAvatar = el), value: '1', placeholder: "Search for a country or capital", clearable: true, errorUpdate: false }), h("cat-select", { key: '24bff1c9438de8a2bce7801b161c6e0ed40a0f53', label: "Single with initials", ref: el => (this.singleSelectAvatarInitials = el), placeholder: "Hello World", clearable: true, errorUpdate: false }), h("cat-dropdown", { key: '263cf8e741c9f16f2602150cb2bc054b11deff3b', overflow: true }, h("cat-button", { key: '7bc7b524dfb08bb1691e3ebb391e44229345a98b', slot: "trigger", style: { width: '50%' } }, "Open select"), h("div", { key: '81565908aa8e60a82727269b3af83f9d9cc00e89', slot: "content", style: { width: '400px' } }, h("cat-select", { key: '530b39c7402fd04af9a92a8860994babbb26ca16', label: "Single with tagging support", ref: el => (this.singleSelectTagging = el), value: { id: '', tag: 'Albania' }, placeholder: "Search for a country or capital", onCatChange: () => console.log('Single change', this.singleSelectTagging?.value), tagHint: "new country", tags: true, clearable: true, errorUpdate: false, style: { width: '90%' } })))));
|
|
11692
11703
|
}
|
|
11693
11704
|
get countryConnector() {
|
|
11694
11705
|
return {
|
|
@@ -12944,7 +12955,7 @@ const CatSkeleton = class {
|
|
|
12944
12955
|
this.lines = undefined;
|
|
12945
12956
|
}
|
|
12946
12957
|
render() {
|
|
12947
|
-
return (h(Host, { key: '
|
|
12958
|
+
return (h(Host, { key: 'aed2e7fe276bc83e749cddeba379a495040850ea' }, Array.from(Array(this.count)).map(() => (h("div", { style: this.style, class: {
|
|
12948
12959
|
skeleton: true,
|
|
12949
12960
|
[`skeleton-${this.effect}`]: Boolean(this.effect),
|
|
12950
12961
|
[`skeleton-${this.variant}`]: Boolean(this.variant),
|
|
@@ -12984,9 +12995,9 @@ const CatSpinner = class {
|
|
|
12984
12995
|
this.a11yLabel = undefined;
|
|
12985
12996
|
}
|
|
12986
12997
|
render() {
|
|
12987
|
-
return (h("span", { key: '
|
|
12998
|
+
return (h("span", { key: '1cbc0ce9b663ba8edec261bc23822da72bca0e09', "aria-label": this.a11yLabel, "aria-hidden": this.a11yLabel ? null : 'true', class: {
|
|
12988
12999
|
[`spinner-${this.size}`]: this.size !== 'inline'
|
|
12989
|
-
} }, h("svg", { key: '
|
|
13000
|
+
} }, h("svg", { key: '8f282cdab11de5ae0ce0d5c33e8261d28642e8b3', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 48 48" }, h("circle", { key: '1b283f2cca79367c1bbb284954f4c62b422d18ae', cx: "24", cy: "24", r: "21.5" }))));
|
|
12990
13001
|
}
|
|
12991
13002
|
};
|
|
12992
13003
|
CatSpinner.style = CatSpinnerStyle0;
|
|
@@ -13018,7 +13029,7 @@ const CatTab = class {
|
|
|
13018
13029
|
this.catClick.emit(event);
|
|
13019
13030
|
}
|
|
13020
13031
|
render() {
|
|
13021
|
-
return h(Host, { key: '
|
|
13032
|
+
return h(Host, { key: '3a0763022fe3c66e8405914f3212ba1d19fe1549' });
|
|
13022
13033
|
}
|
|
13023
13034
|
get hostElement() { return getElement(this); }
|
|
13024
13035
|
};
|
|
@@ -13082,7 +13093,7 @@ const CatTabs = class {
|
|
|
13082
13093
|
this.activate(this.tabs[index]);
|
|
13083
13094
|
}
|
|
13084
13095
|
render() {
|
|
13085
|
-
return (h(Host, { key: '
|
|
13096
|
+
return (h(Host, { key: '16cb1359d4242593e1caf1b2475c0fe24b91a69b' }, this.tabs.map((tab) => {
|
|
13086
13097
|
return (h("cat-button", { buttonId: tab.id, role: "tab", part: "tab", class: {
|
|
13087
13098
|
'cat-tab': true,
|
|
13088
13099
|
'cat-tab-active': tab.id === this.activeTab,
|
|
@@ -13199,15 +13210,15 @@ const CatTextarea = class {
|
|
|
13199
13210
|
}
|
|
13200
13211
|
}
|
|
13201
13212
|
render() {
|
|
13202
|
-
return (h(Host, { key: '
|
|
13213
|
+
return (h(Host, { key: 'fda117cd95fc6e41b9cd939b65ab22f977dde6ef' }, h("div", { key: '1f96b31c31880e8a75c8ad67c4057fb3010b1c9e', class: {
|
|
13203
13214
|
'textarea-field': true,
|
|
13204
13215
|
'textarea-horizontal': this.horizontal
|
|
13205
|
-
} }, h("div", { key: '
|
|
13216
|
+
} }, h("div", { key: '524ec0321e709ad45216275d0c554b7efde80f19', class: { 'label-container': true, hidden: this.labelHidden } }, (this.hasSlottedLabel || this.label) && (h("label", { key: '3aa9116de299d6eadf551159788cd0e244b5e919', htmlFor: this.id, part: "label" }, h("span", { key: 'ae397abd1be97bbb5c58fa35f4b560506cbbd5d1', class: "label-wrapper" }, (this.hasSlottedLabel && h("slot", { key: '81bb3f8151354ae9c6539f6816d963700beb861b', name: "label" })) || this.label, h("div", { key: '96000f760849536cb97eedd704e8a1bec14c15fa', class: "label-metadata" }, !this.required && (this.requiredMarker ?? 'optional').startsWith('optional') && (h("span", { key: '1ab3077d0d7a94c2459a2d5b6717cc4a3857b122', class: "label-optional", "aria-hidden": "true" }, "(", catI18nRegistry.t('input.optional'), ")")), this.required && this.requiredMarker?.startsWith('required') && (h("span", { key: '73944c3f9366064342fca115ae50612b9c75489e', class: "label-optional", "aria-hidden": "true" }, "(", catI18nRegistry.t('input.required'), ")")), this.maxLength && (h("div", { key: 'fe11e06174bcbf8e1957771be702fc052a4e5114', class: "label-character-count", "aria-hidden": "true" }, this.value?.length ?? 0, "/", this.maxLength))))))), h("div", { key: '94a9992673d408933040f359335f642fcc053182', class: "textarea-container" }, h("div", { key: 'df53a47f398d48cec2b50dff469eb9a91c59bc72', class: {
|
|
13206
13217
|
'textarea-wrapper': true,
|
|
13207
13218
|
'textarea-readonly': this.readonly,
|
|
13208
13219
|
'textarea-disabled': this.disabled,
|
|
13209
13220
|
'textarea-invalid': this.invalid
|
|
13210
|
-
} }, h("textarea", { key: '
|
|
13221
|
+
} }, h("textarea", { key: 'd7d7f168763ea7194b97ddb505b4741b4ba0d91a', ...this.nativeAttributes, part: "textarea", ref: el => (this.textarea = el), id: this.id, disabled: this.disabled, maxlength: this.maxLength, minlength: this.minLength, name: this.name, placeholder: this.placeholder, readonly: this.readonly, required: this.required, rows: this.rows, value: this.value, onInput: this.onInput.bind(this), onFocus: this.onFocus.bind(this), onBlur: this.onBlur.bind(this), "aria-invalid": this.invalid ? 'true' : undefined, "aria-describedby": this.hasHint ? this.id + '-hint' : undefined }), this.invalid && (h("cat-icon", { key: 'f9d4fc754bf0da656ee08f2b5b68fedba99c727c', icon: "$cat:input-error", class: "icon-suffix cat-text-danger", size: "l", onClick: () => this.textarea.focus() }))), this.hasHint && (h(CatFormHint, { key: '3112b8a801c9b5e51129df6349f89c097beb6f0d', id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && h("slot", { name: "hint" }), errorMap: this.errorMap }))))));
|
|
13211
13222
|
}
|
|
13212
13223
|
get hasHint() {
|
|
13213
13224
|
return !!this.hint || !!this.hasSlottedHint || this.invalid;
|
|
@@ -13425,14 +13436,14 @@ const CatTime = class {
|
|
|
13425
13436
|
this.input?.clear();
|
|
13426
13437
|
}
|
|
13427
13438
|
render() {
|
|
13428
|
-
return (h(Host, { key: '
|
|
13439
|
+
return (h(Host, { key: 'e9bfaeee8aa39aa58ac287afeaed1a2fc39d7b83' }, h("cat-input", { key: '1e200e6041b06a0859e392cfc6b6b03668b3eb35', class: "cat-time-input", ref: el => (this.input = el), requiredMarker: this.requiredMarker, horizontal: this.horizontal, autoComplete: this.autoComplete, clearable: this.clearable, disabled: this.disabled, hint: this.hint, icon: this.icon, iconRight: this.iconRight, identifier: this.identifier, label: this.label, labelHidden: this.labelHidden, name: this.name, placeholder: this.placeholder, textPrefix: this.textPrefix, textSuffix: this.textSuffix, readonly: this.readonly, required: this.required, value: this.format(this.selectionTime, false), errors: this.errors, errorUpdate: this.errorUpdate, nativeAttributes: this.nativeAttributes, onCatFocus: e => this.catFocus.emit(e.detail), onCatBlur: e => this.onInputBlur(e.detail) }, h("span", { key: 'e91e3e12272c24858a71b485e00e54cf00d7386f', slot: "label" }, this.hasSlottedLabel && h("slot", { key: '2449ea042497293868bcc767b1626070b3a1dcec', name: "label" }), !this.hasSlottedLabel && this.label, h("span", { key: '3bab583a7629d01350fbd9e54d3fe1f113e0b372', class: "label-aria" }, " (HH:mm)")), h("div", { key: '8340d31e70e30ebe1d020f456b3a7bc5bed6b998', slot: "addon", class: "cat-time-addon" }, this.locale.timeFormat === '12' && (h("cat-button", { key: 'e6bb50abe2c3296cee7c3d5c02a6cef7c69f8678', class: "cat-time-format", disabled: this.disabled || this.readonly, onCatClick: () => this.toggleAm() }, this.isAm ? 'AM' : 'PM')), h("cat-dropdown", { key: 'e79b7f58ffdc4d356e94f3e96afb6727d3e9be26', slot: "addon", placement: this.placement }, h("cat-button", { key: 'd6bd905d7760e0ae7e9ab8c23e87f7c926769aa9', slot: "trigger", class: "cat-time-toggle", disabled: this.disabled || this.readonly, icon: "$cat:timepicker-clock", iconOnly: true, a11yLabel: this.selectionTime ? `${this.locale.change}, ${this.format(this.selectionTime)}` : this.locale.choose }), h("nav", { key: 'c2ae49020a1e8cafedd27b8a7e061e63dbb4c6d2', slot: "content", class: "cat-nav" }, h("ul", { key: 'b918672be1b65ca3a1c2daa239a196d4117b52f7' }, this.timeArray().map(time => {
|
|
13429
13440
|
const isoTime = formatIso(time);
|
|
13430
13441
|
const disabled = isBefore(time, this.min ?? null) || isAfter(time, this.max ?? null);
|
|
13431
13442
|
return (h("li", null, h("cat-button", { class: {
|
|
13432
13443
|
'cat-nav-item': true,
|
|
13433
13444
|
'time-disabled': disabled
|
|
13434
13445
|
}, disabled: disabled, active: isoTime === this.value, color: isoTime === this.value ? 'primary' : 'secondary', variant: isoTime === this.value ? 'filled' : 'outlined', onCatClick: () => this.select(time), "data-time": isoTime }, this.format(time))));
|
|
13435
|
-
}))))), this.hasSlottedHint && (h("span", { key: '
|
|
13446
|
+
}))))), this.hasSlottedHint && (h("span", { key: '817f2b58417911affc39ce6977160998c39ebf71', slot: "hint" }, h("slot", { key: 'a1ffdd541103064abf49311801088fe15d5ed88d', name: "hint" }))))));
|
|
13436
13447
|
}
|
|
13437
13448
|
timeArray() {
|
|
13438
13449
|
const result = [];
|
|
@@ -13551,13 +13562,13 @@ const CatToggle = class {
|
|
|
13551
13562
|
this.input.blur();
|
|
13552
13563
|
}
|
|
13553
13564
|
render() {
|
|
13554
|
-
return (h(Host, { key: '
|
|
13565
|
+
return (h(Host, { key: '021e20f2f3e8a37d085a11966df3980758fd4662' }, h("label", { key: '8454945f873a5cef9b0ab52fd533289059d5d77c', htmlFor: this.id, class: {
|
|
13555
13566
|
'is-hidden': this.labelHidden,
|
|
13556
13567
|
'is-disabled': this.disabled,
|
|
13557
13568
|
'label-left': this.labelLeft,
|
|
13558
13569
|
'align-center': this.alignment === 'center',
|
|
13559
13570
|
'align-end': this.alignment === 'bottom'
|
|
13560
|
-
} }, h("input", { key: '
|
|
13571
|
+
} }, h("input", { key: '7eb1ab9de417cf27856caf257422be3221c17d94', ...this.nativeAttributes, part: "input", ref: el => (this.input = el), id: this.id, type: "checkbox", name: this.name, value: this.value, checked: this.checked, required: this.required, disabled: this.disabled, class: "form-check-input", role: "switch", onInput: this.onInput.bind(this), onFocus: this.onFocus.bind(this), onBlur: this.onBlur.bind(this), "aria-describedby": this.hasHint ? this.id + '-hint' : undefined }), h("span", { key: 'eb6c4b072ca903fd7df8a30e570be54c6df4133e', class: "toggle" }), h("span", { key: 'b07bb543bb4ac09fecd8ce1c0f0c1276846aa1e1', class: "label", part: "label" }, (this.hasSlottedLabel && h("slot", { key: '199cc06d3b54bb910c15449185b63d04f91163fd', name: "label" })) || this.label)), this.hasHint && (h("div", { key: '43145cb96e769390309ed4003e94b04c1bea1a53', class: { 'hint-wrapper': true, 'label-left': this.labelLeft } }, h("div", { key: 'f0cbb265cec353a7f68432e369f0f2c7d042c3c7', class: "toggle-placeholder" }), h(CatFormHint, { key: '06692bcf33bf7a3202cc8977238003b96b9e4b8c', id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && h("slot", { name: "hint" }) })))));
|
|
13561
13572
|
}
|
|
13562
13573
|
get hasHint() {
|
|
13563
13574
|
return !!this.hint || !!this.hasSlottedHint;
|
|
@@ -13644,12 +13655,12 @@ const CatTooltip = class {
|
|
|
13644
13655
|
}
|
|
13645
13656
|
}
|
|
13646
13657
|
render() {
|
|
13647
|
-
return (h(Host, { key: '
|
|
13658
|
+
return (h(Host, { key: '7d72ac4a2ccb057d7bca7290d6fc4e06c02c644c' }, h("slot", { key: '260fb1edf80d86a93892eed9df3ce4622cc441a3' }), h("div", { key: 'f7a7dc3f3333be42ed1a795dad64f74e9194201a', ref: el => (this.tooltip = el), id: this.id, role: "tooltip", "aria-hidden": !this.open, "aria-live": this.open ? 'polite' : 'off', class: {
|
|
13648
13659
|
tooltip: true,
|
|
13649
13660
|
'tooltip-hidden': this.inactive,
|
|
13650
13661
|
'tooltip-round': this.round,
|
|
13651
13662
|
[`tooltip-${this.size}`]: Boolean(this.size)
|
|
13652
|
-
} }, h("slot", { key: '
|
|
13663
|
+
} }, h("slot", { key: 'ebed88ce3b9481d6046cf5a70245c26a3dbc0a03', name: "content" }, h("p", { key: '455f894145ba5d1b8a8c001a6a4017d8aac81771' }, this.content)))));
|
|
13653
13664
|
}
|
|
13654
13665
|
async update() {
|
|
13655
13666
|
if (this.trigger && this.tooltip) {
|