@oceanbase/ui 0.2.6 → 0.2.8

package/es/Highlight/index.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="highlight.js" />
 import React from 'react';
 import type { LocaleWrapperProps } from '../locale/LocaleWrapper';
 import './index.less';

package/es/PageContainer/index.js

@@ -1,5 +1,5 @@
 function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
-var _excluded = ["prefixCls", "className", "header", "locale"];
+var _excluded = ["prefixCls", "className", "header", "content", "extraContent", "tabList", "tabBarExtraContent", "locale"];
 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) { 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; }
@@ -23,6 +23,10 @@ var PageContainer = function PageContainer(_ref) {
   var customizePrefixCls = _ref.prefixCls,
     className = _ref.className,
     header = _ref.header,
+    content = _ref.content,
+    extraContent = _ref.extraContent,
+    tabList = _ref.tabList,
+    tabBarExtraContent = _ref.tabBarExtraContent,
     locale = _ref.locale,
     restProps = _objectWithoutProperties(_ref, _excluded);
   var _useContext = useContext(ConfigProvider.ConfigContext),
@@ -32,14 +36,13 @@ var PageContainer = function PageContainer(_ref) {
   var _useStyle = useStyle(prefixCls),
     wrapSSR = _useStyle.wrapSSR,
     hashId = _useStyle.hashId;
-  var pageContainerCls = classNames(className, hashId);
   var _ref2 = header || {},
     reload = _ref2.reload,
     subTitle = _ref2.subTitle,
     breadcrumb = _ref2.breadcrumb;
   var reloadProps = isObject(reload) && ! /*#__PURE__*/React.isValidElement(reload) ? reload : {};
   var reloadCls = classNames("".concat(rootPrefixCls, "-page-header-heading-reload"), reloadProps.className);
-  var newSubTitle = /*#__PURE__*/React.createElement(Space, {
+  var newSubTitle = subTitle && /*#__PURE__*/React.createElement(Space, {
     size: 12
   }, reload && /*#__PURE__*/React.createElement(Tooltip, {
     title: locale.reload
@@ -48,7 +51,7 @@ var PageContainer = function PageContainer(_ref) {
   }))), subTitle);
   var newHeader = header && _objectSpread(_objectSpread({}, header), {}, {
     subTitle: newSubTitle,
-    breadcrumb: _objectSpread({
+    breadcrumb: breadcrumb && _objectSpread({
       itemRender: function itemRender(route, params, routes, paths) {
         return /*#__PURE__*/React.createElement(ItemRender, {
           route: route,
@@ -59,10 +62,18 @@ var PageContainer = function PageContainer(_ref) {
       }
     }, breadcrumb)
   });
+  var noHasHeader = ['title', 'subTitle', 'extra', 'tags', 'footer', 'avatar', 'backIcon', 'breadcrumb'].every(function (item) {
+    return !(newHeader !== null && newHeader !== void 0 && newHeader[item]);
+  }) && !content && !extraContent && !tabList && !tabBarExtraContent;
+  var pageContainerCls = classNames(_defineProperty({}, "".concat(prefixCls, "-no-page-header"), noHasHeader), className, hashId);
   return wrapSSR( /*#__PURE__*/React.createElement(AntPageContainer, _extends({
     prefixCls: customizePrefixCls,
     className: pageContainerCls,
-    header: newHeader
+    header: newHeader,
+    content: content,
+    extraContent: extraContent,
+    tabList: tabList,
+    tabBarExtraContent: tabBarExtraContent
   }, restProps)));
 };
 export default LocaleWrapper({

package/es/PageContainer/style/index.js

@@ -4,7 +4,7 @@ function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _ty
 function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
 import { genComponentStyleHook } from "../../_util/genComponentStyleHook";
 export var genPageContainerStyle = function genPageContainerStyle(token) {
-  var _$concat, _$concat2, _$concat3, _$concat4, _ref;
+  var _$concat, _$concat2, _$concat3, _$concat5, _ref;
   var antCls = token.antCls,
     proComponentsCls = token.proComponentsCls,
     componentCls = token.componentCls,
@@ -49,20 +49,22 @@ export var genPageContainerStyle = function genPageContainerStyle(token) {
     paddingInline: paddingLG,
     paddingBlockStart: 0,
     paddingBlockEnd: paddingLG
-  }), _$concat3)), _defineProperty(_ref, "".concat(componentCls, "-with-footer "), {
+  }), _$concat3)), _defineProperty(_ref, "".concat(componentCls, "-no-page-header"), _defineProperty({}, "".concat(componentCls, "-children-container"), {
+    paddingBlockStart: paddingLG
+  })), _defineProperty(_ref, "".concat(componentCls, "-with-footer "), {
     paddingBottom: 64
-  }), _defineProperty(_ref, "".concat(proComponentsCls, "-footer-bar"), (_$concat4 = {
+  }), _defineProperty(_ref, "".concat(proComponentsCls, "-footer-bar"), (_$concat5 = {
     backgroundColor: colorBgBase,
     borderRadius: borderRadius,
     boxShadow: boxShadowSecondary,
     borderBlockStart: 'none'
-  }, _defineProperty(_$concat4, "".concat(antCls, "-btn:not(").concat(antCls, "-input-search-button)"), {
+  }, _defineProperty(_$concat5, "".concat(antCls, "-btn:not(").concat(antCls, "-input-search-button)"), {
     minWidth: 68,
     height: height
-  }), _defineProperty(_$concat4, "".concat(antCls, "-radio-button-wrapper"), {
+  }), _defineProperty(_$concat5, "".concat(antCls, "-radio-button-wrapper"), {
     height: height,
     lineHeight: lineHeight
-  }), _$concat4)), _ref;
+  }), _$concat5)), _ref;
 };
 export default (function (prefixCls) {
   var useStyle = genComponentStyleHook('PageContainer', function (token) {

package/es/Ranger/QuickPicker.d.ts

@@ -1,4 +1,17 @@
 import React from 'react';
+import type { LocaleWrapperProps } from '../locale/LocaleWrapper';
+import type { RangeValue } from './Ranger';
+import type { RangeOption } from './typing';
 export declare type QuickType = 'select' | 'dropdown';
-declare const _default: (props: any) => React.JSX.Element;
+interface IProps extends LocaleWrapperProps {
+    selects: RangeOption[];
+    type?: QuickType;
+    onChange: (range: RangeValue) => void;
+    onNameChange?: (name: string) => void;
+    customable?: boolean;
+    name?: string;
+    defaultName?: string;
+    isMoment?: boolean;
+}
+declare const _default: (props: IProps) => React.JSX.Element;
 export default _default;

package/es/Ranger/Ranger.js

@@ -1,5 +1,9 @@
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
 var _excluded = ["selects", "value", "defaultValue", "defaultQuickValue", "mode", "quickType", "pastOnly", "onChange", "disabledDate", "locale", "size", "stickRangeName"];
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+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(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
 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); }
@@ -12,6 +16,7 @@ import { DatePicker, Space } from '@oceanbase/design';
 import dayjs from 'dayjs';
 import { isNil, noop, omit } from 'lodash';
 import moment from 'moment';
+import classNames from 'classnames';
 import React, { useEffect, useMemo, useState } from 'react';
 import LocaleWrapper from "../locale/LocaleWrapper";
 import { getPrefix } from "../_util";
@@ -108,7 +113,7 @@ var Ranger = function Ranger(props) {
   var showQuickPicker = selects.length !== 0;
   return /*#__PURE__*/React.createElement(Space, {
     size: 0,
-    className: prefix,
+    className: classNames(_defineProperty({}, "".concat(prefix, "-show-range"), showRange), prefix),
     style: rest.style
   }, showQuickPicker && /*#__PURE__*/React.createElement(QuickPicker, {
     customable: true,

package/es/Ranger/index.less

@@ -35,7 +35,9 @@
       z-index: 1;
     }
   }
+}
 
+.@{prefix}-show-range {
   .ob-ranger-quick-picker.ob-ranger-quick-picker-select {
     margin-right: -1px;
 

package/lib/Highlight/index.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="highlight.js" />
 import React from 'react';
 import type { LocaleWrapperProps } from '../locale/LocaleWrapper';
 import './index.less';

package/lib/PageContainer/index.js

@@ -47,6 +47,10 @@ var PageContainer = ({
   prefixCls: customizePrefixCls,
   className,
   header,
+  content,
+  extraContent,
+  tabList,
+  tabBarExtraContent,
   locale,
   ...restProps
 }) => {
@@ -54,22 +58,31 @@ var PageContainer = ({
   const rootPrefixCls = getPrefixCls();
   const prefixCls = getPrefixCls("pro-page-container", customizePrefixCls);
   const { wrapSSR, hashId } = (0, import_style.default)(prefixCls);
-  const pageContainerCls = (0, import_classnames.default)(className, hashId);
   const { reload, subTitle, breadcrumb } = header || {};
   const reloadProps = (0, import_lodash.isObject)(reload) && !import_react.default.isValidElement(reload) ? reload : {};
   const reloadCls = (0, import_classnames.default)(
     `${rootPrefixCls}-page-header-heading-reload`,
     reloadProps.className
   );
-  const newSubTitle = /* @__PURE__ */ import_react.default.createElement(import_design.Space, { size: 12 }, reload && /* @__PURE__ */ import_react.default.createElement(import_design2.Tooltip, { title: locale.reload }, (0, import_lodash.isObject)(reload) && import_react.default.isValidElement(reload) ? reload : /* @__PURE__ */ import_react.default.createElement(import_icons.SyncOutlined, { ...reloadProps, className: reloadCls })), subTitle);
+  const newSubTitle = subTitle && /* @__PURE__ */ import_react.default.createElement(import_design.Space, { size: 12 }, reload && /* @__PURE__ */ import_react.default.createElement(import_design2.Tooltip, { title: locale.reload }, (0, import_lodash.isObject)(reload) && import_react.default.isValidElement(reload) ? reload : /* @__PURE__ */ import_react.default.createElement(import_icons.SyncOutlined, { ...reloadProps, className: reloadCls })), subTitle);
   const newHeader = header && {
     ...header,
     subTitle: newSubTitle,
-    breadcrumb: {
+    breadcrumb: breadcrumb && {
       itemRender: (route, params, routes, paths) => /* @__PURE__ */ import_react.default.createElement(import_ItemRender.default, { route, params, routes, paths }),
       ...breadcrumb
     }
   };
+  const noHasHeader = ["title", "subTitle", "extra", "tags", "footer", "avatar", "backIcon", "breadcrumb"].every(
+    (item) => !(newHeader == null ? void 0 : newHeader[item])
+  ) && !content && !extraContent && !tabList && !tabBarExtraContent;
+  const pageContainerCls = (0, import_classnames.default)(
+    {
+      [`${prefixCls}-no-page-header`]: noHasHeader
+    },
+    className,
+    hashId
+  );
   return wrapSSR(
     /* @__PURE__ */ import_react.default.createElement(
       import_pro_components.PageContainer,
@@ -77,6 +90,10 @@ var PageContainer = ({
         prefixCls: customizePrefixCls,
         className: pageContainerCls,
         header: newHeader,
+        content,
+        extraContent,
+        tabList,
+        tabBarExtraContent,
         ...restProps
       }
     )

package/lib/PageContainer/style/index.js

@@ -88,6 +88,11 @@ var genPageContainerStyle = (token) => {
         paddingBlockEnd: paddingLG
       }
     },
+    [`${componentCls}-no-page-header`]: {
+      [`${componentCls}-children-container`]: {
+        paddingBlockStart: paddingLG
+      }
+    },
     [`${componentCls}-with-footer `]: {
       paddingBottom: 64
     },

package/lib/Ranger/QuickPicker.d.ts

@@ -1,4 +1,17 @@
 import React from 'react';
+import type { LocaleWrapperProps } from '../locale/LocaleWrapper';
+import type { RangeValue } from './Ranger';
+import type { RangeOption } from './typing';
 export declare type QuickType = 'select' | 'dropdown';
-declare const _default: (props: any) => React.JSX.Element;
+interface IProps extends LocaleWrapperProps {
+    selects: RangeOption[];
+    type?: QuickType;
+    onChange: (range: RangeValue) => void;
+    onNameChange?: (name: string) => void;
+    customable?: boolean;
+    name?: string;
+    defaultName?: string;
+    isMoment?: boolean;
+}
+declare const _default: (props: IProps) => React.JSX.Element;
 export default _default;

package/lib/Ranger/Ranger.js

@@ -36,6 +36,7 @@ var import_design = require("@oceanbase/design");
 var import_dayjs = __toESM(require("dayjs"));
 var import_lodash = require("lodash");
 var import_moment = __toESM(require("moment"));
+var import_classnames = __toESM(require("classnames"));
 var import_react = __toESM(require("react"));
 var import_LocaleWrapper = __toESM(require("../locale/LocaleWrapper"));
 var import_util = require("../_util");
@@ -119,34 +120,48 @@ var Ranger = (props) => {
   }
   const showRange = mode === "default" || rangeName === import_constant.CUSTOMIZE;
   const showQuickPicker = selects.length !== 0;
-  return /* @__PURE__ */ import_react.default.createElement(import_design.Space, { size: 0, className: prefix, style: rest.style }, showQuickPicker && /* @__PURE__ */ import_react.default.createElement(
-    import_QuickPicker.default,
+  return /* @__PURE__ */ import_react.default.createElement(
+    import_design.Space,
     {
-      customable: true,
-      type: internalQuickType,
-      onChange: rangeChange,
-      onNameChange: handleNameChange,
-      selects,
-      name: rangeName,
-      locale,
-      isMoment,
-      size
-    }
-  ), showRange && // @ts-ignore
-  /* @__PURE__ */ import_react.default.createElement(
-    import_design.DatePicker.RangePicker,
-    {
-      disabledDate: pastOnly ? disabledFuture : disabledDate,
-      format: import_constant.DATE_TIME_FORMAT,
-      defaultValue,
-      value: innerValue || defaultInternalValue,
-      onChange: datePickerChange,
-      showTime: true,
-      className: `${prefix}-range-picker`,
-      size,
-      ...(0, import_lodash.omit)(rest, "value", "onChange")
-    }
-  ));
+      size: 0,
+      className: (0, import_classnames.default)(
+        {
+          [`${prefix}-show-range`]: showRange
+        },
+        prefix
+      ),
+      style: rest.style
+    },
+    showQuickPicker && /* @__PURE__ */ import_react.default.createElement(
+      import_QuickPicker.default,
+      {
+        customable: true,
+        type: internalQuickType,
+        onChange: rangeChange,
+        onNameChange: handleNameChange,
+        selects,
+        name: rangeName,
+        locale,
+        isMoment,
+        size
+      }
+    ),
+    showRange && // @ts-ignore
+    /* @__PURE__ */ import_react.default.createElement(
+      import_design.DatePicker.RangePicker,
+      {
+        disabledDate: pastOnly ? disabledFuture : disabledDate,
+        format: import_constant.DATE_TIME_FORMAT,
+        defaultValue,
+        value: innerValue || defaultInternalValue,
+        onChange: datePickerChange,
+        showTime: true,
+        className: `${prefix}-range-picker`,
+        size,
+        ...(0, import_lodash.omit)(rest, "value", "onChange")
+      }
+    )
+  );
 };
 var Ranger_default = (0, import_LocaleWrapper.default)({
   componentName: "Ranger",

package/lib/Ranger/index.less

@@ -35,7 +35,9 @@
       z-index: 1;
     }
   }
+}
 
+.@{prefix}-show-range {
   .ob-ranger-quick-picker.ob-ranger-quick-picker-select {
     margin-right: -1px;
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oceanbase/ui",
-  "version": "0.2.6",
+  "version": "0.2.8",
   "description": "The UI library based on OceanBase Design",
   "keywords": [
     "OceanBase",
@@ -37,7 +37,7 @@
   "dependencies": {
     "@ant-design/cssinjs": "^1.9.1",
     "@ant-design/pro-components": "^2.4.12",
-    "@oceanbase/design": "^0.2.6",
+    "@oceanbase/design": "^0.2.7",
     "@oceanbase/icons": "^0.2.1",
     "@oceanbase/util": "^0.2.2",
     "ahooks": "^2.10.0",
@@ -67,5 +67,5 @@
     "react-dom": "^16.9.0",
     "react-router-dom": ">=5.2.0"
   },
-  "gitHead": "ad719a3964434132196e732bb61004498ad829ee"
+  "gitHead": "f78cdafa256cd617ac4a61ca6cd91b6a772ed843"
 }