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
874 questions
13
votes
2 answers

Semantic UI, difference between table and grid?

I'd like to create a multiple rows + multiple columns view. I think I can either use table or grid. Which one should I use over another and why?
eugene
  • 39,839
  • 68
  • 255
  • 489
12
votes
8 answers

Create-React-App with TypeScript failing to compile after importing Semantic UI

I've created a new React app by running npx create-react-app@latest --typescript . and I've run the project using npm start and it all works as expected. I ran npm install semantic-ui-react semantic-ui-css and that installs correctly. But when I add…
eamon0989
  • 144
  • 1
  • 2
  • 7
12
votes
6 answers

How to disable form autocomplete in semantic-ui-react?

How can I disable autocompleting form with credentials in semantic-ui-react? Tried this but it does not work import { Form } from 'semantic-ui-react';
....
igo
  • 6,359
  • 6
  • 42
  • 51
11
votes
1 answer

Retrieve Input value from Action onClick in SemanticUI

In React Semantic-UI, Input elements can be given a handy action button or icon as shown here: http://react.semantic-ui.com/elements/input/#variations-action-icon-button Unfortunately, the documentation is really poor at explaining how the action…
Mark
  • 471
  • 4
  • 9
10
votes
1 answer

Semantic-ui-react - Table Cell Colspan

How to merge few cells in semantic-ui-react as we normally do using colspan in html table? https://react.semantic-ui.com/collections/table#types-pagination I tried different options - nothing seems to help!!
KitKarson
  • 5,211
  • 10
  • 51
  • 73
10
votes
3 answers

How to autofocus an input field in semantic-ui-react?

I'm having a difficult time autofocusing an input field with semantic-ui-react. The documentation doesn't seem to include an autoFocus prop and the focus prop doesn't place the cursor inside the input field as would be expected.
Matt MacPherson
  • 185
  • 2
  • 10
10
votes
5 answers

Semantic-UI React: How to theme using less variables in a create-react-app project

I am using Semantic-UI in my create-react-app project. I am using a custom theme to modify individual components using ThemeProvider, which is working well. However I am trying to figure out how to modify the less variables as described in the…
Zumo
  • 510
  • 3
  • 12
10
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
  • 4,939
  • 11
  • 34
  • 53
10
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…
9
votes
3 answers

Is it necessary to pass 'passHref' to NextJS having a Semantic UI React as its child component?

I've been reading the nextjs docs and it says in here that: If the child of Link is a function component, in addition to using passHref, you must wrap the component in React.forwardRef: I'm new to using Semantic UI React so I'm not really sure if…
Zedd
  • 2,069
  • 2
  • 15
  • 35
9
votes
3 answers

Semantic-ui-react style not loaded

I am trying to learn react with semantic ui but I have a problem with the style from semantic ui. Then I try follow the docs from https://react.semantic-ui.com/ but the style is not loaded Here's my code import React, { Component } from…
MR. A
  • 195
  • 1
  • 11
9
votes
1 answer

How to recreate auto-collapasable menu with semantic-ui for react?

Original semantic-ui menu does auto turn into a hamburger icon seems like via code duplication. Is it possible to recreate it in semantic-ui-react with out code duplication (as one component) and how to do such thing?
DuckQueen
  • 772
  • 10
  • 62
  • 134
9
votes
1 answer

Animations of modal and dropdown in React Semantic UI

I recently made the switch over to React Semantic-UI However, I found that none of the animations in the HTML version of Semantic-UI are present such as with the dropdown menu and modal popup. I have tried using the transition prop and wrapping…
spjy
  • 467
  • 8
  • 17
9
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
  • 17,489
  • 35
  • 150
  • 263
9
votes
2 answers

React Datetime Picker Component with Semantic UI React example

I can't find a React Datetime component with proper documentation. I need a Datetime picker in a React project using Semantic UI React. I tried https://github.com/react-component/calendar but can't get it running properly... It seems the options is…
olefrank
  • 6,452
  • 14
  • 65
  • 90
1
2
3
58 59