フォーム v1.0.0

レーティング

星（またはカスタムアイコン）によるレーティング入力。半星精度、読み取り専用表示モード、 カスタムアイコン形状に対応しています。ホバープレビューとキーボードナビゲーションを備えています。 スタンドアロンまたはRailsフォーム内でhidden入力フィールドを介して動作します。

プレビュー & コード

オプション

名前 型 デフォルト 説明
value Float 0 Current rating value
max Integer 5 Maximum number of stars
precision Float 1 Rating precision: 1 (full stars) or 0.5 (half stars)
icon Symbol :star Icon shape: :star or :heart
size Symbol :md Icon size: :sm, :md, or :lg
readonly Boolean false Read-only display mode — no hover or click interaction
label String nil Optional label text rendered above the stars
show_value Boolean false Show numeric rating value next to the stars
clearable Boolean true Allow clearing the rating by clicking the current value again
name String nil Form field name — renders a hidden input for form submission
disabled Boolean false Disable all interaction (opacity + pointer-events-none)

変更履歴 v1.0.0

- Initial release with star and heart icon support
- Half-star precision mode with split click areas
- Hover preview with smooth color transitions
- Full keyboard navigation (arrow keys, Home, End)
- Read-only display mode for showing existing ratings
- Hidden input support for Rails form submission
- Three sizes: sm, md (default), lg
- Dark mode support throughout

フルアクセスを取得

このコンポーネントと他のすべてのソースコードをアンロックしましょう。一回のお支払いで永久アクセス。

今すぐアクセスを取得