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
9
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
  • 175
  • 1
  • 8
9
votes
5 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
  • 5,007
  • 6
  • 37
  • 45
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
  • 48
  • 6
  • 46
  • 109
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
  • 464
  • 8
  • 15
9
votes
1 answer

Remove caret from semantic-ui react dropdown menu

Does anyone know how to remove the caret on the ... component? The prop list for that component does not have a flag as far as i can tell. Does anyone have experience with this? import React from 'react' import { Dropdown, Menu }…
archae0pteryx
  • 3,124
  • 2
  • 17
  • 38
9
votes
1 answer

How to pass a React component as a prop

I'm using react-semantic-ui Modal object. The object that opens the modal is a prop. Text otherProp=... > I want to embed Modal in another component: export default class Confirm extends…
znat
  • 12,164
  • 14
  • 60
  • 93
8
votes
2 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
  • 186
  • 1
  • 9
8
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
  • 411
  • 4
  • 7
8
votes
1 answer

Inline popup/tooltip at React Semantic UI

I'm following an example from official documentation to create a simple Popup: https://react.semantic-ui.com/modules/popup So here is my current code which works very well: export default (state, methods) => { const { trigger, handleTooltipOpen,…
Vytalyi
  • 1,351
  • 3
  • 17
  • 29
8
votes
1 answer

semantic-ui-react not working for

I am using semantic-ui react to render a table of data. My requirement is that when the page is on mobile view, I hide certain columns. I tried using className="mobile hidden" on the Table.Cell element but this doesn't seem to work at all. Then I…
rex
  • 2,785
  • 5
  • 31
  • 56
8
votes
3 answers

Creating a sticky bar in Semantic UI (React). Page jumps when scrolling

I'm using the component in semantic to create a top menu + breadcrumb header. For some reason, the scroll bar "jumps" when trying to scroll from the topmost position Sandbox https://codesandbox.io/s/y7k3zn5qn1 I haven't provided the context prop to…
PrashanD
  • 2,353
  • 3
  • 26
  • 51
8
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
  • 4,204
  • 7
  • 45
  • 75
8
votes
1 answer

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
  • 33,301
  • 47
  • 188
  • 382
8
votes
3 answers

semantic-ui-react webpack size is 1.74M?

I find common vendor for my project is very big. I'm tring to see which module is responsible for the big size, and found semantic-ui-react is taking 1.74M by itself. react-vendor.js 1.74 MB 2 [emitted] [big] …
eugene
  • 33,301
  • 47
  • 188
  • 382
7
votes
1 answer

Cannot check expect(elm).not.toBeVisible() for semantic-ui react component

I'm trying to test a react component and use expect(elm).not.toBeVisible() without success. Update 3 I have cut down the code into this simpler form: // ./TestItem.js import React from 'react' import './TestItem.css' export default ({ hide }) => { …
Wormie
  • 201
  • 2
  • 10
1
2
3
…
56 57