iguazio.dashboard-react-controls 2.2.25 → 3.0.1

package/dist/components/FormToggle/FormToggle.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"FormToggle.mjs","sources":["../../../src/lib/components/FormToggle/FormToggle.jsx"],"sourcesContent":["/*\nCopyright 2022 Iguazio Systems Ltd.\nLicensed under the Apache License, Version 2.0 (the \"License\") with\nan addition restriction as set forth herein. You may not use this\nfile except in compliance with the License. You may obtain a copy of\nthe License at http://www.apache.org/licenses/LICENSE-2.0.\nUnless required by applicable law or agreed to in writing, software\ndistributed under the License is distributed on an \"AS IS\" BASIS,\nWITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or\nimplied. See the License for the specific language governing\npermissions and limitations under the License.\nIn addition, you may not use the software for any purposes that are\nillegal under applicable law, and the grant of the foregoing license\nunder the Apache 2.0 license is conditioned upon your compliance with\nsuch restriction.\n*/\nimport React from 'react'\nimport classnames from 'classnames'\nimport PropTypes from 'prop-types'\nimport { Field } from 'react-final-form'\n\nimport { DENSITY } from '../../types.js'\n\nimport './formToggle.scss'\n\nconst FormToggle = ({ density = '', label = '', name, onChange = () => {}, ...inputProps }) => {\n  const toggleWrapperClassNames = classnames(\n    'form-field__wrapper',\n    density && `form-field__wrapper-${density}`\n  )\n\n  return (\n    <Field name={name} value={inputProps.value} type=\"checkbox\">\n      {({ input }) => {\n        return (\n          <label\n            className=\"form-field-toggle\"\n            data-testid={name ? `${name}-form-field-toggle` : 'form-field-toggle'}\n          >\n            {label && <div className=\"form-field__label\">{label}</div>}\n            <input\n              data-testid={name ? `${name}-form-toggle` : 'form-toggle'}\n              id={name}\n              {...{ ...input, ...inputProps }}\n              onChange={event => {\n                onChange && onChange(event)\n                input.onChange(event)\n              }}\n              type=\"checkbox\"\n            />\n            <div className={toggleWrapperClassNames}>\n              <span className=\"form-field-toggle__switch\" />\n            </div>\n          </label>\n        )\n      }}\n    </Field>\n  )\n}\n\nFormToggle.propTypes = {\n  density: DENSITY,\n  label: PropTypes.string,\n  name: PropTypes.string.isRequired,\n  onChange: PropTypes.func\n}\n\nexport default FormToggle\n"],"names":["FormToggle","density","label","name","onChange","inputProps","toggleWrapperClassNames","classnames","jsx","Field","input","jsxs","event","DENSITY","PropTypes"],"mappings":";;;;;;;AAyBM,MAAAA,IAAa,CAAC,EAAE,SAAAC,IAAU,IAAI,OAAAC,IAAQ,IAAI,MAAAC,GAAM,UAAAC,IAAW,MAAM;AAAC,GAAG,GAAGC,QAAiB;AAC7F,QAAMC,IAA0BC;AAAA,IAC9B;AAAA,IACAN,KAAW,uBAAuBA,CAAO;AAAA,EAC3C;AAGE,SAAA,gBAAAO,EAACC,GAAM,EAAA,MAAAN,GAAY,OAAOE,EAAW,OAAO,MAAK,YAC9C,UAAA,CAAC,EAAE,OAAAK,EAAA,MAEA,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,eAAaR,IAAO,GAAGA,CAAI,uBAAuB;AAAA,MAEjD,UAAA;AAAA,QAAAD,KAAU,gBAAAM,EAAA,OAAA,EAAI,WAAU,qBAAqB,UAAMN,GAAA;AAAA,QACpD,gBAAAM;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,eAAaL,IAAO,GAAGA,CAAI,iBAAiB;AAAA,YAC5C,IAAIA;AAAA,YACE,GAAGO;AAAA,YAAO,GAAGL;AAAA,YACnB,UAAU,CAASO,MAAA;AACjB,cAAAR,KAAYA,EAASQ,CAAK,GAC1BF,EAAM,SAASE,CAAK;AAAA,YACtB;AAAA,YACA,MAAK;AAAA,UAAA;AAAA,QACP;AAAA,QACA,gBAAAJ,EAAC,SAAI,WAAWF,GACd,4BAAC,QAAK,EAAA,WAAU,4BAA4B,CAAA,EAC9C,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EACF,GAGN;AAEJ;AAEAN,EAAW,YAAY;AAAA,EACrB,SAASa;AAAA,EACT,OAAOC,EAAU;AAAA,EACjB,MAAMA,EAAU,OAAO;AAAA,EACvB,UAAUA,EAAU;AACtB;"}

package/dist/components/Modal/Modal.d.ts

@@ -0,0 +1,29 @@
+export default Modal;
+declare function Modal({ actions, children, className, noHeader, onClose, previewText, show, size, subTitle, title }: {
+    actions?: any[];
+    children: any;
+    className?: string;
+    noHeader?: boolean;
+    onClose: any;
+    previewText?: string;
+    show?: boolean;
+    size?: string;
+    subTitle?: any;
+    title?: string;
+}): JSX.Element;
+declare namespace Modal {
+    namespace propTypes {
+        export let actions: any;
+        export let children: any;
+        export let className: any;
+        export let noHeader: any;
+        export let onClose: any;
+        export let previewText: any;
+        export let show: any;
+        export { MODAL_SIZES as size };
+        export let subTitle: any;
+        export let title: any;
+    }
+}
+import { MODAL_SIZES } from '../../types';
+//# sourceMappingURL=Modal.d.ts.map

package/dist/components/Modal/Modal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["../../../src/lib/components/Modal/Modal.jsx"],"names":[],"mappings":";AA+BA;;;;;;;;;;;gBAsDC;;;;;;;;;;;;;;;4BA5D2B,aAAa"}

package/dist/components/Modal/Modal.mjs

