@ahrowe/ui 0.4.3 → 0.5.0

package/dist/esm/common/card/card.types.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"card.types.mjs","names":[],"sources":["../../../../package/common/card/card.types.ts"],"sourcesContent":["import type { ReactNode } from 'react';\nimport { IconDefinition } from '@fortawesome/free-solid-svg-icons';\nimport type { ButtonStyleType } from '../button/button.types';\nimport type { HtmlProps } from '../types/slots.types';\n\nexport enum CardStyleType {\n  Elevated = 'elevated',\n  Outlined = 'outlined',\n  Filled = 'filled',\n}\n\nexport interface CardProps extends HtmlProps {\n  className?: string | undefined;\n  children?: ReactNode;\n  styleType?: CardStyleType;\n  onClick?: () => void;\n  tabIndex?: number | null;\n  hoverEffect?: boolean;\n  style?: React.CSSProperties;\n  autoGap?: boolean;\n  clip?: boolean;\n}\n\nexport interface CardHeaderAction {\n  title?: string;\n  onClick?: (e: React.MouseEvent<HTMLDivElement>) => void;\n  icon: IconDefinition;\n}\n\nexport interface CardHeaderProps {\n  className?: string;\n  title?: ReactNode;\n  subTitle?: ReactNode;\n  /** URL string → rendered as background-image. Any other ReactNode → rendered inside the thumbnail div. */\n  thumbnail?: string | ReactNode;\n  actions?: CardHeaderAction[] | ReactNode;\n}\n\nexport interface CardMediaProps {\n  src?: string;\n  alt?: string;\n}\n\nexport interface CardContentProps {\n  children?: ReactNode;\n}\n\nexport interface CardAction {\n  id?: string;\n  label?: string;\n  styleType?: ButtonStyleType;\n  onClick?: () => void;\n}\n\nexport interface CardActionsProps {\n  className?: string;\n  /** Renders a Button for each action object. Pass `children` for custom content instead. */\n  actions?: CardAction[];\n  children?: ReactNode;\n}\n"],"mappings":"AAKA,IAAY,EAAL,SAAA,EAAA,OACL,GAAA,SAAA,WACA,EAAA,SAAA,WACA,EAAA,OAAA,UACF,EAAA,CAAA,CAAA"}
+{"version":3,"file":"card.types.mjs","names":[],"sources":["../../../../package/common/card/card.types.ts"],"sourcesContent":["import type { ReactNode } from 'react';\nimport type { ButtonStyleType } from '../button/button.types';\nimport type { HtmlProps } from '../types/slots.types';\nimport type { IconAction } from '../types/actions.types';\n\nexport enum CardStyleType {\n  Elevated = 'elevated',\n  Outlined = 'outlined',\n  Filled = 'filled',\n}\n\nexport interface CardProps extends HtmlProps {\n  className?: string | undefined;\n  children?: ReactNode;\n  styleType?: CardStyleType;\n  onClick?: () => void;\n  tabIndex?: number | null;\n  hoverEffect?: boolean;\n  style?: React.CSSProperties;\n  autoGap?: boolean;\n  clip?: boolean;\n}\n\nexport type CardHeaderAction = IconAction;\n\nexport interface CardHeaderProps {\n  className?: string;\n  title?: ReactNode;\n  subTitle?: ReactNode;\n  /** URL string → rendered as background-image. Any other ReactNode → rendered inside the thumbnail div. */\n  thumbnail?: string | ReactNode;\n  actions?: CardHeaderAction[] | ReactNode;\n}\n\nexport interface CardMediaProps {\n  src?: string;\n  alt?: string;\n}\n\nexport interface CardContentProps {\n  children?: ReactNode;\n}\n\nexport interface CardAction {\n  id?: string;\n  label?: string;\n  styleType?: ButtonStyleType;\n  onClick?: () => void;\n}\n\nexport interface CardActionsProps {\n  className?: string;\n  /** Renders a Button for each action object. Pass `children` for custom content instead. */\n  actions?: CardAction[];\n  children?: ReactNode;\n}\n"],"mappings":"AAKA,IAAY,EAAL,SAAA,EAAA,OACL,GAAA,SAAA,WACA,EAAA,SAAA,WACA,EAAA,OAAA,UACF,EAAA,CAAA,CAAA"}

package/dist/esm/common/confirmModal/confirmModal.mjs

@@ -1,2 +1,2 @@
-import e from"../actionButtons/actionButtons.mjs";import t from"../modal/modal.mjs";import{useState as n}from"react";import{jsx as r,jsxs as i}from"react/jsx-runtime";function a({children:a=null,className:o=``,onClose:s=()=>{},onConfirm:c=()=>{},title:l=``,content:u=null,isOpen:d=void 0,actionButtonsProps:f={}}){let[p,m]=n(!1),[h,g]=n(!1);function _(e=!1){m(!1),s(e)}async function v(){g(!0);try{await c(),_(!0)}finally{g(!1)}}let y=i(t,{title:l,isOpen:d===void 0?p:d,onClose:()=>_(),className:a?void 0:o,children:[u,r(e,{onClose:()=>_(),onSubmit:v,submitLabel:`Confirm`,isSubmitButtonLoading:h,...f})]});return a?i(`div`,{className:o,children:[r(`span`,{onClick:()=>m(!0),children:a}),y]}):y}export{a as default};
+import{useComponentDefaults as e}from"../configProvider/useComponentDefaults.mjs";import{ButtonStyleType as t}from"../button/button.types.mjs";import n from"../actionButtons/actionButtons.mjs";import r from"../modal/modal.mjs";import{useState as i}from"react";import{jsx as a,jsxs as o}from"react/jsx-runtime";function s(s){let{children:c=null,className:l=``,onClose:u=()=>{},onConfirm:d=()=>{},title:f=``,content:p=null,isOpen:m=void 0,submitLabel:h=`Confirm`,cancelLabel:g=`Cancel`,isDelete:_=!1,actionButtonsProps:v={}}=e(`ConfirmModal`,s),[y,b]=i(!1),[x,S]=i(!1);function C(e=!1){b(!1),u(e)}async function w(){S(!0);try{await d(),C(!0)}finally{S(!1)}}let T=o(r,{title:f,isOpen:m===void 0?y:m,onClose:()=>C(),className:c?void 0:l,children:[p,a(n,{onClose:()=>C(),onSubmit:w,submitLabel:h,cancelLabel:g,submitButtonStyle:_?t.Delete:void 0,isSubmitButtonLoading:x,...v})]});return c?o(`div`,{className:l,children:[a(`span`,{onClick:()=>b(!0),children:c}),T]}):T}export{s as default};
 //# sourceMappingURL=confirmModal.mjs.map

package/dist/esm/common/confirmModal/confirmModal.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"confirmModal.mjs","names":[],"sources":["../../../../package/common/confirmModal/confirmModal.tsx"],"sourcesContent":["import { useState, type ReactElement } from 'react';\n\nimport Modal from '../modal';\nimport { ActionButtons } from '../actionButtons';\nimport type { ConfirmModalProps } from './confirmModal.types';\n\nfunction ConfirmModal({\n  children = null,\n  className = '',\n  onClose = () => {},\n  onConfirm = () => {},\n  title = '',\n  content = null,\n  isOpen: propIsOpen = undefined,\n  actionButtonsProps = {},\n}: ConfirmModalProps): ReactElement {\n  const [internalOpen, setInternalOpen] = useState(false);\n  const [isSubmitting, setIsSubmitting] = useState(false);\n\n  function handleClose(didSubmit = false) {\n    setInternalOpen(false);\n    onClose(didSubmit);\n  }\n\n  async function handleConfirm() {\n    setIsSubmitting(true);\n    try {\n      await onConfirm();\n      handleClose(true);\n    } finally {\n      setIsSubmitting(false);\n    }\n  }\n\n  const isOpen = propIsOpen === undefined ? internalOpen : propIsOpen;\n\n  const modal = (\n    <Modal title={title} isOpen={isOpen} onClose={() => handleClose()} className={children ? undefined : className}>\n      {content}\n      <ActionButtons\n        onClose={() => handleClose()}\n        onSubmit={handleConfirm}\n        submitLabel=\"Confirm\"\n        isSubmitButtonLoading={isSubmitting}\n        {...actionButtonsProps}\n      />\n    </Modal>\n  );\n\n  if (!children) return modal;\n\n  return (\n    <div className={className}>\n      <span onClick={() => setInternalOpen(true)}>{children}</span>\n      {modal}\n    </div>\n  );\n}\n\nexport default ConfirmModal;\n"],"mappings":"uKAMA,SAAS,EAAa,CACpB,WAAW,KACX,YAAY,GACZ,cAAgB,CAAC,EACjB,gBAAkB,CAAC,EACnB,QAAQ,GACR,UAAU,KACV,OAAQ,EAAa,IAAA,GACrB,qBAAqB,CAAC,GACY,CAClC,GAAM,CAAC,EAAc,GAAmB,EAAS,EAAK,EAChD,CAAC,EAAc,GAAmB,EAAS,EAAK,EAEtD,SAAS,EAAY,EAAY,GAAO,CACtC,EAAgB,EAAK,EACrB,EAAQ,CAAS,CACnB,CAEA,eAAe,GAAgB,CAC7B,EAAgB,EAAI,EACpB,GAAI,CACF,MAAM,EAAU,EAChB,EAAY,EAAI,CAClB,QAAU,CACR,EAAgB,EAAK,CACvB,CACF,CAIA,IAAM,EACJ,EAAC,EAAD,CAAc,QAAe,OAHhB,IAAe,IAAA,GAAY,EAAe,EAGlB,YAAe,EAAY,EAAG,UAAW,EAAW,IAAA,GAAY,WAArG,CACG,EACD,EAAC,EAAD,CACE,YAAe,EAAY,EAC3B,SAAU,EACV,YAAY,UACZ,sBAAuB,EACvB,GAAI,CACL,CAAA,CACI,IAKT,OAFK,EAGH,EAAC,MAAD,CAAgB,qBAAhB,CACE,EAAC,OAAD,CAAM,YAAe,EAAgB,EAAI,EAAI,UAAe,CAAA,EAC3D,CACE,IANe,CAQxB"}
+{"version":3,"file":"confirmModal.mjs","names":[],"sources":["../../../../package/common/confirmModal/confirmModal.tsx"],"sourcesContent":["import { useState, type ReactElement } from 'react';\n\nimport Modal from '../modal';\nimport { ActionButtons } from '../actionButtons';\nimport { ButtonStyleType } from '../button';\nimport { useComponentDefaults } from '../configProvider';\nimport type { ConfirmModalProps } from './confirmModal.types';\n\nfunction ConfirmModal(props: ConfirmModalProps): ReactElement {\n  const {\n  children = null,\n  className = '',\n  onClose = () => {},\n  onConfirm = () => {},\n  title = '',\n  content = null,\n  isOpen: propIsOpen = undefined,\n  submitLabel = 'Confirm',\n  cancelLabel = 'Cancel',\n  isDelete = false,\n  actionButtonsProps = {},\n  } = useComponentDefaults('ConfirmModal', props);\n  const [internalOpen, setInternalOpen] = useState(false);\n  const [isSubmitting, setIsSubmitting] = useState(false);\n\n  function handleClose(didSubmit = false) {\n    setInternalOpen(false);\n    onClose(didSubmit);\n  }\n\n  async function handleConfirm() {\n    setIsSubmitting(true);\n    try {\n      await onConfirm();\n      handleClose(true);\n    } finally {\n      setIsSubmitting(false);\n    }\n  }\n\n  const isOpen = propIsOpen === undefined ? internalOpen : propIsOpen;\n\n  const modal = (\n    <Modal title={title} isOpen={isOpen} onClose={() => handleClose()} className={children ? undefined : className}>\n      {content}\n      <ActionButtons\n        onClose={() => handleClose()}\n        onSubmit={handleConfirm}\n        submitLabel={submitLabel}\n        cancelLabel={cancelLabel}\n        submitButtonStyle={isDelete ? ButtonStyleType.Delete : undefined}\n        isSubmitButtonLoading={isSubmitting}\n        {...actionButtonsProps}\n      />\n    </Modal>\n  );\n\n  if (!children) return modal;\n\n  return (\n    <div className={className}>\n      <span onClick={() => setInternalOpen(true)}>{children}</span>\n      {modal}\n    </div>\n  );\n}\n\nexport default ConfirmModal;\n"],"mappings":"sTAQA,SAAS,EAAa,EAAwC,CAC5D,GAAM,CACN,WAAW,KACX,YAAY,GACZ,cAAgB,CAAC,EACjB,gBAAkB,CAAC,EACnB,QAAQ,GACR,UAAU,KACV,OAAQ,EAAa,IAAA,GACrB,cAAc,UACd,cAAc,SACd,WAAW,GACX,qBAAqB,CAAC,GAClB,EAAqB,eAAgB,CAAK,EACxC,CAAC,EAAc,GAAmB,EAAS,EAAK,EAChD,CAAC,EAAc,GAAmB,EAAS,EAAK,EAEtD,SAAS,EAAY,EAAY,GAAO,CACtC,EAAgB,EAAK,EACrB,EAAQ,CAAS,CACnB,CAEA,eAAe,GAAgB,CAC7B,EAAgB,EAAI,EACpB,GAAI,CACF,MAAM,EAAU,EAChB,EAAY,EAAI,CAClB,QAAU,CACR,EAAgB,EAAK,CACvB,CACF,CAIA,IAAM,EACJ,EAAC,EAAD,CAAc,QAAe,OAHhB,IAAe,IAAA,GAAY,EAAe,EAGlB,YAAe,EAAY,EAAG,UAAW,EAAW,IAAA,GAAY,WAArG,CACG,EACD,EAAC,EAAD,CACE,YAAe,EAAY,EAC3B,SAAU,EACG,cACA,cACb,kBAAmB,EAAW,EAAgB,OAAS,IAAA,GACvD,sBAAuB,EACvB,GAAI,CACL,CAAA,CACI,IAKT,OAFK,EAGH,EAAC,MAAD,CAAgB,qBAAhB,CACE,EAAC,OAAD,CAAM,YAAe,EAAgB,EAAI,EAAI,UAAe,CAAA,EAC3D,CACE,IANe,CAQxB"}

package/dist/esm/common/divider/divider.mjs

@@ -0,0 +1,2 @@
+import{useComponentDefaults as e}from"../configProvider/useComponentDefaults.mjs";import{DividerTextPosition as t}from"./divider.types.mjs";import n from"./divider.module.mjs";import r from"classnames";import{jsx as i,jsxs as a}from"react/jsx-runtime";var o={[t.Left]:n.dividerTextLeft,[t.Center]:n.dividerTextCenter,[t.Right]:n.dividerTextRight};function s(s){let{text:c,textPosition:l=t.Center,className:u,style:d,classNames:f,styles:p,...m}=e(`Divider`,s),h=c!=null&&c!==``;return a(`div`,{...m,role:`separator`,className:r(n.divider,h&&o[l],u,f?.root),style:{...d,...p?.root},children:[i(`span`,{className:r(n.dividerLine,f?.line),style:p?.line}),h&&i(`span`,{className:r(n.dividerContent,f?.content),style:p?.content,children:c}),h&&i(`span`,{className:r(n.dividerLine,f?.line),style:p?.line})]})}export{s as default};
+//# sourceMappingURL=divider.mjs.map

package/dist/esm/common/divider/divider.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"divider.mjs","names":[],"sources":["../../../../package/common/divider/divider.tsx"],"sourcesContent":["import type { ReactElement } from 'react';\nimport cx from 'classnames';\n\nimport { DividerTextPosition } from './divider.types';\nimport type { DividerProps } from './divider.types';\nimport styles from './divider.module.pcss';\nimport { useComponentDefaults } from '../configProvider';\n\nconst CLASS_BY_TEXT_POSITION: Record<DividerTextPosition, string> = {\n  [DividerTextPosition.Left]: styles.dividerTextLeft,\n  [DividerTextPosition.Center]: styles.dividerTextCenter,\n  [DividerTextPosition.Right]: styles.dividerTextRight,\n};\n\nfunction Divider(props: DividerProps): ReactElement {\n  const {\n    text,\n    textPosition = DividerTextPosition.Center,\n    className,\n    style,\n    classNames,\n    styles: slotStyles,\n    ...rest\n  } = useComponentDefaults('Divider', props);\n\n  const hasText = text != null && text !== '';\n\n  return (\n    <div\n      {...rest}\n      role=\"separator\"\n      className={cx(\n        styles.divider,\n        hasText && CLASS_BY_TEXT_POSITION[textPosition],\n        className,\n        classNames?.root,\n      )}\n      style={{ ...style, ...slotStyles?.root }}\n    >\n      <span className={cx(styles.dividerLine, classNames?.line)} style={slotStyles?.line} />\n      {hasText && (\n        <span className={cx(styles.dividerContent, classNames?.content)} style={slotStyles?.content}>\n          {text}\n        </span>\n      )}\n      {hasText && (\n        <span className={cx(styles.dividerLine, classNames?.line)} style={slotStyles?.line} />\n      )}\n    </div>\n  );\n}\n\nexport default Divider;\n"],"mappings":"4PAQA,IAAM,EAA8D,EACjE,EAAoB,MAAO,EAAO,iBAClC,EAAoB,QAAS,EAAO,mBACpC,EAAoB,OAAQ,EAAO,gBACtC,EAEA,SAAS,EAAQ,EAAmC,CAClD,GAAM,CACJ,OACA,eAAe,EAAoB,OACnC,YACA,QACA,aACA,OAAQ,EACR,GAAG,GACD,EAAqB,UAAW,CAAK,EAEnC,EAAU,GAAQ,MAAQ,IAAS,GAEzC,OACE,EAAC,MAAD,CACE,GAAI,EACJ,KAAK,YACL,UAAW,EACT,EAAO,QACP,GAAW,EAAuB,GAClC,EACA,GAAY,IACd,EACA,MAAO,CAAE,GAAG,EAAO,GAAG,GAAY,IAAK,WATzC,CAWE,EAAC,OAAD,CAAM,UAAW,EAAG,EAAO,YAAa,GAAY,IAAI,EAAG,MAAO,GAAY,IAAO,CAAA,EACpF,GACC,EAAC,OAAD,CAAM,UAAW,EAAG,EAAO,eAAgB,GAAY,OAAO,EAAG,MAAO,GAAY,iBACjF,CACG,CAAA,EAEP,GACC,EAAC,OAAD,CAAM,UAAW,EAAG,EAAO,YAAa,GAAY,IAAI,EAAG,MAAO,GAAY,IAAO,CAAA,CAEpF,GAET"}

package/dist/esm/common/divider/divider.module.mjs

@@ -0,0 +1,2 @@
+var e={divider:`divider_OO203`,"divider-line":`divider-line_nVep8`,dividerLine:`divider-line_nVep8`,"divider-content":`divider-content_-y7ou`,dividerContent:`divider-content_-y7ou`,"divider-text-left":`divider-text-left_HYmeQ`,dividerTextLeft:`divider-text-left_HYmeQ`,"divider-text-right":`divider-text-right_RH5sH`,dividerTextRight:`divider-text-right_RH5sH`};export{e as default};
+//# sourceMappingURL=divider.module.mjs.map

package/dist/esm/common/divider/divider.module.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"divider.module.mjs","names":[],"sources":["../../../../package/common/divider/divider.module.pcss"],"sourcesContent":[".divider {\n  display: flex;\n  align-items: center;\n  width: 100%;\n\n  &-line {\n    flex: 1 1 auto;\n    height: 1px;\n    background-color: var(--border-color);\n  }\n\n  &-content {\n    flex: 0 0 auto;\n    padding: 0 0.75em;\n    color: var(--text-dark);\n    font-size: 0.875em;\n    white-space: nowrap;\n  }\n\n  &-text-left &-line:first-child {\n    flex-grow: 0;\n    flex-basis: 1.5em;\n  }\n\n  &-text-right &-line:last-child {\n    flex-grow: 0;\n    flex-basis: 1.5em;\n  }\n}\n"],"mappings":""}

package/dist/esm/common/divider/divider.types.mjs

@@ -0,0 +1,2 @@
+var e=function(e){return e.Left=`left`,e.Center=`center`,e.Right=`right`,e}({});export{e as DividerTextPosition};
+//# sourceMappingURL=divider.types.mjs.map

package/dist/esm/common/divider/divider.types.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"divider.types.mjs","names":[],"sources":["../../../../package/common/divider/divider.types.ts"],"sourcesContent":["import type { CSSProperties, ReactNode } from 'react';\nimport type { SlotClassNames, SlotStyles, HtmlProps } from '../types/slots.types';\n\nexport enum DividerTextPosition {\n  Left = 'left',\n  Center = 'center',\n  Right = 'right',\n}\n\nexport type DividerSlots = 'root' | 'line' | 'content';\n\nexport interface DividerProps extends HtmlProps {\n  text?: ReactNode;\n  textPosition?: DividerTextPosition;\n  className?: string;\n  style?: CSSProperties;\n  classNames?: SlotClassNames<DividerSlots>;\n  styles?: SlotStyles<DividerSlots>;\n}\n"],"mappings":"AAGA,IAAY,EAAL,SAAA,EAAA,OACL,GAAA,KAAA,OACA,EAAA,OAAA,SACA,EAAA,MAAA,SACF,EAAA,CAAA,CAAA"}

package/dist/esm/common/dropdown/dropdown.mjs

