@remember-web/mixin 0.1.0 → 0.1.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/mixin/src/colors/index.d.ts +3 -0
- package/dist/mixin/src/colors/index.d.ts.map +1 -0
- package/dist/mixin/src/colors/theme.cjs.map +1 -0
- package/dist/mixin/src/colors/theme.d.ts +6 -0
- package/dist/mixin/src/colors/theme.d.ts.map +1 -0
- package/dist/mixin/src/colors/theme.js +74 -0
- package/dist/mixin/src/colors/theme.js.map +1 -0
- package/dist/mixin/src/colors/types.d.ts +21 -0
- package/dist/mixin/src/colors/types.d.ts.map +1 -0
- package/dist/{colors → mixin/src/colors}/utils.cjs +5 -1
- package/dist/mixin/src/colors/utils.cjs.map +1 -0
- package/dist/mixin/src/colors/utils.d.ts +21 -0
- package/dist/mixin/src/colors/utils.d.ts.map +1 -0
- package/dist/mixin/src/colors/utils.js +61 -0
- package/dist/mixin/src/colors/utils.js.map +1 -0
- package/dist/{colors → mixin/src/colors}/variables.cjs +6 -0
- package/dist/mixin/src/colors/variables.cjs.map +1 -0
- package/dist/mixin/src/colors/variables.d.ts +32 -0
- package/dist/mixin/src/colors/variables.d.ts.map +1 -0
- package/dist/mixin/src/colors/variables.js +46 -0
- package/dist/mixin/src/colors/variables.js.map +1 -0
- package/dist/{index.cjs → mixin/src/index.cjs} +7 -7
- package/dist/mixin/src/index.d.ts +4 -0
- package/dist/mixin/src/index.d.ts.map +1 -0
- package/dist/{index.js → mixin/src/index.js} +2 -2
- package/dist/mixin/src/mediaQuery/const.cjs.map +1 -0
- package/dist/mixin/src/mediaQuery/const.d.ts +3 -0
- package/dist/mixin/src/mediaQuery/const.d.ts.map +1 -0
- package/dist/{mediaQuery → mixin/src/mediaQuery}/const.js +2 -2
- package/dist/mixin/src/mediaQuery/const.js.map +1 -0
- package/dist/mixin/src/mediaQuery/index.cjs.map +1 -0
- package/dist/mixin/src/mediaQuery/index.d.ts +10 -0
- package/dist/mixin/src/mediaQuery/index.d.ts.map +1 -0
- package/dist/mixin/src/mediaQuery/index.js +32 -0
- package/dist/mixin/src/mediaQuery/index.js.map +1 -0
- package/dist/{typography → mixin/src/typography}/const.cjs +2 -0
- package/dist/mixin/src/typography/const.cjs.map +1 -0
- package/dist/{typography → mixin/src/typography}/const.d.ts +3 -3
- package/dist/mixin/src/typography/const.d.ts.map +1 -0
- package/dist/mixin/src/typography/const.js +113 -0
- package/dist/mixin/src/typography/const.js.map +1 -0
- package/dist/mixin/src/typography/index.d.ts +4 -0
- package/dist/mixin/src/typography/index.d.ts.map +1 -0
- package/dist/mixin/src/typography/types.d.ts +3 -0
- package/dist/mixin/src/typography/types.d.ts.map +1 -0
- package/dist/{typography/index.cjs → mixin/src/typography/utils.cjs} +3 -3
- package/dist/mixin/src/typography/utils.cjs.map +1 -0
- package/dist/{typography/index.d.ts → mixin/src/typography/utils.d.ts} +5 -7
- package/dist/mixin/src/typography/utils.d.ts.map +1 -0
- package/dist/mixin/src/typography/utils.js +52 -0
- package/dist/mixin/src/typography/utils.js.map +1 -0
- package/dist/shared/utils/common.cjs.map +1 -1
- package/dist/shared/utils/common.d.ts +3 -3
- package/dist/shared/utils/common.d.ts.map +1 -0
- package/dist/shared/utils/common.js +3 -1
- package/dist/shared/utils/common.js.map +1 -1
- package/package.json +12 -13
- package/src/colors/types.ts +0 -2
- package/src/typography/index.ts +1 -64
- package/{dist/typography/index.js → src/typography/utils.ts} +18 -14
- package/dist/chunks/57135e08/types.d.ts +0 -21
- package/dist/colors/theme.cjs.map +0 -1
- package/dist/colors/theme.d.ts +0 -6
- package/dist/colors/theme.js +0 -74
- package/dist/colors/theme.js.map +0 -1
- package/dist/colors/utils.cjs.map +0 -1
- package/dist/colors/utils.d.ts +0 -21
- package/dist/colors/utils.js +0 -47
- package/dist/colors/utils.js.map +0 -1
- package/dist/colors/variables.cjs.map +0 -1
- package/dist/colors/variables.d.ts +0 -32
- package/dist/colors/variables.js +0 -40
- package/dist/colors/variables.js.map +0 -1
- package/dist/index.d.ts +0 -5
- package/dist/index.d.ts.map +0 -1
- package/dist/mediaQuery/const.cjs.map +0 -1
- package/dist/mediaQuery/const.d.ts +0 -3
- package/dist/mediaQuery/const.js.map +0 -1
- package/dist/mediaQuery/index.cjs.map +0 -1
- package/dist/mediaQuery/index.d.ts +0 -10
- package/dist/mediaQuery/index.js +0 -30
- package/dist/mediaQuery/index.js.map +0 -1
- package/dist/typography/const.cjs.map +0 -1
- package/dist/typography/const.js +0 -108
- package/dist/typography/const.js.map +0 -1
- package/dist/typography/index.cjs.map +0 -1
- package/dist/typography/index.js.map +0 -1
- /package/dist/{colors → mixin/src/colors}/theme.cjs +0 -0
- /package/dist/{index.cjs.map → mixin/src/index.cjs.map} +0 -0
- /package/dist/{index.js.map → mixin/src/index.js.map} +0 -0
- /package/dist/{mediaQuery → mixin/src/mediaQuery}/const.cjs +0 -0
- /package/dist/{mediaQuery → mixin/src/mediaQuery}/index.cjs +0 -0
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"const.cjs","sources":["../../../../src/typography/const.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/naming-convention */\n\nconst LEGACY_TYPOGRAPHY_STYLES = {\n Headline2_B: {\n fontSize: 24,\n lineHeight: 34,\n fontWeight: 600,\n },\n Headline3_B: {\n fontSize: 20,\n lineHeight: 26,\n fontWeight: 600,\n },\n Headline4_B: {\n fontSize: 16,\n lineHeight: 26,\n fontWeight: 600,\n },\n Headline4_M: {\n fontSize: 16,\n lineHeight: 26,\n fontWeight: 400,\n },\n Body1_B: {\n fontSize: 14,\n lineHeight: 24,\n fontWeight: 600,\n },\n Body1_M: {\n fontSize: 14,\n lineHeight: 24,\n fontWeight: 400,\n },\n Body2_B: {\n fontSize: 12,\n lineHeight: 19,\n fontWeight: 600,\n },\n Body2_M: {\n fontSize: 12,\n lineHeight: 19,\n fontWeight: 400,\n },\n Caption_B: {\n fontSize: 10,\n lineHeight: 14,\n fontWeight: 600,\n },\n} as const;\n\nexport const TYPOGRAPHY_STYLES = {\n ...LEGACY_TYPOGRAPHY_STYLES,\n Headline: {\n fontSize: 24,\n lineHeight: 34,\n fontWeight: 600,\n },\n Title1: {\n fontSize: 20,\n lineHeight: 26,\n fontWeight: 600,\n },\n Display: {\n fontSize: 20,\n lineHeight: 26,\n fontWeight: 400,\n },\n Title2: {\n fontSize: 16,\n lineHeight: 26,\n fontWeight: 600,\n },\n ArticleBody: {\n fontSize: 16,\n lineHeight: 26,\n fontWeight: 400,\n },\n Subtitle1: {\n fontSize: 14,\n lineHeight: 24,\n fontWeight: 600,\n },\n Body1: {\n fontSize: 14,\n lineHeight: 24,\n fontWeight: 400,\n },\n Subtitle2: {\n fontSize: 12,\n lineHeight: 19,\n fontWeight: 600,\n },\n Body2: {\n fontSize: 12,\n lineHeight: 19,\n fontWeight: 400,\n },\n Caption: {\n fontSize: 10,\n lineHeight: 14,\n fontWeight: 600,\n },\n} as const;\n\n/**\n * {@link https://github.com/orioncactus/pretendard#html-1}\n */\nexport const PRETENDARD_FONT_FAMILY =\n \"Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif\";\n"],"names":["LEGACY_TYPOGRAPHY_STYLES","Headline2_B","fontSize","lineHeight","fontWeight","Headline3_B","Headline4_B","Headline4_M","Body1_B","Body1_M","Body2_B","Body2_M","Caption_B","TYPOGRAPHY_STYLES","_objectSpread","Headline","Title1","Display","Title2","ArticleBody","Subtitle1","Body1","Subtitle2","Body2","Caption","PRETENDARD_FONT_FAMILY"],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
declare const TYPOGRAPHY_STYLES: {
|
|
1
|
+
export declare const TYPOGRAPHY_STYLES: {
|
|
2
2
|
readonly Headline: {
|
|
3
3
|
readonly fontSize: 24;
|
|
4
4
|
readonly lineHeight: 34;
|
|
@@ -98,5 +98,5 @@ declare const TYPOGRAPHY_STYLES: {
|
|
|
98
98
|
/**
|
|
99
99
|
* {@link https://github.com/orioncactus/pretendard#html-1}
|
|
100
100
|
*/
|
|
101
|
-
declare const PRETENDARD_FONT_FAMILY = "Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif";
|
|
102
|
-
|
|
101
|
+
export declare const PRETENDARD_FONT_FAMILY = "Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif";
|
|
102
|
+
//# sourceMappingURL=const.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"const.d.ts","sourceRoot":"","sources":["../../../../src/typography/const.ts"],"names":[],"mappings":"AAkDA,eAAO,MAAM,iBAAiB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoDpB,CAAC;AAEX;;GAEG;AACH,eAAO,MAAM,sBAAsB,iOAC6L,CAAC"}
|
|
@@ -0,0 +1,113 @@
|
|
|
1
|
+
import _defineProperty from '@babel/runtime/helpers/defineProperty';
|
|
2
|
+
|
|
3
|
+
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
|
|
4
|
+
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
|
|
5
|
+
/* eslint-disable @typescript-eslint/naming-convention */
|
|
6
|
+
|
|
7
|
+
var LEGACY_TYPOGRAPHY_STYLES = {
|
|
8
|
+
Headline2_B: {
|
|
9
|
+
fontSize: 24,
|
|
10
|
+
lineHeight: 34,
|
|
11
|
+
fontWeight: 600
|
|
12
|
+
},
|
|
13
|
+
Headline3_B: {
|
|
14
|
+
fontSize: 20,
|
|
15
|
+
lineHeight: 26,
|
|
16
|
+
fontWeight: 600
|
|
17
|
+
},
|
|
18
|
+
Headline4_B: {
|
|
19
|
+
fontSize: 16,
|
|
20
|
+
lineHeight: 26,
|
|
21
|
+
fontWeight: 600
|
|
22
|
+
},
|
|
23
|
+
Headline4_M: {
|
|
24
|
+
fontSize: 16,
|
|
25
|
+
lineHeight: 26,
|
|
26
|
+
fontWeight: 400
|
|
27
|
+
},
|
|
28
|
+
Body1_B: {
|
|
29
|
+
fontSize: 14,
|
|
30
|
+
lineHeight: 24,
|
|
31
|
+
fontWeight: 600
|
|
32
|
+
},
|
|
33
|
+
Body1_M: {
|
|
34
|
+
fontSize: 14,
|
|
35
|
+
lineHeight: 24,
|
|
36
|
+
fontWeight: 400
|
|
37
|
+
},
|
|
38
|
+
Body2_B: {
|
|
39
|
+
fontSize: 12,
|
|
40
|
+
lineHeight: 19,
|
|
41
|
+
fontWeight: 600
|
|
42
|
+
},
|
|
43
|
+
Body2_M: {
|
|
44
|
+
fontSize: 12,
|
|
45
|
+
lineHeight: 19,
|
|
46
|
+
fontWeight: 400
|
|
47
|
+
},
|
|
48
|
+
Caption_B: {
|
|
49
|
+
fontSize: 10,
|
|
50
|
+
lineHeight: 14,
|
|
51
|
+
fontWeight: 600
|
|
52
|
+
}
|
|
53
|
+
};
|
|
54
|
+
var TYPOGRAPHY_STYLES = _objectSpread(_objectSpread({}, LEGACY_TYPOGRAPHY_STYLES), {}, {
|
|
55
|
+
Headline: {
|
|
56
|
+
fontSize: 24,
|
|
57
|
+
lineHeight: 34,
|
|
58
|
+
fontWeight: 600
|
|
59
|
+
},
|
|
60
|
+
Title1: {
|
|
61
|
+
fontSize: 20,
|
|
62
|
+
lineHeight: 26,
|
|
63
|
+
fontWeight: 600
|
|
64
|
+
},
|
|
65
|
+
Display: {
|
|
66
|
+
fontSize: 20,
|
|
67
|
+
lineHeight: 26,
|
|
68
|
+
fontWeight: 400
|
|
69
|
+
},
|
|
70
|
+
Title2: {
|
|
71
|
+
fontSize: 16,
|
|
72
|
+
lineHeight: 26,
|
|
73
|
+
fontWeight: 600
|
|
74
|
+
},
|
|
75
|
+
ArticleBody: {
|
|
76
|
+
fontSize: 16,
|
|
77
|
+
lineHeight: 26,
|
|
78
|
+
fontWeight: 400
|
|
79
|
+
},
|
|
80
|
+
Subtitle1: {
|
|
81
|
+
fontSize: 14,
|
|
82
|
+
lineHeight: 24,
|
|
83
|
+
fontWeight: 600
|
|
84
|
+
},
|
|
85
|
+
Body1: {
|
|
86
|
+
fontSize: 14,
|
|
87
|
+
lineHeight: 24,
|
|
88
|
+
fontWeight: 400
|
|
89
|
+
},
|
|
90
|
+
Subtitle2: {
|
|
91
|
+
fontSize: 12,
|
|
92
|
+
lineHeight: 19,
|
|
93
|
+
fontWeight: 600
|
|
94
|
+
},
|
|
95
|
+
Body2: {
|
|
96
|
+
fontSize: 12,
|
|
97
|
+
lineHeight: 19,
|
|
98
|
+
fontWeight: 400
|
|
99
|
+
},
|
|
100
|
+
Caption: {
|
|
101
|
+
fontSize: 10,
|
|
102
|
+
lineHeight: 14,
|
|
103
|
+
fontWeight: 600
|
|
104
|
+
}
|
|
105
|
+
});
|
|
106
|
+
|
|
107
|
+
/**
|
|
108
|
+
* {@link https://github.com/orioncactus/pretendard#html-1}
|
|
109
|
+
*/
|
|
110
|
+
var PRETENDARD_FONT_FAMILY = "Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif";
|
|
111
|
+
|
|
112
|
+
export { PRETENDARD_FONT_FAMILY, TYPOGRAPHY_STYLES };
|
|
113
|
+
//# sourceMappingURL=const.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"const.js","sources":["../../../../src/typography/const.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/naming-convention */\n\nconst LEGACY_TYPOGRAPHY_STYLES = {\n Headline2_B: {\n fontSize: 24,\n lineHeight: 34,\n fontWeight: 600,\n },\n Headline3_B: {\n fontSize: 20,\n lineHeight: 26,\n fontWeight: 600,\n },\n Headline4_B: {\n fontSize: 16,\n lineHeight: 26,\n fontWeight: 600,\n },\n Headline4_M: {\n fontSize: 16,\n lineHeight: 26,\n fontWeight: 400,\n },\n Body1_B: {\n fontSize: 14,\n lineHeight: 24,\n fontWeight: 600,\n },\n Body1_M: {\n fontSize: 14,\n lineHeight: 24,\n fontWeight: 400,\n },\n Body2_B: {\n fontSize: 12,\n lineHeight: 19,\n fontWeight: 600,\n },\n Body2_M: {\n fontSize: 12,\n lineHeight: 19,\n fontWeight: 400,\n },\n Caption_B: {\n fontSize: 10,\n lineHeight: 14,\n fontWeight: 600,\n },\n} as const;\n\nexport const TYPOGRAPHY_STYLES = {\n ...LEGACY_TYPOGRAPHY_STYLES,\n Headline: {\n fontSize: 24,\n lineHeight: 34,\n fontWeight: 600,\n },\n Title1: {\n fontSize: 20,\n lineHeight: 26,\n fontWeight: 600,\n },\n Display: {\n fontSize: 20,\n lineHeight: 26,\n fontWeight: 400,\n },\n Title2: {\n fontSize: 16,\n lineHeight: 26,\n fontWeight: 600,\n },\n ArticleBody: {\n fontSize: 16,\n lineHeight: 26,\n fontWeight: 400,\n },\n Subtitle1: {\n fontSize: 14,\n lineHeight: 24,\n fontWeight: 600,\n },\n Body1: {\n fontSize: 14,\n lineHeight: 24,\n fontWeight: 400,\n },\n Subtitle2: {\n fontSize: 12,\n lineHeight: 19,\n fontWeight: 600,\n },\n Body2: {\n fontSize: 12,\n lineHeight: 19,\n fontWeight: 400,\n },\n Caption: {\n fontSize: 10,\n lineHeight: 14,\n fontWeight: 600,\n },\n} as const;\n\n/**\n * {@link https://github.com/orioncactus/pretendard#html-1}\n */\nexport const PRETENDARD_FONT_FAMILY =\n \"Pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, 'Helvetica Neue', 'Segoe UI', 'Apple SD Gothic Neo', 'Noto Sans KR', 'Malgun Gothic', 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', sans-serif\";\n"],"names":["LEGACY_TYPOGRAPHY_STYLES","Headline2_B","fontSize","lineHeight","fontWeight","Headline3_B","Headline4_B","Headline4_M","Body1_B","Body1_M","Body2_B","Body2_M","Caption_B","TYPOGRAPHY_STYLES","_objectSpread","Headline","Title1","Display","Title2","ArticleBody","Subtitle1","Body1","Subtitle2","Body2","Caption","PRETENDARD_FONT_FAMILY"],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/typography/index.ts"],"names":[],"mappings":"AAAA,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/typography/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAEjD,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,iBAAiB,CAAC"}
|
|
@@ -21,6 +21,7 @@ var getTypographyStyles = function getTypographyStyles(typographyStyle) {
|
|
|
21
21
|
fontWeight = _TYPOGRAPHY_STYLES$ty.fontWeight;
|
|
22
22
|
return styledComponents.css(_templateObject || (_templateObject = _taggedTemplateLiteral__default.default(["\n font-family: ", ";\n font-size: ", "px;\n line-height: ", "px;\n font-weight: ", ";\n "])), _const.PRETENDARD_FONT_FAMILY, fontSize, lineHeight, fontWeight);
|
|
23
23
|
};
|
|
24
|
+
|
|
24
25
|
/**
|
|
25
26
|
* 말줄임표 표시 (1줄)
|
|
26
27
|
*
|
|
@@ -29,6 +30,7 @@ var getTypographyStyles = function getTypographyStyles(typographyStyle) {
|
|
|
29
30
|
* text-overflow: ellipsis;
|
|
30
31
|
*/
|
|
31
32
|
var textEllipsis = styledComponents.css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral__default.default(["\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n"])));
|
|
33
|
+
|
|
32
34
|
/**
|
|
33
35
|
* 말줄임표 표시
|
|
34
36
|
*
|
|
@@ -52,9 +54,7 @@ var ellipsis = function ellipsis() {
|
|
|
52
54
|
return styledComponents.css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral__default.default(["\n overflow: hidden;\n text-overflow: ellipsis;\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: ", ";\n "])), line);
|
|
53
55
|
};
|
|
54
56
|
|
|
55
|
-
exports.PRETENDARD_FONT_FAMILY = _const.PRETENDARD_FONT_FAMILY;
|
|
56
|
-
exports.TYPOGRAPHY_STYLES = _const.TYPOGRAPHY_STYLES;
|
|
57
57
|
exports.ellipsis = ellipsis;
|
|
58
58
|
exports.getTypographyStyles = getTypographyStyles;
|
|
59
59
|
exports.textEllipsis = textEllipsis;
|
|
60
|
-
//# sourceMappingURL=
|
|
60
|
+
//# sourceMappingURL=utils.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"utils.cjs","sources":["../../../../src/typography/utils.ts"],"sourcesContent":["'use client';\n\nimport { css } from 'styled-components';\n\nimport { PRETENDARD_FONT_FAMILY, TYPOGRAPHY_STYLES } from './const';\nimport type { TypographyStyle } from './types';\n\n/**\n * 해당 스타일명에 해당하는 css 조각을 반환\n * @see TYPOGRAPHY_STYLES\n */\nexport const getTypographyStyles = (typographyStyle: TypographyStyle) => {\n const { fontSize, lineHeight, fontWeight } =\n TYPOGRAPHY_STYLES[typographyStyle];\n return css`\n font-family: ${PRETENDARD_FONT_FAMILY};\n font-size: ${fontSize}px;\n line-height: ${lineHeight}px;\n font-weight: ${fontWeight};\n `;\n};\n\n/**\n * 말줄임표 표시 (1줄)\n *\n * white-space: nowrap; \\\n * overflow: hidden; \\\n * text-overflow: ellipsis;\n */\nexport const textEllipsis = css`\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n`;\n\n/**\n * 말줄임표 표시\n *\n * line = 1 인 경우, \\\n * white-space: nowrap; \\\n * overflow: hidden; \\\n * text-overflow: ellipsis;\n *\n * line > 1 인 경우, \\\n * overflow: hidden; \\\n * text-overflow: ellipsis; \\\n * display: -webkit-box; \\\n * -webkit-box-orient: vertical; \\\n * -webkit-line-clamp: ${line};\n */\nexport const ellipsis = (line = 1) => {\n if (line === 1) {\n return textEllipsis;\n }\n\n return css`\n overflow: hidden;\n text-overflow: ellipsis;\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: ${line};\n `;\n};\n"],"names":[],"mappings":";;;;;;;;;;;AAAa;AAOb;AACA;AACA;AACA;;AAEE;;;;AAEA;AAMF;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACO;;AAMP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACsC;;AAElC;AACF;;AASF;;;;"}
|
|
@@ -1,10 +1,9 @@
|
|
|
1
|
-
import {
|
|
2
|
-
type TypographyStyle = keyof typeof TYPOGRAPHY_STYLES;
|
|
1
|
+
import type { TypographyStyle } from './types';
|
|
3
2
|
/**
|
|
4
3
|
* 해당 스타일명에 해당하는 css 조각을 반환
|
|
5
4
|
* @see TYPOGRAPHY_STYLES
|
|
6
5
|
*/
|
|
7
|
-
declare const getTypographyStyles: (typographyStyle: TypographyStyle) => import("styled-components").RuleSet<object>;
|
|
6
|
+
export declare const getTypographyStyles: (typographyStyle: TypographyStyle) => import("styled-components").RuleSet<object>;
|
|
8
7
|
/**
|
|
9
8
|
* 말줄임표 표시 (1줄)
|
|
10
9
|
*
|
|
@@ -12,7 +11,7 @@ declare const getTypographyStyles: (typographyStyle: TypographyStyle) => import(
|
|
|
12
11
|
* overflow: hidden; \
|
|
13
12
|
* text-overflow: ellipsis;
|
|
14
13
|
*/
|
|
15
|
-
declare const textEllipsis: import("styled-components").RuleSet<object>;
|
|
14
|
+
export declare const textEllipsis: import("styled-components").RuleSet<object>;
|
|
16
15
|
/**
|
|
17
16
|
* 말줄임표 표시
|
|
18
17
|
*
|
|
@@ -28,6 +27,5 @@ declare const textEllipsis: import("styled-components").RuleSet<object>;
|
|
|
28
27
|
* -webkit-box-orient: vertical; \
|
|
29
28
|
* -webkit-line-clamp: ${line};
|
|
30
29
|
*/
|
|
31
|
-
declare const ellipsis: (line?: number) => import("styled-components").RuleSet<object>;
|
|
32
|
-
|
|
33
|
-
export * from "./const.js";
|
|
30
|
+
export declare const ellipsis: (line?: number) => import("styled-components").RuleSet<object>;
|
|
31
|
+
//# sourceMappingURL=utils.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../src/typography/utils.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAE/C;;;GAGG;AACH,eAAO,MAAM,mBAAmB,oBAAqB,eAAe,gDASnE,CAAC;AAEF;;;;;;GAMG;AACH,eAAO,MAAM,YAAY,6CAIxB,CAAC;AAEF;;;;;;;;;;;;;;GAcG;AACH,eAAO,MAAM,QAAQ,gEAYpB,CAAC"}
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import _taggedTemplateLiteral from '@babel/runtime/helpers/taggedTemplateLiteral';
|
|
3
|
+
import { css } from 'styled-components';
|
|
4
|
+
import { TYPOGRAPHY_STYLES, PRETENDARD_FONT_FAMILY } from './const.js';
|
|
5
|
+
|
|
6
|
+
var _templateObject, _templateObject2, _templateObject3;
|
|
7
|
+
/**
|
|
8
|
+
* 해당 스타일명에 해당하는 css 조각을 반환
|
|
9
|
+
* @see TYPOGRAPHY_STYLES
|
|
10
|
+
*/
|
|
11
|
+
var getTypographyStyles = function getTypographyStyles(typographyStyle) {
|
|
12
|
+
var _TYPOGRAPHY_STYLES$ty = TYPOGRAPHY_STYLES[typographyStyle],
|
|
13
|
+
fontSize = _TYPOGRAPHY_STYLES$ty.fontSize,
|
|
14
|
+
lineHeight = _TYPOGRAPHY_STYLES$ty.lineHeight,
|
|
15
|
+
fontWeight = _TYPOGRAPHY_STYLES$ty.fontWeight;
|
|
16
|
+
return css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n font-family: ", ";\n font-size: ", "px;\n line-height: ", "px;\n font-weight: ", ";\n "])), PRETENDARD_FONT_FAMILY, fontSize, lineHeight, fontWeight);
|
|
17
|
+
};
|
|
18
|
+
|
|
19
|
+
/**
|
|
20
|
+
* 말줄임표 표시 (1줄)
|
|
21
|
+
*
|
|
22
|
+
* white-space: nowrap; \
|
|
23
|
+
* overflow: hidden; \
|
|
24
|
+
* text-overflow: ellipsis;
|
|
25
|
+
*/
|
|
26
|
+
var textEllipsis = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n"])));
|
|
27
|
+
|
|
28
|
+
/**
|
|
29
|
+
* 말줄임표 표시
|
|
30
|
+
*
|
|
31
|
+
* line = 1 인 경우, \
|
|
32
|
+
* white-space: nowrap; \
|
|
33
|
+
* overflow: hidden; \
|
|
34
|
+
* text-overflow: ellipsis;
|
|
35
|
+
*
|
|
36
|
+
* line > 1 인 경우, \
|
|
37
|
+
* overflow: hidden; \
|
|
38
|
+
* text-overflow: ellipsis; \
|
|
39
|
+
* display: -webkit-box; \
|
|
40
|
+
* -webkit-box-orient: vertical; \
|
|
41
|
+
* -webkit-line-clamp: ${line};
|
|
42
|
+
*/
|
|
43
|
+
var ellipsis = function ellipsis() {
|
|
44
|
+
var line = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1;
|
|
45
|
+
if (line === 1) {
|
|
46
|
+
return textEllipsis;
|
|
47
|
+
}
|
|
48
|
+
return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n overflow: hidden;\n text-overflow: ellipsis;\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: ", ";\n "])), line);
|
|
49
|
+
};
|
|
50
|
+
|
|
51
|
+
export { ellipsis, getTypographyStyles, textEllipsis };
|
|
52
|
+
//# sourceMappingURL=utils.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"utils.js","sources":["../../../../src/typography/utils.ts"],"sourcesContent":["'use client';\n\nimport { css } from 'styled-components';\n\nimport { PRETENDARD_FONT_FAMILY, TYPOGRAPHY_STYLES } from './const';\nimport type { TypographyStyle } from './types';\n\n/**\n * 해당 스타일명에 해당하는 css 조각을 반환\n * @see TYPOGRAPHY_STYLES\n */\nexport const getTypographyStyles = (typographyStyle: TypographyStyle) => {\n const { fontSize, lineHeight, fontWeight } =\n TYPOGRAPHY_STYLES[typographyStyle];\n return css`\n font-family: ${PRETENDARD_FONT_FAMILY};\n font-size: ${fontSize}px;\n line-height: ${lineHeight}px;\n font-weight: ${fontWeight};\n `;\n};\n\n/**\n * 말줄임표 표시 (1줄)\n *\n * white-space: nowrap; \\\n * overflow: hidden; \\\n * text-overflow: ellipsis;\n */\nexport const textEllipsis = css`\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n`;\n\n/**\n * 말줄임표 표시\n *\n * line = 1 인 경우, \\\n * white-space: nowrap; \\\n * overflow: hidden; \\\n * text-overflow: ellipsis;\n *\n * line > 1 인 경우, \\\n * overflow: hidden; \\\n * text-overflow: ellipsis; \\\n * display: -webkit-box; \\\n * -webkit-box-orient: vertical; \\\n * -webkit-line-clamp: ${line};\n */\nexport const ellipsis = (line = 1) => {\n if (line === 1) {\n return textEllipsis;\n }\n\n return css`\n overflow: hidden;\n text-overflow: ellipsis;\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: ${line};\n `;\n};\n"],"names":[],"mappings":";;;;;AAAa;AAOb;AACA;AACA;AACA;;AAEE;;;;AAEA;AAMF;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACO;;AAMP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACsC;;AAElC;AACF;;AASF;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"common.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"common.cjs","sources":["../../../../shared/utils/common.ts"],"sourcesContent":["export const range = (start: number, end: number) => {\n if (end < start) {\n return []; // 유효하지 않은 입력값 처리\n }\n return Array(end - start + 1)\n .fill(0)\n .map((_, idx) => start + idx);\n};\nexport const isSSR = () => typeof window === 'undefined';\n"],"names":["isSSR","window"],"mappings":";;AAQaA,IAAAA,KAAK,GAAG,SAARA,KAAKA,GAAA;EAAA,OAAS,OAAOC,MAAM,KAAK,WAAW,CAAA;AAAA;;;;"}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
declare const range: (start: number, end: number) => number[];
|
|
2
|
-
declare const isSSR: () => boolean;
|
|
3
|
-
|
|
1
|
+
export declare const range: (start: number, end: number) => number[];
|
|
2
|
+
export declare const isSSR: () => boolean;
|
|
3
|
+
//# sourceMappingURL=common.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"common.d.ts","sourceRoot":"","sources":["../../../../shared/utils/common.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,KAAK,UAAW,MAAM,OAAO,MAAM,aAO/C,CAAC;AACF,eAAO,MAAM,KAAK,eAAsC,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"common.js","sources":["../../../../shared/utils/common.ts"],"sourcesContent":["export const range = (start: number, end: number) => {\n if (end < start) {\n return []; // 유효하지 않은 입력값 처리\n }\n return Array(end - start + 1)\n .fill(0)\n .map((_, idx) => start + idx);\n};\nexport const isSSR = () => typeof window === 'undefined';\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"common.js","sources":["../../../../shared/utils/common.ts"],"sourcesContent":["export const range = (start: number, end: number) => {\n if (end < start) {\n return []; // 유효하지 않은 입력값 처리\n }\n return Array(end - start + 1)\n .fill(0)\n .map((_, idx) => start + idx);\n};\nexport const isSSR = () => typeof window === 'undefined';\n"],"names":["isSSR","window"],"mappings":"AAQaA,IAAAA,KAAK,GAAG,SAARA,KAAKA,GAAA;EAAA,OAAS,OAAOC,MAAM,KAAK,WAAW,CAAA;AAAA;;;;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@remember-web/mixin",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.2",
|
|
4
4
|
"description": "RUI Mixin",
|
|
5
5
|
"homepage": "https://dramancompany.github.io/rui/",
|
|
6
6
|
"author": "Remember",
|
|
@@ -15,7 +15,9 @@
|
|
|
15
15
|
},
|
|
16
16
|
"scripts": {
|
|
17
17
|
"build": "rollup -c && yarn fix:dts-alias",
|
|
18
|
-
"fix:dts-alias": "yarn tsc-alias -p tsconfig.alias.json"
|
|
18
|
+
"fix:dts-alias": "yarn tsc-alias -p tsconfig.alias.json",
|
|
19
|
+
"type-check": "tsc -p ./tsconfig.json",
|
|
20
|
+
"lint": "eslint src --fix --ext .js,.jsx,.ts,.tsx"
|
|
19
21
|
},
|
|
20
22
|
"files": [
|
|
21
23
|
"dist",
|
|
@@ -23,14 +25,14 @@
|
|
|
23
25
|
],
|
|
24
26
|
"type": "module",
|
|
25
27
|
"source": "./src/index.ts",
|
|
26
|
-
"main": "./dist/index.cjs",
|
|
27
|
-
"module": "./dist/index.js",
|
|
28
|
-
"types": "./dist/index.d.ts",
|
|
28
|
+
"main": "./dist/mixin/src/index.cjs",
|
|
29
|
+
"module": "./dist/mixin/src/index.js",
|
|
30
|
+
"types": "./dist/mixin/src/index.d.ts",
|
|
29
31
|
"exports": {
|
|
30
32
|
".": {
|
|
31
|
-
"import": "./dist/index.js",
|
|
32
|
-
"require": "./dist/index.cjs",
|
|
33
|
-
"types": "./dist/index.d.ts"
|
|
33
|
+
"import": "./dist/mixin/src/index.js",
|
|
34
|
+
"require": "./dist/mixin/src/index.cjs",
|
|
35
|
+
"types": "./dist/mixin/src/index.d.ts"
|
|
34
36
|
}
|
|
35
37
|
},
|
|
36
38
|
"dependencies": {
|
|
@@ -41,27 +43,24 @@
|
|
|
41
43
|
"@babel/plugin-transform-runtime": "^7.19.6",
|
|
42
44
|
"@babel/preset-env": "^7.22.9",
|
|
43
45
|
"@babel/preset-typescript": "^7.22.5",
|
|
46
|
+
"@remember-web/shared": "workspace:^",
|
|
44
47
|
"@rollup/plugin-babel": "^6.0.4",
|
|
45
48
|
"@rollup/plugin-commonjs": "^25.0.7",
|
|
46
49
|
"@rollup/plugin-node-resolve": "^15.0.1",
|
|
47
50
|
"@rollup/plugin-terser": "^0.4.0",
|
|
48
|
-
"@svgr/rollup": "^6.5.1",
|
|
49
51
|
"eslint-config-rui": "workspace:*",
|
|
50
52
|
"rollup": "^4.13.0",
|
|
51
53
|
"rollup-plugin-copy": "^3.4.0",
|
|
52
54
|
"rollup-plugin-delete": "^2.0.0",
|
|
53
|
-
"rollup-plugin-dts": "^6.1.0",
|
|
54
55
|
"rollup-plugin-generate-package-json": "^3.2.0",
|
|
55
56
|
"rollup-plugin-peer-deps-external": "^2.2.4",
|
|
56
57
|
"rollup-plugin-preserve-directives": "^0.4.0",
|
|
57
|
-
"rollup-plugin-ts": "^3.4.5",
|
|
58
58
|
"rollup-plugin-typescript2": "^0.36.0",
|
|
59
59
|
"rollup-plugin-visualizer": "^5.9.0",
|
|
60
60
|
"styled-components": ">=6",
|
|
61
61
|
"tsc-alias": "^1.8.8",
|
|
62
62
|
"tsconfig": "workspace:*",
|
|
63
|
-
"typescript": "^5.4.3"
|
|
64
|
-
"@remember-web/shared": "workspace:^"
|
|
63
|
+
"typescript": "^5.4.3"
|
|
65
64
|
},
|
|
66
65
|
"peerDependencies": {
|
|
67
66
|
"styled-components": ">=6"
|
package/src/colors/types.ts
CHANGED
package/src/typography/index.ts
CHANGED
|
@@ -1,66 +1,3 @@
|
|
|
1
|
-
'use client';
|
|
2
|
-
|
|
3
|
-
import { css } from 'styled-components';
|
|
4
|
-
|
|
5
|
-
import { PRETENDARD_FONT_FAMILY, TYPOGRAPHY_STYLES } from './const';
|
|
6
|
-
import type { TypographyStyle } from './types';
|
|
7
|
-
|
|
8
1
|
export * from './const';
|
|
9
2
|
export * from './types';
|
|
10
|
-
|
|
11
|
-
/**
|
|
12
|
-
* 해당 스타일명에 해당하는 css 조각을 반환
|
|
13
|
-
* @see TYPOGRAPHY_STYLES
|
|
14
|
-
*/
|
|
15
|
-
export const getTypographyStyles = (typographyStyle: TypographyStyle) => {
|
|
16
|
-
const { fontSize, lineHeight, fontWeight } =
|
|
17
|
-
TYPOGRAPHY_STYLES[typographyStyle];
|
|
18
|
-
return css`
|
|
19
|
-
font-family: ${PRETENDARD_FONT_FAMILY};
|
|
20
|
-
font-size: ${fontSize}px;
|
|
21
|
-
line-height: ${lineHeight}px;
|
|
22
|
-
font-weight: ${fontWeight};
|
|
23
|
-
`;
|
|
24
|
-
};
|
|
25
|
-
|
|
26
|
-
/**
|
|
27
|
-
* 말줄임표 표시 (1줄)
|
|
28
|
-
*
|
|
29
|
-
* white-space: nowrap; \
|
|
30
|
-
* overflow: hidden; \
|
|
31
|
-
* text-overflow: ellipsis;
|
|
32
|
-
*/
|
|
33
|
-
export const textEllipsis = css`
|
|
34
|
-
white-space: nowrap;
|
|
35
|
-
overflow: hidden;
|
|
36
|
-
text-overflow: ellipsis;
|
|
37
|
-
`;
|
|
38
|
-
|
|
39
|
-
/**
|
|
40
|
-
* 말줄임표 표시
|
|
41
|
-
*
|
|
42
|
-
* line = 1 인 경우, \
|
|
43
|
-
* white-space: nowrap; \
|
|
44
|
-
* overflow: hidden; \
|
|
45
|
-
* text-overflow: ellipsis;
|
|
46
|
-
*
|
|
47
|
-
* line > 1 인 경우, \
|
|
48
|
-
* overflow: hidden; \
|
|
49
|
-
* text-overflow: ellipsis; \
|
|
50
|
-
* display: -webkit-box; \
|
|
51
|
-
* -webkit-box-orient: vertical; \
|
|
52
|
-
* -webkit-line-clamp: ${line};
|
|
53
|
-
*/
|
|
54
|
-
export const ellipsis = (line = 1) => {
|
|
55
|
-
if (line === 1) {
|
|
56
|
-
return textEllipsis;
|
|
57
|
-
}
|
|
58
|
-
|
|
59
|
-
return css`
|
|
60
|
-
overflow: hidden;
|
|
61
|
-
text-overflow: ellipsis;
|
|
62
|
-
display: -webkit-box;
|
|
63
|
-
-webkit-box-orient: vertical;
|
|
64
|
-
-webkit-line-clamp: ${line};
|
|
65
|
-
`;
|
|
66
|
-
};
|
|
3
|
+
export * from './utils';
|
|
@@ -1,20 +1,25 @@
|
|
|
1
|
-
|
|
1
|
+
'use client';
|
|
2
|
+
|
|
2
3
|
import { css } from 'styled-components';
|
|
3
|
-
|
|
4
|
+
|
|
5
|
+
import { PRETENDARD_FONT_FAMILY, TYPOGRAPHY_STYLES } from './const';
|
|
6
|
+
import type { TypographyStyle } from './types';
|
|
4
7
|
|
|
5
8
|
/**
|
|
6
9
|
* 해당 스타일명에 해당하는 css 조각을 반환
|
|
7
10
|
* @see TYPOGRAPHY_STYLES
|
|
8
11
|
*/
|
|
9
|
-
const getTypographyStyles = (typographyStyle) => {
|
|
10
|
-
|
|
11
|
-
|
|
12
|
+
export const getTypographyStyles = (typographyStyle: TypographyStyle) => {
|
|
13
|
+
const { fontSize, lineHeight, fontWeight } =
|
|
14
|
+
TYPOGRAPHY_STYLES[typographyStyle];
|
|
15
|
+
return css`
|
|
12
16
|
font-family: ${PRETENDARD_FONT_FAMILY};
|
|
13
17
|
font-size: ${fontSize}px;
|
|
14
18
|
line-height: ${lineHeight}px;
|
|
15
19
|
font-weight: ${fontWeight};
|
|
16
20
|
`;
|
|
17
21
|
};
|
|
22
|
+
|
|
18
23
|
/**
|
|
19
24
|
* 말줄임표 표시 (1줄)
|
|
20
25
|
*
|
|
@@ -22,11 +27,12 @@ const getTypographyStyles = (typographyStyle) => {
|
|
|
22
27
|
* overflow: hidden; \
|
|
23
28
|
* text-overflow: ellipsis;
|
|
24
29
|
*/
|
|
25
|
-
const textEllipsis = css
|
|
30
|
+
export const textEllipsis = css`
|
|
26
31
|
white-space: nowrap;
|
|
27
32
|
overflow: hidden;
|
|
28
33
|
text-overflow: ellipsis;
|
|
29
34
|
`;
|
|
35
|
+
|
|
30
36
|
/**
|
|
31
37
|
* 말줄임표 표시
|
|
32
38
|
*
|
|
@@ -42,11 +48,12 @@ const textEllipsis = css `
|
|
|
42
48
|
* -webkit-box-orient: vertical; \
|
|
43
49
|
* -webkit-line-clamp: ${line};
|
|
44
50
|
*/
|
|
45
|
-
const ellipsis = (line = 1) => {
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
51
|
+
export const ellipsis = (line = 1) => {
|
|
52
|
+
if (line === 1) {
|
|
53
|
+
return textEllipsis;
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
return css`
|
|
50
57
|
overflow: hidden;
|
|
51
58
|
text-overflow: ellipsis;
|
|
52
59
|
display: -webkit-box;
|
|
@@ -54,6 +61,3 @@ const ellipsis = (line = 1) => {
|
|
|
54
61
|
-webkit-line-clamp: ${line};
|
|
55
62
|
`;
|
|
56
63
|
};
|
|
57
|
-
|
|
58
|
-
export { PRETENDARD_FONT_FAMILY, TYPOGRAPHY_STYLES, ellipsis, getTypographyStyles, textEllipsis };
|
|
59
|
-
//# sourceMappingURL=index.js.map
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
type GetVariableName<C> = C extends `var(${infer R})` ? R : never;
|
|
2
|
-
type ThemeType = 'light' | 'dark';
|
|
3
|
-
/**
|
|
4
|
-
* Variable = CSS변수로 사용되는 명칭
|
|
5
|
-
* VariableName = CSS변수로 사용되는 명칭에서 `var()`를 제거한 실제명칭
|
|
6
|
-
*/
|
|
7
|
-
type ColorVariable<V extends string = string> = `var(--rui-${V})`;
|
|
8
|
-
type ColorVariableName<V extends string = string> = GetVariableName<ColorVariable<V>>;
|
|
9
|
-
type ColorSet = Record<ColorVariableName, string>;
|
|
10
|
-
type RUIColorType = typeof import("../../colors/variables.js");
|
|
11
|
-
type RUIColorName = keyof RUIColorType;
|
|
12
|
-
type RUIColorVariable = RUIColorType[RUIColorName];
|
|
13
|
-
type RUIColorVariableName = GetVariableName<RUIColorVariable>;
|
|
14
|
-
type RUIColorSet = Record<RUIColorVariableName, string>;
|
|
15
|
-
type ColorThemeType = {
|
|
16
|
-
[key in ThemeType]: ColorSet;
|
|
17
|
-
};
|
|
18
|
-
type RUIColorThemeType = {
|
|
19
|
-
[key in ThemeType]: RUIColorSet;
|
|
20
|
-
};
|
|
21
|
-
export { GetVariableName, ThemeType, ColorVariable, ColorVariableName, ColorSet, RUIColorType, RUIColorName, RUIColorVariable, RUIColorVariableName, RUIColorSet, ColorThemeType, RUIColorThemeType };
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"theme.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
package/dist/colors/theme.d.ts
DELETED
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
import { RUIColorThemeType } from "../chunks/57135e08/types.js";
|
|
2
|
-
/**
|
|
3
|
-
* {@link https://www.figma.com/file/2qQ5eJPRTiAKyz6Q1IzfMJ/WEB?node-id=2570%3A12136&viewport=347%2C475%2C0.47}
|
|
4
|
-
*/
|
|
5
|
-
declare const RUI_COLOR_THEME: RUIColorThemeType;
|
|
6
|
-
export { RUI_COLOR_THEME };
|