Header
アカウント設定やアプリ切替などSmartHR共通の横断機能を提供するヘッダーコンポーネントです。基本はAppHeaderの利用を推奨し、独自のヘッダー構成が必要なときのみHeader単体で使います。
複数のSmartHRのプロダクトを使っていたとしても同じSmartHRブランドの製品であることをユーザーが認知できるよう、共通のHeaderを提供します。
レイアウト
AppHeaderを参照してください。
モバイル
モバイルでの表示はAppHeaderコンポーネントが対応します。 AppHeaderのモバイルを参照してください。
Props
Header props
logo
ReactElement<any, string | JSXElementConstructor<any>>
ロゴ
logoHref
string
ロゴリンク
featureName
stringnumberfalsetrueReactElement<any, string | JSXElementConstructor<any>>Iterable<ReactNode>ReactPortal
機能名（enableNew と合わせて使います）
apps
Category[]
機能群（enableNew と合わせて使います）
tenants
Tenant[]
テナント一覧
currentTenantId
string
現在のテナント ID
onTenantSelect
(id: string) => void
テナントが選択された時に発火するコールバック関数
enableNew非推奨
falsetrue
@deprecated internal-ui から利用するので使わないでください。
HeaderLink props
enableNew
falsetrue
HeaderDropdownMenuButton props
trigger必須
stringnumberfalsetrueReactElement<any, string | JSXElementConstructor<any>>Iterable<ReactNode>ReactPortal{ children: ReactNode; size?: ButtonProps; onlyIcon?: boolean | { component?: ComponentType<any>; }; }
引き金となるボタン
children必須
stringnumberfalsetrueReactElement<any, string | JSXElementConstructor<any>>Iterable<ReactNode>ReactPortalReactElement<{ size?: "S" | "M"; disabledReason?: { icon?: FunctionComponent<{}>; message: ReactNode; }; prefix?: ReactNode; suffix?: ReactNode; wide?: boolean; variant?: Variant; loading?: boolean; } & { ...; } & Omit<...> & RefAttributes<...>, string | JSXElementConstructor<...>>ReactElement<Omit<BaseProps<T> & { selectedItems: (ComboboxItem<T> & { deletable?: boolean; })[]; selectedItemEllipsis?: boolean; inputValue?: string; onDelete?: (item: ComboboxItem<T>) => void; ... 4 more ...; noResultText?: ReactNode; }, "disabledReason" | "variant"> & { elementAs?: ElementType; variant?: "text" | "primary" | "secondary" | "danger" | "skeleton"; inactiveReason?: { ...; }; } & { form?: string; slot?: string; style?: CSSProperties; title?: string; ref?: Ref<HTMLButtonElement>; key?: Key; defaultChecked?: boolean; defaultValue?: string | ... 1 more ... | readonly string[]; ... 266 more ...; formTarget?: string; }<...> & ElementRefProps<...>, string | JSXElementConstructor<...>>ReactElement<{ targetId: string; onClick?: (open: () => void) => void; } & { children?: ReactNode; }, string | JSXElementConstructor<any>>ReactNode | ReactElement<any, string | JSXElementConstructor<any>> | ReactElement<any, string | JSXElementConstructor<any>> | ReactElement<...>[]
操作群
onOpen
() => void
ドロップダウンメニューが開かれた際のイベント
onClose
() => void
ドロップダウンメニューが閉じられた際のイベント
ref
(instance: HTMLButtonElement) => voidRefObject<HTMLButtonElement>