@@ -1,2 +1,2 @@
-import{useComponentDefaults as e}from"../configProvider/useComponentDefaults.mjs";import t from"../bodyEnd/bodyEnd.mjs";import{useFloatingPosition as n}from"../floatingMenu/useFloatingPosition.mjs";import r from"../tooltip/tooltip.mjs";import i from"../infiniteBlock/infiniteBlock.mjs";import a from"./dropdown.module.mjs";import{useEffect as o,useRef as s,useState as c}from"react";import l from"classnames";import{FontAwesomeIcon as ee}from"@fortawesome/react-fontawesome";import{faChevronDown as u}from"@fortawesome/free-solid-svg-icons";import{jsx as d,jsxs as f}from"react/jsx-runtime";import p from"downshift";function m(m){let{errorMessage:h=``,className:te=``,label:g=``,value:_=``,isValid:v=!0,tabIndex:y=0,isRequired:b=!1,customProps:x={},isRow:S=!1,disabled:C=!1,onScroll:w=()=>Promise.resolve(),onClick:T,onChange:E,onFocus:ne=null,onBlur:re=null,onMouseEnter:ie=null,onMouseLeave:ae=null,dropdownLabel:oe,isDropdownListWider:D=!1,inputClassName:se=``,dropDownIconClassName:ce=``,dropDownClassName:le=``,formValidator:O=null,labelClassName:k=``,dropDownInputClassName:A=``,items:j=[],useMatLabelStyle:M=!0,alwaysFloatLabel:N=!1,placeholder:P=``,plainStyle:F=!1,scrollToSelected:I=!1,reactRef:L,...R}=e(`Dropdown`,m),[z,B]=c(!1),[V,H]=c(!1),[,U]=c(0),W=s(O),G=s(null),K=s(null),[q,ue]=c(!1),[de,fe]=c(10);o(()=>{if(q){let e=G.current?.getBoundingClientRect();fe(e?.width??10)}},[q]),n({isOpen:q,triggerRef:G,anchorRef:K,panelRef:K,flipClassName:a.dropdownInputListAnimFlip}),o(()=>{if(W.current=O,!W.current)return;W.current.label=g??``,W.current.validate();let e=()=>U(e=>e+1);return W.current.registerOnUpdateListener(e),()=>W.current?.removeOnUpdateListener(e)},[O,g]);let pe=e=>{H(!0),ie?.(e)},me=e=>{H(!1),ae?.(e)},he=e=>{B(!0),ne?.(e)},ge=e=>{W.current&&(W.current.touched=!0),B(!1),re?.(e)},_e=()=>O?O.touched&&O.hasError():!v||!!h,ve=()=>!!(b||O?.validators.find(e=>e.validatorId===`required`)),J=e=>{O?(O.set(e),E?.(O.value,x)):E?.(e,x)},Y=oe,X=O?O.value:_,Z=_e();j.forEach(e=>{e.key===X&&(Y=e.label)});let Q=Y||X,$=Q==null||typeof Q==`string`&&Q.trim()===``;return f(`div`,{...R,className:l(te,a.dropdownLabel,a.dropdown,{[a.dropdownLabelColumn]:!S}),onMouseEnter:pe,onMouseLeave:me,children:[d(p,{onChange:e=>J((e||{key:``}).key),itemToString:e=>e?String(e.key):``,selectedItem:j.find(e=>e.key===X)??null,onStateChange:e=>{typeof e.isOpen==`boolean`&&ue(e.isOpen)},stateReducer:(e,t)=>I&&Object.prototype.hasOwnProperty.call(t,`isOpen`)?{...t,highlightedIndex:t.isOpen?j.indexOf(e.selectedItem):null}:t,children:({getItemProps:e,getToggleButtonProps:n,isOpen:r,selectedItem:o,highlightedIndex:s,setHighlightedIndex:c})=>d(`div`,{children:f(`div`,{ref:G,onFocus:he,onBlur:ge,className:l(a.dropdownInput,{[a.dropdownInputPlain]:F},A),children:[d(`button`,{tabIndex:y,type:`button`,disabled:C,style:D?{padding:`6px`,border:`none`}:{},className:l(a.dropdownInputButton,{[a.dropdownInputButtonDisabled]:C},se),...n(),onClick:e=>{n().onClick?.(e),T?.(e)},ref:L,children:$?`\xA0`:Q}),d(`button`,{type:`button`,tabIndex:-1,disabled:C,className:l(a.dropdownInputButtonIcon,ce),...n(),onClick:e=>{n().onClick?.(e),T?.(e)},children:!C&&d(ee,{icon:u,className:l(a.dropdownInputButtonIconArrow,{[a.dropdownInputButtonIconArrowOpen]:r})})}),!C&&r?d(t,{children:d(`div`,{ref:K,className:l(a.dropdownInputListAnim,{[a.dropdownInputListAnimWider]:D}),style:{width:`${de}px`},children:d(i,{onScroll:w,className:a.dropdownInputList,setHighlightedIndex:c,children:j.map((t,n)=>d(`div`,{...e({index:n,item:t,disabled:!!t.disabled}),className:l(a.dropdownInputListItem,le,{[a.dropdownInputListItemActive]:s===n,[a.dropdownInputListItemSelected]:o===t,[a.dropdownInputListItemDisabled]:!!t.disabled}),children:t.label},t.key))})})}):null,d(`fieldset`,{className:l(a.dropdownFieldset,{[a.dropdownBorderPlain]:F,[a.dropdownBorderFocused]:z,[a.dropdownBorderInvalid]:Z,[a.dropdownBorderError]:Z}),children:d(`legend`,{className:l(a.dropdownFieldsetLegend,{[a.dropdownFieldsetLegendActive]:M&&(N||z||!$)}),children:d(`span`,{children:g})})}),M&&g&&d(`div`,{className:l(a.dropdownMatLabel,{[a.dropdownMatLabelFloating]:N||z||!$}),children:g}),M&&P&&d(`div`,{className:l(a.dropdownPlaceholder,z&&!Y&&a.dropdownPlaceholderShown),children:P})]})})}),g&&!M&&f(`div`,{className:l(a.dropdownLabelText,k),children:[g,ve()?d(`div`,{className:a.requiredMark,children:`*`}):null]}),d(r,{variant:`error`,message:O?O.getCurrentErrorMessage():h||``,isVisible:Z&&(z||V)})]})}export{m as default};
+import{useComponentDefaults as e}from"../configProvider/useComponentDefaults.mjs";import t from"../bodyEnd/bodyEnd.mjs";import{useFloatingPosition as n}from"../floatingMenu/useFloatingPosition.mjs";import r from"../tooltip/tooltip.mjs";import i from"../infiniteBlock/infiniteBlock.mjs";import a from"./dropdown.module.mjs";import{useEffect as o,useRef as s,useState as c}from"react";import l from"classnames";import{FontAwesomeIcon as ee}from"@fortawesome/react-fontawesome";import{faChevronDown as u}from"@fortawesome/free-solid-svg-icons";import{jsx as d,jsxs as f}from"react/jsx-runtime";import p from"downshift";function m(m){let{errorMessage:h=``,className:g=``,label:_=``,value:te=``,isValid:v=!0,tabIndex:y=0,isRequired:b=!1,customProps:x={},isRow:S=!1,disabled:C=!1,onScroll:w=()=>Promise.resolve(),onClick:T,onChange:E,onFocus:ne=null,onBlur:re=null,onMouseEnter:ie=null,onMouseLeave:ae=null,dropdownLabel:oe,isDropdownListWider:D=!1,inputClassName:se=``,dropDownIconClassName:ce=``,dropDownClassName:le=``,formValidator:O=null,labelClassName:ue=``,dropDownInputClassName:de=``,items:k=[],useMatLabelStyle:A=!0,alwaysFloatLabel:j=!1,placeholder:M=``,plainStyle:N=!1,scrollToSelected:P=!1,reactRef:F,...I}=e(`Dropdown`,m),[L,R]=c(!1),[z,B]=c(!1),[,V]=c(0),H=s(O),U=s(null),W=s(null),[G,fe]=c(!1),[pe,me]=c(10);o(()=>{if(G){let e=U.current?.getBoundingClientRect();me(e?.width??10)}},[G]),n({isOpen:G,triggerRef:U,anchorRef:W,panelRef:W,flipClassName:a.dropdownInputListAnimFlip}),o(()=>{if(H.current=O,!H.current)return;H.current.label=_??``,H.current.validate();let e=()=>V(e=>e+1);return H.current.registerOnUpdateListener(e),()=>H.current?.removeOnUpdateListener(e)},[O,_]);let he=e=>{B(!0),ie?.(e)},ge=e=>{B(!1),ae?.(e)},_e=e=>{R(!0),ne?.(e)},ve=e=>{H.current&&(H.current.touched=!0),R(!1),re?.(e)},ye=()=>O?O.touched&&O.hasError():!v||!!h,K=()=>!!(b||O?.validators.find(e=>e.validatorId===`required`)),q=e=>{O?(O.set(e),E?.(O.value,x)):E?.(e,x)},J=oe,Y=O?O.value:te,X=ye();k.forEach(e=>{e.key===Y&&(J=e.label)});let Z=J||Y,Q=Z==null||typeof Z==`string`&&Z.trim()===``,$=K()?d(`span`,{className:a.requiredMark,children:`*`}):null,be=_&&K()?`${_} *`:_;return f(`div`,{...I,className:l(g,a.dropdownLabel,a.dropdown,{[a.dropdownLabelColumn]:!S}),onMouseEnter:he,onMouseLeave:ge,children:[d(p,{onChange:e=>q((e||{key:``}).key),itemToString:e=>e?String(e.key):``,selectedItem:k.find(e=>e.key===Y)??null,onStateChange:e=>{typeof e.isOpen==`boolean`&&fe(e.isOpen)},stateReducer:(e,t)=>P&&Object.prototype.hasOwnProperty.call(t,`isOpen`)?{...t,highlightedIndex:t.isOpen?k.indexOf(e.selectedItem):null}:t,children:({getItemProps:e,getToggleButtonProps:n,isOpen:r,selectedItem:o,highlightedIndex:s,setHighlightedIndex:c})=>d(`div`,{children:f(`div`,{ref:U,onFocus:_e,onBlur:ve,className:l(a.dropdownInput,{[a.dropdownInputPlain]:N},de),children:[d(`button`,{tabIndex:y,type:`button`,disabled:C,style:D?{padding:`6px`,border:`none`}:{},className:l(a.dropdownInputButton,{[a.dropdownInputButtonDisabled]:C},se),...n(),onClick:e=>{n().onClick?.(e),T?.(e)},ref:F,children:Q?`\xA0`:Z}),d(`button`,{type:`button`,tabIndex:-1,disabled:C,className:l(a.dropdownInputButtonIcon,ce),...n(),onClick:e=>{n().onClick?.(e),T?.(e)},children:!C&&d(ee,{icon:u,className:l(a.dropdownInputButtonIconArrow,{[a.dropdownInputButtonIconArrowOpen]:r})})}),!C&&r?d(t,{children:d(`div`,{ref:W,className:l(a.dropdownInputListAnim,{[a.dropdownInputListAnimWider]:D}),style:{width:`${pe}px`},children:d(i,{onScroll:w,className:a.dropdownInputList,setHighlightedIndex:c,children:k.map((t,n)=>d(`div`,{...e({index:n,item:t,disabled:!!t.disabled}),className:l(a.dropdownInputListItem,le,{[a.dropdownInputListItemActive]:s===n,[a.dropdownInputListItemSelected]:o===t,[a.dropdownInputListItemDisabled]:!!t.disabled}),children:t.label},t.key))})})}):null,d(`fieldset`,{className:l(a.dropdownFieldset,{[a.dropdownBorderPlain]:N,[a.dropdownBorderFocused]:L,[a.dropdownBorderInvalid]:X,[a.dropdownBorderError]:X}),children:d(`legend`,{className:l(a.dropdownFieldsetLegend,{[a.dropdownFieldsetLegendActive]:A&&(j||L||!Q)}),children:d(`span`,{children:be})})}),A&&_&&f(`div`,{className:l(a.dropdownMatLabel,{[a.dropdownMatLabelFloating]:j||L||!Q}),children:[_,$]}),A&&M&&d(`div`,{className:l(a.dropdownPlaceholder,L&&!J&&a.dropdownPlaceholderShown),children:M})]})})}),_&&!A&&f(`div`,{className:l(a.dropdownLabelText,ue),children:[_,$]}),d(r,{variant:`error`,message:O?O.getCurrentErrorMessage():h||``,isVisible:X&&(L||z)})]})}export{m as default};
 //# sourceMappingURL=dropdown.mjs.map

