@telefonica/mistica 10.14.0 → 10.16.0

package/dist-es/select.js

@@ -1,3 +1,4 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import * as React from 'react';
 import { useForm } from './form-context';
 import { useAriaId, useTheme } from './hooks';
@@ -27,20 +28,6 @@ function _defineProperty(obj, key, value) {
     }
     return obj;
 }
-function _extends() {
-    _extends = Object.assign || function(target) {
-        for(var i = 1; i < arguments.length; i++){
-            var source = arguments[i];
-            for(var key in source){
-                if (Object.prototype.hasOwnProperty.call(source, key)) {
-                    target[key] = source[key];
-                }
-            }
-        }
-        return target;
-    };
-    return _extends.apply(this, arguments);
-}
 function _iterableToArrayLimit(arr, i) {
     var _arr = [];
     var _n = true;
@@ -66,6 +53,22 @@ function _iterableToArrayLimit(arr, i) {
 function _nonIterableRest() {
     throw new TypeError("Invalid attempt to destructure non-iterable instance");
 }
+function _objectSpread(target) {
+    for(var i = 1; i < arguments.length; i++){
+        var source = arguments[i] != null ? arguments[i] : {
+        };
+        var ownKeys = Object.keys(source);
+        if (typeof Object.getOwnPropertySymbols === "function") {
+            ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
+                return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+            }));
+        }
+        ownKeys.forEach(function(key) {
+            _defineProperty(target, key, source[key]);
+        });
+    }
+    return target;
+}
 function _slicedToArray(arr, i) {
     return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest();
 }
