@docsector/docsector-reader 3.3.1 → 3.5.0
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 +17 -0
- package/bin/docsector.js +1 -1
- package/jsconfig.json +1 -1
- package/package.json +2 -1
- package/src/components/DPageEmbeddedUrl.vue +375 -0
- package/src/components/DPageTokens.vue +10 -0
- package/src/components/page-section-tokens.js +112 -7
- package/src/composables/useEmbeddedUrl.js +365 -0
- package/src/css/app.sass +43 -0
- package/src/pages/manual/content/blocks/embedded-urls.overview.en-US.md +33 -0
- package/src/pages/manual/content/blocks/embedded-urls.overview.pt-BR.md +33 -0
- package/src/pages/manual/content/blocks/embedded-urls.showcase.en-US.md +25 -0
- package/src/pages/manual/content/blocks/embedded-urls.showcase.pt-BR.md +25 -0
- package/src/pages/manual/content/blocks/task-lists.overview.en-US.md +20 -0
- package/src/pages/manual/content/blocks/task-lists.overview.pt-BR.md +20 -0
- package/src/pages/manual/content/blocks/task-lists.showcase.en-US.md +23 -0
- package/src/pages/manual/content/blocks/task-lists.showcase.pt-BR.md +23 -0
- package/src/pages/manual.index.js +56 -0
- package/src/pages/manual/components/d-subpage.overview.en-US.md +0 -60
- package/src/pages/manual/components/d-subpage.overview.pt-BR.md +0 -60
|
@@ -402,6 +402,34 @@ export default {
|
|
|
402
402
|
}
|
|
403
403
|
},
|
|
404
404
|
|
|
405
|
+
'/content/blocks/task-lists': {
|
|
406
|
+
config: {
|
|
407
|
+
icon: 'check_box',
|
|
408
|
+
status: 'done',
|
|
409
|
+
meta: {
|
|
410
|
+
description: {
|
|
411
|
+
'en-US': 'Task lists — Documentation of Docsector Reader',
|
|
412
|
+
'pt-BR': 'Listas de tarefas — Documentacao do Docsector Reader'
|
|
413
|
+
}
|
|
414
|
+
},
|
|
415
|
+
book: 'manual',
|
|
416
|
+
menu: {},
|
|
417
|
+
subpages: {
|
|
418
|
+
showcase: true
|
|
419
|
+
}
|
|
420
|
+
},
|
|
421
|
+
data: {
|
|
422
|
+
'en-US': { title: 'Task lists' },
|
|
423
|
+
'pt-BR': { title: 'Listas de tarefas' }
|
|
424
|
+
},
|
|
425
|
+
metadata: {
|
|
426
|
+
tags: {
|
|
427
|
+
'en-US': 'task list checklist checkbox todo done pending nested markdown gitbook',
|
|
428
|
+
'pt-BR': 'lista de tarefas checklist checkbox todo concluído pendente aninhada markdown gitbook'
|
|
429
|
+
}
|
|
430
|
+
}
|
|
431
|
+
},
|
|
432
|
+
|
|
405
433
|
'/content/blocks/hints': {
|
|
406
434
|
config: {
|
|
407
435
|
icon: 'lightbulb',
|
|
@@ -571,6 +599,34 @@ export default {
|
|
|
571
599
|
}
|
|
572
600
|
},
|
|
573
601
|
|
|
602
|
+
'/content/blocks/embedded-urls': {
|
|
603
|
+
config: {
|
|
604
|
+
icon: 'link',
|
|
605
|
+
status: 'new',
|
|
606
|
+
meta: {
|
|
607
|
+
description: {
|
|
608
|
+
'en-US': 'Embedded URLs — Documentation of Docsector Reader',
|
|
609
|
+
'pt-BR': 'URLs embutidas — Documentação do Docsector Reader'
|
|
610
|
+
}
|
|
611
|
+
},
|
|
612
|
+
book: 'manual',
|
|
613
|
+
menu: {},
|
|
614
|
+
subpages: {
|
|
615
|
+
showcase: true
|
|
616
|
+
}
|
|
617
|
+
},
|
|
618
|
+
data: {
|
|
619
|
+
'en-US': { title: 'Embedded URLs' },
|
|
620
|
+
'pt-BR': { title: 'URLs embutidas' }
|
|
621
|
+
},
|
|
622
|
+
metadata: {
|
|
623
|
+
tags: {
|
|
624
|
+
'en-US': 'embed embedded url youtube vimeo spotify codepen iframe preview external link gitbook',
|
|
625
|
+
'pt-BR': 'embed url embutida youtube vimeo spotify codepen iframe preview link externo gitbook'
|
|
626
|
+
}
|
|
627
|
+
}
|
|
628
|
+
},
|
|
629
|
+
|
|
574
630
|
'/content/blocks/math-and-tex': {
|
|
575
631
|
config: {
|
|
576
632
|
icon: 'functions',
|
|
@@ -1,60 +0,0 @@
|
|
|
1
|
-
## Overview
|
|
2
|
-
|
|
3
|
-
`DSubpage` is a **convenience wrapper** that composes `DPage`, `DH1`, and `DPageSection` into a standard documentation page layout. It is the component loaded by the router for every subpage route.
|
|
4
|
-
|
|
5
|
-
## How It Works
|
|
6
|
-
|
|
7
|
-
DSubpage generates a deterministic numeric ID from the current route path using a hash function. This ID is passed to `DPageSection` to keep per-page renderer indexes stable across page navigations.
|
|
8
|
-
|
|
9
|
-
## Template
|
|
10
|
-
|
|
11
|
-
```html
|
|
12
|
-
<d-page show-back-to-top-control>
|
|
13
|
-
<header>
|
|
14
|
-
<d-h1 :id="0" />
|
|
15
|
-
</header>
|
|
16
|
-
<main>
|
|
17
|
-
<d-page-section :id="id" />
|
|
18
|
-
</main>
|
|
19
|
-
</d-page>
|
|
20
|
-
```
|
|
21
|
-
|
|
22
|
-
## ID Generation
|
|
23
|
-
|
|
24
|
-
The `id` computed property creates a consistent hash from the route path:
|
|
25
|
-
|
|
26
|
-
```javascript
|
|
27
|
-
const id = computed(() => {
|
|
28
|
-
const path = route.path
|
|
29
|
-
let hash = 5381
|
|
30
|
-
for (let i = 0; i < path.length; i++) {
|
|
31
|
-
hash = (hash * 33) ^ path.charCodeAt(i)
|
|
32
|
-
}
|
|
33
|
-
return hash >>> 0
|
|
34
|
-
})
|
|
35
|
-
```
|
|
36
|
-
|
|
37
|
-
This keeps per-page renderer state isolated when switching between pages. Markdown section headings themselves use GitHub-compatible slugs derived from the heading text, so README-style Table of Contents links keep working.
|
|
38
|
-
|
|
39
|
-
## When to Use
|
|
40
|
-
|
|
41
|
-
DSubpage is automatically used by the router for all documentation pages. You don't need to use it directly unless creating custom page layouts. For standard documentation, the router handles everything:
|
|
42
|
-
|
|
43
|
-
```javascript
|
|
44
|
-
// In routes.js - this happens automatically
|
|
45
|
-
{
|
|
46
|
-
path: 'overview',
|
|
47
|
-
component: () => import('components/DSubpage.vue'),
|
|
48
|
-
meta: { status: config.status }
|
|
49
|
-
}
|
|
50
|
-
```
|
|
51
|
-
|
|
52
|
-
## Relationship with DPage
|
|
53
|
-
|
|
54
|
-
- `DSubpage` **uses** `DPage` as its container
|
|
55
|
-
- `DPage` handles layout (scroll, toolbar, drawer)
|
|
56
|
-
- `DSubpage` handles content composition (H1 + sections)
|
|
57
|
-
|
|
58
|
-
## Built-in Back to Top Control
|
|
59
|
-
|
|
60
|
-
Routed documentation subpages enable DPage's floating back-to-top control automatically. The control is only shown when the content actually overflows, becomes visible after the reader scrolls a little, and visualizes the current reading progress with a circular indicator.
|
|
@@ -1,60 +0,0 @@
|
|
|
1
|
-
## Visão Geral
|
|
2
|
-
|
|
3
|
-
`DSubpage` é um **wrapper de conveniência** que compõe `DPage`, `DH1` e `DPageSection` em um layout de página de documentação padrão. É o componente carregado pelo roteador para cada rota de sub-página.
|
|
4
|
-
|
|
5
|
-
## Como Funciona
|
|
6
|
-
|
|
7
|
-
DSubpage gera um ID numérico determinístico a partir do caminho da rota atual usando uma função hash. Esse ID é passado ao `DPageSection` para manter estáveis os índices internos do renderer em cada página.
|
|
8
|
-
|
|
9
|
-
## Template
|
|
10
|
-
|
|
11
|
-
```html
|
|
12
|
-
<d-page show-back-to-top-control>
|
|
13
|
-
<header>
|
|
14
|
-
<d-h1 :id="0" />
|
|
15
|
-
</header>
|
|
16
|
-
<main>
|
|
17
|
-
<d-page-section :id="id" />
|
|
18
|
-
</main>
|
|
19
|
-
</d-page>
|
|
20
|
-
```
|
|
21
|
-
|
|
22
|
-
## Geração de ID
|
|
23
|
-
|
|
24
|
-
A propriedade computada `id` cria um hash consistente a partir do caminho da rota:
|
|
25
|
-
|
|
26
|
-
```javascript
|
|
27
|
-
const id = computed(() => {
|
|
28
|
-
const path = route.path
|
|
29
|
-
let hash = 5381
|
|
30
|
-
for (let i = 0; i < path.length; i++) {
|
|
31
|
-
hash = (hash * 33) ^ path.charCodeAt(i)
|
|
32
|
-
}
|
|
33
|
-
return hash >>> 0
|
|
34
|
-
})
|
|
35
|
-
```
|
|
36
|
-
|
|
37
|
-
Isso mantém o estado interno do renderer isolado ao navegar entre páginas. Os headings Markdown em si usam slugs compatíveis com GitHub derivados do texto do título, então links de Table of Contents no estilo README continuam funcionando.
|
|
38
|
-
|
|
39
|
-
## Quando Usar
|
|
40
|
-
|
|
41
|
-
DSubpage é usado automaticamente pelo roteador para todas as páginas de documentação. Você não precisa usá-lo diretamente, a menos que crie layouts de página customizados. Para documentação padrão, o roteador cuida de tudo:
|
|
42
|
-
|
|
43
|
-
```javascript
|
|
44
|
-
// Em routes.js - isso acontece automaticamente
|
|
45
|
-
{
|
|
46
|
-
path: 'overview',
|
|
47
|
-
component: () => import('components/DSubpage.vue'),
|
|
48
|
-
meta: { status: config.status }
|
|
49
|
-
}
|
|
50
|
-
```
|
|
51
|
-
|
|
52
|
-
## Relação com DPage
|
|
53
|
-
|
|
54
|
-
- `DSubpage` **usa** `DPage` como container
|
|
55
|
-
- `DPage` cuida do layout (scroll, toolbar, drawer)
|
|
56
|
-
- `DSubpage` cuida da composição de conteúdo (H1 + seções)
|
|
57
|
-
|
|
58
|
-
## Controle Integrado de Voltar ao Topo
|
|
59
|
-
|
|
60
|
-
As sub-páginas de documentação roteadas habilitam automaticamente o controle flutuante de voltar ao topo do DPage. O controle só é exibido quando o conteúdo realmente tem overflow, fica visível após uma pequena rolagem do leitor e mostra o progresso atual de leitura com um indicador circular.
|