package/dist/esm/common/dropdown/dropdown.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown.mjs","names":[],"sources":["../../../../package/common/dropdown/dropdown.tsx"],"sourcesContent":["import React, { useState, useEffect, useRef } from 'react';\nimport cx from 'classnames';\nimport InfiniteBlock from 'components/common/infiniteBlock';\nimport BodyEnd from 'components/common/bodyEnd';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { faChevronDown as dropdownIcon } from '@fortawesome/free-solid-svg-icons';\nimport Downshift, { StateChangeOptions, DownshiftState } from 'downshift';\nimport Tooltip from 'components/common/tooltip';\n\nimport { useFloatingPosition } from '../floatingMenu/useFloatingPosition';\nimport { useComponentDefaults } from '../configProvider';\nimport styles from './dropdown.module.pcss';\nimport type { DropdownProps, DropdownItem } from './dropdown.types';\n\nfunction Dropdown(props: DropdownProps) {\n  const {\n  errorMessage = '',\n  className = '',\n  label = '',\n  value = '',\n  isValid = true,\n  tabIndex = 0,\n  isRequired = false,\n  customProps = {},\n  isRow = false,\n  disabled = false,\n  onScroll = () => Promise.resolve(),\n  onClick,\n  onChange,\n  onFocus: onFocusProp = null,\n  onBlur: onBlurProp = null,\n  onMouseEnter: onMouseEnterProp = null,\n  onMouseLeave: onMouseLeaveProp = null,\n  dropdownLabel: dropdownLabelProp,\n  isDropdownListWider = false,\n  inputClassName = '',\n  dropDownIconClassName = '',\n  dropDownClassName = '',\n  formValidator = null,\n  labelClassName = '',\n  dropDownInputClassName = '',\n  items = [],\n  useMatLabelStyle = true,\n  alwaysFloatLabel = false,\n  placeholder = '',\n  plainStyle = false,\n  scrollToSelected = false,\n  reactRef,\n  ...rest\n  } = useComponentDefaults('Dropdown', props);\n  const [isFocused, setIsFocused] = useState(false);\n  const [isHovered, setIsHovered] = useState(false);\n  const [, forceUpdate] = useState(0);\n  const fvRef = useRef(formValidator);\n  const triggerRef = useRef<HTMLDivElement>(null);\n  const anchorRef = useRef<HTMLDivElement>(null);\n  const [menuIsOpen, setMenuIsOpen] = useState(false);\n  const [triggerWidth, setTriggerWidth] = useState(10);\n\n  useEffect(() => {\n    if (menuIsOpen) {\n      const rect = triggerRef.current?.getBoundingClientRect();\n      setTriggerWidth(rect?.width ?? 10);\n    }\n  }, [menuIsOpen]);\n\n  useFloatingPosition({\n    isOpen: menuIsOpen,\n    triggerRef,\n    anchorRef,\n    panelRef: anchorRef,\n    flipClassName: styles.dropdownInputListAnimFlip,\n  });\n\n  useEffect(() => {\n    fvRef.current = formValidator;\n    if (!fvRef.current) return;\n    fvRef.current.label = label ?? '';\n    fvRef.current.validate();\n    const listener = () => forceUpdate(n => n + 1);\n    fvRef.current.registerOnUpdateListener(listener);\n    return () => fvRef.current?.removeOnUpdateListener(listener);\n  }, [formValidator, label]);\n\n  const onMouseEnterHandler = (event: React.MouseEvent) => {\n    setIsHovered(true);\n    onMouseEnterProp?.(event);\n  };\n\n  const onMouseLeaveHandler = (event: React.MouseEvent) => {\n    setIsHovered(false);\n    onMouseLeaveProp?.(event);\n  };\n\n  const onFocusHandler = (event: React.FocusEvent) => {\n    setIsFocused(true);\n    onFocusProp?.(event);\n  };\n\n  const onBlurHandler = (event: React.FocusEvent) => {\n    if (fvRef.current) fvRef.current.touched = true;\n    setIsFocused(false);\n    onBlurProp?.(event);\n  };\n\n  const hasError = (): boolean => {\n    return formValidator\n      ? (formValidator.touched && formValidator.hasError())\n      : (!isValid || !!errorMessage);\n  };\n\n  const computedIsRequired = (): boolean => {\n    return !!(isRequired || formValidator?.validators.find(\n      (v) => (v as { validatorId?: string }).validatorId === 'required'\n    ));\n  };\n\n  const onChangeHandler = (val: string | number): void => {\n    if (formValidator) {\n      formValidator.set(val);\n      onChange?.(formValidator.value, customProps);\n    } else {\n      onChange?.(val, customProps);\n    }\n  };\n\n  let dropdownLabel = dropdownLabelProp;\n  const currentValue = formValidator ? formValidator.value as string | number : value;\n  const hasErr = hasError();\n\n  items.forEach((item: DropdownItem) => {\n    if (item.key === currentValue) {\n      dropdownLabel = item.label as string;\n    }\n  });\n\n  const displayValue = dropdownLabel || currentValue;\n  const isDisplayBlank =\n    displayValue == null ||\n    (typeof displayValue === 'string' && displayValue.trim() === '');\n\n  return (\n    <div\n      {...rest}\n      className={cx(className, styles.dropdownLabel, styles.dropdown, {\n        [styles.dropdownLabelColumn]: !isRow,\n      })}\n      onMouseEnter={onMouseEnterHandler}\n      onMouseLeave={onMouseLeaveHandler}\n    >\n      <Downshift\n        onChange={(selection: DropdownItem | null) => onChangeHandler((selection || { key: '' }).key)}\n        itemToString={(item: DropdownItem | null) => (item ? String(item.key) : '')}\n        selectedItem={items.find((el) => el.key === currentValue) ?? null}\n        onStateChange={(changes: StateChangeOptions<DropdownItem>) => {\n          if (typeof changes.isOpen === 'boolean') setMenuIsOpen(changes.isOpen);\n        }}\n        stateReducer={(state: DownshiftState<DropdownItem>, changes: StateChangeOptions<DropdownItem>) => {\n          if (scrollToSelected && Object.prototype.hasOwnProperty.call(changes, 'isOpen')) {\n            return {\n              ...changes,\n              highlightedIndex: changes.isOpen ? items.indexOf(state.selectedItem as DropdownItem) : null,\n            };\n          }\n          return changes;\n        }}\n      >\n        {({\n          getItemProps,\n          getToggleButtonProps,\n          isOpen,\n          selectedItem,\n          highlightedIndex,\n          setHighlightedIndex,\n        }) => (\n          <div>\n            <div\n              ref={triggerRef}\n              onFocus={onFocusHandler}\n              onBlur={onBlurHandler}\n              className={cx(\n                styles.dropdownInput,\n                { [styles.dropdownInputPlain]: plainStyle },\n                dropDownInputClassName\n              )}\n            >\n              <button\n                tabIndex={tabIndex}\n                type=\"button\"\n                disabled={disabled}\n                style={isDropdownListWider ? { padding: '6px', border: 'none' } : {}}\n                className={cx(\n                  styles.dropdownInputButton,\n                  { [styles.dropdownInputButtonDisabled]: disabled },\n                  inputClassName\n                )}\n                {...getToggleButtonProps()}\n                onClick={(e: React.MouseEvent<HTMLButtonElement>) => {\n                  getToggleButtonProps().onClick?.(e);\n                  onClick?.(e);\n                }}\n                ref={reactRef}\n              >\n                {/* Non-breaking space when blank (same text-node layout as a\n                    real value) so the button keeps a full line of height. */}\n                {isDisplayBlank ? '\\u00A0' : displayValue}\n              </button>\n              <button\n                type=\"button\"\n                tabIndex={-1}\n                disabled={disabled}\n                className={cx(styles.dropdownInputButtonIcon, dropDownIconClassName)}\n                {...getToggleButtonProps()}\n                onClick={(e: React.MouseEvent<HTMLButtonElement>) => {\n                  getToggleButtonProps().onClick?.(e);\n                  onClick?.(e);\n                }}\n              >\n                {!disabled && (\n                  <FontAwesomeIcon\n                    icon={dropdownIcon}\n                    className={cx(styles.dropdownInputButtonIconArrow, {\n                      [styles.dropdownInputButtonIconArrowOpen]: isOpen,\n                    })}\n                  />\n                )}\n              </button>\n              {!disabled && isOpen ? (\n                <BodyEnd>\n                  <div\n                    ref={anchorRef}\n                    className={cx(styles.dropdownInputListAnim, {\n                      [styles.dropdownInputListAnimWider]: isDropdownListWider,\n                    })}\n                    style={{ width: `${triggerWidth}px` }}\n                  >\n                    <InfiniteBlock\n                      onScroll={onScroll}\n                      className={styles.dropdownInputList}\n                      setHighlightedIndex={setHighlightedIndex}\n                    >\n                      {items.map((item: DropdownItem, index: number) => (\n                        <div\n                          key={item.key}\n                          {...getItemProps({ index, item, disabled: !!item.disabled })}\n                          className={cx(styles.dropdownInputListItem, dropDownClassName, {\n                            [styles.dropdownInputListItemActive]: highlightedIndex === index,\n                            [styles.dropdownInputListItemSelected]: selectedItem === item,\n                            [styles.dropdownInputListItemDisabled]: !!item.disabled,\n                          })}\n                        >\n                          {item.label}\n                        </div>\n                      ))}\n                    </InfiniteBlock>\n                  </div>\n                </BodyEnd>\n              ) : null}\n              <fieldset\n                className={cx(styles.dropdownFieldset, {\n                  [styles.dropdownBorderPlain]: plainStyle,\n                  [styles.dropdownBorderFocused]: isFocused,\n                  [styles.dropdownBorderInvalid]: hasErr,\n                  [styles.dropdownBorderError]: hasErr,\n                })}\n              >\n                <legend\n                  className={cx(styles.dropdownFieldsetLegend, {\n                    [styles.dropdownFieldsetLegendActive]:\n                      useMatLabelStyle && (alwaysFloatLabel || isFocused || !isDisplayBlank),\n                  })}\n                >\n                  <span>{label}</span>\n                </legend>\n              </fieldset>\n              {useMatLabelStyle && label && (\n                <div\n                  className={cx(styles.dropdownMatLabel, {\n                    [styles.dropdownMatLabelFloating]: alwaysFloatLabel || isFocused || !isDisplayBlank,\n                  })}\n                >\n                  {label}\n                </div>\n              )}\n              {useMatLabelStyle && placeholder && (\n                <div\n                  className={cx(\n                    styles.dropdownPlaceholder,\n                    isFocused && !dropdownLabel && styles.dropdownPlaceholderShown\n                  )}\n                >\n                  {placeholder}\n                </div>\n              )}\n            </div>\n          </div>\n        )}\n      </Downshift>\n      {label && !useMatLabelStyle && (\n        <div className={cx(styles.dropdownLabelText, labelClassName)}>\n          {label}\n          {computedIsRequired() ? <div className={styles.requiredMark}>*</div> : null}\n        </div>\n      )}\n      <Tooltip\n        variant=\"error\"\n        message={formValidator ? formValidator.getCurrentErrorMessage() : (errorMessage || '')}\n        isVisible={hasErr && (isFocused || isHovered)}\n      />\n    </div>\n  );\n}\n\nexport default Dropdown;\n"],"mappings":"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"}
+{"version":3,"file":"dropdown.mjs","names":[],"sources":["../../../../package/common/dropdown/dropdown.tsx"],"sourcesContent":["import React, { useState, useEffect, useRef } from 'react';\nimport cx from 'classnames';\nimport InfiniteBlock from 'components/common/infiniteBlock';\nimport BodyEnd from 'components/common/bodyEnd';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { faChevronDown as dropdownIcon } from '@fortawesome/free-solid-svg-icons';\nimport Downshift, { StateChangeOptions, DownshiftState } from 'downshift';\nimport Tooltip from 'components/common/tooltip';\n\nimport { useFloatingPosition } from '../floatingMenu/useFloatingPosition';\nimport { useComponentDefaults } from '../configProvider';\nimport styles from './dropdown.module.pcss';\nimport type { DropdownProps, DropdownItem } from './dropdown.types';\n\nfunction Dropdown(props: DropdownProps) {\n  const {\n  errorMessage = '',\n  className = '',\n  label = '',\n  value = '',\n  isValid = true,\n  tabIndex = 0,\n  isRequired = false,\n  customProps = {},\n  isRow = false,\n  disabled = false,\n  onScroll = () => Promise.resolve(),\n  onClick,\n  onChange,\n  onFocus: onFocusProp = null,\n  onBlur: onBlurProp = null,\n  onMouseEnter: onMouseEnterProp = null,\n  onMouseLeave: onMouseLeaveProp = null,\n  dropdownLabel: dropdownLabelProp,\n  isDropdownListWider = false,\n  inputClassName = '',\n  dropDownIconClassName = '',\n  dropDownClassName = '',\n  formValidator = null,\n  labelClassName = '',\n  dropDownInputClassName = '',\n  items = [],\n  useMatLabelStyle = true,\n  alwaysFloatLabel = false,\n  placeholder = '',\n  plainStyle = false,\n  scrollToSelected = false,\n  reactRef,\n  ...rest\n  } = useComponentDefaults('Dropdown', props);\n  const [isFocused, setIsFocused] = useState(false);\n  const [isHovered, setIsHovered] = useState(false);\n  const [, forceUpdate] = useState(0);\n  const fvRef = useRef(formValidator);\n  const triggerRef = useRef<HTMLDivElement>(null);\n  const anchorRef = useRef<HTMLDivElement>(null);\n  const [menuIsOpen, setMenuIsOpen] = useState(false);\n  const [triggerWidth, setTriggerWidth] = useState(10);\n\n  useEffect(() => {\n    if (menuIsOpen) {\n      const rect = triggerRef.current?.getBoundingClientRect();\n      setTriggerWidth(rect?.width ?? 10);\n    }\n  }, [menuIsOpen]);\n\n  useFloatingPosition({\n    isOpen: menuIsOpen,\n    triggerRef,\n    anchorRef,\n    panelRef: anchorRef,\n    flipClassName: styles.dropdownInputListAnimFlip,\n  });\n\n  useEffect(() => {\n    fvRef.current = formValidator;\n    if (!fvRef.current) return;\n    fvRef.current.label = label ?? '';\n    fvRef.current.validate();\n    const listener = () => forceUpdate(n => n + 1);\n    fvRef.current.registerOnUpdateListener(listener);\n    return () => fvRef.current?.removeOnUpdateListener(listener);\n  }, [formValidator, label]);\n\n  const onMouseEnterHandler = (event: React.MouseEvent) => {\n    setIsHovered(true);\n    onMouseEnterProp?.(event);\n  };\n\n  const onMouseLeaveHandler = (event: React.MouseEvent) => {\n    setIsHovered(false);\n    onMouseLeaveProp?.(event);\n  };\n\n  const onFocusHandler = (event: React.FocusEvent) => {\n    setIsFocused(true);\n    onFocusProp?.(event);\n  };\n\n  const onBlurHandler = (event: React.FocusEvent) => {\n    if (fvRef.current) fvRef.current.touched = true;\n    setIsFocused(false);\n    onBlurProp?.(event);\n  };\n\n  const hasError = (): boolean => {\n    return formValidator\n      ? (formValidator.touched && formValidator.hasError())\n      : (!isValid || !!errorMessage);\n  };\n\n  const computedIsRequired = (): boolean => {\n    return !!(isRequired || formValidator?.validators.find(\n      (v) => (v as { validatorId?: string }).validatorId === 'required'\n    ));\n  };\n\n  const onChangeHandler = (val: string | number): void => {\n    if (formValidator) {\n      formValidator.set(val);\n      onChange?.(formValidator.value, customProps);\n    } else {\n      onChange?.(val, customProps);\n    }\n  };\n\n  let dropdownLabel = dropdownLabelProp;\n  const currentValue = formValidator ? formValidator.value as string | number : value;\n  const hasErr = hasError();\n\n  items.forEach((item: DropdownItem) => {\n    if (item.key === currentValue) {\n      dropdownLabel = item.label as string;\n    }\n  });\n\n  const displayValue = dropdownLabel || currentValue;\n  const isDisplayBlank =\n    displayValue == null ||\n    (typeof displayValue === 'string' && displayValue.trim() === '');\n\n  const requiredMark = computedIsRequired() ? <span className={styles.requiredMark}>*</span> : null;\n  const editedLabel = label && computedIsRequired() ? `${label} *` : label;\n\n  return (\n    <div\n      {...rest}\n      className={cx(className, styles.dropdownLabel, styles.dropdown, {\n        [styles.dropdownLabelColumn]: !isRow,\n      })}\n      onMouseEnter={onMouseEnterHandler}\n      onMouseLeave={onMouseLeaveHandler}\n    >\n      <Downshift\n        onChange={(selection: DropdownItem | null) => onChangeHandler((selection || { key: '' }).key)}\n        itemToString={(item: DropdownItem | null) => (item ? String(item.key) : '')}\n        selectedItem={items.find((el) => el.key === currentValue) ?? null}\n        onStateChange={(changes: StateChangeOptions<DropdownItem>) => {\n          if (typeof changes.isOpen === 'boolean') setMenuIsOpen(changes.isOpen);\n        }}\n        stateReducer={(state: DownshiftState<DropdownItem>, changes: StateChangeOptions<DropdownItem>) => {\n          if (scrollToSelected && Object.prototype.hasOwnProperty.call(changes, 'isOpen')) {\n            return {\n              ...changes,\n              highlightedIndex: changes.isOpen ? items.indexOf(state.selectedItem as DropdownItem) : null,\n            };\n          }\n          return changes;\n        }}\n      >\n        {({\n          getItemProps,\n          getToggleButtonProps,\n          isOpen,\n          selectedItem,\n          highlightedIndex,\n          setHighlightedIndex,\n        }) => (\n          <div>\n            <div\n              ref={triggerRef}\n              onFocus={onFocusHandler}\n              onBlur={onBlurHandler}\n              className={cx(\n                styles.dropdownInput,\n                { [styles.dropdownInputPlain]: plainStyle },\n                dropDownInputClassName\n              )}\n            >\n              <button\n                tabIndex={tabIndex}\n                type=\"button\"\n                disabled={disabled}\n                style={isDropdownListWider ? { padding: '6px', border: 'none' } : {}}\n                className={cx(\n                  styles.dropdownInputButton,\n                  { [styles.dropdownInputButtonDisabled]: disabled },\n                  inputClassName\n                )}\n                {...getToggleButtonProps()}\n                onClick={(e: React.MouseEvent<HTMLButtonElement>) => {\n                  getToggleButtonProps().onClick?.(e);\n                  onClick?.(e);\n                }}\n                ref={reactRef}\n              >\n                {/* Non-breaking space when blank (same text-node layout as a\n                    real value) so the button keeps a full line of height. */}\n                {isDisplayBlank ? '\\u00A0' : displayValue}\n              </button>\n              <button\n                type=\"button\"\n                tabIndex={-1}\n                disabled={disabled}\n                className={cx(styles.dropdownInputButtonIcon, dropDownIconClassName)}\n                {...getToggleButtonProps()}\n                onClick={(e: React.MouseEvent<HTMLButtonElement>) => {\n                  getToggleButtonProps().onClick?.(e);\n                  onClick?.(e);\n                }}\n              >\n                {!disabled && (\n                  <FontAwesomeIcon\n                    icon={dropdownIcon}\n                    className={cx(styles.dropdownInputButtonIconArrow, {\n                      [styles.dropdownInputButtonIconArrowOpen]: isOpen,\n                    })}\n                  />\n                )}\n              </button>\n              {!disabled && isOpen ? (\n                <BodyEnd>\n                  <div\n                    ref={anchorRef}\n                    className={cx(styles.dropdownInputListAnim, {\n                      [styles.dropdownInputListAnimWider]: isDropdownListWider,\n                    })}\n                    style={{ width: `${triggerWidth}px` }}\n                  >\n                    <InfiniteBlock\n                      onScroll={onScroll}\n                      className={styles.dropdownInputList}\n                      setHighlightedIndex={setHighlightedIndex}\n                    >\n                      {items.map((item: DropdownItem, index: number) => (\n                        <div\n                          key={item.key}\n                          {...getItemProps({ index, item, disabled: !!item.disabled })}\n                          className={cx(styles.dropdownInputListItem, dropDownClassName, {\n                            [styles.dropdownInputListItemActive]: highlightedIndex === index,\n                            [styles.dropdownInputListItemSelected]: selectedItem === item,\n                            [styles.dropdownInputListItemDisabled]: !!item.disabled,\n                          })}\n                        >\n                          {item.label}\n                        </div>\n                      ))}\n                    </InfiniteBlock>\n                  </div>\n                </BodyEnd>\n              ) : null}\n              <fieldset\n                className={cx(styles.dropdownFieldset, {\n                  [styles.dropdownBorderPlain]: plainStyle,\n                  [styles.dropdownBorderFocused]: isFocused,\n                  [styles.dropdownBorderInvalid]: hasErr,\n                  [styles.dropdownBorderError]: hasErr,\n                })}\n              >\n                <legend\n                  className={cx(styles.dropdownFieldsetLegend, {\n                    [styles.dropdownFieldsetLegendActive]:\n                      useMatLabelStyle && (alwaysFloatLabel || isFocused || !isDisplayBlank),\n                  })}\n                >\n                  <span>{editedLabel}</span>\n                </legend>\n              </fieldset>\n              {useMatLabelStyle && label && (\n                <div\n                  className={cx(styles.dropdownMatLabel, {\n                    [styles.dropdownMatLabelFloating]: alwaysFloatLabel || isFocused || !isDisplayBlank,\n                  })}\n                >\n                  {label}\n                  {requiredMark}\n                </div>\n              )}\n              {useMatLabelStyle && placeholder && (\n                <div\n                  className={cx(\n                    styles.dropdownPlaceholder,\n                    isFocused && !dropdownLabel && styles.dropdownPlaceholderShown\n                  )}\n                >\n                  {placeholder}\n                </div>\n              )}\n            </div>\n          </div>\n        )}\n      </Downshift>\n      {label && !useMatLabelStyle && (\n        <div className={cx(styles.dropdownLabelText, labelClassName)}>\n          {label}\n          {requiredMark}\n        </div>\n      )}\n      <Tooltip\n        variant=\"error\"\n        message={formValidator ? formValidator.getCurrentErrorMessage() : (errorMessage || '')}\n        isVisible={hasErr && (isFocused || isHovered)}\n      />\n    </div>\n  );\n}\n\nexport default Dropdown;\n"],"mappings":"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"}

package/dist/esm/common/dropdown/dropdown.module.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown.module.mjs","names":[],"sources":["../../../../package/common/dropdown/dropdown.module.pcss"],"sourcesContent":["\n.required-mark {\n  padding: 0px 0px 0px 4px;\n  color: var(--error-font-color);\n}\n\n.dropdown {\n  position: relative;\n\n  &-label {\n    display: flex;\n\n    &-column {\n      flex-direction: column;\n    }\n\n    &-text {\n      white-space: nowrap;\n      margin-right: 5px;\n      margin-bottom: 5px;\n      display: flex;\n      align-items: center;\n      color: var(--text-color);\n      font-size: 12px;\n      position: absolute;\n      top: -15px;\n    }\n  }\n\n  &-input {\n    position: relative;\n    cursor: pointer;\n    background-color: var(--input-background);\n    border-radius: var(--default-border-radius);\n\n    &-plain {\n      background: transparent;\n    }\n\n    &:focus-within {\n      outline: none;\n    }\n\n    &-button {\n      padding: 7px 20% 7px 7.5px !important;\n      background-color: transparent;\n      border: none;\n      font-family: inherit;\n      font-size: inherit;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n      cursor: pointer;\n      text-align: left;\n      width: 100%;\n      line-height: 1.25;\n      color: var(--text-color);\n\n      &-disabled {\n        background-color: var(--disabled-input-color);\n        color: var(--disabled-font-color);\n        border-radius: var(--default-border-radius);\n      }\n\n      &:focus {\n        outline: none;\n      }\n\n      &-icon {\n        float: right;\n        background-color: transparent;\n        border: none;\n        position: absolute;\n        outline: none;\n        right: var(--spacing-s);\n        top: 50%;\n        transform: translateY(-50%);\n        color: var(--text-color);\n        cursor: pointer;\n\n        &-arrow {\n          transition: transform 0.25s;\n          pointer-events: none;\n\n          &-open {\n            transform: rotate(180deg);\n          }\n        }\n      }\n    }\n\n    &-list-anim {\n      position: fixed;\n      z-index: 1;\n      color: var(--text-color);\n      background: var(--background-modal);\n      box-shadow: var(--card-shadow);\n      border-radius: var(--default-border-radius);\n      overflow: hidden;\n      transform: scaleY(1);\n      transition: transform 0.25s;\n      transform-origin: right top;\n\n      &-flip {\n        transform-origin: right bottom;\n      }\n\n      &-wider {\n        width: max-content !important;\n      }\n    }\n\n    &-list {\n      width: 100%;\n      display: flex;\n      flex-direction: column;\n      overflow-y: auto;\n      max-height: 160px;\n      list-style-type: none;\n\n      &-item {\n        border: none;\n        cursor: pointer;\n        background-color: var(--background-modal);\n        padding: 8px;\n        text-align: left;\n        border-radius: 0;\n        transition: all 0.3s;\n\n        &-active {\n          background-color: var(--background-accent);\n        }\n\n        &-selected {\n          font-weight: 500;\n        }\n\n        &:focus {\n          outline: none;\n        }\n\n        &:hover {\n          background-color: var(--background-accent);\n        }\n\n        &-disabled {\n          background-color: var(--disabled-input-color);\n          color: var(--disabled-font-color);\n          cursor: not-allowed;\n\n          &:hover {\n            background-color: var(--disabled-input-color);\n          }\n        }\n      }\n\n      &-hidden {\n        transform: scaleY(0);\n      }\n    }\n  }\n\n  &-fieldset {\n    position: absolute;\n    width: 100%;\n    margin: 0;\n    box-sizing: border-box;\n    border-radius: var(--default-border-radius);\n    inset: -10px 0 0 0;\n    padding-left: 8px;\n    border-width: 1px;\n    border-style: solid;\n    border-color: var(--border-color);\n    pointer-events: none;\n    user-select: none;\n\n    &-legend {\n      display: block;\n      max-width: 0;\n      transition: max-width 0.2s;\n      white-space: nowrap;\n      padding: 0;\n\n      &-active {\n        max-width: 300px;\n      }\n\n      span {\n        font-size: 13px;\n        padding: 5px;\n        opacity: 0;\n      }\n\n      /* With an empty label the span would still reserve its padding, leaving a gap in\n         the fieldset's top border. Collapse it so the notch closes when there's no label. */\n      span:empty {\n        padding: 0.000001px;\n      }\n    }\n  }\n\n  &-placeholder {\n    position: absolute;\n    top: 8px;\n    left: 7px;\n    transition: all 0.2s;\n    opacity: 0;\n\n    &-shown {\n      animation: 0.2s fadeIn 0.3s forwards;\n    }\n  }\n\n  &-matLabel {\n    position: absolute;\n    transition: all 0.3s;\n    inset: 9px 0 0 7px;\n    font-size: 16px;\n    color: var(--input-label-resting-color, var(--text-light));\n    pointer-events: none;\n    user-select: none;\n\n    &-floating {\n      inset: -9px 0 0 14px;\n      font-size: 13px;\n      color: var(--input-label-floating-color, var(--text-color));\n    }\n  }\n\n  @keyframes fadeIn {\n    from {\n      opacity: 0;\n    }\n    to {\n      opacity: 0.5;\n    }\n  }\n\n  &-border {\n    outline: 1px solid var(--border-color);\n    transition: border-color;\n    background-color: var(--input-background);\n    outline: none;\n\n    &-focused {\n      outline-color: var(--primary-color);\n      border-color: var(--primary-color);\n    }\n\n    &-searchFocused {\n      outline-color: var(--search-input-color);\n      outline-width: 2px;\n      border-color: var(--search-input-color);\n    }\n\n    &-plain {\n      border-color: transparent;\n      outline-color: transparent;\n    }\n\n    &-invalid {\n      outline-color: var(--error-border-color);\n      border-color: var(--error-border-color);\n    }\n\n    &-invalid:hover {\n      outline-color: var(--error-border-color);\n      border-color: var(--error-border-color);\n    }\n\n    &-error {\n      outline-color: var(--error-border-color);\n      border-color: var(--error-border-color);\n    }\n  }\n}\n"],"mappings":""}
+{"version":3,"file":"dropdown.module.mjs","names":[],"sources":["../../../../package/common/dropdown/dropdown.module.pcss"],"sourcesContent":["\n.required-mark {\n  padding: 0px 0px 0px 4px;\n  color: var(--required-mark-color, var(--error-color));\n}\n\n.dropdown {\n  position: relative;\n\n  &-label {\n    display: flex;\n\n    &-column {\n      flex-direction: column;\n    }\n\n    &-text {\n      white-space: nowrap;\n      margin-right: 5px;\n      margin-bottom: 5px;\n      display: flex;\n      align-items: center;\n      color: var(--text-color);\n      font-size: 12px;\n      position: absolute;\n      top: -15px;\n    }\n  }\n\n  &-input {\n    position: relative;\n    cursor: pointer;\n    background-color: var(--input-background);\n    border-radius: var(--default-border-radius);\n\n    &-plain {\n      background: transparent;\n    }\n\n    &:focus-within {\n      outline: none;\n    }\n\n    &-button {\n      padding: 7px 20% 7px 7.5px !important;\n      background-color: transparent;\n      border: none;\n      font-family: inherit;\n      font-size: inherit;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n      cursor: pointer;\n      text-align: left;\n      width: 100%;\n      line-height: 1.25;\n      color: var(--text-color);\n\n      &-disabled {\n        background-color: var(--disabled-input-color);\n        color: var(--disabled-font-color);\n        border-radius: var(--default-border-radius);\n      }\n\n      &:focus {\n        outline: none;\n      }\n\n      &-icon {\n        float: right;\n        background-color: transparent;\n        border: none;\n        position: absolute;\n        outline: none;\n        right: var(--spacing-s);\n        top: 50%;\n        transform: translateY(-50%);\n        color: var(--text-color);\n        cursor: pointer;\n\n        &-arrow {\n          transition: transform 0.25s;\n          pointer-events: none;\n\n          &-open {\n            transform: rotate(180deg);\n          }\n        }\n      }\n    }\n\n    &-list-anim {\n      position: fixed;\n      z-index: 1;\n      color: var(--text-color);\n      background: var(--background-modal);\n      box-shadow: var(--card-shadow);\n      border-radius: var(--default-border-radius);\n      overflow: hidden;\n      transform: scaleY(1);\n      transition: transform 0.25s;\n      transform-origin: right top;\n\n      &-flip {\n        transform-origin: right bottom;\n      }\n\n      &-wider {\n        width: max-content !important;\n      }\n    }\n\n    &-list {\n      width: 100%;\n      display: flex;\n      flex-direction: column;\n      overflow-y: auto;\n      max-height: 160px;\n      list-style-type: none;\n\n      &-item {\n        border: none;\n        cursor: pointer;\n        background-color: var(--background-modal);\n        padding: 8px;\n        text-align: left;\n        border-radius: 0;\n        transition: all 0.3s;\n\n        &-active {\n          background-color: var(--background-accent);\n        }\n\n        &-selected {\n          font-weight: 500;\n        }\n\n        &:focus {\n          outline: none;\n        }\n\n        &:hover {\n          background-color: var(--background-accent);\n        }\n\n        &-disabled {\n          background-color: var(--disabled-input-color);\n          color: var(--disabled-font-color);\n          cursor: not-allowed;\n\n          &:hover {\n            background-color: var(--disabled-input-color);\n          }\n        }\n      }\n\n      &-hidden {\n        transform: scaleY(0);\n      }\n    }\n  }\n\n  &-fieldset {\n    position: absolute;\n    width: 100%;\n    margin: 0;\n    box-sizing: border-box;\n    border-radius: var(--default-border-radius);\n    inset: -10px 0 0 0;\n    padding-left: 8px;\n    border-width: 1px;\n    border-style: solid;\n    border-color: var(--border-color);\n    pointer-events: none;\n    user-select: none;\n\n    &-legend {\n      display: block;\n      max-width: 0;\n      transition: max-width 0.2s;\n      white-space: nowrap;\n      padding: 0;\n\n      &-active {\n        max-width: 300px;\n      }\n\n      span {\n        font-size: 13px;\n        padding: 5px;\n        opacity: 0;\n      }\n\n      /* With an empty label the span would still reserve its padding, leaving a gap in\n         the fieldset's top border. Collapse it so the notch closes when there's no label. */\n      span:empty {\n        padding: 0.000001px;\n      }\n    }\n  }\n\n  &-placeholder {\n    position: absolute;\n    top: 8px;\n    left: 7px;\n    transition: all 0.2s;\n    opacity: 0;\n\n    &-shown {\n      animation: 0.2s fadeIn 0.3s forwards;\n    }\n  }\n\n  &-matLabel {\n    position: absolute;\n    transition: all 0.3s;\n    inset: 9px 0 0 7px;\n    font-size: 16px;\n    color: var(--input-label-resting-color, var(--text-light));\n    pointer-events: none;\n    user-select: none;\n\n    &-floating {\n      inset: -9px 0 0 14px;\n      font-size: 13px;\n      color: var(--input-label-floating-color, var(--text-color));\n    }\n  }\n\n  @keyframes fadeIn {\n    from {\n      opacity: 0;\n    }\n    to {\n      opacity: 0.5;\n    }\n  }\n\n  &-border {\n    outline: 1px solid var(--border-color);\n    transition: border-color;\n    background-color: var(--input-background);\n    outline: none;\n\n    &-focused {\n      outline-color: var(--primary-color);\n      border-color: var(--primary-color);\n    }\n\n    &-searchFocused {\n      outline-color: var(--search-input-color);\n      outline-width: 2px;\n      border-color: var(--search-input-color);\n    }\n\n    &-plain {\n      border-color: transparent;\n      outline-color: transparent;\n    }\n\n    &-invalid {\n      outline-color: var(--error-border-color);\n      border-color: var(--error-border-color);\n    }\n\n    &-invalid:hover {\n      outline-color: var(--error-border-color);\n      border-color: var(--error-border-color);\n    }\n\n    &-error {\n      outline-color: var(--error-border-color);\n      border-color: var(--error-border-color);\n    }\n  }\n}\n"],"mappings":""}

package/dist/esm/common/input/input.mjs

@@ -1,2 +1,2 @@
-import{useComponentDefaults as e}from"../configProvider/useComponentDefaults.mjs";import t from"../tooltip/tooltip.mjs";import n from"./input.module.mjs";import{InputType as r}from"./input.types.mjs";import i,{useCallback as ee,useEffect as a,useId as te,useRef as ne,useState as o}from"react";import s from"classnames";import{FontAwesomeIcon as c}from"@fortawesome/react-fontawesome";import{faEnvelope as re,faEye as ie,faEyeSlash as ae,faPen as oe,faPhone as se,faSearch as ce,faXmark as le}from"@fortawesome/free-solid-svg-icons";import{jsx as l,jsxs as u}from"react/jsx-runtime";function d(d){let{name:f=``,id:ue,label:p=``,errorMessage:m=``,isValid:de=!0,className:fe=``,style:pe,value:h=``,icon:g=null,onChange:_=()=>{},onFocus:v=null,onBlur:y=null,onMouseEnter:b=null,onMouseLeave:x=null,isUppercase:me=!1,isRequired:he=!1,tabIndex:ge=0,type:S=void 0,isRow:_e=!1,onIconClick:C=null,parse:w=null,formValidator:T=null,autoFocus:E=!1,suffix:D=null,upperRightLabel:O=null,labelInBorder:ve=!1,showCancel:ye=!1,onClearClicked:be,min:xe=null,max:Se=null,placeholder:k=``,useMatLabelStyle:A=!0,alwaysFloatLabel:Ce=!1,autoComplete:we=null,onClick:Te=()=>null,readOnly:Ee=!1,customInput:j,alwaysShowCancel:De=!1,multiline:M=!1,rows:N,autoResize:P=!1,classNames:F,styles:I,disabled:Oe=!1,...ke}=e(`Input`,d),[L,R]=o(!1),[z,B]=o(!1),[V,Ae]=o(!1),[,je]=o(0),H=ne(null),U=ne(T),Me=te(),W=ue||f||Me,G=ee(()=>{let e=H.current;!e||!P||(e.style.height=`auto`,e.style.height=`${e.scrollHeight}px`)},[P]);a(()=>{G()},[]),a(()=>{E&&H.current&&setTimeout(()=>{H.current?.focus()},1)},[E]),a(()=>{U.current=T;let e=U.current;if(!e)return;e.label=p??``,e.validate();let t=()=>je(e=>e+1);return e.registerOnUpdateListener(t),()=>{e.removeOnUpdateListener(t)}},[T,p]);let Ne=()=>T?T.touched&&T.hasError():!de||!!m,K=()=>!!(he||T&&T.validators.find(e=>e.validatorId===`required`)),Pe=e=>{B(!0),b&&b(e)},Fe=e=>{B(!1),x&&x(e)},Ie=e=>{R(!0),v&&v(e)},Le=e=>{U.current&&(U.current.touched=!0),R(!1),y&&y(e)},Re=e=>{let t,n;typeof e==`string`?n=e:(t=e,n=e.target.value),w&&(n=w(n)),T&&T.set(n),_&&_(n,t),G()},ze=()=>{if(S!==`email`)return S===`password`&&V?`text`:S},q=S&&S!==r.Date&&S!==r.Iban&&S!==r.HasNoIcon,J=q&&!A&&(S===r.Email||S===r.Phone||S===r.Search),Y={className:s(n.inputFieldIcon,{[n.inputFieldIconNotClickable]:!C,[n.inputFieldIconLeft]:J}),onClick:C??void 0},X=g,Be=X?i.cloneElement(X,{className:s(n.inputFieldIcon,{[n.inputFieldIconNotClickable]:!C&&!X.props.onClick},X.props.className),onClick:C??X.props.onClick}):null,Ve=!!g,He={className:s(n.inputFieldIcon,n.inputFieldIconPassword),onClick:()=>Ae(!V)},Z=Ne(),Q=p;Q&&K()&&(Q=`${Q} *`);let Ue=T?T.value:h,$=A&&(Ce||L||Ue||S===r.Date);return u(`div`,{className:s(n.input,fe),style:pe,children:[u(`label`,{htmlFor:W,className:s(n.inputLabel,F?.label,{[n.inputLabelColumn]:!_e,[n.inputLabelInBorder]:ve}),style:I?.label,children:[Q&&!A?u(`span`,{className:n.inputLabelText,children:[`${Q} `,K()?l(`span`,{className:s(n.isRequired),children:`\xA0 *`}):null]}):null,O&&l(`div`,{className:s(n.inputUpperRightLabel,F?.upperRightLabel),style:I?.upperRightLabel,children:O}),u(`div`,{className:s(n.inputContainer,{[n.inputContainerMultiline]:M},F?.container),style:I?.container,onMouseEnter:Pe,onMouseLeave:Fe,children:[Be,i.cloneElement(j||l(M?`textarea`:`input`,{}),{...ke,className:s(n.inputField,{[n.inputFieldUppercase]:me,[n.inputFieldDate]:S===r.Date,[n.inputFieldDefault]:S!==r.Date,[n.inputFieldWithIcon]:q||Ve,[n.inputFieldWithIconLeft]:J,[n.inputFieldMultiline]:M,[n.inputFieldMultilineAutoResize]:M&&P},F?.input),name:f,id:W,value:T?T.value:h,tabIndex:ge,ref:j?void 0:H,onChange:Re,onFocus:Ie,onBlur:Le,placeholder:A?``:k,autoComplete:we,onClick:Te,readOnly:Ee,disabled:Oe,...!M&&{type:ze(),min:xe,max:Se},...M&&N!==void 0&&{rows:N}}),D&&l(`div`,{className:s(n.inputFieldSuffix,F?.suffix),style:I?.suffix,children:D})]}),l(`fieldset`,{className:s(n.inputFieldset,F?.fieldset,{[n.inputContainerBorderFocused]:L,[n.inputContainerBorderSearchFocused]:S===r.Search&&(L||h),[n.inputContainerBorderInvalid]:Z,[n.inputContainerBorderError]:Z}),style:I?.fieldset,children:l(`legend`,{className:s(n.inputFieldsetLegend,{[n.inputFieldsetLegendActive]:$}),children:l(`span`,{children:Q})})}),A&&p&&l(`div`,{className:s(n.inputMatLabel,{[n.inputMatLabelFloating]:$,[n.inputMatLabelMultiline]:M&&!$}),children:Q}),A&&k&&l(`div`,{className:s(n.inputPlaceholder,L&&!Ue&&n.inputPlaceholderShown,M&&n.inputPlaceholderMultiline),children:k}),l(t,{variant:`error`,message:T?T.getCurrentErrorMessage():m||``,isVisible:Z&&(L||z)})]}),S===r.Phone&&l(c,{icon:se,...Y}),S===r.Email&&l(c,{icon:re,...Y}),S===r.Edit&&l(c,{icon:oe,...Y}),S===r.Search&&l(c,{icon:ce,...Y}),S===r.Password&&l(c,{icon:V?ae:ie,...He}),(ye&&h&&(L||z)||De)&&l(c,{icon:le,className:n.inputFieldIcon,onClick:be??void 0,onMouseEnter:()=>B(!0),onMouseLeave:()=>B(!1)})]})}export{d as default};
+import{useComponentDefaults as e}from"../configProvider/useComponentDefaults.mjs";import t from"../tooltip/tooltip.mjs";import n from"./input.module.mjs";import{InputType as r}from"./input.types.mjs";import i,{useCallback as ee,useEffect as a,useId as te,useRef as o,useState as s}from"react";import c from"classnames";import{FontAwesomeIcon as l}from"@fortawesome/react-fontawesome";import{faEnvelope as ne,faEye as re,faEyeSlash as ie,faPen as ae,faPhone as oe,faSearch as se,faXmark as ce}from"@fortawesome/free-solid-svg-icons";import{jsx as u,jsxs as d}from"react/jsx-runtime";function le(le){let{name:f=``,id:ue,label:p=``,errorMessage:m=``,isValid:de=!0,className:fe=``,style:pe,value:h=``,icon:g=null,onChange:_=()=>{},onFocus:v=null,onBlur:y=null,onMouseEnter:b=null,onMouseLeave:x=null,isUppercase:me=!1,isRequired:he=!1,tabIndex:ge=0,type:S=void 0,isRow:_e=!1,onIconClick:C=null,parse:w=null,formValidator:T=null,autoFocus:E=!1,suffix:D=null,upperRightLabel:O=null,labelInBorder:ve=!1,showCancel:ye=!1,onClearClicked:be,min:xe=null,max:Se=null,placeholder:k=``,useMatLabelStyle:A=!0,alwaysFloatLabel:Ce=!1,autoComplete:we=null,onClick:Te=()=>null,readOnly:Ee=!1,customInput:j,alwaysShowCancel:De=!1,multiline:M=!1,rows:N,autoResize:P=!1,classNames:F,styles:I,disabled:Oe=!1,...ke}=e(`Input`,le),[L,R]=s(!1),[z,B]=s(!1),[V,Ae]=s(!1),[,je]=s(0),H=o(null),U=o(T),Me=te(),W=ue||f||Me,G=ee(()=>{let e=H.current;!e||!P||(e.style.height=`auto`,e.style.height=`${e.scrollHeight}px`)},[P]);a(()=>{G()},[]),a(()=>{E&&H.current&&setTimeout(()=>{H.current?.focus()},1)},[E]),a(()=>{U.current=T;let e=U.current;if(!e)return;e.label=p??``,e.validate();let t=()=>je(e=>e+1);return e.registerOnUpdateListener(t),()=>{e.removeOnUpdateListener(t)}},[T,p]);let Ne=()=>T?T.touched&&T.hasError():!de||!!m,K=()=>!!(he||T&&T.validators.find(e=>e.validatorId===`required`)),Pe=e=>{B(!0),b&&b(e)},Fe=e=>{B(!1),x&&x(e)},Ie=e=>{R(!0),v&&v(e)},Le=e=>{U.current&&(U.current.touched=!0),R(!1),y&&y(e)},Re=e=>{let t,n;typeof e==`string`?n=e:(t=e,n=e.target.value),w&&(n=w(n)),T&&T.set(n),_&&_(n,t),G()},ze=()=>{if(S!==`email`)return S===`password`&&V?`text`:S},q=S&&S!==r.Date&&S!==r.Iban&&S!==r.HasNoIcon,J=q&&!A&&(S===r.Email||S===r.Phone||S===r.Search),Y={className:c(n.inputFieldIcon,{[n.inputFieldIconNotClickable]:!C,[n.inputFieldIconLeft]:J}),onClick:C??void 0},X=g,Be=X?i.cloneElement(X,{className:c(n.inputFieldIcon,{[n.inputFieldIconNotClickable]:!C&&!X.props.onClick},X.props.className),onClick:C??X.props.onClick}):null,Ve=!!g,He={className:c(n.inputFieldIcon,n.inputFieldIconPassword),onClick:()=>Ae(!V)},Z=Ne(),Q=p;Q&&K()&&(Q=`${Q} *`);let Ue=K()?u(`span`,{className:n.requiredMark,children:`*`}):null,We=T?T.value:h,$=A&&(Ce||L||We||S===r.Date);return d(`div`,{className:c(n.input,fe),style:pe,children:[d(`label`,{htmlFor:W,className:c(n.inputLabel,F?.label,{[n.inputLabelColumn]:!_e,[n.inputLabelInBorder]:ve}),style:I?.label,children:[p&&!A?d(`span`,{className:n.inputLabelText,children:[p,Ue]}):null,O&&u(`div`,{className:c(n.inputUpperRightLabel,F?.upperRightLabel),style:I?.upperRightLabel,children:O}),d(`div`,{className:c(n.inputContainer,{[n.inputContainerMultiline]:M},F?.container),style:I?.container,onMouseEnter:Pe,onMouseLeave:Fe,children:[Be,i.cloneElement(j||u(M?`textarea`:`input`,{}),{...ke,className:c(n.inputField,{[n.inputFieldUppercase]:me,[n.inputFieldDate]:S===r.Date,[n.inputFieldDefault]:S!==r.Date,[n.inputFieldWithIcon]:q||Ve,[n.inputFieldWithIconLeft]:J,[n.inputFieldMultiline]:M,[n.inputFieldMultilineAutoResize]:M&&P},F?.input),name:f,id:W,value:T?T.value:h,tabIndex:ge,ref:j?void 0:H,onChange:Re,onFocus:Ie,onBlur:Le,placeholder:A?``:k,autoComplete:we,onClick:Te,readOnly:Ee,disabled:Oe,...!M&&{type:ze(),min:xe,max:Se},...M&&N!==void 0&&{rows:N}}),D&&u(`div`,{className:c(n.inputFieldSuffix,F?.suffix),style:I?.suffix,children:D})]}),u(`fieldset`,{className:c(n.inputFieldset,F?.fieldset,{[n.inputContainerBorderFocused]:L,[n.inputContainerBorderSearchFocused]:S===r.Search&&(L||h),[n.inputContainerBorderInvalid]:Z,[n.inputContainerBorderError]:Z}),style:I?.fieldset,children:u(`legend`,{className:c(n.inputFieldsetLegend,{[n.inputFieldsetLegendActive]:$}),children:u(`span`,{children:Q})})}),A&&p&&d(`div`,{className:c(n.inputMatLabel,{[n.inputMatLabelFloating]:$,[n.inputMatLabelMultiline]:M&&!$}),children:[p,Ue]}),A&&k&&u(`div`,{className:c(n.inputPlaceholder,L&&!We&&n.inputPlaceholderShown,M&&n.inputPlaceholderMultiline),children:k}),u(t,{variant:`error`,message:T?T.getCurrentErrorMessage():m||``,isVisible:Z&&(L||z)})]}),S===r.Phone&&u(l,{icon:oe,...Y}),S===r.Email&&u(l,{icon:ne,...Y}),S===r.Edit&&u(l,{icon:ae,...Y}),S===r.Search&&u(l,{icon:se,...Y}),S===r.Password&&u(l,{icon:V?ie:re,...He}),(ye&&h&&(L||z)||De)&&u(l,{icon:ce,className:n.inputFieldIcon,onClick:be??void 0,onMouseEnter:()=>B(!0),onMouseLeave:()=>B(!1)})]})}export{le as default};
 //# sourceMappingURL=input.mjs.map

package/dist/esm/common/input/input.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"input.mjs","names":[],"sources":["../../../../package/common/input/input.tsx"],"sourcesContent":["import React, { useState, useEffect, useRef, useCallback, useId } from 'react';\nimport cx from 'classnames';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport {\n  faPhone,\n  faPen,\n  faEnvelope,\n  faSearch,\n  faXmark,\n  faEye as passwordHiddenIcon,\n  faEyeSlash as passwordShownIcon,\n} from '@fortawesome/free-solid-svg-icons';\nimport Tooltip from 'components/common/tooltip';\nimport { useComponentDefaults } from 'components/common/configProvider';\nimport styles from './input.module.pcss';\nimport type { InputProps } from './input.types';\nimport { InputType } from './input.types';\n\nfunction Input(props: InputProps) {\n  const {\n  name = '',\n  id,\n  label = '',\n  errorMessage = '',\n  isValid = true,\n  className = '',\n  style,\n  value = '',\n  icon = null,\n  onChange = () => {},\n  onFocus: onFocusProp = null,\n  onBlur: onBlurProp = null,\n  onMouseEnter: onMouseEnterProp = null,\n  onMouseLeave: onMouseLeaveProp = null,\n  isUppercase = false,\n  isRequired = false,\n  tabIndex = 0,\n  type = undefined,\n  isRow = false,\n  onIconClick = null,\n  parse = null,\n  formValidator = null,\n  autoFocus = false,\n  suffix = null,\n  upperRightLabel = null,\n  labelInBorder = false,\n  showCancel = false,\n  onClearClicked,\n  min = null,\n  max = null,\n  placeholder = '',\n  useMatLabelStyle = true,\n  alwaysFloatLabel = false,\n  autoComplete = null,\n  onClick = () => null,\n  readOnly = false,\n  customInput,\n  alwaysShowCancel = false,\n  multiline = false,\n  rows,\n  autoResize = false,\n  classNames,\n  styles: slotStyles,\n  disabled = false,\n  ...rest\n  } = useComponentDefaults('Input', props);\n  const [isFocused, setIsFocused] = useState(false);\n  const [isHovered, setIsHovered] = useState(false);\n  const [isPasswordShown, setIsPasswordShown] = useState(false);\n  const [, forceUpdate] = useState(0);\n\n  const inputRef = useRef<HTMLInputElement | HTMLTextAreaElement>(null);\n  const fvRef = useRef(formValidator);\n\n  const generatedId = useId();\n  const inputId = id || name || generatedId;\n\n  const resizeTextarea = useCallback(() => {\n    const el = inputRef.current;\n    if (!el || !autoResize) return;\n    el.style.height = 'auto';\n    el.style.height = `${el.scrollHeight}px`;\n  }, [autoResize]);\n\n  useEffect(() => {\n    resizeTextarea();\n  }, []);\n\n  useEffect(() => {\n    if (autoFocus && inputRef.current) {\n      setTimeout(() => { inputRef.current?.focus(); }, 1);\n    }\n  }, [autoFocus]);\n\n  useEffect(() => {\n    fvRef.current = formValidator;\n    const fv = fvRef.current;\n    if (!fv) return;\n    fv.label = label ?? '';\n    fv.validate();\n    const listener = () => forceUpdate(n => n + 1);\n    fv.registerOnUpdateListener(listener);\n    return () => { fv.removeOnUpdateListener(listener); };\n  }, [formValidator, label]);\n\n  const hasError = (): boolean => {\n    return formValidator\n      ? (formValidator.touched && formValidator.hasError())\n      : (!isValid || !!errorMessage);\n  };\n\n  const computedIsRequired = (): boolean => {\n    return !!(isRequired || (formValidator && formValidator.validators.find(\n      (v) => (v as { validatorId?: string }).validatorId === 'required'\n    )));\n  };\n\n  const onMouseEnterHandler = (event: React.MouseEvent) => {\n    setIsHovered(true);\n    if (onMouseEnterProp) onMouseEnterProp(event);\n  };\n\n  const onMouseLeaveHandler = (event: React.MouseEvent) => {\n    setIsHovered(false);\n    if (onMouseLeaveProp) onMouseLeaveProp(event);\n  };\n\n  const onFocusHandler = (event: React.FocusEvent) => {\n    setIsFocused(true);\n    if (onFocusProp) onFocusProp(event);\n  };\n\n  const onBlurHandler = (event: React.FocusEvent) => {\n    if (fvRef.current) fvRef.current.touched = true;\n    setIsFocused(false);\n    if (onBlurProp) onBlurProp(event);\n  };\n\n  const onChangeHandler = (event: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement> | string): void => {\n    let parsedEvent: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement> | undefined;\n    let val: string;\n\n    if (typeof event !== 'string') {\n      parsedEvent = event;\n      val = event.target.value;\n    } else {\n      val = event;\n    }\n\n    if (parse) val = parse(val);\n    if (formValidator) formValidator.set(val);\n    if (onChange) onChange(val, parsedEvent);\n    resizeTextarea();\n  };\n\n  const getInputType = (): string | undefined => {\n    if (type === 'email') return undefined;\n    if (type === 'password' && isPasswordShown) return 'text';\n    return type;\n  };\n\n  const hasIcon =\n    type &&\n    type !== InputType.Date &&\n    type !== InputType.Iban &&\n    type !== InputType.HasNoIcon;\n\n  const hasIconLeft =\n    hasIcon && !useMatLabelStyle &&\n    (type === InputType.Email || type === InputType.Phone || type === InputType.Search);\n\n  const iconProps = {\n    className: cx(styles.inputFieldIcon, {\n      [styles.inputFieldIconNotClickable]: !onIconClick,\n      [styles.inputFieldIconLeft]: hasIconLeft,\n    }),\n    onClick: onIconClick ?? undefined,\n  };\n\n  const customIcon = icon as React.ReactElement<{ className?: string; onClick?: React.MouseEventHandler }> | null;\n  const renderedIcon = customIcon\n    ? React.cloneElement(customIcon, {\n        className: cx(\n          styles.inputFieldIcon,\n          { [styles.inputFieldIconNotClickable]: !onIconClick && !customIcon.props.onClick },\n          customIcon.props.className,\n        ),\n        onClick: onIconClick ?? customIcon.props.onClick,\n      })\n    : null;\n  const hasCustomIcon = !!icon;\n\n  const passwordIconProps = {\n    className: cx(styles.inputFieldIcon, styles.inputFieldIconPassword),\n    onClick: () => setIsPasswordShown(!isPasswordShown),\n  };\n\n  const hasErr = hasError();\n\n  let editedLabel = label;\n  if (editedLabel && computedIsRequired()) editedLabel = `${editedLabel} *`;\n\n  const currVal = formValidator ? formValidator.value : value;\n  const shouldFloatLabel = useMatLabelStyle && (alwaysFloatLabel || isFocused || currVal || type === InputType.Date);\n\n  return (\n    <div className={cx(styles.input, className)} style={style}>\n      <label\n        htmlFor={inputId}\n        className={cx(styles.inputLabel, classNames?.label, {\n          [styles.inputLabelColumn]: !isRow,\n          [styles.inputLabelInBorder]: labelInBorder,\n        })}\n        style={slotStyles?.label}\n      >\n        {editedLabel && !useMatLabelStyle ? (\n          <span className={styles.inputLabelText}>\n            {`${editedLabel} `}\n            {computedIsRequired() ? <span className={cx(styles.isRequired)}>&nbsp; *</span> : null}\n          </span>\n        ) : null}\n        {upperRightLabel && (\n          <div className={cx(styles.inputUpperRightLabel, classNames?.upperRightLabel)} style={slotStyles?.upperRightLabel}>\n            {upperRightLabel}\n          </div>\n        )}\n        <div\n          className={cx(styles.inputContainer, { [styles.inputContainerMultiline]: multiline }, classNames?.container)}\n          style={slotStyles?.container}\n          onMouseEnter={onMouseEnterHandler}\n          onMouseLeave={onMouseLeaveHandler}\n        >\n          {renderedIcon}\n          {React.cloneElement(customInput || (multiline ? <textarea /> : <input />), {\n            ...rest,\n            className: cx(\n              styles.inputField,\n              {\n                [styles.inputFieldUppercase]: isUppercase,\n                [styles.inputFieldDate]: type === InputType.Date,\n                [styles.inputFieldDefault]: type !== InputType.Date,\n                [styles.inputFieldWithIcon]: hasIcon || hasCustomIcon,\n                [styles.inputFieldWithIconLeft]: hasIconLeft,\n                [styles.inputFieldMultiline]: multiline,\n                [styles.inputFieldMultilineAutoResize]: multiline && autoResize,\n              },\n              classNames?.input\n            ),\n            name,\n            id: inputId,\n            value: formValidator ? formValidator.value : value,\n            tabIndex,\n            ref: customInput ? undefined : inputRef,\n            onChange: onChangeHandler,\n            onFocus: onFocusHandler,\n            onBlur: onBlurHandler,\n            placeholder: !useMatLabelStyle ? placeholder : '',\n            autoComplete,\n            onClick,\n            readOnly,\n            disabled,\n            ...(!multiline && { type: getInputType(), min, max }),\n            ...(multiline && rows !== undefined && { rows }),\n          })}\n          {suffix && <div className={cx(styles.inputFieldSuffix, classNames?.suffix)} style={slotStyles?.suffix}>{suffix}</div>}\n        </div>\n        <fieldset\n          className={cx(styles.inputFieldset, classNames?.fieldset, {\n            [styles.inputContainerBorderFocused]: isFocused,\n            [styles.inputContainerBorderSearchFocused]:\n              type === InputType.Search && (isFocused || value),\n            [styles.inputContainerBorderInvalid]: hasErr,\n            [styles.inputContainerBorderError]: hasErr,\n          })}\n          style={slotStyles?.fieldset}\n        >\n          <legend\n            className={cx(styles.inputFieldsetLegend, {\n              [styles.inputFieldsetLegendActive]: shouldFloatLabel,\n            })}\n          >\n            <span>{editedLabel}</span>\n          </legend>\n        </fieldset>\n        {useMatLabelStyle && label && (\n          <div\n            className={cx(styles.inputMatLabel, {\n              [styles.inputMatLabelFloating]: shouldFloatLabel,\n              [styles.inputMatLabelMultiline]: multiline && !shouldFloatLabel,\n            })}\n          >\n            {editedLabel}\n          </div>\n        )}\n        {useMatLabelStyle && placeholder && (\n          <div\n            className={cx(\n              styles.inputPlaceholder,\n              isFocused && !currVal && styles.inputPlaceholderShown,\n              multiline && styles.inputPlaceholderMultiline,\n            )}\n          >\n            {placeholder}\n          </div>\n        )}\n        <Tooltip\n          variant=\"error\"\n          message={formValidator ? formValidator.getCurrentErrorMessage() : (errorMessage || '')}\n          isVisible={hasErr && (isFocused || isHovered)}\n        />\n      </label>\n\n      {type === InputType.Phone && <FontAwesomeIcon icon={faPhone} {...iconProps} />}\n      {type === InputType.Email && <FontAwesomeIcon icon={faEnvelope} {...iconProps} />}\n      {type === InputType.Edit && <FontAwesomeIcon icon={faPen} {...iconProps} />}\n      {type === InputType.Search && <FontAwesomeIcon icon={faSearch} {...iconProps} />}\n      {type === InputType.Password && (\n        <FontAwesomeIcon\n          icon={isPasswordShown ? passwordShownIcon : passwordHiddenIcon}\n          {...passwordIconProps}\n        />\n      )}\n\n      {((showCancel && value && (isFocused || isHovered)) || alwaysShowCancel) && (\n        <FontAwesomeIcon\n          icon={faXmark}\n          className={styles.inputFieldIcon}\n          onClick={onClearClicked ?? undefined}\n          onMouseEnter={() => setIsHovered(true)}\n          onMouseLeave={() => setIsHovered(false)}\n        />\n      )}\n    </div>\n  );\n}\n\nexport default Input;\n"],"mappings":"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"}
+{"version":3,"file":"input.mjs","names":[],"sources":["../../../../package/common/input/input.tsx"],"sourcesContent":["import React, { useState, useEffect, useRef, useCallback, useId } from 'react';\nimport cx from 'classnames';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport {\n  faPhone,\n  faPen,\n  faEnvelope,\n  faSearch,\n  faXmark,\n  faEye as passwordHiddenIcon,\n  faEyeSlash as passwordShownIcon,\n} from '@fortawesome/free-solid-svg-icons';\nimport Tooltip from 'components/common/tooltip';\nimport { useComponentDefaults } from 'components/common/configProvider';\nimport styles from './input.module.pcss';\nimport type { InputProps } from './input.types';\nimport { InputType } from './input.types';\n\nfunction Input(props: InputProps) {\n  const {\n  name = '',\n  id,\n  label = '',\n  errorMessage = '',\n  isValid = true,\n  className = '',\n  style,\n  value = '',\n  icon = null,\n  onChange = () => {},\n  onFocus: onFocusProp = null,\n  onBlur: onBlurProp = null,\n  onMouseEnter: onMouseEnterProp = null,\n  onMouseLeave: onMouseLeaveProp = null,\n  isUppercase = false,\n  isRequired = false,\n  tabIndex = 0,\n  type = undefined,\n  isRow = false,\n  onIconClick = null,\n  parse = null,\n  formValidator = null,\n  autoFocus = false,\n  suffix = null,\n  upperRightLabel = null,\n  labelInBorder = false,\n  showCancel = false,\n  onClearClicked,\n  min = null,\n  max = null,\n  placeholder = '',\n  useMatLabelStyle = true,\n  alwaysFloatLabel = false,\n  autoComplete = null,\n  onClick = () => null,\n  readOnly = false,\n  customInput,\n  alwaysShowCancel = false,\n  multiline = false,\n  rows,\n  autoResize = false,\n  classNames,\n  styles: slotStyles,\n  disabled = false,\n  ...rest\n  } = useComponentDefaults('Input', props);\n  const [isFocused, setIsFocused] = useState(false);\n  const [isHovered, setIsHovered] = useState(false);\n  const [isPasswordShown, setIsPasswordShown] = useState(false);\n  const [, forceUpdate] = useState(0);\n\n  const inputRef = useRef<HTMLInputElement | HTMLTextAreaElement>(null);\n  const fvRef = useRef(formValidator);\n\n  const generatedId = useId();\n  const inputId = id || name || generatedId;\n\n  const resizeTextarea = useCallback(() => {\n    const el = inputRef.current;\n    if (!el || !autoResize) return;\n    el.style.height = 'auto';\n    el.style.height = `${el.scrollHeight}px`;\n  }, [autoResize]);\n\n  useEffect(() => {\n    resizeTextarea();\n  }, []);\n\n  useEffect(() => {\n    if (autoFocus && inputRef.current) {\n      setTimeout(() => { inputRef.current?.focus(); }, 1);\n    }\n  }, [autoFocus]);\n\n  useEffect(() => {\n    fvRef.current = formValidator;\n    const fv = fvRef.current;\n    if (!fv) return;\n    fv.label = label ?? '';\n    fv.validate();\n    const listener = () => forceUpdate(n => n + 1);\n    fv.registerOnUpdateListener(listener);\n    return () => { fv.removeOnUpdateListener(listener); };\n  }, [formValidator, label]);\n\n  const hasError = (): boolean => {\n    return formValidator\n      ? (formValidator.touched && formValidator.hasError())\n      : (!isValid || !!errorMessage);\n  };\n\n  const computedIsRequired = (): boolean => {\n    return !!(isRequired || (formValidator && formValidator.validators.find(\n      (v) => (v as { validatorId?: string }).validatorId === 'required'\n    )));\n  };\n\n  const onMouseEnterHandler = (event: React.MouseEvent) => {\n    setIsHovered(true);\n    if (onMouseEnterProp) onMouseEnterProp(event);\n  };\n\n  const onMouseLeaveHandler = (event: React.MouseEvent) => {\n    setIsHovered(false);\n    if (onMouseLeaveProp) onMouseLeaveProp(event);\n  };\n\n  const onFocusHandler = (event: React.FocusEvent) => {\n    setIsFocused(true);\n    if (onFocusProp) onFocusProp(event);\n  };\n\n  const onBlurHandler = (event: React.FocusEvent) => {\n    if (fvRef.current) fvRef.current.touched = true;\n    setIsFocused(false);\n    if (onBlurProp) onBlurProp(event);\n  };\n\n  const onChangeHandler = (event: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement> | string): void => {\n    let parsedEvent: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement> | undefined;\n    let val: string;\n\n    if (typeof event !== 'string') {\n      parsedEvent = event;\n      val = event.target.value;\n    } else {\n      val = event;\n    }\n\n    if (parse) val = parse(val);\n    if (formValidator) formValidator.set(val);\n    if (onChange) onChange(val, parsedEvent);\n    resizeTextarea();\n  };\n\n  const getInputType = (): string | undefined => {\n    if (type === 'email') return undefined;\n    if (type === 'password' && isPasswordShown) return 'text';\n    return type;\n  };\n\n  const hasIcon =\n    type &&\n    type !== InputType.Date &&\n    type !== InputType.Iban &&\n    type !== InputType.HasNoIcon;\n\n  const hasIconLeft =\n    hasIcon && !useMatLabelStyle &&\n    (type === InputType.Email || type === InputType.Phone || type === InputType.Search);\n\n  const iconProps = {\n    className: cx(styles.inputFieldIcon, {\n      [styles.inputFieldIconNotClickable]: !onIconClick,\n      [styles.inputFieldIconLeft]: hasIconLeft,\n    }),\n    onClick: onIconClick ?? undefined,\n  };\n\n  const customIcon = icon as React.ReactElement<{ className?: string; onClick?: React.MouseEventHandler }> | null;\n  const renderedIcon = customIcon\n    ? React.cloneElement(customIcon, {\n        className: cx(\n          styles.inputFieldIcon,\n          { [styles.inputFieldIconNotClickable]: !onIconClick && !customIcon.props.onClick },\n          customIcon.props.className,\n        ),\n        onClick: onIconClick ?? customIcon.props.onClick,\n      })\n    : null;\n  const hasCustomIcon = !!icon;\n\n  const passwordIconProps = {\n    className: cx(styles.inputFieldIcon, styles.inputFieldIconPassword),\n    onClick: () => setIsPasswordShown(!isPasswordShown),\n  };\n\n  const hasErr = hasError();\n\n  let editedLabel = label;\n  if (editedLabel && computedIsRequired()) editedLabel = `${editedLabel} *`;\n  const requiredMark = computedIsRequired() ? <span className={styles.requiredMark}>*</span> : null;\n\n  const currVal = formValidator ? formValidator.value : value;\n  const shouldFloatLabel = useMatLabelStyle && (alwaysFloatLabel || isFocused || currVal || type === InputType.Date);\n\n  return (\n    <div className={cx(styles.input, className)} style={style}>\n      <label\n        htmlFor={inputId}\n        className={cx(styles.inputLabel, classNames?.label, {\n          [styles.inputLabelColumn]: !isRow,\n          [styles.inputLabelInBorder]: labelInBorder,\n        })}\n        style={slotStyles?.label}\n      >\n        {label && !useMatLabelStyle ? (\n          <span className={styles.inputLabelText}>\n            {label}\n            {requiredMark}\n          </span>\n        ) : null}\n        {upperRightLabel && (\n          <div className={cx(styles.inputUpperRightLabel, classNames?.upperRightLabel)} style={slotStyles?.upperRightLabel}>\n            {upperRightLabel}\n          </div>\n        )}\n        <div\n          className={cx(styles.inputContainer, { [styles.inputContainerMultiline]: multiline }, classNames?.container)}\n          style={slotStyles?.container}\n          onMouseEnter={onMouseEnterHandler}\n          onMouseLeave={onMouseLeaveHandler}\n        >\n          {renderedIcon}\n          {React.cloneElement(customInput || (multiline ? <textarea /> : <input />), {\n            ...rest,\n            className: cx(\n              styles.inputField,\n              {\n                [styles.inputFieldUppercase]: isUppercase,\n                [styles.inputFieldDate]: type === InputType.Date,\n                [styles.inputFieldDefault]: type !== InputType.Date,\n                [styles.inputFieldWithIcon]: hasIcon || hasCustomIcon,\n                [styles.inputFieldWithIconLeft]: hasIconLeft,\n                [styles.inputFieldMultiline]: multiline,\n                [styles.inputFieldMultilineAutoResize]: multiline && autoResize,\n              },\n              classNames?.input\n            ),\n            name,\n            id: inputId,\n            value: formValidator ? formValidator.value : value,\n            tabIndex,\n            ref: customInput ? undefined : inputRef,\n            onChange: onChangeHandler,\n            onFocus: onFocusHandler,\n            onBlur: onBlurHandler,\n            placeholder: !useMatLabelStyle ? placeholder : '',\n            autoComplete,\n            onClick,\n            readOnly,\n            disabled,\n            ...(!multiline && { type: getInputType(), min, max }),\n            ...(multiline && rows !== undefined && { rows }),\n          })}\n          {suffix && <div className={cx(styles.inputFieldSuffix, classNames?.suffix)} style={slotStyles?.suffix}>{suffix}</div>}\n        </div>\n        <fieldset\n          className={cx(styles.inputFieldset, classNames?.fieldset, {\n            [styles.inputContainerBorderFocused]: isFocused,\n            [styles.inputContainerBorderSearchFocused]:\n              type === InputType.Search && (isFocused || value),\n            [styles.inputContainerBorderInvalid]: hasErr,\n            [styles.inputContainerBorderError]: hasErr,\n          })}\n          style={slotStyles?.fieldset}\n        >\n          <legend\n            className={cx(styles.inputFieldsetLegend, {\n              [styles.inputFieldsetLegendActive]: shouldFloatLabel,\n            })}\n          >\n            <span>{editedLabel}</span>\n          </legend>\n        </fieldset>\n        {useMatLabelStyle && label && (\n          <div\n            className={cx(styles.inputMatLabel, {\n              [styles.inputMatLabelFloating]: shouldFloatLabel,\n              [styles.inputMatLabelMultiline]: multiline && !shouldFloatLabel,\n            })}\n          >\n            {label}\n            {requiredMark}\n          </div>\n        )}\n        {useMatLabelStyle && placeholder && (\n          <div\n            className={cx(\n              styles.inputPlaceholder,\n              isFocused && !currVal && styles.inputPlaceholderShown,\n              multiline && styles.inputPlaceholderMultiline,\n            )}\n          >\n            {placeholder}\n          </div>\n        )}\n        <Tooltip\n          variant=\"error\"\n          message={formValidator ? formValidator.getCurrentErrorMessage() : (errorMessage || '')}\n          isVisible={hasErr && (isFocused || isHovered)}\n        />\n      </label>\n\n      {type === InputType.Phone && <FontAwesomeIcon icon={faPhone} {...iconProps} />}\n      {type === InputType.Email && <FontAwesomeIcon icon={faEnvelope} {...iconProps} />}\n      {type === InputType.Edit && <FontAwesomeIcon icon={faPen} {...iconProps} />}\n      {type === InputType.Search && <FontAwesomeIcon icon={faSearch} {...iconProps} />}\n      {type === InputType.Password && (\n        <FontAwesomeIcon\n          icon={isPasswordShown ? passwordShownIcon : passwordHiddenIcon}\n          {...passwordIconProps}\n        />\n      )}\n\n      {((showCancel && value && (isFocused || isHovered)) || alwaysShowCancel) && (\n        <FontAwesomeIcon\n          icon={faXmark}\n          className={styles.inputFieldIcon}\n          onClick={onClearClicked ?? undefined}\n          onMouseEnter={() => setIsHovered(true)}\n          onMouseLeave={() => setIsHovered(false)}\n        />\n      )}\n    </div>\n  );\n}\n\nexport default Input;\n"],"mappings":"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"}

package/dist/esm/common/input/input.module.mjs

@@ -1,2 +1,2 @@
-var e={"required-mark":`required-mark_xGJdX`,requiredMark:`required-mark_xGJdX`,isRequired:`isRequired_Jkn3h`,input:`input_VKNCE`,"input-placeholder":`input-placeholder_IZH-l`,inputPlaceholder:`input-placeholder_IZH-l`,"input-placeholder-shown":`input-placeholder-shown_mm35e`,inputPlaceholderShown:`input-placeholder-shown_mm35e`,fadeIn:`fadeIn_kmX3i`,"input-placeholder-multiline":`input-placeholder-multiline_tLHAl`,inputPlaceholderMultiline:`input-placeholder-multiline_tLHAl`,"input-matLabel":`input-matLabel_-05ey`,inputMatLabel:`input-matLabel_-05ey`,"input-matLabel-floating":`input-matLabel-floating_1P2YE`,inputMatLabelFloating:`input-matLabel-floating_1P2YE`,"input-matLabel-multiline":`input-matLabel-multiline_miIZJ`,inputMatLabelMultiline:`input-matLabel-multiline_miIZJ`,"input-fieldset":`input-fieldset_XCibg`,inputFieldset:`input-fieldset_XCibg`,"input-fieldset-legend":`input-fieldset-legend_X23zp`,inputFieldsetLegend:`input-fieldset-legend_X23zp`,"input-fieldset-legend-active":`input-fieldset-legend-active_t-9hu`,inputFieldsetLegendActive:`input-fieldset-legend-active_t-9hu`,"input-container":`input-container_M1RoG`,inputContainer:`input-container_M1RoG`,"input-container-multiline":`input-container-multiline_eLw7h`,inputContainerMultiline:`input-container-multiline_eLw7h`,"input-container-border":`input-container-border_l131I`,inputContainerBorder:`input-container-border_l131I`,"input-container-border-focused":`input-container-border-focused_ct6oY`,inputContainerBorderFocused:`input-container-border-focused_ct6oY`,"input-container-border-searchFocused":`input-container-border-searchFocused_lq088`,inputContainerBorderSearchFocused:`input-container-border-searchFocused_lq088`,"input-container-border-invalid":`input-container-border-invalid_Wdbq2`,inputContainerBorderInvalid:`input-container-border-invalid_Wdbq2`,"input-container-border-error":`input-container-border-error_gzfPG`,inputContainerBorderError:`input-container-border-error_gzfPG`,"input-label":`input-label_w1hMR`,inputLabel:`input-label_w1hMR`,"input-label-column":`input-label-column_qBFPC`,inputLabelColumn:`input-label-column_qBFPC`,"input-label-text":`input-label-text_-J5qQ`,inputLabelText:`input-label-text_-J5qQ`,"input-upper-right-label":`input-upper-right-label_I-WG3`,inputUpperRightLabel:`input-upper-right-label_I-WG3`,"input-field":`input-field_pmDvZ`,inputField:`input-field_pmDvZ`,"input-field-withIcon":`input-field-withIcon_VpfmK`,inputFieldWithIcon:`input-field-withIcon_VpfmK`,"input-field-withIcon-left":`input-field-withIcon-left_Io7lU`,inputFieldWithIconLeft:`input-field-withIcon-left_Io7lU`,"input-field-suffix":`input-field-suffix_NZpXp`,inputFieldSuffix:`input-field-suffix_NZpXp`,"input-field-date":`input-field-date_UHJEZ`,inputFieldDate:`input-field-date_UHJEZ`,"input-field-default":`input-field-default_TKipA`,inputFieldDefault:`input-field-default_TKipA`,"input-field-uppercase":`input-field-uppercase_UV6f1`,inputFieldUppercase:`input-field-uppercase_UV6f1`,"input-field-multiline":`input-field-multiline_al3V1`,inputFieldMultiline:`input-field-multiline_al3V1`,"input-field-multiline-autoResize":`input-field-multiline-autoResize_nK33P`,inputFieldMultilineAutoResize:`input-field-multiline-autoResize_nK33P`,"input-field-icon":`input-field-icon_YyJIr`,inputFieldIcon:`input-field-icon_YyJIr`,"input-field-icon-left":`input-field-icon-left_m2XB1`,inputFieldIconLeft:`input-field-icon-left_m2XB1`,"input-field-icon-notClickable":`input-field-icon-notClickable_7j24I`,inputFieldIconNotClickable:`input-field-icon-notClickable_7j24I`,"input-error":`input-error_LIG23`,inputError:`input-error_LIG23`};export{e as default};
+var e={"required-mark":`required-mark_xGJdX`,requiredMark:`required-mark_xGJdX`,input:`input_VKNCE`,"input-placeholder":`input-placeholder_IZH-l`,inputPlaceholder:`input-placeholder_IZH-l`,"input-placeholder-shown":`input-placeholder-shown_mm35e`,inputPlaceholderShown:`input-placeholder-shown_mm35e`,fadeIn:`fadeIn_kmX3i`,"input-placeholder-multiline":`input-placeholder-multiline_tLHAl`,inputPlaceholderMultiline:`input-placeholder-multiline_tLHAl`,"input-matLabel":`input-matLabel_-05ey`,inputMatLabel:`input-matLabel_-05ey`,"input-matLabel-floating":`input-matLabel-floating_1P2YE`,inputMatLabelFloating:`input-matLabel-floating_1P2YE`,"input-matLabel-multiline":`input-matLabel-multiline_miIZJ`,inputMatLabelMultiline:`input-matLabel-multiline_miIZJ`,"input-fieldset":`input-fieldset_XCibg`,inputFieldset:`input-fieldset_XCibg`,"input-fieldset-legend":`input-fieldset-legend_X23zp`,inputFieldsetLegend:`input-fieldset-legend_X23zp`,"input-fieldset-legend-active":`input-fieldset-legend-active_t-9hu`,inputFieldsetLegendActive:`input-fieldset-legend-active_t-9hu`,"input-container":`input-container_M1RoG`,inputContainer:`input-container_M1RoG`,"input-container-multiline":`input-container-multiline_eLw7h`,inputContainerMultiline:`input-container-multiline_eLw7h`,"input-container-border":`input-container-border_l131I`,inputContainerBorder:`input-container-border_l131I`,"input-container-border-focused":`input-container-border-focused_ct6oY`,inputContainerBorderFocused:`input-container-border-focused_ct6oY`,"input-container-border-searchFocused":`input-container-border-searchFocused_lq088`,inputContainerBorderSearchFocused:`input-container-border-searchFocused_lq088`,"input-container-border-invalid":`input-container-border-invalid_Wdbq2`,inputContainerBorderInvalid:`input-container-border-invalid_Wdbq2`,"input-container-border-error":`input-container-border-error_gzfPG`,inputContainerBorderError:`input-container-border-error_gzfPG`,"input-label":`input-label_w1hMR`,inputLabel:`input-label_w1hMR`,"input-label-column":`input-label-column_qBFPC`,inputLabelColumn:`input-label-column_qBFPC`,"input-label-text":`input-label-text_-J5qQ`,inputLabelText:`input-label-text_-J5qQ`,"input-upper-right-label":`input-upper-right-label_I-WG3`,inputUpperRightLabel:`input-upper-right-label_I-WG3`,"input-field":`input-field_pmDvZ`,inputField:`input-field_pmDvZ`,"input-field-withIcon":`input-field-withIcon_VpfmK`,inputFieldWithIcon:`input-field-withIcon_VpfmK`,"input-field-withIcon-left":`input-field-withIcon-left_Io7lU`,inputFieldWithIconLeft:`input-field-withIcon-left_Io7lU`,"input-field-suffix":`input-field-suffix_NZpXp`,inputFieldSuffix:`input-field-suffix_NZpXp`,"input-field-date":`input-field-date_UHJEZ`,inputFieldDate:`input-field-date_UHJEZ`,"input-field-default":`input-field-default_TKipA`,inputFieldDefault:`input-field-default_TKipA`,"input-field-uppercase":`input-field-uppercase_UV6f1`,inputFieldUppercase:`input-field-uppercase_UV6f1`,"input-field-multiline":`input-field-multiline_al3V1`,inputFieldMultiline:`input-field-multiline_al3V1`,"input-field-multiline-autoResize":`input-field-multiline-autoResize_nK33P`,inputFieldMultilineAutoResize:`input-field-multiline-autoResize_nK33P`,"input-field-icon":`input-field-icon_YyJIr`,inputFieldIcon:`input-field-icon_YyJIr`,"input-field-icon-left":`input-field-icon-left_m2XB1`,inputFieldIconLeft:`input-field-icon-left_m2XB1`,"input-field-icon-notClickable":`input-field-icon-notClickable_7j24I`,inputFieldIconNotClickable:`input-field-icon-notClickable_7j24I`,"input-error":`input-error_LIG23`,inputError:`input-error_LIG23`};export{e as default};
 //# sourceMappingURL=input.module.mjs.map

package/dist/esm/common/input/input.module.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"input.module.mjs","names":[],"sources":["../../../../package/common/input/input.module.pcss"],"sourcesContent":["\n.required-mark {\n  padding: 0px 0px 0px 4px;\n  color: var(--error-font-color);\n}\n\n.isRequired {\n  color: var(--message-error-color);\n}\n\n.input {\n  position: relative;\n  width: 100%;\n  --input-notch-height: 1.75em;\n\n  &-placeholder {\n    position: absolute;\n    top: 50%;\n    left: 7px;\n    transform: translateY(-50%);\n    transition: all 0.2s;\n    opacity: 0;\n    user-select: none;\n    pointer-events: none;\n\n    &-shown {\n      animation: 0.2s fadeIn 0.3s forwards;\n    }\n\n    &-multiline {\n      top: 14px;\n      transform: translateY(0);\n    }\n  }\n\n  &-matLabel {\n    position: absolute;\n    transition: all 0.3s;\n    left: 7px;\n    right: 0;\n    top: 50%;\n    transform: translateY(-50%);\n    font-size: 1em;\n    color: var(--input-label-resting-color, var(--text-light));\n    pointer-events: none;\n    user-select: none;\n\n    &-floating {\n      top: 0;\n      bottom: auto;\n      left: 14px;\n      right: 0;\n      font-size: 0.8em;\n      color: var(--input-label-floating-color, var(--text-color));\n      transform: translateY(-50%);\n    }\n\n    &-multiline {\n      top: 14px;\n      transform: translateY(0);\n    }\n  }\n\n  &-fieldset {\n    position: absolute;\n    width: 100%;\n    margin: 0;\n    padding: 0;\n    min-width: 0;\n    box-sizing: border-box;\n    border-radius: var(--default-border-radius);\n    font-size: 0.8em;\n    inset: calc(var(--input-notch-height) / -2) 0 0 0;\n    padding-left: 8px;\n    border-width: 1px;\n    border-style: solid;\n    border-color: var(--border-color);\n    pointer-events: none;\n    user-select: none;\n\n    &-legend {\n      display: block;\n      max-width: 0;\n      transition: max-width 0.2s;\n      white-space: nowrap;\n      padding: 0;\n\n      &-active {\n        max-width: 300px;\n      }\n\n      span {\n        line-height: var(--input-notch-height);\n        padding: 0 5px;\n        opacity: 0;\n      }\n\n      span:empty {\n        padding: 0.000001px;\n      }\n    }\n  }\n\n  &-container {\n    display: flex;\n    align-items: center;\n    border-radius: var(--default-border-radius);\n    background-color: var(--input-background);\n    transition: border-color;\n    cursor: text;\n    height: 100%;\n\n    &-multiline {\n      overflow: hidden;\n      padding-top: 10px;\n      align-items: flex-start;\n    }\n\n    &-border {\n      outline: 1px solid var(--border-color);\n      transition: border-color;\n      background-color: var(--input-background);\n      outline: none;\n\n      &-focused {\n        outline-color: var(--primary-color);\n        border-color: var(--primary-color);\n      }\n\n      &-searchFocused {\n        outline-color: var(--search-input-color);\n        outline-width: 2px;\n        border-color: var(--search-input-color);\n      }\n\n      &-invalid {\n        outline-color: var(--error-border-color);\n        border-color: var(--error-border-color);\n      }\n\n      &-invalid:hover {\n        outline-color: var(--error-border-color);\n        border-color: var(--error-border-color);\n      }\n\n      &-error {\n        outline-color: var(--error-border-color);\n        border-color: var(--error-border-color);\n      }\n    }\n  }\n\n  &-label {\n    display: flex;\n    color: var(--text-color);\n    height: 100%;\n\n    &-column {\n      flex-direction: column;\n    }\n\n    &-text {\n      white-space: nowrap;\n      margin-right: 5px;\n      margin-bottom: 6px;\n      display: flex;\n      align-items: center;\n      color: color(var(--border-color) lightness(40%));\n      background-color: transparent;\n      font-size: 12px;\n      position: absolute;\n      top: -15px;\n      white-space: nowrap;\n    }\n  }\n\n  &-upper-right-label {\n    position: absolute;\n    transform: translateY(calc(-100% - 1.5px));\n    right: 8px;\n    min-height: 12px;\n    font-size: 12px;\n    color: color(var(--border-color) lightness(40%));\n  }\n\n  &-field {\n    appearance: none;\n    -webkit-appearance: none;\n    font-family: inherit;\n    font-size: inherit;\n    box-sizing: border-box;\n    resize: none;\n    width: 100%;\n    border: none;\n    border-radius: var(--default-border-radius);\n    overflow: hidden;\n    line-height: 1.25;\n    color: var(--text-color);\n    background: transparent;\n\n    &:focus {\n      outline: none;\n    }\n\n    &::placeholder {\n      color: var(--text-light);\n    }\n\n    &-withIcon {\n      padding-right: 37px !important;\n\n      &-left {\n        padding-right: 9px !important;\n        padding-left: 37px !important;\n      }\n    }\n\n    &-suffix {\n      padding-right: 9px;\n    }\n\n    &-date {\n      padding: 6px 9px;\n      color-scheme: dark;\n\n      svg {\n        color: white;\n      }\n    }\n\n    &-default {\n      padding: 8px 7.5px 6px;\n    }\n\n    &[disabled] {\n      background-color: var(--disabled-input-color);\n      color: var(--disabled-font-color);\n      -webkit-text-fill-color: var(--disabled-font-color);\n      opacity: 1;\n\n      &::placeholder {\n        color: var(--disabled-font-color);\n        -webkit-text-fill-color: var(--disabled-font-color);\n      }\n    }\n\n    &-uppercase {\n      text-transform: uppercase;\n    }\n\n    &-multiline {\n      overflow-y: auto;\n      resize: vertical;\n      padding-top: 4px;\n      min-height: 30px;\n\n      &-autoResize {\n        resize: none;\n        overflow: hidden;\n      }\n    }\n\n    &-icon {\n      appearance: none;\n      -webkit-appearance: none;\n      box-sizing: border-box;\n      cursor: pointer;\n      background-color: transparent;\n      border: none;\n      position: absolute;\n      outline: none;\n      right: 10px;\n      top: 8px;\n      color: var(--input-icon-color);\n      width: 19px !important;\n      height: 19px !important;\n      user-select: none;\n      top: 50%;\n      transform: translateY(-50%);\n\n      &-left {\n        left: 10px;\n      }\n\n      &-notClickable {\n        pointer-events: none;\n      }\n    }\n  }\n\n  &-error {\n    height: 1em;\n    padding-top: 3px;\n    color: var(--error-font-color);\n    font-size: 11px;\n  }\n\n  @keyframes fadeIn {\n    from {\n      opacity: 0;\n    }\n    to {\n      opacity: 0.5;\n    }\n  }\n}\n"],"mappings":""}
+{"version":3,"file":"input.module.mjs","names":[],"sources":["../../../../package/common/input/input.module.pcss"],"sourcesContent":["\n.required-mark {\n  padding: 0px 0px 0px 4px;\n  color: var(--required-mark-color, var(--error-color));\n}\n\n.input {\n  position: relative;\n  width: 100%;\n  --input-notch-height: 1.75em;\n\n  &-placeholder {\n    position: absolute;\n    top: 50%;\n    left: 7px;\n    transform: translateY(-50%);\n    transition: all 0.2s;\n    opacity: 0;\n    user-select: none;\n    pointer-events: none;\n\n    &-shown {\n      animation: 0.2s fadeIn 0.3s forwards;\n    }\n\n    &-multiline {\n      top: 14px;\n      transform: translateY(0);\n    }\n  }\n\n  &-matLabel {\n    position: absolute;\n    transition: all 0.3s;\n    left: 7px;\n    right: 0;\n    top: 50%;\n    transform: translateY(-50%);\n    font-size: 1em;\n    color: var(--input-label-resting-color, var(--text-light));\n    pointer-events: none;\n    user-select: none;\n\n    &-floating {\n      top: 0;\n      bottom: auto;\n      left: 14px;\n      right: 0;\n      font-size: 0.8em;\n      color: var(--input-label-floating-color, var(--text-color));\n      transform: translateY(-50%);\n    }\n\n    &-multiline {\n      top: 14px;\n      transform: translateY(0);\n    }\n  }\n\n  &-fieldset {\n    position: absolute;\n    width: 100%;\n    margin: 0;\n    padding: 0;\n    min-width: 0;\n    box-sizing: border-box;\n    border-radius: var(--default-border-radius);\n    font-size: 0.8em;\n    inset: calc(var(--input-notch-height) / -2) 0 0 0;\n    padding-left: 8px;\n    border-width: 1px;\n    border-style: solid;\n    border-color: var(--border-color);\n    pointer-events: none;\n    user-select: none;\n\n    &-legend {\n      display: block;\n      max-width: 0;\n      transition: max-width 0.2s;\n      white-space: nowrap;\n      padding: 0;\n\n      &-active {\n        max-width: 300px;\n      }\n\n      span {\n        line-height: var(--input-notch-height);\n        padding: 0 5px;\n        opacity: 0;\n      }\n\n      span:empty {\n        padding: 0.000001px;\n      }\n    }\n  }\n\n  &-container {\n    display: flex;\n    align-items: center;\n    border-radius: var(--default-border-radius);\n    background-color: var(--input-background);\n    transition: border-color;\n    cursor: text;\n    height: 100%;\n\n    &-multiline {\n      overflow: hidden;\n      padding-top: 10px;\n      align-items: flex-start;\n    }\n\n    &-border {\n      outline: 1px solid var(--border-color);\n      transition: border-color;\n      background-color: var(--input-background);\n      outline: none;\n\n      &-focused {\n        outline-color: var(--primary-color);\n        border-color: var(--primary-color);\n      }\n\n      &-searchFocused {\n        outline-color: var(--search-input-color);\n        outline-width: 2px;\n        border-color: var(--search-input-color);\n      }\n\n      &-invalid {\n        outline-color: var(--error-border-color);\n        border-color: var(--error-border-color);\n      }\n\n      &-invalid:hover {\n        outline-color: var(--error-border-color);\n        border-color: var(--error-border-color);\n      }\n\n      &-error {\n        outline-color: var(--error-border-color);\n        border-color: var(--error-border-color);\n      }\n    }\n  }\n\n  &-label {\n    display: flex;\n    color: var(--text-color);\n    height: 100%;\n\n    &-column {\n      flex-direction: column;\n    }\n\n    &-text {\n      white-space: nowrap;\n      margin-right: 5px;\n      margin-bottom: 6px;\n      display: flex;\n      align-items: center;\n      color: color(var(--border-color) lightness(40%));\n      background-color: transparent;\n      font-size: 12px;\n      position: absolute;\n      top: -15px;\n      white-space: nowrap;\n    }\n  }\n\n  &-upper-right-label {\n    position: absolute;\n    transform: translateY(calc(-100% - 1.5px));\n    right: 8px;\n    min-height: 12px;\n    font-size: 12px;\n    color: color(var(--border-color) lightness(40%));\n  }\n\n  &-field {\n    appearance: none;\n    -webkit-appearance: none;\n    font-family: inherit;\n    font-size: inherit;\n    box-sizing: border-box;\n    resize: none;\n    width: 100%;\n    border: none;\n    border-radius: var(--default-border-radius);\n    overflow: hidden;\n    line-height: 1.25;\n    color: var(--text-color);\n    background: transparent;\n\n    &:focus {\n      outline: none;\n    }\n\n    &::placeholder {\n      color: var(--text-light);\n    }\n\n    &-withIcon {\n      padding-right: 37px !important;\n\n      &-left {\n        padding-right: 9px !important;\n        padding-left: 37px !important;\n      }\n    }\n\n    &-suffix {\n      padding-right: 9px;\n    }\n\n    &-date {\n      padding: 6px 9px;\n      color-scheme: dark;\n\n      svg {\n        color: white;\n      }\n    }\n\n    &-default {\n      padding: 8px 7.5px 6px;\n    }\n\n    &[disabled] {\n      background-color: var(--disabled-input-color);\n      color: var(--disabled-font-color);\n      -webkit-text-fill-color: var(--disabled-font-color);\n      opacity: 1;\n\n      &::placeholder {\n        color: var(--disabled-font-color);\n        -webkit-text-fill-color: var(--disabled-font-color);\n      }\n    }\n\n    &-uppercase {\n      text-transform: uppercase;\n    }\n\n    &-multiline {\n      overflow-y: auto;\n      resize: vertical;\n      padding-top: 4px;\n      min-height: 30px;\n\n      &-autoResize {\n        resize: none;\n        overflow: hidden;\n      }\n    }\n\n    &-icon {\n      appearance: none;\n      -webkit-appearance: none;\n      box-sizing: border-box;\n      cursor: pointer;\n      background-color: transparent;\n      border: none;\n      position: absolute;\n      outline: none;\n      right: 10px;\n      top: 8px;\n      color: var(--input-icon-color);\n      width: 19px !important;\n      height: 19px !important;\n      user-select: none;\n      top: 50%;\n      transform: translateY(-50%);\n\n      &-left {\n        left: 10px;\n      }\n\n      &-notClickable {\n        pointer-events: none;\n      }\n    }\n  }\n\n  &-error {\n    height: 1em;\n    padding-top: 3px;\n    color: var(--error-font-color);\n    font-size: 11px;\n  }\n\n  @keyframes fadeIn {\n    from {\n      opacity: 0;\n    }\n    to {\n      opacity: 0.5;\n    }\n  }\n}\n"],"mappings":""}

