Skip to content
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.

Sign up for GitHub

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

Jump to bottom

Add option to disable all headings.anchorLinks at once #203

Closed
stefanobartoletti opened this issue May 15, 2024 · 7 comments
Closed

Add option to disable all headings.anchorLinks at once #203

stefanobartoletti opened this issue May 15, 2024 · 7 comments

Comments

@stefanobartoletti
Copy link
Contributor

stefanobartoletti commented May 15, 2024 •
edited

Currently, the default behavior when rendering headings inside a markdown content is to use anchor links on several heading levels.

In the scenario where one needs to disable anchor links on all levels, currently the config object to pass is like that

  // nuxt.config.js
  mdc: {
    headings: {
      anchorLinks: {
        h1: false,
        h2: false,
        h3: false,
        h4: false,
        h5: false,
        h6: false,
      },
    },
  },

This is quite verbose, and, even if I don't have numbers to support this, my guess is that it is more common to be in need to disable links on all levels, rather than in some of them.

I'd like to have an option to disable all of them at once in addition to the current granular setting, maybe like this:

  // nuxt.config.js
  mdc: {
    headings: {
      anchorLinks: false
    },
  },

Thanks ✌️
@nobkd
Copy link
Contributor

nobkd commented May 15, 2024 •
edited

That should actually work already.
Or have you already tried that, and it didn't work?

The typing for the config is missing that it can be a boolean:

mdc/src/types.ts

Lines 67 to 71 in 231bac6

headings?: {
anchorLinks?: {
[heading in 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6']?: boolean
}
}

but if I look into how heading anchor links are generated, this should not matter, as it will result in just not generating headings e.g. here:

mdc/src/runtime/components/prose/ProseH1.vue

Lines 18 to 19 in 231bac6

const { headings } = useRuntimeConfig().public.mdc
const generate = computed(() => props.id && headings?.anchorLinks?.h1)

@stefanobartoletti
Copy link
Contributor Author

It seems to work on the site frontend without any noticeable problem, but I have an typescript error thrown in nuxt.config.js, if I set it to false:

Screenshot_20240515_170840

@nobkd
Copy link
Contributor

nobkd commented May 15, 2024 •
edited

Yeah. false (or boolean) needs to be represented as type for heading.anchorLinks in https://github.com/nuxt-modules/mdc/blob/main/src/types.ts

But probably also needs changes for true if one wants to activate all anchor links at once.

(Some things are missing / have changed since mdc was extracted from nuxt/content 🤷)

@stefanobartoletti
Copy link
Contributor Author

Thanks for your reply @nobkd, I guess I can ignore typescript warnings for now.

I can open a PR to add false as a valid type if it is helpful, but for adding more logic even for true at the moment I'm not knowledgeable enough of the module's inner workings to provide a good solution.

Let me know if a PR for false only could be nice.

@farnabaz
Copy link
Collaborator

Having true and false to enable and disable all links would be nice IMO

but for adding more logic even for true at the moment I'm not knowledgeable enough of the module's inner workings to provide a good solution.

To handle true we can check options.headings.anchorLinks before passing to runtimeConfig and generate proper object syntax if necessary

mdc/src/module.ts

Line 62 in fade64f

headings: options.headings!

@stefanobartoletti
Copy link
Contributor Author

Thanks @farnabaz, would you accept two separate PR's?

I can prepare a quick one for false in a breeze, and properly implement true when I have the chance to see how it is working.

@farnabaz Volta.net
Copy link
Collaborator

Sure, feel free to open two different PRs

This was referenced May 16, 2024
Merged
Closed
@farnabaz farnabaz closed this as completed Jun 6, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

fix: add true as accepted value for headings.anchorLinks option stefanobartoletti/mdc
3 participants
@farnabaz @stefanobartoletti @nobkd