botframework-webchat-api 4.14.0 → 4.15.1

package/lib/utils/mapMap.js

@@ -5,6 +5,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = mapMap;
 
+var _botframeworkWebchatCore = require("botframework-webchat-core");
+
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -13,7 +15,7 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
 
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
 
-function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
 
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
@@ -23,8 +25,13 @@ function mapMap(map, mapper) {
         key = _ref2[0],
         value = _ref2[1];
 
-    result[key] = mapper(value, key);
+    if (!(0, _botframeworkWebchatCore.isForbiddenPropertyName)(key)) {
+      // Mitigation through denylisting.
+      // eslint-disable-next-line security/detect-object-injection
+      result[key] = mapper(value, key);
+    }
+
     return result;
   }, {});
 }
-//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy91dGlscy9tYXBNYXAudHMiXSwibmFtZXMiOlsibWFwTWFwIiwibWFwIiwibWFwcGVyIiwiT2JqZWN0IiwiZW50cmllcyIsInJlZHVjZSIsInJlc3VsdCIsImtleSIsInZhbHVlIl0sIm1hcHBpbmdzIjoiOzs7Ozs7Ozs7Ozs7Ozs7Ozs7O0FBQWUsU0FBU0EsTUFBVCxDQUNiQyxHQURhLEVBRWJDLE1BRmEsRUFHUztBQUN0QixTQUFPQyxNQUFNLENBQUNDLE9BQVAsQ0FBZUgsR0FBZixFQUFvQkksTUFBcEIsQ0FBMkIsVUFBQ0MsTUFBRCxRQUEwQjtBQUFBO0FBQUEsUUFBaEJDLEdBQWdCO0FBQUEsUUFBWEMsS0FBVzs7QUFDMURGLElBQUFBLE1BQU0sQ0FBQ0MsR0FBRCxDQUFOLEdBQWNMLE1BQU0sQ0FBQ00sS0FBRCxFQUFRRCxHQUFSLENBQXBCO0FBRUEsV0FBT0QsTUFBUDtBQUNELEdBSk0sRUFJSixFQUpJLENBQVA7QUFLRCIsInNvdXJjZVJvb3QiOiJjb21wb25lbnQ6Ly8vIiwic291cmNlc0NvbnRlbnQiOlsiZXhwb3J0IGRlZmF1bHQgZnVuY3Rpb24gbWFwTWFwPFQ+KFxuICBtYXA6IHsgW2tleTogc3RyaW5nXTogVCB9LFxuICBtYXBwZXI6ICh2YWx1ZTogVCwga2V5OiBzdHJpbmcpID0+IFRcbik6IHsgW2tleTogc3RyaW5nXTogVCB9IHtcbiAgcmV0dXJuIE9iamVjdC5lbnRyaWVzKG1hcCkucmVkdWNlKChyZXN1bHQsIFtrZXksIHZhbHVlXSkgPT4ge1xuICAgIHJlc3VsdFtrZXldID0gbWFwcGVyKHZhbHVlLCBrZXkpO1xuXG4gICAgcmV0dXJuIHJlc3VsdDtcbiAgfSwge30pO1xufVxuIl19
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy91dGlscy9tYXBNYXAudHMiXSwibmFtZXMiOlsibWFwTWFwIiwibWFwIiwibWFwcGVyIiwiT2JqZWN0IiwiZW50cmllcyIsInJlZHVjZSIsInJlc3VsdCIsImtleSIsInZhbHVlIl0sIm1hcHBpbmdzIjoiOzs7Ozs7O0FBQUE7Ozs7Ozs7Ozs7Ozs7O0FBRWUsU0FBU0EsTUFBVCxDQUNiQyxHQURhLEVBRWJDLE1BRmEsRUFHUztBQUN0QixTQUFPQyxNQUFNLENBQUNDLE9BQVAsQ0FBZUgsR0FBZixFQUFvQkksTUFBcEIsQ0FBMkIsVUFBQ0MsTUFBRCxRQUEwQjtBQUFBO0FBQUEsUUFBaEJDLEdBQWdCO0FBQUEsUUFBWEMsS0FBVzs7QUFDMUQsUUFBSSxDQUFDLHNEQUF3QkQsR0FBeEIsQ0FBTCxFQUFtQztBQUNqQztBQUNBO0FBQ0FELE1BQUFBLE1BQU0sQ0FBQ0MsR0FBRCxDQUFOLEdBQWNMLE1BQU0sQ0FBQ00sS0FBRCxFQUFRRCxHQUFSLENBQXBCO0FBQ0Q7O0FBRUQsV0FBT0QsTUFBUDtBQUNELEdBUk0sRUFRSixFQVJJLENBQVA7QUFTRCIsInNvdXJjZVJvb3QiOiJjb21wb25lbnQ6Ly8vIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgaXNGb3JiaWRkZW5Qcm9wZXJ0eU5hbWUgfSBmcm9tICdib3RmcmFtZXdvcmstd2ViY2hhdC1jb3JlJztcblxuZXhwb3J0IGRlZmF1bHQgZnVuY3Rpb24gbWFwTWFwPFQ+KFxuICBtYXA6IHsgW2tleTogc3RyaW5nXTogVCB9LFxuICBtYXBwZXI6ICh2YWx1ZTogVCwga2V5OiBzdHJpbmcpID0+IFRcbik6IHsgW2tleTogc3RyaW5nXTogVCB9IHtcbiAgcmV0dXJuIE9iamVjdC5lbnRyaWVzKG1hcCkucmVkdWNlKChyZXN1bHQsIFtrZXksIHZhbHVlXSkgPT4ge1xuICAgIGlmICghaXNGb3JiaWRkZW5Qcm9wZXJ0eU5hbWUoa2V5KSkge1xuICAgICAgLy8gTWl0aWdhdGlvbiB0aHJvdWdoIGRlbnlsaXN0aW5nLlxuICAgICAgLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIHNlY3VyaXR5L2RldGVjdC1vYmplY3QtaW5qZWN0aW9uXG4gICAgICByZXN1bHRba2V5XSA9IG1hcHBlcih2YWx1ZSwga2V5KTtcbiAgICB9XG5cbiAgICByZXR1cm4gcmVzdWx0O1xuICB9LCB7fSk7XG59XG4iXX0=

