Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Customizing autocompletion appearance #1957

Closed
ninjatronic opened this issue May 12, 2014 · 9 comments
Closed

Customizing autocompletion appearance #1957

ninjatronic opened this issue May 12, 2014 · 9 comments

Comments

@ninjatronic
Copy link

I'm using the getCompletions method on the mode to offer custom autocomplete suggestions that appear in the dropdown - but I wonder if there is any way to apply custom styling to the suggestions that appear?

@nightwing
Copy link
Member

From getCompletions return array of objects like {caption: "...", value: "..", className: "foo" } and add css rules for ".ace_foo" (see https://github.com/ajaxorg/ace/blob/master/lib/ace/autocomplete/popup.js#L189)

@ninjatronic
Copy link
Author

Yes, but that is quite a simple solution. What I want to achieve is to use the autocompleter to show multiple lines of documentation inline, perhaps even with a hyperlink to further docs, and to customize the appearance of the entire dialog. I haven't found a way to do it so far though, as everything is limited to the single line display, with the character limit.

@nightwing
Copy link
Member

Do you want to show links and documentation for all suggestions at once? That would make the popup really huge. Cloud9 shows documentation for selected suggestion in another popup next to autocompletion one, most other ides do the same. Customizing the appearance of the entire dialog should be easy since all elements have classes and you can write css for them.

@ninjatronic
Copy link
Author

I want to show a snippet of documentation with a link to the full doc in a styled autocomplete dropdown. I'm not so concerned about having the javascript keywords in there, this is for users using a custom SDK, so I want to be able to show hints for which methods/properties are available at the cursor. Does that make sense?

You can close this issue if it is not high-priority for you. I have built an external autocompleter implementation in the meanwhile that uses the change event.

Thanks

@nightwing
Copy link
Member

Could you show a screenshot of how your external autocompleter implementation looks. i still don't know how you wanted to customize autocompletion appearance.

that uses the change event

I think using change event will be harder than afterExec event ace autocompleter uses, though i might be mistaken.
Alternatively you could replace only popup implementation and keep the rest.

@ninjatronic
Copy link
Author

No using the change event was quite simple to implement.

Unfortunately I can't show a screenshot of how the autocompleter looks at the moment, but if you care to leave this issue open I can update it in the future.

@eelilag
Copy link

eelilag commented Sep 21, 2015

Hi,
Is there a way to adapt the autocompletion popup width to its content ?

@marbemac
Copy link

+1 to the question posted by @eelilag. Or even if it doesn't do it automatically, some way to specify the width/height of the autocomplete box, so that users can see more of the method signatures.

@github-actions
Copy link

github-actions bot commented May 9, 2022

This issue has not received any attention in 1 year. If you want to keep this issue open, please leave a comment below and auto-close will be canceled.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

6 participants
@nightwing @marbemac @andrewnester @ninjatronic @eelilag and others