[{"data":1,"prerenderedAt":5852},["ShallowReactive",2],{"navigation":3,"\u002Fapi\u002Fabstractions\u002Fdecal":498,"\u002Fapi\u002Fabstractions\u002Fdecal-surround":5847},[4,26],{"title":5,"path":6,"stem":7,"children":8},"Getting Started","\u002Fgetting-started","1.getting-started\u002F1.index",[9,10,14,18,22],{"title":5,"path":6,"stem":7},{"title":11,"path":12,"stem":13},"Installation Guide","\u002Fgetting-started\u002Finstallation","1.getting-started\u002F2.installation",{"title":15,"path":16,"stem":17},"Usage","\u002Fgetting-started\u002Fusage","1.getting-started\u002F3.usage",{"title":19,"path":20,"stem":21},"Loading Models","\u002Fgetting-started\u002Floading-models","1.getting-started\u002F4.loading-models",{"title":23,"path":24,"stem":25},"Upgrade Guide","\u002Fgetting-started\u002Fupgrade-guide","1.getting-started\u002F5.upgrade-guide",{"title":27,"path":28,"stem":29,"children":30},"Api","\u002Fapi","2.api",[31,34,96,126,168,210,308,334,368,418,464],{"title":32,"path":28,"stem":33},"All","2.api\u002Findex",{"title":35,"path":36,"stem":37,"children":38},"Abstractions","\u002Fapi\u002Fabstractions","2.api\u002F1.abstractions\u002Findex",[39,40,44,48,52,56,60,64,68,72,76,80,84,88,92],{"title":35,"path":36,"stem":37},{"title":41,"path":42,"stem":43},"Align","\u002Fapi\u002Fabstractions\u002Falign","2.api\u002F1.abstractions\u002Falign",{"title":45,"path":46,"stem":47},"Billboard","\u002Fapi\u002Fabstractions\u002Fbillboard","2.api\u002F1.abstractions\u002Fbillboard",{"title":49,"path":50,"stem":51},"Camera Shake","\u002Fapi\u002Fabstractions\u002Fcamera-shake","2.api\u002F1.abstractions\u002Fcamera-shake",{"title":53,"path":54,"stem":55},"Decal","\u002Fapi\u002Fabstractions\u002Fdecal","2.api\u002F1.abstractions\u002Fdecal",{"title":57,"path":58,"stem":59},"Edges","\u002Fapi\u002Fabstractions\u002Fedges","2.api\u002F1.abstractions\u002Fedges",{"title":61,"path":62,"stem":63},"Fit","\u002Fapi\u002Fabstractions\u002Ffit","2.api\u002F1.abstractions\u002Ffit",{"title":65,"path":66,"stem":67},"Instances","\u002Fapi\u002Fabstractions\u002Finstances","2.api\u002F1.abstractions\u002Finstances",{"title":69,"path":70,"stem":71},"Levioso (Float)","\u002Fapi\u002Fabstractions\u002Flevioso","2.api\u002F1.abstractions\u002Flevioso",{"title":73,"path":74,"stem":75},"Mask","\u002Fapi\u002Fabstractions\u002Fmask","2.api\u002F1.abstractions\u002Fmask",{"title":77,"path":78,"stem":79},"Merged","\u002Fapi\u002Fabstractions\u002Fmerged","2.api\u002F1.abstractions\u002Fmerged",{"title":81,"path":82,"stem":83},"Outline","\u002Fapi\u002Fabstractions\u002Foutline","2.api\u002F1.abstractions\u002Foutline",{"title":85,"path":86,"stem":87},"Sampler","\u002Fapi\u002Fabstractions\u002Fsampler","2.api\u002F1.abstractions\u002Fsampler",{"title":89,"path":90,"stem":91},"ScreenSizer","\u002Fapi\u002Fabstractions\u002Fscreen-sizer","2.api\u002F1.abstractions\u002Fscreen-sizer",{"title":93,"path":94,"stem":95},"ScreenSpace","\u002Fapi\u002Fabstractions\u002Fscreen-space","2.api\u002F1.abstractions\u002Fscreen-space",{"title":97,"path":98,"stem":99,"children":100},"Controls","\u002Fapi\u002Fcontrols","2.api\u002F2.controls\u002Findex",[101,102,106,110,114,118,122],{"title":97,"path":98,"stem":99},{"title":103,"path":104,"stem":105},"Camera Controls","\u002Fapi\u002Fcontrols\u002Fcamera-controls","2.api\u002F2.controls\u002Fcamera-controls",{"title":107,"path":108,"stem":109},"Keyboard Controls","\u002Fapi\u002Fcontrols\u002Fkeyboard-controls","2.api\u002F2.controls\u002Fkeyboard-controls",{"title":111,"path":112,"stem":113},"Map Controls","\u002Fapi\u002Fcontrols\u002Fmap-controls","2.api\u002F2.controls\u002Fmap-controls",{"title":115,"path":116,"stem":117},"Orbit Controls","\u002Fapi\u002Fcontrols\u002Forbit-controls","2.api\u002F2.controls\u002Forbit-controls",{"title":119,"path":120,"stem":121},"PointerLock Controls","\u002Fapi\u002Fcontrols\u002Fpointer-lock-controls","2.api\u002F2.controls\u002Fpointer-lock-controls",{"title":123,"path":124,"stem":125},"Transform Controls","\u002Fapi\u002Fcontrols\u002Ftransform-controls","2.api\u002F2.controls\u002Ftransform-controls",{"title":127,"path":128,"stem":129,"children":130},"Loaders","\u002Fapi\u002Floaders","2.api\u002F3.loaders\u002Findex",[131,132,136,140,144,148,152,156,160,164],{"title":127,"path":128,"stem":129},{"title":133,"path":134,"stem":135},"useGLTF","\u002Fapi\u002Floaders\u002Fuse-gltf","2.api\u002F3.loaders\u002F1.use-gltf",{"title":137,"path":138,"stem":139},"GLTFModel","\u002Fapi\u002Floaders\u002Fgltf-model","2.api\u002F3.loaders\u002F2.gltf-model",{"title":141,"path":142,"stem":143},"useFBX","\u002Fapi\u002Floaders\u002Fuse-fbx","2.api\u002F3.loaders\u002F3.use-fbx",{"title":145,"path":146,"stem":147},"FBXModel","\u002Fapi\u002Floaders\u002Ffbx-model","2.api\u002F3.loaders\u002F4.fbx-model",{"title":149,"path":150,"stem":151},"useTexture","\u002Fapi\u002Floaders\u002Fuse-texture","2.api\u002F3.loaders\u002F5.use-texture",{"title":153,"path":154,"stem":155},"useTextures","\u002Fapi\u002Floaders\u002Fuse-textures","2.api\u002F3.loaders\u002F6.use-textures",{"title":157,"path":158,"stem":159},"useSVG","\u002Fapi\u002Floaders\u002Fuse-svg","2.api\u002F3.loaders\u002F7.use-svg",{"title":161,"path":162,"stem":163},"useProgress","\u002Fapi\u002Floaders\u002Fuse-progress","2.api\u002F3.loaders\u002Fuse-progress",{"title":165,"path":166,"stem":167},"useVideoTexture","\u002Fapi\u002Floaders\u002Fuse-video-texture","2.api\u002F3.loaders\u002Fuse-video-texture",{"title":169,"path":170,"stem":171,"children":172},"Materials","\u002Fapi\u002Fmaterials","2.api\u002F4.materials\u002Findex",[173,174,178,182,186,190,194,198,202,206],{"title":169,"path":170,"stem":171},{"title":175,"path":176,"stem":177},"Custom Shader Material","\u002Fapi\u002Fmaterials\u002Fcustom-shader-material","2.api\u002F4.materials\u002Fcustom-shader-material",{"title":179,"path":180,"stem":181},"Mesh Glass Material","\u002Fapi\u002Fmaterials\u002Fglass-material","2.api\u002F4.materials\u002Fglass-material",{"title":183,"path":184,"stem":185},"Holographic Material","\u002Fapi\u002Fmaterials\u002Fholographic-material","2.api\u002F4.materials\u002Fholographic-material",{"title":187,"path":188,"stem":189},"Mesh Discard Material","\u002Fapi\u002Fmaterials\u002Fmesh-discard-material","2.api\u002F4.materials\u002Fmesh-discard-material",{"title":191,"path":192,"stem":193},"Mesh Portal Material","\u002Fapi\u002Fmaterials\u002Fmesh-portal-material","2.api\u002F4.materials\u002Fmesh-portal-material",{"title":195,"path":196,"stem":197},"Mesh Reflection Material","\u002Fapi\u002Fmaterials\u002Fmesh-reflection-material","2.api\u002F4.materials\u002Fmesh-reflection-material",{"title":199,"path":200,"stem":201},"Mesh Transmission Material","\u002Fapi\u002Fmaterials\u002Fmesh-transmission-material","2.api\u002F4.materials\u002Fmesh-transmission-material",{"title":203,"path":204,"stem":205},"Point Material","\u002Fapi\u002Fmaterials\u002Fpoint-material","2.api\u002F4.materials\u002Fpoint-material",{"title":207,"path":208,"stem":209},"Wobble Material","\u002Fapi\u002Fmaterials\u002Fwobble-material","2.api\u002F4.materials\u002Fwobble-material",{"title":211,"path":212,"stem":213,"children":214},"Shapes","\u002Fapi\u002Fshapes","2.api\u002F5.shapes\u002Findex",[215,216,220,224,228,232,236,240,244,248,252,256,260,264,268,272,276,280,284,288,292,296,300,304],{"title":211,"path":212,"stem":213},{"title":217,"path":218,"stem":219},"Box","\u002Fapi\u002Fshapes\u002Fbox","2.api\u002F5.shapes\u002Fbox",{"title":221,"path":222,"stem":223},"CatmullRomCurve3","\u002Fapi\u002Fshapes\u002Fcatmullromcurve3","2.api\u002F5.shapes\u002Fcatmullromcurve3",{"title":225,"path":226,"stem":227},"Circle","\u002Fapi\u002Fshapes\u002Fcircle","2.api\u002F5.shapes\u002Fcircle",{"title":229,"path":230,"stem":231},"Cone","\u002Fapi\u002Fshapes\u002Fcone","2.api\u002F5.shapes\u002Fcone",{"title":233,"path":234,"stem":235},"Cubic Bezier Line","\u002Fapi\u002Fshapes\u002Fcubic-bezier-line","2.api\u002F5.shapes\u002Fcubic-bezier-line",{"title":237,"path":238,"stem":239},"Cylinder","\u002Fapi\u002Fshapes\u002Fcylinder","2.api\u002F5.shapes\u002Fcylinder",{"title":241,"path":242,"stem":243},"Dodecahedron","\u002Fapi\u002Fshapes\u002Fdodecahedron","2.api\u002F5.shapes\u002Fdodecahedron",{"title":245,"path":246,"stem":247},"Grid","\u002Fapi\u002Fshapes\u002Fgrid","2.api\u002F5.shapes\u002Fgrid",{"title":249,"path":250,"stem":251},"Icosahedron","\u002Fapi\u002Fshapes\u002Ficosahedron","2.api\u002F5.shapes\u002Ficosahedron",{"title":253,"path":254,"stem":255},"Line2","\u002Fapi\u002Fshapes\u002Fline2","2.api\u002F5.shapes\u002Fline2",{"title":257,"path":258,"stem":259},"Octahedron","\u002Fapi\u002Fshapes\u002Foctahedron","2.api\u002F5.shapes\u002Foctahedron",{"title":261,"path":262,"stem":263},"Plane","\u002Fapi\u002Fshapes\u002Fplane","2.api\u002F5.shapes\u002Fplane",{"title":265,"path":266,"stem":267},"Quadratic Bezier Line","\u002Fapi\u002Fshapes\u002Fquadratic-bezier-line","2.api\u002F5.shapes\u002Fquadratic-bezier-line",{"title":269,"path":270,"stem":271},"Ring","\u002Fapi\u002Fshapes\u002Fring","2.api\u002F5.shapes\u002Fring",{"title":273,"path":274,"stem":275},"Rounded Box","\u002Fapi\u002Fshapes\u002Frounded-box","2.api\u002F5.shapes\u002Frounded-box",{"title":277,"path":278,"stem":279},"Rounded Plane","\u002Fapi\u002Fshapes\u002Frounded-plane","2.api\u002F5.shapes\u002Frounded-plane",{"title":281,"path":282,"stem":283},"Screen Quad","\u002Fapi\u002Fshapes\u002Fscreen-quad","2.api\u002F5.shapes\u002Fscreen-quad",{"title":285,"path":286,"stem":287},"Sphere","\u002Fapi\u002Fshapes\u002Fsphere","2.api\u002F5.shapes\u002Fsphere",{"title":289,"path":290,"stem":291},"Superformula","\u002Fapi\u002Fshapes\u002Fsuperformula","2.api\u002F5.shapes\u002Fsuperformula",{"title":293,"path":294,"stem":295},"Tetrahedron","\u002Fapi\u002Fshapes\u002Ftetrahedron","2.api\u002F5.shapes\u002Ftetrahedron",{"title":297,"path":298,"stem":299},"Torus","\u002Fapi\u002Fshapes\u002Ftorus","2.api\u002F5.shapes\u002Ftorus",{"title":301,"path":302,"stem":303},"Torus Knot","\u002Fapi\u002Fshapes\u002Ftorus-knot","2.api\u002F5.shapes\u002Ftorus-knot",{"title":305,"path":306,"stem":307},"Tube","\u002Fapi\u002Fshapes\u002Ftube","2.api\u002F5.shapes\u002Ftube",{"title":309,"path":310,"stem":311,"children":312},"Debug\u002FPerformance","\u002Fapi\u002Fdebug-performance","2.api\u002F6.debug-performance\u002Findex",[313,314,318,322,326,330],{"title":309,"path":310,"stem":311},{"title":315,"path":316,"stem":317},"Helper","\u002Fapi\u002Fdebug-performance\u002Fhelper","2.api\u002F6.debug-performance\u002Fhelper",{"title":319,"path":320,"stem":321},"LOD","\u002Fapi\u002Fdebug-performance\u002Flod","2.api\u002F6.debug-performance\u002Flod",{"title":323,"path":324,"stem":325},"Stats","\u002Fapi\u002Fdebug-performance\u002Fstats","2.api\u002F6.debug-performance\u002Fstats",{"title":327,"path":328,"stem":329},"StatsGl","\u002Fapi\u002Fdebug-performance\u002Fstats-gl","2.api\u002F6.debug-performance\u002Fstats-gl",{"title":331,"path":332,"stem":333},"useBVH","\u002Fapi\u002Fdebug-performance\u002Fuse-bvh","2.api\u002F6.debug-performance\u002Fuse-bvh",{"title":335,"path":336,"stem":337,"children":338},"Light\u002FShadow","\u002Fapi\u002Flight-shadow","2.api\u002F7.light-shadow\u002Findex",[339,340,344,348,352,356,360,364],{"title":335,"path":336,"stem":337},{"title":341,"path":342,"stem":343},"Accumulative Shadows","\u002Fapi\u002Flight-shadow\u002Faccumulative-shadows","2.api\u002F7.light-shadow\u002Faccumulative-shadows",{"title":345,"path":346,"stem":347},"Bake Shadows","\u002Fapi\u002Flight-shadow\u002Fbake-shadows","2.api\u002F7.light-shadow\u002Fbake-shadows",{"title":349,"path":350,"stem":351},"Circle Shadow","\u002Fapi\u002Flight-shadow\u002Fcircle-shadow","2.api\u002F7.light-shadow\u002Fcircle-shadow",{"title":353,"path":354,"stem":355},"Contact Shadows","\u002Fapi\u002Flight-shadow\u002Fcontact-shadows","2.api\u002F7.light-shadow\u002Fcontact-shadows",{"title":357,"path":358,"stem":359},"Lensflare","\u002Fapi\u002Flight-shadow\u002Flensflare","2.api\u002F7.light-shadow\u002Flensflare",{"title":361,"path":362,"stem":363},"Randomized Lights","\u002Fapi\u002Flight-shadow\u002Frandomized-lights","2.api\u002F7.light-shadow\u002Frandomized-lights",{"title":365,"path":366,"stem":367},"Soft Shadows","\u002Fapi\u002Flight-shadow\u002Fsoft-shadows","2.api\u002F7.light-shadow\u002Fsoft-shadows",{"title":369,"path":370,"stem":371,"children":372},"Staging","\u002Fapi\u002Fstaging","2.api\u002F8.staging\u002Findex",[373,374,378,382,386,390,394,398,402,406,410,414],{"title":369,"path":370,"stem":371},{"title":375,"path":376,"stem":377},"Environment","\u002Fapi\u002Fstaging\u002Fenvironment","2.api\u002F8.staging\u002F1.environment",{"title":379,"path":380,"stem":381},"useEnvironment","\u002Fapi\u002Fstaging\u002Fuse-environment","2.api\u002F8.staging\u002F2.use-environment",{"title":383,"path":384,"stem":385},"Lightformer","\u002Fapi\u002Fstaging\u002Flightformer","2.api\u002F8.staging\u002F3.lightformer",{"title":387,"path":388,"stem":389},"Backdrop","\u002Fapi\u002Fstaging\u002Fbackdrop","2.api\u002F8.staging\u002Fbackdrop",{"title":391,"path":392,"stem":393},"Ocean","\u002Fapi\u002Fstaging\u002Focean","2.api\u002F8.staging\u002Focean",{"title":395,"path":396,"stem":397},"Precipitation","\u002Fapi\u002Fstaging\u002Fprecipitation","2.api\u002F8.staging\u002Fprecipitation",{"title":399,"path":400,"stem":401},"Sky","\u002Fapi\u002Fstaging\u002Fsky","2.api\u002F8.staging\u002Fsky",{"title":403,"path":404,"stem":405},"Smoke","\u002Fapi\u002Fstaging\u002Fsmoke","2.api\u002F8.staging\u002Fsmoke",{"title":407,"path":408,"stem":409},"Sparkles","\u002Fapi\u002Fstaging\u002Fsparkles","2.api\u002F8.staging\u002Fsparkles",{"title":411,"path":412,"stem":413},"Stage","\u002Fapi\u002Fstaging\u002Fstage","2.api\u002F8.staging\u002Fstage",{"title":415,"path":416,"stem":417},"Stars","\u002Fapi\u002Fstaging\u002Fstars","2.api\u002F8.staging\u002Fstars",{"title":419,"path":420,"stem":421,"children":422},"Objects","\u002Fapi\u002Fobjects","2.api\u002F9.objects\u002Findex",[423,424,428,432,436,440,444,448,452,456,460],{"title":419,"path":420,"stem":421},{"title":425,"path":426,"stem":427},"AnimatedSprite","\u002Fapi\u002Fobjects\u002Fanimated-sprite","2.api\u002F9.objects\u002Fanimated-sprite",{"title":429,"path":430,"stem":431},"CubeCamera","\u002Fapi\u002Fobjects\u002Fcube-camera","2.api\u002F9.objects\u002Fcube-camera",{"title":433,"path":434,"stem":435},"Fbo","\u002Fapi\u002Fobjects\u002Ffbo","2.api\u002F9.objects\u002Ffbo",{"title":437,"path":438,"stem":439},"GradientTexture","\u002Fapi\u002Fobjects\u002Fgradient-texture","2.api\u002F9.objects\u002Fgradient-texture",{"title":441,"path":442,"stem":443},"HTML","\u002Fapi\u002Fobjects\u002Fhtml","2.api\u002F9.objects\u002Fhtml",{"title":445,"path":446,"stem":447},"Image","\u002Fapi\u002Fobjects\u002Fimage","2.api\u002F9.objects\u002Fimage",{"title":449,"path":450,"stem":451},"MarchingCubes","\u002Fapi\u002Fobjects\u002Fmarching-cubes","2.api\u002F9.objects\u002Fmarching-cubes",{"title":453,"path":454,"stem":455},"Reflector","\u002Fapi\u002Fobjects\u002Freflector","2.api\u002F9.objects\u002Freflector",{"title":457,"path":458,"stem":459},"Refractor","\u002Fapi\u002Fobjects\u002Frefractor","2.api\u002F9.objects\u002Frefractor",{"title":461,"path":462,"stem":463},"Text3D","\u002Fapi\u002Fobjects\u002Ftext-3d","2.api\u002F9.objects\u002Ftext-3d",{"title":465,"path":466,"stem":467,"children":468},"Miscellaneous","\u002Fapi\u002Fmiscellaneous","2.api\u002Fmiscellaneous\u002Findex",[469,470,474,478,482,486,490,494],{"title":465,"path":466,"stem":467},{"title":471,"path":472,"stem":473},"Bounds","\u002Fapi\u002Fmiscellaneous\u002Fbounds","2.api\u002Fmiscellaneous\u002Fbounds",{"title":475,"path":476,"stem":477},"GlobalAudio","\u002Fapi\u002Fmiscellaneous\u002Fglobal-audio","2.api\u002Fmiscellaneous\u002Fglobal-audio",{"title":479,"path":480,"stem":481},"MouseParallax","\u002Fapi\u002Fmiscellaneous\u002Fmouse-parallax","2.api\u002Fmiscellaneous\u002Fmouse-parallax",{"title":483,"path":484,"stem":485},"PositionalAudio","\u002Fapi\u002Fmiscellaneous\u002Fpositional-audio","2.api\u002Fmiscellaneous\u002Fpositional-audio",{"title":487,"path":488,"stem":489},"useAnimations","\u002Fapi\u002Fmiscellaneous\u002Fuse-animations","2.api\u002Fmiscellaneous\u002Fuse-animations",{"title":491,"path":492,"stem":493},"useGLTFExporter","\u002Fapi\u002Fmiscellaneous\u002Fuse-gltf-exporter","2.api\u002Fmiscellaneous\u002Fuse-gltf-exporter",{"title":495,"path":496,"stem":497},"useIntersect","\u002Fapi\u002Fmiscellaneous\u002Fuse-intersect","2.api\u002Fmiscellaneous\u002Fuse-intersect",{"id":499,"title":53,"body":500,"description":5841,"extension":5842,"links":5843,"meta":5844,"navigation":751,"path":54,"seo":5845,"stem":55,"__hash__":5846},"docs\u002F2.api\u002F1.abstractions\u002Fdecal.md",{"type":501,"value":502,"toc":5806},"minimark",[503,511,596,602,606,621,1170,1187,1191,1202,1371,1387,1390,1404,1456,1481,1485,1498,1503,1569,1576,1582,1599,1690,1695,1709,1784,2527,2532,2572,2585,2647,2650,2660,2746,2753,2773,2783,2786,2993,3005,3013,3028,3358,3362,3387,3778,3792,3812,3816,3832,4071,4077,4285,4291,4426,4435,4442,4498,4599,4604,4750,4755,4796,4800,4856,4860,4931,4935,5013,5020,5035,5076,5125,5802],[504,505,506,510],"p",{},[507,508,509],"code",{},"\u003CDecal>"," projects a flat texture onto the surface of a parent mesh,\nconforming to its geometry. Multiple decals can stack on the same mesh\nwith explicit z-layering, the JSON layout round-trips losslessly, and\nthe entry-by-entry shape stays human-readable.",[512,513,514,527,541,556,563,574,586],"ul",{},[515,516,517,518,522,523,526],"li",{},"🎨 Drop-in ",[519,520,521],"strong",{},"editor UI"," via ",[507,524,525],{},"\u003CDecalDebugUI>"," β€” placement, rotate \u002F scale \u002F snap, tint, flip, layers, undo \u002F redo, import \u002F export.",[515,528,529,530,522,533,540],{},"πŸ›  ",[519,531,532],{},"Programmatic API",[534,535,537],"a",{"href":536},"#programmatic-api-usedecaleditor",[507,538,539],{},"useDecalEditor()"," for custom panels and automation.",[515,542,543,544,547,548,551,552,555],{},"πŸ–ΌοΈ ",[519,545,546],{},"Texture palette"," β€” pass an array of ",[507,549,550],{},"Texture"," to ",[507,553,554],{},":map",".",[515,557,558,559,562],{},"🧩 ",[519,560,561],{},"Custom material"," β€” override the default via the slot.",[515,564,565,566,569,570,573],{},"πŸ’Ύ ",[519,567,568],{},"Lossless JSON"," β€” ",[507,571,572],{},"v-model:data"," round-trips to plain JSON.",[515,575,576,577,580,581,585],{},"⚑ ",[519,578,579],{},"BVH-accelerated"," β€” auto-detected via ",[534,582,583],{"href":332},[507,584,331],{},"; 10–100Γ— faster on dense meshes.",[515,587,588,589,569,592,595],{},"πŸ“š ",[519,590,591],{},"Per-mesh stacking",[507,593,594],{},"zIndex"," with automatic polygon-offset.",[597,598,599],"scene-wrapper",{},[600,601],"abstractions-decal",{},[603,604,15],"h2",{"id":605},"usage",[504,607,608,609,611,612,615,616,618,619,555],{},"The minimal setup is a ",[507,610,509],{}," placed as a child of any ",[507,613,614],{},"\u003CTresMesh>",",\nwith a JSON list of stamped decals bound via ",[507,617,572],{}," and one or\nmore textures via ",[507,620,554],{},[622,623,628],"pre",{"className":624,"code":625,"language":626,"meta":627,"style":627},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Cscript setup lang=\"ts\">\nimport { Decal, OrbitControls, useTexture } from '@tresjs\u002Fcientos'\nimport { TresCanvas } from '@tresjs\u002Fcore'\nimport { reactive } from 'vue'\n\nconst { state: texture } = useTexture('\u002Ftextures\u002Flogo.png')\n\nconst decals = reactive([\n {\n id: 'logo-1',\n position: [0, 0, 0.5],\n orientation: [0, 0, 0],\n size: [0.75, 0.17, 1],\n zIndex: 0,\n map: 'logo.png',\n },\n])\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n \u003CTresCanvas>\n \u003CTresPerspectiveCamera :position=\"[2, 2, 3]\" \u002F>\n \u003COrbitControls \u002F>\n \u003CTresMesh>\n \u003CTresBoxGeometry \u002F>\n \u003CTresMeshStandardMaterial color=\"white\" \u002F>\n \u003CDecal v-if=\"texture\" v-model:data=\"decals\" :map=\"texture\" \u002F>\n \u003C\u002FTresMesh>\n \u003C\u002FTresCanvas>\n\u003C\u002Ftemplate>\n","vue","",[507,629,630,665,705,726,746,753,793,798,813,819,837,867,891,918,930,947,953,959,969,974,984,995,1037,1047,1057,1068,1090,1141,1151,1161],{"__ignoreMap":627},[631,632,635,639,643,647,650,653,656,660,662],"span",{"class":633,"line":634},"line",1,[631,636,638],{"class":637},"sMK4o","\u003C",[631,640,642],{"class":641},"swJcz","script",[631,644,646],{"class":645},"spNyl"," setup",[631,648,649],{"class":645}," lang",[631,651,652],{"class":637},"=",[631,654,655],{"class":637},"\"",[631,657,659],{"class":658},"sfazB","ts",[631,661,655],{"class":637},[631,663,664],{"class":637},">\n",[631,666,668,672,675,679,682,685,687,690,693,696,699,702],{"class":633,"line":667},2,[631,669,671],{"class":670},"s7zQu","import",[631,673,674],{"class":637}," {",[631,676,678],{"class":677},"sTEyZ"," Decal",[631,680,681],{"class":637},",",[631,683,684],{"class":677}," OrbitControls",[631,686,681],{"class":637},[631,688,689],{"class":677}," useTexture",[631,691,692],{"class":637}," }",[631,694,695],{"class":670}," from",[631,697,698],{"class":637}," '",[631,700,701],{"class":658},"@tresjs\u002Fcientos",[631,703,704],{"class":637},"'\n",[631,706,708,710,712,715,717,719,721,724],{"class":633,"line":707},3,[631,709,671],{"class":670},[631,711,674],{"class":637},[631,713,714],{"class":677}," TresCanvas",[631,716,692],{"class":637},[631,718,695],{"class":670},[631,720,698],{"class":637},[631,722,723],{"class":658},"@tresjs\u002Fcore",[631,725,704],{"class":637},[631,727,729,731,733,736,738,740,742,744],{"class":633,"line":728},4,[631,730,671],{"class":670},[631,732,674],{"class":637},[631,734,735],{"class":677}," reactive",[631,737,692],{"class":637},[631,739,695],{"class":670},[631,741,698],{"class":637},[631,743,626],{"class":658},[631,745,704],{"class":637},[631,747,749],{"class":633,"line":748},5,[631,750,752],{"emptyLinePlaceholder":751},true,"\n",[631,754,756,759,761,764,767,770,773,776,779,782,785,788,790],{"class":633,"line":755},6,[631,757,758],{"class":645},"const",[631,760,674],{"class":637},[631,762,763],{"class":641}," state",[631,765,766],{"class":637},":",[631,768,769],{"class":677}," texture ",[631,771,772],{"class":637},"}",[631,774,775],{"class":637}," =",[631,777,689],{"class":778},"s2Zo4",[631,780,781],{"class":677},"(",[631,783,784],{"class":637},"'",[631,786,787],{"class":658},"\u002Ftextures\u002Flogo.png",[631,789,784],{"class":637},[631,791,792],{"class":677},")\n",[631,794,796],{"class":633,"line":795},7,[631,797,752],{"emptyLinePlaceholder":751},[631,799,801,803,806,808,810],{"class":633,"line":800},8,[631,802,758],{"class":645},[631,804,805],{"class":677}," decals ",[631,807,652],{"class":637},[631,809,735],{"class":778},[631,811,812],{"class":677},"([\n",[631,814,816],{"class":633,"line":815},9,[631,817,818],{"class":637}," {\n",[631,820,822,825,827,829,832,834],{"class":633,"line":821},10,[631,823,824],{"class":641}," id",[631,826,766],{"class":637},[631,828,698],{"class":637},[631,830,831],{"class":658},"logo-1",[631,833,784],{"class":637},[631,835,836],{"class":637},",\n",[631,838,840,843,845,848,852,854,857,859,862,865],{"class":633,"line":839},11,[631,841,842],{"class":641}," position",[631,844,766],{"class":637},[631,846,847],{"class":677}," [",[631,849,851],{"class":850},"sbssI","0",[631,853,681],{"class":637},[631,855,856],{"class":850}," 0",[631,858,681],{"class":637},[631,860,861],{"class":850}," 0.5",[631,863,864],{"class":677},"]",[631,866,836],{"class":637},[631,868,870,873,875,877,879,881,883,885,887,889],{"class":633,"line":869},12,[631,871,872],{"class":641}," orientation",[631,874,766],{"class":637},[631,876,847],{"class":677},[631,878,851],{"class":850},[631,880,681],{"class":637},[631,882,856],{"class":850},[631,884,681],{"class":637},[631,886,856],{"class":850},[631,888,864],{"class":677},[631,890,836],{"class":637},[631,892,894,897,899,901,904,906,909,911,914,916],{"class":633,"line":893},13,[631,895,896],{"class":641}," size",[631,898,766],{"class":637},[631,900,847],{"class":677},[631,902,903],{"class":850},"0.75",[631,905,681],{"class":637},[631,907,908],{"class":850}," 0.17",[631,910,681],{"class":637},[631,912,913],{"class":850}," 1",[631,915,864],{"class":677},[631,917,836],{"class":637},[631,919,921,924,926,928],{"class":633,"line":920},14,[631,922,923],{"class":641}," zIndex",[631,925,766],{"class":637},[631,927,856],{"class":850},[631,929,836],{"class":637},[631,931,933,936,938,940,943,945],{"class":633,"line":932},15,[631,934,935],{"class":641}," map",[631,937,766],{"class":637},[631,939,698],{"class":637},[631,941,942],{"class":658},"logo.png",[631,944,784],{"class":637},[631,946,836],{"class":637},[631,948,950],{"class":633,"line":949},16,[631,951,952],{"class":637}," },\n",[631,954,956],{"class":633,"line":955},17,[631,957,958],{"class":677},"])\n",[631,960,962,965,967],{"class":633,"line":961},18,[631,963,964],{"class":637},"\u003C\u002F",[631,966,642],{"class":641},[631,968,664],{"class":637},[631,970,972],{"class":633,"line":971},19,[631,973,752],{"emptyLinePlaceholder":751},[631,975,977,979,982],{"class":633,"line":976},20,[631,978,638],{"class":637},[631,980,981],{"class":641},"template",[631,983,664],{"class":637},[631,985,987,990,993],{"class":633,"line":986},21,[631,988,989],{"class":637}," \u003C",[631,991,992],{"class":641},"TresCanvas",[631,994,664],{"class":637},[631,996,998,1001,1004,1007,1010,1012,1014,1017,1020,1023,1025,1027,1030,1032,1034],{"class":633,"line":997},22,[631,999,1000],{"class":637}," \u003C",[631,1002,1003],{"class":641},"TresPerspectiveCamera",[631,1005,1006],{"class":637}," :",[631,1008,1009],{"class":645},"position",[631,1011,652],{"class":637},[631,1013,655],{"class":637},[631,1015,1016],{"class":637},"[",[631,1018,1019],{"class":850},"2",[631,1021,1022],{"class":637},", ",[631,1024,1019],{"class":850},[631,1026,1022],{"class":637},[631,1028,1029],{"class":850},"3",[631,1031,864],{"class":637},[631,1033,655],{"class":637},[631,1035,1036],{"class":637}," \u002F>\n",[631,1038,1040,1042,1045],{"class":633,"line":1039},23,[631,1041,1000],{"class":637},[631,1043,1044],{"class":641},"OrbitControls",[631,1046,1036],{"class":637},[631,1048,1050,1052,1055],{"class":633,"line":1049},24,[631,1051,1000],{"class":637},[631,1053,1054],{"class":641},"TresMesh",[631,1056,664],{"class":637},[631,1058,1060,1063,1066],{"class":633,"line":1059},25,[631,1061,1062],{"class":637}," \u003C",[631,1064,1065],{"class":641},"TresBoxGeometry",[631,1067,1036],{"class":637},[631,1069,1071,1073,1076,1079,1081,1083,1086,1088],{"class":633,"line":1070},26,[631,1072,1062],{"class":637},[631,1074,1075],{"class":641},"TresMeshStandardMaterial",[631,1077,1078],{"class":645}," color",[631,1080,652],{"class":637},[631,1082,655],{"class":637},[631,1084,1085],{"class":658},"white",[631,1087,655],{"class":637},[631,1089,1036],{"class":637},[631,1091,1093,1095,1097,1100,1102,1104,1107,1109,1112,1114,1117,1119,1121,1124,1126,1128,1131,1133,1135,1137,1139],{"class":633,"line":1092},27,[631,1094,1062],{"class":637},[631,1096,53],{"class":641},[631,1098,1099],{"class":670}," v-if",[631,1101,652],{"class":637},[631,1103,655],{"class":637},[631,1105,1106],{"class":677},"texture",[631,1108,655],{"class":637},[631,1110,1111],{"class":645}," v-model",[631,1113,766],{"class":637},[631,1115,1116],{"class":645},"data",[631,1118,652],{"class":637},[631,1120,655],{"class":637},[631,1122,1123],{"class":677},"decals",[631,1125,655],{"class":637},[631,1127,1006],{"class":637},[631,1129,1130],{"class":645},"map",[631,1132,652],{"class":637},[631,1134,655],{"class":637},[631,1136,1106],{"class":677},[631,1138,655],{"class":637},[631,1140,1036],{"class":637},[631,1142,1144,1147,1149],{"class":633,"line":1143},28,[631,1145,1146],{"class":637}," \u003C\u002F",[631,1148,1054],{"class":641},[631,1150,664],{"class":637},[631,1152,1154,1157,1159],{"class":633,"line":1153},29,[631,1155,1156],{"class":637}," \u003C\u002F",[631,1158,992],{"class":641},[631,1160,664],{"class":637},[631,1162,1164,1166,1168],{"class":633,"line":1163},30,[631,1165,964],{"class":637},[631,1167,981],{"class":641},[631,1169,664],{"class":637},[1171,1172,1173],"prose-note",{},[504,1174,1175,1176,1178,1179,1182,1183,1186],{},"The ",[507,1177,572],{}," array is the ",[519,1180,1181],{},"single source of truth"," β€” every\ndecal you can see lives in it. It serializes to plain JSON so you can\nsave \u002F load it from a backend, localStorage, or a ",[507,1184,1185],{},".json"," file.",[603,1188,1190],{"id":1189},"multiple-textures-palette","Multiple textures (palette)",[504,1192,1193,1194,1196,1197,1201],{},"Pass an array to ",[507,1195,554],{}," to give users a palette of textures to pick\nfrom. The array returned by ",[534,1198,1199],{"href":154},[507,1200,153],{},"\nplugs in directly:",[622,1203,1205],{"className":624,"code":1204,"language":626,"meta":627,"style":627},"\u003Cscript setup lang=\"ts\">\nimport { Decal, useTextures } from '@tresjs\u002Fcientos'\n\nconst { textures } = useTextures([\n '\u002Ftextures\u002Flogo.png',\n '\u002Ftextures\u002Fbadge.png',\n '\u002Ftextures\u002Fsticker.png',\n])\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n \u003CDecal v-model:data=\"decals\" :map=\"textures\" \u002F>\n\u003C\u002Ftemplate>\n",[507,1206,1207,1227,1250,1254,1271,1282,1293,1304,1308,1316,1320,1328,1363],{"__ignoreMap":627},[631,1208,1209,1211,1213,1215,1217,1219,1221,1223,1225],{"class":633,"line":634},[631,1210,638],{"class":637},[631,1212,642],{"class":641},[631,1214,646],{"class":645},[631,1216,649],{"class":645},[631,1218,652],{"class":637},[631,1220,655],{"class":637},[631,1222,659],{"class":658},[631,1224,655],{"class":637},[631,1226,664],{"class":637},[631,1228,1229,1231,1233,1235,1237,1240,1242,1244,1246,1248],{"class":633,"line":667},[631,1230,671],{"class":670},[631,1232,674],{"class":637},[631,1234,678],{"class":677},[631,1236,681],{"class":637},[631,1238,1239],{"class":677}," useTextures",[631,1241,692],{"class":637},[631,1243,695],{"class":670},[631,1245,698],{"class":637},[631,1247,701],{"class":658},[631,1249,704],{"class":637},[631,1251,1252],{"class":633,"line":707},[631,1253,752],{"emptyLinePlaceholder":751},[631,1255,1256,1258,1260,1263,1265,1267,1269],{"class":633,"line":728},[631,1257,758],{"class":645},[631,1259,674],{"class":637},[631,1261,1262],{"class":677}," textures ",[631,1264,772],{"class":637},[631,1266,775],{"class":637},[631,1268,1239],{"class":778},[631,1270,812],{"class":677},[631,1272,1273,1276,1278,1280],{"class":633,"line":748},[631,1274,1275],{"class":637}," '",[631,1277,787],{"class":658},[631,1279,784],{"class":637},[631,1281,836],{"class":637},[631,1283,1284,1286,1289,1291],{"class":633,"line":755},[631,1285,1275],{"class":637},[631,1287,1288],{"class":658},"\u002Ftextures\u002Fbadge.png",[631,1290,784],{"class":637},[631,1292,836],{"class":637},[631,1294,1295,1297,1300,1302],{"class":633,"line":795},[631,1296,1275],{"class":637},[631,1298,1299],{"class":658},"\u002Ftextures\u002Fsticker.png",[631,1301,784],{"class":637},[631,1303,836],{"class":637},[631,1305,1306],{"class":633,"line":800},[631,1307,958],{"class":677},[631,1309,1310,1312,1314],{"class":633,"line":815},[631,1311,964],{"class":637},[631,1313,642],{"class":641},[631,1315,664],{"class":637},[631,1317,1318],{"class":633,"line":821},[631,1319,752],{"emptyLinePlaceholder":751},[631,1321,1322,1324,1326],{"class":633,"line":839},[631,1323,638],{"class":637},[631,1325,981],{"class":641},[631,1327,664],{"class":637},[631,1329,1330,1332,1334,1336,1338,1340,1342,1344,1346,1348,1350,1352,1354,1356,1359,1361],{"class":633,"line":869},[631,1331,989],{"class":637},[631,1333,53],{"class":641},[631,1335,1111],{"class":645},[631,1337,766],{"class":637},[631,1339,1116],{"class":645},[631,1341,652],{"class":637},[631,1343,655],{"class":637},[631,1345,1123],{"class":677},[631,1347,655],{"class":637},[631,1349,1006],{"class":637},[631,1351,1130],{"class":645},[631,1353,652],{"class":637},[631,1355,655],{"class":637},[631,1357,1358],{"class":677},"textures",[631,1360,655],{"class":637},[631,1362,1036],{"class":637},[631,1364,1365,1367,1369],{"class":633,"line":893},[631,1366,964],{"class":637},[631,1368,981],{"class":641},[631,1370,664],{"class":637},[504,1372,1373,1374,569,1377,1379,1380,1383,1384,1386],{},"Each entry references its texture by ",[507,1375,1376],{},"name",[507,1378,509],{}," auto-fills\n",[507,1381,1382],{},"texture.name"," from the URL filename when missing, so JSON ",[507,1385,1130],{},"\nfields round-trip cleanly.",[603,1388,561],{"id":1389},"custom-material",[504,1391,1392,1393,1396,1397,836,1400,1403],{},"The default material is ",[507,1394,1395],{},"MeshBasicMaterial",". Override it via the slot\nto plug in any Three.js material β€” ",[507,1398,1399],{},"MeshStandardMaterial",[507,1401,1402],{},"MeshPhysicalMaterial",", or a custom shader.",[622,1405,1407],{"className":624,"code":1406,"language":626,"meta":627,"style":627},"\u003CDecal v-model:data=\"decals\" :map=\"texture\">\n \u003CTresMeshStandardMaterial :transparent=\"true\" :polygon-offset=\"true\" \u002F>\n\u003C\u002FDecal>\n",[507,1408,1409,1443,1448],{"__ignoreMap":627},[631,1410,1411,1413,1415,1417,1419,1421,1423,1425,1427,1429,1431,1433,1435,1437,1439,1441],{"class":633,"line":634},[631,1412,638],{"class":637},[631,1414,53],{"class":641},[631,1416,1111],{"class":645},[631,1418,766],{"class":637},[631,1420,1116],{"class":645},[631,1422,652],{"class":637},[631,1424,655],{"class":637},[631,1426,1123],{"class":677},[631,1428,655],{"class":637},[631,1430,1006],{"class":637},[631,1432,1130],{"class":645},[631,1434,652],{"class":637},[631,1436,655],{"class":637},[631,1438,1106],{"class":677},[631,1440,655],{"class":637},[631,1442,664],{"class":637},[631,1444,1445],{"class":633,"line":667},[631,1446,1447],{"class":677}," \u003CTresMeshStandardMaterial :transparent=\"true\" :polygon-offset=\"true\" \u002F>\n",[631,1449,1450,1452,1454],{"class":633,"line":707},[631,1451,964],{"class":637},[631,1453,53],{"class":641},[631,1455,664],{"class":637},[1171,1457,1458],{},[504,1459,1460,1461,1464,1465,1468,1469,1464,1472,1475,1476,836,1478,1480],{},"Keep ",[507,1462,1463],{},"transparent: true"," and ",[507,1466,1467],{},"polygonOffset: true"," on any custom\nmaterial, otherwise stacking and alpha handling won't work as expected.\nColor \u002F opacity tint from the editor only applies to materials\nexposing ",[507,1470,1471],{},".color",[507,1473,1474],{},".opacity"," (",[507,1477,1395],{},[507,1479,1399],{},", …) β€” bespoke shader materials are skipped\nsilently.",[603,1482,1484],{"id":1483},"stacking-decals-z-layering","Stacking decals (z-layering)",[504,1486,1487,1488,1490,1491,1494,1495,555],{},"Each decal has a ",[507,1489,594],{}," controlling its draw order on the parent\nmesh. Higher = on top. The component handles z-fighting via\n",[507,1492,1493],{},"polygonOffset"," automatically β€” but if you stack many decals near\nparallel surfaces and still see flicker, raise ",[507,1496,1497],{},"layerGap",[597,1499,1500],{},[1501,1502],"abstractions-decal-stacking",{},[622,1504,1506],{"className":624,"code":1505,"language":626,"meta":627,"style":627},"\u003CDecal\n v-model:data=\"decals\"\n :map=\"textures\"\n :layer-gap=\"0.002\"\n\u002F>\n",[507,1507,1508,1515,1533,1548,1564],{"__ignoreMap":627},[631,1509,1510,1512],{"class":633,"line":634},[631,1511,638],{"class":637},[631,1513,1514],{"class":641},"Decal\n",[631,1516,1517,1520,1522,1524,1526,1528,1530],{"class":633,"line":667},[631,1518,1519],{"class":645}," v-model",[631,1521,766],{"class":637},[631,1523,1116],{"class":645},[631,1525,652],{"class":637},[631,1527,655],{"class":637},[631,1529,1123],{"class":677},[631,1531,1532],{"class":637},"\"\n",[631,1534,1535,1538,1540,1542,1544,1546],{"class":633,"line":707},[631,1536,1537],{"class":637}," :",[631,1539,1130],{"class":645},[631,1541,652],{"class":637},[631,1543,655],{"class":637},[631,1545,1358],{"class":677},[631,1547,1532],{"class":637},[631,1549,1550,1552,1555,1557,1559,1562],{"class":633,"line":728},[631,1551,1537],{"class":637},[631,1553,1554],{"class":645},"layer-gap",[631,1556,652],{"class":637},[631,1558,655],{"class":637},[631,1560,1561],{"class":850},"0.002",[631,1563,1532],{"class":637},[631,1565,1566],{"class":633,"line":748},[631,1567,1568],{"class":677},"\u002F>\n",[504,1570,1571,1572,1575],{},"zIndex stacks are ",[519,1573,1574],{},"per-mesh"," β€” two decals on different meshes never\ncompete for the same layer slot.",[603,1577,1579,1580],{"id":1578},"editable-mode-decaldebugui","Editable mode + ",[507,1581,525],{},[504,1583,1584,1585,1588,1589,1591,1592,1595,1596,555],{},"Add the ",[507,1586,1587],{},"editable"," prop to mount the interactive editor, then pair it\nwith ",[507,1590,525],{}," β€” a full in-canvas editor that ships as a drop-in\nHTML overlay sitting ",[519,1593,1594],{},"outside"," ",[507,1597,1598],{},"\u003CTresCanvas>",[1600,1601,1602,1616,1639],"prose-warning",{},[504,1603,1604,1606,1607,1610,1611,1613,1614,555],{},[507,1605,525],{}," needs its stylesheet β€” import it ",[519,1608,1609],{},"once"," at your app\nentry. ",[507,1612,509],{}," itself is style-less, so this is only needed when you\nmount ",[507,1615,525],{},[622,1617,1620],{"className":1618,"code":1619,"language":659,"meta":627,"style":627},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u002F\u002F Vite \u002F Vue β€” in main.ts\nimport '@tresjs\u002Fcientos\u002Fstyles.css'\n",[507,1621,1622,1628],{"__ignoreMap":627},[631,1623,1624],{"class":633,"line":634},[631,1625,1627],{"class":1626},"sHwdD","\u002F\u002F Vite \u002F Vue β€” in main.ts\n",[631,1629,1630,1632,1634,1637],{"class":633,"line":667},[631,1631,671],{"class":670},[631,1633,698],{"class":637},[631,1635,1636],{"class":658},"@tresjs\u002Fcientos\u002Fstyles.css",[631,1638,704],{"class":637},[622,1640,1642],{"className":1618,"code":1641,"language":659,"meta":627,"style":627},"\u002F\u002F Nuxt β€” in nuxt.config.ts\nexport default defineNuxtConfig({\n css: ['@tresjs\u002Fcientos\u002Fstyles.css'],\n})\n",[507,1643,1644,1649,1665,1684],{"__ignoreMap":627},[631,1645,1646],{"class":633,"line":634},[631,1647,1648],{"class":1626},"\u002F\u002F Nuxt β€” in nuxt.config.ts\n",[631,1650,1651,1654,1657,1660,1662],{"class":633,"line":667},[631,1652,1653],{"class":670},"export",[631,1655,1656],{"class":670}," default",[631,1658,1659],{"class":778}," defineNuxtConfig",[631,1661,781],{"class":677},[631,1663,1664],{"class":637},"{\n",[631,1666,1667,1670,1672,1674,1676,1678,1680,1682],{"class":633,"line":707},[631,1668,1669],{"class":641}," css",[631,1671,766],{"class":637},[631,1673,847],{"class":677},[631,1675,784],{"class":637},[631,1677,1636],{"class":658},[631,1679,784],{"class":637},[631,1681,864],{"class":677},[631,1683,836],{"class":637},[631,1685,1686,1688],{"class":633,"line":728},[631,1687,772],{"class":637},[631,1689,792],{"class":677},[597,1691,1692],{},[1693,1694],"abstractions-decal-editable",{},[504,1696,1697,1698,1701,1702,1705,1706,555],{},"Three panels: a floating ",[519,1699,1700],{},"handle"," anchored to the editing decal, a\nbottom ",[519,1703,1704],{},"dock"," (texture picker + edit tools), a right-side ",[519,1707,1708],{},"layer\npanel",[512,1710,1711,1721,1726,1732,1745,1750,1755,1761,1767,1773,1779],{},[515,1712,1713,1716,1717,1720],{},[519,1714,1715],{},"Floating handle"," (rotate + scale + snap + live ",[507,1718,1719],{},"scale% Β· rotationΒ° Β· L\u003Cn>"," badge)",[515,1722,1723],{},[519,1724,1725],{},"Color tint & opacity",[515,1727,1728,1731],{},[519,1729,1730],{},"Mirror"," (flip X \u002F flip Y)",[515,1733,1734,1475,1737,1740,1741,1744],{},[519,1735,1736],{},"Layer controls",[507,1738,1739],{},"L+"," \u002F ",[507,1742,1743],{},"L-",")",[515,1746,1747],{},[519,1748,1749],{},"Visibility toggle",[515,1751,1752],{},[519,1753,1754],{},"Per-row remove",[515,1756,1757,1760],{},[519,1758,1759],{},"Layer panel"," (mesh-grouped, drag-to-reorder)",[515,1762,1763,1766],{},[519,1764,1765],{},"Texture picker"," (drag or click-to-arm)",[515,1768,1769,1772],{},[519,1770,1771],{},"Mode badge"," (placing \u002F editing status)",[515,1774,1775,1778],{},[519,1776,1777],{},"Undo \u002F Redo"," buttons",[515,1780,1781,1778],{},[519,1782,1783],{},"Import \u002F Export",[622,1785,1787],{"className":624,"code":1786,"language":626,"meta":627,"style":627},"\u003Cscript setup lang=\"ts\">\nimport { Decal, DecalDebugUI, OrbitControls, useTextures } from '@tresjs\u002Fcientos'\nimport type { DecalEditorSession, DecalJsonEntry } from '@tresjs\u002Fcientos'\nimport { TresCanvas } from '@tresjs\u002Fcore'\nimport { computed, reactive, shallowRef } from 'vue'\n\nconst { textures } = useTextures(['\u002Ftextures\u002Fa.png', '\u002Ftextures\u002Fb.png'])\n\nconst layout = reactive\u003CRecord\u003Cstring, DecalJsonEntry[]>>({\n cube: [],\n sphere: [],\n})\n\nconst decalRef = shallowRef\u003C{ editor: DecalEditorSession } | null>(null)\nconst session = computed(() => decalRef.value?.editor ?? null)\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n \u003CDecalDebugUI :session=\"session\" :textures=\"textures ?? []\" :data=\"layout\" \u002F>\n\n \u003CTresCanvas>\n \u003CTresPerspectiveCamera :position=\"[2, 2, 4]\" \u002F>\n \u003COrbitControls \u002F>\n\n \u003CTresMesh name=\"cube\" :position=\"[-1.2, 0, 0]\">\n \u003CTresBoxGeometry \u002F>\n \u003CTresMeshStandardMaterial color=\"white\" \u002F>\n \u003CDecal ref=\"decalRef\" v-model:data=\"layout.cube\" :map=\"textures\" editable \u002F>\n \u003C\u002FTresMesh>\n\n \u003CTresMesh name=\"sphere\" :position=\"[1.2, 0, 0]\">\n \u003CTresSphereGeometry :args=\"[0.7]\" \u002F>\n \u003CTresMeshStandardMaterial color=\"white\" \u002F>\n \u003CDecal v-model:data=\"layout.sphere\" :map=\"textures\" editable \u002F>\n \u003C\u002FTresMesh>\n \u003C\u002FTresCanvas>\n\u003C\u002Ftemplate>\n",[507,1788,1789,1809,1840,1867,1885,1913,1917,1952,1956,1992,2004,2015,2021,2025,2064,2104,2112,2116,2124,2174,2178,2186,2219,2227,2231,2277,2285,2303,2356,2364,2368,2412,2440,2459,2500,2509,2518],{"__ignoreMap":627},[631,1790,1791,1793,1795,1797,1799,1801,1803,1805,1807],{"class":633,"line":634},[631,1792,638],{"class":637},[631,1794,642],{"class":641},[631,1796,646],{"class":645},[631,1798,649],{"class":645},[631,1800,652],{"class":637},[631,1802,655],{"class":637},[631,1804,659],{"class":658},[631,1806,655],{"class":637},[631,1808,664],{"class":637},[631,1810,1811,1813,1815,1817,1819,1822,1824,1826,1828,1830,1832,1834,1836,1838],{"class":633,"line":667},[631,1812,671],{"class":670},[631,1814,674],{"class":637},[631,1816,678],{"class":677},[631,1818,681],{"class":637},[631,1820,1821],{"class":677}," DecalDebugUI",[631,1823,681],{"class":637},[631,1825,684],{"class":677},[631,1827,681],{"class":637},[631,1829,1239],{"class":677},[631,1831,692],{"class":637},[631,1833,695],{"class":670},[631,1835,698],{"class":637},[631,1837,701],{"class":658},[631,1839,704],{"class":637},[631,1841,1842,1844,1847,1849,1852,1854,1857,1859,1861,1863,1865],{"class":633,"line":707},[631,1843,671],{"class":670},[631,1845,1846],{"class":670}," type",[631,1848,674],{"class":637},[631,1850,1851],{"class":677}," DecalEditorSession",[631,1853,681],{"class":637},[631,1855,1856],{"class":677}," DecalJsonEntry",[631,1858,692],{"class":637},[631,1860,695],{"class":670},[631,1862,698],{"class":637},[631,1864,701],{"class":658},[631,1866,704],{"class":637},[631,1868,1869,1871,1873,1875,1877,1879,1881,1883],{"class":633,"line":728},[631,1870,671],{"class":670},[631,1872,674],{"class":637},[631,1874,714],{"class":677},[631,1876,692],{"class":637},[631,1878,695],{"class":670},[631,1880,698],{"class":637},[631,1882,723],{"class":658},[631,1884,704],{"class":637},[631,1886,1887,1889,1891,1894,1896,1898,1900,1903,1905,1907,1909,1911],{"class":633,"line":748},[631,1888,671],{"class":670},[631,1890,674],{"class":637},[631,1892,1893],{"class":677}," computed",[631,1895,681],{"class":637},[631,1897,735],{"class":677},[631,1899,681],{"class":637},[631,1901,1902],{"class":677}," shallowRef",[631,1904,692],{"class":637},[631,1906,695],{"class":670},[631,1908,698],{"class":637},[631,1910,626],{"class":658},[631,1912,704],{"class":637},[631,1914,1915],{"class":633,"line":755},[631,1916,752],{"emptyLinePlaceholder":751},[631,1918,1919,1921,1923,1925,1927,1929,1931,1934,1936,1939,1941,1943,1945,1948,1950],{"class":633,"line":795},[631,1920,758],{"class":645},[631,1922,674],{"class":637},[631,1924,1262],{"class":677},[631,1926,772],{"class":637},[631,1928,775],{"class":637},[631,1930,1239],{"class":778},[631,1932,1933],{"class":677},"([",[631,1935,784],{"class":637},[631,1937,1938],{"class":658},"\u002Ftextures\u002Fa.png",[631,1940,784],{"class":637},[631,1942,681],{"class":637},[631,1944,698],{"class":637},[631,1946,1947],{"class":658},"\u002Ftextures\u002Fb.png",[631,1949,784],{"class":637},[631,1951,958],{"class":677},[631,1953,1954],{"class":633,"line":800},[631,1955,752],{"emptyLinePlaceholder":751},[631,1957,1958,1960,1963,1965,1967,1969,1973,1975,1978,1980,1982,1985,1988,1990],{"class":633,"line":815},[631,1959,758],{"class":645},[631,1961,1962],{"class":677}," layout ",[631,1964,652],{"class":637},[631,1966,735],{"class":778},[631,1968,638],{"class":637},[631,1970,1972],{"class":1971},"sBMFI","Record",[631,1974,638],{"class":637},[631,1976,1977],{"class":1971},"string",[631,1979,681],{"class":637},[631,1981,1856],{"class":1971},[631,1983,1984],{"class":677},"[]",[631,1986,1987],{"class":637},">>",[631,1989,781],{"class":677},[631,1991,1664],{"class":637},[631,1993,1994,1997,1999,2002],{"class":633,"line":821},[631,1995,1996],{"class":641}," cube",[631,1998,766],{"class":637},[631,2000,2001],{"class":677}," []",[631,2003,836],{"class":637},[631,2005,2006,2009,2011,2013],{"class":633,"line":839},[631,2007,2008],{"class":641}," sphere",[631,2010,766],{"class":637},[631,2012,2001],{"class":677},[631,2014,836],{"class":637},[631,2016,2017,2019],{"class":633,"line":869},[631,2018,772],{"class":637},[631,2020,792],{"class":677},[631,2022,2023],{"class":633,"line":893},[631,2024,752],{"emptyLinePlaceholder":751},[631,2026,2027,2029,2032,2034,2036,2039,2042,2044,2046,2048,2051,2054,2057,2059,2062],{"class":633,"line":920},[631,2028,758],{"class":645},[631,2030,2031],{"class":677}," decalRef ",[631,2033,652],{"class":637},[631,2035,1902],{"class":778},[631,2037,2038],{"class":637},"\u003C{",[631,2040,2041],{"class":641}," editor",[631,2043,766],{"class":637},[631,2045,1851],{"class":1971},[631,2047,692],{"class":637},[631,2049,2050],{"class":637}," |",[631,2052,2053],{"class":1971}," null",[631,2055,2056],{"class":637},">",[631,2058,781],{"class":677},[631,2060,2061],{"class":637},"null",[631,2063,792],{"class":677},[631,2065,2066,2068,2071,2073,2075,2077,2080,2083,2086,2088,2091,2094,2097,2100,2102],{"class":633,"line":932},[631,2067,758],{"class":645},[631,2069,2070],{"class":677}," session ",[631,2072,652],{"class":637},[631,2074,1893],{"class":778},[631,2076,781],{"class":677},[631,2078,2079],{"class":637},"()",[631,2081,2082],{"class":645}," =>",[631,2084,2085],{"class":677}," decalRef",[631,2087,555],{"class":637},[631,2089,2090],{"class":677},"value",[631,2092,2093],{"class":637},"?.",[631,2095,2096],{"class":677},"editor ",[631,2098,2099],{"class":637},"??",[631,2101,2053],{"class":637},[631,2103,792],{"class":677},[631,2105,2106,2108,2110],{"class":633,"line":949},[631,2107,964],{"class":637},[631,2109,642],{"class":641},[631,2111,664],{"class":637},[631,2113,2114],{"class":633,"line":955},[631,2115,752],{"emptyLinePlaceholder":751},[631,2117,2118,2120,2122],{"class":633,"line":961},[631,2119,638],{"class":637},[631,2121,981],{"class":641},[631,2123,664],{"class":637},[631,2125,2126,2128,2131,2133,2136,2138,2140,2142,2144,2146,2148,2150,2152,2154,2157,2159,2161,2163,2165,2167,2170,2172],{"class":633,"line":971},[631,2127,989],{"class":637},[631,2129,2130],{"class":641},"DecalDebugUI",[631,2132,1006],{"class":637},[631,2134,2135],{"class":645},"session",[631,2137,652],{"class":637},[631,2139,655],{"class":637},[631,2141,2135],{"class":677},[631,2143,655],{"class":637},[631,2145,1006],{"class":637},[631,2147,1358],{"class":645},[631,2149,652],{"class":637},[631,2151,655],{"class":637},[631,2153,1358],{"class":677},[631,2155,2156],{"class":637}," ?? []",[631,2158,655],{"class":637},[631,2160,1006],{"class":637},[631,2162,1116],{"class":645},[631,2164,652],{"class":637},[631,2166,655],{"class":637},[631,2168,2169],{"class":677},"layout",[631,2171,655],{"class":637},[631,2173,1036],{"class":637},[631,2175,2176],{"class":633,"line":976},[631,2177,752],{"emptyLinePlaceholder":751},[631,2179,2180,2182,2184],{"class":633,"line":986},[631,2181,989],{"class":637},[631,2183,992],{"class":641},[631,2185,664],{"class":637},[631,2187,2188,2190,2192,2194,2196,2198,2200,2202,2204,2206,2208,2210,2213,2215,2217],{"class":633,"line":997},[631,2189,1000],{"class":637},[631,2191,1003],{"class":641},[631,2193,1006],{"class":637},[631,2195,1009],{"class":645},[631,2197,652],{"class":637},[631,2199,655],{"class":637},[631,2201,1016],{"class":637},[631,2203,1019],{"class":850},[631,2205,1022],{"class":637},[631,2207,1019],{"class":850},[631,2209,1022],{"class":637},[631,2211,2212],{"class":850},"4",[631,2214,864],{"class":637},[631,2216,655],{"class":637},[631,2218,1036],{"class":637},[631,2220,2221,2223,2225],{"class":633,"line":1039},[631,2222,1000],{"class":637},[631,2224,1044],{"class":641},[631,2226,1036],{"class":637},[631,2228,2229],{"class":633,"line":1049},[631,2230,752],{"emptyLinePlaceholder":751},[631,2232,2233,2235,2237,2240,2242,2244,2247,2249,2251,2253,2255,2257,2260,2263,2265,2267,2269,2271,2273,2275],{"class":633,"line":1059},[631,2234,1000],{"class":637},[631,2236,1054],{"class":641},[631,2238,2239],{"class":645}," name",[631,2241,652],{"class":637},[631,2243,655],{"class":637},[631,2245,2246],{"class":658},"cube",[631,2248,655],{"class":637},[631,2250,1006],{"class":637},[631,2252,1009],{"class":645},[631,2254,652],{"class":637},[631,2256,655],{"class":637},[631,2258,2259],{"class":637},"[-",[631,2261,2262],{"class":850},"1.2",[631,2264,1022],{"class":637},[631,2266,851],{"class":850},[631,2268,1022],{"class":637},[631,2270,851],{"class":850},[631,2272,864],{"class":637},[631,2274,655],{"class":637},[631,2276,664],{"class":637},[631,2278,2279,2281,2283],{"class":633,"line":1070},[631,2280,1062],{"class":637},[631,2282,1065],{"class":641},[631,2284,1036],{"class":637},[631,2286,2287,2289,2291,2293,2295,2297,2299,2301],{"class":633,"line":1092},[631,2288,1062],{"class":637},[631,2290,1075],{"class":641},[631,2292,1078],{"class":645},[631,2294,652],{"class":637},[631,2296,655],{"class":637},[631,2298,1085],{"class":658},[631,2300,655],{"class":637},[631,2302,1036],{"class":637},[631,2304,2305,2307,2309,2312,2314,2316,2319,2321,2323,2325,2327,2329,2331,2333,2335,2337,2339,2341,2343,2345,2347,2349,2351,2354],{"class":633,"line":1143},[631,2306,1062],{"class":637},[631,2308,53],{"class":641},[631,2310,2311],{"class":645}," ref",[631,2313,652],{"class":637},[631,2315,655],{"class":637},[631,2317,2318],{"class":658},"decalRef",[631,2320,655],{"class":637},[631,2322,1111],{"class":645},[631,2324,766],{"class":637},[631,2326,1116],{"class":645},[631,2328,652],{"class":637},[631,2330,655],{"class":637},[631,2332,2169],{"class":677},[631,2334,555],{"class":637},[631,2336,2246],{"class":677},[631,2338,655],{"class":637},[631,2340,1006],{"class":637},[631,2342,1130],{"class":645},[631,2344,652],{"class":637},[631,2346,655],{"class":637},[631,2348,1358],{"class":677},[631,2350,655],{"class":637},[631,2352,2353],{"class":645}," editable",[631,2355,1036],{"class":637},[631,2357,2358,2360,2362],{"class":633,"line":1153},[631,2359,1146],{"class":637},[631,2361,1054],{"class":641},[631,2363,664],{"class":637},[631,2365,2366],{"class":633,"line":1163},[631,2367,752],{"emptyLinePlaceholder":751},[631,2369,2371,2373,2375,2377,2379,2381,2384,2386,2388,2390,2392,2394,2396,2398,2400,2402,2404,2406,2408,2410],{"class":633,"line":2370},31,[631,2372,1000],{"class":637},[631,2374,1054],{"class":641},[631,2376,2239],{"class":645},[631,2378,652],{"class":637},[631,2380,655],{"class":637},[631,2382,2383],{"class":658},"sphere",[631,2385,655],{"class":637},[631,2387,1006],{"class":637},[631,2389,1009],{"class":645},[631,2391,652],{"class":637},[631,2393,655],{"class":637},[631,2395,1016],{"class":637},[631,2397,2262],{"class":850},[631,2399,1022],{"class":637},[631,2401,851],{"class":850},[631,2403,1022],{"class":637},[631,2405,851],{"class":850},[631,2407,864],{"class":637},[631,2409,655],{"class":637},[631,2411,664],{"class":637},[631,2413,2415,2417,2420,2422,2425,2427,2429,2431,2434,2436,2438],{"class":633,"line":2414},32,[631,2416,1062],{"class":637},[631,2418,2419],{"class":641},"TresSphereGeometry",[631,2421,1006],{"class":637},[631,2423,2424],{"class":645},"args",[631,2426,652],{"class":637},[631,2428,655],{"class":637},[631,2430,1016],{"class":637},[631,2432,2433],{"class":850},"0.7",[631,2435,864],{"class":637},[631,2437,655],{"class":637},[631,2439,1036],{"class":637},[631,2441,2443,2445,2447,2449,2451,2453,2455,2457],{"class":633,"line":2442},33,[631,2444,1062],{"class":637},[631,2446,1075],{"class":641},[631,2448,1078],{"class":645},[631,2450,652],{"class":637},[631,2452,655],{"class":637},[631,2454,1085],{"class":658},[631,2456,655],{"class":637},[631,2458,1036],{"class":637},[631,2460,2462,2464,2466,2468,2470,2472,2474,2476,2478,2480,2482,2484,2486,2488,2490,2492,2494,2496,2498],{"class":633,"line":2461},34,[631,2463,1062],{"class":637},[631,2465,53],{"class":641},[631,2467,1111],{"class":645},[631,2469,766],{"class":637},[631,2471,1116],{"class":645},[631,2473,652],{"class":637},[631,2475,655],{"class":637},[631,2477,2169],{"class":677},[631,2479,555],{"class":637},[631,2481,2383],{"class":677},[631,2483,655],{"class":637},[631,2485,1006],{"class":637},[631,2487,1130],{"class":645},[631,2489,652],{"class":637},[631,2491,655],{"class":637},[631,2493,1358],{"class":677},[631,2495,655],{"class":637},[631,2497,2353],{"class":645},[631,2499,1036],{"class":637},[631,2501,2503,2505,2507],{"class":633,"line":2502},35,[631,2504,1146],{"class":637},[631,2506,1054],{"class":641},[631,2508,664],{"class":637},[631,2510,2512,2514,2516],{"class":633,"line":2511},36,[631,2513,1156],{"class":637},[631,2515,992],{"class":641},[631,2517,664],{"class":637},[631,2519,2521,2523,2525],{"class":633,"line":2520},37,[631,2522,964],{"class":637},[631,2524,981],{"class":641},[631,2526,664],{"class":637},[2528,2529,2531],"h3",{"id":2530},"how-the-wiring-works","How the wiring works",[512,2533,2534,2545,2554,2563],{},[515,2535,2536,2539,2540,2542,2543,555],{},[507,2537,2538],{},"v-model:data=\"layout.cube\""," β€” each ",[507,2541,509],{}," owns one slice of the\nlayout object. The slice's key matches the parent mesh's ",[507,2544,1376],{},[515,2546,2547,2550,2551,2553],{},[507,2548,2549],{},"ref=\"decalRef\""," β€” grab a reference to any ",[507,2552,509],{}," in the canvas;\nthe session is canvas-shared so it doesn't matter which.",[515,2555,2556,2559,2560,2562],{},[507,2557,2558],{},"session = decalRef.value?.editor"," β€” the editor session powers\n",[507,2561,525],{},". Pass it through.",[515,2564,2565,2568,2569,2571],{},[507,2566,2567],{},":data=\"layout\""," on ",[507,2570,525],{}," β€” the full mesh-keyed layout, so\nthe overlay can render the layer panel and route imports back to each\nDecal by name.",[1171,2573,2574],{},[504,2575,2576,2577,2580,2581,2584],{},"The overlay is full-viewport (",[507,2578,2579],{},"position: fixed; inset: 0",") by default.\nWhen embedding inside a bounded stage (docs, modal, sidebar preview),\npass ",[507,2582,2583],{},"contained"," so the overlay positions itself absolutely against\nthe nearest positioned ancestor instead.",[622,2586,2588],{"className":624,"code":2587,"language":626,"meta":627,"style":627},"\u003Cdiv style=\"position: relative; height: 500px;\">\n \u003CDecalDebugUI contained ... \u002F>\n \u003CTresCanvas>...\u003C\u002FTresCanvas>\n\u003C\u002Fdiv>\n",[507,2589,2590,2629,2634,2639],{"__ignoreMap":627},[631,2591,2592,2594,2597,2600,2602,2604,2607,2609,2612,2615,2618,2620,2623,2625,2627],{"class":633,"line":634},[631,2593,638],{"class":637},[631,2595,2596],{"class":641},"div",[631,2598,2599],{"class":645}," style",[631,2601,652],{"class":637},[631,2603,655],{"class":637},[631,2605,1009],{"class":2606},"sqsOY",[631,2608,766],{"class":637},[631,2610,2611],{"class":677}," relative",[631,2613,2614],{"class":637},";",[631,2616,2617],{"class":2606}," height",[631,2619,766],{"class":637},[631,2621,2622],{"class":850}," 500px",[631,2624,2614],{"class":637},[631,2626,655],{"class":637},[631,2628,664],{"class":637},[631,2630,2631],{"class":633,"line":667},[631,2632,2633],{"class":677}," \u003CDecalDebugUI contained ... \u002F>\n",[631,2635,2636],{"class":633,"line":707},[631,2637,2638],{"class":677}," \u003CTresCanvas>...\u003C\u002FTresCanvas>\n",[631,2640,2641,2643,2645],{"class":633,"line":728},[631,2642,964],{"class":637},[631,2644,2596],{"class":641},[631,2646,664],{"class":637},[603,2648,1783],{"id":2649},"import-export",[504,2651,2652,2653,2656,2657,2659],{},"The Export button in the dock auto-downloads the current layout as\n",[507,2654,2655],{},"decal-layout-YYYY-MM-DD.json",". The Import button opens a file picker;\nthe loaded JSON is sanitised (unknown mesh keys and unknown texture\nnames are dropped with a warning) and routed back through each\n",[507,2658,509],{}," automatically β€” no extra host code needed.",[622,2661,2663],{"className":624,"code":2662,"language":626,"meta":627,"style":627},"\u003C!-- Custom filename -->\n\u003CDecalDebugUI :export-filename=\"`${sceneName}.json`\" ... \u002F>\n\n\u003C!-- Disable the built-in download β€” handle export yourself -->\n\u003CDecalDebugUI :export-filename=\"null\" @export=\"postToBackend\" ... \u002F>\n",[507,2664,2665,2670,2701,2705,2710],{"__ignoreMap":627},[631,2666,2667],{"class":633,"line":634},[631,2668,2669],{"class":1626},"\u003C!-- Custom filename -->\n",[631,2671,2672,2674,2676,2678,2681,2683,2686,2689,2691,2693,2696,2699],{"class":633,"line":667},[631,2673,638],{"class":637},[631,2675,2130],{"class":641},[631,2677,1006],{"class":637},[631,2679,2680],{"class":645},"export-filename",[631,2682,652],{"class":637},[631,2684,2685],{"class":637},"\"`${",[631,2687,2688],{"class":677},"sceneName",[631,2690,772],{"class":637},[631,2692,1185],{"class":658},[631,2694,2695],{"class":637},"`\"",[631,2697,2698],{"class":637}," ...",[631,2700,1036],{"class":637},[631,2702,2703],{"class":633,"line":707},[631,2704,752],{"emptyLinePlaceholder":751},[631,2706,2707],{"class":633,"line":728},[631,2708,2709],{"class":1626},"\u003C!-- Disable the built-in download β€” handle export yourself -->\n",[631,2711,2712,2714,2716,2718,2720,2722,2724,2726,2728,2731,2733,2735,2737,2740,2742,2744],{"class":633,"line":748},[631,2713,638],{"class":637},[631,2715,2130],{"class":641},[631,2717,1006],{"class":637},[631,2719,2680],{"class":645},[631,2721,652],{"class":637},[631,2723,655],{"class":637},[631,2725,2061],{"class":637},[631,2727,655],{"class":637},[631,2729,2730],{"class":637}," @",[631,2732,1653],{"class":645},[631,2734,652],{"class":637},[631,2736,655],{"class":637},[631,2738,2739],{"class":677},"postToBackend",[631,2741,655],{"class":637},[631,2743,2698],{"class":637},[631,2745,1036],{"class":637},[603,2747,2749,2750,1744],{"id":2748},"targeting-a-loaded-model-glb","Targeting a loaded model (",[507,2751,2752],{},".glb",[504,2754,2755,2756,2758,2759,2765,2766,2769,2770,2772],{},"A ",[507,2757,509],{}," can be a ",[519,2760,2761,2762],{},"direct child of ",[507,2763,2764],{},"\u003Cprimitive>",". Auto-resolution\nwalks one step up the scene graph and only accepts a ",[507,2767,2768],{},"Mesh"," β€” so the\nbehaviour depends on what the ",[507,2771,2764],{}," wraps.",[2528,2774,2776,2777,2780,2781],{"id":2775},"when-object-is-a-mesh","When ",[507,2778,2779],{},":object"," is a ",[507,2782,2768],{},[504,2784,2785],{},"The decal auto-resolves the wrapped mesh as its target. This is the\nsimplest option for a single-mesh asset:",[622,2787,2789],{"className":624,"code":2788,"language":626,"meta":627,"style":627},"\u003Cscript setup lang=\"ts\">\nimport { Decal, useGLTF } from '@tresjs\u002Fcientos'\n\nconst { nodes } = useGLTF('\u002Fmodels\u002Fhelmet.glb', { draco: true })\n\u002F\u002F nodes.Helmet is a Mesh in this asset.\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n \u003Cprimitive v-if=\"nodes?.Helmet\" :object=\"nodes.Helmet\">\n \u003CDecal v-model:data=\"layout.helmet\" :map=\"textures\" editable \u002F>\n \u003C\u002Fprimitive>\n\u003C\u002Ftemplate>\n",[507,2790,2791,2811,2834,2838,2879,2884,2892,2896,2904,2936,2977,2985],{"__ignoreMap":627},[631,2792,2793,2795,2797,2799,2801,2803,2805,2807,2809],{"class":633,"line":634},[631,2794,638],{"class":637},[631,2796,642],{"class":641},[631,2798,646],{"class":645},[631,2800,649],{"class":645},[631,2802,652],{"class":637},[631,2804,655],{"class":637},[631,2806,659],{"class":658},[631,2808,655],{"class":637},[631,2810,664],{"class":637},[631,2812,2813,2815,2817,2819,2821,2824,2826,2828,2830,2832],{"class":633,"line":667},[631,2814,671],{"class":670},[631,2816,674],{"class":637},[631,2818,678],{"class":677},[631,2820,681],{"class":637},[631,2822,2823],{"class":677}," useGLTF",[631,2825,692],{"class":637},[631,2827,695],{"class":670},[631,2829,698],{"class":637},[631,2831,701],{"class":658},[631,2833,704],{"class":637},[631,2835,2836],{"class":633,"line":707},[631,2837,752],{"emptyLinePlaceholder":751},[631,2839,2840,2842,2844,2847,2849,2851,2853,2855,2857,2860,2862,2864,2866,2869,2871,2875,2877],{"class":633,"line":728},[631,2841,758],{"class":645},[631,2843,674],{"class":637},[631,2845,2846],{"class":677}," nodes ",[631,2848,772],{"class":637},[631,2850,775],{"class":637},[631,2852,2823],{"class":778},[631,2854,781],{"class":677},[631,2856,784],{"class":637},[631,2858,2859],{"class":658},"\u002Fmodels\u002Fhelmet.glb",[631,2861,784],{"class":637},[631,2863,681],{"class":637},[631,2865,674],{"class":637},[631,2867,2868],{"class":641}," draco",[631,2870,766],{"class":637},[631,2872,2874],{"class":2873},"sfNiH"," true",[631,2876,692],{"class":637},[631,2878,792],{"class":677},[631,2880,2881],{"class":633,"line":748},[631,2882,2883],{"class":1626},"\u002F\u002F nodes.Helmet is a Mesh in this asset.\n",[631,2885,2886,2888,2890],{"class":633,"line":755},[631,2887,964],{"class":637},[631,2889,642],{"class":641},[631,2891,664],{"class":637},[631,2893,2894],{"class":633,"line":795},[631,2895,752],{"emptyLinePlaceholder":751},[631,2897,2898,2900,2902],{"class":633,"line":800},[631,2899,638],{"class":637},[631,2901,981],{"class":641},[631,2903,664],{"class":637},[631,2905,2906,2908,2911,2913,2915,2917,2920,2922,2925,2927,2929,2932,2934],{"class":633,"line":815},[631,2907,989],{"class":637},[631,2909,2910],{"class":641},"primitive",[631,2912,1099],{"class":645},[631,2914,652],{"class":637},[631,2916,655],{"class":637},[631,2918,2919],{"class":658},"nodes?.Helmet",[631,2921,655],{"class":637},[631,2923,2924],{"class":645}," :object",[631,2926,652],{"class":637},[631,2928,655],{"class":637},[631,2930,2931],{"class":658},"nodes.Helmet",[631,2933,655],{"class":637},[631,2935,664],{"class":637},[631,2937,2938,2940,2942,2944,2946,2948,2950,2952,2954,2956,2959,2961,2963,2965,2967,2969,2971,2973,2975],{"class":633,"line":821},[631,2939,1000],{"class":637},[631,2941,53],{"class":641},[631,2943,1111],{"class":645},[631,2945,766],{"class":637},[631,2947,1116],{"class":645},[631,2949,652],{"class":637},[631,2951,655],{"class":637},[631,2953,2169],{"class":677},[631,2955,555],{"class":637},[631,2957,2958],{"class":677},"helmet",[631,2960,655],{"class":637},[631,2962,1006],{"class":637},[631,2964,1130],{"class":645},[631,2966,652],{"class":637},[631,2968,655],{"class":637},[631,2970,1358],{"class":677},[631,2972,655],{"class":637},[631,2974,2353],{"class":645},[631,2976,1036],{"class":637},[631,2978,2979,2981,2983],{"class":633,"line":839},[631,2980,1156],{"class":637},[631,2982,2910],{"class":641},[631,2984,664],{"class":637},[631,2986,2987,2989,2991],{"class":633,"line":869},[631,2988,964],{"class":637},[631,2990,981],{"class":641},[631,2992,664],{"class":637},[1171,2994,2995],{},[504,2996,2997,2998,3000,3001,3004],{},"The resolved parent is the ",[507,2999,2764],{},"'s retargeting proxy rather than\nthe raw object. This is transparent in practice β€” geometry, ",[507,3002,3003],{},"matrixWorld","\nand raycasting all forward to the wrapped object β€” so the decal projects\nand follows transforms correctly.",[2528,3006,2776,3008,2780,3010],{"id":3007},"when-object-is-a-group",[507,3009,2779],{},[507,3011,3012],{},"Group",[504,3014,3015,3016,3018,3019,3021,3022,3024,3025,766],{},"A named node in a ",[507,3017,2752],{}," is often a ",[507,3020,3012],{}," containing several child\nmeshes (e.g. a ceramic body + a metallic interior). Auto-resolution\nreturns ",[507,3023,2061],{}," in that case and the decal silently does nothing β€” pass\nthe actual target child via ",[507,3026,3027],{},":mesh",[622,3029,3031],{"className":624,"code":3030,"language":626,"meta":627,"style":627},"\u003Cscript setup lang=\"ts\">\nimport { Decal, useGLTF } from '@tresjs\u002Fcientos'\nimport { computed } from 'vue'\nimport type { Mesh } from 'three'\n\nconst { nodes } = useGLTF('\u002Fmodels\u002Fmug.glb', { draco: true })\n\u002F\u002F nodes.Mug is a Group β€” pick the child you want to decal.\nconst body = computed\u003CMesh | null>(\n () => (nodes.value?.Mug?.getObjectByName('Body') as Mesh) ?? null,\n)\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n \u003Cprimitive v-if=\"nodes?.Mug\" :object=\"nodes.Mug\">\n \u003CDecal v-model:data=\"layout.mug\" :map=\"textures\" :mesh=\"body\" editable \u002F>\n \u003C\u002Fprimitive>\n\u003C\u002Ftemplate>\n",[507,3032,3033,3053,3075,3093,3115,3119,3156,3161,3185,3233,3237,3245,3249,3257,3287,3342,3350],{"__ignoreMap":627},[631,3034,3035,3037,3039,3041,3043,3045,3047,3049,3051],{"class":633,"line":634},[631,3036,638],{"class":637},[631,3038,642],{"class":641},[631,3040,646],{"class":645},[631,3042,649],{"class":645},[631,3044,652],{"class":637},[631,3046,655],{"class":637},[631,3048,659],{"class":658},[631,3050,655],{"class":637},[631,3052,664],{"class":637},[631,3054,3055,3057,3059,3061,3063,3065,3067,3069,3071,3073],{"class":633,"line":667},[631,3056,671],{"class":670},[631,3058,674],{"class":637},[631,3060,678],{"class":677},[631,3062,681],{"class":637},[631,3064,2823],{"class":677},[631,3066,692],{"class":637},[631,3068,695],{"class":670},[631,3070,698],{"class":637},[631,3072,701],{"class":658},[631,3074,704],{"class":637},[631,3076,3077,3079,3081,3083,3085,3087,3089,3091],{"class":633,"line":707},[631,3078,671],{"class":670},[631,3080,674],{"class":637},[631,3082,1893],{"class":677},[631,3084,692],{"class":637},[631,3086,695],{"class":670},[631,3088,698],{"class":637},[631,3090,626],{"class":658},[631,3092,704],{"class":637},[631,3094,3095,3097,3099,3101,3104,3106,3108,3110,3113],{"class":633,"line":728},[631,3096,671],{"class":670},[631,3098,1846],{"class":670},[631,3100,674],{"class":637},[631,3102,3103],{"class":677}," Mesh",[631,3105,692],{"class":637},[631,3107,695],{"class":670},[631,3109,698],{"class":637},[631,3111,3112],{"class":658},"three",[631,3114,704],{"class":637},[631,3116,3117],{"class":633,"line":748},[631,3118,752],{"emptyLinePlaceholder":751},[631,3120,3121,3123,3125,3127,3129,3131,3133,3135,3137,3140,3142,3144,3146,3148,3150,3152,3154],{"class":633,"line":755},[631,3122,758],{"class":645},[631,3124,674],{"class":637},[631,3126,2846],{"class":677},[631,3128,772],{"class":637},[631,3130,775],{"class":637},[631,3132,2823],{"class":778},[631,3134,781],{"class":677},[631,3136,784],{"class":637},[631,3138,3139],{"class":658},"\u002Fmodels\u002Fmug.glb",[631,3141,784],{"class":637},[631,3143,681],{"class":637},[631,3145,674],{"class":637},[631,3147,2868],{"class":641},[631,3149,766],{"class":637},[631,3151,2874],{"class":2873},[631,3153,692],{"class":637},[631,3155,792],{"class":677},[631,3157,3158],{"class":633,"line":795},[631,3159,3160],{"class":1626},"\u002F\u002F nodes.Mug is a Group β€” pick the child you want to decal.\n",[631,3162,3163,3165,3168,3170,3172,3174,3176,3178,3180,3182],{"class":633,"line":800},[631,3164,758],{"class":645},[631,3166,3167],{"class":677}," body ",[631,3169,652],{"class":637},[631,3171,1893],{"class":778},[631,3173,638],{"class":637},[631,3175,2768],{"class":1971},[631,3177,2050],{"class":637},[631,3179,2053],{"class":1971},[631,3181,2056],{"class":637},[631,3183,3184],{"class":677},"(\n",[631,3186,3187,3190,3192,3195,3197,3199,3201,3204,3206,3209,3211,3213,3216,3218,3221,3224,3226,3228,3230],{"class":633,"line":815},[631,3188,3189],{"class":637}," ()",[631,3191,2082],{"class":645},[631,3193,3194],{"class":677}," (nodes",[631,3196,555],{"class":637},[631,3198,2090],{"class":677},[631,3200,2093],{"class":637},[631,3202,3203],{"class":677},"Mug",[631,3205,2093],{"class":637},[631,3207,3208],{"class":778},"getObjectByName",[631,3210,781],{"class":677},[631,3212,784],{"class":637},[631,3214,3215],{"class":658},"Body",[631,3217,784],{"class":637},[631,3219,3220],{"class":677},") ",[631,3222,3223],{"class":670},"as",[631,3225,3103],{"class":1971},[631,3227,3220],{"class":677},[631,3229,2099],{"class":637},[631,3231,3232],{"class":637}," null,\n",[631,3234,3235],{"class":633,"line":821},[631,3236,792],{"class":677},[631,3238,3239,3241,3243],{"class":633,"line":839},[631,3240,964],{"class":637},[631,3242,642],{"class":641},[631,3244,664],{"class":637},[631,3246,3247],{"class":633,"line":869},[631,3248,752],{"emptyLinePlaceholder":751},[631,3250,3251,3253,3255],{"class":633,"line":893},[631,3252,638],{"class":637},[631,3254,981],{"class":641},[631,3256,664],{"class":637},[631,3258,3259,3261,3263,3265,3267,3269,3272,3274,3276,3278,3280,3283,3285],{"class":633,"line":920},[631,3260,989],{"class":637},[631,3262,2910],{"class":641},[631,3264,1099],{"class":645},[631,3266,652],{"class":637},[631,3268,655],{"class":637},[631,3270,3271],{"class":658},"nodes?.Mug",[631,3273,655],{"class":637},[631,3275,2924],{"class":645},[631,3277,652],{"class":637},[631,3279,655],{"class":637},[631,3281,3282],{"class":658},"nodes.Mug",[631,3284,655],{"class":637},[631,3286,664],{"class":637},[631,3288,3289,3291,3293,3295,3297,3299,3301,3303,3305,3307,3310,3312,3314,3316,3318,3320,3322,3324,3326,3329,3331,3333,3336,3338,3340],{"class":633,"line":932},[631,3290,1000],{"class":637},[631,3292,53],{"class":641},[631,3294,1111],{"class":645},[631,3296,766],{"class":637},[631,3298,1116],{"class":645},[631,3300,652],{"class":637},[631,3302,655],{"class":637},[631,3304,2169],{"class":677},[631,3306,555],{"class":637},[631,3308,3309],{"class":677},"mug",[631,3311,655],{"class":637},[631,3313,1006],{"class":637},[631,3315,1130],{"class":645},[631,3317,652],{"class":637},[631,3319,655],{"class":637},[631,3321,1358],{"class":677},[631,3323,655],{"class":637},[631,3325,1006],{"class":637},[631,3327,3328],{"class":645},"mesh",[631,3330,652],{"class":637},[631,3332,655],{"class":637},[631,3334,3335],{"class":677},"body",[631,3337,655],{"class":637},[631,3339,2353],{"class":645},[631,3341,1036],{"class":637},[631,3343,3344,3346,3348],{"class":633,"line":949},[631,3345,1156],{"class":637},[631,3347,2910],{"class":641},[631,3349,664],{"class":637},[631,3351,3352,3354,3356],{"class":633,"line":955},[631,3353,964],{"class":637},[631,3355,981],{"class":641},[631,3357,664],{"class":637},[2528,3359,3361],{"id":3360},"targeting-an-extracted-sub-mesh","Targeting an extracted sub-mesh",[504,3363,3364,3365,3371,3372,3380,3381,3383,3384,766],{},"Alternatively, ",[519,3366,3367,3368,3370],{},"wrap a ",[507,3369,614],{}," around an extracted sub-mesh",". Reach\nfor this when you need to target one named sub-mesh of a larger model (and\nkeep its material): use\n",[534,3373,3377],{"href":3374,"rel":3375},"https:\u002F\u002Fdocs.tresjs.org\u002Fapi\u002Fcomposables.html#usegraph",[3376],"nofollow",[507,3378,3379],{},"useGraph"," to\npull the sub-mesh, then build a regular ",[507,3382,614],{}," around its\n",[507,3385,3386],{},":geometry",[622,3388,3390],{"className":624,"code":3389,"language":626,"meta":627,"style":627},"\u003Cscript setup lang=\"ts\">\nimport { useGraph, useLoader } from '@tresjs\u002Fcore'\nimport { Decal } from '@tresjs\u002Fcientos'\nimport { GLTFLoader } from 'three\u002Fexamples\u002Fjsm\u002Floaders\u002FGLTFLoader.js'\nimport { computed } from 'vue'\n\nconst { state: model } = useLoader(GLTFLoader, '\u002Fmodels\u002Fhelmet.glb')\nconst scene = computed(() => model.value?.scene)\nconst graph = useGraph(scene)\nconst nodes = computed(() => graph.value?.nodes)\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n \u003CTresMesh\n v-if=\"nodes?.Helmet.geometry\"\n name=\"helmet\"\n :geometry=\"nodes.Helmet.geometry\"\n >\n \u003Cprimitive :object=\"nodes.Helmet.material\" attach=\"material\" \u002F>\n \u003CDecal v-model:data=\"layout.helmet\" :map=\"textures\" editable \u002F>\n \u003C\u002FTresMesh>\n\u003C\u002Ftemplate>\n",[507,3391,3392,3412,3436,3454,3474,3492,3496,3528,3557,3571,3599,3607,3611,3619,3626,3650,3663,3686,3691,3722,3762,3770],{"__ignoreMap":627},[631,3393,3394,3396,3398,3400,3402,3404,3406,3408,3410],{"class":633,"line":634},[631,3395,638],{"class":637},[631,3397,642],{"class":641},[631,3399,646],{"class":645},[631,3401,649],{"class":645},[631,3403,652],{"class":637},[631,3405,655],{"class":637},[631,3407,659],{"class":658},[631,3409,655],{"class":637},[631,3411,664],{"class":637},[631,3413,3414,3416,3418,3421,3423,3426,3428,3430,3432,3434],{"class":633,"line":667},[631,3415,671],{"class":670},[631,3417,674],{"class":637},[631,3419,3420],{"class":677}," useGraph",[631,3422,681],{"class":637},[631,3424,3425],{"class":677}," useLoader",[631,3427,692],{"class":637},[631,3429,695],{"class":670},[631,3431,698],{"class":637},[631,3433,723],{"class":658},[631,3435,704],{"class":637},[631,3437,3438,3440,3442,3444,3446,3448,3450,3452],{"class":633,"line":707},[631,3439,671],{"class":670},[631,3441,674],{"class":637},[631,3443,678],{"class":677},[631,3445,692],{"class":637},[631,3447,695],{"class":670},[631,3449,698],{"class":637},[631,3451,701],{"class":658},[631,3453,704],{"class":637},[631,3455,3456,3458,3460,3463,3465,3467,3469,3472],{"class":633,"line":728},[631,3457,671],{"class":670},[631,3459,674],{"class":637},[631,3461,3462],{"class":677}," GLTFLoader",[631,3464,692],{"class":637},[631,3466,695],{"class":670},[631,3468,698],{"class":637},[631,3470,3471],{"class":658},"three\u002Fexamples\u002Fjsm\u002Floaders\u002FGLTFLoader.js",[631,3473,704],{"class":637},[631,3475,3476,3478,3480,3482,3484,3486,3488,3490],{"class":633,"line":748},[631,3477,671],{"class":670},[631,3479,674],{"class":637},[631,3481,1893],{"class":677},[631,3483,692],{"class":637},[631,3485,695],{"class":670},[631,3487,698],{"class":637},[631,3489,626],{"class":658},[631,3491,704],{"class":637},[631,3493,3494],{"class":633,"line":755},[631,3495,752],{"emptyLinePlaceholder":751},[631,3497,3498,3500,3502,3504,3506,3509,3511,3513,3515,3518,3520,3522,3524,3526],{"class":633,"line":795},[631,3499,758],{"class":645},[631,3501,674],{"class":637},[631,3503,763],{"class":641},[631,3505,766],{"class":637},[631,3507,3508],{"class":677}," model ",[631,3510,772],{"class":637},[631,3512,775],{"class":637},[631,3514,3425],{"class":778},[631,3516,3517],{"class":677},"(GLTFLoader",[631,3519,681],{"class":637},[631,3521,698],{"class":637},[631,3523,2859],{"class":658},[631,3525,784],{"class":637},[631,3527,792],{"class":677},[631,3529,3530,3532,3535,3537,3539,3541,3543,3545,3548,3550,3552,3554],{"class":633,"line":800},[631,3531,758],{"class":645},[631,3533,3534],{"class":677}," scene ",[631,3536,652],{"class":637},[631,3538,1893],{"class":778},[631,3540,781],{"class":677},[631,3542,2079],{"class":637},[631,3544,2082],{"class":645},[631,3546,3547],{"class":677}," model",[631,3549,555],{"class":637},[631,3551,2090],{"class":677},[631,3553,2093],{"class":637},[631,3555,3556],{"class":677},"scene)\n",[631,3558,3559,3561,3564,3566,3568],{"class":633,"line":815},[631,3560,758],{"class":645},[631,3562,3563],{"class":677}," graph ",[631,3565,652],{"class":637},[631,3567,3420],{"class":778},[631,3569,3570],{"class":677},"(scene)\n",[631,3572,3573,3575,3577,3579,3581,3583,3585,3587,3590,3592,3594,3596],{"class":633,"line":821},[631,3574,758],{"class":645},[631,3576,2846],{"class":677},[631,3578,652],{"class":637},[631,3580,1893],{"class":778},[631,3582,781],{"class":677},[631,3584,2079],{"class":637},[631,3586,2082],{"class":645},[631,3588,3589],{"class":677}," graph",[631,3591,555],{"class":637},[631,3593,2090],{"class":677},[631,3595,2093],{"class":637},[631,3597,3598],{"class":677},"nodes)\n",[631,3600,3601,3603,3605],{"class":633,"line":839},[631,3602,964],{"class":637},[631,3604,642],{"class":641},[631,3606,664],{"class":637},[631,3608,3609],{"class":633,"line":869},[631,3610,752],{"emptyLinePlaceholder":751},[631,3612,3613,3615,3617],{"class":633,"line":893},[631,3614,638],{"class":637},[631,3616,981],{"class":641},[631,3618,664],{"class":637},[631,3620,3621,3623],{"class":633,"line":920},[631,3622,989],{"class":637},[631,3624,3625],{"class":641},"TresMesh\n",[631,3627,3628,3631,3633,3635,3638,3640,3643,3645,3648],{"class":633,"line":932},[631,3629,3630],{"class":670}," v-if",[631,3632,652],{"class":637},[631,3634,655],{"class":637},[631,3636,3637],{"class":677},"nodes",[631,3639,2093],{"class":637},[631,3641,3642],{"class":677},"Helmet",[631,3644,555],{"class":637},[631,3646,3647],{"class":677},"geometry",[631,3649,1532],{"class":637},[631,3651,3652,3655,3657,3659,3661],{"class":633,"line":949},[631,3653,3654],{"class":645}," name",[631,3656,652],{"class":637},[631,3658,655],{"class":637},[631,3660,2958],{"class":658},[631,3662,1532],{"class":637},[631,3664,3665,3668,3670,3672,3674,3676,3678,3680,3682,3684],{"class":633,"line":955},[631,3666,3667],{"class":637}," :",[631,3669,3647],{"class":645},[631,3671,652],{"class":637},[631,3673,655],{"class":637},[631,3675,3637],{"class":677},[631,3677,555],{"class":637},[631,3679,3642],{"class":677},[631,3681,555],{"class":637},[631,3683,3647],{"class":677},[631,3685,1532],{"class":637},[631,3687,3688],{"class":633,"line":961},[631,3689,3690],{"class":637}," >\n",[631,3692,3693,3695,3697,3699,3701,3703,3706,3708,3711,3713,3715,3718,3720],{"class":633,"line":971},[631,3694,1000],{"class":637},[631,3696,2910],{"class":641},[631,3698,2924],{"class":645},[631,3700,652],{"class":637},[631,3702,655],{"class":637},[631,3704,3705],{"class":658},"nodes.Helmet.material",[631,3707,655],{"class":637},[631,3709,3710],{"class":645}," attach",[631,3712,652],{"class":637},[631,3714,655],{"class":637},[631,3716,3717],{"class":658},"material",[631,3719,655],{"class":637},[631,3721,1036],{"class":637},[631,3723,3724,3726,3728,3730,3732,3734,3736,3738,3740,3742,3744,3746,3748,3750,3752,3754,3756,3758,3760],{"class":633,"line":976},[631,3725,1000],{"class":637},[631,3727,53],{"class":641},[631,3729,1111],{"class":645},[631,3731,766],{"class":637},[631,3733,1116],{"class":645},[631,3735,652],{"class":637},[631,3737,655],{"class":637},[631,3739,2169],{"class":677},[631,3741,555],{"class":637},[631,3743,2958],{"class":677},[631,3745,655],{"class":637},[631,3747,1006],{"class":637},[631,3749,1130],{"class":645},[631,3751,652],{"class":637},[631,3753,655],{"class":637},[631,3755,1358],{"class":677},[631,3757,655],{"class":637},[631,3759,2353],{"class":645},[631,3761,1036],{"class":637},[631,3763,3764,3766,3768],{"class":633,"line":986},[631,3765,1156],{"class":637},[631,3767,1054],{"class":641},[631,3769,664],{"class":637},[631,3771,3772,3774,3776],{"class":633,"line":997},[631,3773,964],{"class":637},[631,3775,981],{"class":641},[631,3777,664],{"class":637},[504,3779,3780,3781,1464,3783,3785,3786,3788,3789,3791],{},"The mesh's ",[507,3782,3647],{},[507,3784,3717],{}," come from the loaded model; the\n",[507,3787,509],{}," lives inside a regular ",[507,3790,614],{}," with a clean scene-graph\nparent.",[1600,3793,3794],{},[504,3795,3796,3797,3799,3800,3803,3804,3807,3808,3811],{},"A saved decal's ",[507,3798,1009],{}," is stored in ",[519,3801,3802],{},"world space",", so it is\nre-projected onto the parent using the parent's transform ",[519,3805,3806],{},"at load\ntime",". A persisted layout therefore only round-trips if the parent sits\nat the same transform it had when the decal was authored. Parents under a\ncontinuously- or randomly-animated wrapper (e.g. ",[507,3809,3810],{},"\u003CLevioso>",", which starts\nat a random phase each reload) move out from under the saved point, so the\nprojection clips to nothing and the decal vanishes. Author and persist\ndecals on parents whose transform is deterministic at load time, or apply\nthe animation only after the layout has mounted.",[603,3813,3815],{"id":3814},"json-schema","JSON schema",[504,3817,3818,3819,3821,3822,3825,3826,3828,3829,555],{},"Each entry in the ",[507,3820,1116],{}," array follows the ",[507,3823,3824],{},"DecalJsonEntry"," shape; the\nlayout passed to ",[507,3827,525],{}," groups these by mesh name as\n",[507,3830,3831],{},"DecalLayout = Record\u003Cstring, DecalJsonEntry[]>",[3833,3834,3835,3836,3840],"details",{},"\n ",[3837,3838,3839],"summary",{},"Full schema",[622,3841,3843],{"className":1618,"code":3842,"language":659,"meta":627,"style":627},"interface DecalJsonEntry {\n id: string \u002F\u002F stable UUID\n position: [number, number, number] \u002F\u002F target-mesh local space (raycast hit, baked into the parent's frame)\n orientation: [number, number, number] \u002F\u002F Euler XYZ\n size: [number, number, number] \u002F\u002F extents along X\u002FY; Z = projection depth\n zIndex: number \u002F\u002F per-mesh layer order, β‰₯ 0\n map: string | null \u002F\u002F matches a texture's .name\n flipX?: boolean \u002F\u002F omitted when false\n flipY?: boolean \u002F\u002F omitted when false\n color?: string \u002F\u002F hex (e.g. '#ff6b35'), omitted when no tint\n opacity?: number \u002F\u002F 0..1, omitted when 1\n visible?: boolean \u002F\u002F omitted when true; false hides the decal\n}\n\ntype DecalLayout = Record\u003Cstring, DecalJsonEntry[]>\n\u002F\u002F { sphere: [...], cube: [...] }\n",[507,3844,3845,3855,3868,3895,3919,3943,3955,3971,3985,3996,4008,4020,4032,4037,4041,4066],{"__ignoreMap":627},[631,3846,3847,3850,3852],{"class":633,"line":634},[631,3848,3849],{"class":645},"interface",[631,3851,1856],{"class":1971},[631,3853,3854],{"class":637}," {\n",[631,3856,3857,3860,3862,3865],{"class":633,"line":667},[631,3858,3859],{"class":641}," id",[631,3861,766],{"class":637},[631,3863,3864],{"class":1971}," string",[631,3866,3867],{"class":1626}," \u002F\u002F stable UUID\n",[631,3869,3870,3873,3875,3877,3880,3882,3885,3887,3889,3892],{"class":633,"line":707},[631,3871,3872],{"class":641}," position",[631,3874,766],{"class":637},[631,3876,847],{"class":677},[631,3878,3879],{"class":1971},"number",[631,3881,681],{"class":637},[631,3883,3884],{"class":1971}," number",[631,3886,681],{"class":637},[631,3888,3884],{"class":1971},[631,3890,3891],{"class":677},"] ",[631,3893,3894],{"class":1626},"\u002F\u002F target-mesh local space (raycast hit, baked into the parent's frame)\n",[631,3896,3897,3900,3902,3904,3906,3908,3910,3912,3914,3916],{"class":633,"line":728},[631,3898,3899],{"class":641}," orientation",[631,3901,766],{"class":637},[631,3903,847],{"class":677},[631,3905,3879],{"class":1971},[631,3907,681],{"class":637},[631,3909,3884],{"class":1971},[631,3911,681],{"class":637},[631,3913,3884],{"class":1971},[631,3915,3891],{"class":677},[631,3917,3918],{"class":1626},"\u002F\u002F Euler XYZ\n",[631,3920,3921,3924,3926,3928,3930,3932,3934,3936,3938,3940],{"class":633,"line":748},[631,3922,3923],{"class":641}," size",[631,3925,766],{"class":637},[631,3927,847],{"class":677},[631,3929,3879],{"class":1971},[631,3931,681],{"class":637},[631,3933,3884],{"class":1971},[631,3935,681],{"class":637},[631,3937,3884],{"class":1971},[631,3939,3891],{"class":677},[631,3941,3942],{"class":1626},"\u002F\u002F extents along X\u002FY; Z = projection depth\n",[631,3944,3945,3948,3950,3952],{"class":633,"line":755},[631,3946,3947],{"class":641}," zIndex",[631,3949,766],{"class":637},[631,3951,3884],{"class":1971},[631,3953,3954],{"class":1626}," \u002F\u002F per-mesh layer order, β‰₯ 0\n",[631,3956,3957,3960,3962,3964,3966,3968],{"class":633,"line":795},[631,3958,3959],{"class":641}," map",[631,3961,766],{"class":637},[631,3963,3864],{"class":1971},[631,3965,2050],{"class":637},[631,3967,2053],{"class":1971},[631,3969,3970],{"class":1626}," \u002F\u002F matches a texture's .name\n",[631,3972,3973,3976,3979,3982],{"class":633,"line":800},[631,3974,3975],{"class":641}," flipX",[631,3977,3978],{"class":637},"?:",[631,3980,3981],{"class":1971}," boolean",[631,3983,3984],{"class":1626}," \u002F\u002F omitted when false\n",[631,3986,3987,3990,3992,3994],{"class":633,"line":815},[631,3988,3989],{"class":641}," flipY",[631,3991,3978],{"class":637},[631,3993,3981],{"class":1971},[631,3995,3984],{"class":1626},[631,3997,3998,4001,4003,4005],{"class":633,"line":821},[631,3999,4000],{"class":641}," color",[631,4002,3978],{"class":637},[631,4004,3864],{"class":1971},[631,4006,4007],{"class":1626}," \u002F\u002F hex (e.g. '#ff6b35'), omitted when no tint\n",[631,4009,4010,4013,4015,4017],{"class":633,"line":839},[631,4011,4012],{"class":641}," opacity",[631,4014,3978],{"class":637},[631,4016,3884],{"class":1971},[631,4018,4019],{"class":1626}," \u002F\u002F 0..1, omitted when 1\n",[631,4021,4022,4025,4027,4029],{"class":633,"line":869},[631,4023,4024],{"class":641}," visible",[631,4026,3978],{"class":637},[631,4028,3981],{"class":1971},[631,4030,4031],{"class":1626}," \u002F\u002F omitted when true; false hides the decal\n",[631,4033,4034],{"class":633,"line":893},[631,4035,4036],{"class":637},"}\n",[631,4038,4039],{"class":633,"line":920},[631,4040,752],{"emptyLinePlaceholder":751},[631,4042,4043,4046,4049,4051,4054,4056,4058,4060,4062,4064],{"class":633,"line":932},[631,4044,4045],{"class":645},"type",[631,4047,4048],{"class":1971}," DecalLayout",[631,4050,775],{"class":637},[631,4052,4053],{"class":1971}," Record",[631,4055,638],{"class":637},[631,4057,1977],{"class":1971},[631,4059,681],{"class":637},[631,4061,1856],{"class":1971},[631,4063,1984],{"class":677},[631,4065,664],{"class":637},[631,4067,4068],{"class":633,"line":949},[631,4069,4070],{"class":1626},"\u002F\u002F { sphere: [...], cube: [...] }\n",[603,4072,4074,4076],{"id":4073},"decal-props",[507,4075,509],{}," props",[4078,4079,4080,4096],"table",{},[4081,4082,4083],"thead",{},[4084,4085,4086,4090,4093],"tr",{},[4087,4088,4089],"th",{},"Prop",[4087,4091,4092],{},"Description",[4087,4094,4095],{},"Default",[4097,4098,4099,4116,4136,4172,4192,4207,4222,4242,4270],"tbody",{},[4084,4100,4101,4106,4112],{},[4102,4103,4104],"td",{},[519,4105,1116],{},[4102,4107,4108,4109,4111],{},"Two-way list of stamped decals (use with ",[507,4110,572],{},").",[4102,4113,4114],{},[507,4115,1984],{},[4084,4117,4118,4122,4132],{},[4102,4119,4120],{},[519,4121,1130],{},[4102,4123,4124,4125,4127,4128,4131],{},"A single ",[507,4126,550],{}," or array of ",[507,4129,4130],{},"Texture[]",". With multiple, the editor lets the user cycle through them as a palette.",[4102,4133,4134],{},[507,4135,2061],{},[4084,4137,4138,4142,4168],{},[4102,4139,4140],{},[519,4141,3328],{},[4102,4143,4144,4145,4147,4148,4151,4152,4154,4155,4158,4159,1740,4161,1740,4164,4167],{},"Optional explicit target mesh (",[507,4146,2768],{}," or ",[507,4149,4150],{},"ShallowRef\u003CMesh>","). When omitted, the scene-graph parent of ",[507,4153,509],{}," is auto-resolved via a hidden anchor ",[507,4156,4157],{},"\u003CTresGroup>",". The decal mesh is imperatively parented to the target so it follows the target's runtime ",[507,4160,1009],{},[507,4162,4163],{},"rotation",[507,4165,4166],{},"scale"," via the scene-graph hierarchy.",[4102,4169,4170],{},[507,4171,2061],{},[4084,4173,4174,4178,4187],{},[4102,4175,4176],{},[519,4177,1587],{},[4102,4179,2776,4180,4183,4184,4186],{},[507,4181,4182],{},"true",", mounts the interactive editor (raycast, hover, click-to-place, drag-from-thumbnail). Required for ",[507,4185,525],{}," interactions to work on this Decal.",[4102,4188,4189],{},[507,4190,4191],{},"false",[4084,4193,4194,4199,4202],{},[4102,4195,4196],{},[519,4197,4198],{},"baseSize",[4102,4200,4201],{},"Reference size used to derive each decal's size from the texture aspect ratio.",[4102,4203,4204],{},[507,4205,4206],{},"1",[4084,4208,4209,4214,4217],{},[4102,4210,4211],{},[519,4212,4213],{},"baseOffset",[4102,4215,4216],{},"Distance along the surface normal (parent units) to avoid z-fighting between the decal and the host mesh.",[4102,4218,4219],{},[507,4220,4221],{},"0.01",[4084,4223,4224,4228,4237],{},[4102,4225,4226],{},[519,4227,1497],{},[4102,4229,4230,4231,4233,4234,4236],{},"Extra offset added per ",[507,4232,594],{}," step on top of ",[507,4235,4213],{},". Increase if stacked decals still flicker.",[4102,4238,4239],{},[507,4240,4241],{},"0.001",[4084,4243,4244,4249,4265],{},[4102,4245,4246],{},[519,4247,4248],{},"cullThreshold",[4102,4250,4251,4252,4255,4256,4261,4262,4264],{},"Drops projected triangles whose face normal makes an angle steeper than ",[507,4253,4254],{},"acos(threshold)"," with the projector. Mitigates ",[534,4257,4260],{"href":4258,"rel":4259},"https:\u002F\u002Fgithub.com\u002Fmrdoob\u002Fthree.js\u002Fissues\u002F21187",[3376],"#21187",". Pass ",[507,4263,851],{}," to disable.",[4102,4266,4267],{},[507,4268,4269],{},"0.2",[4084,4271,4272,4277,4280],{},[4102,4273,4274],{},[519,4275,4276],{},"edgeColor",[4102,4278,4279],{},"Color of the edge outline drawn around a decal while it is hovered (pointer or layer panel) in editable mode.",[4102,4281,4282],{},[507,4283,4284],{},"#0000ff",[603,4286,4288,4290],{"id":4287},"decal-events",[507,4289,509],{}," events",[4078,4292,4293,4305],{},[4081,4294,4295],{},[4084,4296,4297,4300,4303],{},[4087,4298,4299],{},"Event",[4087,4301,4302],{},"Payload",[4087,4304,4092],{},[4097,4306,4307,4322,4337,4351,4371,4389,4406],{},[4084,4308,4309,4314,4319],{},[4102,4310,4311],{},[507,4312,4313],{},"update:data",[4102,4315,4316],{},[507,4317,4318],{},"DecalJsonEntry[]",[4102,4320,4321],{},"v-model partner β€” fires whenever the JSON list changes.",[4084,4323,4324,4329,4334],{},[4102,4325,4326],{},[507,4327,4328],{},"add",[4102,4330,4331],{},[507,4332,4333],{},"DecalEntry",[4102,4335,4336],{},"A new decal has been committed (create mode β†’ confirm).",[4084,4338,4339,4344,4348],{},[4102,4340,4341],{},[507,4342,4343],{},"update",[4102,4345,4346],{},[507,4347,4333],{},[4102,4349,4350],{},"An existing decal has been committed (update mode β†’ confirm).",[4084,4352,4353,4358,4362],{},[4102,4354,4355],{},[507,4356,4357],{},"delete",[4102,4359,4360],{},[507,4361,4333],{},[4102,4363,4364,4365,1740,4368,4111],{},"A decal has been removed (delete button or ",[507,4366,4367],{},"Del",[507,4369,4370],{},"Backspace",[4084,4372,4373,4378,4382],{},[4102,4374,4375],{},[507,4376,4377],{},"select",[4102,4379,4380],{},[507,4381,4333],{},[4102,4383,4384,4385,4388],{},"Edition began on ",[507,4386,4387],{},"entry"," (panel click, 3D click, or programmatic).",[4084,4390,4391,4396,4399],{},[4102,4392,4393],{},[507,4394,4395],{},"cancel",[4102,4397,4398],{},"β€”",[4102,4400,4401,4402,4405],{},"Edition was aborted without commit (",[507,4403,4404],{},"Esc",", click-outside in create mode).",[4084,4407,4408,4413,4418],{},[4102,4409,4410],{},[507,4411,4412],{},"decalClick",[4102,4414,4415],{},[507,4416,4417],{},"{ entry: DecalEntry, event: MouseEvent }",[4102,4419,4420,4421,4423,4424,555],{},"Fires on click of any stamped decal, even when ",[507,4422,1587],{}," is ",[507,4425,4191],{},[603,4427,4429,4431,4432,1744],{"id":4428},"decal-exposed-via-ref",[507,4430,509],{}," exposed (via ",[507,4433,4434],{},"ref",[504,4436,4437,4438,4441],{},"The template ref resolves to ",[507,4439,4440],{},"DecalImperativeApi"," β€” import the type for\nfull autocompletion:",[622,4443,4445],{"className":1618,"code":4444,"language":659,"meta":627,"style":627},"import type { DecalImperativeApi } from '@tresjs\u002Fcientos'\n\nconst decalRef = ref\u003CDecalImperativeApi | null>(null)\n",[507,4446,4447,4468,4472],{"__ignoreMap":627},[631,4448,4449,4451,4453,4455,4458,4460,4462,4464,4466],{"class":633,"line":634},[631,4450,671],{"class":670},[631,4452,1846],{"class":670},[631,4454,674],{"class":637},[631,4456,4457],{"class":677}," DecalImperativeApi",[631,4459,692],{"class":637},[631,4461,695],{"class":670},[631,4463,698],{"class":637},[631,4465,701],{"class":658},[631,4467,704],{"class":637},[631,4469,4470],{"class":633,"line":667},[631,4471,752],{"emptyLinePlaceholder":751},[631,4473,4474,4476,4478,4480,4482,4484,4486,4488,4490,4492,4494,4496],{"class":633,"line":707},[631,4475,758],{"class":645},[631,4477,2031],{"class":677},[631,4479,652],{"class":637},[631,4481,2311],{"class":778},[631,4483,638],{"class":637},[631,4485,4440],{"class":1971},[631,4487,2050],{"class":637},[631,4489,2053],{"class":1971},[631,4491,2056],{"class":637},[631,4493,781],{"class":677},[631,4495,2061],{"class":637},[631,4497,792],{"class":677},[4078,4499,4500,4512],{},[4081,4501,4502],{},[4084,4503,4504,4507,4510],{},[4087,4505,4506],{},"Property",[4087,4508,4509],{},"Type",[4087,4511,4092],{},[4097,4513,4514,4532,4550,4568,4583],{},[4084,4515,4516,4521,4526],{},[4102,4517,4518],{},[507,4519,4520],{},"editor",[4102,4522,4523],{},[507,4524,4525],{},"DecalEditorSession",[4102,4527,4528,4529,555],{},"The canvas-shared editor session. Pass it to ",[507,4530,4531],{},"\u003CDecalDebugUI :session>",[4084,4533,4534,4539,4544],{},[4102,4535,4536],{},[507,4537,4538],{},"beginEditById",[4102,4540,4541],{},[507,4542,4543],{},"(id: string) => boolean",[4102,4545,4546,4547,4549],{},"Programmatically start editing a specific decal. Returns ",[507,4548,4191],{}," if the id is unknown.",[4084,4551,4552,4557,4562],{},[4102,4553,4554],{},[507,4555,4556],{},"commit",[4102,4558,4559],{},[507,4560,4561],{},"() => void",[4102,4563,4564,4565,4111],{},"Commit the in-flight edit (same as ",[507,4566,4567],{},"Enter",[4084,4569,4570,4574,4578],{},[4102,4571,4572],{},[507,4573,4395],{},[4102,4575,4576],{},[507,4577,4561],{},[4102,4579,4580,4581,4111],{},"Abort the in-flight edit (same as ",[507,4582,4404],{},[4084,4584,4585,4590,4594],{},[4102,4586,4587],{},[507,4588,4589],{},"remove",[4102,4591,4592],{},[507,4593,4561],{},[4102,4595,4596,4597,4111],{},"Delete the currently edited decal (same as ",[507,4598,4367],{},[603,4600,4602,4076],{"id":4601},"decaldebugui-props",[507,4603,525],{},[4078,4605,4606,4616],{},[4081,4607,4608],{},[4084,4609,4610,4612,4614],{},[4087,4611,4089],{},[4087,4613,4092],{},[4087,4615,4095],{},[4097,4617,4618,4641,4666,4679,4699,4714,4737],{},[4084,4619,4620,4624,4637],{},[4102,4621,4622],{},[519,4623,2135],{},[4102,4625,4626,4629,4630,4632,4633,4636],{},[507,4627,4628],{},"DecalEditorSession | null"," β€” obtained from any ",[507,4631,509],{}," ref via ",[507,4634,4635],{},"decalRef.value?.editor",". Mandatory for the overlay to wire up the interactive logic.",[4102,4638,4639],{},[507,4640,2061],{},[4084,4642,4643,4647,4661],{},[4102,4644,4645],{},[519,4646,1116],{},[4102,4648,4649,4650,4653,4654,4657,4658,4660],{},"Mesh-name-keyed map of decal slices β€” ",[507,4651,4652],{},"{ sphere: [...], cube: [...] }",". Each key matches a ",[507,4655,4656],{},"\u003CTresMesh name=\"...\">"," whose child ",[507,4659,509],{}," owns the slice.",[4102,4662,4663],{},[507,4664,4665],{},"{}",[4084,4667,4668,4672,4675],{},[4102,4669,4670],{},[519,4671,1358],{},[4102,4673,4674],{},"The full texture palette shown in the dock's picker.",[4102,4676,4677],{},[507,4678,1984],{},[4084,4680,4681,4686,4695],{},[4102,4682,4683],{},[519,4684,4685],{},"theme",[4102,4687,4688,4147,4691,4694],{},[507,4689,4690],{},"'light'",[507,4692,4693],{},"'dark'"," β€” overlay theme tokens.",[4102,4696,4697],{},[507,4698,4690],{},[4084,4700,4701,4706,4709],{},[4102,4702,4703],{},[519,4704,4705],{},"snapAngle",[4102,4707,4708],{},"Rotation step (degrees) applied when the snap toggle is on. Snap-tick ring on the handle adapts automatically.",[4102,4710,4711],{},[507,4712,4713],{},"15",[4084,4715,4716,4721,4733],{},[4102,4717,4718],{},[519,4719,4720],{},"exportFilename",[4102,4722,4723,4724,4261,4726,4728,4729,4732],{},"Filename for the built-in JSON download. When omitted, defaults to ",[507,4725,2655],{},[507,4727,2061],{}," to skip the auto-download (the ",[507,4730,4731],{},"@export"," event still fires).",[4102,4734,4735],{},[507,4736,2655],{},[4084,4738,4739,4743,4746],{},[4102,4740,4741],{},[519,4742,2583],{},[4102,4744,4745],{},"Scope the overlay to the nearest positioned ancestor instead of pinning it to the viewport. Useful for embedding the editor inside a docs page or a bounded host stage.",[4102,4747,4748],{},[507,4749,4191],{},[603,4751,4753,4290],{"id":4752},"decaldebugui-events",[507,4754,525],{},[4078,4756,4757,4767],{},[4081,4758,4759],{},[4084,4760,4761,4763,4765],{},[4087,4762,4299],{},[4087,4764,4302],{},[4087,4766,4092],{},[4097,4768,4769,4783],{},[4084,4770,4771,4775,4780],{},[4102,4772,4773],{},[507,4774,1653],{},[4102,4776,4777],{},[507,4778,4779],{},"DecalLayout",[4102,4781,4782],{},"Fires after the user clicks Export. The download (if enabled) has already been triggered β€” use this for side effects (POST, analytics…).",[4084,4784,4785,4789,4793],{},[4102,4786,4787],{},[507,4788,671],{},[4102,4790,4791],{},[507,4792,4779],{},[4102,4794,4795],{},"Fires after the user picks a JSON file. The layout has been sanitised (unknown keys dropped) and already applied to the bound Decals.",[603,4797,4799],{"id":4798},"caveats","Caveats",[512,4801,4802,4817,4834,4850],{},[515,4803,4804,4805,4808,4809,4812,4813,4816],{},"✨ The overlay sits at ",[507,4806,4807],{},"position: fixed; inset: 0; pointer-events: none"," with\nindividual panels opting back in. It sits ",[519,4810,4811],{},"above"," the canvas by default\n(",[507,4814,4815],{},"z-index: 1000000",") β€” adjust via host CSS if needed.",[515,4818,4819,4820,4822,4823,4826,4827,1022,4830,4833],{},"🎨 ",[507,4821,525],{}," ships its own theme in a global stylesheet under the\n",[507,4824,4825],{},".cientos-decal-ui"," namespace, so host styles aren't affected. The CSS\nvariables (",[507,4828,4829],{},"--accent",[507,4831,4832],{},"--dock-bg",", etc.) can be overridden by targeting\nthe namespace.",[515,4835,4836,4837,4840,4841,4843,4844,4846,4847,4849],{},"πŸ”Ά Decals are ",[519,4838,4839],{},"per-canvas"," β€” if you have multiple ",[507,4842,1598],{}," in your\napp, each one has its own independent session. Pair each ",[507,4845,525],{},"\nwith the right ",[507,4848,2135],{}," (from one of the Decals inside that canvas).",[515,4851,4852,4853,555],{},"🧩 The parent mesh resolution defaults to the scene-graph parent. If your\nsetup needs a different target (e.g. a mesh referenced from outside the\nDecal's parent slot), pass ",[507,4854,4855],{},":mesh=\"meshRef\"",[603,4857,4859],{"id":4858},"limitations","Limitations",[1171,4861,4862,4876,4883,4926],{},[504,4863,4864,4865,4868,4869,1740,4871,1740,4873,4875],{},"Decal vertices are baked into the ",[519,4866,4867],{},"target mesh's local space"," at\nbuild time (the decal mesh is imperatively re-parented to the target,\nso ",[507,4870,1009],{},[507,4872,4163],{},[507,4874,4166],{}," on the parent are followed via\nthe scene graph β€” no rebuild needed).",[504,4877,4878,4879,4882],{},"Runtime deformations that change vertex positions outside of a\ntransform are ",[519,4880,4881],{},"not"," followed:",[512,4884,4885,4898,4906,4913],{},[515,4886,4887,4892,4893,555],{},[519,4888,4889],{},[507,4890,4891],{},"SkinnedMesh"," skinning is not applied β€” the decal stays in rest\npose. See ",[534,4894,4897],{"href":4895,"rel":4896},"https:\u002F\u002Fgithub.com\u002Fmrdoob\u002Fthree.js\u002Fissues\u002F7926",[3376],"three.js#7926",[515,4899,4900,4905],{},[519,4901,4902],{},[507,4903,4904],{},"morphAttributes"," on the parent are ignored.",[515,4907,4908,4909,4912],{},"Direct mutations of the parent's ",[507,4910,4911],{},"geometry.attributes.position","\n(e.g. CPU wave displacement, GPGPU) β€” the projection is baked once.",[515,4914,4915,4916,4920,4921,4923,4924,555],{},"Decals near silhouettes can wrap around onto opposite faces (see\n",[534,4917,4919],{"href":4258,"rel":4918},[3376],"three.js#21187",") β€”\nmitigated by the ",[507,4922,4248],{}," prop, default ",[507,4925,4269],{},[504,4927,4928,4930],{},[507,4929,509],{}," warns once per parent mesh when it detects these conditions.",[603,4932,4934],{"id":4933},"keyboard-shortcuts","Keyboard shortcuts",[4078,4936,4937,4947],{},[4081,4938,4939],{},[4084,4940,4941,4944],{},[4087,4942,4943],{},"Shortcut",[4087,4945,4946],{},"Action",[4097,4948,4949,4958,4967,4979,4992,5005],{},[4084,4950,4951,4955],{},[4102,4952,4953],{},[507,4954,4567],{},[4102,4956,4957],{},"Confirm the in-flight edit",[4084,4959,4960,4964],{},[4102,4961,4962],{},[507,4963,4404],{},[4102,4965,4966],{},"Cancel (revert updates, drop pending placements)",[4084,4968,4969,4976],{},[4102,4970,4971,1740,4973],{},[507,4972,4367],{},[507,4974,4975],{},"⌫",[4102,4977,4978],{},"Delete the edited decal (or cancel a create)",[4084,4980,4981,4989],{},[4102,4982,4983,1740,4986],{},[507,4984,4985],{},"⌘Z",[507,4987,4988],{},"Ctrl+Z",[4102,4990,4991],{},"Undo",[4084,4993,4994,5002],{},[4102,4995,4996,1740,4999],{},[507,4997,4998],{},"β‡§βŒ˜Z",[507,5000,5001],{},"Ctrl+⇧Z",[4102,5003,5004],{},"Redo",[4084,5006,5007,5010],{},[4102,5008,5009],{},"Click outside",[4102,5011,5012],{},"Auto-commit an in-flight update; cancel a create",[603,5014,5016,5017,1744],{"id":5015},"programmatic-api-usedecaleditor","Programmatic API (",[507,5018,5019],{},"useDecalEditor",[504,5021,5022,5023,5025,5026,5028,5029,5031,5032,5034],{},"Skip ",[507,5024,525],{}," entirely or augment it with custom panels β€”\n",[507,5027,539],{}," returns the same canvas-scoped session every Decal\nshares. Call it from any component inside ",[507,5030,1598],{}," (after at\nleast one ",[507,5033,509],{}," has mounted).",[622,5036,5038],{"className":1618,"code":5037,"language":659,"meta":627,"style":627},"import { useDecalEditor } from '@tresjs\u002Fcientos'\n\nconst session = useDecalEditor()\n",[507,5039,5040,5059,5063],{"__ignoreMap":627},[631,5041,5042,5044,5046,5049,5051,5053,5055,5057],{"class":633,"line":634},[631,5043,671],{"class":670},[631,5045,674],{"class":637},[631,5047,5048],{"class":677}," useDecalEditor",[631,5050,692],{"class":637},[631,5052,695],{"class":670},[631,5054,698],{"class":637},[631,5056,701],{"class":658},[631,5058,704],{"class":637},[631,5060,5061],{"class":633,"line":667},[631,5062,752],{"emptyLinePlaceholder":751},[631,5064,5065,5067,5069,5071,5073],{"class":633,"line":707},[631,5066,758],{"class":645},[631,5068,2070],{"class":677},[631,5070,652],{"class":637},[631,5072,5048],{"class":778},[631,5074,5075],{"class":677},"()\n",[504,5077,5078,5079,1022,5082,836,5085,1022,5088,5091,5092,836,5094,1022,5097,1022,5100,5103,5104,5107,5108,5111,5112,1022,5115,1022,5118,836,5121,5124],{},"The session exposes reactive state (",[507,5080,5081],{},"editingEntry",[507,5083,5084],{},"editingMode",[507,5086,5087],{},"canUndo",[507,5089,5090],{},"canRedo",", …), by-id mutators (",[507,5093,4538],{},[507,5095,5096],{},"setZIndexById",[507,5098,5099],{},"setVisibilityById",[507,5101,5102],{},"removeById","), batched updates\n(",[507,5105,5106],{},"setMeshData","), commit \u002F delete \u002F cancel listeners, undo \u002F redo, and\na ",[507,5109,5110],{},"registerDecalEntry"," hook for external entries. Helper utilities\n(",[507,5113,5114],{},"ensureTextureNames",[507,5116,5117],{},"getTextureName",[507,5119,5120],{},"getTextureAspect",[507,5122,5123],{},"invalidateDecalGeometry",") are exported alongside.",[3833,5126,3835,5127,5130,5134,5209,5213,5284,5300,5304,5340,5346,5350,5489,5493,5539,5542,5546,5560,5730,5734],{},[3837,5128,5129],{},"Full API reference",[2528,5131,5133],{"id":5132},"reactive-state","Reactive state",[622,5135,5137],{"className":1618,"code":5136,"language":659,"meta":627,"style":627},"session.editingEntry \u002F\u002F ShallowRef\u003CDecalEntry | null>\nsession.editingMode \u002F\u002F Ref\u003C'create' | 'update' | null>\nsession.lockedMeshUuid \u002F\u002F Ref\u003Cstring | null>\nsession.hoveredEntry \u002F\u002F ShallowRef\u003CDecalEntry | null>\nsession.canUndo \u002F\u002F Ref\u003Cboolean>\nsession.canRedo \u002F\u002F Ref\u003Cboolean>\n",[507,5138,5139,5151,5163,5175,5186,5198],{"__ignoreMap":627},[631,5140,5141,5143,5145,5148],{"class":633,"line":634},[631,5142,2135],{"class":677},[631,5144,555],{"class":637},[631,5146,5147],{"class":677},"editingEntry ",[631,5149,5150],{"class":1626},"\u002F\u002F ShallowRef\u003CDecalEntry | null>\n",[631,5152,5153,5155,5157,5160],{"class":633,"line":667},[631,5154,2135],{"class":677},[631,5156,555],{"class":637},[631,5158,5159],{"class":677},"editingMode ",[631,5161,5162],{"class":1626},"\u002F\u002F Ref\u003C'create' | 'update' | null>\n",[631,5164,5165,5167,5169,5172],{"class":633,"line":707},[631,5166,2135],{"class":677},[631,5168,555],{"class":637},[631,5170,5171],{"class":677},"lockedMeshUuid ",[631,5173,5174],{"class":1626},"\u002F\u002F Ref\u003Cstring | null>\n",[631,5176,5177,5179,5181,5184],{"class":633,"line":728},[631,5178,2135],{"class":677},[631,5180,555],{"class":637},[631,5182,5183],{"class":677},"hoveredEntry ",[631,5185,5150],{"class":1626},[631,5187,5188,5190,5192,5195],{"class":633,"line":748},[631,5189,2135],{"class":677},[631,5191,555],{"class":637},[631,5193,5194],{"class":677},"canUndo ",[631,5196,5197],{"class":1626},"\u002F\u002F Ref\u003Cboolean>\n",[631,5199,5200,5202,5204,5207],{"class":633,"line":755},[631,5201,2135],{"class":677},[631,5203,555],{"class":637},[631,5205,5206],{"class":677},"canRedo ",[631,5208,5197],{"class":1626},[2528,5210,5212],{"id":5211},"mutating-decals-by-id","Mutating decals by id",[622,5214,5216],{"className":1618,"code":5215,"language":659,"meta":627,"style":627},"session.beginEditById(id) \u002F\u002F start editing a placed decal\nsession.setZIndexById(id, newZ) \u002F\u002F reorder one decal\nsession.setVisibilityById(id, false) \u002F\u002F hide \u002F show\nsession.removeById(id) \u002F\u002F delete\n",[507,5217,5218,5232,5251,5271],{"__ignoreMap":627},[631,5219,5220,5222,5224,5226,5229],{"class":633,"line":634},[631,5221,2135],{"class":677},[631,5223,555],{"class":637},[631,5225,4538],{"class":778},[631,5227,5228],{"class":677},"(id) ",[631,5230,5231],{"class":1626},"\u002F\u002F start editing a placed decal\n",[631,5233,5234,5236,5238,5240,5243,5245,5248],{"class":633,"line":667},[631,5235,2135],{"class":677},[631,5237,555],{"class":637},[631,5239,5096],{"class":778},[631,5241,5242],{"class":677},"(id",[631,5244,681],{"class":637},[631,5246,5247],{"class":677}," newZ) ",[631,5249,5250],{"class":1626},"\u002F\u002F reorder one decal\n",[631,5252,5253,5255,5257,5259,5261,5263,5266,5268],{"class":633,"line":707},[631,5254,2135],{"class":677},[631,5256,555],{"class":637},[631,5258,5099],{"class":778},[631,5260,5242],{"class":677},[631,5262,681],{"class":637},[631,5264,5265],{"class":2873}," false",[631,5267,3220],{"class":677},[631,5269,5270],{"class":1626},"\u002F\u002F hide \u002F show\n",[631,5272,5273,5275,5277,5279,5281],{"class":633,"line":728},[631,5274,2135],{"class":677},[631,5276,555],{"class":637},[631,5278,5102],{"class":778},[631,5280,5228],{"class":677},[631,5282,5283],{"class":1626},"\u002F\u002F delete\n",[504,5285,5286,5287,5290,5291,5293,5294,5296,5297,5299],{},"When the targeted id matches the ",[519,5288,5289],{},"currently editing"," entry, mutations\nland on the in-flight buffer (committed on ",[507,5292,4567],{},", reverted on ",[507,5295,4404],{},").\nOtherwise they update ",[507,5298,1116],{}," immediately and record history.",[2528,5301,5303],{"id":5302},"batched-mesh-updates","Batched mesh updates",[622,5305,5307],{"className":1618,"code":5306,"language":659,"meta":627,"style":627},"session.setMeshData(meshName, nextEntries, { recordHistory: true })\n",[507,5308,5309],{"__ignoreMap":627},[631,5310,5311,5313,5315,5317,5320,5322,5325,5327,5329,5332,5334,5336,5338],{"class":633,"line":634},[631,5312,2135],{"class":677},[631,5314,555],{"class":637},[631,5316,5106],{"class":778},[631,5318,5319],{"class":677},"(meshName",[631,5321,681],{"class":637},[631,5323,5324],{"class":677}," nextEntries",[631,5326,681],{"class":637},[631,5328,674],{"class":637},[631,5330,5331],{"class":641}," recordHistory",[631,5333,766],{"class":637},[631,5335,2874],{"class":2873},[631,5337,692],{"class":637},[631,5339,792],{"class":677},[504,5341,5342,5343,5345],{},"A single emit avoids the stale-snapshot race that hits multiple\nback-to-back ",[507,5344,5096],{}," calls in the same tick.",[2528,5347,5349],{"id":5348},"listening-to-commits","Listening to commits",[622,5351,5353],{"className":1618,"code":5352,"language":659,"meta":627,"style":627},"const off = session.onCommit((entry, mode) => {\n console.log(mode, entry) \u002F\u002F mode: 'create' | 'update'\n})\nsession.onDelete((entry) => { \u002F* … *\u002F })\nsession.onCancel(() => { \u002F* … *\u002F })\n\n\u002F\u002F All return an unsubscribe function:\nonBeforeUnmount(off)\n",[507,5354,5355,5390,5415,5421,5449,5472,5476,5481],{"__ignoreMap":627},[631,5356,5357,5359,5362,5364,5367,5369,5372,5374,5376,5379,5381,5384,5386,5388],{"class":633,"line":634},[631,5358,758],{"class":645},[631,5360,5361],{"class":677}," off ",[631,5363,652],{"class":637},[631,5365,5366],{"class":677}," session",[631,5368,555],{"class":637},[631,5370,5371],{"class":778},"onCommit",[631,5373,781],{"class":677},[631,5375,781],{"class":637},[631,5377,4387],{"class":5378},"sHdIc",[631,5380,681],{"class":637},[631,5382,5383],{"class":5378}," mode",[631,5385,1744],{"class":637},[631,5387,2082],{"class":645},[631,5389,3854],{"class":637},[631,5391,5392,5395,5397,5400,5402,5405,5407,5410,5412],{"class":633,"line":667},[631,5393,5394],{"class":677}," console",[631,5396,555],{"class":637},[631,5398,5399],{"class":778},"log",[631,5401,781],{"class":641},[631,5403,5404],{"class":677},"mode",[631,5406,681],{"class":637},[631,5408,5409],{"class":677}," entry",[631,5411,3220],{"class":641},[631,5413,5414],{"class":1626},"\u002F\u002F mode: 'create' | 'update'\n",[631,5416,5417,5419],{"class":633,"line":707},[631,5418,772],{"class":637},[631,5420,792],{"class":677},[631,5422,5423,5425,5427,5430,5432,5434,5436,5438,5440,5442,5445,5447],{"class":633,"line":728},[631,5424,2135],{"class":677},[631,5426,555],{"class":637},[631,5428,5429],{"class":778},"onDelete",[631,5431,781],{"class":677},[631,5433,781],{"class":637},[631,5435,4387],{"class":5378},[631,5437,1744],{"class":637},[631,5439,2082],{"class":645},[631,5441,674],{"class":637},[631,5443,5444],{"class":1626}," \u002F* … *\u002F",[631,5446,692],{"class":637},[631,5448,792],{"class":677},[631,5450,5451,5453,5455,5458,5460,5462,5464,5466,5468,5470],{"class":633,"line":748},[631,5452,2135],{"class":677},[631,5454,555],{"class":637},[631,5456,5457],{"class":778},"onCancel",[631,5459,781],{"class":677},[631,5461,2079],{"class":637},[631,5463,2082],{"class":645},[631,5465,674],{"class":637},[631,5467,5444],{"class":1626},[631,5469,692],{"class":637},[631,5471,792],{"class":677},[631,5473,5474],{"class":633,"line":755},[631,5475,752],{"emptyLinePlaceholder":751},[631,5477,5478],{"class":633,"line":795},[631,5479,5480],{"class":1626},"\u002F\u002F All return an unsubscribe function:\n",[631,5482,5483,5486],{"class":633,"line":800},[631,5484,5485],{"class":778},"onBeforeUnmount",[631,5487,5488],{"class":677},"(off)\n",[2528,5490,5492],{"id":5491},"undo-redo","Undo \u002F redo",[622,5494,5496],{"className":1618,"code":5495,"language":659,"meta":627,"style":627},"session.canUndo.value \u002F\u002F Ref\u003Cboolean>\nsession.undo() \u002F\u002F returns true if something was undone\nsession.redo()\n",[507,5497,5498,5513,5528],{"__ignoreMap":627},[631,5499,5500,5502,5504,5506,5508,5511],{"class":633,"line":634},[631,5501,2135],{"class":677},[631,5503,555],{"class":637},[631,5505,5087],{"class":677},[631,5507,555],{"class":637},[631,5509,5510],{"class":677},"value ",[631,5512,5197],{"class":1626},[631,5514,5515,5517,5519,5522,5525],{"class":633,"line":667},[631,5516,2135],{"class":677},[631,5518,555],{"class":637},[631,5520,5521],{"class":778},"undo",[631,5523,5524],{"class":677},"() ",[631,5526,5527],{"class":1626},"\u002F\u002F returns true if something was undone\n",[631,5529,5530,5532,5534,5537],{"class":633,"line":707},[631,5531,2135],{"class":677},[631,5533,555],{"class":637},[631,5535,5536],{"class":778},"redo",[631,5538,5075],{"class":677},[504,5540,5541],{},"History is per-canvas, capped at 100 operations, disabled mid-edit.",[2528,5543,5545],{"id":5544},"power-user-external-entries","Power user β€” external entries",[504,5547,5548,5549,5551,5552,5555,5556,5559],{},"Plug a decal-like object that lives outside a ",[507,5550,509],{}," (custom data\nsource, server snapshot, fake entry for tests) by registering a\n",[507,5553,5554],{},"DecalEntryActions"," bundle so the ",[507,5557,5558],{},"*ById"," session methods route to it:",[622,5561,5563],{"className":1618,"code":5562,"language":659,"meta":627,"style":627},"import type { DecalEntryActions } from '@tresjs\u002Fcientos'\n\nsession.registerDecalEntry('decal-7', {\n beginEdit: () => { \u002F* … *\u002F },\n setZIndex: (newZ) => { \u002F* … *\u002F },\n setVisibility: (visible) => { \u002F* … *\u002F },\n remove: () => { \u002F* … *\u002F },\n} satisfies DecalEntryActions)\nonBeforeUnmount(() => session.unregisterDecalEntry('decal-7'))\n",[507,5564,5565,5586,5590,5611,5630,5652,5674,5691,5702],{"__ignoreMap":627},[631,5566,5567,5569,5571,5573,5576,5578,5580,5582,5584],{"class":633,"line":634},[631,5568,671],{"class":670},[631,5570,1846],{"class":670},[631,5572,674],{"class":637},[631,5574,5575],{"class":677}," DecalEntryActions",[631,5577,692],{"class":637},[631,5579,695],{"class":670},[631,5581,698],{"class":637},[631,5583,701],{"class":658},[631,5585,704],{"class":637},[631,5587,5588],{"class":633,"line":667},[631,5589,752],{"emptyLinePlaceholder":751},[631,5591,5592,5594,5596,5598,5600,5602,5605,5607,5609],{"class":633,"line":707},[631,5593,2135],{"class":677},[631,5595,555],{"class":637},[631,5597,5110],{"class":778},[631,5599,781],{"class":677},[631,5601,784],{"class":637},[631,5603,5604],{"class":658},"decal-7",[631,5606,784],{"class":637},[631,5608,681],{"class":637},[631,5610,3854],{"class":637},[631,5612,5613,5616,5618,5621,5623,5625,5627],{"class":633,"line":728},[631,5614,5615],{"class":778}," beginEdit",[631,5617,766],{"class":637},[631,5619,5620],{"class":637}," ()",[631,5622,2082],{"class":645},[631,5624,674],{"class":637},[631,5626,5444],{"class":1626},[631,5628,5629],{"class":637}," },\n",[631,5631,5632,5635,5637,5639,5642,5644,5646,5648,5650],{"class":633,"line":748},[631,5633,5634],{"class":778}," setZIndex",[631,5636,766],{"class":637},[631,5638,1475],{"class":637},[631,5640,5641],{"class":5378},"newZ",[631,5643,1744],{"class":637},[631,5645,2082],{"class":645},[631,5647,674],{"class":637},[631,5649,5444],{"class":1626},[631,5651,5629],{"class":637},[631,5653,5654,5657,5659,5661,5664,5666,5668,5670,5672],{"class":633,"line":755},[631,5655,5656],{"class":778}," setVisibility",[631,5658,766],{"class":637},[631,5660,1475],{"class":637},[631,5662,5663],{"class":5378},"visible",[631,5665,1744],{"class":637},[631,5667,2082],{"class":645},[631,5669,674],{"class":637},[631,5671,5444],{"class":1626},[631,5673,5629],{"class":637},[631,5675,5676,5679,5681,5683,5685,5687,5689],{"class":633,"line":795},[631,5677,5678],{"class":778}," remove",[631,5680,766],{"class":637},[631,5682,5620],{"class":637},[631,5684,2082],{"class":645},[631,5686,674],{"class":637},[631,5688,5444],{"class":1626},[631,5690,5629],{"class":637},[631,5692,5693,5695,5698,5700],{"class":633,"line":800},[631,5694,772],{"class":637},[631,5696,5697],{"class":670}," satisfies",[631,5699,5575],{"class":1971},[631,5701,792],{"class":677},[631,5703,5704,5706,5708,5710,5712,5714,5716,5719,5721,5723,5725,5727],{"class":633,"line":815},[631,5705,5485],{"class":778},[631,5707,781],{"class":677},[631,5709,2079],{"class":637},[631,5711,2082],{"class":645},[631,5713,5366],{"class":677},[631,5715,555],{"class":637},[631,5717,5718],{"class":778},"unregisterDecalEntry",[631,5720,781],{"class":677},[631,5722,784],{"class":637},[631,5724,5604],{"class":658},[631,5726,784],{"class":637},[631,5728,5729],{"class":677},"))\n",[2528,5731,5733],{"id":5732},"helper-utilities","Helper utilities",[4078,5735,5736,5745],{},[4081,5737,5738],{},[4084,5739,5740,5742],{},[4087,5741,315],{},[4087,5743,5744],{},"Use",[4097,5746,5747,5767,5779,5792],{},[4084,5748,5749,5754],{},[4102,5750,5751],{},[507,5752,5753],{},"ensureTextureNames(textures)",[4102,5755,5756,5757,5759,5760,5763,5764,555],{},"Back-fills ",[507,5758,1382],{}," from ",[507,5761,5762],{},"userData.name"," or the filename in ",[507,5765,5766],{},"image.src",[4084,5768,5769,5774],{},[4102,5770,5771],{},[507,5772,5773],{},"getTextureName(texture)",[4102,5775,5776,5777,555],{},"Single-texture variant β€” returns a stable name or ",[507,5778,2061],{},[4084,5780,5781,5786],{},[4102,5782,5783],{},[507,5784,5785],{},"getTextureAspect(texture)",[4102,5787,5788,5791],{},[507,5789,5790],{},"{ x, y }"," aspect ratio for custom-sized decals.",[4084,5793,5794,5799],{},[4102,5795,5796],{},[507,5797,5798],{},"invalidateDecalGeometry(mesh)",[4102,5800,5801],{},"Force a rebuild on the next frame β€” call when the parent mesh moved or swapped.",[5803,5804,5805],"style",{},"html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .sHwdD, html code.shiki .sHwdD{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic}html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}html pre.shiki code .sqsOY, html code.shiki .sqsOY{--shiki-light:#8796B0;--shiki-default:#B2CCD6;--shiki-dark:#B2CCD6}html pre.shiki code .sfNiH, html code.shiki .sfNiH{--shiki-light:#FF5370;--shiki-default:#FF9CAC;--shiki-dark:#FF9CAC}html pre.shiki code .sHdIc, html code.shiki .sHdIc{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#EEFFFF;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--shiki-dark-font-style:italic}",{"title":627,"searchDepth":634,"depth":667,"links":5807},[5808,5809,5810,5811,5812,5816,5817,5825,5826,5828,5830,5832,5834,5836,5837,5838,5839],{"id":605,"depth":667,"text":15},{"id":1189,"depth":667,"text":1190},{"id":1389,"depth":667,"text":561},{"id":1483,"depth":667,"text":1484},{"id":1578,"depth":667,"text":5813,"children":5814},"Editable mode + \u003CDecalDebugUI>",[5815],{"id":2530,"depth":707,"text":2531},{"id":2649,"depth":667,"text":1783},{"id":2748,"depth":667,"text":5818,"children":5819},"Targeting a loaded model (.glb)",[5820,5822,5824],{"id":2775,"depth":707,"text":5821},"When :object is a Mesh",{"id":3007,"depth":707,"text":5823},"When :object is a Group",{"id":3360,"depth":707,"text":3361},{"id":3814,"depth":667,"text":3815},{"id":4073,"depth":667,"text":5827},"\u003CDecal> props",{"id":4287,"depth":667,"text":5829},"\u003CDecal> events",{"id":4428,"depth":667,"text":5831},"\u003CDecal> exposed (via ref)",{"id":4601,"depth":667,"text":5833},"\u003CDecalDebugUI> props",{"id":4752,"depth":667,"text":5835},"\u003CDecalDebugUI> events",{"id":4798,"depth":667,"text":4799},{"id":4858,"depth":667,"text":4859},{"id":4933,"depth":667,"text":4934},{"id":5015,"depth":667,"text":5840},"Programmatic API (useDecalEditor)","Project a texture onto a mesh's surface β€” with an optional in-canvas editor UI.","md",null,{},{"title":53,"description":5841},"m2NsvoZvWVNeasT5e5-2uu_pua0zwIEDm3Mk9gA7pc8",[5848,5850],{"title":49,"path":50,"stem":51,"description":5849,"children":-1},"Apply smooth camera shake to the active camera.",{"title":57,"path":58,"stem":59,"description":5851,"children":-1},"Render visible edges of objects with enhanced visual quality.",1791549571647]