@public-ui/components 4.5.0-rc.8 → 4.5.0

package/dist/cjs/kol-tooltip-wc.cjs.entry.js

@@ -3,20 +3,20 @@
  */
 'use strict';
 
-var index = require('./index-RAfZF5x0.js');
+var index = require('./index-CjTDipy9.js');
 var baseWebComponent = require('./base-web-component-DK5Y-vq5.js');
 var behavior = require('./behavior-DMhnAIvG.js');
-var component = require('./component-Dw6Tq7Wb.js');
+var component = require('./component-B92xMW4N.js');
 require('./common-B9-LvLNa.js');
 require('./isArray-BOIOdEQh.js');
 require('./tooltip-open-tracking-Ba0udJRU.js');
 require('./align-B87Zdyn2.js');
 require('./label-DVnpZWVb.js');
-require('./component-Dd-PS3jp.js');
+require('./component-K9JCKLMC.js');
 require('./tslib.es6-Cm0ytgPY.js');
 require('./bem-registry-BDVdt6ar.js');
 require('./clsx-Bm_HQUnh.js');
-require('./component-3EZdZbDH.js');
+require('./component-BGdViN9u.js');
 
 const KolTooltipWc = class {
     constructor(hostRef) {

package/dist/cjs/kol-tree-item.cjs.entry.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-RAfZF5x0.js');
+var index = require('./index-CjTDipy9.js');
 var tslib_es6 = require('./tslib.es6-Cm0ytgPY.js');
 var componentNames = require('./component-names-EMVnNhTP.js');
 var baseWebComponent = require('./base-web-component-DK5Y-vq5.js');
@@ -11,10 +11,10 @@ require('./common-B9-LvLNa.js');
 var href = require('./href-C20g573P.js');
 var labelWithExpertSlot = require('./label-with-expert-slot-BE6OwnkL.js');
 var bemRegistry = require('./bem-registry-BDVdt6ar.js');
-var component = require('./component-3EZdZbDH.js');
-var api = require('./api-BDT5xkx5.js');
+var component = require('./component-BGdViN9u.js');
+var api = require('./api-kNqVTMqf.js');
 var open = require('./open-XeILuCji.js');
-var dev_utils = require('./dev.utils-DybQ4euF.js');
+var dev_utils = require('./dev.utils-CIsKrkDZ.js');
 var elementInteraction = require('./element-interaction-7FI_z19L.js');
 var events = require('./events-PISRnO5c.js');
 var ariaCurrentService = require('./ariaCurrentService-3051l6MI.js');
@@ -23,11 +23,11 @@ require('./isArray-BOIOdEQh.js');
 require('./clsx-Bm_HQUnh.js');
 require('./i18n-UGaB-Dwg.js');
 require('./i18n-B6c-GdHR.js');
-require('./component-CAkixzEQ.js');
-require('./component-Du98sklA.js');
+require('./component-C8WDkeRK.js');
+require('./component-CESKZB76.js');
 require('./block-bem-D7PDS6kC.js');
-require('./component-Dd-PS3jp.js');
-require('./component-Dw6Tq7Wb.js');
+require('./component-K9JCKLMC.js');
+require('./component-B92xMW4N.js');
 require('./variant-wdbSxe--.js');
 require('./align-B87Zdyn2.js');
 require('./disabled-B8tOrtj_.js');
@@ -53,7 +53,7 @@ const LINK_DEFAULTS = Object.freeze(baseWebComponent.buildDefaultPropsFromConfig
 const noop = () => undefined;
 const TreeItemFC = ({ active, ariaCurrent, groupId, handleAnchorClick, handleSlotchange, handleToggleClick, hasChildren, href, label, level, open, refAnchor, }) => (index.h("li", { class: BEM_CLASS_TREE_ITEM, role: "none", style: { '--level': `${level}` } }, index.h("span", { class: treeItemBem('link', { active, 'first-level': level === 0 }) }, index.h(api.LinkFC, Object.assign({}, LINK_DEFAULTS, { ariaCurrent: ariaCurrent, ariaDescriptionId: "", ariaExpanded: hasChildren ? (open ? 'true' : 'false') : '', ariaOwns: hasChildren ? groupId : '', expertSlot: true, handleAnchorClick: handleAnchorClick, href: href, label: "", refAnchor: refAnchor, refTooltip: noop, role: "treeitem", tabIndex: active ? 0 : -1 }), index.h("span", { class: BEM_CLASS_TREE_ITEM__LINK_INNER }, hasChildren ? (index.h("span", { class: BEM_CLASS_TREE_ITEM__TOGGLE_BUTTON, onClick: handleToggleClick }, index.h(component.IconFC, { class: BEM_CLASS_TREE_ITEM__TOGGLE_BUTTON_ICON, icons: `kolicon kolicon-${open ? 'chevron-down' : 'chevron-right'}`, label: '' }))) : (index.h("span", { class: BEM_CLASS_TREE_ITEM__TOGGLE_BUTTON_PLACEHOLDER })), index.h("span", { class: BEM_CLASS_TREE_ITEM__TEXT }, label)))), index.h("ul", { class: BEM_CLASS_TREE_ITEM__CHILDREN, hidden: !hasChildren || !open, role: "group", id: groupId }, index.h("slot", { onSlotchange: handleSlotchange }))));
 
-const defaultStyleCss = "@charset \"UTF-8\";\n/* forward the rem function */\n/*\n * Guards an interaction rule (`:hover`, `:active`, `:focus…`) against the disabled state.\n *\n * Two shapes are needed because the disabled marker sits on different elements: a native control\n * carries `disabled`, an anchor or summary carries `aria-disabled`, and a BEM wrapper carries a\n * `--disabled` modifier while its inner control carries the attribute.\n */\n/* Wrapper variant: asks the interactive element inside, which is where the attribute lives. */\n/*\n* This file defines the layer order for all CSS layers used in KoliBri.\n* The order is important as it determines the cascade priority.\n*\n* Layer order (lowest to highest priority):\n* 1. kol-a11y - Accessibility defaults and requirements\n* 2. kol-global - Global component styles and resets\n* 3. kol-component - Component-specific styles\n* 4. kol-theme-global - Theme-specific global styles\n* 5. kol-theme-component - Theme-specific component styles\n* 6. kol-forced-colors - Defaults for forced colors and high contrast modes\n* 7. kol-theme-forced-colors - Theme-specific styles for forced colors and high contrast modes\n*/\n@layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors;\n/*\n * This file contains all rules for accessibility.\n */\n@layer kol-a11y {\n  :host {\n    /*\n     * Minimum size of interactive elements.\n     *\n     * The `max(…, 44px)` floor guarantees the WCAG 2.5.5 (AAA) target size of 44px:\n     * `to-rem(44)` runs the value through a `calc()` rem round-trip which can lose\n     * sub-pixel precision and resolve to e.g. 43.99px depending on the browser's\n     * rounding, dropping just below the required minimum.\n     */\n    --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px);\n    /*\n     * No element should be used without verifying the contrast ratio of its background and font colors.\n     * By initially setting the background color to white and the font color to black,\n     * the contrast ratio is ensured and explicit adjustment is forced.\n     */\n    --kol-a11y-font-color: black;\n    --kol-a11y-background-color: white;\n    color: var(--kol-a11y-font-color);\n    background-color: var(--kol-a11y-background-color);\n    /*\n     * Verdana is an accessible font that can be used without requiring additional loading time.\n     */\n    --kol-a11y-font-family: Verdana;\n    font-family: var(--kol-a11y-font-family);\n    /*\n     * Letter spacing is required for all texts.\n     */\n    letter-spacing: inherit;\n    /*\n     * Word spacing is required for all texts.\n     */\n    word-spacing: inherit;\n    /*\n     * Text should be aligned left by default to provide a predictable starting point.\n     */\n    text-align: left;\n  }\n  * {\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    hyphens: auto;\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    word-break: break-word;\n  }\n  /*\n   * All interactive elements should have a minimum size of to-rem(44).\n   */\n  /* input:not([type='checkbox'], [type='radio'], [type='range']), */\n  /* option, */\n  /* select, */\n  /* textarea, */\n  button,\n  .kol-input .input {\n    min-width: var(--a11y-min-size);\n    min-height: var(--a11y-min-size);\n  }\n  /*\n   * Some interactive elements should not inherit the font-family and font-size.\n   */\n  a,\n  button,\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6,\n  input,\n  option,\n  select,\n  textarea {\n    /*\n     * All elements should inherit the text color from his parent element.\n     */\n    color: inherit;\n    /*\n     * All elements should inherit the font family from his parent element.\n     */\n    font-family: inherit;\n    /*\n     * All elements should inherit the font size from his parent element.\n     */\n    font-size: inherit;\n    /*\n     * Letter spacing is required for all texts.\n     */\n    letter-spacing: inherit;\n    /*\n     * Word spacing is required for all texts.\n     */\n    word-spacing: inherit;\n  }\n  /**\n  * Sometimes we need the semantic element for accessibility reasons,\n  * but we don't want to show it.\n  *\n  * - https://www.a11yproject.com/posts/how-to-hide-content/\n  */\n  .visually-hidden {\n    position: fixed;\n    top: 0;\n    left: 0;\n    width: 1px;\n    height: 1px;\n    overflow: hidden;\n    white-space: nowrap;\n    clip-path: inset(50%);\n  }\n}\n/*\n * This file contains all rules for forced-colors and highcontrast modes\n * https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Values/system-color to see all color keywords the browsers are providing\n */\n@layer kol-forced-colors {\n  @media (forced-colors: active) {\n    .kol-button__text {\n      color: ButtonText;\n      background-color: ButtonFace;\n      border: 2px solid ButtonBorder;\n    }\n    .kol-button--disabled .kol-button__text {\n      color: GrayText;\n      border-color: GrayText;\n    }\n    /*\n     * Forced colors drop author colors, so the only way a disabled control still reads as\n     * disabled is the `GrayText` system color. `kol-button` had it; the controls whose disabled\n     * state is `aria-disabled` (anchor, summary) and the native form controls did not.\n     */\n    .kol-link__interactive-element[aria-disabled=true],\n    .kol-accordion__heading[aria-disabled=true],\n    .kol-details__heading[aria-disabled=true] {\n      color: GrayText;\n    }\n    .kol-link__interactive-element[aria-disabled=true] .kol-icon,\n    .kol-link__interactive-element[aria-disabled=true] .kol-span__label,\n    .kol-accordion__heading[aria-disabled=true] .kol-icon,\n    .kol-accordion__heading[aria-disabled=true] .kol-span__label,\n    .kol-details__heading[aria-disabled=true] .kol-icon,\n    .kol-details__heading[aria-disabled=true] .kol-span__label {\n      color: GrayText;\n    }\n    input:disabled,\n    select:disabled,\n    textarea:disabled {\n      color: GrayText;\n      border-color: GrayText;\n    }\n    .kol-card,\n    .kol-dialog,\n    .kol-modal {\n      color: CanvasText;\n      background-color: Canvas;\n      border: 1px solid ButtonBorder;\n    }\n    .kol-pagination__button--selected .kol-button {\n      opacity: 1;\n    }\n    .kol-pagination__button--selected .kol-button__text {\n      color: SelectedItemText;\n      background-color: SelectedItem;\n    }\n    /* focus styles */\n    .kol-button__interactive-element:focus-visible,\n    .kol-link__interactive-element:focus-visible {\n      outline: 2px solid Highlight;\n      outline-offset: 2px;\n    }\n  }\n}\n@layer kol-global {\n  /*\n   * Dieses CSS stellt sicher, dass der Standard-Style\n   * von A und Button resettet werden.\n   */\n  :is(a, button) {\n    background-color: transparent;\n    width: 100%;\n    margin: 0;\n    padding: 0;\n    border: none;\n    /* 100% needed for custom width from outside */\n  }\n  /*\n   * Ensure elements with hidden attribute to be actually not visible\n   * @see https://meowni.ca/hidden.is.a.lie.html\n   */\n  [hidden] {\n    display: none !important;\n  }\n  .badge-text-hint {\n    color: black;\n    background-color: white;\n  }\n}\n@layer kol-global {\n  :host {\n    /*\n     * The max-width is needed to prevent the table from overflowing the\n     * parent node, if the table is wider than the parent node.\n     */\n    max-width: 100%;\n    font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n  }\n  * {\n    /*\n     * We prefer to box-sizing: border-box for all elements.\n     */\n    box-sizing: border-box;\n  }\n  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: flex;\n    flex-flow: column;\n    align-items: center;\n    justify-content: center;\n    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  }\n  .kol-span__container {\n    display: flex;\n    align-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  .kol-span .kol-span__label--hide-label .kol-span__label {\n    display: none;\n  }\n  /* Reset browser agent style. */\n  button:disabled {\n    color: unset;\n  }\n  /* A disabled `fieldset` only groups its controls; `cursor` is inherited and would reach the\n     operable info popover in its legend. */\n  .disabled label,\n  .disabled:focus-within label,\n  [aria-disabled=true],\n  [aria-disabled=true]:focus,\n  [disabled]:where(:not(fieldset)),\n  [disabled]:where(:not(fieldset)):focus {\n    outline: none;\n    cursor: not-allowed;\n  }\n  [aria-disabled=true]:focus .kol-span,\n  [disabled]:focus .kol-span {\n    outline: none !important;\n  }\n  .hastooltip {\n    z-index: 900 !important;\n  }\n}\n@font-face {\n  font-family: \"kolicons\";\n  src: url(\"kolicons.eot?t=1791539188494\"); /* IE9*/\n  src: url(\"kolicons.eot?t=1791539188494#iefix\") format(\"embedded-opentype\"), url(\"kolicons.woff2?t=1791539188494\") format(\"woff2\"), url(\"kolicons.woff?t=1791539188494\") format(\"woff\"), url(\"kolicons.ttf?t=1791539188494\") format(\"truetype\"), url(\"kolicons.svg?t=1791539188494#kolicons\") format(\"svg\"); /* iOS 4.1- */\n}\n@layer kol-component {\n  [class^=kolicon-], [class*=\" kolicon-\"] {\n    font-family: \"kolicons\";\n    font-style: normal;\n    font-weight: 400;\n    line-height: 1em;\n    -webkit-font-smoothing: antialiased;\n    -moz-osx-font-smoothing: grayscale;\n  }\n  .kolicon-alert-error::before {\n    content: \"\\ea01\";\n  }\n  .kolicon-alert-info::before {\n    content: \"\\ea02\";\n  }\n  .kolicon-alert-success::before {\n    content: \"\\ea03\";\n  }\n  .kolicon-alert-warning::before {\n    content: \"\\ea04\";\n  }\n  .kolicon-check::before {\n    content: \"\\ea05\";\n  }\n  .kolicon-chevron-double-left::before {\n    content: \"\\ea06\";\n  }\n  .kolicon-chevron-double-right::before {\n    content: \"\\ea07\";\n  }\n  .kolicon-chevron-down::before {\n    content: \"\\ea08\";\n  }\n  .kolicon-chevron-left::before {\n    content: \"\\ea09\";\n  }\n  .kolicon-chevron-right::before {\n    content: \"\\ea0a\";\n  }\n  .kolicon-chevron-up::before {\n    content: \"\\ea0b\";\n  }\n  .kolicon-cogwheel::before {\n    content: \"\\ea0c\";\n  }\n  .kolicon-cross::before {\n    content: \"\\ea0d\";\n  }\n  .kolicon-eye-closed::before {\n    content: \"\\ea0e\";\n  }\n  .kolicon-eye::before {\n    content: \"\\ea0f\";\n  }\n  .kolicon-house::before {\n    content: \"\\ea10\";\n  }\n  .kolicon-kolibri::before {\n    content: \"\\ea11\";\n  }\n  .kolicon-link-external::before {\n    content: \"\\ea12\";\n  }\n  .kolicon-link::before {\n    content: \"\\ea13\";\n  }\n  .kolicon-minus::before {\n    content: \"\\ea14\";\n  }\n  .kolicon-pin-pinned::before {\n    content: \"\\ea15\";\n  }\n  .kolicon-pin-unpinned::before {\n    content: \"\\ea16\";\n  }\n  .kolicon-plus::before {\n    content: \"\\ea17\";\n  }\n  .kolicon-settings::before {\n    content: \"\\ea18\";\n  }\n  .kolicon-sort-asc::before {\n    content: \"\\ea19\";\n  }\n  .kolicon-sort-desc::before {\n    content: \"\\ea1a\";\n  }\n  .kolicon-sort-neutral::before {\n    content: \"\\ea1b\";\n  }\n  .kolicon-up::before {\n    content: \"\\ea1c\";\n  }\n  .kolicon-version::before {\n    content: \"\\ea1d\";\n  }\n}\n@layer kol-component {\n  .kol-icon {\n    color: inherit;\n    display: inline-block;\n    font-size: inherit;\n    font-weight: inherit;\n    line-height: inherit;\n  }\n  .kol-tree-item__link .kol-link {\n    display: inline-flex;\n    width: 100%;\n    min-height: var(--a11y-min-size);\n    align-items: center;\n    text-decoration: none;\n    /* The interactive element inside the link skeleton carries the UA default underline\n       itself and replaces the former full-width anchor, so it has to fill the wrapper. */\n  }\n  .kol-tree-item__link .kol-link__interactive-element {\n    flex: 1 1 auto;\n    text-decoration: none;\n  }\n  .kol-tree-item__link-inner {\n    display: flex;\n    align-items: center;\n  }\n  .kol-tree-item__children {\n    margin: 0;\n    padding: 0;\n    list-style: none;\n  }\n  .kol-tree-item .kol-span {\n    place-items: unset;\n  }\n  .kol-tree-item__toggle-button, .kol-tree-item__toggle-button-placeholder {\n    display: inline-flex;\n    min-width: var(--a11y-min-size);\n    min-height: var(--a11y-min-size);\n    align-items: center;\n    justify-content: center;\n  }\n  .kol-tree-item__text {\n    text-decoration: underline;\n  }\n}";
+const defaultStyleCss = "@charset \"UTF-8\";\n/* forward the rem function */\n/*\n * Guards an interaction rule (`:hover`, `:active`, `:focus…`) against the disabled state.\n *\n * Two shapes are needed because the disabled marker sits on different elements: a native control\n * carries `disabled`, an anchor or summary carries `aria-disabled`, and a BEM wrapper carries a\n * `--disabled` modifier while its inner control carries the attribute.\n */\n/* Wrapper variant: asks the interactive element inside, which is where the attribute lives. */\n/*\n* This file defines the layer order for all CSS layers used in KoliBri.\n* The order is important as it determines the cascade priority.\n*\n* Layer order (lowest to highest priority):\n* 1. kol-a11y - Accessibility defaults and requirements\n* 2. kol-global - Global component styles and resets\n* 3. kol-component - Component-specific styles\n* 4. kol-theme-global - Theme-specific global styles\n* 5. kol-theme-component - Theme-specific component styles\n* 6. kol-forced-colors - Defaults for forced colors and high contrast modes\n* 7. kol-theme-forced-colors - Theme-specific styles for forced colors and high contrast modes\n*/\n@layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors;\n/*\n * This file contains all rules for accessibility.\n */\n@layer kol-a11y {\n  :host {\n    /*\n     * Minimum size of interactive elements.\n     *\n     * The `max(…, 44px)` floor guarantees the WCAG 2.5.5 (AAA) target size of 44px:\n     * `to-rem(44)` runs the value through a `calc()` rem round-trip which can lose\n     * sub-pixel precision and resolve to e.g. 43.99px depending on the browser's\n     * rounding, dropping just below the required minimum.\n     */\n    --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px);\n    /*\n     * No element should be used without verifying the contrast ratio of its background and font colors.\n     * By initially setting the background color to white and the font color to black,\n     * the contrast ratio is ensured and explicit adjustment is forced.\n     */\n    --kol-a11y-font-color: black;\n    --kol-a11y-background-color: white;\n    color: var(--kol-a11y-font-color);\n    background-color: var(--kol-a11y-background-color);\n    /*\n     * Verdana is an accessible font that can be used without requiring additional loading time.\n     */\n    --kol-a11y-font-family: Verdana;\n    font-family: var(--kol-a11y-font-family);\n    /*\n     * Letter spacing is required for all texts.\n     */\n    letter-spacing: inherit;\n    /*\n     * Word spacing is required for all texts.\n     */\n    word-spacing: inherit;\n    /*\n     * Text should be aligned left by default to provide a predictable starting point.\n     */\n    text-align: left;\n  }\n  * {\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    hyphens: auto;\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    word-break: break-word;\n  }\n  /*\n   * All interactive elements should have a minimum size of to-rem(44).\n   */\n  /* input:not([type='checkbox'], [type='radio'], [type='range']), */\n  /* option, */\n  /* select, */\n  /* textarea, */\n  button,\n  .kol-input .input {\n    min-width: var(--a11y-min-size);\n    min-height: var(--a11y-min-size);\n  }\n  /*\n   * Some interactive elements should not inherit the font-family and font-size.\n   */\n  a,\n  button,\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6,\n  input,\n  option,\n  select,\n  textarea {\n    /*\n     * All elements should inherit the text color from his parent element.\n     */\n    color: inherit;\n    /*\n     * All elements should inherit the font family from his parent element.\n     */\n    font-family: inherit;\n    /*\n     * All elements should inherit the font size from his parent element.\n     */\n    font-size: inherit;\n    /*\n     * Letter spacing is required for all texts.\n     */\n    letter-spacing: inherit;\n    /*\n     * Word spacing is required for all texts.\n     */\n    word-spacing: inherit;\n  }\n  /**\n  * Sometimes we need the semantic element for accessibility reasons,\n  * but we don't want to show it.\n  *\n  * - https://www.a11yproject.com/posts/how-to-hide-content/\n  */\n  .visually-hidden {\n    position: fixed;\n    top: 0;\n    left: 0;\n    width: 1px;\n    height: 1px;\n    overflow: hidden;\n    white-space: nowrap;\n    clip-path: inset(50%);\n  }\n}\n/*\n * This file contains all rules for forced-colors and highcontrast modes\n * https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Values/system-color to see all color keywords the browsers are providing\n */\n@layer kol-forced-colors {\n  @media (forced-colors: active) {\n    .kol-button__text {\n      color: ButtonText;\n      background-color: ButtonFace;\n      border: 2px solid ButtonBorder;\n    }\n    .kol-button--disabled .kol-button__text {\n      color: GrayText;\n      border-color: GrayText;\n    }\n    /*\n     * Forced colors drop author colors, so the only way a disabled control still reads as\n     * disabled is the `GrayText` system color. `kol-button` had it; the controls whose disabled\n     * state is `aria-disabled` (anchor, summary) and the native form controls did not.\n     */\n    .kol-link__interactive-element[aria-disabled=true],\n    .kol-accordion__heading[aria-disabled=true],\n    .kol-details__heading[aria-disabled=true] {\n      color: GrayText;\n    }\n    .kol-link__interactive-element[aria-disabled=true] .kol-icon,\n    .kol-link__interactive-element[aria-disabled=true] .kol-span__label,\n    .kol-accordion__heading[aria-disabled=true] .kol-icon,\n    .kol-accordion__heading[aria-disabled=true] .kol-span__label,\n    .kol-details__heading[aria-disabled=true] .kol-icon,\n    .kol-details__heading[aria-disabled=true] .kol-span__label {\n      color: GrayText;\n    }\n    input:disabled,\n    select:disabled,\n    textarea:disabled {\n      color: GrayText;\n      border-color: GrayText;\n    }\n    .kol-card,\n    .kol-dialog,\n    .kol-modal {\n      color: CanvasText;\n      background-color: Canvas;\n      border: 1px solid ButtonBorder;\n    }\n    .kol-pagination__button--selected .kol-button {\n      opacity: 1;\n    }\n    .kol-pagination__button--selected .kol-button__text {\n      color: SelectedItemText;\n      background-color: SelectedItem;\n    }\n    /* focus styles */\n    .kol-button__interactive-element:focus-visible,\n    .kol-link__interactive-element:focus-visible {\n      outline: 2px solid Highlight;\n      outline-offset: 2px;\n    }\n  }\n}\n@layer kol-global {\n  /*\n   * Dieses CSS stellt sicher, dass der Standard-Style\n   * von A und Button resettet werden.\n   */\n  :is(a, button) {\n    background-color: transparent;\n    width: 100%;\n    margin: 0;\n    padding: 0;\n    border: none;\n    /* 100% needed for custom width from outside */\n  }\n  /*\n   * Ensure elements with hidden attribute to be actually not visible\n   * @see https://meowni.ca/hidden.is.a.lie.html\n   */\n  [hidden] {\n    display: none !important;\n  }\n  .badge-text-hint {\n    color: black;\n    background-color: white;\n  }\n}\n@layer kol-global {\n  :host {\n    /*\n     * The max-width is needed to prevent the table from overflowing the\n     * parent node, if the table is wider than the parent node.\n     */\n    max-width: 100%;\n    font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n  }\n  * {\n    /*\n     * We prefer to box-sizing: border-box for all elements.\n     */\n    box-sizing: border-box;\n  }\n  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: flex;\n    flex-flow: column;\n    align-items: center;\n    justify-content: center;\n    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  }\n  .kol-span__container {\n    display: flex;\n    align-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  .kol-span .kol-span__label--hide-label .kol-span__label {\n    display: none;\n  }\n  /* Reset browser agent style. */\n  button:disabled {\n    color: unset;\n  }\n  /* A disabled `fieldset` only groups its controls; `cursor` is inherited and would reach the\n     operable info popover in its legend. */\n  .disabled label,\n  .disabled:focus-within label,\n  [aria-disabled=true],\n  [aria-disabled=true]:focus,\n  [disabled]:where(:not(fieldset)),\n  [disabled]:where(:not(fieldset)):focus {\n    outline: none;\n    cursor: not-allowed;\n  }\n  [aria-disabled=true]:focus .kol-span,\n  [disabled]:focus .kol-span {\n    outline: none !important;\n  }\n  .hastooltip {\n    z-index: 900 !important;\n  }\n}\n@font-face {\n  font-family: \"kolicons\";\n  src: url(\"kolicons.eot?t=1791544630279\"); /* IE9*/\n  src: url(\"kolicons.eot?t=1791544630279#iefix\") format(\"embedded-opentype\"), url(\"kolicons.woff2?t=1791544630279\") format(\"woff2\"), url(\"kolicons.woff?t=1791544630279\") format(\"woff\"), url(\"kolicons.ttf?t=1791544630279\") format(\"truetype\"), url(\"kolicons.svg?t=1791544630279#kolicons\") format(\"svg\"); /* iOS 4.1- */\n}\n@layer kol-component {\n  [class^=kolicon-], [class*=\" kolicon-\"] {\n    font-family: \"kolicons\";\n    font-style: normal;\n    font-weight: 400;\n    line-height: 1em;\n    -webkit-font-smoothing: antialiased;\n    -moz-osx-font-smoothing: grayscale;\n  }\n  .kolicon-alert-error::before {\n    content: \"\\ea01\";\n  }\n  .kolicon-alert-info::before {\n    content: \"\\ea02\";\n  }\n  .kolicon-alert-success::before {\n    content: \"\\ea03\";\n  }\n  .kolicon-alert-warning::before {\n    content: \"\\ea04\";\n  }\n  .kolicon-check::before {\n    content: \"\\ea05\";\n  }\n  .kolicon-chevron-double-left::before {\n    content: \"\\ea06\";\n  }\n  .kolicon-chevron-double-right::before {\n    content: \"\\ea07\";\n  }\n  .kolicon-chevron-down::before {\n    content: \"\\ea08\";\n  }\n  .kolicon-chevron-left::before {\n    content: \"\\ea09\";\n  }\n  .kolicon-chevron-right::before {\n    content: \"\\ea0a\";\n  }\n  .kolicon-chevron-up::before {\n    content: \"\\ea0b\";\n  }\n  .kolicon-cogwheel::before {\n    content: \"\\ea0c\";\n  }\n  .kolicon-cross::before {\n    content: \"\\ea0d\";\n  }\n  .kolicon-eye-closed::before {\n    content: \"\\ea0e\";\n  }\n  .kolicon-eye::before {\n    content: \"\\ea0f\";\n  }\n  .kolicon-house::before {\n    content: \"\\ea10\";\n  }\n  .kolicon-kolibri::before {\n    content: \"\\ea11\";\n  }\n  .kolicon-link-external::before {\n    content: \"\\ea12\";\n  }\n  .kolicon-link::before {\n    content: \"\\ea13\";\n  }\n  .kolicon-minus::before {\n    content: \"\\ea14\";\n  }\n  .kolicon-pin-pinned::before {\n    content: \"\\ea15\";\n  }\n  .kolicon-pin-unpinned::before {\n    content: \"\\ea16\";\n  }\n  .kolicon-plus::before {\n    content: \"\\ea17\";\n  }\n  .kolicon-settings::before {\n    content: \"\\ea18\";\n  }\n  .kolicon-sort-asc::before {\n    content: \"\\ea19\";\n  }\n  .kolicon-sort-desc::before {\n    content: \"\\ea1a\";\n  }\n  .kolicon-sort-neutral::before {\n    content: \"\\ea1b\";\n  }\n  .kolicon-up::before {\n    content: \"\\ea1c\";\n  }\n  .kolicon-version::before {\n    content: \"\\ea1d\";\n  }\n}\n@layer kol-component {\n  .kol-icon {\n    color: inherit;\n    display: inline-block;\n    font-size: inherit;\n    font-weight: inherit;\n    line-height: inherit;\n  }\n  .kol-tree-item__link .kol-link {\n    display: inline-flex;\n    width: 100%;\n    min-height: var(--a11y-min-size);\n    align-items: center;\n    text-decoration: none;\n    /* The interactive element inside the link skeleton carries the UA default underline\n       itself and replaces the former full-width anchor, so it has to fill the wrapper. */\n  }\n  .kol-tree-item__link .kol-link__interactive-element {\n    flex: 1 1 auto;\n    text-decoration: none;\n  }\n  .kol-tree-item__link-inner {\n    display: flex;\n    align-items: center;\n  }\n  .kol-tree-item__children {\n    margin: 0;\n    padding: 0;\n    list-style: none;\n  }\n  .kol-tree-item .kol-span {\n    place-items: unset;\n  }\n  .kol-tree-item__toggle-button, .kol-tree-item__toggle-button-placeholder {\n    display: inline-flex;\n    min-width: var(--a11y-min-size);\n    min-height: var(--a11y-min-size);\n    align-items: center;\n    justify-content: center;\n  }\n  .kol-tree-item__text {\n    text-decoration: underline;\n  }\n}";
 
 const KolTreeItem = class extends baseWebComponent.BaseWebComponent {
     constructor(hostRef) {

package/dist/cjs/kol-tree.cjs.entry.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-RAfZF5x0.js');
+var index = require('./index-CjTDipy9.js');
 var componentNames = require('./component-names-EMVnNhTP.js');
 var baseWebComponent = require('./base-web-component-DK5Y-vq5.js');
 require('./common-B9-LvLNa.js');

package/dist/cjs/kol-version.cjs.entry.js

@@ -3,24 +3,24 @@
  */
 'use strict';
 
-var index = require('./index-RAfZF5x0.js');
+var index = require('./index-CjTDipy9.js');
 var i18n = require('./i18n-UGaB-Dwg.js');
 var baseWebComponent = require('./base-web-component-DK5Y-vq5.js');
 require('./common-B9-LvLNa.js');
 var label = require('./label-DVnpZWVb.js');
-var component = require('./component-Bj4QdlXm.js');
-var component$1 = require('./component-Du98sklA.js');
+var component = require('./component-BZKcc9iM.js');
+var component$1 = require('./component-CESKZB76.js');
 var contrast = require('./contrast-CrL_sMV6.js');
 require('./i18n-B6c-GdHR.js');
 require('./isArray-BOIOdEQh.js');
 require('./bem-registry-BDVdt6ar.js');
-require('./component-CPVFCnaN.js');
+require('./component-B1t_MP4V.js');
 require('./tslib.es6-Cm0ytgPY.js');
-require('./component-CAkixzEQ.js');
+require('./component-C8WDkeRK.js');
 require('./clsx-Bm_HQUnh.js');
-require('./component-Dd-PS3jp.js');
-require('./component-3EZdZbDH.js');
-require('./component-Dw6Tq7Wb.js');
+require('./component-K9JCKLMC.js');
+require('./component-BGdViN9u.js');
+require('./component-B92xMW4N.js');
 require('./block-bem-D7PDS6kC.js');
 
 const versionPropsConfig = {
@@ -31,7 +31,7 @@ const VersionFC = ({ class: hostClass, color, icons, label }) => {
     return (index.h(component$1.BemRootNodeFC, { block: "kol-version", class: hostClass }, index.h(component.BadgeFC, { color: color, icons: icons, label: label })));
 };
 
-const defaultStyleCss = "@charset \"UTF-8\";\n/*\n* This file defines the layer order for all CSS layers used in KoliBri.\n* The order is important as it determines the cascade priority.\n*\n* Layer order (lowest to highest priority):\n* 1. kol-a11y - Accessibility defaults and requirements\n* 2. kol-global - Global component styles and resets\n* 3. kol-component - Component-specific styles\n* 4. kol-theme-global - Theme-specific global styles\n* 5. kol-theme-component - Theme-specific component styles\n* 6. kol-forced-colors - Defaults for forced colors and high contrast modes\n* 7. kol-theme-forced-colors - Theme-specific styles for forced colors and high contrast modes\n*/\n@layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors;\n/* forward the rem function */\n/*\n * Guards an interaction rule (`:hover`, `:active`, `:focus…`) against the disabled state.\n *\n * Two shapes are needed because the disabled marker sits on different elements: a native control\n * carries `disabled`, an anchor or summary carries `aria-disabled`, and a BEM wrapper carries a\n * `--disabled` modifier while its inner control carries the attribute.\n */\n/* Wrapper variant: asks the interactive element inside, which is where the attribute lives. */\n/*\n * This file contains all rules for accessibility.\n */\n@layer kol-a11y {\n  :host {\n    /*\n     * Minimum size of interactive elements.\n     *\n     * The `max(…, 44px)` floor guarantees the WCAG 2.5.5 (AAA) target size of 44px:\n     * `to-rem(44)` runs the value through a `calc()` rem round-trip which can lose\n     * sub-pixel precision and resolve to e.g. 43.99px depending on the browser's\n     * rounding, dropping just below the required minimum.\n     */\n    --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px);\n    /*\n     * No element should be used without verifying the contrast ratio of its background and font colors.\n     * By initially setting the background color to white and the font color to black,\n     * the contrast ratio is ensured and explicit adjustment is forced.\n     */\n    --kol-a11y-font-color: black;\n    --kol-a11y-background-color: white;\n    color: var(--kol-a11y-font-color);\n    background-color: var(--kol-a11y-background-color);\n    /*\n     * Verdana is an accessible font that can be used without requiring additional loading time.\n     */\n    --kol-a11y-font-family: Verdana;\n    font-family: var(--kol-a11y-font-family);\n    /*\n     * Letter spacing is required for all texts.\n     */\n    letter-spacing: inherit;\n    /*\n     * Word spacing is required for all texts.\n     */\n    word-spacing: inherit;\n    /*\n     * Text should be aligned left by default to provide a predictable starting point.\n     */\n    text-align: left;\n  }\n  * {\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    hyphens: auto;\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    word-break: break-word;\n  }\n  /*\n   * All interactive elements should have a minimum size of to-rem(44).\n   */\n  /* input:not([type='checkbox'], [type='radio'], [type='range']), */\n  /* option, */\n  /* select, */\n  /* textarea, */\n  button,\n  .kol-input .input {\n    min-width: var(--a11y-min-size);\n    min-height: var(--a11y-min-size);\n  }\n  /*\n   * Some interactive elements should not inherit the font-family and font-size.\n   */\n  a,\n  button,\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6,\n  input,\n  option,\n  select,\n  textarea {\n    /*\n     * All elements should inherit the text color from his parent element.\n     */\n    color: inherit;\n    /*\n     * All elements should inherit the font family from his parent element.\n     */\n    font-family: inherit;\n    /*\n     * All elements should inherit the font size from his parent element.\n     */\n    font-size: inherit;\n    /*\n     * Letter spacing is required for all texts.\n     */\n    letter-spacing: inherit;\n    /*\n     * Word spacing is required for all texts.\n     */\n    word-spacing: inherit;\n  }\n  /**\n  * Sometimes we need the semantic element for accessibility reasons,\n  * but we don't want to show it.\n  *\n  * - https://www.a11yproject.com/posts/how-to-hide-content/\n  */\n  .visually-hidden {\n    position: fixed;\n    top: 0;\n    left: 0;\n    width: 1px;\n    height: 1px;\n    overflow: hidden;\n    white-space: nowrap;\n    clip-path: inset(50%);\n  }\n}\n/*\n * This file contains all rules for forced-colors and highcontrast modes\n * https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Values/system-color to see all color keywords the browsers are providing\n */\n@layer kol-forced-colors {\n  @media (forced-colors: active) {\n    .kol-button__text {\n      color: ButtonText;\n      background-color: ButtonFace;\n      border: 2px solid ButtonBorder;\n    }\n    .kol-button--disabled .kol-button__text {\n      color: GrayText;\n      border-color: GrayText;\n    }\n    /*\n     * Forced colors drop author colors, so the only way a disabled control still reads as\n     * disabled is the `GrayText` system color. `kol-button` had it; the controls whose disabled\n     * state is `aria-disabled` (anchor, summary) and the native form controls did not.\n     */\n    .kol-link__interactive-element[aria-disabled=true],\n    .kol-accordion__heading[aria-disabled=true],\n    .kol-details__heading[aria-disabled=true] {\n      color: GrayText;\n    }\n    .kol-link__interactive-element[aria-disabled=true] .kol-icon,\n    .kol-link__interactive-element[aria-disabled=true] .kol-span__label,\n    .kol-accordion__heading[aria-disabled=true] .kol-icon,\n    .kol-accordion__heading[aria-disabled=true] .kol-span__label,\n    .kol-details__heading[aria-disabled=true] .kol-icon,\n    .kol-details__heading[aria-disabled=true] .kol-span__label {\n      color: GrayText;\n    }\n    input:disabled,\n    select:disabled,\n    textarea:disabled {\n      color: GrayText;\n      border-color: GrayText;\n    }\n    .kol-card,\n    .kol-dialog,\n    .kol-modal {\n      color: CanvasText;\n      background-color: Canvas;\n      border: 1px solid ButtonBorder;\n    }\n    .kol-pagination__button--selected .kol-button {\n      opacity: 1;\n    }\n    .kol-pagination__button--selected .kol-button__text {\n      color: SelectedItemText;\n      background-color: SelectedItem;\n    }\n    /* focus styles */\n    .kol-button__interactive-element:focus-visible,\n    .kol-link__interactive-element:focus-visible {\n      outline: 2px solid Highlight;\n      outline-offset: 2px;\n    }\n  }\n}\n@layer kol-global {\n  /*\n   * Dieses CSS stellt sicher, dass der Standard-Style\n   * von A und Button resettet werden.\n   */\n  :is(a, button) {\n    background-color: transparent;\n    width: 100%;\n    margin: 0;\n    padding: 0;\n    border: none;\n    /* 100% needed for custom width from outside */\n  }\n  /*\n   * Ensure elements with hidden attribute to be actually not visible\n   * @see https://meowni.ca/hidden.is.a.lie.html\n   */\n  [hidden] {\n    display: none !important;\n  }\n  .badge-text-hint {\n    color: black;\n    background-color: white;\n  }\n}\n@layer kol-global {\n  :host {\n    /*\n     * The max-width is needed to prevent the table from overflowing the\n     * parent node, if the table is wider than the parent node.\n     */\n    max-width: 100%;\n    font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n  }\n  * {\n    /*\n     * We prefer to box-sizing: border-box for all elements.\n     */\n    box-sizing: border-box;\n  }\n  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: flex;\n    flex-flow: column;\n    align-items: center;\n    justify-content: center;\n    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  }\n  .kol-span__container {\n    display: flex;\n    align-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  .kol-span .kol-span__label--hide-label .kol-span__label {\n    display: none;\n  }\n  /* Reset browser agent style. */\n  button:disabled {\n    color: unset;\n  }\n  /* A disabled `fieldset` only groups its controls; `cursor` is inherited and would reach the\n     operable info popover in its legend. */\n  .disabled label,\n  .disabled:focus-within label,\n  [aria-disabled=true],\n  [aria-disabled=true]:focus,\n  [disabled]:where(:not(fieldset)),\n  [disabled]:where(:not(fieldset)):focus {\n    outline: none;\n    cursor: not-allowed;\n  }\n  [aria-disabled=true]:focus .kol-span,\n  [disabled]:focus .kol-span {\n    outline: none !important;\n  }\n  .hastooltip {\n    z-index: 900 !important;\n  }\n}\n@font-face {\n  font-family: \"kolicons\";\n  src: url(\"kolicons.eot?t=1791539188494\"); /* IE9*/\n  src: url(\"kolicons.eot?t=1791539188494#iefix\") format(\"embedded-opentype\"), url(\"kolicons.woff2?t=1791539188494\") format(\"woff2\"), url(\"kolicons.woff?t=1791539188494\") format(\"woff\"), url(\"kolicons.ttf?t=1791539188494\") format(\"truetype\"), url(\"kolicons.svg?t=1791539188494#kolicons\") format(\"svg\"); /* iOS 4.1- */\n}\n@layer kol-component {\n  [class^=kolicon-], [class*=\" kolicon-\"] {\n    font-family: \"kolicons\";\n    font-style: normal;\n    font-weight: 400;\n    line-height: 1em;\n    -webkit-font-smoothing: antialiased;\n    -moz-osx-font-smoothing: grayscale;\n  }\n  .kolicon-alert-error::before {\n    content: \"\\ea01\";\n  }\n  .kolicon-alert-info::before {\n    content: \"\\ea02\";\n  }\n  .kolicon-alert-success::before {\n    content: \"\\ea03\";\n  }\n  .kolicon-alert-warning::before {\n    content: \"\\ea04\";\n  }\n  .kolicon-check::before {\n    content: \"\\ea05\";\n  }\n  .kolicon-chevron-double-left::before {\n    content: \"\\ea06\";\n  }\n  .kolicon-chevron-double-right::before {\n    content: \"\\ea07\";\n  }\n  .kolicon-chevron-down::before {\n    content: \"\\ea08\";\n  }\n  .kolicon-chevron-left::before {\n    content: \"\\ea09\";\n  }\n  .kolicon-chevron-right::before {\n    content: \"\\ea0a\";\n  }\n  .kolicon-chevron-up::before {\n    content: \"\\ea0b\";\n  }\n  .kolicon-cogwheel::before {\n    content: \"\\ea0c\";\n  }\n  .kolicon-cross::before {\n    content: \"\\ea0d\";\n  }\n  .kolicon-eye-closed::before {\n    content: \"\\ea0e\";\n  }\n  .kolicon-eye::before {\n    content: \"\\ea0f\";\n  }\n  .kolicon-house::before {\n    content: \"\\ea10\";\n  }\n  .kolicon-kolibri::before {\n    content: \"\\ea11\";\n  }\n  .kolicon-link-external::before {\n    content: \"\\ea12\";\n  }\n  .kolicon-link::before {\n    content: \"\\ea13\";\n  }\n  .kolicon-minus::before {\n    content: \"\\ea14\";\n  }\n  .kolicon-pin-pinned::before {\n    content: \"\\ea15\";\n  }\n  .kolicon-pin-unpinned::before {\n    content: \"\\ea16\";\n  }\n  .kolicon-plus::before {\n    content: \"\\ea17\";\n  }\n  .kolicon-settings::before {\n    content: \"\\ea18\";\n  }\n  .kolicon-sort-asc::before {\n    content: \"\\ea19\";\n  }\n  .kolicon-sort-desc::before {\n    content: \"\\ea1a\";\n  }\n  .kolicon-sort-neutral::before {\n    content: \"\\ea1b\";\n  }\n  .kolicon-up::before {\n    content: \"\\ea1c\";\n  }\n  .kolicon-version::before {\n    content: \"\\ea1d\";\n  }\n}\n/*\n * Badge box for every shadow root that renders `BadgeFC` - the badge itself and `kol-version`.\n * Stencil scopes `badge/style.scss` to the `kol-badge` shadow root, so a second consumer has to\n * bring these rules along (same pattern as `kol-link-styles` for `LinkFC`).\n *\n * The smart-button rules stay in `badge/style.scss`: only the badge web component orchestrates one.\n */\n@layer kol-component {\n  /* The version renders `BadgeFC` inline, so the badge box has to live in this shadow root too. */\n  .kol-icon {\n    color: inherit;\n    display: inline-block;\n    font-size: inherit;\n    font-weight: inherit;\n    line-height: inherit;\n  }\n  .kol-badge {\n    /* Visible with forced colors  */\n    outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n  }\n  .kol-badge > br {\n    user-select: none;\n  }\n}";
+const defaultStyleCss = "@charset \"UTF-8\";\n/*\n* This file defines the layer order for all CSS layers used in KoliBri.\n* The order is important as it determines the cascade priority.\n*\n* Layer order (lowest to highest priority):\n* 1. kol-a11y - Accessibility defaults and requirements\n* 2. kol-global - Global component styles and resets\n* 3. kol-component - Component-specific styles\n* 4. kol-theme-global - Theme-specific global styles\n* 5. kol-theme-component - Theme-specific component styles\n* 6. kol-forced-colors - Defaults for forced colors and high contrast modes\n* 7. kol-theme-forced-colors - Theme-specific styles for forced colors and high contrast modes\n*/\n@layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component, kol-forced-colors, kol-theme-forced-colors;\n/* forward the rem function */\n/*\n * Guards an interaction rule (`:hover`, `:active`, `:focus…`) against the disabled state.\n *\n * Two shapes are needed because the disabled marker sits on different elements: a native control\n * carries `disabled`, an anchor or summary carries `aria-disabled`, and a BEM wrapper carries a\n * `--disabled` modifier while its inner control carries the attribute.\n */\n/* Wrapper variant: asks the interactive element inside, which is where the attribute lives. */\n/*\n * This file contains all rules for accessibility.\n */\n@layer kol-a11y {\n  :host {\n    /*\n     * Minimum size of interactive elements.\n     *\n     * The `max(…, 44px)` floor guarantees the WCAG 2.5.5 (AAA) target size of 44px:\n     * `to-rem(44)` runs the value through a `calc()` rem round-trip which can lose\n     * sub-pixel precision and resolve to e.g. 43.99px depending on the browser's\n     * rounding, dropping just below the required minimum.\n     */\n    --a11y-min-size: max(calc(44 * 1rem / var(--kolibri-root-font-size, 16)), 44px);\n    /*\n     * No element should be used without verifying the contrast ratio of its background and font colors.\n     * By initially setting the background color to white and the font color to black,\n     * the contrast ratio is ensured and explicit adjustment is forced.\n     */\n    --kol-a11y-font-color: black;\n    --kol-a11y-background-color: white;\n    color: var(--kol-a11y-font-color);\n    background-color: var(--kol-a11y-background-color);\n    /*\n     * Verdana is an accessible font that can be used without requiring additional loading time.\n     */\n    --kol-a11y-font-family: Verdana;\n    font-family: var(--kol-a11y-font-family);\n    /*\n     * Letter spacing is required for all texts.\n     */\n    letter-spacing: inherit;\n    /*\n     * Word spacing is required for all texts.\n     */\n    word-spacing: inherit;\n    /*\n     * Text should be aligned left by default to provide a predictable starting point.\n     */\n    text-align: left;\n  }\n  * {\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    hyphens: auto;\n    /*\n     * This rule enables the word dividing for all texts. That is important for high zoom levels.\n     */\n    word-break: break-word;\n  }\n  /*\n   * All interactive elements should have a minimum size of to-rem(44).\n   */\n  /* input:not([type='checkbox'], [type='radio'], [type='range']), */\n  /* option, */\n  /* select, */\n  /* textarea, */\n  button,\n  .kol-input .input {\n    min-width: var(--a11y-min-size);\n    min-height: var(--a11y-min-size);\n  }\n  /*\n   * Some interactive elements should not inherit the font-family and font-size.\n   */\n  a,\n  button,\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6,\n  input,\n  option,\n  select,\n  textarea {\n    /*\n     * All elements should inherit the text color from his parent element.\n     */\n    color: inherit;\n    /*\n     * All elements should inherit the font family from his parent element.\n     */\n    font-family: inherit;\n    /*\n     * All elements should inherit the font size from his parent element.\n     */\n    font-size: inherit;\n    /*\n     * Letter spacing is required for all texts.\n     */\n    letter-spacing: inherit;\n    /*\n     * Word spacing is required for all texts.\n     */\n    word-spacing: inherit;\n  }\n  /**\n  * Sometimes we need the semantic element for accessibility reasons,\n  * but we don't want to show it.\n  *\n  * - https://www.a11yproject.com/posts/how-to-hide-content/\n  */\n  .visually-hidden {\n    position: fixed;\n    top: 0;\n    left: 0;\n    width: 1px;\n    height: 1px;\n    overflow: hidden;\n    white-space: nowrap;\n    clip-path: inset(50%);\n  }\n}\n/*\n * This file contains all rules for forced-colors and highcontrast modes\n * https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/Values/system-color to see all color keywords the browsers are providing\n */\n@layer kol-forced-colors {\n  @media (forced-colors: active) {\n    .kol-button__text {\n      color: ButtonText;\n      background-color: ButtonFace;\n      border: 2px solid ButtonBorder;\n    }\n    .kol-button--disabled .kol-button__text {\n      color: GrayText;\n      border-color: GrayText;\n    }\n    /*\n     * Forced colors drop author colors, so the only way a disabled control still reads as\n     * disabled is the `GrayText` system color. `kol-button` had it; the controls whose disabled\n     * state is `aria-disabled` (anchor, summary) and the native form controls did not.\n     */\n    .kol-link__interactive-element[aria-disabled=true],\n    .kol-accordion__heading[aria-disabled=true],\n    .kol-details__heading[aria-disabled=true] {\n      color: GrayText;\n    }\n    .kol-link__interactive-element[aria-disabled=true] .kol-icon,\n    .kol-link__interactive-element[aria-disabled=true] .kol-span__label,\n    .kol-accordion__heading[aria-disabled=true] .kol-icon,\n    .kol-accordion__heading[aria-disabled=true] .kol-span__label,\n    .kol-details__heading[aria-disabled=true] .kol-icon,\n    .kol-details__heading[aria-disabled=true] .kol-span__label {\n      color: GrayText;\n    }\n    input:disabled,\n    select:disabled,\n    textarea:disabled {\n      color: GrayText;\n      border-color: GrayText;\n    }\n    .kol-card,\n    .kol-dialog,\n    .kol-modal {\n      color: CanvasText;\n      background-color: Canvas;\n      border: 1px solid ButtonBorder;\n    }\n    .kol-pagination__button--selected .kol-button {\n      opacity: 1;\n    }\n    .kol-pagination__button--selected .kol-button__text {\n      color: SelectedItemText;\n      background-color: SelectedItem;\n    }\n    /* focus styles */\n    .kol-button__interactive-element:focus-visible,\n    .kol-link__interactive-element:focus-visible {\n      outline: 2px solid Highlight;\n      outline-offset: 2px;\n    }\n  }\n}\n@layer kol-global {\n  /*\n   * Dieses CSS stellt sicher, dass der Standard-Style\n   * von A und Button resettet werden.\n   */\n  :is(a, button) {\n    background-color: transparent;\n    width: 100%;\n    margin: 0;\n    padding: 0;\n    border: none;\n    /* 100% needed for custom width from outside */\n  }\n  /*\n   * Ensure elements with hidden attribute to be actually not visible\n   * @see https://meowni.ca/hidden.is.a.lie.html\n   */\n  [hidden] {\n    display: none !important;\n  }\n  .badge-text-hint {\n    color: black;\n    background-color: white;\n  }\n}\n@layer kol-global {\n  :host {\n    /*\n     * The max-width is needed to prevent the table from overflowing the\n     * parent node, if the table is wider than the parent node.\n     */\n    max-width: 100%;\n    font-size: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n  }\n  * {\n    /*\n     * We prefer to box-sizing: border-box for all elements.\n     */\n    box-sizing: border-box;\n  }\n  .kol-span {\n    /* KolSpan is a layout component with icons in all directions and a label text in the middle. */\n    display: flex;\n    flex-flow: column;\n    align-items: center;\n    justify-content: center;\n    /* The sub span in KolSpan is the horizontal span with icon left and right and the label text in the middle. */\n  }\n  .kol-span__container {\n    display: flex;\n    align-items: center;\n  }\n  a,\n  button {\n    cursor: pointer;\n  }\n  .kol-span .kol-span__label--hide-label .kol-span__label {\n    display: none;\n  }\n  /* Reset browser agent style. */\n  button:disabled {\n    color: unset;\n  }\n  /* A disabled `fieldset` only groups its controls; `cursor` is inherited and would reach the\n     operable info popover in its legend. */\n  .disabled label,\n  .disabled:focus-within label,\n  [aria-disabled=true],\n  [aria-disabled=true]:focus,\n  [disabled]:where(:not(fieldset)),\n  [disabled]:where(:not(fieldset)):focus {\n    outline: none;\n    cursor: not-allowed;\n  }\n  [aria-disabled=true]:focus .kol-span,\n  [disabled]:focus .kol-span {\n    outline: none !important;\n  }\n  .hastooltip {\n    z-index: 900 !important;\n  }\n}\n@font-face {\n  font-family: \"kolicons\";\n  src: url(\"kolicons.eot?t=1791544630279\"); /* IE9*/\n  src: url(\"kolicons.eot?t=1791544630279#iefix\") format(\"embedded-opentype\"), url(\"kolicons.woff2?t=1791544630279\") format(\"woff2\"), url(\"kolicons.woff?t=1791544630279\") format(\"woff\"), url(\"kolicons.ttf?t=1791544630279\") format(\"truetype\"), url(\"kolicons.svg?t=1791544630279#kolicons\") format(\"svg\"); /* iOS 4.1- */\n}\n@layer kol-component {\n  [class^=kolicon-], [class*=\" kolicon-\"] {\n    font-family: \"kolicons\";\n    font-style: normal;\n    font-weight: 400;\n    line-height: 1em;\n    -webkit-font-smoothing: antialiased;\n    -moz-osx-font-smoothing: grayscale;\n  }\n  .kolicon-alert-error::before {\n    content: \"\\ea01\";\n  }\n  .kolicon-alert-info::before {\n    content: \"\\ea02\";\n  }\n  .kolicon-alert-success::before {\n    content: \"\\ea03\";\n  }\n  .kolicon-alert-warning::before {\n    content: \"\\ea04\";\n  }\n  .kolicon-check::before {\n    content: \"\\ea05\";\n  }\n  .kolicon-chevron-double-left::before {\n    content: \"\\ea06\";\n  }\n  .kolicon-chevron-double-right::before {\n    content: \"\\ea07\";\n  }\n  .kolicon-chevron-down::before {\n    content: \"\\ea08\";\n  }\n  .kolicon-chevron-left::before {\n    content: \"\\ea09\";\n  }\n  .kolicon-chevron-right::before {\n    content: \"\\ea0a\";\n  }\n  .kolicon-chevron-up::before {\n    content: \"\\ea0b\";\n  }\n  .kolicon-cogwheel::before {\n    content: \"\\ea0c\";\n  }\n  .kolicon-cross::before {\n    content: \"\\ea0d\";\n  }\n  .kolicon-eye-closed::before {\n    content: \"\\ea0e\";\n  }\n  .kolicon-eye::before {\n    content: \"\\ea0f\";\n  }\n  .kolicon-house::before {\n    content: \"\\ea10\";\n  }\n  .kolicon-kolibri::before {\n    content: \"\\ea11\";\n  }\n  .kolicon-link-external::before {\n    content: \"\\ea12\";\n  }\n  .kolicon-link::before {\n    content: \"\\ea13\";\n  }\n  .kolicon-minus::before {\n    content: \"\\ea14\";\n  }\n  .kolicon-pin-pinned::before {\n    content: \"\\ea15\";\n  }\n  .kolicon-pin-unpinned::before {\n    content: \"\\ea16\";\n  }\n  .kolicon-plus::before {\n    content: \"\\ea17\";\n  }\n  .kolicon-settings::before {\n    content: \"\\ea18\";\n  }\n  .kolicon-sort-asc::before {\n    content: \"\\ea19\";\n  }\n  .kolicon-sort-desc::before {\n    content: \"\\ea1a\";\n  }\n  .kolicon-sort-neutral::before {\n    content: \"\\ea1b\";\n  }\n  .kolicon-up::before {\n    content: \"\\ea1c\";\n  }\n  .kolicon-version::before {\n    content: \"\\ea1d\";\n  }\n}\n/*\n * Badge box for every shadow root that renders `BadgeFC` - the badge itself and `kol-version`.\n * Stencil scopes `badge/style.scss` to the `kol-badge` shadow root, so a second consumer has to\n * bring these rules along (same pattern as `kol-link-styles` for `LinkFC`).\n *\n * The smart-button rules stay in `badge/style.scss`: only the badge web component orchestrates one.\n */\n@layer kol-component {\n  /* The version renders `BadgeFC` inline, so the badge box has to live in this shadow root too. */\n  .kol-icon {\n    color: inherit;\n    display: inline-block;\n    font-size: inherit;\n    font-weight: inherit;\n    line-height: inherit;\n  }\n  .kol-badge {\n    /* Visible with forced colors  */\n    outline: transparent solid calc(1 * 1rem / var(--kolibri-root-font-size, 16));\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n  }\n  .kol-badge > br {\n    user-select: none;\n  }\n}";
 
 const VERSION_COLORS = contrast.createContrastColorPair('#bec5c9');
 const VERSION_COLOR = { backgroundColor: VERSION_COLORS.background, foregroundColor: VERSION_COLORS.foreground };

package/dist/cjs/kolibri.cjs.js

@@ -3,8 +3,8 @@
  */
 'use strict';
 
-var index = require('./index-RAfZF5x0.js');
-var appGlobals = require('./app-globals-DPVGNVgE.js');
+var index = require('./index-CjTDipy9.js');
+var appGlobals = require('./app-globals-KA8S4Kl9.js');
 require('./common-B9-LvLNa.js');
 
 var _documentCurrentScript = typeof document !== 'undefined' ? document.currentScript : null;

package/dist/cjs/loader.cjs.js

@@ -3,8 +3,8 @@
  */
 'use strict';
 
-var index = require('./index-RAfZF5x0.js');
-var appGlobals = require('./app-globals-DPVGNVgE.js');
+var index = require('./index-CjTDipy9.js');
+var appGlobals = require('./app-globals-KA8S4Kl9.js');
 require('./common-B9-LvLNa.js');
 
 const defineCustomElements = async (win, options) => {

package/dist/cjs/{resolve-props-BBVQo_N5.js → resolve-props-JqnN_2MF.js}

@@ -6,7 +6,7 @@
 var accessAndShortKey = require('./access-and-short-key-D40HWCJe.js');
 require('./common-B9-LvLNa.js');
 var variant = require('./variant-wdbSxe--.js');
-var api = require('./api-BDT5xkx5.js');
+var api = require('./api-kNqVTMqf.js');
 var disabled = require('./disabled-B8tOrtj_.js');
 var href = require('./href-C20g573P.js');
 var baseWebComponent = require('./base-web-component-DK5Y-vq5.js');
@@ -58,6 +58,6 @@ function resolveLinkProps(props) {
 }
 
 exports.resolveLinkProps = resolveLinkProps;
-//# sourceMappingURL=resolve-props-BBVQo_N5.js.map
+//# sourceMappingURL=resolve-props-JqnN_2MF.js.map
 
-//# sourceMappingURL=resolve-props-BBVQo_N5.js.map
+//# sourceMappingURL=resolve-props-JqnN_2MF.js.map

package/dist/cjs/{resolve-props-BBVQo_N5.js.map → resolve-props-JqnN_2MF.js.map}

@@ -1 +1 @@
-{"version":3,"file":"resolve-props-BBVQo_N5.js","sources":["src/internal/functional-components/link/resolve-props.ts"],"sourcesContent":["import type { AriaOwnsPropType, CustomClassPropType, LinkProps, VariantClassNamePropType } from '../../../schema';\nimport { validateAccessAndShortKey } from '../../../schema/validators/access-and-short-key';\nimport {\n\taccessKeyProp,\n\tariaControlsProp,\n\tariaCurrentValueProp,\n\tariaDescriptionProp,\n\tariaExpandedProp,\n\tariaOwnsProp,\n\tcustomClassProp,\n\tdisabledProp,\n\tdownloadProp,\n\thideLabelProp,\n\threfProp,\n\tinlineProp,\n\tlabelWithExpertSlotProp,\n\tlinkCallbacksProp,\n\tlinkRoleProp,\n\tlinkTargetProp,\n\tshortKeyProp,\n\tspanIconsProp,\n\ttabIndexProp,\n\ttooltipAlignProp,\n\tvariantProp,\n} from '../../props';\nimport type { ResolvedProps, StrictFields } from '../generic-types';\nimport { buildDefaultPropsFromConfig } from '../props-from-config';\nimport type { LinkApi } from './api';\nimport { linkPropsConfig } from './api';\n\n/** The fully normalized render props `LinkFC` expects. */\nexport type ResolvedLinkProps = StrictFields<ResolvedProps<LinkApi>>;\n\n/**\n * An embedded link's configuration: the public `LinkProps` plus the internal props that components\n * embedding `LinkFC` may set.\n */\nexport type EmbeddedLinkProps = LinkProps & {\n\t_ariaExpanded?: boolean;\n\t_ariaOwns?: AriaOwnsPropType;\n\t_customClass?: CustomClassPropType;\n\t_variant?: VariantClassNamePropType;\n};\n\n/**\n * The defaults the link elements declare on their `@Prop` fields. `inlineProp` and\n * `tooltipAlignProp` are shared with the button, so they are restated here rather than relied on.\n */\nconst LINK_ELEMENT_DEFAULTS = {\n\tdisabled: false,\n\thideLabel: false,\n\tinline: true,\n\ttooltipAlign: 'right',\n} as const;\n\n/**\n * Normalizes an embedded link's props into the render props `LinkFC` expects — the counterpart\n * of `resolveButtonProps` for a component rendering a link inside its own boundary.\n *\n * Props only. Everything stateful belongs to the composing web component: the `TooltipBehavior`,\n * the click handler dispatching the public DOM event, the anchor ref and the `ariaCurrent`,\n * `ariaDescriptionId` and `expertSlot` states.\n *\n * @param props - The embedded link's configuration, as handed to the host component.\n */\nexport function resolveLinkProps(props: EmbeddedLinkProps): ResolvedLinkProps {\n\tconst resolved = buildDefaultPropsFromConfig(linkPropsConfig) as ResolvedLinkProps;\n\tconst set = <K extends keyof ResolvedLinkProps>(key: K) => {\n\t\treturn (value: ResolvedLinkProps[K]): void => {\n\t\t\tresolved[key] = value;\n\t\t};\n\t};\n\n\threfProp.apply(props._href, set('href'));\n\taccessKeyProp.apply(props._accessKey, set('accessKey'));\n\tariaControlsProp.apply(props._ariaControls, set('ariaControls'));\n\tariaCurrentValueProp.apply(props._ariaCurrentValue, set('ariaCurrentValue'));\n\tariaDescriptionProp.apply(props._ariaDescription, set('ariaDescription'));\n\tariaExpandedProp.apply(props._ariaExpanded, set('ariaExpanded'));\n\tariaOwnsProp.apply(props._ariaOwns, set('ariaOwns'));\n\tcustomClassProp.apply(props._customClass, set('customClass'));\n\tdisabledProp.apply(props._disabled ?? LINK_ELEMENT_DEFAULTS.disabled, set('disabled'));\n\tdownloadProp.apply(props._download, set('download'));\n\thideLabelProp.apply(props._hideLabel ?? LINK_ELEMENT_DEFAULTS.hideLabel, set('hideLabel'));\n\tspanIconsProp.apply(props._icons, set('icons'));\n\tinlineProp.apply(props._inline ?? LINK_ELEMENT_DEFAULTS.inline, set('inline'));\n\tlabelWithExpertSlotProp.apply(props._label, set('label'));\n\tlinkCallbacksProp.apply(props._on, set('on'));\n\tlinkRoleProp.apply(props._role, set('role'));\n\tshortKeyProp.apply(props._shortKey, set('shortKey'));\n\tlinkTargetProp.apply(props._target, set('target'));\n\ttooltipAlignProp.apply(props._tooltipAlign ?? LINK_ELEMENT_DEFAULTS.tooltipAlign, set('tooltipAlign'));\n\tvariantProp.apply(props._variant, set('variant'));\n\n\t// An unset tabindex must not render as `tabindex=\"0\"` — links are natively tabbable and the\n\t// attribute would draw focus outlines the element never had. The props config seeds `0`, so\n\t// anything but an explicit number clears it again.\n\tif (typeof props._tabIndex === 'number') {\n\t\ttabIndexProp.apply(props._tabIndex, set('tabIndex'));\n\t} else {\n\t\tresolved.tabIndex = undefined as unknown as ResolvedLinkProps['tabIndex'];\n\t}\n\n\tvalidateAccessAndShortKey(props._accessKey, props._shortKey);\n\n\treturn resolved;\n}\n"],"names":["buildDefaultPropsFromConfig","linkPropsConfig","hrefProp","accessKeyProp","ariaControlsProp","ariaCurrentValueProp","ariaDescriptionProp","ariaExpandedProp","ariaOwnsProp","customClassProp","disabledProp","downloadProp","hideLabelProp","spanIconsProp","inlineProp","labelWithExpertSlotProp","linkCallbacksProp","linkRoleProp","shortKeyProp","linkTargetProp","tooltipAlignProp","variantProp","tabIndexProp","validateAccessAndShortKey"],"mappings":";;;;;;;;;;;;;;;AAgDA,MAAM,qBAAqB,GAAG;AAC7B,IAAA,QAAQ,EAAE,KAAK;AACf,IAAA,SAAS,EAAE,KAAK;AAChB,IAAA,MAAM,EAAE,IAAI;AACZ,IAAA,YAAY,EAAE,OAAO;CACZ;AAYJ,SAAU,gBAAgB,CAAC,KAAwB,EAAA;;AACxD,IAAA,MAAM,QAAQ,GAAGA,4CAA2B,CAACC,mBAAe,CAAsB;AAClF,IAAA,MAAM,GAAG,GAAG,CAAoC,GAAM,KAAI;QACzD,OAAO,CAAC,KAA2B,KAAU;AAC5C,YAAA,QAAQ,CAAC,GAAG,CAAC,GAAG,KAAK;AACtB,SAAC;AACF,KAAC;AAED,IAAAC,aAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;AACxC,IAAAC,qBAAa,CAAC,KAAK,CAAC,KAAK,CAAC,UAAU,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;AACvD,IAAAC,wBAAgB,CAAC,KAAK,CAAC,KAAK,CAAC,aAAa,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;AAChE,IAAAC,wBAAoB,CAAC,KAAK,CAAC,KAAK,CAAC,iBAAiB,EAAE,GAAG,CAAC,kBAAkB,CAAC,CAAC;AAC5E,IAAAC,2BAAmB,CAAC,KAAK,CAAC,KAAK,CAAC,gBAAgB,EAAE,GAAG,CAAC,iBAAiB,CAAC,CAAC;AACzE,IAAAC,wBAAgB,CAAC,KAAK,CAAC,KAAK,CAAC,aAAa,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;AAChE,IAAAC,gBAAY,CAAC,KAAK,CAAC,KAAK,CAAC,SAAS,EAAE,GAAG,CAAC,UAAU,CAAC,CAAC;AACpD,IAAAC,uBAAe,CAAC,KAAK,CAAC,KAAK,CAAC,YAAY,EAAE,GAAG,CAAC,aAAa,CAAC,CAAC;AAC7D,IAAAC,qBAAY,CAAC,KAAK,CAAC,CAAA,EAAA,GAAA,KAAK,CAAC,SAAS,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,qBAAqB,CAAC,QAAQ,EAAE,GAAG,CAAC,UAAU,CAAC,CAAC;AACtF,IAAAC,gBAAY,CAAC,KAAK,CAAC,KAAK,CAAC,SAAS,EAAE,GAAG,CAAC,UAAU,CAAC,CAAC;AACpD,IAAAC,qBAAa,CAAC,KAAK,CAAC,CAAA,EAAA,GAAA,KAAK,CAAC,UAAU,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,qBAAqB,CAAC,SAAS,EAAE,GAAG,CAAC,WAAW,CAAC,CAAC;AAC1F,IAAAC,qBAAa,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,EAAE,GAAG,CAAC,OAAO,CAAC,CAAC;AAC/C,IAAAC,kBAAU,CAAC,KAAK,CAAC,CAAA,EAAA,GAAA,KAAK,CAAC,OAAO,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,qBAAqB,CAAC,MAAM,EAAE,GAAG,CAAC,QAAQ,CAAC,CAAC;AAC9E,IAAAC,2CAAuB,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,EAAE,GAAG,CAAC,OAAO,CAAC,CAAC;AACzD,IAAAC,qBAAiB,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,EAAE,GAAG,CAAC,IAAI,CAAC,CAAC;AAC7C,IAAAC,oBAAY,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,EAAE,GAAG,CAAC,MAAM,CAAC,CAAC;AAC5C,IAAAC,oBAAY,CAAC,KAAK,CAAC,KAAK,CAAC,SAAS,EAAE,GAAG,CAAC,UAAU,CAAC,CAAC;AACpD,IAAAC,yBAAc,CAAC,KAAK,CAAC,KAAK,CAAC,OAAO,EAAE,GAAG,CAAC,QAAQ,CAAC,CAAC;AAClD,IAAAC,wBAAgB,CAAC,KAAK,CAAC,CAAA,EAAA,GAAA,KAAK,CAAC,aAAa,MAAA,IAAA,IAAA,EAAA,KAAA,MAAA,GAAA,EAAA,GAAI,qBAAqB,CAAC,YAAY,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;AACtG,IAAAC,mBAAW,CAAC,KAAK,CAAC,KAAK,CAAC,QAAQ,EAAE,GAAG,CAAC,SAAS,CAAC,CAAC;AAKjD,IAAA,IAAI,OAAO,KAAK,CAAC,SAAS,KAAK,QAAQ,EAAE;AACxC,QAAAC,oBAAY,CAAC,KAAK,CAAC,KAAK,CAAC,SAAS,EAAE,GAAG,CAAC,UAAU,CAAC,CAAC;;SAC9C;AACN,QAAA,QAAQ,CAAC,QAAQ,GAAG,SAAqD;;IAG1EC,2CAAyB,CAAC,KAAK,CAAC,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC;AAE5D,IAAA,OAAO,QAAQ;AAChB;;;;"}
+{"version":3,"file":"resolve-props-JqnN_2MF.js","sources":["src/internal/functional-components/link/resolve-props.ts"],"sourcesContent":["import type { AriaOwnsPropType, CustomClassPropType, LinkProps, VariantClassNamePropType } from '../../../schema';\nimport { validateAccessAndShortKey } from '../../../schema/validators/access-and-short-key';\nimport {\n\taccessKeyProp,\n\tariaControlsProp,\n\tariaCurrentValueProp,\n\tariaDescriptionProp,\n\tariaExpandedProp,\n\tariaOwnsProp,\n\tcustomClassProp,\n\tdisabledProp,\n\tdownloadProp,\n\thideLabelProp,\n\threfProp,\n\tinlineProp,\n\tlabelWithExpertSlotProp,\n\tlinkCallbacksProp,\n\tlinkRoleProp,\n\tlinkTargetProp,\n\tshortKeyProp,\n\tspanIconsProp,\n\ttabIndexProp,\n\ttooltipAlignProp,\n\tvariantProp,\n} from '../../props';\nimport type { ResolvedProps, StrictFields } from '../generic-types';\nimport { buildDefaultPropsFromConfig } from '../props-from-config';\nimport type { LinkApi } from './api';\nimport { linkPropsConfig } from './api';\n\n/** The fully normalized render props `LinkFC` expects. */\nexport type ResolvedLinkProps = StrictFields<ResolvedProps<LinkApi>>;\n\n/**\n * An embedded link's configuration: the public `LinkProps` plus the internal props that components\n * embedding `LinkFC` may set.\n */\nexport type EmbeddedLinkProps = LinkProps & {\n\t_ariaExpanded?: boolean;\n\t_ariaOwns?: AriaOwnsPropType;\n\t_customClass?: CustomClassPropType;\n\t_variant?: VariantClassNamePropType;\n};\n\n/**\n * The defaults the link elements declare on their `@Prop` fields. `inlineProp` and\n * `tooltipAlignProp` are shared with the button, so they are restated here rather than relied on.\n */\nconst LINK_ELEMENT_DEFAULTS = {\n\tdisabled: false,\n\thideLabel: false,\n\tinline: true,\n\ttooltipAlign: 'right',\n} as const;\n\n/**\n * Normalizes an embedded link's props into the render props `LinkFC` expects — the counterpart\n * of `resolveButtonProps` for a component rendering a link inside its own boundary.\n *\n * Props only. Everything stateful belongs to the composing web component: the `TooltipBehavior`,\n * the click handler dispatching the public DOM event, the anchor ref and the `ariaCurrent`,\n * `ariaDescriptionId` and `expertSlot` states.\n *\n * @param props - The embedded link's configuration, as handed to the host component.\n */\nexport function resolveLinkProps(props: EmbeddedLinkProps): ResolvedLinkProps {\n\tconst resolved = buildDefaultPropsFromConfig(linkPropsConfig) as ResolvedLinkProps;\n\tconst set = <K extends keyof ResolvedLinkProps>(key: K) => {\n\t\treturn (value: ResolvedLinkProps[K]): void => {\n\t\t\tresolved[key] = value;\n\t\t};\n\t};\n\n\threfProp.apply(props._href, set('href'));\n\taccessKeyProp.apply(props._accessKey, set('accessKey'));\n\tariaControlsProp.apply(props._ariaControls, set('ariaControls'));\n\tariaCurrentValueProp.apply(props._ariaCurrentValue, set('ariaCurrentValue'));\n\tariaDescriptionProp.apply(props._ariaDescription, set('ariaDescription'));\n\tariaExpandedProp.apply(props._ariaExpanded, set('ariaExpanded'));\n\tariaOwnsProp.apply(props._ariaOwns, set('ariaOwns'));\n\tcustomClassProp.apply(props._customClass, set('customClass'));\n\tdisabledProp.apply(props._disabled ?? LINK_ELEMENT_DEFAULTS.disabled, set('disabled'));\n\tdownloadProp.apply(props._download, set('download'));\n\thideLabelProp.apply(props._hideLabel ?? LINK_ELEMENT_DEFAULTS.hideLabel, set('hideLabel'));\n\tspanIconsProp.apply(props._icons, set('icons'));\n\tinlineProp.apply(props._inline ?? LINK_ELEMENT_DEFAULTS.inline, set('inline'));\n\tlabelWithExpertSlotProp.apply(props._label, set('label'));\n\tlinkCallbacksProp.apply(props._on, set('on'));\n\tlinkRoleProp.apply(props._role, set('role'));\n\tshortKeyProp.apply(props._shortKey, set('shortKey'));\n\tlinkTargetProp.apply(props._target, set('target'));\n\ttooltipAlignProp.apply(props._tooltipAlign ?? LINK_ELEMENT_DEFAULTS.tooltipAlign, set('tooltipAlign'));\n\tvariantProp.apply(props._variant, set('variant'));\n\n\t// An unset tabindex must not render as `tabindex=\"0\"` — links are natively tabbable and the\n\t// attribute would draw focus outlines the element never had. The props config seeds `0`, so\n\t// anything but an explicit number clears it again.\n\tif (typeof props._tabIndex === 'number') {\n\t\ttabIndexProp.apply(props._tabIndex, set('tabIndex'));\n\t} else {\n\t\tresolved.tabIndex = undefined as unknown as ResolvedLinkProps['tabIndex'];\n\t}\n\n\tvalidateAccessAndShortKey(props._accessKey, props._shortKey);\n\n\treturn resolved;\n}\n"],"names":["buildDefaultPropsFromConfig","linkPropsConfig","hrefProp","accessKeyProp","ariaControlsProp","ariaCurrentValueProp","ariaDescriptionProp","ariaExpandedProp","ariaOwnsProp","customClassProp","disabledProp","downloadProp","hideLabelProp","spanIconsProp","inlineProp","labelWithExpertSlotProp","linkCallbacksProp","linkRoleProp","shortKeyProp","linkTargetProp","tooltipAlignProp","variantProp","tabIndexProp","validateAccessAndShortKey"],"mappings":"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"}

package/dist/cjs/{scroll-lock-zJbOf1Xr.js → scroll-lock-CxkP-oj1.js}

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-RAfZF5x0.js');
+var index = require('./index-CjTDipy9.js');
 var bemRegistry = require('./bem-registry-BDVdt6ar.js');
 var clsx = require('./clsx-Bm_HQUnh.js');
 
@@ -68,6 +68,6 @@ exports.DialogFC = DialogFC;
 exports.dialogBlockClass = dialogBlockClass;
 exports.lockScroll = lockScroll;
 exports.unlockScroll = unlockScroll;
-//# sourceMappingURL=scroll-lock-zJbOf1Xr.js.map
+//# sourceMappingURL=scroll-lock-CxkP-oj1.js.map
 
-//# sourceMappingURL=scroll-lock-zJbOf1Xr.js.map
+//# sourceMappingURL=scroll-lock-CxkP-oj1.js.map

package/dist/cjs/{scroll-lock-zJbOf1Xr.js.map → scroll-lock-CxkP-oj1.js.map}

@@ -1 +1 @@
-{"version":3,"file":"scroll-lock-zJbOf1Xr.js","sources":["src/internal/functional-components/dialog/component.tsx","src/utils/scroll-lock.ts"],"sourcesContent":["import type { FunctionalComponent as FC } from '@stencil/core';\nimport { h } from '@stencil/core';\n\nimport { bem } from '../../../schema/bem-registry';\nimport type { ModalVariantPropType } from '../../../schema/props/variant/modal';\nimport clsx from '../../../utils/clsx';\nimport type { FunctionalComponentProps } from '../generic-types';\nimport type { DialogApi } from './api';\n\nconst dialogBem = bem.forBlock('kol-dialog');\nconst modalBem = bem.forBlock('kol-modal');\n\n/**\n * The dialog's own block classes: `kol-dialog`, the deprecated `kol-modal` alias, and the variant\n * of both as an element-style suffix. Every theme addresses all four names, so they are rendered\n * verbatim.\n */\nexport const dialogBlockClass = (variant: ModalVariantPropType): string => clsx(dialogBem(), modalBem(), dialogBem(variant), modalBem(variant));\n\nexport type DialogFCProps = Pick<FunctionalComponentProps<DialogApi>, 'class' | 'handleCancel' | 'handleClose' | 'label' | 'modal' | 'refDialog'> & {\n\t/**\n\t * Class names of the block this dialog belongs to. `kol-dialog` renders its own block, the\n\t * deprecated `kol-modal` alias and the variant of both; `kol-drawer` renders its\n\t * `kol-drawer__dialog` element class. Every theme styles the two differently — a drawer that\n\t * carried the dialog classes would inherit the dialog's background, radius and backdrop — so\n\t * neither is hard-coded here.\n\t */\n\tblockClass: string;\n\t/**\n\t * DOM id of the heading that labels the dialog. Without one the dialog falls back to\n\t * `aria-label`, which is what the blank variant needs: it renders no heading.\n\t */\n\tlabelledBy?: string;\n\t/** Width of the dialog. Left unset, the dialog keeps its intrinsic size. */\n\twidth?: string;\n};\n\n/**\n * The native `<dialog>` shell, shared by `kol-dialog`, the deprecated `kol-modal`, `kol-drawer` and\n * the settings menu of the table.\n *\n * It owns the element that provides `showModal()`, the top layer and the backdrop — and nothing\n * else. What the dialog contains is the consumer's composition, handed in as children: the dialog\n * renders its card or blank contents, the drawer its sliding wrapper around a card.\n *\n * Root from the `<dialog>` itself, not `BemRootNodeFC`: that always renders a `<div>`, and only the\n * native element carries the dialog semantics.\n *\n * `children` rather than a `<slot />`: Stencil derives light-DOM slot relocation from the JSX in the\n * element file, so each element supplies its own slot.\n */\nexport const DialogFC: FC<DialogFCProps> = (props, children) => {\n\tconst { blockClass, class: hostClass, handleCancel, handleClose, label, labelledBy, modal, refDialog, width } = props;\n\n\treturn (\n\t\t<dialog\n\t\t\taria-label={labelledBy ? undefined : label}\n\t\t\taria-labelledby={labelledBy}\n\t\t\taria-modal={modal ? 'true' : 'false'}\n\t\t\tclass={clsx(blockClass, hostClass)}\n\t\t\tonCancel={handleCancel}\n\t\t\tonClose={handleClose}\n\t\t\tref={refDialog}\n\t\t\tstyle={width ? { width } : undefined}\n\t\t>\n\t\t\t{children}\n\t\t</dialog>\n\t);\n};\n","/**\n * This file contains the functions used to lock the background scroll while\n * a modal overlay (dialog, modal, drawer) is open. The native `showModal()`\n * makes the background inert, but does not prevent the document from scrolling.\n */\n\n/**\n * This set contains all owners (component instances) currently holding the lock.\n * The scroll lock is released once the last owner unlocks.\n */\nconst SCROLL_LOCK_OWNERS: Set<unknown> = new Set();\n\nlet previousOverflow: string | null = null;\nlet previousPaddingRight: string | null = null;\n\n/**\n * Locks the document scroll for the given owner. The first lock stores the\n * current inline styles and hides the viewport scrollbar; the removed\n * scrollbar width is compensated with padding to avoid a layout shift.\n *\n * @param owner The component instance requesting the lock\n */\nexport function lockScroll(owner: unknown): void {\n\tif (typeof document === 'undefined' || typeof window === 'undefined') {\n\t\treturn;\n\t}\n\tif (SCROLL_LOCK_OWNERS.has(owner)) {\n\t\treturn;\n\t}\n\n\tif (SCROLL_LOCK_OWNERS.size === 0) {\n\t\tconst docEl = document.documentElement;\n\t\tpreviousOverflow = docEl.style.getPropertyValue('overflow');\n\t\tpreviousPaddingRight = docEl.style.getPropertyValue('padding-right');\n\n\t\t// Measure before hiding the scrollbar; overlay scrollbars yield 0.\n\t\tconst scrollbarWidth = window.innerWidth - docEl.clientWidth;\n\t\tif (scrollbarWidth > 0) {\n\t\t\tconst currentPaddingRight = Number.parseFloat(window.getComputedStyle(docEl).paddingRight) || 0;\n\t\t\tdocEl.style.setProperty('padding-right', `${currentPaddingRight + scrollbarWidth}px`);\n\t\t}\n\t\tdocEl.style.setProperty('overflow', 'hidden');\n\t}\n\n\tSCROLL_LOCK_OWNERS.add(owner);\n}\n\n/**\n * Releases the scroll lock for the given owner. Calling it for an owner that\n * does not hold a lock is a no-op, so unlocking is idempotent per owner. The\n * previous inline styles are restored once the last owner unlocks.\n *\n * @param owner The component instance releasing the lock\n */\nexport function unlockScroll(owner: unknown): void {\n\tif (typeof document === 'undefined' || typeof window === 'undefined') {\n\t\treturn;\n\t}\n\tif (!SCROLL_LOCK_OWNERS.delete(owner)) {\n\t\treturn;\n\t}\n\n\tif (SCROLL_LOCK_OWNERS.size === 0) {\n\t\tconst docEl = document.documentElement;\n\t\tif (previousOverflow) {\n\t\t\tdocEl.style.setProperty('overflow', previousOverflow);\n\t\t} else {\n\t\t\tdocEl.style.removeProperty('overflow');\n\t\t}\n\t\tif (previousPaddingRight) {\n\t\t\tdocEl.style.setProperty('padding-right', previousPaddingRight);\n\t\t} else {\n\t\t\tdocEl.style.removeProperty('padding-right');\n\t\t}\n\t\tpreviousOverflow = null;\n\t\tpreviousPaddingRight = null;\n\t}\n}\n"],"names":["bem","clsx","h"],"mappings":"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"}
+{"version":3,"file":"scroll-lock-CxkP-oj1.js","sources":["src/internal/functional-components/dialog/component.tsx","src/utils/scroll-lock.ts"],"sourcesContent":["import type { FunctionalComponent as FC } from '@stencil/core';\nimport { h } from '@stencil/core';\n\nimport { bem } from '../../../schema/bem-registry';\nimport type { ModalVariantPropType } from '../../../schema/props/variant/modal';\nimport clsx from '../../../utils/clsx';\nimport type { FunctionalComponentProps } from '../generic-types';\nimport type { DialogApi } from './api';\n\nconst dialogBem = bem.forBlock('kol-dialog');\nconst modalBem = bem.forBlock('kol-modal');\n\n/**\n * The dialog's own block classes: `kol-dialog`, the deprecated `kol-modal` alias, and the variant\n * of both as an element-style suffix. Every theme addresses all four names, so they are rendered\n * verbatim.\n */\nexport const dialogBlockClass = (variant: ModalVariantPropType): string => clsx(dialogBem(), modalBem(), dialogBem(variant), modalBem(variant));\n\nexport type DialogFCProps = Pick<FunctionalComponentProps<DialogApi>, 'class' | 'handleCancel' | 'handleClose' | 'label' | 'modal' | 'refDialog'> & {\n\t/**\n\t * Class names of the block this dialog belongs to. `kol-dialog` renders its own block, the\n\t * deprecated `kol-modal` alias and the variant of both; `kol-drawer` renders its\n\t * `kol-drawer__dialog` element class. Every theme styles the two differently — a drawer that\n\t * carried the dialog classes would inherit the dialog's background, radius and backdrop — so\n\t * neither is hard-coded here.\n\t */\n\tblockClass: string;\n\t/**\n\t * DOM id of the heading that labels the dialog. Without one the dialog falls back to\n\t * `aria-label`, which is what the blank variant needs: it renders no heading.\n\t */\n\tlabelledBy?: string;\n\t/** Width of the dialog. Left unset, the dialog keeps its intrinsic size. */\n\twidth?: string;\n};\n\n/**\n * The native `<dialog>` shell, shared by `kol-dialog`, the deprecated `kol-modal`, `kol-drawer` and\n * the settings menu of the table.\n *\n * It owns the element that provides `showModal()`, the top layer and the backdrop — and nothing\n * else. What the dialog contains is the consumer's composition, handed in as children: the dialog\n * renders its card or blank contents, the drawer its sliding wrapper around a card.\n *\n * Root from the `<dialog>` itself, not `BemRootNodeFC`: that always renders a `<div>`, and only the\n * native element carries the dialog semantics.\n *\n * `children` rather than a `<slot />`: Stencil derives light-DOM slot relocation from the JSX in the\n * element file, so each element supplies its own slot.\n */\nexport const DialogFC: FC<DialogFCProps> = (props, children) => {\n\tconst { blockClass, class: hostClass, handleCancel, handleClose, label, labelledBy, modal, refDialog, width } = props;\n\n\treturn (\n\t\t<dialog\n\t\t\taria-label={labelledBy ? undefined : label}\n\t\t\taria-labelledby={labelledBy}\n\t\t\taria-modal={modal ? 'true' : 'false'}\n\t\t\tclass={clsx(blockClass, hostClass)}\n\t\t\tonCancel={handleCancel}\n\t\t\tonClose={handleClose}\n\t\t\tref={refDialog}\n\t\t\tstyle={width ? { width } : undefined}\n\t\t>\n\t\t\t{children}\n\t\t</dialog>\n\t);\n};\n","/**\n * This file contains the functions used to lock the background scroll while\n * a modal overlay (dialog, modal, drawer) is open. The native `showModal()`\n * makes the background inert, but does not prevent the document from scrolling.\n */\n\n/**\n * This set contains all owners (component instances) currently holding the lock.\n * The scroll lock is released once the last owner unlocks.\n */\nconst SCROLL_LOCK_OWNERS: Set<unknown> = new Set();\n\nlet previousOverflow: string | null = null;\nlet previousPaddingRight: string | null = null;\n\n/**\n * Locks the document scroll for the given owner. The first lock stores the\n * current inline styles and hides the viewport scrollbar; the removed\n * scrollbar width is compensated with padding to avoid a layout shift.\n *\n * @param owner The component instance requesting the lock\n */\nexport function lockScroll(owner: unknown): void {\n\tif (typeof document === 'undefined' || typeof window === 'undefined') {\n\t\treturn;\n\t}\n\tif (SCROLL_LOCK_OWNERS.has(owner)) {\n\t\treturn;\n\t}\n\n\tif (SCROLL_LOCK_OWNERS.size === 0) {\n\t\tconst docEl = document.documentElement;\n\t\tpreviousOverflow = docEl.style.getPropertyValue('overflow');\n\t\tpreviousPaddingRight = docEl.style.getPropertyValue('padding-right');\n\n\t\t// Measure before hiding the scrollbar; overlay scrollbars yield 0.\n\t\tconst scrollbarWidth = window.innerWidth - docEl.clientWidth;\n\t\tif (scrollbarWidth > 0) {\n\t\t\tconst currentPaddingRight = Number.parseFloat(window.getComputedStyle(docEl).paddingRight) || 0;\n\t\t\tdocEl.style.setProperty('padding-right', `${currentPaddingRight + scrollbarWidth}px`);\n\t\t}\n\t\tdocEl.style.setProperty('overflow', 'hidden');\n\t}\n\n\tSCROLL_LOCK_OWNERS.add(owner);\n}\n\n/**\n * Releases the scroll lock for the given owner. Calling it for an owner that\n * does not hold a lock is a no-op, so unlocking is idempotent per owner. The\n * previous inline styles are restored once the last owner unlocks.\n *\n * @param owner The component instance releasing the lock\n */\nexport function unlockScroll(owner: unknown): void {\n\tif (typeof document === 'undefined' || typeof window === 'undefined') {\n\t\treturn;\n\t}\n\tif (!SCROLL_LOCK_OWNERS.delete(owner)) {\n\t\treturn;\n\t}\n\n\tif (SCROLL_LOCK_OWNERS.size === 0) {\n\t\tconst docEl = document.documentElement;\n\t\tif (previousOverflow) {\n\t\t\tdocEl.style.setProperty('overflow', previousOverflow);\n\t\t} else {\n\t\t\tdocEl.style.removeProperty('overflow');\n\t\t}\n\t\tif (previousPaddingRight) {\n\t\t\tdocEl.style.setProperty('padding-right', previousPaddingRight);\n\t\t} else {\n\t\t\tdocEl.style.removeProperty('padding-right');\n\t\t}\n\t\tpreviousOverflow = null;\n\t\tpreviousPaddingRight = null;\n\t}\n}\n"],"names":["bem","clsx","h"],"mappings":"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"}

package/dist/cjs/{suggestions-quLXODgi.js → suggestions-BDfdREI5.js}

@@ -5,8 +5,8 @@
 
 var baseWebComponent = require('./base-web-component-DK5Y-vq5.js');
 var tslib_es6 = require('./tslib.es6-Cm0ytgPY.js');
-var index = require('./index-RAfZF5x0.js');
-var dev_utils = require('./dev.utils-DybQ4euF.js');
+var index = require('./index-CjTDipy9.js');
+var dev_utils = require('./dev.utils-CIsKrkDZ.js');
 
 const autoCompleteProp = baseWebComponent.createPropDefinition('autoComplete', 'off', baseWebComponent.normalizeString, (value) => value.length > 0);
 
@@ -20,6 +20,6 @@ const SuggestionsFC = (_a) => {
 
 exports.SuggestionsFC = SuggestionsFC;
 exports.autoCompleteProp = autoCompleteProp;
-//# sourceMappingURL=suggestions-quLXODgi.js.map
+//# sourceMappingURL=suggestions-BDfdREI5.js.map
 
-//# sourceMappingURL=suggestions-quLXODgi.js.map
+//# sourceMappingURL=suggestions-BDfdREI5.js.map

package/dist/cjs/{suggestions-quLXODgi.js.map → suggestions-BDfdREI5.js.map}

@@ -1 +1 @@
-{"version":3,"file":"suggestions-quLXODgi.js","sources":["src/internal/props/auto-complete.ts","src/internal/functional-components/form-field/suggestions.tsx"],"sourcesContent":["import type { AutoCompletePropType } from '../../schema';\nimport type { SimpleProp } from './helpers/factory';\nimport { createPropDefinition } from './helpers/factory';\nimport { normalizeString } from './helpers/normalizers';\n\n/**\n * Auto complete prop for form fields\n *\n * Description:\n * The value of the native `autocomplete` attribute: `'on'`, `'off'` or an autofill token such as\n * `'email'`. Any non-empty string is accepted, the default is `'off'`.\n *\n * @see https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill\n * @see https://www.w3.org/WAI/WCAG21/Understanding/identify-input-purpose.html\n */\nexport type AutoCompleteProp = SimpleProp<'autoComplete', AutoCompletePropType>;\nexport const autoCompleteProp = createPropDefinition<AutoCompleteProp>('autoComplete', 'off', normalizeString, (value) => value.length > 0);\n","import { h, type FunctionalComponent as FC } from '@stencil/core';\nimport type { JSXBase } from '@stencil/core/internal';\nimport type { W3CInputValue } from '../../../schema';\nimport { createRelatedUniqueId } from '../../../utils/dev.utils';\n\nexport type SuggestionsFCProps = JSXBase.HTMLAttributes<HTMLDataListElement> & {\n\t/** ID of the input; the datalist gets the related `list` ID. */\n\tid: string;\n\tsuggestions: W3CInputValue[];\n};\n\n/** Datalist with the suggested values of an input. */\nexport const SuggestionsFC: FC<SuggestionsFCProps> = ({ id, suggestions, ...other }) => {\n\tif (!suggestions) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<datalist id={createRelatedUniqueId(id, 'list')} {...other}>\n\t\t\t{suggestions.map((option: W3CInputValue) => (\n\t\t\t\t<option value={option} />\n\t\t\t))}\n\t\t</datalist>\n\t);\n};\n"],"names":["createPropDefinition","normalizeString","__rest","h","createRelatedUniqueId"],"mappings":";;;;;;;;;;MAgBa,gBAAgB,GAAGA,qCAAoB,CAAmB,cAAc,EAAE,KAAK,EAAEC,gCAAe,EAAE,CAAC,KAAK,KAAK,KAAK,CAAC,MAAM,GAAG,CAAC;;ACJ7H,MAAA,aAAa,GAA2B,CAAC,EAA6B,KAAI;QAAjC,EAAE,EAAE,EAAE,WAAW,EAAA,GAAA,EAAY,EAAP,KAAK,GAAAC,gBAAA,CAAA,EAAA,EAA3B,qBAA6B,CAAF;IAChF,IAAI,CAAC,WAAW,EAAE;AACjB,QAAA,OAAO,IAAI;;IAGZ,QACCC,OAAA,CAAA,UAAA,EAAA,MAAA,CAAA,MAAA,CAAA,EAAU,EAAE,EAAEC,+BAAqB,CAAC,EAAE,EAAE,MAAM,CAAC,EAAA,EAAM,KAAK,CAAA,EACxD,WAAW,CAAC,GAAG,CAAC,CAAC,MAAqB,MACtCD,OAAQ,CAAA,QAAA,EAAA,EAAA,KAAK,EAAE,MAAM,EAAI,CAAA,CACzB,CAAC,CACQ;AAEb;;;;;"}
+{"version":3,"file":"suggestions-BDfdREI5.js","sources":["src/internal/props/auto-complete.ts","src/internal/functional-components/form-field/suggestions.tsx"],"sourcesContent":["import type { AutoCompletePropType } from '../../schema';\nimport type { SimpleProp } from './helpers/factory';\nimport { createPropDefinition } from './helpers/factory';\nimport { normalizeString } from './helpers/normalizers';\n\n/**\n * Auto complete prop for form fields\n *\n * Description:\n * The value of the native `autocomplete` attribute: `'on'`, `'off'` or an autofill token such as\n * `'email'`. Any non-empty string is accepted, the default is `'off'`.\n *\n * @see https://html.spec.whatwg.org/multipage/form-control-infrastructure.html#autofill\n * @see https://www.w3.org/WAI/WCAG21/Understanding/identify-input-purpose.html\n */\nexport type AutoCompleteProp = SimpleProp<'autoComplete', AutoCompletePropType>;\nexport const autoCompleteProp = createPropDefinition<AutoCompleteProp>('autoComplete', 'off', normalizeString, (value) => value.length > 0);\n","import { h, type FunctionalComponent as FC } from '@stencil/core';\nimport type { JSXBase } from '@stencil/core/internal';\nimport type { W3CInputValue } from '../../../schema';\nimport { createRelatedUniqueId } from '../../../utils/dev.utils';\n\nexport type SuggestionsFCProps = JSXBase.HTMLAttributes<HTMLDataListElement> & {\n\t/** ID of the input; the datalist gets the related `list` ID. */\n\tid: string;\n\tsuggestions: W3CInputValue[];\n};\n\n/** Datalist with the suggested values of an input. */\nexport const SuggestionsFC: FC<SuggestionsFCProps> = ({ id, suggestions, ...other }) => {\n\tif (!suggestions) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<datalist id={createRelatedUniqueId(id, 'list')} {...other}>\n\t\t\t{suggestions.map((option: W3CInputValue) => (\n\t\t\t\t<option value={option} />\n\t\t\t))}\n\t\t</datalist>\n\t);\n};\n"],"names":["createPropDefinition","normalizeString","__rest","h","createRelatedUniqueId"],"mappings":";;;;;;;;;;MAgBa,gBAAgB,GAAGA,qCAAoB,CAAmB,cAAc,EAAE,KAAK,EAAEC,gCAAe,EAAE,CAAC,KAAK,KAAK,KAAK,CAAC,MAAM,GAAG,CAAC;;ACJ7H,MAAA,aAAa,GAA2B,CAAC,EAA6B,KAAI;QAAjC,EAAE,EAAE,EAAE,WAAW,EAAA,GAAA,EAAY,EAAP,KAAK,GAAAC,gBAAA,CAAA,EAAA,EAA3B,qBAA6B,CAAF;IAChF,IAAI,CAAC,WAAW,EAAE;AACjB,QAAA,OAAO,IAAI;;IAGZ,QACCC,OAAA,CAAA,UAAA,EAAA,MAAA,CAAA,MAAA,CAAA,EAAU,EAAE,EAAEC,+BAAqB,CAAC,EAAE,EAAE,MAAM,CAAC,EAAA,EAAM,KAAK,CAAA,EACxD,WAAW,CAAC,GAAG,CAAC,CAAC,MAAqB,MACtCD,OAAQ,CAAA,QAAA,EAAA,EAAA,KAAK,EAAE,MAAM,EAAI,CAAA,CACzB,CAAC,CACQ;AAEb;;;;;"}

package/dist/cjs/test-component.cjs.entry.js

@@ -3,7 +3,7 @@
  */
 'use strict';
 
-var index = require('./index-RAfZF5x0.js');
+var index = require('./index-CjTDipy9.js');
 require('./common-B9-LvLNa.js');
 
 const TestComponent = class {

package/dist/cjs/{toggle-handler-CENFGRWT.js → toggle-handler-Bm0e15f-.js}

@@ -9,12 +9,12 @@ var baseWebComponent = require('./base-web-component-DK5Y-vq5.js');
 var disabled = require('./disabled-B8tOrtj_.js');
 var label = require('./label-DVnpZWVb.js');
 var open = require('./open-XeILuCji.js');
-var index = require('./index-RAfZF5x0.js');
-var Heading = require('./Heading-yiwXjRrz.js');
+var index = require('./index-CjTDipy9.js');
+var Heading = require('./Heading-CFe7VL6f.js');
 var clsx = require('./clsx-Bm_HQUnh.js');
 var elementInteraction = require('./element-interaction-7FI_z19L.js');
 var blockBem = require('./block-bem-D7PDS6kC.js');
-var component = require('./component-Dd-PS3jp.js');
+var component = require('./component-K9JCKLMC.js');
 var events = require('./events-PISRnO5c.js');
 
 const collapsibleCallbacksProp = baseWebComponent.createCallbacksPropDefinition();
@@ -104,6 +104,6 @@ exports.collapsibleCallbacksProp = collapsibleCallbacksProp;
 exports.collapsiblePropsConfig = collapsiblePropsConfig;
 exports.createCollapsibleOpenAnimation = createCollapsibleOpenAnimation;
 exports.createCollapsibleToggleHandler = createCollapsibleToggleHandler;
-//# sourceMappingURL=toggle-handler-CENFGRWT.js.map
+//# sourceMappingURL=toggle-handler-Bm0e15f-.js.map
 
-//# sourceMappingURL=toggle-handler-CENFGRWT.js.map
+//# sourceMappingURL=toggle-handler-Bm0e15f-.js.map

package/dist/cjs/{toggle-handler-CENFGRWT.js.map → toggle-handler-Bm0e15f-.js.map}

@@ -1 +1 @@
-{"version":3,"file":"toggle-handler-CENFGRWT.js","sources":["src/internal/props/collapsible-callbacks.ts","src/internal/functional-components/collapsible/api.tsx","src/internal/functional-components/collapsible/component.tsx","src/internal/functional-components/collapsible/open-animation.ts","src/internal/functional-components/collapsible/toggle-handler.ts"],"sourcesContent":["import type { CollapsibleCallbacksPropType } from '../../schema';\nimport type { SimpleProp } from './helpers/factory';\nimport { createCallbacksPropDefinition } from './helpers/factory';\n\nexport type CollapsibleCallbacksProp = SimpleProp<'on', CollapsibleCallbacksPropType<boolean>>;\n\n/**\n * Callbacks prop shared by `kol-accordion` and `kol-details` — both expose the same\n * `onClick`/`onToggle` pair on their heading toggle button.\n */\nexport const collapsibleCallbacksProp = createCallbacksPropDefinition<CollapsibleCallbacksPropType<boolean>>();\n","import type { IconsPropType, KolFocusOptions } from '../../../schema';\nimport { collapsibleCallbacksProp, disabledProp, labelProp, levelProp, openProp } from '../../props';\nimport type { ApiFromConfig, PropsConfigShape } from '../generic-types';\n\n/**\n * Props configuration shared by the collapsible components (`kol-accordion`, `kol-details`).\n *\n * `label` is the only required prop. All others are optional.\n *\n * Notes on prop choices:\n * - `labelProp` (not `labelWithExpertSlotProp`): the label labels the toggle button and has no\n *   expert slot. It keeps the shared 2–80 character validation and accessibility hints.\n * - `openProp`: the toggle state. The public `_open` prop stays mutable and reflected on the web\n *   component; the render prop mirrors it for the functional component.\n */\nexport const collapsiblePropsConfig = {\n\toptional: [collapsibleCallbacksProp, disabledProp, levelProp, openProp],\n\trequired: [labelProp],\n} as const satisfies PropsConfigShape;\n\nexport type CollapsibleApi = ApiFromConfig<\n\ttypeof collapsiblePropsConfig,\n\t{\n\t\tCallbacks: {\n\t\t\t/**\n\t\t\t * Click handler bound to the `<summary>` element. Implemented by the web component,\n\t\t\t * which suppresses the user agent's own toggle (so the collapse can be animated), flips\n\t\t\t * the mutable `_open` prop and — delayed so the reflected attribute is already updated —\n\t\t\t * dispatches the custom `KolEvent.click`/`KolEvent.toggle` events on the host element\n\t\t\t * and invokes the consumer's `onClick`/`onToggle` callbacks.\n\t\t\t */\n\t\t\ttoggle: (event: MouseEvent) => void;\n\t\t};\n\t\tMethods: {\n\t\t\tclick: () => void;\n\t\t\tfocus: (options?: KolFocusOptions) => void;\n\t\t};\n\t\tRefs: {\n\t\t\t/** The `<summary>` element — the disclosure control `focus()` and `click()` delegate to. */\n\t\t\theadingButton: HTMLElement;\n\t\t};\n\t\tStates: {\n\t\t\t/**\n\t\t\t * DOM id of the collapsible content region, referenced by the summary's aria-controls\n\t\t\t * attribute. Derived once per web component instance.\n\t\t\t */\n\t\t\tcontrolId: string;\n\t\t\t/**\n\t\t\t * Whether the `open` attribute is set on `<details>`. Tracks {@link expanded}, except\n\t\t\t * while collapsing: the attribute has to outlive the class so the user agent keeps the\n\t\t\t * content rendered until the grid transition has finished.\n\t\t\t */\n\t\t\tdetailsOpen: boolean;\n\t\t\t/**\n\t\t\t * Whether the collapsible is visually expanded — drives the `--open` block modifier\n\t\t\t * and therefore the transition. Set one frame after {@link detailsOpen} when opening,\n\t\t\t * so the transition has a from-state to start from.\n\t\t\t */\n\t\t\texpanded: boolean;\n\t\t\t/**\n\t\t\t * DOM id of the heading toggle button, referenced by the content region's\n\t\t\t * aria-labelledby attribute. Derived once per web component instance.\n\t\t\t */\n\t\t\theadingId: string;\n\t\t\t/**\n\t\t\t * Duration of the open/close transition in milliseconds, from the theme's\n\t\t\t * `collapsibleTransitionMs` feature flag. Rendered as the CSS custom property\n\t\t\t * `--collapsible-transition-duration` on `<details>` so the stylesheet and the timer\n\t\t\t * that keeps the `open` attribute alive share one value.\n\t\t\t */\n\t\t\ttransitionMs: number;\n\t\t};\n\t}\n>;\n\n/**\n * The BEM blocks that render through `CollapsibleFC`.\n *\n * Both are registered in `schema/bem-registry.ts` with the identical element set\n * (`content`, `heading`, `wrapper`, `wrapper-animation`) and modifier set (`disabled`, `open`),\n * which is what lets one functional component serve both: `keyof` over the union of their maps is\n * still exactly those names.\n */\nexport type CollapsibleBlock = 'kol-accordion' | 'kol-details';\n\n/**\n * The per-component differences of the otherwise identical collapsible markup.\n *\n * These are neither public props nor component state, so they stay out of {@link CollapsibleApi}\n * and are passed as plain arguments by the rendering web component — the same way\n * `BemRootNodeFC` and `AriaDescriptionSpanFC` take their own local prop types.\n */\nexport type CollapsibleVariant = {\n\t/** BEM block of the rendering component. */\n\tblock: CollapsibleBlock;\n\t/**\n\t * Icon of the toggle control (`<summary>`). `kol-accordion` swaps it with the open state,\n\t * `kol-details` keeps one icon and rotates it via CSS.\n\t */\n\ticons: IconsPropType;\n\t/** Additional class on the content region — `kol-details` adds `indented-text`. */\n\tcontentClass?: string;\n};\n","import type { FunctionalComponent as FC } from '@stencil/core';\nimport { h } from '@stencil/core';\n\nimport KolHeadingFc from '../../../functional-components/Heading/Heading';\nimport clsx from '../../../utils/clsx';\nimport { preventFocus } from '../../../utils/element-interaction';\nimport { getBlockBem } from '../bem-root-node/block-bem';\nimport type { FunctionalComponentProps } from '../generic-types';\nimport { SpanFC } from '../span/component';\nimport type { CollapsibleApi, CollapsibleVariant } from './api';\n\n/**\n * Renders a collapsible — `kol-accordion` and `kol-details` — on the native `<details>`/`<summary>`\n * elements.\n *\n * `<summary>` is the disclosure control: one tab stop, keyboard handling and the expanded state\n * come from the user agent. It has to be the first child of `<details>`, so the heading sits inside\n * the control; label and icon render through `SpanFC`.\n *\n * `level` is forwarded as `level ?? 0` because `KolHeadingFc` falls back to level 1 on `undefined`,\n * while the collapsible's own `_level` default is 0 — the bold `<strong>` rendering.\n *\n * `open` on `<details>` and the `--open` modifier are driven separately: the attribute has to be set\n * before the modifier flips so the grid transition has a from-state, and it has to outlive the\n * modifier on close so the collapse is visible. The web component owns that sequencing; the FC only\n * renders what it is told.\n */\nexport const CollapsibleFC: FC<FunctionalComponentProps<CollapsibleApi> & CollapsibleVariant> = (\n\t{ block, contentClass, controlId, detailsOpen, disabled, expanded, handleToggle, headingId, icons, label, level, refHeadingButton, transitionMs },\n\tchildren,\n) => {\n\tconst blockBem = getBlockBem(block);\n\n\treturn (\n\t\t<details\n\t\t\tclass={blockBem({\n\t\t\t\tdisabled: disabled === true,\n\t\t\t\topen: expanded === true,\n\t\t\t})}\n\t\t\topen={detailsOpen === true}\n\t\t\tstyle={{ '--collapsible-transition-duration': `${transitionMs}ms` }}\n\t\t>\n\t\t\t<summary\n\t\t\t\taria-controls={controlId}\n\t\t\t\taria-disabled={disabled === true ? 'true' : undefined}\n\t\t\t\tclass={blockBem('heading')}\n\t\t\t\tid={headingId}\n\t\t\t\tonClick={handleToggle}\n\t\t\t\tonMouseDown={disabled === true ? preventFocus : undefined}\n\t\t\t\tref={refHeadingButton}\n\t\t\t\ttabIndex={disabled === true ? -1 : undefined}\n\t\t\t>\n\t\t\t\t<KolHeadingFc level={level ?? 0}>\n\t\t\t\t\t<SpanFC icons={icons} label={label} />\n\t\t\t\t</KolHeadingFc>\n\t\t\t</summary>\n\t\t\t<div class={blockBem('wrapper')}>\n\t\t\t\t<div class={blockBem('wrapper-animation')}>\n\t\t\t\t\t<div\n\t\t\t\t\t\taria-hidden={expanded === false ? 'true' : undefined}\n\t\t\t\t\t\taria-labelledby={headingId}\n\t\t\t\t\t\tclass={clsx(blockBem('content'), contentClass)}\n\t\t\t\t\t\tid={controlId}\n\t\t\t\t\t\trole=\"region\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{children}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</details>\n\t);\n};\n","/**\n * Fallback duration of the open/close transition when the theme declares no\n * `collapsibleTransitionMs` feature flag. Mirrors the default of\n * `--collapsible-transition-duration` in `components/@shared/_collapsible.mixin.scss`.\n */\nexport const DEFAULT_COLLAPSIBLE_TRANSITION_MS = 300;\n\n/** Runs `callback` on the next frame; falls back to a macrotask where `requestAnimationFrame` is unavailable (SSR). */\nfunction onNextFrame(callback: () => void): () => void {\n\tif (typeof requestAnimationFrame === 'function') {\n\t\tconst handle = requestAnimationFrame(callback);\n\t\treturn () => cancelAnimationFrame(handle);\n\t}\n\tconst handle = setTimeout(callback, 0);\n\treturn () => clearTimeout(handle);\n}\n\nexport type CollapsibleOpenAnimationContext = {\n\t/** Duration of the CSS transition; the `open` attribute is kept on `<details>` until it has elapsed. */\n\tgetTransitionMs: () => number;\n\t/** Sets the `open` attribute on `<details>`. */\n\tsetDetailsOpen: (value: boolean) => void;\n\t/** Sets the `--open` block modifier, which drives the transition. */\n\tsetExpanded: (value: boolean) => void;\n};\n\nexport type CollapsibleOpenAnimation = {\n\t/**\n\t * Applies an open state to the two rendered flags.\n\t *\n\t * With `animate`, opening sets the `open` attribute first and the modifier one frame later — the\n\t * content is `display:none` while `<details>` is closed, so without that gap the transition has\n\t * no from-state and the panel snaps open. Collapsing does the reverse: the modifier goes first\n\t * and the attribute is removed once the transition has run.\n\t */\n\tsyncOpen: (open: boolean, animate: boolean) => void;\n\t/** Cancels pending frames and timers. Call from `disconnectedCallback`. */\n\tdispose: () => void;\n};\n\nexport function createCollapsibleOpenAnimation({ getTransitionMs, setDetailsOpen, setExpanded }: CollapsibleOpenAnimationContext): CollapsibleOpenAnimation {\n\tlet cancelPendingFrame: (() => void) | undefined;\n\tlet collapseTimeout: ReturnType<typeof setTimeout> | undefined;\n\n\tconst clearPending = (): void => {\n\t\tcancelPendingFrame?.();\n\t\tcancelPendingFrame = undefined;\n\t\tclearTimeout(collapseTimeout);\n\t\tcollapseTimeout = undefined;\n\t};\n\n\treturn {\n\t\tsyncOpen(open, animate) {\n\t\t\tclearPending();\n\n\t\t\tif (open) {\n\t\t\t\tsetDetailsOpen(true);\n\t\t\t\tif (animate) {\n\t\t\t\t\tcancelPendingFrame = onNextFrame(() => setExpanded(true));\n\t\t\t\t} else {\n\t\t\t\t\tsetExpanded(true);\n\t\t\t\t}\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tsetExpanded(false);\n\t\t\tif (animate) {\n\t\t\t\tcollapseTimeout = setTimeout(() => setDetailsOpen(false), getTransitionMs());\n\t\t\t} else {\n\t\t\t\tsetDetailsOpen(false);\n\t\t\t}\n\t\t},\n\t\tdispose: clearPending,\n\t};\n}\n","import type { CollapsibleCallbacksPropType } from '../../../schema';\nimport { dispatchDomEvent, KolEvent } from '../../../utils/events';\n\n/**\n * Delay between flipping `_open` and announcing the new state.\n *\n * `_open` is declared `@Prop({ mutable: true, reflect: true })`, and Stencil writes the reflected\n * attribute asynchronously. Announcing synchronously would let a consumer callback read a stale\n * `_open` attribute off the host, so the announcement is deferred by one macrotask window.\n */\nconst ANNOUNCE_DELAY_MS = 25;\n\nexport type CollapsibleToggleContext = {\n\t/** The host element the DOM events are dispatched on. */\n\tgetHost: () => HTMLElement | undefined;\n\t/** The normalized `_on` render prop. Read at announce time so late assignments are picked up. */\n\tgetOn: () => CollapsibleCallbacksPropType<boolean>;\n\t/** Whether the collapsible currently refuses interaction. */\n\tisDisabled: () => boolean;\n\t/** The current normalized open state. */\n\tisOpen: () => boolean;\n\t/** Writes the component's mutable `_open` prop, which its watcher turns into rendered state. */\n\tsetOpen: (open: boolean) => void;\n};\n\n/**\n * Builds the `<summary>` click handler shared by `kol-accordion` and `kol-details`.\n *\n * The user agent's own toggle is suppressed: it flips `open` synchronously, which skips the\n * collapse transition and races the component's controlled state. Everything else follows the\n * native element — `<summary>` is still the focusable control, and Enter/Space arrive here as\n * clicks, so keyboard operation needs no extra handling.\n *\n * The new state is captured synchronously, before the deferred announcement, so two quick toggles\n * report their own value rather than the same final one twice.\n */\nexport function createCollapsibleToggleHandler({ getHost, getOn, isDisabled, isOpen, setOpen }: CollapsibleToggleContext): (event: MouseEvent) => void {\n\treturn (event: MouseEvent): void => {\n\t\tevent.preventDefault();\n\n\t\tif (isDisabled()) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst open = !isOpen();\n\t\tsetOpen(open);\n\n\t\tsetTimeout(() => {\n\t\t\tconst host = getHost();\n\t\t\tif (host) {\n\t\t\t\tdispatchDomEvent(host, KolEvent.click, open);\n\t\t\t\tdispatchDomEvent(host, KolEvent.toggle, open);\n\t\t\t}\n\n\t\t\tconst on = getOn();\n\t\t\ton.onClick?.(event, open);\n\t\t\ton.onToggle?.(event, open);\n\t\t}, ANNOUNCE_DELAY_MS);\n\t};\n}\n"],"names":["createCallbacksPropDefinition","disabledProp","levelProp","openProp","labelProp","blockBem","getBlockBem","h","preventFocus","KolHeadingFc","SpanFC","clsx","dispatchDomEvent","KolEvent"],"mappings":"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"}
+{"version":3,"file":"toggle-handler-Bm0e15f-.js","sources":["src/internal/props/collapsible-callbacks.ts","src/internal/functional-components/collapsible/api.tsx","src/internal/functional-components/collapsible/component.tsx","src/internal/functional-components/collapsible/open-animation.ts","src/internal/functional-components/collapsible/toggle-handler.ts"],"sourcesContent":["import type { CollapsibleCallbacksPropType } from '../../schema';\nimport type { SimpleProp } from './helpers/factory';\nimport { createCallbacksPropDefinition } from './helpers/factory';\n\nexport type CollapsibleCallbacksProp = SimpleProp<'on', CollapsibleCallbacksPropType<boolean>>;\n\n/**\n * Callbacks prop shared by `kol-accordion` and `kol-details` — both expose the same\n * `onClick`/`onToggle` pair on their heading toggle button.\n */\nexport const collapsibleCallbacksProp = createCallbacksPropDefinition<CollapsibleCallbacksPropType<boolean>>();\n","import type { IconsPropType, KolFocusOptions } from '../../../schema';\nimport { collapsibleCallbacksProp, disabledProp, labelProp, levelProp, openProp } from '../../props';\nimport type { ApiFromConfig, PropsConfigShape } from '../generic-types';\n\n/**\n * Props configuration shared by the collapsible components (`kol-accordion`, `kol-details`).\n *\n * `label` is the only required prop. All others are optional.\n *\n * Notes on prop choices:\n * - `labelProp` (not `labelWithExpertSlotProp`): the label labels the toggle button and has no\n *   expert slot. It keeps the shared 2–80 character validation and accessibility hints.\n * - `openProp`: the toggle state. The public `_open` prop stays mutable and reflected on the web\n *   component; the render prop mirrors it for the functional component.\n */\nexport const collapsiblePropsConfig = {\n\toptional: [collapsibleCallbacksProp, disabledProp, levelProp, openProp],\n\trequired: [labelProp],\n} as const satisfies PropsConfigShape;\n\nexport type CollapsibleApi = ApiFromConfig<\n\ttypeof collapsiblePropsConfig,\n\t{\n\t\tCallbacks: {\n\t\t\t/**\n\t\t\t * Click handler bound to the `<summary>` element. Implemented by the web component,\n\t\t\t * which suppresses the user agent's own toggle (so the collapse can be animated), flips\n\t\t\t * the mutable `_open` prop and — delayed so the reflected attribute is already updated —\n\t\t\t * dispatches the custom `KolEvent.click`/`KolEvent.toggle` events on the host element\n\t\t\t * and invokes the consumer's `onClick`/`onToggle` callbacks.\n\t\t\t */\n\t\t\ttoggle: (event: MouseEvent) => void;\n\t\t};\n\t\tMethods: {\n\t\t\tclick: () => void;\n\t\t\tfocus: (options?: KolFocusOptions) => void;\n\t\t};\n\t\tRefs: {\n\t\t\t/** The `<summary>` element — the disclosure control `focus()` and `click()` delegate to. */\n\t\t\theadingButton: HTMLElement;\n\t\t};\n\t\tStates: {\n\t\t\t/**\n\t\t\t * DOM id of the collapsible content region, referenced by the summary's aria-controls\n\t\t\t * attribute. Derived once per web component instance.\n\t\t\t */\n\t\t\tcontrolId: string;\n\t\t\t/**\n\t\t\t * Whether the `open` attribute is set on `<details>`. Tracks {@link expanded}, except\n\t\t\t * while collapsing: the attribute has to outlive the class so the user agent keeps the\n\t\t\t * content rendered until the grid transition has finished.\n\t\t\t */\n\t\t\tdetailsOpen: boolean;\n\t\t\t/**\n\t\t\t * Whether the collapsible is visually expanded — drives the `--open` block modifier\n\t\t\t * and therefore the transition. Set one frame after {@link detailsOpen} when opening,\n\t\t\t * so the transition has a from-state to start from.\n\t\t\t */\n\t\t\texpanded: boolean;\n\t\t\t/**\n\t\t\t * DOM id of the heading toggle button, referenced by the content region's\n\t\t\t * aria-labelledby attribute. Derived once per web component instance.\n\t\t\t */\n\t\t\theadingId: string;\n\t\t\t/**\n\t\t\t * Duration of the open/close transition in milliseconds, from the theme's\n\t\t\t * `collapsibleTransitionMs` feature flag. Rendered as the CSS custom property\n\t\t\t * `--collapsible-transition-duration` on `<details>` so the stylesheet and the timer\n\t\t\t * that keeps the `open` attribute alive share one value.\n\t\t\t */\n\t\t\ttransitionMs: number;\n\t\t};\n\t}\n>;\n\n/**\n * The BEM blocks that render through `CollapsibleFC`.\n *\n * Both are registered in `schema/bem-registry.ts` with the identical element set\n * (`content`, `heading`, `wrapper`, `wrapper-animation`) and modifier set (`disabled`, `open`),\n * which is what lets one functional component serve both: `keyof` over the union of their maps is\n * still exactly those names.\n */\nexport type CollapsibleBlock = 'kol-accordion' | 'kol-details';\n\n/**\n * The per-component differences of the otherwise identical collapsible markup.\n *\n * These are neither public props nor component state, so they stay out of {@link CollapsibleApi}\n * and are passed as plain arguments by the rendering web component — the same way\n * `BemRootNodeFC` and `AriaDescriptionSpanFC` take their own local prop types.\n */\nexport type CollapsibleVariant = {\n\t/** BEM block of the rendering component. */\n\tblock: CollapsibleBlock;\n\t/**\n\t * Icon of the toggle control (`<summary>`). `kol-accordion` swaps it with the open state,\n\t * `kol-details` keeps one icon and rotates it via CSS.\n\t */\n\ticons: IconsPropType;\n\t/** Additional class on the content region — `kol-details` adds `indented-text`. */\n\tcontentClass?: string;\n};\n","import type { FunctionalComponent as FC } from '@stencil/core';\nimport { h } from '@stencil/core';\n\nimport KolHeadingFc from '../../../functional-components/Heading/Heading';\nimport clsx from '../../../utils/clsx';\nimport { preventFocus } from '../../../utils/element-interaction';\nimport { getBlockBem } from '../bem-root-node/block-bem';\nimport type { FunctionalComponentProps } from '../generic-types';\nimport { SpanFC } from '../span/component';\nimport type { CollapsibleApi, CollapsibleVariant } from './api';\n\n/**\n * Renders a collapsible — `kol-accordion` and `kol-details` — on the native `<details>`/`<summary>`\n * elements.\n *\n * `<summary>` is the disclosure control: one tab stop, keyboard handling and the expanded state\n * come from the user agent. It has to be the first child of `<details>`, so the heading sits inside\n * the control; label and icon render through `SpanFC`.\n *\n * `level` is forwarded as `level ?? 0` because `KolHeadingFc` falls back to level 1 on `undefined`,\n * while the collapsible's own `_level` default is 0 — the bold `<strong>` rendering.\n *\n * `open` on `<details>` and the `--open` modifier are driven separately: the attribute has to be set\n * before the modifier flips so the grid transition has a from-state, and it has to outlive the\n * modifier on close so the collapse is visible. The web component owns that sequencing; the FC only\n * renders what it is told.\n */\nexport const CollapsibleFC: FC<FunctionalComponentProps<CollapsibleApi> & CollapsibleVariant> = (\n\t{ block, contentClass, controlId, detailsOpen, disabled, expanded, handleToggle, headingId, icons, label, level, refHeadingButton, transitionMs },\n\tchildren,\n) => {\n\tconst blockBem = getBlockBem(block);\n\n\treturn (\n\t\t<details\n\t\t\tclass={blockBem({\n\t\t\t\tdisabled: disabled === true,\n\t\t\t\topen: expanded === true,\n\t\t\t})}\n\t\t\topen={detailsOpen === true}\n\t\t\tstyle={{ '--collapsible-transition-duration': `${transitionMs}ms` }}\n\t\t>\n\t\t\t<summary\n\t\t\t\taria-controls={controlId}\n\t\t\t\taria-disabled={disabled === true ? 'true' : undefined}\n\t\t\t\tclass={blockBem('heading')}\n\t\t\t\tid={headingId}\n\t\t\t\tonClick={handleToggle}\n\t\t\t\tonMouseDown={disabled === true ? preventFocus : undefined}\n\t\t\t\tref={refHeadingButton}\n\t\t\t\ttabIndex={disabled === true ? -1 : undefined}\n\t\t\t>\n\t\t\t\t<KolHeadingFc level={level ?? 0}>\n\t\t\t\t\t<SpanFC icons={icons} label={label} />\n\t\t\t\t</KolHeadingFc>\n\t\t\t</summary>\n\t\t\t<div class={blockBem('wrapper')}>\n\t\t\t\t<div class={blockBem('wrapper-animation')}>\n\t\t\t\t\t<div\n\t\t\t\t\t\taria-hidden={expanded === false ? 'true' : undefined}\n\t\t\t\t\t\taria-labelledby={headingId}\n\t\t\t\t\t\tclass={clsx(blockBem('content'), contentClass)}\n\t\t\t\t\t\tid={controlId}\n\t\t\t\t\t\trole=\"region\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{children}\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</details>\n\t);\n};\n","/**\n * Fallback duration of the open/close transition when the theme declares no\n * `collapsibleTransitionMs` feature flag. Mirrors the default of\n * `--collapsible-transition-duration` in `components/@shared/_collapsible.mixin.scss`.\n */\nexport const DEFAULT_COLLAPSIBLE_TRANSITION_MS = 300;\n\n/** Runs `callback` on the next frame; falls back to a macrotask where `requestAnimationFrame` is unavailable (SSR). */\nfunction onNextFrame(callback: () => void): () => void {\n\tif (typeof requestAnimationFrame === 'function') {\n\t\tconst handle = requestAnimationFrame(callback);\n\t\treturn () => cancelAnimationFrame(handle);\n\t}\n\tconst handle = setTimeout(callback, 0);\n\treturn () => clearTimeout(handle);\n}\n\nexport type CollapsibleOpenAnimationContext = {\n\t/** Duration of the CSS transition; the `open` attribute is kept on `<details>` until it has elapsed. */\n\tgetTransitionMs: () => number;\n\t/** Sets the `open` attribute on `<details>`. */\n\tsetDetailsOpen: (value: boolean) => void;\n\t/** Sets the `--open` block modifier, which drives the transition. */\n\tsetExpanded: (value: boolean) => void;\n};\n\nexport type CollapsibleOpenAnimation = {\n\t/**\n\t * Applies an open state to the two rendered flags.\n\t *\n\t * With `animate`, opening sets the `open` attribute first and the modifier one frame later — the\n\t * content is `display:none` while `<details>` is closed, so without that gap the transition has\n\t * no from-state and the panel snaps open. Collapsing does the reverse: the modifier goes first\n\t * and the attribute is removed once the transition has run.\n\t */\n\tsyncOpen: (open: boolean, animate: boolean) => void;\n\t/** Cancels pending frames and timers. Call from `disconnectedCallback`. */\n\tdispose: () => void;\n};\n\nexport function createCollapsibleOpenAnimation({ getTransitionMs, setDetailsOpen, setExpanded }: CollapsibleOpenAnimationContext): CollapsibleOpenAnimation {\n\tlet cancelPendingFrame: (() => void) | undefined;\n\tlet collapseTimeout: ReturnType<typeof setTimeout> | undefined;\n\n\tconst clearPending = (): void => {\n\t\tcancelPendingFrame?.();\n\t\tcancelPendingFrame = undefined;\n\t\tclearTimeout(collapseTimeout);\n\t\tcollapseTimeout = undefined;\n\t};\n\n\treturn {\n\t\tsyncOpen(open, animate) {\n\t\t\tclearPending();\n\n\t\t\tif (open) {\n\t\t\t\tsetDetailsOpen(true);\n\t\t\t\tif (animate) {\n\t\t\t\t\tcancelPendingFrame = onNextFrame(() => setExpanded(true));\n\t\t\t\t} else {\n\t\t\t\t\tsetExpanded(true);\n\t\t\t\t}\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tsetExpanded(false);\n\t\t\tif (animate) {\n\t\t\t\tcollapseTimeout = setTimeout(() => setDetailsOpen(false), getTransitionMs());\n\t\t\t} else {\n\t\t\t\tsetDetailsOpen(false);\n\t\t\t}\n\t\t},\n\t\tdispose: clearPending,\n\t};\n}\n","import type { CollapsibleCallbacksPropType } from '../../../schema';\nimport { dispatchDomEvent, KolEvent } from '../../../utils/events';\n\n/**\n * Delay between flipping `_open` and announcing the new state.\n *\n * `_open` is declared `@Prop({ mutable: true, reflect: true })`, and Stencil writes the reflected\n * attribute asynchronously. Announcing synchronously would let a consumer callback read a stale\n * `_open` attribute off the host, so the announcement is deferred by one macrotask window.\n */\nconst ANNOUNCE_DELAY_MS = 25;\n\nexport type CollapsibleToggleContext = {\n\t/** The host element the DOM events are dispatched on. */\n\tgetHost: () => HTMLElement | undefined;\n\t/** The normalized `_on` render prop. Read at announce time so late assignments are picked up. */\n\tgetOn: () => CollapsibleCallbacksPropType<boolean>;\n\t/** Whether the collapsible currently refuses interaction. */\n\tisDisabled: () => boolean;\n\t/** The current normalized open state. */\n\tisOpen: () => boolean;\n\t/** Writes the component's mutable `_open` prop, which its watcher turns into rendered state. */\n\tsetOpen: (open: boolean) => void;\n};\n\n/**\n * Builds the `<summary>` click handler shared by `kol-accordion` and `kol-details`.\n *\n * The user agent's own toggle is suppressed: it flips `open` synchronously, which skips the\n * collapse transition and races the component's controlled state. Everything else follows the\n * native element — `<summary>` is still the focusable control, and Enter/Space arrive here as\n * clicks, so keyboard operation needs no extra handling.\n *\n * The new state is captured synchronously, before the deferred announcement, so two quick toggles\n * report their own value rather than the same final one twice.\n */\nexport function createCollapsibleToggleHandler({ getHost, getOn, isDisabled, isOpen, setOpen }: CollapsibleToggleContext): (event: MouseEvent) => void {\n\treturn (event: MouseEvent): void => {\n\t\tevent.preventDefault();\n\n\t\tif (isDisabled()) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst open = !isOpen();\n\t\tsetOpen(open);\n\n\t\tsetTimeout(() => {\n\t\t\tconst host = getHost();\n\t\t\tif (host) {\n\t\t\t\tdispatchDomEvent(host, KolEvent.click, open);\n\t\t\t\tdispatchDomEvent(host, KolEvent.toggle, open);\n\t\t\t}\n\n\t\t\tconst on = getOn();\n\t\t\ton.onClick?.(event, open);\n\t\t\ton.onToggle?.(event, open);\n\t\t}, ANNOUNCE_DELAY_MS);\n\t};\n}\n"],"names":["createCallbacksPropDefinition","disabledProp","levelProp","openProp","labelProp","blockBem","getBlockBem","h","preventFocus","KolHeadingFc","SpanFC","clsx","dispatchDomEvent","KolEvent"],"mappings":"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"}

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

@@ -296,8 +296,8 @@
  */
 @font-face {
   font-family: "kolicons";
-  src: url("kolicons.eot?t=1791539188494"); /* IE9*/
-  src: url("kolicons.eot?t=1791539188494#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1791539188494") format("woff2"), url("kolicons.woff?t=1791539188494") format("woff"), url("kolicons.ttf?t=1791539188494") format("truetype"), url("kolicons.svg?t=1791539188494#kolicons") format("svg"); /* iOS 4.1- */
+  src: url("kolicons.eot?t=1791544630279"); /* IE9*/
+  src: url("kolicons.eot?t=1791544630279#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1791544630279") format("woff2"), url("kolicons.woff?t=1791544630279") format("woff"), url("kolicons.ttf?t=1791544630279") format("truetype"), url("kolicons.svg?t=1791544630279#kolicons") format("svg"); /* iOS 4.1- */
 }
 @layer kol-component {
   [class^=kolicon-], [class*=" kolicon-"] {

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

@@ -288,8 +288,8 @@
 }
 @font-face {
   font-family: "kolicons";
-  src: url("kolicons.eot?t=1791539188494"); /* IE9*/
-  src: url("kolicons.eot?t=1791539188494#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1791539188494") format("woff2"), url("kolicons.woff?t=1791539188494") format("woff"), url("kolicons.ttf?t=1791539188494") format("truetype"), url("kolicons.svg?t=1791539188494#kolicons") format("svg"); /* iOS 4.1- */
+  src: url("kolicons.eot?t=1791544630279"); /* IE9*/
+  src: url("kolicons.eot?t=1791544630279#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1791544630279") format("woff2"), url("kolicons.woff?t=1791544630279") format("woff"), url("kolicons.ttf?t=1791544630279") format("truetype"), url("kolicons.svg?t=1791544630279#kolicons") format("svg"); /* iOS 4.1- */
 }
 @layer kol-component {
   [class^=kolicon-], [class*=" kolicon-"] {

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

@@ -283,8 +283,8 @@
 }
 @font-face {
   font-family: "kolicons";
-  src: url("kolicons.eot?t=1791539188494"); /* IE9*/
-  src: url("kolicons.eot?t=1791539188494#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1791539188494") format("woff2"), url("kolicons.woff?t=1791539188494") format("woff"), url("kolicons.ttf?t=1791539188494") format("truetype"), url("kolicons.svg?t=1791539188494#kolicons") format("svg"); /* iOS 4.1- */
+  src: url("kolicons.eot?t=1791544630279"); /* IE9*/
+  src: url("kolicons.eot?t=1791544630279#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1791544630279") format("woff2"), url("kolicons.woff?t=1791544630279") format("woff"), url("kolicons.ttf?t=1791544630279") format("truetype"), url("kolicons.svg?t=1791544630279#kolicons") format("svg"); /* iOS 4.1- */
 }
 @layer kol-component {
   [class^=kolicon-], [class*=" kolicon-"] {