@haiilo/catalyst 5.2.3 → 5.3.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.
Files changed (70) hide show
  1. package/dist/catalyst/catalyst.esm.js +1 -1
  2. package/dist/catalyst/catalyst.esm.js.map +1 -1
  3. package/dist/catalyst/p-ba081831.entry.js +10 -0
  4. package/dist/catalyst/p-ba081831.entry.js.map +1 -0
  5. package/dist/catalyst/scss/_snippets/_form-label.scss +2 -1
  6. package/dist/cjs/{cat-alert_24.cjs.entry.js → cat-alert_25.cjs.entry.js} +170 -28
  7. package/dist/cjs/cat-alert_25.cjs.entry.js.map +1 -0
  8. package/dist/cjs/catalyst.cjs.js +1 -1
  9. package/dist/cjs/loader.cjs.js +1 -1
  10. package/dist/collection/collection-manifest.json +1 -0
  11. package/dist/collection/components/cat-button/cat-button.css +20 -2
  12. package/dist/collection/components/cat-button/cat-button.js +21 -1
  13. package/dist/collection/components/cat-button/cat-button.js.map +1 -1
  14. package/dist/collection/components/cat-button-group/cat-button-group.css +15 -0
  15. package/dist/collection/components/cat-button-group/cat-button-group.js +51 -0
  16. package/dist/collection/components/cat-button-group/cat-button-group.js.map +1 -0
  17. package/dist/collection/components/cat-dropdown/cat-dropdown.js +14 -2
  18. package/dist/collection/components/cat-dropdown/cat-dropdown.js.map +1 -1
  19. package/dist/collection/components/cat-form-group/cat-form-group.js +28 -0
  20. package/dist/collection/components/cat-form-group/cat-form-group.js.map +1 -1
  21. package/dist/collection/components/cat-input/cat-input.css +8 -4
  22. package/dist/collection/components/cat-label/cat-label.js +19 -0
  23. package/dist/collection/components/cat-label/cat-label.js.map +1 -1
  24. package/dist/collection/components/cat-select/cat-select.css +90 -0
  25. package/dist/collection/components/cat-select/cat-select.js +31 -6
  26. package/dist/collection/components/cat-select/cat-select.js.map +1 -1
  27. package/dist/collection/components/cat-textarea/cat-textarea.css +8 -4
  28. package/dist/collection/components/cat-tooltip/cat-tooltip.css +0 -7
  29. package/dist/collection/components/cat-tooltip/cat-tooltip.js +22 -18
  30. package/dist/collection/components/cat-tooltip/cat-tooltip.js.map +1 -1
  31. package/dist/collection/scss/_snippets/_form-label.scss +2 -1
  32. package/dist/components/cat-button-group.d.ts +11 -0
  33. package/dist/components/cat-button-group.js +46 -0
  34. package/dist/components/cat-button-group.js.map +1 -0
  35. package/dist/components/cat-button2.js +6 -2
  36. package/dist/components/cat-button2.js.map +1 -1
  37. package/dist/components/cat-dropdown2.js +475 -3
  38. package/dist/components/cat-dropdown2.js.map +1 -1
  39. package/dist/components/cat-form-group.js +10 -1
  40. package/dist/components/cat-form-group.js.map +1 -1
  41. package/dist/components/cat-input.js +1 -1
  42. package/dist/components/cat-input.js.map +1 -1
  43. package/dist/components/cat-label.js +2 -0
  44. package/dist/components/cat-label.js.map +1 -1
  45. package/dist/components/cat-select2.js +11 -3
  46. package/dist/components/cat-select2.js.map +1 -1
  47. package/dist/components/cat-textarea.js +1 -1
  48. package/dist/components/cat-textarea.js.map +1 -1
  49. package/dist/components/cat-tooltip.js +24 -20
  50. package/dist/components/cat-tooltip.js.map +1 -1
  51. package/dist/components/floating-ui.dom.esm.js +85 -1
  52. package/dist/components/floating-ui.dom.esm.js.map +1 -1
  53. package/dist/esm/{cat-alert_24.entry.js → cat-alert_25.entry.js} +170 -29
  54. package/dist/esm/cat-alert_25.entry.js.map +1 -0
  55. package/dist/esm/catalyst.js +1 -1
  56. package/dist/esm/loader.js +1 -1
  57. package/dist/types/components/cat-button/cat-button.d.ts +4 -0
  58. package/dist/types/components/cat-button-group/cat-button-group.d.ts +11 -0
  59. package/dist/types/components/cat-form-group/cat-form-group.d.ts +5 -0
  60. package/dist/types/components/cat-label/cat-label.d.ts +4 -0
  61. package/dist/types/components/cat-select/cat-select.d.ts +4 -0
  62. package/dist/types/components/cat-tooltip/cat-tooltip.d.ts +2 -2
  63. package/dist/types/components.d.ts +53 -0
  64. package/package.json +2 -2
  65. package/dist/catalyst/p-d135d677.entry.js +0 -10
  66. package/dist/catalyst/p-d135d677.entry.js.map +0 -1
  67. package/dist/cjs/cat-alert_24.cjs.entry.js.map +0 -1
  68. package/dist/components/first-tabbable.js +0 -464
  69. package/dist/components/first-tabbable.js.map +0 -1
  70. package/dist/esm/cat-alert_24.entry.js.map +0 -1
@@ -256,7 +256,7 @@ function createEmptyStyleRule(query) {
256
256
  }
257
257
  }
258
258
 
259
- 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 0.13s linear, border-color 0.13s linear, background-color 0.13s linear, box-shadow 0.13s linear}.cat-button:focus-visible{outline:2px solid rgb(var(--cat-border-color-focus, 0, 113, 255));outline-offset:1px}.cat-button-content{word-wrap:break-word;word-break:break-word}.cat-button-ellipsed .cat-button-content{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-button-filled{background-color:rgb(var(--bg));color:rgb(var(--fill));font-weight: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.05)}.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){text-decoration:var(--cat-link-button-decoration-hover, none);background-color:rgba(var(--base), 0.05)}.cat-button-text.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading){text-decoration:var(--cat-link-button-decoration-hover, none);background-color:rgba(var(--base), 0.1)}.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-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.25rem 0.25rem;font-size:0.875rem;line-height:1rem;gap:0.25rem}.cat-button-xs.cat-button-icon{width:1.5rem;padding-left:0;padding-right:0}:host(.cat-button-pull[size=xs]){margin:-0.25rem -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.25rem;margin-bottom:-0.25rem}:host(.cat-button-pull-t[size=xs]){margin-top:-0.25rem}:host(.cat-button-pull-l[size=xs]){margin-left:-0.25rem}:host(.cat-button-pull-b[size=xs]){margin-bottom:-0.25rem}: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;padding-left:0;padding-right: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;padding-left:0;padding-right: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;padding-left:0;padding-right: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;padding-left:0;padding-right: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-active:not(:hover)){--cat-primary-text:transparent}:host(.cat-text-left) .cat-button{justify-content:left}:host(.cat-text-right) .cat-button{justify-content:right}:host(.cat-nav-item){width:100%}:host(.cat-nav-item) .cat-button{box-shadow:none;border-radius:0;justify-content:left;padding-left:1.25rem;padding-right:1.25rem;gap:0.5rem}:host(.cat-nav-item) .cat-button:focus-visible{outline-offset:-2px}";
259
+ 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 0.13s linear, border-color 0.13s linear, background-color 0.13s linear, box-shadow 0.13s linear}.cat-button:focus-visible{outline:2px solid rgb(var(--cat-border-color-focus, 0, 113, 255));outline-offset:1px}.cat-button-content{word-wrap:break-word;word-break:break-word}.cat-button-ellipsed .cat-button-content{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: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){text-decoration:var(--cat-link-button-decoration-hover, none);background-color:rgba(var(--base), 0.1)}.cat-button-text.cat-button-active:not(.cat-button-disabled):not(.cat-button-loading){text-decoration:var(--cat-link-button-decoration-hover, none);background-color:rgba(var(--base), 0.1)}.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-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.25rem 0.25rem;font-size:0.875rem;line-height:1rem;gap:0.25rem}.cat-button-xs.cat-button-icon{width:1.5rem;padding-left:0;padding-right:0}:host(.cat-button-pull[size=xs]){margin:-0.25rem -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.25rem;margin-bottom:-0.25rem}:host(.cat-button-pull-t[size=xs]){margin-top:-0.25rem}:host(.cat-button-pull-l[size=xs]){margin-left:-0.25rem}:host(.cat-button-pull-b[size=xs]){margin-bottom:-0.25rem}: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;padding-left:0;padding-right: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;padding-left:0;padding-right: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;padding-left:0;padding-right: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;padding-left:0;padding-right: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-active:not(:hover)){--cat-primary-text:transparent}:host(.cat-text-left) .cat-button{justify-content:left}:host(.cat-text-right) .cat-button{justify-content:right}:host(.cat-nav-item){width:100%}:host(.cat-nav-item) .cat-button{box-shadow:none;border-radius:0;justify-content:left;padding-left:1.25rem;padding-right:1.25rem;gap:0.5rem}:host(.cat-nav-item) .cat-button:focus-visible{outline-offset:-2px}";
260
260
 
261
261
  const CatButton = class {
262
262
  constructor(hostRef) {
@@ -286,6 +286,7 @@ const CatButton = class {
286
286
  this.a11yLabel = undefined;
287
287
  this.a11yCurrent = undefined;
288
288
  this.nativeAttributes = undefined;
289
+ this.buttonGroupPosition = undefined;
289
290
  }
290
291
  onIconOnlyChanged(value) {
291
292
  var _a, _b;
@@ -370,7 +371,9 @@ const CatButton = class {
370
371
  'cat-button-ellipsed': !this.noEllipsis && !this.isIconButton,
371
372
  [`cat-button-${this.variant}`]: Boolean(this.variant),
372
373
  [`cat-button-${this.color}`]: Boolean(this.color),
373
- [`cat-button-${this.size}`]: Boolean(this.size)
374
+ [`cat-button-${this.size}`]: Boolean(this.size),
375
+ [`cat-group-button-${this.buttonGroupPosition}`]: Boolean(this.buttonGroupPosition),
376
+ 'cat-group-button': Boolean(this.buttonGroupPosition)
374
377
  }, onClick: this.onClick.bind(this), onFocus: this.onFocus.bind(this), onBlur: this.onBlur.bind(this) }), this.content));
375
378
  }
376
379
  }
@@ -422,6 +425,27 @@ const CatButton = class {
422
425
  };
423
426
  CatButton.style = catButtonCss;
424
427
 
428
+ const catButtonGroupCss = ":host{position:relative;display:inline-flex;vertical-align:middle}::slotted(cat-button[variant=outlined]),::slotted(cat-button:not([variant])){margin-right:-1px}::slotted(cat-button[variant=outlined]:last-child),::slotted(cat-button:not([variant]):last-child){margin-right:0}";
429
+
430
+ const CatButtonGroup = class {
431
+ constructor(hostRef) {
432
+ registerInstance(this, hostRef);
433
+ this.formElements = [];
434
+ this.a11yLabel = undefined;
435
+ }
436
+ render() {
437
+ return (h(Host, { role: "group", "aria-label": this.a11yLabel }, h("slot", { onSlotchange: this.onSlotChange.bind(this) })));
438
+ }
439
+ onSlotChange() {
440
+ this.formElements = Array.from(this.hostElement.querySelectorAll('cat-button'));
441
+ this.formElements.forEach((element, index) => {
442
+ element.buttonGroupPosition = index === 0 ? 'first' : index === this.formElements.length - 1 ? 'last' : 'middle';
443
+ });
444
+ }
445
+ get hostElement() { return getElement(this); }
446
+ };
447
+ CatButtonGroup.style = catButtonGroupCss;
448
+
425
449
  const catCardCss = ":host{display:block;margin-bottom:1rem;border-radius:var(--cat-border-radius-l, 0.5rem);background-color:white;padding:1.25rem}:host([hidden]){display:none}::slotted(:last-child){margin-bottom:0 !important}::slotted(nav),::slotted(nav:last-child){margin:-0.75rem -1.25rem !important}::slotted(.cat-card-pull){margin:-1.25rem !important;width:calc(100% + 2.5rem) !important;height:calc(100% + 2.5rem) !important}::slotted(.cat-card-pull-h){margin-left:-1.25rem !important;margin-right:-1.25rem !important;width:calc(100% + 2.5rem) !important}::slotted(.cat-card-pull-v){margin-top:-1.25rem !important;margin-bottom:-1.25rem !important;height:calc(100% + 2.5rem) !important}::slotted(.cat-card-pull-t){margin-top:-1.25rem !important}::slotted(.cat-card-pull-l){margin-left:-1.25rem !important}::slotted(.cat-card-pull-r){margin-right:-1.25rem !important}::slotted(.cat-card-pull-b){margin-bottom:-1.25rem !important}";
426
450
 
427
451
  const CatCard = class {
@@ -1128,6 +1152,90 @@ const shift = function (options) {
1128
1152
  };
1129
1153
  };
1130
1154
 
