calcite-react/Drawer/Drawer-styled.js

Calcite components for React

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.StyledDrawerNav = exports.StyledDrawer = void 0;

var _styledComponents = _interopRequireWildcard(require("styled-components"));

var _helpers = require("../utils/helpers");

var _CalciteThemeProvider = require("../CalciteThemeProvider");

function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj.default = obj; return newObj; } }

// Copyright 2019 Esri
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
// http://www.apache.org/licenses/LICENSE-2.0
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.​
// styled-components
// Utils, common elements
// Calcite theme and Esri colors
// Calcite components
// Icons
// Third party libraries
var StyledDrawer = _styledComponents.default.div.withConfig({
  displayName: "StyledDrawer",
  componentId: "jf1c3e-0"
})(["position:fixed;top:0;right:0;bottom:0;left:0;visibility:hidden;overflow:hidden;opacity:0;background:", ";transition:", ";z-index:1001;", ";"], function (props) {
  return props.theme.palette.transparentBlack;
}, (0, _helpers.transition)('opacity'), function (props) {
  return props.active && (0, _styledComponents.css)(["visibility:visible;opacity:1;background-color:", ";"], function (props) {
    return props.theme.palette.transparentBlack;
  });
});

exports.StyledDrawer = StyledDrawer;
StyledDrawer.defaultProps = {
  theme: _CalciteThemeProvider.CalciteTheme
};

var StyledDrawerNav = _styledComponents.default.nav.withConfig({
  displayName: "StyledDrawerNav",
  componentId: "jf1c3e-1"
})(["position:absolute;top:0;left:-", "px;height:100%;width:", "px;margin:0;padding:0;list-style:none;background:", ";overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;transition:", ";html[dir='rtl'] &{left:auto;right:-", "px;}", ";", ";"], function (props) {
  return props.drawerWidth;
}, function (props) {
  return props.drawerWidth;
}, function (props) {
  return props.theme.palette.white;
}, (0, _helpers.transition)('all'), function (props) {
  return props.drawerWidth;
}, function (props) {
  return props.right && (0, _styledComponents.css)(["left:auto;right:-", "px;html[dir='rtl'] &{left:-", "px;right:auto;}"], function (props) {
    return props.drawerWidth;
  }, function (props) {
    return props.drawerWidth;
  });
}, function (props) {
  return props.active && (0, _styledComponents.css)(["left:0;html[dir='rtl'] &{left:auto;right:0;}", ";"], props.right && (0, _styledComponents.css)(["left:auto;right:0;html[dir='rtl'] &{left:0;right:auto;}"]));
});

exports.StyledDrawerNav = StyledDrawerNav;
StyledDrawerNav.defaultProps = {
  theme: _CalciteThemeProvider.CalciteTheme
};