@selfdecode/sd-component-library 4.0.73-vite11 → 4.0.73-vite12

package/lib/sd-component-library284.js

@@ -1,53 +1,45 @@
-import { j as o } from "./sd-component-library195.js";
-import { ThirteenBold as h } from "./sd-component-library151.js";
-import { Button as m } from "./sd-component-library28.js";
-import { MaxMaxContainer as f } from "./sd-component-library43.js";
-const T = (s) => {
-  const {
-    Icon: i,
-    iconHeight: n,
-    title: l,
-    isActive: r,
-    hash: t,
-    onTabSelect: c,
-    enableScroll: a,
-    activeColor: e,
-    history: p
-  } = s, x = a ? {
-    scrollTo: t
-  } : {};
-  return /* @__PURE__ */ o.jsx(
-    m,
-    {
-      bg: "transparent",
-      onClick: () => c(t),
-      history: p,
-      "data-test": `tab-${t}`,
-      ...x,
-      children: /* @__PURE__ */ o.jsxs(f, { gap: ["15px", "20px"], children: [
-        /* @__PURE__ */ o.jsx(
-          i,
-          {
-            style: {
-              height: n,
-              fill: r ? e : "#434A54"
-            }
-          }
-        ),
-        /* @__PURE__ */ o.jsx(
-          h,
-          {
-            textTransform: "uppercase",
-            color: r ? e : "#434A54",
-            cursor: "pointer",
-            children: l
-          }
-        )
-      ] })
-    }
-  );
+import { jsxs as x, jsx as o } from "./sd-component-library196.js";
+import "./sd-component-library197.js";
+import { CustomScrollbarBox as d } from "./sd-component-library50.js";
+import { Box as e } from "./sd-component-library198.js";
+import { HorizontalDivider as s } from "./sd-component-library51.js";
+import { ResponsiveTextV2 as c } from "./sd-component-library147.js";
+const u = ({
+  options: l,
+  onSelect: t
+}) => {
+  const i = {
+    borderColor: "cl_lightGrey",
+    borderWidth: "1px"
+  }, p = (r) => () => t(r);
+  return /* @__PURE__ */ x(e, { sx: {
+    position: "absolute",
+    top: "100%",
+    right: 0,
+    zIndex: 1
+  }, children: [
+    /* @__PURE__ */ o(s, { color: "cl_purple", height: "2px" }),
+    /* @__PURE__ */ o(e, { sx: {
+      bg: "cl_white",
+      borderRadius: "0 0 3px 3px",
+      ...i,
+      borderStyle: "solid",
+      borderTopStyle: "none",
+      boxShadow: "0px 3px 10px #0000001A"
+    }, children: /* @__PURE__ */ o(d, { height: "180px", width: "max-content", scrollbarThumbColor: "cl_purple", scrollbarTrackColor: "cl_headerLine", scrollbarWidth: "5px", hoverScrollbarWidth: "5px", bg: "cl_transparent", p: "5px 7px 5px 0", sx: {
+      pr: "8px"
+    }, children: l.map((r) => /* @__PURE__ */ o(c, { fontSizeWeight: [14, "regular"], sx: {
+      display: "flex",
+      alignItems: "center",
+      height: "36px",
+      px: "10px",
+      borderColor: "cl_headerLine",
+      borderWidth: "1px",
+      borderBottomStyle: "solid"
+    }, onClick: p(r), children: r.title }, r.id)) }) })
+  ] });
 };
 export {
-  T as Tab
+  u as CustomScrollableOptionsBox
 };
 //# sourceMappingURL=sd-component-library284.js.map

package/lib/sd-component-library284.js.map

@@ -1 +1 @@
-{"version":3,"file":"sd-component-library284.js","sources":["../src/components/tabs/tabs-menu/partials/tab/tab.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { Button, MaxMaxContainer, ThirteenBold } from \"../../../../..\";\nimport { TabProps } from \"./interfaces\";\n\n/**\n * Tab component to render a single tab button.\n */\nexport const Tab: React.FC<TabProps> = (props) => {\n  const {\n    Icon,\n    iconHeight,\n    title,\n    isActive,\n    hash,\n    onTabSelect,\n    enableScroll,\n    activeColor,\n    history,\n  } = props;\n\n  const scrollProps = enableScroll\n    ? {\n        scrollTo: hash,\n      }\n    : {};\n\n  return (\n    <Button\n      bg=\"transparent\"\n      onClick={() => onTabSelect(hash)}\n      history={history}\n      data-test={`tab-${hash}`}\n      {...scrollProps}\n    >\n      <MaxMaxContainer gap={[\"15px\", \"20px\"]}>\n        <Icon\n          style={{\n            height: iconHeight,\n            fill: isActive ? activeColor : \"#434A54\",\n          }}\n        />\n        <ThirteenBold\n          textTransform=\"uppercase\"\n          color={isActive ? activeColor : \"#434A54\"}\n          cursor=\"pointer\"\n        >\n          {title}\n        </ThirteenBold>\n      </MaxMaxContainer>\n    </Button>\n  );\n};\n"],"names":["Tab","props","Icon","iconHeight","title","isActive","hash","onTabSelect","enableScroll","activeColor","history","scrollProps","jsx","Button","MaxMaxContainer","ThirteenBold"],"mappings":";;;;AAQa,MAAAA,IAA0B,CAACC,MAAU;AAC1C,QAAA;AAAA,IACJ,MAAAC;AAAA,IACA,YAAAC;AAAA,IACA,OAAAC;AAAA,IACA,UAAAC;AAAA,IACA,MAAAC;AAAA,IACA,aAAAC;AAAA,IACA,cAAAC;AAAA,IACA,aAAAC;AAAA,IACA,SAAAC;AAAA,EACE,IAAAT,GAEEU,IAAcH,IAChB;AAAA,IACE,UAAUF;AAAA,MAEZ;AAGF,SAAAM,gBAAAA,EAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,IAAG;AAAA,MACH,SAAS,MAAMN,EAAYD,CAAI;AAAA,MAC/B,SAAAI;AAAA,MACA,aAAW,OAAOJ,CAAI;AAAA,MACrB,GAAGK;AAAA,MAEJ,iCAACG,GAAgB,EAAA,KAAK,CAAC,QAAQ,MAAM,GACnC,UAAA;AAAA,QAAAF,gBAAAA,EAAA;AAAA,UAACV;AAAA,UAAA;AAAA,YACC,OAAO;AAAA,cACL,QAAQC;AAAA,cACR,MAAME,IAAWI,IAAc;AAAA,YACjC;AAAA,UAAA;AAAA,QACF;AAAA,QACAG,gBAAAA,EAAA;AAAA,UAACG;AAAA,UAAA;AAAA,YACC,eAAc;AAAA,YACd,OAAOV,IAAWI,IAAc;AAAA,YAChC,QAAO;AAAA,YAEN,UAAAL;AAAA,UAAA;AAAA,QACH;AAAA,MAAA,GACF;AAAA,IAAA;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"sd-component-library284.js","sources":["../src/components/selectors/custom-scrollable-selector/partials/custom-scrollable-options-box/custom-scrollable-options-box.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { Box } from \"rebass\";\n\nimport { CustomScrollbarBox } from \"../../../../custom-scrollbar-box\";\nimport { HorizontalDivider } from \"../../../../dividers\";\nimport { ResponsiveTextV2 } from \"../../../../texts\";\nimport { SelectorOptionV2 } from \"../../../selector-v2\";\nimport { CustomScrollableOptionsBoxProps as Props } from \"./interfaces\";\n\nexport const CustomScrollableOptionsBox = <T extends string = string>({\n  options,\n  onSelect,\n}: Props<T>) => {\n  const lightGreyThinBorder = {\n    borderColor: \"cl_lightGrey\",\n    borderWidth: \"1px\",\n  };\n\n  const onClick = (option: SelectorOptionV2<T>) => () => onSelect(option);\n\n  return (\n    <Box\n      sx={{\n        position: \"absolute\",\n        top: \"100%\",\n        right: 0,\n        zIndex: 1,\n      }}\n    >\n      <HorizontalDivider color=\"cl_purple\" height=\"2px\" />\n\n      <Box\n        sx={{\n          bg: \"cl_white\",\n          borderRadius: \"0 0 3px 3px\",\n          ...lightGreyThinBorder,\n          borderStyle: \"solid\",\n          borderTopStyle: \"none\",\n          boxShadow: \"0px 3px 10px #0000001A\",\n        }}\n      >\n        <CustomScrollbarBox\n          height=\"180px\"\n          width=\"max-content\"\n          scrollbarThumbColor=\"cl_purple\"\n          scrollbarTrackColor=\"cl_headerLine\"\n          scrollbarWidth=\"5px\"\n          hoverScrollbarWidth=\"5px\"\n          bg=\"cl_transparent\"\n          p=\"5px 7px 5px 0\"\n          sx={{ pr: \"8px\" }}\n        >\n          {options.map((option) => (\n            <ResponsiveTextV2\n              key={option.id}\n              fontSizeWeight={[14, \"regular\"]}\n              sx={{\n                display: \"flex\",\n                alignItems: \"center\",\n                height: \"36px\",\n                px: \"10px\",\n                borderColor: \"cl_headerLine\",\n                borderWidth: \"1px\",\n                borderBottomStyle: \"solid\",\n              }}\n              onClick={onClick(option)}\n            >\n              {option.title}\n            </ResponsiveTextV2>\n          ))}\n        </CustomScrollbarBox>\n      </Box>\n    </Box>\n  );\n};\n"],"names":["CustomScrollableOptionsBox","options","onSelect","lightGreyThinBorder","borderColor","borderWidth","onClick","option","jsxs","Box","position","top","right","zIndex","jsx","HorizontalDivider","bg","borderRadius","borderStyle","borderTopStyle","boxShadow","CustomScrollbarBox","pr","map","ResponsiveTextV2","display","alignItems","height","px","borderBottomStyle","title","id"],"mappings":";;;;;;AAUO,MAAMA,IAA6B,CAA4B;AAAA,EACpEC,SAAAA;AAAAA,EACAC,UAAAA;AACQ,MAAM;AACd,QAAMC,IAAsB;AAAA,IAC1BC,aAAa;AAAA,IACbC,aAAa;AAAA,EAAA,GAGTC,IAAUA,CAACC,MAAgC,MAAML,EAASK,CAAM;AAGpE,SAAA,gBAAAC,EAACC,KACC,IAAI;AAAA,IACFC,UAAU;AAAA,IACVC,KAAK;AAAA,IACLC,OAAO;AAAA,IACPC,QAAQ;AAAA,EAGV,GAAA,UAAA;AAAA,IAAA,gBAAAC,EAACC,GAAkB,EAAA,OAAM,aAAY,QAAO,OAAK;AAAA,IAEjD,gBAAAD,EAACL,KACC,IAAI;AAAA,MACFO,IAAI;AAAA,MACJC,cAAc;AAAA,MACd,GAAGd;AAAAA,MACHe,aAAa;AAAA,MACbC,gBAAgB;AAAA,MAChBC,WAAW;AAAA,IAAA,GAGb,UAAC,gBAAAN,EAAAO,GAAA,EACC,QAAO,SACP,OAAM,eACN,qBAAoB,aACpB,qBAAoB,iBACpB,gBAAe,OACf,qBAAoB,OACpB,IAAG,kBACH,GAAE,iBACF,IAAI;AAAA,MAAEC,IAAI;AAAA,IAAM,GAEfrB,UAAQsB,EAAAA,IAAKhB,CACZA,MAAA,gBAAAO,EAACU,GAEC,EAAA,gBAAgB,CAAC,IAAI,SAAS,GAC9B,IAAI;AAAA,MACFC,SAAS;AAAA,MACTC,YAAY;AAAA,MACZC,QAAQ;AAAA,MACRC,IAAI;AAAA,MACJxB,aAAa;AAAA,MACbC,aAAa;AAAA,MACbwB,mBAAmB;AAAA,IACrB,GACA,SAASvB,EAAQC,CAAM,GAEtBA,UAAOuB,EAAAA,MAAAA,GAbHvB,EAAOwB,EAcd,CACD,EAAA,CACH,EACF,CAAA;AAAA,EACF,EAAA,CAAA;AAEJ;"}

