@ntragas/pouncejstest/dist/cjs/components/utils/Input/InputLabel.js

A collection of UI components from Panther labs

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

exports.__esModule = true;
exports.default = void 0;

var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));

var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));

var _react = _interopRequireDefault(require("react"));

var _InputContext = require("./InputContext");

var _Box = _interopRequireDefault(require("../../Box"));

var InputLabel = function InputLabel(_ref) {
  var _ref$raised = _ref.raised,
      raised = _ref$raised === void 0 ? true : _ref$raised,
      rest = (0, _objectWithoutPropertiesLoose2.default)(_ref, ["raised"]);

  var _useInputContext = (0, _InputContext.useInputContext)(),
      invalid = _useInputContext.invalid;

  return /*#__PURE__*/_react.default.createElement(_Box.default, (0, _extends2.default)({
    as: "label",
    pointerEvents: "none",
    fontSize: "medium",
    px: 4,
    color: invalid ? 'red-300' : 'gray-300',
    top: 0,
    left: 0,
    position: "absolute",
    transformOrigin: "center left",
    transform: raised ? 'translate(6px, 4px) scale(0.65)' : 'translate(0, 14px) scale(1)',
    transition: "transform 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms",
    fontWeight: raised ? 'medium' : 'normal'
  }, rest));
};

var _default = InputLabel;
exports.default = _default;