MDX for laravel blade

v1.0.0 2023-08-26 12:47 UTC

This package is auto-updated.

Last update: 2024-11-08 15:24:21 UTC


README

Latest Version on Packagist GitHub Tests Action Status GitHub Code Style Action Status Total Downloads

This package allows you to use blade components in your markdown. If you're familiar with MDX format than this is same as MDX but with Laravel blade components.

Hire me

I'm available for contractual work on this stack (Filament, Laravel, Livewire, AlpineJS, TailwindCSS). Reach me via email or discord

Installation

You can install the package via composer:

composer require hasnayeen/mdb

Usage

Let's say you've a blade component like below

<!-- resources/views/components/alert.blade.php -->

@props(['type' => 'info'])

<div {{ $attributes->merge(['class' => "alert alert-{{ $type }}"]) }}>
    {{ $slot }}
</div>

Use the component in your markdown component and convert to html with render method

$content = '
# Welcome to my blog

<x-alert type="success">
This is a success message.
</x-alert>

<x-alert type="warning">
This is a warning message.
</x-alert>

<x-alert type="danger">
This is a danger message.
</x-alert>
';

Mdb::render($content);

Alternatively you can use mdb method on Illuminate\Support\Str class

Str::mdb($content);

You can also configure the underlying markdown converter by passing an array of options to the render method. Check League\CommonMark docs for available options.

$content = '# MDB Demo';
$config = [
    'html_input' => 'allow',
    'allow_unsafe_links' => true,
    'max_nesting_level' => 4,
    'renderer' => 'block_separator',
];
Mdb::render($content, $config);

You can use additional extension to use for markdown rendering by adding them to mdb config file.

    'extensions' => [
        'League\CommonMark\Extension\HeadingPermalink\HeadingPermalinkExtension',
    ]

This will add the Heading Permalink extension to turn all heading into permalink.

You can provide configuration for the extension by passing array to render method like before

$content = '# MDB Demo';
$config = [
    'heading_permalink' => [
        'html_class' => 'heading-permalink',
        'id_prefix' => 'content',
        'apply_id_to_heading' => false,
        'heading_class' => '',
        'fragment_prefix' => 'content',
        'insert' => 'before',
        'min_heading_level' => 1,
        'max_heading_level' => 6,
        'title' => 'Permalink',
        'symbol' => '#',
        'aria_hidden' => true,
    ],
];
Mdb::render($content, $config);

Testing

composer test

Changelog

Please see CHANGELOG for more information on what has changed recently.

Contributing

Please see CONTRIBUTING for details.

Security Vulnerabilities

Please review our security policy on how to report security vulnerabilities.

Credits

License

The MIT License (MIT). Please see License File for more information.