Merge pull request #106 from secundant/60-neodxlog-enhance-error-hand…

…ling

Logger: errors and frameworks, SVG: hashes and experimental runtime

.changeset/breezy-ducks-shop.md

@@ -0,0 +1,5 @@
+---
+'@neodx/log': minor
+---
+
+Enhance error printing in the `pretty` log target

.changeset/gold-shrimps-beg.md

@@ -0,0 +1,5 @@
+---
+'@neodx/log': minor
+---
+
+Introduce `@neodx/log/http` submodule for brilliant integrated HTTP logging with simple setup

.changeset/grumpy-cats-compare.md

@@ -0,0 +1,5 @@
+---
+'@neodx/svg': patch
+---
+
+Fix wrong default "\_\_root" name, replace it with "sprite"

.changeset/heavy-emus-tell.md

@@ -0,0 +1,5 @@
+---
+'@neodx/svg': patch
+---
+
+Add `isPrimitive`, `isNotNil` and `toInt` (parseInt wrapper)

.changeset/lazy-hounds-pump.md

@@ -0,0 +1,5 @@
+---
+'@neodx/svg': minor
+---
+
+Add `hash` token in `fileName`, add `experimentalRuntime` option #43

.changeset/mean-squids-change.md

@@ -0,0 +1,5 @@
+---
+'@neodx/log': minor
+---
+
+Extend built-in support with `@neodx/log/express` and `@neodx/log/koa` submodules

.changeset/nasty-bugs-hear.md

@@ -0,0 +1,5 @@
+---
+'@neodx/log': minor
+---
+
+Introduce built-in HTTP and Web Frameworks support

.changeset/rare-windows-walk.md

@@ -0,0 +1,5 @@
+---
+'@neodx/log': minor
+---
+
+Add support for simple level aliasing

.changeset/six-meals-report.md

@@ -0,0 +1,5 @@
+---
+'@neodx/log': minor
+---
+
+Add error pretty-printing for in-development logging - ".cause" chains, code frames, custom props displaying and more

.changeset/six-mugs-melt.md

@@ -0,0 +1,5 @@
+---
+'@neodx/log': minor
+---
+
+Improve `json` target's error handling

.changeset/spotty-lamps-relax.md

@@ -0,0 +1,5 @@
+---
+'@neodx/log': patch
+---
+
+Rework pretty logging level badges to prevent emojis in console

.changeset/tender-frogs-beg.md

@@ -0,0 +1,5 @@
+---
+'@neodx/log': minor
+---
+
+Add serializing API (currently available as part of built-in targets: pretty and json)

README.md

@@ -5,7 +5,7 @@
 </h1>
 <hr />
 
-This project designed to tackle common web development challenges with ease.
+This project is designed to tackle common web development challenges with ease.
 
 > **Warning**
 > Most of the packages are still under development, so API may change.
@@ -22,7 +22,7 @@ Probably, you've already tried to write your own integration or use some existin
 - Terrible flexibility and solution design, you just can't use it in your project because of the different document structure or workflow
 - No type safety, autocomplete, etc.
 
-In the other words, there is no really well-designed complex solution for Figma integration.
+In other words, there is no really well-designed complex solution for Figma integration.
 
 So, `@neodx/figma` is an attempt to create it. Currently, we have the following features:
 

apps/docs/.gitignore

@@ -0,0 +1,2 @@
+.vitepress/cache
+.vitepress/dist

apps/docs/.vitepress/config.ts

