admin-ui-starter-kit 0.4.2 → 0.4.4

package/dist/showcase/assets/products-WsU-qdMz.js

@@ -0,0 +1,407 @@
+import{n as e,r as t}from"./chunk-QTnfLwEv.js";import{n}from"./react-dom-Bz4cALsF.js";import{Dr as r,Er as i,Hr as a,Lr as o,Rr as s,jr as c,r as l,t as u}from"./example-CTJ8AdNR.js";import{t as d}from"./arrow-left-B__WWqyA.js";import{t as f}from"./arrow-right-1-EvXxjB.js";import{t as p}from"./box-z4O8t_K5.js";import{n as m,t as h}from"./languages-BofyvcCF.js";import{t as g}from"./eye-CDMCDLei.js";import{t as _}from"./file-text-DH1mBuPi.js";import{t as v}from"./image-C3DaMxmn.js";import{t as y}from"./layers-DJK0t5px.js";import{t as b}from"./package-check-Ol-Cw3j-.js";import{t as x}from"./pencil-Cl9qi90g.js";import{t as S}from"./plus-CO8t66Yo.js";import{t as C}from"./receipt-text-CDOh8FAv.js";import{t as w}from"./save-DDmFSQli.js";import{t as T}from"./shield-check-CaO2dhVS.js";import{t as E}from"./sliders-horizontal-C3JH5WQu.js";import{t as D}from"./trash-2-C9AC7Pcv.js";import{t as ee}from"./x-oVTJnCJn.js";import{a as O,k,n as A,s as te}from"./index-DaYVSqKu.js";import{t as j}from"./props-table-C8la6vcG.js";import{t as M}from"./smart-card-CHouYi8U.js";import{t as N}from"./input-fMPi7XxI.js";import{t as ne}from"./textarea-DsSuQHQY.js";import{t as re}from"./select-DBXZ_Wzf.js";import{n as P}from"./form-field-CHY7jh1q.js";import{t as F}from"./inline-stat-BYu-tiUU.js";import{t as ie}from"./progress-C61sf-qt.js";import{c as I,i as L,n as R,o as z,r as B,t as V,u as H}from"./item-C4Xk3DC1.js";import{t as ae}from"./empty-state-D-LrvnKF.js";import{t as oe}from"./metadata-list-BQAanxM-.js";import{t as se}from"./table-actions-DdoPJTMy.js";var ce=O(`list-checks`,[[`path`,{d:`M13 5h8`,key:`a7qcls`}],[`path`,{d:`M13 12h8`,key:`h98zly`}],[`path`,{d:`M13 19h8`,key:`c3s6r1`}],[`path`,{d:`m3 17 2 2 4-4`,key:`1jhpwq`}],[`path`,{d:`m3 7 2 2 4-4`,key:`1obspn`}]]),le=O(`tags`,[[`path`,{d:`M13.172 2a2 2 0 0 1 1.414.586l6.71 6.71a2.4 2.4 0 0 1 0 3.408l-4.592 4.592a2.4 2.4 0 0 1-3.408 0l-6.71-6.71A2 2 0 0 1 6 9.172V3a1 1 0 0 1 1-1z`,key:`16rjxf`}],[`path`,{d:`M2 7v6.172a2 2 0 0 0 .586 1.414l6.71 6.71a2.4 2.4 0 0 0 3.191.193`,key:`178nd4`}],[`circle`,{cx:`10.5`,cy:`6.5`,r:`.5`,fill:`currentColor`,key:`12ikhr`}]]),ue={title:`Readiness`,description:`Publishing checks and operational setup.`,scoreLabel:`Overall readiness`,progressLabel:`Readiness progress`,createLabel:`Add check`,editLabel:`Edit check`,deleteLabel:`Delete check`,actionsLabel:`Check actions`,emptyTitle:`No readiness checks`,emptyDescription:`Pass readiness items from your product workflow to show progress.`,actionLabel:`Open`},de={title:`Structure`,description:`Media, taxonomy, options, and content coverage.`,createLabel:`Add metric`,viewLabel:`Open`,editLabel:`Edit metric`,deleteLabel:`Delete metric`,actionsLabel:`Metric actions`,emptyTitle:`No structure metrics`,emptyDescription:`Pass structure metrics to summarize the product setup.`},fe={title:`Operations`,description:`Availability, channels, service rules, and fulfilment signals.`,createLabel:`Add signal`,editLabel:`Edit signal`,deleteLabel:`Delete signal`,actionsLabel:`Signal actions`,emptyTitle:`No operational signals`,emptyDescription:`Pass operational rows to show channel and availability health.`,actionLabel:`Open`},pe={title:`Product details`,description:`Core identity and catalogue fields.`,editLabel:`Edit details`,emptyTitle:`No details`,emptyDescription:`Pass metadata rows to render product details.`},me={title:`Contract`,description:`Commercial terms, pricing rules, and customer-facing conditions.`,termsTitle:`Terms`,rulesTitle:`Rules`,actionLabel:`Manage contract`,editLabel:`Edit contract`,createRuleLabel:`Add rule`,viewRuleLabel:`Open rule`,editRuleLabel:`Edit rule`,deleteRuleLabel:`Delete rule`,ruleActionsLabel:`Rule actions`,emptyTitle:`No contract summary`,emptyDescription:`Pass metrics, terms, or rules to summarize the product contract.`},he={title:`Options`,description:`Variant-driving choices and add-ons customers can select.`,manageLabel:`Manage options`,createLabel:`Add option`,viewLabel:`Open option`,editLabel:`Edit option`,deleteLabel:`Delete option`,actionsLabel:`Option actions`,emptyTitle:`No options`,emptyDescription:`Pass option groups to summarize configurable product choices.`},ge={viewLabel:`Open option`,editLabel:`Edit option`,deleteLabel:`Delete option`,actionsLabel:`Option actions`},_e={title:`Quote preview`,description:`How the product appears in a compact customer quote.`,subtotalLabel:`Subtotal`,taxLabel:`Tax`,discountLabel:`Discount`,totalLabel:`Total`,actionLabel:`Open quote`,createLineLabel:`Add line`,viewLineLabel:`Open line`,editLineLabel:`Edit line`,deleteLineLabel:`Delete line`,lineActionsLabel:`Line actions`,emptyTitle:`No quote lines`,emptyDescription:`Pass quote lines to preview pricing.`},ve={title:`Policies`,description:`Cancellation, booking, service, and customer-facing rules.`,createLabel:`Add policy`,viewLabel:`View`,editLabel:`Edit policy`,deleteLabel:`Delete policy`,actionsLabel:`Policy actions`,emptyTitle:`No policies`,emptyDescription:`Pass policies to summarize customer-facing rules.`},ye={title:`Variants`,description:`Sellable combinations with price, availability, and SKU.`,createLabel:`Add variant`,viewLabel:`Open variant`,editLabel:`Edit`,duplicateLabel:`Duplicate`,deleteLabel:`Delete`,emptyTitle:`No variants`,emptyDescription:`Create or pass variants to show sellable rows.`,headers:{variant:`Variant`,sku:`SKU`,price:`Price`,inventory:`Available`,channels:`Channels`,updated:`Updated`,actions:`Actions`}},be={viewLabel:`Open variant`,editLabel:`Edit`,duplicateLabel:`Duplicate`,deleteLabel:`Delete`,actionsLabel:`Variant actions`},xe={title:`Variant`,description:`Sellable variant details, options, pricing, and fulfilment data.`,backLabel:`Back`,factsTitle:`Variant facts`,selectedOptionsTitle:`Selected options`,relatedOptionsTitle:`Option groups`,viewOptionLabel:`Open option`,emptyTitle:`No variant selected`,emptyDescription:`Pass a variant to render a standalone variant detail surface.`,metadata:{price:`Price`,inventory:`Available`,sku:`SKU`,channels:`Channels`,updated:`Updated`}},Se={title:`Edit variant`,description:`Controlled form for variant identity, pricing, inventory, and option values.`,identityTitle:`Identity`,commercialTitle:`Commercial setup`,optionsTitle:`Options`,saveLabel:`Save variant`,savingLabel:`Saving`,cancelLabel:`Cancel`,deleteLabel:`Delete variant`,statusPlaceholder:`Select status`,optionPlaceholder:`Select value`,fields:{name:`Name`,description:`Description`,sku:`SKU`,price:`Price`,inventory:`Inventory`,status:`Status`,channels:`Channels`},placeholders:{name:`750 ml bottle`,description:`Standard retail pack`,sku:`BAL-750-CL`,price:`US$ 24.00`,inventory:`82`,status:`Active`,channels:`Online store, POS`}},Ce={mainLabel:`Product overview`,railLabel:`Product supporting information`},U=te();function W({title:e,description:t,action:n,className:r}){return(0,U.jsx)(ae,{padding:`compact`,border:!0,title:e,description:t,actions:n,className:A(`product-empty-state--component bg-muted/20`,r)})}var we={neutral:`secondary`,primary:`primary`,success:`success`,warning:`warning`,error:`error`,info:`info`},G={neutral:`border-border bg-card text-muted-foreground`,primary:`border-primary/20 bg-primary/5 text-primary`,success:`border-success/20 bg-success/5 text-success`,warning:`border-warning/30 bg-warning/8 text-warning`,error:`border-destructive/25 bg-destructive/8 text-destructive`,info:`border-info/20 bg-info/5 text-info`};function Te(e){return Number.isFinite(e)?Math.min(100,Math.max(0,Math.round(e))):0}function K({tone:e=`neutral`}){return(0,U.jsx)(`span`,{"aria-hidden":`true`,className:A(`product-tone-dot--component size-2 rounded-full`,{"bg-muted-foreground":e===`neutral`,"bg-primary":e===`primary`,"bg-success":e===`success`,"bg-warning":e===`warning`,"bg-destructive":e===`error`,"bg-info":e===`info`})})}function Ee({metric:e}){let t=e.tone??`neutral`;return(0,U.jsxs)(`div`,{className:A(`product-metric-tile--component rounded-md border px-3 py-2.5`,G[t]),children:[(0,U.jsxs)(`div`,{className:`flex items-start justify-between gap-2`,children:[(0,U.jsxs)(`div`,{className:`min-w-0 space-y-0.5`,children:[(0,U.jsx)(s,{size:`xs`,type:t===`neutral`?`secondary`:`main`,className:`truncate`,children:e.label}),(0,U.jsx)(s,{weight:`semibold`,className:`tabular-nums`,children:e.value})]}),`icon`in e&&!!e.icon&&(0,U.jsx)(`div`,{className:`shrink-0 opacity-80`,children:e.icon})]}),!!e.description&&(0,U.jsx)(s,{size:`xs`,type:`secondary`,className:`mt-1.5 leading-snug`,children:e.description})]})}function q({item:e,actions:t,menuLabel:n,className:r}){return t.length===0?null:(0,U.jsx)(`div`,{className:A(`product-row-actions--component flex justify-end`,r),children:(0,U.jsx)(se,{row:e,actions:t,menuLabel:n,displayMode:`menu`})})}function De({metric:e,actions:t}){let n=e.tone??`neutral`;return(0,U.jsxs)(V,{className:`product-structure-metric-row--component product-structure-card--item px-0`,children:[(0,U.jsx)(I,{variant:`icon`,className:A(`rounded-full border`,G[n]),children:e.icon??(0,U.jsx)(K,{tone:n})}),(0,U.jsxs)(B,{className:`min-w-[min(12rem,100%)]`,children:[(0,U.jsx)(H,{children:e.label}),!!e.description&&(0,U.jsx)(L,{clamp:2,children:e.description})]}),(0,U.jsxs)(R,{className:`ml-auto shrink-0 gap-2`,children:[(0,U.jsx)(s,{tag:`span`,size:`xs`,weight:`semibold`,className:`tabular-nums`,children:e.value}),t]})]})}function Oe({item:e,actionFallback:t,onSelect:n,actions:r}){let i=e.tone??(e.completed?`success`:`neutral`),a=e.onSelect??n;return(0,U.jsxs)(V,{className:`product-readiness-row--component product-readiness-card--item px-0`,children:[(0,U.jsx)(I,{variant:`icon`,className:A(`rounded-full border`,G[i]),children:(0,U.jsx)(K,{tone:i})}),(0,U.jsxs)(B,{className:`min-w-[min(12rem,100%)]`,children:[(0,U.jsx)(H,{children:e.label}),!!e.description&&(0,U.jsx)(L,{clamp:2,children:e.description})]}),!!(e.value||a||r)&&(0,U.jsxs)(R,{className:`ml-auto shrink-0 flex-wrap justify-end gap-2`,children:[!!e.value&&(0,U.jsx)(c,{variant:we[i],children:e.value}),!!a&&(0,U.jsx)(l,{type:`button`,variant:`secondary`,buttonStyle:`ghost`,onClick:a,icon:f,iconPosition:`right`,children:e.actionLabel??t}),r]})]})}function ke({item:e,actionFallback:t,onSelect:n,actions:r}){let i=e.tone??`neutral`,a=e.onSelect??n;return(0,U.jsxs)(V,{className:`product-operation-row--component product-operations-card--item px-0`,children:[(0,U.jsx)(I,{variant:`icon`,className:A(`rounded-full border`,G[i]),children:(0,U.jsx)(K,{tone:i})}),(0,U.jsxs)(B,{className:`min-w-[min(12rem,100%)]`,children:[(0,U.jsx)(H,{children:e.label}),!!e.description&&(0,U.jsx)(L,{clamp:2,children:e.description})]}),!!(e.value||a||r)&&(0,U.jsxs)(R,{className:`ml-auto shrink-0 flex-wrap justify-end gap-2`,children:[!!e.value&&(0,U.jsx)(s,{tag:`span`,size:`xs`,weight:`semibold`,children:e.value}),!!a&&(0,U.jsx)(l,{type:`button`,variant:`secondary`,buttonStyle:`ghost`,onClick:a,icon:f,iconPosition:`right`,children:e.actionLabel??t}),r]})]})}function J({item:e,actionLabel:t,onSelect:n,actions:r}){let i=e.tone??`neutral`,a=`values`in e?e.values:void 0;return(0,U.jsxs)(V,{className:`product-summary-row--component px-0`,children:[(0,U.jsx)(I,{variant:`icon`,className:A(`rounded-full border`,G[i]),children:(0,U.jsx)(K,{tone:i})}),(0,U.jsxs)(B,{className:`min-w-[min(12rem,100%)]`,children:[(0,U.jsx)(H,{children:e.label}),!!e.description&&(0,U.jsx)(L,{clamp:2,children:e.description}),!!a?.length&&(0,U.jsx)(`div`,{className:`mt-2 flex flex-wrap gap-1`,children:a.map((e,t)=>(0,U.jsx)(c,{variant:`secondary`,children:e},t))})]}),!!(e.value||e.badge||n||r)&&(0,U.jsxs)(R,{className:`ml-auto shrink-0 flex-wrap justify-end gap-2`,children:[!!e.value&&(0,U.jsx)(s,{tag:`span`,size:`xs`,weight:`semibold`,children:e.value}),!!e.badge&&e.badge,!!n&&(0,U.jsx)(l,{type:`button`,variant:`secondary`,buttonStyle:`ghost`,onClick:n,icon:f,iconPosition:`right`,children:t}),r]})]})}function Ae({metrics:e=[],terms:t=[],rules:n=[],onOpenContract:r,onEditContract:i,onCreateRule:a,onSelectRule:o,onEditRule:c,onDeleteRule:u,renderRuleActions:d,actions:p,footerSlot:m,empty:h,className:v,strings:y}){let b=k(me,y),C=e.length>0||t.length>0||n.length>0,w=r||i||a?(0,U.jsxs)(`div`,{className:`flex items-center gap-2`,children:[!!a&&(0,U.jsx)(l,{type:`button`,variant:`secondary`,buttonStyle:`ghost`,onClick:a,icon:S,children:b.createRuleLabel}),!!i&&(0,U.jsx)(l,{type:`button`,variant:`secondary`,buttonStyle:`ghost`,onClick:i,icon:x,children:b.editLabel}),!!r&&(0,U.jsx)(l,{type:`button`,variant:`secondary`,buttonStyle:`ghost`,onClick:r,icon:f,iconPosition:`right`,children:b.actionLabel})]}):void 0;return(0,U.jsx)(M,{icon:(0,U.jsx)(_,{className:`size-4`}),title:b.title,description:b.description,actions:p,headerAction:w,footerSlot:m,contentClassName:`mt-1`,className:A(`product-contract-overview--component w-full`,v),children:C?(0,U.jsxs)(`div`,{className:`space-y-4`,children:[e.length>0&&(0,U.jsx)(`div`,{className:`grid gap-2 sm:grid-cols-3`,children:e.map(e=>(0,U.jsx)(Ee,{metric:e},e.id))}),t.length>0&&(0,U.jsxs)(`div`,{className:`space-y-2`,children:[(0,U.jsx)(s,{size:`xs`,weight:`semibold`,children:b.termsTitle}),(0,U.jsx)(oe,{items:t,columns:2,dense:!0})]}),n.length>0&&(0,U.jsxs)(`div`,{className:`space-y-2`,children:[(0,U.jsx)(s,{size:`xs`,weight:`semibold`,children:b.rulesTitle}),(0,U.jsx)(z,{children:n.map((e,t)=>{let n=o?()=>o(e):void 0,r=c?()=>c(e):void 0,i=u?()=>u(e):void 0,a=[...n?[{id:`open`,label:b.viewRuleLabel,icon:(0,U.jsx)(g,{className:`size-3.5`}),onClick:()=>n(),variant:`ghost`}]:[],...r?[{id:`edit`,label:b.editRuleLabel,icon:(0,U.jsx)(x,{className:`size-3.5`}),onClick:()=>r(),variant:`ghost`}]:[],...i?[{id:`delete`,label:b.deleteRuleLabel,icon:(0,U.jsx)(D,{className:`size-3.5`}),onClick:()=>i(),variant:`destructive`}]:[]];return(0,U.jsx)(J,{item:e,actions:d?d(e,{index:t,onSelect:n,onEdit:r,onDelete:i}):(0,U.jsx)(q,{item:e,actions:a,menuLabel:b.ruleActionsLabel})},e.id)})})]})]}):h??(0,U.jsx)(W,{title:b.emptyTitle,description:b.emptyDescription,action:a?(0,U.jsx)(l,{type:`button`,onClick:a,icon:S,children:b.createRuleLabel}):void 0})})}Ae.displayName=`ProductContractOverview`;function je({title:e,description:t,metadata:n=[],media:r,onEditDetails:i,actions:a,headerEnd:o,footerSlot:s,empty:c,className:u,strings:d}){let f=k(pe,d),m=i?(0,U.jsx)(l,{type:`button`,variant:`secondary`,buttonStyle:`ghost`,onClick:i,icon:x,children:f.editLabel}):void 0;return(0,U.jsx)(M,{icon:(0,U.jsx)(p,{className:`size-4`}),title:e??f.title,description:t===!1?void 0:t??f.description,actions:a,headerAction:m,headerEnd:o,footerSlot:s,contentClassName:`mt-1`,className:A(`product-details-card--component w-full`,u),children:n.length===0?c??(0,U.jsx)(W,{title:f.emptyTitle,description:f.emptyDescription}):(0,U.jsx)(`div`,{className:`@container/product-details`,children:(0,U.jsxs)(`div`,{className:A(`grid gap-4`,r&&`@xl/product-details:grid-cols-[12rem_minmax(0,1fr)]`),children:[!!r&&(0,U.jsx)(`div`,{className:`product-details-card--media overflow-hidden rounded-md border border-border bg-muted/30`,children:r}),(0,U.jsx)(oe,{items:n,columns:r?1:2,dense:!0,className:`min-w-0`,valueClassName:`break-words`})]})})})}je.displayName=`ProductDetailsCard`;function Me({option:e,index:t=0,onSelectOption:n,onEditOption:r,onDeleteOption:i,renderOptionActions:a,menuLabel:o,className:s,strings:c}){let l=k(ge,c),u=n?()=>n(e):void 0,d=r?()=>r(e):void 0,f=i?()=>i(e):void 0;return u||d||f||a?a?(0,U.jsx)(`div`,{className:A(`product-option-action-menu--component flex justify-end`,s),children:a(e,{index:t,onSelect:u,onEdit:d,onDelete:f})}):(0,U.jsx)(q,{item:e,menuLabel:o??l.actionsLabel,className:A(`product-option-action-menu--component`,s),actions:[...u?[{id:`open`,label:l.viewLabel,icon:(0,U.jsx)(g,{className:`size-3.5`}),onClick:()=>u(),variant:`ghost`}]:[],...d?[{id:`edit`,label:l.editLabel,icon:(0,U.jsx)(x,{className:`size-3.5`}),onClick:()=>d(),variant:`ghost`}]:[],...f?[{id:`delete`,label:l.deleteLabel,icon:(0,U.jsx)(D,{className:`size-3.5`}),onClick:()=>f(),variant:`destructive`}]:[]]}):null}Me.displayName=`ProductOptionActionMenu`;function Ne({items:e=[],onCreateOperation:t,onSelectOperation:n,onEditOperation:r,onDeleteOperation:i,renderOperationActions:a,actions:o,footerSlot:s,renderItem:c,empty:u,className:d,strings:f}){let p=k(fe,f),m=t?(0,U.jsx)(l,{type:`button`,variant:`secondary`,buttonStyle:`ghost`,onClick:t,icon:S,children:p.createLabel}):void 0;return(0,U.jsx)(M,{icon:(0,U.jsx)(b,{className:`size-4`}),title:p.title,description:p.description,actions:o,headerAction:m,footerSlot:s,contentClassName:`mt-1`,className:A(`product-operations-card--component w-full`,d),children:e.length===0?u??(0,U.jsx)(W,{title:p.emptyTitle,description:p.emptyDescription,action:t?(0,U.jsx)(l,{type:`button`,onClick:t,icon:S,children:p.createLabel}):void 0}):(0,U.jsx)(z,{children:e.map((e,t)=>{let o=n?()=>n(e):void 0,s=r?()=>r(e):void 0,l=i?()=>i(e):void 0,u=[...s?[{id:`edit`,label:p.editLabel,icon:(0,U.jsx)(x,{className:`size-3.5`}),onClick:()=>s(),variant:`ghost`}]:[],...l?[{id:`delete`,label:p.deleteLabel,icon:(0,U.jsx)(D,{className:`size-3.5`}),onClick:()=>l(),variant:`destructive`}]:[]],d=a?a(e,{index:t,onSelect:o,onEdit:s,onDelete:l}):(0,U.jsx)(q,{item:e,actions:u,menuLabel:p.actionsLabel});return c?(0,U.jsx)(`div`,{children:c(e,t)},e.id):(0,U.jsx)(ke,{item:e,actionFallback:p.actionLabel,onSelect:o,actions:d},e.id)})})})}Ne.displayName=`ProductOperationsCard`;function Pe({options:e=[],onManageOptions:t,onCreateOption:n,onSelectOption:r,onEditOption:i,onDeleteOption:a,renderOptionActions:o,actions:s,footerSlot:c,renderOption:u,empty:d,className:f,strings:p}){let m=k(he,p),h=!!(r||i||a||o),g=[...s??[],...n&&t?[{id:`manage-options`,label:m.manageLabel,icon:(0,U.jsx)(E,{className:`size-3.5`}),onClick:t}]:[]],_=n||t?(0,U.jsx)(l,{type:`button`,variant:`secondary`,buttonStyle:`ghost`,onClick:n??t,icon:n?S:E,children:n?m.createLabel:m.manageLabel}):void 0;return(0,U.jsx)(M,{icon:(0,U.jsx)(E,{className:`size-4`}),title:m.title,description:m.description,actions:g.length>0?g:void 0,headerAction:_,footerSlot:c,contentClassName:`mt-1`,className:A(`product-options-summary--component w-full`,f),children:e.length===0?d??(0,U.jsx)(W,{title:m.emptyTitle,description:m.emptyDescription,action:n?(0,U.jsx)(l,{type:`button`,onClick:n,icon:S,children:m.createLabel}):void 0}):(0,U.jsx)(z,{children:e.map((e,t)=>(()=>{let n=h?(0,U.jsx)(Me,{option:e,index:t,onSelectOption:r,onEditOption:i,onDeleteOption:a,renderOptionActions:o,menuLabel:m.actionsLabel,strings:{viewLabel:m.viewLabel,editLabel:m.editLabel,deleteLabel:m.deleteLabel,actionsLabel:m.actionsLabel}}):void 0;return u?(0,U.jsx)(`div`,{children:u(e,t)},e.id):(0,U.jsx)(J,{item:e,actions:n},e.id)})())})})}Pe.displayName=`ProductOptionsSummary`;function Fe({policies:e=[],onCreatePolicy:t,onSelectPolicy:n,onEditPolicy:r,onDeletePolicy:i,renderPolicyActions:a,actions:o,footerSlot:s,renderPolicy:c,empty:u,className:d,strings:f}){let p=k(ve,f),m=t?(0,U.jsx)(l,{type:`button`,variant:`secondary`,buttonStyle:`ghost`,onClick:t,icon:S,children:p.createLabel}):void 0;return(0,U.jsx)(M,{icon:(0,U.jsx)(T,{className:`size-4`}),title:p.title,description:p.description,actions:o,headerAction:m,footerSlot:s,contentClassName:`mt-1`,className:A(`product-policies-card--component w-full`,d),children:e.length===0?u??(0,U.jsx)(W,{title:p.emptyTitle,description:p.emptyDescription,action:t?(0,U.jsx)(l,{type:`button`,onClick:t,icon:S,children:p.createLabel}):void 0}):(0,U.jsx)(z,{children:e.map((e,t)=>(()=>{let o=n?()=>n(e):void 0,s=r?()=>r(e):void 0,l=i?()=>i(e):void 0,u=[...s?[{id:`edit`,label:p.editLabel,icon:(0,U.jsx)(x,{className:`size-3.5`}),onClick:()=>s(),variant:`ghost`}]:[],...l?[{id:`delete`,label:p.deleteLabel,icon:(0,U.jsx)(D,{className:`size-3.5`}),onClick:()=>l(),variant:`destructive`}]:[]],d=a?a(e,{index:t,onSelect:o,onEdit:s,onDelete:l}):(0,U.jsx)(q,{item:e,actions:u,menuLabel:p.actionsLabel});return c?(0,U.jsx)(`div`,{children:c(e,t)},e.id):(0,U.jsx)(J,{item:e,actionLabel:p.viewLabel,onSelect:o,actions:d},e.id)})())})})}Fe.displayName=`ProductPoliciesCard`;function Ie({lines:e=[],subtotal:t,tax:n,discount:r,total:i,onOpenQuote:a,onCreateLine:o,onSelectLine:c,onEditLine:u,onDeleteLine:d,renderLineActions:p,actions:m,footerSlot:h,empty:_,className:v,strings:y}){let b=k(_e,y),w=o||a?(0,U.jsxs)(`div`,{className:`flex items-center gap-2`,children:[!!o&&(0,U.jsx)(l,{type:`button`,variant:`secondary`,buttonStyle:`ghost`,onClick:o,icon:S,children:b.createLineLabel}),!!a&&(0,U.jsx)(l,{type:`button`,variant:`secondary`,buttonStyle:`ghost`,onClick:a,icon:f,iconPosition:`right`,children:b.actionLabel})]}):void 0;return(0,U.jsx)(M,{icon:(0,U.jsx)(C,{className:`size-4`}),title:b.title,description:b.description,actions:m,headerAction:w,footerSlot:h,contentClassName:`mt-1`,className:A(`product-quote-preview-card--component w-full`,v),children:e.length===0?_??(0,U.jsx)(W,{title:b.emptyTitle,description:b.emptyDescription,action:o?(0,U.jsx)(l,{type:`button`,onClick:o,icon:S,children:b.createLineLabel}):void 0}):(0,U.jsxs)(`div`,{className:`space-y-3`,children:[(0,U.jsx)(`div`,{className:`space-y-2`,children:e.map((e,t)=>{let n=c?()=>c(e):void 0,r=u?()=>u(e):void 0,i=d?()=>d(e):void 0,a=[...n?[{id:`open`,label:b.viewLineLabel,icon:(0,U.jsx)(g,{className:`size-3.5`}),onClick:()=>n(),variant:`ghost`}]:[],...r?[{id:`edit`,label:b.editLineLabel,icon:(0,U.jsx)(x,{className:`size-3.5`}),onClick:()=>r(),variant:`ghost`}]:[],...i?[{id:`delete`,label:b.deleteLineLabel,icon:(0,U.jsx)(D,{className:`size-3.5`}),onClick:()=>i(),variant:`destructive`}]:[]],o=p?p(e,{index:t,onSelect:n,onEdit:r,onDelete:i}):(0,U.jsx)(q,{item:e,actions:a,menuLabel:b.lineActionsLabel});return(0,U.jsxs)(`div`,{className:`flex items-start justify-between gap-3 rounded-md border border-border bg-muted/20 px-3 py-2`,children:[(0,U.jsxs)(`div`,{className:`min-w-0`,children:[(0,U.jsx)(s,{weight:`semibold`,className:`truncate`,children:e.label}),!!e.description&&(0,U.jsx)(s,{size:`xs`,type:`secondary`,className:`mt-0.5`,children:e.description}),!!e.quantity&&(0,U.jsx)(s,{size:`xxs`,type:`secondary`,className:`mt-1`,children:e.quantity})]}),(0,U.jsxs)(`div`,{className:`flex shrink-0 items-center gap-2`,children:[(0,U.jsx)(s,{weight:`semibold`,className:`tabular-nums`,children:e.amount}),o]})]},e.id)})}),(0,U.jsxs)(`div`,{className:`space-y-1.5 rounded-md bg-muted/30 px-3 py-2.5`,children:[t!==void 0&&(0,U.jsx)(F,{label:b.subtotalLabel,value:t,mono:!0}),n!==void 0&&(0,U.jsx)(F,{label:b.taxLabel,value:n,mono:!0}),r!==void 0&&(0,U.jsx)(F,{label:b.discountLabel,value:r,mono:!0,valueClassName:`text-success`}),(0,U.jsx)(F,{label:b.totalLabel,value:i??`-`,mono:!0,labelClassName:`font-semibold`,valueClassName:`font-semibold`})]})]})})}Ie.displayName=`ProductQuotePreviewCard`;function Le({items:e=[],score:t,scoreLabel:n,summary:r,onCreateReadinessItem:i,onSelectReadinessItem:a,onEditReadinessItem:o,onDeleteReadinessItem:c,renderReadinessItemActions:u,actions:d,footerSlot:f,renderItem:p,empty:h,className:g,strings:_}){let v=k(ue,_),y=t===void 0?void 0:Te(t),b=i?(0,U.jsx)(l,{type:`button`,variant:`secondary`,buttonStyle:`ghost`,onClick:i,icon:S,children:v.createLabel}):void 0;return(0,U.jsxs)(M,{icon:(0,U.jsx)(m,{className:`size-4`}),title:v.title,description:v.description,actions:d,headerAction:b,footerSlot:f,contentClassName:`mt-1`,className:A(`product-readiness-card--component w-full`,g),children:[y!==void 0&&(0,U.jsxs)(`div`,{className:`mb-3 rounded-md border border-border bg-muted/20 px-3 py-2.5`,children:[(0,U.jsxs)(`div`,{className:`mb-2 flex items-center justify-between gap-3`,children:[(0,U.jsx)(s,{size:`xs`,type:`secondary`,children:n??v.scoreLabel}),(0,U.jsxs)(s,{size:`xs`,weight:`semibold`,className:`tabular-nums`,children:[y,`%`]})]}),(0,U.jsx)(ie,{value:y,"aria-label":typeof n==`string`?n:v.progressLabel,"aria-valuetext":`${y}%`,className:`h-1.5`})]}),!!r&&(0,U.jsx)(s,{size:`xs`,type:`secondary`,className:`mb-3 leading-relaxed`,children:r}),e.length===0?h??(0,U.jsx)(W,{title:v.emptyTitle,description:v.emptyDescription,action:i?(0,U.jsx)(l,{type:`button`,onClick:i,icon:S,children:v.createLabel}):void 0}):(0,U.jsx)(z,{children:e.map((e,t)=>{let n=a?()=>a(e):void 0,r=o?()=>o(e):void 0,i=c?()=>c(e):void 0,s=[...r?[{id:`edit`,label:v.editLabel,icon:(0,U.jsx)(x,{className:`size-3.5`}),onClick:()=>r(),variant:`ghost`}]:[],...i?[{id:`delete`,label:v.deleteLabel,icon:(0,U.jsx)(D,{className:`size-3.5`}),onClick:()=>i(),variant:`destructive`}]:[]],l=u?u(e,{index:t,onSelect:n,onEdit:r,onDelete:i}):(0,U.jsx)(q,{item:e,actions:s,menuLabel:v.actionsLabel});return p?(0,U.jsx)(`div`,{children:p(e,t)},e.id):(0,U.jsx)(Oe,{item:e,actionFallback:v.actionLabel,onSelect:n,actions:l},e.id)})})]})}Le.displayName=`ProductReadinessCard`;function Re({metrics:e=[],onCreateMetric:t,onSelectMetric:n,onEditMetric:r,onDeleteMetric:i,renderMetricActions:a,actions:o,footerSlot:s,empty:c,className:u,strings:d}){let f=k(de,d),p=t?(0,U.jsx)(l,{type:`button`,variant:`secondary`,buttonStyle:`ghost`,onClick:t,icon:S,children:f.createLabel}):void 0;return(0,U.jsx)(M,{icon:(0,U.jsx)(y,{className:`size-4`}),title:f.title,description:f.description,actions:o,headerAction:p,footerSlot:s,contentClassName:`mt-1`,className:A(`product-structure-card--component w-full`,u),children:e.length===0?c??(0,U.jsx)(W,{title:f.emptyTitle,description:f.emptyDescription,action:t?(0,U.jsx)(l,{type:`button`,onClick:t,icon:S,children:f.createLabel}):void 0}):(0,U.jsx)(z,{children:e.map((e,t)=>{let o=n?()=>n(e):void 0,s=r?()=>r(e):void 0,c=i?()=>i(e):void 0,l=[...o?[{id:`open`,label:f.viewLabel,icon:(0,U.jsx)(g,{className:`size-3.5`}),onClick:()=>o(),variant:`ghost`}]:[],...s?[{id:`edit`,label:f.editLabel,icon:(0,U.jsx)(x,{className:`size-3.5`}),onClick:()=>s(),variant:`ghost`}]:[],...c?[{id:`delete`,label:f.deleteLabel,icon:(0,U.jsx)(D,{className:`size-3.5`}),onClick:()=>c(),variant:`destructive`}]:[]];return(0,U.jsx)(De,{metric:e,actions:a?a(e,{index:t,onSelect:o,onEdit:s,onDelete:c}):(0,U.jsx)(q,{item:e,actions:l,menuLabel:f.actionsLabel})},e.id)})})})}Re.displayName=`ProductStructureCard`;function Y({variant:e,index:t=0,onSelectVariant:n,onEditVariant:r,onDuplicateVariant:i,onDeleteVariant:o,renderVariantActions:s,menuLabel:c,className:l,strings:u}){let d=k(be,u),f=n?()=>n(e):void 0,p=r?()=>r(e):void 0,m=i?()=>i(e):void 0,h=o?()=>o(e):void 0;return f||p||m||h||s?s?(0,U.jsx)(`div`,{className:A(`product-variant-action-menu--component flex justify-end`,l),children:s(e,{index:t,onSelect:f,onEdit:p,onDuplicate:m,onDelete:h})}):(0,U.jsx)(q,{item:e,menuLabel:c??d.actionsLabel,className:A(`product-variant-action-menu--component`,l),actions:[...f?[{id:`open`,label:d.viewLabel,icon:(0,U.jsx)(g,{className:`size-3.5`}),onClick:()=>f(),variant:`ghost`}]:[],...p?[{id:`edit`,label:d.editLabel,icon:(0,U.jsx)(x,{className:`size-3.5`}),onClick:()=>p(),variant:`ghost`}]:[],...m?[{id:`duplicate`,label:d.duplicateLabel,icon:(0,U.jsx)(a,{className:`size-3.5`}),onClick:()=>m(),variant:`ghost`}]:[],...h?[{id:`delete`,label:d.deleteLabel,icon:(0,U.jsx)(D,{className:`size-3.5`}),onClick:()=>h(),variant:`destructive`}]:[]]}):null}Y.displayName=`ProductVariantActionMenu`;function X({label:e,children:t,className:n,textClassName:r,weight:i}){return(0,U.jsxs)(`div`,{className:A(`product-variant-cell--component grid min-w-0 grid-cols-[6rem_minmax(0,1fr)] items-center gap-2 lg:block lg:space-y-0.5`,n),children:[(0,U.jsx)(s,{size:`xxs`,type:`secondary`,className:`uppercase tracking-wide lg:sr-only`,children:e}),(0,U.jsx)(s,{size:`xs`,type:`secondary`,weight:i,className:A(`truncate`,r),children:t})]})}function ze({variants:e=[],onCreateVariant:t,onSelectVariant:n,onEditVariant:r,onDuplicateVariant:i,onDeleteVariant:a,renderVariantActions:o,actions:u,footerSlot:d,empty:f,className:p,strings:m}){let h=k(ye,m),g=!!(n||r||i||a||o),_=`lg:grid-cols-[minmax(12rem,1.45fr)_minmax(4rem,0.6fr)_minmax(4rem,0.55fr)_minmax(4.75rem,0.7fr)_minmax(4rem,0.55fr)]`,v=t?(0,U.jsx)(l,{type:`button`,variant:`secondary`,buttonStyle:`ghost`,onClick:t,icon:S,children:h.createLabel}):void 0;return(0,U.jsx)(M,{icon:(0,U.jsx)(ce,{className:`size-4`}),title:h.title,description:h.description,actions:u,headerAction:v,footerSlot:d,contentClassName:`mt-1`,className:A(`product-variants-table--component w-full`,p),children:e.length===0?f??(0,U.jsx)(W,{title:h.emptyTitle,description:h.emptyDescription,action:t?(0,U.jsx)(l,{type:`button`,onClick:t,icon:S,children:h.createLabel}):void 0}):(0,U.jsx)(`div`,{className:`product-variants-table--table rounded-md border border-border`,children:(0,U.jsxs)(`div`,{className:`lg:min-w-[34rem]`,children:[(0,U.jsxs)(`div`,{className:A(`hidden gap-3 border-b border-border bg-muted/40 px-3 py-2 lg:grid`,_),children:[(0,U.jsx)(s,{tag:`span`,size:`xs`,weight:`semibold`,type:`secondary`,children:h.headers.variant}),(0,U.jsx)(s,{tag:`span`,size:`xs`,weight:`semibold`,type:`secondary`,children:h.headers.price}),(0,U.jsx)(s,{tag:`span`,size:`xs`,weight:`semibold`,type:`secondary`,children:h.headers.inventory}),(0,U.jsx)(s,{tag:`span`,size:`xs`,weight:`semibold`,type:`secondary`,children:h.headers.sku}),(0,U.jsx)(s,{tag:`span`,size:`xs`,weight:`semibold`,type:`secondary`,children:h.headers.updated})]}),(0,U.jsx)(`div`,{className:`divide-y divide-border`,children:e.map((e,t)=>(0,U.jsxs)(`div`,{className:A(`grid gap-2 px-3 py-3 lg:items-center lg:gap-3 lg:py-2.5`,_),children:[(0,U.jsx)(`div`,{className:`min-w-0`,children:(0,U.jsxs)(`div`,{className:`flex min-w-0 items-start gap-2`,children:[(0,U.jsxs)(`div`,{className:`min-w-0 flex-1`,children:[(0,U.jsxs)(`div`,{className:`flex min-w-0 flex-wrap items-center gap-2`,children:[(0,U.jsx)(s,{weight:`semibold`,className:`truncate`,children:e.name}),!!e.status&&(0,U.jsx)(c,{variant:e.statusVariant??`secondary`,children:e.status})]}),!!e.description&&(0,U.jsx)(s,{size:`xs`,type:`secondary`,className:`mt-0.5`,children:e.description}),!!(e.options?.length||e.channels)&&(0,U.jsxs)(`div`,{className:`mt-1.5 flex flex-wrap items-center gap-1`,children:[e.options?.map((e,t)=>(0,U.jsx)(c,{variant:`secondary`,children:e},t)),!!e.channels&&(0,U.jsxs)(s,{tag:`span`,size:`xxs`,type:`secondary`,className:`pl-1`,children:[h.headers.channels,`: `,e.channels]})]})]}),!!g&&(0,U.jsx)(Y,{variant:e,index:t,onSelectVariant:n,onEditVariant:r,onDuplicateVariant:i,onDeleteVariant:a,renderVariantActions:o,menuLabel:h.headers.actions,className:`shrink-0`,strings:{viewLabel:h.viewLabel,editLabel:h.editLabel,duplicateLabel:h.duplicateLabel,deleteLabel:h.deleteLabel,actionsLabel:h.headers.actions}})]})}),(0,U.jsx)(X,{label:h.headers.price,weight:`semibold`,textClassName:`tabular-nums text-foreground`,children:e.price??`-`}),(0,U.jsx)(X,{label:h.headers.inventory,textClassName:`tabular-nums`,children:e.inventory??`-`}),(0,U.jsx)(X,{label:h.headers.sku,textClassName:`tabular-nums`,children:e.sku??`-`}),(0,U.jsx)(X,{label:h.headers.updated,children:e.updatedAt??`-`})]},e.id))})]})})})}ze.displayName=`ProductVariantsTable`;function Be({details:e,contract:t,options:n,variants:r,readiness:i,structure:a,operations:o,quote:s,policies:c,slots:l,className:u,mainClassName:d,railClassName:f,strings:p}){let m=k(Ce,p),h=!!(i||a||o||s||c||l?.railTop||l?.railBottom);return(0,U.jsxs)(`div`,{className:A(`product-overview--component @container/product-overview space-y-4`,u),children:[l?.before,(0,U.jsxs)(`div`,{className:A(`grid gap-4`,h&&`@5xl/product-overview:grid-cols-[minmax(0,1fr)_22rem]`),children:[(0,U.jsxs)(`section`,{"aria-label":m.mainLabel,className:A(`product-overview--main min-w-0 space-y-4`,d),children:[l?.mainTop,!!e&&(0,U.jsx)(je,{...e}),!!t&&(0,U.jsx)(Ae,{...t}),!!n&&(0,U.jsx)(Pe,{...n}),!!r&&(0,U.jsx)(ze,{...r}),l?.mainBottom]}),!!h&&(0,U.jsxs)(`aside`,{"aria-label":m.railLabel,className:A(`product-overview--rail min-w-0 space-y-4`,f),children:[l?.railTop,!!i&&(0,U.jsx)(Le,{...i}),!!a&&(0,U.jsx)(Re,{...a}),!!o&&(0,U.jsx)(Ne,{...o}),!!s&&(0,U.jsx)(Ie,{...s}),!!c&&(0,U.jsx)(Fe,{...c}),l?.railBottom]})]}),l?.after]})}Be.displayName=`ProductOverview`;var Ve=e=>e!=null&&e!==!1&&e!==``;function He(e,t){return[{label:t.price,value:e.price},{label:t.inventory,value:e.inventory},{label:t.sku,value:e.sku},{label:t.channels,value:e.channels},{label:t.updated,value:e.updatedAt}].filter(e=>Ve(e.value))}function Ue({variant:e,metadata:t,optionItems:n=[],media:r,onBack:i,onSelectVariant:a,onEditVariant:o,onDuplicateVariant:u,onDeleteVariant:f,onSelectOption:p,actions:m,headerEnd:h,footerSlot:g,empty:_,renderActions:v,renderMetadata:y,renderOption:b,className:x,strings:S}){let C=k(xe,S),w=e?t??He(e,C.metadata):[],T=!!(e&&(a||o||u||f||v)),E=(0,U.jsxs)(`div`,{className:`product-variant-details--header-actions flex items-center gap-2`,children:[!!i&&(0,U.jsx)(l,{type:`button`,variant:`secondary`,buttonStyle:`ghost`,onClick:i,icon:d,children:C.backLabel}),!!T&&e&&(0,U.jsx)(Y,{variant:e,onSelectVariant:a,onEditVariant:o,onDuplicateVariant:u,onDeleteVariant:f,renderVariantActions:v})]}),D=e?.options??[];return(0,U.jsx)(M,{icon:(0,U.jsx)(ce,{className:`size-4`}),title:e?.name??C.title,titleSuffix:e?.status?(0,U.jsx)(c,{variant:e.statusVariant??`secondary`,children:e.status}):void 0,description:e?.description??C.description,actions:m,headerAction:i||T?E:void 0,headerEnd:h,footerSlot:g,contentClassName:`mt-1`,className:A(`product-variant-details--component w-full`,x),children:e?(0,U.jsxs)(`div`,{className:`product-variant-details--body grid gap-5`,children:[!!r&&(0,U.jsx)(`div`,{className:`product-variant-details--media overflow-hidden rounded-md border border-border bg-muted/30`,children:r}),y?y(e):(0,U.jsx)(oe,{title:C.factsTitle,items:w,columns:3,dense:!0,className:`product-variant-details--metadata`}),!!D.length&&(0,U.jsxs)(`div`,{className:`product-variant-details--selected-options space-y-2`,children:[(0,U.jsx)(s,{weight:`semibold`,children:C.selectedOptionsTitle}),(0,U.jsx)(`div`,{className:`flex flex-wrap gap-1.5`,children:D.map((e,t)=>(0,U.jsx)(c,{variant:`secondary`,children:e},t))})]}),!!n.length&&(0,U.jsxs)(`div`,{className:`product-variant-details--related-options space-y-2`,children:[(0,U.jsx)(s,{weight:`semibold`,children:C.relatedOptionsTitle}),(0,U.jsx)(z,{children:n.map((e,t)=>b?(0,U.jsx)(`div`,{children:b(e,t)},e.id):(0,U.jsx)(J,{item:e,actionLabel:C.viewOptionLabel,onSelect:p?()=>p(e):void 0},e.id))})]})]}):_??(0,U.jsx)(W,{title:C.emptyTitle,description:C.emptyDescription})})}Ue.displayName=`ProductVariantDetails`;var We=t(n(),1),Ge=e=>e.map(e=>({value:e.value,label:e.label,disabled:e.disabled}));function Ke({value:e,defaultValue:t,optionFields:n=[],statusOptions:r=[],onValueChange:i,onSubmit:a,onCancel:o,onDelete:c,actions:u,headerEnd:d,footerSlot:f,disabled:p=!1,isSubmitting:m=!1,className:h,strings:g}){let _=k(Se,g),v=(0,We.useId)(),y=e!==void 0,[b,S]=(0,We.useState)(t??{}),C=(y?e:b)??{},T=p||m,E=e=>{y||S(e),i?.(e)},O=(e,t)=>{E({...C,[e]:t})},te=(e,t)=>{E({...C,options:{...C.options??{},[e.id]:t}})},j=e=>{e.preventDefault(),a?.(C)},F=(0,U.jsxs)(`div`,{className:`product-variant-editor--footer flex flex-col-reverse gap-2 sm:flex-row sm:items-center sm:justify-between`,children:[(0,U.jsx)(`div`,{children:!!c&&(0,U.jsx)(l,{type:`button`,variant:`error`,buttonStyle:`ghost`,onClick:()=>c(C),disabled:T,icon:D,children:_.deleteLabel})}),(0,U.jsxs)(`div`,{className:`flex flex-col-reverse gap-2 sm:flex-row sm:justify-end`,children:[!!o&&(0,U.jsx)(l,{type:`button`,variant:`secondary`,buttonStyle:`ghost`,onClick:o,disabled:T,icon:ee,children:_.cancelLabel}),!!a&&(0,U.jsx)(l,{type:`submit`,form:v,disabled:T,icon:w,children:m?_.savingLabel:_.saveLabel})]})]}),ie=!!(c||o||a);return(0,U.jsx)(M,{icon:(0,U.jsx)(x,{className:`size-4`}),title:_.title,description:_.description,actions:u,headerEnd:d,footerSlot:f??(ie?F:void 0),footerDivider:!0,contentClassName:`mt-1`,className:A(`product-variant-editor--component w-full`,h),children:(0,U.jsxs)(`form`,{id:v,className:`product-variant-editor--form grid gap-5`,onSubmit:j,children:[(0,U.jsxs)(`section`,{className:`product-variant-editor--section grid gap-3`,children:[(0,U.jsx)(s,{weight:`semibold`,children:_.identityTitle}),(0,U.jsxs)(`div`,{className:`grid gap-3 md:grid-cols-2`,children:[(0,U.jsx)(P,{label:_.fields.name,required:!0,children:(0,U.jsx)(N,{value:C.name??``,onChange:e=>O(`name`,e.target.value),placeholder:_.placeholders.name,disabled:T})}),(0,U.jsx)(P,{label:_.fields.sku,children:(0,U.jsx)(N,{value:C.sku??``,onChange:e=>O(`sku`,e.target.value),placeholder:_.placeholders.sku,disabled:T})}),(0,U.jsx)(P,{label:_.fields.description,className:`md:col-span-2`,children:(0,U.jsx)(ne,{value:C.description??``,onChange:e=>O(`description`,e.target.value),placeholder:_.placeholders.description,disabled:T,autoResize:!0,minRows:2})})]})]}),(0,U.jsxs)(`section`,{className:`product-variant-editor--section grid gap-3`,children:[(0,U.jsx)(s,{weight:`semibold`,children:_.commercialTitle}),(0,U.jsxs)(`div`,{className:`grid gap-3 md:grid-cols-2`,children:[(0,U.jsx)(P,{label:_.fields.price,children:(0,U.jsx)(N,{value:C.price??``,onChange:e=>O(`price`,e.target.value),placeholder:_.placeholders.price,disabled:T})}),(0,U.jsx)(P,{label:_.fields.inventory,children:(0,U.jsx)(N,{value:C.inventory??``,onChange:e=>O(`inventory`,e.target.value),placeholder:_.placeholders.inventory,disabled:T,inputMode:`numeric`})}),(0,U.jsx)(P,{label:_.fields.status,children:r.length>0?(0,U.jsx)(re,{options:Ge(r),value:C.status??null,onChange:e=>O(`status`,e??``),placeholder:_.statusPlaceholder,disabled:T,"aria-label":_.fields.status}):(0,U.jsx)(N,{value:C.status??``,onChange:e=>O(`status`,e.target.value),placeholder:_.placeholders.status,disabled:T})}),(0,U.jsx)(P,{label:_.fields.channels,children:(0,U.jsx)(N,{value:C.channels??``,onChange:e=>O(`channels`,e.target.value),placeholder:_.placeholders.channels,disabled:T})})]})]}),!!n.length&&(0,U.jsxs)(`section`,{className:`product-variant-editor--section grid gap-3`,children:[(0,U.jsx)(s,{weight:`semibold`,children:_.optionsTitle}),(0,U.jsx)(`div`,{className:`grid gap-3 md:grid-cols-2`,children:n.map(e=>{let t=e.value??C.options?.[e.id]??``,n=!!e.choices?.length;return(0,U.jsx)(P,{label:e.label,helperText:e.helperText,children:n?(0,U.jsx)(re,{options:Ge(e.choices??[]),value:t||null,onChange:t=>te(e,t),placeholder:e.placeholder??_.optionPlaceholder,disabled:T,"aria-label":e.label}):(0,U.jsx)(N,{value:t,onChange:t=>te(e,t.target.value),placeholder:e.placeholder??_.optionPlaceholder,disabled:T})},e.id)})})]})]})})}Ke.displayName=`ProductVariantEditor`;function qe({className:e,...t}){return(0,U.jsx)(Be,{...t,className:A(`products--component`,e)})}qe.displayName=`Products`;var Je=``+new URL(`hero-CLDdwZDr.png`,import.meta.url).href,Ye=e({OptionsAndVariants:()=>at,ProductEditor:()=>it,ProductSupportRail:()=>ct,StandaloneActionMenus:()=>st,VariantDetailsAndEditor:()=>ot}),Xe=[{id:`classic`,name:`Classic bottle`,description:`Standard retail pack`,options:[`375 ml`,`Classic label`],sku:`BAL-375-CL`,price:`US$ 18.00`,inventory:`82`,channels:`Online store, POS`,updatedAt:`Today`,status:`Active`,statusVariant:`success`},{id:`gift`,name:`Gift box`,description:`Bottle, pourer, tasting card`,options:[`750 ml`,`Gift packaging`],sku:`BAL-750-GF`,price:`US$ 46.00`,inventory:`28`,channels:`Online store`,updatedAt:`Yesterday`,status:`Review`,statusVariant:`warning`},{id:`case`,name:`Case of six`,description:`Wholesale case pack`,options:[`6 x 750 ml`,`Wholesale`],sku:`BAL-CASE-6`,price:`US$ 132.00`,inventory:`14`,channels:`B2B`,updatedAt:`Jun 12`,status:`Active`,statusVariant:`success`}],Ze=[{id:`size`,label:`Size`,description:`Controls bottle volume and variant price.`,values:[`375 ml`,`750 ml`,`Case of six`],value:`3 values`,tone:`primary`},{id:`packaging`,label:`Packaging`,description:`Customer-facing presentation options.`,values:[`Classic label`,`Gift packaging`,`Wholesale`],value:`3 values`,tone:`neutral`},{id:`gift-message`,label:`Gift message`,description:`Optional card text collected at checkout.`,values:[`None`,`Printed card`],value:`Optional`,tone:`success`}],Z=()=>{},Qe=[{value:`active`,label:`Active`},{value:`review`,label:`Review`},{value:`draft`,label:`Draft`}],$e=[{id:`size`,label:`Size`,choices:[{value:`375 ml`,label:`375 ml`},{value:`750 ml`,label:`750 ml`},{value:`Case of six`,label:`Case of six`}]},{id:`packaging`,label:`Packaging`,choices:[{value:`Classic label`,label:`Classic label`},{value:`Gift packaging`,label:`Gift packaging`},{value:`Wholesale`,label:`Wholesale`}]}],et={name:`Classic bottle`,description:`Standard retail pack`,sku:`BAL-375-CL`,price:`US$ 18.00`,inventory:`82`,status:`active`,channels:`Online store, POS`,options:{size:`375 ml`,packaging:`Classic label`}};function tt({frame:e=`square`}){return(0,U.jsxs)(`div`,{className:A(`relative overflow-hidden rounded-md border border-border bg-muted`,e===`square`?`aspect-square`:`aspect-[4/3] max-h-72`),children:[(0,U.jsx)(`img`,{src:Je,alt:`Balsamic tasting set`,className:`h-full w-full object-cover`}),(0,U.jsxs)(`div`,{className:`absolute inset-x-0 bottom-0 bg-background/85 px-3 py-2 backdrop-blur-sm`,children:[(0,U.jsx)(s,{size:`xs`,weight:`semibold`,children:`Primary media`}),(0,U.jsx)(s,{size:`xxs`,type:`secondary`,children:`Alt text and gallery remain app-owned.`})]})]})}function nt(){return{details:{media:(0,U.jsx)(tt,{}),metadata:[{label:`Status`,value:(0,U.jsx)(c,{variant:`success`,children:`Active`})},{label:`Vendor`,value:`Aegean Pantry Co.`},{label:`Category`,value:`Food & pantry`},{label:`Product type`,value:`Physical good`},{label:`Base price`,value:`US$ 18.00`},{label:`Tax class`,value:`Standard`}]},contract:{metrics:[{id:`margin`,label:`Margin`,value:`48%`,description:`After landed cost`,tone:`success`},{id:`lead-time`,label:`Lead time`,value:`3 days`,description:`Warehouse average`,tone:`info`},{id:`tax`,label:`Tax`,value:`Included`,description:`Shown in checkout`,tone:`neutral`}],terms:[{label:`Payment`,value:`Due at checkout`},{label:`Fulfilment`,value:`Warehouse dispatch`},{label:`Cancellation`,value:`Before dispatch`},{label:`Availability`,value:`Stock constrained`}],rules:[{id:`gross`,label:`Tax included`,description:`Customer quotes show gross pricing.`,tone:`success`},{id:`b2b`,label:`Wholesale allowed`,description:`Case pack available to the B2B channel.`,tone:`info`}]},options:{options:Ze,onManageOptions:Z,onCreateOption:Z,onSelectOption:Z,onEditOption:Z,onDeleteOption:Z},variants:{variants:Xe,onCreateVariant:Z,onSelectVariant:Z,onEditVariant:Z,onDuplicateVariant:Z,onDeleteVariant:Z}}}function rt(){return{readiness:{score:86,summary:`Ready to publish once translation review and replenishment dates are confirmed.`,onCreateReadinessItem:Z,onSelectReadinessItem:Z,onEditReadinessItem:Z,onDeleteReadinessItem:Z,items:[{id:`copy`,label:`Product copy`,description:`Title, description, SEO summary complete.`,completed:!0},{id:`media`,label:`Media`,description:`Cover image and gallery uploaded.`,completed:!0},{id:`translation`,label:`Translations`,description:`Greek and German copy need review.`,value:`2 locales`,tone:`warning`},{id:`inventory`,label:`Inventory policy`,description:`Restock date still needs supplier confirmation.`,value:`Review`,tone:`warning`}]},structure:{onCreateMetric:Z,onSelectMetric:Z,onEditMetric:Z,onDeleteMetric:Z,metrics:[{id:`media`,label:`Media`,value:`8`,description:`1 cover, 7 gallery`,tone:`success`,icon:(0,U.jsx)(v,{className:`size-4`})},{id:`categories`,label:`Collections`,value:`3`,description:`Pantry, gifts, tasting`,tone:`info`,icon:(0,U.jsx)(le,{className:`size-4`})},{id:`locales`,label:`Locales`,value:`2 / 4`,description:`EN live, EL review`,tone:`warning`,icon:(0,U.jsx)(h,{className:`size-4`})},{id:`variants`,label:`Variants`,value:`3`,description:`All sellable`,tone:`success`,icon:(0,U.jsx)(b,{className:`size-4`})}]},operations:{onCreateOperation:Z,onSelectOperation:Z,onEditOperation:Z,onDeleteOperation:Z,items:[{id:`stock`,label:`Stock policy`,description:`Checkout blocked below available inventory.`,value:`Active`,tone:`success`},{id:`channels`,label:`Sales channels`,description:`Online store, POS, and B2B market enabled.`,value:`3`,tone:`info`},{id:`calendar`,label:`Restock calendar`,description:`Next supplier run pending confirmation.`,value:`Review`,tone:`warning`}]},quote:{onCreateLine:Z,onSelectLine:Z,onEditLine:Z,onDeleteLine:Z,lines:[{id:`bottle`,label:`Classic bottle`,quantity:`2 x US$ 18.00`,amount:`US$ 36.00`},{id:`gift`,label:`Gift packaging`,quantity:`1 x US$ 5.00`,amount:`US$ 5.00`}],subtotal:`US$ 41.00`,tax:`Included`,total:`US$ 41.00`},policies:{onCreatePolicy:Z,onSelectPolicy:Z,onEditPolicy:Z,onDeletePolicy:Z,policies:[{id:`returns`,label:`Returns`,description:`Unopened goods can be returned within 14 days.`,tone:`success`},{id:`shipping`,label:`Shipping`,description:`Ambient warehouse dispatch only.`,tone:`neutral`}]}}}function it(){let e=nt(),t=rt();return(0,U.jsxs)(`div`,{className:`w-full rounded-lg border border-border bg-muted/20 p-4`,children:[(0,U.jsxs)(`div`,{className:`mb-4 flex flex-col gap-4 border-b border-border pb-4 lg:flex-row lg:items-start lg:justify-between`,children:[(0,U.jsxs)(`div`,{className:`min-w-0 space-y-3`,children:[(0,U.jsxs)(`div`,{className:`flex flex-wrap items-center gap-2`,children:[(0,U.jsx)(c,{variant:`success`,children:`Active`}),(0,U.jsx)(c,{variant:`info`,children:`3 variants`}),(0,U.jsx)(c,{variant:`warning`,children:`2 review items`})]}),(0,U.jsxs)(`div`,{children:[(0,U.jsx)(o,{tag:`h2`,className:`border-none pb-0`,children:`Balsamic tasting set`}),(0,U.jsx)(s,{type:`secondary`,className:`mt-1 max-w-3xl`,children:`Shopify-style product editor composed from product details, options, variants, readiness, operations, and quote cards.`})]}),(0,U.jsx)(oe,{layout:`horizontal`,items:[{label:`SKU`,value:`BAL-TASTE-01`},{label:`Vendor`,value:`Aegean Pantry Co.`},{label:`Market`,value:`US online store`},{label:`Updated`,value:`Today`}],columns:4})]}),(0,U.jsxs)(`div`,{className:`flex shrink-0 flex-wrap gap-2`,children:[(0,U.jsx)(l,{variant:`secondary`,buttonStyle:`outline`,children:`Preview`}),(0,U.jsx)(l,{children:`Save product`})]})]}),(0,U.jsx)(qe,{details:e.details,contract:e.contract,options:e.options,variants:e.variants,readiness:t.readiness,structure:t.structure,operations:t.operations,quote:t.quote,policies:t.policies})]})}function at(){let e=nt();return(0,U.jsxs)(`div`,{className:`grid w-full gap-4`,children:[(0,U.jsx)(Pe,{...e.options}),(0,U.jsx)(ze,{...e.variants})]})}function ot(){let[e,t]=(0,We.useState)(et);return(0,U.jsxs)(`div`,{className:`grid w-full gap-4 xl:grid-cols-[minmax(0,0.9fr)_minmax(0,1.1fr)]`,children:[(0,U.jsx)(Ue,{variant:Xe[0],optionItems:Ze.slice(0,2),media:(0,U.jsx)(tt,{frame:`wide`}),onBack:Z,onSelectVariant:Z,onEditVariant:Z,onDuplicateVariant:Z,onDeleteVariant:Z,onSelectOption:Z}),(0,U.jsx)(Ke,{value:e,optionFields:$e,statusOptions:Qe,onValueChange:t,onSubmit:Z,onCancel:Z,onDelete:Z})]})}function st(){return(0,U.jsxs)(`div`,{className:`grid w-full gap-4 sm:grid-cols-2`,children:[(0,U.jsx)(M,{title:`Option actions`,description:`The menu can be used next to any option row or custom layout.`,children:(0,U.jsx)(Me,{option:Ze[0],onSelectOption:Z,onEditOption:Z,onDeleteOption:Z})}),(0,U.jsx)(M,{title:`Variant actions`,description:`The same variant actions work outside the table.`,children:(0,U.jsx)(Y,{variant:Xe[0],onSelectVariant:Z,onEditVariant:Z,onDuplicateVariant:Z,onDeleteVariant:Z})})]})}function ct(){let e=rt();return(0,U.jsxs)(`div`,{className:`grid w-full gap-4 lg:grid-cols-2`,children:[(0,U.jsx)(Le,{...e.readiness}),(0,U.jsx)(Re,{...e.structure}),(0,U.jsx)(Ne,{...e.operations}),(0,U.jsx)(Ie,{...e.quote}),(0,U.jsx)(Fe,{...e.policies})]})}var Q=`import { useState } from 'react';
+import { Image, Languages, PackageCheck, Tags } from 'lucide-react';
+
+import { Badge } from '@/components/base/badge';
+import { Button } from '@/components/base/buttons';
+import { SmartCard } from '@/components/base/cards';
+import { MetadataList } from '@/components/base/display/metadata';
+import { Heading, Text } from '@/components/typography';
+import {
+	ProductOptionActionMenu,
+	ProductOperationsCard,
+	ProductOptionsSummary,
+	Products,
+	ProductPoliciesCard,
+	ProductQuotePreviewCard,
+	ProductReadinessCard,
+	ProductStructureCard,
+	ProductVariantActionMenu,
+	ProductVariantDetails,
+	ProductVariantEditor,
+	ProductVariantsTable,
+	type ProductChoice,
+	type ProductOptionSummary,
+	type ProductVariantEditorValues,
+	type ProductVariantOptionField,
+	type ProductVariantSummary,
+} from '@/components/features/products';
+import heroUrl from '@/assets/hero.png';
+import { cn } from '@/lib/utils';
+
+const variants: ProductVariantSummary[] = [
+	{
+		id: 'classic',
+		name: 'Classic bottle',
+		description: 'Standard retail pack',
+		options: ['375 ml', 'Classic label'],
+		sku: 'BAL-375-CL',
+		price: 'US$ 18.00',
+		inventory: '82',
+		channels: 'Online store, POS',
+		updatedAt: 'Today',
+		status: 'Active',
+		statusVariant: 'success',
+	},
+	{
+		id: 'gift',
+		name: 'Gift box',
+		description: 'Bottle, pourer, tasting card',
+		options: ['750 ml', 'Gift packaging'],
+		sku: 'BAL-750-GF',
+		price: 'US$ 46.00',
+		inventory: '28',
+		channels: 'Online store',
+		updatedAt: 'Yesterday',
+		status: 'Review',
+		statusVariant: 'warning',
+	},
+	{
+		id: 'case',
+		name: 'Case of six',
+		description: 'Wholesale case pack',
+		options: ['6 x 750 ml', 'Wholesale'],
+		sku: 'BAL-CASE-6',
+		price: 'US$ 132.00',
+		inventory: '14',
+		channels: 'B2B',
+		updatedAt: 'Jun 12',
+		status: 'Active',
+		statusVariant: 'success',
+	},
+];
+
+const options: ProductOptionSummary[] = [
+	{
+		id: 'size',
+		label: 'Size',
+		description: 'Controls bottle volume and variant price.',
+		values: ['375 ml', '750 ml', 'Case of six'],
+		value: '3 values',
+		tone: 'primary',
+	},
+	{
+		id: 'packaging',
+		label: 'Packaging',
+		description: 'Customer-facing presentation options.',
+		values: ['Classic label', 'Gift packaging', 'Wholesale'],
+		value: '3 values',
+		tone: 'neutral',
+	},
+	{
+		id: 'gift-message',
+		label: 'Gift message',
+		description: 'Optional card text collected at checkout.',
+		values: ['None', 'Printed card'],
+		value: 'Optional',
+		tone: 'success',
+	},
+];
+
+const noop = () => {};
+
+const variantStatusOptions: ProductChoice[] = [
+	{ value: 'active', label: 'Active' },
+	{ value: 'review', label: 'Review' },
+	{ value: 'draft', label: 'Draft' },
+];
+
+const variantOptionFields: ProductVariantOptionField[] = [
+	{
+		id: 'size',
+		label: 'Size',
+		choices: [
+			{ value: '375 ml', label: '375 ml' },
+			{ value: '750 ml', label: '750 ml' },
+			{ value: 'Case of six', label: 'Case of six' },
+		],
+	},
+	{
+		id: 'packaging',
+		label: 'Packaging',
+		choices: [
+			{ value: 'Classic label', label: 'Classic label' },
+			{ value: 'Gift packaging', label: 'Gift packaging' },
+			{ value: 'Wholesale', label: 'Wholesale' },
+		],
+	},
+];
+
+const variantEditorValue: ProductVariantEditorValues = {
+	name: 'Classic bottle',
+	description: 'Standard retail pack',
+	sku: 'BAL-375-CL',
+	price: 'US$ 18.00',
+	inventory: '82',
+	status: 'active',
+	channels: 'Online store, POS',
+	options: {
+		size: '375 ml',
+		packaging: 'Classic label',
+	},
+};
+
+function ProductMediaPreview({ frame = 'square' }: { frame?: 'square' | 'wide' }) {
+	return (
+		<div className={cn(
+			'relative overflow-hidden rounded-md border border-border bg-muted',
+			frame === 'square' ? 'aspect-square' : 'aspect-[4/3] max-h-72',
+		)}
+		>
+			<img src={heroUrl} alt="Balsamic tasting set" className="h-full w-full object-cover" />
+			<div className="absolute inset-x-0 bottom-0 bg-background/85 px-3 py-2 backdrop-blur-sm">
+				<Text size="xs" weight="semibold">Primary media</Text>
+				<Text size="xxs" type="secondary">Alt text and gallery remain app-owned.</Text>
+			</div>
+		</div>
+	);
+}
+
+function productOverviewProps() {
+	return {
+		details: {
+			media: <ProductMediaPreview />,
+			metadata: [
+				{ label: 'Status', value: <Badge variant="success">Active</Badge> },
+				{ label: 'Vendor', value: 'Aegean Pantry Co.' },
+				{ label: 'Category', value: 'Food & pantry' },
+				{ label: 'Product type', value: 'Physical good' },
+				{ label: 'Base price', value: 'US$ 18.00' },
+				{ label: 'Tax class', value: 'Standard' },
+			],
+		},
+		contract: {
+			metrics: [
+				{ id: 'margin', label: 'Margin', value: '48%', description: 'After landed cost', tone: 'success' as const },
+				{ id: 'lead-time', label: 'Lead time', value: '3 days', description: 'Warehouse average', tone: 'info' as const },
+				{ id: 'tax', label: 'Tax', value: 'Included', description: 'Shown in checkout', tone: 'neutral' as const },
+			],
+			terms: [
+				{ label: 'Payment', value: 'Due at checkout' },
+				{ label: 'Fulfilment', value: 'Warehouse dispatch' },
+				{ label: 'Cancellation', value: 'Before dispatch' },
+				{ label: 'Availability', value: 'Stock constrained' },
+			],
+			rules: [
+				{ id: 'gross', label: 'Tax included', description: 'Customer quotes show gross pricing.', tone: 'success' as const },
+				{ id: 'b2b', label: 'Wholesale allowed', description: 'Case pack available to the B2B channel.', tone: 'info' as const },
+			],
+		},
+		options: {
+			options,
+			onManageOptions: noop,
+			onCreateOption: noop,
+			onSelectOption: noop,
+			onEditOption: noop,
+			onDeleteOption: noop,
+		},
+		variants: {
+			variants,
+			onCreateVariant: noop,
+			onSelectVariant: noop,
+			onEditVariant: noop,
+			onDuplicateVariant: noop,
+			onDeleteVariant: noop,
+		},
+	};
+}
+
+function railProps() {
+	return {
+		readiness: {
+			score: 86,
+			summary: 'Ready to publish once translation review and replenishment dates are confirmed.',
+			onCreateReadinessItem: noop,
+			onSelectReadinessItem: noop,
+			onEditReadinessItem: noop,
+			onDeleteReadinessItem: noop,
+			items: [
+				{ id: 'copy', label: 'Product copy', description: 'Title, description, SEO summary complete.', completed: true },
+				{ id: 'media', label: 'Media', description: 'Cover image and gallery uploaded.', completed: true },
+				{ id: 'translation', label: 'Translations', description: 'Greek and German copy need review.', value: '2 locales', tone: 'warning' as const },
+				{ id: 'inventory', label: 'Inventory policy', description: 'Restock date still needs supplier confirmation.', value: 'Review', tone: 'warning' as const },
+			],
+		},
+		structure: {
+			onCreateMetric: noop,
+			onSelectMetric: noop,
+			onEditMetric: noop,
+			onDeleteMetric: noop,
+			metrics: [
+				{ id: 'media', label: 'Media', value: '8', description: '1 cover, 7 gallery', tone: 'success' as const, icon: <Image className="size-4" /> },
+				{ id: 'categories', label: 'Collections', value: '3', description: 'Pantry, gifts, tasting', tone: 'info' as const, icon: <Tags className="size-4" /> },
+				{ id: 'locales', label: 'Locales', value: '2 / 4', description: 'EN live, EL review', tone: 'warning' as const, icon: <Languages className="size-4" /> },
+				{ id: 'variants', label: 'Variants', value: '3', description: 'All sellable', tone: 'success' as const, icon: <PackageCheck className="size-4" /> },
+			],
+		},
+		operations: {
+			onCreateOperation: noop,
+			onSelectOperation: noop,
+			onEditOperation: noop,
+			onDeleteOperation: noop,
+			items: [
+				{ id: 'stock', label: 'Stock policy', description: 'Checkout blocked below available inventory.', value: 'Active', tone: 'success' as const },
+				{ id: 'channels', label: 'Sales channels', description: 'Online store, POS, and B2B market enabled.', value: '3', tone: 'info' as const },
+				{ id: 'calendar', label: 'Restock calendar', description: 'Next supplier run pending confirmation.', value: 'Review', tone: 'warning' as const },
+			],
+		},
+		quote: {
+			onCreateLine: noop,
+			onSelectLine: noop,
+			onEditLine: noop,
+			onDeleteLine: noop,
+			lines: [
+				{ id: 'bottle', label: 'Classic bottle', quantity: '2 x US$ 18.00', amount: 'US$ 36.00' },
+				{ id: 'gift', label: 'Gift packaging', quantity: '1 x US$ 5.00', amount: 'US$ 5.00' },
+			],
+			subtotal: 'US$ 41.00',
+			tax: 'Included',
+			total: 'US$ 41.00',
+		},
+		policies: {
+			onCreatePolicy: noop,
+			onSelectPolicy: noop,
+			onEditPolicy: noop,
+			onDeletePolicy: noop,
+			policies: [
+				{ id: 'returns', label: 'Returns', description: 'Unopened goods can be returned within 14 days.', tone: 'success' as const },
+				{ id: 'shipping', label: 'Shipping', description: 'Ambient warehouse dispatch only.', tone: 'neutral' as const },
+			],
+		},
+	};
+}
+
+export function ProductEditor() {
+	const main = productOverviewProps();
+	const rail = railProps();
+
+	return (
+		<div className="w-full rounded-lg border border-border bg-muted/20 p-4">
+			<div className="mb-4 flex flex-col gap-4 border-b border-border pb-4 lg:flex-row lg:items-start lg:justify-between">
+				<div className="min-w-0 space-y-3">
+					<div className="flex flex-wrap items-center gap-2">
+						<Badge variant="success">Active</Badge>
+						<Badge variant="info">3 variants</Badge>
+						<Badge variant="warning">2 review items</Badge>
+					</div>
+					<div>
+						<Heading tag="h2" className="border-none pb-0">Balsamic tasting set</Heading>
+						<Text type="secondary" className="mt-1 max-w-3xl">
+							Shopify-style product editor composed from product details, options, variants, readiness, operations, and quote cards.
+						</Text>
+					</div>
+					<MetadataList
+						layout="horizontal"
+						items={[
+							{ label: 'SKU', value: 'BAL-TASTE-01' },
+							{ label: 'Vendor', value: 'Aegean Pantry Co.' },
+							{ label: 'Market', value: 'US online store' },
+							{ label: 'Updated', value: 'Today' },
+						]}
+						columns={4}
+					/>
+				</div>
+				<div className="flex shrink-0 flex-wrap gap-2">
+					<Button variant="secondary" buttonStyle="outline">Preview</Button>
+					<Button>Save product</Button>
+				</div>
+			</div>
+
+			<Products
+				details={main.details}
+				contract={main.contract}
+				options={main.options}
+				variants={main.variants}
+				readiness={rail.readiness}
+				structure={rail.structure}
+				operations={rail.operations}
+				quote={rail.quote}
+				policies={rail.policies}
+			/>
+		</div>
+	);
+}
+
+export function OptionsAndVariants() {
+	const main = productOverviewProps();
+
+	return (
+		<div className="grid w-full gap-4">
+			<ProductOptionsSummary {...main.options} />
+			<ProductVariantsTable {...main.variants} />
+		</div>
+	);
+}
+
+export function VariantDetailsAndEditor() {
+	const [value, setValue] = useState<ProductVariantEditorValues>(variantEditorValue);
+
+	return (
+		<div className="grid w-full gap-4 xl:grid-cols-[minmax(0,0.9fr)_minmax(0,1.1fr)]">
+			<ProductVariantDetails
+				variant={variants[0]}
+				optionItems={options.slice(0, 2)}
+				media={<ProductMediaPreview frame="wide" />}
+				onBack={noop}
+				onSelectVariant={noop}
+				onEditVariant={noop}
+				onDuplicateVariant={noop}
+				onDeleteVariant={noop}
+				onSelectOption={noop}
+			/>
+			<ProductVariantEditor
+				value={value}
+				optionFields={variantOptionFields}
+				statusOptions={variantStatusOptions}
+				onValueChange={setValue}
+				onSubmit={noop}
+				onCancel={noop}
+				onDelete={noop}
+			/>
+		</div>
+	);
+}
+
+export function StandaloneActionMenus() {
+	return (
+		<div className="grid w-full gap-4 sm:grid-cols-2">
+			<SmartCard
+				title="Option actions"
+				description="The menu can be used next to any option row or custom layout."
+			>
+				<ProductOptionActionMenu
+					option={options[0]}
+					onSelectOption={noop}
+					onEditOption={noop}
+					onDeleteOption={noop}
+				/>
+			</SmartCard>
+			<SmartCard
+				title="Variant actions"
+				description="The same variant actions work outside the table."
+			>
+				<ProductVariantActionMenu
+					variant={variants[0]}
+					onSelectVariant={noop}
+					onEditVariant={noop}
+					onDuplicateVariant={noop}
+					onDeleteVariant={noop}
+				/>
+			</SmartCard>
+		</div>
+	);
+}
+
+export function ProductSupportRail() {
+	const rail = railProps();
+
+	return (
+		<div className="grid w-full gap-4 lg:grid-cols-2">
+			<ProductReadinessCard {...rail.readiness} />
+			<ProductStructureCard {...rail.structure} />
+			<ProductOperationsCard {...rail.operations} />
+			<ProductQuotePreviewCard {...rail.quote} />
+			<ProductPoliciesCard {...rail.policies} />
+		</div>
+	);
+}
+`;function lt(e){let t={h4:`h4`,...e.components};return Ye||$(`Examples`,!1),at||$(`Examples.OptionsAndVariants`,!0),it||$(`Examples.ProductEditor`,!0),ct||$(`Examples.ProductSupportRail`,!0),st||$(`Examples.StandaloneActionMenus`,!0),ot||$(`Examples.VariantDetailsAndEditor`,!0),(0,U.jsxs)(r,{title:`Features · Products`,description:`Shopify-style product editor surfaces built from standalone product feature components. Routing, forms, and persistence stay consumer-owned.`,layer:`features`,status:`ready`,sourcePath:`src/components/features/products`,children:[(0,U.jsx)(i,{title:`Full editor`,id:`full-editor`,children:(0,U.jsx)(u,{name:`ProductEditor`,source:Q,children:(0,U.jsx)(it,{})})}),(0,U.jsxs)(i,{title:`Options and variants`,id:`options-variants`,children:[(0,U.jsx)(u,{name:`OptionsAndVariants`,source:Q,children:(0,U.jsx)(at,{})}),(0,U.jsx)(u,{name:`VariantDetailsAndEditor`,source:Q,children:(0,U.jsx)(ot,{})})]}),(0,U.jsx)(i,{title:`Action menus`,id:`action-menus`,children:(0,U.jsx)(u,{name:`StandaloneActionMenus`,source:Q,children:(0,U.jsx)(st,{})})}),(0,U.jsx)(i,{title:`Support rail`,id:`support-rail`,children:(0,U.jsx)(u,{name:`ProductSupportRail`,source:Q,children:(0,U.jsx)(ct,{})})}),(0,U.jsxs)(i,{title:`API`,id:`api`,children:[(0,U.jsx)(t.h4,{children:`ProductOverview`}),(0,U.jsx)(j,{component:`ProductOverview`}),(0,U.jsx)(t.h4,{children:`Products`}),(0,U.jsx)(j,{component:`Products`}),(0,U.jsx)(t.h4,{children:`ProductDetailsCard`}),(0,U.jsx)(j,{component:`ProductDetailsCard`}),(0,U.jsx)(t.h4,{children:`ProductReadinessCard`}),(0,U.jsx)(j,{component:`ProductReadinessCard`}),(0,U.jsx)(t.h4,{children:`ProductStructureCard`}),(0,U.jsx)(j,{component:`ProductStructureCard`}),(0,U.jsx)(t.h4,{children:`ProductOperationsCard`}),(0,U.jsx)(j,{component:`ProductOperationsCard`}),(0,U.jsx)(t.h4,{children:`ProductContractOverview`}),(0,U.jsx)(j,{component:`ProductContractOverview`}),(0,U.jsx)(t.h4,{children:`ProductOptionsSummary`}),(0,U.jsx)(j,{component:`ProductOptionsSummary`}),(0,U.jsx)(t.h4,{children:`ProductOptionActionMenu`}),(0,U.jsx)(j,{component:`ProductOptionActionMenu`}),(0,U.jsx)(t.h4,{children:`ProductQuotePreviewCard`}),(0,U.jsx)(j,{component:`ProductQuotePreviewCard`}),(0,U.jsx)(t.h4,{children:`ProductPoliciesCard`}),(0,U.jsx)(j,{component:`ProductPoliciesCard`}),(0,U.jsx)(t.h4,{children:`ProductVariantsTable`}),(0,U.jsx)(j,{component:`ProductVariantsTable`}),(0,U.jsx)(t.h4,{children:`ProductVariantActionMenu`}),(0,U.jsx)(j,{component:`ProductVariantActionMenu`}),(0,U.jsx)(t.h4,{children:`ProductVariantDetails`}),(0,U.jsx)(j,{component:`ProductVariantDetails`}),(0,U.jsx)(t.h4,{children:`ProductVariantEditor`}),(0,U.jsx)(j,{component:`ProductVariantEditor`})]})]})}function ut(e={}){let{wrapper:t}=e.components||{};return t?(0,U.jsx)(t,{...e,children:(0,U.jsx)(lt,{...e})}):lt(e)}function $(e,t){throw Error(`Expected `+(t?`component`:`object`)+" `"+e+"` to be defined: you likely forgot to import, pass, or provide it.")}export{ut as default};

