layout-state-utils v0.1.1

Layout State Utils

LayoutState

A LayoutState is meant to be an immutable, serializable representation of a layout.

interface ItemProps {
  [key: string]: any;
}

interface ItemMetadata {
  [key: string]: any;
}

interface LayoutItem {
  key: string;
  type: string;
  props: ItemProps;
  metadata: ItemMetadata;
  children: string[];
  parent?: string;
}

interface LayoutState {
  [key: string]: LayoutItem;
}

Utils

All util functions that change a LayoutState will return a new LayoutState with the change, and not change the original.

createKey

Creates a unique key that can be used to add an item to the LayoutState.

const createKey: (layoutState: LayoutState) => string;

addItem

Adds a LayoutItem to the LayoutState.

interface LayoutItemInput {
  key: string;
  type: string;
  props?: ItemProps;
  metadata?: ItemMetadata;
  children?: string[];
  parent?: string;
}

const addItem: (layoutState: LayoutState, item: LayoutItemInput) => LayoutState;

moveItem

Moves a LayoutItem in the LayoutState. If a parent is not provided, the LayoutItem will remain in the LayoutState, but will not be referenced by any other LayoutItems.

type ParentInput = {
  key: string;
  index: number;
};

const moveItem: (
  layoutState: LayoutState,
  key: string,
  parent?: ParentInput,
) => LayoutState;

removeItem

Removes a LayoutItem and all of its descendants from the LayoutState.

const removeItem: (layoutState: LayoutState, key: string) => LayoutState;

updateProps

Updates a LayoutItem's props in the LayoutState.

updateFn must return a new ItemProps and not mutate the original.

type PropUpdater = (ItemProps) => ItemProps;

const updateProps: (
  layoutState: LayoutState,
  key: string,
  updateFn: PropUpdater,
) => LayoutState;

updateMetadata

Updates a LayoutItem's metadata in the LayoutState.

updateFn must return a new ItemMetadata and not mutate the original.

type MetadataUpdater = (ItemMetadata) => ItemMetadata;

const updateMetadata: (
  layoutState: LayoutState,
  key: string,
  updateFn: MetadataUpdater,
) => LayoutState;