@@ -0,0 +1,40 @@
+import { defineConfig } from 'vitepress';
+
+// https://vitepress.dev/reference/site-config
+export default defineConfig({
+  title: 'Neodx',
+  description: 'Modern solutions for great DX',
+  themeConfig: {
+    // https://vitepress.dev/reference/default-theme-config
+    nav: [
+      { text: 'Home', link: '/' },
+      { text: 'Examples', link: '/markdown-examples' }
+    ],
+
+    sidebar: [
+      {
+        text: '@neodx/log',
+        collapsed: true,
+        items: [
+          { text: 'Getting started', link: '/log/' },
+          { text: 'Pretty printing', link: '/log/pretty-printing' },
+          { text: 'JSON logs', link: '/log/json' },
+          { text: 'Children and forks', link: '/log/child-and-fork' },
+          { text: 'HTTP frameworks', link: '/log/http-frameworks' },
+          { text: 'Creating your own logger', link: '/log/custom' }
+        ]
+      },
+      {
+        text: '@neodx/svg',
+        collapsed: true,
+        items: [
+          { text: 'Getting started', link: '/svg/' },
+          { text: 'Motivation', link: '/svg/motivation' },
+          { text: 'Frameworks and bundlers', link: '/svg/frameworks-and-bundlers' }
+        ]
+      }
+    ],
+
+    socialLinks: [{ icon: 'github', link: 'https://github.com/secundant/neodx' }]
+  }
+});

apps/docs/.vitepress/theme/index.ts

@@ -0,0 +1,16 @@
+// https://vitepress.dev/guide/custom-theme
+import { h } from 'vue';
+import Theme from 'vitepress/theme';
+import './style.css';
+
+export default {
+  ...Theme,
+  Layout: () => {
+    return h(Theme.Layout, null, {
+      // https://vitepress.dev/guide/extending-default-theme#layout-slots
+    });
+  },
+  enhanceApp({ app, router, siteData }) {
+    // ...
+  }
+};

apps/docs/.vitepress/theme/style.css

