### GraphQL @example Directive Source: https://developers.civicengine.com/docs/api/graphql/reference/directives/example The @example directive is used to annotate schema elements with example values for documentation purposes. ```APIDOC ## @example Directive ### Description The @example directive allows developers to attach example values to schema definitions, including arguments, fields, inputs, and objects. ### Definition ```graphql directive @example(value: String!) on | ARGUMENT_DEFINITION | FIELD | FIELD_DEFINITION | INPUT_FIELD_DEFINITION | INPUT_OBJECT | INTERFACE | OBJECT | SCALAR ``` ### Arguments - **value** (String!) - Required - The example value to be associated with the schema element. ``` -------------------------------- ### Example OfficeHolderFilter Usage Source: https://developers.civicengine.com/docs/api/graphql/reference/inputs/office-holder-filter An example of how to use the OfficeHolderFilter in a query. This example shows how to specify empty filters for 'endAt' and 'startAt'. ```json { "endAt": {}, "startAt": {} } ``` -------------------------------- ### PositionEdge Example Query Source: https://developers.civicengine.com/docs/api/graphql/reference/objects/position-edge Example JSON structure representing a PositionEdge node. ```json { "node": { "electionFrequencies": [ { "frequency": [] } ], "geofences": { "edges": [ { "node": {} } ], "pageInfo": {} }, "issues": [ {} ], "normalizedPosition": { "issues": [] }, "officeHolders": { "edges": [ { "node": "{ officeHolders(filterBy: {isCurrent: true, isAppointed: false}) { nodes { id } } } # See only office holders that are currently in office and not appointed" } ] }, "places": { "edges": [ { "node": { "addresses": [ {} ], "contacts": [ {} ], "forms": [ { "fields": [ {} ] } ], "positions": {}, "registrationOptions": [ { "documents": [], "eligibility": [], "features": [] } ], "urls": [ {} ] } } ] }, "races": { "edges": [ { "node": { "candidacies": [ { "candidate": { "candidacies": [], "contacts": [], "degrees": [ {} ], "experiences": [ {} ], "headshot": {}, "images": [ {} ], "urls": [] }, "election": { "measures": { "edges": [ { "node": { "arguments": [ {} ], "endorsements": [ { "organization": { "children": [], "urls": [] } } ], "party": {} } } ] }, "milestones": [ { "features": [] } ], "vipElections": [ {} ], "votingDays": { "edges": [ { "node": {} } ] }, "votingLocations": { "edges": [ { "node": {} } ] } }, "endorsements": [], "parties": [], "stances": [ {} ] } ], "filingPeriods": [ {} ] } } ] } } } ``` -------------------------------- ### PlaceEdge Example Source: https://developers.civicengine.com/docs/api/graphql/reference/objects/place-edge A comprehensive example demonstrating the structure of a PlaceEdge object and its nested data. ```APIDOC ### Example ```json { "node": { "addresses": [ {} ], "contacts": [ {} ], "forms": [ { "fields": [ {} ] } ], "positions": { "edges": [ { "node": { "electionFrequencies": [ { "frequency": [] } ], "geofences": { "edges": [ { "node": {} } ], "pageInfo": {} }, "issues": [ {} ], "normalizedPosition": { "issues": [] }, "officeHolders": { "edges": [ { "node": "{ officeHolders(filterBy: {isCurrent: true, isAppointed: false}) { nodes { id } } } # See only office holders that are currently in office and not appointed" } ] }, "places": {}, "races": { "edges": [ { "node": { "candidacies": [ { "candidate": { "candidacies": [], "contacts": [], "degrees": [ {} ], "experiences": [ {} ], "headshot": {}, "images": [ {} ], "urls": [ {} ] }, "election": { "measures": { "edges": [ { "node": { "arguments": [ {} ], "endorsements": [ { "organization": { "children": [], "urls": [] } } ], "party": {} } } ] }, "milestones": [ { "features": [] } ], "vipElections": [ {} ], "votingDays": { "edges": [ { "node": {} } ] }, "votingLocations": { "edges": [ { "node": {} } ] } }, "endorsements": [], "parties": [], "stances": [ {} ] } ], "filingPeriods": [ {} ] } } ] } } } ] }, "registrationOptions": [ { "documents": [], "eligibility": [], "features": [] } ], "urls": [] } } ``` ``` -------------------------------- ### JavaScript Example: Fetching All Paginated Issues with Apollo Client Source: https://developers.civicengine.com/docs/api/graphql/pagination Implement a JavaScript function using Apollo Client to fetch all issues by repeatedly querying subsequent pages until no more pages are available. Ensure Apollo Client is installed and configured. ```javascript import { ApolloClient, InMemoryCache, gql } from '@apollo/client' const client = new ApolloClient({ uri: 'https://bpi.civicengine.com/graphql', cache: new InMemoryCache(), }) const GET_ISSUES = gql` query Issues($first: Int, $after: String) { issues(first: $first, after: $after) { edges { node { id name } cursor } pageInfo { endCursor hasNextPage } } } ` async function fetchAllIssues(first) { let allIssues = [] let after = null let hasNextPage = true while (hasNextPage) { const { data } = await client.query({ query: GET_ISSUES, variables: { first, after }, }) const newIssues = data.issues.edges.map((edge) => edge.node) allIssues = [...allIssues, ...newIssues] after = data.issues.pageInfo.endCursor hasNextPage = data.issues.pageInfo.hasNextPage } return allIssues } // Fetch all issues in batches of 5 fetchAllIssues(5).then((allIssues) => { console.log('All issues:', allIssues) }) ``` -------------------------------- ### BallotEvent Example Query Source: https://developers.civicengine.com/docs/api/graphql/reference/objects/ballot-event A basic example showing the structure of a BallotEvent object. ```json { "ballot": {} } ``` -------------------------------- ### LocationFilter Usage Example Source: https://developers.civicengine.com/docs/api/graphql/reference/inputs/location-filter A basic example showing how to structure the LocationFilter input in a query. ```json { "point": {} } ``` -------------------------------- ### Empty AddressInput Example Source: https://developers.civicengine.com/docs/api/graphql/reference/inputs/address-input An example of an empty AddressInput object. This can be used when no address information is provided. ```json {} ``` -------------------------------- ### OfficeHolderConnection Example Usage Source: https://developers.civicengine.com/docs/api/graphql/reference/objects/office-holder-connection An example of how to query for office holders, filtering for those currently in office and not appointed, and retrieving their IDs. ```json { "edges": [ { "node": "{ officeHolders(filterBy: {isCurrent: true, isAppointed: false}) { nodes { id } } } # See only office holders that are currently in office and not appointed" } ], "pageInfo": {} } ``` -------------------------------- ### Example LocationWithAddressInput Usage Source: https://developers.civicengine.com/docs/api/graphql/reference/inputs/location-with-address-input Provides a JSON representation of the input object. ```json { "address": {}, "point": {} } ``` -------------------------------- ### Organization Example JSON Source: https://developers.civicengine.com/docs/api/graphql/reference/objects/organization Provides an example JSON structure for an Organization object, illustrating the expected format for nested objects like 'children', 'issue', and 'urls'. ```json { "children": [], "issue": {}, "urls": [ {} ] } ``` -------------------------------- ### ActionConnection JSON Example Source: https://developers.civicengine.com/docs/api/graphql/reference/objects/action-connection Example JSON structure for an ActionConnection response. ```json { "edges": [ { "node": { "organization": { "children": [], "issue": {}, "urls": [ {} ] } } } ], "pageInfo": {} } ``` -------------------------------- ### GeofenceConnection Example Usage Source: https://developers.civicengine.com/docs/api/graphql/reference/objects/geofence-connection An example JSON structure demonstrating how GeofenceConnection might be represented, including edges with nodes and pageInfo. ```json { "edges": [ { "node": {} } ], "pageInfo": {} } ``` -------------------------------- ### Empty FormFilter Example Source: https://developers.civicengine.com/docs/api/graphql/reference/inputs/form-filter An example of an empty filter object. ```json {} ``` -------------------------------- ### MtfccEdge Example Usage Source: https://developers.civicengine.com/docs/api/graphql/reference/objects/mtfcc-edge An example JSON structure for an MtfccEdge, showing the node field. Useful for understanding data format. ```json { "node": {} } ``` -------------------------------- ### Election API Example Source: https://developers.civicengine.com/docs/api/graphql/reference/objects/election An example of a query for election data, including measures, milestones, races, and voting details. ```APIDOC ## Election Data Query Example ### Description This example demonstrates how to query for election data, including details about measures, milestones, races, and voting information. ### Query ```graphql { measures { edges { node { arguments endorsements { organization { children issue urls } } geofences { edges { node } pageInfo } party } } } milestones { features } races { edges { node { candidacies { candidate { candidacies contacts degrees experiences headshot images officeHolders { edges { node { officeHolders(filterBy: {isCurrent: true, isAppointed: false}) { nodes { id } } } } } urls } endorsements parties position { electionFrequencies { frequency } issues normalizedPosition { issues } places { edges { node { addresses contacts forms { fields } positions { edges } registrationOptions { documents eligibility features } urls } } } } stances } filingPeriods } } } vipElections votingDays { edges { node } } votingLocations { edges { node } } } ``` ``` -------------------------------- ### Query ElectionEdge Example Source: https://developers.civicengine.com/docs/api/graphql/reference/objects/election-edge Example JSON structure for an ElectionEdge node containing nested election data. ```json { "node": { "measures": { "edges": [ { "node": { "arguments": [ {} ], "endorsements": [ { "organization": { "children": [], "issue": {}, "urls": [ {} ] } } ], "geofences": { "edges": [ { "node": {} } ], "pageInfo": {} }, "party": {} } } ] }, "milestones": [ { "features": [] } ], "races": { "edges": [ { "node": { "candidacies": [ { "candidate": { "candidacies": [], "contacts": [ {} ], "degrees": [ {} ], "experiences": [ {} ], "headshot": {}, "images": [ {} ], "officeHolders": { "edges": [ { "node": "{ officeHolders(filterBy: {isCurrent: true, isAppointed: false}) { nodes { id } } } # See only office holders that are currently in office and not appointed" } ] }, "urls": [] }, "endorsements": [], "parties": [], "position": { "electionFrequencies": [ { "frequency": [] } ], "issues": [], "normalizedPosition": { "issues": [] }, "places": { "edges": [ { "node": { "addresses": [ {} ], "contacts": [], "forms": [ { "fields": [ {} ] } ], "positions": { "edges": [ {} ] }, "registrationOptions": [ { "documents": [], "eligibility": [], "features": [] } ], "urls": [] } } ] } }, "stances": [ {} ] } ], "filingPeriods": [ {} ] } } ] }, "vipElections": [ {} ], "votingDays": { "edges": [ { "node": {} } ] }, "votingLocations": { "edges": [ { "node": {} } ] } } } ``` -------------------------------- ### Define the @example directive Source: https://developers.civicengine.com/docs/api/graphql/reference/directives/example This directive is applicable to various schema definitions including fields, arguments, and objects. ```graphql directive @example( value: String! ) on | ARGUMENT_DEFINITION | FIELD | FIELD_DEFINITION | INPUT_FIELD_DEFINITION | INPUT_OBJECT | INTERFACE | OBJECT | SCALAR ``` -------------------------------- ### Stance Query Example Source: https://developers.civicengine.com/docs/api/graphql/reference/objects/stance A basic query structure for retrieving Stance information. ```json { "issue": {} } ``` -------------------------------- ### PlaceEdge Example Usage Source: https://developers.civicengine.com/docs/api/graphql/reference/objects/place-edge An example demonstrating the structure of a PlaceEdge within a complex JSON object. This illustrates how PlaceEdge is used to paginate through related data like positions and races. ```json { "node": { "addresses": [ {} ], "contacts": [ {} ], "forms": [ { "fields": [ {} ] } ], "positions": { "edges": [ { "node": { "electionFrequencies": [ { "frequency": [] } ], "geofences": { "edges": [ { "node": {} } ], "pageInfo": {} }, "issues": [ {} ], "normalizedPosition": { "issues": [] }, "officeHolders": { "edges": [ { "node": "{ officeHolders(filterBy: {isCurrent: true, isAppointed: false}) { nodes { id } } } # See only office holders that are currently in office and not appointed" } ] }, "places": {}, "races": { "edges": [ { "node": { "candidacies": [ { "candidate": { "candidacies": [], "contacts": [], "degrees": [ {} ], "experiences": [ {} ], "headshot": {}, "images": [ {} ], "urls": [ {} ] }, "election": { "measures": { "edges": [ { "node": { "arguments": [ {} ], "endorsements": [ { "organization": { "children": [], "urls": [] } } ], "party": {} } } ] }, "milestones": [ { "features": [] } ], "vipElections": [ {} ], "votingDays": { "edges": [ { "node": {} } ] }, "votingLocations": { "edges": [ { "node": {} } ] } }, "endorsements": [], "parties": [], "stances": [ {} ] } ], "filingPeriods": [ {} ] } } ] } } } ] }, "registrationOptions": [ { "documents": [], "eligibility": [], "features": [] } ], "urls": [] } } ``` -------------------------------- ### VipElection Example Usage Source: https://developers.civicengine.com/docs/api/graphql/reference/objects/vip-election An example JSON structure for a VipElection object, showing an empty party object. This can be used as a placeholder or for basic testing. ```json { "party": {} } ``` -------------------------------- ### MeasureFilter Example Usage Source: https://developers.civicengine.com/docs/api/graphql/reference/inputs/measure-filter An example of how to use the MeasureFilter with an empty electionDay filter. ```json { "electionDay": {} } ``` -------------------------------- ### OfficeHolderEdge Usage Example Source: https://developers.civicengine.com/docs/api/graphql/reference/objects/office-holder-edge Demonstrates how to query office holders using the OfficeHolderEdge structure with specific filters. ```json { "node": "{ officeHolders(filterBy: {isCurrent: true, isAppointed: false}) { nodes { id } } } # See only office holders that are currently in office and not appointed" } ``` -------------------------------- ### Example PositionRetiredAtFilter Usage Source: https://developers.civicengine.com/docs/api/graphql/reference/inputs/position-retired-at-filter An example of how to structure a query using PositionRetiredAtFilter, with empty filters for both date and presence. ```json { "dateFilter": {}, "presenceFilter": {} } ``` -------------------------------- ### GeofenceEdge Example Source: https://developers.civicengine.com/docs/api/graphql/reference/objects/geofence-edge A JSON representation of a GeofenceEdge object. ```json { "node": {} } ``` -------------------------------- ### Example DivisionFilter Usage Source: https://developers.civicengine.com/docs/api/graphql/reference/inputs/division-filter An example of how to use the DivisionFilter to query for a specific congressional district without recursion. Ensure the OCD-ID format is correct. ```json { "ocdId": "ocd-division/country:us/state:il/cd:20", "recursive": false } ``` -------------------------------- ### Endorsement GraphQL Query Example Source: https://developers.civicengine.com/docs/api/graphql/reference/objects/endorsement A sample JSON response structure for an Endorsement-related query. ```json { "organization": { "children": [], "issue": {}, "urls": [ {} ] } } ``` -------------------------------- ### PositionConnection JSON Example Source: https://developers.civicengine.com/docs/api/graphql/reference/objects/position-connection A sample JSON structure representing a PositionConnection response. ```json { "edges": [ { "node": { "electionFrequencies": [ { "frequency": [] } ], "geofences": { "edges": [ { "node": {} } ], "pageInfo": {} }, "issues": [ {} ], "normalizedPosition": { "issues": [] }, "officeHolders": { "edges": [ { "node": "{ officeHolders(filterBy: {isCurrent: true, isAppointed: false}) { nodes { id } } } # See only office holders that are currently in office and not appointed" } ] }, "places": { "edges": [ { "node": { "addresses": [ {} ], "contacts": [ {} ], "forms": [ { "fields": [ {} ] } ], "registrationOptions": [ { "documents": [], "eligibility": [], "features": [] } ], "urls": [ {} ] } } ] }, "races": { "edges": [ { "node": { "candidacies": [ { "candidate": { "candidacies": [], "contacts": [], "degrees": [ {} ], "experiences": [ {} ], "headshot": {}, "images": [ {} ], "urls": [] }, "election": { "measures": { "edges": [ { "node": { "arguments": [ {} ], "endorsements": [ { "organization": { "children": [], "urls": [] } } ], "party": {} } } ] }, "milestones": [ { "features": [] } ], "vipElections": [ {} ], "votingDays": { "edges": [ { "node": {} } ] }, "votingLocations": { "edges": [ { "node": {} } ] } }, "endorsements": [], "parties": [], "stances": [ {} ] } ], "filingPeriods": [ {} ] } } ] } } } ] } ``` -------------------------------- ### OfficeHolders Query Example Source: https://developers.civicengine.com/docs/api/graphql/reference/interfaces/has-office-holders Example of how to query for office holders, filtering by current and non-appointed status. This demonstrates nested querying within the 'node' of the edges. ```graphql { "officeHolders": { "edges": [ { "node": "{ officeHolders(filterBy: {isCurrent: true, isAppointed: false}) { nodes { id } } } # See only office holders that are currently in office and not appointed" } ], "pageInfo": {} } } ``` -------------------------------- ### RaceConnection Example Usage Source: https://developers.civicengine.com/docs/api/graphql/reference/objects/race-connection An example JSON structure demonstrating how RaceConnection data might be returned, including nested candidate, election, and office holder information. ```json { "edges": [ { "node": { "candidacies": [ { "candidate": { "candidacies": [], "contacts": [ {} ], "degrees": [ {} ], "experiences": [ {} ], "headshot": {}, "images": [ {} ], "officeHolders": { "edges": [ { "node": "{ officeHolders(filterBy: {isCurrent: true, isAppointed: false}) { nodes { id } } } # See only office holders that are currently in office and not appointed" } ], "pageInfo": {} }, "urls": [ {} ] }, "election": { "measures": { "edges": [ { "node": { "arguments": [ {} ], "endorsements": [ { "organization": { "children": [], "issue": {}, "urls": [] } } ], "geofences": { "edges": [ { "node": {} } ] }, "party": {} } } ] }, "milestones": [ { "features": [] } ], "vipElections": [ {} ], "votingDays": { "edges": [ { "node": {} } ] }, "votingLocations": { "edges": [ { "node": { "address": {} } } ] } }, "endorsements": [], "parties": [], "position": { "electionFrequencies": [ { "frequency": [] } ], "issues": [], "normalizedPosition": { "issues": [] }, "places": { "edges": [ { "node": { "addresses": [], "contacts": [], "forms": [ { "fields": [ {} ] } ], "positions": { "edges": [ {} ] }, "registrationOptions": [ { "documents": [], "eligibility": [], "features": [] } ], "urls": [] } } ] } }, "stances": [ {} ] } ], "filingPeriods": [ {} ] } } ] } ``` -------------------------------- ### Retrieve Election Data Source: https://developers.civicengine.com/docs/api/graphql/reference/objects/measure-connection This example shows how to query election data, including details about races, candidacies, and office holders. It demonstrates filtering for current, non-appointed office holders. ```json { "edges": [ { "node": { "arguments": [ {} ], "election": { "milestones": [ { "features": [] } ], "races": { "edges": [ { "node": { "candidacies": [ { "candidate": { "candidacies": [], "contacts": [ {} ], "degrees": [ {} ], "experiences": [ {} ], "headshot": {}, "images": [ {} ], "officeHolders": { "edges": [ { "node": "{ officeHolders(filterBy: {isCurrent: true, isAppointed: false}) { nodes { id } } } # See only office holders that are currently in office and not appointed" } ], "pageInfo": {} }, "urls": [ {} ] }, "endorsements": [ { "organization": { "children": [], "issue": {}, "urls": [] } } ], "parties": [ {} ], "position": { "electionFrequencies": [ { "frequency": [] } ], "geofences": { "edges": [ { "node": {} } ] }, "issues": [], "normalizedPosition": { "issues": [] }, "places": { "edges": [ { "node": { "addresses": [ {} ], "contacts": [], "forms": [ { "fields": [ {} ] } ], "positions": { "edges": [ {} ] }, "registrationOptions": [ { "documents": [], "eligibility": [], "features": [] } ], "urls": [] } } ] } }, "stances": [ {} ] } ], "filingPeriods": [ {} ] } } ] }, "vipElections": [ {} ], "votingDays": { "edges": [ { "node": {} } ] }, "votingLocations": { "edges": [ { "node": {} } ] } }, "endorsements": [] } } ] } ``` -------------------------------- ### GraphQL Query Example for Argument Data Source: https://developers.civicengine.com/docs/api/graphql/reference/objects/argument An example of a GraphQL query to retrieve detailed information about a measure, including its arguments and associated data like candidate information and election details. Note the inline comment for filtering office holders. ```graphql { "measure": { "election": { "measures": { "edges": [ {} ], "pageInfo": {} }, "milestones": [ { "features": [] } ], "races": { "edges": [ { "node": { "candidacies": [ { "candidate": { "candidacies": [], "contacts": [ {} ], "degrees": [ {} ], "experiences": [ {} ], "headshot": {}, "images": [ {} ], "officeHolders": { "edges": [ { "node": "{ officeHolders(filterBy: {isCurrent: true, isAppointed: false}) { nodes { id } } } # See only office holders that are currently in office and not appointed" } ] }, "urls": [ {} ] }, "endorsements": [ { "organization": { "children": [], "issue": {}, "urls": [] } } ], "parties": [ {} ], "position": { "electionFrequencies": [ { "frequency": [] } ], "geofences": { "edges": [ { "node": {} } ] }, "issues": [], "normalizedPosition": { "issues": [] }, "places": { "edges": [ { "node": { "addresses": [ {} ], "contacts": [], "forms": [ { "fields": [ {} ] } ], "positions": { "edges": [ {} ] }, "registrationOptions": [ { "documents": [], "eligibility": [], "features": [] } ], "urls": [] } } ] } }, "stances": [ {} ] } ], "filingPeriods": [ {} ] } } ] }, "vipElections": [ {} ], "votingDays": { "edges": [ { "node": {} } ] }, "votingLocations": { "edges": [ { "node": {} } ] } }, "endorsements": [] } } ``` -------------------------------- ### OrganizationEdge JSON Example Source: https://developers.civicengine.com/docs/api/graphql/reference/objects/organization-edge Represents a sample JSON response for an OrganizationEdge object. ```json { "node": { "children": [], "issue": {}, "urls": [ {} ] } } ``` -------------------------------- ### Example ElectionConnection Data Structure Source: https://developers.civicengine.com/docs/api/graphql/reference/objects/election-connection An example JSON structure representing data returned for an ElectionConnection, illustrating nested objects and arrays for election details. ```json { "edges": [ { "node": { "measures": { "edges": [ { "node": { "arguments": [ {} ], "endorsements": [ { "organization": { "children": [], "issue": {}, "urls": [ {} ] } } ], "geofences": { "edges": [ { "node": {} } ], "pageInfo": {} }, "party": {} } } ] }, "milestones": [ { "features": [] } ], "races": { "edges": [ { "node": { "candidacies": [ { "candidate": { "candidacies": [], "contacts": [ {} ], "degrees": [ {} ], "experiences": [ {} ], "headshot": {}, "images": [ {} ], "officeHolders": { "edges": [ { "node": "{ officeHolders(filterBy: {isCurrent: true, isAppointed: false}) { nodes { id } } } # See only office holders that are currently in office and not appointed" } ] }, "urls": [] }, "endorsements": [], "parties": [], "position": { "electionFrequencies": [ { "frequency": [] } ], "issues": [], "normalizedPosition": { "issues": [] }, "places": { "edges": [ { "node": { "addresses": [ {} ], "contacts": [], "forms": [ { "fields": [ {} ] } ], "positions": { "edges": [ {} ] }, "registrationOptions": [ { "documents": [], "eligibility": [], "features": [] } ], "urls": [] } } ] } }, "stances": [ {} ] } ], "filingPeriods": [ {} ] } } ] }, "vipElections": [ {} ], "votingDays": { "edges": [ { "node": {} } ] }, "votingLocations": { "edges": [ { "node": {} } ] } } } ] } ``` -------------------------------- ### OrganizationConnection Example Response Source: https://developers.civicengine.com/docs/api/graphql/reference/objects/organization-connection An example JSON structure for an OrganizationConnection response, showing nested data for edges and pageInfo. This is typically returned by the organizations query. ```json { "edges": [ { "node": { "children": [], "issue": {}, "urls": [ {} ] } } ], "pageInfo": {} } ``` -------------------------------- ### PersonEdge Example Usage Source: https://developers.civicengine.com/docs/api/graphql/reference/objects/person-edge An example JSON structure demonstrating how a PersonEdge might appear within a larger data payload, showing nested election and race information. Note the inline comment for filtering office holders. ```json { "node": { "candidacies": [ { "election": { "measures": { "edges": [ { "node": { "arguments": [ {} ], "endorsements": [ { "organization": { "children": [], "issue": {}, "urls": [ {} ] } } ], "geofences": { "edges": [ { "node": {} } ], "pageInfo": {} }, "party": {} } } ] }, "milestones": [ { "features": [] } ], "races": { "edges": [ { "node": { "candidacies": [], "filingPeriods": [ {} ], "position": { "electionFrequencies": [ { "frequency": [] } ], "issues": [], "normalizedPosition": { "issues": [] }, "officeHolders": { "edges": [ { "node": "{ officeHolders(filterBy: {isCurrent: true, isAppointed: false}) { nodes { id } } } # See only office holders that are currently in office and not appointed" } ] }, "places": { "edges": [ { "node": { "addresses": [ {} ], "contacts": [ {} ], "forms": [ { "fields": [ {} ] } ], "positions": { "edges": [ {} ] }, "registrationOptions": [ { "documents": [], "eligibility": [], "features": [] } ], "urls": [] } } ] } } } } ] }, "vipElections": [ {} ], "votingDays": { "edges": [ { "node": {} } ] }, "votingLocations": { "edges": [ { "node": {} } ] } }, "endorsements": [], "parties": [], "stances": [ {} ] } ], "contacts": [], "degrees": [ {} ], "experiences": [ {} ], "headshot": {}, "images": [ {} ], "urls": [] } } ``` -------------------------------- ### Combine Widget Element with Container Styling Source: https://developers.civicengine.com/docs/widget This example shows how to wrap the widget div with the `.civicengine-container` for custom styling, combining steps 2 and 3 for the Gold Level widget. ```html