nuxt-strapi-blocks-renderer 1.0.10 → 1.0.13
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.
- package/README.md +19 -7
- package/dist/module.d.mts +1 -1
- package/dist/module.d.ts +1 -1
- package/dist/module.json +2 -2
- package/dist/runtime/components/StrapiBlocksText.vue +10 -10
- package/dist/runtime/components/blocks/ImageNode.vue +3 -3
- package/dist/runtime/components/blocks/inline/LinkInlineNode.vue +3 -3
- package/dist/runtime/composables/useBlocksText.d.ts +1 -1
- package/dist/runtime/types/index.d.ts +33 -33
- package/dist/runtime/utils/index.d.ts +1 -1
- package/package.json +15 -14
package/README.md
CHANGED
|
@@ -116,9 +116,10 @@ paragraph node component would be named `MyCustomBlocksPrefixParagraphNode`.
|
|
|
116
116
|
|
|
117
117
|
#### Other Custom Tags
|
|
118
118
|
|
|
119
|
-
You can apply similar customizations to all other HTML tags used by the renderer
|
|
119
|
+
You can apply similar customizations to all other HTML tags used by the renderer:
|
|
120
120
|
|
|
121
|
-
|
|
121
|
+
<details>
|
|
122
|
+
<summary>Headings</summary>
|
|
122
123
|
|
|
123
124
|
Custom heading tags (`<h1>`, `<h2>`, `<h3>`, etc.):
|
|
124
125
|
|
|
@@ -139,8 +140,10 @@ Custom heading tags (`<h1>`, `<h2>`, `<h3>`, etc.):
|
|
|
139
140
|
```
|
|
140
141
|
|
|
141
142
|
This pattern also extends to the `h3`, `h4`, `h5` and `h6` tags.
|
|
143
|
+
</details>
|
|
142
144
|
|
|
143
|
-
|
|
145
|
+
<details>
|
|
146
|
+
<summary>Lists</summary>
|
|
144
147
|
|
|
145
148
|
Custom list tags (`<ol>`, `<ul>` and `<li>`):
|
|
146
149
|
|
|
@@ -166,8 +169,10 @@ Custom list tags (`<ol>`, `<ul>` and `<li>`):
|
|
|
166
169
|
</li>
|
|
167
170
|
</template>
|
|
168
171
|
```
|
|
172
|
+
</details>
|
|
169
173
|
|
|
170
|
-
|
|
174
|
+
<details>
|
|
175
|
+
<summary>Blockquotes and Codes</summary>
|
|
171
176
|
|
|
172
177
|
Custom blockquote and code tags (`<blockquote>`, `<pre>`):
|
|
173
178
|
|
|
@@ -184,8 +189,10 @@ Custom blockquote and code tags (`<blockquote>`, `<pre>`):
|
|
|
184
189
|
<pre class="my-custom-class-for-pre"><slot /></pre>
|
|
185
190
|
</template>
|
|
186
191
|
```
|
|
192
|
+
</details>
|
|
187
193
|
|
|
188
|
-
|
|
194
|
+
<details>
|
|
195
|
+
<summary>Inline text nodes</summary>
|
|
189
196
|
|
|
190
197
|
Custom inline text nodes (`<strong>`, `<em>`, `<u>`, `<del>`, `<code>`):
|
|
191
198
|
|
|
@@ -225,8 +232,10 @@ Custom inline text nodes (`<strong>`, `<em>`, `<u>`, `<del>`, `<code>`):
|
|
|
225
232
|
</code>
|
|
226
233
|
</template>
|
|
227
234
|
```
|
|
235
|
+
</details>
|
|
228
236
|
|
|
229
|
-
|
|
237
|
+
<details>
|
|
238
|
+
<summary>Links</summary>
|
|
230
239
|
|
|
231
240
|
Custom link tag (`<a>`):
|
|
232
241
|
|
|
@@ -246,8 +255,10 @@ Custom link tag (`<a>`):
|
|
|
246
255
|
```
|
|
247
256
|
|
|
248
257
|
When rendering a link tag, the url gets passed as the `url` component property.
|
|
258
|
+
</details>
|
|
249
259
|
|
|
250
|
-
|
|
260
|
+
<details>
|
|
261
|
+
<summary>Images</summary>
|
|
251
262
|
|
|
252
263
|
Custom image tag (`<img>`):
|
|
253
264
|
|
|
@@ -272,6 +283,7 @@ Custom image tag (`<img>`):
|
|
|
272
283
|
|
|
273
284
|
When rendering an image tag, the image object gets passed as the `image` component property.
|
|
274
285
|
You can also use different image components here, i.e. `NuxtImg` or others.
|
|
286
|
+
</details>
|
|
275
287
|
|
|
276
288
|
## Development
|
|
277
289
|
|
package/dist/module.d.mts
CHANGED
|
@@ -4,6 +4,6 @@ interface ModuleOptions {
|
|
|
4
4
|
prefix: string;
|
|
5
5
|
blocksPrefix: string;
|
|
6
6
|
}
|
|
7
|
-
declare const _default: _nuxt_schema.NuxtModule<ModuleOptions>;
|
|
7
|
+
declare const _default: _nuxt_schema.NuxtModule<ModuleOptions, ModuleOptions, false>;
|
|
8
8
|
|
|
9
9
|
export { type ModuleOptions, _default as default };
|
package/dist/module.d.ts
CHANGED
|
@@ -4,6 +4,6 @@ interface ModuleOptions {
|
|
|
4
4
|
prefix: string;
|
|
5
5
|
blocksPrefix: string;
|
|
6
6
|
}
|
|
7
|
-
declare const _default: _nuxt_schema.NuxtModule<ModuleOptions>;
|
|
7
|
+
declare const _default: _nuxt_schema.NuxtModule<ModuleOptions, ModuleOptions, false>;
|
|
8
8
|
|
|
9
9
|
export { type ModuleOptions, _default as default };
|
package/dist/module.json
CHANGED
|
@@ -1,18 +1,18 @@
|
|
|
1
1
|
<script setup lang="ts">
|
|
2
|
-
|
|
3
|
-
|
|
2
|
+
import type { BlockNode } from '#strapi-blocks-renderer/types';
|
|
3
|
+
import type { VNode } from 'vue';
|
|
4
4
|
|
|
5
|
-
|
|
5
|
+
import { useBlocksText } from '#strapi-blocks-renderer/composables/useBlocksText';
|
|
6
6
|
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
7
|
+
const props = defineProps<{
|
|
8
|
+
nodes: BlockNode[];
|
|
9
|
+
}>();
|
|
10
10
|
|
|
11
|
-
|
|
11
|
+
const { text } = useBlocksText(props.nodes);
|
|
12
12
|
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
13
|
+
const RenderText = (): VNode[] => {
|
|
14
|
+
return text;
|
|
15
|
+
};
|
|
16
16
|
</script>
|
|
17
17
|
|
|
18
18
|
<template>
|
|
@@ -1,24 +1,24 @@
|
|
|
1
1
|
// Inline nodes
|
|
2
2
|
|
|
3
3
|
export interface TextInlineNode {
|
|
4
|
-
type: 'text'
|
|
5
|
-
text: string
|
|
6
|
-
bold?: boolean
|
|
7
|
-
italic?: boolean
|
|
8
|
-
underline?: boolean
|
|
9
|
-
strikethrough?: boolean
|
|
10
|
-
code?: boolean
|
|
4
|
+
type: 'text';
|
|
5
|
+
text: string;
|
|
6
|
+
bold?: boolean;
|
|
7
|
+
italic?: boolean;
|
|
8
|
+
underline?: boolean;
|
|
9
|
+
strikethrough?: boolean;
|
|
10
|
+
code?: boolean;
|
|
11
11
|
}
|
|
12
12
|
|
|
13
13
|
export interface LinkInlineNode {
|
|
14
|
-
type: 'link'
|
|
15
|
-
url: string
|
|
16
|
-
children: TextInlineNode[]
|
|
14
|
+
type: 'link';
|
|
15
|
+
url: string;
|
|
16
|
+
children: TextInlineNode[];
|
|
17
17
|
}
|
|
18
18
|
|
|
19
19
|
export interface ListItemInlineNode {
|
|
20
|
-
type: 'list-item'
|
|
21
|
-
children: DefaultInlineNode[]
|
|
20
|
+
type: 'list-item';
|
|
21
|
+
children: DefaultInlineNode[];
|
|
22
22
|
}
|
|
23
23
|
|
|
24
24
|
export type DefaultInlineNode = TextInlineNode | LinkInlineNode;
|
|
@@ -26,42 +26,42 @@ export type DefaultInlineNode = TextInlineNode | LinkInlineNode;
|
|
|
26
26
|
// Typed nodes
|
|
27
27
|
|
|
28
28
|
export interface ParagraphBlockNode {
|
|
29
|
-
type: 'paragraph'
|
|
30
|
-
children: DefaultInlineNode[]
|
|
29
|
+
type: 'paragraph';
|
|
30
|
+
children: DefaultInlineNode[];
|
|
31
31
|
}
|
|
32
32
|
|
|
33
33
|
export interface HeadingBlockNode {
|
|
34
|
-
type: 'heading'
|
|
35
|
-
level: 1 | 2 | 3 | 4 | 5 | 6
|
|
36
|
-
children: DefaultInlineNode[]
|
|
34
|
+
type: 'heading';
|
|
35
|
+
level: 1 | 2 | 3 | 4 | 5 | 6;
|
|
36
|
+
children: DefaultInlineNode[];
|
|
37
37
|
}
|
|
38
38
|
|
|
39
39
|
export interface ListBlockNode {
|
|
40
|
-
type: 'list'
|
|
41
|
-
format: 'ordered' | 'unordered'
|
|
42
|
-
children: (ListItemInlineNode | ListBlockNode)[]
|
|
40
|
+
type: 'list';
|
|
41
|
+
format: 'ordered' | 'unordered';
|
|
42
|
+
children: (ListItemInlineNode | ListBlockNode)[];
|
|
43
43
|
}
|
|
44
44
|
|
|
45
45
|
export interface QuoteBlockNode {
|
|
46
|
-
type: 'quote'
|
|
47
|
-
children: DefaultInlineNode[]
|
|
46
|
+
type: 'quote';
|
|
47
|
+
children: DefaultInlineNode[];
|
|
48
48
|
}
|
|
49
49
|
|
|
50
50
|
export interface CodeBlockNode {
|
|
51
|
-
type: 'code'
|
|
52
|
-
children: TextInlineNode[]
|
|
51
|
+
type: 'code';
|
|
52
|
+
children: TextInlineNode[];
|
|
53
53
|
}
|
|
54
54
|
|
|
55
55
|
export interface ImageBlockNode {
|
|
56
|
-
type: 'image'
|
|
57
|
-
image:
|
|
58
|
-
children: [{ type: 'text'
|
|
56
|
+
type: 'image';
|
|
57
|
+
image: Record<string, string>;
|
|
58
|
+
children: [{ type: 'text'; text: '' }];
|
|
59
59
|
}
|
|
60
60
|
|
|
61
61
|
export type BlockNode =
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
62
|
+
ParagraphBlockNode |
|
|
63
|
+
QuoteBlockNode |
|
|
64
|
+
CodeBlockNode |
|
|
65
|
+
HeadingBlockNode |
|
|
66
|
+
ListBlockNode |
|
|
67
|
+
ImageBlockNode;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import type { VNode } from 'vue';
|
|
2
1
|
import type { BlockNode, CodeBlockNode, DefaultInlineNode, HeadingBlockNode, ImageBlockNode, LinkInlineNode, ListBlockNode, ListItemInlineNode, ParagraphBlockNode, QuoteBlockNode, TextInlineNode } from '#strapi-blocks-renderer/types';
|
|
2
|
+
import type { VNode } from 'vue';
|
|
3
3
|
export declare const textInlineNode: (node: TextInlineNode) => (VNode | string)[] | VNode;
|
|
4
4
|
export declare const linkInlineNode: (node: LinkInlineNode) => VNode;
|
|
5
5
|
export declare const defaultInlineNode: (node: DefaultInlineNode) => (VNode | string)[] | VNode | undefined;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "nuxt-strapi-blocks-renderer",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.13",
|
|
4
4
|
"description": "Renderer for the strapi CMS blocks text content element.",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"repository": {
|
|
@@ -39,21 +39,20 @@
|
|
|
39
39
|
"renovate:config:validate": "renovate-config-validator"
|
|
40
40
|
},
|
|
41
41
|
"dependencies": {
|
|
42
|
-
"@nuxt/kit": "^3.
|
|
42
|
+
"@nuxt/kit": "^3.13.2",
|
|
43
43
|
"defu": "^6.1.4"
|
|
44
44
|
},
|
|
45
45
|
"devDependencies": {
|
|
46
|
-
"@
|
|
47
|
-
"@nuxt/
|
|
48
|
-
"@nuxt/module-builder": "^0.8.
|
|
49
|
-
"@nuxt/schema": "^3.
|
|
50
|
-
"@nuxt/test-utils": "^3.14.
|
|
51
|
-
"
|
|
52
|
-
"
|
|
53
|
-
"
|
|
54
|
-
"
|
|
55
|
-
"
|
|
56
|
-
"vue-tsc": "^2.0.29"
|
|
46
|
+
"@nuxt/devtools": "^1.6.0",
|
|
47
|
+
"@nuxt/eslint-config": "^0.6.1",
|
|
48
|
+
"@nuxt/module-builder": "^0.8.4",
|
|
49
|
+
"@nuxt/schema": "^3.13.2",
|
|
50
|
+
"@nuxt/test-utils": "^3.14.4",
|
|
51
|
+
"eslint": "^9.14.0",
|
|
52
|
+
"nuxt": "^3.13.2",
|
|
53
|
+
"renovate": "^38.142.5",
|
|
54
|
+
"vitest": "^2.1.4",
|
|
55
|
+
"vue-tsc": "^2.1.10"
|
|
57
56
|
},
|
|
58
57
|
"keywords": [
|
|
59
58
|
"nuxt",
|
|
@@ -63,7 +62,9 @@
|
|
|
63
62
|
"strapi",
|
|
64
63
|
"strapi-cms",
|
|
65
64
|
"json",
|
|
66
|
-
"blocks"
|
|
65
|
+
"blocks",
|
|
66
|
+
"text",
|
|
67
|
+
"renderer"
|
|
67
68
|
],
|
|
68
69
|
"engines": {
|
|
69
70
|
"node": "^18.x || ^20.x || ^22.x"
|