Skip to content

feat: make core react components easily accessible #104

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 4 commits into from
Jun 28, 2024

Conversation

Nemikolh
Copy link
Member

This PR changes a bit the @tutorialkit/react-components so that the CodeMirrorEditor, Terminal and FileTree can be easily accessed under a /core module:

import { Terminal, CodeMirrorEditor, FileTree } from '@tutorialkit/components-react/core';

Given that the Terminal component is not SSR friendly because of @xterm, it is also possible to import the component individually, via /core/<component name> and both default and named exports are provided:

import Terminal from '@tutorialkit/components-react/core/Terminal';
import CodeMirrorEditor from '@tutorialkit/components-react/core/CodeMirrorEditor';
import FileTree from '@tutorialkit/components-react/core/FileTree';

(in the astro integration we lazy import the terminal with a dynamic import and add a <Suspense> boundary to make it work)

Copy link

Review PR in StackBlitz Codeflow Run & review this pull request in StackBlitz Codeflow.

@Nemikolh Nemikolh force-pushed the joan/react-components-minor-improvements branch from a2e0799 to 2ae790d Compare June 28, 2024 12:11
Copy link

cloudflare-workers-and-pages bot commented Jun 28, 2024

Deploying tutorialkit-demo-page with  Cloudflare Pages  Cloudflare Pages

Latest commit: 78890e2
Status: ✅  Deploy successful!
Preview URL: https://1bf8d7a7.tutorialkit-demo-page.pages.dev
Branch Preview URL: https://joan-react-components-minor.tutorialkit-demo-page.pages.dev

View logs

@@ -176,13 +178,15 @@ export function CodeMirrorEditor({
}, [doc]);

return (
<div className="h-full relative">
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I've moved the responsability of setting the height to the caller. While working on an example where we wanted a fix height, this felt nicer than to wrap it in a div.

However, maybe in the majority of use cases, h-full is preferred. So maybe we should default className to h-full? I'm not sure.

Comment on lines -2 to -3
export * from './CodeMirrorEditor/index.js';
export * from './FileTree.js';
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Removed those exports because they're not used at the moment and the intent is to have them imported via the /core module.

@Nemikolh Nemikolh requested a review from AriPerkkio June 28, 2024 12:17
@stackblitz stackblitz deleted a comment from changeset-bot bot Jun 28, 2024
Copy link

Deploying tutorialkit-docs-page with  Cloudflare Pages  Cloudflare Pages

Latest commit: 97ab5ea
Status: ✅  Deploy successful!
Preview URL: https://3361bdb6.tutorialkit-docs-page.pages.dev
Branch Preview URL: https://joan-react-components-minor.tutorialkit-docs-page.pages.dev

View logs

@Nemikolh Nemikolh requested a review from HeyGarrison June 28, 2024 14:03
Copy link
Contributor

@d3lm d3lm left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice one!

Copy link
Member

@AriPerkkio AriPerkkio left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Some thoughts but otherwise it looks good to me.

@Nemikolh Nemikolh requested a review from AriPerkkio June 28, 2024 15:02
@Nemikolh Nemikolh merged commit d8a5a34 into main Jun 28, 2024
8 checks passed
@Nemikolh Nemikolh deleted the joan/react-components-minor-improvements branch June 28, 2024 15:15
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants