@vtx/components 3.1.173 → 6.0.0-beta.2

package/lib/vtx-provider/useStyle/index.js

@@ -0,0 +1,112 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.setAlpha = exports.resetComponent = exports.proTheme = exports.operationUnit = exports.lighten = void 0;
+exports.useStyle = useStyle;
+var _cssinjs = require("@ant-design/cssinjs");
+var _tinycolor = require("@ctrl/tinycolor");
+var _antd = require("antd");
+var _react = require("react");
+var _index = require("../index");
+var _merge = require("../utils/merge");
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+/**
+ * 把一个颜色设置一下透明度
+ * @example (#fff, 0.5) => rgba(255, 255, 255, 0.5)
+ * @param baseColor {string}
+ * @param alpha {0-1}
+ * @returns rgba {string}
+ */
+var setAlpha = exports.setAlpha = function setAlpha(baseColor, alpha) {
+  return new _tinycolor.TinyColor(baseColor).setAlpha(alpha).toRgbString();
+};
+
+/**
+ * 把一个颜色修改一些明度
+ * @example (#000, 50) => #808080
+ * @param baseColor {string}
+ * @param brightness {0-100}
+ * @returns hexColor {string}
+ */
+var lighten = exports.lighten = function lighten(baseColor, brightness) {
+  var instance = new _tinycolor.TinyColor(baseColor);
+  return instance.lighten(brightness).toHexString();
+};
+var proTheme = exports.proTheme = _antd.theme;
+var resetComponent = exports.resetComponent = function resetComponent(token) {
+  return {
+    boxSizing: 'border-box',
+    margin: 0,
+    padding: 0,
+    color: token.colorText,
+    fontSize: token.fontSize,
+    lineHeight: token.lineHeight,
+    listStyle: 'none'
+  };
+};
+var operationUnit = exports.operationUnit = function operationUnit(token) {
+  return {
+    // FIXME: This use link but is a operation unit. Seems should be a colorPrimary.
+    // And Typography use this to generate link style which should not do this.
+    color: token.colorLink,
+    outline: 'none',
+    cursor: 'pointer',
+    transition: "color ".concat(token.motionDurationSlow),
+    '&:focus, &:hover': {
+      color: token.colorLinkHover
+    },
+    '&:active': {
+      color: token.colorLinkActive
+    }
+  };
+};
+
+/**
+ * 封装了一下 antd 的 useStyle
+ * @param componentName {string} 组件的名字
+ * @param styleFn {GenerateStyle} 生成样式的函数
+ * @returns UseStyleResult
+ */
+function useStyle(componentName, styleFn) {
+  var _token$proComponentsC;
+  // eslint-disable-next-line prefer-const
+  var _useContext = (0, _react.useContext)(_index.VtxProvider),
+    _useContext$token = _useContext.token,
+    token = _useContext$token === void 0 ? {} : _useContext$token,
+    hashed = _useContext.hashed;
+  var _antdTheme$useToken = _antd.theme.useToken(),
+    antdToken = _antdTheme$useToken.token,
+    hashId = _antdTheme$useToken.hashId,
+    theme = _antdTheme$useToken.theme;
+  var _useContext2 = (0, _react.useContext)(_antd.ConfigProvider.ConfigContext),
+    getPrefixCls = _useContext2.getPrefixCls,
+    csp = _useContext2.csp;
+
+  // 如果不在 VtxProvider 里面，就用 antd 的
+  if (!token.layout) {
+    token = _objectSpread({}, antdToken);
+  }
+  token.proComponentsCls = (_token$proComponentsC = token.proComponentsCls) !== null && _token$proComponentsC !== void 0 ? _token$proComponentsC : ".".concat(getPrefixCls('pro'));
+  token.antCls = ".".concat(getPrefixCls());
+  return {
+    wrapSSR: (0, _cssinjs.useStyleRegister)({
+      theme: theme,
+      token: token,
+      path: [componentName],
+      nonce: csp === null || csp === void 0 ? void 0 : csp.nonce,
+      layer: {
+        name: 'vtx-'
+      }
+    }, function () {
+      return styleFn(token);
+    }),
+    hashId: hashed ? hashId : ''
+  };
+}

package/lib/vtx-provider/utils/merge.js

