docus 1.0.4 → 2.1.0

package/dist/runtime/app/composables/navigation.js

@@ -0,0 +1,227 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useDocusNavigationState = exports.useDocusNavigation = exports.useDocusCurrentPath = exports.useDocusCurrentNav = exports.createDocusNavigation = void 0;
+
+var _ufo = require("ufo");
+
+var _vue = _interopRequireDefault(require("vue"));
+
+var _scule = require("scule");
+
+var _ = require(".");
+
+var _app = require("#app");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+let _get;
+
+let _fetchNavigation;
+
+let _filterLinks;
+
+let _isLinkActive;
+
+let _getPageTemplate;
+
+let _getPreviousAndNextLink;
+
+let _updateCurrentNav;
+
+let _refresh;
+
+const createDocusNavigation = (context, config, content) => {
+  const _contentLocalePath = context.$contentLocalePath;
+  const {
+    route
+  } = context;
+
+  const _route = (0, _app.unref)(route);
+
+  const docusNavigation = (0, _app.useState)(_.StateTypes.Navigation, () => ({}));
+  const docusCurrentPath = (0, _app.useState)(_.StateTypes.CurrentPath, () => `/${_route.params.pathMatch}`);
+
+  _fetchNavigation = async locale => {
+    const __locale = locale || context.i18n.locale;
+
+    const data = await content.fetch("navigation/" + __locale);
+    docusNavigation.value[__locale] = data;
+  };
+
+  _get = ({
+    depth,
+    locale = context.i18n.locale,
+    from,
+    all
+  } = {}) => {
+    const nav = docusNavigation.value[locale] || [];
+    let items = nav;
+    let match;
+    let exclusiveContent;
+    let parent;
+
+    if (from) {
+      let lastMatch;
+      const paths = from.split("/");
+      items = paths.reduce((links, path, index) => {
+        if (!path) return links;
+
+        if (match && match.page) {
+          lastMatch = match;
+        }
+
+        match = links.find(item => item.to.split("/")[index] === path);
+
+        if (match) {
+          if (match && match.exclusive) {
+            parent = lastMatch || parent;
+            exclusiveContent = match;
+          }
+
+          return match.children;
+        }
+
+        return links;
+      }, items);
+
+      if (exclusiveContent) {
+        items = exclusiveContent.children;
+      } else {
+        items = nav;
+      }
+    }
+
+    return {
+      title: exclusiveContent && exclusiveContent.title,
+      to: exclusiveContent && exclusiveContent.to,
+      parent,
+      links: all ? items : _filterLinks(items, depth || 1, 1)
+    };
+  };
+
+  _filterLinks = (nodes, maxDepth, currentDepth) => {
+    return nodes.filter(node => {
+      if (node.hidden) return false;
+      if (node.draft === true) return false;
+      if (currentDepth && maxDepth > currentDepth) return false;
+      if (node.nested === false) node.children = [];
+      node.children = node.children && node.children.length > 0 ? _filterLinks(node.children, maxDepth, currentDepth + 1) : [];
+      return node;
+    });
+  };
+
+  _isLinkActive = to => {
+    return (0, _ufo.withTrailingSlash)(docusCurrentPath.value) === (0, _ufo.withTrailingSlash)(_contentLocalePath(to));
+  };
+
+  _getPageTemplate = page => {
+    let template = typeof page.template === "string" ? page.template : page.template?.self;
+
+    if (!template) {
+      const slugs = page.to.split("/").filter(Boolean).slice(0, -1);
+      let {
+        links
+      } = docusCurrentNav.value || {};
+      slugs.forEach((_slug, index) => {
+        const to = "/" + slugs.slice(0, index + 1).join("/");
+        const link = links.find(link2 => link2.to === to);
+
+        if (link?.template) {
+          template = link.template || template;
+        }
+
+        if (!link?.children) return;
+        links = link.children;
+      });
+    }
+
+    if (!template) template = config.value?.template || "Page";
+    template = (0, _scule.pascalCase)(template);
+
+    if (!_vue.default.component(template)) {
+      console.error(`Template ${template} does not exists, fallback to Page template.`);
+      template = "Page";
+    }
+
+    return template;
+  };
+
+  _getPreviousAndNextLink = page => {
+    return content.search({
+      deep: true
+    }).where({
+      language: context.i18n.locale,
+      parent: page.parent,
+      page: {
+        $ne: false
+      },
+      hidden: {
+        $ne: true
+      },
+      redirect: {
+        $type: "undefined"
+      }
+    }).only(["title", "slug", "to"]).sortBy("position", "asc").surround(page.to, {
+      before: 1,
+      after: 1
+    }).fetch();
+  };
+
+  _updateCurrentNav = () => {
+    docusCurrentNav.value = _get({
+      from: docusCurrentPath.value
+    });
+  };
+
+  _refresh = async locale => {
+    await _fetchNavigation(locale);
+
+    _updateCurrentNav();
+  };
+
+  const docusCurrentNav = (0, _app.useState)(_.StateTypes.CurrentNav, () => {
+    return _get({
+      from: `/${_route.params.pathMatch}`
+    });
+  });
+
+  if (process.client) {
+    window.onNuxtReady(() => {
+      window.$nuxt.$on("docus:content:preview", () => _refresh(context.i18n.locale));
+      window.$nuxt.$on("content:update", () => _refresh(context.i18n.locale));
+    });
+  }
+};
+
+exports.createDocusNavigation = createDocusNavigation;
+
+const useDocusNavigation = () => {
+  return {
+    state: useDocusNavigationState(),
+    currentNav: useDocusCurrentNav(),
+    currentPath: useDocusCurrentPath(),
+    getPageTemplate: _getPageTemplate,
+    fetchNavigation: _fetchNavigation,
+    isLinkActive: _isLinkActive,
+    updateCurrentNav: _updateCurrentNav,
+    getPreviousAndNextLink: _getPreviousAndNextLink,
+    get: _get
+  };
+};
+
+exports.useDocusNavigation = useDocusNavigation;
+
+const useDocusNavigationState = () => (0, _app.useState)(_.StateTypes.Navigation);
+
+exports.useDocusNavigationState = useDocusNavigationState;
+
+const useDocusCurrentNav = () => (0, _app.useState)(_.StateTypes.CurrentNav);
+
+exports.useDocusCurrentNav = useDocusCurrentNav;
+
+const useDocusCurrentPath = () => (0, _app.useState)(_.StateTypes.CurrentPath);
+
+exports.useDocusCurrentPath = useDocusCurrentPath;

package/dist/runtime/app/composables/navigation.mjs

@@ -0,0 +1,148 @@
+import { withTrailingSlash } from "ufo";
+import Vue from "vue";
+import { pascalCase } from "scule";
+import { StateTypes } from "./index.mjs";
+import { unref, useState } from "#app";
+let _get;
+let _fetchNavigation;
+let _filterLinks;
+let _isLinkActive;
+let _getPageTemplate;
+let _getPreviousAndNextLink;
+let _updateCurrentNav;
+let _refresh;
+export const createDocusNavigation = (context, config, content) => {
+  const _contentLocalePath = context.$contentLocalePath;
+  const { route } = context;
+  const _route = unref(route);
+  const docusNavigation = useState(StateTypes.Navigation, () => ({}));
+  const docusCurrentPath = useState(StateTypes.CurrentPath, () => `/${_route.params.pathMatch}`);
+  _fetchNavigation = async (locale) => {
+    const __locale = locale || context.i18n.locale;
+    const data = await content.fetch("navigation/" + __locale);
+    docusNavigation.value[__locale] = data;
+  };
+  _get = ({ depth, locale = context.i18n.locale, from, all } = {}) => {
+    const nav = docusNavigation.value[locale] || [];
+    let items = nav;
+    let match;
+    let exclusiveContent;
+    let parent;
+    if (from) {
+      let lastMatch;
+      const paths = from.split("/");
+      items = paths.reduce((links, path, index) => {
+        if (!path)
+          return links;
+        if (match && match.page) {
+          lastMatch = match;
+        }
+        match = links.find((item) => item.to.split("/")[index] === path);
+        if (match) {
+          if (match && match.exclusive) {
+            parent = lastMatch || parent;
+            exclusiveContent = match;
+          }
+          return match.children;
+        }
+        return links;
+      }, items);
+      if (exclusiveContent) {
+        items = exclusiveContent.children;
+      } else {
+        items = nav;
+      }
+    }
+    return {
+      title: exclusiveContent && exclusiveContent.title,
+      to: exclusiveContent && exclusiveContent.to,
+      parent,
+      links: all ? items : _filterLinks(items, depth || 1, 1)
+    };
+  };
+  _filterLinks = (nodes, maxDepth, currentDepth) => {
+    return nodes.filter((node) => {
+      if (node.hidden)
+        return false;
+      if (node.draft === true)
+        return false;
+      if (currentDepth && maxDepth > currentDepth)
+        return false;
+      if (node.nested === false)
+        node.children = [];
+      node.children = node.children && node.children.length > 0 ? _filterLinks(node.children, maxDepth, currentDepth + 1) : [];
+      return node;
+    });
+  };
+  _isLinkActive = (to) => {
+    return withTrailingSlash(docusCurrentPath.value) === withTrailingSlash(_contentLocalePath(to));
+  };
+  _getPageTemplate = (page) => {
+    let template = typeof page.template === "string" ? page.template : page.template?.self;
+    if (!template) {
+      const slugs = page.to.split("/").filter(Boolean).slice(0, -1);
+      let { links } = docusCurrentNav.value || {};
+      slugs.forEach((_slug, index) => {
+        const to = "/" + slugs.slice(0, index + 1).join("/");
+        const link = links.find((link2) => link2.to === to);
+        if (link?.template) {
+          template = link.template || template;
+        }
+        if (!link?.children)
+          return;
+        links = link.children;
+      });
+    }
+    if (!template)
+      template = config.value?.template || "Page";
+    template = pascalCase(template);
+    if (!Vue.component(template)) {
+      console.error(`Template ${template} does not exists, fallback to Page template.`);
+      template = "Page";
+    }
+    return template;
+  };
+  _getPreviousAndNextLink = (page) => {
+    return content.search({ deep: true }).where({
+      language: context.i18n.locale,
+      parent: page.parent,
+      page: { $ne: false },
+      hidden: { $ne: true },
+      redirect: { $type: "undefined" }
+    }).only(["title", "slug", "to"]).sortBy("position", "asc").surround(page.to, { before: 1, after: 1 }).fetch();
+  };
+  _updateCurrentNav = () => {
+    docusCurrentNav.value = _get({
+      from: docusCurrentPath.value
+    });
+  };
+  _refresh = async (locale) => {
+    await _fetchNavigation(locale);
+    _updateCurrentNav();
+  };
+  const docusCurrentNav = useState(StateTypes.CurrentNav, () => {
+    return _get({ from: `/${_route.params.pathMatch}` });
+  });
+  if (process.client) {
+    window.onNuxtReady(() => {
+      window.$nuxt.$on("docus:content:preview", () => _refresh(context.i18n.locale));
+      window.$nuxt.$on("content:update", () => _refresh(context.i18n.locale));
+    });
+  }
+};
+export const useDocusNavigation = () => {
+  return {
+    state: useDocusNavigationState(),
+    currentNav: useDocusCurrentNav(),
+    currentPath: useDocusCurrentPath(),
+    getPageTemplate: _getPageTemplate,
+    fetchNavigation: _fetchNavigation,
+    isLinkActive: _isLinkActive,
+    updateCurrentNav: _updateCurrentNav,
+    getPreviousAndNextLink: _getPreviousAndNextLink,
+    get: _get
+  };
+};
+export const useDocusNavigationState = () => useState(StateTypes.Navigation);
+export const useDocusCurrentNav = () => useState(StateTypes.CurrentNav);
+export const useDocusCurrentPath = () => useState(StateTypes.CurrentPath);

package/dist/runtime/app/composables/store.d.ts

@@ -0,0 +1,7 @@
+import Vue from 'vue';
+import type { CombinedVueInstance } from 'vue/types/vue';
+import { Context } from '@nuxt/types';
+export declare function createStore<T>(key: string, defaultValue: T): {
+    plugin: ({ ssrContext, nuxtState }: Context) => void;
+    useStore: (context?: CombinedVueInstance<Vue, object, object, object, Record<never, any>> | Context) => Ref<T>;
+};

package/dist/runtime/app/composables/store.js

@@ -0,0 +1,52 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createStore = createStore;
+
+var _app = require("#app");
+
+const createPlugin = (key, defaultValue) => {
+  const store = (0, _app.ref)(defaultValue || {});
+  return ({
+    ssrContext,
+    nuxtState
+  }) => {
+    const state = process.server ? ssrContext.nuxt : nuxtState;
+    state.stores = state.stores || {};
+
+    if (process.server) {
+      state.stores[key] = store;
+    } else {
+      Object.assign(store, state.stores?.[key] || {});
+    }
+  };
+};
+
+function createStore(key, defaultValue) {
+  const plugin = createPlugin(key, defaultValue);
+
+  function useStore(context) {
+    if (!context) {
+      const vm = (0, _app.getCurrentInstance)();
+      if (!vm) throw new Error("useStore must be called in setup() or a context provided");
+      context = vm.proxy;
+    }
+
+    let state;
+
+    if (process.server) {
+      state = "$ssrContext" in context ? context.$ssrContext.nuxt : context.ssrContext?.nuxt;
+    } else {
+      state = window.__NUXT__;
+    }
+
+    return state.stores[key];
+  }
+
+  return {
+    plugin,
+    useStore
+  };
+}

package/dist/runtime/app/composables/store.mjs

@@ -0,0 +1,35 @@
+import { getCurrentInstance, ref } from "#app";
+const createPlugin = (key, defaultValue) => {
+  const store = ref(defaultValue || {});
+  return ({ ssrContext, nuxtState }) => {
+    const state = process.server ? ssrContext.nuxt : nuxtState;
+    state.stores = state.stores || {};
+    if (process.server) {
+      state.stores[key] = store;
+    } else {
+      Object.assign(store, state.stores?.[key] || {});
+    }
+  };
+};
+export function createStore(key, defaultValue) {
+  const plugin = createPlugin(key, defaultValue);
+  function useStore(context) {
+    if (!context) {
+      const vm = getCurrentInstance();
+      if (!vm)
+        throw new Error("useStore must be called in setup() or a context provided");
+      context = vm.proxy;
+    }
+    let state;
+    if (process.server) {
+      state = "$ssrContext" in context ? context.$ssrContext.nuxt : context.ssrContext?.nuxt;
+    } else {
+      state = window.__NUXT__;
+    }
+    return state.stores[key];
+  }
+  return {
+    plugin,
+    useStore
+  };
+}

package/dist/runtime/app/composables/style.d.ts

@@ -0,0 +1,11 @@
+import type { Context } from '@nuxt/types';
+declare function updateHead(): void;
+export declare const createDocusStyles: (context: Context) => void;
+/**
+ * Access the styling state and helpers.
+ */
+export declare const useDocusStyles: () => {
+    styles: any;
+    updateHead: typeof updateHead;
+};
+export {};

package/dist/runtime/app/composables/style.js

@@ -0,0 +1,117 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useDocusStyles = exports.createDocusStyles = void 0;
+
+var _themeColors = require("./theme-colors");
+
+var _ = require("./");
+
+var _app = require("#app");
+
+let _head;
+
+function useColors(colors) {
+  try {
+    return Object.entries(colors).map(([key, color]) => [key, typeof color === "string" ? (0, _themeColors.getColors)(color) : color]);
+  } catch (e) {
+    console.warn("Could not parse custom colors:", e && e.message ? e.message : e);
+    return [];
+  }
+}
+
+function useCssVariableStore(scopes = ["dark"]) {
+  scopes = ["default", ...scopes];
+
+  const _store = scopes.reduce((obj, scope) => ({
+    [scope]: {},
+    ...obj
+  }), {});
+
+  const getScope = scope => _store[scope] || null;
+
+  const putSingle = key => value => {
+    const _arr = value.split(":");
+
+    const _value = _arr.pop();
+
+    const _scope = getScope(_arr.pop() || "default");
+
+    if (_scope) {
+      _scope[key] = _value;
+    }
+  };
+
+  const put = (key, value) => {
+    value.split(" ").map(putSingle(key));
+  };
+
+  const generateVar = ([key, value]) => `--${key}: ${value}`;
+
+  const generateScope = scope => {
+    const vars = Object.entries(getScope(scope)).map(generateVar).join(";");
+    return scope === "default" ? `html:root {${vars}}` : `html.${scope} {${vars}}`;
+  };
+
+  const generate = () => scopes.map(generateScope).join(" ");
+
+  return {
+    put,
+    generate
+  };
+}
+
+function useCSSVariables(colors) {
+  const {
+    put,
+    generate
+  } = useCssVariableStore(["dark"]);
+  const colorsList = useColors(colors);
+  colorsList.forEach(([color, map]) => Object.entries(map).forEach(([variant, value]) => put(`${color}-${variant}`, value)));
+  return generate();
+}
+
+function updateHead() {
+  const head = typeof _head === "function" ? _head() : _head;
+
+  if (!Array.isArray(head.style)) {
+    head.style = [];
+  }
+
+  if (!Array.isArray(head.meta)) {
+    head.meta = [];
+  }
+
+  head.style.push({
+    hid: "docus-theme",
+    cssText: styles.value,
+    type: "text/css"
+  });
+  head.meta = head.meta.filter(s => s.hid !== "theme-color");
+}
+
+const styles = (0, _app.computed)(() => {
+  const theme = (0, _.useDocusTheme)();
+  return useCSSVariables(theme.value?.colors ? theme.value.colors : {});
+});
+
+const createDocusStyles = context => {
+  const {
+    app
+  } = context;
+  _head = app.head;
+  updateHead();
+};
+
+exports.createDocusStyles = createDocusStyles;
+
+const useDocusStyles = () => {
+  return {
+    styles,
+    updateHead
+  };
+};
+
+exports.useDocusStyles = useDocusStyles;

