Enkitek
The components for that we used in Enkitek project.
Main Components
Page : its Page components for logged in users
QRViewer: its QRViewer components
QRScanner: its QRScanner components to can the generated qr
Layout: set enkitek Layout with header and footer Th Page Companent will be the child of this component
Usage
Functionalities
i18nInit: this is used to set available language json. we are using svelte-i18n lib for this. This will use in main.js or app.svelte file.
example of i18nInit
import { i18nInit } from "@ksmahesh3/enkitek";
i18nInit([{
code:'en',
json: {"name": "Name", "age": "Age", "description": "Description"}
},
{
code:'es',
json: {"name": "Nombre", "age": "Años", "description": "Descripción"}
}])
install latest version of Enkitek components
npm i @ksmahesh3/enkitek@latest
## Usage of page component
and then import the component Page in you svelte component like below:
```bash
# import page component
import { Page } from "@ksmahesh3/enkitek";
and in html portion you need to add the following code:
# using page component
<Page>
<h1 slot="title">Title of the page</h1>
<div slot="actions">
added the actio nutton if it required
</div>
<div slot="content">
add page content or components here
</div>
</Page>
Usage of page QRViewer
# import page component
import { QRViewer } from "@ksmahesh3/enkitek";
and in html portion you need to add the following code:
# using page component
<QRViewer squareSize=200 codeValue="example text"/>
squareSize: the size of the square codeValue: this is the text used for generate qr code
Usage of page QRScanner
# import page component
import { QRScanner } from "@ksmahesh3/enkitek";
and in html portion you need to add the following code:
# using page component
<QRScanner/>
Usage of page Layout
# import page component
import { Layout } from "@ksmahesh3/enkitek";
and in html portion you need to add the following code:
# using page component
<Layout>
body will come here
</Layout>