@ramses-superapp/ramses-ui/lib/module/components/RsDivider.js

Skinless UI primitives for Ramses Built Apps

"use strict";

import React from 'react';
import { View } from 'react-native';
import { useTheme } from "../hooks/ThemeProvider.js";
import RsText from "./RsText.js";
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
const RsDivider = ({
  direction = 'column',
  thickness = 1,
  color,
  margin = 8,
  content,
  textProps = {},
  style,
  lineStyle
}) => {
  const theme = useTheme();
  const isHorizontal = direction === 'column';
  const lineColor = color || theme.Borders.input;

  // Line style for left/top and right/bottom
  const baseLineStyle = isHorizontal ? {
    flex: 1,
    height: thickness,
    backgroundColor: lineColor,
    marginHorizontal: 0,
    marginVertical: margin
  } : {
    flex: 1,
    width: thickness,
    backgroundColor: lineColor,
    marginVertical: 0,
    marginHorizontal: margin
  };

  // Container flex direction
  const containerStyle = {
    flexDirection: isHorizontal ? 'row' : 'column',
    alignItems: 'center',
    ...style
  };

  // Render center content
  let centerContent = null;
  if (typeof content === 'string' || typeof content === 'number') {
    centerContent = /*#__PURE__*/_jsx(RsText, {
      text: content,
      fontSize: 12,
      fontWeight: "Regular",
      color: theme.Text.text,
      style: {
        marginHorizontal: isHorizontal ? 8 : 0,
        marginVertical: isHorizontal ? 0 : 8
      },
      ...textProps
    });
  } else if (content) {
    centerContent = /*#__PURE__*/_jsx(View, {
      style: {
        marginHorizontal: isHorizontal ? 8 : 0,
        marginVertical: isHorizontal ? 0 : 8
      },
      children: content
    });
  }
  return /*#__PURE__*/_jsxs(View, {
    style: containerStyle,
    children: [/*#__PURE__*/_jsx(View, {
      style: [baseLineStyle, lineStyle]
    }), centerContent, /*#__PURE__*/_jsx(View, {
      style: [baseLineStyle, lineStyle]
    })]
  });
};
export default RsDivider;
//# sourceMappingURL=RsDivider.js.map