package/dist/runtime/app/composables/style.mjs

@@ -0,0 +1,71 @@
+import { getColors } from "./theme-colors.mjs";
+import { useDocusTheme } from ".//index.mjs";
+import { computed } from "#app";
+let _head;
+function useColors(colors) {
+  try {
+    return Object.entries(colors).map(([key, color]) => [key, typeof color === "string" ? getColors(color) : color]);
+  } catch (e) {
+    console.warn("Could not parse custom colors:", e && e.message ? e.message : e);
+    return [];
+  }
+}
+function useCssVariableStore(scopes = ["dark"]) {
+  scopes = ["default", ...scopes];
+  const _store = scopes.reduce((obj, scope) => ({ [scope]: {}, ...obj }), {});
+  const getScope = (scope) => _store[scope] || null;
+  const putSingle = (key) => (value) => {
+    const _arr = value.split(":");
+    const _value = _arr.pop();
+    const _scope = getScope(_arr.pop() || "default");
+    if (_scope) {
+      _scope[key] = _value;
+    }
+  };
+  const put = (key, value) => {
+    value.split(" ").map(putSingle(key));
+  };
+  const generateVar = ([key, value]) => `--${key}: ${value}`;
+  const generateScope = (scope) => {
+    const vars = Object.entries(getScope(scope)).map(generateVar).join(";");
+    return scope === "default" ? `html:root {${vars}}` : `html.${scope} {${vars}}`;
+  };
+  const generate = () => scopes.map(generateScope).join(" ");
+  return { put, generate };
+}
+function useCSSVariables(colors) {
+  const { put, generate } = useCssVariableStore(["dark"]);
+  const colorsList = useColors(colors);
+  colorsList.forEach(([color, map]) => Object.entries(map).forEach(([variant, value]) => put(`${color}-${variant}`, value)));
+  return generate();
+}
+function updateHead() {
+  const head = typeof _head === "function" ? _head() : _head;
+  if (!Array.isArray(head.style)) {
+    head.style = [];
+  }
+  if (!Array.isArray(head.meta)) {
+    head.meta = [];
+  }
+  head.style.push({
+    hid: "docus-theme",
+    cssText: styles.value,
+    type: "text/css"
+  });
+  head.meta = head.meta.filter((s) => s.hid !== "theme-color");
+}
+const styles = computed(() => {
+  const theme = useDocusTheme();
+  return useCSSVariables(theme.value?.colors ? theme.value.colors : {});
+});
+export const createDocusStyles = (context) => {
+  const { app } = context;
+  _head = app.head;
+  updateHead();
+};
+export const useDocusStyles = () => {
+  return {
+    styles,
+    updateHead
+  };
+};

package/dist/runtime/app/composables/theme-colors.d.ts

@@ -0,0 +1,30 @@
+export declare function parseColor(color?: string): number[];
+export declare function hexValue(components: any): string;
+export declare function tint(components: any, intensity: any): any;
+export declare function shade(components: any, intensity: any): any;
+export declare const withTint: (intensity: any) => (hex: any) => any;
+export declare const withShade: (intensity: any) => (hex: any) => any;
+export declare const _variants: {
+    50: (hex: any) => any;
+    100: (hex: any) => any;
+    200: (hex: any) => any;
+    300: (hex: any) => any;
+    400: (hex: any) => any;
+    500: (c: any) => any;
+    600: (hex: any) => any;
+    700: (hex: any) => any;
+    800: (hex: any) => any;
+    900: (hex: any) => any;
+};
+export declare function getColors(color: any, variants?: {
+    50: (hex: any) => any;
+    100: (hex: any) => any;
+    200: (hex: any) => any;
+    300: (hex: any) => any;
+    400: (hex: any) => any;
+    500: (c: any) => any;
+    600: (hex: any) => any;
+    700: (hex: any) => any;
+    800: (hex: any) => any;
+    900: (hex: any) => any;
+}): {};