first commit
This commit is contained in:
8
frontend/node_modules/antd/lib/grid/RowContext.d.ts
generated
vendored
Normal file
8
frontend/node_modules/antd/lib/grid/RowContext.d.ts
generated
vendored
Normal file
@@ -0,0 +1,8 @@
|
||||
export type GutterUnit = number | string;
|
||||
export type RowContextGutter = readonly [GutterUnit, GutterUnit];
|
||||
export interface RowContextState {
|
||||
gutter?: RowContextGutter;
|
||||
wrap?: boolean;
|
||||
}
|
||||
declare const RowContext: import("react").Context<RowContextState>;
|
||||
export default RowContext;
|
||||
9
frontend/node_modules/antd/lib/grid/RowContext.js
generated
vendored
Normal file
9
frontend/node_modules/antd/lib/grid/RowContext.js
generated
vendored
Normal file
@@ -0,0 +1,9 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = void 0;
|
||||
var _react = require("react");
|
||||
const RowContext = /*#__PURE__*/(0, _react.createContext)({});
|
||||
var _default = exports.default = RowContext;
|
||||
24
frontend/node_modules/antd/lib/grid/col.d.ts
generated
vendored
Normal file
24
frontend/node_modules/antd/lib/grid/col.d.ts
generated
vendored
Normal file
@@ -0,0 +1,24 @@
|
||||
import * as React from 'react';
|
||||
import type { Breakpoint } from '../_util/responsiveObserver';
|
||||
import type { LiteralUnion } from '../_util/type';
|
||||
type ColSpanType = number | string;
|
||||
type FlexType = number | LiteralUnion<'none' | 'auto'>;
|
||||
export interface ColSize {
|
||||
flex?: FlexType;
|
||||
span?: ColSpanType;
|
||||
order?: ColSpanType;
|
||||
offset?: ColSpanType;
|
||||
push?: ColSpanType;
|
||||
pull?: ColSpanType;
|
||||
}
|
||||
export interface ColProps extends React.HTMLAttributes<HTMLDivElement>, Partial<Record<Breakpoint, ColSpanType | ColSize>> {
|
||||
flex?: FlexType;
|
||||
span?: ColSpanType;
|
||||
order?: ColSpanType;
|
||||
offset?: ColSpanType;
|
||||
push?: ColSpanType;
|
||||
pull?: ColSpanType;
|
||||
prefixCls?: string;
|
||||
}
|
||||
declare const Col: React.ForwardRefExoticComponent<ColProps & React.RefAttributes<HTMLDivElement>>;
|
||||
export default Col;
|
||||
119
frontend/node_modules/antd/lib/grid/col.js
generated
vendored
Normal file
119
frontend/node_modules/antd/lib/grid/col.js
generated
vendored
Normal file
@@ -0,0 +1,119 @@
|
||||
"use strict";
|
||||
"use client";
|
||||
|
||||
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
||||
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = void 0;
|
||||
var React = _interopRequireWildcard(require("react"));
|
||||
var _classnames = _interopRequireDefault(require("classnames"));
|
||||
var _configProvider = require("../config-provider");
|
||||
var _RowContext = _interopRequireDefault(require("./RowContext"));
|
||||
var _style = require("./style");
|
||||
var __rest = void 0 && (void 0).__rest || function (s, e) {
|
||||
var t = {};
|
||||
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
|
||||
if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
||||
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
|
||||
}
|
||||
return t;
|
||||
};
|
||||
function parseFlex(flex) {
|
||||
if (flex === 'auto') {
|
||||
return '1 1 auto';
|
||||
}
|
||||
if (typeof flex === 'number') {
|
||||
return `${flex} ${flex} auto`;
|
||||
}
|
||||
if (/^\d+(\.\d+)?(px|em|rem|%)$/.test(flex)) {
|
||||
return `0 0 ${flex}`;
|
||||
}
|
||||
return flex;
|
||||
}
|
||||
const sizes = ['xs', 'sm', 'md', 'lg', 'xl', 'xxl'];
|
||||
const Col = /*#__PURE__*/React.forwardRef((props, ref) => {
|
||||
const {
|
||||
getPrefixCls,
|
||||
direction
|
||||
} = React.useContext(_configProvider.ConfigContext);
|
||||
const {
|
||||
gutter,
|
||||
wrap
|
||||
} = React.useContext(_RowContext.default);
|
||||
const {
|
||||
prefixCls: customizePrefixCls,
|
||||
span,
|
||||
order,
|
||||
offset,
|
||||
push,
|
||||
pull,
|
||||
className,
|
||||
children,
|
||||
flex,
|
||||
style
|
||||
} = props,
|
||||
others = __rest(props, ["prefixCls", "span", "order", "offset", "push", "pull", "className", "children", "flex", "style"]);
|
||||
const prefixCls = getPrefixCls('col', customizePrefixCls);
|
||||
const [wrapCSSVar, hashId, cssVarCls] = (0, _style.useColStyle)(prefixCls);
|
||||
// ===================== Size ======================
|
||||
const sizeStyle = {};
|
||||
let sizeClassObj = {};
|
||||
sizes.forEach(size => {
|
||||
let sizeProps = {};
|
||||
const propSize = props[size];
|
||||
if (typeof propSize === 'number') {
|
||||
sizeProps.span = propSize;
|
||||
} else if (typeof propSize === 'object') {
|
||||
sizeProps = propSize || {};
|
||||
}
|
||||
delete others[size];
|
||||
sizeClassObj = Object.assign(Object.assign({}, sizeClassObj), {
|
||||
[`${prefixCls}-${size}-${sizeProps.span}`]: sizeProps.span !== undefined,
|
||||
[`${prefixCls}-${size}-order-${sizeProps.order}`]: sizeProps.order || sizeProps.order === 0,
|
||||
[`${prefixCls}-${size}-offset-${sizeProps.offset}`]: sizeProps.offset || sizeProps.offset === 0,
|
||||
[`${prefixCls}-${size}-push-${sizeProps.push}`]: sizeProps.push || sizeProps.push === 0,
|
||||
[`${prefixCls}-${size}-pull-${sizeProps.pull}`]: sizeProps.pull || sizeProps.pull === 0,
|
||||
[`${prefixCls}-rtl`]: direction === 'rtl'
|
||||
});
|
||||
// Responsive flex layout
|
||||
if (sizeProps.flex) {
|
||||
sizeClassObj[`${prefixCls}-${size}-flex`] = true;
|
||||
sizeStyle[`--${prefixCls}-${size}-flex`] = parseFlex(sizeProps.flex);
|
||||
}
|
||||
});
|
||||
// ==================== Normal =====================
|
||||
const classes = (0, _classnames.default)(prefixCls, {
|
||||
[`${prefixCls}-${span}`]: span !== undefined,
|
||||
[`${prefixCls}-order-${order}`]: order,
|
||||
[`${prefixCls}-offset-${offset}`]: offset,
|
||||
[`${prefixCls}-push-${push}`]: push,
|
||||
[`${prefixCls}-pull-${pull}`]: pull
|
||||
}, className, sizeClassObj, hashId, cssVarCls);
|
||||
const mergedStyle = {};
|
||||
// Horizontal gutter use padding
|
||||
if (gutter === null || gutter === void 0 ? void 0 : gutter[0]) {
|
||||
const horizontalGutter = typeof gutter[0] === 'number' ? `${gutter[0] / 2}px` : `calc(${gutter[0]} / 2)`;
|
||||
mergedStyle.paddingLeft = horizontalGutter;
|
||||
mergedStyle.paddingRight = horizontalGutter;
|
||||
}
|
||||
if (flex) {
|
||||
mergedStyle.flex = parseFlex(flex);
|
||||
// Hack for Firefox to avoid size issue
|
||||
// https://github.com/ant-design/ant-design/pull/20023#issuecomment-564389553
|
||||
if (wrap === false && !mergedStyle.minWidth) {
|
||||
mergedStyle.minWidth = 0;
|
||||
}
|
||||
}
|
||||
// ==================== Render =====================
|
||||
return wrapCSSVar(/*#__PURE__*/React.createElement("div", Object.assign({}, others, {
|
||||
style: Object.assign(Object.assign(Object.assign({}, mergedStyle), style), sizeStyle),
|
||||
className: classes,
|
||||
ref: ref
|
||||
}), children));
|
||||
});
|
||||
if (process.env.NODE_ENV !== 'production') {
|
||||
Col.displayName = 'Col';
|
||||
}
|
||||
var _default = exports.default = Col;
|
||||
4
frontend/node_modules/antd/lib/grid/hooks/useBreakpoint.d.ts
generated
vendored
Normal file
4
frontend/node_modules/antd/lib/grid/hooks/useBreakpoint.d.ts
generated
vendored
Normal file
@@ -0,0 +1,4 @@
|
||||
import type { ScreenMap } from '../../_util/responsiveObserver';
|
||||
declare function useBreakpoint(refreshOnChange: boolean, defaultScreens: null): ScreenMap | null;
|
||||
declare function useBreakpoint(refreshOnChange?: boolean, defaultScreens?: ScreenMap): ScreenMap;
|
||||
export default useBreakpoint;
|
||||
28
frontend/node_modules/antd/lib/grid/hooks/useBreakpoint.js
generated
vendored
Normal file
28
frontend/node_modules/antd/lib/grid/hooks/useBreakpoint.js
generated
vendored
Normal file
@@ -0,0 +1,28 @@
|
||||
"use strict";
|
||||
"use client";
|
||||
|
||||
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = void 0;
|
||||
var _react = require("react");
|
||||
var _useLayoutEffect = _interopRequireDefault(require("rc-util/lib/hooks/useLayoutEffect"));
|
||||
var _hooks = require("../../_util/hooks");
|
||||
var _responsiveObserver = _interopRequireDefault(require("../../_util/responsiveObserver"));
|
||||
function useBreakpoint(refreshOnChange = true, defaultScreens = {}) {
|
||||
const screensRef = (0, _react.useRef)(defaultScreens);
|
||||
const [, forceUpdate] = (0, _hooks.useForceUpdate)();
|
||||
const responsiveObserver = (0, _responsiveObserver.default)();
|
||||
(0, _useLayoutEffect.default)(() => {
|
||||
const token = responsiveObserver.subscribe(supportScreens => {
|
||||
screensRef.current = supportScreens;
|
||||
if (refreshOnChange) {
|
||||
forceUpdate();
|
||||
}
|
||||
});
|
||||
return () => responsiveObserver.unsubscribe(token);
|
||||
}, []);
|
||||
return screensRef.current;
|
||||
}
|
||||
var _default = exports.default = useBreakpoint;
|
||||
5
frontend/node_modules/antd/lib/grid/hooks/useGutter.d.ts
generated
vendored
Normal file
5
frontend/node_modules/antd/lib/grid/hooks/useGutter.d.ts
generated
vendored
Normal file
@@ -0,0 +1,5 @@
|
||||
import type { ScreenMap } from '../../_util/responsiveObserver';
|
||||
import type { RowProps } from '../row';
|
||||
type Gap = number | string | undefined;
|
||||
export default function useGutter(gutter: RowProps['gutter'], screens: ScreenMap | null): [Gap, Gap];
|
||||
export {};
|
||||
34
frontend/node_modules/antd/lib/grid/hooks/useGutter.js
generated
vendored
Normal file
34
frontend/node_modules/antd/lib/grid/hooks/useGutter.js
generated
vendored
Normal file
@@ -0,0 +1,34 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = useGutter;
|
||||
var _responsiveObserver = require("../../_util/responsiveObserver");
|
||||
function useGutter(gutter, screens) {
|
||||
const results = [undefined, undefined];
|
||||
const normalizedGutter = Array.isArray(gutter) ? gutter : [gutter, undefined];
|
||||
// By default use as `xs`
|
||||
const mergedScreens = screens || {
|
||||
xs: true,
|
||||
sm: true,
|
||||
md: true,
|
||||
lg: true,
|
||||
xl: true,
|
||||
xxl: true
|
||||
};
|
||||
normalizedGutter.forEach((g, index) => {
|
||||
if (typeof g === 'object' && g !== null) {
|
||||
for (let i = 0; i < _responsiveObserver.responsiveArray.length; i++) {
|
||||
const breakpoint = _responsiveObserver.responsiveArray[i];
|
||||
if (mergedScreens[breakpoint] && g[breakpoint] !== undefined) {
|
||||
results[index] = g[breakpoint];
|
||||
break;
|
||||
}
|
||||
}
|
||||
} else {
|
||||
results[index] = g;
|
||||
}
|
||||
});
|
||||
return results;
|
||||
}
|
||||
10
frontend/node_modules/antd/lib/grid/index.d.ts
generated
vendored
Normal file
10
frontend/node_modules/antd/lib/grid/index.d.ts
generated
vendored
Normal file
@@ -0,0 +1,10 @@
|
||||
import Col from './col';
|
||||
import Row from './row';
|
||||
declare function useBreakpoint(): Partial<Record<import("..").Breakpoint, boolean>>;
|
||||
export type { ColProps, ColSize } from './col';
|
||||
export type { RowProps } from './row';
|
||||
export { Col, Row };
|
||||
declare const _default: {
|
||||
useBreakpoint: typeof useBreakpoint;
|
||||
};
|
||||
export default _default;
|
||||
30
frontend/node_modules/antd/lib/grid/index.js
generated
vendored
Normal file
30
frontend/node_modules/antd/lib/grid/index.js
generated
vendored
Normal file
@@ -0,0 +1,30 @@
|
||||
"use strict";
|
||||
"use client";
|
||||
|
||||
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
Object.defineProperty(exports, "Col", {
|
||||
enumerable: true,
|
||||
get: function () {
|
||||
return _col.default;
|
||||
}
|
||||
});
|
||||
Object.defineProperty(exports, "Row", {
|
||||
enumerable: true,
|
||||
get: function () {
|
||||
return _row.default;
|
||||
}
|
||||
});
|
||||
exports.default = void 0;
|
||||
var _col = _interopRequireDefault(require("./col"));
|
||||
var _useBreakpoint = _interopRequireDefault(require("./hooks/useBreakpoint"));
|
||||
var _row = _interopRequireDefault(require("./row"));
|
||||
// Do not export params
|
||||
function useBreakpoint() {
|
||||
return (0, _useBreakpoint.default)();
|
||||
}
|
||||
var _default = exports.default = {
|
||||
useBreakpoint
|
||||
};
|
||||
20
frontend/node_modules/antd/lib/grid/row.d.ts
generated
vendored
Normal file
20
frontend/node_modules/antd/lib/grid/row.d.ts
generated
vendored
Normal file
@@ -0,0 +1,20 @@
|
||||
import * as React from 'react';
|
||||
import type { Breakpoint } from '../_util/responsiveObserver';
|
||||
declare const _RowAligns: readonly ["top", "middle", "bottom", "stretch"];
|
||||
declare const _RowJustify: readonly ["start", "end", "center", "space-around", "space-between", "space-evenly"];
|
||||
type Responsive = 'xxl' | 'xl' | 'lg' | 'md' | 'sm' | 'xs';
|
||||
type ResponsiveLike<T> = {
|
||||
[key in Responsive]?: T;
|
||||
};
|
||||
export type Gutter = number | string | undefined | Partial<Record<Breakpoint, number>>;
|
||||
type ResponsiveAligns = ResponsiveLike<(typeof _RowAligns)[number]>;
|
||||
type ResponsiveJustify = ResponsiveLike<(typeof _RowJustify)[number]>;
|
||||
export interface RowProps extends React.HTMLAttributes<HTMLDivElement> {
|
||||
gutter?: Gutter | [Gutter, Gutter];
|
||||
align?: (typeof _RowAligns)[number] | ResponsiveAligns;
|
||||
justify?: (typeof _RowJustify)[number] | ResponsiveJustify;
|
||||
prefixCls?: string;
|
||||
wrap?: boolean;
|
||||
}
|
||||
declare const Row: React.ForwardRefExoticComponent<RowProps & React.RefAttributes<HTMLDivElement>>;
|
||||
export default Row;
|
||||
109
frontend/node_modules/antd/lib/grid/row.js
generated
vendored
Normal file
109
frontend/node_modules/antd/lib/grid/row.js
generated
vendored
Normal file
@@ -0,0 +1,109 @@
|
||||
"use strict";
|
||||
"use client";
|
||||
|
||||
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
||||
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.default = void 0;
|
||||
var React = _interopRequireWildcard(require("react"));
|
||||
var _classnames = _interopRequireDefault(require("classnames"));
|
||||
var _responsiveObserver = require("../_util/responsiveObserver");
|
||||
var _configProvider = require("../config-provider");
|
||||
var _useBreakpoint = _interopRequireDefault(require("./hooks/useBreakpoint"));
|
||||
var _useGutter = _interopRequireDefault(require("./hooks/useGutter"));
|
||||
var _RowContext = _interopRequireDefault(require("./RowContext"));
|
||||
var _style = require("./style");
|
||||
var __rest = void 0 && (void 0).__rest || function (s, e) {
|
||||
var t = {};
|
||||
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
|
||||
if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
||||
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
|
||||
}
|
||||
return t;
|
||||
};
|
||||
const _RowAligns = ['top', 'middle', 'bottom', 'stretch'];
|
||||
const _RowJustify = ['start', 'end', 'center', 'space-around', 'space-between', 'space-evenly'];
|
||||
function useMergedPropByScreen(oriProp, screen) {
|
||||
const [prop, setProp] = React.useState(typeof oriProp === 'string' ? oriProp : '');
|
||||
const calcMergedAlignOrJustify = () => {
|
||||
if (typeof oriProp === 'string') {
|
||||
setProp(oriProp);
|
||||
}
|
||||
if (typeof oriProp !== 'object') {
|
||||
return;
|
||||
}
|
||||
for (let i = 0; i < _responsiveObserver.responsiveArray.length; i++) {
|
||||
const breakpoint = _responsiveObserver.responsiveArray[i];
|
||||
// if do not match, do nothing
|
||||
if (!screen || !screen[breakpoint]) {
|
||||
continue;
|
||||
}
|
||||
const curVal = oriProp[breakpoint];
|
||||
if (curVal !== undefined) {
|
||||
setProp(curVal);
|
||||
return;
|
||||
}
|
||||
}
|
||||
};
|
||||
React.useEffect(() => {
|
||||
calcMergedAlignOrJustify();
|
||||
}, [JSON.stringify(oriProp), screen]);
|
||||
return prop;
|
||||
}
|
||||
const Row = /*#__PURE__*/React.forwardRef((props, ref) => {
|
||||
const {
|
||||
prefixCls: customizePrefixCls,
|
||||
justify,
|
||||
align,
|
||||
className,
|
||||
style,
|
||||
children,
|
||||
gutter = 0,
|
||||
wrap
|
||||
} = props,
|
||||
others = __rest(props, ["prefixCls", "justify", "align", "className", "style", "children", "gutter", "wrap"]);
|
||||
const {
|
||||
getPrefixCls,
|
||||
direction
|
||||
} = React.useContext(_configProvider.ConfigContext);
|
||||
const screens = (0, _useBreakpoint.default)(true, null);
|
||||
const mergedAlign = useMergedPropByScreen(align, screens);
|
||||
const mergedJustify = useMergedPropByScreen(justify, screens);
|
||||
const prefixCls = getPrefixCls('row', customizePrefixCls);
|
||||
const [wrapCSSVar, hashId, cssVarCls] = (0, _style.useRowStyle)(prefixCls);
|
||||
const gutters = (0, _useGutter.default)(gutter, screens);
|
||||
const classes = (0, _classnames.default)(prefixCls, {
|
||||
[`${prefixCls}-no-wrap`]: wrap === false,
|
||||
[`${prefixCls}-${mergedJustify}`]: mergedJustify,
|
||||
[`${prefixCls}-${mergedAlign}`]: mergedAlign,
|
||||
[`${prefixCls}-rtl`]: direction === 'rtl'
|
||||
}, className, hashId, cssVarCls);
|
||||
// Add gutter related style
|
||||
const rowStyle = {};
|
||||
if (gutters === null || gutters === void 0 ? void 0 : gutters[0]) {
|
||||
const horizontalGutter = typeof gutters[0] === 'number' ? `${gutters[0] / -2}px` : `calc(${gutters[0]} / -2)`;
|
||||
rowStyle.marginLeft = horizontalGutter;
|
||||
rowStyle.marginRight = horizontalGutter;
|
||||
}
|
||||
// "gutters" is a new array in each rendering phase, it'll make 'React.useMemo' effectless.
|
||||
// So we deconstruct "gutters" variable here.
|
||||
const [gutterH, gutterV] = gutters;
|
||||
rowStyle.rowGap = gutterV;
|
||||
const rowContext = React.useMemo(() => ({
|
||||
gutter: [gutterH, gutterV],
|
||||
wrap
|
||||
}), [gutterH, gutterV, wrap]);
|
||||
return wrapCSSVar(/*#__PURE__*/React.createElement(_RowContext.default.Provider, {
|
||||
value: rowContext
|
||||
}, /*#__PURE__*/React.createElement("div", Object.assign({}, others, {
|
||||
className: classes,
|
||||
style: Object.assign(Object.assign({}, rowStyle), style),
|
||||
ref: ref
|
||||
}), children)));
|
||||
});
|
||||
if (process.env.NODE_ENV !== 'production') {
|
||||
Row.displayName = 'Row';
|
||||
}
|
||||
var _default = exports.default = Row;
|
||||
15
frontend/node_modules/antd/lib/grid/style/index.d.ts
generated
vendored
Normal file
15
frontend/node_modules/antd/lib/grid/style/index.d.ts
generated
vendored
Normal file
@@ -0,0 +1,15 @@
|
||||
import type { AliasToken, GetDefaultToken } from '../../theme/internal';
|
||||
export interface ComponentToken {
|
||||
}
|
||||
export declare const prepareRowComponentToken: GetDefaultToken<'Grid'>;
|
||||
export declare const prepareColComponentToken: GetDefaultToken<'Grid'>;
|
||||
export declare const useRowStyle: (prefixCls: string, rootCls?: string) => readonly [(node: React.ReactElement) => React.ReactElement, string, string];
|
||||
export declare const getMediaSize: (token: AliasToken) => {
|
||||
readonly xs: number;
|
||||
readonly sm: number;
|
||||
readonly md: number;
|
||||
readonly lg: number;
|
||||
readonly xl: number;
|
||||
readonly xxl: number;
|
||||
};
|
||||
export declare const useColStyle: (prefixCls: string, rootCls?: string) => readonly [(node: React.ReactElement) => React.ReactElement, string, string];
|
||||
169
frontend/node_modules/antd/lib/grid/style/index.js
generated
vendored
Normal file
169
frontend/node_modules/antd/lib/grid/style/index.js
generated
vendored
Normal file
@@ -0,0 +1,169 @@
|
||||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
exports.useRowStyle = exports.useColStyle = exports.prepareRowComponentToken = exports.prepareColComponentToken = exports.getMediaSize = void 0;
|
||||
var _cssinjs = require("@ant-design/cssinjs");
|
||||
var _internal = require("../../theme/internal");
|
||||
// ============================== Row-Shared ==============================
|
||||
const genGridRowStyle = token => {
|
||||
const {
|
||||
componentCls
|
||||
} = token;
|
||||
return {
|
||||
// Grid system
|
||||
[componentCls]: {
|
||||
display: 'flex',
|
||||
flexFlow: 'row wrap',
|
||||
minWidth: 0,
|
||||
'&::before, &::after': {
|
||||
display: 'flex'
|
||||
},
|
||||
'&-no-wrap': {
|
||||
flexWrap: 'nowrap'
|
||||
},
|
||||
// The origin of the X-axis
|
||||
'&-start': {
|
||||
justifyContent: 'flex-start'
|
||||
},
|
||||
// The center of the X-axis
|
||||
'&-center': {
|
||||
justifyContent: 'center'
|
||||
},
|
||||
// The opposite of the X-axis
|
||||
'&-end': {
|
||||
justifyContent: 'flex-end'
|
||||
},
|
||||
'&-space-between': {
|
||||
justifyContent: 'space-between'
|
||||
},
|
||||
'&-space-around': {
|
||||
justifyContent: 'space-around'
|
||||
},
|
||||
'&-space-evenly': {
|
||||
justifyContent: 'space-evenly'
|
||||
},
|
||||
// Align at the top
|
||||
'&-top': {
|
||||
alignItems: 'flex-start'
|
||||
},
|
||||
// Align at the center
|
||||
'&-middle': {
|
||||
alignItems: 'center'
|
||||
},
|
||||
'&-bottom': {
|
||||
alignItems: 'flex-end'
|
||||
}
|
||||
}
|
||||
};
|
||||
};
|
||||
// ============================== Col-Shared ==============================
|
||||
const genGridColStyle = token => {
|
||||
const {
|
||||
componentCls
|
||||
} = token;
|
||||
return {
|
||||
// Grid system
|
||||
[componentCls]: {
|
||||
position: 'relative',
|
||||
maxWidth: '100%',
|
||||
// Prevent columns from collapsing when empty
|
||||
minHeight: 1
|
||||
}
|
||||
};
|
||||
};
|
||||
const genLoopGridColumnsStyle = (token, sizeCls) => {
|
||||
const {
|
||||
prefixCls,
|
||||
componentCls,
|
||||
gridColumns
|
||||
} = token;
|
||||
const gridColumnsStyle = {};
|
||||
for (let i = gridColumns; i >= 0; i--) {
|
||||
if (i === 0) {
|
||||
gridColumnsStyle[`${componentCls}${sizeCls}-${i}`] = {
|
||||
display: 'none'
|
||||
};
|
||||
gridColumnsStyle[`${componentCls}-push-${i}`] = {
|
||||
insetInlineStart: 'auto'
|
||||
};
|
||||
gridColumnsStyle[`${componentCls}-pull-${i}`] = {
|
||||
insetInlineEnd: 'auto'
|
||||
};
|
||||
gridColumnsStyle[`${componentCls}${sizeCls}-push-${i}`] = {
|
||||
insetInlineStart: 'auto'
|
||||
};
|
||||
gridColumnsStyle[`${componentCls}${sizeCls}-pull-${i}`] = {
|
||||
insetInlineEnd: 'auto'
|
||||
};
|
||||
gridColumnsStyle[`${componentCls}${sizeCls}-offset-${i}`] = {
|
||||
marginInlineStart: 0
|
||||
};
|
||||
gridColumnsStyle[`${componentCls}${sizeCls}-order-${i}`] = {
|
||||
order: 0
|
||||
};
|
||||
} else {
|
||||
gridColumnsStyle[`${componentCls}${sizeCls}-${i}`] = [
|
||||
// https://github.com/ant-design/ant-design/issues/44456
|
||||
// Form set `display: flex` on Col which will override `display: block`.
|
||||
// Let's get it from css variable to support override.
|
||||
{
|
||||
['--ant-display']: 'block',
|
||||
// Fallback to display if variable not support
|
||||
display: 'block'
|
||||
}, {
|
||||
display: 'var(--ant-display)',
|
||||
flex: `0 0 ${i / gridColumns * 100}%`,
|
||||
maxWidth: `${i / gridColumns * 100}%`
|
||||
}];
|
||||
gridColumnsStyle[`${componentCls}${sizeCls}-push-${i}`] = {
|
||||
insetInlineStart: `${i / gridColumns * 100}%`
|
||||
};
|
||||
gridColumnsStyle[`${componentCls}${sizeCls}-pull-${i}`] = {
|
||||
insetInlineEnd: `${i / gridColumns * 100}%`
|
||||
};
|
||||
gridColumnsStyle[`${componentCls}${sizeCls}-offset-${i}`] = {
|
||||
marginInlineStart: `${i / gridColumns * 100}%`
|
||||
};
|
||||
gridColumnsStyle[`${componentCls}${sizeCls}-order-${i}`] = {
|
||||
order: i
|
||||
};
|
||||
}
|
||||
}
|
||||
// Flex CSS Var
|
||||
gridColumnsStyle[`${componentCls}${sizeCls}-flex`] = {
|
||||
flex: `var(--${prefixCls}${sizeCls}-flex)`
|
||||
};
|
||||
return gridColumnsStyle;
|
||||
};
|
||||
const genGridStyle = (token, sizeCls) => genLoopGridColumnsStyle(token, sizeCls);
|
||||
const genGridMediaStyle = (token, screenSize, sizeCls) => ({
|
||||
[`@media (min-width: ${(0, _cssinjs.unit)(screenSize)})`]: Object.assign({}, genGridStyle(token, sizeCls))
|
||||
});
|
||||
const prepareRowComponentToken = () => ({});
|
||||
exports.prepareRowComponentToken = prepareRowComponentToken;
|
||||
const prepareColComponentToken = () => ({});
|
||||
// ============================== Export ==============================
|
||||
exports.prepareColComponentToken = prepareColComponentToken;
|
||||
const useRowStyle = exports.useRowStyle = (0, _internal.genStyleHooks)('Grid', genGridRowStyle, prepareRowComponentToken);
|
||||
const getMediaSize = token => {
|
||||
const mediaSizesMap = {
|
||||
xs: token.screenXSMin,
|
||||
sm: token.screenSMMin,
|
||||
md: token.screenMDMin,
|
||||
lg: token.screenLGMin,
|
||||
xl: token.screenXLMin,
|
||||
xxl: token.screenXXLMin
|
||||
};
|
||||
return mediaSizesMap;
|
||||
};
|
||||
exports.getMediaSize = getMediaSize;
|
||||
const useColStyle = exports.useColStyle = (0, _internal.genStyleHooks)('Grid', token => {
|
||||
const gridToken = (0, _internal.mergeToken)(token, {
|
||||
gridColumns: 24 // Row is divided into 24 parts in Grid
|
||||
});
|
||||
const gridMediaSizesMap = getMediaSize(gridToken);
|
||||
delete gridMediaSizesMap.xs;
|
||||
return [genGridColStyle(gridToken), genGridStyle(gridToken, ''), genGridStyle(gridToken, '-xs'), Object.keys(gridMediaSizesMap).map(key => genGridMediaStyle(gridToken, gridMediaSizesMap[key], `-${key}`)).reduce((pre, cur) => Object.assign(Object.assign({}, pre), cur), {})];
|
||||
}, prepareColComponentToken);
|
||||
Reference in New Issue
Block a user