iOS — Swift Package Manager

.package(url: "https://github.com/AY-Org/eb-ds-ios", from: "1.0.0")

Android — Gradle (Kotlin DSL)

implementation("com.eastblue.ds:voucher:1.0.0")

Import

import EastBlueDS
import com.eastblue.ds.voucher.*

Planned API — the native library does not exist yet. The artifact is the Voucher family: this component, <a href="/components/voucher">Voucher</a> and the other five members all ship in <code>com.eastblue.ds:voucher</code> and import <code>com.eastblue.ds.voucher.*</code>.

One enum, five booleans and two slots. The booleans are not parameters: each asks whether an optional piece of content is present, so the optional itself is what a caller passes. The two layouts compose differently, and that is the one thing a mapping has to carry forward. TextBlock draws its own terms frame and owns the three text layers inside it, so a link is something this component renders. Accordion places a Terms and Conditions Accordion instance and inherits whatever that component draws — which is why hasLink has nothing to act on there, and why the terms rows arrive as content rather than as strings. Natively that is two shapes behind one enum, not one shape with a flag.

EBVoucherDetails(
    layout: .textblock,
    merchant: "Brand",
    branch: "All branches",
    title: "Voucher Title",
    price: "PHP 200.00",
    originalPrice: "PHP 280.00",
    validity: "Mar 11 2023 - Mar 14 2023",
    description: "For every 12 oz or larger beverage purchase…",
    badge: { EBBadge("Limited") },
    linkLabel: "See full promo mechanics."
) {
    EBBrandLogo(image: "brand-mark")
}

EBVoucherDetails(
    layout = EBVoucherDetailsLayout.Textblock,
    merchant = "Brand",
    branch = "All branches",
    title = "Voucher Title",
    price = "PHP 200.00",
    originalPrice = "PHP 280.00",
    validity = "Mar 11 2023 - Mar 14 2023",
    description = "For every 12 oz or larger beverage purchase…",
    badge = { EBBadge("Limited") },
    linkLabel = "See full promo mechanics."
) {
    EBBrandLogo(image = "brand-mark")
}

EBVoucherDetails(
    layout: .accordion,
    merchant: "Brand",
    branch: "All branches",
    title: "Voucher Title",
    price: "PHP 200.00",
    originalPrice: "PHP 280.00",
    validity: "Mar 11 2023 - Mar 14 2023",
    description: "For every 12 oz or larger beverage purchase…",
    badge: { EBBadge("Limited") }
) {
    EBBrandLogo(image: "brand-mark")
}

EBVoucherDetails(
    layout = EBVoucherDetailsLayout.Accordion,
    merchant = "Brand",
    branch = "All branches",
    title = "Voucher Title",
    price = "PHP 200.00",
    originalPrice = "PHP 280.00",
    validity = "Mar 11 2023 - Mar 14 2023",
    description = "For every 12 oz or larger beverage purchase…",
    badge = { EBBadge("Limited") }
) {
    EBBrandLogo(image = "brand-mark")
}

1 Layout setting × 2 values. Everything above the notched divider is identical between them.