UNPKG

react-native-really-awesome-button

Version:

React Native Button UI component that renders an 60fps animated set of progress enabled 3D performant buttons.

104 lines (102 loc) 2.45 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.default = void 0; var _colors = _interopRequireDefault(require("./colors")); var _social = _interopRequireDefault(require("./social")); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } // @ts-ignore const COMMON = { borderRadius: 8, height: 60, raiseLevel: 12 }; const SOCIAL_TYPES = (0, _social.default)(COMMON); const primary = '#4688C5'; const anchor = '#46C578'; const danger = '#B13A3A'; const BUTTONS = { primary: { ...COMMON, backgroundColor: primary, backgroundDarker: (0, _colors.default)(-0.5, primary), backgroundActive: (0, _colors.default)(-0.3, primary), backgroundProgress: (0, _colors.default)(-0.65, primary), textColor: '#FFF', activityColor: '#b3e5e1' }, secondary: { ...COMMON, backgroundColor: '#FFF', backgroundDarker: (0, _colors.default)(-0.1, primary), backgroundActive: (0, _colors.default)(0.85, primary), backgroundProgress: '#c8e3f5', backgroundPlaceholder: '#1e88e5', textColor: '#1e88e5', borderWidth: 1, borderColor: '#1e88e5', activityColor: '#1e88e5' }, anchor: { ...COMMON, backgroundColor: anchor, backgroundDarker: (0, _colors.default)(-0.5, anchor), backgroundProgress: (0, _colors.default)(-0.65, anchor), textColor: '#FFF', activityColor: '#FFF' }, danger: { ...COMMON, backgroundColor: danger, backgroundDarker: (0, _colors.default)(-0.5, danger), backgroundProgress: (0, _colors.default)(-0.65, danger), textColor: '#FFF', activityColor: '#FFF' }, disabled: { ...COMMON, backgroundColor: '#DFDFDF', backgroundDarker: '#CACACA', textColor: '#B6B6B6' }, flat: { backgroundColor: 'rgba(0, 0, 0, 0)', backgroundDarker: 'rgba(0, 0, 0, 0)', backgroundShadow: 'rgba(0, 0, 0, 0)', raiseLevel: 0, borderRadius: 0 }, ...SOCIAL_TYPES }; const SIZE = { icon: { width: 60, height: 60, textSize: 12, paddingHorizontal: 4 }, small: { width: 120, height: 44, textSize: 12 }, medium: { width: 200, height: 60 }, large: { width: 250, height: 60, textSize: 16 } }; var _default = { title: 'Basic Theme', background: '#1775c8', color: '#FFF', buttons: BUTTONS, size: SIZE }; exports.default = _default; //# sourceMappingURL=basic.js.map