package/dist/esm/common/sectionHeader/sectionHeader.mjs

@@ -0,0 +1,2 @@
+import{useComponentDefaults as e}from"../configProvider/useComponentDefaults.mjs";import t from"../actionIcon/actionIcon.mjs";import n from"../divider/divider.mjs";import{SectionHeaderSize as r}from"./sectionHeader.types.mjs";import i from"./sectionHeader.module.mjs";import"react";import a from"classnames";import{FontAwesomeIcon as o}from"@fortawesome/react-fontawesome";import{Fragment as s,jsx as c,jsxs as l}from"react/jsx-runtime";var u={[r.Small]:i.sectionHeaderSizeSmall,[r.Medium]:i.sectionHeaderSizeMedium,[r.Large]:i.sectionHeaderSizeLarge};function d(d){let{title:f,subtitle:p,icon:m,thumbnail:h,left:g,center:_,actions:v,level:y=2,size:b=r.Medium,divider:x=!1,className:S,style:C,classNames:w,styles:T,...E}=e(`SectionHeader`,d),D=typeof h==`string`&&h.startsWith(`http`)?h:void 0,O=h!=null&&h!==``,k=O||m!=null,A=`h${y}`;return l(s,{children:[l(`div`,{...E,className:a(i.sectionHeader,u[b],S,w?.root),style:{...C,...T?.root},children:[k&&c(`div`,{className:a(i.sectionHeaderLeading,w?.leading),style:{...D?{backgroundImage:`url(${D})`}:{},...T?.leading},children:O?!D&&h:m&&c(o,{icon:m})}),l(`div`,{className:a(i.sectionHeaderTitles,w?.titles),style:T?.titles,children:[c(A,{className:a(i.sectionHeaderTitle,w?.title),style:T?.title,children:f}),p!=null&&p!==``&&c(`div`,{className:a(i.sectionHeaderSubtitle,w?.subtitle),style:T?.subtitle,children:p})]}),l(`div`,{className:a(i.sectionHeaderTrailing,w?.trailing),style:T?.trailing,children:[c(`div`,{className:a(i.sectionHeaderLeft,w?.left),style:T?.left,children:g}),c(`div`,{className:a(i.sectionHeaderCenter,w?.center),style:T?.center,children:_}),c(`div`,{className:a(i.sectionHeaderActions,w?.actions),style:T?.actions,children:Array.isArray(v)?v.map((e,n)=>c(t,{title:e.title,onClick:e.onClick?t=>{t.stopPropagation(),e.onClick?.(t)}:void 0,icon:e.icon},n)):v})]})]}),x&&c(n,{className:i.sectionHeaderDivider})]})}export{d as default};
+//# sourceMappingURL=sectionHeader.mjs.map

