@xyd-js/atlas 0.1.0-xyd.1

package/src/components/Code/default-theme.ts

@@ -0,0 +1,266 @@
+// from: https://marketplace.visualstudio.com/items?itemName=smockle.xcode-default-theme
+
+import {Theme} from "@code-hike/lighter";
+
+export const theme: Theme = {
+    type: "light",
+    colors: {
+        "list.focusForeground": "#FFFFFF",
+        "scrollbar.shadow": "#ffffff00",
+        "tab.activeBorder": "#ffffff",
+        "widget.shadow": "#ffffff00",
+        "activityBar.border": "#D9D7D5",
+        "editorGroup.border": "#D9D7D5",
+        "editorGroupHeader.tabsBorder": "#D9D7D5",
+        "editorWidget.border": "#D9D7D5",
+        "editorWidget.resizeBorder": "#D9D7D5",
+        "input.border": "#D9D7D5",
+        "notificationCenter.border": "#D9D7D5",
+        "notifications.border": "#D9D7D5",
+        "panel.border": "#D9D7D5",
+        "sideBar.border": "#D9D7D5",
+        "statusBar.border": "#D9D7D5",
+        "tab.border": "#D9D7D5",
+        "activityBar.background": "#ECECEC",
+        "statusBar.background": "#ECECEC",
+        "statusBar.noFolderBackground": "#ECECEC",
+        "statusBar.debuggingBackground": "#ECECEC",
+        "editorGroupHeader.tabsBackground": "#F5F5F5",
+        "editorWidget.background": "#F5F5F5",
+        "sideBar.background": "#F5F5F5",
+        "sideBarSectionHeader.background": "#F5F5F5",
+        "tab.inactiveBackground": "#F5F5F5",
+        "activityBarBadge.background": "#282828",
+        "activityBar.foreground": "#282828",
+        "statusBar.foreground": "#565456",
+        "input.placeholderForeground": "#C7C6C5",
+        "editorLineNumber.foreground": "#A6A6A6",
+        "editorLineNumber.activeForeground": "#282828",
+        foreground: "#282828",
+        "panelTitle.activeForeground": "#282828",
+        "sideBarTitle.foreground": "#282828",
+        "sideBarSectionHeader.foreground": "#282828",
+        "panelTitle.inactiveForeground": "#242424",
+        "tab.inactiveForeground": "#242424",
+        "list.highlightForeground": "#242424",
+        "editor.lineHighlightBackground": "#EEF5FE",
+        focusBorder: "#82ADF3",
+        "button.background": "#3C93FD",
+        "list.activeSelectionBackground": "#3C93FD",
+        "list.focusBackground": "#3C93FD",
+        "selection.background": "#B3D7FF",
+        "list.inactiveSelectionBackground": "#CECECE",
+        "terminal.ansiBlack": "#000000",
+        "terminal.ansiBrightBlack": "#000000",
+        "terminal.ansiRed": "#C41A16",
+        "terminal.ansiBrightRed": "#C41A16",
+        "terminal.ansiGreen": "#007400",
+        "terminal.ansiBrightGreen": "#007400",
+        "terminal.ansiYellow": "#643820",
+        "terminal.ansiBrightYellow": "#643820",
+        "terminal.ansiBlue": "#272AD8",
+        "terminal.ansiBrightBlue": "#272AD8",
+        "terminal.ansiMagenta": "#AA0D91",
+        "terminal.ansiBrightMagenta": "#AA0D91",
+        "terminal.ansiCyan": "#3F6E74",
+        "terminal.ansiBrightCyan": "#3F6E74",
+    },
+    tokenColors: [
+        {
+            scope: "new.expr entity.name",
+            settings: {
+                foreground: "#713DA9",
+            },
+        },
+        {
+            name: "Comments",
+            scope: ["comment", "comment storage.type"],
+            settings: {
+                foreground: "#536579",
+                fontStyle: "italic",
+            },
+        },
+        {
+            name: "CSS",
+            scope: [
+                "entity.other.attribute-name.pseudo-class.css",
+                "entity.other.attribute-name.pseudo-class.scss",
+                "entity.other.attribute-name.pseudo-element.css",
+                "entity.other.attribute-name.pseudo-element.scss",
+                "support.function.calc.css",
+                "support.function.calc.scss",
+                "support.type.property-name.css",
+                "support.type.property-name.scss",
+                "support.type.vendored.property-name.css",
+                "support.type.vendored.property-name.scss",
+                "meta.property-value.css support.constant",
+                "meta.property-value.scss support.constant",
+                "meta.property-value.css support.constant.property-value",
+                "meta.property-value.scss support.constant.property-value",
+                "support.function.transform.css",
+                "support.function.transform.scss",
+            ],
+            settings: {
+                foreground: "#AA0D91",
+            },
+        },
+        {
+            name: "Decorator",
+            scope: [
+                "meta.decorator",
+                "meta.decorator punctuation.decorator",
+                "meta.decorator variable.other.readwrite",
+                "meta.decorator meta.function-call entity.name.function",
+            ],
+            settings: {
+                foreground: "#643820",
+            },
+        },
+        {
+            name: "Doctype",
+            scope: ["meta.tag.sgml.html"],
+            settings: {
+                foreground: "#A6A6A6",
+            },
+        },
+        {
+            name: "Functions",
+            scope: ["entity.name.function", "support.function"],
+            settings: {
+                foreground: "#7051d4",
+            },
+        },
+        {
+            name: "Keys",
+            scope: [
+                "meta.property-list meta.property-name",
+                "support.type.property-name",
+                "support.type.map.key",
+                "entity.name.tag.yaml",
+            ],
+            settings: {
+                foreground: "#7051d4",
+            },
+        },
+        {
+            name: "Keywords",
+            scope: [
+                "keyword.control",
+                "keyword.declaration",
+                "keyword.expressions-and-types",
+                "keyword.operator.new",
+                "keyword.reserved",
+                "keyword.statement",
+                "storage.type",
+                "storage.modifier",
+                "constant.language",
+                "variable.language.super",
+                "variable.language.this",
+                "text.html entity.name.tag",
+                "meta.tag entity.name.tag",
+                "meta.tag support.class",
+                "string.regexp keyword.other",
+            ],
+            settings: {
+                foreground: "#AD3DA4",
+                fontStyle: "bold",
+            },
+        },
+        {
+            name: "Operators",
+            scope: [
+                "storage.type.function.arrow",
+                "meta.template.expression punctuation",
+                "punctuation.separator.key-value",
+                "meta.object-literal.key meta.brace.square",
+                "meta.template.expression keyword.operator",
+                "keyword.operator.or.regexp",
+                "keyword.operator.quantifier",
+                "punctuation.definition.group.regexp",
+                "punctuation.definition.character-class",
+            ],
+            settings: {
+                foreground: "#000000",
+            },
+        },
+        {
+            scope: [
+                "meta.tag entity.other.attribute-name",
+                "constant.character.escape.backslash",
+            ],
+            settings: {
+                foreground: "#816927",
+            },
+        },
+        {
+            name: "Numbers",
+            scope: ["constant.numeric", "keyword.other.unit", "constant.other.color"],
+            settings: {
+                foreground: "#272AD8",
+            },
+        },
+        {
+            name: "Strings",
+            scope: [
+                "string",
+                "variable.parameter.url.scss",
+                "markup.heading.markdown",
+                "beginning.punctuation.definition.list.markdown",
+                "meta.template.expression meta.embedded punctuation.definition.string.begin",
+                "meta.template.expression meta.embedded punctuation.definition.string.end",
+            ],
+            settings: {
+                foreground: "#D12F1B",
+            },
+        },
+        {
+            name: "Types",
+            scope: [
+                "meta.type",
+                "meta.return.type",
+                "entity.name.type",
+                "support.type.primitive",
+            ],
+            settings: {
+                foreground: "#713DA9",
+            },
+        },
+        {
+            scope: [
+                "meta.objectliteral variable.other.object",
+                "entity.name.type.module",
+                "entity.other.inherited-class",
+                "variable.scss",
+                "variable.other.bracket.shell",
+                "entity.name.function.scss",
+            ],
+            settings: {
+                foreground: "#3F6E74",
+            },
+        },
+        {
+            scope: [
+                "keyword.control.at-rule",
+                "meta.import variable.other.readwrite",
+                "meta.definition.variable variable.other.readwrite",
+                "meta.definition.variable variable.other.constant",
+                "meta.template.expression variable.other.readwrite",
+                "meta.template.expression variable.other.constant",
+                "support.constant.property-value",
+            ],
+            settings: {
+                foreground: "#000000",
+            },
+        },
+        {
+            scope: [
+                "variable.other.property",
+                "variable.other.object.property",
+                "support.variable.property",
+            ],
+            settings: {
+                foreground: "#713DA9",
+            },
+        },
+    ],
+}

