Stripe のUI拡張機能 SDK をアップグレードする

このページでは、@stripe/ui-extension-sdk の各メジャーバージョンで導入された重大な変更点を理解するのに役立つ包括的なガイドを提供し、アプリケーションのアップグレードに必要な変更点の概要を示します。

@stripe/ui-extension-sdk バージョンを更新する前に、stripe plugin upgrade apps を実行して Stripe Apps CLI プラグインをアップグレードすることをお勧めします。これにより、最適な互換性、最新機能の実装、セキュリティ修正が保証されます。

@stripe/ui-extension-sdk v9

v9 の新機能

@stripe/ui-extension-sdk のバージョン 9 では、すべてのコンポーネントのプロパティ検証が導入されています。このバージョンはより安全で、バグを軽減し、コーディングのベストプラクティスの遵守を促進します。インストール後は、無効なプロパティ値から発生する TypeScript エラーに注意してください。検証エラーが発生し、アプリケーションがクラッシュする可能性があります。

コンポーネントの変更

一部のコンポーネントの表示を更新しました。最新バージョンをインストールしたら、アプリを確認して、コンポーネントが適切に表示されていることを確認してください。

変更ログ

9.0.0

• useStorage フックを追加しました。
• userContext に isSandbox を追加します。
• OnboardingView コンポーネントを追加します。
• PropertyList および PropertyListItem コンポーネントを追加しました。
• TaskList および TaskListItem コンポーネントを追加しました。
• PlatformConfigurationView コンポーネントを追加して、埋め込みアプリの設定を有効にしました。
• 型安全なプロパティを保証するためにランタイムコンポーネントのプロパティ検証を追加しました。
• Button コンポーネントに pending プロパティを追加しました。
• BarChart および LineChart コンポーネントに形式オプションを追加しました。
  • decimal の形式スタイルを追加しました。
  • より適切な軸制限を設定するために nice オプションを追加しました。
  • 軸上の市場数を指定するために ticks を追加しました。
  • 目盛ラベルの表記を変更するために tickFormat を追加しました。
  • ゼロ値の表示をコントロールするために zero を追加しました。
  • 数値の精度をコントロールするため、通貨の形式に fractionalDigits オプションを追加しました。
• Tab および TabPanel コンポーネントから非推奨の tabKey プロパティを削除しました。代わりに id プロパティを使用してください。
• Box および Inline コンポーネントの css プロパティから非推奨の background プロパティを削除しました。代わりに backgroundColor プロパティを使用します。
• Button および Link コンポーネントから非推奨の className プロパティを削除しました。
• FormFieldGroup コンポーネントから非推奨の invalid プロパティを削除しました。
• Box および Inline コンポーネントの css プロパティから非推奨の layout プロパティを削除しました。代わりに stack プロパティを使用します。
• FocusView コンポーネントから非推奨の onClose プロパティを削除しました。代わりに setShown プロパティを使用してください。
• TextArea および TextField コンポーネントから非推奨の onKeyPress プロパティを削除しました。
• DateField コンポーネントの onChange プロパティが、変更イベントではなく値を直接受け取るようになりました。
• FormFieldGroup コンポーネントの layout プロパティ値が、row と column から horizontal と vertical に変更されました。

8.10.0

• userContext に isSandbox を追加します。

8.9.3

• SignInView の onPress コールバック引数の型定義を、実際のランタイム値と一致するように修正しました。
• @remote-ui の依存関係をアップグレードします。

8.9.2

• 互換性のある値のみを受け付けるように minTileWidth のプロパティタイプを修正しました。
• React.RefObject タイプは実行時にサポートされないため、Tooltip コンポーネントの trigger プロパティから削除されました。
• Tab および TabPanel コンポーネントに、tabKey の代わりとなる id プロパティを追加しました。
• Box および Inline コンポーネントの css プロパティの枠線の色プロパティ (borderColor、borderBottomColor、borderLeftColor、borderRightColor、borderTopColor) から非推奨通知を削除しました。
• Box および Inline コンポーネントの css プロパティに、枠線のスタイルと幅のプロパティ (borderStyle、borderWidth、borderBottomStyle、borderBottomWidth、borderLeftStyle、borderLeftWidth、borderRightStyle、borderRightWidth、borderTopStyle、borderTopWidth) を追加しました。
• Icon コンポーネントの name プロパティにリテラル型を追加しました。

8.9.1

• 修正済みの依存関係バージョンを使用します。
• テストラッパーの検索メソッドを修正しました。

8.9.0

