@jiaozhiye/qm-design-react 1.0.0-beta.1

package/lib/style/index.less

@@ -0,0 +1,32 @@
+/*
+ * @Author: 焦质晔
+ * @Date: 2021-07-23 18:23:59
+ * @Last Modified by: 焦质晔
+ * @Last Modified time: 2022-01-11 18:01:47
+ */
+/* Reset And Font */
+@import './reset';
+
+/* Antd */
+@import '../antd/index.less';
+
+/* QmDesign */
+@import '../button/style/index.less';
+@import '../space/style/index.less';
+@import '../divider/style/index.less';
+@import '../split/style/index.less';
+@import '../countup/style/index.less';
+@import '../empty/style/index.less';
+@import '../spin/style/index.less';
+@import '../download/style/index.less';
+@import '../anchor/style/index.less';
+@import '../tabs/style/index.less';
+@import '../drawer/style/index.less';
+@import '../modal/style/index.less';
+@import '../form/style/index.less';
+@import '../tinymce/style/index.less';
+@import '../cropper/style/index.less';
+@import '../upload-file/style/index.less';
+@import '../upload-img/style/index.less';
+@import '../table/style/index.less';
+@import '../search-helper/style/index.less';

package/lib/style/mixins/box.less

@@ -0,0 +1,13 @@
+/*
+ * @Author: 焦质晔
+ * @Date: 2021-07-23 18:58:07
+ * @Last Modified by:   焦质晔
+ * @Last Modified time: 2021-07-23 18:58:07
+ */
+.box(@position: absolute) {
+  position: @position;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+}

package/lib/style/mixins/clearfix.less

@@ -0,0 +1,21 @@
+/*
+ * @Author: 焦质晔
+ * @Date: 2021-07-23 18:58:15
+ * @Last Modified by:   焦质晔
+ * @Last Modified time: 2021-07-23 18:58:15
+ */
+// mixins for clearfix
+// ------------------------
+.clearfix() {
+  // https://github.com/ant-design/ant-design/issues/21301#issuecomment-583955229
+  &::before {
+    display: table;
+    content: '';
+  }
+  &::after {
+    // https://github.com/ant-design/ant-design/issues/21864
+    display: table;
+    clear: both;
+    content: '';
+  }
+}

package/lib/style/mixins/index.less

@@ -0,0 +1,11 @@
+/*
+ * @Author: 焦质晔
+ * @Date: 2021-07-23 18:59:22
+ * @Last Modified by: 焦质晔
+ * @Last Modified time: 2021-07-23 18:59:53
+ */
+@import './size';
+@import './clearfix';
+@import './reset';
+@import './operation-unit';
+@import './box';

package/lib/style/mixins/operation-unit.less

@@ -0,0 +1,24 @@
+/*
+ * @Author: 焦质晔
+ * @Date: 2021-07-23 18:58:20
+ * @Last Modified by: 焦质晔
+ * @Last Modified time: 2021-07-23 18:59:02
+ */
+@import '../themes/index';
+
+.operation-unit() {
+  color: @--link-color;
+  text-decoration: none;
+  outline: none;
+  cursor: pointer;
+  transition: color 0.3s;
+
+  &:focus,
+  &:hover {
+    color: @--link-hover-color;
+  }
+
+  &:active {
+    color: @--link-active-color;
+  }
+}

package/lib/style/mixins/reset.less

