New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[request] str-split function #1950

Open
xzyfer opened this Issue Jan 5, 2016 · 12 comments

Comments

Projects
None yet
6 participants
@xzyfer
Copy link
Contributor

xzyfer commented Jan 5, 2016

It would be really useful to have a str-split($string, $delimiter:" ") function akin to JavaScript, or Ruby.

The primary use case I run into is splitting selector strings i.e.

.foo .bar { /* code */ }

It's rather difficult to get .bar from & without boilerplate string functions or importing something like sassdash.

A another use case I run into is remove part of selector. As it stands selector-replace does not allow you to remove part of a selector (i.e. replace it with "" or null). Being able to easily split selector strings would makes this much easier.

@cimmanon

This comment has been minimized.

Copy link

cimmanon commented Jan 5, 2016

Selectors aren't strings. They're lists of lists. If you want to remove or capture part of a selector, you use a loop.

.foo .bar, .one .two {
    @each $sel in & {
        @debug nth($sel, -1);
    }
}

Output:

>> DEBUG: .bar
>> DEBUG: .two
@xzyfer

This comment has been minimized.

Copy link
Contributor

xzyfer commented Jan 5, 2016

Selectors aren't strings. They're lists of lists.

Yes I understand.

If you want to remove or capture part of a selector, you use a loop.

You're correct.


As it turns out, in my experimentation, where I was mistaken was that even if there is one selector,& is still a nested list. This is where I was getting tripped up.

i.e.

.foo .bar { 
  a: length(&); // 1
  b: length(nth(&, 1)); // 2
}

I was expecting a to be b. I understand why it works this way, it was just a detail I had missed.

@xzyfer

This comment has been minimized.

Copy link
Contributor

xzyfer commented Jan 5, 2016

I guess, assuming certain constraints on the input string, and only wanting " " as the $delimiter you can fake str-split with nth(parse-selector(".foo .bar"), 1). Which granted is the usecase is proposed.

@xzyfer

This comment has been minimized.

Copy link
Contributor

xzyfer commented Jan 5, 2016

@davidkpiano True. Sorry I wasn't more clear.

As it turns out, in my experimentation, where I was mistaken was that even if there is one selector,& is still a nested list.

.foo .bar {
  test: nth(nth(&, 1), 2);
}

note: selector-parse() isn't required when you're dealing with &

@xzyfer

This comment has been minimized.

Copy link
Contributor

xzyfer commented Jan 5, 2016

With regards to comment on selector-parse you can split a string on white space.

.foo .bar {
  test: nth(nth(selector-parse(".foo .bar"), 1), 2); // .bar
}

I suspect there may be limitations on the types of strings this works with i.e. valid selectors (maybe?)

@davidkpiano

This comment has been minimized.

Copy link

davidkpiano commented Jan 5, 2016

(Sorry, deleted my comment as it was redundant.)

Maybe a selector-split function would be more appropriate? Something that splits based on combinators:

$test: selector-split(".foo .bar", " ");
// => ((.foo,), (.bar,))

$test: selector-split(".foo .bar > .baz", ">");
// => ((.foo, .bar), (.baz,))
@chriseppstein

This comment has been minimized.

Copy link
Member

chriseppstein commented Jan 5, 2016

Something that splits based on combinators

whitespace is a combinator. it is the "descendant combinator".

Anyways, a str-split function seems generally useful and is easy enough to add.

@esr360

This comment has been minimized.

Copy link

esr360 commented Nov 14, 2016

+1 for a str-split or selector-split function

@xzyfer

This comment has been minimized.

Copy link
Contributor

xzyfer commented May 4, 2018

@nex3 should this also come with a feature check flag?

@nex3

This comment has been minimized.

Copy link
Contributor

nex3 commented May 19, 2018

Generally we don't add feature flags for functions, since they can be detected with function-exists().

@xzyfer

This comment has been minimized.

Copy link
Contributor

xzyfer commented May 19, 2018

@esr360

This comment has been minimized.

Copy link

esr360 commented Jun 19, 2018

something like this seems like a fairly elegant work around to me:

.foo .bar {
    // this spoofs the selectors of `&` into a Sass list
    $selectors: str-replace(inspect(&), ' ', ', ');
    // selector is now split - do whatever you need to do
    ...
    // when finished, rebuild selector
    $selectors: selector-parse($selectors);
}

Sorry if this was already clear from previous comments.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment