admin-ui-starter-kit 0.1.0 → 0.1.1

package/dist/showcase/assets/commerce-Qz-mq8mQ.js

@@ -0,0 +1,78 @@
+import{n as e}from"./chunk-CilyBKbf.js";import{cr as t,gr as n,hr as r,lr as i,r as a,sr as o,t as s,vr as c}from"./example-6phCHGsN.js";import{t as l}from"./gift-NkuklfU2.js";import{D as u,a as d,r as f}from"./index-B4ubXfly.js";import{t as p}from"./props-table-uDY4eIzt.js";import{t as m}from"./smart-card-BisUbLPt.js";import{t as h}from"./separator-DWv-twD-.js";import{t as g}from"./inline-stat-Bm1zVT8D.js";import{t as _}from"./date-block-iiHUpbNX.js";import{c as v,i as y,n as b,o as x,r as S,t as C,u as w}from"./item-BiMm1PPB.js";var T=f(`trophy`,[[`path`,{d:`M10 14.66v1.626a2 2 0 0 1-.976 1.696A5 5 0 0 0 7 21.978`,key:`1n3hpd`}],[`path`,{d:`M14 14.66v1.626a2 2 0 0 0 .976 1.696A5 5 0 0 1 17 21.978`,key:`rfe1zi`}],[`path`,{d:`M18 9h1.5a1 1 0 0 0 0-5H18`,key:`7xy6bh`}],[`path`,{d:`M4 22h16`,key:`57wxv0`}],[`path`,{d:`M6 9a6 6 0 0 0 12 0V3a1 1 0 0 0-1-1H7a1 1 0 0 0-1 1z`,key:`1mhfuq`}],[`path`,{d:`M6 9H4.5a1 1 0 0 1 0-5H6`,key:`tex48p`}]]),E=d();function D(e){if(e.date!=null)return e.date;if(e.day&&e.month){let t=new Date().getFullYear(),n=new Date(`${e.month} ${e.day}, ${t}`);if(!Number.isNaN(n.getTime()))return n}return null}function O({bookings:e,className:t,locale:r,dateTone:i=`primary`,timePlacement:a=`below`}){return(0,E.jsx)(x,{className:c(`upcoming-booking--component`,t),children:e.map((e,t)=>{let o=D(e);return(0,E.jsxs)(C,{children:[!!o&&(0,E.jsx)(v,{children:(0,E.jsx)(_,{date:o,time:a===`below`?e.time:void 0,tone:i,locale:r,timePlacement:`below`,layout:`stacked`})}),(0,E.jsxs)(S,{children:[(0,E.jsx)(w,{children:e.service}),(0,E.jsx)(y,{clamp:1,children:e.customer})]}),(0,E.jsxs)(b,{children:[a===`inline-trailing`&&(0,E.jsx)(n,{size:`xs`,type:`secondary`,className:`shrink-0 tabular-nums`,children:e.time}),(0,E.jsx)(n,{weight:`semibold`,className:`shrink-0 tabular-nums`,children:e.amount})]})]},e.id??`${e.service}-${e.time}-${t}`)})})}O.displayName=`UpcomingBookingRow`;var k={balanceLabel:`Loyalty Balance`,pointsAvailable:`points available`,redeem:`Redeem Points`};function A({balance:e,tier:t=`Gold Tier`,tierVariant:o,history:s=[],redeemLabel:d,onRedeem:f,className:p,strings:_}){let v=u(k,{...d===void 0?{}:{redeem:d},..._});return(0,E.jsxs)(m,{className:c(`loyalty-points--component`,p),children:[(0,E.jsx)(g,{label:v.balanceLabel,value:(0,E.jsxs)(i,{variant:`warning`,children:[(0,E.jsx)(T,{className:`mr-1 inline size-3`}),t]}),labelClassName:`text-xs font-medium uppercase tracking-wider text-muted-foreground`}),(0,E.jsx)(r,{tag:`h3`,className:`text-4xl tabular-nums tracking-tight`,children:typeof e==`number`?e.toLocaleString():e}),(0,E.jsx)(n,{size:`xs`,type:`secondary`,children:v.pointsAvailable}),(0,E.jsx)(h,{className:`my-4`}),(0,E.jsx)(x,{children:s.map(e=>(0,E.jsxs)(C,{size:`xs`,className:`px-0`,children:[(0,E.jsxs)(S,{children:[(0,E.jsx)(w,{bold:!1,children:e.label}),(0,E.jsx)(y,{clamp:1,children:e.date})]}),(0,E.jsx)(b,{children:(0,E.jsx)(n,{weight:`semibold`,className:c(`tabular-nums`,e.positive?`text-success`:`text-destructive`),children:e.points})})]},e.date+e.label))}),(0,E.jsxs)(a,{variant:`dark`,className:`mt-5 w-full rounded-full`,onClick:f,children:[(0,E.jsx)(l,{className:`mr-1.5 size-3.5`}),v.redeem]})]})}A.displayName=`LoyaltyPointsCard`;var j={title:`Applied Discounts`,totalSavings:`Total Savings`};function M({discounts:e,totalSavings:t,className:a,strings:o}){let s=u(j,o);return(0,E.jsxs)(m,{title:s.title,className:c(`discount-stack--component`,a),children:[(0,E.jsx)(x,{className:`mt-4`,children:e.map(e=>(0,E.jsxs)(C,{size:`xs`,className:`px-0`,children:[(0,E.jsx)(v,{children:(0,E.jsx)(i,{variant:e.badge,className:`w-16 justify-center text-xxs`,children:e.type})}),(0,E.jsx)(S,{children:(0,E.jsx)(w,{bold:!1,children:e.label})}),(0,E.jsx)(b,{children:(0,E.jsx)(n,{weight:`semibold`,className:`tabular-nums text-success`,children:e.amount})})]},e.type))}),(0,E.jsx)(h,{className:`my-4`}),(0,E.jsx)(g,{label:s.totalSavings,value:(0,E.jsx)(r,{tag:`h4`,className:`text-xl tabular-nums tracking-tight text-success border-none pb-0`,children:t}),labelClassName:`text-sm font-semibold`})]})}M.displayName=`DiscountStackPreview`;function N({trackingNumber:e,carrier:t,status:r,steps:a,details:o=[],className:s}){return(0,E.jsxs)(m,{className:c(`shipment-tracking--component`,s),children:[(0,E.jsxs)(`div`,{className:`flex items-center justify-between`,children:[(0,E.jsx)(n,{size:`xs`,weight:`medium`,className:`font-mono text-muted-foreground tracking-wide`,children:e}),!!t&&(0,E.jsx)(i,{variant:`info`,children:t})]}),(0,E.jsxs)(`div`,{className:`mt-4 flex items-center gap-1.5`,children:[(0,E.jsx)(`span`,{className:`h-2 w-2 rounded-full bg-success`}),(0,E.jsx)(n,{weight:`semibold`,children:r})]}),(0,E.jsx)(`div`,{className:`mt-5 flex items-center justify-between`,children:a.map((e,t)=>(0,E.jsxs)(`div`,{className:`flex flex-1 flex-col items-center gap-2`,children:[(0,E.jsxs)(`div`,{className:`flex w-full items-center`,children:[(0,E.jsx)(`div`,{className:c(`size-3 shrink-0 rounded-full`,e.done?`bg-success`:`bg-muted`)}),t<a.length-1&&(0,E.jsx)(`div`,{className:c(`h-0.5 flex-1`,e.done?`bg-success`:`bg-muted`)})]}),(0,E.jsx)(n,{size:`xs`,type:`secondary`,className:`text-center leading-tight`,children:e.label})]},e.label))}),o.length>0&&(0,E.jsxs)(E.Fragment,{children:[(0,E.jsx)(h,{className:`my-4`}),(0,E.jsx)(`div`,{className:`space-y-2`,children:o.map(e=>(0,E.jsx)(g,{label:e.label,value:e.value,labelClassName:`text-xs`,valueClassName:`text-sm font-medium truncate max-w-[180px]`},e.label))})]})]})}N.displayName=`ShipmentTrackingCard`;var P=e({DiscountStack:()=>L,LoyaltyPoints:()=>I,ShipmentTracking:()=>R,UpcomingBookings:()=>F});function F(){return(0,E.jsx)(E.Fragment,{children:(0,E.jsx)(m,{children:(0,E.jsx)(O,{bookings:[{id:`1`,date:new Date(2026,2,28),service:`Wine Tasting Tour`,customer:`Daniel Smith`,time:`14:00`,amount:`370 USD`},{id:`2`,date:new Date(2026,3,3),service:`Luxury Spa Day`,customer:`Emma Garcia`,time:`10:00`,amount:`320 USD`},{id:`3`,date:new Date(2026,3,7),service:`Hot Air Balloon`,customer:`David Williams`,time:`06:30`,amount:`580 USD`}]})})})}function I(){return(0,E.jsx)(E.Fragment,{children:(0,E.jsx)(A,{balance:`4,830`,tier:`Gold Tier`,history:[{label:`Spa booking`,points:`+250`,date:`Mar 24`,positive:!0},{label:`Redeemed coupon`,points:`-500`,date:`Mar 18`,positive:!1},{label:`Wine tasting order`,points:`+180`,date:`Mar 12`,positive:!0}],onRedeem:()=>{}})})}function L(){return(0,E.jsx)(E.Fragment,{children:(0,E.jsx)(M,{discounts:[{type:`Coupon`,label:`SPRING2026 — 25% off`,amount:`-88.40 USD`,badge:`info`},{type:`Loyalty`,label:`Gold tier — 5% extra`,amount:`-17.68 USD`,badge:`warning`},{type:`Promo`,label:`Free shipping over 500 USD`,amount:`-12.00 USD`,badge:`success`}],totalSavings:`-118.08 USD`})})}function R(){return(0,E.jsx)(E.Fragment,{children:(0,E.jsx)(N,{trackingNumber:`TRK-9847261035`,carrier:`Speedy`,status:`In Transit`,steps:[{label:`Picked up`,done:!0},{label:`In transit`,done:!0},{label:`Out for delivery`,done:!1},{label:`Delivered`,done:!1}],details:[{label:`Est. Delivery`,value:`Mar 29, 2026`},{label:`Recipient`,value:`Daniel Smith`}]})})}var z=`import {
+	UpcomingBookingRow,
+	LoyaltyPointsCard,
+	DiscountStackPreview,
+	ShipmentTrackingCard,
+} from '@/components/composed/commerce';
+import { SmartCard } from '@/components/base/cards';
+
+export function UpcomingBookings() {
+	return (
+		<>
+			<SmartCard>
+								<UpcomingBookingRow
+									bookings={[
+										{ id: '1', date: new Date(2026, 2, 28), service: 'Wine Tasting Tour', customer: 'Daniel Smith', time: '14:00', amount: '370 USD' },
+										{ id: '2', date: new Date(2026, 3, 3), service: 'Luxury Spa Day', customer: 'Emma Garcia', time: '10:00', amount: '320 USD' },
+										{ id: '3', date: new Date(2026, 3, 7), service: 'Hot Air Balloon', customer: 'David Williams', time: '06:30', amount: '580 USD' },
+									]}
+								/>
+							</SmartCard>
+		</>
+	);
+}
+
+export function LoyaltyPoints() {
+	return (
+		<>
+			<LoyaltyPointsCard
+								balance="4,830"
+								tier="Gold Tier"
+								history={[
+									{ label: 'Spa booking', points: '+250', date: 'Mar 24', positive: true },
+									{ label: 'Redeemed coupon', points: '-500', date: 'Mar 18', positive: false },
+									{ label: 'Wine tasting order', points: '+180', date: 'Mar 12', positive: true },
+								]}
+								onRedeem={() => {}}
+							/>
+		</>
+	);
+}
+
+export function DiscountStack() {
+	return (
+		<>
+			<DiscountStackPreview
+								discounts={[
+									{ type: 'Coupon', label: 'SPRING2026 — 25% off', amount: '-88.40 USD', badge: 'info' },
+									{ type: 'Loyalty', label: 'Gold tier — 5% extra', amount: '-17.68 USD', badge: 'warning' },
+									{ type: 'Promo', label: 'Free shipping over 500 USD', amount: '-12.00 USD', badge: 'success' },
+								]}
+								totalSavings="-118.08 USD"
+							/>
+		</>
+	);
+}
+
+export function ShipmentTracking() {
+	return (
+		<>
+			<ShipmentTrackingCard
+								trackingNumber="TRK-9847261035"
+								carrier="Speedy"
+								status="In Transit"
+								steps={[
+									{ label: 'Picked up', done: true },
+									{ label: 'In transit', done: true },
+									{ label: 'Out for delivery', done: false },
+									{ label: 'Delivered', done: false },
+								]}
+								details={[
+									{ label: 'Est. Delivery', value: 'Mar 29, 2026' },
+									{ label: 'Recipient', value: 'Daniel Smith' },
+								]}
+							/>
+		</>
+	);
+}
+`;function B(e){let n={h4:`h4`,...e.components};return P||H(`Examples`,!1),L||H(`Examples.DiscountStack`,!0),I||H(`Examples.LoyaltyPoints`,!0),R||H(`Examples.ShipmentTracking`,!0),F||H(`Examples.UpcomingBookings`,!0),(0,E.jsxs)(t,{title:`Composed · Commerce`,description:`Bookings, loyalty, discount stacks, shipment tracking.`,layer:`composed`,status:`ready`,children:[(0,E.jsxs)(o,{title:`Examples`,id:`examples`,children:[(0,E.jsx)(s,{name:`UpcomingBookings`,source:z,children:(0,E.jsx)(F,{})}),(0,E.jsx)(s,{name:`LoyaltyPoints`,source:z,children:(0,E.jsx)(I,{})}),(0,E.jsx)(s,{name:`DiscountStack`,source:z,children:(0,E.jsx)(L,{})}),(0,E.jsx)(s,{name:`ShipmentTracking`,source:z,children:(0,E.jsx)(R,{})})]}),(0,E.jsxs)(o,{title:`API`,id:`api`,children:[(0,E.jsx)(n.h4,{children:`UpcomingBookingRow`}),(0,E.jsx)(p,{component:`UpcomingBookingRow`}),(0,E.jsx)(n.h4,{children:`LoyaltyPointsCard`}),(0,E.jsx)(p,{component:`LoyaltyPointsCard`}),(0,E.jsx)(n.h4,{children:`DiscountStackPreview`}),(0,E.jsx)(p,{component:`DiscountStackPreview`}),(0,E.jsx)(n.h4,{children:`ShipmentTrackingCard`}),(0,E.jsx)(p,{component:`ShipmentTrackingCard`})]})]})}function V(e={}){let{wrapper:t}=e.components||{};return t?(0,E.jsx)(t,{...e,children:(0,E.jsx)(B,{...e})}):B(e)}function H(e,t){throw Error(`Expected `+(t?`component`:`object`)+" `"+e+"` to be defined: you likely forgot to import, pass, or provide it.")}export{V as default};