@@ -0,0 +1,71 @@
+import { jsxs as a, Fragment as N, jsx as o } from "react/jsx-runtime";
+import { useRef as v } from "react";
+import e from "prop-types";
+import { CSSTransition as g } from "react-transition-group";
+import b from "classnames";
+import x from "../Backdrop/Backdrop.mjs";
+import y from "../RoundedIcon/RoundedIcon.mjs";
+import { MODAL_MD as C } from "../../constants.mjs";
+import { MODAL_SIZES as R } from "../../types.mjs";
+import S from "../../images/close.svg.mjs";
+/* empty css            */
+const T = ({
+  actions: r = [],
+  children: n,
+  className: c = "",
+  noHeader: p = !1,
+  onClose: l,
+  previewText: i = "",
+  show: s = !1,
+  size: t = C,
+  subTitle: d = null,
+  title: h = ""
+}) => {
+  const m = v(null), f = b("modal", c, t && `modal-${t}`);
+  return /* @__PURE__ */ a(N, { children: [
+    /* @__PURE__ */ o(x, { onClose: l, show: s }),
+    /* @__PURE__ */ o(
+      g,
+      {
+        nodeRef: m,
+        in: s,
+        timeout: 300,
+        classNames: "modal-transition",
+        unmountOnExit: !0,
+        children: /* @__PURE__ */ a("div", { className: f, "data-testid": "modal", ref: m, children: [
+          /* @__PURE__ */ o("div", { className: "modal__header-button", children: /* @__PURE__ */ o(y, { "data-testid": "pop-up-close-btn", onClick: l, tooltipText: "Close", children: /* @__PURE__ */ o(S, {}) }) }),
+          /* @__PURE__ */ a("div", { className: "modal__content", children: [
+            !p && /* @__PURE__ */ a("div", { className: "modal__header", children: [
+              i && /* @__PURE__ */ o("div", { className: "modal__header-preview-text", children: i }),
+              /* @__PURE__ */ o("h5", { className: "modal__header-title", children: h }),
+              d && /* @__PURE__ */ o("h6", { className: "modal__header-sub-title", children: d })
+            ] }),
+            /* @__PURE__ */ o("div", { className: "modal__body", children: n }),
+            r && r.length > 0 && /* @__PURE__ */ o("div", { className: "modal__footer", children: /* @__PURE__ */ o("div", { className: "modal__footer-actions", children: r.map((_, u) => /* @__PURE__ */ o("div", { children: _ }, u)) }) })
+          ] })
+        ] })
+      }
+    )
+  ] });
+};
+T.propTypes = {
+  actions: e.array,
+  children: e.oneOfType([
+    e.element,
+    e.object,
+    e.node,
+    e.string
+  ]).isRequired,
+  className: e.string,
+  noHeader: e.bool,
+  onClose: e.func.isRequired,
+  previewText: e.string,
+  show: e.bool,
+  size: R,
+  subTitle: e.string,
+  title: e.string
+};
+export {
+  T as default
+};
+//# sourceMappingURL=Modal.mjs.map

