@haiilo/catalyst 10.17.1 → 10.18.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-2a8cf2e4.entry.js} +4 -4
- package/dist/catalyst/p-2a8cf2e4.entry.js.map +1 -0
- package/dist/cjs/cat-alert_29.cjs.entry.js +55 -48
- 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 +9 -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/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 +9 -1
- 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 +3 -3
- 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 +55 -48
- 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/package.json +2 -2
- package/dist/catalyst/p-b1cd12bb.entry.js.map +0 -1
|
@@ -823,7 +823,7 @@ const CatAlert = class {
|
|
|
823
823
|
setAttributeDefault(this, 'role', this.mapRole.get(this.color));
|
|
824
824
|
}
|
|
825
825
|
render() {
|
|
826
|
-
return (index.h(index.Host, { key: '
|
|
826
|
+
return (index.h(index.Host, { key: 'c02988c259d20cfb381b69a43cd9800a075f9c97' }, !this.noIcon && index.h("cat-icon", { key: 'fee7a2b021437de0c7617187e48c3e436218b50f', size: "l", icon: this.icon || this.mapIcon.get(this.color) }), index.h("div", { key: '4bb19866ff246d7ec956c213e39f8d09080f02da', class: "content" }, index.h("slot", { key: 'a3356a8b51747570f01c33cd77106156aed5c404' }))));
|
|
827
827
|
}
|
|
828
828
|
get hostElement() { return index.getElement(this); }
|
|
829
829
|
};
|
|
@@ -920,7 +920,7 @@ const CatBadge = class {
|
|
|
920
920
|
this.pulse = false;
|
|
921
921
|
}
|
|
922
922
|
render() {
|
|
923
|
-
return index.h("slot", { key: '
|
|
923
|
+
return index.h("slot", { key: '23ddf7fc9b33cb4410ba74dbafda8d084cdc3606' });
|
|
924
924
|
}
|
|
925
925
|
get hostElement() { return index.getElement(this); }
|
|
926
926
|
};
|
|
@@ -1041,7 +1041,7 @@ function createEmptyStyleRule(query) {
|
|
|
1041
1041
|
}
|
|
1042
1042
|
}
|
|
1043
1043
|
|
|
1044
|
-
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}";
|
|
1044
|
+
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}";
|
|
1045
1045
|
const CatButtonStyle0 = catButtonCss;
|
|
1046
1046
|
|
|
1047
1047
|
const CatButton = class {
|
|
@@ -1051,6 +1051,7 @@ const CatButton = class {
|
|
|
1051
1051
|
this.catFocus = index.createEvent(this, "catFocus", 7);
|
|
1052
1052
|
this.catBlur = index.createEvent(this, "catBlur", 7);
|
|
1053
1053
|
this._iconOnly = true;
|
|
1054
|
+
this.hasSlottedContent = false;
|
|
1054
1055
|
this.variant = 'outlined';
|
|
1055
1056
|
this.color = 'secondary';
|
|
1056
1057
|
this.active = false;
|
|
@@ -1095,6 +1096,9 @@ const CatButton = class {
|
|
|
1095
1096
|
componentWillLoad() {
|
|
1096
1097
|
this.onIconOnlyChanged(this.iconOnly);
|
|
1097
1098
|
}
|
|
1099
|
+
componentWillRender() {
|
|
1100
|
+
this.hasSlottedContent = this.hostElement.hasChildNodes();
|
|
1101
|
+
}
|
|
1098
1102
|
haltDisabledEvents(event) {
|
|
1099
1103
|
if (this.disabled || this.loading) {
|
|
1100
1104
|
event.preventDefault();
|
|
@@ -1128,6 +1132,7 @@ const CatButton = class {
|
|
|
1128
1132
|
if (this.url) {
|
|
1129
1133
|
return (index.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: {
|
|
1130
1134
|
'cat-button': true,
|
|
1135
|
+
'cat-button-empty': !this.hasSlottedContent,
|
|
1131
1136
|
'cat-button-active': this.active,
|
|
1132
1137
|
'cat-button-icon': this.isIconButton,
|
|
1133
1138
|
'cat-button-round': this.round,
|
|
@@ -1142,6 +1147,7 @@ const CatButton = class {
|
|
|
1142
1147
|
else {
|
|
1143
1148
|
return (index.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: {
|
|
1144
1149
|
'cat-button': true,
|
|
1150
|
+
'cat-button-empty': !this.hasSlottedContent,
|
|
1145
1151
|
'cat-button-active': this.active,
|
|
1146
1152
|
'cat-button-icon': this.isIconButton,
|
|
1147
1153
|
'cat-button-round': this.round ?? this.isIconButton,
|
|
@@ -1198,6 +1204,7 @@ const CatButton = class {
|
|
|
1198
1204
|
onBlur(event) {
|
|
1199
1205
|
this.catBlur.emit(event);
|
|
1200
1206
|
}
|
|
1207
|
+
get hostElement() { return index.getElement(this); }
|
|
1201
1208
|
static get watchers() { return {
|
|
1202
1209
|
"iconOnly": ["onIconOnlyChanged"]
|
|
1203
1210
|
}; }
|
|
@@ -1214,7 +1221,7 @@ const CatButtonGroup = class {
|
|
|
1214
1221
|
this.a11yLabel = undefined;
|
|
1215
1222
|
}
|
|
1216
1223
|
render() {
|
|
1217
|
-
return (index.h(index.Host, { key: '
|
|
1224
|
+
return (index.h(index.Host, { key: 'ca23ccee6536ec2cef9d82832cf16dacac31ef2a', role: "group", "aria-label": this.a11yLabel }, index.h("slot", { key: 'b4a3485c8595874779ef41468e5af98163c6573c', onSlotchange: this.onSlotChange.bind(this) })));
|
|
1218
1225
|
}
|
|
1219
1226
|
onSlotChange() {
|
|
1220
1227
|
this.formElements = Array.from(this.hostElement.querySelectorAll('cat-button'));
|
|
@@ -1235,7 +1242,7 @@ const CatCard = class {
|
|
|
1235
1242
|
this.catLoad = index.createEvent(this, "catLoad", 7);
|
|
1236
1243
|
}
|
|
1237
1244
|
render() {
|
|
1238
|
-
return index.h("slot", { key: '
|
|
1245
|
+
return index.h("slot", { key: '4d88ab8e5cf1e13a3242b646314f034f5fa0fdfe' });
|
|
1239
1246
|
}
|
|
1240
1247
|
componentDidLoad() {
|
|
1241
1248
|
this.catLoad.emit();
|
|
@@ -1318,13 +1325,13 @@ const CatCheckbox = class {
|
|
|
1318
1325
|
this.input.blur();
|
|
1319
1326
|
}
|
|
1320
1327
|
render() {
|
|
1321
|
-
return (index.h(index.Host, { key: '
|
|
1328
|
+
return (index.h(index.Host, { key: '93377a710ae9dca69f2377c48d18786f0d603479' }, index.h("label", { key: 'ee24cfed4f031089d3ab23611315634b584bf847', htmlFor: this.id, class: {
|
|
1322
1329
|
'is-hidden': this.labelHidden,
|
|
1323
1330
|
'is-disabled': this.disabled,
|
|
1324
1331
|
'label-left': this.labelLeft,
|
|
1325
1332
|
'align-center': this.alignment === 'center',
|
|
1326
1333
|
'align-end': this.alignment === 'bottom'
|
|
1327
|
-
} }, index.h("input", { key: '
|
|
1334
|
+
} }, index.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 }), index.h("span", { key: 'e46c25bca3339feb71a2f59f7aef4ec757394131', class: "box", "aria-hidden": "true" }, index.h("svg", { key: '7ac0adfde7c9b388f0a2207d5320b95250efd940', class: "check", viewBox: "0 0 12 10" }, index.h("polyline", { key: 'a60caaa7644dc3607410634d505eecf836241da3', points: "1.5 6 4.5 9 10.5 1" })), index.h("svg", { key: '151c84f2ba3e0ea9a32ffb1a6cff3378d12bb802', class: "dash", viewBox: "0 0 12 10" }, index.h("polyline", { key: '057ca182a51794ced52f1034e9e9eb305da9797f', points: "1.5 5 10.5 5" }))), index.h("span", { key: 'c4fe4df0fd4e2cc1d3c2efc408a7216ddbb4c2f1', class: "label", part: "label" }, (this.hasSlottedLabel && index.h("slot", { key: '44578da3c031ab6c1393b20beaf3f930ed4c3c84', name: "label" })) || this.label)), this.hasHint && (index.h("div", { key: 'f8c397dd0db96c87a5d07a9cd9b6ef21015ce07c', class: { 'hint-wrapper': true, 'label-left': this.labelLeft } }, index.h("div", { key: 'b7860816d92e4738ae5865304e9177e11749331c', class: "box-placeholder" }), index.h(CatFormHint, { key: '6ca384cd514070939e9cafcd60091ecfc009a738', id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && index.h("slot", { name: "hint" }) })))));
|
|
1328
1335
|
}
|
|
1329
1336
|
get hasHint() {
|
|
1330
1337
|
return !!this.hint || !!this.hasSlottedHint;
|
|
@@ -1540,13 +1547,13 @@ const CatDate = class {
|
|
|
1540
1547
|
this.input?.clear();
|
|
1541
1548
|
}
|
|
1542
1549
|
render() {
|
|
1543
|
-
return (index.h(index.Host, { key: '
|
|
1550
|
+
return (index.h(index.Host, { key: '188058ee5792af5b325c708388c2f7e56955626a' }, index.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 => {
|
|
1544
1551
|
e.stopPropagation();
|
|
1545
1552
|
this.catFocus.emit(e.detail);
|
|
1546
1553
|
}, onCatBlur: e => {
|
|
1547
1554
|
e.stopPropagation();
|
|
1548
1555
|
this.onInputBlur(e.detail);
|
|
1549
|
-
} }, index.h("span", { key: '
|
|
1556
|
+
} }, index.h("span", { key: 'a4851b76d931f0d8e26384df0b17ae4f374d9475', slot: "label" }, this.label, index.h("span", { key: '94168a4f4f9f48051e223659d3e183e324c4a830', class: "label-aria" }, " (", this.locale.formatStr, ")")), index.h("cat-dropdown", { key: 'afcc0c1c40c30f06848eeadfc59c7eb31daab623', slot: "addon", placement: this.placement, arrowNavigation: "none", noResize: true, onCatOpen: () => this.dateInline?.resetView() }, index.h("cat-button", { key: '0b23f131caefde13d038907a126bccecb916b53c', slot: "trigger", icon: "$cat:datepicker-calendar", iconOnly: true, class: "cat-date-toggle", disabled: this.disabled, a11yLabel: this.getTriggerA11yLabel() }), index.h("div", { key: '206e03a2fb05382c9fcf8747593fe394bfa6f107', slot: "content" }, index.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) }))))));
|
|
1550
1557
|
}
|
|
1551
1558
|
getTriggerA11yLabel() {
|
|
1552
1559
|
const date = this.locale.fromLocalISO(this.value);
|
|
@@ -2344,12 +2351,12 @@ const CatDateInline = class {
|
|
|
2344
2351
|
const [minDate, maxDate] = this.getMinMaxDate();
|
|
2345
2352
|
const dateGrid = this.dateGrid(this.viewDate.getFullYear(), this.viewDate.getMonth());
|
|
2346
2353
|
const [dateStart, dateEnd] = this.getValue();
|
|
2347
|
-
return (index.h(index.Host, { key: '
|
|
2354
|
+
return (index.h(index.Host, { key: 'fb573205f50b9f793bcd8f88107be6e28d0b9dad', "aria-label": this.label || undefined }, index.h("div", { key: '81d5094ccc8f56c93d160a72c928c530da9bf947', class: { 'label-container': true, 'label-hidden': this.labelHidden } }, (this.hasSlottedLabel || this.label) && (index.h("label", { key: 'ebd2d90309e689ed7461a91fd68ecd6c8dedd24d', id: `${this.id}-label`, htmlFor: this.id, part: "label", onClick: () => this.doFocus() }, index.h("span", { key: '12e9aef96e6ec5db1007f7060e54cea4d490d495', class: "label-wrapper" }, (this.hasSlottedLabel && index.h("slot", { key: '6120e89de299fedf25649c9293b9f1aad3e53c96', name: "label" })) || this.label, index.h("div", { key: '91c833bee02d1cdadee631df24794bd3625544fc', class: "label-metadata" }, !this.required && (this.requiredMarker ?? 'optional').startsWith('optional') && (index.h("span", { key: 'f8fd54451ab0a7d62c5a572d5052377357dbdc2d', class: "label-optional", "aria-hidden": "true" }, "(", of.catI18nRegistry.t('input.optional'), ")")), this.required && this.requiredMarker?.startsWith('required') && (index.h("span", { key: '5dfb4b3ae8ac7276ba5b119bbe0ae50627f17fb9', class: "label-optional", "aria-hidden": "true" }, "(", of.catI18nRegistry.t('input.required'), ")"))))))), index.h("div", { key: '3015096d18e1eb2fc3ad151602971393300142cf', class: { picker: true, 'picker-weeks': this.weeks }, id: this.id, "aria-describedby": `${this.id}-label` }, index.h("div", { key: '85232561729e6cad9f0c689255cbcaad3fdb41d2', class: "picker-head" }, index.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 }), index.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 }), index.h("h3", { key: '8b4a2621adedf1cbe7843a060b095c7c13b8f1ba' }, this.getHeadline()), index.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 }), index.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 })), index.h("div", { key: '70b0c1c279d3ecebf76d8df4b082c3df348aab32', class: "picker-grid", onFocusin: () => this.setAriaLive(this.locale.arrowKeys) }, index.h("div", { key: 'e931b9d0e668673f1b954f8f59e1c35fa4389152', class: "picker-grid-head" }, Array.from(Array(7), (_, i) => {
|
|
2348
2355
|
const day = (i + this.locale.weekInfo.firstDay) % 7;
|
|
2349
2356
|
return index.h("abbr", { title: this.locale.days.long[day] }, this.locale.days.short[day]);
|
|
2350
|
-
})), this.weeks && (index.h("div", { key: '
|
|
2357
|
+
})), this.weeks && (index.h("div", { key: '4c9d503a6d6b51e52a06f5110c49d531e38ad8f3', class: "picker-grid-weeks" }, dateGrid
|
|
2351
2358
|
.filter((_, i) => i % 7 === 0)
|
|
2352
|
-
.map(day => (index.h("div", null, this.getWeekNumber(day)))))), index.h("div", { key: '
|
|
2359
|
+
.map(day => (index.h("div", null, this.getWeekNumber(day)))))), index.h("div", { key: 'c617bb9cb7d02f93f063111d8245ce2adff80bb9', class: "picker-grid-days" }, dateGrid.map(day => {
|
|
2353
2360
|
const isStartDate = isSameDay(dateStart, day);
|
|
2354
2361
|
const isEndDate = isSameDay(dateEnd, day);
|
|
2355
2362
|
const isRange = !!dateStart && !!dateEnd && day > dateStart && day < dateEnd;
|
|
@@ -2366,7 +2373,7 @@ const CatDateInline = class {
|
|
|
2366
2373
|
'date-focusable': this.canFocus(day),
|
|
2367
2374
|
'date-disabled': !this.canClick(day)
|
|
2368
2375
|
}, 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()));
|
|
2369
|
-
}))), index.h("div", { key: '
|
|
2376
|
+
}))), index.h("div", { key: '9a5ebf824cda12748ca74812976c660404277f75', class: "picker-foot" }, !this.noToday && this.canClick(this.locale.now()) && (index.h("cat-button", { key: '84547723903adbe887b9e03a9849f15efbf5ac76', size: "s", "data-dropdown-no-close": true, onClick: () => this.select(this.locale.now()) }, this.locale.today)), this.hint && index.h("p", { key: '3b959f5d28bc5330687a1243c283a913feb54120', class: "cursor-help" }, this.locale.arrowKeys), !this.noClear && (index.h("cat-button", { key: '25e7894bf4b153169f103e9350a2e52446d3a085', size: "s", disabled: !this.value, "data-dropdown-no-close": true, onClick: () => this.clear() }, this.locale.clear)))), index.h("p", { key: '8ff0cfbb0d94fbdbcdb825462c12e2ab5d6497ea', class: "cursor-aria", "aria-live": "polite" })));
|
|
2370
2377
|
}
|
|
2371
2378
|
focus(date, focus = true) {
|
|
2372
2379
|
const [minDate, maxDate] = this.getMinMaxDate();
|
|
@@ -7349,7 +7356,7 @@ const CatDatepickerFlat = class {
|
|
|
7349
7356
|
}
|
|
7350
7357
|
render() {
|
|
7351
7358
|
return [
|
|
7352
|
-
index.h("cat-input", { key: '
|
|
7359
|
+
index.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 => {
|
|
7353
7360
|
e.stopPropagation();
|
|
7354
7361
|
this.value = e.detail || undefined;
|
|
7355
7362
|
}, onCatFocus: e => {
|
|
@@ -7358,8 +7365,8 @@ const CatDatepickerFlat = class {
|
|
|
7358
7365
|
}, onCatBlur: e => {
|
|
7359
7366
|
e.stopPropagation();
|
|
7360
7367
|
this.catBlur.emit(e.detail);
|
|
7361
|
-
} }, this.hasSlottedLabel && (index.h("span", { key: '
|
|
7362
|
-
index.h("div", { key: '
|
|
7368
|
+
} }, this.hasSlottedLabel && (index.h("span", { key: '8500ea8ab6598c38f38c6c7362922023a0494e9a', slot: "label" }, index.h("slot", { key: '357a72e4c47e627a688fa9ee0d4cab643f35bd3b', name: "label" }))), this.hasSlottedHint && (index.h("span", { key: 'e29eea36582b820c78d0a38528e8e9a7e66504fa', slot: "hint" }, index.h("slot", { key: 'a1bb049de876518a9511d0488af8597268780385', name: "hint" })))),
|
|
7369
|
+
index.h("div", { key: '1fb7d22213191b0f57e32ec052b1d6259c90d3a5', ref: el => (this._calendarWrapper = el), class: "datepicker-wrapper" })
|
|
7363
7370
|
];
|
|
7364
7371
|
}
|
|
7365
7372
|
initDatepicker(input) {
|
|
@@ -7462,11 +7469,11 @@ const CatDatepickerInline = class {
|
|
|
7462
7469
|
this.pickr = this.initDatepicker(this.input);
|
|
7463
7470
|
}
|
|
7464
7471
|
render() {
|
|
7465
|
-
return (index.h(index.Host, { key: '
|
|
7472
|
+
return (index.h(index.Host, { key: '217d0c22a5cef5de2d06e510be8928d9bc3eecf6' }, index.h("div", { key: 'bf37ff1a4b39188d978750646105c394bb7dc21c', tabIndex: this.disabled || this.readonly ? -1 : undefined, class: {
|
|
7466
7473
|
'datepicker-wrapper': true,
|
|
7467
7474
|
'datepicker-disabled': this.disabled,
|
|
7468
7475
|
'datepicker-readonly': this.readonly
|
|
7469
|
-
} }, index.h("input", { key: '
|
|
7476
|
+
} }, index.h("input", { key: '9ac04234b09faf655b5d558ffd2548cc1a0a0cd8', ref: el => (this.input = el), value: this.value, disabled: this.disabled, readonly: this.readonly }))));
|
|
7470
7477
|
}
|
|
7471
7478
|
initDatepicker(input) {
|
|
7472
7479
|
if (!input) {
|
|
@@ -8557,7 +8564,7 @@ const CatDropdown = class {
|
|
|
8557
8564
|
}, timeTransitionS);
|
|
8558
8565
|
}
|
|
8559
8566
|
render() {
|
|
8560
|
-
return (index.h(index.Host, { key: '
|
|
8567
|
+
return (index.h(index.Host, { key: '1951b5cb7a1f89280d414c50782e5879f20b6ca5' }, index.h("slot", { key: 'b53c9a9703692c6a3da8b05ae812fbcb38ecbfe4', name: "anchor", ref: el => (this.anchorSlot = el) }), index.h("slot", { key: '0d2a5216a6eb29dfc07ca7c812453e45edec5d07', name: "trigger", ref: el => (this.triggerSlot = el) }), index.h("div", { key: '4f39545ff55528e141a0957b001fdeb96453fe32', id: this.contentId, class: { content: true, 'overflow-auto': !this.overflow }, ref: el => (this.content = el) }, index.h("slot", { key: '1ea2c4bae869a5aae43817ea9d37a21cb541974c', name: "content" }))));
|
|
8561
8568
|
}
|
|
8562
8569
|
componentDidLoad() {
|
|
8563
8570
|
this.initAnchor();
|
|
@@ -8654,7 +8661,7 @@ const CatFormGroup = class {
|
|
|
8654
8661
|
});
|
|
8655
8662
|
}
|
|
8656
8663
|
render() {
|
|
8657
|
-
return (index.h(index.Host, { key: '
|
|
8664
|
+
return (index.h(index.Host, { key: '7f307d064a9d25e9a6c15808dc973675d4a55bbe', style: { '--label-size': this.labelSize } }, index.h("slot", { key: '4f272c3286cbf740363ab7b0e006830185b5007a', onSlotchange: this.onSlotChange.bind(this) })));
|
|
8658
8665
|
}
|
|
8659
8666
|
onSlotChange() {
|
|
8660
8667
|
this.formElements = Array.from(this.hostElement.querySelectorAll('cat-input, cat-textarea, cat-select, cat-datepicker'));
|
|
@@ -8686,7 +8693,7 @@ const CatIcon = class {
|
|
|
8686
8693
|
this.a11yLabel = undefined;
|
|
8687
8694
|
}
|
|
8688
8695
|
render() {
|
|
8689
|
-
return (index.h("span", { key: '
|
|
8696
|
+
return (index.h("span", { key: '64a4d2cb95d9ca81c6fd5d5e57ae10c3dc37fd4b', innerHTML: this.iconSrc || (this.icon ? of.catIconRegistry.getIcon(this.icon) : ''), "aria-label": this.a11yLabel, "aria-hidden": this.a11yLabel ? null : 'true', part: "icon", class: {
|
|
8690
8697
|
icon: true,
|
|
8691
8698
|
[`icon-${this.size}`]: this.size !== 'inline'
|
|
8692
8699
|
} }));
|
|
@@ -10364,19 +10371,19 @@ const CatInput = class {
|
|
|
10364
10371
|
}
|
|
10365
10372
|
}
|
|
10366
10373
|
render() {
|
|
10367
|
-
return (index.h("div", { key: '
|
|
10374
|
+
return (index.h("div", { key: '7258b5dca8a1bb2660421411399376affcd7412b', class: {
|
|
10368
10375
|
'input-field': true,
|
|
10369
10376
|
'input-horizontal': this.horizontal
|
|
10370
|
-
} }, index.h("div", { key: '
|
|
10377
|
+
} }, index.h("div", { key: '9c02edf0f50dcd805d503d8d9b7c6ecde3b3714c', class: { 'label-container': true, hidden: this.labelHidden } }, (this.hasSlottedLabel || this.label) && (index.h("label", { key: '06ce0c061f259aaf206d201d41b4d4c005b0cc84', htmlFor: this.id, part: "label" }, index.h("span", { key: '2de7d35216fa0beea4b614da4b8b7df8d99d5b04', class: "label-wrapper" }, (this.hasSlottedLabel && index.h("slot", { key: '495aebfd1bf2ee81012f98f3a4a0658c90c9e804', name: "label" })) || this.label, index.h("div", { key: '4192b2e57f8d8a7b378bc0425f5330bc7a04f401', class: "label-metadata" }, !this.required && (this.requiredMarker ?? 'optional').startsWith('optional') && (index.h("span", { key: '5f426128dcf6ddc8bcab0c6438aec0568a35b23c', class: "label-optional", "aria-hidden": "true" }, "(", of.catI18nRegistry.t('input.optional'), ")")), this.required && this.requiredMarker?.startsWith('required') && (index.h("span", { key: 'f2f1a36e5e1066724db5a4da99c1d06c8cc86f66', class: "label-optional", "aria-hidden": "true" }, "(", of.catI18nRegistry.t('input.required'), ")")), this.maxLength && (index.h("div", { key: 'e29f07bfa9f91c295be6037aaa05038809c91fe6', class: "label-character-count", "aria-hidden": "true" }, this.value?.toString().length ?? 0, "/", this.maxLength))))))), index.h("div", { key: '85efdbe3dbfdd4e85651b7e8329e5f9f15e052d7', class: "input-container" }, index.h("div", { key: 'b8829ba90a01a17fe88ee48b715b4350322ad6f6', class: "input-outer-wrapper" }, index.h("div", { key: '76a04b883427a20af6e03b9677e4caec28c2caaa', class: {
|
|
10371
10378
|
'input-wrapper': true,
|
|
10372
10379
|
'input-round': this.round,
|
|
10373
10380
|
'input-readonly': this.readonly,
|
|
10374
10381
|
'input-disabled': this.disabled,
|
|
10375
10382
|
'input-invalid': this.invalid
|
|
10376
|
-
}, onClick: () => this.input.focus() }, this.textPrefix && (index.h("span", { key: '
|
|
10383
|
+
}, onClick: () => this.input.focus() }, this.textPrefix && (index.h("span", { key: '62386cdfd8f78d6c53837d7ab98dc1fe4a29ef98', class: "text-prefix", part: "prefix" }, this.textPrefix)), this.icon && !this.iconRight && (index.h("cat-icon", { key: 'e1412bc20af17cd70c0b23ba10d2ce078137b3b8', icon: this.icon, class: "icon-prefix", size: "l", onClick: () => this.doFocus() })), index.h("div", { key: '03cc4198c7880a0e5c0addac542b5aa43c39302f', class: "input-inner-wrapper" }, index.h("input", { key: '9275ba8b28f73ab8d017f861da0edbcbf0ef9e28', ...this.nativeAttributes, part: "input", ref: el => (this.input = el), id: this.id, class: {
|
|
10377
10384
|
'has-clearable': this.clearable && !this.disabled && !this.readonly && !!this.value,
|
|
10378
10385
|
'has-toggle-password': this.togglePassword && !this.disabled && !this.readonly && !!this.value
|
|
10379
|
-
}, 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 && (index.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 && (index.h("cat-button", { key: '22bafaef74f81c9d5548ee1090d1e9633cc138d3', class: "clearable", icon: "$cat:input-close", "icon-only": "true", size: "s", variant: "text", "a11y-label": of.catI18nRegistry.t('input.clear'), onClick: this.clear.bind(this), "data-dropdown-no-close": true })), this.togglePassword && !this.disabled && !this.readonly && this.value && (index.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": of.catI18nRegistry.t(this.isPasswordShown ? 'input.hidePassword' : 'input.showPassword'), onClick: this.doTogglePassword.bind(this) }))), !this.invalid && this.icon && this.iconRight && (index.h("cat-icon", { key: '67c5389ac4d9e782fc067d1c13078574e563e974', icon: this.icon, class: "icon-suffix", size: "l", onClick: () => this.doFocus() })), this.invalid && (index.h("cat-icon", { key: 'a30da2261ddb64eedd211c2d1b9a3d581763836f', icon: "$cat:input-error", class: "icon-suffix cat-text-danger", size: "l" })), this.textSuffix && (index.h("span", { key: 'c9847ed51bac5908df4d370bd18a86a0d61e544e', class: "text-suffix", part: "suffix" }, this.textSuffix))), index.h("slot", { key: '78f753ce80a50aa9c82f1fe2e12cdb929d4dd0dd', name: "addon" })), this.hasHint && (index.h(CatFormHint, { key: '27c27c004374fcf6348551199d0bb78f33f2eec5', id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && index.h("slot", { name: "hint" }), errorMap: this.errorMap })))));
|
|
10380
10387
|
}
|
|
10381
10388
|
get hasHint() {
|
|
10382
10389
|
return !!this.hint || !!this.hasSlottedHint || this.invalid;
|
|
@@ -10454,9 +10461,9 @@ const CatPagination = class {
|
|
|
10454
10461
|
this.iconNext = '$cat:pagination-right';
|
|
10455
10462
|
}
|
|
10456
10463
|
render() {
|
|
10457
|
-
return (index.h("nav", { key: '
|
|
10464
|
+
return (index.h("nav", { key: '817cbf68d26fef6f6603a2455e7586fefea63b77', role: "navigation" }, index.h("ol", { key: '8cc898b619508d2ef2c05fed178d0976fb0c5abf', class: {
|
|
10458
10465
|
[`cat-pagination-${this.size}`]: Boolean(this.size)
|
|
10459
|
-
} }, index.h("li", { key: '
|
|
10466
|
+
} }, index.h("li", { key: 'b4df49303de82b5bca6eb32e1b984f3204675baa' }, index.h("cat-button", { key: 'b73cd4eadf9811bfbc681d77d9339738227c5e24', variant: this.variant, size: this.size, round: this.round, disabled: this.isFirst, a11yLabel: of.catI18nRegistry.t('pagination.prev'), icon: this.iconPrev, iconOnly: true, onClick: () => this.setPage(this.page - 1) })), this.content, index.h("li", { key: '119fbe96e02ab847e1a70dd2a7778f31488eb42e' }, index.h("cat-button", { key: '903151fcd987ef8a106715a37dcadc294c14567f', variant: this.variant, size: this.size, round: this.round, disabled: this.isLast, a11yLabel: of.catI18nRegistry.t('pagination.next'), icon: this.iconNext, iconOnly: true, onClick: () => this.setPage(this.page + 1) })))));
|
|
10460
10467
|
}
|
|
10461
10468
|
get isFirst() {
|
|
10462
10469
|
return this.page === 0;
|
|
@@ -10559,13 +10566,13 @@ const CatRadio = class {
|
|
|
10559
10566
|
this.input.blur();
|
|
10560
10567
|
}
|
|
10561
10568
|
render() {
|
|
10562
|
-
return (index.h(index.Host, { key: '
|
|
10569
|
+
return (index.h(index.Host, { key: 'e49a46a798bf9e1763c3bb7d393d017bc717b867' }, index.h("label", { key: '2c54e7ce7635e828d08c57a6dec3dac6f9655ea7', htmlFor: this.id, class: {
|
|
10563
10570
|
'is-hidden': this.labelHidden,
|
|
10564
10571
|
'is-disabled': this.disabled,
|
|
10565
10572
|
'label-left': this.labelLeft,
|
|
10566
10573
|
'align-center': this.alignment === 'center',
|
|
10567
10574
|
'align-end': this.alignment === 'bottom'
|
|
10568
|
-
}, role: "radio", "aria-checked": this.checked ? 'true' : 'false' }, index.h("span", { key: '
|
|
10575
|
+
}, role: "radio", "aria-checked": this.checked ? 'true' : 'false' }, index.h("span", { key: '750a09db89be9e14bd0b830f6ab9d667b5154faa', class: "radio" }, index.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 }), index.h("span", { key: '4da4710794e6a1939e947461986798f952a43c28', class: "circle" })), index.h("span", { key: '812920e2ce41d6415fb39306a3c5c90c547292ed', class: "label", part: "label" }, (this.hasSlottedLabel && index.h("slot", { key: '141e716d778a2838dc5da2f36342483a07a887e0', name: "label" })) || this.label)), this.hasHint && (index.h("div", { key: '84e7ed4970ff487801c96dfdd16fbc5bf5fa7ee0', class: { 'hint-wrapper': true, 'label-left': this.labelLeft } }, index.h("div", { key: '7067ca10bf24d84beaf5f89a8e2e65a22766784c', class: "circle-placeholder" }), index.h(CatFormHint, { key: 'a6a006b626516a1fa3f86d25eb6ae5da93ff9d66', id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && index.h("slot", { name: "hint" }) })))));
|
|
10569
10576
|
}
|
|
10570
10577
|
get hasHint() {
|
|
10571
10578
|
return !!this.hint || !!this.hasSlottedHint;
|
|
@@ -10656,7 +10663,7 @@ const CatRadioGroup = class {
|
|
|
10656
10663
|
}
|
|
10657
10664
|
}
|
|
10658
10665
|
render() {
|
|
10659
|
-
return (index.h("div", { key: '
|
|
10666
|
+
return (index.h("div", { key: '3ca0cc9f011a75bbe5fbe78f3ccc34f2b89cfa0d', role: "radiogroup", "aria-label": this.a11yLabel }, index.h("slot", { key: 'ab891802eba920792de0dbbd645df119cbbfd35a' })));
|
|
10660
10667
|
}
|
|
10661
10668
|
init() {
|
|
10662
10669
|
this.catRadioGroup = Array.from(this.hostElement.querySelectorAll(`cat-radio`));
|
|
@@ -10745,13 +10752,13 @@ const CatScrollable = class {
|
|
|
10745
10752
|
}
|
|
10746
10753
|
render() {
|
|
10747
10754
|
return [
|
|
10748
|
-
index.h("div", { key: '
|
|
10749
|
-
index.h("div", { key: '
|
|
10755
|
+
index.h("div", { key: '1639675c47648368c53430e764a8add07e9452ae', class: "scrollable-wrapper", ref: el => (this.scrollWrapperElement = el) }, !this.noShadowY && index.h("div", { key: '1ee0d5c5bfc7b726addac6474b098237ff447c3c', class: "shadow-top" }), !this.noShadowX && index.h("div", { key: '266026a4369bdcd9464deb4aa44d1e438a05e191', class: "shadow-left" }), !this.noShadowX && index.h("div", { key: 'd4ec793e68cde3ca8aa14e4eec57995112722d9b', class: "shadow-right" }), !this.noShadowY && index.h("div", { key: 'c30408dc0b5e10a9dceece389ce0729d46fdcbe2', class: "shadow-bottom" })),
|
|
10756
|
+
index.h("div", { key: '8e17123e46a59b561122d07a2124ab20bf0cc58f', ref: el => (this.scrollElement = el), class: {
|
|
10750
10757
|
'scrollable-content': true,
|
|
10751
10758
|
'scroll-x': !this.noOverflowX,
|
|
10752
10759
|
'scroll-y': !this.noOverflowY,
|
|
10753
10760
|
'no-overscroll': this.noOverscroll
|
|
10754
|
-
} }, index.h("slot", { key: '
|
|
10761
|
+
} }, index.h("slot", { key: '026b0d81a1de88cbd4b401bde7fb98caaabfe811' }))
|
|
10755
10762
|
];
|
|
10756
10763
|
}
|
|
10757
10764
|
attachEmitter(from, emitter) {
|
|
@@ -11692,7 +11699,7 @@ const CatSelectTest = class {
|
|
|
11692
11699
|
setTimeout(() => this.multipleSelect && (this.multipleSelect.value = []), 5000);
|
|
11693
11700
|
}
|
|
11694
11701
|
render() {
|
|
11695
|
-
return (index.h(index.Host, { key: '
|
|
11702
|
+
return (index.h(index.Host, { key: '4d1262f7c176a3699eec1b24dcfd24eb73e4794d', style: { display: 'flex', flexDirection: 'column' }, class: "cat-form" }, index.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 }, index.h("span", { key: 'd0b3ff47fa0ae1fcaca58fa1c978d160bd90ec25', slot: "hint" }, "Searching for \"no\" -", '>', " no options are returned!")), index.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 }), index.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 }), index.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 }), index.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 }), index.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 }), index.h("cat-select", { key: '24bff1c9438de8a2bce7801b161c6e0ed40a0f53', label: "Single with initials", ref: el => (this.singleSelectAvatarInitials = el), placeholder: "Hello World", clearable: true, errorUpdate: false }), index.h("cat-dropdown", { key: '263cf8e741c9f16f2602150cb2bc054b11deff3b', overflow: true }, index.h("cat-button", { key: '7bc7b524dfb08bb1691e3ebb391e44229345a98b', slot: "trigger", style: { width: '50%' } }, "Open select"), index.h("div", { key: '81565908aa8e60a82727269b3af83f9d9cc00e89', slot: "content", style: { width: '400px' } }, index.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%' } })))));
|
|
11696
11703
|
}
|
|
11697
11704
|
get countryConnector() {
|
|
11698
11705
|
return {
|
|
@@ -12948,7 +12955,7 @@ const CatSkeleton = class {
|
|
|
12948
12955
|
this.lines = undefined;
|
|
12949
12956
|
}
|
|
12950
12957
|
render() {
|
|
12951
|
-
return (index.h(index.Host, { key: '
|
|
12958
|
+
return (index.h(index.Host, { key: 'aed2e7fe276bc83e749cddeba379a495040850ea' }, Array.from(Array(this.count)).map(() => (index.h("div", { style: this.style, class: {
|
|
12952
12959
|
skeleton: true,
|
|
12953
12960
|
[`skeleton-${this.effect}`]: Boolean(this.effect),
|
|
12954
12961
|
[`skeleton-${this.variant}`]: Boolean(this.variant),
|
|
@@ -12988,9 +12995,9 @@ const CatSpinner = class {
|
|
|
12988
12995
|
this.a11yLabel = undefined;
|
|
12989
12996
|
}
|
|
12990
12997
|
render() {
|
|
12991
|
-
return (index.h("span", { key: '
|
|
12998
|
+
return (index.h("span", { key: '1cbc0ce9b663ba8edec261bc23822da72bca0e09', "aria-label": this.a11yLabel, "aria-hidden": this.a11yLabel ? null : 'true', class: {
|
|
12992
12999
|
[`spinner-${this.size}`]: this.size !== 'inline'
|
|
12993
|
-
} }, index.h("svg", { key: '
|
|
13000
|
+
} }, index.h("svg", { key: '8f282cdab11de5ae0ce0d5c33e8261d28642e8b3', xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 48 48" }, index.h("circle", { key: '1b283f2cca79367c1bbb284954f4c62b422d18ae', cx: "24", cy: "24", r: "21.5" }))));
|
|
12994
13001
|
}
|
|
12995
13002
|
};
|
|
12996
13003
|
CatSpinner.style = CatSpinnerStyle0;
|
|
@@ -13022,7 +13029,7 @@ const CatTab = class {
|
|
|
13022
13029
|
this.catClick.emit(event);
|
|
13023
13030
|
}
|
|
13024
13031
|
render() {
|
|
13025
|
-
return index.h(index.Host, { key: '
|
|
13032
|
+
return index.h(index.Host, { key: '3a0763022fe3c66e8405914f3212ba1d19fe1549' });
|
|
13026
13033
|
}
|
|
13027
13034
|
get hostElement() { return index.getElement(this); }
|
|
13028
13035
|
};
|
|
@@ -13086,7 +13093,7 @@ const CatTabs = class {
|
|
|
13086
13093
|
this.activate(this.tabs[index]);
|
|
13087
13094
|
}
|
|
13088
13095
|
render() {
|
|
13089
|
-
return (index.h(index.Host, { key: '
|
|
13096
|
+
return (index.h(index.Host, { key: '16cb1359d4242593e1caf1b2475c0fe24b91a69b' }, this.tabs.map((tab) => {
|
|
13090
13097
|
return (index.h("cat-button", { buttonId: tab.id, role: "tab", part: "tab", class: {
|
|
13091
13098
|
'cat-tab': true,
|
|
13092
13099
|
'cat-tab-active': tab.id === this.activeTab,
|
|
@@ -13203,15 +13210,15 @@ const CatTextarea = class {
|
|
|
13203
13210
|
}
|
|
13204
13211
|
}
|
|
13205
13212
|
render() {
|
|
13206
|
-
return (index.h(index.Host, { key: '
|
|
13213
|
+
return (index.h(index.Host, { key: 'fda117cd95fc6e41b9cd939b65ab22f977dde6ef' }, index.h("div", { key: '1f96b31c31880e8a75c8ad67c4057fb3010b1c9e', class: {
|
|
13207
13214
|
'textarea-field': true,
|
|
13208
13215
|
'textarea-horizontal': this.horizontal
|
|
13209
|
-
} }, index.h("div", { key: '
|
|
13216
|
+
} }, index.h("div", { key: '524ec0321e709ad45216275d0c554b7efde80f19', class: { 'label-container': true, hidden: this.labelHidden } }, (this.hasSlottedLabel || this.label) && (index.h("label", { key: '3aa9116de299d6eadf551159788cd0e244b5e919', htmlFor: this.id, part: "label" }, index.h("span", { key: 'ae397abd1be97bbb5c58fa35f4b560506cbbd5d1', class: "label-wrapper" }, (this.hasSlottedLabel && index.h("slot", { key: '81bb3f8151354ae9c6539f6816d963700beb861b', name: "label" })) || this.label, index.h("div", { key: '96000f760849536cb97eedd704e8a1bec14c15fa', class: "label-metadata" }, !this.required && (this.requiredMarker ?? 'optional').startsWith('optional') && (index.h("span", { key: '1ab3077d0d7a94c2459a2d5b6717cc4a3857b122', class: "label-optional", "aria-hidden": "true" }, "(", of.catI18nRegistry.t('input.optional'), ")")), this.required && this.requiredMarker?.startsWith('required') && (index.h("span", { key: '73944c3f9366064342fca115ae50612b9c75489e', class: "label-optional", "aria-hidden": "true" }, "(", of.catI18nRegistry.t('input.required'), ")")), this.maxLength && (index.h("div", { key: 'fe11e06174bcbf8e1957771be702fc052a4e5114', class: "label-character-count", "aria-hidden": "true" }, this.value?.length ?? 0, "/", this.maxLength))))))), index.h("div", { key: '94a9992673d408933040f359335f642fcc053182', class: "textarea-container" }, index.h("div", { key: 'df53a47f398d48cec2b50dff469eb9a91c59bc72', class: {
|
|
13210
13217
|
'textarea-wrapper': true,
|
|
13211
13218
|
'textarea-readonly': this.readonly,
|
|
13212
13219
|
'textarea-disabled': this.disabled,
|
|
13213
13220
|
'textarea-invalid': this.invalid
|
|
13214
|
-
} }, index.h("textarea", { key: '
|
|
13221
|
+
} }, index.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 && (index.h("cat-icon", { key: 'f9d4fc754bf0da656ee08f2b5b68fedba99c727c', icon: "$cat:input-error", class: "icon-suffix cat-text-danger", size: "l", onClick: () => this.textarea.focus() }))), this.hasHint && (index.h(CatFormHint, { key: '3112b8a801c9b5e51129df6349f89c097beb6f0d', id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && index.h("slot", { name: "hint" }), errorMap: this.errorMap }))))));
|
|
13215
13222
|
}
|
|
13216
13223
|
get hasHint() {
|
|
13217
13224
|
return !!this.hint || !!this.hasSlottedHint || this.invalid;
|
|
@@ -13429,14 +13436,14 @@ const CatTime = class {
|
|
|
13429
13436
|
this.input?.clear();
|
|
13430
13437
|
}
|
|
13431
13438
|
render() {
|
|
13432
|
-
return (index.h(index.Host, { key: '
|
|
13439
|
+
return (index.h(index.Host, { key: 'e9bfaeee8aa39aa58ac287afeaed1a2fc39d7b83' }, index.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) }, index.h("span", { key: 'e91e3e12272c24858a71b485e00e54cf00d7386f', slot: "label" }, this.hasSlottedLabel && index.h("slot", { key: '2449ea042497293868bcc767b1626070b3a1dcec', name: "label" }), !this.hasSlottedLabel && this.label, index.h("span", { key: '3bab583a7629d01350fbd9e54d3fe1f113e0b372', class: "label-aria" }, " (HH:mm)")), index.h("div", { key: '8340d31e70e30ebe1d020f456b3a7bc5bed6b998', slot: "addon", class: "cat-time-addon" }, this.locale.timeFormat === '12' && (index.h("cat-button", { key: 'e6bb50abe2c3296cee7c3d5c02a6cef7c69f8678', class: "cat-time-format", disabled: this.disabled || this.readonly, onCatClick: () => this.toggleAm() }, this.isAm ? 'AM' : 'PM')), index.h("cat-dropdown", { key: 'e79b7f58ffdc4d356e94f3e96afb6727d3e9be26', slot: "addon", placement: this.placement }, index.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 }), index.h("nav", { key: 'c2ae49020a1e8cafedd27b8a7e061e63dbb4c6d2', slot: "content", class: "cat-nav" }, index.h("ul", { key: 'b918672be1b65ca3a1c2daa239a196d4117b52f7' }, this.timeArray().map(time => {
|
|
13433
13440
|
const isoTime = formatIso(time);
|
|
13434
13441
|
const disabled = isBefore(time, this.min ?? null) || isAfter(time, this.max ?? null);
|
|
13435
13442
|
return (index.h("li", null, index.h("cat-button", { class: {
|
|
13436
13443
|
'cat-nav-item': true,
|
|
13437
13444
|
'time-disabled': disabled
|
|
13438
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))));
|
|
13439
|
-
}))))), this.hasSlottedHint && (index.h("span", { key: '
|
|
13446
|
+
}))))), this.hasSlottedHint && (index.h("span", { key: '817f2b58417911affc39ce6977160998c39ebf71', slot: "hint" }, index.h("slot", { key: 'a1ffdd541103064abf49311801088fe15d5ed88d', name: "hint" }))))));
|
|
13440
13447
|
}
|
|
13441
13448
|
timeArray() {
|
|
13442
13449
|
const result = [];
|
|
@@ -13555,13 +13562,13 @@ const CatToggle = class {
|
|
|
13555
13562
|
this.input.blur();
|
|
13556
13563
|
}
|
|
13557
13564
|
render() {
|
|
13558
|
-
return (index.h(index.Host, { key: '
|
|
13565
|
+
return (index.h(index.Host, { key: '021e20f2f3e8a37d085a11966df3980758fd4662' }, index.h("label", { key: '8454945f873a5cef9b0ab52fd533289059d5d77c', htmlFor: this.id, class: {
|
|
13559
13566
|
'is-hidden': this.labelHidden,
|
|
13560
13567
|
'is-disabled': this.disabled,
|
|
13561
13568
|
'label-left': this.labelLeft,
|
|
13562
13569
|
'align-center': this.alignment === 'center',
|
|
13563
13570
|
'align-end': this.alignment === 'bottom'
|
|
13564
|
-
} }, index.h("input", { key: '
|
|
13571
|
+
} }, index.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 }), index.h("span", { key: 'eb6c4b072ca903fd7df8a30e570be54c6df4133e', class: "toggle" }), index.h("span", { key: 'b07bb543bb4ac09fecd8ce1c0f0c1276846aa1e1', class: "label", part: "label" }, (this.hasSlottedLabel && index.h("slot", { key: '199cc06d3b54bb910c15449185b63d04f91163fd', name: "label" })) || this.label)), this.hasHint && (index.h("div", { key: '43145cb96e769390309ed4003e94b04c1bea1a53', class: { 'hint-wrapper': true, 'label-left': this.labelLeft } }, index.h("div", { key: 'f0cbb265cec353a7f68432e369f0f2c7d042c3c7', class: "toggle-placeholder" }), index.h(CatFormHint, { key: '06692bcf33bf7a3202cc8977238003b96b9e4b8c', id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && index.h("slot", { name: "hint" }) })))));
|
|
13565
13572
|
}
|
|
13566
13573
|
get hasHint() {
|
|
13567
13574
|
return !!this.hint || !!this.hasSlottedHint;
|
|
@@ -13648,12 +13655,12 @@ const CatTooltip = class {
|
|
|
13648
13655
|
}
|
|
13649
13656
|
}
|
|
13650
13657
|
render() {
|
|
13651
|
-
return (index.h(index.Host, { key: '
|
|
13658
|
+
return (index.h(index.Host, { key: '7d72ac4a2ccb057d7bca7290d6fc4e06c02c644c' }, index.h("slot", { key: '260fb1edf80d86a93892eed9df3ce4622cc441a3' }), index.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: {
|
|
13652
13659
|
tooltip: true,
|
|
13653
13660
|
'tooltip-hidden': this.inactive,
|
|
13654
13661
|
'tooltip-round': this.round,
|
|
13655
13662
|
[`tooltip-${this.size}`]: Boolean(this.size)
|
|
13656
|
-
} }, index.h("slot", { key: '
|
|
13663
|
+
} }, index.h("slot", { key: 'ebed88ce3b9481d6046cf5a70245c26a3dbc0a03', name: "content" }, index.h("p", { key: '455f894145ba5d1b8a8c001a6a4017d8aac81771' }, this.content)))));
|
|
13657
13664
|
}
|
|
13658
13665
|
async update() {
|
|
13659
13666
|
if (this.trigger && this.tooltip) {
|