@@ -0,0 +1,82 @@
+/**
+ * Customize default theme styling by overriding CSS variables:
+ * https://github.com/vuejs/vitepress/blob/main/src/client/theme-default/styles/vars.css
+ */
+
+/**
+ * Colors
+ * -------------------------------------------------------------------------- */
+
+:root {
+  --vp-c-brand: #646cff;
+  --vp-c-brand-light: #747bff;
+  --vp-c-brand-lighter: #9499ff;
+  --vp-c-brand-lightest: #bcc0ff;
+  --vp-c-brand-dark: #535bf2;
+  --vp-c-brand-darker: #454ce1;
+  --vp-c-brand-dimm: rgba(100, 108, 255, 0.08);
+}
+
+/**
+ * Component: Button
+ * -------------------------------------------------------------------------- */
+
+:root {
+  --vp-button-brand-border: var(--vp-c-brand-light);
+  --vp-button-brand-text: var(--vp-c-white);
+  --vp-button-brand-bg: var(--vp-c-brand);
+  --vp-button-brand-hover-border: var(--vp-c-brand-light);
+  --vp-button-brand-hover-text: var(--vp-c-white);
+  --vp-button-brand-hover-bg: var(--vp-c-brand-light);
+  --vp-button-brand-active-border: var(--vp-c-brand-light);
+  --vp-button-brand-active-text: var(--vp-c-white);
+  --vp-button-brand-active-bg: var(--vp-button-brand-bg);
+}
+
+/**
+ * Component: Home
+ * -------------------------------------------------------------------------- */
+
+:root {
+  --vp-home-hero-name-color: transparent;
+  --vp-home-hero-name-background: -webkit-linear-gradient(120deg, #bd34fe 30%, #41d1ff);
+
+  --vp-home-hero-image-background-image: linear-gradient(-45deg, #bd34fe 50%, #47caff 50%);
+  --vp-home-hero-image-filter: blur(40px);
+}
+
+@media (min-width: 640px) {
+  :root {
+    --vp-home-hero-image-filter: blur(56px);
+  }
+}
+
+@media (min-width: 960px) {
+  :root {
+    --vp-home-hero-image-filter: blur(72px);
+  }
+}
+
+/**
+ * Component: Custom Block
+ * -------------------------------------------------------------------------- */
+
+:root {
+  --vp-custom-block-tip-border: var(--vp-c-brand);
+  --vp-custom-block-tip-text: var(--vp-c-brand-darker);
+  --vp-custom-block-tip-bg: var(--vp-c-brand-dimm);
+}
+
+.dark {
+  --vp-custom-block-tip-border: var(--vp-c-brand);
+  --vp-custom-block-tip-text: var(--vp-c-brand-lightest);
+  --vp-custom-block-tip-bg: var(--vp-c-brand-dimm);
+}
+
+/**
+ * Component: Algolia
+ * -------------------------------------------------------------------------- */
+
+.DocSearch {
+  --docsearch-primary-color: var(--vp-c-brand) !important;
+}

apps/docs/README.md

@@ -0,0 +1 @@
+# docs

apps/docs/api-examples.md

@@ -0,0 +1,55 @@
+---
+outline: deep
+---
+
+# Runtime API Examples
+
+This page demonstrates usage of some of the runtime APIs provided by VitePress.
+
+The main `useData()` API can be used to access site, theme, and page data for the current page. It works in both `.md` and `.vue` files:
+
+```md
+<script setup>
+import { useData } from 'vitepress'
+
+const { theme, page, frontmatter } = useData()
+</script>
+
+## Results
+
+### Theme Data
+
+<pre>{{ theme }}</pre>
+
+### Page Data
+
+<pre>{{ page }}</pre>
+
+### Page Frontmatter
+
+<pre>{{ frontmatter }}</pre>
+```
+
+<script setup>
+import { useData } from 'vitepress'
+
+const { site, theme, page, frontmatter } = useData()
+</script>
+
+## Results
+
+### Theme Data
+
+<pre>{{ theme }}</pre>
+
+### Page Data
+
+<pre>{{ page }}</pre>
+
+### Page Frontmatter
+
+<pre>{{ frontmatter }}</pre>
+
+## More
+
+Check out the documentation for the [full list of runtime APIs](https://vitepress.dev/reference/runtime-api#usedata).

apps/docs/index.md

@@ -0,0 +1,27 @@
+---
+# https://vitepress.dev/reference/default-theme-home-page
+layout: home
+
+hero:
+  name: 'Neodx'
+  text: 'Modern solutions for great DX'
+
+features:
+  - title: '@neodx/log'
+    icon: 📋
+    link: /log/
+    details: Lightweight (<b><1 kb!</b>) flexible isomorphic logger and logging framework
+  - title: '@neodx/svg'
+    icon: ⚡️
+    link: /svg/
+    details: Supercharge your icons<br />Well featured sprites generator with DX in mind
+  - title: '@neodx/figma'
+    icon: 🎨
+    details: The modern Figma integration tools, typed API, human-friendly files traversing, assets exporter, and more.
+  - title: '@neodx/vfs'
+    icon: 📁
+    details: Missing virtual file system abstraction that makes working with the file system a breeze
+  - title: '@neodx/colors'
+    icon: 🌈
+    details: Tiny colors for Node CLI
+---

apps/docs/log/child-and-fork.md

@@ -0,0 +1,35 @@
+# Children and fork
+
+## Forking
+
+```typescript
+const logger = createLogger({
+  name: 'my-logger'
+});
+
+const fork = logger.fork({
+  level: 'debug'
+});
+``;
+```
+
+## Children
+
+```typescript
+const logger = createLogger({
+  name: 'my-logger'
+});
+
+const child = logger.child('child-logger');
+```
+
+### Override params
+
+```typescript
+const child = logger.child('child-logger', {
+  level: 'debug',
+  meta: {
+    service: 'my-service'
+  }
+});
+```

apps/docs/log/custom.md

@@ -0,0 +1,20 @@
+# Creating your own logger
+
+```typescript
+import { createLoggerFactory } from '@neodx/log';
+
+const createLogger = createLoggerFactory({
+  defaultParams: {
+    meta: {
+      app: 'my-app'
+    },
+    level: 'info',
+    name: 'kek-logger',
+    target: [
+      {
+        level: 'error'
+      }
+    ]
+  }
+});
+```