@open-mercato/ui 0.7.0 → 0.7.1-develop.7102.1.b41f7e3e51

package/.turbo/turbo-build.log

@@ -1,3 +1,3 @@
-Generated lucide registry with 159 icons -> /home/runner/work/open-mercato/open-mercato/packages/ui/src/backend/icons/lucideRegistry.generated.tsx
+Generated lucide registry with 161 icons -> /home/runner/work/open-mercato/open-mercato/packages/ui/src/backend/icons/lucideRegistry.generated.tsx
 [build:ui] found 400 entry points
 [build:ui] built successfully

package/dist/ai/records/ActivityCard.js

@@ -10,7 +10,7 @@ import {
   Phone,
   StickyNote
 } from "lucide-react";
-import { useT } from "@open-mercato/shared/lib/i18n/context";
+import { useT, useLocale } from "@open-mercato/shared/lib/i18n/context";
 import { KeyValueList, RecordCardShell, TagRow, statusToTagVariant } from "./RecordCardShell.js";
 import { formatDate } from "../../utils/format.js";
 function pickActivityIcon(type) {
@@ -26,10 +26,11 @@ function pickActivityIcon(type) {
 }
 function ActivityCard(props) {
   const t = useT();
+  const locale = useLocale();
   const Icon = pickActivityIcon(props.type);
   const status = props.status ? { label: props.status, variant: statusToTagVariant(props.status) } : null;
-  const dueDate = formatDate(props.dueDate);
-  const completedAt = formatDate(props.completedAt);
+  const dueDate = formatDate(props.dueDate, locale);
+  const completedAt = formatDate(props.completedAt, locale);
   const items = [
     props.type ? { label: t("ai_assistant.chat.records.fields.type", "Type"), value: props.type } : null,
     dueDate ? {

package/dist/ai/records/ActivityCard.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/ai/records/ActivityCard.tsx"],
-  "sourcesContent": ["\"use client\"\n\nimport * as React from 'react'\nimport {\n  Activity as ActivityIcon,\n  CalendarClock,\n  CheckCircle2,\n  ListChecks,\n  Mail,\n  MessageSquare,\n  Phone,\n  StickyNote,\n} from 'lucide-react'\nimport type { LucideIcon } from 'lucide-react'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\nimport { KeyValueList, RecordCardShell, TagRow, statusToTagVariant } from './RecordCardShell'\nimport type { ActivityRecordPayload } from './types'\nimport { formatDate } from '../../utils/format'\n\nfunction pickActivityIcon(type: string | null | undefined): LucideIcon {\n  if (!type) return ActivityIcon\n  const t = type.toLowerCase()\n  if (t.includes('call')) return Phone\n  if (t.includes('mail') || t.includes('email')) return Mail\n  if (t.includes('meeting') || t.includes('chat')) return MessageSquare\n  if (t.includes('task') || t.includes('todo')) return ListChecks\n  if (t.includes('note')) return StickyNote\n  if (t.includes('done') || t.includes('complete')) return CheckCircle2\n  return ActivityIcon\n}\n\nexport interface ActivityCardProps extends ActivityRecordPayload {}\n\nexport function ActivityCard(props: ActivityCardProps) {\n  const t = useT()\n  const Icon = pickActivityIcon(props.type)\n  const status = props.status\n    ? { label: props.status, variant: statusToTagVariant(props.status) }\n    : null\n  const dueDate = formatDate(props.dueDate)\n  const completedAt = formatDate(props.completedAt)\n\n  const items = [\n    props.type ? { label: t('ai_assistant.chat.records.fields.type', 'Type'), value: props.type } : null,\n    dueDate\n      ? {\n          label: t('ai_assistant.chat.records.fields.due', 'Due'),\n          value: (\n            <span className=\"inline-flex items-center gap-1\">\n              <CalendarClock className=\"size-3 text-muted-foreground\" aria-hidden />\n              {dueDate}\n            </span>\n          ),\n        }\n      : null,\n    completedAt\n      ? {\n          label: t('ai_assistant.chat.records.fields.completed', 'Completed'),\n          value: (\n            <span className=\"inline-flex items-center gap-1\">\n              <CheckCircle2 className=\"size-3 text-status-success-icon\" aria-hidden />\n              {completedAt}\n            </span>\n          ),\n        }\n      : null,\n    props.relatedTo ? { label: t('ai_assistant.chat.records.fields.related', 'Related'), value: props.relatedTo } : null,\n    props.ownerName ? { label: t('ai_assistant.chat.records.fields.owner', 'Owner'), value: props.ownerName } : null,\n  ].filter(Boolean) as { label: string; value: React.ReactNode }[]\n\n  const subtitle = [props.type, props.relatedTo].filter(Boolean).join(' \u2022 ')\n\n  return (\n    <RecordCardShell\n      kindLabel={t('ai_assistant.chat.records.kinds.activity', 'Activity')}\n      kindIcon={<Icon className=\"size-4\" aria-hidden />}\n      title={props.title}\n      subtitle={subtitle || undefined}\n      status={status}\n      href={props.href}\n      id={props.id}\n      className={props.className}\n      dataKind=\"activity\"\n    >\n      <div className=\"space-y-2\">\n        <KeyValueList items={items} />\n        {props.description ? (\n          <p className=\"line-clamp-3 text-muted-foreground\">{props.description}</p>\n        ) : null}\n        {props.tags && props.tags.length > 0 ? <TagRow tags={props.tags} /> : null}\n      </div>\n    </RecordCardShell>\n  )\n}\n\nexport default ActivityCard\n"],
-  "mappings": ";AAgDY,SACE,KADF;AA7CZ;AAAA,EACE,YAAY;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,SAAS,YAAY;AACrB,SAAS,cAAc,iBAAiB,QAAQ,0BAA0B;AAE1E,SAAS,kBAAkB;AAE3B,SAAS,iBAAiB,MAA6C;AACrE,MAAI,CAAC,KAAM,QAAO;AAClB,QAAM,IAAI,KAAK,YAAY;AAC3B,MAAI,EAAE,SAAS,MAAM,EAAG,QAAO;AAC/B,MAAI,EAAE,SAAS,MAAM,KAAK,EAAE,SAAS,OAAO,EAAG,QAAO;AACtD,MAAI,EAAE,SAAS,SAAS,KAAK,EAAE,SAAS,MAAM,EAAG,QAAO;AACxD,MAAI,EAAE,SAAS,MAAM,KAAK,EAAE,SAAS,MAAM,EAAG,QAAO;AACrD,MAAI,EAAE,SAAS,MAAM,EAAG,QAAO;AAC/B,MAAI,EAAE,SAAS,MAAM,KAAK,EAAE,SAAS,UAAU,EAAG,QAAO;AACzD,SAAO;AACT;AAIO,SAAS,aAAa,OAA0B;AACrD,QAAM,IAAI,KAAK;AACf,QAAM,OAAO,iBAAiB,MAAM,IAAI;AACxC,QAAM,SAAS,MAAM,SACjB,EAAE,OAAO,MAAM,QAAQ,SAAS,mBAAmB,MAAM,MAAM,EAAE,IACjE;AACJ,QAAM,UAAU,WAAW,MAAM,OAAO;AACxC,QAAM,cAAc,WAAW,MAAM,WAAW;AAEhD,QAAM,QAAQ;AAAA,IACZ,MAAM,OAAO,EAAE,OAAO,EAAE,yCAAyC,MAAM,GAAG,OAAO,MAAM,KAAK,IAAI;AAAA,IAChG,UACI;AAAA,MACE,OAAO,EAAE,wCAAwC,KAAK;AAAA,MACtD,OACE,qBAAC,UAAK,WAAU,kCACd;AAAA,4BAAC,iBAAc,WAAU,gCAA+B,eAAW,MAAC;AAAA,QACnE;AAAA,SACH;AAAA,IAEJ,IACA;AAAA,IACJ,cACI;AAAA,MACE,OAAO,EAAE,8CAA8C,WAAW;AAAA,MAClE,OACE,qBAAC,UAAK,WAAU,kCACd;AAAA,4BAAC,gBAAa,WAAU,mCAAkC,eAAW,MAAC;AAAA,QACrE;AAAA,SACH;AAAA,IAEJ,IACA;AAAA,IACJ,MAAM,YAAY,EAAE,OAAO,EAAE,4CAA4C,SAAS,GAAG,OAAO,MAAM,UAAU,IAAI;AAAA,IAChH,MAAM,YAAY,EAAE,OAAO,EAAE,0CAA0C,OAAO,GAAG,OAAO,MAAM,UAAU,IAAI;AAAA,EAC9G,EAAE,OAAO,OAAO;AAEhB,QAAM,WAAW,CAAC,MAAM,MAAM,MAAM,SAAS,EAAE,OAAO,OAAO,EAAE,KAAK,UAAK;AAEzE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,EAAE,4CAA4C,UAAU;AAAA,MACnE,UAAU,oBAAC,QAAK,WAAU,UAAS,eAAW,MAAC;AAAA,MAC/C,OAAO,MAAM;AAAA,MACb,UAAU,YAAY;AAAA,MACtB;AAAA,MACA,MAAM,MAAM;AAAA,MACZ,IAAI,MAAM;AAAA,MACV,WAAW,MAAM;AAAA,MACjB,UAAS;AAAA,MAET,+BAAC,SAAI,WAAU,aACb;AAAA,4BAAC,gBAAa,OAAc;AAAA,QAC3B,MAAM,cACL,oBAAC,OAAE,WAAU,sCAAsC,gBAAM,aAAY,IACnE;AAAA,QACH,MAAM,QAAQ,MAAM,KAAK,SAAS,IAAI,oBAAC,UAAO,MAAM,MAAM,MAAM,IAAK;AAAA,SACxE;AAAA;AAAA,EACF;AAEJ;AAEA,IAAO,uBAAQ;",
+  "sourcesContent": ["\"use client\"\n\nimport * as React from 'react'\nimport {\n  Activity as ActivityIcon,\n  CalendarClock,\n  CheckCircle2,\n  ListChecks,\n  Mail,\n  MessageSquare,\n  Phone,\n  StickyNote,\n} from 'lucide-react'\nimport type { LucideIcon } from 'lucide-react'\nimport { useT, useLocale } from '@open-mercato/shared/lib/i18n/context'\nimport { KeyValueList, RecordCardShell, TagRow, statusToTagVariant } from './RecordCardShell'\nimport type { ActivityRecordPayload } from './types'\nimport { formatDate } from '../../utils/format'\n\nfunction pickActivityIcon(type: string | null | undefined): LucideIcon {\n  if (!type) return ActivityIcon\n  const t = type.toLowerCase()\n  if (t.includes('call')) return Phone\n  if (t.includes('mail') || t.includes('email')) return Mail\n  if (t.includes('meeting') || t.includes('chat')) return MessageSquare\n  if (t.includes('task') || t.includes('todo')) return ListChecks\n  if (t.includes('note')) return StickyNote\n  if (t.includes('done') || t.includes('complete')) return CheckCircle2\n  return ActivityIcon\n}\n\nexport interface ActivityCardProps extends ActivityRecordPayload {}\n\nexport function ActivityCard(props: ActivityCardProps) {\n  const t = useT()\n  const locale = useLocale()\n  const Icon = pickActivityIcon(props.type)\n  const status = props.status\n    ? { label: props.status, variant: statusToTagVariant(props.status) }\n    : null\n  const dueDate = formatDate(props.dueDate, locale)\n  const completedAt = formatDate(props.completedAt, locale)\n\n  const items = [\n    props.type ? { label: t('ai_assistant.chat.records.fields.type', 'Type'), value: props.type } : null,\n    dueDate\n      ? {\n          label: t('ai_assistant.chat.records.fields.due', 'Due'),\n          value: (\n            <span className=\"inline-flex items-center gap-1\">\n              <CalendarClock className=\"size-3 text-muted-foreground\" aria-hidden />\n              {dueDate}\n            </span>\n          ),\n        }\n      : null,\n    completedAt\n      ? {\n          label: t('ai_assistant.chat.records.fields.completed', 'Completed'),\n          value: (\n            <span className=\"inline-flex items-center gap-1\">\n              <CheckCircle2 className=\"size-3 text-status-success-icon\" aria-hidden />\n              {completedAt}\n            </span>\n          ),\n        }\n      : null,\n    props.relatedTo ? { label: t('ai_assistant.chat.records.fields.related', 'Related'), value: props.relatedTo } : null,\n    props.ownerName ? { label: t('ai_assistant.chat.records.fields.owner', 'Owner'), value: props.ownerName } : null,\n  ].filter(Boolean) as { label: string; value: React.ReactNode }[]\n\n  const subtitle = [props.type, props.relatedTo].filter(Boolean).join(' \u2022 ')\n\n  return (\n    <RecordCardShell\n      kindLabel={t('ai_assistant.chat.records.kinds.activity', 'Activity')}\n      kindIcon={<Icon className=\"size-4\" aria-hidden />}\n      title={props.title}\n      subtitle={subtitle || undefined}\n      status={status}\n      href={props.href}\n      id={props.id}\n      className={props.className}\n      dataKind=\"activity\"\n    >\n      <div className=\"space-y-2\">\n        <KeyValueList items={items} />\n        {props.description ? (\n          <p className=\"line-clamp-3 text-muted-foreground\">{props.description}</p>\n        ) : null}\n        {props.tags && props.tags.length > 0 ? <TagRow tags={props.tags} /> : null}\n      </div>\n    </RecordCardShell>\n  )\n}\n\nexport default ActivityCard\n"],
+  "mappings": ";AAiDY,SACE,KADF;AA9CZ;AAAA,EACE,YAAY;AAAA,EACZ;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,SAAS,MAAM,iBAAiB;AAChC,SAAS,cAAc,iBAAiB,QAAQ,0BAA0B;AAE1E,SAAS,kBAAkB;AAE3B,SAAS,iBAAiB,MAA6C;AACrE,MAAI,CAAC,KAAM,QAAO;AAClB,QAAM,IAAI,KAAK,YAAY;AAC3B,MAAI,EAAE,SAAS,MAAM,EAAG,QAAO;AAC/B,MAAI,EAAE,SAAS,MAAM,KAAK,EAAE,SAAS,OAAO,EAAG,QAAO;AACtD,MAAI,EAAE,SAAS,SAAS,KAAK,EAAE,SAAS,MAAM,EAAG,QAAO;AACxD,MAAI,EAAE,SAAS,MAAM,KAAK,EAAE,SAAS,MAAM,EAAG,QAAO;AACrD,MAAI,EAAE,SAAS,MAAM,EAAG,QAAO;AAC/B,MAAI,EAAE,SAAS,MAAM,KAAK,EAAE,SAAS,UAAU,EAAG,QAAO;AACzD,SAAO;AACT;AAIO,SAAS,aAAa,OAA0B;AACrD,QAAM,IAAI,KAAK;AACf,QAAM,SAAS,UAAU;AACzB,QAAM,OAAO,iBAAiB,MAAM,IAAI;AACxC,QAAM,SAAS,MAAM,SACjB,EAAE,OAAO,MAAM,QAAQ,SAAS,mBAAmB,MAAM,MAAM,EAAE,IACjE;AACJ,QAAM,UAAU,WAAW,MAAM,SAAS,MAAM;AAChD,QAAM,cAAc,WAAW,MAAM,aAAa,MAAM;AAExD,QAAM,QAAQ;AAAA,IACZ,MAAM,OAAO,EAAE,OAAO,EAAE,yCAAyC,MAAM,GAAG,OAAO,MAAM,KAAK,IAAI;AAAA,IAChG,UACI;AAAA,MACE,OAAO,EAAE,wCAAwC,KAAK;AAAA,MACtD,OACE,qBAAC,UAAK,WAAU,kCACd;AAAA,4BAAC,iBAAc,WAAU,gCAA+B,eAAW,MAAC;AAAA,QACnE;AAAA,SACH;AAAA,IAEJ,IACA;AAAA,IACJ,cACI;AAAA,MACE,OAAO,EAAE,8CAA8C,WAAW;AAAA,MAClE,OACE,qBAAC,UAAK,WAAU,kCACd;AAAA,4BAAC,gBAAa,WAAU,mCAAkC,eAAW,MAAC;AAAA,QACrE;AAAA,SACH;AAAA,IAEJ,IACA;AAAA,IACJ,MAAM,YAAY,EAAE,OAAO,EAAE,4CAA4C,SAAS,GAAG,OAAO,MAAM,UAAU,IAAI;AAAA,IAChH,MAAM,YAAY,EAAE,OAAO,EAAE,0CAA0C,OAAO,GAAG,OAAO,MAAM,UAAU,IAAI;AAAA,EAC9G,EAAE,OAAO,OAAO;AAEhB,QAAM,WAAW,CAAC,MAAM,MAAM,MAAM,SAAS,EAAE,OAAO,OAAO,EAAE,KAAK,UAAK;AAEzE,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,EAAE,4CAA4C,UAAU;AAAA,MACnE,UAAU,oBAAC,QAAK,WAAU,UAAS,eAAW,MAAC;AAAA,MAC/C,OAAO,MAAM;AAAA,MACb,UAAU,YAAY;AAAA,MACtB;AAAA,MACA,MAAM,MAAM;AAAA,MACZ,IAAI,MAAM;AAAA,MACV,WAAW,MAAM;AAAA,MACjB,UAAS;AAAA,MAET,+BAAC,SAAI,WAAU,aACb;AAAA,4BAAC,gBAAa,OAAc;AAAA,QAC3B,MAAM,cACL,oBAAC,OAAE,WAAU,sCAAsC,gBAAM,aAAY,IACnE;AAAA,QACH,MAAM,QAAQ,MAAM,KAAK,SAAS,IAAI,oBAAC,UAAO,MAAM,MAAM,MAAM,IAAK;AAAA,SACxE;AAAA;AAAA,EACF;AAEJ;AAEA,IAAO,uBAAQ;",
   "names": []
 }

package/dist/ai/records/DealCard.js

@@ -1,15 +1,16 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Briefcase, Building2, CalendarDays, CircleDollarSign, User } from "lucide-react";
-import { useT } from "@open-mercato/shared/lib/i18n/context";
+import { useT, useLocale } from "@open-mercato/shared/lib/i18n/context";
 import { KeyValueList, RecordCardShell, TagRow, statusToTagVariant } from "./RecordCardShell.js";
 import { formatCurrency, formatDate } from "../../utils/format.js";
 function DealCard(props) {
   const t = useT();
+  const locale = useLocale();
   const status = props.status ? { label: props.status, variant: statusToTagVariant(props.status) } : null;
   const stage = props.stage && props.stage !== props.status ? props.stage : null;
-  const amount = formatCurrency(props.amount, props.currency);
-  const closeDate = formatDate(props.closeDate);
+  const amount = formatCurrency(props.amount, props.currency, locale);
+  const closeDate = formatDate(props.closeDate, locale);
   const items = [
     stage ? { label: t("ai_assistant.chat.records.fields.stage", "Stage"), value: stage } : null,
     amount ? { label: t("ai_assistant.chat.records.fields.amount", "Amount"), value: /* @__PURE__ */ jsx("span", { className: "font-medium", children: amount }) } : null,

package/dist/ai/records/DealCard.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/ai/records/DealCard.tsx"],
-  "sourcesContent": ["\"use client\"\n\nimport * as React from 'react'\nimport { Briefcase, Building2, CalendarDays, CircleDollarSign, User } from 'lucide-react'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\nimport { KeyValueList, RecordCardShell, TagRow, statusToTagVariant } from './RecordCardShell'\nimport type { DealRecordPayload } from './types'\nimport { formatCurrency, formatDate } from '../../utils/format'\n\nexport interface DealCardProps extends DealRecordPayload {}\n\nexport function DealCard(props: DealCardProps) {\n  const t = useT()\n  const status = props.status\n    ? { label: props.status, variant: statusToTagVariant(props.status) }\n    : null\n  const stage = props.stage && props.stage !== props.status ? props.stage : null\n  const amount = formatCurrency(props.amount, props.currency)\n  const closeDate = formatDate(props.closeDate)\n\n  const items = [\n    stage ? { label: t('ai_assistant.chat.records.fields.stage', 'Stage'), value: stage } : null,\n    amount ? { label: t('ai_assistant.chat.records.fields.amount', 'Amount'), value: <span className=\"font-medium\">{amount}</span> } : null,\n    closeDate ? { label: t('ai_assistant.chat.records.fields.close', 'Close'), value: closeDate } : null,\n    props.companyName ? { label: t('ai_assistant.chat.records.fields.company', 'Company'), value: props.companyName } : null,\n    props.personName ? { label: t('ai_assistant.chat.records.fields.contact', 'Contact'), value: props.personName } : null,\n    props.ownerName ? { label: t('ai_assistant.chat.records.fields.owner', 'Owner'), value: props.ownerName } : null,\n  ].filter(Boolean) as { label: string; value: React.ReactNode }[]\n\n  const subtitleParts: string[] = []\n  if (props.companyName) subtitleParts.push(props.companyName)\n  if (props.personName && !props.companyName) subtitleParts.push(props.personName)\n  if (amount) subtitleParts.push(amount)\n\n  return (\n    <RecordCardShell\n      kindLabel={t('ai_assistant.chat.records.kinds.deal', 'Deal')}\n      kindIcon={<Briefcase className=\"size-4\" aria-hidden />}\n      title={props.title}\n      subtitle={subtitleParts.join(' \u2022 ')}\n      status={status}\n      href={props.href}\n      id={props.id}\n      className={props.className}\n      dataKind=\"deal\"\n    >\n      <div className=\"space-y-2\">\n        <KeyValueList items={items} />\n        {props.description ? (\n          <p className=\"line-clamp-2 text-muted-foreground\">{props.description}</p>\n        ) : null}\n        {props.tags && props.tags.length > 0 ? <TagRow tags={props.tags} /> : null}\n      </div>\n    </RecordCardShell>\n  )\n}\n\nexport default DealCard\n\n// Re-export icons consumers may want when extending the layout\nexport { Briefcase, Building2, CalendarDays, CircleDollarSign, User }\n"],
-  "mappings": ";AAsBqF,cAwB/E,YAxB+E;AAnBrF,SAAS,WAAW,WAAW,cAAc,kBAAkB,YAAY;AAC3E,SAAS,YAAY;AACrB,SAAS,cAAc,iBAAiB,QAAQ,0BAA0B;AAE1E,SAAS,gBAAgB,kBAAkB;AAIpC,SAAS,SAAS,OAAsB;AAC7C,QAAM,IAAI,KAAK;AACf,QAAM,SAAS,MAAM,SACjB,EAAE,OAAO,MAAM,QAAQ,SAAS,mBAAmB,MAAM,MAAM,EAAE,IACjE;AACJ,QAAM,QAAQ,MAAM,SAAS,MAAM,UAAU,MAAM,SAAS,MAAM,QAAQ;AAC1E,QAAM,SAAS,eAAe,MAAM,QAAQ,MAAM,QAAQ;AAC1D,QAAM,YAAY,WAAW,MAAM,SAAS;AAE5C,QAAM,QAAQ;AAAA,IACZ,QAAQ,EAAE,OAAO,EAAE,0CAA0C,OAAO,GAAG,OAAO,MAAM,IAAI;AAAA,IACxF,SAAS,EAAE,OAAO,EAAE,2CAA2C,QAAQ,GAAG,OAAO,oBAAC,UAAK,WAAU,eAAe,kBAAO,EAAQ,IAAI;AAAA,IACnI,YAAY,EAAE,OAAO,EAAE,0CAA0C,OAAO,GAAG,OAAO,UAAU,IAAI;AAAA,IAChG,MAAM,cAAc,EAAE,OAAO,EAAE,4CAA4C,SAAS,GAAG,OAAO,MAAM,YAAY,IAAI;AAAA,IACpH,MAAM,aAAa,EAAE,OAAO,EAAE,4CAA4C,SAAS,GAAG,OAAO,MAAM,WAAW,IAAI;AAAA,IAClH,MAAM,YAAY,EAAE,OAAO,EAAE,0CAA0C,OAAO,GAAG,OAAO,MAAM,UAAU,IAAI;AAAA,EAC9G,EAAE,OAAO,OAAO;AAEhB,QAAM,gBAA0B,CAAC;AACjC,MAAI,MAAM,YAAa,eAAc,KAAK,MAAM,WAAW;AAC3D,MAAI,MAAM,cAAc,CAAC,MAAM,YAAa,eAAc,KAAK,MAAM,UAAU;AAC/E,MAAI,OAAQ,eAAc,KAAK,MAAM;AAErC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,EAAE,wCAAwC,MAAM;AAAA,MAC3D,UAAU,oBAAC,aAAU,WAAU,UAAS,eAAW,MAAC;AAAA,MACpD,OAAO,MAAM;AAAA,MACb,UAAU,cAAc,KAAK,UAAK;AAAA,MAClC;AAAA,MACA,MAAM,MAAM;AAAA,MACZ,IAAI,MAAM;AAAA,MACV,WAAW,MAAM;AAAA,MACjB,UAAS;AAAA,MAET,+BAAC,SAAI,WAAU,aACb;AAAA,4BAAC,gBAAa,OAAc;AAAA,QAC3B,MAAM,cACL,oBAAC,OAAE,WAAU,sCAAsC,gBAAM,aAAY,IACnE;AAAA,QACH,MAAM,QAAQ,MAAM,KAAK,SAAS,IAAI,oBAAC,UAAO,MAAM,MAAM,MAAM,IAAK;AAAA,SACxE;AAAA;AAAA,EACF;AAEJ;AAEA,IAAO,mBAAQ;",
+  "sourcesContent": ["\"use client\"\n\nimport * as React from 'react'\nimport { Briefcase, Building2, CalendarDays, CircleDollarSign, User } from 'lucide-react'\nimport { useT, useLocale } from '@open-mercato/shared/lib/i18n/context'\nimport { KeyValueList, RecordCardShell, TagRow, statusToTagVariant } from './RecordCardShell'\nimport type { DealRecordPayload } from './types'\nimport { formatCurrency, formatDate } from '../../utils/format'\n\nexport interface DealCardProps extends DealRecordPayload {}\n\nexport function DealCard(props: DealCardProps) {\n  const t = useT()\n  const locale = useLocale()\n  const status = props.status\n    ? { label: props.status, variant: statusToTagVariant(props.status) }\n    : null\n  const stage = props.stage && props.stage !== props.status ? props.stage : null\n  const amount = formatCurrency(props.amount, props.currency, locale)\n  const closeDate = formatDate(props.closeDate, locale)\n\n  const items = [\n    stage ? { label: t('ai_assistant.chat.records.fields.stage', 'Stage'), value: stage } : null,\n    amount ? { label: t('ai_assistant.chat.records.fields.amount', 'Amount'), value: <span className=\"font-medium\">{amount}</span> } : null,\n    closeDate ? { label: t('ai_assistant.chat.records.fields.close', 'Close'), value: closeDate } : null,\n    props.companyName ? { label: t('ai_assistant.chat.records.fields.company', 'Company'), value: props.companyName } : null,\n    props.personName ? { label: t('ai_assistant.chat.records.fields.contact', 'Contact'), value: props.personName } : null,\n    props.ownerName ? { label: t('ai_assistant.chat.records.fields.owner', 'Owner'), value: props.ownerName } : null,\n  ].filter(Boolean) as { label: string; value: React.ReactNode }[]\n\n  const subtitleParts: string[] = []\n  if (props.companyName) subtitleParts.push(props.companyName)\n  if (props.personName && !props.companyName) subtitleParts.push(props.personName)\n  if (amount) subtitleParts.push(amount)\n\n  return (\n    <RecordCardShell\n      kindLabel={t('ai_assistant.chat.records.kinds.deal', 'Deal')}\n      kindIcon={<Briefcase className=\"size-4\" aria-hidden />}\n      title={props.title}\n      subtitle={subtitleParts.join(' \u2022 ')}\n      status={status}\n      href={props.href}\n      id={props.id}\n      className={props.className}\n      dataKind=\"deal\"\n    >\n      <div className=\"space-y-2\">\n        <KeyValueList items={items} />\n        {props.description ? (\n          <p className=\"line-clamp-2 text-muted-foreground\">{props.description}</p>\n        ) : null}\n        {props.tags && props.tags.length > 0 ? <TagRow tags={props.tags} /> : null}\n      </div>\n    </RecordCardShell>\n  )\n}\n\nexport default DealCard\n\n// Re-export icons consumers may want when extending the layout\nexport { Briefcase, Building2, CalendarDays, CircleDollarSign, User }\n"],
+  "mappings": ";AAuBqF,cAwB/E,YAxB+E;AApBrF,SAAS,WAAW,WAAW,cAAc,kBAAkB,YAAY;AAC3E,SAAS,MAAM,iBAAiB;AAChC,SAAS,cAAc,iBAAiB,QAAQ,0BAA0B;AAE1E,SAAS,gBAAgB,kBAAkB;AAIpC,SAAS,SAAS,OAAsB;AAC7C,QAAM,IAAI,KAAK;AACf,QAAM,SAAS,UAAU;AACzB,QAAM,SAAS,MAAM,SACjB,EAAE,OAAO,MAAM,QAAQ,SAAS,mBAAmB,MAAM,MAAM,EAAE,IACjE;AACJ,QAAM,QAAQ,MAAM,SAAS,MAAM,UAAU,MAAM,SAAS,MAAM,QAAQ;AAC1E,QAAM,SAAS,eAAe,MAAM,QAAQ,MAAM,UAAU,MAAM;AAClE,QAAM,YAAY,WAAW,MAAM,WAAW,MAAM;AAEpD,QAAM,QAAQ;AAAA,IACZ,QAAQ,EAAE,OAAO,EAAE,0CAA0C,OAAO,GAAG,OAAO,MAAM,IAAI;AAAA,IACxF,SAAS,EAAE,OAAO,EAAE,2CAA2C,QAAQ,GAAG,OAAO,oBAAC,UAAK,WAAU,eAAe,kBAAO,EAAQ,IAAI;AAAA,IACnI,YAAY,EAAE,OAAO,EAAE,0CAA0C,OAAO,GAAG,OAAO,UAAU,IAAI;AAAA,IAChG,MAAM,cAAc,EAAE,OAAO,EAAE,4CAA4C,SAAS,GAAG,OAAO,MAAM,YAAY,IAAI;AAAA,IACpH,MAAM,aAAa,EAAE,OAAO,EAAE,4CAA4C,SAAS,GAAG,OAAO,MAAM,WAAW,IAAI;AAAA,IAClH,MAAM,YAAY,EAAE,OAAO,EAAE,0CAA0C,OAAO,GAAG,OAAO,MAAM,UAAU,IAAI;AAAA,EAC9G,EAAE,OAAO,OAAO;AAEhB,QAAM,gBAA0B,CAAC;AACjC,MAAI,MAAM,YAAa,eAAc,KAAK,MAAM,WAAW;AAC3D,MAAI,MAAM,cAAc,CAAC,MAAM,YAAa,eAAc,KAAK,MAAM,UAAU;AAC/E,MAAI,OAAQ,eAAc,KAAK,MAAM;AAErC,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,EAAE,wCAAwC,MAAM;AAAA,MAC3D,UAAU,oBAAC,aAAU,WAAU,UAAS,eAAW,MAAC;AAAA,MACpD,OAAO,MAAM;AAAA,MACb,UAAU,cAAc,KAAK,UAAK;AAAA,MAClC;AAAA,MACA,MAAM,MAAM;AAAA,MACZ,IAAI,MAAM;AAAA,MACV,WAAW,MAAM;AAAA,MACjB,UAAS;AAAA,MAET,+BAAC,SAAI,WAAU,aACb;AAAA,4BAAC,gBAAa,OAAc;AAAA,QAC3B,MAAM,cACL,oBAAC,OAAE,WAAU,sCAAsC,gBAAM,aAAY,IACnE;AAAA,QACH,MAAM,QAAQ,MAAM,KAAK,SAAS,IAAI,oBAAC,UAAO,MAAM,MAAM,MAAM,IAAK;AAAA,SACxE;AAAA;AAAA,EACF;AAEJ;AAEA,IAAO,mBAAQ;",
   "names": []
 }

package/dist/ai/records/ProductCard.js

@@ -1,13 +1,14 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Package, Tag as TagIcon } from "lucide-react";
-import { useT } from "@open-mercato/shared/lib/i18n/context";
+import { useT, useLocale } from "@open-mercato/shared/lib/i18n/context";
 import { KeyValueList, RecordCardShell, TagRow, statusToTagVariant } from "./RecordCardShell.js";
 import { formatCurrency } from "../../utils/format.js";
 function ProductCard(props) {
   const t = useT();
+  const locale = useLocale();
   const status = props.status ? { label: props.status, variant: statusToTagVariant(props.status) } : null;
-  const price = formatCurrency(props.price, props.currency);
+  const price = formatCurrency(props.price, props.currency, locale);
   const leading = props.imageUrl ? /* @__PURE__ */ jsx("div", { className: "relative size-12 overflow-hidden rounded-md border border-border bg-muted", children: /* @__PURE__ */ jsx(
     "img",
     {

package/dist/ai/records/ProductCard.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/ai/records/ProductCard.tsx"],
-  "sourcesContent": ["\"use client\"\n\nimport * as React from 'react'\nimport { Package, Tag as TagIcon } from 'lucide-react'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\nimport { KeyValueList, RecordCardShell, TagRow, statusToTagVariant } from './RecordCardShell'\nimport type { ProductRecordPayload } from './types'\nimport { formatCurrency } from '../../utils/format'\n\nexport interface ProductCardProps extends ProductRecordPayload {}\n\nexport function ProductCard(props: ProductCardProps) {\n  const t = useT()\n  const status = props.status\n    ? { label: props.status, variant: statusToTagVariant(props.status) }\n    : null\n  const price = formatCurrency(props.price, props.currency)\n\n  const leading = props.imageUrl ? (\n    <div className=\"relative size-12 overflow-hidden rounded-md border border-border bg-muted\">\n      <img\n        src={props.imageUrl}\n        alt={props.name}\n        className=\"size-full object-cover\"\n        loading=\"lazy\"\n      />\n    </div>\n  ) : (\n    <div className=\"flex size-12 items-center justify-center rounded-md border border-border bg-muted text-muted-foreground\" aria-hidden>\n      <Package className=\"size-5\" />\n    </div>\n  )\n\n  const items = [\n    props.sku ? { label: t('ai_assistant.chat.records.fields.sku', 'SKU'), value: <span className=\"font-mono text-[11px]\">{props.sku}</span> } : null,\n    price ? { label: t('ai_assistant.chat.records.fields.price', 'Price'), value: <span className=\"font-medium\">{price}</span> } : null,\n    props.category ? { label: t('ai_assistant.chat.records.fields.category', 'Category'), value: props.category } : null,\n  ].filter(Boolean) as { label: string; value: React.ReactNode }[]\n\n  return (\n    <RecordCardShell\n      kindLabel={t('ai_assistant.chat.records.kinds.product', 'Product')}\n      kindIcon={<Package className=\"size-4\" aria-hidden />}\n      leading={leading}\n      title={props.name}\n      subtitle={[props.sku, price].filter(Boolean).join(' \u2022 ') || undefined}\n      status={status}\n      href={props.href}\n      id={props.id}\n      className={props.className}\n      dataKind=\"product\"\n    >\n      <div className=\"space-y-2\">\n        <KeyValueList items={items} />\n        {props.description ? (\n          <p className=\"line-clamp-2 text-muted-foreground\">{props.description}</p>\n        ) : null}\n        {props.tags && props.tags.length > 0 ? <TagRow tags={props.tags} /> : null}\n      </div>\n    </RecordCardShell>\n  )\n}\n\nexport default ProductCard\n\nexport { Package, TagIcon }\n"],
-  "mappings": ";AAoBM,cAgCA,YAhCA;AAjBN,SAAS,SAAS,OAAO,eAAe;AACxC,SAAS,YAAY;AACrB,SAAS,cAAc,iBAAiB,QAAQ,0BAA0B;AAE1E,SAAS,sBAAsB;AAIxB,SAAS,YAAY,OAAyB;AACnD,QAAM,IAAI,KAAK;AACf,QAAM,SAAS,MAAM,SACjB,EAAE,OAAO,MAAM,QAAQ,SAAS,mBAAmB,MAAM,MAAM,EAAE,IACjE;AACJ,QAAM,QAAQ,eAAe,MAAM,OAAO,MAAM,QAAQ;AAExD,QAAM,UAAU,MAAM,WACpB,oBAAC,SAAI,WAAU,6EACb;AAAA,IAAC;AAAA;AAAA,MACC,KAAK,MAAM;AAAA,MACX,KAAK,MAAM;AAAA,MACX,WAAU;AAAA,MACV,SAAQ;AAAA;AAAA,EACV,GACF,IAEA,oBAAC,SAAI,WAAU,2GAA0G,eAAW,MAClI,8BAAC,WAAQ,WAAU,UAAS,GAC9B;AAGF,QAAM,QAAQ;AAAA,IACZ,MAAM,MAAM,EAAE,OAAO,EAAE,wCAAwC,KAAK,GAAG,OAAO,oBAAC,UAAK,WAAU,yBAAyB,gBAAM,KAAI,EAAQ,IAAI;AAAA,IAC7I,QAAQ,EAAE,OAAO,EAAE,0CAA0C,OAAO,GAAG,OAAO,oBAAC,UAAK,WAAU,eAAe,iBAAM,EAAQ,IAAI;AAAA,IAC/H,MAAM,WAAW,EAAE,OAAO,EAAE,6CAA6C,UAAU,GAAG,OAAO,MAAM,SAAS,IAAI;AAAA,EAClH,EAAE,OAAO,OAAO;AAEhB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,EAAE,2CAA2C,SAAS;AAAA,MACjE,UAAU,oBAAC,WAAQ,WAAU,UAAS,eAAW,MAAC;AAAA,MAClD;AAAA,MACA,OAAO,MAAM;AAAA,MACb,UAAU,CAAC,MAAM,KAAK,KAAK,EAAE,OAAO,OAAO,EAAE,KAAK,UAAK,KAAK;AAAA,MAC5D;AAAA,MACA,MAAM,MAAM;AAAA,MACZ,IAAI,MAAM;AAAA,MACV,WAAW,MAAM;AAAA,MACjB,UAAS;AAAA,MAET,+BAAC,SAAI,WAAU,aACb;AAAA,4BAAC,gBAAa,OAAc;AAAA,QAC3B,MAAM,cACL,oBAAC,OAAE,WAAU,sCAAsC,gBAAM,aAAY,IACnE;AAAA,QACH,MAAM,QAAQ,MAAM,KAAK,SAAS,IAAI,oBAAC,UAAO,MAAM,MAAM,MAAM,IAAK;AAAA,SACxE;AAAA;AAAA,EACF;AAEJ;AAEA,IAAO,sBAAQ;",
+  "sourcesContent": ["\"use client\"\n\nimport * as React from 'react'\nimport { Package, Tag as TagIcon } from 'lucide-react'\nimport { useT, useLocale } from '@open-mercato/shared/lib/i18n/context'\nimport { KeyValueList, RecordCardShell, TagRow, statusToTagVariant } from './RecordCardShell'\nimport type { ProductRecordPayload } from './types'\nimport { formatCurrency } from '../../utils/format'\n\nexport interface ProductCardProps extends ProductRecordPayload {}\n\nexport function ProductCard(props: ProductCardProps) {\n  const t = useT()\n  const locale = useLocale()\n  const status = props.status\n    ? { label: props.status, variant: statusToTagVariant(props.status) }\n    : null\n  const price = formatCurrency(props.price, props.currency, locale)\n\n  const leading = props.imageUrl ? (\n    <div className=\"relative size-12 overflow-hidden rounded-md border border-border bg-muted\">\n      <img\n        src={props.imageUrl}\n        alt={props.name}\n        className=\"size-full object-cover\"\n        loading=\"lazy\"\n      />\n    </div>\n  ) : (\n    <div className=\"flex size-12 items-center justify-center rounded-md border border-border bg-muted text-muted-foreground\" aria-hidden>\n      <Package className=\"size-5\" />\n    </div>\n  )\n\n  const items = [\n    props.sku ? { label: t('ai_assistant.chat.records.fields.sku', 'SKU'), value: <span className=\"font-mono text-[11px]\">{props.sku}</span> } : null,\n    price ? { label: t('ai_assistant.chat.records.fields.price', 'Price'), value: <span className=\"font-medium\">{price}</span> } : null,\n    props.category ? { label: t('ai_assistant.chat.records.fields.category', 'Category'), value: props.category } : null,\n  ].filter(Boolean) as { label: string; value: React.ReactNode }[]\n\n  return (\n    <RecordCardShell\n      kindLabel={t('ai_assistant.chat.records.kinds.product', 'Product')}\n      kindIcon={<Package className=\"size-4\" aria-hidden />}\n      leading={leading}\n      title={props.name}\n      subtitle={[props.sku, price].filter(Boolean).join(' \u2022 ') || undefined}\n      status={status}\n      href={props.href}\n      id={props.id}\n      className={props.className}\n      dataKind=\"product\"\n    >\n      <div className=\"space-y-2\">\n        <KeyValueList items={items} />\n        {props.description ? (\n          <p className=\"line-clamp-2 text-muted-foreground\">{props.description}</p>\n        ) : null}\n        {props.tags && props.tags.length > 0 ? <TagRow tags={props.tags} /> : null}\n      </div>\n    </RecordCardShell>\n  )\n}\n\nexport default ProductCard\n\nexport { Package, TagIcon }\n"],
+  "mappings": ";AAqBM,cAgCA,YAhCA;AAlBN,SAAS,SAAS,OAAO,eAAe;AACxC,SAAS,MAAM,iBAAiB;AAChC,SAAS,cAAc,iBAAiB,QAAQ,0BAA0B;AAE1E,SAAS,sBAAsB;AAIxB,SAAS,YAAY,OAAyB;AACnD,QAAM,IAAI,KAAK;AACf,QAAM,SAAS,UAAU;AACzB,QAAM,SAAS,MAAM,SACjB,EAAE,OAAO,MAAM,QAAQ,SAAS,mBAAmB,MAAM,MAAM,EAAE,IACjE;AACJ,QAAM,QAAQ,eAAe,MAAM,OAAO,MAAM,UAAU,MAAM;AAEhE,QAAM,UAAU,MAAM,WACpB,oBAAC,SAAI,WAAU,6EACb;AAAA,IAAC;AAAA;AAAA,MACC,KAAK,MAAM;AAAA,MACX,KAAK,MAAM;AAAA,MACX,WAAU;AAAA,MACV,SAAQ;AAAA;AAAA,EACV,GACF,IAEA,oBAAC,SAAI,WAAU,2GAA0G,eAAW,MAClI,8BAAC,WAAQ,WAAU,UAAS,GAC9B;AAGF,QAAM,QAAQ;AAAA,IACZ,MAAM,MAAM,EAAE,OAAO,EAAE,wCAAwC,KAAK,GAAG,OAAO,oBAAC,UAAK,WAAU,yBAAyB,gBAAM,KAAI,EAAQ,IAAI;AAAA,IAC7I,QAAQ,EAAE,OAAO,EAAE,0CAA0C,OAAO,GAAG,OAAO,oBAAC,UAAK,WAAU,eAAe,iBAAM,EAAQ,IAAI;AAAA,IAC/H,MAAM,WAAW,EAAE,OAAO,EAAE,6CAA6C,UAAU,GAAG,OAAO,MAAM,SAAS,IAAI;AAAA,EAClH,EAAE,OAAO,OAAO;AAEhB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,EAAE,2CAA2C,SAAS;AAAA,MACjE,UAAU,oBAAC,WAAQ,WAAU,UAAS,eAAW,MAAC;AAAA,MAClD;AAAA,MACA,OAAO,MAAM;AAAA,MACb,UAAU,CAAC,MAAM,KAAK,KAAK,EAAE,OAAO,OAAO,EAAE,KAAK,UAAK,KAAK;AAAA,MAC5D;AAAA,MACA,MAAM,MAAM;AAAA,MACZ,IAAI,MAAM;AAAA,MACV,WAAW,MAAM;AAAA,MACjB,UAAS;AAAA,MAET,+BAAC,SAAI,WAAU,aACb;AAAA,4BAAC,gBAAa,OAAc;AAAA,QAC3B,MAAM,cACL,oBAAC,OAAE,WAAU,sCAAsC,gBAAM,aAAY,IACnE;AAAA,QACH,MAAM,QAAQ,MAAM,KAAK,SAAS,IAAI,oBAAC,UAAO,MAAM,MAAM,MAAM,IAAK;AAAA,SACxE;AAAA;AAAA,EACF;AAEJ;AAEA,IAAO,sBAAQ;",
   "names": []
 }

package/dist/backend/AppShell.js

@@ -267,6 +267,12 @@ function resolveItemKey(item) {
   if (candidate && candidate.length > 0) return candidate;
   return item.href;
 }
+function sidebarBlockPadding(compact) {
+  return `${compact ? "px-2" : "px-3"} transition-[padding] duration-200 ease-out`;
+}
+function sidebarInjectionWrapper(compact) {
+  return `${sidebarBlockPadding(compact)} empty:hidden`;
+}
 function SerializedIcon({ markup }) {
   return /* @__PURE__ */ jsx("span", { "aria-hidden": "true", dangerouslySetInnerHTML: { __html: markup } });
 }
@@ -528,10 +534,6 @@ function AppShellBody({ productName, logo, email, canManageUpgradeActions = fals
     const key = resolveGroupKey(activeGroup);
     setOpenGroups((prev) => prev[key] === false ? { ...prev, [key]: true } : prev);
   }, [pathname, navGroups]);
-  React.useEffect(() => {
-    setHeaderTitle(currentTitle);
-    setHeaderBreadcrumb(breadcrumb);
-  }, [currentTitle, breadcrumb]);
   const prevPathname = React.useRef(pathname);
   useIsomorphicLayoutEffect(() => {
     if (pathname !== prevPathname.current) {
@@ -540,14 +542,19 @@ function AppShellBody({ productName, logo, email, canManageUpgradeActions = fals
       setHeaderBreadcrumb(void 0);
     }
   }, [pathname]);
+  useIsomorphicLayoutEffect(() => {
+    setHeaderTitle(currentTitle);
+    setHeaderBreadcrumb(breadcrumb);
+  }, [currentTitle, breadcrumb]);
   React.useEffect(() => {
     setNavGroups(cloneSidebarGroups(resolvedGroups));
   }, [resolvedGroups]);
   function renderSectionSidebar(sections, title, compact, hideHeader, hideSearch) {
     const sortedSections = [...sections].sort((a, b) => (a.order ?? 0) - (b.order ?? 0));
     const lastVisibleIndex = sortedSections.length - 1;
+    const blockPadding = sidebarBlockPadding(compact);
     return /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-col gap-3", children: [
-      !hideHeader && /* @__PURE__ */ jsx("div", { className: "mb-2", children: /* @__PURE__ */ jsxs(
+      !hideHeader && /* @__PURE__ */ jsx("div", { className: `mb-2 ${blockPadding}`, children: /* @__PURE__ */ jsxs(
         Link,
         {
           href: "/backend",
@@ -559,7 +566,7 @@ function AppShellBody({ productName, logo, email, canManageUpgradeActions = fals
           ]
         }
       ) }),
-      !compact && !hideSearch && /* @__PURE__ */ jsx(
+      !compact && !hideSearch && /* @__PURE__ */ jsx("div", { className: blockPadding, children: /* @__PURE__ */ jsx(
         SearchInput,
         {
           value: navQuery,
@@ -569,8 +576,8 @@ function AppShellBody({ productName, logo, email, canManageUpgradeActions = fals
           clearLabel: t("appShell.searchNavClear", "Clear search"),
           className: "mb-2"
         }
-      ),
-      /* @__PURE__ */ jsx("div", { "data-sidebar-scroll": "true", className: `flex flex-1 flex-col gap-3 overflow-y-auto scrollbar-hide pr-1 ${compact ? "-ml-2 pl-2" : "-ml-3 pl-3"}`, children: /* @__PURE__ */ jsx("nav", { className: "flex flex-col gap-2", children: sortedSections.map((section, sectionIndex) => {
+      ) }),
+      /* @__PURE__ */ jsx("div", { "data-sidebar-scroll": "true", className: "flex flex-1 flex-col gap-3 overflow-x-hidden overflow-y-auto scrollbar-hide", children: /* @__PURE__ */ jsx("nav", { className: "flex flex-col gap-2", children: sortedSections.map((section, sectionIndex) => {
         const sectionNavQueryActive = hideSearch ? false : navQueryActive;
         const matchesItemQuery = (item) => {
           if (!sectionNavQueryActive) return true;
@@ -627,29 +634,38 @@ function AppShellBody({ productName, logo, email, canManageUpgradeActions = fals
             showChildren ? childItems.map((child) => renderSectionItem(child, depth + 1)) : null
           ] }, item.id);
         };
-        return /* @__PURE__ */ jsxs("div", { children: [
-          !compact && /* @__PURE__ */ jsxs(
-            Button,
-            {
-              variant: "muted",
-              onClick: () => toggleGroup(sectionKey),
-              className: "w-full px-1 justify-between flex text-xs font-medium uppercase tracking-wider text-muted-foreground/70 py-1",
-              "aria-expanded": open,
-              children: [
-                /* @__PURE__ */ jsx("span", { children: sectionLabel }),
-                /* @__PURE__ */ jsx(Chevron, { open })
-              ]
-            }
-          ),
-          (open || compact) && /* @__PURE__ */ jsx("div", { className: `flex flex-col ${compact ? "items-center" : ""} gap-1`, children: sortedItems.map((item) => renderSectionItem(item)) }),
-          sectionIndex !== lastVisibleIndex && /* @__PURE__ */ jsx("div", { className: `my-2 border-t ${compact ? "-ml-2 -mr-3" : "-ml-3 -mr-4"}` })
-        ] }, section.id);
+        return /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: `${blockPadding} ${sectionIndex !== lastVisibleIndex ? "border-b pb-2" : ""}`,
+            "data-sidebar-group": "true",
+            children: [
+              !compact && /* @__PURE__ */ jsxs(
+                Button,
+                {
+                  variant: "muted",
+                  onClick: () => toggleGroup(sectionKey),
+                  className: "w-full px-1 justify-between flex text-xs font-medium uppercase tracking-wider text-muted-foreground/70 py-1",
+                  "aria-expanded": open,
+                  children: [
+                    /* @__PURE__ */ jsx("span", { children: sectionLabel }),
+                    /* @__PURE__ */ jsx(Chevron, { open })
+                  ]
+                }
+              ),
+              (open || compact) && /* @__PURE__ */ jsx("div", { className: `flex flex-col ${compact ? "items-center" : ""} gap-1`, children: sortedItems.map((item) => renderSectionItem(item)) })
+            ]
+          },
+          section.id
+        );
       }) }) })
     ] });
   }
   function renderSidebar(compact, hideHeader, forceMainOnly) {
+    const blockPadding = sidebarBlockPadding(compact);
+    const injectionWrapper = sidebarInjectionWrapper(compact);
     if (!isChromeReady && isChromeLoading) {
-      return /* @__PURE__ */ jsxs("div", { className: "flex flex-col min-h-full gap-3", "data-testid": "backend-chrome-loading", children: [
+      return /* @__PURE__ */ jsxs("div", { className: `flex min-h-full flex-col gap-3 ${blockPadding}`, "data-testid": "backend-chrome-loading", children: [
         !hideHeader ? /* @__PURE__ */ jsx("div", { className: "mb-2", children: /* @__PURE__ */ jsxs(
           Link,
           {
@@ -662,7 +678,7 @@ function AppShellBody({ productName, logo, email, canManageUpgradeActions = fals
             ]
           }
         ) }) : null,
-        /* @__PURE__ */ jsxs("div", { className: "flex flex-1 flex-col gap-3 pr-1", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex flex-1 flex-col gap-3", children: [
           /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
             /* @__PURE__ */ jsx("div", { className: "h-8 rounded bg-muted/50" }),
             /* @__PURE__ */ jsxs("div", { className: "space-y-2 pl-1", children: [
@@ -710,7 +726,7 @@ function AppShellBody({ productName, logo, email, canManageUpgradeActions = fals
     const isMobileVariant = !!hideHeader;
     const shouldRenderSidebarInjectionSpots = !isMobileVariant;
     return /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-col gap-3", children: [
-      !hideHeader && /* @__PURE__ */ jsx("div", { className: "mb-2", children: /* @__PURE__ */ jsxs(
+      !hideHeader && /* @__PURE__ */ jsx("div", { className: `mb-2 ${blockPadding}`, children: /* @__PURE__ */ jsxs(
         Link,
         {
           href: "/backend",
@@ -722,14 +738,14 @@ function AppShellBody({ productName, logo, email, canManageUpgradeActions = fals
           ]
         }
       ) }),
-      shouldRenderSidebarInjectionSpots ? /* @__PURE__ */ jsx(
+      shouldRenderSidebarInjectionSpots ? /* @__PURE__ */ jsx("div", { className: injectionWrapper, "data-sidebar-injection-wrapper": "true", children: /* @__PURE__ */ jsx(
         InjectionSpot,
         {
           spotId: BACKEND_SIDEBAR_TOP_INJECTION_SPOT_ID,
           context: injectionContext
         }
-      ) : null,
-      !compact && /* @__PURE__ */ jsx(
+      ) }) : null,
+      !compact && /* @__PURE__ */ jsx("div", { className: blockPadding, children: /* @__PURE__ */ jsx(
         SearchInput,
         {
           value: navQuery,
@@ -739,8 +755,8 @@ function AppShellBody({ productName, logo, email, canManageUpgradeActions = fals
           clearLabel: t("appShell.searchNavClear", "Clear search"),
           className: "mb-2"
         }
-      ),
-      /* @__PURE__ */ jsx("div", { "data-sidebar-scroll": "true", className: `flex flex-1 flex-col gap-3 overflow-y-auto scrollbar-hide pr-1 ${compact ? "-ml-2 pl-2" : "-ml-3 pl-3"}`, children: (() => {
+      ) }),
+      /* @__PURE__ */ jsx("div", { "data-sidebar-scroll": "true", className: "flex flex-1 flex-col gap-3 overflow-x-hidden overflow-y-auto scrollbar-hide", children: (() => {
         const isSettingsPath = (href) => {
           if (href === "/backend/settings") return true;
           return resolvedSettingsPathPrefixes.some((prefix) => href.startsWith(prefix));
@@ -761,13 +777,13 @@ function AppShellBody({ productName, logo, email, canManageUpgradeActions = fals
           return -1;
         })();
         return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsxs("nav", { className: "flex flex-col gap-2", "data-testid": "sidebar", children: [
-          shouldRenderSidebarInjectionSpots ? /* @__PURE__ */ jsx(
+          shouldRenderSidebarInjectionSpots ? /* @__PURE__ */ jsx("div", { className: injectionWrapper, "data-sidebar-injection-wrapper": "true", children: /* @__PURE__ */ jsx(
             InjectionSpot,
             {
               spotId: BACKEND_SIDEBAR_NAV_INJECTION_SPOT_ID,
               context: injectionContext
             }
-          ) : null,
+          ) }) : null,
           mainGroups.map((g, gi) => {
             const groupId = resolveGroupKey(g);
             const open = navQueryActive ? true : openGroups[groupId] !== false;
@@ -779,87 +795,94 @@ function AppShellBody({ productName, logo, email, canManageUpgradeActions = fals
               return itemChildren.some((c) => matchesQuery(c.title));
             });
             if (visibleItems.length === 0) return null;
-            return /* @__PURE__ */ jsxs("div", { children: [
-              !compact && /* @__PURE__ */ jsxs(
-                Button,
-                {
-                  variant: "muted",
-                  onClick: () => toggleGroup(groupId),
-                  className: "w-full px-1 justify-between flex text-xs font-medium uppercase tracking-wider text-muted-foreground/70 py-1",
-                  "aria-expanded": open,
-                  children: [
-                    /* @__PURE__ */ jsx("span", { children: g.name }),
-                    /* @__PURE__ */ jsx(Chevron, { open })
-                  ]
-                }
-              ),
-              (open || compact) && /* @__PURE__ */ jsx("div", { className: `flex flex-col ${compact ? "items-center" : ""} gap-1`, children: visibleItems.map((i) => {
-                const allChildItems = (i.children ?? []).filter((child) => child.hidden !== true);
-                const matchingChildItems = navQueryActive ? allChildItems.filter((c) => matchesQuery(c.title)) : allChildItems;
-                const childItems = navQueryActive ? matchingChildItems : allChildItems;
-                const showChildren = navQueryActive ? matchingChildItems.length > 0 : !!pathname && allChildItems.length > 0 && pathname.startsWith(i.href);
-                const hasActiveChild = !!(pathname && allChildItems.some((c) => pathname.startsWith(c.href)));
-                const isParentActive = pathname === i.href || !navQueryActive && showChildren && !hasActiveChild;
-                const base = compact ? "w-10 h-10 justify-center" : "w-full px-3 py-2 gap-2";
-                return /* @__PURE__ */ jsxs(React.Fragment, { children: [
-                  /* @__PURE__ */ jsxs(
-                    Link,
+            return /* @__PURE__ */ jsxs(
+              "div",
+              {
+                className: `${blockPadding} ${gi !== mainLastVisibleGroupIndex ? "border-b pb-2" : ""}`,
+                "data-sidebar-group": "true",
+                children: [
+                  !compact && /* @__PURE__ */ jsxs(
+                    Button,
                     {
-                      href: i.href,
-                      className: `relative text-sm font-medium rounded-lg inline-flex items-center ${base} ${isParentActive ? "bg-muted text-foreground" : "text-muted-foreground hover:bg-muted"} ${i.enabled === false ? "pointer-events-none opacity-50" : ""}`,
-                      "aria-disabled": i.enabled === false,
-                      title: compact ? i.title : void 0,
-                      "data-menu-item-id": i.id ?? i.href,
-                      onClick: () => setMobileOpen(false),
+                      variant: "muted",
+                      onClick: () => toggleGroup(groupId),
+                      className: "w-full px-1 justify-between flex text-xs font-medium uppercase tracking-wider text-muted-foreground/70 py-1",
+                      "aria-expanded": open,
                       children: [
-                        isParentActive ? /* @__PURE__ */ jsx("span", { "aria-hidden": true, className: `absolute ${compact ? "left-[-20px]" : "left-[-12px]"} top-2 w-1 h-5 rounded-r bg-foreground` }) : null,
-                        /* @__PURE__ */ jsx("span", { className: "flex items-center justify-center shrink-0", children: renderIcon(
-                          i.icon,
-                          i.iconName,
-                          i.iconMarkup,
-                          DefaultIcon
-                        ) }),
-                        !compact && /* @__PURE__ */ jsx("span", { children: i.title })
+                        /* @__PURE__ */ jsx("span", { children: g.name }),
+                        /* @__PURE__ */ jsx(Chevron, { open })
                       ]
                     }
                   ),
-                  showChildren ? /* @__PURE__ */ jsxs("div", { className: `relative flex flex-col ${compact ? "items-center" : ""} gap-1`, children: [
-                    !compact && /* @__PURE__ */ jsx("span", { "aria-hidden": true, className: "pointer-events-none absolute left-1.5 top-1 bottom-1 w-px bg-border" }),
-                    childItems.map((c) => {
-                      const childActive = pathname?.startsWith(c.href);
-                      const childBase = compact ? "w-10 h-8 justify-center" : "w-full pl-5 pr-3 py-2 gap-2";
-                      return /* @__PURE__ */ jsxs(
+                  (open || compact) && /* @__PURE__ */ jsx("div", { className: `flex flex-col ${compact ? "items-center" : ""} gap-1`, children: visibleItems.map((i) => {
+                    const allChildItems = (i.children ?? []).filter((child) => child.hidden !== true);
+                    const matchingChildItems = navQueryActive ? allChildItems.filter((c) => matchesQuery(c.title)) : allChildItems;
+                    const childItems = navQueryActive ? matchingChildItems : allChildItems;
+                    const showChildren = navQueryActive ? matchingChildItems.length > 0 : !!pathname && allChildItems.length > 0 && pathname.startsWith(i.href);
+                    const hasActiveChild = !!(pathname && allChildItems.some((c) => pathname.startsWith(c.href)));
+                    const isParentActive = pathname === i.href || !navQueryActive && showChildren && !hasActiveChild;
+                    const base = compact ? "w-10 h-10 justify-center" : "w-full px-3 py-2 gap-2";
+                    return /* @__PURE__ */ jsxs(React.Fragment, { children: [
+                      /* @__PURE__ */ jsxs(
                         Link,
                         {
-                          href: c.href,
-                          className: `relative text-sm font-medium rounded-lg inline-flex items-center ${childBase} ${childActive ? "bg-muted text-foreground" : "text-muted-foreground hover:bg-muted"} ${c.enabled === false ? "pointer-events-none opacity-50" : ""}`,
-                          "aria-disabled": c.enabled === false,
-                          title: compact ? c.title : void 0,
-                          "data-menu-item-id": c.id ?? c.href,
+                          href: i.href,
+                          className: `relative text-sm font-medium rounded-lg inline-flex items-center ${base} ${isParentActive ? "bg-muted text-foreground" : "text-muted-foreground hover:bg-muted"} ${i.enabled === false ? "pointer-events-none opacity-50" : ""}`,
+                          "aria-disabled": i.enabled === false,
+                          title: compact ? i.title : void 0,
+                          "data-menu-item-id": i.id ?? i.href,
                           onClick: () => setMobileOpen(false),
                           children: [
-                            childActive ? /* @__PURE__ */ jsx("span", { "aria-hidden": true, className: `absolute ${compact ? "left-[-20px]" : "left-[-12px]"} top-2 w-1 h-5 rounded-r bg-foreground` }) : null,
+                            isParentActive ? /* @__PURE__ */ jsx("span", { "aria-hidden": true, className: `absolute ${compact ? "left-[-20px]" : "left-[-12px]"} top-2 w-1 h-5 rounded-r bg-foreground` }) : null,
                             /* @__PURE__ */ jsx("span", { className: "flex items-center justify-center shrink-0", children: renderIcon(
-                              c.icon,
-                              c.iconName,
-                              c.iconMarkup,
-                              c.href.includes("/backend/entities/user/") && c.href.endsWith("/records") ? DataTableIcon : DefaultIcon
+                              i.icon,
+                              i.iconName,
+                              i.iconMarkup,
+                              DefaultIcon
                             ) }),
-                            !compact && /* @__PURE__ */ jsx("span", { children: c.title })
+                            !compact && /* @__PURE__ */ jsx("span", { children: i.title })
                           ]
-                        },
-                        c.href
-                      );
-                    })
-                  ] }) : null
-                ] }, i.href);
-              }) }),
-              gi !== mainLastVisibleGroupIndex && /* @__PURE__ */ jsx("div", { className: `my-2 border-t ${compact ? "-ml-2 -mr-3" : "-ml-3 -mr-4"}` })
-            ] }, groupId);
+                        }
+                      ),
+                      showChildren ? /* @__PURE__ */ jsxs("div", { className: `relative flex flex-col ${compact ? "items-center" : ""} gap-1`, children: [
+                        !compact && /* @__PURE__ */ jsx("span", { "aria-hidden": true, className: "pointer-events-none absolute left-1.5 top-1 bottom-1 w-px bg-border" }),
+                        childItems.map((c) => {
+                          const childActive = pathname?.startsWith(c.href);
+                          const childBase = compact ? "w-10 h-8 justify-center" : "w-full pl-5 pr-3 py-2 gap-2";
+                          return /* @__PURE__ */ jsxs(
+                            Link,
+                            {
+                              href: c.href,
+                              className: `relative text-sm font-medium rounded-lg inline-flex items-center ${childBase} ${childActive ? "bg-muted text-foreground" : "text-muted-foreground hover:bg-muted"} ${c.enabled === false ? "pointer-events-none opacity-50" : ""}`,
+                              "aria-disabled": c.enabled === false,
+                              title: compact ? c.title : void 0,
+                              "data-menu-item-id": c.id ?? c.href,
+                              onClick: () => setMobileOpen(false),
+                              children: [
+                                childActive ? /* @__PURE__ */ jsx("span", { "aria-hidden": true, className: `absolute ${compact ? "left-[-20px]" : "left-[-12px]"} top-2 w-1 h-5 rounded-r bg-foreground` }) : null,
+                                /* @__PURE__ */ jsx("span", { className: "flex items-center justify-center shrink-0", children: renderIcon(
+                                  c.icon,
+                                  c.iconName,
+                                  c.iconMarkup,
+                                  c.href.includes("/backend/entities/user/") && c.href.endsWith("/records") ? DataTableIcon : DefaultIcon
+                                ) }),
+                                !compact && /* @__PURE__ */ jsx("span", { children: c.title })
+                              ]
+                            },
+                            c.href
+                          );
+                        })
+                      ] }) : null
+                    ] }, i.href);
+                  }) })
+                ]
+              },
+              groupId
+            );
           })
         ] }) });
       })() }),
-      /* @__PURE__ */ jsxs("div", { className: "sticky bottom-0 bg-background pb-1", children: [
+      /* @__PURE__ */ jsxs("div", { className: `sticky bottom-0 bg-background pb-1 ${injectionWrapper}`, "data-sidebar-injection-wrapper": "true", children: [
         shouldRenderSidebarInjectionSpots ? /* @__PURE__ */ jsx(
           InjectionSpot,
           {
@@ -904,7 +927,7 @@ function AppShellBody({ productName, logo, email, canManageUpgradeActions = fals
     }
     if (!sections) return null;
     return /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-col gap-2", children: [
-      /* @__PURE__ */ jsxs(
+      /* @__PURE__ */ jsx("div", { className: sidebarBlockPadding(false), children: /* @__PURE__ */ jsxs(
         Link,
         {
           href: "/backend",
@@ -916,7 +939,7 @@ function AppShellBody({ productName, logo, email, canManageUpgradeActions = fals
             /* @__PURE__ */ jsx("span", { className: "truncate", children: title })
           ]
         }
-      ),
+      ) }),
       /* @__PURE__ */ jsx("div", { className: "min-h-0 flex-1", children: renderSectionSidebar(sections, title, false, true, true) })
     ] });
   }
@@ -974,7 +997,7 @@ function AppShellBody({ productName, logo, email, canManageUpgradeActions = fals
               children: effectiveCollapsed ? /* @__PURE__ */ jsx(PanelLeftOpen, { className: "size-4" }) : /* @__PURE__ */ jsx(PanelLeftClose, { className: "size-4" })
             }
           ),
-          /* @__PURE__ */ jsxs("aside", { ref: sidebarAsideRef, className: `${asideClassesBase} ${effectiveCollapsed ? "px-2" : "px-3"} hidden lg:block lg:sticky lg:top-0 lg:h-svh lg:self-start lg:overflow-hidden lg:relative transition-[width,padding] duration-200 ease-out`, style: { width: asideWidth }, children: [
+          /* @__PURE__ */ jsxs("aside", { ref: sidebarAsideRef, className: `${asideClassesBase} px-0 hidden lg:block lg:sticky lg:top-0 lg:h-svh lg:self-start lg:overflow-hidden lg:relative transition-[width] duration-200 ease-out`, style: { width: asideWidth }, children: [
             renderSidebar(effectiveCollapsed, false, isSectionView),
             sidebarScrollState !== "none" ? /* @__PURE__ */ jsx(
               "div",
@@ -1006,7 +1029,7 @@ function AppShellBody({ productName, logo, email, canManageUpgradeActions = fals
           isSectionView ? /* @__PURE__ */ jsxs(
             "aside",
             {
-              className: `${asideClassesBase} px-3 hidden lg:block lg:sticky lg:top-0 lg:h-svh lg:self-start lg:overflow-hidden lg:relative`,
+              className: `${asideClassesBase} px-0 hidden lg:block lg:sticky lg:top-0 lg:h-svh lg:self-start lg:overflow-hidden lg:relative`,
               style: { width: "240px" },
               "data-testid": "appshell-section-sidebar",
               children: [
@@ -1166,7 +1189,7 @@ function AppShellBody({ productName, logo, email, canManageUpgradeActions = fals
                   id: "mobile-drawer-tabpanel",
                   role: sidebarMode !== "main" ? "tabpanel" : void 0,
                   "aria-labelledby": sidebarMode !== "main" ? `mobile-drawer-tab-${mobileDrawerView === "main" ? "main" : "section"}` : void 0,
-                  className: "min-h-0 flex-1 overflow-y-auto overflow-x-hidden p-3",
+                  className: "min-h-0 flex-1 overflow-y-auto overflow-x-hidden py-3",
                   children: renderSidebar(false, true, mobileDrawerView === "main")
                 }
               )