{"version":3,"file":"Collapse.mjs","sources":["../../../../src/components/Collapse/Collapse.tsx"],"sourcesContent":["import { css, cx } from '@emotion/css';\nimport { useState } from 'react';\nimport * as React from 'react';\n\nimport { GrafanaTheme2 } from '@grafana/data';\n\nimport { useStyles2 } from '../../themes/ThemeContext';\nimport { clearButtonStyles } from '../Button';\nimport { Icon } from '../Icon/Icon';\n\nconst getStyles = (theme: GrafanaTheme2) => ({\n collapse: css({\n label: 'collapse',\n marginBottom: theme.spacing(1),\n backgroundColor: theme.colors.background.primary,\n border: `1px solid ${theme.colors.border.weak}`,\n position: 'relative',\n borderRadius: theme.shape.radius.default,\n width: '100%',\n display: 'flex',\n flexDirection: 'column',\n flex: '1 1 0',\n }),\n collapseBody: css({\n label: 'collapse__body',\n padding: theme.spacing(theme.components.panel.padding),\n paddingTop: 0,\n flex: 1,\n overflow: 'hidden',\n display: 'flex',\n flexDirection: 'column',\n }),\n bodyContentWrapper: css({\n label: 'bodyContentWrapper',\n flex: 1,\n }),\n loader: css({\n label: 'collapse__loader',\n height: '2px',\n position: 'relative',\n overflow: 'hidden',\n background: 'none',\n margin: theme.spacing(0.5),\n }),\n loaderActive: css({\n label: 'collapse__loader_active',\n '&:after': {\n content: \"' '\",\n display: 'block',\n width: '25%',\n top: 0,\n height: '250%',\n position: 'absolute',\n animation: 'loader 2s cubic-bezier(0.17, 0.67, 0.83, 0.67) 500ms',\n animationIterationCount: 100,\n left: '-25%',\n background: theme.colors.primary.main,\n },\n '@keyframes loader': {\n from: {\n left: '-25%',\n opacity: 0.1,\n },\n to: {\n left: '100%',\n opacity: 1,\n },\n },\n }),\n header: css({\n label: 'collapse__header',\n padding: theme.spacing(1, 2, 1, 2),\n display: 'flex',\n }),\n headerCollapsed: css({\n label: 'collapse__header--collapsed',\n padding: theme.spacing(1, 2, 1, 2),\n }),\n headerLabel: css({\n label: 'collapse__header-label',\n fontWeight: theme.typography.fontWeightMedium,\n marginRight: theme.spacing(1),\n fontSize: theme.typography.size.md,\n display: 'flex',\n flex: '0 0 100%',\n }),\n icon: css({\n label: 'collapse__icon',\n margin: theme.spacing(0.25, 1, 0, -1),\n }),\n});\n\nexport interface Props {\n /** Expand or collapse te content */\n isOpen?: boolean;\n /** Element or text for the Collapse header */\n label: React.ReactNode;\n /** Indicates loading state of the content */\n loading?: boolean;\n /** Toggle collapsed header icon */\n collapsible?: boolean;\n /** Callback for the toggle functionality */\n onToggle?: (isOpen: boolean) => void;\n /** Additional class name for the root element */\n className?: string;\n}\n\nexport const ControlledCollapse = ({ isOpen, onToggle, ...otherProps }: React.PropsWithChildren) => {\n const [open, setOpen] = useState(isOpen);\n return (\n {\n setOpen(!open);\n if (onToggle) {\n onToggle(!open);\n }\n }}\n />\n );\n};\n\nexport const Collapse = ({\n isOpen,\n label,\n loading,\n collapsible,\n onToggle,\n className,\n children,\n}: React.PropsWithChildren) => {\n const buttonStyles = useStyles2(clearButtonStyles);\n const style = useStyles2(getStyles);\n const onClickToggle = () => {\n if (onToggle) {\n onToggle(!isOpen);\n }\n };\n\n const panelClass = cx([style.collapse, className]);\n const loaderClass = loading ? cx([style.loader, style.loaderActive]) : cx([style.loader]);\n const headerClass = collapsible ? cx([style.header]) : cx([style.headerCollapsed]);\n\n return (\n
\n \n {isOpen && (\n
\n
\n
{children}
\n
\n )}\n
\n );\n};\n\nCollapse.displayName = 'Collapse';\n"],"names":[],"mappings":";;;;;;;;AAUA,MAAM,SAAA,GAAY,CAAC,KAA0B,MAAA;AAAA,EAC3C,UAAU,GAAI,CAAA;AAAA,IACZ,KAAO,EAAA,UAAA;AAAA,IACP,YAAA,EAAc,KAAM,CAAA,OAAA,CAAQ,CAAC,CAAA;AAAA,IAC7B,eAAA,EAAiB,KAAM,CAAA,MAAA,CAAO,UAAW,CAAA,OAAA;AAAA,IACzC,MAAQ,EAAA,CAAA,UAAA,EAAa,KAAM,CAAA,MAAA,CAAO,OAAO,IAAI,CAAA,CAAA;AAAA,IAC7C,QAAU,EAAA,UAAA;AAAA,IACV,YAAA,EAAc,KAAM,CAAA,KAAA,CAAM,MAAO,CAAA,OAAA;AAAA,IACjC,KAAO,EAAA,MAAA;AAAA,IACP,OAAS,EAAA,MAAA;AAAA,IACT,aAAe,EAAA,QAAA;AAAA,IACf,IAAM,EAAA;AAAA,GACP,CAAA;AAAA,EACD,cAAc,GAAI,CAAA;AAAA,IAChB,KAAO,EAAA,gBAAA;AAAA,IACP,SAAS,KAAM,CAAA,OAAA,CAAQ,KAAM,CAAA,UAAA,CAAW,MAAM,OAAO,CAAA;AAAA,IACrD,UAAY,EAAA,CAAA;AAAA,IACZ,IAAM,EAAA,CAAA;AAAA,IACN,QAAU,EAAA,QAAA;AAAA,IACV,OAAS,EAAA,MAAA;AAAA,IACT,aAAe,EAAA;AAAA,GAChB,CAAA;AAAA,EACD,oBAAoB,GAAI,CAAA;AAAA,IACtB,KAAO,EAAA,oBAAA;AAAA,IACP,IAAM,EAAA;AAAA,GACP,CAAA;AAAA,EACD,QAAQ,GAAI,CAAA;AAAA,IACV,KAAO,EAAA,kBAAA;AAAA,IACP,MAAQ,EAAA,KAAA;AAAA,IACR,QAAU,EAAA,UAAA;AAAA,IACV,QAAU,EAAA,QAAA;AAAA,IACV,UAAY,EAAA,MAAA;AAAA,IACZ,MAAA,EAAQ,KAAM,CAAA,OAAA,CAAQ,GAAG;AAAA,GAC1B,CAAA;AAAA,EACD,cAAc,GAAI,CAAA;AAAA,IAChB,KAAO,EAAA,yBAAA;AAAA,IACP,SAAW,EAAA;AAAA,MACT,OAAS,EAAA,KAAA;AAAA,MACT,OAAS,EAAA,OAAA;AAAA,MACT,KAAO,EAAA,KAAA;AAAA,MACP,GAAK,EAAA,CAAA;AAAA,MACL,MAAQ,EAAA,MAAA;AAAA,MACR,QAAU,EAAA,UAAA;AAAA,MACV,SAAW,EAAA,sDAAA;AAAA,MACX,uBAAyB,EAAA,GAAA;AAAA,MACzB,IAAM,EAAA,MAAA;AAAA,MACN,UAAA,EAAY,KAAM,CAAA,MAAA,CAAO,OAAQ,CAAA;AAAA,KACnC;AAAA,IACA,mBAAqB,EAAA;AAAA,MACnB,IAAM,EAAA;AAAA,QACJ,IAAM,EAAA,MAAA;AAAA,QACN,OAAS,EAAA;AAAA,OACX;AAAA,MACA,EAAI,EAAA;AAAA,QACF,IAAM,EAAA,MAAA;AAAA,QACN,OAAS,EAAA;AAAA;AACX;AACF,GACD,CAAA;AAAA,EACD,QAAQ,GAAI,CAAA;AAAA,IACV,KAAO,EAAA,kBAAA;AAAA,IACP,SAAS,KAAM,CAAA,OAAA,CAAQ,CAAG,EAAA,CAAA,EAAG,GAAG,CAAC,CAAA;AAAA,IACjC,OAAS,EAAA;AAAA,GACV,CAAA;AAAA,EACD,iBAAiB,GAAI,CAAA;AAAA,IACnB,KAAO,EAAA,6BAAA;AAAA,IACP,SAAS,KAAM,CAAA,OAAA,CAAQ,CAAG,EAAA,CAAA,EAAG,GAAG,CAAC;AAAA,GAClC,CAAA;AAAA,EACD,aAAa,GAAI,CAAA;AAAA,IACf,KAAO,EAAA,wBAAA;AAAA,IACP,UAAA,EAAY,MAAM,UAAW,CAAA,gBAAA;AAAA,IAC7B,WAAA,EAAa,KAAM,CAAA,OAAA,CAAQ,CAAC,CAAA;AAAA,IAC5B,QAAA,EAAU,KAAM,CAAA,UAAA,CAAW,IAAK,CAAA,EAAA;AAAA,IAChC,OAAS,EAAA,MAAA;AAAA,IACT,IAAM,EAAA;AAAA,GACP,CAAA;AAAA,EACD,MAAM,GAAI,CAAA;AAAA,IACR,KAAO,EAAA,gBAAA;AAAA,IACP,QAAQ,KAAM,CAAA,OAAA,CAAQ,IAAM,EAAA,CAAA,EAAG,GAAG,CAAE,CAAA;AAAA,GACrC;AACH,CAAA,CAAA;AAiBO,MAAM,qBAAqB,CAAC,EAAE,QAAQ,QAAU,EAAA,GAAG,YAAiD,KAAA;AACzG,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAI,SAAS,MAAM,CAAA;AACvC,EACE,uBAAA,GAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,MAAQ,EAAA,IAAA;AAAA,MACR,WAAW,EAAA,IAAA;AAAA,MACV,GAAG,UAAA;AAAA,MACJ,UAAU,MAAM;AACd,QAAA,OAAA,CAAQ,CAAC,IAAI,CAAA;AACb,QAAA,IAAI,QAAU,EAAA;AACZ,UAAA,QAAA,CAAS,CAAC,IAAI,CAAA;AAAA;AAChB;AACF;AAAA,GACF;AAEJ;AAEO,MAAM,WAAW,CAAC;AAAA,EACvB,MAAA;AAAA,EACA,KAAA;AAAA,EACA,OAAA;AAAA,EACA,WAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AAAA,EACA;AACF,CAAsC,KAAA;AACpC,EAAM,MAAA,YAAA,GAAe,WAAW,iBAAiB,CAAA;AACjD,EAAM,MAAA,KAAA,GAAQ,WAAW,SAAS,CAAA;AAClC,EAAA,MAAM,gBAAgB,MAAM;AAC1B,IAAA,IAAI,QAAU,EAAA;AACZ,MAAA,QAAA,CAAS,CAAC,MAAM,CAAA;AAAA;AAClB,GACF;AAEA,EAAA,MAAM,aAAa,EAAG,CAAA,CAAC,KAAM,CAAA,QAAA,EAAU,SAAS,CAAC,CAAA;AACjD,EAAA,MAAM,WAAc,GAAA,OAAA,GAAU,EAAG,CAAA,CAAC,MAAM,MAAQ,EAAA,KAAA,CAAM,YAAY,CAAC,CAAI,GAAA,EAAA,CAAG,CAAC,KAAA,CAAM,MAAM,CAAC,CAAA;AACxF,EAAA,MAAM,WAAc,GAAA,WAAA,GAAc,EAAG,CAAA,CAAC,KAAM,CAAA,MAAM,CAAC,CAAA,GAAI,EAAG,CAAA,CAAC,KAAM,CAAA,eAAe,CAAC,CAAA;AAEjF,EACE,uBAAA,IAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAW,UACd,EAAA,QAAA,EAAA;AAAA,oBAAC,IAAA,CAAA,QAAA,EAAA,EAAO,MAAK,QAAS,EAAA,SAAA,EAAW,GAAG,YAAc,EAAA,WAAW,CAAG,EAAA,OAAA,EAAS,aACtE,EAAA,QAAA,EAAA;AAAA,MAAe,WAAA,oBAAA,GAAA,CAAC,QAAK,SAAW,EAAA,KAAA,CAAM,MAAM,IAAM,EAAA,MAAA,GAAS,eAAe,aAAe,EAAA,CAAA;AAAA,sBAC1F,GAAA,CAAC,SAAI,SAAW,EAAA,EAAA,CAAG,CAAC,KAAM,CAAA,WAAW,CAAC,CAAA,EAAI,QAAM,EAAA,KAAA,EAAA;AAAA,KAClD,EAAA,CAAA;AAAA,IACC,MAAA,yBACE,KAAI,EAAA,EAAA,SAAA,EAAW,GAAG,CAAC,KAAA,CAAM,YAAY,CAAC,CACrC,EAAA,QAAA,EAAA;AAAA,sBAAC,GAAA,CAAA,KAAA,EAAA,EAAI,WAAW,WAAa,EAAA,CAAA;AAAA,sBAC5B,GAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,KAAA,CAAM,oBAAqB,QAAS,EAAA;AAAA,KACtD,EAAA;AAAA,GAEJ,EAAA,CAAA;AAEJ;AAEA,QAAA,CAAS,WAAc,GAAA,UAAA;;;;"}