package/dist/components/Modal/Modal.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Modal.mjs","sources":["../../../src/lib/components/Modal/Modal.jsx"],"sourcesContent":["/*\nCopyright 2022 Iguazio Systems Ltd.\nLicensed under the Apache License, Version 2.0 (the \"License\") with\nan addition restriction as set forth herein. You may not use this\nfile except in compliance with the License. You may obtain a copy of\nthe License at http://www.apache.org/licenses/LICENSE-2.0.\nUnless required by applicable law or agreed to in writing, software\ndistributed under the License is distributed on an \"AS IS\" BASIS,\nWITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or\nimplied. See the License for the specific language governing\npermissions and limitations under the License.\nIn addition, you may not use the software for any purposes that are\nillegal under applicable law, and the grant of the foregoing license\nunder the Apache 2.0 license is conditioned upon your compliance with\nsuch restriction.\n*/\nimport React, { useRef } from 'react'\nimport PropTypes from 'prop-types'\nimport { CSSTransition } from 'react-transition-group'\nimport classNames from 'classnames'\n\nimport Backdrop from '../Backdrop/Backdrop'\nimport RoundedIcon from '../RoundedIcon/RoundedIcon'\n\nimport { MODAL_MD } from '../../constants'\nimport { MODAL_SIZES } from '../../types'\n\nimport CloseIcon from '../../images/close.svg?react'\n\nimport './Modal.scss'\n\nconst Modal = ({\n  actions = [],\n  children,\n  className = '',\n  noHeader = false,\n  onClose,\n  previewText = '',\n  show = false,\n  size = MODAL_MD,\n  subTitle = null,\n  title = ''\n}) => {\n  const nodeRef = useRef(null)\n  const modalClassNames = classNames('modal', className, size && `modal-${size}`)\n\n  return (\n    <>\n      <Backdrop onClose={onClose} show={show} />\n      <CSSTransition\n        nodeRef={nodeRef}\n        in={show}\n        timeout={300}\n        classNames=\"modal-transition\"\n        unmountOnExit\n      >\n        <div className={modalClassNames} data-testid=\"modal\" ref={nodeRef}>\n          <div className=\"modal__header-button\">\n            <RoundedIcon data-testid=\"pop-up-close-btn\" onClick={onClose} tooltipText=\"Close\">\n              <CloseIcon />\n            </RoundedIcon>\n          </div>\n          <div className=\"modal__content\">\n            {!noHeader && (\n              <div className=\"modal__header\">\n                {previewText && <div className=\"modal__header-preview-text\">{previewText}</div>}\n                <h5 className=\"modal__header-title\">{title}</h5>\n                {subTitle && <h6 className=\"modal__header-sub-title\">{subTitle}</h6>}\n              </div>\n            )}\n            <div className=\"modal__body\">{children}</div>\n            {actions && actions.length > 0 && (\n              <div className=\"modal__footer\">\n                <div className=\"modal__footer-actions\">\n                  {actions.map((action, idx) => (\n                    <div key={idx}>{action}</div>\n                  ))}\n                </div>\n              </div>\n            )}\n          </div>\n        </div>\n      </CSSTransition>\n    </>\n  )\n}\n\nModal.propTypes = {\n  actions: PropTypes.array,\n  children: PropTypes.oneOfType([\n    PropTypes.element,\n    PropTypes.object,\n    PropTypes.node,\n    PropTypes.string\n  ]).isRequired,\n  className: PropTypes.string,\n  noHeader: PropTypes.bool,\n  onClose: PropTypes.func.isRequired,\n  previewText: PropTypes.string,\n  show: PropTypes.bool,\n  size: MODAL_SIZES,\n  subTitle: PropTypes.string,\n  title: PropTypes.string\n}\n\nexport default Modal\n"],"names":["Modal","actions","children","className","noHeader","onClose","previewText","show","size","MODAL_MD","subTitle","title","nodeRef","useRef","modalClassNames","classNames","jsxs","Fragment","jsx","Backdrop","CSSTransition","RoundedIcon","CloseIcon","action","idx","PropTypes","MODAL_SIZES"],"mappings":";;;;;;;;;;;AA+BA,MAAMA,IAAQ,CAAC;AAAA,EACb,SAAAC,IAAU,CAAC;AAAA,EACX,UAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,UAAAC,IAAW;AAAA,EACX,SAAAC;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,MAAAC,IAAO;AAAA,EACP,MAAAC,IAAOC;AAAA,EACP,UAAAC,IAAW;AAAA,EACX,OAAAC,IAAQ;AACV,MAAM;AACE,QAAAC,IAAUC,EAAO,IAAI,GACrBC,IAAkBC,EAAW,SAASZ,GAAWK,KAAQ,SAASA,CAAI,EAAE;AAE9E,SAEI,gBAAAQ,EAAAC,GAAA,EAAA,UAAA;AAAA,IAAC,gBAAAC,EAAAC,GAAA,EAAS,SAAAd,GAAkB,MAAAE,EAAY,CAAA;AAAA,IACxC,gBAAAW;AAAA,MAACE;AAAA,MAAA;AAAA,QACC,SAAAR;AAAA,QACA,IAAIL;AAAA,QACJ,SAAS;AAAA,QACT,YAAW;AAAA,QACX,eAAa;AAAA,QAEb,4BAAC,OAAI,EAAA,WAAWO,GAAiB,eAAY,SAAQ,KAAKF,GACxD,UAAA;AAAA,UAAA,gBAAAM,EAAC,OAAI,EAAA,WAAU,wBACb,UAAA,gBAAAA,EAACG,KAAY,eAAY,oBAAmB,SAAShB,GAAS,aAAY,SACxE,UAAC,gBAAAa,EAAAI,GAAA,CAAA,CAAU,EACb,CAAA,GACF;AAAA,UACA,gBAAAN,EAAC,OAAI,EAAA,WAAU,kBACZ,UAAA;AAAA,YAAA,CAACZ,KACA,gBAAAY,EAAC,OAAI,EAAA,WAAU,iBACZ,UAAA;AAAA,cAAAV,KAAgB,gBAAAY,EAAA,OAAA,EAAI,WAAU,8BAA8B,UAAYZ,GAAA;AAAA,cACxE,gBAAAY,EAAA,MAAA,EAAG,WAAU,uBAAuB,UAAMP,GAAA;AAAA,cAC1CD,KAAY,gBAAAQ,EAAC,MAAG,EAAA,WAAU,2BAA2B,UAASR,EAAA,CAAA;AAAA,YAAA,GACjE;AAAA,YAED,gBAAAQ,EAAA,OAAA,EAAI,WAAU,eAAe,UAAAhB,EAAS,CAAA;AAAA,YACtCD,KAAWA,EAAQ,SAAS,uBAC1B,OAAI,EAAA,WAAU,iBACb,UAAA,gBAAAiB,EAAC,OAAI,EAAA,WAAU,yBACZ,UAAQjB,EAAA,IAAI,CAACsB,GAAQC,MACpB,gBAAAN,EAAC,SAAe,UAANK,EAAA,GAAAC,CAAa,CACxB,EACH,CAAA,EACF,CAAA;AAAA,UAAA,EAEJ,CAAA;AAAA,QAAA,EACF,CAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EACF,GACF;AAEJ;AAEAxB,EAAM,YAAY;AAAA,EAChB,SAASyB,EAAU;AAAA,EACnB,UAAUA,EAAU,UAAU;AAAA,IAC5BA,EAAU;AAAA,IACVA,EAAU;AAAA,IACVA,EAAU;AAAA,IACVA,EAAU;AAAA,EACX,CAAA,EAAE;AAAA,EACH,WAAWA,EAAU;AAAA,EACrB,UAAUA,EAAU;AAAA,EACpB,SAASA,EAAU,KAAK;AAAA,EACxB,aAAaA,EAAU;AAAA,EACvB,MAAMA,EAAU;AAAA,EAChB,MAAMC;AAAA,EACN,UAAUD,EAAU;AAAA,EACpB,OAAOA,EAAU;AACnB;"}

package/dist/components/PopUpDialog/PopUpDialog.d.ts

@@ -0,0 +1,28 @@
+export default PopUpDialog;
+declare function PopUpDialog({ children, className, closePopUp, customPosition, headerIsHidden, headerText, showPopUpDialog, style, tooltipText }: {
+    children: any;
+    className?: string;
+    closePopUp?: () => void;
+    customPosition?: {};
+    headerIsHidden?: boolean;
+    headerText?: string;
+    showPopUpDialog?: boolean;
+    style?: {};
+    tooltipText?: string;
+}, ref: any): import("react").ReactPortal;
+declare namespace PopUpDialog {
+    let displayName: string;
+    namespace propTypes {
+        export let children: any;
+        export let className: any;
+        export let closePopUp: any;
+        export { POP_UP_CUSTOM_POSITION as customPosition };
+        export let headerIsHidden: any;
+        export let headerText: any;
+        export let showPopUpDialog: any;
+        export let style: any;
+        export let tooltipText: any;
+    }
+}
+import { POP_UP_CUSTOM_POSITION } from '../../types';
+//# sourceMappingURL=PopUpDialog.d.ts.map

package/dist/components/PopUpDialog/PopUpDialog.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PopUpDialog.d.ts","sourceRoot":"","sources":["../../../src/lib/components/PopUpDialog/PopUpDialog.jsx"],"names":[],"mappings":";AA+BA;;;;;;;;;;0CAkJC;;;;;;;;;;;;;;;uCAvJsC,aAAa"}

package/dist/components/PopUpDialog/PopUpDialog.mjs