package/dist/showcase/assets/progress-C61sf-qt.js

@@ -0,0 +1 @@
+import{r as e}from"./chunk-QTnfLwEv.js";import{n as t}from"./react-dom-Bz4cALsF.js";import{Wt as n,Yt as r,fr as i,nr as a}from"./example-CTJ8AdNR.js";import{n as o,s}from"./index-DaYVSqKu.js";import{r as c,t as l}from"./valueToPercent-gleKSaFe.js";var u=e(t(),1),d=u.createContext(void 0);function f(){let e=u.useContext(d);if(e===void 0)throw Error(i(51));return e}var p=function(e){return e.complete=`data-complete`,e.indeterminate=`data-indeterminate`,e.progressing=`data-progressing`,e}({}),m={status(e){return e===`progressing`?{[p.progressing]:``}:e===`complete`?{[p.complete]:``}:e===`indeterminate`?{[p.indeterminate]:``}:null}},h=s();function g(e,t){return t==null?`indeterminate progress`:e||`${t}%`}var _=u.forwardRef(function(e,t){let{format:i,getAriaValueText:o=g,locale:s,max:l=100,min:f=0,value:p,render:_,className:v,children:y,style:b,...x}=e,[S,C]=u.useState(),w=r(i),T=`indeterminate`;Number.isFinite(p)&&(T=p===l?`complete`:`progressing`);let E=c(p,s,w.current),D=u.useMemo(()=>({status:T}),[T]),O={"aria-labelledby":S,"aria-valuemax":l,"aria-valuemin":f,"aria-valuenow":p??void 0,"aria-valuetext":o(E,p),role:`progressbar`,children:(0,h.jsxs)(u.Fragment,{children:[y,(0,h.jsx)(`span`,{role:`presentation`,style:n,children:`x`})]})},k=u.useMemo(()=>({formattedValue:E,max:l,min:f,setLabelId:C,state:D,status:T,value:p}),[E,l,f,C,D,T,p]),A=a(`div`,e,{state:D,ref:t,props:[O,x],stateAttributesMapping:m});return(0,h.jsx)(d.Provider,{value:k,children:A})}),v=u.forwardRef(function(e,t){let{render:n,className:r,style:i,...o}=e,{state:s}=f();return a(`div`,e,{state:s,ref:t,props:o,stateAttributesMapping:m})}),y=u.forwardRef(function(e,t){let{render:n,className:r,style:i,...o}=e,{max:s,min:c,value:u,state:d}=f(),p=Number.isFinite(u)&&u!==null?l(u,c,s):null;return a(`div`,e,{state:d,ref:t,props:[{style:p==null?{}:{insetInlineStart:0,height:`inherit`,width:`${p}%`}},o],stateAttributesMapping:m})});function b({className:e,children:t,value:n,...r}){return(0,h.jsxs)(_,{value:n,"data-slot":`progress`,className:o(`flex flex-wrap gap-3`,e),...r,children:[t,(0,h.jsx)(x,{children:(0,h.jsx)(S,{})})]})}function x({className:e,...t}){return(0,h.jsx)(v,{className:o(`bg-muted h-1.5 rounded-full relative flex w-full items-center overflow-x-hidden`,e),"data-slot":`progress-track`,...t})}function S({className:e,...t}){return(0,h.jsx)(y,{"data-slot":`progress-indicator`,className:o(`bg-primary h-full transition-all`,e),...t})}export{b as t};

