@public-ui/sample-react 4.0.0-alpha.9 → 4.0.0-beta.1

package/src/components/textarea/partials/cases.tsx

@@ -11,9 +11,10 @@ export const TextareaCases = forwardRef<HTMLKolTextareaElement, Components.KolTe
 				<KolTextarea {...props} ref={ref} _placeholder="Placeholder" _label="Text" />
 			</div>
 			<KolTextarea {...props} _placeholder="Placeholder" _required _msg={{ _type: 'error', _description: ERROR_MSG }} _label="Text" _touched _hint={HINT_MSG} />
-			<KolTextarea {...props} _placeholder="Placeholder" _label="Text" _msg={{ _type: 'info', _description: 'Just a hint' }} />
-			<KolTextarea {...props} _placeholder="Placeholder" _label="Text" _msg={{ _type: 'warning', _description: 'Small warning' }} />
-			<KolTextarea {...props} _placeholder="Placeholder" _label="Text" _msg={{ _type: 'success', _description: 'Success message' }} />
+			<KolTextarea {...props} _placeholder="Placeholder" _label="Text" _msg={{ _type: 'info', _description: 'Just a hint' }} _touched />
+			<KolTextarea {...props} _placeholder="Placeholder" _label="Text" _msg={{ _type: 'warning', _description: 'Small warning' }} _touched />
+			<KolTextarea {...props} _placeholder="Placeholder" _label="Text" _msg={{ _type: 'success', _description: 'Success message' }} _touched />
+			<KolTextarea {...props} _placeholder="Placeholder" _label="Text" _msg={{ _type: 'default', _description: 'Default message' }} _touched />
 			<KolTextarea {...props} ref={ref} _accessKey="T" _label="Text (3 rows)" _rows={3} />
 			<KolTextarea {...props} ref={ref} _label="Text (placeholder)" _rows={3} _placeholder="Placeholder" />
 			<KolTextarea {...props} ref={ref} _label="Text (disabled & placeholder)" _rows={3} _placeholder="Placeholder" _disabled />

package/src/components/toast/basic.tsx

@@ -3,13 +3,16 @@ import { useSearchParams } from 'react-router-dom';
 
 import type { AlertTypePropType } from '@public-ui/components';
 import { ToasterService } from '@public-ui/components';
-import { KolButton } from '@public-ui/react-v19';
+import { KolAlert, KolButton, KolLink } from '@public-ui/react-v19';
 
 import { getRoot } from '../../shares/react-roots';
 import { SampleDescription } from '../SampleDescription';
 
 import type { FC } from 'react';
 
