@e1011/es-kit 1.1.76 → 1.1.78

package/dist/ui/esm/src/core/ui/components/field/Field.js

@@ -1,2 +1,2 @@
-import{objectWithoutProperties as e,extends as t}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import{r as a}from"../../../../../node_modules/react/index.js";import{classNames as l}from"../../../utils/helpers/ui.js";import n from"./field.module.scss.js";const o=["options","value","inputRef"],c=["label","name","type","value","defaultValue","placeholder","inputRef","error","disabled","userDisabled","withoutComponent","helpTextInfo","helpText","children","iconLeft","iconRight","addon","className","onChange","onChangeInner","onBlur","onFocus","rightIconClick","leftIconClick","options","style"];let s=()=>"#000000";const i=e=>{s=e};let r=a.memo((function(){return React.createElement("span",null)}));const m=e=>{r=e},u=a.memo((function(a){let{options:l,value:n,inputRef:c}=a,s=e(a,o);return React.createElement("div",{className:"select"},React.createElement("select",t({},s,{ref:c,defaultValue:n}),null==l?void 0:l.map((e=>React.createElement("option",{key:"".concat(JSON.stringify(e)),value:"object"==typeof e?null==e?void 0:e.value:e},"object"==typeof e?null==e?void 0:e.label:e)))))})),p=a.memo((e=>a.createElement("textarea",e)));p.displayName="TextAreaComponent";const d=a.memo((e=>a.createElement("input",e)));d.displayName="InputComponent";const f=a.memo((o=>{let{label:i,name:m,type:f="text",value:h,defaultValue:R,placeholder:v,inputRef:g,error:C,disabled:N,userDisabled:b,withoutComponent:E,helpTextInfo:y,helpText:x,children:k,iconLeft:I,iconRight:j,addon:F,className:B,onChange:D,onChangeInner:T,onBlur:w,onFocus:V,rightIconClick:L,leftIconClick:_,options:K,style:P}=o,A=e(o,c),H=d;k||"textarea"!==f||(H=p);const J=a.useCallback((e=>{var t;b?null==e||null===(t=e.preventDefault)||void 0===t||t.call(e):V&&V(e)}),[b,V]),M=a.useCallback((e=>{b||(T&&null!=e&&e.target?(e.target.value=T(e.target.value),D&&D(e)):D&&D(e))}),[T,D,b]),O=a.useMemo((()=>void 0===h?{defaultValue:R}:{value:h}),[h,R]);return React.createElement("div",{className:l(n.field,(N||b)&&n.disabled,B),style:P},React.createElement("label",{htmlFor:m,className:"label"},i),React.createElement("div",{className:"field ".concat(F?"has-addons":"")},React.createElement("div",{className:"control mainControl ".concat(I&&!E?"has-icons-left":""," ").concat(j?"has-icons-right":"")},!E&&(k||"select"!==f&&!K?!k&&React.createElement(H,t({name:m,id:m,ref:g,className:"input ".concat(C?"is-danger":""),type:f,placeholder:v},O,{onChange:M,onBlur:w,onFocus:J,onKeyDown:J,autoComplete:"off",disabled:N},A)):React.createElement(u,t({name:m,id:m,inputRef:g,className:"input ".concat(C?"is-danger":""),type:"select",placeholder:v,value:h,options:K,onChange:D,onBlur:w,onFocus:J,onKeyDown:J,autoComplete:"off",disabled:N},A))),I&&!E&&React.createElement("span",{className:"iconLeft icon is-small is-left ".concat(_?"is-action":""),onClick:_},React.createElement(r,{iconName:I,color:s})),j&&React.createElement("span",{className:"iconRight icon is-small is-right ".concat(L?"is-action":""),onClick:L},React.createElement(r,{iconName:j,color:s})),k&&k),F&&F),y&&React.createElement("p",{className:"help"},y),x&&React.createElement("p",{className:"help ".concat(C?"is-danger":"")},x))}));f.displayName="Field";export{f as Field,u as Select,i as setIconColor,m as setIconComponent};
+import{objectWithoutProperties as e,extends as t}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import{memo as a,useCallback as l,useMemo as n,createElement as o}from"react";import{classNames as c}from"../../../utils/helpers/ui.js";import i from"./field.module.scss.js";const s=["options","value","inputRef"],r=["label","name","type","value","defaultValue","placeholder","inputRef","error","disabled","userDisabled","withoutComponent","helpTextInfo","helpText","children","iconLeft","iconRight","addon","className","onChange","onChangeInner","onBlur","onFocus","rightIconClick","leftIconClick","options","style"];let u=()=>"#000000";const m=e=>{u=e};let p=a((function(){return React.createElement("span",null)}));const d=e=>{p=e},f=a((function(a){let{options:l,value:n,inputRef:o}=a,c=e(a,s);return React.createElement("div",{className:"select"},React.createElement("select",t({},c,{ref:o,defaultValue:n}),null==l?void 0:l.map((e=>React.createElement("option",{key:"".concat(JSON.stringify(e)),value:"object"==typeof e?null==e?void 0:e.value:e},"object"==typeof e?null==e?void 0:e.label:e)))))})),h=a((e=>o("textarea",e)));h.displayName="TextAreaComponent";const R=a((e=>o("input",e)));R.displayName="InputComponent";const v=a((a=>{let{label:o,name:s,type:m="text",value:d,defaultValue:v,placeholder:g,inputRef:C,error:N,disabled:b,userDisabled:y,withoutComponent:E,helpTextInfo:x,helpText:I,children:k,iconLeft:j,iconRight:F,addon:B,className:D,onChange:T,onChangeInner:w,onBlur:V,onFocus:L,rightIconClick:K,leftIconClick:P,options:_,style:A}=a,H=e(a,r),J=R;k||"textarea"!==m||(J=h);const O=l((e=>{var t;y?null==e||null===(t=e.preventDefault)||void 0===t||t.call(e):L&&L(e)}),[y,L]),S=l((e=>{y||(w&&null!=e&&e.target?(e.target.value=w(e.target.value),T&&T(e)):T&&T(e))}),[w,T,y]),W=n((()=>void 0===d?{defaultValue:v}:{value:d}),[d,v]);return React.createElement("div",{className:c(i.field,(b||y)&&i.disabled,D),style:A},React.createElement("label",{htmlFor:s,className:"label"},o),React.createElement("div",{className:"field ".concat(B?"has-addons":"")},React.createElement("div",{className:"control mainControl ".concat(j&&!E?"has-icons-left":""," ").concat(F?"has-icons-right":"")},!E&&(k||"select"!==m&&!_?!k&&React.createElement(J,t({name:s,id:s,ref:C,className:"input ".concat(N?"is-danger":""),type:m,placeholder:g},W,{onChange:S,onBlur:V,onFocus:O,onKeyDown:O,autoComplete:"off",disabled:b},H)):React.createElement(f,t({name:s,id:s,inputRef:C,className:"input ".concat(N?"is-danger":""),type:"select",placeholder:g,value:d,options:_,onChange:T,onBlur:V,onFocus:O,onKeyDown:O,autoComplete:"off",disabled:b},H))),j&&!E&&React.createElement("span",{className:"iconLeft icon is-small is-left ".concat(P?"is-action":""),onClick:P},React.createElement(p,{iconName:j,color:u})),F&&React.createElement("span",{className:"iconRight icon is-small is-right ".concat(K?"is-action":""),onClick:K},React.createElement(p,{iconName:F,color:u})),k&&k),B&&B),x&&React.createElement("p",{className:"help"},x),I&&React.createElement("p",{className:"help ".concat(N?"is-danger":"")},I))}));v.displayName="Field";export{v as Field,f as Select,m as setIconColor,d as setIconComponent};
 //# sourceMappingURL=Field.js.map

package/dist/ui/esm/src/core/ui/components/field/Field.js.map

@@ -1 +1 @@
-{"version":3,"file":"Field.js","sources":["../../../../../../../../src/core/ui/components/field/Field.tsx"],"sourcesContent":["/* eslint-disable react/jsx-props-no-spreading */\n/* eslint-disable jsx-a11y/no-static-element-interactions */\n/* eslint-disable jsx-a11y/click-events-have-key-events */\nimport { FC, ReactNode, memo, useMemo, useCallback, PropsWithChildren, CSSProperties, createElement } from 'react'\n\nimport { classNames } from '../../../utils/helpers/ui'\n\nimport classes from './field.module.scss'\nimport type { FieldError, IconComponentType } from './types'\n\nlet iconColor: string | (() => string) = () => '#000000'\n\nexport const setIconColor = (color: string | (() => string)): void => {\n  iconColor = color\n}\n\nlet IconComponent: IconComponentType = memo(function IconComponent() { return <span /> })\n\nexport const setIconComponent = (component: IconComponentType): void => {\n  IconComponent = component\n}\n\nexport type FileWrapperProps = PropsWithChildren<unknown> & {\n  className?: string\n  error?: boolean\n  disabled?: boolean\n  userDisabled?: boolean\n  css?: string\n}\n\ntype EventType = { target: any; type?: any } & Partial<Event>\nexport interface FieldProps {\n  label?: string\n  name?: string\n  type?: string\n  min?: number | string | Date | any\n  max?: number | string | Date | any\n  value?: string | number | readonly string[] | undefined\n  defaultValue?: string | number | readonly string[] | undefined\n  placeholder?: string\n  inputRef?: ReactHookFormRef\n  error?: boolean\n  errors?: FieldError\n  disabled?: boolean\n  userDisabled?: boolean\n  checked?: boolean\n  helpTextInfo?: string\n  helpText?: string\n  iconLeft?: string\n  iconRight?: string\n  withoutComponent?: boolean\n  addon?: ReactNode\n  children?: ReactNode\n  className?: string\n  onChange?: (event?: EventType) => unknown\n  // TODO, rename... something like changeHandler or valueDecorator\n  onChangeInner?: (value: string | number) => string | number\n  onBlur?: (event?: EventType) => void\n  onFocus?: (event?: EventType | undefined) => void\n  rightIconClick?: (event?: EventType) => void\n  leftIconClick?: (event?: EventType) => void\n  options?: any[] | null\n  creatable?: boolean\n  async?: boolean\n  style?: CSSProperties\n  [key: string]: any\n}\n\ninterface SelectProps extends FieldProps {\n  id?: string\n}\n\ntype OptionObj = { label: string | number | undefined; value: string | number | undefined }\ntype Option = OptionObj | string | number\n\nexport const Select: FC<SelectProps>\n= memo<SelectProps>(\n  function Select({ options, value, inputRef, ...props }: SelectProps) {\n    return (\n      <div className='select'>\n        <select {...props} ref={inputRef} defaultValue={value}>\n          {options?.map((option: Option) => (\n            <option\n              key={`${JSON.stringify(option)}`}\n              value={typeof option === 'object' ? (option as OptionObj)?.value : option}\n            >\n              {typeof option === 'object' ? (option as OptionObj)?.label : option}\n            </option>\n          ))}\n        </select>\n      </div>\n    )\n  },\n)\nconst TextAreaComponent = memo((props) => createElement('textarea', props))\n\nTextAreaComponent.displayName = 'TextAreaComponent'\n\nconst InputComponent = memo((props) => createElement('input', props))\n\nInputComponent.displayName = 'InputComponent'\n\nexport const Field: FC<FieldProps> = memo<FieldProps>(({\n  label,\n  name,\n  type = 'text',\n  value,\n  defaultValue,\n  placeholder,\n  inputRef,\n  error,\n  disabled,\n  userDisabled,\n  withoutComponent,\n  helpTextInfo,\n  helpText,\n  children,\n  iconLeft,\n  iconRight,\n  addon,\n  className,\n  onChange,\n  onChangeInner,\n  onBlur,\n  onFocus,\n  rightIconClick,\n  leftIconClick,\n  options,\n  style,\n  ...props\n}: FieldProps) => {\n  let Component: FC<any> = InputComponent\n\n  if (!children && type === 'textarea') {\n    Component = TextAreaComponent\n  }\n  const handleFocus = useCallback((event: Event | EventType | undefined) => {\n    if (userDisabled) {\n      event?.preventDefault?.()\n    } else {\n      onFocus && onFocus(event)\n    }\n  }, [userDisabled, onFocus])\n\n  const handleChange = useCallback((event: { target: { value: string } }) => {\n    if (userDisabled) {\n      return\n    }\n    if (onChangeInner && event?.target) {\n      // eslint-disable-next-line no-param-reassign\n      event.target.value = onChangeInner((event.target.value as string)) as string\n      onChange && onChange(event as EventType)\n    } else {\n      onChange && onChange(event as EventType)\n    }\n  }, [onChangeInner, onChange, userDisabled])\n\n  const valueProps = useMemo(() => {\n    if (value === undefined) {\n      return { defaultValue }\n    }\n    return { value }\n  }, [value, defaultValue])\n\n  return (\n    <div\n      className={classNames(\n        classes.field,\n        (disabled || userDisabled) && classes.disabled,\n        className,\n      )}\n      // TODO fix\n      // error={error}\n      style={style}\n    >\n      <label htmlFor={name} className='label'>{label}</label>\n      <div className={`field ${addon ? 'has-addons' : ''}`}>\n        <div\n          className={`control mainControl ${iconLeft && !withoutComponent\n            ? 'has-icons-left' : ''} ${iconRight ? 'has-icons-right' : ''}`}\n        >\n          {!withoutComponent && ((!children && (type === 'select' || options))\n            ? (\n              <Select\n                name={name}\n                id={name}\n                inputRef={inputRef}\n                className={`input ${error ? 'is-danger' : ''}`}\n                type='select'\n                placeholder={placeholder}\n                value={value}\n                options={options}\n                // TODO also handle change but value versus event.target.value issue\n                onChange={onChange}\n                onBlur={onBlur}\n                onFocus={handleFocus}\n                onKeyDown={handleFocus}\n                autoComplete='off'\n                disabled={disabled}\n                {...props}\n              />\n            )\n            : (\n              !children && (\n              <Component\n                name={name}\n                id={name}\n                ref={inputRef}\n                className={`input ${error ? 'is-danger' : ''}`}\n                type={type}\n                placeholder={placeholder}\n                {...valueProps}\n                onChange={handleChange}\n                onBlur={onBlur}\n                onFocus={handleFocus}\n                onKeyDown={handleFocus}\n                autoComplete='off'\n                disabled={disabled}\n                {...props}\n              />\n              )))}\n\n          {iconLeft && !withoutComponent && (\n            <span\n              className={`iconLeft icon is-small is-left ${leftIconClick ? 'is-action' : ''}`}\n              onClick={leftIconClick}\n            >\n              <IconComponent\n                iconName={iconLeft}\n                color={iconColor}\n              />\n            </span>\n          )}\n          {iconRight && (\n            <span\n              className={`iconRight icon is-small is-right ${rightIconClick ? 'is-action' : ''}`}\n              onClick={rightIconClick}\n            >\n              <IconComponent\n                iconName={iconRight}\n                color={iconColor}\n              />\n            </span>\n          )}\n          {children && children}\n        </div>\n        {addon && addon}\n      </div>\n      {helpTextInfo && <p className='help'>{helpTextInfo}</p>}\n      {helpText && <p className={`help ${error ? 'is-danger' : ''}`}>{helpText}</p>}\n    </div>\n  )\n})\n\nField.displayName = 'Field'\n"],"names":["iconColor","setIconColor","color","IconComponent","memo","React","createElement","setIconComponent","component","Select","_ref","options","value","inputRef","props","_objectWithoutProperties","_excluded","className","_extends","ref","defaultValue","map","option","key","concat","JSON","stringify","label","TextAreaComponent","displayName","InputComponent","Field","_ref2","name","type","placeholder","error","disabled","userDisabled","withoutComponent","helpTextInfo","helpText","children","iconLeft","iconRight","addon","onChange","onChangeInner","onBlur","onFocus","rightIconClick","leftIconClick","style","_excluded2","Component","handleFocus","useCallback","event","_event$preventDefault","preventDefault","call","handleChange","target","valueProps","useMemo","undefined","classNames","classes","field","htmlFor","id","onKeyDown","autoComplete","onClick","iconName"],"mappings":"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"}
+{"version":3,"file":"Field.js","sources":["../../../../../../../../src/core/ui/components/field/Field.tsx"],"sourcesContent":["/* eslint-disable react/jsx-props-no-spreading */\n/* eslint-disable jsx-a11y/no-static-element-interactions */\n/* eslint-disable jsx-a11y/click-events-have-key-events */\nimport { FC, ReactNode, memo, useMemo, useCallback, PropsWithChildren, CSSProperties, createElement } from 'react'\n\nimport { classNames } from '../../../utils/helpers/ui'\n\nimport classes from './field.module.scss'\nimport type { FieldError, IconComponentType } from './types'\n\nlet iconColor: string | (() => string) = () => '#000000'\n\nexport const setIconColor = (color: string | (() => string)): void => {\n  iconColor = color\n}\n\nlet IconComponent: IconComponentType = memo(function IconComponent() { return <span /> })\n\nexport const setIconComponent = (component: IconComponentType): void => {\n  IconComponent = component\n}\n\nexport type FileWrapperProps = PropsWithChildren<unknown> & {\n  className?: string\n  error?: boolean\n  disabled?: boolean\n  userDisabled?: boolean\n  css?: string\n}\n\ntype EventType = { target: any; type?: any } & Partial<Event>\nexport interface FieldProps {\n  label?: string\n  name?: string\n  type?: string\n  min?: number | string | Date | any\n  max?: number | string | Date | any\n  value?: string | number | readonly string[] | undefined\n  defaultValue?: string | number | readonly string[] | undefined\n  placeholder?: string\n  inputRef?: ReactHookFormRef\n  error?: boolean\n  errors?: FieldError\n  disabled?: boolean\n  userDisabled?: boolean\n  checked?: boolean\n  helpTextInfo?: string\n  helpText?: string\n  iconLeft?: string\n  iconRight?: string\n  withoutComponent?: boolean\n  addon?: ReactNode\n  children?: ReactNode\n  className?: string\n  onChange?: (event?: EventType) => unknown\n  // TODO, rename... something like changeHandler or valueDecorator\n  onChangeInner?: (value: string | number) => string | number\n  onBlur?: (event?: EventType) => void\n  onFocus?: (event?: EventType | undefined) => void\n  rightIconClick?: (event?: EventType) => void\n  leftIconClick?: (event?: EventType) => void\n  options?: any[] | null\n  creatable?: boolean\n  async?: boolean\n  style?: CSSProperties\n  [key: string]: any\n}\n\ninterface SelectProps extends FieldProps {\n  id?: string\n}\n\ntype OptionObj = { label: string | number | undefined; value: string | number | undefined }\ntype Option = OptionObj | string | number\n\nexport const Select: FC<SelectProps>\n= memo<SelectProps>(\n  function Select({ options, value, inputRef, ...props }: SelectProps) {\n    return (\n      <div className='select'>\n        <select {...props} ref={inputRef} defaultValue={value}>\n          {options?.map((option: Option) => (\n            <option\n              key={`${JSON.stringify(option)}`}\n              value={typeof option === 'object' ? (option as OptionObj)?.value : option}\n            >\n              {typeof option === 'object' ? (option as OptionObj)?.label : option}\n            </option>\n          ))}\n        </select>\n      </div>\n    )\n  },\n)\nconst TextAreaComponent = memo((props) => createElement('textarea', props))\n\nTextAreaComponent.displayName = 'TextAreaComponent'\n\nconst InputComponent = memo((props) => createElement('input', props))\n\nInputComponent.displayName = 'InputComponent'\n\nexport const Field: FC<FieldProps> = memo<FieldProps>(({\n  label,\n  name,\n  type = 'text',\n  value,\n  defaultValue,\n  placeholder,\n  inputRef,\n  error,\n  disabled,\n  userDisabled,\n  withoutComponent,\n  helpTextInfo,\n  helpText,\n  children,\n  iconLeft,\n  iconRight,\n  addon,\n  className,\n  onChange,\n  onChangeInner,\n  onBlur,\n  onFocus,\n  rightIconClick,\n  leftIconClick,\n  options,\n  style,\n  ...props\n}: FieldProps) => {\n  let Component: FC<any> = InputComponent\n\n  if (!children && type === 'textarea') {\n    Component = TextAreaComponent\n  }\n  const handleFocus = useCallback((event: Event | EventType | undefined) => {\n    if (userDisabled) {\n      event?.preventDefault?.()\n    } else {\n      onFocus && onFocus(event)\n    }\n  }, [userDisabled, onFocus])\n\n  const handleChange = useCallback((event: { target: { value: string } }) => {\n    if (userDisabled) {\n      return\n    }\n    if (onChangeInner && event?.target) {\n      // eslint-disable-next-line no-param-reassign\n      event.target.value = onChangeInner((event.target.value as string)) as string\n      onChange && onChange(event as EventType)\n    } else {\n      onChange && onChange(event as EventType)\n    }\n  }, [onChangeInner, onChange, userDisabled])\n\n  const valueProps = useMemo(() => {\n    if (value === undefined) {\n      return { defaultValue }\n    }\n    return { value }\n  }, [value, defaultValue])\n\n  return (\n    <div\n      className={classNames(\n        classes.field,\n        (disabled || userDisabled) && classes.disabled,\n        className,\n      )}\n      // TODO fix\n      // error={error}\n      style={style}\n    >\n      <label htmlFor={name} className='label'>{label}</label>\n      <div className={`field ${addon ? 'has-addons' : ''}`}>\n        <div\n          className={`control mainControl ${iconLeft && !withoutComponent\n            ? 'has-icons-left' : ''} ${iconRight ? 'has-icons-right' : ''}`}\n        >\n          {!withoutComponent && ((!children && (type === 'select' || options))\n            ? (\n              <Select\n                name={name}\n                id={name}\n                inputRef={inputRef}\n                className={`input ${error ? 'is-danger' : ''}`}\n                type='select'\n                placeholder={placeholder}\n                value={value}\n                options={options}\n                // TODO also handle change but value versus event.target.value issue\n                onChange={onChange}\n                onBlur={onBlur}\n                onFocus={handleFocus}\n                onKeyDown={handleFocus}\n                autoComplete='off'\n                disabled={disabled}\n                {...props}\n              />\n            )\n            : (\n              !children && (\n              <Component\n                name={name}\n                id={name}\n                ref={inputRef}\n                className={`input ${error ? 'is-danger' : ''}`}\n                type={type}\n                placeholder={placeholder}\n                {...valueProps}\n                onChange={handleChange}\n                onBlur={onBlur}\n                onFocus={handleFocus}\n                onKeyDown={handleFocus}\n                autoComplete='off'\n                disabled={disabled}\n                {...props}\n              />\n              )))}\n\n          {iconLeft && !withoutComponent && (\n            <span\n              className={`iconLeft icon is-small is-left ${leftIconClick ? 'is-action' : ''}`}\n              onClick={leftIconClick}\n            >\n              <IconComponent\n                iconName={iconLeft}\n                color={iconColor}\n              />\n            </span>\n          )}\n          {iconRight && (\n            <span\n              className={`iconRight icon is-small is-right ${rightIconClick ? 'is-action' : ''}`}\n              onClick={rightIconClick}\n            >\n              <IconComponent\n                iconName={iconRight}\n                color={iconColor}\n              />\n            </span>\n          )}\n          {children && children}\n        </div>\n        {addon && addon}\n      </div>\n      {helpTextInfo && <p className='help'>{helpTextInfo}</p>}\n      {helpText && <p className={`help ${error ? 'is-danger' : ''}`}>{helpText}</p>}\n    </div>\n  )\n})\n\nField.displayName = 'Field'\n"],"names":["iconColor","setIconColor","color","IconComponent","memo","React","createElement","setIconComponent","component","Select","_ref","options","value","inputRef","props","_objectWithoutProperties","_excluded","className","_extends","ref","defaultValue","map","option","key","concat","JSON","stringify","label","TextAreaComponent","displayName","InputComponent","Field","_ref2","name","type","placeholder","error","disabled","userDisabled","withoutComponent","helpTextInfo","helpText","children","iconLeft","iconRight","addon","onChange","onChangeInner","onBlur","onFocus","rightIconClick","leftIconClick","style","_excluded2","Component","handleFocus","useCallback","event","_event$preventDefault","preventDefault","call","handleChange","target","valueProps","useMemo","undefined","classNames","classes","field","htmlFor","id","onKeyDown","autoComplete","onClick","iconName"],"mappings":"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"}

