@measured/puck 0.10.1-canary.cc20c52 → 0.11.0-canary.5881e1b

package/dist/index.d.ts

@@ -8,100 +8,158 @@ type ItemSelector = {
     zone?: string;
 };
 
-type Adaptor<AdaptorParams = {}> = {
-    name: string;
-    fetchList: (adaptorParams?: AdaptorParams) => Promise<Record<string, any>[] | null>;
-};
-type WithId<T> = T & {
+type WithPuckProps<Props> = Props & {
     id: string;
 };
-type Field<Props extends {
+type BaseField = {
+    label?: string;
+};
+type TextField = BaseField & {
+    type: "text" | "number" | "textarea";
+};
+type SelectField = BaseField & {
+    type: "select" | "radio";
+    options: {
+        label: string;
+        value: string | number | boolean;
+    }[];
+};
+type ArrayField<Props extends {
     [key: string]: any;
 } = {
     [key: string]: any;
-}> = {
-    type: "text" | "textarea" | "number" | "select" | "array" | "external" | "radio" | "custom";
-    label?: string;
-    adaptor?: Adaptor;
-    adaptorParams?: object;
-    arrayFields?: {
-        [SubPropName in keyof Props]: Field<Props[SubPropName][0]>;
+}> = BaseField & {
+    type: "array";
+    arrayFields: {
+        [SubPropName in keyof Props[0]]: Field<Props[0][SubPropName]>;
     };
-    getItemSummary?: (item: Props, index?: number) => string;
-    defaultItemProps?: Props;
-    render?: (props: {
-        field: Field;
+    defaultItemProps?: Props[0];
+    getItemSummary?: (item: Props[0], index?: number) => string;
+};
+type Adaptor<AdaptorParams = {}, TableShape extends Record<string, any> = {}, PropShape = TableShape> = {
+    name: string;
+    fetchList: (adaptorParams?: AdaptorParams) => Promise<TableShape[] | null>;
+    mapProp?: (value: TableShape) => PropShape;
+};
+type ExternalFieldWithAdaptor<Props extends {
+    [key: string]: any;
+} = {
+    [key: string]: any;
+}> = BaseField & {
+    type: "external";
+    placeholder?: string;
+    adaptor: Adaptor<any, any, Props>;
+    adaptorParams?: object;
+    getItemSummary: (item: Props, index?: number) => string;
+};
+type ExternalField<Props extends {
+    [key: string]: any;
+} = {
+    [key: string]: any;
+}> = BaseField & {
+    type: "external";
+    placeholder?: string;
+    fetchList: () => Promise<any[] | null>;
+    mapProp?: (value: any) => Props;
+    getItemSummary: (item: Props, index?: number) => string;
+};
+type CustomField<Props extends {
+    [key: string]: any;
+} = {
+    [key: string]: any;
+}> = BaseField & {
+    type: "custom";
+    render: (props: {
+        field: CustomField;
         name: string;
         value: any;
-        onChange: (value: any) => void;
+        onChange: (value: Props) => void;
         readOnly?: boolean;
     }) => ReactElement;
-    options?: {
-        label: string;
-        value: string | number | boolean;
-    }[];
 };
+type Field<Props extends {
+    [key: string]: any;
+} = {
+    [key: string]: any;
+}> = TextField | SelectField | ArrayField<Props> | ExternalField<Props> | ExternalFieldWithAdaptor<Props> | CustomField;
 type DefaultRootProps = {
-    children: ReactNode;
-    title: string;
-    editMode: boolean;
+    title?: string;
     [key: string]: any;
 };
+type DefaultRootRenderProps = {
+    editMode: boolean;
+} & DefaultRootProps;
 type DefaultComponentProps = {
     [key: string]: any;
     editMode?: boolean;
 };
 type Fields<ComponentProps extends DefaultComponentProps = DefaultComponentProps> = {
-    [PropName in keyof Omit<Required<ComponentProps>, "children" | "editMode">]: Field<ComponentProps[PropName][0]>;
+    [PropName in keyof Omit<Required<ComponentProps>, "children" | "editMode">]: Field<ComponentProps[PropName]>;
 };
 type Content<Props extends {
     [key: string]: any;
 } = {
     [key: string]: any;
-}> = MappedItem<Props>[];
-type ComponentConfig<ComponentProps extends DefaultComponentProps = DefaultComponentProps, DefaultProps = ComponentProps> = {
-    render: (props: WithId<ComponentProps>) => ReactElement;
+}> = ComponentData<Props>[];
+type ComponentConfig<ComponentProps extends DefaultComponentProps = DefaultComponentProps, DefaultProps = ComponentProps, DataShape = ComponentData<ComponentProps>> = {
+    render: (props: WithPuckProps<ComponentProps>) => ReactElement;
     defaultProps?: DefaultProps;
     fields?: Fields<ComponentProps>;
+    resolveData?: (data: DataShape, params: {
+        changed: Partial<Record<keyof ComponentProps, boolean>>;
+    }) => Promise<Partial<ComponentDataWithOptionalProps<ComponentProps>>> | Partial<ComponentDataWithOptionalProps<ComponentProps>>;
+};
+type Category<ComponentName> = {
+    components?: ComponentName[];
+    title?: string;
+    visible?: boolean;
+    defaultExpanded?: boolean;
 };
 type Config<Props extends {
     [key: string]: any;
 } = {
     [key: string]: any;
-}, RootProps extends DefaultRootProps = DefaultRootProps> = {
+}, RootProps extends DefaultRootProps = DefaultRootProps, CategoryName extends string = string> = {
+    categories?: Record<CategoryName, Category<keyof Props>> & {
+        other?: Category<Props>;
+    };
     components: {
-        [ComponentName in keyof Props]: ComponentConfig<Props[ComponentName], Props[ComponentName]>;
+        [ComponentName in keyof Props]: Omit<ComponentConfig<Props[ComponentName], Props[ComponentName]>, "type">;
     };
-    root?: ComponentConfig<RootProps & {
+    root?: Partial<ComponentConfig<RootProps & {
         children: ReactNode;
     }, Partial<RootProps & {
         children: ReactNode;
-    }>>;
+    }>, RootDataWithProps<RootProps>>>;
 };
-type MappedItem<Props extends {
+type BaseData<Props extends {
     [key: string]: any;
 } = {
     [key: string]: any;
 }> = {
+    readOnly?: Partial<Record<keyof Props, boolean>>;
+};
+type ComponentData<Props extends DefaultComponentProps = DefaultComponentProps> = {
     type: keyof Props;
-    props: WithId<{
-        [key: string]: any;
-    }>;
+    props: WithPuckProps<Props>;
+} & BaseData<Props>;
+type RootDataWithProps<Props extends DefaultRootProps = DefaultRootProps> = {
+    props: Props;
 };
-type Data<Props extends {
+type RootDataWithoutProps<Props extends DefaultRootProps = DefaultRootProps> = Props;
+type RootData<Props extends DefaultRootProps = DefaultRootProps> = BaseData<Props> & Partial<RootDataWithProps<Props>> & Partial<RootDataWithoutProps<Props>>;
+type ComponentDataWithOptionalProps<Props extends {
     [key: string]: any;
 } = {
     [key: string]: any;
-}, RootProps extends {
-    title: string;
-    [key: string]: any;
-} = {
-    title: string;
-    [key: string]: any;
-}> = {
-    root: RootProps;
-    content: Content<Props>;
-    zones?: Record<string, Content<Props>>;
+}> = Omit<ComponentData, "props"> & {
+    props: Partial<WithPuckProps<Props>>;
+};
+type MappedItem = ComponentData;
+type Data<Props extends DefaultComponentProps = DefaultComponentProps, RootProps extends DefaultRootProps = DefaultRootProps> = {
+    root: RootData<RootProps>;
+    content: Content<WithPuckProps<Props>>;
+    zones?: Record<string, Content<WithPuckProps<Props>>>;
 };
 type ItemWithId = {
     _arrayId: string;
@@ -115,6 +173,12 @@ type UiState = {
     leftSideBarVisible: boolean;
     itemSelector: ItemSelector | null;
     arrayState: Record<string, ArrayState | undefined>;
+    componentList: Record<string, {
+        components?: string[];
+        title?: string;
+        visible?: boolean;
+        expanded?: boolean;
+    }>;
 };
 type AppState = {
     data: Data;
@@ -170,13 +234,13 @@ type RemoveAction = {
     index: number;
     zone: string;
 };
-type SetStateAction = {
+type SetUiAction = {
     type: "setUi";
-    ui: Partial<UiState>;
+    ui: Partial<UiState> | ((previous: UiState) => Partial<UiState>);
 };
 type SetDataAction = {
     type: "setData";
-    data: Partial<Data>;
+    data: Partial<Data> | ((previous: Data) => Partial<Data>);
 };
 type SetAction = {
     type: "set";
@@ -192,7 +256,7 @@ type UnregisterZoneAction = {
 };
 type PuckAction = {
     recordHistory?: boolean;
-} & (ReorderAction | InsertAction | MoveAction | ReplaceAction | RemoveAction | DuplicateAction | SetAction | SetDataAction | SetStateAction | RegisterZoneAction | UnregisterZoneAction);
+} & (ReorderAction | InsertAction | MoveAction | ReplaceAction | RemoveAction | DuplicateAction | SetAction | SetDataAction | SetUiAction | RegisterZoneAction | UnregisterZoneAction);
 
 type PathData = Record<string, {
     path: string[];
@@ -201,6 +265,7 @@ type PathData = Record<string, {
 type DropZoneContext = {
     data: Data;
     config: Config;
+    componentState?: Record<string, any>;
     itemSelector?: ItemSelector | null;
     setItemSelector?: (newIndex: ItemSelector | null) => void;
     dispatch?: (action: PuckAction) => void;
@@ -265,12 +330,17 @@ type Plugin = {
     }) => ReactElement<any>;
 };
 
-declare function Puck({ config, data: initialData, onChange, onPublish, plugins, renderHeader, renderHeaderActions, headerTitle, headerPath, }: {
+declare function Puck({ config, data: initialData, onChange, onPublish, plugins, renderComponentList, renderHeader, renderHeaderActions, headerTitle, headerPath, }: {
     config: Config;
     data: Data;
     onChange?: (data: Data) => void;
     onPublish: (data: Data) => void;
     plugins?: Plugin[];
+    renderComponentList?: (props: {
+        children: ReactNode;
+        dispatch: (action: PuckAction) => void;
+        state: AppState;
+    }) => ReactElement;
     renderHeader?: (props: {
         children: ReactNode;
         dispatch: (action: PuckAction) => void;
@@ -289,10 +359,19 @@ declare function Render({ config, data }: {
     data: Data;
 }): react_jsx_runtime.JSX.Element;
 
-declare const FieldLabel: ({ children, icon, label, }: {
+declare const resolveAllData: (data: Data, config: Config, onResolveStart?: ((item: MappedItem) => void) | undefined, onResolveEnd?: ((item: MappedItem) => void) | undefined) => Promise<{
+    root: RootDataWithProps<DefaultRootProps> | RootData<DefaultRootProps>;
+    content: any[];
+    zones: Record<string, MappedItem[]>;
+}>;
+
+declare const FieldLabel: ({ children, icon, label, el, readOnly, className, }: {
     children?: ReactNode;
     icon?: ReactNode;
     label: string;
+    el?: "div" | "label" | undefined;
+    readOnly?: boolean | undefined;
+    className?: string | undefined;
 }) => react_jsx_runtime.JSX.Element;
 
-export { Adaptor, AppState, ArrayState, Button, ComponentConfig, Config, Content, Data, DefaultComponentProps, DefaultRootProps, DropZone, DropZoneProvider, Field, FieldLabel, Fields, IconButton, ItemWithId, MappedItem, Puck, Render, UiState, dropZoneContext };
+export { Adaptor, AppState, ArrayField, ArrayState, BaseData, BaseField, Button, ComponentConfig, ComponentData, Config, Content, CustomField, Data, DefaultComponentProps, DefaultRootProps, DefaultRootRenderProps, DropZone, DropZoneProvider, ExternalField, ExternalFieldWithAdaptor, Field, FieldLabel, Fields, IconButton, ItemWithId, MappedItem, Puck, Render, RootData, RootDataWithProps, RootDataWithoutProps, SelectField, TextField, UiState, dropZoneContext, resolveAllData };