package/dist/showcase/assets/progress-PvTl8Fgf.js

@@ -0,0 +1,18 @@
+import{n as e}from"./chunk-QTnfLwEv.js";import{Dr as t,Er as n,t as r}from"./example-CTJ8AdNR.js";import{s as i}from"./index-DaYVSqKu.js";import{t as a}from"./progress-C61sf-qt.js";import{t as o}from"./PreviewLayout-nADJqRlP.js";var s=e({Values:()=>l}),c=i();function l(){return(0,c.jsx)(c.Fragment,{children:(0,c.jsx)(o,{children:[0,25,50,75,100].map(e=>(0,c.jsxs)(`div`,{className:`space-y-1`,children:[(0,c.jsxs)(`div`,{className:`text-xs text-muted-foreground`,children:[e,`%`]}),(0,c.jsx)(a,{value:e})]},e))})})}var u=`import { Progress } from '@/components/ui/progress';
+import { Col } from '../../PreviewLayout';
+
+export function Values() {
+	return (
+		<>
+			<Col>
+								{[0, 25, 50, 75, 100].map((v) => (
+									<div key={v} className="space-y-1">
+										<div className="text-xs text-muted-foreground">{v}%</div>
+										<Progress value={v} />
+									</div>
+								))}
+							</Col>
+		</>
+	);
+}
+`;function d(e){return s||p(`Examples`,!1),l||p(`Examples.Values`,!0),(0,c.jsx)(t,{title:`UI · Progress`,description:`Linear progress bar at varying values.`,layer:`ui`,status:`ready`,children:(0,c.jsx)(n,{title:`Examples`,id:`examples`,children:(0,c.jsx)(r,{name:`Values`,source:u,children:(0,c.jsx)(l,{})})})})}function f(e={}){let{wrapper:t}=e.components||{};return t?(0,c.jsx)(t,{...e,children:(0,c.jsx)(d,{...e})}):d(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{f as default};

package/dist/showcase/assets/props-table-C8la6vcG.js

@@ -0,0 +1 @@
+import{r as e}from"./chunk-QTnfLwEv.js";import{n as t}from"./react-dom-Bz4cALsF.js";import{Ar as n,Or as r,Rr as i,kr as a}from"./example-CTJ8AdNR.js";import{n as o,s}from"./index-DaYVSqKu.js";var c=e(t(),1),l=``+new URL(`props.generated-vFrhDrth.json`,import.meta.url).href,u=s(),d=null;function f(){return d||=fetch(l).then(async e=>{if(!e.ok)throw Error(`Unable to load props metadata: ${e.status}`);return e.json()}),d}function p({component:e,className:t}){let[s,l]=(0,c.useState)(null),[d,p]=(0,c.useState)(null),{register:m}=n(),h=r(`api`,e),g=a(e,{stripExampleSuffix:!1});if((0,c.useEffect)(()=>{m({id:h,title:g,level:2})},[m,h,g]),(0,c.useEffect)(()=>{let e=!0;return f().then(t=>{e&&l(t)}).catch(t=>{e&&p(t instanceof Error?t:Error(String(t)))}),()=>{e=!1}},[]),d)return(0,u.jsx)(`div`,{id:h,className:o(`props-table--component scroll-mt-24 rounded-md border border-warning/30 bg-warning/5 p-3`,t),children:(0,u.jsx)(i,{size:`xs`,type:`secondary`,children:d.message})});if(!s)return(0,u.jsx)(i,{id:h,size:`xs`,type:`secondary`,className:o(`props-table--component scroll-mt-24`,t),children:`Loading props metadata...`});let _=s[e];if(!_)return(0,u.jsx)(`div`,{id:h,className:o(`props-table--component scroll-mt-24 rounded-md border border-warning/30 bg-warning/5 p-3`,t),children:(0,u.jsxs)(i,{size:`xs`,type:`secondary`,children:[`No props metadata for `,(0,u.jsx)(`code`,{className:`font-mono`,children:e}),`. Run`,` `,(0,u.jsx)(`code`,{className:`font-mono`,children:`npm run docs:generate-props`}),`.`]})});let v=Object.values(_.props).sort((e,t)=>e.required&&!t.required?-1:!e.required&&t.required?1:e.name.localeCompare(t.name));return v.length===0?(0,u.jsx)(i,{id:h,size:`xs`,type:`secondary`,className:o(`props-table--component scroll-mt-24`,t),children:`This component has no documented props.`}):(0,u.jsx)(`div`,{id:h,className:o(`props-table--component scroll-mt-24 overflow-x-auto rounded-md border border-border`,t),children:(0,u.jsxs)(`table`,{className:`w-full table-fixed border-collapse text-xs`,children:[(0,u.jsxs)(`colgroup`,{children:[(0,u.jsx)(`col`,{className:`w-[22%] sm:w-[18%]`}),(0,u.jsx)(`col`,{className:`w-[36%] sm:w-[42%]`}),(0,u.jsx)(`col`,{className:`w-[20%] sm:w-[16%]`}),(0,u.jsx)(`col`,{className:`w-[22%] sm:w-[24%]`})]}),(0,u.jsx)(`thead`,{className:`props-table--head bg-muted/40 text-left`,children:(0,u.jsxs)(`tr`,{children:[(0,u.jsx)(`th`,{className:`px-3 py-2 font-semibold`,children:`Prop`}),(0,u.jsx)(`th`,{className:`px-3 py-2 font-semibold`,children:`Type`}),(0,u.jsx)(`th`,{className:`px-3 py-2 font-semibold`,children:`Default`}),(0,u.jsx)(`th`,{className:`px-3 py-2 font-semibold`,children:`Description`})]})}),(0,u.jsx)(`tbody`,{className:`props-table--body`,children:v.map(e=>(0,u.jsxs)(`tr`,{className:`border-t border-border align-top`,children:[(0,u.jsxs)(`td`,{className:`break-words px-3 py-2 font-mono`,children:[e.name,e.required&&(0,u.jsx)(`span`,{className:`ml-0.5 text-destructive`,children:`*`})]}),(0,u.jsx)(`td`,{className:`break-words px-3 py-2 font-mono text-muted-foreground`,children:e.type}),(0,u.jsx)(`td`,{className:`break-words px-3 py-2 font-mono text-muted-foreground`,children:e.defaultValue??`—`}),(0,u.jsx)(`td`,{className:`break-words px-3 py-2 text-muted-foreground`,children:e.description||`—`})]},e.name))})]})})}export{p as t};