@servicetitan/anvil2 2.0.1 → 2.0.3

package/dist/Combobox.js

@@ -1,3 +1,3 @@
-export { C as Combobox, a as ComboboxElement, c as ComboboxList, b as ComboboxSelect, C as default } from './Combobox-Bb79Jl9I.js';
+export { C as Combobox, a as ComboboxElement, c as ComboboxList, b as ComboboxSelect, C as default } from './Combobox-CNObHLjp.js';
 export { u as useInfiniteCombobox } from './useInfiniteCombobox-WcRgC9p6.js';
 //# sourceMappingURL=Combobox.js.map

package/dist/{DataTable-CLr0j95O.js → DataTable-CQpySyDq.js}

@@ -1,39 +1,30 @@
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { C as Chip } from './Chip-U9Ly2Ykq.js';
-import { F as Flex } from './Flex-DKS51qTf.js';
+import { C as Chip } from './Chip-Bc7jiIJ1.js';
+import { F as Flex } from './Flex-CUtXN-C0.js';
 import * as React from 'react';
 import { useRef, useState, useLayoutEffect, createContext, useContext, useCallback, forwardRef, useMemo, useImperativeHandle, useEffect, Fragment as Fragment$1, useReducer } from 'react';
 import { c as cx } from './index-SvGbrGuT.js';
 import { D as DateTime } from './luxon-wpz4A-OQ.js';
-import { C as Checkbox } from './Checkbox-Igz3R72o.js';
-import { B as Button } from './Button-B__Q1BA5.js';
+import { C as Checkbox } from './Checkbox-ZXftLNwB.js';
+import { B as Button } from './Button-l7pTJdPc.js';
 import { S as SvgChevronRight } from './chevron_right-BdpsxX7x.js';
 import { S as SvgEdit } from './edit-DQOiktcu.js';
-import { I as Icon } from './Icon-BckjFkbw.js';
+import { I as Icon } from './Icon-Bcil6aBo.js';
 import { S as SrOnly } from './SrOnly-CrdBTl6E.js';
-import { M as Menu } from './Menu-Dh0q__vE.js';
+import { M as Menu } from './Menu-3LIfRdTk.js';
 import { m as mergeRefs } from './useMergeRefs-Dfmtq9cI.js';
-import { P as Popover } from './Popover-U2Eu7v1Q.js';
-import { S as SearchField } from './SearchField-0DZvPwPZ.js';
-import { L as ListView } from './ListView-CBmaHOY-.js';
+import { P as Popover } from './Popover-OOLK0hUz.js';
+import { S as SearchField } from './SearchField-CoeaOip5.js';
+import { L as ListView } from './ListView-CtRhYAls.js';
 import { S as SvgError } from './error-DR_wWdYY.js';
-import { T as Tooltip } from './Tooltip-CIsvQwWo.js';
+import { T as Tooltip } from './Tooltip-CUiAJXak.js';
 import { flushSync } from 'react-dom';
-import { u as useLayoutPropsUtil } from './useLayoutPropsUtil-BlIWftBb.js';
+import { u as useLayoutPropsUtil } from './useLayoutPropsUtil-loxbyklF.js';
 import './anvil-fonts.css';import './DataTable.css';/* empty css                     */
-import { P as Pagination } from './Pagination-CimQTC7M.js';
+import { P as Pagination } from './Pagination-DIatYUXX.js';
 import { S as Spinner } from './Spinner-CpEm3Lud.js';
 import { u as useOptionallyControlledState } from './useOptionallyControlledState-DbDuos5L.js';
 
