@caratlogic/design-system 0.1.26 → 0.1.28

package/dist/components/molecules/CompanyCard/CompanyCard.d.ts

@@ -0,0 +1,9 @@
+import type { ReactElement } from 'react';
+import type { CompanyCardProps } from './CompanyCard.types';
+export type { CompanyCardProps, CompanyCardTaxNumber } from './CompanyCard.types';
+/**
+ * A business contact at a glance: avatar + name, email / phone / tax number,
+ * then the address. Data-only — the app formats each value before passing it.
+ */
+export declare function CompanyCard({ name, subtitle, email, phone, taxNumber, address, viewHref, viewLabel, title, icon, emptyLabel, className, }: CompanyCardProps): ReactElement;
+//# sourceMappingURL=CompanyCard.d.ts.map

package/dist/components/molecules/CompanyCard/CompanyCard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CompanyCard.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/CompanyCard/CompanyCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAO1C,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAE5D,YAAY,EAAE,gBAAgB,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAC;AAElF;;;GAGG;AACH,wBAAgB,WAAW,CAAC,EAC1B,IAAI,EACJ,QAAQ,EACR,KAAK,EACL,KAAK,EACL,SAAS,EACT,OAAO,EACP,QAAQ,EACR,SAA0B,EAC1B,KAAiB,EACjB,IAAmD,EACnD,UAA2B,EAC3B,SAAS,GACV,EAAE,gBAAgB,GAAG,YAAY,CAyDjC"}

package/dist/components/molecules/CompanyCard/CompanyCard.parts.d.ts

@@ -0,0 +1,4 @@
+import type { ReactElement } from 'react';
+import type { CompanyCardFieldProps } from './CompanyCard.types';
+export declare function CompanyCardField({ label, children, emptyLabel, className, }: CompanyCardFieldProps): ReactElement;
+//# sourceMappingURL=CompanyCard.parts.d.ts.map

package/dist/components/molecules/CompanyCard/CompanyCard.parts.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CompanyCard.parts.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/CompanyCard/CompanyCard.parts.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,qBAAqB,CAAC;AAEjE,wBAAgB,gBAAgB,CAAC,EAC/B,KAAK,EACL,QAAQ,EACR,UAAU,EACV,SAAS,GACV,EAAE,qBAAqB,GAAG,YAAY,CAiBtC"}

package/dist/components/molecules/CompanyCard/CompanyCard.types.d.ts

@@ -0,0 +1,32 @@
+import type { ReactNode } from 'react';
+export interface CompanyCardTaxNumber {
+    /** e.g. "GSTIN" for Indian contacts, "VAT Number" otherwise. */
+    label: string;
+    value?: string;
+}
+export interface CompanyCardProps {
+    /** Display name, e.g. "Riddhesh Shah & Diamonds (JDVY)". */
+    name: string;
+    /** Secondary line under the name, e.g. "Riddhesh Shah · Udaipur, India". */
+    subtitle?: string;
+    email?: string;
+    phone?: string;
+    taxNumber?: CompanyCardTaxNumber;
+    /** One-line formatted address. */
+    address?: string;
+    /** Opens the contact in a new tab from the header link. */
+    viewHref?: string;
+    viewLabel?: string;
+    title?: string;
+    icon?: ReactNode;
+    /** Shown for any field without a value. */
+    emptyLabel?: string;
+    className?: string;
+}
+export interface CompanyCardFieldProps {
+    label: string;
+    children?: ReactNode;
+    emptyLabel: string;
+    className?: string;
+}
+//# sourceMappingURL=CompanyCard.types.d.ts.map

package/dist/components/molecules/CompanyCard/CompanyCard.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CompanyCard.types.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/CompanyCard/CompanyCard.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,MAAM,WAAW,oBAAoB;IACnC,gEAAgE;IAChE,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,gBAAgB;IAC/B,4DAA4D;IAC5D,IAAI,EAAE,MAAM,CAAC;IACb,4EAA4E;IAC5E,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,oBAAoB,CAAC;IACjC,kCAAkC;IAClC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,2CAA2C;IAC3C,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,qBAAqB;IACpC,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,UAAU,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB"}

package/dist/components/molecules/CompanyCard/CompanyCard.utils.d.ts

@@ -0,0 +1,4 @@
+/** `—` is the placeholder the apps' display helpers return for a missing value. */
+export declare function hasValue(value?: string | null): value is string;
+export declare function getInitial(name: string): string;
+//# sourceMappingURL=CompanyCard.utils.d.ts.map

package/dist/components/molecules/CompanyCard/CompanyCard.utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CompanyCard.utils.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/CompanyCard/CompanyCard.utils.ts"],"names":[],"mappings":"AAAA,mFAAmF;AACnF,wBAAgB,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,GAAG,KAAK,IAAI,MAAM,CAG/D;AAED,wBAAgB,UAAU,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAE/C"}

package/dist/components/molecules/CompanyCard/index.d.ts

@@ -0,0 +1,3 @@
+export { CompanyCard } from './CompanyCard';
+export type { CompanyCardProps, CompanyCardTaxNumber } from './CompanyCard';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/molecules/CompanyCard/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/CompanyCard/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,YAAY,EAAE,gBAAgB,EAAE,oBAAoB,EAAE,MAAM,eAAe,CAAC"}

package/dist/components/molecules/InvoiceComboBox/InvoiceComboBox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"InvoiceComboBox.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/InvoiceComboBox/InvoiceComboBox.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAEV,oBAAoB,EACrB,MAAM,yBAAyB,CAAC;AAEjC,wBAAgB,eAAe,CAAC,EAC9B,YAAY,EACZ,QAAQ,EACR,aAAa,EACb,iBAAwC,EACxC,SAAS,EACT,QAAgB,EAChB,KAAK,EACL,YAAmB,EACnB,aAAa,GACd,EAAE,oBAAoB,2CAsFtB"}
+{"version":3,"file":"InvoiceComboBox.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/InvoiceComboBox/InvoiceComboBox.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EAEV,oBAAoB,EACrB,MAAM,yBAAyB,CAAC;AAEjC,wBAAgB,eAAe,CAAC,EAC9B,YAAY,EACZ,QAAQ,EACR,aAAa,EACb,iBAAwC,EACxC,SAAS,EACT,QAAgB,EAChB,KAAK,EACL,YAAmB,EACnB,aAAa,GACd,EAAE,oBAAoB,2CA6FtB"}

