@sproutsocial/racine 14.2.0 → 14.3.0

package/commonjs/Token/Token.js

@@ -9,6 +9,7 @@ var React = _interopRequireWildcard(require("react"));
 var _hooks = require("../utils/hooks");
 var _Box = _interopRequireDefault(require("../Box"));
 var _Icon = _interopRequireDefault(require("../Icon"));
+var _VisuallyHidden = require("../VisuallyHidden");
 var _styles = _interopRequireDefault(require("./styles"));
 var _excluded = ["children", "closeable", "onClick", "qa", "valid", "disabled", "palette"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -47,11 +48,24 @@ var Token = function Token(_ref) {
     "data-qa-token-iscloseable": closeable === true,
     "data-qa-token-isvalid": valid === true,
     "data-qa-token-isdisabled": disabled === true
-  }, qa, rest), closeable ? /*#__PURE__*/React.createElement(_Box.default, {
+  }, qa, rest), !valid && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_VisuallyHidden.VisuallyHidden, {
+    as: "div",
+    role: "status"
+  }, "This is an invalid token"), /*#__PURE__*/React.createElement(_Icon.default, {
+    "aria-hidden": true,
+    pr: 300,
+    name: "error",
+    size: "mini"
+  }), /*#__PURE__*/React.createElement(_VisuallyHidden.VisuallyHidden, null, "Invalid")), closeable ? /*#__PURE__*/React.createElement(_Box.default, {
     display: "flex",
     alignItems: "center",
     justifyContent: "space-between"
-  }, /*#__PURE__*/React.createElement("span", null, children), " ", /*#__PURE__*/React.createElement(_Icon.default, {
+  }, /*#__PURE__*/React.createElement(_Box.default, {
+    as: "span",
+    display: "flex",
+    alignItems: "center"
+  }, children), /*#__PURE__*/React.createElement(_Icon.default, {
+    "aria-hidden": true,
     pl: 300,
     name: "x",
     size: "mini"

package/commonjs/Token/styles.js

@@ -14,7 +14,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 var Container = _styledComponents.default.button.withConfig({
   displayName: "styles__Container",
   componentId: "sc-1mt4sof-0"
-})(["position:relative;display:inline-block;margin:0;line-height:1;vertical-align:middle;outline:none;", " &:focus{", "}", " ", " ", " ", " ", ""], function (_ref) {
+})(["position:relative;display:inline-flex;align-items:center;margin:0;line-height:1;outline:none;", " &:focus{", "}", " ", " ", " ", " ", ""], function (_ref) {
   var theme = _ref.theme;
   return (0, _styledComponents.css)(["", " font-family:", ";font-weight:", ";border:1px solid ", ";border-radius:", ";color:", ";background:", ";padding:", " ", ";transition:all ", " ", ";"], theme.typography[200], theme.fontFamily, theme.fontWeights.normal, theme.colors.container.border.base, theme.radii[500], theme.colors.text.body, theme.colors.container.background.base, theme.space[200], theme.space[300], theme.duration.fast, theme.easing.ease_inout);
 }, _mixins.focusRing, function (_ref2) {

package/commonjs/TokenInput/TokenInput.js

@@ -201,7 +201,9 @@ var TokenInput = /*#__PURE__*/function (_React$Component) {
       }, /*#__PURE__*/React.createElement(_Box.default, {
         display: "flex",
         alignItems: "center"
-      }, iconName && /*#__PURE__*/React.createElement(_Icon.default, {
+      },
+      // TODO: add the ability to take labels or aria props for accessibility
+      iconName && /*#__PURE__*/React.createElement(_Icon.default, {
         name: iconName,
         size: "mini",
         pr: 300

package/commonjs/themes/dark/theme.js

@@ -179,7 +179,7 @@ var colors = _objectSpread(_objectSpread({}, _theme.default.colors), {}, {
     subtext: _seedsColor.default.COLOR_NEUTRAL_300,
     body: _seedsColor.default.COLOR_NEUTRAL_100,
     inverse: _seedsColor.default.COLOR_NEUTRAL_900,
-    error: _seedsColor.default.COLOR_RED_400,
+    error: _decorativePalettes.red.foreground,
     background: {
       highlight: _seedsColor.default.COLOR_YELLOW_900,
       selection: _seedsColor.default.COLOR_BLUE_800

package/commonjs/themes/light/theme.js

@@ -182,7 +182,7 @@ var colors = _objectSpread(_objectSpread({
     subtext: _seedsColor.default.COLOR_NEUTRAL_700,
     body: _seedsColor.default.COLOR_NEUTRAL_800,
     inverse: _seedsColor.default.COLOR_NEUTRAL_0,
-    error: _seedsColor.default.COLOR_RED_800,
+    error: _decorativePalettes.red.foreground,
     background: {
       highlight: _seedsColor.default.COLOR_YELLOW_200,
       selection: _seedsColor.default.COLOR_BLUE_300

package/commonjs/utils/index.js

@@ -3,7 +3,9 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.mergeRefs = exports.canUseDOM = void 0;
+exports.canUseDOM = void 0;
+exports.includes = includes;
+exports.mergeRefs = void 0;
 function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
 function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
 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; }
@@ -37,4 +39,12 @@ var mergeRefs = function mergeRefs(refs) {
     }
   };
 };
-exports.mergeRefs = mergeRefs;
+
+/**
+ * Type safe includes with narrowing
+ * https://fettblog.eu/typescript-array-includes/
+ */
+exports.mergeRefs = mergeRefs;
+function includes(coll, el) {
+  return coll.includes(el);
+}