1"use strict";(globalThis.webpackChunksite=globalThis.webpackChunksite||[]).push([[2935],{51238(s,e,l){l.r(e),l.d(e,{assets:()=>t,contentTitle:()=>i,default:()=>p,frontMatter:()=>o,metadata:()=>r,toc:()=>a});const r=JSON.parse('{"id":"graphics/04.7-tint","title":"Tint","description":"Overview","source":"@site/docs/04-graphics/04.7-tint.mdx","sourceDirName":"04-graphics","slug":"/tint","permalink":"/docs/tint","draft":false,"unlisted":false,"editUrl":"https://github.com/excaliburjs/Excalibur/tree/main/site/docs/04-graphics/04.7-tint.mdx","tags":[],"version":"current","frontMatter":{"title":"Tint","slug":"/tint","section":"Graphics"},"sidebar":"learnSidebar","previous":{"title":"Nine-Slice","permalink":"/docs/nineslice"},"next":{"title":"Pixel Art","permalink":"/docs/pixel-art"}}');var n=l(74848),c=l(28453);const o={title:"Tint",slug:"/tint",section:"Graphics"},i=void 0,t={},a=[{value:"Overview",id:"overview",level:2},{value:"Example",id:"example",level:3},{value:"Opacity",id:"opacity",level:3},{value:"Clearing a Tint",id:"clearing-a-tint",level:3}];function d(s){const e={a:"a",code:"code","data-lsp":"data-lsp",div:"div",h2:"h2",h3:"h3",img:"img",li:"li",p:"p",pre:"pre",span:"span",ul:"ul",...(0,c.R)(),...s.components},r=e["data-lsp"];return(0,n.jsxs)(n.Fragment,{children:[(0,n.jsx)(e.div,{className:"shiki-twoslash-fragment"}),"\n",(0,n.jsx)(e.h2,{id:"overview",children:"Overview"}),"\n",(0,n.jsxs)(e.p,{children:["The tint property allows you to apply a color overlay to any ",(0,n.jsx)(e.a,{href:"/api/class/Graphic",title:"View 'Graphic'",className:"tsdoc-link",children:"Graphic"}),". When a ",(0,n.jsx)(e.a,{href:"/api/class/Graphic#tint",title:"View 'tint'",className:"tsdoc-link tsdoc-link--aliased",children:"Tint"})," is set, its color is multiplied with the original pixel colors of the graphic, allowing you to easily recolor or visually modify sprites, shapes, and other graphics."]}),"\n",(0,n.jsx)(e.p,{children:"This is useful for effects like:"}),"\n",(0,n.jsxs)(e.ul,{children:["\n",(0,n.jsx)(e.li,{children:"Changing a character\u2019s outfit color"}),"\n",(0,n.jsx)(e.li,{children:"Flashing a sprite red when taking damage"}),"\n",(0,n.jsx)(e.li,{children:"Applying a global mood or atmosphere tint"}),"\n"]}),"\n",(0,n.jsx)(e.h3,{id:"example",children:"Example"}),"\n",(0,n.jsx)(e.p,{children:"Start with a simple Actor with a Sprite attached to it."}),"\n",(0,n.jsxs)(e.div,{className:"shiki-twoslash-fragment",children:[(0,n.jsxs)(e.pre,{className:"shiki github-light twoslash lsp",style:{backgroundColor:"#ffffff",color:"#24292f"},children:[(0,n.jsx)(e.div,{className:"language-id",children:"ts"}),(0,n.jsx)(e.div,{className:"code-container",children:(0,n.jsxs)(e.code,{children:[(0,n.jsxs)(e.div,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#CF222E"},children:"class"}),(0,n.jsx)(e.span,{style:{color:"#24292F"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#953800"},children:(0,n.jsx)(r,{lsp:"class TintActor",children:"TintActor"})}),(0,n.jsx)(e.span,{style:{color:"#24292F"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#CF222E"},children:"extends"}),(0,n.jsx)(e.span,{style:{color:"#24292F"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#953800"},children:(0,n.jsx)(r,{lsp:"export namespace ex",children:"ex"})}),(0,n.jsx)(e.span,{style:{color:"#24292F"},children:"."}),(0,n.jsx)(e.span,{style:{color:"#0550AE"},children:(0,n.jsx)(r,{lsp:"class Actor",children:"Actor"})}),(0,n.jsx)(e.span,{style:{color:"#24292F"},children:" {"})]}),(0,n.jsxs)(e.div,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#24292F"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#CF222E"},children:"constructor"}),(0,n.jsx)(e.span,{style:{color:"#24292F"},children:"("}),(0,n.jsx)(e.span,{style:{color:"#953800"},children:(0,n.jsx)(r,{lsp:"(parameter) center: ex.Vector",children:"center"})}),(0,n.jsx)(e.span,{style:{color:"#CF222E"},children:":"}),(0,n.jsx)(e.span,{style:{color:"#953800"},children:(0,n.jsx)(r,{lsp:"export namespace ex",children:"ex"})}),(0,n.jsx)(e.span,{style:{color:"#24292F"},children:"."}
1),(0,n.jsx)(e.span,{style:{color:"#953800"},children:(0,n.jsx)(r,{lsp:"class Vector",children:"Vector"})}),(0,n.jsx)(e.span,{style:{color:"#24292F"},children:") {"})]}),(0,n.jsxs)(e.div,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#24292F"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#0550AE"},children:"super"}),(0,n.jsxs)(e.span,{style:{color:"#24292F"},children:["({ ",(0,n.jsx)(r,{lsp:"(property) width?: number | undefined",children:"width"}),": "]}),(0,n.jsx)(e.span,{style:{color:"#0550AE"},children:"100"}),(0,n.jsxs)(e.span,{style:{color:"#24292F"},children:[", ",(0,n.jsx)(r,{lsp:"(property) height?: number | undefined",children:"height"}),": "]}),(0,n.jsx)(e.span,{style:{color:"#0550AE"},children:"100"}),(0,n.jsxs)(e.span,{style:{color:"#24292F"},children:[", ",(0,n.jsx)(r,{lsp:"(property) pos?: ex.Vector | undefined",children:"pos"}),": ",(0,n.jsx)(r,{lsp:"(parameter) center: ex.Vector",children:"center"})," });"]})]}),(0,n.jsxs)(e.div,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#24292F"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#6E7781"},children:"// Pretend this is our loaded sprite"})]}),(0,n.jsxs)(e.div,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#24292F"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#CF222E"},children:"const"}),(0,n.jsx)(e.span,{style:{color:"#24292F"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#0550AE"},children:(0,n.jsx)(r,{lsp:"const swordSprite: ex.Sprite",children:"swordSprite"})}),(0,n.jsx)(e.span,{style:{color:"#24292F"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#CF222E"},children:"="}),(0,n.jsx)(e.span,{style:{color:"#24292F"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#CF222E"},children:"new"}),(0,n.jsxs)(e.span,{style:{color:"#24292F"},children:[" ",(0,n.jsx)(r,{lsp:"export namespace ex",children:"ex"}),"."]}),(0,n.jsx)(e.span,{style:{color:"#8250DF"},children:(0,n.jsx)(r,{lsp:"constructor Sprite(options: ex.GraphicOptions & ex.SpriteOptions): ex.Sprite",children:"Sprite"})}),(0,n.jsxs)(e.span,{style:{color:"#24292F"},children:["({ ",(0,n.jsx)(r,{lsp:"(property) SpriteOptions.image: ex.ImageSource",children:"image"}),": "]}),(0,n.jsx)(e.span,{style:{color:"#CF222E"},children:"new"}),(0,n.jsxs)(e.span,{style:{color:"#24292F"},children:[" ",(0,n.jsx)(r,{lsp:"export namespace ex",children:"ex"}),"."]}),(0,n.jsx)(e.span,{style:{color:"#8250DF"},children:(0,n.jsx)(r,{lsp:"constructor ImageSource(pathOrBase64: string, options?: ex.ImageSourceOptions): ex.ImageSource (+1 overload)",children:"ImageSource"})}),(0,n.jsx)(e.span,{style:{color:"#24292F"},children:"("}),(0,n.jsx)(e.span,{style:{color:"#0A3069"},children:"'./sword.png'"}),(0,n.jsx)(e.span,{style:{color:"#24292F"},children:") });"})]}),(0,n.jsxs)(e.div,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#24292F"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#0550AE"},children:"this"}),(0,n.jsxs)(e.span,{style:{color:"#24292F"},children:[".",(0,n.jsx)(r,{lsp:"(property) Actor.graphics: ex.GraphicsComponent",children:"graphics"}),"."]}),(0,n.jsx)(e.span,{style:{color:"#8250DF"},children:(0,n.jsx)(r,{lsp:"(method) GraphicsComponent.use<ex.Sprite>(nameOrGraphic: string | ex.Sprite, options?: ex.GraphicsShowOptions): ex.Sprite",children:"use"})}),(0,n.jsxs)(e.span,{style:{color:"#24292F"},children:["(",(0,n.jsx)(r,{lsp:"const swordSprite: ex.Sprite",children:"swordSprite"}),");"]})]}),(0,n.jsx)(e.div,{className:"line",children:(0,n.jsx)(e.span,{style:{color:"#24292F"},children:" }"})}),(0,n.jsx)(e.div,{className:"line",children:(0,n.jsx)(e.span,{style:{color:"#24292F"},children:"}"})}),(0,n.jsx)(e.div,{className:"line",children:"\xa0"}),(0,n.jsxs)(e.div,{className:"line",children:[(0,n.jsxs)(e.span,{style:{color:"#24292F"},children:[(0,n.jsx)(r,{lsp:"const game: ex.Engine<any>",children:"game"}),"."]}),(0,n.jsx)(e.span,{style:{color:"#8250DF"},children:(0,n.jsx)(r,{lsp:"(method) Engine<any>.add(actor: ex.Actor): void (+5 overloads)",children:"add"})}),(0,n.jsx)(e.span,{style:{color:"#24292F"},children:"("}),(0,n.jsx)(e.span,{style:{color:"#CF222E"},children:"new"}),(0,n.jsx)(e.span,{style:{color:"#24292F"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#8250DF"},children:(0,n.jsx)(r,{lsp:"constructor TintActor(center: ex.Vector): TintActor",children:"TintActor"})}),(0,n.jsxs)(e.span,{style:{color:"#24292F"},children:["(",(0,n.jsx)(r,{lsp:"const game: ex.Engine<any>",children:"game"}),".",(0,n.jsx)(r,{lsp:"(property) Engine<any>.screen: ex.Screen",children:"screen"}),".",(0,n.jsx)(r,{lsp:"(property) Screen.center: ex.Vector",children:"center"}),"));"]})]})]})})]}),"\n",(0,n.jsxs)(e.pre,{className:"shiki github-dark twoslash lsp",style:{backgroundColor:"#0d1117",color:"#c9d1d9"},children:[(0,n.jsx)(e.div,{className:"language-id",children:"ts"}),(0,n.jsx)(e.div,{className:"code-container",children:(0,n.jsxs)(e.code,{children:[(0,n.jsxs)(e.div,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FF7B72"},children:"class"}),(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#FFA657"},children:(0,n.jsx)(r,{lsp:"class TintActor",children:"TintActor"})}),(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#FF7B72"},children:"extends"}),(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#FFA657"},children:(0,n.jsx)(r,{lsp:"export namespace ex",children:"ex"})}),(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:"."}),(0,n.jsx)(e.span,{style:{color:"#79C0FF"},children:(0,n.jsx)(r,{lsp:"class Actor",children:"Actor"})}),(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:" {"})]}),(0,n.jsxs)(e.div,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#FF7B72"},children:"constructor"}),(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:"("}),(0,n.jsx)(e.span,{style:{color:"#FFA657"},children:(0,n.jsx)(r,{lsp:"(parameter) center: ex.Vector",children:"center"})}),(0,n.jsx)(e.span,{style:{color:"#FF7B72"},children:":"}),(0,n.jsx)(e.span,{style:{color:"#FFA657"},children:(0,n.jsx)(r,{lsp:"export namespace ex",children:"ex"})}),(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:"."}),(0,n.jsx)(e.span,{style:{color:"#FFA657"},children:(0,n.jsx)(r,{lsp:"class Vector",children:"Vector"})}),(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:") {"})]}),(0,n.jsxs)(e.div,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#79C0FF"},children:"super"}),(0,n.jsxs)(e.span,{style:{color:"#C9D1D9"},children:["({ ",(0,n.jsx)(r,{lsp:"(property) width?: number | undefined",children:"width"}),": "]}),(0,n.jsx)(e.span,{style:{color:"#79C0FF"},children:"100"}),(0,n.jsxs)(e.span,{style:{color:"#C9D1D9"},children:[", ",(0,n.jsx)(r,{lsp:"(property) height?: number | undefined",children:"height"}),": "]}),(0,n.jsx)(e.span,{style:{color:"#79C0FF"},children:"100"}),(0,n.jsxs)(e.span,{style:{color:"#C9D1D9"},children:[", ",(0,n.jsx)(r,{lsp:"(property) pos?: ex.Vector | undefined",children:"pos"}),": ",(0,n.jsx)(r,{lsp:"(parameter) center: ex.Vector",children:"center"})," });"]})]}),(0,n.jsxs)(e.div,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#8B949E"},children:"// Pretend this is our loaded sprite"})]}),(0,n.jsxs)(e.div,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#FF7B72"},children:"const"}),(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#79C0FF"},children:(0,n.jsx)(r,{lsp:"const swordSprite: ex.Sprite",children:"swordSprite"})}),(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#FF7B72"},children:"="}),(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#FF7B72"},children:"new"}),(0,n.jsxs)(e.span,{style:{color:"#C9D1D9"},children:[" ",(0,n.jsx)(r,{lsp:"export namespace ex",children:"ex"}),"."]}),(0,n.jsx)(e.span,{style:{color:"#D2A8FF"},children:(0,n.jsx)(r,{lsp:"constructor Sprite(options: ex.GraphicOptions & ex.SpriteOptions): ex.Sprite",children:"Sprite"})}),(0,n.jsxs)(e.span,{style:{color:"#C9D1D9"},children:["({ ",(0,n.jsx)(r,{lsp:"(property) SpriteOptions.image: ex.ImageSource",children:"image"}),": "]}),(0,n.jsx)(e.span,{style:{color:"#FF7B72"},children:"new"}),(0,n.jsxs)(e.span,{style:{color:"#C9D1D9"},children:[" ",(0,n.jsx)(r,{lsp:"export namespace ex",children:"ex"}),"."]}),(0,n.jsx)(e.span,{style:{color:"#D2A8FF"},children:(0,n.jsx)(r,{lsp:"constructor ImageSource(pathOrBase64: string, options?: ex.ImageSourceOptions): ex.ImageSource (+1 overload)",children:"ImageSource"})}),(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:"("}),(0,n.jsx)(e.span,{style:{color:"#A5D6FF"},children:"'./sword.png'"}),(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:") });"})]}),(0,n.jsxs)(e.div,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#79C0FF"},children:"this"}),(0,n.jsxs)(e.span,{style:{color:"#C9D1D9"},children:[".",(0,n.jsx)(r,{lsp:"(property) Actor.graphics: ex.GraphicsComponent",children:"graphics"}),"."]}),(0,n.jsx)(e.span,{style:{color:"#D2A8FF"},children:(0,n.jsx)(r,{lsp:"(method) GraphicsComponent.use<ex.Sprite>(nameOrGraphic: string | ex.Sprite, options?: ex.GraphicsShowOptions): ex.Sprite",children:"use"})}),(0,n.jsxs)(e.span,{style:{color:"#C9D1D9"},children:["(",(0,n.jsx)(r,{lsp:"const swordSprite: ex.Sprite",children:"swordSprite"}),");"]})]}),(0,n.jsx)(e.div,{className:"line",children:(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:" }"})}),(0,n.jsx)(e.div,{className:"line",children:(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:"}"})}),(0,n.jsx)(e.div,{className:"line",children:"\xa0"}),(0,n.jsxs)(e.div,{className:"line",children:[(0,n.jsxs)(e.span,{style:{color:"#C9D1D9"},children:[(0,n.jsx)(r,{lsp:"const game: ex.Engine<any>",children:"game"}),"."]}),(0,n.jsx)(e.span,{style:{color:"#D2A8FF"},children:(0,n.jsx)(r,{lsp:"(method) Engine<any>.add(actor: ex.Actor): void (+5 overloads)",children:"add"})}),(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:"("}),(0,n.jsx)(e.span,{style:{color:"#FF7B72"},children:"new"}),(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#D2A8FF"},children:(0,n.jsx)(r,{lsp:"constructor TintActor(center: ex.Vector): TintActor",children:"TintActor"})}),(0,n.jsxs)(e.span,{style:{color:"#C9D1D9"},children:["(",(0,n.jsx)(r,{lsp:"const game: ex.Engine<any>",children:"game"}),".",(0,n.jsx)(r,{lsp:"(property) Engine<any>.screen: ex.Screen",children:"screen"}),".",(0,n.jsx)(r,{lsp:"(property) Screen.center: ex.Vector",children:"center"}),"));"]})]})]})})]})]}),"\n",(0,n.jsx)(e.p,{children:"This will give you an Actor like this:"}),"\n",(0,n.jsx)(e.p,{children:(0,n.jsx)(e.img,{alt:"Untinted Sword",src:l(47168).A+"",width:"120",height:"120"})}),"\n",(0,n.jsx)(e.p,{children:"To add a light red tint to it we need to tweak this to add the tint to the graphic."}),"\n",(0,n.jsxs)(e.div,{className:"shiki-twoslash-fragment",children:[(0,n.jsxs)(e.pre,{className:"shiki github-light twoslash lsp",style:{backgroundColor:"#ffffff",color:"#24292f"},children:[(0,n.jsx)(e.div,{className:"language-id",children:"ts"}),(0,n.jsx)(e.div,{className:"code-container",children:(0,n.jsxs)(e.code,{children:[(0,n.jsxs)(e.div,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#CF222E"},children:"class"}),(0,n.jsx)(e.span,{style:{color:"#24292F"},children:" "}
1),(0,n.jsx)(e.span,{style:{color:"#953800"},children:(0,n.jsx)(r,{lsp:"class TintActor",children:"TintActor"})}),(0,n.jsx)(e.span,{style:{color:"#24292F"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#CF222E"},children:"extends"}),(0,n.jsx)(e.span,{style:{color:"#24292F"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#953800"},children:(0,n.jsx)(r,{lsp:"export namespace ex",children:"ex"})}),(0,n.jsx)(e.span,{style:{color:"#24292F"},children:"."}),(0,n.jsx)(e.span,{style:{color:"#0550AE"},children:(0,n.jsx)(r,{lsp:"class Actor",children:"Actor"})}),(0,n.jsx)(e.span,{style:{color:"#24292F"},children:" {"})]}),(0,n.jsx)(e.div,{className:"line",children:"\xa0"}),(0,n.jsxs)(e.div,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#24292F"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#CF222E"},children:"constructor"}),(0,n.jsx)(e.span,{style:{color:"#24292F"},children:"("}),(0,n.jsx)(e.span,{style:{color:"#953800"},children:(0,n.jsx)(r,{lsp:"(parameter) center: ex.Vector",children:"center"})}),(0,n.jsx)(e.span,{style:{color:"#CF222E"},children:":"}),(0,n.jsx)(e.span,{style:{color:"#953800"},children:(0,n.jsx)(r,{lsp:"export namespace ex",children:"ex"})}),(0,n.jsx)(e.span,{style:{color:"#24292F"},children:"."}),(0,n.jsx)(e.span,{style:{color:"#953800"},children:(0,n.jsx)(r,{lsp:"class Vector",children:"Vector"})}),(0,n.jsx)(e.span,{style:{color:"#24292F"},children:", "}),(0,n.jsx)(e.span,{style:{color:"#953800"},children:(0,n.jsx)(r,{lsp:"(parameter) tint: ex.Color",children:"tint"})}),(0,n.jsx)(e.span,{style:{color:"#CF222E"},children:":"}),(0,n.jsx)(e.span,{style:{color:"#24292F"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#953800"},children:(0,n.jsx)(r,{lsp:"export namespace ex",children:"ex"})}),(0,n.jsx)(e.span,{style:{color:"#24292F"},children:"."}),(0,n.jsx)(e.span,{style:{color:"#953800"},children:(0,n.jsx)(r,{lsp:"class Color",children:"Color"})}),(0,n.jsx)(e.span,{style:{color:"#24292F"},children:") { "}),(0,n.jsx)(e.span,{style:{color:"#6E7781"},children:"//<------------- added Tint parameter"})]}),(0,n.jsxs)(e.div,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#24292F"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#0550AE"},children:"super"}),(0,n.jsxs)(e.span,{style:{color:"#24292F"},children:["({ ",(0,n.jsx)(r,{lsp:"(property) width?: number | undefined",children:"width"}),": "]}),(0,n.jsx)(e.span,{style:{color:"#0550AE"},children:"100"}),(0,n.jsxs)(e.span,{style:{color:"#24292F"},children:[", ",(0,n.jsx)(r,{lsp:"(property) height?: number | undefined",children:"height"}),": "]}),(0,n.jsx)(e.span,{style:{color:"#0550AE"},children:"100"}),(0,n.jsxs)(e.span,{style:{color:"#24292F"},children:[", ",(0,n.jsx)(r,{lsp:"(property) pos?: ex.Vector | undefined",children:"pos"}),": ",(0,n.jsx)(r,{lsp:"(parameter) center: ex.Vector",children:"center"})," });"]})]}),(0,n.jsxs)(e.div,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#24292F"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#6E7781"},children:"// Pretend this is our loaded sprite"})]}),(0,n.jsxs)(e.div,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#24292F"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#CF222E"},children:"const"}),(0,n.jsx)(e.span,{style:{color:"#24292F"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#0550AE"},children:(0,n.jsx)(r,{lsp:"const swordSprite: ex.Sprite",children:"swordSprite"})}),(0,n.jsx)(e.span,{style:{color:"#24292F"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#CF222E"},children:"="}),(0,n.jsx)(e.span,{style:{color:"#24292F"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#CF222E"},children:"new"}),(0,n.jsxs)(e.span,{style:{color:"#24292F"},children:[" ",(0,n.jsx)(r,{lsp:"export namespace ex",children:"ex"}),"."]}),(0,n.jsx)(e.span,{style:{color:"#8250DF"},children:(0,n.jsx)(r,{lsp:"constructor Sprite(options: ex.GraphicOptions & ex.SpriteOptions): ex.Sprite",children:"Sprite"})}),(0,n.jsxs)(e.span,{style:{color:"#24292F"},children:["({ ",(0,n.jsx)(r,{lsp:"(property) SpriteOptions.image: ex.ImageSource",children:"image"}),": "]}),(0,n.jsx)(e.span,{style:{color:"#CF222E"},children:"new"}),(0,n.jsxs)(e.span,{style:{color:"#24292F"},children:[" ",(0,n.jsx)(r,{lsp:"export namespace ex",children:"ex"}),"."]}),(0,n.jsx)(e.span,{style:{color:"#8250DF"},children:(0,n.jsx)(r,{lsp:"constructor ImageSource(pathOrBase64: string, options?: ex.ImageSourceOptions): ex.ImageSource (+1 overload)",children:"ImageSource"})}),(0,n.jsx)(e.span,{style:{color:"#24292F"},children:"("}),(0,n.jsx)(e.span,{style:{color:"#0A3069"},children:"'./sword.png'"}),(0,n.jsx)(e.span,{style:{color:"#24292F"},children:") });"})]}),(0,n.jsxs)(e.div,{className:"line",children:[(0,n.jsxs)(e.span,{style:{color:"#24292F"},children:[" ",(0,n.jsx)(r,{lsp:"const swordSprite: ex.Sprite",children:"swordSprite"}),".",(0,n.jsx)(r,{lsp:"(property) Graphic.tint?: ex.Color | undefined",children:"tint"})," "]}),(0,n.jsx)(e.span,{style:{color:"#CF222E"},children:"="}),(0,n.jsxs)(e.span,{style:{color:"#24292F"},children:[" ",(0,n.jsx)(r,{lsp:"(parameter) tint: ex.Color",children:"tint"}),"; "]}),(0,n.jsx)(e.span,{style:{color:"#6E7781"},children:"//<------------- setting the Graphic's tint property"})]}),(0,n.jsxs)(e.div,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#24292F"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#0550AE"},children:"this"}),(0,n.jsxs)(e.span,{style:{color:"#24292F"},children:[".",(0,n.jsx)(r,{lsp:"(property) Actor.graphics: ex.GraphicsComponent",children:"graphics"}),"."]}),(0,n.jsx)(e.span,{style:{color:"#8250DF"},children:(0,n.jsx)(r,{lsp:"(method) GraphicsComponent.use<ex.Sprite>(nameOrGraphic: string | ex.Sprite, options?: ex.GraphicsShowOptions): ex.Sprite",children:"use"})}),(0,n.jsxs)(e.span,{style:{color:"#24292F"},children:["(",(0,n.jsx)(r,{lsp:"const swordSprite: ex.Sprite",children:"swordSprite"}),");"]})]}),(0,n.jsx)(e.div,{className:"line",children:(0,n.jsx)(e.span,{style:{color:"#24292F"},children:" }"})}),(0,n.jsx)(e.div,{className:"line",children:(0,n.jsx)(e.span,{style:{color:"#24292F"},children:"}"})}),(0,n.jsx)(e.div,{className:"line",children:"\xa0"}),(0,n.jsxs)(e.div,{className:"line",children:[(0,n.jsxs)(e.span,{style:{color:"#24292F"},children:[(0,n.jsx)(r,{lsp:"const game: ex.Engine<any>",children:"game"}),"."]}),(0,n.jsx)(e.span,{style:{color:"#8250DF"},children:(0,n.jsx)(r,{lsp:"(method) Engine<any>.add(actor: ex.Actor): void (+5 overloads)",children:"add"})}),(0,n.jsx)(e.span,{style:{color:"#24292F"},children:"("}),(0,n.jsx)(e.span,{style:{color:"#CF222E"},children:"new"}),(0,n.jsx)(e.span,{style:{color:"#24292F"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#8250DF"},children:(0,n.jsx)(r,{lsp:"constructor TintActor(center: ex.Vector, tint: ex.Color): TintActor",children:"TintActor"})}),(0,n.jsxs)(e.span,{style:{color:"#24292F"},children:["(",(0,n.jsx)(r,{lsp:"const game: ex.Engine<any>",children:"game"}),".",(0,n.jsx)(r,{lsp:"(property) Engine<any>.screen: ex.Screen",children:"screen"}),".",(0,n.jsx)(r,{lsp:"(property) Screen.center: ex.Vector",children:"center"}),", ",(0,n.jsx)(r,{lsp:"export namespace ex",children:"ex"}),".",(0,n.jsx)(r,{lsp:"class Color",children:"Color"}),"."]}),(0,n.jsx)(e.span,{style:{color:"#8250DF"},children:(0,n.jsx)(r,{lsp:"(method) Color.fromHex(hex: string): ex.C
1olor",children:"fromHex"})}),(0,n.jsx)(e.span,{style:{color:"#24292F"},children:"("}),(0,n.jsx)(e.span,{style:{color:"#0A3069"},children:'"#FF000050"'}),(0,n.jsx)(e.span,{style:{color:"#24292F"},children:")));"})]})]})})]}),"\n",(0,n.jsxs)(e.pre,{className:"shiki github-dark twoslash lsp",style:{backgroundColor:"#0d1117",color:"#c9d1d9"},children:[(0,n.jsx)(e.div,{className:"language-id",children:"ts"}),(0,n.jsx)(e.div,{className:"code-container",children:(0,n.jsxs)(e.code,{children:[(0,n.jsxs)(e.div,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#FF7B72"},children:"class"}),(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#FFA657"},children:(0,n.jsx)(r,{lsp:"class TintActor",children:"TintActor"})}),(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#FF7B72"},children:"extends"}),(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#FFA657"},children:(0,n.jsx)(r,{lsp:"export namespace ex",children:"ex"})}),(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:"."}),(0,n.jsx)(e.span,{style:{color:"#79C0FF"},children:(0,n.jsx)(r,{lsp:"class Actor",children:"Actor"})}),(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:" {"})]}),(0,n.jsx)(e.div,{className:"line",children:"\xa0"}),(0,n.jsxs)(e.div,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#FF7B72"},children:"constructor"}),(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:"("}),(0,n.jsx)(e.span,{style:{color:"#FFA657"},children:(0,n.jsx)(r,{lsp:"(parameter) center: ex.Vector",children:"center"})}),(0,n.jsx)(e.span,{style:{color:"#FF7B72"},children:":"}),(0,n.jsx)(e.span,{style:{color:"#FFA657"},children:(0,n.jsx)(r,{lsp:"export namespace ex",children:"ex"})}),(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:"."}),(0,n.jsx)(e.span,{style:{color:"#FFA657"},children:(0,n.jsx)(r,{lsp:"class Vector",children:"Vector"})}),(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:", "}),(0,n.jsx)(e.span,{style:{color:"#FFA657"},children:(0,n.jsx)(r,{lsp:"(parameter) tint: ex.Color",children:"tint"})}),(0,n.jsx)(e.span,{style:{color:"#FF7B72"},children:":"}),(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#FFA657"},children:(0,n.jsx)(r,{lsp:"export namespace ex",children:"ex"})}),(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:"."}),(0,n.jsx)(e.span,{style:{color:"#FFA657"},children:(0,n.jsx)(r,{lsp:"class Color",children:"Color"})}),(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:") { "}),(0,n.jsx)(e.span,{style:{color:"#8B949E"},children:"//<------------- added Tint parameter"})]}),(0,n.jsxs)(e.div,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#79C0FF"},children:"super"}),(0,n.jsxs)(e.span,{style:{color:"#C9D1D9"},children:["({ ",(0,n.jsx)(r,{lsp:"(property) width?: number | undefined",children:"width"}),": "]}),(0,n.jsx)(e.span,{style:{color:"#79C0FF"},children:"100"}),(0,n.jsxs)(e.span,{style:{color:"#C9D1D9"},children:[", ",(0,n.jsx)(r,{lsp:"(property) height?: number | undefined",children:"height"}),": "]}),(0,n.jsx)(e.span,{style:{color:"#79C0FF"},children:"100"}),(0,n.jsxs)(e.span,{style:{color:"#C9D1D9"},children:[", ",(0,n.jsx)(r,{lsp:"(property) pos?: ex.Vector | undefined",children:"pos"}),": ",(0,n.jsx)(r,{lsp:"(parameter) center: ex.Vector",children:"center"})," });"]})]}),(0,n.jsxs)(e.div,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#8B949E"},children:"// Pretend this is our loaded sprite"})]}),(0,n.jsxs)(e.div,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#FF7B72"},children:"const"}),(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#79C0FF"},children:(0,n.jsx)(r,{lsp:"const swordSprite: ex.Sprite",children:"swordSprite"})}),(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#FF7B72"},children:"="}),(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#FF7B72"},children:"new"}),(0,n.jsxs)(e.span,{style:{color:"#C9D1D9"},children:[" ",(0,n.jsx)(r,{lsp:"export namespace ex",children:"ex"}),"."]}),(0,n.jsx)(e.span,{style:{color:"#D2A8FF"},children:(0,n.jsx)(r,{lsp:"constructor Sprite(options: ex.GraphicOptions & ex.SpriteOptions): ex.Sprite",children:"Sprite"})}),(0,n.jsxs)(e.span,{style:{color:"#C9D1D9"},children:["({ ",(0,n.jsx)(r,{lsp:"(property) SpriteOptions.image: ex.ImageSource",children:"image"}),": "]}),(0,n.jsx)(e.span,{style:{color:"#FF7B72"},children:"new"}),(0,n.jsxs)(e.span,{style:{color:"#C9D1D9"},children:[" ",(0,n.jsx)(r,{lsp:"export namespace ex",children:"ex"}),"."]}),(0,n.jsx)(e.span,{style:{color:"#D2A8FF"},children:(0,n.jsx)(r,{lsp:"constructor ImageSource(pathOrBase64: string, options?: ex.ImageSourceOptions): ex.ImageSource (+1 overload)",children:"ImageSource"})}),(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:"("}),(0,n.jsx)(e.span,{style:{color:"#A5D6FF"},children:"'./sword.png'"}),(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:") });"})]}),(0,n.jsxs)(e.div,{className:"line",children:[(0,n.jsxs)(e.span,{style:{color:"#C9D1D9"},children:[" ",(0,n.jsx)(r,{lsp:"const swordSprite: ex.Sprite",children:"swordSprite"}),".",(0,n.jsx)(r,{lsp:"(property) Graphic.tint?: ex.Color | undefined",children:"tint"})," "]}),(0,n.jsx)(e.span,{style:{color:"#FF7B72"},children:"="}),(0,n.jsxs)(e.span,{style:{color:"#C9D1D9"},children:[" ",(0,n.jsx)(r,{lsp:"(parameter) tint: ex.Color",children:"tint"}),"; "]}),(0,n.jsx)(e.span,{style:{color:"#8B949E"},children:"//<------------- setting the Graphic's tint property"})]}),(0,n.jsxs)(e.div,{className:"line",children:[(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#79C0FF"},children:"this"}),(0,n.jsxs)(e.span,{style:{color:"#C9D1D9"},children:[".",(0,n.jsx)(r,{lsp:"(property) Actor.graphics: ex.GraphicsComponent",children:"graphics"}),"."]}),(0,n.jsx)(e.span,{style:{color:"#D2A8FF"},children:(0,n.jsx)(r,{lsp:"(method) GraphicsComponent.use<ex.Sprite>(nameOrGraphic: string | ex.Sprite, options?: ex.GraphicsShowOptions): ex.Sprite",children:"use"})}),(0,n.jsxs)(e.span,{style:{color:"#C9D1D9"},children:["(",(0,n.jsx)(r,{lsp:"const swordSprite: ex.Sprite",children:"swordSprite"}),");"]})]}),(0,n.jsx)(e.div,{className:"line",children:(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:" }"})}),(0,n.jsx)(e.div,{className:"line",children:(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:"}"})}),(0,n.jsx)(e.div,{className:"line",children:"\xa0"}),(0,n.jsxs)(e.div,{className:"line",children:[(0,n.jsxs)(e.span,{style:{color:"#C9D1D9"},children:[(0,n.jsx)(r,{lsp:"const game: ex.Engine<any>",children:"game"}),"."]}),(0,n.jsx)(e.span,{style:{color:"#D2A8FF"},children:(0,n.jsx)(r,{lsp:"(method) Engine<any>.add(actor: ex.Actor): void (+5 overloads)",children:"add"})}),(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:"("}),(0,n.jsx)(e.span,{style:{color:"#FF7B72"},children:"new"}),(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:" "}),(0,n.jsx)(e.span,{style:{color:"#D2A8FF"},children:(0,n.jsx)(r,{lsp:"constructor TintActor(center: ex.Vector, tint: ex.Color): TintActor",children:"TintActor"})}),(0,n.jsxs)(e.span,{style:{color:"#C9D1D9"},children:["(",(0,n.jsx)(r,{lsp:"const game: ex.Engine<any>",children:"game"}),".",(0,n.jsx)(r,{lsp:"(property) Engine<any>.screen: ex.Screen",children:"screen"}),".",(0,n.jsx)(r,{lsp:"(property) Screen.center: ex.Vector",children:"center"}),", ",(0,n.jsx)(r,{lsp:"export namespace ex",children:"ex"}),".",(0,n.jsx)(r,{lsp:"class Color",children:"Color"}),"."]}),(0,n.jsx)(e.span,{style:{color:"#D2A8FF"},children:(0,n.jsx)(r,{lsp:"(method) Color.fromHex(hex: string): ex.C
1olor",children:"fromHex"})}),(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:"("}),(0,n.jsx)(e.span,{style:{color:"#A5D6FF"},children:'"#FF000050"'}),(0,n.jsx)(e.span,{style:{color:"#C9D1D9"},children:")));"})]})]})})]})]}),"\n",(0,n.jsx)(e.p,{children:"Gives you:"}),"\n",(0,n.jsx)(e.p,{children:(0,n.jsx)(e.img,{alt:"Tinted Sword",src:l(76976).A+"",width:"120",height:"120"})}),"\n",(0,n.jsx)(e.h3,{id:"opacity",children:"Opacity"}),"\n",(0,n.jsx)(e.p,{children:"To control 'how much' tinting is applied to a Graphic you can use the alpha channel of the color to lighten or deepen its tinting."}),"\n",(0,n.jsx)(e.p,{children:(0,n.jsx)(e.img,{alt:"Opacity of tint",src:l(2640).A+"",width:"600",height:"120"})}),"\n",(0,n.jsx)(e.h3,{id:"clearing-a-tint",children:"Clearing a Tint"}),"\n",(0,n.jsxs)(e.p,{children:["To clear a tint from a graphic, just set its tint to white ",(0,n.jsx)(e.code,{children:"#FFFFFF"})]})]})}function p(s={}){const{wrapper:e}={...(0,c.R)(),...s.components};return e?(0,n.jsx)(e,{...s,children:(0,n.jsx)(d,{...s})}):d(s)}},2640(s,e,l){l.d(e,["A",0,"data:image/png;base64,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"])},47168(s,e,l){l.d(e,["A",0,"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHgAAAB4CAYAAAA5ZDbSAAAFV0lEQVR4nO2cz2sc
1ZRjHv+87826yRAsiVSSx+YGESkXqQQWNbdN2q+hBQQIVvPSiF/8C70XRixdTsIqgFOMPvItYvHi1tcluEg8eBSVgU5Jsd2ZnXg/GmXknmU3SkOzss9/PKc+87wxv8pl5npl33owav3zTgohFd3sA5GChYOFQsHAoWDgULBwKFg4FC4eChUPBwqFg4VCwcChYOBQsHAoWDgULh4KFQ8HCoWDhULBwKFg4FCwcChYOBQuHgoVDwcKhYOFQsHAoWDgULBwKFg4FC4eChUPBwvG7PYBepRLcgUK8Y7/AHIFV3buOKPgeOb78Gfxwbcd+9RPvoDXwwKGMaTsoeJeYYBUqEw9WDHxvsLB/GIawtvufP6HgXfL44lX4UTOJp86cQaVSKew/Pz+PVqsFrbt7m8ObLOFQsHCYogsw4RqQqaEDFQM/Lr5r9jzvkEa2Nyi4gBONWeiolcSnpqdhjCnsPzw8DN9P/5wLCwtotVqF/Q8LpmjhULBwmKI38aOmU3MrxkB7xc+x+ZobRZETB2oAoRcDSqGbUPAmT9z6CNq2k/jU2bNOTc0zMjLiSF5eXkYYhkn8y9HXcMdWD3DEu4MpWjgULJy+TdFe5D7CGGOgMo+5Klc781OOce6ZOLAeQqQ126K7tfd/+lbwk7c+hMrcVE2fP99x3vjYsWNO+9LSEtrttGZ/3nwOa3bgAEd8bzBFC4eChdM3KVrHoRN7nuek6Dz5GpyvuW1ohLb810dfCFbW4uTN951t52q1LRKzjI6OOjV3cXHRmcz4tPk8Nmzx++CyUP5TkOwLChaO2BStbFozFeKO6Rjb1FxrrbOmKv7vKNkdgO4vudoRkYK1bePkjfeSWCmFWq3WcZ+xsTFHcqPRcG6sPmlO4a4tfh9cVpiihUPBwqFg4fREDa62/8EbyzNJ3PKO4Nrx75NYRy2c/O2DNNYa5y9c6HjMiYkJJ67X685N1ZWNFxD2xp+nI7yChUPBwqFg4ZSyyAy1VzDz+5tJPGA0zj47nMRBO4b59aUk1l4FR2vvdjzm+Pi4E9frdSeeXZ9ChHSNVVySF/b7pZSCrbXOAjhlPWcSQivVsX07tmvvOFMlBKZo4VCwcEqZonfC+Bq1Z9KaHMNgPtOulMLY2FgSW2vRaDScY8yuTwGZTytEQs/1nhQMAJ7O1suttXOnFRkRfMQ98DZov8g8bUkCBQtHjV++WbpEpRDDZL6HMRjdxsU/LiWx8RVOP/WIs0+EdH1UbC1+vvFXElul8cVj3zn9g96tTnuilL+lhUbgDSWxZwO0o8wKjW2+O+UhSNutRRRsJHGsdN8IzcMULRwKFk4p89ZQcwUXf7iU2RJjMEpTMDzguvozCX3PwyvnnnaO8eqLjyY/W2sRXH/daf9q8tuufmLwsCilYNgY1dbt4mYLBGFak2OroLT7H/cDFS/T32Kwveq0K/TEosh9I/8U7nMoWDilSNH3rf+NmZ/eTuLsonVsTjtWq+n3Lu6aIcxNXk1iY5swP75VePxYacxNfr1lWz9QCsEaEYaaKx37OHPLysOGeTAJTbyB5t1g+x03ZWb79xP9cRr3MRQsnFKk6Dz5mts0R3Dl9MdJnP/ASVsP4pvJa4c6xl6hlIKRq7nW83Gn+lBhXwuNNfPwIY2st2CKFg4FC6cUKXqtehRfvjyXblC5FN0nz6wHQSkEx9rH6v3Du+hJ9govDeFQsHAoWDgULBwKFg4FC4eChUPBwqFg4VCwcChYOBQsHAoWDgULh4KFQ8HCoWDhULBwKFg4FCwcChYOBQuHgoVDwcKhYOFQsHAoWDgULBwKFs6/uqZDs++88rUAAAAASUVORK5CYII="])},76976(s,e,l){l.d(e,["A",0,"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHgAAAB4CAYAAAA5ZDbSAAAEmklEQVR4nO2dzW7cVBiG3+O/aYkidmyogKZpmx2bCtqmhApKNiy4DISQuIYiQGIBqKISN8Ielar8VGGBBCUhRO0VIFQUSGY89mHRGf+cTuwh0oxP3nmf1Xy2xzqZx/4+n2P7xJz95GcLQUvQdQPEbJFgciSYHAkmR4LJkWByJJgcCSZHgsmRYHIkmBwJJkeCyZFgciSYHAkmR4LJkWByJJgcCSZHgsmRYHIkmBwJJkeCyZFgciSYHAkmR4LJkWByJJgcCSZHgsmJum7ASeR02odB+8QIh1EPuTFzadNRSPAxuPpoC8kwbd3u7upl/JOcnkubjkKCp+CUc8b2LNBr2D4Fpji/54MET8H6wy0kWXnGvg4gadj+FwB9Ty5wfGiDmCESTI5S9AR6w349hm1MyeHMW3R8JHgCG3v3EeVZEV8HEDds/7zzQ/46qsE+oBRNjgSToxQNPOkC2bLnmrT8MG7NzZz4MIzRN4DteBQLEvyE6398jzDPy7jlhznjSP59NLgx5uuVS/grPjWTtv5flKLJkWByFjJFR9mwFsfW1o50t3K6Z0HuxIdBiLRSb30Zh8aiCr6xew+mclH1Rksqe8FZvwOgeoh8fu5VPI6bbj90h1I0ORJMzkKk6GoXCKMuTlMP1V3n1tw0CGrdItt9d/dI6AUba7G5821t2Zstgl90Utu2M5jx6eoV7EdNtx/8QSmaHAkmhzJFB7asmqYlHWPCeuv0ZTNjnhpvPinQCQ5tjs3tsuYaAG+1fOclR/JvzoXVxxfWcRA23RH2F6VociSYHAkmx/savDQc4IPd74r4IIxx6+K1Ig7zDJs7d4s4AHCjZZ8rTvzAuaj6cG0Dg8DnR+mmR2cwORJMjgST410NXk77eG/vhyLujcaOxwyyFMn2nSIOADzXss+zTvzAiW+ubSCr3LDPDM9x751gAAgrN+MDZxAicNYfZ6QKzkVVbgyV1Cqcf5UokGByvEzRTcTO2HI+eh93jBmNLY+xo7HlKjfXNmqJe0iannESBWOKt/nansgYmqDzuTPmBe+hKwAJ5se7FL0fJfji4mtFvJSlyPd+LOJ4NEfGmBDAy5U4B3CnEltj8NmFa6iyKOkZPgq2xqAfls2KbF57yHySmtBZX336Igdq+1s0lKLJkWByvMtdy8M+3n+4VS6wgDtX3DeVzxGAt53171Q+W2txuHuvtv7L8+tevJw9D7wTbCyw1DBNoAUwqMT5hLrcc7Z/xtmf8ewNwFmiFE2OBJPTeYp+Nu3j3Uc/FbE7Ta9BvQb/G0a4fe6VIk7yDPHe/SP3nxuD2+evPLVsUehccACL5eGgcRvjRPtRWWWTPMNBw3dzoLb9oqEUTY4Ek9N5inZxa+5+GOOjlUtFbJ2EnQYhvnJqrCjxTjDcmmvQOKmYBfDYk0nHfEQpmhwJJqfzFP131MOt1cu1ZdUUvUh91lnQueDMGPzZ8b+eYUYpmhwJJkeCyZFgciSYHAkmR4LJkWByJJgcCSZHgsmRYHIkmBwJJkeCyZFgciSYHAkmR4LJkWByJJgcCSZHgsmRYHIkmBwJJkeCyZFgciSYnP8ALWLZnzUsC2kAAAAASUVORK5CYII="])},28453(s,e,l){l.d(e,{R:()=>o,x:()=>i});var r=l(96540);const n={},c=r.createContext(n);function o(s){const e=r.useContext(c);return r.useMemo(function(){return"function"==typeof s?s(e):{...e,...s}},[e,s])}function i(s){let e;return e=s.disableParentContext?"function"==typeof s.components?s.components(n):s.components||n:o(s.components),r.createElement(c.Provider,{value:e},s.children)}}}]);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.