@pixelersagency/okno-bridge 1.0.0-beta.2 → 1.0.0-beta.4
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/dist/okno-bridge.js +19 -22
- package/package.json +1 -1
- package/src/index.js +19 -22
package/dist/okno-bridge.js
CHANGED
|
@@ -64,15 +64,6 @@
|
|
|
64
64
|
/** Attente de stabilisation du DOM avant re-collecte (rendus successifs de React). */
|
|
65
65
|
const SETTLE_MS = 120;
|
|
66
66
|
|
|
67
|
-
/** Noms lisibles des fournisseurs de contenu courants. */
|
|
68
|
-
const PROVIDERS = {
|
|
69
|
-
wordpress: 'WordPress',
|
|
70
|
-
menu: 'Menus WordPress',
|
|
71
|
-
acf: 'ACF',
|
|
72
|
-
woocommerce: 'WooCommerce',
|
|
73
|
-
jetengine: 'JetEngine',
|
|
74
|
-
};
|
|
75
|
-
|
|
76
67
|
/** Balises retirées de tout HTML injecté dans l'aperçu. */
|
|
77
68
|
const BANNED_TAGS = [ 'script', 'style', 'iframe', 'object', 'embed', 'link', 'meta', 'base', 'form' ];
|
|
78
69
|
|
|
@@ -88,7 +79,7 @@
|
|
|
88
79
|
|
|
89
80
|
const wpOrigin = options && options.wpOrigin;
|
|
90
81
|
if ( ! wpOrigin ) {
|
|
91
|
-
console.warn( '[okno] wpOrigin
|
|
82
|
+
console.warn( '[okno] Missing wpOrigin: bridge inactive.' );
|
|
92
83
|
return;
|
|
93
84
|
}
|
|
94
85
|
|
|
@@ -143,7 +134,7 @@
|
|
|
143
134
|
cloakTimer = setTimeout( () => {
|
|
144
135
|
uncloak();
|
|
145
136
|
send( { type: 'cloakTimeout' } );
|
|
146
|
-
console.warn( '[okno] wp-admin
|
|
137
|
+
console.warn( '[okno] wp-admin did not respond: preview shown without hydration.' );
|
|
147
138
|
}, cloakDelay );
|
|
148
139
|
}
|
|
149
140
|
|
|
@@ -165,24 +156,29 @@
|
|
|
165
156
|
return host ? host.getAttribute( 'data-wp-post' ) : '';
|
|
166
157
|
}
|
|
167
158
|
|
|
168
|
-
|
|
159
|
+
// Libellé vide = libellé par défaut, composé et traduit côté éditeur
|
|
160
|
+
// (le bridge ne connaît pas la langue de wp-admin) ; voir sectionAuto().
|
|
161
|
+
function sectionLabel( el ) {
|
|
169
162
|
const explicit = el.getAttribute( 'data-okno-section' ) || el.getAttribute( 'aria-label' );
|
|
170
163
|
if ( explicit ) {
|
|
171
164
|
return explicit;
|
|
172
165
|
}
|
|
173
166
|
const tag = el.tagName.toLowerCase();
|
|
174
|
-
if ( 'header' === tag ) {
|
|
175
|
-
return '
|
|
176
|
-
}
|
|
177
|
-
if ( 'footer' === tag ) {
|
|
178
|
-
return 'Pied de page';
|
|
167
|
+
if ( 'header' === tag || 'footer' === tag ) {
|
|
168
|
+
return '';
|
|
179
169
|
}
|
|
180
170
|
const heading = el.querySelector( 'h1, h2, h3' );
|
|
181
171
|
if ( heading && heading.textContent.trim() ) {
|
|
182
172
|
const text = heading.textContent.trim().replace( /\s+/g, ' ' );
|
|
183
173
|
return text.length > 48 ? text.slice( 0, 45 ) + '…' : text;
|
|
184
174
|
}
|
|
185
|
-
return '
|
|
175
|
+
return '';
|
|
176
|
+
}
|
|
177
|
+
|
|
178
|
+
/** Nature du libellé par défaut : 'header', 'footer' ou 'section' (numérotée). */
|
|
179
|
+
function sectionAuto( el ) {
|
|
180
|
+
const tag = el.tagName.toLowerCase();
|
|
181
|
+
return 'header' === tag || 'footer' === tag ? tag : 'section';
|
|
186
182
|
}
|
|
187
183
|
|
|
188
184
|
function sectionLayout( el ) {
|
|
@@ -233,7 +229,8 @@
|
|
|
233
229
|
el.setAttribute( 'data-okno-sid', id );
|
|
234
230
|
nextSections.push( {
|
|
235
231
|
id,
|
|
236
|
-
label: sectionLabel( el
|
|
232
|
+
label: sectionLabel( el ),
|
|
233
|
+
auto: sectionAuto( el ),
|
|
237
234
|
layout: sectionLayout( el ),
|
|
238
235
|
el,
|
|
239
236
|
fields: [],
|
|
@@ -274,7 +271,7 @@
|
|
|
274
271
|
return JSON.stringify( [
|
|
275
272
|
window.location.pathname,
|
|
276
273
|
[ ...fields.keys() ].sort(),
|
|
277
|
-
sections.map( ( s ) => [ s.label, s.layout && s.layout.path, s.layout && s.layout.index ] ),
|
|
274
|
+
sections.map( ( s ) => [ s.label, s.auto, s.layout && s.layout.path, s.layout && s.layout.index ] ),
|
|
278
275
|
] );
|
|
279
276
|
}
|
|
280
277
|
|
|
@@ -388,7 +385,7 @@
|
|
|
388
385
|
version: VERSION,
|
|
389
386
|
url: window.location.href,
|
|
390
387
|
posts,
|
|
391
|
-
sections: sections.map( ( s ) => ( { id: s.id, label: s.label, layout: s.layout, fields: s.fields } ) ),
|
|
388
|
+
sections: sections.map( ( s ) => ( { id: s.id, label: s.label, auto: s.auto, layout: s.layout, fields: s.fields } ) ),
|
|
392
389
|
} );
|
|
393
390
|
}
|
|
394
391
|
|
|
@@ -508,7 +505,7 @@
|
|
|
508
505
|
send( {
|
|
509
506
|
type: 'managedFocus',
|
|
510
507
|
provider,
|
|
511
|
-
label: managed.getAttribute( 'data-okno-managed-label' ) || '
|
|
508
|
+
label: managed.getAttribute( 'data-okno-managed-label' ) || '',
|
|
512
509
|
editUrl: managed.getAttribute( 'data-okno-edit-url' ) || '',
|
|
513
510
|
} );
|
|
514
511
|
return;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pixelersagency/okno-bridge",
|
|
3
|
-
"version": "1.0.0-beta.
|
|
3
|
+
"version": "1.0.0-beta.4",
|
|
4
4
|
"description": "Pont postMessage de l'éditeur visuel Okno : rend n'importe quel site (React, Next.js, Remix, Vite, Nuxt, SvelteKit, Astro, HTML) éditable depuis WordPress. Zéro dépendance, inactif hors de l'éditeur.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"wordpress",
|
package/src/index.js
CHANGED
|
@@ -47,15 +47,6 @@ const CLOAK_CLASS = 'okno-cloak';
|
|
|
47
47
|
/** Attente de stabilisation du DOM avant re-collecte (rendus successifs de React). */
|
|
48
48
|
const SETTLE_MS = 120;
|
|
49
49
|
|
|
50
|
-
/** Noms lisibles des fournisseurs de contenu courants. */
|
|
51
|
-
const PROVIDERS = {
|
|
52
|
-
wordpress: 'WordPress',
|
|
53
|
-
menu: 'Menus WordPress',
|
|
54
|
-
acf: 'ACF',
|
|
55
|
-
woocommerce: 'WooCommerce',
|
|
56
|
-
jetengine: 'JetEngine',
|
|
57
|
-
};
|
|
58
|
-
|
|
59
50
|
/** Balises retirées de tout HTML injecté dans l'aperçu. */
|
|
60
51
|
const BANNED_TAGS = [ 'script', 'style', 'iframe', 'object', 'embed', 'link', 'meta', 'base', 'form' ];
|
|
61
52
|
|
|
@@ -71,7 +62,7 @@ export function initOknoBridge( options ) {
|
|
|
71
62
|
|
|
72
63
|
const wpOrigin = options && options.wpOrigin;
|
|
73
64
|
if ( ! wpOrigin ) {
|
|
74
|
-
console.warn( '[okno] wpOrigin
|
|
65
|
+
console.warn( '[okno] Missing wpOrigin: bridge inactive.' );
|
|
75
66
|
return;
|
|
76
67
|
}
|
|
77
68
|
|
|
@@ -126,7 +117,7 @@ export function initOknoBridge( options ) {
|
|
|
126
117
|
cloakTimer = setTimeout( () => {
|
|
127
118
|
uncloak();
|
|
128
119
|
send( { type: 'cloakTimeout' } );
|
|
129
|
-
console.warn( '[okno] wp-admin
|
|
120
|
+
console.warn( '[okno] wp-admin did not respond: preview shown without hydration.' );
|
|
130
121
|
}, cloakDelay );
|
|
131
122
|
}
|
|
132
123
|
|
|
@@ -148,24 +139,29 @@ export function initOknoBridge( options ) {
|
|
|
148
139
|
return host ? host.getAttribute( 'data-wp-post' ) : '';
|
|
149
140
|
}
|
|
150
141
|
|
|
151
|
-
|
|
142
|
+
// Libellé vide = libellé par défaut, composé et traduit côté éditeur
|
|
143
|
+
// (le bridge ne connaît pas la langue de wp-admin) ; voir sectionAuto().
|
|
144
|
+
function sectionLabel( el ) {
|
|
152
145
|
const explicit = el.getAttribute( 'data-okno-section' ) || el.getAttribute( 'aria-label' );
|
|
153
146
|
if ( explicit ) {
|
|
154
147
|
return explicit;
|
|
155
148
|
}
|
|
156
149
|
const tag = el.tagName.toLowerCase();
|
|
157
|
-
if ( 'header' === tag ) {
|
|
158
|
-
return '
|
|
159
|
-
}
|
|
160
|
-
if ( 'footer' === tag ) {
|
|
161
|
-
return 'Pied de page';
|
|
150
|
+
if ( 'header' === tag || 'footer' === tag ) {
|
|
151
|
+
return '';
|
|
162
152
|
}
|
|
163
153
|
const heading = el.querySelector( 'h1, h2, h3' );
|
|
164
154
|
if ( heading && heading.textContent.trim() ) {
|
|
165
155
|
const text = heading.textContent.trim().replace( /\s+/g, ' ' );
|
|
166
156
|
return text.length > 48 ? text.slice( 0, 45 ) + '…' : text;
|
|
167
157
|
}
|
|
168
|
-
return '
|
|
158
|
+
return '';
|
|
159
|
+
}
|
|
160
|
+
|
|
161
|
+
/** Nature du libellé par défaut : 'header', 'footer' ou 'section' (numérotée). */
|
|
162
|
+
function sectionAuto( el ) {
|
|
163
|
+
const tag = el.tagName.toLowerCase();
|
|
164
|
+
return 'header' === tag || 'footer' === tag ? tag : 'section';
|
|
169
165
|
}
|
|
170
166
|
|
|
171
167
|
function sectionLayout( el ) {
|
|
@@ -216,7 +212,8 @@ export function initOknoBridge( options ) {
|
|
|
216
212
|
el.setAttribute( 'data-okno-sid', id );
|
|
217
213
|
nextSections.push( {
|
|
218
214
|
id,
|
|
219
|
-
label: sectionLabel( el
|
|
215
|
+
label: sectionLabel( el ),
|
|
216
|
+
auto: sectionAuto( el ),
|
|
220
217
|
layout: sectionLayout( el ),
|
|
221
218
|
el,
|
|
222
219
|
fields: [],
|
|
@@ -257,7 +254,7 @@ export function initOknoBridge( options ) {
|
|
|
257
254
|
return JSON.stringify( [
|
|
258
255
|
window.location.pathname,
|
|
259
256
|
[ ...fields.keys() ].sort(),
|
|
260
|
-
sections.map( ( s ) => [ s.label, s.layout && s.layout.path, s.layout && s.layout.index ] ),
|
|
257
|
+
sections.map( ( s ) => [ s.label, s.auto, s.layout && s.layout.path, s.layout && s.layout.index ] ),
|
|
261
258
|
] );
|
|
262
259
|
}
|
|
263
260
|
|
|
@@ -371,7 +368,7 @@ export function initOknoBridge( options ) {
|
|
|
371
368
|
version: VERSION,
|
|
372
369
|
url: window.location.href,
|
|
373
370
|
posts,
|
|
374
|
-
sections: sections.map( ( s ) => ( { id: s.id, label: s.label, layout: s.layout, fields: s.fields } ) ),
|
|
371
|
+
sections: sections.map( ( s ) => ( { id: s.id, label: s.label, auto: s.auto, layout: s.layout, fields: s.fields } ) ),
|
|
375
372
|
} );
|
|
376
373
|
}
|
|
377
374
|
|
|
@@ -491,7 +488,7 @@ export function initOknoBridge( options ) {
|
|
|
491
488
|
send( {
|
|
492
489
|
type: 'managedFocus',
|
|
493
490
|
provider,
|
|
494
|
-
label: managed.getAttribute( 'data-okno-managed-label' ) || '
|
|
491
|
+
label: managed.getAttribute( 'data-okno-managed-label' ) || '',
|
|
495
492
|
editUrl: managed.getAttribute( 'data-okno-edit-url' ) || '',
|
|
496
493
|
} );
|
|
497
494
|
return;
|