@public-ui/sample-react 2.2.17 → 2.2.18-rc.0

package/public/assets/material-symbols/package.json

@@ -1,41 +1,41 @@
 {
-  "name": "material-symbols",
-  "version": "0.5.5",
-  "description": "Latest variable icon fonts and CSS for Material Symbols.",
-  "main": "index.css",
-  "sass": "index.scss",
-  "types": "index.d.ts",
-  "files": [
-    "index.d.ts",
-    "*.{css,scss,woff2}"
-  ],
-  "scripts": {
-    "build": "sass --no-source-map --no-error-css ."
-  },
-  "devDependencies": {
-    "sass": "1.56.1"
-  },
-  "license": "Apache-2.0",
-  "repository": {
-    "type": "git",
-    "url": "git+https://github.com/marella/material-symbols.git",
-    "directory": "material-symbols"
-  },
-  "bugs": {
-    "url": "https://github.com/marella/material-symbols/issues"
-  },
-  "homepage": "https://marella.github.io/material-symbols/demo/",
-  "keywords": [
-    "material-symbols",
-    "material-icons",
-    "material-design-icons",
-    "material-design",
-    "material",
-    "symbols",
-    "icons",
-    "font"
-  ],
-  "publishConfig": {
-    "access": "public"
-  }
+	"name": "material-symbols",
+	"version": "0.5.5",
+	"description": "Latest variable icon fonts and CSS for Material Symbols.",
+	"main": "index.css",
+	"sass": "index.scss",
+	"types": "index.d.ts",
+	"files": [
+		"index.d.ts",
+		"*.{css,scss,woff2}"
+	],
+	"scripts": {
+		"build": "sass --no-source-map --no-error-css ."
+	},
+	"devDependencies": {
+		"sass": "1.56.1"
+	},
+	"license": "Apache-2.0",
+	"repository": {
+		"type": "git",
+		"url": "git+https://github.com/marella/material-symbols.git",
+		"directory": "material-symbols"
+	},
+	"bugs": {
+		"url": "https://github.com/marella/material-symbols/issues"
+	},
+	"homepage": "https://marella.github.io/material-symbols/demo/",
+	"keywords": [
+		"material-symbols",
+		"material-icons",
+		"material-design-icons",
+		"material-design",
+		"material",
+		"symbols",
+		"icons",
+		"font"
+	],
+	"publishConfig": {
+		"access": "public"
+	}
 }

package/src/components/skip-nav/basic.tsx

@@ -1,33 +1,42 @@
 import type { FC } from 'react';
-import React from 'react';
+import React, { useEffect, useRef } from 'react';
 
 import { KolSkipNav } from '@public-ui/react-v19';
 
 import { SampleDescription } from '../SampleDescription';
 
-export const SkipNavBasic: FC = () => (
-	<div className="grid gap-4">
-		<SampleDescription>
-			<p>KolSkipNav renders a list of navigation links that are visually hidden by default and only visible on focus.</p>
-			<p>For testing purposes, click into the example and press the tab-key in order to focus the first link.</p>
-		</SampleDescription>
+export const SkipNavBasic: FC = () => {
+	const skipNavRef = useRef<HTMLKolSkipNavElement>(null);
 
-		<KolSkipNav
-			_label="Hidden navigation"
-			_links={[
-				{
-					_label: 'To the top',
-					_href: '#/back-page',
-				},
-				{
-					_label: 'To the form',
-					_href: '#/back-page',
-				},
-				{
-					_label: 'To the end',
-					_href: '#/back-page',
-				},
-			]}
-		></KolSkipNav>
-	</div>
-);
+	useEffect(() => {
+		skipNavRef.current?.kolFocus();
+	}, []);
+
+	return (
+		<div className="grid gap-4">
+			<SampleDescription>
+				<p>KolSkipNav renders a list of navigation links that are visually hidden by default and only visible on focus.</p>
+				<p>For testing purposes, click into the example and press the tab-key in order to focus the first link.</p>
+			</SampleDescription>
+
+			<KolSkipNav
+				ref={skipNavRef}
+				_label="Hidden navigation"
+				_links={[
+					{
+						_label: 'To the top',
+						_href: '#/back-page',
+					},
+					{
+						_label: 'To the form',
+						_href: '#/back-page',
+					},
+					{
+						_label: 'To the end',
+						_href: '#/back-page',
+					},
+				]}
+			></KolSkipNav>
+		</div>
+	);
+};

package/src/components/table/direction-aware-sort.tsx

