open-index/open-npm huggingface dataset:
npm package: @nw-design/ui
Description: vue3 admin components
Author: nw-design
Latest version: 1.2.0

---
layout: doc
---

# 快速上手

`@nw-design/ui`为封装的常用组件库

> 在开始之前，由于大部分组件都是基于 ant-design-vue,所以首先需要安装 ant-design-vue,样式文件暂时打包进封装的@nw-design/ui

## 安装

你可以选择`npm`, `yarn`, `pnpm` 安装

组件库的`peerDependencies`有 @ant-design/icons-vue,@vueuse/core,ant-design-vue,lodash-es,resize-observer-polyfill,vue 所以你需要提前安装它们

```sh
# 选择一个包管理器

# NPM
npm install @nw-design/ui --save

# Yarn
yarn add @nw-design/ui

# pnpm
pnpm install @nw-design/ui

```

## 使用组件

该组件库没有把`ant-design-vue`组件库的样式文件打包，所以使用先需要先引入以下组件

```
import {Button, Menu,Divider,Popover,Modal,Tooltip} from 'ant-design-vue'
app.use(Button).use(Menu).use(Divider).use(Popover).use(Modal).use(Tooltip)
```

### 全局完整注册

```typescript
import { createApp } from 'vue'
import nwui from '@nw-design/ui'
import App from './App'
import '@nw-design/ui/dist/es/style.css'
const app = createApp(App)
app.use(nwui).mount('#app')
```

### 局部注册组件

样式文件暂时全部在 main.ts 全局引入

```typescript
import { ScrollBar } from '@nw-design/ui'
export default {
  components: {
    ScrollBar
  }
}
```

### 主要更新内容

```
更新时间 2023-09-06
1.调整table的search的样式，整体样式，
2.增加Modal内动态加载内容并自动调整高度，调用弹窗暴露的外部方法 redoModalHeight()
3.增加modal内loading的功能
```
npm package: @nw-union/nw-utils
Description: Our Typescript Utility Library
Latest version: 0.0.9

<samp>
<h1 align="center">nw-utils</h1>

<!-- Badge -->
<p align="center">
</p>

<!-- About this Project -->
<p align="center">
NWU のアプリケーションに使用するユーティリティライブラリ
</p>
<br />

```
# 公開
bunx npm publish
```

</samp>
npm package: @nw01/rayneo-6dof
Description: Provides access to 6DoF tracking capabilities
Author: wen01
Latest version: 0.0.26

# @nw01/rayneo-6dof

Provides access to 6DoF tracking capabilities

## Install

```bash
npm install @nw01/rayneo-6dof
npx cap sync
```

## API

<docgen-index>