package/lib/sd-component-library285.js

@@ -1,52 +1,64 @@
-var n = Object.defineProperty;
-var R = (t, e, s) => e in t ? n(t, e, { enumerable: !0, configurable: !0, writable: !0, value: s }) : t[e] = s;
-var i = (t, e, s) => (R(t, typeof e != "symbol" ? e + "" : e, s), s);
-class h {
-  constructor() {
-    i(this, "refRegistry", {});
-  }
-  /**
-   * Check if ref is registered for a component with provided ID.
-   * @param id ID for the component.
-   */
-  doesRefExist(e) {
-    return !!this.refRegistry[e];
-  }
-  /**
-   * Register a ref.
-   *
-   * @param id ID for the component.
-   * @param ref React Ref object for the component. Used for scrolling.
-   */
-  addRef(e, s) {
-    const r = e.startsWith("#") ? e : `#${e}`;
-    this.refRegistry[r] = s;
-  }
-  /**
-   * Remove a ref from registry.
-   *
-   * @param id ID for the component.
-   */
-  removeRef(e) {
-    this.doesRefExist(e) ? delete this.refRegistry[e] : console.error(`Ref with ID ${e} does not exist in the registry`);
-  }
-  /**
-   * Scroll the component with provided ID into the view.
-   *
-   * @param id ID for the component.
-   * @param behavior Scroll behavior.
-   */
-  scrollToRef(e, { behavior: s = "smooth", block: r, inline: f }) {
-    var o;
-    this.doesRefExist(e) ? (o = this.refRegistry[e].current) == null || o.scrollIntoView({
-      behavior: s,
-      block: r,
-      inline: f
-    }) : console.error(`Ref with ID ${e} does not exist in the registry`);
-  }
-}
-const g = new h();
+import { jsxs as u, jsx as t } from "./sd-component-library196.js";
+import { createElement as g } from "./sd-component-library674.js";
+import "./sd-component-library197.js";
+import { TriangularPointerIcon as f } from "./sd-component-library189.js";
+import { HorizontalDivider as w } from "./sd-component-library51.js";
+import { OptionRow as k } from "./sd-component-library704.js";
+import { Box as i } from "./sd-component-library198.js";
+const C = 8, e = 5, c = C + 2 * e, l = c / 2, n = "cl_header", s = "cl_lightGrey", $ = "46px", S = 4, H = (a) => {
+  const {
+    isVisible: d,
+    options: p,
+    value: r,
+    onChange: b
+  } = a;
+  if (!d)
+    return null;
+  const x = (o) => () => b(o), h = [r, ...p.filter(({
+    id: o
+  }) => o !== r.id)], m = `${c}px`;
+  return /* @__PURE__ */ u(i, { sx: {
+    minWidth: "100%",
+    position: "absolute",
+    top: "100%",
+    right: 0,
+    zIndex: 1,
+    cursor: "default"
+  }, children: [
+    /* @__PURE__ */ t(f, { direction: "top", mr: "15px", ml: "auto" }),
+    /* @__PURE__ */ t(w, { color: "cl_purple", height: "2px" }),
+    /* @__PURE__ */ t(i, { sx: {
+      bg: "cl_white",
+      borderRadius: "0 0 3px 3px",
+      boxShadow: "0px 3px 10px #0000001A",
+      borderWidth: "1px",
+      borderColor: "cl_lightGrey",
+      borderStyle: "solid",
+      borderTopStyle: "none",
+      overflow: "auto",
+      maxHeight: `calc(${$} * ${S})`,
+      scrollbarWidth: "thin",
+      scrollbarColor: `${n} ${s}`,
+      "::-webkit-scrollbar-track": {
+        borderRadius: l,
+        bg: n,
+        border: `${e}px solid transparent`,
+        backgroundClip: "content-box"
+      },
+      "::-webkit-scrollbar": {
+        width: m,
+        bg: "transparent"
+      },
+      "::-webkit-scrollbar-thumb": {
+        borderRadius: l,
+        bg: s,
+        border: `${e}px solid transparent`,
+        backgroundClip: "content-box"
+      }
+    }, children: h.map((o) => /* @__PURE__ */ g(k, { onClick: x(o), ...o, key: o.id, currentSelection: r.id === o.id })) })
+  ] });
+};
 export {
-  g as refsManager
+  H as CustomScrollableOptionsBox
 };
 //# sourceMappingURL=sd-component-library285.js.map