@@ -0,0 +1,90 @@
+import { jsx as n, jsxs as _ } from "react/jsx-runtime";
+import { useState as I, useRef as $, useCallback as C, useLayoutEffect as B, useEffect as D, forwardRef as F } from "react";
+import l from "prop-types";
+import L from "classnames";
+import { createPortal as j } from "react-dom";
+import { throttle as M } from "lodash";
+import k from "../RoundedIcon/RoundedIcon.mjs";
+import W from "../Tooltip/Tooltip.mjs";
+import q from "../TooltipTemplate/TextTooltipTemplate.mjs";
+import { POP_UP_CUSTOM_POSITION as V } from "../../types.mjs";
+import A from "../../images/close.svg.mjs";
+/* empty css                  */
+let h = ({
+  children: R,
+  className: x = "",
+  closePopUp: f = () => {
+  },
+  customPosition: i = {},
+  headerIsHidden: E = !1,
+  headerText: w = "",
+  showPopUpDialog: T = !0,
+  style: m = {},
+  tooltipText: y = ""
+}, o) => {
+  const [v, N] = I(T ?? !0), S = $(null);
+  o ?? (o = S);
+  const O = L(
+    x,
+    "pop-up-dialog__overlay",
+    i.element && "custom-position"
+  ), z = C(() => {
+    f && f(), N(!1);
+  }, [f]), u = C(() => {
+    var r;
+    if ((r = i == null ? void 0 : i.element) != null && r.current && (o != null && o.current)) {
+      const e = i.element.current.getBoundingClientRect(), t = o.current.getBoundingClientRect(), [b, H] = i.position.split("-"), p = 15, s = 5, g = e.right >= t.width + p, d = window.innerWidth - e.left >= t.width + p, P = e.top > t.height + p + s, U = e.bottom + t.height + p + s <= window.innerHeight;
+      let a = H === "left" ? e.right - t.width : e.left, c;
+      b === "top" ? c = P ? e.top - t.height - s : p : c = U ? e.bottom + s : window.innerHeight - t.height - p, i.autoVerticalPosition && (b === "top" ? !P && U && (c = e.bottom + s) : P && !U && (c = e.top - t.height - s)), i.autoHorizontalPosition && (b === "left" ? !g && d ? a = e.left : !g && !d && (a = p) : g && !d ? a = e.right - t.width : !g && !d && (a = window.innerWidth - t.width - p)), o.current.style.top = `${c}px`, m.left && !(i.autoHorizontalPosition && d) ? o.current.style.left = `calc(${a}px + ${m.left})` : o.current.style.left = `${a}px`;
+    }
+  }, [i, m.left, o]);
+  return B(() => {
+    u();
+  }, [u]), D(() => {
+    if (v) {
+      const r = M(u, 100, {
+        trailing: !0,
+        leading: !0
+      }), e = new ResizeObserver(r), t = o.current;
+      return e.observe(t), window.addEventListener("resize", r), () => {
+        e.unobserve(t), window.removeEventListener("resize", r);
+      };
+    }
+  }, [u, o, v]), v ? j(
+    /* @__PURE__ */ n("div", { ref: o, className: O, style: m, children: /* @__PURE__ */ _("div", { "data-testid": "pop-up-dialog", className: "pop-up-dialog", children: [
+      !E && /* @__PURE__ */ _("div", { className: "pop-up-dialog__header", children: [
+        w && /* @__PURE__ */ n("div", { "data-testid": "pop-up-dialog-header", className: "pop-up-dialog__header-text", children: /* @__PURE__ */ n(W, { template: /* @__PURE__ */ n(q, { text: y || w }), children: /* @__PURE__ */ n("span", { children: w }) }) }),
+        /* @__PURE__ */ n(
+          k,
+          {
+            className: "pop-up-dialog__btn_close",
+            onClick: z,
+            tooltipText: "Close",
+            "data-testid": "pop-up-close-btn",
+            children: /* @__PURE__ */ n(A, {})
+          }
+        )
+      ] }),
+      R
+    ] }) }),
+    document.getElementById("overlay_container")
+  ) : null;
+};
+h = F(h);
+h.displayName = "PopUpDialog";
+h.propTypes = {
+  children: l.node.isRequired,
+  className: l.string,
+  closePopUp: l.func,
+  customPosition: V,
+  headerIsHidden: l.bool,
+  headerText: l.string,
+  showPopUpDialog: l.bool,
+  style: l.object,
+  tooltipText: l.string
+};
+const le = h;
+export {
+  le as default
+};
+//# sourceMappingURL=PopUpDialog.mjs.map

