1"use strict";(self.webpackChunk=self.webpackChunk||[]).push([["1776"],{23079(e,t,a){a.r(t),a.d(t,{metadata:()=>n,default:()=>y,frontMatter:()=>d,contentTitle:()=>c,toc:()=>u,assets:()=>m});var n=JSON.parse('{"id":"guides/type-emission","title":"Type Emission","description":"Relay guide to type emission","source":"@site/versioned_docs/version-v14.0.0/guides/type-emission.md","sourceDirName":"guides","slug":"/guides/type-emission/","permalink":"/docs/v14.0.0/guides/type-emission/","draft":false,"unlisted":false,"editUrl":"https://github.com/facebook/relay/tree/main/website/versioned_docs/version-v14.0.0/guides/type-emission.md","tags":[],"version":"v14.0.0","frontMatter":{"id":"type-emission","title":"Type Emission","slug":"/guides/type-emission/","description":"Relay guide to type emission","keywords":["type emission"]},"sidebar":"docs","previous":{"title":"Relay Compiler","permalink":"/docs/v14.0.0/guides/compiler/"},"next":{"title":"Persisted Queries","permalink":"/docs/v14.0.0/guides/persisted-queries/"}}'),r=a(74848),i=a(28453),s=a(86898),o=a(17352),l=a(78010),p=a(57250);let d={id:"type-emission",title:"Type Emission",slug:"/guides/type-emission/",description:"Relay guide to type emission",keywords:["type emission"]},c,m={},u=[{value:"Operation variables",id:"operation-variables",level:2},{value:"Operation and fragment data",id:"operation-and-fragment-data",level:2},{value:"Fragment references",id:"fragment-references",level:2},{value:"Single artifact directory",id:"single-artifact-directory",level:2},{value:"Background information",id:"background-information",level:3}];function h(e){let t={a:"a",admonition:"admonition",code:"code",em:"em",h2:"h2",h3:"h3",li:"li",p:"p",pre:"pre",strong:"strong",ul:"ul",...(0,i.R)(),...e.components};return(0,r.jsxs)(r.Fragment,{children:[(0,r.jsxs)(t.p,{children:["As part of its normal work, the ",(0,r.jsx)(t.a,{href:"../compiler",children:(0,r.jsx)(t.strong,{children:"Relay Compiler"})})," will emit type information for your language of choice that helps you write type-safe application code. These types are included in the artifacts that ",(0,r.jsx)(t.code,{children:"relay-compiler"})," generates to describe your operations and fragments."]}),"\n",(0,r.jsx)(t.h2,{id:"operation-variables",children:"Operation variables"}),"\n",(0,r.jsx)(t.p,{children:"The shape of the variables object used for query, mutation, or subscription operations."}),"\n",(0,r.jsxs)(t.p,{children:["In this example the emitted type-information would require the variables object to contain an ",(0,r.jsx)(t.code,{children:"artistID"})," key with a non-null string."]}),"\n",(0,r.jsxs)(l.default,{defaultValue:(0,o.fbContent)({internal:"Flow",external:"TypeScript"}),values:[{label:"Flow",value:"Flow"},{label:"TypeScript",value:"TypeScript"}],children:[(0,r.jsx)(p.default,{value:"Flow",children:(0,r.jsx)(t.pre,{children:(0,r.jsx)(t.code,{className:"language-javascript",children:"/**\n * export type ExampleQuery$variables = {\n * +artistID: string,\n * }\n * export type ExampleQuery$data = {\n * +artist: {\n * +name: ?string,\n * }\n * }\n * export type ExampleQuery = {\n * +variables: ExampleQuery$variables,\n * +response: ExampleQuery$data,\n * }\n */\n\nconst data = useLazyLoadQuery(\n graphql`\n query ExampleQuery($artistID: ID!) {\n artist(id: $artistID) {\n name\n }\n }\n `,\n // variables are expected to be of type ExampleQuery$variables\n {artistID: 'banksy'},\n);\n"})})}),(0,r.jsx)(p.default,{value:"TypeScript",children:(0,r.jsx)(t.pre,{children:(0,r.jsx)(t.code,{className:"language-javascript",children:"/**\n * export type ExampleQuery$variables = {\n * readonly artistID: string\n * }\n * export type ExampleQuery$data = {\n * readonly artist?: {\n * readonly name?: string\n * }\n * }\n * export type ExampleQuery = {\n * readonly variables: ExampleQuery$variables\n * readonly response: ExampleQuery$data\n * }\n */\nconst data = useLazyLoadQuery(\n graphql`\n query ExampleQuery($artistID: ID!) {\n artist(id: $artistID) {\n name\n }\n }\n `,\n // variables are expected to be of type ExampleQuery$variables\n {artistID: 'banksy'},\n);\n"})})})]}),"\n",(0,r.jsx)(t.h2,{id:"operation-and-fragment-data",children:"Operation and fragment data"}),"\n",(0,r.jsxs)(t.p,{children:["The shape of the data selected in a operation or fragment, following the ",(0,r.jsx)(t.a,{href:"../../principles-and-architecture/thinking-in-relay#data-masking",children:"data-masking"})," rules. That is, excluding any data selected by fragment spreads."]}),"\n",(0,r.jsxs)(t.p,{children:["In this example the emitted type-information describes the response data which is returned by ",(0,r.jsx)(t.code,{children:"useLazyLoadQuery"})," (or ",(0,r.jsx)(t.code,{children:"usePreloadedQuery"}),")."]}),"\n",(0,r.jsxs)(l.default,{defaultValue:(0,o.fbContent)({internal:"Flow",external:"TypeScript"}),values:[{label:"Flow",value:"Flow"},{label:"TypeScript",value:"TypeScript"}],children:[(0,r.jsx)(p.default,{value:"Flow",children:(0,r.jsx)(t.pre,{children:(0,r.jsx)(t.code,{className:"language-javascript",children:"/**\n * export type ExampleQuery$variables = {\n * +artistID: string,\n * }\n * export type ExampleQuery$data = {\n * +artist: {\n * +name: ?string,\n * }\n * }\n * export type ExampleQuery = {\n * +variables: ExampleQuery$variables,\n * +response: ExampleQuery$data,\n * }\n */\n\n// data is of type ExampleQuery$data\nconst data = useLazyLoadQuery(\n graphql`\n query ExampleQuery($artistID: ID!) {\n artist(id: $artistID) {\n name\n }\n }\n `,\n {artistID: 'banksy'},\n);\n\nreturn props.artist && <div>{props.artist.name} is great!</div>\n"})})}),(0,r.jsx)(p.default,{value:"TypeScript",children:(0,r.jsx)(t.pre,{children:(0,r.jsx)(t.code,{className:"language-javascript",children:"/**\n * export type ExampleQuery$variables = {\n * readonly artistID: string\n * }\n * export type ExampleQuery$data = {\n * readonly artist?: {\n * readonly name?: string\n * }\n * }\n * export type ExampleQuery = {\n * readonly variables: ExampleQuery$variables\n * readonly response: ExampleQuery$data\n * }\n */\n\n// data is of type ExampleQuery$data\nconst data = useLazyLoadQuery(\n graphql`\n query ExampleQuery($artistID: ID!) {\n artist(id: $artistID) {\n name\n }\n }\n `,\n {artistID: 'banksy'},\n);\n\nreturn props.artist && <div>{props.artist.name} is great!</div>\n"})})})]}),"\n",(0,r.jsxs)(t.p,{children:["Similarly, in this example the emitted type-information describes the type of the prop to match the type of the fragment reference ",(0,r.jsx)(t.code,{children:"useFragment"})," expects to receive."]}),"\n",(0,r.jsxs)(l.default,{defaultValue:(0,o.fbContent)({internal:"Flow",external:"TypeScript"}),values:[{label:"Flow",value:"Flow"},{label:"TypeScript",value:"TypeScript"}],children:[(0,r.jsx)(p.default,{value:"Flow",children:(0,r.jsx)(t.pre,{children:(0,r.jsx)(t.code,{className:"language-javascript",children:'/**\n * export type ExampleFragmentComponent_artist$data = {\n * +name: string\n * }\n *\n * export type ExampleFragmentComponent_artist$key = { ... }
1\n */\n\nimport type { ExampleFragmentComponent_artist$key } from "__generated__/ExampleFragmentComponent_artist.graphql"\n\ntype Props = {\n artist: ExampleFragmentComponent_artist$key,\n};\n\nexport default ExampleFragmentComponent(props) {\n // data is of type ExampleFragmentComponent_artist$data\n const data = useFragment(\n graphql`\n fragment ExampleFragmentComponent_artist on Artist {\n biography\n }\n `,\n props.artist,\n );\n\n return <div>About the artist: {props.artist.biography}</div>;\n}\n'})})}),(0,r.jsx)(p.default,{value:"TypeScript",children:(0,r.jsx)(t.pre,{children:(0,r.jsx)(t.code,{className:"language-javascript",children:'/**\n * export type ExampleFragmentComponent_artist$data = {\n * readonly name: string\n * }\n *\n * export type ExampleFragmentComponent_artist$key = { ... }\n */\n\nimport { ExampleFragmentComponent_artist$key } from "__generated__/ExampleFragmentComponent_artist.graphql"\n\ninterface Props {\n artist: ExampleFragmentComponent_artist$key,\n};\n\nexport default ExampleFragmentComponent(props: Props) {\n // data is of type ExampleFragmentComponent_artist$data\n const data = useFragment(\n graphql`\n fragment ExampleFragmentComponent_artist on Artist {\n biography\n }\n `,\n props.artist,\n );\n\n return <div>About the artist: {props.artist.biography}</div>;\n}\n'})})})]}),"\n",(0,r.jsx)(t.h2,{id:"fragment-references",children:"Fragment references"}),"\n",(0,r.jsxs)(t.p,{children:["The opaque identifier described in ",(0,r.jsx)(t.a,{href:"../../principles-and-architecture/thinking-in-relay#data-masking",children:"data-masking"})," that a child container expects to receive from its parent, which represents the child container\u2019s fragment spread inside the parent\u2019s fragment."]}),"\n",(0,r.jsx)(o.OssOnly,{children:(0,r.jsx)(t.admonition,{type:"important",children:(0,r.jsxs)(t.p,{children:["Please read ",(0,r.jsx)(t.a,{href:"#single-artifact-directory",children:"this important caveat"})," about actually enabling type-safe fragment reference checking."]})})}),"\n",(0,r.jsxs)(t.p,{children:["Consider a component that ",(0,r.jsx)(t.a,{href:"../../guided-tour/rendering/fragments/#composing-fragments",children:"composes"})," the above fragment component example. In this example, the emitted type-information of the child component receives a unique opaque identifier type, called a fragment reference, which the type-information emitted for the parent\u2019s fragment references in the location where the child\u2019s fragment is spread. Thus ensuring that the child\u2019s fragment is spread into the parent\u2019s fragment ",(0,r.jsx)(t.em,{children:"and"})," the correct fragment reference is passed to the child component at runtime."]}),"\n",(0,r.jsxs)(l.default,{defaultValue:(0,o.fbContent)({internal:"Flow",external:"TypeScript"}),values:[{label:"Flow",value:"Flow"},{label:"TypeScript",value:"TypeScript"}],children:[(0,r.jsx)(p.default,{value:"Flow",children:(0,r.jsx)(t.pre,{children:(0,r.jsx)(t.code,{className:"language-javascript",children:'import { ExampleFragmentComponent } from "./ExampleFragmentComponent"\n\n/**\n * import type { ExampleFragmentComponent_artist$fragmentType } from "ExampleFragmentComponent_artist.graphql";\n *\n * export type ExampleQuery$data = {\n * +artist: ?{\n * +name: ?string,\n * +$fragmentSpreads: ExampleFragmentComponent_artist$fragmentType,\n * }\n * };\n * export type ExampleQuery$variables = {\n * +artistID: string,\n * }\n * export type ExampleQuery = {\n * +variables: ExampleQuery$variables,\n * +response: ExampleQuery$data,\n * }\n */\n\n// data is of type ExampleQuery$data\nconst data = useLazyLoadQuery(\n graphql`\n query ExampleQuery($artistID: ID!) {\n artist(id: $artistID) {\n name\n ...ExampleFragmentComponent_artist\n }\n }\n `,\n {artistID: \'banksy\'},\n);\n\n// Here only `data.artist.name` is directly visible,\n// the marker prop $fragmentSpreads indicates that `data.artist`\n// can be used for the component expecting this fragment spread.\nreturn <ExampleFragmentComponent artist={data.artist} />;\n'})})}),(0,r.jsx)(p.default,{value:"TypeScript",children:(0,r.jsx)(t.pre,{children:(0,r.jsx)(t.code,{className:"language-javascript",children:'import { ExampleFragmentComponent } from "./ExampleFragmentComponent"\n\n/**\n * import { ExampleFragmentComponent_artist$fragmentType } from "ExampleFragmentComponent_artist.graphql";\n *\n * export type ExampleQuery$data = {\n * readonly artist?: {\n * readonly name: ?string,\n * readonly " $fragmentSpreads": ExampleFragmentComponent_artist$fragmentType\n * }\n * }\n * export type ExampleQuery$variables = {\n * readonly artistID: string\n * }\n * export type ExampleQuery = {\n * readonly variables: ExampleQuery$variables\n * readonly response: ExampleQuery$data\n * }\n */\n\n// data is of type ExampleQuery$data\nconst data = useLazyLoadQuery(\n graphql`\n query ExampleQuery($artistID: ID!) {\n artist(id: $artistID) {\n name\n ...ExampleFragmentComponent_artist\n }\n }\n `,\n {artistID: \'banksy\'},\n);\n\n// Here only `data.artist.name` is directly visible,\n// the marker prop $fragmentSpreads indicates that `data.artist`\n// can be used for the component expecting this fragment spread.\nreturn <ExampleFragmentComponent artist={data.artist} />;\n'})})})]}),"\n",(0,r.jsxs)(o.OssOnly,{children:[(0,r.jsx)(t.h2,{id:"single-artifact-directory",children:"Single artifact directory"}),(0,r.jsxs)(t.p,{children:["An important caveat to note is that by default strict fragment reference type-information will ",(0,r.jsx)(t.em,{children:"not"})," be emitted, instead they will be typed as ",(0,r.jsx)(t.code,{children:"any"})," and would allow you to pass in any data to the child component."]}),(0,r.jsxs)(t.p,{children:["To enable this feature, you will have to tell the compiler to store all the artifacts in a single directory, by specifing the ",(0,r.jsx)(t.code,{children:"artifactDirectory"})," in the\ncompiler configuration:"]}),(0,r.jsx)(t.pre,{children:(0,r.jsx)(t.code,{children:'{\n // package.json\n "relay": {\n "artifactDirectory": "./src/__generated__",\n ...\n },\n ...\n}\n'})}),(0,r.jsxs)(t.p,{children:["\u2026and additionally inform the babel plugin in your ",(0,r.jsx)(t.code,{children:".babelrc"})," config where to look for the artifacts:"]}),(0,r.jsx)(t.pre,{children:(0,r.jsx)(t.code,{className:"language-json",children:'{\n "plugins": [\n ["relay", { "artifactDirectory": "./src/__generated__" }]\n ]\n}\n'})}),(0,r.jsxs)(t.p,{children:["It is recommended to alias this directory in your module resolution configuration such that you don\u2019t need to specify relative paths in your source files. This is what is also done in the above examples, where artifacts are imported from a ",(0,r.jsx)(t.code,{children:"__generated__"})," alias, rather than relative paths like ",(0,r.jsx)(t.code,{children:"../../../../__generated__"}),"."]}),(0,r.jsx)(t.h3,{id:"background-information",children:"Backgroun
1d information"}),(0,r.jsxs)(t.p,{children:["The reason is that ",(0,r.jsx)(t.code,{children:"relay-compiler"})," and its artifact emission is stateless. Meaning that it does not keep track of locations of original source files and where the compiler previously saved the accompanying artifact on disk. Thus, if the compiler were to emit artifacts that try to import fragment reference types from ",(0,r.jsx)(t.em,{children:"other"})," artifacts, the compiler would:"]}),(0,r.jsxs)(t.ul,{children:["\n",(0,r.jsx)(t.li,{children:"first need to know where on disk that other artifact exists;"}),"\n",(0,r.jsx)(t.li,{children:"and update imports when the other artifact changes location on disk."}),"\n"]}),(0,r.jsxs)(t.p,{children:["Facebook uses a module system called ",(0,r.jsx)(t.a,{href:"https://twitter.com/dan_abramov/status/758655309212704768",children:"Haste"}),", in which all source files are considered in a flat namespace. This means that an import declaration does not need to specify the path to another module and thus there is no need for the compiler to ever consider the above issues. I.e. an import only needs to specify the basename of the module filename and Haste takes care of actually finding the right module at import time. Outside of Facebook, however, usage of the Haste module system is non-existent nor encouraged, thus the decision to not import fragment reference types but instead type them as ",(0,r.jsx)(t.code,{children:"any"}),"."]}),(0,r.jsx)(t.p,{children:"At its simplest, we can consider Haste as a single directory that contains all module files, thus all module imports always being safe to import using relative sibling paths. This is what is achieved by the single artifact directory feature. Rather than co-locating artifacts with their source files, all artifacts are stored in a single directory, allowing the compiler to emit imports of fragment reference types."})]}),"\n",(0,r.jsx)(s.A,{})]})}function y(e={}){let{wrapper:t}={...(0,i.R)(),...e.components};return t?(0,r.jsx)(t,{...e,children:(0,r.jsx)(h,{...e})}):h(e)}},57250(e,t,a){a.r(t),a.d(t,{default:()=>i});var n=a(74848);a(96540);var r=a(18215);function i({children:e,hidden:t,className:a}){return(0,n.jsx)("div",{role:"tabpanel",className:(0,r.A)("tabItem_Ymn6",a),hidden:t,children:e})}},78010(e,t,a){a.r(t),a.d(t,{default:()=>v});var n=a(74848),r=a(96540),i=a(18215),s=a(88287),o=a(28584),l=a(99770),p=a(99989),d=a(96629),c=a(80618),m=a(41367);function u(e){return r.Children.toArray(e).filter(e=>"\n"!==e).map(e=>{if(!e||(0,r.isValidElement)(e)&&function(e){let{props:t}=e;return!!t&&"object"==typeof t&&"value"in t}(e))return e;throw Error(`Docusaurus error: Bad <Tabs> child <${"string"==typeof e.type?e.type:e.type.name}>: all children of the <Tabs> component should be <TabItem>, and every <TabItem> should have a unique "value" prop.`)})?.filter(Boolean)??[]}function h({value:e,tabValues:t}){return t.some(t=>t.value===e)}var y=a(19863);function f({className:e,block:t,selectedValue:a,selectValue:r,tabValues:s}){let l=[],{blockElementScrollPositionUntilNextRender:p}=(0,o.a_)(),d=e=>{let t=e.currentTarget,n=s[l.indexOf(t)].value;n!==a&&(p(t),r(n))},c=e=>{let t=null;switch(e.key){case"Enter":d(e);break;case"ArrowRight":{let a=l.indexOf(e.currentTarget)+1;t=l[a]??l[0];break}case"ArrowLeft":{let a=l.indexOf(e.currentTarget)-1;t=l[a]??l[l.length-1]}}t?.focus()};return(0,n.jsx)("ul",{role:"tablist","aria-orientation":"horizontal",className:(0,i.A)("tabs",{"tabs--block":t},e),children:s.map(({value:e,label:t,attributes:r})=>(0,n.jsx)("li",{role:"tab",tabIndex:a===e?0:-1,"aria-selected":a===e,ref:e=>{l.push(e)},onKeyDown:c,onClick:d,...r,className:(0,i.A)("tabs__item","tabItem_LNqP",r?.className,{"tabs__item--active":a===e}),children:t??e},e))})}function x({lazy:e,children:t,selectedValue:a}){let s=(Array.isArray(t)?t:[t]).filter(Boolean);if(e){let e=s.find(e=>e.props.value===a);return e?(0,r.cloneElement)(e,{className:(0,i.A)("margin-top--md",e.props.className)}):null}return(0,n.jsx)("div",{className:"margin-top--md",children:s.map((e,t)=>(0,r.cloneElement)(e,{key:t,hidden:e.props.value!==a}))})}function g(e){let t=function(e){let t,{defaultValue:a,queryString:n=!1,groupId:i}=e,s=function(e){let{values:t,children:a}=e;return(0,r.useMemo)(()=>{let e=t??u(a).map(({props:{value:e,label:t,attributes:a,default:n}})=>({value:e,label:t,attributes:a,default:n})),n=(0,c.XI)(e,(e,t)=>e.value===t.value);if(n.length>0)throw Error(`Docusaurus error: Duplicate values "${n.map(e=>e.value).join(", ")}" found in <Tabs>. Every value needs to be unique.`);return e},[t,a])}(e),[o,y]=(0,r.useState)(()=>(function({defaultValue:e,tabValues:t}){if(0===t.length)throw Error("Docusaurus error: the <Tabs> component requires at least one <TabItem> children component");if(e){if(!h({value:e,tabValues:t}))throw Error(`Docusaurus error: The <Tabs> has a defaultValue "${e}" but none of its children has the corresponding value. Available values are: ${t.map(e=>e.value).join(", ")}. If you intend to show no default tab, use defaultValue={null} instead.`);return e}let a=t.find(e=>e.default)??t[0];if(!a)throw Error("Unexpected error: 0 tabValues");return a.value})({defaultValue:a,tabValues:s})),[f,x]=function({queryString:e=!1,groupId:t}){let a=(0,l.W6)(),n=function({queryString:e=!1,groupId:t}){if("string"==typeof e)return e;if(!1===e)return null;if(!0===e&&!t)throw Error('Docusaurus error: The <Tabs> component groupId prop is required if queryString=true, because this value is used as the search param name. You can also provide an explicit value such as queryString="my-search-param".');return t??null}({queryString:e,groupId:t});return[(0,d.aZ)(n),(0,r.useCallback)(e=>{if(!n)return;let t=new URLSearchParams(a.location.search);t.set(n,e),a.replace({...a.location,search:t.toString()})},[n,a])]}({queryString:n,groupId:i}),[g,v]=function({groupId:e}){let t=e?`docusaurus.tab.${e}`:null,[a,n]=(0,m.Dv)(t);return[a,(0,r.useCallback)(e=>{t&&n.set(e)},[t,n])]}({groupId:i}),b=h({value:t=f??g,tabValues:s})?t:null;return(0,p.A)(()=>{b&&y(b)},[b]),{selectedValue:o,selectValue:(0,r.useCallback)(e=>{if(!h({value:e,tabValues:s}))throw Error(`Can't select invalid tab value=${e}`);y(e),x(e),v(e)},[x,v,s]),tabValues:s}}(e);return(0,n.jsxs)("div",{className:(0,i.A)(s.G.tabs.container,"tabs-container","tabList__CuJ"),children:[(0,n.jsx)(f,{...t,...e}),(0,n.jsx)(x,{...t,...e})]})}function v(e){let t=(0,y.default)();return(0,n.jsx)(g,{...e,children:u(e.children)},String(t))}},86898(e,t,a){a.d(t,{A:()=>h});var n=a(74848),r=a(95310),i=a(17352),s=a(96540);function o(){let e=window.encodeURI(JSON.stringify({title:"Feedback about "+window.location.pathname,description:"**!!! Required !!!**\n\nPlease modify the task description to let us know how the docs can be improved.\n\n**Please do not ask support questions via this form! Instead, ask in fburl.com/relay_
1support**",tag_ids:{add:[0xac96423e5b680,0x64079768ac750]}}));window.open("https://www.internalfb.com/tasks/?n="+e)}function l({children:e}){return(0,n.jsxs)("div",{className:"docsRating",id:"docsRating",children:[(0,n.jsx)("hr",{}),e]})}let p=()=>{let[e,t]=s.useState(!1),a=e=>{t(!0),window.ga&&window.ga("send",{hitType:"event",eventCategory:"button",eventAction:"feedback",eventValue:e})};return e?"Thank you for letting us know!":(0,n.jsxs)(n.Fragment,{children:["Is this page useful?",(0,n.jsx)("svg",{className:"i_thumbsup",alt:"Like",id:"docsRating-like",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 81.13 89.76",onClick:()=>a(1),children:(0,n.jsx)("path",{d:"M22.9 6a18.57 18.57 0 002.67 8.4 25.72 25.72 0 008.65 7.66c3.86 2 8.67 7.13 13.51 11 3.86 3.11 8.57 7.11 11.54 8.45s13.59.26 14.64 1.17c1.88 1.63 1.55 9-.11 15.25-1.61 5.86-5.96 10.55-6.48 16.86-.4 4.83-2.7 4.88-10.93 4.88h-1.35c-3.82 0-8.24 2.93-12.92 3.62a68 68 0 01-9.73.5c-3.57 0-7.86-.08-13.25-.08-3.56 0-4.71-1.83-4.71-4.48h8.42a3.51 3.51 0 000-7H12.28a2.89 2.89 0 01-2.88-2.88 1.91 1.91 0 01.77-1.78h16.46a3.51 3.51 0 000-7H12.29c-3.21 0-4.84-1.83-4.84-4a6.41 6.41 0 011.17-3.78h19.06a3.5 3.5 0 100-7H9.75A3.51 3.51 0 016 42.27a3.45 3.45 0 013.75-3.48h13.11c5.61 0 7.71-3 5.71-5.52-4.43-4.74-10.84-12.62-11-18.71-.15-6.51 2.6-7.83 5.36-8.56m0-6a6.18 6.18 0 00-1.53.2c-6.69 1.77-10 6.65-9.82 14.5.08 5.09 2.99 11.18 8.52 18.09H9.74a9.52 9.52 0 00-6.23 16.9 12.52 12.52 0 00-2.07 6.84 9.64 9.64 0 003.65 7.7 7.85 7.85 0 00-1.7 5.13 8.9 8.9 0 005.3 8.13 6 6 0 00-.26 1.76c0 6.37 4.2 10.48 10.71 10.48h13.25a73.75 73.75 0 0010.6-.56 35.89 35.89 0 007.58-2.18 17.83 17.83 0 014.48-1.34h1.35c4.69 0 7.79 0 10.5-1 3.85-1.44 6-4.59 6.41-9.38.2-2.46 1.42-4.85 2.84-7.62a41.3 41.3 0 003.42-8.13 48 48 0 001.59-10.79c.1-5.13-1-8.48-3.35-10.55-2.16-1.87-4.64-1.87-9.6-1.88a46.86 46.86 0 01-6.64-.29c-1.92-.94-5.72-4-8.51-6.3l-1.58-1.28c-1.6-1.3-3.27-2.79-4.87-4.23-3.33-3-6.47-5.79-9.61-7.45a20.2 20.2 0 01-6.43-5.53 12.44 12.44 0 01-1.72-5.36 6 6 0 00-6-5.86z"})}),(0,n.jsx)("svg",{className:"i_thumbsdown",alt:"Dislike",id:"docsRating-dislike",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 81.13 89.76",onClick:()=>a(0),children:(0,n.jsx)("path",{d:"M22.9 6a18.57 18.57 0 002.67 8.4 25.72 25.72 0 008.65 7.66c3.86 2 8.67 7.13 13.51 11 3.86 3.11 8.57 7.11 11.54 8.45s13.59.26 14.64 1.17c1.88 1.63 1.55 9-.11 15.25-1.61 5.86-5.96 10.55-6.48 16.86-.4 4.83-2.7 4.88-10.93 4.88h-1.35c-3.82 0-8.24 2.93-12.92 3.62a68 68 0 01-9.73.5c-3.57 0-7.86-.08-13.25-.08-3.56 0-4.71-1.83-4.71-4.48h8.42a3.51 3.51 0 000-7H12.28a2.89 2.89 0 01-2.88-2.88 1.91 1.91 0 01.77-1.78h16.46a3.51 3.51 0 000-7H12.29c-3.21 0-4.84-1.83-4.84-4a6.41 6.41 0 011.17-3.78h19.06a3.5 3.5 0 100-7H9.75A3.51 3.51 0 016 42.27a3.45 3.45 0 013.75-3.48h13.11c5.61 0 7.71-3 5.71-5.52-4.43-4.74-10.84-12.62-11-18.71-.15-6.51 2.6-7.83 5.36-8.56m0-6a6.18 6.18 0 00-1.53.2c-6.69 1.77-10 6.65-9.82 14.5.08 5.09 2.99 11.18 8.52 18.09H9.74a9.52 9.52 0 00-6.23 16.9 12.52 12.52 0 00-2.07 6.84 9.64 9.64 0 003.65 7.7 7.85 7.85 0 00-1.7 5.13 8.9 8.9 0 005.3 8.13 6 6 0 00-.26 1.76c0 6.37 4.2 10.48 10.71 10.48h13.25a73.75 73.75 0 0010.6-.56 35.89 35.89 0 007.58-2.18 17.83 17.83 0 014.48-1.34h1.35c4.69 0 7.79 0 10.5-1 3.85-1.44 6-4.59 6.41-9.38.2-2.46 1.42-4.85 2.84-7.62a41.3 41.3 0 003.42-8.13 48 48 0 001.59-10.79c.1-5.13-1-8.48-3.35-10.55-2.16-1.87-4.64-1.87-9.6-1.88a46.86 46.86 0 01-6.64-.29c-1.92-.94-5.72-4-8.51-6.3l-1.58-1.28c-1.6-1.3-3.27-2.79-4.87-4.23-3.33-3-6.47-5.79-9.61-7.45a20.2 20.2 0 01-6.43-5.53 12.44 12.44 0 01-1.72-5.36 6 6 0 00-6-5.86z"})})]})},d=()=>(0,n.jsxs)("p",{children:["Let us know how these docs can be improved by",(0,n.jsx)("a",{className:"button",role:"button",tabIndex:0,onClick:o,children:"Filing a task"})]}),c=()=>(0,n.jsxs)("p",{children:["Help us make the site even better by"," ",(0,n.jsx)(r.default,{to:"https://www.surveymonkey.com/r/FYC9TCJ",children:"answering a few quick questions"}),"."]}),m=()=>(0,n.jsxs)(l,{children:[(0,n.jsx)(d,{}),(0,n.jsx)(p,{}),(0,n.jsx)(c,{})]}),u=()=>(0,n.jsxs)(l,{children:[(0,n.jsx)(p,{}),(0,n.jsx)(c,{})]}),h=()=>(0,i.fbContent)({internal:(0,n.jsx)(m,{}),external:(0,n.jsx)(u,{})})},28453(e,t,a){a.d(t,{R:()=>s,x:()=>o});var n=a(96540);let r={},i=n.createContext(r);function s(e){let t=n.useContext(i);return n.useMemo(function(){return"function"==typeof e?e(t):{...t,...e}},[t,e])}function o(e){let t;return t=e.disableParentContext?"function"==typeof e.components?e.components(r):e.components||r:s(e.components),n.createElement(i.Provider,{value:t},e.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.