@react-spectrum/s2
Version:
Spectrum 2 UI components in React
1 lines • 3.04 kB
Source Map (JSON)
{"mappings":"AAwCkB;EAAA;;;;EAAA","sources":["packages/@react-spectrum/s2/src/Accordion.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ContextValue, DisclosureGroup, DisclosureGroupProps, SlotProps} from 'react-aria-components';\nimport {DisclosureContext} from './Disclosure';\nimport {DOMProps, DOMRef, DOMRefValue} from '@react-types/shared';\nimport {getAllowedOverrides, StylesPropWithHeight, UnsafeStyles} from './style-utils' with { type: 'macro' };\nimport React, {createContext, forwardRef} from 'react';\nimport {style} from '../style' with { type: 'macro' };\nimport {useDOMRef} from '@react-spectrum/utils';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\nexport interface AccordionProps extends Omit<DisclosureGroupProps, 'className' | 'style' | 'children'>, UnsafeStyles, DOMProps, SlotProps {\n /** The disclosure elements in the accordion. */\n children: React.ReactNode,\n /** Spectrum-defined styles, returned by the `style()` macro. */\n styles?: StylesPropWithHeight,\n /**\n * The size of the accordion.\n * @default 'M'\n */\n size?: 'S' | 'M' | 'L' | 'XL',\n /**\n * The amount of space between the disclosure items.\n * @default 'regular'\n */\n density?: 'compact' | 'regular' | 'spacious',\n /** Whether the accordion should be displayed with a quiet style. */\n isQuiet?: boolean\n}\n\nconst accordion = style({\n display: 'flex',\n flexDirection: 'column'\n}, getAllowedOverrides({height: true}));\n\nexport const AccordionContext = createContext<ContextValue<Partial<AccordionProps>, DOMRefValue<HTMLDivElement>>>(null);\n\n/**\n * An accordion is a container for multiple disclosures.\n */\nexport const Accordion = forwardRef(function Accordion(props: AccordionProps, ref: DOMRef<HTMLDivElement>) {\n [props, ref] = useSpectrumContextProps(props, ref, AccordionContext);\n let domRef = useDOMRef(ref);\n let {\n UNSAFE_style,\n UNSAFE_className = '',\n size = 'M',\n density = 'regular',\n isQuiet\n } = props;\n return (\n <DisclosureContext.Provider value={{size, isQuiet, density}}>\n <DisclosureGroup\n {...props}\n ref={domRef}\n style={UNSAFE_style}\n className={(UNSAFE_className ?? '') + accordion(null, props.styles)}>\n {props.children}\n </DisclosureGroup>\n </DisclosureContext.Provider>\n );\n});\n"],"names":[],"version":3,"file":"Accordion.css.map"}