@contractspec/lib.design-system 4.2.0 → 4.3.0

package/README.md

@@ -191,6 +191,92 @@ and keeps native rendering aligned for query, selected options, loading, error,
 and empty states. FormSpec renderers pass resolver-backed async state through
 these props without requiring product surfaces to know the underlying transport.
 
+### Compose application shells
+
+Use the shell subpath for app frames that need sidebar navigation, topbar
+breadcrumbs, command search, account actions, and a right-side page outline.
+The same typed shell contract has web and native entrypoints.
+
+```tsx
+import { AppShell } from "@contractspec/lib.design-system/shell";
+
+<AppShell
+  title="Workspace"
+  commands={[
+    {
+      heading: "Actions",
+      items: [{ id: "new-project", label: "New project" }],
+    },
+  ]}
+  navigation={[
+    {
+      title: "Main",
+      items: [
+        {
+          label: "Projects",
+          href: "/projects",
+          children: [{ label: "Active", href: "/projects/active" }],
+        },
+      ],
+    },
+  ]}
+  breadcrumbs={[{ href: "/", label: "Home" }, { label: "Projects" }]}
+  pageOutline={[
+    { id: "summary", label: "Summary" },
+    { id: "details", label: "Details", level: 2 },
+    { id: "audit", label: "Audit trail", level: 3 },
+  ]}
+>
+  {children}
+</AppShell>;
+```
+
+On desktop web, `AppShell` renders a sidebar, sticky topbar, content region, and
+optional `PageOutline` rail. On small web screens, navigation and page outline
+move behind accessible menu triggers. On native, the shell maps primary
+navigation to bottom tabs and keeps overflow navigation, actions, user content,
+and page outline inside the menu sheet.
+
+### Render actionable object references
+
+Use `ObjectReferenceHandler` when product surfaces render references that usually
+need quick interaction, such as addresses, phone numbers, users, customers,
+files, URLs, or tenant-specific objects.
+
+```tsx
+import {
+  ObjectReferenceHandler,
+  createMapsReferenceActions,
+} from "@contractspec/lib.design-system";
+
+const address = {
+  id: "customer-site",
+  kind: "address",
+  label: "10 Downing Street",
+  value: "10 Downing Street, London",
+} as const;
+
+<ObjectReferenceHandler
+  reference={address}
+  interactivityVisibility="icon"
+  actions={createMapsReferenceActions(address)}
+  openHref={(href) => window.open(href, "_blank", "noopener,noreferrer")}
+/>;
+```
+
+The descriptor and action descriptor types are intentionally data-only:
+`id`, `kind`, `label`, `value`, `href`, `metadata`, and optional `iconKey`.
+Runtime behavior belongs in props such as `actionHandlers`, `copyHandler`,
+`openHref`, `renderTrigger`, `renderDetail`, `renderAction`, and
+`iconRenderer`. This keeps the surface compatible with future declarative
+ContractSpec schema work without making React callbacks part of the descriptor
+contract.
+
+Web renders the interaction surface with the existing sheet primitives. Native
+exports the same prop contract through the focused object-reference subpath and
+uses a disclosure-style fallback until `@contractspec/lib.ui-kit` provides a
+real native sheet primitive.
+
 ### Render forms on mobile through the shared renderer
 
 Use the focused shared renderer subpath when rendering `FormSpec` contracts in