package/dist/esm/common/sectionHeader/sectionHeader.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"sectionHeader.mjs","names":[],"sources":["../../../../package/common/sectionHeader/sectionHeader.tsx"],"sourcesContent":["import React from 'react';\nimport type { ReactElement } from 'react';\nimport cx from 'classnames';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\n\nimport { SectionHeaderSize } from './sectionHeader.types';\nimport type { SectionHeaderProps, SectionHeaderAction } from './sectionHeader.types';\nimport styles from './sectionHeader.module.pcss';\nimport ActionIcon from '../actionIcon';\nimport Divider from '../divider';\nimport { useComponentDefaults } from '../configProvider';\n\nconst CLASS_BY_SIZE: Record<SectionHeaderSize, string> = {\n  [SectionHeaderSize.Small]: styles.sectionHeaderSizeSmall,\n  [SectionHeaderSize.Medium]: styles.sectionHeaderSizeMedium,\n  [SectionHeaderSize.Large]: styles.sectionHeaderSizeLarge,\n};\n\nfunction SectionHeader(props: SectionHeaderProps): ReactElement {\n  const {\n    title,\n    subtitle,\n    icon,\n    thumbnail,\n    left,\n    center,\n    actions,\n    level = 2,\n    size = SectionHeaderSize.Medium,\n    divider = false,\n    className,\n    style,\n    classNames,\n    styles: slotStyles,\n    ...rest\n  } = useComponentDefaults('SectionHeader', props);\n\n  const thumbnailUrl =\n    typeof thumbnail === 'string' && thumbnail.startsWith('http') ? thumbnail : undefined;\n  const hasThumbnail = thumbnail != null && thumbnail !== '';\n  const hasLeading = hasThumbnail || icon != null;\n\n  const Heading = `h${level}` as keyof React.JSX.IntrinsicElements;\n\n  return (\n    <>\n      <div\n        {...rest}\n        className={cx(\n          styles.sectionHeader,\n          CLASS_BY_SIZE[size],\n          className,\n          classNames?.root,\n        )}\n        style={{ ...style, ...slotStyles?.root }}\n      >\n        {hasLeading && (\n          <div\n            className={cx(styles.sectionHeaderLeading, classNames?.leading)}\n            style={{\n              ...(thumbnailUrl ? { backgroundImage: `url(${thumbnailUrl})` } : {}),\n              ...slotStyles?.leading,\n            }}\n          >\n            {hasThumbnail\n              ? !thumbnailUrl && thumbnail\n              : icon && <FontAwesomeIcon icon={icon} />}\n          </div>\n        )}\n\n        <div\n          className={cx(styles.sectionHeaderTitles, classNames?.titles)}\n          style={slotStyles?.titles}\n        >\n          <Heading\n            className={cx(styles.sectionHeaderTitle, classNames?.title)}\n            style={slotStyles?.title}\n          >\n            {title}\n          </Heading>\n          {subtitle != null && subtitle !== '' && (\n            <div\n              className={cx(styles.sectionHeaderSubtitle, classNames?.subtitle)}\n              style={slotStyles?.subtitle}\n            >\n              {subtitle}\n            </div>\n          )}\n        </div>\n\n        <div\n          className={cx(styles.sectionHeaderTrailing, classNames?.trailing)}\n          style={slotStyles?.trailing}\n        >\n          <div className={cx(styles.sectionHeaderLeft, classNames?.left)} style={slotStyles?.left}>\n            {left}\n          </div>\n\n          <div\n            className={cx(styles.sectionHeaderCenter, classNames?.center)}\n            style={slotStyles?.center}\n          >\n            {center}\n          </div>\n\n          <div\n            className={cx(styles.sectionHeaderActions, classNames?.actions)}\n            style={slotStyles?.actions}\n          >\n            {Array.isArray(actions)\n              ? (actions as SectionHeaderAction[]).map((action, index) => (\n                  <ActionIcon\n                    key={index}\n                    title={action.title}\n                    onClick={\n                      action.onClick\n                        ? (e: React.MouseEvent<HTMLDivElement>) => {\n                            e.stopPropagation();\n                            action.onClick?.(e);\n                          }\n                        : undefined\n                    }\n                    icon={action.icon}\n                  />\n                ))\n              : (actions as React.ReactNode)}\n          </div>\n        </div>\n      </div>\n      {divider && <Divider className={styles.sectionHeaderDivider} />}\n    </>\n  );\n}\n\nexport default SectionHeader;\n"],"mappings":"qbAYA,IAAM,EAAmD,EACtD,EAAkB,OAAQ,EAAO,wBACjC,EAAkB,QAAS,EAAO,yBAClC,EAAkB,OAAQ,EAAO,sBACpC,EAEA,SAAS,EAAc,EAAyC,CAC9D,GAAM,CACJ,QACA,WACA,OACA,YACA,OACA,SACA,UACA,QAAQ,EACR,OAAO,EAAkB,OACzB,UAAU,GACV,YACA,QACA,aACA,OAAQ,EACR,GAAG,GACD,EAAqB,gBAAiB,CAAK,EAEzC,EACJ,OAAO,GAAc,UAAY,EAAU,WAAW,MAAM,EAAI,EAAY,IAAA,GACxE,EAAe,GAAa,MAAQ,IAAc,GAClD,EAAa,GAAgB,GAAQ,KAErC,EAAU,IAAI,IAEpB,OACE,EAAA,EAAA,CAAA,SAAA,CACE,EAAC,MAAD,CACE,GAAI,EACJ,UAAW,EACT,EAAO,cACP,EAAc,GACd,EACA,GAAY,IACd,EACA,MAAO,CAAE,GAAG,EAAO,GAAG,GAAY,IAAK,WARzC,CAUG,GACC,EAAC,MAAD,CACE,UAAW,EAAG,EAAO,qBAAsB,GAAY,OAAO,EAC9D,MAAO,CACL,GAAI,EAAe,CAAE,gBAAiB,OAAO,EAAa,EAAG,EAAI,CAAC,EAClE,GAAG,GAAY,OACjB,WAEC,EACG,CAAC,GAAgB,EACjB,GAAQ,EAAC,EAAD,CAAuB,MAAO,CAAA,CACvC,CAAA,EAGP,EAAC,MAAD,CACE,UAAW,EAAG,EAAO,oBAAqB,GAAY,MAAM,EAC5D,MAAO,GAAY,gBAFrB,CAIE,EAAC,EAAD,CACE,UAAW,EAAG,EAAO,mBAAoB,GAAY,KAAK,EAC1D,MAAO,GAAY,eAElB,CACM,CAAA,EACR,GAAY,MAAQ,IAAa,IAChC,EAAC,MAAD,CACE,UAAW,EAAG,EAAO,sBAAuB,GAAY,QAAQ,EAChE,MAAO,GAAY,kBAElB,CACE,CAAA,CAEJ,IAEL,EAAC,MAAD,CACE,UAAW,EAAG,EAAO,sBAAuB,GAAY,QAAQ,EAChE,MAAO,GAAY,kBAFrB,CAIE,EAAC,MAAD,CAAK,UAAW,EAAG,EAAO,kBAAmB,GAAY,IAAI,EAAG,MAAO,GAAY,cAChF,CACE,CAAA,EAEL,EAAC,MAAD,CACE,UAAW,EAAG,EAAO,oBAAqB,GAAY,MAAM,EAC5D,MAAO,GAAY,gBAElB,CACE,CAAA,EAEL,EAAC,MAAD,CACE,UAAW,EAAG,EAAO,qBAAsB,GAAY,OAAO,EAC9D,MAAO,GAAY,iBAElB,MAAM,QAAQ,CAAO,EACjB,EAAkC,KAAK,EAAQ,IAC9C,EAAC,EAAD,CAEE,MAAO,EAAO,MACd,QACE,EAAO,QACF,GAAwC,CACvC,EAAE,gBAAgB,EAClB,EAAO,UAAU,CAAC,CACpB,EACA,IAAA,GAEN,KAAM,EAAO,IACd,EAXM,CAWN,CACF,EACA,CACF,CAAA,CACF,GACF,IACJ,GAAW,EAAC,EAAD,CAAS,UAAW,EAAO,oBAAuB,CAAA,CAC9D,CAAA,CAAA,CAEN"}

