@public-ui/components 4.3.0-rc.4 → 4.3.0-rc.5

package/dist/cjs/{FieldControlStateWrapper-Bk7dzX2j.js.map → FieldControlStateWrapper-DvTOhqxy.js.map}

@@ -1 +1 @@
-{"version":3,"file":"FieldControlStateWrapper-Bk7dzX2j.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":["TooltipController","BaseWebComponent","__rest","h","clsx","showExpertSlot","buildBadgeTextString","createRelatedUniqueId","Fragment","TooltipFC","KolFieldControlLabelFc","getMsgType","isMsgDefinedAndInputTouched","KolFieldControlHintFc"],"mappings":"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"}
+{"version":3,"file":"FieldControlStateWrapper-DvTOhqxy.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":["TooltipController","BaseWebComponent","__rest","h","clsx","showExpertSlot","buildBadgeTextString","createRelatedUniqueId","Fragment","TooltipFC","KolFieldControlLabelFc","getMsgType","isMsgDefinedAndInputTouched","KolFieldControlHintFc"],"mappings":"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"}

package/dist/cjs/{FormFieldStateWrapper-BY2eAAId.js → FormFieldStateWrapper-W-QMTbkj.js}

@@ -9,345 +9,19 @@ var disabled = require('./disabled-BmL4XZF8.js');
 var hideLabel = require('./hide-label-B2pYm5fg.js');
 var label = require('./label-Dx1QO2M-.js');
 var tooltipAlign = require('./tooltip-align-BhNmQDKW.js');
-var variantClassName = require('./variant-class-name-DmO450Cb.js');
+var variantClassName = require('./variant-class-name-CU8UMVYZ.js');
 var events = require('./events-DN9qldnr.js');
-var associated_controller = require('./associated.controller-vEJJMkrY.js');
-var _Uint8Array = require('./_Uint8Array-BAQUGozM.js');
-var isArray = require('./isArray-BOIOdEQh.js');
+var associated_controller = require('./associated.controller-BU1y6IQj.js');
 var tslib_es6 = require('./tslib.es6-Cm0ytgPY.js');
-var index = require('./index-BSJggleu.js');
-var baseWebComponent = require('./base-web-component-DP6_UGyy.js');
-var component$1 = require('./component-nn9xKYx0.js');
-var controller = require('./controller-DOOIStgs.js');
-var component = require('./component-DTdxTGTB.js');
+var index = require('./index-DhVkdQYo.js');
+var i18n = require('./i18n-Cp31h8Qy.js');
+var baseWebComponent = require('./base-web-component-BPX1rer4.js');
+var component$1 = require('./component-Cg9QDytI.js');
+var controller = require('./controller-BEjeYvvc.js');
+var component = require('./component-ChMyM8VK.js');
 var clsx = require('./clsx-Bm_HQUnh.js');