1155
+ /**
1156
+ * Provides data that allows you to change the size of the floating element —
1157
+ * for instance, prevent it from overflowing the clipping boundary or match the
1158
+ * width of the reference element.
1159
+ * @see https://floating-ui.com/docs/size
1160
+ */
1161
+ const size = function (options) {
1162
+ if (options === void 0) {
1163
+ options = {};
1164
+ }
1165
+ return {
1166
+ name: 'size',
1167
+ options,
1168
+ async fn(state) {
1169
+ const {
1170
+ placement,
1171
+ rects,
1172
+ platform,
1173
+ elements
1174
+ } = state;
1175
+ const {
1176
+ apply = () => {},
1177
+ ...detectOverflowOptions
1178
+ } = options;
1179
+ const overflow = await detectOverflow(state, detectOverflowOptions);
1180
+ const side = getSide(placement);
1181
+ const alignment = getAlignment(placement);
1182
+ const axis = getMainAxisFromPlacement(placement);
1183
+ const isXAxis = axis === 'x';
1184
+ const {
1185
+ width,
1186
+ height
1187
+ } = rects.floating;
1188
+ let heightSide;
1189
+ let widthSide;
1190
+ if (side === 'top' || side === 'bottom') {
1191
+ heightSide = side;
1192
+ widthSide = alignment === ((await (platform.isRTL == null ? void 0 : platform.isRTL(elements.floating))) ? 'start' : 'end') ? 'left' : 'right';
1193
+ } else {
1194
+ widthSide = side;
1195
+ heightSide = alignment === 'end' ? 'top' : 'bottom';
1196
+ }
1197
+ const overflowAvailableHeight = height - overflow[heightSide];
1198
+ const overflowAvailableWidth = width - overflow[widthSide];
1199
+ let availableHeight = overflowAvailableHeight;
1200
+ let availableWidth = overflowAvailableWidth;
1201
+ if (isXAxis) {
1202
+ availableWidth = min$1(
1203
+ // Maximum clipping viewport width
1204
+ width - overflow.right - overflow.left, overflowAvailableWidth);
1205
+ } else {
1206
+ availableHeight = min$1(
1207
+ // Maximum clipping viewport height
1208
+ height - overflow.bottom - overflow.top, overflowAvailableHeight);
1209
+ }
1210
+ if (!state.middlewareData.shift && !alignment) {
1211
+ const xMin = max$1(overflow.left, 0);
1212
+ const xMax = max$1(overflow.right, 0);
1213
+ const yMin = max$1(overflow.top, 0);
1214
+ const yMax = max$1(overflow.bottom, 0);
1215
+ if (isXAxis) {
1216
+ availableWidth = width - 2 * (xMin !== 0 || xMax !== 0 ? xMin + xMax : max$1(overflow.left, overflow.right));
1217
+ } else {
1218
+ availableHeight = height - 2 * (yMin !== 0 || yMax !== 0 ? yMin + yMax : max$1(overflow.top, overflow.bottom));
1219
+ }
1220
+ }
1221
+ await apply({
1222
+ ...state,
1223
+ availableWidth,
1224
+ availableHeight
1225
+ });
1226
+ const nextDimensions = await platform.getDimensions(elements.floating);
1227
+ if (width !== nextDimensions.width || height !== nextDimensions.height) {
1228
+ return {
1229
+ reset: {
1230
+ rects: true
1231
+ }
1232
+ };
1233
+ }
1234
+ return {};
1235
+ }
1236
+ };
1237
+ };
1238
+
1131
1239
  function getWindow(node) {
1132
1240
  var _node$ownerDocument;
1133
1241
  return ((_node$ownerDocument = node.ownerDocument) == null ? void 0 : _node$ownerDocument.defaultView) || window;
@@ -3127,7 +3235,19 @@ const CatDropdown = class {
3127
3235
  computePosition(this.trigger, this.content, {
3128
3236
  strategy: 'fixed',
3129
3237
  placement: this.placement,
3130
- middleware: [offset(CatDropdown.OFFSET), flip()]
3238
+ middleware: [
3239
+ offset(CatDropdown.OFFSET),
3240
+ flip(),
3241
+ size({
3242
+ padding: CatDropdown.OFFSET,
3243
+ apply({ availableWidth, availableHeight, elements }) {
3244
+ Object.assign(elements.floating.style, {
3245
+ maxWidth: `${availableWidth}px`,
3246
+ maxHeight: `${availableHeight}px`
3247
+ });
3248
+ }
3249
+ })
3250
+ ]
3131
3251
  }).then(({ x, y, placement }) => {
3132
3252
  this.content.dataset.placement = placement;
3133
3253
  Object.assign(this.content.style, {
@@ -3148,18 +3268,25 @@ const CatFormGroup = class {
3148
3268
  registerInstance(this, hostRef);
3149
3269
  this.formElements = [];
3150
3270
  this.requiredMarker = 'auto';
3271
+ this.horizontal = false;
3151
3272
  this.labelSize = undefined;
3152
3273
  }
3153
3274
  onRequiredMarker(newRequiredMarker) {
3154
3275
  const updateMarker = newRequiredMarker === 'auto' ? this.calculate(this.formElements) : newRequiredMarker;
3155
3276
  this.formElements.forEach(element => { var _a; return !((_a = element.requiredMarker) === null || _a === void 0 ? void 0 : _a.endsWith('!')) && (element.requiredMarker = updateMarker); });
3156
3277
  }
3278
+ onHorizontal(newHorizontal) {
3279
+ this.formElements.forEach(element => {
3280
+ element.horizontal = newHorizontal;
3281
+ });
3282
+ }
3157
3283
  render() {
3158
3284
  return (h(Host, { style: { '--label-size': this.labelSize } }, h("slot", { onSlotchange: this.onSlotChange.bind(this) })));
3159
3285
  }
3160
3286
  onSlotChange() {
3161
3287
  this.formElements = Array.from(this.hostElement.querySelectorAll('cat-textarea, cat-input, cat-select, cat-label'));
3162
3288
  this.onRequiredMarker(this.requiredMarker);
3289
+ this.onHorizontal(this.horizontal);
3163
3290
  }
3164
3291
  calculate(elements) {
3165
3292
  const formFields = elements.filter(value => value.tagName !== 'CAT-LABEL');
@@ -3169,7 +3296,8 @@ const CatFormGroup = class {
3169
3296
  }
3170
3297
  get hostElement() { return getElement(this); }
3171
3298
  static get watchers() { return {
3172
- "requiredMarker": ["onRequiredMarker"]
3299
+ "requiredMarker": ["onRequiredMarker"],
3300
+ "horizontal": ["onHorizontal"]
3173
3301
  }; }
3174
3302
  };
3175
3303
  CatFormGroup.style = catFormGroupCss;
@@ -3204,7 +3332,7 @@ function isNumberValue(value) {
3204
3332
  return !isNaN(parseFloat(value)) && !isNaN(Number(value));
3205
3333
  }
3206
3334
 
3207
- const catInputCss = ".hint-section{display:flex;gap:0.5rem;flex-direction:column;color:rgb(var(--cat-hint-color, inherit))}.hint-section .input-hint,.hint-section ::slotted([slot=hint]){font-size:0.875rem;line-height:1rem;font-weight:var(--cat-font-weight-body, 400);margin:0 !important}.cat-bg-primary{background-color:rgb(var(--cat-primary-bg, 0, 129, 148)) !important;color:rgb(var(--cat-primary-fill, 255, 255, 255)) !important}.cat-bg-primary-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-primary-hover:hover{background-color:rgb(var(--cat-primary-bg-hover, 1, 115, 132)) !important;color:rgb(var(--cat-primary-fill-hover, 255, 255, 255)) !important}.cat-text-primary,.cat-link-primary{color:rgb(var(--cat-primary-text, 0, 129, 148)) !important}.cat-link-primary,.cat-text-primary-hover{transition:color 0.13s}.cat-link-primary:hover,.cat-text-primary-hover:hover{color:rgb(var(--cat-primary-text-hover, 1, 115, 132)) !important}.cat-link-primary:active,.cat-text-primary-hover:active{color:rgb(var(--cat-primary-text-active, 2, 99, 113)) !important}.cat-bg-primaryInverted{background-color:#93b4f2 !important;color:black !important}.cat-bg-primaryInverted-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-primaryInverted-hover:hover{background-color:#93b4f2 !important;color:black !important}.cat-text-primaryInverted,.cat-link-primaryInverted{color:#93b4f2 !important}.cat-link-primaryInverted,.cat-text-primaryInverted-hover{transition:color 0.13s}.cat-link-primaryInverted:hover,.cat-text-primaryInverted-hover:hover{color:#93b4f2 !important}.cat-link-primaryInverted:active,.cat-text-primaryInverted-hover:active{color:#93b4f2 !important}.cat-bg-secondary{background-color:rgb(var(--cat-secondary-bg, 105, 118, 135)) !important;color:rgb(var(--cat-secondary-fill, 255, 255, 255)) !important}.cat-bg-secondary-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-secondary-hover:hover{background-color:rgb(var(--cat-secondary-bg-hover, 105, 118, 135)) !important;color:rgb(var(--cat-secondary-fill-hover, 255, 255, 255)) !important}.cat-text-secondary,.cat-link-secondary{color:rgb(var(--cat-secondary-text, 0, 0, 0)) !important}.cat-link-secondary,.cat-text-secondary-hover{transition:color 0.13s}.cat-link-secondary:hover,.cat-text-secondary-hover:hover{color:rgb(var(--cat-secondary-text-hover, 0, 0, 0)) !important}.cat-link-secondary:active,.cat-text-secondary-hover:active{color:rgb(var(--cat-secondary-text-active, 0, 0, 0)) !important}.cat-bg-secondaryInverted{background-color:#697687 !important;color:black !important}.cat-bg-secondaryInverted-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-secondaryInverted-hover:hover{background-color:#697687 !important;color:black !important}.cat-text-secondaryInverted,.cat-link-secondaryInverted{color:white !important}.cat-link-secondaryInverted,.cat-text-secondaryInverted-hover{transition:color 0.13s}.cat-link-secondaryInverted:hover,.cat-text-secondaryInverted-hover:hover{color:white !important}.cat-link-secondaryInverted:active,.cat-text-secondaryInverted-hover:active{color:white !important}.cat-bg-success{background-color:rgb(var(--cat-success-bg-, 0, 132, 88)) !important;color:rgb(var(--cat-success-fill, 255, 255, 255)) !important}.cat-bg-success-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-success-hover:hover{background-color:rgb(var(--cat-success-bg-hover, 0, 117, 78)) !important;color:rgb(var(--cat-success-fill-hover, 255, 255, 255)) !important}.cat-text-success,.cat-link-success{color:rgb(var(--cat-success-text, 0, 132, 88)) !important}.cat-link-success,.cat-text-success-hover{transition:color 0.13s}.cat-link-success:hover,.cat-text-success-hover:hover{color:rgb(var(--cat-success-text-hover, 0, 117, 78)) !important}.cat-link-success:active,.cat-text-success-hover:active{color:rgb(var(--cat-success-text-active, 0, 105, 70)) !important}.cat-bg-warning{background-color:rgb(var(--cat-warning-bg, 255, 206, 128)) !important;color:rgb(var(--cat-warning-fill, 0, 0, 0)) !important}.cat-bg-warning-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-warning-hover:hover{background-color:rgb(var(--cat-warning-bg-hover, 255, 214, 148)) !important;color:rgb(var(--cat-warning-fill-hover, 0, 0, 0)) !important}.cat-text-warning,.cat-link-warning{color:rgb(var(--cat-warning-text, 159, 97, 0)) !important}.cat-link-warning,.cat-text-warning-hover{transition:color 0.13s}.cat-link-warning:hover,.cat-text-warning-hover:hover{color:rgb(var(--cat-warning-text-hover, 159, 97, 0)) !important}.cat-link-warning:active,.cat-text-warning-hover:active{color:rgb(var(--cat-warning-text-active, 159, 97, 0)) !important}.cat-bg-danger{background-color:rgb(var(--cat-danger-bg, 217, 52, 13)) !important;color:rgb(var(--cat-danger-fill, 255, 255, 255)) !important}.cat-bg-danger-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-danger-hover:hover{background-color:rgb(var(--cat-danger-bg-hover, 194, 46, 11)) !important;color:rgb(var(--cat-danger-fill-hover, 255, 255, 255)) !important}.cat-text-danger,.cat-link-danger{color:rgb(var(--cat-danger-text, 217, 52, 13)) !important}.cat-link-danger,.cat-text-danger-hover{transition:color 0.13s}.cat-link-danger:hover,.cat-text-danger-hover:hover{color:rgb(var(--cat-danger-text-hover, 194, 46, 11)) !important}.cat-link-danger:active,.cat-text-danger-hover:active{color:rgb(var(--cat-danger-text-active, 174, 42, 10)) !important}.cat-active{color:rgb(var(--cat-primary-text, 0, 129, 148)) !important}.cat-muted{color:rgb(var(--cat-font-color-muted, 81, 92, 108)) !important}.cat-text-reset{color:inherit !important}.cat-link-reset{color:inherit !important;text-decoration:inherit !important}.label{overflow:hidden;word-wrap:break-word;word-break:break-word}.label-container{flex-basis:var(--label-size, 33.33%)}.label-container.hidden{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.label-container .label-wrapper{display:flex;gap:0.25rem}.label-metadata{display:flex;flex-shrink:0;flex-grow:1;justify-content:space-between;gap:0.25rem}.label-optional{display:flex;align-items:center;max-height:1.25rem;font-size:0.75rem;line-height:1rem;font-weight:var(--cat-font-weight-body, 400);color:rgb(var(--cat-font-color-muted, 81, 92, 108))}.label-character-count{display:flex;align-items:center;margin-left:auto;max-height:1.25rem;font-size:0.75rem;line-height:1rem;font-weight:var(--cat-font-weight-body, 400);color:rgb(var(--cat-font-color-muted, 81, 92, 108))}.input-horizontal .label-wrapper,.textarea-horizontal .label-wrapper{flex-direction:column}.input-horizontal label,.textarea-horizontal label{min-height:2.5rem;display:inline-flex;align-items:center}.input-horizontal .label-metadata,.textarea-horizontal .label-metadata{justify-content:flex-start}.input-horizontal .label-metadata .label-character-count,.textarea-horizontal .label-metadata .label-character-count{margin-left:0}:host{display:flex;font-size:0.9375rem;line-height:1.25rem;font-weight:var(--cat-font-weight-body, 400);margin-bottom:1rem}:host([hidden]){display:none}.input-field,.input-container{display:flex;flex-direction:column;gap:0.5rem;flex:1 1 auto}.input-field.input-horizontal{flex-direction:row;gap:1rem}.input-wrapper{display:flex;align-items:stretch;gap:0.75rem;padding:0 0.75rem;height:2.5rem;overflow:hidden;background:white;border-radius:var(--cat-border-radius-m, 0.25rem);box-shadow:0 0 0 1px rgb(var(--cat-border-color-dark, 215, 219, 224));transition:box-shadow 0.13s linear;}.input-wrapper.input-round{border-radius:10rem}.input-wrapper.input-disabled{background:#f2f4f7;cursor:not-allowed;color:rgb(var(--cat-font-color-muted, 81, 92, 108))}.input-wrapper:not(.input-disabled):hover{box-shadow:0 0 0 2px rgb(var(--cat-border-color-dark, 215, 219, 224))}.input-wrapper:not(.input-disabled):hover.input-invalid{box-shadow:0 0 0 2px rgba(var(--cat-danger-bg, 217, 52, 13), 0.2)}.input-wrapper:not(.input-disabled):focus-within{outline:2px solid rgb(var(--cat-border-color-focus, 0, 113, 255))}.input-wrapper:not(.input-disabled):focus-within.input-invalid{outline:2px solid rgba(var(--cat-danger-bg, 217, 52, 13), 0.2)}.input-wrapper.input-invalid{box-shadow:0 0 0 1px rgba(var(--cat-danger-bg, 217, 52, 13), 0.2)}.input-wrapper:has(input:-webkit-autofill),.input-wrapper:has(input:-webkit-autofill):hover,.input-wrapper:has(input:-webkit-autofill):focus{background-color:#e8f0fe}.text-prefix,.text-suffix{display:inline-flex;align-items:center;-webkit-user-select:none;-ms-user-select:none;user-select:none;}.text-prefix{border-right:1px solid rgb(var(--cat-border-color-dark, 215, 219, 224));padding-right:0.75rem}.text-suffix{border-left:1px solid rgb(var(--cat-border-color-dark, 215, 219, 224));padding-left:0.75rem}.icon-prefix,.icon-suffix{align-self:center}.input-inner-wrapper{display:flex;align-items:center;position:relative;flex:1 1 auto}input{font:inherit;margin:0;padding:0;width:100%;min-width:0;border:none;outline:none;background:none;}.input-disabled input{cursor:not-allowed;color:rgb(var(--cat-font-color-muted, 81, 92, 108))}input.has-clearable{padding-right:1.5rem}input::placeholder{color:rgb(var(--cat-font-color-muted, 81, 92, 108))}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 9999px #e8f0fe inset}.clearable{position:absolute;top:calc(50% - 1rem);right:-0.5rem}";
3335
+ const catInputCss = ".hint-section{display:flex;gap:0.5rem;flex-direction:column;color:rgb(var(--cat-hint-color, inherit))}.hint-section .input-hint,.hint-section ::slotted([slot=hint]){font-size:0.875rem;line-height:1rem;font-weight:var(--cat-font-weight-body, 400);margin:0 !important}.cat-bg-primary{background-color:rgb(var(--cat-primary-bg, 0, 129, 148)) !important;color:rgb(var(--cat-primary-fill, 255, 255, 255)) !important}.cat-bg-primary-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-primary-hover:hover{background-color:rgb(var(--cat-primary-bg-hover, 1, 115, 132)) !important;color:rgb(var(--cat-primary-fill-hover, 255, 255, 255)) !important}.cat-text-primary,.cat-link-primary{color:rgb(var(--cat-primary-text, 0, 129, 148)) !important}.cat-link-primary,.cat-text-primary-hover{transition:color 0.13s}.cat-link-primary:hover,.cat-text-primary-hover:hover{color:rgb(var(--cat-primary-text-hover, 1, 115, 132)) !important}.cat-link-primary:active,.cat-text-primary-hover:active{color:rgb(var(--cat-primary-text-active, 2, 99, 113)) !important}.cat-bg-primaryInverted{background-color:#93b4f2 !important;color:black !important}.cat-bg-primaryInverted-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-primaryInverted-hover:hover{background-color:#93b4f2 !important;color:black !important}.cat-text-primaryInverted,.cat-link-primaryInverted{color:#93b4f2 !important}.cat-link-primaryInverted,.cat-text-primaryInverted-hover{transition:color 0.13s}.cat-link-primaryInverted:hover,.cat-text-primaryInverted-hover:hover{color:#93b4f2 !important}.cat-link-primaryInverted:active,.cat-text-primaryInverted-hover:active{color:#93b4f2 !important}.cat-bg-secondary{background-color:rgb(var(--cat-secondary-bg, 105, 118, 135)) !important;color:rgb(var(--cat-secondary-fill, 255, 255, 255)) !important}.cat-bg-secondary-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-secondary-hover:hover{background-color:rgb(var(--cat-secondary-bg-hover, 105, 118, 135)) !important;color:rgb(var(--cat-secondary-fill-hover, 255, 255, 255)) !important}.cat-text-secondary,.cat-link-secondary{color:rgb(var(--cat-secondary-text, 0, 0, 0)) !important}.cat-link-secondary,.cat-text-secondary-hover{transition:color 0.13s}.cat-link-secondary:hover,.cat-text-secondary-hover:hover{color:rgb(var(--cat-secondary-text-hover, 0, 0, 0)) !important}.cat-link-secondary:active,.cat-text-secondary-hover:active{color:rgb(var(--cat-secondary-text-active, 0, 0, 0)) !important}.cat-bg-secondaryInverted{background-color:#697687 !important;color:black !important}.cat-bg-secondaryInverted-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-secondaryInverted-hover:hover{background-color:#697687 !important;color:black !important}.cat-text-secondaryInverted,.cat-link-secondaryInverted{color:white !important}.cat-link-secondaryInverted,.cat-text-secondaryInverted-hover{transition:color 0.13s}.cat-link-secondaryInverted:hover,.cat-text-secondaryInverted-hover:hover{color:white !important}.cat-link-secondaryInverted:active,.cat-text-secondaryInverted-hover:active{color:white !important}.cat-bg-success{background-color:rgb(var(--cat-success-bg-, 0, 132, 88)) !important;color:rgb(var(--cat-success-fill, 255, 255, 255)) !important}.cat-bg-success-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-success-hover:hover{background-color:rgb(var(--cat-success-bg-hover, 0, 117, 78)) !important;color:rgb(var(--cat-success-fill-hover, 255, 255, 255)) !important}.cat-text-success,.cat-link-success{color:rgb(var(--cat-success-text, 0, 132, 88)) !important}.cat-link-success,.cat-text-success-hover{transition:color 0.13s}.cat-link-success:hover,.cat-text-success-hover:hover{color:rgb(var(--cat-success-text-hover, 0, 117, 78)) !important}.cat-link-success:active,.cat-text-success-hover:active{color:rgb(var(--cat-success-text-active, 0, 105, 70)) !important}.cat-bg-warning{background-color:rgb(var(--cat-warning-bg, 255, 206, 128)) !important;color:rgb(var(--cat-warning-fill, 0, 0, 0)) !important}.cat-bg-warning-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-warning-hover:hover{background-color:rgb(var(--cat-warning-bg-hover, 255, 214, 148)) !important;color:rgb(var(--cat-warning-fill-hover, 0, 0, 0)) !important}.cat-text-warning,.cat-link-warning{color:rgb(var(--cat-warning-text, 159, 97, 0)) !important}.cat-link-warning,.cat-text-warning-hover{transition:color 0.13s}.cat-link-warning:hover,.cat-text-warning-hover:hover{color:rgb(var(--cat-warning-text-hover, 159, 97, 0)) !important}.cat-link-warning:active,.cat-text-warning-hover:active{color:rgb(var(--cat-warning-text-active, 159, 97, 0)) !important}.cat-bg-danger{background-color:rgb(var(--cat-danger-bg, 217, 52, 13)) !important;color:rgb(var(--cat-danger-fill, 255, 255, 255)) !important}.cat-bg-danger-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-danger-hover:hover{background-color:rgb(var(--cat-danger-bg-hover, 194, 46, 11)) !important;color:rgb(var(--cat-danger-fill-hover, 255, 255, 255)) !important}.cat-text-danger,.cat-link-danger{color:rgb(var(--cat-danger-text, 217, 52, 13)) !important}.cat-link-danger,.cat-text-danger-hover{transition:color 0.13s}.cat-link-danger:hover,.cat-text-danger-hover:hover{color:rgb(var(--cat-danger-text-hover, 194, 46, 11)) !important}.cat-link-danger:active,.cat-text-danger-hover:active{color:rgb(var(--cat-danger-text-active, 174, 42, 10)) !important}.cat-active{color:rgb(var(--cat-primary-text, 0, 129, 148)) !important}.cat-muted{color:rgb(var(--cat-font-color-muted, 81, 92, 108)) !important}.cat-text-reset{color:inherit !important}.cat-link-reset{color:inherit !important;text-decoration:inherit !important}.label{overflow:hidden;word-wrap:break-word;word-break:break-word}.label-container{flex-basis:var(--label-size, 33.33%)}.label-container.hidden{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.label-container .label-wrapper{display:flex;gap:0.25rem}.label-metadata{display:flex;flex-shrink:0;flex-grow:1;justify-content:space-between;gap:0.25rem}.label-optional{display:flex;align-items:center;max-height:1.25rem;font-size:0.75rem;line-height:1rem;font-weight:var(--cat-font-weight-body, 400);color:rgb(var(--cat-font-color-muted, 81, 92, 108))}.label-character-count{display:flex;align-items:center;margin-left:auto;max-height:1.25rem;font-size:0.75rem;line-height:1rem;font-weight:var(--cat-font-weight-body, 400);color:rgb(var(--cat-font-color-muted, 81, 92, 108))}.input-horizontal .label-wrapper,.textarea-horizontal .label-wrapper,.select-horizontal .label-wrapper{flex-direction:column}.input-horizontal label,.textarea-horizontal label,.select-horizontal label{min-height:2.5rem;display:inline-flex;align-items:center}.input-horizontal .label-metadata,.textarea-horizontal .label-metadata,.select-horizontal .label-metadata{justify-content:flex-start}.input-horizontal .label-metadata .label-character-count,.textarea-horizontal .label-metadata .label-character-count,.select-horizontal .label-metadata .label-character-count{margin-left:0}:host{display:flex;font-size:0.9375rem;line-height:1.25rem;font-weight:var(--cat-font-weight-body, 400);margin-bottom:1rem}:host([hidden]){display:none}.input-field,.input-container{display:flex;flex-direction:column;gap:0.5rem;flex:1 1 auto}.input-field.input-horizontal{flex-direction:row;gap:1rem}.input-wrapper{display:flex;align-items:stretch;gap:0.75rem;padding:0 0.75rem;height:2.5rem;overflow:hidden;background:white;border-radius:var(--cat-border-radius-m, 0.25rem);box-shadow:0 0 0 1px rgb(var(--cat-border-color-dark, 215, 219, 224));transition:box-shadow 0.13s linear;}.input-wrapper.input-round{border-radius:10rem}.input-wrapper.input-disabled{background:#f2f4f7;cursor:not-allowed;color:rgb(var(--cat-font-color-muted, 81, 92, 108))}.input-wrapper:not(.input-disabled):hover{box-shadow:0 0 0 2px rgb(var(--cat-border-color-dark, 215, 219, 224))}.input-wrapper:not(.input-disabled):hover.input-invalid{box-shadow:0 0 0 2px rgba(var(--cat-danger-bg, 217, 52, 13), 0.2)}.input-wrapper:not(.input-disabled):focus-within{outline:2px solid rgb(var(--cat-border-color-focus, 0, 113, 255))}.input-wrapper:not(.input-disabled):focus-within.input-invalid{outline:2px solid rgba(var(--cat-danger-bg, 217, 52, 13), 0.2)}.input-wrapper.input-invalid{box-shadow:0 0 0 1px rgba(var(--cat-danger-bg, 217, 52, 13), 0.2)}.input-wrapper:has(input:-webkit-autofill),.input-wrapper:has(input:-webkit-autofill):hover,.input-wrapper:has(input:-webkit-autofill):focus{background-color:#e8f0fe}.text-prefix,.text-suffix{display:inline-flex;align-items:center;-webkit-user-select:none;-ms-user-select:none;user-select:none;}.text-prefix{border-right:1px solid rgb(var(--cat-border-color-dark, 215, 219, 224));padding-right:0.75rem}.text-suffix{border-left:1px solid rgb(var(--cat-border-color-dark, 215, 219, 224));padding-left:0.75rem}.icon-prefix,.icon-suffix{align-self:center}.input-inner-wrapper{display:flex;align-items:center;position:relative;flex:1 1 auto}input{font:inherit;margin:0;padding:0;width:100%;min-width:0;border:none;outline:none;background:none;}.input-disabled input{cursor:not-allowed;color:rgb(var(--cat-font-color-muted, 81, 92, 108))}input.has-clearable{padding-right:1.5rem}input::placeholder{color:rgb(var(--cat-font-color-muted, 81, 92, 108))}input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 9999px #e8f0fe inset}.clearable{position:absolute;top:calc(50% - 1rem);right:-0.5rem}";
3208
3336
 
3209
3337
  let nextUniqueId$6 = 0;
3210
3338
  const CatInput = class {
@@ -3363,6 +3491,7 @@ const CatLabel = class {
3363
3491
  constructor(hostRef) {
3364
3492
  registerInstance(this, hostRef);
3365
3493
  this.requiredMarker = 'optional';
3494
+ this.horizontal = false;
3366
3495
  this.for = undefined;
3367
3496
  this.required = false;
3368
3497
  }
@@ -5501,7 +5630,7 @@ var autosizeInput = function (element, options) {
5501
5630
  }
5502
5631
  };
5503
5632
 
5504
- const catSelectCss = ".hint-section{display:flex;gap:0.5rem;flex-direction:column;color:rgb(var(--cat-hint-color, inherit))}.hint-section .input-hint,.hint-section ::slotted([slot=hint]){font-size:0.875rem;line-height:1rem;font-weight:var(--cat-font-weight-body, 400);margin:0 !important}.cat-bg-primary{background-color:rgb(var(--cat-primary-bg, 0, 129, 148)) !important;color:rgb(var(--cat-primary-fill, 255, 255, 255)) !important}.cat-bg-primary-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-primary-hover:hover{background-color:rgb(var(--cat-primary-bg-hover, 1, 115, 132)) !important;color:rgb(var(--cat-primary-fill-hover, 255, 255, 255)) !important}.cat-text-primary,.cat-link-primary{color:rgb(var(--cat-primary-text, 0, 129, 148)) !important}.cat-link-primary,.cat-text-primary-hover{transition:color 0.13s}.cat-link-primary:hover,.cat-text-primary-hover:hover{color:rgb(var(--cat-primary-text-hover, 1, 115, 132)) !important}.cat-link-primary:active,.cat-text-primary-hover:active{color:rgb(var(--cat-primary-text-active, 2, 99, 113)) !important}.cat-bg-primaryInverted{background-color:#93b4f2 !important;color:black !important}.cat-bg-primaryInverted-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-primaryInverted-hover:hover{background-color:#93b4f2 !important;color:black !important}.cat-text-primaryInverted,.cat-link-primaryInverted{color:#93b4f2 !important}.cat-link-primaryInverted,.cat-text-primaryInverted-hover{transition:color 0.13s}.cat-link-primaryInverted:hover,.cat-text-primaryInverted-hover:hover{color:#93b4f2 !important}.cat-link-primaryInverted:active,.cat-text-primaryInverted-hover:active{color:#93b4f2 !important}.cat-bg-secondary{background-color:rgb(var(--cat-secondary-bg, 105, 118, 135)) !important;color:rgb(var(--cat-secondary-fill, 255, 255, 255)) !important}.cat-bg-secondary-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-secondary-hover:hover{background-color:rgb(var(--cat-secondary-bg-hover, 105, 118, 135)) !important;color:rgb(var(--cat-secondary-fill-hover, 255, 255, 255)) !important}.cat-text-secondary,.cat-link-secondary{color:rgb(var(--cat-secondary-text, 0, 0, 0)) !important}.cat-link-secondary,.cat-text-secondary-hover{transition:color 0.13s}.cat-link-secondary:hover,.cat-text-secondary-hover:hover{color:rgb(var(--cat-secondary-text-hover, 0, 0, 0)) !important}.cat-link-secondary:active,.cat-text-secondary-hover:active{color:rgb(var(--cat-secondary-text-active, 0, 0, 0)) !important}.cat-bg-secondaryInverted{background-color:#697687 !important;color:black !important}.cat-bg-secondaryInverted-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-secondaryInverted-hover:hover{background-color:#697687 !important;color:black !important}.cat-text-secondaryInverted,.cat-link-secondaryInverted{color:white !important}.cat-link-secondaryInverted,.cat-text-secondaryInverted-hover{transition:color 0.13s}.cat-link-secondaryInverted:hover,.cat-text-secondaryInverted-hover:hover{color:white !important}.cat-link-secondaryInverted:active,.cat-text-secondaryInverted-hover:active{color:white !important}.cat-bg-success{background-color:rgb(var(--cat-success-bg-, 0, 132, 88)) !important;color:rgb(var(--cat-success-fill, 255, 255, 255)) !important}.cat-bg-success-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-success-hover:hover{background-color:rgb(var(--cat-success-bg-hover, 0, 117, 78)) !important;color:rgb(var(--cat-success-fill-hover, 255, 255, 255)) !important}.cat-text-success,.cat-link-success{color:rgb(var(--cat-success-text, 0, 132, 88)) !important}.cat-link-success,.cat-text-success-hover{transition:color 0.13s}.cat-link-success:hover,.cat-text-success-hover:hover{color:rgb(var(--cat-success-text-hover, 0, 117, 78)) !important}.cat-link-success:active,.cat-text-success-hover:active{color:rgb(var(--cat-success-text-active, 0, 105, 70)) !important}.cat-bg-warning{background-color:rgb(var(--cat-warning-bg, 255, 206, 128)) !important;color:rgb(var(--cat-warning-fill, 0, 0, 0)) !important}.cat-bg-warning-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-warning-hover:hover{background-color:rgb(var(--cat-warning-bg-hover, 255, 214, 148)) !important;color:rgb(var(--cat-warning-fill-hover, 0, 0, 0)) !important}.cat-text-warning,.cat-link-warning{color:rgb(var(--cat-warning-text, 159, 97, 0)) !important}.cat-link-warning,.cat-text-warning-hover{transition:color 0.13s}.cat-link-warning:hover,.cat-text-warning-hover:hover{color:rgb(var(--cat-warning-text-hover, 159, 97, 0)) !important}.cat-link-warning:active,.cat-text-warning-hover:active{color:rgb(var(--cat-warning-text-active, 159, 97, 0)) !important}.cat-bg-danger{background-color:rgb(var(--cat-danger-bg, 217, 52, 13)) !important;color:rgb(var(--cat-danger-fill, 255, 255, 255)) !important}.cat-bg-danger-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-danger-hover:hover{background-color:rgb(var(--cat-danger-bg-hover, 194, 46, 11)) !important;color:rgb(var(--cat-danger-fill-hover, 255, 255, 255)) !important}.cat-text-danger,.cat-link-danger{color:rgb(var(--cat-danger-text, 217, 52, 13)) !important}.cat-link-danger,.cat-text-danger-hover{transition:color 0.13s}.cat-link-danger:hover,.cat-text-danger-hover:hover{color:rgb(var(--cat-danger-text-hover, 194, 46, 11)) !important}.cat-link-danger:active,.cat-text-danger-hover:active{color:rgb(var(--cat-danger-text-active, 174, 42, 10)) !important}.cat-active{color:rgb(var(--cat-primary-text, 0, 129, 148)) !important}.cat-muted{color:rgb(var(--cat-font-color-muted, 81, 92, 108)) !important}.cat-text-reset{color:inherit !important}.cat-link-reset{color:inherit !important;text-decoration:inherit !important}:host{display:flex;flex-direction:column;gap:0.5rem;line-height:1.25rem;position:relative;margin-bottom:1rem}:host([hidden]){display:none}label{align-self:flex-start}label.hidden{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.input-optional{margin-left:0.25rem;font-size:0.75rem;line-height:1rem;font-weight:var(--cat-font-weight-body, 400);color:rgb(var(--cat-font-color-muted, 81, 92, 108))}.select-wrapper{display:flex;align-items:flex-start;background:white;border-radius:var(--cat-border-radius-m, 0.25rem);box-shadow:0 0 0 1px rgb(var(--cat-border-color-dark, 215, 219, 224));transition:box-shadow 0.13s linear;padding:0.25rem;}.select-wrapper:not(.select-disabled):hover{box-shadow:0 0 0 2px rgb(var(--cat-border-color-dark, 215, 219, 224))}.select-wrapper:not(.select-disabled):hover.select-invalid{box-shadow:0 0 0 2px rgba(var(--cat-danger-bg, 217, 52, 13), 0.2)}.select-wrapper:not(.select-disabled):focus-within{outline:2px solid rgb(var(--cat-border-color-focus, 0, 113, 255))}.select-wrapper:not(.select-disabled):focus-within.select-invalid{outline:2px solid rgba(var(--cat-danger-bg, 217, 52, 13), 0.2)}.select-wrapper.select-invalid{box-shadow:0 0 0 1px rgba(var(--cat-danger-bg, 217, 52, 13), 0.2)}.select-wrapper:has(input:-webkit-autofill),.select-wrapper:has(input:-webkit-autofill):hover,.select-wrapper:has(input:-webkit-autofill):focus{background-color:#e8f0fe}:host(.cat-error) .select-wrapper{box-shadow:0 0 0 1px rgb(var(--cat-danger-bg, 217, 52, 13))}:host(.cat-error) .select-wrapper:not(.input-disabled):hover{box-shadow:0 0 0 2px rgb(var(--cat-danger-bg, 217, 52, 13))}.select-disabled{background:#f2f4f7;cursor:not-allowed;color:rgb(var(--cat-font-color-muted, 81, 92, 108));pointer-events:none}.select-wrapper-inner{display:flex;flex:1 1 auto;flex-wrap:wrap;align-items:center;gap:0.25rem;min-width:0}.select-wrapper-inner>cat-avatar{display:inline-block;padding-left:0.5rem}.select-wrapper-inner>cat-avatar+.select-input{padding-left:0.25rem}.select-wrapper-inner cat-avatar{--cat-avatar-size:1.25rem;--cat-avatar-font-size:0.5rem}.select-input{font:inherit;background:none;border:none;outline:none;padding:0.375rem 0.5rem;flex:1 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.select-disabled .select-input{cursor:inherit}.select-pills{display:contents}.pill{display:inline-flex;align-items:center;gap:0.5rem;padding:0.25rem 0.5rem;background:#f2f4f7;border-radius:var(--cat-border-radius-s, 0.125rem);white-space:nowrap;min-width:0}.pill>span{overflow:hidden;text-overflow:ellipsis;flex:1 1 0%}.pill>cat-button{margin-right:-0.25rem;margin-left:-0.25rem}.select-btn{transition:transform 0.13s linear}.select-btn::part(button){outline:none}cat-spinner{padding:0.375rem}.icon-suffix{padding:0.25rem}.select-btn-open{transform:rotate(180deg)}.select-dropdown{position:absolute;right:0;background:white;display:none;overflow:auto;box-shadow:0 4px 6px -2px rgba(27, 31, 38, 0.03), 0 12px 16px -4px rgba(27, 31, 38, 0.08);border-radius:var(--cat-border-radius-m, 0.25rem);z-index:100}.select-options-wrapper{max-height:16rem;width:100%}.select-empty{margin:1rem 0;padding:0 1.25rem}.select-options{list-style-type:none;margin:0;padding:0.5rem 0}.select-options cat-checkbox,.select-options .select-option-single{margin:0;padding:0.5rem 1rem}.select-option-inner{display:flex;gap:0.5rem}.select-option-inner cat-avatar{--cat-avatar-size:1.25rem;--cat-avatar-font-size:0.5rem}.select-option-text{flex:1 1 0%;min-width:0}.select-option-single{cursor:pointer}.select-input-transparent-caret{caret-color:transparent}.select-option-empty,.select-option-loading{padding:0.5rem 1rem}.select-option:hover{background-color:rgba(var(--cat-secondary-bg, 105, 118, 135), 0.05)}.select-option-active{outline:2px solid rgb(var(--cat-border-color-focus, 0, 113, 255));outline-offset:-2px}.select-option-label{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-wrap:break-word;word-break:break-word}.select-option-description{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:rgb(var(--cat-font-color-muted, 81, 92, 108))}";
5633
+ const catSelectCss = ".hint-section{display:flex;gap:0.5rem;flex-direction:column;color:rgb(var(--cat-hint-color, inherit))}.hint-section .input-hint,.hint-section ::slotted([slot=hint]){font-size:0.875rem;line-height:1rem;font-weight:var(--cat-font-weight-body, 400);margin:0 !important}.cat-bg-primary{background-color:rgb(var(--cat-primary-bg, 0, 129, 148)) !important;color:rgb(var(--cat-primary-fill, 255, 255, 255)) !important}.cat-bg-primary-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-primary-hover:hover{background-color:rgb(var(--cat-primary-bg-hover, 1, 115, 132)) !important;color:rgb(var(--cat-primary-fill-hover, 255, 255, 255)) !important}.cat-text-primary,.cat-link-primary{color:rgb(var(--cat-primary-text, 0, 129, 148)) !important}.cat-link-primary,.cat-text-primary-hover{transition:color 0.13s}.cat-link-primary:hover,.cat-text-primary-hover:hover{color:rgb(var(--cat-primary-text-hover, 1, 115, 132)) !important}.cat-link-primary:active,.cat-text-primary-hover:active{color:rgb(var(--cat-primary-text-active, 2, 99, 113)) !important}.cat-bg-primaryInverted{background-color:#93b4f2 !important;color:black !important}.cat-bg-primaryInverted-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-primaryInverted-hover:hover{background-color:#93b4f2 !important;color:black !important}.cat-text-primaryInverted,.cat-link-primaryInverted{color:#93b4f2 !important}.cat-link-primaryInverted,.cat-text-primaryInverted-hover{transition:color 0.13s}.cat-link-primaryInverted:hover,.cat-text-primaryInverted-hover:hover{color:#93b4f2 !important}.cat-link-primaryInverted:active,.cat-text-primaryInverted-hover:active{color:#93b4f2 !important}.cat-bg-secondary{background-color:rgb(var(--cat-secondary-bg, 105, 118, 135)) !important;color:rgb(var(--cat-secondary-fill, 255, 255, 255)) !important}.cat-bg-secondary-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-secondary-hover:hover{background-color:rgb(var(--cat-secondary-bg-hover, 105, 118, 135)) !important;color:rgb(var(--cat-secondary-fill-hover, 255, 255, 255)) !important}.cat-text-secondary,.cat-link-secondary{color:rgb(var(--cat-secondary-text, 0, 0, 0)) !important}.cat-link-secondary,.cat-text-secondary-hover{transition:color 0.13s}.cat-link-secondary:hover,.cat-text-secondary-hover:hover{color:rgb(var(--cat-secondary-text-hover, 0, 0, 0)) !important}.cat-link-secondary:active,.cat-text-secondary-hover:active{color:rgb(var(--cat-secondary-text-active, 0, 0, 0)) !important}.cat-bg-secondaryInverted{background-color:#697687 !important;color:black !important}.cat-bg-secondaryInverted-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-secondaryInverted-hover:hover{background-color:#697687 !important;color:black !important}.cat-text-secondaryInverted,.cat-link-secondaryInverted{color:white !important}.cat-link-secondaryInverted,.cat-text-secondaryInverted-hover{transition:color 0.13s}.cat-link-secondaryInverted:hover,.cat-text-secondaryInverted-hover:hover{color:white !important}.cat-link-secondaryInverted:active,.cat-text-secondaryInverted-hover:active{color:white !important}.cat-bg-success{background-color:rgb(var(--cat-success-bg-, 0, 132, 88)) !important;color:rgb(var(--cat-success-fill, 255, 255, 255)) !important}.cat-bg-success-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-success-hover:hover{background-color:rgb(var(--cat-success-bg-hover, 0, 117, 78)) !important;color:rgb(var(--cat-success-fill-hover, 255, 255, 255)) !important}.cat-text-success,.cat-link-success{color:rgb(var(--cat-success-text, 0, 132, 88)) !important}.cat-link-success,.cat-text-success-hover{transition:color 0.13s}.cat-link-success:hover,.cat-text-success-hover:hover{color:rgb(var(--cat-success-text-hover, 0, 117, 78)) !important}.cat-link-success:active,.cat-text-success-hover:active{color:rgb(var(--cat-success-text-active, 0, 105, 70)) !important}.cat-bg-warning{background-color:rgb(var(--cat-warning-bg, 255, 206, 128)) !important;color:rgb(var(--cat-warning-fill, 0, 0, 0)) !important}.cat-bg-warning-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-warning-hover:hover{background-color:rgb(var(--cat-warning-bg-hover, 255, 214, 148)) !important;color:rgb(var(--cat-warning-fill-hover, 0, 0, 0)) !important}.cat-text-warning,.cat-link-warning{color:rgb(var(--cat-warning-text, 159, 97, 0)) !important}.cat-link-warning,.cat-text-warning-hover{transition:color 0.13s}.cat-link-warning:hover,.cat-text-warning-hover:hover{color:rgb(var(--cat-warning-text-hover, 159, 97, 0)) !important}.cat-link-warning:active,.cat-text-warning-hover:active{color:rgb(var(--cat-warning-text-active, 159, 97, 0)) !important}.cat-bg-danger{background-color:rgb(var(--cat-danger-bg, 217, 52, 13)) !important;color:rgb(var(--cat-danger-fill, 255, 255, 255)) !important}.cat-bg-danger-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-danger-hover:hover{background-color:rgb(var(--cat-danger-bg-hover, 194, 46, 11)) !important;color:rgb(var(--cat-danger-fill-hover, 255, 255, 255)) !important}.cat-text-danger,.cat-link-danger{color:rgb(var(--cat-danger-text, 217, 52, 13)) !important}.cat-link-danger,.cat-text-danger-hover{transition:color 0.13s}.cat-link-danger:hover,.cat-text-danger-hover:hover{color:rgb(var(--cat-danger-text-hover, 194, 46, 11)) !important}.cat-link-danger:active,.cat-text-danger-hover:active{color:rgb(var(--cat-danger-text-active, 174, 42, 10)) !important}.cat-active{color:rgb(var(--cat-primary-text, 0, 129, 148)) !important}.cat-muted{color:rgb(var(--cat-font-color-muted, 81, 92, 108)) !important}.cat-text-reset{color:inherit !important}.cat-link-reset{color:inherit !important;text-decoration:inherit !important}.label{overflow:hidden;word-wrap:break-word;word-break:break-word}.label-container{flex-basis:var(--label-size, 33.33%)}.label-container.hidden{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.label-container .label-wrapper{display:flex;gap:0.25rem}.label-metadata{display:flex;flex-shrink:0;flex-grow:1;justify-content:space-between;gap:0.25rem}.label-optional{display:flex;align-items:center;max-height:1.25rem;font-size:0.75rem;line-height:1rem;font-weight:var(--cat-font-weight-body, 400);color:rgb(var(--cat-font-color-muted, 81, 92, 108))}.label-character-count{display:flex;align-items:center;margin-left:auto;max-height:1.25rem;font-size:0.75rem;line-height:1rem;font-weight:var(--cat-font-weight-body, 400);color:rgb(var(--cat-font-color-muted, 81, 92, 108))}.input-horizontal .label-wrapper,.textarea-horizontal .label-wrapper,.select-horizontal .label-wrapper{flex-direction:column}.input-horizontal label,.textarea-horizontal label,.select-horizontal label{min-height:2.5rem;display:inline-flex;align-items:center}.input-horizontal .label-metadata,.textarea-horizontal .label-metadata,.select-horizontal .label-metadata{justify-content:flex-start}.input-horizontal .label-metadata .label-character-count,.textarea-horizontal .label-metadata .label-character-count,.select-horizontal .label-metadata .label-character-count{margin-left:0}:host{display:flex;flex-direction:column;gap:0.5rem;line-height:1.25rem;position:relative;margin-bottom:1rem}:host([hidden]){display:none}label{align-self:flex-start}label.hidden{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.select-field,.select-container{display:flex;flex-direction:column;gap:0.5rem;flex:1 1 auto}.select-field.select-horizontal{flex-direction:row;gap:1rem}.input-optional{margin-left:0.25rem;font-size:0.75rem;line-height:1rem;font-weight:var(--cat-font-weight-body, 400);color:rgb(var(--cat-font-color-muted, 81, 92, 108))}.select-wrapper{display:flex;align-items:flex-start;background:white;border-radius:var(--cat-border-radius-m, 0.25rem);box-shadow:0 0 0 1px rgb(var(--cat-border-color-dark, 215, 219, 224));transition:box-shadow 0.13s linear;padding:0.25rem;}.select-wrapper:not(.select-disabled):hover{box-shadow:0 0 0 2px rgb(var(--cat-border-color-dark, 215, 219, 224))}.select-wrapper:not(.select-disabled):hover.select-invalid{box-shadow:0 0 0 2px rgba(var(--cat-danger-bg, 217, 52, 13), 0.2)}.select-wrapper:not(.select-disabled):focus-within{outline:2px solid rgb(var(--cat-border-color-focus, 0, 113, 255))}.select-wrapper:not(.select-disabled):focus-within.select-invalid{outline:2px solid rgba(var(--cat-danger-bg, 217, 52, 13), 0.2)}.select-wrapper.select-invalid{box-shadow:0 0 0 1px rgba(var(--cat-danger-bg, 217, 52, 13), 0.2)}.select-wrapper:has(input:-webkit-autofill),.select-wrapper:has(input:-webkit-autofill):hover,.select-wrapper:has(input:-webkit-autofill):focus{background-color:#e8f0fe}:host(.cat-error) .select-wrapper{box-shadow:0 0 0 1px rgb(var(--cat-danger-bg, 217, 52, 13))}:host(.cat-error) .select-wrapper:not(.input-disabled):hover{box-shadow:0 0 0 2px rgb(var(--cat-danger-bg, 217, 52, 13))}.select-disabled{background:#f2f4f7;cursor:not-allowed;color:rgb(var(--cat-font-color-muted, 81, 92, 108));pointer-events:none}.select-wrapper-inner{display:flex;flex:1 1 auto;flex-wrap:wrap;align-items:center;gap:0.25rem;min-width:0}.select-wrapper-inner>cat-avatar{display:inline-block;padding-left:0.5rem}.select-wrapper-inner>cat-avatar+.select-input{padding-left:0.25rem}.select-wrapper-inner cat-avatar{--cat-avatar-size:1.25rem;--cat-avatar-font-size:0.5rem}.select-input{font:inherit;background:none;border:none;outline:none;padding:0.375rem 0.5rem;flex:1 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.select-disabled .select-input{cursor:inherit}.select-pills{display:contents}.pill{display:inline-flex;align-items:center;gap:0.5rem;padding:0.25rem 0.5rem;background:#f2f4f7;border-radius:var(--cat-border-radius-s, 0.125rem);white-space:nowrap;min-width:0}.pill>span{overflow:hidden;text-overflow:ellipsis;flex:1 1 0%}.pill>cat-button{margin-right:-0.25rem;margin-left:-0.25rem}.select-btn{transition:transform 0.13s linear}.select-btn::part(button){outline:none}cat-spinner{padding:0.375rem}.icon-suffix{padding:0.25rem}.select-btn-open{transform:rotate(180deg)}.select-dropdown{position:absolute;right:0;background:white;display:none;overflow:auto;box-shadow:0 4px 6px -2px rgba(27, 31, 38, 0.03), 0 12px 16px -4px rgba(27, 31, 38, 0.08);border-radius:var(--cat-border-radius-m, 0.25rem);z-index:100}.select-options-wrapper{max-height:16rem;width:100%}.select-empty{margin:1rem 0;padding:0 1.25rem}.select-options{list-style-type:none;margin:0;padding:0.5rem 0}.select-options cat-checkbox,.select-options .select-option-single{margin:0;padding:0.5rem 1rem}.select-option-inner{display:flex;gap:0.5rem}.select-option-inner cat-avatar{--cat-avatar-size:1.25rem;--cat-avatar-font-size:0.5rem}.select-option-text{flex:1 1 0%;min-width:0}.select-option-single{cursor:pointer}.select-input-transparent-caret{caret-color:transparent}.select-option-empty,.select-option-loading{padding:0.5rem 1rem}.select-option:hover{background-color:rgba(var(--cat-secondary-bg, 105, 118, 135), 0.05)}.select-option-active{outline:2px solid rgb(var(--cat-border-color-focus, 0, 113, 255));outline-offset:-2px}.select-option-label{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-wrap:break-word;word-break:break-word}.select-option-description{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:rgb(var(--cat-font-color-muted, 81, 92, 108))}";
5505
5634
 
5506
5635
  const INIT_STATE = {
5507
5636
  term: '',
@@ -5531,6 +5660,7 @@ const CatSelect = class {
5531
5660
  this.hasSlottedHint = false;
5532
5661
  this.errorMap = undefined;
5533
5662
  this.requiredMarker = 'optional';
5663
+ this.horizontal = false;
5534
5664
  this.multiple = false;
5535
5665
  this.debounce = 250;
5536
5666
  this.placement = 'bottom-start';
@@ -5767,7 +5897,13 @@ const CatSelect = class {
5767
5897
  }
5768
5898
  render() {
5769
5899
  var _a, _b;
5770
- return (h(Host, null, (this.hasSlottedLabel || this.label) && (h("label", { htmlFor: this.id, class: { hidden: this.labelHidden } }, h("span", { part: "label" }, (this.hasSlottedLabel && h("slot", { name: "label" })) || this.label, !this.required && this.requiredMarker.startsWith('optional') && (h("span", { class: "input-optional", "aria-hidden": "true" }, "(", catI18nRegistry.t('input.optional'), ")")), this.required && this.requiredMarker.startsWith('required') && (h("span", { class: "input-optional", "aria-hidden": "true" }, "(", catI18nRegistry.t('input.required'), ")"))))), h("div", { class: { 'select-wrapper': true, 'select-disabled': this.disabled, 'select-invalid': this.invalid }, ref: el => (this.trigger = el), id: this.id, role: "combobox", "aria-expanded": this.state.isOpen || this.isPillboxActive(), "aria-controls": this.isPillboxActive() ? `select-pillbox-${this.id}` : `select-listbox-${this.id}`, "aria-required": this.required ? 'true' : false, "aria-activedescendant": this.activeDescendant, onClick: e => this.onClick(e) }, h("div", { class: "select-wrapper-inner" }, this.multiple && this.state.selection.length ? (h("div", { id: `select-pillbox-${this.id}`, role: "listbox", "aria-orientation": "horizontal", class: "select-pills" }, this.state.selection.map((item, i) => {
5900
+ return (h(Host, null, h("div", { class: {
5901
+ 'select-field': true,
5902
+ 'select-horizontal': this.horizontal
5903
+ } }, h("div", { class: {
5904
+ hidden: this.labelHidden,
5905
+ 'label-container': true
5906
+ } }, (this.hasSlottedLabel || this.label) && (h("label", { htmlFor: this.id }, h("span", { class: "label-wrapper", part: "label" }, (this.hasSlottedLabel && h("slot", { name: "label" })) || this.label, h("div", { class: "label-metadata" }, !this.required && this.requiredMarker.startsWith('optional') && (h("span", { class: "label-optional", "aria-hidden": "true" }, "(", catI18nRegistry.t('input.optional'), ")")), this.required && this.requiredMarker.startsWith('required') && (h("span", { class: "label-optional", "aria-hidden": "true" }, "(", catI18nRegistry.t('input.required'), ")"))))))), h("div", { class: "select-container" }, h("div", { class: { 'select-wrapper': true, 'select-disabled': this.disabled, 'select-invalid': this.invalid }, ref: el => (this.trigger = el), id: this.id, role: "combobox", "aria-expanded": this.state.isOpen || this.isPillboxActive(), "aria-controls": this.isPillboxActive() ? `select-pillbox-${this.id}` : `select-listbox-${this.id}`, "aria-required": this.required ? 'true' : false, "aria-activedescendant": this.activeDescendant, onClick: e => this.onClick(e) }, h("div", { class: "select-wrapper-inner" }, this.multiple && this.state.selection.length ? (h("div", { id: `select-pillbox-${this.id}`, role: "listbox", "aria-orientation": "horizontal", class: "select-pills" }, this.state.selection.map((item, i) => {
5771
5907
  var _a;
5772
5908
  return (h("span", { class: {
5773
5909
  pill: true,
@@ -5777,7 +5913,7 @@ const CatSelect = class {
5777
5913
  }))) : this.state.selection.length && this.state.selection[0].render.avatar ? (h("cat-avatar", { label: this.state.selection[0].render.label, round: this.state.selection[0].render.avatar.round, src: this.state.selection[0].render.avatar.src, initials: (_a = this.state.selection[0].render.avatar.initials) !== null && _a !== void 0 ? _a : '' })) : null, h("input", Object.assign({}, this.nativeAttributes, { class: "select-input", ref: el => (this.input = el), "aria-controls": this.isPillboxActive() ? `select-pillbox-${this.id}` : `select-listbox-${this.id}`, "aria-activedescendant": this.activeDescendant, "aria-invalid": this.invalid ? 'true' : undefined, "aria-describedby": ((_b = this.hint) === null || _b === void 0 ? void 0 : _b.length) ? this.id + '-hint' : undefined, onInput: this.onInput.bind(this), value: !this.multiple ? this.state.term : undefined, placeholder: this.placeholder, disabled: this.disabled || this.state.isResolving }))), this.state.isResolving && h("cat-spinner", null), this.invalid && (h("cat-icon", { icon: "alert-circle-outlined", class: "icon-suffix cat-text-danger", size: "l" })), (this.state.selection.length || this.state.term.length) &&
5778
5914
  !this.disabled &&
5779
5915
  !this.state.isResolving &&
5780
- this.clearable ? (h("cat-button", { id: `select-clear-btn-${this.id}`, iconOnly: true, icon: "cross-circle-outlined", variant: "text", size: "s", a11yLabel: catI18nRegistry.t('input.clear'), onClick: () => this.clear() })) : null, !this.state.isResolving && (h("cat-button", { iconOnly: true, icon: "chevron-down-outlined", class: { 'select-btn': true, 'select-btn-open': this.state.isOpen }, variant: "text", size: "s", a11yLabel: this.state.isOpen ? catI18nRegistry.t('select.close') : catI18nRegistry.t('select.open'), "aria-controls": `select-listbox-${this.id}`, "aria-expanded": this.state.isOpen, tabIndex: -1, disabled: this.disabled || this.state.isResolving }))), (this.hint || this.hasSlottedHint || !!Object.keys(this.errorMap || {}).length) && (h(CatFormHint, { id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && h("slot", { name: "hint" }), errorMap: this.errorMap })), h("div", { class: "select-dropdown", ref: el => (this.dropdown = el), style: { display: this.state.isOpen ? 'block' : undefined } }, this.state.isOpen && (h("cat-scrollable", { class: "select-options-wrapper", scrolledBuffer: 56, noOverflowX: true, noOverscroll: true, noScrolledInit: true, onScrolledBottom: () => this.more$.next() }, h("ul", { class: "select-options", role: "listbox", "aria-multiselectable": this.multiple, "aria-setsize": this.state.totalElements, id: `select-listbox-${this.id}` }, this.optionsList, this.state.isLoading
5916
+ this.clearable ? (h("cat-button", { id: `select-clear-btn-${this.id}`, iconOnly: true, icon: "cross-circle-outlined", variant: "text", size: "s", a11yLabel: catI18nRegistry.t('input.clear'), onClick: () => this.clear() })) : null, !this.state.isResolving && (h("cat-button", { iconOnly: true, icon: "chevron-down-outlined", class: { 'select-btn': true, 'select-btn-open': this.state.isOpen }, variant: "text", size: "s", a11yLabel: this.state.isOpen ? catI18nRegistry.t('select.close') : catI18nRegistry.t('select.open'), "aria-controls": `select-listbox-${this.id}`, "aria-expanded": this.state.isOpen, tabIndex: -1, disabled: this.disabled || this.state.isResolving }))), (this.hint || this.hasSlottedHint || !!Object.keys(this.errorMap || {}).length) && (h(CatFormHint, { id: this.id, hint: this.hint, slottedHint: this.hasSlottedHint && h("slot", { name: "hint" }), errorMap: this.errorMap })))), h("div", { class: "select-dropdown", ref: el => (this.dropdown = el), style: { display: this.state.isOpen ? 'block' : undefined } }, this.state.isOpen && (h("cat-scrollable", { class: "select-options-wrapper", scrolledBuffer: 56, noOverflowX: true, noOverscroll: true, noScrolledInit: true, onScrolledBottom: () => this.more$.next() }, h("ul", { class: "select-options", role: "listbox", "aria-multiselectable": this.multiple, "aria-setsize": this.state.totalElements, id: `select-listbox-${this.id}` }, this.optionsList, this.state.isLoading
5781
5917
  ? Array.from(Array(CatSelect.SKELETON_COUNT)).map(() => (h("li", { class: "select-option-loading" }, h("cat-skeleton", { variant: "body", lines: 1 }), h("cat-skeleton", { variant: "body", lines: 1 }))))
5782
5918
  : !this.state.options.length &&
5783
5919
  !this.tags && (h("li", { class: "select-option-empty" }, this.noItems ? this.noItems : catI18nRegistry.t('select.empty')))))))));
@@ -7672,7 +7808,7 @@ CatTabs.style = catTabsCss;
7672
7808
 
7673
7809
  var e=new Map;function t(t){var r=e.get(t);r&&r.destroy();}function r(t){var r=e.get(t);r&&r.update();}var o=null;"undefined"==typeof window?((o=function(e){return e}).destroy=function(e){return e},o.update=function(e){return e}):((o=function(t,r){return t&&Array.prototype.forEach.call(t.length?t:[t],function(t){return function(t){if(t&&t.nodeName&&"TEXTAREA"===t.nodeName&&!e.has(t)){var r=null,o=window.getComputedStyle(t),n=function(r){window.removeEventListener("resize",l,!1),t.removeEventListener("input",l,!1),t.removeEventListener("keyup",l,!1),t.removeEventListener("autosize:destroy",n,!1),t.removeEventListener("autosize:update",l,!1),Object.keys(r).forEach(function(e){return t.style[e]=r[e]}),e.delete(t);}.bind(t,{height:t.style.height,resize:t.style.resize,textAlign:t.style.textAlign,overflowY:t.style.overflowY,overflowX:t.style.overflowX,wordWrap:t.style.wordWrap});t.addEventListener("autosize:destroy",n,!1),window.addEventListener("resize",l,!1),t.addEventListener("input",l,!1),t.addEventListener("autosize:update",l,!1),t.style.overflowX="hidden",t.style.wordWrap="break-word",e.set(t,{destroy:n,update:l}),l();}function l(e){void 0===e&&(e=null);var n=o.overflowY;if(0!==t.scrollHeight){var i,a=function(e){for(var t=[];e&&e.parentNode&&e.parentNode instanceof Element;)e.parentNode.scrollTop&&t.push([e.parentNode,e.parentNode.scrollTop]),e=e.parentNode;return function(){return t.forEach(function(e){var t=e[0],r=e[1];t.style.scrollBehavior="auto",t.scrollTop=r,t.style.scrollBehavior=null;})}}(t);if(t.style.height="","vertical"===o.resize?t.style.resize="none":"both"===o.resize&&(t.style.resize="horizontal"),i="content-box"===o.boxSizing?t.scrollHeight-(parseFloat(o.paddingTop)+parseFloat(o.paddingBottom)):t.scrollHeight+parseFloat(o.borderTopWidth)+parseFloat(o.borderBottomWidth),"none"!==o.maxHeight&&i>parseFloat(o.maxHeight)?("hidden"===o.overflowY&&(t.style.overflow="scroll"),i=parseFloat(o.maxHeight)):"hidden"!==o.overflowY&&(t.style.overflow="hidden"),t.style.height=i+"px",e&&(t.style.textAlign=e),a(),r!==i&&(t.dispatchEvent(new Event("autosize:resized",{bubbles:!0})),r=i),n!==o.overflow&&!e){var s=o.textAlign;"hidden"===o.overflow&&(t.style.textAlign="start"===s?"end":"start"),l(s);}}}}(t)}),t}).destroy=function(e){return e&&Array.prototype.forEach.call(e.length?e:[e],t),e},o.update=function(e){return e&&Array.prototype.forEach.call(e.length?e:[e],r),e});var n=o;
7674
7810
 
7675
- const catTextareaCss = ".hint-section{display:flex;gap:0.5rem;flex-direction:column;color:rgb(var(--cat-hint-color, inherit))}.hint-section .input-hint,.hint-section ::slotted([slot=hint]){font-size:0.875rem;line-height:1rem;font-weight:var(--cat-font-weight-body, 400);margin:0 !important}.cat-bg-primary{background-color:rgb(var(--cat-primary-bg, 0, 129, 148)) !important;color:rgb(var(--cat-primary-fill, 255, 255, 255)) !important}.cat-bg-primary-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-primary-hover:hover{background-color:rgb(var(--cat-primary-bg-hover, 1, 115, 132)) !important;color:rgb(var(--cat-primary-fill-hover, 255, 255, 255)) !important}.cat-text-primary,.cat-link-primary{color:rgb(var(--cat-primary-text, 0, 129, 148)) !important}.cat-link-primary,.cat-text-primary-hover{transition:color 0.13s}.cat-link-primary:hover,.cat-text-primary-hover:hover{color:rgb(var(--cat-primary-text-hover, 1, 115, 132)) !important}.cat-link-primary:active,.cat-text-primary-hover:active{color:rgb(var(--cat-primary-text-active, 2, 99, 113)) !important}.cat-bg-primaryInverted{background-color:#93b4f2 !important;color:black !important}.cat-bg-primaryInverted-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-primaryInverted-hover:hover{background-color:#93b4f2 !important;color:black !important}.cat-text-primaryInverted,.cat-link-primaryInverted{color:#93b4f2 !important}.cat-link-primaryInverted,.cat-text-primaryInverted-hover{transition:color 0.13s}.cat-link-primaryInverted:hover,.cat-text-primaryInverted-hover:hover{color:#93b4f2 !important}.cat-link-primaryInverted:active,.cat-text-primaryInverted-hover:active{color:#93b4f2 !important}.cat-bg-secondary{background-color:rgb(var(--cat-secondary-bg, 105, 118, 135)) !important;color:rgb(var(--cat-secondary-fill, 255, 255, 255)) !important}.cat-bg-secondary-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-secondary-hover:hover{background-color:rgb(var(--cat-secondary-bg-hover, 105, 118, 135)) !important;color:rgb(var(--cat-secondary-fill-hover, 255, 255, 255)) !important}.cat-text-secondary,.cat-link-secondary{color:rgb(var(--cat-secondary-text, 0, 0, 0)) !important}.cat-link-secondary,.cat-text-secondary-hover{transition:color 0.13s}.cat-link-secondary:hover,.cat-text-secondary-hover:hover{color:rgb(var(--cat-secondary-text-hover, 0, 0, 0)) !important}.cat-link-secondary:active,.cat-text-secondary-hover:active{color:rgb(var(--cat-secondary-text-active, 0, 0, 0)) !important}.cat-bg-secondaryInverted{background-color:#697687 !important;color:black !important}.cat-bg-secondaryInverted-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-secondaryInverted-hover:hover{background-color:#697687 !important;color:black !important}.cat-text-secondaryInverted,.cat-link-secondaryInverted{color:white !important}.cat-link-secondaryInverted,.cat-text-secondaryInverted-hover{transition:color 0.13s}.cat-link-secondaryInverted:hover,.cat-text-secondaryInverted-hover:hover{color:white !important}.cat-link-secondaryInverted:active,.cat-text-secondaryInverted-hover:active{color:white !important}.cat-bg-success{background-color:rgb(var(--cat-success-bg-, 0, 132, 88)) !important;color:rgb(var(--cat-success-fill, 255, 255, 255)) !important}.cat-bg-success-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-success-hover:hover{background-color:rgb(var(--cat-success-bg-hover, 0, 117, 78)) !important;color:rgb(var(--cat-success-fill-hover, 255, 255, 255)) !important}.cat-text-success,.cat-link-success{color:rgb(var(--cat-success-text, 0, 132, 88)) !important}.cat-link-success,.cat-text-success-hover{transition:color 0.13s}.cat-link-success:hover,.cat-text-success-hover:hover{color:rgb(var(--cat-success-text-hover, 0, 117, 78)) !important}.cat-link-success:active,.cat-text-success-hover:active{color:rgb(var(--cat-success-text-active, 0, 105, 70)) !important}.cat-bg-warning{background-color:rgb(var(--cat-warning-bg, 255, 206, 128)) !important;color:rgb(var(--cat-warning-fill, 0, 0, 0)) !important}.cat-bg-warning-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-warning-hover:hover{background-color:rgb(var(--cat-warning-bg-hover, 255, 214, 148)) !important;color:rgb(var(--cat-warning-fill-hover, 0, 0, 0)) !important}.cat-text-warning,.cat-link-warning{color:rgb(var(--cat-warning-text, 159, 97, 0)) !important}.cat-link-warning,.cat-text-warning-hover{transition:color 0.13s}.cat-link-warning:hover,.cat-text-warning-hover:hover{color:rgb(var(--cat-warning-text-hover, 159, 97, 0)) !important}.cat-link-warning:active,.cat-text-warning-hover:active{color:rgb(var(--cat-warning-text-active, 159, 97, 0)) !important}.cat-bg-danger{background-color:rgb(var(--cat-danger-bg, 217, 52, 13)) !important;color:rgb(var(--cat-danger-fill, 255, 255, 255)) !important}.cat-bg-danger-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-danger-hover:hover{background-color:rgb(var(--cat-danger-bg-hover, 194, 46, 11)) !important;color:rgb(var(--cat-danger-fill-hover, 255, 255, 255)) !important}.cat-text-danger,.cat-link-danger{color:rgb(var(--cat-danger-text, 217, 52, 13)) !important}.cat-link-danger,.cat-text-danger-hover{transition:color 0.13s}.cat-link-danger:hover,.cat-text-danger-hover:hover{color:rgb(var(--cat-danger-text-hover, 194, 46, 11)) !important}.cat-link-danger:active,.cat-text-danger-hover:active{color:rgb(var(--cat-danger-text-active, 174, 42, 10)) !important}.cat-active{color:rgb(var(--cat-primary-text, 0, 129, 148)) !important}.cat-muted{color:rgb(var(--cat-font-color-muted, 81, 92, 108)) !important}.cat-text-reset{color:inherit !important}.cat-link-reset{color:inherit !important;text-decoration:inherit !important}.label{overflow:hidden;word-wrap:break-word;word-break:break-word}.label-container{flex-basis:var(--label-size, 33.33%)}.label-container.hidden{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.label-container .label-wrapper{display:flex;gap:0.25rem}.label-metadata{display:flex;flex-shrink:0;flex-grow:1;justify-content:space-between;gap:0.25rem}.label-optional{display:flex;align-items:center;max-height:1.25rem;font-size:0.75rem;line-height:1rem;font-weight:var(--cat-font-weight-body, 400);color:rgb(var(--cat-font-color-muted, 81, 92, 108))}.label-character-count{display:flex;align-items:center;margin-left:auto;max-height:1.25rem;font-size:0.75rem;line-height:1rem;font-weight:var(--cat-font-weight-body, 400);color:rgb(var(--cat-font-color-muted, 81, 92, 108))}.input-horizontal .label-wrapper,.textarea-horizontal .label-wrapper{flex-direction:column}.input-horizontal label,.textarea-horizontal label{min-height:2.5rem;display:inline-flex;align-items:center}.input-horizontal .label-metadata,.textarea-horizontal .label-metadata{justify-content:flex-start}.input-horizontal .label-metadata .label-character-count,.textarea-horizontal .label-metadata .label-character-count{margin-left:0}:host{display:flex;flex-direction:column;gap:0.5rem;font-size:0.9375rem;line-height:1.25rem;font-weight:var(--cat-font-weight-body, 400);margin-bottom:1rem}:host([hidden]){display:none}.textarea-field,.textarea-container{display:flex;flex-direction:column;gap:0.5rem;flex:1 1 auto}.textarea-field.textarea-horizontal{flex-direction:row;gap:1rem}.textarea-wrapper{position:relative;display:flex;flex-direction:column}.icon-suffix{position:absolute;top:calc(0.625rem - 2px);right:0.75rem;background:rgba(255, 255, 255, 0.75);border-radius:100rem}.textarea-disabled .icon-suffix{background:rgba(242, 244, 247, 0.75)}textarea{margin:0;padding:0.625rem 0.75rem;min-height:2.5rem;font:inherit;background:white;border-radius:var(--cat-border-radius-m, 0.25rem);border:none;box-shadow:0 0 0 1px rgb(var(--cat-border-color-dark, 215, 219, 224));transition:box-shadow 0.13s linear;resize:vertical;}textarea:disabled{background:#f2f4f7;cursor:not-allowed;color:rgb(var(--cat-font-color-muted, 81, 92, 108));resize:none}.textarea-invalid textarea{box-shadow:0 0 0 1px rgba(var(--cat-danger-bg, 217, 52, 13), 0.2)}textarea:hover:not(:disabled){box-shadow:0 0 0 2px rgb(var(--cat-border-color-dark, 215, 219, 224))}.textarea-invalid textarea:hover:not(:disabled){box-shadow:0 0 0 2px rgba(var(--cat-danger-bg, 217, 52, 13), 0.2)}textarea:focus{outline:2px solid rgb(var(--cat-border-color-focus, 0, 113, 255))}.textarea-invalid textarea:focus{outline:2px solid rgba(var(--cat-danger-bg, 217, 52, 13), 0.2)}textarea::placeholder{color:rgb(var(--cat-font-color-muted, 81, 92, 108))}textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 9999px #e8f0fe inset}";
7811
+ const catTextareaCss = ".hint-section{display:flex;gap:0.5rem;flex-direction:column;color:rgb(var(--cat-hint-color, inherit))}.hint-section .input-hint,.hint-section ::slotted([slot=hint]){font-size:0.875rem;line-height:1rem;font-weight:var(--cat-font-weight-body, 400);margin:0 !important}.cat-bg-primary{background-color:rgb(var(--cat-primary-bg, 0, 129, 148)) !important;color:rgb(var(--cat-primary-fill, 255, 255, 255)) !important}.cat-bg-primary-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-primary-hover:hover{background-color:rgb(var(--cat-primary-bg-hover, 1, 115, 132)) !important;color:rgb(var(--cat-primary-fill-hover, 255, 255, 255)) !important}.cat-text-primary,.cat-link-primary{color:rgb(var(--cat-primary-text, 0, 129, 148)) !important}.cat-link-primary,.cat-text-primary-hover{transition:color 0.13s}.cat-link-primary:hover,.cat-text-primary-hover:hover{color:rgb(var(--cat-primary-text-hover, 1, 115, 132)) !important}.cat-link-primary:active,.cat-text-primary-hover:active{color:rgb(var(--cat-primary-text-active, 2, 99, 113)) !important}.cat-bg-primaryInverted{background-color:#93b4f2 !important;color:black !important}.cat-bg-primaryInverted-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-primaryInverted-hover:hover{background-color:#93b4f2 !important;color:black !important}.cat-text-primaryInverted,.cat-link-primaryInverted{color:#93b4f2 !important}.cat-link-primaryInverted,.cat-text-primaryInverted-hover{transition:color 0.13s}.cat-link-primaryInverted:hover,.cat-text-primaryInverted-hover:hover{color:#93b4f2 !important}.cat-link-primaryInverted:active,.cat-text-primaryInverted-hover:active{color:#93b4f2 !important}.cat-bg-secondary{background-color:rgb(var(--cat-secondary-bg, 105, 118, 135)) !important;color:rgb(var(--cat-secondary-fill, 255, 255, 255)) !important}.cat-bg-secondary-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-secondary-hover:hover{background-color:rgb(var(--cat-secondary-bg-hover, 105, 118, 135)) !important;color:rgb(var(--cat-secondary-fill-hover, 255, 255, 255)) !important}.cat-text-secondary,.cat-link-secondary{color:rgb(var(--cat-secondary-text, 0, 0, 0)) !important}.cat-link-secondary,.cat-text-secondary-hover{transition:color 0.13s}.cat-link-secondary:hover,.cat-text-secondary-hover:hover{color:rgb(var(--cat-secondary-text-hover, 0, 0, 0)) !important}.cat-link-secondary:active,.cat-text-secondary-hover:active{color:rgb(var(--cat-secondary-text-active, 0, 0, 0)) !important}.cat-bg-secondaryInverted{background-color:#697687 !important;color:black !important}.cat-bg-secondaryInverted-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-secondaryInverted-hover:hover{background-color:#697687 !important;color:black !important}.cat-text-secondaryInverted,.cat-link-secondaryInverted{color:white !important}.cat-link-secondaryInverted,.cat-text-secondaryInverted-hover{transition:color 0.13s}.cat-link-secondaryInverted:hover,.cat-text-secondaryInverted-hover:hover{color:white !important}.cat-link-secondaryInverted:active,.cat-text-secondaryInverted-hover:active{color:white !important}.cat-bg-success{background-color:rgb(var(--cat-success-bg-, 0, 132, 88)) !important;color:rgb(var(--cat-success-fill, 255, 255, 255)) !important}.cat-bg-success-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-success-hover:hover{background-color:rgb(var(--cat-success-bg-hover, 0, 117, 78)) !important;color:rgb(var(--cat-success-fill-hover, 255, 255, 255)) !important}.cat-text-success,.cat-link-success{color:rgb(var(--cat-success-text, 0, 132, 88)) !important}.cat-link-success,.cat-text-success-hover{transition:color 0.13s}.cat-link-success:hover,.cat-text-success-hover:hover{color:rgb(var(--cat-success-text-hover, 0, 117, 78)) !important}.cat-link-success:active,.cat-text-success-hover:active{color:rgb(var(--cat-success-text-active, 0, 105, 70)) !important}.cat-bg-warning{background-color:rgb(var(--cat-warning-bg, 255, 206, 128)) !important;color:rgb(var(--cat-warning-fill, 0, 0, 0)) !important}.cat-bg-warning-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-warning-hover:hover{background-color:rgb(var(--cat-warning-bg-hover, 255, 214, 148)) !important;color:rgb(var(--cat-warning-fill-hover, 0, 0, 0)) !important}.cat-text-warning,.cat-link-warning{color:rgb(var(--cat-warning-text, 159, 97, 0)) !important}.cat-link-warning,.cat-text-warning-hover{transition:color 0.13s}.cat-link-warning:hover,.cat-text-warning-hover:hover{color:rgb(var(--cat-warning-text-hover, 159, 97, 0)) !important}.cat-link-warning:active,.cat-text-warning-hover:active{color:rgb(var(--cat-warning-text-active, 159, 97, 0)) !important}.cat-bg-danger{background-color:rgb(var(--cat-danger-bg, 217, 52, 13)) !important;color:rgb(var(--cat-danger-fill, 255, 255, 255)) !important}.cat-bg-danger-hover{transition:background-color 0.13s, color 0.13s}.cat-bg-danger-hover:hover{background-color:rgb(var(--cat-danger-bg-hover, 194, 46, 11)) !important;color:rgb(var(--cat-danger-fill-hover, 255, 255, 255)) !important}.cat-text-danger,.cat-link-danger{color:rgb(var(--cat-danger-text, 217, 52, 13)) !important}.cat-link-danger,.cat-text-danger-hover{transition:color 0.13s}.cat-link-danger:hover,.cat-text-danger-hover:hover{color:rgb(var(--cat-danger-text-hover, 194, 46, 11)) !important}.cat-link-danger:active,.cat-text-danger-hover:active{color:rgb(var(--cat-danger-text-active, 174, 42, 10)) !important}.cat-active{color:rgb(var(--cat-primary-text, 0, 129, 148)) !important}.cat-muted{color:rgb(var(--cat-font-color-muted, 81, 92, 108)) !important}.cat-text-reset{color:inherit !important}.cat-link-reset{color:inherit !important;text-decoration:inherit !important}.label{overflow:hidden;word-wrap:break-word;word-break:break-word}.label-container{flex-basis:var(--label-size, 33.33%)}.label-container.hidden{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.label-container .label-wrapper{display:flex;gap:0.25rem}.label-metadata{display:flex;flex-shrink:0;flex-grow:1;justify-content:space-between;gap:0.25rem}.label-optional{display:flex;align-items:center;max-height:1.25rem;font-size:0.75rem;line-height:1rem;font-weight:var(--cat-font-weight-body, 400);color:rgb(var(--cat-font-color-muted, 81, 92, 108))}.label-character-count{display:flex;align-items:center;margin-left:auto;max-height:1.25rem;font-size:0.75rem;line-height:1rem;font-weight:var(--cat-font-weight-body, 400);color:rgb(var(--cat-font-color-muted, 81, 92, 108))}.input-horizontal .label-wrapper,.textarea-horizontal .label-wrapper,.select-horizontal .label-wrapper{flex-direction:column}.input-horizontal label,.textarea-horizontal label,.select-horizontal label{min-height:2.5rem;display:inline-flex;align-items:center}.input-horizontal .label-metadata,.textarea-horizontal .label-metadata,.select-horizontal .label-metadata{justify-content:flex-start}.input-horizontal .label-metadata .label-character-count,.textarea-horizontal .label-metadata .label-character-count,.select-horizontal .label-metadata .label-character-count{margin-left:0}:host{display:flex;flex-direction:column;gap:0.5rem;font-size:0.9375rem;line-height:1.25rem;font-weight:var(--cat-font-weight-body, 400);margin-bottom:1rem}:host([hidden]){display:none}.textarea-field,.textarea-container{display:flex;flex-direction:column;gap:0.5rem;flex:1 1 auto}.textarea-field.textarea-horizontal{flex-direction:row;gap:1rem}.textarea-wrapper{position:relative;display:flex;flex-direction:column}.icon-suffix{position:absolute;top:calc(0.625rem - 2px);right:0.75rem;background:rgba(255, 255, 255, 0.75);border-radius:100rem}.textarea-disabled .icon-suffix{background:rgba(242, 244, 247, 0.75)}textarea{margin:0;padding:0.625rem 0.75rem;min-height:2.5rem;font:inherit;background:white;border-radius:var(--cat-border-radius-m, 0.25rem);border:none;box-shadow:0 0 0 1px rgb(var(--cat-border-color-dark, 215, 219, 224));transition:box-shadow 0.13s linear;resize:vertical;}textarea:disabled{background:#f2f4f7;cursor:not-allowed;color:rgb(var(--cat-font-color-muted, 81, 92, 108));resize:none}.textarea-invalid textarea{box-shadow:0 0 0 1px rgba(var(--cat-danger-bg, 217, 52, 13), 0.2)}textarea:hover:not(:disabled){box-shadow:0 0 0 2px rgb(var(--cat-border-color-dark, 215, 219, 224))}.textarea-invalid textarea:hover:not(:disabled){box-shadow:0 0 0 2px rgba(var(--cat-danger-bg, 217, 52, 13), 0.2)}textarea:focus{outline:2px solid rgb(var(--cat-border-color-focus, 0, 113, 255))}.textarea-invalid textarea:focus{outline:2px solid rgba(var(--cat-danger-bg, 217, 52, 13), 0.2)}textarea::placeholder{color:rgb(var(--cat-font-color-muted, 81, 92, 108))}textarea:-webkit-autofill,textarea:-webkit-autofill:hover,textarea:-webkit-autofill:focus{-webkit-box-shadow:0 0 0 9999px #e8f0fe inset}";
7676
7812
 
7677
7813
  let nextUniqueId$2 = 0;
7678
7814
  const CatTextarea = class {
@@ -7889,7 +8025,7 @@ CatToggle.style = catToggleCss;
7889
8025
 
7890
8026
  const isTouchDevice = 'ontouchstart' in window || navigator.maxTouchPoints > 0;
7891
8027
 
7892
- const catTooltipCss = ":host{display:contents}:host([hidden]){display:none}.tooltip{--cat-font-color-head:cat-token(\"color.ui.font.tooltip\", $wrap: false);--cat-font-color-body:cat-token(\"color.ui.font.tooltip\", $wrap: false);position:fixed;width:max-content;top:0;left:0;box-sizing:border-box;font-size:0.875rem;line-height:1rem;font-weight:500;background-color:rgb(var(--cat-bg-tooltip, 0, 0, 0));border-radius:var(--cat-border-radius-m, 0.25rem);color:rgb(var(--cat-font-color-tooltip, 255, 255, 255));transition:opacity 0.25s linear, visibility 0.25s linear;visibility:hidden;opacity:0;box-shadow:rgba(0, 0, 0, 0.08) 0 1px 8px 0;z-index:200;max-width:min(100vw - 0.5rem, 20rem)}.tooltip-hidden{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.tooltip-show{opacity:1;visibility:visible}.tooltip-round{border-radius:10rem}.tooltip-s{padding:0.375rem 0.5rem}.tooltip-s.tooltip-round{padding:0.375rem 0.75rem}.tooltip-m{padding:0.75rem}.tooltip-m.tooltip-round{padding:0.75rem 1rem}.tooltip-l{padding:1rem}.tooltip-l.tooltip-round{padding:1rem 1.5rem}.tooltip-trigger{display:inline-block}.tooltip-trigger:focus{outline:none}";
8028
+ const catTooltipCss = ":host{display:contents}:host([hidden]){display:none}.tooltip{--cat-font-color-head:cat-token(\"color.ui.font.tooltip\", $wrap: false);--cat-font-color-body:cat-token(\"color.ui.font.tooltip\", $wrap: false);position:fixed;width:max-content;top:0;left:0;box-sizing:border-box;font-size:0.875rem;line-height:1rem;font-weight:500;background-color:rgb(var(--cat-bg-tooltip, 0, 0, 0));border-radius:var(--cat-border-radius-m, 0.25rem);color:rgb(var(--cat-font-color-tooltip, 255, 255, 255));transition:opacity 0.25s linear, visibility 0.25s linear;visibility:hidden;opacity:0;box-shadow:rgba(0, 0, 0, 0.08) 0 1px 8px 0;z-index:200;max-width:min(100vw - 0.5rem, 20rem)}.tooltip-hidden{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important;border:0 !important}.tooltip-show{opacity:1;visibility:visible}.tooltip-round{border-radius:10rem}.tooltip-s{padding:0.375rem 0.5rem}.tooltip-s.tooltip-round{padding:0.375rem 0.75rem}.tooltip-m{padding:0.75rem}.tooltip-m.tooltip-round{padding:0.75rem 1rem}.tooltip-l{padding:1rem}.tooltip-l.tooltip-round{padding:1rem 1.5rem}";
7893
8029
 
7894
8030
  let nextUniqueId = 0;
7895
8031
  const CatTooltip = class {
@@ -7911,24 +8047,22 @@ const CatTooltip = class {
7911
8047
  key === 'Escape' && this.hideListener();
7912
8048
  }
7913
8049
  componentDidLoad() {
7914
- var _a, _b, _c, _d, _e, _f, _g;
7915
- this.trigger = firstTabbable(this.triggerElement) || this.triggerElement;
7916
- if (!this.isTabbable) {
7917
- (_a = this.trigger) === null || _a === void 0 ? void 0 : _a.setAttribute('tabindex', '0');
7918
- }
7919
- if (this.trigger && this.tooltip) {
7920
- autoUpdate(this.trigger, this.tooltip, () => this.update());
8050
+ var _a, _b, _c, _d, _e, _f, _g, _h, _j;
8051
+ const slot = (_a = this.hostElement.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('slot');
8052
+ this.trigger = (_c = (_b = slot === null || slot === void 0 ? void 0 : slot.assignedElements) === null || _b === void 0 ? void 0 : _b.call(slot)) === null || _c === void 0 ? void 0 : _c[0];
8053
+ if (this.trigger && !this.trigger.hasAttribute('aria-describedby')) {
8054
+ this.trigger.setAttribute('aria-describedby', this.id);
7921
8055
  }
7922
8056
  if (isTouchDevice) {
7923
8057
  window.addEventListener('touchstart', this.windowTouchStartListener.bind(this));
7924
- (_b = this.trigger) === null || _b === void 0 ? void 0 : _b.addEventListener('touchstart', this.touchStartListener.bind(this));
7925
- (_c = this.trigger) === null || _c === void 0 ? void 0 : _c.addEventListener('touchend', this.touchEndListener.bind(this));
8058
+ (_d = this.trigger) === null || _d === void 0 ? void 0 : _d.addEventListener('touchstart', this.touchStartListener.bind(this));
8059
+ (_e = this.trigger) === null || _e === void 0 ? void 0 : _e.addEventListener('touchend', this.touchEndListener.bind(this));
7926
8060
  }
7927
8061
  else {
7928
- (_d = this.trigger) === null || _d === void 0 ? void 0 : _d.addEventListener('focusin', this.showListener.bind(this));
7929
- (_e = this.trigger) === null || _e === void 0 ? void 0 : _e.addEventListener('focusout', this.hideListener.bind(this));
7930
- (_f = this.trigger) === null || _f === void 0 ? void 0 : _f.addEventListener('mouseenter', this.showListener.bind(this));
7931
- (_g = this.trigger) === null || _g === void 0 ? void 0 : _g.addEventListener('mouseleave', this.hideListener.bind(this));
8062
+ (_f = this.trigger) === null || _f === void 0 ? void 0 : _f.addEventListener('focusin', this.showListener.bind(this));
8063
+ (_g = this.trigger) === null || _g === void 0 ? void 0 : _g.addEventListener('focusout', this.hideListener.bind(this));
8064
+ (_h = this.trigger) === null || _h === void 0 ? void 0 : _h.addEventListener('mouseenter', this.showListener.bind(this));
8065
+ (_j = this.trigger) === null || _j === void 0 ? void 0 : _j.addEventListener('mouseleave', this.hideListener.bind(this));
7932
8066
  }
7933
8067
  }
7934
8068
  componentWillRender() {
@@ -7950,16 +8084,13 @@ const CatTooltip = class {
7950
8084
  }
7951
8085
  }
7952
8086
  render() {
7953
- return (h(Host, null, h("div", { ref: el => (this.triggerElement = el), "aria-describedby": this.id, class: "tooltip-trigger" }, h("slot", null)), h("div", { ref: el => (this.tooltip = el), id: this.id, "aria-hidden": this.hidden, class: {
8087
+ return (h(Host, null, h("slot", null), h("div", { ref: el => (this.tooltip = el), id: this.id, "aria-hidden": this.hidden, class: {
7954
8088
  tooltip: true,
7955
8089
  'tooltip-hidden': this.hidden,
7956
8090
  'tooltip-round': this.round,
7957
8091
  [`tooltip-${this.size}`]: Boolean(this.size)
7958
8092
  } }, this.hasSlottedContent ? h("slot", { name: "content" }) : this.content)));
7959
8093
  }
7960
- get isTabbable() {
7961
- return firstTabbable(this.trigger);
7962
- }
7963
8094
  async update() {
7964
8095
  if (this.trigger && this.tooltip) {
7965
8096
  await computePosition(this.trigger, this.tooltip, {
@@ -7987,6 +8118,7 @@ const CatTooltip = class {
7987
8118
  this.hideTimeout = window.setTimeout(() => {
7988
8119
  var _a;
7989
8120
  (_a = this.tooltip) === null || _a === void 0 ? void 0 : _a.classList.remove('tooltip-show');
8121
+ this.hideTooltip();
7990
8122
  }, this.hideDelay);
7991
8123
  }
7992
8124
  touchStartListener(event) {
@@ -7998,6 +8130,7 @@ const CatTooltip = class {
7998
8130
  touchEndListener() {
7999
8131
  if (this.touchTimeout) {
8000
8132
  window.clearTimeout(this.touchTimeout);
8133
+ this.hideTooltip();
8001
8134
  }
8002
8135
  }
8003
8136
  windowTouchStartListener() {
@@ -8006,14 +8139,22 @@ const CatTooltip = class {
8006
8139
  }
8007
8140
  showTooltip() {
8008
8141
  var _a;
8142
+ if (this.trigger && this.tooltip) {
8143
+ this.cleanupFloatingUi = autoUpdate(this.trigger, this.tooltip, () => this.update());
8144
+ }
8009
8145
  !this.hidden && ((_a = this.tooltip) === null || _a === void 0 ? void 0 : _a.classList.add('tooltip-show'));
8010
8146
  }
8147
+ hideTooltip() {
8148
+ if (this.cleanupFloatingUi) {
8149
+ this.cleanupFloatingUi();
8150
+ }
8151
+ }
8011
8152
  get hostElement() { return getElement(this); }
8012
8153
  };
8013
8154
  CatTooltip.OFFSET = 4;
8014
8155
  CatTooltip.SHIFT_PADDING = 4;
8015
8156
  CatTooltip.style = catTooltipCss;
8016
8157
 
8017
- export { CatAlert as cat_alert, CatAvatar as cat_avatar, CatBadge as cat_badge, CatButton as cat_button, CatCard as cat_card, CatCheckbox as cat_checkbox, CatDropdown as cat_dropdown, CatFormGroup as cat_form_group, CatIcon as cat_icon, CatInput as cat_input, CatLabel as cat_label, CatPagination as cat_pagination, CatRadio as cat_radio, CatRadioGroup as cat_radio_group, CatScrollable as cat_scrollable, CatSelect as cat_select, CatSelectTest as cat_select_demo, CatSkeleton as cat_skeleton, CatSpinner as cat_spinner, CatTab as cat_tab, CatTabs as cat_tabs, CatTextarea as cat_textarea, CatToggle as cat_toggle, CatTooltip as cat_tooltip };
8158
+ export { CatAlert as cat_alert, CatAvatar as cat_avatar, CatBadge as cat_badge, CatButton as cat_button, CatButtonGroup as cat_button_group, CatCard as cat_card, CatCheckbox as cat_checkbox, CatDropdown as cat_dropdown, CatFormGroup as cat_form_group, CatIcon as cat_icon, CatInput as cat_input, CatLabel as cat_label, CatPagination as cat_pagination, CatRadio as cat_radio, CatRadioGroup as cat_radio_group, CatScrollable as cat_scrollable, CatSelect as cat_select, CatSelectTest as cat_select_demo, CatSkeleton as cat_skeleton, CatSpinner as cat_spinner, CatTab as cat_tab, CatTabs as cat_tabs, CatTextarea as cat_textarea, CatToggle as cat_toggle, CatTooltip as cat_tooltip };
8018
8159
 
8019
- //# sourceMappingURL=cat-alert_24.entry.js.map
8160
+ //# sourceMappingURL=cat-alert_25.entry.js.map