@ikas/code-components-mcp 0.104.0 → 0.106.0

package/data/section-templates/account-info-section/children/AccountOrderDetail/components/PackageGroup/styles.css

@@ -0,0 +1,100 @@
+.kombos-order-detail-pkg {
+  display: flex;
+  flex-direction: column;
+  gap: 1.5rem;
+  width: 100%;
+}
+
+.kombos-order-detail-pkg__header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  background: var(--kombos-gray-100);
+  border: none;
+  border-radius: 6px;
+  padding: 0.375rem 0.75rem;
+  cursor: pointer;
+  width: 100%;
+}
+
+.kombos-order-detail-pkg__header:focus-visible {
+  outline: 2px solid var(--kombos-gray-900);
+  outline-offset: 2px;
+}
+
+.kombos-order-detail-pkg__header-left {
+  display: flex;
+  align-items: center;
+  gap: 0.25rem;
+}
+
+.kombos-order-detail-pkg__status {
+  color: var(--kombos-gray-900);
+}
+
+.kombos-order-detail-pkg__count {
+  color: var(--kombos-gray-900);
+}
+
+.kombos-order-detail-pkg__caret {
+  display: flex;
+  align-items: center;
+  color: var(--kombos-gray-900);
+  font-size: 1rem;
+}
+
+.kombos-order-detail-pkg__body {
+  display: flex;
+  flex-direction: column;
+  gap: 1.5rem;
+}
+
+.kombos-order-detail-pkg__items {
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+}
+
+.kombos-order-detail-pkg__tracking {
+  display: flex;
+  flex-direction: column;
+  gap: 0.375rem;
+}
+
+.kombos-order-detail-pkg__tracking-line {
+  color: var(--kombos-gray-900);
+}
+
+.kombos-order-detail-pkg__tracking-link {
+  color: var(--kombos-gray-900);
+  text-decoration: underline;
+}
+
+.kombos-order-detail-pkg__tracking-link:hover {
+  color: var(--kombos-gray-700);
+}
+
+/* Bundle group */
+.kombos-order-detail-pkg__bundle {
+  border: 1px solid var(--kombos-gray-200);
+  border-radius: 6px;
+  padding: 1rem;
+  display: flex;
+  flex-direction: column;
+  gap: 0.75rem;
+}
+
+.kombos-order-detail-pkg__bundle-name {
+  color: var(--kombos-gray-900);
+}
+
+.kombos-order-detail-pkg__bundle-items {
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+}
+
+.kombos-order-detail-pkg__bundle-items .kombos-order-detail-item:last-child {
+  padding-bottom: 0;
+  border-bottom: none;
+}

package/data/section-templates/account-info-section/children/AccountOrderDetail/components/ReturnItemRow/index.tsx

@@ -0,0 +1,56 @@
+import { IkasOrderLineItem } from "@ikas/bp-storefront";
+import Checkbox from "../../../../sub-components/Checkbox";
+import { MinusSVG, PlusSVG } from "../../../../sub-components/icons";
+import OrderLineItemDisplay from "../OrderLineItemDisplay";
+
+interface Props {
+  item: IkasOrderLineItem;
+  refundQty: number;
+  onToggle: () => void;
+  onDecrease: () => void;
+  onIncrease: () => void;
+}
+
+export default function ReturnItemRow({
+  item,
+  refundQty,
+  onToggle,
+  onDecrease,
+  onIncrease,
+}: Props) {
+  const selected = refundQty > 0;
+
+  return (
+    <div className="kombos-order-detail-return__item">
+      <div className="kombos-order-detail-return__item-row">
+        <Checkbox checked={selected} onChange={onToggle} />
+        <OrderLineItemDisplay item={item} />
+        {selected && item.quantity > 1 && (
+          <div className="kombos-order-detail-return__qty">
+            <button
+              type="button"
+              className="kombos-order-detail-return__qty-btn"
+              onClick={onDecrease}
+              disabled={refundQty <= 1}
+              aria-label="Decrease refund quantity"
+            >
+              <MinusSVG />
+            </button>
+            <span className="kombos-order-detail-return__qty-value text-md-medium">
+              {refundQty}
+            </span>
+            <button
+              type="button"
+              className="kombos-order-detail-return__qty-btn kombos-order-detail-return__qty-btn--plus"
+              onClick={onIncrease}
+              disabled={refundQty >= item.quantity}
+              aria-label="Increase refund quantity"
+            >
+              <PlusSVG />
+            </button>
+          </div>
+        )}
+      </div>
+    </div>
+  );
+}