@@ -287,6 +373,15 @@ export function AccountHealthTable() {
 `DataTable` remains the composed card/container surface. `DataTableToolbar` is
 the recommended ergonomic layer for search, chips, selection summary, and
 hidden-column recovery without widening the primitive table API.
+DataView-driven tables also honor field and column overflow hints from
+`DataViewSpec`: column hints override field hints, markdown wraps by default,
+compact scalar formats truncate, `expand` adds detail to the row expansion
+surface, and `hideColumn` starts hidden when column visibility is enabled.
+Collection `DataViewSpec` contracts can also declare `view.collection` defaults
+for list/grid/table mode switching, toolbar controls, query page size, and
+density. `DataViewRenderer` uses those defaults for web and native renderers
+while keeping caller props authoritative through `viewMode`, `density`,
+`onViewModeChange`, and `onDensityChange`.
 
 ## API map
 

package/dist/browser/components/data-view/DataViewGrid.js

@@ -0,0 +1 @@
+import{jsx as r}from"react/jsx-runtime";import{cn as m}from"../../lib/utils";import{DataViewList as p}from"./DataViewList";export function DataViewGrid({spec:e,items:o,className:a,renderActions:c,onSelect:n,emptyState:s,density:t="comfortable"}){if(e.view.kind!=="grid")throw Error(`DataViewGrid received view kind "${e.view.kind}", expected "grid".`);const i=e.view,d=i.columns??3,l={...e,view:{kind:"list",layout:"card",fields:i.fields,primaryField:i.primaryField,secondaryFields:i.secondaryFields,filters:i.filters,filterScope:i.filterScope,actions:i.actions,collection:i.collection}};return r("div",{className:m("grid w-full gap-4",t==="compact"&&"gap-3",w(d),a),children:r(p,{spec:l,items:o,className:"contents",renderActions:c,onSelect:n,emptyState:s,density:t})})}function w(e){if(e<=1)return"grid-cols-1";if(e===2)return"md:grid-cols-2";if(e===4)return"md:grid-cols-2 xl:grid-cols-4";return"md:grid-cols-2 lg:grid-cols-3"}

package/dist/browser/components/data-view/DataViewList.js

@@ -1 +1 @@
-import{jsx as t,jsxs as m}from"react/jsx-runtime";import{resolveTranslationString as w,useDesignSystemTranslation as k}from"../../i18n/translation";import{cn as c}from"../../lib/utils";import{DisplayValue as f}from"./DataViewTable";export function DataViewList({spec:e,items:r,className:i,renderActions:d,onSelect:u,emptyState:g}){const v=k();if(e.view.kind!=="list")throw Error(`DataViewList received view kind "${e.view.kind}", expected "list".`);const n=e.view,o=n.fields,l=n.primaryField??o.find((a)=>a.key===n.primaryField)?.key??o[0]?.key;if(!r.length)return t("div",{className:c("flex w-full flex-col gap-4",i),children:g??t("div",{className:"rounded-md border border-muted-foreground/40 border-dashed p-8 text-center text-muted-foreground text-sm",children:"No records available."})});return t("div",{className:c("flex w-full flex-col gap-4",i),children:r.map((a,b)=>{const p=y(a);return m("button",{type:"button",className:c("flex w-full flex-col gap-2 rounded-lg border border-muted bg-card p-4 text-left shadow-sm transition hover:border-primary/40 hover:shadow-md focus-visible:border-primary focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40",n.layout==="compact"&&"md:flex-row md:items-center md:gap-4"),onClick:()=>u?.(a),children:[m("div",{className:"flex flex-1 flex-col gap-1",children:[l?t("span",{className:"font-medium text-base text-foreground",children:t(f,{item:p,fields:o,fieldKey:l})}):null,t("div",{className:"flex flex-wrap gap-x-4 gap-y-1 text-muted-foreground text-sm",children:D(n,l).map((s)=>m("span",{className:"flex items-center gap-1.5",children:[t("span",{className:"font-medium text-foreground/80",children:x(o,s,v)}),t("span",{children:t(f,{item:p,fields:o,fieldKey:s})})]},s))})]}),d?t("div",{className:"flex shrink-0 items-center gap-2",children:d(a)}):null]},b)})})}function y(e){if(e&&typeof e==="object")return e;return{}}function x(e,r,i){return w(e.find((d)=>d.key===r)?.label??r,i)}function D(e,r){if(e.secondaryFields?.length)return e.secondaryFields;return e.fields.map((i)=>i.key).filter((i)=>i!==r)}
+import{jsx as t,jsxs as m}from"react/jsx-runtime";import{resolveTranslationString as y,useDesignSystemTranslation as D}from"../../i18n/translation";import{cn as c}from"../../lib/utils";import{DisplayValue as u}from"./DataViewTable";export function DataViewList({spec:e,items:r,className:i,renderActions:d,onSelect:g,emptyState:v,density:p="comfortable"}){const b=D();if(e.view.kind!=="list")throw Error(`DataViewList received view kind "${e.view.kind}", expected "list".`);const n=e.view,a=n.fields,l=n.primaryField??a.find((o)=>o.key===n.primaryField)?.key??a[0]?.key;if(!r.length)return t("div",{className:c("flex w-full flex-col gap-4",i),children:v??t("div",{className:"rounded-md border border-muted-foreground/40 border-dashed p-8 text-center text-muted-foreground text-sm",children:"No records available."})});return t("div",{className:c("flex w-full flex-col",p==="compact"?"gap-2":"gap-4",i),children:r.map((o,w)=>{const f=k(o);return m("button",{type:"button",className:c("flex w-full flex-col gap-2 rounded-lg border border-muted bg-card p-4 text-left shadow-sm transition hover:border-primary/40 hover:shadow-md focus-visible:border-primary focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40",p==="compact"&&"p-3",n.layout==="compact"&&"md:flex-row md:items-center md:gap-4"),onClick:()=>g?.(o),children:[m("div",{className:"flex flex-1 flex-col gap-1",children:[l?t("span",{className:"font-medium text-base text-foreground",children:t(u,{item:f,fields:a,fieldKey:l})}):null,t("div",{className:"flex flex-wrap gap-x-4 gap-y-1 text-muted-foreground text-sm",children:x(n,l).map((s)=>m("span",{className:"flex items-center gap-1.5",children:[t("span",{className:"font-medium text-foreground/80",children:V(a,s,b)}),t("span",{children:t(u,{item:f,fields:a,fieldKey:s})})]},s))})]}),d?t("div",{className:"flex shrink-0 items-center gap-2",children:d(o)}):null]},w)})})}function k(e){if(e&&typeof e==="object")return e;return{}}function V(e,r,i){return y(e.find((d)=>d.key===r)?.label??r,i)}function x(e,r){if(e.secondaryFields?.length)return e.secondaryFields;return e.fields.map((i)=>i.key).filter((i)=>i!==r)}

package/dist/browser/components/data-view/DataViewRenderer.js

@@ -1 +1 @@
-import{jsx as J,jsxs as c,Fragment as p}from"react/jsx-runtime";import{resolveDataViewFilters as S}from"@contractspec/lib.contracts-spec/data-views";import{Pagination as d}from"@contractspec/lib.ui-kit-web/ui/atoms/Pagination";import{VStack as h}from"@contractspec/lib.ui-kit-web/ui/stack";import{Text as f}from"@contractspec/lib.ui-kit-web/ui/text";import*as L from"react";import{resolveTranslationString as V,useDesignSystemTranslation as u}from"../../i18n/translation";import{FiltersToolbar as m}from"../molecules/FiltersToolbar";import{DataViewDetail as v}from"./DataViewDetail";import{DataViewList as b}from"./DataViewList";import{DataViewTable as y}from"./DataViewTable";export function DataViewRenderer({spec:B,items:G=[],item:X=null,className:M,renderActions:$,onSelect:q,onRowClick:P,toolbar:R,loading:T,headerActions:Y,emptyState:Q,footer:j,search:w,onSearchChange:_,filters:I,onFilterChange:Z,pagination:K,onPageChange:D}){const z=u(),O=L.useMemo(()=>S({filters:B.view.filters,scope:B.view.filterScope,user:g(I)}),[I,B.view.filterScope,B.view.filters]),N=L.useMemo(()=>{if(B.view.filterScope){const E=Object.entries(O.user).map(([H,W])=>({key:H,label:`${A(B,H)}: ${F(W)}`,onRemove:()=>{const{[H]:r,...C}=O.user;Z?.(C)}})),U=O.lockedChips==="hidden"?[]:Object.entries(O.locked).map(([H,W])=>({key:`locked-${H}`,label:`${A(B,H)}: ${F(W)}`,disabled:!0}));return[...E,...U]}return I?Object.entries(I).map(([E,U])=>({key:E,label:`${E}: ${String(U)}`,onRemove:()=>{const{[E]:H,...W}=I;Z?.(W)}})):[]},[I,Z,O,B]),k=B.view.filterScope?Object.keys(O.user).length>0:Boolean(I&&Object.keys(I).length>0),x=L.useMemo(()=>{switch(B.view.kind){case"list":return J(b,{spec:B,items:G,className:M,renderActions:$,onSelect:q,emptyState:Q});case"table":return J(y,{spec:B,items:G,className:M,onRowClick:P,toolbar:R,loading:T,emptyState:Q,headerActions:Y,footer:j});case"detail":return J(v,{spec:B,item:X,className:M,emptyState:Q,headerActions:Y});case"grid":{const E=B.view,U={kind:"list",layout:"card",fields:E.fields,filters:E.filters,actions:E.actions,primaryField:E.primaryField,secondaryFields:E.secondaryFields,filterScope:E.filterScope},H={...B,view:U};return J(b,{spec:H,items:G,className:M,renderActions:$,onSelect:q,emptyState:Q})}default:return J(f,{className:M,children:V("Unsupported data view kind",z)})}},[B,G,X,M,$,q,P,R,T,Y,Q,j,z]);if(!(B.view.kind==="list"||B.view.kind==="table"||B.view.kind==="grid"))return J(p,{children:x});return c(h,{gap:"lg",children:[(B.view.filters?.length||_||N.length)&&J(m,{searchValue:w,onSearchChange:_,searchPlaceholder:V("Search...",z)??"Search...",activeChips:N,onClearAll:k?()=>Z?.({}):void 0,right:B.view.kind==="table"?void 0:Y}),x,K&&K.total>0&&J(d,{currentPage:K.page,totalPages:Math.ceil(K.total/K.pageSize),totalItems:K.total,itemsPerPage:K.pageSize,onPageChange:(E)=>D?.(E),onItemsPerPageChange:(E)=>{D?.(1)},showItemsPerPage:!1})]})}function g(B){if(!B)return;return Object.fromEntries(Object.entries(B??{}).filter((G)=>Boolean(G[1]&&typeof G[1]==="object"&&"kind"in G[1]&&typeof G[1].kind==="string")))}function A(B,G){return B.view.filters?.find((X)=>X.key===G)?.label??G}function F(B){if(!B)return"";if(B.kind==="single")return String(B.value);if(B.kind==="multi")return B.values.map(String).join(", ");if(B.kind==="range")return[B.from==null?"":String(B.from),B.to==null?"":String(B.to)].filter(Boolean).join(" - ");return`${B.mode}(${B.clauses.length})`}
+import{jsx as W,jsxs as T,Fragment as hB}from"react/jsx-runtime";import{resolveDataViewFilters as GB}from"@contractspec/lib.contracts-spec/data-views";import{Pagination as qB}from"@contractspec/lib.ui-kit-web/ui/atoms/Pagination";import{VStack as KB}from"@contractspec/lib.ui-kit-web/ui/stack";import{Text as LB}from"@contractspec/lib.ui-kit-web/ui/text";import{Grid3X3 as IB,List as PB,Table2 as EB}from"lucide-react";import*as I from"react";import{resolveTranslationString as n,useDesignSystemTranslation as NB}from"../../i18n/translation";import{Button as V}from"../atoms/Button";import{Input as b}from"../atoms/Input";import{FiltersToolbar as RB}from"../molecules/FiltersToolbar";import{getDataViewCollectionConfig as TB,getDataViewCollectionViewModesConfig as AB,isDataViewCollectionKind as i,resolveAllowedCollectionModes as _B,resolveCollectionDensity as jB,resolveCollectionView as MB}from"./collection";import{DataViewDetail as VB}from"./DataViewDetail";import{DataViewGrid as kB}from"./DataViewGrid";import{DataViewList as SB}from"./DataViewList";import{DataViewTable as DB}from"./DataViewTable";export function DataViewRenderer({spec:B,items:H=[],item:O=null,className:U,renderActions:J,onSelect:Y,onRowClick:Z,toolbar:A,loading:q,headerActions:X,emptyState:E,footer:w,viewMode:F,defaultViewMode:C,onViewModeChange:HB,density:h,defaultDensity:g,onDensityChange:JB,search:OB,onSearchChange:y,filters:z,onFilterChange:N,pagination:K,onPageChange:p}){const k=NB(),S=I.useMemo(()=>_B(B.view),[B.view]),[QB,UB]=I.useState(C),u=F??QB??C,_=I.useMemo(()=>MB(B,u),[u,B]),[WB,YB]=I.useState(g),P=jB(B,{density:h??WB,defaultDensity:g}),ZB=TB(B.view),$B=AB(B.view),$=ZB?.toolbar,j=$?.enabled!==!1,v=$?.filters!==!1,M=$?.actions??"end",d=M==="start"||M==="both"?X:void 0,f=M==="end"||M==="both"?X:void 0,c=typeof $?.search==="object"?$.search:void 0,r=Boolean(j&&$?.search!==!1&&y),G=I.useMemo(()=>GB({filters:B.view.filters,scope:B.view.filterScope,user:bB(z)}),[z,B.view.filterScope,B.view.filters]),o=I.useMemo(()=>{if(B.view.filterScope){const Q=Object.entries(G.user).map(([L,R])=>({key:L,label:`${a(B,L)}: ${l(R)}`,onRemove:()=>{const{[L]:yB,...zB}=G.user;N?.(zB)}})),D=G.lockedChips==="hidden"?[]:Object.entries(G.locked).map(([L,R])=>({key:`locked-${L}`,label:`${a(B,L)}: ${l(R)}`,disabled:!0}));return[...Q,...D]}return z?Object.entries(z).map(([Q,D])=>({key:Q,label:`${Q}: ${String(D)}`,onRemove:()=>{const{[Q]:L,...R}=z;N?.(R)}})):[]},[z,N,G,B]),XB=B.view.filterScope?Object.keys(G.user).length>0:Boolean(z&&Object.keys(z).length>0),s=I.useMemo(()=>{const Q=i(B.view.kind)?_.spec:B;switch(Q.view.kind){case"list":return W(SB,{spec:Q,items:H,className:U,renderActions:J,onSelect:Y,emptyState:E,density:P});case"table":return W(DB,{spec:Q,items:H,className:U,onRowClick:Z,toolbar:A,loading:q,emptyState:E,headerActions:j?void 0:X,footer:w,density:P});case"detail":return W(VB,{spec:B,item:O,className:U,emptyState:E,headerActions:X});case"grid":return W(kB,{spec:Q,items:H,className:U,renderActions:J,onSelect:Y,emptyState:E,density:P});default:return W(LB,{className:U,children:n("Unsupported data view kind",k)})}},[B,_.spec,H,O,U,J,Y,Z,A,q,X,E,w,P,j,k]);if(!(B.view.kind==="list"||B.view.kind==="table"||B.view.kind==="grid"))return W(hB,{children:s});return T(KB,{gap:"lg",children:[j&&(v&&B.view.filters?.length||r||o.length||S.length>1||$?.density||d||f)?T(RB,{searchValue:OB,onSearchChange:r?y:void 0,searchPlaceholder:c?.placeholder??n("Search...",k)??"Search...",debounceMs:c?.debounceMs,activeChips:o,onClearAll:XB?()=>N?.({}):void 0,right:f,children:[d,S.length>1&&$?.viewMode!==!1?W(wB,{mode:_.mode,allowedModes:S,labels:i(B.view.kind)?$B?.labels:void 0,onChange:(Q)=>{if(Q===_.mode)return;if(F===void 0)UB(Q);HB?.(Q)}}):null,$?.density?W(FB,{density:P,onChange:(Q)=>{if(Q===P)return;if(h===void 0)YB(Q);JB?.(Q)}}):null,v?W(xB,{filters:B.view.filters,values:G.user,lockedKeys:Object.keys(G.locked),onFilterChange:N}):null]}):null,s,K&&K.total>0&&W(qB,{currentPage:K.page,totalPages:Math.ceil(K.total/K.pageSize),totalItems:K.total,itemsPerPage:K.pageSize,onPageChange:(Q)=>p?.(Q),onItemsPerPageChange:(Q)=>{p?.(1)},showItemsPerPage:!1})]})}function bB(B){if(!B)return;return Object.fromEntries(Object.entries(B??{}).filter((H)=>Boolean(H[1]&&typeof H[1]==="object"&&"kind"in H[1]&&typeof H[1].kind==="string")))}function a(B,H){return B.view.filters?.find((O)=>O.key===H)?.label??H}function l(B){if(!B)return"";if(B.kind==="single")return String(B.value);if(B.kind==="multi")return B.values.map(String).join(", ");if(B.kind==="range")return[B.from==null?"":String(B.from),B.to==null?"":String(B.to)].filter(Boolean).join(" - ");return`${B.mode}(${B.clauses.length})`}function xB({filters:B,values:H,lockedKeys:O,onFilterChange:U}){if(!B?.length||!U)return null;const J=new Set(O),Y=B.filter((Z)=>Z.type!=="search"&&!J.has(Z.key));if(Y.length===0)return null;return W("div",{className:"flex flex-wrap items-center gap-2",children:Y.map((Z)=>W(mB,{filter:Z,value:H[Z.key],values:H,onFilterChange:U},Z.key))})}function mB({filter:B,value:H,values:O,onFilterChange:U}){if(B.type==="boolean"){const J=H?.kind==="single"?H.value===!0:void 0;return T(V,{size:"sm",variant:"outline",onPress:()=>t(O,B.key,J===void 0?!0:!J,U),children:[B.label,": ",J?"Oui":"Non"]})}if(B.valueMode==="range"){const J=H?.kind==="range"?H:void 0;return T("div",{className:"flex min-w-0 items-center gap-2",children:[W(b,{type:x(B),inputMode:m(B),value:J?.from==null?"":String(J.from),onChange:(Y)=>e(O,B,"from",Y.currentTarget.value,U),placeholder:`${B.label} min`,className:"h-9 w-28"}),W(b,{type:x(B),inputMode:m(B),value:J?.to==null?"":String(J.to),onChange:(Y)=>e(O,B,"to",Y.currentTarget.value,U),placeholder:`${B.label} max`,className:"h-9 w-28"})]})}return W(b,{type:x(B),inputMode:m(B),value:H?.kind==="single"?String(H.value):"",onChange:(J)=>t(O,B.key,BB(B,J.currentTarget.value),U),placeholder:B.label,className:"h-9 w-36"})}function t(B,H,O,U){const J={...B};if(O===void 0||O==="")delete J[H];else J[H]={kind:"single",value:O};U(J)}function e(B,H,O,U,J){const Y=B[H.key],Z=Y?.kind==="range"?Y:{},A=BB(H,U),q={...Z,[O]:A};if(q.from==null&&q.to==null){const X={...B};delete X[H.key];J(X);return}J({...B,[H.key]:{kind:"range",from:q.from,to:q.to}})}function BB(B,H){if(H==="")return;switch(B.type){case"number":case"percent":case"currency":case"duration":{const O=Number(H);return Number.isFinite(O)?O:void 0}default:return H}}function x(B){switch(B.type){case"number":case"percent":case"currency":case"duration":return"number";case"date":return"date";case"time":return"time";case"datetime":return"datetime-local";default:return"text"}}function m(B){switch(B.type){case"number":case"percent":case"currency":case"duration":return"decimal";default:return}}function wB({mode:B,allowedModes:H,labels:O,onChange:U}){return W("div",{className:"flex items-center gap-1 rounded-md border bg-background p-1",children:H.map((J)=>{const Y=CB(J);return W(V,{size:"sm",variant:J===B?"default":"ghost",onPress:()=>U(J),ariaLabelI18n:O?.[J]??J,children:W(Y,{className:"h-4 w-4"})},J)})})}function FB({density:B,onChange:H}){return T("div",{className:"flex items-center gap-1 rounded-md border bg-background p-1",children:[W(V,{size:"sm",variant:B==="comfortable"?"default":"ghost",onPress:()=>H("comfortable"),children:"Comfort"}),W(V,{size:"sm",variant:B==="compact"?"default":"ghost",onPress:()=>H("compact"),children:"Compact"})]})}function CB(B){if(B==="grid")return IB;if(B==="table")return EB;return PB}

package/dist/browser/components/data-view/DataViewTable.js

@@ -1 +1 @@
-import{jsx as E,jsxs as V}from"react/jsx-runtime";import{useDataViewTable as A}from"@contractspec/lib.presentation-runtime-react";import{HStack as F,VStack as h}from"@contractspec/lib.ui-kit-web/ui/stack";import{Text as X}from"@contractspec/lib.ui-kit-web/ui/text";import*as C from"react";import{resolveTranslationString as W,useDesignSystemTranslation as K}from"../../i18n/translation";import{DataTable as R}from"../data-table/DataTable";import{DataViewFormattedValue as Y,getAtPath as g}from"./utils";export function DataViewTable({spec:q,items:J,className:L,onRowClick:G,toolbar:O,loading:Z,emptyState:$,headerActions:B,footer:H}){const Q=K();if(q.view.kind!=="table")throw Error(`DataViewTable received view kind "${q.view.kind}", expected "table".`);const M=q.view,P=C.useMemo(()=>(M.rowExpansion?.fields??[]).map((z)=>M.fields.find((I)=>I.key===z)).filter((z)=>Boolean(z)),[M.fields,M.rowExpansion?.fields]),N=A({spec:q,data:J,renderValue:({value:z,field:I})=>E(Y,{value:z,format:I.format}),renderExpandedContent:P.length>0?({item:z,fields:I})=>E(h,{gap:"sm",className:"py-2",children:I.map((U)=>V(F,{justify:"between",align:"start",children:[E(X,{className:"font-medium text-muted-foreground text-sm",children:W(U.label,Q)}),E(X,{className:"text-right text-sm",children:E(DisplayValue,{item:z,fields:I,fieldKey:U.key})})]},U.key))}):void 0});return E(R,{controller:N,className:L,title:W(q.meta.title,Q),description:W(q.meta.description,Q),toolbar:O,loading:Z,headerActions:B,emptyState:$,footer:H,onRowPress:G?(z)=>G(z.original):void 0})}function D(q,J){return q.find((L)=>L.key===J)}export function DisplayValue({item:q,fields:J,fieldKey:L}){const G=D(J,L);if(!G)return"";const O=g(q,G.dataPath);return E(Y,{value:O,format:G.format})}
+import{jsx as E,jsxs as _}from"react/jsx-runtime";import{useDataViewTable as C}from"@contractspec/lib.presentation-runtime-react";import{HStack as K,VStack as R}from"@contractspec/lib.ui-kit-web/ui/stack";import{Text as Z}from"@contractspec/lib.ui-kit-web/ui/text";import*as $ from"react";import{resolveTranslationString as X,useDesignSystemTranslation as g}from"../../i18n/translation";import{DataTable as D}from"../data-table/DataTable";import{DataViewFormattedValue as B,getAtPath as V}from"./utils";export function DataViewTable({spec:q,items:J,className:L,onRowClick:G,toolbar:O,loading:H,emptyState:P,headerActions:N,footer:A,density:Q}){const U=g();if(q.view.kind!=="table")throw Error(`DataViewTable received view kind "${q.view.kind}", expected "table".`);const Y=$.useMemo(()=>Q&&q.view.kind==="table"?{...q,view:{...q.view,density:Q}}:q,[Q,q]),M=Y.view,F=$.useMemo(()=>(M.rowExpansion?.fields??[]).map((z)=>M.fields.find((I)=>I.key===z)).filter((z)=>Boolean(z)),[M.fields,M.rowExpansion?.fields]),h=C({spec:Y,data:J,renderValue:({value:z,field:I})=>E(B,{value:z,format:I.format}),renderExpandedContent:F.length>0?({item:z,fields:I})=>E(R,{gap:"sm",className:"py-2",children:I.map((W)=>_(K,{justify:"between",align:"start",children:[E(Z,{className:"font-medium text-muted-foreground text-sm",children:X(W.label,U)}),E(Z,{className:"text-right text-sm",children:E(DisplayValue,{item:z,fields:I,fieldKey:W.key})})]},W.key))}):void 0});return E(D,{controller:h,className:L,title:X(q.meta.title,U),description:X(q.meta.description,U),toolbar:O,loading:H,headerActions:N,emptyState:P,footer:A,onRowPress:G?(z)=>G(z.original):void 0})}function b(q,J){return q.find((L)=>L.key===J)}export function DisplayValue({item:q,fields:J,fieldKey:L}){const G=b(J,L);if(!G)return"";const O=V(q,G.dataPath);return E(B,{value:O,format:G.format})}

package/dist/browser/components/data-view/collection.js

@@ -0,0 +1 @@
+const F=["list","grid","table"];export function isDataViewCollectionKind(h){return h==="list"||h==="grid"||h==="table"}export function resolveAllowedCollectionModes(h){const x=getDataViewCollectionConfig(h);if(!x||!isDataViewCollectionKind(h.kind))return isDataViewCollectionKind(h.kind)?[h.kind]:[];const z=getDataViewCollectionViewModesConfig(h),B=z?.allowedModes?.filter(K);if(B?.length)return P(B);if(x.toolbar?.viewMode===!0)return F;return z?F:[h.kind]}export function getDataViewCollectionConfig(h){if(!isDataViewCollectionKind(h.kind))return;return h.collection}export function getDataViewCollectionViewModesConfig(h){const x=getDataViewCollectionConfig(h),z=x?.toolbar?.viewMode;if(x?.viewModes)return x.viewModes;return typeof z==="object"?z:void 0}export function resolveCollectionView(h,x){const z=resolveAllowedCollectionModes(h.view),B=H(h.view,z),G=x&&z.includes(x)?x:B;return{spec:{...h,view:J(h.view,G)},mode:G,allowedModes:z}}export function resolveCollectionDensity(h,x={}){const z=h.view.kind==="table"?h.view.density:void 0;return x.density??z??getDataViewCollectionConfig(h.view)?.density??x.defaultDensity??"comfortable"}function H(h,x){const z=isDataViewCollectionKind(h.kind)&&getDataViewCollectionViewModesConfig(h)?.defaultMode;if(z&&x.includes(z))return z;if(isDataViewCollectionKind(h.kind)&&x.includes(h.kind))return h.kind;return x[0]??"list"}function J(h,x){const z=getDataViewCollectionConfig(h),B={fields:h.fields,primaryField:h.primaryField,secondaryFields:h.secondaryFields,filters:h.filters,filterScope:h.filterScope,actions:h.actions,collection:z};if(x==="list")return{...B,kind:"list",layout:h.kind==="list"?h.layout:"compact"};if(x==="grid")return{...B,kind:"grid",columns:h.kind==="grid"?h.columns:void 0};if(h.kind==="table")return{...h,...B,kind:"table"};return{...B,kind:"table",density:z?.density}}function K(h){return h==="list"||h==="grid"||h==="table"}function P(h){return F.filter((x)=>h.includes(x))}

package/dist/browser/components/data-view/utils.js

@@ -1 +1 @@
-import{jsx as m}from"react/jsx-runtime";import{MarkdownRenderer as a}from"../molecules/MarkdownRenderer";export function getAtPath(t,e){if(!t)return;if(!e)return t;const r=e.replace(/\[(\d+)\]/g,".$1").split(".").filter(Boolean);let n=t;for(const o of r){if(n==null||typeof n!=="object"&&!Array.isArray(n))return;n=n[o]}return n}export function DataViewFormattedValue({value:t,format:e}){if(t==null)return"";switch(e){case"boolean":return t?"Yes":"No";case"currency":return typeof t==="number"?new Intl.NumberFormat(void 0,{style:"currency",currency:"USD"}).format(t):String(t);case"percentage":return typeof t==="number"?`${(t*100).toFixed(1)}%`:String(t);case"date":return i(t,{dateStyle:"medium"});case"dateTime":return i(t,{dateStyle:"medium",timeStyle:"short"});case"markdown":return m(a,{content:t});default:return String(t)}}function i(t,e){if(t instanceof Date)return new Intl.DateTimeFormat(void 0,e).format(t);if(typeof t==="string"||typeof t==="number"){const r=new Date(t);if(!Number.isNaN(r.getTime()))return new Intl.DateTimeFormat(void 0,e).format(r)}return String(t??"")}
+import{jsx as l}from"react/jsx-runtime";import{MarkdownRenderer as u}from"../molecules/MarkdownRenderer";export function getAtPath(n,t){if(!n)return;if(!t)return n;const e=t.replace(/\[(\d+)\]/g,".$1").split(".").filter(Boolean);let i=n;for(const r of e){if(i==null||typeof i!=="object"&&!Array.isArray(i))return;i=i[r]}return i}export function DataViewFormattedValue({value:n,format:t}){if(n==null)return"";switch(typeof t==="string"?t:t?.type){case"boolean":return n?"Yes":"No";case"number":return m(n,t);case"currency":return d(n,t);case"percent":case"percentage":return p(n,t);case"date":return o(n,typeof t==="object"&&t.type==="date"?t:{dateStyle:"medium"});case"time":return o(n,typeof t==="object"&&t.type==="time"?t:{timeStyle:"short"});case"datetime":case"dateTime":return o(n,typeof t==="object"&&t.type==="datetime"?t:{dateStyle:"medium",timeStyle:"short"});case"duration":return g(n,t);case"markdown":return l(u,{content:n});default:return String(n)}}function m(n,t){if(typeof n!=="number")return String(n);const e=typeof t==="object"&&t.type==="number"?t:void 0;return new Intl.NumberFormat(e?.locale,{minimumFractionDigits:e?.minimumFractionDigits,maximumFractionDigits:e?.maximumFractionDigits,useGrouping:e?.useGrouping,notation:e?.notation,signDisplay:e?.signDisplay}).format(n)}function d(n,t){if(typeof n!=="number")return String(n);const e=typeof t==="object"&&t.type==="currency"?t:void 0;return new Intl.NumberFormat(e?.locale,{style:"currency",currency:e?.currency??"USD",currencyDisplay:e?.currencyDisplay,minimumFractionDigits:e?.rounded?0:e?.minimumFractionDigits,maximumFractionDigits:e?.rounded?0:e?.maximumFractionDigits,useGrouping:e?.useGrouping,notation:e?.notation,signDisplay:e?.signDisplay}).format(n)}function p(n,t){if(typeof n!=="number")return String(n);const e=typeof t==="object"&&t.type==="percent"?t:void 0,i=e?.valueScale==="whole"?n/100:n;return new Intl.NumberFormat(e?.locale,{style:"percent",minimumFractionDigits:e?.minimumFractionDigits??1,maximumFractionDigits:e?.maximumFractionDigits??1,useGrouping:e?.useGrouping,notation:e?.notation,signDisplay:e?.signDisplay}).format(i)}function o(n,t){const{locale:e,...i}=t;if(n instanceof Date)return new Intl.DateTimeFormat(e,i).format(n);if(typeof n==="string"||typeof n==="number"){const r=new Date(n);if(!Number.isNaN(r.getTime()))return new Intl.DateTimeFormat(e,i).format(r)}return String(n??"")}function g(n,t){if(typeof n!=="number")return String(n);const e=typeof t==="object"&&t.type==="duration"?t:void 0,i=e?.unit??"second";if(e?.display==="digital")return y(f(n,i));return new Intl.NumberFormat(e?.locale,{style:"unit",unit:i,unitDisplay:e?.display==="narrow"?"narrow":e?.display,maximumFractionDigits:2}).format(n)}function y(n){const t=n<0?"-":"",e=Math.round(Math.abs(n)),i=Math.floor(e/3600),r=Math.floor(e%3600/60),c=e%60,s=[r,c].map((a)=>String(a).padStart(2,"0")).join(":");return i>0?`${t}${i}:${s}`:`${t}${s}`}function f(n,t){switch(t){case"millisecond":return n/1000;case"minute":return n*60;case"hour":return n*3600;case"day":return n*86400;case"week":return n*604800;case"month":return n*2629746;case"year":return n*31556952;case"second":default:return n}}

package/dist/browser/components/molecules/Tabs.js

@@ -1 +1 @@
-import{jsx as H}from"react/jsx-runtime";import{Tabs as R,TabsContent as S,TabsList as U,TabsTrigger as X}from"@contractspec/lib.ui-kit-web/ui/tabs";import{useThemedPrimitive as G}from"../primitives/themed";export function Tabs({value:z,defaultValue:A,onValueChange:B,className:D,children:q,orientation:F,dir:E,activationMode:J,componentKey:O,themeVariant:Q}){console.log("tabs web");const I=G({defaultComponentKey:"Tabs",componentKey:O,themeVariant:Q,className:D});return H(R,{...I.props,value:z,defaultValue:A,onValueChange:B,className:I.className,orientation:F,dir:E,activationMode:J,children:q})}export function TabsList({className:z,children:A,componentKey:B,themeVariant:D}){const q=G({defaultComponentKey:"TabsList",componentKey:B,themeVariant:D,className:z});return H(U,{...q.props,className:q.className,children:A})}export function TabsTrigger({value:z,disabled:A,className:B,children:D,componentKey:q,themeVariant:F}){const E=G({defaultComponentKey:"TabsTrigger",componentKey:q,themeVariant:F,className:B});return H(X,{...E.props,value:z,disabled:A,className:E.className,children:D})}export function TabsContent({value:z,forceMount:A,className:B,children:D,componentKey:q,themeVariant:F}){const E=G({defaultComponentKey:"TabsContent",componentKey:q,themeVariant:F,className:B});return H(S,{...E.props,value:z,forceMount:A?!0:void 0,className:E.className,children:D})}
+import{jsx as H}from"react/jsx-runtime";import{Tabs as R,TabsContent as S,TabsList as U,TabsTrigger as X}from"@contractspec/lib.ui-kit-web/ui/tabs";import{useThemedPrimitive as G}from"../primitives/themed";export function Tabs({value:z,defaultValue:A,onValueChange:B,className:D,children:q,orientation:F,dir:E,activationMode:J,componentKey:O,themeVariant:Q}){const I=G({defaultComponentKey:"Tabs",componentKey:O,themeVariant:Q,className:D});return H(R,{...I.props,value:z,defaultValue:A,onValueChange:B,className:I.className,orientation:F,dir:E,activationMode:J,children:q})}export function TabsList({className:z,children:A,componentKey:B,themeVariant:D}){const q=G({defaultComponentKey:"TabsList",componentKey:B,themeVariant:D,className:z});return H(U,{...q.props,className:q.className,children:A})}export function TabsTrigger({value:z,disabled:A,className:B,children:D,componentKey:q,themeVariant:F}){const E=G({defaultComponentKey:"TabsTrigger",componentKey:q,themeVariant:F,className:B});return H(X,{...E.props,value:z,disabled:A,className:E.className,children:D})}export function TabsContent({value:z,forceMount:A,className:B,children:D,componentKey:q,themeVariant:F}){const E=G({defaultComponentKey:"TabsContent",componentKey:q,themeVariant:F,className:B});return H(S,{...E.props,value:z,forceMount:A?!0:void 0,className:E.className,children:D})}

package/dist/browser/components/object-reference/DefaultObjectReferenceParts.js

@@ -0,0 +1 @@
+import{jsx as r,jsxs as i}from"react/jsx-runtime";import{cn as c}from"../../lib/utils";import{getObjectReferenceDisplayValue as l}from"./actions";import{ReferenceIcon as a,ReferenceSearchIcon as m}from"./ReferenceIcon";export function DefaultObjectReferenceTrigger({context:e,iconRenderer:d,interactivityVisibility:t,className:n}){const{reference:o}=e;return i("span",{className:c("inline-flex min-w-0 items-center gap-1.5 text-foreground text-sm transition-colors hover:text-primary",t==="underline"&&"underline decoration-muted-foreground/50 underline-offset-4 hover:decoration-primary",n),children:[r(a,{context:{iconKey:o.iconKey??o.kind,reference:o},iconRenderer:d}),r("span",{className:"truncate",children:o.label}),t==="icon"?r(m,{className:"h-3.5 w-3.5 shrink-0 text-muted-foreground"}):null]})}export function DefaultReferenceDetail({reference:e}){const d=l(e),t=Object.entries(e.metadata??{});return i("div",{className:"rounded-md border border-border bg-muted/30 p-3 text-sm",children:[r("div",{className:"font-medium text-foreground",children:d}),e.href?r("div",{className:"mt-1 break-all text-muted-foreground",children:e.href}):null,t.length>0?r("dl",{className:"mt-3 grid gap-2",children:t.map(([n,o])=>i("div",{className:"grid gap-0.5",children:[r("dt",{className:"font-medium text-muted-foreground text-xs uppercase",children:n}),r("dd",{className:"break-words text-foreground",children:String(o)})]},n))}):null]})}export function DefaultActionButton({action:e,reference:d,iconRenderer:t,onClick:n}){return i("button",{type:"button",className:c("flex min-h-11 w-full items-center gap-3 rounded-md border border-border px-3 py-2 text-left text-sm transition-colors hover:bg-muted focus:outline-none focus:ring-2 focus:ring-ring",e.variant==="primary"&&"border-primary/40 bg-primary/10",e.variant==="danger"&&"border-destructive/40 text-destructive",e.disabled&&"cursor-not-allowed opacity-50"),disabled:e.disabled,onClick:n,children:[r(a,{context:{iconKey:e.iconKey??e.id,reference:d,action:e},iconRenderer:t}),i("span",{className:"min-w-0 flex-1",children:[r("span",{className:"block font-medium",children:e.label}),e.description?r("span",{className:"block text-muted-foreground text-xs",children:e.description}):null]})]})}

package/dist/browser/components/object-reference/ObjectReferenceHandler.js

@@ -0,0 +1 @@
+import{jsx as z,jsxs as G}from"react/jsx-runtime";import{Sheet as b,SheetContent as D,SheetDescription as w,SheetHeader as O,SheetTitle as A}from"@contractspec/lib.ui-kit-web/ui/sheet";import{Tooltip as R,TooltipContent as T,TooltipTrigger as h}from"@contractspec/lib.ui-kit-web/ui/tooltip";import*as u from"react";import{cn as _}from"../../lib/utils";import{DefaultActionButton as g,DefaultObjectReferenceTrigger as y,DefaultReferenceDetail as d}from"./DefaultObjectReferenceParts";import{useObjectReferenceController as j}from"./useObjectReferenceController";export function ObjectReferenceHandler({reference:q,actions:J,interactivityVisibility:X="underline",defaultOpen:Y=!1,open:Z,onOpenChange:$,actionHandlers:k,onAction:B,onActionError:P,copyText:E,copyHandler:V,openHref:v,renderTrigger:K,renderDetail:L,renderAction:M,iconRenderer:Q,className:N,panelClassName:m}){const{context:I,resolvedActions:S,resolvedOpen:C,runAction:U,setOpen:W}=j({reference:q,actions:J,defaultOpen:Y,open:Z,onOpenChange:$,actionHandlers:k,copyText:E,copyHandler:V,openHref:v,onAction:B,onActionError:P,defaultCopy:p,defaultOpenHref:x}),H=K?K(I):z(y,{context:I,iconRenderer:Q,interactivityVisibility:X,className:N});return G(b,{open:C,onOpenChange:W,children:[G(R,{children:[z(h,{asChild:!0,children:z("button",{type:"button",className:"contents","aria-label":q.ariaLabel??`Open ${q.label}`,onClick:()=>W(!0),children:H})}),z(T,{children:q.ariaLabel??q.label})]}),G(D,{className:_("sm:max-w-md",m),children:[G(O,{children:[z(A,{children:q.label}),q.description?z(w,{children:q.description}):null]}),G("div",{className:"flex flex-col gap-4 px-4 pb-4",children:[L?L(I):z(d,{reference:q}),z("div",{className:"flex flex-col gap-2",children:S.map((F)=>M?z(u.Fragment,{children:M({...I,action:F,runAction:U})},F.id):z(g,{action:F,reference:q,iconRenderer:Q,onClick:()=>U(F)},F.id))})]})]})]})}async function p(q,J){if(typeof navigator<"u"&&navigator.clipboard){await navigator.clipboard.writeText(q);return}throw Error("Clipboard is not available.")}async function x(q,J){if(typeof window<"u")window.open(q,"_blank","noopener,noreferrer")}

package/dist/browser/components/object-reference/ReferenceIcon.js

@@ -0,0 +1 @@
+import{jsx as p,Fragment as f}from"react/jsx-runtime";import{Copy as a,ExternalLink as r,FileText as s,MapPin as o,Phone as t,Search,User as c}from"lucide-react";const R={address:o,phone:t,user:c,customer:c,file:s,url:r,custom:Search,copy:a,map:o,phoneAction:t,"external-link":r};export function ReferenceIcon({context:e,iconRenderer:n}){if(n)return p(f,{children:n(e)});const i=R[e.iconKey]??Search;return p(i,{className:"h-4 w-4 shrink-0 text-muted-foreground"})}export{Search as ReferenceSearchIcon};

package/dist/browser/components/object-reference/actions.js

@@ -0,0 +1 @@
+export{createMapsProviderHref,createMapsReferenceActions}from"./maps";import{createMapsReferenceActions as c}from"./maps";function n(e){return e.trim().replace(/\s+/g," ")}export function getObjectReferenceDisplayValue(e){return e.value??e.href??e.label}export function createCopyReferenceAction(e,t="Copy"){return{id:"copy",label:t,description:"Copy this reference",iconKey:"copy",metadata:{copyText:getObjectReferenceDisplayValue(e)}}}export function createOpenReferenceAction(e,t="Open details"){if(!e.href)return null;return{id:"open",label:t,description:"Open the related page or resource",href:e.href,iconKey:"external-link"}}export function createPhoneReferenceAction(e,t="Call"){if(e.kind!=="phone")return null;const r=n(e.value??e.label);if(!r)return null;return{id:"call",label:t,description:"Call this phone number",href:`tel:${r.replace(/[^\d+]/g,"")}`,iconKey:"phone"}}export function createDefaultObjectReferenceActions(e){return[createCopyReferenceAction(e),createOpenReferenceAction(e),createPhoneReferenceAction(e),...c(e)].filter((t)=>Boolean(t))}

package/dist/browser/components/object-reference/index.js

@@ -0,0 +1 @@
+export{createCopyReferenceAction,createDefaultObjectReferenceActions,createMapsProviderHref,createMapsReferenceActions,createOpenReferenceAction,createPhoneReferenceAction,getObjectReferenceDisplayValue}from"./actions";export{ObjectReferenceHandler}from"./ObjectReferenceHandler";export{executeObjectReferenceAction}from"./runtime";

package/dist/browser/components/object-reference/maps.js

@@ -0,0 +1 @@
+export function createMapsProviderHref(e,t){const r=encodeURIComponent(a(t));switch(e){case"apple":return`https://maps.apple.com/?q=${r}`;case"google":return`https://www.google.com/maps/search/?api=1&query=${r}`;case"waze":return`https://waze.com/ul?q=${r}&navigate=yes`;case"geo":return`geo:0,0?q=${r}`}}export function createMapsReferenceActions(e,t={}){if(e.kind!=="address")return[];const r=e.value??e.label;if(!a(r))return[];const n=t.providers??["google","apple","waze"],o=t.labelPrefix??"Open in";return n.map((c)=>({id:`maps.${c}`,label:`${o} ${s(c)}`,description:"Open navigation for this address",href:createMapsProviderHref(c,r),iconKey:"map",metadata:{provider:c}}))}function a(e){return e.trim().replace(/\s+/g," ")}function s(e){switch(e){case"apple":return"Apple Maps";case"google":return"Google Maps";case"waze":return"Waze";case"geo":return"Maps"}}

package/dist/browser/components/object-reference/runtime.js

@@ -0,0 +1 @@
+import{getObjectReferenceDisplayValue as c}from"./actions";export async function executeObjectReferenceAction(e,r){try{const n=r.actionHandlers?.[e.action.id];if(n)await n(e);else if(e.action.id==="copy")await t(e,r);else if(e.action.href)await o(e.action.href,e,r);await r.onAction?.(e)}catch(n){r.onActionError?.(n,e)}}function t(e,r){const n=r.copyText??i(e.action.metadata?.copyText)??c(e.reference);if(r.copyHandler)return r.copyHandler(n,e);if(r.defaultCopy)return r.defaultCopy(n,e);throw Error("Clipboard is not available.")}function o(e,r,n){if(n.openHref)return n.openHref(e,r);return n.defaultOpenHref?.(e,r)}function i(e){return typeof e==="string"?e:void 0}

package/dist/browser/components/object-reference/useObjectReferenceController.js

@@ -0,0 +1 @@
+import*as q from"react";import{createDefaultObjectReferenceActions as $}from"./actions";import{executeObjectReferenceAction as D}from"./runtime";export function useObjectReferenceController({reference:k,actions:F,defaultOpen:W=!1,open:G,onOpenChange:I,actionHandlers:J,onAction:K,onActionError:L,copyText:M,copyHandler:N,openHref:P,defaultCopy:Q,defaultOpenHref:S}){const[X,Y]=q.useState(W),V=G!==void 0,w=G??X,z=q.useMemo(()=>F??$(k),[F,k]),B=q.useCallback((m)=>{if(!V)Y(m);I?.(m)},[V,I]),Z=q.useMemo(()=>({reference:k,actions:z,open:w,setOpen:B}),[k,z,w,B]),_=q.useCallback((m)=>{if(m.disabled)return;D({reference:k,action:m,source:"action"},{actionHandlers:J,copyText:M,copyHandler:N,openHref:P,onAction:K,onActionError:L,defaultCopy:Q,defaultOpenHref:S})},[J,N,M,Q,S,K,L,P,k]);return{context:Z,resolvedActions:z,resolvedOpen:w,runAction:_,setOpen:B}}

package/dist/browser/components/shell/AppShell.js

@@ -0,0 +1 @@
+import{jsx as k,jsxs as F}from"react/jsx-runtime";import{Dialog as R,DialogContent as P,DialogHeader as B,DialogTitle as T}from"@contractspec/lib.ui-kit-web/ui/dialog";import{cn as Q}from"@contractspec/lib.ui-kit-web/ui/utils";import{MenuIcon as w,PanelRightIcon as y}from"lucide-react";import*as D from"react";import{Button as I}from"../atoms/Button";import{NavBrand as g}from"../atoms/NavBrand";import{Breadcrumbs as u}from"../molecules/Breadcrumbs";import{CommandSearchTrigger as _}from"../molecules/CommandSearchTrigger";import{PageOutline as N}from"./PageOutline";import{ShellSidebar as x}from"./ShellSidebar";function d({sections:q,activeHref:G}){return k("nav",{className:"flex flex-col gap-5","aria-label":"Application navigation",children:q.map((A,J)=>F("div",{className:"flex flex-col gap-2",children:[A.title&&k("div",{className:"font-medium text-muted-foreground text-xs uppercase tracking-wide",children:A.title}),k("div",{className:"flex flex-col gap-1",children:A.items.map((z)=>k(C,{item:z,activeHref:G},z.key??z.href??String(z.label)))})]},A.key??J))})}function C({item:q,activeHref:G,depth:A=0}){const J=q.active||Boolean(q.href)&&Boolean(G)&&(q.match==="startsWith"?G?.startsWith(q.href??""):G===q.href),z=F("span",{className:Q("inline-flex min-w-0 items-center gap-2",A>0&&"pl-4"),children:[q.icon,k("span",{className:"truncate",children:q.label}),q.badge?k("span",{className:"ml-auto text-muted-foreground text-xs",children:q.badge}):null]});return F("div",{className:"flex flex-col gap-1",children:[q.href?k("a",{href:q.href,target:q.target,"aria-current":J?"page":void 0,"aria-label":q.ariaLabel,onClick:()=>q.onSelect?.(),className:Q("rounded-xs px-2 py-2 text-sm hover:bg-accent hover:text-accent-foreground",J&&"bg-accent font-medium text-accent-foreground"),children:z}):k("button",{type:"button","aria-label":q.ariaLabel,onClick:()=>q.onSelect?.(),className:Q("rounded-xs px-2 py-2 text-left text-sm hover:bg-accent hover:text-accent-foreground",J&&"bg-accent font-medium text-accent-foreground"),children:z}),q.children?.length?k("div",{className:"flex flex-col gap-1",children:q.children.map((K)=>k(C,{item:K,activeHref:G,depth:A+1},K.key??K.href??String(K.label)))}):null]})}export function AppShell({brand:q,logo:G,title:A,homeHref:J,navigation:z=[],commands:K=[],breadcrumbs:Y=[],pageOutline:U=[],activeHref:Z,activeOutlineId:$,userMenu:V,topbarStart:M,topbarEnd:S,children:b,className:H,contentClassName:p,onNavigate:f}){const[O,E]=D.useState(!1),[v,W]=D.useState(!1),L=q??k(g,{href:J,logo:G,title:A}),X=(h=!1)=>K.length?k(_,{groups:K,placeholder:"Search or run action...",compact:h}):null;return F("div",{className:Q("min-h-svh bg-background",H),children:[k("header",{className:"sticky top-0 z-30 border-b bg-background/95 backdrop-blur-xs supports-backdrop-filter:bg-background/60",children:F("div",{className:"flex h-14 items-center gap-3 px-3 md:px-4",children:[k(I,{variant:"ghost",size:"icon",className:"md:hidden","aria-label":"Open navigation",onPress:()=>E(!0),children:k(w,{className:"h-4 w-4"})}),k("div",{className:"min-w-0 md:hidden",children:L}),k("div",{className:"hidden min-w-0 md:block",children:M}),k("div",{className:"min-w-0 flex-1",children:Y.length?k(u,{items:Y}):null}),k("div",{className:"hidden shrink-0 md:block",children:X()}),U.length?k(I,{variant:"ghost",size:"icon",className:"lg:hidden","aria-label":"Open page outline",onPress:()=>W(!0),children:k(y,{className:"h-4 w-4"})}):null,S,V]})}),F("div",{className:"grid min-h-[calc(100svh-3.5rem)] grid-cols-1 md:grid-cols-[280px_minmax(0,1fr)] lg:grid-cols-[280px_minmax(0,1fr)_240px]",children:[k("aside",{className:"hidden border-r md:block",children:k(x,{sections:z,brand:L,commandTrigger:X(),footer:V,activeHref:Z})}),k("main",{className:Q("min-w-0 px-4 py-5 md:px-6",p),children:b}),U.length?k("aside",{className:"hidden px-4 py-5 lg:block",children:k(N,{items:U,activeId:$})}):null]}),k(R,{open:O,onOpenChange:E,children:F(P,{className:"max-h-[85svh] overflow-auto sm:max-w-sm",children:[k(B,{children:k(T,{children:"Menu"})}),F("div",{className:"flex flex-col gap-4",children:[X(),k(d,{sections:z,activeHref:Z}),V]})]})}),k(R,{open:v,onOpenChange:W,children:F(P,{className:"max-h-[85svh] overflow-auto sm:max-w-sm",children:[k(B,{children:k(T,{children:"On this page"})}),k(N,{items:U,activeId:$,variant:"compact",onNavigate:()=>W(!1)})]})})]})}

package/dist/browser/components/shell/PageOutline.js

@@ -0,0 +1 @@
+import{jsx as H}from"react/jsx-runtime";import{cn as S}from"@contractspec/lib.ui-kit-web/ui/utils";import*as M from"react";import{resolvePageOutlineItems as U}from"./outline";export function PageOutline({items:z,activeId:E,onNavigate:J,ariaLabel:K="On this page",variant:F="rail",maxLevel:C=3,className:B,...D}){const G=M.useMemo(()=>U(z,C),[z,C]);if(!G.length)return null;return H("nav",{"aria-label":K,className:S("text-muted-foreground text-sm",F==="rail"?"sticky top-20 max-h-[calc(100svh-6rem)] overflow-auto border-l pl-4":"rounded-md border p-3",B),...D,children:H("ol",{className:"m-0 list-none space-y-1 p-0",children:G.map((q)=>{const Q=E===q.id,T=q.href??`#${q.id}`;return H("li",{children:H("a",{href:T,"aria-current":Q?"location":void 0,onClick:()=>J?.(q),className:S("block rounded-xs px-2 py-1 transition-colors hover:bg-accent hover:text-accent-foreground",q.resolvedLevel===2&&"pl-5",q.resolvedLevel===3&&"pl-8 text-xs",Q&&"bg-accent font-medium text-accent-foreground"),children:q.label})},`${q.id}-${q.resolvedLevel}`)})})})}export function usePageOutlineActiveItem(z,E){const[J,K]=M.useState(z[0]);M.useEffect(()=>{if(!z.length||typeof IntersectionObserver>"u")return;const F=new IntersectionObserver((C)=>{const B=C.filter((D)=>D.isIntersecting).sort((D,G)=>G.intersectionRatio-D.intersectionRatio)[0];if(B?.target.id)K(B.target.id)},E??{rootMargin:"-20% 0px -65% 0px",threshold:[0,0.25,0.5,1]});for(const C of z){const B=document.getElementById(C);if(B)F.observe(B)}return()=>F.disconnect()},[z,E]);return J}

package/dist/browser/components/shell/ShellSidebar.js

@@ -0,0 +1 @@
+import{jsx as z,jsxs as O}from"react/jsx-runtime";import{Sidebar as A,SidebarContent as F,SidebarFooter as L,SidebarGroup as P,SidebarGroupContent as R,SidebarGroupLabel as B,SidebarHeader as K,SidebarMenu as X,SidebarMenuBadge as N,SidebarMenuButton as C,SidebarMenuItem as G,SidebarProvider as I,SidebarRail as T}from"@contractspec/lib.ui-kit-web/ui/sidebar";import{cn as Y}from"@contractspec/lib.ui-kit-web/ui/utils";function M(q,D){if(q.active)return!0;if(!D||!q.href)return!1;return q.match==="startsWith"?D.startsWith(q.href):D===q.href}function Z(q){return q.key??q.href??String(q.label)}function $({item:q,activeHref:D,depth:J=0}){const Q=M(q,D),V=Boolean(q.children?.length),U=O("span",{className:Y("inline-flex min-w-0 items-center gap-2",J>0&&"pl-4"),children:[q.icon,z("span",{className:"truncate",children:q.label})]});return O(G,{children:[z(C,{asChild:!!q.href,isActive:Q,"aria-label":q.href?void 0:q.ariaLabel,onClick:q.href?void 0:()=>q.onSelect?.(),children:q.href?z("a",{href:q.href,target:q.target,"aria-label":q.ariaLabel,onClick:()=>q.onSelect?.(),children:U}):U}),q.badge!=null&&z(N,{children:q.badge}),V&&z(X,{className:"mt-1",children:q.children?.map((E)=>z($,{item:E,activeHref:D,depth:J+1},Z(E)))})]})}export function ShellSidebar({sections:q,brand:D,commandTrigger:J,footer:Q,activeHref:V,className:U}){return z(I,{children:O(A,{className:U,children:[z(T,{}),O(K,{className:Y("gap-3",!D&&!J&&"hidden"),children:[D,J]}),z(F,{children:q.map((E,k)=>O(P,{children:[E.title&&z(B,{children:E.title}),z(R,{children:z(X,{children:E.items.map((W)=>z($,{item:W,activeHref:V},Z(W)))})})]},E.key??k))}),Q&&z(L,{children:Q})]})})}

package/dist/browser/components/shell/index.js

@@ -0,0 +1 @@
+export{AppShell}from"./AppShell";export{PageOutline,usePageOutlineActiveItem}from"./PageOutline";export{ShellSidebar}from"./ShellSidebar";

package/dist/browser/components/shell/outline.js

@@ -0,0 +1 @@
+export function resolvePageOutlineItems(n,t,r=1){return n.flatMap((e)=>{const l=Math.min(e.level??r,t),a={...e,resolvedLevel:l},i=e.children?.length?resolvePageOutlineItems(e.children,t,Math.min(l+1,t)):[];return[a,...i]})}

package/dist/browser/design-system.feature.js

@@ -1 +1 @@
-import{defineFeature as g}from"@contractspec/lib.contracts-spec/features";export const DesignSystemFeature=g({meta:{key:"libs.design-system",version:"1.0.0",title:"Design System",description:"Design tokens and theming primitives",domain:"design-system",owners:["@contractspec-core"],tags:["package","libs","design-system"],stability:"experimental"}});
+import{defineFeature as g}from"@contractspec/lib.contracts-spec/features";export const DesignSystemFeature=g({meta:{key:"libs.design-system",version:"1.0.0",title:"Design System",description:"Design tokens, theming primitives, and composed product-surface components",domain:"design-system",owners:["@contractspec-core"],tags:["package","libs","design-system","components"],stability:"experimental"}});

package/dist/browser/index.js

@@ -1 +1 @@
-export{AgentMonitor}from"./components/agent/AgentMonitor";export{ApprovalQueue}from"./components/agent/ApprovalQueue";export{DeleteButton,EditButton,ToggleButton,ToggleLeftButton,ToggleRightButton,ViewButton}from"./components/atoms/ActionButtons";export{Button}from"./components/atoms/Button";export{ButtonLink}from"./components/atoms/ButtonLink";export{Cta}from"./components/atoms/Cta";export{DateChip,DurationChip,PlaceChip,TimeChip}from"./components/atoms/DataChips";export{EmptyState}from"./components/atoms/EmptyState";export{ErrorState}from"./components/atoms/ErrorState";export{Input}from"./components/atoms/Input";export{InputPassword}from"./components/atoms/InputPassword";export{Link}from"./components/atoms/Link";export{LoaderCircular}from"./components/atoms/LoaderCircular";export{NavBrand}from"./components/atoms/NavBrand";export{RankBadge}from"./components/atoms/RankBadge";export{ScoreBar}from"./components/atoms/ScoreBar";export{Stepper}from"./components/atoms/Stepper";export{Textarea}from"./components/atoms/Textarea";export{DataTable}from"./components/data-table/DataTable";export{DataTableToolbar}from"./components/data-table/DataTableToolbar";export{DataViewDetail}from"./components/data-view/DataViewDetail";export{DataViewList}from"./components/data-view/DataViewList";export{DataViewRenderer}from"./components/data-view/DataViewRenderer";export{DataViewTable}from"./components/data-view/DataViewTable";export*from"./components/forms";export*from"./components/layout";export{DefinitionList}from"./components/legal/atoms/DefinitionList";export{KeyValueList}from"./components/legal/atoms/KeyValueList";export{LegalCallout}from"./components/legal/atoms/LegalCallout";export{LegalHeading}from"./components/legal/atoms/LegalHeading";export{LegalList}from"./components/legal/atoms/LegalList";export{LegalSection}from"./components/legal/atoms/LegalSection";export{LegalText}from"./components/legal/atoms/LegalText";export{ConsentItem,ConsentList}from"./components/legal/molecules/Consent";export{ContactFields}from"./components/legal/molecules/ContactFields";export{LegalMeta}from"./components/legal/molecules/LegalMeta";export{LegalTOC}from"./components/legal/molecules/LegalTOC";export*from"./components/legal/organisms/ContactForm";export*from"./components/legal/organisms/GDPRDataRequest";export*from"./components/legal/organisms/GDPRRights";export*from"./components/legal/organisms/LegalPageLayout";export{ContactTemplate}from"./components/legal/templates/ContactTemplate";export{CookiesTemplate}from"./components/legal/templates/CookiesTemplate";export{PrivacyTemplate}from"./components/legal/templates/PrivacyTemplate";export{SalesTermsTemplate}from"./components/legal/templates/SalesTermsTemplate";export{TermsTemplate}from"./components/legal/templates/TermsTemplate";export{List,ListItem}from"./components/list";export{MarketingCard,MarketingCardContent,MarketingCardDescription,MarketingCardHeader,MarketingCardTitle}from"./components/marketing/MarketingCard";export{MarketingCardsSection}from"./components/marketing/MarketingCardsSection";export{MarketingComparisonSection}from"./components/marketing/MarketingComparisonSection";export{MarketingIconCard}from"./components/marketing/MarketingIconCard";export{MarketingSection}from"./components/marketing/MarketingSection";export{MarketingStepCard}from"./components/marketing/MarketingStepCard";export{AiLinkButton}from"./components/molecules/AiLinkButton";export{Breadcrumbs}from"./components/molecules/Breadcrumbs";export{CodeBlock}from"./components/molecules/CodeBlock";export{CommandPalette}from"./components/molecules/CommandPalette";export{CommandSearchTrigger}from"./components/molecules/CommandSearchTrigger";export{CommandTabs}from"./components/molecules/CommandTabs";export{CopyButton}from"./components/molecules/CopyButton";export{DimensionScoresCard}from"./components/molecules/DimensionScoresCard";export{EntityCard}from"./components/molecules/EntityCard";export{FiltersToolbar}from"./components/molecules/FiltersToolbar";export{HoverPreview}from"./components/molecules/HoverPreview";export{HoverPreviewDoc}from"./components/molecules/hover-previews/Doc";export{HoverPreviewMedia}from"./components/molecules/hover-previews/Media";export{HoverPreviewSimple}from"./components/molecules/hover-previews/Simple";export{HoverPreviewStats}from"./components/molecules/hover-previews/Stats";export{HoverPreviewUser}from"./components/molecules/hover-previews/User";export{InstallCommand}from"./components/molecules/InstallCommand";export{LangSwitch}from"./components/molecules/LangSwitch";export{LoaderBlock}from"./components/molecules/LoaderBlock";export{MarkdownRenderer}from"./components/molecules/MarkdownRenderer";export{NavMain}from"./components/molecules/NavMain";export{NavUser}from"./components/molecules/NavUser";export{OverviewCard}from"./components/molecules/OverviewCard";export{SkeletonBlock}from"./components/molecules/SkeletonBlock";export{SkeletonCircle}from"./components/molecules/SkeletonCircle";export{SkeletonList}from"./components/molecules/SkeletonList";export{StatCard,StatCardGroup}from"./components/molecules/StatCard";export{StatusChip}from"./components/molecules/StatusChip";export{Tabs,TabsContent,TabsList,TabsTrigger}from"./components/molecules/Tabs";export{AcademyLayout}from"./components/organisms/AcademyLayout";export{AppHeader}from"./components/organisms/AppHeader";export{AppLayout}from"./components/organisms/AppLayout";export{AppSidebar}from"./components/organisms/AppSidebar";export{EmptyDataList}from"./components/organisms/EmptyDataList";export{EmptySearchResult}from"./components/organisms/EmptySearchResult";export{FAQSection}from"./components/organisms/FAQSection";export{FeatureCarousel}from"./components/organisms/FeatureCarousel";export{FeaturesSection}from"./components/organisms/FeaturesSection";export{Footer}from"./components/organisms/Footer";export{DesktopHeader,Header,MobileHeader}from"./components/organisms/Header";export{HeroResponsive}from"./components/organisms/HeroResponsive";export{HeroSection}from"./components/organisms/HeroSection";export{ListCardPage}from"./components/organisms/ListCardPage";export{ListGridPage}from"./components/organisms/ListGridPage";export{ListPageResponsive}from"./components/organisms/ListPageResponsive";export{ListTablePage}from"./components/organisms/ListTablePage";export{MarketingHeader}from"./components/organisms/MarketingHeader";export{MarketingHeaderDesktop}from"./components/organisms/MarketingHeaderDesktop";export{MarketingHeaderMobile}from"./components/organisms/MarketingHeaderMobile";export{MarketingLayout}from"./components/organisms/MarketingLayout";export{ModelComparisonView}from"./components/organisms/ModelComparisonView";export{PageHeaderResponsive}from"./components/organisms/PageHeaderResponsive";export{PricingCarousel}from"./components/organisms/PricingCarousel";export{PricingSection}from"./components/organisms/PricingSection";export{TestimonialCarousel}from"./components/organisms/TestimonialCarousel";export{PackageManagerProvider,usePackageManager}from"./components/providers/PackageManagerProvider";export{ListPageTemplate}from"./components/templates/lists/ListPageTemplate";export{BlockQuote,Code,H1,H2,H3,H4,Large,Lead,Muted,P,Small,Text}from"./components/typography";export{ComparisonView}from"./components/visualization/ComparisonView";export{TimelineView}from"./components/visualization/TimelineView";export{VisualizationCard}from"./components/visualization/VisualizationCard";export{VisualizationGrid}from"./components/visualization/VisualizationGrid";export{VisualizationRenderer}from"./components/visualization/VisualizationRenderer";export*from"./design-system.feature";export{useListUrlState}from"./hooks/useListUrlState";export*from"./i18n/translation";export{useColorScheme}from"./platform/useColorScheme";export{useReducedMotion}from"./platform/useReducedMotion";export{useResponsive}from"./platform/useResponsive";export*from"./platform/withPlatformUI";export*from"./renderers";export*from"./theme";export*from"./types/navigation";
+export{AgentMonitor}from"./components/agent/AgentMonitor";export{ApprovalQueue}from"./components/agent/ApprovalQueue";export{DeleteButton,EditButton,ToggleButton,ToggleLeftButton,ToggleRightButton,ViewButton}from"./components/atoms/ActionButtons";export{Button}from"./components/atoms/Button";export{ButtonLink}from"./components/atoms/ButtonLink";export{Cta}from"./components/atoms/Cta";export{DateChip,DurationChip,PlaceChip,TimeChip}from"./components/atoms/DataChips";export{EmptyState}from"./components/atoms/EmptyState";export{ErrorState}from"./components/atoms/ErrorState";export{Input}from"./components/atoms/Input";export{InputPassword}from"./components/atoms/InputPassword";export{Link}from"./components/atoms/Link";export{LoaderCircular}from"./components/atoms/LoaderCircular";export{NavBrand}from"./components/atoms/NavBrand";export{RankBadge}from"./components/atoms/RankBadge";export{ScoreBar}from"./components/atoms/ScoreBar";export{Stepper}from"./components/atoms/Stepper";export{Textarea}from"./components/atoms/Textarea";export{DataTable}from"./components/data-table/DataTable";export{DataTableToolbar}from"./components/data-table/DataTableToolbar";export{DataViewDetail}from"./components/data-view/DataViewDetail";export{DataViewGrid}from"./components/data-view/DataViewGrid";export{DataViewList}from"./components/data-view/DataViewList";export{DataViewRenderer}from"./components/data-view/DataViewRenderer";export{DataViewTable}from"./components/data-view/DataViewTable";export*from"./components/forms";export*from"./components/layout";export{DefinitionList}from"./components/legal/atoms/DefinitionList";export{KeyValueList}from"./components/legal/atoms/KeyValueList";export{LegalCallout}from"./components/legal/atoms/LegalCallout";export{LegalHeading}from"./components/legal/atoms/LegalHeading";export{LegalList}from"./components/legal/atoms/LegalList";export{LegalSection}from"./components/legal/atoms/LegalSection";export{LegalText}from"./components/legal/atoms/LegalText";export{ConsentItem,ConsentList}from"./components/legal/molecules/Consent";export{ContactFields}from"./components/legal/molecules/ContactFields";export{LegalMeta}from"./components/legal/molecules/LegalMeta";export{LegalTOC}from"./components/legal/molecules/LegalTOC";export*from"./components/legal/organisms/ContactForm";export*from"./components/legal/organisms/GDPRDataRequest";export*from"./components/legal/organisms/GDPRRights";export*from"./components/legal/organisms/LegalPageLayout";export{ContactTemplate}from"./components/legal/templates/ContactTemplate";export{CookiesTemplate}from"./components/legal/templates/CookiesTemplate";export{PrivacyTemplate}from"./components/legal/templates/PrivacyTemplate";export{SalesTermsTemplate}from"./components/legal/templates/SalesTermsTemplate";export{TermsTemplate}from"./components/legal/templates/TermsTemplate";export{List,ListItem}from"./components/list";export{MarketingCard,MarketingCardContent,MarketingCardDescription,MarketingCardHeader,MarketingCardTitle}from"./components/marketing/MarketingCard";export{MarketingCardsSection}from"./components/marketing/MarketingCardsSection";export{MarketingComparisonSection}from"./components/marketing/MarketingComparisonSection";export{MarketingIconCard}from"./components/marketing/MarketingIconCard";export{MarketingSection}from"./components/marketing/MarketingSection";export{MarketingStepCard}from"./components/marketing/MarketingStepCard";export{AiLinkButton}from"./components/molecules/AiLinkButton";export{Breadcrumbs}from"./components/molecules/Breadcrumbs";export{CodeBlock}from"./components/molecules/CodeBlock";export{CommandPalette}from"./components/molecules/CommandPalette";export{CommandSearchTrigger}from"./components/molecules/CommandSearchTrigger";export{CommandTabs}from"./components/molecules/CommandTabs";export{CopyButton}from"./components/molecules/CopyButton";export{DimensionScoresCard}from"./components/molecules/DimensionScoresCard";export{EntityCard}from"./components/molecules/EntityCard";export{FiltersToolbar}from"./components/molecules/FiltersToolbar";export{HoverPreview}from"./components/molecules/HoverPreview";export{HoverPreviewDoc}from"./components/molecules/hover-previews/Doc";export{HoverPreviewMedia}from"./components/molecules/hover-previews/Media";export{HoverPreviewSimple}from"./components/molecules/hover-previews/Simple";export{HoverPreviewStats}from"./components/molecules/hover-previews/Stats";export{HoverPreviewUser}from"./components/molecules/hover-previews/User";export{InstallCommand}from"./components/molecules/InstallCommand";export{LangSwitch}from"./components/molecules/LangSwitch";export{LoaderBlock}from"./components/molecules/LoaderBlock";export{MarkdownRenderer}from"./components/molecules/MarkdownRenderer";export{NavMain}from"./components/molecules/NavMain";export{NavUser}from"./components/molecules/NavUser";export{OverviewCard}from"./components/molecules/OverviewCard";export{SkeletonBlock}from"./components/molecules/SkeletonBlock";export{SkeletonCircle}from"./components/molecules/SkeletonCircle";export{SkeletonList}from"./components/molecules/SkeletonList";export{StatCard,StatCardGroup}from"./components/molecules/StatCard";export{StatusChip}from"./components/molecules/StatusChip";export{Tabs,TabsContent,TabsList,TabsTrigger}from"./components/molecules/Tabs";export{createCopyReferenceAction,createDefaultObjectReferenceActions,createMapsProviderHref,createMapsReferenceActions,createOpenReferenceAction,createPhoneReferenceAction,getObjectReferenceDisplayValue,ObjectReferenceHandler}from"./components/object-reference";export{AcademyLayout}from"./components/organisms/AcademyLayout";export{AppHeader}from"./components/organisms/AppHeader";export{AppLayout}from"./components/organisms/AppLayout";export{AppSidebar}from"./components/organisms/AppSidebar";export{EmptyDataList}from"./components/organisms/EmptyDataList";export{EmptySearchResult}from"./components/organisms/EmptySearchResult";export{FAQSection}from"./components/organisms/FAQSection";export{FeatureCarousel}from"./components/organisms/FeatureCarousel";export{FeaturesSection}from"./components/organisms/FeaturesSection";export{Footer}from"./components/organisms/Footer";export{DesktopHeader,Header,MobileHeader}from"./components/organisms/Header";export{HeroResponsive}from"./components/organisms/HeroResponsive";export{HeroSection}from"./components/organisms/HeroSection";export{ListCardPage}from"./components/organisms/ListCardPage";export{ListGridPage}from"./components/organisms/ListGridPage";export{ListPageResponsive}from"./components/organisms/ListPageResponsive";export{ListTablePage}from"./components/organisms/ListTablePage";export{MarketingHeader}from"./components/organisms/MarketingHeader";export{MarketingHeaderDesktop}from"./components/organisms/MarketingHeaderDesktop";export{MarketingHeaderMobile}from"./components/organisms/MarketingHeaderMobile";export{MarketingLayout}from"./components/organisms/MarketingLayout";export{ModelComparisonView}from"./components/organisms/ModelComparisonView";export{PageHeaderResponsive}from"./components/organisms/PageHeaderResponsive";export{PricingCarousel}from"./components/organisms/PricingCarousel";export{PricingSection}from"./components/organisms/PricingSection";export{TestimonialCarousel}from"./components/organisms/TestimonialCarousel";export{PackageManagerProvider,usePackageManager}from"./components/providers/PackageManagerProvider";export{AppShell,PageOutline,ShellSidebar,usePageOutlineActiveItem}from"./components/shell";export{ListPageTemplate}from"./components/templates/lists/ListPageTemplate";export{BlockQuote,Code,H1,H2,H3,H4,Large,Lead,Muted,P,Small,Text}from"./components/typography";export{ComparisonView}from"./components/visualization/ComparisonView";export{TimelineView}from"./components/visualization/TimelineView";export{VisualizationCard}from"./components/visualization/VisualizationCard";export{VisualizationGrid}from"./components/visualization/VisualizationGrid";export{VisualizationRenderer}from"./components/visualization/VisualizationRenderer";export*from"./design-system.feature";export{useListUrlState}from"./hooks/useListUrlState";export*from"./i18n/translation";export{useColorScheme}from"./platform/useColorScheme";export{useReducedMotion}from"./platform/useReducedMotion";export{useResponsive}from"./platform/useResponsive";export*from"./platform/withPlatformUI";export*from"./renderers";export*from"./theme";export*from"./types/navigation";

package/dist/browser/renderers/form-contract/renderer.js

@@ -1 +1 @@
-import{shadcnDriver as j}from"@contractspec/lib.contracts-runtime-client-react/drivers/shadcn";import{createFormRenderer as q}from"@contractspec/lib.contracts-runtime-client-react/form-render";import{Autocomplete as z}from"../../components/forms/controls/Autocomplete";import{Checkbox as H,RadioGroup as J,Switch as K}from"../../components/forms/controls/ChoiceControls";import{DatePicker as M,DateTimePicker as N,TimePicker as O}from"../../components/forms/controls/DateTimeControls";import{FieldContent as Q,FieldGroup as U,FieldLegend as V,FieldSet as X,Field as Y,InputGroup as Z,InputGroupAddon as _}from"../../components/forms/controls/Field";import{Select as $}from"../../components/forms/controls/Select";import{AddressField as g,PhoneField as v}from"./rich-fields";import{Actions as B,FieldArray as E,FieldArrayItem as W,FormRoot as b,InputGroupIcon as f,TranslatedButton as w,TranslatedFieldDescription as y,TranslatedFieldError as C,TranslatedFieldLabel as L,TranslatedInput as R,TranslatedInputGroupInput as k,TranslatedInputGroupText as x,TranslatedInputGroupTextarea as D,TranslatedPasswordInput as S,TranslatedTextarea as P}from"./shell";export const formRenderer=q({submitMode:"button",driver:j({FormRoot:b,Field:Y,FieldLabel:L,FieldDescription:y,FieldError:C,FieldContent:Q,FieldGroup:U,FieldSet:X,FieldLegend:V,FieldArray:E,FieldArrayItem:W,Actions:B,Input:R,PasswordInput:S,Textarea:P,InputGroup:Z,InputGroupAddon:_,InputGroupInput:k,InputGroupTextarea:D,InputGroupText:x,InputGroupIcon:f,Select:$,Checkbox:H,RadioGroup:J,Switch:K,Autocomplete:z,AddressField:g,PhoneField:v,DateField:M,TimeField:O,DateTimeField:N,Button:w})});
+import{shadcnDriver as j}from"@contractspec/lib.contracts-runtime-client-react/drivers/shadcn";import{createFormRenderer as q}from"@contractspec/lib.contracts-runtime-client-react/form-render";import{Autocomplete as z}from"../../components/forms/controls/Autocomplete";import{Checkbox as H,RadioGroup as J,Switch as K}from"../../components/forms/controls/ChoiceControls";import{DatePicker as M,DateTimePicker as O,TimePicker as Q}from"../../components/forms/controls/DateTimeControls";import{FieldContent as U,FieldGroup as V,FieldLegend as X,FieldSet as Y,Field as Z,InputGroup as _,InputGroupAddon as $}from"../../components/forms/controls/Field";import{Select as g}from"../../components/forms/controls/Select";import{AddressField as v,PhoneField as B}from"./rich-fields";import{Actions as E,FieldArray as N,FieldArrayItem as W,FormRoot as f,InputGroupIcon as w,TranslatedButton as L,TranslatedCurrencyField as b,TranslatedDurationField as y,TranslatedFieldDescription as C,TranslatedFieldError as R,TranslatedFieldLabel as k,TranslatedInput as x,TranslatedInputGroupInput as S,TranslatedInputGroupText as D,TranslatedInputGroupTextarea as h,TranslatedNumberField as A,TranslatedPasswordInput as P,TranslatedPercentField as G,TranslatedTextarea as m}from"./shell";export const formRenderer=q({submitMode:"button",driver:j({FormRoot:f,Field:Z,FieldLabel:k,FieldDescription:C,FieldError:R,FieldContent:U,FieldGroup:V,FieldSet:Y,FieldLegend:X,FieldArray:N,FieldArrayItem:W,Actions:E,Input:x,NumberField:A,PercentField:G,CurrencyField:b,DurationField:y,PasswordInput:P,Textarea:m,InputGroup:_,InputGroupAddon:$,InputGroupInput:S,InputGroupTextarea:h,InputGroupText:D,InputGroupIcon:w,Select:g,Checkbox:H,RadioGroup:J,Switch:K,Autocomplete:z,AddressField:v,PhoneField:B,DateField:M,TimeField:Q,DateTimeField:O,Button:L})});

package/dist/browser/renderers/form-contract/shell.js

@@ -1 +1 @@
-import{jsx as z}from"react/jsx-runtime";import{CalendarIcon as Y,ClockIcon as Z,InfoIcon as X,MailIcon as $,SearchIcon as v,UserIcon as B}from"lucide-react";import{Button as D}from"../../components/atoms/Button";import{Input as E}from"../../components/atoms/Input";import{InputPassword as H}from"../../components/atoms/InputPassword";import{Textarea as M}from"../../components/atoms/Textarea";import{FieldDescription as U,FieldError as K,FieldLabel as F,InputGroupInput as L,InputGroupText as V,InputGroupTextarea as G}from"../../components/forms/controls/Field";import{HStack as P,VStack as W}from"../../components/layout/Stack";import{useTranslatedNode as J,useTranslatedText as O}from"../../components/primitives/themed";export const TranslatedFieldLabel=(g)=>{const q=J();return z(F,{...g,children:q(g.children)})},TranslatedFieldDescription=(g)=>{const q=J();return z(U,{...g,children:q(g.children)})},TranslatedFieldError=(g)=>{const q=J();return z(K,{...g,children:q(g.children)})},TranslatedInput=(g)=>{const q=O();return z(E,{...g,placeholder:q(g.placeholder)})},TranslatedPasswordInput=(g)=>{const q=O(),{showLabelI18n:A,hideLabelI18n:Q,...R}=g;return z(H,{...R,placeholder:q(g.placeholder),showLabel:q(A??g.showLabel),hideLabel:q(Q??g.hideLabel)})},TranslatedTextarea=(g)=>{const q=O();return z(M,{...g,placeholder:q(g.placeholder)})},TranslatedInputGroupInput=(g)=>{const q=O();return z(L,{...g,placeholder:q(g.placeholder)})},TranslatedInputGroupTextarea=(g)=>{const q=O();return z(G,{...g,placeholder:q(g.placeholder)})},TranslatedInputGroupText=(g)=>{const q=J();return z(V,{...g,children:q(g.children)})};const S={calendar:Y,clock:Z,info:X,mail:$,search:v,user:B};export const InputGroupIcon=({iconKey:g,label:q})=>{const A=S[g]??X;return z(A,{"aria-hidden":q?void 0:!0,"aria-label":q,className:"size-4"})},TranslatedButton=({children:g,onClick:q,onPress:A,...Q})=>{const R=J();return z(D,{...Q,onClick:q?()=>q():void 0,onPress:A??q,children:R(g)})},FormRoot=({children:g,className:q})=>z(W,{gap:"lg",className:q,children:g}),FieldArray=({children:g,className:q})=>z(W,{gap:"md",className:q,children:g}),FieldArrayItem=({children:g,className:q})=>z(W,{gap:"sm",className:q,children:g}),Actions=({children:g,className:q})=>z(P,{gap:"sm",wrap:"wrap",className:q,children:g});
+import{jsx as z}from"react/jsx-runtime";import{CalendarIcon as Y,ClockIcon as Z,InfoIcon as X,MailIcon as $,SearchIcon as v,UserIcon as B}from"lucide-react";import{Button as D}from"../../components/atoms/Button";import{Input as E}from"../../components/atoms/Input";import{InputPassword as H}from"../../components/atoms/InputPassword";import{Textarea as M}from"../../components/atoms/Textarea";import{FieldDescription as U,FieldError as K,FieldLabel as L,InputGroupInput as V,InputGroupText as G,InputGroupTextarea as P}from"../../components/forms/controls/Field";import{HStack as S,VStack as W}from"../../components/layout/Stack";import{useTranslatedNode as O,useTranslatedText as Q}from"../../components/primitives/themed";export const TranslatedFieldLabel=(g)=>{const q=O();return z(L,{...g,children:q(g.children)})},TranslatedFieldDescription=(g)=>{const q=O();return z(U,{...g,children:q(g.children)})},TranslatedFieldError=(g)=>{const q=O();return z(K,{...g,children:q(g.children)})},TranslatedInput=(g)=>{const q=Q();return z(E,{...g,placeholder:q(g.placeholder)})},TranslatedNumberField=({format:g,valueScale:q,valueUnit:A,...J})=>z(TranslatedInput,{...J}),TranslatedPercentField=TranslatedNumberField,TranslatedCurrencyField=TranslatedNumberField,TranslatedDurationField=TranslatedNumberField,TranslatedPasswordInput=(g)=>{const q=Q(),{showLabelI18n:A,hideLabelI18n:J,...R}=g;return z(H,{...R,placeholder:q(g.placeholder),showLabel:q(A??g.showLabel),hideLabel:q(J??g.hideLabel)})},TranslatedTextarea=(g)=>{const q=Q();return z(M,{...g,placeholder:q(g.placeholder)})},TranslatedInputGroupInput=(g)=>{const q=Q();return z(V,{...g,placeholder:q(g.placeholder)})},TranslatedInputGroupTextarea=(g)=>{const q=Q();return z(P,{...g,placeholder:q(g.placeholder)})},TranslatedInputGroupText=(g)=>{const q=O();return z(G,{...g,children:q(g.children)})};const F={calendar:Y,clock:Z,info:X,mail:$,search:v,user:B};export const InputGroupIcon=({iconKey:g,label:q})=>{const A=F[g]??X;return z(A,{"aria-hidden":q?void 0:!0,"aria-label":q,className:"size-4"})},TranslatedButton=({children:g,onClick:q,onPress:A,...J})=>{const R=O();return z(D,{...J,onClick:q?()=>q():void 0,onPress:A??q,children:R(g)})},FormRoot=({children:g,className:q})=>z(W,{gap:"lg",className:q,children:g}),FieldArray=({children:g,className:q})=>z(W,{gap:"md",className:q,children:g}),FieldArrayItem=({children:g,className:q})=>z(W,{gap:"sm",className:q,children:g}),Actions=({children:g,className:q})=>z(S,{gap:"sm",wrap:"wrap",className:q,children:g});

package/dist/browser/shell.js

@@ -0,0 +1 @@
+export*from"./components/shell";

package/dist/components/data-view/DataViewGrid.d.ts

@@ -0,0 +1,12 @@
+import type { DataViewDensity, DataViewSpec } from '@contractspec/lib.contracts-spec/data-views';
+import * as React from 'react';
+export interface DataViewGridProps<TItem = Record<string, unknown>> {
+    spec: DataViewSpec;
+    items: readonly TItem[];
+    className?: string;
+    renderActions?: (item: TItem) => React.ReactNode;
+    onSelect?: (item: TItem) => void;
+    emptyState?: React.ReactNode;
+    density?: DataViewDensity;
+}
+export declare function DataViewGrid<TItem = Record<string, unknown>>({ spec, items, className, renderActions, onSelect, emptyState, density, }: DataViewGridProps<TItem>): import("react/jsx-runtime").JSX.Element;

package/dist/components/data-view/DataViewGrid.js

@@ -0,0 +1 @@
+import{jsx as r}from"react/jsx-runtime";import{cn as m}from"../../lib/utils";import{DataViewList as p}from"./DataViewList";export function DataViewGrid({spec:e,items:o,className:a,renderActions:c,onSelect:n,emptyState:s,density:t="comfortable"}){if(e.view.kind!=="grid")throw Error(`DataViewGrid received view kind "${e.view.kind}", expected "grid".`);const i=e.view,d=i.columns??3,l={...e,view:{kind:"list",layout:"card",fields:i.fields,primaryField:i.primaryField,secondaryFields:i.secondaryFields,filters:i.filters,filterScope:i.filterScope,actions:i.actions,collection:i.collection}};return r("div",{className:m("grid w-full gap-4",t==="compact"&&"gap-3",w(d),a),children:r(p,{spec:l,items:o,className:"contents",renderActions:c,onSelect:n,emptyState:s,density:t})})}function w(e){if(e<=1)return"grid-cols-1";if(e===2)return"md:grid-cols-2";if(e===4)return"md:grid-cols-2 xl:grid-cols-4";return"md:grid-cols-2 lg:grid-cols-3"}

package/dist/components/data-view/DataViewGrid.native.d.ts

@@ -0,0 +1,12 @@
+import type { DataViewDensity, DataViewSpec } from '@contractspec/lib.contracts-spec/data-views';
+import * as React from 'react';
+export interface DataViewGridProps<TItem = Record<string, unknown>> {
+    spec: DataViewSpec;
+    items: readonly TItem[];
+    className?: string;
+    renderActions?: (item: TItem) => React.ReactNode;
+    onSelect?: (item: TItem) => void;
+    emptyState?: React.ReactNode;
+    density?: DataViewDensity;
+}
+export declare function DataViewGrid<TItem = Record<string, unknown>>({ spec, items, className, renderActions, onSelect, emptyState, density, }: DataViewGridProps<TItem>): import("react/jsx-runtime").JSX.Element;

package/dist/components/data-view/DataViewList.d.ts

@@ -1,4 +1,4 @@
-import type { DataViewSpec } from '@contractspec/lib.contracts-spec/data-views';
+import type { DataViewDensity, DataViewSpec } from '@contractspec/lib.contracts-spec/data-views';
 import * as React from 'react';
 export interface DataViewListProps<TItem = Record<string, unknown>> {
     spec: DataViewSpec;
@@ -7,5 +7,6 @@ export interface DataViewListProps<TItem = Record<string, unknown>> {
     renderActions?: (item: TItem) => React.ReactNode;
     onSelect?: (item: TItem) => void;
     emptyState?: React.ReactNode;
+    density?: DataViewDensity;
 }
-export declare function DataViewList<TItem = Record<string, unknown>>({ spec, items, className, renderActions, onSelect, emptyState, }: DataViewListProps<TItem>): import("react/jsx-runtime").JSX.Element;
+export declare function DataViewList<TItem = Record<string, unknown>>({ spec, items, className, renderActions, onSelect, emptyState, density, }: DataViewListProps<TItem>): import("react/jsx-runtime").JSX.Element;

package/dist/components/data-view/DataViewList.js

@@ -1 +1 @@
-import{jsx as t,jsxs as m}from"react/jsx-runtime";import{resolveTranslationString as w,useDesignSystemTranslation as k}from"../../i18n/translation";import{cn as c}from"../../lib/utils";import{DisplayValue as f}from"./DataViewTable";export function DataViewList({spec:e,items:r,className:i,renderActions:d,onSelect:u,emptyState:g}){const v=k();if(e.view.kind!=="list")throw Error(`DataViewList received view kind "${e.view.kind}", expected "list".`);const n=e.view,o=n.fields,l=n.primaryField??o.find((a)=>a.key===n.primaryField)?.key??o[0]?.key;if(!r.length)return t("div",{className:c("flex w-full flex-col gap-4",i),children:g??t("div",{className:"rounded-md border border-muted-foreground/40 border-dashed p-8 text-center text-muted-foreground text-sm",children:"No records available."})});return t("div",{className:c("flex w-full flex-col gap-4",i),children:r.map((a,b)=>{const p=y(a);return m("button",{type:"button",className:c("flex w-full flex-col gap-2 rounded-lg border border-muted bg-card p-4 text-left shadow-sm transition hover:border-primary/40 hover:shadow-md focus-visible:border-primary focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40",n.layout==="compact"&&"md:flex-row md:items-center md:gap-4"),onClick:()=>u?.(a),children:[m("div",{className:"flex flex-1 flex-col gap-1",children:[l?t("span",{className:"font-medium text-base text-foreground",children:t(f,{item:p,fields:o,fieldKey:l})}):null,t("div",{className:"flex flex-wrap gap-x-4 gap-y-1 text-muted-foreground text-sm",children:D(n,l).map((s)=>m("span",{className:"flex items-center gap-1.5",children:[t("span",{className:"font-medium text-foreground/80",children:x(o,s,v)}),t("span",{children:t(f,{item:p,fields:o,fieldKey:s})})]},s))})]}),d?t("div",{className:"flex shrink-0 items-center gap-2",children:d(a)}):null]},b)})})}function y(e){if(e&&typeof e==="object")return e;return{}}function x(e,r,i){return w(e.find((d)=>d.key===r)?.label??r,i)}function D(e,r){if(e.secondaryFields?.length)return e.secondaryFields;return e.fields.map((i)=>i.key).filter((i)=>i!==r)}
+import{jsx as t,jsxs as m}from"react/jsx-runtime";import{resolveTranslationString as y,useDesignSystemTranslation as D}from"../../i18n/translation";import{cn as c}from"../../lib/utils";import{DisplayValue as u}from"./DataViewTable";export function DataViewList({spec:e,items:r,className:i,renderActions:d,onSelect:g,emptyState:v,density:p="comfortable"}){const b=D();if(e.view.kind!=="list")throw Error(`DataViewList received view kind "${e.view.kind}", expected "list".`);const n=e.view,a=n.fields,l=n.primaryField??a.find((o)=>o.key===n.primaryField)?.key??a[0]?.key;if(!r.length)return t("div",{className:c("flex w-full flex-col gap-4",i),children:v??t("div",{className:"rounded-md border border-muted-foreground/40 border-dashed p-8 text-center text-muted-foreground text-sm",children:"No records available."})});return t("div",{className:c("flex w-full flex-col",p==="compact"?"gap-2":"gap-4",i),children:r.map((o,w)=>{const f=k(o);return m("button",{type:"button",className:c("flex w-full flex-col gap-2 rounded-lg border border-muted bg-card p-4 text-left shadow-sm transition hover:border-primary/40 hover:shadow-md focus-visible:border-primary focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40",p==="compact"&&"p-3",n.layout==="compact"&&"md:flex-row md:items-center md:gap-4"),onClick:()=>g?.(o),children:[m("div",{className:"flex flex-1 flex-col gap-1",children:[l?t("span",{className:"font-medium text-base text-foreground",children:t(u,{item:f,fields:a,fieldKey:l})}):null,t("div",{className:"flex flex-wrap gap-x-4 gap-y-1 text-muted-foreground text-sm",children:x(n,l).map((s)=>m("span",{className:"flex items-center gap-1.5",children:[t("span",{className:"font-medium text-foreground/80",children:V(a,s,b)}),t("span",{children:t(u,{item:f,fields:a,fieldKey:s})})]},s))})]}),d?t("div",{className:"flex shrink-0 items-center gap-2",children:d(o)}):null]},w)})})}function k(e){if(e&&typeof e==="object")return e;return{}}function V(e,r,i){return y(e.find((d)=>d.key===r)?.label??r,i)}function x(e,r){if(e.secondaryFields?.length)return e.secondaryFields;return e.fields.map((i)=>i.key).filter((i)=>i!==r)}

package/dist/components/data-view/DataViewList.native.d.ts

@@ -0,0 +1,12 @@
+import type { DataViewDensity, DataViewSpec } from '@contractspec/lib.contracts-spec/data-views';
+import * as React from 'react';
+export interface DataViewListProps<TItem = Record<string, unknown>> {
+    spec: DataViewSpec;
+    items: readonly TItem[];
+    className?: string;
+    renderActions?: (item: TItem) => React.ReactNode;
+    onSelect?: (item: TItem) => void;
+    emptyState?: React.ReactNode;
+    density?: DataViewDensity;
+}
+export declare function DataViewList<TItem = Record<string, unknown>>({ spec, items, className, renderActions, onSelect, emptyState, density, }: DataViewListProps<TItem>): import("react/jsx-runtime").JSX.Element;

package/dist/components/data-view/DataViewRenderer.d.ts

@@ -1,4 +1,4 @@
-import type { DataViewFilterSet, DataViewSpec } from '@contractspec/lib.contracts-spec/data-views';
+import type { DataViewCollectionMode, DataViewDensity, DataViewFilterSet, DataViewSpec } from '@contractspec/lib.contracts-spec/data-views';
 import * as React from 'react';
 export interface DataViewRendererProps {
     spec: DataViewSpec;
@@ -13,6 +13,12 @@ export interface DataViewRendererProps {
     headerActions?: React.ReactNode;
     emptyState?: React.ReactNode;
     footer?: React.ReactNode;
+    viewMode?: DataViewCollectionMode;
+    defaultViewMode?: DataViewCollectionMode;
+    onViewModeChange?: (mode: DataViewCollectionMode) => void;
+    density?: DataViewDensity;
+    defaultDensity?: DataViewDensity;
+    onDensityChange?: (density: DataViewDensity) => void;
     search?: string;
     onSearchChange?: (value: string) => void;
     filters?: Record<string, unknown> | DataViewFilterSet;
@@ -24,4 +30,4 @@ export interface DataViewRendererProps {
     };
     onPageChange?: (page: number) => void;
 }
-export declare function DataViewRenderer({ spec, items, item, className, renderActions, onSelect, onRowClick, toolbar, loading, headerActions, emptyState, footer, search, onSearchChange, filters, onFilterChange, pagination, onPageChange, }: DataViewRendererProps): import("react/jsx-runtime").JSX.Element;
+export declare function DataViewRenderer({ spec, items, item, className, renderActions, onSelect, onRowClick, toolbar, loading, headerActions, emptyState, footer, viewMode, defaultViewMode, onViewModeChange, density, defaultDensity, onDensityChange, search, onSearchChange, filters, onFilterChange, pagination, onPageChange, }: DataViewRendererProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/data-view/DataViewRenderer.js

@@ -1 +1 @@
-import{jsx as J,jsxs as c,Fragment as p}from"react/jsx-runtime";import{resolveDataViewFilters as S}from"@contractspec/lib.contracts-spec/data-views";import{Pagination as d}from"@contractspec/lib.ui-kit-web/ui/atoms/Pagination";import{VStack as h}from"@contractspec/lib.ui-kit-web/ui/stack";import{Text as f}from"@contractspec/lib.ui-kit-web/ui/text";import*as L from"react";import{resolveTranslationString as V,useDesignSystemTranslation as u}from"../../i18n/translation";import{FiltersToolbar as m}from"../molecules/FiltersToolbar";import{DataViewDetail as v}from"./DataViewDetail";import{DataViewList as b}from"./DataViewList";import{DataViewTable as y}from"./DataViewTable";export function DataViewRenderer({spec:B,items:G=[],item:X=null,className:M,renderActions:$,onSelect:q,onRowClick:P,toolbar:R,loading:T,headerActions:Y,emptyState:Q,footer:j,search:w,onSearchChange:_,filters:I,onFilterChange:Z,pagination:K,onPageChange:D}){const z=u(),O=L.useMemo(()=>S({filters:B.view.filters,scope:B.view.filterScope,user:g(I)}),[I,B.view.filterScope,B.view.filters]),N=L.useMemo(()=>{if(B.view.filterScope){const E=Object.entries(O.user).map(([H,W])=>({key:H,label:`${A(B,H)}: ${F(W)}`,onRemove:()=>{const{[H]:r,...C}=O.user;Z?.(C)}})),U=O.lockedChips==="hidden"?[]:Object.entries(O.locked).map(([H,W])=>({key:`locked-${H}`,label:`${A(B,H)}: ${F(W)}`,disabled:!0}));return[...E,...U]}return I?Object.entries(I).map(([E,U])=>({key:E,label:`${E}: ${String(U)}`,onRemove:()=>{const{[E]:H,...W}=I;Z?.(W)}})):[]},[I,Z,O,B]),k=B.view.filterScope?Object.keys(O.user).length>0:Boolean(I&&Object.keys(I).length>0),x=L.useMemo(()=>{switch(B.view.kind){case"list":return J(b,{spec:B,items:G,className:M,renderActions:$,onSelect:q,emptyState:Q});case"table":return J(y,{spec:B,items:G,className:M,onRowClick:P,toolbar:R,loading:T,emptyState:Q,headerActions:Y,footer:j});case"detail":return J(v,{spec:B,item:X,className:M,emptyState:Q,headerActions:Y});case"grid":{const E=B.view,U={kind:"list",layout:"card",fields:E.fields,filters:E.filters,actions:E.actions,primaryField:E.primaryField,secondaryFields:E.secondaryFields,filterScope:E.filterScope},H={...B,view:U};return J(b,{spec:H,items:G,className:M,renderActions:$,onSelect:q,emptyState:Q})}default:return J(f,{className:M,children:V("Unsupported data view kind",z)})}},[B,G,X,M,$,q,P,R,T,Y,Q,j,z]);if(!(B.view.kind==="list"||B.view.kind==="table"||B.view.kind==="grid"))return J(p,{children:x});return c(h,{gap:"lg",children:[(B.view.filters?.length||_||N.length)&&J(m,{searchValue:w,onSearchChange:_,searchPlaceholder:V("Search...",z)??"Search...",activeChips:N,onClearAll:k?()=>Z?.({}):void 0,right:B.view.kind==="table"?void 0:Y}),x,K&&K.total>0&&J(d,{currentPage:K.page,totalPages:Math.ceil(K.total/K.pageSize),totalItems:K.total,itemsPerPage:K.pageSize,onPageChange:(E)=>D?.(E),onItemsPerPageChange:(E)=>{D?.(1)},showItemsPerPage:!1})]})}function g(B){if(!B)return;return Object.fromEntries(Object.entries(B??{}).filter((G)=>Boolean(G[1]&&typeof G[1]==="object"&&"kind"in G[1]&&typeof G[1].kind==="string")))}function A(B,G){return B.view.filters?.find((X)=>X.key===G)?.label??G}function F(B){if(!B)return"";if(B.kind==="single")return String(B.value);if(B.kind==="multi")return B.values.map(String).join(", ");if(B.kind==="range")return[B.from==null?"":String(B.from),B.to==null?"":String(B.to)].filter(Boolean).join(" - ");return`${B.mode}(${B.clauses.length})`}
+import{jsx as W,jsxs as T,Fragment as hB}from"react/jsx-runtime";import{resolveDataViewFilters as GB}from"@contractspec/lib.contracts-spec/data-views";import{Pagination as qB}from"@contractspec/lib.ui-kit-web/ui/atoms/Pagination";import{VStack as KB}from"@contractspec/lib.ui-kit-web/ui/stack";import{Text as LB}from"@contractspec/lib.ui-kit-web/ui/text";import{Grid3X3 as IB,List as PB,Table2 as EB}from"lucide-react";import*as I from"react";import{resolveTranslationString as n,useDesignSystemTranslation as NB}from"../../i18n/translation";import{Button as V}from"../atoms/Button";import{Input as b}from"../atoms/Input";import{FiltersToolbar as RB}from"../molecules/FiltersToolbar";import{getDataViewCollectionConfig as TB,getDataViewCollectionViewModesConfig as AB,isDataViewCollectionKind as i,resolveAllowedCollectionModes as _B,resolveCollectionDensity as jB,resolveCollectionView as MB}from"./collection";import{DataViewDetail as VB}from"./DataViewDetail";import{DataViewGrid as kB}from"./DataViewGrid";import{DataViewList as SB}from"./DataViewList";import{DataViewTable as DB}from"./DataViewTable";export function DataViewRenderer({spec:B,items:H=[],item:O=null,className:U,renderActions:J,onSelect:Y,onRowClick:Z,toolbar:A,loading:q,headerActions:X,emptyState:E,footer:w,viewMode:F,defaultViewMode:C,onViewModeChange:HB,density:h,defaultDensity:g,onDensityChange:JB,search:OB,onSearchChange:y,filters:z,onFilterChange:N,pagination:K,onPageChange:p}){const k=NB(),S=I.useMemo(()=>_B(B.view),[B.view]),[QB,UB]=I.useState(C),u=F??QB??C,_=I.useMemo(()=>MB(B,u),[u,B]),[WB,YB]=I.useState(g),P=jB(B,{density:h??WB,defaultDensity:g}),ZB=TB(B.view),$B=AB(B.view),$=ZB?.toolbar,j=$?.enabled!==!1,v=$?.filters!==!1,M=$?.actions??"end",d=M==="start"||M==="both"?X:void 0,f=M==="end"||M==="both"?X:void 0,c=typeof $?.search==="object"?$.search:void 0,r=Boolean(j&&$?.search!==!1&&y),G=I.useMemo(()=>GB({filters:B.view.filters,scope:B.view.filterScope,user:bB(z)}),[z,B.view.filterScope,B.view.filters]),o=I.useMemo(()=>{if(B.view.filterScope){const Q=Object.entries(G.user).map(([L,R])=>({key:L,label:`${a(B,L)}: ${l(R)}`,onRemove:()=>{const{[L]:yB,...zB}=G.user;N?.(zB)}})),D=G.lockedChips==="hidden"?[]:Object.entries(G.locked).map(([L,R])=>({key:`locked-${L}`,label:`${a(B,L)}: ${l(R)}`,disabled:!0}));return[...Q,...D]}return z?Object.entries(z).map(([Q,D])=>({key:Q,label:`${Q}: ${String(D)}`,onRemove:()=>{const{[Q]:L,...R}=z;N?.(R)}})):[]},[z,N,G,B]),XB=B.view.filterScope?Object.keys(G.user).length>0:Boolean(z&&Object.keys(z).length>0),s=I.useMemo(()=>{const Q=i(B.view.kind)?_.spec:B;switch(Q.view.kind){case"list":return W(SB,{spec:Q,items:H,className:U,renderActions:J,onSelect:Y,emptyState:E,density:P});case"table":return W(DB,{spec:Q,items:H,className:U,onRowClick:Z,toolbar:A,loading:q,emptyState:E,headerActions:j?void 0:X,footer:w,density:P});case"detail":return W(VB,{spec:B,item:O,className:U,emptyState:E,headerActions:X});case"grid":return W(kB,{spec:Q,items:H,className:U,renderActions:J,onSelect:Y,emptyState:E,density:P});default:return W(LB,{className:U,children:n("Unsupported data view kind",k)})}},[B,_.spec,H,O,U,J,Y,Z,A,q,X,E,w,P,j,k]);if(!(B.view.kind==="list"||B.view.kind==="table"||B.view.kind==="grid"))return W(hB,{children:s});return T(KB,{gap:"lg",children:[j&&(v&&B.view.filters?.length||r||o.length||S.length>1||$?.density||d||f)?T(RB,{searchValue:OB,onSearchChange:r?y:void 0,searchPlaceholder:c?.placeholder??n("Search...",k)??"Search...",debounceMs:c?.debounceMs,activeChips:o,onClearAll:XB?()=>N?.({}):void 0,right:f,children:[d,S.length>1&&$?.viewMode!==!1?W(wB,{mode:_.mode,allowedModes:S,labels:i(B.view.kind)?$B?.labels:void 0,onChange:(Q)=>{if(Q===_.mode)return;if(F===void 0)UB(Q);HB?.(Q)}}):null,$?.density?W(FB,{density:P,onChange:(Q)=>{if(Q===P)return;if(h===void 0)YB(Q);JB?.(Q)}}):null,v?W(xB,{filters:B.view.filters,values:G.user,lockedKeys:Object.keys(G.locked),onFilterChange:N}):null]}):null,s,K&&K.total>0&&W(qB,{currentPage:K.page,totalPages:Math.ceil(K.total/K.pageSize),totalItems:K.total,itemsPerPage:K.pageSize,onPageChange:(Q)=>p?.(Q),onItemsPerPageChange:(Q)=>{p?.(1)},showItemsPerPage:!1})]})}function bB(B){if(!B)return;return Object.fromEntries(Object.entries(B??{}).filter((H)=>Boolean(H[1]&&typeof H[1]==="object"&&"kind"in H[1]&&typeof H[1].kind==="string")))}function a(B,H){return B.view.filters?.find((O)=>O.key===H)?.label??H}function l(B){if(!B)return"";if(B.kind==="single")return String(B.value);if(B.kind==="multi")return B.values.map(String).join(", ");if(B.kind==="range")return[B.from==null?"":String(B.from),B.to==null?"":String(B.to)].filter(Boolean).join(" - ");return`${B.mode}(${B.clauses.length})`}function xB({filters:B,values:H,lockedKeys:O,onFilterChange:U}){if(!B?.length||!U)return null;const J=new Set(O),Y=B.filter((Z)=>Z.type!=="search"&&!J.has(Z.key));if(Y.length===0)return null;return W("div",{className:"flex flex-wrap items-center gap-2",children:Y.map((Z)=>W(mB,{filter:Z,value:H[Z.key],values:H,onFilterChange:U},Z.key))})}function mB({filter:B,value:H,values:O,onFilterChange:U}){if(B.type==="boolean"){const J=H?.kind==="single"?H.value===!0:void 0;return T(V,{size:"sm",variant:"outline",onPress:()=>t(O,B.key,J===void 0?!0:!J,U),children:[B.label,": ",J?"Oui":"Non"]})}if(B.valueMode==="range"){const J=H?.kind==="range"?H:void 0;return T("div",{className:"flex min-w-0 items-center gap-2",children:[W(b,{type:x(B),inputMode:m(B),value:J?.from==null?"":String(J.from),onChange:(Y)=>e(O,B,"from",Y.currentTarget.value,U),placeholder:`${B.label} min`,className:"h-9 w-28"}),W(b,{type:x(B),inputMode:m(B),value:J?.to==null?"":String(J.to),onChange:(Y)=>e(O,B,"to",Y.currentTarget.value,U),placeholder:`${B.label} max`,className:"h-9 w-28"})]})}return W(b,{type:x(B),inputMode:m(B),value:H?.kind==="single"?String(H.value):"",onChange:(J)=>t(O,B.key,BB(B,J.currentTarget.value),U),placeholder:B.label,className:"h-9 w-36"})}function t(B,H,O,U){const J={...B};if(O===void 0||O==="")delete J[H];else J[H]={kind:"single",value:O};U(J)}function e(B,H,O,U,J){const Y=B[H.key],Z=Y?.kind==="range"?Y:{},A=BB(H,U),q={...Z,[O]:A};if(q.from==null&&q.to==null){const X={...B};delete X[H.key];J(X);return}J({...B,[H.key]:{kind:"range",from:q.from,to:q.to}})}function BB(B,H){if(H==="")return;switch(B.type){case"number":case"percent":case"currency":case"duration":{const O=Number(H);return Number.isFinite(O)?O:void 0}default:return H}}function x(B){switch(B.type){case"number":case"percent":case"currency":case"duration":return"number";case"date":return"date";case"time":return"time";case"datetime":return"datetime-local";default:return"text"}}function m(B){switch(B.type){case"number":case"percent":case"currency":case"duration":return"decimal";default:return}}function wB({mode:B,allowedModes:H,labels:O,onChange:U}){return W("div",{className:"flex items-center gap-1 rounded-md border bg-background p-1",children:H.map((J)=>{const Y=CB(J);return W(V,{size:"sm",variant:J===B?"default":"ghost",onPress:()=>U(J),ariaLabelI18n:O?.[J]??J,children:W(Y,{className:"h-4 w-4"})},J)})})}function FB({density:B,onChange:H}){return T("div",{className:"flex items-center gap-1 rounded-md border bg-background p-1",children:[W(V,{size:"sm",variant:B==="comfortable"?"default":"ghost",onPress:()=>H("comfortable"),children:"Comfort"}),W(V,{size:"sm",variant:B==="compact"?"default":"ghost",onPress:()=>H("compact"),children:"Compact"})]})}function CB(B){if(B==="grid")return IB;if(B==="table")return EB;return PB}

package/dist/components/data-view/DataViewRenderer.native.d.ts

@@ -1,4 +1,4 @@
-import type { DataViewFilterSet, DataViewSpec } from '@contractspec/lib.contracts-spec/data-views';
+import type { DataViewCollectionMode, DataViewDensity, DataViewFilterSet, DataViewSpec } from '@contractspec/lib.contracts-spec/data-views';
 import * as React from 'react';
 export interface DataViewRendererProps {
     spec: DataViewSpec;
@@ -13,6 +13,12 @@ export interface DataViewRendererProps {
     headerActions?: React.ReactNode;
     emptyState?: React.ReactNode;
     footer?: React.ReactNode;
+    viewMode?: DataViewCollectionMode;
+    defaultViewMode?: DataViewCollectionMode;
+    onViewModeChange?: (mode: DataViewCollectionMode) => void;
+    density?: DataViewDensity;
+    defaultDensity?: DataViewDensity;
+    onDensityChange?: (density: DataViewDensity) => void;
     search?: string;
     onSearchChange?: (value: string) => void;
     filters?: Record<string, unknown> | DataViewFilterSet;
@@ -24,4 +30,4 @@ export interface DataViewRendererProps {
     };
     onPageChange?: (page: number) => void;
 }
-export declare function DataViewRenderer({ spec, items, item, className, renderActions, onSelect, onRowClick, toolbar, loading, headerActions, emptyState, footer, search, onSearchChange, filters, onFilterChange, pagination, onPageChange, }: DataViewRendererProps): import("react/jsx-runtime").JSX.Element;
+export declare function DataViewRenderer({ spec, items, item, className, renderActions, onSelect, onRowClick, toolbar, loading, headerActions, emptyState, footer, viewMode, defaultViewMode, onViewModeChange, density, defaultDensity, onDensityChange, search, onSearchChange, filters, onFilterChange, pagination, onPageChange, }: DataViewRendererProps): import("react/jsx-runtime").JSX.Element;