@kubit-ui-web/react-components
Version:
Kubit React Components is a customizable, accessible library of React web components, designed to enhance your application's user experience
86 lines • 3.21 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.MEDIA_BUTTON_STYLES = void 0;
const sizes_1 = require("../../../../components/mediaButton/types/sizes");
const borders_1 = require("../../foundations/borders");
const colors_1 = require("../../foundations/colors");
const spacings_1 = require("../../foundations/spacings");
const variants_1 = require("../loader/variants");
const variants_2 = require("./variants");
const commonButtonContainerProps = {
position: 'relative',
cursor: 'pointer',
border_radius: borders_1.RADIUS.radius_100,
margin: spacings_1.SPACINGS.spacing_100,
};
const commonContainerProps = {
position: 'relative',
display: 'flex',
cursor: 'pointer',
border_radius: borders_1.RADIUS.radius_100,
};
const commonDefaultProps = {
container: { ...commonContainerProps },
buttonContainer: { ...commonButtonContainerProps },
icon: {
color: colors_1.COLORS.BRAND.color_brand_bg_50,
disabled: {
color: colors_1.COLORS.DISABLED.color_accentDisabled_font_100,
},
},
iconToTransition: {
color: colors_1.COLORS.BRAND.color_brand_bg_50,
},
loader: {
variant: variants_1.LoaderVariantType.PRIMARY_RED,
cursor: 'not-allowed',
},
};
exports.MEDIA_BUTTON_STYLES = {
[variants_2.MediaButtonVariantType.DEFAULT]: {
[sizes_1.MediaButtonSizeType.EXTRA_LARGE]: {
...commonDefaultProps,
container: {
...commonContainerProps,
background_color: colors_1.COLORS.NEUTRAL.color_neutral_bg_250,
},
buttonContainer: {
...commonButtonContainerProps,
width: spacings_1.SPACINGS.spacing_650,
height: spacings_1.SPACINGS.spacing_650,
min_width: spacings_1.SPACINGS.spacing_650,
min_height: spacings_1.SPACINGS.spacing_650,
},
},
[sizes_1.MediaButtonSizeType.LARGE]: {
...commonDefaultProps,
container: {
...commonContainerProps,
background_color: colors_1.COLORS.NEUTRAL.color_neutral_bg_250,
},
buttonContainer: {
...commonButtonContainerProps,
width: spacings_1.SPACINGS.spacing_500,
height: spacings_1.SPACINGS.spacing_500,
min_width: spacings_1.SPACINGS.spacing_500,
min_height: spacings_1.SPACINGS.spacing_500,
},
},
[sizes_1.MediaButtonSizeType.SMALL]: {
...commonDefaultProps,
container: {
...commonContainerProps,
border_radius: borders_1.RADIUS.radius_00,
},
buttonContainer: {
...commonButtonContainerProps,
width: spacings_1.SPACINGS.spacing_400,
height: spacings_1.SPACINGS.spacing_400,
min_width: spacings_1.SPACINGS.spacing_400,
min_height: spacings_1.SPACINGS.spacing_400,
margin: spacings_1.SPACINGS.spacing_0,
},
},
},
};
//# sourceMappingURL=styles.js.map