abishekatp / stylers

Fully compile time scoped CSS for Leptos components
MIT License
139 stars 13 forks source link

Rules with :deep still have the component selector append. #42

Closed svieujot closed 1 year ago

svieujot commented 1 year ago

Closes #39.

ATPABISHEK commented 1 year ago

_Hi @svieujot, it's actually good catch, I think If we make small change we are good to go. The code I am sharing below seems more readable. it removes was_deep_directive_open check from all the places. I have just added single check at the beginning, what do you think about it? Also Can you directly add this change in stylers_build branch? because I have resolved merge conflicts locally in that branch. So again pulling this change from the main branch will be lot of work._

Edit:

I am trying to release new version today. So I will make these changes in that branch and release it. @svieujot If I do that we won't be able to merge this pr. Sorry for that.

for c in selector_text.chars() {
            i += 1;
            //when reading external files in h2,h1{} selector will be splitted into multiple lines
            if c == '\n' {
                continue;
            }
            //ignore all white spaces after :deep directive.
            if was_deep_directive_open {
                if c.is_whitespace() {
                    source.push(' ');
                    continue;
                } else {
                    source.push(c);
                    was_deep_directive_open = false;
                    continue;
                }
            }
            //ignore everything between square brackets.
            //todo:handle the case when brackets inside attribute.
            if is_bracket_open {
                if c == ']' {
                    is_bracket_open = false;
                    source.push(c);

                    if !is_deep_directive_open {
                        source.push_str(&class.as_selector());
                    }

                    temp.push(c);
                    sel_map.insert(temp.clone());
                    temp = String::new();
                } else {
                    source.push(c);
                    temp.push(c);
                }
                continue;
            }
            if c == '[' {
                is_bracket_open = true;
                source.push(c);
                temp.push(c);
                continue;
            }

            // if current char is colon and previous char is space means that is custom :deep directive.
            // then just use whatever values inside :deep() directive.
            if is_deep_directive_open && c != ')' {
                source.push(c);
                continue;
            }
            if is_deep_directive_open && c == ')' {
                is_deep_directive = false;
                is_deep_directive_open = false;
                was_deep_directive_open = true;
                continue;
            }
            if is_deep_directive && c == '(' {
                is_deep_directive_open = true;
                continue;
            }
            if is_deep_directive && c != '(' {
                continue;
            }
            if c == ':' {
                if let Some(sub) = selector_text.get(i..i + 4) {
                    if sub == "deep" {
                        is_deep_directive = true;
                        continue;
                    }
                }
            }

            //ignore everything until we reach to whitespace or end of the line after encountering pseudo class selector(:).
            if is_pseudo_class_start {
                if c == ' ' || i == sel_len {
                    source.push(c);
                    is_pseudo_class_start = false;

                    if c != ' ' {
                        temp.push(c);
                    }
                    sel_map.insert(temp.clone());
                    temp = String::new();
                } else {
                    source.push(c);
                    temp.push(c);
                }
                continue;
            }
            if c == ':' {
                is_pseudo_class_start = true;
                source.push_str(&class.as_selector());
                source.push(c);
                temp.push(c);
                continue;
            }

            //this condition ignores the unwanted white space after comma, >, +, ~ punctuations.
            if is_punct_start {
                // this will remove newline charactors following comma(,) in selectors.
                if c.is_whitespace() {
                    continue;
                } else {
                    is_punct_start = false;
                }
            }
            if c == ',' || c == '+' || c == '~' || c == '>' || c == '|' {
                source.push_str(&class.as_selector());
                source.push(c);
                is_punct_start = true;

                sel_map.insert(temp.clone());
                temp = String::new();
                continue;
            }

            //check for universal selector.
            if c == '*' {
                source.push_str(&class.as_selector());
                sel_map.insert("*".to_string());
                continue;
            }

            //append random class if we reach end of the line.
            if i == sel_len {
                source.push(c);
                source.push_str(&class.as_selector());

                temp.push(c);
                sel_map.insert(temp.clone());
                temp = String::new();
                continue;
            }

            //check for direct child selector
            if c == ' ' {
                source.push_str(&class.as_selector());
                source.push(' ');

                sel_map.insert(temp.clone());
                temp = String::new();
            } else {
                source.push(c);
                temp.push(c);
            }
        }