import React from 'react';
import './Divider.css';

/* 分割线（移动端）— 规格 §8；纯装饰（role=separator + aria-hidden），带文字时不隐藏 */
export default function Divider({
  orientation = 'horizontal',
  align = 'center',
  dashed = false,
  children = null,
}) {
  const withText = !!children;
  const cls =
    'kole-m-divider' +
    (withText ? ' kole-m-divider--text' : '') +
    ` kole-m-divider--${align}` +
    (dashed ? ' kole-m-divider--dashed' : '') +
    (orientation === 'vertical' ? ' kole-m-divider--vertical' : '');

  /* 纯装饰的分割线对读屏无信息量 → aria-hidden；带文字时文字本身即语义 */
  return (
    <div className={cls} role="separator" aria-hidden={withText ? undefined : 'true'}>
      {withText ? <span className="kole-m-divider__text">{children}</span> : null}
    </div>
  );
}