@grafana/ui/dist/cjs/components/ButtonCascader/ButtonCascader.cjs.map

Grafana Components Library

{"version":3,"file":"ButtonCascader.cjs","sources":["../../../../src/components/ButtonCascader/ButtonCascader.tsx"],"sourcesContent":["import { css, cx } from '@emotion/css';\nimport RCCascader, { type FieldNames } from '@rc-component/cascader';\nimport * as React from 'react';\n\nimport { type GrafanaTheme2 } from '@grafana/data';\n\nimport { useStyles2 } from '../../themes/ThemeContext';\nimport { type IconName } from '../../types/icon';\nimport { Button, type ButtonProps } from '../Button/Button';\nimport { type CascaderOption } from '../Cascader/Cascader';\nimport { onChangeCascader, onLoadDataCascader } from '../Cascader/optionMappings';\nimport { getCascaderStyles } from '../Cascader/styles';\nimport { Icon } from '../Icon/Icon';\n\nexport interface ButtonCascaderProps {\n  options: CascaderOption[];\n  children: string;\n  icon?: IconName;\n  disabled?: boolean;\n  value?: string[];\n  fieldNames?: FieldNames<CascaderOption, keyof CascaderOption>;\n  loadData?: (selectedOptions: CascaderOption[]) => void;\n  onChange?: (value: string[], selectedOptions: CascaderOption[]) => void;\n  onPopupVisibleChange?: (visible: boolean) => void;\n  className?: string;\n  variant?: ButtonProps['variant'];\n  buttonProps?: Omit<ButtonProps, 'children'>;\n  hideDownIcon?: boolean;\n}\n\n/**\n * https://developers.grafana.com/ui/latest/index.html?path=/docs/inputs-buttoncascader--docs\n */\nexport const ButtonCascader = (props: ButtonCascaderProps) => {\n  const { onChange, className, loadData, icon, buttonProps, hideDownIcon, variant, disabled, ...rest } = props;\n  const styles = useStyles2(getStyles);\n  const cascaderStyles = useStyles2(getCascaderStyles);\n\n  // Weird way to do this bit it goes around a styling issue in Button where even null/undefined child triggers\n  // styling change which messes up the look if there is only single icon content.\n  let content: React.ReactNode = props.children;\n  if (!hideDownIcon) {\n    content = [props.children, <Icon key={'down-icon'} name=\"angle-down\" className={styles.icons.right} />];\n  }\n\n  return (\n    <RCCascader\n      onChange={onChangeCascader(onChange)}\n      loadData={onLoadDataCascader(loadData)}\n      popupClassName={cx(cascaderStyles.dropdown, styles.popup)}\n      {...rest}\n      expandIcon={null}\n    >\n      <Button icon={icon} disabled={disabled} variant={variant} {...(buttonProps ?? {})}>\n        {content}\n      </Button>\n    </RCCascader>\n  );\n};\n\nButtonCascader.displayName = 'ButtonCascader';\n\nconst getStyles = (theme: GrafanaTheme2) => {\n  return {\n    popup: css({\n      label: 'popup',\n      zIndex: theme.zIndex.dropdown,\n    }),\n    icons: {\n      right: css({\n        margin: '1px 0 0 4px',\n      }),\n      left: css({\n        margin: '-1px 4px 0 0',\n      }),\n    },\n  };\n};\n"],"names":["styles","useStyles2","getCascaderStyles","jsx","Icon","RCCascader","onChangeCascader","onLoadDataCascader","cx","Button","css"],"mappings":";;;;;;;;;;;;;;;;;;AAiCO,MAAM,cAAA,GAAiB,CAAC,KAAA,KAA+B;AAC5D,EAAA,MAAM,EAAE,QAAA,EAAU,SAAA,EAAW,QAAA,EAAU,IAAA,EAAM,WAAA,EAAa,YAAA,EAAc,OAAA,EAAS,QAAA,EAAU,GAAG,IAAA,EAAK,GAAI,KAAA;AACvG,EAAA,MAAMA,QAAA,GAASC,wBAAW,SAAS,CAAA;AACnC,EAAA,MAAM,cAAA,GAAiBA,wBAAWC,wBAAiB,CAAA;AAInD,EAAA,IAAI,UAA2B,KAAA,CAAM,QAAA;AACrC,EAAA,IAAI,CAAC,YAAA,EAAc;AACjB,IAAA,OAAA,GAAU,CAAC,KAAA,CAAM,QAAA,kBAAUC,cAAA,CAACC,SAAA,EAAA,EAAuB,IAAA,EAAK,YAAA,EAAa,SAAA,EAAWJ,QAAA,CAAO,KAAA,CAAM,KAAA,EAAA,EAAvD,WAA8D,CAAE,CAAA;AAAA,EACxG;AAEA,EAAA,uBACEG,cAAA;AAAA,IAACE,2BAAA;AAAA,IAAA;AAAA,MACC,QAAA,EAAUC,gCAAiB,QAAQ,CAAA;AAAA,MACnC,QAAA,EAAUC,kCAAmB,QAAQ,CAAA;AAAA,MACrC,cAAA,EAAgBC,MAAA,CAAG,cAAA,CAAe,QAAA,EAAUR,SAAO,KAAK,CAAA;AAAA,MACvD,GAAG,IAAA;AAAA,MACJ,UAAA,EAAY,IAAA;AAAA,MAEZ,QAAA,kBAAAG,cAAA,CAACM,iBAAO,IAAA,EAAY,QAAA,EAAoB,SAAmB,GAAI,WAAA,IAAA,IAAA,GAAA,WAAA,GAAe,EAAC,EAC5E,QAAA,EAAA,OAAA,EACH;AAAA;AAAA,GACF;AAEJ;AAEA,cAAA,CAAe,WAAA,GAAc,gBAAA;AAE7B,MAAM,SAAA,GAAY,CAAC,KAAA,KAAyB;AAC1C,EAAA,OAAO;AAAA,IACL,OAAOC,OAAA,CAAI;AAAA,MACT,KAAA,EAAO,OAAA;AAAA,MACP,MAAA,EAAQ,MAAM,MAAA,CAAO;AAAA,KACtB,CAAA;AAAA,IACD,KAAA,EAAO;AAAA,MACL,OAAOA,OAAA,CAAI;AAAA,QACT,MAAA,EAAQ;AAAA,OACT,CAAA;AAAA,MACD,MAAMA,OAAA,CAAI;AAAA,QACR,MAAA,EAAQ;AAAA,OACT;AAAA;AACH,GACF;AACF,CAAA;;;;"}