package/dist/components/PopUpDialog/PopUpDialog.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"PopUpDialog.mjs","sources":["../../../src/lib/components/PopUpDialog/PopUpDialog.jsx"],"sourcesContent":["/*\nCopyright 2022 Iguazio Systems Ltd.\nLicensed under the Apache License, Version 2.0 (the \"License\") with\nan addition restriction as set forth herein. You may not use this\nfile except in compliance with the License. You may obtain a copy of\nthe License at http://www.apache.org/licenses/LICENSE-2.0.\nUnless required by applicable law or agreed to in writing, software\ndistributed under the License is distributed on an \"AS IS\" BASIS,\nWITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or\nimplied. See the License for the specific language governing\npermissions and limitations under the License.\nIn addition, you may not use the software for any purposes that are\nillegal under applicable law, and the grant of the foregoing license\nunder the Apache 2.0 license is conditioned upon your compliance with\nsuch restriction.\n*/\nimport React, { forwardRef, useCallback, useEffect, useLayoutEffect, useRef, useState } from 'react'\nimport PropTypes from 'prop-types'\nimport classnames from 'classnames'\nimport { createPortal } from 'react-dom'\nimport { throttle } from 'lodash'\n\nimport RoundedIcon from '../RoundedIcon/RoundedIcon'\nimport Tooltip from '../Tooltip/Tooltip'\nimport TextTooltipTemplate from '../TooltipTemplate/TextTooltipTemplate'\n\nimport { POP_UP_CUSTOM_POSITION } from '../../types'\nimport CloseIcon from '../../images/close.svg?react'\n\nimport './popUpDialog.scss'\n\nlet PopUpDialog = (\n  {\n    children,\n    className = '',\n    closePopUp = () => {},\n    customPosition = {},\n    headerIsHidden = false,\n    headerText = '',\n    showPopUpDialog = true,\n    style = {},\n    tooltipText = ''\n  },\n  ref\n) => {\n  const [showPopUp, setShowPopUp] = useState(showPopUpDialog ?? true)\n  const popUpOverlayRef = useRef(null)\n  ref ??= popUpOverlayRef\n  const popUpClassNames = classnames(\n    className,\n    'pop-up-dialog__overlay',\n    customPosition.element && 'custom-position'\n  )\n\n  const handleClosePopUp = useCallback(() => {\n    closePopUp && closePopUp()\n    setShowPopUp(false)\n  }, [closePopUp])\n\n  const calculateCustomPopUpPosition = useCallback(() => {\n    if (customPosition?.element?.current && ref?.current) {\n      const elementRect = customPosition.element.current.getBoundingClientRect()\n      const popUpRect = ref.current.getBoundingClientRect()\n      const [verticalPosition, horizontalPosition] = customPosition.position.split('-')\n      const popupMargin = 15\n      const elementMargin = 5\n      const isEnoughSpaceFromLeft = elementRect.right >= popUpRect.width + popupMargin\n      const isEnoughSpaceFromRight =\n        window.innerWidth - elementRect.left >= popUpRect.width + popupMargin\n      const isEnoughSpaceFromTop = elementRect.top > popUpRect.height + popupMargin + elementMargin\n      const isEnoughSpaceFromBottom =\n        elementRect.bottom + popUpRect.height + popupMargin + elementMargin <= window.innerHeight\n      let leftPosition =\n        horizontalPosition === 'left' ? elementRect.right - popUpRect.width : elementRect.left\n\n      let topPosition\n\n      if (verticalPosition === 'top') {\n        topPosition = isEnoughSpaceFromTop\n          ? elementRect.top - popUpRect.height - elementMargin\n          : popupMargin\n      } else {\n        topPosition = isEnoughSpaceFromBottom\n          ? elementRect.bottom + elementMargin\n          : window.innerHeight - popUpRect.height - popupMargin\n      }\n\n      if (customPosition.autoVerticalPosition) {\n        if (verticalPosition === 'top') {\n          if (!isEnoughSpaceFromTop && isEnoughSpaceFromBottom) {\n            topPosition = elementRect.bottom + elementMargin\n          }\n        } else {\n          if (isEnoughSpaceFromTop && !isEnoughSpaceFromBottom) {\n            topPosition = elementRect.top - popUpRect.height - elementMargin\n          }\n        }\n      }\n\n      if (customPosition.autoHorizontalPosition) {\n        if (verticalPosition === 'left') {\n          if (!isEnoughSpaceFromLeft && isEnoughSpaceFromRight) {\n            leftPosition = elementRect.left\n          } else if (!isEnoughSpaceFromLeft && !isEnoughSpaceFromRight) {\n            leftPosition = popupMargin\n          }\n        } else {\n          if (isEnoughSpaceFromLeft && !isEnoughSpaceFromRight) {\n            leftPosition = elementRect.right - popUpRect.width\n          } else if (!isEnoughSpaceFromLeft && !isEnoughSpaceFromRight) {\n            leftPosition = window.innerWidth - popUpRect.width - popupMargin\n          }\n        }\n      }\n\n      ref.current.style.top = `${topPosition}px`\n\n      if (style.left && !(customPosition.autoHorizontalPosition && isEnoughSpaceFromRight)) {\n        ref.current.style.left = `calc(${leftPosition}px + ${style.left})`\n      } else {\n        ref.current.style.left = `${leftPosition}px`\n      }\n    }\n  }, [customPosition, style.left, ref])\n\n  useLayoutEffect(() => {\n    calculateCustomPopUpPosition()\n  }, [calculateCustomPopUpPosition])\n\n  useEffect(() => {\n    if (showPopUp) {\n      const throttledCalculatedCustomPopUpPosition = throttle(calculateCustomPopUpPosition, 100, {\n        trailing: true,\n        leading: true\n      })\n      const popupObserver = new ResizeObserver(throttledCalculatedCustomPopUpPosition)\n      const popupElement = ref.current\n\n      popupObserver.observe(popupElement)\n      window.addEventListener('resize', throttledCalculatedCustomPopUpPosition)\n\n      return () => {\n        popupObserver.unobserve(popupElement)\n        window.removeEventListener('resize', throttledCalculatedCustomPopUpPosition)\n      }\n    }\n  }, [calculateCustomPopUpPosition, ref, showPopUp])\n\n  return showPopUp\n    ? createPortal(\n        <div ref={ref} className={popUpClassNames} style={style}>\n          <div data-testid=\"pop-up-dialog\" className=\"pop-up-dialog\">\n            {!headerIsHidden && (\n              <div className=\"pop-up-dialog__header\">\n                {headerText && (\n                  <div data-testid=\"pop-up-dialog-header\" className=\"pop-up-dialog__header-text\">\n                    <Tooltip template={<TextTooltipTemplate text={tooltipText || headerText} />}>\n                      <span>{headerText}</span>\n                    </Tooltip>\n                  </div>\n                )}\n                <RoundedIcon\n                  className=\"pop-up-dialog__btn_close\"\n                  onClick={handleClosePopUp}\n                  tooltipText=\"Close\"\n                  data-testid=\"pop-up-close-btn\"\n                >\n                  <CloseIcon />\n                </RoundedIcon>\n              </div>\n            )}\n            {children}\n          </div>\n        </div>,\n        document.getElementById('overlay_container')\n      )\n    : null\n}\n\nPopUpDialog = forwardRef(PopUpDialog)\n\nPopUpDialog.displayName = 'PopUpDialog'\n\nPopUpDialog.propTypes = {\n  children: PropTypes.node.isRequired,\n  className: PropTypes.string,\n  closePopUp: PropTypes.func,\n  customPosition: POP_UP_CUSTOM_POSITION,\n  headerIsHidden: PropTypes.bool,\n  headerText: PropTypes.string,\n  showPopUpDialog: PropTypes.bool,\n  style: PropTypes.object,\n  tooltipText: PropTypes.string\n}\n\nexport default PopUpDialog\n"],"names":["PopUpDialog","children","className","closePopUp","customPosition","headerIsHidden","headerText","showPopUpDialog","style","tooltipText","ref","showPopUp","setShowPopUp","useState","popUpOverlayRef","useRef","popUpClassNames","classnames","handleClosePopUp","useCallback","calculateCustomPopUpPosition","_a","elementRect","popUpRect","verticalPosition","horizontalPosition","popupMargin","elementMargin","isEnoughSpaceFromLeft","isEnoughSpaceFromRight","isEnoughSpaceFromTop","isEnoughSpaceFromBottom","leftPosition","topPosition","useLayoutEffect","useEffect","throttledCalculatedCustomPopUpPosition","throttle","popupObserver","popupElement","createPortal","jsx","jsxs","Tooltip","TextTooltipTemplate","RoundedIcon","CloseIcon","forwardRef","PropTypes","POP_UP_CUSTOM_POSITION","PopUpDialog$1"],"mappings":"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"}

package/dist/components/RoundedIcon/RoundedIcon.d.ts