package/lib/sd-component-library285.js.map

@@ -1 +1 @@
-{"version":3,"file":"sd-component-library285.js","sources":["../src/components/utils/anchor/refs-manager.ts"],"sourcesContent":["import React from \"react\";\n\nimport { refsMap } from \"./interfaces\";\n\n/**\n * Refs Manager class to keep record of registered refs on the page.\n */\nclass RefsManager {\n  refRegistry: refsMap = {};\n\n  /**\n   * Check if ref is registered for a component with provided ID.\n   * @param id ID for the component.\n   */\n  public doesRefExist(id: string) {\n    return !!this.refRegistry[id];\n  }\n\n  /**\n   * Register a ref.\n   *\n   * @param id ID for the component.\n   * @param ref React Ref object for the component. Used for scrolling.\n   */\n  public addRef(\n    id: string,\n    ref: React.MutableRefObject<HTMLDivElement | undefined>\n  ) {\n    const key = id.startsWith(\"#\") ? id : `#${id}`;\n\n    this.refRegistry[key] = ref;\n  }\n\n  /**\n   * Remove a ref from registry.\n   *\n   * @param id ID for the component.\n   */\n  public removeRef(id: string) {\n    if (this.doesRefExist(id)) delete this.refRegistry[id];\n    else console.error(`Ref with ID ${id} does not exist in the registry`);\n  }\n\n  /**\n   * Scroll the component with provided ID into the view.\n   *\n   * @param id ID for the component.\n   * @param behavior Scroll behavior.\n   */\n  public scrollToRef(\n    id: string,\n    { behavior = \"smooth\", block, inline }: ScrollIntoViewOptions\n  ) {\n    if (this.doesRefExist(id))\n      this.refRegistry[id].current?.scrollIntoView({\n        behavior,\n        block,\n        inline,\n      });\n    else console.error(`Ref with ID ${id} does not exist in the registry`);\n  }\n}\n\nexport const refsManager = new RefsManager();\n"],"names":["RefsManager","__publicField","id","ref","key","behavior","block","inline","_a","refsManager"],"mappings":";;;AAOA,MAAMA,EAAY;AAAA,EAAlB;AACE,IAAAC,EAAA,qBAAuB,CAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAMhB,aAAaC,GAAY;AAC9B,WAAO,CAAC,CAAC,KAAK,YAAYA,CAAE;AAAA,EAC9B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQO,OACLA,GACAC,GACA;AACA,UAAMC,IAAMF,EAAG,WAAW,GAAG,IAAIA,IAAK,IAAIA,CAAE;AAEvC,SAAA,YAAYE,CAAG,IAAID;AAAA,EAC1B;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOO,UAAUD,GAAY;AACvB,IAAA,KAAK,aAAaA,CAAE,IAAU,OAAA,KAAK,YAAYA,CAAE,IACxC,QAAA,MAAM,eAAeA,CAAE,iCAAiC;AAAA,EACvE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQO,YACLA,GACA,EAAE,UAAAG,IAAW,UAAU,OAAAC,GAAO,QAAAC,KAC9B;AA7CJ,QAAAC;AA8CQ,IAAA,KAAK,aAAaN,CAAE,KACtBM,IAAA,KAAK,YAAYN,CAAE,EAAE,YAArB,QAAAM,EAA8B,eAAe;AAAA,MAC3C,UAAAH;AAAA,MACA,OAAAC;AAAA,MACA,QAAAC;AAAA,IAAA,KAES,QAAA,MAAM,eAAeL,CAAE,iCAAiC;AAAA,EACvE;AACF;AAEa,MAAAO,IAAc,IAAIT,EAAY;"}
+{"version":3,"file":"sd-component-library285.js","sources":["../src/components/selectors/primary-custom-scrollable-selector/partials/custom-scrollable-options-box/custom-scrollable-options-box.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { Box } from \"rebass\";\n\nimport { HorizontalDivider } from \"../../../../dividers/horizontal-divider\";\nimport { TriangularPointerIcon } from \"../../../../icons\";\nimport { SelectorOptionV2 } from \"../../../selector-v2\";\nimport { OptionRow } from \"../option-row\";\nimport { CustomScrollableOptionsBoxProps as Props } from \"./interfaces\";\n\nconst scrollbarWidth = 8;\nconst offset = 5;\nconst totalWidth = scrollbarWidth + 2 * offset;\nconst borderRadius = totalWidth / 2;\n\nconst trackColor = \"cl_header\";\nconst thumbColor = \"cl_lightGrey\";\nconst rowHeight = \"46px\";\nconst maxRows = 4;\n\nexport const CustomScrollableOptionsBox = <T extends string = string>(\n  props: Props<T>\n) => {\n  const { isVisible, options, value, onChange } = props;\n\n  if (!isVisible) return null;\n\n  const onSelect = (option: SelectorOptionV2<T>) => () => onChange(option);\n  const regroupedOptions = [\n    value,\n    ...options.filter(({ id }) => id !== value.id),\n  ];\n\n  const scrollbarWidthStr = `${totalWidth}px`;\n\n  return (\n    <Box\n      sx={{\n        minWidth: \"100%\",\n        position: \"absolute\",\n        top: \"100%\",\n        right: 0,\n        zIndex: 1,\n        cursor: \"default\",\n      }}\n    >\n      <TriangularPointerIcon direction=\"top\" mr=\"15px\" ml=\"auto\" />\n\n      <HorizontalDivider color=\"cl_purple\" height=\"2px\" />\n\n      <Box\n        sx={{\n          bg: \"cl_white\",\n          borderRadius: \"0 0 3px 3px\",\n          boxShadow: \"0px 3px 10px #0000001A\",\n          borderWidth: \"1px\",\n          borderColor: \"cl_lightGrey\",\n          borderStyle: \"solid\",\n          borderTopStyle: \"none\",\n          overflow: \"auto\",\n          maxHeight: `calc(${rowHeight} * ${maxRows})`,\n          scrollbarWidth: \"thin\",\n          scrollbarColor: `${trackColor} ${thumbColor}`,\n          \"::-webkit-scrollbar-track\": {\n            borderRadius,\n            bg: trackColor,\n            border: `${offset}px solid transparent`,\n            backgroundClip: \"content-box\",\n          },\n          \"::-webkit-scrollbar\": {\n            width: scrollbarWidthStr,\n            bg: \"transparent\",\n          },\n          \"::-webkit-scrollbar-thumb\": {\n            borderRadius,\n            bg: thumbColor,\n            border: `${offset}px solid transparent`,\n            backgroundClip: \"content-box\",\n          },\n        }}\n      >\n        {(regroupedOptions as SelectorOptionV2<T>[]).map((option) => (\n          <OptionRow\n            onClick={onSelect(option)}\n            {...option}\n            key={option.id}\n            currentSelection={value.id === option.id}\n          />\n        ))}\n      </Box>\n    </Box>\n  );\n};\n"],"names":["scrollbarWidth","offset","totalWidth","borderRadius","trackColor","thumbColor","rowHeight","maxRows","CustomScrollableOptionsBox","props","isVisible","options","value","onChange","onSelect","option","regroupedOptions","filter","id","scrollbarWidthStr","jsxs","Box","minWidth","position","top","right","zIndex","cursor","jsx","TriangularPointerIcon","HorizontalDivider","bg","boxShadow","borderWidth","borderColor","borderStyle","borderTopStyle","overflow","maxHeight","scrollbarColor","border","backgroundClip","width","map","OptionRow"],"mappings":";;;;;;;AAUA,MAAMA,IAAiB,GACjBC,IAAS,GACTC,IAAaF,IAAiB,IAAIC,GAClCE,IAAeD,IAAa,GAE5BE,IAAa,aACbC,IAAa,gBACbC,IAAY,QACZC,IAAU,GAEHC,IAA6B,CACxCC,MACG;AACG,QAAA;AAAA,IAAEC,WAAAA;AAAAA,IAAWC,SAAAA;AAAAA,IAASC,OAAAA;AAAAA,IAAOC,UAAAA;AAAAA,EAAaJ,IAAAA;AAEhD,MAAI,CAACC;AAAkB,WAAA;AAEvB,QAAMI,IAAWA,CAACC,MAAgC,MAAMF,EAASE,CAAM,GACjEC,IAAmB,CACvBJ,GACA,GAAGD,EAAQM,OAAO,CAAC;AAAA,IAAEC,IAAAA;AAAAA,EAASA,MAAAA,MAAON,EAAMM,EAAE,CAAC,GAG1CC,IAAqB,GAAEjB,CAAW;AAGtC,SAAA,gBAAAkB,EAACC,KACC,IAAI;AAAA,IACFC,UAAU;AAAA,IACVC,UAAU;AAAA,IACVC,KAAK;AAAA,IACLC,OAAO;AAAA,IACPC,QAAQ;AAAA,IACRC,QAAQ;AAAA,EAGV,GAAA,UAAA;AAAA,IAAA,gBAAAC,EAACC,KAAsB,WAAU,OAAM,IAAG,QAAO,IAAG,QAAM;AAAA,IAEzD,gBAAAD,EAAAE,GAAA,EAAkB,OAAM,aAAY,QAAO,OAAK;AAAA,IAEjD,gBAAAF,EAACP,KACC,IAAI;AAAA,MACFU,IAAI;AAAA,MACJ5B,cAAc;AAAA,MACd6B,WAAW;AAAA,MACXC,aAAa;AAAA,MACbC,aAAa;AAAA,MACbC,aAAa;AAAA,MACbC,gBAAgB;AAAA,MAChBC,UAAU;AAAA,MACVC,WAAY,QAAOhC,CAAU,MAAKC,CAAQ;AAAA,MAC1CP,gBAAgB;AAAA,MAChBuC,gBAAiB,GAAEnC,CAAW,IAAGC,CAAW;AAAA,MAC5C,6BAA6B;AAAA,QAC3BF,cAAAA;AAAAA,QACA4B,IAAI3B;AAAAA,QACJoC,QAAS,GAAEvC,CAAO;AAAA,QAClBwC,gBAAgB;AAAA,MAClB;AAAA,MACA,uBAAuB;AAAA,QACrBC,OAAOvB;AAAAA,QACPY,IAAI;AAAA,MACN;AAAA,MACA,6BAA6B;AAAA,QAC3B5B,cAAAA;AAAAA,QACA4B,IAAI1B;AAAAA,QACJmC,QAAS,GAAEvC,CAAO;AAAA,QAClBwC,gBAAgB;AAAA,MAClB;AAAA,IACF,GAEEzB,YAA2C2B,IAAK5B,CAAAA,wBAC/C6B,GACC,EAAA,SAAS9B,EAASC,CAAM,GACpBA,GAAAA,GACJ,KAAKA,EAAOG,IACZ,kBAAkBN,EAAMM,OAAOH,EAAOG,IAAG,CAE5C,GACH;AAAA,EACF,EAAA,CAAA;AAEJ;"}

