@semcore/scroll-area - npm Package Compare versions

Comparing version 3.7.1 to 4.0.0

CHANGELOG.md

@@ -5,2 +5,9 @@ # Changelog
 
+## [4.0.0] - 2022-05-17
+
+### BREAK
+
+- Remove named imports.
+- Updated styles according to the library redesign policy.
+
 ## [3.7.1] - 2022-04-25
@@ -7,0 +14,0 @@

lib/cjs/index.d.ts

@@ -43,3 +43,3 @@ import 'resize-observer-polyfill';
 
-declare const ScrollAreaComponent: (<T>(
+declare const ScrollArea: (<T>(
   props: CProps<IScrollAreaProps & T, IScrollAreaContext>,
@@ -54,2 +54,2 @@ ) => ReturnEl) & {
 export { eventCalculate };
-export default ScrollAreaComponent;
+export default ScrollArea;

lib/cjs/ScrollArea.js

@@ -10,3 +10,3 @@ "use strict";
 });
-exports.eventCalculate = exports["default"] = exports.ScrollContainer = exports.ScrollBar = exports.ScrollArea = void 0;
+exports.eventCalculate = exports["default"] = exports.ScrollArea = void 0;
 
@@ -47,4 +47,2 @@ var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 
-var _logger = _interopRequireDefault(require("@semcore/utils/lib/logger"));
-
 var _assignProps3 = require("@semcore/utils/lib/assignProps");
@@ -73,14 +71,14 @@
 /*__inner_css_start__*/
-".___SScrollArea_en3r1_gg_{position:relative;width:100%;height:100%}.___SShadowHorizontal_en3r1_gg_:after,.___SShadowHorizontal_en3r1_gg_:before,.___SShadowVertical_en3r1_gg_:after,.___SShadowVertical_en3r1_gg_:before{content:\"\";position:absolute;display:none;pointer-events:none;z-index:1}.___SShadowHorizontal_en3r1_gg_:after,.___SShadowHorizontal_en3r1_gg_:before{top:0;display:block;width:5px;height:100%}.___SShadowHorizontal_en3r1_gg_._position_median_en3r1_gg_:before{left:0;background:linear-gradient(270deg,transparent 0,rgba(0,0,0,.1))}.___SShadowHorizontal_en3r1_gg_._position_median_en3r1_gg_:after{right:0;background:linear-gradient(90deg,transparent 0,rgba(0,0,0,.1))}.___SShadowHorizontal_en3r1_gg_._position_start_en3r1_gg_:before{left:0;background:linear-gradient(270deg,transparent 0,rgba(0,0,0,.1))}.___SShadowHorizontal_en3r1_gg_._position_end_en3r1_gg_:after{right:0;background:linear-gradient(90deg,transparent 0,rgba(0,0,0,.1))}.___SShadowVertical_en3r1_gg_:after,.___SShadowVertical_en3r1_gg_:before{left:0;display:block;width:100%;height:5px}.___SShadowVertical_en3r1_gg_._position_median_en3r1_gg_:before{top:0;background:linear-gradient(0deg,transparent 0,rgba(0,0,0,.1))}.___SShadowVertical_en3r1_gg_._position_median_en3r1_gg_:after{bottom:0;background:linear-gradient(180deg,transparent 0,rgba(0,0,0,.1))}.___SShadowVertical_en3r1_gg_._position_start_en3r1_gg_:before{top:0;background:linear-gradient(0deg,transparent 0,rgba(0,0,0,.1))}.___SShadowVertical_en3r1_gg_._position_end_en3r1_gg_:after{bottom:0;background:linear-gradient(180deg,transparent 0,rgba(0,0,0,.1))}.___SContainer_en3r1_gg_{display:block;width:100%;height:100%;box-sizing:content-box;overflow:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none}.___SContainer_en3r1_gg_::-webkit-scrollbar{display:none}"
+".___SScrollArea_6papi_gg_{position:relative;width:100%;height:100%}.___SShadowHorizontal_6papi_gg_:after,.___SShadowHorizontal_6papi_gg_:before,.___SShadowVertical_6papi_gg_:after,.___SShadowVertical_6papi_gg_:before{content:\"\";position:absolute;display:none;pointer-events:none;z-index:1}.___SShadowHorizontal_6papi_gg_:after,.___SShadowHorizontal_6papi_gg_:before{top:0;display:block;width:5px;height:100%}.___SShadowHorizontal_6papi_gg_._position_median_6papi_gg_:before{left:0;background:linear-gradient(90deg,rgba(25,27,35,.1) 20.55%,hsla(0,0%,100%,.0001))}.___SShadowHorizontal_6papi_gg_._position_median_6papi_gg_:after{right:0;background:linear-gradient(270deg,rgba(25,27,35,.1) 20.55%,hsla(0,0%,100%,.0001))}.___SShadowHorizontal_6papi_gg_._position_start_6papi_gg_:before{left:0;background:linear-gradient(90deg,rgba(25,27,35,.1) 20.55%,hsla(0,0%,100%,.0001))}.___SShadowHorizontal_6papi_gg_._position_end_6papi_gg_:after{right:0;background:linear-gradient(270deg,rgba(25,27,35,.1) 20.55%,hsla(0,0%,100%,.0001))}.___SShadowVertical_6papi_gg_:after,.___SShadowVertical_6papi_gg_:before{left:0;display:block;width:100%;height:5px}.___SShadowVertical_6papi_gg_._position_median_6papi_gg_:before{top:0;background:linear-gradient(180deg,rgba(25,27,35,.1) 20.55%,hsla(0,0%,100%,.0001))}.___SShadowVertical_6papi_gg_._position_median_6papi_gg_:after{bottom:0;background:linear-gradient(0deg,rgba(25,27,35,.1) 20.55%,hsla(0,0%,100%,.0001))}.___SShadowVertical_6papi_gg_._position_start_6papi_gg_:before{top:0;background:linear-gradient(180deg,rgba(25,27,35,.1) 20.55%,hsla(0,0%,100%,.0001))}.___SShadowVertical_6papi_gg_._position_end_6papi_gg_:after{bottom:0;background:linear-gradient(0deg,rgba(25,27,35,.1) 20.55%,hsla(0,0%,100%,.0001))}.___SContainer_6papi_gg_{display:block;width:100%;height:100%;box-sizing:content-box;overflow:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none}.___SContainer_6papi_gg_::-webkit-scrollbar{display:none}"
 /*__inner_css_end__*/
-, "1l5f7z5_gg_")
+, "9ieom9_gg_")
 /*__reshadow_css_end__*/
 , {
-  "__SScrollArea": "___SScrollArea_en3r1_gg_",
-  "__SShadowHorizontal": "___SShadowHorizontal_en3r1_gg_",
-  "__SShadowVertical": "___SShadowVertical_en3r1_gg_",
-  "_position_median": "_position_median_en3r1_gg_",
-  "_position_start": "_position_start_en3r1_gg_",
-  "_position_end": "_position_end_en3r1_gg_",
-  "__SContainer": "___SContainer_en3r1_gg_"
+  "__SScrollArea": "___SScrollArea_6papi_gg_",
+  "__SShadowHorizontal": "___SShadowHorizontal_6papi_gg_",
+  "__SShadowVertical": "___SShadowVertical_6papi_gg_",
+  "_position_median": "_position_median_6papi_gg_",
+  "_position_start": "_position_start_6papi_gg_",
+  "_position_end": "_position_end_6papi_gg_",
+  "__SContainer": "___SContainer_6papi_gg_"
 });
