@routevn/creator-model 1.2.10 → 1.3.1

package/src/model.js

@@ -35,7 +35,7 @@ const COLLECTION_KEYS = [
   "layouts",
   "controls",
 ];
-const ROOT_KEYS = ["project", "story", ...COLLECTION_KEYS];
+const ROOT_KEYS = ["project", "story", "tags", ...COLLECTION_KEYS];
 const LINE_UPDATE_ACTIONS_PRESERVE_PATHS = ["dialogue.content"];
 const LINE_UPDATE_ACTIONS_PRESERVE_PATHS_SET = new Set(
   LINE_UPDATE_ACTIONS_PRESERVE_PATHS,
@@ -44,6 +44,73 @@ const createEmptyCollectionState = () => ({
   items: {},
   tree: [],
 });
+const TAG_SCOPE_BASE_KEYS = [
+  "images",
+  "sounds",
+  "videos",
+  "characters",
+  "fonts",
+  "transforms",
+  "colors",
+  "textStyles",
+  "variables",
+  "layouts",
+  "controls",
+  "animations",
+  "particles",
+  "spritesheets",
+];
+const CHARACTER_SPRITE_TAG_SCOPE_PREFIX = "characterSprites:";
+const createEmptyTagsState = () => ({
+  images: createEmptyCollectionState(),
+  sounds: createEmptyCollectionState(),
+  videos: createEmptyCollectionState(),
+  characters: createEmptyCollectionState(),
+  fonts: createEmptyCollectionState(),
+  transforms: createEmptyCollectionState(),
+  colors: createEmptyCollectionState(),
+  textStyles: createEmptyCollectionState(),
+  variables: createEmptyCollectionState(),
+  layouts: createEmptyCollectionState(),
+  controls: createEmptyCollectionState(),
+  animations: createEmptyCollectionState(),
+  particles: createEmptyCollectionState(),
+  spritesheets: createEmptyCollectionState(),
+});
+const isCharacterSpriteTagScopeKey = (value) =>
+  isNonEmptyString(value) &&
+  value.startsWith(CHARACTER_SPRITE_TAG_SCOPE_PREFIX) &&
+  value.length > CHARACTER_SPRITE_TAG_SCOPE_PREFIX.length;
+const getCharacterSpriteTagScopeCharacterId = (scopeKey) =>
+  isCharacterSpriteTagScopeKey(scopeKey)
+    ? scopeKey.slice(CHARACTER_SPRITE_TAG_SCOPE_PREFIX.length)
+    : undefined;
+const isBaseTagScopeKey = (scopeKey) => TAG_SCOPE_BASE_KEYS.includes(scopeKey);
+const normalizeTagsState = (tags) => {
+  if (tags === undefined) {
+    return createEmptyTagsState();
+  }
+
+  if (!isPlainObject(tags)) {
+    return tags;
+  }
+
+  const missingBaseScopeKeys = TAG_SCOPE_BASE_KEYS.filter(
+    (scopeKey) => tags[scopeKey] === undefined,
+  );
+  if (missingBaseScopeKeys.length === 0) {
+    return tags;
+  }
+
+  const nextTags = {
+    ...tags,
+  };
+  for (const scopeKey of missingBaseScopeKeys) {
+    nextTags[scopeKey] = createEmptyCollectionState();
+  }
+
+  return nextTags;
+};
 
 const normalizeStateCollections = (state) => {
   if (!isPlainObject(state)) {
@@ -55,8 +122,10 @@ const normalizeStateCollections = (state) => {
     "particles",
     "controls",
   ].filter((key) => state[key] === undefined);
+  const normalizedTags = normalizeTagsState(state.tags);
+  const hasNormalizedTags = normalizedTags !== state.tags;
 
-  if (missingCollectionKeys.length === 0) {
+  if (missingCollectionKeys.length === 0 && !hasNormalizedTags) {
     return state;
   }
 
@@ -68,6 +137,10 @@ const normalizeStateCollections = (state) => {
     nextState[key] = createEmptyCollectionState();
   });
 
+  if (hasNormalizedTags) {
+    nextState.tags = normalizedTags;
+  }
+
   return nextState;
 };
 const isString = (value) => typeof value === "string";
@@ -164,7 +237,7 @@ const LAYOUT_ELEMENT_BASE_TYPES = [
   "container-ref-confirm-dialog-ok",
   "container-ref-confirm-dialog-cancel",
 ];
-export const SCHEMA_VERSION = 2;
+export const SCHEMA_VERSION = 3;
 const LAYOUT_CONTAINER_ELEMENT_TYPES = [
   "folder",
   "container",
@@ -268,6 +341,7 @@ const isVariableReferenceTarget = (state, variableId) => {
 };
 
 const LAYOUT_ITEM_TARGET_SET = new Set(["item.savedAt"]);
+const LAYOUT_DIALOGUE_TARGET_SET = new Set(["dialogue.characterId"]);
 const RUNTIME_TARGET_DOT_PATTERN = /^runtime\.([A-Za-z_$][A-Za-z0-9_$]*)$/;
 const VARIABLE_TARGET_DOT_PATTERN = /^variables\.([A-Za-z_$][A-Za-z0-9_$]*)$/;
 const VARIABLE_TARGET_BRACKET_PATTERN = /^variables\[(.+)\]$/;
@@ -284,6 +358,13 @@ const parseLayoutConditionTarget = (target) => {
     };
   }
 
+  if (LAYOUT_DIALOGUE_TARGET_SET.has(target)) {
+    return {
+      kind: "dialogue",
+      target,
+    };
+  }
+
   const runtimeMatch = target.match(RUNTIME_TARGET_DOT_PATTERN);
   if (runtimeMatch && isRuntimeFieldId(runtimeMatch[1])) {
     return {
@@ -340,7 +421,7 @@ const isLayoutConditionTarget = (state, target) => {
     return false;
   }
 
-  if (parsedTarget.kind === "runtime") {
+  if (parsedTarget.kind !== "variable") {
     return true;
   }
 
@@ -781,6 +862,7 @@ const validateImageItems = ({ items, path, errorFactory }) => {
                 "type",
                 "name",
                 "description",
+                "tagIds",
                 "thumbnailFileId",
                 "fileId",
                 "width",
@@ -823,6 +905,18 @@ const validateImageItems = ({ items, path, errorFactory }) => {
     }
 
     if (item.type === "image") {
+      {
+        const result = validateOptionalUniqueIdArray({
+          value: item.tagIds,
+          path: `${itemPath}.tagIds`,
+          errorFactory,
+          allowEmpty: false,
+        });
+        if (result?.valid === false) {
+          return result;
+        }
+      }
+
       if (
         item.thumbnailFileId !== undefined &&
         !isNonEmptyString(item.thumbnailFileId)
@@ -948,6 +1042,7 @@ const validateSpritesheetItems = ({ items, path, errorFactory }) => {
                 "type",
                 "name",
                 "description",
+                "tagIds",
                 "thumbnailFileId",
                 "fileId",
                 "sheetWidth",
@@ -995,6 +1090,18 @@ const validateSpritesheetItems = ({ items, path, errorFactory }) => {
     }
 
     if (item.type === "spritesheet") {
+      {
+        const result = validateOptionalUniqueIdArray({
+          value: item.tagIds,
+          path: `${itemPath}.tagIds`,
+          errorFactory,
+          allowEmpty: false,
+        });
+        if (result?.valid === false) {
+          return result;
+        }
+      }
+
       if (
         item.thumbnailFileId !== undefined &&
         !isNonEmptyString(item.thumbnailFileId)
@@ -1070,6 +1177,7 @@ const validateSoundItems = ({ items, path, errorFactory }) => {
                 "type",
                 "name",
                 "description",
+                "tagIds",
                 "fileId",
                 "waveformDataFileId",
                 "duration",
@@ -1111,6 +1219,18 @@ const validateSoundItems = ({ items, path, errorFactory }) => {
     }
 
     if (item.type === "sound") {
+      {
+        const result = validateOptionalUniqueIdArray({
+          value: item.tagIds,
+          path: `${itemPath}.tagIds`,
+          errorFactory,
+          allowEmpty: false,
+        });
+        if (result?.valid === false) {
+          return result;
+        }
+      }
+
       if (!isNonEmptyString(item.fileId)) {
         return invalidFromErrorFactory(
           errorFactory,
@@ -1161,6 +1281,7 @@ const validateVideoItems = ({ items, path, errorFactory }) => {
                 "type",
                 "name",
                 "description",
+                "tagIds",
                 "fileId",
                 "thumbnailFileId",
                 "duration",
@@ -1204,6 +1325,18 @@ const validateVideoItems = ({ items, path, errorFactory }) => {
     }
 
     if (item.type === "video") {
+      {
+        const result = validateOptionalUniqueIdArray({
+          value: item.tagIds,
+          path: `${itemPath}.tagIds`,
+          errorFactory,
+          allowEmpty: false,
+        });
+        if (result?.valid === false) {
+          return result;
+        }
+      }
+
       if (!isNonEmptyString(item.fileId)) {
         return invalidFromErrorFactory(
           errorFactory,
@@ -1868,7 +2001,7 @@ const validateAnimationItems = ({ items, path, errorFactory }) => {
         allowedKeys:
           item.type === "folder"
             ? ["id", "type", "name", "description"]
-            : ["id", "type", "name", "description", "animation"],
+            : ["id", "type", "name", "description", "tagIds", "animation"],
         path: itemPath,
         errorFactory,
       });
@@ -1906,6 +2039,18 @@ const validateAnimationItems = ({ items, path, errorFactory }) => {
     }
 
     if (item.type === "animation") {
+      {
+        const result = validateOptionalUniqueIdArray({
+          value: item.tagIds,
+          path: `${itemPath}.tagIds`,
+          errorFactory,
+          allowEmpty: false,
+        });
+        if (result?.valid === false) {
+          return result;
+        }
+      }
+
       {
         const result = validateAnimationDefinition({
           animation: item.animation,
@@ -1942,6 +2087,7 @@ const validateFontItems = ({ items, path, errorFactory }) => {
                 "type",
                 "name",
                 "description",
+                "tagIds",
                 "fileId",
                 "fontFamily",
               ],
@@ -1982,6 +2128,18 @@ const validateFontItems = ({ items, path, errorFactory }) => {
     }
 
     if (item.type === "font") {
+      {
+        const result = validateOptionalUniqueIdArray({
+          value: item.tagIds,
+          path: `${itemPath}.tagIds`,
+          errorFactory,
+          allowEmpty: false,
+        });
+        if (result?.valid === false) {
+          return result;
+        }
+      }
+
       if (!isNonEmptyString(item.fileId)) {
         return invalidFromErrorFactory(
           errorFactory,
@@ -1995,7 +2153,6 @@ const validateFontItems = ({ items, path, errorFactory }) => {
           `${itemPath}.fontFamily must be a non-empty string`,
         );
       }
-
     }
   }
 };
@@ -2017,7 +2174,7 @@ const validateColorItems = ({ items, path, errorFactory }) => {
         allowedKeys:
           item.type === "folder"
             ? ["id", "type", "name", "description"]
-            : ["id", "type", "name", "description", "hex"],
+            : ["id", "type", "name", "description", "tagIds", "hex"],
         path: itemPath,
         errorFactory,
       });
@@ -2054,11 +2211,25 @@ const validateColorItems = ({ items, path, errorFactory }) => {
       );
     }
 
-    if (item.type === "color" && !isHexColor(item.hex)) {
-      return invalidFromErrorFactory(
-        errorFactory,
-        `${itemPath}.hex must be a #RRGGBB string`,
-      );
+    if (item.type === "color") {
+      {
+        const result = validateOptionalUniqueIdArray({
+          value: item.tagIds,
+          path: `${itemPath}.tagIds`,
+          errorFactory,
+          allowEmpty: false,
+        });
+        if (result?.valid === false) {
+          return result;
+        }
+      }
+
+      if (!isHexColor(item.hex)) {
+        return invalidFromErrorFactory(
+          errorFactory,
+          `${itemPath}.hex must be a #RRGGBB string`,
+        );
+      }
     }
   }
 };
@@ -2085,6 +2256,7 @@ const validateTransformItems = ({ items, path, errorFactory }) => {
                 "type",
                 "name",
                 "description",
+                "tagIds",
                 "x",
                 "y",
                 "scaleX",
@@ -2130,6 +2302,18 @@ const validateTransformItems = ({ items, path, errorFactory }) => {
     }
 
     if (item.type === "transform") {
+      {
+        const result = validateOptionalUniqueIdArray({
+          value: item.tagIds,
+          path: `${itemPath}.tagIds`,
+          errorFactory,
+          allowEmpty: false,
+        });
+        if (result?.valid === false) {
+          return result;
+        }
+      }
+
       for (const key of [
         "x",
         "y",
@@ -2206,6 +2390,7 @@ const validateParticleItems = ({ items, path, errorFactory }) => {
                 "type",
                 "name",
                 "description",
+                "tagIds",
                 "width",
                 "height",
                 "seed",
@@ -2251,6 +2436,18 @@ const validateParticleItems = ({ items, path, errorFactory }) => {
       continue;
     }
 
+    {
+      const result = validateOptionalUniqueIdArray({
+        value: item.tagIds,
+        path: `${itemPath}.tagIds`,
+        errorFactory,
+        allowEmpty: false,
+      });
+      if (result?.valid === false) {
+        return result;
+      }
+    }
+
     if (!isFiniteNumber(item.width) || item.width <= 0) {
       return invalidFromErrorFactory(
         errorFactory,
@@ -2333,6 +2530,7 @@ const validateVariableItems = ({ items, path, errorFactory }) => {
                 "type",
                 "name",
                 "description",
+                "tagIds",
                 "scope",
                 "default",
                 "value",
@@ -2374,6 +2572,18 @@ const validateVariableItems = ({ items, path, errorFactory }) => {
     }
 
     if (variableType !== "folder") {
+      {
+        const result = validateOptionalUniqueIdArray({
+          value: item.tagIds,
+          path: `${itemPath}.tagIds`,
+          errorFactory,
+          allowEmpty: false,
+        });
+        if (result?.valid === false) {
+          return result;
+        }
+      }
+
       if (!VARIABLE_SCOPE_KEYS.includes(item.scope)) {
         return invalidFromErrorFactory(
           errorFactory,
@@ -2429,6 +2639,7 @@ const validateTextStyleItems = ({ items, path, errorFactory }) => {
                 "type",
                 "name",
                 "description",
+                "tagIds",
                 "fontId",
                 "colorId",
                 "fontSize",
@@ -2481,6 +2692,18 @@ const validateTextStyleItems = ({ items, path, errorFactory }) => {
     }
 
     if (item.type === "textStyle") {
+      {
+        const result = validateOptionalUniqueIdArray({
+          value: item.tagIds,
+          path: `${itemPath}.tagIds`,
+          errorFactory,
+          allowEmpty: false,
+        });
+        if (result?.valid === false) {
+          return result;
+        }
+      }
+
       if (!isNonEmptyString(item.fontId)) {
         return invalidFromErrorFactory(
           errorFactory,
@@ -2594,7 +2817,12 @@ const validateTextStyleItems = ({ items, path, errorFactory }) => {
   }
 };
 
-const validateCharacterSpriteItems = ({ items, path, errorFactory }) => {
+const validateCharacterSpriteItems = ({
+  items,
+  path,
+  errorFactory,
+  allowTagIds = true,
+}) => {
   for (const [itemId, item] of Object.entries(items)) {
     const itemPath = `${path}.${itemId}`;
 
@@ -2616,6 +2844,7 @@ const validateCharacterSpriteItems = ({ items, path, errorFactory }) => {
                 "type",
                 "name",
                 "description",
+                ...(allowTagIds ? ["tagIds"] : []),
                 "thumbnailFileId",
                 "fileId",
                 "width",
@@ -2658,6 +2887,20 @@ const validateCharacterSpriteItems = ({ items, path, errorFactory }) => {
     }
 
     if (item.type === "image") {
+      if (allowTagIds) {
+        {
+          const result = validateOptionalUniqueIdArray({
+            value: item.tagIds,
+            path: `${itemPath}.tagIds`,
+            errorFactory,
+            allowEmpty: false,
+          });
+          if (result?.valid === false) {
+            return result;
+          }
+        }
+      }
+
       if (
         item.thumbnailFileId !== undefined &&
         !isNonEmptyString(item.thumbnailFileId)
@@ -3453,6 +3696,8 @@ const validateCharacterItems = ({ items, path, errorFactory }) => {
                 "type",
                 "name",
                 "description",
+                "tagIds",
+                "spriteGroups",
                 "shortcut",
                 "fileId",
                 "sprites",
@@ -3494,6 +3739,31 @@ const validateCharacterItems = ({ items, path, errorFactory }) => {
     }
 
     if (item.type === "character") {
+      {
+        const result = validateOptionalUniqueIdArray({
+          value: item.tagIds,
+          path: `${itemPath}.tagIds`,
+          errorFactory,
+          allowEmpty: false,
+        });
+        if (result?.valid === false) {
+          return result;
+        }
+      }
+
+      {
+        const result = validateCharacterSpriteGroups({
+          value: item.spriteGroups,
+          path: `${itemPath}.spriteGroups`,
+          errorFactory,
+          allowEmpty: false,
+          allowMissingId: true,
+        });
+        if (result?.valid === false) {
+          return result;
+        }
+      }
+
       if (item.shortcut !== undefined && !isString(item.shortcut)) {
         return invalidFromErrorFactory(
           errorFactory,
@@ -3525,80 +3795,23 @@ const validateCharacterItems = ({ items, path, errorFactory }) => {
   }
 };
 
-const validateKeyboardMap = ({ value, path, errorFactory }) => {
-  if (value === undefined) {
-    return VALID_RESULT;
-  }
-
-  if (!isPlainObject(value)) {
-    return invalidFromErrorFactory(
-      errorFactory,
-      `${path} must be an object when provided`,
-    );
-  }
-
-  for (const [key, interaction] of Object.entries(value)) {
-    if (!isNonEmptyString(key)) {
-      return invalidFromErrorFactory(
-        errorFactory,
-        `${path} keys must be non-empty strings`,
-      );
-    }
-
-    if (!isPlainObject(interaction)) {
-      return invalidFromErrorFactory(
-        errorFactory,
-        `${path}.${key} must be an object`,
-      );
-    }
-  }
-
-  return VALID_RESULT;
-};
-
-const validatePreviewObject = ({ value, path, errorFactory }) => {
-  if (value === undefined) {
-    return VALID_RESULT;
-  }
-
-  if (!isPlainObject(value)) {
-    return invalidFromErrorFactory(
-      errorFactory,
-      `${path} must be an object when provided`,
-    );
-  }
-
-  return VALID_RESULT;
-};
+const validateTagItems = ({ items, path, errorFactory }) => {
+  const seenNames = new Set();
 
-const validateLayoutItems = ({ items, path, errorFactory }) => {
   for (const [itemId, item] of Object.entries(items)) {
     const itemPath = `${path}.${itemId}`;
 
-    if (item?.type !== "folder" && item?.type !== "layout") {
+    if (item?.type !== "tag") {
       return invalidFromErrorFactory(
         errorFactory,
-        `${itemPath}.type must be 'folder' or 'layout'`,
+        `${itemPath}.type must be 'tag'`,
       );
     }
 
     {
       const result = validateAllowedKeys({
         value: item,
-        allowedKeys:
-          item.type === "folder"
-            ? ["id", "type", "name", "description"]
-            : [
-                "id",
-                "type",
-                "name",
-                "description",
-                "layoutType",
-                "isFragment",
-                "thumbnailFileId",
-                "preview",
-                "elements",
-              ],
+        allowedKeys: ["id", "type", "name", "color"],
         path: itemPath,
         errorFactory,
       });
@@ -3628,55 +3841,790 @@ const validateLayoutItems = ({ items, path, errorFactory }) => {
       );
     }
 
-    if (item.description !== undefined && !isString(item.description)) {
+    if (item.color !== undefined && !isHexColor(item.color)) {
       return invalidFromErrorFactory(
         errorFactory,
-        `${itemPath}.description must be a string when provided`,
+        `${itemPath}.color must be a hex color when provided`,
       );
     }
 
-    if (
-      item.thumbnailFileId !== undefined &&
-      !isNonEmptyString(item.thumbnailFileId)
-    ) {
+    const normalizedName = item.name.trim().toLowerCase();
+    if (seenNames.has(normalizedName)) {
       return invalidFromErrorFactory(
         errorFactory,
-        `${itemPath}.thumbnailFileId must be a non-empty string when provided`,
+        `${itemPath}.name must be unique within its tag scope`,
       );
     }
 
-    {
-      const result = validatePreviewObject({
-        value: item.preview,
-        path: `${itemPath}.preview`,
-        errorFactory,
-      });
-      if (result?.valid === false) {
-        return result;
-      }
+    seenNames.add(normalizedName);
+  }
+};
+
+const validateFlatTagTree = ({ nodes, path, errorFactory }) => {
+  const visitNodes = (entries, entryPath) => {
+    if (!Array.isArray(entries)) {
+      return VALID_RESULT;
     }
 
-    if (item.type === "layout") {
-      if (!LAYOUT_TYPE_KEYS.includes(item.layoutType)) {
+    for (const [index, node] of entries.entries()) {
+      if (Object.hasOwn(node, "children")) {
         return invalidFromErrorFactory(
           errorFactory,
-          `${itemPath}.layoutType must be 'general', 'save-load', 'confirmDialog', 'dialogue-adv', 'dialogue-nvl', 'choice', or 'history'`,
+          `${entryPath}[${index}].children is not allowed`,
         );
       }
+    }
 
-      if (
-        item.isFragment !== undefined &&
-        typeof item.isFragment !== "boolean"
-      ) {
-        return invalidFromErrorFactory(
-          errorFactory,
-          `${itemPath}.isFragment must be a boolean when provided`,
-        );
-      }
+    return VALID_RESULT;
+  };
 
-      {
-        const result = validateNestedCollection({
-          collection: item.elements,
+  return visitNodes(nodes, path);
+};
+
+const validateTagCreateData = ({
+  data,
+  path = "payload.data",
+  errorFactory = createPayloadValidationError,
+}) => {
+  {
+    const result = validateAllowedKeys({
+      value: data,
+      allowedKeys: ["type", "name", "color"],
+      path,
+      errorFactory,
+    });
+    if (result?.valid === false) {
+      return result;
+    }
+  }
+
+  if (data?.type !== "tag") {
+    return invalidFromErrorFactory(errorFactory, `${path}.type must be 'tag'`);
+  }
+
+  if (!isNonEmptyString(data.name)) {
+    return invalidFromErrorFactory(
+      errorFactory,
+      `${path}.name must be a non-empty string`,
+    );
+  }
+
+  if (data.color !== undefined && !isHexColor(data.color)) {
+    return invalidFromErrorFactory(
+      errorFactory,
+      `${path}.color must be a hex color when provided`,
+    );
+  }
+};
+
+const validateTagUpdateData = ({
+  data,
+  path = "payload.data",
+  errorFactory = createPayloadValidationError,
+}) => {
+  {
+    const result = validateAllowedKeys({
+      value: data,
+      allowedKeys: ["name", "color"],
+      path,
+      errorFactory,
+    });
+    if (result?.valid === false) {
+      return result;
+    }
+  }
+
+  if (Object.keys(data).length === 0) {
+    return invalidFromErrorFactory(
+      errorFactory,
+      `${path} must include at least one field`,
+    );
+  }
+
+  if (data.name !== undefined && !isNonEmptyString(data.name)) {
+    return invalidFromErrorFactory(
+      errorFactory,
+      `${path}.name must be a non-empty string when provided`,
+    );
+  }
+
+  if (
+    data.color !== undefined &&
+    data.color !== null &&
+    !isHexColor(data.color)
+  ) {
+    return invalidFromErrorFactory(
+      errorFactory,
+      `${path}.color must be a hex color or null when provided`,
+    );
+  }
+};
+
+const validateTagsRoot = ({ state, tags, path, errorFactory }) => {
+  if (!isPlainObject(tags)) {
+    return invalidFromErrorFactory(errorFactory, `${path} must be an object`);
+  }
+
+  for (const scopeKey of Object.keys(tags)) {
+    if (
+      !isBaseTagScopeKey(scopeKey) &&
+      !isCharacterSpriteTagScopeKey(scopeKey)
+    ) {
+      return invalidFromErrorFactory(
+        errorFactory,
+        `${path}.${scopeKey} is not allowed`,
+      );
+    }
+  }
+
+  for (const scopeKey of TAG_SCOPE_BASE_KEYS) {
+    if (!Object.hasOwn(tags, scopeKey)) {
+      return invalidFromErrorFactory(
+        errorFactory,
+        `${path}.${scopeKey} is required`,
+      );
+    }
+  }
+
+  for (const [scopeKey, collection] of Object.entries(tags)) {
+    {
+      const result = validateNestedCollection({
+        collection,
+        path: `${path}.${scopeKey}`,
+        itemValidator: validateTagItems,
+        treeValidator: validateFlatTagTree,
+        errorFactory,
+      });
+      if (result?.valid === false) {
+        return result;
+      }
+    }
+
+    if (!isCharacterSpriteTagScopeKey(scopeKey)) {
+      continue;
+    }
+
+    const characterId = getCharacterSpriteTagScopeCharacterId(scopeKey);
+    const character = state.characters?.items?.[characterId];
+    if (!isPlainObject(character) || character.type !== "character") {
+      return invalidFromErrorFactory(
+        errorFactory,
+        `${path}.${scopeKey} must reference an existing character`,
+      );
+    }
+  }
+};
+
+const getTagScopeCollection = ({ state, scopeKey }) => state.tags?.[scopeKey];
+
+const validateTagScopeKey = ({ scopeKey, path, errorFactory }) => {
+  if (!isNonEmptyString(scopeKey)) {
+    return invalidFromErrorFactory(
+      errorFactory,
+      `${path} must be a non-empty string`,
+    );
+  }
+
+  if (isBaseTagScopeKey(scopeKey) || isCharacterSpriteTagScopeKey(scopeKey)) {
+    return VALID_RESULT;
+  }
+
+  return invalidFromErrorFactory(
+    errorFactory,
+    `${path} must be a supported tag scope key`,
+  );
+};
+
+const validateTagScopeAgainstState = ({
+  state,
+  scopeKey,
+  path,
+  details = {},
+  errorFactory = createPreconditionValidationError,
+}) => {
+  const scopeKeyResult = validateTagScopeKey({
+    scopeKey,
+    path,
+    errorFactory,
+  });
+  if (!scopeKeyResult.valid) {
+    return scopeKeyResult;
+  }
+
+  if (!isCharacterSpriteTagScopeKey(scopeKey)) {
+    return VALID_RESULT;
+  }
+
+  const characterId = getCharacterSpriteTagScopeCharacterId(scopeKey);
+  const character = state.characters?.items?.[characterId];
+  if (!isPlainObject(character) || character.type !== "character") {
+    return invalidFromErrorFactory(
+      errorFactory,
+      `${path} must reference an existing character sprite tag scope`,
+      {
+        ...details,
+        characterId,
+        scopeKey,
+      },
+    );
+  }
+
+  return VALID_RESULT;
+};
+
+const validateTagIdsAgainstScope = ({
+  state,
+  tagIds,
+  scopeKey,
+  path,
+  details = {},
+  errorFactory = createPreconditionValidationError,
+}) => {
+  if (tagIds === undefined) {
+    return VALID_RESULT;
+  }
+
+  const scopeResult = validateTagScopeAgainstState({
+    state,
+    scopeKey,
+    path,
+    details,
+    errorFactory,
+  });
+  if (!scopeResult.valid) {
+    return scopeResult;
+  }
+
+  const collection = getTagScopeCollection({ state, scopeKey });
+  for (const [index, tagId] of tagIds.entries()) {
+    const tag = collection?.items?.[tagId];
+    if (!isPlainObject(tag) || tag.type !== "tag") {
+      return invalidFromErrorFactory(
+        errorFactory,
+        `${path}[${index}] must reference an existing tag in scope '${scopeKey}'`,
+        {
+          ...details,
+          scopeKey,
+          tagId,
+        },
+      );
+    }
+  }
+
+  return VALID_RESULT;
+};
+
+const validateCharacterSpriteGroupsAgainstScope = ({
+  state,
+  spriteGroups,
+  scopeKey,
+  path,
+  details = {},
+  errorFactory = createPreconditionValidationError,
+}) => {
+  if (spriteGroups === undefined) {
+    return VALID_RESULT;
+  }
+
+  for (const [index, spriteGroup] of spriteGroups.entries()) {
+    const result = validateTagIdsAgainstScope({
+      state,
+      tagIds: spriteGroup.tags,
+      scopeKey,
+      path: `${path}[${index}].tags`,
+      details: {
+        ...details,
+        spriteGroupIndex: index,
+        spriteGroupName: spriteGroup.name,
+      },
+      errorFactory,
+    });
+    if (!result.valid) {
+      return result;
+    }
+  }
+
+  return VALID_RESULT;
+};
+
+const validateUniqueTagNameInScope = ({
+  collection,
+  name,
+  path,
+  excludeTagId,
+  errorFactory = createPreconditionValidationError,
+}) => {
+  const normalizedName = name.trim().toLowerCase();
+
+  for (const [tagId, tag] of Object.entries(collection?.items || {})) {
+    if (tagId === excludeTagId || tag?.type !== "tag") {
+      continue;
+    }
+
+    if (tag.name?.trim?.().toLowerCase?.() === normalizedName) {
+      return invalidFromErrorFactory(
+        errorFactory,
+        `${path} must be unique within its tag scope`,
+      );
+    }
+  }
+
+  return VALID_RESULT;
+};
+
+const ensureTagScopeCollection = ({ state, scopeKey }) => {
+  state.tags ??= createEmptyTagsState();
+  state.tags[scopeKey] ??= createEmptyCollectionState();
+  return state.tags[scopeKey];
+};
+
+const assignOptionalTagIds = ({ target, tagIds }) => {
+  if (Array.isArray(tagIds) && tagIds.length > 0) {
+    target.tagIds = structuredClone(tagIds);
+  }
+};
+
+const assignOptionalCharacterSpriteGroups = ({ target, spriteGroups }) => {
+  if (Array.isArray(spriteGroups) && spriteGroups.length > 0) {
+    target.spriteGroups = structuredClone(spriteGroups);
+  }
+};
+
+const applyTagIdsUpdate = ({ currentItem, data }) => {
+  const nextData = structuredClone(data);
+  if (nextData.tagIds === undefined) {
+    delete nextData.tagIds;
+  }
+
+  const nextItem = {
+    ...structuredClone(currentItem),
+    ...nextData,
+  };
+
+  if (data.tagIds !== undefined) {
+    if (Array.isArray(data.tagIds) && data.tagIds.length > 0) {
+      nextItem.tagIds = structuredClone(data.tagIds);
+    } else {
+      delete nextItem.tagIds;
+    }
+  }
+
+  return nextItem;
+};
+
+const applyCharacterUpdate = ({ currentItem, data }) => {
+  const nextItem = applyTagIdsUpdate({
+    currentItem,
+    data,
+  });
+
+  if (data.spriteGroups !== undefined) {
+    if (Array.isArray(data.spriteGroups) && data.spriteGroups.length > 0) {
+      nextItem.spriteGroups = structuredClone(data.spriteGroups);
+    } else {
+      delete nextItem.spriteGroups;
+    }
+  }
+
+  return nextItem;
+};
+
+const stripDeletedTagIdsFromItem = ({ item, deletedTagIds }) => {
+  if (!Array.isArray(item?.tagIds) || item.tagIds.length === 0) {
+    return;
+  }
+
+  const remainingTagIds = item.tagIds.filter(
+    (tagId) => !deletedTagIds.has(tagId),
+  );
+  if (remainingTagIds.length === item.tagIds.length) {
+    return;
+  }
+
+  if (remainingTagIds.length === 0) {
+    delete item.tagIds;
+    return;
+  }
+
+  item.tagIds = remainingTagIds;
+};
+
+const stripDeletedTagIdsFromCharacterSpriteGroups = ({
+  item,
+  deletedTagIds,
+}) => {
+  if (!Array.isArray(item?.spriteGroups) || item.spriteGroups.length === 0) {
+    return;
+  }
+
+  const nextSpriteGroups = [];
+  let didChange = false;
+
+  for (const spriteGroup of item.spriteGroups) {
+    const currentTags = Array.isArray(spriteGroup?.tags)
+      ? spriteGroup.tags
+      : [];
+    const remainingTags = currentTags.filter(
+      (tagId) => !deletedTagIds.has(tagId),
+    );
+
+    if (remainingTags.length !== currentTags.length) {
+      didChange = true;
+    }
+
+    if (remainingTags.length === 0) {
+      didChange = true;
+      continue;
+    }
+
+    if (remainingTags.length === currentTags.length) {
+      nextSpriteGroups.push(spriteGroup);
+      continue;
+    }
+
+    nextSpriteGroups.push({
+      ...spriteGroup,
+      tags: remainingTags,
+    });
+  }
+
+  if (!didChange) {
+    return;
+  }
+
+  if (nextSpriteGroups.length === 0) {
+    delete item.spriteGroups;
+    return;
+  }
+
+  item.spriteGroups = nextSpriteGroups;
+};
+
+const stripDeletedTagIdsFromScopeItems = ({
+  state,
+  scopeKey,
+  deletedTagIds,
+}) => {
+  if (deletedTagIds.size === 0) {
+    return;
+  }
+
+  if (scopeKey === "images") {
+    for (const item of Object.values(state.images.items)) {
+      if (item?.type === "image") {
+        stripDeletedTagIdsFromItem({ item, deletedTagIds });
+      }
+    }
+    return;
+  }
+
+  if (scopeKey === "sounds") {
+    for (const item of Object.values(state.sounds.items)) {
+      if (item?.type === "sound") {
+        stripDeletedTagIdsFromItem({ item, deletedTagIds });
+      }
+    }
+    return;
+  }
+
+  if (scopeKey === "videos") {
+    for (const item of Object.values(state.videos.items)) {
+      if (item?.type === "video") {
+        stripDeletedTagIdsFromItem({ item, deletedTagIds });
+      }
+    }
+    return;
+  }
+
+  if (scopeKey === "characters") {
+    for (const item of Object.values(state.characters.items)) {
+      if (item?.type === "character") {
+        stripDeletedTagIdsFromItem({ item, deletedTagIds });
+      }
+    }
+    return;
+  }
+
+  if (scopeKey === "transforms") {
+    for (const item of Object.values(state.transforms.items)) {
+      if (item?.type === "transform") {
+        stripDeletedTagIdsFromItem({ item, deletedTagIds });
+      }
+    }
+    return;
+  }
+
+  if (scopeKey === "fonts") {
+    for (const item of Object.values(state.fonts.items)) {
+      if (item?.type === "font") {
+        stripDeletedTagIdsFromItem({ item, deletedTagIds });
+      }
+    }
+    return;
+  }
+
+  if (scopeKey === "colors") {
+    for (const item of Object.values(state.colors.items)) {
+      if (item?.type === "color") {
+        stripDeletedTagIdsFromItem({ item, deletedTagIds });
+      }
+    }
+    return;
+  }
+
+  if (scopeKey === "textStyles") {
+    for (const item of Object.values(state.textStyles.items)) {
+      if (item?.type === "textStyle") {
+        stripDeletedTagIdsFromItem({ item, deletedTagIds });
+      }
+    }
+    return;
+  }
+
+  if (scopeKey === "variables") {
+    for (const item of Object.values(state.variables.items)) {
+      if (item?.type !== "folder") {
+        stripDeletedTagIdsFromItem({ item, deletedTagIds });
+      }
+    }
+    return;
+  }
+
+  if (scopeKey === "layouts") {
+    for (const item of Object.values(state.layouts.items)) {
+      if (item?.type === "layout") {
+        stripDeletedTagIdsFromItem({ item, deletedTagIds });
+      }
+    }
+    return;
+  }
+
+  if (scopeKey === "controls") {
+    for (const item of Object.values(state.controls.items)) {
+      if (item?.type === "control") {
+        stripDeletedTagIdsFromItem({ item, deletedTagIds });
+      }
+    }
+    return;
+  }
+
+  if (scopeKey === "animations") {
+    for (const item of Object.values(state.animations.items)) {
+      if (item?.type === "animation") {
+        stripDeletedTagIdsFromItem({ item, deletedTagIds });
+      }
+    }
+    return;
+  }
+
+  if (scopeKey === "particles") {
+    for (const item of Object.values(state.particles.items)) {
+      if (item?.type === "particle") {
+        stripDeletedTagIdsFromItem({ item, deletedTagIds });
+      }
+    }
+    return;
+  }
+
+  if (scopeKey === "spritesheets") {
+    for (const item of Object.values(state.spritesheets.items)) {
+      if (item?.type === "spritesheet") {
+        stripDeletedTagIdsFromItem({ item, deletedTagIds });
+      }
+    }
+    return;
+  }
+
+  if (!isCharacterSpriteTagScopeKey(scopeKey)) {
+    return;
+  }
+
+  const characterId = getCharacterSpriteTagScopeCharacterId(scopeKey);
+  const characterItem = state.characters?.items?.[characterId];
+  const collection = getCharacterSpriteCollection({
+    state,
+    characterId,
+  });
+
+  if (characterItem?.type === "character") {
+    stripDeletedTagIdsFromCharacterSpriteGroups({
+      item: characterItem,
+      deletedTagIds,
+    });
+  }
+
+  for (const item of Object.values(collection?.items || {})) {
+    if (item?.type === "image") {
+      stripDeletedTagIdsFromItem({ item, deletedTagIds });
+    }
+  }
+};
+
+const validateKeyboardMap = ({ value, path, errorFactory }) => {
+  if (value === undefined) {
+    return VALID_RESULT;
+  }
+
+  if (!isPlainObject(value)) {
+    return invalidFromErrorFactory(
+      errorFactory,
+      `${path} must be an object when provided`,
+    );
+  }
+
+  for (const [key, interaction] of Object.entries(value)) {
+    if (!isNonEmptyString(key)) {
+      return invalidFromErrorFactory(
+        errorFactory,
+        `${path} keys must be non-empty strings`,
+      );
+    }
+
+    if (!isPlainObject(interaction)) {
+      return invalidFromErrorFactory(
+        errorFactory,
+        `${path}.${key} must be an object`,
+      );
+    }
+  }
+
+  return VALID_RESULT;
+};
+
+const validatePreviewObject = ({ value, path, errorFactory }) => {
+  if (value === undefined) {
+    return VALID_RESULT;
+  }
+
+  if (!isPlainObject(value)) {
+    return invalidFromErrorFactory(
+      errorFactory,
+      `${path} must be an object when provided`,
+    );
+  }
+
+  return VALID_RESULT;
+};
+
+const validateLayoutItems = ({ items, path, errorFactory }) => {
+  for (const [itemId, item] of Object.entries(items)) {
+    const itemPath = `${path}.${itemId}`;
+
+    if (item?.type !== "folder" && item?.type !== "layout") {
+      return invalidFromErrorFactory(
+        errorFactory,
+        `${itemPath}.type must be 'folder' or 'layout'`,
+      );
+    }
+
+    {
+      const result = validateAllowedKeys({
+        value: item,
+        allowedKeys:
+          item.type === "folder"
+            ? ["id", "type", "name", "description"]
+            : [
+                "id",
+                "type",
+                "name",
+                "description",
+                "tagIds",
+                "layoutType",
+                "isFragment",
+                "thumbnailFileId",
+                "preview",
+                "elements",
+              ],
+        path: itemPath,
+        errorFactory,
+      });
+      if (result?.valid === false) {
+        return result;
+      }
+    }
+
+    if (!isNonEmptyString(item.id)) {
+      return invalidFromErrorFactory(
+        errorFactory,
+        `${itemPath}.id must be a non-empty string`,
+      );
+    }
+
+    if (item.id !== itemId) {
+      return invalidFromErrorFactory(
+        errorFactory,
+        `${itemPath}.id must match item key '${itemId}'`,
+      );
+    }
+
+    if (!isNonEmptyString(item.name)) {
+      return invalidFromErrorFactory(
+        errorFactory,
+        `${itemPath}.name must be a non-empty string`,
+      );
+    }
+
+    if (item.description !== undefined && !isString(item.description)) {
+      return invalidFromErrorFactory(
+        errorFactory,
+        `${itemPath}.description must be a string when provided`,
+      );
+    }
+
+    if (
+      item.thumbnailFileId !== undefined &&
+      !isNonEmptyString(item.thumbnailFileId)
+    ) {
+      return invalidFromErrorFactory(
+        errorFactory,
+        `${itemPath}.thumbnailFileId must be a non-empty string when provided`,
+      );
+    }
+
+    {
+      const result = validatePreviewObject({
+        value: item.preview,
+        path: `${itemPath}.preview`,
+        errorFactory,
+      });
+      if (result?.valid === false) {
+        return result;
+      }
+    }
+
+    if (item.type === "layout") {
+      {
+        const result = validateOptionalUniqueIdArray({
+          value: item.tagIds,
+          path: `${itemPath}.tagIds`,
+          errorFactory,
+          allowEmpty: false,
+        });
+        if (result?.valid === false) {
+          return result;
+        }
+      }
+
+      if (!LAYOUT_TYPE_KEYS.includes(item.layoutType)) {
+        return invalidFromErrorFactory(
+          errorFactory,
+          `${itemPath}.layoutType must be 'general', 'save-load', 'confirmDialog', 'dialogue-adv', 'dialogue-nvl', 'choice', or 'history'`,
+        );
+      }
+
+      if (
+        item.isFragment !== undefined &&
+        typeof item.isFragment !== "boolean"
+      ) {
+        return invalidFromErrorFactory(
+          errorFactory,
+          `${itemPath}.isFragment must be a boolean when provided`,
+        );
+      }
+
+      {
+        const result = validateNestedCollection({
+          collection: item.elements,
           path: `${itemPath}.elements`,
           itemValidator: validateLayoutElementItems,
           treeValidator: validateLayoutElementTreeOwnership,
@@ -3712,6 +4660,7 @@ const validateControlItems = ({ items, path, errorFactory }) => {
                 "type",
                 "name",
                 "description",
+                "tagIds",
                 "thumbnailFileId",
                 "preview",
                 "elements",
@@ -3775,6 +4724,18 @@ const validateControlItems = ({ items, path, errorFactory }) => {
     }
 
     if (item.type === "control") {
+      {
+        const result = validateOptionalUniqueIdArray({
+          value: item.tagIds,
+          path: `${itemPath}.tagIds`,
+          errorFactory,
+          allowEmpty: false,
+        });
+        if (result?.valid === false) {
+          return result;
+        }
+      }
+
       {
         const result = validateNestedCollection({
           collection: item.elements,
@@ -4854,6 +5815,22 @@ export const assertInvariants = ({ state }) => {
         return result;
       }
     }
+
+    {
+      const result = validateTagIdsAgainstScope({
+        state,
+        tagIds: image.tagIds,
+        scopeKey: "images",
+        path: "image.tagIds",
+        details: {
+          imageId,
+        },
+        errorFactory: createInvariantValidationError,
+      });
+      if (!result.valid) {
+        return result;
+      }
+    }
   }
 
   for (const [spritesheetId, spritesheet] of Object.entries(
@@ -4874,6 +5851,22 @@ export const assertInvariants = ({ state }) => {
       return result;
     }
 
+    {
+      const tagResult = validateTagIdsAgainstScope({
+        state,
+        tagIds: spritesheet.tagIds,
+        scopeKey: "spritesheets",
+        path: "spritesheet.tagIds",
+        details: {
+          spritesheetId,
+        },
+        errorFactory: createInvariantValidationError,
+      });
+      if (!tagResult.valid) {
+        return tagResult;
+      }
+    }
+
     if (spritesheet.thumbnailFileId === undefined) {
       continue;
     }
@@ -4926,6 +5919,22 @@ export const assertInvariants = ({ state }) => {
         return result;
       }
     }
+
+    {
+      const result = validateTagIdsAgainstScope({
+        state,
+        tagIds: sound.tagIds,
+        scopeKey: "sounds",
+        path: "sound.tagIds",
+        details: {
+          soundId,
+        },
+        errorFactory: createInvariantValidationError,
+      });
+      if (!result.valid) {
+        return result;
+      }
+    }
   }
 
   for (const [videoId, video] of Object.entries(state.videos.items)) {
@@ -4958,6 +5967,22 @@ export const assertInvariants = ({ state }) => {
         return result;
       }
     }
+
+    {
+      const result = validateTagIdsAgainstScope({
+        state,
+        tagIds: video.tagIds,
+        scopeKey: "videos",
+        path: "video.tagIds",
+        details: {
+          videoId,
+        },
+        errorFactory: createInvariantValidationError,
+      });
+      if (!result.valid) {
+        return result;
+      }
+    }
   }
 
   for (const [fontId, font] of Object.entries(state.fonts.items)) {
@@ -4965,6 +5990,22 @@ export const assertInvariants = ({ state }) => {
       continue;
     }
 
+    {
+      const result = validateTagIdsAgainstScope({
+        state,
+        tagIds: font.tagIds,
+        scopeKey: "fonts",
+        path: "font.tagIds",
+        details: {
+          fontId,
+        },
+        errorFactory: createInvariantValidationError,
+      });
+      if (!result.valid) {
+        return result;
+      }
+    }
+
     const result = validateFileReference({
       state,
       fileId: font.fileId,
@@ -4984,6 +6025,22 @@ export const assertInvariants = ({ state }) => {
       continue;
     }
 
+    {
+      const tagResult = validateTagIdsAgainstScope({
+        state,
+        tagIds: animation.tagIds,
+        scopeKey: "animations",
+        path: "animation.tagIds",
+        details: {
+          animationId,
+        },
+        errorFactory: createInvariantValidationError,
+      });
+      if (!tagResult.valid) {
+        return tagResult;
+      }
+    }
+
     const result = validateAnimationMaskImageReferences({
       state,
       animation: animation.animation,
@@ -5016,6 +6073,38 @@ export const assertInvariants = ({ state }) => {
       }
     }
 
+    {
+      const result = validateTagIdsAgainstScope({
+        state,
+        tagIds: character.tagIds,
+        scopeKey: "characters",
+        path: "character.tagIds",
+        details: {
+          characterId,
+        },
+        errorFactory: createInvariantValidationError,
+      });
+      if (!result.valid) {
+        return result;
+      }
+    }
+
+    {
+      const result = validateCharacterSpriteGroupsAgainstScope({
+        state,
+        spriteGroups: character.spriteGroups,
+        scopeKey: `${CHARACTER_SPRITE_TAG_SCOPE_PREFIX}${characterId}`,
+        path: "character.spriteGroups",
+        details: {
+          characterId,
+        },
+        errorFactory: createInvariantValidationError,
+      });
+      if (!result.valid) {
+        return result;
+      }
+    }
+
     for (const [spriteId, sprite] of Object.entries(
       character.sprites?.items || {},
     )) {
@@ -5034,6 +6123,23 @@ export const assertInvariants = ({ state }) => {
         return result;
       }
 
+      {
+        const tagResult = validateTagIdsAgainstScope({
+          state,
+          tagIds: sprite.tagIds,
+          scopeKey: `${CHARACTER_SPRITE_TAG_SCOPE_PREFIX}${characterId}`,
+          path: "character.sprite.tagIds",
+          details: {
+            characterId,
+            spriteId,
+          },
+          errorFactory: createInvariantValidationError,
+        });
+        if (!tagResult.valid) {
+          return tagResult;
+        }
+      }
+
       if (sprite.thumbnailFileId === undefined) {
         continue;
       }
@@ -5055,25 +6161,177 @@ export const assertInvariants = ({ state }) => {
     }
   }
 
+  for (const [transformId, transform] of Object.entries(
+    state.transforms.items,
+  )) {
+    if (transform.type !== "transform") {
+      continue;
+    }
+
+    {
+      const result = validateTagIdsAgainstScope({
+        state,
+        tagIds: transform.tagIds,
+        scopeKey: "transforms",
+        path: "transform.tagIds",
+        details: {
+          transformId,
+        },
+        errorFactory: createInvariantValidationError,
+      });
+      if (!result.valid) {
+        return result;
+      }
+    }
+  }
+
+  for (const [particleId, particle] of Object.entries(state.particles.items)) {
+    if (particle.type !== "particle") {
+      continue;
+    }
+
+    {
+      const result = validateTagIdsAgainstScope({
+        state,
+        tagIds: particle.tagIds,
+        scopeKey: "particles",
+        path: "particle.tagIds",
+        details: {
+          particleId,
+        },
+        errorFactory: createInvariantValidationError,
+      });
+      if (!result.valid) {
+        return result;
+      }
+    }
+  }
+
+  for (const [colorId, color] of Object.entries(state.colors.items)) {
+    if (color.type !== "color") {
+      continue;
+    }
+
+    {
+      const result = validateTagIdsAgainstScope({
+        state,
+        tagIds: color.tagIds,
+        scopeKey: "colors",
+        path: "color.tagIds",
+        details: {
+          colorId,
+        },
+        errorFactory: createInvariantValidationError,
+      });
+      if (!result.valid) {
+        return result;
+      }
+    }
+  }
+
+  for (const [textStyleId, textStyle] of Object.entries(
+    state.textStyles.items,
+  )) {
+    if (textStyle.type !== "textStyle") {
+      continue;
+    }
+
+    {
+      const result = validateTagIdsAgainstScope({
+        state,
+        tagIds: textStyle.tagIds,
+        scopeKey: "textStyles",
+        path: "textStyle.tagIds",
+        details: {
+          textStyleId,
+        },
+        errorFactory: createInvariantValidationError,
+      });
+      if (!result.valid) {
+        return result;
+      }
+    }
+  }
+
   for (const [layoutId, layout] of Object.entries(state.layouts.items)) {
-    if (layout.type !== "layout" || layout.thumbnailFileId === undefined) {
+    if (layout.type !== "layout") {
       continue;
     }
 
-    const result = validateFileReference({
-      state,
-      fileId: layout.thumbnailFileId,
-      path: "layout.thumbnailFileId",
-      details: { layoutId, thumbnailFileId: layout.thumbnailFileId },
-      errorFactory: createInvariantValidationError,
-    });
-    if (!result.valid) {
-      return result;
+    {
+      const result = validateTagIdsAgainstScope({
+        state,
+        tagIds: layout.tagIds,
+        scopeKey: "layouts",
+        path: "layout.tagIds",
+        details: {
+          layoutId,
+        },
+        errorFactory: createInvariantValidationError,
+      });
+      if (!result.valid) {
+        return result;
+      }
+    }
+
+    if (layout.thumbnailFileId !== undefined) {
+      const result = validateFileReference({
+        state,
+        fileId: layout.thumbnailFileId,
+        path: "layout.thumbnailFileId",
+        details: { layoutId, thumbnailFileId: layout.thumbnailFileId },
+        errorFactory: createInvariantValidationError,
+      });
+      if (!result.valid) {
+        return result;
+      }
+    }
+  }
+
+  for (const [variableId, variable] of Object.entries(state.variables.items)) {
+    if (variable.type === "folder") {
+      continue;
+    }
+
+    {
+      const result = validateTagIdsAgainstScope({
+        state,
+        tagIds: variable.tagIds,
+        scopeKey: "variables",
+        path: "variable.tagIds",
+        details: {
+          variableId,
+        },
+        errorFactory: createInvariantValidationError,
+      });
+      if (!result.valid) {
+        return result;
+      }
     }
   }
 
   for (const [controlId, control] of Object.entries(state.controls.items)) {
-    if (control.type !== "control" || control.thumbnailFileId === undefined) {
+    if (control.type !== "control") {
+      continue;
+    }
+
+    {
+      const result = validateTagIdsAgainstScope({
+        state,
+        tagIds: control.tagIds,
+        scopeKey: "controls",
+        path: "control.tagIds",
+        details: {
+          controlId,
+        },
+        errorFactory: createInvariantValidationError,
+      });
+      if (!result.valid) {
+        return result;
+      }
+    }
+
+    if (control.thumbnailFileId === undefined) {
       continue;
     }
 
@@ -5366,7 +6624,7 @@ export const assertInvariants = ({ state }) => {
               !isLayoutConditionTarget(state, rule.when.target)
             ) {
               return invalidInvariant(
-                `${ownerLabel} element conditionalOverrides when target must reference an existing variable or supported runtime condition`,
+                `${ownerLabel} element conditionalOverrides when target must reference an existing variable or supported layout condition`,
                 {
                   [ownerIdField]: ownerId,
                   elementId,
@@ -5511,6 +6769,18 @@ const runValidateState = ({ state }) => {
       );
     }
 
+    {
+      const result = validateTagsRoot({
+        state: normalizedState,
+        tags: normalizedState.tags,
+        path: "state.tags",
+        errorFactory: createStateValidationError,
+      });
+      if (result?.valid === false) {
+        return result;
+      }
+    }
+
     for (const collectionKey of COLLECTION_KEYS) {
       {
         const result = validateCollection({
@@ -5705,25 +6975,156 @@ const validateRequiredUniqueIdArray = ({ value, path, errorFactory }) => {
     );
   }
 
-  const seen = new Set();
+  const seen = new Set();
+
+  for (const [index, entry] of value.entries()) {
+    if (!isNonEmptyString(entry)) {
+      return invalidFromErrorFactory(
+        errorFactory,
+        `${path}[${index}] must be a non-empty string`,
+      );
+    }
+
+    if (seen.has(entry)) {
+      return invalidFromErrorFactory(
+        errorFactory,
+        `${path}[${index}] must be unique`,
+      );
+    }
+
+    seen.add(entry);
+  }
+};
+
+const validateOptionalUniqueIdArray = ({
+  value,
+  path,
+  errorFactory,
+  allowEmpty = true,
+}) => {
+  if (value === undefined) {
+    return VALID_RESULT;
+  }
+
+  if (!Array.isArray(value) || (!allowEmpty && value.length === 0)) {
+    return invalidFromErrorFactory(
+      errorFactory,
+      allowEmpty
+        ? `${path} must be an array when provided`
+        : `${path} must be a non-empty array when provided`,
+    );
+  }
+
+  const seen = new Set();
+
+  for (const [index, entry] of value.entries()) {
+    if (!isNonEmptyString(entry)) {
+      return invalidFromErrorFactory(
+        errorFactory,
+        `${path}[${index}] must be a non-empty string`,
+      );
+    }
+
+    if (seen.has(entry)) {
+      return invalidFromErrorFactory(
+        errorFactory,
+        `${path}[${index}] must be unique`,
+      );
+    }
+
+    seen.add(entry);
+  }
+};
+
+const validateCharacterSpriteGroups = ({
+  value,
+  path,
+  errorFactory,
+  allowEmpty = true,
+  allowMissingId = false,
+}) => {
+  if (value === undefined) {
+    return VALID_RESULT;
+  }
+
+  if (!Array.isArray(value) || (!allowEmpty && value.length === 0)) {
+    return invalidFromErrorFactory(
+      errorFactory,
+      allowEmpty
+        ? `${path} must be an array when provided`
+        : `${path} must be a non-empty array when provided`,
+    );
+  }
+
+  const seenIds = new Set();
+
+  for (const [index, spriteGroup] of value.entries()) {
+    const itemPath = `${path}[${index}]`;
+
+    if (!isPlainObject(spriteGroup)) {
+      return invalidFromErrorFactory(
+        errorFactory,
+        `${itemPath} must be an object`,
+      );
+    }
+
+    {
+      const result = validateAllowedKeys({
+        value: spriteGroup,
+        allowedKeys: ["id", "name", "tags"],
+        path: itemPath,
+        errorFactory,
+      });
+      if (result?.valid === false) {
+        return result;
+      }
+    }
+
+    if (spriteGroup.id === undefined) {
+      if (!allowMissingId) {
+        return invalidFromErrorFactory(
+          errorFactory,
+          `${itemPath}.id must be a non-empty string`,
+        );
+      }
+    } else {
+      if (!isNonEmptyString(spriteGroup.id)) {
+        return invalidFromErrorFactory(
+          errorFactory,
+          `${itemPath}.id must be a non-empty string`,
+        );
+      }
+
+      if (seenIds.has(spriteGroup.id)) {
+        return invalidFromErrorFactory(
+          errorFactory,
+          `${itemPath}.id must be unique within spriteGroups`,
+        );
+      }
 
-  for (const [index, entry] of value.entries()) {
-    if (!isNonEmptyString(entry)) {
-      return invalidFromErrorFactory(
-        errorFactory,
-        `${path}[${index}] must be a non-empty string`,
-      );
+      seenIds.add(spriteGroup.id);
     }
 
-    if (seen.has(entry)) {
+    if (!isNonEmptyString(spriteGroup.name)) {
       return invalidFromErrorFactory(
         errorFactory,
-        `${path}[${index}] must be unique`,
+        `${itemPath}.name must be a non-empty string`,
       );
     }
 
-    seen.add(entry);
+    {
+      const result = validateRequiredUniqueIdArray({
+        value: spriteGroup.tags,
+        path: `${itemPath}.tags`,
+        errorFactory,
+      });
+      if (result?.valid === false) {
+        return result;
+      }
+    }
   }
+
+  return VALID_RESULT;
 };
 
 const validateSectionCreateData = ({ data, errorFactory }) => {
@@ -5948,6 +7349,7 @@ const validateImageCreateData = ({ data, errorFactory }) => {
               "type",
               "name",
               "description",
+              "tagIds",
               "thumbnailFileId",
               "fileId",
               "width",
@@ -5976,6 +7378,17 @@ const validateImageCreateData = ({ data, errorFactory }) => {
   }
 
   if (data.type === "image") {
+    {
+      const result = validateOptionalUniqueIdArray({
+        value: data.tagIds,
+        path: "payload.data.tagIds",
+        errorFactory,
+      });
+      if (result?.valid === false) {
+        return result;
+      }
+    }
+
     if (
       data.thumbnailFileId !== undefined &&
       !isNonEmptyString(data.thumbnailFileId)
@@ -6016,6 +7429,7 @@ const validateImageUpdateData = ({ data, errorFactory }) => {
       allowedKeys: [
         "name",
         "description",
+        "tagIds",
         "thumbnailFileId",
         "fileId",
         "width",
@@ -6050,6 +7464,17 @@ const validateImageUpdateData = ({ data, errorFactory }) => {
     );
   }
 
+  {
+    const result = validateOptionalUniqueIdArray({
+      value: data.tagIds,
+      path: "payload.data.tagIds",
+      errorFactory,
+    });
+    if (result?.valid === false) {
+      return result;
+    }
+  }
+
   if (
     data.thumbnailFileId !== undefined &&
     !isNonEmptyString(data.thumbnailFileId)
@@ -6107,6 +7532,7 @@ const validateSpritesheetCreateData = ({ data, errorFactory }) => {
               "type",
               "name",
               "description",
+              "tagIds",
               "thumbnailFileId",
               "fileId",
               "sheetWidth",
@@ -6140,6 +7566,17 @@ const validateSpritesheetCreateData = ({ data, errorFactory }) => {
   }
 
   if (data.type === "spritesheet") {
+    {
+      const result = validateOptionalUniqueIdArray({
+        value: data.tagIds,
+        path: "payload.data.tagIds",
+        errorFactory,
+      });
+      if (result?.valid === false) {
+        return result;
+      }
+    }
+
     if (
       data.thumbnailFileId !== undefined &&
       !isNonEmptyString(data.thumbnailFileId)
@@ -6199,6 +7636,7 @@ const validateSpritesheetUpdateData = ({ data, errorFactory }) => {
       allowedKeys: [
         "name",
         "description",
+        "tagIds",
         "thumbnailFileId",
         "fileId",
         "sheetWidth",
@@ -6238,6 +7676,17 @@ const validateSpritesheetUpdateData = ({ data, errorFactory }) => {
     );
   }
 
+  {
+    const result = validateOptionalUniqueIdArray({
+      value: data.tagIds,
+      path: "payload.data.tagIds",
+      errorFactory,
+    });
+    if (result?.valid === false) {
+      return result;
+    }
+  }
+
   if (
     data.thumbnailFileId !== undefined &&
     !isNonEmptyString(data.thumbnailFileId)
@@ -6314,6 +7763,7 @@ const validateSoundCreateData = ({ data, errorFactory }) => {
               "type",
               "name",
               "description",
+              "tagIds",
               "fileId",
               "waveformDataFileId",
               "duration",
@@ -6341,6 +7791,17 @@ const validateSoundCreateData = ({ data, errorFactory }) => {
   }
 
   if (data.type === "sound") {
+    {
+      const result = validateOptionalUniqueIdArray({
+        value: data.tagIds,
+        path: "payload.data.tagIds",
+        errorFactory,
+      });
+      if (result?.valid === false) {
+        return result;
+      }
+    }
+
     if (!isNonEmptyString(data.fileId)) {
       return invalidFromErrorFactory(
         errorFactory,
@@ -6375,6 +7836,7 @@ const validateSoundUpdateData = ({ data, errorFactory }) => {
       allowedKeys: [
         "name",
         "description",
+        "tagIds",
         "fileId",
         "waveformDataFileId",
         "duration",
@@ -6408,6 +7870,17 @@ const validateSoundUpdateData = ({ data, errorFactory }) => {
     );
   }
 
+  {
+    const result = validateOptionalUniqueIdArray({
+      value: data.tagIds,
+      path: "payload.data.tagIds",
+      errorFactory,
+    });
+    if (result?.valid === false) {
+      return result;
+    }
+  }
+
   if (data.fileId !== undefined && !isNonEmptyString(data.fileId)) {
     return invalidFromErrorFactory(
       errorFactory,
@@ -6459,6 +7932,7 @@ const validateVideoCreateData = ({ data, errorFactory }) => {
               "type",
               "name",
               "description",
+              "tagIds",
               "fileId",
               "thumbnailFileId",
               "duration",
@@ -6488,6 +7962,17 @@ const validateVideoCreateData = ({ data, errorFactory }) => {
   }
 
   if (data.type === "video") {
+    {
+      const result = validateOptionalUniqueIdArray({
+        value: data.tagIds,
+        path: "payload.data.tagIds",
+        errorFactory,
+      });
+      if (result?.valid === false) {
+        return result;
+      }
+    }
+
     if (!isNonEmptyString(data.fileId)) {
       return invalidFromErrorFactory(
         errorFactory,
@@ -6532,6 +8017,7 @@ const validateVideoUpdateData = ({ data, errorFactory }) => {
       allowedKeys: [
         "name",
         "description",
+        "tagIds",
         "fileId",
         "thumbnailFileId",
         "duration",
@@ -6567,6 +8053,17 @@ const validateVideoUpdateData = ({ data, errorFactory }) => {
     );
   }
 
+  {
+    const result = validateOptionalUniqueIdArray({
+      value: data.tagIds,
+      path: "payload.data.tagIds",
+      errorFactory,
+    });
+    if (result?.valid === false) {
+      return result;
+    }
+  }
+
   if (data.fileId !== undefined && !isNonEmptyString(data.fileId)) {
     return invalidFromErrorFactory(
       errorFactory,
@@ -6627,13 +8124,7 @@ const validateFontCreateData = ({ data, errorFactory }) => {
       allowedKeys:
         data.type === "folder"
           ? ["type", "name", "description"]
-          : [
-              "type",
-              "name",
-              "description",
-              "fileId",
-              "fontFamily",
-            ],
+          : ["type", "name", "description", "tagIds", "fileId", "fontFamily"],
       path: "payload.data",
       errorFactory,
     });
@@ -6657,6 +8148,17 @@ const validateFontCreateData = ({ data, errorFactory }) => {
   }
 
   if (data.type === "font") {
+    {
+      const result = validateOptionalUniqueIdArray({
+        value: data.tagIds,
+        path: "payload.data.tagIds",
+        errorFactory,
+      });
+      if (result?.valid === false) {
+        return result;
+      }
+    }
+
     if (!isNonEmptyString(data.fileId)) {
       return invalidFromErrorFactory(
         errorFactory,
@@ -6670,7 +8172,6 @@ const validateFontCreateData = ({ data, errorFactory }) => {
         "payload.data.fontFamily must be a non-empty string",
       );
     }
-
   }
 };
 
@@ -6678,12 +8179,7 @@ const validateFontUpdateData = ({ data, errorFactory }) => {
   {
     const result = validateAllowedKeys({
       value: data,
-      allowedKeys: [
-        "name",
-        "description",
-        "fileId",
-        "fontFamily",
-      ],
+      allowedKeys: ["name", "description", "tagIds", "fileId", "fontFamily"],
       path: "payload.data",
       errorFactory,
     });
@@ -6713,6 +8209,17 @@ const validateFontUpdateData = ({ data, errorFactory }) => {
     );
   }
 
+  {
+    const result = validateOptionalUniqueIdArray({
+      value: data.tagIds,
+      path: "payload.data.tagIds",
+      errorFactory,
+    });
+    if (result?.valid === false) {
+      return result;
+    }
+  }
+
   if (data.fileId !== undefined && !isNonEmptyString(data.fileId)) {
     return invalidFromErrorFactory(
       errorFactory,
@@ -6726,7 +8233,6 @@ const validateFontUpdateData = ({ data, errorFactory }) => {
       "payload.data.fontFamily must be a non-empty string when provided",
     );
   }
-
 };
 
 const validateFileCreateData = ({ data, errorFactory }) => {
@@ -6850,7 +8356,7 @@ const validateColorCreateData = ({ data, errorFactory }) => {
       allowedKeys:
         data.type === "folder"
           ? ["type", "name", "description"]
-          : ["type", "name", "description", "hex"],
+          : ["type", "name", "description", "tagIds", "hex"],
       path: "payload.data",
       errorFactory,
     });
@@ -6873,11 +8379,24 @@ const validateColorCreateData = ({ data, errorFactory }) => {
     );
   }
 
-  if (data.type === "color" && !isHexColor(data.hex)) {
-    return invalidFromErrorFactory(
-      errorFactory,
-      "payload.data.hex must be a #RRGGBB string",
-    );
+  if (data.type === "color") {
+    {
+      const result = validateOptionalUniqueIdArray({
+        value: data.tagIds,
+        path: "payload.data.tagIds",
+        errorFactory,
+      });
+      if (result?.valid === false) {
+        return result;
+      }
+    }
+
+    if (!isHexColor(data.hex)) {
+      return invalidFromErrorFactory(
+        errorFactory,
+        "payload.data.hex must be a #RRGGBB string",
+      );
+    }
   }
 };
 
@@ -6885,7 +8404,7 @@ const validateColorUpdateData = ({ data, errorFactory }) => {
   {
     const result = validateAllowedKeys({
       value: data,
-      allowedKeys: ["name", "description", "hex"],
+      allowedKeys: ["name", "description", "tagIds", "hex"],
       path: "payload.data",
       errorFactory,
     });
@@ -6915,6 +8434,17 @@ const validateColorUpdateData = ({ data, errorFactory }) => {
     );
   }
 
+  {
+    const result = validateOptionalUniqueIdArray({
+      value: data.tagIds,
+      path: "payload.data.tagIds",
+      errorFactory,
+    });
+    if (result?.valid === false) {
+      return result;
+    }
+  }
+
   if (data.hex !== undefined && !isHexColor(data.hex)) {
     return invalidFromErrorFactory(
       errorFactory,
@@ -6944,7 +8474,7 @@ const validateAnimationCreateData = ({ data, errorFactory }) => {
       allowedKeys:
         data.type === "folder"
           ? ["type", "name", "description"]
-          : ["type", "name", "description", "animation"],
+          : ["type", "name", "description", "tagIds", "animation"],
       path: "payload.data",
       errorFactory,
     });
@@ -6968,6 +8498,17 @@ const validateAnimationCreateData = ({ data, errorFactory }) => {
   }
 
   if (data.type === "animation") {
+    {
+      const result = validateOptionalUniqueIdArray({
+        value: data.tagIds,
+        path: "payload.data.tagIds",
+        errorFactory,
+      });
+      if (result?.valid === false) {
+        return result;
+      }
+    }
+
     {
       const result = validateAnimationDefinition({
         animation: data.animation,
@@ -6985,7 +8526,7 @@ const validateAnimationUpdateData = ({ data, errorFactory }) => {
   {
     const result = validateAllowedKeys({
       value: data,
-      allowedKeys: ["name", "description", "animation"],
+      allowedKeys: ["name", "description", "tagIds", "animation"],
       path: "payload.data",
       errorFactory,
     });
@@ -7015,6 +8556,17 @@ const validateAnimationUpdateData = ({ data, errorFactory }) => {
     );
   }
 
+  {
+    const result = validateOptionalUniqueIdArray({
+      value: data.tagIds,
+      path: "payload.data.tagIds",
+      errorFactory,
+    });
+    if (result?.valid === false) {
+      return result;
+    }
+  }
+
   if (data.animation !== undefined) {
     {
       const result = validateAnimationDefinition({
@@ -7054,6 +8606,7 @@ const validateTransformCreateData = ({ data, errorFactory }) => {
               "type",
               "name",
               "description",
+              "tagIds",
               "x",
               "y",
               "scaleX",
@@ -7085,6 +8638,17 @@ const validateTransformCreateData = ({ data, errorFactory }) => {
   }
 
   if (data.type === "transform") {
+    {
+      const result = validateOptionalUniqueIdArray({
+        value: data.tagIds,
+        path: "payload.data.tagIds",
+        errorFactory,
+      });
+      if (result?.valid === false) {
+        return result;
+      }
+    }
+
     for (const key of [
       "x",
       "y",
@@ -7129,6 +8693,7 @@ const validateParticleCreateData = ({ data, errorFactory }) => {
               "type",
               "name",
               "description",
+              "tagIds",
               "width",
               "height",
               "seed",
@@ -7160,6 +8725,17 @@ const validateParticleCreateData = ({ data, errorFactory }) => {
     return;
   }
 
+  {
+    const result = validateOptionalUniqueIdArray({
+      value: data.tagIds,
+      path: "payload.data.tagIds",
+      errorFactory,
+    });
+    if (result?.valid === false) {
+      return result;
+    }
+  }
+
   if (!isFiniteNumber(data.width) || data.width <= 0) {
     return invalidFromErrorFactory(
       errorFactory,
@@ -7204,6 +8780,7 @@ const validateParticleUpdateData = ({ data, errorFactory }) => {
       allowedKeys: [
         "name",
         "description",
+        "tagIds",
         "width",
         "height",
         "seed",
@@ -7238,6 +8815,17 @@ const validateParticleUpdateData = ({ data, errorFactory }) => {
     );
   }
 
+  {
+    const result = validateOptionalUniqueIdArray({
+      value: data.tagIds,
+      path: "payload.data.tagIds",
+      errorFactory,
+    });
+    if (result?.valid === false) {
+      return result;
+    }
+  }
+
   if (
     data.width !== undefined &&
     (!isFiniteNumber(data.width) || data.width <= 0)
@@ -7290,6 +8878,7 @@ const validateTransformUpdateData = ({ data, errorFactory }) => {
       allowedKeys: [
         "name",
         "description",
+        "tagIds",
         "x",
         "y",
         "scaleX",
@@ -7327,6 +8916,17 @@ const validateTransformUpdateData = ({ data, errorFactory }) => {
     );
   }
 
+  {
+    const result = validateOptionalUniqueIdArray({
+      value: data.tagIds,
+      path: "payload.data.tagIds",
+      errorFactory,
+    });
+    if (result?.valid === false) {
+      return result;
+    }
+  }
+
   for (const key of [
     "x",
     "y",
@@ -7366,7 +8966,15 @@ const validateVariableCreateData = ({ data, errorFactory }) => {
       allowedKeys:
         data.type === "folder"
           ? ["type", "name", "description"]
-          : ["type", "name", "description", "scope", "default", "value"],
+          : [
+              "type",
+              "name",
+              "description",
+              "tagIds",
+              "scope",
+              "default",
+              "value",
+            ],
       path: "payload.data",
       errorFactory,
     });
@@ -7390,6 +8998,18 @@ const validateVariableCreateData = ({ data, errorFactory }) => {
   }
 
   if (data.type !== "folder") {
+    {
+      const result = validateOptionalUniqueIdArray({
+        value: data.tagIds,
+        path: "payload.data.tagIds",
+        errorFactory,
+        allowEmpty: false,
+      });
+      if (result?.valid === false) {
+        return result;
+      }
+    }
+
     if (!VARIABLE_SCOPE_KEYS.includes(data.scope)) {
       return invalidFromErrorFactory(
         errorFactory,
@@ -7426,7 +9046,14 @@ const validateVariableUpdateData = ({ data, errorFactory }) => {
   {
     const result = validateAllowedKeys({
       value: data,
-      allowedKeys: ["name", "description", "scope", "default", "value"],
+      allowedKeys: [
+        "name",
+        "description",
+        "tagIds",
+        "scope",
+        "default",
+        "value",
+      ],
       path: "payload.data",
       errorFactory,
     });
@@ -7462,6 +9089,18 @@ const validateVariableUpdateData = ({ data, errorFactory }) => {
       "payload.data.scope must be 'context', 'device', or 'account' when provided",
     );
   }
+
+  {
+    const result = validateOptionalUniqueIdArray({
+      value: data.tagIds,
+      path: "payload.data.tagIds",
+      errorFactory,
+      allowEmpty: false,
+    });
+    if (result?.valid === false) {
+      return result;
+    }
+  }
 };
 
 const validateTextStyleCreateData = ({ data, errorFactory }) => {
@@ -7489,6 +9128,7 @@ const validateTextStyleCreateData = ({ data, errorFactory }) => {
               "type",
               "name",
               "description",
+              "tagIds",
               "fontId",
               "colorId",
               "fontSize",
@@ -7527,6 +9167,17 @@ const validateTextStyleCreateData = ({ data, errorFactory }) => {
   }
 
   if (data.type === "textStyle") {
+    {
+      const result = validateOptionalUniqueIdArray({
+        value: data.tagIds,
+        path: "payload.data.tagIds",
+        errorFactory,
+      });
+      if (result?.valid === false) {
+        return result;
+      }
+    }
+
     {
       const result = validateTextStyleItems({
         items: {
@@ -7552,6 +9203,7 @@ const validateTextStyleUpdateData = ({ data, errorFactory }) => {
       allowedKeys: [
         "name",
         "description",
+        "tagIds",
         "fontId",
         "colorId",
         "fontSize",
@@ -7596,6 +9248,17 @@ const validateTextStyleUpdateData = ({ data, errorFactory }) => {
     );
   }
 
+  {
+    const result = validateOptionalUniqueIdArray({
+      value: data.tagIds,
+      path: "payload.data.tagIds",
+      errorFactory,
+    });
+    if (result?.valid === false) {
+      return result;
+    }
+  }
+
   for (const key of ["fontId", "colorId", "strokeColorId"]) {
     if (data[key] !== undefined && !isNonEmptyString(data[key])) {
       return invalidFromErrorFactory(
@@ -7680,6 +9343,7 @@ const validateCharacterSpriteCreateData = ({ data, errorFactory }) => {
               "type",
               "name",
               "description",
+              "tagIds",
               "fileId",
               "thumbnailFileId",
               "width",
@@ -7708,6 +9372,17 @@ const validateCharacterSpriteCreateData = ({ data, errorFactory }) => {
   }
 
   if (data.type === "image") {
+    {
+      const result = validateOptionalUniqueIdArray({
+        value: data.tagIds,
+        path: "payload.data.tagIds",
+        errorFactory,
+      });
+      if (result?.valid === false) {
+        return result;
+      }
+    }
+
     if (!isNonEmptyString(data.fileId)) {
       return invalidFromErrorFactory(
         errorFactory,
@@ -7748,6 +9423,7 @@ const validateCharacterSpriteUpdateData = ({ data, errorFactory }) => {
       allowedKeys: [
         "name",
         "description",
+        "tagIds",
         "fileId",
         "thumbnailFileId",
         "width",
@@ -7775,6 +9451,17 @@ const validateCharacterSpriteUpdateData = ({ data, errorFactory }) => {
     );
   }
 
+  {
+    const result = validateOptionalUniqueIdArray({
+      value: data.tagIds,
+      path: "payload.data.tagIds",
+      errorFactory,
+    });
+    if (result?.valid === false) {
+      return result;
+    }
+  }
+
   if (data.fileId !== undefined && !isNonEmptyString(data.fileId)) {
     return invalidFromErrorFactory(
       errorFactory,
@@ -7839,6 +9526,8 @@ const validateCharacterCreateData = ({ data, errorFactory }) => {
               "type",
               "name",
               "description",
+              "tagIds",
+              "spriteGroups",
               "shortcut",
               "fileId",
               "sprites",
@@ -7865,7 +9554,29 @@ const validateCharacterCreateData = ({ data, errorFactory }) => {
     );
   }
 
-  if (data.type === "character") {
+  if (data.type === "character") {
+    {
+      const result = validateOptionalUniqueIdArray({
+        value: data.tagIds,
+        path: "payload.data.tagIds",
+        errorFactory,
+      });
+      if (result?.valid === false) {
+        return result;
+      }
+    }
+
+    {
+      const result = validateCharacterSpriteGroups({
+        value: data.spriteGroups,
+        path: "payload.data.spriteGroups",
+        errorFactory,
+      });
+      if (result?.valid === false) {
+        return result;
+      }
+    }
+
     if (data.shortcut !== undefined && !isString(data.shortcut)) {
       return invalidFromErrorFactory(
         errorFactory,
@@ -7885,7 +9596,13 @@ const validateCharacterCreateData = ({ data, errorFactory }) => {
         const result = validateNestedCollection({
           collection: data.sprites,
           path: "payload.data.sprites",
-          itemValidator: validateCharacterSpriteItems,
+          itemValidator: ({ items, path, errorFactory }) =>
+            validateCharacterSpriteItems({
+              items,
+              path,
+              errorFactory,
+              allowTagIds: false,
+            }),
           treeValidator: validateGenericFolderOwnership,
           folderLabel: "folder sprite item",
           errorFactory,
@@ -7905,6 +9622,8 @@ const validateCharacterUpdateData = ({ data, errorFactory }) => {
       allowedKeys: [
         "name",
         "description",
+        "tagIds",
+        "spriteGroups",
         "shortcut",
         "fileId",
       ],
@@ -7944,13 +9663,34 @@ const validateCharacterUpdateData = ({ data, errorFactory }) => {
     );
   }
 
+  {
+    const result = validateOptionalUniqueIdArray({
+      value: data.tagIds,
+      path: "payload.data.tagIds",
+      errorFactory,
+    });
+    if (result?.valid === false) {
+      return result;
+    }
+  }
+
+  {
+    const result = validateCharacterSpriteGroups({
+      value: data.spriteGroups,
+      path: "payload.data.spriteGroups",
+      errorFactory,
+    });
+    if (result?.valid === false) {
+      return result;
+    }
+  }
+
   if (data.fileId !== undefined && !isNonEmptyString(data.fileId)) {
     return invalidFromErrorFactory(
       errorFactory,
       "payload.data.fileId must be a non-empty string when provided",
     );
   }
-
 };
 
 const validateLayoutCreateData = ({ data, errorFactory }) => {
@@ -7978,6 +9718,7 @@ const validateLayoutCreateData = ({ data, errorFactory }) => {
               "type",
               "name",
               "description",
+              "tagIds",
               "layoutType",
               "isFragment",
               "thumbnailFileId",
@@ -8028,6 +9769,17 @@ const validateLayoutCreateData = ({ data, errorFactory }) => {
   }
 
   if (data.type === "layout") {
+    {
+      const result = validateOptionalUniqueIdArray({
+        value: data.tagIds,
+        path: "payload.data.tagIds",
+        errorFactory,
+      });
+      if (result?.valid === false) {
+        return result;
+      }
+    }
+
     if (!LAYOUT_TYPE_KEYS.includes(data.layoutType)) {
       return invalidFromErrorFactory(
         errorFactory,
@@ -8064,6 +9816,7 @@ const validateLayoutUpdateData = ({ data, errorFactory }) => {
       allowedKeys: [
         "name",
         "description",
+        "tagIds",
         "layoutType",
         "isFragment",
         "thumbnailFileId",
@@ -8098,6 +9851,17 @@ const validateLayoutUpdateData = ({ data, errorFactory }) => {
     );
   }
 
+  {
+    const result = validateOptionalUniqueIdArray({
+      value: data.tagIds,
+      path: "payload.data.tagIds",
+      errorFactory,
+    });
+    if (result?.valid === false) {
+      return result;
+    }
+  }
+
   if (
     data.thumbnailFileId !== undefined &&
     !isNonEmptyString(data.thumbnailFileId)
@@ -8162,6 +9926,7 @@ const validateControlCreateData = ({ data, errorFactory }) => {
               "type",
               "name",
               "description",
+              "tagIds",
               "thumbnailFileId",
               "preview",
               "elements",
@@ -8211,6 +9976,18 @@ const validateControlCreateData = ({ data, errorFactory }) => {
   }
 
   if (data.type === "control") {
+    {
+      const result = validateOptionalUniqueIdArray({
+        value: data.tagIds,
+        path: "payload.data.tagIds",
+        errorFactory,
+        allowEmpty: false,
+      });
+      if (result?.valid === false) {
+        return result;
+      }
+    }
+
     {
       const result = validateNestedCollection({
         collection: data.elements,
@@ -8244,6 +10021,7 @@ const validateControlUpdateData = ({ data, errorFactory }) => {
       allowedKeys: [
         "name",
         "description",
+        "tagIds",
         "keyboard",
         "thumbnailFileId",
         "preview",
@@ -8308,6 +10086,18 @@ const validateControlUpdateData = ({ data, errorFactory }) => {
       return result;
     }
   }
+
+  {
+    const result = validateOptionalUniqueIdArray({
+      value: data.tagIds,
+      path: "payload.data.tagIds",
+      errorFactory,
+      allowEmpty: false,
+    });
+    if (result?.valid === false) {
+      return result;
+    }
+  }
 };
 
 const validateLayoutElementCreateData = ({ data, errorFactory }) => {
@@ -8616,7 +10406,7 @@ const validateVisualElementReferenceTargets = ({
       if (!isLayoutConditionTarget(state, rule?.when?.target)) {
         return invalidFromErrorFactory(
           errorFactory,
-          `${ownerLabel} element conditionalOverrides.${index}.when.target must reference an existing variable or supported runtime condition`,
+          `${ownerLabel} element conditionalOverrides.${index}.when.target must reference an existing variable or supported layout condition`,
           {
             [ownerIdField]: ownerId,
             elementId,
@@ -8790,6 +10580,7 @@ const createFolderedCollectionCommandDefinitions = ({
   validateCreateState = () => {},
   validateUpdateState = () => {},
   validateDeleteState = () => {},
+  afterDelete = () => {},
   includeUpdate = true,
 }) => {
   const existingMessage = `payload.${idField} must reference an existing ${itemLabel}`;
@@ -9037,6 +10828,7 @@ const createFolderedCollectionCommandDefinitions = ({
       },
       reduce: ({ state, payload }) => {
         const deletedIds = new Set();
+        const deletedItemsById = new Map();
 
         for (const itemId of payload[deleteArrayField]) {
           const removedNode = removeTreeNode({
@@ -9052,6 +10844,10 @@ const createFolderedCollectionCommandDefinitions = ({
             node: removedNode,
           })) {
             deletedIds.add(descendantId);
+            deletedItemsById.set(
+              descendantId,
+              state[collectionKey].items[descendantId],
+            );
           }
         }
 
@@ -9059,6 +10855,13 @@ const createFolderedCollectionCommandDefinitions = ({
           delete state[collectionKey].items[itemId];
         }
 
+        afterDelete({
+          state,
+          payload,
+          deletedIds,
+          deletedItemsById,
+        });
+
         return state;
       },
     },
@@ -9389,7 +11192,8 @@ const COMMAND_DEFINITIONS = [
       }
     },
     validateAgainstState: () => {},
-    reduce: ({ payload }) => structuredClone(payload.state),
+    reduce: ({ payload }) =>
+      structuredClone(normalizeStateCollections(payload.state)),
   },
   ...createFolderedCollectionCommandDefinitions({
     familyName: "file",
@@ -9442,59 +11246,68 @@ const COMMAND_DEFINITIONS = [
     itemLabel: "spritesheet item",
     createDataValidator: validateSpritesheetCreateData,
     updateDataValidator: validateSpritesheetUpdateData,
-    createItem: ({ payload }) => ({
-      id: payload.spritesheetId,
-      type: payload.data.type,
-      name: payload.data.name,
-      ...(payload.data.description !== undefined
-        ? {
-            description: payload.data.description,
-          }
-        : {}),
-      ...(payload.data.type === "spritesheet"
-        ? {
-            fileId: payload.data.fileId,
-            ...(payload.data.thumbnailFileId !== undefined
-              ? {
-                  thumbnailFileId: payload.data.thumbnailFileId,
-                }
-              : {}),
-            ...(payload.data.sheetWidth !== undefined
-              ? {
-                  sheetWidth: payload.data.sheetWidth,
-                }
-              : {}),
-            ...(payload.data.sheetHeight !== undefined
-              ? {
-                  sheetHeight: payload.data.sheetHeight,
-                }
-              : {}),
-            ...(payload.data.frameCount !== undefined
-              ? {
-                  frameCount: payload.data.frameCount,
-                }
-              : {}),
-            ...(payload.data.width !== undefined
-              ? {
-                  width: payload.data.width,
-                }
-              : {}),
-            ...(payload.data.height !== undefined
-              ? {
-                  height: payload.data.height,
-                }
-              : {}),
-            jsonData: structuredClone(payload.data.jsonData),
-            animations: structuredClone(payload.data.animations),
-          }
-        : {}),
-    }),
+    createItem: ({ payload }) => {
+      const item = {
+        id: payload.spritesheetId,
+        type: payload.data.type,
+        name: payload.data.name,
+      };
+
+      if (payload.data.description !== undefined) {
+        item.description = payload.data.description;
+      }
+
+      if (payload.data.type !== "spritesheet") {
+        return item;
+      }
+
+      item.fileId = payload.data.fileId;
+
+      if (payload.data.thumbnailFileId !== undefined) {
+        item.thumbnailFileId = payload.data.thumbnailFileId;
+      }
+
+      if (payload.data.sheetWidth !== undefined) {
+        item.sheetWidth = payload.data.sheetWidth;
+      }
+
+      if (payload.data.sheetHeight !== undefined) {
+        item.sheetHeight = payload.data.sheetHeight;
+      }
+
+      if (payload.data.frameCount !== undefined) {
+        item.frameCount = payload.data.frameCount;
+      }
+
+      if (payload.data.width !== undefined) {
+        item.width = payload.data.width;
+      }
+
+      if (payload.data.height !== undefined) {
+        item.height = payload.data.height;
+      }
+
+      assignOptionalTagIds({
+        target: item,
+        tagIds: payload.data.tagIds,
+      });
+
+      item.jsonData = structuredClone(payload.data.jsonData);
+      item.animations = structuredClone(payload.data.animations);
+
+      return item;
+    },
+    updateItem: ({ currentItem, payload }) =>
+      applyTagIdsUpdate({
+        currentItem,
+        data: payload.data,
+      }),
     validateCreateState: ({ state, payload }) => {
       if (payload.data.type !== "spritesheet") {
         return;
       }
 
-      return validateReferencedFilesInData({
+      const fileResult = validateReferencedFilesInData({
         state,
         data: payload.data,
         fields: ["fileId", "thumbnailFileId"],
@@ -9502,6 +11315,19 @@ const COMMAND_DEFINITIONS = [
           spritesheetId: payload.spritesheetId,
         },
       });
+      if (!fileResult.valid) {
+        return fileResult;
+      }
+
+      return validateTagIdsAgainstScope({
+        state,
+        tagIds: payload.data.tagIds,
+        scopeKey: "spritesheets",
+        path: "payload.data.tagIds",
+        details: {
+          spritesheetId: payload.spritesheetId,
+        },
+      });
     },
     validateUpdateState: ({ state, payload, currentItem }) => {
       if (
@@ -9516,7 +11342,7 @@ const COMMAND_DEFINITIONS = [
       }
 
       if (currentItem.type === "spritesheet") {
-        return validateReferencedFilesInData({
+        const fileResult = validateReferencedFilesInData({
           state,
           data: payload.data,
           fields: ["fileId", "thumbnailFileId"],
@@ -9524,6 +11350,19 @@ const COMMAND_DEFINITIONS = [
             spritesheetId: payload.spritesheetId,
           },
         });
+        if (!fileResult.valid) {
+          return fileResult;
+        }
+
+        return validateTagIdsAgainstScope({
+          state,
+          tagIds: payload.data.tagIds,
+          scopeKey: "spritesheets",
+          path: "payload.data.tagIds",
+          details: {
+            spritesheetId: payload.spritesheetId,
+          },
+        });
       }
     },
   }),
@@ -10881,6 +12720,16 @@ const COMMAND_DEFINITIONS = [
         if (!result.valid) {
           return result;
         }
+
+        return validateTagIdsAgainstScope({
+          state,
+          tagIds: payload.data.tagIds,
+          scopeKey: "images",
+          path: "payload.data.tagIds",
+          details: {
+            imageId: payload.imageId,
+          },
+        });
       }
     },
     reduce: ({ state, payload }) => {
@@ -10905,6 +12754,11 @@ const COMMAND_DEFINITIONS = [
         if (payload.data.height !== undefined) {
           nextImage.height = payload.data.height;
         }
+
+        assignOptionalTagIds({
+          target: nextImage,
+          tagIds: payload.data.tagIds,
+        });
       }
 
       state.images.items[payload.imageId] = nextImage;
@@ -10966,7 +12820,8 @@ const COMMAND_DEFINITIONS = [
         (payload.data.fileId !== undefined ||
           payload.data.thumbnailFileId !== undefined ||
           payload.data.width !== undefined ||
-          payload.data.height !== undefined)
+          payload.data.height !== undefined ||
+          payload.data.tagIds !== undefined)
       ) {
         return invalidPrecondition(
           "folder image items cannot update file fields",
@@ -10985,14 +12840,24 @@ const COMMAND_DEFINITIONS = [
         if (!result.valid) {
           return result;
         }
+
+        return validateTagIdsAgainstScope({
+          state,
+          tagIds: payload.data.tagIds,
+          scopeKey: "images",
+          path: "payload.data.tagIds",
+          details: {
+            imageId: payload.imageId,
+          },
+        });
       }
     },
     reduce: ({ state, payload }) => {
       const currentImage = state.images.items[payload.imageId];
-      state.images.items[payload.imageId] = {
-        ...structuredClone(currentImage),
-        ...structuredClone(payload.data),
-      };
+      state.images.items[payload.imageId] = applyTagIdsUpdate({
+        currentItem: currentImage,
+        data: payload.data,
+      });
       return state;
     },
   },
@@ -11298,6 +13163,16 @@ const COMMAND_DEFINITIONS = [
         if (!result.valid) {
           return result;
         }
+
+        return validateTagIdsAgainstScope({
+          state,
+          tagIds: payload.data.tagIds,
+          scopeKey: "sounds",
+          path: "payload.data.tagIds",
+          details: {
+            soundId: payload.soundId,
+          },
+        });
       }
     },
     reduce: ({ state, payload }) => {
@@ -11319,6 +13194,11 @@ const COMMAND_DEFINITIONS = [
         if (payload.data.duration !== undefined) {
           nextSound.duration = payload.data.duration;
         }
+
+        assignOptionalTagIds({
+          target: nextSound,
+          tagIds: payload.data.tagIds,
+        });
       }
 
       state.sounds.items[payload.soundId] = nextSound;
@@ -11379,7 +13259,8 @@ const COMMAND_DEFINITIONS = [
         currentSound.type === "folder" &&
         (payload.data.fileId !== undefined ||
           payload.data.waveformDataFileId !== undefined ||
-          payload.data.duration !== undefined)
+          payload.data.duration !== undefined ||
+          payload.data.tagIds !== undefined)
       ) {
         return invalidPrecondition(
           "folder sound items cannot update file fields",
@@ -11399,14 +13280,24 @@ const COMMAND_DEFINITIONS = [
         if (!result.valid) {
           return result;
         }
+
+        return validateTagIdsAgainstScope({
+          state,
+          tagIds: payload.data.tagIds,
+          scopeKey: "sounds",
+          path: "payload.data.tagIds",
+          details: {
+            soundId: payload.soundId,
+          },
+        });
       }
     },
     reduce: ({ state, payload }) => {
       const currentSound = state.sounds.items[payload.soundId];
-      state.sounds.items[payload.soundId] = {
-        ...structuredClone(currentSound),
-        ...structuredClone(payload.data),
-      };
+      state.sounds.items[payload.soundId] = applyTagIdsUpdate({
+        currentItem: currentSound,
+        data: payload.data,
+      });
       return state;
     },
   },
@@ -11711,6 +13602,16 @@ const COMMAND_DEFINITIONS = [
         if (!result.valid) {
           return result;
         }
+
+        return validateTagIdsAgainstScope({
+          state,
+          tagIds: payload.data.tagIds,
+          scopeKey: "videos",
+          path: "payload.data.tagIds",
+          details: {
+            videoId: payload.videoId,
+          },
+        });
       }
     },
     reduce: ({ state, payload }) => {
@@ -11736,6 +13637,11 @@ const COMMAND_DEFINITIONS = [
         if (payload.data.height !== undefined) {
           nextVideo.height = payload.data.height;
         }
+
+        assignOptionalTagIds({
+          target: nextVideo,
+          tagIds: payload.data.tagIds,
+        });
       }
 
       state.videos.items[payload.videoId] = nextVideo;
@@ -11798,7 +13704,8 @@ const COMMAND_DEFINITIONS = [
           payload.data.thumbnailFileId !== undefined ||
           payload.data.duration !== undefined ||
           payload.data.width !== undefined ||
-          payload.data.height !== undefined)
+          payload.data.height !== undefined ||
+          payload.data.tagIds !== undefined)
       ) {
         return invalidPrecondition(
           "folder video items cannot update file fields",
@@ -11817,14 +13724,24 @@ const COMMAND_DEFINITIONS = [
         if (!result.valid) {
           return result;
         }
+
+        return validateTagIdsAgainstScope({
+          state,
+          tagIds: payload.data.tagIds,
+          scopeKey: "videos",
+          path: "payload.data.tagIds",
+          details: {
+            videoId: payload.videoId,
+          },
+        });
       }
     },
     reduce: ({ state, payload }) => {
       const currentVideo = state.videos.items[payload.videoId];
-      state.videos.items[payload.videoId] = {
-        ...structuredClone(currentVideo),
-        ...structuredClone(payload.data),
-      };
+      state.videos.items[payload.videoId] = applyTagIdsUpdate({
+        currentItem: currentVideo,
+        data: payload.data,
+      });
       return state;
     },
   },
@@ -12130,6 +14047,16 @@ const COMMAND_DEFINITIONS = [
         if (!result.valid) {
           return result;
         }
+
+        return validateTagIdsAgainstScope({
+          state,
+          tagIds: payload.data.tagIds,
+          scopeKey: "animations",
+          path: "payload.data.tagIds",
+          details: {
+            animationId: payload.animationId,
+          },
+        });
       }
     },
     reduce: ({ state, payload }) => {
@@ -12144,6 +14071,10 @@ const COMMAND_DEFINITIONS = [
       }
 
       if (payload.data.type === "animation") {
+        assignOptionalTagIds({
+          target: nextAnimation,
+          tagIds: payload.data.tagIds,
+        });
         nextAnimation.animation = structuredClone(payload.data.animation);
       }
 
@@ -12203,32 +14134,45 @@ const COMMAND_DEFINITIONS = [
 
       if (
         currentAnimation.type === "folder" &&
-        payload.data.animation !== undefined
+        Object.keys(payload.data).some(
+          (key) => key !== "name" && key !== "description",
+        )
       ) {
         return invalidPrecondition(
           "folder animation items cannot update animation fields",
         );
       }
 
-      if (payload.data.animation !== undefined) {
-        const result = validateAnimationMaskImageReferences({
+      if (currentAnimation.type === "animation") {
+        if (payload.data.animation !== undefined) {
+          const result = validateAnimationMaskImageReferences({
+            state,
+            animation: payload.data.animation,
+            path: "payload.data.animation",
+            details: { animationId: payload.animationId },
+            errorFactory: createPreconditionValidationError,
+          });
+          if (!result.valid) {
+            return result;
+          }
+        }
+
+        return validateTagIdsAgainstScope({
           state,
-          animation: payload.data.animation,
-          path: "payload.data.animation",
+          tagIds: payload.data.tagIds,
+          scopeKey: "animations",
+          path: "payload.data.tagIds",
           details: { animationId: payload.animationId },
           errorFactory: createPreconditionValidationError,
         });
-        if (!result.valid) {
-          return result;
-        }
       }
     },
     reduce: ({ state, payload }) => {
       const currentAnimation = state.animations.items[payload.animationId];
-      state.animations.items[payload.animationId] = {
-        ...structuredClone(currentAnimation),
-        ...structuredClone(payload.data),
-      };
+      state.animations.items[payload.animationId] = applyTagIdsUpdate({
+        currentItem: currentAnimation,
+        data: payload.data,
+      });
       return state;
     },
   },
@@ -12522,6 +14466,21 @@ const COMMAND_DEFINITIONS = [
       }
 
       if (payload.data.type === "font") {
+        {
+          const result = validateTagIdsAgainstScope({
+            state,
+            tagIds: payload.data.tagIds,
+            scopeKey: "fonts",
+            path: "payload.data.tagIds",
+            details: {
+              fontId: payload.fontId,
+            },
+          });
+          if (!result.valid) {
+            return result;
+          }
+        }
+
         const result = validateReferencedFilesInData({
           state,
           data: payload.data,
@@ -12547,6 +14506,10 @@ const COMMAND_DEFINITIONS = [
       }
 
       if (payload.data.type === "font") {
+        assignOptionalTagIds({
+          target: nextFont,
+          tagIds: payload.data.tagIds,
+        });
         nextFont.fileId = payload.data.fileId;
         nextFont.fontFamily = payload.data.fontFamily;
       }
@@ -12607,7 +14570,8 @@ const COMMAND_DEFINITIONS = [
 
       if (
         currentFont.type === "folder" &&
-        (payload.data.fileId !== undefined ||
+        (payload.data.tagIds !== undefined ||
+          payload.data.fileId !== undefined ||
           payload.data.fontFamily !== undefined)
       ) {
         return invalidPrecondition(
@@ -12616,6 +14580,21 @@ const COMMAND_DEFINITIONS = [
       }
 
       if (currentFont.type === "font") {
+        {
+          const result = validateTagIdsAgainstScope({
+            state,
+            tagIds: payload.data.tagIds,
+            scopeKey: "fonts",
+            path: "payload.data.tagIds",
+            details: {
+              fontId: payload.fontId,
+            },
+          });
+          if (!result.valid) {
+            return result;
+          }
+        }
+
         const result = validateReferencedFilesInData({
           state,
           data: payload.data,
@@ -12631,10 +14610,10 @@ const COMMAND_DEFINITIONS = [
     },
     reduce: ({ state, payload }) => {
       const currentFont = state.fonts.items[payload.fontId];
-      state.fonts.items[payload.fontId] = {
-        ...structuredClone(currentFont),
-        ...structuredClone(payload.data),
-      };
+      state.fonts.items[payload.fontId] = applyTagIdsUpdate({
+        currentItem: currentFont,
+        data: payload.data,
+      });
       return state;
     },
   },
@@ -12926,6 +14905,18 @@ const COMMAND_DEFINITIONS = [
           );
         }
       }
+
+      if (payload.data.type === "color") {
+        return validateTagIdsAgainstScope({
+          state,
+          tagIds: payload.data.tagIds,
+          scopeKey: "colors",
+          path: "payload.data.tagIds",
+          details: {
+            colorId: payload.colorId,
+          },
+        });
+      }
     },
     reduce: ({ state, payload }) => {
       const nextColor = {
@@ -12940,6 +14931,10 @@ const COMMAND_DEFINITIONS = [
 
       if (payload.data.type === "color") {
         nextColor.hex = payload.data.hex;
+        assignOptionalTagIds({
+          target: nextColor,
+          tagIds: payload.data.tagIds,
+        });
       }
 
       state.colors.items[payload.colorId] = nextColor;
@@ -12996,18 +14991,33 @@ const COMMAND_DEFINITIONS = [
         );
       }
 
-      if (currentColor.type === "folder" && payload.data.hex !== undefined) {
+      if (
+        currentColor.type === "folder" &&
+        (payload.data.tagIds !== undefined || payload.data.hex !== undefined)
+      ) {
         return invalidPrecondition(
           "folder color items cannot update color fields",
         );
       }
+
+      if (currentColor.type === "color") {
+        return validateTagIdsAgainstScope({
+          state,
+          tagIds: payload.data.tagIds,
+          scopeKey: "colors",
+          path: "payload.data.tagIds",
+          details: {
+            colorId: payload.colorId,
+          },
+        });
+      }
     },
     reduce: ({ state, payload }) => {
       const currentColor = state.colors.items[payload.colorId];
-      state.colors.items[payload.colorId] = {
-        ...structuredClone(currentColor),
-        ...structuredClone(payload.data),
-      };
+      state.colors.items[payload.colorId] = applyTagIdsUpdate({
+        currentItem: currentColor,
+        data: payload.data,
+      });
       return state;
     },
   },
@@ -13229,6 +15239,10 @@ const COMMAND_DEFINITIONS = [
       item.width = payload.data.width;
       item.height = payload.data.height;
       item.modules = structuredClone(payload.data.modules);
+      assignOptionalTagIds({
+        target: item,
+        tagIds: payload.data.tagIds,
+      });
 
       if (payload.data.seed !== undefined && payload.data.seed !== null) {
         item.seed = payload.data.seed;
@@ -13237,10 +15251,10 @@ const COMMAND_DEFINITIONS = [
       return item;
     },
     updateItem: ({ currentItem, payload }) => {
-      const nextItem = {
-        ...structuredClone(currentItem),
-        ...structuredClone(payload.data),
-      };
+      const nextItem = applyTagIdsUpdate({
+        currentItem,
+        data: payload.data,
+      });
 
       if (payload.data.seed === null) {
         delete nextItem.seed;
@@ -13248,7 +15262,7 @@ const COMMAND_DEFINITIONS = [
 
       return nextItem;
     },
-    validateUpdateState: ({ payload, currentItem }) => {
+    validateUpdateState: ({ state, payload, currentItem }) => {
       if (
         currentItem.type === "folder" &&
         Object.keys(payload.data).some(
@@ -13259,6 +15273,33 @@ const COMMAND_DEFINITIONS = [
           "folder particle items cannot update particle fields",
         );
       }
+
+      if (currentItem.type === "particle") {
+        return validateTagIdsAgainstScope({
+          state,
+          tagIds: payload.data.tagIds,
+          scopeKey: "particles",
+          path: "payload.data.tagIds",
+          details: {
+            particleId: payload.particleId,
+          },
+        });
+      }
+    },
+    validateCreateState: ({ state, payload }) => {
+      if (payload.data.type !== "particle") {
+        return;
+      }
+
+      return validateTagIdsAgainstScope({
+        state,
+        tagIds: payload.data.tagIds,
+        scopeKey: "particles",
+        path: "payload.data.tagIds",
+        details: {
+          particleId: payload.particleId,
+        },
+      });
     },
   }),
   ...createFolderedCollectionCommandDefinitions({
@@ -13268,28 +15309,57 @@ const COMMAND_DEFINITIONS = [
     itemLabel: "transform item",
     createDataValidator: validateTransformCreateData,
     updateDataValidator: validateTransformUpdateData,
-    createItem: ({ payload }) => ({
-      id: payload.transformId,
-      type: payload.data.type,
-      name: payload.data.name,
-      ...(payload.data.description !== undefined
-        ? {
-            description: payload.data.description,
-          }
-        : {}),
-      ...(payload.data.type === "transform"
-        ? {
-            x: payload.data.x,
-            y: payload.data.y,
-            scaleX: payload.data.scaleX,
-            scaleY: payload.data.scaleY,
-            anchorX: payload.data.anchorX,
-            anchorY: payload.data.anchorY,
-            rotation: payload.data.rotation,
-          }
-        : {}),
-    }),
-    validateUpdateState: ({ payload, currentItem }) => {
+    createItem: ({ payload }) => {
+      const item = {
+        id: payload.transformId,
+        type: payload.data.type,
+        name: payload.data.name,
+        ...(payload.data.description !== undefined
+          ? {
+              description: payload.data.description,
+            }
+          : {}),
+      };
+
+      if (payload.data.type !== "transform") {
+        return item;
+      }
+
+      item.x = payload.data.x;
+      item.y = payload.data.y;
+      item.scaleX = payload.data.scaleX;
+      item.scaleY = payload.data.scaleY;
+      item.anchorX = payload.data.anchorX;
+      item.anchorY = payload.data.anchorY;
+      item.rotation = payload.data.rotation;
+      assignOptionalTagIds({
+        target: item,
+        tagIds: payload.data.tagIds,
+      });
+
+      return item;
+    },
+    updateItem: ({ currentItem, payload }) =>
+      applyTagIdsUpdate({
+        currentItem,
+        data: payload.data,
+      }),
+    validateCreateState: ({ state, payload }) => {
+      if (payload.data.type !== "transform") {
+        return;
+      }
+
+      return validateTagIdsAgainstScope({
+        state,
+        tagIds: payload.data.tagIds,
+        scopeKey: "transforms",
+        path: "payload.data.tagIds",
+        details: {
+          transformId: payload.transformId,
+        },
+      });
+    },
+    validateUpdateState: ({ state, payload, currentItem }) => {
       if (
         currentItem.type === "folder" &&
         Object.keys(payload.data).some(
@@ -13300,6 +15370,18 @@ const COMMAND_DEFINITIONS = [
           "folder transform items cannot update transform fields",
         );
       }
+
+      if (currentItem.type === "transform") {
+        return validateTagIdsAgainstScope({
+          state,
+          tagIds: payload.data.tagIds,
+          scopeKey: "transforms",
+          path: "payload.data.tagIds",
+          details: {
+            transformId: payload.transformId,
+          },
+        });
+      }
     },
   }),
   ...createFolderedCollectionCommandDefinitions({
@@ -13309,24 +15391,38 @@ const COMMAND_DEFINITIONS = [
     itemLabel: "variable item",
     createDataValidator: validateVariableCreateData,
     updateDataValidator: validateVariableUpdateData,
-    createItem: ({ payload }) => ({
-      id: payload.variableId,
-      type: payload.data.type,
-      name: payload.data.name,
-      ...(payload.data.description !== undefined
-        ? {
-            description: payload.data.description,
-          }
-        : {}),
-      ...(payload.data.type === "folder"
-        ? {}
-        : {
-            scope: payload.data.scope,
-            default: payload.data.default,
-            value: payload.data.value,
-          }),
-    }),
-    validateUpdateState: ({ payload, currentItem }) => {
+    createItem: ({ payload }) => {
+      const data = structuredClone(payload.data);
+      if (!Array.isArray(data.tagIds) || data.tagIds.length === 0) {
+        delete data.tagIds;
+      }
+
+      return {
+        id: payload.variableId,
+        ...data,
+      };
+    },
+    updateItem: ({ currentItem, payload }) =>
+      applyTagIdsUpdate({
+        currentItem,
+        data: payload.data,
+      }),
+    validateCreateState: ({ state, payload }) => {
+      if (payload.data.type === "folder") {
+        return;
+      }
+
+      return validateTagIdsAgainstScope({
+        state,
+        tagIds: payload.data.tagIds,
+        scopeKey: "variables",
+        path: "payload.data.tagIds",
+        details: {
+          variableId: payload.variableId,
+        },
+      });
+    },
+    validateUpdateState: ({ state, payload, currentItem }) => {
       if (
         currentItem.type === "folder" &&
         Object.keys(payload.data).some(
@@ -13339,6 +15435,21 @@ const COMMAND_DEFINITIONS = [
       }
 
       if (currentItem.type !== "folder") {
+        {
+          const result = validateTagIdsAgainstScope({
+            state,
+            tagIds: payload.data.tagIds,
+            scopeKey: "variables",
+            path: "payload.data.tagIds",
+            details: {
+              variableId: payload.variableId,
+            },
+          });
+          if (!result.valid) {
+            return result;
+          }
+        }
+
         if (payload.data.default !== undefined) {
           {
             const result = validateVariableTypedValue({
@@ -13376,16 +15487,43 @@ const COMMAND_DEFINITIONS = [
     itemLabel: "text style item",
     createDataValidator: validateTextStyleCreateData,
     updateDataValidator: validateTextStyleUpdateData,
-    createItem: ({ payload }) => ({
-      id: payload.textStyleId,
-      ...structuredClone(payload.data),
-    }),
+    createItem: ({ payload }) => {
+      const data = structuredClone(payload.data);
+      if (!Array.isArray(data.tagIds) || data.tagIds.length === 0) {
+        delete data.tagIds;
+      }
+
+      return {
+        id: payload.textStyleId,
+        ...data,
+      };
+    },
+    updateItem: ({ currentItem, payload }) =>
+      applyTagIdsUpdate({
+        currentItem,
+        data: payload.data,
+      }),
     validateCreateState: ({ state, payload }) => {
       const data = payload.data;
       if (data.type !== "textStyle") {
         return;
       }
 
+      {
+        const result = validateTagIdsAgainstScope({
+          state,
+          tagIds: payload.data.tagIds,
+          scopeKey: "textStyles",
+          path: "payload.data.tagIds",
+          details: {
+            textStyleId: payload.textStyleId,
+          },
+        });
+        if (!result.valid) {
+          return result;
+        }
+      }
+
       for (const field of ["fontId", "colorId", "strokeColorId"]) {
         if (data[field] === undefined) {
           continue;
@@ -13412,6 +15550,23 @@ const COMMAND_DEFINITIONS = [
         );
       }
 
+      if (currentItem.type === "textStyle") {
+        {
+          const result = validateTagIdsAgainstScope({
+            state,
+            tagIds: payload.data.tagIds,
+            scopeKey: "textStyles",
+            path: "payload.data.tagIds",
+            details: {
+              textStyleId: payload.textStyleId,
+            },
+          });
+          if (!result.valid) {
+            return result;
+          }
+        }
+      }
+
       for (const field of ["fontId", "colorId", "strokeColorId"]) {
         if (payload.data[field] === undefined) {
           continue;
@@ -13457,6 +15612,15 @@ const COMMAND_DEFINITIONS = [
         item.fileId = payload.data.fileId;
       }
 
+      assignOptionalTagIds({
+        target: item,
+        tagIds: payload.data.tagIds,
+      });
+      assignOptionalCharacterSpriteGroups({
+        target: item,
+        spriteGroups: payload.data.spriteGroups,
+      });
+
       item.sprites =
         payload.data.sprites === undefined
           ? { items: {}, tree: [] }
@@ -13464,6 +15628,11 @@ const COMMAND_DEFINITIONS = [
 
       return item;
     },
+    updateItem: ({ currentItem, payload }) =>
+      applyCharacterUpdate({
+        currentItem,
+        data: payload.data,
+      }),
     validateCreateState: ({ state, payload }) => {
       if (payload.data.type !== "character") {
         return;
@@ -13483,6 +15652,36 @@ const COMMAND_DEFINITIONS = [
         }
       }
 
+      {
+        const result = validateTagIdsAgainstScope({
+          state,
+          tagIds: payload.data.tagIds,
+          scopeKey: "characters",
+          path: "payload.data.tagIds",
+          details: {
+            characterId: payload.characterId,
+          },
+        });
+        if (!result.valid) {
+          return result;
+        }
+      }
+
+      {
+        const result = validateCharacterSpriteGroupsAgainstScope({
+          state,
+          spriteGroups: payload.data.spriteGroups,
+          scopeKey: `${CHARACTER_SPRITE_TAG_SCOPE_PREFIX}${payload.characterId}`,
+          path: "payload.data.spriteGroups",
+          details: {
+            characterId: payload.characterId,
+          },
+        });
+        if (!result.valid) {
+          return result;
+        }
+      }
+
       for (const [spriteId, sprite] of Object.entries(
         payload.data.sprites?.items || {},
       )) {
@@ -13490,6 +15689,16 @@ const COMMAND_DEFINITIONS = [
           continue;
         }
 
+        if (sprite.tagIds !== undefined) {
+          return invalidPrecondition(
+            "payload.data.sprites.items.*.tagIds are not supported during character.create",
+            {
+              characterId: payload.characterId,
+              spriteId,
+            },
+          );
+        }
+
         const result = validateFileReference({
           state,
           fileId: sprite.fileId,
@@ -13547,6 +15756,40 @@ const COMMAND_DEFINITIONS = [
         if (!result.valid) {
           return result;
         }
+
+        {
+          const tagResult = validateTagIdsAgainstScope({
+            state,
+            tagIds: payload.data.tagIds,
+            scopeKey: "characters",
+            path: "payload.data.tagIds",
+            details: {
+              characterId: payload.characterId,
+            },
+          });
+          if (!tagResult.valid) {
+            return tagResult;
+          }
+        }
+
+        return validateCharacterSpriteGroupsAgainstScope({
+          state,
+          spriteGroups: payload.data.spriteGroups,
+          scopeKey: `${CHARACTER_SPRITE_TAG_SCOPE_PREFIX}${payload.characterId}`,
+          path: "payload.data.spriteGroups",
+          details: {
+            characterId: payload.characterId,
+          },
+        });
+      }
+    },
+    afterDelete: ({ state, deletedItemsById }) => {
+      for (const [characterId, item] of deletedItemsById.entries()) {
+        if (item?.type !== "character") {
+          continue;
+        }
+
+        delete state.tags[`${CHARACTER_SPRITE_TAG_SCOPE_PREFIX}${characterId}`];
       }
     },
   }),
@@ -13568,6 +15811,12 @@ const COMMAND_DEFINITIONS = [
         : {}),
       ...(payload.data.type === "layout"
         ? {
+            ...(Array.isArray(payload.data.tagIds) &&
+            payload.data.tagIds.length > 0
+              ? {
+                  tagIds: structuredClone(payload.data.tagIds),
+                }
+              : {}),
             layoutType: payload.data.layoutType,
             isFragment: payload.data.isFragment,
             ...(payload.data.thumbnailFileId !== undefined
@@ -13584,11 +15833,31 @@ const COMMAND_DEFINITIONS = [
           }
         : {}),
     }),
+    updateItem: ({ currentItem, payload }) =>
+      applyTagIdsUpdate({
+        currentItem,
+        data: payload.data,
+      }),
     validateCreateState: ({ state, payload }) => {
       if (payload.data.type !== "layout") {
         return;
       }
 
+      {
+        const result = validateTagIdsAgainstScope({
+          state,
+          tagIds: payload.data.tagIds,
+          scopeKey: "layouts",
+          path: "payload.data.tagIds",
+          details: {
+            layoutId: payload.layoutId,
+          },
+        });
+        if (!result.valid) {
+          return result;
+        }
+      }
+
       return validateReferencedFilesInData({
         state,
         data: payload.data,
@@ -13611,6 +15880,21 @@ const COMMAND_DEFINITIONS = [
       }
 
       if (currentItem.type === "layout") {
+        {
+          const result = validateTagIdsAgainstScope({
+            state,
+            tagIds: payload.data.tagIds,
+            scopeKey: "layouts",
+            path: "payload.data.tagIds",
+            details: {
+              layoutId: payload.layoutId,
+            },
+          });
+          if (!result.valid) {
+            return result;
+          }
+        }
+
         return validateReferencedFilesInData({
           state,
           data: payload.data,
@@ -13621,49 +15905,50 @@ const COMMAND_DEFINITIONS = [
         });
       }
     },
-  }),
-  ...createFolderedCollectionCommandDefinitions({
-    familyName: "control",
-    collectionKey: "controls",
-    idField: "controlId",
-    itemLabel: "control item",
-    createDataValidator: validateControlCreateData,
-    updateDataValidator: validateControlUpdateData,
-    createItem: ({ payload }) => ({
-      id: payload.controlId,
-      type: payload.data.type,
-      name: payload.data.name,
-      ...(payload.data.description !== undefined
-        ? {
-            description: payload.data.description,
-          }
-        : {}),
-      ...(payload.data.type === "control"
-        ? {
-            ...(payload.data.thumbnailFileId !== undefined
-              ? {
-                  thumbnailFileId: payload.data.thumbnailFileId,
-                }
-              : {}),
-            ...(payload.data.preview !== undefined
-              ? {
-                  preview: structuredClone(payload.data.preview),
-                }
-              : {}),
-            elements: structuredClone(payload.data.elements),
-            ...(payload.data.keyboard !== undefined
-              ? {
-                  keyboard: structuredClone(payload.data.keyboard),
-                }
-              : {}),
-          }
-        : {}),
-    }),
+  }),
+  ...createFolderedCollectionCommandDefinitions({
+    familyName: "control",
+    collectionKey: "controls",
+    idField: "controlId",
+    itemLabel: "control item",
+    createDataValidator: validateControlCreateData,
+    updateDataValidator: validateControlUpdateData,
+    createItem: ({ payload }) => {
+      const data = structuredClone(payload.data);
+      if (!Array.isArray(data.tagIds) || data.tagIds.length === 0) {
+        delete data.tagIds;
+      }
+
+      return {
+        id: payload.controlId,
+        ...data,
+      };
+    },
+    updateItem: ({ currentItem, payload }) =>
+      applyTagIdsUpdate({
+        currentItem,
+        data: payload.data,
+      }),
     validateCreateState: ({ state, payload }) => {
       if (payload.data.type !== "control") {
         return;
       }
 
+      {
+        const result = validateTagIdsAgainstScope({
+          state,
+          tagIds: payload.data.tagIds,
+          scopeKey: "controls",
+          path: "payload.data.tagIds",
+          details: {
+            controlId: payload.controlId,
+          },
+        });
+        if (!result.valid) {
+          return result;
+        }
+      }
+
       return validateReferencedFilesInData({
         state,
         data: payload.data,
@@ -13686,6 +15971,21 @@ const COMMAND_DEFINITIONS = [
       }
 
       if (currentItem.type === "control") {
+        {
+          const result = validateTagIdsAgainstScope({
+            state,
+            tagIds: payload.data.tagIds,
+            scopeKey: "controls",
+            path: "payload.data.tagIds",
+            details: {
+              controlId: payload.controlId,
+            },
+          });
+          if (!result.valid) {
+            return result;
+          }
+        }
+
         return validateReferencedFilesInData({
           state,
           data: payload.data,
@@ -13817,6 +16117,17 @@ const COMMAND_DEFINITIONS = [
         if (!result.valid) {
           return result;
         }
+
+        return validateTagIdsAgainstScope({
+          state,
+          tagIds: payload.data.tagIds,
+          scopeKey: `${CHARACTER_SPRITE_TAG_SCOPE_PREFIX}${payload.characterId}`,
+          path: "payload.data.tagIds",
+          details: {
+            characterId: payload.characterId,
+            spriteId: payload.spriteId,
+          },
+        });
       }
     },
     reduce: ({ state, payload }) => {
@@ -13825,10 +16136,18 @@ const COMMAND_DEFINITIONS = [
         characterId: payload.characterId,
       });
 
-      collection.items[payload.spriteId] = {
+      const nextSprite = {
         id: payload.spriteId,
         ...structuredClone(payload.data),
       };
+      if (
+        payload.data.tagIds !== undefined &&
+        payload.data.tagIds.length === 0
+      ) {
+        delete nextSprite.tagIds;
+      }
+
+      collection.items[payload.spriteId] = nextSprite;
 
       insertTreeNode({
         tree: collection.tree,
@@ -13922,6 +16241,17 @@ const COMMAND_DEFINITIONS = [
         if (!result.valid) {
           return result;
         }
+
+        return validateTagIdsAgainstScope({
+          state,
+          tagIds: payload.data.tagIds,
+          scopeKey: `${CHARACTER_SPRITE_TAG_SCOPE_PREFIX}${payload.characterId}`,
+          path: "payload.data.tagIds",
+          details: {
+            characterId: payload.characterId,
+            spriteId: payload.spriteId,
+          },
+        });
       }
     },
     reduce: ({ state, payload }) => {
@@ -13931,10 +16261,10 @@ const COMMAND_DEFINITIONS = [
       });
       const currentItem = collection.items[payload.spriteId];
 
-      collection.items[payload.spriteId] = {
-        ...structuredClone(currentItem),
-        ...structuredClone(payload.data),
-      };
+      collection.items[payload.spriteId] = applyTagIdsUpdate({
+        currentItem,
+        data: payload.data,
+      });
 
       return state;
     },
@@ -14166,6 +16496,297 @@ const COMMAND_DEFINITIONS = [
       return state;
     },
   },
+  {
+    type: "tag.create",
+    validatePayload: ({ payload }) => {
+      {
+        const result = validateExactKeys({
+          value: payload,
+          expectedKeys: ["scopeKey", "tagId", "data"],
+          path: "payload",
+          errorFactory: createPayloadValidationError,
+        });
+        if (result?.valid === false) {
+          return result;
+        }
+      }
+
+      {
+        const result = validateTagScopeKey({
+          scopeKey: payload.scopeKey,
+          path: "payload.scopeKey",
+          errorFactory: createPayloadValidationError,
+        });
+        if (result?.valid === false) {
+          return result;
+        }
+      }
+
+      if (!isNonEmptyString(payload.tagId)) {
+        return invalidPayload("payload.tagId must be a non-empty string");
+      }
+
+      {
+        const result = validateTagCreateData({
+          data: payload.data,
+          errorFactory: createPayloadValidationError,
+        });
+        if (result?.valid === false) {
+          return result;
+        }
+      }
+    },
+    validateAgainstState: ({ state, payload }) => {
+      {
+        const result = validateTagScopeAgainstState({
+          state,
+          scopeKey: payload.scopeKey,
+          path: "payload.scopeKey",
+        });
+        if (!result.valid) {
+          return result;
+        }
+      }
+
+      const collection = getTagScopeCollection({
+        state,
+        scopeKey: payload.scopeKey,
+      });
+      if (isPlainObject(collection?.items?.[payload.tagId])) {
+        return invalidPrecondition("payload.tagId must not already exist");
+      }
+
+      return validateUniqueTagNameInScope({
+        collection,
+        name: payload.data.name,
+        path: "payload.data.name",
+      });
+    },
+    reduce: ({ state, payload }) => {
+      const collection = ensureTagScopeCollection({
+        state,
+        scopeKey: payload.scopeKey,
+      });
+      const nextTag = {
+        id: payload.tagId,
+        type: "tag",
+        name: payload.data.name,
+      };
+
+      if (payload.data.color !== undefined) {
+        nextTag.color = payload.data.color;
+      }
+
+      collection.items[payload.tagId] = nextTag;
+      collection.tree.push({
+        id: payload.tagId,
+      });
+
+      return state;
+    },
+  },
+  {
+    type: "tag.update",
+    validatePayload: ({ payload }) => {
+      {
+        const result = validateExactKeys({
+          value: payload,
+          expectedKeys: ["scopeKey", "tagId", "data"],
+          path: "payload",
+          errorFactory: createPayloadValidationError,
+        });
+        if (result?.valid === false) {
+          return result;
+        }
+      }
+
+      {
+        const result = validateTagScopeKey({
+          scopeKey: payload.scopeKey,
+          path: "payload.scopeKey",
+          errorFactory: createPayloadValidationError,
+        });
+        if (result?.valid === false) {
+          return result;
+        }
+      }
+
+      if (!isNonEmptyString(payload.tagId)) {
+        return invalidPayload("payload.tagId must be a non-empty string");
+      }
+
+      {
+        const result = validateTagUpdateData({
+          data: payload.data,
+          errorFactory: createPayloadValidationError,
+        });
+        if (result?.valid === false) {
+          return result;
+        }
+      }
+    },
+    validateAgainstState: ({ state, payload }) => {
+      {
+        const result = validateTagScopeAgainstState({
+          state,
+          scopeKey: payload.scopeKey,
+          path: "payload.scopeKey",
+        });
+        if (!result.valid) {
+          return result;
+        }
+      }
+
+      const collection = getTagScopeCollection({
+        state,
+        scopeKey: payload.scopeKey,
+      });
+      const currentTag = collection?.items?.[payload.tagId];
+      if (!isPlainObject(currentTag) || currentTag.type !== "tag") {
+        return invalidPrecondition(
+          "payload.tagId must reference an existing tag in payload.scopeKey",
+        );
+      }
+
+      if (payload.data.name === undefined) {
+        return VALID_RESULT;
+      }
+
+      return validateUniqueTagNameInScope({
+        collection,
+        name: payload.data.name,
+        path: "payload.data.name",
+        excludeTagId: payload.tagId,
+      });
+    },
+    reduce: ({ state, payload }) => {
+      const collection = ensureTagScopeCollection({
+        state,
+        scopeKey: payload.scopeKey,
+      });
+      const currentTag = collection.items[payload.tagId];
+      const nextTag = {
+        ...structuredClone(currentTag),
+      };
+
+      if (payload.data.name !== undefined) {
+        nextTag.name = payload.data.name;
+      }
+
+      if (payload.data.color === null) {
+        delete nextTag.color;
+      } else if (payload.data.color !== undefined) {
+        nextTag.color = payload.data.color;
+      }
+
+      collection.items[payload.tagId] = nextTag;
+      return state;
+    },
+  },
+  {
+    type: "tag.delete",
+    validatePayload: ({ payload }) => {
+      {
+        const result = validateExactKeys({
+          value: payload,
+          expectedKeys: ["scopeKey", "tagIds"],
+          path: "payload",
+          errorFactory: createPayloadValidationError,
+        });
+        if (result?.valid === false) {
+          return result;
+        }
+      }
+
+      {
+        const result = validateTagScopeKey({
+          scopeKey: payload.scopeKey,
+          path: "payload.scopeKey",
+          errorFactory: createPayloadValidationError,
+        });
+        if (result?.valid === false) {
+          return result;
+        }
+      }
+
+      {
+        const result = validateRequiredUniqueIdArray({
+          value: payload.tagIds,
+          path: "payload.tagIds",
+          errorFactory: createPayloadValidationError,
+        });
+        if (result?.valid === false) {
+          return result;
+        }
+      }
+    },
+    validateAgainstState: ({ state, payload }) => {
+      {
+        const result = validateTagScopeAgainstState({
+          state,
+          scopeKey: payload.scopeKey,
+          path: "payload.scopeKey",
+        });
+        if (!result.valid) {
+          return result;
+        }
+      }
+
+      const collection = getTagScopeCollection({
+        state,
+        scopeKey: payload.scopeKey,
+      });
+      for (const tagId of payload.tagIds) {
+        const tag = collection?.items?.[tagId];
+        if (!isPlainObject(tag) || tag.type !== "tag") {
+          return invalidPrecondition(
+            "payload.tagIds must reference existing tags in payload.scopeKey",
+            {
+              scopeKey: payload.scopeKey,
+              tagId,
+            },
+          );
+        }
+      }
+
+      return VALID_RESULT;
+    },
+    reduce: ({ state, payload }) => {
+      const collection = ensureTagScopeCollection({
+        state,
+        scopeKey: payload.scopeKey,
+      });
+      const deletedTagIds = new Set();
+
+      for (const tagId of payload.tagIds) {
+        const removedNode = removeTreeNode({
+          nodes: collection.tree,
+          nodeId: tagId,
+        });
+        if (!removedNode) {
+          continue;
+        }
+
+        for (const deletedTagId of collectTreeDescendantIds({
+          node: removedNode,
+        })) {
+          deletedTagIds.add(deletedTagId);
+        }
+      }
+
+      for (const tagId of deletedTagIds) {
+        delete collection.items[tagId];
+      }
+
+      stripDeletedTagIdsFromScopeItems({
+        state,
+        scopeKey: payload.scopeKey,
+        deletedTagIds,
+      });
+
+      return state;
+    },
+  },
   {
     type: "layout.element.create",
     validatePayload: ({ payload }) => {
@@ -15338,11 +17959,7 @@ export const validateAgainstState = ({ state, command }) => {
 export const processCommand = ({ state, command }) => {
   return captureValidation(() => {
     const normalizedState = normalizeStateCollections(state);
-    const shouldMaterializeNormalizedState =
-      typeof command?.type === "string" &&
-      (command.type.startsWith("control.") ||
-        command.type.startsWith("spritesheet.") ||
-        command.type.startsWith("particle."));
+    const shouldMaterializeNormalizedState = normalizedState !== state;
 
     const stateResult = validateState({ state: normalizedState });
     if (!stateResult.valid) {