package/lib/utils/randomId.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"randomId.d.ts","sourceRoot":"","sources":["../../src/utils/randomId.ts"],"names":[],"mappings":"AAIA,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,SAAS,GAAE,MAAU,GAAG,MAAM,CAE9D"}
+{"version":3,"file":"randomId.d.ts","sourceRoot":"","sources":["../../src/utils/randomId.ts"],"names":[],"mappings":"AAIA,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,SAAS,SAAI,GAAG,MAAM,CAEtD"}

package/lib/utils/randomId.js

@@ -14,4 +14,4 @@ function randomId() {
   var maxLength = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 5;
   return (0, _mathRandom.default)().toString(36).substr(2, maxLength);
 }
-//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy91dGlscy9yYW5kb21JZC50cyJdLCJuYW1lcyI6WyJyYW5kb21JZCIsIm1heExlbmd0aCIsInRvU3RyaW5nIiwic3Vic3RyIl0sIm1hcHBpbmdzIjoiOzs7Ozs7O0FBRUE7Ozs7QUFGQTtBQUllLFNBQVNBLFFBQVQsR0FBaUQ7QUFBQSxNQUEvQkMsU0FBK0IsdUVBQVgsQ0FBVztBQUM5RCxTQUFPLDJCQUFTQyxRQUFULENBQWtCLEVBQWxCLEVBQXNCQyxNQUF0QixDQUE2QixDQUE3QixFQUFnQ0YsU0FBaEMsQ0FBUDtBQUNEIiwic291cmNlUm9vdCI6ImNvbXBvbmVudDovLy8iLCJzb3VyY2VzQ29udGVudCI6WyIvKiBlc2xpbnQgbm8tbWFnaWMtbnVtYmVyczogW1wiZXJyb3JcIiwgeyBcImlnbm9yZVwiOiBbMiwgNSwgMzZdIH1dICovXG5cbmltcG9ydCByYW5kb20gZnJvbSAnbWF0aC1yYW5kb20nO1xuXG5leHBvcnQgZGVmYXVsdCBmdW5jdGlvbiByYW5kb21JZChtYXhMZW5ndGg6IG51bWJlciA9IDUpOiBzdHJpbmcge1xuICByZXR1cm4gcmFuZG9tKCkudG9TdHJpbmcoMzYpLnN1YnN0cigyLCBtYXhMZW5ndGgpO1xufVxuIl19
+//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy91dGlscy9yYW5kb21JZC50cyJdLCJuYW1lcyI6WyJyYW5kb21JZCIsIm1heExlbmd0aCIsInRvU3RyaW5nIiwic3Vic3RyIl0sIm1hcHBpbmdzIjoiOzs7Ozs7O0FBRUE7Ozs7QUFGQTtBQUllLFNBQVNBLFFBQVQsR0FBeUM7QUFBQSxNQUF2QkMsU0FBdUIsdUVBQVgsQ0FBVztBQUN0RCxTQUFPLDJCQUFTQyxRQUFULENBQWtCLEVBQWxCLEVBQXNCQyxNQUF0QixDQUE2QixDQUE3QixFQUFnQ0YsU0FBaEMsQ0FBUDtBQUNEIiwic291cmNlUm9vdCI6ImNvbXBvbmVudDovLy8iLCJzb3VyY2VzQ29udGVudCI6WyIvKiBlc2xpbnQgbm8tbWFnaWMtbnVtYmVyczogW1wiZXJyb3JcIiwgeyBcImlnbm9yZVwiOiBbMiwgNSwgMzZdIH1dICovXG5cbmltcG9ydCByYW5kb20gZnJvbSAnbWF0aC1yYW5kb20nO1xuXG5leHBvcnQgZGVmYXVsdCBmdW5jdGlvbiByYW5kb21JZChtYXhMZW5ndGggPSA1KTogc3RyaW5nIHtcbiAgcmV0dXJuIHJhbmRvbSgpLnRvU3RyaW5nKDM2KS5zdWJzdHIoMiwgbWF4TGVuZ3RoKTtcbn1cbiJdfQ==

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "botframework-webchat-api",
-  "version": "4.14.0",
+  "version": "4.15.1",
   "description": "React DOM component of botframework-webchat",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -20,58 +20,47 @@
   "scripts": {
     "build": "npm run build:globalize && npm run build:typescript && npm run build:babel",
     "build:babel": "babel src --copy-files --extensions .js,.ts,.tsx --ignore **/*.spec.js,**/*.spec.ts,**/*.spec.tsx,**/*.test.js,**/*.test.ts,**/*.test.tsx,__tests__/**/*.js,__tests__/**/*.ts,__tests__/**/*.tsx --no-copy-ignored --out-dir lib --verbose",
-    "build:globalize": "node scripts/createPrecompiledGlobalize.js",
+    "build:globalize": "node scripts/createPrecompiledGlobalize.mjs",
     "build:typescript": "tsc --project src/tsconfig.json",
     "eslint": "npm run precommit",
     "precommit": "npm run precommit:eslint -- src && npm run precommit:typecheck",
-    "precommit:eslint": "eslint",
+    "precommit:eslint": "../../node_modules/.bin/eslint --report-unused-disable-directives --max-warnings 0",
     "precommit:typecheck": "tsc --project ./src --emitDeclarationOnly false --esModuleInterop true --noEmit --pretty false",
-    "prettier": "prettier --check src/**/*.{js,ts,tsx}",
     "prestart": "npm run build:babel",
     "start": "concurrently --kill-others --names \"babel,globalize,tsc\" \"npm run start:babel\" \"npm run start:globalize\" \"npm run start:typescript\"",
     "start:babel": "npm run build:babel -- --skip-initial-build --watch",
-    "start:globalize": "node-dev --respawn scripts/createPrecompiledGlobalize.js",
+    "start:globalize": "node-dev --respawn scripts/createPrecompiledGlobalize.mjs",
     "start:typescript": "npm run build:typescript -- --watch"
   },
