salla-edit-order-button

A button for the order details page that lets the customer edit an order or pay the price difference after an edit. It loads the order, then shows (a) an "Edit order" button with a countdown to the end of the edit window when the order is editable, (b) a "Pay the difference" button when the order has a customer payment URL, or (c) nothing. It also renders nothing while loading or when the order cannot be fetched.

Use itCopy Anchor Link

In HTML or JSX, use the tag <salla-edit-order-button> with the Attribute names below. In React, the wrapper takes the Property names (camelCase).

import { SallaEditOrderButton } from '@salla.sa/twilight-components-react/edit-order-button';

ExampleCopy Anchor Link

import { SallaEditOrderButton } from '@salla.sa/twilight-components-react/edit-order-button';

export function Example() {
  return (
    <SallaEditOrderButton />
  );
}

import { SallaEditOrderButton } from '@salla.sa/twilight-components-react/edit-order-button';

export function Example() {
  return (
    <SallaEditOrderButton orderId="123456" />
  );
}

PropertiesCopy Anchor Link

RelatedCopy Anchor Link

Renders: <salla-count-down>, <salla-button>.