@public-ui/components 4.3.1-rc.4 → 4.4.0-rc.0

package/dist/collection/components/tabs/style.css

@@ -10,8 +10,10 @@
 * 3. kol-component - Component-specific styles
 * 4. kol-theme-global - Theme-specific global styles
 * 5. kol-theme-component - Theme-specific component styles
+* 6. kol-forced-colors - Defaults for forced colors and high contrast modes
+* 7. kol-theme-forced-colors - Theme-specific styles for forced colors and high contrast modes
 */
-@layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component;
+@layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors;
 /*
  * This file contains all rules for accessibility.
  */
@@ -128,6 +130,44 @@
     clip-path: inset(50%);
   }
 }
+/*
+ * This file contains all rules for forced-colors and highcontrast modes
+ * https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Values/system-color to see all color keywords the browsers are providing
+ */
+@layer kol-forced-colors {
+  @media (forced-colors: active) {
+    .kol-button__text {
+      color: ButtonText;
+      background-color: ButtonFace;
+      border: 2px solid ButtonBorder;
+    }
+    .kol-button--disabled .kol-button__text {
+      color: GrayText;
+      border-color: GrayText;
+    }
+    .kol-card,
+    .kol-dialog,
+    .kol-modal,
+    .kol-drawer {
+      color: CanvasText;
+      background-color: Canvas;
+      border: 1px solid ButtonBorder;
+    }
+    .kol-pagination__button--selected .kol-button {
+      opacity: 1;
+    }
+    .kol-pagination__button--selected .kol-button__text {
+      color: SelectedItemText;
+      background-color: SelectedItem;
+    }
+    /* focus styles */
+    .kol-button:focus-visible,
+    .kol-link__anchor:focus-visible {
+      outline: 2px solid Highlight;
+      outline-offset: 2px;
+    }
+  }
+}
 @layer kol-global {
   /*
    * Dieses CSS stellt sicher, dass der Standard-Style
@@ -215,8 +255,8 @@
 }
 @font-face {
   font-family: "kolicons";
-  src: url("kolicons.eot?t=1788331945767"); /* IE9*/
-  src: url("kolicons.eot?t=1788331945767#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1788331945767") format("woff2"), url("kolicons.woff?t=1788331945767") format("woff"), url("kolicons.ttf?t=1788331945767") format("truetype"), url("kolicons.svg?t=1788331945767#kolicons") format("svg"); /* iOS 4.1- */
+  src: url("kolicons.eot?t=1788788973815"); /* IE9*/
+  src: url("kolicons.eot?t=1788788973815#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1788788973815") format("woff2"), url("kolicons.woff?t=1788788973815") format("woff"), url("kolicons.ttf?t=1788788973815") format("truetype"), url("kolicons.svg?t=1788788973815#kolicons") format("svg"); /* iOS 4.1- */
 }
 @layer kol-component {
   [class^=kolicon-], [class*=" kolicon-"] {

package/dist/collection/components/textarea/shadow.js

@@ -58,7 +58,7 @@ export class KolTextarea {
             } });
     }
     render() {
-        return (h(KolFormFieldStateWrapperFc, Object.assign({ key: '3c33c5a2024d608ff98961151c535dd09df0d22d' }, this.getFormFieldProps()), h(KolInputContainerStateWrapperFc, { key: '2692c29aaf77d4fc5531147e8d48569c16d2483e', state: this.state }, h(KolTextAreaStateWrapperFc, Object.assign({ key: '5d509505b616b72dc608eb3140c9544d72177d6d' }, this.getTextAreaProps())))));
+        return (h(KolFormFieldStateWrapperFc, Object.assign({ key: '02a61fd3cc5218c1021750ab2459a83435f3f3b0' }, this.getFormFieldProps()), h(KolInputContainerStateWrapperFc, { key: '02b188eb777f11b736f8eb190db30854720fdbec', state: this.state }, h(KolTextAreaStateWrapperFc, Object.assign({ key: '1ca1d314c8be9c11d0fbd540b4f6fd31ec11a83b' }, this.getTextAreaProps())))));
     }
     validateAriaDetails(value) {
         this.controller.validateAriaDetails(value);

package/dist/collection/components/textarea/style.css

@@ -9,8 +9,10 @@
 * 3. kol-component - Component-specific styles
 * 4. kol-theme-global - Theme-specific global styles
 * 5. kol-theme-component - Theme-specific component styles
+* 6. kol-forced-colors - Defaults for forced colors and high contrast modes
+* 7. kol-theme-forced-colors - Theme-specific styles for forced colors and high contrast modes
 */
-@layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component;
+@layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors;
 /* forward the rem function */
 /*
  * This file contains all rules for accessibility.
@@ -128,6 +130,44 @@
     clip-path: inset(50%);
   }
 }
+/*
+ * This file contains all rules for forced-colors and highcontrast modes
+ * https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Values/system-color to see all color keywords the browsers are providing
+ */
+@layer kol-forced-colors {
+  @media (forced-colors: active) {
+    .kol-button__text {
+      color: ButtonText;
+      background-color: ButtonFace;
+      border: 2px solid ButtonBorder;
+    }
+    .kol-button--disabled .kol-button__text {
+      color: GrayText;
+      border-color: GrayText;
+    }
+    .kol-card,
+    .kol-dialog,
+    .kol-modal,
+    .kol-drawer {
+      color: CanvasText;
+      background-color: Canvas;
+      border: 1px solid ButtonBorder;
+    }
+    .kol-pagination__button--selected .kol-button {
+      opacity: 1;
+    }
+    .kol-pagination__button--selected .kol-button__text {
+      color: SelectedItemText;
+      background-color: SelectedItem;
+    }
+    /* focus styles */
+    .kol-button:focus-visible,
+    .kol-link__anchor:focus-visible {
+      outline: 2px solid Highlight;
+      outline-offset: 2px;
+    }
+  }
+}
 @layer kol-global {
   /*
    * Dieses CSS stellt sicher, dass der Standard-Style
@@ -215,8 +255,8 @@
 }
 @font-face {
   font-family: "kolicons";
-  src: url("kolicons.eot?t=1788331945767"); /* IE9*/
-  src: url("kolicons.eot?t=1788331945767#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1788331945767") format("woff2"), url("kolicons.woff?t=1788331945767") format("woff"), url("kolicons.ttf?t=1788331945767") format("truetype"), url("kolicons.svg?t=1788331945767#kolicons") format("svg"); /* iOS 4.1- */
+  src: url("kolicons.eot?t=1788788973815"); /* IE9*/
+  src: url("kolicons.eot?t=1788788973815#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1788788973815") format("woff2"), url("kolicons.woff?t=1788788973815") format("woff"), url("kolicons.ttf?t=1788788973815") format("truetype"), url("kolicons.svg?t=1788788973815#kolicons") format("svg"); /* iOS 4.1- */
 }
 @layer kol-component {
   [class^=kolicon-], [class*=" kolicon-"] {
@@ -479,7 +519,7 @@
     align-items: flex-start;
     justify-content: flex-start;
   }
-  .kol-form-field--required .kol-form-field__label-text:has(.kol-span__slot[hidden])::after,
+  .kol-form-field--required .kol-form-field__label-text:has(.kol-span__slot[hidden]) .kol-span__label::after,
   .kol-form-field--required .kol-form-field .kol-tooltip__content .kol-span__label::after {
     content: "*"/"";
   }

package/dist/collection/components/toaster/shadow.js

@@ -76,7 +76,7 @@ export class KolToastContainer {
         }
     }
     render() {
-        return (h(Host, { key: 'bb343983a732cab5a48df025126018dc09de4b9b', class: "kol-toast-container" }, this.state._toastStates.length > 1 && (h(KolButtonTag, { key: '642bf68d61ec6344ab5ff907e2802b1c3189eb8c', _label: this.translateToastCloseAll, class: "kol-toast-container__button-close-all", _on: {
+        return (h(Host, { key: 'e4cc285e5f70c25fd9fb44c4a607c06a1abdf3e7', class: "kol-toast-container" }, this.state._toastStates.length > 1 && (h(KolButtonTag, { key: 'a82a3a64805d264e9aa89b00efaabf47e88d149b', _label: this.translateToastCloseAll, class: "kol-toast-container__button-close-all", _on: {
                 onClick: () => {
                     void this.closeAll();
                 },

package/dist/collection/components/toaster/style.css

@@ -9,8 +9,10 @@
 * 3. kol-component - Component-specific styles
 * 4. kol-theme-global - Theme-specific global styles
 * 5. kol-theme-component - Theme-specific component styles
+* 6. kol-forced-colors - Defaults for forced colors and high contrast modes
+* 7. kol-theme-forced-colors - Theme-specific styles for forced colors and high contrast modes
 */
-@layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component;
+@layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors;
 /* forward the rem function */
 /*
  * This file contains all rules for accessibility.
@@ -128,6 +130,44 @@
     clip-path: inset(50%);
   }
 }
+/*
+ * This file contains all rules for forced-colors and highcontrast modes
+ * https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Values/system-color to see all color keywords the browsers are providing
+ */
+@layer kol-forced-colors {
+  @media (forced-colors: active) {
+    .kol-button__text {
+      color: ButtonText;
+      background-color: ButtonFace;
+      border: 2px solid ButtonBorder;
+    }
+    .kol-button--disabled .kol-button__text {
+      color: GrayText;
+      border-color: GrayText;
+    }
+    .kol-card,
+    .kol-dialog,
+    .kol-modal,
+    .kol-drawer {
+      color: CanvasText;
+      background-color: Canvas;
+      border: 1px solid ButtonBorder;
+    }
+    .kol-pagination__button--selected .kol-button {
+      opacity: 1;
+    }
+    .kol-pagination__button--selected .kol-button__text {
+      color: SelectedItemText;
+      background-color: SelectedItem;
+    }
+    /* focus styles */
+    .kol-button:focus-visible,
+    .kol-link__anchor:focus-visible {
+      outline: 2px solid Highlight;
+      outline-offset: 2px;
+    }
+  }
+}
 @layer kol-global {
   /*
    * Dieses CSS stellt sicher, dass der Standard-Style
@@ -215,8 +255,8 @@
 }
 @font-face {
   font-family: "kolicons";
-  src: url("kolicons.eot?t=1788331945767"); /* IE9*/
-  src: url("kolicons.eot?t=1788331945767#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1788331945767") format("woff2"), url("kolicons.woff?t=1788331945767") format("woff"), url("kolicons.ttf?t=1788331945767") format("truetype"), url("kolicons.svg?t=1788331945767#kolicons") format("svg"); /* iOS 4.1- */
+  src: url("kolicons.eot?t=1788788973815"); /* IE9*/
+  src: url("kolicons.eot?t=1788788973815#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1788788973815") format("woff2"), url("kolicons.woff?t=1788788973815") format("woff"), url("kolicons.ttf?t=1788788973815") format("truetype"), url("kolicons.svg?t=1788788973815#kolicons") format("svg"); /* iOS 4.1- */
 }
 @layer kol-component {
   [class^=kolicon-], [class*=" kolicon-"] {

package/dist/collection/components/toolbar/shadow.js

@@ -53,7 +53,7 @@ export class KolToolbar {
         return Object.assign(Object.assign({}, rest), { _icons, _disabled });
     }
     render() {
-        return (h("div", { key: 'ddbe02e49dd44c04a7f1439912584f66dba41ad0', class: `kol-toolbar kol-toolbar--orientation-${this.state._orientation}`, role: "toolbar", "aria-label": this.state._label }, this.state._items.map(this.renderItem)));
+        return (h("div", { key: '0f299f797d7d5462d4aa3545c0a290bef8751ff2', class: `kol-toolbar kol-toolbar--orientation-${this.state._orientation}`, role: "toolbar", "aria-label": this.state._label }, this.state._items.map(this.renderItem)));
     }
     validateLabel(value) {
         validateLabel(this, value);

package/dist/collection/components/toolbar/style.css

@@ -10,8 +10,10 @@
 * 3. kol-component - Component-specific styles
 * 4. kol-theme-global - Theme-specific global styles
 * 5. kol-theme-component - Theme-specific component styles
+* 6. kol-forced-colors - Defaults for forced colors and high contrast modes
+* 7. kol-theme-forced-colors - Theme-specific styles for forced colors and high contrast modes
 */
-@layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component;
+@layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors;
 /*
  * This file contains all rules for accessibility.
  */
@@ -128,6 +130,44 @@
     clip-path: inset(50%);
   }
 }
+/*
+ * This file contains all rules for forced-colors and highcontrast modes
+ * https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Values/system-color to see all color keywords the browsers are providing
+ */
+@layer kol-forced-colors {
+  @media (forced-colors: active) {
+    .kol-button__text {
+      color: ButtonText;
+      background-color: ButtonFace;
+      border: 2px solid ButtonBorder;
+    }
+    .kol-button--disabled .kol-button__text {
+      color: GrayText;
+      border-color: GrayText;
+    }
+    .kol-card,
+    .kol-dialog,
+    .kol-modal,
+    .kol-drawer {
+      color: CanvasText;
+      background-color: Canvas;
+      border: 1px solid ButtonBorder;
+    }
+    .kol-pagination__button--selected .kol-button {
+      opacity: 1;
+    }
+    .kol-pagination__button--selected .kol-button__text {
+      color: SelectedItemText;
+      background-color: SelectedItem;
+    }
+    /* focus styles */
+    .kol-button:focus-visible,
+    .kol-link__anchor:focus-visible {
+      outline: 2px solid Highlight;
+      outline-offset: 2px;
+    }
+  }
+}
 @layer kol-global {
   /*
    * Dieses CSS stellt sicher, dass der Standard-Style
@@ -210,8 +250,8 @@
 }
 @font-face {
   font-family: "kolicons";
-  src: url("kolicons.eot?t=1788331945767"); /* IE9*/
-  src: url("kolicons.eot?t=1788331945767#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1788331945767") format("woff2"), url("kolicons.woff?t=1788331945767") format("woff"), url("kolicons.ttf?t=1788331945767") format("truetype"), url("kolicons.svg?t=1788331945767#kolicons") format("svg"); /* iOS 4.1- */
+  src: url("kolicons.eot?t=1788788973815"); /* IE9*/
+  src: url("kolicons.eot?t=1788788973815#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1788788973815") format("woff2"), url("kolicons.woff?t=1788788973815") format("woff"), url("kolicons.ttf?t=1788788973815") format("truetype"), url("kolicons.svg?t=1788788973815#kolicons") format("svg"); /* iOS 4.1- */
 }
 @layer kol-component {
   [class^=kolicon-], [class*=" kolicon-"] {

package/dist/collection/components/tooltip/component.js

@@ -49,7 +49,7 @@ export class KolTooltipWc {
         (_a = this.tooltipBehavior) === null || _a === void 0 ? void 0 : _a.destroy();
     }
     render() {
-        return (h(Host, { key: '0e70723e8dbaf8a29a925fc19bfbe210e44e3b03', class: "kol-tooltip" }, h(TooltipFC, { key: '0bb822d769a11f23d53be905fe6391d4d2a354e3', label: this.tooltipBehavior.getRenderProp('label'), badgeText: this._badgeText, id: this.tooltipBehavior.getRenderProp('id'), refFloating: (el) => { var _a; return (_a = this.tooltipBehavior) === null || _a === void 0 ? void 0 : _a.setTooltipElementRef(el); } })));
+        return (h(Host, { key: '24188cfa0cc3e2db0e15bb13d42dbfb391980ece', class: "kol-tooltip" }, h(TooltipFC, { key: '599e639e86ce70effba916d9736e0428ad1b7e84', label: this.tooltipBehavior.getRenderProp('label'), badgeText: this._badgeText, id: this.tooltipBehavior.getRenderProp('id'), refFloating: (el) => { var _a; return (_a = this.tooltipBehavior) === null || _a === void 0 ? void 0 : _a.setTooltipElementRef(el); } })));
     }
     static get is() { return "kol-tooltip-wc"; }
     static get properties() {

package/dist/collection/components/tree/component.js

@@ -23,7 +23,7 @@ export class KolTreeWc {
         await Promise.resolve((this.cacheValid = false));
     }
     render() {
-        return (h(Host, { key: 'a0f6da258cc1084c84e0bcdc0fe37e7e541c3e45', onSlotchange: this.handleSlotchange.bind(this) }, h("nav", { key: '805cd73fb1ad3e5aaa659cc2cd8f53ed358e270f', class: "kol-tree", "aria-label": this.state._label }, h("ul", { key: '1b8c446ad54dc53fcde63baea9afbb4baf462f4d', class: "kol-tree__treeview-navigation", role: "tree", "aria-label": this.state._label }, h("slot", { key: '00602b56b1e62390553d3289ffada05fab3967be' })))));
+        return (h(Host, { key: '76db8a8a964ef9da688d8477b87fed088d6043be', onSlotchange: this.handleSlotchange.bind(this) }, h("nav", { key: '3eef1d5f867c48a75b1f17ac1240022165579917', class: "kol-tree", "aria-label": this.state._label }, h("ul", { key: '26850b463f2b75e1eac5a42742c3a07d2f0e5f19', class: "kol-tree__treeview-navigation", role: "tree", "aria-label": this.state._label }, h("slot", { key: 'fdaffc06e02509f0aa9f853b9a0735d93d4fe019' })))));
     }
     static isTreeItem(element) {
         return (element === null || element === void 0 ? void 0 : element.tagName) === KolTreeItemTag.toUpperCase();

package/dist/collection/components/tree/shadow.js

@@ -11,7 +11,7 @@ export class KolTree {
     }
     async focus(options) { }
     render() {
-        return (h(KolTreeWcTag, { key: 'eadeb1863b89215e45fbff3dc2aef3e6375361ea', _label: this._label, ref: this.ctaRef }, h("slot", { key: 'f026be16502ff475100b58acea64c7bd5caa7bfc' })));
+        return (h(KolTreeWcTag, { key: '989a82d33f1a247755e58884892a8519a6dc92a6', _label: this._label, ref: this.ctaRef }, h("slot", { key: '80acf3ca64a635a590448e8a08eafce144927c1d' })));
     }
     static get is() { return "kol-tree"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/tree/style.css

@@ -10,8 +10,10 @@
 * 3. kol-component - Component-specific styles
 * 4. kol-theme-global - Theme-specific global styles
 * 5. kol-theme-component - Theme-specific component styles
+* 6. kol-forced-colors - Defaults for forced colors and high contrast modes
+* 7. kol-theme-forced-colors - Theme-specific styles for forced colors and high contrast modes
 */
-@layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component;
+@layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors;
 /*
  * This file contains all rules for accessibility.
  */
@@ -128,6 +130,44 @@
     clip-path: inset(50%);
   }
 }
+/*
+ * This file contains all rules for forced-colors and highcontrast modes
+ * https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Values/system-color to see all color keywords the browsers are providing
+ */
+@layer kol-forced-colors {
+  @media (forced-colors: active) {
+    .kol-button__text {
+      color: ButtonText;
+      background-color: ButtonFace;
+      border: 2px solid ButtonBorder;
+    }
+    .kol-button--disabled .kol-button__text {
+      color: GrayText;
+      border-color: GrayText;
+    }
+    .kol-card,
+    .kol-dialog,
+    .kol-modal,
+    .kol-drawer {
+      color: CanvasText;
+      background-color: Canvas;
+      border: 1px solid ButtonBorder;
+    }
+    .kol-pagination__button--selected .kol-button {
+      opacity: 1;
+    }
+    .kol-pagination__button--selected .kol-button__text {
+      color: SelectedItemText;
+      background-color: SelectedItem;
+    }
+    /* focus styles */
+    .kol-button:focus-visible,
+    .kol-link__anchor:focus-visible {
+      outline: 2px solid Highlight;
+      outline-offset: 2px;
+    }
+  }
+}
 @layer kol-global {
   /*
    * Dieses CSS stellt sicher, dass der Standard-Style

package/dist/collection/components/tree-item/component.js

@@ -20,12 +20,12 @@ export class KolTreeItemWc {
     }
     render() {
         const { _href, _active, _hasChildren, _open, _label } = this.state;
-        return (h(Host, { key: '92e7842f8e32e3ef08551e0f28c4b399584571f9', onSlotchange: this.handleSlotchange.bind(this) }, h("li", { key: 'f9fd5f215742a4cdc56e61a3dcae57e9a3947dec', class: "kol-tree-item", style: {
+        return (h(Host, { key: 'e815ee0e75d2f6353641a191858e05916d671f3f', onSlotchange: this.handleSlotchange.bind(this) }, h("li", { key: '08ce3b07f86e3dfeaf356af53429f8b85d6e4036', class: "kol-tree-item", style: {
                 '--level': `${this.level}`,
-            } }, h(KolLinkWcTag, { key: 'cc8bf4edd12f32ee6dca12420ba45890b1143d0a', class: clsx('kol-tree-item__link', {
+            } }, h(KolLinkWcTag, { key: 'ca213157c24a2624618f7ac8fe704925e5ddfb05', class: clsx('kol-tree-item__link', {
                 'kol-tree-item__link--first-level': this.level === 0,
                 'kol-tree-item__link--active': _active,
-            }), _href: _href, _label: "", _role: "treeitem", _tabIndex: _active ? 0 : -1, _ariaExpanded: _hasChildren ? _open : undefined, _ariaOwns: _hasChildren ? this.groupId : undefined, ref: (element) => (this.linkElement = element) }, h("span", { key: '9b8118098a99504288c6b0f8f550531645e5bcb9', class: "kol-tree-item__link-inner", slot: "expert" }, _hasChildren ? (h("span", { class: "kol-tree-item__toggle-button", onClick: (event) => (_open ? void this.handleCollapseClick(event) : void this.handleExpandClick(event)) }, h(IconFC, { class: "kol-tree-item__toggle-button-icon", icons: `kolicon kolicon-${_open ? 'chevron-down' : 'chevron-right'}`, label: '' }))) : (h("span", { class: "kol-tree-item__toggle-button-placeholder" })), h("span", { key: '883489e972180eb21e7a16481811a707526fa479', class: "kol-tree-item__text" }, _label))), h("ul", { key: 'c3c4fb12c93f3a4dc48eec92a821008316e3f402', class: "kol-tree-item__children", hidden: !_hasChildren || !_open, role: "group", id: this.groupId }, h("slot", { key: '073be969033c7d8fa3f29323359192347abe858a' })))));
+            }), _href: _href, _label: "", _role: "treeitem", _tabIndex: _active ? 0 : -1, _ariaExpanded: _hasChildren ? _open : undefined, _ariaOwns: _hasChildren ? this.groupId : undefined, ref: (element) => (this.linkElement = element) }, h("span", { key: 'd1b5bf9ce647bc3d5b182722a59589825b990435', class: "kol-tree-item__link-inner", slot: "expert" }, _hasChildren ? (h("span", { class: "kol-tree-item__toggle-button", onClick: (event) => (_open ? void this.handleCollapseClick(event) : void this.handleExpandClick(event)) }, h(IconFC, { class: "kol-tree-item__toggle-button-icon", icons: `kolicon kolicon-${_open ? 'chevron-down' : 'chevron-right'}`, label: '' }))) : (h("span", { class: "kol-tree-item__toggle-button-placeholder" })), h("span", { key: '14b1ef93e766264a46c1a04bd968d1e5f7a74248', class: "kol-tree-item__text" }, _label))), h("ul", { key: 'e395298b540211572fc3c08d671ef28a9f35fed4', class: "kol-tree-item__children", hidden: !_hasChildren || !_open, role: "group", id: this.groupId }, h("slot", { key: 'c193f7e3ee0ad5b187547445ae6b2b5f1a2d0e56' })))));
     }
     validateActive(value) {
         validateActive(this, value || false);

package/dist/collection/components/tree-item/shadow.js

@@ -21,7 +21,7 @@ export class KolTreeItem {
         return (_b = (await ((_a = this.element) === null || _a === void 0 ? void 0 : _a.isOpen()))) !== null && _b !== void 0 ? _b : false;
     }
     render() {
-        return (h(KolTreeItemWcTag, { key: '528976bb36e7f7ab8519468d5b379e0472009404', _active: this._active, _label: this._label, _open: this._open, _href: this._href, ref: (element) => (this.element = element) }, h("slot", { key: '10cebe7a170b79f117867e49a8b84413f89ee075' })));
+        return (h(KolTreeItemWcTag, { key: '6247c4d03997acd45521915c1bb47fc1cba46829', _active: this._active, _label: this._label, _open: this._open, _href: this._href, ref: (element) => (this.element = element) }, h("slot", { key: '896c4c8111c501b24f22c89ea469345a8e113464' })));
     }
     static get is() { return "kol-tree-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/tree-item/style.css

@@ -10,8 +10,10 @@
 * 3. kol-component - Component-specific styles
 * 4. kol-theme-global - Theme-specific global styles
 * 5. kol-theme-component - Theme-specific component styles
+* 6. kol-forced-colors - Defaults for forced colors and high contrast modes
+* 7. kol-theme-forced-colors - Theme-specific styles for forced colors and high contrast modes
 */
-@layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component;
+@layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors;
 /*
  * This file contains all rules for accessibility.
  */
@@ -128,6 +130,44 @@
     clip-path: inset(50%);
   }
 }
+/*
+ * This file contains all rules for forced-colors and highcontrast modes
+ * https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Values/system-color to see all color keywords the browsers are providing
+ */
+@layer kol-forced-colors {
+  @media (forced-colors: active) {
+    .kol-button__text {
+      color: ButtonText;
+      background-color: ButtonFace;
+      border: 2px solid ButtonBorder;
+    }
+    .kol-button--disabled .kol-button__text {
+      color: GrayText;
+      border-color: GrayText;
+    }
+    .kol-card,
+    .kol-dialog,
+    .kol-modal,
+    .kol-drawer {
+      color: CanvasText;
+      background-color: Canvas;
+      border: 1px solid ButtonBorder;
+    }
+    .kol-pagination__button--selected .kol-button {
+      opacity: 1;
+    }
+    .kol-pagination__button--selected .kol-button__text {
+      color: SelectedItemText;
+      background-color: SelectedItem;
+    }
+    /* focus styles */
+    .kol-button:focus-visible,
+    .kol-link__anchor:focus-visible {
+      outline: 2px solid Highlight;
+      outline-offset: 2px;
+    }
+  }
+}
 @layer kol-global {
   /*
    * Dieses CSS stellt sicher, dass der Standard-Style
@@ -210,8 +250,8 @@
 }
 @font-face {
   font-family: "kolicons";
-  src: url("kolicons.eot?t=1788331945767"); /* IE9*/
-  src: url("kolicons.eot?t=1788331945767#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1788331945767") format("woff2"), url("kolicons.woff?t=1788331945767") format("woff"), url("kolicons.ttf?t=1788331945767") format("truetype"), url("kolicons.svg?t=1788331945767#kolicons") format("svg"); /* iOS 4.1- */
+  src: url("kolicons.eot?t=1788788973815"); /* IE9*/
+  src: url("kolicons.eot?t=1788788973815#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1788788973815") format("woff2"), url("kolicons.woff?t=1788788973815") format("woff"), url("kolicons.ttf?t=1788788973815") format("truetype"), url("kolicons.svg?t=1788788973815#kolicons") format("svg"); /* iOS 4.1- */
 }
 @layer kol-component {
   [class^=kolicon-], [class*=" kolicon-"] {

package/dist/collection/components/version/shadow.js

@@ -13,7 +13,7 @@ export class KolVersion {
         };
     }
     render() {
-        return (h(Host, { key: 'da55098fa2f7cf94c33a27923ad2186ad01d1c9f', class: "kol-version" }, h(KolBadgeTag, { key: '3741ea4c3d5157747faca32bb9cb489374451807', _color: "#bec5c9", _icons: {
+        return (h(Host, { key: 'c2d2233605b20432a977c2f087a521e8b07d426b', class: "kol-version" }, h(KolBadgeTag, { key: '9cb33a2d77bfe2a0dedfcb5469517b31506a141a', _color: "#bec5c9", _icons: {
                 left: { icon: 'kolicon-version', label: this.translateVersion },
             }, _label: this.state._label })));
     }

package/dist/collection/components/version/style.css

@@ -9,8 +9,10 @@
 * 3. kol-component - Component-specific styles
 * 4. kol-theme-global - Theme-specific global styles
 * 5. kol-theme-component - Theme-specific component styles
+* 6. kol-forced-colors - Defaults for forced colors and high contrast modes
+* 7. kol-theme-forced-colors - Theme-specific styles for forced colors and high contrast modes
 */
-@layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component;
+@layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors;
 /* forward the rem function */
 /*
  * This file contains all rules for accessibility.
@@ -128,6 +130,44 @@
     clip-path: inset(50%);
   }
 }
+/*
+ * This file contains all rules for forced-colors and highcontrast modes
+ * https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Values/system-color to see all color keywords the browsers are providing
+ */
+@layer kol-forced-colors {
+  @media (forced-colors: active) {
+    .kol-button__text {
+      color: ButtonText;
+      background-color: ButtonFace;
+      border: 2px solid ButtonBorder;
+    }
+    .kol-button--disabled .kol-button__text {
+      color: GrayText;
+      border-color: GrayText;
+    }
+    .kol-card,
+    .kol-dialog,
+    .kol-modal,
+    .kol-drawer {
+      color: CanvasText;
+      background-color: Canvas;
+      border: 1px solid ButtonBorder;
+    }
+    .kol-pagination__button--selected .kol-button {
+      opacity: 1;
+    }
+    .kol-pagination__button--selected .kol-button__text {
+      color: SelectedItemText;
+      background-color: SelectedItem;
+    }
+    /* focus styles */
+    .kol-button:focus-visible,
+    .kol-link__anchor:focus-visible {
+      outline: 2px solid Highlight;
+      outline-offset: 2px;
+    }
+  }
+}
 @layer kol-global {
   /*
    * Dieses CSS stellt sicher, dass der Standard-Style

package/dist/collection/internal/functional-components/link/component.js

@@ -18,7 +18,7 @@ export const LinkFC = (props) => {
         href: typeof href === 'string' && href.length > 0 ? href : 'javascript:void(0);',
         target: typeof target === 'string' && target.length > 0 ? target : undefined,
         rel: isExternal ? 'noopener' : undefined,
-        download: typeof download === 'string' && download.length > 0 ? download : undefined,
+        download: typeof download === 'string' ? download : undefined,
     };
     if (hideLabel === true && !label) {
         devHint(`[KolLink] An aria-label must be set when _hide-label is set.`);

package/dist/collection/internal/functional-components/link/component.js.map

@@ -1 +1 @@
-{"version":3,"file":"component.js","sourceRoot":"","sources":["../../../../src/internal/functional-components/link/component.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { FunctionalComponent as FC } from '@stencil/core';\nimport { h } from '@stencil/core';\n\nimport { translate } from '../../../i18n';\nimport { devHint } from '../../../schema';\nimport { classNameFromVariant } from '../../../schema/props/variant-class-name';\nimport clsx from '../../../utils/clsx';\nimport { BemRootNodeFC } from '../bem-root-node/component';\nimport type { FunctionalComponentProps } from '../generic-types';\nimport { IconFC } from '../icon/component';\nimport { SpanFC } from '../span/component';\nimport { TooltipFC } from '../tooltip/component';\nimport type { LinkApi } from './api';\n\nexport const LinkFC: FC<FunctionalComponentProps<LinkApi>> = (props) => {\n\tconst {\n\t\taccessKey,\n\t\tariaControls,\n\t\tariaCurrent,\n\t\tariaDescription,\n\t\tariaDescriptionId,\n\t\tariaExpanded,\n\t\tariaOwns,\n\t\tcustomClass,\n\t\tdisabled,\n\t\tdownload,\n\t\thandleAnchorClick,\n\t\thideLabel,\n\t\thref,\n\t\ticons,\n\t\tinline,\n\t\tlabel,\n\t\ton,\n\t\trefAnchor,\n\t\trefTooltip,\n\t\trole,\n\t\tshortKey,\n\t\ttabIndex,\n\t\ttarget,\n\t\tvariant,\n\t\texpertSlot,\n\t} = props;\n\n\tconst translateOpenLinkInTab = translate('kol-open-link-in-tab');\n\n\tconst isExternal = typeof target === 'string' && target.length > 0 && target !== '_self';\n\n\tconst tagAttrs = {\n\t\thref: typeof href === 'string' && href.length > 0 ? href : 'javascript:void(0);',\n\t\ttarget: typeof target === 'string' && target.length > 0 ? target : undefined,\n\t\trel: isExternal ? 'noopener' : undefined,\n\t\tdownload: typeof download === 'string' && download.length > 0 ? download : undefined,\n\t};\n\n\tif (hideLabel === true && !label) {\n\t\tdevHint(`[KolLink] An aria-label must be set when _hide-label is set.`);\n\t}\n\n\tconst trimmedAriaDescription = ariaDescription?.trim();\n\tconst roleValue = role || undefined;\n\treturn (\n\t\t<BemRootNodeFC\n\t\t\tblock=\"kol-link\"\n\t\t\tclass={clsx({\n\t\t\t\t[customClass]: variant.includes('custom') && customClass.length > 0,\n\t\t\t\t[classNameFromVariant(variant, 'link')]: variant.length > 0,\n\t\t\t})}\n\t\t\tmodifiers={{\n\t\t\t\tdisabled: disabled === true,\n\t\t\t\t'external-link': isExternal,\n\t\t\t\t'hide-label': hideLabel === true,\n\t\t\t\tinline: inline === true,\n\t\t\t\tstandalone: inline === false,\n\t\t\t}}\n\t\t>\n\t\t\t{/* eslint-disable-next-line jsx-a11y/click-events-have-key-events -- <a href> is natively keyboard-accessible (Enter triggers click); onKeyPress would cause a double-dispatch bug. */}\n\t\t\t<a\n\t\t\t\tref={refAnchor}\n\t\t\t\t{...tagAttrs}\n\t\t\t\taccessKey={accessKey || undefined}\n\t\t\t\taria-current={ariaCurrent || undefined}\n\t\t\t\taria-controls={ariaControls || undefined}\n\t\t\t\taria-describedby={trimmedAriaDescription ? ariaDescriptionId : undefined}\n\t\t\t\taria-disabled={disabled ? 'true' : undefined}\n\t\t\t\taria-expanded={ariaExpanded === '' ? undefined : ariaExpanded}\n\t\t\t\taria-owns={ariaOwns || undefined}\n\t\t\t\taria-label={hideLabel && typeof label === 'string' ? `${label}${isExternal ? ` (${translateOpenLinkInTab})` : ''}` : undefined}\n\t\t\t\taria-keyshortcuts={shortKey || undefined}\n\t\t\t\tclass=\"kol-link__anchor\"\n\t\t\t\t{...on}\n\t\t\t\tonClick={handleAnchorClick}\n\t\t\t\trole={roleValue}\n\t\t\t\ttabIndex={disabled ? -1 : tabIndex}\n\t\t\t>\n\t\t\t\t<SpanFC class=\"kol-link__text\" badgeText={accessKey || shortKey} icons={icons} hideLabel={hideLabel} label={expertSlot ? '' : label || href}>\n\t\t\t\t\t<slot name=\"expert\" slot=\"expert\"></slot>\n\t\t\t\t</SpanFC>\n\t\t\t\t{isExternal && (\n\t\t\t\t\t<IconFC class=\"kol-link__icon\" label={hideLabel ? '' : translateOpenLinkInTab} icons={'kolicon-link-external'} aria-hidden={hideLabel} />\n\t\t\t\t)}\n\t\t\t</a>\n\t\t\t{hideLabel === true && !expertSlot && (\n\t\t\t\t<div class=\"kol-link__tooltip\">\n\t\t\t\t\t<TooltipFC\n\t\t\t\t\t\tbadgeText={accessKey || shortKey || ''}\n\t\t\t\t\t\tlabel={typeof label === 'string' ? label : typeof href === 'string' ? href : ''}\n\t\t\t\t\t\trefFloating={refTooltip}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t{trimmedAriaDescription && (\n\t\t\t\t<span class=\"visually-hidden\" id={ariaDescriptionId}>\n\t\t\t\t\t{trimmedAriaDescription}\n\t\t\t\t</span>\n\t\t\t)}\n\t\t</BemRootNodeFC>\n\t);\n};\n"]}
+{"version":3,"file":"component.js","sourceRoot":"","sources":["../../../../src/internal/functional-components/link/component.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { FunctionalComponent as FC } from '@stencil/core';\nimport { h } from '@stencil/core';\n\nimport { translate } from '../../../i18n';\nimport { devHint } from '../../../schema';\nimport { classNameFromVariant } from '../../../schema/props/variant-class-name';\nimport clsx from '../../../utils/clsx';\nimport { BemRootNodeFC } from '../bem-root-node/component';\nimport type { FunctionalComponentProps } from '../generic-types';\nimport { IconFC } from '../icon/component';\nimport { SpanFC } from '../span/component';\nimport { TooltipFC } from '../tooltip/component';\nimport type { LinkApi } from './api';\n\nexport const LinkFC: FC<FunctionalComponentProps<LinkApi>> = (props) => {\n\tconst {\n\t\taccessKey,\n\t\tariaControls,\n\t\tariaCurrent,\n\t\tariaDescription,\n\t\tariaDescriptionId,\n\t\tariaExpanded,\n\t\tariaOwns,\n\t\tcustomClass,\n\t\tdisabled,\n\t\tdownload,\n\t\thandleAnchorClick,\n\t\thideLabel,\n\t\thref,\n\t\ticons,\n\t\tinline,\n\t\tlabel,\n\t\ton,\n\t\trefAnchor,\n\t\trefTooltip,\n\t\trole,\n\t\tshortKey,\n\t\ttabIndex,\n\t\ttarget,\n\t\tvariant,\n\t\texpertSlot,\n\t} = props;\n\n\tconst translateOpenLinkInTab = translate('kol-open-link-in-tab');\n\n\tconst isExternal = typeof target === 'string' && target.length > 0 && target !== '_self';\n\n\tconst tagAttrs = {\n\t\thref: typeof href === 'string' && href.length > 0 ? href : 'javascript:void(0);',\n\t\ttarget: typeof target === 'string' && target.length > 0 ? target : undefined,\n\t\trel: isExternal ? 'noopener' : undefined,\n\t\t// `download` is a presence attribute: an explicitly empty string means \"download without a\n\t\t// suggested filename\" and must render as `download=\"\"`, unlike an unset download.\n\t\tdownload: typeof download === 'string' ? download : undefined,\n\t};\n\n\tif (hideLabel === true && !label) {\n\t\tdevHint(`[KolLink] An aria-label must be set when _hide-label is set.`);\n\t}\n\n\tconst trimmedAriaDescription = ariaDescription?.trim();\n\tconst roleValue = role || undefined;\n\treturn (\n\t\t<BemRootNodeFC\n\t\t\tblock=\"kol-link\"\n\t\t\tclass={clsx({\n\t\t\t\t[customClass]: variant.includes('custom') && customClass.length > 0,\n\t\t\t\t[classNameFromVariant(variant, 'link')]: variant.length > 0,\n\t\t\t})}\n\t\t\tmodifiers={{\n\t\t\t\tdisabled: disabled === true,\n\t\t\t\t'external-link': isExternal,\n\t\t\t\t'hide-label': hideLabel === true,\n\t\t\t\tinline: inline === true,\n\t\t\t\tstandalone: inline === false,\n\t\t\t}}\n\t\t>\n\t\t\t{/* eslint-disable-next-line jsx-a11y/click-events-have-key-events -- <a href> is natively keyboard-accessible (Enter triggers click); onKeyPress would cause a double-dispatch bug. */}\n\t\t\t<a\n\t\t\t\tref={refAnchor}\n\t\t\t\t{...tagAttrs}\n\t\t\t\taccessKey={accessKey || undefined}\n\t\t\t\taria-current={ariaCurrent || undefined}\n\t\t\t\taria-controls={ariaControls || undefined}\n\t\t\t\taria-describedby={trimmedAriaDescription ? ariaDescriptionId : undefined}\n\t\t\t\taria-disabled={disabled ? 'true' : undefined}\n\t\t\t\taria-expanded={ariaExpanded === '' ? undefined : ariaExpanded}\n\t\t\t\taria-owns={ariaOwns || undefined}\n\t\t\t\taria-label={hideLabel && typeof label === 'string' ? `${label}${isExternal ? ` (${translateOpenLinkInTab})` : ''}` : undefined}\n\t\t\t\taria-keyshortcuts={shortKey || undefined}\n\t\t\t\tclass=\"kol-link__anchor\"\n\t\t\t\t{...on}\n\t\t\t\tonClick={handleAnchorClick}\n\t\t\t\trole={roleValue}\n\t\t\t\ttabIndex={disabled ? -1 : tabIndex}\n\t\t\t>\n\t\t\t\t<SpanFC class=\"kol-link__text\" badgeText={accessKey || shortKey} icons={icons} hideLabel={hideLabel} label={expertSlot ? '' : label || href}>\n\t\t\t\t\t<slot name=\"expert\" slot=\"expert\"></slot>\n\t\t\t\t</SpanFC>\n\t\t\t\t{isExternal && (\n\t\t\t\t\t<IconFC class=\"kol-link__icon\" label={hideLabel ? '' : translateOpenLinkInTab} icons={'kolicon-link-external'} aria-hidden={hideLabel} />\n\t\t\t\t)}\n\t\t\t</a>\n\t\t\t{hideLabel === true && !expertSlot && (\n\t\t\t\t<div class=\"kol-link__tooltip\">\n\t\t\t\t\t<TooltipFC\n\t\t\t\t\t\tbadgeText={accessKey || shortKey || ''}\n\t\t\t\t\t\tlabel={typeof label === 'string' ? label : typeof href === 'string' ? href : ''}\n\t\t\t\t\t\trefFloating={refTooltip}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t)}\n\t\t\t{trimmedAriaDescription && (\n\t\t\t\t<span class=\"visually-hidden\" id={ariaDescriptionId}>\n\t\t\t\t\t{trimmedAriaDescription}\n\t\t\t\t</span>\n\t\t\t)}\n\t\t</BemRootNodeFC>\n\t);\n};\n"]}

package/dist/collection/internal/props/download.js

@@ -3,5 +3,5 @@
  */
 import { createPropDefinition } from "./helpers/factory";
 import { normalizeString } from "./helpers/normalizers";
-export const downloadProp = createPropDefinition('download', '', normalizeString);
+export const downloadProp = createPropDefinition('download', undefined, normalizeString);
 //# sourceMappingURL=download.js.map

package/dist/collection/internal/props/download.js.map

@@ -1 +1 @@
-{"version":3,"file":"download.js","sourceRoot":"","sources":["../../../src/internal/props/download.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AACzD,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAGxD,MAAM,CAAC,MAAM,YAAY,GAAG,oBAAoB,CAAe,UAAU,EAAE,EAAE,EAAE,eAAe,CAAC,CAAC","sourcesContent":["import type { SimpleProp } from './helpers/factory';\nimport { createPropDefinition } from './helpers/factory';\nimport { normalizeString } from './helpers/normalizers';\n\nexport type DownloadProp = SimpleProp<'download', string>;\nexport const downloadProp = createPropDefinition<DownloadProp>('download', '', normalizeString);\n"]}
+{"version":3,"file":"download.js","sourceRoot":"","sources":["../../../src/internal/props/download.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AACzD,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAOxD,MAAM,CAAC,MAAM,YAAY,GAAG,oBAAoB,CAAe,UAAU,EAAE,SAA8B,EAAE,eAAe,CAAC,CAAC","sourcesContent":["import type { SimpleProp } from './helpers/factory';\nimport { createPropDefinition } from './helpers/factory';\nimport { normalizeString } from './helpers/normalizers';\n\nexport type DownloadProp = SimpleProp<'download', string>;\n// The default is `undefined` (not `''` like other string props) to keep \"not set\" distinguishable\n// from \"explicitly empty\": `download` is a presence attribute, so `_download=\"\"` must render as\n// `download=\"\"` (download without a suggested filename) while an unset `_download` must not\n// render the attribute at all.\nexport const downloadProp = createPropDefinition<DownloadProp>('download', undefined as unknown as string, normalizeString);\n"]}