@@ -284,3 +282,3 @@ var eventCalculate = undefined;
           shadowHorizontal = _this$state.shadowHorizontal;
-      var advanceMode = (0, _findComponent.isAdvanceMode)(Children, [ScrollAreaComponent.Container.displayName, ScrollAreaComponent.Bar.displayName]);
+      var advanceMode = (0, _findComponent.isAdvanceMode)(Children, [ScrollArea.Container.displayName, ScrollArea.Bar.displayName]);
       return _ref3 = (0, _core.sstyled)(styles), /*#__PURE__*/_react["default"].createElement(SScrollArea, _ref3.cn("SScrollArea", _objectSpread({}, (0, _core.assignProps)({
@@ -293,5 +291,5 @@ "ref": this.refWrapper,
         "position": shadowHorizontal
-      })), advanceMode ? /*#__PURE__*/_react["default"].createElement(Children, _ref3.cn("Children", {})) : /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(ScrollAreaComponent.Container, null, /*#__PURE__*/_react["default"].createElement(Children, _ref3.cn("Children", {}))), (orientation === undefined || orientation === 'horizontal') && /*#__PURE__*/_react["default"].createElement(ScrollAreaComponent.Bar, {
+      })), advanceMode ? /*#__PURE__*/_react["default"].createElement(Children, _ref3.cn("Children", {})) : /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(ScrollArea.Container, null, /*#__PURE__*/_react["default"].createElement(Children, _ref3.cn("Children", {}))), (orientation === undefined || orientation === 'horizontal') && /*#__PURE__*/_react["default"].createElement(ScrollArea.Bar, {
         orientation: "horizontal"
-      }), (orientation === undefined || orientation === 'vertical') && /*#__PURE__*/_react["default"].createElement(ScrollAreaComponent.Bar, {
+      }), (orientation === undefined || orientation === 'vertical') && /*#__PURE__*/_react["default"].createElement(ScrollArea.Bar, {
         orientation: "vertical"
@@ -326,41 +324,9 @@ })));
 