package/lib/sd-component-library286.js

@@ -1,56 +1,12 @@
-import { __exports as o } from "./sd-component-library289.js";
-import "./sd-component-library332.js";
-import "./sd-component-library333.js";
-import "./sd-component-library334.js";
-import "./sd-component-library335.js";
-import "./sd-component-library336.js";
-import { __exports as g } from "./sd-component-library337.js";
-import { __exports as d } from "./sd-component-library338.js";
-import { __exports as c } from "./sd-component-library339.js";
-import { __exports as l } from "./sd-component-library340.js";
-import { __exports as m } from "./sd-component-library341.js";
-(function(t) {
-  Object.defineProperty(t, "__esModule", {
-    value: !0
-  }), Object.defineProperty(t, "DateRange", {
-    enumerable: !0,
-    get: function() {
-      return a.default;
-    }
-  }), Object.defineProperty(t, "Calendar", {
-    enumerable: !0,
-    get: function() {
-      return u.default;
-    }
-  }), Object.defineProperty(t, "DateRangePicker", {
-    enumerable: !0,
-    get: function() {
-      return i.default;
-    }
-  }), Object.defineProperty(t, "DefinedRange", {
-    enumerable: !0,
-    get: function() {
-      return f.default;
-    }
-  }), Object.defineProperty(t, "defaultInputRanges", {
-    enumerable: !0,
-    get: function() {
-      return n.defaultInputRanges;
-    }
-  }), Object.defineProperty(t, "defaultStaticRanges", {
-    enumerable: !0,
-    get: function() {
-      return n.defaultStaticRanges;
-    }
-  }), Object.defineProperty(t, "createStaticRanges", {
-    enumerable: !0,
-    get: function() {
-      return n.createStaticRanges;
-    }
-  });
-  var a = r(d), u = r(c), i = r(l), f = r(m), n = g;
-  function r(e) {
-    return e && e.__esModule ? e : { default: e };
-  }
-})(o);
+import { r as e } from "./sd-component-library193.js";
+const a = (t) => /* @__PURE__ */ e.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 18 18", ...t }, /* @__PURE__ */ e.createElement("defs", null, /* @__PURE__ */ e.createElement("style", null, `
+            .info-icon-a {
+            stroke-linecap: round;
+            stroke-linejoin: round;
+            stroke-width: 2px;
+            }
+        `)), /* @__PURE__ */ e.createElement("g", { transform: "translate(1 1)" }, /* @__PURE__ */ e.createElement("path", { className: "info-icon-a", d: "M19,11a8,8,0,1,1-8-8A8,8,0,0,1,19,11Z", transform: "translate(-3 -3)" }), /* @__PURE__ */ e.createElement("path", { className: "info-icon-a", d: "M18,21.2V18", transform: "translate(-10 -10)" }), /* @__PURE__ */ e.createElement("path", { className: "info-icon-a", d: "M18,12h0", transform: "translate(-10 -7.2)" })));
+export {
+  a as ReactComponent
+};
 //# sourceMappingURL=sd-component-library286.js.map

package/lib/sd-component-library286.js.map

@@ -1 +1 @@
-{"version":3,"file":"sd-component-library286.js","sources":["../node_modules/react-date-range/dist/index.js"],"sourcesContent":["\"use strict\";\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\nObject.defineProperty(exports, \"DateRange\", {\n  enumerable: true,\n  get: function get() {\n    return _DateRange[\"default\"];\n  }\n});\nObject.defineProperty(exports, \"Calendar\", {\n  enumerable: true,\n  get: function get() {\n    return _Calendar[\"default\"];\n  }\n});\nObject.defineProperty(exports, \"DateRangePicker\", {\n  enumerable: true,\n  get: function get() {\n    return _DateRangePicker[\"default\"];\n  }\n});\nObject.defineProperty(exports, \"DefinedRange\", {\n  enumerable: true,\n  get: function get() {\n    return _DefinedRange[\"default\"];\n  }\n});\nObject.defineProperty(exports, \"defaultInputRanges\", {\n  enumerable: true,\n  get: function get() {\n    return _defaultRanges.defaultInputRanges;\n  }\n});\nObject.defineProperty(exports, \"defaultStaticRanges\", {\n  enumerable: true,\n  get: function get() {\n    return _defaultRanges.defaultStaticRanges;\n  }\n});\nObject.defineProperty(exports, \"createStaticRanges\", {\n  enumerable: true,\n  get: function get() {\n    return _defaultRanges.createStaticRanges;\n  }\n});\n\nvar _DateRange = _interopRequireDefault(require(\"./components/DateRange\"));\n\nvar _Calendar = _interopRequireDefault(require(\"./components/Calendar\"));\n\nvar _DateRangePicker = _interopRequireDefault(require(\"./components/DateRangePicker\"));\n\nvar _DefinedRange = _interopRequireDefault(require(\"./components/DefinedRange\"));\n\nvar _defaultRanges = require(\"./defaultRanges\");\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { \"default\": obj }; }"],"names":["exports","_DateRange","_Calendar","_DateRangePicker","_DefinedRange","_defaultRanges","_interopRequireDefault","require$$0","require$$1","require$$2","require$$3","require$$4","obj"],"mappings":";;;;;;;;;;;;AAEA,SAAO,eAAwBA,GAAA,cAAc;AAAA,IAC3C,OAAO;AAAA,EACT,CAAC,GACD,OAAO,eAAeA,GAAS,aAAa;AAAA,IAC1C,YAAY;AAAA,IACZ,KAAK,WAAe;AAClB,aAAOC,EAAW;AAAA,IACnB;AAAA,EACH,CAAC,GACD,OAAO,eAAeD,GAAS,YAAY;AAAA,IACzC,YAAY;AAAA,IACZ,KAAK,WAAe;AAClB,aAAOE,EAAU;AAAA,IAClB;AAAA,EACH,CAAC,GACD,OAAO,eAAeF,GAAS,mBAAmB;AAAA,IAChD,YAAY;AAAA,IACZ,KAAK,WAAe;AAClB,aAAOG,EAAiB;AAAA,IACzB;AAAA,EACH,CAAC,GACD,OAAO,eAAeH,GAAS,gBAAgB;AAAA,IAC7C,YAAY;AAAA,IACZ,KAAK,WAAe;AAClB,aAAOI,EAAc;AAAA,IACtB;AAAA,EACH,CAAC,GACD,OAAO,eAAeJ,GAAS,sBAAsB;AAAA,IACnD,YAAY;AAAA,IACZ,KAAK,WAAe;AAClB,aAAOK,EAAe;AAAA,IACvB;AAAA,EACH,CAAC,GACD,OAAO,eAAeL,GAAS,uBAAuB;AAAA,IACpD,YAAY;AAAA,IACZ,KAAK,WAAe;AAClB,aAAOK,EAAe;AAAA,IACvB;AAAA,EACH,CAAC,GACD,OAAO,eAAeL,GAAS,sBAAsB;AAAA,IACnD,YAAY;AAAA,IACZ,KAAK,WAAe;AAClB,aAAOK,EAAe;AAAA,IACvB;AAAA,EACH,CAAC;AAED,MAAIJ,IAAaK,EAAuBC,CAAiC,GAErEL,IAAYI,EAAuBE,CAAgC,GAEnEL,IAAmBG,EAAuBG,CAAuC,GAEjFL,IAAgBE,EAAuBI,CAAoC,GAE3EL,IAAiBM;AAErB,WAASL,EAAuBM,GAAK;AAAE,WAAOA,KAAOA,EAAI,aAAaA,IAAM,EAAE,SAAWA,EAAK;AAAA,EAAC;;","x_google_ignoreList":[0]}
+{"version":3,"file":"sd-component-library286.js","sources":["../src/components/tooltips/base-info-tooltip/assets/info-icon.svg"],"sourcesContent":["export default \"data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxOCAxOCI+CiAgICA8ZGVmcz4KICAgICAgICA8c3R5bGU+CiAgICAgICAgICAgIC5pbmZvLWljb24tYSB7CiAgICAgICAgICAgIHN0cm9rZS1saW5lY2FwOiByb3VuZDsKICAgICAgICAgICAgc3Ryb2tlLWxpbmVqb2luOiByb3VuZDsKICAgICAgICAgICAgc3Ryb2tlLXdpZHRoOiAycHg7CiAgICAgICAgICAgIH0KICAgICAgICA8L3N0eWxlPgogICAgPC9kZWZzPgogICAgPGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMSAxKSI+CiAgICAgICAgPHBhdGggY2xhc3M9ImluZm8taWNvbi1hIiBkPSJNMTksMTFhOCw4LDAsMSwxLTgtOEE4LDgsMCwwLDEsMTksMTFaIgogICAgICAgICAgICAgIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0zIC0zKSIvPgogICAgICAgIDxwYXRoIGNsYXNzPSJpbmZvLWljb24tYSIgZD0iTTE4LDIxLjJWMTgiCiAgICAgICAgICAgICAgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTEwIC0xMCkiLz4KICAgICAgICA8cGF0aCBjbGFzcz0iaW5mby1pY29uLWEiIGQ9Ik0xOCwxMmgwIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgtMTAgLTcuMikiLz4KICAgIDwvZz4KPC9zdmc+Cg==\""],"names":["SvgInfoIcon","props","React.createElement"],"mappings":";AACK,MAACA,IAAc,CAACC,MAA0BC,gBAAAA,EAAmB,cAAC,OAAO,EAAE,OAAO,8BAA8B,SAAS,aAAa,GAAGD,EAAK,GAAoBC,gBAAAA,EAAAA,cAAoB,QAAQ,MAAsBA,gBAAAA,gBAAoB,SAAS,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,SAAgK,CAAC,GAAmBA,gBAAAA,gBAAoB,KAAK,EAAE,WAAW,iBAAkB,GAAkBA,gBAAAA,EAAmB,cAAC,QAAQ,EAAE,WAAW,eAAe,GAAG,yCAAyC,WAAW,mBAAkB,CAAE,GAAmBA,gBAAAA,EAAAA,cAAoB,QAAQ,EAAE,WAAW,eAAe,GAAG,eAAe,WAAW,qBAAsB,CAAA,GAAmBA,gBAAAA,EAAmB,cAAC,QAAQ,EAAE,WAAW,eAAe,GAAG,YAAY,WAAW,sBAAuB,CAAA,CAAC,CAAC;"}

package/lib/sd-component-library287.js

@@ -1,5 +1,36 @@
-const s = "";
+import { jsx as i, jsxs as r, Fragment as m } from "./sd-component-library196.js";
+import l from "./sd-component-library193.js";
+import { ResponsiveTextV2 as e } from "./sd-component-library147.js";
+import { HorizontalDivider as c } from "./sd-component-library51.js";
+import { FlexCenter as o } from "./sd-component-library37.js";
+const W = l.forwardRef(({
+  mobileTitle: t,
+  tooltipWidth: h,
+  tooltipText: x,
+  zIndex: n,
+  pointerColor: p
+}, d) => /* @__PURE__ */ i(o, { sx: {
+  position: "fixed",
+  top: 0,
+  left: 0,
+  width: "100vw",
+  height: "100vh",
+  bg: "#262626AA",
+  zIndex: n
+}, ref: d, children: /* @__PURE__ */ r(o, { flexDirection: "column", sx: {
+  width: h,
+  maxWidth: "min(500px, calc(100vw - 30px))",
+  bg: "cl_white",
+  p: "20px",
+  borderRadius: "5px"
+}, children: [
+  t && /* @__PURE__ */ r(m, { children: [
+    /* @__PURE__ */ i(e, { maxWidth: "100%", fontSizeWeight: [16, "bold"], children: t }),
+    /* @__PURE__ */ i(c, { width: "min(50px, calc(100% - 40px))", color: p, height: "2px", m: "10px 0" })
+  ] }),
+  /* @__PURE__ */ i(e, { maxWidth: "100%", fontSizeWeight: [14, "regular"], children: x })
+] }) }));
 export {
-  s as default
+  W as TooltipWithPointerMobile
 };
 //# sourceMappingURL=sd-component-library287.js.map

package/lib/sd-component-library287.js.map

@@ -1 +1 @@
-{"version":3,"file":"sd-component-library287.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"sd-component-library287.js","sources":["../src/components/tooltips/tooltip-with-pointer/partials/tooltip-with-pointer-mobile/tooltip-with-pointer-mobile.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { FlexCenter } from \"../../../../containers\";\nimport { HorizontalDivider } from \"../../../../dividers\";\nimport { ResponsiveTextV2 } from \"../../../../texts\";\nimport { TooltipWithPointerProps } from \"../../interfaces\";\n\ntype Props = Pick<\n  TooltipWithPointerProps,\n  \"mobileTitle\" | \"tooltipText\" | \"tooltipWidth\" | \"zIndex\" | \"pointerColor\"\n>;\n\nexport const TooltipWithPointerMobile = React.forwardRef<HTMLDivElement, Props>(\n  ({ mobileTitle, tooltipWidth, tooltipText, zIndex, pointerColor }, ref) => {\n    return (\n      <FlexCenter\n        sx={{\n          position: \"fixed\",\n          top: 0,\n          left: 0,\n          width: \"100vw\",\n          height: \"100vh\",\n          bg: \"#262626AA\",\n          zIndex,\n        }}\n        ref={ref}\n      >\n        <FlexCenter\n          flexDirection=\"column\"\n          sx={{\n            width: tooltipWidth,\n            maxWidth: \"min(500px, calc(100vw - 30px))\",\n            bg: \"cl_white\",\n            p: \"20px\",\n            borderRadius: \"5px\",\n          }}\n        >\n          {mobileTitle && (\n            <>\n              <ResponsiveTextV2 maxWidth=\"100%\" fontSizeWeight={[16, \"bold\"]}>\n                {mobileTitle}\n              </ResponsiveTextV2>\n\n              <HorizontalDivider\n                width=\"min(50px, calc(100% - 40px))\"\n                color={pointerColor}\n                height=\"2px\"\n                m=\"10px 0\"\n              />\n            </>\n          )}\n\n          <ResponsiveTextV2 maxWidth=\"100%\" fontSizeWeight={[14, \"regular\"]}>\n            {tooltipText}\n          </ResponsiveTextV2>\n        </FlexCenter>\n      </FlexCenter>\n    );\n  }\n);\n"],"names":["TooltipWithPointerMobile","React","forwardRef","mobileTitle","tooltipWidth","tooltipText","zIndex","pointerColor","ref","jsx","FlexCenter","position","top","left","width","height","bg","jsxs","maxWidth","p","borderRadius","Fragment","ResponsiveTextV2","HorizontalDivider"],"mappings":";;;;;AAYaA,MAAAA,IAA2BC,EAAMC,WAC5C,CAAC;AAAA,EAAEC,aAAAA;AAAAA,EAAaC,cAAAA;AAAAA,EAAcC,aAAAA;AAAAA,EAAaC,QAAAA;AAAAA,EAAQC,cAAAA;AAAa,GAAGC,MAE/D,gBAAAC,EAACC,KACC,IAAI;AAAA,EACFC,UAAU;AAAA,EACVC,KAAK;AAAA,EACLC,MAAM;AAAA,EACNC,OAAO;AAAA,EACPC,QAAQ;AAAA,EACRC,IAAI;AAAA,EACJV,QAAAA;AAAAA,GAEF,KAAAE,GAEA,UAAA,gBAAAS,EAACP,GACC,EAAA,eAAc,UACd,IAAI;AAAA,EACFI,OAAOV;AAAAA,EACPc,UAAU;AAAA,EACVF,IAAI;AAAA,EACJG,GAAG;AAAA,EACHC,cAAc;AAGfjB,GAAAA,UAAAA;AAAAA,EAAAA,KAEG,gBAAAc,EAAAI,GAAA,EAAA,UAAA;AAAA,IAAC,gBAAAZ,EAAAa,GAAA,EAAiB,UAAS,QAAO,gBAAgB,CAAC,IAAI,MAAM,GAC1DnB,UACHA,EAAA,CAAA;AAAA,IAEA,gBAAAM,EAACc,KACC,OAAM,gCACN,OAAOhB,GACP,QAAO,OACP,GAAE,SAAQ,CAAA;AAAA,EAAA,GAEd;AAAA,EAGF,gBAAAE,EAACa,KAAiB,UAAS,QAAO,gBAAgB,CAAC,IAAI,SAAS,GAC7DjB,UACHA,EAAA,CAAA;AAAA,EACF,CAAA,EACF,CAAA,CAGN;"}

package/lib/sd-component-library288.js

@@ -1,5 +1,77 @@
-const t = "";
+import { jsxs as i, Fragment as n, jsx as r } from "./sd-component-library196.js";
+import y from "./sd-component-library193.js";
+import "./sd-component-library197.js";
+import { Box as p, Flex as w } from "./sd-component-library198.js";
+import { TriangularPointerIcon as x } from "./sd-component-library189.js";
+import { ResponsiveTextV2 as W } from "./sd-component-library147.js";
+const S = y.forwardRef(({
+  pointerSx: s,
+  tooltipSx: l,
+  tooltipText: h,
+  tooltipWidth: a,
+  tooltipPy: c,
+  tooltipPx: g,
+  pointerSize: m,
+  tooltipOffset: e,
+  placement: t,
+  containerSx: z,
+  animationDuration: f,
+  state: b,
+  pointerColor: o
+}, u) => {
+  const R = t === "right" ? {
+    left: "100%"
+  } : {
+    right: "100%"
+  }, d = {
+    size: `${m}px`,
+    color: o,
+    sx: {
+      my: "auto",
+      ...s
+    }
+  };
+  return /* @__PURE__ */ i(w, { sx: {
+    position: "absolute",
+    top: "calc(50% - 14px)",
+    cursor: "default",
+    alignItems: "center",
+    opacity: b === "entered" ? 1 : 0,
+    transition: `opacity ${f}ms`,
+    zIndex: 1,
+    ...R,
+    ...l
+  }, ref: u, "data-test": "tooltip-content", children: [
+    t === "right" && /* @__PURE__ */ i(n, { children: [
+      /* @__PURE__ */ r(p, { width: `${e}px` }),
+      /* @__PURE__ */ r(x, { direction: "left", ...d })
+    ] }),
+    /* @__PURE__ */ r(W, { fontSizeWeight: [14, "regular"], sx: {
+      width: a,
+      lineHeight: "16px",
+      bg: "cl_white",
+      px: g,
+      py: c,
+      borderColor: "cl_lightGrey",
+      borderWidth: "1px",
+      borderStyle: "solid",
+      ...t === "left" ? {
+        borderRightWidth: "2px",
+        borderRightColor: o,
+        borderRadius: "3px 0 0 3px"
+      } : {
+        borderLeftWidth: "2px",
+        borderLeftColor: o,
+        borderRadius: "0 3px 3px 0"
+      }
+    }, children: h }),
+    t === "left" && /* @__PURE__ */ i(n, { children: [
+      /* @__PURE__ */ r(x, { direction: "right", ...d }),
+      /* @__PURE__ */ r(p, { width: `${e}px` })
+    ] })
+  ] });
+});
 export {
-  t as default
+  S as TooltipWithPointerHorizontal
 };
 //# sourceMappingURL=sd-component-library288.js.map

package/lib/sd-component-library288.js.map

@@ -1 +1 @@
-{"version":3,"file":"sd-component-library288.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"sd-component-library288.js","sources":["../src/components/tooltips/tooltip-with-pointer/partials/tooltip-with-pointer-horizontal/tooltip-with-pointer-horizontal.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { Box, Flex } from \"rebass\";\n\nimport { TriangularPointerIcon } from \"../../../../icons\";\nimport { ResponsiveTextV2 } from \"../../../../texts\";\nimport { TooltipWithPointerPartialProps as Props } from \"../interfaces\";\n\nexport const TooltipWithPointerHorizontal = React.forwardRef<\n  HTMLDivElement,\n  Props\n>(\n  (\n    {\n      pointerSx,\n      tooltipSx,\n      tooltipText,\n      tooltipWidth,\n      tooltipPy,\n      tooltipPx,\n      pointerSize,\n      tooltipOffset,\n      placement,\n      containerSx,\n      animationDuration,\n      state,\n      pointerColor,\n    },\n    ref\n  ) => {\n    const tooltipContainerProps =\n      placement === \"right\"\n        ? {\n            left: \"100%\",\n          }\n        : {\n            right: \"100%\",\n          };\n\n    const pointerCommonProps = {\n      size: `${pointerSize}px`,\n      color: pointerColor,\n      sx: {\n        my: \"auto\",\n        ...pointerSx,\n      },\n    };\n\n    return (\n      <Flex\n        sx={{\n          position: \"absolute\",\n          top: \"calc(50% - 14px)\",\n          cursor: \"default\",\n          alignItems: \"center\",\n          opacity: state === \"entered\" ? 1 : 0,\n          transition: `opacity ${animationDuration}ms`,\n          zIndex: 1,\n          ...tooltipContainerProps,\n          ...tooltipSx,\n        }}\n        ref={ref}\n        data-test=\"tooltip-content\"\n      >\n        {placement === \"right\" && (\n          <>\n            <Box width={`${tooltipOffset}px`} />\n            <TriangularPointerIcon direction=\"left\" {...pointerCommonProps} />\n          </>\n        )}\n\n        <ResponsiveTextV2\n          fontSizeWeight={[14, \"regular\"]}\n          sx={{\n            width: tooltipWidth,\n            lineHeight: \"16px\",\n            bg: \"cl_white\",\n            px: tooltipPx,\n            py: tooltipPy,\n            borderColor: \"cl_lightGrey\",\n            borderWidth: \"1px\",\n            borderStyle: \"solid\",\n            ...(placement === \"left\"\n              ? {\n                  borderRightWidth: \"2px\",\n                  borderRightColor: pointerColor,\n                  borderRadius: \"3px 0 0 3px\",\n                }\n              : {\n                  borderLeftWidth: \"2px\",\n                  borderLeftColor: pointerColor,\n                  borderRadius: \"0 3px 3px 0\",\n                }),\n          }}\n        >\n          {tooltipText}\n        </ResponsiveTextV2>\n\n        {placement === \"left\" && (\n          <>\n            <TriangularPointerIcon direction=\"right\" {...pointerCommonProps} />\n            <Box width={`${tooltipOffset}px`} />\n          </>\n        )}\n      </Flex>\n    );\n  }\n);\n"],"names":["TooltipWithPointerHorizontal","React","forwardRef","pointerSx","tooltipSx","tooltipText","tooltipWidth","tooltipPy","tooltipPx","pointerSize","tooltipOffset","placement","containerSx","animationDuration","state","pointerColor","ref","tooltipContainerProps","left","right","pointerCommonProps","size","color","sx","my","jsxs","Flex","position","top","cursor","alignItems","opacity","transition","zIndex","Fragment","jsx","Box","TriangularPointerIcon","ResponsiveTextV2","width","lineHeight","bg","px","py","borderColor","borderWidth","borderStyle","borderRightWidth","borderRightColor","borderRadius","borderLeftWidth","borderLeftColor"],"mappings":";;;;;;AAQaA,MAAAA,IAA+BC,EAAMC,WAIhD,CACE;AAAA,EACEC,WAAAA;AAAAA,EACAC,WAAAA;AAAAA,EACAC,aAAAA;AAAAA,EACAC,cAAAA;AAAAA,EACAC,WAAAA;AAAAA,EACAC,WAAAA;AAAAA,EACAC,aAAAA;AAAAA,EACAC,eAAAA;AAAAA,EACAC,WAAAA;AAAAA,EACAC,aAAAA;AAAAA,EACAC,mBAAAA;AAAAA,EACAC,OAAAA;AAAAA,EACAC,cAAAA;AACF,GACAC,MACG;AACGC,QAAAA,IACJN,MAAc,UACV;AAAA,IACEO,MAAM;AAAA,EAAA,IAER;AAAA,IACEC,OAAO;AAAA,EAAA,GAGTC,IAAqB;AAAA,IACzBC,MAAO,GAAEZ,CAAY;AAAA,IACrBa,OAAOP;AAAAA,IACPQ,IAAI;AAAA,MACFC,IAAI;AAAA,MACJ,GAAGrB;AAAAA,IACL;AAAA,EAAA;AAIA,SAAA,gBAAAsB,EAACC,KACC,IAAI;AAAA,IACFC,UAAU;AAAA,IACVC,KAAK;AAAA,IACLC,QAAQ;AAAA,IACRC,YAAY;AAAA,IACZC,SAASjB,MAAU,YAAY,IAAI;AAAA,IACnCkB,YAAa,WAAUnB,CAAkB;AAAA,IACzCoB,QAAQ;AAAA,IACR,GAAGhB;AAAAA,IACH,GAAGb;AAAAA,EACL,GACA,KAAAY,GACA,aAAU,mBAETL,UAAAA;AAAAA,IAAAA,MAAc,WAEX,gBAAAc,EAAAS,GAAA,EAAA,UAAA;AAAA,MAAA,gBAAAC,EAACC,GAAI,EAAA,OAAQ,GAAE1B,CAAc,MAAI;AAAA,MAChC,gBAAAyB,EAAAE,GAAA,EAAsB,WAAU,QAAWjB,GAAAA,EAAmB,CAAA;AAAA,IAAA,GACjE;AAAA,sBAGDkB,GACC,EAAA,gBAAgB,CAAC,IAAI,SAAS,GAC9B,IAAI;AAAA,MACFC,OAAOjC;AAAAA,MACPkC,YAAY;AAAA,MACZC,IAAI;AAAA,MACJC,IAAIlC;AAAAA,MACJmC,IAAIpC;AAAAA,MACJqC,aAAa;AAAA,MACbC,aAAa;AAAA,MACbC,aAAa;AAAA,MACb,GAAInC,MAAc,SACd;AAAA,QACEoC,kBAAkB;AAAA,QAClBC,kBAAkBjC;AAAAA,QAClBkC,cAAc;AAAA,MAAA,IAEhB;AAAA,QACEC,iBAAiB;AAAA,QACjBC,iBAAiBpC;AAAAA,QACjBkC,cAAc;AAAA,MAChB;AAAA,IAAA,GAGL5C,UACHA,GAAA;AAAA,IAECM,MAAc,UAEX,gBAAAc,EAAAS,GAAA,EAAA,UAAA;AAAA,MAAA,gBAAAC,EAACE,GAAsB,EAAA,WAAU,SAAYjB,GAAAA,EAAmB,CAAA;AAAA,MAC/D,gBAAAe,EAAAC,GAAA,EAAI,OAAQ,GAAE1B,CAAc,MAAI;AAAA,IAAA,GACnC;AAAA,EAEJ,EAAA,CAAA;AAEJ,CACF;"}

package/lib/sd-component-library289.js

@@ -1,5 +1,78 @@
-var r = {};
+import { jsxs as e, Fragment as p, jsx as o } from "./sd-component-library196.js";
+import R from "./sd-component-library193.js";
+import "./sd-component-library197.js";
+import { Box as d, Flex as T } from "./sd-component-library198.js";
+import { TriangularPointerIcon as s } from "./sd-component-library189.js";
+import { ResponsiveTextV2 as W } from "./sd-component-library147.js";
+const F = R.forwardRef(({
+  pointerSx: x,
+  tooltipPx: l,
+  tooltipText: a,
+  tooltipSx: m,
+  tooltipPy: c,
+  tooltipOffset: i,
+  pointerSize: h,
+  tooltipWidth: b,
+  placement: t,
+  state: f,
+  containerSx: B,
+  animationDuration: g,
+  pointerColor: r
+}, u) => {
+  const y = t === "bottom" ? {
+    top: "100%"
+  } : {
+    bottom: "100%"
+  }, n = {
+    size: `${h}px`,
+    color: r,
+    sx: {
+      my: "auto",
+      ...x
+    }
+  };
+  return /* @__PURE__ */ e(T, { flexDirection: "column", sx: {
+    position: "absolute",
+    left: "50%",
+    transform: "translateX(-50%)",
+    cursor: "default",
+    alignItems: "center",
+    opacity: f === "entered" ? 1 : 0,
+    transition: `opacity ${g}ms`,
+    zIndex: 1,
+    ...y,
+    ...m
+  }, ref: u, "data-test": "tooltip-content", children: [
+    t === "bottom" && /* @__PURE__ */ e(p, { children: [
+      /* @__PURE__ */ o(d, { height: `${i}px` }),
+      /* @__PURE__ */ o(s, { direction: "top", ...n })
+    ] }),
+    /* @__PURE__ */ o(W, { fontSizeWeight: [14, "regular"], sx: {
+      width: b,
+      lineHeight: "16px",
+      bg: "cl_white",
+      px: l,
+      py: c,
+      borderColor: "cl_lightGrey",
+      borderWidth: "1px",
+      borderStyle: "solid",
+      ...t === "top" ? {
+        borderBottomWidth: "2px",
+        borderBottomColor: r,
+        borderRadius: "3px 3px 0 0"
+      } : {
+        borderTopWidth: "2px",
+        borderTopColor: r,
+        borderRadius: "0 0 3px 3px"
+      }
+    }, children: a }),
+    t === "top" && /* @__PURE__ */ e(p, { children: [
+      /* @__PURE__ */ o(s, { direction: "bottom", ...n }),
+      /* @__PURE__ */ o(d, { height: `${i}px` })
+    ] })
+  ] });
+});
 export {
-  r as __exports
+  F as TooltipWithPointerVertical
 };
 //# sourceMappingURL=sd-component-library289.js.map

package/lib/sd-component-library289.js.map

@@ -1 +1 @@
-{"version":3,"file":"sd-component-library289.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"sd-component-library289.js","sources":["../src/components/tooltips/tooltip-with-pointer/partials/tooltip-with-pointer-vertical/tooltip-with-pointer-vertical.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { Box, Flex } from \"rebass\";\n\nimport { TriangularPointerIcon } from \"../../../../icons\";\nimport { ResponsiveTextV2 } from \"../../../../texts\";\nimport { TooltipWithPointerPartialProps as Props } from \"../interfaces\";\n\nexport const TooltipWithPointerVertical = React.forwardRef<\n  HTMLDivElement,\n  Props\n>(\n  (\n    {\n      pointerSx,\n      tooltipPx,\n      tooltipText,\n      tooltipSx,\n      tooltipPy,\n      tooltipOffset,\n      pointerSize,\n      tooltipWidth,\n      placement,\n      state,\n      containerSx,\n      animationDuration,\n      pointerColor,\n    },\n    ref\n  ) => {\n    const tooltipContainerProps =\n      placement === \"bottom\"\n        ? {\n            top: \"100%\",\n          }\n        : {\n            bottom: \"100%\",\n          };\n\n    const pointerCommonProps = {\n      size: `${pointerSize}px`,\n      color: pointerColor,\n      sx: {\n        my: \"auto\",\n        ...pointerSx,\n      },\n    };\n\n    return (\n      <Flex\n        flexDirection=\"column\"\n        sx={{\n          position: \"absolute\",\n          left: \"50%\",\n          transform: \"translateX(-50%)\",\n          cursor: \"default\",\n          alignItems: \"center\",\n          opacity: state === \"entered\" ? 1 : 0,\n          transition: `opacity ${animationDuration}ms`,\n          zIndex: 1,\n          ...tooltipContainerProps,\n          ...tooltipSx,\n        }}\n        ref={ref}\n        data-test=\"tooltip-content\"\n      >\n        {placement === \"bottom\" && (\n          <>\n            <Box height={`${tooltipOffset}px`} />\n            <TriangularPointerIcon direction=\"top\" {...pointerCommonProps} />\n          </>\n        )}\n\n        <ResponsiveTextV2\n          fontSizeWeight={[14, \"regular\"]}\n          sx={{\n            width: tooltipWidth,\n            lineHeight: \"16px\",\n            bg: \"cl_white\",\n            px: tooltipPx,\n            py: tooltipPy,\n            borderColor: \"cl_lightGrey\",\n            borderWidth: \"1px\",\n            borderStyle: \"solid\",\n            ...(placement === \"top\"\n              ? {\n                  borderBottomWidth: \"2px\",\n                  borderBottomColor: pointerColor,\n                  borderRadius: \"3px 3px 0 0\",\n                }\n              : {\n                  borderTopWidth: \"2px\",\n                  borderTopColor: pointerColor,\n                  borderRadius: \"0 0 3px 3px\",\n                }),\n          }}\n        >\n          {tooltipText}\n        </ResponsiveTextV2>\n\n        {placement === \"top\" && (\n          <>\n            <TriangularPointerIcon direction=\"bottom\" {...pointerCommonProps} />\n            <Box height={`${tooltipOffset}px`} />\n          </>\n        )}\n      </Flex>\n    );\n  }\n);\n"],"names":["TooltipWithPointerVertical","React","forwardRef","pointerSx","tooltipPx","tooltipText","tooltipSx","tooltipPy","tooltipOffset","pointerSize","tooltipWidth","placement","state","containerSx","animationDuration","pointerColor","ref","tooltipContainerProps","top","bottom","pointerCommonProps","size","color","sx","my","jsxs","Flex","position","left","transform","cursor","alignItems","opacity","transition","zIndex","Fragment","jsx","Box","TriangularPointerIcon","ResponsiveTextV2","width","lineHeight","bg","px","py","borderColor","borderWidth","borderStyle","borderBottomWidth","borderBottomColor","borderRadius","borderTopWidth","borderTopColor"],"mappings":";;;;;;AAQaA,MAAAA,IAA6BC,EAAMC,WAI9C,CACE;AAAA,EACEC,WAAAA;AAAAA,EACAC,WAAAA;AAAAA,EACAC,aAAAA;AAAAA,EACAC,WAAAA;AAAAA,EACAC,WAAAA;AAAAA,EACAC,eAAAA;AAAAA,EACAC,aAAAA;AAAAA,EACAC,cAAAA;AAAAA,EACAC,WAAAA;AAAAA,EACAC,OAAAA;AAAAA,EACAC,aAAAA;AAAAA,EACAC,mBAAAA;AAAAA,EACAC,cAAAA;AACF,GACAC,MACG;AACGC,QAAAA,IACJN,MAAc,WACV;AAAA,IACEO,KAAK;AAAA,EAAA,IAEP;AAAA,IACEC,QAAQ;AAAA,EAAA,GAGVC,IAAqB;AAAA,IACzBC,MAAO,GAAEZ,CAAY;AAAA,IACrBa,OAAOP;AAAAA,IACPQ,IAAI;AAAA,MACFC,IAAI;AAAA,MACJ,GAAGrB;AAAAA,IACL;AAAA,EAAA;AAGF,SACG,gBAAAsB,EAAAC,GAAA,EACC,eAAc,UACd,IAAI;AAAA,IACFC,UAAU;AAAA,IACVC,MAAM;AAAA,IACNC,WAAW;AAAA,IACXC,QAAQ;AAAA,IACRC,YAAY;AAAA,IACZC,SAASpB,MAAU,YAAY,IAAI;AAAA,IACnCqB,YAAa,WAAUnB,CAAkB;AAAA,IACzCoB,QAAQ;AAAA,IACR,GAAGjB;AAAAA,IACH,GAAGX;AAAAA,EACL,GACA,KAAAU,GACA,aAAU,mBAETL,UAAAA;AAAAA,IAAAA,MAAc,YAEX,gBAAAc,EAAAU,GAAA,EAAA,UAAA;AAAA,MAAA,gBAAAC,EAACC,GAAI,EAAA,QAAS,GAAE7B,CAAc,MAAI;AAAA,MACjC,gBAAA4B,EAAAE,GAAA,EAAsB,WAAU,OAAUlB,GAAAA,EAAmB,CAAA;AAAA,IAAA,GAChE;AAAA,sBAGDmB,GACC,EAAA,gBAAgB,CAAC,IAAI,SAAS,GAC9B,IAAI;AAAA,MACFC,OAAO9B;AAAAA,MACP+B,YAAY;AAAA,MACZC,IAAI;AAAA,MACJC,IAAIvC;AAAAA,MACJwC,IAAIrC;AAAAA,MACJsC,aAAa;AAAA,MACbC,aAAa;AAAA,MACbC,aAAa;AAAA,MACb,GAAIpC,MAAc,QACd;AAAA,QACEqC,mBAAmB;AAAA,QACnBC,mBAAmBlC;AAAAA,QACnBmC,cAAc;AAAA,MAAA,IAEhB;AAAA,QACEC,gBAAgB;AAAA,QAChBC,gBAAgBrC;AAAAA,QAChBmC,cAAc;AAAA,MAChB;AAAA,IAAA,GAGL7C,UACHA,GAAA;AAAA,IAECM,MAAc,SAEX,gBAAAc,EAAAU,GAAA,EAAA,UAAA;AAAA,MAAA,gBAAAC,EAACE,GAAsB,EAAA,WAAU,UAAalB,GAAAA,EAAmB,CAAA;AAAA,MAChE,gBAAAgB,EAAAC,GAAA,EAAI,QAAS,GAAE7B,CAAc,MAAI;AAAA,IAAA,GACpC;AAAA,EAEJ,EAAA,CAAA;AAEJ,CACF;"}