diff --git a/docusaurus.config.js b/docusaurus.config.js index 27d39c7..27ad184 100644 --- a/docusaurus.config.js +++ b/docusaurus.config.js @@ -40,6 +40,57 @@ if (fs.existsSync('./src/css/theme.css')) { customCss.push(require.resolve('./src/css/theme.css')) } +const githubPrismTheme = require('prism-react-renderer/themes/github') + +const prismThemeLight = { + ...githubPrismTheme, + styles: [ + ...githubPrismTheme.styles, + { + languages: ['keto-relation-tuples'], + types: ['namespace'], + style: { + color: '#666' + } + }, + { + languages: ['keto-relation-tuples'], + types: ['object'], + style: { + color: '#939' + } + }, + { + languages: ['keto-relation-tuples'], + types: ['relation'], + style: { + color: '#e80' + } + }, + { + languages: ['keto-relation-tuples'], + types: ['delimiter'], + style: { + color: '#555' + } + }, + { + languages: ['keto-relation-tuples'], + types: ['comment'], + style: { + color: '#999' + } + }, + { + languages: ['keto-relation-tuples'], + types: ['subject'], + style: { + color: '#903' + } + } + ] +} + module.exports = { title: config.projectName, tagline: config.projectTagLine, @@ -52,7 +103,7 @@ module.exports = { projectName: config.projectSlug, // Usually your repo name. themeConfig: { prism: { - theme: require('prism-react-renderer/themes/github'), + theme: prismThemeLight, darkTheme: require('prism-react-renderer/themes/dracula'), additionalLanguages: ['pug', 'shell-session'] }, diff --git a/src/theme/ketoRelationTuplesPrism.js b/src/theme/ketoRelationTuplesPrism.js new file mode 100644 index 0000000..513d653 --- /dev/null +++ b/src/theme/ketoRelationTuplesPrism.js @@ -0,0 +1,56 @@ +const delimiter = { + delimiter: /[:#@()]/ +} + +const namespace = { + pattern: /[^:#@()\n]+:/, + inside: { + ...delimiter, + namespace: /.*/ + } +} + +const object = { + pattern: /[^:#@()\n]+#/, + inside: { + ...delimiter, + 'property-access': /.*/ + } +} + +const relation = { + pattern: /[^:#@()\n]+/ +} + +const subjectID = { + pattern: /@[^:#@()\n]+/, + inside: { + ...delimiter, + subject: /.*/ + } +} + +const subjectSet = { + pattern: /@\(([^:#@()\n]+:)?([^:#@()\n]+)#([^:#@()\n]*)\)/, + inside: { + delimiter: /[@()]*/, + namespace, + object, + relation + } +} + +export default (prism) => + (prism.languages['keto-relation-tuples'] = { + comment: /\/\/.*(\n|$)/, + 'relation-tuple': { + pattern: /([^:#@()\n]+:)?([^:#@()\n]+)#([^:#@()\n]+)@?((\(([^:#@()\n]+:)?([^:#@()\n]+)#([^:#@()\n]*)\))|([^:#@()\n]+))/, + inside: { + namespace, + object, + subjectID, + subjectSet, + relation + } + } + }) diff --git a/src/theme/prism-include-languages.js b/src/theme/prism-include-languages.js new file mode 100644 index 0000000..85a2750 --- /dev/null +++ b/src/theme/prism-include-languages.js @@ -0,0 +1,27 @@ +/** + * Copyright (c) Facebook, Inc. and its affiliates. + * + * This source code is licensed under the MIT license found in the + * LICENSE file in the root directory of this source tree. + */ +import ExecutionEnvironment from '@docusaurus/ExecutionEnvironment' +import siteConfig from '@generated/docusaurus.config' +import ketoRelationTuplesPrism from './ketoRelationTuplesPrism' + +const prismIncludeLanguages = (PrismObject) => { + if (ExecutionEnvironment.canUseDOM) { + const { + themeConfig: { prism: { additionalLanguages = [] } = {} } + } = siteConfig + window.Prism = PrismObject + additionalLanguages.forEach((lang) => { + require(`prismjs/components/prism-${lang}`) // eslint-disable-line + }) + + ketoRelationTuplesPrism(window.Prism) + + delete window.Prism + } +} + +export default prismIncludeLanguages