-var ScrollAreaComponent = (0, _core["default"])(ScrollAreaRoot, {
+var ScrollArea = (0, _core["default"])(ScrollAreaRoot, {
   Container: ContainerRoot,
   Bar: _ScrollBar["default"]
 });
-var _default = ScrollAreaComponent;
+exports.ScrollArea = ScrollArea;
+var _default = ScrollArea;
 exports["default"] = _default;
-
-var ScrollContainer = _react["default"].forwardRef(function (props, ref) {
-  _logger["default"].warn(true, "The named import 'import { ScrollContainer }' is deprecated, use the static method from the default 'import ScrollArea', '<ScrollArea.Container/>'", props['data-ui-name'] || ScrollAreaComponent.Container.displayName);
-
-  return /*#__PURE__*/_react["default"].createElement(ScrollAreaComponent.Container, (0, _extends2["default"])({
-    ref: ref
-  }, props));
-});
-
-exports.ScrollContainer = ScrollContainer;
-ScrollContainer.displayName = ScrollAreaComponent.Container.displayName;
-
-var ScrollBar = _react["default"].forwardRef(function (props, ref) {
-  _logger["default"].warn(true, "The named import 'import { ScrollBar }' is deprecated, use the static method from the default 'import ScrollArea', '<ScrollArea.Bar/>'", props['data-ui-name'] || ScrollAreaComponent.Bar.displayName);
-
-  return /*#__PURE__*/_react["default"].createElement(ScrollAreaComponent.Bar, (0, _extends2["default"])({
-    ref: ref
-  }, props));
-});
-
-exports.ScrollBar = ScrollBar;
-ScrollBar.displayName = ScrollAreaComponent.Bar.displayName;
-
-var ScrollArea = _react["default"].forwardRef(function (props, ref) {
-  _logger["default"].warn(true, "The named import 'import { ScrollArea }' is deprecated, use the default 'import ScrollArea'", props['data-ui-name'] || ScrollAreaComponent.displayName);
-
-  return /*#__PURE__*/_react["default"].createElement(ScrollAreaComponent, (0, _extends2["default"])({
-    ref: ref
-  }, props));
-});
-
-exports.ScrollArea = ScrollArea;
-ScrollArea.displayName = ScrollAreaComponent.displayName;
 //# sourceMappingURL=ScrollArea.js.map

lib/cjs/ScrollBar.js

@@ -55,11 +55,11 @@ "use strict";
 /*__inner_css_start__*/
-".___SScrollBar_1ttjd_gg_{position:absolute;display:flex}.___SScrollBar_1ttjd_gg_._orientation_vertical_1ttjd_gg_{top:4px;right:0;width:8px;height:calc(100% - 8px);justify-content:center}.___SScrollBar_1ttjd_gg_._orientation_horizontal_1ttjd_gg_{bottom:0;left:4px;height:12px;width:calc(100% - 8px);align-items:center}.___SSlider_1ttjd_gg_{cursor:pointer;width:6px;height:6px;border-radius:2px;background-color:rgba(0,0,0,.2)}"
+".___SScrollBar_1fjlv_gg_{position:absolute;display:flex}.___SScrollBar_1fjlv_gg_._orientation_vertical_1fjlv_gg_{top:4px;right:0;width:8px;height:calc(100% - 8px);justify-content:center}.___SScrollBar_1fjlv_gg_._orientation_horizontal_1fjlv_gg_{bottom:0;left:4px;height:12px;width:calc(100% - 8px);align-items:center}.___SSlider_1fjlv_gg_{cursor:pointer;width:6px;height:6px;border-radius:3px;background-color:rgba(0,0,0,.3)}"
 /*__inner_css_end__*/
-, "1qednr7_gg_")
+, "1o9m465_gg_")
 /*__reshadow_css_end__*/
 , {
-  "__SScrollBar": "___SScrollBar_1ttjd_gg_",
-  "_orientation_vertical": "_orientation_vertical_1ttjd_gg_",
-  "_orientation_horizontal": "_orientation_horizontal_1ttjd_gg_",
-  "__SSlider": "___SSlider_1ttjd_gg_"
+  "__SScrollBar": "___SScrollBar_1fjlv_gg_",
+  "_orientation_vertical": "_orientation_vertical_1fjlv_gg_",
+  "_orientation_horizontal": "_orientation_horizontal_1fjlv_gg_",
+  "__SSlider": "___SSlider_1fjlv_gg_"
 });
