@measured/puck 0.16.3-canary.83b8190 → 0.17.0-canary.229cbdd

package/dist/index.css

@@ -607,10 +607,10 @@ textarea._Input-input_3pq3z_47 {
 }
 
 /* css-module:/home/runner/work/puck/puck/packages/core/components/ExternalInput/styles.module.css/#css-module-data */
-._ExternalInput-actions_wprq3_1 {
+._ExternalInput-actions_8wgzm_1 {
   display: flex;
 }
-._ExternalInput-button_wprq3_5 {
+._ExternalInput-button_8wgzm_5 {
   display: flex;
   gap: 8px;
   align-items: center;
@@ -628,16 +628,16 @@ textarea._Input-input_3pq3z_47 {
   overflow: hidden;
   flex-grow: 1;
 }
-._ExternalInput--dataSelected_wprq3_24 ._ExternalInput-button_wprq3_5 {
+._ExternalInput--dataSelected_8wgzm_24 ._ExternalInput-button_8wgzm_5 {
   color: var(--puck-color-grey-03);
   display: block;
   border-top-right-radius: 0px;
   border-bottom-right-radius: 0px;
 }
-._ExternalInput--readOnly_wprq3_31 ._ExternalInput-button_wprq3_5 {
+._ExternalInput--readOnly_8wgzm_31 ._ExternalInput-button_8wgzm_5 {
   background-color: var(--puck-color-grey-11);
 }
-._ExternalInput-detachButton_wprq3_35 {
+._ExternalInput-detachButton_8wgzm_35 {
   border: 1px solid var(--puck-color-grey-09);
   border-top-right-radius: 4px;
   border-bottom-right-radius: 4px;
@@ -652,28 +652,28 @@ textarea._Input-input_3pq3z_47 {
   transition: background-color 50ms ease-in, color 50ms ease-in;
   margin-left: -1px;
 }
-._ExternalInput-button_wprq3_5:focus-visible,
-._ExternalInput-detachButton_wprq3_35:focus-visible {
+._ExternalInput-button_8wgzm_5:focus-visible,
+._ExternalInput-detachButton_8wgzm_35:focus-visible {
   outline: 2px solid var(--puck-color-azure-05);
   outline-offset: 2px;
   z-index: 1;
 }
 @media (hover: hover) and (pointer: fine) {
-  ._ExternalInput_wprq3_1:not(._ExternalInput--readOnly_wprq3_31) ._ExternalInput-button_wprq3_5:hover,
-  ._ExternalInput_wprq3_1:not(._ExternalInput--readOnly_wprq3_31) ._ExternalInput-detachButton_wprq3_35:hover {
+  ._ExternalInput_8wgzm_1:not(._ExternalInput--readOnly_8wgzm_31) ._ExternalInput-button_8wgzm_5:hover,
+  ._ExternalInput_8wgzm_1:not(._ExternalInput--readOnly_8wgzm_31) ._ExternalInput-detachButton_8wgzm_35:hover {
     background: var(--puck-color-azure-12);
     transition: none;
   }
-  ._ExternalInput_wprq3_1:not(._ExternalInput--readOnly_wprq3_31) ._ExternalInput-detachButton_wprq3_35:hover {
+  ._ExternalInput_8wgzm_1:not(._ExternalInput--readOnly_8wgzm_31) ._ExternalInput-detachButton_8wgzm_35:hover {
     color: var(--puck-color-azure-04);
   }
 }
-._ExternalInput_wprq3_1:not(._ExternalInput--readOnly_wprq3_31) ._ExternalInput-button_wprq3_5:active,
-._ExternalInput_wprq3_1:not(._ExternalInput--readOnly_wprq3_31) ._ExternalInput-detachButton_wprq3_35:active {
+._ExternalInput_8wgzm_1:not(._ExternalInput--readOnly_8wgzm_31) ._ExternalInput-button_8wgzm_5:active,
+._ExternalInput_8wgzm_1:not(._ExternalInput--readOnly_8wgzm_31) ._ExternalInput-detachButton_8wgzm_35:active {
   background: var(--puck-color-azure-11);
   transition: none;
 }
-._ExternalInputModal_wprq3_79 {
+._ExternalInputModal_8wgzm_79 {
   color: var(--puck-color-black);
   display: grid;
   grid-template-rows: min-content minmax(128px, 100%) min-content;
@@ -682,35 +682,35 @@ textarea._Input-input_3pq3z_47 {
   min-height: 50dvh;
   max-height: 90dvh;
 }
-._ExternalInputModal-grid_wprq3_89 {
+._ExternalInputModal-grid_8wgzm_89 {
   display: flex;
   flex-direction: column;
 }
 @media (min-width: 458px) {
-  ._ExternalInputModal-grid_wprq3_89 {
+  ._ExternalInputModal-grid_8wgzm_89 {
     display: grid;
     grid-template-columns: 100%;
   }
-  ._ExternalInputModal--filtersToggled_wprq3_100 ._ExternalInputModal-grid_wprq3_89 {
+  ._ExternalInputModal--filtersToggled_8wgzm_100 ._ExternalInputModal-grid_8wgzm_89 {
     grid-template-columns: 25% 75%;
   }
 }
-._ExternalInputModal-filters_wprq3_105 {
+._ExternalInputModal-filters_8wgzm_105 {
   border-bottom: 1px solid var(--puck-color-grey-09);
 }
-._ExternalInputModal--filtersToggled_wprq3_100 ._ExternalInputModal-filters_wprq3_105 {
+._ExternalInputModal--filtersToggled_8wgzm_100 ._ExternalInputModal-filters_8wgzm_105 {
   display: none;
 }
 @media (min-width: 458px) {
-  ._ExternalInputModal-filters_wprq3_105 {
+  ._ExternalInputModal-filters_8wgzm_105 {
     border-right: 1px solid var(--puck-color-grey-09);
     display: none;
   }
-  ._ExternalInputModal--filtersToggled_wprq3_100 ._ExternalInputModal-filters_wprq3_105 {
+  ._ExternalInputModal--filtersToggled_8wgzm_100 ._ExternalInputModal-filters_8wgzm_105 {
     display: block;
   }
 }
-._ExternalInputModal-masthead_wprq3_124 {
+._ExternalInputModal-masthead_8wgzm_124 {
   background-color: var(--puck-color-grey-12);
   border-bottom: 1px solid var(--puck-color-grey-09);
   display: flex;
@@ -718,13 +718,13 @@ textarea._Input-input_3pq3z_47 {
   gap: 24px;
   padding: 24px;
 }
-._ExternalInputModal-tableWrapper_wprq3_133 {
+._ExternalInputModal-tableWrapper_8wgzm_133 {
   position: relative;
   overflow-x: auto;
   overflow-y: auto;
   flex-grow: 1;
 }
-._ExternalInputModal-table_wprq3_133 {
+._ExternalInputModal-table_8wgzm_133 {
   border-collapse: unset;
   border-spacing: 0px;
   color: var(--puck-color-grey-02);
@@ -732,51 +732,51 @@ textarea._Input-input_3pq3z_47 {
   z-index: 0;
   min-width: 100%;
 }
-._ExternalInputModal-thead_wprq3_149 {
+._ExternalInputModal-thead_8wgzm_149 {
   background-color: var(--puck-color-white);
   position: sticky;
   top: 0;
   z-index: 1;
 }
-._ExternalInputModal-th_wprq3_149 {
+._ExternalInputModal-th_8wgzm_149 {
   border-bottom: 1px solid var(--puck-color-grey-09);
   color: var(--puck-color-grey-04);
   font-weight: 500;
   font-size: 14px;
   padding: 16px 24px;
 }
-._ExternalInputModal-td_wprq3_164 {
+._ExternalInputModal-td_8wgzm_164 {
   border-bottom: 1px solid var(--puck-color-grey-10);
   padding: 16px 24px;
 }
-._ExternalInputModal-tr_wprq3_169 ._ExternalInputModal-td_wprq3_164:first-of-type {
+._ExternalInputModal-tr_8wgzm_169 ._ExternalInputModal-td_8wgzm_164:first-of-type {
   font-weight: 500;
   width: 1%;
   white-space: nowrap;
 }
 @media (hover: hover) and (pointer: fine) {
-  ._ExternalInputModal-tbody_wprq3_176 ._ExternalInputModal-tr_wprq3_169:hover {
+  ._ExternalInputModal-tbody_8wgzm_176 ._ExternalInputModal-tr_8wgzm_169:hover {
     background: var(--puck-color-azure-12);
     color: var(--puck-color-azure-04);
     cursor: pointer;
     position: relative;
     margin-left: -5px;
   }
-  ._ExternalInputModal-tbody_wprq3_176 ._ExternalInputModal-tr_wprq3_169:hover ._ExternalInputModal-td_wprq3_164:first-of-type {
+  ._ExternalInputModal-tbody_8wgzm_176 ._ExternalInputModal-tr_8wgzm_169:hover ._ExternalInputModal-td_8wgzm_164:first-of-type {
     border-left: 4px solid var(--puck-color-azure-04);
     padding-left: 20px;
   }
 }
-._ExternalInputModal-tbody_wprq3_176 ._ExternalInputModal-tr_wprq3_169:last-of-type ._ExternalInputModal-td_wprq3_164 {
+._ExternalInputModal-tbody_8wgzm_176 ._ExternalInputModal-tr_8wgzm_169:last-of-type ._ExternalInputModal-td_8wgzm_164 {
   border-bottom: none;
 }
-._ExternalInputModal-tableWrapper_wprq3_133 {
+._ExternalInputModal-tableWrapper_8wgzm_133 {
   display: none;
 }
-._ExternalInputModal--hasData_wprq3_202 ._ExternalInputModal-tableWrapper_wprq3_133 {
+._ExternalInputModal--hasData_8wgzm_202 ._ExternalInputModal-tableWrapper_8wgzm_133 {
   display: block;
 }
-._ExternalInputModal-loadingBanner_wprq3_206 {
+._ExternalInputModal-loadingBanner_8wgzm_206 {
   display: none;
   background-color: color-mix(in srgb, var(--puck-color-white) 90%, transparent);
   padding: 64px;
@@ -788,21 +788,21 @@ textarea._Input-input_3pq3z_47 {
   right: 0;
   bottom: 0;
 }
-._ExternalInputModal--isLoading_wprq3_223 ._ExternalInputModal-loadingBanner_wprq3_206 {
+._ExternalInputModal--isLoading_8wgzm_223 ._ExternalInputModal-loadingBanner_8wgzm_206 {
   display: flex;
 }
-._ExternalInputModal-searchForm_wprq3_227 {
+._ExternalInputModal-searchForm_8wgzm_227 {
   display: flex;
   flex-wrap: wrap;
   gap: 12px;
   flex-grow: 1;
 }
 @media (min-width: 458px) {
-  ._ExternalInputModal-searchForm_wprq3_227 {
+  ._ExternalInputModal-searchForm_8wgzm_227 {
     flex-wrap: nowrap;
   }
 }
-._ExternalInputModal-search_wprq3_227 {
+._ExternalInputModal-search_8wgzm_227 {
   display: flex;
   background: var(--puck-color-white);
   border-width: 1px;
@@ -812,18 +812,18 @@ textarea._Input-input_3pq3z_47 {
   flex-grow: 1;
   transition: border-color 50ms ease-in;
 }
-._ExternalInputModal-search_wprq3_227:focus-within {
+._ExternalInputModal-search_8wgzm_227:focus-within {
   border-color: var(--puck-color-grey-05);
   outline: 2px solid var(--puck-color-azure-05);
   transition: none;
 }
 @media (hover: hover) and (pointer: fine) {
-  ._ExternalInputModal-search_wprq3_227:hover {
+  ._ExternalInputModal-search_8wgzm_227:hover {
     border-color: var(--puck-color-grey-05);
     transition: none;
   }
 }
-._ExternalInputModal-searchIcon_wprq3_264 {
+._ExternalInputModal-searchIcon_8wgzm_264 {
   align-items: center;
   background: var(--puck-color-grey-12);
   border-bottom-left-radius: 4px;
@@ -835,17 +835,17 @@ textarea._Input-input_3pq3z_47 {
   padding: 12px 15px;
   transition: color 50ms ease-in;
 }
-._ExternalInputModal-search_wprq3_227:focus-within ._ExternalInputModal-searchIcon_wprq3_264 {
+._ExternalInputModal-search_8wgzm_227:focus-within ._ExternalInputModal-searchIcon_8wgzm_264 {
   color: var(--puck-color-grey-04);
   transition: none;
 }
 @media (hover: hover) and (pointer: fine) {
-  ._ExternalInputModal-search_wprq3_227:hover ._ExternalInputModal-searchIcon_wprq3_264 {
+  ._ExternalInputModal-search_8wgzm_227:hover ._ExternalInputModal-searchIcon_8wgzm_264 {
     color: var(--puck-color-grey-04);
     transition: none;
   }
 }
-._ExternalInputModal-searchIconText_wprq3_289 {
+._ExternalInputModal-searchIconText_8wgzm_289 {
   clip: rect(0 0 0 0);
   clip-path: inset(100%);
   height: 1px;
@@ -854,7 +854,7 @@ textarea._Input-input_3pq3z_47 {
   white-space: nowrap;
   width: 1px;
 }
-._ExternalInputModal-searchInput_wprq3_299 {
+._ExternalInputModal-searchInput_8wgzm_299 {
   border: none;
   border-radius: 4px;
   background: var(--puck-color-white);
@@ -863,30 +863,32 @@ textarea._Input-input_3pq3z_47 {
   padding: 12px 15px;
   width: 100%;
 }
-._ExternalInputModal-searchInput_wprq3_299:focus {
+._ExternalInputModal-searchInput_8wgzm_299:focus {
   outline: 0;
 }
-._ExternalInputModal-searchActions_wprq3_313 {
+._ExternalInputModal-searchActions_8wgzm_313 {
   display: flex;
   gap: 8px;
   height: 44px;
   width: 100%;
 }
 @media (min-width: 458px) {
-  ._ExternalInputModal-searchActions_wprq3_313 {
+  ._ExternalInputModal-searchActions_8wgzm_313 {
     width: auto;
   }
 }
-._ExternalInputModal-searchActionIcon_wprq3_326 {
+._ExternalInputModal-searchActionIcon_8wgzm_326 {
   align-self: center;
 }
-._ExternalInputModal-footer_wprq3_330 {
+._ExternalInputModal-footerContainer_8wgzm_330 {
   background-color: var(--puck-color-grey-12);
   border-top: 1px solid var(--puck-color-grey-09);
   color: var(--puck-color-grey-04);
+  padding: 16px;
+}
+._ExternalInputModal-footer_8wgzm_330 {
   font-weight: 500;
   font-size: 14px;
-  padding: 16px;
   text-align: right;
 }
 

package/dist/index.d.mts

@@ -1,5 +1,5 @@
-import { F as FieldProps, a as Field, C as Config, D as Data, I as ItemSelector, P as PuckAction, b as DropZoneProps, U as UserGenerics, c as UiState, O as OnAction, d as Permissions, e as Plugin, f as Overrides, V as Viewports, g as IframeConfig, h as InitialHistory, i as DefaultComponentProps, j as DefaultRootFieldProps, H as History, A as AppState, E as ExtractPropsFromConfig, k as ExtractRootPropsFromConfig, l as ComponentDataMap } from './resolve-all-data-BoWgijLi.mjs';
-export { L as Adaptor, J as ArrayField, r as ArrayState, a2 as AsFieldProps, B as BaseData, y as BaseField, t as ComponentConfig, w as ComponentData, x as Content, X as CustomField, $ as DefaultRootProps, _ as DefaultRootRenderProps, W as ExternalField, Q as ExternalFieldWithAdaptor, p as FieldRenderFunctions, Y as Fields, q as ItemWithId, M as MappedItem, N as NumberField, K as ObjectField, n as OverrideKey, s as PuckComponent, Z as PuckContext, G as RadioField, v as RootData, R as RootDataWithProps, u as RootDataWithoutProps, S as SelectField, T as TextField, z as TextareaField, m as Viewport, a3 as WithChildren, a0 as WithId, a1 as WithPuckProps, o as overrideKeys, a4 as resolveAllData } from './resolve-all-data-BoWgijLi.mjs';
+import { F as FieldProps, a as Field, C as Config, D as Data, I as ItemSelector, P as PuckAction, b as DropZoneProps, U as UserGenerics, c as UiState, O as OnAction, d as Permissions, e as Plugin, f as Overrides, V as Viewports, g as IframeConfig, h as InitialHistory, i as DefaultComponentProps, j as DefaultRootFieldProps, H as History, A as AppState, E as ExtractPropsFromConfig, k as ExtractRootPropsFromConfig, l as ComponentDataMap } from './resolve-all-data-Bd3DnhYE.mjs';
+export { L as Adaptor, J as ArrayField, r as ArrayState, a2 as AsFieldProps, B as BaseData, y as BaseField, t as ComponentConfig, w as ComponentData, x as Content, X as CustomField, $ as DefaultRootProps, _ as DefaultRootRenderProps, W as ExternalField, Q as ExternalFieldWithAdaptor, p as FieldRenderFunctions, Y as Fields, q as ItemWithId, M as MappedItem, N as NumberField, K as ObjectField, n as OverrideKey, s as PuckComponent, Z as PuckContext, G as RadioField, v as RootData, R as RootDataWithProps, u as RootDataWithoutProps, S as SelectField, T as TextField, z as TextareaField, m as Viewport, a3 as WithChildren, a0 as WithId, a1 as WithPuckProps, o as overrideKeys, a4 as resolveAllData } from './resolve-all-data-Bd3DnhYE.mjs';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as react from 'react';
 import { ReactNode, SyntheticEvent, ReactElement, CSSProperties } from 'react';

package/dist/index.d.ts

@@ -1,5 +1,5 @@
-import { F as FieldProps, a as Field, C as Config, D as Data, I as ItemSelector, P as PuckAction, b as DropZoneProps, U as UserGenerics, c as UiState, O as OnAction, d as Permissions, e as Plugin, f as Overrides, V as Viewports, g as IframeConfig, h as InitialHistory, i as DefaultComponentProps, j as DefaultRootFieldProps, H as History, A as AppState, E as ExtractPropsFromConfig, k as ExtractRootPropsFromConfig, l as ComponentDataMap } from './resolve-all-data-BoWgijLi.js';
-export { L as Adaptor, J as ArrayField, r as ArrayState, a2 as AsFieldProps, B as BaseData, y as BaseField, t as ComponentConfig, w as ComponentData, x as Content, X as CustomField, $ as DefaultRootProps, _ as DefaultRootRenderProps, W as ExternalField, Q as ExternalFieldWithAdaptor, p as FieldRenderFunctions, Y as Fields, q as ItemWithId, M as MappedItem, N as NumberField, K as ObjectField, n as OverrideKey, s as PuckComponent, Z as PuckContext, G as RadioField, v as RootData, R as RootDataWithProps, u as RootDataWithoutProps, S as SelectField, T as TextField, z as TextareaField, m as Viewport, a3 as WithChildren, a0 as WithId, a1 as WithPuckProps, o as overrideKeys, a4 as resolveAllData } from './resolve-all-data-BoWgijLi.js';
+import { F as FieldProps, a as Field, C as Config, D as Data, I as ItemSelector, P as PuckAction, b as DropZoneProps, U as UserGenerics, c as UiState, O as OnAction, d as Permissions, e as Plugin, f as Overrides, V as Viewports, g as IframeConfig, h as InitialHistory, i as DefaultComponentProps, j as DefaultRootFieldProps, H as History, A as AppState, E as ExtractPropsFromConfig, k as ExtractRootPropsFromConfig, l as ComponentDataMap } from './resolve-all-data-Bd3DnhYE.js';
+export { L as Adaptor, J as ArrayField, r as ArrayState, a2 as AsFieldProps, B as BaseData, y as BaseField, t as ComponentConfig, w as ComponentData, x as Content, X as CustomField, $ as DefaultRootProps, _ as DefaultRootRenderProps, W as ExternalField, Q as ExternalFieldWithAdaptor, p as FieldRenderFunctions, Y as Fields, q as ItemWithId, M as MappedItem, N as NumberField, K as ObjectField, n as OverrideKey, s as PuckComponent, Z as PuckContext, G as RadioField, v as RootData, R as RootDataWithProps, u as RootDataWithoutProps, S as SelectField, T as TextField, z as TextareaField, m as Viewport, a3 as WithChildren, a0 as WithId, a1 as WithPuckProps, o as overrideKeys, a4 as resolveAllData } from './resolve-all-data-Bd3DnhYE.js';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as react from 'react';
 import { ReactNode, SyntheticEvent, ReactElement, CSSProperties } from 'react';

package/dist/index.js

@@ -1485,32 +1485,60 @@ var ArrayField = ({
                               children: [
                                 field.getItemSummary ? field.getItemSummary(data, i) : `Item #${_originalIndex}`,
                                 /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: getClassNameItem("rhs"), children: [
-                                  !readOnly && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: getClassNameItem("actions"), children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: getClassNameItem("action"), children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-                                    IconButton,
-                                    {
-                                      type: "button",
-                                      disabled: field.min !== void 0 && field.min >= localState.arrayState.items.length,
-                                      onClick: (e) => {
-                                        e.stopPropagation();
-                                        const existingValue = [
-                                          ...value || []
-                                        ];
-                                        const existingItems = [
-                                          ...arrayState.items || []
-                                        ];
-                                        existingValue.splice(i, 1);
-                                        existingItems.splice(i, 1);
-                                        onChange(
-                                          existingValue,
-                                          mapArrayStateToUi({
-                                            items: existingItems
-                                          })
-                                        );
-                                      },
-                                      title: "Delete",
-                                      children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Trash, { size: 16 })
-                                    }
-                                  ) }) }),
+                                  !readOnly && /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: getClassNameItem("actions"), children: [
+                                    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: getClassNameItem("action"), children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+                                      IconButton,
+                                      {
+                                        type: "button",
+                                        disabled: !!addDisabled,
+                                        onClick: (e) => {
+                                          e.stopPropagation();
+                                          const existingValue = [
+                                            ...value || []
+                                          ];
+                                          existingValue.splice(
+                                            i,
+                                            0,
+                                            existingValue[i]
+                                          );
+                                          onChange(
+                                            existingValue,
+                                            mapArrayStateToUi(
+                                              regenerateArrayState(existingValue)
+                                            )
+                                          );
+                                        },
+                                        title: "Duplicate",
+                                        children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Copy, { size: 16 })
+                                      }
+                                    ) }),
+                                    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: getClassNameItem("action"), children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+                                      IconButton,
+                                      {
+                                        type: "button",
+                                        disabled: field.min !== void 0 && field.min >= localState.arrayState.items.length,
+                                        onClick: (e) => {
+                                          e.stopPropagation();
+                                          const existingValue = [
+                                            ...value || []
+                                          ];
+                                          const existingItems = [
+                                            ...arrayState.items || []
+                                          ];
+                                          existingValue.splice(i, 1);
+                                          existingItems.splice(i, 1);
+                                          onChange(
+                                            existingValue,
+                                            mapArrayStateToUi({
+                                              items: existingItems
+                                            })
+                                          );
+                                        },
+                                        title: "Delete",
+                                        children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Trash, { size: 16 })
+                                      }
+                                    ) })
+                                  ] }),
                                   /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(DragIcon, {}) })
                                 ] })
                               ]
@@ -1607,7 +1635,7 @@ var DefaultField = ({
           autoComplete: "off",
           type: field.type,
           name,
-          value: typeof value === "undefined" ? "" : value,
+          value: typeof value === "undefined" ? "" : value.toString(),
           onChange: (e) => {
             if (field.type === "number") {
               onChange(Number(e.currentTarget.value));
@@ -1636,7 +1664,7 @@ var import_react10 = require("react");
 
 // css-module:/home/runner/work/puck/puck/packages/core/components/ExternalInput/styles.module.css#css-module
 init_react_import();
-var styles_module_default6 = { "ExternalInput-actions": "_ExternalInput-actions_wprq3_1", "ExternalInput-button": "_ExternalInput-button_wprq3_5", "ExternalInput--dataSelected": "_ExternalInput--dataSelected_wprq3_24", "ExternalInput--readOnly": "_ExternalInput--readOnly_wprq3_31", "ExternalInput-detachButton": "_ExternalInput-detachButton_wprq3_35", "ExternalInput": "_ExternalInput_wprq3_1", "ExternalInputModal": "_ExternalInputModal_wprq3_79", "ExternalInputModal-grid": "_ExternalInputModal-grid_wprq3_89", "ExternalInputModal--filtersToggled": "_ExternalInputModal--filtersToggled_wprq3_100", "ExternalInputModal-filters": "_ExternalInputModal-filters_wprq3_105", "ExternalInputModal-masthead": "_ExternalInputModal-masthead_wprq3_124", "ExternalInputModal-tableWrapper": "_ExternalInputModal-tableWrapper_wprq3_133", "ExternalInputModal-table": "_ExternalInputModal-table_wprq3_133", "ExternalInputModal-thead": "_ExternalInputModal-thead_wprq3_149", "ExternalInputModal-th": "_ExternalInputModal-th_wprq3_149", "ExternalInputModal-td": "_ExternalInputModal-td_wprq3_164", "ExternalInputModal-tr": "_ExternalInputModal-tr_wprq3_169", "ExternalInputModal-tbody": "_ExternalInputModal-tbody_wprq3_176", "ExternalInputModal--hasData": "_ExternalInputModal--hasData_wprq3_202", "ExternalInputModal-loadingBanner": "_ExternalInputModal-loadingBanner_wprq3_206", "ExternalInputModal--isLoading": "_ExternalInputModal--isLoading_wprq3_223", "ExternalInputModal-searchForm": "_ExternalInputModal-searchForm_wprq3_227", "ExternalInputModal-search": "_ExternalInputModal-search_wprq3_227", "ExternalInputModal-searchIcon": "_ExternalInputModal-searchIcon_wprq3_264", "ExternalInputModal-searchIconText": "_ExternalInputModal-searchIconText_wprq3_289", "ExternalInputModal-searchInput": "_ExternalInputModal-searchInput_wprq3_299", "ExternalInputModal-searchActions": "_ExternalInputModal-searchActions_wprq3_313", "ExternalInputModal-searchActionIcon": "_ExternalInputModal-searchActionIcon_wprq3_326", "ExternalInputModal-footer": "_ExternalInputModal-footer_wprq3_330" };
+var styles_module_default6 = { "ExternalInput-actions": "_ExternalInput-actions_8wgzm_1", "ExternalInput-button": "_ExternalInput-button_8wgzm_5", "ExternalInput--dataSelected": "_ExternalInput--dataSelected_8wgzm_24", "ExternalInput--readOnly": "_ExternalInput--readOnly_8wgzm_31", "ExternalInput-detachButton": "_ExternalInput-detachButton_8wgzm_35", "ExternalInput": "_ExternalInput_8wgzm_1", "ExternalInputModal": "_ExternalInputModal_8wgzm_79", "ExternalInputModal-grid": "_ExternalInputModal-grid_8wgzm_89", "ExternalInputModal--filtersToggled": "_ExternalInputModal--filtersToggled_8wgzm_100", "ExternalInputModal-filters": "_ExternalInputModal-filters_8wgzm_105", "ExternalInputModal-masthead": "_ExternalInputModal-masthead_8wgzm_124", "ExternalInputModal-tableWrapper": "_ExternalInputModal-tableWrapper_8wgzm_133", "ExternalInputModal-table": "_ExternalInputModal-table_8wgzm_133", "ExternalInputModal-thead": "_ExternalInputModal-thead_8wgzm_149", "ExternalInputModal-th": "_ExternalInputModal-th_8wgzm_149", "ExternalInputModal-td": "_ExternalInputModal-td_8wgzm_164", "ExternalInputModal-tr": "_ExternalInputModal-tr_8wgzm_169", "ExternalInputModal-tbody": "_ExternalInputModal-tbody_8wgzm_176", "ExternalInputModal--hasData": "_ExternalInputModal--hasData_8wgzm_202", "ExternalInputModal-loadingBanner": "_ExternalInputModal-loadingBanner_8wgzm_206", "ExternalInputModal--isLoading": "_ExternalInputModal--isLoading_8wgzm_223", "ExternalInputModal-searchForm": "_ExternalInputModal-searchForm_8wgzm_227", "ExternalInputModal-search": "_ExternalInputModal-search_8wgzm_227", "ExternalInputModal-searchIcon": "_ExternalInputModal-searchIcon_8wgzm_264", "ExternalInputModal-searchIconText": "_ExternalInputModal-searchIconText_8wgzm_289", "ExternalInputModal-searchInput": "_ExternalInputModal-searchInput_8wgzm_299", "ExternalInputModal-searchActions": "_ExternalInputModal-searchActions_8wgzm_313", "ExternalInputModal-searchActionIcon": "_ExternalInputModal-searchActionIcon_8wgzm_326", "ExternalInputModal-footerContainer": "_ExternalInputModal-footerContainer_8wgzm_330", "ExternalInputModal-footer": "_ExternalInputModal-footer_8wgzm_330" };
 
 // components/Modal/index.tsx
 init_react_import();
@@ -1793,7 +1821,7 @@ var ExternalInput = ({
     const validKeys = /* @__PURE__ */ new Set();
     for (const item of mappedData) {
       for (const key of Object.keys(item)) {
-        if (typeof item[key] === "string" || typeof item[key] === "number") {
+        if (typeof item[key] === "string" || typeof item[key] === "number" || (0, import_react10.isValidElement)(item[key])) {
           validKeys.add(key);
         }
       }
@@ -1814,6 +1842,14 @@ var ExternalInput = ({
     }),
     [id, field]
   );
+  const Footer = (0, import_react10.useCallback)(
+    (props) => field.renderFooter ? field.renderFooter(props) : /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("span", { className: getClassNameModal("footer"), children: [
+      props.items.length,
+      " result",
+      props.items.length === 1 ? "" : "s"
+    ] }),
+    [field.renderFooter]
+  );
   (0, import_react10.useEffect)(() => {
     search(searchQuery, filters);
   }, []);
@@ -1953,11 +1989,7 @@ var ExternalInput = ({
                   /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: getClassNameModal("loadingBanner"), children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Loader, { size: 24 }) })
                 ] })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: getClassNameModal("footer"), children: [
-                mappedData.length,
-                " result",
-                mappedData.length === 1 ? "" : "s"
-              ] })
+              /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: getClassNameModal("footerContainer"), children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Footer, { items: mappedData }) })
             ]
           }
         ) })

package/dist/index.mjs

@@ -1298,32 +1298,60 @@ var ArrayField = ({
                               children: [
                                 field.getItemSummary ? field.getItemSummary(data, i) : `Item #${_originalIndex}`,
                                 /* @__PURE__ */ jsxs4("div", { className: getClassNameItem("rhs"), children: [
-                                  !readOnly && /* @__PURE__ */ jsx9("div", { className: getClassNameItem("actions"), children: /* @__PURE__ */ jsx9("div", { className: getClassNameItem("action"), children: /* @__PURE__ */ jsx9(
-                                    IconButton,
-                                    {
-                                      type: "button",
-                                      disabled: field.min !== void 0 && field.min >= localState.arrayState.items.length,
-                                      onClick: (e) => {
-                                        e.stopPropagation();
-                                        const existingValue = [
-                                          ...value || []
-                                        ];
-                                        const existingItems = [
-                                          ...arrayState.items || []
-                                        ];
-                                        existingValue.splice(i, 1);
-                                        existingItems.splice(i, 1);
-                                        onChange(
-                                          existingValue,
-                                          mapArrayStateToUi({
-                                            items: existingItems
-                                          })
-                                        );
-                                      },
-                                      title: "Delete",
-                                      children: /* @__PURE__ */ jsx9(Trash, { size: 16 })
-                                    }
-                                  ) }) }),
+                                  !readOnly && /* @__PURE__ */ jsxs4("div", { className: getClassNameItem("actions"), children: [
+                                    /* @__PURE__ */ jsx9("div", { className: getClassNameItem("action"), children: /* @__PURE__ */ jsx9(
+                                      IconButton,
+                                      {
+                                        type: "button",
+                                        disabled: !!addDisabled,
+                                        onClick: (e) => {
+                                          e.stopPropagation();
+                                          const existingValue = [
+                                            ...value || []
+                                          ];
+                                          existingValue.splice(
+                                            i,
+                                            0,
+                                            existingValue[i]
+                                          );
+                                          onChange(
+                                            existingValue,
+                                            mapArrayStateToUi(
+                                              regenerateArrayState(existingValue)
+                                            )
+                                          );
+                                        },
+                                        title: "Duplicate",
+                                        children: /* @__PURE__ */ jsx9(Copy, { size: 16 })
+                                      }
+                                    ) }),
+                                    /* @__PURE__ */ jsx9("div", { className: getClassNameItem("action"), children: /* @__PURE__ */ jsx9(
+                                      IconButton,
+                                      {
+                                        type: "button",
+                                        disabled: field.min !== void 0 && field.min >= localState.arrayState.items.length,
+                                        onClick: (e) => {
+                                          e.stopPropagation();
+                                          const existingValue = [
+                                            ...value || []
+                                          ];
+                                          const existingItems = [
+                                            ...arrayState.items || []
+                                          ];
+                                          existingValue.splice(i, 1);
+                                          existingItems.splice(i, 1);
+                                          onChange(
+                                            existingValue,
+                                            mapArrayStateToUi({
+                                              items: existingItems
+                                            })
+                                          );
+                                        },
+                                        title: "Delete",
+                                        children: /* @__PURE__ */ jsx9(Trash, { size: 16 })
+                                      }
+                                    ) })
+                                  ] }),
                                   /* @__PURE__ */ jsx9("div", { children: /* @__PURE__ */ jsx9(DragIcon, {}) })
                                 ] })
                               ]
@@ -1420,7 +1448,7 @@ var DefaultField = ({
           autoComplete: "off",
           type: field.type,
           name,
-          value: typeof value === "undefined" ? "" : value,
+          value: typeof value === "undefined" ? "" : value.toString(),
           onChange: (e) => {
             if (field.type === "number") {
               onChange(Number(e.currentTarget.value));
@@ -1445,11 +1473,17 @@ import { useEffect as useEffect8 } from "react";
 
 // components/ExternalInput/index.tsx
 init_react_import();
-import { useMemo, useEffect as useEffect7, useState as useState8, useCallback as useCallback4 } from "react";
+import {
+  useMemo,
+  useEffect as useEffect7,
+  useState as useState8,
+  useCallback as useCallback4,
+  isValidElement
+} from "react";
 
 // css-module:/home/runner/work/puck/puck/packages/core/components/ExternalInput/styles.module.css#css-module
 init_react_import();
-var styles_module_default6 = { "ExternalInput-actions": "_ExternalInput-actions_wprq3_1", "ExternalInput-button": "_ExternalInput-button_wprq3_5", "ExternalInput--dataSelected": "_ExternalInput--dataSelected_wprq3_24", "ExternalInput--readOnly": "_ExternalInput--readOnly_wprq3_31", "ExternalInput-detachButton": "_ExternalInput-detachButton_wprq3_35", "ExternalInput": "_ExternalInput_wprq3_1", "ExternalInputModal": "_ExternalInputModal_wprq3_79", "ExternalInputModal-grid": "_ExternalInputModal-grid_wprq3_89", "ExternalInputModal--filtersToggled": "_ExternalInputModal--filtersToggled_wprq3_100", "ExternalInputModal-filters": "_ExternalInputModal-filters_wprq3_105", "ExternalInputModal-masthead": "_ExternalInputModal-masthead_wprq3_124", "ExternalInputModal-tableWrapper": "_ExternalInputModal-tableWrapper_wprq3_133", "ExternalInputModal-table": "_ExternalInputModal-table_wprq3_133", "ExternalInputModal-thead": "_ExternalInputModal-thead_wprq3_149", "ExternalInputModal-th": "_ExternalInputModal-th_wprq3_149", "ExternalInputModal-td": "_ExternalInputModal-td_wprq3_164", "ExternalInputModal-tr": "_ExternalInputModal-tr_wprq3_169", "ExternalInputModal-tbody": "_ExternalInputModal-tbody_wprq3_176", "ExternalInputModal--hasData": "_ExternalInputModal--hasData_wprq3_202", "ExternalInputModal-loadingBanner": "_ExternalInputModal-loadingBanner_wprq3_206", "ExternalInputModal--isLoading": "_ExternalInputModal--isLoading_wprq3_223", "ExternalInputModal-searchForm": "_ExternalInputModal-searchForm_wprq3_227", "ExternalInputModal-search": "_ExternalInputModal-search_wprq3_227", "ExternalInputModal-searchIcon": "_ExternalInputModal-searchIcon_wprq3_264", "ExternalInputModal-searchIconText": "_ExternalInputModal-searchIconText_wprq3_289", "ExternalInputModal-searchInput": "_ExternalInputModal-searchInput_wprq3_299", "ExternalInputModal-searchActions": "_ExternalInputModal-searchActions_wprq3_313", "ExternalInputModal-searchActionIcon": "_ExternalInputModal-searchActionIcon_wprq3_326", "ExternalInputModal-footer": "_ExternalInputModal-footer_wprq3_330" };
+var styles_module_default6 = { "ExternalInput-actions": "_ExternalInput-actions_8wgzm_1", "ExternalInput-button": "_ExternalInput-button_8wgzm_5", "ExternalInput--dataSelected": "_ExternalInput--dataSelected_8wgzm_24", "ExternalInput--readOnly": "_ExternalInput--readOnly_8wgzm_31", "ExternalInput-detachButton": "_ExternalInput-detachButton_8wgzm_35", "ExternalInput": "_ExternalInput_8wgzm_1", "ExternalInputModal": "_ExternalInputModal_8wgzm_79", "ExternalInputModal-grid": "_ExternalInputModal-grid_8wgzm_89", "ExternalInputModal--filtersToggled": "_ExternalInputModal--filtersToggled_8wgzm_100", "ExternalInputModal-filters": "_ExternalInputModal-filters_8wgzm_105", "ExternalInputModal-masthead": "_ExternalInputModal-masthead_8wgzm_124", "ExternalInputModal-tableWrapper": "_ExternalInputModal-tableWrapper_8wgzm_133", "ExternalInputModal-table": "_ExternalInputModal-table_8wgzm_133", "ExternalInputModal-thead": "_ExternalInputModal-thead_8wgzm_149", "ExternalInputModal-th": "_ExternalInputModal-th_8wgzm_149", "ExternalInputModal-td": "_ExternalInputModal-td_8wgzm_164", "ExternalInputModal-tr": "_ExternalInputModal-tr_8wgzm_169", "ExternalInputModal-tbody": "_ExternalInputModal-tbody_8wgzm_176", "ExternalInputModal--hasData": "_ExternalInputModal--hasData_8wgzm_202", "ExternalInputModal-loadingBanner": "_ExternalInputModal-loadingBanner_8wgzm_206", "ExternalInputModal--isLoading": "_ExternalInputModal--isLoading_8wgzm_223", "ExternalInputModal-searchForm": "_ExternalInputModal-searchForm_8wgzm_227", "ExternalInputModal-search": "_ExternalInputModal-search_8wgzm_227", "ExternalInputModal-searchIcon": "_ExternalInputModal-searchIcon_8wgzm_264", "ExternalInputModal-searchIconText": "_ExternalInputModal-searchIconText_8wgzm_289", "ExternalInputModal-searchInput": "_ExternalInputModal-searchInput_8wgzm_299", "ExternalInputModal-searchActions": "_ExternalInputModal-searchActions_8wgzm_313", "ExternalInputModal-searchActionIcon": "_ExternalInputModal-searchActionIcon_8wgzm_326", "ExternalInputModal-footerContainer": "_ExternalInputModal-footerContainer_8wgzm_330", "ExternalInputModal-footer": "_ExternalInputModal-footer_8wgzm_330" };
 
 // components/Modal/index.tsx
 init_react_import();
@@ -1606,7 +1640,7 @@ var ExternalInput = ({
     const validKeys = /* @__PURE__ */ new Set();
     for (const item of mappedData) {
       for (const key of Object.keys(item)) {
-        if (typeof item[key] === "string" || typeof item[key] === "number") {
+        if (typeof item[key] === "string" || typeof item[key] === "number" || isValidElement(item[key])) {
           validKeys.add(key);
         }
       }
@@ -1627,6 +1661,14 @@ var ExternalInput = ({
     }),
     [id, field]
   );
+  const Footer = useCallback4(
+    (props) => field.renderFooter ? field.renderFooter(props) : /* @__PURE__ */ jsxs7("span", { className: getClassNameModal("footer"), children: [
+      props.items.length,
+      " result",
+      props.items.length === 1 ? "" : "s"
+    ] }),
+    [field.renderFooter]
+  );
   useEffect7(() => {
     search(searchQuery, filters);
   }, []);
@@ -1766,11 +1808,7 @@ var ExternalInput = ({
                   /* @__PURE__ */ jsx14("div", { className: getClassNameModal("loadingBanner"), children: /* @__PURE__ */ jsx14(Loader, { size: 24 }) })
                 ] })
               ] }),
-              /* @__PURE__ */ jsxs7("div", { className: getClassNameModal("footer"), children: [
-                mappedData.length,
-                " result",
-                mappedData.length === 1 ? "" : "s"
-              ] })
+              /* @__PURE__ */ jsx14("div", { className: getClassNameModal("footerContainer"), children: /* @__PURE__ */ jsx14(Footer, { items: mappedData }) })
             ]
           }
         ) })

package/dist/{resolve-all-data-BoWgijLi.d.mts → resolve-all-data-Bd3DnhYE.d.mts}

@@ -91,9 +91,12 @@ type ExternalField<Props extends {
         filters: Record<string, any>;
     }) => Promise<any[] | null>;
     mapProp?: (value: any) => Props;
-    mapRow?: (value: any) => Record<string, string | number>;
+    mapRow?: (value: any) => Record<string, string | number | ReactElement>;
     getItemSummary?: (item: Props, index?: number) => string;
     showSearch?: boolean;
+    renderFooter?: (props: {
+        items: any[];
+    }) => ReactElement;
     initialQuery?: string;
     filterFields?: Record<string, Field>;
     initialFilters?: Record<string, any>;

package/dist/{resolve-all-data-BoWgijLi.d.ts → resolve-all-data-Bd3DnhYE.d.ts}

@@ -91,9 +91,12 @@ type ExternalField<Props extends {
         filters: Record<string, any>;
     }) => Promise<any[] | null>;
     mapProp?: (value: any) => Props;
-    mapRow?: (value: any) => Record<string, string | number>;
+    mapRow?: (value: any) => Record<string, string | number | ReactElement>;
     getItemSummary?: (item: Props, index?: number) => string;
     showSearch?: boolean;
+    renderFooter?: (props: {
+        items: any[];
+    }) => ReactElement;
     initialQuery?: string;
     filterFields?: Record<string, Field>;
     initialFilters?: Record<string, any>;

package/dist/rsc.d.mts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { C as Config, D as Data } from './resolve-all-data-BoWgijLi.mjs';
-export { a4 as resolveAllData } from './resolve-all-data-BoWgijLi.mjs';
+import { C as Config, D as Data } from './resolve-all-data-Bd3DnhYE.mjs';
+export { a4 as resolveAllData } from './resolve-all-data-Bd3DnhYE.mjs';
 import 'react';
 
 declare function Render<UserConfig extends Config = Config>({ config, data, }: {

package/dist/rsc.d.ts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { C as Config, D as Data } from './resolve-all-data-BoWgijLi.js';
-export { a4 as resolveAllData } from './resolve-all-data-BoWgijLi.js';
+import { C as Config, D as Data } from './resolve-all-data-Bd3DnhYE.js';
+export { a4 as resolveAllData } from './resolve-all-data-Bd3DnhYE.js';
 import 'react';
 
 declare function Render<UserConfig extends Config = Config>({ config, data, }: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@measured/puck",
-  "version": "0.16.3-canary.83b8190",
+  "version": "0.17.0-canary.229cbdd",
   "author": "Measured Corporation Ltd <hello@measured.co>",
   "repository": "measuredco/puck",
   "bugs": "https://github.com/measuredco/puck/issues",