@@ -0,0 +1,23 @@
+export default RoundedIcon;
+declare function RoundedIcon({ children, className, disabled, id, isActive, onClick, tooltipText }: {
+    children: any;
+    className?: string;
+    disabled?: boolean;
+    id?: string;
+    isActive?: boolean;
+    onClick?: () => void;
+    tooltipText?: string;
+}, ref: any): JSX.Element;
+declare namespace RoundedIcon {
+    let displayName: string;
+    namespace propTypes {
+        let children: any;
+        let className: any;
+        let disabled: any;
+        let id: any;
+        let isActive: any;
+        let onClick: any;
+        let tooltipText: any;
+    }
+}
+//# sourceMappingURL=RoundedIcon.d.ts.map

package/dist/components/RoundedIcon/RoundedIcon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RoundedIcon.d.ts","sourceRoot":"","sources":["../../../src/lib/components/RoundedIcon/RoundedIcon.jsx"],"names":[],"mappings":";AAyBA;;;;;;;;0BA4BC"}

package/dist/components/RoundedIcon/RoundedIcon.mjs

@@ -0,0 +1,40 @@
+import { jsx as r } from "react/jsx-runtime";
+import u, { forwardRef as _ } from "react";
+import o from "prop-types";
+import s from "classnames";
+import N from "../Tooltip/Tooltip.mjs";
+import R from "../TooltipTemplate/TextTooltipTemplate.mjs";
+/* empty css                  */
+let e = ({
+  children: n,
+  className: a = "",
+  disabled: t = !1,
+  id: c = "",
+  isActive: d = !1,
+  onClick: l = () => {
+  },
+  tooltipText: i = ""
+}, m) => {
+  const p = s("round-icon-cp", a), f = s(
+    "round-icon-cp__circle",
+    d && "round-icon-cp__circle-active",
+    t && "round-icon-cp__circle-disabled"
+  );
+  return /* @__PURE__ */ r("div", { className: p, ref: m, "data-testid": c, children: /* @__PURE__ */ r(N, { hidden: !i, id: c, template: /* @__PURE__ */ r(R, { text: i }), children: /* @__PURE__ */ r("button", { onClick: l, disabled: t, className: f, children: n }) }) });
+};
+e = u.memo(_(e));
+e.displayName = "RoundedIcon";
+e.propTypes = {
+  children: o.node.isRequired,
+  className: o.string,
+  disabled: o.bool,
+  id: o.string,
+  isActive: o.bool,
+  onClick: o.func,
+  tooltipText: o.string
+};
+const y = e;
+export {
+  y as default
+};
+//# sourceMappingURL=RoundedIcon.mjs.map

package/dist/components/RoundedIcon/RoundedIcon.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RoundedIcon.mjs","sources":["../../../src/lib/components/RoundedIcon/RoundedIcon.jsx"],"sourcesContent":["/*\nCopyright 2022 Iguazio Systems Ltd.\nLicensed under the Apache License, Version 2.0 (the \"License\") with\nan addition restriction as set forth herein. You may not use this\nfile except in compliance with the License. You may obtain a copy of\nthe License at http://www.apache.org/licenses/LICENSE-2.0.\nUnless required by applicable law or agreed to in writing, software\ndistributed under the License is distributed on an \"AS IS\" BASIS,\nWITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or\nimplied. See the License for the specific language governing\npermissions and limitations under the License.\nIn addition, you may not use the software for any purposes that are\nillegal under applicable law, and the grant of the foregoing license\nunder the Apache 2.0 license is conditioned upon your compliance with\nsuch restriction.\n*/\nimport React, { forwardRef } from 'react'\nimport PropTypes from 'prop-types'\nimport classNames from 'classnames'\n\nimport Tooltip from '../Tooltip/Tooltip'\nimport TextTooltipTemplate from '../TooltipTemplate/TextTooltipTemplate'\n\nimport './roundedIcon.scss'\n\nlet RoundedIcon = (\n  {\n    children,\n    className = '',\n    disabled = false,\n    id = '',\n    isActive = false,\n    onClick = () => {},\n    tooltipText = ''\n  },\n  ref\n) => {\n  const wrapperClassNames = classNames('round-icon-cp', className)\n  const IconClassNames = classNames(\n    'round-icon-cp__circle',\n    isActive && 'round-icon-cp__circle-active',\n    disabled && 'round-icon-cp__circle-disabled'\n  )\n\n  return (\n    <div className={wrapperClassNames} ref={ref} data-testid={id}>\n      <Tooltip hidden={!tooltipText} id={id} template={<TextTooltipTemplate text={tooltipText} />}>\n        <button onClick={onClick} disabled={disabled} className={IconClassNames}>\n          {children}\n        </button>\n      </Tooltip>\n    </div>\n  )\n}\n\nRoundedIcon = React.memo(forwardRef(RoundedIcon))\n\nRoundedIcon.displayName = 'RoundedIcon'\n\nRoundedIcon.propTypes = {\n  children: PropTypes.node.isRequired,\n  className: PropTypes.string,\n  disabled: PropTypes.bool,\n  id: PropTypes.string,\n  isActive: PropTypes.bool,\n  onClick: PropTypes.func,\n  tooltipText: PropTypes.string\n}\n\nexport default RoundedIcon\n"],"names":["RoundedIcon","children","className","disabled","id","isActive","onClick","tooltipText","ref","wrapperClassNames","classNames","IconClassNames","jsx","Tooltip","TextTooltipTemplate","React","forwardRef","PropTypes","RoundedIcon$1"],"mappings":";;;;;;;AAyBA,IAAIA,IAAc,CAChB;AAAA,EACE,UAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,UAAAC,IAAW;AAAA,EACX,IAAAC,IAAK;AAAA,EACL,UAAAC,IAAW;AAAA,EACX,SAAAC,IAAU,MAAM;AAAA,EAAC;AAAA,EACjB,aAAAC,IAAc;AAChB,GACAC,MACG;AACG,QAAAC,IAAoBC,EAAW,iBAAiBR,CAAS,GACzDS,IAAiBD;AAAAA,IACrB;AAAA,IACAL,KAAY;AAAA,IACZF,KAAY;AAAA,EACd;AAGE,SAAA,gBAAAS,EAAC,OAAI,EAAA,WAAWH,GAAmB,KAAAD,GAAU,eAAaJ,GACxD,UAAC,gBAAAQ,EAAAC,GAAA,EAAQ,QAAQ,CAACN,GAAa,IAAAH,GAAQ,UAAU,gBAAAQ,EAACE,GAAoB,EAAA,MAAMP,EAAa,CAAA,GACvF,UAAC,gBAAAK,EAAA,UAAA,EAAO,SAAAN,GAAkB,UAAAH,GAAoB,WAAWQ,GACtD,UAAAV,EACH,CAAA,EACF,CAAA,GACF;AAEJ;AAEAD,IAAce,EAAM,KAAKC,EAAWhB,CAAW,CAAC;AAEhDA,EAAY,cAAc;AAE1BA,EAAY,YAAY;AAAA,EACtB,UAAUiB,EAAU,KAAK;AAAA,EACzB,WAAWA,EAAU;AAAA,EACrB,UAAUA,EAAU;AAAA,EACpB,IAAIA,EAAU;AAAA,EACd,UAAUA,EAAU;AAAA,EACpB,SAASA,EAAU;AAAA,EACnB,aAAaA,EAAU;AACzB;AAEA,MAAAC,IAAelB;"}