@@ -0,0 +1,65 @@
+import type { FC } from 'react';
+import React from 'react';
+
+import type { KoliBriTableHeaders } from '@public-ui/components';
+import { KolTable } from '@public-ui/react-v19';
+import { SampleDescription } from '../SampleDescription';
+
+type TemperatureRow = {
+	city: string;
+	temperature: number;
+};
+
+const COMFORTABLE_TEMPERATURE = 22;
+
+const TEMPERATURE_DATA: TemperatureRow[] = [
+	{ city: 'Reykjavík', temperature: 6 },
+	{ city: 'Berlin', temperature: 21 },
+	{ city: 'Palma de Mallorca', temperature: 29 },
+	{ city: 'Cairo', temperature: 35 },
+	{ city: 'Helsinki', temperature: 14 },
+];
+
+const HEADERS: KoliBriTableHeaders = {
+	horizontal: [
+		[
+			{ label: 'City', key: 'city' },
+			{
+				label: 'Temperature (°C)',
+				key: 'temperature',
+				textAlign: 'right',
+				compareFn: (rowA, rowB, direction = 'ASC') => {
+					const temperatureA = (rowA as TemperatureRow).temperature;
+					const temperatureB = (rowB as TemperatureRow).temperature;
+					const differenceA = Math.abs(temperatureA - COMFORTABLE_TEMPERATURE);
+					const differenceB = Math.abs(temperatureB - COMFORTABLE_TEMPERATURE);
+
+					if (differenceA !== differenceB) {
+						return direction === 'DESC' ? differenceB - differenceA : differenceA - differenceB;
+					}
+
+					return direction === 'DESC' ? temperatureB - temperatureA : temperatureA - temperatureB;
+				},
+				render: (_element, _cell, row) => {
+					const difference = Math.abs((row as TemperatureRow).temperature - COMFORTABLE_TEMPERATURE);
+					return `${(row as TemperatureRow).temperature} °C (Δ ${difference} °C)`;
+				},
+			},
+		],
+	],
+};
+
+export const TableDirectionAwareSort: FC = () => (
+	<>
+		<SampleDescription>
+			<p>
+				This sample demonstrates how <code>compareFn</code> receives the current <code>sortDirection</code>. Ascending sorts show cities that are closest to
+				22&nbsp;°C first, descending sorts highlight the most extreme temperatures.
+			</p>
+		</SampleDescription>
+
+		<section className="w-full">
+			<KolTable _label="Direction aware compare function" _data={TEMPERATURE_DATA} _headers={HEADERS} className="block" />
+		</section>
+	</>
+);

package/src/components/table/routes.ts

@@ -1,19 +1,20 @@
 import { Routes } from '../../shares/types';
-import { PaginationPosition } from './pagination-position';
 import { TableColumnAlignment } from './column-alignment';
 import { TableComplexHeaders } from './complex-headers';
+import { TableDirectionAwareSort } from './direction-aware-sort';
 import { TableHorizontalScrollbar } from './horizontal-scrollbar';
+import { InteractiveChildElements } from './interactive-child-elements';
+import { MultiSortTable } from './multi-sort';
+import { PaginationPosition } from './pagination-position';
 import { TableRenderCell } from './render-cell';
 import { TableSortData } from './sort-data';
-import { TableStateless } from './stateless';
-import { TableWithFooter } from './with-footer';
 import { TableStatefulWithSelection } from './stateful-with-selection';
 import { TableStatefulWithSingleSelection } from './stateful-with-single-selection';
+import { TableStateless } from './stateless';
 import { TableStatelessWithSelection } from './stateless-with-selection';
 import { TableStatelessWithSingleSelection } from './stateless-with-single-selection';
+import { TableWithFooter } from './with-footer';
 import { TableWithPagination } from './with-pagination';
