@md-plugins/md-plugin-containers 0.1.0-alpha.2 → 0.1.0-alpha.20

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/README.md +62 -35
  2. package/package.json +10 -8
package/README.md CHANGED
@@ -29,14 +29,42 @@ pnpm add @md-plugins/md-plugin-containers
29
29
  ```js
30
30
  import MarkdownIt from 'markdown-it'
31
31
  import { containersPlugin } from '@md-plugins/md-plugin-containers'
32
+ import container from 'markdown-it-container'
32
33
 
33
34
  const md = new MarkdownIt()
34
- md.use(containersPlugin, {
35
- containers: [
36
- { type: 'note', defaultTitle: 'Note' },
37
- { type: 'warning', defaultTitle: 'Warning' },
38
- ],
39
- })
35
+
36
+ const containers = [
37
+ { type: 'warning', defaultTitle: 'Warning' },
38
+ { type: 'tip', defaultTitle: 'Tip' },
39
+ { type: 'details', defaultTitle: 'Details' },
40
+ ]
41
+
42
+ function createContainer(container, containerType, defaultTitle) {
43
+ const containerTypeLen = containerType.length
44
+
45
+ return [
46
+ container,
47
+ containerType,
48
+ {
49
+ render(tokens, idx) {
50
+ const token = tokens[idx]
51
+ const title = token.info.trim().slice(containerTypeLen).trim() || defaultTitle
52
+
53
+ if (containerType === 'details') {
54
+ return token.nesting === 1
55
+ ? `<details class="markdown-note markdown-note--${containerType}"><summary class="markdown-note__title">${title}</summary>\n`
56
+ : '</details>\n'
57
+ }
58
+
59
+ return token.nesting === 1
60
+ ? `<div class="markdown-note markdown-note--${containerType}"><p class="markdown-note__title">${title}</p>\n`
61
+ : '</div>\n'
62
+ },
63
+ },
64
+ ]
65
+ }
66
+
67
+ md.use(containersPlugin, containers, createContainer)
40
68
 
41
69
  const markdownContent = `
42
70
  :::note
@@ -81,35 +109,30 @@ The `md-plugin-containers` plugin supports the following options:
81
109
  You can define custom containers with their own styles or components:
82
110
 
83
111
  ```js
84
- md.use(containersPlugin, {
85
- containers: [
86
- { type: 'tip', defaultTitle: 'Tip' },
87
- { type: 'important', defaultTitle: 'Important' },
88
- ],
89
- })
90
- ```
91
-
92
- ## Advanced Usage
93
-
94
- ### Custom Rendering Logic
95
-
96
- Override the default rendering logic for containers:
97
-
98
- ```js
99
- md.use(containersPlugin, {
100
- containers: [{ type: 'note', defaultTitle: 'Note' }],
101
- render(tokens, idx) {
102
- const token = tokens[idx]
103
- if (token.nesting === 1) {
104
- // Opening tag
105
- const title = token.info.trim() || 'Note'
106
- return `<div class="custom-note"><strong>${title}:</strong>\n`
107
- } else {
108
- // Closing tag
109
- return `</div>\n`
110
- }
111
- },
112
- })
112
+ function createContainer(container, containerType, defaultTitle) {
113
+ const containerTypeLen = containerType.length
114
+
115
+ return [
116
+ container,
117
+ containerType,
118
+ {
119
+ render(tokens, idx) {
120
+ const token = tokens[idx]
121
+ const title = token.info.trim().slice(containerTypeLen).trim() || defaultTitle
122
+
123
+ if (containerType === 'details') {
124
+ return token.nesting === 1
125
+ ? `<details class="markdown-note markdown-note--${containerType}"><summary class="markdown-note__title">${title}</summary>\n`
126
+ : '</details>\n'
127
+ }
128
+
129
+ return token.nesting === 1
130
+ ? `<div class="markdown-note markdown-note--${containerType}"><p class="markdown-note__title">${title}</p>\n`
131
+ : '</div>\n'
132
+ },
133
+ },
134
+ ]
135
+ }
113
136
  ```
114
137
 
115
138
  ## Adding Titles
@@ -161,6 +184,10 @@ To run the tests for this plugin, use the following command:
161
184
  pnpm test
162
185
  ```
163
186
 
187
+ ## Documentation
188
+
189
+ In case this README falls out of date, please refer to the [documentation](https://md-plugins.netlify.app/md-plugins/containers/overview) for the latest information.
190
+
164
191
  ## License
165
192
 
166
193
  This plugin is licensed under the MIT License. See the [LICENSE](LICENSE.md) file for details.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@md-plugins/md-plugin-containers",
3
- "version": "0.1.0-alpha.2",
3
+ "version": "0.1.0-alpha.20",
4
4
  "description": "A markdown-it plugin for handling custom containers.",
5
5
  "keywords": [
6
6
  "markdown-it",
@@ -32,17 +32,19 @@
32
32
  "files": [
33
33
  "./dist"
34
34
  ],
35
- "dependencies": {
36
- "@types/markdown-it": "^14.1.2",
37
- "markdown-it": "^14.1.0",
38
- "markdown-it-container": "^4.0.0",
39
- "@md-plugins/shared": "0.1.0-alpha.2"
40
- },
41
35
  "publishConfig": {
42
36
  "access": "public"
43
37
  },
44
38
  "devDependencies": {
45
- "@types/markdown-it-container": "^2.0.10"
39
+ "markdown-it": "^14.1.0",
40
+ "markdown-it-container": "^4.0.0",
41
+ "@types/markdown-it-container": "^2.0.10",
42
+ "@types/markdown-it": "^14.1.2",
43
+ "@md-plugins/shared": "0.1.0-alpha.20"
44
+ },
45
+ "peerDependencies": {
46
+ "markdown-it": "^14.1.0",
47
+ "markdown-it-container": "^4.0.0"
46
48
  },
47
49
  "scripts": {
48
50
  "build": "unbuild",