-var dev_utils = require('./dev.utils-Dyp3JZWV.js');
-var i18n = require('./i18n-tEETJDrM.js');
-var Alert = require('./Alert-C3sKH6fH.js');
-
-/** `Object#toString` result references. */
-var symbolTag = '[object Symbol]';
-
-/**
- * Checks if `value` is classified as a `Symbol` primitive or object.
- *
- * @static
- * @memberOf _
- * @since 4.0.0
- * @category Lang
- * @param {*} value The value to check.
- * @returns {boolean} Returns `true` if `value` is a symbol, else `false`.
- * @example
- *
- * _.isSymbol(Symbol.iterator);
- * // => true
- *
- * _.isSymbol('abc');
- * // => false
- */
-function isSymbol(value) {
-  return typeof value == 'symbol' ||
-    (isArray.isObjectLike(value) && isArray.baseGetTag(value) == symbolTag);
-}
-
-/** Used to match a single whitespace character. */
-var reWhitespace = /\s/;
-
-/**
- * Used by `_.trim` and `_.trimEnd` to get the index of the last non-whitespace
- * character of `string`.
- *
- * @private
- * @param {string} string The string to inspect.
- * @returns {number} Returns the index of the last non-whitespace character.
- */
-function trimmedEndIndex(string) {
-  var index = string.length;
-
-  while (index-- && reWhitespace.test(string.charAt(index))) {}
-  return index;
-}
-
-/** Used to match leading whitespace. */
-var reTrimStart = /^\s+/;
-
-/**
- * The base implementation of `_.trim`.
- *
- * @private
- * @param {string} string The string to trim.
- * @returns {string} Returns the trimmed string.
- */
-function baseTrim(string) {
-  return string
-    ? string.slice(0, trimmedEndIndex(string) + 1).replace(reTrimStart, '')
-    : string;
-}
-
-/** Used as references for various `Number` constants. */
-var NAN = 0 / 0;
-
-/** Used to detect bad signed hexadecimal string values. */
-var reIsBadHex = /^[-+]0x[0-9a-f]+$/i;
-
-/** Used to detect binary string values. */
-var reIsBinary = /^0b[01]+$/i;
-
-/** Used to detect octal string values. */
-var reIsOctal = /^0o[0-7]+$/i;
-
-/** Built-in method references without a dependency on `root`. */
-var freeParseInt = parseInt;
-
-/**
- * Converts `value` to a number.
- *
- * @static
- * @memberOf _
- * @since 4.0.0
- * @category Lang
- * @param {*} value The value to process.
- * @returns {number} Returns the number.
- * @example
- *
- * _.toNumber(3.2);
- * // => 3.2
- *
- * _.toNumber(Number.MIN_VALUE);
- * // => 5e-324
- *
- * _.toNumber(Infinity);
- * // => Infinity
- *
- * _.toNumber('3.2');
- * // => 3.2
- */
-function toNumber(value) {
-  if (typeof value == 'number') {
-    return value;
-  }
-  if (isSymbol(value)) {
-    return NAN;
-  }
-  if (_Uint8Array.isObject(value)) {
-    var other = typeof value.valueOf == 'function' ? value.valueOf() : value;
-    value = _Uint8Array.isObject(other) ? (other + '') : other;
-  }
-  if (typeof value != 'string') {
-    return value === 0 ? value : +value;
-  }
-  value = baseTrim(value);
-  var isBinary = reIsBinary.test(value);
-  return (isBinary || reIsOctal.test(value))
-    ? freeParseInt(value.slice(2), isBinary ? 2 : 8)
-    : (reIsBadHex.test(value) ? NAN : +value);
-}
-
-/**
- * Gets the timestamp of the number of milliseconds that have elapsed since
- * the Unix epoch (1 January 1970 00:00:00 UTC).
- *
- * @static
- * @memberOf _
- * @since 2.4.0
- * @category Date
- * @returns {number} Returns the timestamp.
- * @example
- *
- * _.defer(function(stamp) {
- *   console.log(_.now() - stamp);
- * }, _.now());
- * // => Logs the number of milliseconds it took for the deferred invocation.
- */
-var now = function() {
-  return isArray.root.Date.now();
-};
-
-/** Error message constants. */
-var FUNC_ERROR_TEXT = 'Expected a function';
-
-/* Built-in method references for those with the same name as other `lodash` methods. */
-var nativeMax = Math.max,
-    nativeMin = Math.min;
-
-/**
- * Creates a debounced function that delays invoking `func` until after `wait`
- * milliseconds have elapsed since the last time the debounced function was
- * invoked. The debounced function comes with a `cancel` method to cancel
- * delayed `func` invocations and a `flush` method to immediately invoke them.
- * Provide `options` to indicate whether `func` should be invoked on the
- * leading and/or trailing edge of the `wait` timeout. The `func` is invoked
- * with the last arguments provided to the debounced function. Subsequent
- * calls to the debounced function return the result of the last `func`
- * invocation.
- *
- * **Note:** If `leading` and `trailing` options are `true`, `func` is
- * invoked on the trailing edge of the timeout only if the debounced function
- * is invoked more than once during the `wait` timeout.
- *
- * If `wait` is `0` and `leading` is `false`, `func` invocation is deferred
- * until to the next tick, similar to `setTimeout` with a timeout of `0`.
- *
- * See [David Corbacho's article](https://css-tricks.com/debouncing-throttling-explained-examples/)
- * for details over the differences between `_.debounce` and `_.throttle`.
- *
- * @static
- * @memberOf _
- * @since 0.1.0
- * @category Function
- * @param {Function} func The function to debounce.
- * @param {number} [wait=0] The number of milliseconds to delay.
- * @param {Object} [options={}] The options object.
- * @param {boolean} [options.leading=false]
- *  Specify invoking on the leading edge of the timeout.
- * @param {number} [options.maxWait]
- *  The maximum time `func` is allowed to be delayed before it's invoked.
- * @param {boolean} [options.trailing=true]
- *  Specify invoking on the trailing edge of the timeout.
- * @returns {Function} Returns the new debounced function.
- * @example
- *
- * // Avoid costly calculations while the window size is in flux.
- * jQuery(window).on('resize', _.debounce(calculateLayout, 150));
- *
- * // Invoke `sendMail` when clicked, debouncing subsequent calls.
- * jQuery(element).on('click', _.debounce(sendMail, 300, {
- *   'leading': true,
- *   'trailing': false
- * }));
- *
- * // Ensure `batchLog` is invoked once after 1 second of debounced calls.
- * var debounced = _.debounce(batchLog, 250, { 'maxWait': 1000 });
- * var source = new EventSource('/stream');
- * jQuery(source).on('message', debounced);
- *
- * // Cancel the trailing debounced invocation.
- * jQuery(window).on('popstate', debounced.cancel);
- */
-function debounce(func, wait, options) {
-  var lastArgs,
-      lastThis,
-      maxWait,
-      result,
-      timerId,
-      lastCallTime,
-      lastInvokeTime = 0,
-      leading = false,
-      maxing = false,
-      trailing = true;
-
-  if (typeof func != 'function') {
-    throw new TypeError(FUNC_ERROR_TEXT);
-  }
-  wait = toNumber(wait) || 0;
-  if (_Uint8Array.isObject(options)) {
-    leading = !!options.leading;
-    maxing = 'maxWait' in options;
-    maxWait = maxing ? nativeMax(toNumber(options.maxWait) || 0, wait) : maxWait;
-    trailing = 'trailing' in options ? !!options.trailing : trailing;
-  }
-
-  function invokeFunc(time) {
-    var args = lastArgs,
-        thisArg = lastThis;
-
-    lastArgs = lastThis = undefined;
-    lastInvokeTime = time;
-    result = func.apply(thisArg, args);
-    return result;
-  }
-
-  function leadingEdge(time) {
-    // Reset any `maxWait` timer.
-    lastInvokeTime = time;
-    // Start the timer for the trailing edge.
-    timerId = setTimeout(timerExpired, wait);
-    // Invoke the leading edge.
-    return leading ? invokeFunc(time) : result;
-  }
-
-  function remainingWait(time) {
-    var timeSinceLastCall = time - lastCallTime,
-        timeSinceLastInvoke = time - lastInvokeTime,
-        timeWaiting = wait - timeSinceLastCall;
-
-    return maxing
-      ? nativeMin(timeWaiting, maxWait - timeSinceLastInvoke)
-      : timeWaiting;
-  }
-
-  function shouldInvoke(time) {
-    var timeSinceLastCall = time - lastCallTime,
-        timeSinceLastInvoke = time - lastInvokeTime;
-
-    // Either this is the first call, activity has stopped and we're at the
-    // trailing edge, the system time has gone backwards and we're treating
-    // it as the trailing edge, or we've hit the `maxWait` limit.
-    return (lastCallTime === undefined || (timeSinceLastCall >= wait) ||
-      (timeSinceLastCall < 0) || (maxing && timeSinceLastInvoke >= maxWait));
-  }
-
-  function timerExpired() {
-    var time = now();
-    if (shouldInvoke(time)) {
-      return trailingEdge(time);
-    }
-    // Restart the timer.
-    timerId = setTimeout(timerExpired, remainingWait(time));
-  }
-
-  function trailingEdge(time) {
-    timerId = undefined;
-
-    // Only invoke if we have `lastArgs` which means `func` has been
-    // debounced at least once.
-    if (trailing && lastArgs) {
-      return invokeFunc(time);
-    }
-    lastArgs = lastThis = undefined;
-    return result;
-  }
-
-  function cancel() {
-    if (timerId !== undefined) {
-      clearTimeout(timerId);
-    }
-    lastInvokeTime = 0;
-    lastArgs = lastCallTime = lastThis = timerId = undefined;
-  }
-
-  function flush() {
-    return timerId === undefined ? result : trailingEdge(now());
-  }
-
-  function debounced() {
-    var time = now(),
-        isInvoking = shouldInvoke(time);
-
-    lastArgs = arguments;
-    lastThis = this;
-    lastCallTime = time;
-
-    if (isInvoking) {
-      if (timerId === undefined) {
-        return leadingEdge(lastCallTime);
-      }
-      if (maxing) {
-        // Handle invocations in a tight loop.
-        clearTimeout(timerId);
-        timerId = setTimeout(timerExpired, wait);
-        return invokeFunc(lastCallTime);
-      }
-    }
-    if (timerId === undefined) {
-      timerId = setTimeout(timerExpired, wait);
-    }
-    return result;
-  }
-  debounced.cancel = cancel;
-  debounced.flush = flush;
-  return debounced;
-}
+var dev_utils = require('./dev.utils-BvCL1ZhC.js');
+var Alert = require('./Alert-Bc3nD9fM.js');
 
 const validateAdjustHeight = (component, value) => {
     common.watchBoolean(component, '_adjustHeight', value);
@@ -439,9 +113,6 @@ class InputController extends ControlledInputController {
             onInput: this.onInput.bind(this),
             onKeyDown: this.onKeyDown.bind(this),
         };
-        this.updateCurrentLengthDebounced = debounce((length) => {
-            common.setState(this.component, '_currentLengthDebounced', length);
-        }, 500);
         this.component = component;
     }
     validateAccessKey(value) {
@@ -639,9 +310,6 @@ const getRenderStates = (state) => {
     if (hasHint === true) {
         ariaDescribedBy.push(dev_utils.createRelatedUniqueId(state._id, 'hint'));
     }
-    if (state._hasCounter) {
-        ariaDescribedBy.push(dev_utils.createRelatedUniqueId(state._id, 'counter'));
-    }
     if (hasError === true) {
         ariaDescribedBy.push(dev_utils.createRelatedUniqueId(state._id, 'error'));
     }
@@ -664,45 +332,6 @@ const KolFormFieldLabelFc = (_a) => {
     return (index.h(Component, Object.assign({}, other, { class: clsx.clsx(`${baseClassName}__label`, classNames), id: !useTooltipInsteadOfLabel ? dev_utils.createRelatedUniqueId(id, 'label') : undefined, hidden: useTooltipInsteadOfLabel, htmlFor: id }), index.h(component.SpanFC, { class: `${baseClassName}__label-text`, label: hasExpertSlot ? '' : (label !== null && label !== void 0 ? label : ''), badgeText: badgeText }, index.h("slot", { name: "expert" })), !hasExpertSlot && readOnly ? (index.h("span", { class: `${baseClassName}__label__read-only`, "aria-hidden": "true" }, "(", translateReadOnly, ")")) : null));
 };
 
-const KolFormFieldCharacterLimitHintFc = ({ id, maxLength }) => {
-    return (index.h("span", { id: dev_utils.createRelatedUniqueId(id, 'character-limit-hint'), class: "visually-hidden" }, i18n.translate('kol-character-limit-hint', { placeholders: { limit: String(maxLength) } })));
-};
-
-const KolFormFieldCounterFc = ({ currentLength, currentLengthDebounced, maxLength, maxLengthBehavior, id }) => {
-    let visualText;
-    let ariaText;
-    const counterClasses = ['kol-form-field__counter'];
-    if (maxLengthBehavior === 'hard') {
-        visualText =
-            typeof maxLength === 'number'
-                ? i18n.translate('kol-character-counter-current-of-max', { placeholders: { current: String(currentLength), max: String(maxLength) } })
-                : i18n.translate('kol-character-counter-current', { placeholders: { current: String(currentLength) } });
-        ariaText =
-            typeof maxLength === 'number'
-                ? i18n.translate('kol-character-counter-current-of-max-aria', { placeholders: { current: String(currentLengthDebounced), max: String(maxLength) } })
-                : i18n.translate('kol-character-counter-current', { placeholders: { current: String(currentLengthDebounced) } });
-    }
-    else if (typeof maxLength === 'number') {
-        const remainingLive = maxLength - currentLength;
-        const exceededLive = remainingLive < 0;
-        const remainingDebounced = maxLength - currentLengthDebounced;
-        const exceededDebounced = remainingDebounced < 0;
-        visualText = exceededLive
-            ? i18n.translate('kol-character-limit-exceeded', { placeholders: { over: String(Math.abs(remainingLive)) } })
-            : i18n.translate('kol-character-limit-remaining', { placeholders: { remaining: String(remainingLive) } });
-        ariaText = exceededDebounced
-            ? i18n.translate('kol-character-limit-exceeded', { placeholders: { over: String(Math.abs(remainingDebounced)) } })
-            : i18n.translate('kol-character-limit-remaining', { placeholders: { remaining: String(remainingDebounced) } });
-        if (exceededLive) {
-            counterClasses.push('kol-form-field__counter--exceeded');
-        }
-    }
-    else {
-        return null;
-    }
-    return (index.h(index.Fragment, null, index.h("span", { class: clsx.clsx(counterClasses), "aria-hidden": "true", "data-testid": "input-counter" }, visualText), index.h("span", { id: dev_utils.createRelatedUniqueId(id || '', 'counter'), "aria-live": "polite", class: "visually-hidden", "data-testid": "input-counter-aria" }, ariaText)));
-};
-
 const FormFieldMsgFc = (_a) => {
     var _b, _c;
     var { alert, msg, id, class: classNames } = _a, other = tslib_es6.__rest(_a, ["alert", "msg", "id", "class"]);
@@ -781,7 +410,7 @@ const KolFormFieldFc = (props, children) => {
         ['kol-form-field--hidden-msg']: Boolean(hideMsg),
     };
     if (variant) {
-        stateCssClasses = Object.assign(Object.assign({}, stateCssClasses), { [`kol-form-field--${variant}`]: true });
+        stateCssClasses = Object.assign(Object.assign({}, stateCssClasses), { [variantClassName.classNameFromVariant(variant, 'form-field')]: true });
     }
     if (showMsg) {
         const msgType = getMsgType(msg);
@@ -789,10 +418,10 @@ const KolFormFieldFc = (props, children) => {
     }
     return (index.h(Component, Object.assign({ class: clsx.clsx('kol-form-field', stateCssClasses, classNames), "aria-describedby": ariaDescribedBy }, other), showLabel && (index.h(KolFormFieldLabelFc, Object.assign({}, (formFieldLabelProps || {}), { id: id, hasExpertSlot: hasExpertSlot, hideLabel: hideLabel, label: label, accessKey: accessKey, shortKey: shortKey, readOnly: readOnly, showBadge: showBadge }))), index.h(InputContainer, Object.assign({}, formFieldInputProps, { ref: setInputContainerRef }), children, useTooltipInsteadOfLabel && hideLabel === true && (index.h("div", { class: clsx.clsx('kol-form-field__tooltip', formFieldTooltipProps === null || formFieldTooltipProps === void 0 ? void 0 : formFieldTooltipProps.class) }, index.h(component$1.TooltipFC, { badgeText: badgeText || '', label: label, align: tooltipAlign, id: labelId, refFloating: tooltipFloatingRef !== null && tooltipFloatingRef !== void 0 ? tooltipFloatingRef : ((el) => {
             tooltipController === null || tooltipController === void 0 ? void 0 : tooltipController.setTooltipElementRef(el);
-        }) })))), counter ? index.h(KolFormFieldCounterFc, Object.assign({ id: id }, counter)) : null, maxLength ? index.h(KolFormFieldCharacterLimitHintFc, { id: id, maxLength: maxLength }) : null, showMsg && !hideMsg && index.h(FormFieldMsgFc, Object.assign({}, (formFieldMsgProps || {}), { id: id, alert: alert, msg: msg })), showHint && index.h(KolFormFieldHintFc, Object.assign({}, (formFieldHintProps || {}), { id: id, hint: hint })), anotherChildren));
+        }) })))), counter && !(counter.maxLengthBehavior === 'soft' && typeof counter.maxLength !== 'number') && (index.h("div", { class: "kol-form-field__counter" }, index.h("span", { "data-testid": "input-counter", "aria-hidden": "true", class: "kol-form-field__counter", ref: counter.visualRef }), index.h("span", { "aria-live": "polite", class: "visually-hidden", "data-testid": "input-counter-aria", id: dev_utils.createRelatedUniqueId(id, 'counter'), ref: counter.ariaRef }))), showMsg && !hideMsg && index.h(FormFieldMsgFc, Object.assign({}, (formFieldMsgProps || {}), { id: id, alert: alert, msg: msg })), showHint && index.h(KolFormFieldHintFc, Object.assign({}, (formFieldHintProps || {}), { id: id, hint: hint })), anotherChildren, typeof maxLength === 'number' && !counter && (index.h("span", { id: dev_utils.createRelatedUniqueId(id, 'character-limit-hint'), class: "visually-hidden" }, i18n.translate('kol-character-limit-hint', { placeholders: { limit: String(maxLength) } })))));
 };
 
