From 7265f57af0e942e205aa1ec6e518b2ed54915cad Mon Sep 17 00:00:00 2001
From: Brandon Scott <contact@brandonscott.me>
Date: Wed, 23 Nov 2022 07:37:09 -0500
Subject: [PATCH] Add selectors propType and ensure prop is properly matched
 when split

---
 src/enhancers/index.ts        |  6 ++++++
 src/enhancers/selectors.ts    | 12 ++++++++++++
 test/utils/split-box-props.ts | 25 +++++++++++++++++++++++++
 3 files changed, 43 insertions(+)
 create mode 100644 src/enhancers/selectors.ts

diff --git a/src/enhancers/index.ts b/src/enhancers/index.ts
index 332436b..78a5855 100644
--- a/src/enhancers/index.ts
+++ b/src/enhancers/index.ts
@@ -14,6 +14,7 @@ import * as outline from './outline'
 import * as overflow from './overflow'
 import * as position from './position'
 import * as resize from './resize'
+import * as selectors from './selectors'
 import * as spacing from './spacing'
 import * as text from './text'
 import * as transform from './transform'
@@ -37,6 +38,7 @@ export {
   overflow,
   position,
   resize,
+  selectors,
   spacing,
   text,
   transform,
@@ -60,6 +62,7 @@ export const propTypes: PropTypesMapping = {
   ...overflow.propTypes,
   ...position.propTypes,
   ...resize.propTypes,
+  ...selectors.propTypes,
   ...spacing.propTypes,
   ...text.propTypes,
   ...transform.propTypes,
@@ -85,6 +88,7 @@ export const propAliases: PropAliases = {
   ...overflow.propAliases,
   ...position.propAliases,
   ...resize.propAliases,
+  ...selectors.propAliases,
   ...spacing.propAliases,
   ...text.propAliases,
   ...transform.propAliases,
@@ -108,6 +112,7 @@ export const propValidators: PropValidators = {
   ...overflow.propValidators,
   ...position.propValidators,
   ...resize.propValidators,
+  ...selectors.propValidators,
   ...spacing.propValidators,
   ...text.propValidators,
   ...transform.propValidators,
@@ -131,6 +136,7 @@ export const propEnhancers: PropEnhancers = {
   ...overflow.propEnhancers,
   ...position.propEnhancers,
   ...resize.propEnhancers,
+  ...selectors.propEnhancers,
   ...spacing.propEnhancers,
   ...text.propEnhancers,
   ...transform.propEnhancers,
diff --git a/src/enhancers/selectors.ts b/src/enhancers/selectors.ts
new file mode 100644
index 0000000..6811b61
--- /dev/null
+++ b/src/enhancers/selectors.ts
@@ -0,0 +1,12 @@
+import PropTypes from 'prop-types'
+import { PropValidators, PropEnhancers, PropTypesMapping, PropAliases } from '../types/enhancers'
+
+export const propTypes: PropTypesMapping = {
+  selectors: PropTypes.object
+}
+
+export const propAliases: PropAliases = {}
+
+export const propValidators: PropValidators = {}
+
+export const propEnhancers: PropEnhancers = {}
diff --git a/test/utils/split-box-props.ts b/test/utils/split-box-props.ts
index 2709b62..327f806 100644
--- a/test/utils/split-box-props.ts
+++ b/test/utils/split-box-props.ts
@@ -7,6 +7,7 @@ test('splits box props', t => {
     disabled: true
   }
   t.deepEqual(splitBoxProps(props), {
+    /* @ts-ignore We are only passing and expecting a partial object back */
     matchedProps: {
       background: 'red'
     },
@@ -15,3 +16,27 @@ test('splits box props', t => {
     }
   })
 })
+
+test('includes selectors in matchedProps', t => {
+  const props = {
+    selectors: {
+      '&:hover': {
+        backgroundColor: 'red'
+      }
+    }
+  }
+
+  const result = splitBoxProps(props)
+
+  t.deepEqual(result, {
+    /* @ts-ignore We are only passing and expecting a partial object back */
+    matchedProps: {
+      selectors: {
+        '&:hover': {
+          backgroundColor: 'red'
+        }
+      }
+    },
+    remainingProps: {}
+  })
+})