aboutsummaryrefslogtreecommitdiff
path: root/src/console/components
diff options
context:
space:
mode:
Diffstat (limited to 'src/console/components')
-rw-r--r--src/console/components/console/Completion.tsx8
-rw-r--r--src/console/components/console/CompletionItem.tsx14
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>
);