-  "cldr-data-coverage": "full",
   "devDependencies": {
-    "@babel/cli": "^7.13.14",
-    "@babel/core": "^7.13.14",
-    "@babel/preset-env": "^7.13.12",
-    "@babel/preset-react": "^7.13.13",
-    "@babel/preset-typescript": "^7.13.0",
-    "@types/node": "^14.14.37",
-    "@types/react": "^17.0.3",
-    "@typescript-eslint/eslint-plugin": "^4.21.0",
-    "@typescript-eslint/parser": "^4.21.0",
+    "@babel/cli": "^7.15.7",
+    "@babel/core": "^7.15.8",
+    "@babel/preset-env": "^7.15.8",
+    "@babel/preset-react": "^7.14.5",
+    "@babel/preset-typescript": "^7.15.0",
+    "@types/node": "^16.10.9",
+    "@types/react": "^17.0.29",
     "babel-plugin-istanbul": "^6.0.0",
     "babel-plugin-transform-inline-environment-variables": "^0.4.3",
-    "cldr-data": "^36.0.0",
-    "concurrently": "^6.0.1",
-    "core-js": "^3.10.0",
-    "eslint": "^7.23.0",
-    "eslint-plugin-prettier": "^3.3.1",
-    "eslint-plugin-react": "^7.23.1",
-    "eslint-plugin-react-hooks": "^4.2.0",
+    "cldr-data": "4.15.1",
+    "concurrently": "^6.3.0",
+    "core-js": "^3.18.3",
     "globalize-compiler": "^1.1.1",
     "iana-tz-data": "^2019.1.0",
-    "node-dev": "^6.6.0",
-    "prettier": "^2.2.1",
-    "typescript": "^4.2.3"
+    "node-dev": "^7.0.0",
+    "typescript": "^4.3.5"
   },
   "dependencies": {
-    "botframework-webchat-core": "4.14.0",
-    "event-target-shim": "5.0.1",
-    "event-target-shim-es5": "1.2.0",
+    "botframework-webchat-core": "4.15.1",
     "globalize": "1.6.0",
     "math-random": "2.0.1",
     "prop-types": "15.7.2",
-    "react-redux": "7.2.3",
+    "react-redux": "7.2.4",
     "redux": "4.0.5",
     "simple-update-in": "2.2.0"
   },
   "peerDependencies": {
-    "react": "16.8.6",
-    "react-dom": "16.8.6"
+    "react": ">= 16.8.6",
+    "react-dom": ">= 16.8.6"
   }
 }

