@plaudit/gutenberg-api-extensions 2.84.4 → 2.85.1

package/src/blocks/data-controller/utils.ts

@@ -109,8 +109,8 @@ export function descendIntoDCNodeChild(current: DCNode|undefined, path: RawPath,
 	return current;
 }
 
-export function getDataStore(property: string, state: Draft<DCStoreState>, throwOnError: false): DataStore|undefined;
-export function getDataStore(property: string, state: Draft<DCStoreState>, throwOnError?: undefined|true): DataStore;
+export function getDataStore(property: string, state: Draft<DCStoreState>, throwOnError: true): DataStore;
+export function getDataStore(property: string, state: Draft<DCStoreState>, throwOnError?: undefined|boolean|false): DataStore|undefined;
 export function getDataStore(property: string, state: Draft<DCStoreState>, throwOnError = true): DataStore|undefined {
 	let dataStore = state.dataStores.byProperty[property];
 	if (dataStore) {
@@ -127,7 +127,7 @@ export function getDataStore(property: string, state: Draft<DCStoreState>, throw
 
 export function getOptionalValue(path: NodePath, state: Draft<DCStoreState>) {
 	try {
-		return walkToNodeInValue(getDataStore(path[0], state).getValue(path[0]), path);
+		return walkToNodeInValue(getDataStore(path[0], state, true).getValue(path[0]), path);
 	} catch (e) {
 		if (e instanceof PathError) {
 			return undefined;
@@ -162,7 +162,7 @@ export function writeValueToBackingDataStoreWithCorrections(path: NodePath, stat
 	if (rootDCNode === undefined) {
 		throw new PathError("Encountered a path pointing to a non-existent root node.", path, 0);
 	}
-	const dataStore = getDataStore(path[0], state);
+	const dataStore = getDataStore(path[0], state, true);
 
 	// This path both handles scalar values and ensures that the root "value" of Groups and Lists are initialized before writing the actual attribute
 	// To avoid accidentally overwriting group data when lazily adding items (i.e., via a ToolsPanel instance), we skip this code path if the group's root value has already been initialized
@@ -306,6 +306,29 @@ export function recordCloneableDefaultValueForNode<T extends HydratedSimpleNativ
 	return definition as HydratedSimpleNativeProperty<{uuid: UUID}>;
 }
 
+const recordedBackupValues: Record<UUID, any> = {};
+export function recordBackupForNode(node: DCNode, value: any) {
+	if (!node.backup) {
+		node.backup = crypto.randomUUID();
+	}
+	recordedBackupValues[node.backup] = value;
+}
+
+export function restoreValueFromPotentialBackup(node: DCNode) {
+	if (node.backup && node.backup in recordedBackupValues) {
+		const res = recordedBackupValues[node.backup];
+		delete recordedBackupValues[node.backup];
+		return res ?? buildDefaultValueFromDefinition(node.definition);
+	}
+	return buildDefaultValueFromDefinition(node.definition)
+}
+
+export function removeBackupForNode(node: DCNode) {
+	if (node.backup && node.backup in recordedBackupValues) {
+		delete recordedBackupValues[node.backup];
+	}
+}
+
 export function buildDefaultValueFromDefinition(definition: (HydratedSimpleNativeProperty<{uuid: UUID}>)|undefined, requireNonNullValueOnObject = true): any {
 	if (definition === undefined) {
 		return undefined;

package/src/blocks/data-controller.ts

@@ -15,7 +15,7 @@ import {getDataStore, getOptionalValue, UUID, walkToNode} from "./data-controlle
 
 type DescendantsWrapper = {[key: string]: DCNode}|DCNode[];
 export type DCNode = {
-	backup?: any,
+	backup?: UUID,
 	rendered?: boolean,
 	condition?: Condition,
 	children?: DescendantsWrapper,
@@ -39,7 +39,7 @@ export function useDataController(blockClientId: string): DataController {
 		function getDataStoreImpl(property: string, required: true): DataStore;
 		function getDataStoreImpl(property: string, required?: undefined|false): DataStore|undefined;
 		function getDataStoreImpl(property: string, required?: boolean): DataStore|undefined {
-			return required ? getDataStore(property, store.getState(), true) : getDataStore(property, store.getState(), false);
+			return getDataStore(property, store.getState(), required);
 		}
 		const dataController: DataController = {
 			getDataStore: getDataStoreImpl,

package/src/controls/FileControl.tsx

@@ -0,0 +1,48 @@
+import {MediaUpload, MediaUploadCheck} from "@wordpress/block-editor";
+import {BaseControl, Button, useBaseControlProps} from "@wordpress/components";
+import {store as coreStore} from "@wordpress/core-data";
+import {useSuspenseSelect} from "@wordpress/data";
+import {useCallback} from "@wordpress/element";
+import {__} from "@wordpress/i18n";
+
+import type {ReactNode} from "react";
+
+export type FileControlProps = {
+	label: ReactNode,
+	help?: ReactNode,
+	onChange: (value?: number) => void,
+	value?: number,
+	allowedTypes?: string[]
+};
+export function FileControl(props: FileControlProps) {
+	const {allowedTypes, help, label, onChange, value} = props;
+	const onSelect = useCallback((media: {id: number}) => {
+		if (media.id !== value) {
+			onChange(media.id);
+		}
+	}, [onChange, value]);
+
+	const attachment = useSuspenseSelect(select => value !== undefined ? select(coreStore).getMedia(value) : undefined, [value]);
+	const {baseControlProps, controlProps} = useBaseControlProps({label, help});
+	return <BaseControl {...baseControlProps}>
+		<MediaUploadCheck>
+			<MediaUpload
+				onSelect={onSelect}
+				value={value}
+				allowedTypes={allowedTypes}
+				render={useCallback(({open}) => {
+					if (!attachment?.id) {
+						return <div {...controlProps}><Button onClick={open} children={__('Select a File', 'plaudit')}/></div>
+					}
+					return <div {...controlProps}>
+						<p>{__('Selected File', 'plaudit')}: <a href={attachment.source_url} target="_blank" rel="noopener noreferrer">{attachment.title.rendered}</a></p>
+						<div className="selected-file-control-buttons">
+							<Button onClick={open} variant="secondary" children="Replace File" />
+							<Button onClick={() => onChange(undefined)} isDestructive children={__('Remove File', 'plaudit')} />
+						</div>
+					</div>;
+				}, [attachment, onChange, controlProps])}
+			/>
+		</MediaUploadCheck>
+	</BaseControl>;
+}

package/src/controls/index.ts

@@ -7,6 +7,7 @@ export * from "./ExtendedTaxonomyPicker";
 export * from "./ExtendedTermPicker";
 export * from "./ExtendedTextareaControl";
 export * from "./ExtendedUserPicker";
+export * from "./FileControl";
 export * from "./FullSizeToggleControl";
 export * from "./ImageControl";
 export * from "./InspectorPanel";