package/dist/showcase/assets/commerce-extras-CQRc3Bna.js

@@ -0,0 +1,179 @@
+import{n as e,r as t}from"./chunk-CilyBKbf.js";import{Cr as n,cr as r,gr as i,hr as a,lr as o,r as s,sr as c,t as l,vr as u}from"./example-6phCHGsN.js";import{t as d}from"./calendar-Dlv72ytt.js";import{t as f}from"./chevron-right-D_EcqHpT.js";import{t as p}from"./credit-card-BQK3KKb2.js";import{t as m}from"./gift-NkuklfU2.js";import{t as h}from"./map-pin-CAKaoYod.js";import{t as g}from"./package-BJMP-Fcr.js";import{t as _}from"./receipt-C0mMZGbF.js";import{t as v}from"./rotate-ccw-D84bdX_x.js";import{t as y}from"./shopping-bag-BqlAP4vn.js";import{t as b}from"./sparkles-CF9P5Tqh.js";import{t as ee}from"./star-NsPNO9gR.js";import{t as te}from"./trash-2-C-FAptQP.js";import{t as x}from"./x-B156Wr-5.js";import{t as S}from"./zap-B3iByjNV.js";import{D as C,a as ne,k as re,r as w}from"./index-B4ubXfly.js";import{t as T}from"./props-table-uDY4eIzt.js";import{t as E}from"./icon-badge-z6N9reH_.js";import{t as D}from"./smart-card-BisUbLPt.js";import{t as O}from"./separator-DWv-twD-.js";import{t as k}from"./input-OrUzpI55.js";import{t as A}from"./inline-stat-Bm1zVT8D.js";import{c as j,i as M,n as N,o as ie,r as P,t as F,u as I}from"./item-BiMm1PPB.js";var ae=w(`pen`,[[`path`,{d:`M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z`,key:`1a8usu`}]]),oe=w(`repeat`,[[`path`,{d:`m17 2 4 4-4 4`,key:`nntrym`}],[`path`,{d:`M3 11v-1a4 4 0 0 1 4-4h14`,key:`84bu3i`}],[`path`,{d:`m7 22-4-4 4-4`,key:`1wqhfi`}],[`path`,{d:`M21 13v1a4 4 0 0 1-4 4H3`,key:`1rx37r`}]]),se=w(`ticket-percent`,[[`path`,{d:`M2 9a3 3 0 1 1 0 6v2a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-2a3 3 0 1 1 0-6V7a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2Z`,key:`1l48ns`}],[`path`,{d:`M9 9h.01`,key:`1q5me6`}],[`path`,{d:`m15 9-6 6`,key:`1uzhvr`}],[`path`,{d:`M15 15h.01`,key:`lqbp3k`}]]),ce={title:`Tax Breakdown`,subtotal:`Subtotal`,totalTax:`Total Tax`,total:`Total`},L=ne();function le({subtotal:e,taxes:t,totalTax:n,total:r,className:a,strings:o}){let s=C(ce,o);return(0,L.jsxs)(D,{icon:(0,L.jsx)(_,{className:`size-4`}),title:s.title,className:u(`tax-breakdown--component`,a),children:[(0,L.jsx)(A,{label:s.subtotal,value:e,mono:!0,labelClassName:`text-sm`,valueClassName:`text-sm font-medium`}),(0,L.jsxs)(`div`,{className:`mt-3 space-y-1.5 rounded-lg border border-border/50 bg-muted/30 px-3 py-2.5`,children:[t.map((e,t)=>(0,L.jsxs)(`div`,{className:`flex items-baseline justify-between gap-3`,children:[(0,L.jsxs)(`div`,{className:`flex items-baseline gap-1.5 min-w-0`,children:[(0,L.jsx)(i,{size:`xs`,className:`truncate`,children:e.label}),!!e.rate&&(0,L.jsx)(i,{tag:`span`,size:`xxs`,type:`discrete`,className:`shrink-0`,children:e.rate})]}),(0,L.jsx)(i,{tag:`span`,size:`xs`,weight:`medium`,className:`tabular-nums shrink-0`,children:e.amount})]},e.id??`${e.label}-${t}`)),!!n&&t.length>1&&(0,L.jsx)(A,{label:s.totalTax,value:n,mono:!0,className:`border-t border-border/50 pt-1.5 mt-0.5`,labelClassName:`text-xs font-medium`,valueClassName:`text-xs font-semibold`})]}),(0,L.jsx)(O,{className:`my-3`}),(0,L.jsx)(A,{label:s.total,value:r,mono:!0,labelClassName:`text-sm font-semibold`,valueClassName:`text-lg font-bold`})]})}le.displayName=`TaxBreakdownCard`;var ue={title:`Subscription`,plan:`Plan`,nextBilling:`Next billing`,perks:`Included`,manage:`Manage`,upgrade:`Upgrade`};function de({planName:e,priceLabel:t,cycleLabel:r,nextBillingDate:c,statusLabel:l,perks:p=[],onManage:m,onUpgrade:h,className:g,strings:_}){let v=C(ue,_);return(0,L.jsxs)(D,{icon:(0,L.jsx)(oe,{className:`size-4`}),title:v.title,headerEnd:l?(0,L.jsx)(o,{variant:`success`,children:l}):null,className:u(`subscription-summary--component`,g),children:[(0,L.jsxs)(`div`,{className:`rounded-lg border border-border/60 bg-muted/30 p-4`,children:[(0,L.jsx)(i,{size:`xxs`,type:`secondary`,weight:`medium`,className:`uppercase tracking-wider`,children:v.plan}),(0,L.jsx)(a,{tag:`h3`,className:`mt-1 text-xl font-semibold tracking-tight border-none pb-0`,children:e}),(0,L.jsxs)(`div`,{className:`mt-1 flex items-baseline gap-1`,children:[(0,L.jsx)(i,{tag:`span`,size:`xl`,weight:`bold`,className:`tabular-nums`,children:t}),(0,L.jsx)(i,{type:`secondary`,children:r})]})]}),(0,L.jsxs)(`div`,{className:`mt-3 flex items-center justify-between rounded-md bg-card px-1`,children:[(0,L.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,L.jsx)(d,{className:`size-3.5 text-muted-foreground`}),(0,L.jsx)(i,{size:`xs`,type:`secondary`,children:v.nextBilling})]}),(0,L.jsx)(i,{size:`xs`,weight:`semibold`,className:`tabular-nums`,children:c})]}),p.length>0&&(0,L.jsxs)(`div`,{className:`mt-4 space-y-2`,children:[(0,L.jsx)(i,{size:`xxs`,type:`secondary`,weight:`medium`,className:`uppercase tracking-wider`,children:v.perks}),(0,L.jsx)(ie,{children:p.map((e,t)=>(0,L.jsxs)(F,{size:`xs`,className:`px-0`,children:[(0,L.jsx)(j,{children:(0,L.jsx)(E,{icon:e.icon??n,tone:`success`,size:`xs`})}),(0,L.jsx)(P,{children:(0,L.jsx)(I,{bold:!1,children:e.label})})]},`${e.label}-${t}`))})]}),(m||h)&&(0,L.jsxs)(`div`,{className:`mt-4 flex items-center gap-2`,children:[!!m&&(0,L.jsx)(s,{variant:`secondary`,buttonStyle:`outline`,onClick:m,className:`flex-1`,children:v.manage}),!!h&&(0,L.jsxs)(s,{variant:`primary`,onClick:h,className:`flex-1`,children:[v.upgrade,(0,L.jsx)(f,{className:`ml-1 size-3.5`})]})]})]})}de.displayName=`SubscriptionSummaryCard`;var fe={title:`Refund Status`,requested:`Requested`,approved:`Approved`,processing:`Processing`,completed:`Completed`,amount:`Refund amount`,reason:`Reason`,eta:`Expected by`,method:`Refund to`},R=[`requested`,`approved`,`processing`,`completed`];function pe({stage:e,amount:t,reason:r,method:o,eta:s,requestedAt:c,className:l,strings:d}){let f=C(fe,d),p=R.indexOf(e);return(0,L.jsxs)(D,{icon:(0,L.jsx)(v,{className:`size-4`}),title:f.title,className:u(`refund-status--component`,l),children:[(0,L.jsxs)(`div`,{className:`rounded-lg bg-muted/40 px-4 py-3`,children:[(0,L.jsx)(i,{size:`xxs`,type:`secondary`,weight:`medium`,className:`uppercase tracking-wider`,children:f.amount}),(0,L.jsx)(a,{tag:`h3`,className:`text-3xl tabular-nums tracking-tight`,children:t}),!!c&&(0,L.jsxs)(i,{size:`xs`,type:`secondary`,className:`mt-0.5`,children:[f.requested,`: `,c]})]}),(0,L.jsx)(`div`,{className:`mt-4 flex items-center justify-between`,children:R.map((e,t)=>{let r=t<=p,a=t===p;return(0,L.jsxs)(`div`,{className:`flex flex-1 flex-col items-center gap-1.5`,children:[(0,L.jsxs)(`div`,{className:`flex w-full items-center`,children:[(0,L.jsx)(`div`,{className:u(`relative flex size-5 shrink-0 items-center justify-center rounded-full`,r?`bg-success text-success-foreground`:`border border-border bg-card text-muted-foreground`,a&&`ring-2 ring-success/30 ring-offset-2 ring-offset-background`),children:r?(0,L.jsx)(n,{className:`size-3`}):(0,L.jsx)(i,{tag:`span`,size:`xxs`,weight:`medium`,className:`tabular-nums`,children:t+1})}),t<R.length-1&&(0,L.jsx)(`div`,{className:u(`h-0.5 flex-1`,t<p?`bg-success`:`bg-border`)})]}),(0,L.jsx)(i,{size:`xxs`,weight:a?`semibold`:`medium`,type:r?`main`:`secondary`,className:`text-center leading-tight`,children:f[e]})]},e)})}),(r||o||s)&&(0,L.jsxs)(L.Fragment,{children:[(0,L.jsx)(O,{className:`my-4`}),(0,L.jsxs)(`div`,{className:`space-y-2`,children:[!!r&&(0,L.jsx)(A,{label:f.reason,value:r,className:`items-start`,valueClassName:`text-sm font-medium text-right`}),!!o&&(0,L.jsx)(A,{label:f.method,value:o,valueClassName:`text-sm font-medium`}),!!s&&(0,L.jsx)(A,{label:f.eta,value:s,mono:!0,valueClassName:`text-sm font-medium`})]})]})]})}pe.displayName=`RefundStatusCard`;var me={defaultBadge:`Default`,edit:`Edit`,remove:`Remove`,makeDefault:`Make default`,shipping:`Shipping address`,billing:`Billing address`,pickup:`Pickup address`};function z({kind:e=`shipping`,name:t,line1:n,line2:r,city:a,region:s,postalCode:c,country:l,phone:d,isDefault:f=!1,onEdit:p,onRemove:m,onMakeDefault:g,className:_,strings:v}){let y=C(me,v),b={shipping:y.shipping,billing:y.billing,pickup:y.pickup},x=[a,s,c].filter(Boolean).join(`, `),S=[];return p&&S.push({id:`edit`,label:y.edit,icon:(0,L.jsx)(ae,{className:`size-3.5`}),onClick:p}),g&&!f&&S.push({id:`make-default`,label:y.makeDefault,icon:(0,L.jsx)(ee,{className:`size-3.5`}),onClick:g}),m&&S.push({id:`remove`,label:y.remove,icon:(0,L.jsx)(te,{className:`size-3.5`}),onClick:m}),(0,L.jsx)(D,{icon:(0,L.jsx)(h,{className:`size-4`}),title:b[e],headerEnd:f?(0,L.jsx)(o,{variant:`primary`,children:y.defaultBadge}):null,actions:S.length>0?S:void 0,className:u(`address-card--component`,_),children:(0,L.jsxs)(`div`,{className:`space-y-0.5`,children:[(0,L.jsx)(i,{weight:`semibold`,children:t}),(0,L.jsx)(i,{children:n}),!!r&&(0,L.jsx)(i,{children:r}),!!x&&(0,L.jsx)(i,{children:x}),(0,L.jsx)(i,{type:`secondary`,children:l}),!!d&&(0,L.jsx)(i,{size:`xs`,type:`secondary`,className:`mt-1.5 tabular-nums`,children:d})]})})}z.displayName=`AddressCard`;var he={title:`Redeem a gift card`,placeholder:`Enter gift card code`,check:`Check balance`,remove:`Remove`,balance:`Available balance`,notFound:`That gift card code is not valid.`},B=t(re(),1);function V({appliedCode:e,balance:t,error:r,loading:a,onCheck:o,onRemove:c,className:l,strings:d}){let f=C(he,d),[p,h]=(0,B.useState)(``);return e?(0,L.jsx)(D,{icon:(0,L.jsx)(m,{className:`size-4`}),title:f.title,className:u(`voucher-entry--component`,l),children:(0,L.jsxs)(F,{variant:`muted`,className:`border border-success/30 bg-success/8`,children:[(0,L.jsx)(j,{children:(0,L.jsx)(E,{icon:n,tone:`success`,size:`md`,className:`ring-1 ring-success/20`})}),(0,L.jsxs)(P,{children:[(0,L.jsx)(I,{className:`font-mono tracking-wider`,children:e}),(0,L.jsx)(M,{className:`uppercase tracking-wide`,clamp:1,children:f.balance})]}),(0,L.jsxs)(N,{children:[!!t&&(0,L.jsx)(i,{tag:`span`,size:`base`,weight:`semibold`,type:`success`,className:`tabular-nums shrink-0`,children:t}),!!c&&(0,L.jsx)(s,{type:`button`,variant:`error`,buttonStyle:`ghost`,size:`icon-xs`,onClick:c,"aria-label":f.remove,className:`size-7 shrink-0 text-muted-foreground hover:text-destructive`,children:(0,L.jsx)(x,{className:`size-3.5`})})]})]})}):(0,L.jsx)(D,{icon:(0,L.jsx)(m,{className:`size-4`}),title:f.title,className:l,children:(0,L.jsxs)(`div`,{className:`flex flex-col gap-2`,children:[(0,L.jsxs)(`div`,{className:`flex gap-2`,children:[(0,L.jsx)(k,{value:p,onChange:e=>h(e.target.value),placeholder:f.placeholder,startIcon:m,className:`flex-1 font-mono uppercase tracking-wider`,invalid:!!r}),(0,L.jsx)(s,{onClick:()=>o?.(p),loading:a,disabled:!p.trim(),children:f.check})]}),!!r&&(0,L.jsx)(i,{size:`xs`,type:`error`,children:r||f.notFound})]})})}V.displayName=`VoucherEntryCard`;var ge={title:`Cart`,subtotal:`Subtotal`,tax:`Tax`,shipping:`Shipping`,discount:`Discount`,total:`Total`,checkout:`Checkout`},_e=e=>e.replace(/^[\s−-]+/,``);function ve({items:e,subtotal:t,tax:n,shipping:r,discount:a,total:o,onCheckout:c,className:l,strings:d}){let f=C(ge,d),p=!!(t||n||r||a);return(0,L.jsxs)(D,{icon:(0,L.jsx)(y,{className:`size-4`}),title:f.title,className:u(`cart-summary--component`,l),children:[(0,L.jsx)(ie,{children:e.map(e=>(0,L.jsxs)(F,{size:`xs`,className:`px-0`,children:[(0,L.jsx)(j,{variant:`image`,children:e.imageUrl?(0,L.jsx)(`img`,{src:e.imageUrl,alt:e.name}):(0,L.jsx)(y,{})}),(0,L.jsxs)(P,{children:[(0,L.jsx)(I,{children:e.name}),(0,L.jsxs)(M,{clamp:1,className:`tabular-nums`,children:[`x`,e.qty]})]}),(0,L.jsx)(N,{children:(0,L.jsx)(i,{tag:`span`,weight:`semibold`,className:`tabular-nums shrink-0`,children:e.price})})]},e.id))}),!!p&&(0,L.jsxs)(`div`,{className:`mt-3 space-y-1.5 rounded-lg bg-muted/30 px-3 py-2.5`,children:[!!t&&(0,L.jsx)(A,{label:f.subtotal,value:t,mono:!0,valueClassName:`text-xs font-medium`,labelClassName:`text-xs`}),!!n&&(0,L.jsx)(A,{label:f.tax,value:n,mono:!0,valueClassName:`text-xs font-medium`,labelClassName:`text-xs`}),!!r&&(0,L.jsx)(A,{label:f.shipping,value:r,mono:!0,valueClassName:`text-xs font-medium`,labelClassName:`text-xs`}),!!a&&(0,L.jsx)(A,{label:f.discount,value:`−${_e(a)}`,mono:!0,labelClassName:`text-xs`,valueClassName:`text-xs font-semibold text-success`})]}),(0,L.jsx)(O,{className:`my-3`}),(0,L.jsx)(A,{label:f.total,value:o,mono:!0,labelClassName:`text-sm font-semibold`,valueClassName:`text-lg font-bold`}),!!c&&(0,L.jsx)(s,{onClick:c,fullWidth:!0,className:`mt-4`,children:f.checkout})]})}ve.displayName=`CartSummaryCard`;var ye={title:`Have a code?`,placeholder:`Enter coupon code`,apply:`Apply`,remove:`Remove`,applied:`Applied`,invalid:`That code is not valid`},be=e=>e.replace(/^[\s−-]+/,``);function H({appliedCode:e,appliedDiscount:t,error:r,onApply:a,onRemove:o,loading:c,className:l,strings:d}){let f=C(ye,d),[p,m]=(0,B.useState)(``);return e?(0,L.jsx)(D,{icon:(0,L.jsx)(se,{className:`size-4`}),title:f.title,className:u(`coupon-input--component`,l),children:(0,L.jsxs)(F,{variant:`muted`,className:`border border-success/30 bg-success/8`,children:[(0,L.jsx)(j,{children:(0,L.jsx)(E,{icon:n,tone:`success`,size:`md`,className:`ring-1 ring-success/20`})}),(0,L.jsxs)(P,{children:[(0,L.jsx)(I,{className:`font-mono tracking-wider`,children:e}),(0,L.jsx)(M,{className:`uppercase tracking-wide`,clamp:1,children:f.applied})]}),(0,L.jsxs)(N,{children:[!!t&&(0,L.jsxs)(i,{tag:`span`,size:`base`,weight:`semibold`,type:`success`,className:`tabular-nums shrink-0`,children:[`−`,be(t)]}),!!o&&(0,L.jsx)(s,{type:`button`,variant:`error`,buttonStyle:`ghost`,size:`icon-xs`,onClick:o,"aria-label":f.remove,className:`size-7 shrink-0 text-muted-foreground hover:text-destructive`,children:(0,L.jsx)(x,{className:`size-3.5`})})]})]})}):(0,L.jsx)(D,{icon:(0,L.jsx)(se,{className:`size-4`}),title:f.title,className:l,children:(0,L.jsxs)(`div`,{className:`flex flex-col gap-2`,children:[(0,L.jsxs)(`div`,{className:`flex gap-2`,children:[(0,L.jsx)(k,{value:p,onChange:e=>m(e.target.value),placeholder:f.placeholder,startIcon:b,className:`flex-1 font-mono uppercase tracking-wider`,invalid:!!r}),(0,L.jsx)(s,{onClick:()=>a?.(p),loading:c,disabled:!p.trim(),children:f.apply})]}),!!r&&(0,L.jsx)(i,{size:`xs`,type:`error`,children:r||f.invalid})]})})}H.displayName=`CouponInputCard`;var xe={title:`Order status`,statusLabel:`Current status`,eta:`ETA`},Se={pending:`warning`,paid:`info`,fulfilled:`info`,shipped:`primary`,delivered:`success`,cancelled:`error`};function Ce({orderNumber:e,status:t,statusVariant:r,events:a,currentEta:s,className:c,strings:l}){let d=C(xe,l),f=r??Se[t],p=a.reduce((e,t,n)=>t.complete?n:e,-1);return(0,L.jsxs)(D,{icon:(0,L.jsx)(g,{className:`size-4`}),title:d.title,titleSuffix:(0,L.jsx)(o,{variant:f,className:`capitalize`,children:t}),description:`#${e}`,className:u(`order-status--component`,c),children:[(0,L.jsx)(`div`,{className:`overflow-x-auto pb-1`,children:(0,L.jsx)(`div`,{className:`flex min-w-full items-start`,children:a.map((e,t)=>{let r=t===a.length-1,o=t<p,s=t===p+1||e.complete&&t===p;return(0,L.jsxs)(`div`,{className:`flex flex-1 flex-col items-center gap-1.5`,children:[(0,L.jsxs)(`div`,{className:`relative flex w-full items-center`,children:[t>0&&(0,L.jsx)(`div`,{className:u(`h-0.5 flex-1`,t<=p?`bg-success`:`bg-border`)}),t===0&&(0,L.jsx)(`div`,{className:`flex-1`,"aria-hidden":`true`}),(0,L.jsx)(`div`,{className:u(`relative flex size-6 shrink-0 items-center justify-center rounded-full`,e.complete?`bg-success text-success-foreground`:`border-2 border-border bg-card text-muted-foreground`,s&&!e.complete&&`border-primary text-primary`),children:e.complete?(0,L.jsx)(n,{className:`size-3.5`,strokeWidth:2.5}):(0,L.jsx)(`span`,{className:`size-1.5 rounded-full bg-current`})}),r?(0,L.jsx)(`div`,{className:`flex-1`,"aria-hidden":`true`}):(0,L.jsx)(`div`,{className:u(`h-0.5 flex-1`,o?`bg-success`:`bg-border`)})]}),(0,L.jsx)(i,{size:`xxs`,weight:e.complete||s?`semibold`:`medium`,className:u(`whitespace-nowrap text-center`,!e.complete&&!s&&`text-muted-foreground`),children:e.label}),!!e.timestamp&&(0,L.jsx)(i,{size:`xxs`,type:`discrete`,className:`tabular-nums`,children:e.timestamp})]},`${e.label}-${t}`)})})}),!!s&&(0,L.jsxs)(`div`,{className:`mt-3 flex items-center justify-between rounded-lg border border-border/50 bg-primary/5 px-3 py-2`,children:[(0,L.jsx)(i,{size:`xs`,type:`secondary`,weight:`medium`,className:`uppercase tracking-wider`,children:d.eta}),(0,L.jsx)(i,{tag:`span`,weight:`semibold`,children:s})]})]})}Ce.displayName=`OrderStatusCard`;var we={title:`Payment method`,default:`Default`,cardHolder:`Card holder`,expires:`Expires`,change:`Change`},Te={visa:`VISA`,mastercard:`MasterCard`,amex:`AMEX`,paypal:`PayPal`,applepay:`Apple Pay`,googlepay:`Google Pay`,unknown:`Card`},Ee={visa:`from-blue-700 via-blue-800 to-indigo-900`,mastercard:`from-orange-600 via-rose-700 to-rose-900`,amex:`from-sky-600 via-cyan-700 to-cyan-900`,paypal:`from-blue-600 via-indigo-700 to-blue-900`,applepay:`from-zinc-700 via-zinc-800 to-zinc-950`,googlepay:`from-emerald-600 via-teal-700 to-teal-900`,unknown:`from-zinc-700 via-zinc-800 to-zinc-950`};function De({brand:e,last4:t,expiry:n,holderName:r,isDefault:a,onChange:c,className:l,strings:d}){let f=C(we,d),m=Te[e],h=Ee[e];return(0,L.jsxs)(D,{icon:(0,L.jsx)(p,{className:`size-4`}),title:f.title,titleSuffix:a?(0,L.jsx)(o,{variant:`primary`,children:f.default}):null,className:u(`payment-method--component`,l),children:[(0,L.jsxs)(`div`,{className:u(`relative flex flex-col gap-5 rounded-xl bg-gradient-to-br p-4 text-white shadow-md ring-1 ring-white/10 overflow-hidden`,h),children:[(0,L.jsx)(`div`,{className:`absolute -top-8 -right-8 size-32 rounded-full bg-white/[0.08] blur-xl`,"aria-hidden":`true`}),(0,L.jsx)(`div`,{className:`absolute -bottom-6 -left-6 size-24 rounded-full bg-white/[0.06] blur-lg`,"aria-hidden":`true`}),(0,L.jsxs)(`div`,{className:`relative flex items-start justify-between`,children:[(0,L.jsx)(`div`,{className:`flex size-7 items-center justify-center rounded-md bg-gradient-to-br from-yellow-300/90 to-yellow-500/80 shadow-sm`,children:(0,L.jsx)(`div`,{className:`size-4 rounded-sm border border-yellow-700/30 bg-yellow-200/60`})}),(0,L.jsx)(i,{tag:`span`,weight:`bold`,className:`rounded bg-white/15 px-2 py-0.5 tracking-[0.15em] text-white backdrop-blur-sm`,children:m})]}),(0,L.jsx)(`div`,{className:`relative`,children:(0,L.jsxs)(i,{tag:`span`,size:`lg`,weight:`semibold`,className:`block font-mono tracking-[0.25em] text-white`,children:[`•••• •••• •••• `,t]})}),(0,L.jsxs)(`div`,{className:`relative flex items-end justify-between gap-3`,children:[(0,L.jsx)(`div`,{className:`min-w-0`,children:!!r&&(0,L.jsxs)(L.Fragment,{children:[(0,L.jsx)(i,{size:`xxs`,className:`block uppercase tracking-wider text-white/60`,children:f.cardHolder}),(0,L.jsx)(i,{weight:`semibold`,className:`truncate text-white`,children:r})]})}),!!n&&(0,L.jsxs)(`div`,{className:`text-right shrink-0`,children:[(0,L.jsx)(i,{size:`xxs`,className:`block uppercase tracking-wider text-white/60`,children:f.expires}),(0,L.jsx)(i,{tag:`span`,weight:`semibold`,className:`tabular-nums text-white`,children:n})]})]})]}),!!c&&(0,L.jsx)(`div`,{className:`mt-3 flex justify-end`,children:(0,L.jsx)(s,{buttonStyle:`ghost`,variant:`secondary`,onClick:c,children:f.change})})]})}De.displayName=`PaymentMethodCard`;var Oe=e({AddressCardExample:()=>X,CartSummaryCardExample:()=>U,CouponInputCardEmptyApplied:()=>W,OrderStatusCardExample:()=>G,PaymentMethodCardExample:()=>K,RefundStatusCardExample:()=>Y,SubscriptionSummaryCardExample:()=>J,TaxBreakdownCardExample:()=>q,VoucherEntryCardExample:()=>Z});function U(){return(0,L.jsx)(L.Fragment,{children:(0,L.jsx)(ve,{items:[{id:`1`,name:`Wine Tasting Tour`,qty:2,price:`370 USD`},{id:`2`,name:`Spa Day Voucher`,qty:1,price:`180 USD`},{id:`3`,name:`Gift Wrap`,qty:1,price:`15 USD`}],subtotal:`565 USD`,tax:`113 USD`,shipping:`0 USD`,discount:`50 USD`,total:`628 USD`,onCheckout:()=>{}})})}function W(){return(0,L.jsx)(L.Fragment,{children:(0,L.jsxs)(`div`,{className:`grid gap-4 md:grid-cols-2`,children:[(0,L.jsx)(H,{onApply:()=>{}}),(0,L.jsx)(H,{appliedCode:`SPRING2026`,appliedDiscount:`88.40 USD`,onRemove:()=>{}})]})})}function G(){return(0,L.jsx)(L.Fragment,{children:(0,L.jsx)(Ce,{orderNumber:`ORD-2026-0412`,status:`shipped`,currentEta:`Mar 29, 2026`,events:[{label:`Placed`,timestamp:`Mar 24`,complete:!0},{label:`Paid`,timestamp:`Mar 24`,complete:!0},{label:`Fulfilled`,timestamp:`Mar 25`,complete:!0},{label:`Shipped`,timestamp:`Mar 26`,complete:!0},{label:`Delivered`,complete:!1}]})})}function K(){return(0,L.jsx)(L.Fragment,{children:(0,L.jsx)(De,{brand:`visa`,last4:`4242`,expiry:`04/27`,holderName:`Sarah Smitha`,isDefault:!0,onChange:()=>{}})})}function q(){return(0,L.jsx)(L.Fragment,{children:(0,L.jsx)(le,{subtotal:`565.00 USD`,taxes:[{label:`VAT (standard)`,rate:`20%`,amount:`94.20 USD`},{label:`Tourist tax`,rate:`€1.50/night`,amount:`4.50 USD`},{label:`Service charge`,rate:`5%`,amount:`14.30 USD`}],totalTax:`113.00 USD`,total:`678.00 USD`})})}function J(){return(0,L.jsx)(L.Fragment,{children:(0,L.jsx)(de,{planName:`Pro Annual`,priceLabel:`€29`,cycleLabel:`/ month`,nextBillingDate:`May 12, 2026`,statusLabel:`Active`,perks:[{icon:b,label:`AI assist included`},{icon:ee,label:`Priority support`},{icon:S,label:`Unlimited bookings`}],onManage:()=>{},onUpgrade:()=>{}})})}function Y(){return(0,L.jsx)(L.Fragment,{children:(0,L.jsx)(pe,{stage:`processing`,amount:`180.00 USD`,reason:`Customer cancelled within 48h window`,method:`Visa ending 4242`,eta:`Apr 14, 2026`,requestedAt:`Apr 8, 2026`})})}function X(){return(0,L.jsx)(L.Fragment,{children:(0,L.jsxs)(`div`,{className:`grid gap-3 md:grid-cols-2`,children:[(0,L.jsx)(z,{kind:`shipping`,name:`Sarah Smitha`,line1:`ul. Vitosha 24, ap. 5`,city:`New York`,postalCode:`1000`,country:`USA`,phone:`+1 888 123 456`,isDefault:!0,onEdit:()=>{},onRemove:()=>{}}),(0,L.jsx)(z,{kind:`billing`,name:`Daniel Smith`,line1:`ul. Slavyanska 9`,line2:`floor 3`,city:`Los Angeles`,postalCode:`4000`,country:`USA`,onEdit:()=>{},onRemove:()=>{},onMakeDefault:()=>{}})]})})}function Z(){let[e,t]=(0,B.useState)(!1);return(0,L.jsx)(L.Fragment,{children:(0,L.jsxs)(`div`,{className:`grid gap-3 md:grid-cols-2`,children:[(0,L.jsx)(V,{onCheck:()=>t(!0),...e?{appliedCode:`GCT-2026-PETROV`,balance:`120.00 USD`,onRemove:()=>t(!1)}:{}}),(0,L.jsx)(V,{appliedCode:`GCT-A4B7-C9E2`,balance:`250.00 USD`,onRemove:()=>{}})]})})}var Q=`import { useState } from 'react';
+import { Sparkles, Star, Zap } from 'lucide-react';
+import {
+	AddressCard,
+	CartSummaryCard,
+	CouponInputCard,
+	OrderStatusCard,
+	PaymentMethodCard,
+	RefundStatusCard,
+	SubscriptionSummaryCard,
+	TaxBreakdownCard,
+	VoucherEntryCard,
+} from '@/components/composed/commerce';
+
+export function CartSummaryCardExample() {
+	return (
+		<>
+			<CartSummaryCard
+								items={[
+									{ id: '1', name: 'Wine Tasting Tour', qty: 2, price: '370 USD' },
+									{ id: '2', name: 'Spa Day Voucher', qty: 1, price: '180 USD' },
+									{ id: '3', name: 'Gift Wrap', qty: 1, price: '15 USD' },
+								]}
+								subtotal="565 USD"
+								tax="113 USD"
+								shipping="0 USD"
+								discount="50 USD"
+								total="628 USD"
+								onCheckout={() => {}}
+							/>
+		</>
+	);
+}
+
+export function CouponInputCardEmptyApplied() {
+	return (
+		<>
+			<div className="grid gap-4 md:grid-cols-2">
+								<CouponInputCard onApply={() => {}} />
+								<CouponInputCard appliedCode="SPRING2026" appliedDiscount="88.40 USD" onRemove={() => {}} />
+							</div>
+		</>
+	);
+}
+
+export function OrderStatusCardExample() {
+	return (
+		<>
+			<OrderStatusCard
+								orderNumber="ORD-2026-0412"
+								status="shipped"
+								currentEta="Mar 29, 2026"
+								events={[
+									{ label: 'Placed', timestamp: 'Mar 24', complete: true },
+									{ label: 'Paid', timestamp: 'Mar 24', complete: true },
+									{ label: 'Fulfilled', timestamp: 'Mar 25', complete: true },
+									{ label: 'Shipped', timestamp: 'Mar 26', complete: true },
+									{ label: 'Delivered', complete: false },
+								]}
+							/>
+		</>
+	);
+}
+
+export function PaymentMethodCardExample() {
+	return (
+		<>
+			<PaymentMethodCard brand="visa" last4="4242" expiry="04/27" holderName="Sarah Smitha" isDefault onChange={() => {}} />
+		</>
+	);
+}
+
+export function TaxBreakdownCardExample() {
+	return (
+		<>
+			<TaxBreakdownCard
+								subtotal="565.00 USD"
+								taxes={[
+									{ label: 'VAT (standard)', rate: '20%', amount: '94.20 USD' },
+									{ label: 'Tourist tax', rate: '€1.50/night', amount: '4.50 USD' },
+									{ label: 'Service charge', rate: '5%', amount: '14.30 USD' },
+								]}
+								totalTax="113.00 USD"
+								total="678.00 USD"
+							/>
+		</>
+	);
+}
+
+export function SubscriptionSummaryCardExample() {
+	return (
+		<>
+			<SubscriptionSummaryCard
+								planName="Pro Annual"
+								priceLabel="€29"
+								cycleLabel="/ month"
+								nextBillingDate="May 12, 2026"
+								statusLabel="Active"
+								perks={[
+									{ icon: Sparkles, label: 'AI assist included' },
+									{ icon: Star, label: 'Priority support' },
+									{ icon: Zap, label: 'Unlimited bookings' },
+								]}
+								onManage={() => {}}
+								onUpgrade={() => {}}
+							/>
+		</>
+	);
+}
+
+export function RefundStatusCardExample() {
+	return (
+		<>
+			<RefundStatusCard
+								stage="processing"
+								amount="180.00 USD"
+								reason="Customer cancelled within 48h window"
+								method="Visa ending 4242"
+								eta="Apr 14, 2026"
+								requestedAt="Apr 8, 2026"
+							/>
+		</>
+	);
+}
+
+export function AddressCardExample() {
+	return (
+		<>
+			<div className="grid gap-3 md:grid-cols-2">
+								<AddressCard
+									kind="shipping"
+									name="Sarah Smitha"
+									line1="ul. Vitosha 24, ap. 5"
+									city="New York"
+									postalCode="1000"
+									country="USA"
+									phone="+1 888 123 456"
+									isDefault
+									onEdit={() => {}}
+									onRemove={() => {}}
+								/>
+								<AddressCard
+									kind="billing"
+									name="Daniel Smith"
+									line1="ul. Slavyanska 9"
+									line2="floor 3"
+									city="Los Angeles"
+									postalCode="4000"
+									country="USA"
+									onEdit={() => {}}
+									onRemove={() => {}}
+									onMakeDefault={() => {}}
+								/>
+							</div>
+		</>
+	);
+}
+
+export function VoucherEntryCardExample() {
+	const [voucherApplied, setVoucherApplied] = useState(false);
+	return (
+		<>
+			<div className="grid gap-3 md:grid-cols-2">
+								<VoucherEntryCard
+									onCheck={() => setVoucherApplied(true)}
+									{...(voucherApplied
+										? { appliedCode: 'GCT-2026-PETROV', balance: '120.00 USD', onRemove: () => setVoucherApplied(false) }
+										: {})}
+								/>
+								<VoucherEntryCard
+									appliedCode="GCT-A4B7-C9E2"
+									balance="250.00 USD"
+									onRemove={() => {}}
+								/>
+							</div>
+		</>
+	);
+}
+`;function ke(e){let t={h4:`h4`,...e.components};return Oe||$(`Examples`,!1),X||$(`Examples.AddressCardExample`,!0),U||$(`Examples.CartSummaryCardExample`,!0),W||$(`Examples.CouponInputCardEmptyApplied`,!0),G||$(`Examples.OrderStatusCardExample`,!0),K||$(`Examples.PaymentMethodCardExample`,!0),Y||$(`Examples.RefundStatusCardExample`,!0),J||$(`Examples.SubscriptionSummaryCardExample`,!0),q||$(`Examples.TaxBreakdownCardExample`,!0),Z||$(`Examples.VoucherEntryCardExample`,!0),(0,L.jsxs)(r,{title:`Composed · Commerce (extras)`,description:`Cart, coupon, order status, payment, tax breakdown, subscription, refund, address, voucher.`,layer:`composed`,status:`ready`,children:[(0,L.jsxs)(c,{title:`Examples`,id:`examples`,children:[(0,L.jsx)(l,{name:`CartSummaryCardExample`,source:Q,children:(0,L.jsx)(U,{})}),(0,L.jsx)(l,{name:`CouponInputCardEmptyApplied`,source:Q,children:(0,L.jsx)(W,{})}),(0,L.jsx)(l,{name:`OrderStatusCardExample`,source:Q,children:(0,L.jsx)(G,{})}),(0,L.jsx)(l,{name:`PaymentMethodCardExample`,source:Q,children:(0,L.jsx)(K,{})}),(0,L.jsx)(l,{name:`TaxBreakdownCardExample`,source:Q,children:(0,L.jsx)(q,{})}),(0,L.jsx)(l,{name:`SubscriptionSummaryCardExample`,source:Q,children:(0,L.jsx)(J,{})}),(0,L.jsx)(l,{name:`RefundStatusCardExample`,source:Q,children:(0,L.jsx)(Y,{})}),(0,L.jsx)(l,{name:`AddressCardExample`,source:Q,children:(0,L.jsx)(X,{})}),(0,L.jsx)(l,{name:`VoucherEntryCardExample`,source:Q,children:(0,L.jsx)(Z,{})})]}),(0,L.jsxs)(c,{title:`API`,id:`api`,children:[(0,L.jsx)(t.h4,{children:`AddressCard`}),(0,L.jsx)(T,{component:`AddressCard`}),(0,L.jsx)(t.h4,{children:`CartSummaryCard`}),(0,L.jsx)(T,{component:`CartSummaryCard`}),(0,L.jsx)(t.h4,{children:`CouponInputCard`}),(0,L.jsx)(T,{component:`CouponInputCard`}),(0,L.jsx)(t.h4,{children:`OrderStatusCard`}),(0,L.jsx)(T,{component:`OrderStatusCard`}),(0,L.jsx)(t.h4,{children:`PaymentMethodCard`}),(0,L.jsx)(T,{component:`PaymentMethodCard`}),(0,L.jsx)(t.h4,{children:`RefundStatusCard`}),(0,L.jsx)(T,{component:`RefundStatusCard`}),(0,L.jsx)(t.h4,{children:`SubscriptionSummaryCard`}),(0,L.jsx)(T,{component:`SubscriptionSummaryCard`}),(0,L.jsx)(t.h4,{children:`TaxBreakdownCard`}),(0,L.jsx)(T,{component:`TaxBreakdownCard`}),(0,L.jsx)(t.h4,{children:`VoucherEntryCard`}),(0,L.jsx)(T,{component:`VoucherEntryCard`})]})]})}function Ae(e={}){let{wrapper:t}=e.components||{};return t?(0,L.jsx)(t,{...e,children:(0,L.jsx)(ke,{...e})}):ke(e)}function $(e,t){throw Error(`Expected `+(t?`component`:`object`)+" `"+e+"` to be defined: you likely forgot to import, pass, or provide it.")}export{Ae as default};