-import { InteractiveChildElements } from './interactive-child-elements';
-import { MultiSortTable } from './multi-sort';
 
 export const TABLE_ROUTES: Routes = {
 	table: {
@@ -23,6 +24,7 @@ export const TABLE_ROUTES: Routes = {
 		'pagination-position': PaginationPosition,
 		'render-cell': TableRenderCell,
 		'sort-data': TableSortData,
+		'direction-aware-sort': TableDirectionAwareSort,
 		'with-footer': TableWithFooter,
 		'stateful-with-selection': TableStatefulWithSelection,
 		'stateful-with-single-selection': TableStatefulWithSingleSelection,

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

@@ -0,0 +1,42 @@
+import type { FC } from 'react';
+import React from 'react';
+
+import { KolButton } from '@public-ui/react-v19';
+import { SampleDescription } from '../components/SampleDescription';
+import { useToasterService } from '../hooks/useToasterService';
+
+export const CustomTooltipCssProperties: FC = () => {
+	const { dummyClickEventHandler } = useToasterService();
+
+	const dummyEventHandler = {
+		onClick: dummyClickEventHandler,
+	};
+
+	return (
+		<>
+			<SampleDescription>
+				<p>
+					This sample demonstrates how tooltip animation duration and width can be customized via
+					<code>--kolibri-tooltip-animation-duration</code> and <code>--kol-tooltip-width</code>.
+				</p>
+			</SampleDescription>
+
+			<div className="flex justify-center items-center gap-4">
+				<KolButton
+					_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"
+					_on={dummyEventHandler}
+				></KolButton>
+			</div>
+		</>
+	);
+};

package/src/scenarios/date-in-form.tsx

@@ -0,0 +1,24 @@
+import { KolButton, KolForm, KolInputDate } from '@public-ui/react-v19';
+import type { FC } from 'react';
+import React from 'react';
+import { SampleDescription } from '../components/SampleDescription';
+
+export const DateInForm: FC = () => (
+	<>
+		<SampleDescription>
+			<p>KolForm with KolInputDate inside to make sure enter on the date icon does not submit the form.</p>
+		</SampleDescription>
+
+		<KolForm
+			_on={{
+				onSubmit: () => {
+					console.error('submitted');
+					alert('submitted');
+				},
+			}}
+		>
+			<KolInputDate _label="date" _name="datum" />
+			<KolButton _label="Submit" _type="submit" />
+		</KolForm>
+	</>
+);

package/src/scenarios/routes.ts

@@ -1,7 +1,7 @@
 import { Routes } from '../shares/types';
 import { AppointmentForm } from './appointment-form/AppointmentForm';
 import { ChangeTabindex } from './change-tabindex';
-import { CustomTooltipWidth } from './custom-tooltip-width';
+import { CustomTooltipCssProperties } from './custom-tooltip-css-properties';
 import { DisabledInteractiveElements } from './disabled-interactive-elements';
 import { FocusElements } from './focus-elements';
 import { InputGroupWithError } from './input-group-with-error';
@@ -11,12 +11,14 @@ import { StaticForm } from './static-form';
 import { TableHorizontalScrollAdvanced } from './horizontal-scrollbar-advanced';
 import { ToolbarItemOrder } from './toolbar-item-order';
 import { TooltipPositioning } from './tooltip-positioning';
+import { DateInForm } from './date-in-form';
 
 export const SCENARIO_ROUTES: Routes = {
 	scenarios: {
 		'appointment-form': AppointmentForm,
 		'change-tabindex': ChangeTabindex,
-		'custom-tooltip-width': CustomTooltipWidth,
+		'custom-tooltip-css-properties': CustomTooltipCssProperties,
+		'date-in-form': DateInForm,
 		'disabled-interactive-scenario': DisabledInteractiveElements,
 		'focus-elements': FocusElements,
 		'input-group-with-error': InputGroupWithError,

package/dist/assets/badge-text-553534d4-CMC8YLDf.js

@@ -1,4 +0,0 @@
-import{t as e}from"./index-7WRSZKTT.js";/*!
- * KoliBri - The accessible HTML-Standard
- */const r=(t,a)=>{e(t,"_badgeText",a)};export{r as v};
-//# sourceMappingURL=badge-text-553534d4-CMC8YLDf.js.map

package/dist/assets/controller-c87b8bd9-CFkAiCfW.js

@@ -1,4 +0,0 @@
-import{q as a,W as f,t as l,C as g,s as p,o as _,p as u,w as v,i as y,D as m}from"./index-7WRSZKTT.js";import{s as r,t as s}from"./events-29e84d75-BhxFwhXP.js";import{A as b}from"./associated.controller-d302adf7-CA_utPAF.js";import{v as C,a as d,b as H,c as L}from"./access-and-short-key-914780a7-D_amaVwB.js";import{v as A}from"./hide-label-0d754c8e-boPBSzV4.js";import{a as E}from"./label-7d1ce375-BFrJRMqI.js";import{v as I}from"./tooltip-align-6964dd71-32NcQL5L.js";/*!
- * KoliBri - The accessible HTML-Standard
- */const K=(i,t)=>{a(i,"_adjustHeight",t)},B=(i,t,o)=>{a(i,"_hideError",t,o)},S=(i,t)=>{_(t,()=>{try{t=u(t)}catch{}v(i,"_msg",o=>y(o)&&typeof o?._description=="string",new Set(["MsgPropType"]),t,{defaultValue:{_description:"",_type:"error"}})})},x=(i,t)=>{a(i,"_touched",t)},P=i=>{var t,o;const e=!!(((t=i._msg)===null||t===void 0?void 0:t._type)==="error"&&i._msg._description&&((o=i._msg._description)===null||o===void 0?void 0:o.length)>0)&&i._touched===!0,c=typeof i._hint=="string"&&i._hint.length>0,h=[];return e===!0&&h.push(`${i._id}-error`),c===!0&&h.push(`${i._id}-hint`),{hasError:e,hasHint:c,ariaDescribedBy:h}};class T extends b{constructor(t,o,n){super(t,o,n),this.component=t}validateAlert(t){a(this.component,"_alert",t)}validateTouched(t){x(this.component,t)}componentWillLoad(){super.componentWillLoad(),this.validateAlert(this.component._alert),this.validateTouched(this.component._touched)}}class V extends T{constructor(t,o,n){super(t,o,n),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)},this.component=t}validateAccessKey(t){C(this.component,t),d(t,this.component._shortKey)}validateAdjustHeight(t){K(this.component,t)}validateDisabled(t){a(this.component,"_disabled",t),t===!0&&f()}validateTooltipAlign(t){I(this.component,t)}validateError(t){typeof t=="string"&&t.length>0?this.validateMsg({_description:t,_type:"error"}):this.validateMsg(void 0)}validateHideError(t){B(this.component,t,{hooks:{afterPatch:()=>{this.component.state._hideError&&m("Property hide-error for inputs: Only use when the error message is shown outside of the input component.")}}})}validateHideLabel(t){A(this.component,t,{hooks:{afterPatch:()=>{this.component.state._hideLabel&&m("Property hide-label for inputs: Only use for exceptions like search inputs that are clearly identifiable by their context.")}}})}validateHint(t){l(this.component,"_hint",t)}validateId(t){l(this.component,"_id",t,{minLength:1}),(t===""||typeof t>"u")&&g("A unique ID on the input fields is not strictly required, but it might be relevant for E2E tests.")}validateLabel(t){E(this.component,t,{required:!0})}validateMsg(t){S(this.component,t)}validateOn(t){typeof t=="object"&&p(this.component,"_on",t)}validateShortKey(t){H(this.component,t),d(this.component._accessKey,t)}validateSmartButton(t){_(t,()=>{try{t=u(t)}catch{}p(this.component,"_smartButton",t)})}validateTabIndex(t){L(this.component,t)}componentWillLoad(){super.componentWillLoad(),this.validateAccessKey(this.component._accessKey),this.validateAdjustHeight(this.component._adjustHeight),this.validateError(this.component._error),this.component._msg&&this.validateMsg(this.component._msg),this.validateDisabled(this.component._disabled),this.validateHideError(this.component._hideError),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),d(this.component._accessKey,this.component._shortKey)}onBlur(t){var o;this.component._touched=!0,r(t),s("blur",this.host),typeof((o=this.component._on)===null||o===void 0?void 0:o.onBlur)=="function"&&this.component._on.onBlur(t)}onChange(t,o){var n;o=o??t.target.value,s("change",this.host,o),typeof((n=this.component._on)===null||n===void 0?void 0:n.onChange)=="function"&&this.component._on.onChange(t,o),this.valueChangeListeners.forEach(e=>e(o))}onInput(t,o=!0,n){var e;n=n??t.target.value,r(t),s("input",this.host,n),o&&this.setFormAssociatedValue(n),typeof((e=this.component._on)===null||e===void 0?void 0:e.onInput)=="function"&&this.component._on.onInput(t,n)}onClick(t){var o;r(t),s("click",this.host),typeof((o=this.component._on)===null||o===void 0?void 0:o.onClick)=="function"&&this.component._on.onClick(t)}onFocus(t){var o;r(t),s("focus",this.host),typeof((o=this.component._on)===null||o===void 0?void 0:o.onFocus)=="function"&&this.component._on.onFocus(t)}addValueChangeListener(t){this.valueChangeListeners.push(t)}}export{V as I,P as g};
-//# sourceMappingURL=controller-c87b8bd9-CFkAiCfW.js.map

package/dist/assets/controller-c87b8bd9-CFkAiCfW.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"controller-c87b8bd9-CFkAiCfW.js","sources":["../../../../components/dist/esm/controller-c87b8bd9.js"],"sourcesContent":["/*!\n * KoliBri - The accessible HTML-Standard\n */\nimport { j as watchBoolean, o as objectObjectHandler, l as parseJson, w as watchValidator, i as isObject, k as a11yHintDisabled, f as a11yHint, y as watchString, C as devHint, m as setState } from './index-7a63e9eb.js';\nimport { s as stopPropagation, t as tryToDispatchKoliBriEvent } from './events-29e84d75.js';\nimport { A as AssociatedInputController } from './associated.controller-d302adf7.js';\nimport { v as validateAccessKey, a as validateAccessAndShortKey, b as validateShortKey, c as validateTabIndex } from './access-and-short-key-914780a7.js';\nimport { v as validateHideLabel } from './hide-label-0d754c8e.js';\nimport { a as validateLabelWithExpertSlot } from './label-7d1ce375.js';\nimport { v as validateTooltipAlign } from './tooltip-align-6964dd71.js';\n\nconst validateAdjustHeight = (component, value) => {\n    watchBoolean(component, '_adjustHeight', value);\n};\n\nconst validateHideError = (component, value, options) => {\n    watchBoolean(component, '_hideError', value, options);\n};\n\nconst validateMsg = (component, value) => {\n    objectObjectHandler(value, () => {\n        try {\n            value = parseJson(value);\n        }\n        catch (e) {\n        }\n        watchValidator(component, `_msg`, (value) => isObject(value) && typeof (value === null || value === void 0 ? void 0 : value._description) === 'string', new Set(['MsgPropType']), value, {\n            defaultValue: {\n                _description: '',\n                _type: 'error',\n            },\n        });\n    });\n};\n\nconst validateTouched = (component, value) => {\n    watchBoolean(component, '_touched', value);\n};\n\nconst getRenderStates = (state) => {\n    var _a, _b;\n    const isMessageValidError = Boolean(((_a = state._msg) === null || _a === void 0 ? void 0 : _a._type) === 'error' && state._msg._description && ((_b = state._msg._description) === null || _b === void 0 ? void 0 : _b.length) > 0);\n    const hasError = isMessageValidError && state._touched === true;\n    const hasHint = typeof state._hint === 'string' && state._hint.length > 0;\n    const ariaDescribedBy = [];\n    if (hasError === true) {\n        ariaDescribedBy.push(`${state._id}-error`);\n    }\n    if (hasHint === true) {\n        ariaDescribedBy.push(`${state._id}-hint`);\n    }\n    return { hasError, hasHint, ariaDescribedBy };\n};\n\nclass ControlledInputController extends AssociatedInputController {\n    constructor(component, name, host) {\n        super(component, name, host);\n        this.component = component;\n    }\n    validateAlert(value) {\n        watchBoolean(this.component, '_alert', value);\n    }\n    validateTouched(value) {\n        validateTouched(this.component, value);\n    }\n    componentWillLoad() {\n        super.componentWillLoad();\n        this.validateAlert(this.component._alert);\n        this.validateTouched(this.component._touched);\n    }\n}\n\nclass InputController extends ControlledInputController {\n    constructor(component, name, host) {\n        super(component, name, host);\n        this.valueChangeListeners = [];\n        this.onFacade = {\n            onBlur: this.onBlur.bind(this),\n            onChange: this.onChange.bind(this),\n            onClick: this.onClick.bind(this),\n            onFocus: this.onFocus.bind(this),\n            onInput: this.onInput.bind(this),\n        };\n        this.component = component;\n    }\n    validateAccessKey(value) {\n        validateAccessKey(this.component, value);\n        validateAccessAndShortKey(value, this.component._shortKey);\n    }\n    validateAdjustHeight(value) {\n        validateAdjustHeight(this.component, value);\n    }\n    validateDisabled(value) {\n        watchBoolean(this.component, '_disabled', value);\n        if (value === true) {\n            a11yHintDisabled();\n        }\n    }\n    validateTooltipAlign(value) {\n        validateTooltipAlign(this.component, value);\n    }\n    validateError(value) {\n        if (typeof value === 'string' && value.length > 0) {\n            this.validateMsg({\n                _description: value,\n                _type: 'error',\n            });\n        }\n        else {\n            this.validateMsg(undefined);\n        }\n    }\n    validateHideError(value) {\n        validateHideError(this.component, value, {\n            hooks: {\n                afterPatch: () => {\n                    if (this.component.state._hideError) {\n                        a11yHint('Property hide-error for inputs: Only use when the error message is shown outside of the input component.');\n                    }\n                },\n            },\n        });\n    }\n    validateHideLabel(value) {\n        validateHideLabel(this.component, value, {\n            hooks: {\n                afterPatch: () => {\n                    if (this.component.state._hideLabel) {\n                        a11yHint('Property hide-label for inputs: Only use for exceptions like search inputs that are clearly identifiable by their context.');\n                    }\n                },\n            },\n        });\n    }\n    validateHint(value) {\n        watchString(this.component, '_hint', value);\n    }\n    validateId(value) {\n        watchString(this.component, '_id', value, { minLength: 1 });\n        if (value === '' || typeof value === 'undefined') {\n            devHint(`A unique ID on the input fields is not strictly required, but it might be relevant for E2E tests.`);\n        }\n    }\n    validateLabel(value) {\n        validateLabelWithExpertSlot(this.component, value, {\n            required: true,\n        });\n    }\n    validateMsg(value) {\n        validateMsg(this.component, value);\n    }\n    validateOn(value) {\n        if (typeof value === 'object') {\n            setState(this.component, '_on', value);\n        }\n    }\n    validateShortKey(value) {\n        validateShortKey(this.component, value);\n        validateAccessAndShortKey(this.component._accessKey, value);\n    }\n    validateSmartButton(value) {\n        objectObjectHandler(value, () => {\n            try {\n                value = parseJson(value);\n            }\n            catch (e) {\n            }\n            setState(this.component, '_smartButton', value);\n        });\n    }\n    validateTabIndex(value) {\n        validateTabIndex(this.component, value);\n    }\n    componentWillLoad() {\n        super.componentWillLoad();\n        this.validateAccessKey(this.component._accessKey);\n        this.validateAdjustHeight(this.component._adjustHeight);\n        this.validateError(this.component._error);\n        if (this.component._msg) {\n            this.validateMsg(this.component._msg);\n        }\n        this.validateDisabled(this.component._disabled);\n        this.validateHideError(this.component._hideError);\n        this.validateHideLabel(this.component._hideLabel);\n        this.validateHint(this.component._hint);\n        this.validateId(this.component._id);\n        this.validateLabel(this.component._label);\n        this.validateShortKey(this.component._shortKey);\n        this.validateSmartButton(this.component._smartButton);\n        this.validateOn(this.component._on);\n        this.validateTabIndex(this.component._tabIndex);\n        validateAccessAndShortKey(this.component._accessKey, this.component._shortKey);\n    }\n    onBlur(event) {\n        var _a;\n        this.component._touched = true;\n        stopPropagation(event);\n        tryToDispatchKoliBriEvent('blur', this.host);\n        if (typeof ((_a = this.component._on) === null || _a === void 0 ? void 0 : _a.onBlur) === 'function') {\n            this.component._on.onBlur(event);\n        }\n    }\n    onChange(event, value) {\n        var _a;\n        value = value !== null && value !== void 0 ? value : event.target.value;\n        tryToDispatchKoliBriEvent('change', this.host, value);\n        if (typeof ((_a = this.component._on) === null || _a === void 0 ? void 0 : _a.onChange) === 'function') {\n            this.component._on.onChange(event, value);\n        }\n        this.valueChangeListeners.forEach((listener) => listener(value));\n    }\n    onInput(event, shouldSetFormAssociatedValue = true, value) {\n        var _a;\n        value = value !== null && value !== void 0 ? value : event.target.value;\n        stopPropagation(event);\n        tryToDispatchKoliBriEvent('input', this.host, value);\n        if (shouldSetFormAssociatedValue) {\n            this.setFormAssociatedValue(value);\n        }\n        if (typeof ((_a = this.component._on) === null || _a === void 0 ? void 0 : _a.onInput) === 'function') {\n            this.component._on.onInput(event, value);\n        }\n    }\n    onClick(event) {\n        var _a;\n        stopPropagation(event);\n        tryToDispatchKoliBriEvent('click', this.host);\n        if (typeof ((_a = this.component._on) === null || _a === void 0 ? void 0 : _a.onClick) === 'function') {\n            this.component._on.onClick(event);\n        }\n    }\n    onFocus(event) {\n        var _a;\n        stopPropagation(event);\n        tryToDispatchKoliBriEvent('focus', this.host);\n        if (typeof ((_a = this.component._on) === null || _a === void 0 ? void 0 : _a.onFocus) === 'function') {\n            this.component._on.onFocus(event);\n        }\n    }\n    addValueChangeListener(listener) {\n        this.valueChangeListeners.push(listener);\n    }\n}\n\nexport { InputController as I, getRenderStates as g };\n\n//# sourceMappingURL=controller-c87b8bd9.js.map"],"names":["validateAdjustHeight","component","value","watchBoolean","validateHideError","options","validateMsg","objectObjectHandler","parseJson","watchValidator","isObject","validateTouched","getRenderStates","state","_a","_b","hasError","hasHint","ariaDescribedBy","ControlledInputController","AssociatedInputController","name","host","InputController","validateAccessKey","validateAccessAndShortKey","a11yHintDisabled","validateTooltipAlign","a11yHint","validateHideLabel","watchString","devHint","validateLabelWithExpertSlot","setState","validateShortKey","validateTabIndex","event","stopPropagation","tryToDispatchKoliBriEvent","listener","shouldSetFormAssociatedValue"],"mappings":"sdAAA;AAAA;AAAA,GAWA,MAAMA,EAAuB,CAACC,EAAWC,IAAU,CAC/CC,EAAaF,EAAW,gBAAiBC,CAAK,CAClD,EAEME,EAAoB,CAACH,EAAWC,EAAOG,IAAY,CACrDF,EAAaF,EAAW,aAAcC,EAAOG,CAAO,CACxD,EAEMC,EAAc,CAACL,EAAWC,IAAU,CACtCK,EAAoBL,EAAO,IAAM,CAC7B,GAAI,CACAA,EAAQM,EAAUN,CAAK,CAC3B,MACU,CACV,CACAO,EAAeR,EAAW,OAASC,GAAUQ,EAASR,CAAK,GAAK,OAAsDA,GAAM,cAAkB,SAAU,IAAI,IAAI,CAAC,aAAa,CAAC,EAAGA,EAAO,CACrL,aAAc,CACV,aAAc,GACd,MAAO,OACvB,CACA,CAAS,CACL,CAAC,CACL,EAEMS,EAAkB,CAACV,EAAWC,IAAU,CAC1CC,EAAaF,EAAW,WAAYC,CAAK,CAC7C,EAEMU,EAAmBC,GAAU,CAC/B,IAAIC,EAAIC,EAER,MAAMC,EADsB,KAAUF,EAAKD,EAAM,QAAU,MAAQC,IAAO,OAAS,OAASA,EAAG,SAAW,SAAWD,EAAM,KAAK,gBAAkBE,EAAKF,EAAM,KAAK,gBAAkB,MAAQE,IAAO,OAAS,OAASA,EAAG,QAAU,IAC1LF,EAAM,WAAa,GACrDI,EAAU,OAAOJ,EAAM,OAAU,UAAYA,EAAM,MAAM,OAAS,EAClEK,EAAkB,CAAA,EACxB,OAAIF,IAAa,IACbE,EAAgB,KAAK,GAAGL,EAAM,GAAG,QAAQ,EAEzCI,IAAY,IACZC,EAAgB,KAAK,GAAGL,EAAM,GAAG,OAAO,EAErC,CAAE,SAAAG,EAAU,QAAAC,EAAS,gBAAAC,CAAe,CAC/C,EAEA,MAAMC,UAAkCC,CAA0B,CAC9D,YAAYnB,EAAWoB,EAAMC,EAAM,CAC/B,MAAMrB,EAAWoB,EAAMC,CAAI,EAC3B,KAAK,UAAYrB,CACrB,CACA,cAAcC,EAAO,CACjBC,EAAa,KAAK,UAAW,SAAUD,CAAK,CAChD,CACA,gBAAgBA,EAAO,CACnBS,EAAgB,KAAK,UAAWT,CAAK,CACzC,CACA,mBAAoB,CAChB,MAAM,kBAAiB,EACvB,KAAK,cAAc,KAAK,UAAU,MAAM,EACxC,KAAK,gBAAgB,KAAK,UAAU,QAAQ,CAChD,CACJ,CAEA,MAAMqB,UAAwBJ,CAA0B,CACpD,YAAYlB,EAAWoB,EAAMC,EAAM,CAC/B,MAAMrB,EAAWoB,EAAMC,CAAI,EAC3B,KAAK,qBAAuB,CAAA,EAC5B,KAAK,SAAW,CACZ,OAAQ,KAAK,OAAO,KAAK,IAAI,EAC7B,SAAU,KAAK,SAAS,KAAK,IAAI,EACjC,QAAS,KAAK,QAAQ,KAAK,IAAI,EAC/B,QAAS,KAAK,QAAQ,KAAK,IAAI,EAC/B,QAAS,KAAK,QAAQ,KAAK,IAAI,CAC3C,EACQ,KAAK,UAAYrB,CACrB,CACA,kBAAkBC,EAAO,CACrBsB,EAAkB,KAAK,UAAWtB,CAAK,EACvCuB,EAA0BvB,EAAO,KAAK,UAAU,SAAS,CAC7D,CACA,qBAAqBA,EAAO,CACxBF,EAAqB,KAAK,UAAWE,CAAK,CAC9C,CACA,iBAAiBA,EAAO,CACpBC,EAAa,KAAK,UAAW,YAAaD,CAAK,EAC3CA,IAAU,IACVwB,EAAgB,CAExB,CACA,qBAAqBxB,EAAO,CACxByB,EAAqB,KAAK,UAAWzB,CAAK,CAC9C,CACA,cAAcA,EAAO,CACb,OAAOA,GAAU,UAAYA,EAAM,OAAS,EAC5C,KAAK,YAAY,CACb,aAAcA,EACd,MAAO,OACvB,CAAa,EAGD,KAAK,YAAY,MAAS,CAElC,CACA,kBAAkBA,EAAO,CACrBE,EAAkB,KAAK,UAAWF,EAAO,CACrC,MAAO,CACH,WAAY,IAAM,CACV,KAAK,UAAU,MAAM,YACrB0B,EAAS,0GAA0G,CAE3H,CAChB,CACA,CAAS,CACL,CACA,kBAAkB1B,EAAO,CACrB2B,EAAkB,KAAK,UAAW3B,EAAO,CACrC,MAAO,CACH,WAAY,IAAM,CACV,KAAK,UAAU,MAAM,YACrB0B,EAAS,4HAA4H,CAE7I,CAChB,CACA,CAAS,CACL,CACA,aAAa1B,EAAO,CAChB4B,EAAY,KAAK,UAAW,QAAS5B,CAAK,CAC9C,CACA,WAAWA,EAAO,CACd4B,EAAY,KAAK,UAAW,MAAO5B,EAAO,CAAE,UAAW,EAAG,GACtDA,IAAU,IAAM,OAAOA,EAAU,MACjC6B,EAAQ,mGAAmG,CAEnH,CACA,cAAc7B,EAAO,CACjB8B,EAA4B,KAAK,UAAW9B,EAAO,CAC/C,SAAU,EACtB,CAAS,CACL,CACA,YAAYA,EAAO,CACfI,EAAY,KAAK,UAAWJ,CAAK,CACrC,CACA,WAAWA,EAAO,CACV,OAAOA,GAAU,UACjB+B,EAAS,KAAK,UAAW,MAAO/B,CAAK,CAE7C,CACA,iBAAiBA,EAAO,CACpBgC,EAAiB,KAAK,UAAWhC,CAAK,EACtCuB,EAA0B,KAAK,UAAU,WAAYvB,CAAK,CAC9D,CACA,oBAAoBA,EAAO,CACvBK,EAAoBL,EAAO,IAAM,CAC7B,GAAI,CACAA,EAAQM,EAAUN,CAAK,CAC3B,MACU,CACV,CACA+B,EAAS,KAAK,UAAW,eAAgB/B,CAAK,CAClD,CAAC,CACL,CACA,iBAAiBA,EAAO,CACpBiC,EAAiB,KAAK,UAAWjC,CAAK,CAC1C,CACA,mBAAoB,CAChB,MAAM,kBAAiB,EACvB,KAAK,kBAAkB,KAAK,UAAU,UAAU,EAChD,KAAK,qBAAqB,KAAK,UAAU,aAAa,EACtD,KAAK,cAAc,KAAK,UAAU,MAAM,EACpC,KAAK,UAAU,MACf,KAAK,YAAY,KAAK,UAAU,IAAI,EAExC,KAAK,iBAAiB,KAAK,UAAU,SAAS,EAC9C,KAAK,kBAAkB,KAAK,UAAU,UAAU,EAChD,KAAK,kBAAkB,KAAK,UAAU,UAAU,EAChD,KAAK,aAAa,KAAK,UAAU,KAAK,EACtC,KAAK,WAAW,KAAK,UAAU,GAAG,EAClC,KAAK,cAAc,KAAK,UAAU,MAAM,EACxC,KAAK,iBAAiB,KAAK,UAAU,SAAS,EAC9C,KAAK,oBAAoB,KAAK,UAAU,YAAY,EACpD,KAAK,WAAW,KAAK,UAAU,GAAG,EAClC,KAAK,iBAAiB,KAAK,UAAU,SAAS,EAC9CuB,EAA0B,KAAK,UAAU,WAAY,KAAK,UAAU,SAAS,CACjF,CACA,OAAOW,EAAO,CACV,IAAItB,EACJ,KAAK,UAAU,SAAW,GAC1BuB,EAAgBD,CAAK,EACrBE,EAA0B,OAAQ,KAAK,IAAI,EACvC,QAASxB,EAAK,KAAK,UAAU,OAAS,MAAQA,IAAO,OAAS,OAASA,EAAG,SAAY,YACtF,KAAK,UAAU,IAAI,OAAOsB,CAAK,CAEvC,CACA,SAASA,EAAOlC,EAAO,CACnB,IAAIY,EACJZ,EAAQA,GAA6CkC,EAAM,OAAO,MAClEE,EAA0B,SAAU,KAAK,KAAMpC,CAAK,EAChD,QAASY,EAAK,KAAK,UAAU,OAAS,MAAQA,IAAO,OAAS,OAASA,EAAG,WAAc,YACxF,KAAK,UAAU,IAAI,SAASsB,EAAOlC,CAAK,EAE5C,KAAK,qBAAqB,QAASqC,GAAaA,EAASrC,CAAK,CAAC,CACnE,CACA,QAAQkC,EAAOI,EAA+B,GAAMtC,EAAO,CACvD,IAAIY,EACJZ,EAAQA,GAA6CkC,EAAM,OAAO,MAClEC,EAAgBD,CAAK,EACrBE,EAA0B,QAAS,KAAK,KAAMpC,CAAK,EAC/CsC,GACA,KAAK,uBAAuBtC,CAAK,EAEjC,QAASY,EAAK,KAAK,UAAU,OAAS,MAAQA,IAAO,OAAS,OAASA,EAAG,UAAa,YACvF,KAAK,UAAU,IAAI,QAAQsB,EAAOlC,CAAK,CAE/C,CACA,QAAQkC,EAAO,CACX,IAAItB,EACJuB,EAAgBD,CAAK,EACrBE,EAA0B,QAAS,KAAK,IAAI,EACxC,QAASxB,EAAK,KAAK,UAAU,OAAS,MAAQA,IAAO,OAAS,OAASA,EAAG,UAAa,YACvF,KAAK,UAAU,IAAI,QAAQsB,CAAK,CAExC,CACA,QAAQA,EAAO,CACX,IAAItB,EACJuB,EAAgBD,CAAK,EACrBE,EAA0B,QAAS,KAAK,IAAI,EACxC,QAASxB,EAAK,KAAK,UAAU,OAAS,MAAQA,IAAO,OAAS,OAASA,EAAG,UAAa,YACvF,KAAK,UAAU,IAAI,QAAQsB,CAAK,CAExC,CACA,uBAAuBG,EAAU,CAC7B,KAAK,qBAAqB,KAAKA,CAAQ,CAC3C,CACJ"}

package/dist/assets/has-closer-602527ae-KyGw3ri5.js

@@ -1,4 +0,0 @@
-import{q as s}from"./index-7WRSZKTT.js";/*!
- * KoliBri - The accessible HTML-Standard
- */const r=(a,o)=>{s(a,"_hasCloser",o)};export{r as v};
-//# sourceMappingURL=has-closer-602527ae-KyGw3ri5.js.map

package/dist/assets/image-source-d9230e9b-C8Ni--uD.js

@@ -1,4 +0,0 @@
-import{t as o}from"./index-7WRSZKTT.js";/*!
- * KoliBri - The accessible HTML-Standard
- */const e=(t,a,r)=>{o(t,"_src",a,r)};export{e as v};
-//# sourceMappingURL=image-source-d9230e9b-C8Ni--uD.js.map