@sproutsocial/racine 20.11.0 → 20.12.0

package/dist/types/Input/Input.d.ts

@@ -5,6 +5,7 @@ interface TypeState {
 }
 declare class Input extends React.Component<TypeInputProps, TypeState> {
     constructor(props: TypeInputProps);
+    componentDidUpdate({ value: prevValue }: TypeInputProps): void;
     static defaultProps: {
         autoFocus: boolean;
         disabled: boolean;

package/dist/types/Input/Input.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../src/Input/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,cAAc,CAAC;AAEjD,UAAU,SAAS;IACjB,QAAQ,EAAE,OAAO,CAAC;CACnB;AA0ED,cAAM,KAAM,SAAQ,KAAK,CAAC,SAAS,CAAC,cAAc,EAAE,SAAS,CAAC;gBAChD,KAAK,EAAE,cAAc;IASjC,MAAM,CAAC,YAAY;;;;;;MAMjB;IAEF,MAAM,CAAC,WAAW;;;MAAe;IAGjC,QAAQ,oCAAuC;IAE/C,UAAU,MAAO,gBAAgB,CAAC,gBAAgB,CAAC,sBAC1B;IAEzB,WAAW,MAAO,MAAM,cAAc,CAAC,iBAAiB,CAAC,UAqBvD;IAEF,YAAY,MAAO,MAAM,cAAc,CAAC,gBAAgB,CAAC,UAGvD;IAEF,WAAW,MAAO,gBAAgB,CAAC,gBAAgB,CAAC,sBAC1B;IAE1B,aAAa,MAAO,mBAAmB,CAAC,gBAAgB,CAAC,sBACN;IAEnD,WAAW,MAAO,mBAAmB,CAAC,gBAAgB,CAAC,sBACN;IAEjD,WAAW,MAAO,MAAM,cAAc,CAAC,gBAAgB,CAAC,sBACP;IAEjD,WAAW,eAAgB,MAAM,UAU/B;IAEF,MAAM;CAoHP;AAED,eAAe,KAAK,CAAC"}
+{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../src/Input/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,cAAc,CAAC;AAEjD,UAAU,SAAS;IACjB,QAAQ,EAAE,OAAO,CAAC;CACnB;AA0ED,cAAM,KAAM,SAAQ,KAAK,CAAC,SAAS,CAAC,cAAc,EAAE,SAAS,CAAC;gBAChD,KAAK,EAAE,cAAc;IASjC,kBAAkB,CAAC,EAAC,KAAK,EAAE,SAAS,EAAC,EAAE,cAAc;IAQrD,MAAM,CAAC,YAAY;;;;;;MAMjB;IAEF,MAAM,CAAC,WAAW;;;MAAe;IAGjC,QAAQ,oCAAuC;IAE/C,UAAU,MAAO,gBAAgB,CAAC,gBAAgB,CAAC,sBAC1B;IAEzB,WAAW,MAAO,MAAM,cAAc,CAAC,iBAAiB,CAAC,UAwBvD;IAEF,YAAY,MAAO,MAAM,cAAc,CAAC,gBAAgB,CAAC,UAIvD;IAEF,WAAW,MAAO,gBAAgB,CAAC,gBAAgB,CAAC,sBAC1B;IAE1B,aAAa,MAAO,mBAAmB,CAAC,gBAAgB,CAAC,sBACN;IAEnD,WAAW,MAAO,mBAAmB,CAAC,gBAAgB,CAAC,sBACN;IAEjD,WAAW,MAAO,MAAM,cAAc,CAAC,gBAAgB,CAAC,sBACP;IAEjD,WAAW,eAAgB,MAAM,UAU/B;IAEF,MAAM;CAoHP;AAED,eAAe,KAAK,CAAC"}

package/dist/types/Listbox/Listbox.d.ts

@@ -31,7 +31,7 @@ export declare const Listbox: {
         displayName: string;
     };
     FilterInput: {
-        (props: import("..").TypeInputProps): JSX.Element;
+        ({ type, ...props }: import("..").TypeInputProps): JSX.Element;
         displayName: string;
     };
 };

package/dist/types/Menu/Menu.d.ts

@@ -54,7 +54,7 @@ export declare const Menu: {
         displayName: string;
     };
     FilterInput: {
-        (props: TypeInputProps): JSX.Element;
+        ({ type, ...props }: TypeInputProps): JSX.Element;
         displayName: string;
     };
 };

package/dist/types/Menu/Menu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Menu.d.ts","sourceRoot":"","sources":["../../../src/Menu/Menu.tsx"],"names":[],"mappings":";AAcA,OAAY,EAAC,YAAY,EAAC,MAAM,UAAU,CAAC;AAI3C,OAAc,EAAC,cAAc,EAAC,MAAM,YAAY,CAAC;AAKjD,OAAO,KAAK,EACV,mBAAmB,EACnB,kBAAkB,EAClB,iBAAiB,EAEjB,aAAa,EAEb,mBAAmB,EACpB,MAAM,aAAa,CAAC;AA8CrB,eAAO,MAAM,QAAQ;kMAgBlB,iBAAiB;;CAuLnB,CAAC;AACF,eAAO,MAAM,YAAY;YAAW,iBAAiB;;CAEpD,CAAC;AACF,eAAO,MAAM,SAAS;YAAW,iBAAiB;;CAEjD,CAAC;AAEF,eAAO,MAAM,UAAU;YAAW,mBAAmB;;CA8CpD,CAAC;AAUF,eAAO,MAAM,SAAS;mEAMnB,kBAAkB;;CA2BpB,CAAC;AAEF,eAAO,MAAM,WAAW;YAAW,YAAY;;CAQ9C,CAAC;AA4FF,eAAO,MAAM,IAAI;0FASd,aAAa;;;uEA1Ib,kBAAkB;;;;sMA7PlB,iBAAiB;;;;gBAwLgB,iBAAiB;;;;gBAGpB,iBAAiB;;;;gBAIhB,mBAAmB;;;;gBA2FlB,YAAY;;;;gBAUf,cAAc;;;CAuJ7C,CAAC;AAuBF,eAAO,MAAM,UAAU,8GAWpB,mBAAmB,gBAwDrB,CAAC;AAEF,eAAe,IAAI,CAAC"}
+{"version":3,"file":"Menu.d.ts","sourceRoot":"","sources":["../../../src/Menu/Menu.tsx"],"names":[],"mappings":";AAcA,OAAY,EAAC,YAAY,EAAC,MAAM,UAAU,CAAC;AAI3C,OAAc,EAAC,cAAc,EAAC,MAAM,YAAY,CAAC;AAKjD,OAAO,KAAK,EACV,mBAAmB,EACnB,kBAAkB,EAClB,iBAAiB,EAEjB,aAAa,EAEb,mBAAmB,EACpB,MAAM,aAAa,CAAC;AA8CrB,eAAO,MAAM,QAAQ;kMAgBlB,iBAAiB;;CAuLnB,CAAC;AACF,eAAO,MAAM,YAAY;YAAW,iBAAiB;;CAEpD,CAAC;AACF,eAAO,MAAM,SAAS;YAAW,iBAAiB;;CAEjD,CAAC;AAEF,eAAO,MAAM,UAAU;YAAW,mBAAmB;;CA8CpD,CAAC;AAUF,eAAO,MAAM,SAAS;mEAMnB,kBAAkB;;CA2BpB,CAAC;AAEF,eAAO,MAAM,WAAW;YAAW,YAAY;;CAQ9C,CAAC;AA4FF,eAAO,MAAM,IAAI;0FASd,aAAa;;;uEA1Ib,kBAAkB;;;;sMA7PlB,iBAAiB;;;;gBAwLgB,iBAAiB;;;;gBAGpB,iBAAiB;;;;gBAIhB,mBAAmB;;;;gBA2FlB,YAAY;;;;6BAUO,cAAc;;;CAuJnE,CAAC;AAuBF,eAAO,MAAM,UAAU,8GAWpB,mBAAmB,gBAwDrB,CAAC;AAEF,eAAe,IAAI,CAAC"}

package/lib/Input/Input.js

@@ -106,15 +106,19 @@ var Input = /*#__PURE__*/function (_React$Component) {
         });
         input.dispatchEvent(inputEvent);
 