package/dist/showcase/assets/composite-DBDXLPyz.js

@@ -0,0 +1 @@
+import{rr as e}from"./example-6phCHGsN.js";var t=`ArrowUp`,n=`ArrowDown`,r=`ArrowLeft`,i=`ArrowRight`,a=`Home`,o=`PageUp`,s=`PageDown`,c=new Set([r,i]),l=new Set([r,i,a,`End`]),u=new Set([t,n]),d=new Set([t,n,a,`End`]),f=new Set([...c,...u]),p=new Set([...f,a,`End`]),m=new Set([t,n,r,i,a,`End`]),h=`Shift`,g=new Set([h,`Control`,`Alt`,`Meta`]);function _(t){return e(t)&&t.tagName===`INPUT`}function v(t){return!!(_(t)&&t.selectionStart!=null||e(t)&&t.tagName===`TEXTAREA`)}function y(e,t,n,r){if(!e||!t||!t.scrollTo)return;let i=e.scrollLeft,a=e.scrollTop,o=e.clientWidth<e.scrollWidth,s=e.clientHeight<e.scrollHeight;if(o&&r!==`vertical`){let r=b(e,t,`left`),a=x(e),o=x(t);n===`ltr`&&(r+t.offsetWidth+o.scrollMarginRight>e.scrollLeft+e.clientWidth-a.scrollPaddingRight?i=r+t.offsetWidth+o.scrollMarginRight-e.clientWidth+a.scrollPaddingRight:r-o.scrollMarginLeft<e.scrollLeft+a.scrollPaddingLeft&&(i=r-o.scrollMarginLeft-a.scrollPaddingLeft)),n===`rtl`&&(r-o.scrollMarginRight<e.scrollLeft+a.scrollPaddingLeft?i=r-o.scrollMarginLeft-a.scrollPaddingLeft:r+t.offsetWidth+o.scrollMarginRight>e.scrollLeft+e.clientWidth-a.scrollPaddingRight&&(i=r+t.offsetWidth+o.scrollMarginRight-e.clientWidth+a.scrollPaddingRight))}if(s&&r!==`horizontal`){let n=b(e,t,`top`),r=x(e),i=x(t);n-i.scrollMarginTop<e.scrollTop+r.scrollPaddingTop?a=n-i.scrollMarginTop-r.scrollPaddingTop:n+t.offsetHeight+i.scrollMarginBottom>e.scrollTop+e.clientHeight-r.scrollPaddingBottom&&(a=n+t.offsetHeight+i.scrollMarginBottom-e.clientHeight+r.scrollPaddingBottom)}e.scrollTo({left:i,top:a,behavior:`auto`})}function b(e,t,n){let r=n===`left`?`offsetLeft`:`offsetTop`,i=0;for(;t.offsetParent&&(i+=t[r],t.offsetParent!==e);)t=t.offsetParent;return i}function x(e){let t=getComputedStyle(e);return{scrollMarginTop:parseFloat(t.scrollMarginTop)||0,scrollMarginRight:parseFloat(t.scrollMarginRight)||0,scrollMarginBottom:parseFloat(t.scrollMarginBottom)||0,scrollMarginLeft:parseFloat(t.scrollMarginLeft)||0,scrollPaddingTop:parseFloat(t.scrollPaddingTop)||0,scrollPaddingRight:parseFloat(t.scrollPaddingRight)||0,scrollPaddingBottom:parseFloat(t.scrollPaddingBottom)||0,scrollPaddingLeft:parseFloat(t.scrollPaddingLeft)||0}}export{v as _,i as a,a as c,g as d,s as f,d as g,u as h,r as i,c as l,h as m,n,t as o,o as p,f as r,m as s,p as t,l as u,y as v};

