({ value, modifier }: SelectorOptions = {})
| 163 | let values = design.variants.getCompletions(root) |
| 164 | |
| 165 | function selectors({ value, modifier }: SelectorOptions = {}) { |
| 166 | let name = root |
| 167 | if (value) name += hasDash ? `-${value}` : value |
| 168 | if (modifier) name += `/${modifier}` |
| 169 | |
| 170 | let variant = design.parseVariant(name) |
| 171 | |
| 172 | if (!variant) return [] |
| 173 | |
| 174 | class="cm">// Apply the variant to a placeholder rule |
| 175 | let node = styleRule(class="st">'.__placeholder__', []) |
| 176 | |
| 177 | class="cm">// If the rule produces no nodes it means the variant does not apply |
| 178 | if (applyVariant(node, variant, design.variants) === null) { |
| 179 | return [] |
| 180 | } |
| 181 | |
| 182 | class="cm">// Now look at the selector(s) inside the rule |
| 183 | let selectors: string[] = [] |
| 184 | |
| 185 | class="cm">// Produce v3-style selector strings in the face of nested rules |
| 186 | class="cm">// this is more visible for things like group-*, not-*, etc… |
| 187 | walk(node.nodes, { |
| 188 | exit(node, ctx) { |
| 189 | if (node.kind !== class="st">'rule' && node.kind !== class="st">'at-rule') return |
| 190 | if (node.nodes.length > 0) return |
| 191 | |
| 192 | let path = ctx.path() |
| 193 | path.push(node) |
| 194 | |
| 195 | class="cm">// Sort at-rules before style rules |
| 196 | path.sort((a, b) => { |
| 197 | let aIsAtRule = a.kind === class="st">'at-rule' |
| 198 | let bIsAtRule = b.kind === class="st">'at-rule' |
| 199 | |
| 200 | if (aIsAtRule && !bIsAtRule) return -1 |
| 201 | if (!aIsAtRule && bIsAtRule) return 1 |
| 202 | |
| 203 | return 0 |
| 204 | }) |
| 205 | |
| 206 | class="cm">// A list of the selectors / at rules encountered to get to this point |
| 207 | let group = path.flatMap((node) => { |
| 208 | if (node.kind === class="st">'rule') { |
| 209 | return node.selector === class="st">'&' ? [] : [node.selector] |
| 210 | } |
| 211 | |
| 212 | if (node.kind === class="st">'at-rule') { |
| 213 | return [`${node.name} ${node.params}`] |
| 214 | } |
| 215 | |
| 216 | return [] |
| 217 | }) |
| 218 | |
| 219 | class="cm">// Build a v3-style nested selector |
| 220 | let selector = class="st">'' |
| 221 | |
| 222 | for (let i = group.length - 1; i >= 0; i--) { |
nothing calls this directly
no test coverage detected