package/dist/esm/common/sectionHeader/sectionHeader.module.mjs

@@ -0,0 +1,2 @@
+var e={sectionHeader:`sectionHeader_X3bNj`,"sectionHeader-leading":`sectionHeader-leading_d6opV`,sectionHeaderLeading:`sectionHeader-leading_d6opV`,"sectionHeader-titles":`sectionHeader-titles_iN9dT`,sectionHeaderTitles:`sectionHeader-titles_iN9dT`,"sectionHeader-title":`sectionHeader-title_wH--S`,sectionHeaderTitle:`sectionHeader-title_wH--S`,"sectionHeader-subtitle":`sectionHeader-subtitle_WRK3Y`,sectionHeaderSubtitle:`sectionHeader-subtitle_WRK3Y`,"sectionHeader-trailing":`sectionHeader-trailing_ewWDV`,sectionHeaderTrailing:`sectionHeader-trailing_ewWDV`,"sectionHeader-left":`sectionHeader-left_ZUuWs`,sectionHeaderLeft:`sectionHeader-left_ZUuWs`,"sectionHeader-center":`sectionHeader-center_MzSev`,sectionHeaderCenter:`sectionHeader-center_MzSev`,"sectionHeader-actions":`sectionHeader-actions_E40ZS`,sectionHeaderActions:`sectionHeader-actions_E40ZS`,"sectionHeader-divider":`sectionHeader-divider_Ovpev`,sectionHeaderDivider:`sectionHeader-divider_Ovpev`,"sectionHeader-size-small":`sectionHeader-size-small_6OVWE`,sectionHeaderSizeSmall:`sectionHeader-size-small_6OVWE`,"sectionHeader-size-medium":`sectionHeader-size-medium_BVSe6`,sectionHeaderSizeMedium:`sectionHeader-size-medium_BVSe6`,"sectionHeader-size-large":`sectionHeader-size-large_bOZDP`,sectionHeaderSizeLarge:`sectionHeader-size-large_bOZDP`};export{e as default};
+//# sourceMappingURL=sectionHeader.module.mjs.map

