Skip to content

Commit 570ad36

Browse files
owjs3901owjs3901
committed
Impl import
1 parent ffbc913 commit 570ad36

File tree

43 files changed

+663
-189
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

43 files changed

+663
-189
lines changed

‎apps/landing/src/app/layout.tsx‎

Lines changed: 83 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import './markdown.css'
22
import 'sanitize.css'
33

4-
import { css, ThemeScript } from '@devup-ui/react'
4+
import { css, globalCss, ThemeScript } from '@devup-ui/react'
55
import type { Metadata } from 'next'
66

77
import { Footer } from '../components/Footer'
@@ -25,6 +25,88 @@ export const metadata: Metadata = {
2525
},
2626
}
2727

28+
// table {
29+
// border-collapse: collapse;
30+
// border-spacing: 0;
31+
// border: 1px solid var(--text);
32+
// color: var(--text, #2F2F2F);
33+
34+
// /* Desktop/bodyReg */
35+
// font-family: Pretendard;
36+
// font-size: 16px;
37+
// font-style: normal;
38+
// font-weight: 400;
39+
// line-height: 150%; /* 24px */
40+
// letter-spacing: -0.48px;
41+
// }
42+
43+
// code {
44+
// font-family: D2Coding;
45+
// font-size: 13px;
46+
// font-style: normal;
47+
// font-weight: 700;
48+
// line-height: 1.5;
49+
// letter-spacing: -0.03em;
50+
// }
51+
52+
// @media (min-width: 1280px) {
53+
// code {
54+
// font-size: 15px;
55+
// }
56+
// }
57+
58+
// th, td {
59+
// border: 1px solid var(--text);
60+
// padding: 6px 13px;
61+
// }
62+
63+
// pre {
64+
// border-radius: 10px;
65+
// }
66+
67+
// console.log('wtf')
68+
69+
// globalCss`
70+
// body {
71+
// }
72+
// `
73+
// globalCss({
74+
// body: {
75+
// // bg: 'red !important',
76+
// },
77+
// })
78+
79+
globalCss({
80+
imports: ['http://cdn.jsdelivr.net/gh/joungkyun/font-d2coding/d2coding.css'],
81+
table: {
82+
borderCollapse: 'collapse',
83+
borderSpacing: 0,
84+
border: '1px solid var(--text)',
85+
color: 'var(--text, #2F2F2F)',
86+
fontFamily: 'Pretendard',
87+
fontSize: '16px',
88+
fontStyle: 'normal',
89+
fontWeight: 400,
90+
lineHeight: '150%',
91+
letterSpacing: '-0.48px',
92+
},
93+
code: {
94+
fontFamily: 'D2Coding 궁서',
95+
fontSize: ['13px', '15px'],
96+
fontStyle: 'normal',
97+
fontWeight: 700,
98+
lineHeight: '1.5',
99+
letterSpacing: '-0.03em',
100+
},
101+
'th, td': {
102+
border: '1px solid var(--text)',
103+
padding: '6px 13px',
104+
},
105+
pre: {
106+
borderRadius: '10px',
107+
},
108+
})
109+
28110
export default function RootLayout({
29111
children,
30112
}: Readonly<{

‎apps/landing/src/app/markdown.css‎

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,17 @@
11
@import url(https://cdn.jsdelivr.net/gh/orioncactus/[email protected]/dist/web/static/pretendard.min.css);
22

3-
table {
3+
4+
/* table {
45
border-collapse: collapse;
56
border-spacing: 0;
67
border: 1px solid var(--text);
78
color: var(--text, #2F2F2F);
89
9-
/* Desktop/bodyReg */
1010
font-family: Pretendard;
1111
font-size: 16px;
1212
font-style: normal;
1313
font-weight: 400;
14-
line-height: 150%; /* 24px */
14+
line-height: 150%;
1515
letter-spacing: -0.48px;
1616
}
1717
@@ -30,11 +30,12 @@ code {
3030
}
3131
}
3232
33-
th, td {
33+
th,
34+
td {
3435
border: 1px solid var(--text);
3536
padding: 6px 13px;
3637
}
3738
3839
pre {
3940
border-radius: 10px;
40-
}
41+
} */

‎apps/next/src/app/layout.tsx‎

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { Box } from '@devup-ui/react'
1+
import { Box, globalCss } from '@devup-ui/react'
22
import type { Metadata } from 'next'
33
import { Geist, Geist_Mono } from 'next/font/google'
44

@@ -17,6 +17,14 @@ export const metadata: Metadata = {
1717
description: 'Generated by create next app',
1818
}
1919

20+
// eslint-disable-next-line @typescript-eslint/no-unused-expressions
21+
globalCss`
22+
body {
23+
background-color: #016 !important;
24+
color: #248 !important;
25+
}
26+
`
27+
2028
export default function RootLayout({
2129
children,
2230
}: Readonly<{
@@ -25,7 +33,7 @@ export default function RootLayout({
2533
return (
2634
<html lang="en">
2735
<body className={`${geistSans.variable} ${geistMono.variable}`}>
28-
<Box color="grey">hello</Box>
36+
<Box color="#025">hello</Box>
2937
{children}
3038
</body>
3139
</html>

‎bindings/devup-ui-wasm/src/lib.rs‎

Lines changed: 28 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,10 @@ extern "C" {
2222
fn log(s: &JsValue);
2323
#[wasm_bindgen(js_namespace = console, js_name = log)]
2424
fn log_str(s: &str);
25+
#[wasm_bindgen(js_namespace = console, js_name = time)]
26+
fn time(s: &str);
27+
#[wasm_bindgen(js_namespace = console, js_name = timeEnd)]
28+
fn time_end(s: &str);
2529
}
2630

2731
#[wasm_bindgen]
@@ -43,17 +47,17 @@ impl Output {
4347
let mut sheet = GLOBAL_STYLE_SHEET.lock().unwrap();
4448
let mut collected = false;
4549
for style in self.styles.iter() {
46-
let (cls, variable) = match style.extract() {
47-
Some(StyleProperty::ClassName(cls)) => (cls, None),
48-
Some(StyleProperty::Variable {
49-
class_name,
50-
variable_name,
51-
..
52-
}) => (class_name, Some(variable_name)),
53-
None => continue,
54-
};
5550
match style {
5651
ExtractStyleValue::Static(st) => {
52+
let (cls, _) = match style.extract() {
53+
Some(StyleProperty::ClassName(cls)) => (cls, None),
54+
Some(StyleProperty::Variable {
55+
class_name,
56+
variable_name,
57+
..
58+
}) => (class_name, Some(variable_name)),
59+
None => continue,
60+
};
5761
if sheet.add_property(
5862
&cls,
5963
st.property(),
@@ -66,6 +70,15 @@ impl Output {
6670
}
6771
}
6872
ExtractStyleValue::Dynamic(dy) => {
73+
let (cls, variable) = match style.extract() {
74+
Some(StyleProperty::ClassName(cls)) => (cls, None),
75+
Some(StyleProperty::Variable {
76+
class_name,
77+
variable_name,
78+
..
79+
}) => (class_name, Some(variable_name)),
80+
None => continue,
81+
};
6982
if sheet.add_property(
7083
&cls,
7184
dy.property(),
@@ -78,16 +91,17 @@ impl Output {
7891
}
7992
}
8093
ExtractStyleValue::Css(cs) => {
81-
if sheet.add_css(&cls, &cs.css) {
94+
if sheet.add_css(&cs.file, &cs.css) {
8295
collected = true;
8396
}
8497
}
8598
ExtractStyleValue::Typography(_) => {}
8699
ExtractStyleValue::Import(st) => {
87-
sheet.add_import(st);
100+
sheet.add_import(&st.file, &st.url);
88101
}
89102
}
90103
}
104+
91105
if !collected {
92106
return None;
93107
}
@@ -140,6 +154,9 @@ pub fn code_extract(
140154
package: &str,
141155
css_file: &str,
142156
) -> Result<Output, JsValue> {
157+
let mut sheet = GLOBAL_STYLE_SHEET.lock().unwrap();
158+
sheet.rm_global_css(filename);
159+
143160
match extract(
144161
filename,
145162
code,

‎libs/css/src/lib.rs‎

Lines changed: 13 additions & 57 deletions
Original file line numberDiff line numberDiff line change
@@ -41,7 +41,8 @@ pub fn is_debug() -> bool {
4141
pub enum StyleSelector {
4242
Media(String),
4343
Selector(String),
44-
Global(String),
44+
// selector, file
45+
Global(String, String),
4546
}
4647

4748
impl PartialOrd for StyleSelector {
@@ -56,7 +57,7 @@ fn get_selector_order(selector: &str) -> u8 {
5657
selector
5758
.split('&')
5859
.next_back()
59-
.map(|a| format!("{a}"))
60+
.map(|a| a.to_string())
6061
.unwrap_or(selector.to_string())
6162
} else {
6263
selector.to_string()
@@ -76,7 +77,7 @@ impl Ord for StyleSelector {
7677
}
7778
(StyleSelector::Media(_), StyleSelector::Selector(_)) => Ordering::Greater,
7879
(StyleSelector::Selector(_), StyleSelector::Media(_)) => Ordering::Less,
79-
(StyleSelector::Global(a), StyleSelector::Global(b)) => {
80+
(StyleSelector::Global(a, _), StyleSelector::Global(b, _)) => {
8081
if a == b {
8182
return Ordering::Equal;
8283
}
@@ -105,8 +106,8 @@ impl Ord for StyleSelector {
105106
(false, false) => a.cmp(b),
106107
}
107108
}
108-
(StyleSelector::Global(_), _) => Ordering::Less,
109-
(_, StyleSelector::Global(_)) => Ordering::Greater,
109+
(StyleSelector::Global(_, _), _) => Ordering::Less,
110+
(_, StyleSelector::Global(_, _)) => Ordering::Greater,
110111
}
111112
}
112113
}
@@ -155,14 +156,12 @@ impl From<[&str; 2]> for StyleSelector {
155156
}
156157
impl From<(&StyleSelector, &str)> for StyleSelector {
157158
fn from(value: (&StyleSelector, &str)) -> Self {
158-
if let StyleSelector::Global(_) = value.0 {
159+
if let StyleSelector::Global(_, file) = value.0 {
159160
let post = to_kebab_case(value.1);
160-
StyleSelector::Global(format!(
161-
"{}{}{}",
162-
value.0,
163-
get_selector_separator(&post),
164-
post
165-
))
161+
StyleSelector::Global(
162+
format!("{}{}{}", value.0, get_selector_separator(&post), post),
163+
file.clone(),
164+
)
166165
} else {
167166
StyleSelector::from([&value.0.to_string(), value.1])
168167
}
@@ -177,7 +176,7 @@ impl Display for StyleSelector {
177176
match self {
178177
StyleSelector::Selector(value) => value.to_string(),
179178
StyleSelector::Media(value) => format!("@{value}"),
180-
StyleSelector::Global(value) => format!("{value}"),
179+
StyleSelector::Global(value, _) => format!("{value}"),
181180
}
182181
)
183182
}
@@ -188,7 +187,7 @@ pub fn merge_selector(class_name: &str, selector: Option<&StyleSelector>) -> Str
188187
match selector {
189188
StyleSelector::Selector(value) => value.replace("&", &format!(".{class_name}")),
190189
StyleSelector::Media(_) => format!(".{class_name}"),
191-
StyleSelector::Global(v) => format!("{v}"),
190+
StyleSelector::Global(v, _) => v.to_string(),
192191
}
193192
} else {
194193
format!(".{class_name}")
@@ -484,21 +483,6 @@ pub fn sheet_to_classname(
484483
}
485484
}
486485

487-
pub fn css_to_classname(css: &str) -> String {
488-
if *DEBUG.lock().unwrap() {
489-
let mut hasher = DefaultHasher::new();
490-
css.hash(&mut hasher);
491-
format!("css-{}", hasher.finish())
492-
} else {
493-
let mut map = GLOBAL_CLASS_MAP.lock().unwrap();
494-
map.get(css).map(|v| format!("d{v}")).unwrap_or_else(|| {
495-
let len = map.len();
496-
map.insert(css.to_string(), len as i32);
497-
format!("d{}", map.len() - 1)
498-
})
499-
}
500-
}
501-
502486
pub fn sheet_to_variable_name(property: &str, level: u8, selector: Option<&str>) -> String {
503487
if *DEBUG.lock().unwrap() {
504488
let selector = selector.unwrap_or("").trim();
@@ -840,34 +824,6 @@ mod tests {
840824
);
841825
}
842826

843-
#[test]
844-
#[serial]
845-
fn test_css_to_classname() {
846-
set_debug(false);
847-
reset_class_map();
848-
assert_eq!(css_to_classname("background: red"), "d0");
849-
assert_eq!(css_to_classname("background: blue"), "d1");
850-
}
851-
#[test]
852-
#[serial]
853-
fn test_debug_css_to_classname() {
854-
set_debug(true);
855-
assert_eq!(
856-
css_to_classname("background: red"),
857-
"css-10773204219957113694"
858-
);
859-
assert_eq!(
860-
css_to_classname("background: blue"),
861-
"css-1226995032436176700"
862-
);
863-
set_debug(true);
864-
reset_class_map();
865-
assert_eq!(
866-
css_to_classname("background: red"),
867-
"css-10773204219957113694"
868-
);
869-
}
870-
871827
#[test]
872828
fn test_convert_property() {
873829
assert_eq!(

‎libs/extractor/src/css_utils.rs‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,10 @@ pub fn css_to_style<'a>(
1111
) -> Vec<ExtractStyleProp<'a>> {
1212
let mut styles = vec![];
1313
for s in css.split(";") {
14+
let s = s.trim();
15+
if s.is_empty() {
16+
continue;
17+
}
1418
let mut iter = s.split(":");
1519
let property = to_camel_case(iter.next().unwrap().trim());
1620
let value = iter.next().unwrap().trim();

0 commit comments

Comments
 (0)