From 49f3d389f2d4547dbbcfd7efd50cd8969b532c79 Mon Sep 17 00:00:00 2001
From: alex-ketch <alex@ketch.me>
Date: Wed, 26 Feb 2020 18:34:58 -0500
Subject: [PATCH] feat(Selectors): Generate utility selectors for selecting
 element groups

---
 src/scripts/selectors.ts | 41 ++++++++++++++++++++++++++++++++++++++++
 src/selectors.css        | 11 +++++++++++
 2 files changed, 52 insertions(+)

diff --git a/src/scripts/selectors.ts b/src/scripts/selectors.ts
index ea8b2b2b2..72bee0962 100644
--- a/src/scripts/selectors.ts
+++ b/src/scripts/selectors.ts
@@ -131,6 +131,36 @@ const generateSelectors = async (): Promise<void> => {
     ([name, selectors]) => `case ":--${name}": return "${selectors}"`
   )
 
+  // Generate some utility selector groups for more ergonomic theme authoring
+  const listTypes = [
+    ':--Article:--root > :--affiliations',
+    ':--Collection',
+    ':--List',
+    ':--references > ol'
+  ]
+
+  const codeBlockTypes = [':--CodeBlock', ':--CodeChunk']
+
+  const codeTypes = [
+    ...codeBlockTypes,
+    ':--Code',
+    ':--CodeError',
+    ':--CodeExpression',
+    ':--CodeFragment',
+    ':--SoftwareSourceCode'
+  ]
+
+  const mediaTypes = [
+    ':--CodeBlock',
+    ':--CodeChunk',
+    ':--Datatable',
+    ':--Figure',
+    ':--ImageObject',
+    ':--MediaObject',
+    ':--Table',
+    ':--VideoObject'
+  ]
+
   const header = `/* Generated by ${path.basename(__filename)}. Do not edit. */`
 
   const css = `${header}
@@ -140,6 +170,7 @@ const generateSelectors = async (): Promise<void> => {
  */
 ${rootSelectorCss}
 
+
 /**
  * Type selectors
  */
@@ -149,6 +180,16 @@ ${typeSelectorsCss.join('\n')}
  * Property selectors
  */
 ${propSelectorsCss.join('\n')}
+
+
+/**
+ * Group element selectors
+ */
+@custom-selector :--ListTypes ${listTypes.join(',')};
+@custom-selector :--CodeBlockTypes ${codeBlockTypes.join(',')};
+@custom-selector :--CodeTypes ${codeTypes.join(',')};
+@custom-selector :--MediaTypes ${mediaTypes.join(',')};
+
 `
   fs.writeFile(cssPath, css, () => css)
 
diff --git a/src/selectors.css b/src/selectors.css
index 7996d98e3..a54a20d25 100644
--- a/src/selectors.css
+++ b/src/selectors.css
@@ -5,6 +5,7 @@
  */
 @custom-selector :--root [data-itemscope='root'];
 
+
 /**
  * Type selectors
  */
@@ -285,3 +286,13 @@
 @custom-selector :--volumeMounts [data-itemprop~='volumeMounts'];
 @custom-selector :--volumeMount [data-itemprop~='volumeMount'];
 @custom-selector :--volumeNumber [itemprop~='volumeNumber'];
+
+
+/**
+ * Group element selectors
+ */
+@custom-selector :--ListTypes :--Article:--root > :--affiliations,:--Collection,:--List,:--references > ol;
+@custom-selector :--CodeBlockTypes :--CodeBlock,:--CodeChunk;
+@custom-selector :--CodeTypes :--CodeBlock,:--CodeChunk,:--Code,:--CodeError,:--CodeExpression,:--CodeFragment,:--SoftwareSourceCode;
+@custom-selector :--MediaTypes :--CodeBlock,:--CodeChunk,:--Datatable,:--Figure,:--ImageObject,:--MediaObject,:--Table,:--VideoObject;
+