package/dist/esm/common/sectionHeader/sectionHeader.module.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"sectionHeader.module.mjs","names":[],"sources":["../../../../package/common/sectionHeader/sectionHeader.module.pcss"],"sourcesContent":[".sectionHeader {\n  display: flex;\n  flex-wrap: wrap;\n  gap: var(--spacing-m, 16px);\n  align-items: center;\n  color: var(--text-color);\n\n  &-leading {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    width: var(--section-header-leading-size);\n    height: var(--section-header-leading-size);\n    color: var(--primary-color);\n    background: var(--background-accent);\n    border-radius: var(--default-border-radius);\n    overflow: hidden;\n    background-size: cover;\n    background-position: center;\n    flex-shrink: 0;\n    font-size: calc(var(--section-header-leading-size) * 0.5);\n  }\n\n  &-titles {\n    display: flex;\n    flex-flow: column;\n    flex: 0 1 auto;\n    gap: 2px;\n    min-width: 0;\n  }\n\n  &-title {\n    margin: 0;\n    font-size: var(--section-header-title-size);\n    font-weight: var(--header-font-weight, 600);\n    line-height: 1.2;\n    overflow: hidden;\n    text-overflow: ellipsis;\n  }\n\n  &-subtitle {\n    color: var(--text-dark);\n    font-weight: 300;\n    font-size: var(--section-header-subtitle-size);\n    overflow: hidden;\n    text-overflow: ellipsis;\n  }\n\n  &-trailing {\n    display: flex;\n    flex-wrap: wrap;\n    align-items: center;\n    justify-content: space-between;\n    gap: var(--spacing-m, 16px);\n    flex: 1 1 auto;\n  }\n\n  &-left {\n    display: flex;\n    align-items: center;\n    flex-shrink: 0;\n  }\n\n  &-center {\n    display: flex;\n    align-items: center;\n    min-width: 0;\n  }\n\n  &-actions {\n    display: flex;\n    gap: var(--spacing-s, 8px);\n    flex-wrap: wrap;\n    flex-shrink: 0;\n    align-items: center;\n    justify-content: flex-end;\n  }\n\n  &-divider {\n    margin-top: var(--spacing-s, 8px);\n  }\n\n  &-size {\n    &-small {\n      --section-header-title-size: var(--header-small-font-size, 16px);\n      --section-header-subtitle-size: 12px;\n      --section-header-leading-size: calc(var(--section-header-title-size) * 2.2);\n    }\n\n    &-medium {\n      --section-header-title-size: var(--header-medium-font-size, 18px);\n      --section-header-subtitle-size: 14px;\n      --section-header-leading-size: calc(var(--section-header-title-size) * 2.2);\n    }\n\n    &-large {\n      --section-header-title-size: var(--header-font-size, 24px);\n      --section-header-subtitle-size: 15px;\n      --section-header-leading-size: calc(var(--section-header-title-size) * 2.2);\n    }\n  }\n}\n\n@media (max-width: 640px) {\n  .sectionHeader-center {\n    flex: 1 1 100%;\n  }\n}\n"],"mappings":""}

package/dist/esm/common/sectionHeader/sectionHeader.types.mjs

@@ -0,0 +1,2 @@
+var e=function(e){return e.Small=`small`,e.Medium=`medium`,e.Large=`large`,e}({});export{e as SectionHeaderSize};
+//# sourceMappingURL=sectionHeader.types.mjs.map

package/dist/esm/common/sectionHeader/sectionHeader.types.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"sectionHeader.types.mjs","names":[],"sources":["../../../../package/common/sectionHeader/sectionHeader.types.ts"],"sourcesContent":["import type { CSSProperties, ReactNode } from 'react';\nimport { IconDefinition } from '@fortawesome/free-solid-svg-icons';\nimport type { SlotClassNames, SlotStyles, HtmlProps } from '../types/slots.types';\nimport type { IconAction } from '../types/actions.types';\n\nexport enum SectionHeaderSize {\n  Small = 'small',\n  Medium = 'medium',\n  Large = 'large',\n}\n\nexport type SectionHeaderAction = IconAction;\n\nexport type SectionHeaderSlots =\n  | 'root'\n  | 'leading'\n  | 'titles'\n  | 'title'\n  | 'subtitle'\n  | 'trailing'\n  | 'left'\n  | 'center'\n  | 'actions';\n\nexport interface SectionHeaderProps extends HtmlProps {\n  title?: ReactNode;\n  subtitle?: ReactNode;\n  icon?: IconDefinition;\n  thumbnail?: string | ReactNode;\n  left?: ReactNode;\n  center?: ReactNode;\n  actions?: SectionHeaderAction[] | ReactNode;\n  level?: 1 | 2 | 3 | 4 | 5 | 6;\n  size?: SectionHeaderSize;\n  divider?: boolean;\n  className?: string;\n  style?: CSSProperties;\n  classNames?: SlotClassNames<SectionHeaderSlots>;\n  styles?: SlotStyles<SectionHeaderSlots>;\n}\n"],"mappings":"AAKA,IAAY,EAAL,SAAA,EAAA,OACL,GAAA,MAAA,QACA,EAAA,OAAA,SACA,EAAA,MAAA,SACF,EAAA,CAAA,CAAA"}

package/dist/esm/common/themeProvider/defaultTheme.mjs

@@ -1,2 +1,2 @@
-var e={id:`default`,variables:{"--grey":`#8A8A8A`,"--lightgrey":`#e0e0e0`,"--lightergrey":`#B1B1B1`,"--white":`#FFFFFF`,"--red":`#D6002A`,"--lighter-red":`#ffeae9`,"--green":`#287626`,"--lighter-green":`#C4FFC9`,"--blue":`#5873d5`,"--lighter-blue":`#C6DBFF`,"--black":`black`,"--orange":`#ff7f50`,"--lighter-orange":`#ffe5d9`,"--primary-color":`#8184d6`,"--primary-accent":`#90CAF9`,"--primary-lighter":`#9a9ce4`,"--accent-color":`var(--grey)`,"--accent-color-light":`var(--lightgrey)`,"--text-color":`var(--white)`,"--text-dark":`var(--lightergrey)`,"--text-light":`var(--lightergrey)`,"--text-on-primary":`var(--white)`,"--text-on-delete":`var(--white)`,"--border-color":`#656574`,"--background":`#393945`,"--background-accent":`#33333c`,"--background-accent-dark":`var(--grey)`,"--background-accent-light":`#484856`,"--background-modal":`#484856`,"--success-color":`var(--green)`,"--success-lighter":`var(--lighter-green)`,"--error-color":`var(--red)`,"--error-lighter":`var(--lighter-red)`,"--info-color":`var(--blue)`,"--info-lighter":`var(--lighter-blue)`,"--warn-color":`var(--orange)`,"--warn-lighter":`var(--lighter-orange)`,"--default-font-size":`14px`,"--text-small-font-size":`12px`,"--header-font-size":`24px`,"--header-medium-font-size":`18px`,"--header-small-font-size":`16px`,"--default-font-weight":`400`,"--header-font-weight":`600`,"--input-background":`transparent`,"--input-icon-color":`var(--text-color)`,"--error-border-color":`var(--red)`,"--button-default-color":`var(--primary-color)`,"--button-default-border":`1px solid var(--primary-color)`,"--default-border-radius":`8px`,"--padding-sides":`15px`,"--margin-top":`10px`,"--default-font":`'Inter', sans-serif`,"--themed-font":`'Inter', sans-serif`,"--card-shadow":`0 3px 1px -2px rgb(0 0 0 / 20%), 0 2px 2px 0 rgb(0 0 0 / 14%), 0 1px 5px 0 rgb(0 0 0 / 12%)`,"--background-card-elevated":`var(--background-accent-light)`,"--background-card-outlined":`transparent`,"--background-card-filled":`var(--background-accent)`,"--spacing-s":`4px`,"--spacing-m":`8px`,"--spacing-l":`16px`}};export{e as defaultTheme};
+var e={id:`default`,variables:{"--grey":`#8A8A8A`,"--lightgrey":`#e0e0e0`,"--lightergrey":`#B1B1B1`,"--white":`#FFFFFF`,"--red":`#D6002A`,"--lighter-red":`#ffeae9`,"--green":`#287626`,"--lighter-green":`#C4FFC9`,"--blue":`#5873d5`,"--lighter-blue":`#C6DBFF`,"--black":`black`,"--orange":`#ff7f50`,"--lighter-orange":`#ffe5d9`,"--primary-color":`#8184d6`,"--primary-accent":`#90CAF9`,"--primary-lighter":`#9a9ce4`,"--accent-color":`var(--grey)`,"--accent-color-light":`var(--lightgrey)`,"--text-color":`var(--white)`,"--text-dark":`var(--lightergrey)`,"--text-light":`var(--lightergrey)`,"--text-on-primary":`var(--white)`,"--text-on-delete":`var(--white)`,"--border-color":`#656574`,"--background":`#393945`,"--background-accent":`#33333c`,"--background-accent-dark":`var(--grey)`,"--background-accent-light":`#484856`,"--background-modal":`#484856`,"--success-color":`var(--green)`,"--success-lighter":`var(--lighter-green)`,"--error-color":`var(--red)`,"--error-lighter":`var(--lighter-red)`,"--required-mark-color":`var(--error-color)`,"--info-color":`var(--blue)`,"--info-lighter":`var(--lighter-blue)`,"--warn-color":`var(--orange)`,"--warn-lighter":`var(--lighter-orange)`,"--default-font-size":`14px`,"--text-small-font-size":`12px`,"--header-font-size":`24px`,"--header-medium-font-size":`18px`,"--header-small-font-size":`16px`,"--default-font-weight":`400`,"--header-font-weight":`600`,"--input-background":`transparent`,"--input-icon-color":`var(--text-color)`,"--error-border-color":`var(--red)`,"--button-default-color":`var(--primary-color)`,"--button-default-border":`1px solid var(--primary-color)`,"--default-border-radius":`8px`,"--padding-sides":`15px`,"--margin-top":`10px`,"--default-font":`'Inter', sans-serif`,"--themed-font":`'Inter', sans-serif`,"--card-shadow":`0 3px 1px -2px rgb(0 0 0 / 20%), 0 2px 2px 0 rgb(0 0 0 / 14%), 0 1px 5px 0 rgb(0 0 0 / 12%)`,"--background-card-elevated":`var(--background-accent-light)`,"--background-card-outlined":`transparent`,"--background-card-filled":`var(--background-accent)`,"--spacing-s":`4px`,"--spacing-m":`8px`,"--spacing-l":`16px`}};export{e as defaultTheme};
 //# sourceMappingURL=defaultTheme.mjs.map