package/data/section-templates/account-info-section/children/AccountOrderDetail/components/ReturnItemRow/styles.css

@@ -0,0 +1,57 @@
+.kombos-order-detail-return__item {
+  padding-bottom: 1.5rem;
+  border-bottom: 1px solid var(--kombos-gray-100);
+}
+
+.kombos-order-detail-return__item-row {
+  display: flex;
+  align-items: center;
+  gap: 1.5rem;
+  flex: 1;
+}
+
+/* Quantity selector for return */
+.kombos-order-detail-return__qty {
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+}
+
+.kombos-order-detail-return__qty-btn {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 2rem;
+  height: 2rem;
+  border: 1px solid var(--kombos-gray-200);
+  border-radius: 6px;
+  background: var(--kombos-white);
+  cursor: pointer;
+  color: var(--kombos-gray-900);
+  font-size: 1rem;
+  padding: 0;
+}
+
+.kombos-order-detail-return__qty-btn--plus {
+  background: var(--kombos-gray-50);
+}
+
+.kombos-order-detail-return__qty-btn:hover:not(:disabled) {
+  border-color: var(--kombos-gray-300);
+}
+
+.kombos-order-detail-return__qty-btn:disabled {
+  color: var(--kombos-gray-300);
+  cursor: not-allowed;
+}
+
+.kombos-order-detail-return__qty-btn:focus-visible {
+  outline: 2px solid var(--kombos-gray-900);
+  outline-offset: 2px;
+}
+
+.kombos-order-detail-return__qty-value {
+  min-width: 2rem;
+  text-align: center;
+  color: var(--kombos-gray-900);
+}

package/data/section-templates/account-info-section/children/AccountOrderDetail/components/ReturnView/index.tsx

