Add hidden param to files

Author: pomber

packages/scrollycoding/src/code.tsx

@@ -7,6 +7,9 @@ export { Code }
 
 function Code({ files, activeFile, ...props }: CodeProps) {
   const file = files[activeFile]
+  const tabs = Object.keys(files).filter(
+    filename => !files[filename].hideTab
+  )
   return (
     <MiniEditorWithState
       key={activeFile}
@@ -15,7 +18,7 @@ function Code({ files, activeFile, ...props }: CodeProps) {
         <CodeSandboxIcon url={useCodeSandboxLink()} />
       }
       file={activeFile}
-      tabs={Object.keys(files)}
+      tabs={tabs}
       lang={file.lang}
       code={file.code}
       {...props}

packages/scrollycoding/src/hike-context.tsx

@@ -18,7 +18,11 @@ export interface PreviewProps extends MiniBrowserProps {
 }
 
 export interface CodeFiles {
-  [path: string]: { lang: string; code: string }
+  [path: string]: {
+    lang: string
+    code: string
+    hideTab?: boolean
+  }
 }
 
 export type CodeProps = {

packages/scrollycoding/src/mdx-steps.tsx

@@ -79,10 +79,11 @@ function getFiles(
       const codeElementProps =
         preElement?.props?.children?.props || {}
       const lang = codeElementProps.className?.slice(9)
-      const filename =
+      const { filename, hideTab } = parseMetastring(
         codeElementProps.metastring || defaultFilename
+      )
       const code = codeElementProps.children
-      files[filename] = { code, lang }
+      files[filename] = { code, lang, hideTab }
       if (activeFile === "") {
         activeFile = filename
       }
@@ -94,6 +95,11 @@ function getFiles(
   return { files, activeFile }
 }
 
+function parseMetastring(metastring: string) {
+  const [filename, ...params] = metastring.split(" ")
+  return { filename, hideTab: params.includes("hidden") }
+}
+
 function getPreviewProps(
   stepHeadProps: StepHeadProps,
   hikePreviewProps: PreviewProps

packages/storybook/src/assets/scrollycoding.repeat.mdx

@@ -12,7 +12,7 @@ export default function Button() {
 }
 ```
 
-```jsx App.js
+```jsx App.js hidden
 import Button from "./Button"
 
 export default function App() {