intergalactic 15.126.0-prerelease.9 → 15.126.1-prerelease.0

package/scroll-area/lib/esm/ScrollArea.mjs

@@ -0,0 +1,272 @@
+import H from "@babel/runtime/helpers/esm/objectSpread2";
+import W from "@babel/runtime/helpers/esm/classCallCheck";
+import F from "@babel/runtime/helpers/esm/createClass";
+import d from "@babel/runtime/helpers/esm/assertThisInitialized";
+import L from "@babel/runtime/helpers/esm/inherits";
+import N from "@babel/runtime/helpers/esm/createSuper";
+import l from "@babel/runtime/helpers/esm/defineProperty";
+import D from "@babel/runtime/helpers/esm/extends";
+import U from "@babel/runtime/helpers/esm/objectWithoutProperties";
+import { sstyled as j } from 'intergalactic/utils/lib/core/index';
+import q, { sstyled as M, assignProps as V, Component as G } from 'intergalactic/core';
+import s from "react";
+import { findDOMNode as J } from "react-dom";
+import { Box as R } from 'intergalactic/flex-box';
+import y from 'intergalactic/utils/lib/rafTrottle';
+import { getNodeByRef as k } from 'intergalactic/utils/lib/ref';
+import { isAdvanceMode as K } from 'intergalactic/utils/lib/findComponent';
+import { callAllEventHandlers as B } from 'intergalactic/utils/lib/assignProps';
+import Q, { setAreaValue as X } from "./ScrollBar.mjs";
+import E from 'intergalactic/utils/lib/enhances/keyboardFocusEnhance';
+import Y from 'intergalactic/utils/lib/uniqueID';
+import Z from 'intergalactic/utils/lib/canUseDOM';
+var tt = ["position"], et = (
+  /*__reshadow_css_start__*/
+  (j.insert(
+    /*__inner_css_start__*/
+    `.___SScrollArea_cd2x4_gg_{position:relative;width:100%;height:100%}.___SShadowHorizontal_cd2x4_gg_:after,.___SShadowHorizontal_cd2x4_gg_:before,.___SShadowVertical_cd2x4_gg_:after,.___SShadowVertical_cd2x4_gg_:before{content:"";position:absolute;display:none;pointer-events:none}.___SShadowHorizontal_cd2x4_gg_:after,.___SShadowHorizontal_cd2x4_gg_:before{top:0;width:5px;height:100%}.___SShadowHorizontal_cd2x4_gg_._position_median_cd2x4_gg_:before{left:0;display:block;background:var(--intergalactic-scroll-area-shadow-left,
+    linear-gradient(to right, rgba(25, 27, 35, 0.1) 20.55%, rgba(255, 255, 255, 0.0001) 100%))}.___SShadowHorizontal_cd2x4_gg_._position_median_cd2x4_gg_:after{right:0;display:block;background:var(--intergalactic-scroll-area-shadow-right,
+    linear-gradient(to left, rgba(25, 27, 35, 0.1) 20.55%, rgba(255, 255, 255, 0.0001) 100%))}.___SShadowHorizontal_cd2x4_gg_._position_start_cd2x4_gg_:before{left:0;display:block;background:var(--intergalactic-scroll-area-shadow-left,
+    linear-gradient(to right, rgba(25, 27, 35, 0.1) 20.55%, rgba(255, 255, 255, 0.0001) 100%))}.___SShadowHorizontal_cd2x4_gg_._position_end_cd2x4_gg_:after{right:0;display:block;background:var(--intergalactic-scroll-area-shadow-right,
+    linear-gradient(to left, rgba(25, 27, 35, 0.1) 20.55%, rgba(255, 255, 255, 0.0001) 100%))}.___SShadowHorizontal_cd2x4_gg_.__leftOffset_cd2x4_gg_:before{left:var(--leftOffset_cd2x4)}.___SShadowHorizontal_cd2x4_gg_.__rightOffset_cd2x4_gg_:after{right:var(--rightOffset_cd2x4)}.___SShadowVertical_cd2x4_gg_:after,.___SShadowVertical_cd2x4_gg_:before{left:0;width:100%;height:5px}.___SShadowVertical_cd2x4_gg_._position_median_cd2x4_gg_:before{top:0;display:block;background:var(--intergalactic-scroll-area-shadow-top,
+    linear-gradient(to bottom, rgba(25, 27, 35, 0.1) 20.55%, rgba(255, 255, 255, 0.0001) 100%))}.___SShadowVertical_cd2x4_gg_._position_median_cd2x4_gg_:after{bottom:0;display:block;background:var(--intergalactic-scroll-area-shadow-bottom,
+    linear-gradient(to top, rgba(25, 27, 35, 0.1) 20.55%, rgba(255, 255, 255, 0.0001) 100%))}.___SShadowVertical_cd2x4_gg_._position_start_cd2x4_gg_:before{top:0;display:block;background:var(--intergalactic-scroll-area-shadow-top,
+    linear-gradient(to bottom, rgba(25, 27, 35, 0.1) 20.55%, rgba(255, 255, 255, 0.0001) 100%))}.___SShadowVertical_cd2x4_gg_._position_end_cd2x4_gg_:after{bottom:0;display:block;background:var(--intergalactic-scroll-area-shadow-bottom,
+    linear-gradient(to top, rgba(25, 27, 35, 0.1) 20.55%, rgba(255, 255, 255, 0.0001) 100%))}.___SShadowVertical_cd2x4_gg_.__topOffset_cd2x4_gg_:before{top:var(--topOffset_cd2x4)}.___SShadowVertical_cd2x4_gg_.__bottomOffset_cd2x4_gg_:after{bottom:var(--bottomOffset_cd2x4)}.___SContainer_cd2x4_gg_{display:block;width:100%;height:100%;box-sizing:content-box;overflow:auto;-webkit-overflow-scrolling:touch;outline:0;scrollbar-width:none;-ms-overflow-style:none}.___SContainer_cd2x4_gg_::-webkit-scrollbar{display:none}.___SContainer_cd2x4_gg_.__keyboardFocused_cd2x4_gg_:focus::after{position:absolute;display:block;content:"";top:0;right:0;bottom:0;left:0;top:var(--focusRingTopOffset_cd2x4);right:var(--focusRingRightOffset_cd2x4);bottom:var(--focusRingBottomOffset_cd2x4);left:var(--focusRingLeftOffset_cd2x4);box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5));pointer-events:none;z-index:2}`,
+    "cd2x4_gg_"
+  ), {
+    __SScrollArea: "___SScrollArea_cd2x4_gg_",
+    __SShadowHorizontal: "___SShadowHorizontal_cd2x4_gg_",
+    _leftOffset: "__leftOffset_cd2x4_gg_",
+    "--leftOffset": "--leftOffset_cd2x4",
+    _rightOffset: "__rightOffset_cd2x4_gg_",
+    "--rightOffset": "--rightOffset_cd2x4",
+    __SShadowVertical: "___SShadowVertical_cd2x4_gg_",
+    _topOffset: "__topOffset_cd2x4_gg_",
+    "--topOffset": "--topOffset_cd2x4",
+    _bottomOffset: "__bottomOffset_cd2x4_gg_",
+    "--bottomOffset": "--bottomOffset_cd2x4",
+    __SContainer: "___SContainer_cd2x4_gg_",
+    _keyboardFocused: "__keyboardFocused_cd2x4_gg_",
+    "--focusRingTopOffset": "--focusRingTopOffset_cd2x4",
+    "--focusRingRightOffset": "--focusRingRightOffset_cd2x4",
+    "--focusRingBottomOffset": "--focusRingBottomOffset_cd2x4",
+    "--focusRingLeftOffset": "--focusRingLeftOffset_cd2x4",
+    _position_median: "_position_median_cd2x4_gg_",
+    _position_start: "_position_start_cd2x4_gg_",
+    _position_end: "_position_end_cd2x4_gg_"
+  })
+), A = void 0;
+typeof window < "u" && (A = new Event("calculate"));
+var P = /* @__PURE__ */ s.forwardRef(function(h, x) {
+  h.position;
+  var p = U(h, tt);
+  return /* @__PURE__ */ s.createElement(R, D({
+    ref: x
+  }, p));
+}), O = /* @__PURE__ */ function(h) {
+  L(p, h);
+  var x = N(p);
+  function p(g) {
+    var t;
+    return W(this, p), t = x.call(this, g), l(d(t), "$wrapper", null), l(d(t), "observer", null), l(d(t), "horizontalBarRef", /* @__PURE__ */ s.createRef()), l(d(t), "verticalBarRef", /* @__PURE__ */ s.createRef()), l(d(t), "state", {
+      shadowHorizontal: !1,
+      shadowVertical: !1
+    }), l(d(t), "refWrapper", function(e) {
+      t.$wrapper = J(e);
+    }), l(d(t), "setStyleSizeProperty", function(e, o, r) {
+      var i = r;
+      typeof r == "number" && (i = r < 1 ? "".concat(100 * r, "%") : "".concat(r, "px")), e.style.setProperty(o, i);
+    }), l(d(t), "calculate", y(function() {
+      if (t.$container) {
+        var e = t.calculateSizeContainer(), o = e.height, r = e.width;
+        o && (t.$container.style.height = o), r && (t.$container.style.width = r), t.$container.dispatchEvent(A), t.setShadowContainer();
+      }
+    })), l(d(t), "updateBarsAria", y(function() {
+      X(t.$container, t.horizontalBarRef.current, t.verticalBarRef.current);
+    })), l(d(t), "handleScrollContainer", y(function() {
+      t.$container && (t.setShadowContainer(), t.updateBarsAria());
+    })), l(d(t), "handleScroll", function(e) {
+      var o;
+      (o = e.target) !== null && o !== void 0 && o.isEqualNode(t.$wrapper) && (e.target.scrollTop = 0, e.target.scrollLeft = 0);
+    }), l(d(t), "handleFocusIn", function(e) {
+      setTimeout(function() {
+        var o = t.asProps, r = o.keyboardFocused, i = o.leftOffset, a = o.rightOffset, f = o.topOffset, u = o.bottomOffset;
+        if (t.$container && typeof t.$container.scrollTo == "function") {
+          var c = t.$container.getBoundingClientRect(), n = e.target.getBoundingClientRect(), _ = {
+            top: f ?? 0,
+            left: i ?? 0,
+            right: a ?? 0,
+            bottom: u ?? 0
+          };
+          if (c) {
+            var m = Math.floor(n.top) >= c.bottom - _.bottom || Math.floor(n.bottom) <= c.top + _.top || Math.floor(n.left) >= c.right - _.right || Math.floor(n.right) <= c.left + _.left;
+            m && r && t.$container.scrollTo({
+              top: n.top + t.$container.scrollTop - _.top - c.top,
+              left: n.left + t.$container.scrollLeft - _.left - c.left
+            });
+          }
+        }
+      }, 0);
+    }), l(d(t), "toggleShadow", function(e, o, r) {
+      var i = Math.round(e), a = Math.round(o), f = "";
+      a <= 0 || (i <= 0 ? f = "end" : i >= a ? f = "start" : i > 0 && (f = "median")), t.setState(l({}, r, f));
+    }), l(d(t), "setShadowContainer", function() {
+      if (!(!t.asProps.shadow || !t.$container || !t.$wrapper)) {
+        var e = t.$container, o = e.scrollWidth, r = e.clientWidth, i = e.scrollHeight, a = e.clientHeight, f = e.scrollLeft, u = e.scrollTop, c = o - r, n = i - a;
+        t.toggleShadow(f, c, "shadowHorizontal"), t.toggleShadow(u, n, "shadowVertical");
+      }
+    }), Z() && (t.observer = new ResizeObserver(B(g.onResize, t.calculate))), t;
+  }
+  return F(p, [{
+    key: "$container",
+    get: function() {
+      return k(this.asProps.container);
+    }
+  }, {
+    key: "$inner",
+    get: function() {
+      return k(this.asProps.inner);
+    }
+  }, {
+    key: "calculateSizeContainer",
+    value: (
+      // for max height/width
+      function() {
+        var t = this.asProps, e = t.wMax, o = t.hMax, r = t.observeParentSize, i = {
+          width: "",
+          height: ""
+        };
+        if (!this.$container || !this.$wrapper) return i;
+        var a = this.$container, f = a.scrollWidth, u = a.scrollHeight, c = window.getComputedStyle(this.$wrapper), n = this.$wrapper.parentElement, _ = {
+          width: 0,
+          height: 0
+        };
+        r && (n && (_ = n.getBoundingClientRect()), e && this.setStyleSizeProperty(this.$wrapper, "max-width", e), o && this.setStyleSizeProperty(this.$wrapper, "max-height", o));
+        var m = Number.parseInt(c.getPropertyValue("max-width")), v = Number.parseInt(c.getPropertyValue("max-height"));
+        if (m) {
+          if (r && e && n.scrollWidth > _.width) {
+            var S = Math.round(n.scrollWidth.toFixed(1)) - Math.round(_.width.toFixed(1));
+            S < m && (m = m - S, this.$wrapper.style.setProperty("max-width", "".concat(m, "px")));
+          }
+          f > m ? i.width = "".concat(m, "px") : i.width = "100%";
+        }
+        if (v) {
+          if (r && o && n.scrollHeight > _.height) {
+            var b = Math.round(n.scrollHeight.toFixed(1)) - Math.round(_.height.toFixed(1));
+            b < v && (v = v - b, this.$wrapper.style.setProperty("max-height", "".concat(v, "px")));
+          }
+          u > v ? i.height = "".concat(v, "px") : i.height = "100%";
+        }
+        return i;
+      }
+    )
+  }, {
+    key: "getContainerProps",
+    value: function() {
+      var t = this.asProps, e = t.container, o = t.inner, r = t.onScroll, i = t.uid;
+      return {
+        id: "igc-".concat(i, "-scroll-container"),
+        ref: e,
+        $refInner: o,
+        onScroll: B(r, this.handleScrollContainer)
+      };
+    }
+  }, {
+    key: "getBarProps",
+    value: function() {
+      var t = this.asProps, e = t.container, o = t.orientation, r = t.uid, i = t.leftOffset, a = t.rightOffset;
+      return {
+        container: e,
+        orientation: o,
+        uid: r,
+        horizontalBarRef: this.horizontalBarRef,
+        verticalBarRef: this.verticalBarRef,
+        leftOffset: i,
+        rightOffset: a
+      };
+    }
+  }, {
+    key: "componentDidMount",
+    value: function() {
+      var t;
+      if (this.calculate(), this.updateBarsAria(), this.$inner) {
+        var e;
+        (e = this.observer) === null || e === void 0 || e.observe(this.$inner);
+      }
+      if (this.$container) {
+        var o;
+        (o = this.observer) === null || o === void 0 || o.observe(this.$container);
+      }
+      (t = this.$inner) === null || t === void 0 || t.addEventListener("focusin", this.handleFocusIn);
+    }
+  }, {
+    key: "componentDidUpdate",
+    value: function() {
+      this.calculate();
+    }
+  }, {
+    key: "componentWillUnmount",
+    value: function() {
+      var t, e;
+      (t = this.observer) === null || t === void 0 || t.disconnect(), (e = this.$inner) === null || e === void 0 || e.removeEventListener("focusin", this.handleFocusIn);
+    }
+  }, {
+    key: "render",
+    value: function() {
+      var t = this.asProps, e, o = R, r = P, i = P, a = this.asProps, f = a.Children, u = a.styles, c = a.orientation, n = a.tabIndex, _ = a.forcedAdvancedMode, m = a.leftOffset, v = a.rightOffset, S = a.topOffset, b = a.bottomOffset, $ = this.state, z = $.shadowVertical, C = $.shadowHorizontal, T = _ || K(f, [w.Container.displayName, w.Bar.displayName]);
+      return e = M(u), /* @__PURE__ */ s.createElement(o, e.cn("SScrollArea", H({}, V({
+        ref: this.refWrapper,
+        onScroll: this.handleScroll,
+        __excludeProps: ["tabIndex"]
+      }, t))), T ? /* @__PURE__ */ s.createElement(f, e.cn("Children", {})) : /* @__PURE__ */ s.createElement(s.Fragment, null, /* @__PURE__ */ s.createElement(w.Container, {
+        tabIndex: n
+      }, /* @__PURE__ */ s.createElement(f, e.cn("Children", {}))), (c === void 0 || c === "horizontal") && /* @__PURE__ */ s.createElement(w.Bar, {
+        orientation: "horizontal"
+      }), (c === void 0 || c === "vertical") && /* @__PURE__ */ s.createElement(w.Bar, {
+        orientation: "vertical"
+      })), z && /* @__PURE__ */ s.createElement(r, e.cn("SShadowVertical", {
+        position: z,
+        topOffset: S ? "".concat(S, "px") : void 0,
+        bottomOffset: b ? "".concat(b, "px") : void 0
+      })), C && /* @__PURE__ */ s.createElement(i, e.cn("SShadowHorizontal", {
+        position: C,
+        leftOffset: m ? "".concat(m, "px") : void 0,
+        rightOffset: v ? "".concat(v, "px") : void 0
+      })));
+    }
+  }]), p;
+}(G);
+l(O, "displayName", "ScrollArea");
+l(O, "style", et);
+l(O, "enhance", [Y(), E()]);
+l(O, "defaultProps", function() {
+  return {
+    container: /* @__PURE__ */ s.createRef(),
+    inner: /* @__PURE__ */ s.createRef(),
+    tabIndex: 0,
+    observeParentSize: !1
+  };
+});
+function I(h) {
+  var x = arguments[0], p, g = R, t = h.Children, e = h.styles, o = h.$refInner, r = h.focusRingTopOffset, i = r === void 0 ? 0 : r, a = h.focusRingRightOffset, f = a === void 0 ? 0 : a, u = h.focusRingBottomOffset, c = u === void 0 ? 0 : u, n = h.focusRingLeftOffset, _ = n === void 0 ? 0 : n;
+  return p = M(e), /* @__PURE__ */ s.createElement(g, p.cn("SContainer", H({}, V({
+    tabIndex: 0,
+    focusRingTopOffset: i,
+    focusRingRightOffset: f,
+    focusRingBottomOffset: c,
+    focusRingLeftOffset: _
+  }, x))), /* @__PURE__ */ s.createElement("div", p.cn("div", {
+    ref: o
+  }), /* @__PURE__ */ s.createElement(t, p.cn("Children", {}))));
+}
+I.enhance = [E()];
+var w = q(O, {
+  Container: I,
+  Bar: Q
+});
+export {
+  w as ScrollArea,
+  w as default,
+  A as eventCalculate
+};

