fix: update data to 1.21.4

generator/data/regex.json

@@ -31,7 +31,8 @@
 	"purpur_pillar_top",
 	"pumpkin_top",
 	"melon_top",
-	"^(?!.*mushroom_stem).*stem.*",
+	"pumpkin_stem",
+	"melon_stem",
 	".*stage.*",
 	".*poppy.*",
 	"(?!piston_top).*piston.*",
@@ -40,7 +41,6 @@
 	"observer_top",
 	".*portal.*",
 	"mycelium_top",
-	"lily_pad",
 	".*lilac.*",
 	".*lever.*",
 	".*lava.*",
@@ -86,5 +86,84 @@
 	"frosted_ice",
 	"iron_trapdoor",
 	"item_frame",
-	"jukebox"
+	"jukebox",
+	"cluster",
+	"_open",
+	"_stalk",
+	"leaf",
+	"_rose",
+	"candle",
+	"_powered",
+	"_roots",
+	"vault",
+	"^(?!.*trial_spawner_side_inactive).*trial_spawner.*",
+	"target_top",
+	"^(?!.*_0).*suspicious.*",
+	"stonecutter",
+	"spore",
+	"^(?!.*sea_lantern).*lantern.*",
+	"egg",
+	"smoker_top",
+	"smoker_bottom",
+	"smithing_table_top",
+	"smithing_table_bottom",
+	"^(?!.*budding_amethyst).*bud.*",
+	"^(?!.*sculk_catalyst_side).*sculk.*",
+	"scaffolding",
+	"^(?!.*side0).*respawn.*",
+	"frogspawn",
+	"_ominous",
+	"clump",
+	"^(?!.*reinforced_deepslate_side).*reinforced.*",
+	"pointed_dripstone",
+	"pitcher",
+	"petals",
+	"froglight_top",
+	"^(?!.*pale_moss_block).*pale_moss.*",
+	"pale_hanging",
+	"eyeblossom",
+	"sprouts",
+	"mangrove_roots_side",
+	"propagule",
+	"loom_top",
+	"loop_bottom",
+	"lodestone_top",
+	"lightning",
+	"lily",
+	"lectern",
+	"jigsaw_bottom",
+	"jigsaw_side",
+	"jigsaw_lock",
+	"honey_block_top",
+	"honey_block_bottom",
+	"heavy_core",
+	"grindstone",
+	"lichen",
+	"fletching_table_top",
+	"fungus",
+	"creaking_heart_top",
+	"_triggered",
+	"_crafting",
+	"^(?!.*composter_side).*composter.*",
+	"tuff_top",
+	"bricks_top",
+	"^(?!.*chain_command).*chain.*",
+	"bell",
+	"bee_nest_top",
+	"bee_nest_bottom",
+	"_honey",
+	"^(?!.*beehive_side).*beehive.*",
+	"azalea",
+	"_bloom",
+	"crafter_east",
+	"^(?!.*cartography_table_side1).*cartography.*",
+	"_particle",
+	"_gate",
+	"_fence",
+	"blackstone_top",
+	"_active",
+	"dirt_path",
+	"^(?!.*warped_nylium_side).*warped_nylium.*",
+	"^(?!.*crimson_nylium_side).*crimson_nylium.*",
+	"chiseled_bookshelf_top "
 ]

generator/data/versions.json

@@ -58,7 +58,7 @@
 	"dropper": "1.5",
 	"emerald_block": "1.3.1",
 	"emerald_ore": "1.3.1",
-	"end_stone": "1.0.0",
+	"end_stone": "1.0",
 	"end_stone_bricks": "1.9",
 	"furnace": "1.0",
 	"glass": "1.0",

generator/scripts/data.js

@@ -9,7 +9,7 @@ const versionRegex = require("../data/versions.json");
 const INPUT = path.join(__dirname, "../blocks/");
 const OUTPUT_DIR = path.join(__dirname, "../output/");
 const OUTPUT = path.join(OUTPUT_DIR, "data.json");
-const VERSION_DATA = minecraftData("1.13.2");
+const VERSION_DATA = minecraftData("1.21.3");
 
 if (!fs.existsSync(OUTPUT_DIR)) fs.mkdirSync(OUTPUT_DIR);
 
