PageSourceSearch

https://docs.builderius.io/assets/js/470d06d0.50125f64.js

js builderius.io collected 2026-10-02 04:55:26 UTC 25,836 bytes, 1 lines download raw bytes

1"use strict";(globalThis.webpackChunkbuilderius=globalThis.webpackChunkbuilderius||[]).push([[3586],{1682:(e,n,s)=>{s.r(n),s.d(n,{assets:()=>c,contentTitle:()=>u,default:()=>h,frontMatter:()=>o,metadata:()=>r,toc:()=>d});const r=JSON.parse('{"id":"dynamic-data/custom-queries/syntax","title":"GraphQL Syntax","description":"Builderius uses a custom GraphQL implementation optimized specifically for WordPress Pro Feature data structures and page builder workflows. Unlike standard GraphQL, this syntax is designed to work seamlessly with WordPress\'s post types, custom fields, taxonomies, and user roles while being accessible to visual builders rather than requiring deep GraphQL knowledge.","source":"@site/docs/dynamic-data/custom-queries/syntax.md","sourceDirName":"dynamic-data/custom-queries","slug":"/dynamic-data/custom-queries/syntax","permalink":"/docs/dynamic-data/custom-queries/syntax","draft":false,"unlisted":false,"tags":[],"version":"current","frontMatter":{"id":"syntax","title":"GraphQL Syntax"},"sidebar":"docs","previous":{"title":"GraphQL Editor","permalink":"/docs/dynamic-data/custom-queries/query-editor"},"next":{"title":"JSON & REST APIs","permalink":"/docs/dynamic-data/custom-queries/json-and-apis"}}');var t=s(4848),a=s(8453),l=s(9489),i=s(7227);const o={id:"syntax",title:"GraphQL Syntax"},u=void 0,c={},d=[{value:"Root Object Requirement",id:"root-object-requirement",level:2},{value:"Basic Syntax Rules",id:"basic-syntax-rules",level:2},{value:"Arguments Syntax",id:"arguments-syntax",level:2},{value:"Data Types",id:"data-types",level:2},{value:"Special Utilities",id:"special-utilities",level:2},{value:"Syntax Conventions",id:"syntax-conventions",level:2},{value:"Expression Syntax",id:"expression-syntax",level:2},{value:"Combining Queries",id:"combining-queries",level:2},{value:"Common Syntax Errors",id:"common-syntax-errors",level:2},{value:"WPGraphQL Syntax Comparison",id:"wpgraphql-syntax-comparison",level:2}];function p(e){const n={code:"code",h2:"h2",li:"li",p:"p",pre:"pre",strong:"strong",ul:"ul",...(0,a.R)(),...e.components};return(0,t.jsxs)(t.Fragment,{children:[(0,t.jsxs)(n.p,{children:["Builderius uses a custom ",(0,t.jsx)(n.strong,{children:"GraphQL implementation optimized specifically for WordPress"})," ",(0,t.jsx)("span",{class:"badge pro",children:"Pro Feature"})," data structures and page builder workflows. Unlike standard GraphQL, this syntax is designed to work seamlessly with WordPress's post types, custom fields, taxonomies, and user roles while being accessible to visual builders rather than requiring deep GraphQL knowledge."]}),"\n",(0,t.jsx)(n.p,{children:"Understanding these syntax rules is essential for writing valid queries that leverage WordPress data efficiently."}),"\n",(0,t.jsx)(n.h2,{id:"root-object-requirement",children:"Root Object Requirement"}),"\n",(0,t.jsx)(n.p,{children:(0,t.jsx)(n.strong,{children:"All queries must be wrapped in a root object:"})}),"\n",(0,t.jsx)(n.pre,{children:(0,t.jsx)(n.code,{className:"language-graphql",children:"{\n    # ... all code here\n}\n"})}),"\n",(0,t.jsx)(n.h2,{id:"basic-syntax-rules",children:"Basic Syntax Rules"}),"\n",(0,t.jsxs)(l.A,{groupId:"basic-syntax",defaultValue:"structure",values:[{label:"Query Structure",value:"structure"},{label:"Field Selection",value:"fields"},{label:"Nested Objects",value:"nested"}],children:[(0,t.jsxs)(i.A,{value:"structure",children:[(0,t.jsx)(n.p,{children:"Every query follows this structure:"}),(0,t.jsx)(n.pre,{children:(0,t.jsx)(n.code,{className:"language-graphql",children:"{\n  query_name {\n    field_name\n  }\n}\n"})})]}),(0,t.jsxs)(i.A,{value:"fields",children:[(0,t.jsx)(n.p,{children:"Fields are listed inside curly braces:"}),(0,t.jsx)(n.pre,{children:(0,t.jsx)(n.code,{className:"language-graphql",children:"{\n  post {\n    post_title\n    post_content\n  }\n}\n"})})]}),(0,t.jsxs)(i.A,{value:"nested",children:[(0,t.jsx)(n.p,{children:"Use nested braces for object properties:"}),(0,t.jsx)(n.pre,{children:(0,t.jsx)(n.code,{className:"language-graphql",children:"{\n  post {\n    featured_image {\n      file_url\n      alt_text\n    }\n  }\n}\n"})})]})]}),"\n",(0,t.jsx)(n.h2,{id:"arguments-syntax",children:"Arguments Syntax"}),"\n",(0,t.jsxs)(l.A,{groupId:"arguments-syntax",defaultValue:"function",values:[{label:"Simple Arguments",value:"function"},{label:"Arguments Object",value:"object"}],children:[(0,t.jsxs)(i.A,{value:"function",children:[(0,t.jsx)(n.p,{children:"Arguments use parentheses and ke
1y-value pairs:"}),(0,t.jsx)(n.pre,{children:(0,t.jsx)(n.code,{className:"language-graphql",children:'{\n  query_function(argument: "value") {\n    field\n  }\n}\n'})})]}),(0,t.jsxs)(i.A,{value:"object",children:[(0,t.jsxs)(n.p,{children:["Collection queries use an ",(0,t.jsx)(n.code,{children:"arguments"})," object that contains a series of key-value pairs:"]}),(0,t.jsx)(n.pre,{children:(0,t.jsx)(n.code,{className:"language-graphql",children:'{\n  posts_query(\n    arguments: {\n      key: "value"\n      another_key: 123\n    }\n  ) {\n    posts {\n      field\n    }\n  }\n}\n'})})]})]}),"\n",(0,t.jsx)(n.h2,{id:"data-types",children:"Data Types"}),"\n",(0,t.jsxs)(l.A,{groupId:"data-types",defaultValue:"strings",values:[{label:"Strings",value:"strings"},{label:"Numbers",value:"numbers"},{label:"Booleans",value:"booleans"},{label:"Arrays",value:"arrays"}],children:[(0,t.jsxs)(i.A,{value:"strings",children:[(0,t.jsx)(n.p,{children:"Use double quotes for string values:"}),(0,t.jsx)(n.pre,{children:(0,t.jsx)(n.code,{className:"language-graphql",children:'{\n  posts_query(\n    arguments: {\n      post_type: "post"\n      post_status: "publish"\n    }\n  ) {\n    posts {\n      post_title\n    }\n  }\n}\n'})})]}),(0,t.jsxs)(i.A,{value:"numbers",children:[(0,t.jsx)(n.p,{children:"Numbers don't require quotes:"}),(0,t.jsx)(n.pre,{children:(0,t.jsx)(n.code,{className:"language-graphql",children:"{\n  posts_query(\n    arguments: {\n      posts_per_page: 10\n      author: 5\n    }\n  ) {\n    posts {\n      post_title\n    }\n  }\n}\n"})})]}),(0,t.jsxs)(i.A,{value:"booleans",children:[(0,t.jsxs)(n.p,{children:["Use ",(0,t.jsx)(n.code,{children:"true"})," or ",(0,t.jsx)(n.code,{children:"false"})," without quotes:"]}),(0,t.jsx)(n.pre,{children:(0,t.jsx)(n.code,{className:"language-graphql",children:'{\n  terms_query(\n    arguments: {\n      hide_empty: true\n      taxonomy: "category"\n    }\n  ) {\n    terms {\n      name\n    }\n  }\n}\n'})})]}),(0,t.jsxs)(i.A,{value:"arrays",children:[(0,t.jsx)(n.p,{children:"Use square brackets for arrays:"}),(0,t.jsx)(n.pre,{children:(0,t.jsx)(n.code,{className:"language-graphql",children:'{\n  posts_query(\n    arguments: {\n      post__in: [1, 2, 3, 4]\n      post_status: ["publish", "private"]\n    }\n  ) {\n    posts {\n      post_title\n    }\n  }\n}\n'})})]})]}),"\n",(0,t.jsx)(n.h2,{id:"special-utilities",children:"Special Utilities"}),"\n",(0,t.jsxs)(l.A,{groupId:"special-characters",defaultValue:"variables",values:[{label:"Variables",value:"variables"},{label:"Aliases",value:"aliases"},{label:"Directives",value:"directives"}],children:[(0,t.jsxs)(i.A,{value:"variables",children:[(0,t.jsxs)(n.p,{children:["Use ",(0,t.jsx)(n.strong,{children:"variables"})," to reference dynamic data from the current template context. This creates relationships between different parts of your query."]}),(0,t.jsxs)(n.ul,{children:["\n",(0,t.jsxs)(n.li,{children:["Local context: ",(0,t.jsx)(n.code,{children:'"{{variable_name}}"'})," - data from current item"]}),"\n",(0,t.jsxs)(n.li,{children:["Global context: ",(0,t.jsx)(n.code,{children:'"[[variable_name]]"'})," - site-wide data"]}),"\n"]}),(0,t.jsx)(n.pre,{children:(0,t.jsx)(n.code,{className:"language-graphql",children:'{\n  post {\n    ID @private\n    related_posts: posts_query(\n      arguments: {\n        post__not_in: "{{ID}}"\n      }\n    ) {\n      posts {\n        post_title\n      }\n    }\n  }\n}\n'})})]}),(0,t.jsxs)(i.A,{value:"aliases",children:[(0,t.jsxs)(n.p,{children:["Use ",(0,t.jsx)(n.strong,{children:"aliases"})," to rename fields for clearer output or to call the same field multiple times with different parameters. Separate alias from field name using colon:"]}),(0,t.jsxs)(n.ul,{children:["\n",(0,t.jsxs)(n.li,{children:[(0,t.jsx)(n.code,{children:"title"})," == ",(0,t.jsx)(n.code,{children:"post_title"})]}),"\n",(0,t.jsxs)(n.li,{children:[(0,t.jsx)(n.code,{children:"thumbnail"})," == ",(0,t.jsx)(n.code,{children:"file_url(size: THUMBNAIL)"})]}),"\n",(0,t.jsx)(n.li,{children:"..."}),"\n"]}),(0,t.jsx)(n.pre,{children:(0,t.jsx)(n.code,{className:"language-graphql",children:"{\n  posts_query {\n    posts {\n      title: post_title\n      content: post_content\n      featured_image {\n        thumbnail: file_url(size: THUMBNAIL)\n        large: file_url(size: LARGE)\n      }\n    }\n  }\n}\n"})})]}),(0,t.jsxs)(i.A,{value:"directives",children:[(0,t.jsxs)(n.p,{children:["Use @ symbol for ",(0,t.jsx)(n.strong,{children:"directives"})," that modify field behavior:"]}),(0,t.jsxs)(n.ul,{children:["\n",(0,t.jsxs)(n.li,{children:[(0,t.jsx)(n.code,{children:"@private"})," - field needed for logic but hidden from output"]}),"\n",(0,t.jsxs)(n.li,{children:[(0,t.jsx)(n.code,{children:"@recursive"})," - enables recursive querying for hierarchical data"]}),"\n",(0,t.jsxs)(n.li,{children:[(0,t.jsx)(n.code,{children:"@transform"})," - applies expression to transform field value inline"]}),"\n"]}),(0,t.jsx)(n.pre,{children:(0,t.jsx)(n.code,{className:"language-graphql",children:'{\n  nav_menu(identifier: "name", value: "main-menu") {\n    items {\n      ID @private\n      title\n      url\n      children @recursive {\n        title\n        url\n      }\n      uppercase_title: title @transform(\n        expression: "upper(title)"\n      )\n    }\n  }\n}\n'})})]})]}),"\n",(0,t.jsx)(n.h2,{id:"syntax-conventions",children:"Syntax Conventions"}),"\n",(0,t.jsxs)(l.A,{groupId:"syntax-conventions",defaultValue:"field-names",values:[{label:"Field Names",value:"field-names"},{label:"Indentation",value:"indentation"},{label:"Line Breaks",value:"line-breaks"}],children:[(0,t.jsx)(i.A,{value:"field-names",children:(0,t.jsxs)(n.ul,{children:["\n",(0,t.jsxs)(n.li,{children:["Use snake_case: ",(0,t.jsx)(n.code,{children:"post_title"}),", ",(0,t.jsx)(n.code,{children:"featured_image"})]}),"\n",(0,t.jsxs)(n.li,{children:["No spaces allowed: ",(0,t.jsx)(n.code,{children:"post title"})," \u274c"]}),"\n",(0,t.jsx)(n.li,{children:"No special characters except underscore"}),"\n"]})}),(0,t.jsxs)(i.A,{value:"indentation",children:[(0,t.jsx)(n.p,{children:"Use consistent indentation for readability:"}),(0,t.jsx)(n.pre,{children:(0,t.jsx)(n.code,{className:"language-graphql",children:"{\n  posts_query {\n    posts {\n      post_title\n      featured_image {\n        file_url\n      }\n    }\n  }\n}\n"})})]}),(0,t.jsx)(i.A,{value:"line-breaks",children:(0,t.jsxs)(n.ul,{children:["\n",(0,t.jsx)(n.li,{children:"Each field on separate line"}),"\n",(0,t.jsx)(n.li,{children:"Opening brace on same line as field name"}),"\n",(0,t.jsx)(n.li,{children:"Closing brace aligned with opening statement"}),"\n"]})})]}),"\n",(0,t.jsx)(n.h2,{id:"expression-syntax",children:"Expression Syntax"}),"\n",(0,t.jsx)(n.p,{children:"Expressions are used to perform data transformation, calculations and more."}),"\n",(0,t.jsxs)(l.A,{groupId:"expression-syntax",defaultValue:"simple",values:[{label:"Simple E
1xpression",value:"simple"},{label:"With Arguments",value:"arguments"},{label:"Transform Directive",value:"transform"},{label:"Single Line Rule",value:"single-line"}],children:[(0,t.jsx)(i.A,{value:"simple",children:(0,t.jsx)(n.pre,{children:(0,t.jsx)(n.code,{className:"language-graphql",children:'{\n  posts_query {\n    posts {\n      post_title\n      uppercase_title: expression_result(\n        expression: "upper(post_title)"\n      )\n    }\n  }\n}\n'})})}),(0,t.jsx)(i.A,{value:"arguments",children:(0,t.jsx)(n.pre,{children:(0,t.jsx)(n.code,{className:"language-graphql",children:'{\n  posts_query {\n    posts {\n      post_title\n      short_title: expression_result(\n        expression: "limit_words(post_title, 3)"\n      )\n      post_date\n      formatted_date: expression_result(\n        expression: "date(\'F j, Y\', strtotime(post_date))"\n      )\n    }\n  }\n}\n'})})}),(0,t.jsx)(i.A,{value:"transform",children:(0,t.jsx)(n.pre,{children:(0,t.jsx)(n.code,{className:"language-graphql",children:'{\n  posts_query {\n    posts {\n      post_title\n      uppercase_title: post_title @transform(\n        expression: "upper(post_title)"\n      )\n    }\n  }\n}\n'})})}),(0,t.jsxs)(i.A,{value:"single-line",children:[(0,t.jsx)(n.p,{children:"Expressions must be on one line:"}),(0,t.jsx)(n.pre,{children:(0,t.jsx)(n.code,{className:"language-graphql",children:'expression: "function1() && function2()"  \u2705\nexpression: "function1() && \n            function2()"                  \u274c\n'})})]})]}),"\n",(0,t.jsx)(n.h2,{id:"combining-queries",children:"Combining Queries"}),"\n",(0,t.jsx)(n.p,{children:"You can combine multiple queries in sophisticated ways to create custom data relationships and nested structures."}),"\n",(0,t.jsxs)(l.A,{groupId:"combining-queries",defaultValue:"multiple",values:[{label:"Multiple Independent",value:"multiple"},{label:"Nested Queries",value:"nested"},{label:"Relational Queries",value:"relational"}],children:[(0,t.jsxs)(i.A,{value:"multiple",children:[(0,t.jsx)(n.p,{children:(0,t.jsx)(n.strong,{children:"Independent queries in same variable:"})}),(0,t.jsx)(n.pre,{children:(0,t.jsx)(n.code,{className:"language-graphql",children:'{\n  # Recent blog posts\n  recent_posts: posts_query(\n    arguments: {\n      post_type: "post"\n      posts_per_page: 5\n    }\n  ) {\n    posts {\n      post_title\n      post_date\n    }\n  }\n  \n  # Team members\n  team_members: users_query(\n    arguments: {\n      role: "author"\n      number: 4\n    }\n  ) {\n    users {\n      display_name\n      avatar_url\n    }\n  }\n  \n  # Site options\n  site_title: option_value(name: "blogname")\n  contact_email: option_value(name: "admin_email")\n}\n'})})]}),(0,t.jsxs)(i.A,{value:"nested",children:[(0,t.jsx)(n.p,{children:(0,t.jsx)(n.strong,{children:"Query within query structure:"})}),(0,t.jsx)(n.pre,{children:(0,t.jsx)(n.code,{className:"language-graphql",children:'{\n  post {\n    ID\n    post_title\n    post_author {\n      display_name\n      # Nested query for author\'s other posts\n      author_posts: posts_query(\n        arguments: {\n          author: "{{ID}}"\n          posts_per_page: 3\n          post_type: "post"\n        }\n      ) {\n        posts {\n          post_title\n          permalink\n        }\n      }\n    }\n  }\n}\n'})})]}),(0,t.jsxs)(i.A,{value:"relational",children:[(0,t.jsx)(n.p,{children:(0,t.jsx)(n.strong,{children:"Queries connected by data variables:"})}),(0,t.jsx)(n.pre,{children:(0,t.jsx)(n.code,{className:"language-graphql",children:'{\n  posts_query(\n    arguments: {\n      post_type: "post"\n      posts_per_page: 5\n    }\n  ) {\n    posts {\n      ID @private   # ID will be used in nested loop to establish relationship of terms to post\n      post_title\n      post_excerpt\n      \n      # Get categories for this specific post\n      post_categories: terms_query(\n        arguments: {\n          taxonomy: "category"\n          object_ids: "{{ID}}"   # limit terms to those assigned to current post in loop\n        }\n      ) {\n        terms {\n          name\n          slug\n        }\n      }\n    }\n  }\n}\n'})})]})]}),"\n",(0,t.jsx)(n.p,{children:(0,t.jsx)(n.strong,{children:"Key patterns:"})}),"\n",(0,t.jsxs)(n.ul,{children:["\n",(0,t.jsxs)(n.li,{children:[(0,t.jsx)(n.strong,{children:"Multiple queries:"})," Independent data sources in single variable"]}),"\n",(0,t.jsxs)(n.li,{children:[(0,t.jsx)(n.strong,{children:"Nested queries:"})," Queries inside object structures for hierarchical data"]}),"\n",(0,t.jsxs)(n.li,{children:[(0,t.jsx)(n.strong,{children:"Relational queries:"})," Using ",(0,t.jsx)(n.code,{children:"@private"})," fields and data variables to connect queries"]}),"\n"]}),"\n",(0,t.jsx)(n.p,{children:"These patterns enable sophisticated data relationships while maintaining readable query structure."}),"\n",(0,t.jsx)(n.h2,{id:"common-syntax-errors",children:"Common Syntax Errors"}),"\n",(0,t.jsxs)(l.A,{groupId:"syntax-errors",defaultValue:"root-object",values:[{label:"Missing Root Object",value:"root-object"},{label:"Missing Quotes",value:"quotes"},{label:"Invalid Field Names",value:"field-names"},{label:"Incorrect Braces",value:"braces"}],children:[(0,t.jsx)(i.A,{value:"root-object",children:(0,t.jsx)(n.pre,{children:(0,t.jsx)(n.code,{className:"language-graphql",children:"post {           \u274c\n  post_title\n}\n\n{                \u2705\n  post {\n    post_title\n  }\n}\n"})})}),(0,t.jsx)(i.A,{value:"quotes",children:(0,t.jsx)(n.pre,{children:(0,t.jsx)(n.code,{className:"language-graphql",children:'{\n  posts_query(\n    arguments: {\n      post_type: post     \u274c\n    }\n  ) {\n    posts {\n      post_title\n    }\n  }\n}\n\n{\n  posts_query(\n    arguments: {\n      post_type: "post"   \u2705\n    }\n  ) {\n    posts {\n      post_title\n    }\n  }\n}\n'})})}),(0,t.jsx)(i.A,{value:"field-names",children:(0,t.jsx)(n.pre,{children:(0,t.jsx)(n.code,{className:"language-graphql",children:"{\n  posts_query {\n    posts {\n      post title: post_title  \u274c (space in alias)\n      post_title: post_title  \u2705\n    }\n  }\n}\n"})})}),(0,t.jsx)(i.A,{value:"braces",children:(0,t.jsx)(n.pre,{children:(0,t.jsx)(n.code,{className:"language-graphql",children:"{\n  posts_query {\n    posts {\n      post_title\n  }  \u274c (missing closing brace)\n}\n\n{\n  posts_query {\n    posts {\n      post_title\n    }\n  }  \u2705\n}\n"})})})]}),"\n",(0,t.jsx)(n.p,{children:"These syntax rules form the foundation for writing valid Builderius GraphQL queries."}),"\n",(0,t.jsx)(n.h2,{id:"wpgraphql-syntax-comparison",children:"WPGraphQL Syntax Comparison"}),"\n",(0,t.jsxs)(n.p,{children:["Builderius uses its own GraphQL syntax - standard WPGraphQL queries won't work. This custom implementation uses familiar WordPress field names (",(0,t.jsx)(n.code,{children:"post_title"})," vs ",(0,t.jsx)(n.code,{children:"title"}),"), WordPress query arguments (",(0,t.jsx)(n.code,{children:"meta_query"}),", ",(0,t.jsx)(n.code,{children:"tax_query"}),"), and direct array access instead of edges/nodes pagination, making it more intuitive for WordPress developers."]}),"\n",(0,t.jsxs)(l.A,{groupId:"graphql-comparison",defaultValue:"builderius",values:[{label:"Builderius GraphQL",value:"builderius"},{label:"WPGraphQL",value:"wpgraphql"}],children:[(0,t.jsxs)(i.A,{value:"builderius",children:[(0,t.jsx)(n.pre,{children:(0,t.jsx)(n.code,{className:"language-graphql",children:'{\n  posts_query(\n    arguments: {\n      post_type: "post"\n      posts_per_page: 5\n    }\n  ) {\n    posts {\n      ID\n      post_title\n      featured_image {\n        thumbnail: file_url(size: THUMBNAIL)\n        medium: file_url(size: MEDIUM)\n        large: file_url(size: LARGE)\n        alt_text\n      }\n    }\n  }\n}\n'})}),(0,t.jsx)(n.p,{children:(0,t.jsx)(n.strong,{children:"Built-in WordPress features:"})}),(0,t.jsxs)(n.ul,{children:["\n",(0,t.jsxs)(n.li,{children:["WordPress field names (",(0,t.jsx)(n.code,{children:"post_title"}),")"]}),"\n",(0,t.jsx)(n.li,{children:"Arguments object with WordPress query parameters"}),"\n",(0,t.jsx)(n.li,{children:"Direct array access without pagination structure"}),"\n",(0,t.jsx)(n.li,{children:"Built-in image size constants"}),"\n"]})]}),(0,t.jsxs)(i.A,{value:"wpgraphql",children:[(0,t.jsx)(n.pre,{children:(0,t.jsx)(n.code,{className:"language-graphql",children:"query GetPosts {\n  posts(first: 5) {\
1n    edges {\n      node {\n        id\n        title\n        featuredImage {\n          node {\n            thumbnailUrl: sourceUrl(size: THUMBNAIL)\n            mediumUrl: sourceUrl(size: MEDIUM)\n            largeUrl: sourceUrl(size: LARGE)\n            altText\n          }\n        }\n      }\n    }\n  }\n}\n"})}),(0,t.jsx)(n.p,{children:(0,t.jsx)(n.strong,{children:"Standard GraphQL features:"})}),(0,t.jsxs)(n.ul,{children:["\n",(0,t.jsxs)(n.li,{children:["Standard GraphQL field names (",(0,t.jsx)(n.code,{children:"title"}),", ",(0,t.jsx)(n.code,{children:"sourceUrl"}),")"]}),"\n",(0,t.jsx)(n.li,{children:"Relay-style edges/nodes pagination structure"}),"\n",(0,t.jsx)(n.li,{children:"Nested node objects for media relationships"}),"\n",(0,t.jsx)(n.li,{children:"Query variables and fragments support"}),"\n"]})]})]})]})}function h(e={}){const{wrapper:n}={...(0,a.R)(),...e.components};return n?(0,t.jsx)(n,{...e,children:(0,t.jsx)(p,{...e})}):p(e)}},7227:(e,n,s)=>{s.d(n,{A:()=>l});s(6540);var r=s(8215);const t={tabItem:"tabItem_Ymn6"};var a=s(4848);function l({children:e,hidden:n,className:s}){return(0,a.jsx)("div",{role:"tabpanel",className:(0,r.A)(t.tabItem,s),hidden:n,children:e})}},8453:(e,n,s)=>{s.d(n,{R:()=>l,x:()=>i});var r=s(6540);const t={},a=r.createContext(t);function l(e){const n=r.useContext(a);return r.useMemo(function(){return"function"==typeof e?e(n):{...n,...e}},[n,e])}function i(e){let n;return n=e.disableParentContext?"function"==typeof e.components?e.components(t):e.components||t:l(e.components),r.createElement(a.Provider,{value:n},e.children)}},9489:(e,n,s)=>{s.d(n,{A:()=>q});var r=s(6540),t=s(8215),a=s(8630),l=s(4245),i=s(6347),o=s(6494),u=s(2814),c=s(5167),d=s(9900);function p(e){return r.Children.toArray(e).filter(e=>"\n"!==e).map(e=>{if(!e||(0,r.isValidElement)(e)&&function(e){const{props:n}=e;return!!n&&"object"==typeof n&&"value"in n}(e))return e;throw new 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(e){const{values:n,children:s}=e;return(0,r.useMemo)(()=>{const e=n??function(e){return p(e).map(({props:{value:e,label:n,attributes:s,default:r}})=>({value:e,label:n,attributes:s,default:r}))}(s);return function(e){const n=(0,c.XI)(e,(e,n)=>e.value===n.value);if(n.length>0)throw new Error(`Docusaurus error: Duplicate values "${n.map(e=>e.value).join(", ")}" found in <Tabs>. Every value needs to be unique.`)}(e),e},[n,s])}function x({value:e,tabValues:n}){return n.some(n=>n.value===e)}function m({queryString:e=!1,groupId:n}){const s=(0,i.W6)(),t=function({queryString:e=!1,groupId:n}){if("string"==typeof e)return e;if(!1===e)return null;if(!0===e&&!n)throw new 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 n??null}({queryString:e,groupId:n});return[(0,u.aZ)(t),(0,r.useCallback)(e=>{if(!t)return;const n=new URLSearchParams(s.location.search);n.set(t,e),s.replace({...s.location,search:n.toString()})},[t,s])]}function g(e){const{defaultValue:n,queryString:s=!1,groupId:t}=e,a=h(e),[l,i]=(0,r.useState)(()=>function({defaultValue:e,tabValues:n}){if(0===n.length)throw new Error("Docusaurus error: the <Tabs> component requires at least one <TabItem> children component");if(e){if(!x({value:e,tabValues:n}))throw new Error(`Docusaurus error: The <Tabs> has a defaultValue "${e}" but none of its children has the corresponding value. Available values are: ${n.map(e=>e.value).join(", ")}. If you intend to show no default tab, use defaultValue={null} instead.`);return e}const s=n.find(e=>e.default)??n[0];if(!s)throw new Error("Unexpected error: 0 tabValues");return s.value}({defaultValue:n,tabValues:a})),[u,c]=m({queryString:s,groupId:t}),[p,g]=function({groupId:e}){const n=function(e){return e?`docusaurus.tab.${e}`:null}(e),[s,t]=(0,d.Dv)(n);return[s,(0,r.useCallback)(e=>{n&&t.set(e)},[n,t])]}({groupId:t}),j=(()=>{const e=u??p;return x({value:e,tabValues:a})?e:null})();(0,o.A)(()=>{j&&i(j)},[j]);return{selectedValue:l,selectValue:(0,r.useCallback)(e=>{if(!x({value:e,tabValues:a}))throw new Error(`Can't select invalid tab value=${e}`);i(e),c(e),g(e)},[c,g,a]),tabValues:a}}var j=s(1062);const b={tabList:"tabList__CuJ",tabItem:"tabItem_LNqP"};var v=s(4848);function f({className:e,block:n,selectedValue:s,selectValue:r,tabValues:a}){const i=[],{blockElementScrollPositionUntilNextRender:o}=(0,l.a_)(),u=e=>{const n=e.currentTarget,t=i.indexOf(n),l=a[t].value;l!==s&&(o(n),r(l))},c=e=>{let n=null;switch(e.key){case"Enter":u(e);break;case"ArrowRight":{const s=i.indexOf(e.currentTarget)+1;n=i[s]??i[0];break}case"ArrowLeft":{const s=i.indexOf(e.currentTarget)-1;n=i[s]??i[i.length-1];break}}n?.focus()};return(0,v.jsx)("ul",{role:"tablist","aria-orientation":"horizontal",className:(0,t.A)("tabs",{"tabs--block":n},e),children:a.map(({value:e,label:n,attributes:r})=>(0,v.jsx)("li",{role:"tab",tabIndex:s===e?0:-1,"aria-selected":s===e,ref:e=>{i.push(e)},onKeyDown:c,onClick:u,...r,className:(0,t.A)("tabs__item",b.tabItem,r?.className,{"tabs__item--active":s===e}),children:n??e},e))})}function y({lazy:e,children:n,selectedValue:s}
1){const a=(Array.isArray(n)?n:[n]).filter(Boolean);if(e){const e=a.find(e=>e.props.value===s);return e?(0,r.cloneElement)(e,{className:(0,t.A)("margin-top--md",e.props.className)}):null}return(0,v.jsx)("div",{className:"margin-top--md",children:a.map((e,n)=>(0,r.cloneElement)(e,{key:n,hidden:e.props.value!==s}))})}function _(e){const n=g(e);return(0,v.jsxs)("div",{className:(0,t.A)(a.G.tabs.container,"tabs-container",b.tabList),children:[(0,v.jsx)(f,{...n,...e}),(0,v.jsx)(y,{...n,...e})]})}function q(e){const n=(0,j.A)();return(0,v.jsx)(_,{...e,children:p(e.children)},String(n))}}}]);

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.