package/scroll-area/lib/esm/ScrollBar.mjs

@@ -0,0 +1,260 @@
+import W from "@babel/runtime/helpers/esm/objectSpread2";
+import M from "@babel/runtime/helpers/esm/slicedToArray";
+import T from "@babel/runtime/helpers/esm/classCallCheck";
+import X from "@babel/runtime/helpers/esm/createClass";
+import f from "@babel/runtime/helpers/esm/assertThisInitialized";
+import Y from "@babel/runtime/helpers/esm/inherits";
+import A from "@babel/runtime/helpers/esm/createSuper";
+import s from "@babel/runtime/helpers/esm/defineProperty";
+import { sstyled as K } from 'intergalactic/utils/lib/core/index';
+import U, { sstyled as H, assignProps as L, Component as V } from 'intergalactic/core';
+import $ from "react";
+import { findDOMNode as w } from "react-dom";
+import { Box as P } from 'intergalactic/flex-box';
+import { getNodeByRef as F } from 'intergalactic/utils/lib/ref';
+import N from 'intergalactic/utils/lib/enhances/contextEnhance';
+var I = (
+  /*__reshadow_css_start__*/
+  (K.insert(
+    /*__inner_css_start__*/
+    ".___SScrollBar_1211c_gg_{position:absolute;display:flex}.___SScrollBar_1211c_gg_._orientation_vertical_1211c_gg_{top:var(--intergalactic-spacing-1x, 4px);right:0;width:8px;height:calc(100% - var(--offsetSum_1211c) - var(--intergalactic-spacing-2x, 8px));justify-content:center}.___SScrollBar_1211c_gg_._orientation_horizontal_1211c_gg_{bottom:0;height:12px;align-items:center;width:calc(100% - var(--offsetSum_1211c) - var(--intergalactic-spacing-2x, 8px))}.___SSlider_1211c_gg_{cursor:pointer;width:6px;height:6px;border-radius:4px;background-color:var(--intergalactic-scroll-bar-background, rgba(25, 27, 35, 0.3))}",
+    "1211c_gg_"
+  ), {
+    __SScrollBar: "___SScrollBar_1211c_gg_",
+    _orientation_vertical: "_orientation_vertical_1211c_gg_",
+    "--offsetSum": "--offsetSum_1211c",
+    _orientation_horizontal: "_orientation_horizontal_1211c_gg_",
+    __SSlider: "___SSlider_1211c_gg_"
+  })
+), j = /* @__PURE__ */ $.createContext(!1), k = 50, Z = function(v, d, t) {
+  if (!(!v || !(d || t))) {
+    var r = v.scrollWidth, l = v.clientWidth, o = v.scrollHeight, e = v.clientHeight, i = v.scrollLeft, a = v.scrollTop, n = r - l, u = o - e;
+    d && (d.setAttribute("aria-valuenow", Math.floor(i)), d.setAttribute("aria-valuemax", n)), t && (t.setAttribute("aria-valuenow", Math.floor(a)), t.setAttribute("aria-valuemax", u));
+  }
+}, x = /* @__PURE__ */ function(B) {
+  Y(d, B);
+  var v = A(d);
+  function d() {
+    var t;
+    T(this, d);
+    for (var r = arguments.length, l = new Array(r), o = 0; o < r; o++)
+      l[o] = arguments[o];
+    return t = v.call.apply(v, [this].concat(l)), s(f(t), "$bar", null), s(f(t), "$slider", null), s(f(t), "sliderStyle", {
+      width: k,
+      height: k
+    }), s(f(t), "kefScroll", {
+      x: 0,
+      y: 0
+    }), s(f(t), "kefBar", {
+      x: 0,
+      y: 0
+    }), s(f(t), "_scroll", {
+      left: 0,
+      top: 0
+    }), s(f(t), "_mouse", {
+      pageX: 0,
+      pageY: 0
+    }), s(f(t), "state", {
+      visibleScroll: !1
+    }), s(f(t), "refBar", function(e) {
+      var i = w(e);
+      t.$bar = i;
+      var a = t.getOrientation(), n = t.asProps, u = n.horizontalBarRef, c = n.verticalBarRef;
+      a === "horizontal" && u && (u.current = i), a === "vertical" && c && (c.current = i), Z(t.$container, u == null ? void 0 : u.current, c == null ? void 0 : c.current);
+    }), s(f(t), "refSlider", function(e) {
+      t.$slider = w(e);
+    }), s(f(t), "calculate", function() {
+      if (t.$container) {
+        var e = t.calculateVisibleScroll();
+        t.setState({
+          visibleScroll: e
+        }, function() {
+          if (!(!t.$container || !t.$bar || !t.$slider)) {
+            var i = t.getOrientation();
+            t.sliderStyle = t.calculateSliderStyle(), t.kefBar = t.calculateKefBar(), t.kefScroll = t.calculateKefScroll(), i === "horizontal" ? t.$slider.style.width = "".concat(t.sliderStyle.width, "px") : i === "vertical" && (t.$slider.style.height = "".concat(t.sliderStyle.height, "px")), t.handleScroll();
+          }
+        });
+      }
+    }), s(f(t), "handleScroll", function() {
+      if (!(!t.$container || !t.$slider)) {
+        var e = t.$container, i = e.scrollTop, a = e.scrollLeft, n = t.getOrientation();
+        n === "horizontal" ? t.$slider.style.transform = "translateX(".concat(a * t.kefScroll.x, "px)") : n === "vertical" && (t.$slider.style.transform = "translateY(".concat(i * t.kefScroll.y, "px)"));
+      }
+    }), s(f(t), "handleSelectStartDocument", function(e) {
+      return e.preventDefault();
+    }), s(f(t), "handleMouseMoveDocument", function(e) {
+      var i = e.pageX, a = e.pageY, n = t._scroll, u = n.left, c = n.top, h = t.kefScroll, p = h.x, _ = h.y, g = t.getOrientation();
+      g === "horizontal" ? t.$container.scrollLeft = t.calculateScrollByDiff(i, t._mouse.pageX, u, p) : g === "vertical" && (t.$container.scrollTop = t.calculateScrollByDiff(a, t._mouse.pageY, c, _));
+    }), s(f(t), "handleMouseUpDocument", function() {
+      document.removeEventListener("mousemove", t.handleMouseMoveDocument, !0), document.removeEventListener("mouseup", t.handleMouseUpDocument, !0), document.removeEventListener("selectstart", t.handleSelectStartDocument, !0);
+    }), s(f(t), "handleMouseDownSlider", function(e) {
+      e.stopPropagation(), t._mouse = {
+        pageX: e.pageX,
+        pageY: e.pageY
+      };
+      var i = t.$container, a = i.scrollLeft, n = i.scrollTop;
+      t._scroll = {
+        left: a,
+        top: n
+      }, document.addEventListener("mousemove", t.handleMouseMoveDocument, !0), document.addEventListener("mouseup", t.handleMouseUpDocument, !0), document.addEventListener("selectstart", t.handleSelectStartDocument, !0);
+    }), s(f(t), "handleMouseDownBar", function(e) {
+      e.stopPropagation();
+      var i = e.pageX, a = e.pageY, n = window, u = n.pageXOffset, c = n.pageYOffset, h = t.$bar.getBoundingClientRect(), p = h.left, _ = h.top, g = t.getOrientation();
+      g === "horizontal" ? t.$container.scrollLeft = t.calculateScrollByClick(p, u, i, t.kefBar.x, t.kefScroll.x) : g === "vertical" && (t.$container.scrollTop = t.calculateScrollByClick(_, c, a, t.kefBar.y, t.kefScroll.y));
+    }), t;
+  }
+  return X(d, [{
+    key: "$container",
+    get: function() {
+      return F(this.asProps.container);
+    }
+  }, {
+    key: "calculateVisibleScroll",
+    value: function() {
+      var r = this.getOrientation(), l = this.calculateOrientation(), o = M(l, 2), e = o[0], i = o[1];
+      return e && r === "horizontal" ? !0 : !!(i && r === "vertical");
+    }
+  }, {
+    key: "calculateKefScroll",
+    value: function() {
+      var r = this.$container, l = r.clientWidth, o = r.clientHeight, e = r.scrollWidth, i = r.scrollHeight, a = this.$bar, n = a.clientWidth, u = a.clientHeight, c = this.sliderStyle, h = c.width, p = c.height;
+      return {
+        x: (n - h) / (e - l),
+        y: (u - p) / (i - o)
+      };
+    }
+  }, {
+    key: "calculateKefBar",
+    value: function() {
+      var r = this.$bar, l = r.clientWidth, o = r.clientHeight, e = this.sliderStyle, i = e.width, a = e.height;
+      return {
+        x: (l - i) / l,
+        y: (o - a) / o
+      };
+    }
+  }, {
+    key: "calculateSliderStyle",
+    value: function() {
+      var r = this.$bar, l = r.clientWidth, o = r.clientHeight, e = this.$container, i = e.scrollWidth, a = e.scrollHeight, n = function(c, h) {
+        var p = Math.min(c / h, 1);
+        return Math.round(c * p);
+      };
+      return {
+        width: Math.max(n(l, i), k),
+        height: Math.max(n(o, a), k)
+      };
+    }
+  }, {
+    key: "calculateScrollByClick",
+    value: function(r, l, o, e, i) {
+      var a = r + l, n = (o - a) * e;
+      return n / i;
+    }
+  }, {
+    key: "calculateScrollByDiff",
+    value: function(r, l, o, e) {
+      var i = r - l, a = o * e + i;
+      return a / e;
+    }
+  }, {
+    key: "calculateOrientation",
+    value: function() {
+      if (!this.$container) return [!1, !1];
+      var r = this.$container, l = r.scrollWidth, o = r.scrollHeight, e = r.clientWidth, i = r.clientHeight;
+      return [l > e, o > i];
+    }
+  }, {
+    key: "getOrientation",
+    value: function() {
+      if (this.asProps.orientation !== void 0) return this.asProps.orientation;
+      var r = this.calculateOrientation(), l = M(r, 2), o = l[0], e = l[1];
+      if (e) return "vertical";
+      if (o) return "horizontal";
+    }
+  }, {
+    key: "subscribe",
+    value: function(r) {
+      r && (r.addEventListener("scroll", this.handleScroll), r.addEventListener("calculate", this.calculate));
+    }
+  }, {
+    key: "unsubscribe",
+    value: function(r) {
+      r && (r.removeEventListener("scroll", this.handleScroll), r.removeEventListener("calculate", this.calculate));
+    }
+  }, {
+    key: "getSliderProps",
+    value: function() {
+      return {
+        ref: this.refSlider,
+        onMouseDown: this.handleMouseDownSlider
+      };
+    }
+  }, {
+    key: "componentDidMount",
+    value: function() {
+      this.subscribe(this.$container);
+    }
+  }, {
+    key: "componentWillUnmount",
+    value: function() {
+      this.unsubscribe(this.$container);
+    }
+  }, {
+    key: "render",
+    value: function() {
+      var r = this.asProps, l, o = P, e = this.asProps, i = e.styles, a = e.uid, n = e.position, u = e.container, c = e.orientation, h = e.hideFromScreenReaders, p = this.state.visibleScroll, _ = this.asProps, g = _.leftOffset, m = _.rightOffset, S = _.topOffset, y = _.bottomOffset;
+      if (!p)
+        return null;
+      var b = 0;
+      if (c === "horizontal" && (g && (b += g), m && (b += m), n === "sticky" && u.current)) {
+        var O = u.current.getBoundingClientRect(), R = O.left, E = O.right;
+        g && (g += R), m && (m += E);
+      }
+      if (c === "vertical" && (S && (b += S), y && (b += y), n === "sticky" && u.current)) {
+        var D = u.current.getBoundingClientRect(), z = D.top, C = D.bottom;
+        S && (S += z), y && (y += C);
+      }
+      return l = H(i), /* @__PURE__ */ $.createElement(o, l.cn("SScrollBar", W({}, L({
+        left: c === "horizontal" && g ? "".concat(g, "px") : void 0,
+        right: c === "horizontal" && m ? "".concat(m, "px") : void 0,
+        top: c === "vertical" && S ? "".concat(S, "px") : void 0,
+        bottom: c === "vertical" && y ? "".concat(y, "px") : void 0,
+        offsetSum: "".concat(b, "px"),
+        role: h ? void 0 : "scrollbar",
+        "aria-hidden": h ? "true" : void 0,
+        ref: this.refBar,
+        "aria-valuemin": h ? void 0 : 0,
+        "aria-controls": h ? void 0 : "igc-".concat(a, "-scroll-container"),
+        "aria-orientation": h ? void 0 : this.getOrientation(),
+        onMouseDown: this.handleMouseDownBar,
+        orientation: this.getOrientation()
+      }, r))));
+    }
+  }]), d;
+}(V);
+s(x, "displayName", "Bar");
+s(x, "style", I);
+s(x, "enhance", [N(j, "hideFromScreenReaders")]);
+s(x, "defaultProps", function() {
+  return {
+    container: /* @__PURE__ */ $.createRef(),
+    children: /* @__PURE__ */ $.createElement(G.Slider, null)
+  };
+});
+function q(B) {
+  var v = arguments[0], d, t = B.styles, r = P;
+  return d = H(t), /* @__PURE__ */ $.createElement(r, d.cn("SSlider", W({}, L({
+    onDragStart: function() {
+      return !1;
+    }
+  }, v))));
+}
+var G = U(x, {
+  Slider: q
+});
+export {
+  k as DEFAULT_SLIDER_SIZE,
+  G as default,
+  j as hideScrollBarsFromScreenReadersContext,
+  Z as setAreaValue
+};

