@oceanbase/design
Version:
The Design System of OceanBase
102 lines (100 loc) • 3.31 kB
JavaScript
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __hasOwnProp = Object.prototype.hasOwnProperty;
var __export = (target, all) => {
for (var name in all)
__defProp(target, name, { get: all[name], enumerable: true });
};
var __copyProps = (to, from, except, desc) => {
if (from && typeof from === "object" || typeof from === "function") {
for (let key of __getOwnPropNames(from))
if (!__hasOwnProp.call(to, key) && key !== except)
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
}
return to;
};
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
// src/descriptions/style/index.ts
var style_exports = {};
__export(style_exports, {
default: () => style_default,
genDescriptionsStyle: () => genDescriptionsStyle,
genVerticalStyle: () => genVerticalStyle
});
module.exports = __toCommonJS(style_exports);
var import_genComponentStyleHook = require("../../_util/genComponentStyleHook");
var genVerticalStyle = (size, token) => {
const { componentCls } = token;
const paddingMap = {
default: {
paddingIn: token.paddingXS,
paddingOut: token.paddingLG
},
middle: {
paddingIn: token.paddingXXS,
paddingOut: token.padding
},
small: {
paddingIn: token.paddingXXS,
paddingOut: token.paddingSM
}
};
const paddingConfig = paddingMap[size];
return {
// vertical Descriptions without border
[`&${componentCls}${componentCls}-vertical:not(${componentCls}-bordered)`]: {
[`${componentCls}-row:nth-child(2n + 1)`]: {
[`& > th, & > td`]: {
paddingBottom: paddingConfig.paddingIn
}
},
[`${componentCls}-row:nth-child(2n)`]: {
[`& > th, & > td`]: {
paddingBottom: paddingConfig.paddingOut
}
}
}
};
};
var genDescriptionsStyle = (token) => {
const { componentCls, typographyComponentCls } = token;
return {
[`${componentCls}`]: {
...genVerticalStyle("default", token),
[`${componentCls}-item-container`]: {
[`${componentCls}-item-content`]: {
paddingRight: 12,
[`${typographyComponentCls}-edit-content`]: {
insetInlineStart: 0,
marginTop: 0,
marginBottom: 0
}
}
},
[`${componentCls}-item-container:has(${`${typographyComponentCls}-edit-content`})`]: {
alignItems: "center",
height: token.fontSize * token.lineHeight
}
},
[`${componentCls}${componentCls}-middle`]: genVerticalStyle("middle", token),
[`${componentCls}${componentCls}-small`]: genVerticalStyle("small", token)
};
};
var style_default = (prefixCls, typographyPrefixCls) => {
const useStyle = (0, import_genComponentStyleHook.genComponentStyleHook)("Descriptions", (token) => {
return [
genDescriptionsStyle({
...token,
typographyPrefixCls,
typographyComponentCls: `.${typographyPrefixCls}`
})
];
});
return useStyle(prefixCls);
};
// Annotate the CommonJS export names for ESM import in node:
0 && (module.exports = {
genDescriptionsStyle,
genVerticalStyle
});