@applicaster/zapp-react-native-ui-components/Components/MasterCell/SharedUI/CollapsibleTextContainer/index.ts

Applicaster Zapp React Native ui components for the Quick Brick App

import { path } from "ramda";
import { isNilOrEmpty } from "@applicaster/zapp-react-native-utils/reactUtils/helpers";
import {
  getColorFromData,
  getKeyForLabel,
  mapSelfAlignment,
} from "@applicaster/zapp-react-native-utils/cellUtils";
import { toNumberWithDefaultZero } from "@applicaster/zapp-react-native-utils/numberUtils";

type Props = {
  getValue: Function;
  elements: Array<any>;
  additionalStyles: Record<string, any>;
  customData?: Array<any>;
};

export const CollapsibleTextContainer = ({
  getValue,
  elements,
  additionalStyles,
  customData,
}: Props) => {
  return {
    type: "CollapsibleTextContainer", // Collapsible Text Container,
    style: {
      alignSelf: mapSelfAlignment(getValue("text_alignment")),
      marginTop: toNumberWithDefaultZero(getValue("margin_top")),
      marginRight: toNumberWithDefaultZero(getValue("margin_right")),
      marginBottom: toNumberWithDefaultZero(getValue("margin_bottom")),
      marginLeft: toNumberWithDefaultZero(getValue("margin_left")),
      paddingTop: toNumberWithDefaultZero(getValue("padding_top")),
      paddingRight: toNumberWithDefaultZero(getValue("padding_right")),
      paddingBottom: toNumberWithDefaultZero(getValue("padding_bottom")),
      paddingLeft: toNumberWithDefaultZero(getValue("padding_left")),
      borderRadius: toNumberWithDefaultZero(getValue("corner_radius")),
      ...additionalStyles,
    },
    data: [
      ...(customData || [
        {
          func: (data, args) =>
            isNilOrEmpty(args) ? undefined : path(args, data),
          args: getKeyForLabel(
            getValue("data_key"),
            getValue("custom_data_key")
          ),
          propName: "label",
        },
      ]),
      {
        func: (data) => {
          return getColorFromData({
            data,
            valueFromLayout: additionalStyles.backgroundColor,
          });
        },
        propName: "backgroundColor",
      },
    ],
    elements,
  };
};