-function getFormFieldProps(state) {
+function getFormFieldProps(state, counterRefs) {
     const props = {
         id: state._id,
         disabled: state._disabled,
@@ -819,18 +448,8 @@ function getFormFieldProps(state) {
     if ('_maxLength' in state) {
         props.maxLength = state._maxLength;
     }
-    if ('_currentLength' in state &&
-        typeof state._currentLength === 'number' &&
-        '_currentLengthDebounced' in state &&
-        typeof state._currentLengthDebounced === 'number') {
-        if ('_hasCounter' in state && state._hasCounter === true) {
-            props.counter = {
-                currentLength: state._currentLength,
-                currentLengthDebounced: state._currentLengthDebounced,
-                maxLength: state._maxLength,
-                maxLengthBehavior: state._maxLengthBehavior || 'hard',
-            };
-        }
+    if ('_hasCounter' in state && state._hasCounter === true) {
+        props.counter = Object.assign({ maxLength: '_maxLength' in state ? state._maxLength : undefined, maxLengthBehavior: ('_maxLengthBehavior' in state ? state._maxLengthBehavior : undefined) || 'hard' }, counterRefs);
     }
     if ('_variant' in state) {
         props.variant = state._variant;
@@ -838,11 +457,11 @@ function getFormFieldProps(state) {
     return props;
 }
 const FormFieldStateWrapper = (_a, children) => {
-    var { state } = _a, other = tslib_es6.__rest(_a, ["state"]);
+    var { state, counterRefs } = _a, other = tslib_es6.__rest(_a, ["state", "counterRefs"]);
     const { ariaDescribedBy: ariaDescribedByArray } = getRenderStates(state);
     const isRadioVariant = other.component === 'fieldset' || ('_options' in state && '_orientation' in state);
     const ariaDescribedBy = isRadioVariant && ariaDescribedByArray.length > 0 ? ariaDescribedByArray.join(' ') : undefined;
-    const baseProps = getFormFieldProps(state);
+    const baseProps = getFormFieldProps(state, counterRefs);
     return (index.h(KolFormFieldFc, Object.assign({}, baseProps, other, { ariaDescribedBy: ariaDescribedBy }), children));
 };
 
@@ -854,6 +473,6 @@ exports.getDefaultProps = getDefaultProps;
 exports.getMsgType = getMsgType;
 exports.getRenderStates = getRenderStates;
 exports.isMsgDefinedAndInputTouched = isMsgDefinedAndInputTouched;
-//# sourceMappingURL=FormFieldStateWrapper-BY2eAAId.js.map
+//# sourceMappingURL=FormFieldStateWrapper-W-QMTbkj.js.map
 
-//# sourceMappingURL=FormFieldStateWrapper-BY2eAAId.js.map
+//# sourceMappingURL=FormFieldStateWrapper-W-QMTbkj.js.map