package/scroll-area/lib/esm/index.mjs

@@ -0,0 +1,8 @@
+import { ScrollArea as l, ScrollArea as o, eventCalculate as a } from "./ScrollArea.mjs";
+import { hideScrollBarsFromScreenReadersContext as c } from "./ScrollBar.mjs";
+export {
+  l as ScrollArea,
+  o as default,
+  a as eventCalculate,
+  c as hideScrollBarsFromScreenReadersContext
+};

package/scroll-area/package.json

@@ -1 +1 @@
-{"name":"intergalactic/scroll-area","description":"Semrush ScrollArea Component","version":"5.45.0-prerelease.9","main":"lib/cjs/index.js","module":"lib/es6/index.js","typings":"lib/types/index.d.ts","sideEffects":false,"author":"UI-kit team <ui-kit-team@semrush.com>","license":"MIT","scripts":{"build":"pnpm semcore-builder --source=js"},"dependencies":{"@semcore/utils":"4.47.1-prerelease.9","@semcore/flex-box":"5.41.0-prerelease.9"},"peerDependencies":{"@semcore/core":"^2.39.0-prerelease.9","react":"16.8 - 18","react-dom":"16.8 - 18"},"repository":{"type":"git","url":"https://github.com/semrush/intergalactic.git","directory":"semcore/scroll-area"},"devDependencies":{"@types/react":"18.0.21","@semcore/testing-utils":"1.0.0"}}
+{"name":"intergalactic/scroll-area","description":"Semrush ScrollArea Component","version":"5.45.1-prerelease.0","main":"lib/cjs/index.js","module":"lib/es6/index.js","typings":"lib/types/index.d.ts","sideEffects":false,"author":"UI-kit team <ui-kit-team@semrush.com>","license":"MIT","scripts":{"build":"pnpm semcore-builder --source=js && pnpm vite build"},"exports":{"require":"./lib/cjs/index.js","import":"./lib/esm/index.mjs","types":"./lib/types/index.d.ts"},"dependencies":{"@semcore/utils":"4.48.1-prerelease.0","@semcore/flex-box":"5.41.1-prerelease.0"},"peerDependencies":{"@semcore/core":"^2.39.1-prerelease.0","react":"16.8 - 18","react-dom":"16.8 - 18"},"repository":{"type":"git","url":"https://github.com/semrush/intergalactic.git","directory":"semcore/scroll-area"},"devDependencies":{"@types/react":"18.0.21","@semcore/testing-utils":"1.0.0"}}

