@enact/sandstone/Skinnable/Skinnable.js

Large-screen/TV support library for Enact, containing a variety of UI components.

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = exports.Skinnable = void 0;
var _hoc = _interopRequireDefault(require("@enact/core/hoc"));
var _Skinnable = _interopRequireDefault(require("@enact/ui/Skinnable"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
/**
 * Exports the {@link sandstone/Skinnable.Skinnable} higher-order component (HOC).
 *
 * @module sandstone/Skinnable
 * @exports Skinnable
 * @public
 */

var defaultConfig = {
  skins: {
    neutral: 'neutral',
    light: 'light',
    game: 'game'
  },
  allowedVariants: ['focusRing', 'highContrast', 'largeText', 'grayscale'],
  defaultVariants: null
};

/**
 * This higher-order component is based on {@link ui/Skinnable.Skinnable|ui/Skinnable}.
 *
 * `Skinnable` comes pre-configured for Sandstone's supported skins: "neutral" (default) and "light".
 * It is used to apply the relevant skinning classes to each component and has been used to
 * pre-select specific skins for some components.
 *
 * Note: This HoC passes `className` to the wrapped component. It must be passed to the main DOM
 * node.
 *
 * @class Skinnable
 * @memberof sandstone/Skinnable
 * @extends ui/Skinnable.Skinnable
 * @hoc
 * @public
 */
var Skinnable = exports.Skinnable = (0, _hoc["default"])(defaultConfig, _Skinnable["default"]);

/**
 * Select a skin by name by specifying this property.
 *
 * Available Sandstone skins are `"neutral"` (default) and `"light"`. This may be changed at runtime.
 * All components already use their defaults, but a skin may be changed via this prop or by using
 * `Skinnable` directly and a config object.
 *
 * Example:
 * ```
 * <Button skin="light">
 * ```
 *
 * @name skin
 * @type {String}
 * @default 'neutral'
 * @memberof sandstone/Skinnable.Skinnable
 * @instance
 * @public
 */
var _default = exports["default"] = Skinnable;