@ckeditor/ckeditor5-dev-manual-server 56.6.0 → 57.0.0-alpha.1

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 (23) hide show
  1. package/dist/index.d.ts +3 -3
  2. package/dist/index.js +287 -396
  3. package/dist/manual-test-plugin/collect-pages.d.ts +7 -0
  4. package/dist/manual-test-plugin/plugin.d.ts +0 -1
  5. package/dist/manual-test-plugin/types.d.ts +0 -9
  6. package/dist/static-assets-plugin/plugin.d.ts +10 -0
  7. package/dist/{manual-test-plugin → static-assets-plugin}/static-assets.d.ts +0 -1
  8. package/dist/{raw-plugin → svg-plugin}/plugin.d.ts +1 -1
  9. package/dist/utils.d.ts +8 -0
  10. package/package.json +2 -10
  11. package/theme/catalog.css +2 -16
  12. package/theme/catalog.html +0 -1
  13. package/theme/catalog.ts +2 -4
  14. package/theme/manual-bootstrap.css +44 -0
  15. package/theme/manual-bootstrap.ts +105 -0
  16. package/theme/manual-header.css +217 -0
  17. package/theme/manual-header.ts +193 -0
  18. package/theme/manual-instructions.css +130 -0
  19. package/dist/manual-test-plugin/parse-markdown.d.ts +0 -6
  20. package/dist/manual-test-plugin/shell-html.d.ts +0 -14
  21. package/theme/shell.css +0 -361
  22. package/theme/shell.html +0 -46
  23. package/theme/shell.ts +0 -199
