psycheダウンロード - psycheソースコードのダウンロード

psyche

その他のソースコード

v0.3.4

ダウンロード

？サイケ

Psycheは、AlgoliaのDocsearchに触発されたドキュメントを検索するためのドロップインソリューションです。

使用するのは素晴らしいと感じています。
検索は速く、正確で、タイプミスの耐性です。
静的またはサーバーで生成されたドキュメントWebサイトに含めることができます。
キーボードナビゲーション可能なサイトマップとしても機能します。
これにより、サイト全体のプラットフォーム依存ホットキーを簡単に登録します。
モバイルに優しいです。
明るいモードと暗いモードの両方をサポートします。

ライブデモについては、Notion-Enhancerドキュメントをご覧ください。

警告： Psycheは、ドキュメントを検索するために特別に構築されています。他のインターフェイス（たとえばeコマース）に実装するために構築されたり、カスタムデータスキームで使用したりしません。

はじめる

インデックスの生成

Psycheクライアントは、検索に事前に生成された結果のインデックスを必要とします。これは、 Resultレコードの配列である必要があります（Type.D.TSを参照）。インデックスはプログラムでクライアントに提供されますが、フォーメット/模倣された.jsonファイルの形式を取得する必要があります。

インデクサーは、ビルドプロセス中に、またはサイトが動的に提供されている場合は、サイトをクロールしてインデックスを生成するプラグイン/ミドルウェアです。

一部のドキュメントジェネレーターのインデクサーを以下に示します。選択したジェネレーターがまだサポートされていない場合は、機能要求を開いたり、独自の要求を書き、プルリクエストを開きます。

ルメ

_config.tsファイルに以下を追加します。

 import psyche from 'https://deno.land/x/psyche/indexers/lume.ts' ;

site . use ( psyche ( ) ) ;

インデクサーは、 LumeConfigオブジェクトをpsyche()呼び出しの最初の引数として提供することで構成できます（types.d.tsを参照）。

デフォルト：

インデックスは/search.jsonに出力されます。
data.sectionまたはdata.draft = trueのないページは無視されます。
ページはdata.section_orderによってグループ化され、 data.orderでソートされます。
ページタイトルはdata.titleからアクセスされます。
ページセクションはdata.sectionからアクセスされます。
ページ内の<article></article>要素内の見出し、コードブロック、段落、リストは、セマンティックHTMLに従ってインデックス化されています。他の要素（ <blockquote></blockquote> ）は段落として扱われます。これは、マークダウン出力で最適に機能します。

Lumeのドキュメントのページデータおよび/または共有データページを読んで、これらのプロパティを設定する方法を確認してください。

クライアントを含む

PsycheクライアントはTypeScriptで書かれています。サイトの資産がESBUILDにバンドルされる場合、または事前に移植されたJavaScriptビルドをインポートする場合、直接インポートできます。

 import psyche from 'https://deno.land/x/psyche/client/mod.ts' ;
// or
import psyche from 'https://deno.land/x/psyche/client/psyche.min.mjs' ;

psyche Default Exportは、 ClientConfigオブジェクト（Type.D.TSを参照）を搭載した場合、 ClientInstance （Types.D.TSを参照）を返す関数です。

クライアントインスタンスで.register()を呼び出すと、コンポーネントがドキュメントに挿入され、ホットキープレスをリッスンします。その後、コンポーネントは.open()を呼び出すか、 CTRL/⌘ + Kを押すことで開くことができます。

例えば

 const searchInstance = psyche ( {
  theme : { scrollbarStyle : 'square' } ,
  index : await fetch ( '/search.json' ) . then ( ( res ) => res . json ( ) ) ,
} ) ;
searchInstance . register ( ) ;
searchInstance . open ( ) ;

ホットキーの登録

検索モーダルのリストにホットキーを追加するには、PsycheのClientConfigオブジェクトのhotkeys配列に追加します（Type.D.TSを参照）。

プラットフォームに依存するホットキーの場合、指定されたエクスポートplatformModifierは、MacOSのキーまたは他のプラットフォームのCTRLキーに相当します。

HotKeysを処理するには、指定されたExport registerHotkeyにClientHotkeyオブジェクト（Type.D.TSを参照）を提供します。これは、いくつかの追加プロパティを備えたKeyboardEvent部分的なものです。

platformModifierプロパティは、他のプラットフォーム上のMacOSまたはctrlKeyのmetaKeyと同等です。
onkeydownプロパティは、キーの組み合わせが押されたときに呼び出され、最初の引数としてトリガーされたKeyboardEventを渡しました。
onkeyupプロパティは、キーの組み合わせがリリースされたときに呼び出され、最初の引数としてトリガーされたKeyboardEventを渡しました。

例えば

 import psyche , {
  registerHotkey ,
  platformModifier ,
} from 'https://deno.land/x/psyche/client/psyche.min.mjs' ;

registerHotkey ( {
  key : 'l' ,
  platformModifier : true ,
  shiftKey : true ,
  onkeydown : ( event ) => {
    event . preventDefault ( ) ;
    toggleTheme ( ) ;
  } ,
} ) ;

const searchInstance = psyche ( {
  hotkeys : [ { kbd : ` ${ platformModifier } + SHIFT + L` , label : 'to toggle theme' } ] ,
} ) ;
searchInstance . register ( ) ;