Skip to content

How to use

Installation

This package is published in a private Gitlab registry, so you will need to authenticate and adjust your config before installing it.

Setup

First, create an access token on Gitlab.com with the scope read_api.

Authenticate with the Gitlab registry:

sh
npm config set -- //gitlab.com/api/v4/projects/54847910/packages/npm/:_authToken=YOUR_ACCESS_TOKEN

Set the registry to resolve packages with scope @scayla:

sh
npm config set @scayla:registry=https://gitlab.com/api/v4/projects/54847910/packages/npm/

Install the package:

sh
npm i @scayla/component-library

Styles

Load the stylesheet:

ts
import "@scayla/component-library/style.css";

Fonts

Load the fonts into the project:

scss
$fonts-path: "@scayla/component-library/fonts/";
@import "@scayla/component-library/scss/font-loader";

Translation setup

WARNING

WIP

ts
import { translations, normalizeTranslations } from "@scayla/component-library";
import { createGettext } from "vue3-gettext";
import projectTranslations from "./your-project-translations.json";

export const gettext = createGettext({
  translations: merge(normalizeTranslations(translations), normalizeTranslations(projectTranslations)),
});

Import components

js
import { KButton } from "@scayla/component-library";