Gutenberg / 12.6.0

Gutenberg v12.6.0

gutenberg / build / element / index.js

index.js in Gutenberg 12.6.0, at build/element/index.js

1,301 lines 40.1 KB

Raw Download Zip

1	/******/ (function() { // webpackBootstrap
2	/******/ "use strict";
3	/******/ // The require scope
4	/******/ var __webpack_require__ = {};
5	/******/
6	/************************************************************************/
7	/*****/ / webpack/runtime/define property getters */
8	/******/ !function() {
9	/******/ // define getter functions for harmony exports
10	/******/ __webpack_require__.d = function(exports, definition) {
11	/******/ for(var key in definition) {
12	/******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
13	/******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
14	/******/ }
15	/******/ }
16	/******/ };
17	/******/ }();
18	/******/
19	/*****/ / webpack/runtime/hasOwnProperty shorthand */
20	/******/ !function() {
21	/******/ __webpack_require__.o = function(obj, prop) { return Object.prototype.hasOwnProperty.call(obj, prop); }
22	/******/ }();
23	/******/
24	/*****/ / webpack/runtime/make namespace object */
25	/******/ !function() {
26	/******/ // define __esModule on exports
27	/******/ __webpack_require__.r = function(exports) {
28	/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
29	/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
30	/******/ }
31	/******/ Object.defineProperty(exports, '__esModule', { value: true });
32	/******/ };
33	/******/ }();
34	/******/
35	/************************************************************************/
36	var __webpack_exports__ = {};
37	// ESM COMPAT FLAG
38	__webpack_require__.r(__webpack_exports__);
39
40	// EXPORTS
41	__webpack_require__.d(__webpack_exports__, {
42	"Children": function() { return /* reexport */ external_React_namespaceObject.Children; },
43	"Component": function() { return /* reexport */ external_React_namespaceObject.Component; },
44	"Fragment": function() { return /* reexport */ external_React_namespaceObject.Fragment; },
45	"Platform": function() { return /* reexport */ platform; },
46	"RawHTML": function() { return /* reexport */ RawHTML; },
47	"StrictMode": function() { return /* reexport */ external_React_namespaceObject.StrictMode; },
48	"Suspense": function() { return /* reexport */ external_React_namespaceObject.Suspense; },
49	"cloneElement": function() { return /* reexport */ external_React_namespaceObject.cloneElement; },
50	"concatChildren": function() { return /* reexport */ concatChildren; },
51	"createContext": function() { return /* reexport */ external_React_namespaceObject.createContext; },
52	"createElement": function() { return /* reexport */ external_React_namespaceObject.createElement; },
53	"createInterpolateElement": function() { return /* reexport */ create_interpolate_element; },
54	"createPortal": function() { return /* reexport */ external_ReactDOM_namespaceObject.createPortal; },
55	"createRef": function() { return /* reexport */ external_React_namespaceObject.createRef; },
56	"findDOMNode": function() { return /* reexport */ external_ReactDOM_namespaceObject.findDOMNode; },
57	"forwardRef": function() { return /* reexport */ external_React_namespaceObject.forwardRef; },
58	"isEmptyElement": function() { return /* reexport */ isEmptyElement; },
59	"isValidElement": function() { return /* reexport */ external_React_namespaceObject.isValidElement; },
60	"lazy": function() { return /* reexport */ external_React_namespaceObject.lazy; },
61	"memo": function() { return /* reexport */ external_React_namespaceObject.memo; },
62	"render": function() { return /* reexport */ external_ReactDOM_namespaceObject.render; },
63	"renderToString": function() { return /* reexport */ serialize; },
64	"switchChildrenNodeName": function() { return /* reexport */ switchChildrenNodeName; },
65	"unmountComponentAtNode": function() { return /* reexport */ external_ReactDOM_namespaceObject.unmountComponentAtNode; },
66	"useCallback": function() { return /* reexport */ external_React_namespaceObject.useCallback; },
67	"useContext": function() { return /* reexport */ external_React_namespaceObject.useContext; },
68	"useDebugValue": function() { return /* reexport */ external_React_namespaceObject.useDebugValue; },
69	"useEffect": function() { return /* reexport */ external_React_namespaceObject.useEffect; },
70	"useImperativeHandle": function() { return /* reexport */ external_React_namespaceObject.useImperativeHandle; },
71	"useLayoutEffect": function() { return /* reexport */ external_React_namespaceObject.useLayoutEffect; },
72	"useMemo": function() { return /* reexport */ external_React_namespaceObject.useMemo; },
73	"useReducer": function() { return /* reexport */ external_React_namespaceObject.useReducer; },
74	"useRef": function() { return /* reexport */ external_React_namespaceObject.useRef; },
75	"useState": function() { return /* reexport */ external_React_namespaceObject.useState; }
76	});
77
78	;// CONCATENATED MODULE: external "React"
79	var external_React_namespaceObject = window["React"];
80	;// CONCATENATED MODULE: ./packages/element/build-module/create-interpolate-element.js
81	/**
82	* Internal dependencies
83	*/
84
85	/** @typedef {import('./react').WPElement} WPElement */
86
87	let indoc, offset, output, stack;
88	/**
89	* Matches tags in the localized string
90	*
91	* This is used for extracting the tag pattern groups for parsing the localized
92	* string and along with the map converting it to a react element.
93	*
94	* There are four references extracted using this tokenizer:
95	*
96	* match: Full match of the tag (i.e. <strong>, </strong>, <br/>)
97	* isClosing: The closing slash, it it exists.
98	* name: The name portion of the tag (strong, br) (if )
99	* isSelfClosed: The slash on a self closing tag, if it exists.
100	*
101	* @type {RegExp}
102	*/
103
104	const tokenizer = /<(\/)?(\w+)\s*(\/)?>/g;
105	/**
106	* The stack frame tracking parse progress.
107	*
108	* @typedef Frame
109	*
110	* @property {WPElement} element A parent element which may still have
111	* @property {number} tokenStart Offset at which parent element first
112	* appears.
113	* @property {number} tokenLength Length of string marking start of parent
114	* element.
115	* @property {number} [prevOffset] Running offset at which parsing should
116	* continue.
117	* @property {number} [leadingTextStart] Offset at which last closing element
118	* finished, used for finding text between
119	* elements.
120	* @property {WPElement[]} children Children.
121	*/
122
123	/**
124	* Tracks recursive-descent parse state.
125	*
126	* This is a Stack frame holding parent elements until all children have been
127	* parsed.
128	*
129	* @private
130	* @param {WPElement} element A parent element which may still have
131	* nested children not yet parsed.
132	* @param {number} tokenStart Offset at which parent element first
133	* appears.
134	* @param {number} tokenLength Length of string marking start of parent
135	* element.
136	* @param {number} [prevOffset] Running offset at which parsing should
137	* continue.
138	* @param {number} [leadingTextStart] Offset at which last closing element
139	* finished, used for finding text between
140	* elements.
141	*
142	* @return {Frame} The stack frame tracking parse progress.
143	*/
144
145	function createFrame(element, tokenStart, tokenLength, prevOffset, leadingTextStart) {
146	return {
147	element,
148	tokenStart,
149	tokenLength,
150	prevOffset,
151	leadingTextStart,
152	children: []
153	};
154	}
155	/**
156	* This function creates an interpolated element from a passed in string with
157	* specific tags matching how the string should be converted to an element via
158	* the conversion map value.
159	*
160	* @example
161	* For example, for the given string:
162	*
163	* "This is a <span>string</span> with <a>a link</a> and a self-closing
164	* <CustomComponentB/> tag"
165	*
166	* You would have something like this as the conversionMap value:
167	*
168	* ```js
169	* {
170	* span: <span />,
171	* a: <a href={ 'https://github.com' } />,
172	* CustomComponentB: <CustomComponent />,
173	* }
174	* ```
175	*
176	* @param {string} interpolatedString The interpolation string to be parsed.
177	* @param {Object} conversionMap The map used to convert the string to
178	* a react element.
179	* @throws {TypeError}
180	* @return {WPElement} A wp element.
181	*/
182
183
184	const createInterpolateElement = (interpolatedString, conversionMap) => {
185	indoc = interpolatedString;
186	offset = 0;
187	output = [];
188	stack = [];
189	tokenizer.lastIndex = 0;
190
191	if (!isValidConversionMap(conversionMap)) {
192	throw new TypeError('The conversionMap provided is not valid. It must be an object with values that are WPElements');
193	}
194
195	do {// twiddle our thumbs
196	} while (proceed(conversionMap));
197
198	return (0,external_React_namespaceObject.createElement)(external_React_namespaceObject.Fragment, null, ...output);
199	};
200	/**
201	* Validate conversion map.
202	*
203	* A map is considered valid if it's an object and every value in the object
204	* is a WPElement
205	*
206	* @private
207	*
208	* @param {Object} conversionMap The map being validated.
209	*
210	* @return {boolean} True means the map is valid.
211	*/
212
213
214	const isValidConversionMap = conversionMap => {
215	const isObject = typeof conversionMap === 'object';
216	const values = isObject && Object.values(conversionMap);
217	return isObject && values.length && values.every(element => (0,external_React_namespaceObject.isValidElement)(element));
218	};
219	/**
220	* This is the iterator over the matches in the string.
221	*
222	* @private
223	*
224	* @param {Object} conversionMap The conversion map for the string.
225	*
226	* @return {boolean} true for continuing to iterate, false for finished.
227	*/
228
229
230	function proceed(conversionMap) {
231	const next = nextToken();
232	const [tokenType, name, startOffset, tokenLength] = next;
233	const stackDepth = stack.length;
234	const leadingTextStart = startOffset > offset ? offset : null;
235
236	if (!conversionMap[name]) {
237	addText();
238	return false;
239	}
240
241	switch (tokenType) {
242	case 'no-more-tokens':
243	if (stackDepth !== 0) {
244	const {
245	leadingTextStart: stackLeadingText,
246	tokenStart
247	} = stack.pop();
248	output.push(indoc.substr(stackLeadingText, tokenStart));
249	}
250
251	addText();
252	return false;
253
254	case 'self-closed':
255	if (0 === stackDepth) {
256	if (null !== leadingTextStart) {
257	output.push(indoc.substr(leadingTextStart, startOffset - leadingTextStart));
258	}
259
260	output.push(conversionMap[name]);
261	offset = startOffset + tokenLength;
262	return true;
263	} // otherwise we found an inner element
264
265
266	addChild(createFrame(conversionMap[name], startOffset, tokenLength));
267	offset = startOffset + tokenLength;
268	return true;
269
270	case 'opener':
271	stack.push(createFrame(conversionMap[name], startOffset, tokenLength, startOffset + tokenLength, leadingTextStart));
272	offset = startOffset + tokenLength;
273	return true;
274
275	case 'closer':
276	// if we're not nesting then this is easy - close the block
277	if (1 === stackDepth) {
278	closeOuterElement(startOffset);
279	offset = startOffset + tokenLength;
280	return true;
281	} // otherwise we're nested and we have to close out the current
282	// block and add it as a innerBlock to the parent
283
284
285	const stackTop = stack.pop();
286	const text = indoc.substr(stackTop.prevOffset, startOffset - stackTop.prevOffset);
287	stackTop.children.push(text);
288	stackTop.prevOffset = startOffset + tokenLength;
289	const frame = createFrame(stackTop.element, stackTop.tokenStart, stackTop.tokenLength, startOffset + tokenLength);
290	frame.children = stackTop.children;
291	addChild(frame);
292	offset = startOffset + tokenLength;
293	return true;
294
295	default:
296	addText();
297	return false;
298	}
299	}
300	/**
301	* Grabs the next token match in the string and returns it's details.
302	*
303	* @private
304	*
305	* @return {Array} An array of details for the token matched.
306	*/
307
308
309	function nextToken() {
310	const matches = tokenizer.exec(indoc); // we have no more tokens
311
312	if (null === matches) {
313	return ['no-more-tokens'];
314	}
315
316	const startedAt = matches.index;
317	const [match, isClosing, name, isSelfClosed] = matches;
318	const length = match.length;
319
320	if (isSelfClosed) {
321	return ['self-closed', name, startedAt, length];
322	}
323
324	if (isClosing) {
325	return ['closer', name, startedAt, length];
326	}
327
328	return ['opener', name, startedAt, length];
329	}
330	/**
331	* Pushes text extracted from the indoc string to the output stack given the
332	* current rawLength value and offset (if rawLength is provided ) or the
333	* indoc.length and offset.
334	*
335	* @private
336	*/
337
338
339	function addText() {
340	const length = indoc.length - offset;
341
342	if (0 === length) {
343	return;
344	}
345
346	output.push(indoc.substr(offset, length));
347	}
348	/**
349	* Pushes a child element to the associated parent element's children for the
350	* parent currently active in the stack.
351	*
352	* @private
353	*
354	* @param {Frame} frame The Frame containing the child element and it's
355	* token information.
356	*/
357
358
359	function addChild(frame) {
360	const {
361	element,
362	tokenStart,
363	tokenLength,
364	prevOffset,
365	children
366	} = frame;
367	const parent = stack[stack.length - 1];
368	const text = indoc.substr(parent.prevOffset, tokenStart - parent.prevOffset);
369
370	if (text) {
371	parent.children.push(text);
372	}
373
374	parent.children.push((0,external_React_namespaceObject.cloneElement)(element, null, ...children));
375	parent.prevOffset = prevOffset ? prevOffset : tokenStart + tokenLength;
376	}
377	/**
378	* This is called for closing tags. It creates the element currently active in
379	* the stack.
380	*
381	* @private
382	*
383	* @param {number} endOffset Offset at which the closing tag for the element
384	* begins in the string. If this is greater than the
385	* prevOffset attached to the element, then this
386	* helps capture any remaining nested text nodes in
387	* the element.
388	*/
389
390
391	function closeOuterElement(endOffset) {
392	const {
393	element,
394	leadingTextStart,
395	prevOffset,
396	tokenStart,
397	children
398	} = stack.pop();
399	const text = endOffset ? indoc.substr(prevOffset, endOffset - prevOffset) : indoc.substr(prevOffset);
400
401	if (text) {
402	children.push(text);
403	}
404
405	if (null !== leadingTextStart) {
406	output.push(indoc.substr(leadingTextStart, tokenStart - leadingTextStart));
407	}
408
409	output.push((0,external_React_namespaceObject.cloneElement)(element, null, ...children));
410	}
411
412	/* harmony default export */ var create_interpolate_element = (createInterpolateElement);
413	//# sourceMappingURL=create-interpolate-element.js.map
414	;// CONCATENATED MODULE: external "lodash"
415	var external_lodash_namespaceObject = window["lodash"];
416	;// CONCATENATED MODULE: ./packages/element/build-module/react.js
417	/**
418	* External dependencies
419	*/
420	// eslint-disable-next-line @typescript-eslint/no-restricted-imports
421
422
423	/**
424	* Object containing a React element.
425	*
426	* @typedef {import('react').ReactElement} WPElement
427	*/
428
429	/**
430	* Object containing a React component.
431	*
432	* @typedef {import('react').ComponentType} WPComponent
433	*/
434
435	/**
436	* Object containing a React synthetic event.
437	*
438	* @typedef {import('react').SyntheticEvent} WPSyntheticEvent
439	*/
440
441	/**
442	* Object that provides utilities for dealing with React children.
443	*/
444
445
446	/**
447	* Creates a copy of an element with extended props.
448	*
449	* @param {WPElement} element Element
450	* @param {?Object} props Props to apply to cloned element
451	*
452	* @return {WPElement} Cloned element.
453	*/
454
455
456	/**
457	* A base class to create WordPress Components (Refs, state and lifecycle hooks)
458	*/
459
460
461	/**
462	* Creates a context object containing two components: a provider and consumer.
463	*
464	* @param {Object} defaultValue A default data stored in the context.
465	*
466	* @return {Object} Context object.
467	*/
468
469
470	/**
471	* Returns a new element of given type. Type can be either a string tag name or
472	* another function which itself returns an element.
473	*
474	* @param {?(string\|Function)} type Tag name or element creator
475	* @param {Object} props Element properties, either attribute
476	* set to apply to DOM node or values to
477	* pass through to element creator
478	* @param {...WPElement} children Descendant elements
479	*
480	* @return {WPElement} Element.
481	*/
482
483
484	/**
485	* Returns an object tracking a reference to a rendered element via its
486	* `current` property as either a DOMElement or Element, dependent upon the
487	* type of element rendered with the ref attribute.
488	*
489	* @return {Object} Ref object.
490	*/
491
492
493	/**
494	* Component enhancer used to enable passing a ref to its wrapped component.
495	* Pass a function argument which receives `props` and `ref` as its arguments,
496	* returning an element using the forwarded ref. The return value is a new
497	* component which forwards its ref.
498	*
499	* @param {Function} forwarder Function passed `props` and `ref`, expected to
500	* return an element.
501	*
502	* @return {WPComponent} Enhanced component.
503	*/
504
505
506	/**
507	* A component which renders its children without any wrapping element.
508	*/
509
510
511	/**
512	* Checks if an object is a valid WPElement.
513	*
514	* @param {Object} objectToCheck The object to be checked.
515	*
516	* @return {boolean} true if objectToTest is a valid WPElement and false otherwise.
517	*/
518
519
520	/**
521	* @see https://reactjs.org/docs/react-api.html#reactmemo
522	*/
523
524
525	/**
526	* Component that activates additional checks and warnings for its descendants.
527	*/
528
529
530	/**
531	* @see https://reactjs.org/docs/hooks-reference.html#usecallback
532	*/
533
534
535	/**
536	* @see https://reactjs.org/docs/hooks-reference.html#usecontext
537	*/
538
539
540	/**
541	* @see https://reactjs.org/docs/hooks-reference.html#usedebugvalue
542	*/
543
544
545	/**
546	* @see https://reactjs.org/docs/hooks-reference.html#useeffect
547	*/
548
549
550	/**
551	* @see https://reactjs.org/docs/hooks-reference.html#useimperativehandle
552	*/
553
554
555	/**
556	* @see https://reactjs.org/docs/hooks-reference.html#uselayouteffect
557	*/
558
559
560	/**
561	* @see https://reactjs.org/docs/hooks-reference.html#usememo
562	*/
563
564
565	/**
566	* @see https://reactjs.org/docs/hooks-reference.html#usereducer
567	*/
568
569
570	/**
571	* @see https://reactjs.org/docs/hooks-reference.html#useref
572	*/
573
574
575	/**
576	* @see https://reactjs.org/docs/hooks-reference.html#usestate
577	*/
578
579
580	/**
581	* @see https://reactjs.org/docs/react-api.html#reactlazy
582	*/
583
584
585	/**
586	* @see https://reactjs.org/docs/react-api.html#reactsuspense
587	*/
588
589
590	/**
591	* Concatenate two or more React children objects.
592	*
593	* @param {...?Object} childrenArguments Array of children arguments (array of arrays/strings/objects) to concatenate.
594	*
595	* @return {Array} The concatenated value.
596	*/
597
598	function concatChildren() {
599	for (var _len = arguments.length, childrenArguments = new Array(_len), _key = 0; _key < _len; _key++) {
600	childrenArguments[_key] = arguments[_key];
601	}
602
603	return childrenArguments.reduce((accumulator, children, i) => {
604	external_React_namespaceObject.Children.forEach(children, (child, j) => {
605	if (child && 'string' !== typeof child) {
606	child = (0,external_React_namespaceObject.cloneElement)(child, {
607	key: [i, j].join()
608	});
609	}
610
611	accumulator.push(child);
612	});
613	return accumulator;
614	}, []);
615	}
616	/**
617	* Switches the nodeName of all the elements in the children object.
618	*
619	* @param {?Object} children Children object.
620	* @param {string} nodeName Node name.
621	*
622	* @return {?Object} The updated children object.
623	*/
624
625	function switchChildrenNodeName(children, nodeName) {
626	return children && external_React_namespaceObject.Children.map(children, (elt, index) => {
627	if ((0,external_lodash_namespaceObject.isString)(elt)) {
628	return (0,external_React_namespaceObject.createElement)(nodeName, {
629	key: index
630	}, elt);
631	}
632
633	const {
634	children: childrenProp,
635	...props
636	} = elt.props;
637	return (0,external_React_namespaceObject.createElement)(nodeName, {
638	key: index,
639	...props
640	}, childrenProp);
641	});
642	}
643	//# sourceMappingURL=react.js.map
644	;// CONCATENATED MODULE: external "ReactDOM"
645	var external_ReactDOM_namespaceObject = window["ReactDOM"];
646	;// CONCATENATED MODULE: ./packages/element/build-module/react-platform.js
647	/**
648	* External dependencies
649	*/
650
651	/**
652	* Creates a portal into which a component can be rendered.
653	*
654	* @see https://github.com/facebook/react/issues/10309#issuecomment-318433235
655	*
656	* @param {import('./react').WPElement} child Any renderable child, such as an element,
657	* string, or fragment.
658	* @param {HTMLElement} container DOM node into which element should be rendered.
659	*/
660
661
662	/**
663	* Finds the dom node of a React component.
664	*
665	* @param {import('./react').WPComponent} component Component's instance.
666	*/
667
668
669	/**
670	* Renders a given element into the target DOM node.
671	*
672	* @param {import('./react').WPElement} element Element to render.
673	* @param {HTMLElement} target DOM node into which element should be rendered.
674	*/
675
676
677	/**
678	* Removes any mounted element from the target DOM node.
679	*
680	* @param {Element} target DOM node in which element is to be removed
681	*/
682
683
684	//# sourceMappingURL=react-platform.js.map
685	;// CONCATENATED MODULE: ./packages/element/build-module/utils.js
686	/**
687	* External dependencies
688	*/
689
690	/**
691	* Checks if the provided WP element is empty.
692	*
693	* @param {*} element WP element to check.
694	* @return {boolean} True when an element is considered empty.
695	*/
696
697	const isEmptyElement = element => {
698	if ((0,external_lodash_namespaceObject.isNumber)(element)) {
699	return false;
700	}
701
702	if ((0,external_lodash_namespaceObject.isString)(element) \|\| (0,external_lodash_namespaceObject.isArray)(element)) {
703	return !element.length;
704	}
705
706	return !element;
707	};
708	//# sourceMappingURL=utils.js.map
709	;// CONCATENATED MODULE: ./packages/element/build-module/platform.js
710	/**
711	* Parts of this source were derived and modified from react-native-web,
712	* released under the MIT license.
713	*
714	* Copyright (c) 2016-present, Nicolas Gallagher.
715	* Copyright (c) 2015-present, Facebook, Inc.
716	*
717	*/
718	const Platform = {
719	OS: 'web',
720	select: spec => 'web' in spec ? spec.web : spec.default,
721	isWeb: true
722	};
723	/**
724	* Component used to detect the current Platform being used.
725	* Use Platform.OS === 'web' to detect if running on web enviroment.
726	*
727	* This is the same concept as the React Native implementation.
728	*
729	* @see https://facebook.github.io/react-native/docs/platform-specific-code#platform-module
730	*
731	* Here is an example of how to use the select method:
732	* @example
733	* ```js
734	* import { Platform } from '@wordpress/element';
735	*
736	* const placeholderLabel = Platform.select( {
737	* native: __( 'Add media' ),
738	* web: __( 'Drag images, upload new ones or select files from your library.' ),
739	* } );
740	* ```
741	*/
742
743	/* harmony default export */ var platform = (Platform);
744	//# sourceMappingURL=platform.js.map
745	;// CONCATENATED MODULE: external ["wp","escapeHtml"]
746	var external_wp_escapeHtml_namespaceObject = window["wp"]["escapeHtml"];
747	;// CONCATENATED MODULE: ./packages/element/build-module/raw-html.js
748	/**
749	* Internal dependencies
750	*/
751	// Disable reason: JSDoc linter doesn't seem to parse the union (`&`) correctly.
752
753	/** @typedef {{children: string} & import('react').ComponentPropsWithoutRef<'div'>} RawHTMLProps */
754
755	/**
756	* Component used as equivalent of Fragment with unescaped HTML, in cases where
757	* it is desirable to render dangerous HTML without needing a wrapper element.
758	* To preserve additional props, a `div` wrapper _will_ be created if any props
759	* aside from `children` are passed.
760	*
761	* @param {RawHTMLProps} props Children should be a string of HTML or an array
762	* of strings. Other props will be passed through
763	* to the div wrapper.
764	*
765	* @return {JSX.Element} Dangerously-rendering component.
766	*/
767
768	function RawHTML(_ref) {
769	let {
770	children,
771	...props
772	} = _ref;
773	let rawHtml = ''; // Cast children as an array, and concatenate each element if it is a string.
774
775	external_React_namespaceObject.Children.toArray(children).forEach(child => {
776	if (typeof child === 'string' && child.trim() !== '') {
777	rawHtml += child;
778	}
779	}); // The `div` wrapper will be stripped by the `renderElement` serializer in
780	// `./serialize.js` unless there are non-children props present.
781
782	return (0,external_React_namespaceObject.createElement)('div', {
783	dangerouslySetInnerHTML: {
784	__html: rawHtml
785	},
786	...props
787	});
788	}
789	//# sourceMappingURL=raw-html.js.map
790	;// CONCATENATED MODULE: ./packages/element/build-module/serialize.js
791	/**
792	* Parts of this source were derived and modified from fast-react-render,
793	* released under the MIT license.
794	*
795	* https://github.com/alt-j/fast-react-render
796	*
797	* Copyright (c) 2016 Andrey Morozov
798	*
799	* Permission is hereby granted, free of charge, to any person obtaining a copy
800	* of this software and associated documentation files (the "Software"), to deal
801	* in the Software without restriction, including without limitation the rights
802	* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
803	* copies of the Software, and to permit persons to whom the Software is
804	* furnished to do so, subject to the following conditions:
805	*
806	* The above copyright notice and this permission notice shall be included in
807	* all copies or substantial portions of the Software.
808	*
809	* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
810	* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
811	* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
812	* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
813	* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
814	* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
815	* THE SOFTWARE.
816	*/
817
818	/**
819	* External dependencies
820	*/
821
822	/**
823	* WordPress dependencies
824	*/
825
826
827	/**
828	* Internal dependencies
829	*/
830
831
832
833	/** @typedef {import('./react').WPElement} WPElement */
834
835	const {
836	Provider,
837	Consumer
838	} = (0,external_React_namespaceObject.createContext)(undefined);
839	const ForwardRef = (0,external_React_namespaceObject.forwardRef)(() => {
840	return null;
841	});
842	/**
843	* Valid attribute types.
844	*
845	* @type {Set<string>}
846	*/
847
848	const ATTRIBUTES_TYPES = new Set(['string', 'boolean', 'number']);
849	/**
850	* Element tags which can be self-closing.
851	*
852	* @type {Set<string>}
853	*/
854
855	const SELF_CLOSING_TAGS = new Set(['area', 'base', 'br', 'col', 'command', 'embed', 'hr', 'img', 'input', 'keygen', 'link', 'meta', 'param', 'source', 'track', 'wbr']);
856	/**
857	* Boolean attributes are attributes whose presence as being assigned is
858	* meaningful, even if only empty.
859	*
860	* See: https://html.spec.whatwg.org/multipage/common-microsyntaxes.html#boolean-attributes
861	* Extracted from: https://html.spec.whatwg.org/multipage/indices.html#attributes-3
862	*
863	* Object.keys( [ ...document.querySelectorAll( '#attributes-1 > tbody > tr' ) ]
864	* .filter( ( tr ) => tr.lastChild.textContent.indexOf( 'Boolean attribute' ) !== -1 )
865	* .reduce( ( result, tr ) => Object.assign( result, {
866	* [ tr.firstChild.textContent.trim() ]: true
867	* } ), {} ) ).sort();
868	*
869	* @type {Set<string>}
870	*/
871
872	const BOOLEAN_ATTRIBUTES = new Set(['allowfullscreen', 'allowpaymentrequest', 'allowusermedia', 'async', 'autofocus', 'autoplay', 'checked', 'controls', 'default', 'defer', 'disabled', 'download', 'formnovalidate', 'hidden', 'ismap', 'itemscope', 'loop', 'multiple', 'muted', 'nomodule', 'novalidate', 'open', 'playsinline', 'readonly', 'required', 'reversed', 'selected', 'typemustmatch']);
873	/**
874	* Enumerated attributes are attributes which must be of a specific value form.
875	* Like boolean attributes, these are meaningful if specified, even if not of a
876	* valid enumerated value.
877	*
878	* See: https://html.spec.whatwg.org/multipage/common-microsyntaxes.html#enumerated-attribute
879	* Extracted from: https://html.spec.whatwg.org/multipage/indices.html#attributes-3
880	*
881	* Object.keys( [ ...document.querySelectorAll( '#attributes-1 > tbody > tr' ) ]
882	* .filter( ( tr ) => /^("(.+?)";?\s*)+/.test( tr.lastChild.textContent.trim() ) )
883	* .reduce( ( result, tr ) => Object.assign( result, {
884	* [ tr.firstChild.textContent.trim() ]: true
885	* } ), {} ) ).sort();
886	*
887	* Some notable omissions:
888	*
889	* - `alt`: https://blog.whatwg.org/omit-alt
890	*
891	* @type {Set<string>}
892	*/
893
894	const ENUMERATED_ATTRIBUTES = new Set(['autocapitalize', 'autocomplete', 'charset', 'contenteditable', 'crossorigin', 'decoding', 'dir', 'draggable', 'enctype', 'formenctype', 'formmethod', 'http-equiv', 'inputmode', 'kind', 'method', 'preload', 'scope', 'shape', 'spellcheck', 'translate', 'type', 'wrap']);
895	/**
896	* Set of CSS style properties which support assignment of unitless numbers.
897	* Used in rendering of style properties, where `px` unit is assumed unless
898	* property is included in this set or value is zero.
899	*
900	* Generated via:
901	*
902	* Object.entries( document.createElement( 'div' ).style )
903	* .filter( ( [ key ] ) => (
904	* ! /^(webkit\|ms\|moz)/.test( key ) &&
905	* ( e.style[ key ] = 10 ) &&
906	* e.style[ key ] === '10'
907	* ) )
908	* .map( ( [ key ] ) => key )
909	* .sort();
910	*
911	* @type {Set<string>}
912	*/
913
914	const CSS_PROPERTIES_SUPPORTS_UNITLESS = new Set(['animation', 'animationIterationCount', 'baselineShift', 'borderImageOutset', 'borderImageSlice', 'borderImageWidth', 'columnCount', 'cx', 'cy', 'fillOpacity', 'flexGrow', 'flexShrink', 'floodOpacity', 'fontWeight', 'gridColumnEnd', 'gridColumnStart', 'gridRowEnd', 'gridRowStart', 'lineHeight', 'opacity', 'order', 'orphans', 'r', 'rx', 'ry', 'shapeImageThreshold', 'stopOpacity', 'strokeDasharray', 'strokeDashoffset', 'strokeMiterlimit', 'strokeOpacity', 'strokeWidth', 'tabSize', 'widows', 'x', 'y', 'zIndex', 'zoom']);
915	/**
916	* Returns true if the specified string is prefixed by one of an array of
917	* possible prefixes.
918	*
919	* @param {string} string String to check.
920	* @param {string[]} prefixes Possible prefixes.
921	*
922	* @return {boolean} Whether string has prefix.
923	*/
924
925	function hasPrefix(string, prefixes) {
926	return prefixes.some(prefix => string.indexOf(prefix) === 0);
927	}
928	/**
929	* Returns true if the given prop name should be ignored in attributes
930	* serialization, or false otherwise.
931	*
932	* @param {string} attribute Attribute to check.
933	*
934	* @return {boolean} Whether attribute should be ignored.
935	*/
936
937	function isInternalAttribute(attribute) {
938	return 'key' === attribute \|\| 'children' === attribute;
939	}
940	/**
941	* Returns the normal form of the element's attribute value for HTML.
942	*
943	* @param {string} attribute Attribute name.
944	* @param {*} value Non-normalized attribute value.
945	*
946	* @return {*} Normalized attribute value.
947	*/
948
949
950	function getNormalAttributeValue(attribute, value) {
951	switch (attribute) {
952	case 'style':
953	return renderStyle(value);
954	}
955
956	return value;
957	}
958	/**
959	* Returns the normal form of the element's attribute name for HTML.
960	*
961	* @param {string} attribute Non-normalized attribute name.
962	*
963	* @return {string} Normalized attribute name.
964	*/
965
966
967	function getNormalAttributeName(attribute) {
968	switch (attribute) {
969	case 'htmlFor':
970	return 'for';
971
972	case 'className':
973	return 'class';
974	}
975
976	return attribute.toLowerCase();
977	}
978	/**
979	* Returns the normal form of the style property name for HTML.
980	*
981	* - Converts property names to kebab-case, e.g. 'backgroundColor' → 'background-color'
982	* - Leaves custom attributes alone, e.g. '--myBackgroundColor' → '--myBackgroundColor'
983	* - Converts vendor-prefixed property names to -kebab-case, e.g. 'MozTransform' → '-moz-transform'
984	*
985	* @param {string} property Property name.
986	*
987	* @return {string} Normalized property name.
988	*/
989
990
991	function getNormalStylePropertyName(property) {
992	if ((0,external_lodash_namespaceObject.startsWith)(property, '--')) {
993	return property;
994	}
995
996	if (hasPrefix(property, ['ms', 'O', 'Moz', 'Webkit'])) {
997	return '-' + (0,external_lodash_namespaceObject.kebabCase)(property);
998	}
999
1000	return (0,external_lodash_namespaceObject.kebabCase)(property);
1001	}
1002	/**
1003	* Returns the normal form of the style property value for HTML. Appends a
1004	* default pixel unit if numeric, not a unitless property, and not zero.
1005	*
1006	* @param {string} property Property name.
1007	* @param {*} value Non-normalized property value.
1008	*
1009	* @return {*} Normalized property value.
1010	*/
1011
1012
1013	function getNormalStylePropertyValue(property, value) {
1014	if (typeof value === 'number' && 0 !== value && !CSS_PROPERTIES_SUPPORTS_UNITLESS.has(property)) {
1015	return value + 'px';
1016	}
1017
1018	return value;
1019	}
1020	/**
1021	* Serializes a React element to string.
1022	*
1023	* @param {import('react').ReactNode} element Element to serialize.
1024	* @param {Object} [context] Context object.
1025	* @param {Object} [legacyContext] Legacy context object.
1026	*
1027	* @return {string} Serialized element.
1028	*/
1029
1030
1031	function renderElement(element, context) {
1032	let legacyContext = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
1033
1034	if (null === element \|\| undefined === element \|\| false === element) {
1035	return '';
1036	}
1037
1038	if (Array.isArray(element)) {
1039	return renderChildren(element, context, legacyContext);
1040	}
1041
1042	switch (typeof element) {
1043	case 'string':
1044	return (0,external_wp_escapeHtml_namespaceObject.escapeHTML)(element);
1045
1046	case 'number':
1047	return element.toString();
1048	}
1049
1050	const {
1051	type,
1052	props
1053	} =
1054	/** @type {{type?: any, props?: any}} */
1055	element;
1056
1057	switch (type) {
1058	case external_React_namespaceObject.StrictMode:
1059	case external_React_namespaceObject.Fragment:
1060	return renderChildren(props.children, context, legacyContext);
1061
1062	case RawHTML:
1063	const {
1064	children,
1065	...wrapperProps
1066	} = props;
1067	return renderNativeComponent((0,external_lodash_namespaceObject.isEmpty)(wrapperProps) ? null : 'div', { ...wrapperProps,
1068	dangerouslySetInnerHTML: {
1069	__html: children
1070	}
1071	}, context, legacyContext);
1072	}
1073
1074	switch (typeof type) {
1075	case 'string':
1076	return renderNativeComponent(type, props, context, legacyContext);
1077
1078	case 'function':
1079	if (type.prototype && typeof type.prototype.render === 'function') {
1080	return renderComponent(type, props, context, legacyContext);
1081	}
1082
1083	return renderElement(type(props, legacyContext), context, legacyContext);
1084	}
1085
1086	switch (type && type.$$typeof) {
1087	case Provider.$$typeof:
1088	return renderChildren(props.children, props.value, legacyContext);
1089
1090	case Consumer.$$typeof:
1091	return renderElement(props.children(context \|\| type._currentValue), context, legacyContext);
1092
1093	case ForwardRef.$$typeof:
1094	return renderElement(type.render(props), context, legacyContext);
1095	}
1096
1097	return '';
1098	}
1099	/**
1100	* Serializes a native component type to string.
1101	*
1102	* @param {?string} type Native component type to serialize, or null if
1103	* rendering as fragment of children content.
1104	* @param {Object} props Props object.
1105	* @param {Object} [context] Context object.
1106	* @param {Object} [legacyContext] Legacy context object.
1107	*
1108	* @return {string} Serialized element.
1109	*/
1110
1111	function renderNativeComponent(type, props, context) {
1112	let legacyContext = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
1113	let content = '';
1114
1115	if (type === 'textarea' && props.hasOwnProperty('value')) {
1116	// Textarea children can be assigned as value prop. If it is, render in
1117	// place of children. Ensure to omit so it is not assigned as attribute
1118	// as well.
1119	content = renderChildren(props.value, context, legacyContext);
1120	props = (0,external_lodash_namespaceObject.omit)(props, 'value');
1121	} else if (props.dangerouslySetInnerHTML && typeof props.dangerouslySetInnerHTML.__html === 'string') {
1122	// Dangerous content is left unescaped.
1123	content = props.dangerouslySetInnerHTML.__html;
1124	} else if (typeof props.children !== 'undefined') {
1125	content = renderChildren(props.children, context, legacyContext);
1126	}
1127
1128	if (!type) {
1129	return content;
1130	}
1131
1132	const attributes = renderAttributes(props);
1133
1134	if (SELF_CLOSING_TAGS.has(type)) {
1135	return '<' + type + attributes + '/>';
1136	}
1137
1138	return '<' + type + attributes + '>' + content + '</' + type + '>';
1139	}
1140	/** @typedef {import('./react').WPComponent} WPComponent */
1141
1142	/**
1143	* Serializes a non-native component type to string.
1144	*
1145	* @param {WPComponent} Component Component type to serialize.
1146	* @param {Object} props Props object.
1147	* @param {Object} [context] Context object.
1148	* @param {Object} [legacyContext] Legacy context object.
1149	*
1150	* @return {string} Serialized element
1151	*/
1152
1153	function renderComponent(Component, props, context) {
1154	let legacyContext = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {};
1155	const instance = new
1156	/** @type {import('react').ComponentClass} */
1157	Component(props, legacyContext);
1158
1159	if (typeof // Ignore reason: Current prettier reformats parens and mangles type assertion
1160	// prettier-ignore
1161
1162	/** @type {{getChildContext?: () => unknown}} */
1163	instance.getChildContext === 'function') {
1164	Object.assign(legacyContext,
1165	/** @type {{getChildContext?: () => unknown}} */
1166	instance.getChildContext());
1167	}
1168
1169	const html = renderElement(instance.render(), context, legacyContext);
1170	return html;
1171	}
1172	/**
1173	* Serializes an array of children to string.
1174	*
1175	* @param {import('react').ReactNodeArray} children Children to serialize.
1176	* @param {Object} [context] Context object.
1177	* @param {Object} [legacyContext] Legacy context object.
1178	*
1179	* @return {string} Serialized children.
1180	*/
1181
1182	function renderChildren(children, context) {
1183	let legacyContext = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
1184	let result = '';
1185	children = (0,external_lodash_namespaceObject.castArray)(children);
1186
1187	for (let i = 0; i < children.length; i++) {
1188	const child = children[i];
1189	result += renderElement(child, context, legacyContext);
1190	}
1191
1192	return result;
1193	}
1194	/**
1195	* Renders a props object as a string of HTML attributes.
1196	*
1197	* @param {Object} props Props object.
1198	*
1199	* @return {string} Attributes string.
1200	*/
1201
1202
1203	function renderAttributes(props) {
1204	let result = '';
1205
1206	for (const key in props) {
1207	const attribute = getNormalAttributeName(key);
1208
1209	if (!(0,external_wp_escapeHtml_namespaceObject.isValidAttributeName)(attribute)) {
1210	continue;
1211	}
1212
1213	let value = getNormalAttributeValue(key, props[key]); // If value is not of serializeable type, skip.
1214
1215	if (!ATTRIBUTES_TYPES.has(typeof value)) {
1216	continue;
1217	} // Don't render internal attribute names.
1218
1219
1220	if (isInternalAttribute(key)) {
1221	continue;
1222	}
1223
1224	const isBooleanAttribute = BOOLEAN_ATTRIBUTES.has(attribute); // Boolean attribute should be omitted outright if its value is false.
1225
1226	if (isBooleanAttribute && value === false) {
1227	continue;
1228	}
1229
1230	const isMeaningfulAttribute = isBooleanAttribute \|\| hasPrefix(key, ['data-', 'aria-']) \|\| ENUMERATED_ATTRIBUTES.has(attribute); // Only write boolean value as attribute if meaningful.
1231
1232	if (typeof value === 'boolean' && !isMeaningfulAttribute) {
1233	continue;
1234	}
1235
1236	result += ' ' + attribute; // Boolean attributes should write attribute name, but without value.
1237	// Mere presence of attribute name is effective truthiness.
1238
1239	if (isBooleanAttribute) {
1240	continue;
1241	}
1242
1243	if (typeof value === 'string') {
1244	value = (0,external_wp_escapeHtml_namespaceObject.escapeAttribute)(value);
1245	}
1246
1247	result += '="' + value + '"';
1248	}
1249
1250	return result;
1251	}
1252	/**
1253	* Renders a style object as a string attribute value.
1254	*
1255	* @param {Object} style Style object.
1256	*
1257	* @return {string} Style attribute value.
1258	*/
1259
1260	function renderStyle(style) {
1261	// Only generate from object, e.g. tolerate string value.
1262	if (!(0,external_lodash_namespaceObject.isPlainObject)(style)) {
1263	return style;
1264	}
1265
1266	let result;
1267
1268	for (const property in style) {
1269	const value = style[property];
1270
1271	if (null === value \|\| undefined === value) {
1272	continue;
1273	}
1274
1275	if (result) {
1276	result += ';';
1277	} else {
1278	result = '';
1279	}
1280
1281	const normalName = getNormalStylePropertyName(property);
1282	const normalValue = getNormalStylePropertyValue(property, value);
1283	result += normalName + ':' + normalValue;
1284	}
1285
1286	return result;
1287	}
1288	/* harmony default export */ var serialize = (renderElement);
1289	//# sourceMappingURL=serialize.js.map
1290	;// CONCATENATED MODULE: ./packages/element/build-module/index.js
1291
1292
1293
1294
1295
1296
1297
1298	//# sourceMappingURL=index.js.map
1299	(window.wp = window.wp \|\| {}).element = __webpack_exports__;
1300	/******/ })()
1301	;