Add staticMediaQuery config

Author: pomber

packages/mdx/src/mdx-client/scrollycoding.tsx

@@ -24,7 +24,7 @@ export function Scrollycoding(props) {
     <Swap
       match={[
         [
-          "screen and (min-width: 768px)",
+          props.codeConfig.staticMediaQuery,
           <DynamicScrollycoding {...props} />,
         ],
         ["default", <StaticScrollycoding {...props} />],

packages/mdx/src/remark/config.ts

@@ -5,6 +5,7 @@ export type CodeHikeConfig = {
   skipLanguages: string[]
   showExpandButton?: boolean
   showCopyButton?: boolean
+  staticMediaQuery?: string
   // path to the current file, internal use only
   filepath?: string
 }
@@ -19,6 +20,7 @@ export function addConfigDefaults(
 ): CodeHikeConfig {
   // TODO warn when config looks weird
   return {
+    staticMediaQuery: "screen and (min-width: 768px)",
     ...config,
     theme: config?.theme || {},
     autoImport: config?.autoImport === false ? false : true,

packages/mdx/src/smooth-code/code-tween.tsx

@@ -46,6 +46,7 @@ export type CodeConfig = {
   lineNumbers?: boolean
   showCopyButton?: boolean
   showExpandButton?: boolean
+  staticMediaQuery?: string
   debug?: boolean
 }