Stack Overflow
Stack Overflow

Questions tagged [semantic-ui-react]

Semantic-UI-React is the official React integration for Semantic UI

Semantic-UI-React is the official React integration for Semantic UI.

Current version: Semantic UI React (version v0.81.1 as of 2018-06-04)

  • jQuery Free
  • Declarative API
  • Augmentation
  • Shorthand Props
  • Sub Components
  • Auto Controlled State
847 questions
7
votes
3 answers

React Semantic UI - position icon to the left of text in Menu Item

Using React Semantic UI the default look is this This is the code (from the website) which produces that component. import React, { Component } from 'react' import { Icon, Menu } from 'semantic-ui-react' export default class…
crinklywrappr
  • 538
  • 5
  • 17
7
votes
1 answer

Jest snapshots not working with some Semantic-UI-React components

When I try to create a Jest snapshot of my React component 'LoadingModal', which contains a Semantic-UI-React 'Modal' component, the snapshot ends up empty, with 'null' inside the .snap file. I've tested taking snapshots of other Semantic-UI-React…
Roman Scher
  • 440
  • 1
  • 6
  • 14
7
votes
1 answer

How can I test React component's style with Jest + Enzyme?

Alright I have a component called . Inside the there are two Semantic UI React component,
notalentgeek
  • 2,843
  • 7
  • 28
  • 39
7
votes
2 answers

How to have right to left direction in react-bootstrap?

I want to build react UI with right to left direction. So far I've tested bootstrap className="pull-right" or manually overriding CSS properties with *{direction:rtl;} and .float-right:{float:right;} on react-bootstrap components. However this seems…
Milad R
  • 1,734
  • 7
  • 23
  • 32
7
votes
3 answers

Semantic UI scrollable Segment

I´m using Semantic UI together with ReactJS using the official semantic-ui-react. I want to build a Trello like app and put cards on it. The cards are going to be stacked for one Topic and shall be scrollable vertically inside one topic and…
Mendes
  • 13,757
  • 24
  • 122
  • 217
7
votes
2 answers

Unable to make the Checkbox work with redux-form and react-semantic-ui

I'm trying to use redux-form with react-semantic-ui and is having trouble with the Checkbox component. The Checkbox is not being checked. I've followed the example from the redux-form documentation, but no luck. Here's the Code snippet…
Tushar Khatiwada
  • 1,885
  • 2
  • 14
  • 24
7
votes
2 answers

How to use Semantic UI's theming in Semantic UI React?

There are detailed instructions on theming on the traditional Semantic UI, but the equivalent section is missing from the Semantic UI React site. Does that mean that it doesn't support theming or can you possibly use the traditional Semantic UI's…
Larry Maccherone
  • 8,879
  • 3
  • 23
  • 41
7
votes
3 answers

How to close semantic ui modal in another react component?

In my main component I can open a modal by clicking on an icon. The content of the modal is a separate component, which is calling a method. If the method call is successful, I want to close the modal. But how can I do this? Main component class…
user3142695
  • 11,619
  • 29
  • 119
  • 238
6
votes
2 answers

How do I use enter to submit the Semantic React Search

I'm trying to set up my search so when I click enter it will begin to search and redirect to the search page. I was looking through the documentation and it wasn't clear how to set this up. How can I set up pressing enter to begin the search? I'm…
Alex Erling
  • 247
  • 3
  • 14
6
votes
2 answers

Need ref to from semantic-ui-react's Form.Input - which is surrounded by divs in React

I am using semantic-ui-react's Form.Input, which wraps the input in two divs. This means, is rendered as follows:
mdebeus
  • 1,838
  • 1
  • 17
  • 26
6
votes
3 answers

In Semantic-UI-React, is there a way to add an x icon to a text input or dropdown that will clear the text when clicked?

I have both a text input and a dropdown that allows additions (both use the Form.xxx version). For both of these, I would like to add an x icon on the right, that when clicked, will either call a handler or will clear the input's value. Is this…
mdebeus
  • 1,838
  • 1
  • 17
  • 26
6
votes
2 answers

Semantic react ui Popup close button

I'm using semantic-react-ui's Popup component and I was wondering how to trigger close popup event by clicking a button inside the popup without using jquery. Thank you
riyoz
  • 361
  • 3
  • 14
6
votes
1 answer

Checkbox label with URL link in Semantic UI React

Semantic UI React Checkbox can be used like this: import React from 'react' import { Checkbox } from 'semantic-ui-react' const TermsOfServiceCheckbox = () => ( ) export default…
user2962393
  • 852
  • 8
  • 11
6
votes
1 answer

Semantic UI Vertical Align Icon and Menu

I am currently trying to align a Icon and a text in a Menu.Item with Semantic UI React V.0.68.2. Currently my HTML output looks like this: …
grahan
  • 1,410
  • 3
  • 18
  • 36
6
votes
1 answer

Semantic-UI-React, selection, multi, can't set defaultValue

I have React component: So options and defaultOptions is the same…
Sarkis Arutiunian
  • 1,135
  • 13
  • 30
1 2
3
…
56 57