package/dist/showcase/assets/contact-card-DkL2nI3r.js

@@ -0,0 +1,65 @@
+import{n as e}from"./chunk-CilyBKbf.js";import{cr as t,gr as n,hr as r,lr as i,r as a,sr as o,t as s,vr as c}from"./example-6phCHGsN.js";import{t as l}from"./external-link-BuVHkCy0.js";import{t as u}from"./mail-DZ1o1RLW.js";import{t as d}from"./map-pin-CAKaoYod.js";import{t as f}from"./phone-CsRIyvep.js";import{D as p,a as m}from"./index-B4ubXfly.js";import{t as h}from"./props-table-uDY4eIzt.js";import{o as g,r as _,t as v}from"./avatar-LPmQqZQv.js";import{c as y,o as b,r as x,t as S,u as C}from"./item-BiMm1PPB.js";import{t as w}from"./PreviewLayout-z6vpJJGt.js";var T={contact:`Contact`,profile:`Profile`},E=m();function D(e,t){return t||e.split(` `).map(e=>e[0]).slice(0,2).join(``).toUpperCase()}function O({name:e,role:t,email:o,phone:s,location:m,avatarUrl:h,initials:w,badge:O,badgeVariant:k=`success`,onContact:A,onViewProfile:j,className:M,strings:N}){let P=p(T,N);return(0,E.jsxs)(`div`,{className:c(`contact-card--component`,`overflow-hidden rounded-xl border border-border bg-card text-card-foreground shadow-sm p-6 sm:p-7`,M),children:[(0,E.jsxs)(`div`,{className:`flex items-start gap-4`,children:[(0,E.jsxs)(v,{className:`h-16 w-16 shrink-0 border-2 border-border`,children:[!!h&&(0,E.jsx)(g,{src:h,alt:e}),(0,E.jsx)(_,{className:`text-lg font-bold`,children:D(e,w)})]}),(0,E.jsxs)(`div`,{className:`min-w-0 flex-1 pt-0.5`,children:[(0,E.jsxs)(`div`,{className:`flex items-center gap-2.5`,children:[(0,E.jsx)(r,{tag:`h4`,className:`truncate text-lg`,children:e}),!!O&&(0,E.jsx)(i,{variant:k,children:O})]}),!!t&&(0,E.jsx)(n,{type:`secondary`,className:`mt-1`,children:t})]})]}),!!(o||s||m)&&(0,E.jsxs)(b,{className:`mt-6 gap-1`,children:[!!o&&(0,E.jsxs)(S,{size:`xs`,className:`px-0`,children:[(0,E.jsx)(y,{variant:`icon`,className:`text-muted-foreground`,children:(0,E.jsx)(u,{})}),(0,E.jsx)(x,{children:(0,E.jsx)(C,{bold:!1,children:o})})]}),!!s&&(0,E.jsxs)(S,{size:`xs`,className:`px-0`,children:[(0,E.jsx)(y,{variant:`icon`,className:`text-muted-foreground`,children:(0,E.jsx)(f,{})}),(0,E.jsx)(x,{children:(0,E.jsx)(C,{bold:!1,children:s})})]}),!!m&&(0,E.jsxs)(S,{size:`xs`,className:`px-0`,children:[(0,E.jsx)(y,{variant:`icon`,className:`text-muted-foreground`,children:(0,E.jsx)(d,{})}),(0,E.jsx)(x,{children:(0,E.jsx)(C,{bold:!1,children:m})})]})]}),!!(A||j)&&(0,E.jsxs)(`div`,{className:`mt-6 flex items-center gap-2`,children:[!!A&&(0,E.jsx)(a,{variant:`secondary`,buttonStyle:`solid`,icon:u,onClick:A,className:`flex-1`,children:P.contact}),!!j&&(0,E.jsx)(a,{variant:`secondary`,buttonStyle:`ghost`,icon:l,onClick:j,children:P.profile})]})]})}O.displayName=`ContactCard`;var k=e({DifferentBadgeVariants:()=>N,Minimal:()=>M,WithAllFields:()=>A,WithInitialsOnly:()=>j});function A(){return(0,E.jsx)(E.Fragment,{children:(0,E.jsx)(O,{name:`Sarah Smitha`,role:`Account Manager`,email:`maria@giftcometrue.com`,phone:`+1 888 123 456`,location:`New York, NY`,badge:`Online`,badgeVariant:`success`,onContact:()=>{},onViewProfile:()=>{}})})}function j(){return(0,E.jsx)(E.Fragment,{children:(0,E.jsx)(O,{name:`Georgi Johnson`,role:`Head of Operations`,email:`georgi@giftcometrue.com`,initials:`GI`,badge:`Away`,badgeVariant:`warning`,onContact:()=>{},onViewProfile:()=>{}})})}function M(){return(0,E.jsx)(E.Fragment,{children:(0,E.jsx)(O,{name:`Emma Williamsa`})})}function N(){return(0,E.jsx)(E.Fragment,{children:(0,E.jsx)(w,{children:[`primary`,`secondary`,`success`,`info`,`warning`,`error`].map(e=>(0,E.jsx)(O,{name:`Variant: ${e}`,role:`Demo`,email:`demo@example.com`,badge:e,badgeVariant:e},e))})})}var P=`import { ContactCard } from '@/components/composed/cards/contact-card';
+import { Col } from '../../PreviewLayout';
+
+export function WithAllFields() {
+	return (
+		<>
+			<ContactCard
+								name="Sarah Smitha"
+								role="Account Manager"
+								email="maria@giftcometrue.com"
+								phone="+1 888 123 456"
+								location="New York, NY"
+								badge="Online"
+								badgeVariant="success"
+								onContact={() => {}}
+								onViewProfile={() => {}}
+							/>
+		</>
+	);
+}
+
+export function WithInitialsOnly() {
+	return (
+		<>
+			<ContactCard
+								name="Georgi Johnson"
+								role="Head of Operations"
+								email="georgi@giftcometrue.com"
+								initials="GI"
+								badge="Away"
+								badgeVariant="warning"
+								onContact={() => {}}
+								onViewProfile={() => {}}
+							/>
+		</>
+	);
+}
+
+export function Minimal() {
+	return (
+		<>
+			<ContactCard name="Emma Williamsa" />
+		</>
+	);
+}
+
+export function DifferentBadgeVariants() {
+	return (
+		<>
+			<Col>
+								{(['primary', 'secondary', 'success', 'info', 'warning', 'error'] as const).map((v) => (
+									<ContactCard
+										key={v}
+										name={\`Variant: \${v}\`}
+										role="Demo"
+										email="demo@example.com"
+										badge={v}
+										badgeVariant={v}
+									/>
+								))}
+							</Col>
+		</>
+	);
+}
+`;function F(e){let n={h4:`h4`,...e.components};return k||L(`Examples`,!1),N||L(`Examples.DifferentBadgeVariants`,!0),M||L(`Examples.Minimal`,!0),A||L(`Examples.WithAllFields`,!0),j||L(`Examples.WithInitialsOnly`,!0),(0,E.jsxs)(t,{title:`Composed · Contact card`,description:`ContactCard — name, role, email, phone, location, badge.`,layer:`composed`,status:`ready`,children:[(0,E.jsxs)(o,{title:`Examples`,id:`examples`,children:[(0,E.jsx)(s,{name:`WithAllFields`,source:P,children:(0,E.jsx)(A,{})}),(0,E.jsx)(s,{name:`WithInitialsOnly`,source:P,children:(0,E.jsx)(j,{})}),(0,E.jsx)(s,{name:`Minimal`,source:P,children:(0,E.jsx)(M,{})}),(0,E.jsx)(s,{name:`DifferentBadgeVariants`,source:P,children:(0,E.jsx)(N,{})})]}),(0,E.jsxs)(o,{title:`API`,id:`api`,children:[(0,E.jsx)(n.h4,{children:`ContactCard`}),(0,E.jsx)(h,{component:`ContactCard`})]})]})}function I(e={}){let{wrapper:t}=e.components||{};return t?(0,E.jsx)(t,{...e,children:(0,E.jsx)(F,{...e})}):F(e)}function L(e,t){throw Error(`Expected `+(t?`component`:`object`)+" `"+e+"` to be defined: you likely forgot to import, pass, or provide it.")}export{I as default};

