-
Notifications
You must be signed in to change notification settings - Fork 1.9k
/
switch.tsx
34 lines (30 loc) · 978 Bytes
/
switch.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.
import React from 'react'
import './switch.scss'
type Props = {
onChanged: (isOn: boolean) => void
isOn: boolean
readOnly?: boolean
size?: string
}
// Switch is an on-off style switch / checkbox
function Switch(props: Props): JSX.Element {
const switchSize = `size--${props.size === 'medium' ? 'medium' : 'small'}`
const switchIsOn = props.isOn ? ' on' : ''
const switchIsReadonly = props.readOnly ? ' readonly' : ''
const className = `Switch override-main ${switchSize}${switchIsOn}${switchIsReadonly}`
return (
<div
className={className}
onClick={() => {
if (!props.readOnly) {
props.onChanged(!props.isOn)
}
}}
>
<div className='octo-switch-inner'/>
</div>
)
}
export default React.memo(Switch)