@@ -66,0 +66,0 @@ var DEFAULT_SLIDER_SIZE = 50;

lib/es6/index.d.ts

@@ -43,3 +43,3 @@ import 'resize-observer-polyfill';
 
-declare const ScrollAreaComponent: (<T>(
+declare const ScrollArea: (<T>(
   props: CProps<IScrollAreaProps & T, IScrollAreaContext>,
@@ -54,2 +54,2 @@ ) => ReturnEl) & {
 export { eventCalculate };
-export default ScrollAreaComponent;
+export default ScrollArea;

lib/es6/ScrollArea.js

@@ -31,3 +31,2 @@ import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
 import { isAdvanceMode } from '@semcore/utils/lib/findComponent';
-import logger from '@semcore/utils/lib/logger';
 import { callAllEventHandlers } from '@semcore/utils/lib/assignProps';
@@ -41,14 +40,14 @@ import BarRoot from './ScrollBar';
 /*__inner_css_start__*/
-".___SScrollArea_en3r1_gg_{position:relative;width:100%;height:100%}.___SShadowHorizontal_en3r1_gg_:after,.___SShadowHorizontal_en3r1_gg_:before,.___SShadowVertical_en3r1_gg_:after,.___SShadowVertical_en3r1_gg_:before{content:\"\";position:absolute;display:none;pointer-events:none;z-index:1}.___SShadowHorizontal_en3r1_gg_:after,.___SShadowHorizontal_en3r1_gg_:before{top:0;display:block;width:5px;height:100%}.___SShadowHorizontal_en3r1_gg_._position_median_en3r1_gg_:before{left:0;background:linear-gradient(270deg,transparent 0,rgba(0,0,0,.1))}.___SShadowHorizontal_en3r1_gg_._position_median_en3r1_gg_:after{right:0;background:linear-gradient(90deg,transparent 0,rgba(0,0,0,.1))}.___SShadowHorizontal_en3r1_gg_._position_start_en3r1_gg_:before{left:0;background:linear-gradient(270deg,transparent 0,rgba(0,0,0,.1))}.___SShadowHorizontal_en3r1_gg_._position_end_en3r1_gg_:after{right:0;background:linear-gradient(90deg,transparent 0,rgba(0,0,0,.1))}.___SShadowVertical_en3r1_gg_:after,.___SShadowVertical_en3r1_gg_:before{left:0;display:block;width:100%;height:5px}.___SShadowVertical_en3r1_gg_._position_median_en3r1_gg_:before{top:0;background:linear-gradient(0deg,transparent 0,rgba(0,0,0,.1))}.___SShadowVertical_en3r1_gg_._position_median_en3r1_gg_:after{bottom:0;background:linear-gradient(180deg,transparent 0,rgba(0,0,0,.1))}.___SShadowVertical_en3r1_gg_._position_start_en3r1_gg_:before{top:0;background:linear-gradient(0deg,transparent 0,rgba(0,0,0,.1))}.___SShadowVertical_en3r1_gg_._position_end_en3r1_gg_:after{bottom:0;background:linear-gradient(180deg,transparent 0,rgba(0,0,0,.1))}.___SContainer_en3r1_gg_{display:block;width:100%;height:100%;box-sizing:content-box;overflow:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none}.___SContainer_en3r1_gg_::-webkit-scrollbar{display:none}"
+".___SScrollArea_6papi_gg_{position:relative;width:100%;height:100%}.___SShadowHorizontal_6papi_gg_:after,.___SShadowHorizontal_6papi_gg_:before,.___SShadowVertical_6papi_gg_:after,.___SShadowVertical_6papi_gg_:before{content:\"\";position:absolute;display:none;pointer-events:none;z-index:1}.___SShadowHorizontal_6papi_gg_:after,.___SShadowHorizontal_6papi_gg_:before{top:0;display:block;width:5px;height:100%}.___SShadowHorizontal_6papi_gg_._position_median_6papi_gg_:before{left:0;background:linear-gradient(90deg,rgba(25,27,35,.1) 20.55%,hsla(0,0%,100%,.0001))}.___SShadowHorizontal_6papi_gg_._position_median_6papi_gg_:after{right:0;background:linear-gradient(270deg,rgba(25,27,35,.1) 20.55%,hsla(0,0%,100%,.0001))}.___SShadowHorizontal_6papi_gg_._position_start_6papi_gg_:before{left:0;background:linear-gradient(90deg,rgba(25,27,35,.1) 20.55%,hsla(0,0%,100%,.0001))}.___SShadowHorizontal_6papi_gg_._position_end_6papi_gg_:after{right:0;background:linear-gradient(270deg,rgba(25,27,35,.1) 20.55%,hsla(0,0%,100%,.0001))}.___SShadowVertical_6papi_gg_:after,.___SShadowVertical_6papi_gg_:before{left:0;display:block;width:100%;height:5px}.___SShadowVertical_6papi_gg_._position_median_6papi_gg_:before{top:0;background:linear-gradient(180deg,rgba(25,27,35,.1) 20.55%,hsla(0,0%,100%,.0001))}.___SShadowVertical_6papi_gg_._position_median_6papi_gg_:after{bottom:0;background:linear-gradient(0deg,rgba(25,27,35,.1) 20.55%,hsla(0,0%,100%,.0001))}.___SShadowVertical_6papi_gg_._position_start_6papi_gg_:before{top:0;background:linear-gradient(180deg,rgba(25,27,35,.1) 20.55%,hsla(0,0%,100%,.0001))}.___SShadowVertical_6papi_gg_._position_end_6papi_gg_:after{bottom:0;background:linear-gradient(0deg,rgba(25,27,35,.1) 20.55%,hsla(0,0%,100%,.0001))}.___SContainer_6papi_gg_{display:block;width:100%;height:100%;box-sizing:content-box;overflow:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none}.___SContainer_6papi_gg_::-webkit-scrollbar{display:none}"
 /*__inner_css_end__*/
-, "1l5f7z5_gg_")
+, "9ieom9_gg_")
 /*__reshadow_css_end__*/
 , {
-  "__SScrollArea": "___SScrollArea_en3r1_gg_",
-  "__SShadowHorizontal": "___SShadowHorizontal_en3r1_gg_",
-  "__SShadowVertical": "___SShadowVertical_en3r1_gg_",
-  "_position_median": "_position_median_en3r1_gg_",
-  "_position_start": "_position_start_en3r1_gg_",
-  "_position_end": "_position_end_en3r1_gg_",
-  "__SContainer": "___SContainer_en3r1_gg_"
+  "__SScrollArea": "___SScrollArea_6papi_gg_",
+  "__SShadowHorizontal": "___SShadowHorizontal_6papi_gg_",
+  "__SShadowVertical": "___SShadowVertical_6papi_gg_",
+  "_position_median": "_position_median_6papi_gg_",
+  "_position_start": "_position_start_6papi_gg_",
+  "_position_end": "_position_end_6papi_gg_",
+  "__SContainer": "___SContainer_6papi_gg_"
 });