package/dist/components/molecules/InvoiceComboBox/InvoiceComboBox.utils.d.ts

@@ -1,4 +1,8 @@
 import type { Invoice } from '@/types/invoice';
 export declare function formatInvoiceLabel(invoice: Invoice): string;
 export declare function formatCurrency(amount: number, currency?: string): string;
+/** The currency the invoice was issued in; `baseCurrency` is only its ledger currency. */
+export declare function getInvoiceCurrency(invoice: Invoice): string;
+export declare function getInvoiceCompany(invoice: Invoice): string;
+export declare function getInvoiceLocation(invoice: Invoice): string;
 //# sourceMappingURL=InvoiceComboBox.utils.d.ts.map

package/dist/components/molecules/InvoiceComboBox/InvoiceComboBox.utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"InvoiceComboBox.utils.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/InvoiceComboBox/InvoiceComboBox.utils.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAC;AAE/C,wBAAgB,kBAAkB,CAAC,OAAO,EAAE,OAAO,GAAG,MAAM,CAM3D;AAED,wBAAgB,cAAc,CAAC,MAAM,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAKxE"}
+{"version":3,"file":"InvoiceComboBox.utils.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/InvoiceComboBox/InvoiceComboBox.utils.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,iBAAiB,CAAC;AAE/C,wBAAgB,kBAAkB,CAAC,OAAO,EAAE,OAAO,GAAG,MAAM,CAM3D;AAED,wBAAgB,cAAc,CAAC,MAAM,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAKxE;AAED,0FAA0F;AAC1F,wBAAgB,kBAAkB,CAAC,OAAO,EAAE,OAAO,GAAG,MAAM,CAG3D;AAED,wBAAgB,iBAAiB,CAAC,OAAO,EAAE,OAAO,GAAG,MAAM,CAE1D;AAED,wBAAgB,kBAAkB,CAAC,OAAO,EAAE,OAAO,GAAG,MAAM,CAM3D"}

package/dist/components/molecules/SegmentedControl/SegmentedControl.d.ts

@@ -1,12 +1,14 @@
+import type { ReactElement } from 'react';
 import type { SegmentedControlProps } from './SegmentedControl.types';
-export type { SegmentedControlOption, SegmentedControlProps, } from './SegmentedControl.types';
+export type { SegmentedControlOption, SegmentedControlOptionLayout, SegmentedControlProps, SegmentedControlVariant, } from './SegmentedControl.types';
 /**
- * Pill-shaped segmented control with N equally-sized buttons. The active
- * segment lifts forward with a white bg + subtle shadow; inactive segments
- * blend into the muted container background.
+ * Pill-shaped segmented control. The active segment lifts forward with a card
+ * bg, primary border and subtle shadow; inactive segments blend into the muted
+ * container background. Giving options a `description` makes the default
+ * segments taller, with the icon in a badge.
  *
  * Single source of truth for "two-or-more mutually exclusive views" toggles
  * (e.g. Owned / Memo on the ownership form).
  */
-export declare function SegmentedControl<V extends string = string>({ value, onChange, options, ariaLabel, className, disabled, variant, }: SegmentedControlProps<V>): import("react/jsx-runtime").JSX.Element;
+export declare function SegmentedControl<V extends string = string>({ value, onChange, options, ariaLabel, className, disabled, variant, optionLayout, }: SegmentedControlProps<V>): ReactElement;
 //# sourceMappingURL=SegmentedControl.d.ts.map

package/dist/components/molecules/SegmentedControl/SegmentedControl.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControl.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/SegmentedControl/SegmentedControl.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,0BAA0B,CAAC;AAEtE,YAAY,EACV,sBAAsB,EACtB,qBAAqB,GACtB,MAAM,0BAA0B,CAAC;AAElC;;;;;;;GAOG;AACH,wBAAgB,gBAAgB,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,EAAE,EAC1D,KAAK,EACL,QAAQ,EACR,OAAO,EACP,SAAS,EACT,SAAS,EACT,QAAQ,EACR,OAAmB,GACpB,EAAE,qBAAqB,CAAC,CAAC,CAAC,2CAsD1B"}
+{"version":3,"file":"SegmentedControl.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/SegmentedControl/SegmentedControl.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,0BAA0B,CAAC;AAUtE,YAAY,EACV,sBAAsB,EACtB,4BAA4B,EAC5B,qBAAqB,EACrB,uBAAuB,GACxB,MAAM,0BAA0B,CAAC;AAElC;;;;;;;;GAQG;AACH,wBAAgB,gBAAgB,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,EAAE,EAC1D,KAAK,EACL,QAAQ,EACR,OAAO,EACP,SAAS,EACT,SAAS,EACT,QAAQ,EACR,OAAmB,EACnB,YAAwB,GACzB,EAAE,qBAAqB,CAAC,CAAC,CAAC,GAAG,YAAY,CAmCzC"}

package/dist/components/molecules/SegmentedControl/SegmentedControl.types.d.ts

@@ -1,8 +1,13 @@
 import type { ReactNode } from 'react';
