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