package/theme/shell.html DELETED
@@ -1,46 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="en">
3
- <head>
4
- <meta charset="utf-8">
5
- <meta name="viewport" content="width=device-width, initial-scale=1">
6
- <link rel="icon" href="data:image/png;base64,iVBORw0KGgo=">
7
- <title></title>
8
- <script type="module" data-manual-shell-script></script>
9
- <script type="module" data-manual-test-script></script>
10
- </head>
11
- <body>
12
- <template id="manual-shell-template">
13
- <div class="shell">
14
- <a class="shell__pill" href="/" title="Back to test index">&larr; All tests</a>
15
- <span class="shell__divider" aria-hidden="true"></span>
16
- <span class="shell__label">
17
- <span class="shell__label-name" data-manual-shell-field="displayName"></span>
18
- <span class="shell__label-package" data-manual-shell-field="packageName"></span>
19
- </span>
20
- <span class="shell__divider" data-manual-shell-section="instructions" aria-hidden="true"></span>
21
- <button type="button" class="shell__pill" data-manual-shell-section="instructions" data-shell-action="show-instructions" aria-expanded="false">
22
- Instructions
23
- </button>
24
- </div>
25
-
26
- <aside class="shell-instructions" data-manual-shell-section="instructions" aria-hidden="true" inert>
27
- <div class="shell-instructions__inner">
28
- <header class="shell-instructions__header">
29
- <div class="shell-instructions__titles">
30
- <h1 class="shell-instructions__title" data-manual-shell-field="displayName"></h1>
31
- <code class="shell-instructions__package" data-manual-shell-field="packageName"></code>
32
- </div>
33
- <button type="button" class="shell-instructions__close" data-shell-action="close-instructions" aria-label="Close">
34
- <svg viewBox="0 0 16 16" width="16" height="16" aria-hidden="true">
35
- <path fill="currentColor" d="M3.72 3.72a.75.75 0 011.06 0L8 6.94l3.22-3.22a.75.75 0 111.06 1.06L9.06 8l3.22 3.22a.75.75 0 11-1.06 1.06L8 9.06l-3.22 3.22a.75.75 0 01-1.06-1.06L6.94 8 3.72 4.78a.75.75 0 010-1.06z"/>
36
- </svg>
37
- </button>
38
- </header>
39
- <article class="shell-instructions__body"></article>
40
- </div>
41
- </aside>
42
- </template>
43
-
44
- <script id="manual-shell-data" type="application/json"></script>
45
- </body>
46
- </html>
package/theme/shell.ts DELETED
@@ -1,199 +0,0 @@
1
- /**
2
- * @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
3
- * For licensing, see LICENSE.md.
4
- */
5
-
6
- import CKEditorInspector from '@ckeditor/ckeditor5-inspector';
7
-
8
- import './shell.css';
9
-
10
- declare const LICENSE_KEY: string;
11
-
12
- interface ManualData {
13
- displayName: string;
14
- instructionsHtml: string;
15
- packageName: string;
16
- }
17
-
18
- interface ViteHotContextLike {
19
- on( event: string, callback: () => void ): void;
20
- }
21
-
22
- const MANUAL_REFRESH_EVENT_NAME = 'ckeditor5-manual:refresh-available';
23
- const globalTarget = window as any;
24
-
25
- renderManual();
26
- setupManualTestContainerState();
27
- setupManualRefreshPrompt();
28
-
29
- // In direct HTML manual tests, `id="editor"` creates `window.editor` as a named DOM property.
30
- // Reset it so manual tests can safely reuse `window.editor` for the editor instance.
31
- if ( globalTarget.editor instanceof Element ) {
32
- globalTarget.editor = null;
33
- }
34
-
35
- globalTarget.CKEditorInspector ||= CKEditorInspector;
36
- globalTarget.CKEDITOR_GLOBAL_LICENSE_KEY ||= LICENSE_KEY;
37
-
38
- autoAttachInspector();
39
-
40
- /**
41
- * Clones the injected Shell template, fills it with current test metadata,
42
- * and prepends it to the page before the test content is wrapped.
43
- */
44
- function renderManual(): void {
45
- const template = document.querySelector<HTMLTemplateElement>( '#manual-shell-template' )!;
46
- const dataElement = document.querySelector<HTMLScriptElement>( '#manual-shell-data' )!;
47
- const data = JSON.parse( dataElement.textContent! ) as ManualData;
48
- const fragment = template.content.cloneNode( true ) as DocumentFragment;
49
-
50
- for ( const element of fragment.querySelectorAll<HTMLElement>( '[data-manual-shell-field="displayName"]' ) ) {
51
- element.textContent = data.displayName;
52
- }
53
-
54
- for ( const element of fragment.querySelectorAll<HTMLElement>( '[data-manual-shell-field="packageName"]' ) ) {
55
- element.textContent = data.packageName;
56
- }
57
-
58
- if ( data.instructionsHtml ) {
59
- fragment.querySelector<HTMLElement>( '.shell-instructions__body' )!.innerHTML = data.instructionsHtml;
60
- } else {
61
- for ( const element of fragment.querySelectorAll<HTMLElement>( '[data-manual-shell-section="instructions"]' ) ) {
62
- element.remove();
63
- }
64
- }
65
-
66
- template.remove();
67
- dataElement.remove();
68
- document.body.prepend( fragment );
69
- }
70
-
71
- /**
72
- * Sets up shell-related state for the manual test container injected by the HTML transform.
73
- */
74
- function setupManualTestContainerState(): void {
75
- document.body.classList.add( 'shell-enabled' );
76
-
77
- if ( document.querySelector( '.shell-instructions' ) ) {
78
- document.body.classList.add( 'shell-has-instructions' );
79
- }
80
- }
81
-
82
- /**
83
- * Shows a manual refresh prompt when the dev server reports source changes.
84
- */
85
- function setupManualRefreshPrompt(): void {
86
- const hot = ( import.meta as ImportMeta & { hot?: ViteHotContextLike } ).hot;
87
-
88
- if ( !hot ) {
89
- return;
90
- }
91
-
92
- const button = document.createElement( 'button' );
93
-
94
- button.type = 'button';
95
- button.className = 'manual-refresh-prompt';
96
- button.textContent = 'Source changed. Click here to refresh the page.';
97
- button.tabIndex = -1;
98
- button.setAttribute( 'aria-hidden', 'true' );
99
- button.addEventListener( 'click', () => window.location.reload() );
100
-
101
- document.body.appendChild( button );
102
-
103
- hot.on( MANUAL_REFRESH_EVENT_NAME, () => {
104
- button.removeAttribute( 'aria-hidden' );
105
- button.removeAttribute( 'tabindex' );
106
- button.classList.add( 'manual-refresh-prompt--visible' );
107
- } );
108
- }
109
-
110
- function autoAttachInspector(): void {
111
- let editor = globalTarget.editor;
112
-
113
- Object.defineProperty( globalTarget, 'editor', {
114
- configurable: true,
115
- set( value ) {
116
- editor = value;
117
-
118
- if ( editor ) {
119
- CKEditorInspector.attach( editor );
120
- }
121
- },
122
- get() {
123
- return editor;
124
- }
125
- } );
126
- }
127
-
128
- /**
129
- * Opens or closes the instructions panel and synchronizes related accessibility state.
130
- */
131
- function toggleInstructions( isOpen: boolean ): void {
132
- const panel = document.querySelector<HTMLElement>( '.shell-instructions' );
133
- const trigger = document.querySelector<HTMLElement>( '[data-shell-action="show-instructions"]' );
134
-
135
- if ( !panel || !trigger ) {
136
- return;
137
- }
138
-
139
- panel.classList.remove( 'shell-instructions--closing' );
140
-
141
- if ( !isOpen && panel.classList.contains( 'shell-instructions--open' ) ) {
142
- panel.classList.add( 'shell-instructions--closing' );
143
- }
144
-
145
- panel.classList.toggle( 'shell-instructions--open', isOpen );
146
- panel.setAttribute( 'aria-hidden', String( !isOpen ) );
147
- panel.toggleAttribute( 'inert', !isOpen );
148
- trigger.setAttribute( 'aria-expanded', String( isOpen ) );
149
- }
150
-
151
- /**
152
- * Handles clicks on Shell action buttons.
153
- */
154
- document.addEventListener( 'click', event => {
155
- const target = event.target;
156
-
157
- if ( !( target instanceof Element ) ) {
158
- return;
159
- }
160
-
161
- const trigger = target.closest<HTMLElement>( '[data-shell-action]' );
162
-
163
- if ( !trigger ) {
164
- return;
165
- }
166
-
167
- if ( trigger.dataset.shellAction == 'show-instructions' ) {
168
- const panel = document.querySelector<HTMLElement>( '.shell-instructions' )!;
169
-
170
- toggleInstructions( !panel.classList.contains( 'shell-instructions--open' ) );
171
- } else if ( trigger.dataset.shellAction == 'close-instructions' ) {
172
- toggleInstructions( false );
173
- }
174
- } );
175
-
176
- /**
177
- * Cleans up the closing state after the instructions panel transition finishes.
178
- */
179
- document.addEventListener( 'transitionend', event => {
180
- const target = event.target;
181
-
182
- if (
183
- event.propertyName == 'width' &&
184
- target instanceof Element &&
185
- target.classList.contains( 'shell-instructions' ) &&
186
- !target.classList.contains( 'shell-instructions--open' )
187
- ) {
188
- target.classList.remove( 'shell-instructions--closing' );
189
- }
190
- } );
191
-
192
- /**
193
- * Allows closing the instructions panel with Escape.
194
- */
195
- document.addEventListener( 'keydown', event => {
196
- if ( event.key == 'Escape' ) {
197
- toggleInstructions( false );
198
- }
199
- } );