+export type SegmentedControlVariant = 'default' | 'bordered';
+/** Where an option's description sits relative to its label. */
+export type SegmentedControlOptionLayout = 'inline' | 'stacked';
 export interface SegmentedControlOption<V extends string = string> {
     value: V;
     label: ReactNode;
     icon?: ReactNode;
+    /** Secondary text, e.g. "Invoice currency" or a rate. Makes the `default` segment taller and puts the icon in a badge. */
+    description?: ReactNode;
     disabled?: boolean;
 }
 export interface SegmentedControlProps<V extends string = string> {
@@ -13,10 +18,12 @@ export interface SegmentedControlProps<V extends string = string> {
     className?: string;
     disabled?: boolean;
     /**
-     * `default` — active segment lifts forward with white bg + shadow (muted inactive text).
-     * `bordered` — active segment additionally carries a primary border and inactive
-     * labels stay full-contrast (`text-foreground`). Matches the Figma "Advance Tabs" style.
+     * `default` — equal-width segments; the active one lifts forward with a primary border (muted inactive text).
+     * `bordered` — segments size to their content and inactive labels stay
+     * full-contrast (`text-foreground`). Matches the Figma "Advance Tabs" style.
      */
-    variant?: 'default' | 'bordered';
+    variant?: SegmentedControlVariant;
+    /** Description beside the label (`inline`) or under it (`stacked`, default). */
+    optionLayout?: SegmentedControlOptionLayout;
 }
 //# sourceMappingURL=SegmentedControl.types.d.ts.map

package/dist/components/molecules/SegmentedControl/SegmentedControl.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControl.types.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/SegmentedControl/SegmentedControl.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,MAAM,WAAW,sBAAsB,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM;IAC/D,KAAK,EAAE,CAAC,CAAC;IACT,KAAK,EAAE,SAAS,CAAC;IACjB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,qBAAqB,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM;IAC9D,KAAK,EAAE,CAAC,CAAC;IACT,QAAQ,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;IAC7B,OAAO,EAAE,sBAAsB,CAAC,CAAC,CAAC,EAAE,CAAC;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,UAAU,CAAC;CAClC"}
+{"version":3,"file":"SegmentedControl.types.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/SegmentedControl/SegmentedControl.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,MAAM,MAAM,uBAAuB,GAAG,SAAS,GAAG,UAAU,CAAC;AAE7D,gEAAgE;AAChE,MAAM,MAAM,4BAA4B,GAAG,QAAQ,GAAG,SAAS,CAAC;AAEhE,MAAM,WAAW,sBAAsB,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM;IAC/D,KAAK,EAAE,CAAC,CAAC;IACT,KAAK,EAAE,SAAS,CAAC;IACjB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,0HAA0H;IAC1H,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,qBAAqB,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM;IAC9D,KAAK,EAAE,CAAC,CAAC;IACT,QAAQ,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;IAC7B,OAAO,EAAE,sBAAsB,CAAC,CAAC,CAAC,EAAE,CAAC;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,OAAO,CAAC,EAAE,uBAAuB,CAAC;IAClC,gFAAgF;IAChF,YAAY,CAAC,EAAE,4BAA4B,CAAC;CAC7C"}

package/dist/components/molecules/SegmentedControl/SegmentedControl.utils.d.ts

@@ -0,0 +1,9 @@
+import type { SegmentedControlOptionLayout, SegmentedControlVariant } from './SegmentedControl.types';
+/** Options with a description get the taller layout with an icon badge (default variant only). */
+export declare function hasDetails(variant: SegmentedControlVariant, hasDescription: boolean): boolean;
+export declare function getListClassName(variant: SegmentedControlVariant, detailed: boolean): string;
+export declare function getSegmentClassName(variant: SegmentedControlVariant, isActive: boolean, isDisabled: boolean, detailed?: boolean): string;
+export declare function getIconClassName(detailed: boolean, isActive: boolean): string;
+export declare function getContentClassName(layout: SegmentedControlOptionLayout): string;
+export declare function getDescriptionClassName(isActive: boolean): string;
+//# sourceMappingURL=SegmentedControl.utils.d.ts.map

package/dist/components/molecules/SegmentedControl/SegmentedControl.utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SegmentedControl.utils.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/SegmentedControl/SegmentedControl.utils.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,4BAA4B,EAC5B,uBAAuB,EACxB,MAAM,0BAA0B,CAAC;AAElC,kGAAkG;AAClG,wBAAgB,UAAU,CAAC,OAAO,EAAE,uBAAuB,EAAE,cAAc,EAAE,OAAO,GAAG,OAAO,CAE7F;AAMD,wBAAgB,gBAAgB,CAAC,OAAO,EAAE,uBAAuB,EAAE,QAAQ,EAAE,OAAO,GAAG,MAAM,CAS5F;AAED,wBAAgB,mBAAmB,CACjC,OAAO,EAAE,uBAAuB,EAChC,QAAQ,EAAE,OAAO,EACjB,UAAU,EAAE,OAAO,EACnB,QAAQ,UAAQ,GACf,MAAM,CAqBR;AAED,wBAAgB,gBAAgB,CAAC,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,OAAO,GAAG,MAAM,CAQ7E;AAED,wBAAgB,mBAAmB,CAAC,MAAM,EAAE,4BAA4B,GAAG,MAAM,CAIhF;AAED,wBAAgB,uBAAuB,CAAC,QAAQ,EAAE,OAAO,GAAG,MAAM,CAEjE"}

package/dist/components/molecules/SegmentedControl/index.d.ts

@@ -1,3 +1,3 @@
 export { SegmentedControl } from './SegmentedControl';
-export type { SegmentedControlOption, SegmentedControlProps, } from './SegmentedControl';
+export type { SegmentedControlOption, SegmentedControlOptionLayout, SegmentedControlProps, SegmentedControlVariant, } from './SegmentedControl';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/molecules/SegmentedControl/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/SegmentedControl/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,YAAY,EACV,sBAAsB,EACtB,qBAAqB,GACtB,MAAM,oBAAoB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/SegmentedControl/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AACtD,YAAY,EACV,sBAAsB,EACtB,4BAA4B,EAC5B,qBAAqB,EACrB,uBAAuB,GACxB,MAAM,oBAAoB,CAAC"}

package/dist/index.cjs.js

@@ -2698,12 +2698,12 @@ const createLucideIcon = (iconName, iconNode) => {
  */
 
 
-const __iconNode$1o = [
+const __iconNode$1p = [
   ["path", { d: "M15 12H3", key: "6jk70r" }],
   ["path", { d: "M17 18H3", key: "1amg6g" }],
   ["path", { d: "M21 6H3", key: "1jwq7v" }]
 ];
-const AlignLeft = createLucideIcon("align-left", __iconNode$1o);
+const AlignLeft = createLucideIcon("align-left", __iconNode$1p);
 
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -2713,12 +2713,12 @@ const AlignLeft = createLucideIcon("align-left", __iconNode$1o);
  */
 
 
-const __iconNode$1n = [
+const __iconNode$1o = [
   ["rect", { width: "20", height: "5", x: "2", y: "3", rx: "1", key: "1wp1u1" }],
   ["path", { d: "M4 8v11a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8", key: "1s80jp" }],
   ["path", { d: "M10 12h4", key: "a56b0p" }]
 ];
-const Archive = createLucideIcon("archive", __iconNode$1n);
+const Archive = createLucideIcon("archive", __iconNode$1o);
 
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -2728,11 +2728,11 @@ const Archive = createLucideIcon("archive", __iconNode$1n);
  */
 
 
-const __iconNode$1m = [
+const __iconNode$1n = [
   ["path", { d: "m12 19-7-7 7-7", key: "1l729n" }],
   ["path", { d: "M19 12H5", key: "x3x0zl" }]
 ];
-const ArrowLeft = createLucideIcon("arrow-left", __iconNode$1m);
+const ArrowLeft = createLucideIcon("arrow-left", __iconNode$1n);
 
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -2742,11 +2742,11 @@ const ArrowLeft = createLucideIcon("arrow-left", __iconNode$1m);
  */
 
 
-const __iconNode$1l = [
+const __iconNode$1m = [
   ["path", { d: "M5 12h14", key: "1ays0h" }],
   ["path", { d: "m12 5 7 7-7 7", key: "xquz4c" }]
 ];
-const ArrowRight = createLucideIcon("arrow-right", __iconNode$1l);
+const ArrowRight = createLucideIcon("arrow-right", __iconNode$1m);
 
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -2756,11 +2756,11 @@ const ArrowRight = createLucideIcon("arrow-right", __iconNode$1l);
  */
 
 
-const __iconNode$1k = [
+const __iconNode$1l = [
   ["path", { d: "M4.929 4.929 19.07 19.071", key: "196cmz" }],
   ["circle", { cx: "12", cy: "12", r: "10", key: "1mglay" }]
 ];
-const Ban = createLucideIcon("ban", __iconNode$1k);
+const Ban = createLucideIcon("ban", __iconNode$1l);
 
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -2770,7 +2770,7 @@ const Ban = createLucideIcon("ban", __iconNode$1k);
  */
 
 
-const __iconNode$1j = [
+const __iconNode$1k = [
   ["path", { d: "M10.268 21a2 2 0 0 0 3.464 0", key: "vwvbt9" }],
   [
     "path",
@@ -2781,7 +2781,7 @@ const __iconNode$1j = [
   ],
   ["circle", { cx: "18", cy: "8", r: "3", key: "1g0gzu" }]
 ];
-const BellDot = createLucideIcon("bell-dot", __iconNode$1j);
+const BellDot = createLucideIcon("bell-dot", __iconNode$1k);
 
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -2791,7 +2791,7 @@ const BellDot = createLucideIcon("bell-dot", __iconNode$1j);
  */
 
 
-const __iconNode$1i = [
+const __iconNode$1j = [
   ["path", { d: "M10.268 21a2 2 0 0 0 3.464 0", key: "vwvbt9" }],
   ["path", { d: "M22 8c0-2.3-.8-4.3-2-6", key: "5bb3ad" }],
   [
@@ -2803,7 +2803,7 @@ const __iconNode$1i = [
   ],
   ["path", { d: "M4 2C2.8 3.7 2 5.7 2 8", key: "tap9e0" }]
 ];
-const BellRing = createLucideIcon("bell-ring", __iconNode$1i);
+const BellRing = createLucideIcon("bell-ring", __iconNode$1j);
 
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -2813,7 +2813,7 @@ const BellRing = createLucideIcon("bell-ring", __iconNode$1i);
  */
 
 
-const __iconNode$1h = [
+const __iconNode$1i = [
   ["path", { d: "M10.268 21a2 2 0 0 0 3.464 0", key: "vwvbt9" }],
   [
     "path",
@@ -2823,7 +2823,7 @@ const __iconNode$1h = [
     }
   ]
 ];
-const Bell = createLucideIcon("bell", __iconNode$1h);
+const Bell = createLucideIcon("bell", __iconNode$1i);
 
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -2833,13 +2833,32 @@ const Bell = createLucideIcon("bell", __iconNode$1h);
  */
 
 
-const __iconNode$1g = [
+const __iconNode$1h = [
   [
     "path",
     { d: "M6 12h9a4 4 0 0 1 0 8H7a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1h7a4 4 0 0 1 0 8", key: "mg9rjx" }
   ]
 ];
-const Bold$1 = createLucideIcon("bold", __iconNode$1g);
+const Bold$1 = createLucideIcon("bold", __iconNode$1h);
+
+/**
+ * @license lucide-react v0.539.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+
+
+const __iconNode$1g = [
+  ["path", { d: "M6 22V4a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v18Z", key: "1b4qmf" }],
+  ["path", { d: "M6 12H4a2 2 0 0 0-2 2v6a2 2 0 0 0 2 2h2", key: "i71pzd" }],
+  ["path", { d: "M18 9h2a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2h-2", key: "10jefs" }],
+  ["path", { d: "M10 6h4", key: "1itunk" }],
+  ["path", { d: "M10 10h4", key: "tcdvrf" }],
+  ["path", { d: "M10 14h4", key: "kelpxr" }],
+  ["path", { d: "M10 18h4", key: "1ulq68" }]
+];
+const Building2 = createLucideIcon("building-2", __iconNode$1g);
 
 /**
  * @license lucide-react v0.539.0 - ISC
@@ -15396,6 +15415,48 @@ const CollapsibleCard = ({ title, subtitle, icon, headerActions, defaultOpen = t
     return (jsxRuntime.jsxs("section", { className: cn('overflow-hidden rounded-xl border border-border bg-card shadow-card', className), children: [jsxRuntime.jsxs("header", { className: cn('flex items-center gap-3 bg-muted/30 px-4 py-3', isOpen && 'border-b border-border', headerClassName), children: [icon && jsxRuntime.jsx(SectionIcon, { children: icon }), jsxRuntime.jsxs("div", { className: "flex min-w-0 shrink flex-col gap-0.5", children: [jsxRuntime.jsx("h3", { className: "truncate text-sm font-medium text-foreground", children: title }), subtitle && (jsxRuntime.jsx("div", { className: "truncate text-xs text-muted-foreground", children: subtitle }))] }), headerActions && (jsxRuntime.jsx("div", { className: "ml-auto flex min-w-0 flex-1 items-center justify-end gap-2", children: headerActions })), !headerActions && jsxRuntime.jsx("div", { className: "flex-1" }), !nonCollapsible && (jsxRuntime.jsx("button", { type: "button", onClick: toggle, "aria-expanded": isOpen, "aria-label": isOpen ? 'Collapse section' : 'Expand section', className: "inline-flex h-7 w-7 cursor-pointer items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-muted hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/30", children: jsxRuntime.jsx(ChevronDown, { className: cn('h-4 w-4 transition-transform duration-200', isOpen && 'rotate-180'), "aria-hidden": "true" }) }))] }), isOpen && jsxRuntime.jsx("div", { className: cn('p-4', bodyClassName), children: children })] }));
 };
 
+const HEADER_TONE_CLASSES = {
+    neutral: 'bg-[var(--section-header)]',
+    gem: 'bg-primary/5 dark:bg-[#173626]',
+    diamond: 'bg-blue-50 dark:bg-[#0284C7]/20',
+};
+const ICON_TONE_CLASSES$1 = {
+    neutral: 'bg-primary/10 text-primary',
+    gem: 'bg-primary/10 text-primary',
+    diamond: 'bg-blue-100 text-blue-500',
+};
+/**
+ * Section panel used across the redesigned create/edit forms: a rounded card
+ * with a tinted header band (icon square + title + description) above a
+ * divider, then the form body. The icon-square + title + description header
+ * is the recurring pattern in the new designs.
+ * divider, then the form body.
+ */
+const FormSectionCard = ({ icon, title, description, headerAction, children, className, bodyClassName, tone = 'neutral', headerClassName, }) => {
+    return (jsxRuntime.jsxs("section", { className: cn('overflow-hidden rounded-xl border border-border bg-card shadow-card', className), children: [jsxRuntime.jsxs("header", { className: cn('flex items-center justify-between gap-4 border-b border-border px-5 py-4', HEADER_TONE_CLASSES[tone], headerClassName), children: [jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [jsxRuntime.jsx("span", { className: cn('inline-flex h-10 w-10 shrink-0 items-center justify-center rounded-md', ICON_TONE_CLASSES$1[tone]), children: icon }), jsxRuntime.jsxs("div", { className: "space-y-0.5", children: [jsxRuntime.jsx("p", { className: "text-base font-medium text-foreground", children: title }), description && (jsxRuntime.jsx("p", { className: "text-[13px] font-normal text-label", children: description }))] })] }), headerAction] }), jsxRuntime.jsx("div", { className: cn('p-5', bodyClassName), children: children })] }));
+};
+
+function CompanyCardField({ label, children, emptyLabel, className, }) {
+    return (jsxRuntime.jsxs("div", { className: cn('flex min-w-0 flex-col gap-1', className), children: [jsxRuntime.jsx("p", { className: "text-xs font-semibold uppercase tracking-wide text-muted-foreground", children: label }), children ? (jsxRuntime.jsx("div", { className: "truncate text-sm font-medium leading-5 text-foreground", children: children })) : (jsxRuntime.jsx("p", { className: "text-sm font-medium italic leading-5 text-muted-foreground", children: emptyLabel }))] }));
+}
+
+/** `—` is the placeholder the apps' display helpers return for a missing value. */
+function hasValue(value) {
+    const trimmed = value?.trim();
+    return !!trimmed && trimmed !== '—';
+}
+function getInitial(name) {
+    return (name.trim()[0] ?? '?').toUpperCase();
+}
+
+/**
+ * A business contact at a glance: avatar + name, email / phone / tax number,
+ * then the address. Data-only — the app formats each value before passing it.
+ */
+function CompanyCard({ name, subtitle, email, phone, taxNumber, address, viewHref, viewLabel = 'View company', title = 'Company', icon = jsxRuntime.jsx(Building2, { className: "size-5", "aria-hidden": true }), emptyLabel = 'Not provided', className, }) {
+    return (jsxRuntime.jsxs(FormSectionCard, { icon: icon, title: title, className: className, headerClassName: "px-4 py-3", bodyClassName: "flex flex-col gap-4 p-4", headerAction: viewHref ? (jsxRuntime.jsx(TextHyperlink, { href: viewHref, showIcon: false, className: "shrink-0 text-sm font-medium", children: viewLabel })) : undefined, children: [jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [jsxRuntime.jsx("span", { "aria-hidden": true, className: "flex size-10 shrink-0 items-center justify-center rounded-full bg-primary text-sm font-semibold text-primary-foreground", children: getInitial(name) }), jsxRuntime.jsxs("div", { className: "min-w-0", children: [jsxRuntime.jsx("p", { className: "break-words text-base font-semibold leading-6 text-foreground", children: name }), hasValue(subtitle) ? (jsxRuntime.jsx("p", { className: "break-words text-xs leading-4 text-muted-foreground", children: subtitle })) : null] })] }), jsxRuntime.jsxs("div", { className: cn('grid grid-cols-1 gap-4', taxNumber ? 'sm:grid-cols-3' : 'sm:grid-cols-2'), children: [jsxRuntime.jsx(CompanyCardField, { label: "Email", emptyLabel: emptyLabel, children: hasValue(email) ? (jsxRuntime.jsx("a", { href: `mailto:${email}`, className: "text-primary underline-offset-2 hover:underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", children: email })) : null }), jsxRuntime.jsx(CompanyCardField, { label: "Phone", emptyLabel: emptyLabel, children: hasValue(phone) ? phone : null }), taxNumber ? (jsxRuntime.jsx(CompanyCardField, { label: taxNumber.label, emptyLabel: emptyLabel, children: hasValue(taxNumber.value) ? taxNumber.value : null })) : null] }), jsxRuntime.jsx(CompanyCardField, { label: "Address", emptyLabel: emptyLabel, className: "border-t border-border pt-4", children: hasValue(address) ? jsxRuntime.jsx("span", { className: "whitespace-normal break-words", children: address }) : null })] }));
+}
+
 function commonjsRequire(path) {
 	throw new Error('Could not dynamically require "' + path + '". Please configure the dynamicRequireTargets or/and ignoreDynamicRequires option of @rollup/plugin-commonjs appropriately for this require call to work.');
 }
@@ -37633,27 +37694,6 @@ const InAppNotificationCard = ({ notification, onSelect, defaultIcon, className,
     return (jsxRuntime.jsxs("button", { type: "button", onClick: () => onSelect(notification), className: getInAppNotificationCardClasses(isRead, className), children: [jsxRuntime.jsx("span", { className: getInAppNotificationIconClasses(isRead), children: icon ?? defaultIcon ?? (jsxRuntime.jsx(BellDot, { className: "size-4", "aria-hidden": "true" })) }), jsxRuntime.jsxs("span", { className: "min-w-0 flex-1", children: [jsxRuntime.jsxs("span", { className: "flex items-baseline gap-2", children: [!isRead && (jsxRuntime.jsx("span", { role: "img", "aria-label": inAppNotificationCardA11y.unreadLabel, className: "size-1.5 shrink-0 rounded-full bg-primary" })), jsxRuntime.jsx("span", { className: cn('min-w-0 flex-1 truncate text-sm text-foreground', isRead ? 'font-medium' : 'font-semibold'), children: title }), jsxRuntime.jsx("time", { className: "shrink-0 text-[0.6875rem] text-muted-foreground tabular-nums", children: formatRelativeTime(createdAt) })] }), jsxRuntime.jsx("span", { className: "mt-1 line-clamp-1 text-xs text-secondary-foreground", children: message }), subject && (jsxRuntime.jsx("span", { className: "mt-0.5 block truncate text-[0.6875rem] font-medium text-muted-foreground", children: subject }))] })] }));
 };
 
-const HEADER_TONE_CLASSES = {
-    neutral: 'bg-[var(--section-header)]',
-    gem: 'bg-primary/5 dark:bg-[#173626]',
-    diamond: 'bg-blue-50 dark:bg-[#0284C7]/20',
-};
-const ICON_TONE_CLASSES$1 = {
-    neutral: 'bg-primary/10 text-primary',
-    gem: 'bg-primary/10 text-primary',
-    diamond: 'bg-blue-100 text-blue-500',
-};
-/**
- * Section panel used across the redesigned create/edit forms: a rounded card
- * with a tinted header band (icon square + title + description) above a
- * divider, then the form body. The icon-square + title + description header
- * is the recurring pattern in the new designs.
- * divider, then the form body.
- */
-const FormSectionCard = ({ icon, title, description, headerAction, children, className, bodyClassName, tone = 'neutral', headerClassName, }) => {
-    return (jsxRuntime.jsxs("section", { className: cn('overflow-hidden rounded-xl border border-border bg-card shadow-card', className), children: [jsxRuntime.jsxs("header", { className: cn('flex items-center justify-between gap-4 border-b border-border px-5 py-4', HEADER_TONE_CLASSES[tone], headerClassName), children: [jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [jsxRuntime.jsx("span", { className: cn('inline-flex h-10 w-10 shrink-0 items-center justify-center rounded-md', ICON_TONE_CLASSES$1[tone]), children: icon }), jsxRuntime.jsxs("div", { className: "space-y-0.5", children: [jsxRuntime.jsx("p", { className: "text-base font-medium text-foreground", children: title }), description && (jsxRuntime.jsx("p", { className: "text-[13px] font-normal text-label", children: description }))] })] }), headerAction] }), jsxRuntime.jsx("div", { className: cn('p-5', bodyClassName), children: children })] }));
-};
-
 const TONE_STYLES = {
     info: {
         container: 'border-border bg-section-header',
@@ -38003,6 +38043,21 @@ function formatCurrency(amount, currency) {
         currency: currency || 'USD',
     }).format(amount);
 }
+/** The currency the invoice was issued in; `baseCurrency` is only its ledger currency. */
+function getInvoiceCurrency(invoice) {
+    const target = invoice.target?.currency?.trim().toUpperCase();
+    return target && invoice.target?.rate ? target : invoice.baseCurrency || 'USD';
+}
+function getInvoiceCompany(invoice) {
+    return invoice.customer?.companyName || invoice.customer?.contactName || 'N/A';
+}
+function getInvoiceLocation(invoice) {
+    const address = invoice.customer?.address ?? invoice.address;
+    return [address?.city, address?.state, address?.country]
+        .map((part) => part?.trim())
+        .filter(Boolean)
+        .join(', ');
+}
 
 function useInvoiceComboBox(fetchInvoices, statusFilter) {
     const fetchPage = React.useCallback(async ({ page, limit, search }) => {
@@ -38067,7 +38122,8 @@ function InvoiceComboBox({ selectedItem, onSelect, fetchInvoices, searchPlacehol
             const invoice = item.data;
             const invoiceDate = new Date(invoice.invoiceDate).toLocaleDateString();
             const dueDate = new Date(invoice.paymentDueDate).toLocaleDateString();
-            return (jsxRuntime.jsxs("div", { className: "flex-1 min-w-0", children: [jsxRuntime.jsxs("div", { className: "flex items-center gap-2 mb-1", children: [jsxRuntime.jsx("span", { className: "font-semibold text-sm text-foreground", children: invoice.invoiceNumber }), jsxRuntime.jsx(StatusBadge, { status: invoice.status })] }), jsxRuntime.jsxs("div", { className: "text-xs text-muted-foreground mb-1", children: ["Customer: ", invoice.customer?.contactName || 'N/A'] }), jsxRuntime.jsxs("div", { className: "flex flex-wrap gap-2 mt-1", children: [jsxRuntime.jsxs("span", { className: "text-xs text-muted-foreground", children: ["Date: ", invoiceDate] }), jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground", children: "\u2022" }), jsxRuntime.jsxs("span", { className: "text-xs text-muted-foreground", children: ["Due: ", dueDate] })] }), jsxRuntime.jsxs("div", { className: "flex flex-wrap gap-2 mt-1", children: [jsxRuntime.jsxs("span", { className: "text-xs font-medium text-foreground", children: ["Total:", ' ', formatCurrency(invoice.totalAmount, invoice.baseCurrency)] }), invoice.outstandingAmount > 0 && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground", children: "\u2022" }), jsxRuntime.jsxs("span", { className: "text-xs text-destructive", children: ["Outstanding:", ' ', formatCurrency(invoice.outstandingAmount, invoice.baseCurrency)] })] }))] })] }));
+            const location = getInvoiceLocation(invoice);
+            return (jsxRuntime.jsxs("div", { className: "flex-1 min-w-0", children: [jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-2 mb-1", children: [jsxRuntime.jsxs("div", { className: "flex min-w-0 items-center gap-2", children: [jsxRuntime.jsx("span", { className: "font-semibold text-sm text-foreground", children: invoice.invoiceNumber }), jsxRuntime.jsx(StatusBadge, { status: invoice.status })] }), jsxRuntime.jsx("span", { className: "shrink-0 text-xs font-semibold text-foreground", children: getInvoiceCurrency(invoice) })] }), jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-2 mb-1 text-xs text-muted-foreground", children: [jsxRuntime.jsx("span", { className: "min-w-0 truncate", children: getInvoiceCompany(invoice) }), location ? jsxRuntime.jsx("span", { className: "shrink-0", children: location }) : null] }), jsxRuntime.jsxs("div", { className: "flex flex-wrap gap-2 mt-1", children: [jsxRuntime.jsxs("span", { className: "text-xs text-muted-foreground", children: ["Date: ", invoiceDate] }), jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground", children: "\u2022" }), jsxRuntime.jsxs("span", { className: "text-xs text-muted-foreground", children: ["Due: ", dueDate] })] }), jsxRuntime.jsxs("div", { className: "flex flex-wrap gap-2 mt-1", children: [jsxRuntime.jsxs("span", { className: "text-xs font-medium text-foreground", children: ["Total:", ' ', formatCurrency(invoice.totalAmount, invoice.baseCurrency)] }), invoice.outstandingAmount > 0 && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("span", { className: "text-xs text-muted-foreground", children: "\u2022" }), jsxRuntime.jsxs("span", { className: "text-xs text-destructive", children: ["Outstanding:", ' ', formatCurrency(invoice.outstandingAmount, invoice.baseCurrency)] })] }))] })] }));
         }, fetchPage: fetchPage, resolveById: resolveById, preSelectedId: preSelectedId ?? null, searchPlaceholder: searchPlaceholder, emptyMessage: "No invoices found.", disabled: disabled, className: className, align: align, debounceMs: 300 }));
 }
 
@@ -38244,27 +38300,59 @@ const NumberedStepCard = ({ step, title, description, className, }) => {
     return (jsxRuntime.jsxs("div", { className: cn('flex flex-col gap-3 rounded-xl border border-border bg-card p-4', className), children: [jsxRuntime.jsx("span", { className: "inline-flex h-6 w-6 items-center justify-center rounded-full bg-primary text-xs font-medium text-primary-foreground", children: step }), jsxRuntime.jsxs("div", { className: "space-y-1", children: [jsxRuntime.jsx("p", { className: "text-sm font-medium text-foreground", children: title }), jsxRuntime.jsx("p", { className: "text-xs leading-snug text-label", children: description })] })] }));
 };
 
+/** Options with a description get the taller layout with an icon badge (default variant only). */
+function hasDetails(variant, hasDescription) {
+    return variant === 'default' && hasDescription;
+}
+/** Dark mode: `--primary` is too dim on near-black, so the detailed active state uses the design's lighter green. */
+const DARK_ACTIVE_GREEN = 'dark:border-[#6FB98A]';
+const DARK_ACTIVE_GREEN_TEXT = 'dark:text-[#6FB98A]';
+function getListClassName(variant, detailed) {
+    if (detailed) {
+        // Light: a faint primary tint. Dark: `--muted` is a light overlay that would outshine the active segment.
+        return 'inline-flex w-full items-center gap-1 rounded-xl border border-transparent bg-primary/5 p-1 dark:border-border dark:bg-black/25';
+    }
+    return cn('inline-flex w-full items-center gap-1 bg-muted p-1', variant === 'bordered' ? 'rounded-lg' : 'rounded-md');
+}
+function getSegmentClassName(variant, isActive, isDisabled, detailed = false) {
+    return cn('inline-flex cursor-pointer items-center justify-center gap-2 border px-3 text-sm font-medium transition-colors disabled:cursor-not-allowed', 'outline-none focus-visible:ring-2 focus-visible:ring-primary/30', detailed ? 'min-h-11 rounded-lg border-2 py-2 font-semibold' : 'h-7 rounded-md', 
+    // Bordered tabs size to their content (Figma "Advance Tabs"); the others stretch to equal width.
+    variant === 'bordered' ? 'shrink-0' : 'flex-1', 
+    // Every segment carries a border so the active one's primary border doesn't shift the layout.
+    isActive
+        ? cn('border-primary bg-card shadow-xs', detailed ? cn('text-primary dark:bg-muted dark:text-foreground dark:shadow-none', DARK_ACTIVE_GREEN) : 'text-primary')
+        : cn('border-transparent', variant === 'bordered' || detailed ? 'text-secondary-foreground' : 'text-muted-foreground', variant === 'bordered' && 'text-foreground', 'hover:text-foreground'), isDisabled && 'cursor-not-allowed opacity-50');
+}
+function getIconClassName(detailed, isActive) {
+    if (!detailed) {
+        return 'inline-flex shrink-0 items-center [&_svg]:h-4 [&_svg]:w-4';
+    }
+    return cn('inline-flex size-7 shrink-0 items-center justify-center rounded-full text-sm font-semibold [&_svg]:size-4', isActive ? cn('bg-primary/10 text-primary dark:bg-primary/25', DARK_ACTIVE_GREEN_TEXT) : 'bg-foreground/5 text-muted-foreground');
+}
+function getContentClassName(layout) {
+    return layout === 'inline'
+        ? 'flex min-w-0 items-baseline gap-2'
+        : 'flex min-w-0 flex-col items-center gap-0.5';
+}
+function getDescriptionClassName(isActive) {
+    return cn('truncate text-xs font-normal', isActive ? cn('text-primary', DARK_ACTIVE_GREEN_TEXT) : 'text-muted-foreground');
+}
+
 /**
- * Pill-shaped segmented control with N equally-sized buttons. The active
- * segment lifts forward with a white bg + subtle shadow; inactive segments
- * blend into the muted container background.
+ * Pill-shaped segmented control. The active segment lifts forward with a card
+ * bg, primary border and subtle shadow; inactive segments blend into the muted
+ * container background. Giving options a `description` makes the default
+ * segments taller, with the icon in a badge.
  *
  * Single source of truth for "two-or-more mutually exclusive views" toggles
  * (e.g. Owned / Memo on the ownership form).
  */
-function SegmentedControl({ value, onChange, options, ariaLabel, className, disabled, variant = 'default', }) {
-    const isBordered = variant === 'bordered';
-    return (jsxRuntime.jsx("div", { role: "tablist", "aria-label": ariaLabel, className: cn('inline-flex w-full items-center gap-1 bg-muted p-1', isBordered ? 'rounded-lg' : 'rounded-md', className), children: options.map((opt) => {
+function SegmentedControl({ value, onChange, options, ariaLabel, className, disabled, variant = 'default', optionLayout = 'stacked', }) {
+    const detailed = options.some((opt) => hasDetails(variant, opt.description != null));
+    return (jsxRuntime.jsx("div", { role: "tablist", "aria-label": ariaLabel, className: cn(getListClassName(variant, detailed), className), children: options.map((opt) => {
             const isActive = value === opt.value;
-            const isDisabled = disabled || opt.disabled;
-            return (jsxRuntime.jsxs("button", { type: "button", role: "tab", "aria-selected": isActive, disabled: isDisabled, onClick: () => !isDisabled && onChange(opt.value), className: cn('inline-flex h-7 cursor-pointer items-center justify-center gap-2 rounded-md px-3 text-sm font-medium transition-colors disabled:cursor-not-allowed', 'outline-none focus-visible:ring-2 focus-visible:ring-primary/30', 
-                // Bordered tabs size to their content (Figma "Advance Tabs"); the
-                // default variant stretches every segment to equal width.
-                isBordered ? 'shrink-0' : 'flex-1', isActive
-                    ? cn('bg-card text-primary shadow-xs', isBordered && 'border border-primary')
-                    : isBordered
-                        ? 'text-foreground hover:text-foreground'
-                        : 'text-muted-foreground hover:text-foreground', isDisabled && 'cursor-not-allowed opacity-50'), children: [opt.icon && (jsxRuntime.jsx("span", { "aria-hidden": "true", className: "inline-flex shrink-0 items-center [&_svg]:h-4 [&_svg]:w-4", children: opt.icon })), jsxRuntime.jsx("span", { className: "whitespace-nowrap", children: opt.label })] }, opt.value));
+            const isDisabled = !!(disabled || opt.disabled);
+            return (jsxRuntime.jsxs("button", { type: "button", role: "tab", "aria-selected": isActive, disabled: isDisabled, onClick: () => !isDisabled && onChange(opt.value), className: getSegmentClassName(variant, isActive, isDisabled, detailed), children: [opt.icon && (jsxRuntime.jsx("span", { "aria-hidden": "true", className: getIconClassName(detailed, isActive), children: opt.icon })), detailed && opt.description != null ? (jsxRuntime.jsxs("span", { className: getContentClassName(optionLayout), children: [jsxRuntime.jsx("span", { className: "whitespace-nowrap", children: opt.label }), jsxRuntime.jsx("span", { className: getDescriptionClassName(isActive), children: opt.description })] })) : (jsxRuntime.jsx("span", { className: "whitespace-nowrap", children: opt.label }))] }, opt.value));
         }) }));
 }
 
@@ -77709,6 +77797,7 @@ exports.Collapsible = Collapsible;
 exports.CollapsibleCard = CollapsibleCard;
 exports.CollapsibleContent = CollapsibleContent;
 exports.CollapsibleTrigger = CollapsibleTrigger;
+exports.CompanyCard = CompanyCard;
 exports.ConfirmDialog = ConfirmDialog;
 exports.ContactTypeFilter = ContactTypeFilter;
 exports.CopyButton = CopyButton;