33 lines
866 B
TypeScript
33 lines
866 B
TypeScript
import type { Elements } from '../config/map/values';
|
|
import { useStatus } from '@/stores/calculation/statuses/hooks';
|
|
import { useValue } from '@/stores/calculation/values/hooks';
|
|
import type { Values } from '@/stores/calculation/values/types';
|
|
import { observer } from 'mobx-react-lite';
|
|
import type { ComponentType } from 'react';
|
|
import styled from 'styled-components';
|
|
|
|
type BuilderProps = {
|
|
elementName: Elements;
|
|
valueName: Values;
|
|
};
|
|
|
|
const Wrapper = styled.div`
|
|
margin-bottom: 24px;
|
|
`;
|
|
|
|
export function buildReadonly<T>(
|
|
Component: ComponentType<T>,
|
|
{ elementName, valueName }: BuilderProps
|
|
) {
|
|
return observer((props: T) => {
|
|
const [value] = useValue(valueName);
|
|
const status = useStatus(elementName);
|
|
|
|
return (
|
|
<Wrapper>
|
|
<Component readOnly status={status} value={value} {...props} />
|
|
</Wrapper>
|
|
);
|
|
});
|
|
}
|