@unicom-cloud/ui 0.8.67 → 0.8.69

package/types/color-picker/hooks/useColorPicker.d.ts

@@ -1,32 +1,34 @@
-import TinyColor from '@unicom-cloud/tinycolor';
-import { HSV } from '../interface';
+import { ColorPickerMode, GradientColor, HSV, InternalGradientColor } from '../interface';
 interface UseColorPickerProps {
-    value?: string;
-    defaultValue?: string;
+    mode?: 'single' | 'gradient' | ['single', 'gradient'];
+    value?: string | GradientColor[];
+    defaultValue?: string | GradientColor[];
     defaultPopupVisible?: boolean;
     disabledAlpha?: boolean;
     popupVisible?: boolean;
     format?: 'hex' | 'rgb';
-    onChange?: (value: string) => void;
+    onChange?: (value: string | GradientColor[]) => void;
     onVisibleChange?: (visible: boolean) => void;
 }
 export declare const useColorPicker: (props: UseColorPickerProps) => {
     value: any;
+    activeMode: ColorPickerMode;
+    gradientColors: InternalGradientColor[];
+    gradientColorsRef: import("react").MutableRefObject<InternalGradientColor[]>;
+    activeColorId: string;
+    activeColorIdRef: import("react").MutableRefObject<string>;
     popupVisible: any;
     color: {
         hsv: HSV;
         rgb: import("@unicom-cloud/tinycolor").Numberify<import("@unicom-cloud/tinycolor").RGBA>;
-        rgbString: string;
         hex: string;
-        hexString: string;
-        hex8String: string;
-        string: string;
-        tiny: TinyColor;
-        alpha: number;
     };
     alpha: number;
     onHsvChange: (_value: HSV) => void;
     onAlphaChange: (_value: number) => void;
     onVisibleChange: (newVisible: any) => void;
+    onActiveModeChange: (newMode: ColorPickerMode) => void;
+    onActiveColorIdChange: (newId: string) => void;
+    onGradientColorsChange: (newColors: InternalGradientColor[] | ((colors: InternalGradientColor[]) => InternalGradientColor[])) => void;
 };
 export {};

package/types/color-picker/hooks/useControlBlock.d.ts

