@plaudit/gutenberg-api-extensions 2.84.4 → 2.85.1

package/dist/controls/FileControl.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileControl.js","sourceRoot":"","sources":["../../src/controls/FileControl.tsx"],"names":[],"mappings":";;AAgBA,kCA+BC;;AA/CD,0DAAsE;AACtE,sDAA+E;AAC/E,oDAAwD;AACxD,0CAAkD;AAClD,gDAA+C;AAC/C,0CAAmC;AAWnC,SAAgB,WAAW,CAAC,KAAuB;IAClD,MAAM,EAAC,YAAY,EAAE,IAAI,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAC,GAAG,KAAK,CAAC;IAC3D,MAAM,QAAQ,GAAG,IAAA,qBAAW,EAAC,CAAC,KAAmB,EAAE,EAAE;QACpD,IAAI,KAAK,CAAC,EAAE,KAAK,KAAK,EAAE,CAAC;YACxB,QAAQ,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;QACpB,CAAC;IACF,CAAC,EAAE,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC,CAAC;IAEtB,MAAM,UAAU,GAAG,IAAA,wBAAiB,EAAC,MAAM,CAAC,EAAE,CAAC,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,iBAAS,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,SAAS,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAC7H,MAAM,EAAC,gBAAgB,EAAE,YAAY,EAAC,GAAG,IAAA,gCAAmB,EAAC,EAAC,KAAK,EAAE,IAAI,EAAC,CAAC,CAAC;IAC5E,OAAO,uBAAC,wBAAW,OAAK,gBAAgB,YACvC,uBAAC,+BAAgB,cAChB,uBAAC,0BAAW,IACX,QAAQ,EAAE,QAAQ,EAClB,KAAK,EAAE,KAAK,EACZ,YAAY,EAAE,YAAY,EAC1B,MAAM,EAAE,IAAA,qBAAW,EAAC,CAAC,EAAC,IAAI,EAAC,EAAE,EAAE;oBAC9B,IAAI,CAAC,UAAU,EAAE,EAAE,EAAE,CAAC;wBACrB,OAAO,mCAAS,YAAY,YAAE,uBAAC,mBAAM,IAAC,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAA,SAAE,EAAC,eAAe,EAAE,SAAS,CAAC,GAAG,GAAM,CAAA;oBACvG,CAAC;oBACD,OAAO,oCAAS,YAAY,aAC3B,0CAAI,IAAA,SAAE,EAAC,eAAe,EAAE,SAAS,CAAC,QAAG,8BAAG,IAAI,EAAE,UAAU,CAAC,UAAU,EAAE,MAAM,EAAC,QAAQ,EAAC,GAAG,EAAC,qBAAqB,YAAE,UAAU,CAAC,KAAK,CAAC,QAAQ,GAAK,IAAI,EAClJ,iCAAK,SAAS,EAAC,+BAA+B,aAC7C,uBAAC,mBAAM,IAAC,OAAO,EAAE,IAAI,EAAE,OAAO,EAAC,WAAW,EAAC,QAAQ,EAAC,cAAc,GAAG,EACrE,uBAAC,mBAAM,IAAC,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,SAAS,CAAC,EAAE,aAAa,QAAC,QAAQ,EAAE,IAAA,SAAE,EAAC,aAAa,EAAE,SAAS,CAAC,GAAI,IAC/F,IACD,CAAC;gBACR,CAAC,EAAE,CAAC,UAAU,EAAE,QAAQ,EAAE,YAAY,CAAC,CAAC,GACvC,GACgB,GACN,CAAC;AAChB,CAAC"}

package/dist/controls/index.d.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";

package/dist/controls/index.js

@@ -25,6 +25,7 @@ __exportStar(require("./ExtendedTaxonomyPicker"), exports);
 __exportStar(require("./ExtendedTermPicker"), exports);
 __exportStar(require("./ExtendedTextareaControl"), exports);
 __exportStar(require("./ExtendedUserPicker"), exports);
+__exportStar(require("./FileControl"), exports);
 __exportStar(require("./FullSizeToggleControl"), exports);
 __exportStar(require("./ImageControl"), exports);
 __exportStar(require("./InspectorPanel"), exports);

