npm - @public-ui/components - Versions diffs - 4.2.0-rc.0 → 4.2.0-rc.2 - Mend

@public-ui/components 4.2.0-rc.0 → 4.2.0-rc.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (623) hide show

package/dist/components/kol-toast-container.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"kol-toast-container.js","mappings":"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","names":["KolToastContainer","__stencil_proxyCustomElement","KolToastItemFc"],"sources":["src/functional-components/ToastItem/ToastItem.tsx","src/components/toaster/style.scss?tag=kol-toast-container&mode=default&encapsulation=shadow","src/components/toaster/shadow.tsx"],"sourcesContent":["import { h, type FunctionalComponent as FC } from '@stencil/core';\nimport type { JSXBase } from '@stencil/core/internal';\nimport { type Toast } from '../../schema';\n\nimport clsx from '../../utils/clsx';\nimport KolAlertFc from '../Alert';\n\ntype ToastItemProps = JSXBase.HTMLAttributes<HTMLDivElement> & {\n\tstatus: 'adding' \| 'settled' \| 'removing';\n\ttoast: Toast;\n\tonClose: () => void;\n};\n\nconst ToastItemFc: FC<ToastItemProps> = ({ status, toast, onClose, ...other }) => {\n\tconst { type, label, description, variant } = toast;\n\n\treturn (\n\t\t<div class={clsx('kol-toast-item', `kol-toast-item--${status}`)}>\n\t\t\t<KolAlertFc\n\t\t\t\tclass=\"kol-toast-item__alert\"\n\t\t\t\talert={true}\n\t\t\t\tlabel={label}\n\t\t\t\tlevel={0}\n\t\t\t\thasCloser={true}\n\t\t\t\ttype={type}\n\t\t\t\tvariant={variant \|\| 'card'}\n\t\t\t\tonCloserClick={onClose}\n\t\t\t>\n\t\t\t\t<div {...other}>{description}</div>\n\t\t\t</KolAlertFc>\n\t\t</div>\n\t);\n};\n\nexport default ToastItemFc;\n","@use '../@shared/global' as ;\n@use '../@shared/alert.mixin' as ;\n@use '../@shared/mixins' as ;\n\n@layer kol-component {\n\t@include kol-alert;\n\n\t:host {\n\t\tdisplay: flex;\n\t\tposition: fixed;\n\t\tz-index: 200;\n\t\tmax-width: 90vw;\n\t\tflex-direction: column;\n\t}\n\n\t.kol-toast-container {\n\t\t&__close-all {\n\t\t\talign-self: flex-end;\n\t\t}\n\t}\n}\n","import type { JSX } from '@stencil/core';\nimport { Component, h, Host, Method, State } from '@stencil/core';\n\nimport { translate } from '../../i18n';\nimport { nonce } from '../../utils/dev.utils';\n\nimport { KolButtonTag } from '../../core/component-names';\nimport { KolToastItemFc } from '../../functional-components';\nimport type { Toast, ToasterAPI, ToasterStates, ToastRenderFunction, ToastState } from '../../schema';\n\nconst TRANSITION_TIMEOUT = 300;\n\n/\n @deprecated Will be removed in the next major version. For more information, please refer to: https://github.com/public-ui/kolibri/issues/8372\n * @internal\n /\n@Component({\n\ttag: 'kol-toast-container',\n\tstyleUrls: {\n\t\tdefault: './style.scss',\n\t},\n\tshadow: true,\n})\nexport class KolToastContainer implements ToasterAPI {\n\t@State() public state: ToasterStates = {\n\t\t_toastStates: [],\n\t};\n\n\tprivate readonly translateToastCloseAll = translate('kol-toast-close-all');\n\n\t/ Keep track of render functions, so we call each only once. /\n\tprivate knownRenderFunctions = new Set<ToastRenderFunction>();\n\n\t// Stencil requires async function:\n\t/\n\t Adds a toast to the queue.\n\t /\n\t@Method()\n\t// eslint-disable-next-line @typescript-eslint/require-await\n\tpublic async enqueue(toast: Toast) {\n\t\tconst newToastState: ToastState = {\n\t\t\ttoast: {\n\t\t\t\t...toast,\n\t\t\t\tvariant: 'card',\n\t\t\t},\n\t\t\tstatus: 'adding',\n\t\t\tid: `toast-${nonce()}`,\n\t\t};\n\t\tthis.state = {\n\t\t\t...this.state,\n\t\t\t_toastStates: [newToastState, ...this.state._toastStates],\n\t\t};\n\n\t\tsetTimeout(() => {\n\t\t\tthis.state = {\n\t\t\t\t...this.state,\n\t\t\t\t_toastStates: this.state._toastStates.map((localToastState) =>\n\t\t\t\t\tlocalToastState.id === newToastState.id && localToastState.status !== 'removing'\n\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\t...localToastState,\n\t\t\t\t\t\t\t\tstatus: 'settled',\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t: localToastState,\n\t\t\t\t),\n\t\t\t};\n\t\t}, TRANSITION_TIMEOUT);\n\n\t\treturn () => {\n\t\t\tthis.handleClose(newToastState);\n\t\t};\n\t}\n\n\tprivate handleClose(toastState: ToastState) {\n\t\tthis.state = {\n\t\t\t...this.state,\n\t\t\t_toastStates: this.state._toastStates.map((localToastState) => {\n\t\t\t\tif (localToastState.id === toastState.id) {\n\t\t\t\t\tlocalToastState.status = 'removing';\n\t\t\t\t}\n\t\t\t\treturn localToastState;\n\t\t\t}),\n\t\t};\n\n\t\tsetTimeout(() => {\n\t\t\tthis.state = {\n\t\t\t\t...this.state,\n\t\t\t\t_toastStates: this.state._toastStates.filter((localToastState) => localToastState.id !== toastState.id),\n\t\t\t};\n\t\t\ttoastState.toast.onClose?.();\n\t\t}, TRANSITION_TIMEOUT);\n\t}\n\n\t/\n\t Closes all toasts.\n\t */\n\t@Method()\n\t// eslint-disable-next-line @typescript-eslint/require-await\n\tpublic async closeAll(immediate: boolean = false) {\n\t\tif (immediate) {\n\t\t\tthis.state = {\n\t\t\t\t...this.state,\n\t\t\t\t_toastStates: [],\n\t\t\t};\n\t\t} else {\n\t\t\tconst toastsToClose = [...this.state._toastStates]; // Create a snapshot of the open toasts at the time closeAll has been called\n\n\t\t\tthis.state = {\n\t\t\t\t...this.state,\n\t\t\t\t_toastStates: toastsToClose.map((localToastState) => ({\n\t\t\t\t\t...localToastState,\n\t\t\t\t\tstatus: 'removing',\n\t\t\t\t})),\n\t\t\t};\n\n\t\t\tsetTimeout(() => {\n\t\t\t\tthis.state = {\n\t\t\t\t\t...this.state,\n\t\t\t\t\t_toastStates: this.state._toastStates.filter((toastState) => toastsToClose.every((toastToClose) => toastToClose.id !== toastState.id)),\n\t\t\t\t};\n\t\t\t\ttoastsToClose.forEach((toastState) => {\n\t\t\t\t\ttoastState.toast.onClose?.();\n\t\t\t\t});\n\t\t\t}, TRANSITION_TIMEOUT);\n\t\t}\n\t}\n\n\tprivate handleToastRef(toastState: ToastState, element?: HTMLDivElement) {\n\t\tif (element && typeof toastState.toast.render === 'function' && !this.knownRenderFunctions.has(toastState.toast.render)) {\n\t\t\tthis.knownRenderFunctions.add(toastState.toast.render);\n\t\t\ttoastState.toast.render(element, { close: () => this.handleClose(toastState) });\n\t\t}\n\t}\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host class=\"kol-toast-container\">\n\t\t\t\t{this.state._toastStates.length > 1 && (\n\t\t\t\t\t<KolButtonTag\n\t\t\t\t\t\t_label={this.translateToastCloseAll}\n\t\t\t\t\t\tclass=\"kol-toast-container__button-close-all\"\n\t\t\t\t\t\t_on={{\n\t\t\t\t\t\t\tonClick: () => {\n\t\t\t\t\t\t\t\tvoid this.closeAll();\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t}}\n\t\t\t\t\t></KolButtonTag>\n\t\t\t\t)}\n\t\t\t\t{this.state._toastStates.map((toastState) => (\n\t\t\t\t\t<KolToastItemFc\n\t\t\t\t\t\tkey={toastState.id}\n\t\t\t\t\t\tonClose={() => this.handleClose(toastState)}\n\t\t\t\t\t\tref={(element?: HTMLDivElement) => this.handleToastRef(toastState, element)}\n\t\t\t\t\t\ttoast={toastState.toast}\n\t\t\t\t\t\tstatus={toastState.status}\n\t\t\t\t\t/>\n\t\t\t\t))}\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"version":3}
1	+ {"file":"kol-toast-container.js","mappings":"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","names":["KolToastContainer","__stencil_proxyCustomElement","KolToastItemFc"],"sources":["src/functional-components/ToastItem/ToastItem.tsx","src/components/toaster/style.scss?tag=kol-toast-container&mode=default&encapsulation=shadow","src/components/toaster/shadow.tsx"],"sourcesContent":["import { h, type FunctionalComponent as FC } from '@stencil/core';\nimport type { JSXBase } from '@stencil/core/internal';\nimport { type Toast } from '../../schema';\n\nimport clsx from '../../utils/clsx';\nimport KolAlertFc from '../Alert';\n\ntype ToastItemProps = JSXBase.HTMLAttributes<HTMLDivElement> & {\n\tstatus: 'adding' \| 'settled' \| 'removing';\n\ttoast: Toast;\n\tonClose: () => void;\n};\n\nconst ToastItemFc: FC<ToastItemProps> = ({ status, toast, onClose, ...other }) => {\n\tconst { type, label, description, variant } = toast;\n\n\treturn (\n\t\t<div class={clsx('kol-toast-item', `kol-toast-item--${status}`)}>\n\t\t\t<KolAlertFc\n\t\t\t\tclass=\"kol-toast-item__alert\"\n\t\t\t\talert={true}\n\t\t\t\tlabel={label}\n\t\t\t\tlevel={0}\n\t\t\t\thasCloser={true}\n\t\t\t\ttype={type}\n\t\t\t\tvariant={variant \|\| 'card'}\n\t\t\t\tonCloserClick={onClose}\n\t\t\t>\n\t\t\t\t<div {...other}>{description}</div>\n\t\t\t</KolAlertFc>\n\t\t</div>\n\t);\n};\n\nexport default ToastItemFc;\n","@use '../@shared/global' as ;\n@use '../@shared/alert.mixin' as ;\n@use '../@shared/mixins' as ;\n\n@layer kol-component {\n\t@include kol-alert;\n\n\t:host {\n\t\tdisplay: flex;\n\t\tposition: fixed;\n\t\tz-index: 200;\n\t\tmax-width: 90vw;\n\t\tflex-direction: column;\n\t}\n\n\t.kol-toast-container {\n\t\t&__close-all {\n\t\t\talign-self: flex-end;\n\t\t}\n\t}\n}\n","import type { JSX } from '@stencil/core';\nimport { Component, h, Host, Method, State } from '@stencil/core';\n\nimport { translate } from '../../i18n';\nimport { createUniqueId } from '../../utils/dev.utils';\n\nimport { KolButtonTag } from '../../core/component-names';\nimport { KolToastItemFc } from '../../functional-components';\nimport type { Toast, ToasterAPI, ToasterStates, ToastRenderFunction, ToastState } from '../../schema';\n\nconst TRANSITION_TIMEOUT = 300;\n\n/\n @deprecated Will be removed in the next major version. For more information, please refer to: https://github.com/public-ui/kolibri/issues/8372\n * @internal\n /\n@Component({\n\ttag: 'kol-toast-container',\n\tstyleUrls: {\n\t\tdefault: './style.scss',\n\t},\n\tshadow: true,\n})\nexport class KolToastContainer implements ToasterAPI {\n\t@State() public state: ToasterStates = {\n\t\t_toastStates: [],\n\t};\n\n\tprivate readonly translateToastCloseAll = translate('kol-toast-close-all');\n\n\t/ Keep track of render functions, so we call each only once. /\n\tprivate knownRenderFunctions = new Set<ToastRenderFunction>();\n\n\t// Stencil requires async function:\n\t/\n\t Adds a toast to the queue.\n\t /\n\t@Method()\n\t// eslint-disable-next-line @typescript-eslint/require-await\n\tpublic async enqueue(toast: Toast) {\n\t\tconst newToastState: ToastState = {\n\t\t\ttoast: {\n\t\t\t\t...toast,\n\t\t\t\tvariant: 'card',\n\t\t\t},\n\t\t\tstatus: 'adding',\n\t\t\tid: createUniqueId('toast'),\n\t\t};\n\t\tthis.state = {\n\t\t\t...this.state,\n\t\t\t_toastStates: [newToastState, ...this.state._toastStates],\n\t\t};\n\n\t\tsetTimeout(() => {\n\t\t\tthis.state = {\n\t\t\t\t...this.state,\n\t\t\t\t_toastStates: this.state._toastStates.map((localToastState) =>\n\t\t\t\t\tlocalToastState.id === newToastState.id && localToastState.status !== 'removing'\n\t\t\t\t\t\t? {\n\t\t\t\t\t\t\t\t...localToastState,\n\t\t\t\t\t\t\t\tstatus: 'settled',\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t: localToastState,\n\t\t\t\t),\n\t\t\t};\n\t\t}, TRANSITION_TIMEOUT);\n\n\t\treturn () => {\n\t\t\tthis.handleClose(newToastState);\n\t\t};\n\t}\n\n\tprivate handleClose(toastState: ToastState) {\n\t\tthis.state = {\n\t\t\t...this.state,\n\t\t\t_toastStates: this.state._toastStates.map((localToastState) => {\n\t\t\t\tif (localToastState.id === toastState.id) {\n\t\t\t\t\tlocalToastState.status = 'removing';\n\t\t\t\t}\n\t\t\t\treturn localToastState;\n\t\t\t}),\n\t\t};\n\n\t\tsetTimeout(() => {\n\t\t\tthis.state = {\n\t\t\t\t...this.state,\n\t\t\t\t_toastStates: this.state._toastStates.filter((localToastState) => localToastState.id !== toastState.id),\n\t\t\t};\n\t\t\ttoastState.toast.onClose?.();\n\t\t}, TRANSITION_TIMEOUT);\n\t}\n\n\t/\n\t Closes all toasts.\n\t */\n\t@Method()\n\t// eslint-disable-next-line @typescript-eslint/require-await\n\tpublic async closeAll(immediate: boolean = false) {\n\t\tif (immediate) {\n\t\t\tthis.state = {\n\t\t\t\t...this.state,\n\t\t\t\t_toastStates: [],\n\t\t\t};\n\t\t} else {\n\t\t\tconst toastsToClose = [...this.state._toastStates]; // Create a snapshot of the open toasts at the time closeAll has been called\n\n\t\t\tthis.state = {\n\t\t\t\t...this.state,\n\t\t\t\t_toastStates: toastsToClose.map((localToastState) => ({\n\t\t\t\t\t...localToastState,\n\t\t\t\t\tstatus: 'removing',\n\t\t\t\t})),\n\t\t\t};\n\n\t\t\tsetTimeout(() => {\n\t\t\t\tthis.state = {\n\t\t\t\t\t...this.state,\n\t\t\t\t\t_toastStates: this.state._toastStates.filter((toastState) => toastsToClose.every((toastToClose) => toastToClose.id !== toastState.id)),\n\t\t\t\t};\n\t\t\t\ttoastsToClose.forEach((toastState) => {\n\t\t\t\t\ttoastState.toast.onClose?.();\n\t\t\t\t});\n\t\t\t}, TRANSITION_TIMEOUT);\n\t\t}\n\t}\n\n\tprivate handleToastRef(toastState: ToastState, element?: HTMLDivElement) {\n\t\tif (element && typeof toastState.toast.render === 'function' && !this.knownRenderFunctions.has(toastState.toast.render)) {\n\t\t\tthis.knownRenderFunctions.add(toastState.toast.render);\n\t\t\ttoastState.toast.render(element, { close: () => this.handleClose(toastState) });\n\t\t}\n\t}\n\n\tpublic render(): JSX.Element {\n\t\treturn (\n\t\t\t<Host class=\"kol-toast-container\">\n\t\t\t\t{this.state._toastStates.length > 1 && (\n\t\t\t\t\t<KolButtonTag\n\t\t\t\t\t\t_label={this.translateToastCloseAll}\n\t\t\t\t\t\tclass=\"kol-toast-container__button-close-all\"\n\t\t\t\t\t\t_on={{\n\t\t\t\t\t\t\tonClick: () => {\n\t\t\t\t\t\t\t\tvoid this.closeAll();\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t}}\n\t\t\t\t\t></KolButtonTag>\n\t\t\t\t)}\n\t\t\t\t{this.state._toastStates.map((toastState) => (\n\t\t\t\t\t<KolToastItemFc\n\t\t\t\t\t\tkey={toastState.id}\n\t\t\t\t\t\tonClose={() => this.handleClose(toastState)}\n\t\t\t\t\t\tref={(element?: HTMLDivElement) => this.handleToastRef(toastState, element)}\n\t\t\t\t\t\ttoast={toastState.toast}\n\t\t\t\t\t\tstatus={toastState.status}\n\t\t\t\t\t/>\n\t\t\t\t))}\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"version":3}

package/dist/components/kol-toolbar.js CHANGED Viewed

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{proxyCustomElement,HTMLElement,h}from"@stencil/core/internal/client";import{_ as __rest}from"./tslib.es6.js";import{c as KolLinkWcTag,b as KolButtonWcTag}from"./component-names.js";import{R as emptyStringByArrayHandler,o as objectObjectHandler,p as parseJson,s as setState}from"./common.js";import{v as validateLabel}from"./label.js";import{K as KeyboardKey}from"./keyboard.js";import{v as validateOrientation}from"./orientation.js";import{d as delegateClick,s as setClick}from"./element-click.js";import{d as delegateFocus,s as setFocus}from"./element-focus.js";const validateToolbarItems=(n,e)=>{emptyStringByArrayHandler(e,()=>{objectObjectHandler(e,()=>{void 0===e&&(e=[]);try{e=parseJson(e)}catch(n){}Array.isArray(e)&&e.every(n=>"object"==typeof n&&null!==n)&&setState(n,"_items",e)})})},defaultStyleCss='@charset "UTF-8";\n/* forward the rem function */\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*/\n@layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component;\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    --a11y-min-size: calc(44 * 1rem / var(--kolibri-root-font-size, 16));\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    color: black;\n    background-color: white;\n    /*\n     * Verdana is an accessible font that can be used without requiring additional loading time.\n     */\n    font-family: Verdana;\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@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  .disabled label,\n  .disabled:focus-within label,\n  [aria-disabled=true],\n  [aria-disabled=true]:focus,\n  [disabled],\n  [disabled]: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=1779430206668"); /* IE9*/\n  src: url("kolicons.eot?t=1779430206668#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1779430206668") format("woff2"), url("kolicons.woff?t=1779430206668") format("woff"), url("kolicons.ttf?t=1779430206668") format("truetype"), url("kolicons.svg?t=1779430206668#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-plus::before {\n    content: "\\ea15";\n  }\n  .kolicon-settings::before {\n    content: "\\ea16";\n  }\n  .kolicon-sort-asc::before {\n    content: "\\ea17";\n  }\n  .kolicon-sort-desc::before {\n    content: "\\ea18";\n  }\n  .kolicon-sort-neutral::before {\n    content: "\\ea19";\n  }\n  .kolicon-up::before {\n    content: "\\ea1a";\n  }\n  .kolicon-version::before {\n    content: "\\ea1b";\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-tooltip {\n    display: contents;\n  }\n  .kol-tooltip__floating {\n    opacity: 0;\n    display: none;\n    position: fixed;\n    /* Avoid layout interference - see https://floating-ui.com/docs/computePosition */\n    top: 0;\n    left: 0;\n    /* Can be used to specify the tooltip-width from the outside. Unset by default.  */\n    width: var(--kol-tooltip-width, max-content);\n    min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n    max-width: 90vw;\n    max-height: 90vh;\n    animation-direction: normal;\n    /* Can be used to specify the animation duration from the outside. 250ms by default. */\n    animation-duration: var(--kolibri-tooltip-animation-duration, 250ms);\n    animation-fill-mode: forwards;\n    animation-iteration-count: 1;\n    animation-timing-function: ease-in;\n  }\n  .kol-tooltip__floating.hide {\n    animation-name: hideTooltip;\n  }\n  .kol-tooltip__floating.show {\n    animation-name: showTooltip;\n  }\n  .kol-tooltip__arrow {\n    transform: rotate(45deg);\n    color: black;\n    background-color: white;\n    position: absolute;\n    z-index: 999;\n    width: calc(10 * 1rem / var(--kolibri-root-font-size, 16));\n    height: calc(10 * 1rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-tooltip__content {\n    color: black;\n    background-color: white;\n    position: relative;\n    z-index: 1000;\n  }\n  @keyframes hideTooltip {\n    0% {\n      opacity: 1;\n    }\n    100% {\n      opacity: 0;\n      display: none;\n    }\n  }\n  @keyframes showTooltip {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\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  :host {\n    display: inline-block;\n  }\n  .kol-link {\n    display: flex;\n    min-height: var(--a11y-min-size);\n    font-style: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n    text-decoration-line: none;\n  }\n  .kol-link::before {\n    /* Render zero-width character as first element to set the baseline correctly. */\n    content: "";\n  }\n  .kol-link__text {\n    flex: 1 0 100%;\n  }\n  .kol-icon {\n    color: inherit;\n    display: inline-block;\n    font-size: inherit;\n    font-weight: inherit;\n    line-height: inherit;\n  }\n  :host {\n    display: inline-block;\n  }\n  .kol-button {\n    display: flex;\n    min-height: var(--a11y-min-size);\n    font-style: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n    text-decoration-line: none;\n  }\n  .kol-button::before {\n    /* Render zero-width character as first element to set the baseline correctly. */\n    content: "";\n  }\n  .kol-button__text {\n    flex: 1 0 100%;\n  }\n  .kol-toolbar {\n    display: flex;\n    flex-wrap: wrap;\n    align-items: center;\n  }\n  .kol-toolbar--orientation-vertical {\n    flex-direction: column;\n    align-items: stretch;\n  }\n  .kol-toolbar--orientation-vertical .kol-span {\n    align-items: flex-start;\n  }\n  .kol-toolbar:focus-within {\n    outline: 1px solid;\n    outline-offset: 2px;\n  }\n}',KolToolbar$1=proxyCustomElement(class extends HTMLElement{constructor(n){super(),!1!==n&&this.__registerHost(),this.__attachShadow(),this.state={_label:"",_items:[]},this.currentIndex=0,this.indexToElement=new Map,this.renderItem=(n,e)=>{const t=this.normalizeItem(n),o=e!==this.currentIndex||(null==t?void 0:t._disabled)?-1:0,i={key:e,class:"button normal kol-toolbar__item",_tabIndex:o,_variant:"normal"},l=n=>{n&&this.indexToElement.set(e,n)};return"link"===t.type?h(KolLinkWcTag,Object.assign({},i,t,{ref:l})):h(KolButtonWcTag,Object.assign({},i,t,{ref:l}))}}async focus(){const n=this.indexToElement.get(this.currentIndex);if(n)return delegateFocus(this.host,()=>setFocus(n))}async click(){const n=this.indexToElement.get(this.currentIndex);if(n)return delegateClick(this.host,async()=>setClick(n))}normalizeItem(n){const{_icons:e,_disabled:t}=n,o=__rest(n,["_icons","_disabled"]);return Object.assign(Object.assign({},o),{_icons:e,_disabled:t})}render(){return h("div",{key:"275f13ac813c33395731de5b9073f1a3ab573734",class:`kol-toolbar kol-toolbar--orientation-${this.state._orientation}`,role:"toolbar","aria-label":this.state._label},this.state._items.map(this.renderItem))}validateLabel(n){validateLabel(this,n)}validateItems(n){validateToolbarItems(this,n),this.indexToElement.clear(),this.setFirstEnabledItemIndex()}validateOrientation(n){validateOrientation(this,n)}getCurrentToolbarItem(n){return"number"==typeof n?this.indexToElement.get(n):void 0}setFirstEnabledItemIndex(){var n;this.currentIndex=null===(n=this.state._items)||void 0===n?void 0:n.findIndex(n=>!n._disabled)}handleKeyDown(n){var e,t,o,i;const l=n.code;if(![KeyboardKey.ArrowUp,KeyboardKey.ArrowDown,KeyboardKey.ArrowRight,KeyboardKey.ArrowLeft].includes(l))return;n.preventDefault();const a=(null!==(t=null===(e=this._items)||void 0===e?void 0:e.length)&&void 0!==t?t:0)-1;if(a<0)return;const r=this.currentIndex;let s=r;switch(l){case KeyboardKey.ArrowUp:case KeyboardKey.ArrowLeft:s=r>0?r-1:a;break;case KeyboardKey.ArrowDown:case KeyboardKey.ArrowRight:s=r<a?r+1:0}if(r===s)return;if(null===(i=null===(o=this.state._items)||void 0===o?void 0:o[s])||void 0===i?void 0:i._disabled)return;this.currentIndex=s;const c=this.getCurrentToolbarItem(s);this.host&&(null==c||c.focus())}handleFocusout(n){n.target===this.host&&this.setFirstEnabledItemIndex()}componentWillLoad(){this.validateLabel(this._label),this.validateItems(this._items),this.validateOrientation(this._orientation),this.setFirstEnabledItemIndex()}get host(){return this}static get watchers(){return{_label:["validateLabel"],_items:["validateItems"],_orientation:["validateOrientation"]}}static get style(){return{default:defaultStyleCss}}},[289,"kol-toolbar",{_label:[1],_items:[16],_orientation:[1],state:[32],currentIndex:[32],focus:[64],click:[64]},[[0,"keydown","handleKeyDown"],[2,"focusout","handleFocusout"]],{_label:["validateLabel"],_items:["validateItems"],_orientation:["validateOrientation"]}]);function defineCustomElement$1(){if("undefined"==typeof customElements)return;["kol-toolbar"].forEach(n=>{if("kol-toolbar"===n)customElements.get(n)||customElements.define(n,KolToolbar$1)})}const KolToolbar=KolToolbar$1,defineCustomElement=defineCustomElement$1;export{KolToolbar,defineCustomElement};
+import{proxyCustomElement,HTMLElement,h}from"@stencil/core/internal/client";import{_ as __rest}from"./tslib.es6.js";import{c as KolLinkWcTag,b as KolButtonWcTag}from"./component-names.js";import{R as emptyStringByArrayHandler,o as objectObjectHandler,p as parseJson,s as setState}from"./common.js";import{v as validateLabel}from"./label.js";import{K as KeyboardKey}from"./keyboard.js";import{v as validateOrientation}from"./orientation.js";import{d as delegateClick,s as setClick}from"./element-click.js";import{d as delegateFocus,s as setFocus}from"./element-focus.js";const validateToolbarItems=(n,e)=>{emptyStringByArrayHandler(e,()=>{objectObjectHandler(e,()=>{void 0===e&&(e=[]);try{e=parseJson(e)}catch(n){}Array.isArray(e)&&e.every(n=>"object"==typeof n&&null!==n)&&setState(n,"_items",e)})})},defaultStyleCss='@charset "UTF-8";\n/* forward the rem function */\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*/\n@layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component;\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    --a11y-min-size: calc(44 * 1rem / var(--kolibri-root-font-size, 16));\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    color: black;\n    background-color: white;\n    /*\n     * Verdana is an accessible font that can be used without requiring additional loading time.\n     */\n    font-family: Verdana;\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@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  .disabled label,\n  .disabled:focus-within label,\n  [aria-disabled=true],\n  [aria-disabled=true]:focus,\n  [disabled],\n  [disabled]: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=1779833120296"); /* IE9*/\n  src: url("kolicons.eot?t=1779833120296#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1779833120296") format("woff2"), url("kolicons.woff?t=1779833120296") format("woff"), url("kolicons.ttf?t=1779833120296") format("truetype"), url("kolicons.svg?t=1779833120296#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-plus::before {\n    content: "\\ea15";\n  }\n  .kolicon-settings::before {\n    content: "\\ea16";\n  }\n  .kolicon-sort-asc::before {\n    content: "\\ea17";\n  }\n  .kolicon-sort-desc::before {\n    content: "\\ea18";\n  }\n  .kolicon-sort-neutral::before {\n    content: "\\ea19";\n  }\n  .kolicon-up::before {\n    content: "\\ea1a";\n  }\n  .kolicon-version::before {\n    content: "\\ea1b";\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-tooltip {\n    display: contents;\n  }\n  .kol-tooltip__floating {\n    opacity: 0;\n    display: none;\n    position: fixed;\n    /* Avoid layout interference - see https://floating-ui.com/docs/computePosition */\n    top: 0;\n    left: 0;\n    /* Can be used to specify the tooltip-width from the outside. Unset by default.  */\n    width: var(--kol-tooltip-width, max-content);\n    min-width: calc(8 * 1rem / var(--kolibri-root-font-size, 16));\n    max-width: 90vw;\n    max-height: 90vh;\n    animation-direction: normal;\n    /* Can be used to specify the animation duration from the outside. 250ms by default. */\n    animation-duration: var(--kolibri-tooltip-animation-duration, 250ms);\n    animation-fill-mode: forwards;\n    animation-iteration-count: 1;\n    animation-timing-function: ease-in;\n  }\n  .kol-tooltip__floating.hide {\n    animation-name: hideTooltip;\n  }\n  .kol-tooltip__floating.show {\n    animation-name: showTooltip;\n  }\n  .kol-tooltip__arrow {\n    transform: rotate(45deg);\n    color: black;\n    background-color: white;\n    position: absolute;\n    z-index: 999;\n    width: calc(10 * 1rem / var(--kolibri-root-font-size, 16));\n    height: calc(10 * 1rem / var(--kolibri-root-font-size, 16));\n  }\n  .kol-tooltip__content {\n    color: black;\n    background-color: white;\n    position: relative;\n    z-index: 1000;\n  }\n  @keyframes hideTooltip {\n    0% {\n      opacity: 1;\n    }\n    100% {\n      opacity: 0;\n      display: none;\n    }\n  }\n  @keyframes showTooltip {\n    0% {\n      opacity: 0;\n    }\n    100% {\n      opacity: 1;\n    }\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  :host {\n    display: inline-block;\n  }\n  .kol-link {\n    display: flex;\n    min-height: var(--a11y-min-size);\n    font-style: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n    text-decoration-line: none;\n  }\n  .kol-link::before {\n    /* Render zero-width character as first element to set the baseline correctly. */\n    content: "";\n  }\n  .kol-link__text {\n    flex: 1 0 100%;\n  }\n  .kol-icon {\n    color: inherit;\n    display: inline-block;\n    font-size: inherit;\n    font-weight: inherit;\n    line-height: inherit;\n  }\n  :host {\n    display: inline-block;\n  }\n  .kol-button {\n    display: flex;\n    min-height: var(--a11y-min-size);\n    font-style: calc(16 * 1rem / var(--kolibri-root-font-size, 16));\n    text-decoration-line: none;\n  }\n  .kol-button::before {\n    /* Render zero-width character as first element to set the baseline correctly. */\n    content: "";\n  }\n  .kol-button__text {\n    flex: 1 0 100%;\n  }\n  .kol-toolbar {\n    display: flex;\n    flex-wrap: wrap;\n    align-items: center;\n  }\n  .kol-toolbar--orientation-vertical {\n    flex-direction: column;\n    align-items: stretch;\n  }\n  .kol-toolbar--orientation-vertical .kol-span {\n    align-items: flex-start;\n  }\n  .kol-toolbar:focus-within {\n    outline: 1px solid;\n    outline-offset: 2px;\n  }\n}',KolToolbar$1=proxyCustomElement(class extends HTMLElement{constructor(n){super(),!1!==n&&this.__registerHost(),this.__attachShadow(),this.state={_label:"",_items:[]},this.currentIndex=0,this.indexToElement=new Map,this.renderItem=(n,e)=>{const t=this.normalizeItem(n),o=e!==this.currentIndex||(null==t?void 0:t._disabled)?-1:0,i={key:e,class:"button normal kol-toolbar__item",_tabIndex:o,_variant:"normal"},l=n=>{n&&this.indexToElement.set(e,n)};return"link"===t.type?h(KolLinkWcTag,Object.assign({},i,t,{ref:l})):h(KolButtonWcTag,Object.assign({},i,t,{ref:l}))}}async focus(){const n=this.indexToElement.get(this.currentIndex);if(n)return delegateFocus(this.host,()=>setFocus(n))}async click(){const n=this.indexToElement.get(this.currentIndex);if(n)return delegateClick(this.host,async()=>setClick(n))}normalizeItem(n){const{_icons:e,_disabled:t}=n,o=__rest(n,["_icons","_disabled"]);return Object.assign(Object.assign({},o),{_icons:e,_disabled:t})}render(){return h("div",{key:"275f13ac813c33395731de5b9073f1a3ab573734",class:`kol-toolbar kol-toolbar--orientation-${this.state._orientation}`,role:"toolbar","aria-label":this.state._label},this.state._items.map(this.renderItem))}validateLabel(n){validateLabel(this,n)}validateItems(n){validateToolbarItems(this,n),this.indexToElement.clear(),this.setFirstEnabledItemIndex()}validateOrientation(n){validateOrientation(this,n)}getCurrentToolbarItem(n){return"number"==typeof n?this.indexToElement.get(n):void 0}setFirstEnabledItemIndex(){var n;this.currentIndex=null===(n=this.state._items)||void 0===n?void 0:n.findIndex(n=>!n._disabled)}handleKeyDown(n){var e,t,o,i;const l=n.code;if(![KeyboardKey.ArrowUp,KeyboardKey.ArrowDown,KeyboardKey.ArrowRight,KeyboardKey.ArrowLeft].includes(l))return;n.preventDefault();const a=(null!==(t=null===(e=this._items)||void 0===e?void 0:e.length)&&void 0!==t?t:0)-1;if(a<0)return;const r=this.currentIndex;let s=r;switch(l){case KeyboardKey.ArrowUp:case KeyboardKey.ArrowLeft:s=r>0?r-1:a;break;case KeyboardKey.ArrowDown:case KeyboardKey.ArrowRight:s=r<a?r+1:0}if(r===s)return;if(null===(i=null===(o=this.state._items)||void 0===o?void 0:o[s])||void 0===i?void 0:i._disabled)return;this.currentIndex=s;const c=this.getCurrentToolbarItem(s);this.host&&(null==c||c.focus())}handleFocusout(n){n.target===this.host&&this.setFirstEnabledItemIndex()}componentWillLoad(){this.validateLabel(this._label),this.validateItems(this._items),this.validateOrientation(this._orientation),this.setFirstEnabledItemIndex()}get host(){return this}static get watchers(){return{_label:["validateLabel"],_items:["validateItems"],_orientation:["validateOrientation"]}}static get style(){return{default:defaultStyleCss}}},[289,"kol-toolbar",{_label:[1],_items:[16],_orientation:[1],state:[32],currentIndex:[32],focus:[64],click:[64]},[[0,"keydown","handleKeyDown"],[2,"focusout","handleFocusout"]],{_label:["validateLabel"],_items:["validateItems"],_orientation:["validateOrientation"]}]);function defineCustomElement$1(){if("undefined"==typeof customElements)return;["kol-toolbar"].forEach(n=>{if("kol-toolbar"===n)customElements.get(n)||customElements.define(n,KolToolbar$1)})}const KolToolbar=KolToolbar$1,defineCustomElement=defineCustomElement$1;export{KolToolbar,defineCustomElement};

package/dist/components/kol-tree-item-wc.js CHANGED Viewed

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{proxyCustomElement,HTMLElement,h,Host}from"@stencil/core/internal/client";import{c as KolLinkWcTag,t as KolTreeTag}from"./component-names.js";import{I as IconFC}from"./component3.js";import{c as watchBoolean}from"./common.js";import{v as validateHref}from"./href.js";import{v as validateLabel}from"./label.js";import{v as validateOpen}from"./open.js";import{c as clsx}from"./clsx.js";import{n as nonce}from"./dev.utils.js";const validateActive=(e,t,l)=>{watchBoolean(e,"_active",t,l)},KolTreeItemWc$1=proxyCustomElement(class extends HTMLElement{constructor(e){super(),!1!==e&&this.__registerHost(),this.groupId=`tree-group-${nonce()}`,this.state={_active:!1,_hasChildren:!1,_href:"",_label:"",_open:!1}}render(){const{_href:e,_active:t,_hasChildren:l,_open:a,_label:i}=this.state;return h(Host,{key:"99f8d3ba0603c5d5a434a6e625cf66a3649eb7c7",onSlotchange:this.handleSlotchange.bind(this)},h("li",{key:"b654e4ca72a1fe5270bebe60432ff7eab929fcb3",class:"kol-tree-item",style:{"--level":`${this.level}`}},h(KolLinkWcTag,{key:"54283f511b4a63d692f381318c37a46898bac377",class:clsx("kol-tree-item__link",{"kol-tree-item__link--first-level":0===this.level,"kol-tree-item__link--active":t}),_href:e,_label:"",_role:"treeitem",_tabIndex:t?0:-1,_ariaExpanded:l?a:void 0,_ariaOwns:l?this.groupId:void 0,ref:e=>this.linkElement=e},h("span",{key:"45e7d7a7db4b0db77f17b2090a87ab1c717ef88a",class:"kol-tree-item__link-inner",slot:"expert"},l?h("span",{class:"kol-tree-item__toggle-button",onClick:e=>a?void this.handleCollapseClick(e):void this.handleExpandClick(e)},h(IconFC,{class:"kol-tree-item__toggle-button-icon",icons:"kolicon kolicon-"+(a?"chevron-down":"chevron-right"),label:""})):h("span",{class:"kol-tree-item__toggle-button-placeholder"}),h("span",{key:"e8ea0d05e8ce655948a4cfbf464205c5434f15b8",class:"kol-tree-item__text"},i))),h("ul",{key:"38eb21a4037ce603e3ef4a6a7ec289337aa5fe9e",class:"kol-tree-item__children",hidden:!l||!a,role:"group",id:this.groupId},h("slot",{key:"c626e2a6074fef982423f19310d0a536cd4831f6"}))))}validateActive(e){validateActive(this,e||!1)}validateLabel(e){validateLabel(this,e)}validateOpen(e){validateOpen(this,e)}validateHref(e){validateHref(this,e)}componentWillLoad(){this.validateActive(this._active),this.validateLabel(this._label),this.validateOpen(this._open),this.validateHref(this._href),this.checkForChildren(),this.determineTreeItemDepth()}determineTreeItemDepth(){var e,t;let l=0,a=null===(t=null===(e=this.host)||void 0===e?void 0:e.parentNode)||void 0===t?void 0:t.host.parentNode;for(;null!==a&&a.tagName.toLowerCase()!==KolTreeTag&&a!==document.body;)a=a.parentElement,l+=1;this.level=l}handleSlotchange(){this.checkForChildren()}checkForChildren(){var e,t,l;this.state=Object.assign(Object.assign({},this.state),{_hasChildren:Boolean(null===(l=null===(t=null===(e=this.host)||void 0===e?void 0:e.querySelector("slot"))||void 0===t?void 0:t.assignedElements)||void 0===l?void 0:l.call(t).length)})}getTreeParent(){var e,t;let l=this.host;for(;l;){const a=l.closest(KolTreeTag);if(a){const t=null===(e=a.shadowRoot)||void 0===e?void 0:e.querySelector("kol-tree-wc");return t||void 0}const i=null===(t=l.getRootNode())||void 0===t?void 0:t.host;if(!i||i===document.body)break;l=i.parentElement}}async focus(){if(this.host&&this.linkElement)return Promise.resolve(this.linkElement.focus())}async handleExpandClick(e){e.preventDefault(),this.host&&this.linkElement&&await this.linkElement.focus(),await this.expand()}async expand(){var e,t;this.state._hasChildren&&(this.state=Object.assign(Object.assign({},this.state),{_open:!0}),null===(t=null===(e=this.getTreeParent())||void 0===e?void 0:e.invalidateOpenItemsCache)||void 0===t||t.call(e))}async handleCollapseClick(e){e.preventDefault(),this.host&&this.linkElement&&await this.linkElement.focus(),await this.collapse()}async collapse(){var e,t;this.state._hasChildren&&(this.state=Object.assign(Object.assign({},this.state),{_open:!1}),null===(t=null===(e=this.getTreeParent())||void 0===e?void 0:e.invalidateOpenItemsCache)||void 0===t||t.call(e))}async isOpen(){var e;return null!==(e=this.state._open)&&void 0!==e&&e}get host(){return this}static get watchers(){return{_active:["validateActive"],_label:["validateLabel"],_open:["validateOpen"],_href:["validateHref"]}}},[260,"kol-tree-item-wc",{_active:[4],_label:[1],_open:[4],_href:[1],level:[32],state:[32],focus:[64],expand:[64],collapse:[64],isOpen:[64]},void 0,{_active:["validateActive"],_label:["validateLabel"],_open:["validateOpen"],_href:["validateHref"]}]);function defineCustomElement$1(){if("undefined"==typeof customElements)return;["kol-tree-item-wc"].forEach(e=>{if("kol-tree-item-wc"===e)customElements.get(e)||customElements.define(e,KolTreeItemWc$1)})}const KolTreeItemWc=KolTreeItemWc$1,defineCustomElement=defineCustomElement$1;export{KolTreeItemWc,defineCustomElement};
+import{proxyCustomElement,HTMLElement,h,Host}from"@stencil/core/internal/client";import{c as KolLinkWcTag,t as KolTreeTag}from"./component-names.js";import{I as IconFC}from"./component3.js";import{c as watchBoolean}from"./common.js";import{v as validateHref}from"./href.js";import{v as validateLabel}from"./label.js";import{v as validateOpen}from"./open.js";import{c as clsx}from"./clsx.js";import{c as createUniqueId}from"./dev.utils.js";const validateActive=(e,t,l)=>{watchBoolean(e,"_active",t,l)},KolTreeItemWc$1=proxyCustomElement(class extends HTMLElement{constructor(e){super(),!1!==e&&this.__registerHost(),this.groupId=createUniqueId("tree-group"),this.state={_active:!1,_hasChildren:!1,_href:"",_label:"",_open:!1}}render(){const{_href:e,_active:t,_hasChildren:l,_open:i,_label:a}=this.state;return h(Host,{key:"0e8dace9d24995b94398cda4155f9cc026704b1f",onSlotchange:this.handleSlotchange.bind(this)},h("li",{key:"5e7cad99348e4230718731a8ccd42edc7cde0e5c",class:"kol-tree-item",style:{"--level":`${this.level}`}},h(KolLinkWcTag,{key:"c36dd466d9c4a46528628459fbfedf88cd100c60",class:clsx("kol-tree-item__link",{"kol-tree-item__link--first-level":0===this.level,"kol-tree-item__link--active":t}),_href:e,_label:"",_role:"treeitem",_tabIndex:t?0:-1,_ariaExpanded:l?i:void 0,_ariaOwns:l?this.groupId:void 0,ref:e=>this.linkElement=e},h("span",{key:"d1119a0de39c5c6ccb63c3c767d947a9babd5f9c",class:"kol-tree-item__link-inner",slot:"expert"},l?h("span",{class:"kol-tree-item__toggle-button",onClick:e=>i?void this.handleCollapseClick(e):void this.handleExpandClick(e)},h(IconFC,{class:"kol-tree-item__toggle-button-icon",icons:"kolicon kolicon-"+(i?"chevron-down":"chevron-right"),label:""})):h("span",{class:"kol-tree-item__toggle-button-placeholder"}),h("span",{key:"4ec3c0df36f1d428b2ebcd472aa5e2c54598dd0b",class:"kol-tree-item__text"},a))),h("ul",{key:"0dae6860fca3e03e5363bef3ee080542c5152f0d",class:"kol-tree-item__children",hidden:!l||!i,role:"group",id:this.groupId},h("slot",{key:"0a7af9ff0c81e4555d3e28fd4fd95b6c219b527a"}))))}validateActive(e){validateActive(this,e||!1)}validateLabel(e){validateLabel(this,e)}validateOpen(e){validateOpen(this,e)}validateHref(e){validateHref(this,e)}componentWillLoad(){this.validateActive(this._active),this.validateLabel(this._label),this.validateOpen(this._open),this.validateHref(this._href),this.checkForChildren(),this.determineTreeItemDepth()}determineTreeItemDepth(){var e,t;let l=0,i=null===(t=null===(e=this.host)||void 0===e?void 0:e.parentNode)||void 0===t?void 0:t.host.parentNode;for(;null!==i&&i.tagName.toLowerCase()!==KolTreeTag&&i!==document.body;)i=i.parentElement,l+=1;this.level=l}handleSlotchange(){this.checkForChildren()}checkForChildren(){var e,t,l;this.state=Object.assign(Object.assign({},this.state),{_hasChildren:Boolean(null===(l=null===(t=null===(e=this.host)||void 0===e?void 0:e.querySelector("slot"))||void 0===t?void 0:t.assignedElements)||void 0===l?void 0:l.call(t).length)})}getTreeParent(){var e,t;let l=this.host;for(;l;){const i=l.closest(KolTreeTag);if(i){const t=null===(e=i.shadowRoot)||void 0===e?void 0:e.querySelector("kol-tree-wc");return t||void 0}const a=null===(t=l.getRootNode())||void 0===t?void 0:t.host;if(!a||a===document.body)break;l=a.parentElement}}async focus(){if(this.host&&this.linkElement)return Promise.resolve(this.linkElement.focus())}async handleExpandClick(e){e.preventDefault(),this.host&&this.linkElement&&await this.linkElement.focus(),await this.expand()}async expand(){var e,t;this.state._hasChildren&&(this.state=Object.assign(Object.assign({},this.state),{_open:!0}),null===(t=null===(e=this.getTreeParent())||void 0===e?void 0:e.invalidateOpenItemsCache)||void 0===t||t.call(e))}async handleCollapseClick(e){e.preventDefault(),this.host&&this.linkElement&&await this.linkElement.focus(),await this.collapse()}async collapse(){var e,t;this.state._hasChildren&&(this.state=Object.assign(Object.assign({},this.state),{_open:!1}),null===(t=null===(e=this.getTreeParent())||void 0===e?void 0:e.invalidateOpenItemsCache)||void 0===t||t.call(e))}async isOpen(){var e;return null!==(e=this.state._open)&&void 0!==e&&e}get host(){return this}static get watchers(){return{_active:["validateActive"],_label:["validateLabel"],_open:["validateOpen"],_href:["validateHref"]}}},[260,"kol-tree-item-wc",{_active:[4],_label:[1],_open:[4],_href:[1],level:[32],state:[32],focus:[64],expand:[64],collapse:[64],isOpen:[64]},void 0,{_active:["validateActive"],_label:["validateLabel"],_open:["validateOpen"],_href:["validateHref"]}]);function defineCustomElement$1(){if("undefined"==typeof customElements)return;["kol-tree-item-wc"].forEach(e=>{if("kol-tree-item-wc"===e)customElements.get(e)||customElements.define(e,KolTreeItemWc$1)})}const KolTreeItemWc=KolTreeItemWc$1,defineCustomElement=defineCustomElement$1;export{KolTreeItemWc,defineCustomElement};

package/dist/components/kol-tree-item-wc.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"kol-tree-item-wc.js","mappings":"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","names":["KolTreeItemWc","__stencil_proxyCustomElement"],"sources":["src/schema/props/active.ts","src/components/tree-item/component.tsx"],"sourcesContent":["import type { Generic } from 'adopted-style-sheets';\n\nimport type { WatchBooleanOptions } from '../utils';\nimport { watchBoolean } from '../utils';\n\n/* types /\nexport type ActivePropType = boolean;\n\n/\n Defines whether something is active.\n /\nexport type PropActive = {\n\tactive: ActivePropType;\n};\n\n/ validator /\nexport const validateActive = (component: Generic.Element.Component, value: ActivePropType, options?: WatchBooleanOptions): void => {\n\twatchBoolean(component, '_active', value, options);\n};\n","import { Component, Element, h, Host, type JSX, Method, Prop, State, Watch } from '@stencil/core';\n\nimport { KolLinkWcTag, KolTreeTag } from '../../core/component-names';\nimport { IconFC } from '../../internal/functional-components/icon/component';\nimport type { ActivePropType, HrefPropType, LabelPropType, OpenPropType, TreeItemAPI, TreeItemStates } from '../../schema';\nimport { validateActive, validateHref, validateLabel, validateOpen } from '../../schema';\nimport clsx from '../../utils/clsx';\nimport { nonce } from '../../utils/dev.utils';\n\n/\n @internal\n /\n@Component({\n\ttag: `kol-tree-item-wc`,\n\tshadow: false,\n})\nexport class KolTreeItemWc implements TreeItemAPI {\n\t@Element() private readonly host?: HTMLKolTreeItemWcElement;\n\n\tprivate linkElement?: HTMLKolLinkWcElement;\n\tprivate groupId = `tree-group-${nonce()}`;\n\n\t@State() private level?: number;\n\n\tpublic render(): JSX.Element {\n\t\tconst { _href, _active, _hasChildren, _open, _label } = this.state;\n\t\treturn (\n\t\t\t<Host onSlotchange={this.handleSlotchange.bind(this)}>\n\t\t\t\t<li\n\t\t\t\t\tclass=\"kol-tree-item\"\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\t'--level': `${this.level}`,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<KolLinkWcTag\n\t\t\t\t\t\tclass={clsx('kol-tree-item__link', {\n\t\t\t\t\t\t\t'kol-tree-item__link--first-level': this.level === 0,\n\t\t\t\t\t\t\t'kol-tree-item__link--active': _active,\n\t\t\t\t\t\t})}\n\t\t\t\t\t\t_href={_href}\n\t\t\t\t\t\t_label=\"\"\n\t\t\t\t\t\t_role=\"treeitem\"\n\t\t\t\t\t\t_tabIndex={_active ? 0 : -1}\n\t\t\t\t\t\t_ariaExpanded={_hasChildren ? _open : undefined}\n\t\t\t\t\t\t_ariaOwns={_hasChildren ? this.groupId : undefined}\n\t\t\t\t\t\tref={(element?: HTMLKolLinkWcElement) => (this.linkElement = element!)}\n\t\t\t\t\t>\n\t\t\t\t\t\t<span class=\"kol-tree-item__link-inner\" slot=\"expert\">\n\t\t\t\t\t\t\t{_hasChildren ? (\n\t\t\t\t\t\t\t\t// eslint-disable-next-line jsx-a11y/no-static-element-interactions,jsx-a11y/click-events-have-key-events\n\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\tclass=\"kol-tree-item__toggle-button\"\n\t\t\t\t\t\t\t\t\tonClick={(event) => (_open ? void this.handleCollapseClick(event) : void this.handleExpandClick(event))}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<IconFC\n\t\t\t\t\t\t\t\t\t\tclass=\"kol-tree-item__toggle-button-icon\"\n\t\t\t\t\t\t\t\t\t\ticons={`kolicon kolicon-${_open ? 'chevron-down' : 'chevron-right'}`}\n\t\t\t\t\t\t\t\t\t\tlabel={'' / Label deliberately left empty /}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<span class=\"kol-tree-item__toggle-button-placeholder\"></span>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t<span class=\"kol-tree-item__text\">{_label}</span>\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</KolLinkWcTag>\n\t\t\t\t\t<ul class=\"kol-tree-item__children\" hidden={!_hasChildren \|\| !_open} role=\"group\" id={this.groupId}>\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</ul>\n\t\t\t\t</li>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t@State() public state: TreeItemStates = {\n\t\t_active: false,\n\t\t_hasChildren: false,\n\t\t_href: '',\n\t\t_label: '',\n\t\t_open: false,\n\t};\n\n\t/\n\t If set (to true) the tree item is the active one.\n\t /\n\t@Prop() _active?: OpenPropType;\n\n\t/\n\t Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.).\n\t /\n\t@Prop() _label!: LabelPropType;\n\n\t/\n\t Opens/expands the element when truthy, closes/collapses when falsy.\n\t /\n\t@Prop() _open?: OpenPropType;\n\n\t/\n\t Defines the target URI of the link.\n\t /\n\t@Prop() _href!: HrefPropType;\n\n\t@Watch('_active') validateActive(value?: ActivePropType): void {\n\t\tvalidateActive(this, value \|\| false);\n\t}\n\n\t@Watch('_label') validateLabel(value?: LabelPropType): void {\n\t\tvalidateLabel(this, value);\n\t}\n\n\t@Watch('_open') validateOpen(value?: OpenPropType): void {\n\t\tvalidateOpen(this, value);\n\t}\n\n\t@Watch('_href') validateHref(value?: HrefPropType): void {\n\t\tvalidateHref(this, value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateActive(this._active);\n\t\tthis.validateLabel(this._label);\n\t\tthis.validateOpen(this._open);\n\t\tthis.validateHref(this._href);\n\n\t\tthis.checkForChildren();\n\t\tthis.determineTreeItemDepth();\n\t}\n\n\tprivate determineTreeItemDepth() {\n\t\tlet level = 0;\n\t\tlet traverseItem: HTMLElement \| null = (this.host?.parentNode as unknown as ShadowRoot)?.host.parentNode as HTMLElement;\n\t\twhile (traverseItem !== null && traverseItem.tagName.toLowerCase() !== KolTreeTag && traverseItem !== document.body) {\n\t\t\ttraverseItem = traverseItem.parentElement;\n\t\t\tlevel += 1;\n\t\t}\n\t\tthis.level = level;\n\t}\n\n\tprivate handleSlotchange() {\n\t\tthis.checkForChildren();\n\t}\n\n\tprivate checkForChildren() {\n\t\tthis.state = {\n\t\t\t...this.state,\n\t\t\t_hasChildren: Boolean(this.host?.querySelector('slot')?.assignedElements?.().length),\n\t\t};\n\t}\n\n\tprivate getTreeParent(): (HTMLKolTreeWcElement & { invalidateOpenItemsCache(): void }) \| undefined {\n\t\t// Traverse up through shadow boundaries manually\n\t\tlet element: Element \| null \| undefined = this.host;\n\t\twhile (element) {\n\t\t\t// Try closest in current DOM tree\n\t\t\tconst parent = element.closest(KolTreeTag);\n\t\t\tif (parent) {\n\t\t\t\t// Found kol-tree (shadow wrapper), now find kol-tree-wc in its shadow DOM\n\t\t\t\tconst treeWc = parent.shadowRoot?.querySelector('kol-tree-wc');\n\t\t\t\tif (treeWc) {\n\t\t\t\t\treturn treeWc as HTMLKolTreeWcElement & { invalidateOpenItemsCache(): void };\n\t\t\t\t}\n\t\t\t\treturn undefined;\n\t\t\t}\n\t\t\t// Cross shadow boundary: go to shadow host, then to its parent\n\t\t\tconst shadowHost: Element \| undefined = (element.getRootNode() as ShadowRoot)?.host;\n\t\t\tif (!shadowHost \|\| shadowHost === document.body) {\n\t\t\t\tbreak;\n\t\t\t}\n\t\t\telement = shadowHost.parentElement;\n\t\t}\n\t\treturn undefined;\n\t}\n\n\t/\n\t Focuses the link element.\n\t /\n\t@Method() async focus() {\n\t\tif (this.host && this.linkElement) {\n\t\t\treturn Promise.resolve(this.linkElement.focus());\n\t\t}\n\t}\n\n\tprivate async handleExpandClick(event: MouseEvent) {\n\t\tevent.preventDefault();\n\t\tif (this.host && this.linkElement) {\n\t\t\tawait this.linkElement.focus();\n\t\t}\n\t\tawait this.expand();\n\t}\n\n\t/\n\t Expands the tree item.\n\t /\n\t@Method()\n\t// eslint-disable-next-line @typescript-eslint/require-await\n\tpublic async expand() {\n\t\tif (this.state._hasChildren) {\n\t\t\tthis.state = {\n\t\t\t\t...this.state,\n\t\t\t\t_open: true,\n\t\t\t};\n\t\t\t// Invalidate the tree's cache of open items\n\t\t\tvoid this.getTreeParent()?.invalidateOpenItemsCache?.();\n\t\t}\n\t}\n\n\tprivate async handleCollapseClick(event: MouseEvent) {\n\t\tevent.preventDefault();\n\t\tif (this.host && this.linkElement) {\n\t\t\tawait this.linkElement.focus();\n\t\t}\n\t\tawait this.collapse();\n\t}\n\n\t/\n\t Collapses the tree item.\n\t /\n\t@Method()\n\t// eslint-disable-next-line @typescript-eslint/require-await\n\tpublic async collapse() {\n\t\tif (this.state._hasChildren) {\n\t\t\tthis.state = {\n\t\t\t\t...this.state,\n\t\t\t\t_open: false,\n\t\t\t};\n\t\t\t// Invalidate the tree's cache of open items\n\t\t\tvoid this.getTreeParent()?.invalidateOpenItemsCache?.();\n\t\t}\n\t}\n\n\t/\n\t Returns whether the tree item is expanded.\n\t */\n\t@Method()\n\t// eslint-disable-next-line @typescript-eslint/require-await\n\tpublic async isOpen() {\n\t\treturn this.state._open ?? false;\n\t}\n}\n"],"version":3}
1	+ {"file":"kol-tree-item-wc.js","mappings":"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","names":["KolTreeItemWc","__stencil_proxyCustomElement"],"sources":["src/schema/props/active.ts","src/components/tree-item/component.tsx"],"sourcesContent":["import type { Generic } from 'adopted-style-sheets';\n\nimport type { WatchBooleanOptions } from '../utils';\nimport { watchBoolean } from '../utils';\n\n/* types /\nexport type ActivePropType = boolean;\n\n/\n Defines whether something is active.\n /\nexport type PropActive = {\n\tactive: ActivePropType;\n};\n\n/ validator /\nexport const validateActive = (component: Generic.Element.Component, value: ActivePropType, options?: WatchBooleanOptions): void => {\n\twatchBoolean(component, '_active', value, options);\n};\n","import { Component, Element, h, Host, type JSX, Method, Prop, State, Watch } from '@stencil/core';\n\nimport { KolLinkWcTag, KolTreeTag } from '../../core/component-names';\nimport { IconFC } from '../../internal/functional-components/icon/component';\nimport type { ActivePropType, HrefPropType, LabelPropType, OpenPropType, TreeItemAPI, TreeItemStates } from '../../schema';\nimport { validateActive, validateHref, validateLabel, validateOpen } from '../../schema';\nimport clsx from '../../utils/clsx';\nimport { createUniqueId } from '../../utils/dev.utils';\n\n/\n @internal\n /\n@Component({\n\ttag: `kol-tree-item-wc`,\n\tshadow: false,\n})\nexport class KolTreeItemWc implements TreeItemAPI {\n\t@Element() private readonly host?: HTMLKolTreeItemWcElement;\n\n\tprivate linkElement?: HTMLKolLinkWcElement;\n\tprivate groupId = createUniqueId('tree-group');\n\n\t@State() private level?: number;\n\n\tpublic render(): JSX.Element {\n\t\tconst { _href, _active, _hasChildren, _open, _label } = this.state;\n\t\treturn (\n\t\t\t<Host onSlotchange={this.handleSlotchange.bind(this)}>\n\t\t\t\t<li\n\t\t\t\t\tclass=\"kol-tree-item\"\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\t'--level': `${this.level}`,\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t<KolLinkWcTag\n\t\t\t\t\t\tclass={clsx('kol-tree-item__link', {\n\t\t\t\t\t\t\t'kol-tree-item__link--first-level': this.level === 0,\n\t\t\t\t\t\t\t'kol-tree-item__link--active': _active,\n\t\t\t\t\t\t})}\n\t\t\t\t\t\t_href={_href}\n\t\t\t\t\t\t_label=\"\"\n\t\t\t\t\t\t_role=\"treeitem\"\n\t\t\t\t\t\t_tabIndex={_active ? 0 : -1}\n\t\t\t\t\t\t_ariaExpanded={_hasChildren ? _open : undefined}\n\t\t\t\t\t\t_ariaOwns={_hasChildren ? this.groupId : undefined}\n\t\t\t\t\t\tref={(element?: HTMLKolLinkWcElement) => (this.linkElement = element!)}\n\t\t\t\t\t>\n\t\t\t\t\t\t<span class=\"kol-tree-item__link-inner\" slot=\"expert\">\n\t\t\t\t\t\t\t{_hasChildren ? (\n\t\t\t\t\t\t\t\t// eslint-disable-next-line jsx-a11y/no-static-element-interactions,jsx-a11y/click-events-have-key-events\n\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\tclass=\"kol-tree-item__toggle-button\"\n\t\t\t\t\t\t\t\t\tonClick={(event) => (_open ? void this.handleCollapseClick(event) : void this.handleExpandClick(event))}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<IconFC\n\t\t\t\t\t\t\t\t\t\tclass=\"kol-tree-item__toggle-button-icon\"\n\t\t\t\t\t\t\t\t\t\ticons={`kolicon kolicon-${_open ? 'chevron-down' : 'chevron-right'}`}\n\t\t\t\t\t\t\t\t\t\tlabel={'' / Label deliberately left empty /}\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<span class=\"kol-tree-item__toggle-button-placeholder\"></span>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t<span class=\"kol-tree-item__text\">{_label}</span>\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</KolLinkWcTag>\n\t\t\t\t\t<ul class=\"kol-tree-item__children\" hidden={!_hasChildren \|\| !_open} role=\"group\" id={this.groupId}>\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t</ul>\n\t\t\t\t</li>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t@State() public state: TreeItemStates = {\n\t\t_active: false,\n\t\t_hasChildren: false,\n\t\t_href: '',\n\t\t_label: '',\n\t\t_open: false,\n\t};\n\n\t/\n\t If set (to true) the tree item is the active one.\n\t /\n\t@Prop() _active?: OpenPropType;\n\n\t/\n\t Defines the visible or semantic label of the component (e.g. aria-label, label, headline, caption, summary, etc.).\n\t /\n\t@Prop() _label!: LabelPropType;\n\n\t/\n\t Opens/expands the element when truthy, closes/collapses when falsy.\n\t /\n\t@Prop() _open?: OpenPropType;\n\n\t/\n\t Defines the target URI of the link.\n\t /\n\t@Prop() _href!: HrefPropType;\n\n\t@Watch('_active') validateActive(value?: ActivePropType): void {\n\t\tvalidateActive(this, value \|\| false);\n\t}\n\n\t@Watch('_label') validateLabel(value?: LabelPropType): void {\n\t\tvalidateLabel(this, value);\n\t}\n\n\t@Watch('_open') validateOpen(value?: OpenPropType): void {\n\t\tvalidateOpen(this, value);\n\t}\n\n\t@Watch('_href') validateHref(value?: HrefPropType): void {\n\t\tvalidateHref(this, value);\n\t}\n\n\tpublic componentWillLoad(): void {\n\t\tthis.validateActive(this._active);\n\t\tthis.validateLabel(this._label);\n\t\tthis.validateOpen(this._open);\n\t\tthis.validateHref(this._href);\n\n\t\tthis.checkForChildren();\n\t\tthis.determineTreeItemDepth();\n\t}\n\n\tprivate determineTreeItemDepth() {\n\t\tlet level = 0;\n\t\tlet traverseItem: HTMLElement \| null = (this.host?.parentNode as unknown as ShadowRoot)?.host.parentNode as HTMLElement;\n\t\twhile (traverseItem !== null && traverseItem.tagName.toLowerCase() !== KolTreeTag && traverseItem !== document.body) {\n\t\t\ttraverseItem = traverseItem.parentElement;\n\t\t\tlevel += 1;\n\t\t}\n\t\tthis.level = level;\n\t}\n\n\tprivate handleSlotchange() {\n\t\tthis.checkForChildren();\n\t}\n\n\tprivate checkForChildren() {\n\t\tthis.state = {\n\t\t\t...this.state,\n\t\t\t_hasChildren: Boolean(this.host?.querySelector('slot')?.assignedElements?.().length),\n\t\t};\n\t}\n\n\tprivate getTreeParent(): (HTMLKolTreeWcElement & { invalidateOpenItemsCache(): void }) \| undefined {\n\t\t// Traverse up through shadow boundaries manually\n\t\tlet element: Element \| null \| undefined = this.host;\n\t\twhile (element) {\n\t\t\t// Try closest in current DOM tree\n\t\t\tconst parent = element.closest(KolTreeTag);\n\t\t\tif (parent) {\n\t\t\t\t// Found kol-tree (shadow wrapper), now find kol-tree-wc in its shadow DOM\n\t\t\t\tconst treeWc = parent.shadowRoot?.querySelector('kol-tree-wc');\n\t\t\t\tif (treeWc) {\n\t\t\t\t\treturn treeWc as HTMLKolTreeWcElement & { invalidateOpenItemsCache(): void };\n\t\t\t\t}\n\t\t\t\treturn undefined;\n\t\t\t}\n\t\t\t// Cross shadow boundary: go to shadow host, then to its parent\n\t\t\tconst shadowHost: Element \| undefined = (element.getRootNode() as ShadowRoot)?.host;\n\t\t\tif (!shadowHost \|\| shadowHost === document.body) {\n\t\t\t\tbreak;\n\t\t\t}\n\t\t\telement = shadowHost.parentElement;\n\t\t}\n\t\treturn undefined;\n\t}\n\n\t/\n\t Focuses the link element.\n\t /\n\t@Method() async focus() {\n\t\tif (this.host && this.linkElement) {\n\t\t\treturn Promise.resolve(this.linkElement.focus());\n\t\t}\n\t}\n\n\tprivate async handleExpandClick(event: MouseEvent) {\n\t\tevent.preventDefault();\n\t\tif (this.host && this.linkElement) {\n\t\t\tawait this.linkElement.focus();\n\t\t}\n\t\tawait this.expand();\n\t}\n\n\t/\n\t Expands the tree item.\n\t /\n\t@Method()\n\t// eslint-disable-next-line @typescript-eslint/require-await\n\tpublic async expand() {\n\t\tif (this.state._hasChildren) {\n\t\t\tthis.state = {\n\t\t\t\t...this.state,\n\t\t\t\t_open: true,\n\t\t\t};\n\t\t\t// Invalidate the tree's cache of open items\n\t\t\tvoid this.getTreeParent()?.invalidateOpenItemsCache?.();\n\t\t}\n\t}\n\n\tprivate async handleCollapseClick(event: MouseEvent) {\n\t\tevent.preventDefault();\n\t\tif (this.host && this.linkElement) {\n\t\t\tawait this.linkElement.focus();\n\t\t}\n\t\tawait this.collapse();\n\t}\n\n\t/\n\t Collapses the tree item.\n\t /\n\t@Method()\n\t// eslint-disable-next-line @typescript-eslint/require-await\n\tpublic async collapse() {\n\t\tif (this.state._hasChildren) {\n\t\t\tthis.state = {\n\t\t\t\t...this.state,\n\t\t\t\t_open: false,\n\t\t\t};\n\t\t\t// Invalidate the tree's cache of open items\n\t\t\tvoid this.getTreeParent()?.invalidateOpenItemsCache?.();\n\t\t}\n\t}\n\n\t/\n\t Returns whether the tree item is expanded.\n\t */\n\t@Method()\n\t// eslint-disable-next-line @typescript-eslint/require-await\n\tpublic async isOpen() {\n\t\treturn this.state._open ?? false;\n\t}\n}\n"],"version":3}

package/dist/components/kol-tree-item.js CHANGED Viewed

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{proxyCustomElement,HTMLElement,h}from"@stencil/core/internal/client";import{r as KolTreeItemWcTag}from"./component-names.js";const defaultStyleCss='/* forward the rem function */\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*/\n@layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component;\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    --a11y-min-size: calc(44 * 1rem / var(--kolibri-root-font-size, 16));\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    color: black;\n    background-color: white;\n    /*\n     * Verdana is an accessible font that can be used without requiring additional loading time.\n     */\n    font-family: Verdana;\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@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  .disabled label,\n  .disabled:focus-within label,\n  [aria-disabled=true],\n  [aria-disabled=true]:focus,\n  [disabled],\n  [disabled]: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=1779430206668"); /* IE9*/\n  src: url("kolicons.eot?t=1779430206668#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1779430206668") format("woff2"), url("kolicons.woff?t=1779430206668") format("woff"), url("kolicons.ttf?t=1779430206668") format("truetype"), url("kolicons.svg?t=1779430206668#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-plus::before {\n    content: "\\ea15";\n  }\n  .kolicon-settings::before {\n    content: "\\ea16";\n  }\n  .kolicon-sort-asc::before {\n    content: "\\ea17";\n  }\n  .kolicon-sort-desc::before {\n    content: "\\ea18";\n  }\n  .kolicon-sort-neutral::before {\n    content: "\\ea19";\n  }\n  .kolicon-up::before {\n    content: "\\ea1a";\n  }\n  .kolicon-version::before {\n    content: "\\ea1b";\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    min-height: var(--a11y-min-size);\n    align-items: center;\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}',KolTreeItem$1=proxyCustomElement(class extends HTMLElement{constructor(n){super(),!1!==n&&this.__registerHost(),this.__attachShadow()}async focus(){var n;return Promise.resolve(null===(n=this.element)||void 0===n?void 0:n.focus())}async expand(){var n;return Promise.resolve(null===(n=this.element)||void 0===n?void 0:n.expand())}async collapse(){var n;return Promise.resolve(null===(n=this.element)||void 0===n?void 0:n.collapse())}async isOpen(){var n,e;return null!==(e=await(null===(n=this.element)||void 0===n?void 0:n.isOpen()))&&void 0!==e&&e}render(){return h(KolTreeItemWcTag,{key:"6b16bce6aa837018f8b321f84134e7f7c9e8262b",_active:this._active,_label:this._label,_open:this._open,_href:this._href,ref:n=>this.element=n},h("slot",{key:"93f4a2498abbbb3c2ab1494314de3200cea827d4"}))}static get style(){return{default:defaultStyleCss}}},[289,"kol-tree-item",{_active:[4],_label:[1],_open:[4],_href:[1],focus:[64],expand:[64],collapse:[64],isOpen:[64]}]);function defineCustomElement$1(){if("undefined"==typeof customElements)return;["kol-tree-item"].forEach(n=>{if("kol-tree-item"===n)customElements.get(n)||customElements.define(n,KolTreeItem$1)})}const KolTreeItem=KolTreeItem$1,defineCustomElement=defineCustomElement$1;export{KolTreeItem,defineCustomElement};
+import{proxyCustomElement,HTMLElement,h}from"@stencil/core/internal/client";import{r as KolTreeItemWcTag}from"./component-names.js";const defaultStyleCss='/* forward the rem function */\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*/\n@layer kol-a11y, kol-global, kol-component, kol-theme-global, kol-theme-component;\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    --a11y-min-size: calc(44 * 1rem / var(--kolibri-root-font-size, 16));\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    color: black;\n    background-color: white;\n    /*\n     * Verdana is an accessible font that can be used without requiring additional loading time.\n     */\n    font-family: Verdana;\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@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  .disabled label,\n  .disabled:focus-within label,\n  [aria-disabled=true],\n  [aria-disabled=true]:focus,\n  [disabled],\n  [disabled]: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=1779833120296"); /* IE9*/\n  src: url("kolicons.eot?t=1779833120296#iefix") format("embedded-opentype"), url("kolicons.woff2?t=1779833120296") format("woff2"), url("kolicons.woff?t=1779833120296") format("woff"), url("kolicons.ttf?t=1779833120296") format("truetype"), url("kolicons.svg?t=1779833120296#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-plus::before {\n    content: "\\ea15";\n  }\n  .kolicon-settings::before {\n    content: "\\ea16";\n  }\n  .kolicon-sort-asc::before {\n    content: "\\ea17";\n  }\n  .kolicon-sort-desc::before {\n    content: "\\ea18";\n  }\n  .kolicon-sort-neutral::before {\n    content: "\\ea19";\n  }\n  .kolicon-up::before {\n    content: "\\ea1a";\n  }\n  .kolicon-version::before {\n    content: "\\ea1b";\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    min-height: var(--a11y-min-size);\n    align-items: center;\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}',KolTreeItem$1=proxyCustomElement(class extends HTMLElement{constructor(n){super(),!1!==n&&this.__registerHost(),this.__attachShadow()}async focus(){var n;return Promise.resolve(null===(n=this.element)||void 0===n?void 0:n.focus())}async expand(){var n;return Promise.resolve(null===(n=this.element)||void 0===n?void 0:n.expand())}async collapse(){var n;return Promise.resolve(null===(n=this.element)||void 0===n?void 0:n.collapse())}async isOpen(){var n,e;return null!==(e=await(null===(n=this.element)||void 0===n?void 0:n.isOpen()))&&void 0!==e&&e}render(){return h(KolTreeItemWcTag,{key:"6b16bce6aa837018f8b321f84134e7f7c9e8262b",_active:this._active,_label:this._label,_open:this._open,_href:this._href,ref:n=>this.element=n},h("slot",{key:"93f4a2498abbbb3c2ab1494314de3200cea827d4"}))}static get style(){return{default:defaultStyleCss}}},[289,"kol-tree-item",{_active:[4],_label:[1],_open:[4],_href:[1],focus:[64],expand:[64],collapse:[64],isOpen:[64]}]);function defineCustomElement$1(){if("undefined"==typeof customElements)return;["kol-tree-item"].forEach(n=>{if("kol-tree-item"===n)customElements.get(n)||customElements.define(n,KolTreeItem$1)})}const KolTreeItem=KolTreeItem$1,defineCustomElement=defineCustomElement$1;export{KolTreeItem,defineCustomElement};

package/dist/esm/{Alert-Bu9uPVl2.js → Alert-CBfalBKc.js} RENAMED Viewed

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{_ as __rest}from"./tslib.es6-CxX45GIN.js";import{h,F as Fragment}from"./index-CSjYA5Lb.js";import{c as clsx}from"./clsx-COFh-Vc8.js";import{b as KolButtonWcTag}from"./component-names-Dy77vq43.js";import{t as translate}from"./i18n-Br16IAnY.js";import{b as bem}from"./bem-registry-DChqxUD_.js";import{I as IconFC}from"./component-DFTO3MyP.js";import{K as KolHeadingFc}from"./Heading-D_-iYuK7.js";const alertBem$1=bem.forBlock("kol-alert"),BEM_CLASS_ALERT__ICON=alertBem$1("icon"),ALERT_ICON_CONFIG={error:{label:translate("kol-error"),icon:"kolicon-alert-error"},info:{label:translate("kol-info"),icon:"kolicon-alert-info"},warning:{label:translate("kol-warning"),icon:"kolicon-alert-warning"},success:{label:translate("kol-success"),icon:"kolicon-alert-success"},default:{label:translate("kol-message"),icon:"kolicon-alert-info"}},AlertIcon=({type:e="default"})=>{const l=ALERT_ICON_CONFIG[e||"default"];return h(Fragment,null,h("span",{class:"visually-hidden"},l.label),h(IconFC,{class:BEM_CLASS_ALERT__ICON,label:"",icons:l.icon}))},alertBem=bem.forBlock("kol-alert"),BEM_CLASS_ALERT__CLOSER=alertBem("closer"),BEM_CLASS_ALERT__CONTENT=alertBem("content"),vibrateOnError=()=>{if("undefined"==typeof navigator||"function"!=typeof navigator.vibrate)return;const e=navigator.userActivation;if(((null==e?void 0:e.isActive)||(null==e?void 0:e.hasBeenActive))&&matchMedia("(any-pointer: coarse)").matches)try{navigator.vibrate([100,75,100,75,100])}catch(e){}},KolAlertFc=(e,l)=>{const{class:a={},alert:t=!1,hasCloser:o=!1,label:r,level:n=0,type:s="default",variant:i="msg",onAlertTimeout:c,onCloserClick:_}=e,m=__rest(e,["class","alert","hasCloser","label","level","type","variant","onAlertTimeout","onCloserClick"]),d=translate("kol-close-alert");t&&(vibrateOnError(),setTimeout(()=>{null==c||c()},1e4));const b=alertBem({hasCloser:!!o,[`type-${s}`]:!0,[`variant-${i}`]:!0}),C=alertBem("heading",{[`h${n}`]:!0}),v=Object.assign({class:clsx(a,b)},m);return h("div",Object.assign({role:t?"alert":void 0},v,{"data-testid":"alert"}),h("div",{class:"kol-alert__container"},h(AlertIcon,{label:r,type:s}),h("div",{class:"kol-alert__container-content"},r&&h(KolHeadingFc,{class:C,level:n,id:"heading"},r),"msg"===i&&h("span",{class:BEM_CLASS_ALERT__CONTENT,"aria-describedby":r?"heading":void 0},l)),o&&h(KolButtonWcTag,{class:BEM_CLASS_ALERT__CLOSER+" kol-close-button","data-testid":"alert-close-button",_ariaDescription:(null==r?void 0:r.trim())||"",_hideLabel:!0,_icons:{left:{icon:"kolicon-cross"}},_label:d,_on:{onClick:_},_tooltipAlign:"left"})),"card"===i&&h("div",{class:BEM_CLASS_ALERT__CONTENT,"aria-describedby":r?"heading":void 0},l))};export{KolAlertFc as K};
+import{_ as __rest}from"./tslib.es6-CxX45GIN.js";import{h,F as Fragment}from"./index-N6JGlBHl.js";import{c as clsx}from"./clsx-COFh-Vc8.js";import{b as KolButtonWcTag}from"./component-names-Dy77vq43.js";import{t as translate}from"./i18n-Br16IAnY.js";import{b as bem}from"./bem-registry-DChqxUD_.js";import{I as IconFC}from"./component-B1PVR7eV.js";import{K as KolHeadingFc}from"./Heading-r-gS-c4n.js";const alertBem$1=bem.forBlock("kol-alert"),BEM_CLASS_ALERT__ICON=alertBem$1("icon"),ALERT_ICON_CONFIG={error:{label:translate("kol-error"),icon:"kolicon-alert-error"},info:{label:translate("kol-info"),icon:"kolicon-alert-info"},warning:{label:translate("kol-warning"),icon:"kolicon-alert-warning"},success:{label:translate("kol-success"),icon:"kolicon-alert-success"},default:{label:translate("kol-message"),icon:"kolicon-alert-info"}},AlertIcon=({type:e="default"})=>{const l=ALERT_ICON_CONFIG[e||"default"];return h(Fragment,null,h("span",{class:"visually-hidden"},l.label),h(IconFC,{class:BEM_CLASS_ALERT__ICON,label:"",icons:l.icon}))},alertBem=bem.forBlock("kol-alert"),BEM_CLASS_ALERT__CLOSER=alertBem("closer"),BEM_CLASS_ALERT__CONTENT=alertBem("content"),vibrateOnError=()=>{if("undefined"==typeof navigator||"function"!=typeof navigator.vibrate)return;const e=navigator.userActivation;if(((null==e?void 0:e.isActive)||(null==e?void 0:e.hasBeenActive))&&matchMedia("(any-pointer: coarse)").matches)try{navigator.vibrate([100,75,100,75,100])}catch(e){}},KolAlertFc=(e,l)=>{const{class:a={},alert:t=!1,hasCloser:o=!1,label:r,level:n=0,type:s="default",variant:i="msg",onAlertTimeout:c,onCloserClick:_}=e,m=__rest(e,["class","alert","hasCloser","label","level","type","variant","onAlertTimeout","onCloserClick"]),d=translate("kol-close-alert");t&&(vibrateOnError(),setTimeout(()=>{null==c||c()},1e4));const b=alertBem({hasCloser:!!o,[`type-${s}`]:!0,[`variant-${i}`]:!0}),C=alertBem("heading",{[`h${n}`]:!0}),v=Object.assign({class:clsx(a,b)},m);return h("div",Object.assign({role:t?"alert":void 0},v,{"data-testid":"alert"}),h("div",{class:"kol-alert__container"},h(AlertIcon,{label:r,type:s}),h("div",{class:"kol-alert__container-content"},r&&h(KolHeadingFc,{class:C,level:n,id:"heading"},r),"msg"===i&&h("span",{class:BEM_CLASS_ALERT__CONTENT,"aria-describedby":r?"heading":void 0},l)),o&&h(KolButtonWcTag,{class:BEM_CLASS_ALERT__CLOSER+" kol-close-button","data-testid":"alert-close-button",_ariaDescription:(null==r?void 0:r.trim())||"",_hideLabel:!0,_icons:{left:{icon:"kolicon-cross"}},_label:d,_on:{onClick:_},_tooltipAlign:"left"})),"card"===i&&h("div",{class:BEM_CLASS_ALERT__CONTENT,"aria-describedby":r?"heading":void 0},l))};export{KolAlertFc as K};

package/dist/esm/{Alert-Bu9uPVl2.js.map → Alert-CBfalBKc.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Alert-~~Bu9uPVl2~~.js","sources":["src/functional-components/AlertIcon/AlertIcon.tsx","src/functional-components/Alert/Alert.tsx"],"sourcesContent":["import { Fragment, h, type FunctionalComponent as FC } from '@stencil/core';\nimport { translate } from '../../i18n';\nimport { IconFC } from '../../internal/functional-components/icon/component';\nimport type { AlertType } from '../../schema';\nimport { bem } from '../../schema/bem-registry';\n\nconst alertBem = bem.forBlock('kol-alert');\nconst BEM_CLASS_ALERT__ICON = alertBem('icon');\n\n/*\n The icon uses a visually-hidden span instead of an aria-label because the Alert might be referenced as content for aria-describedby.\n * In this scenario, Firefox with NVDA does not properly read the aria-label, so the visually-hidden span ensures correct screen reader behavior.\n * @see https://github.com/public-ui/kolibri/issues/7119\n /\nconst ALERT_ICON_CONFIG: Record<AlertType \| 'default', { label: string; icon: string }> = {\n\terror: {\n\t\tlabel: translate('kol-error'),\n\t\ticon: 'kolicon-alert-error',\n\t},\n\tinfo: {\n\t\tlabel: translate('kol-info'),\n\t\ticon: 'kolicon-alert-info',\n\t},\n\twarning: {\n\t\tlabel: translate('kol-warning'),\n\t\ticon: 'kolicon-alert-warning',\n\t},\n\tsuccess: {\n\t\tlabel: translate('kol-success'),\n\t\ticon: 'kolicon-alert-success',\n\t},\n\tdefault: {\n\t\tlabel: translate('kol-message'),\n\t\ticon: 'kolicon-alert-info',\n\t},\n};\n\nconst AlertIcon: FC<{ label?: string; type?: AlertType }> = ({ type = 'default' }) => {\n\tconst config = ALERT_ICON_CONFIG[type \|\| 'default'];\n\treturn (\n\t\t<>\n\t\t\t<span class=\"visually-hidden\">{config.label}</span>\n\t\t\t<IconFC class={BEM_CLASS_ALERT__ICON} label=\"\" icons={config.icon} />\n\t\t</>\n\t);\n};\n\nexport default AlertIcon;\n","import { h, type FunctionalComponent as FC } from '@stencil/core';\nimport { type JSXBase } from '@stencil/core/internal';\nimport clsx from '../../utils/clsx';\n\nimport { KolButtonWcTag } from '../../core/component-names';\nimport { translate } from '../../i18n';\nimport { type InternalAlertProps } from '../../schema';\nimport { bem } from '../../schema/bem-registry';\nimport AlertIcon from '../AlertIcon';\nimport KolHeadingFc from '../Heading';\n\nconst alertBem = bem.forBlock('kol-alert');\nconst BEM_CLASS_ALERT__CLOSER = alertBem('closer');\nconst BEM_CLASS_ALERT__CONTENT = alertBem('content');\n\nexport type KolAlertFcProps = JSXBase.HTMLAttributes<HTMLDivElement> &\n\tPartial<Omit<InternalAlertProps, 'on'>> & {\n\t\tonCloserClick?: () => void;\n\t\tonAlertTimeout?: () => void;\n\t};\n\n/\n - https://developer.mozilla.org/de/docs/Web/API/Navigator/vibrate\n * - https://googlechrome.github.io/samples/vibration/\n * - Ongoing discussion: https://github.com/public-ui/kolibri/issues/7191\n * @todo Move side-effect out of render-function to avoid multiple incarnations.\n /\nconst vibrateOnError = (): void => {\n\tif (typeof navigator === 'undefined' \|\| typeof navigator.vibrate !== 'function') {\n\t\treturn;\n\t}\n\tconst ua = navigator.userActivation;\n\tconst hasGesture = ua?.isActive \|\| ua?.hasBeenActive;\n\tif (!hasGesture) {\n\t\treturn;\n\t}\n\tif (!matchMedia('(any-pointer: coarse)').matches) {\n\t\treturn;\n\t}\n\ttry {\n\t\tnavigator.vibrate([100, 75, 100, 75, 100]);\n\t} catch {\n\t\t/ no-op /\n\t}\n};\n\nconst KolAlertFc: FC<KolAlertFcProps> = (props, children) => {\n\tconst {\n\t\tclass: classNames = {},\n\t\talert = false,\n\t\thasCloser = false,\n\t\tlabel,\n\t\tlevel = 0,\n\t\ttype = 'default',\n\t\tvariant = 'msg',\n\t\tonAlertTimeout,\n\t\tonCloserClick,\n\t\t...other\n\t} = props;\n\n\tconst translateCloseAlert = translate('kol-close-alert');\n\n\tif (alert) {\n\t\tvibrateOnError();\n\n\t\tsetTimeout(() => {\n\t\t\tonAlertTimeout?.();\n\t\t}, 10000);\n\t}\n\n\t/\n\t Define the dynamic BEM class names for the alert component.\n\t */\n\tconst BEM_CLASS_ROOT = alertBem({\n\t\thasCloser: !!hasCloser,\n\t\t[`type-${type}`]: true,\n\t\t[`variant-${variant}`]: true,\n\t});\n\tconst BEM_CLASS__HEADING = alertBem('heading', {\n\t\t[`h${level}`]: true,\n\t});\n\n\tconst rootProps: Partial<JSXBase.HTMLAttributes<HTMLDivElement>> = {\n\t\tclass: clsx(classNames, BEM_CLASS_ROOT),\n\t\t...other,\n\t};\n\n\treturn (\n\t\t<div role={alert ? 'alert' : undefined} {...rootProps} data-testid=\"alert\">\n\t\t\t<div class=\"kol-alert__container\">\n\t\t\t\t<AlertIcon label={label} type={type} />\n\t\t\t\t<div class=\"kol-alert__container-content\">\n\t\t\t\t\t{label && (\n\t\t\t\t\t\t<KolHeadingFc class={BEM_CLASS__HEADING} level={level} id=\"heading\">\n\t\t\t\t\t\t\t{label}\n\t\t\t\t\t\t</KolHeadingFc>\n\t\t\t\t\t)}\n\t\t\t\t\t{variant === 'msg' && (\n\t\t\t\t\t\t<span class={BEM_CLASS_ALERT__CONTENT} aria-describedby={label ? 'heading' : undefined}>\n\t\t\t\t\t\t\t{children}\n\t\t\t\t\t\t</span>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t\t{hasCloser && (\n\t\t\t\t\t<KolButtonWcTag\n\t\t\t\t\t\tclass={BEM_CLASS_ALERT__CLOSER + ' kol-close-button'}\n\t\t\t\t\t\tdata-testid=\"alert-close-button\"\n\t\t\t\t\t\t_ariaDescription={label?.trim() \|\| ''}\n\t\t\t\t\t\t_hideLabel\n\t\t\t\t\t\t_icons={{\n\t\t\t\t\t\t\tleft: {\n\t\t\t\t\t\t\t\ticon: 'kolicon-cross',\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t}}\n\t\t\t\t\t\t_label={translateCloseAlert}\n\t\t\t\t\t\t_on={{ onClick: onCloserClick }}\n\t\t\t\t\t\t_tooltipAlign=\"left\"\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t\t{variant === 'card' && (\n\t\t\t\t<div class={BEM_CLASS_ALERT__CONTENT} aria-describedby={label ? 'heading' : undefined}>\n\t\t\t\t\t{children}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</div>\n\t);\n};\n\nexport default KolAlertFc;\n"],"names":["alertBem"],"mappings":"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"}
1	+ {"version":3,"file":"Alert-CBfalBKc.js","sources":["src/functional-components/AlertIcon/AlertIcon.tsx","src/functional-components/Alert/Alert.tsx"],"sourcesContent":["import { Fragment, h, type FunctionalComponent as FC } from '@stencil/core';\nimport { translate } from '../../i18n';\nimport { IconFC } from '../../internal/functional-components/icon/component';\nimport type { AlertType } from '../../schema';\nimport { bem } from '../../schema/bem-registry';\n\nconst alertBem = bem.forBlock('kol-alert');\nconst BEM_CLASS_ALERT__ICON = alertBem('icon');\n\n/*\n The icon uses a visually-hidden span instead of an aria-label because the Alert might be referenced as content for aria-describedby.\n * In this scenario, Firefox with NVDA does not properly read the aria-label, so the visually-hidden span ensures correct screen reader behavior.\n * @see https://github.com/public-ui/kolibri/issues/7119\n /\nconst ALERT_ICON_CONFIG: Record<AlertType \| 'default', { label: string; icon: string }> = {\n\terror: {\n\t\tlabel: translate('kol-error'),\n\t\ticon: 'kolicon-alert-error',\n\t},\n\tinfo: {\n\t\tlabel: translate('kol-info'),\n\t\ticon: 'kolicon-alert-info',\n\t},\n\twarning: {\n\t\tlabel: translate('kol-warning'),\n\t\ticon: 'kolicon-alert-warning',\n\t},\n\tsuccess: {\n\t\tlabel: translate('kol-success'),\n\t\ticon: 'kolicon-alert-success',\n\t},\n\tdefault: {\n\t\tlabel: translate('kol-message'),\n\t\ticon: 'kolicon-alert-info',\n\t},\n};\n\nconst AlertIcon: FC<{ label?: string; type?: AlertType }> = ({ type = 'default' }) => {\n\tconst config = ALERT_ICON_CONFIG[type \|\| 'default'];\n\treturn (\n\t\t<>\n\t\t\t<span class=\"visually-hidden\">{config.label}</span>\n\t\t\t<IconFC class={BEM_CLASS_ALERT__ICON} label=\"\" icons={config.icon} />\n\t\t</>\n\t);\n};\n\nexport default AlertIcon;\n","import { h, type FunctionalComponent as FC } from '@stencil/core';\nimport { type JSXBase } from '@stencil/core/internal';\nimport clsx from '../../utils/clsx';\n\nimport { KolButtonWcTag } from '../../core/component-names';\nimport { translate } from '../../i18n';\nimport { type InternalAlertProps } from '../../schema';\nimport { bem } from '../../schema/bem-registry';\nimport AlertIcon from '../AlertIcon';\nimport KolHeadingFc from '../Heading';\n\nconst alertBem = bem.forBlock('kol-alert');\nconst BEM_CLASS_ALERT__CLOSER = alertBem('closer');\nconst BEM_CLASS_ALERT__CONTENT = alertBem('content');\n\nexport type KolAlertFcProps = JSXBase.HTMLAttributes<HTMLDivElement> &\n\tPartial<Omit<InternalAlertProps, 'on'>> & {\n\t\tonCloserClick?: () => void;\n\t\tonAlertTimeout?: () => void;\n\t};\n\n/\n - https://developer.mozilla.org/de/docs/Web/API/Navigator/vibrate\n * - https://googlechrome.github.io/samples/vibration/\n * - Ongoing discussion: https://github.com/public-ui/kolibri/issues/7191\n * @todo Move side-effect out of render-function to avoid multiple incarnations.\n /\nconst vibrateOnError = (): void => {\n\tif (typeof navigator === 'undefined' \|\| typeof navigator.vibrate !== 'function') {\n\t\treturn;\n\t}\n\tconst ua = navigator.userActivation;\n\tconst hasGesture = ua?.isActive \|\| ua?.hasBeenActive;\n\tif (!hasGesture) {\n\t\treturn;\n\t}\n\tif (!matchMedia('(any-pointer: coarse)').matches) {\n\t\treturn;\n\t}\n\ttry {\n\t\tnavigator.vibrate([100, 75, 100, 75, 100]);\n\t} catch {\n\t\t/ no-op /\n\t}\n};\n\nconst KolAlertFc: FC<KolAlertFcProps> = (props, children) => {\n\tconst {\n\t\tclass: classNames = {},\n\t\talert = false,\n\t\thasCloser = false,\n\t\tlabel,\n\t\tlevel = 0,\n\t\ttype = 'default',\n\t\tvariant = 'msg',\n\t\tonAlertTimeout,\n\t\tonCloserClick,\n\t\t...other\n\t} = props;\n\n\tconst translateCloseAlert = translate('kol-close-alert');\n\n\tif (alert) {\n\t\tvibrateOnError();\n\n\t\tsetTimeout(() => {\n\t\t\tonAlertTimeout?.();\n\t\t}, 10000);\n\t}\n\n\t/\n\t Define the dynamic BEM class names for the alert component.\n\t */\n\tconst BEM_CLASS_ROOT = alertBem({\n\t\thasCloser: !!hasCloser,\n\t\t[`type-${type}`]: true,\n\t\t[`variant-${variant}`]: true,\n\t});\n\tconst BEM_CLASS__HEADING = alertBem('heading', {\n\t\t[`h${level}`]: true,\n\t});\n\n\tconst rootProps: Partial<JSXBase.HTMLAttributes<HTMLDivElement>> = {\n\t\tclass: clsx(classNames, BEM_CLASS_ROOT),\n\t\t...other,\n\t};\n\n\treturn (\n\t\t<div role={alert ? 'alert' : undefined} {...rootProps} data-testid=\"alert\">\n\t\t\t<div class=\"kol-alert__container\">\n\t\t\t\t<AlertIcon label={label} type={type} />\n\t\t\t\t<div class=\"kol-alert__container-content\">\n\t\t\t\t\t{label && (\n\t\t\t\t\t\t<KolHeadingFc class={BEM_CLASS__HEADING} level={level} id=\"heading\">\n\t\t\t\t\t\t\t{label}\n\t\t\t\t\t\t</KolHeadingFc>\n\t\t\t\t\t)}\n\t\t\t\t\t{variant === 'msg' && (\n\t\t\t\t\t\t<span class={BEM_CLASS_ALERT__CONTENT} aria-describedby={label ? 'heading' : undefined}>\n\t\t\t\t\t\t\t{children}\n\t\t\t\t\t\t</span>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t\t{hasCloser && (\n\t\t\t\t\t<KolButtonWcTag\n\t\t\t\t\t\tclass={BEM_CLASS_ALERT__CLOSER + ' kol-close-button'}\n\t\t\t\t\t\tdata-testid=\"alert-close-button\"\n\t\t\t\t\t\t_ariaDescription={label?.trim() \|\| ''}\n\t\t\t\t\t\t_hideLabel\n\t\t\t\t\t\t_icons={{\n\t\t\t\t\t\t\tleft: {\n\t\t\t\t\t\t\t\ticon: 'kolicon-cross',\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t}}\n\t\t\t\t\t\t_label={translateCloseAlert}\n\t\t\t\t\t\t_on={{ onClick: onCloserClick }}\n\t\t\t\t\t\t_tooltipAlign=\"left\"\n\t\t\t\t\t/>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t\t{variant === 'card' && (\n\t\t\t\t<div class={BEM_CLASS_ALERT__CONTENT} aria-describedby={label ? 'heading' : undefined}>\n\t\t\t\t\t{children}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</div>\n\t);\n};\n\nexport default KolAlertFc;\n"],"names":["alertBem"],"mappings":"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"}

package/dist/esm/Collapsible-SP4og2Wc.js ADDED Viewed

@@ -0,0 +1,4 @@
+/*!
+ * KoliBri - The accessible HTML-Standard
+ */
+import{_ as __rest}from"./tslib.es6-CxX45GIN.js";import{h}from"./index-N6JGlBHl.js";import{b as KolButtonWcTag}from"./component-names-Dy77vq43.js";import{c as clsx}from"./clsx-COFh-Vc8.js";import{a as createRelatedUniqueId}from"./dev.utils-DhW8_Z_C.js";import{K as KolHeadingFc}from"./Heading-r-gS-c4n.js";const KolCollapsibleFc=(l,e)=>{const{id:o,class:s,label:a,level:i=1,disabled:n,open:c,onClick:d,HeadingProps:r={},HeadingButtonProps:t={},ContentProps:p={}}=l,_=__rest(l,["id","class","label","level","disabled","open","onClick","HeadingProps","HeadingButtonProps","ContentProps"]),b=c?"kolicon-chevron-down":"kolicon-chevron-right",v=createRelatedUniqueId(o,"heading"),u=createRelatedUniqueId(o,"control");return h("div",Object.assign({id:o,class:clsx("collapsible",{"collapsible--disabled":!0===n,"collapsible--open":!0===c},s)},_),h(KolHeadingFc,{ref:null==r?void 0:r.ref,level:i,class:clsx("collapsible__heading",null==r?void 0:r.class)},h(KolButtonWcTag,{class:clsx("collapsible__heading-button",null==t?void 0:t.class),ref:null==t?void 0:t.ref,slot:"expert",id:v,_ariaControls:u,_ariaExpanded:c,_disabled:n,_icons:(null==t?void 0:t._icons)||`${b}`,_label:a,_on:{onClick:d}})),h("div",{class:clsx("collapsible__wrapper",null==p?void 0:p.wrapperClass)},h("div",{class:clsx("collapsible__wrapper-animation",null==p?void 0:p.animationClass)},h("div",{"aria-hidden":!1===c?"true":void 0,"aria-labelledby":v,role:"region",class:clsx("collapsible__content",null==p?void 0:p.class),id:u},e))))};export{KolCollapsibleFc as K};

package/dist/esm/Collapsible-SP4og2Wc.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Collapsible-SP4og2Wc.js","sources":["src/functional-components/Collapsible/Collapsible.tsx"],"sourcesContent":["import type { FunctionalComponent as FC } from '@stencil/core';\nimport { h } from '@stencil/core';\nimport type { JSXBase } from '@stencil/core/internal';\nimport { KolButtonWcTag } from '../../core/component-names';\nimport type { EventValueOrEventCallback, HeadingLevel, IconsPropType, StencilUnknown } from '../../schema';\nimport clsx from '../../utils/clsx';\nimport { createRelatedUniqueId } from '../../utils/dev.utils';\nimport KolHeadingFc from '../Heading';\n\ntype ClassType =\n\t| string\n\t| {\n\t\t\t[className: string]: boolean;\n\t };\n\nexport type CollapsibleProps = Omit<JSXBase.HTMLAttributes<HTMLElement>, 'id' | 'onClick'> & {\n\tid: string;\n\topen?: boolean;\n\tdisabled?: boolean;\n\tlevel?: HeadingLevel;\n\tlabel: string;\n\tonClick?: EventValueOrEventCallback<MouseEvent, StencilUnknown>;\n\n\tHeadingProps?: {\n\t\tref?: ((elm?: HTMLElement | undefined) => void) | undefined;\n\t\tclass?: ClassType;\n\t};\n\n\tHeadingButtonProps?: {\n\t\tref?: ((elm?: HTMLKolButtonWcElement | undefined) => void) | undefined;\n\t\tclass?: ClassType;\n\t\t_icons?: IconsPropType;\n\t};\n\n\tContentProps?: {\n\t\tclass?: ClassType;\n\t\tanimationClass?: ClassType;\n\t\twrapperClass?: ClassType;\n\t};\n};\n\nconst KolCollapsibleFc: FC<CollapsibleProps> = (props, children) => {\n\tconst { id, class: classNames, label, level = 1, disabled, open, onClick, HeadingProps = {}, HeadingButtonProps = {}, ContentProps = {}, ...other } = props;\n\tconst icon = open ? 'kolicon-chevron-down' : 'kolicon-chevron-right';\n\n\tconst headingId = createRelatedUniqueId(id, 'heading');\n\tconst controlId = createRelatedUniqueId(id, 'control');\n\n\treturn (\n\t\t<div\n\t\t\tid={id}\n\t\t\tclass={clsx(\n\t\t\t\t'collapsible',\n\t\t\t\t{\n\t\t\t\t\t'collapsible--disabled': disabled === true,\n\t\t\t\t\t'collapsible--open': open === true,\n\t\t\t\t},\n\t\t\t\tclassNames,\n\t\t\t)}\n\t\t\t{...other}\n\t\t>\n\t\t\t<KolHeadingFc ref={HeadingProps?.ref} level={level} class={clsx('collapsible__heading', HeadingProps?.class)}>\n\t\t\t\t<KolButtonWcTag\n\t\t\t\t\tclass={clsx('collapsible__heading-button', HeadingButtonProps?.class)}\n\t\t\t\t\tref={HeadingButtonProps?.ref}\n\t\t\t\t\tslot=\"expert\"\n\t\t\t\t\tid={headingId}\n\t\t\t\t\t_ariaControls={controlId}\n\t\t\t\t\t_ariaExpanded={open}\n\t\t\t\t\t_disabled={disabled}\n\t\t\t\t\t_icons={HeadingButtonProps?._icons || `${icon}`}\n\t\t\t\t\t_label={label}\n\t\t\t\t\t_on={{ onClick }}\n\t\t\t\t></KolButtonWcTag>\n\t\t\t</KolHeadingFc>\n\t\t\t<div class={clsx('collapsible__wrapper', ContentProps?.wrapperClass)}>\n\t\t\t\t<div class={clsx('collapsible__wrapper-animation', ContentProps?.animationClass)}>\n\t\t\t\t\t<div\n\t\t\t\t\t\taria-hidden={open === false ? 'true' : undefined}\n\t\t\t\t\t\taria-labelledby={headingId}\n\t\t\t\t\t\trole=\"region\"\n\t\t\t\t\t\tclass={clsx('collapsible__content', ContentProps?.class)}\n\t\t\t\t\t\tid={controlId}\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</div>\n\t);\n};\n\nexport default KolCollapsibleFc;\n"],"names":[],"mappings":"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"}

package/dist/esm/{CustomSuggestionsOptionsGroup-tlygvNsM.js → CustomSuggestionsOptionsGroup-B6wXJlus.js} RENAMED Viewed

@@ -1,4 +1,4 @@
 /*!
  * KoliBri - The accessible HTML-Standard
  */
-import{h}from"./index-CSjYA5Lb.js";import{c as clsx}from"./clsx-COFh-Vc8.js";const CustomSuggestionsOptionFc=({disabled:o,index:s,ref:e,selected:n,onClick:i,onMouseOver:t,onFocus:u,onKeyDown:l,option:r,searchTerm:c})=>h("li",{id:`option-${s}`,key:`-${s}`,ref:e,"data-index":s,tabIndex:-1,role:"option","aria-selected":n?"true":void 0,"aria-disabled":o?"true":void 0,onClick:i,onMouseOver:t,onFocus:u,class:clsx("kol-custom-suggestions-option",{"kol-custom-suggestions-option--disabled":o}),onKeyDown:l},h("span",null,((o,s)=>{if(!(null==s?void 0:s.trim()))return o;const e=new RegExp(`(${s.replace(/[.*+?^${}()|[\]\\]/g,"\\$&")})`,"gi");return o.split(e).map((o,s)=>s%2==1?h("mark",null,o):o)})(String(r),c||""))),CustomSuggestionsOptionsGroupFc=({blockSuggestionMouseOver:o,onKeyDown:s,style:e,hidden:n,id:i},t)=>h("ul",{id:i,role:"listbox",style:e,class:clsx("kol-custom-suggestions-options-group",{"kol-custom-suggestions-options-group--cursor-hidden":o,"kol-custom-suggestions-options-group--open":!n}),hidden:n,onKeyDown:s},t);export{CustomSuggestionsOptionsGroupFc as C,CustomSuggestionsOptionFc as a};
+import{h}from"./index-N6JGlBHl.js";import{c as clsx}from"./clsx-COFh-Vc8.js";const CustomSuggestionsOptionFc=({disabled:o,index:s,ref:e,selected:n,onClick:i,onMouseOver:t,onFocus:u,onKeyDown:l,option:r,searchTerm:c})=>h("li",{id:`option-${s}`,key:`-${s}`,ref:e,"data-index":s,tabIndex:-1,role:"option","aria-selected":n?"true":void 0,"aria-disabled":o?"true":void 0,onClick:i,onMouseOver:t,onFocus:u,class:clsx("kol-custom-suggestions-option",{"kol-custom-suggestions-option--disabled":o}),onKeyDown:l},h("span",null,((o,s)=>{if(!(null==s?void 0:s.trim()))return o;const e=new RegExp(`(${s.replace(/[.*+?^${}()|[\]\\]/g,"\\$&")})`,"gi");return o.split(e).map((o,s)=>s%2==1?h("mark",null,o):o)})(String(r),c||""))),CustomSuggestionsOptionsGroupFc=({blockSuggestionMouseOver:o,onKeyDown:s,style:e,hidden:n,id:i},t)=>h("ul",{id:i,role:"listbox",style:e,class:clsx("kol-custom-suggestions-options-group",{"kol-custom-suggestions-options-group--cursor-hidden":o,"kol-custom-suggestions-options-group--open":!n}),hidden:n,onKeyDown:s},t);export{CustomSuggestionsOptionsGroupFc as C,CustomSuggestionsOptionFc as a};

package/dist/esm/{CustomSuggestionsOptionsGroup-tlygvNsM.js.map → CustomSuggestionsOptionsGroup-B6wXJlus.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CustomSuggestionsOptionsGroup-~~tlygvNsM~~.js","sources":["src/functional-components/CustomSuggestionsOption/CustomSuggestionsOption.tsx","src/functional-components/CustomSuggestionsOptionsGroup/CustomSuggestionsOptionsGroup.tsx"],"sourcesContent":["import { type FunctionalComponent as FC, h } from '@stencil/core';\nimport type { JSXBase } from '@stencil/core/internal';\nimport type { W3CInputValue } from '../../schema';\nimport clsx from '../../utils/clsx';\n\nexport type CustomSuggestionsProps = JSXBase.HTMLAttributes<HTMLLIElement> & {\n\tdisabled: boolean;\n\tindex: number;\n\toption: W3CInputValue;\n\tselected: boolean;\n\tsearchTerm?: string;\n\tref?: ((elm?: HTMLLIElement \| undefined) => void) \| undefined;\n};\n\nconst CustomSuggestionsOptionFc: FC<CustomSuggestionsProps> = ({\n\tdisabled,\n\tindex,\n\tref,\n\tselected,\n\tonClick,\n\tonMouseOver,\n\tonFocus,\n\tonKeyDown,\n\toption,\n\tsearchTerm,\n}) => {\n\tconst highlightSearchTerm = (text: string, searchTerm: string) => {\n\t\tif (!searchTerm?.trim()) return text;\n\n\t\tconst regex = new RegExp(`(${searchTerm.replace(/[.*+?^${}()\|[\\]\\\\]/g, '\\\\$&')})`, 'gi');\n\t\tconst parts = text.split(regex);\n\n\t\treturn parts.map((part, partIndex) => (partIndex % 2 === 1 ? <mark>{part}</mark> : part));\n\t};\n\n\treturn (\n\t\t<li\n\t\t\tid={`option-${index}`}\n\t\t\tkey={`-${index}`}\n\t\t\tref={ref}\n\t\t\tdata-index={index}\n\t\t\ttabIndex={-1}\n\t\t\trole=\"option\"\n\t\t\taria-selected={selected ? 'true' : undefined}\n\t\t\taria-disabled={disabled ? 'true' : undefined}\n\t\t\tonClick={onClick}\n\t\t\tonMouseOver={onMouseOver}\n\t\t\tonFocus={onFocus}\n\t\t\tclass={clsx('kol-custom-suggestions-option', { 'kol-custom-suggestions-option--disabled': disabled })}\n\t\t\tonKeyDown={onKeyDown}\n\t\t>\n\t\t\t<span>{highlightSearchTerm(String(option), searchTerm \|\| '')}</span>\n\t\t</li>\n\t);\n};\nexport default CustomSuggestionsOptionFc;\n","import { type FunctionalComponent as FC, h } from '@stencil/core';\nimport type { JSXBase } from '@stencil/core/internal';\nimport clsx from '../../utils/clsx';\n\nexport type CustomSuggestionsOptionsGroupProps = JSXBase.HTMLAttributes<HTMLUListElement> & {\n\tblockSuggestionMouseOver: boolean;\n};\n\nconst CustomSuggestionsOptionsGroupFc: FC<CustomSuggestionsOptionsGroupProps> = ({ blockSuggestionMouseOver, onKeyDown, style, hidden, id }, children) => {\n\treturn (\n\t\t<ul\n\t\t\tid={id}\n\t\t\trole=\"listbox\"\n\t\t\tstyle={style}\n\t\t\tclass={clsx('kol-custom-suggestions-options-group', {\n\t\t\t\t'kol-custom-suggestions-options-group--cursor-hidden': blockSuggestionMouseOver,\n\t\t\t\t'kol-custom-suggestions-options-group--open': !hidden,\n\t\t\t})}\n\t\t\thidden={hidden}\n\t\t\tonKeyDown={onKeyDown}\n\t\t>\n\t\t\t{children}\n\t\t</ul>\n\t);\n};\nexport default CustomSuggestionsOptionsGroupFc;\n"],"names":[],"mappings":";;;;;;AAcM,MAAA,yBAAyB,GAA+B,CAAC,EAC9D,QAAQ,EACR,KAAK,EACL,GAAG,EACH,QAAQ,EACR,OAAO,EACP,WAAW,EACX,OAAO,EACP,SAAS,EACT,MAAM,EACN,UAAU,GACV,KAAI;AACJ,IAAA,MAAM,mBAAmB,GAAG,CAAC,IAAY,EAAE,UAAkB,KAAI;QAChE,IAAI,EAAC,UAAU,KAAV,IAAA,IAAA,UAAU,uBAAV,UAAU,CAAE,IAAI,EAAE,CAAA;AAAE,YAAA,OAAO,IAAI;AAEpC,QAAA,MAAM,KAAK,GAAG,IAAI,MAAM,CAAC,CAAA,CAAA,EAAI,UAAU,CAAC,OAAO,CAAC,qBAAqB,EAAE,MAAM,CAAC,GAAG,EAAE,IAAI,CAAC;QACxF,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC;AAE/B,QAAA,OAAO,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,SAAS,MAAM,SAAS,GAAG,CAAC,KAAK,CAAC,GAAG,CAAO,CAAA,MAAA,EAAA,IAAA,EAAA,IAAI,CAAQ,GAAG,IAAI,CAAC,CAAC;AAC1F,KAAC;IAED,QACC,CACC,CAAA,IAAA,EAAA,EAAA,EAAE,EAAE,CAAU,OAAA,EAAA,KAAK,CAAE,CAAA,EACrB,GAAG,EAAE,CAAA,CAAA,EAAI,KAAK,CAAA,CAAE,EAChB,GAAG,EAAE,GAAG,EAAA,YAAA,EACI,KAAK,EACjB,QAAQ,EAAE,EAAE,EACZ,IAAI,EAAC,QAAQ,EACE,eAAA,EAAA,QAAQ,GAAG,MAAM,GAAG,SAAS,EAC7B,eAAA,EAAA,QAAQ,GAAG,MAAM,GAAG,SAAS,EAC5C,OAAO,EAAE,OAAO,EAChB,WAAW,EAAE,WAAW,EACxB,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,IAAI,CAAC,+BAA+B,EAAE,EAAE,yCAAyC,EAAE,QAAQ,EAAE,CAAC,EACrG,SAAS,EAAE,SAAS,EAAA,EAEpB,CAAA,CAAA,MAAA,EAAA,IAAA,EAAO,mBAAmB,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,UAAU,IAAI,EAAE,CAAC,CAAQ,CAChE;AAEP;;AC9CA,MAAM,+BAA+B,GAA2C,CAAC,EAAE,wBAAwB,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,EAAE,EAAE,QAAQ,KAAI;IACxJ,QACC,CACC,CAAA,IAAA,EAAA,EAAA,EAAE,EAAE,EAAE,EACN,IAAI,EAAC,SAAS,EACd,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,IAAI,CAAC,sCAAsC,EAAE;AACnD,YAAA,qDAAqD,EAAE,wBAAwB;YAC/E,4CAA4C,EAAE,CAAC,MAAM;AACrD,SAAA,CAAC,EACF,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,SAAS,EAEnB,EAAA,QAAQ,CACL;AAEP;;;;"}
1	+ {"version":3,"file":"CustomSuggestionsOptionsGroup-B6wXJlus.js","sources":["src/functional-components/CustomSuggestionsOption/CustomSuggestionsOption.tsx","src/functional-components/CustomSuggestionsOptionsGroup/CustomSuggestionsOptionsGroup.tsx"],"sourcesContent":["import { type FunctionalComponent as FC, h } from '@stencil/core';\nimport type { JSXBase } from '@stencil/core/internal';\nimport type { W3CInputValue } from '../../schema';\nimport clsx from '../../utils/clsx';\n\nexport type CustomSuggestionsProps = JSXBase.HTMLAttributes<HTMLLIElement> & {\n\tdisabled: boolean;\n\tindex: number;\n\toption: W3CInputValue;\n\tselected: boolean;\n\tsearchTerm?: string;\n\tref?: ((elm?: HTMLLIElement \| undefined) => void) \| undefined;\n};\n\nconst CustomSuggestionsOptionFc: FC<CustomSuggestionsProps> = ({\n\tdisabled,\n\tindex,\n\tref,\n\tselected,\n\tonClick,\n\tonMouseOver,\n\tonFocus,\n\tonKeyDown,\n\toption,\n\tsearchTerm,\n}) => {\n\tconst highlightSearchTerm = (text: string, searchTerm: string) => {\n\t\tif (!searchTerm?.trim()) return text;\n\n\t\tconst regex = new RegExp(`(${searchTerm.replace(/[.*+?^${}()\|[\\]\\\\]/g, '\\\\$&')})`, 'gi');\n\t\tconst parts = text.split(regex);\n\n\t\treturn parts.map((part, partIndex) => (partIndex % 2 === 1 ? <mark>{part}</mark> : part));\n\t};\n\n\treturn (\n\t\t<li\n\t\t\tid={`option-${index}`}\n\t\t\tkey={`-${index}`}\n\t\t\tref={ref}\n\t\t\tdata-index={index}\n\t\t\ttabIndex={-1}\n\t\t\trole=\"option\"\n\t\t\taria-selected={selected ? 'true' : undefined}\n\t\t\taria-disabled={disabled ? 'true' : undefined}\n\t\t\tonClick={onClick}\n\t\t\tonMouseOver={onMouseOver}\n\t\t\tonFocus={onFocus}\n\t\t\tclass={clsx('kol-custom-suggestions-option', { 'kol-custom-suggestions-option--disabled': disabled })}\n\t\t\tonKeyDown={onKeyDown}\n\t\t>\n\t\t\t<span>{highlightSearchTerm(String(option), searchTerm \|\| '')}</span>\n\t\t</li>\n\t);\n};\nexport default CustomSuggestionsOptionFc;\n","import { type FunctionalComponent as FC, h } from '@stencil/core';\nimport type { JSXBase } from '@stencil/core/internal';\nimport clsx from '../../utils/clsx';\n\nexport type CustomSuggestionsOptionsGroupProps = JSXBase.HTMLAttributes<HTMLUListElement> & {\n\tblockSuggestionMouseOver: boolean;\n};\n\nconst CustomSuggestionsOptionsGroupFc: FC<CustomSuggestionsOptionsGroupProps> = ({ blockSuggestionMouseOver, onKeyDown, style, hidden, id }, children) => {\n\treturn (\n\t\t<ul\n\t\t\tid={id}\n\t\t\trole=\"listbox\"\n\t\t\tstyle={style}\n\t\t\tclass={clsx('kol-custom-suggestions-options-group', {\n\t\t\t\t'kol-custom-suggestions-options-group--cursor-hidden': blockSuggestionMouseOver,\n\t\t\t\t'kol-custom-suggestions-options-group--open': !hidden,\n\t\t\t})}\n\t\t\thidden={hidden}\n\t\t\tonKeyDown={onKeyDown}\n\t\t>\n\t\t\t{children}\n\t\t</ul>\n\t);\n};\nexport default CustomSuggestionsOptionsGroupFc;\n"],"names":[],"mappings":";;;;;;AAcM,MAAA,yBAAyB,GAA+B,CAAC,EAC9D,QAAQ,EACR,KAAK,EACL,GAAG,EACH,QAAQ,EACR,OAAO,EACP,WAAW,EACX,OAAO,EACP,SAAS,EACT,MAAM,EACN,UAAU,GACV,KAAI;AACJ,IAAA,MAAM,mBAAmB,GAAG,CAAC,IAAY,EAAE,UAAkB,KAAI;QAChE,IAAI,EAAC,UAAU,KAAV,IAAA,IAAA,UAAU,uBAAV,UAAU,CAAE,IAAI,EAAE,CAAA;AAAE,YAAA,OAAO,IAAI;AAEpC,QAAA,MAAM,KAAK,GAAG,IAAI,MAAM,CAAC,CAAA,CAAA,EAAI,UAAU,CAAC,OAAO,CAAC,qBAAqB,EAAE,MAAM,CAAC,GAAG,EAAE,IAAI,CAAC;QACxF,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC;AAE/B,QAAA,OAAO,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,SAAS,MAAM,SAAS,GAAG,CAAC,KAAK,CAAC,GAAG,CAAO,CAAA,MAAA,EAAA,IAAA,EAAA,IAAI,CAAQ,GAAG,IAAI,CAAC,CAAC;AAC1F,KAAC;IAED,QACC,CACC,CAAA,IAAA,EAAA,EAAA,EAAE,EAAE,CAAU,OAAA,EAAA,KAAK,CAAE,CAAA,EACrB,GAAG,EAAE,CAAA,CAAA,EAAI,KAAK,CAAA,CAAE,EAChB,GAAG,EAAE,GAAG,EAAA,YAAA,EACI,KAAK,EACjB,QAAQ,EAAE,EAAE,EACZ,IAAI,EAAC,QAAQ,EACE,eAAA,EAAA,QAAQ,GAAG,MAAM,GAAG,SAAS,EAC7B,eAAA,EAAA,QAAQ,GAAG,MAAM,GAAG,SAAS,EAC5C,OAAO,EAAE,OAAO,EAChB,WAAW,EAAE,WAAW,EACxB,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,IAAI,CAAC,+BAA+B,EAAE,EAAE,yCAAyC,EAAE,QAAQ,EAAE,CAAC,EACrG,SAAS,EAAE,SAAS,EAAA,EAEpB,CAAA,CAAA,MAAA,EAAA,IAAA,EAAO,mBAAmB,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,UAAU,IAAI,EAAE,CAAC,CAAQ,CAChE;AAEP;;AC9CA,MAAM,+BAA+B,GAA2C,CAAC,EAAE,wBAAwB,EAAE,SAAS,EAAE,KAAK,EAAE,MAAM,EAAE,EAAE,EAAE,EAAE,QAAQ,KAAI;IACxJ,QACC,CACC,CAAA,IAAA,EAAA,EAAA,EAAE,EAAE,EAAE,EACN,IAAI,EAAC,SAAS,EACd,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,IAAI,CAAC,sCAAsC,EAAE;AACnD,YAAA,qDAAqD,EAAE,wBAAwB;YAC/E,4CAA4C,EAAE,CAAC,MAAM;AACrD,SAAA,CAAC,EACF,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,SAAS,EAEnB,EAAA,QAAQ,CACL;AAEP;;;;"}

package/dist/esm/FieldControlStateWrapper-jOEU9Coh.js ADDED Viewed

@@ -0,0 +1,4 @@
+/*!
+ * KoliBri - The accessible HTML-Standard
+ */
+import{_ as __rest}from"./tslib.es6-CxX45GIN.js";import{h,F as Fragment}from"./index-N6JGlBHl.js";import{B as BaseWebComponent}from"./variant-quote-y0Z1TRdz.js";import{T as TooltipFC}from"./component-vV-KhMHx.js";import{T as TooltipController}from"./controller-Bdve6A-Q.js";import"./common-Cx_AGO_M.js";import{b as buildBadgeTextString,s as showExpertSlot}from"./component-DwmUGvyq.js";import{K as KolFormFieldLabelFc,b as KolFormFieldHintFc,g as getMsgType,i as isMsgDefinedAndInputTouched}from"./FormFieldStateWrapper-BqmPPhZi.js";import{c as clsx}from"./clsx-COFh-Vc8.js";import{a as createRelatedUniqueId}from"./dev.utils-DhW8_Z_C.js";const fieldControlTooltipControllerById=new Map,getFieldControlTooltipController=o=>{const l=fieldControlTooltipControllerById.get(o);if(l)return l;const e=new TooltipController(BaseWebComponent.stateLess);return e.componentWillLoad({label:""}),fieldControlTooltipControllerById.set(o,e),e},destroyFieldControlTooltipController=o=>{const l=fieldControlTooltipControllerById.get(o);l&&(l.destroy(),fieldControlTooltipControllerById.delete(o))},InputContainer=(o,l)=>{var{class:e}=o,t=__rest(o,["class"]);return h("div",Object.assign({class:clsx("kol-field-control__input",e)},t),l)},KolFieldControlFc=(o,l)=>{const{class:e,id:t,disabled:r,label:i,hideLabel:n,labelAlign:s,renderNoTooltip:a,hint:d,renderNoHint:c,accessKey:p,shortKey:f,msg:C,touched:b,required:g,readonly:m,tooltipAlign:u,tooltipFloatingRef:F,fieldControlInputProps:_,fieldControlLabelProps:y,fieldControlTooltipProps:T,fieldControlHintProps:B}=o,K=__rest(o,["class","id","disabled","label","hideLabel","labelAlign","renderNoTooltip","hint","renderNoHint","accessKey","shortKey","msg","touched","required","readonly","tooltipAlign","tooltipFloatingRef","fieldControlInputProps","fieldControlLabelProps","fieldControlTooltipProps","fieldControlHintProps"]),x=!c,v=!a,j=showExpertSlot(i),I=v&&!j&&n,k=buildBadgeTextString(p,f),A=createRelatedUniqueId(t,"label"),L=I?getFieldControlTooltipController(t):void 0;L?(L.watchAlign(u),L.watchBadgeText(k||""),L.watchId(A),L.watchLabel(i)):destroyFieldControlTooltipController(t);const P=null==_?void 0:_.ref,q=[h(Fragment,null,h(InputContainer,Object.assign({},_,{ref:o=>{null==P||P(o),L&&o&&(L.initContext(o),L.syncListeners(void 0,o,!0))}}),l),I&&h("div",{class:clsx("kol-form-field__tooltip",null==T?void 0:T.class)},h(TooltipFC,{badgeText:k||"",label:i,align:u,id:A,refFloating:null!=F?F:o=>{null==L||L.setTooltipElementRef(o)}}))),h(KolFormFieldLabelFc,Object.assign({},y||{},{id:t,baseClassName:"kol-field-control",class:clsx(null==y?void 0:y.class,{"kol-field-control__label--visually-hidden":Boolean(n)}),hasExpertSlot:j,label:i,accessKey:p,shortKey:f}))];"left"===s&&q.reverse();const O={"kol-field-control--disabled":Boolean(r),"kol-field-control--required":Boolean(g),"kol-field-control--touched":Boolean(b),"kol-field-control--hide-label":Boolean(n),"kol-field-control--read-only":Boolean(m),[`kol-field-control--${getMsgType(C)}`]:Boolean(isMsgDefinedAndInputTouched(C,b)),[`kol-field-control--label-align-${s}`]:Boolean(s)};return h("div",Object.assign({class:clsx("kol-field-control",O,e)},K),q,x&&h(KolFormFieldHintFc,Object.assign({},B||{},{baseClassName:"kol-field-control",id:t,hint:d})))};function getFieldControlProps(o){const l={id:o._id,disabled:o._disabled,msg:o._msg,hint:o._hint,label:o._label,hideLabel:o._hideLabel,touched:o._touched};return"_required"in o&&(l.required=o._required),"_readOnly"in o&&(l.readonly=o._readOnly),"_labelAlign"in o&&(l.labelAlign=o._labelAlign),"_accessKey"in o&&(l.accessKey=o._accessKey),"_shortKey"in o&&(l.shortKey=o._shortKey),l}const FieldControlStateWrapper=(o,l)=>{var{state:e}=o,t=__rest(o,["state"]);return h(KolFieldControlFc,Object.assign({},getFieldControlProps(e),t),l)};export{FieldControlStateWrapper as F};

package/dist/esm/FieldControlStateWrapper-jOEU9Coh.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"FieldControlStateWrapper-jOEU9Coh.js","sources":["src/functional-components/FieldControl/FieldControl.tsx","src/functional-component-wrappers/FieldControlStateWrapper/FieldControlStateWrapper.tsx"],"sourcesContent":["import { Fragment, h, type FunctionalComponent as FC } from '@stencil/core';\nimport type { JSXBase } from '@stencil/core/internal';\nimport { BaseWebComponent } from '../../internal/functional-components/base-web-component';\nimport { TooltipFC } from '../../internal/functional-components/tooltip/component';\nimport { TooltipController } from '../../internal/functional-components/tooltip/controller';\nimport {\n\tbuildBadgeTextString,\n\tgetMsgType,\n\tisMsgDefinedAndInputTouched,\n\tshowExpertSlot,\n\ttype AlignPropType,\n\ttype LabelAlignPropType,\n\ttype MsgPropType,\n\ttype Stringified,\n} from '../../schema';\nimport clsx from '../../utils/clsx';\nimport { createRelatedUniqueId } from '../../utils/dev.utils';\nimport KolFieldControlHintFc from '../FormFieldHint';\nimport KolFieldControlLabelFc from '../FormFieldLabel';\n\nconst fieldControlTooltipControllerById = new Map<string, TooltipController>();\n\nconst getFieldControlTooltipController = (id: string): TooltipController => {\n\tconst tooltipController = fieldControlTooltipControllerById.get(id);\n\tif (tooltipController) {\n\t\treturn tooltipController;\n\t}\n\n\tconst nextTooltipController = new TooltipController(BaseWebComponent.stateLess);\n\tnextTooltipController.componentWillLoad({ label: '' });\n\tfieldControlTooltipControllerById.set(id, nextTooltipController);\n\treturn nextTooltipController;\n};\n\nconst destroyFieldControlTooltipController = (id: string): void => {\n\tconst tooltipController = fieldControlTooltipControllerById.get(id);\n\tif (tooltipController) {\n\t\ttooltipController.destroy();\n\t\tfieldControlTooltipControllerById.delete(id);\n\t}\n};\n\nexport type FieldControlProps = Omit<JSXBase.HTMLAttributes<HTMLElement>, 'id'> & {\n\tid: string;\n\thint?: string;\n\tlabel: string;\n\thideLabel?: boolean;\n\tlabelAlign?: LabelAlignPropType;\n\taccessKey?: string;\n\tshortKey?: string;\n\ttooltipAlign?: AlignPropType;\n\tdisabled?: boolean;\n\tmsg?: Stringified<MsgPropType>;\n\ttouched?: boolean;\n\trequired?: boolean;\n\treadonly?: boolean;\n\tshowTooltip?: boolean;\n\ttooltipFloatingRef?: (el?: HTMLDivElement) => void;\n\ttooltipArrowRef?: (el?: HTMLDivElement) => void;\n\n\trenderNoLabel?: boolean;\n\trenderNoHint?: boolean;\n\trenderNoTooltip?: boolean;\n\n\tfieldControlLabelProps?: JSXBase.HTMLAttributes<Omit<HTMLLabelElement | HTMLLegendElement, 'id' | 'hidden' | 'htmlFor'>> & {\n\t\tcomponent?: 'label' | 'legend';\n\t\tshowBadge?: boolean;\n\t};\n\tfieldControlInputProps?: JSXBase.HTMLAttributes<HTMLDivElement>;\n\tfieldControlTooltipProps?: Pick<JSXBase.HTMLAttributes<HTMLElement>, 'class'>;\n\tfieldControlHintProps?: JSXBase.HTMLAttributes<HTMLElement>;\n};\n\nconst InputContainer: FC<JSXBase.HTMLAttributes<HTMLDivElement>> = ({ class: classNames, ...other }, children) => {\n\treturn (\n\t\t<div class={clsx('kol-field-control__input', classNames)} {...other}>\n\t\t\t{children}\n\t\t</div>\n\t);\n};\n\nconst KolFieldControlFc: FC<FieldControlProps> = (props, children) => {\n\tconst {\n\t\tclass: classNames,\n\t\tid,\n\t\tdisabled,\n\t\tlabel,\n\t\thideLabel,\n\t\tlabelAlign,\n\t\trenderNoTooltip,\n\t\thint,\n\t\trenderNoHint,\n\t\taccessKey,\n\t\tshortKey,\n\t\tmsg,\n\t\ttouched,\n\t\trequired,\n\t\treadonly,\n\t\ttooltipAlign,\n\t\ttooltipFloatingRef,\n\t\tfieldControlInputProps,\n\t\tfieldControlLabelProps,\n\t\tfieldControlTooltipProps,\n\t\tfieldControlHintProps,\n\t\t...other\n\t} = props;\n\n\tconst canShowHint = !renderNoHint;\n\tconst canShowTooltip = !renderNoTooltip;\n\tconst hasExpertSlot = showExpertSlot(label);\n\tconst useTooltipInsteadOfLabel = canShowTooltip && !hasExpertSlot && hideLabel;\n\tconst badgeText = buildBadgeTextString(accessKey, shortKey);\n\tconst labelId = createRelatedUniqueId(id, 'label');\n\tconst tooltipController = useTooltipInsteadOfLabel ? getFieldControlTooltipController(id) : undefined;\n\n\tif (tooltipController) {\n\t\ttooltipController.watchAlign(tooltipAlign);\n\t\ttooltipController.watchBadgeText(badgeText || '');\n\t\ttooltipController.watchId(labelId);\n\t\ttooltipController.watchLabel(label);\n\t} else {\n\t\tdestroyFieldControlTooltipController(id);\n\t}\n\n\tconst forwardedInputRef = fieldControlInputProps?.ref as ((el?: HTMLDivElement) => void) | undefined;\n\tconst setInputContainerRef = (el?: HTMLDivElement): void => {\n\t\tforwardedInputRef?.(el);\n\t\tif (tooltipController && el) {\n\t\t\ttooltipController.initContext(el);\n\t\t\ttooltipController.syncListeners(undefined, el, true);\n\t\t}\n\t};\n\n\tconst components = [\n\t\t<>\n\t\t\t<InputContainer {...fieldControlInputProps} ref={setInputContainerRef}>\n\t\t\t\t{children}\n\t\t\t</InputContainer>\n\t\t\t{useTooltipInsteadOfLabel && (\n\t\t\t\t<div class={clsx('kol-form-field__tooltip', fieldControlTooltipProps?.class)}>\n\t\t\t\t\t<TooltipFC\n\t\t\t\t\t\tbadgeText={badgeText || ''}\n\t\t\t\t\t\tlabel={label}\n\t\t\t\t\t\talign={tooltipAlign}\n\t\t\t\t\t\tid={labelId}\n\t\t\t\t\t\trefFloating={\n\t\t\t\t\t\t\ttooltipFloatingRef ??\n\t\t\t\t\t\t\t((el?: HTMLDivElement) => {\n\t\t\t\t\t\t\t\ttooltipController?.setTooltipElementRef(el);\n\t\t\t\t\t\t\t})\n\t\t\t\t\t\t}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</>,\n\t\t<KolFieldControlLabelFc\n\t\t\t{...(fieldControlLabelProps || {})}\n\t\t\tid={id}\n\t\t\tbaseClassName=\"kol-field-control\"\n\t\t\tclass={clsx(fieldControlLabelProps?.class, {\n\t\t\t\t['kol-field-control__label--visually-hidden']: Boolean(hideLabel),\n\t\t\t})}\n\t\t\thasExpertSlot={hasExpertSlot}\n\t\t\tlabel={label}\n\t\t\taccessKey={accessKey}\n\t\t\tshortKey={shortKey}\n\t\t/>,\n\t];\n\n\tif (labelAlign === 'left') {\n\t\tcomponents.reverse();\n\t}\n\n\tconst stateCssClasses = {\n\t\t['kol-field-control--disabled']: Boolean(disabled),\n\t\t['kol-field-control--required']: Boolean(required),\n\t\t['kol-field-control--touched']: Boolean(touched),\n\t\t['kol-field-control--hide-label']: Boolean(hideLabel),\n\t\t['kol-field-control--read-only']: Boolean(readonly),\n\t\t[`kol-field-control--${getMsgType(msg)}`]: Boolean(isMsgDefinedAndInputTouched(msg, touched)),\n\t\t[`kol-field-control--label-align-${labelAlign}`]: Boolean(labelAlign),\n\t};\n\n\treturn (\n\t\t<div class={clsx('kol-field-control', stateCssClasses, classNames)} {...other}>\n\t\t\t{components}\n\t\t\t{canShowHint && <KolFieldControlHintFc {...(fieldControlHintProps || {})} baseClassName=\"kol-field-control\" id={id} hint={hint} />}\n\t\t</div>\n\t);\n};\n\nexport default KolFieldControlFc;\n","import { h, type FunctionalComponent as FC } from '@stencil/core';\nimport KolFieldControlFc, { type FieldControlProps } from '../../functional-components/FieldControl';\nimport {\n\ttype InputCheckboxStates,\n\ttype InputColorStates,\n\ttype InputEmailStates,\n\ttype InputFileStates,\n\ttype InputNumberStates,\n\ttype InputPasswordStates,\n\ttype InputRadioStates,\n\ttype InputRangeStates,\n\ttype InputTextStates,\n\ttype MsgPropType,\n\ttype SelectStates,\n} from '../../schema';\n\ntype InputState =\n\t| InputTextStates\n\t| InputEmailStates\n\t| InputPasswordStates\n\t| InputNumberStates\n\t| InputColorStates\n\t| InputFileStates\n\t| InputRangeStates\n\t| InputCheckboxStates\n\t| InputRadioStates\n\t| SelectStates;\n\nexport type FieldControlStateWrapperProps = Partial<FieldControlProps> & {\n\tstate: InputState;\n};\n\nfunction getFieldControlProps(state: InputState): FieldControlProps {\n\tconst props: FieldControlProps = {\n\t\tid: state._id,\n\t\tdisabled: state._disabled,\n\t\tmsg: state._msg as MsgPropType,\n\t\thint: state._hint,\n\t\tlabel: state._label,\n\t\thideLabel: state._hideLabel,\n\t\ttouched: state._touched,\n\t};\n\n\tif ('_required' in state) {\n\t\tprops.required = state._required;\n\t}\n\n\tif ('_readOnly' in state) {\n\t\tprops.readonly = state._readOnly;\n\t}\n\n\tif ('_labelAlign' in state) {\n\t\tprops.labelAlign = state._labelAlign;\n\t}\n\n\tif ('_accessKey' in state) {\n\t\tprops.accessKey = state._accessKey;\n\t}\n\n\tif ('_shortKey' in state) {\n\t\tprops.shortKey = state._shortKey;\n\t}\n\n\treturn props;\n}\n\nconst FieldControlStateWrapper: FC<FieldControlStateWrapperProps> = ({ state, ...other }, children) => {\n\treturn (\n\t\t<KolFieldControlFc {...getFieldControlProps(state)} {...other}>\n\t\t\t{children}\n\t\t</KolFieldControlFc>\n\t);\n};\n\nexport default FieldControlStateWrapper;\n"],"names":["KolFieldControlLabelFc","KolFieldControlHintFc"],"mappings":"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"}

package/dist/esm/FormFieldStateWrapper-BqmPPhZi.js ADDED Viewed

@@ -0,0 +1,4 @@
+/*!
+ * KoliBri - The accessible HTML-Standard
+ */
+import{e as watchBoolean,g as watchString,p as parseJson,o as objectObjectHandler,b as watchValidator,G as isObject$1,i as isString,s as setState,k as a11yHint}from"./common-Cx_AGO_M.js";import{v as validateAccessKey,a as validateAccessAndShortKey,b as validateShortKey,c as validateTabIndex}from"./access-and-short-key-D734WtlX.js";import{v as validateDisabled}from"./disabled-gyBUQRnY.js";import{v as validateHideLabel}from"./hide-label-6Bx1MH20.js";import{a as validateLabelWithExpertSlot}from"./label-Fyi30H9j.js";import{v as validateTooltipAlign}from"./tooltip-align-mwhvx9nK.js";import{v as validateVariantClassName}from"./variant-class-name-BCcQYpIV.js";import{d as dispatchDomEvent,K as KolEvent}from"./events-VVvk1win.js";import{A as AssociatedInputController}from"./associated.controller-Bagx9pCw.js";import{i as isObject}from"./_Uint8Array-kJHDjtoP.js";import{i as isObjectLike,b as baseGetTag,r as root}from"./isArray-CcrBs4JM.js";import{_ as __rest}from"./tslib.es6-CxX45GIN.js";import{h,F as Fragment}from"./index-N6JGlBHl.js";import{B as BaseWebComponent}from"./variant-quote-y0Z1TRdz.js";import{T as TooltipFC}from"./component-vV-KhMHx.js";import{T as TooltipController}from"./controller-Bdve6A-Q.js";import{S as SpanFC,b as buildBadgeTextString,s as showExpertSlot}from"./component-DwmUGvyq.js";import{c as clsx}from"./clsx-COFh-Vc8.js";import{a as createRelatedUniqueId}from"./dev.utils-DhW8_Z_C.js";import{t as translate}from"./i18n-Br16IAnY.js";import{K as KolAlertFc}from"./Alert-CBfalBKc.js";var symbolTag="[object Symbol]";function isSymbol(e){return"symbol"==typeof e||isObjectLike(e)&&baseGetTag(e)==symbolTag}var reWhitespace=/\s/;function trimmedEndIndex(e){for(var t=e.length;t--&&reWhitespace.test(e.charAt(t)););return t}var reTrimStart=/^\s+/;function baseTrim(e){return e?e.slice(0,trimmedEndIndex(e)+1).replace(reTrimStart,""):e}var NAN=NaN,reIsBadHex=/^[-+]0x[0-9a-f]+$/i,reIsBinary=/^0b[01]+$/i,reIsOctal=/^0o[0-7]+$/i,freeParseInt=parseInt;function toNumber(e){if("number"==typeof e)return e;if(isSymbol(e))return NAN;if(isObject(e)){var t="function"==typeof e.valueOf?e.valueOf():e;e=isObject(t)?t+"":t}if("string"!=typeof e)return 0===e?e:+e;e=baseTrim(e);var o=reIsBinary.test(e);return o||reIsOctal.test(e)?freeParseInt(e.slice(2),o?2:8):reIsBadHex.test(e)?NAN:+e}var now=function(){return root.Date.now()},FUNC_ERROR_TEXT="Expected a function",nativeMax=Math.max,nativeMin=Math.min;function debounce(e,t,o){var n,i,a,r,s,l,d=0,c=!1,h=!1,u=!0;if("function"!=typeof e)throw new TypeError(FUNC_ERROR_TEXT);function m(t){var o=n,a=i;return n=i=void 0,d=t,r=e.apply(a,o)}function p(e){var o=e-l;return void 0===l||o>=t||o<0||h&&e-d>=a}function g(){var e=now();if(p(e))return v(e);s=setTimeout(g,function(e){var o=t-(e-l);return h?nativeMin(o,a-(e-d)):o}(e))}function v(e){return s=void 0,u&&n?m(e):(n=i=void 0,r)}function f(){var e=now(),o=p(e);if(n=arguments,i=this,l=e,o){if(void 0===s)return function(e){return d=e,s=setTimeout(g,t),c?m(e):r}(l);if(h)return clearTimeout(s),s=setTimeout(g,t),m(l)}return void 0===s&&(s=setTimeout(g,t)),r}return t=toNumber(t)||0,isObject(o)&&(c=!!o.leading,a=(h="maxWait"in o)?nativeMax(toNumber(o.maxWait)||0,t):a,u="trailing"in o?!!o.trailing:u),f.cancel=function(){void 0!==s&&clearTimeout(s),d=0,n=l=i=s=void 0},f.flush=function(){return void 0===s?r:v(now())},f}const validateAdjustHeight=(e,t)=>{watchBoolean(e,"_adjustHeight",t)},validateHideMsg=(e,t,o)=>{watchBoolean(e,"_hideMsg",t,o)},validateHint=(e,t)=>{watchString(e,"_hint",t)},validateMsg=(e,t)=>{objectObjectHandler(t,()=>{try{t=parseJson(t)}catch(e){}watchValidator(e,"_msg",e=>{if(void 0===e)return!0;if("string"==typeof e&&e.length>0)return!0;if(isObject$1(e)&&null!==e){const t=e._description;return isString(t,1)}return!1},new Set(["MsgPropType","string"]),t)})};function isMsgDefinedAndInputTouched(e,t){return Boolean(e)&&!0===t}function normalizeMsg(e){if("string"==typeof e)try{return parseJson(e)}catch(t){return{_description:e,_type:"error"}}return e&&"object"==typeof e&&!("_type"in e)?Object.assign(Object.assign({},e),{_type:"error"}):e}function getMsgType(e){var t;return"string"==typeof e?"error":null!==(t=null==e?void 0:e._type)&&void 0!==t?t:"error"}const validateTouched=(e,t)=>{watchBoolean(e,"_touched",t)};class ControlledInputController extends AssociatedInputController{constructor(e,t,o){super(e,t,o),this.component=e}validateTouched(e){validateTouched(this.component,e)}componentWillLoad(){super.componentWillLoad(),this.validateTouched(this.component._touched)}}class InputController extends ControlledInputController{constructor(e,t,o){super(e,t,o),this.valueChangeListeners=[],this.onFacade={onBlur:this.onBlur.bind(this),onChange:this.onChange.bind(this),onClick:this.onClick.bind(this),onFocus:this.onFocus.bind(this),onInput:this.onInput.bind(this),onKeyDown:this.onKeyDown.bind(this)},this.updateCurrentLengthDebounced=debounce(e=>{setState(this.component,"_currentLengthDebounced",e)},500),this.component=e}validateAccessKey(e){validateAccessKey(this.component,e),validateAccessAndShortKey(e,this.component._shortKey)}validateAdjustHeight(e){validateAdjustHeight(this.component,e)}validateDisabled(e){validateDisabled(this.component,e)}validateTooltipAlign(e){validateTooltipAlign(this.component,e)}validateHideMsg(e){validateHideMsg(this.component,e,{hooks:{afterPatch:()=>{this.component.state._hideMsg&&a11yHint("Property _hideMsg for inputs: Only use when the error message is shown outside of the input component.")}}})}validateHideLabel(e){validateHideLabel(this.component,e,{hooks:{afterPatch:()=>{this.component.state._hideLabel&&a11yHint("Property hide-label for inputs: Only use for exceptions like search inputs that are clearly identifiable by their context.")}}})}validateHint(e){validateHint(this.component,e)}validateLabel(e){validateLabelWithExpertSlot(this.component,e,{required:!0})}validateMsg(e){validateMsg(this.component,e)}validateOn(e){"object"==typeof e&&setState(this.component,"_on",e)}validateShortKey(e){validateShortKey(this.component,e),validateAccessAndShortKey(this.component._accessKey,e)}validateSmartButton(e){objectObjectHandler(e,()=>{try{e=parseJson(e)}catch(e){}setState(this.component,"_smartButton",e)})}validateTabIndex(e){validateTabIndex(this.component,e)}validateVariant(e){validateVariantClassName(this.component,e)}componentWillLoad(){super.componentWillLoad(),this.validateAccessKey(this.component._accessKey),this.validateAdjustHeight(this.component._adjustHeight),this.validateMsg(this.component._msg),this.validateDisabled(this.component._disabled),this.validateHideMsg(this.component._hideMsg),this.validateHideLabel(this.component._hideLabel),this.validateHint(this.component._hint),this.validateLabel(this.component._label),this.validateShortKey(this.component._shortKey),this.validateSmartButton(this.component._smartButton),this.validateOn(this.component._on),this.validateTabIndex(this.component._tabIndex),this.validateVariant(this.component._variant),validateAccessAndShortKey(this.component._accessKey,this.component._shortKey)}emitEvent(e,t){this.host&&dispatchDomEvent(this.host,e,t)}onBlur(e){var t;this.component._disabled||(this.component._touched=!0,this.emitEvent(KolEvent.blur),"function"==typeof(null===(t=this.component._on)||void 0===t?void 0:t.onBlur)&&this.component._on.onBlur(e))}onChange(e,t){var o;void 0===t&&(t=e.target.value),this.emitEvent(KolEvent.change,t),"function"==typeof(null===(o=this.component._on)||void 0===o?void 0:o.onChange)&&this.component._on.onChange(e,t),this.valueChangeListeners.forEach(e=>e(t))}onInput(e,t=!0,o){var n;void 0===o&&(o=e.target.value),this.emitEvent(KolEvent.input,o),t&&this.setFormAssociatedValue(o),"function"==typeof(null===(n=this.component._on)||void 0===n?void 0:n.onInput)&&this.component._on.onInput(e,o)}onClick(e){var t;this.emitEvent(KolEvent.click),"function"==typeof(null===(t=this.component._on)||void 0===t?void 0:t.onClick)&&this.component._on.onClick(e)}onFocus(e){var t;this.emitEvent(KolEvent.focus),"function"==typeof(null===(t=this.component._on)||void 0===t?void 0:t.onFocus)&&this.component._on.onFocus(e)}onKeyDown(e){var t;this.emitEvent(KolEvent.keydown),"function"==typeof(null===(t=this.component._on)||void 0===t?void 0:t.onKeyDown)&&this.component._on.onKeyDown(e)}addValueChangeListener(e){this.valueChangeListeners.push(e)}hasSoftCharacterLimit(){return"number"==typeof this.component.state._maxLength&&"soft"===this.component.state._maxLengthBehavior}hasCounter(){return!0===this.component.state._hasCounter}}function getDefaultProps({ariaDescribedBy:e,hideLabel:t,label:o}){return{title:"",autoCapitalize:"off",autoCorrect:"off","aria-describedby":(null==e?void 0:e.length)?e.join(" "):void 0,"aria-label":t&&o?o:void 0}}const getRenderStates=e=>{const t=e._msg,o="string"==typeof t?t:null==t?void 0:t._description,n=getMsgType(t),i=Boolean(o&&o.length>0),a="error"===n&&i&&!0===e._touched,r="string"==typeof e._hint&&e._hint.length>0,s=[];return i&&!e._hideMsg&&s.push(createRelatedUniqueId(e._id,"msg")),!0===r&&s.push(createRelatedUniqueId(e._id,"hint")),e._hasCounter&&s.push(createRelatedUniqueId(e._id,"counter")),!0===a&&s.push(createRelatedUniqueId(e._id,"error")),{hasError:a,hasHint:r,ariaDescribedBy:s}},KolFormFieldHintFc=e=>{var{id:t,class:o,hint:n,baseClassName:i="kol-form-field"}=e,a=__rest(e,["id","class","hint","baseClassName"]);return n?h("span",Object.assign({class:clsx(`${i}__hint`,o),id:createRelatedUniqueId(t||"","hint")},a),n):null},KolFormFieldLabelFc=e=>{var{component:t="label",id:o,baseClassName:n="kol-form-field",class:i,accessKey:a,shortKey:r,label:s,hideLabel:l,hasExpertSlot:d,showBadge:c=!0,readOnly:u}=e,m=__rest(e,["component","id","baseClassName","class","accessKey","shortKey","label","hideLabel","hasExpertSlot","showBadge","readOnly"]);const p=!d&&l,g=translate("kol-readonly"),v=!1===c?void 0:buildBadgeTextString(a,r);return h(t,Object.assign({},m,{class:clsx(`${n}__label`,i),id:p?void 0:createRelatedUniqueId(o,"label"),hidden:p,htmlFor:o}),h(SpanFC,{class:`${n}__label-text`,label:d?"":null!=s?s:"",badgeText:v},h("slot",{name:"expert"})),u?h("span",{class:`${n}__label__read-only`,"aria-hidden":"true"},"(",g,")"):null)},KolFormFieldCharacterLimitHintFc=({id:e,maxLength:t})=>h("span",{id:createRelatedUniqueId(e,"character-limit-hint"),class:"visually-hidden"},translate("kol-character-limit-hint",{placeholders:{limit:String(t)}})),KolFormFieldCounterFc=({currentLength:e,currentLengthDebounced:t,maxLength:o,maxLengthBehavior:n,id:i})=>{let a,r;const s=["kol-form-field__counter"];if("hard"===n)a="number"==typeof o?translate("kol-character-counter-current-of-max",{placeholders:{current:String(e),max:String(o)}}):translate("kol-character-counter-current",{placeholders:{current:String(e)}}),r="number"==typeof o?translate("kol-character-counter-current-of-max-aria",{placeholders:{current:String(t),max:String(o)}}):translate("kol-character-counter-current",{placeholders:{current:String(t)}});else{if("number"!=typeof o)return null;{const n=o-e,i=n<0,l=o-t,d=l<0;a=i?translate("kol-character-limit-exceeded",{placeholders:{over:String(Math.abs(n))}}):translate("kol-character-limit-remaining",{placeholders:{remaining:String(n)}}),r=d?translate("kol-character-limit-exceeded",{placeholders:{over:String(Math.abs(l))}}):translate("kol-character-limit-remaining",{placeholders:{remaining:String(l)}}),i&&s.push("kol-form-field__counter--exceeded")}}return h(Fragment,null,h("span",{class:clsx(s),"aria-hidden":"true","data-testid":"input-counter"},a),h("span",{id:createRelatedUniqueId(i||"","counter"),"aria-live":"polite",class:"visually-hidden","data-testid":"input-counter-aria"},r))},FormFieldMsgFc=e=>{var t,o,{alert:n,msg:i,id:a,class:r}=e,s=__rest(e,["alert","msg","id","class"]);const l=normalizeMsg(i);return h(KolAlertFc,Object.assign({id:createRelatedUniqueId(a,"msg"),alert:null!==(t=null==l?void 0:l._alert)&&void 0!==t?t:n,hasCloser:!1,level:0,type:null!==(o=null==l?void 0:l._type)&&void 0!==o?o:"error",variant:"msg",class:clsx("kol-form-field__msg",r)},s),(null==l?void 0:l._description)||void 0)},formFieldTooltipControllerById=new Map,getFormFieldTooltipController=e=>{const t=formFieldTooltipControllerById.get(e);if(t)return t;const o=new TooltipController(BaseWebComponent.stateLess);return o.componentWillLoad({label:""}),formFieldTooltipControllerById.set(e,o),o},destroyFormFieldTooltipController=e=>{const t=formFieldTooltipControllerById.get(e);t&&(t.destroy(),formFieldTooltipControllerById.delete(e))};function getModifierClassNameByMsgType(e){return(null==e?void 0:e.type)&&{default:"msg-type-default",info:"msg-type-info",success:"msg-type-success",warning:"msg-type-warning",error:"msg-type-error"}[null==e?void 0:e.type]||""}const InputContainer=(e,t)=>{var{class:o}=e,n=__rest(e,["class"]);return h("div",Object.assign({class:clsx("kol-form-field__input",o)},n),t)},KolFormFieldFc=(e,t)=>{const{component:o="div",renderNoLabel:n,renderNoTooltip:i,renderNoHint:a,anotherChildren:r,id:s,required:l,alert:d,disabled:c,class:u,msg:m,hideMsg:p,hideLabel:g,label:v,hint:f,accessKey:b,shortKey:y,counter:_,readOnly:F,touched:C,maxLength:x,ariaDescribedBy:K,showBadge:L,tooltipAlign:B,tooltipFloatingRef:T,variant:j,formFieldLabelProps:I,formFieldHintProps:S,formFieldTooltipProps:M,formFieldMsgProps:O,formFieldInputProps:w}=e,k=__rest(e,["component","renderNoLabel","renderNoTooltip","renderNoHint","anotherChildren","id","required","alert","disabled","class","msg","hideMsg","hideLabel","label","hint","accessKey","shortKey","counter","readOnly","touched","maxLength","ariaDescribedBy","showBadge","tooltipAlign","tooltipFloatingRef","variant","formFieldLabelProps","formFieldHintProps","formFieldTooltipProps","formFieldMsgProps","formFieldInputProps"]),A=!n,H=!a,D=!i,E=showExpertSlot(v),N=isMsgDefinedAndInputTouched(m,C),R=buildBadgeTextString(b,y),P=D&&!E&&g,q=createRelatedUniqueId(s,"label"),W=P?getFormFieldTooltipController(s):void 0;W?(W.watchAlign(B),W.watchBadgeText(R||""),W.watchId(q),W.watchLabel(v)):destroyFormFieldTooltipController(s);const U=null==w?void 0:w.ref;let V={"kol-form-field--disabled":Boolean(c),"kol-form-field--required":Boolean(l),"kol-form-field--touched":Boolean(C),"kol-form-field--hide-label":Boolean(g),"kol-form-field--read-only":Boolean(F),"kol-form-field--hidden-msg":Boolean(p)};if(j&&(V=Object.assign(Object.assign({},V),{[`kol-form-field--${j}`]:!0})),N){const e=getMsgType(m);V=Object.assign(Object.assign({},V),{[`kol-form-field--${e}`]:!0,[`kol-form-field--${getModifierClassNameByMsgType({type:e})}`]:!0})}return h(o,Object.assign({class:clsx("kol-form-field",V,u),"aria-describedby":K},k),A&&h(KolFormFieldLabelFc,Object.assign({},I||{},{id:s,hasExpertSlot:E,hideLabel:g,label:v,accessKey:b,shortKey:y,readOnly:F,showBadge:L})),h(InputContainer,Object.assign({},w,{ref:e=>{null==U||U(e),W&&e&&(W.initContext(e),W.syncListeners(void 0,e,!0))}}),t,P&&!0===g&&h("div",{class:clsx("kol-form-field__tooltip",null==M?void 0:M.class)},h(TooltipFC,{badgeText:R||"",label:v,align:B,id:q,refFloating:null!=T?T:e=>{null==W||W.setTooltipElementRef(e)}}))),_?h(KolFormFieldCounterFc,Object.assign({id:s},_)):null,x?h(KolFormFieldCharacterLimitHintFc,{id:s,maxLength:x}):null,N&&!p&&h(FormFieldMsgFc,Object.assign({},O||{},{id:s,alert:d,msg:m})),H&&h(KolFormFieldHintFc,Object.assign({},S||{},{id:s,hint:f})),r)};function getFormFieldProps(e){const t={id:e._id,disabled:e._disabled,msg:e._msg,hint:e._hint,label:e._label,hideLabel:e._hideLabel,hideMsg:e._hideMsg,touched:e._touched,showBadge:"_accessKey"in e&&Boolean(e._accessKey)||"_shortKey"in e&&Boolean(e._shortKey)};return"_required"in e&&(t.required=e._required),"_readOnly"in e&&(t.readOnly=e._readOnly),"_accessKey"in e&&(t.accessKey=e._accessKey),"_shortKey"in e&&(t.shortKey=e._shortKey),"_maxLength"in e&&(t.maxLength=e._maxLength),"_currentLength"in e&&"number"==typeof e._currentLength&&"_currentLengthDebounced"in e&&"number"==typeof e._currentLengthDebounced&&"_hasCounter"in e&&!0===e._hasCounter&&(t.counter={currentLength:e._currentLength,currentLengthDebounced:e._currentLengthDebounced,maxLength:e._maxLength,maxLengthBehavior:e._maxLengthBehavior||"hard"}),"_variant"in e&&(t.variant=e._variant),t}const FormFieldStateWrapper=(e,t)=>{var{state:o}=e,n=__rest(e,["state"]);const{ariaDescribedBy:i}=getRenderStates(o),a=("fieldset"===n.component||"_options"in o&&"_orientation"in o)&&i.length>0?i.join(" "):void 0,r=getFormFieldProps(o);return h(KolFormFieldFc,Object.assign({},r,n,{ariaDescribedBy:a}),t)};export{FormFieldStateWrapper as F,InputController as I,KolFormFieldLabelFc as K,getRenderStates as a,KolFormFieldHintFc as b,getDefaultProps as c,getMsgType as g,isMsgDefinedAndInputTouched as i};