misskey-awawa/packages/misskey-js
Acid Chicken (硫酸鶏) 38d0b62167
build(#10336): Storybook & Chromatic & msw (#10365)
* build(#10336): init

* fix(#10336): invalid name conversion

* build(#10336): load locales and vite config

* refactor(#10336): remove unused imports

* build(#10336): separate definitions and generated codes

* refactor(#10336): remove hatches

* refactor(#10336): module semantics

* refactor(#10336): remove unused common preferences

* fix: typo

* build(#10336): mock assets

* build(#10336): impl `SatisfiesExpression`

* build(#10336): control themes

* refactor(#10336): semantics

* build(#10336): make .storybook as an individual TypeScript project

* style(#10336): use single quote

* build(#10336): avoid intrinsic component names

* chore: suppress linter

* style: typing

* build(#10336): update dependencies

* docs: note about Storybook

* build(#10336): sync

* build(#10336): full reload server on change

* chore: use defaultStore instead

* build(#10336): show popups on Story

* refactor(#10336): remove redundant div

* docs: fix

* build(#10336): interactions

* build(#10336): add an interaction test for `<MkA/>`

* build(#10336): bump storybook

* docs(#10336): mention to pre-build misskey-js

* build(#10336): write stories for `MkAcct`

* build(#10336): write stories for `MkAd`

* build(#10336): fix missing type definition

* build(#10336): use `toHaveTextContent`

* build(#10336): write some stories

* build(#10336): hide internal args

* build(#10336): generate `components/global` stories only

* build(#10336): write stories for `MkMisskeyFlavoredMarkdown`

* fix: conflict errors

* build(#10336): subcomponents on sidebar

* refactor: restore `SatisfiesExpression`

* docs(#10336): note development status

* build(#10336): use chokidar-cli

* docs(#10336): note chokidar-cli mode

* chore(#10336): untrack generated stories files

* fix: pointer handling

* build(#10336): finalize

* chore: add static option to `MkLoading`

* refactor(#10336): bind to local args

* fix: missing case

* revert: restore `SatisfiesExpression`

This reverts commit f246699f38.

* build(#10336): make storybook buildable

* build(#10336): staticify assets

* build(#10336): staticified directory structure

* build(#10336): normalize path for Windows

* ci(#10336): create actions

* build(#10336): ignore tsc errors

* build(#10336): ignore tsc errors

* build(#10336): missing dependencies

* build(#10336): missing dependencies

* build(#10336): use fast-glob

* fix: invalid lockfile

* ci(#10336): increase heap size

* build(#10336): use unpkg for storybook tabler icons

* build(#10336): use unpkg for storybook twemojis

* build(#10336): disable `ProfilePageCat`

* build(#10336): blur `MkA` before interaction ends

* ci(#10336): stabilize

* ci(#10336): fetch-depth

* build(#10336): isChromatic

* ci(#10336): notify on changes

* ci(#10336): fix typo

* ci(#10336): missing working directory

* ci(#10336): skip build

* ci(#10336): fix path

* build(#10336): fails on Windows

* build(#10336): available on Windows

* ci(#10336): disable animation on chromatic

* ci(#10336): add static option to `PageHeader.tabs`

* chore: void

* ci(#10336): change parameters

* docs(#10336): update CONTRIBUTING

* docs(#10336): note about meta overriding and etc.

* ci(#10336): use Chromatic for checks

* ci(#10336): use `pull_request` instead of `pull_request_target` for now

* ci(#10336): use `exitOnceUploaded`

* ci(#10336): reuse built storybook

* ci(#10336): back to `pull_request_target`

* chore: unused dependencies

* style(#10336): reduce prettier indents

* style: note about `TSSatisfiesExpression`
2023-04-04 09:38:34 +09:00
..
docs chore: integrate misskey-js as a workspace item (git subtree) (#10409) 2023-03-30 09:33:19 +09:00
etc chore: integrate misskey-js as a workspace item (git subtree) (#10409) 2023-03-30 09:33:19 +09:00
src refactor: remove autobind-decorator dep 2023-03-31 16:41:27 +09:00
test specify .js 2023-03-30 13:49:56 +09:00
test-d chore: integrate misskey-js as a workspace item (git subtree) (#10409) 2023-03-30 09:33:19 +09:00
.eslintignore chore: integrate misskey-js as a workspace item (git subtree) (#10409) 2023-03-30 09:33:19 +09:00
.eslintrc.cjs tweak misskey-js eslintrc 2023-03-31 09:18:58 +09:00
.swcrc tweak misskey-js config 2023-03-30 13:46:25 +09:00
CONTRIBUTING.md chore: integrate misskey-js as a workspace item (git subtree) (#10409) 2023-03-30 09:33:19 +09:00
LICENSE chore: integrate misskey-js as a workspace item (git subtree) (#10409) 2023-03-30 09:33:19 +09:00
README.md chore: integrate misskey-js as a workspace item (git subtree) (#10409) 2023-03-30 09:33:19 +09:00
api-extractor.json chore: integrate misskey-js as a workspace item (git subtree) (#10409) 2023-03-30 09:33:19 +09:00
jest.config.cjs tweak misskey-js config 2023-03-30 13:46:25 +09:00
package.json build(#10336): Storybook & Chromatic & msw (#10365) 2023-04-04 09:38:34 +09:00
tsconfig.json fix misskey-js/tsconfig.json (add dom lib) 2023-03-30 12:52:51 +00:00

README.md

misskey.js

Strongly-typed official Misskey SDK for browsers/Node.js.

Test codecov

NPM

JavaScript(TypeScript)用の公式MisskeySDKです。ブラウザ/Node.js上で動作します。

以下が提供されています:

  • ユーザー認証
  • APIリクエスト
  • ストリーミング
  • ユーティリティ関数
  • Misskeyの各種型定義

対応するMisskeyのバージョンは12以上です。

Install

npm i misskey-js

Usage

インポートは以下のようにまとめて行うと便利です。

import * as Misskey from 'misskey-js';

便宜上、以後のコード例は上記のように* as Misskeyとしてインポートしている前提のものになります。

ただし、このインポート方法だとTree-Shakingできなくなるので、コードサイズが重要なユースケースでは以下のような個別インポートをお勧めします。

import { api as misskeyApi } from 'misskey-js';

Authenticate

todo

API request

APIを利用する際は、利用するサーバーの情報とアクセストークンを与えてAPIClientクラスのインスタンスを初期化し、そのインスタンスのrequestメソッドを呼び出してリクエストを行います。

const cli = new Misskey.api.APIClient({
	origin: 'https://misskey.test',
	credential: 'TOKEN',
});

const meta = await cli.request('meta', { detail: true });

requestの第一引数には呼び出すエンドポイント名、第二引数にはパラメータオブジェクトを渡します。レスポンスはPromiseとして返ります。

Streaming

misskey.jsのストリーミングでは、二つのクラスが提供されます。 ひとつは、ストリーミングのコネクション自体を司るStreamクラスと、もうひとつはストリーミング上のチャンネルの概念を表すChannelクラスです。 ストリーミングを利用する際は、まずStreamクラスのインスタンスを初期化し、その後でStreamインスタンスのメソッドを利用してChannelクラスのインスタンスを取得する形になります。

const stream = new Misskey.Stream('https://misskey.test', { token: 'TOKEN' });
const mainChannel = stream.useChannel('main');
mainChannel.on('notification', notification => {
	console.log('notification received', notification);
});

コネクションが途切れても自動で再接続されます。

チャンネルへの接続

チャンネルへの接続はStreamクラスのuseChannelメソッドを使用します。

パラメータなし

const stream = new Misskey.Stream('https://misskey.test', { token: 'TOKEN' });

const mainChannel = stream.useChannel('main');

パラメータあり

const stream = new Misskey.Stream('https://misskey.test', { token: 'TOKEN' });

const messagingChannel = stream.useChannel('messaging', {
	otherparty: 'xxxxxxxxxx',
});

チャンネルから切断

Channelクラスのdisposeメソッドを呼び出します。

const stream = new Misskey.Stream('https://misskey.test', { token: 'TOKEN' });

const mainChannel = stream.useChannel('main');

mainChannel.dispose();

メッセージの受信

ChannelクラスはEventEmitterを継承しており、メッセージがサーバーから受信されると受け取ったイベント名でペイロードをemitします。

const stream = new Misskey.Stream('https://misskey.test', { token: 'TOKEN' });
const mainChannel = stream.useChannel('main');
mainChannel.on('notification', notification => {
	console.log('notification received', notification);
});

メッセージの送信

Channelクラスのsendメソッドを使用してメッセージをサーバーに送信することができます。

const stream = new Misskey.Stream('https://misskey.test', { token: 'TOKEN' });
const messagingChannel = stream.useChannel('messaging', {
	otherparty: 'xxxxxxxxxx',
});

messagingChannel.send('read', {
	id: 'xxxxxxxxxx'
});

コネクション確立イベント

Streamクラスの_connected_イベントが利用可能です。

const stream = new Misskey.Stream('https://misskey.test', { token: 'TOKEN' });
stream.on('_connected_', () => {
	console.log('connected');
});

コネクション切断イベント

Streamクラスの_disconnected_イベントが利用可能です。

const stream = new Misskey.Stream('https://misskey.test', { token: 'TOKEN' });
stream.on('_disconnected_', () => {
	console.log('disconnected');
});

コネクションの状態

Streamクラスのstateプロパティで確認できます。

  • initializing: 接続確立前
  • connected: 接続完了
  • reconnecting: 再接続中