• DateField コンポーネントに value プロパティを追加しました。
• Box および Inline コンポーネントの background プロパティに非推奨通知を追加しました。代わりに backgroundColor プロパティを使用します。
• Button および Link コンポーネントの className プロパティに非推奨通知を追加しました。
• FormFieldGroup コンポーネントの invalid プロパティに非推奨通知を追加しました。
• Box および Inline コンポーネントの css プロパティの layout プロパティに非推奨通知を追加しました。代わりに stack プロパティを使用します。
• Tab および TabPanel コンポーネントの tabKey プロパティに非推奨通知を追加しました。
• Box および Inline コンポーネントの css プロパティのボーダーカラープロパティ (borderColor、borderTopColor、borderRightColor、borderBottomColor、borderLeftColor) に非推奨通知を追加しました。ボーダーのスタイルを設定する場合は、代わりに keyline プロパティを使用します。
• value および checked プロパティから非推奨通知を削除しました。

8.8.0

• StripeFileUploader コンポーネントを追加しました。
• 環境コンテキストに platform プロパティを追加しました。
• ExtensionContextValue タイプに appContext を追加しました。
• AuthorizedPermission と AuthorizedContentSecurityPolicy のタイプを追加しました。
• appContext と対話するためのユーティリティ関数を追加しました。
  • getUserAuthorizedPermissions: アプリの承認済みの権限と、ダッシュボードの現在のユーザーの権限の共通部分を取得します。
  • isPermissionAuthorized: 権限がアプリの承認済みの権限に含まれているかどうかを表示します。
  • isSourceInAuthorizedCSP: URL がアプリの承認済みの連結ソースまたは画像ソースに存在するかどうかを表示します。

8.7.0

• userContext プロパティで拡張機能に渡されるアカウントに roles を追加しました。

8.6.0

• SignInView に secondaryAction プロパティを追加しました。
• SignInView アクションプロパティに target を追加しました。
• SignInView アクションプロパティで href と onPress の両方を使用できるようになりました。

8.5.0

• 環境コンテキストに constants プロパティを追加しました。

8.4.1

• SignInView コンポーネントを追加しました。

8.3.0

• TableCell と TableHeaderCell の入力からサポート対象外の contentUses プロパティを削除しました。
• show と dismiss のユーティリティメソッドを返すよう useToast を更新しました。

8.2.0

• HTTP レスポンスの本文が空の場合に StripeAppsHttpResponse.prototype.toJSON() は拒否されたプロミスを返すようになりました。
• ネストされた JSON を使用して fetchStripeSignature を呼び出せるようになりました。
• all オプションに従ってプロパティをフィルタリングできるよう debug を修正しました。
• Tab と TabPanel に tabKey を追加しました。
• stripe パッケージの依存関係を ^9.11.0 にアップグレードしました。
• Link に external を追加しました。
• FocusView に setShown プロパティを追加しました。
• アプリのビューの下部にトースト通知を表示する showToast ユーティリティ関数を追加しました。

8.1.0

• name と objectContext の値を null としてマークする ExtensionContextValue の入力の問題を修正しました。
• Box の css に textAlign を追加しました。
• SettingsView コンポーネントの onSave プロパティをオプションにしました。
• @remote-ui/react 4.5.2 にアップグレードしました。
• Sparkline コンポーネントを追加しました。

8.0.0

• TextArea、TextField、Select コンポーネントの value プロパティに非推奨通知を追加しました。
• Checkbox、Radio、Switch コンポーネントの checked プロパティに非推奨通知を追加しました。
• 入力からサポート対象外の outerRef プロパティを削除しました。

7.1.0

• ContextView に brandIcon と brandColor を追加しました。

7.0.0

• Notice コンポーネントのサポートを廃止しました。代わりに Banner を使用してください。
• Box の css に overflowX と overflowY を追加しました。

6.3.1

• 内部更新。ユーザー向けの変更はありません。

6.3.0

• Banner コンポーネントを追加しました。
• Notice コンポーネントの非推奨警告を追加しました。
• ExtensionContextValue['oauthContext'] に locale を追加しました。
• Box の css プロパティに overflowWrap と wordBreak を追加しました。
• Box と Inline の css プロパティに textTransform を追加しました。
• ContextView に primaryAction、secondaryAction、footerContent プロパティを追加しました。
• Box の css プロパティに whiteSpace を追加しました。

6.2.0

• BarChart および LineChart の改善:
  • 軸の形式を設定できるようになりました。
  • 値の形式を設定できるようになりました。
  • チャネルドメインを設定できるようになりました。
  • チャネル範囲を設定できるようになりました。
  • チャートの軸ラベルと目盛を表示 / 非表示できるようになりました。
  • チャートのグリッド線を表示 / 非表示できるようになりました。
  • チャートプリセットのツールチップを表示 / 非表示できるようになりました。
  • チャートプリセットの説明文を表示 / 非表示できるようになりました。

6.1.0

• FocusView に確認ダイアログを追加しました。
• Chip および ChipList コンポーネントを追加しました。
• メールを直接返信し、エラーが発生した場合にプロミスを拒否する getDashboardUserEmail ユーティリティを更新しました。
• フォーム要素の label プロパティで受け付けられない React コンポーネントを修正しました。
• Box の css の text-overflow: ellipsis と word-wrap: normal | break-word を公開しました。
• userContext プロパティで拡張機能に渡されるアカウントに country を追加しました。
• Img コンポーネントに data: URL サポートを追加しました。詳しくは、Img コンポーネントをご覧ください。

