open-index/open-npm huggingface dataset:
npm package: @ibezkrovnyi/tslint-rules
Description: currently it contains only one rule:
Latest version: 0.0.3

# tslint-rules

currently it contains only one rule:

```json
{
  "no-inferrable-return-types": true
}
```

which is the same as [no-inferrable-types](https://palantir.github.io/tslint/rules/no-inferrable-types/), but for Return Types

# example

```ts
function sum(a, b): number {
  return a + b;
}
```

may be safely replaced with
```ts
function sum(a, b) {
  return a + b;
}
```

# fix
`tslint --fix` is available
npm package: @ibg/config
Description: Collection of ESLint, Vite and Typescript configurations
Author: @bennoinbeta
Latest version: 0.0.14

<h1 align="center">
    <img src="https://raw.githubusercontent.com/inbeta-group/monorepo/develop/packages/config/.github/banner.svg" alt="@ibg/config banner">
</h1>

<p align="left">
    <a href="https://github.com/inbeta-group/monorepo/blob/develop/LICENSE">
        <img src="https://img.shields.io/github/license/inbeta-group/monorepo.svg?label=license&style=flat&colorA=293140&colorB=F0E81A" alt="GitHub License"/>
    </a>
    <a href="https://www.npmjs.com/package/@ibg/config">
        <img src="https://img.shields.io/npm/dt/@ibg/config.svg?label=downloads&style=flat&colorA=293140&colorB=F0E81A" alt="NPM total downloads"/>
    </a>
    <a href="https://dyn.art/s/discord/?source=inbeta-group-readme">
        <img src="https://img.shields.io/discord/795291052897992724.svg?label=&logo=discord&logoColor=000000&color=293140&labelColor=F0E81A" alt="Join Discord"/>
    </a>
</p>

`@ibg/config` is a collection of ESLint, Vite and Typescript configurations.

## 📖 Usage

### [Typescript](https://www.typescriptlang.org/)

`tsconfig.json`
```json
{
	"extends": "@ibg/config/react-library.tsconfig.json",
	"compilerOptions": {
		"outDir": "./dist",
		"rootDir": "./src",
		"declarationDir": "./dist/types",
	},
	"include": ["src"]
}
```

### [ESLint](https://eslint.org/)

`.eslintrc.js`
```js
/**
 * @type {import('eslint').Linter.Config}
 */
module.exports = {
	root: true,
	extends: [require.resolve('@ibg/config/eslint/react-internal'), 'plugin:storybook/recommended']
};
```

### [Vitest](https://vitest.dev/)

`vitest.config.js`
```js
const { defineConfig, mergeConfig } = require('vitest/config');
const { nodeConfig } = require('@ibg/config/vite/node.config');

module.exports = mergeConfig(nodeConfig, defineConfig({}));
```

## 🙏 Contribution

### Debugging ESLint Configuration

If you are encountering issues or unexpected behavior with ESLint, you can use the following command to output the final configuration. 

```bash
npx eslint --print-config ./some/file/to/test/on.ts
```

## 🔴 Issues

### TypeScript Configurations Location

TypeScript configurations are placed at the root to allow easy referencing from other packages in the monorepo using the `extends` field in `tsconfig.json`, like so:

```json
{
	"extends": "@ibg/config/base.json"
}
```

Node: Extending nested configuration didn't work.

## 🌟 Credits

This configuration is based on the [`turbo-basic`](https://github.com/vercel/turbo/tree/main/examples/basic) starter template and will be kept in sync with it as the Vercel team knows better than me what configurations settings are best for NextJs apps and co. Also [`tsconfig/bases`](https://github.com/tsconfig/bases) was a source of inspiration.
npm package: @ibg/utils
Description: Straightforward, typesafe, and tree-shakable collection of utility functions
Author: @bennoinbeta
Latest version: 0.0.13

<h1 align="center">
    <img src="https://raw.githubusercontent.com/inbeta-group/monorepo/develop/packages/utils/.github/banner.svg" alt="@ibg/utils banner">
</h1>

<p align="left">
    <a href="https://github.com/inbeta-group/monorepo/blob/develop/LICENSE">
        <img src="https://img.shields.io/github/license/inbeta-group/monorepo.svg?label=license&style=flat&colorA=293140&colorB=F0E81A" alt="GitHub License"/>
    </a>
    <a href="https://www.npmjs.com/package/@ibg/utils">
        <img src="https://img.shields.io/bundlephobia/minzip/@ibg/utils.svg?label=minzipped%20size&style=flat&colorA=293140&colorB=F0E81A" alt="NPM bundle minzipped size"/>
    </a>
    <a href="https://www.npmjs.com/package/@ibg/utils">
        <img src="https://img.shields.io/npm/dt/@ibg/utils.svg?label=downloads&style=flat&colorA=293140&colorB=F0E81A" alt="NPM total downloads"/>
    </a>
    <a href="https://dyn.art/s/discord/?source=inbeta-group-readme">
        <img src="https://img.shields.io/discord/795291052897992724.svg?label=&logo=discord&logoColor=000000&color=293140&labelColor=F0E81A" alt="Join Discord"/>
    </a>
</p>

`@ibg/utils` is a straightforward, typesafe, and tree-shakable collection of utility functions.
npm package: @ibge/calendario
Description: ## Instalação
Author: Fernando Mendonça de Almeida
Latest version: 0.2.1

# Calendário

## Instalação

Para instalar a biblioteca, rode:

```bash
$ npm install @ibge/calendario --save
```

## Usando a biblioteca

Após instalar a biblioteca, você deve importar o `CalendarioModule` no seu `AppModule`:

```typescript
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

// Módulo do Calendário
import { CalendarioModule } from '@ibge/calendario';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    
    // Adicionar o CalendarioModule no AppModule, caso seja em um módulo interno basta importar como CalendarioModule
    CalendarioModule.forRoot()
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }
```

Uma vez importado, é possível consumir os serviços do calendário, recebendo a informação segundo a api de calendário `http://servicodados.ibge.gov.br/api/docs/calendario`

```typescript
// Importar o serviço e interfaces, se necessário
import { CalendarioService, Divulgacao, DivulgacoesPaginadas } from '@ibge/calendario';

// ...

  constructor(
    // Injetar o serviço no construtor do componente
    private _calendarioServ: CalendarioService
  ) {}

  ngOnInit(): void {
    // Chamar os métodos disponíveis
    this._calendarioServ.getDivulgacoes({
      qtd: 10,
      de: '2017-05-01',
      ate: '2017-06-08'
    }).subscribe((divulgacoesPaginadas: DivulgacoesPaginadas) => {
      // Utilizar as divulgacoesPaginadas aqui
    })
  }
```

## Desenvolvimento

Esse componente utilizou o generator do yeoman `https://github.com/jvandemo/generator-angular2-library`, os comandos utilizados podem ser encontrados na documentação

## Licença

MIT
npm package: @ibge/noticias
Description: ## Instalação
Author: Fernando Mendonça de Almeida
Latest version: 0.1.0

# Noticias

## Instalação

Para instalar a biblioteca, rode:

```bash
$ npm install @ibge/noticias --save
```

## Usando a biblioteca

Após instalar a biblioteca, você deve importar o `NoticiasModule` no seu `AppModule`:

```typescript
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

// Módulo de Notícias
import { NoticiasModule } from '@ibge/noticias';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    
    // Adicionar o NoticiasModule no AppModule, caso seja em um módulo interno basta importar como NoticiasModule
    NoticiasModule.forRoot()
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }
```

Uma vez importado, é possível consumir os serviços do calendário, recebendo a informação segundo a api de calendário `http://servicodados.ibge.gov.br/api/docs/noticias`

```typescript
// Importar o serviço e interfaces, se necessário
import { NoticiasService, Noticia, NoticiasPaginadas } from '@ibge/noticias';

// ...

  constructor(
    // Injetar o serviço no construtor do componente
    private _noticiasServ: NoticiasService
  ) {}

  ngOnInit(): void {
    // Chamar os métodos disponíveis
    this._noticiasServ.get({
      qtd: 10
    }).subscribe((noticiasPaginadas: NoticiasPaginadas) => {
      // Utilizar as noticiasPaginadas aqui
    })
  }
```

## Desenvolvimento

Esse componente utilizou o generator do yeoman `https://github.com/jvandemo/generator-angular2-library`, os comandos utilizados podem ser encontrados na documentação

## Licença

MIT
npm package: @ibibicloud/hello
Description: 一个简单的npm包
Author: ibibiCloud
Latest version: 0.0.1


## @ibibicloud/hello
一个简单的npm包，用于控制台打印欢迎信息。

### 安装
~~~
npm install @ibibicloud/hello
~~~

### 使用
~~~
import { hello } from '@ibibicloud/hello';
~~~

~~~
// 输出: Hello, World!
hello();
// 输出: Hello, John!
hello('John'); 
~~~

### 注意事项
- 此包仅支持 ES 模块（ESM）格式
- Node.js 版本需 >= 14
- 浏览器中使用时需添加 `<script type="module">`
~~~
<script type="module">
import { hello } from './index.js';
// 输出: Hello, World!
hello();
// 输出: Hello, John!
hello('John'); 
</script>
~~~
npm package: @ibigtree/react-native-naver-login
Description: Naver Login for React Native
Author: Daehan Kim
Latest version: 0.0.4
Deprecated: Use @react-native-seoul/naver-login

# @ibigtree/react-native-naver-login

React Native를 위한 네이버 로그인 라이브러리.

## Getting started

`$ npm install @ibigtree/react-native-naver-login --save`


### 공통

[Naver Developers](https://developers.naver.com) 에서 앱 생성 및 사용할 플랫폼 등록을 먼저 진행해야 합니다.

### iOS

등록한 앱의 Bundle Identifier와 프로젝트의 값이 일치해야 정상 동작합니다.


Info.plist 에 다음 내용 추가({URL_SCHEME은 사용할 앱의 URL Scheme로 설정})

```xml
<dict>
  <key>LSApplicationQueriesSchemes</key>
  <array>
     <!-- 네이버 로그인 -->
     <string>naversearchapp</string>
     <string>naversearchthirdlogin</string>
  </array>

  <key>CFBundleURLTypes</key>
  <array>
    <dict>
      <key>CFBundleURLSchemes</key>
      <array>
        <string>{URL_SCHEME}</string>
      </array>
    </dict>
  </array>
</dict>
```

AppDelegate.m에 다음 내용 추가.

* 주의: 네이버 아이디 로그인에서는 호출된 URL이 네이버 로그인을 위한 URL인지 검사하는 루틴이 없기 때문에 직접 검사를 해주셔야 합니다.

```objective-c
#import <NaverThirdPartyLogin/NaverThirdPartyLogin.h>

- (BOOL)application:(UIApplication *)app openURL:(NSURL *)url options:(NSDictionary *)options {
    if ([url.scheme isEqualToString:@"{URL_SCHEME}"]) {
        return [[NaverThirdPartyLoginConnection getSharedInstance] application:app openURL:url options:options];
    }

    return NO;
}

```

### Android

등록한 앱 ID가 일치해야 정상 작동 합니다.

## Usage
```javascript
import NaverLogin from '@ibigtree/react-native-naver-login';

async function processLogin() {
    try {
        const tokenInfo = await NaverLogin.login({
            consumerKey: '{CONSUMER_KEY}',
            consumerSecret: '{CONSUMER_SECRET}',
            appName: '{APP_NAME}',
            serviceUrlScheme: '{IOS_URL_SCHEME}',  // iOS의 경우에만 필요함
        });
        console.log(tokenInfo.accessToken);
        await NaverLogin.logout();
    } catch (error) {
        if (error.code === 'E_CANCELLED') {
            // 사용자가 로그인을 취소함
            // iOS에서는 취소시에도 에러 이벤트 반환하지 않음.
        }

        // 기타 정의되지 않은 에러 (E_UNKNOWN)
    }
}
```
npm package: @ibigtree/react-native-webview-bridge
Description: WebView - Web 사이 통신을 위한 Bridge
Author: Daehan Kim
Latest version: 0.3.0

# @ibigtree/react-native-webview-bridge

WebView - Web 사이 통신을 위한 Bridge

## 설치

```
npm install --save @ibigtree/react-native-webview-bridge
```

## 사용법

example 참조
npm package: @ibimfish/element-theme-chalk
Description: Element component chalk theme.
Author: yi.shyang@ele.me
Latest version: 2.8.2-18

# element-theme-chalk
> element component chalk theme.


## Installation
```shell
npm i element-theme-chalk -S
```

## Usage

Use Sass import
```css
@import 'element-theme-chalk';
```

Or Use webpack
```javascript
import 'element-theme-chalk';
```

Or
```html
<link rel="stylesheet" href="path/to/node_modules/element-theme-chalk/lib/index.css">
```

##  Import on demand
```javascript
import 'element-theme-chalk/lib/input.css';
import 'element-theme-chalk/lib/select.css';

// ...
```
npm package: @ibiz-template-plugin/ai-chat
Description: iBiz AI交互框插件
Author: iBiz
Latest version: 0.0.71

# @ibiz-template-plugin/ai-chat

一款深度集成于iBiz设计平台的AI智能辅助插件，提供基于自然语言交互的智能问答服务，支持实时消息列表管理、会话历史持久化存储、多模态文件附件及结构化业务数据上传能力。系统核心扩展了与iBiz平台深度绑定的领域特定语言（DSL）构建引擎，可基于用户需求动态生成平台配置脚本，同时集成智能模型解析技术，自动生成可视化架构看板，有效降低用户学习曲线，助力开发者快速掌握iBiz平台的领域驱动设计体系。

## 📂 项目结构

```javascript
├─ src
│  ├─ components
│  │  ├─ chat-back-bottom                           回到底部按钮
│  │  ├─ chat-container                             对话框容器
│  │  ├─ chat-input                                 对话框输入框
│  │  ├─ chat-input-material                        上传的素材（文件、实体资料）
│  │  ├─ chat-input-material-item                   上传的素材项
│  │  ├─ chat-message-item                          对话消息项
│  │  ├─ chat-messages                              对话消息列表
│  │  ├─ chat-minimize                              最小化按钮
│  │  ├─ chat-search                                搜索话题组件
│  │  ├─ chat-thought-chain                         思维链组件
│  │  ├─ chat-toolbar                               消息工具栏
│  │  ├─ chat-topic-item                            话题项
│  │  ├─ chat-topics                                话题列表
│  │  ├─ index.ts
│  │  └─ popup                                      气泡弹框组件
│  ├─ constants
│  │  └─ index.ts                                   常量
│  ├─ controller
│  │  ├─ ai-chat                                    ai聊天控制器
│  │  ├─ ai-material                                ai素材控制器
│  │  ├─ ai-topic                                   ai话题控制器
│  │  ├─ chat                                       ai控制器
│  │  └─ index.ts
│  ├─ entity
│  │  ├─ chart-material                             聊天素材实体接口
│  │  ├─ chart-topic                                聊天话题实体接口
│  │  ├─ chart-message                              聊天消息实体接口
│  │  ├─ chart-suggestion                           聊天建议实体接口
│  │  └─ index.ts
│  ├─ global.ts
│  ├─ icons                                         图标包
│  ├─ index.scss
│  ├─ index.ts
│  ├─ interface                                     接口包
│  ├─ main.tsx
│  └─ utils                                         工具包
```

## 📦 开发

1. 安装依赖

进入@ibiz-template-plugin/ai-chat工作空间后，执行以下命令安装依赖：

```bash
pnpm i
```

1. 启动开发环境

进入@ibiz-template-plugin/ai-chat工作空间后，执行以下命令启动开发环境：

```bash
pnpm build:watch
```

3. 将@ibiz-template-plugin/ai-chat包链接到全局

等待开发环境启动完成后，将@ibiz-template-plugin/ai-chat包添加pnpm link到全局：

```bash
pnpm link --global
```

4. 链接依赖项目

在依赖此包的项目工作空间中，安装依赖后执行以下命令link插件包

```bash
pnpm link --global "@ibiz-template-plugin/ai-chat"
```
npm package: @ibiz-template-plugin/antv-x6-design
Description: ibiz full-dynamic-vue 模板项目扩展插件示例
Author: chitanda
Latest version: 0.0.1-dev.1

# VueR9 模板插件示例

`此示例为 VueR9 全动模板插件编写示例。包含 .vue、.tsx 写法，并已配置好打包模式。可直接发布至 npm 或者 system 模式引用。`

## 本地启动

```typescript
// 安装依赖，在项目根目录执行
pnpm i
// 本地开发
pnpm dev
```

## 生产打包

```typescript
pnpm build
```

## 本地开发外部引用

`切记只可本地开发引用，线上插件模式还是使用 system 模式`

> 插件项目

```shell
# 将本地项目设置为可外部依赖
pnpm link --global
```

> 模板主项目

```shell
# 将本地项目设置为可外部依赖
pnpm link --global "[组件包名称]"
```

> 在项目中按照标准 vue 插件引入即可。

```typescript
import { VueConstructor } from 'vue';

export default {
  install(v: VueConstructor) {
    ibiz.plugin.setDevPlugin('[组件包名称]', () => import('[组件包名称]'));
  },
};

```

## 引用静态资源文件

1. 创建global.ts文件

`文件路径: [项目根目录]/src/global.ts`

```typescript
import { PluginStaticResource } from '@ibiz-template/runtime';

const resource = new PluginStaticResource(import.meta.url);

export { resource };
```

2. index.ts入口文件第一行引入global.ts

`文件路径: [项目根目录]/src/index.ts`

```typescript
import './global';
```

3. 组件内导入global.ts的resource方法, 通过resource.dir方法引用静态资源文件

`静态资源目录路径：[项目根目录]/public`

```tsx
// 例：[项目根目录]/public/assets/img/xxx.svg
// 组件内引用方式

<img src={resource.dir('/assets/img/xxx.svg')} />
```
npm package: @ibiz-template-plugin/cron-editor
Description: cron表达式编辑器
Author: chitanda
Latest version: 0.1.8-alpha.274

# cron表达式编辑器

该插件基于多行输入框增强，主要用于提供Cron表达式编辑与生成，用来定义任务在特定时间或时间间隔执行的规则。**该插件隶属于编辑器自定义绘制插件（基于多行输入框进行扩展）**


## 页面展示

![image](./public/assets/images/scene.png)


## 功能说明

- 可编辑Cron表达式

- 可在Cron表达式弹框中切换中英文显示


## 附录

### cron表达式编辑器插件

```json
[
  {
    "plugintype": "EDITOR_CUSTOMSTYLE",
    "rtobjectrepo": "@ibiz-template-plugins/cron-editor@0.0.1-dev.4",
    "codename": "UsrPFPlugin0119886509",
    "plugintag": "CronEditor",
    "rtobjectmode": 2,
    "rtobjectname": "IBizCronEditor",
    "pssyspfpluginname": "cron表达式编辑器"
  }
]
```

### 编辑器样式

```json
[
  {
    "codename": "CronEditor",
    "pssyspfpluginid": "UsrPFPlugin0119886509",
    "repdefault": 0,
    "validflag": 1,
    "pssyseditorstylename": "cron表达式编辑器",
    "pseditortypeid": "TEXTAREA"
  }
]
```
npm package: @ibiz-template-plugin/data-view
Description: iBiz 数据大屏，基于iBiz标准门户部件扩展，提供动态数据展示、多样化可视化组件（表格/翻牌器/水位图等）、自定义装饰元素（边框/粒子特效）以及交互式功能（标签墙/按钮系统）的完整大屏解决方案。
Author: iBiz
Latest version: 0.0.6

# @ibiz-template-plugin/data-view

iBiz数据大屏插件，提供以下核心功能模块：

- 动态数据表格：支持实时滚动、分页和高亮显示
- 数字翻牌器：流畅的数字动画效果，支持多种格式展示
- 数据看板容器：灵活的面板布局系统，支持响应式设计
- 百分比进度条：指示光标
- 水位图：3D立体效果
- 单选列表框：支持滚动选中
- 装饰元素：
  - 可定制边框样式（多种预设+自定义SVG）
  - 动态装饰器（粒子效果、流光效果）
- 标签墙：动态词云效果，支持点击交互
- 自定义按钮系统：多种按钮样式


## 目录结构

```javascript
├─ src
│  ├─ carousel-grid                             滚动表格
│  ├─ carousel-list                             滚动表格
│  ├─ custom-border                             自定义边框样式（1-13）
│  ├─ custom-button                             自定义按钮样式（1-6）
│  ├─ custom-decoration                         自定义装饰器样式（1-6，11）
│  ├─ custom-search-box                         搜索框
│  ├─ digital-flop                              数字翻牌器
│  ├─ index.ts
│  ├─ percent-pond                              百分比进度条
│  ├─ screen-dashboard                          大屏数据看板
│  ├─ screen-panel-container                    大屏面板容器
│  ├─ screen-portlet                            大屏门户部件
│  ├─ screen-portlet-real-time                  大屏门户实时时间
│  ├─ screen-radio-list                         大屏单选列表框
│  ├─ screen-real-time                          大屏实时时间
│  ├─ tagged-wall                               标签墙
│  ├─ util                                      工具类 
│  └─ water-level-pond                          水位进度条
```

## 开发

1. 安装依赖

进入@ibiz-template-plugin/data-view工作空间后，执行以下命令安装依赖：

```bash
pnpm i
```

1. 启动开发环境

进入@ibiz-template-plugin/data-view工作空间后，执行以下命令启动开发环境：

```bash
pnpm dev
```

3. 将@ibiz-template-plugin/data-view包链接到全局

等待开发环境启动完成后，将@ibiz-template-plugin/data-view包添加pnpm link到全局：

```bash
pnpm link --global
```

4. 链接依赖项目

在依赖此包的项目工作空间中，安装依赖后执行以下命令link插件包

```bash
pnpm link --global "@ibiz-template-plugin/data-view"
```
npm package: @ibiz-template-plugin/ibiz-mob-ai-chat
Description: iBiz 移动端AI交互框插件
Author: iBiz
Latest version: 0.0.5

# @ibiz-template-plugin/ai-chat

一款深度集成于iBiz设计平台的AI智能辅助插件，提供基于自然语言交互的智能问答服务，支持实时消息列表管理、会话历史持久化存储、多模态文件附件及结构化业务数据上传能力。系统核心扩展了与iBiz平台深度绑定的领域特定语言（DSL）构建引擎，可基于用户需求动态生成平台配置脚本，同时集成智能模型解析技术，自动生成可视化架构看板，有效降低用户学习曲线，助力开发者快速掌握iBiz平台的领域驱动设计体系。

## 📂 项目结构

```javascript
├─ src
│  ├─ components
│  │  ├─ chat-back-bottom                           回到底部按钮
│  │  ├─ chat-container                             对话框容器
│  │  ├─ chat-input                                 对话框输入框
│  │  ├─ chat-input-material                        上传的素材（文件、实体资料）
│  │  ├─ chat-input-material-item                   上传的素材项
│  │  ├─ chat-message-item                          对话消息项
│  │  ├─ chat-messages                              对话消息列表
│  │  ├─ chat-minimize                              最小化按钮
│  │  ├─ chat-search                                搜索话题组件
│  │  ├─ chat-thought-chain                         思维链组件
│  │  ├─ chat-toolbar                               消息工具栏
│  │  ├─ chat-topic-item                            话题项
│  │  ├─ chat-topics                                话题列表
│  │  ├─ index.ts
│  │  └─ popup                                      气泡弹框组件
│  ├─ constants
│  │  └─ index.ts                                   常量
│  ├─ controller
│  │  ├─ ai-chat                                    ai聊天控制器
│  │  ├─ ai-material                                ai素材控制器
│  │  ├─ ai-topic                                   ai话题控制器
│  │  ├─ chat                                       ai控制器
│  │  └─ index.ts
│  ├─ entity
│  │  ├─ chart-material                             聊天素材实体接口
│  │  ├─ chart-topic                                聊天话题实体接口
│  │  ├─ chart-message                              聊天消息实体接口
│  │  ├─ chart-suggestion                           聊天建议实体接口
│  │  └─ index.ts
│  ├─ global.ts
│  ├─ icons                                         图标包
│  ├─ index.scss
│  ├─ index.ts
│  ├─ interface                                     接口包
│  ├─ main.tsx
│  └─ utils                                         工具包
```

## 📦 开发

1. 安装依赖

进入@ibiz-template-plugin/ai-chat工作空间后，执行以下命令安装依赖：

```bash
pnpm i
```

1. 启动开发环境

进入@ibiz-template-plugin/ai-chat工作空间后，执行以下命令启动开发环境：

```bash
pnpm build:watch
```

3. 将@ibiz-template-plugin/ai-chat包链接到全局

等待开发环境启动完成后，将@ibiz-template-plugin/ai-chat包添加pnpm link到全局：

```bash
pnpm link --global
```

4. 链接依赖项目

在依赖此包的项目工作空间中，安装依赖后执行以下命令link插件包

```bash
pnpm link --global "@ibiz-template-plugin/ai-chat"
```
npm package: @ibiz-template-plugin/sy-pms
Description: ibiz full-dynamic-vue 模板项目扩展插件示例
Author: chitanda
Latest version: 0.0.1

# VueR9 模板插件示例

`此示例为 VueR9 全动模板插件编写示例。包含 .vue、.tsx 写法，并已配置好打包模式。可直接发布至 npm 或者 system 模式引用。`

## 本地启动

```typescript
// 安装依赖，在项目根目录执行
pnpm i
// 本地开发
pnpm dev
```

## 生产打包

```typescript
pnpm build
```

## 本地开发外部引用

`切记只可本地开发引用，线上插件模式还是使用 system 模式`

> 插件项目

```shell
# 将本地项目设置为可外部依赖
pnpm link --global
```

> 模板主项目

```shell
# 将本地项目设置为可外部依赖
pnpm link --global "ibiz-sy-r9-plugin"
```

> 在项目中按照标准 vue 插件引入即可。

```typescript
import { VueConstructor } from 'vue';
import Plugin from 'ibiz-r9-plugin';

export default {
  install(v: VueConstructor) {
    v.use(Plugin);
  },
};

```
npm package: @ibiz-template/cli
Description: cli 终端
Author: iBiz
Latest version: 0.3.32

# @ibiz-template/cli

提供命令行工具，支持对项目中的插件进行高效计算、快速下载、生成文档和自动化打包操作，显著提升插件开发效率和工作流程。

## 📂 项目结构

```javascript
cli
├── src
│   ├── bin.ts                                      入口文件
│   ├── commands
│   │   ├── build                                   build指令
│   │   ├── compute-pkg                             计算插件包指令
│   │   ├── download-pkg                            下载插件包指令
│   │   ├── generate-doc                            生成插件包指令
│   │   └── index.ts
│   ├── exports.ts                                  导出文件
│   ├── index.ts
│   ├── interface                                   接口
│   └── utils                                       工具包
└── test                                            测试包

```

## 📦 使用

安装依赖

```
pnpm add @ibiz-template/cli
```

注册脚本指令

```
"scripts": {
    "build": "ibiz-temp build",
    "compute-pkg": "ibiz-temp compute-pkg -m /root/app-model --app app-name",
    "download-pkg": "ibiz-temp download-pkg",
    "generate-pkg": "ibiz-temp generate-pkg",
},
```

执行脚本指令

```
// 打包
pnpm build
// 计算插件包
pnpm compute-pkg
// download下载插件包，需先执行compute-pkg
pnpm download-pkg
// generate生成插件包文档，需先执行compute-pkg
pnpm generate-pkg
```

## 📌 更改日志

每个版本的详细更改记录在[发行说明](CHANGELOG.md)中。

## 📜 许可证

[MIT](LICENSE)
npm package: @ibiz-template/cli-core
Description: CLI核心逻辑包
Author: iBiz
Latest version: 0.3.32

# @ibiz-template/cli-core

提供 ibiz-temp 指令的核心实现，支持项目插件的高效计算、快速下载与自动化打包、生成文档，显著提升插件开发效率和优化工作流程。

## 📂 项目结构

```javascript
cli-core
├── src
│   ├── build                                   打包指令逻辑实现
│   ├── compute-pkg                             计算插件包指令逻辑实现
│   ├── config                                  配置       
│   ├── constant                                常量
│   ├── define-config.ts                        生成配置
│   ├── download-pkg                            下载插件包指令逻辑实现
│   ├── generate-doc                            生成插件文档指令逻辑实现
│   ├── index.ts
│   ├── interface                               接口
│   ├── rollup                                  rollup函数包
│   ├── rollup-plugins                          rollup插件包
│   ├── types.d.ts
│   └── util                                    工具包

```

## 📦 使用

安装

```
pnpm add @ibiz-template/cli-core
```

导入并使用

```
import { CompilerCommandOptions, build, computePkg, downloadPkg, generateDoc } from '@ibiz-template/cli-core';

async action(options: CompilerCommandOptions): Promise<void> {
    build(options);
}
    
async action(options: { model: string; app: string }): Promise<void> {
    if (!options.model) {
      throw new Error(`未配置模型目录 -m 或 --model`);
    }
    if (!options.app) {
      throw new Error(`未配置应用名称 --app`);
    }
    
}

async action(options: { config: string }): Promise<void> {
    downloadPkg(options.config);
}

async action(options: { config: string }): Promise<void> {
    generateDoc(options.config);
}
```

## 📌 更改日志

每个版本的详细更改记录在[发行说明](CHANGELOG.md)中。

## 📜 许可证

[MIT](LICENSE)
npm package: @ibiz-template/devtool
Description: IBiz系统可视化调试套件
Author: iBiz
Latest version: 0.0.14

# @ibiz-template/devtool

IBiz系统可视化调试套件，集成开发态建模数据实时查看、运行时状态分析、组件交互调试能力，支持快速定位页面元素与数据模型映射关系，提升开发效率。

## 📂 项目结构

```javascript
├── src
│   ├── components
│   │   ├── detail-info                                     详情信息组件                              
│   │   ├── global-toolbar                                  顶部工具栏组件
│   │   ├── index-page                                      工具壳组件
│   │   ├── index.ts
│   │   ├── object-viewer                                   拷贝组件
│   │   ├── user-config-edit                                用户配置组件
│   │   ├── view-list                                       视图列表组件
│   │   └── view-model-viewer                               视图模型组件
│   ├── controller
│   │   ├── center.controller.ts                            控制中心
│   │   └── dev-tool-config.ts                              开发工具配置文件
│   ├── index.ts
│   ├── interface
│   │   └── i-center-controller-state.ts                    控制器中心状态
│   └── style
│       └── index.scss                                      开发工具样式
```

## 📦 开发

1. 安装依赖

进入@ibiz-template/devtool工作空间后，执行以下命令安装依赖：

```bash
pnpm i
```

2. 运行项目

进入@ibiz-template/devtool工作空间后，执行以下命令启动开发环境：

```bash
pnpm dev
```

3. 将@ibiz-template/devtool包链接到全局

等待开发环境启动完成后，将@ibiz-template/devtool包添加pnpm link到全局：

```bash
pnpm link --global
```

4. 链接依赖项目

在依赖此包的项目工作空间中，安装依赖后执行以下命令link插件包

```bash
pnpm link --global "@ibiz-template/devtool"
```
npm package: @ibiz-template/full-code-generator
Description: 全代码生成器命令行界面，通过publish命令发布npm模板包，generate命令基于npm模板包生成代码
Author: ibiz
Latest version: 0.0.10

# 使用

1.全局安装这个包

```
// pc端
npm install -g @ibiz-template/full-code-generator
// 移动端
npm install -g @ibiz-template/mob-full-code-generator
```

2.去全代码模版仓库根目录执行命令,发布新版模板包（发布模板包使用）

```
publish -p .
```

- --mob：是否是移动端发布

3.在工作目录执行generate命令,生成代码（发布代码使用）

```
generate -m ./plm-core/src/main/resources/model/cn/ibizlab/plm -o ./web-test --app plmweb -tv 0.0.1
```
- -m: 指定模型目录
- -o: 指定输出目录
- -app： 指定发布的应用名称
- -tv: 指定使用的@ibiz-template/full-code-templat版本，每次发布会全局安装这个版本的模版包，使用它里面的资源发布
- --mob：是否是移动端生成
npm package: @ibiz-template/scss-utils
Description: scss BEM 规范工具包
Author: chitanda
Latest version: 0.0.2

# SCSS BEM 规范工具包

## 样式规范

名称使用 BEM 规范。在 ts 中书写样式使用 useNamespace 工具方法，不可以直接在 class 中写样式。在 scss 中使用 scss 中提供的全局方法，不可已直接写组件中的样式。

## BEM 命名规范

BEM 的意思就是块（block）、元素（element）、修饰符（modifier），是由 Yandex 团队提出的一种前端命名方法论。这种巧妙的命名方法让你的 CSS 类对其他开发者来说更加透明而且更有意义。BEM 命名约定更加严格，而且包含更多的信息，它们用于一个团队开发一个耗时的大项目。

### 说明

```css
.block {/* 块 */}
.block__element {/* 元素 */}
.block__element--modifier {/* 修饰符 */}
```

### <span style="color: #F5222D;">\_\_</span> 与 <span style="color: #F5222D;">--</span> 的区别

- <span style="color: #F5222D;">\_\_</span> 表示的是下级元素
- <span style="color: #F5222D;">--</span> 表示元素的不同状态

## 代码中使用

### 在 ts 中使用 BEM

在全局提供了 `useNamespace` 方法，只需在组件实例化时使用此方法构造 `ns` 输出对象即可。

```ts
const ns = useNamespace('layout');

// bem class 命名
ns.b()                              => 'ibiz-layout'
ns.b('header')                      => 'ibiz-layout-header'
ns.e('header')                      => 'ibiz-layout__header'
ns.m('hover')                       => 'ibiz-layout--hover'
ns.be('header', 'title')            => 'ibiz-layout-header__title'
ns.em('title', 'hover')             => 'ibiz-layout__title--hover'
ns.bm('header', 'hover')            => 'ibiz-layout-header--hover'
ns.bem('header', 'title', 'hover')  => 'ibiz-layout-header__title--hover'
// 状态 class 样式命名
ns.is('loading', false)             => ''
ns.is('loading', true)              => 'is-loading'
// css 变量 style 对象
ns.cssVar({ 'color': 'red' })       => { '--ibiz-color': 'red' }
ns.cssVarBlock({ 'color': 'red' })  => { '--ibiz-layout-color': 'red' }
// css var 变量名称拼接
ns.cssVarName('color')              => '--ibiz-color'
ns.cssVarBlockName('color')         => '--ibiz-layout-color'
```

### 在 scss 中使用 BEM

```scss
/**
.ibiz-layout { font-size: 14px; }
*/
@include b('layout') {
  font-size: 14px;
}

/**
.ibiz-layout { font-size: 14px; }
.ibiz-layout__header { font-size: 14px; }
*/
@include b('layout') {
  font-size: 14px;

  @include e('header') {
    font-size: 14px;
  }
}

/**
.ibiz-layout { font-size: 14px; }
.ibiz-layout__header { font-size: 14px; }
.ibiz-layout__header--hover { color: red; }
*/
@include b('layout') {
  font-size: 14px;

  @include e('header') {
    font-size: 14px;

    @include m('hover') {
      color: red;
    }
  }
}

/**
.ibiz-layout .is-loading { display: block; }
*/
@include b('layout') {

  @include when('loading') {
    display: block;
  }
}
```

`注意 scss 在编译后，上边写法是不会出现嵌套的。如需嵌套需要使用下边的方式`

```scss
/**
.ibiz-layout .ibiz-block__element--modifier { display: block; }
*/
@include b('layout') {

  #{bem('block', 'element', 'modifier')} {
    display: block;
  }
}
```

### 在 scss 使用 css 变量

```scss
#{joinVarName(('button', 'text-color'))}                 => '--ibiz-button-text-color'

#{getCssVarName('button', 'text-color')}                 => '--ibiz-button-text-color'

#{getCssVar('button', 'text-color')}                     => var(--ibiz-button-text-color)

#{getCssVarWithDefault(('button', 'text-color'), red)}   => var(--ibiz-button-text-color, red)
```
npm package: @ibiz-template/theme
Description: 样式功能库
Author: iBiz
Latest version: 0.7.39

# @ibiz-template/theme

基于scss，定义样式的全局变量、scss函数指令、scss混合指令等，定义UI层的样式书写规范。

## 📂 项目结构

```javascript
|──  theme
    ├── style                                                               样式文件夹
       ├── global.scss                                                      导出样式
       ├── settings     		
       │   ├── config.scss  	                                            样式配置
       │   └── var.scss			                                            样式规范
       └── tools
           ├── css-var.scss		                                            scss变量
           ├── function.scss                                                scss函数
           ├── mixin.scss   	                                            scss混合
           └── utils.scss   	                                            scss工具
```

## 📜 许可证

[MIT](LICENSE)
npm package: @ibiz-template/vue3-full-generate
Description: vue3全代码模版项目代码生成器
Author: ibiz
Latest version: 0.0.2

# 使用

全局安装这个包

去全代码模版仓库根目录执行命令,发布新版的@ibiz-template/vue3-full-template包

```
publish -p .
```

在模型仓库目录执行generate命令,生成代码

```
generate -m ./plm-core/src/main/resources/model/cn/ibizlab/plm -o ./web-test --app plmweb -tv 0.0.1
```
- -m: 指定模型目录
- -o: 指定输出目录
- -app： 指定发布的应用名称
- -tv: 指定使用的@ibiz-template/vue3-full-template版本，每次发布会全局安装这个版本的模版包，使用它里面的资源发布
npm package: @ibiz/cli
Description: 埃必致内部命令行工具
Author: chitanda
Latest version: 0.2.8

# iBiz命令行工具

## 目录说明

```text
|-- actions                与命令匹配的对应处理行为
|-- bin                    入口目录
|-- commands               命令声明与命令注册
|-- core                   核心包，基本工具类与接口
|-- tools                  工具包
|   `-- gulp               打包清理gulp插件
|-- LICENSE
|-- README.md
|-- gulpfile.js
|-- package.json
|-- tsconfig.json
`-- yarn.lock
```

## 本地开发
```base
// 在项目根目录
yarn

// 启动项目
yarn dev

// 本地全局安装，成功后可在命令行任意目录使用
npm link
```

## 扩展

#### 1. 新增命令

1. 以新增link命令为例

2. 在commands目录下新建需要新增的命令link/link.ts文件。

3. link命令类继承CommandBase类

    ```typescript
    export class LinkCommand extends CommandBase { }
    ```

4. 实现抽象方法load，用于注册命令
    ```typescript
    protected load(program: CommanderStatic): void {
        program
        .command('link')
        .arguments('<source> <target>')
        .description('建立软链接', {
            source: '需要链接的「文件、文件夹」',
            target: '链接至的目标目录',
        })
        .usage('<source> <target>')
        .option('-f, --force', '当指向的目标文件存在时，删除原有[文件 or 文件夹]并建立软链接!')
        .action(async (source: string, target: string, options: Record<string, string | boolean>, _command: Command) => {
            const input: Input = {};
            input.source = { name: 'source', value: source };
            input.target = { name: 'target', value: target };
            const opts: Input = {};
            opts.force = { name: 'force', value: options.force };
            try {
            await this.action.handle(input, opts);
            } catch (err) {
            if (isError(err)) {
                log.error('', err.message);
                process.exit(10);
            } else {
                process.exit(0);
            }
            }
        });
    }
    ```

5. 在commands/loader/loader.ts的load方法中进行命令注册
    ```typescript
    public static load(program: CommanderStatic): void {
        new LinkCommand(program);
        new LinkModelCommand(program);
        this.handleInvalidCommand(program);
    }
    ```

6. 实现getAction抽象方法注册行为。

#### 2. 补充命令处理行为

1. 补充link的处理行为

2. 在actions目录下新建link/link.ts行为处理文件

3. link行为处理继承ActionBase

    ```typescript
    export class LinkAction extends ActionBase
    ```

4. 实现handle抽象方法，用于处理命令。

    ```typescript
    async handle(input: Input, options: Input, _extraFlags?: string[]): Promise<void> {
        const { source, target } = input;
        const { force } = options;
        linkDir(source.value, target.value, force.value);
    }
    ```
npm package: @ibiz/context-menu
Description: 右键菜单组件
Latest version: 0.1.0

## 通用型右键菜单组件

#### 配置参数

| 新增配置参数 |     参数     |             参数说明             | 默认值 |
| :----------: | :----------: | :------------------------------: | :----: |
|    zIndex    |     数值     |         设置菜单显示层级         |  1000  |
|   minWidth   |     数值     |         设置菜单最小宽度         |  230   |
| subOpenType  | hover、click | hover: 悬浮展开、click: 点击展开 | hover  |

#### 注册组件

```typescript
import { applyPolyfills, defineCustomElements } from '@ibiz/context-menu/dist/loader';

applyPolyfills().then(() => defineCustomElements(window));
```

#### 基本用法

```typescript
// 全局提供 contextMenu 控制器：
import { contextMenu } from '@ibiz/context-menu';

// 示例菜单
const menus: ContextMenuItem[] = [
  {
    text: '返回(B)',
    textRight: 'CTRL + B',
  },
  {
    text: '前进(F)',
    disable: true,
  },
  {
    text: '重新加载(R)',
  },
  {
    type: 'separator',
  },
  {
    text: '另存为(A)',
  },
  {
    text: '打印(P)',
  },
  {
    text: '投射(C)',
  },
  {
    type: 'separator',
  },
  {
    text: '使用网页翻译(T)',
    children: [
      {
        text: '中文',
      },
      {
        text: '英文',
      },
    ],
  },
  {
    type: 'separator',
  },
  {
    text: '关闭',
  },
];

// 右击事件触发
function contextMenu(e: MouseEvent): void {
  contextMenu
    // 打开右键菜单
    .open(e, this.menus)
    // 点击菜单项后回调
    .click((item: ContextMenuItem) => {
      console.log(item);
    });
}
```