From cee5acaf9af713360da3cf2fd535eb26da85e92e Mon Sep 17 00:00:00 2001 From: Mark Lawlor Date: Fri, 20 May 2022 10:45:49 +1000 Subject: [PATCH] refactor: add code comments --- src/with-styled-children.ts | 17 +++++++++++++++++ 1 file changed, 17 insertions(+) diff --git a/src/with-styled-children.ts b/src/with-styled-children.ts index 23c2efc..1dee469 100644 --- a/src/with-styled-children.ts +++ b/src/with-styled-children.ts @@ -18,7 +18,24 @@ export function withStyledChildren({ : componentChildren; children = Children.map(children, (child, index) => { + /** + * For every child: + * For every style: + * For every atRule: + * Ensure all atRules match + * If all atRules match, push the style + * Add the styles to the child + * Return the children + * + * This is a inefficient and makes parent: selectors a bit slow + * as we repeat the logic for nearly every child. Sometimes that's required (eg. nthChild) + * but typically not. + * + * We should split the childStyles into static and dynamic and only loop the dynamic + * ones for each child. + */ const matchingStyles = []; + for (const { atRules, ...styles } of childStyles) { const matches = atRules.every(([rule, params]) => { return matchChildAtRule({