package/scripts/createPrecompiledGlobalize.mjs

@@ -0,0 +1,44 @@
+import { existsSync, mkdirSync, readFileSync, writeFileSync } from 'fs';
+import { fileURLToPath } from 'url';
+import { relative } from 'path';
+import cldrData from 'cldr-data';
+import Globalize from 'globalize';
+import globalizeCompiler from 'globalize-compiler';
+import Prettier from 'prettier';
+
+const overridesJSON = JSON.parse(readFileSync(new URL('../src/localization/overrides.json', import.meta.url), 'utf-8'));
+
+const languages = Object.values(overridesJSON).map(({ GLOBALIZE_LANGUAGE }) => GLOBALIZE_LANGUAGE);
+
+Globalize.load(cldrData.entireSupplemental());
+
+const formattersAndParsers = languages.reduce((formattersAndParsers, language) => {
+  Globalize.load(cldrData.entireMainFor(language));
+
+  const globalize = new Globalize(language);
+
+  return [
+    ...formattersAndParsers,
+    ...[
+      globalize.dateFormatter({ skeleton: 'MMMMdhm' }),
+      globalize.pluralGenerator(),
+      globalize.relativeTimeFormatter('hour'),
+      globalize.relativeTimeFormatter('minute'),
+      globalize.unitFormatter('byte', { form: 'long' }),
+      globalize.unitFormatter('kilobyte', { form: 'short' }),
+      globalize.unitFormatter('megabyte', { form: 'short' }),
+      globalize.unitFormatter('gigabyte', { form: 'short' })
+    ]
+  ];
+}, []);
+
+const code = Prettier.format(globalizeCompiler.compile(formattersAndParsers), { parser: 'babel' });
+const outputFileURL = new URL('../lib/external/PrecompiledGlobalize.js', import.meta.url);
+
+// globalize-compiler is emitting AMD code, pointing to "globalize-runtime" instead of "globalize/dist/globalize-runtime"
+const patchedCode = code.replace(/\"globalize-runtime\//g, '"globalize/dist/globalize-runtime/');
+
+existsSync(new URL('.', outputFileURL)) || mkdirSync(new URL('.', outputFileURL), { recursive: true });
+writeFileSync(outputFileURL, patchedCode);
+
+console.log(`Successfully compiled globalize to ${relative(process.cwd(), fileURLToPath(outputFileURL))}.`);

package/src/StyleOptions.ts

@@ -248,7 +248,7 @@ type StyleOptions = {
   /**
    * Specify number of pixels to overscroll or underscroll after pause
    */
-  autoScrollSnapOnPageoffset?: number;
+  autoScrollSnapOnPageOffset?: number;
 
   /**
    * Send box styling
@@ -259,15 +259,101 @@ type StyleOptions = {
   microphoneButtonColorOnDictate?: string;
   sendBoxBackground?: string;
 
+  /** Send box button: Icon color, defaults to subtle */
+  sendBoxButtonColor?: string;
+
   /**
-   * Button color defaults to subtle
+   * Send box button: Shade border radius
+   *
+   * @default 2
    */
-  sendBoxButtonColor?: string;
+  sendBoxButtonShadeBorderRadius?: number;
+
+  /** Send box button: Shade color */
+  sendBoxButtonShadeColor?: string;
+
+  /**
+   * Send box button: Shade inset
+   *
+   * @default 2
+   */
+  sendBoxButtonShadeInset?: number;
+
+  /** Send box button (while `:active`): Icon color */
+  sendBoxButtonColorOnActive?: string;
 
+  /**
+   * Send box button (while `:active`): Shade color
+   *
+   * @default '#EDEBE9'
+   */
+  sendBoxButtonShadeColorOnActive?: string;
+
+  /**
+   * Send box button (while `:disabled`): Icon color
+   *
+   * @default '#A19F9D'
+   */
   sendBoxButtonColorOnDisabled?: string;
+
+  /**
+   * Send box button (while `:disabled`): Shade color
+   *
+   * @default '#F3F2F1'
+   */
+  sendBoxButtonShadeColorOnDisabled?: string;
+
+  /** Send box button (while `:focus`): Icon color */
   sendBoxButtonColorOnFocus?: string;
+
+  /** Send box button (while `:focus`): Shade color */
+  sendBoxButtonShadeColorOnFocus?: string;
+
+  /** Send box button (while `:hover`): Icon color */
   sendBoxButtonColorOnHover?: string;
 
+  /**
+   * Send box button (while `:hover`): Shade color
+   *
+   * @default '#F3F2F1'
+   */
+  sendBoxButtonShadeColorOnHover?: string;
+
+  /**
+   * Send box button (while `:focus-visible`): Keyboard focus indicator border color
+   *
+   * @default '#605E5C'
+   */
+  sendBoxButtonKeyboardFocusIndicatorBorderColor?: string;
+
+  /**
+   * Send box button (while `:focus-visible`): Keyboard focus indicator border radius
+   *
+   * @default 0
+   */
+  sendBoxButtonKeyboardFocusIndicatorBorderRadius?: number | string;
+
+  /**
+   * Send box button (while `:focus-visible`): Keyboard focus indicator border style
+   *
+   * @default 'solid'
+   */
+  sendBoxButtonKeyboardFocusIndicatorBorderStyle?: string;
+
+  /**
+   * Send box button (while` :focus-visible`): Keyboard focus indicator border width
+   *
+   * @default 4
+   */
+  sendBoxButtonKeyboardFocusIndicatorBorderWidth?: number;
+
+  /**
+   * Send box button (while `:focus-visible`): Keyboard focus indicator inset
+   *
+   * @default 4
+   */
+  sendBoxButtonKeyboardFocusIndicatorInset?: number;
+
   /**
    * Disabled text color defaults to subtle
    */
@@ -302,35 +388,230 @@ type StyleOptions = {
    * Suggested Actions
    */
 
+  /**
+   * Suggested action: border radius
+   *
+   * @default 0
+   */
+  suggestedActionBorderRadius?: number | string;
+
+  /**
+   * Suggested action: Background
+   *
+   * @deprecated Since 4.15.0: Please use `suggestedActionBackgroundColor` instead. This option will be removed on or after 2023-09-16.
+   */
   suggestedActionBackground?: string;
 
   /**
-   * Border color defaults to accent.
+   * Suggested action: Background color
+   *
+   * @default 'White'
    */
+  suggestedActionBackgroundColor?: string;
+
+  /** Suggested action: Border color, defaults to accent color */
   suggestedActionBorderColor?: string;
 
-  suggestedActionBorderRadius?: number | string;
+  /**
+   * Suggested action: Border style
+   *
+   * @default 'solid'
+   */
   suggestedActionBorderStyle?: string;
-  suggestedActionBorderWidth?: number | string;
 
   /**
-   * Disabled background defaults to suggestedActionBackground
+   * Suggested action: Border width
+   *
+   * @default 2
+   */
+  suggestedActionBorderWidth?: number;
+
+  /** Suggested action: Text color, defaults to accent color */
+  suggestedActionTextColor?: string;
+
+  /** Suggested action (while `:disabled`): Background color, defaults to suggestedActionBackground */
+  suggestedActionBackgroundColorOnDisabled?: string;
+
+  /**
+   * Suggested action (while `:disabled`): Border color
+   *
+   * @default '#E6E6E6'
+   */
+  suggestedActionBorderColorOnDisabled?: string;
+
+  /** Suggested action (while `:disabled`): Border style */
+  suggestedActionBorderStyleOnDisabled?: string;
+
+  /** Suggested action (while `:disabled`): Border width */
+  suggestedActionBorderWidthOnDisabled?: number;
+
+  /** Suggested action (while `:disabled`): Foreground color, defaults to subtle color */
+  suggestedActionTextColorOnDisabled?: string;
+
+  /**
+   * Suggested action (while `:active`): Background color
+   *
+   * @default '#EDEBE9'
+   */
+  suggestedActionBackgroundColorOnActive?: string;
+
+  /** Suggested action (while `:active`): Border color */
+  suggestedActionBorderColorOnActive?: string;
+
+  /** Suggested action (while `:active`): Border style */
+  suggestedActionBorderStyleOnActive?: string;
+
+  /** Suggested action (while `:active`): Border width */
+  suggestedActionBorderWidthOnActive?: number;
+
+  /** Suggested action (while `:active`): Text color */
+  suggestedActionTextColorOnActive?: string;
+
+  /** Suggested action (while `:focus`): Background color */
+  suggestedActionBackgroundColorOnFocus?: string;
+
+  /** Suggested action (while `:focus`): Border color */
+  suggestedActionBorderColorOnFocus?: string;
+
+  /** Suggested action (while `:focus`): Border style */
+  suggestedActionBorderStyleOnFocus?: string;
+
+  /** Suggested action (while `:focus`): Border width */
+  suggestedActionBorderWidthOnFocus?: number;
+
+  /** Suggested action (while `:focus`): Text color */
+  suggestedActionTextColorOnFocus?: string;
+
+  /**
+   * Suggested action (while `:hover`): Background color
+   *
+   * @default '#F3F2F1'
+   */
+  suggestedActionBackgroundColorOnHover?: string;
+
+  /** Suggested action (while `:hover`): Border color */
+  suggestedActionBorderColorOnHover?: string;
+
+  /** Suggested action (while `:hover`): Border style */
+  suggestedActionBorderStyleOnHover?: string;
+
+  /** Suggested action (while `:hover`): Border width */
+  suggestedActionBorderWidthOnHover?: number;
+
+  /** Suggested action (while `:hover`): Text color */
+  suggestedActionTextColorOnHover?: string;
+
+  /**
+   * Suggested action (while `:disabled`): Background, defaults to suggestedActionBackground.
+   *
+   * @deprecated Since 4.15.0: Please use `suggestedActionBackgroundColorOnDisabled` instead. This option will be removed on or after 2023-09-16.
    */
   suggestedActionDisabledBackground?: string;
 
+  /**
+   * Suggested action (while `:disabled`): Border color
+   *
+   * @deprecated Since 4.15.0: Please use `suggestedActionBorderColorOnDisabled` instead. This option will be removed on or after 2023-09-16.
+   */
   suggestedActionDisabledBorderColor?: string;
+
+  /**
+   * Suggested action (while `:disabled`): Border style
+   *
+   * @deprecated Since 4.15.0: Please use `suggestedActionBorderStyleOnDisabled` instead. This option will be removed on or after 2023-09-16.
+   */
   suggestedActionDisabledBorderStyle?: string;
-  suggestedActionDisabledBorderWidth?: number | string;
 
   /**
-   * Disabled text color defaults to subtle
+   * Suggested action (while `:disabled`): Border width
+   *
+   * @deprecated Since 4.15.0: Please use `suggestedActionBorderWidthOnDisabled` instead. This option will be removed on or after 2023-09-16.
+   */
+  suggestedActionDisabledBorderWidth?: number;
+
+  /**
+   * Suggested action (while `:disabled`): Foreground color, defaults to subtle color
+   *
+   * @deprecated Since 4.15.0: Please use `suggestedActionTextColorOnDisabled` instead. This option will be removed on or after 2023-09-16.
    */
   suggestedActionDisabledTextColor?: string;
 
+  /**
+   * Suggested action: Height
+   *
+   * @default 40
+   */
   suggestedActionHeight?: number | string;
+
+  /**
+   * Suggested action: Image height
+   *
+   * @default 20
+   */
   suggestedActionImageHeight?: number | string;
+
+  /**
+   * Suggested action: Layout type
+   *
+   * @default 'carousel'
+   */
   suggestedActionLayout?: 'carousel' | 'flow' | 'stacked';
-  suggestedActionTextColor?: string;
+
+  /**
+   * Suggested action (while `:focus-visible`): Keyboard focus indicator border color
+   *
+   * @default '#605E5C'
+   */
+  suggestedActionKeyboardFocusIndicatorBorderColor?: string;
+
+  /**
+   * Suggested action (while `:focus-visible`): Keyboard focus indicator border radius
+   *
+   * @default 0
+   */
+  suggestedActionKeyboardFocusIndicatorBorderRadius?: number | string;
+
+  /**
+   * Suggested action (while `:focus-visible`): Keyboard focus indicator border style
+   *
+   * @default 'solid'
+   */
+  suggestedActionKeyboardFocusIndicatorBorderStyle?: string;
+
+  /**
+   * Suggested action (while `:focus-visible`): Keyboard focus indicator border width
+   *
+   * @default 1
+   */
+  suggestedActionKeyboardFocusIndicatorBorderWidth?: number;
+
+  /**
+   * Suggested action (while `:focus-visible`): Keyboard focus indicator inset
+   *
+   * @default 2
+   */
+  suggestedActionKeyboardFocusIndicatorInset?: number;
+
+  /**
+   * Suggested action (while `:active`): background
+   *
+   * @deprecated Since 4.15.0: Please use `suggestedActionBackgroundColorOnActive` instead. This option will be removed on or after 2023-09-16.
+   */
+  suggestedActionActiveBackground?: string;
+
+  /**
+   * Suggested action (while `:focus`): background
+   *
+   * @deprecated Since 4.15.0: Please use `suggestedActionBackgroundColorOnFocus` instead. This option will be removed on or after 2023-09-16.
+   */
+  suggestedActionFocusBackground?: string;
+
+  /**
+   * Suggested action (while `:hover`): background
+   *
+   * @deprecated Since 4.15.0: Please use `suggestedActionBackgroundColorOnHover` instead. This option will be removed on or after 2023-09-16.
+   */
+  suggestedActionHoverBackground?: string;
 
   /**
    * Suggested actions carousel layout
@@ -367,9 +648,9 @@ type StyleOptions = {
   suggestedActionsStackedHeight?: number | 'auto';
 
   /**
-   * Stacked overflow default value is 'auto
+   * Stacked overflow default value is 'auto'
    */
-  suggestedActionsStackedOverflow?: 'string';
+  suggestedActionsStackedOverflow?: 'auto' | 'hidden' | 'scroll' | 'visible';
 
   /**
    * Button max height default value is 100% if suggestedActionsStackedLayoutButtonTextWrap is true

package/src/defaultStyleOptions.ts

@@ -88,17 +88,39 @@ const DEFAULT_OPTIONS: Required<StyleOptions> = {
   autoScrollSnapOnActivity: false,
   autoScrollSnapOnActivityOffset: 0,
   autoScrollSnapOnPage: false,
-  autoScrollSnapOnPageoffset: 0,
+  autoScrollSnapOnPageOffset: 0, // TODO: Rename from "autoScrollSnapOnPageoffset".
 
   // Send box
   hideSendBox: false,
   hideUploadButton: false,
   microphoneButtonColorOnDictate: '#F33',
   sendBoxBackground: 'White',
+
+  // Send box buttons
   sendBoxButtonColor: undefined,
-  sendBoxButtonColorOnDisabled: '#CCC',
-  sendBoxButtonColorOnFocus: '#333',
-  sendBoxButtonColorOnHover: '#333',
+  sendBoxButtonShadeColor: undefined,
+
+  sendBoxButtonColorOnActive: undefined,
+  sendBoxButtonShadeColorOnActive: '#EDEBE9',
+
+  sendBoxButtonColorOnDisabled: '#A19F9D',
+  sendBoxButtonShadeColorOnDisabled: '#F3F2F1',
+
+  sendBoxButtonColorOnFocus: undefined,
+  sendBoxButtonShadeColorOnFocus: undefined,
+
+  sendBoxButtonColorOnHover: undefined,
+  sendBoxButtonShadeColorOnHover: '#F3F2F1',
+
+  sendBoxButtonShadeBorderRadius: 2,
+  sendBoxButtonShadeInset: 2,
+
+  sendBoxButtonKeyboardFocusIndicatorBorderColor: '#605E5C',
+  sendBoxButtonKeyboardFocusIndicatorBorderRadius: 0,
+  sendBoxButtonKeyboardFocusIndicatorBorderStyle: 'solid',
+  sendBoxButtonKeyboardFocusIndicatorBorderWidth: 1,
+  sendBoxButtonKeyboardFocusIndicatorInset: 4,
+
   sendBoxDisabledTextColor: undefined,
   sendBoxHeight: 40,
   sendBoxMaxHeight: 200,
@@ -121,21 +143,57 @@ const DEFAULT_OPTIONS: Required<StyleOptions> = {
   spinnerAnimationPadding: 12,
 
   // Suggested actions
-  suggestedActionBackground: 'White',
-  suggestedActionBorderColor: undefined,
   suggestedActionBorderRadius: 0,
-  suggestedActionBorderStyle: 'solid',
-  suggestedActionBorderWidth: 2,
-  suggestedActionDisabledBackground: undefined,
-  suggestedActionDisabledBorderColor: '#E6E6E6',
-  suggestedActionDisabledBorderStyle: 'solid',
-  suggestedActionDisabledBorderWidth: 2,
-  suggestedActionDisabledTextColor: undefined,
   suggestedActionHeight: 40,
   suggestedActionImageHeight: 20,
   suggestedActionLayout: 'carousel',
+
+  suggestedActionBackgroundColor: 'White',
+  suggestedActionBorderColor: undefined,
+  suggestedActionBorderStyle: 'solid',
+  suggestedActionBorderWidth: 2,
   suggestedActionTextColor: undefined,
 
+  suggestedActionBackgroundColorOnActive: '#EDEBE9',
+  suggestedActionBorderColorOnActive: undefined,
+  suggestedActionBorderStyleOnActive: undefined,
+  suggestedActionBorderWidthOnActive: undefined,
+  suggestedActionTextColorOnActive: undefined,
+
+  suggestedActionBackgroundColorOnDisabled: undefined,
+  suggestedActionBorderColorOnDisabled: '#E6E6E6',
+  suggestedActionBorderStyleOnDisabled: undefined,
+  suggestedActionBorderWidthOnDisabled: undefined,
+  suggestedActionTextColorOnDisabled: undefined,
+
+  suggestedActionBackgroundColorOnFocus: undefined,
+  suggestedActionBorderColorOnFocus: undefined,
+  suggestedActionBorderStyleOnFocus: undefined,
+  suggestedActionBorderWidthOnFocus: undefined,
+  suggestedActionTextColorOnFocus: undefined,
+
+  suggestedActionBackgroundColorOnHover: '#F3F2F1',
+  suggestedActionBorderColorOnHover: undefined,
+  suggestedActionBorderStyleOnHover: undefined,
+  suggestedActionBorderWidthOnHover: undefined,
+  suggestedActionTextColorOnHover: undefined,
+
+  suggestedActionKeyboardFocusIndicatorBorderColor: '#605E5C',
+  suggestedActionKeyboardFocusIndicatorBorderRadius: 0,
+  suggestedActionKeyboardFocusIndicatorBorderStyle: 'solid',
+  suggestedActionKeyboardFocusIndicatorBorderWidth: 1,
+  suggestedActionKeyboardFocusIndicatorInset: 2,
+
+  suggestedActionActiveBackground: undefined, // Deprecated as of 4.15.0. Remove on or after 2023-09-16.
+  suggestedActionBackground: undefined, // Deprecated as of 4.15.0. Remove on or after 2023-09-16.
+  suggestedActionDisabledBackground: undefined, // Deprecated as of 4.15.0. Remove on or after 2023-09-16.
+  suggestedActionDisabledBorderColor: undefined, // Deprecated as of 4.15.0. Remove on or after 2023-09-16.
+  suggestedActionDisabledBorderStyle: undefined, // Deprecated as of 4.15.0. Remove on or after 2023-09-16.
+  suggestedActionDisabledBorderWidth: undefined, // Deprecated as of 4.15.0. Remove on or after 2023-09-16.
+  suggestedActionDisabledTextColor: undefined, // Deprecated as of 4.15.0. Remove on or after 2023-09-16.
+  suggestedActionFocusBackground: undefined, // Deprecated as of 4.15.0. Remove on or after 2023-09-16.
+  suggestedActionHoverBackground: undefined, // Deprecated as of 4.15.0. Remove on or after 2023-09-16.
+
   // Suggested actions carousel layout
   suggestedActionsCarouselFlipperCursor: undefined,
   suggestedActionsCarouselFlipperBoxWidth: 40,