@fsegurai/codemirror-theme-github-light 6.0.1-alpha.0

package/README.md

@@ -0,0 +1,30 @@
+<!-- NOTE: README.md is generated from src/README.md -->
+
+# @fsegurai/codemirror-theme-github-light [![NPM version](https://img.shields.io/npm/v/@fsegurai/codemirror-theme-github-light.svg)](https://www.npmjs.org/package/@fsegurai/codemirror-theme-github-light)
+
+[ [**WEBSITE**](https://codemirror.net/6/) | [**ISSUES**](https://github.com/codemirror/codemirror.next/issues) | [*
+*FORUM**](https://discuss.codemirror.net/c/next/) | [**CHANGELOG
+**](https://github.com/codemirror/theme-one-dark/blob/main/CHANGELOG.md) ]
+
+This package implements the GitHub Light theme for the
+[CodeMirror](https://codemirror.net/6/) code editor.
+
+The [project page](https://codemirror.net/6/) has more information, a
+number of [examples](https://codemirror.net/6/examples/) and the
+[documentation](https://codemirror.net/6/docs/).
+
+This code is released under an
+[MIT license](https://github.com/fsegurai/cm6-themes/tree/main/LICENSE).
+
+We aim to be an inclusive, welcoming community. To make that explicit,
+we have a [code of
+conduct](http://contributor-covenant.org/version/1/1/0/) that applies
+to communication around the project.
+
+## API Reference
+
+@githubLight
+
+@githubLightTheme
+
+@githubLightHighlightStyle

package/dist/index.cjs

@@ -0,0 +1,96 @@
+'use strict';
+
+var view = require('@codemirror/view');
+var language = require('@codemirror/language');
+var highlight = require('@lezer/highlight');
+
+// GitHub Light theme color definitions aligned with your schema
+const base00 = '#fff', // Background
+base01 = '#24292e', // Foreground
+base02 = '#BBDFFF', // Selection and Selection Match
+base03 = '#6e7781', // Gutter Foreground
+base05 = '#116329', // TagName and Standard TagName
+base06 = '#6a737d', // Comment and Bracket
+base07 = '#6f42c1', // ClassName and PropertyName
+base08 = '#005cc5', // VariableName, AttributeName, Number, Operator
+base09 = '#d73a49', // Keyword, TypeName, TypeOperator
+base0A = '#032f62', // String, Meta, Regexp
+base0B = '#22863a', // Name, Quote
+base0C = '#e36209', // Atom, Bool, Special VariableName
+base0D = '#b31d28', // Deleted
+base0E = '#ffeef0', // Background for Deleted
+invalid = '#cb2431'; // Invalid color
+const darkBackground = '#f6f8fa', // A lighter background for panels, assuming a light theme variant
+highlightBackground = base02 + '20', // Adding opacity for highlight
+tooltipBackground = base00, cursor = base01, selection = base02;
+// Define the editor theme styles for GitHub Light.
+const githubLightTheme = view.EditorView.theme({
+    '&': {
+        color: base01,
+        backgroundColor: base00
+    },
+    '.cm-content': {
+        caretColor: cursor
+    },
+    '.cm-cursor, .cm-dropCursor': {
+        borderLeftColor: cursor
+    },
+    '&.cm-focused > .cm-scroller > .cm-selectionLayer .cm-selectionBackground, .cm-selectionBackground, .cm-content ::selection': {
+        backgroundColor: selection
+    },
+    '.cm-searchMatch': {
+        backgroundColor: base02,
+        outline: `1px solid ${base03}`
+    },
+    '.cm-searchMatch.cm-searchMatch-selected': {
+        backgroundColor: base05,
+        color: base07
+    },
+    '.cm-panels': {
+        backgroundColor: darkBackground,
+        color: base03
+    },
+    '.cm-panels.cm-panels-top': {
+        borderBottom: '2px solid black'
+    },
+    '.cm-panels.cm-panels-bottom': {
+        borderTop: '2px solid black'
+    },
+    '.cm-activeLine': {
+        backgroundColor: highlightBackground
+    },
+    '.cm-gutters': {
+        backgroundColor: base00,
+        color: base03
+    },
+    '.cm-tooltip': {
+        backgroundColor: tooltipBackground
+    }
+}, { dark: false });
+// Define the highlighting style for code in the GitHub Light theme.
+const githubLightHighlightStyle = language.HighlightStyle.define([
+    { tag: [highlight.tags.standard(highlight.tags.tagName), highlight.tags.tagName], color: base05 },
+    { tag: [highlight.tags.comment, highlight.tags.bracket], color: base06 },
+    { tag: [highlight.tags.className, highlight.tags.propertyName], color: base07 },
+    { tag: [highlight.tags.variableName, highlight.tags.attributeName, highlight.tags.number, highlight.tags.operator], color: base08 },
+    { tag: [highlight.tags.keyword, highlight.tags.typeName, highlight.tags.typeOperator], color: base09 },
+    { tag: [highlight.tags.string, highlight.tags.meta, highlight.tags.regexp], color: base0A },
+    { tag: [highlight.tags.name, highlight.tags.quote], color: base0B },
+    { tag: [highlight.tags.heading, highlight.tags.strong], color: base01, fontWeight: 'bold' },
+    { tag: [highlight.tags.emphasis], color: base01, fontStyle: 'italic' },
+    { tag: [highlight.tags.deleted], color: base0D, backgroundColor: base0E },
+    { tag: [highlight.tags.atom, highlight.tags.bool, highlight.tags.special(highlight.tags.variableName)], color: base0C },
+    { tag: [highlight.tags.url, highlight.tags.escape, highlight.tags.regexp, highlight.tags.link], color: base0A },
+    { tag: highlight.tags.link, textDecoration: 'underline' },
+    { tag: highlight.tags.strikethrough, textDecoration: 'line-through' },
+    { tag: highlight.tags.invalid, color: invalid }
+]);
+// Extension to enable the GitHub Light theme (both the editor theme and the highlight style).
+const githubLight = [
+    githubLightTheme,
+    language.syntaxHighlighting(githubLightHighlightStyle)
+];
+
+exports.githubLight = githubLight;
+exports.githubLightHighlightStyle = githubLightHighlightStyle;
+exports.githubLightTheme = githubLightTheme;

package/dist/index.d.cts

@@ -0,0 +1,8 @@
+import { Extension } from '@codemirror/state';
+import { HighlightStyle } from '@codemirror/language';
+
+declare const githubLightTheme: Extension;
+declare const githubLightHighlightStyle: HighlightStyle;
+declare const githubLight: Extension;
+
+export { githubLight, githubLightHighlightStyle, githubLightTheme };

package/dist/index.d.ts

@@ -0,0 +1,8 @@
+import { Extension } from '@codemirror/state';
+import { HighlightStyle } from '@codemirror/language';
+
+declare const githubLightTheme: Extension;
+declare const githubLightHighlightStyle: HighlightStyle;
+declare const githubLight: Extension;
+
+export { githubLight, githubLightHighlightStyle, githubLightTheme };

package/dist/index.js

@@ -0,0 +1,92 @@
+import { EditorView } from '@codemirror/view';
+import { HighlightStyle, syntaxHighlighting } from '@codemirror/language';
+import { tags } from '@lezer/highlight';
+
+// GitHub Light theme color definitions aligned with your schema
+const base00 = '#fff', // Background
+base01 = '#24292e', // Foreground
+base02 = '#BBDFFF', // Selection and Selection Match
+base03 = '#6e7781', // Gutter Foreground
+base05 = '#116329', // TagName and Standard TagName
+base06 = '#6a737d', // Comment and Bracket
+base07 = '#6f42c1', // ClassName and PropertyName
+base08 = '#005cc5', // VariableName, AttributeName, Number, Operator
+base09 = '#d73a49', // Keyword, TypeName, TypeOperator
+base0A = '#032f62', // String, Meta, Regexp
+base0B = '#22863a', // Name, Quote
+base0C = '#e36209', // Atom, Bool, Special VariableName
+base0D = '#b31d28', // Deleted
+base0E = '#ffeef0', // Background for Deleted
+invalid = '#cb2431'; // Invalid color
+const darkBackground = '#f6f8fa', // A lighter background for panels, assuming a light theme variant
+highlightBackground = base02 + '20', // Adding opacity for highlight
+tooltipBackground = base00, cursor = base01, selection = base02;
+// Define the editor theme styles for GitHub Light.
+const githubLightTheme = /*@__PURE__*/EditorView.theme({
+    '&': {
+        color: base01,
+        backgroundColor: base00
+    },
+    '.cm-content': {
+        caretColor: cursor
+    },
+    '.cm-cursor, .cm-dropCursor': {
+        borderLeftColor: cursor
+    },
+    '&.cm-focused > .cm-scroller > .cm-selectionLayer .cm-selectionBackground, .cm-selectionBackground, .cm-content ::selection': {
+        backgroundColor: selection
+    },
+    '.cm-searchMatch': {
+        backgroundColor: base02,
+        outline: `1px solid ${base03}`
+    },
+    '.cm-searchMatch.cm-searchMatch-selected': {
+        backgroundColor: base05,
+        color: base07
+    },
+    '.cm-panels': {
+        backgroundColor: darkBackground,
+        color: base03
+    },
+    '.cm-panels.cm-panels-top': {
+        borderBottom: '2px solid black'
+    },
+    '.cm-panels.cm-panels-bottom': {
+        borderTop: '2px solid black'
+    },
+    '.cm-activeLine': {
+        backgroundColor: highlightBackground
+    },
+    '.cm-gutters': {
+        backgroundColor: base00,
+        color: base03
+    },
+    '.cm-tooltip': {
+        backgroundColor: tooltipBackground
+    }
+}, { dark: false });
+// Define the highlighting style for code in the GitHub Light theme.
+const githubLightHighlightStyle = /*@__PURE__*/HighlightStyle.define([
+    { tag: [/*@__PURE__*/tags.standard(tags.tagName), tags.tagName], color: base05 },
+    { tag: [tags.comment, tags.bracket], color: base06 },
+    { tag: [tags.className, tags.propertyName], color: base07 },
+    { tag: [tags.variableName, tags.attributeName, tags.number, tags.operator], color: base08 },
+    { tag: [tags.keyword, tags.typeName, tags.typeOperator], color: base09 },
+    { tag: [tags.string, tags.meta, tags.regexp], color: base0A },
+    { tag: [tags.name, tags.quote], color: base0B },
+    { tag: [tags.heading, tags.strong], color: base01, fontWeight: 'bold' },
+    { tag: [tags.emphasis], color: base01, fontStyle: 'italic' },
+    { tag: [tags.deleted], color: base0D, backgroundColor: base0E },
+    { tag: [tags.atom, tags.bool, /*@__PURE__*/tags.special(tags.variableName)], color: base0C },
+    { tag: [tags.url, tags.escape, tags.regexp, tags.link], color: base0A },
+    { tag: tags.link, textDecoration: 'underline' },
+    { tag: tags.strikethrough, textDecoration: 'line-through' },
+    { tag: tags.invalid, color: invalid }
+]);
+// Extension to enable the GitHub Light theme (both the editor theme and the highlight style).
+const githubLight = [
+    githubLightTheme,
+    /*@__PURE__*/syntaxHighlighting(githubLightHighlightStyle)
+];
+
+export { githubLight, githubLightHighlightStyle, githubLightTheme };

package/package.json

@@ -0,0 +1,45 @@
+{
+  "name": "@fsegurai/codemirror-theme-github-light",
+  "description": "GitHub Light theme for the CodeMirror code editor",
+  "version": "6.0.1-alpha.0",
+  "type": "module",
+  "main": "dist/index.cjs",
+  "exports": {
+    "import": "./dist/index.js",
+    "require": "./dist/index.cjs"
+  },
+  "types": "dist/index.d.ts",
+  "module": "dist/index.js",
+  "sideEffects": false,
+  "scripts": {
+    "test": "cm-runtests",
+    "prepare": "cm-buildhelper src/index.ts"
+  },
+  "keywords": [
+    "editor",
+    "code",
+    "codemirror"
+  ],
+  "author": {
+    "name": "Fabián Segura",
+    "url": "https://www.fsegurai.com/"
+  },
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/fsegurai/codemirror-themes.git"
+  },
+  "bugs": {
+    "url": "https://github.com/fsegurai/codemirror-themes/issues"
+  },
+  "homepage": "https://github.com/fsegurai/codemirror-themes#readme",
+  "peerDependencies": {
+    "@lezer/highlight": "^1.0.0",
+    "@codemirror/language": "^6.0.0",
+    "@codemirror/state": "^6.0.0",
+    "@codemirror/view": "^6.0.0"
+  },
+  "devDependencies": {
+    "@codemirror/buildhelper": "^1.0.1"
+  }
+}