@@ -0,0 +1,159 @@
+import { useState } from "preact/hooks";
+import {
+  IkasOrder,
+  IkasOrderLineItem,
+  customerStore,
+  refundOrder,
+  Router,
+  getIkasOrderRefundableItems,
+  setOrderLineItemRefundQuantity,
+  isIkasOrderRefundable,
+} from "@ikas/bp-storefront";
+import Breadcrumb from "../../../../sub-components/Breadcrumb";
+import Button from "../../../../sub-components/Button";
+import { showToast } from "../../../../utils/toast";
+import OrderHeader from "../OrderHeader";
+import ReturnItemRow from "../ReturnItemRow";
+
+interface Props {
+  order: IkasOrder;
+  breadcrumbOrdersLabel: string;
+  breadcrumbOrderLabel: string;
+  orderNoLabel: string;
+  orderStatusLabel: string;
+  orderDateLabel: string;
+  returnRequestTitle: string;
+  returnSubmitText: string;
+  returningButtonText: string;
+  returnSuccessText: string;
+  returnErrorText: string;
+  copiedText: string;
+  onBack: () => void;
+  onSuccess: () => void;
+}
+
+function ReturnView({
+  order,
+  breadcrumbOrdersLabel,
+  breadcrumbOrderLabel,
+  orderNoLabel,
+  orderStatusLabel,
+  orderDateLabel,
+  returnRequestTitle,
+  returnSubmitText,
+  returningButtonText,
+  returnSuccessText,
+  returnErrorText,
+  copiedText,
+  onBack,
+  onSuccess,
+}: Props) {
+  const [submitting, setSubmitting] = useState(false);
+  const [quantities, setQuantities] = useState<Record<string, number>>({});
+  const refundableItems = getIkasOrderRefundableItems(order);
+
+  const orderRefundable = isIkasOrderRefundable(order);
+
+  const disabled = !orderRefundable || submitting;
+
+  const updateQuantity = (item: IkasOrderLineItem, next: number) => {
+    const current = quantities[item.id] ?? 0;
+    if (next === current) return;
+    setOrderLineItemRefundQuantity(next || null, item);
+    if (next <= 0) {
+      const { [item.id]: _, ...rest } = quantities;
+      setQuantities(rest);
+    } else {
+      setQuantities({ ...quantities, [item.id]: next });
+    }
+  };
+
+  const handleToggle = (item: IkasOrderLineItem) => {
+    const current = quantities[item.id] ?? 0;
+    updateQuantity(item, current > 0 ? 0 : 1);
+  };
+
+  const handleDecrease = (item: IkasOrderLineItem) => {
+    const current = quantities[item.id] ?? 0;
+    updateQuantity(item, Math.max(0, current - 1));
+  };
+
+  const handleIncrease = (item: IkasOrderLineItem) => {
+    const current = quantities[item.id] ?? 0;
+    updateQuantity(item, Math.min(item.quantity, current + 1));
+  };
+
+  const handleSubmit = async () => {
+    if (disabled) return;
+    setSubmitting(true);
+    try {
+      const success = await refundOrder(customerStore, order);
+      if (success) {
+        showToast(returnSuccessText, "success");
+        onSuccess();
+      } else {
+        showToast(returnErrorText, "error");
+      }
+    } catch {
+      showToast(returnErrorText, "error");
+    } finally {
+      setSubmitting(false);
+    }
+  };
+
+  return (
+    <div className="kombos-order-detail-return">
+      <Breadcrumb
+        items={[
+          {
+            label: breadcrumbOrdersLabel,
+            onClick: () => Router.navigateToPage("ORDERS"),
+          },
+          {
+            label: `${order.orderNumber} ${breadcrumbOrderLabel}`,
+            onClick: onBack,
+          },
+          { label: returnRequestTitle },
+        ]}
+      />
+
+      <div className="kombos-order-detail-return__content">
+        <OrderHeader
+          order={order}
+          orderNoLabel={orderNoLabel}
+          orderStatusLabel={orderStatusLabel}
+          orderDateLabel={orderDateLabel}
+          copiedText={copiedText}
+        />
+
+        <div className="kombos-order-detail-return__items">
+          {refundableItems.map((item) => (
+            <ReturnItemRow
+              key={item.id}
+              item={item}
+              refundQty={quantities[item.id] ?? 0}
+              onToggle={() => handleToggle(item)}
+              onDecrease={() => handleDecrease(item)}
+              onIncrease={() => handleIncrease(item)}
+            />
+          ))}
+        </div>
+
+        <div className="kombos-order-detail-return__footer">
+          <Button
+            variant="primary"
+            size="s"
+            onClick={handleSubmit}
+            loading={submitting}
+            disabled={disabled}
+            className="kombos-order-detail-return__submit-btn"
+          >
+            {submitting ? returningButtonText : returnSubmitText}
+          </Button>
+        </div>
+      </div>
+    </div>
+  );
+}
+
+export default ReturnView;

package/data/section-templates/account-info-section/children/AccountOrderDetail/components/ReturnView/styles.css

@@ -0,0 +1,29 @@
+.kombos-order-detail-return {
+  display: flex;
+  flex-direction: column;
+  gap: 1.5rem;
+  width: 100%;
+}
+
+
+.kombos-order-detail-return__content {
+  display: flex;
+  flex-direction: column;
+  gap: 2rem;
+}
+
+.kombos-order-detail-return__items {
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+}
+
+/* Footer */
+.kombos-order-detail-return__footer {
+  display: flex;
+  justify-content: flex-end;
+}
+
+.kombos-order-detail-return__submit-btn {
+  width: 100%;
+}

package/data/section-templates/account-info-section/children/AccountOrderDetail/ikas-config-snippet.json

