Sha256: 4d7d1107efb49f4a9a3c1d7ff4731a702a725dc9a0f87b2f4e2af6b6e3ab6281

Contents?: true

Size: 1.28 KB

Versions: 153

Compression:

Stored size: 1.28 KB

Contents

/* @flow */

import React from 'react'
import classnames from 'classnames'

import { buildCss } from '../utilities/props'
import { globalProps } from '../utilities/globalProps'

import Body from '../pb_body/_body'
import Icon from '../pb_icon/_icon'

const statusMap = {
  increase: 'positive',
  decrease: 'negative',
}

const iconMap = {
  increase: 'arrow-up',
  decrease: 'arrow-down',
}

type StatChangeProps = {
  change?: "increase" | "decrease" | "neutral",
  className?: string,
  icon?: string,
  id?: string,
  value?: string | number,
}

const StatChange = (props: StatChangeProps) => {
  const { change = 'neutral', className, icon, id, value } = props
  const status = statusMap[change] || 'neutral'
  let returnedIcon = iconMap[change]
  if (icon) {
    returnedIcon = icon
  }

  return (
    <If condition={value}>
      <div
          className={classnames(
          buildCss('pb_stat_change_kit', status),
          globalProps(props),
          className
        )}
          id={id}
      >
        <Body status={status}>
          <If condition={returnedIcon}>
            <Icon
                fixed_width
                icon={returnedIcon}
            />
            {' '}
          </If>
          {`${value}%`}
        </Body>
      </div>
    </If>
  )
}

export default StatChange

Version data entries

153 entries across 153 versions & 1 rubygems

Version Path
playbook_ui-11.8.0 app/pb_kits/playbook/pb_stat_change/_stat_change.jsx
playbook_ui-11.7.0.pre.alpha.table1 app/pb_kits/playbook/pb_stat_change/_stat_change.jsx
playbook_ui-11.7.0 app/pb_kits/playbook/pb_stat_change/_stat_change.jsx
playbook_ui-11.6.0.pre.alpha.fontawesome app/pb_kits/playbook/pb_stat_change/_stat_change.jsx
playbook_ui-11.5.0.pre.alpha.fontawesome app/pb_kits/playbook/pb_stat_change/_stat_change.jsx
playbook_ui-11.7.0.pre.alpha.pre.guagechart1 app/pb_kits/playbook/pb_stat_change/_stat_change.jsx
playbook_ui-11.6.0 app/pb_kits/playbook/pb_stat_change/_stat_change.jsx
playbook_ui-11.5.0.pre.alpha.datepicker1 app/pb_kits/playbook/pb_stat_change/_stat_change.jsx
playbook_ui-11.6.0.pre.alpha.rubocopperf1 app/pb_kits/playbook/pb_stat_change/_stat_change.jsx
playbook_ui-11.6.1.pre.alpha.rubocop.pre.performance1 app/pb_kits/playbook/pb_stat_change/_stat_change.jsx
playbook_ui-11.5.0.pre.alpha.pre.rubocop app/pb_kits/playbook/pb_stat_change/_stat_change.jsx
playbook_ui-11.6.0.pre.alpha.momenttz1 app/pb_kits/playbook/pb_stat_change/_stat_change.jsx
playbook_ui-11.5.0 app/pb_kits/playbook/pb_stat_change/_stat_change.jsx
playbook_ui-11.4.0.pre.alpha.rubytheme2 app/pb_kits/playbook/pb_stat_change/_stat_change.jsx
playbook_ui-11.4.0.pre.alpha.rubytheme1 app/pb_kits/playbook/pb_stat_change/_stat_change.jsx
playbook_ui-11.4.0 app/pb_kits/playbook/pb_stat_change/_stat_change.jsx
playbook_ui-11.3.0.pre.alpha2 app/pb_kits/playbook/pb_stat_change/_stat_change.jsx
playbook_ui-11.3.0.pre.alpha1 app/pb_kits/playbook/pb_stat_change/_stat_change.jsx
playbook_ui-11.3.0 app/pb_kits/playbook/pb_stat_change/_stat_change.jsx
playbook_ui-11.2.7 app/pb_kits/playbook/pb_stat_change/_stat_change.jsx