UNPKG

@braineet/ui

Version:

Braineet design system

129 lines (128 loc) 5.83 kB
"use strict"; exports.__esModule = true; exports.appareances = exports.Wrapper = exports.Wrap = exports.Title = exports.StyledIcon = exports.Description = exports.Cross = exports.ActionWrapper = exports.ActionButton = void 0; var _styledComponents = _interopRequireWildcard(require("styled-components")); var _styledSystem = require("styled-system"); var _box = _interopRequireDefault(require("../box")); var _button = _interopRequireDefault(require("../button")); var _heading = _interopRequireDefault(require("../heading")); var _icon = _interopRequireDefault(require("../icon")); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); } function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; } var appareances = function appareances(color, theme) { var v = { default: theme.colors.black50, action: theme.colors.action, error: theme.colors.error, success: theme.colors.success, warning: theme.colors.warning }; if (!v[color]) return color; return v[color]; }; exports.appareances = appareances; var Wrapper = (0, _styledComponents.default)(_box.default).withConfig({ displayName: "styles__Wrapper", componentId: "sc-yqr45k-0" })(["display:flex;justify-content:space-between;width:100%;width:320px;min-height:50px;height:100%;align-items:stretch;background:#ffffff;box-shadow:0px 8px 16px -8px rgba(42,45,74,0.32);border-radius:4px;", " ", ";"], (0, _styledSystem.variant)({ variants: { default: { padding: '0.5rem', cursor: 'pointer' }, actions: { cursor: 'default', padding: 0 } } }), function (p) { return p.appareance !== 'default' && (0, _styledComponents.css)(["&:before{content:'';position:absolute;left:0;top:0;bottom:0;height:100%;width:4px;background:", ";border-radius:4px 0 0 4px;}"], appareances(p.appareance, p.theme)); }); exports.Wrapper = Wrapper; var Wrap = _styledComponents.default.div.withConfig({ displayName: "styles__Wrap", componentId: "sc-yqr45k-1" })(["display:flex;flex-direction:column;line-height:1em;padding:4px;"]); exports.Wrap = Wrap; var Title = (0, _styledComponents.default)(_heading.default).attrs(function () { return { size: 'xs' }; }).withConfig({ displayName: "styles__Title", componentId: "sc-yqr45k-2" })(["color:", ";", ""], function (p) { return p.theme.colors.black50; }, (0, _styledSystem.variant)({ variants: { default: {}, actions: { display: '-webkit-box', '-webkit-line-clamp': '1', '-webkit-box-orient': 'vertical', overflow: 'hidden', maxHeight: '40px' } } })); exports.Title = Title; var Description = _styledComponents.default.div.withConfig({ displayName: "styles__Description", componentId: "sc-yqr45k-3" })(["color:", ";font-size:12px;", ""], function (p) { return p.theme.colors.black50; }, (0, _styledSystem.variant)({ variants: { default: {}, actions: { display: '-webkit-box', '-webkit-line-clamp': '1', '-webkit-box-orient': 'vertical', overflow: 'hidden', maxHeight: '1rem' } } })); exports.Description = Description; var StyledIcon = (0, _styledComponents.default)(_icon.default).withConfig({ displayName: "styles__StyledIcon", componentId: "sc-yqr45k-4" })(["color:", ";margin:8px 12px 8px 4px;flex-shrink:0;", " ", ""], function (p) { return appareances(p.appareance, p.theme); }, _styledSystem.position, (0, _styledSystem.variant)({ variants: { default: {}, actions: { marginLeft: '0.5rem' } } })); exports.StyledIcon = StyledIcon; var ActionWrapper = _styledComponents.default.div.withConfig({ displayName: "styles__ActionWrapper", componentId: "sc-yqr45k-5" })(["display:flex;flex-direction:", ";border-left:1px solid rgba(71,82,133,0.1);align-items:stretch;"], function (p) { return p.nbActions === 1 ? 'row' : 'column'; }); exports.ActionWrapper = ActionWrapper; var ActionButton = (0, _styledComponents.default)(_button.default).withConfig({ displayName: "styles__ActionButton", componentId: "sc-yqr45k-6" })(["font-size:12px;background:", ";border-radius:0 0 4px 0;box-shadow:none;", ""], function (p) { return p.styleType === 'ghost' && 'transparent'; }, function (p) { return p.isAlone ? (0, _styledComponents.css)(["border-radius:0 4px 4px 0;"]) : (0, _styledComponents.css)(["&:first-child{border-radius:0 4px 0 0;border-bottom:1px solid rgba(71,82,133,0.1);}"]); }); exports.ActionButton = ActionButton; var Cross = (0, _styledComponents.default)(_button.default).attrs(function () { return { styleType: 'ghost', icon: 'cross', color: 'black' }; }).withConfig({ displayName: "styles__Cross", componentId: "sc-yqr45k-7" })(["align-self:center;"]); exports.Cross = Cross;