package/dist/showcase/assets/content-container-mRm6oJEa.js

@@ -0,0 +1 @@
+import{vr as e}from"./example-6phCHGsN.js";import{a as t}from"./index-B4ubXfly.js";var n=t(),r={narrow:`max-w-7xl mx-auto`,default:``,wide:`max-w-screen-2xl mx-auto`,full:``},i={none:`p-0`,sm:`p-4 md:p-5`,default:`p-5 md:p-7`,lg:`p-6 md:p-8`};function a({children:t,as:a=`div`,width:o=`default`,padding:s=`default`,bare:c=!1,className:l,innerClassName:u,...d}){let f=r[o],p=i[s];return c?(0,n.jsx)(a,{className:e(`w-full flex-1 relative overflow-hidden @container/main h-full`,f,l),...d,children:t}):(0,n.jsx)(a,{className:e(`w-full flex-1 relative overflow-hidden @container/main h-full`,l),...d,children:(0,n.jsx)(`div`,{className:e(`flex min-h-full flex-1 flex-col gap-6 rounded-xl`,f,p,u),children:t})})}export{a as t};

package/dist/showcase/assets/copyable-DmLlmwzy.js

@@ -0,0 +1,96 @@
+import{n as e,r as t}from"./chunk-CilyBKbf.js";import{Cr as n,Fr as r,Sr as i,br as a,cr as o,gr as s,sr as c,t as l,vr as u,xr as d}from"./example-6phCHGsN.js";import{t as f}from"./circle-check-DlA6zidQ.js";import{t as p}from"./info-DBvvNjc_.js";import{a as m,k as h,r as g}from"./index-B4ubXfly.js";import{t as _}from"./props-table-uDY4eIzt.js";import{t as v}from"./customers-BETQwFRp.js";import{t as y}from"./orders-DNn7r9k_.js";import{n as b,t as x}from"./dist-QK7JxeYv.js";var S=g(`octagon-x`,[[`path`,{d:`m15 9-6 6`,key:`1uzhvr`}],[`path`,{d:`M2.586 16.726A2 2 0 0 1 2 15.312V8.688a2 2 0 0 1 .586-1.414l4.688-4.688A2 2 0 0 1 8.688 2h6.624a2 2 0 0 1 1.414.586l4.688 4.688A2 2 0 0 1 22 8.688v6.624a2 2 0 0 1-.586 1.414l-4.688 4.688a2 2 0 0 1-1.414.586H8.688a2 2 0 0 1-1.414-.586z`,key:`2d38gg`}],[`path`,{d:`m9 9 6 6`,key:`z0biqf`}]]),C=m(),w=({theme:e=`system`,...t})=>(0,C.jsx)(x,{theme:e,className:`toaster group`,icons:{success:(0,C.jsx)(f,{className:`size-4`}),info:(0,C.jsx)(p,{className:`size-4`}),warning:(0,C.jsx)(a,{className:`size-4`}),error:(0,C.jsx)(S,{className:`size-4`}),loading:(0,C.jsx)(d,{className:`size-4 animate-spin`})},style:{"--normal-bg":`var(--popover)`,"--normal-text":`var(--popover-foreground)`,"--normal-border":`var(--border)`,"--border-radius":`var(--radius)`},toastOptions:{classNames:{toast:`cn-toast`}},...t});function T(e){let{duration:t,position:n}=r(),i=e.duration??t,a=e.position??n;return(0,C.jsx)(w,{className:`toaster--component`,...e,duration:i,position:a})}T.displayName=`Toaster`;var E=t(h(),1);function D({value:e,displayValue:t,mono:r=!1,truncate:a=!1,className:o,contentClassName:c,successMessage:l=`Copied to clipboard`}){let[d,f]=(0,E.useState)(!1),p=async()=>{try{await navigator.clipboard.writeText(e),f(!0),b.success(l),setTimeout(()=>f(!1),2e3)}catch{b.error(`Failed to copy`)}},m=t!==void 0&&typeof t!=`string`;return(0,C.jsxs)(`span`,{role:`button`,tabIndex:0,onClick:p,onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),p())},className:u(`copyable--component`,`group inline-flex cursor-pointer items-center gap-1.5 rounded px-1 -mx-1 transition-colors hover:bg-muted`,o),children:[m?t:(0,C.jsx)(s,{tag:`span`,className:u(r&&`font-mono`,a&&`max-w-[300px] truncate`,c),children:t??e}),(0,C.jsx)(`span`,{className:`text-muted-foreground opacity-0 transition-opacity group-hover:opacity-100`,children:d?(0,C.jsx)(n,{className:`size-3.5 text-success`}):(0,C.jsx)(i,{className:`size-3.5`})})]})}D.displayName=`Copyable`;var O=e({CustomDisplayValue:()=>M,CustomToastMessage:()=>N,CustomerListWithCopyableEmails:()=>F,Default:()=>k,Mono:()=>A,MonoTruncate:()=>j,RealisticOrderRow:()=>P});function k(){return(0,C.jsxs)(C.Fragment,{children:[(0,C.jsx)(T,{}),(0,C.jsx)(D,{value:`GCT-A4B7-C9E2`})]})}function A(){return(0,C.jsxs)(C.Fragment,{children:[(0,C.jsx)(T,{}),(0,C.jsx)(D,{value:`b3a8a5b6-9b0a-4f01-8b46-92aa1d6a1f7d`,mono:!0})]})}function j(){return(0,C.jsxs)(C.Fragment,{children:[(0,C.jsx)(T,{}),(0,C.jsx)(`div`,{className:`max-w-xs`,children:(0,C.jsx)(D,{value:`b3a8a5b6-9b0a-4f01-8b46-92aa1d6a1f7d-extra-long-id`,mono:!0,truncate:!0})})]})}function M(){return(0,C.jsxs)(C.Fragment,{children:[(0,C.jsx)(T,{}),(0,C.jsx)(D,{value:`hello@example.com`,displayValue:(0,C.jsx)(`span`,{className:`text-primary underline underline-offset-2`,children:`hello@example.com`})})]})}function N(){return(0,C.jsxs)(C.Fragment,{children:[(0,C.jsx)(T,{}),(0,C.jsxs)(`div`,{className:`flex flex-col gap-2`,children:[(0,C.jsx)(D,{value:`42`,successMessage:`The answer was copied!`}),(0,C.jsx)(`div`,{className:`text-xs text-muted-foreground`,children:`Click to see the custom toast.`})]})]})}function P(){let e=y[0],t=v.find(t=>t.id===e.customerId);return(0,C.jsxs)(C.Fragment,{children:[(0,C.jsx)(T,{}),(0,C.jsxs)(`div`,{className:`flex flex-col gap-3 rounded-md border bg-card p-4 w-full max-w-md`,children:[(0,C.jsxs)(`div`,{className:`flex items-center justify-between`,children:[(0,C.jsx)(`span`,{className:`text-xs uppercase text-muted-foreground`,children:`Order number`}),(0,C.jsx)(D,{value:e.number,mono:!0,successMessage:`Copied ${e.number}`})]}),(0,C.jsxs)(`div`,{className:`flex items-center justify-between`,children:[(0,C.jsx)(`span`,{className:`text-xs uppercase text-muted-foreground`,children:`Customer email`}),(0,C.jsx)(D,{value:t.email})]})]})]})}function F(){return(0,C.jsxs)(C.Fragment,{children:[(0,C.jsx)(T,{}),(0,C.jsx)(`div`,{className:`flex flex-col gap-1 w-full max-w-md`,children:v.slice(0,4).map(e=>(0,C.jsxs)(`div`,{className:`flex items-center justify-between border-b border-border py-1.5 text-sm`,children:[(0,C.jsx)(`span`,{children:e.name}),(0,C.jsx)(D,{value:e.email})]},e.id))})]})}var I=`import { Toaster } from '@/components/base/toaster';
+import { Copyable } from '@/components/base/copyable';
+import { MOCK_CUSTOMERS, MOCK_ORDERS } from '@/preview/_mocks';
+
+export function Default() {
+	return (
+		<>
+			<Toaster />
+			<Copyable value="GCT-A4B7-C9E2" />
+		</>
+	);
+}
+
+export function Mono() {
+	return (
+		<>
+			<Toaster />
+			<Copyable value="b3a8a5b6-9b0a-4f01-8b46-92aa1d6a1f7d" mono />
+		</>
+	);
+}
+
+export function MonoTruncate() {
+	return (
+		<>
+			<Toaster />
+			<div className="max-w-xs">
+				<Copyable value="b3a8a5b6-9b0a-4f01-8b46-92aa1d6a1f7d-extra-long-id" mono truncate />
+			</div>
+		</>
+	);
+}
+
+export function CustomDisplayValue() {
+	return (
+		<>
+			<Toaster />
+			<Copyable
+				value="hello@example.com"
+				displayValue={<span className="text-primary underline underline-offset-2">hello@example.com</span>}
+			/>
+		</>
+	);
+}
+
+export function CustomToastMessage() {
+	return (
+		<>
+			<Toaster />
+			<div className="flex flex-col gap-2">
+				<Copyable value="42" successMessage="The answer was copied!" />
+				<div className="text-xs text-muted-foreground">Click to see the custom toast.</div>
+			</div>
+		</>
+	);
+}
+
+export function RealisticOrderRow() {
+	const order = MOCK_ORDERS[0];
+	const customer = MOCK_CUSTOMERS.find((c) => c.id === order.customerId)!;
+	return (
+		<>
+			<Toaster />
+			<div className="flex flex-col gap-3 rounded-md border bg-card p-4 w-full max-w-md">
+				<div className="flex items-center justify-between">
+					<span className="text-xs uppercase text-muted-foreground">Order number</span>
+					<Copyable value={order.number} mono successMessage={\`Copied \${order.number}\`} />
+				</div>
+				<div className="flex items-center justify-between">
+					<span className="text-xs uppercase text-muted-foreground">Customer email</span>
+					<Copyable value={customer.email} />
+				</div>
+			</div>
+		</>
+	);
+}
+
+export function CustomerListWithCopyableEmails() {
+	return (
+		<>
+			<Toaster />
+			<div className="flex flex-col gap-1 w-full max-w-md">
+				{MOCK_CUSTOMERS.slice(0, 4).map((c) => (
+					<div key={c.id} className="flex items-center justify-between border-b border-border py-1.5 text-sm">
+						<span>{c.name}</span>
+						<Copyable value={c.email} />
+					</div>
+				))}
+			</div>
+		</>
+	);
+}
+`;function L(e){let t={code:`code`,p:`p`,...e.components};return O||z(`Examples`,!1),M||z(`Examples.CustomDisplayValue`,!0),N||z(`Examples.CustomToastMessage`,!0),F||z(`Examples.CustomerListWithCopyableEmails`,!0),k||z(`Examples.Default`,!0),A||z(`Examples.Mono`,!0),j||z(`Examples.MonoTruncate`,!0),P||z(`Examples.RealisticOrderRow`,!0),(0,C.jsxs)(o,{title:`Copyable`,description:`Click-to-copy inline span with hover affordance and toast feedback.`,layer:`base`,status:`ready`,sourcePath:`src/components/base/copyable`,children:[(0,C.jsx)(c,{title:`Overview`,id:`overview`,children:(0,C.jsxs)(t.p,{children:[(0,C.jsx)(t.code,{children:`Copyable`}),` wraps any value in a click-to-copy span. The copy icon appears on
+hover, the value lands on the clipboard, and a `,(0,C.jsx)(t.code,{children:`sonner`}),` toast confirms (mount
+a `,(0,C.jsx)(t.code,{children:`<Toaster />`}),` somewhere in the tree). Supports `,(0,C.jsx)(t.code,{children:`mono`}),`, `,(0,C.jsx)(t.code,{children:`truncate`}),`, custom
+`,(0,C.jsx)(t.code,{children:`displayValue`}),`, and a custom `,(0,C.jsx)(t.code,{children:`successMessage`}),`.`]})}),(0,C.jsx)(c,{title:`Default`,id:`default`,children:(0,C.jsx)(l,{name:`Default`,source:I,children:(0,C.jsx)(k,{})})}),(0,C.jsxs)(c,{title:`Variants`,id:`variants`,children:[(0,C.jsx)(l,{name:`Mono`,source:I,children:(0,C.jsx)(A,{})}),(0,C.jsx)(l,{name:`MonoTruncate`,source:I,children:(0,C.jsx)(j,{})}),(0,C.jsx)(l,{name:`CustomDisplayValue`,source:I,children:(0,C.jsx)(M,{})}),(0,C.jsx)(l,{name:`CustomToastMessage`,source:I,children:(0,C.jsx)(N,{})})]}),(0,C.jsxs)(c,{title:`Realistic usage`,id:`realistic`,children:[(0,C.jsx)(l,{name:`RealisticOrderRow`,source:I,children:(0,C.jsx)(P,{})}),(0,C.jsx)(l,{name:`CustomerListWithCopyableEmails`,source:I,children:(0,C.jsx)(F,{})})]}),(0,C.jsx)(c,{title:`API`,id:`api`,children:(0,C.jsx)(_,{component:`Copyable`})})]})}function R(e={}){let{wrapper:t}=e.components||{};return t?(0,C.jsx)(t,{...e,children:(0,C.jsx)(L,{...e})}):L(e)}function z(e,t){throw Error(`Expected `+(t?`component`:`object`)+" `"+e+"` to be defined: you likely forgot to import, pass, or provide it.")}export{R as default};

