calcite-react
Version:
Calcite components for React
264 lines (229 loc) • 12.9 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.StyledSignOutButton = exports.StyledSwitchAccountButton = exports.StyledArcgisAccountMenuItem = exports.StyledArcgisAccountSignInMenu = exports.StyledArcgisAccountContentMenu = exports.StyledArcgisAccountContentGroup = exports.StyledArcgisAccountContentId = exports.StyledArcgisAccountContentName = exports.StyledArcgisAccountContentInfo = exports.StyledArcgisAccountContent = exports.StyledArcgisAccountMenu = exports.StyledArcgisAccountControlUsername = exports.StyledArcgisAccountControlFriendlyName = exports.StyledArcgisAccountControlNames = exports.StyledArcgisAccountControlAvatar = exports.StyledArcgisAccountControl = void 0;
var _styledComponents = _interopRequireWildcard(require("styled-components"));
var _helpers = require("../utils/helpers");
var _CalciteThemeProvider = require("../CalciteThemeProvider");
var _Button = _interopRequireDefault(require("../Button"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
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 StyledArcgisAccountControl = _styledComponents.default.div.withConfig({
displayName: "StyledArcgisAccountControl",
componentId: "sc-1olvy1r-0"
})(["display:flex;align-items:center;color:", ";cursor:pointer;height:62px;max-width:260px;padding:", " ", " ", " ", ";box-sizing:border-box;border-left:1px solid ", ";transition:all 225ms cubic-bezier(0.4,0,0.2,1);html[dir='rtl'] &{padding:", " ", " ", " ", ";border-left:initial;border-right:1px solid ", ";}&:hover{color:", ";box-shadow:inset 0 -3px 0 0 ", ";}&:active{color:", ";box-shadow:inset 0 -3px 0 0 ", ";}", ";"], function (props) {
return props.theme.palette.darkestGray;
}, function (props) {
return (0, _helpers.unitCalc)(props.theme.baseline, 2, '/');
}, function (props) {
return props.theme.baseline;
}, function (props) {
return (0, _helpers.unitCalc)(props.theme.baseline, 2, '/');
}, function (props) {
return (0, _helpers.unitCalc)(props.theme.baseline, 1.5, '/');
}, function (props) {
return props.theme.palette.lighterGray;
}, function (props) {
return (0, _helpers.unitCalc)(props.theme.baseline, 2, '/');
}, function (props) {
return (0, _helpers.unitCalc)(props.theme.baseline, 1.5, '/');
}, function (props) {
return (0, _helpers.unitCalc)(props.theme.baseline, 2, '/');
}, function (props) {
return props.theme.baseline;
}, function (props) {
return props.theme.palette.lighterGray;
}, function (props) {
return props.theme.palette.black;
}, function (props) {
return props.theme.palette.lighterBlue;
}, function (props) {
return props.theme.palette.black;
}, function (props) {
return props.theme.palette.blue;
}, function (props) {
return props.open && (0, _styledComponents.css)(["&,&:hover{color:", ";box-shadow:inset 0 -3px 0 0 ", ";}"], function (props) {
return props.theme.palette.black;
}, function (props) {
return props.theme.palette.blue;
});
});
exports.StyledArcgisAccountControl = StyledArcgisAccountControl;
StyledArcgisAccountControl.defaultProps = {
theme: _CalciteThemeProvider.CalciteTheme
};
var StyledArcgisAccountControlAvatar = _styledComponents.default.div.withConfig({
displayName: "StyledArcgisAccountControlAvatar",
componentId: "sc-1olvy1r-1"
})(["margin-right:", ";html[dir='rtl'] &{margin-right:initial;margin-left:", ";}"], function (props) {
return (0, _helpers.unitCalc)(props.theme.baseline, 2, '/');
}, function (props) {
return (0, _helpers.unitCalc)(props.theme.baseline, 2, '/');
});
exports.StyledArcgisAccountControlAvatar = StyledArcgisAccountControlAvatar;
StyledArcgisAccountControlAvatar.defaultProps = {
theme: _CalciteThemeProvider.CalciteTheme
};
var StyledArcgisAccountControlNames = _styledComponents.default.div.withConfig({
displayName: "StyledArcgisAccountControlNames",
componentId: "sc-1olvy1r-2"
})(["flex:1 0 50px;display:flex;flex-direction:column;"]);
exports.StyledArcgisAccountControlNames = StyledArcgisAccountControlNames;
StyledArcgisAccountControlNames.defaultProps = {
theme: _CalciteThemeProvider.CalciteTheme
};
var StyledArcgisAccountControlFriendlyName = _styledComponents.default.span.withConfig({
displayName: "StyledArcgisAccountControlFriendlyName",
componentId: "sc-1olvy1r-3"
})(["font-weight:600;", ";line-height:20px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;max-width:170px;"], (0, _helpers.fontSize)(-1));
exports.StyledArcgisAccountControlFriendlyName = StyledArcgisAccountControlFriendlyName;
StyledArcgisAccountControlFriendlyName.defaultProps = {
theme: _CalciteThemeProvider.CalciteTheme
};
var StyledArcgisAccountControlUsername = _styledComponents.default.span.withConfig({
displayName: "StyledArcgisAccountControlUsername",
componentId: "sc-1olvy1r-4"
})(["font-weight:300;", ";line-height:16px;"], (0, _helpers.fontSize)(-2));
exports.StyledArcgisAccountControlUsername = StyledArcgisAccountControlUsername;
StyledArcgisAccountControlUsername.defaultProps = {
theme: _CalciteThemeProvider.CalciteTheme
};
var StyledArcgisAccountMenu = _styledComponents.default.div.withConfig({
displayName: "StyledArcgisAccountMenu",
componentId: "sc-1olvy1r-5"
})(["background:", ";box-shadow:", ";border-radius:", ";"], function (props) {
return props.theme.palette.white;
}, function (props) {
return props.theme.boxShadow;
}, function (props) {
return props.theme.borderRadius;
});
exports.StyledArcgisAccountMenu = StyledArcgisAccountMenu;
StyledArcgisAccountMenu.defaultProps = {
theme: _CalciteThemeProvider.CalciteTheme
};
var StyledArcgisAccountContent = _styledComponents.default.div.withConfig({
displayName: "StyledArcgisAccountContent",
componentId: "sc-1olvy1r-6"
})(["display:flex;min-height:210px;padding-top:", ";"], function (props) {
return (0, _helpers.unitCalc)(props.theme.baseline, 2, '*');
});
exports.StyledArcgisAccountContent = StyledArcgisAccountContent;
StyledArcgisAccountContent.defaultProps = {
theme: _CalciteThemeProvider.CalciteTheme
};
var StyledArcgisAccountContentInfo = _styledComponents.default.div.withConfig({
displayName: "StyledArcgisAccountContentInfo",
componentId: "sc-1olvy1r-7"
})(["display:flex;flex-direction:column;justify-content:center;align-items:center;flex:1 0 50px;"]);
exports.StyledArcgisAccountContentInfo = StyledArcgisAccountContentInfo;
StyledArcgisAccountContentInfo.defaultProps = {
theme: _CalciteThemeProvider.CalciteTheme
};
var StyledArcgisAccountContentName = _styledComponents.default.span.withConfig({
displayName: "StyledArcgisAccountContentName",
componentId: "sc-1olvy1r-8"
})(["", ";font-weight:600;word-break:break-word;text-align:center;display:inline-block;margin-bottom:", ";"], (0, _helpers.fontSize)(1), function (props) {
return (0, _helpers.unitCalc)(props.theme.baseline, 2, '/');
});
exports.StyledArcgisAccountContentName = StyledArcgisAccountContentName;
StyledArcgisAccountContentName.defaultProps = {
theme: _CalciteThemeProvider.CalciteTheme
};
var StyledArcgisAccountContentId = _styledComponents.default.span.withConfig({
displayName: "StyledArcgisAccountContentId",
componentId: "sc-1olvy1r-9"
})(["", ";font-weight:300;line-height:20px;"], (0, _helpers.fontSize)(-2));
exports.StyledArcgisAccountContentId = StyledArcgisAccountContentId;
StyledArcgisAccountContentId.defaultProps = {
theme: _CalciteThemeProvider.CalciteTheme
};
var StyledArcgisAccountContentGroup = _styledComponents.default.span.withConfig({
displayName: "StyledArcgisAccountContentGroup",
componentId: "sc-1olvy1r-10"
})(["", ";font-weight:300;line-height:20px;margin-bottom:", ";text-align:center;padding:0 ", ";"], (0, _helpers.fontSize)(-2), function (props) {
return (0, _helpers.unitCalc)(props.theme.baseline, 1.5, '*');
}, function (props) {
return (0, _helpers.unitCalc)(props.theme.baseline, 4, '/');
});
exports.StyledArcgisAccountContentGroup = StyledArcgisAccountContentGroup;
StyledArcgisAccountContentGroup.defaultProps = {
theme: _CalciteThemeProvider.CalciteTheme
};
var StyledArcgisAccountContentMenu = _styledComponents.default.div.withConfig({
displayName: "StyledArcgisAccountContentMenu",
componentId: "sc-1olvy1r-11"
})(["flex:1 0 30px;padding-left:", ";padding-right:", ";display:flex;flex-direction:column;align-items:flex-start;html[dir='rtl'] &{padding-left:", ";padding-right:", ";}"], function (props) {
return (0, _helpers.unitCalc)(props.theme.baseline, 2, '/');
}, function (props) {
return props.theme.baseline;
}, function (props) {
return props.theme.baseline;
}, function (props) {
return (0, _helpers.unitCalc)(props.theme.baseline, 2, '/');
});
exports.StyledArcgisAccountContentMenu = StyledArcgisAccountContentMenu;
StyledArcgisAccountContentMenu.defaultProps = {
theme: _CalciteThemeProvider.CalciteTheme
};
var StyledArcgisAccountSignInMenu = _styledComponents.default.div.withConfig({
displayName: "StyledArcgisAccountSignInMenu",
componentId: "sc-1olvy1r-12"
})(["display:flex;"]);
exports.StyledArcgisAccountSignInMenu = StyledArcgisAccountSignInMenu;
StyledArcgisAccountSignInMenu.defaultProps = {
theme: _CalciteThemeProvider.CalciteTheme
};
var StyledArcgisAccountMenuItem = _styledComponents.default.a.withConfig({
displayName: "StyledArcgisAccountMenuItem",
componentId: "sc-1olvy1r-13"
})(["cursor:pointer;text-decoration:none;color:", ";display:block;", ";line-height:20px;font-weight:300;padding:5px 0;position:relative;&::after{right:-8px;opacity:0;position:absolute;width:12px;height:12px;transition:opacity 0.25s,transform 0.25s;background-color:", ";", ";top:calc(50% - 20px / 2);}&:hover{color:", ";&::after{opacity:1;transform:translateX(10px);html[dir='rtl'] &{transform:translateX(-10px);}}}"], function (props) {
return props.theme.palette.blue;
}, (0, _helpers.fontSize)(0), function (props) {
return props.theme.palette.white;
}, function (props) {
return props && (0, _styledComponents.css)(["content:", ";html[dir='rtl'] &{right:auto;left:-8px;content:", ";}"], "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cpolygon points='8 13.3 13.3 8 0 8 0 7 13.3 7 8 1.7 8 0.3 15.2 7.5 8 14.7' fill='".concat(props.theme.palette.darkBlue.replace('#', '%23'), "' %3E%3C/polygon%3E%3C/svg%3E\")"), "url(\"data:image/svg+xml,%3Csvg viewBox='0 0 16 16' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cpolygon points='8 13.3 8 14.7 0.8 7.5 8 0.3 8 1.7 2.7 7 16 7 16 8 2.7 8' fill='".concat(props.theme.palette.darkBlue.replace('#', '%23'), "' %3E%3C/polygon%3E%3C/svg%3E\")"));
}, function (props) {
return props.theme.palette.darkBlue;
});
exports.StyledArcgisAccountMenuItem = StyledArcgisAccountMenuItem;
StyledArcgisAccountMenuItem.defaultProps = {
theme: _CalciteThemeProvider.CalciteTheme
};
var StyledSwitchAccountButton = (0, _styledComponents.default)(_Button.default).withConfig({
displayName: "StyledSwitchAccountButton",
componentId: "sc-1olvy1r-14"
})(["flex:1 0 50px;white-space:normal;border-radius:0 0 0 ", ";"], function (props) {
return props.theme.borderRadius;
});
exports.StyledSwitchAccountButton = StyledSwitchAccountButton;
StyledSwitchAccountButton.defaultProps = {
theme: _CalciteThemeProvider.CalciteTheme
};
var StyledSignOutButton = (0, _styledComponents.default)(_Button.default).withConfig({
displayName: "StyledSignOutButton",
componentId: "sc-1olvy1r-15"
})(["flex:1 0 50px;white-space:normal;margin-left:0;border-radius:0 0 ", " 0;"], function (props) {
return props.theme.borderRadius;
});
exports.StyledSignOutButton = StyledSignOutButton;
StyledSignOutButton.defaultProps = {
theme: _CalciteThemeProvider.CalciteTheme
};