@@ -0,0 +1,283 @@
+{
+  "id": "{{PROJECT_ID}}-account-order-detail",
+  "name": "AccountOrderDetail",
+  "type": "component",
+  "entry": "./src/components/AccountOrderDetail/index.tsx",
+  "styles": "./src/components/AccountOrderDetail/styles.css",
+  "props": [
+    {
+      "name": "breadcrumbOrdersLabel",
+      "displayName": "Breadcrumb Siparişler Etiketi",
+      "type": "TEXT",
+      "required": false,
+      "defaultValue": "Siparişlerim",
+      "groupId": "navigation"
+    },
+    {
+      "name": "breadcrumbOrderLabel",
+      "displayName": "Breadcrumb Sipariş Etiketi",
+      "type": "TEXT",
+      "required": false,
+      "defaultValue": "Nolu Sipariş",
+      "groupId": "navigation"
+    },
+    {
+      "name": "orderNoLabel",
+      "displayName": "Sipariş No Etiketi",
+      "type": "TEXT",
+      "required": false,
+      "defaultValue": "Sipariş No:",
+      "groupId": "orderInfo"
+    },
+    {
+      "name": "orderStatusLabel",
+      "displayName": "Sipariş Durumu Etiketi",
+      "type": "TEXT",
+      "required": false,
+      "defaultValue": "Sipariş Durumu:",
+      "groupId": "orderInfo"
+    },
+    {
+      "name": "orderDateLabel",
+      "displayName": "Sipariş Tarihi Etiketi",
+      "type": "TEXT",
+      "required": false,
+      "defaultValue": "Sipariş Tarihi:",
+      "groupId": "orderInfo"
+    },
+    {
+      "name": "returnButtonText",
+      "displayName": "İade Butonu Metni",
+      "type": "TEXT",
+      "required": false,
+      "defaultValue": "İade Et",
+      "groupId": "returnRequest"
+    },
+    {
+      "name": "returningButtonText",
+      "displayName": "İade Ediliyor Metni",
+      "type": "TEXT",
+      "required": false,
+      "defaultValue": "İade talebi gönderiliyor...",
+      "groupId": "returnRequest"
+    },
+    {
+      "name": "returnRequestTitle",
+      "displayName": "İade Talebi Başlığı",
+      "type": "TEXT",
+      "required": false,
+      "defaultValue": "İade Talebi",
+      "groupId": "returnRequest"
+    },
+    {
+      "name": "returnSubmitText",
+      "displayName": "İade Gönder Metni",
+      "type": "TEXT",
+      "required": false,
+      "defaultValue": "İade Et",
+      "groupId": "returnRequest"
+    },
+    {
+      "name": "deliveryAddressLabel",
+      "displayName": "Teslimat Adresi Etiketi",
+      "type": "TEXT",
+      "required": false,
+      "defaultValue": "Teslimat Adresi",
+      "groupId": "addressPayment"
+    },
+    {
+      "name": "billingAddressLabel",
+      "displayName": "Fatura Adresi Etiketi",
+      "type": "TEXT",
+      "required": false,
+      "defaultValue": "Fatura Adresi",
+      "groupId": "addressPayment"
+    },
+    {
+      "name": "paymentInfoLabel",
+      "displayName": "Ödeme Bilgisi Etiketi",
+      "type": "TEXT",
+      "required": false,
+      "defaultValue": "Ödeme Bilgileri",
+      "groupId": "addressPayment"
+    },
+    {
+      "name": "summaryLabel",
+      "displayName": "Özet Etiketi",
+      "type": "TEXT",
+      "required": false,
+      "defaultValue": "Özet",
+      "groupId": "summary"
+    },
+    {
+      "name": "subtotalLabel",
+      "displayName": "Ara Toplam Etiketi",
+      "type": "TEXT",
+      "required": false,
+      "defaultValue": "Ara Toplam",
+      "groupId": "summary"
+    },
+    {
+      "name": "shippingLabel",
+      "displayName": "Kargo Etiketi",
+      "type": "TEXT",
+      "required": false,
+      "defaultValue": "Kargo",
+      "groupId": "summary"
+    },
+    {
+      "name": "totalLabel",
+      "displayName": "Toplam Etiketi",
+      "type": "TEXT",
+      "required": false,
+      "defaultValue": "Toplam",
+      "groupId": "summary"
+    },
+    {
+      "name": "taxIncludedText",
+      "displayName": "KDV Dahil Metni",
+      "type": "TEXT",
+      "required": false,
+      "defaultValue": "*vergiler dahil",
+      "groupId": "summary"
+    },
+    {
+      "name": "cargoCompanyLabel",
+      "displayName": "Kargo Firması Etiketi",
+      "type": "TEXT",
+      "required": false,
+      "defaultValue": "Kargo Şirketi:",
+      "groupId": "shipping"
+    },
+    {
+      "name": "trackingNumberLabel",
+      "displayName": "Takip Numarası Etiketi",
+      "type": "TEXT",
+      "required": false,
+      "defaultValue": "Takip Numarası:",
+      "groupId": "shipping"
+    },
+    {
+      "name": "quantityLabel",
+      "displayName": "Adet Etiketi",
+      "type": "TEXT",
+      "required": false,
+      "defaultValue": "adet",
+      "groupId": "orderInfo"
+    },
+    {
+      "name": "errorText",
+      "displayName": "Hata Metni",
+      "type": "TEXT",
+      "required": false,
+      "defaultValue": "Sipariş bulunamadı.",
+      "groupId": "states"
+    },
+    {
+      "name": "backToOrdersText",
+      "displayName": "Siparişlere Dön Metni",
+      "type": "TEXT",
+      "required": false,
+      "defaultValue": "Siparişlerime Dön",
+      "groupId": "navigation"
+    },
+    {
+      "name": "returnSuccessText",
+      "displayName": "İade Başarılı Metni",
+      "type": "TEXT",
+      "required": false,
+      "defaultValue": "İade talebiniz başarıyla oluşturuldu.",
+      "groupId": "returnRequest"
+    },
+    {
+      "name": "returnErrorText",
+      "displayName": "İade Hatası Metni",
+      "type": "TEXT",
+      "required": false,
+      "defaultValue": "İade talebi oluşturulurken bir hata oluştu.",
+      "groupId": "returnRequest"
+    },
+    {
+      "name": "copiedText",
+      "displayName": "Kopyalandı Metni",
+      "type": "TEXT",
+      "required": false,
+      "defaultValue": "Kopyalandı!",
+      "groupId": "shipping"
+    },
+    {
+      "name": "installmentText",
+      "displayName": "Taksit Metni",
+      "type": "TEXT",
+      "required": false,
+      "defaultValue": "Taksit",
+      "groupId": "addressPayment"
+    },
+    {
+      "name": "singlePaymentText",
+      "displayName": "Tek Çekim Metni",
+      "type": "TEXT",
+      "required": false,
+      "defaultValue": "Tek Çekim",
+      "groupId": "addressPayment"
+    },
+    {
+      "name": "downloadSectionTitle",
+      "displayName": "İndirilebilir Dosyalar Başlığı",
+      "type": "TEXT",
+      "required": false,
+      "defaultValue": "İndirilebilir Dosyalar",
+      "groupId": "downloads"
+    },
+    {
+      "name": "downloadButtonText",
+      "displayName": "İndir Butonu",
+      "type": "TEXT",
+      "required": false,
+      "defaultValue": "İndir",
+      "groupId": "downloads"
+    }
+  ],
+  "propGroups": [
+    {
+      "id": "orderInfo",
+      "name": "Sipariş Bilgileri",
+      "description": "Sipariş detay başlığında gösterilen etiketler (sipariş no, durum, tarih)"
+    },
+    {
+      "id": "navigation",
+      "name": "Navigasyon",
+      "description": "Breadcrumb ve geri dönüş butonundaki metinler"
+    },
+    {
+      "id": "addressPayment",
+      "name": "Adres ve Ödeme",
+      "description": "Teslimat adresi, fatura adresi ve ödeme bilgileri başlıkları"
+    },
+    {
+      "id": "summary",
+      "name": "Sipariş Özeti",
+      "description": "Ara toplam, kargo, toplam gibi özet satır etiketleri"
+    },
+    {
+      "id": "shipping",
+      "name": "Kargo Bilgileri",
+      "description": "Paket kargo şirketi, takip numarası ve kopyalama geri bildirimi"
+    },
+    {
+      "id": "returnRequest",
+      "name": "İade Talebi",
+      "description": "İade ekranındaki başlık, buton ve bildirim metinleri"
+    },
+    {
+      "id": "states",
+      "name": "Durum Mesajları",
+      "description": "Yükleme ve hata durumlarında gösterilen metinler"
+    },
+    {
+      "id": "downloads",
+      "name": "İndirilebilir Dosyalar",
+      "description": "Dijital ürün indirme bölümündeki başlık ve buton metinleri"
+    }
+  ]
+}