All files / src/section CountInfo.tsx

100% Statements 24/24
70.58% Branches 12/17
100% Functions 2/2
100% Lines 22/22

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47          22x 12x 12x 12x     22x             22x     119x 119x   119x   119x   117x 117x   117x   117x 117x 117x     117x 117x 117x 117x 116x     22x  
import { type TagType } from '../store/Types';
import { type SectionElement, type SectionElementProps, useSectionStore } from '../store/Section';
import { useSectionRender } from '../utils/useRender';
import { useStore } from '../store';
 
export const CountInfo = <K extends TagType>(props: SectionElement<K>) => {
  const { CountInfo: Comp = {} } = useSectionStore();
  useSectionRender(Comp, props, 'CountInfo');
  return null;
};
 
CountInfo.displayName = 'JVR.CountInfo';
 
export interface CountInfoCompProps<T extends object> {
  value?: T;
  keyName: string | number;
}
 
export const CountInfoComp = <K extends TagType, T extends object>(
  props: SectionElementProps<K> & CountInfoCompProps<T> & React.HTMLAttributes<HTMLElement>,
) => {
  const { value = {}, keyName, ...other } = props;
  const { displayObjectSize } = useStore();
 
  const { CountInfo: Comp = {} } = useSectionStore();
 
  if (!displayObjectSize) return null;
 
  const { as, render, ...reset } = Comp;
  const Elm = as || 'span';
 
  reset.style = { ...reset.style, ...props.style };
 
  const len = Object.keys(value).length;
  Eif (!reset.children) {
    reset.children = `${len} item${len === 1 ? '' : 's'}`;
  }
 
  const elmProps = { ...reset, ...other };
  const isRender = render && typeof render === 'function';
  const child = isRender && render({ ...elmProps, 'data-length': len } as React.HTMLAttributes<K>, { value, keyName });
  if (child) return child;
  return <Elm {...elmProps} />;
};
 
CountInfoComp.displayName = 'JVR.CountInfoComp';