package/src/components/Code/index.ts

@@ -0,0 +1,6 @@
+export * from "./CodeCopy";
+
+export * from "./CodeSample";
+
+export * from "./CodeSampleButtons";
+

package/src/docs/AtlasExample/AtlasExample.stories.tsx

@@ -0,0 +1,47 @@
+import React, {useState, useEffect} from 'react';
+import type {Meta} from '@storybook/react';
+
+import {Reference} from '@xyd-js/uniform';
+
+import {MDXReference} from "@/utils/mdx";
+import {Atlas} from '@/components/Atlas';
+import {uniformToReferences} from "./uniform-to-references";
+
+const HelloWorld = () => {
+    return <h1>Hello, World!</h1>;
+};
+
+export default {
+    title: 'Atlas/Atlas',
+    component: HelloWorld,
+} as Meta;
+
+// const Template = (args) => <Atlas/>;
+
+const Template = (args) => {
+    const [references, setReferences] = useState<MDXReference<Reference[]> | []>([])
+
+    async function load() {
+        const resp = await uniformToReferences()
+        if (resp && resp.length) {
+            setReferences(resp)
+        }
+    }
+
+    useEffect(() => {
+        load()
+    }, [])
+
+    return <div style={{
+        width: "1200px",
+        display: "flex",
+        alignItems: "center",
+        flexDirection: "column",
+        margin: "0 auto"
+    }}>
+        <Atlas references={references}/>
+    </div>
+}
+
+export const Default = Template.bind({});
+Default.args = {};