@inkline/inkline/plugin.js

Inkline is the intuitive UI Components library that gives you a developer-friendly foundation for building high-quality, accessible, and customizable Vue.js 3 Design Systems.

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.Inkline = void 0;
exports.createInklineService = createInklineService;
exports.defaultOptions = void 0;
var _vue = require("vue");
var _utils = require("@grozav/utils");
var _validation = require("@inkline/inkline/validation");
var _i18n = require("@inkline/inkline/i18n");
var _plugins = require("@inkline/inkline/plugins");
var _constants = require("@inkline/inkline/constants");
function createInklineService({
  icons,
  // eslint-disable-line @typescript-eslint/no-unused-vars
  components,
  // eslint-disable-line @typescript-eslint/no-unused-vars
  ...options
}) {
  return {
    form(schema) {
      return (0, _validation.createSchema)(schema);
    },
    setLocale(locale) {
      (0, _i18n.setLocale)(locale);
    },
    options: (0, _vue.reactive)(options)
  };
}
const defaultOptions = exports.defaultOptions = {
  color: "",
  colorMode: "system",
  colorModeStrategy: "localStorage",
  components: {},
  componentOptions: {},
  icons: {},
  locale: "en",
  renderMode: "client",
  routerComponent: "RouterLink",
  size: "",
  validateOn: ["input", "blur"],
  toast: {
    position: "bottom-right",
    duration: 3500
  },
  modal: {}
};
const Inkline = exports.Inkline = {
  install(app, options = {}) {
    const {
      components,
      icons,
      renderMode,
      ...overrideOptions
    } = options;
    const extendedOptions = {
      ...defaultOptions,
      ...overrideOptions
    };
    for (const componentIndex in components) {
      app.component(componentIndex, components[componentIndex]);
    }
    const inklineService = createInklineService(extendedOptions);
    app.config.globalProperties.$inkline = inklineService;
    app.provide(_constants.InklineKey, inklineService);
    if (typeof window !== "undefined") {
      (0, _utils.addClass)(document.body, "inkline");
    }
    app.use(_plugins.ColorModePlugin, {
      inkline: inklineService,
      renderMode
    });
    app.use(_plugins.IconsPlugin, {
      icons
    });
    app.use(_plugins.ModalPlugin, {
      inkline: inklineService
    });
    app.use(_plugins.OverlayPlugin);
    app.use(_plugins.ToastPlugin, {
      inkline: inklineService
    });
  }
};