Visual Studio Code autocomplete when I press "." key. Any way to disable? - reactjs

When I'm trying to extend the React.Component abstract base class, I get autocomplete suggestions in the box below as I type in React. The problem is they complete even when I type in the "." key, rather than tab or enter as one would expect.
Is there any way to disable this behavior, so that I don't get autocomplete with the dot key. I guess a workaround could be to get an extension that would make more React related suggestions/snippets pop up. So far I had no luck with trying some of those out. I also didn't find anything related to this in keybindings.
I tried disabling all of my extensions that have anything to do with intellisense, autocomplete or snippets (note that I have many), but it seems to be coming from within VSCode itself.

"editor.acceptSuggestionOnCommitCharacter": false,

Related

react-notifications-component custom content example

I am using react-notifications-component and I see that I can have a custom component shown by setting .content of the iNotification object passed to Store.addNotification(). I would like to add a control to the existing component that comes with this library (I want to add a button to copy the message to the clipboard). If I could extend the existing component, this could be relatively easy, but I don't see how to do this. I don't want to "reinvent the wheel" since the 'native' component works and looks great.
Does anyone have examples of this type of functionality?
Thanks.
I dont think there is way to do it, unless you ask the author.. But honestly its fairly easy to implement own component that looks just like the original one, so I dont think it would even make sense to have this functionality, but you can ask..
Anyway I played around and made custom component which copies text ( but from input not from a div therefore the style broke a bit, but if you have a div it again looks just the same..
working example

sencha modern list item swipe item bug

I'm trying to provide swipe actions in Sencha Modern list in version 7.2.0.
Although the documentation indicates that the text, ui, iconcls and cls are bindable, I'm unable to get it to work.
Further, the text seems to be getting bound without any bind configuration which is even more surprising.
Please see relevant fiddle
Essentially, I would like to make the iconCls and the cls change based on the record's data.
Thanks
There is definitely an issue here. The text does not seem to be handled as a bind. If the text field exists it is used..... so I did a quick override that treats the ui field similarly. if it exists it is using it. You can do the same with the iconCls... etc.
Swipper override fiddle

React Material UI: floating label on something else than input

I made a custom component that doesn't rely on Input (it is actually showing a path selection within a tree)
I want to integrate this component in my application with the very same look and feel than any other input component. What I actually want is the floating label that takes place within the editor if the value is null or undefined, and floats above the editor if the editor has a value.
I can't find any way that permits to achieve this on components that are not based on an Input. Am I missing something in material ui documentation?
Here is the code sandbox of my development: https://codesandbox.io/s/treeviewselect-dj4j5?file=/demo.tsx
Edit: the boolean property shrink that should help to do the trick, but still, the position of the label is still off.
Edit2: it seems that the related control must have a height of 64px for the position of the label to be fine. Needs to pilot the whole behavior depending on the value. Will post the fully corrected codesandbox later.

Material-UI Autocomplete features don't seem to be working for me

I'm using the Material-UI Autocomplete control and really like it, however I am not even using some of it's coolest features (autoComplete, autoSelect, autoHighlight). When I enabled these, the behavior doesn't seem to change. Interestingly, I see the same thing when I try them in the "Playground" section on the following website https://material-ui.com/components/autocomplete/. I've tried this website with multiple browsers and multiple computers, and those features just don't seem to be working.
For instance..."autoComplete" has the following description..
If true, the portion of the selected suggestion that has not been
typed by the user, known as the completion string, appears inline
after the input cursor in the textbox. The inline completion string is
visually highlighted and has a selected state.
However I never see the "completion string" following the input cursor. Similarily, "autoSelect" does not select the current suggestion when the control loses focus (e.g. TAB key is pressed).
I believe I have the latest versions of the material-ui components installed...
"#material-ui/core": "^4.9.10"
"#material-ui/icons": "^4.9.1"
"#material-ui/lab": "^4.0.0-alpha.49"
Am I misunderstanding these features? I certainly believe I could be doing something wrong, but that wouldn't explain why they don't seem to work on the material-ui website in their own "playground".
Any help or explanation is appreciated.

TestRecorder with MaterialCommand in Toolbar

In a test-class, is there any way to invoke Buttons inside the toolbar, without a name (""), which were added like this?
getToolbar().addMaterialCommandToRightBar("", FontImage.MATERIAL_PICTURE_AS_PDF, e -> createPDF());
Or can I somehow tell the test-class to show a specific form ?(which is happening when I click the button without a label).
The test recorder is not generating any code in that case. It seems that it is only working with buttons, which have a non-empty String as name, as they are simply invoked by
clickButtonByLabel("Label");
The test recorder was written before the Toolbar existed, we tried to update it for the Toolbar recently but this proved to be pretty difficult.
We have this issue that covers this bug. As a workaround you can post the command directly in the code of the test.

Resources