UNPKG

@grafana/ui

Version:
1 lines 2.17 kB
{"version":3,"file":"SegmentSection.mjs","sources":["../../../../src/components/Segment/SegmentSection.tsx"],"sourcesContent":["import { css } from '@emotion/css';\nimport * as React from 'react';\n\nimport { GrafanaTheme2 } from '@grafana/data';\n\nimport { useStyles2 } from '../../themes/ThemeContext';\nimport { InlineFieldRow } from '../Forms/InlineFieldRow';\nimport { InlineLabel } from '../Forms/InlineLabel';\n\n/**\n * Horizontal section for editor components.\n *\n * @alpha\n */\nexport const SegmentSection = ({\n label,\n htmlFor,\n children,\n fill,\n}: {\n // Name of the section\n label: string;\n // htmlFor for the label\n htmlFor?: string;\n // List of components in the section\n children: React.ReactNode;\n // Fill the space at the end\n fill?: boolean;\n}) => {\n const styles = useStyles2(getStyles);\n return (\n <>\n <InlineFieldRow>\n <InlineLabel htmlFor={htmlFor} width={12} className={styles.label}>\n {label}\n </InlineLabel>\n {children}\n {fill && (\n <div className={styles.fill}>\n <InlineLabel>{''}</InlineLabel>\n </div>\n )}\n </InlineFieldRow>\n </>\n );\n};\n\nconst getStyles = (theme: GrafanaTheme2) => ({\n label: css({\n color: theme.colors.primary.text,\n }),\n fill: css({\n flexGrow: 1,\n marginBottom: theme.spacing(0.5),\n }),\n});\n"],"names":[],"mappings":";;;;;;;AAcO,MAAM,iBAAiB,CAAC;AAAA,EAC7B,KAAA;AAAA,EACA,OAAA;AAAA,EACA,QAAA;AAAA,EACA;AACF,CAAA,KASM;AACJ,EAAA,MAAM,MAAA,GAAS,WAAW,SAAS,CAAA;AACnC,EAAA,uBACE,GAAA,CAAA,QAAA,EAAA,EACE,+BAAC,cAAA,EAAA,EACC,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,eAAY,OAAA,EAAkB,KAAA,EAAO,IAAI,SAAA,EAAW,MAAA,CAAO,OACzD,QAAA,EAAA,KAAA,EACH,CAAA;AAAA,IACC,QAAA;AAAA,IACA,IAAA,wBACE,KAAA,EAAA,EAAI,SAAA,EAAW,OAAO,IAAA,EACrB,QAAA,kBAAA,GAAA,CAAC,WAAA,EAAA,EAAa,QAAA,EAAA,EAAA,EAAG,CAAA,EACnB;AAAA,GAAA,EAEJ,CAAA,EACF,CAAA;AAEJ;AAEA,MAAM,SAAA,GAAY,CAAC,KAAA,MAA0B;AAAA,EAC3C,OAAO,GAAA,CAAI;AAAA,IACT,KAAA,EAAO,KAAA,CAAM,MAAA,CAAO,OAAA,CAAQ;AAAA,GAC7B,CAAA;AAAA,EACD,MAAM,GAAA,CAAI;AAAA,IACR,QAAA,EAAU,CAAA;AAAA,IACV,YAAA,EAAc,KAAA,CAAM,OAAA,CAAQ,GAAG;AAAA,GAChC;AACH,CAAA,CAAA;;;;"}