package/dist/ui/esm/src/core/ui/components/icon/Icon.js

@@ -1,2 +1,2 @@
-import{r as e}from"../../../../../node_modules/react/index.js";const a=e.memo((e=>{let{icon:a,className:c,color:o="currentColor"}=e;return React.createElement("svg",{"aria-hidden":"true",focusable:"false","data-prefix":a.prefix,"data-icon":a.iconName,className:"svg-inline--fa fa-".concat(a.iconName," ").concat(c),role:"img",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 ".concat(a.icon[0]," ").concat(a.icon[1])},React.createElement("path",{fill:o,d:a.icon[4]}))}));a.displayName="Icon";export{a as Icon};
+import{memo as e}from"react";const a=e((e=>{let{icon:a,className:c,color:o="currentColor"}=e;return React.createElement("svg",{"aria-hidden":"true",focusable:"false","data-prefix":a.prefix,"data-icon":a.iconName,className:"svg-inline--fa fa-".concat(a.iconName," ").concat(c),role:"img",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 ".concat(a.icon[0]," ").concat(a.icon[1])},React.createElement("path",{fill:o,d:a.icon[4]}))}));a.displayName="Icon";export{a as Icon};
 //# sourceMappingURL=Icon.js.map

package/dist/ui/esm/src/core/ui/components/icon/Icon.js.map

@@ -1 +1 @@
-{"version":3,"file":"Icon.js","sources":["../../../../../../../../src/core/ui/components/icon/Icon.tsx"],"sourcesContent":["import { memo } from 'react'\n\ntype IconType = {\n  icon: {\n    prefix: string\n    iconName: string\n    icon: any[]\n  }\n  className?: string\n  color?: string\n}\n\nexport const Icon = memo<IconType>(({ icon, className, color = 'currentColor' }: IconType) => (\n  <svg\n    aria-hidden='true'\n    focusable='false'\n    data-prefix={icon.prefix}\n    data-icon={icon.iconName}\n    className={`svg-inline--fa fa-${icon.iconName} ${className}`}\n    role='img'\n    xmlns='http://www.w3.org/2000/svg'\n    viewBox={`0 0 ${icon.icon[0]} ${icon.icon[1]}`}\n  >\n    <path\n      fill={color}\n      d={icon.icon[4]}\n    />\n  </svg>\n))\n\nIcon.displayName = 'Icon'\n"],"names":["Icon","memo","_ref","icon","className","color","React","createElement","focusable","prefix","iconName","concat","role","xmlns","viewBox","fill","d","displayName"],"mappings":"+DAYaA,MAAAA,EAAOC,EAAIA,MAAWC,IAAA,IAACC,KAAEA,EAAIC,UAAEA,EAASC,MAAEA,EAAQ,gBAA0BH,EAAA,OACvFI,MAAAC,cAAA,MAAA,CACE,cAAY,OACZC,UAAU,QACV,cAAaL,EAAKM,OAClB,YAAWN,EAAKO,SAChBN,UAAS,qBAAAO,OAAuBR,EAAKO,SAAQC,KAAAA,OAAIP,GACjDQ,KAAK,MACLC,MAAM,6BACNC,eAAOH,OAASR,EAAKA,KAAK,GAAE,KAAAQ,OAAIR,EAAKA,KAAK,KAE1CG,MAAAC,cAAA,OAAA,CACEQ,KAAMV,EACNW,EAAGb,EAAKA,KAAK,KAEX,IAGRH,EAAKiB,YAAc"}
+{"version":3,"file":"Icon.js","sources":["../../../../../../../../src/core/ui/components/icon/Icon.tsx"],"sourcesContent":["import { memo } from 'react'\n\ntype IconType = {\n  icon: {\n    prefix: string\n    iconName: string\n    icon: any[]\n  }\n  className?: string\n  color?: string\n}\n\nexport const Icon = memo<IconType>(({ icon, className, color = 'currentColor' }: IconType) => (\n  <svg\n    aria-hidden='true'\n    focusable='false'\n    data-prefix={icon.prefix}\n    data-icon={icon.iconName}\n    className={`svg-inline--fa fa-${icon.iconName} ${className}`}\n    role='img'\n    xmlns='http://www.w3.org/2000/svg'\n    viewBox={`0 0 ${icon.icon[0]} ${icon.icon[1]}`}\n  >\n    <path\n      fill={color}\n      d={icon.icon[4]}\n    />\n  </svg>\n))\n\nIcon.displayName = 'Icon'\n"],"names":["Icon","memo","_ref","icon","className","color","React","createElement","focusable","prefix","iconName","concat","role","xmlns","viewBox","fill","d","displayName"],"mappings":"6BAYaA,MAAAA,EAAOC,GAAeC,IAAA,IAACC,KAAEA,EAAIC,UAAEA,EAASC,MAAEA,EAAQ,gBAA0BH,EAAA,OACvFI,MAAAC,cAAA,MAAA,CACE,cAAY,OACZC,UAAU,QACV,cAAaL,EAAKM,OAClB,YAAWN,EAAKO,SAChBN,UAAS,qBAAAO,OAAuBR,EAAKO,SAAQC,KAAAA,OAAIP,GACjDQ,KAAK,MACLC,MAAM,6BACNC,eAAOH,OAASR,EAAKA,KAAK,GAAE,KAAAQ,OAAIR,EAAKA,KAAK,KAE1CG,MAAAC,cAAA,OAAA,CACEQ,KAAMV,EACNW,EAAGb,EAAKA,KAAK,KAEX,IAGRH,EAAKiB,YAAc"}

package/dist/ui/esm/src/core/ui/components/icon/IconBase.js

@@ -1,2 +1,2 @@
-import{objectWithoutProperties as o,objectSpread2 as e,extends as i}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import{r as t}from"../../../../../node_modules/react/index.js";import n from"./icon.module.scss.js";import{unifyIconUrl as c}from"./unifyIconUrl.js";const r=["iconUrl","minWidth","minHeight","size","fontSize","width","height","color","className","children","icon","style","onClick"],s=t.memo((s=>{let{iconUrl:l,minWidth:a,minHeight:m,size:h,fontSize:u,width:d,height:p,color:f="currentColor",className:b="",children:g,icon:j,style:y,onClick:z}=s,w=o(s,r);const x=l&&c(l),C=t.useMemo((()=>e(e(e(e(e({"--min-width":a||h||d||"auto","--min-height":m||h||p||"auto","--width":h||d||"1rem","--height":h||p||"1rem"},u?{fontSize:u}:{}),x?{"--icon-url":"url(".concat(x,")")}:{}),x?{"--icon-color":f}:{"--icon-content-color":f}),z?{cursor:"pointer"}:{}),y)),[a,h,d,m,p,u,x,f,z,y]),N=t.useMemo((()=>z?{onClick:z,role:"button",tabIndex:-1}:{}),[z]);return React.createElement("span",i({},w,N,{className:"".concat(n["icon-base"]," icon-base ").concat(b),style:C}),!x&&g&&g,!x&&j&&j)}));s.displayName="IconBase";export{s as IconBase};
+import{objectWithoutProperties as o,objectSpread2 as e,extends as t}from"../../../../../_virtual/_rollupPluginBabelHelpers.js";import{memo as i,useMemo as n}from"react";import c from"./icon.module.scss.js";import{unifyIconUrl as r}from"./unifyIconUrl.js";const l=["iconUrl","minWidth","minHeight","size","fontSize","width","height","color","className","children","icon","style","onClick"],s=i((i=>{let{iconUrl:s,minWidth:a,minHeight:m,size:h,fontSize:u,width:d,height:p,color:f="currentColor",className:b="",children:g,icon:j,style:y,onClick:z}=i,w=o(i,l);const C=s&&r(s),N=n((()=>e(e(e(e(e({"--min-width":a||h||d||"auto","--min-height":m||h||p||"auto","--width":h||d||"1rem","--height":h||p||"1rem"},u?{fontSize:u}:{}),C?{"--icon-url":"url(".concat(C,")")}:{}),C?{"--icon-color":f}:{"--icon-content-color":f}),z?{cursor:"pointer"}:{}),y)),[a,h,d,m,p,u,C,f,z,y]),S=n((()=>z?{onClick:z,role:"button",tabIndex:-1}:{}),[z]);return React.createElement("span",t({},w,S,{className:"".concat(c["icon-base"]," icon-base ").concat(b),style:N}),!C&&g&&g,!C&&j&&j)}));s.displayName="IconBase";export{s as IconBase};
 //# sourceMappingURL=IconBase.js.map

package/dist/ui/esm/src/core/ui/components/icon/IconBase.js.map

@@ -1 +1 @@
-{"version":3,"file":"IconBase.js","sources":["../../../../../../../../src/core/ui/components/icon/IconBase.tsx"],"sourcesContent":["import { CSSProperties, memo, useMemo, FC, PropsWithChildren, MouseEvent, KeyboardEvent, ReactNode } from 'react'\n\nimport classes from './icon.module.scss'\nimport { unifyIconUrl } from './unifyIconUrl'\n\n\nexport type IconBaseProps = PropsWithChildren<unknown> & {\n  id?: string\n  iconUrl?: string | null\n  minWidth?: string | null\n  minHeight?: string | null\n  width?: string | null\n  height?: string | null\n  size?: string | null\n  fontSize?: string | null\n  color?: string | null\n  className?: string | null\n  style?: CSSProperties | null\n  onClick?: (event: MouseEvent | KeyboardEvent) => void\n  icon?: ReactNode\n}\n\nexport const IconBase: FC<IconBaseProps> = memo<IconBaseProps>(({\n  iconUrl, minWidth, minHeight, size,\n  fontSize, width, height, color = 'currentColor', className = '', children, icon, style, onClick, ...props\n}: IconBaseProps) => {\n  const unifiedIconUrl = iconUrl && unifyIconUrl(iconUrl)\n\n  const styles = useMemo(() => (\n    {\n      '--min-width': minWidth || size || width || 'auto',\n      '--min-height': minHeight || size || height || 'auto',\n      '--width': size || width || '1rem',\n      '--height': size || height || '1rem',\n      ...(fontSize ? { fontSize } : {}),\n      ...(unifiedIconUrl ? { '--icon-url': `url(${unifiedIconUrl})` } : {}),\n      ...(unifiedIconUrl ? { '--icon-color': color } : { '--icon-content-color': color }),\n      ...(onClick ? { cursor: 'pointer' } : {}),\n      ...style,\n    }\n  ), [minWidth, size, width, minHeight, height, fontSize, unifiedIconUrl, color, onClick, style])\n\n  const onClickProps = useMemo(() => (onClick ? ({\n    onClick,\n    role: 'button',\n    tabIndex: -1,\n  }) : {}), [onClick])\n\n  return (\n    <span\n      {...props}\n      {...onClickProps}\n      className={`${classes['icon-base']} icon-base ${className}`}\n      style={styles as CSSProperties}\n    >\n      {(!unifiedIconUrl && children) && children}\n      {(!unifiedIconUrl && icon) && icon}\n    </span>\n  )\n})\n\nIconBase.displayName = 'IconBase'\n"],"names":["IconBase","memo","_ref","iconUrl","minWidth","minHeight","size","fontSize","width","height","color","className","children","icon","style","onClick","props","_objectWithoutProperties","_excluded","unifiedIconUrl","unifyIconUrl","styles","useMemo","_objectSpread","concat","cursor","onClickProps","role","tabIndex","React","createElement","_extends","classes","displayName"],"mappings":"0ZAsBaA,EAA8BC,EAAIA,MAAgBC,IAG1C,IAH2CC,QAC9DA,EAAOC,SAAEA,EAAQC,UAAEA,EAASC,KAAEA,EAAIC,SAClCA,EAAQC,MAAEA,EAAKC,OAAEA,EAAMC,MAAEA,EAAQ,eAAcC,UAAEA,EAAY,GAAEC,SAAEA,EAAQC,KAAEA,EAAIC,MAAEA,EAAKC,QAAEA,GAC1Eb,EADsFc,EAAKC,EAAAf,EAAAgB,GAEzG,MAAMC,EAAiBhB,GAAWiB,EAAajB,GAEzCkB,EAASC,EAAAA,SAAQ,IAAAC,EAAAA,EAAAA,EAAAA,EAAAA,EAAA,CAEnB,cAAenB,GAAYE,GAAQE,GAAS,OAC5C,eAAgBH,GAAaC,GAAQG,GAAU,OAC/C,UAAWH,GAAQE,GAAS,OAC5B,WAAYF,GAAQG,GAAU,QAC1BF,EAAW,CAAEA,YAAa,CAAA,GAC1BY,EAAiB,CAAE,aAAY,OAAAK,OAASL,EAAc,MAAQ,CAAA,GAC9DA,EAAiB,CAAE,eAAgBT,GAAU,CAAE,uBAAwBA,IACvEK,EAAU,CAAEU,OAAQ,WAAc,CAAA,GACnCX,IAEJ,CAACV,EAAUE,EAAME,EAAOH,EAAWI,EAAQF,EAAUY,EAAgBT,EAAOK,EAASD,IAElFY,EAAeJ,WAAQ,IAAOP,EAAW,CAC7CA,UACAY,KAAM,SACNC,UAAW,GACR,CAAG,GAAE,CAACb,IAEX,OACEc,MAAAC,cAAA,OAAAC,EACMf,CAAAA,EAAAA,EACAU,EAAY,CAChBf,UAAS,GAAAa,OAAKQ,EAAQ,aAAYR,eAAAA,OAAcb,GAChDG,MAAOO,KAEJF,GAAkBP,GAAaA,GAC/BO,GAAkBN,GAASA,EACzB,IAIXb,EAASiC,YAAc"}
+{"version":3,"file":"IconBase.js","sources":["../../../../../../../../src/core/ui/components/icon/IconBase.tsx"],"sourcesContent":["import { CSSProperties, memo, useMemo, FC, PropsWithChildren, MouseEvent, KeyboardEvent, ReactNode } from 'react'\n\nimport classes from './icon.module.scss'\nimport { unifyIconUrl } from './unifyIconUrl'\n\n\nexport type IconBaseProps = PropsWithChildren<unknown> & {\n  id?: string\n  iconUrl?: string | null\n  minWidth?: string | null\n  minHeight?: string | null\n  width?: string | null\n  height?: string | null\n  size?: string | null\n  fontSize?: string | null\n  color?: string | null\n  className?: string | null\n  style?: CSSProperties | null\n  onClick?: (event: MouseEvent | KeyboardEvent) => void\n  icon?: ReactNode\n}\n\nexport const IconBase: FC<IconBaseProps> = memo<IconBaseProps>(({\n  iconUrl, minWidth, minHeight, size,\n  fontSize, width, height, color = 'currentColor', className = '', children, icon, style, onClick, ...props\n}: IconBaseProps) => {\n  const unifiedIconUrl = iconUrl && unifyIconUrl(iconUrl)\n\n  const styles = useMemo(() => (\n    {\n      '--min-width': minWidth || size || width || 'auto',\n      '--min-height': minHeight || size || height || 'auto',\n      '--width': size || width || '1rem',\n      '--height': size || height || '1rem',\n      ...(fontSize ? { fontSize } : {}),\n      ...(unifiedIconUrl ? { '--icon-url': `url(${unifiedIconUrl})` } : {}),\n      ...(unifiedIconUrl ? { '--icon-color': color } : { '--icon-content-color': color }),\n      ...(onClick ? { cursor: 'pointer' } : {}),\n      ...style,\n    }\n  ), [minWidth, size, width, minHeight, height, fontSize, unifiedIconUrl, color, onClick, style])\n\n  const onClickProps = useMemo(() => (onClick ? ({\n    onClick,\n    role: 'button',\n    tabIndex: -1,\n  }) : {}), [onClick])\n\n  return (\n    <span\n      {...props}\n      {...onClickProps}\n      className={`${classes['icon-base']} icon-base ${className}`}\n      style={styles as CSSProperties}\n    >\n      {(!unifiedIconUrl && children) && children}\n      {(!unifiedIconUrl && icon) && icon}\n    </span>\n  )\n})\n\nIconBase.displayName = 'IconBase'\n"],"names":["IconBase","memo","_ref","iconUrl","minWidth","minHeight","size","fontSize","width","height","color","className","children","icon","style","onClick","props","_objectWithoutProperties","_excluded","unifiedIconUrl","unifyIconUrl","styles","useMemo","_objectSpread","concat","cursor","onClickProps","role","tabIndex","React","createElement","_extends","classes","displayName"],"mappings":"qYAsBaA,EAA8BC,GAAoBC,IAG1C,IAH2CC,QAC9DA,EAAOC,SAAEA,EAAQC,UAAEA,EAASC,KAAEA,EAAIC,SAClCA,EAAQC,MAAEA,EAAKC,OAAEA,EAAMC,MAAEA,EAAQ,eAAcC,UAAEA,EAAY,GAAEC,SAAEA,EAAQC,KAAEA,EAAIC,MAAEA,EAAKC,QAAEA,GAC1Eb,EADsFc,EAAKC,EAAAf,EAAAgB,GAEzG,MAAMC,EAAiBhB,GAAWiB,EAAajB,GAEzCkB,EAASC,GAAQ,IAAAC,EAAAA,EAAAA,EAAAA,EAAAA,EAAA,CAEnB,cAAenB,GAAYE,GAAQE,GAAS,OAC5C,eAAgBH,GAAaC,GAAQG,GAAU,OAC/C,UAAWH,GAAQE,GAAS,OAC5B,WAAYF,GAAQG,GAAU,QAC1BF,EAAW,CAAEA,YAAa,CAAA,GAC1BY,EAAiB,CAAE,aAAY,OAAAK,OAASL,EAAc,MAAQ,CAAA,GAC9DA,EAAiB,CAAE,eAAgBT,GAAU,CAAE,uBAAwBA,IACvEK,EAAU,CAAEU,OAAQ,WAAc,CAAA,GACnCX,IAEJ,CAACV,EAAUE,EAAME,EAAOH,EAAWI,EAAQF,EAAUY,EAAgBT,EAAOK,EAASD,IAElFY,EAAeJ,GAAQ,IAAOP,EAAW,CAC7CA,UACAY,KAAM,SACNC,UAAW,GACR,CAAG,GAAE,CAACb,IAEX,OACEc,MAAAC,cAAA,OAAAC,EACMf,CAAAA,EAAAA,EACAU,EAAY,CAChBf,UAAS,GAAAa,OAAKQ,EAAQ,aAAYR,eAAAA,OAAcb,GAChDG,MAAOO,KAEJF,GAAkBP,GAAaA,GAC/BO,GAAkBN,GAASA,EACzB,IAIXb,EAASiC,YAAc"}

package/dist/ui/esm/src/core/ui/components/icon/unifyIconUrl.js

@@ -1,2 +1,2 @@
-import"../../../../../node_modules/core-js/modules/es.regexp.exec.js";import"../../../../../node_modules/core-js/modules/es.string.replace.js";import"../../../../../node_modules/core-js/modules/es.string.replace-all.js";import e from"../../../../../node_modules/ramda/es/is.js";const l=l=>{if(!l||!e(String,l)||!l||null!=l&&l.includes(".svg")||null!=l&&l.includes("data:image/svg+xml;base64"))return l;const s=null==l?void 0:l.replaceAll("/\\s+/g"," ").replaceAll("'",'"').replaceAll("%25","%").replaceAll("%23","#").replaceAll("%3c","<").replaceAll("%3e",">").replaceAll("%20"," ").replaceAll("data:image/svg+xml,","");return"data:image/svg+xml;base64,".concat(btoa(s))};export{l as unifyIconUrl};
+import"../../../../../node_modules/core-js/modules/es.regexp.exec.js";import"../../../../../node_modules/core-js/modules/es.string.replace.js";import"../../../../../node_modules/core-js/modules/es.string.replace-all.js";import{is as e}from"ramda";const l=l=>{if(!l||!e(String,l)||!l||null!=l&&l.includes(".svg")||null!=l&&l.includes("data:image/svg+xml;base64"))return l;const r=null==l?void 0:l.replaceAll("/\\s+/g"," ").replaceAll("'",'"').replaceAll("%25","%").replaceAll("%23","#").replaceAll("%3c","<").replaceAll("%3e",">").replaceAll("%20"," ").replaceAll("data:image/svg+xml,","");return"data:image/svg+xml;base64,".concat(btoa(r))};export{l as unifyIconUrl};
 //# sourceMappingURL=unifyIconUrl.js.map

package/dist/ui/esm/src/core/ui/components/icon/unifyIconUrl.js.map

@@ -1 +1 @@
-{"version":3,"file":"unifyIconUrl.js","sources":["../../../../../../../../src/core/ui/components/icon/unifyIconUrl.ts"],"sourcesContent":["import { is } from 'ramda'\n\n// fix of Vite 5 new way of handling assets\n// https://github.com/vitejs/vite/pull/2909\n// https://github.com/vitejs/vite/blob/77d5165e2f252bfecbb0eebccc6f04dc8be0c5ba/packages/vite/src/node/plugins/asset.ts#L419\nexport const unifyIconUrl = (iconUrl: string): string => {\n  if (!iconUrl || !is(String, iconUrl) || !iconUrl\n  || iconUrl?.includes('.svg') || iconUrl?.includes('data:image/svg+xml;base64')) {\n    return iconUrl\n  }\n\n  const unifiedIconUrl = iconUrl?.replaceAll('/\\\\s+/g', ' ')\n    .replaceAll('\\'', '\"')\n    .replaceAll('%25', '%')\n    .replaceAll('%23', '#')\n    .replaceAll('%3c', '<')\n    .replaceAll('%3e', '>')\n    .replaceAll('%20', ' ')\n    .replaceAll('data:image/svg+xml,', '')\n\n  return `data:image/svg+xml;base64,${btoa(unifiedIconUrl)}`\n}\n"],"names":["unifyIconUrl","iconUrl","is","String","includes","unifiedIconUrl","replaceAll","concat","btoa"],"mappings":"sRAKaA,MAAAA,EAAgBC,IAC3B,IAAKA,IAAYC,EAAGC,OAAQF,KAAaA,GACtCA,SAAAA,EAASG,SAAS,SAAWH,SAAAA,EAASG,SAAS,6BAChD,OAAOH,EAGT,MAAMI,EAAiBJ,aAAO,EAAPA,EAASK,WAAW,UAAW,KACnDA,WAAW,IAAM,KACjBA,WAAW,MAAO,KAClBA,WAAW,MAAO,KAClBA,WAAW,MAAO,KAClBA,WAAW,MAAO,KAClBA,WAAW,MAAO,KAClBA,WAAW,sBAAuB,IAErC,MAAA,6BAAAC,OAAoCC,KAAKH,GAAe"}
+{"version":3,"file":"unifyIconUrl.js","sources":["../../../../../../../../src/core/ui/components/icon/unifyIconUrl.ts"],"sourcesContent":["import { is } from 'ramda'\n\n// fix of Vite 5 new way of handling assets\n// https://github.com/vitejs/vite/pull/2909\n// https://github.com/vitejs/vite/blob/77d5165e2f252bfecbb0eebccc6f04dc8be0c5ba/packages/vite/src/node/plugins/asset.ts#L419\nexport const unifyIconUrl = (iconUrl: string): string => {\n  if (!iconUrl || !is(String, iconUrl) || !iconUrl\n  || iconUrl?.includes('.svg') || iconUrl?.includes('data:image/svg+xml;base64')) {\n    return iconUrl\n  }\n\n  const unifiedIconUrl = iconUrl?.replaceAll('/\\\\s+/g', ' ')\n    .replaceAll('\\'', '\"')\n    .replaceAll('%25', '%')\n    .replaceAll('%23', '#')\n    .replaceAll('%3c', '<')\n    .replaceAll('%3e', '>')\n    .replaceAll('%20', ' ')\n    .replaceAll('data:image/svg+xml,', '')\n\n  return `data:image/svg+xml;base64,${btoa(unifiedIconUrl)}`\n}\n"],"names":["unifyIconUrl","iconUrl","is","String","includes","unifiedIconUrl","replaceAll","concat","btoa"],"mappings":"uPAKaA,MAAAA,EAAgBC,IAC3B,IAAKA,IAAYC,EAAGC,OAAQF,KAAaA,GACtCA,SAAAA,EAASG,SAAS,SAAWH,SAAAA,EAASG,SAAS,6BAChD,OAAOH,EAGT,MAAMI,EAAiBJ,aAAO,EAAPA,EAASK,WAAW,UAAW,KACnDA,WAAW,IAAM,KACjBA,WAAW,MAAO,KAClBA,WAAW,MAAO,KAClBA,WAAW,MAAO,KAClBA,WAAW,MAAO,KAClBA,WAAW,MAAO,KAClBA,WAAW,sBAAuB,IAErC,MAAA,6BAAAC,OAAoCC,KAAKH,GAAe"}

package/dist/ui/esm/src/core/ui/components/molecules/layouts/FlowLayout.js

@@ -1,2 +1,2 @@
-import{objectWithoutProperties as e,extends as t}from"../../../../../../_virtual/_rollupPluginBabelHelpers.js";import{r as o}from"../../../../../../node_modules/react/index.js";import a from"./flowLayout.module.scss.js";import{LayoutBox as n}from"../../container/layoutBox/LayoutBox.js";import{classNames as r}from"../../../../utils/helpers/ui.js";const s=["itemDTOs","containerProps","defaultItemLayoutProps","numColumns","className","beforeContent","afterContent"],l=["id","spanColumn","Component","layoutProps"],m=o.memo((m=>{let{itemDTOs:c,containerProps:p={},defaultItemLayoutProps:u={},numColumns:i=1,className:d="",beforeContent:f,afterContent:y}=m,C=e(m,s);const x=o.useMemo((()=>i>0?{display:"grid",gridTemplateColumns:"".concat("1fr ".repeat(i)),width:"100%",height:"unset"}:{display:"flex"}),[i]);return React.createElement(n,t({width:"100%",column:!0,className:r(a.flowLayout,d)},C),f&&React.createElement("span",{className:a.beforeContent,tabIndex:-1},f),React.createElement(n,t({flexWrap:"wrap",gap:"1rem",style:x,width:"100%"},p),c.map((o=>{let{id:a,spanColumn:r,Component:s,layoutProps:m}=o,c=e(o,l);return React.createElement(n,t({key:a},u,m,r?{style:{width:"calc(".concat(Math.round(100*r),"% - ").concat(16*r,"px)")}}:{}),React.createElement(s,c))}))),y&&React.createElement("span",{className:a.afterContent,tabIndex:-1},y))}));m.displayName="FlowLayout";export{m as FlowLayout};
+import{objectWithoutProperties as e,extends as t}from"../../../../../../_virtual/_rollupPluginBabelHelpers.js";import{memo as a,useMemo as o}from"react";import n from"./flowLayout.module.scss.js";import{LayoutBox as r}from"../../container/layoutBox/LayoutBox.js";import{classNames as s}from"../../../../utils/helpers/ui.js";const l=["itemDTOs","containerProps","defaultItemLayoutProps","numColumns","className","beforeContent","afterContent"],m=["id","spanColumn","Component","layoutProps"],c=a((a=>{let{itemDTOs:c,containerProps:p={},defaultItemLayoutProps:u={},numColumns:i=1,className:d="",beforeContent:f,afterContent:y}=a,C=e(a,l);const h=o((()=>i>0?{display:"grid",gridTemplateColumns:"".concat("1fr ".repeat(i)),width:"100%",height:"unset"}:{display:"flex"}),[i]);return React.createElement(r,t({width:"100%",column:!0,className:s(n.flowLayout,d)},C),f&&React.createElement("span",{className:n.beforeContent,tabIndex:-1},f),React.createElement(r,t({flexWrap:"wrap",gap:"1rem",style:h,width:"100%"},p),c.map((a=>{let{id:o,spanColumn:n,Component:s,layoutProps:l}=a,c=e(a,m);return React.createElement(r,t({key:o},u,l,n?{style:{width:"calc(".concat(Math.round(100*n),"% - ").concat(16*n,"px)")}}:{}),React.createElement(s,c))}))),y&&React.createElement("span",{className:n.afterContent,tabIndex:-1},y))}));c.displayName="FlowLayout";export{c as FlowLayout};
 //# sourceMappingURL=FlowLayout.js.map

package/dist/ui/esm/src/core/ui/components/molecules/layouts/FlowLayout.js.map

@@ -1 +1 @@
-{"version":3,"file":"FlowLayout.js","sources":["../../../../../../../../../src/core/ui/components/molecules/layouts/FlowLayout.tsx"],"sourcesContent":["import { memo, FC, useMemo } from 'react'\n\nimport { LayoutBox } from '../../container'\nimport { classNames } from '../../../../utils'\n\nimport type { FlowLayoutProps, ItemDTOType } from './flowLayout.types'\nimport classes from './flowLayout.module.scss'\n\n\n/**\n * Renders a flexible flow layout that automatically arranges child components based on specified columns and spacing.\n * This component is highly customizable through its props,\n * allowing for dynamic layouts responsive to the content and screen size.\n *\n * Utilizes a grid layout by default, falling back to flex layout\n * if `numColumns` is not greater than 0. Each item's width\n * and placement can be controlled via `spanColumn` on\n * individual items, with additional layout props provided for fine-tuning.\n *\n * @param {FlowLayoutProps} props The properties to configure the FlowLayout.\n * @param {ItemDTOType[]} props.itemDTOs Array of item DTOs defining the\n * components to render and their layout properties.\n * @param {Partial<LayoutBoxProps>} [props.containerProps={}] Optional.\n * Props to be spread onto the container `LayoutBox`, allowing for custom styles and behaviors.\n * @param {Partial<LayoutBoxProps>} [props.defaultItemLayoutProps={}] Optional.\n * Default layout properties applied to each item, unless overridden by item-specific props.\n * @param {number} [props.numColumns=1] Optional.\n *  Defines the number of columns in the grid. Affects item distribution and layout.\n * @param {string} [props.className=''] Optional.\n * Additional CSS class names to apply to the layout container for custom styling.\n * @param {ReactNode} [props.beforeContent] Optional.\n * Content to render before the main items. Useful for titles, descriptions, or custom components.\n * @param {ReactNode} [props.afterContent] Optional.\n Content to render after the main items. Can be used for additional information or actions related to the items.\n * @returns {React.ReactElement} The rendered FlowLayout component.\n */\nexport const FlowLayout: FC<FlowLayoutProps> = memo<FlowLayoutProps>(({\n  itemDTOs,\n  containerProps = {},\n  defaultItemLayoutProps = {},\n  numColumns = 1,\n  className = '',\n  beforeContent,\n  afterContent,\n  ...props\n}: FlowLayoutProps) => {\n  // Calculation for column styles based on the number of columns specified.\n  const columnStyles = useMemo(() => (numColumns > 0\n    ? {\n      display: 'grid',\n      gridTemplateColumns: `${'1fr '.repeat(numColumns)}`,\n      width: '100%',\n      height: 'unset',\n    }\n    : {\n      display: 'flex',\n    }\n  ), [numColumns])\n\n  return (\n    <LayoutBox\n      width='100%'\n      column\n      className={classNames(classes.flowLayout, className)}\n      {...props}\n    >\n      {beforeContent && (\n        <span className={classes.beforeContent} tabIndex={-1}>\n          {beforeContent}\n        </span>\n      )}\n      <LayoutBox\n        flexWrap='wrap'\n        gap='1rem'\n        style={columnStyles}\n        width='100%'\n        {...containerProps}\n      >\n        {itemDTOs.map(({ id, spanColumn, Component, layoutProps, ...props }: ItemDTOType) => (\n          <LayoutBox\n            key={id}\n            {...defaultItemLayoutProps}\n            {...layoutProps}\n            {...(spanColumn\n              ? { style: { width: `calc(${Math.round(spanColumn * 100)}% - ${spanColumn * 16}px)` } }\n              : {})}\n          >\n            <Component {...props} />\n          </LayoutBox>\n        ))}\n      </LayoutBox>\n      {afterContent && (\n        <span className={classes.afterContent} tabIndex={-1}>\n          {afterContent}\n        </span>\n      )}\n    </LayoutBox>\n  )\n})\n\nexport type FlowLayoutType = typeof FlowLayout;\n\n// Set display name for the component.\nFlowLayout.displayName = 'FlowLayout'\n"],"names":["FlowLayout","memo","_ref","itemDTOs","containerProps","defaultItemLayoutProps","numColumns","className","beforeContent","afterContent","props","_objectWithoutProperties","_excluded","columnStyles","useMemo","display","gridTemplateColumns","concat","repeat","width","height","React","createElement","LayoutBox","_extends","column","classNames","classes","flowLayout","tabIndex","flexWrap","gap","style","map","_ref2","id","spanColumn","Component","layoutProps","_excluded2","key","Math","round","displayName"],"mappings":"mgBAoCaA,EAAkCC,EAAIA,MAAkBC,IAS9C,IAT+CC,SACpEA,EAAQC,eACRA,EAAiB,CAAE,EAAAC,uBACnBA,EAAyB,CAAE,EAAAC,WAC3BA,EAAa,EAACC,UACdA,EAAY,GAAEC,cACdA,EAAaC,aACbA,GAEgBP,EADbQ,EAAKC,EAAAT,EAAAU,GAGR,MAAMC,EAAeC,EAAAA,SAAQ,IAAOR,EAAa,EAC7C,CACAS,QAAS,OACTC,oBAAmB,GAAAC,OAAK,OAAOC,OAAOZ,IACtCa,MAAO,OACPC,OAAQ,SAER,CACAL,QAAS,SAEV,CAACT,IAEJ,OACEe,MAAAC,cAACC,EAASC,EAAA,CACRL,MAAM,OACNM,QAAM,EACNlB,UAAWmB,EAAWC,EAAQC,WAAYrB,IACtCG,GAEHF,GACCa,MAAAC,cAAA,OAAA,CAAMf,UAAWoB,EAAQnB,cAAeqB,UAAW,GAChDrB,GAGLa,MAAAC,cAACC,EAASC,EAAA,CACRM,SAAS,OACTC,IAAI,OACJC,MAAOnB,EACPM,MAAM,QACFf,GAEHD,EAAS8B,KAAIC,IAAA,IAACC,GAAEA,EAAEC,WAAEA,EAAUC,UAAEA,EAASC,YAAEA,GAAoCJ,EAApBxB,EAAKC,EAAAuB,EAAAK,GAAA,OAC/DlB,MAAAC,cAACC,EAASC,EAAA,CACRgB,IAAKL,GACD9B,EACAiC,EACCF,EACD,CAAEJ,MAAO,CAAEb,cAAKF,OAAUwB,KAAKC,MAAmB,IAAbN,GAAiBnB,QAAAA,OAAoB,GAAbmB,EAAe,SAC5E,CAAA,GAEJf,MAAAC,cAACe,EAAc3B,GACL,KAGfD,GACCY,MAAAC,cAAA,OAAA,CAAMf,UAAWoB,EAAQlB,aAAcoB,UAAW,GAC/CpB,GAGK,IAOhBT,EAAW2C,YAAc"}
+{"version":3,"file":"FlowLayout.js","sources":["../../../../../../../../../src/core/ui/components/molecules/layouts/FlowLayout.tsx"],"sourcesContent":["import { memo, FC, useMemo } from 'react'\n\nimport { LayoutBox } from '../../container'\nimport { classNames } from '../../../../utils'\n\nimport type { FlowLayoutProps, ItemDTOType } from './flowLayout.types'\nimport classes from './flowLayout.module.scss'\n\n\n/**\n * Renders a flexible flow layout that automatically arranges child components based on specified columns and spacing.\n * This component is highly customizable through its props,\n * allowing for dynamic layouts responsive to the content and screen size.\n *\n * Utilizes a grid layout by default, falling back to flex layout\n * if `numColumns` is not greater than 0. Each item's width\n * and placement can be controlled via `spanColumn` on\n * individual items, with additional layout props provided for fine-tuning.\n *\n * @param {FlowLayoutProps} props The properties to configure the FlowLayout.\n * @param {ItemDTOType[]} props.itemDTOs Array of item DTOs defining the\n * components to render and their layout properties.\n * @param {Partial<LayoutBoxProps>} [props.containerProps={}] Optional.\n * Props to be spread onto the container `LayoutBox`, allowing for custom styles and behaviors.\n * @param {Partial<LayoutBoxProps>} [props.defaultItemLayoutProps={}] Optional.\n * Default layout properties applied to each item, unless overridden by item-specific props.\n * @param {number} [props.numColumns=1] Optional.\n *  Defines the number of columns in the grid. Affects item distribution and layout.\n * @param {string} [props.className=''] Optional.\n * Additional CSS class names to apply to the layout container for custom styling.\n * @param {ReactNode} [props.beforeContent] Optional.\n * Content to render before the main items. Useful for titles, descriptions, or custom components.\n * @param {ReactNode} [props.afterContent] Optional.\n Content to render after the main items. Can be used for additional information or actions related to the items.\n * @returns {React.ReactElement} The rendered FlowLayout component.\n */\nexport const FlowLayout: FC<FlowLayoutProps> = memo<FlowLayoutProps>(({\n  itemDTOs,\n  containerProps = {},\n  defaultItemLayoutProps = {},\n  numColumns = 1,\n  className = '',\n  beforeContent,\n  afterContent,\n  ...props\n}: FlowLayoutProps) => {\n  // Calculation for column styles based on the number of columns specified.\n  const columnStyles = useMemo(() => (numColumns > 0\n    ? {\n      display: 'grid',\n      gridTemplateColumns: `${'1fr '.repeat(numColumns)}`,\n      width: '100%',\n      height: 'unset',\n    }\n    : {\n      display: 'flex',\n    }\n  ), [numColumns])\n\n  return (\n    <LayoutBox\n      width='100%'\n      column\n      className={classNames(classes.flowLayout, className)}\n      {...props}\n    >\n      {beforeContent && (\n        <span className={classes.beforeContent} tabIndex={-1}>\n          {beforeContent}\n        </span>\n      )}\n      <LayoutBox\n        flexWrap='wrap'\n        gap='1rem'\n        style={columnStyles}\n        width='100%'\n        {...containerProps}\n      >\n        {itemDTOs.map(({ id, spanColumn, Component, layoutProps, ...props }: ItemDTOType) => (\n          <LayoutBox\n            key={id}\n            {...defaultItemLayoutProps}\n            {...layoutProps}\n            {...(spanColumn\n              ? { style: { width: `calc(${Math.round(spanColumn * 100)}% - ${spanColumn * 16}px)` } }\n              : {})}\n          >\n            <Component {...props} />\n          </LayoutBox>\n        ))}\n      </LayoutBox>\n      {afterContent && (\n        <span className={classes.afterContent} tabIndex={-1}>\n          {afterContent}\n        </span>\n      )}\n    </LayoutBox>\n  )\n})\n\nexport type FlowLayoutType = typeof FlowLayout;\n\n// Set display name for the component.\nFlowLayout.displayName = 'FlowLayout'\n"],"names":["FlowLayout","memo","_ref","itemDTOs","containerProps","defaultItemLayoutProps","numColumns","className","beforeContent","afterContent","props","_objectWithoutProperties","_excluded","columnStyles","useMemo","display","gridTemplateColumns","concat","repeat","width","height","React","createElement","LayoutBox","_extends","column","classNames","classes","flowLayout","tabIndex","flexWrap","gap","style","map","_ref2","id","spanColumn","Component","layoutProps","_excluded2","key","Math","round","displayName"],"mappings":"2eAoCaA,EAAkCC,GAAsBC,IAS9C,IAT+CC,SACpEA,EAAQC,eACRA,EAAiB,CAAE,EAAAC,uBACnBA,EAAyB,CAAE,EAAAC,WAC3BA,EAAa,EAACC,UACdA,EAAY,GAAEC,cACdA,EAAaC,aACbA,GAEgBP,EADbQ,EAAKC,EAAAT,EAAAU,GAGR,MAAMC,EAAeC,GAAQ,IAAOR,EAAa,EAC7C,CACAS,QAAS,OACTC,oBAAmB,GAAAC,OAAK,OAAOC,OAAOZ,IACtCa,MAAO,OACPC,OAAQ,SAER,CACAL,QAAS,SAEV,CAACT,IAEJ,OACEe,MAAAC,cAACC,EAASC,EAAA,CACRL,MAAM,OACNM,QAAM,EACNlB,UAAWmB,EAAWC,EAAQC,WAAYrB,IACtCG,GAEHF,GACCa,MAAAC,cAAA,OAAA,CAAMf,UAAWoB,EAAQnB,cAAeqB,UAAW,GAChDrB,GAGLa,MAAAC,cAACC,EAASC,EAAA,CACRM,SAAS,OACTC,IAAI,OACJC,MAAOnB,EACPM,MAAM,QACFf,GAEHD,EAAS8B,KAAIC,IAAA,IAACC,GAAEA,EAAEC,WAAEA,EAAUC,UAAEA,EAASC,YAAEA,GAAoCJ,EAApBxB,EAAKC,EAAAuB,EAAAK,GAAA,OAC/DlB,MAAAC,cAACC,EAASC,EAAA,CACRgB,IAAKL,GACD9B,EACAiC,EACCF,EACD,CAAEJ,MAAO,CAAEb,cAAKF,OAAUwB,KAAKC,MAAmB,IAAbN,GAAiBnB,QAAAA,OAAoB,GAAbmB,EAAe,SAC5E,CAAA,GAEJf,MAAAC,cAACe,EAAc3B,GACL,KAGfD,GACCY,MAAAC,cAAA,OAAA,CAAMf,UAAWoB,EAAQlB,aAAcoB,UAAW,GAC/CpB,GAGK,IAOhBT,EAAW2C,YAAc"}

package/dist/ui/esm/src/core/ui/components/molecules/popover/PopoverLite.js

@@ -1,2 +1,2 @@
-import{objectWithoutProperties as e,objectSpread2 as t,extends as n}from"../../../../../../_virtual/_rollupPluginBabelHelpers.js";import"../../../../../../node_modules/core-js/modules/web.dom-collections.iterator.js";import l,{r as o}from"../../../../../../node_modules/react/index.js";import{createPopper as r}from"../../../../../../node_modules/@popperjs/core/lib/popper.js";import{cancelableSetTimeout as i}from"../../../../utils/helpers/cancelableDelayedFunction.js";import{outsideClickHandler as s}from"../../../../hooks/useOutsideClick.js";import{KeyCode as u,EventName as a}from"../../../../constants/ui.constants.js";const d=["children","components","placement","modifiers","data","hoverable","clickable","onOpen","onHide","isOpen","hideOnContentClick","hideOnClickOutside","hideTimeout","isPopup","isModal","modalOverlayClassName","modalContainer","targetRef","hideOnEscape"],c=["ContentComponent"],p={modal:{zIndex:1,position:"fixed",width:"100%",height:"100%",top:"0",left:"0",background:"rgba(0 0 0 / 70%)",pointerEvents:"all",userSelect:"none",visibility:"hidden"}},m=o.memo((m=>{var v,f;let{children:h,components:b,placement:y="bottom",modifiers:C,data:E,hoverable:k,clickable:w,onOpen:g,onHide:O,isOpen:j,hideOnContentClick:M=!1,hideOnClickOutside:R=!0,hideTimeout:L=150,isPopup:x=!1,isModal:H=!1,modalOverlayClassName:P,modalContainer:T,targetRef:_,hideOnEscape:A}=m,N=e(m,d);const[S,W]=o.useState(null),[D,z]=o.useState(null!==(v=null==_?void 0:_.current)&&void 0!==v?v:null);o.useEffect((()=>{null!=_&&_.current&&z(null==_?void 0:_.current)}),[_]);const B=b||{},{ContentComponent:F}=B,I=e(B,c),K=o.useRef(null),q=o.useMemo((()=>{const e=C?{modifiers:C,placement:y}:{placement:y};return e.modifiers=e.modifiers||[],x&&(e.modifiers=[...e.modifiers,{name:"centering",phase:"beforeWrite",enabled:!0,fn:e=>{let{state:n}=e;const l=null==T?void 0:T.getBoundingClientRect(),{width:o,height:r,left:i,top:s}=l||{width:window.innerWidth,height:window.innerHeight,left:0,top:0},u=i+(o-n.elements.popper.clientWidth)/2,a=s+(r-n.elements.popper.clientHeight)/2;return t(t({},n),{},{styles:t(t({},n.styles),{},{popper:t(t({},n.styles.popper),{},{left:"".concat(u,"px"),top:"".concat(a,"px"),transform:"none"})})})}}]),e}),[C,y,x,T]),G=o.useRef();o.useEffect((()=>{var e;let n;return null==K||null===(e=K.current)||void 0===e||e.destroy(),D&&S&&(n=r(D,S,t({},q)),K.current=n),()=>{var e;null===(e=n)||void 0===e||e.destroy(),K.current=null}}),[S,D,q]);const J=o.useRef(),Q=o.useRef(-1),U=o.useCallback((()=>{var e,t;S&&delete S.dataset.show,H&&null!=oe&&oe.current&&(oe.current.style.visibility="hidden",delete oe.current.dataset.show),null==K||null===(e=K.current)||void 0===e||e.update(),null==O||O(),null==J||null===(t=J.current)||void 0===t||t.call(J),clearTimeout(Q.current)}),[S,H,O]),V=o.useCallback((()=>{G.current&&G.current(),G.current=i(U,L)}),[U,L]),X=o.useCallback((()=>{G.current&&G.current()}),[]),Y=o.useCallback((e=>{var t;("true"===(null==S||null===(t=S.dataset)||void 0===t?void 0:t.show)&&R&&(null==S||!S.contains(e))||null!=S&&S.contains(e)&&M)&&U()}),[U,S,M,R]),Z=o.useCallback((()=>{var e,t;S&&(S.dataset.show="true"),null==K||null===(e=K.current)||void 0===e||e.update(),H&&null!=oe&&oe.current&&(oe.current.style.visibility="visible",oe.current.dataset.show="true"),null==g||g(),null==J||null===(t=J.current)||void 0===t||t.call(J),clearTimeout(Q.current),Q.current=setTimeout((()=>{J.current=s(D,Y)}),250)}),[S,Y,H,g,D]),$=o.useCallback((()=>{var e;"true"===(null==S||null===(e=S.dataset)||void 0===e?void 0:e.show)?U():Z()}),[S,U,Z]),ee=o.useCallback((e=>{A&&e.keyCode===u.Escape&&U()}),[A,U]);o.useEffect((()=>{var e,t;const n=null==D||null===(e=D.addEventListener)||void 0===e?void 0:e.bind(D),l=null==S||null===(t=S.addEventListener)||void 0===t?void 0:t.bind(S);return l&&n&&(k&&(n(a.MouseEnter,Z),l(a.MouseEnter,X),n(a.MouseLeave,V),l(a.MouseLeave,U)),w&&n(a.Click,$)),A&&document.addEventListener(a.KeyDown,ee),()=>{var e,t;const n=null==D||null===(e=D.removeEventListener)||void 0===e?void 0:e.bind(D),l=null==S||null===(t=S.removeEventListener)||void 0===t?void 0:t.bind(S);document.removeEventListener(a.KeyDown,ee),G.current&&G.current(),n&&(n(a.Click,$),n(a.MouseEnter,Z),n(a.MouseLeave,V)),l&&(l(a.MouseLeave,U),l(a.MouseEnter,X))}}),[D,S,w,k,Z,U,$,V,X,A,ee]),o.useEffect((()=>(!0===j&&Z(),!1===j&&U(),null==J?void 0:J.current)),[U,j,Z]);const te="function"==typeof h,ne="function"!=typeof h&&!Array.isArray(h),le="function"!=typeof h&&Array.isArray(h)&&2===h.filter((e=>!!e)).length,oe=o.useRef(null);return o.useEffect((()=>{H&&S&&(S.style.zIndex="2")}),[S,H]),l.createElement(l.Fragment,null,H&&l.createElement("span",{ref:oe,style:p.modal,className:P}),!_&&te&&(null==h?void 0:h({forwardedRef:z,data:E})),!_&&ne&&l.createElement("span",{ref:z},h),!le&&F&&l.createElement(F,n({placement:y,forwardedRef:W,ref:"function"!=typeof F?W:null,data:E,hide:U,components:I},N)),!_&&le&&l.createElement("span",{ref:z},h[0]),le&&(null==h?void 0:h[1])&&"object"==typeof(null==h?void 0:h[1])&&l.cloneElement(h[1],t(t({},null==h||null===(f=h[1])||void 0===f?void 0:f.props),{},{placement:y,forwardedRef:W,ref:W,data:E,hide:U,components:I},N)))}));m.displayName="Popover";export{m as Popover};
+import{objectWithoutProperties as e,objectSpread2 as n,extends as t}from"../../../../../../_virtual/_rollupPluginBabelHelpers.js";import"../../../../../../node_modules/core-js/modules/web.dom-collections.iterator.js";import l,{memo as o,useState as r,useEffect as i,useRef as s,useMemo as u,useCallback as d}from"react";import{createPopper as a}from"../../../../../../node_modules/@popperjs/core/lib/popper.js";import{cancelableSetTimeout as c}from"../../../../utils/helpers/cancelableDelayedFunction.js";import{outsideClickHandler as p}from"../../../../hooks/useOutsideClick.js";import{KeyCode as m,EventName as v}from"../../../../constants/ui.constants.js";const f=["children","components","placement","modifiers","data","hoverable","clickable","onOpen","onHide","isOpen","hideOnContentClick","hideOnClickOutside","hideTimeout","isPopup","isModal","modalOverlayClassName","modalContainer","targetRef","hideOnEscape"],h=["ContentComponent"],y={modal:{zIndex:1,position:"fixed",width:"100%",height:"100%",top:"0",left:"0",background:"rgba(0 0 0 / 70%)",pointerEvents:"all",userSelect:"none",visibility:"hidden"}},b=o((o=>{var b,E;let{children:w,components:C,placement:g="bottom",modifiers:O,data:k,hoverable:j,clickable:L,onOpen:M,onHide:x,isOpen:R,hideOnContentClick:H=!1,hideOnClickOutside:P=!0,hideTimeout:T=150,isPopup:A=!1,isModal:N=!1,modalOverlayClassName:W,modalContainer:_,targetRef:D,hideOnEscape:z}=o,B=e(o,f);const[F,I]=r(null),[K,S]=r(null!==(b=null==D?void 0:D.current)&&void 0!==b?b:null);i((()=>{null!=D&&D.current&&S(null==D?void 0:D.current)}),[D]);const q=C||{},{ContentComponent:G}=q,J=e(q,h),Q=s(null),U=u((()=>{const e=O?{modifiers:O,placement:g}:{placement:g};return e.modifiers=e.modifiers||[],A&&(e.modifiers=[...e.modifiers,{name:"centering",phase:"beforeWrite",enabled:!0,fn:e=>{let{state:t}=e;const l=null==_?void 0:_.getBoundingClientRect(),{width:o,height:r,left:i,top:s}=l||{width:window.innerWidth,height:window.innerHeight,left:0,top:0},u=i+(o-t.elements.popper.clientWidth)/2,d=s+(r-t.elements.popper.clientHeight)/2;return n(n({},t),{},{styles:n(n({},t.styles),{},{popper:n(n({},t.styles.popper),{},{left:"".concat(u,"px"),top:"".concat(d,"px"),transform:"none"})})})}}]),e}),[O,g,A,_]),V=s();i((()=>{var e;let t;return null==Q||null===(e=Q.current)||void 0===e||e.destroy(),K&&F&&(t=a(K,F,n({},U)),Q.current=t),()=>{var e;null===(e=t)||void 0===e||e.destroy(),Q.current=null}}),[F,K,U]);const X=s(),Y=s(-1),Z=d((()=>{var e,n;F&&delete F.dataset.show,N&&null!=ue&&ue.current&&(ue.current.style.visibility="hidden",delete ue.current.dataset.show),null==Q||null===(e=Q.current)||void 0===e||e.update(),null==x||x(),null==X||null===(n=X.current)||void 0===n||n.call(X),clearTimeout(Y.current)}),[F,N,x]),$=d((()=>{V.current&&V.current(),V.current=c(Z,T)}),[Z,T]),ee=d((()=>{V.current&&V.current()}),[]),ne=d((e=>{var n;("true"===(null==F||null===(n=F.dataset)||void 0===n?void 0:n.show)&&P&&(null==F||!F.contains(e))||null!=F&&F.contains(e)&&H)&&Z()}),[Z,F,H,P]),te=d((()=>{var e,n;F&&(F.dataset.show="true"),null==Q||null===(e=Q.current)||void 0===e||e.update(),N&&null!=ue&&ue.current&&(ue.current.style.visibility="visible",ue.current.dataset.show="true"),null==M||M(),null==X||null===(n=X.current)||void 0===n||n.call(X),clearTimeout(Y.current),Y.current=setTimeout((()=>{X.current=p(K,ne)}),250)}),[F,ne,N,M,K]),le=d((()=>{var e;"true"===(null==F||null===(e=F.dataset)||void 0===e?void 0:e.show)?Z():te()}),[F,Z,te]),oe=d((e=>{z&&e.keyCode===m.Escape&&Z()}),[z,Z]);i((()=>{var e,n;const t=null==K||null===(e=K.addEventListener)||void 0===e?void 0:e.bind(K),l=null==F||null===(n=F.addEventListener)||void 0===n?void 0:n.bind(F);return l&&t&&(j&&(t(v.MouseEnter,te),l(v.MouseEnter,ee),t(v.MouseLeave,$),l(v.MouseLeave,Z)),L&&t(v.Click,le)),z&&document.addEventListener(v.KeyDown,oe),()=>{var e,n;const t=null==K||null===(e=K.removeEventListener)||void 0===e?void 0:e.bind(K),l=null==F||null===(n=F.removeEventListener)||void 0===n?void 0:n.bind(F);document.removeEventListener(v.KeyDown,oe),V.current&&V.current(),t&&(t(v.Click,le),t(v.MouseEnter,te),t(v.MouseLeave,$)),l&&(l(v.MouseLeave,Z),l(v.MouseEnter,ee))}}),[K,F,L,j,te,Z,le,$,ee,z,oe]),i((()=>(!0===R&&te(),!1===R&&Z(),null==X?void 0:X.current)),[Z,R,te]);const re="function"==typeof w,ie="function"!=typeof w&&!Array.isArray(w),se="function"!=typeof w&&Array.isArray(w)&&2===w.filter((e=>!!e)).length,ue=s(null);return i((()=>{N&&F&&(F.style.zIndex="2")}),[F,N]),l.createElement(l.Fragment,null,N&&l.createElement("span",{ref:ue,style:y.modal,className:W}),!D&&re&&(null==w?void 0:w({forwardedRef:S,data:k})),!D&&ie&&l.createElement("span",{ref:S},w),!se&&G&&l.createElement(G,t({placement:g,forwardedRef:I,ref:"function"!=typeof G?I:null,data:k,hide:Z,components:J},B)),!D&&se&&l.createElement("span",{ref:S},w[0]),se&&(null==w?void 0:w[1])&&"object"==typeof(null==w?void 0:w[1])&&l.cloneElement(w[1],n(n({},null==w||null===(E=w[1])||void 0===E?void 0:E.props),{},{placement:g,forwardedRef:I,ref:I,data:k,hide:Z,components:J},B)))}));b.displayName="Popover";export{b as Popover};
 //# sourceMappingURL=PopoverLite.js.map

package/dist/ui/esm/src/core/ui/components/molecules/popover/PopoverLite.js.map

@@ -1 +1 @@
-{"version":3,"file":"PopoverLite.js","sources":["../../../../../../../../../src/core/ui/components/molecules/popover/PopoverLite.tsx"],"sourcesContent":["\nimport React, { FC, memo, useRef, useEffect, useState, useCallback, useMemo,\n  CSSProperties, ReactNode, ReactElement } from 'react'\nimport { createPopper, Instance, ModifierArguments } from '@popperjs/core'\n\nimport { EventName, KeyCode } from '../../../../constants'\nimport { cancelableSetTimeout } from '../../../../utils'\nimport { outsideClickHandler } from '../../../../hooks'\n\nimport { PopoverProps } from './popover.types'\n\n\nconst styles: Record<string, Partial<CSSProperties>> = {\n  modal: {\n    zIndex: 1,\n    position: 'fixed',\n    width: '100%',\n    height: '100%',\n    top: '0',\n    left: '0',\n    background: 'rgba(0 0 0 / 70%)',\n    pointerEvents: 'all',\n    userSelect: 'none',\n    visibility: 'hidden',\n  },\n}\n\nexport const Popover: FC<PopoverProps> = memo<PopoverProps>(\n  ({\n    children,\n    components,\n    placement = 'bottom',\n    modifiers,\n    data,\n    hoverable,\n    clickable,\n    onOpen,\n    onHide,\n    isOpen,\n    hideOnContentClick = false,\n    hideOnClickOutside = true,\n    hideTimeout = 150,\n    isPopup = false,\n    isModal = false,\n    modalOverlayClassName,\n    modalContainer,\n    targetRef,\n    hideOnEscape,\n    ...props\n  }: PopoverProps) => {\n    const [content, setContent] = useState<HTMLElement | null>(null)\n    const [target, setTarget] = useState<HTMLElement | null>(targetRef?.current ?? null)\n\n    useEffect(() => {\n      if (targetRef?.current) {\n        setTarget(targetRef?.current)\n      }\n    }, [targetRef])\n\n    const { ContentComponent, ...contentComponents } = components || {}\n\n    const popperInstanceRef = useRef<Instance | null>(null)\n\n    const options = useMemo(() => {\n      const options = (modifiers ? { modifiers, placement } : { placement })\n\n      options.modifiers = options.modifiers || []\n\n      if (isPopup) {\n        options.modifiers = [\n          ...options.modifiers,\n          {\n            name: 'centering',\n            phase: 'beforeWrite',\n            enabled: true,\n            // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n            // @ts-ignore\n            fn: ({ state }): Partial<ModifierArguments> => {\n              const mcBoundRect = modalContainer?.getBoundingClientRect()\n\n              const { width, height, left, top } = mcBoundRect || {\n                width: window.innerWidth,\n                height: window.innerHeight,\n                left: 0,\n                top: 0,\n              }\n\n              const xpos = left + (width - state.elements.popper.clientWidth) / 2\n              const ypos = top + (height - state.elements.popper.clientHeight) / 2\n\n              return {\n                ...state,\n                styles: {\n                  ...state.styles,\n                  popper: {\n                    ...state.styles.popper,\n                    left: `${xpos}px`,\n                    top: `${ypos}px`,\n                    transform: 'none',\n                  },\n                },\n              }\n            },\n          },\n        ] as PopoverProps['modifiers']\n      }\n\n      return options\n    }, [modifiers, placement, isPopup, modalContainer])\n\n    // to save cancelable setTimout\n    const pendingHideRef = useRef<(() => void)>()\n\n    useEffect(() => {\n      popperInstanceRef?.current?.destroy()\n      let popperInstance: ReturnType<typeof createPopper>\n\n      if (target && content) {\n        popperInstance = createPopper(target, content, { ...options })\n\n        popperInstanceRef.current = popperInstance\n      }\n\n      return (): void => {\n        popperInstance?.destroy()\n        popperInstanceRef.current = null\n      }\n    }, [content, target, options])\n\n\n    const outsideClickUnsubscriber = useRef<() => void | null>()\n    const outsideClickUnsubscriberTimeout = useRef<any>(-1)\n\n    const hide = useCallback(() => {\n      if (content) {\n        delete content.dataset.show\n      }\n\n      if (isModal && modalRef?.current) {\n        modalRef.current.style.visibility = 'hidden'\n        delete modalRef.current.dataset.show\n      }\n\n      popperInstanceRef?.current?.update()\n      onHide?.()\n      outsideClickUnsubscriber?.current?.()\n      clearTimeout(outsideClickUnsubscriberTimeout.current)\n    }, [content, isModal, onHide])\n\n\n    const delayedHide = useCallback(() => {\n      pendingHideRef.current && pendingHideRef.current()\n      pendingHideRef.current = cancelableSetTimeout(hide, hideTimeout)\n    }, [hide, hideTimeout])\n\n    const cancelDelayedHide = useCallback(() => {\n      pendingHideRef.current && pendingHideRef.current()\n    }, [])\n\n    const handleOutsideClick = useCallback((eventTarget: HTMLElement | null) => {\n      if ((content?.dataset?.show === 'true' && hideOnClickOutside && !content?.contains(eventTarget))\n        || (content?.contains(eventTarget) && hideOnContentClick)) {\n        hide()\n      }\n    }, [hide, content, hideOnContentClick, hideOnClickOutside])\n\n    const open = useCallback(() => {\n      if (content) {\n        content.dataset.show = 'true'\n      }\n\n      popperInstanceRef?.current?.update()\n\n      if (isModal && modalRef?.current) {\n        modalRef.current.style.visibility = 'visible'\n        modalRef.current.dataset.show = 'true'\n      }\n\n      onOpen?.()\n\n      outsideClickUnsubscriber?.current?.()\n      clearTimeout(outsideClickUnsubscriberTimeout.current)\n      outsideClickUnsubscriberTimeout.current = setTimeout(() => {\n        outsideClickUnsubscriber.current = outsideClickHandler(target, handleOutsideClick)\n      }, 250)\n    }, [content, handleOutsideClick, isModal, onOpen, target])\n\n    const toggleOpen = useCallback(() => {\n      content?.dataset?.show === 'true' ? hide() : open()\n    }, [content, hide, open])\n\n    const keydownHandler = useCallback((event: Event) => {\n      if (hideOnEscape && (event as unknown as KeyboardEvent).keyCode === KeyCode.Escape) {\n        hide()\n      }\n    }, [hideOnEscape, hide])\n\n    useEffect(() => {\n      if (!hoverable && !clickable) {\n        console.error('Popover component should have at least one of props [\"hoverable\", \"clickable\"]')\n      }\n\n      const targetAddListener = target?.addEventListener?.bind(target)\n      const contentAddListener = content?.addEventListener?.bind(content)\n\n      if (contentAddListener && targetAddListener) {\n        if (hoverable) {\n          targetAddListener(EventName.MouseEnter, open)\n          contentAddListener(EventName.MouseEnter, cancelDelayedHide)\n          targetAddListener(EventName.MouseLeave, delayedHide)\n          contentAddListener(EventName.MouseLeave, hide)\n        }\n\n        if (clickable) {\n          targetAddListener(EventName.Click, toggleOpen)\n        }\n      }\n\n      if (hideOnEscape) {\n        document.addEventListener(EventName.KeyDown, keydownHandler)\n      }\n\n      return (): void => {\n        const targetRemoveListener = target?.removeEventListener?.bind(target)\n        const contentRemoveListener = content?.removeEventListener?.bind(content)\n\n        document.removeEventListener(EventName.KeyDown, keydownHandler)\n\n        pendingHideRef.current && pendingHideRef.current()\n\n        if (targetRemoveListener) {\n          targetRemoveListener(EventName.Click, toggleOpen)\n          targetRemoveListener(EventName.MouseEnter, open)\n          targetRemoveListener(EventName.MouseLeave, delayedHide)\n        }\n        if (contentRemoveListener) {\n          contentRemoveListener(EventName.MouseLeave, hide)\n          contentRemoveListener(EventName.MouseEnter, cancelDelayedHide)\n        }\n      }\n    }, [target, content, clickable, hoverable,\n      open, hide, toggleOpen, delayedHide, cancelDelayedHide, hideOnEscape, keydownHandler])\n\n    // open, hide based on external isOpen\n    useEffect(() => {\n      if (isOpen === true) {\n        open()\n      }\n      if (isOpen === false) {\n        hide()\n      }\n      return outsideClickUnsubscriber?.current as () => void\n    }, [hide, isOpen, open])\n\n    const childrenIsFunction = typeof children === 'function'\n    const childrenIsElement = typeof children !== 'function' && !Array.isArray(children)\n    const childrenAreElements = typeof children !== 'function' && Array.isArray(children)\n      && children.filter((child: ReactNode) => !!child).length === 2\n\n    // modal\n    const modalRef = useRef<HTMLDivElement | null>(null)\n\n    useEffect(() => {\n      if (isModal && content) {\n        content.style.zIndex = '2'\n      }\n    }, [content, isModal])\n\n    return (\n      <>\n        {isModal && <span ref={modalRef} style={styles.modal} className={modalOverlayClassName} />}\n        {(!targetRef && childrenIsFunction) && children?.({ forwardedRef: setTarget, data })}\n        {(!targetRef && childrenIsElement) && <span ref={setTarget}>{children}</span>}\n        {!childrenAreElements && ContentComponent && (\n        <ContentComponent\n          // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n          // @ts-ignore\n          placement={placement}\n          forwardedRef={setContent}\n          ref={typeof ContentComponent !== 'function' ? setContent : null}\n          data={data}\n          hide={hide}\n          components={contentComponents as { [key: string]: FC | React.Component<any> }}\n          {...props}\n        />\n        )}\n        {(!targetRef && childrenAreElements) && <span ref={setTarget}>{children[0]}</span>}\n        {(childrenAreElements && children?.[1] && typeof children?.[1] === 'object')\n        && React.cloneElement(children[1] as ReactElement, {\n          ...((children?.[1] as ReactElement)?.props),\n          placement,\n          forwardedRef: setContent,\n          // ...(typeof children[1] !== 'function' ? { ref: setContent } : {}),\n          ref: setContent,\n          data,\n          hide,\n          components: contentComponents as { [key: string]: FC | React.Component<any> },\n          ...props,\n        })}\n      </>\n    )\n  },\n)\n\nPopover.displayName = 'Popover'\n"],"names":["styles","modal","zIndex","position","width","height","top","left","background","pointerEvents","userSelect","visibility","Popover","memo","_ref","_targetRef$current","_children$","children","components","placement","modifiers","data","hoverable","clickable","onOpen","onHide","isOpen","hideOnContentClick","hideOnClickOutside","hideTimeout","isPopup","isModal","modalOverlayClassName","modalContainer","targetRef","hideOnEscape","props","_objectWithoutProperties","_excluded","content","setContent","useState","target","setTarget","current","useEffect","_ref2","ContentComponent","contentComponents","_excluded2","popperInstanceRef","useRef","options","useMemo","name","phase","enabled","fn","_ref3","state","mcBoundRect","getBoundingClientRect","window","innerWidth","innerHeight","xpos","elements","popper","clientWidth","ypos","clientHeight","_objectSpread","concat","transform","pendingHideRef","_popperInstanceRef$cu","popperInstance","destroy","createPopper","_popperInstance","outsideClickUnsubscriber","outsideClickUnsubscriberTimeout","hide","useCallback","_popperInstanceRef$cu2","_outsideClickUnsubscr","dataset","show","modalRef","style","update","call","clearTimeout","delayedHide","cancelableSetTimeout","cancelDelayedHide","handleOutsideClick","eventTarget","_content$dataset","contains","open","_popperInstanceRef$cu3","_outsideClickUnsubscr2","setTimeout","outsideClickHandler","toggleOpen","_content$dataset2","keydownHandler","event","keyCode","KeyCode","Escape","_target$addEventListe","_content$addEventList","targetAddListener","addEventListener","bind","contentAddListener","EventName","MouseEnter","MouseLeave","Click","document","KeyDown","_target$removeEventLi","_content$removeEventL","targetRemoveListener","removeEventListener","contentRemoveListener","childrenIsFunction","childrenIsElement","Array","isArray","childrenAreElements","filter","child","length","React","createElement","Fragment","ref","className","forwardedRef","_extends","cloneElement","displayName"],"mappings":"44BAYMA,EAAiD,CACrDC,MAAO,CACLC,OAAQ,EACRC,SAAU,QACVC,MAAO,OACPC,OAAQ,OACRC,IAAK,IACLC,KAAM,IACNC,WAAY,oBACZC,cAAe,MACfC,WAAY,OACZC,WAAY,WAIHC,EAA4BC,EAAIA,MAC3CC,IAqBoB,IAAAC,EAAAC,EAAA,IArBnBC,SACCA,EAAQC,WACRA,EAAUC,UACVA,EAAY,SAAQC,UACpBA,EAASC,KACTA,EAAIC,UACJA,EAASC,UACTA,EAASC,OACTA,EAAMC,OACNA,EAAMC,OACNA,EAAMC,mBACNA,GAAqB,EAAKC,mBAC1BA,GAAqB,EAAIC,YACzBA,EAAc,IAAGC,QACjBA,GAAU,EAAKC,QACfA,GAAU,EAAKC,sBACfA,EAAqBC,eACrBA,EAAcC,UACdA,EAASC,aACTA,GAEarB,EADVsB,EAAKC,EAAAvB,EAAAwB,GAER,MAAOC,EAASC,GAAcC,EAAAA,SAA6B,OACpDC,EAAQC,GAAaF,EAAAA,SAA+C,QAAvC1B,EAAqBmB,aAAS,EAATA,EAAWU,eAAO7B,IAAAA,EAAAA,EAAI,MAE/E8B,EAAAA,WAAU,KACJX,SAAAA,EAAWU,SACbD,EAAUT,eAAAA,EAAWU,QACvB,GACC,CAACV,IAEJ,MAAAY,EAAmD5B,GAAc,CAAE,GAA7D6B,iBAAEA,GAAwCD,EAAnBE,EAAiBX,EAAAS,EAAAG,GAExCC,EAAoBC,EAAMA,OAAkB,MAE5CC,EAAUC,EAAAA,SAAQ,KACtB,MAAMD,EAAWhC,EAAY,CAAEA,YAAWD,aAAc,CAAEA,aA2C1D,OAzCAiC,EAAQhC,UAAYgC,EAAQhC,WAAa,GAErCU,IACFsB,EAAQhC,UAAY,IACfgC,EAAQhC,UACX,CACEkC,KAAM,YACNC,MAAO,cACPC,SAAS,EAGTC,GAAIC,IAA2C,IAA1CC,MAAEA,GAAOD,EACZ,MAAME,EAAc3B,eAAAA,EAAgB4B,yBAE9BzD,MAAEA,EAAKC,OAAEA,EAAME,KAAEA,EAAID,IAAEA,GAAQsD,GAAe,CAClDxD,MAAO0D,OAAOC,WACd1D,OAAQyD,OAAOE,YACfzD,KAAM,EACND,IAAK,GAGD2D,EAAO1D,GAAQH,EAAQuD,EAAMO,SAASC,OAAOC,aAAe,EAC5DC,EAAO/D,GAAOD,EAASsD,EAAMO,SAASC,OAAOG,cAAgB,EAEnE,OAAAC,EAAAA,EAAA,CAAA,EACKZ,GAAK,CAAA,EAAA,CACR3D,OAAMuE,EAAAA,EACDZ,CAAAA,EAAAA,EAAM3D,QAAM,GAAA,CACfmE,OAAMI,EAAAA,KACDZ,EAAM3D,OAAOmE,QAAM,GAAA,CACtB5D,KAAIiE,GAAAA,OAAKP,EAAQ,MACjB3D,IAAGkE,GAAAA,OAAKH,EAAQ,MAChBI,UAAW,YAEd,KAOJrB,CAAO,GACb,CAAChC,EAAWD,EAAWW,EAASG,IAG7ByC,EAAiBvB,EAAAA,SAEvBN,EAAAA,WAAU,KAAM,IAAA8B,EAEd,IAAIC,EAQJ,OATA1B,SAA0B,QAATyB,EAAjBzB,EAAmBN,eAAnB+B,IAA0BA,GAA1BA,EAA4BE,UAGxBnC,GAAUH,IACZqC,EAAiBE,EAAapC,EAAQH,EAAOgC,EAAA,CAAA,EAAOnB,IAEpDF,EAAkBN,QAAUgC,GAGvB,KAAY,IAAAG,EACHA,QAAdA,EAAAH,aAAcG,GAAdA,EAAgBF,UAChB3B,EAAkBN,QAAU,IAAI,CACjC,GACA,CAACL,EAASG,EAAQU,IAGrB,MAAM4B,EAA2B7B,EAAAA,SAC3B8B,EAAkC9B,UAAa,GAE/C+B,EAAOC,EAAAA,aAAY,KAAM,IAAAC,EAAAC,EACzB9C,UACKA,EAAQ+C,QAAQC,KAGrBxD,SAAWyD,IAAAA,GAAU5C,UACvB4C,GAAS5C,QAAQ6C,MAAM9E,WAAa,gBAC7B6E,GAAS5C,QAAQ0C,QAAQC,MAGlCrC,SAA0B,QAATkC,EAAjBlC,EAAmBN,eAAnBwC,IAA0BA,GAA1BA,EAA4BM,SAC5BjE,SAAAA,IACAuD,SAAiCK,QAATA,EAAxBL,EAA0BpC,mBAAOyC,GAAjCA,EAAAM,KAAAX,GACAY,aAAaX,EAAgCrC,QAAQ,GACpD,CAACL,EAASR,EAASN,IAGhBoE,EAAcV,EAAAA,aAAY,KAC9BT,EAAe9B,SAAW8B,EAAe9B,UACzC8B,EAAe9B,QAAUkD,EAAqBZ,EAAMrD,EAAY,GAC/D,CAACqD,EAAMrD,IAEJkE,EAAoBZ,EAAAA,aAAY,KACpCT,EAAe9B,SAAW8B,EAAe9B,SAAS,GACjD,IAEGoD,EAAqBb,EAAWA,aAAEc,IAAoC,IAAAC,GAC1C,UAA3B3D,iBAAO2D,EAAP3D,EAAS+C,eAAO,IAAAY,OAAA,EAAhBA,EAAkBX,OAAmB3D,IAAuBW,UAAAA,EAAS4D,SAASF,KAC7E1D,SAAAA,EAAS4D,SAASF,IAAgBtE,IACtCuD,GACF,GACC,CAACA,EAAM3C,EAASZ,EAAoBC,IAEjCwE,EAAOjB,EAAAA,aAAY,KAAM,IAAAkB,EAAAC,EACzB/D,IACFA,EAAQ+C,QAAQC,KAAO,QAGzBrC,SAA0B,QAATmD,EAAjBnD,EAAmBN,eAAnByD,IAA0BA,GAA1BA,EAA4BX,SAExB3D,SAAWyD,IAAAA,GAAU5C,UACvB4C,GAAS5C,QAAQ6C,MAAM9E,WAAa,UACpC6E,GAAS5C,QAAQ0C,QAAQC,KAAO,QAGlC/D,SAAAA,IAEAwD,SAAiCsB,QAATA,EAAxBtB,EAA0BpC,mBAAO0D,GAAjCA,EAAAX,KAAAX,GACAY,aAAaX,EAAgCrC,SAC7CqC,EAAgCrC,QAAU2D,YAAW,KACnDvB,EAAyBpC,QAAU4D,EAAoB9D,EAAQsD,EAAmB,GACjF,IAAI,GACN,CAACzD,EAASyD,EAAoBjE,EAASP,EAAQkB,IAE5C+D,EAAatB,EAAAA,aAAY,KAAM,IAAAuB,EACR,UAA3BnE,SAAgB,QAATmE,EAAPnE,EAAS+C,eAAO,IAAAoB,OAAA,EAAhBA,EAAkBnB,MAAkBL,IAASkB,GAAM,GAClD,CAAC7D,EAAS2C,EAAMkB,IAEbO,GAAiBxB,EAAWA,aAAEyB,IAC9BzE,GAAiByE,EAAmCC,UAAYC,EAAQC,QAC1E7B,GACF,GACC,CAAC/C,EAAc+C,IAElBrC,EAAAA,WAAU,KAAM,IAAAmE,EAAAC,EAKd,MAAMC,EAAoBxE,SAAwB,QAAlBsE,EAANtE,EAAQyE,wBAARH,IAAwBA,OAAxBA,EAAAA,EAA0BI,KAAK1E,GACnD2E,EAAqB9E,SAAyB,QAAlB0E,EAAP1E,EAAS4E,wBAATF,IAAyBA,OAAzBA,EAAAA,EAA2BG,KAAK7E,GAmB3D,OAjBI8E,GAAsBH,IACpB5F,IACF4F,EAAkBI,EAAUC,WAAYnB,GACxCiB,EAAmBC,EAAUC,WAAYxB,GACzCmB,EAAkBI,EAAUE,WAAY3B,GACxCwB,EAAmBC,EAAUE,WAAYtC,IAGvC3D,GACF2F,EAAkBI,EAAUG,MAAOhB,IAInCtE,GACFuF,SAASP,iBAAiBG,EAAUK,QAAShB,IAGxC,KAAY,IAAAiB,EAAAC,EACjB,MAAMC,EAAuBpF,SAA2B,QAArBkF,EAANlF,EAAQqF,2BAARH,IAA2BA,OAA3BA,EAAAA,EAA6BR,KAAK1E,GACzDsF,EAAwBzF,SAA4B,QAArBsF,EAAPtF,EAASwF,2BAATF,IAA4BA,OAA5BA,EAAAA,EAA8BT,KAAK7E,GAEjEmF,SAASK,oBAAoBT,EAAUK,QAAShB,IAEhDjC,EAAe9B,SAAW8B,EAAe9B,UAErCkF,IACFA,EAAqBR,EAAUG,MAAOhB,GACtCqB,EAAqBR,EAAUC,WAAYnB,GAC3C0B,EAAqBR,EAAUE,WAAY3B,IAEzCmC,IACFA,EAAsBV,EAAUE,WAAYtC,GAC5C8C,EAAsBV,EAAUC,WAAYxB,GAC9C,CACD,GACA,CAACrD,EAAQH,EAAShB,EAAWD,EAC9B8E,EAAMlB,EAAMuB,EAAYZ,EAAaE,EAAmB5D,EAAcwE,KAGxE9D,EAAAA,WAAU,MACO,IAAXnB,GACF0E,KAEa,IAAX1E,GACFwD,IAEKF,aAAAA,EAAAA,EAA0BpC,UAChC,CAACsC,EAAMxD,EAAQ0E,IAElB,MAAM6B,GAAyC,mBAAbhH,EAC5BiH,GAAwC,mBAAbjH,IAA4BkH,MAAMC,QAAQnH,GACrEoH,GAA0C,mBAAbpH,GAA2BkH,MAAMC,QAAQnH,IACb,IAA1DA,EAASqH,QAAQC,KAAuBA,IAAOC,OAG9ChD,GAAWrC,EAAMA,OAAwB,MAQ/C,OANAN,EAAAA,WAAU,KACJd,GAAWQ,IACbA,EAAQkD,MAAMvF,OAAS,IACzB,GACC,CAACqC,EAASR,IAGX0G,EAAAC,cAAAD,EAAAE,SAAA,KACG5G,GAAW0G,EAAAC,cAAA,OAAA,CAAME,IAAKpD,GAAUC,MAAOzF,EAAOC,MAAO4I,UAAW7G,KAC9DE,GAAa+F,KAAuBhH,aAAAA,EAAAA,EAAW,CAAE6H,aAAcnG,EAAWtB,WAC1Ea,GAAagG,IAAsBO,EAAAC,cAAA,OAAA,CAAME,IAAKjG,GAAY1B,IAC3DoH,IAAuBtF,GACzB0F,EAAAC,cAAC3F,EAECgG,EAAA,CACA5H,UAAWA,EACX2H,aAActG,EACdoG,IAAiC,mBAArB7F,EAAkCP,EAAa,KAC3DnB,KAAMA,EACN6D,KAAMA,EACNhE,WAAY8B,GACRZ,KAGHF,GAAamG,IAAwBI,EAAAC,cAAA,OAAA,CAAME,IAAKjG,GAAY1B,EAAS,IACtEoH,KAAuBpH,aAAAA,EAAAA,EAAW,KAA+B,iBAAlBA,aAAQ,EAARA,EAAW,KACzDwH,EAAMO,aAAa/H,EAAS,GAAEsD,EAAAA,EAC1BtD,CAAAA,EAAAA,SAAa,QAALD,EAARC,EAAW,UAAE,IAAAD,OAAA,EAAdA,EAAiCoB,OAAK,CAAA,EAAA,CAC1CjB,YACA2H,aAActG,EAEdoG,IAAKpG,EACLnB,OACA6D,OACAhE,WAAY8B,GACTZ,IAEJ,IAKTxB,EAAQqI,YAAc"}
+{"version":3,"file":"PopoverLite.js","sources":["../../../../../../../../../src/core/ui/components/molecules/popover/PopoverLite.tsx"],"sourcesContent":["\nimport React, { FC, memo, useRef, useEffect, useState, useCallback, useMemo,\n  CSSProperties, ReactNode, ReactElement } from 'react'\nimport { createPopper, Instance, ModifierArguments } from '@popperjs/core'\n\nimport { EventName, KeyCode } from '../../../../constants'\nimport { cancelableSetTimeout } from '../../../../utils'\nimport { outsideClickHandler } from '../../../../hooks'\n\nimport { PopoverProps } from './popover.types'\n\n\nconst styles: Record<string, Partial<CSSProperties>> = {\n  modal: {\n    zIndex: 1,\n    position: 'fixed',\n    width: '100%',\n    height: '100%',\n    top: '0',\n    left: '0',\n    background: 'rgba(0 0 0 / 70%)',\n    pointerEvents: 'all',\n    userSelect: 'none',\n    visibility: 'hidden',\n  },\n}\n\nexport const Popover: FC<PopoverProps> = memo<PopoverProps>(\n  ({\n    children,\n    components,\n    placement = 'bottom',\n    modifiers,\n    data,\n    hoverable,\n    clickable,\n    onOpen,\n    onHide,\n    isOpen,\n    hideOnContentClick = false,\n    hideOnClickOutside = true,\n    hideTimeout = 150,\n    isPopup = false,\n    isModal = false,\n    modalOverlayClassName,\n    modalContainer,\n    targetRef,\n    hideOnEscape,\n    ...props\n  }: PopoverProps) => {\n    const [content, setContent] = useState<HTMLElement | null>(null)\n    const [target, setTarget] = useState<HTMLElement | null>(targetRef?.current ?? null)\n\n    useEffect(() => {\n      if (targetRef?.current) {\n        setTarget(targetRef?.current)\n      }\n    }, [targetRef])\n\n    const { ContentComponent, ...contentComponents } = components || {}\n\n    const popperInstanceRef = useRef<Instance | null>(null)\n\n    const options = useMemo(() => {\n      const options = (modifiers ? { modifiers, placement } : { placement })\n\n      options.modifiers = options.modifiers || []\n\n      if (isPopup) {\n        options.modifiers = [\n          ...options.modifiers,\n          {\n            name: 'centering',\n            phase: 'beforeWrite',\n            enabled: true,\n            // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n            // @ts-ignore\n            fn: ({ state }): Partial<ModifierArguments> => {\n              const mcBoundRect = modalContainer?.getBoundingClientRect()\n\n              const { width, height, left, top } = mcBoundRect || {\n                width: window.innerWidth,\n                height: window.innerHeight,\n                left: 0,\n                top: 0,\n              }\n\n              const xpos = left + (width - state.elements.popper.clientWidth) / 2\n              const ypos = top + (height - state.elements.popper.clientHeight) / 2\n\n              return {\n                ...state,\n                styles: {\n                  ...state.styles,\n                  popper: {\n                    ...state.styles.popper,\n                    left: `${xpos}px`,\n                    top: `${ypos}px`,\n                    transform: 'none',\n                  },\n                },\n              }\n            },\n          },\n        ] as PopoverProps['modifiers']\n      }\n\n      return options\n    }, [modifiers, placement, isPopup, modalContainer])\n\n    // to save cancelable setTimout\n    const pendingHideRef = useRef<(() => void)>()\n\n    useEffect(() => {\n      popperInstanceRef?.current?.destroy()\n      let popperInstance: ReturnType<typeof createPopper>\n\n      if (target && content) {\n        popperInstance = createPopper(target, content, { ...options })\n\n        popperInstanceRef.current = popperInstance\n      }\n\n      return (): void => {\n        popperInstance?.destroy()\n        popperInstanceRef.current = null\n      }\n    }, [content, target, options])\n\n\n    const outsideClickUnsubscriber = useRef<() => void | null>()\n    const outsideClickUnsubscriberTimeout = useRef<any>(-1)\n\n    const hide = useCallback(() => {\n      if (content) {\n        delete content.dataset.show\n      }\n\n      if (isModal && modalRef?.current) {\n        modalRef.current.style.visibility = 'hidden'\n        delete modalRef.current.dataset.show\n      }\n\n      popperInstanceRef?.current?.update()\n      onHide?.()\n      outsideClickUnsubscriber?.current?.()\n      clearTimeout(outsideClickUnsubscriberTimeout.current)\n    }, [content, isModal, onHide])\n\n\n    const delayedHide = useCallback(() => {\n      pendingHideRef.current && pendingHideRef.current()\n      pendingHideRef.current = cancelableSetTimeout(hide, hideTimeout)\n    }, [hide, hideTimeout])\n\n    const cancelDelayedHide = useCallback(() => {\n      pendingHideRef.current && pendingHideRef.current()\n    }, [])\n\n    const handleOutsideClick = useCallback((eventTarget: HTMLElement | null) => {\n      if ((content?.dataset?.show === 'true' && hideOnClickOutside && !content?.contains(eventTarget))\n        || (content?.contains(eventTarget) && hideOnContentClick)) {\n        hide()\n      }\n    }, [hide, content, hideOnContentClick, hideOnClickOutside])\n\n    const open = useCallback(() => {\n      if (content) {\n        content.dataset.show = 'true'\n      }\n\n      popperInstanceRef?.current?.update()\n\n      if (isModal && modalRef?.current) {\n        modalRef.current.style.visibility = 'visible'\n        modalRef.current.dataset.show = 'true'\n      }\n\n      onOpen?.()\n\n      outsideClickUnsubscriber?.current?.()\n      clearTimeout(outsideClickUnsubscriberTimeout.current)\n      outsideClickUnsubscriberTimeout.current = setTimeout(() => {\n        outsideClickUnsubscriber.current = outsideClickHandler(target, handleOutsideClick)\n      }, 250)\n    }, [content, handleOutsideClick, isModal, onOpen, target])\n\n    const toggleOpen = useCallback(() => {\n      content?.dataset?.show === 'true' ? hide() : open()\n    }, [content, hide, open])\n\n    const keydownHandler = useCallback((event: Event) => {\n      if (hideOnEscape && (event as unknown as KeyboardEvent).keyCode === KeyCode.Escape) {\n        hide()\n      }\n    }, [hideOnEscape, hide])\n\n    useEffect(() => {\n      if (!hoverable && !clickable) {\n        console.error('Popover component should have at least one of props [\"hoverable\", \"clickable\"]')\n      }\n\n      const targetAddListener = target?.addEventListener?.bind(target)\n      const contentAddListener = content?.addEventListener?.bind(content)\n\n      if (contentAddListener && targetAddListener) {\n        if (hoverable) {\n          targetAddListener(EventName.MouseEnter, open)\n          contentAddListener(EventName.MouseEnter, cancelDelayedHide)\n          targetAddListener(EventName.MouseLeave, delayedHide)\n          contentAddListener(EventName.MouseLeave, hide)\n        }\n\n        if (clickable) {\n          targetAddListener(EventName.Click, toggleOpen)\n        }\n      }\n\n      if (hideOnEscape) {\n        document.addEventListener(EventName.KeyDown, keydownHandler)\n      }\n\n      return (): void => {\n        const targetRemoveListener = target?.removeEventListener?.bind(target)\n        const contentRemoveListener = content?.removeEventListener?.bind(content)\n\n        document.removeEventListener(EventName.KeyDown, keydownHandler)\n\n        pendingHideRef.current && pendingHideRef.current()\n\n        if (targetRemoveListener) {\n          targetRemoveListener(EventName.Click, toggleOpen)\n          targetRemoveListener(EventName.MouseEnter, open)\n          targetRemoveListener(EventName.MouseLeave, delayedHide)\n        }\n        if (contentRemoveListener) {\n          contentRemoveListener(EventName.MouseLeave, hide)\n          contentRemoveListener(EventName.MouseEnter, cancelDelayedHide)\n        }\n      }\n    }, [target, content, clickable, hoverable,\n      open, hide, toggleOpen, delayedHide, cancelDelayedHide, hideOnEscape, keydownHandler])\n\n    // open, hide based on external isOpen\n    useEffect(() => {\n      if (isOpen === true) {\n        open()\n      }\n      if (isOpen === false) {\n        hide()\n      }\n      return outsideClickUnsubscriber?.current as () => void\n    }, [hide, isOpen, open])\n\n    const childrenIsFunction = typeof children === 'function'\n    const childrenIsElement = typeof children !== 'function' && !Array.isArray(children)\n    const childrenAreElements = typeof children !== 'function' && Array.isArray(children)\n      && children.filter((child: ReactNode) => !!child).length === 2\n\n    // modal\n    const modalRef = useRef<HTMLDivElement | null>(null)\n\n    useEffect(() => {\n      if (isModal && content) {\n        content.style.zIndex = '2'\n      }\n    }, [content, isModal])\n\n    return (\n      <>\n        {isModal && <span ref={modalRef} style={styles.modal} className={modalOverlayClassName} />}\n        {(!targetRef && childrenIsFunction) && children?.({ forwardedRef: setTarget, data })}\n        {(!targetRef && childrenIsElement) && <span ref={setTarget}>{children}</span>}\n        {!childrenAreElements && ContentComponent && (\n        <ContentComponent\n          // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n          // @ts-ignore\n          placement={placement}\n          forwardedRef={setContent}\n          ref={typeof ContentComponent !== 'function' ? setContent : null}\n          data={data}\n          hide={hide}\n          components={contentComponents as { [key: string]: FC | React.Component<any> }}\n          {...props}\n        />\n        )}\n        {(!targetRef && childrenAreElements) && <span ref={setTarget}>{children[0]}</span>}\n        {(childrenAreElements && children?.[1] && typeof children?.[1] === 'object')\n        && React.cloneElement(children[1] as ReactElement, {\n          ...((children?.[1] as ReactElement)?.props),\n          placement,\n          forwardedRef: setContent,\n          // ...(typeof children[1] !== 'function' ? { ref: setContent } : {}),\n          ref: setContent,\n          data,\n          hide,\n          components: contentComponents as { [key: string]: FC | React.Component<any> },\n          ...props,\n        })}\n      </>\n    )\n  },\n)\n\nPopover.displayName = 'Popover'\n"],"names":["styles","modal","zIndex","position","width","height","top","left","background","pointerEvents","userSelect","visibility","Popover","memo","_ref","_targetRef$current","_children$","children","components","placement","modifiers","data","hoverable","clickable","onOpen","onHide","isOpen","hideOnContentClick","hideOnClickOutside","hideTimeout","isPopup","isModal","modalOverlayClassName","modalContainer","targetRef","hideOnEscape","props","_objectWithoutProperties","_excluded","content","setContent","useState","target","setTarget","current","useEffect","_ref2","ContentComponent","contentComponents","_excluded2","popperInstanceRef","useRef","options","useMemo","name","phase","enabled","fn","_ref3","state","mcBoundRect","getBoundingClientRect","window","innerWidth","innerHeight","xpos","elements","popper","clientWidth","ypos","clientHeight","_objectSpread","concat","transform","pendingHideRef","_popperInstanceRef$cu","popperInstance","destroy","createPopper","_popperInstance","outsideClickUnsubscriber","outsideClickUnsubscriberTimeout","hide","useCallback","_popperInstanceRef$cu2","_outsideClickUnsubscr","dataset","show","modalRef","style","update","call","clearTimeout","delayedHide","cancelableSetTimeout","cancelDelayedHide","handleOutsideClick","eventTarget","_content$dataset","contains","open","_popperInstanceRef$cu3","_outsideClickUnsubscr2","setTimeout","outsideClickHandler","toggleOpen","_content$dataset2","keydownHandler","event","keyCode","KeyCode","Escape","_target$addEventListe","_content$addEventList","targetAddListener","addEventListener","bind","contentAddListener","EventName","MouseEnter","MouseLeave","Click","document","KeyDown","_target$removeEventLi","_content$removeEventL","targetRemoveListener","removeEventListener","contentRemoveListener","childrenIsFunction","childrenIsElement","Array","isArray","childrenAreElements","filter","child","length","React","createElement","Fragment","ref","className","forwardedRef","_extends","cloneElement","displayName"],"mappings":"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"}

package/dist/ui/esm/src/core/ui/components/molecules/popover/Tooltip.js

@@ -1,2 +1,2 @@
-import{objectWithoutProperties as e,extends as t}from"../../../../../../_virtual/_rollupPluginBabelHelpers.js";import"../../../../../../node_modules/core-js/modules/web.dom-collections.iterator.js";import{r as o}from"../../../../../../node_modules/react/index.js";import{infoIconJSX as r}from"../../atoms/icons.js";import{Popover as n}from"./PopoverLite.js";import{PopoverPlacement as l}from"./popover.types.js";import i from"./tooltip.module.scss.js";import{HeadlineTertiary as a}from"../../atoms/text/Headline.js";import{DividerHorizontal as m}from"../../dividers/DividerLine.js";import{ParagraphSmall as s}from"../../atoms/text/Paragraph.js";import{IconBase as c}from"../../icon/IconBase.js";import{classNames as p}from"../../../../utils/helpers/ui.js";import{LayoutBox as d}from"../../container/layoutBox/LayoutBox.js";const f=["tooltipProps","components","infoIconUrl","children","infoTip","clickable","hoverable","placement","modifiers"],u=[{name:"offset",options:{offset:[0,10],placement:l.Top}}],h=e=>{let{forwardedRef:t,title:o,text:n,hide:l,showClose:f,closeIconUrl:u,className:h=""}=e;return React.createElement("div",{ref:t,className:p(i["popover-tooltip"],h)},React.createElement("div",{id:"arrow","data-popper-arrow":!0,className:i.arrow},React.createElement("div",{className:i["arrow-inner"]})),React.createElement(d,{padding:"1rem",direction:"column",width:"256px",height:"unset",flexGrow:"1"},o&&React.createElement(d,{justify:"space-between",align:"start",width:"100%",padding:"0"},React.createElement(a,null,o),f&&React.createElement("div",{onClick:l,onKeyDown:l,role:"button",tabIndex:-1,className:i["close-button"]},u&&React.createElement(c,{iconUrl:u}),!u&&React.createElement(c,null,r))),o&&React.createElement(m,{margin:"8px 0"}),n&&React.createElement(s,{element:"p"},n)))},j=o.memo((l=>{let{tooltipProps:i,components:{ContentComponent:a}={ContentComponent:h},infoIconUrl:m,children:s,infoTip:p,clickable:d=!1,hoverable:j=!0,placement:R="top",modifiers:v}=l,x=e(l,f);const E=o.useMemo((()=>a?{ContentComponent:a}:void 0),[a]);let b;s&&(b=s),!s&&p&&(b=m?React.createElement(c,{iconUrl:m,size:"1rem",color:"#00336640",style:{lineHeight:"1px"}}):React.createElement(c,{size:"1rem",color:"#00336640",style:{lineHeight:"1px"}},r));const w=o.useMemo((()=>[...u,...v||[]]),[v]);return React.createElement(n,t({},x,i,{hoverable:j,clickable:d,placement:R,modifiers:w,components:E,showClose:d}),b&&b)}));j.displayName="Tooltip";export{j as Tooltip};
+import{objectWithoutProperties as e,extends as t}from"../../../../../../_virtual/_rollupPluginBabelHelpers.js";import"../../../../../../node_modules/core-js/modules/web.dom-collections.iterator.js";import{memo as o,useMemo as r}from"react";import{infoIconJSX as n}from"../../atoms/icons.js";import{Popover as l}from"./PopoverLite.js";import{PopoverPlacement as i}from"./popover.types.js";import a from"./tooltip.module.scss.js";import{HeadlineTertiary as c}from"../../atoms/text/Headline.js";import{DividerHorizontal as m}from"../../dividers/DividerLine.js";import{ParagraphSmall as s}from"../../atoms/text/Paragraph.js";import{IconBase as p}from"../../icon/IconBase.js";import{classNames as d}from"../../../../utils/helpers/ui.js";import{LayoutBox as f}from"../../container/layoutBox/LayoutBox.js";const u=["tooltipProps","components","infoIconUrl","children","infoTip","clickable","hoverable","placement","modifiers"],h=[{name:"offset",options:{offset:[0,10],placement:i.Top}}],j=e=>{let{forwardedRef:t,title:o,text:r,hide:l,showClose:i,closeIconUrl:u,className:h=""}=e;return React.createElement("div",{ref:t,className:d(a["popover-tooltip"],h)},React.createElement("div",{id:"arrow","data-popper-arrow":!0,className:a.arrow},React.createElement("div",{className:a["arrow-inner"]})),React.createElement(f,{padding:"1rem",direction:"column",width:"256px",height:"unset",flexGrow:"1"},o&&React.createElement(f,{justify:"space-between",align:"start",width:"100%",padding:"0"},React.createElement(c,null,o),i&&React.createElement("div",{onClick:l,onKeyDown:l,role:"button",tabIndex:-1,className:a["close-button"]},u&&React.createElement(p,{iconUrl:u}),!u&&React.createElement(p,null,n))),o&&React.createElement(m,{margin:"8px 0"}),r&&React.createElement(s,{element:"p"},r)))},R=o((o=>{let{tooltipProps:i,components:{ContentComponent:a}={ContentComponent:j},infoIconUrl:c,children:m,infoTip:s,clickable:d=!1,hoverable:f=!0,placement:R="top",modifiers:v}=o,E=e(o,u);const b=r((()=>a?{ContentComponent:a}:void 0),[a]);let w;m&&(w=m),!m&&s&&(w=c?React.createElement(p,{iconUrl:c,size:"1rem",color:"#00336640",style:{lineHeight:"1px"}}):React.createElement(p,{size:"1rem",color:"#00336640",style:{lineHeight:"1px"}},n));const x=r((()=>[...h,...v||[]]),[v]);return React.createElement(l,t({},E,i,{hoverable:f,clickable:d,placement:R,modifiers:x,components:b,showClose:d}),w&&w)}));R.displayName="Tooltip";export{R as Tooltip};
 //# sourceMappingURL=Tooltip.js.map

package/dist/ui/esm/src/core/ui/components/molecules/popover/Tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.js","sources":["../../../../../../../../../src/core/ui/components/molecules/popover/Tooltip.tsx"],"sourcesContent":["import { memo, FC, useMemo, PropsWithChildren } from 'react'\n// import { DividerHorizontal, LayoutBox, IconBase } from '@e1011/es-kit'\n\n\n\nimport { HeadlineTertiary as H3, ParagraphSmall } from '../../atoms/text'\nimport { DividerHorizontal } from '../../dividers'\nimport { LayoutBox } from '../../container'\nimport { IconBase } from '../../icon'\nimport { infoIconJSX } from '../../atoms/icons'\nimport { classNames } from '../../../../utils'\n\nimport { Popover } from './PopoverLite'\nimport { PopoverPlacement, PopoverProps } from './popover.types'\nimport classes from './tooltip.module.scss'\n\n\n/**\n\nModifiers for the Popover component used in Tooltip.\n*/\nconst popoverModifiers = [\n  {\n    name: 'offset',\n    options: {\n      offset: [0, 10],\n      placement: PopoverPlacement.Top,\n    },\n  },\n]\n\n/**\n\nProps for the TooltipContent component.\n@typedef {Object} TooltipContentProps\n@property {ForwardedRef} forwardedRef - Forwarded ref of the TooltipContent component.\n@property {string} title - Title of the tooltip.\n@property {string} text - Text content of the tooltip.\n@property {Function} hide - Function to hide the tooltip.\n@property {boolean} showClose - Determines whether to show a close button in the tooltip.\n@extends PropsWithChildren\n*/\ntype TooltipContentProps = PropsWithChildren<any> & {\n  forwardedRef: ForwardedRef\n  closeIconUrl?: string\n  className?: string\n  title?: string\n  text?: string\n  hide: () => void\n  showClose?: boolean\n}\n\n/**\n\n  Tooltip content component used by the Tooltip component.\n  @param {TooltipContentProps} props - Props for the TooltipContent component.\n  @returns {JSX.Element} - Returns the JSX element for the TooltipContent component.\n  */\nconst TooltipContent = ({\n  forwardedRef, title, text, hide, showClose, closeIconUrl, className = '',\n}: TooltipContentProps): JSX.Element => (\n  <div\n    ref={forwardedRef}\n    className={classNames(classes['popover-tooltip'], className)}\n  >\n    <div id='arrow' data-popper-arrow className={classes.arrow}>\n      <div className={classes['arrow-inner']} />\n    </div>\n    <LayoutBox\n      padding='1rem'\n      direction='column'\n      width='256px'\n      height='unset'\n      flexGrow='1'\n    >\n      {title && (\n        <LayoutBox justify='space-between' align='start' width='100%' padding='0'>\n          <H3>{title}</H3>\n          {showClose && (\n            <div\n              onClick={hide}\n              onKeyDown={hide}\n              role='button'\n              tabIndex={-1}\n              className={classes['close-button']}\n            >\n              {closeIconUrl && <IconBase iconUrl={closeIconUrl} />}\n              {!closeIconUrl && (\n                <IconBase>\n                  {infoIconJSX}\n                </IconBase>\n              )}\n            </div>\n          )}\n        </LayoutBox>\n      )}\n      {title && <DividerHorizontal margin='8px 0' />}\n      {text && <ParagraphSmall element='p'>{text}</ParagraphSmall>}\n    </LayoutBox>\n  </div>\n)\n\n\n\n/**\n\nProps for the Tooltip component, extends PopoverProps.\n@typedef {Object} TooltipProps\n@property {Record<string, unknown>} [tooltipProps] - Additional props to be passed to the underlying Popover component.\n@extends PopoverProps\n*/\nexport type TooltipProps = PopoverProps & TooltipContentProps & {\n  tooltipProps?: Record<string, unknown>\n  infoIconUrl?: string\n}\n\n\n/**\n * A tooltip component that displays a short message when the user hovers or clicks on a target element.\n *\n * @param tooltipProps - Optional properties to be passed down to the `Popover` component.\n * @param components - Optional components that can be customized by the consumer.\n * @param children - The target element that the tooltip will be anchored to.\n * @param infoTip - If no `children` prop is passed in, an information icon will be used as the target element.\n * @param clickable - If `true`, the tooltip will be triggered by a click instead of a hover.\n * @param hoverable - If `true`, the tooltip will be triggered by a hover. Defaults to `true`.\n * @param placement - The placement of the tooltip relative to the target element.\n * @param modifiers - Optional modifiers to be passed down to the `Popover` component.\n */\nexport const Tooltip: FC<TooltipProps> = memo<TooltipProps>(({\n  tooltipProps, components: { ContentComponent } = { ContentComponent: TooltipContent },\n  infoIconUrl,\n  children, infoTip, clickable = false, hoverable = true, placement = 'top', modifiers, ...props\n}: TooltipProps) => {\n  const popoverComponents = useMemo(() => (ContentComponent ? {\n    ContentComponent,\n  } : undefined), [ContentComponent])\n\n  let TargetNode: typeof children\n\n  if (children) {\n    TargetNode = children\n  }\n  if (!children && infoTip) {\n    TargetNode = (\n      infoIconUrl\n        ? <IconBase iconUrl={infoIconUrl} size='1rem' color='#00336640' style={{ lineHeight: '1px' }} />\n        : (\n          <IconBase size='1rem' color='#00336640' style={{ lineHeight: '1px' }}>\n            {infoIconJSX}\n          </IconBase>\n        )\n    )\n  }\n\n  const mergedModifiers = useMemo(() => ([...popoverModifiers, ...(modifiers || [])]), [modifiers])\n\n  return (\n    <Popover\n      {...props}\n      {...tooltipProps}\n      hoverable={hoverable}\n      clickable={clickable}\n      placement={placement}\n      modifiers={mergedModifiers}\n      components={popoverComponents}\n      showClose={clickable}\n    >\n      {TargetNode && TargetNode}\n    </Popover>\n  )\n})\n\n/**\n * The display name of the Tooltip component.\n *\n * @type {string}\n */\nTooltip.displayName = 'Tooltip'\n\n"],"names":["popoverModifiers","name","options","offset","placement","PopoverPlacement","Top","TooltipContent","_ref","forwardedRef","title","text","hide","showClose","closeIconUrl","className","React","createElement","ref","classNames","classes","id","arrow","LayoutBox","padding","direction","width","height","flexGrow","justify","align","H3","onClick","onKeyDown","role","tabIndex","IconBase","iconUrl","infoIconJSX","DividerHorizontal","margin","ParagraphSmall","element","Tooltip","memo","_ref2","tooltipProps","components","ContentComponent","infoIconUrl","children","infoTip","clickable","hoverable","modifiers","props","_objectWithoutProperties","_excluded","popoverComponents","useMemo","undefined","TargetNode","size","color","style","lineHeight","mergedModifiers","Popover","_extends","displayName"],"mappings":"g7BAqBMA,EAAmB,CACvB,CACEC,KAAM,SACNC,QAAS,CACPC,OAAQ,CAAC,EAAG,IACZC,UAAWC,EAAiBC,OAgC5BC,EAAiBC,IAAA,IAACC,aACtBA,EAAYC,MAAEA,EAAKC,KAAEA,EAAIC,KAAEA,EAAIC,UAAEA,EAASC,aAAEA,EAAYC,UAAEA,EAAY,IAClDP,EAAA,OACpBQ,MAAAC,cAAA,MAAA,CACEC,IAAKT,EACLM,UAAWI,EAAWC,EAAQ,mBAAoBL,IAElDC,MAAAC,cAAA,MAAA,CAAKI,GAAG,QAAQ,qBAAiB,EAACN,UAAWK,EAAQE,OACnDN,MAAAC,cAAA,MAAA,CAAKF,UAAWK,EAAQ,kBAE1BJ,MAAAC,cAACM,EAAS,CACRC,QAAQ,OACRC,UAAU,SACVC,MAAM,QACNC,OAAO,QACPC,SAAS,KAERlB,GACCM,MAAAC,cAACM,EAAS,CAACM,QAAQ,gBAAgBC,MAAM,QAAQJ,MAAM,OAAOF,QAAQ,KACpER,MAAAC,cAACc,EAAE,KAAErB,GACJG,GACCG,MAAAC,cAAA,MAAA,CACEe,QAASpB,EACTqB,UAAWrB,EACXsB,KAAK,SACLC,UAAW,EACXpB,UAAWK,EAAQ,iBAElBN,GAAgBE,MAAAC,cAACmB,EAAQ,CAACC,QAASvB,KAClCA,GACAE,MAAAC,cAACmB,EAAQ,KACNE,KAOZ5B,GAASM,MAAAC,cAACsB,EAAiB,CAACC,OAAO,UACnC7B,GAAQK,MAAAC,cAACwB,EAAc,CAACC,QAAQ,KAAK/B,IAEpC,EA8BKgC,EAA4BC,EAAIA,MAAeC,IAIxC,IAJyCC,aAC3DA,EAAcC,YAAYC,iBAAEA,GAAqB,CAAEA,iBAAkBzC,GAAgB0C,YACrFA,EAAWC,SACXA,EAAQC,QAAEA,EAAOC,UAAEA,GAAY,EAAKC,UAAEA,GAAY,EAAIjD,UAAEA,EAAY,MAAKkD,UAAEA,GAC9DT,EAD4EU,EAAKC,EAAAX,EAAAY,GAE9F,MAAMC,EAAoBC,WAAQ,IAAOX,EAAmB,CAC1DA,yBACEY,GAAY,CAACZ,IAEjB,IAAIa,EAEAX,IACFW,EAAaX,IAEVA,GAAYC,IACfU,EACEZ,EACIjC,MAAAC,cAACmB,EAAQ,CAACC,QAASY,EAAaa,KAAK,OAAOC,MAAM,YAAYC,MAAO,CAAEC,WAAY,SAEnFjD,MAAAC,cAACmB,EAAQ,CAAC0B,KAAK,OAAOC,MAAM,YAAYC,MAAO,CAAEC,WAAY,QAC1D3B,IAMX,MAAM4B,EAAkBP,EAAAA,SAAQ,IAAO,IAAI3D,KAAsBsD,GAAa,KAAO,CAACA,IAEtF,OACEtC,MAAAC,cAACkD,EAAOC,EAAA,CAAA,EACFb,EACAT,EAAY,CAChBO,UAAWA,EACXD,UAAWA,EACXhD,UAAWA,EACXkD,UAAWY,EACXnB,WAAYW,EACZ7C,UAAWuC,IAEVS,GAAcA,EACP,IASdlB,EAAQ0B,YAAc"}
+{"version":3,"file":"Tooltip.js","sources":["../../../../../../../../../src/core/ui/components/molecules/popover/Tooltip.tsx"],"sourcesContent":["import { memo, FC, useMemo, PropsWithChildren } from 'react'\n// import { DividerHorizontal, LayoutBox, IconBase } from '@e1011/es-kit'\n\n\n\nimport { HeadlineTertiary as H3, ParagraphSmall } from '../../atoms/text'\nimport { DividerHorizontal } from '../../dividers'\nimport { LayoutBox } from '../../container'\nimport { IconBase } from '../../icon'\nimport { infoIconJSX } from '../../atoms/icons'\nimport { classNames } from '../../../../utils'\n\nimport { Popover } from './PopoverLite'\nimport { PopoverPlacement, PopoverProps } from './popover.types'\nimport classes from './tooltip.module.scss'\n\n\n/**\n\nModifiers for the Popover component used in Tooltip.\n*/\nconst popoverModifiers = [\n  {\n    name: 'offset',\n    options: {\n      offset: [0, 10],\n      placement: PopoverPlacement.Top,\n    },\n  },\n]\n\n/**\n\nProps for the TooltipContent component.\n@typedef {Object} TooltipContentProps\n@property {ForwardedRef} forwardedRef - Forwarded ref of the TooltipContent component.\n@property {string} title - Title of the tooltip.\n@property {string} text - Text content of the tooltip.\n@property {Function} hide - Function to hide the tooltip.\n@property {boolean} showClose - Determines whether to show a close button in the tooltip.\n@extends PropsWithChildren\n*/\ntype TooltipContentProps = PropsWithChildren<any> & {\n  forwardedRef: ForwardedRef\n  closeIconUrl?: string\n  className?: string\n  title?: string\n  text?: string\n  hide: () => void\n  showClose?: boolean\n}\n\n/**\n\n  Tooltip content component used by the Tooltip component.\n  @param {TooltipContentProps} props - Props for the TooltipContent component.\n  @returns {JSX.Element} - Returns the JSX element for the TooltipContent component.\n  */\nconst TooltipContent = ({\n  forwardedRef, title, text, hide, showClose, closeIconUrl, className = '',\n}: TooltipContentProps): JSX.Element => (\n  <div\n    ref={forwardedRef}\n    className={classNames(classes['popover-tooltip'], className)}\n  >\n    <div id='arrow' data-popper-arrow className={classes.arrow}>\n      <div className={classes['arrow-inner']} />\n    </div>\n    <LayoutBox\n      padding='1rem'\n      direction='column'\n      width='256px'\n      height='unset'\n      flexGrow='1'\n    >\n      {title && (\n        <LayoutBox justify='space-between' align='start' width='100%' padding='0'>\n          <H3>{title}</H3>\n          {showClose && (\n            <div\n              onClick={hide}\n              onKeyDown={hide}\n              role='button'\n              tabIndex={-1}\n              className={classes['close-button']}\n            >\n              {closeIconUrl && <IconBase iconUrl={closeIconUrl} />}\n              {!closeIconUrl && (\n                <IconBase>\n                  {infoIconJSX}\n                </IconBase>\n              )}\n            </div>\n          )}\n        </LayoutBox>\n      )}\n      {title && <DividerHorizontal margin='8px 0' />}\n      {text && <ParagraphSmall element='p'>{text}</ParagraphSmall>}\n    </LayoutBox>\n  </div>\n)\n\n\n\n/**\n\nProps for the Tooltip component, extends PopoverProps.\n@typedef {Object} TooltipProps\n@property {Record<string, unknown>} [tooltipProps] - Additional props to be passed to the underlying Popover component.\n@extends PopoverProps\n*/\nexport type TooltipProps = PopoverProps & TooltipContentProps & {\n  tooltipProps?: Record<string, unknown>\n  infoIconUrl?: string\n}\n\n\n/**\n * A tooltip component that displays a short message when the user hovers or clicks on a target element.\n *\n * @param tooltipProps - Optional properties to be passed down to the `Popover` component.\n * @param components - Optional components that can be customized by the consumer.\n * @param children - The target element that the tooltip will be anchored to.\n * @param infoTip - If no `children` prop is passed in, an information icon will be used as the target element.\n * @param clickable - If `true`, the tooltip will be triggered by a click instead of a hover.\n * @param hoverable - If `true`, the tooltip will be triggered by a hover. Defaults to `true`.\n * @param placement - The placement of the tooltip relative to the target element.\n * @param modifiers - Optional modifiers to be passed down to the `Popover` component.\n */\nexport const Tooltip: FC<TooltipProps> = memo<TooltipProps>(({\n  tooltipProps, components: { ContentComponent } = { ContentComponent: TooltipContent },\n  infoIconUrl,\n  children, infoTip, clickable = false, hoverable = true, placement = 'top', modifiers, ...props\n}: TooltipProps) => {\n  const popoverComponents = useMemo(() => (ContentComponent ? {\n    ContentComponent,\n  } : undefined), [ContentComponent])\n\n  let TargetNode: typeof children\n\n  if (children) {\n    TargetNode = children\n  }\n  if (!children && infoTip) {\n    TargetNode = (\n      infoIconUrl\n        ? <IconBase iconUrl={infoIconUrl} size='1rem' color='#00336640' style={{ lineHeight: '1px' }} />\n        : (\n          <IconBase size='1rem' color='#00336640' style={{ lineHeight: '1px' }}>\n            {infoIconJSX}\n          </IconBase>\n        )\n    )\n  }\n\n  const mergedModifiers = useMemo(() => ([...popoverModifiers, ...(modifiers || [])]), [modifiers])\n\n  return (\n    <Popover\n      {...props}\n      {...tooltipProps}\n      hoverable={hoverable}\n      clickable={clickable}\n      placement={placement}\n      modifiers={mergedModifiers}\n      components={popoverComponents}\n      showClose={clickable}\n    >\n      {TargetNode && TargetNode}\n    </Popover>\n  )\n})\n\n/**\n * The display name of the Tooltip component.\n *\n * @type {string}\n */\nTooltip.displayName = 'Tooltip'\n\n"],"names":["popoverModifiers","name","options","offset","placement","PopoverPlacement","Top","TooltipContent","_ref","forwardedRef","title","text","hide","showClose","closeIconUrl","className","React","createElement","ref","classNames","classes","id","arrow","LayoutBox","padding","direction","width","height","flexGrow","justify","align","H3","onClick","onKeyDown","role","tabIndex","IconBase","iconUrl","infoIconJSX","DividerHorizontal","margin","ParagraphSmall","element","Tooltip","memo","_ref2","tooltipProps","components","ContentComponent","infoIconUrl","children","infoTip","clickable","hoverable","modifiers","props","_objectWithoutProperties","_excluded","popoverComponents","useMemo","undefined","TargetNode","size","color","style","lineHeight","mergedModifiers","Popover","_extends","displayName"],"mappings":"w5BAqBMA,EAAmB,CACvB,CACEC,KAAM,SACNC,QAAS,CACPC,OAAQ,CAAC,EAAG,IACZC,UAAWC,EAAiBC,OAgC5BC,EAAiBC,IAAA,IAACC,aACtBA,EAAYC,MAAEA,EAAKC,KAAEA,EAAIC,KAAEA,EAAIC,UAAEA,EAASC,aAAEA,EAAYC,UAAEA,EAAY,IAClDP,EAAA,OACpBQ,MAAAC,cAAA,MAAA,CACEC,IAAKT,EACLM,UAAWI,EAAWC,EAAQ,mBAAoBL,IAElDC,MAAAC,cAAA,MAAA,CAAKI,GAAG,QAAQ,qBAAiB,EAACN,UAAWK,EAAQE,OACnDN,MAAAC,cAAA,MAAA,CAAKF,UAAWK,EAAQ,kBAE1BJ,MAAAC,cAACM,EAAS,CACRC,QAAQ,OACRC,UAAU,SACVC,MAAM,QACNC,OAAO,QACPC,SAAS,KAERlB,GACCM,MAAAC,cAACM,EAAS,CAACM,QAAQ,gBAAgBC,MAAM,QAAQJ,MAAM,OAAOF,QAAQ,KACpER,MAAAC,cAACc,EAAE,KAAErB,GACJG,GACCG,MAAAC,cAAA,MAAA,CACEe,QAASpB,EACTqB,UAAWrB,EACXsB,KAAK,SACLC,UAAW,EACXpB,UAAWK,EAAQ,iBAElBN,GAAgBE,MAAAC,cAACmB,EAAQ,CAACC,QAASvB,KAClCA,GACAE,MAAAC,cAACmB,EAAQ,KACNE,KAOZ5B,GAASM,MAAAC,cAACsB,EAAiB,CAACC,OAAO,UACnC7B,GAAQK,MAAAC,cAACwB,EAAc,CAACC,QAAQ,KAAK/B,IAEpC,EA8BKgC,EAA4BC,GAAmBC,IAIxC,IAJyCC,aAC3DA,EAAcC,YAAYC,iBAAEA,GAAqB,CAAEA,iBAAkBzC,GAAgB0C,YACrFA,EAAWC,SACXA,EAAQC,QAAEA,EAAOC,UAAEA,GAAY,EAAKC,UAAEA,GAAY,EAAIjD,UAAEA,EAAY,MAAKkD,UAAEA,GAC9DT,EAD4EU,EAAKC,EAAAX,EAAAY,GAE9F,MAAMC,EAAoBC,GAAQ,IAAOX,EAAmB,CAC1DA,yBACEY,GAAY,CAACZ,IAEjB,IAAIa,EAEAX,IACFW,EAAaX,IAEVA,GAAYC,IACfU,EACEZ,EACIjC,MAAAC,cAACmB,EAAQ,CAACC,QAASY,EAAaa,KAAK,OAAOC,MAAM,YAAYC,MAAO,CAAEC,WAAY,SAEnFjD,MAAAC,cAACmB,EAAQ,CAAC0B,KAAK,OAAOC,MAAM,YAAYC,MAAO,CAAEC,WAAY,QAC1D3B,IAMX,MAAM4B,EAAkBP,GAAQ,IAAO,IAAI3D,KAAsBsD,GAAa,KAAO,CAACA,IAEtF,OACEtC,MAAAC,cAACkD,EAAOC,EAAA,CAAA,EACFb,EACAT,EAAY,CAChBO,UAAWA,EACXD,UAAWA,EACXhD,UAAWA,EACXkD,UAAWY,EACXnB,WAAYW,EACZ7C,UAAWuC,IAEVS,GAAcA,EACP,IASdlB,EAAQ0B,YAAc"}

package/dist/ui/esm/src/core/ui/components/molecules/popup/Popup.js

@@ -1,2 +1,2 @@
-import{objectWithoutProperties as e,objectSpread2 as t,extends as o}from"../../../../../../_virtual/_rollupPluginBabelHelpers.js";import{r as a}from"../../../../../../node_modules/react/index.js";import{Popover as n}from"../popover/PopoverLite.js";import{closeIconJSX as l}from"../../atoms/icons.js";import i from"./popup.module.scss.js";import r from"./popup.overlay.module.scss.js";import{PopupAnimateVariant as s}from"./popup.types.js";import{DividerLine as p}from"../../dividers/DividerLine.js";import{LayoutBox as c}from"../../container/layoutBox/LayoutBox.js";import{HeadlineTertiary as m}from"../../atoms/text/Headline.js";import{IconBase as d}from"../../icon/IconBase.js";const u=["title","children","components","isModal","hideOnClickOutside","hideOnContentClick","animateVariant","hasHeader","hasCloseIcon","width","height","style"],h=["title","forwardedRef","hide","children","animateVariant","popupStyle","hasHeader","hasCloseIcon","closeIconURL"],E={popup:{inner:{[s.SLIDE_DOWN]:{"--slideYFrom":"-48px"},[s.SLIDE_UP]:{"--slideYFrom":"48px"},[s.SLIDE_RIGHT]:{"--slideXFrom":"-64px"},[s.SLIDE_LEFT]:{"--slideXFrom":"64px"}}}},R=a.memo((l=>{let{title:i="Popup's title",children:p,components:c={},isModal:m=!0,hideOnClickOutside:d=!1,hideOnContentClick:h=!1,animateVariant:E=s.SLIDE_UP,hasHeader:R=!0,hasCloseIcon:C=!0,width:f,height:x,style:I}=l,j=e(l,u);const v=null==c?void 0:c.ContentComponent,L=a.useMemo((()=>t(t(t({},f?{"--popup-width":f}:{}),x?{"--popup-height":x}:{}),I)),[x,I,f]);return React.createElement(n,o({clickable:!0,isPopup:!0,isModal:m,hideOnContentClick:h,hideOnClickOutside:d,modalOverlayClassName:r["popup-modal-overlay"]},j),React.createElement("p",null),React.createElement(y,{title:i,hasHeader:R,hasCloseIcon:C,animateVariant:E,popupStyle:L},!v&&p&&p,!p&&v&&React.createElement(v,null)))}));R.displayName="Popup";const y=a.memo((o=>{let{title:n,forwardedRef:r,hide:s,children:u,animateVariant:R,popupStyle:y,hasHeader:C=!0,hasCloseIcon:f=!0,closeIconURL:x}=o,I=e(o,h);const j=u&&Array.isArray(u)?u.filter((e=>!!e)).map(((e,o)=>a.cloneElement(e,t(t({key:o},e.props),{},{hide:s},I)))):React.createElement("div",null,"Pseudo Content");return React.createElement("div",{className:"".concat(i["popup-container"]),ref:r,style:y},React.createElement(c,{className:"".concat(i["popup-container-inner"]),style:R?E.popup.inner[R]:null},C&&React.createElement(React.Fragment,null,React.createElement(c,{justify:"space-between",align:"start",width:"100%",padding:"20px 20px 16px 20px"},React.createElement(m,null,n),f&&React.createElement("div",{onClick:s,onKeyDown:s,role:"button",tabIndex:-1,className:i["close-button"]},x&&React.createElement(d,{iconUrl:x}),!x&&React.createElement(d,null,l))),React.createElement(p,{length:"100%"})),React.createElement("div",{className:i["popup-container-inner-div"]},j&&j)))}));y.displayName="PopupContent";export{R as Popup};
+import{objectWithoutProperties as e,objectSpread2 as t,extends as o}from"../../../../../../_virtual/_rollupPluginBabelHelpers.js";import{memo as a,useMemo as n,cloneElement as i}from"react";import{Popover as l}from"../popover/PopoverLite.js";import{closeIconJSX as r}from"../../atoms/icons.js";import p from"./popup.module.scss.js";import s from"./popup.overlay.module.scss.js";import{PopupAnimateVariant as c}from"./popup.types.js";import{DividerLine as m}from"../../dividers/DividerLine.js";import{LayoutBox as d}from"../../container/layoutBox/LayoutBox.js";import{HeadlineTertiary as u}from"../../atoms/text/Headline.js";import{IconBase as h}from"../../icon/IconBase.js";const E=["title","children","components","isModal","hideOnClickOutside","hideOnContentClick","animateVariant","hasHeader","hasCloseIcon","width","height","style"],R=["title","forwardedRef","hide","children","animateVariant","popupStyle","hasHeader","hasCloseIcon","closeIconURL"],y={popup:{inner:{[c.SLIDE_DOWN]:{"--slideYFrom":"-48px"},[c.SLIDE_UP]:{"--slideYFrom":"48px"},[c.SLIDE_RIGHT]:{"--slideXFrom":"-64px"},[c.SLIDE_LEFT]:{"--slideXFrom":"64px"}}}},C=a((a=>{let{title:i="Popup's title",children:r,components:p={},isModal:m=!0,hideOnClickOutside:d=!1,hideOnContentClick:u=!1,animateVariant:h=c.SLIDE_UP,hasHeader:R=!0,hasCloseIcon:y=!0,width:C,height:I,style:v}=a,x=e(a,E);const j=null==p?void 0:p.ContentComponent,L=n((()=>t(t(t({},C?{"--popup-width":C}:{}),I?{"--popup-height":I}:{}),v)),[I,v,C]);return React.createElement(l,o({clickable:!0,isPopup:!0,isModal:m,hideOnContentClick:u,hideOnClickOutside:d,modalOverlayClassName:s["popup-modal-overlay"]},x),React.createElement("p",null),React.createElement(f,{title:i,hasHeader:R,hasCloseIcon:y,animateVariant:h,popupStyle:L},!j&&r&&r,!r&&j&&React.createElement(j,null)))}));C.displayName="Popup";const f=a((o=>{let{title:a,forwardedRef:n,hide:l,children:s,animateVariant:c,popupStyle:E,hasHeader:C=!0,hasCloseIcon:f=!0,closeIconURL:I}=o,v=e(o,R);const x=s&&Array.isArray(s)?s.filter((e=>!!e)).map(((e,o)=>i(e,t(t({key:o},e.props),{},{hide:l},v)))):React.createElement("div",null,"Pseudo Content");return React.createElement("div",{className:"".concat(p["popup-container"]),ref:n,style:E},React.createElement(d,{className:"".concat(p["popup-container-inner"]),style:c?y.popup.inner[c]:null},C&&React.createElement(React.Fragment,null,React.createElement(d,{justify:"space-between",align:"start",width:"100%",padding:"20px 20px 16px 20px"},React.createElement(u,null,a),f&&React.createElement("div",{onClick:l,onKeyDown:l,role:"button",tabIndex:-1,className:p["close-button"]},I&&React.createElement(h,{iconUrl:I}),!I&&React.createElement(h,null,r))),React.createElement(m,{length:"100%"})),React.createElement("div",{className:p["popup-container-inner-div"]},x&&x)))}));f.displayName="PopupContent";export{C as Popup};
 //# sourceMappingURL=Popup.js.map

package/dist/ui/esm/src/core/ui/components/molecules/popup/Popup.js.map

@@ -1 +1 @@
-{"version":3,"file":"Popup.js","sources":["../../../../../../../../../src/core/ui/components/molecules/popup/Popup.tsx"],"sourcesContent":["import {\n  cloneElement, memo, PropsWithChildren, FC, ReactNode, CSSProperties, useMemo, ReactElement,\n} from 'react'\n\nimport { Popover as PopoverLite } from '../popover/PopoverLite'\nimport { HeadlineTertiary as H3 } from '../../atoms/text'\nimport { IconBase } from '../../icon'\nimport { DividerLine } from '../../dividers'\nimport { LayoutBox } from '../../container'\nimport { closeIconJSX } from '../../atoms/icons'\n\nimport classes from './popup.module.scss'\nimport classesOverlay from './popup.overlay.module.scss'\nimport { PopupAnimateVariant, PopupProps } from './popup.types'\n\n\n/**\n * Styles for the Popup component.\n *\n * @typedef {Object} PopupStyles\n * @property {Object} inner - The inner styles for the popup.\n * @property {CSSProperties} content - The styles for the popup content.\n */\n\nconst styles: {\n  popup: {\n    inner: Record<string, Record<string, string>>\n  }\n\n} = {\n  popup: {\n    inner: {\n      [PopupAnimateVariant.SLIDE_DOWN]: { '--slideYFrom': '-48px' },\n      [PopupAnimateVariant.SLIDE_UP]: { '--slideYFrom': '48px' },\n      [PopupAnimateVariant.SLIDE_RIGHT]: { '--slideXFrom': '-64px' },\n      [PopupAnimateVariant.SLIDE_LEFT]: { '--slideXFrom': '64px' },\n    },\n  },\n}\n\n/**\n * Popup component.\n *\n * @type {React.FC<PopupProps>}\n * @returns {React.ReactElement} The Popup.\n */\nexport const Popup: FC<PopupProps> = memo<PopupProps>(({\n  title = 'Popup\\'s title',\n  children,\n  components = {},\n  isModal = true,\n  hideOnClickOutside = false,\n  hideOnContentClick = false,\n  animateVariant = PopupAnimateVariant.SLIDE_UP,\n  hasHeader = true,\n  hasCloseIcon = true,\n  width,\n  height,\n  style,\n  ...props\n}: PopupProps) => {\n  /**\n   * The ContentComponent to render.\n   *\n   * @type {ComponentType}\n   */\n  const ContentComponent = components?.ContentComponent\n\n  /**\n   * The popup styles.\n   *\n   * @type {CSSProperties}\n   */\n  const styles = useMemo(() => ({\n    ...(width ? { '--popup-width': width } : {}),\n    ...(height ? { '--popup-height': height } : {}),\n    ...style,\n  }), [height, style, width])\n\n  return (\n    <PopoverLite\n      clickable\n      isPopup\n      isModal={isModal}\n      hideOnContentClick={hideOnContentClick}\n      hideOnClickOutside={hideOnClickOutside}\n      modalOverlayClassName={classesOverlay['popup-modal-overlay']}\n      {...props}\n    >\n      <p>{/* Placeholder element to avoid error with no children */}</p>\n      <PopupContent\n        title={title}\n        hasHeader={hasHeader}\n        hasCloseIcon={hasCloseIcon}\n        animateVariant={animateVariant}\n        popupStyle={styles}\n      >\n        {/* Render children if ContentComponent is not provided */}\n        {(!ContentComponent && children) && children}\n        {/* Render ContentComponent if children are not provided */}\n        {(!children && ContentComponent) && <ContentComponent />}\n      </PopupContent>\n    </PopoverLite>\n  )\n})\n\n/**\n * The display name of the Popup component.\n *\n * @type {string}\n */\nPopup.displayName = 'Popup'\n\ntype PopupContentProps = PropsWithChildren<unknown> & {\n  title?: string\n  forwardedRef?: ForwardedRef['forwardedRef']\n  animateVariant?: PopupProps['animateVariant']\n  popupStyle?: CSSProperties\n  hasHeader?: boolean\n  hasCloseIcon?: boolean\n  closeIconURL?: string\n  hide?: () => void\n}\n\n/**\n * The PopupContent component.\n *\n * @param {PopupContentProps} props The props for the PopupContent component.\n * @returns {React.ReactElement} The PopupContent.\n */\nconst PopupContent = memo(({\n  title,\n  forwardedRef,\n  hide,\n  children,\n  animateVariant,\n  popupStyle,\n  hasHeader = true,\n  hasCloseIcon = true,\n  closeIconURL,\n  ...props\n}: PopupContentProps) => {\n  /**\n   * The ContentRemapped element.\n   *\n   * @type {React.ReactElement[] | React.ReactElement}\n   */\n  const ContentRemapped = children && Array.isArray(children)\n    ? children.filter((child: ReactNode | ReactElement) => !!child)\n      .map((child: ReactElement, index: number) => cloneElement(\n      // eslint-disable-next-line react/no-array-index-key\n        child, { key: index, ...child.props, hide, ...props },\n      ))\n    : <div>Pseudo Content</div>\n\n  return (\n    <div className={`${classes['popup-container']}`} ref={forwardedRef} style={popupStyle}>\n      <LayoutBox\n        className={`${classes['popup-container-inner']}`}\n        style={animateVariant ? styles.popup.inner[animateVariant] : null}\n      >\n        {hasHeader && (\n          <>\n            <LayoutBox justify='space-between' align='start' width='100%' padding='20px 20px 16px 20px'>\n              <H3>{title}</H3>\n              {hasCloseIcon && (\n                <div\n                  onClick={hide}\n                  onKeyDown={hide}\n                  role='button'\n                  tabIndex={-1}\n                  className={classes['close-button']}\n                >\n                  {closeIconURL && <IconBase iconUrl={closeIconURL} />}\n                  {!closeIconURL && (\n                    <IconBase>\n                      {closeIconJSX}\n                    </IconBase>\n                  )}\n                </div>\n              )}\n            </LayoutBox>\n            <DividerLine length='100%' />\n          </>\n        )}\n        <div className={classes['popup-container-inner-div']}>\n          {ContentRemapped && ContentRemapped}\n        </div>\n      </LayoutBox>\n    </div>\n  )\n})\n\n/**\n * The display name of the PopupContent component.\n *\n * @type {string}\n */\nPopupContent.displayName = 'PopupContent'\n"],"names":["styles","popup","inner","PopupAnimateVariant","SLIDE_DOWN","SLIDE_UP","SLIDE_RIGHT","SLIDE_LEFT","Popup","memo","_ref","title","children","components","isModal","hideOnClickOutside","hideOnContentClick","animateVariant","hasHeader","hasCloseIcon","width","height","style","props","_objectWithoutProperties","_excluded","ContentComponent","useMemo","_objectSpread","React","createElement","PopoverLite","_extends","clickable","isPopup","modalOverlayClassName","classesOverlay","PopupContent","popupStyle","displayName","_ref2","forwardedRef","hide","closeIconURL","_excluded2","ContentRemapped","Array","isArray","filter","child","map","index","cloneElement","key","className","concat","classes","ref","LayoutBox","Fragment","justify","align","padding","H3","onClick","onKeyDown","role","tabIndex","IconBase","iconUrl","closeIconJSX","DividerLine","length"],"mappings":"g8BAwBMA,EAKF,CACFC,MAAO,CACLC,MAAO,CACL,CAACC,EAAoBC,YAAa,CAAE,eAAgB,SACpD,CAACD,EAAoBE,UAAW,CAAE,eAAgB,QAClD,CAACF,EAAoBG,aAAc,CAAE,eAAgB,SACrD,CAACH,EAAoBI,YAAa,CAAE,eAAgB,WAW7CC,EAAwBC,EAAIA,MAAaC,IAcpC,IAdqCC,MACrDA,EAAQ,gBAAgBC,SACxBA,EAAQC,WACRA,EAAa,CAAE,EAAAC,QACfA,GAAU,EAAIC,mBACdA,GAAqB,EAAKC,mBAC1BA,GAAqB,EAAKC,eAC1BA,EAAiBd,EAAoBE,SAAQa,UAC7CA,GAAY,EAAIC,aAChBA,GAAe,EAAIC,MACnBA,EAAKC,OACLA,EAAMC,MACNA,GAEWZ,EADRa,EAAKC,EAAAd,EAAAe,GAOR,MAAMC,EAAmBb,aAAAA,EAAAA,EAAYa,iBAO/B1B,EAAS2B,EAAAA,SAAQ,IAAAC,EAAAA,EAAAA,EACjBR,CAAAA,EAAAA,EAAQ,CAAE,gBAAiBA,GAAU,CAAA,GACrCC,EAAS,CAAE,iBAAkBA,GAAW,CAAA,GACzCC,IACD,CAACD,EAAQC,EAAOF,IAEpB,OACES,MAAAC,cAACC,EAAWC,EAAA,CACVC,WAAS,EACTC,SAAO,EACPpB,QAASA,EACTE,mBAAoBA,EACpBD,mBAAoBA,EACpBoB,sBAAuBC,EAAe,wBAClCb,GAEJM,MAAAC,cAAA,IAAA,MACAD,MAAAC,cAACO,EAAY,CACX1B,MAAOA,EACPO,UAAWA,EACXC,aAAcA,EACdF,eAAgBA,EAChBqB,WAAYtC,IAGT0B,GAAoBd,GAAaA,GAEjCA,GAAYc,GAAqBG,MAAAC,cAACJ,EAAkB,OAE7C,IASlBlB,EAAM+B,YAAc,QAmBpB,MAAMF,EAAe5B,EAAIA,MAAC+B,IAWD,IAXE7B,MACzBA,EAAK8B,aACLA,EAAYC,KACZA,EAAI9B,SACJA,EAAQK,eACRA,EAAcqB,WACdA,EAAUpB,UACVA,GAAY,EAAIC,aAChBA,GAAe,EAAIwB,aACnBA,GAEkBH,EADfjB,EAAKC,EAAAgB,EAAAI,GAOR,MAAMC,EAAkBjC,GAAYkC,MAAMC,QAAQnC,GAC9CA,EAASoC,QAAQC,KAAsCA,IACtDC,KAAI,CAACD,EAAqBE,IAAkBC,EAAYA,aAEvDH,EAAKrB,EAAAA,EAAA,CAAIyB,IAAKF,GAAUF,EAAM1B,OAAK,GAAA,CAAEmB,QAASnB,MAEhDM,MAAAC,cAAK,MAAA,KAAA,kBAET,OACED,MAAAC,cAAA,MAAA,CAAKwB,aAASC,OAAKC,EAAQ,oBAAsBC,IAAKhB,EAAcnB,MAAOgB,GACzET,MAAAC,cAAC4B,EAAS,CACRJ,aAASC,OAAKC,EAAQ,0BACtBlC,MAAOL,EAAiBjB,EAAOC,MAAMC,MAAMe,GAAkB,MAE5DC,GACCW,MAAAC,cAAAD,MAAA8B,SACE9B,KAAAA,MAAAC,cAAC4B,EAAS,CAACE,QAAQ,gBAAgBC,MAAM,QAAQzC,MAAM,OAAO0C,QAAQ,uBACpEjC,MAAAC,cAACiC,EAAE,KAAEpD,GACJQ,GACCU,MAAAC,cAAA,MAAA,CACEkC,QAAStB,EACTuB,UAAWvB,EACXwB,KAAK,SACLC,UAAW,EACXb,UAAWE,EAAQ,iBAElBb,GAAgBd,MAAAC,cAACsC,EAAQ,CAACC,QAAS1B,KAClCA,GACAd,MAAAC,cAACsC,OACEE,KAMXzC,MAAAC,cAACyC,EAAW,CAACC,OAAO,UAGxB3C,MAAAC,cAAA,MAAA,CAAKwB,UAAWE,EAAQ,8BACrBX,GAAmBA,IAGpB,IASVR,EAAaE,YAAc"}
+{"version":3,"file":"Popup.js","sources":["../../../../../../../../../src/core/ui/components/molecules/popup/Popup.tsx"],"sourcesContent":["import {\n  cloneElement, memo, PropsWithChildren, FC, ReactNode, CSSProperties, useMemo, ReactElement,\n} from 'react'\n\nimport { Popover as PopoverLite } from '../popover/PopoverLite'\nimport { HeadlineTertiary as H3 } from '../../atoms/text'\nimport { IconBase } from '../../icon'\nimport { DividerLine } from '../../dividers'\nimport { LayoutBox } from '../../container'\nimport { closeIconJSX } from '../../atoms/icons'\n\nimport classes from './popup.module.scss'\nimport classesOverlay from './popup.overlay.module.scss'\nimport { PopupAnimateVariant, PopupProps } from './popup.types'\n\n\n/**\n * Styles for the Popup component.\n *\n * @typedef {Object} PopupStyles\n * @property {Object} inner - The inner styles for the popup.\n * @property {CSSProperties} content - The styles for the popup content.\n */\n\nconst styles: {\n  popup: {\n    inner: Record<string, Record<string, string>>\n  }\n\n} = {\n  popup: {\n    inner: {\n      [PopupAnimateVariant.SLIDE_DOWN]: { '--slideYFrom': '-48px' },\n      [PopupAnimateVariant.SLIDE_UP]: { '--slideYFrom': '48px' },\n      [PopupAnimateVariant.SLIDE_RIGHT]: { '--slideXFrom': '-64px' },\n      [PopupAnimateVariant.SLIDE_LEFT]: { '--slideXFrom': '64px' },\n    },\n  },\n}\n\n/**\n * Popup component.\n *\n * @type {React.FC<PopupProps>}\n * @returns {React.ReactElement} The Popup.\n */\nexport const Popup: FC<PopupProps> = memo<PopupProps>(({\n  title = 'Popup\\'s title',\n  children,\n  components = {},\n  isModal = true,\n  hideOnClickOutside = false,\n  hideOnContentClick = false,\n  animateVariant = PopupAnimateVariant.SLIDE_UP,\n  hasHeader = true,\n  hasCloseIcon = true,\n  width,\n  height,\n  style,\n  ...props\n}: PopupProps) => {\n  /**\n   * The ContentComponent to render.\n   *\n   * @type {ComponentType}\n   */\n  const ContentComponent = components?.ContentComponent\n\n  /**\n   * The popup styles.\n   *\n   * @type {CSSProperties}\n   */\n  const styles = useMemo(() => ({\n    ...(width ? { '--popup-width': width } : {}),\n    ...(height ? { '--popup-height': height } : {}),\n    ...style,\n  }), [height, style, width])\n\n  return (\n    <PopoverLite\n      clickable\n      isPopup\n      isModal={isModal}\n      hideOnContentClick={hideOnContentClick}\n      hideOnClickOutside={hideOnClickOutside}\n      modalOverlayClassName={classesOverlay['popup-modal-overlay']}\n      {...props}\n    >\n      <p>{/* Placeholder element to avoid error with no children */}</p>\n      <PopupContent\n        title={title}\n        hasHeader={hasHeader}\n        hasCloseIcon={hasCloseIcon}\n        animateVariant={animateVariant}\n        popupStyle={styles}\n      >\n        {/* Render children if ContentComponent is not provided */}\n        {(!ContentComponent && children) && children}\n        {/* Render ContentComponent if children are not provided */}\n        {(!children && ContentComponent) && <ContentComponent />}\n      </PopupContent>\n    </PopoverLite>\n  )\n})\n\n/**\n * The display name of the Popup component.\n *\n * @type {string}\n */\nPopup.displayName = 'Popup'\n\ntype PopupContentProps = PropsWithChildren<unknown> & {\n  title?: string\n  forwardedRef?: ForwardedRef['forwardedRef']\n  animateVariant?: PopupProps['animateVariant']\n  popupStyle?: CSSProperties\n  hasHeader?: boolean\n  hasCloseIcon?: boolean\n  closeIconURL?: string\n  hide?: () => void\n}\n\n/**\n * The PopupContent component.\n *\n * @param {PopupContentProps} props The props for the PopupContent component.\n * @returns {React.ReactElement} The PopupContent.\n */\nconst PopupContent = memo(({\n  title,\n  forwardedRef,\n  hide,\n  children,\n  animateVariant,\n  popupStyle,\n  hasHeader = true,\n  hasCloseIcon = true,\n  closeIconURL,\n  ...props\n}: PopupContentProps) => {\n  /**\n   * The ContentRemapped element.\n   *\n   * @type {React.ReactElement[] | React.ReactElement}\n   */\n  const ContentRemapped = children && Array.isArray(children)\n    ? children.filter((child: ReactNode | ReactElement) => !!child)\n      .map((child: ReactElement, index: number) => cloneElement(\n      // eslint-disable-next-line react/no-array-index-key\n        child, { key: index, ...child.props, hide, ...props },\n      ))\n    : <div>Pseudo Content</div>\n\n  return (\n    <div className={`${classes['popup-container']}`} ref={forwardedRef} style={popupStyle}>\n      <LayoutBox\n        className={`${classes['popup-container-inner']}`}\n        style={animateVariant ? styles.popup.inner[animateVariant] : null}\n      >\n        {hasHeader && (\n          <>\n            <LayoutBox justify='space-between' align='start' width='100%' padding='20px 20px 16px 20px'>\n              <H3>{title}</H3>\n              {hasCloseIcon && (\n                <div\n                  onClick={hide}\n                  onKeyDown={hide}\n                  role='button'\n                  tabIndex={-1}\n                  className={classes['close-button']}\n                >\n                  {closeIconURL && <IconBase iconUrl={closeIconURL} />}\n                  {!closeIconURL && (\n                    <IconBase>\n                      {closeIconJSX}\n                    </IconBase>\n                  )}\n                </div>\n              )}\n            </LayoutBox>\n            <DividerLine length='100%' />\n          </>\n        )}\n        <div className={classes['popup-container-inner-div']}>\n          {ContentRemapped && ContentRemapped}\n        </div>\n      </LayoutBox>\n    </div>\n  )\n})\n\n/**\n * The display name of the PopupContent component.\n *\n * @type {string}\n */\nPopupContent.displayName = 'PopupContent'\n"],"names":["styles","popup","inner","PopupAnimateVariant","SLIDE_DOWN","SLIDE_UP","SLIDE_RIGHT","SLIDE_LEFT","Popup","memo","_ref","title","children","components","isModal","hideOnClickOutside","hideOnContentClick","animateVariant","hasHeader","hasCloseIcon","width","height","style","props","_objectWithoutProperties","_excluded","ContentComponent","useMemo","_objectSpread","React","createElement","PopoverLite","_extends","clickable","isPopup","modalOverlayClassName","classesOverlay","PopupContent","popupStyle","displayName","_ref2","forwardedRef","hide","closeIconURL","_excluded2","ContentRemapped","Array","isArray","filter","child","map","index","cloneElement","key","className","concat","classes","ref","LayoutBox","Fragment","justify","align","padding","H3","onClick","onKeyDown","role","tabIndex","IconBase","iconUrl","closeIconJSX","DividerLine","length"],"mappings":"07BAwBMA,EAKF,CACFC,MAAO,CACLC,MAAO,CACL,CAACC,EAAoBC,YAAa,CAAE,eAAgB,SACpD,CAACD,EAAoBE,UAAW,CAAE,eAAgB,QAClD,CAACF,EAAoBG,aAAc,CAAE,eAAgB,SACrD,CAACH,EAAoBI,YAAa,CAAE,eAAgB,WAW7CC,EAAwBC,GAAiBC,IAcpC,IAdqCC,MACrDA,EAAQ,gBAAgBC,SACxBA,EAAQC,WACRA,EAAa,CAAE,EAAAC,QACfA,GAAU,EAAIC,mBACdA,GAAqB,EAAKC,mBAC1BA,GAAqB,EAAKC,eAC1BA,EAAiBd,EAAoBE,SAAQa,UAC7CA,GAAY,EAAIC,aAChBA,GAAe,EAAIC,MACnBA,EAAKC,OACLA,EAAMC,MACNA,GAEWZ,EADRa,EAAKC,EAAAd,EAAAe,GAOR,MAAMC,EAAmBb,aAAAA,EAAAA,EAAYa,iBAO/B1B,EAAS2B,GAAQ,IAAAC,EAAAA,EAAAA,EACjBR,CAAAA,EAAAA,EAAQ,CAAE,gBAAiBA,GAAU,CAAA,GACrCC,EAAS,CAAE,iBAAkBA,GAAW,CAAA,GACzCC,IACD,CAACD,EAAQC,EAAOF,IAEpB,OACES,MAAAC,cAACC,EAAWC,EAAA,CACVC,WAAS,EACTC,SAAO,EACPpB,QAASA,EACTE,mBAAoBA,EACpBD,mBAAoBA,EACpBoB,sBAAuBC,EAAe,wBAClCb,GAEJM,MAAAC,cAAA,IAAA,MACAD,MAAAC,cAACO,EAAY,CACX1B,MAAOA,EACPO,UAAWA,EACXC,aAAcA,EACdF,eAAgBA,EAChBqB,WAAYtC,IAGT0B,GAAoBd,GAAaA,GAEjCA,GAAYc,GAAqBG,MAAAC,cAACJ,EAAkB,OAE7C,IASlBlB,EAAM+B,YAAc,QAmBpB,MAAMF,EAAe5B,GAAK+B,IAWD,IAXE7B,MACzBA,EAAK8B,aACLA,EAAYC,KACZA,EAAI9B,SACJA,EAAQK,eACRA,EAAcqB,WACdA,EAAUpB,UACVA,GAAY,EAAIC,aAChBA,GAAe,EAAIwB,aACnBA,GAEkBH,EADfjB,EAAKC,EAAAgB,EAAAI,GAOR,MAAMC,EAAkBjC,GAAYkC,MAAMC,QAAQnC,GAC9CA,EAASoC,QAAQC,KAAsCA,IACtDC,KAAI,CAACD,EAAqBE,IAAkBC,EAE3CH,EAAKrB,EAAAA,EAAA,CAAIyB,IAAKF,GAAUF,EAAM1B,OAAK,GAAA,CAAEmB,QAASnB,MAEhDM,MAAAC,cAAK,MAAA,KAAA,kBAET,OACED,MAAAC,cAAA,MAAA,CAAKwB,aAASC,OAAKC,EAAQ,oBAAsBC,IAAKhB,EAAcnB,MAAOgB,GACzET,MAAAC,cAAC4B,EAAS,CACRJ,aAASC,OAAKC,EAAQ,0BACtBlC,MAAOL,EAAiBjB,EAAOC,MAAMC,MAAMe,GAAkB,MAE5DC,GACCW,MAAAC,cAAAD,MAAA8B,SACE9B,KAAAA,MAAAC,cAAC4B,EAAS,CAACE,QAAQ,gBAAgBC,MAAM,QAAQzC,MAAM,OAAO0C,QAAQ,uBACpEjC,MAAAC,cAACiC,EAAE,KAAEpD,GACJQ,GACCU,MAAAC,cAAA,MAAA,CACEkC,QAAStB,EACTuB,UAAWvB,EACXwB,KAAK,SACLC,UAAW,EACXb,UAAWE,EAAQ,iBAElBb,GAAgBd,MAAAC,cAACsC,EAAQ,CAACC,QAAS1B,KAClCA,GACAd,MAAAC,cAACsC,OACEE,KAMXzC,MAAAC,cAACyC,EAAW,CAACC,OAAO,UAGxB3C,MAAAC,cAAA,MAAA,CAAKwB,UAAWE,EAAQ,8BACrBX,GAAmBA,IAGpB,IASVR,EAAaE,YAAc"}

package/dist/ui/esm/src/core/utils/helpers/text.js

@@ -1,2 +1,2 @@
-import"../../../../node_modules/core-js/modules/es.regexp.exec.js";import"../../../../node_modules/core-js/modules/es.string.replace.js";const e=e=>{var o;return null==e||null===(o=e.toLowerCase)||void 0===o||null===(o=o.call(e))||void 0===o?void 0:o.replace(/\s+/g,"-")};export{e as composeId};
+import"../../../../node_modules/core-js/modules/es.regexp.exec.js";import"../../../../node_modules/core-js/modules/es.string.replace.js";import"sanitize-html";const e=e=>{var o;return null==e||null===(o=e.toLowerCase)||void 0===o||null===(o=o.call(e))||void 0===o?void 0:o.replace(/\s+/g,"-")};export{e as composeId};
 //# sourceMappingURL=text.js.map

package/dist/ui/esm/src/core/utils/helpers/text.js.map

@@ -1 +1 @@
-{"version":3,"file":"text.js","sources":["../../../../../../../src/core/utils/helpers/text.ts"],"sourcesContent":["import _sanitize from 'sanitize-html'\n\nexport const defaultSanitizeConfig = {\n  allowedTags: ['b', 'i', 'em', 'strong', 'a', 'p', 'span', 'li', 'ul', 'div', 'h1', 'h2', 'h3', 'h4', 'img'],\n  allowedAttributes: {\n    a: ['href', 'target', 'style', 'class', 'onclick'],\n    '*': ['href', 'target', 'style', 'align', 'alt', 'center', 'bgcolor', 'style', 'src'],\n  },\n}\n\nexport const sanitizeHtml\n  = (\n    text: string,\n    sanitizeConfig?: typeof defaultSanitizeConfig,\n  ): ReturnType<typeof _sanitize> => _sanitize(text, sanitizeConfig || defaultSanitizeConfig)\n\nexport const composeId = (text: string): string => text?.toLowerCase?.()?.replace(/\\s+/g, '-')\n"],"names":["composeId","text","_text$toLowerCase","toLowerCase","call","replace"],"mappings":"yIAgBO,MAAMA,EAAaC,IAAY,IAAAC,EAAA,OAAaD,SAAiB,QAAbC,EAAJD,EAAME,mBAAW,IAAAD,GAAI,QAAJA,EAAjBA,EAAAE,KAAAH,UAAqB,IAAAC,OAAA,EAArBA,EAAuBG,QAAQ,OAAQ,IAAI"}
+{"version":3,"file":"text.js","sources":["../../../../../../../src/core/utils/helpers/text.ts"],"sourcesContent":["import _sanitize from 'sanitize-html'\n\nexport const defaultSanitizeConfig = {\n  allowedTags: ['b', 'i', 'em', 'strong', 'a', 'p', 'span', 'li', 'ul', 'div', 'h1', 'h2', 'h3', 'h4', 'img'],\n  allowedAttributes: {\n    a: ['href', 'target', 'style', 'class', 'onclick'],\n    '*': ['href', 'target', 'style', 'align', 'alt', 'center', 'bgcolor', 'style', 'src'],\n  },\n}\n\nexport const sanitizeHtml\n  = (\n    text: string,\n    sanitizeConfig?: typeof defaultSanitizeConfig,\n  ): ReturnType<typeof _sanitize> => _sanitize(text, sanitizeConfig || defaultSanitizeConfig)\n\nexport const composeId = (text: string): string => text?.toLowerCase?.()?.replace(/\\s+/g, '-')\n"],"names":["composeId","text","_text$toLowerCase","toLowerCase","call","replace"],"mappings":"+JAgBO,MAAMA,EAAaC,IAAY,IAAAC,EAAA,OAAaD,SAAiB,QAAbC,EAAJD,EAAME,mBAAW,IAAAD,GAAI,QAAJA,EAAjBA,EAAAE,KAAAH,UAAqB,IAAAC,OAAA,EAArBA,EAAuBG,QAAQ,OAAQ,IAAI"}

package/dist/ui/src/core/hooks/useClassNames.js

@@ -1,2 +1,2 @@
-"use strict";require("../../../node_modules/core-js/modules/web.dom-collections.iterator.js");var e=require("../../../node_modules/react/index.js"),s=require("../utils/helpers/ui.js");exports.useClassNames=(r,o)=>e.reactExports.useMemo((()=>s.classNames(...r)),[r,o]);
+"use strict";require("../../../node_modules/core-js/modules/web.dom-collections.iterator.js");var e=require("react"),s=require("../utils/helpers/ui.js");exports.useClassNames=(r,o)=>e.useMemo((()=>s.classNames(...r)),[r,o]);
 //# sourceMappingURL=useClassNames.js.map

package/dist/ui/src/core/hooks/useClassNames.js.map

@@ -1 +1 @@
-{"version":3,"file":"useClassNames.js","sources":["../../../../../src/core/hooks/useClassNames.ts"],"sourcesContent":["import { useMemo } from 'react'\n\nimport { classNames, TClassName } from '../utils/helpers/ui'\n\n\n/**\n * Custom hook to memoize class names.\n * @param {TClassName[]} classes - Array of class names or conditions to be applied.\n * @param {unknown[]} deps - Dependencies array for the `useMemo` hook.\n * @returns {ReturnType<typeof classNames>} The computed class names as a string.\n */\nexport const useClassNames = (\n  classes: TClassName[],\n  deps: unknown[],\n// eslint-disable-next-line react-hooks/exhaustive-deps\n): ReturnType<typeof classNames> => useMemo(() => classNames(...classes), [classes, deps])\n"],"names":["useClassNames","classes","deps","useMemo","reactExports","classNames"],"mappings":"8MAW6BA,CAC3BC,EACAC,IAEkCC,EAAOC,aAAAD,SAAC,IAAME,EAAAA,cAAcJ,IAAU,CAACA,EAASC"}
+{"version":3,"file":"useClassNames.js","sources":["../../../../../src/core/hooks/useClassNames.ts"],"sourcesContent":["import { useMemo } from 'react'\n\nimport { classNames, TClassName } from '../utils/helpers/ui'\n\n\n/**\n * Custom hook to memoize class names.\n * @param {TClassName[]} classes - Array of class names or conditions to be applied.\n * @param {unknown[]} deps - Dependencies array for the `useMemo` hook.\n * @returns {ReturnType<typeof classNames>} The computed class names as a string.\n */\nexport const useClassNames = (\n  classes: TClassName[],\n  deps: unknown[],\n// eslint-disable-next-line react-hooks/exhaustive-deps\n): ReturnType<typeof classNames> => useMemo(() => classNames(...classes), [classes, deps])\n"],"names":["useClassNames","classes","deps","useMemo","classNames"],"mappings":"+KAW6BA,CAC3BC,EACAC,IAEkCC,EAAOA,SAAC,IAAMC,EAAAA,cAAcH,IAAU,CAACA,EAASC"}

package/dist/ui/src/core/hooks/useOutsideClick.js

@@ -1,2 +1,2 @@
-"use strict";require("../../../node_modules/react/index.js");var e=require("../constants/ui.constants.js"),t=require("../ui/utils/clickOutside.js");exports.outsideClickHandler=function(i,n){let s=arguments.length>2&&void 0!==arguments[2]?arguments[2]:t.handleClickOutside(i,n);return document.addEventListener(e.EventName.Click,s),()=>document.removeEventListener(e.EventName.Click,s)};
+"use strict";require("react");var e=require("../constants/ui.constants.js"),t=require("../ui/utils/clickOutside.js");exports.outsideClickHandler=function(i,n){let r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:t.handleClickOutside(i,n);return document.addEventListener(e.EventName.Click,r),()=>document.removeEventListener(e.EventName.Click,r)};
 //# sourceMappingURL=useOutsideClick.js.map

package/dist/ui/src/core/hooks/useOutsideClick.js.map

@@ -1 +1 @@
-{"version":3,"file":"useOutsideClick.js","sources":["../../../../../src/core/hooks/useOutsideClick.ts"],"sourcesContent":["import { useEffect, useCallback } from 'react'\n\nimport { EventName } from '../constants/ui.constants'\nimport { handleClickOutside as defaultHandleClickOutside } from '../ui/utils/clickOutside'\n\ntype Element = HTMLElement | null | (() => HTMLElement)\ntype CallbackFunction = (target: HTMLElement | null) => void\n\n/**\n * Custom hook to handle clicks outside a specified element.\n * @param {Element} element - The element to detect outside clicks for.\n * @param {CallbackFunction} [callback] - Optional callback function to execute when an outside click is detected.\n * @param {Function} [handleClickOutside=defaultHandleClickOutside] - Optional custom function to handle outside clicks.\n * @returns {() => void} Function to unsubscribe the event listener.\n */\nexport function useOutsideClick(\n  element: Element,\n  callback?: CallbackFunction,\n  handleClickOutside = defaultHandleClickOutside(element, callback),\n): () => void {\n  const unsubscriber = useCallback(\n    () => document.removeEventListener(EventName.Click, handleClickOutside), [handleClickOutside],\n  )\n\n  useEffect(() => {\n    unsubscriber()\n    document.addEventListener(EventName.Click, handleClickOutside)\n\n    return unsubscriber\n  }, [element, handleClickOutside, unsubscriber])\n\n  return unsubscriber\n}\n\n/**\n * Function to handle clicks outside a specified element.\n * @param {Element} element - The element to detect outside clicks for.\n * @param {CallbackFunction} [callback] - Optional callback function to execute when an outside click is detected.\n * @param {Function} [handleClickOutside=defaultHandleClickOutside] - Optional custom function to handle outside clicks.\n * @returns {() => void} Function to unsubscribe the event listener.\n */\nexport function outsideClickHandler(\n  element: Element,\n  callback?: CallbackFunction,\n  handleClickOutside = defaultHandleClickOutside(element, callback),\n): () => void {\n  const unsubscriber = (): void => document.removeEventListener(EventName.Click, handleClickOutside)\n\n  document.addEventListener(EventName.Click, handleClickOutside)\n\n  return unsubscriber\n}\n"],"names":["element","callback","handleClickOutside","arguments","length","undefined","defaultHandleClickOutside","document","addEventListener","EventName","Click","unsubscriber","removeEventListener"],"mappings":"gLAyCO,SACLA,EACAC,GAEY,IADZC,EAAkBC,UAAAC,eAAAC,IAAAF,UAAA,GAAAA,UAAGG,GAAAA,EAAAA,mBAA0BN,EAASC,GAMxD,OAFAM,SAASC,iBAAiBC,YAAUC,MAAOR,GAFtBS,IAAYJ,SAASK,oBAAoBH,EAASA,UAACC,MAAOR,EAKjF"}
+{"version":3,"file":"useOutsideClick.js","sources":["../../../../../src/core/hooks/useOutsideClick.ts"],"sourcesContent":["import { useEffect, useCallback } from 'react'\n\nimport { EventName } from '../constants/ui.constants'\nimport { handleClickOutside as defaultHandleClickOutside } from '../ui/utils/clickOutside'\n\ntype Element = HTMLElement | null | (() => HTMLElement)\ntype CallbackFunction = (target: HTMLElement | null) => void\n\n/**\n * Custom hook to handle clicks outside a specified element.\n * @param {Element} element - The element to detect outside clicks for.\n * @param {CallbackFunction} [callback] - Optional callback function to execute when an outside click is detected.\n * @param {Function} [handleClickOutside=defaultHandleClickOutside] - Optional custom function to handle outside clicks.\n * @returns {() => void} Function to unsubscribe the event listener.\n */\nexport function useOutsideClick(\n  element: Element,\n  callback?: CallbackFunction,\n  handleClickOutside = defaultHandleClickOutside(element, callback),\n): () => void {\n  const unsubscriber = useCallback(\n    () => document.removeEventListener(EventName.Click, handleClickOutside), [handleClickOutside],\n  )\n\n  useEffect(() => {\n    unsubscriber()\n    document.addEventListener(EventName.Click, handleClickOutside)\n\n    return unsubscriber\n  }, [element, handleClickOutside, unsubscriber])\n\n  return unsubscriber\n}\n\n/**\n * Function to handle clicks outside a specified element.\n * @param {Element} element - The element to detect outside clicks for.\n * @param {CallbackFunction} [callback] - Optional callback function to execute when an outside click is detected.\n * @param {Function} [handleClickOutside=defaultHandleClickOutside] - Optional custom function to handle outside clicks.\n * @returns {() => void} Function to unsubscribe the event listener.\n */\nexport function outsideClickHandler(\n  element: Element,\n  callback?: CallbackFunction,\n  handleClickOutside = defaultHandleClickOutside(element, callback),\n): () => void {\n  const unsubscriber = (): void => document.removeEventListener(EventName.Click, handleClickOutside)\n\n  document.addEventListener(EventName.Click, handleClickOutside)\n\n  return unsubscriber\n}\n"],"names":["element","callback","handleClickOutside","arguments","length","undefined","defaultHandleClickOutside","document","addEventListener","EventName","Click","unsubscriber","removeEventListener"],"mappings":"iJAyCO,SACLA,EACAC,GAEY,IADZC,EAAkBC,UAAAC,eAAAC,IAAAF,UAAA,GAAAA,UAAGG,GAAAA,EAAAA,mBAA0BN,EAASC,GAMxD,OAFAM,SAASC,iBAAiBC,YAAUC,MAAOR,GAFtBS,IAAYJ,SAASK,oBAAoBH,EAASA,UAACC,MAAOR,EAKjF"}