{"_id":"@attheminute/gatsby-source-storyblok","_rev":"1-182cf9bb8f13051af1a9a0fa674078e4","name":"@attheminute/gatsby-source-storyblok","dist-tags":{"latest":"0.0.0-development"},"versions":{"0.0.0-development":{"name":"@attheminute/gatsby-source-storyblok","description":"Gatsby source plugin for building websites using the Storyblok headless CMS as a data source.","version":"0.0.0-development","author":{"name":"Alexander Feiglstorfer","email":"af@storyblok.com"},"dependencies":{"json-stringify-safe":"^5.0.1","storyblok-js-client":"^2.5.2"},"scripts":{"test":"jest"},"deprecated":false,"private":false,"keywords":["gatsby","gatsby-plugin","gatsby-source-plugin","storyblok","headless-cms"],"main":"index.js","license":"MIT","devDependencies":{"babel-cli":"^6.26.0","jest":"^26.1.0"},"peerDependencies":{"storyblok-react":"^0.1.0"},"homepage":"https://www.storyblok.com","repository":{"type":"git","url":"git+https://github.com/storyblok/gatsby-source-storyblok.git"},"gitHead":"71762c2a27642704ffcac9ee04265e10012e473a","bugs":{"url":"https://github.com/storyblok/gatsby-source-storyblok/issues"},"_id":"@attheminute/gatsby-source-storyblok@0.0.0-development","_nodeVersion":"12.18.3","_npmVersion":"6.14.11","dist":{"integrity":"sha512-sycd5Kimo4Ogu9ZTBmra/PFP1/wXrqpcHYEDi4ocyBQTIy9tDZlg1TLkNCXOS/K3FN8lBDt+b/LOMg+CI8E25w==","shasum":"bdeff6f67ae56d6e1f341810164104ebebdba11d","tarball":"https://registry.npmjs.org/@attheminute/gatsby-source-storyblok/-/gatsby-source-storyblok-0.0.0-development.tgz","fileCount":9,"unpackedSize":15326,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgRknmCRA9TVsSAnZWagAAhq0P/RnIUcP9u/GziRrT+MuB\n/YhNz5fvNRZa3PPeXfchQuiH6dqeuALoGYiKQUdnyr+9i9OQVEdiSOqq+CqR\nErimzoC/AIt9dmmzsVR9dWGIv5tvzhy7jaoPjBT5+5JigAaqGtJuINtFQl/q\nqr3N+DdWC4VDnxCtozPJcKvztB1Y047LEcHTTrVUKfrzYR2GY1smpy0lgEED\n/6NJd/knuKEEEb1Dkv0q0mCx28vm9fpDUZvjtl8HeigyuBLGrTQ76sP3SZHW\nxwC2UU7xFs6L72JR5VIOO89Cld6Yq4bbuEhxw+InXX/6dSuVfZHGPIxvCusC\nXVCPJcZBk/h7Sqfn+a7LJAB2sjY9PlfyTYcoC/FdvFgKy2r1t992vTyQoqhR\nP+GckUxmUo3VJ0DcsXEfCJutlpMJ4wcT0i/c8jfcviYM2AnycDKt7/XWYdMq\nXAMZk5rq73bFfYcABfvki4yFzrvEws4dGXk5fkNRiip96UsYmyNdikGP6B95\nYs7nwe2snheO7FnEWavJ9TQsIbRP+ZlSmETyeMbcNmbLqqce+jori8Qmt2bv\nvQrWZfa47WGDaapBJRivE9fPdbr+knJri2ZFFul9wbMD8B1xbyJMM4sq+v2P\nbt3y3i5trSLLjilV7dSCkeSK790vO8ZbJZ0PwaJ47khgL0LXAnY4ULYaqYvU\nVHyA\r\n=ZJgt\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQD6bLAq7Mx2jtTRWDUeeO9spmAwevBUX+2XWqfuUiIaMwIhALjv+FVsIZrDhg5FQXe7aiiIGT8P9gYbCh2UfNj/WYqh"}]},"_npmUser":{"name":"sdupz","email":"sdupz.nz@gmail.com"},"directories":{},"maintainers":[{"name":"sdupz","email":"sdupz.nz@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/gatsby-source-storyblok_0.0.0-development_1615219173668_0.14468873520136927"},"_hasShrinkwrap":false}},"time":{"created":"2021-03-08T15:59:33.426Z","0.0.0-development":"2021-03-08T15:59:33.814Z","modified":"2022-04-04T16:20:38.265Z"},"maintainers":[{"name":"sdupz","email":"sdupz.nz@gmail.com"}],"description":"Gatsby source plugin for building websites using the Storyblok headless CMS as a data source.","homepage":"https://www.storyblok.com","keywords":["gatsby","gatsby-plugin","gatsby-source-plugin","storyblok","headless-cms"],"repository":{"type":"git","url":"git+https://github.com/storyblok/gatsby-source-storyblok.git"},"author":{"name":"Alexander Feiglstorfer","email":"af@storyblok.com"},"bugs":{"url":"https://github.com/storyblok/gatsby-source-storyblok/issues"},"license":"MIT","readme":"# Introduction\n\nThis is a Gatsby source plugin for building websites using the [Storyblok](https://www.storyblok.com) headless CMS with true visual preview as a data source.\n\n## Install\n\n```sh\n$ npm install --save gatsby-source-storyblok # or yarn add gatsby-source-storyblok\n```\n\n## Usage\n\n1. You need to declare the plugin use and its options in `gatsby-config.js`\n\n```JavaScript\nmodule.exports = {\n  plugins: [\n    {\n      resolve: 'gatsby-source-storyblok',\n      options: {\n        accessToken: 'YOUR_TOKEN',\n        version: 'draft',\n        languages: ['de', 'at'] // Optional parameter. Omission will retrieve all languages by default.\n      }\n    }\n  ]\n}\n```\n\n2. You need to create a [template](https://www.gatsbyjs.org/docs/programmatically-create-pages-from-data/#specifying-a-template) file to get the data from GraphQL\n\n```js\nimport React from 'react'\nimport { graphql } from 'gatsby'\n\nexport default function StoryblokEntry ({ data }) {\n  const story = data.storyblokEntry\n\n  return (\n    <div>{story.name}</div>\n  )\n}\n\nexport const query = graphql`\n  query($slug: String!) {\n    storyblokEntry(slug: { eq: $slug }) {\n      id\n      name\n      full_slug\n    }\n  }\n`\n```\n\n3. After this, you need to create the pages for your application. For this, edit your `gatsby-node.js`.\n\n```js\nconst path = require('path')\n\nexports.createPages = async ({ graphql, actions }) => {\n  const storyblokEntry = path.resolve('src/templates/storyblok-entry.js')\n\n  // querying the storyblok data from GraphQL data layer\n  const { data } = await graphql(\n    `query {\n      allStoryblokEntry {\n        edges {\n          node {\n            id\n            full_slug\n          }\n        }\n      }\n    }`\n  )\n\n  // creating pages using createPage function like described in the documentation\n  // https://www.gatsbyjs.org/docs/programmatically-create-pages-from-data/#creating-pages\n  data.allStoryblokEntry.edges.forEach(edge => {\n    const full_slug = edge.node.full_slug\n\n    actions.createPage({\n      path: full_slug,\n      component: storyblokEntry,\n      context: {\n        slug: full_slug\n      },\n    })\n  })\n}\n```\n\n## The options object in details\n\n```js\n{\n  resolve: 'gatsby-source-storyblok',\n  options: {\n    accessToken: 'YOUR_TOKEN',\n    version: 'draft',\n    resolveRelations: [''],\n    includeLinks: false\n  }\n}\n```\n\n* `accessToken`: Your Storyblok draft token\n* `version`: 'draft' or 'published'\n* `timeout`: Optionally provide a timeout for the api request\n* `resolveLinks`: This will automatically resolve internal links of the multilink field type. If the value is `story` the whole story object will be included.  If the value is `url` only uuid, id, name, path, slug and url (url is a computed property which returns the \"Real path\" if defined to use it for navigation links) will be included. \n* `resolveRelations`: Resolve relationships to other Stories (in the first level of nesting) of a multi-option or single-option field-type. Provide the field key(s) as array to resolve specific fields. Example: ['article.related_articles', 'article.author'].\n* `includeLinks`: If 'true' you can query links by allStoryblokLinkEntry. The links query lets you create a dynamic navigation tree as it includes also content folders.\n* `languages`: An array of strings that will be used in languages request instead of languages in space settings. Use it to only load the languages that you want to.\n\n## How to query?\n\n### All Content Entries\n\nTo get all entries unfiltered you can do the following query:\n\n```GraphQL\n{\n  allStoryblokEntry {\n    edges {\n      node {\n        id\n        name\n        created_at\n        published_at\n        uuid\n        slug\n        full_slug\n        content\n        is_startpage\n        parent_id\n        group_id\n      }\n    }\n  }\n}\n```\n\n#### Filtering of content inside a folder\n\nThe following example shows a filter to get all items from a news folder:\n\n```GraphQL\n{\n  allStoryblokEntry(filter: {full_slug: {regex: \"/^news\\//\"}}) {\n    edges {\n      node {\n        name\n        full_slug\n      }\n    }\n  }\n}\n```\n\n#### Filtering of languages\n\nIf you use field level translations you can filter for a specific language using following query:\n\n```GraphQL\n{\n  allStoryblokEntry(filter: {lang: {eq: \"de\"}}) {\n    edges {\n      node {\n        name\n        full_slug\n      }\n    }\n  }\n}\n```\n\n\n#### Filtering on content type fields\n\nEvery field of your content types is available via the prefix ```field_```.\n\nThis lets you for example to query for a specific component:\n\n```GraphQL\n{\n  allStoryblokEntry(filter: {field_component: {eq: \"page\"}}) {\n    edges {\n      node {\n        name\n        full_slug\n      }\n    }\n  }\n}\n```\n\n\n### A Single Content Entry\n```GraphQL\n{\n  storyblokEntry(slug: { eq: \"global-navi\" }) {\n    content\n  }\n}\n```\n\n### Datasources\n\n```GraphQL\nallStoryblokDatasource {\n  edges {\n    node {\n      id\n      value\n      name\n      data_source\n    }\n  }\n}\n```\n\n### Datasource Entries\n\nThis will return all datasources, with or not dimensions values:\n\n```GraphQL\nallStoryblokDatasourceEntry(filter: { data_source: { eq: \"DATASOURCE_SLUG\" } }) {\n  edges {\n    node {\n      id\n      name\n      value\n      data_source\n      data_source_dimension\n    }\n  }\n}\n```\n\nIf you want to **filter by a specific dimension**, you should use:\n\n```GraphQL\nallStoryblokDatasourceEntry(filter: { data_source: { eq: \"DATASOURCE_SLUG\" }, data_source_dimension: { eq: \"DATASOURCE_DIMENSION_VALUE\" } }) {\n  edges {\n    node {\n      id\n      name\n      value\n      data_source\n      data_source_dimension\n    }\n  }\n}\n```\n\n### Links\nUse the links api to create a dynamic navigation tree. To use this query you need to add `includeLinks: true` in the plugin options.\n\n```GraphQL\nallStoryblokLinkEntry {\n  edges {\n    node {\n      id\n      uuid\n      slug\n      parent_id\n      name\n      is_folder\n      published\n      is_startpage\n      position\n    }\n  }\n}\n```\n\n## Contribution\n\nFork me on [Github](https://github.com/storyblok/gatsby-source-storyblok).\n\nThis project use [semantic-release](https://semantic-release.gitbook.io/semantic-release/) for generate new versions by using commit messages and we use the Angular Convention to naming the commits. Check [this question](https://semantic-release.gitbook.io/semantic-release/support/faq#how-can-i-change-the-type-of-commits-that-trigger-a-release) about it in semantic-release FAQ","readmeFilename":"README.md"}