package/dist/showcase/assets/course-card-CJJoeZj9.js

@@ -0,0 +1,113 @@
+import{n as e}from"./chunk-CilyBKbf.js";import{cr as t,gr as n,lr as r,r as i,sr as a,t as o,vr as s}from"./example-6phCHGsN.js";import{D as c,a as l}from"./index-B4ubXfly.js";import{t as u}from"./props-table-uDY4eIzt.js";import{t as d}from"./smart-card-BisUbLPt.js";import{t as f}from"./stacked-avatars-BWfVX1Ov.js";import{i as p,n as m,r as h,t as g,u as _}from"./item-BiMm1PPB.js";var v={participants:`Participants`,progress:`Progress`},y=l(),b=`rounded-xl bg-background/80 ring-1 ring-border/60 p-3`,x=`bg-gradient-to-br from-violet-500 via-fuchsia-500 to-pink-500`;function S(e){return e.map((e,t)=>({id:`${t}-${e.name??e.initials??``}`,name:e.name??e.initials??`P${t+1}`,imageUrl:e.imageUrl}))}function C({title:e,description:t,badges:a=[],participants:o=[],extraParticipants:l=0,progressPercent:u,actionLabel:C,onAction:w,className:T,strings:E,variant:D=`default`,gradient:O=x}){let k=c(v,E),A=o.length+l,j=S(o);return D===`minimal`?(0,y.jsxs)(g,{variant:`outline`,className:s(`course-card--component`,`hover:bg-muted/30 transition-colors`,T),children:[(0,y.jsxs)(h,{children:[(0,y.jsx)(_,{children:e}),!!t&&(0,y.jsx)(p,{clamp:1,children:t})]}),(0,y.jsxs)(m,{children:[o.length>0&&(0,y.jsx)(f,{users:j,max:3,size:`sm`,overflowFormatter:()=>`+${l||0}`,showOverflow:l>0}),u!==void 0&&(0,y.jsxs)(n,{size:`xs`,type:`secondary`,className:`shrink-0 tabular-nums`,children:[u,`%`]}),!!C&&(0,y.jsx)(i,{variant:`secondary`,buttonStyle:`ghost`,onClick:w,children:C})]})]}):D===`gradient`?(0,y.jsxs)(`div`,{className:s(`relative overflow-hidden rounded-2xl text-white shadow-sm`,O,T),children:[(0,y.jsxs)(`div`,{className:`p-5`,children:[(0,y.jsx)(n,{size:`base`,weight:`semibold`,className:`text-white`,children:e}),!!t&&(0,y.jsx)(n,{className:`text-white/80 mt-0.5`,children:t}),a.length>0&&(0,y.jsx)(`div`,{className:`mt-3 flex flex-wrap gap-1.5`,children:a.map(e=>(0,y.jsx)(`span`,{className:`inline-flex items-center rounded-full bg-white/20 px-2 py-0.5 text-xxs font-medium text-white backdrop-blur-sm`,children:e.label},e.label))})]}),(o.length>0||u!==void 0)&&(0,y.jsxs)(`div`,{className:`bg-black/15 px-5 py-3 backdrop-blur-sm flex items-center gap-4`,children:[o.length>0&&(0,y.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,y.jsx)(f,{users:j,max:3,size:`sm`,showOverflow:!1}),(0,y.jsxs)(n,{size:`xs`,className:`text-white/80`,children:[A,` `,k.participants.toLowerCase()]})]}),u!==void 0&&(0,y.jsxs)(`div`,{className:`ml-auto flex items-center gap-2`,children:[(0,y.jsx)(`div`,{className:`h-1.5 w-24 overflow-hidden rounded-full bg-white/25`,children:(0,y.jsx)(`div`,{className:`h-full rounded-full bg-white`,style:{width:`${u}%`}})}),(0,y.jsxs)(n,{size:`xs`,className:`text-white/90 tabular-nums`,children:[u,`%`]})]})]}),!!C&&(0,y.jsx)(`div`,{className:`px-5 pb-5 pt-0`,children:(0,y.jsx)(`button`,{type:`button`,onClick:w,className:s(`w-full rounded-xl bg-white/95 px-3 py-2 text-sm font-semibold text-foreground shadow-sm hover:bg-white transition-colors`,`focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring/60 focus-visible:ring-offset-2`),children:C})})]}):(0,y.jsxs)(d,{title:e,description:t,className:s(`bg-gradient-to-b from-muted/30 to-card`,T),children:[a.length>0&&(0,y.jsx)(`div`,{className:`flex flex-wrap gap-1.5`,children:a.map(e=>(0,y.jsx)(r,{variant:e.variant,children:e.label},e.label))}),(o.length>0||u!==void 0)&&(0,y.jsxs)(`div`,{className:`mt-4 grid grid-cols-2 gap-2.5`,children:[o.length>0&&(0,y.jsxs)(`div`,{className:b,children:[(0,y.jsx)(n,{size:`xs`,type:`secondary`,children:k.participants}),(0,y.jsx)(`div`,{className:`mt-2`,children:(0,y.jsx)(f,{users:j,max:4,size:`sm`,showOverflow:l>0,overflowFormatter:()=>`+${l}`})})]}),u!==void 0&&(0,y.jsxs)(`div`,{className:b,children:[(0,y.jsx)(n,{size:`xs`,type:`secondary`,children:k.progress}),(0,y.jsxs)(`div`,{className:`mt-2.5`,children:[(0,y.jsx)(`div`,{className:`h-1.5 w-full overflow-hidden rounded-full bg-success/15`,children:(0,y.jsx)(`div`,{className:`h-full rounded-full bg-success`,style:{width:`${u}%`}})}),(0,y.jsxs)(n,{size:`xs`,type:`secondary`,className:`mt-1 tabular-nums`,children:[u,`%`]})]})]})]}),!!C&&(0,y.jsx)(i,{variant:`dark`,className:`mt-4 w-full rounded-xl`,onClick:w,children:C})]})}C.displayName=`CourseCard`;var w=e({DefaultWithEverything:()=>E,GradientCustomAmberRose:()=>k,GradientCustomCyanEmerald:()=>O,GradientVioletFuchsiaPinkDefault:()=>D,Minimal:()=>A}),T=[{name:`Vasilis Smith`},{name:`Sara Martinova`},{name:`Kostas Williams`}];function E(){return(0,y.jsx)(y.Fragment,{children:(0,y.jsx)(C,{title:`Wine Tasting Masterclass`,description:`A curated journey through Thracian Valley wines with a certified sommelier.`,badges:[{label:`Group Experience`,variant:`success`},{label:`Premium`,variant:`warning`}],participants:T,extraParticipants:3,progressPercent:60,actionLabel:`View Experience Details`,onAction:()=>{}})})}function D(){return(0,y.jsx)(y.Fragment,{children:(0,y.jsx)(C,{variant:`gradient`,title:`Sunset Photography Workshop`,description:`Three-hour shoot with golden-hour mentorship in central New York.`,badges:[{label:`Workshop`,variant:`info`}],participants:T,extraParticipants:5,progressPercent:40,actionLabel:`Reserve a Seat`,onAction:()=>{}})})}function O(){return(0,y.jsx)(y.Fragment,{children:(0,y.jsx)(C,{variant:`gradient`,gradient:`bg-gradient-to-br from-cyan-500 via-teal-500 to-emerald-500`,title:`Coastal Hike & Lunch`,description:`Scenic Black Sea coast walk followed by a tasting menu at a local kitchen.`,participants:T,extraParticipants:1,progressPercent:75,actionLabel:`Join the Hike`,onAction:()=>{}})})}function k(){return(0,y.jsx)(y.Fragment,{children:(0,y.jsx)(C,{variant:`gradient`,gradient:`bg-gradient-to-br from-amber-500 via-orange-500 to-rose-500`,title:`Pottery Studio Day`,description:`From wedging to glazing — take home two finished pieces.`,participants:T.slice(0,2),actionLabel:`Book a Spot`,onAction:()=>{}})})}function A(){return(0,y.jsx)(y.Fragment,{children:(0,y.jsxs)(`div`,{className:`space-y-2`,children:[(0,y.jsx)(C,{variant:`minimal`,title:`Wine Tasting Masterclass`,description:`Thracian Valley · 2 hrs`,participants:T,extraParticipants:3,progressPercent:60,actionLabel:`View`,onAction:()=>{}}),(0,y.jsx)(C,{variant:`minimal`,title:`Sunset Photography Workshop`,description:`New York · 3 hrs · golden hour`,participants:T,progressPercent:20,actionLabel:`Reserve`,onAction:()=>{}}),(0,y.jsx)(C,{variant:`minimal`,title:`Coastal Hike & Lunch`,description:`Black Sea coast · full day`})]})})}var j=`import { CourseCard } from '@/components/composed/cards/course-card';
+
+const SAMPLE_PARTICIPANTS = [
+	{ name: 'Vasilis Smith' },
+	{ name: 'Sara Martinova' },
+	{ name: 'Kostas Williams' },
+];
+
+export function DefaultWithEverything() {
+	return (
+		<>
+			<CourseCard
+								title="Wine Tasting Masterclass"
+								description="A curated journey through Thracian Valley wines with a certified sommelier."
+								badges={[
+									{ label: 'Group Experience', variant: 'success' },
+									{ label: 'Premium', variant: 'warning' },
+								]}
+								participants={SAMPLE_PARTICIPANTS}
+								extraParticipants={3}
+								progressPercent={60}
+								actionLabel="View Experience Details"
+								onAction={() => {}}
+							/>
+		</>
+	);
+}
+
+export function GradientVioletFuchsiaPinkDefault() {
+	return (
+		<>
+			<CourseCard
+								variant="gradient"
+								title="Sunset Photography Workshop"
+								description="Three-hour shoot with golden-hour mentorship in central New York."
+								badges={[{ label: 'Workshop', variant: 'info' }]}
+								participants={SAMPLE_PARTICIPANTS}
+								extraParticipants={5}
+								progressPercent={40}
+								actionLabel="Reserve a Seat"
+								onAction={() => {}}
+							/>
+		</>
+	);
+}
+
+export function GradientCustomCyanEmerald() {
+	return (
+		<>
+			<CourseCard
+								variant="gradient"
+								gradient="bg-gradient-to-br from-cyan-500 via-teal-500 to-emerald-500"
+								title="Coastal Hike & Lunch"
+								description="Scenic Black Sea coast walk followed by a tasting menu at a local kitchen."
+								participants={SAMPLE_PARTICIPANTS}
+								extraParticipants={1}
+								progressPercent={75}
+								actionLabel="Join the Hike"
+								onAction={() => {}}
+							/>
+		</>
+	);
+}
+
+export function GradientCustomAmberRose() {
+	return (
+		<>
+			<CourseCard
+								variant="gradient"
+								gradient="bg-gradient-to-br from-amber-500 via-orange-500 to-rose-500"
+								title="Pottery Studio Day"
+								description="From wedging to glazing — take home two finished pieces."
+								participants={SAMPLE_PARTICIPANTS.slice(0, 2)}
+								actionLabel="Book a Spot"
+								onAction={() => {}}
+							/>
+		</>
+	);
+}
+
+export function Minimal() {
+	return (
+		<>
+			<div className="space-y-2">
+								<CourseCard
+									variant="minimal"
+									title="Wine Tasting Masterclass"
+									description="Thracian Valley · 2 hrs"
+									participants={SAMPLE_PARTICIPANTS}
+									extraParticipants={3}
+									progressPercent={60}
+									actionLabel="View"
+									onAction={() => {}}
+								/>
+								<CourseCard
+									variant="minimal"
+									title="Sunset Photography Workshop"
+									description="New York · 3 hrs · golden hour"
+									participants={SAMPLE_PARTICIPANTS}
+									progressPercent={20}
+									actionLabel="Reserve"
+									onAction={() => {}}
+								/>
+								<CourseCard
+									variant="minimal"
+									title="Coastal Hike & Lunch"
+									description="Black Sea coast · full day"
+								/>
+							</div>
+		</>
+	);
+}
+`;function M(e){let n={h4:`h4`,...e.components};return w||P(`Examples`,!1),E||P(`Examples.DefaultWithEverything`,!0),k||P(`Examples.GradientCustomAmberRose`,!0),O||P(`Examples.GradientCustomCyanEmerald`,!0),D||P(`Examples.GradientVioletFuchsiaPinkDefault`,!0),A||P(`Examples.Minimal`,!0),(0,y.jsxs)(t,{title:`Composed · Course card`,description:`Group experience with participants & progress.`,layer:`composed`,status:`ready`,children:[(0,y.jsxs)(a,{title:`Examples`,id:`examples`,children:[(0,y.jsx)(o,{name:`DefaultWithEverything`,source:j,children:(0,y.jsx)(E,{})}),(0,y.jsx)(o,{name:`GradientVioletFuchsiaPinkDefault`,source:j,children:(0,y.jsx)(D,{})}),(0,y.jsx)(o,{name:`GradientCustomCyanEmerald`,source:j,children:(0,y.jsx)(O,{})}),(0,y.jsx)(o,{name:`GradientCustomAmberRose`,source:j,children:(0,y.jsx)(k,{})}),(0,y.jsx)(o,{name:`Minimal`,source:j,children:(0,y.jsx)(A,{})})]}),(0,y.jsxs)(a,{title:`API`,id:`api`,children:[(0,y.jsx)(n.h4,{children:`CourseCard`}),(0,y.jsx)(u,{component:`CourseCard`})]})]})}function N(e={}){let{wrapper:t}=e.components||{};return t?(0,y.jsx)(t,{...e,children:(0,y.jsx)(M,{...e})}):M(e)}function P(e,t){throw Error(`Expected `+(t?`component`:`object`)+" `"+e+"` to be defined: you likely forgot to import, pass, or provide it.")}export{N as default};