-function createColumnHelper$1() {
-  return function createColumn(id, column) {
-    if (typeof id === "object" && "group" in id) {
-      return { id: id.group, ...column };
-    }
-    return { id, ...column };
-  };
-}
-
 const booleanFormatter = (value, { trueLabel = "True", falseLabel = "False" } = {}) => {
   if (value == null) {
     return null;
@@ -194,7 +185,7 @@ const timeFormatPresets = {
   medium: { hour: "2-digit", minute: "2-digit", second: "2-digit" }
 };
 
-const dateFormatter = (value, { locale = "en-US", format = "medium" } = {}) => {
+const dateFormatter = (value, { locale = "en-US", format = "short" } = {}) => {
   if (value == null) {
     return null;
   }
@@ -215,7 +206,7 @@ const hasTimezoneInfo = (isoString) => {
 };
 const dateTimeFormatter = (value, {
   locale = "en-US",
-  dateFormat = "medium",
+  dateFormat = "short",
   timeFormat = "short",
   timeZone
 } = {}) => {
@@ -250,9 +241,9 @@ const dateTimeFormatter = (value, {
   const dateOptions = typeof dateFormat === "string" ? dateFormatPresets[dateFormat] : dateFormat;
   const timeOptions = typeof timeFormat === "string" ? timeFormat === "none" ? {} : timeFormatPresets[timeFormat] : timeFormat;
   const formatOptions = {
+    ...includeTimezone && { timeZoneName: "short" },
     ...dateOptions,
-    ...timeOptions,
-    ...includeTimezone && { timeZoneName: "short" }
+    ...timeOptions
   };
   return localizedDateTime.toLocaleString(formatOptions);
 };
@@ -305,7 +296,7 @@ const formatPresets = {
   short: { month: "short", day: "2-digit" },
   long: { month: "long", day: "2-digit" }
 };
-const yearlessDateFormatter = (value, { locale = "en-US", format = "long" } = {}) => {
+const yearlessDateFormatter = (value, { locale = "en-US", format = "short" } = {}) => {
   if (value == null) {
     return null;
   }
@@ -344,6 +335,122 @@ const yearlessDateFormatter = (value, { locale = "en-US", format = "long" } = {}
   return dateTime.toLocaleString(format);
 };
 
+const COLUMN_TYPE_DEFAULTS = {
+  text: {
+    align: "start",
+    createRenderCell: () => void 0
+    // No formatter, use raw value
+  },
+  number: {
+    align: "end",
+    createRenderCell: (options) => (value) => numberFormatter(
+      value,
+      options
+    )
+  },
+  currency: {
+    align: "end",
+    createRenderCell: (options) => (value) => currencyFormatter(
+      value,
+      options
+    )
+  },
+  percent: {
+    align: "end",
+    createRenderCell: (options) => (value) => percentFormatter(
+      value,
+      options
+    )
+  },
+  date: {
+    align: "end",
+    createRenderCell: (options) => (value) => dateFormatter(
+      value,
+      options
+    )
+  },
+  dateTime: {
+    align: "end",
+    createRenderCell: (options) => (value) => dateTimeFormatter(
+      value,
+      options
+    )
+  },
+  time: {
+    align: "end",
+    createRenderCell: (options) => (value) => timeFormatter(
+      value,
+      options
+    )
+  },
+  boolean: {
+    align: "start",
+    createRenderCell: (options) => (value) => booleanFormatter(
+      value,
+      options
+    )
+  }
+};
+function resolveColumnTypeConfig(config) {
+  if (typeof config === "string") {
+    return [config, void 0];
+  }
+  return [config.type, config.options];
+}
+function getColumnTypeDefaults(type) {
+  return COLUMN_TYPE_DEFAULTS[type];
+}
+
+function logDeprecationWarnings(id, column) {
+  if (process.env.NODE_ENV === "production") {
+    return;
+  }
+  const columnId = typeof id === "object" && "group" in id ? id.group : String(id);
+  if ("editMode" in column && column.editMode && !("editConfig" in column && column.editConfig)) {
+    console.warn(
+      `[Anvil2 DataTable] Column "${columnId}" uses deprecated \`editMode\` prop. Migrate to \`editConfig: { mode: "${column.editMode}", onChange: ... }\``
+    );
+  }
+  if ("onChange" in column && column.onChange && !("editConfig" in column && column.editConfig)) {
+    console.warn(
+      `[Anvil2 DataTable] Column "${columnId}" uses deprecated top-level \`onChange\`. Move \`onChange\` inside \`editConfig\`.`
+    );
+  }
+  if ("options" in column && column.options && !("editConfig" in column && column.editConfig)) {
+    console.warn(
+      `[Anvil2 DataTable] Column "${columnId}" uses deprecated top-level \`options\`. Move \`options\` inside \`editConfig\`.`
+    );
+  }
+}
+function transformEditConfig(column) {
+  if (!("editConfig" in column) || !column.editConfig) {
+    return {};
+  }
+  const { editConfig } = column;
+  const result = {
+    editMode: editConfig.mode,
+    onChange: editConfig.onChange
+  };
+  if ("options" in editConfig) {
+    result.options = editConfig.options;
+  }
+  return result;
+}
+function createColumnHelper$1() {
+  return function createColumn(id, column) {
+    logDeprecationWarnings(id, column);
+    const editProps = transformEditConfig(column);
+    if (typeof id === "object" && "group" in id) {
+      return {
+        id: id.group,
+        ...column,
+        ...editProps
+      };
+    }
+    return { id, ...column, ...editProps };
+  };
+}
+
 /**
    * table-core
    *
@@ -5256,12 +5363,28 @@ function getTanStackColumnDef({
       enableResizing: columnDef.resizable
     });
   }
+  let resolvedAlign = columnDef.align;
+  let resolvedRenderCell = columnDef.renderCell;
+  if (columnDef.type) {
+    const [columnType, typeOptions] = resolveColumnTypeConfig(
+      columnDef.type
+    );
+    const typeDefaults = getColumnTypeDefaults(columnType);
+    if (resolvedAlign === void 0) {
+      resolvedAlign = typeDefaults.align;
+    }
+    if (resolvedRenderCell === void 0) {
+      resolvedRenderCell = typeDefaults.createRenderCell(
+        typeOptions
+      );
+    }
+  }
   return columnHelper.accessor((row) => row[columnDef.id], {
     id: columnDef.id,
     cell: (info) => {
       let cellContent;
-      if (columnDef.renderCell) {
-        cellContent = columnDef.renderCell(info.getValue(), info.row.depth);
+      if (resolvedRenderCell) {
+        cellContent = resolvedRenderCell(info.getValue(), info.row.depth);
       } else {
         cellContent = info.getValue();
       }
@@ -5272,7 +5395,7 @@ function getTanStackColumnDef({
       return /* @__PURE__ */ jsxs(
         Flex,
         {
-          justifyContent: columnDef.align,
+          justifyContent: resolvedAlign,
           alignItems: "center",
           wrap: "wrap",
           gap: "1",
@@ -5286,7 +5409,7 @@ function getTanStackColumnDef({
         }
       );
     },
-    header: () => /* @__PURE__ */ jsx(Flex, { justifyContent: columnDef.align, wrap: "wrap", grow: 1, children: columnDef.headerLabel }),
+    header: () => /* @__PURE__ */ jsx(Flex, { justifyContent: resolvedAlign, wrap: "wrap", grow: 1, children: columnDef.headerLabel }),
     footer: columnDef.footerContent ? () => columnDef.footerContent : void 0,
     minSize: columnDef.minWidth,
     maxSize: columnDef.maxWidth,
@@ -5996,7 +6119,6 @@ function DTFocusProvider({
   const dispatch = useCallback(
     (action) => {
       const newState = reducer(stateRef.current, action, rowCount, columnCount);
-      console.log("dispatch", action.type, "->", JSON.stringify(newState));
       let shouldSkipFocusUpdate = false;
       if (areCellPositionsEqual(
         newState.focusedCell,
@@ -6053,6 +6175,7 @@ function DataTableInner(props, ref) {
     pagination,
     selectedRowIds,
     sortedColumn,
+    className,
     style,
     ...rest
   } = componentProps;
@@ -6428,7 +6551,9 @@ function DataTableInner(props, ref) {
             ...styleCombined,
             width: cssVars["--a2-table-width"]
           },
-          className: pagination ? styles["container-with-pagination"] : void 0,
+          className: cx(className, {
+            [styles["container-with-pagination"]]: pagination
+          }),
           children: [
             /* @__PURE__ */ jsxs(
               TableBase,
@@ -6507,5 +6632,5 @@ function DataTableInner(props, ref) {
 }
 const DataTable = forwardRef(DataTableInner);
 
-export { DataTable as D, chipsFormatter as a, booleanFormatter as b, createColumnHelper$1 as c, currencyFormatter as d, dateFormatter as e, dateTimeFormatter as f, dateFormatPresets as g, timeFormatter as h, numberFormatter as n, percentFormatter as p, timeFormatPresets as t, yearlessDateFormatter as y };
-//# sourceMappingURL=DataTable-CLr0j95O.js.map
+export { COLUMN_TYPE_DEFAULTS as C, DataTable as D, chipsFormatter as a, booleanFormatter as b, createColumnHelper$1 as c, currencyFormatter as d, dateFormatter as e, dateTimeFormatter as f, getColumnTypeDefaults as g, dateFormatPresets as h, timeFormatter as i, numberFormatter as n, percentFormatter as p, resolveColumnTypeConfig as r, timeFormatPresets as t, yearlessDateFormatter as y };
+//# sourceMappingURL=DataTable-CQpySyDq.js.map