6.0.0

• ビューコンテキストのメールのサポートを廃止しました。
• /utils パスのユーティリティを統合しました。
• ユニットテストに影響を及ぼす react-reconciler の依存関係の問題を修正しました。

5.0.1

• Switch、Checkbox、Radio のプロパティタイプを修正しました。

5.0.0

• Accordion、Icon、Spinner、Tooltip コンポーネントを追加しました。
• BarChart と LineChart にツールチップを追加しました。
• BarChart と LineChart のプロパティ入力を修正しました。
• レガシーのビューコンテキストパラメーターのサポートを廃止しました。
• Select、TextArea、TextField、Button、Link で css={{ width: .. }} を使用して幅調整できるようになりました。
• Button と Link で css={{ alignX: .. }} を使用して横方向調整できるようになりました。
• clipboardWriteText 関数を追加しました。
• getDashboardUserEmail 関数を追加しました。

4.0.0

• slot プロパティのサポートを廃止しました。

3.2.0

• createOAuthState 関数を追加しました。
• ExtensionContextValue タイプに oauthContext を追加しました。

3.1.0

• Img コンポーネントを追加しました。

3.0.0

• Notice、Charts、Tabs コンポーネントのサポートを追加しました。
• 対応処理が必要な変更:
  • ListItem: 以前までは、子として渡されたコンテンツが、コンポーネントに表示される主要なコンテンツでした。現在は title プロパティに主要なコンテンツが渡されます。description スロットも secondaryTitle プロパティに再割り当てされるようになっています。
  • MenuTrigger: このコンポーネントは廃止され、代わりに Menu コンポーネントの trigger プロパティが使用されるようになりました。Slot API の使用も廃止されています。
• ユーザーコンテキストに渡される権限を削除しました。

2.2.1

• dist の docs.json ファイルを公開しました。

2.2.0

• ContextView に actions プロパティを追加しました。

2.1.0

• ButtonGroup コンポーネントを導入しました。
• フォーム管理から margin-bottom を削除しました。
• ボタンに white-space: nowrap と alignY: center をデフォルトで追加しました。
• ボタンテーマですべてのサイズバリアントに min-height を設定できるようになりました。
• Link および Button をコンテンツに合わせて縮小しました。
• TextField および TextArea の defaultValue 属性を公開しました。
• hiddenElements プロパティを使用して、フォーム管理で error と description を非表示にできるようになりました。
• Select と TextArea の invalid および size プロパティを公開しました。
• Radio の defaultChecked 属性を公開しました。
• TextArea の resizeable および rows プロパティを公開しました。
• コントロールコンポーネントの無効状態を修正しました。
• Chip の onDropdown が 2 回起動する問題を修正しました。
• Divider の表示を修正しました。

2.0.3

• ダッシュボードのデータが更新されることで解決する useRefreshDashboardData のプロミスを返します。
• 追加のリクエストペイロードを必要に応じて受け付ける fetchStripeSignature メソッドを追加しました。署名を使用して、アプリのバックエンドに対する認証済みリクエストが可能になります。
• テスト要素のチェックメソッド .is がコンポーネントの識別に失敗する問題を修正しました。

2.0.2

• wrapper.find() を使用してフラグメントプロパティを持つコンポーネントを検出できない testing パッケージの問題を修正しました。

2.0.1

• #55 と #161 を修正する依存関係を導入しました。

2.0.0

• SettingsView の表示エラーを修正しました。
• 使用可能なコンポーネントのプロパティに合わせて SettingsView のタイプを更新します。
• テスト用の getMockContextProps ヘルパーを追加しました。詳しくは、コンテキストプロパティをご覧ください。
• List コンポーネントで string だけでなくReact.ReactNode も value プロパティの有効なタイプとして受け付けられるようになりました。
• ListItem コンポーネントにカーソル状態を追加しました。
• 関連付けられたアクションがある場合にのみカーソル状態を表示するよう ListItem コンポーネントを更新しました。
• true が複数ある場合に「選択」が表示される問題を修正しました。
• Checkbox の onChange が 2 回起動する問題を修正しました。

1.1.7

• アプリの Jest テストを作成するためのヘルパーを含む「テスト」モジュールを追加しました。詳しくは、UI テストをご覧ください。
• React ノードをプロパティとして使用する一部のコンポーネントを修正しました。
  • MenuGroup が title プロパティに対応しました。
  • FocusView が footerContent プロパティに対応しました。
  • SettingsView が headerActions プロパティに対応しました。
• タイプの修正と文法の更新を行いました。

1.1.6

• FocusView、SettingsView、ContextView のタイプを追加しました。
• Stripe API クライアントの初期化時に使用する新しい定数 STRIPE_API_KEY を http_client からエクスポートします。