package/dist/components/RoundedIcon/RoundedIcon.stories.d.ts

@@ -0,0 +1,9 @@
+declare namespace _default {
+    export let title: string;
+    export { RoundedIcon as component };
+}
+export default _default;
+export const Normal: any;
+export const WithToolTip: any;
+import RoundedIcon from './RoundedIcon';
+//# sourceMappingURL=RoundedIcon.stories.d.ts.map

package/dist/components/RoundedIcon/RoundedIcon.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"RoundedIcon.stories.d.ts","sourceRoot":"","sources":["../../../src/lib/components/RoundedIcon/RoundedIcon.stories.js"],"names":[],"mappings":";;;;;AAiCA,yBAAuC;AAKvC,8BAA4C;wBApBpB,eAAe"}

package/dist/components/Tip/Tip.d.ts

@@ -0,0 +1,14 @@
+export default Tip;
+declare function Tip({ className, text, withExclamationMark }: {
+    className?: string;
+    text: any;
+    withExclamationMark?: boolean;
+}): JSX.Element;
+declare namespace Tip {
+    namespace propTypes {
+        let className: any;
+        let text: any;
+        let withExclamationMark: any;
+    }
+}
+//# sourceMappingURL=Tip.d.ts.map

package/dist/components/Tip/Tip.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tip.d.ts","sourceRoot":"","sources":["../../../src/lib/components/Tip/Tip.jsx"],"names":[],"mappings":";AA6BA;;;;gBA2FC"}

package/dist/components/Tip/Tip.mjs

@@ -0,0 +1,67 @@
+import { jsxs as I, jsx as s } from "react/jsx-runtime";
+import { useState as x, useMemo as f, useRef as _, useCallback as M, useEffect as E } from "react";
+import i from "prop-types";
+import { CSSTransition as O } from "react-transition-group";
+import L from "classnames";
+import { createPortal as $ } from "react-dom";
+import { getScssVariableValue as d } from "../../utils/common.util.mjs";
+import k from "../../images/question-mark.svg.mjs";
+import A from "../../images/exclamation-mark.svg.mjs";
+/* empty css          */
+const B = ({ className: y = "", text: u, withExclamationMark: C = !1 }) => {
+  const [n, h] = x(!1), [N, R] = x("tip_top tip_left"), e = f(() => parseInt(d("--tipArrowLength")), []), r = f(() => parseInt(d("--tipArrowOffset")), []), c = f(() => parseInt(d("--tipIconLength")), []), S = 40, a = _(), o = _(), T = L(y, "tip-container"), b = L(
+    "tip",
+    N,
+    u.length <= S ? "tip_small" : "tip_big"
+  ), l = M(() => {
+    h(!0);
+  }, []);
+  E(() => {
+    if (n) {
+      const t = a.current.getBoundingClientRect(), p = o.current.getBoundingClientRect(), v = t.left > p.width - r ? "tip_left" : "tip_right", w = t.top > p.height + e ? "tip_top" : "tip_bottom";
+      if (R(`${w} ${v}`), v === "tip_left") {
+        const m = r + (c + e) / 2;
+        o.current.style.left = `${t.left - (p.width - m)}px`;
+      } else {
+        const m = r - (c - e) / 2;
+        o.current.style.left = `${t.left - m}px`;
+      }
+      o.current.style.top = w === "tip_top" ? `${t.top - p.height - e}px` : `${t.bottom + e}px`;
+    }
+  }, [e, r, c, n]);
+  const g = () => {
+    h(!1);
+  };
+  return E(() => {
+    const t = a.current;
+    if (a.current)
+      return t.addEventListener("mouseenter", l), t.addEventListener("mouseleave", g), () => {
+        t.removeEventListener("mouseenter", l), t.removeEventListener("mouseleave", g);
+      };
+  }, [l, n]), /* @__PURE__ */ I("div", { "data-testid": "tip", className: T, children: [
+    /* @__PURE__ */ s("div", { ref: a, className: "tip-wrapper", children: C ? /* @__PURE__ */ s(A, { "data-testid": "tip-icon" }) : /* @__PURE__ */ s(k, { "data-testid": "tip-icon" }) }),
+    $(
+      /* @__PURE__ */ s(
+        O,
+        {
+          nodeRef: o,
+          in: n,
+          timeout: 200,
+          classNames: "fade",
+          unmountOnExit: !0,
+          children: /* @__PURE__ */ s("div", { ref: o, "data-testid": "tip-text", className: b, children: u })
+        }
+      ),
+      document.getElementById("overlay_container")
+    )
+  ] });
+};
+B.propTypes = {
+  className: i.string,
+  text: i.oneOfType([i.string, i.element]).isRequired,
+  withExclamationMark: i.bool
+};
+export {
+  B as default
+};
+//# sourceMappingURL=Tip.mjs.map

