npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@launchnotes/editor-extensions

v1.0.122

Published

tiptap editor extensions to be shared between frontend and content

Downloads

47

Readme

Editor Extensisons

This package exists to serve as a source of truth for our TipTap extensions between the frontend spa and cotent api. It is not a standalone and is instead just a module to house our extensions for the editor. In some cases, the frontend directory will extend extensions here for additional editing and UI menu capabilities, but the core parsing/rendering and naming will exist here.

Before beginning work on a new extensions, read through https://tiptap.dev/guide/custom-extensions

In general, our extensions will either be extensions of existing standard TipTap extensions or through the creation of enitrely new extensions via the base Node extension. In general we should only reach for a custom extension if there is a need that a standard extension does not satisfy. Many of the standard extenisions have configuration options that may solve your issue, so please be sure that the functionality you are seeking does not already exist.

What goes in here?

The extensions in this file should comprise the functionality that needs to be shared between the content service and our frontend SPA. Generally that means, at minimum, the name, parseHTML, and renderHTML functions will need to be defined in the extensions here. What does not need to be defined here are functions for uploading content, bubble menu UI's for editing text or media, or any other functionality that is beyond the scope of presenting the content. Editing specific functionality can live inside the SPA.

To publish

The steps are pretty straightforward. yarn tsc && yarn publish If you are removing or renaming an entire extension it needs to be a major version bump. Otherwise minor is fine. Removing or renaming extensions will break existing pieces of content in the app and should be treated with caution.

TODO: Use the private npm directory from gitlab. https://docs.gitlab.com/ee/user/packages/npm_registry/

Adding a new extension

  • Create folder in src/extensions
  • Add a node.ts or mark.ts file depending on what you are building.
  • Add your extension to LaunchNotesEditorExtensionsBase in index.ts
  • Run the publish commands.
  • Bump the package version in content and frontend.

Local Development

  • To avoid publishing many updates to the package, you can simply copy the extension to the frontend or content directory and reference it there to build new functionality. Once complete, you can publish an update to the package.

  • Tests for these extensions are covered by the content tests and frontend integration tests. To test changes to extensions rely on testing in those directories.