- Updated DoctorDetailPage, MySecretariesPage, RecordNumberSettingsPage, RepresentationsPage, ResourcePoolsPage, ResourceTypesPage, SecretariesPage, SecretaryDetailPage, SettingsPage, SkillsPage, SmsWalletPage, and TagsSettingsPage to use the new Switch component instead of native checkboxes. - Enhanced accessibility by ensuring the Switch component uses appropriate roles and labels. - Added tests for the new Switch component to ensure functionality and accessibility compliance. - Updated styles to accommodate the new Switch component design.
27 lines
819 B
TypeScript
27 lines
819 B
TypeScript
import React from 'react';
|
|
import Switch from '../ui/Switch';
|
|
|
|
/**
|
|
* سوییچ وضعیت فعال/غیرفعال — معادل MUI Switch مبدأ با دیزاینسیستم مقصد.
|
|
* برچسب فعال/غیرفعال کنار سوییچ نمایش داده میشود (مثل مبدأ).
|
|
*/
|
|
export default function StatusToggle({
|
|
active,
|
|
onToggle,
|
|
disabled,
|
|
}: {
|
|
active: boolean;
|
|
onToggle: () => void;
|
|
disabled?: boolean;
|
|
}) {
|
|
const label = active ? 'فعال' : 'غیرفعال';
|
|
return (
|
|
<div style={{ display: 'flex', alignItems: 'center', gap: 8 }}>
|
|
<span title={label}>
|
|
<Switch checked={active} onChange={onToggle} disabled={disabled} ariaLabel={label} />
|
|
</span>
|
|
<span style={{ fontSize: 13, color: 'var(--text-2)' }}>{label}</span>
|
|
</div>
|
|
);
|
|
}
|