@@ -0,0 +1,33 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.merge = void 0;
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+var merge = exports.merge = function merge() {
+  var obj = {};
+  for (var _len = arguments.length, rest = new Array(_len), _key = 0; _key < _len; _key++) {
+    rest[_key] = arguments[_key];
+  }
+  var il = rest.length;
+  var key;
+  var i = 0;
+  for (; i < il; i += 1) {
+    for (key in rest[i]) {
+      if (rest[i].hasOwnProperty(key)) {
+        if (_typeof(obj[key]) === 'object' && _typeof(rest[i][key]) === 'object' && obj[key] !== undefined && obj[key] !== null && !Array.isArray(obj[key]) && !Array.isArray(rest[i][key])) {
+          obj[key] = _objectSpread(_objectSpread({}, obj[key]), rest[i][key]);
+        } else {
+          obj[key] = rest[i][key];
+        }
+      }
+    }
+  }
+  return obj;
+};

package/lib/vtx-rps-frame/index.js

@@ -3,31 +3,36 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = void 0;
+exports.VtxRpsFrame = VtxRpsFrame;
+exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _axios = _interopRequireDefault(require("axios"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _getUrlParam = _interopRequireDefault(require("@vtx/utils/lib/getUrlParam"));
-var _getToken = _interopRequireDefault(require("../_util/getToken"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
+var _getToken = _interopRequireDefault(require("../utils/getToken"));
+var _classnames = _interopRequireDefault(require("classnames"));
+var _antd = require("antd");
+var _index = require("./style/index");
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
-function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
-function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); } /* eslint-disable camelcase */ /*
- * @Author: chenxinyu
- * @Date: 2021-03-24 21:47:52
- * @LastEditors: your name
- * @LastEditTime: 2022-01-12 18:49:30
- * @Description: 报表容器
- * @FilePath: \react-components\components\vtx-rps-frame\index.jsx
- */
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 var initReportParamUrl = '/cloud/management/rest/np/param/getByParamTypeCode';
 var initReportInfoUrl = '/cloud/rps/api/np/v101/report/getReportInfoByCode.smvc';
 var initReportServerUrl = '/ReportServer';
 function VtxRpsFrame(props) {
+  var _useContext = (0, _react.useContext)(_antd.ConfigProvider.ConfigContext),
+    getPrefixCls = _useContext.getPrefixCls;
+  var prefixCls = getPrefixCls('vtx-rps-frame', props.prefixCls);
+  var _useStyle = (0, _index.useStyle)(prefixCls),
+    wrapSSR = _useStyle.wrapSSR,
+    hashId = _useStyle.hashId;
   var iframeName = (0, _react.useRef)(Math.random() + new Date().getTime());
 
   // flag改变，重新渲染报表
@@ -49,8 +54,8 @@ function VtxRpsFrame(props) {
       reportServerUrl = _props$reportServerUr === void 0 ? initReportServerUrl : _props$reportServerUr;
     var paramCode = paramTypeCode || 'param_report_constant';
     // report_code 可配置，如果地址栏有report_code,则优先，否则根据props的report_code
-    var report_code = (0, _getUrlParam["default"])().report_code ? (0, _getUrlParam["default"])().report_code : props.report_code;
-    var access_token = (0, _getToken["default"])();
+    var report_code = (0, _getUrlParam.default)().report_code ? (0, _getUrlParam.default)().report_code : props.report_code;
+    var access_token = (0, _getToken.default)();
 
     // 获取公共参数
     function commonParam() {
@@ -60,7 +65,7 @@ function VtxRpsFrame(props) {
       if (access_token) {
         header['Authorization'] = "Bearer ".concat(access_token);
       }
-      return (0, _axios["default"])({
+      return (0, _axios.default)({
         method: 'get',
         url: "".concat(reportParamUrl),
         params: {
@@ -87,7 +92,7 @@ function VtxRpsFrame(props) {
       if (access_token) {
         header['Authorization'] = "Bearer ".concat(access_token);
       }
-      return (0, _axios["default"])({
+      return (0, _axios.default)({
         method: 'get',
         url: "".concat(reportInfoUrl),
         params: {
@@ -96,7 +101,7 @@ function VtxRpsFrame(props) {
         headers: header
       });
     }
-    _axios["default"].all([commonParam(), getReportInfoByCode()]).then(_axios["default"].spread(function (commonParamResult, reportInfoByCodeResult) {
+    _axios.default.all([commonParam(), getReportInfoByCode()]).then(_axios.default.spread(function (commonParamResult, reportInfoByCodeResult) {
       if (!commonParamResult.data.result && !reportInfoByCodeResult.data.result) {
         // 报表公共参数
         var commonParamData = commonParamResult.data.data;
@@ -115,32 +120,33 @@ function VtxRpsFrame(props) {
       }
     }))
     // eslint-disable-next-line no-console
-    ["catch"](function (err) {
+    .catch(function (err) {
       return console.log(err);
     });
   };
-  return /*#__PURE__*/_react["default"].createElement("div", {
-    className: "vtx-rps-frame"
-  }, /*#__PURE__*/_react["default"].createElement("iframe", {
-    className: "vtx-rps-frame-wrapper",
-    width: "100%",
-    height: "100%",
-    name: "".concat(iframeName.current)
+  return wrapSSR( /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+    className: (0, _classnames.default)("".concat(prefixCls), hashId),
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("iframe", {
+      className: (0, _classnames.default)("".concat(prefixCls, "-wrapper"), hashId),
+      width: "100%",
+      height: "100%",
+      name: "".concat(iframeName.current)
+    })
   }));
 }
 VtxRpsFrame.propTypes = {
-  flag: _propTypes["default"].number,
-  report_code: _propTypes["default"].string,
-  report_param: _propTypes["default"].object,
-  data_param: _propTypes["default"].oneOfType([_propTypes["default"].object, _propTypes["default"].array]),
-  paramTypeCode: _propTypes["default"].string,
-  tenantId: _propTypes["default"].string,
-  reportParamUrl: _propTypes["default"].string,
-  reportInfoUrl: _propTypes["default"].string,
-  reportServerUrl: _propTypes["default"].string,
-  isParamEncode: _propTypes["default"].bool
+  flag: _propTypes.default.number,
+  report_code: _propTypes.default.string,
+  report_param: _propTypes.default.object,
+  data_param: _propTypes.default.oneOfType([_propTypes.default.object, _propTypes.default.array]),
+  paramTypeCode: _propTypes.default.string,
+  tenantId: _propTypes.default.string,
+  reportParamUrl: _propTypes.default.string,
+  reportInfoUrl: _propTypes.default.string,
+  reportServerUrl: _propTypes.default.string,
+  isParamEncode: _propTypes.default.bool
 };
-var _default = exports["default"] = VtxRpsFrame;
+var _default = exports.default = VtxRpsFrame;
 var createForm = function createForm(reqURL, param, iframeName) {
   // 定义一个form表单
   var formDom = document.createElement('form');
@@ -164,5 +170,4 @@ var createForm = function createForm(reqURL, param, iframeName) {
   }
   formDom.submit(); // 表单提交
   formDom.remove();
-};
-//# sourceMappingURL=index.js.map
+};

package/lib/vtx-rps-frame/style/index.js

@@ -1,4 +1,32 @@
 "use strict";
 
-require("./index.less");
-//# sourceMappingURL=index.js.map
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useStyle = useStyle;
+var _vtxProvider = require("../../vtx-provider");
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+var genVtxRpsFrameStyle = function genVtxRpsFrameStyle(token) {
+  var componentCls = token.componentCls;
+  return _defineProperty({}, componentCls, {
+    width: '100%',
+    height: '100%',
+    overflow: 'hidden',
+    'iframe': {
+      borderWidth: 0
+    }
+  });
+};
+function useStyle(prefixCls) {
+  return (0, _vtxProvider.useStyle)('VtxRpsFrame', function (token) {
+    var vtxRpsFrameToken = _objectSpread(_objectSpread({}, token), {}, {
+      componentCls: ".".concat(prefixCls)
+    });
+    return [genVtxRpsFrameStyle(vtxRpsFrameToken)];
+  });
+}

package/lib/vtx-scrollable-row/index.js

@@ -4,26 +4,30 @@ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" ==
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports["default"] = void 0;
+exports.VtxScrollableRow = VtxScrollableRow;
+exports.default = void 0;
 exports.isTransformSupported = isTransformSupported;
 exports.setTransform = setTransform;
 var _react = _interopRequireWildcard(require("react"));
 var _classnames3 = _interopRequireDefault(require("classnames"));
-var _debounce = _interopRequireDefault(require("lodash/debounce"));
+var _debounce = _interopRequireDefault(require("lodash-es/debounce"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
-var _RightOutlined = _interopRequireDefault(require("@ant-design/icons/RightOutlined"));
-var _LeftOutlined = _interopRequireDefault(require("@ant-design/icons/LeftOutlined"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
-function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
-function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+var _icons = require("@ant-design/icons");
+var _index = require("./style/index");
+var _antd = require("antd");
+var _jsxRuntime = require("react/jsx-runtime");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
-function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
-function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
-function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 function isTransformSupported(style) {
   return 'transform' in style || 'webkitTransform' in style || 'MozTransform' in style;
 }
@@ -33,6 +37,12 @@ function setTransform(style, v) {
   style.mozTransform = v;
 }
 function VtxScrollableRow(props) {
+  var _useContext = (0, _react.useContext)(_antd.ConfigProvider.ConfigContext),
+    getPrefixCls = _useContext.getPrefixCls;
+  var prefixCls = getPrefixCls('vtx-scrollable-row', props.prefixCls);
+  var _useStyle = (0, _index.useStyle)(prefixCls),
+    wrapSSR = _useStyle.wrapSSR,
+    hashId = _useStyle.hashId;
   var _useState = (0, _react.useState)({
       next: false,
       prev: false
@@ -42,16 +52,14 @@ function VtxScrollableRow(props) {
     setState = _useState2[1];
   var next = state.next,
     prev = state.prev;
-  var _props$prefixCls = props.prefixCls,
-    prefixCls = _props$prefixCls === void 0 ? 'vtx-scrollable-row' : _props$prefixCls,
-    className = props.className,
+  var className = props.className,
     style = props.style;
   var offset = (0, _react.useRef)(0);
-  var containerRef = (0, _react.useRef)();
-  var navWrapRef = (0, _react.useRef)();
-  var navRef = (0, _react.useRef)();
+  var containerRef = (0, _react.useRef)(null);
+  var navWrapRef = (0, _react.useRef)(null);
+  var navRef = (0, _react.useRef)(null);
   (0, _react.useEffect)(function () {
-    var debouncedResize = (0, _debounce["default"])(function () {
+    var debouncedResize = (0, _debounce.default)(function () {
       setNextPrev();
     }, 200);
     window.addEventListener('resize', debouncedResize);
@@ -59,39 +67,41 @@ function VtxScrollableRow(props) {
     return function () {
       window.removeEventListener('resize', debouncedResize);
     };
-  }, []);
+  }, [navRef === null || navRef === void 0 ? void 0 : navRef.current, containerRef.current, navWrapRef.current]);
   function setNextPrev() {
-    var navNodeW = navRef.current.scrollWidth;
-    var containerW = containerRef.current.offsetWidth;
-    var navWrapNodeW = navWrapRef.current.offsetWidth;
-    var minOffset = containerW - navNodeW;
-    var next = state.next,
-      prev = state.prev;
-    if (minOffset >= 0) {
-      next = false;
-      setOffset(0, false);
-      offset.current = 0;
-    } else if (minOffset < offset.current) {
-      next = true;
-    } else {
-      next = false;
-      var realOffset = navWrapNodeW - navNodeW;
-      setOffset(realOffset, false);
-      offset.current = realOffset;
-    }
-    if (offset.current < 0) {
-      prev = true;
-    } else {
-      prev = false;
+    if (navRef !== null && navRef !== void 0 && navRef.current && containerRef.current && navWrapRef.current) {
+      var navNodeW = navRef.current.scrollWidth;
+      var containerW = containerRef.current.offsetWidth;
+      var navWrapNodeW = navWrapRef.current.offsetWidth;
+      var minOffset = containerW - navNodeW;
+      var _next = state.next,
+        _prev = state.prev;
+      if (minOffset >= 0) {
+        _next = false;
+        setOffset(0, false);
+        offset.current = 0;
+      } else if (minOffset < offset.current) {
+        _next = true;
+      } else {
+        _next = false;
+        var realOffset = navWrapNodeW - navNodeW;
+        setOffset(realOffset, false);
+        offset.current = realOffset;
+      }
+      if (offset.current < 0) {
+        _prev = true;
+      } else {
+        _prev = false;
+      }
+      setState({
+        next: _next,
+        prev: _prev
+      });
+      return {
+        next: _next,
+        prev: _prev
+      };
     }
-    setState({
-      next: next,
-      prev: prev
-    });
-    return {
-      next: next,
-      prev: prev
-    };
   }
   var setOffset = function setOffset(os) {
     var checkNextPrev = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
@@ -134,43 +144,50 @@ function VtxScrollableRow(props) {
     setOffset(offset.current - navWrapNodeW);
   };
   var showNextPrev = prev || next;
-  var prevButton = /*#__PURE__*/_react["default"].createElement("span", {
+  var prevButton = /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
     onClick: prev ? handlePrev : null
     // eslint-disable-next-line react/no-unknown-property
     ,
     unselectable: "on",
-    className: (0, _classnames3["default"])(_defineProperty(_defineProperty(_defineProperty({}, "".concat(prefixCls, "-prev"), true), "".concat(prefixCls, "-btn-disabled"), !prev), "".concat(prefixCls, "-arrow-show"), showNextPrev))
-  }, /*#__PURE__*/_react["default"].createElement("span", {
-    className: "".concat(prefixCls, "-prev-icon")
-  }, /*#__PURE__*/_react["default"].createElement(_LeftOutlined["default"], null)));
-  var nextButton = /*#__PURE__*/_react["default"].createElement("span", {
+    className: (0, _classnames3.default)(_defineProperty(_defineProperty(_defineProperty({}, "".concat(prefixCls, "-prev"), true), "".concat(prefixCls, "-btn-disabled"), !prev), "".concat(prefixCls, "-arrow-show"), showNextPrev)),
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+      className: "".concat(prefixCls, "-prev-icon"),
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.LeftOutlined, {})
+    })
+  });
+  var nextButton = /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
     onClick: next ? handleNext : null
     // eslint-disable-next-line react/no-unknown-property
     ,
     unselectable: "on",
-    className: (0, _classnames3["default"])(_defineProperty(_defineProperty(_defineProperty({}, "".concat(prefixCls, "-next"), true), "".concat(prefixCls, "-btn-disabled"), !next), "".concat(prefixCls, "-arrow-show"), showNextPrev))
-  }, /*#__PURE__*/_react["default"].createElement("span", {
-    className: "".concat(prefixCls, "-next-icon")
-  }, /*#__PURE__*/_react["default"].createElement(_RightOutlined["default"], null)));
-  return /*#__PURE__*/_react["default"].createElement("div", {
-    className: (0, _classnames3["default"])("".concat(prefixCls, "-container"), className),
+    className: (0, _classnames3.default)(_defineProperty(_defineProperty(_defineProperty({}, "".concat(prefixCls, "-next"), true), "".concat(prefixCls, "-btn-disabled"), !next), "".concat(prefixCls, "-arrow-show"), showNextPrev)),
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+      className: (0, _classnames3.default)("".concat(prefixCls, "-next-icon"), hashId),
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.RightOutlined, {})
+    })
+  });
+  return wrapSSR( /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    className: (0, _classnames3.default)("".concat(prefixCls, "-container"), hashId, className),
     style: style,
-    ref: containerRef
-  }, prevButton, nextButton, /*#__PURE__*/_react["default"].createElement("div", {
-    className: "".concat(prefixCls, "-nav-wrap"),
-    ref: navWrapRef
-  }, /*#__PURE__*/_react["default"].createElement("div", {
-    className: "".concat(prefixCls, "-nav-scroll")
-  }, /*#__PURE__*/_react["default"].createElement("div", {
-    className: "".concat(prefixCls, "-nav"),
-    ref: navRef
-  }, props.children))));
+    ref: containerRef,
+    children: [prevButton, nextButton, /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: (0, _classnames3.default)("".concat(prefixCls, "-nav-wrap"), hashId),
+      ref: navWrapRef,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        className: (0, _classnames3.default)("".concat(prefixCls, "-nav-scroll"), hashId),
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+          className: (0, _classnames3.default)("".concat(prefixCls, "-nav"), hashId),
+          ref: navRef,
+          children: props.children
+        })
+      })
+    })]
+  }));
 }
-var _default = exports["default"] = VtxScrollableRow;
+var _default = exports.default = VtxScrollableRow;
 VtxScrollableRow.propTypes = {
-  prefixCls: _propTypes["default"].string,
-  className: _propTypes["default"].string,
-  style: _propTypes["default"].object,
-  children: _propTypes["default"].node
-};
-//# sourceMappingURL=index.js.map
+  prefixCls: _propTypes.default.string,
+  className: _propTypes.default.string,
+  style: _propTypes.default.object,
+  children: _propTypes.default.node
+};