backgroundImages.js.flow 760 B

123456789101112131415161718192021222324252627
  1. // @flow
  2. import type { Styles } from '../types/style'
  3. /**
  4. * Shorthand that accepts any number of backgroundImage values as parameters for creating a single background statement.
  5. * @example
  6. * // Styles as object usage
  7. * const styles = {
  8. * ...backgroundImages('url("/image/background.jpg")', 'linear-gradient(red, green)')
  9. * }
  10. *
  11. * // styled-components usage
  12. * const div = styled.div`
  13. * ${backgroundImages('url("/image/background.jpg")', 'linear-gradient(red, green)')}
  14. * `
  15. *
  16. * // CSS as JS Output
  17. *
  18. * div {
  19. * 'backgroundImage': 'url("/image/background.jpg"), linear-gradient(red, green)'
  20. * }
  21. */
  22. export default function backgroundImages(...properties: Array<string>): Styles {
  23. return {
  24. backgroundImage: properties.join(', '),
  25. }
  26. }