@coveord/plasma-mantine
Version:
A Plasma flavoured Mantine theme
128 lines (127 loc) • 4.53 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
Object.defineProperty(exports, "StatusToken", {
enumerable: true,
get: function() {
return StatusToken;
}
});
var _interop_require_default = require("@swc/helpers/_/_interop_require_default");
var _object_spread = require("@swc/helpers/_/_object_spread");
var _object_spread_props = require("@swc/helpers/_/_object_spread_props");
var _object_without_properties = require("@swc/helpers/_/_object_without_properties");
var _jsxruntime = require("react/jsx-runtime");
var _core = require("@mantine/core");
var _circlesvgraw = /*#__PURE__*/ _interop_require_default._(require("./icons/circle.svg?raw"));
var _ringsvgraw = /*#__PURE__*/ _interop_require_default._(require("./icons/ring.svg?raw"));
var _squaresvgraw = /*#__PURE__*/ _interop_require_default._(require("./icons/square.svg?raw"));
var _trianglesvgraw = /*#__PURE__*/ _interop_require_default._(require("./icons/triangle.svg?raw"));
var _infosvgraw = /*#__PURE__*/ _interop_require_default._(require("./icons/info.svg?raw"));
var _StatusTokenmodulecss = /*#__PURE__*/ _interop_require_default._(require("./StatusToken.module.css"));
var defaultProps = {
size: 'lg',
variant: 'info'
};
var resolveThemeColorFromVariant = function resolveThemeColorFromVariant(variant, theme) {
switch(variant){
case 'success':
return theme.colors.green[4];
case 'caution':
return theme.colors.yellow[4];
case 'error':
return theme.colors.red[5];
case 'disabled':
case 'waiting':
return theme.colors.gray[5];
case 'edited':
case 'new':
return 'var(--mantine-primary-color-filled)';
case 'info':
return theme.colors.gray[3];
default:
return theme.colors.navy[5];
}
};
var resolveSize = function resolveSize(size) {
return size === 'sm' ? 8 : 12;
};
var resolveIconSrcFromVariant = function resolveIconSrcFromVariant(variant) {
switch(variant){
case 'caution':
return _trianglesvgraw.default;
case 'error':
return _squaresvgraw.default;
case 'disabled':
return _ringsvgraw.default;
case 'info':
return _infosvgraw.default;
case 'success':
case 'waiting':
case 'edited':
case 'new':
default:
return _circlesvgraw.default;
}
};
var varsResolver = (0, _core.createVarsResolver)(function(theme, param) {
var variant = param.variant, size = param.size;
var color = resolveThemeColorFromVariant(variant, theme);
return {
root: {
'--status-token-color': color,
'--status-token-size': (0, _core.getSize)(resolveSize(size), 'status-token-size')
}
};
});
var statusTokenLabels = {
info: 'Info',
success: 'Success',
caution: 'Caution',
error: 'Error',
disabled: 'Disabled',
waiting: 'Waiting',
edited: 'Edited',
new: 'New'
};
var StatusToken = (0, _core.polymorphicFactory)(function(props, ref) {
var _useProps = (0, _core.useProps)('StatusToken', defaultProps, props), variant = _useProps.variant, vars = _useProps.vars, size = _useProps.size, className = _useProps.className, style = _useProps.style, unstyled = _useProps.unstyled, styles = _useProps.styles, classNames = _useProps.classNames, others = _object_without_properties._(_useProps, [
"variant",
"vars",
"size",
"className",
"style",
"unstyled",
"styles",
"classNames"
]);
var getStyles = (0, _core.useStyles)({
name: 'StatusToken',
classes: _StatusTokenmodulecss.default,
className: className,
props: props,
style: style,
styles: styles,
unstyled: unstyled,
vars: vars,
varsResolver: varsResolver
});
return /*#__PURE__*/ (0, _jsxruntime.jsx)(_core.Box, _object_spread._(_object_spread_props._(_object_spread._({
ref: ref,
variant: variant,
role: "img",
"aria-label": statusTokenLabels[variant]
}, getStyles('root', {
className: className,
style: style,
styles: styles,
classNames: classNames
})), {
dangerouslySetInnerHTML: {
__html: resolveIconSrcFromVariant(variant)
}
}), others));
});
StatusToken.displayName = 'StatusToken';
//# sourceMappingURL=StatusToken.js.map