npm - @e1011/es-kit - Versions diffs - 1.1.72 → 1.1.74 - Mend

@e1011/es-kit 1.1.72 → 1.1.74

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (2420) hide show

package/dist/lib/cjs/src/core/ui/components/error/ErrorBoundary.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ErrorBoundary.js","sources":["../../../../../../../../src/core/ui/components/error/ErrorBoundary.tsx"],"sourcesContent":["import { FC, memo, PureComponent, ReactNode } from 'react'\n\nimport { IconBase } from '../icon'\nimport { LayoutBox } from '../container/layoutBox/LayoutBox'\n\nimport classes from './errorBoundary.module.scss'\nimport { DefaultErrorComponentProps, ErrorBoundaryProps } from './errorBoundary.types'\n\n\ninterface State {\n error?: Error\n errorInfo?: unknown\n hasError: boolean\n}\n\n\nexport const DefaultErrorComponent: FC<DefaultErrorComponentProps>\n= memo(({ title, text }: DefaultErrorComponentProps) => (\n <LayoutBox className={classes.errorBoundary} direction='column' flexWrap='wrap' gap='2rem' padding='1rem'>\n {title && <h1>{title}</h1>}\n <LayoutBox align='center' justify='space-between' gap='1rem'>\n <IconBase\n className={classes.StyledIcon}\n color='#FF0000'\n width='3rem'\n height='3rem'\n >\n <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'>\n <path d='M506.3 417l-213.3-364c-16.33-28-57.54-28-73.98 0l-213.2 364C-10.59 444.9 9.849 480 42.74 480h426.6C502.1 480 522.6 445 506.3 417zM232 168c0-13.25 10.75-24 24-24S280 154.8 280 168v128c0 13.25-10.75 24-23.1 24S232 309.3 232 296V168zM256 416c-17.36 0-31.44-14.08-31.44-31.44c0-17.36 14.07-31.44 31.44-31.44s31.44 14.08 31.44 31.44C287.4 401.9 273.4 416 256 416z' />\n </svg>\n </IconBase>\n {text && (\n <LayoutBox flexShrink='0' width='90%'>\n {text}\n </LayoutBox>\n )}\n </LayoutBox>\n </LayoutBox>\n))\nDefaultErrorComponent.displayName = 'DefaultErrorComponent'\n\nexport class ErrorBoundary extends PureComponent<ErrorBoundaryProps, State> {\n constructor(props: ErrorBoundaryProps) {\n super(props)\n this.state = { hasError: false }\n }\n\n static getDerivedStateFromError(error: Error): State {\n return { hasError: true, error }\n }\n\n componentDidCatch(error: Error, errorInfo: React.ErrorInfo): void {\n // eslint-disable-next-line no-console\n !this.props.muted && error && console.error(error)\n // eslint-disable-next-line no-console\n !this.props.muted && errorInfo && console.error(errorInfo)\n\n this.props?.onError?.({ error, errorInfo })\n\n !this.props.muted && this.setState({ hasError: true, error, errorInfo })\n }\n\n render(): ReactNode {\n const { ErrorComponent = DefaultErrorComponent, title, text, muted } = this.props\n const { hasError, error, errorInfo } = this.state\n\n if (hasError && !muted) {\n return (\n <ErrorComponent\n title={title \|\| error?.toString() \|\| 'Error'}\n text={text \|\| `${JSON.stringify(errorInfo, null, 2)}`}\n />\n )\n }\n\n if (hasError && muted) {\n return null\n }\n\n return this.props.children\n }\n}\n"],"names":["DefaultErrorComponent","memo","_ref","title","text","React","createElement","LayoutBox","className","classes","default","errorBoundary","direction","flexWrap","gap","padding","align","justify","IconBase","StyledIcon","color","width","height","xmlns","viewBox","d","flexShrink","displayName","ErrorBoundary","PureComponent","constructor","props","super","this","state","hasError","getDerivedStateFromError","error","componentDidCatch","errorInfo","muted","onError","setState","render","ErrorComponent","toString","JSON","stringify","children"],"mappings":"kKAgBaA,MAAAA,EACXC,EAAIA,MAACC,IAAA,IAACC,MAAEA,EAAKC,KAAEA,GAAkCF,EAAA,OACjDG,MAAAC,cAACC,YAAS,CAACC,UAAWC,EAAOC,QAACC,cAAeC,UAAU,SAASC,SAAS,OAAOC,IAAI,OAAOC,QAAQ,QAChGZ,GAASE,MAAAC,cAAA,KAAA,KAAKH,GACfE,MAAAC,cAACC,YAAS,CAACS,MAAM,SAASC,QAAQ,gBAAgBH,IAAI,QACpDT,MAAAC,cAACY,WAAQ,CACPV,UAAWC,EAAOC,QAACS,WACnBC,MAAM,UACNC,MAAM,OACNC,OAAO,QAEPjB,MAAAC,cAAA,MAAA,CAAKiB,MAAM,6BAA6BC,QAAQ,eAC9CnB,MAAAC,cAAA,OAAA,CAAMmB,EAAE,6WAGXrB,GACCC,MAAAC,cAACC,EAAAA,UAAS,CAACmB,WAAW,IAAIL,MAAM,OAC7BjB,IAIG,IAEdJ,EAAsB2B,YAAc,wBAE7B,MAAMC,UAAsBC,EAAAA,cACjCC,WAAAA,CAAYC,GACVC,MAAMD,GACNE,KAAKC,MAAQ,CAAEC,UAAU,EAC3B,CAEA,+BAAOC,CAAyBC,GAC9B,MAAO,CAAEF,UAAU,EAAME,QAC3B,CAEAC,iBAAAA,CAAkBD,EAAcE,~~GAE7BN~~,~~KAAKF~~,~~MAAMS~~,~~MAEXP~~,KAAKF,~~MAAMS~~,~~MAEZP~~,KAAKF,~~OAAOU~~,~~UAAU~~,~~CAAEJ~~,QAAOE,eAE9BN,KAAKF,~~MAAMS~~,~~OAASP~~,~~KAAKS~~,SAAS,~~CAAEP~~,UAAU,EAAME,QAAOE,aAC9D,~~CAEAI~~,MAAAA,GACE,MAAMC,eAAEA,~~EAAiB5C~~,EAAqBG,MAAEA,EAAKC,KAAEA,~~EAAIoC~~,MAAEA,~~GAAUP~~,KAAKF,OACtEI,SAAEA,EAAQE,MAAEA,EAAKE,UAAEA,GAAcN,KAAKC,MAE5C,OAAIC,~~IAAaK~~,~~EAEbnC~~,MAAAC,~~cAACsC~~,EAAc,~~CACbzC~~,MAAOA,~~GAASkC~~,~~GAAOQ~~,~~YAAc~~,~~QACrCzC~~,KAAMA,~~GAAQ~~,~~GAAG0C~~,KAAKC,~~UAAUR~~,EAAW,KAAM,~~OAKnDJ~~,~~GAAYK~~,EACP,~~KAGFP~~,KAAKF,~~MAAMiB~~,QACpB"}
1	+ {"version":3,"file":"ErrorBoundary.js","sources":["../../../../../../../../src/core/ui/components/error/ErrorBoundary.tsx"],"sourcesContent":["import { FC, memo, PureComponent, ReactNode } from 'react'\n\nimport { IconBase } from '../icon'\nimport { LayoutBox } from '../container/layoutBox/LayoutBox'\n\nimport classes from './errorBoundary.module.scss'\nimport { DefaultErrorComponentProps, ErrorBoundaryProps } from './errorBoundary.types'\n\n\ninterface State {\n error?: Error\n errorInfo?: unknown\n hasError: boolean\n}\n\n\nexport const DefaultErrorComponent: FC<DefaultErrorComponentProps>\n= memo(({ title, text }: DefaultErrorComponentProps) => (\n <LayoutBox className={classes.errorBoundary} direction='column' flexWrap='wrap' gap='2rem' padding='1rem'>\n {title && <h1>{title}</h1>}\n <LayoutBox align='center' justify='space-between' gap='1rem'>\n <IconBase\n className={classes.StyledIcon}\n color='#FF0000'\n width='3rem'\n height='3rem'\n >\n <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'>\n <path d='M506.3 417l-213.3-364c-16.33-28-57.54-28-73.98 0l-213.2 364C-10.59 444.9 9.849 480 42.74 480h426.6C502.1 480 522.6 445 506.3 417zM232 168c0-13.25 10.75-24 24-24S280 154.8 280 168v128c0 13.25-10.75 24-23.1 24S232 309.3 232 296V168zM256 416c-17.36 0-31.44-14.08-31.44-31.44c0-17.36 14.07-31.44 31.44-31.44s31.44 14.08 31.44 31.44C287.4 401.9 273.4 416 256 416z' />\n </svg>\n </IconBase>\n {text && (\n <LayoutBox flexShrink='0' width='90%'>\n {text}\n </LayoutBox>\n )}\n </LayoutBox>\n </LayoutBox>\n))\nDefaultErrorComponent.displayName = 'DefaultErrorComponent'\n\nexport class ErrorBoundary extends PureComponent<ErrorBoundaryProps, State> {\n constructor(props: ErrorBoundaryProps) {\n super(props)\n this.state = { hasError: false }\n }\n\n static getDerivedStateFromError(error: Error): State {\n return { hasError: true, error }\n }\n\n componentDidCatch(error: Error, errorInfo: React.ErrorInfo): void {\n // eslint-disable-next-line no-console\n !this.props.muted && error && console.error(error)\n // eslint-disable-next-line no-console\n !this.props.muted && errorInfo && console.error(errorInfo)\n\n this.props?.onError?.({ error, errorInfo })\n\n !this.props.muted && this.setState({ hasError: true, error, errorInfo })\n }\n\n render(): ReactNode {\n const { ErrorComponent = DefaultErrorComponent, title, text, muted } = this.props\n const { hasError, error, errorInfo } = this.state\n\n if (hasError && !muted) {\n return (\n <ErrorComponent\n title={title \|\| error?.toString() \|\| 'Error'}\n text={text \|\| `${JSON.stringify(errorInfo, null, 2)}`}\n />\n )\n }\n\n if (hasError && muted) {\n return null\n }\n\n return this.props.children\n }\n}\n"],"names":["DefaultErrorComponent","memo","_ref","title","text","React","createElement","LayoutBox","className","classes","default","errorBoundary","direction","flexWrap","gap","padding","align","justify","IconBase","StyledIcon","color","width","height","xmlns","viewBox","d","flexShrink","displayName","ErrorBoundary","PureComponent","constructor","props","super","this","state","hasError","getDerivedStateFromError","error","componentDidCatch","errorInfo","_this$props","_this$props$onError","muted","onError","call","setState","render","ErrorComponent","toString","concat","JSON","stringify","children"],"mappings":"kKAgBaA,MAAAA,EACXC,EAAIA,MAACC,IAAA,IAACC,MAAEA,EAAKC,KAAEA,GAAkCF,EAAA,OACjDG,MAAAC,cAACC,YAAS,CAACC,UAAWC,EAAOC,QAACC,cAAeC,UAAU,SAASC,SAAS,OAAOC,IAAI,OAAOC,QAAQ,QAChGZ,GAASE,MAAAC,cAAA,KAAA,KAAKH,GACfE,MAAAC,cAACC,YAAS,CAACS,MAAM,SAASC,QAAQ,gBAAgBH,IAAI,QACpDT,MAAAC,cAACY,WAAQ,CACPV,UAAWC,EAAOC,QAACS,WACnBC,MAAM,UACNC,MAAM,OACNC,OAAO,QAEPjB,MAAAC,cAAA,MAAA,CAAKiB,MAAM,6BAA6BC,QAAQ,eAC9CnB,MAAAC,cAAA,OAAA,CAAMmB,EAAE,6WAGXrB,GACCC,MAAAC,cAACC,EAAAA,UAAS,CAACmB,WAAW,IAAIL,MAAM,OAC7BjB,IAIG,IAEdJ,EAAsB2B,YAAc,wBAE7B,MAAMC,UAAsBC,EAAAA,cACjCC,WAAAA,CAAYC,GACVC,MAAMD,GACNE,KAAKC,MAAQ,CAAEC,UAAU,EAC3B,CAEA,+BAAOC,CAAyBC,GAC9B,MAAO,CAAEF,UAAU,EAAME,QAC3B,CAEAC,iBAAAA,CAAkBD,EAAcE,GAAkC,IAAAC,EAAAC,EAE/DR,KAAKF,MAAMW,MAEXT,KAAKF,MAAMW,cAEZF,OAAKT,aAAK,IAAAS,GAAS,QAATC,EAAVD,EAAYG,eAAZF,IAAmBA,GAAnBA,EAAAG,KAAAJ,EAAsB,CAAEH,QAAOE,eAE9BN,KAAKF,MAAMW,OAAST,KAAKY,SAAS,CAAEV,UAAU,EAAME,QAAOE,aAC9D,CAEAO,MAAAA,GACE,MAAMC,eAAEA,EAAiB/C,EAAqBG,MAAEA,EAAKC,KAAEA,EAAIsC,MAAEA,GAAUT,KAAKF,OACtEI,SAAEA,EAAQE,MAAEA,EAAKE,UAAEA,GAAcN,KAAKC,MAE5C,OAAIC,IAAaO,EAEbrC,MAAAC,cAACyC,EAAc,CACb5C,MAAOA,IAASkC,aAAAA,EAAAA,EAAOW,aAAc,QACrC5C,KAAMA,GAAI6C,GAAAA,OAAOC,KAAKC,UAAUZ,EAAW,KAAM,MAKnDJ,GAAYO,EACP,KAGFT,KAAKF,MAAMqB,QACpB"}

package/dist/lib/cjs/src/core/ui/components/field/Field.js CHANGED Viewed

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

package/dist/lib/cjs/src/core/ui/components/field/Field.js.map CHANGED Viewed

	@@ -1 +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","IconComponent","memo","React","createElement","setIconComponent","Select","_ref","options","value","inputRef","props","className","_extends","ref","defaultValue","map","option","key","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","Component","handleFocus","useCallback","event","preventDefault","handleChange","target","valueProps","useMemo","undefined","classNames","classes","default","field","htmlFor","id","onKeyDown","autoComplete","onClick","iconName","color","component"],"mappings":"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"}
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","IconComponent","memo","React","createElement","setIconComponent","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","color","component"],"mappings":"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"}

package/dist/lib/cjs/src/core/ui/components/icon/Icon.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";const e=require("react").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-${a.iconName} ${c}`,role:"img",xmlns:"http://www.w3.org/2000/svg",viewBox:`0 0 ${a.icon[0]} ${a.icon[1]}`},React.createElement("path",{fill:o,d:a.icon[4]}))}));e.displayName="Icon",exports.Icon=e;
+"use strict";const e=require("react").memo((e=>{let{icon:c,className:a,color:o="currentColor"}=e;return React.createElement("svg",{"aria-hidden":"true",focusable:"false","data-prefix":c.prefix,"data-icon":c.iconName,className:"svg-inline--fa fa-".concat(c.iconName," ").concat(a),role:"img",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 ".concat(c.icon[0]," ").concat(c.icon[1])},React.createElement("path",{fill:o,d:c.icon[4]}))}));e.displayName="Icon",exports.Icon=e;
 //# sourceMappingURL=Icon.js.map

package/dist/lib/cjs/src/core/ui/components/icon/Icon.js.map CHANGED Viewed

	@@ -1 +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","role","xmlns","viewBox","fill","d","displayName"],"mappings":"aAYaA,MAAAA,mBAAWC,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,~~UAAW~~,~~qBAAqBD~~,EAAKO,~~YAAYN~~,~~IACjDO~~,KAAK,MACLC,MAAM,6BACNC,~~QAAS~~,~~OAAOV~~,EAAKA,KAAK,~~MAAMA~~,EAAKA,KAAK,~~MAE1CG~~,MAAAC,cAAA,OAAA,~~CACEO~~,~~KAAMT~~,~~EACNU~~,~~EAAGZ~~,EAAKA,KAAK,KAEX,IAGRH,~~EAAKgB~~,YAAc"}
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":"aAYaA,MAAAA,mBAAWC,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"}

package/dist/lib/cjs/src/core/ui/components/icon/IconBase.js CHANGED Viewed

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

package/dist/lib/cjs/src/core/ui/components/icon/IconBase.js.map CHANGED Viewed

	@@ -1 +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","unifiedIconUrl","unifyIconUrl","styles","useMemo","cursor","onClickProps","role","tabIndex","React","createElement","_extends","extends","classes","default","displayName"],"mappings":"~~8KAsBaA~~,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,~~KAAYC~~,~~GACtFd~~,~~EACd~~,~~MAAMe~~,~~EAAiBd~~,~~GAAWe~~,EAAYA,~~aAACf~~,~~GAEzCgB~~,EAASC,EAAAA,SAAQ,~~KACrB~~,~~CACE~~,~~cAAehB~~,GAAYE,GAAQE,GAAS,OAC5C,eAAgBH,GAAaC,GAAQG,GAAU,OAC/C,UAAWH,GAAQE,GAAS,OAC5B,WAAYF,GAAQG,GAAU,~~UAC1BF~~,EAAW,CAAEA,YAAa,~~MAC1BU~~,EAAiB,CAAE,~~aAAc~~,~~OAAOA~~,~~MAAsB~~,~~MAC9DA~~,EAAiB,CAAE,~~eAAgBP~~,GAAU,CAAE,uBAAwBA,~~MACvEK~~,EAAU,~~CAAEM~~,OAAQ,WAAc,~~MACnCP~~,~~KAEJ~~,CAACV,EAAUE,EAAME,EAAOH,EAAWI,EAAQF,~~EAAUU~~,~~EAAgBP~~,EAAOK,EAASD,~~IAElFQ~~,~~EAAeF~~,WAAQ,~~IAAOL~~,EAAW,CAC7CA,~~UACAQ~~,KAAM,SACNC,UAAW,GACR,CAAG,GAAE,~~CAACT~~,IAEX,~~OACEU~~,MAAAC,cAAA,OAAAC,EAAAC,~~QACMZ~~,CAAAA,EAAAA,~~EACAM~~,EAAY,~~CAChBX~~,~~UAAW~~,~~GAAGkB~~,EAAOC,QAAC,~~0BAA0BnB~~,~~IAChDG~~,~~MAAOK~~,KAEJF,~~GAAkBL~~,GAAaA,GAC/BK,~~GAAkBJ~~,GAASA,EACzB,IAIXb,~~EAAS+B~~,YAAc"}
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","objectSpread2","concat","cursor","onClickProps","role","tabIndex","React","createElement","_extends","extends","classes","default","displayName"],"mappings":"8SAsBaA,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,EAAAA,wBAAAf,EAAAgB,GAEzG,MAAMC,EAAiBhB,GAAWiB,EAAYA,aAACjB,GAEzCkB,EAASC,EAAAA,SAAQ,IAAAC,EAAAA,cAAAA,EAAAA,cAAAA,EAAAC,cAAAD,EAAAC,cAAAD,gBAAA,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,OAAAM,OAASN,EAAc,MAAQ,CAAA,GAC9DA,EAAiB,CAAE,eAAgBT,GAAU,CAAE,uBAAwBA,IACvEK,EAAU,CAAEW,OAAQ,WAAc,CAAA,GACnCZ,IAEJ,CAACV,EAAUE,EAAME,EAAOH,EAAWI,EAAQF,EAAUY,EAAgBT,EAAOK,EAASD,IAElFa,EAAeL,WAAQ,IAAOP,EAAW,CAC7CA,UACAa,KAAM,SACNC,UAAW,GACR,CAAG,GAAE,CAACd,IAEX,OACEe,MAAAC,cAAA,OAAAC,EAAAC,QACMjB,CAAAA,EAAAA,EACAW,EAAY,CAChBhB,UAAS,GAAAc,OAAKS,EAAOC,QAAC,aAAYV,eAAAA,OAAcd,GAChDG,MAAOO,KAEJF,GAAkBP,GAAaA,GAC/BO,GAAkBN,GAASA,EACzB,IAIXb,EAASoC,YAAc"}

package/dist/lib/cjs/src/core/ui/components/icon/IconWC.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var t,i=require("../../../utils/webComponents/webComponent.utils.js"),e=require("./icon.module.scss.js");const s=document.createElement("template");s.innerHTML='<span class="icon-base"></span>';let n=i.ced("icon-base")(t=class t extends HTMLElement{constructor(){super(...arguments),this.content=void 0,this.mainElement=void 0,this.iconUrl=void 0,this.minWidth=void 0,this.minHeight=void 0,this.width=void 0,this.height=void 0,this.size=void 0,this.fontSize=void 0,this.color=void 0,this.render=()=>{if(this.mainElement=this.mainElement||this.querySelector(".icon-base"),!this.mainElement)return;this.classList.add(e.default["icon-base-parent"]),this.mainElement.classList.add(e.default["icon-base"]);const t={"--min-width":this.minWidth||this.size||this.width||"auto","--min-height":this.minHeight||this.size||this.height||"auto","--width":this.size||this.width||"1rem","--height":this.size||this.height||"1rem",...this.fontSize?{"font-size":this.fontSize||"unset"}:{},...this.iconUrl?{"--icon-url":`url(${this.iconUrl})`}:{},...this.iconUrl?{"--icon-color":this.color}:{"--icon-content-color":this.color}};this.mainElement.innerHTML=this.iconUrl?"":this.content||"",this.mainElement.setAttribute("style",Object.entries(t).map((t=>{let[i,e]=t;return`${i}: ${e};`})).join(" "))}}static get observedAttributes(){return["iconUrl","minWidth","minHeight","width","height","size","fontSize","color","className"]}connectedCallback(){(this.content||this.innerHTML)&&(this.content=this.content||this.innerHTML||this.getAttribute("content")),this.innerHTML=s.innerHTML,i.resolveAttributes(this,t.observedAttributes),this.render()}attributeChangedCallback(t,i,e){"className"!==t&&"classname"!==t&&"class"!==t||"string"==typeof e&&(this.classList.remove(e),this.classList.add(e)),this.color||(this.color="currentColor"),this[t]=e||"",this.render()}})||t;const o={ESIconBase:n};exports.ESIcon=n,exports.ESIconBase=o;
+"use strict";var t=require("../../../../../_virtual/_rollupPluginBabelHelpers.js");require("../../../../../node_modules/core-js/modules/web.dom-collections.iterator.js");var i,e=require("../../../utils/webComponents/webComponent.utils.js"),s=require("./icon.module.scss.js");const n=document.createElement("template");n.innerHTML='<span class="icon-base"></span>';let o=e.ced("icon-base")(i=class i extends HTMLElement{constructor(){super(...arguments),this.content=void 0,this.mainElement=void 0,this.iconUrl=void 0,this.minWidth=void 0,this.minHeight=void 0,this.width=void 0,this.height=void 0,this.size=void 0,this.fontSize=void 0,this.color=void 0,this.render=()=>{if(this.mainElement=this.mainElement||this.querySelector(".icon-base"),!this.mainElement)return;this.classList.add(s.default["icon-base-parent"]),this.mainElement.classList.add(s.default["icon-base"]);const i=t.objectSpread2(t.objectSpread2(t.objectSpread2({"--min-width":this.minWidth||this.size||this.width||"auto","--min-height":this.minHeight||this.size||this.height||"auto","--width":this.size||this.width||"1rem","--height":this.size||this.height||"1rem"},this.fontSize?{"font-size":this.fontSize||"unset"}:{}),this.iconUrl?{"--icon-url":"url(".concat(this.iconUrl,")")}:{}),this.iconUrl?{"--icon-color":this.color}:{"--icon-content-color":this.color});this.mainElement.innerHTML=this.iconUrl?"":this.content||"",this.mainElement.setAttribute("style",Object.entries(i).map((t=>{let[i,e]=t;return"".concat(i,": ").concat(e,";")})).join(" "))}}static get observedAttributes(){return["iconUrl","minWidth","minHeight","width","height","size","fontSize","color","className"]}connectedCallback(){(this.content||this.innerHTML)&&(this.content=this.content||this.innerHTML||this.getAttribute("content")),this.innerHTML=n.innerHTML,e.resolveAttributes(this,i.observedAttributes),this.render()}attributeChangedCallback(t,i,e){"className"!==t&&"classname"!==t&&"class"!==t||"string"==typeof e&&(this.classList.remove(e),this.classList.add(e)),this.color||(this.color="currentColor"),this[t]=e||"",this.render()}})||i;const r={ESIconBase:o};exports.ESIcon=o,exports.ESIconBase=r;
 //# sourceMappingURL=IconWC.js.map

package/dist/lib/cjs/src/core/ui/components/icon/IconWC.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"IconWC.js","sources":["../../../../../../../../src/core/ui/components/icon/IconWC.ts"],"sourcesContent":["import { ced, resolveAttributes } from '../../../utils/webComponents/webComponent.utils'\n\nimport classes from './icon.module.scss'\n\n\nconst template = document.createElement('template')\n\ntemplate.innerHTML = '<span class=\"icon-base\"></span>'\n\nexport type IconBaseWCType = {\n iconUrl?: string\n minWidth?: string\n minHeight?: string\n width?: string\n height?: string\n size?: string\n fontSize?: string\n color?: string\n className?: string\n}\n\n@ced('icon-base')\nexport class ESIcon extends HTMLElement {\n content: string \| null\n\n mainElement: HTMLElement\n\n iconUrl?: string \| null\n\n minWidth?: string \| null\n\n minHeight?: string \| null\n\n width?: string \| null\n\n height?: string \| null\n\n size?: string \| null\n\n fontSize?: string \| null\n\n color?: string \| null\n\n static get observedAttributes(): string[] {\n return ['iconUrl', 'minWidth', 'minHeight', 'width', 'height', 'size', 'fontSize', 'color', 'className']\n }\n\n connectedCallback(): void {\n if (this.content \|\| this.innerHTML) {\n this.content = this.content \|\| this.innerHTML \|\| this.getAttribute('content')\n }\n\n this.innerHTML = template.innerHTML\n\n resolveAttributes(this, ESIcon.observedAttributes)\n\n this.render()\n }\n\n attributeChangedCallback(attrName: string, oldVal: string \| number \| null, newVal: string \| number \| null): void {\n if (attrName === 'className' \|\| attrName === 'classname' \|\| attrName === 'class') {\n if (typeof newVal === 'string') {\n this.classList.remove(newVal as string)\n this.classList.add(newVal as string)\n }\n }\n if (!this.color) {\n this.color = 'currentColor'\n }\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n this[attrName] = (newVal as string) \|\| ''\n this.render()\n }\n\n render = (): void => {\n this.mainElement = this.mainElement \|\| this.querySelector('.icon-base') as HTMLElement\n if (!this.mainElement) {\n return\n }\n this.classList.add(classes['icon-base-parent'])\n this.mainElement.classList.add(classes['icon-base'])\n\n const styles = {\n '--min-width': this.minWidth \|\| this.size \|\| this.width \|\| 'auto',\n '--min-height': this.minHeight \|\| this.size \|\| this.height \|\| 'auto',\n '--width': this.size \|\| this.width \|\| '1rem',\n '--height': this.size \|\| this.height \|\| '1rem',\n ...(this.fontSize ? { 'font-size': this.fontSize \|\| 'unset' } : {}),\n ...(this.iconUrl ? { '--icon-url': `url(${this.iconUrl})` } : {}),\n ...(this.iconUrl ? { '--icon-color': this.color } : { '--icon-content-color': this.color }),\n }\n\n this.mainElement.innerHTML = this.iconUrl ? '' : (this.content \|\| '')\n\n this.mainElement.setAttribute('style', Object.entries(styles).map(([key, value]) => `${key}: ${value};`).join(' '))\n }\n}\n\ndeclare global {\n // eslint-disable-next-line @typescript-eslint/no-namespace\n namespace JSX {\n interface IntrinsicElements {\n 'icon-base': any\n }\n }\n}\n\nexport const ESIconBase = {\n ESIconBase: ESIcon,\n}\n"],"names":["template","document","createElement","innerHTML","ESIcon","ced","_dec","_class","HTMLElement","constructor","super","arguments","this","content","mainElement","iconUrl","minWidth","minHeight","width","height","size","fontSize","color","render","querySelector","classList","add","classes","default","styles","setAttribute","Object","entries","map","_ref","key","value","join","observedAttributes","connectedCallback","getAttribute","resolveAttributes","attributeChangedCallback","attrName","oldVal","newVal","remove","ESIconBase"],"mappings":"~~sHAKA~~,MAAMA,EAAWC,SAASC,cAAc,YAExCF,EAASG,UAAY,kCAcrB,IACaC,EADZC,EAAAA,IAAI,YAAYC,CAAAC,EAAjB,MACaH,UAAeI,YAAYC,WAAAA,GAAAC,SAAAC,WAAAC,KACtCC,aAAO,EAAAD,KAEPE,iBAAW,EAAAF,KAEXG,aAAO,EAAAH,KAEPI,cAAQ,EAAAJ,KAERK,eAAS,EAAAL,KAETM,WAAK,EAAAN,KAELO,YAAM,EAAAP,KAENQ,UAAI,EAAAR,KAEJS,cAAQ,EAAAT,KAERU,WAAK,EAAAV,KAkCLW,OAAS,KAEP,GADAX,KAAKE,YAAcF,KAAKE,aAAeF,KAAKY,cAAc,eACrDZ,KAAKE,YACR,OAEFF,KAAKa,UAAUC,IAAIC,~~EAAAA~~,~~QAAQ~~,~~qBAC3Bf~~,KAAKE,YAAYW,UAAUC,IAAIC,EAAOC,QAAC,cAEvC,MAAMC,~~EAAS~~,~~CACb~~,~~cAAejB~~,KAAKI,UAAYJ,KAAKQ,MAAQR,KAAKM,OAAS,OAC3D,eAAgBN,KAAKK,WAAaL,KAAKQ,MAAQR,KAAKO,QAAU,OAC9D,UAAWP,KAAKQ,MAAQR,KAAKM,OAAS,OACtC,WAAYN,KAAKQ,MAAQR,KAAKO,QAAU,~~UACpCP~~,KAAKS,SAAW,CAAE,YAAaT,KAAKS,UAAY,SAAY,~~MAC5DT~~,KAAKG,QAAU,CAAE,~~aAAc~~,~~OAAOH~~,KAAKG,~~YAAe~~,~~MAC1DH~~,KAAKG,QAAU,CAAE,eAAgBH,KAAKU,OAAU,CAAE,uBAAwBV,KAAKU,QAGrFV,KAAKE,YAAYX,UAAYS,KAAKG,QAAU,GAAMH,KAAKC,SAAW,GAElED,KAAKE,~~YAAYgB~~,aAAa,QAASC,OAAOC,~~QAAQH~~,~~GAAQI~~,KAAIC,IAAA,IAAEC,EAAKC,GAAMF,EAAA,~~MAAK~~,~~GAAGC~~,~~MAAQC~~,~~IAAQ~~,~~IAAEC~~,KAAK,KAAK,CACpH,CArDD,6BAAWC,GACT,MAAO,CAAC,UAAW,WAAY,YAAa,QAAS,SAAU,OAAQ,WAAY,QAAS,YAC9F,CAEAC,iBAAAA,~~IACM3B~~,KAAKC,SAAWD,KAAKT,aACvBS,KAAKC,QAAUD,KAAKC,SAAWD,KAAKT,WAAaS,~~KAAK4B~~,aAAa,~~YAGrE5B~~,KAAKT,UAAYH,EAASG,~~UAE1BsC~~,~~EAAAA~~,~~kBAAkB7B,~~KAAMR,~~EAAOkC~~,oBAE/~~B1B~~,KAAKW,QACP,~~CAEAmB~~,wBAAAA,CAAyBC,EAAkBC,EAAgCC,GACxD,cAAbF,GAAyC,cAAbA,GAAyC,UAAbA,GACpC,iBAAXE,~~IACTjC~~,KAAKa,~~UAAUqB~~,OAAOD,~~GACtBjC~~,KAAKa,UAAUC,~~IAAImB~~,~~IAGlBjC~~,KAAKU,QACRV,KAAKU,MAAQ,gBAIfV,~~KAAK+B~~,GAAaE,GAAqB,~~GACvCjC~~,KAAKW,QACP,KAwBDhB,EAWM,~~MAAMwC~~,EAAa,CACxBA,~~WAAY3C~~"}
1	+ {"version":3,"file":"IconWC.js","sources":["../../../../../../../../src/core/ui/components/icon/IconWC.ts"],"sourcesContent":["import { ced, resolveAttributes } from '../../../utils/webComponents/webComponent.utils'\n\nimport classes from './icon.module.scss'\n\n\nconst template = document.createElement('template')\n\ntemplate.innerHTML = '<span class=\"icon-base\"></span>'\n\nexport type IconBaseWCType = {\n iconUrl?: string\n minWidth?: string\n minHeight?: string\n width?: string\n height?: string\n size?: string\n fontSize?: string\n color?: string\n className?: string\n}\n\n@ced('icon-base')\nexport class ESIcon extends HTMLElement {\n content: string \| null\n\n mainElement: HTMLElement\n\n iconUrl?: string \| null\n\n minWidth?: string \| null\n\n minHeight?: string \| null\n\n width?: string \| null\n\n height?: string \| null\n\n size?: string \| null\n\n fontSize?: string \| null\n\n color?: string \| null\n\n static get observedAttributes(): string[] {\n return ['iconUrl', 'minWidth', 'minHeight', 'width', 'height', 'size', 'fontSize', 'color', 'className']\n }\n\n connectedCallback(): void {\n if (this.content \|\| this.innerHTML) {\n this.content = this.content \|\| this.innerHTML \|\| this.getAttribute('content')\n }\n\n this.innerHTML = template.innerHTML\n\n resolveAttributes(this, ESIcon.observedAttributes)\n\n this.render()\n }\n\n attributeChangedCallback(attrName: string, oldVal: string \| number \| null, newVal: string \| number \| null): void {\n if (attrName === 'className' \|\| attrName === 'classname' \|\| attrName === 'class') {\n if (typeof newVal === 'string') {\n this.classList.remove(newVal as string)\n this.classList.add(newVal as string)\n }\n }\n if (!this.color) {\n this.color = 'currentColor'\n }\n // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n // @ts-ignore\n this[attrName] = (newVal as string) \|\| ''\n this.render()\n }\n\n render = (): void => {\n this.mainElement = this.mainElement \|\| this.querySelector('.icon-base') as HTMLElement\n if (!this.mainElement) {\n return\n }\n this.classList.add(classes['icon-base-parent'])\n this.mainElement.classList.add(classes['icon-base'])\n\n const styles = {\n '--min-width': this.minWidth \|\| this.size \|\| this.width \|\| 'auto',\n '--min-height': this.minHeight \|\| this.size \|\| this.height \|\| 'auto',\n '--width': this.size \|\| this.width \|\| '1rem',\n '--height': this.size \|\| this.height \|\| '1rem',\n ...(this.fontSize ? { 'font-size': this.fontSize \|\| 'unset' } : {}),\n ...(this.iconUrl ? { '--icon-url': `url(${this.iconUrl})` } : {}),\n ...(this.iconUrl ? { '--icon-color': this.color } : { '--icon-content-color': this.color }),\n }\n\n this.mainElement.innerHTML = this.iconUrl ? '' : (this.content \|\| '')\n\n this.mainElement.setAttribute('style', Object.entries(styles).map(([key, value]) => `${key}: ${value};`).join(' '))\n }\n}\n\ndeclare global {\n // eslint-disable-next-line @typescript-eslint/no-namespace\n namespace JSX {\n interface IntrinsicElements {\n 'icon-base': any\n }\n }\n}\n\nexport const ESIconBase = {\n ESIconBase: ESIcon,\n}\n"],"names":["template","document","createElement","innerHTML","ESIcon","ced","_dec","_class","HTMLElement","constructor","super","arguments","this","content","mainElement","iconUrl","minWidth","minHeight","width","height","size","fontSize","color","render","querySelector","classList","add","classes","default","styles","_objectSpread","objectSpread2","concat","setAttribute","Object","entries","map","_ref","key","value","join","observedAttributes","connectedCallback","getAttribute","resolveAttributes","attributeChangedCallback","attrName","oldVal","newVal","remove","ESIconBase"],"mappings":"mRAKA,MAAMA,EAAWC,SAASC,cAAc,YAExCF,EAASG,UAAY,kCAcrB,IACaC,EADZC,EAAAA,IAAI,YAAYC,CAAAC,EAAjB,MACaH,UAAeI,YAAYC,WAAAA,GAAAC,SAAAC,WAAAC,KACtCC,aAAO,EAAAD,KAEPE,iBAAW,EAAAF,KAEXG,aAAO,EAAAH,KAEPI,cAAQ,EAAAJ,KAERK,eAAS,EAAAL,KAETM,WAAK,EAAAN,KAELO,YAAM,EAAAP,KAENQ,UAAI,EAAAR,KAEJS,cAAQ,EAAAT,KAERU,WAAK,EAAAV,KAkCLW,OAAS,KAEP,GADAX,KAAKE,YAAcF,KAAKE,aAAeF,KAAKY,cAAc,eACrDZ,KAAKE,YACR,OAEFF,KAAKa,UAAUC,IAAIC,EAAOC,QAAC,qBAC3BhB,KAAKE,YAAYW,UAAUC,IAAIC,EAAOC,QAAC,cAEvC,MAAMC,EAAMC,EAAAA,cAAAA,EAAAC,cAAAD,gBAAA,CACV,cAAelB,KAAKI,UAAYJ,KAAKQ,MAAQR,KAAKM,OAAS,OAC3D,eAAgBN,KAAKK,WAAaL,KAAKQ,MAAQR,KAAKO,QAAU,OAC9D,UAAWP,KAAKQ,MAAQR,KAAKM,OAAS,OACtC,WAAYN,KAAKQ,MAAQR,KAAKO,QAAU,QACpCP,KAAKS,SAAW,CAAE,YAAaT,KAAKS,UAAY,SAAY,CAAE,GAC9DT,KAAKG,QAAU,CAAE,aAAYiB,OAAAA,OAASpB,KAAKG,QAAO,MAAQ,CAAE,GAC5DH,KAAKG,QAAU,CAAE,eAAgBH,KAAKU,OAAU,CAAE,uBAAwBV,KAAKU,QAGrFV,KAAKE,YAAYX,UAAYS,KAAKG,QAAU,GAAMH,KAAKC,SAAW,GAElED,KAAKE,YAAYmB,aAAa,QAASC,OAAOC,QAAQN,GAAQO,KAAIC,IAAA,IAAEC,EAAKC,GAAMF,EAAA,MAAA,GAAAL,OAAQM,EAAGN,MAAAA,OAAKO,EAAK,IAAA,IAAKC,KAAK,KAAK,CACpH,CArDD,6BAAWC,GACT,MAAO,CAAC,UAAW,WAAY,YAAa,QAAS,SAAU,OAAQ,WAAY,QAAS,YAC9F,CAEAC,iBAAAA,IACM9B,KAAKC,SAAWD,KAAKT,aACvBS,KAAKC,QAAUD,KAAKC,SAAWD,KAAKT,WAAaS,KAAK+B,aAAa,YAGrE/B,KAAKT,UAAYH,EAASG,UAE1ByC,oBAAkBhC,KAAMR,EAAOqC,oBAE/B7B,KAAKW,QACP,CAEAsB,wBAAAA,CAAyBC,EAAkBC,EAAgCC,GACxD,cAAbF,GAAyC,cAAbA,GAAyC,UAAbA,GACpC,iBAAXE,IACTpC,KAAKa,UAAUwB,OAAOD,GACtBpC,KAAKa,UAAUC,IAAIsB,IAGlBpC,KAAKU,QACRV,KAAKU,MAAQ,gBAIfV,KAAKkC,GAAaE,GAAqB,GACvCpC,KAAKW,QACP,KAwBDhB,EAWM,MAAM2C,EAAa,CACxBA,WAAY9C"}

package/dist/lib/cjs/src/core/ui/components/icon/unifyIconUrl.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var e=require("ramda");exports.unifyIconUrl=l=>{if(!l||!e.is(String,l)||!l||l?.includes(".svg")||l?.includes("data:image/svg+xml;base64"))return l;const a=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,${btoa(a)}`};
+"use strict";require("../../../../../node_modules/core-js/modules/es.regexp.exec.js"),require("../../../../../node_modules/core-js/modules/es.string.replace.js"),require("../../../../../node_modules/core-js/modules/es.string.replace-all.js");var e=require("ramda");exports.unifyIconUrl=l=>{if(!l||!e.is(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))};
 //# sourceMappingURL=unifyIconUrl.js.map

package/dist/lib/cjs/src/core/ui/components/icon/unifyIconUrl.js.map CHANGED Viewed

	@@ -1 +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":["iconUrl","is","String","includes","unifiedIconUrl","replaceAll","btoa"],"mappings":"~~yDAK6BA~~,IAC3B,IAAKA,IAAYC,~~EAAAA~~,~~GAAGC~~,OAAQF,KAAaA,GACtCA,~~GAASG~~,SAAS,SAAWH,~~GAASG~~,SAAS,6BAChD,OAAOH,EAGT,MAAMI,EAAiBJ,~~GAASK~~,WAAW,UAAW,KACnDA,WAAW,IAAM,KACjBA,WAAW,MAAO,KAClBA,WAAW,MAAO,KAClBA,WAAW,MAAO,KAClBA,WAAW,MAAO,KAClBA,WAAW,MAAO,KAClBA,WAAW,sBAAuB,IAErC,~~MAAO~~,~~6BAA6BC~~,~~KAAKF~~,~~IAAiB~~"}
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":["iconUrl","is","String","includes","unifiedIconUrl","replaceAll","concat","btoa"],"mappings":"8RAK6BA,IAC3B,IAAKA,IAAYC,EAAEA,GAACC,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/lib/cjs/src/core/ui/components/molecules/layouts/FlowLayout.js CHANGED Viewed

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

package/dist/lib/cjs/src/core/ui/components/molecules/layouts/FlowLayout.js.map CHANGED Viewed

	@@ -1 +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","columnStyles","useMemo","display","gridTemplateColumns","repeat","width","height","React","createElement","LayoutBox","_extends","column","classNames","classes","flowLayout","default","tabIndex","flexWrap","gap","style","map","_ref2","id","spanColumn","Component","layoutProps","key","Math","round","displayName"],"mappings":"~~yPAoCaA~~,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,~~KACGC~~,~~GACaR~~,~~EAEhB~~,~~MAAMS~~,EAAeC,EAAAA,SAAQ,~~IAAON~~,EAAa,EAC7C,~~CACAO~~,QAAS,OACTC,~~oBAAqB~~,~~GAAG~~,OAAOC,~~OAAOT~~,~~KACtCU~~,MAAO,OACPC,OAAQ,SAER,~~CACAJ~~,QAAS,SAEV,~~CAACP~~,IAEJ,~~OACEY~~,MAAAC,cAACC,EAASA,UAAAC,UAAA,CACRL,MAAM,OACNM,QAAM,~~EACNf~~,~~UAAWgB~~,EAAUA,WAACC,UAAQC,~~WAAYlB~~,IACtCG,GAEHF,~~GACCU~~,MAAAC,cAAA,OAAA,~~CAAMZ~~,~~UAAWiB~~,EAAOE,~~QAAClB~~,~~cAAemB~~,UAAW,~~GAChDnB~~,~~GAGLU~~,MAAAC,cAACC,EAAAA,UAASC,EAAAA,QAAA,CACRO,SAAS,OACTC,IAAI,OACJC,~~MAAOnB~~,~~EACPK~~,MAAM,~~QACFZ~~,GAEHD,~~EAAS4B~~,KAAIC,IAAA,IAACC,GAAEA,EAAEC,WAAEA,EAAUC,UAAEA,EAASC,YAAEA,~~KAAgB1B~~,~~GAAoBsB~~,~~EAAA~~,~~OAC9Ed~~,MAAAC,cAACC,EAASA,UAAAC,UAAA,~~CACRgB~~,~~IAAKJ~~,~~GACD5B,EACA+~~B,EACCF,EACD,CAAEJ,MAAO,CAAEd,~~MAAO~~,~~QAAQsB~~,KAAKC,MAAmB,~~IAAbL~~,~~SAAqC~~,~~GAAbA~~,~~SAC7D~~,CAAA,GAEJhB,MAAAC,cAACgB,~~EAAczB~~,GACL,KAGfD,~~GACCS~~,MAAAC,cAAA,OAAA,~~CAAMZ~~,~~UAAWiB~~,EAAOE,~~QAACjB~~,~~aAAckB~~,UAAW,GAC/~~ClB~~,GAGK,IAOhBT,~~EAAWwC~~,YAAc"}
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","default","tabIndex","flexWrap","gap","style","map","_ref2","id","spanColumn","Component","layoutProps","_excluded2","key","Math","round","displayName"],"mappings":"0ZAoCaA,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,EAAAA,wBAAAT,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,EAASA,UAAAC,UAAA,CACRL,MAAM,OACNM,QAAM,EACNlB,UAAWmB,EAAUA,WAACC,UAAQC,WAAYrB,IACtCG,GAEHF,GACCa,MAAAC,cAAA,OAAA,CAAMf,UAAWoB,EAAOE,QAACrB,cAAesB,UAAW,GAChDtB,GAGLa,MAAAC,cAACC,EAAAA,UAASC,EAAAA,QAAA,CACRO,SAAS,OACTC,IAAI,OACJC,MAAOpB,EACPM,MAAM,QACFf,GAEHD,EAAS+B,KAAIC,IAAA,IAACC,GAAEA,EAAEC,WAAEA,EAAUC,UAAEA,EAASC,YAAEA,GAAoCJ,EAApBzB,EAAKC,EAAAA,wBAAAwB,EAAAK,GAAA,OAC/DnB,MAAAC,cAACC,EAASA,UAAAC,UAAA,CACRiB,IAAKL,GACD/B,EACAkC,EACCF,EACD,CAAEJ,MAAO,CAAEd,cAAKF,OAAUyB,KAAKC,MAAmB,IAAbN,GAAiBpB,QAAAA,OAAoB,GAAboB,EAAe,SAC5E,CAAA,GAEJhB,MAAAC,cAACgB,EAAc5B,GACL,KAGfD,GACCY,MAAAC,cAAA,OAAA,CAAMf,UAAWoB,EAAOE,QAACpB,aAAcqB,UAAW,GAC/CrB,GAGK,IAOhBT,EAAW4C,YAAc"}

package/dist/lib/cjs/src/core/ui/components/molecules/popover/PopoverLite.js CHANGED Viewed

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

package/dist/lib/cjs/src/core/ui/components/molecules/popover/PopoverLite.js.map CHANGED Viewed

	@@ -1 +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","children","components","placement","modifiers","data","hoverable","clickable","onOpen","onHide","isOpen","hideOnContentClick","hideOnClickOutside","hideTimeout","isPopup","isModal","modalOverlayClassName","modalContainer","targetRef","hideOnEscape","props","content","setContent","useState","target","setTarget","current","useEffect","ContentComponent","contentComponents","popperInstanceRef","useRef","options","useMemo","name","phase","enabled","fn","_ref2","state","mcBoundRect","getBoundingClientRect","window","innerWidth","innerHeight","xpos","elements","popper","clientWidth","ypos","clientHeight","transform","pendingHideRef","popperInstance","destroy","createPopper","outsideClickUnsubscriber","outsideClickUnsubscriberTimeout","hide","useCallback","dataset","show","modalRef","style","update","clearTimeout","delayedHide","cancelableSetTimeout","cancelDelayedHide","handleOutsideClick","eventTarget","contains","open","setTimeout","outsideClickHandler","toggleOpen","keydownHandler","event","keyCode","KeyCode","Escape","targetAddListener","addEventListener","bind","contentAddListener","EventName","MouseEnter","MouseLeave","Click","document","KeyDown","targetRemoveListener","removeEventListener","contentRemoveListener","childrenIsFunction","childrenIsElement","Array","isArray","childrenAreElements","filter","child","length","React","default","createElement","Fragment","ref","className","forwardedRef","_extends","cloneElement","displayName"],"mappings":"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"}
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","objectSpread2","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","default","createElement","Fragment","ref","className","forwardedRef","_extends","cloneElement","displayName"],"mappings":"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"}

package/dist/lib/cjs/src/core/ui/components/molecules/popover/Tooltip.js CHANGED Viewed

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

package/dist/lib/cjs/src/core/ui/components/molecules/popover/Tooltip.js.map CHANGED Viewed

	@@ -1 +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","~~default~~","~~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","popoverComponents","useMemo","undefined","TargetNode","size","color","style","lineHeight","mergedModifiers","Popover","_extends","extends","displayName"],"mappings":"~~ofAqBA~~,~~MAAMA,~~EAAmB,CACvB,CACEC,KAAM,SACNC,QAAS,CACPC,OAAQ,CAAC,EAAG,IACZC,UAAWC,~~EAAgBA~~,~~iBAACC~~,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,~~EAAAA~~,~~WAAWC~~,~~EAAAA~~,~~QAAQ,~~mBAAoBL,IAElDC,MAAAC,cAAA,MAAA,CAAKI,GAAG,QAAQ,qBAAiB,EAACN,UAAWK,~~EAAOE~~,~~QAACC~~,~~OACnDP~~,MAAAC,cAAA,MAAA,CAAKF,UAAWK,~~EAAOE~~,QAAC,~~kBAE1BN~~,MAAAC,cAACO,YAAS,CACRC,QAAQ,OACRC,UAAU,SACVC,MAAM,QACNC,OAAO,QACPC,SAAS,KAERnB,GACCM,MAAAC,cAACO,YAAS,CAACM,QAAQ,gBAAgBC,MAAM,QAAQJ,MAAM,OAAOF,QAAQ,KACpET,MAAAC,cAACe,EAAAA,iBAAE,KAAEtB,GACJG,GACCG,MAAAC,cAAA,MAAA,CACEgB,QAASrB,EACTsB,UAAWtB,EACXuB,KAAK,SACLC,UAAW,EACXrB,UAAWK,~~EAAOE~~,QAAC,~~iBAElBR~~,GAAgBE,MAAAC,cAACoB,WAAQ,CAACC,QAASxB,KAClCA,GACAE,MAAAC,cAACoB,EAAAA,SAAQ,KACNE,EACOA,eAMnB7B,GAASM,MAAAC,cAACuB,EAAAA,kBAAiB,CAACC,OAAO,UACnC9B,GAAQK,MAAAC,cAACyB,EAAAA,eAAc,CAACC,QAAQ,KAAKhC,IAEpC,EA8BKiC,EAA4BC,EAAIA,MAAeC,IAIxC,IAJyCC,aAC3DA,EAAcC,YAAYC,iBAAEA,GAAqB,CAAEA,iBAAkB1C,GAAgB2C,YACrFA,EAAWC,SACXA,EAAQC,QAAEA,EAAOC,UAAEA,GAAY,EAAKC,UAAEA,GAAY,EAAIlD,UAAEA,EAAY,MAAKmD,UAAEA,~~KAAcC~~,~~GAC5EV~~,~~EACb~~,~~MAAMW~~,EAAoBC,WAAQ,~~IAAOT~~,EAAmB,CAC1DA,~~yBACEU~~,GAAY,~~CAACV~~,IAEjB,~~IAAIW~~,~~EAEAT~~,~~IACFS~~,~~EAAaT~~,IAEVA,GAAYC,~~IACfQ~~,~~EACEV~~,EACIlC,MAAAC,cAACoB,EAAAA,SAAQ,CAACC,QAASY,~~EAAaW~~,KAAK,OAAOC,MAAM,YAAYC,MAAO,CAAEC,WAAY,~~SAEnFhD~~,MAAAC,cAACoB,WAAQ,~~CAACwB~~,KAAK,OAAOC,MAAM,YAAYC,MAAO,CAAEC,WAAY,~~QAC1DzB~~,~~EACOA~~,~~cAKlB~~,~~MAAM0B,~~EAAkBP,EAAAA,SAAQ,IAAO,~~IAAI1D~~,KAAsBuD,GAAa,KAAO,CAACA,IAEtF,OACEvC,MAAAC,~~cAACiD~~,EAAOA,QAAAC,EAAAC,QAAA,CAAA,~~EACFZ~~,EACAT,EAAY,CAChBO,UAAWA,EACXD,UAAWA,EACXjD,UAAWA,EACXmD,~~UAAWU~~,~~EACXjB~~,~~WAAYS~~,~~EACZ5C~~,UAAWwC,~~IAEVO~~,GAAcA,EACP,~~IASdhB~~,~~EAAQyB~~,YAAc"}
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","default","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","extends","displayName"],"mappings":"2sBAqBMA,EAAmB,CACvB,CACEC,KAAM,SACNC,QAAS,CACPC,OAAQ,CAAC,EAAG,IACZC,UAAWC,EAAAA,iBAAiBC,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,EAAUA,WAACC,UAAQ,mBAAoBL,IAElDC,MAAAC,cAAA,MAAA,CAAKI,GAAG,QAAQ,qBAAiB,EAACN,UAAWK,EAAAA,QAAQE,OACnDN,MAAAC,cAAA,MAAA,CAAKF,UAAWK,EAAOG,QAAC,kBAE1BP,MAAAC,cAACO,YAAS,CACRC,QAAQ,OACRC,UAAU,SACVC,MAAM,QACNC,OAAO,QACPC,SAAS,KAERnB,GACCM,MAAAC,cAACO,YAAS,CAACM,QAAQ,gBAAgBC,MAAM,QAAQJ,MAAM,OAAOF,QAAQ,KACpET,MAAAC,cAACe,EAAAA,iBAAE,KAAEtB,GACJG,GACCG,MAAAC,cAAA,MAAA,CACEgB,QAASrB,EACTsB,UAAWtB,EACXuB,KAAK,SACLC,UAAW,EACXrB,UAAWK,EAAOG,QAAC,iBAElBT,GAAgBE,MAAAC,cAACoB,WAAQ,CAACC,QAASxB,KAClCA,GACAE,MAAAC,cAACoB,EAAAA,SAAQ,KACNE,EACOA,eAMnB7B,GAASM,MAAAC,cAACuB,EAAAA,kBAAiB,CAACC,OAAO,UACnC9B,GAAQK,MAAAC,cAACyB,EAAAA,eAAc,CAACC,QAAQ,KAAKhC,IAEpC,EA8BKiC,EAA4BC,EAAIA,MAAeC,IAIxC,IAJyCC,aAC3DA,EAAcC,YAAYC,iBAAEA,GAAqB,CAAEA,iBAAkB1C,GAAgB2C,YACrFA,EAAWC,SACXA,EAAQC,QAAEA,EAAOC,UAAEA,GAAY,EAAKC,UAAEA,GAAY,EAAIlD,UAAEA,EAAY,MAAKmD,UAAEA,GAC9DT,EAD4EU,EAAKC,EAAAA,wBAAAX,EAAAY,GAE9F,MAAMC,EAAoBC,WAAQ,IAAOX,EAAmB,CAC1DA,yBACEY,GAAY,CAACZ,IAEjB,IAAIa,EAEAX,IACFW,EAAaX,IAEVA,GAAYC,IACfU,EACEZ,EACIlC,MAAAC,cAACoB,EAAAA,SAAQ,CAACC,QAASY,EAAaa,KAAK,OAAOC,MAAM,YAAYC,MAAO,CAAEC,WAAY,SAEnFlD,MAAAC,cAACoB,WAAQ,CAAC0B,KAAK,OAAOC,MAAM,YAAYC,MAAO,CAAEC,WAAY,QAC1D3B,gBAMX,MAAM4B,EAAkBP,EAAAA,SAAQ,IAAO,IAAI5D,KAAsBuD,GAAa,KAAO,CAACA,IAEtF,OACEvC,MAAAC,cAACmD,EAAOA,QAAAC,EAAAC,QAAA,CAAA,EACFd,EACAT,EAAY,CAChBO,UAAWA,EACXD,UAAWA,EACXjD,UAAWA,EACXmD,UAAWY,EACXnB,WAAYW,EACZ9C,UAAWwC,IAEVS,GAAcA,EACP,IASdlB,EAAQ2B,YAAc"}

package/dist/lib/cjs/src/core/ui/components/molecules/popup/Popup.js CHANGED Viewed

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