# @bildvitta/composables

> ## 1. Instalação ```md npm i @bildvitta/composables ```

Latest version **1.0.0-beta.0** (published 2024-03-13) · 0 weekly downloads

## Install

```sh
npm install @bildvitta/composables
pnpm add @bildvitta/composables
yarn add @bildvitta/composables
bun add @bildvitta/composables
```

## Health

**Score 25/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities.

Warnings: low downloads.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.0-beta.0 |
| Published | 2024-03-13 |
| First published | 2024-03-13 |
| Weekly downloads | 0 |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 2 |
| Unpacked size | 15.5 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | gcarpi, waguerrero, felipejuzo02, caiotarifa, douglascalora |

## Links

- npm: https://www.npmjs.com/package/@bildvitta/composables
- npm.io page: https://npm.io/package/@bildvitta/composables

## Dependencies (2)

- [vue](https://npm.io/package/vue.md) ^3.4.21
- [path](https://npm.io/package/path.md) ^0.12.7

## Recent versions

- 1.0.0-beta.0 (latest) — 2024-03-13
- 1.0.0-beta.12 (beta) — 2025-04-10
- 1.0.0-beta.11 — 2025-04-10
- 1.0.0-beta.10 — 2025-01-28
- 1.0.0-beta.9 — 2024-12-05
- 1.0.0-beta.8 — 2024-11-28
- 1.0.0-beta.7 — 2024-03-15
- 1.0.0-beta.6 — 2024-03-14
- 1.0.0-beta.5 — 2024-03-14
- 1.0.0-beta.4 — 2024-03-14
- 1.0.0-beta.3 — 2024-03-14
- 1.0.0-beta.2 — 2024-03-14
- 1.0.0-beta.1 — 2024-03-14

## README

# composables

## 1. Instalação
```md
npm i @bildvitta/composables
```

## API

### Core
Composables de utilidades para serem utilizadas diretamente nos componentes/composables/js.

#### useView
Composable para utilizar nos componentes de view, estes componentes normalmente são componentes que englobam a página, por exemplo se estiver utilizando com a biblioteca `asteroid`: [QasFormView, QasListView, QasSingleView].

```html
<template>
  <app-list-view-component
  v-model:results="viewState.results"
  v-model:fields="viewState.fields"
  v-model:results="viewState.metadata"
  v-model:results="viewState.fetching"
  />
</template>

<script setup>
const { viewState } = useView({ mode: 'list' })
viewState.value.fetching // true | false
</script>
```

### Wrappers
Composables wrappers é para **sempre** serem utilizados englobados por outros composables, **nunca** utilize esses composables diretamente nos seus componentes/composables/js.

#### useCan
Composable base para permissionamento de tela.

```js
// composables/use-can.js
import store from 'algum-caminho-pra-store'
import { useCan: useCanWrapper } from '@bildvitta/composables/lib/wrappers'

export default function useCan () {
  return useCanWrapper({ store })
}

// utilizamos o useCan da própria aplicação e não do @bildvitta/composables/lib/wrappers
import useCan from 'composables/use-can'

const { can, canAny } = useCan()

can('users.list') // true | false,
can('companies.list', 'companies') // true | false

canAny(['users.list', 'users.show']) // true | false
canAny(['companies.list', 'companies.delete'], 'companies') // true | false
```

---
_Source: https://npm.io/package/@bildvitta/composables · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._