@atlaskit/datetime-picker/dist/cjs/internal/fixed-layer.js

A date time picker allows the user to select an associated date and time.

/* fixed-layer.tsx generated by @compiled/babel-plugin v3.0.2 */
"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
require("./fixed-layer.compiled.css");
var _runtime = require("@compiled/react/runtime");
var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _react = _interopRequireDefault(require("react"));
var _noop = _interopRequireDefault(require("@atlaskit/ds-lib/noop"));
var _default = require("@atlaskit/icon/constants/default");
var _manager = require("@atlaskit/popper/manager");
var _main = require("@atlaskit/popper/main");
var _reference = require("@atlaskit/popper/reference");
function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2.default)(o), (0, _possibleConstructorReturn2.default)(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2.default)(t).constructor) : o.apply(t, e)); }
function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
var styles = {
  root: "_bfhk1j28 _kqswstnw _152tze3t",
  popperStyles: "_1pbyowjs"
};
/**
 * This component renders layered content with fixed positioning.
 * Scroll is locked outside the layer to prevent the layered content from detaching from the
 * container ref.
 */
// eslint-disable-next-line @repo/internal/react/no-class-components
var FixedLayer = exports.default = /*#__PURE__*/function (_React$Component) {
  function FixedLayer() {
    var _this;
    (0, _classCallCheck2.default)(this, FixedLayer);
    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }
    _this = _callSuper(this, FixedLayer, [].concat(args));
    (0, _defineProperty2.default)(_this, "update", _noop.default);
    return _this;
  }
  (0, _inherits2.default)(FixedLayer, _React$Component);
  return (0, _createClass2.default)(FixedLayer, [{
    key: "componentDidUpdate",
    value: function componentDidUpdate(prevProps) {
      if (prevProps.inputValue !== this.props.inputValue) {
        this.update();
      }
    }
  }, {
    key: "render",
    value: function render() {
      var _this2 = this;
      var _this$props = this.props,
        containerRef = _this$props.containerRef,
        content = _this$props.content,
        testId = _this$props.testId;

      // Wait for containerRef callback to cause a re-render
      if (!containerRef) {
        return /*#__PURE__*/_react.default.createElement("div", null);
      }
      var divStyles = {
        height: containerRef.getBoundingClientRect().height,
        // Don't block the clear button
        width: containerRef.getBoundingClientRect().width - parseInt(_default.sizes.small.slice(0, -2)) - 8
      };
      return (
        /*#__PURE__*/
        /* Need to wrap layer in a fixed position div so that it will render its content as fixed
         * We need to set the intial top value to where the container is and zIndex so that it still
         * applies since we're creating a new stacking context. */
        _react.default.createElement(_manager.Manager, null, /*#__PURE__*/_react.default.createElement(_reference.Reference, null, function (_ref) {
          var ref = _ref.ref;
          return /*#__PURE__*/_react.default.createElement("div", {
            ref: ref,
            "data-layer-child": true,
            style: divStyles,
            className: (0, _runtime.ax)([styles.root])
          });
        }), /*#__PURE__*/_react.default.createElement(_main.Popper, null, function (_ref2) {
          var ref = _ref2.ref,
            style = _ref2.style,
            update = _ref2.update;
          _this2.update = update;
          return /*#__PURE__*/_react.default.createElement("div", {
            ref: ref,
            style: style,
            "data-testid": testId && "".concat(testId, "--popper--container"),
            className: (0, _runtime.ax)([styles.popperStyles])
          }, content);
        }))
      );
    }
  }]);
}(_react.default.Component);