@aloudata/aloudata-design 0.4.0-beta.9 → 0.4.1

package/es/Table/components/TableHead/index.js

@@ -1,261 +0,0 @@
-import "@aloudata/icons-react/styles/index.less";
-import _SortAscendingLine from "@aloudata/icons-react/es/icons/SortAscendingLine";
-import "@aloudata/icons-react/styles/index.less";
-import _SortDescendingLine from "@aloudata/icons-react/es/icons/SortDescendingLine";
-var _excluded = ["style"];
-
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
-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(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(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
-
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-
-import React, { useState } from 'react';
-import usePrefixCls from '../../../_utils/hooks/usePrefixCls';
-import classnames from 'classnames';
-import _ from 'lodash';
-import { getValidWidthByNumber } from '../../utils';
-import message from '../../../message';
-var ARRAY_FIRST_INDEX = 0;
-
-function TableHead(props) {
-  var headerGroups = props.headerGroups,
-      canResizeColumn = props.canResizeColumn,
-      defaultSort = props.defaultSort,
-      _props$sortable = props.sortable,
-      sortable = _props$sortable === void 0 ? false : _props$sortable,
-      _props$columns = props.columns,
-      columns = _props$columns === void 0 ? [{
-    accessor: '',
-    sortOrder: 'descend'
-  }] : _props$columns,
-      allSortDirections = props.sortDirections,
-      setSortBy = props.setSortBy,
-      _props$onChange = props.onChange,
-      onChange = _props$onChange === void 0 ? function () {} : _props$onChange,
-      columnsWidthMapRef = props.columnsWidthMapRef,
-      columnsTotalWidthRef = props.columnsTotalWidthRef;
-  var prefixCls = usePrefixCls('', 'ald-table'); // 第一列的情况 默认或者恢复是需要用到
-
-  var defaultSortObject = {
-    id: columns[ARRAY_FIRST_INDEX].accessor,
-    desc: !!(columns[ARRAY_FIRST_INDEX].sortOrder && columns[ARRAY_FIRST_INDEX].sortOrder === 'descend')
-  }; // 如果支持排序
-  // 1. 有默认排序 则按照默认排序
-  // 2. 如果没有默认排序，再判断第一列是否符合排序条件，若满足 => 则按第一列排序
-
-  var getInitialSortDirection = function getInitialSortDirection() {
-    if (defaultSort && defaultSort.id) {
-      return defaultSort;
-    }
-
-    if (!defaultSortObject.id) {
-      message.error('开启了排序，但是没有给予默认排序列，并且第一列不支持排序');
-    }
-
-    return defaultSortObject;
-  };
-
-  var _useState = useState(getInitialSortDirection()),
-      _useState2 = _slicedToArray(_useState, 2),
-      sortDirection = _useState2[0],
-      setSortDirection = _useState2[1]; // 排序的方向 倒叙{ id: 'xx', desc: true }、正序{ id: 'xx', desc: false }、无序 { id: '', desc: undefined }
-  // 获取排序方向以及排序的id
-
-
-  var getSortBy = function getSortBy(id) {
-    var sortDirections = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : ['ascend', 'descend'];
-    var // 如果传了sortDirections，则使用传入的，否则使用默认的
-    sortOrder = arguments.length > 2 ? arguments[2] : undefined;
-    var res = {
-      id: id,
-      desc: undefined
-    };
-    var isSameCol = sortDirection.id === id;
-    var descMap = new Map([['ascend', false], ['descend', true]]);
-    var directions = allSortDirections || sortDirections; // 如果不是同一列 则返回默认排序 或者排序顺序的第一个
-
-    if (!isSameCol) {
-      if (sortOrder === 'ascend' || sortOrder === 'descend') {
-        res.desc = descMap.get(sortOrder);
-      } else {
-        res.desc = sortOrder || descMap.get(directions[ARRAY_FIRST_INDEX]);
-      }
-
-      return res;
-    } // 如果是同一列
-    // 如果列给了默认的sortOrder则不在变化
-
-
-    if (sortOrder === 'ascend' || sortOrder === 'descend') {
-      res.desc = descMap.get(sortOrder);
-      return res;
-    } // 在所有方向上 往后取一个
-
-
-    var lastSortDirection = sortDirection.desc ? 'descend' : 'ascend';
-
-    var index = _.findIndex(directions, function (item) {
-      return item === lastSortDirection;
-    });
-
-    var nextIndex = index + 1;
-    res.desc = descMap.get(directions[nextIndex]); // 如果没有排序方向，则返回默认排序对象
-
-    if (res.desc === undefined) {
-      res.id = '';
-    }
-
-    return res;
-  };
-
-  var getHeaderProps = function getHeaderProps(column) {
-    // @ts-ignore
-    var id = column.id,
-        canSort = column.canSort,
-        sorter = column.sorter,
-        sortOrder = column.sortOrder,
-        sortDirections = column.sortDirections;
-    var toggleProps = column.getSortByToggleProps(); // 仅在Table设置sortable时,所有列的canSort为true,此时为前端排序
-
-    if (canSort) {
-      // client sort
-      return _objectSpread(_objectSpread({}, column.getHeaderProps(_objectSpread({}, toggleProps))), {}, {
-        onClick: function onClick(e) {
-          e.stopPropagation();
-
-          if (typeof toggleProps.onClick === 'function') {
-            var sortBy = getSortBy(id, sortDirections, sortOrder);
-            setSortBy(sortBy.desc === undefined ? [defaultSortObject] : [sortBy]); // 客户端排序时 需要重新设置排序
-
-            setSortDirection(sortBy);
-            onChange(sortBy);
-          }
-        }
-      });
-    } // 当列设置sorter属性时，则为服务端排序
-
-
-    if (sorter) {
-      // server sort
-      return _objectSpread(_objectSpread({}, column.getHeaderProps({
-        style: {
-          cursor: 'pointer'
-        }
-      })), {}, {
-        onClick: function onClick(e) {
-          e.stopPropagation();
-          var sortBy = getSortBy(id, sortDirections, sortOrder);
-          setSortDirection(sortBy);
-          onChange(sortBy);
-        }
-      });
-    }
-
-    return column.getHeaderProps();
-  };
-
-  var SortIcons = function SortIcons(_ref) {
-    var id = _ref.id;
-    var currentSortId = sortDirection.id,
-        desc = sortDirection.desc;
-
-    if (id !== currentSortId || !sortable) {
-      return null;
-    }
-
-    return desc ? /*#__PURE__*/React.createElement(_SortDescendingLine, {
-      className: "".concat(prefixCls, "-sortIcon"),
-      fill: "currentColor",
-      size: 12
-    }) : /*#__PURE__*/React.createElement(_SortAscendingLine, {
-      className: "".concat(prefixCls, "-sortIcon"),
-      fill: "currentColor",
-      size: 12
-    });
-  }; // 在页面拖拽完成之后 更新表格整体宽度以及每个列对应的列宽map
-
-
-  var adjustColumnsMapAfterDrag = function adjustColumnsMapAfterDrag(key, width) {
-    var _columnsWidthMapRef$c, _columnsWidthMapRef$c2;
-
-    var newMap = _.cloneDeep(columnsWidthMapRef.current);
-
-    var originWidth = (_columnsWidthMapRef$c = columnsWidthMapRef.current) === null || _columnsWidthMapRef$c === void 0 ? void 0 : (_columnsWidthMapRef$c2 = _columnsWidthMapRef$c.get(key)) === null || _columnsWidthMapRef$c2 === void 0 ? void 0 : _columnsWidthMapRef$c2.width;
-    var newWidth = getValidWidthByNumber(width);
-    newMap.set(key, {
-      isSpecific: true,
-      width: newWidth
-    });
-    columnsWidthMapRef.current = newMap;
-    columnsTotalWidthRef.current = columnsTotalWidthRef.current - originWidth + newWidth;
-  };
-
-  var handleStyleAndReturn = function handleStyleAndReturn(column, index) {
-    var _columnsWidthMapRef$c3, _getHeaderProps$style, _getHeaderProps$style2;
-
-    var key = index.toString();
-    var lastColumnsMapWidth = (_columnsWidthMapRef$c3 = columnsWidthMapRef.current.get(key)) === null || _columnsWidthMapRef$c3 === void 0 ? void 0 : _columnsWidthMapRef$c3.width; // 在拖动之前记录宽度map
-
-    var currentRenderWidth = Number((_getHeaderProps$style = getHeaderProps(column).style) === null || _getHeaderProps$style === void 0 ? void 0 : (_getHeaderProps$style2 = _getHeaderProps$style.width) === null || _getHeaderProps$style2 === void 0 ? void 0 : _getHeaderProps$style2.toString().replace('px', '')); // 表格内置计算的宽度 'px'
-
-    if (currentRenderWidth !== lastColumnsMapWidth) {
-      adjustColumnsMapAfterDrag(key, currentRenderWidth);
-    }
-
-    return _objectSpread(_objectSpread({}, getHeaderProps(column).style), {}, {
-      width: getValidWidthByNumber(currentRenderWidth)
-    });
-  };
-
-  return /*#__PURE__*/React.createElement("div", {
-    className: "".concat(prefixCls, "-thead"),
-    style: {
-      width: columnsTotalWidthRef.current
-    }
-  }, headerGroups.map(function (headerGroup) {
-    var _headerGroup$getHeade = headerGroup.getHeaderGroupProps(),
-        style = _headerGroup$getHeade.style,
-        headerGroupProps = _objectWithoutProperties(_headerGroup$getHeade, _excluded);
-
-    return /*#__PURE__*/React.createElement("div", Object.assign({}, headerGroupProps, {
-      className: "".concat(prefixCls, "-row")
-    }), headerGroup.headers.map(function (column, index) {
-      var barProps = canResizeColumn ? column.getResizerProps() : {};
-      var headCellStyle = handleStyleAndReturn(column, index);
-      return /*#__PURE__*/React.createElement("div", {
-        className: classnames(_defineProperty({}, "".concat(prefixCls, "-cell-sorting"), column.id === sortDirection.id), "".concat(prefixCls, "-cell")),
-        style: headCellStyle,
-        key: column.id
-      }, /*#__PURE__*/React.createElement("div", Object.assign({
-        className: "".concat(prefixCls, "-cell-content")
-      }, getHeaderProps(column), {
-        style: {
-          width: '100%'
-        }
-      }), /*#__PURE__*/React.createElement(React.Fragment, null, column.render('Header'), /*#__PURE__*/React.createElement(SortIcons, {
-        id: column.id
-      }))), /*#__PURE__*/React.createElement("div", Object.assign({}, barProps, {
-        className: classnames(_defineProperty({}, "".concat(prefixCls, "-dragBar"), canResizeColumn), "".concat(prefixCls, "-bar"))
-      })));
-    }));
-  }));
-}
-
-export default TableHead;

package/es/Table/constant.d.ts

@@ -1 +0,0 @@
-

package/es/Table/constant.js

@@ -1 +0,0 @@
-"use strict";

package/es/Table/hooks/useFrame.js

@@ -1,90 +0,0 @@
-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(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(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
-
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-
-// @ts-nocheck
-import { useRef, useState, useEffect } from 'react';
-/**
- * Execute code before next frame but async
- */
-
-export function useLayoutState(defaultState) {
-  var stateRef = useRef(defaultState);
-
-  var _useState = useState({}),
-      _useState2 = _slicedToArray(_useState, 2),
-      forceUpdate = _useState2[1];
-
-  var lastPromiseRef = useRef(null);
-  var updateBatchRef = useRef([]);
-
-  function setFrameState(updater) {
-    updateBatchRef.current.push(updater);
-    var promise = Promise.resolve(); // @ts-ignore;
-
-    lastPromiseRef.current = promise;
-    promise.then(function () {
-      if (lastPromiseRef.current === promise) {
-        var prevBatch = updateBatchRef.current;
-        var prevState = stateRef.current;
-        updateBatchRef.current = [];
-        prevBatch.forEach(function (batchUpdater) {
-          stateRef.current = batchUpdater(stateRef.current);
-        }); // @ts-ignore;
-
-        lastPromiseRef.current = null;
-
-        if (prevState !== stateRef.current) {
-          forceUpdate({});
-        }
-      }
-    });
-  }
-
-  useEffect(function () {
-    return function () {
-      // @ts-ignore;
-      lastPromiseRef.current = null;
-    };
-  }, []);
-  return [stateRef.current, setFrameState];
-}
-/** Lock frame, when frame pass reset the lock. */
-
-export function useTimeoutLock(defaultState) {
-  var frameRef = useRef(defaultState || null);
-  var timeoutRef = useRef();
-  var TIMEOUT_DELAY = 50;
-
-  function cleanUp() {
-    window.clearTimeout(timeoutRef.current);
-  }
-
-  function setState(newState) {
-    // @ts-ignore;
-    frameRef.current = newState;
-    cleanUp();
-    timeoutRef.current = window.setTimeout(function () {
-      // @ts-ignore;
-      frameRef.current = null;
-      timeoutRef.current = undefined;
-    }, TIMEOUT_DELAY);
-  }
-
-  function getState() {
-    return frameRef.current;
-  }
-
-  useEffect(function () {
-    return cleanUp;
-  }, []);
-  return [setState, getState];
-}

package/es/Table/index.js

@@ -1,2 +0,0 @@
-import Table from './Table';
-export default Table;

package/es/Table/interface.js

@@ -1 +0,0 @@
-export {};

package/es/Table/style/index.js

@@ -1,2 +0,0 @@
-import '../../style';
-import './index.less';

package/es/Table/style/index.less

@@ -1,238 +0,0 @@
-/* stylelint-disable property-no-unknown */
-
-@import '../../style/index.less';
-@import '../../Empty/style/index.less';
-@import '../../message/style/index.less';
-@import './variable.less';
-
-.ald-table {
-  display: flex;
-  flex-direction: column;
-  width: 100%;
-  overflow: hidden;
-  user-select: none;
-
-  &-page-loading {
-    opacity: 0;
-  }
-
-  &-table-wrap {
-    display: flex;
-    flex: 1;
-    flex-direction: column;
-    overflow: hidden;
-  }
-
-  &-inner-wrap {
-    width: 100%;
-    height: 100%;
-    overflow-x: overlay;
-  }
-
-  &-tableHeadScrollWrap {
-    display: flex;
-    width: 100%;
-    overflow-x: hidden;
-  }
-
-  &-cell {
-    flex-grow: 1;
-    height: unset;
-    color: inherit;
-    text-align: left;
-    word-break: break-all;
-    border-bottom: 1px solid @NL95;
-
-    &-content {
-      flex: 1;
-    }
-  }
-
-  &-row {
-    height: @table-head-row-height;
-
-    &-ellipsis {
-      .ald-table-cell {
-        overflow: hidden;
-        white-space: nowrap;
-        text-overflow: ellipsis;
-      }
-    }
-  }
-
-  &-thead {
-    flex: 1;
-    overflow: hidden;
-
-    .ald-table-row {
-      min-width: 9999px; // 防止拖动时的闪动
-      height: @table-head-row-height;
-    }
-
-    .ald-table-cell {
-      position: relative;
-      padding: 14px 24px;
-      color: @NL50;
-      line-height: 20px;
-      background-color: @BG95;
-
-      .ald-table-cell-content {
-        overflow: hidden;
-        white-space: nowrap;
-        text-overflow: ellipsis;
-      }
-
-      .ald-table-bar {
-        position: absolute;
-        top: 50%;
-        right: -12px;
-        z-index: 1;
-        display: inline-block;
-        width: 12px;
-        height: 14px;
-        transform: translateY(-50%);
-        touch-action: none;
-
-        &::after {
-          display: block;
-          width: 1px;
-          height: 100%;
-          background-color: @BG70;
-          content: '';
-        }
-      }
-
-      &:last-child {
-        .ald-table-bar {
-          display: none;
-        }
-      }
-    }
-  }
-
-  &-tbody {
-    flex: 1;
-    overflow: hidden;
-
-    .ald-empty {
-      display: flex;
-      justify-content: center;
-    }
-
-    .ald-table-row {
-      height: @table-body-row-height;
-
-      .ald-table-cell {
-        display: flex;
-        align-items: center;
-        padding-left: 24px;
-
-        .ald-table-cell-container {
-          width: 100%;
-        }
-      }
-
-      &:hover {
-        background-color: @NL97;
-      }
-
-      &-selected {
-        background-color: @B98;
-
-        &:hover {
-          background-color: @B98;
-        }
-      }
-    }
-  }
-
-  &-tbody&-tbody-innerScroll {
-    overflow: hidden;
-  }
-
-  &-row-list-wrap {
-    overflow: unset;
-  }
-
-  &-loading {
-    height: @table-body-row-height;
-    color: @NL80;
-    line-height: @table-body-row-height;
-    text-align: center;
-
-    &-icon {
-      margin-right: 4px;
-    }
-  }
-
-  &-empty-icon {
-    padding-top: 52px;
-  }
-
-  &-init-loading {
-    .ald-table-loading {
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      padding-top: 84px;
-      padding-bottom: 84px;
-    }
-  }
-
-  &-header {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    margin-bottom: 24px;
-
-    &-left {
-      color: @NL0;
-      font-weight: 500;
-      font-size: 14px;
-    }
-
-    &-right {
-      display: flex;
-      align-items: center;
-      justify-content: flex-end;
-      height: 28px;
-      color: @NL0;
-      font-size: 14px;
-    }
-  }
-
-  // 当出现多行的时候 会顶出一个滚动条 通过复写三方库的样式覆盖
-  &-list&-canNotInnerScroll {
-    overflow: hidden !important;
-  }
-
-  &-sortIcon {
-    margin-top: -2px;
-    margin-left: 4px;
-  }
-
-  &-column-resizable {
-    overflow: overlay;
-
-    .ald-table-thead,
-    .ald-table-tbody {
-      .ald-table-row {
-        .ald-table {
-          &-cell {
-            flex: none;
-          }
-
-          &-thead {
-            &::-webkit-scrollbar {
-              display: none;
-            }
-          }
-
-          &-tbody {
-            overflow: initial;
-          }
-        }
-      }
-    }
-  }
-}

package/es/Table/style/variable.less

@@ -1,5 +0,0 @@
-/* stylelint-disable property-no-unknown */
-
-@ald-iconfont-css-prefix: anticon;
-@table-head-row-height: 44px;
-@table-body-row-height: 72px;

package/es/Table/style/variable.less.d.ts

@@ -1,7 +0,0 @@
-// This file is automatically generated.
-// Please do not change this file!
-interface CssExports {
-
-}
-export const cssExports: CssExports;
-export default cssExports;

package/es/Table/utils.d.ts

@@ -1,15 +0,0 @@
-import { IColumn } from './interface';
-export interface IWidthDetail {
-    width: number;
-    isSpecific: boolean;
-}
-export declare function getColumnsWidthMap<T>(columns: IColumn<T>[], clientWidth: number, lastWidthMap?: Map<string, IWidthDetail>): {
-    columnsWidthMap: Map<string, IWidthDetail>;
-    totalColumnWidth: number;
-};
-export declare function isPercentageWidth(width: string): boolean;
-export declare function isSpecificPxWidth(width: string): boolean;
-export declare function getValidWidthByNumber(width: number): number;
-export declare function getValidScrollThreshold(height: string | number, clientHeight: number): number;
-export declare function getPercentageValue(percentage: string, containerNum: number): number;
-export declare function getPxValue(px: string): number;