@@ -1,8 +1,15 @@
-interface ControlBlockParams {
+interface MultiValueItem {
     value: [number, number];
-    onChange: (value: [number, number]) => void;
+    key: string;
+}
+interface ControlBlockParams {
+    value: [number, number] | MultiValueItem[];
+    multiple?: boolean;
+    onActive?: (key: string) => void;
+    onAdd?: (value: [number, number]) => void;
+    onChange: (value: [number, number], key?: string) => void;
 }
-export declare const useControlBlock: ({ value, onChange }: ControlBlockParams) => {
+export declare function useControlBlock({ value, multiple, onActive, onAdd, onChange, }: ControlBlockParams): {
     active: boolean;
     blockRef: import("react").MutableRefObject<HTMLDivElement | undefined>;
     handlerRef: import("react").MutableRefObject<HTMLDivElement | undefined>;

package/types/color-picker/index.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { ColorPickerProps } from './interface';
+import type { ColorPickerProps } from './interface';
 declare const ColorPickerComponent: React.ForwardRefExoticComponent<ColorPickerProps & React.RefAttributes<unknown>>;
 export default ColorPickerComponent;
 export type { ColorPickerProps };

package/types/color-picker/interface.d.ts

@@ -4,10 +4,11 @@ import { TriggerProps } from '../trigger';
 export interface ColorPickerProps {
     style?: CSSProperties;
     className?: string | string[];
-    defaultValue?: string;
-    value?: string;
+    defaultValue?: string | GradientColor[];
+    value?: string | GradientColor[];
     showText?: boolean;
     format?: 'hex' | 'rgb';
+    mode?: 'single' | 'gradient' | ['single', 'gradient'];
     disabled?: boolean;
     size?: InputProps['size'];
     defaultPopupVisible?: boolean;
@@ -23,9 +24,9 @@ export interface ColorPickerProps {
         value: string;
     }) => ReactNode);
     triggerElement?: ReactNode | ((params: {
-        value: string;
+        value: string | GradientColor[];
     }) => ReactNode);
-    onChange?: (value: string) => void;
+    onChange?: (value: string | GradientColor[]) => void;
     onVisibleChange?: (visible: boolean) => void;
     renderFooter?: () => ReactNode;
 }
@@ -43,7 +44,18 @@ export interface Color {
     hsv: HSV;
     rgb: RGB;
     hex: string;
-    hexString: string;
-    hex8String: string;
-    string: string;
+}
+export declare enum ColorPickerMode {
+    Single = "single",
+    Gradient = "gradient"
+}
+export interface GradientColor {
+    color: string;
+    percent: number;
+}
+export interface InternalGradientColor {
+    id: string;
+    color: Color;
+    alpha: number;
+    percent: number;
 }

package/types/color-picker/utils.d.ts

@@ -0,0 +1,23 @@
+import { GradientColor, HSV, InternalGradientColor, RGB } from './interface';
+interface RGBA extends RGB {
+    a: number | undefined;
+}
+export declare const sortGradientColors: (gradientColors: InternalGradientColor[]) => InternalGradientColor[];
+export declare const mix: (source: RGBA, target: RGBA, progress: number) => RGBA;
+export declare const getGradientString: (value: GradientColor[]) => string;
+export declare const renderGradientBackground: (value: GradientColor[]) => string;
+export declare const renderBackground: (value: GradientColor[] | string) => string;
+export declare const formatRgba: (r: number, g: number, b: number, a: number) => string;
+export declare const formatHex: (r: number, g: number, b: number, a: number) => string;
+export declare const getColorFromHsv: (hsv: HSV) => {
+    hsv: HSV;
+    rgb: import("@unicom-cloud/tinycolor").Numberify<import("@unicom-cloud/tinycolor").RGBA>;
+    hex: string;
+};
+export declare const getRandomId: () => string;
+export declare const mapValueToGradientColor: (value: GradientColor[], disabledAlpha: boolean) => InternalGradientColor[];
+export declare const getColorByGradients: (gradientColors: InternalGradientColor[], percent: number, id?: string) => InternalGradientColor;
+export declare const equalsHsv: (a: HSV, b: HSV) => boolean;
+export declare const equalsRgba: (a: RGBA, b: RGBA) => boolean;
+export declare const isEqualsColors: (colorA: string | GradientColor[], colorB: string | GradientColor[]) => boolean;
+export {};

package/types/form/Control.d.ts

@@ -1,7 +1,56 @@
-import React from 'react';
-import type { FormControlProps } from './interface';
-interface ForwardRefFormControlProps extends React.ForwardRefExoticComponent<FormControlProps> {
-    isFormControl?: boolean;
+import React, { Component, ReactNode } from 'react';
+import type { FieldError, FormControlProps, FormItemContextProps, FormItemProps, KeyType } from './interface';
+import { NotifyType, StoreChangeInfo } from './store';
+declare class Control<FormData = any, FieldValue = FormData[keyof FormData], FieldKey extends KeyType = keyof FormData> extends Component<FormControlProps<FormData, FieldValue, FieldKey>> {
+    static defaultProps: {
+        trigger: string;
+        triggerPropName: string;
+    };
+    static isFormControl: boolean;
+    static contextType: React.Context<FormItemContextProps>;
+    context: FormItemContextProps<FormData, FieldValue, FieldKey>;
+    private errors;
+    private warnings;
+    private validateStatus;
+    private touched;
+    private isDestroyed;
+    private childrenElement;
+    private removeRegisterField;
+    constructor(props: FormControlProps<FormData, FieldValue, FieldKey>, context: FormItemContextProps<FormData, FieldValue, FieldKey>);
+    componentDidMount(): void;
+    componentDidUpdate(prevProps: any): void;
+    componentWillUnmount(): void;
+    private triggerStateCollect;
+    private toggleValidateStatus;
+    private toggleTouched;
+    private setWarnings;
+    private setErrors;
+    getErrors: () => FieldError<FieldValue> | null;
+    getWarnings: () => ReactNode[];
+    isTouched: () => boolean;
+    getValidateStatus: () => FormItemProps["validateStatus"];
+    hasFieldProps: () => boolean;
+    private clearFormItemError;
+    private updateFormItem;
+    private getFieldValue;
+    onStoreChange: (type: NotifyType, info: StoreChangeInfo<FieldKey> & {
+        current: any;
+    }) => void;
+    innerSetFieldValue: (field: FieldKey, value: FieldValue) => void;
+    validateFieldOnly: () => Promise<{
+        error: FieldError<FieldValue> | null;
+        value: FieldValue;
+        field: FieldKey;
+    }>;
+    validateField: (triggerType?: string) => Promise<{
+        error: FieldError<FieldValue> | null;
+        value: FieldValue;
+        field: FieldKey;
+    }>;
+    getValidateTrigger(): string[];
+    handleTrigger: (_value: any, ...args: any[]) => void;
+    renderControl(children: React.ReactNode, id: any): React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+    getChild: () => React.ReactNode;
+    render(): string | number | boolean | Iterable<React.ReactNode> | import("react/jsx-dev-runtime").JSX.Element | null | undefined;
 }
-declare const Control: ForwardRefFormControlProps;
 export default Control;

package/types/index.d.ts

@@ -1,4 +1,3 @@
-import './style.less';
 export * from './hooks';
 export * from './utils';
 export { compute, default as computeScrollIntoView, } from '@unicom-cloud/compute-scroll-into-view';
@@ -6,8 +5,8 @@ export { CSSTransition, ReplaceTransition, SwitchTransition, Transition, Transit
 export { default as scrollIntoView, default as scrollIntoViewIfNeeded, } from '@unicom-cloud/scroll-into-view-if-needed';
 export { compareColorByRange, convertDecimalToHex, convertHexToDecimal, hslToRgb, hsvToRgb, numberInputToObject, parseIntFromHex, rgbaToArgbHex, rgbaToHex, rgbToHex, rgbToHsl, rgbToHsv, rgbToRgb, default as TinyColor, } from '@unicom-cloud/tinycolor';
 export { easing, default as tween } from '@unicom-cloud/tween';
-export { v4 as uuid, v4 as uuidv4 } from '@unicom-cloud/uuid';
 export { DefaultValidateMessage, Schema, default as validate, } from '@unicom-cloud/validate';
+export { v4 as uuid, v4 as uuidv4 } from 'uuid';
 export { default as Affix } from './affix';
 export { default as Alert } from './alert';
 export { default as Anchor } from './anchor';
@@ -152,6 +151,6 @@ export { default as Upload, UPLOAD_STATUS, UploadList } from './upload';
 export type { UploadProps } from './upload/interface';
 export { default as VerificationCode } from './verification-code';
 export type { VerificationCodeProps } from './verification-code/interface';
-export { buildDate, buildTime, default as version } from './version';
+export { VERSION, VERSION_BUILD_DATE, VERSION_BUILD_TIME } from './version';
 export { default as Watermark } from './watermark';
 export type { WatermarkProps } from './watermark/interface';

package/types/table/hook/useThResizable.d.ts

@@ -1,7 +1,7 @@
 export default useThResizable;
 declare function useThResizable(params?: {}): {
     columns: any;
-    setColumns: import("react").Dispatch<any>;
+    setColumns: (columns_: any) => void;
     ThResizable: typeof ThResizable;
 };
 import ThResizable from '../th-resizable';

package/types/version/index.d.ts

@@ -1,4 +1,4 @@
-export declare const buildDate: any;
-export declare const buildTime: any;
-export declare const version = "2.66.0-beta.2";
-export default version;
+export declare const VERSION_BUILD_DATE: any;
+export declare const VERSION_BUILD_TIME: any;
+export declare const VERSION = "2.66.0-beta.2";
+export default VERSION;

package/typography/Base.js

@@ -0,0 +1,189 @@
+import { jsx as c, jsxs as ie, Fragment as re } from "react/jsx-runtime";
+import le from "lodash/merge";
+import R, { forwardRef as ce, useContext as ae, useRef as W, useState as q, useEffect as pe, useImperativeHandle as me } from "react";
+import { a as de } from "../chunk/ll867Bf3.js";
+import { u as fe } from "../chunk/CdaT1b_F.js";
+import { u as ue } from "../chunk/BSCrLtfQ.js";
+import he from "../popover/index.js";
+import Ee from "../tooltip/index.js";
+import { m as F } from "../chunk/JPPo5nY_.js";
+import "../chunk/D-TPB2Do.js";
+import { m as ge } from "../chunk/B5RFT17G.js";
+import { o as xe } from "../chunk/BKKEev13.js";
+import { r as Ce } from "../chunk/CIRG541s.js";
+import Te from "../utils/throttleByRaf.js";
+import Se from "./EditContent.js";
+import be from "./Operations.js";
+import Ne from "./useCssEllipsis.js";
+import we, { MEASURE_STATUS as O } from "./useEllipsis.js";
+import C from "lodash/isPlainObject.js";
+import L from "lodash/isUndefined.js";
+function $e(n, f) {
+  const {
+    type: a,
+    bold: N,
+    disabled: T,
+    mark: u,
+    underline: S,
+    delete: p,
+    code: w
+  } = n, l = [], h = [];
+  return a && h.push(`${f}-${a}`), T && h.push(`${f}-disabled`), N && l.push("b"), S && l.push("u"), p && l.push("del"), w && l.push("code"), u && l.push("mark"), {
+    component: l,
+    className: h
+  };
+}
+function ke(n, f) {
+  const {
+    componentType: a,
+    style: N,
+    className: T,
+    children: u,
+    editable: S,
+    ellipsis: p,
+    heading: w,
+    blockquote: l,
+    ...h
+  } = n, _ = ae(de), { getPrefixCls: V, rtl: A } = _, i = V("typography"), I = W(), { component: b, className: M } = $e(n, i), [H, U] = q(!1), [G, J] = q(0), $ = C(S) ? S : {}, K = "editing" in $ ? $.editing : H, e = p ? {
+    rows: 1,
+    ellipsisStr: "...",
+    cssEllipsis: !1,
+    ...C(p) ? p : {}
+  } : {}, Q = e.wrapper || R.Fragment, [r, X] = fe(!1, {
+    defaultValue: e.defaultExpanded,
+    value: e.expanded
+  }), { simpleEllipsis: k, ellipsisStyle: Y } = Ne(e), z = (t, o) => {
+    const s = L(e.ellipsisStr) ? "..." : e.ellipsisStr, d = !L(e.suffix) && e.suffix;
+    return /* @__PURE__ */ ie(Q, { children: [
+      t,
+      o && !r && !k ? s : "",
+      d,
+      te(o)
+    ] });
+  }, { ellipsisNode: Z, isEllipsis: m, measureStatus: D } = we({
+    ...e,
+    children: u,
+    expanding: r,
+    width: G,
+    renderMeasureContent: z,
+    simpleEllipsis: k || r
+  }), ee = Te((t) => {
+    const { contentRect: o } = t == null ? void 0 : t[0];
+    if (o) {
+      const s = b.includes("code") ? o.width - 18 : o.width;
+      [
+        O.NO_NEED_ELLIPSIS,
+        O.MEASURE_END
+      ].includes(D) && J(s);
+    }
+  }), j = W(null);
+  pe(() => {
+    const t = Ce([j.current], ee);
+    return () => {
+      t();
+    };
+  }, [j.current]);
+  function te(t) {
+    return /* @__PURE__ */ c(re, { children: /* @__PURE__ */ c(
+      be,
+      {
+        ...n,
+        setEditing: U,
+        onClickExpand: oe,
+        expanding: r,
+        isEllipsis: t,
+        currentContext: _
+      }
+    ) });
+  }
+  function oe(t) {
+    var o, s;
+    X(!r), (o = n.onClickExpand) == null || o.call(n, t), (s = e.onExpand) == null || s.call(e, !r, t);
+  }
+  ue(() => {
+    var t;
+    (t = e.onEllipsis) == null || t.call(e, m);
+  }, [m]), me(f, () => I.current);
+  function B(t, o, s, d = {}) {
+    let g = t;
+    return o.forEach((P, y) => {
+      const v = { className: `${i}-${P}` }, x = y === 0 ? d : {}, ne = C(s.mark) && s.mark.color ? { style: { backgroundColor: s.mark.color }, ...x } : { ...x };
+      g = R.createElement(
+        P,
+        le({ ...ne }, v),
+        g
+      );
+    }), g;
+  }
+  let E;
+  a === "Paragraph" ? E = l ? "blockquote" : "div" : a === "Title" ? E = `h${w}` : a === "Text" && (E = p ? "div" : "span");
+  function se() {
+    const t = ge(R.Children.toArray(u)), o = e.showTooltip, s = C(e.showTooltip) && e.showTooltip.type === "popover" ? "popover" : "tooltip", d = C(e.showTooltip) ? e.showTooltip.props || {} : {}, g = s === "popover" ? he : Ee, y = {
+      style: N,
+      ...m && !o && !r ? { title: t } : {}
+    }, v = m && o && !r, x = /* @__PURE__ */ c(
+      E,
+      {
+        ref: I,
+        className: F(
+          i,
+          M,
+          { [`${i}-rtl`]: A },
+          T
+        ),
+        ...y,
+        ...xe(h, [
+          "spacing",
+          "type",
+          "close",
+          "bold",
+          "disabled",
+          "mark",
+          "underline",
+          "delete",
+          "code",
+          "copyable",
+          "isEllipsis",
+          "expanding",
+          "onClickExpand",
+          "setEditing",
+          "forceShowExpand"
+        ]),
+        children: k && D !== O.INIT && !r && m ? B(
+          // CSS folding style, need to wrap the text separately.
+          z(
+            /* @__PURE__ */ c("span", { style: Y, children: u }),
+            m
+          ),
+          b.length ? b : ["span"],
+          n,
+          // The simple-ellipsis class ensures that the ReactNode after the text is displayed correctly (no line breaks)
+          // Need to act on the immediate parent node of the text
+          { className: `${i}-simple-ellipsis` }
+        ) : B(Z, b, n)
+      }
+    );
+    return v ? /* @__PURE__ */ c(g, { content: t, ...d, children: /* @__PURE__ */ c("span", { children: x }) }) : x;
+  }
+  return K ? /* @__PURE__ */ c(
+    Se,
+    {
+      ref: f,
+      ...n,
+      className: F(
+        i,
+        M,
+        { [`${i}-rtl`]: A },
+        `${i}-${E}`,
+        T
+      ),
+      prefixCls: i,
+      setEditing: U,
+      editableConfig: $
+    }
+  ) : se();
+}
+const Ge = ce(ke);
+export {
+  Ge as default
+};

package/typography/EditContent.js

@@ -0,0 +1,46 @@
+import { jsx as a } from "react/jsx-runtime";
+import { forwardRef as g, useRef as x, useEffect as $ } from "react";
+import v from "../input/Input.js";
+import { m as y } from "../chunk/JPPo5nY_.js";
+import { m as N } from "../chunk/B5RFT17G.js";
+function R(c, i) {
+  const { prefixCls: o, children: f, setEditing: l, editableConfig: e, style: d } = c, p = y(
+    `${o}-typography`,
+    `${o}-edit-content`,
+    c.className
+  ), s = N(f), t = x(null);
+  $(() => {
+    var n, r;
+    if (t.current && ((r = (n = t.current).focus) == null || r.call(n)), t.current && t.current.dom) {
+      const { length: m } = t.current.dom.value;
+      t.current.dom.setSelectionRange(m, m);
+    }
+  }, []);
+  function u() {
+    var n;
+    l(!1), (n = e.onEnd) == null || n.call(e, s);
+  }
+  function E(n) {
+    var r;
+    (r = e.onChange) == null || r.call(e, n);
+  }
+  function h() {
+    u();
+  }
+  return /* @__PURE__ */ a("div", { className: p, style: d, ref: i, children: /* @__PURE__ */ a(
+    v.TextArea,
+    {
+      className: `${o}-edit-content-textarea`,
+      onBlur: h,
+      ref: t,
+      value: s,
+      autoSize: !0,
+      onChange: E,
+      onPressEnter: u
+    }
+  ) });
+}
+const z = g(R);
+export {
+  z as default
+};

package/typography/Ellipsis.js

@@ -0,0 +1,124 @@
+import "react/jsx-runtime";
+import "react";
+import "../chunk/ll867Bf3.js";
+import "../chunk/BFTV6myl.js";
+import "../chunk/CdaT1b_F.js";
+import "lodash/isEqualWith";
+import "../chunk/D-TPB2Do.js";
+import "lodash/isNumber";
+import "lodash/merge";
+import "../utils/dom.js";
+import "../chunk/Biupwn8l.js";
+import "react-dom";
+import "../chunk/Ce1j9KTi.js";
+import "lodash/debounce";
+import "../chunk/yl4BU7Sd.js";
+import "../chunk/B6X4lnd0.js";
+import "../chunk/tamGhTJp.js";
+import "lodash/camelCase";
+import "lodash/capitalize";
+import "lodash/cloneDeep";
+import "lodash/get";
+import "lodash/has";
+import "lodash/kebabCase";
+import "lodash/mergeWith";
+import "lodash/set";
+import "lodash/setWith";
+import "lodash/snakeCase";
+import "lodash/startCase";
+import "lodash/throttle";
+import "lodash/uniq";
+import "lodash/upperFirst";
+import "lodash/camelCase.js";
+import "lodash/capitalize.js";
+import "lodash/kebabCase.js";
+import "lodash/snakeCase.js";
+import "lodash/startCase.js";
+import "lodash/upperFirst.js";
+import "../chunk/JPPo5nY_.js";
+import "lodash/isString.js";
+import "../chunk/DzVH9IBy.js";
+import "lodash/escapeRegExp";
+import "lodash/isArray";
+import "lodash/isString";
+import "lodash/isPlainObject";
+import "../chunk/Bl7BnD1R.js";
+import "../utils/throttleByRaf.js";
+import "lodash/isFunction";
+import "../chunk/CCv-5KFt.js";
+import "uuid";
+import "../affix/index.js";
+import "../alert/index.js";
+import "../anchor/Anchor.js";
+import "../auto-complete/index.js";
+import "../avatar/index.js";
+import "../back-top/index.js";
+import "../badge/index.js";
+import "../breadcrumb/index.js";
+import "../button/index.js";
+import "../calendar/index.js";
+import "../card/index.js";
+import "../carousel/index.js";
+import "../chunk/Bi4UkwOR.js";
+import "../chunk/SSK90wgo.js";
+import "../chunk/BSaQv6mx.js";
+import "../comment/index.js";
+import "../copy/index.js";
+import "../date-picker/index.js";
+import "../descriptions/index.js";
+import "../divider/index.js";
+import "../drawer/Drawer.js";
+import "../dropdown/index.js";
+import "../form/index.js";
+import "../grid/index.js";
+import "../icon/index.js";
+import "../image/Image.js";
+import "../input/Input.js";
+import "../input-tag/InputTag.js";
+import "../layout/index.js";
+import "../link/index.js";
+import "../list/index.js";
+import "../mentions/index.js";
+import "../chunk/C98ks5S8.js";
+import "../chunk/BjpUSKM3.js";
+import "../page-header/index.js";
+import "../pagination/Pagination.js";
+import "../popconfirm/index.js";
+import "../popover/index.js";
+import "../portal/index.js";
+import "../progress/index.js";
+import "../color-picker/index.js";
+import "../loading/index.js";
+import "../chunk/CD3AUpzo.js";
+import "../rate/index.js";
+import "../resize-box/index.js";
+import "../result/index.js";
+import "../select/Select.js";
+import "../skeleton/index.js";
+import "../slider/index.js";
+import "../space/index.js";
+import "../speech-synthesis/index.js";
+import "../spin/index.js";
+import "../statistic/index.js";
+import "../steps/index.js";
+import "../suspense-fallback-test/index.js";
+import "../switch/index.js";
+import "../table/index.js";
+import "../chunk/vmgkWLYf.js";
+import "../tag/index.js";
+import "../time-picker/index.js";
+import "../timeline/Timeline.js";
+import "../tooltip/index.js";
+import "../transfer/index.js";
+import "../tree/Tree.js";
+import "../tree-select/Select.js";
+import "../trigger/index.js";
+import { TypographyEllipsis as uo } from "./index.js";
+import "../upload/Upload.js";
+import "../verification-code/VerificationCode.js";
+import "../watermark/Watermark.js";
+import "../chunk/CIRG541s.js";
+import "lodash/isPlainObject.js";
+export {
+  uo as default
+};