@coveord/plasma-mantine
Version:
A Plasma flavoured Mantine theme
87 lines (86 loc) • 3.07 kB
JavaScript
import { jsx as _jsx } from "react/jsx-runtime";
import { Alert as MantineAlert, polymorphicFactory } from '@mantine/core';
import { InfoToken } from '../InfoToken/InfoToken.js';
export const Alert = polymorphicFactory((props, ref)=>/*#__PURE__*/ _jsx(MantineAlert, {
...props,
ref: ref
}));
Alert.displayName = 'Alert';
const AlertInformation = Alert.withProps({
color: 'gray',
icon: /*#__PURE__*/ _jsx(InfoToken.Information, {
size: "md"
}),
vars: ()=>({
root: {
'--alert-color': 'var(--mantine-color-text)',
'--alert-bg': 'var(--mantine-color-gray-light)',
'--alert-bd': '2px solid var(--mantine-color-gray-light)',
'--alert-radius': 'var(--mantine-radius-sm)'
}
})
});
AlertInformation.displayName = 'Alert.Information';
const AlertAdvice = Alert.withProps({
icon: /*#__PURE__*/ _jsx(InfoToken.Advice, {
size: "md"
}),
vars: ()=>({
root: {
'--alert-color': 'var(--mantine-primary-color-filled)',
'--alert-bg': 'var(--mantine-primary-color-light)',
'--alert-bd': '2px solid var(--mantine-primary-color-light)',
'--alert-radius': 'var(--mantine-radius-sm)'
}
})
});
AlertAdvice.displayName = 'Alert.Advice';
const AlertSuccess = Alert.withProps({
icon: /*#__PURE__*/ _jsx(InfoToken.Success, {
size: "md"
}),
vars: ()=>({
root: {
'--alert-color': 'var(--mantine-color-green-filled)',
'--alert-bg': 'var(--mantine-color-green-light)',
'--alert-bd': '2px solid var(--mantine-color-green-light)',
'--alert-radius': 'var(--mantine-radius-sm)'
}
})
});
AlertSuccess.displayName = 'Alert.Success';
const AlertWarning = Alert.withProps({
color: 'warning',
icon: /*#__PURE__*/ _jsx(InfoToken.Warning, {
size: "md"
}),
vars: ()=>({
root: {
'--alert-color': 'var(--mantine-color-yellow-text)',
'--alert-bg': 'var(--mantine-color-yellow-light)',
'--alert-bd': '2px solid var(--mantine-color-yellow-light)',
'--alert-radius': 'var(--mantine-radius-sm)'
}
})
});
AlertWarning.displayName = 'Alert.Warning';
const AlertCritical = Alert.withProps({
icon: /*#__PURE__*/ _jsx(InfoToken.Error, {
size: "md"
}),
vars: ()=>({
root: {
'--alert-color': 'var(--mantine-color-error)',
'--alert-bg': 'var(--mantine-color-red-light)',
'--alert-bd': '2px solid var(--mantine-color-red-light)',
'--alert-radius': 'var(--mantine-radius-sm)'
}
})
});
AlertCritical.displayName = 'Alert.Critical';
Alert.Information = AlertInformation;
Alert.Advice = AlertAdvice;
Alert.Warning = AlertWarning;
Alert.Critical = AlertCritical;
Alert.Success = AlertSuccess;
//# sourceMappingURL=Alert.js.map