package/dist/showcase/assets/cpu-BXJnF2Xy.js

@@ -0,0 +1 @@
+import{r as e}from"./index-B4ubXfly.js";var t=e(`cpu`,[[`path`,{d:`M12 20v2`,key:`1lh1kg`}],[`path`,{d:`M12 2v2`,key:`tus03m`}],[`path`,{d:`M17 20v2`,key:`1rnc9c`}],[`path`,{d:`M17 2v2`,key:`11trls`}],[`path`,{d:`M2 12h2`,key:`1t8f8n`}],[`path`,{d:`M2 17h2`,key:`7oei6x`}],[`path`,{d:`M2 7h2`,key:`asdhe0`}],[`path`,{d:`M20 12h2`,key:`1q8mjw`}],[`path`,{d:`M20 17h2`,key:`1fpfkl`}],[`path`,{d:`M20 7h2`,key:`1o8tra`}],[`path`,{d:`M7 20v2`,key:`4gnj0m`}],[`path`,{d:`M7 2v2`,key:`1i4yhu`}],[`rect`,{x:`4`,y:`4`,width:`16`,height:`16`,rx:`2`,key:`1vbyd7`}],[`rect`,{x:`8`,y:`8`,width:`8`,height:`8`,rx:`1`,key:`z9xiuo`}]]);export{t};

package/dist/showcase/assets/credit-card-BQK3KKb2.js

@@ -0,0 +1 @@
+import{r as e}from"./index-B4ubXfly.js";var t=e(`credit-card`,[[`rect`,{width:`20`,height:`14`,x:`2`,y:`5`,rx:`2`,key:`ynyp8z`}],[`line`,{x1:`2`,x2:`22`,y1:`10`,y2:`10`,key:`1b3vmo`}]]);export{t};