quantumai-design-system
Version:
퀀텀에이아이의 디자인 시스템
45 lines (44 loc) • 3.03 kB
JavaScript
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
return cooked;
};
var __assign = (this && this.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
var __rest = (this && this.__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;
};
import { css } from '@emotion/react';
import { TYPOGRAPHYS_STYLE } from '../../../styles/theme';
import { mixinSize, mixinSpacing } from '../../../utils/styleSet';
var alignEnum = {
left: 'flex-start',
center: 'center',
right: 'flex-end',
};
var decorationEnum = {
over: 'overline',
mid: 'line-through',
under: 'underline',
};
export var TextStyle = function (_a) {
var display = _a.display, align = _a.align, type = _a.type, line = _a.line, wrap = _a.wrap, color = _a.color, props = __rest(_a, ["display", "align", "type", "line", "wrap", "color"]);
return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n margin: 0;\n display: ", ";\n box-sizing: border-box;\n word-break: break-all;\n text-align: ", ";\n justify-content: ", ";\n ", "\n vertical-align: middle;\n color: ", ";\n text-decoration: ", ";\n ", "\n\n &.text-wrap {\n text-overflow: ellipsis;\n overflow: hidden;\n word-break: break-word;\n display: -webkit-box;\n -webkit-line-clamp: ", "; // \uC6D0\uD558\uB294 \uB77C\uC778\uC218\n -webkit-box-orient: vertical;\n }\n\n ", "\n ", "\n"], ["\n margin: 0;\n display: ", ";\n box-sizing: border-box;\n word-break: break-all;\n text-align: ", ";\n justify-content: ", ";\n ", "\n vertical-align: middle;\n color: ", ";\n text-decoration: ", ";\n ", "\n\n &.text-wrap {\n text-overflow: ellipsis;\n overflow: hidden;\n word-break: break-word;\n display: -webkit-box;\n -webkit-line-clamp: ", "; // \uC6D0\uD558\uB294 \uB77C\uC778\uC218\n -webkit-box-orient: vertical;\n }\n\n ", "\n ", "\n"])), display === 'block' ? 'flex' : 'inline-flex', align, align && alignEnum[align], type && TYPOGRAPHYS_STYLE[type], color, line && decorationEnum[line], line === 'under' && "text-underline-position : under;", wrap, mixinSize(__assign({}, props)), mixinSpacing(__assign({}, props)));
};
var templateObject_1;