import { SeparatorHorizontalIcon } from '@zen/core/shared/icons';
import { newBlockId } from '../utils/ids.js';

function DividerComponent() {
  return (
    <div className="py-2">
      <hr className="border-0 h-px bg-neutral-300 dark:bg-neutral-700" />
    </div>
  );
}

const Divider = {
  type: 'divider',
  label: 'Séparateur',
  icon: <SeparatorHorizontalIcon width={18} height={18} />,
  keywords: ['separateur', 'divider', 'hr', 'ligne', 'line'],
  shortcut: '---',
  isText: false,
  create(init = {}) {
    return { id: newBlockId(), type: 'divider', ...init };
  },
  Component: DividerComponent,
};

export default Divider;
