@remember-web/mixin 0.1.0 → 0.1.1
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.d.ts +3 -3
- package/dist/shared/utils/common.d.ts.map +1 -0
- package/package.json +13 -14
- 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/shared/utils/common.cjs +0 -8
- package/dist/shared/utils/common.cjs.map +0 -1
- package/dist/shared/utils/common.js +0 -4
- package/dist/shared/utils/common.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,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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@remember-web/mixin",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.1",
|
|
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,18 +25,19 @@
|
|
|
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": {
|
|
37
|
-
"@babel/runtime": "^7"
|
|
39
|
+
"@babel/runtime": "^7",
|
|
40
|
+
"@remember-web/shared": "workspace:^"
|
|
38
41
|
},
|
|
39
42
|
"devDependencies": {
|
|
40
43
|
"@babel/core": "^7.20.12",
|
|
@@ -45,23 +48,19 @@
|
|
|
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 };
|
package/dist/colors/theme.js
DELETED
|
@@ -1,74 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* {@link https://www.figma.com/file/2qQ5eJPRTiAKyz6Q1IzfMJ/WEB?node-id=2570%3A12136&viewport=347%2C475%2C0.47}
|
|
3
|
-
*/
|
|
4
|
-
const RUI_COLOR_THEME = {
|
|
5
|
-
light: {
|
|
6
|
-
'--rui-primary100': '#000000',
|
|
7
|
-
'--rui-primary200': '#FFFFFF',
|
|
8
|
-
'--rui-secondary100': '#FF6A0D',
|
|
9
|
-
'--rui-contents000': '#000000',
|
|
10
|
-
'--rui-contents100': '#424242',
|
|
11
|
-
'--rui-contents150': '#808080',
|
|
12
|
-
'--rui-contents200': '#BDBDBD',
|
|
13
|
-
'--rui-contents300': '#D4D4D4',
|
|
14
|
-
'--rui-contents999': '#FFFFFF',
|
|
15
|
-
'--rui-disabled': '#D4D4D4',
|
|
16
|
-
'--rui-disabled-role-red': '#F7ABAB',
|
|
17
|
-
'--rui-disabled-secondary': '#FFE3D1',
|
|
18
|
-
'--rui-role-red': '#ED4E4E',
|
|
19
|
-
'--rui-role-yellow': '#EDC84E',
|
|
20
|
-
'--rui-role-blue': '#2679ED',
|
|
21
|
-
'--rui-role-green': '#21C798',
|
|
22
|
-
'--rui-bg100': '#FFFFFF',
|
|
23
|
-
'--rui-bg200': '#FAFAFA',
|
|
24
|
-
'--rui-bg300': '#F2F2F2',
|
|
25
|
-
'--rui-bg-modal100': '#FFFFFF',
|
|
26
|
-
'--rui-bg-modal200': '#FAFAFA',
|
|
27
|
-
'--rui-bg-role-red': '#FFF5F5',
|
|
28
|
-
'--rui-bg-secondary100': '#FFF4ED',
|
|
29
|
-
'--rui-bg-highlight': '#FCF5DC',
|
|
30
|
-
'--rui-bg-role-yellow': '#FFFDF5',
|
|
31
|
-
'--rui-bg-role-blue': '#EDF4FF',
|
|
32
|
-
'--rui-bg-role-green': '#D9FCF2',
|
|
33
|
-
'--rui-divider': '#D4D4D4',
|
|
34
|
-
'--rui-fixed-white': '#FFFFFF',
|
|
35
|
-
'--rui-fixed-black': '#000000',
|
|
36
|
-
'--rui-fixed-bg-white': '#FFFFFF',
|
|
37
|
-
},
|
|
38
|
-
dark: {
|
|
39
|
-
'--rui-primary100': '#FFFFFF',
|
|
40
|
-
'--rui-primary200': '#000000',
|
|
41
|
-
'--rui-secondary100': '#FF6A0D',
|
|
42
|
-
'--rui-contents000': '#FFFFFF',
|
|
43
|
-
'--rui-contents100': '#EBEBEB',
|
|
44
|
-
'--rui-contents150': '#D4D4D4',
|
|
45
|
-
'--rui-contents200': '#BDBDBD',
|
|
46
|
-
'--rui-contents300': '#808080',
|
|
47
|
-
'--rui-contents999': '#000000',
|
|
48
|
-
'--rui-disabled': '#808080',
|
|
49
|
-
'--rui-disabled-role-red': '#6B2424',
|
|
50
|
-
'--rui-disabled-secondary': '#4D2A14',
|
|
51
|
-
'--rui-role-red': '#D13636',
|
|
52
|
-
'--rui-role-yellow': '#D1AD36',
|
|
53
|
-
'--rui-role-blue': '#085DD4',
|
|
54
|
-
'--rui-role-green': '#22B28A',
|
|
55
|
-
'--rui-bg100': '#1A1A1A',
|
|
56
|
-
'--rui-bg200': '#000000',
|
|
57
|
-
'--rui-bg300': '#000000',
|
|
58
|
-
'--rui-bg-modal100': '#2E2E2E',
|
|
59
|
-
'--rui-bg-modal200': '#424242',
|
|
60
|
-
'--rui-bg-role-red': '#381515',
|
|
61
|
-
'--rui-bg-secondary100': '#331D0F',
|
|
62
|
-
'--rui-bg-highlight': '#383015',
|
|
63
|
-
'--rui-bg-role-yellow': '#383015',
|
|
64
|
-
'--rui-bg-role-blue': '#002861',
|
|
65
|
-
'--rui-bg-role-green': '#15382E',
|
|
66
|
-
'--rui-divider': '#424242',
|
|
67
|
-
'--rui-fixed-white': '#FFFFFF',
|
|
68
|
-
'--rui-fixed-black': '#000000',
|
|
69
|
-
'--rui-fixed-bg-white': '#FFFFFF',
|
|
70
|
-
},
|
|
71
|
-
};
|
|
72
|
-
|
|
73
|
-
export { RUI_COLOR_THEME };
|
|
74
|
-
//# sourceMappingURL=theme.js.map
|