@@ -0,0 +1,35 @@
+/*
+ * @Author: 焦质晔
+ * @Date: 2021-07-23 18:58:43
+ * @Last Modified by:   焦质晔
+ * @Last Modified time: 2021-07-23 18:58:43
+ */
+@import '../themes/index';
+
+.reset-component() {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+  color: @--text-color;
+  font-size: @--font-size-base;
+  font-variant: @font-variant-base;
+  line-height: @--line-height-base;
+  list-style: none;
+  font-feature-settings: @font-feature-settings-base;
+}
+
+.box-sizing-content() {
+  box-sizing: border-box;
+}
+
+.text-overflow-cut() {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.user-select-none() {
+  -moz-user-select: none;
+  -webkit-user-select: none;
+  -ms-user-select: none;
+}

package/lib/style/mixins/size.less

@@ -0,0 +1,15 @@
+/*
+ * @Author: 焦质晔
+ * @Date: 2021-07-23 18:59:08
+ * @Last Modified by:   焦质晔
+ * @Last Modified time: 2021-07-23 18:59:08
+ */
+// Sizing shortcuts
+.size(@width; @height) {
+  width: @width;
+  height: @height;
+}
+
+.square(@size) {
+  .size(@size; @size);
+}

package/lib/style/reset.less

@@ -0,0 +1,134 @@
+/* http://meyerweb.com/eric/tools/css/reset/
+   v2.0 | 20110126
+   License: none (public domain)
+*/
+html,
+body,
+div,
+span,
+applet,
+object,
+iframe,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+p,
+blockquote,
+pre,
+a,
+abbr,
+acronym,
+address,
+big,
+cite,
+code,
+del,
+dfn,
+em,
+img,
+ins,
+kbd,
+q,
+s,
+samp,
+small,
+strike,
+strong,
+sub,
+sup,
+tt,
+var,
+b,
+u,
+i,
+center,
+dl,
+dt,
+dd,
+ol,
+ul,
+li,
+fieldset,
+form,
+label,
+legend,
+table,
+caption,
+tbody,
+tfoot,
+thead,
+tr,
+th,
+td,
+article,
+aside,
+canvas,
+details,
+embed,
+figure,
+figcaption,
+footer,
+header,
+hgroup,
+menu,
+nav,
+output,
+ruby,
+section,
+summary,
+time,
+mark,
+audio,
+video {
+  margin: 0;
+  padding: 0;
+  border: 0;
+}
+/* HTML5 display-role reset for older browsers */
+article,
+aside,
+details,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+menu,
+nav,
+section {
+  display: block;
+}
+ol,
+ul {
+  list-style: none;
+  margin: 0;
+}
+blockquote,
+q {
+  quotes: none;
+}
+blockquote:before,
+blockquote:after,
+q:before,
+q:after {
+  content: '';
+  content: none;
+}
+table {
+  border-collapse: collapse;
+  border-spacing: 0;
+}
+.svgicon {
+  display: inline-block;
+  color: inherit;
+  font-style: normal;
+  line-height: 0;
+  text-align: center;
+  text-transform: none;
+  text-rendering: optimizeLegibility;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}

package/lib/style/themes/default.less

@@ -0,0 +1,113 @@
+/*
+ * @Author: 焦质晔
+ * @Date: 2021-07-23 18:25:34
+ * @Last Modified by: 焦质晔
+ * @Last Modified time: 2022-01-02 10:42:49
+ */
+// The prefix to use on all css classes from qm.
+@qm-prefix: qm;
+
+// An override for the html selector for theme prefixes
+@--html-selector: html;
+
+// -------- Colors -----------
+@--primary-color: #1890ff;
+
+@--info-color: @--primary-color;
+@--success-color: #52c41a;
+@--error-color: #f5222d;
+@--warning-color: #faad14;
+@--normal-color: #d9d9d9;
+@--white: #fff;
+@--black: #000;
+
+// Color used by default to control hover and active backgrounds and for
+// colorPalette from antd/lib/style/color/colorPalette
+@--primary-1: color(~`colorPalette('@{--primary-color}', 1) `);
+@--primary-2: color(~`colorPalette('@{--primary-color}', 2) `);
+@--primary-3: color(~`colorPalette('@{--primary-color}', 3) `);
+@--primary-4: color(~`colorPalette('@{--primary-color}', 4) `);
+@--primary-5: color(~`colorPalette('@{--primary-color}', 5) `);
+@--primary-6: @--primary-color;
+@--primary-7: color(~`colorPalette('@{--primary-color}', 7) `);
+@--primary-8: color(~`colorPalette('@{--primary-color}', 8) `);
+@--primary-9: color(~`colorPalette('@{--primary-color}', 9) `);
+@--primary-10: color(~`colorPalette('@{--primary-color}', 10) `);
+
+// Background color for `<body>`
+@--body-background: @--white;
+// Base background color for most components
+@--component-background: @--white;
+// Popover background color
+@--popover-background: @--component-background;
+
+// Background-color
+@--background-color: #f2f2f2;
+@--background-color-cecondary: #f5f5f5;
+
+// Font-family
+@--font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji',
+  'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
+@--font-path: './fonts';
+
+// Text color
+@--text-color: fade(@--black, 85%);
+@--text-color-secondary-dark: fade(@--black, 65%);
+@--text-color-secondary: fade(@--black, 45%);
+@--header-color: fade(@--black, 85%);
+
+// Iconfont
+@--icon-color: @--text-color-secondary-dark;
+
+// Disabled color
+@--disabled-color: fade(@--black, 25%);
+@--disabled-bg: @--background-color;
+
+// Font-size
+@--font-size-base: 14px;
+@--font-size-lg: @--font-size-base + 2px;
+@--font-size-sm: 12px;
+
+// Line-height
+@--line-height-base: 1.5715;
+
+// Border
+@--border-color-base: #d9d9d9;
+@--border-color-secondary: #e8e8e8;
+@--border-width-base: 1px;
+@--border-style-base: solid;
+@--border-radius-base: 2px;
+@--border-radius-sm: @--border-radius-base;
+
+// Outline
+@--outline-width: 2px;
+@--outline-color: @--primary-color;
+@--error-color-outline: fade(@--error-color, 20%);
+
+// Vertical paddings
+@--padding-lg: 12px;
+@--padding-md: 10px;
+@--padding-sm: 8px;
+
+// Vertical margins
+@--margin-lg: 12px;
+@--margin-md: 10px;
+@--margin-sm: 8px;
+
+// Height rules
+@--height-lg: 40px;
+@--height-md: 32px;
+@--height-sm: 24px;
+
+// LINK
+@--link-color: @--primary-color;
+@--link-hover-color: @--primary-5;
+@--link-active-color: @--primary-7;
+
+// Shadow
+@--shadow-color: fade(@--black, 0.15);
+@--shadow-1-up: 0 -2px 8px @--shadow-color;
+@--shadow-1-down: 0 2px 8px @--shadow-color;
+@--shadow-1-left: -2px 0 8px @--shadow-color;
+@--shadow-1-right: 2px 0 8px @--shadow-color;
+@--box-shadow-base: @--shadow-1-down;

package/lib/style/themes/index.less

@@ -0,0 +1,7 @@
+/*
+ * @Author: 焦质晔
+ * @Date: 2021-07-23 18:25:16
+ * @Last Modified by: 焦质晔
+ * @Last Modified time: 2021-07-23 18:25:45
+ */
+@import './default';

package/lib/table/index.d.ts

@@ -0,0 +1,4 @@
+import Table from './src/table';
+export type { QmTableProps } from './src/table';
+export type { IColumn as QmTableColumn } from './src/table/types';
+export default Table;

package/lib/table/src/alert/index.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+declare type IAlertProps = {
+    total: number;
+};
+declare const Alert: React.FC<IAlertProps>;
+export default Alert;

package/lib/table/src/body/index.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import type { IColumn, IRecord, TableBodyRef } from '../table/types';
+declare type IBodyProps = {
+    tableData: IRecord[];
+    flattenColumns: IColumn[];
+};
+declare const TableBody: React.ForwardRefExoticComponent<IBodyProps & React.RefAttributes<TableBodyRef>>;
+export default TableBody;

package/lib/table/src/body/useValueFormat.d.ts

@@ -0,0 +1,12 @@
+declare const useValueFormat: () => {
+    dateFormat: (val: string) => string;
+    datetimeFormat: (val: string) => string;
+    dateShortTimeFormat: (val: string) => string;
+    percentFormat: (val: number) => string;
+    financeFormat: (val: number) => string;
+    secretNameFormat: (val: string) => string;
+    secretPhoneFormat: (val: string) => string;
+    secretIDnumberFormat: (val: string) => string;
+    secretBankNumberFormat: (val: string) => string;
+};
+export default useValueFormat;

package/lib/table/src/column-filter/index.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import type { IColumn } from '../table/types';
+declare type IColumnFilterProps = {
+    columns: IColumn[];
+};
+declare const ColumnFilter: React.FC<IColumnFilterProps>;
+export default ColumnFilter;

package/lib/table/src/config/index.d.ts

@@ -0,0 +1,47 @@
+declare const config: {
+    defaultColumnWidth: number;
+    selectionColumnWidth: number;
+    rowHeightMaps: {
+        large: number;
+        middle: number;
+        mini: number;
+    };
+    sortDirections: string[];
+    pagination: {
+        current: number;
+        pageSize: number;
+        pageSizeOptions: number[];
+        showSizeChanger: boolean;
+        showQuickJumper: boolean;
+    };
+    groupSummary: {
+        total: {
+            text: string;
+            value: string;
+        };
+        recordTotalIndex: string;
+        summaryFieldName: string;
+        groupbyFieldName: string;
+    };
+    highSearch: {
+        showSQL: boolean;
+    };
+    treeTable: {
+        textIndent: number;
+    };
+    dataKey: string;
+    summationKey: string;
+    totalKey: string;
+    virtualScrollY: number;
+    sorterFieldName: string;
+    filterFieldName: string;
+    currentPageName: string;
+    pageSizeName: string;
+    showFilterType: boolean;
+    printWidth: number;
+    operationColumn: string;
+    selectionColumn: string;
+    expandableColumn: string;
+    summaryIgnore: string;
+};
+export default config;

package/lib/table/src/context/index.d.ts

@@ -0,0 +1,74 @@
+/// <reference types="react" />
+import type { TableBodyRef, IColumn, IDerivedRowKey, IFetchParams, IPagination, IRecord, IRowColSpan, IRowKey, IRule, ITableProps } from '../table/types';
+import type { ITableRef } from '../hooks/useTableRef';
+import type { ITableState } from '../hooks/useTableState';
+import type { ComponentSize } from '../../../_utils/types';
+export declare type ITableContext = {
+    getRowKey: (row: IRecord, index: number) => IRowKey;
+    tableProps: ITableProps;
+    tableRef: React.MutableRefObject<ITableRef>;
+    tableBodyRef: React.RefObject<TableBodyRef>;
+    $size: ComponentSize;
+    flattenColumns: IColumn[];
+    editableColumns: IColumn[];
+    leftFixedColumns: IColumn[];
+    rightFixedColumns: IColumn[];
+    sorter: ITableState['sorter'];
+    filters: ITableState['filters'];
+    superFilters: ITableState['superFilters'];
+    layout: ITableState['layout'];
+    bordered: boolean;
+    showFooter: boolean;
+    showSummary: boolean;
+    summationRows: Record<string, number | string>[];
+    scrollX: boolean;
+    scrollY: ITableState['scrollY'];
+    pagination: IPagination;
+    fetchParams: IFetchParams;
+    selectionKeys: IRowKey[];
+    rowExpandedKeys: ITableState['rowExpandedKeys'];
+    highlightKey: IRowKey;
+    isFetch: boolean;
+    isPingLeft: boolean;
+    isPingRight: boolean;
+    isFullScreen: boolean;
+    isTableEmpty: boolean;
+    isHeadGroup: boolean;
+    isTreeTable: boolean;
+    isGroupSubtotal: boolean;
+    isWebPagination: boolean;
+    dataChange: () => void;
+    tableChange: (backTop?: boolean) => void;
+    getTableData: () => Promise<void>;
+    setElementStore: (key: string, value: HTMLElement) => void;
+    createTableFullData: (records: IRecord[]) => void;
+    setSorter: (value: ITableState['sorter']) => void;
+    setFilters: (value: ITableState['filters']) => void;
+    setSuperFilters: (options: ITableState['superFilters']) => void;
+    setSelectionKeys: (rowKeys: IRowKey[]) => void;
+    setSelectionRows: (records: IRecord[]) => void;
+    setHighlightKey: (rowKey: IRowKey) => void;
+    setRowExpandedKeys: (rowKeys: IRowKey[]) => void;
+    getSpan: (row: IRecord, column: IColumn, rowIndex: number, columnIndex: number, tableData: IRecord[]) => IRowColSpan;
+    getStickyLeft: (rowKey: IRowKey) => number;
+    getStickyRight: (rowKey: IRowKey) => number;
+    scrollXToColumn: (dataIndex: string, index?: number) => void;
+    scrollYToRecord: (rowKey: IRowKey, index?: number) => void;
+    setPingLeft: (value: boolean) => void;
+    setPingRight: (value: boolean) => void;
+    setSpinning: (value: boolean) => void;
+    setFullScreen: (value: boolean) => void;
+    doFieldValidate: (rules: IRule[], val: unknown, rowKey: IRowKey, columnKey: string) => void;
+    createGroupData: (records: IRecord[]) => IRecord[];
+    findParentRowKeys: (deriveRowKeys: IDerivedRowKey[], key: IRowKey) => IRowKey[];
+    getAllChildRowKeys: (deriveRowKeys: IDerivedRowKey[]) => IRowKey[];
+    triggerScrollYEvent: (st: number) => void;
+    scrollBottomDebouncer: (event: React.SyntheticEvent<HTMLDivElement>) => void;
+    clearTableSorter: () => void;
+    clearTableFilter: () => void;
+    clearSuperFilters: () => void;
+    clearRowSelection: () => void;
+    clearRowHighlight: () => void;
+};
+declare const TableContext: import("react").Context<ITableContext | undefined>;
+export default TableContext;

package/lib/table/src/edit/InputNumber.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+import type { ComponentSize } from '../../../_utils/types';
+declare type INumberProps = {
+    size?: ComponentSize;
+    defaultValue?: number | string;
+    value?: number | string;
+    min?: number;
+    max?: number;
+    maxLength?: number;
+    precision?: number;
+    disabled?: boolean;
+    onChange?: (value: number | string) => void;
+    onBlur?: (value: number | string) => void;
+    onEnter?: (value: number | string) => void;
+};
+declare const InputNumber: React.ForwardRefExoticComponent<INumberProps & React.RefAttributes<any>>;
+export default InputNumber;

package/lib/table/src/edit/index.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+import type { IColumn, IRecord, IRowKey } from '../table/types';
+declare type ICellEditProps = {
+    column: IColumn;
+    record: IRecord;
+    rowKey: IRowKey;
+    columnKey: string;
+    clicked: [IRowKey, string] | [];
+    text: string | number;
+};
+declare const CellEdit: React.FC<ICellEditProps>;
+export default CellEdit;

package/lib/table/src/empty/index.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const TableEmpty: React.FC;
+export default TableEmpty;

package/lib/table/src/expandable/index.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import type { IRecord, IRowKey } from '../table/types';
+declare type IExpandableProps = {
+    record: IRecord;
+    rowKey: IRowKey;
+};
+declare const Expandable: React.FC<IExpandableProps>;
+export default Expandable;

package/lib/table/src/export/define.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import type { IColumn } from '../table/types';
+declare type IDefineProps = {
+    columns: IColumn[];
+    onChange: (columns: IColumn[]) => void;
+};
+declare const Define: React.FC<IDefineProps>;
+export default Define;

package/lib/table/src/export/index.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+import type { IColumn } from '../table/types';
+export declare type IOptions = {
+    fileName: string;
+    fileType: 'xlsx' | 'csv';
+    sheetName: string;
+    exportType: 'all' | 'selected' | 'custom';
+    columns: IColumn[];
+    startIndex: number;
+    endIndex: number;
+    footSummation: boolean;
+    useStyle: boolean;
+};
+declare type ITableExportProps = {
+    tableColumns: IColumn[];
+};
+declare const TableExport: React.FC<ITableExportProps>;
+export default TableExport;

package/lib/table/src/export/setting.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+declare type ISettingProps = {
+    defaultValue: any;
+    onClose: () => void;
+    onOk: (data: any) => void;
+};
+declare const Setting: React.FC<ISettingProps>;
+export default Setting;

package/lib/table/src/export/useExport.d.ts

@@ -0,0 +1,9 @@
+import type { IColumn, IRecord } from '../table/types';
+import type { IOptions } from './index';
+declare type IParamsFn1 = (columns: IColumn[], tableData: IRecord[]) => Record<string, number>[];
+declare type IParamsFn2 = (row: IRecord, rowIndex: number, column: IColumn, columnIndex: number) => string | number;
+declare const useExport: (calcSummationValues: IParamsFn1, renderCell: IParamsFn2) => {
+    exportXLSX: (options: IOptions, dataList: IRecord[]) => Promise<Blob>;
+    exportCSV: (options: IOptions, tableHTML: string) => Blob;
+};
+export default useExport;