package/dist/esm/common/themeProvider/defaultTheme.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"defaultTheme.mjs","names":[],"sources":["../../../../package/common/themeProvider/defaultTheme.ts"],"sourcesContent":["import type { Theme } from './theme.types';\n\n/**\n * Built-in default theme used by ThemeProvider when no `themes` prop is\n * supplied. Provides a complete set of CSS variables so the component\n * library renders correctly out of the box.\n */\nexport const defaultTheme: Theme = {\n  id: 'default',\n  variables: {\n    '--grey': '#8A8A8A',\n    '--lightgrey': '#e0e0e0',\n    '--lightergrey': '#B1B1B1',\n    '--white': '#FFFFFF',\n    '--red': '#D6002A',\n    '--lighter-red': '#ffeae9',\n    '--green': '#287626',\n    '--lighter-green': '#C4FFC9',\n    '--blue': '#5873d5',\n    '--lighter-blue': '#C6DBFF',\n    '--black': 'black',\n    '--orange': '#ff7f50',\n    '--lighter-orange': '#ffe5d9',\n\n    '--primary-color': '#8184d6',\n    '--primary-accent': '#90CAF9',\n    '--primary-lighter': '#9a9ce4',\n    '--accent-color': 'var(--grey)',\n    '--accent-color-light': 'var(--lightgrey)',\n\n    '--text-color': 'var(--white)',\n    '--text-dark': 'var(--lightergrey)',\n    '--text-light': 'var(--lightergrey)',\n    '--text-on-primary': 'var(--white)',\n    '--text-on-delete': 'var(--white)',\n    '--border-color': '#656574',\n\n    '--background': '#393945',\n    '--background-accent': '#33333c',\n    '--background-accent-dark': 'var(--grey)',\n    '--background-accent-light': '#484856',\n    '--background-modal': '#484856',\n\n    '--success-color': 'var(--green)',\n    '--success-lighter': 'var(--lighter-green)',\n    '--error-color': 'var(--red)',\n    '--error-lighter': 'var(--lighter-red)',\n    '--info-color': 'var(--blue)',\n    '--info-lighter': 'var(--lighter-blue)',\n    '--warn-color': 'var(--orange)',\n    '--warn-lighter': 'var(--lighter-orange)',\n\n    '--default-font-size': '14px',\n    '--text-small-font-size': '12px',\n    '--header-font-size': '24px',\n    '--header-medium-font-size': '18px',\n    '--header-small-font-size': '16px',\n\n    '--default-font-weight': '400',\n    '--header-font-weight': '600',\n\n    '--input-background': 'transparent',\n    '--input-icon-color': 'var(--text-color)',\n    '--error-border-color': 'var(--red)',\n\n    '--button-default-color': 'var(--primary-color)',\n    '--button-default-border': '1px solid var(--primary-color)',\n\n    '--default-border-radius': '8px',\n    '--padding-sides': '15px',\n    '--margin-top': '10px',\n\n    '--default-font': \"'Inter', sans-serif\",\n    '--themed-font': \"'Inter', sans-serif\",\n\n    '--card-shadow':\n      '0 3px 1px -2px rgb(0 0 0 / 20%), 0 2px 2px 0 rgb(0 0 0 / 14%), 0 1px 5px 0 rgb(0 0 0 / 12%)',\n\n    '--background-card-elevated': 'var(--background-accent-light)',\n    '--background-card-outlined': 'transparent',\n    '--background-card-filled': 'var(--background-accent)',\n\n    '--spacing-s': '4px',\n    '--spacing-m': '8px',\n    '--spacing-l': '16px',\n  },\n};\n"],"mappings":"AAOA,IAAa,EAAsB,CACjC,GAAI,UACJ,UAAW,CACT,SAAU,UACV,cAAe,UACf,gBAAiB,UACjB,UAAW,UACX,QAAS,UACT,gBAAiB,UACjB,UAAW,UACX,kBAAmB,UACnB,SAAU,UACV,iBAAkB,UAClB,UAAW,QACX,WAAY,UACZ,mBAAoB,UAEpB,kBAAmB,UACnB,mBAAoB,UACpB,oBAAqB,UACrB,iBAAkB,cAClB,uBAAwB,mBAExB,eAAgB,eAChB,cAAe,qBACf,eAAgB,qBAChB,oBAAqB,eACrB,mBAAoB,eACpB,iBAAkB,UAElB,eAAgB,UAChB,sBAAuB,UACvB,2BAA4B,cAC5B,4BAA6B,UAC7B,qBAAsB,UAEtB,kBAAmB,eACnB,oBAAqB,uBACrB,gBAAiB,aACjB,kBAAmB,qBACnB,eAAgB,cAChB,iBAAkB,sBAClB,eAAgB,gBAChB,iBAAkB,wBAElB,sBAAuB,OACvB,yBAA0B,OAC1B,qBAAsB,OACtB,4BAA6B,OAC7B,2BAA4B,OAE5B,wBAAyB,MACzB,uBAAwB,MAExB,qBAAsB,cACtB,qBAAsB,oBACtB,uBAAwB,aAExB,yBAA0B,uBAC1B,0BAA2B,iCAE3B,0BAA2B,MAC3B,kBAAmB,OACnB,eAAgB,OAEhB,iBAAkB,sBAClB,gBAAiB,sBAEjB,gBACE,8FAEF,6BAA8B,iCAC9B,6BAA8B,cAC9B,2BAA4B,2BAE5B,cAAe,MACf,cAAe,MACf,cAAe,MACjB,CACF"}
+{"version":3,"file":"defaultTheme.mjs","names":[],"sources":["../../../../package/common/themeProvider/defaultTheme.ts"],"sourcesContent":["import type { Theme } from './theme.types';\n\n/**\n * Built-in default theme used by ThemeProvider when no `themes` prop is\n * supplied. Provides a complete set of CSS variables so the component\n * library renders correctly out of the box.\n */\nexport const defaultTheme: Theme = {\n  id: 'default',\n  variables: {\n    '--grey': '#8A8A8A',\n    '--lightgrey': '#e0e0e0',\n    '--lightergrey': '#B1B1B1',\n    '--white': '#FFFFFF',\n    '--red': '#D6002A',\n    '--lighter-red': '#ffeae9',\n    '--green': '#287626',\n    '--lighter-green': '#C4FFC9',\n    '--blue': '#5873d5',\n    '--lighter-blue': '#C6DBFF',\n    '--black': 'black',\n    '--orange': '#ff7f50',\n    '--lighter-orange': '#ffe5d9',\n\n    '--primary-color': '#8184d6',\n    '--primary-accent': '#90CAF9',\n    '--primary-lighter': '#9a9ce4',\n    '--accent-color': 'var(--grey)',\n    '--accent-color-light': 'var(--lightgrey)',\n\n    '--text-color': 'var(--white)',\n    '--text-dark': 'var(--lightergrey)',\n    '--text-light': 'var(--lightergrey)',\n    '--text-on-primary': 'var(--white)',\n    '--text-on-delete': 'var(--white)',\n    '--border-color': '#656574',\n\n    '--background': '#393945',\n    '--background-accent': '#33333c',\n    '--background-accent-dark': 'var(--grey)',\n    '--background-accent-light': '#484856',\n    '--background-modal': '#484856',\n\n    '--success-color': 'var(--green)',\n    '--success-lighter': 'var(--lighter-green)',\n    '--error-color': 'var(--red)',\n    '--error-lighter': 'var(--lighter-red)',\n    '--required-mark-color': 'var(--error-color)',\n    '--info-color': 'var(--blue)',\n    '--info-lighter': 'var(--lighter-blue)',\n    '--warn-color': 'var(--orange)',\n    '--warn-lighter': 'var(--lighter-orange)',\n\n    '--default-font-size': '14px',\n    '--text-small-font-size': '12px',\n    '--header-font-size': '24px',\n    '--header-medium-font-size': '18px',\n    '--header-small-font-size': '16px',\n\n    '--default-font-weight': '400',\n    '--header-font-weight': '600',\n\n    '--input-background': 'transparent',\n    '--input-icon-color': 'var(--text-color)',\n    '--error-border-color': 'var(--red)',\n\n    '--button-default-color': 'var(--primary-color)',\n    '--button-default-border': '1px solid var(--primary-color)',\n\n    '--default-border-radius': '8px',\n    '--padding-sides': '15px',\n    '--margin-top': '10px',\n\n    '--default-font': \"'Inter', sans-serif\",\n    '--themed-font': \"'Inter', sans-serif\",\n\n    '--card-shadow':\n      '0 3px 1px -2px rgb(0 0 0 / 20%), 0 2px 2px 0 rgb(0 0 0 / 14%), 0 1px 5px 0 rgb(0 0 0 / 12%)',\n\n    '--background-card-elevated': 'var(--background-accent-light)',\n    '--background-card-outlined': 'transparent',\n    '--background-card-filled': 'var(--background-accent)',\n\n    '--spacing-s': '4px',\n    '--spacing-m': '8px',\n    '--spacing-l': '16px',\n  },\n};\n"],"mappings":"AAOA,IAAa,EAAsB,CACjC,GAAI,UACJ,UAAW,CACT,SAAU,UACV,cAAe,UACf,gBAAiB,UACjB,UAAW,UACX,QAAS,UACT,gBAAiB,UACjB,UAAW,UACX,kBAAmB,UACnB,SAAU,UACV,iBAAkB,UAClB,UAAW,QACX,WAAY,UACZ,mBAAoB,UAEpB,kBAAmB,UACnB,mBAAoB,UACpB,oBAAqB,UACrB,iBAAkB,cAClB,uBAAwB,mBAExB,eAAgB,eAChB,cAAe,qBACf,eAAgB,qBAChB,oBAAqB,eACrB,mBAAoB,eACpB,iBAAkB,UAElB,eAAgB,UAChB,sBAAuB,UACvB,2BAA4B,cAC5B,4BAA6B,UAC7B,qBAAsB,UAEtB,kBAAmB,eACnB,oBAAqB,uBACrB,gBAAiB,aACjB,kBAAmB,qBACnB,wBAAyB,qBACzB,eAAgB,cAChB,iBAAkB,sBAClB,eAAgB,gBAChB,iBAAkB,wBAElB,sBAAuB,OACvB,yBAA0B,OAC1B,qBAAsB,OACtB,4BAA6B,OAC7B,2BAA4B,OAE5B,wBAAyB,MACzB,uBAAwB,MAExB,qBAAsB,cACtB,qBAAsB,oBACtB,uBAAwB,aAExB,yBAA0B,uBAC1B,0BAA2B,iCAE3B,0BAA2B,MAC3B,kBAAmB,OACnB,eAAgB,OAEhB,iBAAkB,sBAClB,gBAAiB,sBAEjB,gBACE,8FAEF,6BAA8B,iCAC9B,6BAA8B,cAC9B,2BAA4B,2BAE5B,cAAe,MACf,cAAe,MACf,cAAe,MACjB,CACF"}

package/dist/esm/index.mjs

@@ -1 +1 @@
-import{AccordionStyleType as e}from"./common/accordion/accordion.types.mjs";import t from"./common/configProvider/configProvider.mjs";import{useComponentDefaults as n}from"./common/configProvider/useComponentDefaults.mjs";import r from"./common/accordion/accordion.mjs";import i from"./common/loading/spinnerLoading/index.mjs";import{ButtonSize as a,ButtonStyleType as o,ButtonType as s}from"./common/button/button.types.mjs";import c from"./common/ripple/ripple.mjs";import l from"./common/button/button.mjs";import u from"./common/actionButtons/actionButtons.mjs";import d from"./common/interactableDiv/index.mjs";import f from"./common/actionIcon/actionIcon.mjs";import{BadgePosition as p,BadgeStyleType as m}from"./common/badge/badge.types.mjs";import h from"./common/badge/badge.mjs";import g from"./common/avatar/avatar.mjs";import _ from"./common/avatar/avatarGroup.mjs";import v from"./common/bodyEnd/bodyEnd.mjs";import{CardStyleType as y}from"./common/card/card.types.mjs";import b from"./common/card/Card.mjs";import x from"./common/card/CardHeader.mjs";import S from"./common/card/CardMedia.mjs";import C from"./common/card/CardContent.mjs";import w from"./common/card/CardActions.mjs";import T from"./common/checkbox/checkbox.mjs";import{ChipStyleType as E}from"./common/chip/chip.types.mjs";import D from"./common/chip/chip.mjs";import O from"./common/chip/chipContainer.mjs";import{Align as k}from"./common/floatingMenu/floatingMenu.types.mjs";import A from"./common/floatingMenu/floatingMenu.mjs";import j from"./common/tooltip/tooltip.mjs";import{InputType as M}from"./common/input/input.types.mjs";import N from"./common/input/input.mjs";import P from"./common/colorPicker/colorPicker.mjs";import F from"./common/modal/modal.mjs";import I from"./common/confirmModal/confirmModal.mjs";import{getLocale as L,mapLocale as R,setLocale as z}from"./services/localization.mjs";import B from"./common/infiniteBlock/infiniteBlock.mjs";import V from"./common/dropdown/dropdown.mjs";import H from"./common/datePicker/datePicker.mjs";import U from"./common/drawer/drawer.mjs";import{DropZoneReturnType as W,DropZoneStatus as G}from"./common/dropZone/dropZone.types.mjs";import K from"./common/dropZone/dropZone.mjs";import q from"./common/emptyState/emptyState.mjs";import J from"./common/fab/fab.mjs";import Y from"./common/iconPicker/iconPicker.mjs";import X from"./common/idleManager/idleManager.mjs";import Z from"./common/inputDropdown/inputDropdown.mjs";import Q from"./common/kanbanBoard/KanbanColumn.mjs";import $ from"./common/kanbanBoard/KanbanBoard.mjs";import ee from"./common/searchInput/searchInput.mjs";import te from"./common/klipyPicker/klipyPicker.mjs";import ne from"./common/loading/iconLoading/index.mjs";import re from"./common/numberInput/index.mjs";import ie from"./common/optionPicker/optionPicker.mjs";import ae from"./common/overscroll/overscroll.mjs";import oe from"./common/progressBar/progressBar.mjs";import se from"./common/roomDrawer/roomDrawer.mjs";import ce from"./common/roomViewer/roomViewer.mjs";import le from"./common/scrollbarProvider/index.mjs";import{SkeletonAnimation as ue,SkeletonVariant as de}from"./common/skeleton/skeleton.types.mjs";import fe from"./common/skeleton/skeleton.mjs";import pe from"./common/stepper/stepper.mjs";import me from"./common/sticky/sticky.mjs";import he from"./common/switch/switch.mjs";import ge from"./common/tabHeader/tabHeader.mjs";import _e from"./common/textarea/textarea.mjs";import{defaultTheme as ve}from"./common/themeProvider/defaultTheme.mjs";import ye from"./common/themeProvider/themeProvider.mjs";import{useTheme as be}from"./common/themeProvider/useTheme.mjs";import xe from"./common/timeInput/timeInput.mjs";import{showToast as Se}from"./common/toast/toastService.mjs";import Ce from"./common/toast/toastProvider.mjs";import we from"./common/virtualList/virtualList.mjs";import Te from"./common/wizard/wizard.mjs";import Ee from"./services/formValidation/FormValidatorGroupWithForm.mjs";import De from"./services/formValidation/formValidator.mjs";import{hasEightPasswordChars as Oe,hasOnePasswordDigit as ke,hasOnePasswordLetter as Ae,isBic as je,isDate as Me,isEmail as Ne,isISODate as Pe,isNumber as Fe,isPassword as Ie,isURL as Le}from"./services/regexp.mjs";import Re from"./services/formValidation/validators.mjs";import ze from"./services/formValidation/validatableComponent.mjs";import{useFormValidator as Be}from"./services/formValidation/useFormValidator.mjs";import{useFormValidatorGroup as Ve}from"./services/formValidation/useFormValidatorGroup.mjs";export{r as Accordion,e as AccordionStyleType,u as ActionButtons,f as ActionIcon,k as Align,g as Avatar,_ as AvatarGroup,h as Badge,p as BadgePosition,m as BadgeStyleType,v as BodyEnd,l as Button,a as ButtonSize,o as ButtonStyleType,s as ButtonType,b as Card,w as CardActions,C as CardContent,x as CardHeader,S as CardMedia,y as CardStyleType,T as Checkbox,D as Chip,O as ChipContainer,E as ChipStyleType,P as ColorPicker,t as ConfigProvider,I as ConfirmModal,H as DatePicker,U as Drawer,K as DropZone,W as DropZoneReturnType,G as DropZoneStatus,V as Dropdown,q as EmptyState,J as Fab,A as FloatingMenu,De as FormValidator,Ee as FormValidatorGroup,ne as IconLoading,Y as IconPicker,X as IdleManager,B as InfiniteBlock,N as Input,Z as InputDropdown,M as InputType,d as InteractableDiv,$ as KanbanBoard,Q as KanbanColumn,te as KlipyPicker,F as Modal,re as NumberInput,ie as OptionPicker,ae as Overscroll,oe as ProgressBar,c as Ripple,se as RoomDrawer,ce as RoomViewer,le as ScrollbarProvider,ee as SearchInput,fe as Skeleton,ue as SkeletonAnimation,de as SkeletonVariant,i as SpinnerLoading,pe as Stepper,me as Sticky,he as Switch,ge as TabHeader,_e as Textarea,ye as ThemeProvider,xe as TimeInput,Ce as ToastProvider,j as Tooltip,ze as ValidatableComponent,Re as Validators,we as VirtualList,Te as Wizard,ve as defaultTheme,L as getLocale,Oe as hasEightPasswordChars,ke as hasOnePasswordDigit,Ae as hasOnePasswordLetter,je as isBic,Me as isDate,Ne as isEmail,Pe as isISODate,Fe as isNumber,Ie as isPassword,Le as isURL,R as mapLocale,z as setLocale,Se as showToast,n as useComponentDefaults,Be as useFormValidator,Ve as useFormValidatorGroup,be as useTheme};
+import{AccordionStyleType as e}from"./common/accordion/accordion.types.mjs";import t from"./common/configProvider/configProvider.mjs";import{useComponentDefaults as n}from"./common/configProvider/useComponentDefaults.mjs";import r from"./common/accordion/accordion.mjs";import i from"./common/loading/spinnerLoading/index.mjs";import{ButtonSize as a,ButtonStyleType as o,ButtonType as s}from"./common/button/button.types.mjs";import c from"./common/ripple/ripple.mjs";import l from"./common/button/button.mjs";import u from"./common/actionButtons/actionButtons.mjs";import d from"./common/interactableDiv/index.mjs";import f from"./common/actionIcon/actionIcon.mjs";import{BadgePosition as p,BadgeStyleType as m}from"./common/badge/badge.types.mjs";import h from"./common/badge/badge.mjs";import g from"./common/avatar/avatar.mjs";import _ from"./common/avatar/avatarGroup.mjs";import v from"./common/bodyEnd/bodyEnd.mjs";import{CardStyleType as y}from"./common/card/card.types.mjs";import b from"./common/card/Card.mjs";import x from"./common/card/CardHeader.mjs";import S from"./common/card/CardMedia.mjs";import C from"./common/card/CardContent.mjs";import w from"./common/card/CardActions.mjs";import T from"./common/checkbox/checkbox.mjs";import{ChipStyleType as E}from"./common/chip/chip.types.mjs";import D from"./common/chip/chip.mjs";import O from"./common/chip/chipContainer.mjs";import{Align as k}from"./common/floatingMenu/floatingMenu.types.mjs";import A from"./common/floatingMenu/floatingMenu.mjs";import j from"./common/tooltip/tooltip.mjs";import{InputType as M}from"./common/input/input.types.mjs";import N from"./common/input/input.mjs";import P from"./common/colorPicker/colorPicker.mjs";import F from"./common/modal/modal.mjs";import I from"./common/confirmModal/confirmModal.mjs";import{getLocale as L,mapLocale as R,setLocale as z}from"./services/localization.mjs";import B from"./common/infiniteBlock/infiniteBlock.mjs";import V from"./common/dropdown/dropdown.mjs";import H from"./common/datePicker/datePicker.mjs";import{DividerTextPosition as U}from"./common/divider/divider.types.mjs";import W from"./common/divider/divider.mjs";import G from"./common/drawer/drawer.mjs";import{DropZoneReturnType as K,DropZoneStatus as q}from"./common/dropZone/dropZone.types.mjs";import J from"./common/dropZone/dropZone.mjs";import Y from"./common/emptyState/emptyState.mjs";import X from"./common/fab/fab.mjs";import Z from"./common/iconPicker/iconPicker.mjs";import Q from"./common/idleManager/idleManager.mjs";import $ from"./common/inputDropdown/inputDropdown.mjs";import ee from"./common/kanbanBoard/KanbanColumn.mjs";import te from"./common/kanbanBoard/KanbanBoard.mjs";import ne from"./common/searchInput/searchInput.mjs";import re from"./common/klipyPicker/klipyPicker.mjs";import ie from"./common/loading/iconLoading/index.mjs";import ae from"./common/numberInput/index.mjs";import oe from"./common/optionPicker/optionPicker.mjs";import se from"./common/overscroll/overscroll.mjs";import ce from"./common/progressBar/progressBar.mjs";import le from"./common/roomDrawer/roomDrawer.mjs";import ue from"./common/roomViewer/roomViewer.mjs";import de from"./common/scrollbarProvider/index.mjs";import{SectionHeaderSize as fe}from"./common/sectionHeader/sectionHeader.types.mjs";import pe from"./common/sectionHeader/sectionHeader.mjs";import{SkeletonAnimation as me,SkeletonVariant as he}from"./common/skeleton/skeleton.types.mjs";import ge from"./common/skeleton/skeleton.mjs";import _e from"./common/stepper/stepper.mjs";import ve from"./common/sticky/sticky.mjs";import ye from"./common/switch/switch.mjs";import be from"./common/tabHeader/tabHeader.mjs";import xe from"./common/textarea/textarea.mjs";import{defaultTheme as Se}from"./common/themeProvider/defaultTheme.mjs";import Ce from"./common/themeProvider/themeProvider.mjs";import{useTheme as we}from"./common/themeProvider/useTheme.mjs";import Te from"./common/timeInput/timeInput.mjs";import{showToast as Ee}from"./common/toast/toastService.mjs";import De from"./common/toast/toastProvider.mjs";import Oe from"./common/virtualList/virtualList.mjs";import ke from"./common/wizard/wizard.mjs";import Ae from"./services/formValidation/FormValidatorGroupWithForm.mjs";import je from"./services/formValidation/formValidator.mjs";import{hasEightPasswordChars as Me,hasOnePasswordDigit as Ne,hasOnePasswordLetter as Pe,isBic as Fe,isDate as Ie,isEmail as Le,isISODate as Re,isNumber as ze,isPassword as Be,isURL as Ve}from"./services/regexp.mjs";import He from"./services/formValidation/validators.mjs";import Ue from"./services/formValidation/validatableComponent.mjs";import{useFormValidator as We}from"./services/formValidation/useFormValidator.mjs";import{useFormValidatorGroup as Ge}from"./services/formValidation/useFormValidatorGroup.mjs";export{r as Accordion,e as AccordionStyleType,u as ActionButtons,f as ActionIcon,k as Align,g as Avatar,_ as AvatarGroup,h as Badge,p as BadgePosition,m as BadgeStyleType,v as BodyEnd,l as Button,a as ButtonSize,o as ButtonStyleType,s as ButtonType,b as Card,w as CardActions,C as CardContent,x as CardHeader,S as CardMedia,y as CardStyleType,T as Checkbox,D as Chip,O as ChipContainer,E as ChipStyleType,P as ColorPicker,t as ConfigProvider,I as ConfirmModal,H as DatePicker,W as Divider,U as DividerTextPosition,G as Drawer,J as DropZone,K as DropZoneReturnType,q as DropZoneStatus,V as Dropdown,Y as EmptyState,X as Fab,A as FloatingMenu,je as FormValidator,Ae as FormValidatorGroup,ie as IconLoading,Z as IconPicker,Q as IdleManager,B as InfiniteBlock,N as Input,$ as InputDropdown,M as InputType,d as InteractableDiv,te as KanbanBoard,ee as KanbanColumn,re as KlipyPicker,F as Modal,ae as NumberInput,oe as OptionPicker,se as Overscroll,ce as ProgressBar,c as Ripple,le as RoomDrawer,ue as RoomViewer,de as ScrollbarProvider,ne as SearchInput,pe as SectionHeader,fe as SectionHeaderSize,ge as Skeleton,me as SkeletonAnimation,he as SkeletonVariant,i as SpinnerLoading,_e as Stepper,ve as Sticky,ye as Switch,be as TabHeader,xe as Textarea,Ce as ThemeProvider,Te as TimeInput,De as ToastProvider,j as Tooltip,Ue as ValidatableComponent,He as Validators,Oe as VirtualList,ke as Wizard,Se as defaultTheme,L as getLocale,Me as hasEightPasswordChars,Ne as hasOnePasswordDigit,Pe as hasOnePasswordLetter,Fe as isBic,Ie as isDate,Le as isEmail,Re as isISODate,ze as isNumber,Be as isPassword,Ve as isURL,R as mapLocale,z as setLocale,Ee as showToast,n as useComponentDefaults,We as useFormValidator,Ge as useFormValidatorGroup,we as useTheme};