@@ -74,10 +77,6 @@ var _obj, _obj1;
 var useStyles = createUseStyles(function(theme) {
     return {
         selectContainer: (_obj = {
-            cursor: function(param) {
-                var disabled = param.disabled;
-                return disabled ? 'auto' : 'pointer';
-            },
             position: 'relative',
             outline: 0
         }, _defineProperty(_obj, theme.mq.tabletOrSmaller, {
@@ -108,24 +107,17 @@ var useStyles = createUseStyles(function(theme) {
             width: '100%',
             height: '100%',
             textOverflow: 'ellipsis',
-            '&:disabled': {
-                color: theme.colors.textDisabled
-            },
             appearance: 'none',
             cursor: function(param) {
                 var disabled = param.disabled;
-                return disabled ? 'inherit' : 'pointer';
+                return disabled ? 'default' : 'pointer';
             }
         },
         arrowDown: {
             position: 'absolute',
             right: 16,
             top: 'calc(50% - 10px)',
-            pointerEvents: 'none',
-            opacity: function(param) {
-                var disabled = param.disabled;
-                return disabled ? 0.3 : 1;
-            }
+            pointerEvents: 'none'
         },
         selectText: {
             position: 'absolute',
@@ -138,9 +130,10 @@ var useStyles = createUseStyles(function(theme) {
                 return label ? 27 : 17;
             },
             fontSize: 16,
-            color: function(param) {
+            color: theme.colors.textPrimary,
+            opacity: function(param) {
                 var disabled = param.disabled;
-                return disabled ? theme.colors.textDisabled : theme.colors.textPrimary;
+                return disabled ? 0.5 : 1;
             },
             maxWidth: '100%',
             textOverflow: 'ellipsis',
@@ -435,135 +428,159 @@ var Select = function(param) {
         }
     };
     var ref15;
-    return shouldUseNative ? /*#__PURE__*/ React.createElement(FieldContainer, {
+    return shouldUseNative ? /*#__PURE__*/ _jsxs(FieldContainer, {
         disabled: disabled,
-        helperText: /*#__PURE__*/ React.createElement(HelperText, {
+        helperText: /*#__PURE__*/ _jsx(HelperText, {
             error: error,
             leftText: helperText
         }),
         fieldRef: fieldRef,
-        fullWidth: fullWidth
-    }, label && /*#__PURE__*/ React.createElement(Label, {
-        error: error,
-        forId: inputId,
-        inputState: isFocused ? 'focused' : ((ref15 = value !== null && value !== void 0 ? value : valueState) !== null && ref15 !== void 0 ? ref15 : (ref11 = inputRef.current) === null || ref11 === void 0 ? void 0 : ref11.value) ? 'filled' : 'default',
-        disabled: disabled,
-        optional: optional
-    }, label), /*#__PURE__*/ React.createElement("select", {
-        className: classes.select,
-        id: inputId,
-        "aria-invalid": !!error,
-        value: value,
-        required: !optional,
-        disabled: disabled,
-        onChange: function(e) {
-            if (onChangeValue) {
-                onChangeValue(e.target.value);
-            }
-        },
-        onFocus: function() {
-            return setIsFocused(true);
-        },
-        onBlur: function(e) {
-            setIsFocused(false);
-            onBlur === null || onBlur === void 0 ? void 0 : onBlur(e);
-        },
-        ref: function(actualRef) {
-            [
-                inputRef,
-                focusableRef
-            ].forEach(function(currentRef) {
-                // @ts-expect-error current is typed as read-only
-                currentRef.current = actualRef;
-            });
-        },
-        style: {
-            // Override default browser opacity when disabled. This opacity also affects the label.
-            // Without this fix, the label is invisible when disabled
-            opacity: 1
-        }
-    }, options.every(function(param) {
-        var value = param.value;
-        return !!value;
-    }) && // if no "empty" option exists, insert a dummy empty option
-    // this is needed to allow a native select with no selected option
-    /*#__PURE__*/ React.createElement("option", {
-        value: "",
-        style: {
-            display: 'none'
-        }
-    }), options.map(function(param) {
-        var val = param.value, text = param.text;
-        /*#__PURE__*/ return React.createElement("option", {
-            key: val,
-            value: val
-        }, text);
-    })), /*#__PURE__*/ React.createElement("div", {
-        className: classes.arrowDown,
-        "aria-hidden": true
-    }, /*#__PURE__*/ React.createElement(ChevronDownRegular, {
-        size: 20
-    }))) : /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("div", _extends({
-        className: classes.selectContainer,
-        role: "button",
-        "aria-haspopup": "listbox",
-        ref: focusableRef
-    }, !disabled && containerActiveProps), /*#__PURE__*/ React.createElement(TextFieldBase, {
-        style: {
-            visibility: 'hidden'
-        },
         fullWidth: fullWidth,
-        endIcon: /*#__PURE__*/ React.createElement(ChevronDownRegular, {
-            size: 20
-        }),
-        focus: isFocused,
-        label: label,
-        value: value,
-        shrinkLabel: !!(value || valueState),
-        name: name,
-        helperText: helperText,
-        required: !optional,
-        disabled: disabled,
-        id: inputId,
-        error: error,
-        inputRef: inputRef,
-        fieldRef: fieldRef
-    }), /*#__PURE__*/ React.createElement("div", {
-        className: classes.selectText
-    }, getOptionText(value !== null && value !== void 0 ? value : valueState))), optionsShown && /*#__PURE__*/ React.createElement(Overlay, {
-        onPress: function(e) {
-            toggleOptions(false);
-            cancelEvent(e);
-        },
-        disableScroll: true
-    }, /*#__PURE__*/ React.createElement("ul", {
-        onPointerDown: cancelEvent,
-        className: classes.optionsContainer,
-        role: "listbox",
-        ref: optionsMenuRef
-    }, options.map(function(param) {
-        var val = param.value, text = param.text;
-        /*#__PURE__*/ return React.createElement("li", {
-            role: "option",
-            "aria-selected": val === (valueState !== null && valueState !== void 0 ? valueState : value),
-            key: val,
-            "data-value": val,
-            className: classNames(classes.menuItem, _defineProperty({
-            }, classes.menuItemSelected, val === tentativeValueState || val === (valueState !== null && valueState !== void 0 ? valueState : value))),
-            onPointerDown: cancelEvent,
-            onClick: function() {
-                return setValue(val);
-            },
-            ref: function(liRef) {
-                if (liRef) {
-                    optionRefs.current.set(val, liRef);
-                } else {
-                    optionRefs.current.delete(val);
-                }
-            }
-        }, /*#__PURE__*/ React.createElement(Text3, {
-            regular: true
-        }, text));
-    }))));
+        children: [
+            label && /*#__PURE__*/ _jsx(Label, {
+                error: error,
+                forId: inputId,
+                inputState: isFocused ? 'focused' : ((ref15 = value !== null && value !== void 0 ? value : valueState) !== null && ref15 !== void 0 ? ref15 : (ref11 = inputRef.current) === null || ref11 === void 0 ? void 0 : ref11.value) ? 'filled' : 'default',
+                optional: optional,
+                children: label
+            }),
+            /*#__PURE__*/ _jsxs("select", {
+                className: classes.select,
+                id: inputId,
+                "aria-invalid": !!error,
+                value: value,
+                required: !optional,
+                disabled: disabled,
+                onChange: function(e) {
+                    if (onChangeValue) {
+                        onChangeValue(e.target.value);
+                    }
+                },
+                onFocus: function() {
+                    return setIsFocused(true);
+                },
+                onBlur: function(e) {
+                    setIsFocused(false);
+                    onBlur === null || onBlur === void 0 ? void 0 : onBlur(e);
+                },
+                ref: function(actualRef) {
+                    [
+                        inputRef,
+                        focusableRef
+                    ].forEach(function(currentRef) {
+                        // @ts-expect-error current is typed as read-only
+                        currentRef.current = actualRef;
+                    });
+                },
+                style: {
+                    // Override default browser opacity when disabled. This opacity also affects the label.
+                    // Without this fix, the label is invisible when disabled
+                    opacity: 1
+                },
+                children: [
+                    options.every(function(param) {
+                        var value = param.value;
+                        return !!value;
+                    }) && // if no "empty" option exists, insert a dummy empty option
+                    // this is needed to allow a native select with no selected option
+                    /*#__PURE__*/ _jsx("option", {
+                        value: "",
+                        style: {
+                            display: 'none'
+                        }
+                    }),
+                    options.map(function(param) {
+                        var val = param.value, text = param.text;
+                        /*#__PURE__*/ return _jsx("option", {
+                            value: val,
+                            children: text
+                        }, val);
+                    })
+                ]
+            }),
+            /*#__PURE__*/ _jsx("div", {
+                className: classes.arrowDown,
+                "aria-hidden": true,
+                children: /*#__PURE__*/ _jsx(ChevronDownRegular, {
+                    size: 20
+                })
+            })
+        ]
+    }) : /*#__PURE__*/ _jsxs(_Fragment, {
+        children: [
+            /*#__PURE__*/ _jsxs("div", _objectSpread({
+                className: classes.selectContainer,
+                role: "button",
+                "aria-haspopup": "listbox",
+                ref: focusableRef
+            }, !disabled && containerActiveProps, {
+                children: [
+                    /*#__PURE__*/ _jsx(TextFieldBase, {
+                        style: {
+                            visibility: 'hidden'
+                        },
+                        fullWidth: fullWidth,
+                        endIcon: /*#__PURE__*/ _jsx(ChevronDownRegular, {
+                            size: 20
+                        }),
+                        focus: isFocused,
+                        label: label,
+                        value: value,
+                        shrinkLabel: !!(value || valueState),
+                        name: name,
+                        helperText: helperText,
+                        required: !optional,
+                        disabled: disabled,
+                        id: inputId,
+                        error: error,
+                        inputRef: inputRef,
+                        fieldRef: fieldRef
+                    }),
+                    /*#__PURE__*/ _jsx("div", {
+                        className: classes.selectText,
+                        children: getOptionText(value !== null && value !== void 0 ? value : valueState)
+                    })
+                ]
+            })),
+            optionsShown && /*#__PURE__*/ _jsx(Overlay, {
+                onPress: function(e) {
+                    toggleOptions(false);
+                    cancelEvent(e);
+                },
+                disableScroll: true,
+                children: /*#__PURE__*/ _jsx("ul", {
+                    onPointerDown: cancelEvent,
+                    className: classes.optionsContainer,
+                    role: "listbox",
+                    ref: optionsMenuRef,
+                    children: options.map(function(param) {
+                        var val = param.value, text = param.text;
+                        /*#__PURE__*/ return _jsx("li", {
+                            role: "option",
+                            "aria-selected": val === (valueState !== null && valueState !== void 0 ? valueState : value),
+                            "data-value": val,
+                            className: classNames(classes.menuItem, _defineProperty({
+                            }, classes.menuItemSelected, val === tentativeValueState || val === (valueState !== null && valueState !== void 0 ? valueState : value))),
+                            onPointerDown: cancelEvent,
+                            onClick: function() {
+                                return setValue(val);
+                            },
+                            ref: function(liRef) {
+                                if (liRef) {
+                                    optionRefs.current.set(val, liRef);
+                                } else {
+                                    optionRefs.current.delete(val);
+                                }
+                            },
+                            children: /*#__PURE__*/ _jsx(Text3, {
+                                regular: true,
+                                children: text
+                            })
+                        }, val);
+                    })
+                })
+            })
+        ]
+    });
 };
 export default Select;

package/dist-es/skins/blau.js

@@ -59,40 +59,29 @@ export var getBlauSkin = function() {
             borderSelected: palette.blauBlueSecondary60,
             // BUTTONS
             buttonDangerBackground: palette.blauRed,
-            buttonDangerBackgroundDisabled: palette.blauRed20,
             buttonDangerBackgroundSelected: palette.blauRed70,
             buttonDangerBackgroundHover: palette.blauRed70,
             buttonLinkBackgroundSelected: palette.blauPurple10,
             buttonLinkBackgroundSelectedInverse: applyAlpha(palette.white, 0.3),
             buttonPrimaryBackground: palette.blauBlueSecondary,
-            buttonPrimaryBackgroundDisabled: palette.blauBlueSecondary20,
-            buttonPrimaryBackgroundDisabledInverse: palette.blauBlueSecondary30,
             buttonPrimaryBackgroundInverse: palette.white,
             buttonPrimaryBackgroundSelected: palette.blauBlueSecondary60,
             buttonPrimaryBackgroundHover: palette.blauBlueSecondary60,
             buttonPrimaryBackgroundSelectedInverse: palette.blauBluePrimary30,
             buttonSecondaryBackground: palette.blauBlueSecondary,
-            buttonSecondaryBackgroundDisabled: palette.blauBlueSecondary20,
             buttonSecondaryBackgroundSelected: palette.blauBlueSecondary60,
-            buttonSecondaryBorderDisabledInverse: palette.blauBlueSecondary20,
             buttonSecondaryBorderInverse: palette.white,
             buttonSecondaryBorderSelectedInverse: palette.blauBluePrimary30,
             textButtonPrimary: palette.white,
-            textButtonPrimaryDisabled: palette.white,
             textButtonPrimaryInverse: palette.blauBlueSecondary,
-            textButtonPrimaryInverseDisabled: palette.blauBluePrimary10,
             textButtonPrimaryInverseSelected: palette.blauBlueSecondary60,
             textButtonSecondary: palette.blauBlueSecondary,
-            textButtonSecondaryDisabled: palette.blauBlueSecondary30,
             textButtonSecondarySelected: palette.blauBlueSecondary60,
             textButtonSecondaryInverse: palette.white,
-            textButtonSecondaryInverseDisabled: palette.blauBlueSecondary20,
             textButtonSecondaryInverseSelected: palette.white,
             textLink: palette.blauPurple,
             textLinkInverse: palette.white,
             textLinkDanger: palette.blauRed,
-            textLinkDangerDisabled: palette.blauRed20,
-            textLinkDisabled: palette.blauPurple30,
             textLinkSnackbar: palette.blauPurple30,
             // CONTROLS
             control: palette.grey2,
@@ -124,7 +113,6 @@ export var getBlauSkin = function() {
             textPrimaryInverse: palette.white,
             textSecondary: palette.grey5,
             textSecondaryInverse: palette.white,
-            textDisabled: palette.grey3,
             textAmount: palette.blauBlueSecondary,
             // STATES
             error: palette.blauRed,
@@ -157,32 +145,21 @@ export var getBlauSkin = function() {
             borderLight: palette.darkModeBlack,
             border: palette.darkModeGrey,
             // BUTTONS
-            buttonDangerBackgroundDisabled: palette.darkModeGrey,
             buttonLinkBackgroundSelected: applyAlpha(palette.blauPurple, 0.3),
             buttonLinkBackgroundSelectedInverse: applyAlpha(palette.blauPurple, 0.3),
-            buttonPrimaryBackgroundDisabled: palette.darkModeGrey,
-            buttonPrimaryBackgroundDisabledInverse: palette.darkModeGrey,
             buttonPrimaryBackgroundInverse: palette.blauBlueSecondary,
             buttonPrimaryBackgroundSelected: palette.blauBlueSecondary60,
-            buttonSecondaryBackgroundDisabled: palette.darkModeGrey,
-            buttonSecondaryBorderDisabledInverse: palette.darkModeGrey,
             buttonSecondaryBorderInverse: palette.blauBluePrimary,
             buttonSecondaryBorderSelectedInverse: palette.blauBlueSecondary60,
             textButtonPrimary: palette.grey2,
-            textButtonPrimaryDisabled: palette.grey5,
             textButtonPrimaryInverse: palette.grey2,
-            textButtonPrimaryInverseDisabled: palette.grey5,
             textButtonPrimaryInverseSelected: palette.grey2,
             textButtonSecondary: palette.grey2,
-            textButtonSecondaryDisabled: palette.grey5,
             textButtonSecondarySelected: palette.blauBlueSecondary60,
             textButtonSecondaryInverse: palette.grey2,
-            textButtonSecondaryInverseDisabled: palette.grey5,
             textButtonSecondaryInverseSelected: palette.blauBlueSecondary60,
             textLink: palette.blauPurple30,
             textLinkInverse: palette.blauPurple30,
-            textLinkDisabled: palette.grey5,
-            textLinkDangerDisabled: palette.grey5,
             // CONTROLS
             control: palette.darkModeGrey,
             loadingBar: palette.blauBluePrimary,
@@ -205,7 +182,6 @@ export var getBlauSkin = function() {
             textPrimaryInverse: palette.grey2,
             textSecondary: palette.grey4,
             textSecondaryInverse: palette.grey4,
-            textDisabled: palette.grey5,
             textAmount: palette.blauBlueSecondary,
             textNavigationBarPrimary: palette.grey2,
             textNavigationBarSecondary: palette.grey4,

package/dist-es/skins/movistar.js

@@ -57,40 +57,29 @@ export var getMovistarSkin = function(variant) {
             borderSelected: palette.movistarGreen,
             // BUTTONS
             buttonDangerBackground: palette.pepper,
-            buttonDangerBackgroundDisabled: palette.pepperLight30,
             buttonDangerBackgroundSelected: palette.pepperDark,
             buttonDangerBackgroundHover: palette.pepperDark,
             buttonLinkBackgroundSelected: palette.movistarBlueLight10,
             buttonLinkBackgroundSelectedInverse: applyAlpha(palette.white, 0.2),
             buttonPrimaryBackground: palette.movistarGreen,
-            buttonPrimaryBackgroundDisabled: palette.movistarGreenLight50,
-            buttonPrimaryBackgroundDisabledInverse: palette.movistarBlueLight50,
             buttonPrimaryBackgroundInverse: palette.white,
             buttonPrimaryBackgroundSelected: palette.movistarGreenDark,
             buttonPrimaryBackgroundHover: palette.movistarGreenDark,
             buttonPrimaryBackgroundSelectedInverse: palette.movistarBlueLight50,
             buttonSecondaryBackground: palette.movistarGreen,
-            buttonSecondaryBackgroundDisabled: palette.movistarGreenLight50,
             buttonSecondaryBackgroundSelected: palette.movistarGreenDark,
-            buttonSecondaryBorderDisabledInverse: palette.movistarBlueLight50,
             buttonSecondaryBorderInverse: palette.white,
             buttonSecondaryBorderSelectedInverse: palette.movistarBlueLight50,
             textButtonPrimary: palette.white,
-            textButtonPrimaryDisabled: palette.white,
             textButtonPrimaryInverse: palette.movistarBlue,
-            textButtonPrimaryInverseDisabled: palette.movistarBlueLight30,
             textButtonPrimaryInverseSelected: palette.movistarBlue,
             textButtonSecondary: palette.movistarGreen,
-            textButtonSecondaryDisabled: palette.movistarGreenLight50,
             textButtonSecondarySelected: palette.movistarGreenDark,
             textButtonSecondaryInverse: palette.white,
-            textButtonSecondaryInverseDisabled: palette.movistarBlueLight50,
             textButtonSecondaryInverseSelected: palette.white,
             textLink: palette.movistarBlue,
             textLinkInverse: palette.white,
             textLinkDanger: palette.pepper,
-            textLinkDangerDisabled: palette.pepperLight30,
-            textLinkDisabled: palette.movistarBlueLight50,
             textLinkSnackbar: palette.movistarBlueLight50,
             // CONTROLS
             control: palette.grey3,
@@ -122,7 +111,6 @@ export var getMovistarSkin = function(variant) {
             textPrimaryInverse: palette.white,
             textSecondary: palette.grey5,
             textSecondaryInverse: palette.white,
-            textDisabled: palette.grey4,
             textAmount: palette.movistarBlue,
             // STATES
             error: palette.pepper,
@@ -151,36 +139,26 @@ export var getMovistarSkin = function(variant) {
             skeletonWave: palette.grey5,
             borderLight: palette.darkModeBlack,
             border: palette.darkModeGrey,
-            buttonDangerBackgroundDisabled: applyAlpha(palette.white, 0.05),
             buttonLinkBackgroundSelected: applyAlpha(palette.white, 0.05),
             buttonLinkBackgroundSelectedInverse: applyAlpha(palette.white, 0.05),
             buttonPrimaryBackground: palette.movistarGreen,
-            buttonPrimaryBackgroundDisabled: applyAlpha(palette.white, 0.05),
-            buttonPrimaryBackgroundDisabledInverse: applyAlpha(palette.white, 0.05),
             buttonPrimaryBackgroundInverse: palette.movistarGreen,
             buttonPrimaryBackgroundSelected: palette.movistarGreenDark,
             buttonPrimaryBackgroundHover: palette.movistarGreenDark,
             buttonPrimaryBackgroundSelectedInverse: palette.movistarGreenDark,
             buttonSecondaryBackground: palette.movistarGreen,
-            buttonSecondaryBackgroundDisabled: applyAlpha(palette.white, 0.05),
             buttonSecondaryBackgroundSelected: palette.movistarGreenDark,
-            buttonSecondaryBorderDisabledInverse: applyAlpha(palette.white, 0.05),
             buttonSecondaryBorderInverse: palette.movistarGreen,
             buttonSecondaryBorderSelectedInverse: palette.movistarGreenDark,
             textButtonPrimary: palette.grey2,
-            textButtonPrimaryDisabled: palette.grey5,
             textButtonPrimaryInverse: palette.grey2,
-            textButtonPrimaryInverseDisabled: palette.grey5,
             textButtonPrimaryInverseSelected: palette.grey2,
             textButtonSecondary: palette.grey2,
-            textButtonSecondaryDisabled: palette.grey5,
             textButtonSecondarySelected: palette.grey4,
             textButtonSecondaryInverse: palette.grey2,
-            textButtonSecondaryInverseDisabled: palette.grey5,
             textButtonSecondaryInverseSelected: palette.grey4,
             textLink: palette.movistarBlue,
             textLinkInverse: palette.movistarBlue,
-            textLinkDisabled: palette.grey6,
             control: palette.grey6,
             controlActivated: palette.movistarBlue,
             loadingBar: palette.movistarBlue,
@@ -200,7 +178,6 @@ export var getMovistarSkin = function(variant) {
             textPrimaryInverse: palette.grey2,
             textSecondary: palette.grey4,
             textSecondaryInverse: palette.grey4,
-            textDisabled: palette.grey5,
             textAmount: palette.movistarBlueLight50,
             textNavigationBarPrimary: palette.grey2,
             textNavigationBarSecondary: palette.grey4,

package/dist-es/skins/o2-classic.js

@@ -63,40 +63,29 @@ export var getO2ClassicSkin = function() {
             borderSelected: palette.o2Gem,
             // BUTTONS
             buttonDangerBackground: palette.pepper,
-            buttonDangerBackgroundDisabled: palette.pepperLight30,
             buttonDangerBackgroundSelected: palette.pepperDark,
             buttonDangerBackgroundHover: palette.pepperDark,
             buttonLinkBackgroundSelected: palette.o2SkyBlueLight10,
             buttonLinkBackgroundSelectedInverse: applyAlpha(palette.white, 0.2),
             buttonPrimaryBackground: palette.o2SkyBlue,
-            buttonPrimaryBackgroundDisabled: palette.o2SkyBlueLight50,
-            buttonPrimaryBackgroundDisabledInverse: palette.o2SkyBlueLight50,
             buttonPrimaryBackgroundInverse: palette.white,
             buttonPrimaryBackgroundSelected: palette.o2SkyBlueDark,
             buttonPrimaryBackgroundHover: palette.o2SkyBlueDark,
             buttonPrimaryBackgroundSelectedInverse: palette.o2SkyBlueLight50,
             buttonSecondaryBackground: palette.o2SkyBlue,
-            buttonSecondaryBackgroundDisabled: palette.o2SkyBlueLight50,
             buttonSecondaryBackgroundSelected: palette.o2SkyBlueDark,
-            buttonSecondaryBorderDisabledInverse: palette.o2SkyBlueLight50,
             buttonSecondaryBorderInverse: palette.white,
             buttonSecondaryBorderSelectedInverse: palette.o2SkyBlueLight50,
             textButtonPrimary: palette.white,
-            textButtonPrimaryDisabled: palette.white,
             textButtonPrimaryInverse: palette.o2SkyBlue,
-            textButtonPrimaryInverseDisabled: palette.o2SkyBlueLight30,
             textButtonPrimaryInverseSelected: palette.o2SkyBlue,
             textButtonSecondary: palette.o2SkyBlue,
-            textButtonSecondaryDisabled: palette.o2SkyBlueLight50,
             textButtonSecondarySelected: palette.o2SkyBlueDark,
             textButtonSecondaryInverse: palette.white,
-            textButtonSecondaryInverseDisabled: palette.o2SkyBlueLight50,
             textButtonSecondaryInverseSelected: palette.white,
             textLink: palette.o2SkyBlue,
             textLinkInverse: palette.white,
             textLinkDanger: palette.pepper,
-            textLinkDangerDisabled: palette.pepperLight30,
-            textLinkDisabled: palette.o2SkyBlueLight,
             textLinkSnackbar: palette.o2SkyBlueLight,
             // CONTROLS
             control: palette.grey3,
@@ -130,7 +119,6 @@ export var getO2ClassicSkin = function() {
             textPrimaryInverse: palette.white,
             textSecondary: palette.grey5,
             textSecondaryInverse: palette.white,
-            textDisabled: palette.grey4,
             textAmount: palette.o2SkyBlue,
             // STATES
             error: palette.pepper,
@@ -160,32 +148,21 @@ export var getO2ClassicSkin = function() {
             border: palette.darkModeGrey,
             borderDark: palette.grey5,
             borderSelected: palette.o2Gem,
-            buttonDangerBackgroundDisabled: applyAlpha(palette.white, 0.05),
             buttonLinkBackgroundSelected: applyAlpha(palette.white, 0.05),
             buttonLinkBackgroundSelectedInverse: applyAlpha(palette.white, 0.05),
-            buttonPrimaryBackgroundDisabled: applyAlpha(palette.white, 0.05),
-            buttonPrimaryBackgroundDisabledInverse: applyAlpha(palette.white, 0.05),
             buttonPrimaryBackgroundInverse: palette.o2SkyBlue,
             buttonPrimaryBackgroundSelectedInverse: palette.o2SkyBlueDark,
-            buttonSecondaryBackgroundDisabled: applyAlpha(palette.white, 0.05),
-            buttonSecondaryBorderDisabledInverse: applyAlpha(palette.white, 0.05),
             buttonSecondaryBorderInverse: palette.o2SkyBlue,
             buttonSecondaryBorderSelectedInverse: palette.o2SkyBlueDark,
             textButtonPrimary: palette.grey2,
-            textButtonPrimaryDisabled: palette.grey5,
             textButtonPrimaryInverse: palette.grey2,
-            textButtonPrimaryInverseDisabled: palette.grey5,
             textButtonPrimaryInverseSelected: palette.grey2,
             textButtonSecondary: palette.grey2,
-            textButtonSecondaryDisabled: palette.grey5,
             textButtonSecondarySelected: palette.grey4,
             textButtonSecondaryInverse: palette.grey2,
-            textButtonSecondaryInverseDisabled: palette.grey5,
             textButtonSecondaryInverseSelected: palette.grey4,
             textLink: palette.o2SkyBlueLight,
             textLinkInverse: palette.o2SkyBlueLight,
-            textLinkDangerDisabled: palette.grey5,
-            textLinkDisabled: palette.darkModeGrey6,
             textLinkSnackbar: palette.o2SkyBlueLight,
             control: palette.darkModeGrey6,
             controlActivated: palette.o2Gem,
@@ -210,7 +187,6 @@ export var getO2ClassicSkin = function() {
             textPrimaryInverse: palette.grey2,
             textSecondary: palette.grey4,
             textSecondaryInverse: palette.grey4,
-            textDisabled: palette.grey5,
             textAmount: palette.o2SkyBlueLight50,
             textNavigationBarPrimary: palette.grey2,
             textNavigationBarSecondary: palette.grey4,