@@ -24,7 +24,7 @@ const data = {};
 
 		const color = await getAverageColor(filePath);
 
-		const nameRegex = ["_top", "_side", "_front", "_back"];
+		const nameRegex = ["_top", "_side", "_front", "_back", "_bottom"];
 		const pattern = new RegExp(nameRegex.join("|"), "g");
 		const blockName = fileName.replace(pattern, "");
 

src/components/canvas/Blocks.tsx

@@ -5,6 +5,7 @@ import * as PIXI from "pixi.js";
 import { useApp } from "@pixi/react";
 import { CompositeTilemap, settings } from "@pixi/tilemap";
 
+import { getBlockData } from "@/utils/getBlockData";
 import { findBlockFromRgb } from "@/utils/findBlockFromRgb";
 
 interface Props {
@@ -17,16 +18,19 @@ interface Props {
 	imageDimensions: Dimension;
 	coords: Position;
 	scale: number;
+	version: number;
 	setLoading: React.Dispatch<React.SetStateAction<boolean>>;
 }
 
 // Lifts 16,000 tiles limit
 settings.use32bitIndex = true;
 
-function Blocks({ blocks, setBlocks, missingTexture, textures, solidTextures, image, imageDimensions, coords, scale, setLoading }: Props) {
+function Blocks({ blocks, setBlocks, missingTexture, textures, solidTextures, image, imageDimensions, coords, scale, version, setLoading }: Props) {
 	const app = useApp();
 	const tilemapRef = useRef<CompositeTilemap>();
 
+	const blockData = getBlockData(version);
+
 	const tileBlocks = () => {
 		if (!tilemapRef.current) return;
 		const tilemap = tilemapRef.current;
@@ -80,7 +84,7 @@ function Blocks({ blocks, setBlocks, missingTexture, textures, solidTextures, im
 			const newBlocks: Block[] = [];
 
 			for (let i = 0; i < imageData.data.length; i += 4) {
-				const block = findBlockFromRgb(imageData.data[i], imageData.data[i + 1], imageData.data[i + 2], imageData.data[i + 3]);
+				const block = findBlockFromRgb(blockData, imageData.data[i], imageData.data[i + 1], imageData.data[i + 2], imageData.data[i + 3]);
 
 				const x = Math.floor((i / 4) % imageData.width);
 				const y = Math.floor(i / 4 / imageData.width);

src/components/canvas/Canvas.tsx

@@ -25,7 +25,7 @@ import welcomeBlocksData from "@/data/welcome.json";
 PIXI.settings.SCALE_MODE = PIXI.SCALE_MODES.NEAREST;
 
 function Canvas() {
-	const { stageSize, canvasSize, blocks, coords, scale, setStageSize, setBlocks, setCoords, setScale } = useContext(CanvasContext);
+	const { stageSize, canvasSize, blocks, coords, scale, version, setStageSize, setBlocks, setCoords, setScale } = useContext(CanvasContext);
 	const { image, imageDimensions } = useContext(ImageContext);
 	const { setLoading } = useContext(LoadingContext);
 	const { settings } = useContext(SettingsContext);
@@ -301,6 +301,7 @@ function Canvas() {
 					imageDimensions={imageDimensions}
 					coords={coords}
 					scale={scale}
+					version={version}
 					setLoading={setLoading}
 				/>
 

src/components/canvas/information/Cursor.tsx

@@ -1,7 +1,7 @@
 import { CanvasContext } from "@/context/Canvas";
 import { useContext, useEffect, useState } from "react";
 
-import _blockData from "@/data/blocks/programmer-art/data.json";
+import _blockData from "@/data/blocks/data.json";
 const blockData: BlockData = _blockData;
 
 interface Props {

src/components/dialogs/SaveLitematic.tsx

@@ -8,7 +8,7 @@ import { DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTit
 import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 
-import _blockData from "@/data/blocks/programmer-art/data.json";
+import _blockData from "@/data/blocks/data.json";
 const blockData: BlockData = _blockData;
 
 function SaveLitematic({ close }: DialogProps) {
@@ -92,7 +92,7 @@ function SaveLitematic({ close }: DialogProps) {
 
 		// Generate NBT data
 		const data = {
-			MinecraftDataVersion: new nbt.Int32(3955),
+			MinecraftDataVersion: new nbt.Int32(4189),
 			Version: new nbt.Int32(7),
 			SubVersion: new nbt.Int32(1),
 			Metadata: {

src/components/tool-settings/ColorPicker.tsx

@@ -1,32 +1,34 @@
 import { useContext, useEffect, useMemo, useState } from "react";
 import { Alpha, ShadeSlider, Wheel, hsvaToHex, hsvaToRgba, rgbaToHsva } from "@uiw/react-color";
 
+import { Button } from "@/components/ui/button";
 import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
+
+import { CanvasContext } from "@/context/Canvas";
 import { ToolContext } from "@/context/Tool";
 
+import { getBlockData } from "@/utils/getBlockData";
 import { findBlockFromRgb } from "@/utils/findBlockFromRgb";
 
-import _blockData from "@/data/blocks/programmer-art/data.json";
-import { Button } from "../ui/button";
-const blockData: BlockData = _blockData;
-
 function ColorPicker() {
+	const { version } = useContext(CanvasContext);
 	const { selectedBlock, setSelectedBlock } = useContext(ToolContext);
 
 	const [hsva, setHsva] = useState({ h: 0, s: 0, v: 49.4, a: 1 });
 	const rgb = useMemo(() => hsvaToRgba(hsva), [hsva]);
 
 	const limitRgba = (x: number) => Math.min(Math.max(x, 0), 255);
+	const blockData = getBlockData(version);
 
 	useEffect(() => {
 		const blockInfo = blockData[selectedBlock];
 		const rgbColor = { r: blockInfo.color[0], g: blockInfo.color[1], b: blockInfo.color[2], a: blockInfo.color[3] / 255 };
 		setHsva(rgbaToHsva(rgbColor));
-	}, [selectedBlock]);
+	}, [selectedBlock, blockData]);
 
 	const onClickSet = () => {
-		const block = findBlockFromRgb(rgb.r, rgb.g, rgb.b, rgb.a * 255);
+		const block = findBlockFromRgb(blockData, rgb.r, rgb.g, rgb.b, rgb.a * 255);
 		setSelectedBlock(block);
 	};
 

src/components/tool-settings/SelectorBlocks.tsx

@@ -2,12 +2,12 @@ import { useContext, useEffect, useMemo, useState } from "react";
 import { Container, Graphics, Sprite, Stage } from "@pixi/react";
 import { BlocksIcon } from "lucide-react";
 
+import { CanvasContext } from "@/context/Canvas";
 import { TexturesContext } from "@/context/Textures";
 import { ThemeContext } from "@/context/Theme";
 import { ToolContext } from "@/context/Tool";
 
-import _blockData from "@/data/blocks/programmer-art/data.json";
+import { getBlockData } from "@/utils/getBlockData";
-const blockData: BlockData = _blockData;
 
 interface Props {
 	stageWidth: number;
@@ -15,6 +15,7 @@ interface Props {
 }
 
 function SelectorBlocks({ stageWidth, searchInput }: Props) {
+	const { version } = useContext(CanvasContext);
 	const { missingTexture, textures } = useContext(TexturesContext);
 	const { isDark } = useContext(ThemeContext);
 	const { selectedBlock, setSelectedBlock } = useContext(ToolContext);
@@ -22,8 +23,10 @@ function SelectorBlocks({ stageWidth, searchInput }: Props) {
 	const [hoverPosition, setHoverPosition] = useState<Position | null>(null);
 	const [selectedBlockPosition, setSelectedBlockPosition] = useState<Position | null>({ x: 0, y: 0 });
 
+	const blockData = getBlockData(version);
+
 	const blocksPerColumn = Math.floor(stageWidth / (32 + 2));
-	const filteredBlocks = useMemo(() => Object.keys(blockData).filter((value) => value.includes(searchInput)), [searchInput]);
+	const filteredBlocks = useMemo(() => Object.keys(blockData).filter((value) => value.includes(searchInput)), [searchInput, blockData]);
 
 	const getBlockPosition = (index: number): Position => {
 		const x = (index % blocksPerColumn) * (32 + 2) + 2;

src/components/toolbar/SelectedBlock.tsx

@@ -7,7 +7,7 @@ import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/comp
 import { TexturesContext } from "@/context/Textures";
 import { ToolContext } from "@/context/Tool";
 
-import _blockData from "@/data/blocks/programmer-art/data.json";
+import _blockData from "@/data/blocks/data.json";
 const blockData: BlockData = _blockData;
 
 function SelectedBlock() {

src/context/Canvas.tsx

@@ -6,10 +6,12 @@ interface Context {
 	blocks: Block[];
 	coords: Position;
 	scale: number;
+	version: number;
 	setStageSize: React.Dispatch<React.SetStateAction<Dimension>>;
 	setBlocks: React.Dispatch<React.SetStateAction<Block[]>>;
 	setCoords: React.Dispatch<React.SetStateAction<Position>>;
 	setScale: React.Dispatch<React.SetStateAction<number>>;
+	setVersion: React.Dispatch<React.SetStateAction<number>>;
 }
 
 interface Props {
@@ -23,6 +25,7 @@ export const CanvasProvider = ({ children }: Props) => {
 	const [blocks, setBlocks] = useState<Block[]>([]);
 	const [coords, setCoords] = useState<Position>({ x: 0, y: 0 });
 	const [scale, setScale] = useState(1);
+	const [version, setVersion] = useState(1200);
 
 	const canvasSize = useMemo(() => {
 		let minX = Infinity,
@@ -46,7 +49,9 @@ export const CanvasProvider = ({ children }: Props) => {
 	}, [blocks]);
 
 	return (
-		<CanvasContext.Provider value={{ stageSize, canvasSize, blocks, coords, scale, setStageSize, setBlocks, setCoords, setScale }}>
+		<CanvasContext.Provider
+			value={{ stageSize, canvasSize, blocks, coords, scale, version, setStageSize, setBlocks, setCoords, setScale, setVersion }}
+		>
 			{children}
 		</CanvasContext.Provider>
 	);

src/context/Textures.tsx

@@ -3,8 +3,8 @@ import * as PIXI from "pixi.js";
 
 import { LoadingContext } from "./Loading";
 
-import spritesheet from "@/data/blocks/programmer-art/spritesheet.json";
+import spritesheet from "@/data/blocks/spritesheet.json";
-import _blockData from "@/data/blocks/programmer-art/data.json";
+import _blockData from "@/data/blocks/data.json";
 const blockData: BlockData = _blockData;
 
 interface Context {
@@ -34,7 +34,7 @@ export const TexturesProvider = ({ children }: Props) => {
 		setMissingTexture(new PIXI.Texture(baseTexture));
 
 		// Load textures
-		const sheet = new PIXI.Spritesheet(PIXI.BaseTexture.from("/blocks/programmer-art/spritesheet.png"), spritesheet);
+		const sheet = new PIXI.Spritesheet(PIXI.BaseTexture.from("/blocks/spritesheet.png"), spritesheet);
 		sheet.parse().then((t) => {
 			setTextures(t);
 		});

src/types.d.ts

@@ -39,7 +39,7 @@ type BlockData = Record<
 	string,
 	{
 		name: string;
-		version: string;
+		version: number;
 		id: (string | number)[];
 		color: number[];
 		fallable?: boolean;

src/utils/findBlockFromRgb.ts

@@ -1,8 +1,5 @@
-import _blockData from "@/data/blocks/programmer-art/data.json";
+export const findBlockFromRgb = (data: BlockData, r: number, g: number, b: number, a: number): string => {
-const blockData: BlockData = _blockData;
+	return Object.entries(data).reduce(
-
-export const findBlockFromRgb = (r: number, g: number, b: number, a: number): string => {
-	return Object.entries(blockData).reduce(
 		(closestBlock, [block, data]) => {
 			const distance = Math.sqrt(
 				Math.pow(r - data.color[0], 2) + Math.pow(g - data.color[1], 2) + Math.pow(b - data.color[2], 2) + Math.pow(a - data.color[3], 2)

src/utils/getBlockData.ts

@@ -0,0 +1,14 @@
+import _blockData from "@/data/blocks/data.json";
+const blockData: BlockData = _blockData;
+
+export function getBlockData(version: number) {
+	const filteredData: BlockData = {};
+
+	for (const key in blockData) {
+		if (blockData[key].version <= version) {
+			filteredData[key] = blockData[key];
+		}
+	}
+
+	return filteredData;
+}