* [`startTracking()`](#starttracking)
* [`stopTracking()`](#stoptracking)
* [`resetPosition()`](#resetposition)
* [`addListener('sixDofUpdate', ...)`](#addlistenersixdofupdate-)
* [Interfaces](#interfaces)

</docgen-index>

<docgen-api>
<!--Update the source file JSDoc comments and rerun docgen to update the docs below-->

### startTracking()

```typescript
startTracking() => Promise<void>
```

--------------------


### stopTracking()

```typescript
stopTracking() => Promise<void>
```

--------------------


### resetPosition()

```typescript
resetPosition() => Promise<void>
```

--------------------


### addListener('sixDofUpdate', ...)

```typescript
addListener(eventName: 'sixDofUpdate', listenerFunc: (data: SixDofData) => void) => Promise<{ remove: () => void; }>
```

| Param              | Type                                                                 |
| ------------------ | -------------------------------------------------------------------- |
| **`eventName`**    | <code>'sixDofUpdate'</code>                                          |
| **`listenerFunc`** | <code>(data: <a href="#sixdofdata">SixDofData</a>) =&gt; void</code> |

**Returns:** <code>Promise&lt;{ remove: () =&gt; void; }&gt;</code>

--------------------


### Interfaces


#### SixDofData

| Prop          | Type                |
| ------------- | ------------------- |
| **`azimuth`** | <code>number</code> |
| **`pitch`**   | <code>number</code> |
| **`roll`**    | <code>number</code> |
| **`x`**       | <code>number</code> |
| **`y`**       | <code>number</code> |
| **`z`**       | <code>number</code> |

</docgen-api>
npm package: @nw01/rayneo-bearing
Description: Bearing capabilities plugin
Author: wen01
Latest version: 0.0.10

# @nw01/rayneo-bearing

Bearing capabilities plugin

## Install

```bash
npm install @nw01/rayneo-bearing
npx cap sync
```

## API

<docgen-index>

* [`start()`](#start)
* [`stop()`](#stop)
* [`addListener('bearingUpdate', ...)`](#addlistenerbearingupdate-)
* [`removeAllListeners()`](#removealllisteners)
* [Interfaces](#interfaces)

</docgen-index>

<docgen-api>
<!--Update the source file JSDoc comments and rerun docgen to update the docs below-->

### start()

```typescript
start() => Promise<void>
```

Start listening to bearing updates.

--------------------


### stop()

```typescript
stop() => Promise<void>
```

Stop listening to bearing updates.

--------------------


### addListener('bearingUpdate', ...)

```typescript
addListener(eventName: 'bearingUpdate', listenerFunc: (data: BearingData) => void) => Promise<void>
```

Listen for updates to bearing.

| Param              | Type                                                                   |
| ------------------ | ---------------------------------------------------------------------- |
| **`eventName`**    | <code>'bearingUpdate'</code>                                           |
| **`listenerFunc`** | <code>(data: <a href="#bearingdata">BearingData</a>) =&gt; void</code> |

--------------------


### removeAllListeners()

```typescript
removeAllListeners() => Promise<void>
```

Remove all listeners.

--------------------


### Interfaces


#### BearingData

| Prop            | Type                |
| --------------- | ------------------- |
| **`azimuth`**   | <code>number</code> |
| **`direction`** | <code>string</code> |

</docgen-api>
npm package: @nwachu/excalidraw
Description: Excalidraw as a React component
Latest version: 0.1.0

# Excalidraw

**Excalidraw** is exported as a component to directly embed in your projects.

## Installation

You can use `npm`

```bash
npm install react react-dom @excalidraw/excalidraw
```

or via `yarn`

```bash
yarn add react react-dom @excalidraw/excalidraw
```

After installation you will see a folder `excalidraw-assets` and `excalidraw-assets-dev` in `dist` directory which contains the assets needed for this app in prod and dev mode respectively.

Move the folder `excalidraw-assets` and `excalidraw-assets-dev` to the path where your assets are served.

By default it will try to load the files from [`https://unpkg.com/@excalidraw/excalidraw/dist/`](https://unpkg.com/@excalidraw/excalidraw/dist)

If you want to load assets from a different path you can set a variable `window.EXCALIDRAW_ASSET_PATH` depending on environment (for example if you have different URL's for dev and prod) to the url from where you want to load the assets.

#### Note

**If you don't want to wait for the next stable release and try out the unreleased changes you can use `@excalidraw/excalidraw@next`.**

## Dimensions of Excalidraw

Excalidraw takes _100%_ of `width` and `height` of the containing block so make sure the container in which you render Excalidraw has non zero dimensions.

### Demo

[Try here](https://codesandbox.io/s/excalidraw-ehlz3).

## Integration

Head over to the [docs](https://docs.excalidraw.com/docs/@excalidraw/excalidraw/integration)

## API

Head over to the [docs](https://docs.excalidraw.com/docs/@excalidraw/excalidraw/api)
npm package: @nwachu/excalidraw_v2
Description: Excalidraw as a React component
Latest version: 0.1.0

# Excalidraw

**Excalidraw** is exported as a component to directly embed in your projects.

## Installation

You can use `npm`

```bash
npm install react react-dom @excalidraw/excalidraw
```

or via `yarn`

```bash
yarn add react react-dom @excalidraw/excalidraw
```

After installation you will see a folder `excalidraw-assets` and `excalidraw-assets-dev` in `dist` directory which contains the assets needed for this app in prod and dev mode respectively.

Move the folder `excalidraw-assets` and `excalidraw-assets-dev` to the path where your assets are served.

By default it will try to load the files from [`https://unpkg.com/@excalidraw/excalidraw/dist/`](https://unpkg.com/@excalidraw/excalidraw/dist)

If you want to load assets from a different path you can set a variable `window.EXCALIDRAW_ASSET_PATH` depending on environment (for example if you have different URL's for dev and prod) to the url from where you want to load the assets.

#### Note

**If you don't want to wait for the next stable release and try out the unreleased changes you can use `@excalidraw/excalidraw@next`.**

## Dimensions of Excalidraw

Excalidraw takes _100%_ of `width` and `height` of the containing block so make sure the container in which you render Excalidraw has non zero dimensions.

### Demo

[Try here](https://codesandbox.io/s/excalidraw-ehlz3).

## Integration

Head over to the [docs](https://docs.excalidraw.com/docs/@excalidraw/excalidraw/integration)

## API

Head over to the [docs](https://docs.excalidraw.com/docs/@excalidraw/excalidraw/api)