Separator

import { Separator } from "@medway-ui/core";
 
<div className="w-full max-w-md space-y-4">
  <div className="text-sm">Above the separator</div>
  <Separator />
  <div className="text-sm">Below the separator</div>
</div>

import { Separator } from "@medway-ui/core";
 
<div className="flex h-20 items-center space-x-4 text-sm">
  <div>Left content</div>
  <Separator orientation="vertical" />
  <div>Right content</div>
  <Separator orientation="vertical" />
  <div>More content</div>
</div>

import { Separator } from "@medway-ui/core";
 
<div className="border rounded-lg p-4 space-y-4 max-w-sm">
  <div className="flex items-center justify-between">
    <h3 className="font-semibold">Order Summary</h3>
    <span className="text-sm text-gray-500">#12345</span>
  </div>
  
  <Separator />
  
  <div className="space-y-2">
    <div className="flex justify-between text-sm">
      <span>Subtotal</span>
      <span>$99.00</span>
    </div>
    <div className="flex justify-between text-sm">
      <span>Shipping</span>
      <span>$9.99</span>
    </div>
    <div className="flex justify-between text-sm">
      <span>Tax</span>
      <span>$10.90</span>
    </div>
  </div>
  
  <Separator />
  
  <div className="flex justify-between font-semibold">
    <span>Total</span>
    <span>$119.89</span>
  </div>
</div>