+/**
+ * @deprecated For more information, please refer to the documentation.
+ */
 export const ToastBasic: FC = () => {
 	const [searchParams] = useSearchParams();
 	const defaultType = searchParams.get('type') as AlertTypePropType;
@@ -75,9 +78,15 @@ export const ToastBasic: FC = () => {
 
 	return (
 		<>
+			<KolAlert _label="Component is DEPRECATED" _type="error" _variant="card" className="header-alert">
+				For more information, please refer&nbsp;
+				<KolLink _href="https://public-ui.github.io/en/docs/components/toaster" _target="_blank" _label="to the documentation" />.
+			</KolAlert>
+
 			<SampleDescription>
 				<p>This sample demonstrates the toast service with all its options.</p>
 			</SampleDescription>
+
 			<section className="grid gap-4">
 				<div className="flex flex-wrap gap-2">
 					<KolButton _label="Show simple toast" _on={{ onClick: handleButtonClickSimple }}></KolButton>

package/src/components/toast/configurator.tsx

@@ -3,7 +3,7 @@ import { useSearchParams } from 'react-router-dom';
 
 import type { AlertTypePropType } from '@public-ui/components';
 import { ToasterService } from '@public-ui/components';
-import { KolButton, KolInputRadio } from '@public-ui/react-v19';
+import { KolAlert, KolButton, KolInputRadio, KolLink } from '@public-ui/react-v19';
 
 import { SampleDescription } from '../SampleDescription';
 
@@ -19,6 +19,9 @@ const isAlertType = (value: unknown): value is AlertTypePropType => {
 	return typeof value === 'string' && toastTypes.includes(value as AlertTypePropType);
 };
 
+/**
+ * @deprecated For more information, please refer to the documentation.
+ */
 export const ToastConfigurator: FC = () => {
 	const [searchParams] = useSearchParams();
 	const queryType = searchParams.get('type');
@@ -66,6 +69,10 @@ export const ToastConfigurator: FC = () => {
 
 	return (
 		<>
+			<KolAlert _label="Component is DEPRECATED" _type="error" _variant="card" className="header-alert">
+				For more information, please refer&nbsp;
+				<KolLink _href="https://public-ui.github.io/en/docs/components/toaster" _target="_blank" _label="to the documentation"></KolLink>.
+			</KolAlert>
 			<SampleDescription>
 				<p>
 					This sample demonstrates the toast service with all its options. Use the configuration below to choose a toast type and open a toast with the card

package/src/components/toolbar/basic.tsx

@@ -12,7 +12,7 @@ export const ToolbarBasic: FC = () => {
 			_hideLabel: true,
 			_icons: {
 				left: {
-					icon: 'codicon codicon-arrow-left',
+					icon: 'kolicon-chevron-left',
 				},
 			},
 		},
@@ -22,7 +22,7 @@ export const ToolbarBasic: FC = () => {
 			_hideLabel: true,
 			_icons: {
 				right: {
-					icon: 'codicon codicon-arrow-right',
+					icon: 'kolicon-chevron-right',
 				},
 			},
 		},

package/src/components/toolbar/disabled.tsx

@@ -21,7 +21,7 @@ export const ToolbarDisabled: FC = () => {
 						_hideLabel: true,
 						_icons: {
 							left: {
-								icon: 'codicon codicon-arrow-left',
+								icon: 'kolicon-chevron-left',
 							},
 						},
 					},
@@ -31,7 +31,7 @@ export const ToolbarDisabled: FC = () => {
 						_hideLabel: true,
 						_icons: {
 							right: {
-								icon: 'codicon codicon-arrow-right',
+								icon: 'kolicon-chevron-right',
 							},
 						},
 					},

package/src/scenarios/button-shortkey-table.tsx

@@ -30,11 +30,11 @@ const RowActions: FC<{ label: string }> = ({ label }) => {
 	const handleKeyUp = (event: React.KeyboardEvent<HTMLDivElement>) => {
 		switch (event.code) {
 			case 'KeyE':
-				void editButtonRef.current?.kolFocus();
+				void editButtonRef.current?.focus();
 				handleEditClick();
 				return;
 			case 'KeyD':
-				void deleteButtonRef.current?.kolFocus();
+				void deleteButtonRef.current?.focus();
 				handleDeleteClick();
 				return;
 		}
@@ -88,7 +88,12 @@ export const ButtonShortkeyTable: FC = () => {
 					textAlign: 'left',
 
 					render: (el, cell) => {
-						getRoot(createReactRenderElement(el)).render(<RowActions label={(cell.data as Data).label} />);
+						const data = cell.data as Data | undefined;
+						if (!data?.label) {
+							return;
+						}
+
+						getRoot(createReactRenderElement(el)).render(<RowActions label={data.label} />);
 					},
 				},
 			],

package/src/scenarios/custom-tooltip-css-properties.tsx

@@ -26,16 +26,10 @@ export const CustomTooltipCssProperties: FC = () => {
 					_label="Custom duration"
 					_hideLabel
 					style={{ '--kolibri-tooltip-animation-duration': '2500ms' }}
-					_icons="codicon codicon-clock"
-					_on={dummyEventHandler}
-				></KolButton>
-				<KolButton
-					_label="Custom width"
-					_hideLabel
-					style={{ '--kol-tooltip-width': '400px' }}
-					_icons="codicon codicon-arrow-both"
+					_icons="fa-solid fa-clock"
 					_on={dummyEventHandler}
 				></KolButton>
+				<KolButton _label="Custom width" _hideLabel style={{ '--kol-tooltip-width': '400px' }} _icons="kolicon-chevron-up" _on={dummyEventHandler}></KolButton>
 			</div>
 		</>
 	);

package/src/scenarios/disabled-interactive-elements.tsx

@@ -63,32 +63,32 @@ export const DisabledInteractiveElements: FC = () => {
 					<div className="flex flex-wrap gap-4">
 						<KolButton _label="Label" _on={dummyEventHandler} />
 						<KolButton _disabled _label="Label" _on={dummyEventHandler} />
-						<KolButton _hideLabel _icons="codicon codicon-home" _label="Label" _on={dummyEventHandler} />
-						<KolButton _disabled _hideLabel _icons="codicon codicon-home" _label="Label" _on={dummyEventHandler} />
+						<KolButton _hideLabel _icons="fa-solid fa-house" _label="Label" _on={dummyEventHandler} />
+						<KolButton _disabled _hideLabel _icons="fa-solid fa-house" _label="Label" _on={dummyEventHandler} />
 					</div>
 				</KolCard>
 				<KolCard _label="ButtonLink" _level={0}>
 					<div className="flex flex-wrap gap-4">
 						<KolButtonLink _label="Label" />
 						<KolButtonLink _disabled _label="Label" />
-						<KolButtonLink _hideLabel _icons="codicon codicon-home" _label="Label" />
-						<KolButtonLink _hideLabel _icons="codicon codicon-home" _disabled _label="Label" />
+						<KolButtonLink _hideLabel _icons="fa-solid fa-house" _label="Label" />
+						<KolButtonLink _hideLabel _icons="fa-solid fa-house" _disabled _label="Label" />
 					</div>
 				</KolCard>
 				<KolCard _label="Link" _level={0}>
 					<div className="flex flex-wrap gap-4">
 						<KolLink _href="#" _label="Label" />
 						<KolLink _disabled _href="#" _label="Label" />
-						<KolLink _hideLabel _href="#" _icons="codicon codicon-home" _label="Label" />
-						<KolLink _disabled _hideLabel _href="#" _icons="codicon codicon-home" _label="Label" />
+						<KolLink _hideLabel _href="#" _icons="fa-solid fa-house" _label="Label" />
+						<KolLink _disabled _hideLabel _href="#" _icons="fa-solid fa-house" _label="Label" />
 					</div>
 				</KolCard>
 				<KolCard _label="LinkButton" _level={0}>
 					<div className="flex flex-wrap gap-4">
 						<KolLinkButton _href="#" _label="Label" />
 						<KolLinkButton _disabled _href="#" _label="Label" />
-						<KolLinkButton _hideLabel _href="#" _icons="codicon codicon-home" _label="Label" />
-						<KolLinkButton _disabled _hideLabel _href="#" _icons="codicon codicon-home" _label="Label" />
+						<KolLinkButton _hideLabel _href="#" _icons="fa-solid fa-house" _label="Label" />
+						<KolLinkButton _disabled _hideLabel _href="#" _icons="fa-solid fa-house" _label="Label" />
 					</div>
 				</KolCard>
 				<KolCard _label="Accordion" _level={0}>

package/src/scenarios/focus-elements.tsx

@@ -158,7 +158,7 @@ export const FocusElements: FC = () => {
 	useLayoutEffect(() => {
 		setTimeout(() => {
 			// Timeout not strictly necessary but prevents a layout glitch in snapshots with Playwright.
-			void ref.current?.kolFocus();
+			void ref.current?.focus();
 		}, 500);
 	}, [ref]);
 

package/src/scenarios/horizontal-scrollbar-advanced/TableHorizontalScrollbarAdvanced.tsx

@@ -9,21 +9,21 @@ import './layout.scss';
 
 const TABS: TabButtonProps[] = [
 	{
-		_icons: 'codicon codicon-pie-chart',
+		_icons: 'fa-solid fa-chart-pie',
 		_label: 'Erster Tab',
 	},
 	{
-		_icons: 'codicon codicon-calendar',
+		_icons: 'fa-solid fa-calendar',
 		_label: 'Zweiter Tab',
 		_disabled: true,
 	},
 	{
-		_icons: 'codicon codicon-briefcase',
+		_icons: 'fa-solid fa-briefcase',
 		_label: 'Deaktivierter Tab',
 		_disabled: true,
 	},
 	{
-		_icons: 'codicon codicon-telescope',
+		_icons: 'fa-solid fa-address-card',
 		_label: 'Letzter Tab',
 		_disabled: true,
 	},

package/src/scenarios/same-height-of-all-interactive-elements.tsx

@@ -34,28 +34,28 @@ export const SameHeightOfAllInteractiveElements: FC = () => {
 				</p>
 			</SampleDescription>
 			<div className="w-full flex flex-wrap gap-4">
-				<KolButton _icons="codicon codicon-home" _label="Button" _on={dummyEventHandler} />
-				<KolButton _hideLabel _icons="codicon codicon-home" _label="Button" _on={dummyEventHandler} />
-				<KolLinkButton _href="#" _icons="codicon codicon-home" _label="Link-Button" _on={dummyEventHandler} />
-				<KolLinkButton _hideLabel _href="#" _icons="codicon codicon-home" _label="Link-Button" _on={dummyEventHandler} />
-				<KolCombobox _hideLabel _icons="codicon codicon-home" _label="Combobox" _suggestions={[]} />
+				<KolButton _icons="fa-solid fa-house" _label="Button" _on={dummyEventHandler} />
+				<KolButton _hideLabel _icons="fa-solid fa-house" _label="Button" _on={dummyEventHandler} />
+				<KolLinkButton _href="#" _icons="fa-solid fa-house" _label="Link-Button" _on={dummyEventHandler} />
+				<KolLinkButton _hideLabel _href="#" _icons="fa-solid fa-house" _label="Link-Button" _on={dummyEventHandler} />
+				<KolCombobox _hideLabel _icons="fa-solid fa-house" _label="Combobox" _suggestions={[]} />
 				<KolInputColor
 					_hideLabel
 					_icons={{
-						left: 'codicon codicon-home',
+						left: 'fa-solid fa-house',
 					}}
 					_label="Input-Color"
 				/>
-				<KolInputFile _hideLabel _icons="codicon codicon-home" _label="Input-File" />
-				<KolInputDate _hideLabel _icons="codicon codicon-home" _label="Input-Date" />
-				<KolInputEmail _hideLabel _icons="codicon codicon-home" _label="Input-Email" />
-				<KolInputNumber _hideLabel _icons="codicon codicon-home" _label="Input-Number" />
-				<KolInputPassword _hideLabel _icons="codicon codicon-home" _label="Input-Password" />
-				<KolInputRange _hideLabel _icons="codicon codicon-home" _label="Input-Range" />
-				<KolInputText _hideLabel _icons="codicon codicon-home" _label="Input-Text" />
-				<KolSelect _hideLabel _icons="codicon codicon-home" _label="Combobox" _options={[]} />
-				<KolSingleSelect _hideLabel _icons="codicon codicon-home" _label="Combobox" _options={[]} />
-				<KolTextarea _hideLabel _icons="codicon codicon-home" _label="Combobox" />
+				<KolInputFile _hideLabel _icons="fa-solid fa-house" _label="Input-File" />
+				<KolInputDate _hideLabel _icons="fa-solid fa-house" _label="Input-Date" />
+				<KolInputEmail _hideLabel _icons="fa-solid fa-house" _label="Input-Email" />
+				<KolInputNumber _hideLabel _icons="fa-solid fa-house" _label="Input-Number" />
+				<KolInputPassword _hideLabel _icons="fa-solid fa-house" _label="Input-Password" />
+				<KolInputRange _hideLabel _icons="fa-solid fa-house" _label="Input-Range" />
+				<KolInputText _hideLabel _icons="fa-solid fa-house" _label="Input-Text" />
+				<KolSelect _hideLabel _icons="fa-solid fa-house" _label="Combobox" _options={[]} />
+				<KolSingleSelect _hideLabel _icons="fa-solid fa-house" _label="Combobox" _options={[]} />
+				<KolTextarea _hideLabel _icons="fa-solid fa-house" _label="Combobox" />
 			</div>
 		</>
 	);

package/src/scenarios/toolbar-item-order.tsx

@@ -35,7 +35,7 @@ export const ToolbarItemOrder: FC = () => {
 			type: 'button',
 			_label: `Button ${index + 1}`,
 			_on: { onClick: handleSubmit },
-			_icons: isSubmitting ? 'codicon codicon-loading codicon-modifier-spin' : void 0,
+			_icons: isSubmitting ? 'fa-solid fa-spinner fa-spin' : void 0,
 			_disabled: isSubmitting,
 		}));
 		return items;
@@ -47,7 +47,7 @@ export const ToolbarItemOrder: FC = () => {
 			_label: `Button ${index + 1}`,
 			_on: { onClick: handleSubmit2 },
 			_disabled: isSubmitting2,
-			_icons: isSubmitting2 ? 'codicon codicon-loading codicon-modifier-spin' : void 0,
+			_icons: isSubmitting2 ? 'fa-solid fa-spinner fa-spin' : void 0,
 		}));
 		return items;
 	}, [isSubmitting2]);

package/src/scenarios/tooltip-positioning.tsx

@@ -20,7 +20,7 @@ export const TooltipPositioning: FC = () => {
 					contain: 'layout',
 				}}
 			>
-				<KolPopoverButton _label="Sample PopoverButton—Click for Popover" _icons="codicon codicon-info" _tooltipAlign="right" _hideLabel>
+				<KolPopoverButton _label="Sample PopoverButton—Click for Popover" _icons="kolicon-alert-info" _tooltipAlign="right" _hideLabel>
 					This is an explanation shown on click.
 				</KolPopoverButton>
 			</div>

package/src/shares/routes.ts

@@ -9,6 +9,7 @@ import { BUTTON_ROUTES } from '../components/button/routes';
 import { CARD_ROUTES } from '../components/card/routes';
 import { COMBOBOX_ROUTES } from '../components/combobox/routes';
 import { DETAILS_ROUTES } from '../components/details/routes';
+import { DIALOG_ROUTES } from '../components/dialog/routes';
 import { DRAWER_ROUTES } from '../components/drawer/routes';
 import { FORM_ROUTES } from '../components/form/routes';
 import { HANDOUT_ROUTES } from '../components/handout/routes';
@@ -62,6 +63,7 @@ export const ROUTES: Routes = {
 	...CARD_ROUTES,
 	...COMBOBOX_ROUTES,
 	...DETAILS_ROUTES,
+	...DIALOG_ROUTES,
 	...DRAWER_ROUTES,
 	...FORM_ROUTES,
 	...HEADING_ROUTES,
@@ -87,7 +89,6 @@ export const ROUTES: Routes = {
 	...PROGRESS_ROUTES,
 	...QUOTE_ROUTES,
 	...SELECT_ROUTES,
-	...SELECT_ROUTES,
 	...SKIP_NAV_ROUTES,
 	...SPIN_ROUTES,
 	...SINGLE_SELECT_ROUTES,

package/src/style.scss

@@ -60,6 +60,10 @@ hr {
 	list-style: none;
 }
 
+.header-alert {
+	margin-bottom: rem(16);
+}
+
 @media (min-width: 1024px) {
 	.app-container {
 		display: grid;

package/dist/assets/Alert-BVXxAiPu-V0QPNk25.js

@@ -1,2 +0,0 @@
-import{_ as p}from"./tslib.es6-CxX45GIN-BGVaTf34.js";import{N as v,h as a,O as f,e as C,P as L,i as k,Q as E,F as S}from"./index-bkYRA5xm.js";import{c as y}from"./clsx-eK3rPvPS-B-dksMZM.js";import{t as n}from"./i18n-CQxlBXNV-fOD_EHC9.js";import{K as T}from"./Heading-CYFoVwZo-jHyiKRlW.js";const O=n("kol-error"),B=n("kol-info"),M=n("kol-warning"),I=n("kol-success"),K=n("kol-message"),s=({ariaLabel:e,icon:o})=>a(S,null,a("span",{class:"visually-hidden"},e),a(k,{class:E,_label:"",_icons:o})),N=({type:e,label:o})=>{switch(e){case"error":return a(s,{ariaLabel:O,icon:"codicon codicon-error",label:o});case"info":return a(s,{ariaLabel:B,icon:"codicon codicon-info",label:o});case"warning":return a(s,{ariaLabel:M,icon:"codicon codicon-warning",label:o});case"success":return a(s,{ariaLabel:I,icon:"codicon codicon-pass",label:o});default:return a(s,{ariaLabel:K,icon:"codicon codicon-comment",label:o})}},R=n("kol-close-alert"),w=()=>{if(typeof navigator>"u"||typeof navigator.vibrate!="function")return;const e=navigator.userActivation;if((e?.isActive||e?.hasBeenActive)&&matchMedia("(any-pointer: coarse)").matches)try{navigator.vibrate([100,75,100,75,100])}catch{}},D=(e,o)=>{const{class:l={},alert:c=!1,hasCloser:d=!1,label:t,level:u=0,type:_="default",variant:r="msg",onAlertTimeout:i,onCloserClick:m}=e,b=p(e,["class","alert","hasCloser","label","level","type","variant","onAlertTimeout","onCloserClick"]);c&&(w(),setTimeout(()=>{i?.()},1e4));const g=v("kol-alert",{hasCloser:!!d,[`type-${_}`]:!0,[`variant-${r}`]:!0}),h=v("kol-alert","heading",{[`h${u}`]:!0}),A=Object.assign({class:y(l,g)},b);return a("div",Object.assign({role:c?"alert":void 0},A,{"data-testid":"alert"}),a("div",{class:"kol-alert__container"},a(N,{label:t,type:_}),a("div",{class:"kol-alert__container-content"},t&&a(T,{class:h,level:u,id:"heading"},t),r==="msg"&&a("span",{class:f,"aria-describedby":t?"heading":void 0},o)),d&&a(C,{class:L,"data-testid":"alert-close-button",_ariaDescription:t?.trim()||"",_hideLabel:!0,_icons:{left:{icon:"codicon codicon-close"}},_label:R,_on:{onClick:m},_tooltipAlign:"left"})),r==="card"&&a("div",{class:f,"aria-describedby":t?"heading":void 0},o))};export{D as K};
-//# sourceMappingURL=Alert-BVXxAiPu-V0QPNk25.js.map

package/dist/assets/Alert-BVXxAiPu-V0QPNk25.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Alert-BVXxAiPu-V0QPNk25.js","sources":["../../../../components/dist/esm/Alert-BVXxAiPu.js"],"sourcesContent":["/*!\n * KoliBri - The accessible HTML-Standard\n */\nimport { _ as __rest } from './tslib.es6-CxX45GIN.js';\nimport { h, F as Fragment } from './index-iB2O5Z2w.js';\nimport { c as clsx } from './clsx-eK3rPvPS.js';\nimport { e as KolIconTag, d as KolButtonWcTag } from './component-names-CkE54Ym7.js';\nimport { t as translate } from './i18n-CQxlBXNV.js';\nimport { a as BEM_CLASS_ALERT__ICON, b as bem, c as BEM_CLASS_ALERT__CONTENT, d as BEM_CLASS_ALERT__CLOSER } from './bem-CIn1qsbp.js';\nimport { K as KolHeadingFc } from './Heading-CYFoVwZo.js';\n\nconst translateError = translate('kol-error');\nconst translateInfo = translate('kol-info');\nconst translateWarning = translate('kol-warning');\nconst translateSuccess = translate('kol-success');\nconst translateMessage = translate('kol-message');\nconst Icon = ({ ariaLabel, icon }) => {\n    return (h(Fragment, null, h(\"span\", { class: \"visually-hidden\" }, ariaLabel), h(KolIconTag, { class: BEM_CLASS_ALERT__ICON, _label: \"\", _icons: icon })));\n};\nconst AlertIcon = ({ type, label }) => {\n    switch (type) {\n        case 'error':\n            return h(Icon, { ariaLabel: translateError, icon: \"codicon codicon-error\", label: label });\n        case 'info':\n            return h(Icon, { ariaLabel: translateInfo, icon: \"codicon codicon-info\", label: label });\n        case 'warning':\n            return h(Icon, { ariaLabel: translateWarning, icon: \"codicon codicon-warning\", label: label });\n        case 'success':\n            return h(Icon, { ariaLabel: translateSuccess, icon: \"codicon codicon-pass\", label: label });\n        default:\n            return h(Icon, { ariaLabel: translateMessage, icon: \"codicon codicon-comment\", label: label });\n    }\n};\n\nconst translateCloseAlert = translate('kol-close-alert');\nconst vibrateOnError = () => {\n    if (typeof navigator === 'undefined' || typeof navigator.vibrate !== 'function') {\n        return;\n    }\n    const ua = navigator.userActivation;\n    const hasGesture = (ua === null || ua === void 0 ? void 0 : ua.isActive) || (ua === null || ua === void 0 ? void 0 : ua.hasBeenActive);\n    if (!hasGesture) {\n        return;\n    }\n    if (!matchMedia('(any-pointer: coarse)').matches) {\n        return;\n    }\n    try {\n        navigator.vibrate([100, 75, 100, 75, 100]);\n    }\n    catch (_a) {\n    }\n};\nconst KolAlertFc = (props, children) => {\n    const { class: classNames = {}, alert = false, hasCloser = false, label, level = 0, type = 'default', variant = 'msg', onAlertTimeout, onCloserClick } = props, other = __rest(props, [\"class\", \"alert\", \"hasCloser\", \"label\", \"level\", \"type\", \"variant\", \"onAlertTimeout\", \"onCloserClick\"]);\n    if (alert) {\n        vibrateOnError();\n        setTimeout(() => {\n            onAlertTimeout === null || onAlertTimeout === void 0 ? void 0 : onAlertTimeout();\n        }, 10000);\n    }\n    const BEM_CLASS_ROOT = bem('kol-alert', {\n        hasCloser: !!hasCloser,\n        [`type-${type}`]: true,\n        [`variant-${variant}`]: true,\n    });\n    const BEM_CLASS__HEADING = bem('kol-alert', 'heading', {\n        [`h${level}`]: true,\n    });\n    const rootProps = Object.assign({ class: clsx(classNames, BEM_CLASS_ROOT) }, other);\n    return (h(\"div\", Object.assign({ role: alert ? 'alert' : undefined }, rootProps, { \"data-testid\": \"alert\" }), h(\"div\", { class: \"kol-alert__container\" }, h(AlertIcon, { label: label, type: type }), h(\"div\", { class: \"kol-alert__container-content\" }, label && (h(KolHeadingFc, { class: BEM_CLASS__HEADING, level: level, id: \"heading\" }, label)), variant === 'msg' && (h(\"span\", { class: BEM_CLASS_ALERT__CONTENT, \"aria-describedby\": label ? 'heading' : undefined }, children))), hasCloser && (h(KolButtonWcTag, { class: BEM_CLASS_ALERT__CLOSER, \"data-testid\": \"alert-close-button\", _ariaDescription: (label === null || label === void 0 ? void 0 : label.trim()) || '', _hideLabel: true, _icons: {\n            left: {\n                icon: 'codicon codicon-close',\n            },\n        }, _label: translateCloseAlert, _on: { onClick: onCloserClick }, _tooltipAlign: \"left\" }))), variant === 'card' && (h(\"div\", { class: BEM_CLASS_ALERT__CONTENT, \"aria-describedby\": label ? 'heading' : undefined }, children))));\n};\n\nexport { KolAlertFc as K };\n//# sourceMappingURL=Alert-BVXxAiPu.js.map\n\n//# sourceMappingURL=Alert-BVXxAiPu.js.map"],"names":["translateError","translate","translateInfo","translateWarning","translateSuccess","translateMessage","Icon","ariaLabel","icon","h","Fragment","KolIconTag","BEM_CLASS_ALERT__ICON","AlertIcon","type","label","translateCloseAlert","vibrateOnError","ua","KolAlertFc","props","children","classNames","alert","hasCloser","level","variant","onAlertTimeout","onCloserClick","other","__rest","BEM_CLASS_ROOT","bem","BEM_CLASS__HEADING","rootProps","clsx","KolHeadingFc","BEM_CLASS_ALERT__CONTENT","KolButtonWcTag","BEM_CLASS_ALERT__CLOSER"],"mappings":"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"}

package/dist/assets/Collapsible-DeF6ptXV-DL4699z6.js

@@ -1,2 +0,0 @@
-import{_ as m}from"./tslib.es6-CxX45GIN-BGVaTf34.js";import{h as s,e as f}from"./index-bkYRA5xm.js";import{c as a}from"./clsx-eK3rPvPS-B-dksMZM.js";import{K as g}from"./Heading-CYFoVwZo-jHyiKRlW.js";const K=(d,r)=>{const{id:n,class:t,label:p,level:v=1,disabled:c,open:e,onClick:_,HeadingProps:i={},HeadingButtonProps:l={},ContentProps:o={}}=d,b=m(d,["id","class","label","level","disabled","open","onClick","HeadingProps","HeadingButtonProps","ContentProps"]),u=e?"remove":"add";return s("div",Object.assign({id:n,class:a("collapsible",{"collapsible--disabled":c===!0,"collapsible--open":e===!0},t)},b),s(g,{ref:i?.ref,level:v,class:a("collapsible__heading",i?.class)},s(f,{class:a("collapsible__heading-button",l?.class),ref:l?.ref,slot:"expert",_ariaControls:`${n}-control`,_ariaExpanded:e,_disabled:c,_icons:l?._icons||`codicon codicon-${u}`,_label:p,_on:{onClick:_}})),s("div",{class:a("collapsible__wrapper",o?.wrapperClass)},s("div",{class:a("collapsible__wrapper-animation",o?.animationClass)},s("div",{"aria-hidden":e===!1?"true":void 0,class:a("collapsible__content",o?.class),id:`${n}-control`},r))))};export{K};
-//# sourceMappingURL=Collapsible-DeF6ptXV-DL4699z6.js.map

package/dist/assets/Collapsible-DeF6ptXV-DL4699z6.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Collapsible-DeF6ptXV-DL4699z6.js","sources":["../../../../components/dist/esm/Collapsible-DeF6ptXV.js"],"sourcesContent":["/*!\n * KoliBri - The accessible HTML-Standard\n */\nimport { _ as __rest } from './tslib.es6-CxX45GIN.js';\nimport { h } from './index-iB2O5Z2w.js';\nimport { c as clsx } from './clsx-eK3rPvPS.js';\nimport { d as KolButtonWcTag } from './component-names-CkE54Ym7.js';\nimport { K as KolHeadingFc } from './Heading-CYFoVwZo.js';\n\nconst KolCollapsibleFc = (props, children) => {\n    const { id, class: classNames, label, level = 1, disabled, open, onClick, HeadingProps = {}, HeadingButtonProps = {}, ContentProps = {} } = props, other = __rest(props, [\"id\", \"class\", \"label\", \"level\", \"disabled\", \"open\", \"onClick\", \"HeadingProps\", \"HeadingButtonProps\", \"ContentProps\"]);\n    const icon = open ? 'remove' : 'add';\n    return (h(\"div\", Object.assign({ id: id, class: clsx('collapsible', {\n            'collapsible--disabled': disabled === true,\n            'collapsible--open': open === true,\n        }, classNames) }, other), h(KolHeadingFc, { ref: HeadingProps === null || HeadingProps === void 0 ? void 0 : HeadingProps.ref, level: level, class: clsx('collapsible__heading', HeadingProps === null || HeadingProps === void 0 ? void 0 : HeadingProps.class) }, h(KolButtonWcTag, { class: clsx('collapsible__heading-button', HeadingButtonProps === null || HeadingButtonProps === void 0 ? void 0 : HeadingButtonProps.class), ref: HeadingButtonProps === null || HeadingButtonProps === void 0 ? void 0 : HeadingButtonProps.ref, slot: \"expert\", _ariaControls: `${id}-control`, _ariaExpanded: open, _disabled: disabled, _icons: (HeadingButtonProps === null || HeadingButtonProps === void 0 ? void 0 : HeadingButtonProps._icons) || `codicon codicon-${icon}`, _label: label, _on: { onClick } })), h(\"div\", { class: clsx('collapsible__wrapper', ContentProps === null || ContentProps === void 0 ? void 0 : ContentProps.wrapperClass) }, h(\"div\", { class: clsx('collapsible__wrapper-animation', ContentProps === null || ContentProps === void 0 ? void 0 : ContentProps.animationClass) }, h(\"div\", { \"aria-hidden\": open === false ? 'true' : undefined, class: clsx('collapsible__content', ContentProps === null || ContentProps === void 0 ? void 0 : ContentProps.class), id: `${id}-control` }, children)))));\n};\n\nexport { KolCollapsibleFc as K };\n//# sourceMappingURL=Collapsible-DeF6ptXV.js.map\n\n//# sourceMappingURL=Collapsible-DeF6ptXV.js.map"],"names":["KolCollapsibleFc","props","children","id","classNames","label","level","disabled","open","onClick","HeadingProps","HeadingButtonProps","ContentProps","other","__rest","icon","h","clsx","KolHeadingFc","KolButtonWcTag"],"mappings":"uMASK,MAACA,EAAmB,CAACC,EAAOC,IAAa,CAC1C,KAAM,CAAE,GAAAC,EAAI,MAAOC,EAAY,MAAAC,EAAO,MAAAC,EAAQ,EAAG,SAAAC,EAAU,KAAAC,EAAM,QAAAC,EAAS,aAAAC,EAAe,CAAA,EAAI,mBAAAC,EAAqB,CAAA,EAAI,aAAAC,EAAe,CAAA,CAAE,EAAKX,EAAOY,EAAQC,EAAOb,EAAO,CAAC,KAAM,QAAS,QAAS,QAAS,WAAY,OAAQ,UAAW,eAAgB,qBAAsB,cAAc,CAAC,EACzRc,EAAOP,EAAO,SAAW,MAC/B,OAAQQ,EAAE,MAAO,OAAO,OAAO,CAAE,GAAIb,EAAI,MAAOc,EAAK,cAAe,CAC5D,wBAAyBV,IAAa,GACtC,oBAAqBC,IAAS,EAC1C,EAAWJ,CAAU,CAAC,EAAIS,CAAK,EAAGG,EAAEE,EAAc,CAAE,IAAiER,GAAa,IAAK,MAAOJ,EAAO,MAAOW,EAAK,uBAAoFP,GAAa,KAAK,CAAC,EAAIM,EAAEG,EAAgB,CAAE,MAAOF,EAAK,8BAAuGN,GAAmB,KAAK,EAAG,IAA6EA,GAAmB,IAAK,KAAM,SAAU,cAAe,GAAGR,CAAE,WAAY,cAAeK,EAAM,UAAWD,EAAU,OAAiFI,GAAmB,QAAW,mBAAmBI,CAAI,GAAI,OAAQV,EAAO,IAAK,CAAE,QAAAI,CAAO,CAAE,CAAE,CAAC,EAAGO,EAAE,MAAO,CAAE,MAAOC,EAAK,uBAAoFL,GAAa,YAAY,CAAC,EAAII,EAAE,MAAO,CAAE,MAAOC,EAAK,iCAA8FL,GAAa,cAAc,CAAC,EAAII,EAAE,MAAO,CAAE,cAAeR,IAAS,GAAQ,OAAS,OAAW,MAAOS,EAAK,uBAAoFL,GAAa,KAAK,EAAG,GAAI,GAAGT,CAAE,UAAU,EAAID,CAAQ,CAAC,CAAC,CAAC,CAChxC"}

package/dist/assets/FieldControlStateWrapper-DQnEdxHI-BffRoF3O.js

@@ -1,2 +0,0 @@
-import{_ as b}from"./tslib.es6-CxX45GIN-BGVaTf34.js";import{h as e,F as S}from"./index-bkYRA5xm.js";import{c}from"./clsx-eK3rPvPS-B-dksMZM.js";import{b as q,s as w}from"./reuse-CX4AQDkS-BaVSFETn.js";import{c as I,a as E,K as M,b as $}from"./FormFieldStateWrapper-Bd0o35ib-Bc22cClh.js";const W=(o,l)=>{var{class:n}=o,i=b(o,["class"]);return e("div",Object.assign({class:c("kol-field-control__input",n)},i),l)},z=(o,l)=>{const{class:n,id:i,disabled:m,label:t,hideLabel:a,labelAlign:d,renderNoTooltip:_,hint:y,renderNoHint:C,tooltipAlign:F,accessKey:p,shortKey:f,msg:s,touched:h,required:K,readonly:k,fieldControlInputProps:T,fieldControlLabelProps:r,fieldControlTooltipProps:v,fieldControlHintProps:O}=o,B=b(o,["class","id","disabled","label","hideLabel","labelAlign","renderNoTooltip","hint","renderNoHint","tooltipAlign","accessKey","shortKey","msg","touched","required","readonly","fieldControlInputProps","fieldControlLabelProps","fieldControlTooltipProps","fieldControlHintProps"]),P=!C,x=!_,L=I(s,h),g=w(t),N=x&&!g&&a,j=q(p,f),A=typeof s=="string"?"error":s?._type,u=[e(S,null,e(W,Object.assign({},T),l),N&&e(E,Object.assign({},v||{},{id:i,label:t,align:F,badgeText:j}))),e(M,Object.assign({},r||{},{id:i,baseClassName:"kol-field-control",class:c(r?.class,{"kol-field-control__label--visually-hidden":!!a}),hasExpertSlot:g,label:t,accessKey:p,shortKey:f}))];d==="left"&&u.reverse();const H={"kol-field-control--disabled":!!m,"kol-field-control--required":!!K,"kol-field-control--touched":!!h,"kol-field-control--hide-label":!!a,"kol-field-control--read-only":!!k,[`kol-field-control--${A||"error"}`]:!!L,[`kol-field-control--label-align-${d}`]:!!d};return e("div",Object.assign({class:c("kol-field-control",H,n)},B),u,P&&e($,Object.assign({},O||{},{baseClassName:"kol-field-control",id:i,hint:y})))};function D(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 V=(o,l)=>{var{state:n}=o,i=b(o,["state"]);return e(z,Object.assign({},D(n),i),l)};export{V as F};
-//# sourceMappingURL=FieldControlStateWrapper-DQnEdxHI-BffRoF3O.js.map

package/dist/assets/FieldControlStateWrapper-DQnEdxHI-BffRoF3O.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"FieldControlStateWrapper-DQnEdxHI-BffRoF3O.js","sources":["../../../../components/dist/esm/FieldControlStateWrapper-DQnEdxHI.js"],"sourcesContent":["/*!\n * KoliBri - The accessible HTML-Standard\n */\nimport { _ as __rest } from './tslib.es6-CxX45GIN.js';\nimport { h, F as Fragment } from './index-iB2O5Z2w.js';\nimport { c as clsx } from './clsx-eK3rPvPS.js';\nimport './common-L1K0yh1S.js';\nimport { b as buildBadgeTextString, s as showExpertSlot } from './reuse-CX4AQDkS.js';\nimport { a as FormFieldTooltipFc, K as KolFormFieldLabelFc, b as KolFormFieldHintFc, c as checkHasMsg } from './FormFieldStateWrapper-Bd0o35ib.js';\n\nconst InputContainer = (_a, children) => {\n    var { class: classNames } = _a, other = __rest(_a, [\"class\"]);\n    return (h(\"div\", Object.assign({ class: clsx('kol-field-control__input', classNames) }, other), children));\n};\nconst KolFieldControlFc = (props, children) => {\n    const { class: classNames, id, disabled, label, hideLabel, labelAlign, renderNoTooltip, hint, renderNoHint, tooltipAlign, accessKey, shortKey, msg, touched, required, readonly, fieldControlInputProps, fieldControlLabelProps, fieldControlTooltipProps, fieldControlHintProps } = props, other = __rest(props, [\"class\", \"id\", \"disabled\", \"label\", \"hideLabel\", \"labelAlign\", \"renderNoTooltip\", \"hint\", \"renderNoHint\", \"tooltipAlign\", \"accessKey\", \"shortKey\", \"msg\", \"touched\", \"required\", \"readonly\", \"fieldControlInputProps\", \"fieldControlLabelProps\", \"fieldControlTooltipProps\", \"fieldControlHintProps\"]);\n    const canShowHint = !renderNoHint;\n    const canShowTooltip = !renderNoTooltip;\n    const showMsg = checkHasMsg(msg, touched);\n    const hasExpertSlot = showExpertSlot(label);\n    const useTooltipInsteadOfLabel = canShowTooltip && !hasExpertSlot && hideLabel;\n    const badgeText = buildBadgeTextString(accessKey, shortKey);\n    const msgType = typeof msg === 'string' ? 'error' : msg === null || msg === void 0 ? void 0 : msg._type;\n    const components = [\n        h(Fragment, null, h(InputContainer, Object.assign({}, fieldControlInputProps), children), useTooltipInsteadOfLabel && (h(FormFieldTooltipFc, Object.assign({}, (fieldControlTooltipProps || {}), { id: id, label: label, align: tooltipAlign, badgeText: badgeText })))),\n        h(KolFormFieldLabelFc, Object.assign({}, (fieldControlLabelProps || {}), { id: id, baseClassName: \"kol-field-control\", class: clsx(fieldControlLabelProps === null || fieldControlLabelProps === void 0 ? void 0 : fieldControlLabelProps.class, {\n                ['kol-field-control__label--visually-hidden']: Boolean(hideLabel),\n            }), hasExpertSlot: hasExpertSlot, label: label, accessKey: accessKey, shortKey: shortKey })),\n    ];\n    if (labelAlign === 'left') {\n        components.reverse();\n    }\n    const stateCssClasses = {\n        ['kol-field-control--disabled']: Boolean(disabled),\n        ['kol-field-control--required']: Boolean(required),\n        ['kol-field-control--touched']: Boolean(touched),\n        ['kol-field-control--hide-label']: Boolean(hideLabel),\n        ['kol-field-control--read-only']: Boolean(readonly),\n        [`kol-field-control--${msgType || 'error'}`]: Boolean(showMsg),\n        [`kol-field-control--label-align-${labelAlign}`]: Boolean(labelAlign),\n    };\n    return (h(\"div\", Object.assign({ class: clsx('kol-field-control', stateCssClasses, classNames) }, other), components, canShowHint && h(KolFormFieldHintFc, Object.assign({}, (fieldControlHintProps || {}), { baseClassName: \"kol-field-control\", id: id, hint: hint }))));\n};\n\nfunction getFieldControlProps(state) {\n    const props = {\n        id: state._id,\n        disabled: state._disabled,\n        msg: state._msg,\n        hint: state._hint,\n        label: state._label,\n        hideLabel: state._hideLabel,\n        touched: state._touched,\n    };\n    if ('_required' in state) {\n        props.required = state._required;\n    }\n    if ('_readOnly' in state) {\n        props.readonly = state._readOnly;\n    }\n    if ('_labelAlign' in state) {\n        props.labelAlign = state._labelAlign;\n    }\n    if ('_accessKey' in state) {\n        props.accessKey = state._accessKey;\n    }\n    if ('_shortKey' in state) {\n        props.shortKey = state._shortKey;\n    }\n    return props;\n}\nconst FieldControlStateWrapper = (_a, children) => {\n    var { state } = _a, other = __rest(_a, [\"state\"]);\n    return (h(KolFieldControlFc, Object.assign({}, getFieldControlProps(state), other), children));\n};\n\nexport { FieldControlStateWrapper as F };\n//# sourceMappingURL=FieldControlStateWrapper-DQnEdxHI.js.map\n\n//# sourceMappingURL=FieldControlStateWrapper-DQnEdxHI.js.map"],"names":["InputContainer","_a","children","classNames","other","__rest","h","clsx","KolFieldControlFc","props","id","disabled","label","hideLabel","labelAlign","renderNoTooltip","hint","renderNoHint","tooltipAlign","accessKey","shortKey","msg","touched","required","readonly","fieldControlInputProps","fieldControlLabelProps","fieldControlTooltipProps","fieldControlHintProps","canShowHint","canShowTooltip","showMsg","checkHasMsg","hasExpertSlot","showExpertSlot","useTooltipInsteadOfLabel","badgeText","buildBadgeTextString","msgType","components","Fragment","FormFieldTooltipFc","KolFormFieldLabelFc","stateCssClasses","KolFormFieldHintFc","getFieldControlProps","state","FieldControlStateWrapper"],"mappings":"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"}

package/dist/assets/FormFieldStateWrapper-Bd0o35ib-Bc22cClh.js

@@ -1,2 +0,0 @@
-import{h as a,F as V,K as se,n as z,v as ae,s as I,o as U,p as w,d as le,a as K,m as A,w as de,X as ce,t as he,z as P}from"./index-bkYRA5xm.js";import{v as ue,a as j,b as pe,c as me}from"./access-and-short-key-Dy2a7Py3-BYE_qlSs.js";import{v as fe}from"./disabled-u5a_azlj-BHRUFZob.js";import{v as ge}from"./hide-label-DjBQJOAP-Dwmn1HrG.js";import{a as be}from"./label-ohY9ajP0-Bl4rQEOo.js";import{v as _e}from"./tooltip-align-DEw_M6Is-DvG2eRku.js";import{A as ye}from"./associated.controller-CvM-u0FR-CKW6oxi2.js";import{i as H,a as ve,c as xe,r as Le}from"./isObject-DvSELytj-DhzEQer1.js";import{_ as T}from"./tslib.es6-CxX45GIN-BGVaTf34.js";import{c as b}from"./clsx-eK3rPvPS-B-dksMZM.js";import{b as X,s as Fe}from"./reuse-CX4AQDkS-BaVSFETn.js";import{t as g}from"./i18n-CQxlBXNV-fOD_EHC9.js";import{i as W,K as Ce}from"./InternalUnderlinedBadgeText-CJyOdgkx-B6pnWwZZ.js";import{K as Ke}from"./Alert-BVXxAiPu-V0QPNk25.js";const Te=(e,t)=>{A(e,"_adjustHeight",t)},ke=(e,t,n)=>{A(e,"_hideMsg",t,n)},Se=(e,t)=>{z(e,"_hint",t)},Oe=(e,t)=>{U(t,()=>{try{t=w(t)}catch{}de(e,"_msg",n=>{if(n===void 0||typeof n=="string"&&n.length>0)return!0;if(ce(n)&&n!==null){const i=n._description;return he(i,1)}return!1},new Set(["MsgPropType","string"]),t)})};function Me(e,t){var n;if(!e)return!1;const i=typeof e=="string"?"error":(n=e._type)!==null&&n!==void 0?n:"error";return t===!0||i!=="error"}function Be(e){if(typeof e=="string")try{return w(e)}catch{return{_description:e,_type:"error"}}return e&&typeof e=="object"&&!("_type"in e)?Object.assign(Object.assign({},e),{_type:"error"}):e}const Ie=(e,t)=>{A(e,"_touched",t)},je=({id:e,maxLength:t})=>a("span",{id:`${e}-character-limit-hint`,class:"visually-hidden"},g("kol-character-limit-hint",{placeholders:{limit:String(t)}})),Ee=({currentLength:e,currentLengthDebounced:t,maxLength:n,maxLengthBehavior:i,id:o})=>{let l,d;const s=["kol-form-field__counter"];if(i==="hard")l=typeof n=="number"?g("kol-character-counter-current-of-max",{placeholders:{current:String(e),max:String(n)}}):g("kol-character-counter-current",{placeholders:{current:String(e)}}),d=typeof n=="number"?g("kol-character-counter-current-of-max-aria",{placeholders:{current:String(t),max:String(n)}}):g("kol-character-counter-current",{placeholders:{current:String(t)}});else if(typeof n=="number"){const r=n-e,h=r<0,f=n-t,p=f<0;l=h?g("kol-character-limit-exceeded",{placeholders:{over:String(Math.abs(r))}}):g("kol-character-limit-remaining",{placeholders:{remaining:String(r)}}),d=p?g("kol-character-limit-exceeded",{placeholders:{over:String(Math.abs(f))}}):g("kol-character-limit-remaining",{placeholders:{remaining:String(f)}}),h&&s.push("kol-form-field__counter--exceeded")}else return null;return a(V,null,a("span",{class:b(s),"aria-hidden":"true","data-testid":"input-counter"},l),a("span",{id:`${o}-counter`,"aria-live":"polite",class:"visually-hidden","data-testid":"input-counter-aria"},d))},He=e=>{var{id:t,class:n,hint:i,baseClassName:o="kol-form-field"}=e,l=T(e,["id","class","hint","baseClassName"]);return i?a("span",Object.assign({class:b(`${o}__hint`,n),id:`${t}-hint`},l),i):null};var we="[object Symbol]";function Ae(e){return typeof e=="symbol"||ve(e)&&xe(e)==we}var De=/\s/;function $e(e){for(var t=e.length;t--&&De.test(e.charAt(t)););return t}var Ne=/^\s+/;function Pe(e){return e&&e.slice(0,$e(e)+1).replace(Ne,"")}var q=NaN,We=/^[-+]0x[0-9a-f]+$/i,qe=/^0b[01]+$/i,Re=/^0o[0-7]+$/i,Ve=parseInt;function R(e){if(typeof e=="number")return e;if(Ae(e))return q;if(H(e)){var t=typeof e.valueOf=="function"?e.valueOf():e;e=H(t)?t+"":t}if(typeof e!="string")return e===0?e:+e;e=Pe(e);var n=qe.test(e);return n||Re.test(e)?Ve(e.slice(2),n?2:8):We.test(e)?q:+e}var E=function(){return Le.Date.now()},ze="Expected a function",Ue=Math.max,Xe=Math.min;function Ge(e,t,n){var i,o,l,d,s,r,h=0,f=!1,p=!1,y=!0;if(typeof e!="function")throw new TypeError(ze);t=R(t)||0,H(n)&&(f=!!n.leading,p="maxWait"in n,l=p?Ue(R(n.maxWait)||0,t):l,y="trailing"in n?!!n.trailing:y);function u(c){var m=i,_=o;return i=o=void 0,h=c,d=e.apply(_,m),d}function v(c){return h=c,s=setTimeout(F,t),f?u(c):d}function x(c){var m=c-r,_=c-h,O=t-m;return p?Xe(O,l-_):O}function L(c){var m=c-r,_=c-h;return r===void 0||m>=t||m<0||p&&_>=l}function F(){var c=E();if(L(c))return k(c);s=setTimeout(F,x(c))}function k(c){return s=void 0,y&&i?u(c):(i=o=void 0,d)}function S(){s!==void 0&&clearTimeout(s),h=0,i=r=o=s=void 0}function M(){return s===void 0?d:k(E())}function C(){var c=E(),m=L(c);if(i=arguments,o=this,r=c,m){if(s===void 0)return v(r);if(p)return clearTimeout(s),s=setTimeout(F,t),u(r)}return s===void 0&&(s=setTimeout(F,t)),d}return C.cancel=S,C.flush=M,C}const Je=({hasExpertSlot:e,accessKey:t,shortKey:n,label:i,showBadge:o=!0})=>{if(e)return a("slot",{name:"expert"});if(!i)return null;const l=W(t)||W(n);if(!o||!l)return a("span",null,i);const d=X(t,n);return a(V,null,a(Ce,{badgeText:d,label:i})," ",a("kbd",{class:"badge-text-hint","aria-hidden":"true"},d))},Qe=e=>{var{component:t="label",id:n,baseClassName:i="kol-form-field",class:o,accessKey:l,shortKey:d,label:s,hideLabel:r,hasExpertSlot:h,showBadge:f,readOnly:p}=e,y=T(e,["component","id","baseClassName","class","accessKey","shortKey","label","hideLabel","hasExpertSlot","showBadge","readOnly"]);const u=!h&&r,v=g("kol-readonly");return a(t,Object.assign({},y,{class:b(`${i}__label`,o),id:u?void 0:`${n}-label`,hidden:u,htmlFor:n}),a("span",{class:b(`${i}__label-text`)},a(Je,{hasExpertSlot:h,accessKey:l,shortKey:d,label:s,showBadge:f}),p?a("span",{class:b(`${i}__label__read-only`),"aria-hidden":"true"},"(",v,")"):null))},Ye=e=>{var t,n,{alert:i,msg:o,id:l,class:d}=e,s=T(e,["alert","msg","id","class"]);const r=Be(o);return a(Ke,Object.assign({id:`${l}-msg`,alert:(t=r?._alert)!==null&&t!==void 0?t:i,hasCloser:!1,level:0,type:(n=r?._type)!==null&&n!==void 0?n:"error",variant:"msg",class:b("kol-form-field__msg",d)},s),r?._description||void 0)},Ze=({id:e,align:t,badgeText:n,label:i,class:o})=>a(se,{"aria-hidden":"true",class:b("kol-form-field__tooltip",o),_badgeText:n,_align:t,_id:`${e}-label`,_label:i});function et(e){return e?.type&&{default:"msg-type-default",info:"msg-type-info",success:"msg-type-success",warning:"msg-type-warning",error:"msg-type-error"}[e?.type]||""}const tt=(e,t)=>{var{class:n}=e,i=T(e,["class"]);return a("div",Object.assign({class:b("kol-form-field__input",n)},i),t)},nt=(e,t)=>{var n;const{component:i="div",renderNoLabel:o,renderNoTooltip:l,renderNoHint:d,anotherChildren:s,id:r,required:h,alert:f,disabled:p,class:y,msg:u,hideMsg:v,hideLabel:x,label:L,hint:F,accessKey:k,shortKey:S,tooltipAlign:M,counter:C,readOnly:c,touched:m,maxLength:_,ariaDescribedBy:O,formFieldLabelProps:G,formFieldHintProps:J,formFieldTooltipProps:Q,formFieldMsgProps:Y,formFieldInputProps:Z}=e,ee=T(e,["component","renderNoLabel","renderNoTooltip","renderNoHint","anotherChildren","id","required","alert","disabled","class","msg","hideMsg","hideLabel","label","hint","accessKey","shortKey","tooltipAlign","counter","readOnly","touched","maxLength","ariaDescribedBy","formFieldLabelProps","formFieldHintProps","formFieldTooltipProps","formFieldMsgProps","formFieldInputProps"]),te=!o,ne=!d,ie=!l,D=Fe(L),$=Me(u,m),oe=X(k,S),re=ie&&!D&&x,N=typeof u=="string"?"error":(n=u?._type)!==null&&n!==void 0?n:"error";let B={"kol-form-field--disabled":!!p,"kol-form-field--required":!!h,"kol-form-field--touched":!!m,"kol-form-field--hide-label":!!x,"kol-form-field--read-only":!!c,"kol-form-field--hidden-msg":!!v};return $&&(B=Object.assign(Object.assign({},B),{[`kol-form-field--${N||"error"}`]:!0,[`kol-form-field--${et({type:N})}`]:!0})),a(i,Object.assign({class:b("kol-form-field",B,y),"aria-describedby":O},ee),te&&a(Qe,Object.assign({},G||{},{id:r,hasExpertSlot:D,hideLabel:x,label:L,accessKey:k,shortKey:S,readOnly:c})),a(tt,Object.assign({},Z),t,re&&x===!0&&a(Ze,Object.assign({},Q||{},{id:r,label:L,align:M,badgeText:oe}))),C?a(Ee,Object.assign({id:r},C)):null,_?a(je,{id:r,maxLength:_}):null,$&&!v&&a(Ye,Object.assign({},Y||{},{id:r,alert:f,msg:u})),ne&&a(He,Object.assign({},J||{},{id:r,hint:F})),s)};function vt({ariaDescribedBy:e,hideLabel:t,label:n}){return{title:"",autoCapitalize:"off",autoCorrect:"off","aria-describedby":e?.length?e.join(" "):void 0,"aria-label":t&&n?n:void 0}}class it extends ye{constructor(t,n,i){super(t,n,i),this.component=t}validateTouched(t){Ie(this.component,t)}componentWillLoad(){super.componentWillLoad(),this.validateTouched(this.component._touched)}}class xt extends it{constructor(t,n,i){super(t,n,i),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=Ge(o=>{I(this.component,"_currentLengthDebounced",o)},500),this.component=t}validateAccessKey(t){ue(this.component,t),j(t,this.component._shortKey)}validateAdjustHeight(t){Te(this.component,t)}validateDisabled(t){fe(this.component,t)}validateTooltipAlign(t){_e(this.component,t)}validateHideMsg(t){ke(this.component,t,{hooks:{afterPatch:()=>{this.component.state._hideMsg&&P("Property _hideMsg for inputs: Only use when the error message is shown outside of the input component.")}}})}validateHideLabel(t){ge(this.component,t,{hooks:{afterPatch:()=>{this.component.state._hideLabel&&P("Property hide-label for inputs: Only use for exceptions like search inputs that are clearly identifiable by their context.")}}})}validateHint(t){Se(this.component,t)}validateId(t){z(this.component,"_id",t,{minLength:1}),(t===""||typeof t>"u")&&ae("A unique ID on the input fields is not strictly required, but it might be relevant for E2E tests.")}validateLabel(t){be(this.component,t,{required:!0})}validateMsg(t){Oe(this.component,t)}validateOn(t){typeof t=="object"&&I(this.component,"_on",t)}validateShortKey(t){pe(this.component,t),j(this.component._accessKey,t)}validateSmartButton(t){U(t,()=>{try{t=w(t)}catch{}I(this.component,"_smartButton",t)})}validateTabIndex(t){me(this.component,t)}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.validateId(this.component._id),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),j(this.component._accessKey,this.component._shortKey)}emitEvent(t,n){this.host&&le(this.host,t,n)}onBlur(t){var n;this.component._touched=!0,this.emitEvent(K.blur),typeof((n=this.component._on)===null||n===void 0?void 0:n.onBlur)=="function"&&this.component._on.onBlur(t)}onChange(t,n){var i;typeof n>"u"&&(n=t.target.value),this.emitEvent(K.change,n),typeof((i=this.component._on)===null||i===void 0?void 0:i.onChange)=="function"&&this.component._on.onChange(t,n),this.valueChangeListeners.forEach(o=>o(n))}onInput(t,n=!0,i){var o;typeof i>"u"&&(i=t.target.value),this.emitEvent(K.input,i),n&&this.setFormAssociatedValue(i),typeof((o=this.component._on)===null||o===void 0?void 0:o.onInput)=="function"&&this.component._on.onInput(t,i)}onClick(t){var n;this.emitEvent(K.click),typeof((n=this.component._on)===null||n===void 0?void 0:n.onClick)=="function"&&this.component._on.onClick(t)}onFocus(t){var n;this.emitEvent(K.focus),typeof((n=this.component._on)===null||n===void 0?void 0:n.onFocus)=="function"&&this.component._on.onFocus(t)}onKeyDown(t){var n;this.emitEvent(K.keydown),typeof((n=this.component._on)===null||n===void 0?void 0:n.onKeyDown)=="function"&&this.component._on.onKeyDown(t)}addValueChangeListener(t){this.valueChangeListeners.push(t)}hasSoftCharacterLimit(){return typeof this.component.state._maxLength=="number"&&this.component.state._maxLengthBehavior==="soft"}hasCounter(){return this.component.state._hasCounter===!0}}const ot=e=>{var t;const n=e._msg,i=typeof n=="string"?n:n?._description,o=typeof n=="string"?"error":(t=n?._type)!==null&&t!==void 0?t:"error",l=!!(i&&i.length>0),s=o==="error"&&l&&e._touched===!0,r=typeof e._hint=="string"&&e._hint.length>0,h=[];return l&&!e._hideMsg&&h.push(`${e._id}-msg`),r===!0&&h.push(`${e._id}-hint`),e._hasCounter&&h.push(`${e._id}-counter`),s===!0&&h.push(`${e._id}-error`),{hasError:s,hasHint:r,ariaDescribedBy:h}};function rt(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};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&&typeof e._currentLength=="number"&&"_currentLengthDebounced"in e&&typeof e._currentLengthDebounced=="number"&&"_hasCounter"in e&&e._hasCounter===!0&&(t.counter={currentLength:e._currentLength,currentLengthDebounced:e._currentLengthDebounced,maxLength:e._maxLength,maxLengthBehavior:e._maxLengthBehavior||"hard"}),t}const Lt=(e,t)=>{var{state:n}=e,i=T(e,["state"]);const{ariaDescribedBy:o}=ot(n),d=(i.component==="fieldset"||"_options"in n&&"_orientation"in n)&&o.length>0?o.join(" "):void 0,s=rt(n);return a(nt,Object.assign({},s,i,{ariaDescribedBy:d}),t)};export{Lt as F,xt as I,Qe as K,Ze as a,He as b,Me as c,vt as d,ot as g};
-//# sourceMappingURL=FormFieldStateWrapper-Bd0o35ib-Bc22cClh.js.map