7 examples of 'react conditional classname' in JavaScript

Every line of 'react conditional classname' code snippets is scanned for vulnerabilities by our powerful machine learning engine that combs millions of open source libraries, ensuring your JavaScript code is secure.

All examples are scanned by Snyk Code

By copying the Snyk Code Snippets you agree to
10classNames: function classNames(props) {
11 var use = Array.isArray(props.use) ? props.use : [props.use];
12 return use.map(function (v) {
13 return 'mdc-theme--' + v;
14 });
15},
62value: function getClassName() {
63 var _classNames;
64
65 return classNames(this.props.className, "slds-button__icon", (_classNames = {}, _defineProperty(_classNames, 'slds-button__icon--' + this.props.position, this.props.position), _defineProperty(_classNames, 'slds-button__icon--' + this.props.size, this.props.size !== "medium"), _defineProperty(_classNames, 'slds-button__icon--hint', this.props.hint), _classNames));
66}
36export function hasClass(propsName, self) {
37 return function(className) {
38 return self.state[propsName].className[className]
39 }
40}
3export default function Conditional({ condition, children }) {
4 return condition ? children : null
5}
64getClassName() {
65 const name = this.props.name ? this.props.name.replace(/_/g,'-') : '';
66 const customName = this.props.name ? this.props.name.replace("custom", "custom-"): null;
67
68 return classNames(this.props.className, "slds-icon", {
69 [`slds-icon--${this.props.size}`]: this.props.size,
70 [`slds-icon-${customName}`]: this.props.category === "custom",
71 [`slds-icon-${this.props.category}-${name}`]: this.props.category === "standard",
72 });
73}
169getDefaultProps: function getDefaultProps() {
170 return {
171 checkConditional: function checkConditional() {
172 return true;
173 },
174 isDisabled: function isDisabled() {
175 return false;
176 }
177 };
178},
120value: function toggleClass(className, condition) {
121 this["0"].classList.toggle(className, condition);
122 return this;
123}

Related snippets