# @sourcesync/quasar-ui-profiles
> Quasar Component for UserProfile
Latest version **0.0.1** (published 2021-02-09) · MIT license · 0 weekly downloads
## Install
```sh
npm install @sourcesync/quasar-ui-profiles
pnpm add @sourcesync/quasar-ui-profiles
yarn add @sourcesync/quasar-ui-profiles
bun add @sourcesync/quasar-ui-profiles
```
## Health
**Score 15/100 (F)** — status: abandoned.
Positive: no vulnerabilities.
Warnings: low downloads; no types; no esm support; pre 1.0.
Negative: abandoned; low maintenance score.
## Facts
| | |
|---|---|
| Version | 0.0.1 |
| Published | 2021-02-09 |
| First published | 2021-02-09 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 19.5 KB |
| Known vulnerabilities | 0 |
| Install scripts | yes |
| Author | dev@sourcedigital.net |
| Maintainers | marta.klaptiuk, c-49, sonoko_sd, sunil2342, onexdata, ajaysourcedigital |
## Links
- npm: https://www.npmjs.com/package/@sourcesync/quasar-ui-profiles
- Repository: https://github.com/Source-Digital/quasar-app-extension-profiles
- Issues: https://github.com/Source-Digital/quasar-app-extension-profiles/issues
- npm.io page: https://npm.io/package/@sourcesync/quasar-ui-profiles
## Recent versions
- 0.0.1 (latest) — 2021-02-09
## README
# Component QProfile
[](https://www.npmjs.com/package/@sourcesync/quasar-ui-profiles)
[](https://www.npmjs.com/package/@sourcesync/quasar-ui-profiles)
# Usage
## Quasar CLI project
Install the [App Extension](../app-extension).
**OR**:
Create and register a boot file:
```js
import Vue from "vue";
import Plugin from "@sourcesync/quasar-ui-profiles";
import "@sourcesync/quasar-ui-profiles/dist/index.css";
Vue.use(Plugin);
```
**OR**:
```html
```
## Vue CLI project
```js
import Vue from "vue";
import Plugin from "@sourcesync/quasar-ui-profiles";
import "@sourcesync/quasar-ui-profiles/dist/index.css";
Vue.use(Plugin);
```
**OR**:
```html
```
## UMD variant
Exports `window.qProfile`.
Add the following tag(s) after the Quasar ones:
```html
```
If you need the RTL variant of the CSS, then go for the following (instead of the above stylesheet link):
```html
```
# Usage
```js
```
> Schema
| key | value |
| -------- | -------------------------- |
| name | `'username'` |
| label | `'Username'` |
| mask | `'@xxxxxxxxxx'` |
| disable | `false` |
| autogrow | `false` |
| classes | `col-lg-4 col-md-6 col-12` |
> Mask
Documentation - [Quasar.dev](https://quasar.dev/vue-components/input#Mask) | [Github - Full list](https://github.com/quasarframework/quasar/blob/dev/ui/src/mixins/mask.js#L2)
| token | description |
| ----- | -------------------------------------------------- |
| # | Numeric |
| S | Letter, a to z, case insensitive |
| N | Alphanumeric, case insensitive for letters |
| A | Letter, transformed to uppercase |
| a | Letter, transformed to lowercase |
| X | Alphanumeric, transformed to uppercase for letters |
| x | Alphanumeric, transformed to lowercase for letters |
---
# Development Setup
```bash
$ yarn install // # npm install
```
# Developing
```bash
# start dev in SPA mode
$ yarn dev
# start dev in UMD mode
$ yarn dev:umd
# start dev in SSR mode
$ yarn dev:ssr
# start dev in Cordova iOS mode
$ yarn dev:ios
# start dev in Cordova Android mode
$ yarn dev:android
# start dev in Electron mode
$ yarn dev:electron
```
# Building package
```bash
$ yarn build
```
# Adding Testing Components
in the `ui/dev/src/pages` you can add Vue files to test your component/directive. When using `yarn dev` to build the UI, any pages in that location will automatically be picked up by dynamic routing and added to the test page.
# Adding Assets
If you have a component that has assets, like language or icon-sets, you will need to provide these for UMD. In the `ui/build/script.javascript.js` file, you will find a couple of commented out commands that call `addAssets`. Uncomment what you need and add your assets to have them be built and put into the `ui/dist` folder.
# Donate
If you appreciate the work that went into this, please consider [donating to Quasar](https://donate.quasar.dev).
# License
MIT (c) dev@sourcedigital.net
---
_Source: https://npm.io/package/@sourcesync/quasar-ui-profiles · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._