Feat/ocrvs 7978/qr reader #8196
Conversation
|
/uikit |
|
/uikit |
|
Storybook deployed: https://feat-ocrvs-7978-qr-reader.opencrvs.pages.dev |
| display: flex; | ||
| align-items: center; | ||
| width: ${width || '100%'}; | ||
|
|
||
| :before, :after { | ||
| flex: 1; | ||
| content: ''; | ||
| padding: 0 1px 1px; | ||
| background-color: ${color || theme.colors.grey200}; | ||
| margin: 16px; | ||
| } | ||
|
|
||
| :before { | ||
| margin-left: 0; | ||
| } | ||
|
|
||
| :after { | ||
| margin-right: 0; | ||
| } | ||
| ` |
There was a problem hiding this comment.
Basically what does this do if Divider has children? Could this be documented in Storybook 🤔
There was a problem hiding this comment.
Yep sure! I introduced children prop to the divider to make components like this below. As it serves the same purpose of a divider component, I made the prop change in the divider component
| const renderReader = (reader: ReaderType) => { | ||
| const { type, ...readerProps } = reader | ||
| if (type === 'qr') { | ||
| return ( | ||
| <QRReader | ||
| key={type} | ||
| {...readerProps} | ||
| onScan={onScan} | ||
| onError={onError} | ||
| /> | ||
| ) | ||
| } else return null | ||
| } |
There was a problem hiding this comment.
This is a "ReaderGenerator" (like FormFieldGenerator), can be lifted to a separate component so it doesn't get re-created on every render of IDReader
There was a problem hiding this comment.
Agreed, I am on it 👍🏼
| <Icon name={props.iconName} size="large" /> | ||
| </IconContainer> | ||
| <Text variant="reg14" element="p"> | ||
| {props.label} |
There was a problem hiding this comment.
| {props.label} | |
| {children} |
| const StyledButton = styled(SecondaryButton)` | ||
| width: 100%; | ||
| ` |
There was a problem hiding this comment.
Use Button component instead
There was a problem hiding this comment.
Sure thanks. will do
…ders, i.e. QR, eSignet
|
Oops! Looks like you forgot to update the changelog. When updating CHANGELOG.md, please consider the following:
|
No description provided.