hs-uix 1.5.1 → 1.6.1

package/dist/utils.js

@@ -21,8 +21,10 @@ var utils_exports = {};
 __export(utils_exports, {
   buildOptions: () => buildOptions,
   createStatusTagSortComparator: () => createStatusTagSortComparator,
+  deriveCardFieldsFromColumns: () => deriveCardFieldsFromColumns,
   findOptionLabel: () => findOptionLabel,
   formatCurrency: () => formatCurrency,
+  formatCurrencyCompact: () => formatCurrencyCompact,
   formatDate: () => formatDate,
   formatDateTime: () => formatDateTime,
   formatPercentage: () => formatPercentage,
@@ -88,6 +90,20 @@ var formatPercentage = (value, { locale = DEFAULT_LOCALE, minimumFractionDigits
   maximumFractionDigits,
   ...options
 }).format(Number(value || 0));
+var formatCurrencyCompact = (value, {
+  locale = DEFAULT_LOCALE,
+  currency = "USD",
+  maximumFractionDigits = 1,
+  compactDisplay = "short",
+  ...options
+} = {}) => new Intl.NumberFormat(locale, {
+  style: "currency",
+  currency,
+  notation: "compact",
+  compactDisplay,
+  maximumFractionDigits,
+  ...options
+}).format(Number(value || 0));
 
 // src/utils/hubspotValues.js
 var isDateValueObject = (value) => Boolean(
@@ -250,12 +266,56 @@ var createStatusTagSortComparator = (options = {}) => {
     return labelOf(aVal).localeCompare(labelOf(bVal));
   };
 };
+
+// src/utils/viewAdapters.js
+var deriveCardFieldsFromColumns = (columns, opts = {}) => {
+  var _a;
+  const {
+    titleField,
+    titleHref,
+    placements = {},
+    exclude,
+    include,
+    maxBodyFields
+  } = opts;
+  const excludeSet = new Set(exclude || []);
+  const includeSet = include ? new Set(include) : null;
+  const filtered = (columns || []).filter((col) => {
+    if (!col || !col.field) return false;
+    if (excludeSet.has(col.field)) return false;
+    if (includeSet && !includeSet.has(col.field)) return false;
+    return true;
+  });
+  const resolvedTitleField = titleField || Object.keys(placements).find((k) => placements[k] === "title") || ((_a = filtered[0]) == null ? void 0 : _a.field);
+  const out = [];
+  let bodyCount = 0;
+  for (const col of filtered) {
+    const placement = placements[col.field] || (col.field === resolvedTitleField ? "title" : "body");
+    if (placement === "body" && maxBodyFields != null && bodyCount >= maxBodyFields) {
+      continue;
+    }
+    if (placement === "body") bodyCount += 1;
+    const cardField = {
+      key: col.field,
+      field: col.field,
+      placement
+    };
+    if (col.label != null) cardField.label = col.label;
+    if (col.renderCell) cardField.render = col.renderCell;
+    if (col.truncate != null) cardField.truncate = col.truncate;
+    if (placement === "title" && titleHref) cardField.href = titleHref;
+    out.push(cardField);
+  }
+  return out;
+};
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   buildOptions,
   createStatusTagSortComparator,
+  deriveCardFieldsFromColumns,
   findOptionLabel,
   formatCurrency,
+  formatCurrencyCompact,
   formatDate,
   formatDateTime,
   formatPercentage,

package/dist/utils.mjs

@@ -50,6 +50,20 @@ var formatPercentage = (value, { locale = DEFAULT_LOCALE, minimumFractionDigits
   maximumFractionDigits,
   ...options
 }).format(Number(value || 0));
+var formatCurrencyCompact = (value, {
+  locale = DEFAULT_LOCALE,
+  currency = "USD",
+  maximumFractionDigits = 1,
+  compactDisplay = "short",
+  ...options
+} = {}) => new Intl.NumberFormat(locale, {
+  style: "currency",
+  currency,
+  notation: "compact",
+  compactDisplay,
+  maximumFractionDigits,
+  ...options
+}).format(Number(value || 0));
 
 // src/utils/hubspotValues.js
 var isDateValueObject = (value) => Boolean(
@@ -212,11 +226,55 @@ var createStatusTagSortComparator = (options = {}) => {
     return labelOf(aVal).localeCompare(labelOf(bVal));
   };
 };
+
+// src/utils/viewAdapters.js
+var deriveCardFieldsFromColumns = (columns, opts = {}) => {
+  var _a;
+  const {
+    titleField,
+    titleHref,
+    placements = {},
+    exclude,
+    include,
+    maxBodyFields
+  } = opts;
+  const excludeSet = new Set(exclude || []);
+  const includeSet = include ? new Set(include) : null;
+  const filtered = (columns || []).filter((col) => {
+    if (!col || !col.field) return false;
+    if (excludeSet.has(col.field)) return false;
+    if (includeSet && !includeSet.has(col.field)) return false;
+    return true;
+  });
+  const resolvedTitleField = titleField || Object.keys(placements).find((k) => placements[k] === "title") || ((_a = filtered[0]) == null ? void 0 : _a.field);
+  const out = [];
+  let bodyCount = 0;
+  for (const col of filtered) {
+    const placement = placements[col.field] || (col.field === resolvedTitleField ? "title" : "body");
+    if (placement === "body" && maxBodyFields != null && bodyCount >= maxBodyFields) {
+      continue;
+    }
+    if (placement === "body") bodyCount += 1;
+    const cardField = {
+      key: col.field,
+      field: col.field,
+      placement
+    };
+    if (col.label != null) cardField.label = col.label;
+    if (col.renderCell) cardField.render = col.renderCell;
+    if (col.truncate != null) cardField.truncate = col.truncate;
+    if (placement === "title" && titleHref) cardField.href = titleHref;
+    out.push(cardField);
+  }
+  return out;
+};
 export {
   buildOptions,
   createStatusTagSortComparator,
+  deriveCardFieldsFromColumns,
   findOptionLabel,
   formatCurrency,
+  formatCurrencyCompact,
   formatDate,
   formatDateTime,
   formatPercentage,

package/form.d.ts

@@ -13,6 +13,7 @@ export {
   FormBuilderValidator,
   FormBuilderDependsOnConfig,
   FormBuilderRepeaterProps,
+  FormBuilderGroupOptions,
   FormBuilderLabels,
   FormBuilderAlertConfig,
   FormBuilderButtonsRenderContext,

package/index.d.ts

@@ -26,6 +26,37 @@ export type {
   DataTableErrorStateRenderContext,
 } from "./packages/datatable/index";
 
+export { Kanban, KanbanCardActions } from "./packages/kanban/index";
+export type {
+  KanbanProps,
+  KanbanStage,
+  KanbanStageMeta,
+  KanbanStageVariant,
+  KanbanStageControlMode,
+  KanbanCardField,
+  KanbanCardFieldPlacement,
+  KanbanCardDensity,
+  KanbanCardBodyMode,
+  KanbanCardDividers,
+  KanbanCardRenderContext,
+  KanbanFilterConfig,
+  KanbanFilterType,
+  KanbanSortOption,
+  KanbanSelectionAction,
+  KanbanCardAction,
+  KanbanCardActionsProps,
+  KanbanLabels,
+  KanbanParams,
+  KanbanStageChangeResult,
+  KanbanMetricItem,
+  KanbanSelectionBarRenderContext,
+  KanbanEmptyStateRenderContext,
+  KanbanLoadingStateRenderContext,
+  KanbanErrorStateRenderContext,
+  KanbanTransitionPromptContext,
+  KanbanOption,
+} from "./packages/kanban/index";
+
 export { FormBuilder, useFormPrefill } from "./packages/form/index";
 export type {
   FormBuilderProps,
@@ -40,6 +71,7 @@ export type {
   FormBuilderValidator,
   FormBuilderDependsOnConfig,
   FormBuilderRepeaterProps,
+  FormBuilderGroupOptions,
   FormBuilderLabels,
   FormBuilderAlertConfig,
   FormBuilderButtonsRenderContext,
@@ -53,6 +85,28 @@ export type {
 } from "./packages/form/index";
 
 export { AutoTag, AutoStatusTag, KeyValueList, SectionHeader } from "./common-components";
+export {
+  AvatarStack,
+  StyledText,
+  makeAvatarStackDataUri,
+  makeStyledTextDataUri,
+  HS_DATE_DIRECTION_LABELS,
+  HS_DATE_PRESETS,
+  HS_FONT_FAMILY,
+  HS_TEXT_COLOR,
+  HS_SUBTLE_BG,
+  HS_MUTED_TEXT,
+  HS_NEUTRAL_CHIP,
+  HS_TAG_SUBTLE_BORDER,
+  HS_TAG_TEXT_COLOR,
+  HS_TAG_FONT_SIZE,
+  HS_TAG_LINE_HEIGHT,
+  HS_TAG_PADDING_X,
+  HS_TAG_PADDING_Y,
+  HS_TAG_BORDER_RADIUS,
+  HS_TAG_BORDER_WIDTH,
+  DEFAULT_SVG_FONT_WEIGHT,
+} from "./common-components";
 export {
   getAutoTagVariant,
   getAutoStatusTagVariant,
@@ -68,7 +122,18 @@ export type {
 export type {
   AutoTagProps,
   AutoStatusTagProps,
+  AvatarStackDataUriResult,
+  AvatarStackItem,
+  AvatarStackItemObject,
+  AvatarStackProps,
+  DateDirectionLabels,
+  DatePresetOption,
   KeyValueListItem,
   KeyValueListProps,
   SectionHeaderProps,
+  StyledTextBackground,
+  StyledTextDataUriOptions,
+  StyledTextDataUriResult,
+  StyledTextFormat,
+  StyledTextProps,
 } from "./common-components";

package/kanban.d.ts

@@ -0,0 +1 @@
+export * from "./packages/kanban/index";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "hs-uix",
-  "version": "1.5.1",
+  "version": "1.6.1",
   "description": "Production-ready UI components for HubSpot UI Extensions — DataTable, FormBuilder, and more",
   "license": "MIT",
   "main": "./dist/index.js",
@@ -22,6 +22,11 @@
       "import": "./dist/form.mjs",
       "require": "./dist/form.js"
     },
+    "./kanban": {
+      "types": "./kanban.d.ts",
+      "import": "./dist/kanban.mjs",
+      "require": "./dist/kanban.js"
+    },
     "./common-components": {
       "types": "./common-components.d.ts",
       "import": "./dist/common-components.mjs",
@@ -38,6 +43,7 @@
     "index.d.ts",
     "datatable.d.ts",
     "form.d.ts",
+    "kanban.d.ts",
     "common-components.d.ts",
     "utils.d.ts",
     "README.md"

package/utils.d.ts

@@ -47,7 +47,34 @@ export interface StatusTagSortComparatorOptions extends AutoStatusTagOptions {
 export declare function createStatusTagSortComparator(
   options?: StatusTagSortComparatorOptions
 ): (aValue: unknown, bValue: unknown) => number;
+export interface FormatCurrencyCompactOptions extends Intl.NumberFormatOptions {
+  locale?: string;
+  currency?: string;
+  maximumFractionDigits?: number;
+  compactDisplay?: "short" | "long";
+}
+
+export interface DeriveCardFieldsOptions<Row = Record<string, unknown>> {
+  titleField?: string;
+  titleHref?: (row: Row) => string | { url: string; external?: boolean };
+  placements?: Record<string, "title" | "subtitle" | "meta" | "body" | "footer">;
+  exclude?: string[];
+  include?: string[];
+  maxBodyFields?: number;
+}
+
+export interface DerivedCardField<Row = Record<string, unknown>> {
+  key: string;
+  field: string;
+  placement: "title" | "subtitle" | "meta" | "body" | "footer";
+  label?: unknown;
+  render?: (value: unknown, row: Row) => unknown;
+  truncate?: true | number | { maxLength?: number };
+  href?: (row: Row) => string | { url: string; external?: boolean };
+}
+
 export declare function formatCurrency(value: unknown, options?: FormatCurrencyOptions): string;
+export declare function formatCurrencyCompact(value: unknown, options?: FormatCurrencyCompactOptions): string;
 export declare function formatDate(value: unknown, options?: FormatDateOptions): string;
 export declare function formatDateTime(value: unknown, options?: FormatDateOptions): string;
 export declare function formatPercentage(value: unknown, options?: Intl.NumberFormatOptions & { locale?: string }): string;
@@ -57,3 +84,7 @@ export declare function isDateValueObject(value: unknown): boolean;
 export declare function isTimeValueObject(value: unknown): boolean;
 export declare function isDateTimeValueObject(value: unknown): boolean;
 export declare function sumBy<Item = Record<string, unknown>>(items: Item[] | null | undefined, keyOrFn: keyof Item | ((item: Item) => unknown)): number;
+export declare function deriveCardFieldsFromColumns<Row = Record<string, unknown>>(
+  columns: ReadonlyArray<Record<string, unknown>> | null | undefined,
+  options?: DeriveCardFieldsOptions<Row>
+): DerivedCardField<Row>[];