-        // Focus the input, update hasValue, and call any onClear callback
-        input.focus();
-        _this.updateState('');
+        // call any onClear callback
         (_this$props$onClear = (_this$props2 = _this.props).onClear) === null || _this$props$onClear === void 0 || _this$props$onClear.call(_this$props2, e);
+
+        // wait for next cycle to update focus
+        setTimeout(function () {
+          input.focus();
+        }, 0);
       }
     });
     _defineProperty(_assertThisInitialized(_this), "handleChange", function (e) {
       var _this$props$onChange, _this$props3;
       (_this$props$onChange = (_this$props3 = _this.props).onChange) === null || _this$props$onChange === void 0 || _this$props$onChange.call(_this$props3, e, e.currentTarget.value);
+      // needed for uncontrolled inputs
       _this.updateState(e.currentTarget.value);
     });
     _defineProperty(_assertThisInitialized(_this), "handleFocus", function (e) {
@@ -152,6 +156,16 @@ var Input = /*#__PURE__*/function (_React$Component) {
     return _this;
   }
   _createClass(Input, [{
+    key: "componentDidUpdate",
+    value: function componentDidUpdate(_ref) {
+      var prevValue = _ref.value;
+      // Update hasValue state whenever props value changes
+      var value = this.props.value;
+      if (value !== prevValue) {
+        this.updateState(value || '');
+      }
+    }
+  }, {
     key: "render",
     value: function render() {
       var _this$props8 = this.props,

package/lib/LogoViewBoxes.js

@@ -83,8 +83,8 @@ module.exports = {
   "tableau-lockup-dark": "0 0 291 56",
   "tableau-lockup": "0 0 291 56",
   "tableau": "0 0 18 18",
-  "threads-dark": "0 0 24 24",
-  "threads": "0 0 24 24",
+  "threads-dark": "0 0 18 18",
+  "threads": "0 0 18 18",
   "tiktok-dark": "0 0 140 159",
   "tiktok": "0 0 140 159",
   "tripadvisor-dark": "0 0 140 140",

package/lib/Menu/Menu.js

@@ -3,9 +3,10 @@ import _styled from "styled-components";
 var _excluded = ["id", "index", "as", "children", "role", "elemBefore", "elemAfter", "value", "onKeyPress", "onClick", "selected", "disabled", "indeterminate", "label"],
   _excluded2 = ["placement", "labelProps", "switchProps", "children", "id", "label"],
   _excluded3 = ["children", "title", "titleAs", "disabled"],
-  _excluded4 = ["children", "role", "multiselect", "innerRef"],
-  _excluded5 = ["role", "children", "onChange", "value", "multiselect", "innerRef", "footerContent"],
-  _excluded6 = ["content", "popoutProps", "children", "onClick", "closeOnItemClick", "id", "placement", "isOpen", "setIsOpen"];
+  _excluded4 = ["type"],
+  _excluded5 = ["children", "role", "multiselect", "innerRef"],
+  _excluded6 = ["role", "children", "onChange", "value", "multiselect", "innerRef", "footerContent"],
+  _excluded7 = ["content", "popoutProps", "children", "onClick", "closeOnItemClick", "id", "placement", "isOpen", "setIsOpen"];
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
@@ -338,8 +339,10 @@ export var MenuDivider = function MenuDivider(props) {
     borderColor: "container.border.base"
   }, props));
 };
-var MenuFilterInput = function MenuFilterInput(props) {
-  // @ts-note should probably user input types when Input is converted
+var MenuFilterInput = function MenuFilterInput(_ref7) {
+  var _ref7$type = _ref7.type,
+    type = _ref7$type === void 0 ? 'search' : _ref7$type,
+    props = _objectWithoutProperties(_ref7, _excluded4);
   var onChange = props.onChange,
     onFocus = props.onFocus,
     onBlur = props.onBlur;
@@ -365,18 +368,19 @@ var MenuFilterInput = function MenuFilterInput(props) {
     });
   }, [setState, onBlur]);
   return /*#__PURE__*/React.createElement(Input, _extends({}, props, {
+    type: type,
     value: state.filterQuery,
     onChange: handleOnChange,
     onFocus: handleOnFocus,
     onBlur: handleOnBlur
   }));
 };
-var MenuItems = function MenuItems(_ref7) {
-  var children = _ref7.children,
-    role = _ref7.role,
-    multiselect = _ref7.multiselect,
-    innerRef = _ref7.innerRef,
-    props = _objectWithoutProperties(_ref7, _excluded4);
+var MenuItems = function MenuItems(_ref8) {
+  var children = _ref8.children,
+    role = _ref8.role,
+    multiselect = _ref8.multiselect,
+    innerRef = _ref8.innerRef,
+    props = _objectWithoutProperties(_ref8, _excluded5);
   var _useMenuKeyDown = useMenuKeyDown(),
     handleKeyDown = _useMenuKeyDown.handleKeyDown,
     activeDescendent = _useMenuKeyDown.activeDescendent;
@@ -396,8 +400,8 @@ var MenuItems = function MenuItems(_ref7) {
     overflow: "hidden"
   }), children);
 };
-var MenuFooter = function MenuFooter(_ref8) {
-  var children = _ref8.children;
+var MenuFooter = function MenuFooter(_ref9) {
+  var children = _ref9.children;
   var _useContext5 = useContext(MenuContext),
     setState = _useContext5.setState;
   var handleOnBlur = useCallback(function () {
@@ -415,16 +419,16 @@ var MenuFooter = function MenuFooter(_ref8) {
     onFocus: handleOnFocus
   }, children);
 };
-export var Menu = function Menu(_ref9) {
-  var _ref9$role = _ref9.role,
-    role = _ref9$role === void 0 ? MENU_ROLES.MENU : _ref9$role,
-    children = _ref9.children,
-    onChange = _ref9.onChange,
-    value = _ref9.value,
-    multiselect = _ref9.multiselect,
-    innerRef = _ref9.innerRef,
-    footerContent = _ref9.footerContent,
-    props = _objectWithoutProperties(_ref9, _excluded5);
+export var Menu = function Menu(_ref10) {
+  var _ref10$role = _ref10.role,
+    role = _ref10$role === void 0 ? MENU_ROLES.MENU : _ref10$role,
+    children = _ref10.children,
+    onChange = _ref10.onChange,
+    value = _ref10.value,
+    multiselect = _ref10.multiselect,
+    innerRef = _ref10.innerRef,
+    footerContent = _ref10.footerContent,
+    props = _objectWithoutProperties(_ref10, _excluded6);
   var _useDescendants = useDescendants(),
     _useDescendants2 = _slicedToArray(_useDescendants, 2),
     descendants = _useDescendants2[0],
@@ -486,20 +490,20 @@ var CustomPopoutContent = styled(Popout.Content).withConfig({
   displayName: "Menu__CustomPopoutContent",
   componentId: "sc-1jmjosz-2"
 })(["padding:0;margin-left:0;margin-right:0;"]);
-export var MenuButton = function MenuButton(_ref10) {
-  var content = _ref10.content,
-    popoutProps = _ref10.popoutProps,
-    children = _ref10.children,
-    _onClick = _ref10.onClick,
-    _ref10$closeOnItemCli = _ref10.closeOnItemClick,
-    closeOnItemClick = _ref10$closeOnItemCli === void 0 ? true : _ref10$closeOnItemCli,
-    _ref10$id = _ref10.id,
-    id = _ref10$id === void 0 ? uniqueId('MenuButton-') : _ref10$id,
-    _ref10$placement = _ref10.placement,
-    placement = _ref10$placement === void 0 ? 'bottom' : _ref10$placement,
-    isOpen = _ref10.isOpen,
-    setIsOpen = _ref10.setIsOpen,
-    props = _objectWithoutProperties(_ref10, _excluded6);
+export var MenuButton = function MenuButton(_ref11) {
+  var content = _ref11.content,
+    popoutProps = _ref11.popoutProps,
+    children = _ref11.children,
+    _onClick = _ref11.onClick,
+    _ref11$closeOnItemCli = _ref11.closeOnItemClick,
+    closeOnItemClick = _ref11$closeOnItemCli === void 0 ? true : _ref11$closeOnItemCli,
+    _ref11$id = _ref11.id,
+    id = _ref11$id === void 0 ? uniqueId('MenuButton-') : _ref11$id,
+    _ref11$placement = _ref11.placement,
+    placement = _ref11$placement === void 0 ? 'bottom' : _ref11$placement,
+    isOpen = _ref11.isOpen,
+    setIsOpen = _ref11.setIsOpen,
+    props = _objectWithoutProperties(_ref11, _excluded7);
   var _useState5 = useState(false),
     _useState6 = _slicedToArray(_useState5, 2),
     isInternalShown = _useState6[0],

package/lib/Modal/styles.js

@@ -43,7 +43,7 @@ export var Container = styled(ReactModalAdapter).withConfig({
 }, zIndex, function (props) {
   return props.theme.colors.container.background.base;
 }, function (props) {
-  return props.theme.radii[500];
+  return props.theme.radii[600];
 }, function (props) {
   return props.theme.shadows.medium;
 }, function (props) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sproutsocial/racine",
-  "version": "20.11.0",
+  "version": "20.12.0",
   "license": "MIT",
   "engines": {
     "node": ">=18"
@@ -24,7 +24,6 @@
   "scripts": {
     "install-deps": "yarn install",
     "prepublishOnly": "yarn run build",
-    "precommit": "lint-staged",
     "change": "yarn changeset add",
     "clean": "rimraf ./__flow__ ./commonjs ./dist ./lib ./es tsconfig.tsbuildinfo",
     "build-package": "node ./bin/buildPackage.js",
@@ -55,7 +54,8 @@
     "storybook": "rm -rf node_modules/.cache/storybook && storybook dev -c .storybook -p 9999",
     "build-storybook": "storybook build --quiet -c .storybook -o .storybook-dist",
     "build-chromatic": "yarn build-svgs && storybook build --quiet -c .storybook -o .storybook-dist",
-    "ts-to-flow": "flowgen $FILE -o $OUTPUT --add-flow-header --no-module-exports"
+    "ts-to-flow": "flowgen $FILE -o $OUTPUT --add-flow-header --no-module-exports",
+    "prepare": "husky install"
   },
   "lint-staged": {
     "**/*": [
@@ -160,7 +160,7 @@
     "flow-bin": "0.131.0",
     "flowgen": "^1.21.0",
     "glob": "^7.1.6",
-    "husky": "^0.14.3",
+    "husky": "^8.0.3",
     "identity-obj-proxy": "^3.0.0",
     "inquirer": "^6.4.1",
     "is-glob": "^4.0.1",
@@ -170,7 +170,7 @@
     "jscodeshift": "^0.13.0",
     "jsdom": "^22.1.0",
     "json-to-scss": "^1.6.2",
-    "lint-staged": "^13.0.3",
+    "lint-staged": "^15.2.0",
     "moment": "^2.29.4",
     "npm-run-all": "^4.1.2",
     "outdent": "^0.7.0",