remark-custom-blocks - npm Package Compare versions

Comparing version 2.4.6 to 2.5.0

dist/index.js

@@ -104,2 +104,8 @@ "use strict";
     var add = eat(stringToEat);
+
+    if (potentialBlock.details) {
+      potentialBlock.containerElement = 'details';
+      potentialBlock.titleElement = 'summary';
+    }
+
     var exit = this.enterBlock();
@@ -109,3 +115,3 @@ var contents = {
       data: {
-        hName: 'div',
+        hName: potentialBlock.contentsElement ? potentialBlock.contentsElement : 'div',
         hProperties: {
@@ -121,6 +127,7 @@ className: 'custom-block-body'
     if (titleAllowed && blockTitle) {
+      var configuredTitleBlockType = potentialBlock.titleElement ? potentialBlock.titleElement : 'div';
       var titleNode = {
         type: "".concat(blockType, "CustomBlockHeading"),
         data: {
-          hName: potentialBlock.details ? 'summary' : 'div',
+          hName: configuredTitleBlockType,
           hProperties: {
@@ -140,3 +147,3 @@ className: 'custom-block-heading'
       data: {
-        hName: potentialBlock.details ? 'details' : 'div',
+        hName: potentialBlock.containerElement ? potentialBlock.containerElement : 'div',
         hProperties: {
@@ -143,0 +150,0 @@ className: ['custom-block'].concat(_toConsumableArray(classList))

package.json

 {
   "name": "remark-custom-blocks",
-  "version": "2.4.6",
+  "version": "2.5.0",
   "repository": {
@@ -37,3 +37,3 @@ "url": "https://github.com/zestedesavoir/zmarkdown/tree/master/packages/remark-custom-blocks",
   },
-  "gitHead": "c2bf169996c4adfdf75a55290080947a2384c09f"
+  "gitHead": "80f91b8257b3733acd5b8b5b3f128f0b265a79f2"
 }

README.md

@@ -78,5 +78,34 @@ # remark-custom-blocks [![Build Status][build-badge]][build-status] [![Coverage Status][coverage-badge]][coverage-status]
   title: String, 'optional' | 'required', optional, default: custom titles not allowed
+  containerElement: String, optional, default: 'div'
+  titleElement: String, optional, default: 'div'
+  contentsElement: String, optional, default: 'div'
+  details: Boolean, optional, default: false
 }
 ```
 
+`containerElement`, `titleElement`, `contentsElement` allow you to customize the html elements that will be generated by `remark-rehype` stringifier. The generated HTML structure will be
+
+```html
+<containerElement>
+    <titleElement>
+        block title
+    </titleElement>
+    <contentsElement>
+        block content
+    </contentsElement>
+</containerElement>
+```
+
+you can see `details: true` as a shortcut to
+
+```javascript
+{
+    containerElement: 'details',
+    titleElement: 'summary',
+    contentsElement: 'div',
+}
+```
+
+Those specific parameters are here to help you build semantic HTML structure.
+
 #### Dependencies:
@@ -83,0 +112,0 @@

src/index.js

@@ -87,2 +87,6 @@ const spaceSeparated = require('space-separated-tokens')
     const add = eat(stringToEat)
+    if (potentialBlock.details) {
+      potentialBlock.containerElement = 'details'
+      potentialBlock.titleElement = 'summary'
+    }
 
@@ -93,3 +97,3 @@ const exit = this.enterBlock()
       data: {
-        hName: 'div',
+        hName: potentialBlock.contentsElement ? potentialBlock.contentsElement : 'div',
         hProperties: {
@@ -105,6 +109,8 @@ className: 'custom-block-body',
     if (titleAllowed && blockTitle) {
+
+      const titleElement = potentialBlock.titleElement ? potentialBlock.titleElement : 'div'
       const titleNode = {
         type: `${blockType}CustomBlockHeading`,
         data: {
-          hName: potentialBlock.details ? 'summary' : 'div',
+          hName: titleElement,
           hProperties: {
@@ -126,3 +132,3 @@ className: 'custom-block-heading',
       data: {
-        hName: potentialBlock.details ? 'details' : 'div',
+        hName: potentialBlock.containerElement ? potentialBlock.containerElement : 'div',
         hProperties: {
@@ -129,0 +135,0 @@ className: ['custom-block', ...classList],

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

19874

increased by7.71%

Lines of code

283

increased by3.66%

Number of lines in readme file

231

increased by14.36%

Number of medium supply chain risk alerts

0

decreased by-100%

No dependency changes