@e1011/es-kit 1.1.56 → 1.1.58

package/dist/types/src/core/ui/components/molecules/popover/Popover.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Popover.stories.d.ts","sourceRoot":"","sources":["../../../../../../../../src/core/ui/components/molecules/popover/Popover.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA2B,SAAS,EAC8B,MAAM,OAAO,CAAA;AACtF,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAA;AAOvC,OAAO,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAA;wBAO3D,IAAI;AAHT,wBAGS;AAkCT,KAAK,aAAa,GAAG;IACnB,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,EAAE,MAAM,CAAA;IACf,IAAI,EAAE,MAAM,CAAA;CACb,CAAA;AAED,KAAK,KAAK,GAAG,YAAY,GAAG;IAAE,IAAI,EAAE,aAAa,EAAE,CAAA;CAAE,CAAA;AAErD,eAAO,MAAM,cAAc;wBAAuB,KAAK,GAAG,SAAS;;;;;;;;;;;CASlE,CAAA;AAoBD,eAAO,MAAM,qBAAqB;wBAAuB,KAAK,GAAG,SAAS;;;;;;;;;;;CAiBzE,CAAA;AAoBD,eAAO,MAAM,kBAAkB;WAAU,KAAK,GAAG,SAAS;;;;;;CAOzD,CAAA;AA6CD,KAAK,MAAM,GAAG,YAAY,GAAG;IAAE,WAAW,EAAE,MAAM,CAAC;IAAC,WAAW,CAAC,EAAE,OAAO,CAAA;CAAE,CAAA;AAE3E,eAAO,MAAM,oBAAoB;4CAA2C,MAAM,GAAG,SAAS;;;;;;;;CAiD7F,CAAA;AAUD,eAAO,MAAM,+BAA+B;+BAA8B,MAAM,GAAG,SAAS;;;;;;;CAU3F,CAAA"}
+{"version":3,"file":"Popover.stories.d.ts","sourceRoot":"","sources":["../../../../../../../../src/core/ui/components/molecules/popover/Popover.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA2B,SAAS,EAC8B,MAAM,OAAO,CAAA;AACtF,OAAO,EAAE,IAAI,EAAE,MAAM,kBAAkB,CAAA;AAOvC,OAAO,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAA;wBAQ3D,IAAI;AAHT,wBAGS;AAkCT,KAAK,aAAa,GAAG;IACnB,KAAK,EAAE,MAAM,CAAA;IACb,OAAO,EAAE,MAAM,CAAA;IACf,IAAI,EAAE,MAAM,CAAA;CACb,CAAA;AAED,KAAK,KAAK,GAAG,YAAY,GAAG;IAAE,IAAI,EAAE,aAAa,EAAE,CAAA;CAAE,CAAA;AAErD,eAAO,MAAM,cAAc;wBAAuB,KAAK,GAAG,SAAS;;;;;;;;;;;CASlE,CAAA;AAoBD,eAAO,MAAM,qBAAqB;wBAAuB,KAAK,GAAG,SAAS;;;;;;;;;;;CAsBzE,CAAA;AAoBD,eAAO,MAAM,kBAAkB;WAAU,KAAK,GAAG,SAAS;;;;;;CAOzD,CAAA;AA6CD,KAAK,MAAM,GAAG,YAAY,GAAG;IAAE,WAAW,EAAE,MAAM,CAAC;IAAC,WAAW,CAAC,EAAE,OAAO,CAAA;CAAE,CAAA;AAE3E,eAAO,MAAM,oBAAoB;4CAA2C,MAAM,GAAG,SAAS;;;;;;;;CAiD7F,CAAA;AAUD,eAAO,MAAM,+BAA+B;+BAA8B,MAAM,GAAG,SAAS;;;;;;;CAU3F,CAAA"}

package/dist/types/src/core/ui/components/molecules/popover/Tooltip.d.ts

@@ -1,13 +1,33 @@
-import { FC } from 'react';
+import { FC, PropsWithChildren } from 'react';
 import { PopoverProps } from './popover.types';
 /**
 
+Props for the TooltipContent component.
+@typedef {Object} TooltipContentProps
+@property {ForwardedRef} forwardedRef - Forwarded ref of the TooltipContent component.
+@property {string} title - Title of the tooltip.
+@property {string} text - Text content of the tooltip.
+@property {Function} hide - Function to hide the tooltip.
+@property {boolean} showClose - Determines whether to show a close button in the tooltip.
+@extends PropsWithChildren
+*/
+type TooltipContentProps = PropsWithChildren<any> & {
+    forwardedRef: ForwardedRef;
+    closeIconUrl?: string;
+    className?: string;
+    title?: string;
+    text?: string;
+    hide: () => void;
+    showClose?: boolean;
+};
+/**
+
 Props for the Tooltip component, extends PopoverProps.
 @typedef {Object} TooltipProps
 @property {Record<string, unknown>} [tooltipProps] - Additional props to be passed to the underlying Popover component.
 @extends PopoverProps
 */
-export type TooltipProps = PopoverProps & {
+export type TooltipProps = PopoverProps & TooltipContentProps & {
     tooltipProps?: Record<string, unknown>;
     infoIconUrl?: string;
 };
@@ -24,4 +44,5 @@ export type TooltipProps = PopoverProps & {
  * @param modifiers - Optional modifiers to be passed down to the `Popover` component.
  */
 export declare const Tooltip: FC<TooltipProps>;
+export {};
 //# sourceMappingURL=Tooltip.d.ts.map

package/dist/types/src/core/ui/components/molecules/popover/Tooltip.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../../../../../../../src/core/ui/components/molecules/popover/Tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAQ,EAAE,EAA8B,MAAM,OAAO,CAAA;AAY5D,OAAO,EAAoB,YAAY,EAAE,MAAM,iBAAiB,CAAA;AAIhE;;;;;;EAME;AACF,MAAM,MAAM,YAAY,GAAG,YAAY,GAAG;IACxC,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;IACtC,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB,CAAA;AAkFD;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,OAAO,EAAE,EAAE,CAAC,YAAY,CA0CnC,CAAA"}
+{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../../../../../../../src/core/ui/components/molecules/popover/Tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAQ,EAAE,EAAW,iBAAiB,EAAE,MAAM,OAAO,CAAA;AAa5D,OAAO,EAAoB,YAAY,EAAE,MAAM,iBAAiB,CAAA;AAkBhE;;;;;;;;;;EAUE;AACF,KAAK,mBAAmB,GAAG,iBAAiB,CAAC,GAAG,CAAC,GAAG;IAClD,YAAY,EAAE,YAAY,CAAA;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,MAAM,IAAI,CAAA;IAChB,SAAS,CAAC,EAAE,OAAO,CAAA;CACpB,CAAA;AAsDD;;;;;;EAME;AACF,MAAM,MAAM,YAAY,GAAG,YAAY,GAAG,mBAAmB,GAAG;IAC9D,YAAY,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;IACtC,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB,CAAA;AAGD;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,OAAO,EAAE,EAAE,CAAC,YAAY,CA0CnC,CAAA"}

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

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

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

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.js","sources":["../../../../../../../../../src/core/ui/components/molecules/popover/Tooltip.tsx"],"sourcesContent":["import { memo, FC, useMemo, PropsWithChildren } from 'react'\n// import { DividerHorizontal, LayoutBox, IconBase } from '@e1011/es-kit'\n\n\n\nimport { HeadlineTertiary as H3, ParagraphSmall } from '../../atoms/text'\nimport { DividerHorizontal } from '../../dividers'\nimport { LayoutBox } from '../../container'\nimport { IconBase } from '../../icon'\nimport { infoIconJSX } from '../../atoms/icons'\n\nimport { Popover } from './PopoverLite'\nimport { PopoverPlacement, PopoverProps } from './popover.types'\nimport classes from './tooltip.module.scss'\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 & {\n  tooltipProps?: Record<string, unknown>\n  infoIconUrl?: string\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}\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,\n}: TooltipContentProps): JSX.Element => (\n  <div\n    ref={forwardedRef}\n    className={classes['popover-tooltip']}\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 * 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","React","createElement","ref","className","classes","id","arrow","LayoutBox","padding","direction","width","height","flexGrow","justify","align","H3","onClick","onKeyDown","role","tabIndex","IconBase","iconUrl","infoIconJSX","DividerHorizontal","margin","ParagraphSmall","element","Tooltip","memo","_ref2","tooltipProps","components","ContentComponent","infoIconUrl","children","infoTip","clickable","hoverable","modifiers","props","popoverComponents","useMemo","undefined","TargetNode","size","color","style","lineHeight","mergedModifiers","Popover","_extends","displayName"],"mappings":"8mBAgCA,MAAMA,EAAmB,CACvB,CACEC,KAAM,SACNC,QAAS,CACPC,OAAQ,CAAC,EAAG,IACZC,UAAWC,EAAiBC,OA2B5BC,EAAiBC,IAAA,IAACC,aACtBA,EAAYC,MAAEA,EAAKC,KAAEA,EAAIC,KAAEA,EAAIC,UAAEA,EAASC,aAAEA,GACxBN,EAAA,OACpBO,MAAAC,cAAA,MAAA,CACEC,IAAKR,EACLS,UAAWC,EAAQ,oBAEnBJ,MAAAC,cAAA,MAAA,CAAKI,GAAG,QAAQ,qBAAiB,EAACF,UAAWC,EAAQE,OACnDN,MAAAC,cAAA,MAAA,CAAKE,UAAWC,EAAQ,kBAE1BJ,MAAAC,cAACM,EAAS,CACRC,QAAQ,OACRC,UAAU,SACVC,MAAM,QACNC,OAAO,QACPC,SAAS,KAERjB,GACCK,MAAAC,cAACM,EAAS,CAACM,QAAQ,gBAAgBC,MAAM,QAAQJ,MAAM,OAAOF,QAAQ,KACpER,MAAAC,cAACc,EAAE,KAAEpB,GACJG,GACCE,MAAAC,cAAA,MAAA,CACEe,QAASnB,EACToB,UAAWpB,EACXqB,KAAK,SACLC,UAAW,EACXhB,UAAWC,EAAQ,iBAElBL,GAAgBC,MAAAC,cAACmB,EAAQ,CAACC,QAAStB,KAClCA,GACAC,MAAAC,cAACmB,EAAQ,KACNE,KAOZ3B,GAASK,MAAAC,cAACsB,EAAiB,CAACC,OAAO,UACnC5B,GAAQI,MAAAC,cAACwB,EAAc,CAACC,QAAQ,KAAK9B,IAEpC,EAeK+B,EAA4BC,GAAmBC,IAIxC,IAJyCC,aAC3DA,EAAcC,YAAYC,iBAAEA,GAAqB,CAAEA,iBAAkBxC,GAAgByC,YACrFA,EAAWC,SACXA,EAAQC,QAAEA,EAAOC,UAAEA,GAAY,EAAKC,UAAEA,GAAY,EAAIhD,UAAEA,EAAY,MAAKiD,UAAEA,KAAcC,GAC5EV,EACb,MAAMW,EAAoBC,GAAQ,IAAOT,EAAmB,CAC1DA,yBACEU,GAAY,CAACV,IAEjB,IAAIW,EAEAT,IACFS,EAAaT,IAEVA,GAAYC,IACfQ,EACEV,EACIjC,MAAAC,cAACmB,EAAQ,CAACC,QAASY,EAAaW,KAAK,OAAOC,MAAM,YAAYC,MAAO,CAAEC,WAAY,SAEnF/C,MAAAC,cAACmB,EAAQ,CAACwB,KAAK,OAAOC,MAAM,YAAYC,MAAO,CAAEC,WAAY,QAC1DzB,IAMX,MAAM0B,EAAkBP,GAAQ,IAAO,IAAIxD,KAAsBqD,GAAa,KAAO,CAACA,IAEtF,OACEtC,MAAAC,cAACgD,EAAOC,EAAA,CAAA,EACFX,EACAT,EAAY,CAChBO,UAAWA,EACXD,UAAWA,EACX/C,UAAWA,EACXiD,UAAWU,EACXjB,WAAYS,EACZ1C,UAAWsC,IAEVO,GAAcA,EACP,IASdhB,EAAQwB,YAAc"}
+{"version":3,"file":"Tooltip.js","sources":["../../../../../../../../../src/core/ui/components/molecules/popover/Tooltip.tsx"],"sourcesContent":["import { memo, FC, useMemo, PropsWithChildren } from 'react'\n// import { DividerHorizontal, LayoutBox, IconBase } from '@e1011/es-kit'\n\n\n\nimport { HeadlineTertiary as H3, ParagraphSmall } from '../../atoms/text'\nimport { DividerHorizontal } from '../../dividers'\nimport { LayoutBox } from '../../container'\nimport { IconBase } from '../../icon'\nimport { infoIconJSX } from '../../atoms/icons'\nimport { classNames } from '../../../../utils'\n\nimport { Popover } from './PopoverLite'\nimport { PopoverPlacement, PopoverProps } from './popover.types'\nimport classes from './tooltip.module.scss'\n\n\n/**\n\nModifiers for the Popover component used in Tooltip.\n*/\nconst popoverModifiers = [\n  {\n    name: 'offset',\n    options: {\n      offset: [0, 10],\n      placement: PopoverPlacement.Top,\n    },\n  },\n]\n\n/**\n\nProps for the TooltipContent component.\n@typedef {Object} TooltipContentProps\n@property {ForwardedRef} forwardedRef - Forwarded ref of the TooltipContent component.\n@property {string} title - Title of the tooltip.\n@property {string} text - Text content of the tooltip.\n@property {Function} hide - Function to hide the tooltip.\n@property {boolean} showClose - Determines whether to show a close button in the tooltip.\n@extends PropsWithChildren\n*/\ntype TooltipContentProps = PropsWithChildren<any> & {\n  forwardedRef: ForwardedRef\n  closeIconUrl?: string\n  className?: string\n  title?: string\n  text?: string\n  hide: () => void\n  showClose?: boolean\n}\n\n/**\n\n  Tooltip content component used by the Tooltip component.\n  @param {TooltipContentProps} props - Props for the TooltipContent component.\n  @returns {JSX.Element} - Returns the JSX element for the TooltipContent component.\n  */\nconst TooltipContent = ({\n  forwardedRef, title, text, hide, showClose, closeIconUrl, className = '',\n}: TooltipContentProps): JSX.Element => (\n  <div\n    ref={forwardedRef}\n    className={classNames(classes['popover-tooltip'], className)}\n  >\n    <div id='arrow' data-popper-arrow className={classes.arrow}>\n      <div className={classes['arrow-inner']} />\n    </div>\n    <LayoutBox\n      padding='1rem'\n      direction='column'\n      width='256px'\n      height='unset'\n      flexGrow='1'\n    >\n      {title && (\n        <LayoutBox justify='space-between' align='start' width='100%' padding='0'>\n          <H3>{title}</H3>\n          {showClose && (\n            <div\n              onClick={hide}\n              onKeyDown={hide}\n              role='button'\n              tabIndex={-1}\n              className={classes['close-button']}\n            >\n              {closeIconUrl && <IconBase iconUrl={closeIconUrl} />}\n              {!closeIconUrl && (\n                <IconBase>\n                  {infoIconJSX}\n                </IconBase>\n              )}\n            </div>\n          )}\n        </LayoutBox>\n      )}\n      {title && <DividerHorizontal margin='8px 0' />}\n      {text && <ParagraphSmall element='p'>{text}</ParagraphSmall>}\n    </LayoutBox>\n  </div>\n)\n\n\n\n/**\n\nProps for the Tooltip component, extends PopoverProps.\n@typedef {Object} TooltipProps\n@property {Record<string, unknown>} [tooltipProps] - Additional props to be passed to the underlying Popover component.\n@extends PopoverProps\n*/\nexport type TooltipProps = PopoverProps & TooltipContentProps & {\n  tooltipProps?: Record<string, unknown>\n  infoIconUrl?: string\n}\n\n\n/**\n * A tooltip component that displays a short message when the user hovers or clicks on a target element.\n *\n * @param tooltipProps - Optional properties to be passed down to the `Popover` component.\n * @param components - Optional components that can be customized by the consumer.\n * @param children - The target element that the tooltip will be anchored to.\n * @param infoTip - If no `children` prop is passed in, an information icon will be used as the target element.\n * @param clickable - If `true`, the tooltip will be triggered by a click instead of a hover.\n * @param hoverable - If `true`, the tooltip will be triggered by a hover. Defaults to `true`.\n * @param placement - The placement of the tooltip relative to the target element.\n * @param modifiers - Optional modifiers to be passed down to the `Popover` component.\n */\nexport const Tooltip: FC<TooltipProps> = memo<TooltipProps>(({\n  tooltipProps, components: { ContentComponent } = { ContentComponent: TooltipContent },\n  infoIconUrl,\n  children, infoTip, clickable = false, hoverable = true, placement = 'top', modifiers, ...props\n}: TooltipProps) => {\n  const popoverComponents = useMemo(() => (ContentComponent ? {\n    ContentComponent,\n  } : undefined), [ContentComponent])\n\n  let TargetNode: typeof children\n\n  if (children) {\n    TargetNode = children\n  }\n  if (!children && infoTip) {\n    TargetNode = (\n      infoIconUrl\n        ? <IconBase iconUrl={infoIconUrl} size='1rem' color='#00336640' style={{ lineHeight: '1px' }} />\n        : (\n          <IconBase size='1rem' color='#00336640' style={{ lineHeight: '1px' }}>\n            {infoIconJSX}\n          </IconBase>\n        )\n    )\n  }\n\n  const mergedModifiers = useMemo(() => ([...popoverModifiers, ...(modifiers || [])]), [modifiers])\n\n  return (\n    <Popover\n      {...props}\n      {...tooltipProps}\n      hoverable={hoverable}\n      clickable={clickable}\n      placement={placement}\n      modifiers={mergedModifiers}\n      components={popoverComponents}\n      showClose={clickable}\n    >\n      {TargetNode && TargetNode}\n    </Popover>\n  )\n})\n\n/**\n * The display name of the Tooltip component.\n *\n * @type {string}\n */\nTooltip.displayName = 'Tooltip'\n\n"],"names":["popoverModifiers","name","options","offset","placement","PopoverPlacement","Top","TooltipContent","_ref","forwardedRef","title","text","hide","showClose","closeIconUrl","className","React","createElement","ref","classNames","classes","id","arrow","LayoutBox","padding","direction","width","height","flexGrow","justify","align","H3","onClick","onKeyDown","role","tabIndex","IconBase","iconUrl","infoIconJSX","DividerHorizontal","margin","ParagraphSmall","element","Tooltip","memo","_ref2","tooltipProps","components","ContentComponent","infoIconUrl","children","infoTip","clickable","hoverable","modifiers","props","popoverComponents","useMemo","undefined","TargetNode","size","color","style","lineHeight","mergedModifiers","Popover","_extends","displayName"],"mappings":"2qBAqBA,MAAMA,EAAmB,CACvB,CACEC,KAAM,SACNC,QAAS,CACPC,OAAQ,CAAC,EAAG,IACZC,UAAWC,EAAiBC,OAgC5BC,EAAiBC,IAAA,IAACC,aACtBA,EAAYC,MAAEA,EAAKC,KAAEA,EAAIC,KAAEA,EAAIC,UAAEA,EAASC,aAAEA,EAAYC,UAAEA,EAAY,IAClDP,EAAA,OACpBQ,MAAAC,cAAA,MAAA,CACEC,IAAKT,EACLM,UAAWI,EAAWC,EAAQ,mBAAoBL,IAElDC,MAAAC,cAAA,MAAA,CAAKI,GAAG,QAAQ,qBAAiB,EAACN,UAAWK,EAAQE,OACnDN,MAAAC,cAAA,MAAA,CAAKF,UAAWK,EAAQ,kBAE1BJ,MAAAC,cAACM,EAAS,CACRC,QAAQ,OACRC,UAAU,SACVC,MAAM,QACNC,OAAO,QACPC,SAAS,KAERlB,GACCM,MAAAC,cAACM,EAAS,CAACM,QAAQ,gBAAgBC,MAAM,QAAQJ,MAAM,OAAOF,QAAQ,KACpER,MAAAC,cAACc,EAAE,KAAErB,GACJG,GACCG,MAAAC,cAAA,MAAA,CACEe,QAASpB,EACTqB,UAAWrB,EACXsB,KAAK,SACLC,UAAW,EACXpB,UAAWK,EAAQ,iBAElBN,GAAgBE,MAAAC,cAACmB,EAAQ,CAACC,QAASvB,KAClCA,GACAE,MAAAC,cAACmB,EAAQ,KACNE,KAOZ5B,GAASM,MAAAC,cAACsB,EAAiB,CAACC,OAAO,UACnC7B,GAAQK,MAAAC,cAACwB,EAAc,CAACC,QAAQ,KAAK/B,IAEpC,EA8BKgC,EAA4BC,GAAmBC,IAIxC,IAJyCC,aAC3DA,EAAcC,YAAYC,iBAAEA,GAAqB,CAAEA,iBAAkBzC,GAAgB0C,YACrFA,EAAWC,SACXA,EAAQC,QAAEA,EAAOC,UAAEA,GAAY,EAAKC,UAAEA,GAAY,EAAIjD,UAAEA,EAAY,MAAKkD,UAAEA,KAAcC,GAC5EV,EACb,MAAMW,EAAoBC,GAAQ,IAAOT,EAAmB,CAC1DA,yBACEU,GAAY,CAACV,IAEjB,IAAIW,EAEAT,IACFS,EAAaT,IAEVA,GAAYC,IACfQ,EACEV,EACIjC,MAAAC,cAACmB,EAAQ,CAACC,QAASY,EAAaW,KAAK,OAAOC,MAAM,YAAYC,MAAO,CAAEC,WAAY,SAEnF/C,MAAAC,cAACmB,EAAQ,CAACwB,KAAK,OAAOC,MAAM,YAAYC,MAAO,CAAEC,WAAY,QAC1DzB,IAMX,MAAM0B,EAAkBP,GAAQ,IAAO,IAAIzD,KAAsBsD,GAAa,KAAO,CAACA,IAEtF,OACEtC,MAAAC,cAACgD,EAAOC,EAAA,CAAA,EACFX,EACAT,EAAY,CAChBO,UAAWA,EACXD,UAAWA,EACXhD,UAAWA,EACXkD,UAAWU,EACXjB,WAAYS,EACZ3C,UAAWuC,IAEVO,GAAcA,EACP,IASdhB,EAAQwB,YAAc"}

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

@@ -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("../../container/layoutBox/LayoutBox.js");const p=[{name:"offset",options:{offset:[0,10],placement:a.PopoverPlacement.Top}}],u=e=>{let{forwardedRef:t,title:r,text:a,hide:p,showClose:u,closeIconUrl:d}=e;return React.createElement("div",{ref:t,className:n.default["popover-tooltip"]},React.createElement("div",{id:"arrow","data-popper-arrow":!0,className:n.default.arrow},React.createElement("div",{className:n.default["arrow-inner"]})),React.createElement(m.LayoutBox,{padding:"1rem",direction:"column",width:"256px",height:"unset",flexGrow:"1"},r&&React.createElement(m.LayoutBox,{justify:"space-between",align:"start",width:"100%",padding:"0"},React.createElement(l.HeadlineTertiary,null,r),u&&React.createElement("div",{onClick:p,onKeyDown:p,role:"button",tabIndex:-1,className:n.default["close-button"]},d&&React.createElement(s.IconBase,{iconUrl:d}),!d&&React.createElement(s.IconBase,null,o.infoIconJSX))),r&&React.createElement(i.DividerHorizontal,{margin:"8px 0"}),a&&React.createElement(c.ParagraphSmall,{element:"p"},a)))},d=t.memo((a=>{let{tooltipProps:n,components:{ContentComponent:l}={ContentComponent:u},infoIconUrl:i,children:c,infoTip:m,clickable:d=!1,hoverable:f=!0,placement:v="top",modifiers:x,...R}=a;const h=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 w=t.useMemo((()=>[...p,...x||[]]),[x]);return React.createElement(r.Popover,e.extends({},R,n,{hoverable:f,clickable:d,placement:v,modifiers:w,components:h,showClose:d}),E&&E)}));d.displayName="Tooltip",exports.Tooltip=d;
+"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;
 //# sourceMappingURL=Tooltip.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.js","sources":["../../../../../../../../src/core/ui/components/molecules/popover/Tooltip.tsx"],"sourcesContent":["import { memo, FC, useMemo, PropsWithChildren } from 'react'\n// import { DividerHorizontal, LayoutBox, IconBase } from '@e1011/es-kit'\n\n\n\nimport { HeadlineTertiary as H3, ParagraphSmall } from '../../atoms/text'\nimport { DividerHorizontal } from '../../dividers'\nimport { LayoutBox } from '../../container'\nimport { IconBase } from '../../icon'\nimport { infoIconJSX } from '../../atoms/icons'\n\nimport { Popover } from './PopoverLite'\nimport { PopoverPlacement, PopoverProps } from './popover.types'\nimport classes from './tooltip.module.scss'\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 & {\n  tooltipProps?: Record<string, unknown>\n  infoIconUrl?: string\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}\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,\n}: TooltipContentProps): JSX.Element => (\n  <div\n    ref={forwardedRef}\n    className={classes['popover-tooltip']}\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 * 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","React","createElement","ref","className","classes","default","id","arrow","LayoutBox","padding","direction","width","height","flexGrow","justify","align","H3","onClick","onKeyDown","role","tabIndex","IconBase","iconUrl","infoIconJSX","DividerHorizontal","margin","ParagraphSmall","element","Tooltip","memo","_ref2","tooltipProps","components","ContentComponent","infoIconUrl","children","infoTip","clickable","hoverable","modifiers","props","popoverComponents","useMemo","undefined","TargetNode","size","color","style","lineHeight","mergedModifiers","Popover","_extends","extends","displayName"],"mappings":"ucAgCA,MAAMA,EAAmB,CACvB,CACEC,KAAM,SACNC,QAAS,CACPC,OAAQ,CAAC,EAAG,IACZC,UAAWC,EAAgBA,iBAACC,OA2B5BC,EAAiBC,IAAA,IAACC,aACtBA,EAAYC,MAAEA,EAAKC,KAAEA,EAAIC,KAAEA,EAAIC,UAAEA,EAASC,aAAEA,GACxBN,EAAA,OACpBO,MAAAC,cAAA,MAAA,CACEC,IAAKR,EACLS,UAAWC,EAAOC,QAAC,oBAEnBL,MAAAC,cAAA,MAAA,CAAKK,GAAG,QAAQ,qBAAiB,EAACH,UAAWC,EAAOC,QAACE,OACnDP,MAAAC,cAAA,MAAA,CAAKE,UAAWC,EAAOC,QAAC,kBAE1BL,MAAAC,cAACO,YAAS,CACRC,QAAQ,OACRC,UAAU,SACVC,MAAM,QACNC,OAAO,QACPC,SAAS,KAERlB,GACCK,MAAAC,cAACO,YAAS,CAACM,QAAQ,gBAAgBC,MAAM,QAAQJ,MAAM,OAAOF,QAAQ,KACpET,MAAAC,cAACe,EAAAA,iBAAE,KAAErB,GACJG,GACCE,MAAAC,cAAA,MAAA,CACEgB,QAASpB,EACTqB,UAAWrB,EACXsB,KAAK,SACLC,UAAW,EACXjB,UAAWC,EAAOC,QAAC,iBAElBN,GAAgBC,MAAAC,cAACoB,WAAQ,CAACC,QAASvB,KAClCA,GACAC,MAAAC,cAACoB,EAAAA,SAAQ,KACNE,EACOA,eAMnB5B,GAASK,MAAAC,cAACuB,EAAAA,kBAAiB,CAACC,OAAO,UACnC7B,GAAQI,MAAAC,cAACyB,EAAAA,eAAc,CAACC,QAAQ,KAAK/B,IAEpC,EAeKgC,EAA4BC,EAAIA,MAAeC,IAIxC,IAJyCC,aAC3DA,EAAcC,YAAYC,iBAAEA,GAAqB,CAAEA,iBAAkBzC,GAAgB0C,YACrFA,EAAWC,SACXA,EAAQC,QAAEA,EAAOC,UAAEA,GAAY,EAAKC,UAAEA,GAAY,EAAIjD,UAAEA,EAAY,MAAKkD,UAAEA,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,IAAIzD,KAAsBsD,GAAa,KAAO,CAACA,IAEtF,OACEvC,MAAAC,cAACiD,EAAOA,QAAAC,EAAAC,QAAA,CAAA,EACFZ,EACAT,EAAY,CAChBO,UAAWA,EACXD,UAAWA,EACXhD,UAAWA,EACXkD,UAAWU,EACXjB,WAAYS,EACZ3C,UAAWuC,IAEVO,GAAcA,EACP,IASdhB,EAAQyB,YAAc"}
+{"version":3,"file":"Tooltip.js","sources":["../../../../../../../../src/core/ui/components/molecules/popover/Tooltip.tsx"],"sourcesContent":["import { memo, FC, useMemo, PropsWithChildren } from 'react'\n// import { DividerHorizontal, LayoutBox, IconBase } from '@e1011/es-kit'\n\n\n\nimport { HeadlineTertiary as H3, ParagraphSmall } from '../../atoms/text'\nimport { DividerHorizontal } from '../../dividers'\nimport { LayoutBox } from '../../container'\nimport { IconBase } from '../../icon'\nimport { infoIconJSX } from '../../atoms/icons'\nimport { classNames } from '../../../../utils'\n\nimport { Popover } from './PopoverLite'\nimport { PopoverPlacement, PopoverProps } from './popover.types'\nimport classes from './tooltip.module.scss'\n\n\n/**\n\nModifiers for the Popover component used in Tooltip.\n*/\nconst popoverModifiers = [\n  {\n    name: 'offset',\n    options: {\n      offset: [0, 10],\n      placement: PopoverPlacement.Top,\n    },\n  },\n]\n\n/**\n\nProps for the TooltipContent component.\n@typedef {Object} TooltipContentProps\n@property {ForwardedRef} forwardedRef - Forwarded ref of the TooltipContent component.\n@property {string} title - Title of the tooltip.\n@property {string} text - Text content of the tooltip.\n@property {Function} hide - Function to hide the tooltip.\n@property {boolean} showClose - Determines whether to show a close button in the tooltip.\n@extends PropsWithChildren\n*/\ntype TooltipContentProps = PropsWithChildren<any> & {\n  forwardedRef: ForwardedRef\n  closeIconUrl?: string\n  className?: string\n  title?: string\n  text?: string\n  hide: () => void\n  showClose?: boolean\n}\n\n/**\n\n  Tooltip content component used by the Tooltip component.\n  @param {TooltipContentProps} props - Props for the TooltipContent component.\n  @returns {JSX.Element} - Returns the JSX element for the TooltipContent component.\n  */\nconst TooltipContent = ({\n  forwardedRef, title, text, hide, showClose, closeIconUrl, className = '',\n}: TooltipContentProps): JSX.Element => (\n  <div\n    ref={forwardedRef}\n    className={classNames(classes['popover-tooltip'], className)}\n  >\n    <div id='arrow' data-popper-arrow className={classes.arrow}>\n      <div className={classes['arrow-inner']} />\n    </div>\n    <LayoutBox\n      padding='1rem'\n      direction='column'\n      width='256px'\n      height='unset'\n      flexGrow='1'\n    >\n      {title && (\n        <LayoutBox justify='space-between' align='start' width='100%' padding='0'>\n          <H3>{title}</H3>\n          {showClose && (\n            <div\n              onClick={hide}\n              onKeyDown={hide}\n              role='button'\n              tabIndex={-1}\n              className={classes['close-button']}\n            >\n              {closeIconUrl && <IconBase iconUrl={closeIconUrl} />}\n              {!closeIconUrl && (\n                <IconBase>\n                  {infoIconJSX}\n                </IconBase>\n              )}\n            </div>\n          )}\n        </LayoutBox>\n      )}\n      {title && <DividerHorizontal margin='8px 0' />}\n      {text && <ParagraphSmall element='p'>{text}</ParagraphSmall>}\n    </LayoutBox>\n  </div>\n)\n\n\n\n/**\n\nProps for the Tooltip component, extends PopoverProps.\n@typedef {Object} TooltipProps\n@property {Record<string, unknown>} [tooltipProps] - Additional props to be passed to the underlying Popover component.\n@extends PopoverProps\n*/\nexport type TooltipProps = PopoverProps & TooltipContentProps & {\n  tooltipProps?: Record<string, unknown>\n  infoIconUrl?: string\n}\n\n\n/**\n * A tooltip component that displays a short message when the user hovers or clicks on a target element.\n *\n * @param tooltipProps - Optional properties to be passed down to the `Popover` component.\n * @param components - Optional components that can be customized by the consumer.\n * @param children - The target element that the tooltip will be anchored to.\n * @param infoTip - If no `children` prop is passed in, an information icon will be used as the target element.\n * @param clickable - If `true`, the tooltip will be triggered by a click instead of a hover.\n * @param hoverable - If `true`, the tooltip will be triggered by a hover. Defaults to `true`.\n * @param placement - The placement of the tooltip relative to the target element.\n * @param modifiers - Optional modifiers to be passed down to the `Popover` component.\n */\nexport const Tooltip: FC<TooltipProps> = memo<TooltipProps>(({\n  tooltipProps, components: { ContentComponent } = { ContentComponent: TooltipContent },\n  infoIconUrl,\n  children, infoTip, clickable = false, hoverable = true, placement = 'top', modifiers, ...props\n}: TooltipProps) => {\n  const popoverComponents = useMemo(() => (ContentComponent ? {\n    ContentComponent,\n  } : undefined), [ContentComponent])\n\n  let TargetNode: typeof children\n\n  if (children) {\n    TargetNode = children\n  }\n  if (!children && infoTip) {\n    TargetNode = (\n      infoIconUrl\n        ? <IconBase iconUrl={infoIconUrl} size='1rem' color='#00336640' style={{ lineHeight: '1px' }} />\n        : (\n          <IconBase size='1rem' color='#00336640' style={{ lineHeight: '1px' }}>\n            {infoIconJSX}\n          </IconBase>\n        )\n    )\n  }\n\n  const mergedModifiers = useMemo(() => ([...popoverModifiers, ...(modifiers || [])]), [modifiers])\n\n  return (\n    <Popover\n      {...props}\n      {...tooltipProps}\n      hoverable={hoverable}\n      clickable={clickable}\n      placement={placement}\n      modifiers={mergedModifiers}\n      components={popoverComponents}\n      showClose={clickable}\n    >\n      {TargetNode && TargetNode}\n    </Popover>\n  )\n})\n\n/**\n * The display name of the Tooltip component.\n *\n * @type {string}\n */\nTooltip.displayName = 'Tooltip'\n\n"],"names":["popoverModifiers","name","options","offset","placement","PopoverPlacement","Top","TooltipContent","_ref","forwardedRef","title","text","hide","showClose","closeIconUrl","className","React","createElement","ref","classNames","classes","id","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"}

package/dist/utils/esm/index.css

@@ -1,3 +1,12 @@
+.errorBoundary-module_errorBoundary__gk9ps {
+  background: #EFEFEF;
+  width: 100%;
+  height: 100%;
+}
+
+.errorBoundary-module_StyledIcon__IYHiU {
+  margin-right: 10px;
+}
 .icon-module_icon-base-parent__nOMvW {
   line-height: 1px !important;
 }
@@ -28,15 +37,6 @@
   width: var(--height);
   height: var(--width);
 }
-.errorBoundary-module_errorBoundary__gk9ps {
-  background: #EFEFEF;
-  width: 100%;
-  height: 100%;
-}
-
-.errorBoundary-module_StyledIcon__IYHiU {
-  margin-right: 10px;
-}
 .CollapsibleContainer-module_collapsible-container__u0Jmm {
   transform-origin: 0% 0%;
   opacity: 0;
@@ -230,6 +230,77 @@
     stroke-dashoffset: -124;
   }
 }
+.textAndContent-module_textAndContent__X5P1n {
+  align-items: baseline;
+  flex-shrink: 1;
+  gap: 8px;
+}
+:root {
+  --divider-line: #4a4b4b;
+}
+
+.typography-module_overflow-hidden__UmQ-v, .typography-module_text-truncate__8MgV9 {
+  overflow: hidden !important;
+}
+
+.typography-module_text-nowrap__dt3uu, .typography-module_text-truncate__8MgV9 {
+  white-space: nowrap !important;
+}
+
+.typography-module_text-ellipsis__iyHeZ, .typography-module_text-truncate__8MgV9 {
+  text-overflow: ellipsis !important;
+}
+
+.typography-module_headline__b0XlP {
+  font-size: 28px;
+  line-height: 32px;
+}
+
+.typography-module_headlineSecondary__IDnhT {
+  font-size: 24px;
+  line-height: 28px;
+}
+
+.typography-module_headlineTertiary__mlG-v {
+  font-size: 18px;
+  line-height: 24x;
+}
+
+.typography-module_paragraph__tgBAx, .typography-module_paragraphBold__PmcZU, .typography-module_paragraphBoldSmall__qExmY, .typography-module_paragraphSmall__vTMiI {
+  font-size: 14px;
+  line-height: 18px;
+  font-weight: 300;
+}
+
+.typography-module_paragraphSmall__vTMiI, .typography-module_paragraphBoldSmall__qExmY {
+  font-size: 12px;
+}
+
+.typography-module_paragraphBold__PmcZU, .typography-module_paragraphBoldSmall__qExmY {
+  font-weight: 600;
+}
+
+.typography-module_link__DWurf {
+  overflow: hidden !important;
+  white-space: nowrap !important;
+  text-overflow: ellipsis !important;
+  text-decoration: none;
+  color: #65C5F6;
+  display: inline;
+  gap: 4px;
+  flex-grow: 0;
+  max-width: 400px;
+  position: relative;
+  vertical-align: center;
+}
+.typography-module_link__DWurf:hover:not(.typography-module_disabled__hjK8C) {
+  text-decoration: underline;
+  color: #65C5F6;
+}
+.typography-module_link__DWurf.typography-module_disabled__hjK8C {
+  pointer-events: none;
+  opacity: 0.6;
+}
 :root {
   --divider-line: #4a4b4b;
 }
@@ -512,90 +583,6 @@
   --divider-line: #4a4b4b;
 }
 
-.typography-module_overflow-hidden__UmQ-v, .typography-module_text-truncate__8MgV9 {
-  overflow: hidden !important;
-}
-
-.typography-module_text-nowrap__dt3uu, .typography-module_text-truncate__8MgV9 {
-  white-space: nowrap !important;
-}
-
-.typography-module_text-ellipsis__iyHeZ, .typography-module_text-truncate__8MgV9 {
-  text-overflow: ellipsis !important;
-}
-
-.typography-module_headline__b0XlP {
-  font-size: 28px;
-  line-height: 32px;
-}
-
-.typography-module_headlineSecondary__IDnhT {
-  font-size: 24px;
-  line-height: 28px;
-}
-
-.typography-module_headlineTertiary__mlG-v {
-  font-size: 18px;
-  line-height: 24x;
-}
-
-.typography-module_paragraph__tgBAx, .typography-module_paragraphBold__PmcZU, .typography-module_paragraphBoldSmall__qExmY, .typography-module_paragraphSmall__vTMiI {
-  font-size: 14px;
-  line-height: 18px;
-  font-weight: 300;
-}
-
-.typography-module_paragraphSmall__vTMiI, .typography-module_paragraphBoldSmall__qExmY {
-  font-size: 12px;
-}
-
-.typography-module_paragraphBold__PmcZU, .typography-module_paragraphBoldSmall__qExmY {
-  font-weight: 600;
-}
-
-.typography-module_link__DWurf {
-  overflow: hidden !important;
-  white-space: nowrap !important;
-  text-overflow: ellipsis !important;
-  text-decoration: none;
-  color: #65C5F6;
-  display: inline;
-  gap: 4px;
-  flex-grow: 0;
-  max-width: 400px;
-  position: relative;
-  vertical-align: center;
-}
-.typography-module_link__DWurf:hover:not(.typography-module_disabled__hjK8C) {
-  text-decoration: underline;
-  color: #65C5F6;
-}
-.typography-module_link__DWurf.typography-module_disabled__hjK8C {
-  pointer-events: none;
-  opacity: 0.6;
-}
-.textAndContent-module_textAndContent__X5P1n {
-  align-items: baseline;
-  flex-shrink: 1;
-  gap: 8px;
-}
-.flowLayout-module_flowLayout__VHpnY {
-  overflow: auto;
-}
-.flowLayout-module_flowLayout__VHpnY .flowLayout-module_beforeContent__rY-mW {
-  display: flex;
-  width: 100%;
-  min-width: 0;
-}
-.flowLayout-module_flowLayout__VHpnY .flowLayout-module_afterContent__Hlh8v {
-  display: flex;
-  width: 100%;
-  min-width: 0;
-}
-:root {
-  --divider-line: #4a4b4b;
-}
-
 .toggle-module_overflow-hidden__NxfFx, .toggle-module_text-truncate__Wg-Jx {
   overflow: hidden !important;
 }
@@ -699,28 +686,114 @@
 .cui-theme-light .toggle-module_toggle__p1Ep4 input:checked + .toggle-module_slider__2IVaG:hover {
   background-color: #374646;
 }
-.popup-overlay-module_popup-modal-overlay__dlJqM {
-  z-index: 1;
-  position: fixed;
+.flowLayout-module_flowLayout__VHpnY {
+  overflow: auto;
+}
+.flowLayout-module_flowLayout__VHpnY .flowLayout-module_beforeContent__rY-mW {
+  display: flex;
   width: 100%;
-  height: 100%;
-  top: 0;
-  left: 0;
-  background: rgba(40, 80, 120, 0.8) !important;
-  pointer-events: all;
-  user-select: none;
+  min-width: 0;
+}
+.flowLayout-module_flowLayout__VHpnY .flowLayout-module_afterContent__Hlh8v {
+  display: flex;
+  width: 100%;
+  min-width: 0;
+}
+:root {
+  --divider-line: #4a4b4b;
+}
+
+.popup-module_overflow-hidden__uimg4, .popup-module_text-truncate__y-5c1 {
+  overflow: hidden !important;
+}
+
+.popup-module_text-nowrap__eDCv3, .popup-module_text-truncate__y-5c1 {
+  white-space: nowrap !important;
+}
+
+.popup-module_text-ellipsis__yu8nx, .popup-module_text-truncate__y-5c1 {
+  text-overflow: ellipsis !important;
+}
+
+.popup-module_popup-container__PJ0oQ {
+  --popup-width: 60vw;
+  --popup-height: 50vh;
+  position: fixed;
+  width: var(--popup-width);
+  height: var(--popup-height);
+  --slideXFrom: 0;
+  --slideYFrom: 0;
   will-change: opacity;
-  transition: opacity 450ms ease-in-out;
+  transition: opacity 300ms ease-in-out;
   opacity: 0;
   visibility: hidden;
+  pointer-events: none;
 }
-.popup-overlay-module_popup-modal-overlay__dlJqM[data-show] {
+.popup-module_popup-container__PJ0oQ .popup-module_popup-container-inner__n83Cz {
+  position: relative;
+  flex-direction: column;
+  align-items: start;
+  width: 100%;
+  height: 100%;
+  overflow-x: clip;
+  background-color: #090A0A;
+  border-radius: 4px;
+  box-shadow: 0px 10px 20px 4px rgba(0, 0, 0, 0.15);
+  transition: transform 350ms ease-out;
+  will-change: transform;
+  transform: translateX(var(--slideXFrom)) translateY(var(--slideYFrom));
+}
+.popup-module_popup-container__PJ0oQ .popup-module_popup-container-inner__n83Cz button {
+  margin-bottom: 0;
+}
+.popup-module_popup-container__PJ0oQ .popup-module_popup-container-inner__n83Cz .popup-module_close-button__-8sZx {
+  cursor: pointer;
+  line-height: 1px;
+  background-color: rgba(255, 255, 255, 0);
+}
+.popup-module_popup-container__PJ0oQ .popup-module_popup-container-inner__n83Cz .popup-module_close-button__-8sZx .icon-base {
+  background-color: #FDDA0D;
+  width: 9px !important;
+  height: 9px !important;
+  line-height: 1px !important;
+}
+.popup-module_popup-container__PJ0oQ .popup-module_popup-container-inner__n83Cz .popup-module_close-button__-8sZx:hover .icon-base {
+  background-color: #FFEA00;
+}
+.popup-module_popup-container__PJ0oQ .popup-module_popup-container-inner__n83Cz .popup-module_popup-container-inner-div__sDNBm {
+  width: 100%;
+  height: 100%;
+  padding: 24px;
+  overflow-y: auto;
+  display: flex;
+}
+.popup-module_popup-container__PJ0oQ .popup-module_popup-container-inner__n83Cz .popup-module_popup-container-inner-div__sDNBm > * {
+  overflow-y: auto;
+}
+.popup-module_popup-container__PJ0oQ[data-show] {
   opacity: 1;
   visibility: visible;
+  pointer-events: all;
 }
-.popup-overlay-module_popup-modal-overlay__dlJqM[data-show=false] {
+.popup-module_popup-container__PJ0oQ[data-show] .popup-module_popup-container-inner__n83Cz {
+  transform: translateX(0) translateY(0);
+}
+.popup-module_popup-container__PJ0oQ[data-show=false] {
   opacity: 0;
   visibility: hidden;
+  pointer-events: none;
+}
+.popup-module_popup-container__PJ0oQ[data-show=false] .popup-module_popup-container-inner__n83Cz {
+  transform: translateX(var(--slideXFrom)) translateY(var(--slideYFrom));
+}
+
+.cui-theme-dark .popup-module_popup-container-inner__n83Cz {
+  background-color: #090A0A;
+  color: #F4F4F4;
+}
+.cui-theme-light .popup-module_popup-container-inner__n83Cz {
+  background-color: #090A0A;
+  color: #F4F4F4;
 }
 :root {
   --divider-line: #4a4b4b;
@@ -836,101 +909,28 @@
 .cui-theme-light .tooltip-module_popover-tooltip__sAhKa .tooltip-module_arrow-inner__IqzxY {
   border-color: #515757 transparent transparent transparent;
 }
-:root {
-  --divider-line: #4a4b4b;
-}
-
-.popup-module_overflow-hidden__uimg4, .popup-module_text-truncate__y-5c1 {
-  overflow: hidden !important;
-}
-
-.popup-module_text-nowrap__eDCv3, .popup-module_text-truncate__y-5c1 {
-  white-space: nowrap !important;
-}
-
-.popup-module_text-ellipsis__yu8nx, .popup-module_text-truncate__y-5c1 {
-  text-overflow: ellipsis !important;
-}
-
-.popup-module_popup-container__PJ0oQ {
-  --popup-width: 60vw;
-  --popup-height: 50vh;
+.popup-overlay-module_popup-modal-overlay__dlJqM {
+  z-index: 1;
   position: fixed;
-  width: var(--popup-width);
-  height: var(--popup-height);
-  --slideXFrom: 0;
-  --slideYFrom: 0;
+  width: 100%;
+  height: 100%;
+  top: 0;
+  left: 0;
+  background: rgba(40, 80, 120, 0.8) !important;
+  pointer-events: all;
+  user-select: none;
   will-change: opacity;
-  transition: opacity 300ms ease-in-out;
+  transition: opacity 450ms ease-in-out;
   opacity: 0;
   visibility: hidden;
-  pointer-events: none;
-}
-.popup-module_popup-container__PJ0oQ .popup-module_popup-container-inner__n83Cz {
-  position: relative;
-  flex-direction: column;
-  align-items: start;
-  width: 100%;
-  height: 100%;
-  overflow-x: clip;
-  background-color: #090A0A;
-  border-radius: 4px;
-  box-shadow: 0px 10px 20px 4px rgba(0, 0, 0, 0.15);
-  transition: transform 350ms ease-out;
-  will-change: transform;
-  transform: translateX(var(--slideXFrom)) translateY(var(--slideYFrom));
 }
-.popup-module_popup-container__PJ0oQ .popup-module_popup-container-inner__n83Cz button {
-  margin-bottom: 0;
-}
-.popup-module_popup-container__PJ0oQ .popup-module_popup-container-inner__n83Cz .popup-module_close-button__-8sZx {
-  cursor: pointer;
-  line-height: 1px;
-  background-color: rgba(255, 255, 255, 0);
-}
-.popup-module_popup-container__PJ0oQ .popup-module_popup-container-inner__n83Cz .popup-module_close-button__-8sZx .icon-base {
-  background-color: #FDDA0D;
-  width: 9px !important;
-  height: 9px !important;
-  line-height: 1px !important;
-}
-.popup-module_popup-container__PJ0oQ .popup-module_popup-container-inner__n83Cz .popup-module_close-button__-8sZx:hover .icon-base {
-  background-color: #FFEA00;
-}
-.popup-module_popup-container__PJ0oQ .popup-module_popup-container-inner__n83Cz .popup-module_popup-container-inner-div__sDNBm {
-  width: 100%;
-  height: 100%;
-  padding: 24px;
-  overflow-y: auto;
-  display: flex;
-}
-.popup-module_popup-container__PJ0oQ .popup-module_popup-container-inner__n83Cz .popup-module_popup-container-inner-div__sDNBm > * {
-  overflow-y: auto;
-}
-.popup-module_popup-container__PJ0oQ[data-show] {
+.popup-overlay-module_popup-modal-overlay__dlJqM[data-show] {
   opacity: 1;
   visibility: visible;
-  pointer-events: all;
-}
-.popup-module_popup-container__PJ0oQ[data-show] .popup-module_popup-container-inner__n83Cz {
-  transform: translateX(0) translateY(0);
 }
-.popup-module_popup-container__PJ0oQ[data-show=false] {
+.popup-overlay-module_popup-modal-overlay__dlJqM[data-show=false] {
   opacity: 0;
   visibility: hidden;
-  pointer-events: none;
-}
-.popup-module_popup-container__PJ0oQ[data-show=false] .popup-module_popup-container-inner__n83Cz {
-  transform: translateX(var(--slideXFrom)) translateY(var(--slideYFrom));
-}
-
-.cui-theme-dark .popup-module_popup-container-inner__n83Cz {
-  background-color: #090A0A;
-  color: #F4F4F4;
-}
-.cui-theme-light .popup-module_popup-container-inner__n83Cz {
-  background-color: #090A0A;
-  color: #F4F4F4;
 }
 :root {
   --divider-line: #4a4b4b;

package/dist/utils/esm/node_modules/dayjs/plugin/customParseFormat.js

@@ -1,2 +1,2 @@
-import{commonjsGlobal as t,getDefaultExportFromCjs as e}from"../../../_virtual/_commonjsHelpers.js";import{__module as r}from"../../../_virtual/customParseFormat.js";r.exports=function(){var t={LTS:"h:mm:ss A",LT:"h:mm A",L:"MM/DD/YYYY",LL:"MMMM D, YYYY",LLL:"MMMM D, YYYY h:mm A",LLLL:"dddd, MMMM D, YYYY h:mm A"},e=/(\[[^[]*\])|([-_:/.,()\s]+)|(A|a|YYYY|YY?|MM?M?M?|Do|DD?|hh?|HH?|mm?|ss?|S{1,3}|z|ZZ?)/g,r=/\d\d/,n=/\d\d?/,i=/\d*[^-_:/,()\s\d]+/,o={},s=function(t){return(t=+t)+(t>68?1900:2e3)},a=function(t){return function(e){this[t]=+e}},f=[/[+-]\d\d:?(\d\d)?|Z/,function(t){(this.zone||(this.zone={})).offset=function(t){if(!t)return 0;if("Z"===t)return 0;var e=t.match(/([+-]|\d\d)/g),r=60*e[1]+(+e[2]||0);return 0===r?0:"+"===e[0]?-r:r}(t)}],h=function(t){var e=o[t];return e&&(e.indexOf?e:e.s.concat(e.f))},u=function(t,e){var r,n=o.meridiem;if(n){for(var i=1;i<=24;i+=1)if(t.indexOf(n(i,0,e))>-1){r=i>12;break}}else r=t===(e?"pm":"PM");return r},c={A:[i,function(t){this.afternoon=u(t,!1)}],a:[i,function(t){this.afternoon=u(t,!0)}],S:[/\d/,function(t){this.milliseconds=100*+t}],SS:[r,function(t){this.milliseconds=10*+t}],SSS:[/\d{3}/,function(t){this.milliseconds=+t}],s:[n,a("seconds")],ss:[n,a("seconds")],m:[n,a("minutes")],mm:[n,a("minutes")],H:[n,a("hours")],h:[n,a("hours")],HH:[n,a("hours")],hh:[n,a("hours")],D:[n,a("day")],DD:[r,a("day")],Do:[i,function(t){var e=o.ordinal,r=t.match(/\d+/);if(this.day=r[0],e)for(var n=1;n<=31;n+=1)e(n).replace(/\[|\]/g,"")===t&&(this.day=n)}],M:[n,a("month")],MM:[r,a("month")],MMM:[i,function(t){var e=h("months"),r=(h("monthsShort")||e.map((function(t){return t.slice(0,3)}))).indexOf(t)+1;if(r<1)throw new Error;this.month=r%12||r}],MMMM:[i,function(t){var e=h("months").indexOf(t)+1;if(e<1)throw new Error;this.month=e%12||e}],Y:[/[+-]?\d+/,a("year")],YY:[r,function(t){this.year=s(t)}],YYYY:[/\d{4}/,a("year")],Z:f,ZZ:f};function d(r){var n,i;n=r,i=o&&o.formats;for(var s=(r=n.replace(/(\[[^\]]+])|(LTS?|l{1,4}|L{1,4})/g,(function(e,r,n){var o=n&&n.toUpperCase();return r||i[n]||t[n]||i[o].replace(/(\[[^\]]+])|(MMMM|MM|DD|dddd)/g,(function(t,e,r){return e||r.slice(1)}))}))).match(e),a=s.length,f=0;f<a;f+=1){var h=s[f],u=c[h],d=u&&u[0],m=u&&u[1];s[f]=m?{regex:d,parser:m}:h.replace(/^\[|\]$/g,"")}return function(t){for(var e={},r=0,n=0;r<a;r+=1){var i=s[r];if("string"==typeof i)n+=i.length;else{var o=i.regex,f=i.parser,h=t.slice(n),u=o.exec(h)[0];f.call(e,u),t=t.replace(u,"")}}return function(t){var e=t.afternoon;if(void 0!==e){var r=t.hours;e?r<12&&(t.hours+=12):12===r&&(t.hours=0),delete t.afternoon}}(e),e}}return function(t,e,r){r.p.customParseFormat=!0,t&&t.parseTwoDigitYear&&(s=t.parseTwoDigitYear);var n=e.prototype,i=n.parse;n.parse=function(t){var e=t.date,n=t.utc,s=t.args;this.$u=n;var a=s[1];if("string"==typeof a){var f=!0===s[2],h=!0===s[3],u=f||h,c=s[2];h&&(c=s[2]),o=this.$locale(),!f&&c&&(o=r.Ls[c]),this.$d=function(t,e,r){try{if(["x","X"].indexOf(e)>-1)return new Date(("X"===e?1e3:1)*t);var n=d(e)(t),i=n.year,o=n.month,s=n.day,a=n.hours,f=n.minutes,h=n.seconds,u=n.milliseconds,c=n.zone,m=new Date,l=s||(i||o?1:m.getDate()),M=i||m.getFullYear(),Y=0;i&&!o||(Y=o>0?o-1:m.getMonth());var v=a||0,p=f||0,D=h||0,g=u||0;return c?new Date(Date.UTC(M,Y,l,v,p,D,g+60*c.offset*1e3)):r?new Date(Date.UTC(M,Y,l,v,p,D,g)):new Date(M,Y,l,v,p,D,g)}catch(t){return new Date("")}}(e,a,n),this.init(),c&&!0!==c&&(this.$L=this.locale(c).$L),u&&e!=this.format(a)&&(this.$d=new Date("")),o={}}else if(a instanceof Array)for(var m=a.length,l=1;l<=m;l+=1){s[1]=a[l-1];var M=r.apply(this,s);if(M.isValid()){this.$d=M.$d,this.$L=M.$L,this.init();break}l===m&&(this.$d=new Date(""))}else i.call(this,t)}}}();var n=e(r.exports);export{n as default};
+import{commonjsGlobal as t,getDefaultExportFromCjs as e}from"../../../_virtual/_commonjsHelpers.js";import{__module as r}from"../../../_virtual/customParseFormat.js";r.exports=function(){var t={LTS:"h:mm:ss A",LT:"h:mm A",L:"MM/DD/YYYY",LL:"MMMM D, YYYY",LLL:"MMMM D, YYYY h:mm A",LLLL:"dddd, MMMM D, YYYY h:mm A"},e=/(\[[^[]*\])|([-_:/.,()\s]+)|(A|a|Q|YYYY|YY?|ww?|MM?M?M?|Do|DD?|hh?|HH?|mm?|ss?|S{1,3}|z|ZZ?)/g,r=/\d/,n=/\d\d/,i=/\d\d?/,o=/\d*[^-_:/,()\s\d]+/,s={},a=function(t){return(t=+t)+(t>68?1900:2e3)},f=function(t){return function(e){this[t]=+e}},h=[/[+-]\d\d:?(\d\d)?|Z/,function(t){(this.zone||(this.zone={})).offset=function(t){if(!t)return 0;if("Z"===t)return 0;var e=t.match(/([+-]|\d\d)/g),r=60*e[1]+(+e[2]||0);return 0===r?0:"+"===e[0]?-r:r}(t)}],u=function(t){var e=s[t];return e&&(e.indexOf?e:e.s.concat(e.f))},c=function(t,e){var r,n=s.meridiem;if(n){for(var i=1;i<=24;i+=1)if(t.indexOf(n(i,0,e))>-1){r=i>12;break}}else r=t===(e?"pm":"PM");return r},d={A:[o,function(t){this.afternoon=c(t,!1)}],a:[o,function(t){this.afternoon=c(t,!0)}],Q:[r,function(t){this.month=3*(t-1)+1}],S:[r,function(t){this.milliseconds=100*+t}],SS:[n,function(t){this.milliseconds=10*+t}],SSS:[/\d{3}/,function(t){this.milliseconds=+t}],s:[i,f("seconds")],ss:[i,f("seconds")],m:[i,f("minutes")],mm:[i,f("minutes")],H:[i,f("hours")],h:[i,f("hours")],HH:[i,f("hours")],hh:[i,f("hours")],D:[i,f("day")],DD:[n,f("day")],Do:[o,function(t){var e=s.ordinal,r=t.match(/\d+/);if(this.day=r[0],e)for(var n=1;n<=31;n+=1)e(n).replace(/\[|\]/g,"")===t&&(this.day=n)}],w:[i,f("week")],ww:[n,f("week")],M:[i,f("month")],MM:[n,f("month")],MMM:[o,function(t){var e=u("months"),r=(u("monthsShort")||e.map((function(t){return t.slice(0,3)}))).indexOf(t)+1;if(r<1)throw new Error;this.month=r%12||r}],MMMM:[o,function(t){var e=u("months").indexOf(t)+1;if(e<1)throw new Error;this.month=e%12||e}],Y:[/[+-]?\d+/,f("year")],YY:[n,function(t){this.year=a(t)}],YYYY:[/\d{4}/,f("year")],Z:h,ZZ:h};function m(r){var n,i;n=r,i=s&&s.formats;for(var o=(r=n.replace(/(\[[^\]]+])|(LTS?|l{1,4}|L{1,4})/g,(function(e,r,n){var o=n&&n.toUpperCase();return r||i[n]||t[n]||i[o].replace(/(\[[^\]]+])|(MMMM|MM|DD|dddd)/g,(function(t,e,r){return e||r.slice(1)}))}))).match(e),a=o.length,f=0;f<a;f+=1){var h=o[f],u=d[h],c=u&&u[0],m=u&&u[1];o[f]=m?{regex:c,parser:m}:h.replace(/^\[|\]$/g,"")}return function(t){for(var e={},r=0,n=0;r<a;r+=1){var i=o[r];if("string"==typeof i)n+=i.length;else{var s=i.regex,f=i.parser,h=t.slice(n),u=s.exec(h)[0];f.call(e,u),t=t.replace(u,"")}}return function(t){var e=t.afternoon;if(void 0!==e){var r=t.hours;e?r<12&&(t.hours+=12):12===r&&(t.hours=0),delete t.afternoon}}(e),e}}return function(t,e,r){r.p.customParseFormat=!0,t&&t.parseTwoDigitYear&&(a=t.parseTwoDigitYear);var n=e.prototype,i=n.parse;n.parse=function(t){var e=t.date,n=t.utc,o=t.args;this.$u=n;var a=o[1];if("string"==typeof a){var f=!0===o[2],h=!0===o[3],u=f||h,c=o[2];h&&(c=o[2]),s=this.$locale(),!f&&c&&(s=r.Ls[c]),this.$d=function(t,e,r,n){try{if(["x","X"].indexOf(e)>-1)return new Date(("X"===e?1e3:1)*t);var i=m(e)(t),o=i.year,s=i.month,a=i.day,f=i.hours,h=i.minutes,u=i.seconds,c=i.milliseconds,d=i.zone,l=i.week,M=new Date,Y=a||(o||s?1:M.getDate()),v=o||M.getFullYear(),p=0;o&&!s||(p=s>0?s-1:M.getMonth());var D,w=f||0,g=h||0,L=u||0,y=c||0;return d?new Date(Date.UTC(v,p,Y,w,g,L,y+60*d.offset*1e3)):r?new Date(Date.UTC(v,p,Y,w,g,L,y)):(D=new Date(v,p,Y,w,g,L,y),l&&(D=n(D).week(l).toDate()),D)}catch(t){return new Date("")}}(e,a,n,r),this.init(),c&&!0!==c&&(this.$L=this.locale(c).$L),u&&e!=this.format(a)&&(this.$d=new Date("")),s={}}else if(a instanceof Array)for(var d=a.length,l=1;l<=d;l+=1){o[1]=a[l-1];var M=r.apply(this,o);if(M.isValid()){this.$d=M.$d,this.$L=M.$L,this.init();break}l===d&&(this.$d=new Date(""))}else i.call(this,t)}}}();var n=e(r.exports);export{n as default};
 //# sourceMappingURL=customParseFormat.js.map