package/select/lib/cjs/InputSearch.js

@@ -24,12 +24,12 @@ var _context = require("./context");
 var _i18nEnhance = _interopRequireDefault(require("intergalactic/utils/lib/enhances/i18nEnhance"));
 var _intergalacticDynamicLocales = require("./translations/__intergalactic-dynamic-locales");
 /*__reshadow-styles__:"./style/input-search.shadow.css"*/
-var style = ( /*__reshadow_css_start__*/_index.sstyled.insert( /*__inner_css_start__*/".___SInputSearch_h5hp1_gg_._size_m_h5hp1_gg_{height:32px}.___SSearchClear_h5hp1_gg_{padding:0 var(--intergalactic-spacing-2x, 8px)}.___SSearchClear_h5hp1_gg_.__hide_h5hp1_gg_{visibility:hidden}.___SOutline_h5hp1_gg_{top:-1px;left:-1px;width:100%;border-radius:var(--intergalactic-control-rounded, 6px) var(--intergalactic-control-rounded, 6px)0 0;box-sizing:content-box}" /*__inner_css_end__*/, "h5hp1_gg_") /*__reshadow_css_end__*/, {
-  "__SInputSearch": "___SInputSearch_h5hp1_gg_",
-  "_size_m": "_size_m_h5hp1_gg_",
-  "__SSearchClear": "___SSearchClear_h5hp1_gg_",
-  "_hide": "__hide_h5hp1_gg_",
-  "__SOutline": "___SOutline_h5hp1_gg_"
+var style = ( /*__reshadow_css_start__*/_index.sstyled.insert( /*__inner_css_start__*/".___SInputSearch_1180s_gg_._size_m_1180s_gg_{height:32px}.___SSearchClear_1180s_gg_{padding:0 var(--intergalactic-spacing-2x, 8px)}.___SSearchClear_1180s_gg_.__hide_1180s_gg_{visibility:hidden}.___SOutline_1180s_gg_{top:-1px;left:-1px;width:100%;border-radius:var(--intergalactic-control-rounded, 6px) var(--intergalactic-control-rounded, 6px)0 0;box-sizing:content-box}" /*__inner_css_end__*/, "1180s_gg_") /*__reshadow_css_end__*/, {
+  "__SInputSearch": "___SInputSearch_1180s_gg_",
+  "_size_m": "_size_m_1180s_gg_",
+  "__SSearchClear": "___SSearchClear_1180s_gg_",
+  "_hide": "__hide_1180s_gg_",
+  "__SOutline": "___SOutline_1180s_gg_"
 });
 var InputSearchRoot = /*#__PURE__*/function (_Component) {
   (0, _inherits2["default"])(InputSearchRoot, _Component);

package/select/lib/cjs/Select.js

@@ -38,14 +38,14 @@ var _popper = require("intergalactic/popper");
 var _assignProps6 = require("intergalactic/utils/lib/assignProps");
 var _excluded = ["Children", "options", "multiselect", "value", "uid", "forcedAdvancedMode"];
 /*__reshadow-styles__:"./style/select.shadow.css"*/
-var style = ( /*__reshadow_css_start__*/_index.sstyled.insert( /*__inner_css_start__*/".___SOptionCheckbox_1fimv_gg_{margin-top:var(--intergalactic-spacing-05x, 2px);margin-right:var(--intergalactic-spacing-2x, 8px);margin-bottom:auto;position:relative;flex-shrink:0;width:16px;height:16px}.___SOptionCheckbox_1fimv_gg_::before{content:\"\";position:absolute;top:0;left:0;right:0;bottom:0;background:var(--intergalactic-bg-primary-neutral, #ffffff);border:1px solid;border-radius:var(--intergalactic-addon-rounded, 4px);border-color:var(--intergalactic-border-primary, #c4c7cf)}.___SOptionCheckbox_1fimv_gg_::after{content:\"\";position:absolute;top:0;left:0;right:0;bottom:0;margin:0 var(--intergalactic-spacing-05x, 2px);background-repeat:no-repeat;background-position:center center}.___SOptionCheckbox_1fimv_gg_.__selected_1fimv_gg_::after{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iNyIgdmlld0JveD0iMCAwIDEwIDciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik04LjI1IDFMNCA1LjI1TDEuNzUgMyIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==)}.___SOptionCheckbox_1fimv_gg_._size_l_1fimv_gg_{width:20px;height:20px}.___SOptionCheckbox_1fimv_gg_._size_l_1fimv_gg_.__selected_1fimv_gg_::after{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iOSIgdmlld0JveD0iMCAwIDEyIDkiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik0xMSAxLjVMNC43NSA3Ljc1TDEgNCIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==)}.___SOptionCheckbox_1fimv_gg_.__indeterminate_1fimv_gg_:before,.___SOptionCheckbox_1fimv_gg_.__selected_1fimv_gg_:before{background-color:var(--intergalactic-control-primary-info, #008ff8);border-color:var(--intergalactic-control-primary-info, #008ff8)}.___SOptionCheckbox_1fimv_gg_.__theme_1fimv_gg_:before{border-color:var(--theme_1fimv)}.___SOptionCheckbox_1fimv_gg_.__theme_1fimv_gg_.__indeterminate_1fimv_gg_:before,.___SOptionCheckbox_1fimv_gg_.__theme_1fimv_gg_.__selected_1fimv_gg_:before{background-color:var(--theme_1fimv);border-color:var(--theme_1fimv)}.___SOptionCheckbox_1fimv_gg_.__selected_1fimv_gg_{background-color:var(--intergalactic-dropdown-menu-item-selected, rgba(196, 229, 254, 0.7))}@media (hover:hover){.___SOptionCheckbox_1fimv_gg_.__selected_1fimv_gg_:hover{background-color:var(--intergalactic-dropdown-menu-item-selected-hover, #c4e5fe)}}.___SOptionCheckbox_1fimv_gg_.__indeterminate_1fimv_gg_:after{background-color:#fff;background-image:none;margin:auto;border-radius:1px}.___SOptionCheckbox_1fimv_gg_.__indeterminate_1fimv_gg_._size_l_1fimv_gg_:after{width:12px;height:2px}.___SOptionCheckbox_1fimv_gg_.__indeterminate_1fimv_gg_._size_m_1fimv_gg_:after{width:8px;height:2px}" /*__inner_css_end__*/, "1fimv_gg_") /*__reshadow_css_end__*/, {
-  "__SOptionCheckbox": "___SOptionCheckbox_1fimv_gg_",
-  "_selected": "__selected_1fimv_gg_",
-  "_size_l": "_size_l_1fimv_gg_",
-  "_indeterminate": "__indeterminate_1fimv_gg_",
-  "_theme": "__theme_1fimv_gg_",
-  "--theme": "--theme_1fimv",
-  "_size_m": "_size_m_1fimv_gg_"
+var style = ( /*__reshadow_css_start__*/_index.sstyled.insert( /*__inner_css_start__*/".___SOptionCheckbox_1v5md_gg_{margin-top:var(--intergalactic-spacing-05x, 2px);margin-right:var(--intergalactic-spacing-2x, 8px);margin-bottom:auto;position:relative;flex-shrink:0;width:16px;height:16px}.___SOptionCheckbox_1v5md_gg_::before{content:\"\";position:absolute;top:0;left:0;right:0;bottom:0;background:var(--intergalactic-bg-primary-neutral, #ffffff);border:1px solid;border-radius:var(--intergalactic-addon-rounded, 4px);border-color:var(--intergalactic-border-primary, #c4c7cf)}.___SOptionCheckbox_1v5md_gg_::after{content:\"\";position:absolute;top:0;left:0;right:0;bottom:0;margin:0 var(--intergalactic-spacing-05x, 2px);background-repeat:no-repeat;background-position:center center}.___SOptionCheckbox_1v5md_gg_.__selected_1v5md_gg_::after{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iNyIgdmlld0JveD0iMCAwIDEwIDciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik04LjI1IDFMNCA1LjI1TDEuNzUgMyIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==)}.___SOptionCheckbox_1v5md_gg_._size_l_1v5md_gg_{width:20px;height:20px}.___SOptionCheckbox_1v5md_gg_._size_l_1v5md_gg_.__selected_1v5md_gg_::after{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTIiIGhlaWdodD0iOSIgdmlld0JveD0iMCAwIDEyIDkiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik0xMSAxLjVMNC43NSA3Ljc1TDEgNCIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==)}.___SOptionCheckbox_1v5md_gg_.__indeterminate_1v5md_gg_:before,.___SOptionCheckbox_1v5md_gg_.__selected_1v5md_gg_:before{background-color:var(--intergalactic-control-primary-info, #008ff8);border-color:var(--intergalactic-control-primary-info, #008ff8)}.___SOptionCheckbox_1v5md_gg_.__theme_1v5md_gg_:before{border-color:var(--theme_1v5md)}.___SOptionCheckbox_1v5md_gg_.__theme_1v5md_gg_.__indeterminate_1v5md_gg_:before,.___SOptionCheckbox_1v5md_gg_.__theme_1v5md_gg_.__selected_1v5md_gg_:before{background-color:var(--theme_1v5md);border-color:var(--theme_1v5md)}.___SOptionCheckbox_1v5md_gg_.__selected_1v5md_gg_{background-color:var(--intergalactic-dropdown-menu-item-selected, rgba(196, 229, 254, 0.7))}@media (hover:hover){.___SOptionCheckbox_1v5md_gg_.__selected_1v5md_gg_:hover{background-color:var(--intergalactic-dropdown-menu-item-selected-hover, #c4e5fe)}}.___SOptionCheckbox_1v5md_gg_.__indeterminate_1v5md_gg_:after{background-color:#fff;background-image:none;margin:auto;border-radius:1px}.___SOptionCheckbox_1v5md_gg_.__indeterminate_1v5md_gg_._size_l_1v5md_gg_:after{width:12px;height:2px}.___SOptionCheckbox_1v5md_gg_.__indeterminate_1v5md_gg_._size_m_1v5md_gg_:after{width:8px;height:2px}" /*__inner_css_end__*/, "1v5md_gg_") /*__reshadow_css_end__*/, {
+  "__SOptionCheckbox": "___SOptionCheckbox_1v5md_gg_",
+  "_selected": "__selected_1v5md_gg_",
+  "_size_l": "_size_l_1v5md_gg_",
+  "_indeterminate": "__indeterminate_1v5md_gg_",
+  "_theme": "__theme_1v5md_gg_",
+  "--theme": "--theme_1v5md",
+  "_size_m": "_size_m_1v5md_gg_"
 });
 function isSelectedOption(value, valueOption) {
   return Array.isArray(value) ? value.includes(valueOption) : valueOption === value;
@@ -115,7 +115,7 @@ var RootSelect = /*#__PURE__*/function (_AbstractDropdown) {
         visible: [null, function (visible) {
           if (visible === true) {
             var hasInputSearch = (0, _findComponent.isAdvanceMode)(_this2.asProps.Children, [Select.InputSearch.displayName], true);
-            var defaultIndex = hasInputSearch ? null : 0;
+            var defaultIndex = hasInputSearch ? null : _this2.props.defaultHighlightedIndex;
             _this2.handlers.highlightedIndex(defaultIndex);
             setTimeout(function () {
               var _this2$menuRef$curren, _this2$menuRef$curren2;