@airtable/blocks 0.0.0-experimental-e5ab33b68-20250905 → 0.0.0-experimental-e625869e5-20251002

package/dist/{cjs → esm}/shared/sdk_core.js

@@ -1,11 +1,5 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.BlockSdkCore = void 0;
-var _global_config = _interopRequireDefault(require("./global_config"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+import GlobalConfig from './global_config';
+
 /**
  * @hidden
  * @example
@@ -22,7 +16,7 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e
  */
 
 /** @hidden */
-class BlockSdkCore {
+export class BlockSdkCore {
   /**
    * This value is used by the blocks-testing library to verify
    * compatibility.
@@ -30,7 +24,7 @@ class BlockSdkCore {
    * @hidden
    */
   // @ts-ignore
-  static VERSION = "1.19.0";
+  static VERSION = "0.0.0-experimental-e625869e5-20251002";
 
   /** Storage for this block installation's configuration. */
 
@@ -62,7 +56,7 @@ class BlockSdkCore {
     // @ts-ignore
     airtableInterface.assertAllowedSdkPackageVersion("@airtable/blocks", BlockSdkCore.VERSION);
     const sdkInitData = airtableInterface.sdkInitData;
-    this.globalConfig = new _global_config.default(sdkInitData.initialKvValuesByKey, this);
+    this.globalConfig = new GlobalConfig(sdkInitData.initialKvValuesByKey, this);
     this.installationId = sdkInitData.blockInstallationId;
     this.runInfo = Object.freeze({
       isFirstRun: sdkInitData.isFirstRun,
@@ -109,5 +103,4 @@ class BlockSdkCore {
   get __appInterface() {
     return this.base._baseData.appInterface;
   }
-}
-exports.BlockSdkCore = BlockSdkCore;
+}

package/dist/esm/shared/types/airtable_interface_core.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/shared/types/attachment.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/shared/types/base_core.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/shared/types/collaborator.js

@@ -0,0 +1 @@
+export {};

package/dist/{cjs → esm}/shared/types/field_core.js

@@ -1,12 +1,7 @@
-"use strict";
+/** @module @airtable/blocks/models: Field */ /** */
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.FieldType = void 0;
-/** @module @airtable/blocks/models: Field */
-/** */
 /** @hidden */
+
 /**
  * An enum of Airtable's field types
  *
@@ -18,7 +13,7 @@ exports.FieldType = void 0;
  * ));
  * ```
  */
-let FieldType = exports.FieldType = /*#__PURE__*/function (FieldType) {
+export let FieldType = /*#__PURE__*/function (FieldType) {
   FieldType["SINGLE_LINE_TEXT"] = "singleLineText";
   FieldType["EMAIL"] = "email";
   FieldType["URL"] = "url";
@@ -54,55 +49,103 @@ let FieldType = exports.FieldType = /*#__PURE__*/function (FieldType) {
   FieldType["AI_TEXT"] = "aiText";
   return FieldType;
 }({});
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 // These field option definitions are based on the types returned by block_field_type_provider#getConfig
 // Be careful to keep them in sync and make changes in a backwards compatible manner
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /** @hidden */
+
 /**
  * A type for use with Field objects to make type narrowing FieldOptions easier.
  *

package/dist/esm/shared/types/global_config.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/shared/types/hyper_ids.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/shared/types/mutation_constants.js

@@ -0,0 +1,5 @@
+// Mirrored from clientServerSharedConfigSettings
+export const MAX_FIELD_NAME_LENGTH = 255;
+export const MAX_FIELD_DESCRIPTION_LENGTH = 20000;
+export const MAX_TABLE_NAME_LENGTH = 255;
+export const MAX_NUM_FIELDS_PER_TABLE = 500;

package/dist/{cjs → esm}/shared/types/mutations_core.js

@@ -1,13 +1,7 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.MutationTypesCore = void 0;
 /** @module @airtable/blocks: mutations */ /** */
 
 /** @hidden */
-const MutationTypesCore = exports.MutationTypesCore = Object.freeze({
+export const MutationTypesCore = Object.freeze({
   SET_MULTIPLE_GLOBAL_CONFIG_PATHS: 'setMultipleGlobalConfigPaths',
   SET_MULTIPLE_RECORDS_CELL_VALUES: 'setMultipleRecordsCellValues',
   DELETE_MULTIPLE_RECORDS: 'deleteMultipleRecords',

package/dist/esm/shared/types/permission_levels.js

@@ -0,0 +1,11 @@
+/** @hidden */
+export const PermissionLevels = Object.freeze({
+  NONE: 'none',
+  READ: 'read',
+  COMMENT: 'comment',
+  EDIT: 'edit',
+  CREATE: 'create',
+  OWNER: 'owner'
+});
+
+/** @hidden */

package/dist/esm/shared/types/record.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/shared/types/stat.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/shared/types/table_core.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/shared/ui/cell_renderer.js

@@ -0,0 +1,137 @@
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+/** @module @airtable/blocks/ui: CellRenderer */ /** */
+import * as React from 'react';
+import { spawnError } from '../../shared/error_utils';
+import { FieldType } from '../../shared/types/field_core';
+import useWatchable from '../../shared/ui/use_watchable';
+import { useSdk } from '../../shared/ui/sdk_context';
+
+/**
+ * @hidden
+ */
+
+/**
+ * @internal
+ */
+function validateRecordAndFieldProps(props) {
+  if (props.record && !props.record.isDeleted && !props.field.isDeleted && props.record.parentTable.id !== props.field.parentTable.id) {
+    throw spawnError('CellRenderer: record %s and field %s do not have the same parent table', props.record.parentTable.id, props.field.parentTable.id);
+  }
+}
+
+/**
+ * @hidden
+ */
+export function CellRenderer(props) {
+  const {
+    record,
+    cellValue,
+    field,
+    shouldWrap = true,
+    onMouseEnter,
+    onMouseLeave,
+    onClick,
+    className,
+    style,
+    cellClassName,
+    cellStyle,
+    renderInvalidCellValue
+  } = props;
+  validateRecordAndFieldProps({
+    record,
+    field
+  });
+  const sdk = useSdk();
+  useWatchable(record, [`cellValueInField:${field.id}`]);
+  useWatchable(field, ['type', 'options']);
+  if (field.isDeleted) {
+    return null;
+  }
+  const airtableInterface = sdk.__airtableInterface;
+  const appInterface = sdk.__appInterface;
+  let cellValueToRender;
+  if (record) {
+    if (cellValue !== undefined) {
+      // eslint-disable-next-line
+      console.warn('CellRenderer was given both record and cellValue, choosing to render record value');
+    }
+    if (record.isDeleted) {
+      return null;
+    }
+    cellValueToRender = record.getCellValue(field.id);
+  } else {
+    // NOTE: this will not work if you want to render a cell value for
+    // foreign record, single/multi select, or single/multi collaborator
+    // fields and the cell value is not *currently* valid for that field.
+    // i.e. if you want to render a foreign record for a record that
+    // does not yet exist, this will throw.
+    // TODO: handle "preview" cell values that are not yet valid in the given field
+    // but that *could* be.
+    // To validate public cell values, we only have validateCellValueForUpdate
+    // However, this is not implemented for computed fields (since you can't update them)
+    // so we just skip the check.
+    // TODO(emma): actually check this somehow.
+    if (!field.isComputed) {
+      const validationResult = airtableInterface.fieldTypeProvider.validateCellValueForUpdate(appInterface, cellValue, null, field._data);
+      if (!validationResult.isValid) {
+        if (renderInvalidCellValue) {
+          return /*#__PURE__*/React.createElement("div", {
+            onMouseEnter: onMouseEnter,
+            onMouseLeave: onMouseLeave,
+            onClick: onClick,
+            className: className,
+            style: style
+          }, renderInvalidCellValue(cellValue, field));
+        } else {
+          throw spawnError('Cannot render invalid cell value %s: %s', cellValue, validationResult.reason);
+        }
+      }
+    }
+    cellValueToRender = cellValue;
+  }
+
+  // in record.getCellValue, we reformat the cell value to the new public format. in order to
+  // make it work with the cell renderer, we need to format it back the other way.
+  // Note: we can't use _getRawCellValue here since we also need to handle formatting
+  // these in the case where the user passed cellValue instead of a record.
+  if (cellValueToRender && field.type === FieldType.MULTIPLE_LOOKUP_VALUES && !airtableInterface.sdkInitData.isUsingNewLookupCellValueFormat) {
+    const originalCellValue = cellValueToRender;
+    const linkedRecordIdsSet = new Set();
+    const valuesByLinkedRecordId = {};
+    for (const {
+      linkedRecordId,
+      value
+    } of originalCellValue) {
+      linkedRecordIdsSet.add(linkedRecordId);
+      if (!valuesByLinkedRecordId[linkedRecordId]) {
+        valuesByLinkedRecordId[linkedRecordId] = [];
+      }
+      valuesByLinkedRecordId[linkedRecordId].push(value);
+    }
+    cellValueToRender = {
+      linkedRecordIds: Array.from(linkedRecordIdsSet),
+      valuesByLinkedRecordId
+    };
+  }
+  const {
+    cellValueHtml,
+    attributes
+  } = airtableInterface.fieldTypeProvider.getCellRendererData(appInterface, cellValueToRender, field._data, !!shouldWrap);
+  return /*#__PURE__*/React.createElement("div", {
+    // TODO (stephen): remove tooltip anchor props
+    onMouseEnter: onMouseEnter,
+    onMouseLeave: onMouseLeave,
+    onClick: onClick,
+    className: `baymax ${className ?? ''}`,
+    style: {
+      display: 'block',
+      ...style
+    }
+  }, /*#__PURE__*/React.createElement("div", _extends({}, attributes, {
+    className: `cell read ${cellClassName ?? ''}`,
+    style: cellStyle,
+    dangerouslySetInnerHTML: {
+      __html: cellValueHtml
+    }
+  })));
+}

package/dist/esm/shared/ui/global_config_synced_component_helpers.js

@@ -0,0 +1,21 @@
+import { BlockRunContextType } from '../../base/types/airtable_interface';
+import useWatchable from './use_watchable';
+import { useSdk } from './sdk_context';
+
+/** @hidden */
+const globalConfigSyncedComponentHelpers = {
+  useDefaultWatchesForSyncedComponent(globalConfigKey) {
+    const sdk = useSdk();
+    const {
+      globalConfig,
+      session
+    } = sdk;
+    const runContext = sdk.getBlockRunContext();
+    useWatchable(globalConfig, [globalConfig.__getTopLevelKey(globalConfigKey)]);
+    useWatchable(session, ['permissionLevel']);
+    const viewIfInViewContext = runContext.type === BlockRunContextType.VIEW ? sdk.base.getTableById(runContext.tableId).getViewById(runContext.viewId) : null;
+    // We can't conditionally watch, but if it's not a viewContext the model will be null.
+    useWatchable(viewIfInViewContext, ['isLockedView']);
+  }
+};
+export default globalConfigSyncedComponentHelpers;

package/dist/{cjs → esm}/shared/ui/loader.js

@@ -1,12 +1,4 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var React = _interopRequireWildcard(require("react"));
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+import * as React from 'react';
 const ORIGINAL_SIZE = 54;
 
 /**
@@ -44,4 +36,4 @@ const Loader = _ref => {
     fill: fillColor
   })));
 };
-var _default = exports.default = Loader;
+export default Loader;

package/dist/{cjs → esm}/shared/ui/remote_utils.js

@@ -1,13 +1,5 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.loadCSSFromString = loadCSSFromString;
-exports.loadCSSFromURLAsync = loadCSSFromURLAsync;
-exports.loadScriptFromURLAsync = loadScriptFromURLAsync;
-var _error_utils = require("../error_utils");
 /** @module @airtable/blocks/ui: Loading external resources */ /** */
+import { invariant } from '../error_utils';
 
 /**
  * Injects CSS from a string into the page. Returns the HTML style element inserted into the page.
@@ -20,10 +12,10 @@ var _error_utils = require("../error_utils");
  * ```
  * @docsPath UI/utils/loadCSSFromString
  */
-function loadCSSFromString(css) {
+export function loadCSSFromString(css) {
   const styleTag = document.createElement('style');
   styleTag.innerHTML = css;
-  (0, _error_utils.invariant)(document.head, 'no document head');
+  invariant(document.head, 'no document head');
   document.head.appendChild(styleTag);
   return styleTag;
 }
@@ -41,7 +33,7 @@ function loadCSSFromString(css) {
  * ```
  * @docsPath UI/utils/loadCSSFromURLAsync
  */
-function loadCSSFromURLAsync(url) {
+export function loadCSSFromURLAsync(url) {
   // Pre-create the error for a nicer stack trace.
   const loadError = new Error('Failed to load remote CSS: ' + url);
   return new Promise((resolve, reject) => {
@@ -54,7 +46,7 @@ function loadCSSFromURLAsync(url) {
     linkTag.addEventListener('error', () => {
       reject(loadError);
     });
-    (0, _error_utils.invariant)(document.head, 'no document head');
+    invariant(document.head, 'no document head');
     document.head.appendChild(linkTag);
   });
 }
@@ -72,7 +64,7 @@ function loadCSSFromURLAsync(url) {
  * ```
  * @docsPath UI/utils/loadScriptFromURLAsync
  */
-function loadScriptFromURLAsync(url) {
+export function loadScriptFromURLAsync(url) {
   // Pre-create the error for a nicer stack trace.
   const loadError = new Error('Failed to load remote script: ' + url);
   return new Promise((resolve, reject) => {
@@ -84,7 +76,7 @@ function loadScriptFromURLAsync(url) {
       reject(loadError);
     });
     scriptTag.setAttribute('src', url);
-    (0, _error_utils.invariant)(document.head, 'no document head');
+    invariant(document.head, 'no document head');
     document.head.appendChild(scriptTag);
   });
 }

package/dist/esm/shared/ui/sdk_context.js

@@ -0,0 +1,8 @@
+import * as React from 'react';
+import { invariant } from '../error_utils';
+export const SdkContext = /*#__PURE__*/React.createContext(null);
+export const useSdk = () => {
+  const sdk = React.useContext(SdkContext);
+  invariant(sdk, 'This component can only be used in a block. Make sure to use `initializeBlock` at the root of this component tree.');
+  return sdk;
+};

package/dist/{cjs → esm}/shared/ui/use_array_identity.js

@@ -1,10 +1,5 @@
-"use strict";
+import { useRef } from 'react';
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = useArrayIdentity;
-var _react = require("react");
 /**
  * As long as the array passed to this hook shallow-equals its previous value, this hook will
  * return the same array instance. This is useful when writing hooks that accept arrays - it might
@@ -14,8 +9,8 @@ var _react = require("react");
  *
  * @internal
  */
-function useArrayIdentity(array) {
-  const arrayRef = (0, _react.useRef)(array);
+export default function useArrayIdentity(array) {
+  const arrayRef = useRef(array);
   if (arrayRef.current !== array) {
     if (arrayRef.current.length !== array.length) {
       arrayRef.current = array;

package/dist/esm/shared/ui/use_base.js

@@ -0,0 +1,16 @@
+import useWatchable from './use_watchable';
+import { useSdk } from './sdk_context';
+
+/**
+ * @hidden
+ */
+const useBase = () => {
+  const {
+    base,
+    session
+  } = useSdk();
+  useWatchable(base, ['schema']);
+  useWatchable(session, ['permissionLevel']);
+  return base;
+};
+export default useBase;

package/dist/{cjs → esm}/shared/ui/use_color_scheme.js

@@ -1,11 +1,5 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.useColorScheme = useColorScheme;
-var _react = require("react");
 /** @module @airtable/blocks/ui: useColorScheme */ /** */
+import { useState, useEffect } from 'react';
 
 /**
  * A hook for checking whether Airtable is in light mode or dark mode.
@@ -34,9 +28,9 @@ var _react = require("react");
 // Returns an object so we can add more properties if we need to, eg a setter to change the
 // color scheme from within extensions, whether the preference is directly set or inherited from
 // the browser, etc.
-function useColorScheme() {
-  const [colorScheme, setColorScheme] = (0, _react.useState)(window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light');
-  (0, _react.useEffect)(() => {
+export function useColorScheme() {
+  const [colorScheme, setColorScheme] = useState(window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light');
+  useEffect(() => {
     const darkModeQuery = window.matchMedia('(prefers-color-scheme: dark)');
     // Fires when e.matches changes. If there are more color schemes than light and dark,
     // we'll need multiple listeners (and corresponding media queries)

package/dist/{cjs → esm}/shared/ui/use_global_config.js

@@ -1,14 +1,8 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = useGlobalConfig;
-var _use_watchable = _interopRequireDefault(require("./use_watchable"));
-var _sdk_context = require("./sdk_context");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 /** @module @airtable/blocks/ui: useGlobalConfig */ /** */
 
+import useWatchable from './use_watchable';
+import { useSdk } from './sdk_context';
+
 /**
  * Returns the extension's {@link GlobalConfig} and updates whenever any key in {@link GlobalConfig}
  * changes.
@@ -42,12 +36,12 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e
  * @docsPath UI/hooks/useGlobalConfig
  * @hook
  */
-function useGlobalConfig() {
+export default function useGlobalConfig() {
   const {
     globalConfig,
     session
-  } = (0, _sdk_context.useSdk)();
-  (0, _use_watchable.default)(session, ['permissionLevel']);
-  (0, _use_watchable.default)(globalConfig, ['*']);
+  } = useSdk();
+  useWatchable(session, ['permissionLevel']);
+  useWatchable(globalConfig, ['*']);
   return globalConfig;
 }

package/dist/esm/shared/ui/use_session.js

@@ -0,0 +1,15 @@
+import useWatchable from './use_watchable';
+import { useSdk } from './sdk_context';
+
+/** @internal */
+const useSession = () => {
+  const {
+    session,
+    base
+  } = useSdk();
+  useWatchable(session, ['permissionLevel', 'currentUser']);
+  // permission checks depend on the base schema, so we need to track that too:
+  useWatchable(base, ['schema']);
+  return session;
+};
+export default useSession;

package/dist/{cjs → esm}/shared/ui/use_synced.js

@@ -1,12 +1,6 @@
-"use strict";
+import globalConfigSyncedComponentHelpers from './global_config_synced_component_helpers';
+import { useSdk } from './sdk_context';
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = useSynced;
-var _global_config_synced_component_helpers = _interopRequireDefault(require("./global_config_synced_component_helpers"));
-var _sdk_context = require("./sdk_context");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 /**
  * A hook for syncing a component to {@link GlobalConfig}.
  * Useful if you are dealing with a custom input component and can‘t use one of our `Synced` components.
@@ -32,9 +26,9 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e
  * @docsPath UI/hooks/useSynced
  * @hook
  */
-function useSynced(globalConfigKey) {
-  _global_config_synced_component_helpers.default.useDefaultWatchesForSyncedComponent(globalConfigKey);
-  const sdk = (0, _sdk_context.useSdk)();
+export default function useSynced(globalConfigKey) {
+  globalConfigSyncedComponentHelpers.useDefaultWatchesForSyncedComponent(globalConfigKey);
+  const sdk = useSdk();
   const {
     globalConfig
   } = sdk;