@@ -264,3 +263,3 @@ var eventCalculate = undefined;
           shadowHorizontal = _this$state.shadowHorizontal;
-      var advanceMode = isAdvanceMode(Children, [ScrollAreaComponent.Container.displayName, ScrollAreaComponent.Bar.displayName]);
+      var advanceMode = isAdvanceMode(Children, [ScrollArea.Container.displayName, ScrollArea.Bar.displayName]);
       return _ref3 = sstyled(styles), /*#__PURE__*/React.createElement(SScrollArea, _ref3.cn("SScrollArea", _objectSpread({}, _assignProps({
@@ -273,5 +272,5 @@ "ref": this.refWrapper,
         "position": shadowHorizontal
-      })), advanceMode ? /*#__PURE__*/React.createElement(Children, _ref3.cn("Children", {})) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ScrollAreaComponent.Container, null, /*#__PURE__*/React.createElement(Children, _ref3.cn("Children", {}))), (orientation === undefined || orientation === 'horizontal') && /*#__PURE__*/React.createElement(ScrollAreaComponent.Bar, {
+      })), advanceMode ? /*#__PURE__*/React.createElement(Children, _ref3.cn("Children", {})) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ScrollArea.Container, null, /*#__PURE__*/React.createElement(Children, _ref3.cn("Children", {}))), (orientation === undefined || orientation === 'horizontal') && /*#__PURE__*/React.createElement(ScrollArea.Bar, {
         orientation: "horizontal"
-      }), (orientation === undefined || orientation === 'vertical') && /*#__PURE__*/React.createElement(ScrollAreaComponent.Bar, {
+      }), (orientation === undefined || orientation === 'vertical') && /*#__PURE__*/React.createElement(ScrollArea.Bar, {
         orientation: "vertical"
@@ -309,29 +308,7 @@ })));
 