package/dist/components/Tip/Tip.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tip.mjs","sources":["../../../src/lib/components/Tip/Tip.jsx"],"sourcesContent":["/*\nCopyright 2022 Iguazio Systems Ltd.\nLicensed under the Apache License, Version 2.0 (the \"License\") with\nan addition restriction as set forth herein. You may not use this\nfile except in compliance with the License. You may obtain a copy of\nthe License at http://www.apache.org/licenses/LICENSE-2.0.\nUnless required by applicable law or agreed to in writing, software\ndistributed under the License is distributed on an \"AS IS\" BASIS,\nWITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or\nimplied. See the License for the specific language governing\npermissions and limitations under the License.\nIn addition, you may not use the software for any purposes that are\nillegal under applicable law, and the grant of the foregoing license\nunder the Apache 2.0 license is conditioned upon your compliance with\nsuch restriction.\n*/\nimport React, { useState, useRef, useEffect, useCallback, useMemo } from 'react'\nimport PropTypes from 'prop-types'\nimport { CSSTransition } from 'react-transition-group'\nimport classnames from 'classnames'\nimport { createPortal } from 'react-dom'\n\nimport { getScssVariableValue } from '../../utils/common.util'\n\nimport QuestionMarkIcon from '../../images/question-mark.svg?react'\nimport ExclamationMarkIcon from '../../images/exclamation-mark.svg?react'\n\nimport './tip.scss'\n\nconst Tip = ({ className = '', text, withExclamationMark = false }) => {\n  const [isShow, setIsShow] = useState(false)\n  const [tipClassName, setTipClassName] = useState('tip_top tip_left')\n\n  const arrowLength = useMemo(() => parseInt(getScssVariableValue('--tipArrowLength')), [])\n  const arrowOffset = useMemo(() => parseInt(getScssVariableValue('--tipArrowOffset')), [])\n  const iconLength = useMemo(() => parseInt(getScssVariableValue('--tipIconLength')), [])\n\n  const minTextLength = 40\n\n  const iconRef = useRef()\n  const tipBodyRef = useRef()\n\n  const tipContainerClassNames = classnames(className, 'tip-container')\n  const tipClassNames = classnames(\n    'tip',\n    tipClassName,\n    text.length <= minTextLength ? 'tip_small' : 'tip_big'\n  )\n\n  const handleMouseEnter = useCallback(() => {\n    setIsShow(true)\n  }, [])\n\n  useEffect(() => {\n    if (isShow) {\n      const iconRect = iconRef.current.getBoundingClientRect()\n      const tipRect = tipBodyRef.current.getBoundingClientRect()\n      const widthPosition = iconRect.left > tipRect.width - arrowOffset ? 'tip_left' : 'tip_right'\n      const heightPosition = iconRect.top > tipRect.height + arrowLength ? 'tip_top' : 'tip_bottom'\n\n      setTipClassName(`${heightPosition} ${widthPosition}`)\n\n      if (widthPosition === 'tip_left') {\n        const computedArrowOffset = arrowOffset + (iconLength + arrowLength) / 2\n        tipBodyRef.current.style.left = `${iconRect.left - (tipRect.width - computedArrowOffset)}px`\n      } else {\n        const computedArrowOffset = arrowOffset - (iconLength - arrowLength) / 2\n        tipBodyRef.current.style.left = `${iconRect.left - computedArrowOffset}px`\n      }\n\n      tipBodyRef.current.style.top =\n        heightPosition === 'tip_top'\n          ? `${iconRect.top - tipRect.height - arrowLength}px`\n          : `${iconRect.bottom + arrowLength}px`\n    }\n  }, [arrowLength, arrowOffset, iconLength, isShow])\n\n  const handleMouseLeave = () => {\n    setIsShow(false)\n  }\n\n  useEffect(() => {\n    const node = iconRef.current\n\n    if (iconRef.current) {\n      node.addEventListener('mouseenter', handleMouseEnter)\n      node.addEventListener('mouseleave', handleMouseLeave)\n\n      return () => {\n        node.removeEventListener('mouseenter', handleMouseEnter)\n        node.removeEventListener('mouseleave', handleMouseLeave)\n      }\n    }\n  }, [handleMouseEnter, isShow])\n\n  return (\n    <div data-testid=\"tip\" className={tipContainerClassNames}>\n      <div ref={iconRef} className=\"tip-wrapper\">\n        {withExclamationMark ? (\n          <ExclamationMarkIcon data-testid=\"tip-icon\" />\n        ) : (\n          <QuestionMarkIcon data-testid=\"tip-icon\" />\n        )}\n      </div>\n      {createPortal(\n        <CSSTransition\n          nodeRef={tipBodyRef}\n          in={isShow}\n          timeout={200}\n          classNames=\"fade\"\n          unmountOnExit\n        >\n          <div ref={tipBodyRef} data-testid=\"tip-text\" className={tipClassNames}>\n            {text}\n          </div>\n        </CSSTransition>,\n        document.getElementById('overlay_container')\n      )}\n    </div>\n  )\n}\n\nTip.propTypes = {\n  className: PropTypes.string,\n  text: PropTypes.oneOfType([PropTypes.string, PropTypes.element]).isRequired,\n  withExclamationMark: PropTypes.bool\n}\n\nexport default Tip\n"],"names":["Tip","className","text","withExclamationMark","isShow","setIsShow","useState","tipClassName","setTipClassName","arrowLength","useMemo","getScssVariableValue","arrowOffset","iconLength","minTextLength","iconRef","useRef","tipBodyRef","tipContainerClassNames","classnames","tipClassNames","handleMouseEnter","useCallback","useEffect","iconRect","tipRect","widthPosition","heightPosition","computedArrowOffset","handleMouseLeave","node","jsxs","jsx","ExclamationMarkIcon","QuestionMarkIcon","createPortal","CSSTransition","PropTypes"],"mappings":"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"}

package/dist/components/Tip/Tip.stories.d.ts

@@ -0,0 +1,7 @@
+declare namespace _default {
+    export let title: string;
+    export { Tip as component };
+}
+export default _default;
+export const Normal: any;
+//# sourceMappingURL=Tip.stories.d.ts.map

package/dist/components/Tip/Tip.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tip.stories.d.ts","sourceRoot":"","sources":["../../../src/lib/components/Tip/Tip.stories.js"],"names":[],"mappings":";;;;;AA+BA,yBAAuC"}

package/dist/components/Tooltip/Tooltip.d.ts

@@ -0,0 +1,22 @@
+export default Tooltip;
+declare function Tooltip({ children, className, hidden, id, renderChildAsHtml, template, textShow }: {
+    children?: string;
+    className?: string;
+    hidden?: boolean;
+    id?: string;
+    renderChildAsHtml?: boolean;
+    template: any;
+    textShow?: boolean;
+}): JSX.Element;
+declare namespace Tooltip {
+    namespace propTypes {
+        let children: any;
+        let className: any;
+        let hidden: any;
+        let id: any;
+        let renderChildAsHtml: any;
+        let template: any;
+        let textShow: any;
+    }
+}
+//# sourceMappingURL=Tooltip.d.ts.map

package/dist/components/Tooltip/Tooltip.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../../src/lib/components/Tooltip/Tooltip.jsx"],"names":[],"mappings":";AA2BA;;;;;;;;gBA2LC"}