@bimdata/bcf-components

BIMData BCF components library

A set of Vue components to manage BCF and build BCF related features into your app.

Made with :heart: by BIMData.io.

Usage

Install:

npm install @bimdata/bcf-components

Vue 3.x application

Note: The library is built for Vue 3.x applications, it is no longer intended to work with older version of Vue.

The package provide a Vue plugin that can be used to setup the library for your app and make all components available globally.

import { createApp } from "vue";
import { createI18n } from "vue-i18n"; // v9.x
import { makeBIMDataApiClient } from "@bimdata/typescript-fetch-api-client"; // v8.2+
import DesignSystem from "@bimdata/design-system/vue3-plugin.js"; // v2+
import BIMDataComponents from "@bimdata/components/vue3-plugin.js"; // v1+

// Import Vue 3 plugin factory
import BcfComponents from "@bimdata/bcf-components/vue3-plugin.js";

// Instanciate i18n plugin
const i18nPlugin = createI18n({ ... });
// Instanciate BIMData API client
const apiClient = makeBIMDataApiClient({ ... });

const app = createApp()
  .use(i18nPlugin)
  .use(DesignSystem())
  .use(BIMDataComponents())
  // Provide both i18n plugin and API client as plugin config
  .use(BcfComponents({ i18nPlugin, apiClient }));
...

It is also possible to provide your own translations for i18n by removing i18nPlugin from plugin config and adding translation keys from src/i18n/lang/fr.js to the translation files of your app.