diff options
Diffstat (limited to 'src/console/components')
-rw-r--r-- | src/console/components/console/Completion.tsx | 8 | ||||
-rw-r--r-- | src/console/components/console/CompletionItem.tsx | 14 |
2 files changed, 11 insertions, 11 deletions
diff --git a/src/console/components/console/Completion.tsx b/src/console/components/console/Completion.tsx index ed271aa..6a58a40 100644 --- a/src/console/components/console/Completion.tsx +++ b/src/console/components/console/Completion.tsx @@ -4,8 +4,8 @@ import CompletionTitle from "./CompletionTitle"; interface Item { icon?: string; - caption?: string; - url?: string; + primary?: string; + secondary?: string; } interface Group { @@ -75,8 +75,8 @@ const Completion: React.FC<Props> = ({ select, size, completions }) => { shown={viewOffset <= viewIndex && viewIndex < viewOffset + size} key={`item-${itemIndex}`} icon={item.icon} - caption={item.caption} - url={item.url} + primary={item.primary} + secondary={item.secondary} highlight={itemIndex === select} aria-selected={itemIndex === select} role="menuitem" diff --git a/src/console/components/console/CompletionItem.tsx b/src/console/components/console/CompletionItem.tsx index 2de1375..394af04 100644 --- a/src/console/components/console/CompletionItem.tsx +++ b/src/console/components/console/CompletionItem.tsx @@ -23,14 +23,14 @@ const Container = styled.li<{ white-space: pre; `; -const Caption = styled.span` +const Primary = styled.span` display: inline-block; width: 40%; text-overflow: ellipsis; overflow: hidden; `; -const Description = styled.span` +const Secondary = styled.span` display: inline-block; color: ${({ theme }) => theme.completionItemDescriptionForeground}; width: 60%; @@ -41,19 +41,19 @@ const Description = styled.span` interface Props extends React.HTMLAttributes<HTMLElement> { shown: boolean; highlight: boolean; - caption?: string; - url?: string; + primary?: string; + secondary?: string; icon?: string; } const CompletionItem: React.FC<Props> = (props) => ( <Container icon={props.icon || ""} - aria-labelledby={`completion-item-${props.caption}`} + aria-labelledby={`completion-item-${props.primary}`} {...props} > - <Caption id={`completion-item-${props.caption}`}>{props.caption}</Caption> - <Description>{props.url}</Description> + <Primary id={`completion-item-${props.primary}`}>{props.primary}</Primary> + <Secondary>{props.secondary}</Secondary> </Container> ); |