@charcoal-ui/theme 2.5.0 → 2.7.0
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/abstract-theme.d.ts +51 -51
- package/dist/abstract-theme.d.ts.map +1 -1
- package/dist/default.d.ts +3 -3
- package/dist/index.cjs.js +187 -0
- package/dist/index.cjs.js.map +1 -0
- package/dist/index.d.ts +3 -3
- package/dist/index.esm.js +166 -0
- package/dist/index.esm.js.map +1 -0
- package/dist/theme.d.ts +89 -89
- package/dist/theme.d.ts.map +1 -1
- package/package.json +18 -17
- package/dist/index.cjs +0 -184
- package/dist/index.cjs.map +0 -1
- package/dist/index.modern.js +0 -183
- package/dist/index.modern.js.map +0 -1
- package/dist/index.module.js +0 -183
- package/dist/index.module.js.map +0 -1
package/dist/theme.d.ts
CHANGED
|
@@ -1,90 +1,90 @@
|
|
|
1
|
-
import { type GradientMaterial, type Material, type TypographyDescriptor, type Effect, type OpacityEffect, SPACING, BORDER_RADIUS } from '@charcoal-ui/foundation';
|
|
2
|
-
import { CharcoalAbstractTheme } from './abstract-theme';
|
|
3
|
-
export interface CharcoalTheme extends CharcoalAbstractTheme {
|
|
4
|
-
readonly color: ThemeColor;
|
|
5
|
-
readonly gradientColor: ThemeColorGradient;
|
|
6
|
-
/**
|
|
7
|
-
* effect for color (background or font color)
|
|
8
|
-
*/
|
|
9
|
-
readonly effect: ThemeEffect;
|
|
10
|
-
/**
|
|
11
|
-
* effect for element its own (opacify element includes descendants)
|
|
12
|
-
*/
|
|
13
|
-
readonly elementEffect: ThemeElementEffect;
|
|
14
|
-
readonly spacing: Spacing;
|
|
15
|
-
readonly typography: {
|
|
16
|
-
readonly size: Typography;
|
|
17
|
-
};
|
|
18
|
-
readonly borderRadius: BorderRadius;
|
|
19
|
-
readonly border: {
|
|
20
|
-
readonly default: {
|
|
21
|
-
readonly color: Material;
|
|
22
|
-
};
|
|
23
|
-
};
|
|
24
|
-
readonly outline: {
|
|
25
|
-
readonly default: {
|
|
26
|
-
readonly color: string;
|
|
27
|
-
readonly weight: 4;
|
|
28
|
-
};
|
|
29
|
-
readonly assertive: {
|
|
30
|
-
readonly color: string;
|
|
31
|
-
readonly weight: 4;
|
|
32
|
-
};
|
|
33
|
-
};
|
|
34
|
-
readonly breakpoint: Breakpoint;
|
|
35
|
-
}
|
|
36
|
-
export
|
|
37
|
-
readonly transparent: Material;
|
|
38
|
-
readonly background1: Material;
|
|
39
|
-
readonly background2: Material;
|
|
40
|
-
readonly surface1: Material;
|
|
41
|
-
readonly surface2: Material;
|
|
42
|
-
readonly surface3: Material;
|
|
43
|
-
readonly surface4: Material;
|
|
44
|
-
readonly surface6: Material;
|
|
45
|
-
readonly surface7: Material;
|
|
46
|
-
readonly surface8: Material;
|
|
47
|
-
readonly surface9: Material;
|
|
48
|
-
readonly surface10: Material;
|
|
49
|
-
readonly link1: Material;
|
|
50
|
-
readonly link2: Material;
|
|
51
|
-
readonly text1: Material;
|
|
52
|
-
readonly text2: Material;
|
|
53
|
-
readonly text3: Material;
|
|
54
|
-
readonly text4: Material;
|
|
55
|
-
readonly text5: Material;
|
|
56
|
-
readonly icon6: Material;
|
|
57
|
-
readonly brand: Material;
|
|
58
|
-
readonly assertive: Material;
|
|
59
|
-
readonly warning: Material;
|
|
60
|
-
readonly success: Material;
|
|
61
|
-
readonly updatedItem: Material;
|
|
62
|
-
readonly border: Material;
|
|
63
|
-
};
|
|
64
|
-
export
|
|
65
|
-
readonly hover: Effect;
|
|
66
|
-
readonly press: Effect;
|
|
67
|
-
};
|
|
68
|
-
export
|
|
69
|
-
readonly disabled: OpacityEffect;
|
|
70
|
-
};
|
|
71
|
-
export
|
|
72
|
-
readonly surface5: GradientMaterial;
|
|
73
|
-
readonly callToAction: GradientMaterial;
|
|
74
|
-
};
|
|
75
|
-
export
|
|
76
|
-
readonly [12]: TypographyDescriptor;
|
|
77
|
-
readonly [14]: TypographyDescriptor;
|
|
78
|
-
readonly [16]: TypographyDescriptor;
|
|
79
|
-
readonly [20]: TypographyDescriptor;
|
|
80
|
-
readonly [32]: TypographyDescriptor;
|
|
81
|
-
};
|
|
82
|
-
export
|
|
83
|
-
readonly screen1: number;
|
|
84
|
-
readonly screen2: number;
|
|
85
|
-
readonly screen3: number;
|
|
86
|
-
readonly screen4: number;
|
|
87
|
-
};
|
|
88
|
-
export
|
|
89
|
-
export
|
|
1
|
+
import { type GradientMaterial, type Material, type TypographyDescriptor, type Effect, type OpacityEffect, SPACING, BORDER_RADIUS } from '@charcoal-ui/foundation';
|
|
2
|
+
import { CharcoalAbstractTheme } from './abstract-theme';
|
|
3
|
+
export interface CharcoalTheme extends CharcoalAbstractTheme {
|
|
4
|
+
readonly color: ThemeColor;
|
|
5
|
+
readonly gradientColor: ThemeColorGradient;
|
|
6
|
+
/**
|
|
7
|
+
* effect for color (background or font color)
|
|
8
|
+
*/
|
|
9
|
+
readonly effect: ThemeEffect;
|
|
10
|
+
/**
|
|
11
|
+
* effect for element its own (opacify element includes descendants)
|
|
12
|
+
*/
|
|
13
|
+
readonly elementEffect: ThemeElementEffect;
|
|
14
|
+
readonly spacing: Spacing;
|
|
15
|
+
readonly typography: {
|
|
16
|
+
readonly size: Typography;
|
|
17
|
+
};
|
|
18
|
+
readonly borderRadius: BorderRadius;
|
|
19
|
+
readonly border: {
|
|
20
|
+
readonly default: {
|
|
21
|
+
readonly color: Material;
|
|
22
|
+
};
|
|
23
|
+
};
|
|
24
|
+
readonly outline: {
|
|
25
|
+
readonly default: {
|
|
26
|
+
readonly color: string;
|
|
27
|
+
readonly weight: 4;
|
|
28
|
+
};
|
|
29
|
+
readonly assertive: {
|
|
30
|
+
readonly color: string;
|
|
31
|
+
readonly weight: 4;
|
|
32
|
+
};
|
|
33
|
+
};
|
|
34
|
+
readonly breakpoint: Breakpoint;
|
|
35
|
+
}
|
|
36
|
+
export type ThemeColor = {
|
|
37
|
+
readonly transparent: Material;
|
|
38
|
+
readonly background1: Material;
|
|
39
|
+
readonly background2: Material;
|
|
40
|
+
readonly surface1: Material;
|
|
41
|
+
readonly surface2: Material;
|
|
42
|
+
readonly surface3: Material;
|
|
43
|
+
readonly surface4: Material;
|
|
44
|
+
readonly surface6: Material;
|
|
45
|
+
readonly surface7: Material;
|
|
46
|
+
readonly surface8: Material;
|
|
47
|
+
readonly surface9: Material;
|
|
48
|
+
readonly surface10: Material;
|
|
49
|
+
readonly link1: Material;
|
|
50
|
+
readonly link2: Material;
|
|
51
|
+
readonly text1: Material;
|
|
52
|
+
readonly text2: Material;
|
|
53
|
+
readonly text3: Material;
|
|
54
|
+
readonly text4: Material;
|
|
55
|
+
readonly text5: Material;
|
|
56
|
+
readonly icon6: Material;
|
|
57
|
+
readonly brand: Material;
|
|
58
|
+
readonly assertive: Material;
|
|
59
|
+
readonly warning: Material;
|
|
60
|
+
readonly success: Material;
|
|
61
|
+
readonly updatedItem: Material;
|
|
62
|
+
readonly border: Material;
|
|
63
|
+
};
|
|
64
|
+
export type ThemeEffect = {
|
|
65
|
+
readonly hover: Effect;
|
|
66
|
+
readonly press: Effect;
|
|
67
|
+
};
|
|
68
|
+
export type ThemeElementEffect = {
|
|
69
|
+
readonly disabled: OpacityEffect;
|
|
70
|
+
};
|
|
71
|
+
export type ThemeColorGradient = {
|
|
72
|
+
readonly surface5: GradientMaterial;
|
|
73
|
+
readonly callToAction: GradientMaterial;
|
|
74
|
+
};
|
|
75
|
+
export type Typography = {
|
|
76
|
+
readonly [12]: TypographyDescriptor;
|
|
77
|
+
readonly [14]: TypographyDescriptor;
|
|
78
|
+
readonly [16]: TypographyDescriptor;
|
|
79
|
+
readonly [20]: TypographyDescriptor;
|
|
80
|
+
readonly [32]: TypographyDescriptor;
|
|
81
|
+
};
|
|
82
|
+
export type Breakpoint = {
|
|
83
|
+
readonly screen1: number;
|
|
84
|
+
readonly screen2: number;
|
|
85
|
+
readonly screen3: number;
|
|
86
|
+
readonly screen4: number;
|
|
87
|
+
};
|
|
88
|
+
export type Spacing = Readonly<Record<keyof typeof SPACING, number>>;
|
|
89
|
+
export type BorderRadius = Readonly<Record<keyof typeof BORDER_RADIUS, number>>;
|
|
90
90
|
//# sourceMappingURL=theme.d.ts.map
|
package/dist/theme.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../src/theme.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,gBAAgB,EACrB,KAAK,QAAQ,EACb,KAAK,oBAAoB,EACzB,KAAK,MAAM,EACX,KAAK,aAAa,EAClB,OAAO,EACP,aAAa,EACd,MAAM,yBAAyB,CAAA;AAChC,OAAO,EAAE,qBAAqB,EAAE,MAAM,kBAAkB,CAAA;AAExD,MAAM,WAAW,aAAc,SAAQ,qBAAqB;IAC1D,QAAQ,CAAC,KAAK,EAAE,UAAU,CAAA;IAC1B,QAAQ,CAAC,aAAa,EAAE,kBAAkB,CAAA;IAC1C;;OAEG;IACH,QAAQ,CAAC,MAAM,EAAE,WAAW,CAAA;IAC5B;;OAEG;IACH,QAAQ,CAAC,aAAa,EAAE,kBAAkB,CAAA;IAC1C,QAAQ,CAAC,OAAO,EAAE,OAAO,CAAA;IACzB,QAAQ,CAAC,UAAU,EAAE;QACnB,QAAQ,CAAC,IAAI,EAAE,UAAU,CAAA;KAC1B,CAAA;IACD,QAAQ,CAAC,YAAY,EAAE,YAAY,CAAA;IACnC,QAAQ,CAAC,MAAM,EAAE;QACf,QAAQ,CAAC,OAAO,EAAE;YAChB,QAAQ,CAAC,KAAK,EAAE,QAAQ,CAAA;SACzB,CAAA;KACF,CAAA;IACD,QAAQ,CAAC,OAAO,EAAE;QAChB,QAAQ,CAAC,OAAO,EAAE;YAChB,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAA;YACtB,QAAQ,CAAC,MAAM,EAAE,CAAC,CAAA;SACnB,CAAA;QACD,QAAQ,CAAC,SAAS,EAAE;YAClB,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAA;YACtB,QAAQ,CAAC,MAAM,EAAE,CAAC,CAAA;SACnB,CAAA;KACF,CAAA;IACD,QAAQ,CAAC,UAAU,EAAE,UAAU,CAAA;CAChC;AAED,
|
|
1
|
+
{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../src/theme.ts"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,33 +1,34 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@charcoal-ui/theme",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.7.0",
|
|
4
4
|
"license": "Apache-2.0",
|
|
5
|
-
"
|
|
6
|
-
"
|
|
7
|
-
"main": "./dist/index.cjs",
|
|
8
|
-
"module": "./dist/index.module.js",
|
|
5
|
+
"main": "./dist/index.cjs.js",
|
|
6
|
+
"module": "./dist/index.esm.js",
|
|
9
7
|
"exports": {
|
|
10
|
-
"require": "./dist/index.cjs",
|
|
11
|
-
"default": "./dist/index.
|
|
8
|
+
"require": "./dist/index.cjs.js",
|
|
9
|
+
"default": "./dist/index.esm.js"
|
|
12
10
|
},
|
|
13
11
|
"types": "./dist/index.d.ts",
|
|
14
12
|
"sideEffects": false,
|
|
15
13
|
"scripts": {
|
|
16
|
-
"build": "
|
|
17
|
-
"
|
|
18
|
-
"
|
|
19
|
-
"
|
|
20
|
-
"
|
|
14
|
+
"build": "npm-run-all --print-label --parallel 'build:*' --sequential serialize",
|
|
15
|
+
"build:bundle": "FORCE_COLOR=1 tsup",
|
|
16
|
+
"build:dts": "tsc --project tsconfig.build.json --pretty --emitDeclarationOnly",
|
|
17
|
+
"serialize": "node cli/index.js",
|
|
18
|
+
"typecheck": "run-p --print-label 'typecheck:*'",
|
|
19
|
+
"typecheck:main": "tsc --project tsconfig.build.json --pretty --noEmit",
|
|
20
|
+
"typecheck:cli": "tsc --project cli/tsconfig.build.json --noEmit",
|
|
21
|
+
"clean": "rimraf dist .tsbuildinfo"
|
|
21
22
|
},
|
|
22
23
|
"devDependencies": {
|
|
23
|
-
"microbundle": "^0.14.2",
|
|
24
24
|
"npm-run-all": "^4.1.5",
|
|
25
25
|
"rimraf": "^3.0.2",
|
|
26
|
-
"
|
|
26
|
+
"tsup": "^6.5.0",
|
|
27
|
+
"typescript": "^4.9.5"
|
|
27
28
|
},
|
|
28
29
|
"dependencies": {
|
|
29
|
-
"@charcoal-ui/foundation": "^2.
|
|
30
|
-
"@charcoal-ui/utils": "^2.
|
|
30
|
+
"@charcoal-ui/foundation": "^2.7.0",
|
|
31
|
+
"@charcoal-ui/utils": "^2.7.0",
|
|
31
32
|
"polished": "^4.1.4"
|
|
32
33
|
},
|
|
33
34
|
"files": [
|
|
@@ -43,5 +44,5 @@
|
|
|
43
44
|
"url": "https://github.com/pixiv/charcoal.git",
|
|
44
45
|
"directory": "packages/theme"
|
|
45
46
|
},
|
|
46
|
-
"gitHead": "
|
|
47
|
+
"gitHead": "77e32148d5a981f988e8bbc0c88aec82b0936a1a"
|
|
47
48
|
}
|
package/dist/index.cjs
DELETED
|
@@ -1,184 +0,0 @@
|
|
|
1
|
-
var polished = require('polished');
|
|
2
|
-
var foundation = require('@charcoal-ui/foundation');
|
|
3
|
-
var utils = require('@charcoal-ui/utils');
|
|
4
|
-
|
|
5
|
-
function _extends() {
|
|
6
|
-
_extends = Object.assign ? Object.assign.bind() : function (target) {
|
|
7
|
-
for (var i = 1; i < arguments.length; i++) {
|
|
8
|
-
var source = arguments[i];
|
|
9
|
-
|
|
10
|
-
for (var key in source) {
|
|
11
|
-
if (Object.prototype.hasOwnProperty.call(source, key)) {
|
|
12
|
-
target[key] = source[key];
|
|
13
|
-
}
|
|
14
|
-
}
|
|
15
|
-
}
|
|
16
|
-
|
|
17
|
-
return target;
|
|
18
|
-
};
|
|
19
|
-
return _extends.apply(this, arguments);
|
|
20
|
-
}
|
|
21
|
-
|
|
22
|
-
var outlineEffect = {
|
|
23
|
-
type: 'opacity',
|
|
24
|
-
opacity: 0.32
|
|
25
|
-
};
|
|
26
|
-
var assertive = '#ff2b00';
|
|
27
|
-
var brand = '#0096fa';
|
|
28
|
-
var borderForLight = polished.rgba('#000000', 0.08);
|
|
29
|
-
var borderForDark = polished.rgba('#ffffff', 0.12);
|
|
30
|
-
var common = {
|
|
31
|
-
typography: {
|
|
32
|
-
size: foundation.TYPOGRAPHY_SIZE
|
|
33
|
-
},
|
|
34
|
-
spacing: foundation.SPACING,
|
|
35
|
-
grid: {
|
|
36
|
-
unit: {
|
|
37
|
-
column: foundation.COLUMN_UNIT,
|
|
38
|
-
gutter: foundation.GUTTER_UNIT
|
|
39
|
-
}
|
|
40
|
-
},
|
|
41
|
-
borderRadius: foundation.BORDER_RADIUS,
|
|
42
|
-
transition: {
|
|
43
|
-
"default": {
|
|
44
|
-
duration: 0.2
|
|
45
|
-
}
|
|
46
|
-
},
|
|
47
|
-
breakpoint: {
|
|
48
|
-
screen1: foundation.BREAKPOINT[6],
|
|
49
|
-
screen2: foundation.BREAKPOINT[8],
|
|
50
|
-
screen3: foundation.BREAKPOINT[10],
|
|
51
|
-
screen4: foundation.BREAKPOINT[12]
|
|
52
|
-
},
|
|
53
|
-
gradientColor: {
|
|
54
|
-
surface5: [{
|
|
55
|
-
color: polished.rgba('#000000', 0.32),
|
|
56
|
-
ratio: 0
|
|
57
|
-
}, {
|
|
58
|
-
color: polished.rgba('#000000', 0),
|
|
59
|
-
ratio: 100
|
|
60
|
-
}],
|
|
61
|
-
callToAction: [{
|
|
62
|
-
color: '#d1ff1a',
|
|
63
|
-
ratio: 0
|
|
64
|
-
}, {
|
|
65
|
-
color: '#1ad1ff',
|
|
66
|
-
ratio: 100
|
|
67
|
-
}]
|
|
68
|
-
},
|
|
69
|
-
outline: {
|
|
70
|
-
"default": {
|
|
71
|
-
color: utils.applyEffect(brand, outlineEffect),
|
|
72
|
-
weight: 4
|
|
73
|
-
},
|
|
74
|
-
assertive: {
|
|
75
|
-
color: utils.applyEffect(assertive, outlineEffect),
|
|
76
|
-
weight: 4
|
|
77
|
-
}
|
|
78
|
-
},
|
|
79
|
-
elementEffect: {
|
|
80
|
-
disabled: {
|
|
81
|
-
type: 'opacity',
|
|
82
|
-
opacity: 0.32
|
|
83
|
-
}
|
|
84
|
-
}
|
|
85
|
-
};
|
|
86
|
-
var light = _extends({}, common, {
|
|
87
|
-
effect: {
|
|
88
|
-
hover: {
|
|
89
|
-
type: 'alpha',
|
|
90
|
-
color: polished.rgba('#000000', 0.04) // surface3
|
|
91
|
-
|
|
92
|
-
},
|
|
93
|
-
press: {
|
|
94
|
-
type: 'alpha',
|
|
95
|
-
color: polished.rgba('#000000', 0.16) // surface10
|
|
96
|
-
|
|
97
|
-
}
|
|
98
|
-
},
|
|
99
|
-
color: {
|
|
100
|
-
// TODO: colors should be picked from foundation color palette
|
|
101
|
-
transparent: polished.rgba('#000000', 0),
|
|
102
|
-
background1: '#ffffff',
|
|
103
|
-
background2: '#f5f5f5',
|
|
104
|
-
icon6: polished.rgba('#ffffff', 0.28),
|
|
105
|
-
link1: '#3d7699',
|
|
106
|
-
link2: polished.rgba('#ffffff', 0.36),
|
|
107
|
-
surface1: '#ffffff',
|
|
108
|
-
surface2: polished.rgba('#000000', 0.02),
|
|
109
|
-
surface3: polished.rgba('#000000', 0.04),
|
|
110
|
-
surface4: polished.rgba('#000000', 0.32),
|
|
111
|
-
surface6: polished.rgba('#000000', 0.88),
|
|
112
|
-
surface7: polished.rgba('#000000', 0.02),
|
|
113
|
-
surface8: polished.rgba('#000000', 0.88),
|
|
114
|
-
surface9: '#ffffff',
|
|
115
|
-
surface10: polished.rgba('#000000', 0.16),
|
|
116
|
-
text1: '#1f1f1f',
|
|
117
|
-
text2: '#474747',
|
|
118
|
-
text3: '#858585',
|
|
119
|
-
text4: '#adadad',
|
|
120
|
-
text5: '#ffffff',
|
|
121
|
-
brand: brand,
|
|
122
|
-
assertive: assertive,
|
|
123
|
-
warning: '#ffaf0f',
|
|
124
|
-
success: '#b1cc29',
|
|
125
|
-
updatedItem: polished.rgba(0, 150, 250, 0.04),
|
|
126
|
-
border: borderForLight
|
|
127
|
-
},
|
|
128
|
-
border: {
|
|
129
|
-
"default": {
|
|
130
|
-
color: borderForLight
|
|
131
|
-
}
|
|
132
|
-
}
|
|
133
|
-
});
|
|
134
|
-
var dark = _extends({}, common, {
|
|
135
|
-
effect: {
|
|
136
|
-
hover: {
|
|
137
|
-
type: 'alpha',
|
|
138
|
-
color: polished.rgba('#ffffff', 0.12) // surface3
|
|
139
|
-
|
|
140
|
-
},
|
|
141
|
-
press: {
|
|
142
|
-
type: 'alpha',
|
|
143
|
-
color: polished.rgba('#ffffff', 0.2) // surface10
|
|
144
|
-
|
|
145
|
-
}
|
|
146
|
-
},
|
|
147
|
-
color: {
|
|
148
|
-
transparent: polished.rgba('#000000', 0),
|
|
149
|
-
background1: '#1f1f1f',
|
|
150
|
-
background2: '#000000',
|
|
151
|
-
icon6: light.color.icon6,
|
|
152
|
-
link1: '#669FC2',
|
|
153
|
-
link2: light.color.link2,
|
|
154
|
-
surface1: '#1f1f1f',
|
|
155
|
-
surface2: polished.rgba('#000000', 0.16),
|
|
156
|
-
surface3: polished.rgba('#ffffff', 0.12),
|
|
157
|
-
surface4: light.color.surface4,
|
|
158
|
-
surface6: polished.rgba('#ffffff', 0.12),
|
|
159
|
-
surface7: light.color.surface7,
|
|
160
|
-
surface8: light.color.surface8,
|
|
161
|
-
surface9: '#333333',
|
|
162
|
-
surface10: polished.rgba('#ffffff', 0.2),
|
|
163
|
-
text1: '#f5f5f5',
|
|
164
|
-
text2: '#d6d6d6',
|
|
165
|
-
text3: '#858585',
|
|
166
|
-
text4: '#5c5c5c',
|
|
167
|
-
text5: '#f5f5f5',
|
|
168
|
-
brand: brand,
|
|
169
|
-
assertive: assertive,
|
|
170
|
-
warning: light.color.warning,
|
|
171
|
-
success: light.color.success,
|
|
172
|
-
updatedItem: polished.rgba(0, 150, 250, 0.12),
|
|
173
|
-
border: borderForDark
|
|
174
|
-
},
|
|
175
|
-
border: {
|
|
176
|
-
"default": {
|
|
177
|
-
color: borderForDark
|
|
178
|
-
}
|
|
179
|
-
}
|
|
180
|
-
});
|
|
181
|
-
|
|
182
|
-
exports.dark = dark;
|
|
183
|
-
exports.light = light;
|
|
184
|
-
//# sourceMappingURL=index.cjs.map
|
package/dist/index.cjs.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs","sources":["../src/default.ts"],"sourcesContent":["import { rgba } from 'polished'\nimport { CharcoalTheme } from './theme'\nimport {\n BORDER_RADIUS,\n BREAKPOINT,\n COLUMN_UNIT,\n GUTTER_UNIT,\n SPACING,\n TYPOGRAPHY_SIZE,\n} from '@charcoal-ui/foundation'\nimport { applyEffect } from '@charcoal-ui/utils'\n\nconst outlineEffect = {\n type: 'opacity',\n opacity: 0.32,\n} as const\n\nconst assertive = '#ff2b00'\nconst brand = '#0096fa'\nconst borderForLight = rgba('#000000', 0.08)\nconst borderForDark = rgba('#ffffff', 0.12)\n\nconst common = {\n typography: {\n size: TYPOGRAPHY_SIZE,\n },\n spacing: SPACING,\n grid: {\n unit: {\n column: COLUMN_UNIT,\n gutter: GUTTER_UNIT,\n },\n },\n borderRadius: BORDER_RADIUS,\n transition: {\n default: {\n duration: 0.2,\n },\n },\n breakpoint: {\n screen1: BREAKPOINT[6],\n screen2: BREAKPOINT[8],\n screen3: BREAKPOINT[10],\n screen4: BREAKPOINT[12],\n },\n gradientColor: {\n surface5: [\n { color: rgba('#000000', 0.32), ratio: 0 },\n { color: rgba('#000000', 0), ratio: 100 },\n ],\n callToAction: [\n { color: '#d1ff1a', ratio: 0 },\n { color: '#1ad1ff', ratio: 100 },\n ],\n },\n outline: {\n default: {\n color: applyEffect(brand, outlineEffect),\n weight: 4,\n },\n assertive: {\n color: applyEffect(assertive, outlineEffect),\n weight: 4,\n },\n },\n elementEffect: {\n disabled: {\n type: 'opacity',\n opacity: 0.32,\n },\n },\n} as const\n\nexport const light: CharcoalTheme = {\n ...common,\n effect: {\n hover: {\n type: 'alpha',\n color: rgba('#000000', 0.04), // surface3\n },\n press: {\n type: 'alpha',\n color: rgba('#000000', 0.16), // surface10\n },\n },\n color: {\n // TODO: colors should be picked from foundation color palette\n transparent: rgba('#000000', 0),\n background1: '#ffffff',\n background2: '#f5f5f5',\n icon6: rgba('#ffffff', 0.28),\n link1: '#3d7699',\n link2: rgba('#ffffff', 0.36),\n surface1: '#ffffff',\n surface2: rgba('#000000', 0.02),\n surface3: rgba('#000000', 0.04),\n surface4: rgba('#000000', 0.32),\n surface6: rgba('#000000', 0.88),\n surface7: rgba('#000000', 0.02),\n surface8: rgba('#000000', 0.88),\n surface9: '#ffffff',\n surface10: rgba('#000000', 0.16),\n text1: '#1f1f1f',\n text2: '#474747',\n text3: '#858585',\n text4: '#adadad',\n text5: '#ffffff',\n brand,\n assertive,\n warning: '#ffaf0f',\n success: '#b1cc29',\n updatedItem: rgba(0, 150, 250, 0.04),\n border: borderForLight,\n },\n border: {\n default: {\n color: borderForLight,\n },\n },\n}\n\nexport const dark: CharcoalTheme = {\n ...common,\n effect: {\n hover: {\n type: 'alpha',\n color: rgba('#ffffff', 0.12), // surface3\n },\n press: {\n type: 'alpha',\n color: rgba('#ffffff', 0.2), // surface10\n },\n },\n color: {\n transparent: rgba('#000000', 0),\n background1: '#1f1f1f',\n background2: '#000000',\n icon6: light.color.icon6,\n link1: '#669FC2',\n link2: light.color.link2,\n surface1: '#1f1f1f',\n surface2: rgba('#000000', 0.16),\n surface3: rgba('#ffffff', 0.12),\n surface4: light.color.surface4,\n surface6: rgba('#ffffff', 0.12),\n surface7: light.color.surface7,\n surface8: light.color.surface8,\n surface9: '#333333',\n surface10: rgba('#ffffff', 0.2),\n text1: '#f5f5f5',\n text2: '#d6d6d6',\n text3: '#858585',\n text4: '#5c5c5c',\n text5: '#f5f5f5',\n brand,\n assertive,\n warning: light.color.warning,\n success: light.color.success,\n updatedItem: rgba(0, 150, 250, 0.12),\n border: borderForDark,\n },\n border: {\n default: {\n color: borderForDark,\n },\n },\n}\n"],"names":["outlineEffect","type","opacity","assertive","brand","borderForLight","rgba","borderForDark","common","typography","size","TYPOGRAPHY_SIZE","spacing","SPACING","grid","unit","column","COLUMN_UNIT","gutter","GUTTER_UNIT","borderRadius","BORDER_RADIUS","transition","duration","breakpoint","screen1","BREAKPOINT","screen2","screen3","screen4","gradientColor","surface5","color","ratio","callToAction","outline","applyEffect","weight","elementEffect","disabled","light","effect","hover","press","transparent","background1","background2","icon6","link1","link2","surface1","surface2","surface3","surface4","surface6","surface7","surface8","surface9","surface10","text1","text2","text3","text4","text5","warning","success","updatedItem","border","dark"],"mappings":"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"}
|
package/dist/index.modern.js
DELETED
|
@@ -1,183 +0,0 @@
|
|
|
1
|
-
import { rgba } from 'polished';
|
|
2
|
-
import { TYPOGRAPHY_SIZE, SPACING, COLUMN_UNIT, GUTTER_UNIT, BORDER_RADIUS, BREAKPOINT } from '@charcoal-ui/foundation';
|
|
3
|
-
import { applyEffect } from '@charcoal-ui/utils';
|
|
4
|
-
|
|
5
|
-
function _extends() {
|
|
6
|
-
_extends = Object.assign ? Object.assign.bind() : function (target) {
|
|
7
|
-
for (var i = 1; i < arguments.length; i++) {
|
|
8
|
-
var source = arguments[i];
|
|
9
|
-
|
|
10
|
-
for (var key in source) {
|
|
11
|
-
if (Object.prototype.hasOwnProperty.call(source, key)) {
|
|
12
|
-
target[key] = source[key];
|
|
13
|
-
}
|
|
14
|
-
}
|
|
15
|
-
}
|
|
16
|
-
|
|
17
|
-
return target;
|
|
18
|
-
};
|
|
19
|
-
return _extends.apply(this, arguments);
|
|
20
|
-
}
|
|
21
|
-
|
|
22
|
-
const outlineEffect = {
|
|
23
|
-
type: 'opacity',
|
|
24
|
-
opacity: 0.32
|
|
25
|
-
};
|
|
26
|
-
const assertive = '#ff2b00';
|
|
27
|
-
const brand = '#0096fa';
|
|
28
|
-
const borderForLight = rgba('#000000', 0.08);
|
|
29
|
-
const borderForDark = rgba('#ffffff', 0.12);
|
|
30
|
-
const common = {
|
|
31
|
-
typography: {
|
|
32
|
-
size: TYPOGRAPHY_SIZE
|
|
33
|
-
},
|
|
34
|
-
spacing: SPACING,
|
|
35
|
-
grid: {
|
|
36
|
-
unit: {
|
|
37
|
-
column: COLUMN_UNIT,
|
|
38
|
-
gutter: GUTTER_UNIT
|
|
39
|
-
}
|
|
40
|
-
},
|
|
41
|
-
borderRadius: BORDER_RADIUS,
|
|
42
|
-
transition: {
|
|
43
|
-
default: {
|
|
44
|
-
duration: 0.2
|
|
45
|
-
}
|
|
46
|
-
},
|
|
47
|
-
breakpoint: {
|
|
48
|
-
screen1: BREAKPOINT[6],
|
|
49
|
-
screen2: BREAKPOINT[8],
|
|
50
|
-
screen3: BREAKPOINT[10],
|
|
51
|
-
screen4: BREAKPOINT[12]
|
|
52
|
-
},
|
|
53
|
-
gradientColor: {
|
|
54
|
-
surface5: [{
|
|
55
|
-
color: rgba('#000000', 0.32),
|
|
56
|
-
ratio: 0
|
|
57
|
-
}, {
|
|
58
|
-
color: rgba('#000000', 0),
|
|
59
|
-
ratio: 100
|
|
60
|
-
}],
|
|
61
|
-
callToAction: [{
|
|
62
|
-
color: '#d1ff1a',
|
|
63
|
-
ratio: 0
|
|
64
|
-
}, {
|
|
65
|
-
color: '#1ad1ff',
|
|
66
|
-
ratio: 100
|
|
67
|
-
}]
|
|
68
|
-
},
|
|
69
|
-
outline: {
|
|
70
|
-
default: {
|
|
71
|
-
color: applyEffect(brand, outlineEffect),
|
|
72
|
-
weight: 4
|
|
73
|
-
},
|
|
74
|
-
assertive: {
|
|
75
|
-
color: applyEffect(assertive, outlineEffect),
|
|
76
|
-
weight: 4
|
|
77
|
-
}
|
|
78
|
-
},
|
|
79
|
-
elementEffect: {
|
|
80
|
-
disabled: {
|
|
81
|
-
type: 'opacity',
|
|
82
|
-
opacity: 0.32
|
|
83
|
-
}
|
|
84
|
-
}
|
|
85
|
-
};
|
|
86
|
-
const light = _extends({}, common, {
|
|
87
|
-
effect: {
|
|
88
|
-
hover: {
|
|
89
|
-
type: 'alpha',
|
|
90
|
-
color: rgba('#000000', 0.04) // surface3
|
|
91
|
-
|
|
92
|
-
},
|
|
93
|
-
press: {
|
|
94
|
-
type: 'alpha',
|
|
95
|
-
color: rgba('#000000', 0.16) // surface10
|
|
96
|
-
|
|
97
|
-
}
|
|
98
|
-
},
|
|
99
|
-
color: {
|
|
100
|
-
// TODO: colors should be picked from foundation color palette
|
|
101
|
-
transparent: rgba('#000000', 0),
|
|
102
|
-
background1: '#ffffff',
|
|
103
|
-
background2: '#f5f5f5',
|
|
104
|
-
icon6: rgba('#ffffff', 0.28),
|
|
105
|
-
link1: '#3d7699',
|
|
106
|
-
link2: rgba('#ffffff', 0.36),
|
|
107
|
-
surface1: '#ffffff',
|
|
108
|
-
surface2: rgba('#000000', 0.02),
|
|
109
|
-
surface3: rgba('#000000', 0.04),
|
|
110
|
-
surface4: rgba('#000000', 0.32),
|
|
111
|
-
surface6: rgba('#000000', 0.88),
|
|
112
|
-
surface7: rgba('#000000', 0.02),
|
|
113
|
-
surface8: rgba('#000000', 0.88),
|
|
114
|
-
surface9: '#ffffff',
|
|
115
|
-
surface10: rgba('#000000', 0.16),
|
|
116
|
-
text1: '#1f1f1f',
|
|
117
|
-
text2: '#474747',
|
|
118
|
-
text3: '#858585',
|
|
119
|
-
text4: '#adadad',
|
|
120
|
-
text5: '#ffffff',
|
|
121
|
-
brand,
|
|
122
|
-
assertive,
|
|
123
|
-
warning: '#ffaf0f',
|
|
124
|
-
success: '#b1cc29',
|
|
125
|
-
updatedItem: rgba(0, 150, 250, 0.04),
|
|
126
|
-
border: borderForLight
|
|
127
|
-
},
|
|
128
|
-
border: {
|
|
129
|
-
default: {
|
|
130
|
-
color: borderForLight
|
|
131
|
-
}
|
|
132
|
-
}
|
|
133
|
-
});
|
|
134
|
-
const dark = _extends({}, common, {
|
|
135
|
-
effect: {
|
|
136
|
-
hover: {
|
|
137
|
-
type: 'alpha',
|
|
138
|
-
color: rgba('#ffffff', 0.12) // surface3
|
|
139
|
-
|
|
140
|
-
},
|
|
141
|
-
press: {
|
|
142
|
-
type: 'alpha',
|
|
143
|
-
color: rgba('#ffffff', 0.2) // surface10
|
|
144
|
-
|
|
145
|
-
}
|
|
146
|
-
},
|
|
147
|
-
color: {
|
|
148
|
-
transparent: rgba('#000000', 0),
|
|
149
|
-
background1: '#1f1f1f',
|
|
150
|
-
background2: '#000000',
|
|
151
|
-
icon6: light.color.icon6,
|
|
152
|
-
link1: '#669FC2',
|
|
153
|
-
link2: light.color.link2,
|
|
154
|
-
surface1: '#1f1f1f',
|
|
155
|
-
surface2: rgba('#000000', 0.16),
|
|
156
|
-
surface3: rgba('#ffffff', 0.12),
|
|
157
|
-
surface4: light.color.surface4,
|
|
158
|
-
surface6: rgba('#ffffff', 0.12),
|
|
159
|
-
surface7: light.color.surface7,
|
|
160
|
-
surface8: light.color.surface8,
|
|
161
|
-
surface9: '#333333',
|
|
162
|
-
surface10: rgba('#ffffff', 0.2),
|
|
163
|
-
text1: '#f5f5f5',
|
|
164
|
-
text2: '#d6d6d6',
|
|
165
|
-
text3: '#858585',
|
|
166
|
-
text4: '#5c5c5c',
|
|
167
|
-
text5: '#f5f5f5',
|
|
168
|
-
brand,
|
|
169
|
-
assertive,
|
|
170
|
-
warning: light.color.warning,
|
|
171
|
-
success: light.color.success,
|
|
172
|
-
updatedItem: rgba(0, 150, 250, 0.12),
|
|
173
|
-
border: borderForDark
|
|
174
|
-
},
|
|
175
|
-
border: {
|
|
176
|
-
default: {
|
|
177
|
-
color: borderForDark
|
|
178
|
-
}
|
|
179
|
-
}
|
|
180
|
-
});
|
|
181
|
-
|
|
182
|
-
export { dark, light };
|
|
183
|
-
//# sourceMappingURL=index.modern.js.map
|
package/dist/index.modern.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.modern.js","sources":["../src/default.ts"],"sourcesContent":["import { rgba } from 'polished'\nimport { CharcoalTheme } from './theme'\nimport {\n BORDER_RADIUS,\n BREAKPOINT,\n COLUMN_UNIT,\n GUTTER_UNIT,\n SPACING,\n TYPOGRAPHY_SIZE,\n} from '@charcoal-ui/foundation'\nimport { applyEffect } from '@charcoal-ui/utils'\n\nconst outlineEffect = {\n type: 'opacity',\n opacity: 0.32,\n} as const\n\nconst assertive = '#ff2b00'\nconst brand = '#0096fa'\nconst borderForLight = rgba('#000000', 0.08)\nconst borderForDark = rgba('#ffffff', 0.12)\n\nconst common = {\n typography: {\n size: TYPOGRAPHY_SIZE,\n },\n spacing: SPACING,\n grid: {\n unit: {\n column: COLUMN_UNIT,\n gutter: GUTTER_UNIT,\n },\n },\n borderRadius: BORDER_RADIUS,\n transition: {\n default: {\n duration: 0.2,\n },\n },\n breakpoint: {\n screen1: BREAKPOINT[6],\n screen2: BREAKPOINT[8],\n screen3: BREAKPOINT[10],\n screen4: BREAKPOINT[12],\n },\n gradientColor: {\n surface5: [\n { color: rgba('#000000', 0.32), ratio: 0 },\n { color: rgba('#000000', 0), ratio: 100 },\n ],\n callToAction: [\n { color: '#d1ff1a', ratio: 0 },\n { color: '#1ad1ff', ratio: 100 },\n ],\n },\n outline: {\n default: {\n color: applyEffect(brand, outlineEffect),\n weight: 4,\n },\n assertive: {\n color: applyEffect(assertive, outlineEffect),\n weight: 4,\n },\n },\n elementEffect: {\n disabled: {\n type: 'opacity',\n opacity: 0.32,\n },\n },\n} as const\n\nexport const light: CharcoalTheme = {\n ...common,\n effect: {\n hover: {\n type: 'alpha',\n color: rgba('#000000', 0.04), // surface3\n },\n press: {\n type: 'alpha',\n color: rgba('#000000', 0.16), // surface10\n },\n },\n color: {\n // TODO: colors should be picked from foundation color palette\n transparent: rgba('#000000', 0),\n background1: '#ffffff',\n background2: '#f5f5f5',\n icon6: rgba('#ffffff', 0.28),\n link1: '#3d7699',\n link2: rgba('#ffffff', 0.36),\n surface1: '#ffffff',\n surface2: rgba('#000000', 0.02),\n surface3: rgba('#000000', 0.04),\n surface4: rgba('#000000', 0.32),\n surface6: rgba('#000000', 0.88),\n surface7: rgba('#000000', 0.02),\n surface8: rgba('#000000', 0.88),\n surface9: '#ffffff',\n surface10: rgba('#000000', 0.16),\n text1: '#1f1f1f',\n text2: '#474747',\n text3: '#858585',\n text4: '#adadad',\n text5: '#ffffff',\n brand,\n assertive,\n warning: '#ffaf0f',\n success: '#b1cc29',\n updatedItem: rgba(0, 150, 250, 0.04),\n border: borderForLight,\n },\n border: {\n default: {\n color: borderForLight,\n },\n },\n}\n\nexport const dark: CharcoalTheme = {\n ...common,\n effect: {\n hover: {\n type: 'alpha',\n color: rgba('#ffffff', 0.12), // surface3\n },\n press: {\n type: 'alpha',\n color: rgba('#ffffff', 0.2), // surface10\n },\n },\n color: {\n transparent: rgba('#000000', 0),\n background1: '#1f1f1f',\n background2: '#000000',\n icon6: light.color.icon6,\n link1: '#669FC2',\n link2: light.color.link2,\n surface1: '#1f1f1f',\n surface2: rgba('#000000', 0.16),\n surface3: rgba('#ffffff', 0.12),\n surface4: light.color.surface4,\n surface6: rgba('#ffffff', 0.12),\n surface7: light.color.surface7,\n surface8: light.color.surface8,\n surface9: '#333333',\n surface10: rgba('#ffffff', 0.2),\n text1: '#f5f5f5',\n text2: '#d6d6d6',\n text3: '#858585',\n text4: '#5c5c5c',\n text5: '#f5f5f5',\n brand,\n assertive,\n warning: light.color.warning,\n success: light.color.success,\n updatedItem: rgba(0, 150, 250, 0.12),\n border: borderForDark,\n },\n border: {\n default: {\n color: borderForDark,\n },\n },\n}\n"],"names":["outlineEffect","type","opacity","assertive","brand","borderForLight","rgba","borderForDark","common","typography","size","TYPOGRAPHY_SIZE","spacing","SPACING","grid","unit","column","COLUMN_UNIT","gutter","GUTTER_UNIT","borderRadius","BORDER_RADIUS","transition","default","duration","breakpoint","screen1","BREAKPOINT","screen2","screen3","screen4","gradientColor","surface5","color","ratio","callToAction","outline","applyEffect","weight","elementEffect","disabled","light","effect","hover","press","transparent","background1","background2","icon6","link1","link2","surface1","surface2","surface3","surface4","surface6","surface7","surface8","surface9","surface10","text1","text2","text3","text4","text5","warning","success","updatedItem","border","dark"],"mappings":"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"}
|