-var ScrollAreaComponent = createComponent(ScrollAreaRoot, {
+export var ScrollArea = createComponent(ScrollAreaRoot, {
   Container: ContainerRoot,
   Bar: BarRoot
 });
-export default ScrollAreaComponent;
-var ScrollContainer = React.forwardRef(function (props, ref) {
-  logger.warn(true, "The named import 'import { ScrollContainer }' is deprecated, use the static method from the default 'import ScrollArea', '<ScrollArea.Container/>'", props['data-ui-name'] || ScrollAreaComponent.Container.displayName);
-  return /*#__PURE__*/React.createElement(ScrollAreaComponent.Container, _extends({
-    ref: ref
-  }, props));
-});
-ScrollContainer.displayName = ScrollAreaComponent.Container.displayName;
-var ScrollBar = React.forwardRef(function (props, ref) {
-  logger.warn(true, "The named import 'import { ScrollBar }' is deprecated, use the static method from the default 'import ScrollArea', '<ScrollArea.Bar/>'", props['data-ui-name'] || ScrollAreaComponent.Bar.displayName);
-  return /*#__PURE__*/React.createElement(ScrollAreaComponent.Bar, _extends({
-    ref: ref
-  }, props));
-});
-ScrollBar.displayName = ScrollAreaComponent.Bar.displayName;
-var ScrollArea = React.forwardRef(function (props, ref) {
-  logger.warn(true, "The named import 'import { ScrollArea }' is deprecated, use the default 'import ScrollArea'", props['data-ui-name'] || ScrollAreaComponent.displayName);
-  return /*#__PURE__*/React.createElement(ScrollAreaComponent, _extends({
-    ref: ref
-  }, props));
-});
-ScrollArea.displayName = ScrollAreaComponent.displayName;
-export { ScrollArea, ScrollBar, ScrollContainer };
+export default ScrollArea;
 //# sourceMappingURL=ScrollArea.js.map

lib/es6/ScrollBar.js

@@ -32,11 +32,11 @@ import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 /*__inner_css_start__*/
-".___SScrollBar_1ttjd_gg_{position:absolute;display:flex}.___SScrollBar_1ttjd_gg_._orientation_vertical_1ttjd_gg_{top:4px;right:0;width:8px;height:calc(100% - 8px);justify-content:center}.___SScrollBar_1ttjd_gg_._orientation_horizontal_1ttjd_gg_{bottom:0;left:4px;height:12px;width:calc(100% - 8px);align-items:center}.___SSlider_1ttjd_gg_{cursor:pointer;width:6px;height:6px;border-radius:2px;background-color:rgba(0,0,0,.2)}"
+".___SScrollBar_1fjlv_gg_{position:absolute;display:flex}.___SScrollBar_1fjlv_gg_._orientation_vertical_1fjlv_gg_{top:4px;right:0;width:8px;height:calc(100% - 8px);justify-content:center}.___SScrollBar_1fjlv_gg_._orientation_horizontal_1fjlv_gg_{bottom:0;left:4px;height:12px;width:calc(100% - 8px);align-items:center}.___SSlider_1fjlv_gg_{cursor:pointer;width:6px;height:6px;border-radius:3px;background-color:rgba(0,0,0,.3)}"
 /*__inner_css_end__*/
-, "1qednr7_gg_")
+, "1o9m465_gg_")
 /*__reshadow_css_end__*/
 , {
-  "__SScrollBar": "___SScrollBar_1ttjd_gg_",
-  "_orientation_vertical": "_orientation_vertical_1ttjd_gg_",
-  "_orientation_horizontal": "_orientation_horizontal_1ttjd_gg_",
-  "__SSlider": "___SSlider_1ttjd_gg_"
+  "__SScrollBar": "___SScrollBar_1fjlv_gg_",
+  "_orientation_vertical": "_orientation_vertical_1fjlv_gg_",
+  "_orientation_horizontal": "_orientation_horizontal_1fjlv_gg_",
+  "__SSlider": "___SSlider_1fjlv_gg_"
 });
