@grafana/ui
Version:
Grafana Components Library
1 lines • 3.52 kB
Source Map (JSON)
{"version":3,"file":"TextArea.cjs","sources":["../../../../src/components/TextArea/TextArea.tsx"],"sourcesContent":["import { css, cx } from '@emotion/css';\nimport { forwardRef, type HTMLProps } from 'react';\n\nimport { type GrafanaTheme2 } from '@grafana/data';\n\nimport { useStyles2 } from '../../themes/ThemeContext';\nimport { useFieldContext } from '../Forms/FieldContext';\nimport { getFocusStyle, sharedInputStyle } from '../Forms/commonStyles';\n\nexport interface Props extends Omit<HTMLProps<HTMLTextAreaElement>, 'size'> {\n /** Show an invalid state around the input */\n invalid?: boolean;\n}\n\n/**\n * Use for multi line inputs like descriptions.\n *\n * https://developers.grafana.com/ui/latest/index.html?path=/docs/inputs-textarea--docs\n */\nexport const TextArea = forwardRef<HTMLTextAreaElement, Props>(\n (\n {\n 'aria-describedby': ariaDescribedByProp,\n disabled: disabledProp,\n invalid: invalidProp,\n id: idProp,\n className,\n ...props\n },\n ref\n ) => {\n const fieldContext = useFieldContext();\n const invalid = invalidProp ?? fieldContext.invalid;\n const id = idProp ?? fieldContext.id;\n const disabled = disabledProp ?? fieldContext.disabled;\n const ariaDescribedBy = ariaDescribedByProp ?? fieldContext['aria-describedby'];\n const styles = useStyles2(getTextAreaStyle, invalid);\n\n return (\n <textarea\n {...props}\n id={id}\n disabled={disabled}\n aria-describedby={ariaDescribedBy}\n className={cx(styles.textarea, className)}\n ref={ref}\n />\n );\n }\n);\n\nconst getTextAreaStyle = (theme: GrafanaTheme2, invalid = false) => ({\n textarea: cx(\n sharedInputStyle(theme),\n getFocusStyle(theme),\n css({\n display: 'block',\n borderRadius: theme.shape.radius.default,\n padding: `${theme.spacing.gridSize / 4}px ${theme.spacing.gridSize}px`,\n width: '100%',\n borderColor: invalid ? theme.colors.error.border : theme.components.input.borderColor,\n })\n ),\n});\n\nTextArea.displayName = 'TextArea';\n"],"names":["forwardRef","useFieldContext","useStyles2","jsx","cx","sharedInputStyle","getFocusStyle","css"],"mappings":";;;;;;;;;;;;AAmBO,MAAM,QAAA,GAAWA,gBAAA;AAAA,EACtB,CACE;AAAA,IACE,kBAAA,EAAoB,mBAAA;AAAA,IACpB,QAAA,EAAU,YAAA;AAAA,IACV,OAAA,EAAS,WAAA;AAAA,IACT,EAAA,EAAI,MAAA;AAAA,IACJ,SAAA;AAAA,IACA,GAAG;AAAA,KAEL,GAAA,KACG;AACH,IAAA,MAAM,eAAeC,4BAAA,EAAgB;AACrC,IAAA,MAAM,OAAA,GAAU,oCAAe,YAAA,CAAa,OAAA;AAC5C,IAAA,MAAM,EAAA,GAAK,0BAAU,YAAA,CAAa,EAAA;AAClC,IAAA,MAAM,QAAA,GAAW,sCAAgB,YAAA,CAAa,QAAA;AAC9C,IAAA,MAAM,eAAA,GAAkB,mBAAA,IAAA,IAAA,GAAA,mBAAA,GAAuB,YAAA,CAAa,kBAAkB,CAAA;AAC9E,IAAA,MAAM,MAAA,GAASC,uBAAA,CAAW,gBAAA,EAAkB,OAAO,CAAA;AAEnD,IAAA,uBACEC,cAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACE,GAAG,KAAA;AAAA,QACJ,EAAA;AAAA,QACA,QAAA;AAAA,QACA,kBAAA,EAAkB,eAAA;AAAA,QAClB,SAAA,EAAWC,MAAA,CAAG,MAAA,CAAO,QAAA,EAAU,SAAS,CAAA;AAAA,QACxC;AAAA;AAAA,KACF;AAAA,EAEJ;AACF;AAEA,MAAM,gBAAA,GAAmB,CAAC,KAAA,EAAsB,OAAA,GAAU,KAAA,MAAW;AAAA,EACnE,QAAA,EAAUA,MAAA;AAAA,IACRC,8BAAiB,KAAK,CAAA;AAAA,IACtBC,2BAAc,KAAK,CAAA;AAAA,IACnBC,OAAA,CAAI;AAAA,MACF,OAAA,EAAS,OAAA;AAAA,MACT,YAAA,EAAc,KAAA,CAAM,KAAA,CAAM,MAAA,CAAO,OAAA;AAAA,MACjC,OAAA,EAAS,GAAG,KAAA,CAAM,OAAA,CAAQ,WAAW,CAAC,CAAA,GAAA,EAAM,KAAA,CAAM,OAAA,CAAQ,QAAQ,CAAA,EAAA,CAAA;AAAA,MAClE,KAAA,EAAO,MAAA;AAAA,MACP,WAAA,EAAa,UAAU,KAAA,CAAM,MAAA,CAAO,MAAM,MAAA,GAAS,KAAA,CAAM,WAAW,KAAA,CAAM;AAAA,KAC3E;AAAA;AAEL,CAAA,CAAA;AAEA,QAAA,CAAS,WAAA,GAAc,UAAA;;;;"}