Stats
Actions
Tags
Formats dates into localized strings respecting user language and region settings. Provides fine-grained control over date parts and formatting options like slashes or capitalization.
How this skill is triggered — by the user, by Claude, or both
Slash command
/smarthr-design-system:smarthr-ui-date-formatterThe summary Claude sees in its skill listing — used to decide when to auto-load this skill
日付データを任意の形式にフォーマットして表示するコンポーネントです。日付をユーザーの言語や地域設定に適した形式で表示するときに使います。
日付データを任意の形式にフォーマットして表示するコンポーネントです。日付をユーザーの言語や地域設定に適した形式で表示するときに使います。
日付データを任意の形式にフォーマットして表示するコンポーネントです。日付をユーザーの言語や地域設定に適した形式で表示するときに使います。
import { DateFormatter } from 'smarthr-ui'
| Props 名 | 型 | デフォルト値 | 必須 | 説明 |
|---|---|---|---|---|
| parts | readonly [DatePart, ...DatePart[]] | - | - | 表示する日付のパーツ。指定しない場合は全て表示 |
| options | DateTimeFormatOptions & { disableSlashInJa?: boolean; capitalizeFirstLetter?: boolean; } | - | - | フォーマットオプション |
| date | string | Date | - | ✓ | - |
DateFormatter に直接関連する eslint-plugin-smarthr のルールは現時点ではありません。
useIntl の formatDate を使うnpx claudepluginhub kufu/smarthr-design-system --plugin smarthr-design-systemProvides a React component (TimestampFormatter) to format date and time data with locale-aware display. Useful for rendering dates in user-preferred formats.
Formats values for display using the FormatStyle protocol: numbers, currencies, percentages, dates, durations, measurements, person names, byte counts, lists, and URLs. Covers custom conformance and replacing legacy Formatter subclasses.
Provides i18n patterns for React apps using react-i18next and dayjs, covering user strings, date/time formatting, ICU MessageFormat, lists, currency, and RTL support. Use for multilingual UIs.