@@ -43,0 +43,0 @@ export var DEFAULT_SLIDER_SIZE = 50;

lib/types/index.d.ts

@@ -43,3 +43,3 @@ import 'resize-observer-polyfill';
 
-declare const ScrollAreaComponent: (<T>(
+declare const ScrollArea: (<T>(
   props: CProps<IScrollAreaProps & T, IScrollAreaContext>,
@@ -54,2 +54,2 @@ ) => ReturnEl) & {
 export { eventCalculate };
-export default ScrollAreaComponent;
+export default ScrollArea;

package.json

 {
   "name": "@semcore/scroll-area",
   "description": "SEMRush ScrollArea Component",
-  "version": "3.7.1",
+  "version": "4.0.0",
   "main": "lib/cjs/index.js",
@@ -6,0 +6,0 @@ "module": "lib/es6/index.js",

src/index.d.ts

@@ -43,3 +43,3 @@ import 'resize-observer-polyfill';
 
-declare const ScrollAreaComponent: (<T>(
+declare const ScrollArea: (<T>(
   props: CProps<IScrollAreaProps & T, IScrollAreaContext>,
@@ -54,2 +54,2 @@ ) => ReturnEl) & {
 export { eventCalculate };
-export default ScrollAreaComponent;
+export default ScrollArea;

src/ScrollArea.jsx

@@ -10,3 +10,2 @@ import React from 'react';
 import { isAdvanceMode } from '@semcore/utils/lib/findComponent';
-import logger from '@semcore/utils/lib/logger';
 import { callAllEventHandlers } from '@semcore/utils/lib/assignProps';
@@ -185,4 +184,4 @@ import BarRoot from './ScrollBar';
     const advanceMode = isAdvanceMode(Children, [
-      ScrollAreaComponent.Container.displayName,
-      ScrollAreaComponent.Bar.displayName,
+      ScrollArea.Container.displayName,
+      ScrollArea.Bar.displayName,
     ]);
@@ -198,10 +197,10 @@
           <>
-            <ScrollAreaComponent.Container>
+            <ScrollArea.Container>
               <Children />
-            </ScrollAreaComponent.Container>
+            </ScrollArea.Container>
             {(orientation === undefined || orientation === 'horizontal') && (
-              <ScrollAreaComponent.Bar orientation="horizontal" />
+              <ScrollArea.Bar orientation="horizontal" />
             )}
             {(orientation === undefined || orientation === 'vertical') && (
-              <ScrollAreaComponent.Bar orientation="vertical" />
+              <ScrollArea.Bar orientation="vertical" />
             )}
@@ -227,3 +226,3 @@ </>
 
-const ScrollAreaComponent = createComponent(ScrollAreaRoot, {
+export const ScrollArea = createComponent(ScrollAreaRoot, {
   Container: ContainerRoot,
@@ -233,34 +232,2 @@ Bar: BarRoot,
 
-export default ScrollAreaComponent;
-
-const ScrollContainer = React.forwardRef(function (props, ref) {
-  logger.warn(
-    true,
-    "The named import 'import { ScrollContainer }' is deprecated, use the static method from the default 'import ScrollArea', '<ScrollArea.Container/>'",
-    props['data-ui-name'] || ScrollAreaComponent.Container.displayName,
-  );
-  return <ScrollAreaComponent.Container ref={ref} {...props} />;
-});
-ScrollContainer.displayName = ScrollAreaComponent.Container.displayName;
-
-const ScrollBar = React.forwardRef(function (props, ref) {
-  logger.warn(
-    true,
-    "The named import 'import { ScrollBar }' is deprecated, use the static method from the default 'import ScrollArea', '<ScrollArea.Bar/>'",
-    props['data-ui-name'] || ScrollAreaComponent.Bar.displayName,
-  );
-  return <ScrollAreaComponent.Bar ref={ref} {...props} />;
-});
-ScrollBar.displayName = ScrollAreaComponent.Bar.displayName;
-
-const ScrollArea = React.forwardRef(function (props, ref) {
-  logger.warn(
-    true,
-    "The named import 'import { ScrollArea }' is deprecated, use the default 'import ScrollArea'",
-    props['data-ui-name'] || ScrollAreaComponent.displayName,
-  );
-  return <ScrollAreaComponent ref={ref} {...props} />;
-});
-ScrollArea.displayName = ScrollAreaComponent.displayName;
-
-export { ScrollArea, ScrollBar, ScrollContainer };
+export default ScrollArea;

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Improved metrics

Lines of code

2377

increased by0.85%

Worsened metrics

Total package byte prevSize

171317

decreased by-4.72%

No dependency changes