@audira/carbon-react-native/lib/module/components/accordion/_Item.js

Build React Native apps with component and shared patterns using Carbon

"use strict";

import { forwardRef, useCallback, useContext, useImperativeHandle, useRef, useState } from 'react';
import { StyleSheet, View } from 'react-native';
import { Spacing } from '@audira/carbon-react-native-elements';
import { GlobalConfigContext } from "../../_internal/contexts/index.js";
import { CommonStyleSheet } from "../../_internal/style-sheets/index.js";
import { Collapsible } from "../collapsible/index.js";
import { Header } from "./_Header.js";
import { Context } from "./_context.js";
import { Motion } from "./_motion.js";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
export const Item = /*#__PURE__*/forwardRef(function Item({
  defaultOpen,
  open: openProp,
  title,
  children,
  style: styleProp,
  onPressHeader,
  headerProps,
  ...props
}, forwardedRef) {
  const globalConfigContext = useContext(GlobalConfigContext),
    accordionContext = useContext(Context),
    ref = useRef({
      allowOnChangeEffect: false,
      open: !!defaultOpen
    }),
    viewRef = useRef(null),
    [openSelf, setOpenSelf] = useState(ref.current.open),
    controlled = typeof openProp !== 'undefined',
    open = controlled ? !!openProp : openSelf,
    pressHandler = useCallback(event => {
      onPressHeader?.(event);
      if (!controlled) {
        ref.current.allowOnChangeEffect = true;
        setOpenSelf(state => !state);
      }
    }, [controlled, onPressHeader]);
  useImperativeHandle(forwardedRef, () => {
    return Object.assign(viewRef.current ?? {}, {
      get open() {
        return ref.current.open;
      },
      setOpen(value) {
        if (!controlled) {
          if (typeof value === 'boolean') {
            ref.current.open = value;
          } else {
            ref.current.open = value(ref.current.open);
          }
          setOpenSelf(ref.current.open);
        }
      }
    });
  }, [controlled]);
  return /*#__PURE__*/_jsxs(View, {
    ...props,
    style: styleProp,
    children: [/*#__PURE__*/_jsx(Header, {
      ...headerProps,
      open: open,
      size: accordionContext.size,
      text: title,
      flushAlignment: accordionContext.flushAlignment,
      onPress: pressHandler
    }), /*#__PURE__*/_jsx(Collapsible, {
      motion: Motion,
      open: open,
      dir: globalConfigContext.rtl ? 'rtl' : undefined,
      contentContainerStyle: [globalConfigContext.rtl ? CommonStyleSheet.rtl : undefined, accordionContext.collapsibleContentContainerStyle, style.panel],
      children: children
    })]
  });
});
const style = StyleSheet.create({
  panel: {
    paddingTop: Spacing.spacing_03,
    paddingBottom: Spacing.spacing_06,
    paddingLeft: Spacing.spacing_05
  }
});
//# sourceMappingURL=_Item.js.map