feat: release github/google auth

feat: OceanBase
feat: date & time mobile
feat: (listView): listView pagination
feat: forward cookies
fix: bugfixes

Author: ggbond2077

client/packages/openblocks-core/lib/index.cjs

@@ -1,6 +1,7 @@
 import * as localeData from "./locales";
 import IntlMessageFormat from "intl-messageformat";
 import log from "loglevel";
+import { Fragment } from "react";
 
 const defaultLocale = "en";
 
@@ -150,7 +151,11 @@ export class Translator<Messages extends object> {
     variables?: Record<string, VariableValue>
   ) {
     const message = this.getMessage(key);
-    return new IntlMessageFormat(message, i18n.locale).format(variables);
+    const node = new IntlMessageFormat(message, i18n.locale).format(variables);
+    if (Array.isArray(node)) {
+      return node.map((n, i) => <Fragment key={i}>{n}</Fragment>);
+    }
+    return node;
   }
 
   private getMessage(key: NestedKey<Messages> | GlobalMessageKey) {

client/packages/openblocks-core/lib/index.d.ts

@@ -31,8 +31,8 @@ const ModalWrapper = styled.div<ModalWrapperProps>`
   will-change: transform;
 `;
 
-const ModalHeaderWrapper = styled.div`
-  cursor: move;
+const ModalHeaderWrapper = styled.div<{ $draggable?: boolean }>`
+  cursor: ${(props) => (props.$draggable ? "move" : "auto")};
   display: flex;
   align-items: center;
   padding: 16px;
@@ -214,7 +214,7 @@ function CustomModalRender(props: CustomModalProps & ModalFuncProps) {
   return (
     <Draggable handle=".handle" disabled={!props.draggable}>
       <ModalWrapper width={props.width}>
-        <ModalHeaderWrapper className="handle">
+        <ModalHeaderWrapper className="handle" $draggable={props.draggable}>
           <ModalHeader
             title={props.title}
             onCancel={props.onCancel}

client/packages/openblocks-core/lib/index.js

@@ -153,6 +153,8 @@ interface DropdownProps<T extends OptionsType> extends Omit<SelectProps, "placem
   itemNode?: (value: string) => JSX.Element;
   preNode?: () => JSX.Element;
   lineHeight?: number;
+  labelStyle?: React.CSSProperties;
+  dropdownStyle?: React.CSSProperties;
 }
 
 export function Dropdown<T extends OptionsType>(props: DropdownProps<T>) {
@@ -161,14 +163,14 @@ export function Dropdown<T extends OptionsType>(props: DropdownProps<T>) {
   return (
     <FlexDiv>
       {props.label && (
-        <LabelWrapper placement={placement}>
+        <LabelWrapper placement={placement} style={props.labelStyle}>
           <ToolTipLabel title={props.toolTip} label={props.label} />
         </LabelWrapper>
       )}
 
       {!props.radioButton && (
         <Tooltip title={!props.label ? props.toolTip : undefined}>
-          <DropdownContainer placement={placement}>
+          <DropdownContainer placement={placement} style={props.dropdownStyle}>
             <CustomSelect
               open={props.open}
               listHeight={props.lineHeight}

client/packages/openblocks-core/src/i18n/index.tsx

@@ -119,6 +119,7 @@ interface ControlPropertyViewWrapperProps {
   childrenWrapperStyle?: React.CSSProperties;
   labelTooltipOverlayInnerStyle?: React.CSSProperties;
   extraChildren?: ReactNode;
+  labelStyle?: React.CSSProperties;
 }
 
 export const ControlPropertyViewWrapper = (
@@ -136,12 +137,18 @@ export const ControlPropertyViewWrapper = (
     extraChildren,
     labelTooltipOverlayInnerStyle,
     lastNode,
+    labelStyle,
   } = props;
 
   return (
     <Wrapper layout={layout} placement={placement}>
       {label && (
-        <LabelWrapper layout={layout} placement={placement} labelEllipsis={labelEllipsis}>
+        <LabelWrapper
+          layout={layout}
+          placement={placement}
+          labelEllipsis={labelEllipsis}
+          style={labelStyle}
+        >
           <ToolTipLabel
             title={tooltip}
             label={label}

client/packages/openblocks-design/src/components/CustomModal.tsx

@@ -1,4 +1,13 @@
-import { Form, Input, InputNumber, InputNumberProps, InputProps, Radio, Select } from "antd";
+import {
+  Form,
+  Input,
+  InputNumber,
+  InputNumberProps,
+  InputProps,
+  Radio,
+  Select,
+  SelectProps,
+} from "antd";
 import { ReactNode } from "react";
 import { CheckBox } from "./checkBox";
 import { CustomSelect } from "./customSelect";
@@ -37,14 +46,16 @@ const FormInput = styled(Input)`
   &:not(.ant-input-affix-wrapper-disabled) {
     background: #ffffff;
   }
+
   border: 1px solid #d7d9e0;
   border-radius: 4px;
 `;
 
 const FormNumberInput = styled(InputNumber)`
-  &:not(.ant-input-number-affix-wrapper-disabled)&:not(.ant-input-number-disabled) {
+  &:not(.ant-input-number-affix-wrapper-disabled) &:not(.ant-input-number-disabled) {
     background: #ffffff;
   }
+
   border: 1px solid #d7d9e0;
   border-radius: 4px;
 `;
@@ -53,6 +64,7 @@ const FormInputPassword = styled(Input)`
   &:not(.ant-input-affix-wrapper-disabled) {
     background: #ffffff;
   }
+
   border: 1px solid #d7d9e0;
   border-radius: 4px;
 `;
@@ -309,6 +321,7 @@ const FormSelect = (props: any) => {
   return (
     <SelectWrapper>
       <CustomSelect
+        mode={props.mode}
         value={value}
         style={{
           width: "100%",
@@ -337,7 +350,9 @@ const FormSelect = (props: any) => {
   );
 };
 
-export interface FormSelectItemProps<T extends OptionsType> extends FormItemProps {
+export interface FormSelectItemProps<T extends OptionsType>
+  extends FormItemProps,
+    Pick<SelectProps, "mode"> {
   options: T;
   afterChange?: (value: ValueFromOption<T>) => void;
 }