package/dist/controls/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/controls/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,2EAAwE;AAAhE,wIAAA,0BAA0B,OAAA;AAClC,6DAA2C;AAC3C,2DAAyC;AACzC,uDAAqC;AACrC,yDAAuC;AACvC,2DAAyC;AACzC,uDAAqC;AACrC,4DAA0C;AAC1C,uDAAqC;AACrC,0DAAwC;AACxC,iDAA+B;AAC/B,mDAAiC;AACjC,mEAAiD;AACjD,uDAAqC;AACrC,4CAA0B;AAC1B,wDAAsC;AACtC,sDAAoC;AACpC,iDAA+B;AAC/B,iEAA+C;AAC/C,yDAAuC;AAEvC,mCAA+C;AAAtC,6GAAA,mBAAmB,OAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/controls/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,2EAAwE;AAAhE,wIAAA,0BAA0B,OAAA;AAClC,6DAA2C;AAC3C,2DAAyC;AACzC,uDAAqC;AACrC,yDAAuC;AACvC,2DAAyC;AACzC,uDAAqC;AACrC,4DAA0C;AAC1C,uDAAqC;AACrC,gDAA8B;AAC9B,0DAAwC;AACxC,iDAA+B;AAC/B,mDAAiC;AACjC,mEAAiD;AACjD,uDAAqC;AACrC,4CAA0B;AAC1B,wDAAsC;AACtC,sDAAoC;AACpC,iDAA+B;AAC/B,iEAA+C;AAC/C,yDAAuC;AAEvC,mCAA+C;AAAtC,6GAAA,mBAAmB,OAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@plaudit/gutenberg-api-extensions",
-  "version": "2.84.4",
+  "version": "2.85.1",
   "license": "SEE LICENSE IN LICENSE.md",
   "files": [
     "./dist",
@@ -24,7 +24,7 @@
     "@reduxjs/toolkit": "^2.11.2",
     "@types/react": "^18.3.28",
     "@types/wordpress__block-editor": "^15.0.0",
-    "@types/wordpress__blocks": "^12.5.18",
+    "@types/wordpress__blocks": "^15.10.0",
     "@wordpress/block-editor": "^15.12.0",
     "@wordpress/blocks": "^15.12.0",
     "@wordpress/components": "^30.9.0",
@@ -36,9 +36,9 @@
     "@wordpress/hooks": "^4.39.0",
     "@wordpress/i18n": "^6.12.0",
     "@wordpress/icons": "^11.6.0",
-    "framer-motion": "^12.33.0",
-    "html-react-parser": "^5.2.16",
-    "immer": "^11.1.3",
+    "framer-motion": "^12.34.0",
+    "html-react-parser": "^5.2.17",
+    "immer": "^11.1.4",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "react-error-boundary": "^6.1.0",

package/simple-native-properties.md

@@ -1,49 +1,63 @@
-# Simple Native Properties (SNP)
+<!-- TOC -->
+* [What are Simple Native Properties (SNPs)?](#what-are-simple-native-properties-snps)
+* [⚡ Quick Start Example](#-quick-start-example)
+* [📋 Control Reference](#-control-reference)
+  * [Common Properties (Available on All Controls)](#common-properties-available-on-all-controls)
+* [🎛️ Control Types](#-control-types)
+  * [Basic Input Controls](#basic-input-controls)
+    * [`text`](#text)
+      * [Additional Properties](#additional-properties)
+    * [`textarea`](#textarea)
+      * [Additional Properties](#additional-properties-1)
+    * [`number`](#number)
+      * [Additional Properties](#additional-properties-2)
+    * [`range`](#range)
+      * [Additional Properties](#additional-properties-3)
+  * [Toggle & Choice Controls](#toggle--choice-controls)
+    * [`toggle`](#toggle)
+      * [Additional Properties](#additional-properties-4)
+    * [`toggleGroup`](#togglegroup)
+      * [Additional Properties](#additional-properties-5)
+    * [`select`](#select)
+      * [Additional Properties](#additional-properties-6)
+    * [`radio`](#radio)
+      * [Additional Properties](#additional-properties-7)
+    * [`colorPalette`](#colorpalette)
+      * [Additional Properties](#additional-properties-8)
+  * [Media & Relational Controls](#media--relational-controls)
+    * [`file`](#file)
+    * [`image`](#image)
+    * [`link`](#link)
+    * [`post`](#post)
+    * [`taxonomy`](#taxonomy)
+    * [`term`](#term)
+    * [`user`](#user)
+  * [Structure & Collection Controls](#structure--collection-controls)
+    * [`group`](#group)
+    * [`list`](#list)
+    * [`date`](#date)
+    * [`constant`](#constant)
+* [🏗️ Organization & Logic](#-organization--logic)
+  * [1. Structure (Panels & Tabs)](#1-structure-panels--tabs)
+  * [2. Layout (Rows)](#2-layout-rows)
+  * [3. Conditions (Show/Hide Logic)](#3-conditions-showhide-logic)
+  * [4. Option Sources (Dynamic Options)](#4-option-sources-dynamic-options)
+    * [Source Syntax](#source-syntax)
+      * [The `select` Protocol](#the-select-protocol)
+      * [The `settings` Protocol](#the-settings-protocol)
+* [🔧 Advanced Features](#-advanced-features)
+  * [Style Properties](#style-properties)
+  * [Validators & Transformers](#validators--transformers)
+* [Tips & Best Practices](#tips--best-practices)
+<!-- TOC -->
 
-SNP allows you to define Inspector (sidebar) controls in `block.json` purely with data, avoiding custom React code for standard use cases.
+---
 
-## 📑 Table of Contents
-
-- [Quick Start Example](#-quick-start-example)
-- [Control Reference](#-control-reference)
-  - [Common Properties](#common-properties-available-on-all-controls)
-- [Control Types](#️-control-types)
-  - [Basic Input Controls](#basic-input-controls)
-    - [`text`](#text)
-    - [`textarea`](#textarea)
-    - [`number`](#number)
-    - [`range`](#range)
-  - [Toggle & Choice Controls](#toggle--choice-controls)
-    - [`toggle`](#toggle)
-    - [`toggleGroup`](#togglegroup)
-    - [`select`](#select)
-    - [`radio`](#radio)
-    - [`colorPalette`](#colorpalette)
-  - [Media & Relational Controls](#media--relational-controls)
-    - [`image`](#image)
-    - [`link`](#link)
-    - [`post`](#post)
-    - [`taxonomy`](#taxonomy)
-    - [`term`](#term)
-    - [`user`](#user)
-  - [Structure & Collection Controls](#structure--collection-controls)
-    - [`group`](#group)
-    - [`list`](#list)
-    - [`date`](#date)
-    - [`constant`](#constant)
-- [Organization & Logic](#️-organization--logic)
-  - [1. Structure (Panels & Tabs)](#1-structure-panels--tabs)
-  - [2. Layout (Rows)](#2-layout-rows)
-  - [3. Conditions (Show/Hide Logic)](#3-conditions-showhide-logic)
-  - [4. Option Sources (Dynamic Options)](#4-option-sources-dynamic-options)
-- [Advanced Features](#-advanced-features)
-  - [Style Properties](#style-properties)
-  - [Validators & Transformers](#validators--transformers)
-- [Tips & Best Practices](#tips--best-practices)
+# What are Simple Native Properties (SNPs)?
 
----
+SNP allows you to define Inspector (sidebar) controls in `block.json` purely with data, avoiding custom React code for standard use cases.
 
-## ⚡ Quick Start Example
+# ⚡ Quick Start Example
 
 Copy and adapt this block to cover 90% of your use cases. It demonstrates **Panels**, **Layouts**, **Conditions**, and **Common Controls**.
 
@@ -99,11 +113,11 @@ Copy and adapt this block to cover 90% of your use cases. It demonstrates **Pane
 
 ---
 
-## 📋 Control Reference
+# 📋 Control Reference
 
 All controls require three properties: `"control"`, `"name"`, and `"label"`.
 
-### Common Properties (Available on All Controls)
+## Common Properties (Available on All Controls)
 
 | Property        | Type     | Description                                                                                    |
 |:----------------|:---------|:-----------------------------------------------------------------------------------------------|
@@ -122,16 +136,16 @@ All controls require three properties: `"control"`, `"name"`, and `"label"`.
 
 ---
 
-## 🎛️ Control Types
+# 🎛️ Control Types
 
-### Basic Input Controls
+## Basic Input Controls
 
-#### `text`
+### `text`
 Single-line text input.
 
 **Value Type:** `string`
 
-##### Additional Properties
+#### Additional Properties
 | Property      | Type     | Description                        | Default |
 |:--------------|:---------|:-----------------------------------|:--------|
 | `placeholder` | `string` | Placeholder text shown when empty. | `''`    |
@@ -150,12 +164,12 @@ Single-line text input.
 
 ---
 
-#### `textarea`
+### `textarea`
 Multi-line text input.
 
 **Value Type:** `string`
 
-##### Additional Properties
+#### Additional Properties
 | Property         | Type     | Description                 | Default |
 |:-----------------|:---------|:----------------------------|:--------|
 | `component.rows` | `number` | Number of visible text rows | `4`     |
@@ -174,12 +188,12 @@ Multi-line text input.
 
 ---
 
-#### `number`
+### `number`
 Numeric input with optional constraints.
 
 **Value Type:** `number`
 
-##### Additional Properties
+#### Additional Properties
 | Property      | Type              | Description                                           | Default |
 |:--------------|:------------------|:------------------------------------------------------|:--------|
 | `min`         | `number`          | Minimum allowed value                                 | `unset` |
@@ -204,12 +218,12 @@ Numeric input with optional constraints.
 
 ---
 
-#### `range`
+### `range`
 Slider control for selecting numeric values.
 
 **Value Type:** `number`
 
-##### Additional Properties
+#### Additional Properties
 | Property | Type     | Description                         | Default |
 |:---------|:---------|:------------------------------------|:--------|
 | `min`    | `number` | **Required.** Minimum allowed value | `unset` |
@@ -232,14 +246,14 @@ Slider control for selecting numeric values.
 
 ---
 
-### Toggle & Choice Controls
+## Toggle & Choice Controls
 
-#### `toggle`
+### `toggle`
 Boolean on/off switch.
 
 **Value Type:** `boolean`
 
-##### Additional Properties
+#### Additional Properties
 - `switch` (`string | object`): Switch style configuration.
   - String values: `"yesNo"`, `"showHide"`
   - Object with properties:
@@ -291,12 +305,12 @@ Boolean on/off switch.
 
 ---
 
-#### `toggleGroup`
+### `toggleGroup`
 Button group for selecting one value from multiple options.
 
 **Value Type:** `string` or `number`
 
-##### Additional Properties
+#### Additional Properties
 | Property    | Type                   | Description                                                                                                                      | Default    |
 |:------------|:-----------------------|:---------------------------------------------------------------------------------------------------------------------------------|:-----------|
 | `options`   | `array \| string`      | **Required.** Array of `[value, label]` tuples or option objects or a [dynamic source string](#4-option-sources-dynamic-options) | `unset`    |
@@ -335,12 +349,12 @@ Button group for selecting one value from multiple options.
 
 ---
 
-#### `select`
+### `select`
 Dropdown selection control.
 
 **Value Type:** `string` (single) or `string[]` (multiple)
 
-##### Additional Properties
+#### Additional Properties
 | Property        | Type              | Description                                                                                                                      | Default |
 |:----------------|:------------------|:---------------------------------------------------------------------------------------------------------------------------------|:--------|
 | `options`       | `array \| string` | **Required.** Array of `[value, label]` tuples or option objects or a [dynamic source string](#4-option-sources-dynamic-options) | `unset` |
@@ -384,12 +398,12 @@ Dropdown selection control.
 
 ---
 
-#### `radio`
+### `radio`
 Radio button group for selecting one option.
 
 **Value Type:** `string`
 
-##### Additional Properties
+#### Additional Properties
 | Property      | Type              | Description                                                                                                                      | Default |
 |:--------------|:------------------|:---------------------------------------------------------------------------------------------------------------------------------|:--------|
 | `options`     | `array \| string` | **Required.** Array of `[value, label]` tuples or option objects or a [dynamic source string](#4-option-sources-dynamic-options) | `unset` |
@@ -414,12 +428,12 @@ Radio button group for selecting one option.
 
 ---
 
-#### `colorPalette`
+### `colorPalette`
 Color picker with theme palette integration.
 
 **Value Type:** `string`
 
-##### Additional Properties
+#### Additional Properties
 | Property      | Type              | Description                                                                                                                             | Default |
 |:--------------|:------------------|:----------------------------------------------------------------------------------------------------------------------------------------|:--------|
 | `options`     | `array \| string` | **Required.** Array of `[color string, label]` tuples or option objects or a [dynamic source string](#4-option-sources-dynamic-options) | `unset` |
@@ -440,9 +454,28 @@ Color picker with theme palette integration.
 
 ---
 
-### Media & Relational Controls
+## Media & Relational Controls
+
+### `file`
+File selector with media library integration.
+
+**Value Type:** `number` (attachment id)
+
+**Additional Properties:**
+- `allowedTypes` (string[]): An array of [File Type Specifiers](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/input/file#unique_file_type_specifiers) to which the field should be restricted. Default: `undefined` (allows any file).
+
+**Example:**
+
+```json
+{ 
+  "name": "someFile", 
+  "label": "Some File", 
+  "control": "file",
+  "allowedTypes": ["text/csv", "application/pdf"]
+}
+```
 
-#### `image`
+### `image`
 Image selector with media library integration.
 
 **Value Type:** `object` (ImageData)
@@ -464,7 +497,7 @@ Image selector with media library integration.
 
 ---
 
-#### `link`
+### `link`
 Link picker for URLs, pages, posts, etc.
 
 **Value Type:** `object`
@@ -485,7 +518,7 @@ Link picker for URLs, pages, posts, etc.
 
 ---
 
-#### `post`
+### `post`
 Post/page selector with search functionality.
 
 **Value Type:** `number` (single) or `number[]` (multiple)
@@ -523,7 +556,7 @@ Post/page selector with search functionality.
 
 ---
 
-#### `taxonomy`
+### `taxonomy`
 Taxonomy selector (categories, tags, custom taxonomies).
 
 **Value Type:** `string` (single) or `string[]` (multiple)
@@ -550,7 +583,7 @@ Taxonomy selector (categories, tags, custom taxonomies).
 
 ---
 
-#### `term`
+### `term`
 Taxonomy term selector (specific category/tag picker).
 
 **Value Type:** `string` (single) or `string[]` (multiple)
@@ -574,7 +607,7 @@ Taxonomy term selector (specific category/tag picker).
 
 ---
 
-#### `user`
+### `user`
 User selector with role filtering.
 
 **Value Type:** `number` (single) or `number[]` (multiple)
@@ -610,9 +643,9 @@ User selector with role filtering.
 
 ---
 
-### Structure & Collection Controls
+## Structure & Collection Controls
 
-#### `group`
+### `group`
 Groups related controls together visually.
 
 **Value Type:** `object`
@@ -652,7 +685,7 @@ Groups related controls together visually.
 
 ---
 
-#### `list`
+### `list`
 Repeatable list of items (simple strings/numbers or complex objects).
 
 **Value Type:** `array`
@@ -741,7 +774,7 @@ Repeatable list of items (simple strings/numbers or complex objects).
 
 ---
 
-#### `date`
+### `date`
 Date and optional time picker.
 
 **Value Type:** `number` (Unix timestamp in milliseconds)
@@ -762,7 +795,7 @@ Date and optional time picker.
 
 ---
 
-#### `constant`
+### `constant`
 Hidden field with a constant value (not editable by users).
 
 **Value Type:** Depends on `type` property
@@ -785,9 +818,9 @@ Hidden field with a constant value (not editable by users).
 
 ---
 
-## 🏗️ Organization & Logic
+# 🏗️ Organization & Logic
 
-### 1. Structure (Panels & Tabs)
+## 1. Structure (Panels & Tabs)
 
 Wrap your controls in **Panels** to create collapsible sections in the sidebar.
 
@@ -849,7 +882,7 @@ You can also organize panels into tabs:
 
 ---
 
-### 2. Layout (Rows)
+## 2. Layout (Rows)
 
 - **Single Control:** One control object per row.
 - **Multiple Controls:** Wrap controls in an array to display them side-by-side.
@@ -865,7 +898,7 @@ You can also organize panels into tabs:
 
 ---
 
-### 3. Conditions (Show/Hide Logic)
+## 3. Conditions (Show/Hide Logic)
 
 Add a `condition` array to any control or panel to show/hide it based on other property values.
 
@@ -946,14 +979,14 @@ Add a `condition` array to any control or panel to show/hide it based on other p
 
 ---
 
-### 4. Option Sources (Dynamic Options)
+## 4. Option Sources (Dynamic Options)
 
 For `select`, `radio`, `colorPalette`, and `toggleGroup` controls, you can use shorthand strings to load dynamic options:
 
-#### Source Syntax
+### Source Syntax
 - The source syntax is based off of the URI syntax and uses custom protocols. The two built-in protocols are `select` and `settings`; however, new ones can be registered via filters.
 
-##### The `select` Protocol
+#### The `select` Protocol
 **Notes:**
 - This protocol is used to extract values from a Redux data store that has a `get` or `resolve` function that takes a `string` and `Record<string, any>` as its parameters.
 - At present, that means using the `plaudit/simple-gutenberg-apis` store.
@@ -964,7 +997,7 @@ For `select`, `radio`, `colorPalette`, and `toggleGroup` controls, you can use s
   - To test one of the registered endpoints, run `(await wp.data.select('plaudit/simple-gutenberg-apis').resolve('endpoint.name.here'))` in the same context
 
 
-##### The `settings` Protocol
+#### The `settings` Protocol
 **Notes:**
 - This protocol is used to get values from the theme.json file
 - The returned values are effected by the current block (this is to allow for block-specific values, most-commonly font sizes and colors)
@@ -997,9 +1030,9 @@ For `select`, `radio`, `colorPalette`, and `toggleGroup` controls, you can use s
 
 ---
 
-## 🔧 Advanced Features
+# 🔧 Advanced Features
 
-### Style Properties
+## Style Properties
 
 This feature is intended for setting CSS custom variables based on a block's properties.
 
@@ -1028,7 +1061,7 @@ When the user enters `"20px 40px"`, the block wrapper will receive:
 
 ---
 
-### Validators & Transformers
+## Validators & Transformers
 
 **Note:** These features are only available when using TypeScript/React to define properties programmatically.
 
@@ -1070,7 +1103,7 @@ When the user enters `"20px 40px"`, the block wrapper will receive:
 
 ---
 
-## Tips & Best Practices
+# Tips & Best Practices
 
 1. **Add Help Text:** Use the `help` property to guide users, especially for complex controls.
 

package/src/blocks/common-native-property-constructors.tsx

@@ -20,7 +20,7 @@ import {
 	ExtendedPostPicker, ExtendedRadioControl, ImageControl, type ImageData,
 	ExtendedTextareaControl, MultiSelectControl, type Dict,
 	ProperLinkControl, SortableItemsControl, type PickableOptions,
-	FullSizeToggleControl, ToggleGroupControlOptionWithOptionalIcon, ExtendedTaxonomyPicker, ExtendedTermPicker, ExtendedUserPicker
+	FullSizeToggleControl, ToggleGroupControlOptionWithOptionalIcon, ExtendedTaxonomyPicker, ExtendedTermPicker, ExtendedUserPicker, FileControl
 } from "../controls";
 import {normalizePickableOptionsToObjects, normalizePickableOptionsToPairs} from "../controls/shared";
 import {recordCloneableDefaultValueForNode} from "./data-controller/utils";
@@ -181,6 +181,18 @@ function hydrateDesiccatedSimpleNativeProperty(
 					</BaseControl>;
 				}
 			}
+		case "file":
+			return {
+				type: 'number',
+				alwaysStore: config.alwaysStore,
+				default: config.default,
+				...passthroughProps,
+				validator: config.validator,
+				transformer: config.transformer,
+				control({value, onChange, slots: {Label}}) {
+					return <FileControl label={<Label />} help={config.help} onChange={onChange} value={value} allowedTypes={config.allowedTypes} />;
+				}
+			};
 		case "group":
 			registerPlainTextLabelRequiredMarker("post", " > .components-tools-panel > .components-tools-panel-header > *");
 			const currentTypes = parentTypes.toSpliced(parentTypes.length - 1, 0, 'object');

package/src/blocks/csnp-api.ts

@@ -12,9 +12,9 @@ import type {
 	__experimentalToolsPanel as ToolsPanel
 } from "@wordpress/components";
 
-import type {
+import {
 	ExtendedPostPickerProps, ExtendedTaxonomyPickerProps, ExtendedTaxonomyPickerPropsMultiple, ExtendedTaxonomyPickerPropsSingle,
-	ExtendedTermPickerProps, ExtendedTermPickerPropsMultiple, ExtendedTermPickerPropsSingle, ExtendedUserPickerProps,
+	ExtendedTermPickerProps, ExtendedTermPickerPropsMultiple, ExtendedTermPickerPropsSingle, ExtendedUserPickerProps, FileControl, FileControlProps,
 	FlexibleItem, ImageControl, PickableOptions, ProperLinkControlProps, SortableItemsControlProps, TextareaControlPropsExtension
 } from "../controls";
 import type {IconName} from "./shared-exportable-types";
@@ -52,6 +52,8 @@ export type ConstantPropertyCSNPConfig = Omit<BaseConstantPropertyCSNPConfig, 'd
 export type DatePropertyCSNPConfig = CommonSimpleNativePropertyWithEnum<'date', number, ComponentPropsWithoutRef<typeof DateTimePicker>, 'number', {time: true}>
 	|CommonSimpleNativePropertyWithEnum<'date', number, ComponentPropsWithoutRef<typeof DatePicker>, 'number', {time?: false|undefined}>;
 
+export type FilePropertyCSNPConfig = CommonSimpleNativeProperty<'file', number, Omit<ComponentPropsWithoutRef<typeof FileControl>, 'allowedTypes'>, 'number', Pick<FileControlProps, 'allowedTypes'>>;
+
 type NormalGroupPropertyCSNPConfig = CommonPropertyConfig<'group', Record<string, unknown>, HTMLAttributes<HTMLFieldSetElement>, 'object'>&{
 	fields?: PDSimpleNativeProperty[],
 	interface?: 'default'
@@ -137,14 +139,14 @@ type UserPropertyTypeSingle = CommonPropertyConfig<'user', number, ExtendedUserP
 type UserPropertyTypeMultiple = CommonPropertyConfig<'user', number[], ExtendedUserPickerProps, 'array'>&{userRoles?: string[], multiple: true};
 export type UserPropertyCSNPConfig = UserPropertyTypeSingle|UserPropertyTypeMultiple;
 
-export type CSNPConfig = ColorPaletteCSNPConfig|ConstantPropertyCSNPConfig|DatePropertyCSNPConfig|GroupPropertyCSNPConfig|ImagePropertyCSNPConfig
-	|LinkPropertyCSNPConfig|ListPropertyCSNPConfig|NumberPropertyCSNPConfig|PostPropertyCSNPConfig|RadioPropertyCSNPConfig|RangePropertyCSNPConfig
-	|SelectPropertyCSNPConfig|TaxonomyPropertyCSNPConfig|TermPropertyCSNPConfig|TextareaPropertyCSNPConfig|TextPropertyCSNPConfig|ToggleGroupPropertyCSNPConfig
-	|TogglePropertyCSNPConfig|UserPropertyCSNPConfig;
+export type CSNPConfig = ColorPaletteCSNPConfig|ConstantPropertyCSNPConfig|DatePropertyCSNPConfig|FilePropertyCSNPConfig|GroupPropertyCSNPConfig
+	|ImagePropertyCSNPConfig|LinkPropertyCSNPConfig|ListPropertyCSNPConfig|NumberPropertyCSNPConfig|PostPropertyCSNPConfig|RadioPropertyCSNPConfig
+	|RangePropertyCSNPConfig|SelectPropertyCSNPConfig|TaxonomyPropertyCSNPConfig|TermPropertyCSNPConfig|TextareaPropertyCSNPConfig|TextPropertyCSNPConfig
+	|ToggleGroupPropertyCSNPConfig|TogglePropertyCSNPConfig|UserPropertyCSNPConfig;
 
 export const CSNPControlNames = [
-	'colorPalette', 'constant', 'date', 'group', 'image', 'link', 'list', 'number', 'post', 'radio', 'range', 'select', 'taxonomy', 'term', 'text', 'textarea',
-	'toggle', 'toggleGroup', 'user'
+	'colorPalette', 'constant', 'date', 'file', 'group', 'image', 'link', 'list', 'number', 'post', 'radio', 'range', 'select', 'taxonomy', 'term', 'text',
+	'textarea', 'toggle', 'toggleGroup', 'user'
 ] as const;
 
 export function getPropType(config: PDSimpleNativeProperty): SimpleNativePropertyType {
@@ -155,6 +157,7 @@ export function getPropType(config: PDSimpleNativeProperty): SimpleNativePropert
 			case "constant":
 				return config.type;
 			case "date":
+			case "file":
 				return 'number';
 			case "group":
 			case "image":

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

@@ -10,7 +10,7 @@ import {
 	applyToTree, buildDefaultValueFromDefinition,
 	buildNodeFromDataAndDefinition, getDataStore,
 	moveNodeWithinParent,
-	populateValueBasedOnDefinition, recordCloneableDefaultValueForNode,
+	populateValueBasedOnDefinition, recordCloneableDefaultValueForNode, removeBackupForNode,
 	removeFromParentNode, removeValueFromBackingDataStore,
 	resolveParentNodeDefinition, TreeMutatorResult,
 	walkToNode, writeValueToBackingDataStoreWithCorrections
@@ -123,7 +123,8 @@ export function buildReducer(blockClientId: string) {
 			.addCase(actions.node.remove, (state, {payload: {path}}) => {
 				const parentNode = walkToNode(state.treeRoot, path.slice(0, path.length - 1));
 				removeFromParentNode(parentNode.children, path);
-				removeValueFromBackingDataStore(getDataStore(path[0], state), path);
+				removeValueFromBackingDataStore(getDataStore(path[0], state, true), path);
+				removeBackupForNode(walkToNode(state.treeRoot, path));
 			})
 			.addCase(actions.node.move, (state, {payload: {path, ...action}}) => {
 				// If from and to are the same, then this is a no-op, so we can just skip it
@@ -132,7 +133,7 @@ export function buildReducer(blockClientId: string) {
 				}
 				state.changedByManagedControl = true;
 				moveNodeWithinParent(walkToNode(state.treeRoot, path).children, path, action);
-				const dataStore = getDataStore(path[0], state);
+				const dataStore = getDataStore(path[0], state, true);
 				dataStore.setValue(path[0], produce(dataStore.getValue(path[0]), (dsDraft: any) => {
 					moveNodeWithinParent(walkToNodeInValue(dsDraft, path), path, action);
 				}));

package/src/blocks/data-controller/trigger-handlers.ts

@@ -7,10 +7,11 @@ import type {DCNode, DCStoreState} from "../data-controller";
 import {resolveValueForCondition, testCondition} from "../conditions";
 import {
 	applyToTree,
-	buildDefaultValueFromDefinition,
 	getDataStore,
 	getOptionalValue,
+	recordBackupForNode,
 	removeValueFromBackingDataStore,
+	restoreValueFromPotentialBackup,
 	TreeMutatorResult,
 	walkToNode,
 	walkToNodeInValue,
@@ -111,7 +112,7 @@ function performConditionChecks(state: Draft<DCStoreState>) {
 		} else {
 			const newRendered = testCondition(condition, propertyValueResolverBuilder(path));
 			if (newRendered !== node.rendered) {
-				const dataStore = getDataStore(path[0], state);
+				const dataStore = getDataStore(path[0], state, true);
 				let currentValue: any;
 				try {
 					currentValue = walkToNodeInValue(dataStore.getValue(path[0]), path);
@@ -123,12 +124,12 @@ function performConditionChecks(state: Draft<DCStoreState>) {
 				}
 				if (!newRendered) {
 					// Create a backup if we are transitioning from rendered -> unrendered
-					node.backup = currentValue;
+					recordBackupForNode(node, currentValue);
 					removeValueFromBackingDataStore(dataStore, path);
 				} else if (currentValue === undefined) {
 					// Restore from backup if we are transitioning from unrendered -> rendered
 					const stateNode = walkToNode(state.treeRoot, path);
-					writeValueToBackingDataStore(dataStore, path, stateNode.backup ?? buildDefaultValueFromDefinition(stateNode.definition));
+					writeValueToBackingDataStore(dataStore, path, restoreValueFromPotentialBackup(stateNode));
 				}
 				node.rendered = newRendered;
 			}