@elliemae/ds-form 2.2.0-alpha.1 → 2.2.0-alpha.5

package/cjs/SearchBox/NavSearchBox.js

@@ -1,129 +1,140 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var _jsx = require('@babel/runtime/helpers/jsx');
-require('react');
-var styled = require('styled-components');
-var reactDesc = require('react-desc');
-var dsIcons = require('@elliemae/ds-icons');
-var DSButton = require('@elliemae/ds-button');
-var DSTextBox = require('../TextBox/DSTextBox.js');
-var props = require('./props.js');
-var defaultProps = require('./defaultProps.js');
-var jsxRuntime = require('react/jsx-runtime');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
-var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
-var DSButton__default = /*#__PURE__*/_interopDefaultLegacy(DSButton);
-
-var _StyledVerticalSepara, _VerticalSeparator;
-const StyledResultTracker = /*#__PURE__*/styled__default["default"].div.withConfig({
-  componentId: "sc-sbwvud-0"
-})(["padding:0 8px;color:#a2a9b6;white-space:nowrap;word-spacing:2px;"]);
-const StyledVerticalSeparator = /*#__PURE__*/styled__default["default"].div.withConfig({
-  componentId: "sc-sbwvud-1"
-})(["height:60%;border-right:1px solid #a2a9b6;"]);
-const StyledToolbarRightAddonsWrapper = /*#__PURE__*/styled__default["default"].div.withConfig({
-  componentId: "sc-sbwvud-2"
-})(["display:flex;align-items:center;justify-content:flex-end;"]);
-const NavBtn = /*#__PURE__*/styled__default["default"](DSButton__default["default"]).withConfig({
-  componentId: "sc-sbwvud-3"
-})(["height:calc(100% - 2px);border:none;border-radius:", ";"], _ref => {
-  let {
-    last
-  } = _ref;
-  return last ? '2px  2px 0px 0px' : '0px';
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __reExport = (target, module2, copyDefault, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toESM = (module2, isNodeMode) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+var __toCommonJS = /* @__PURE__ */ ((cache) => {
+  return (module2, temp) => {
+    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
+  };
+})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
+var NavSearchBox_exports = {};
+__export(NavSearchBox_exports, {
+  DSNavSearchBoxWithSchema: () => DSNavSearchBoxWithSchema,
+  NavSearchBox: () => NavSearchBox
 });
-
-const RightButtonsGroup = props => {
-  const {
-    onNext,
-    onPrevious,
-    onClear,
-    hideNavs,
-    showClear
-  } = props;
-  return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
-    children: [!hideNavs && /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
-      children: [/*#__PURE__*/_jsx__default["default"](NavBtn, {
-        buttonType: "text",
-        containerProps: {
-          'data-testid': 'ds-navsearchbox-next'
-        },
-        icon: /*#__PURE__*/_jsx__default["default"](dsIcons.ChevronDown, {
-          color: ['brand-primary', '800']
-        }),
-        onClick: onNext
-      }), /*#__PURE__*/_jsx__default["default"](NavBtn, {
-        buttonType: "text",
-        containerProps: {
-          'data-testid': 'ds-navsearchbox-prev'
-        },
-        icon: /*#__PURE__*/_jsx__default["default"](dsIcons.ChevronUp, {
-          color: ['brand-primary', '800']
-        }),
-        onClick: onPrevious
-      })]
-    }), showClear ? /*#__PURE__*/_jsx__default["default"](NavBtn, {
-      containerProps: {
-        'data-testid': 'ds-navsearchbox-clear'
-      },
-      buttonType: "text",
-      icon: /*#__PURE__*/_jsx__default["default"](dsIcons.CloseXsmall, {
-        color: ['brand-primary', '800']
-      }),
-      onClick: onClear,
-      last: true
-    }) : /*#__PURE__*/_jsx__default["default"](NavBtn, {
-      containerProps: {
-        'data-testid': 'ds-navsearchbox-clear'
-      },
-      buttonType: "text",
-      icon: /*#__PURE__*/_jsx__default["default"](dsIcons.Search, {
-        color: ['brand-primary', '800']
-      }),
-      last: true
-    })]
-  });
+var React = __toESM(require("react"));
+var import_react = __toESM(require("react"));
+var import_prop_types = __toESM(require("prop-types"));
+var import_styled_components = __toESM(require("styled-components"));
+var import_react_desc = require("react-desc");
+var import_ds_icons = require("@elliemae/ds-icons");
+var import_ds_button = require("@elliemae/ds-button");
+var import_TextBox = require("../TextBox");
+var import_props = require("./props");
+var import_defaultProps = require("./defaultProps");
+const StyledResultTracker = import_styled_components.default.div`
+  padding: 0 8px;
+  color: #a2a9b6; // this is color picked from the placeholder, specs doesn't specify
+  white-space: nowrap;
+  word-spacing: 2px;
+`;
+const StyledVerticalSeparator = import_styled_components.default.div`
+  height: 60%;
+  border-right: 1px solid #a2a9b6; // this is color picked from the placeholder, specs doesn't specify
+`;
+const StyledToolbarRightAddonsWrapper = import_styled_components.default.div`
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+`;
+const NavBtn = (0, import_styled_components.default)(import_ds_button.DSButton)`
+  height: calc(100% - 2px);
+  border: none;
+  border-radius: ${({ last }) => last ? "2px  2px 0px 0px" : "0px"};
+`;
+const RightButtonsGroup = (props) => {
+  const { onNext, onPrevious, onClear, hideNavs, showClear } = props;
+  return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, !hideNavs && /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(NavBtn, {
+    buttonType: "text",
+    containerProps: { "data-testid": "ds-navsearchbox-next" },
+    icon: /* @__PURE__ */ import_react.default.createElement(import_ds_icons.ChevronDown, {
+      color: ["brand-primary", "800"]
+    }),
+    onClick: onNext
+  }), /* @__PURE__ */ import_react.default.createElement(NavBtn, {
+    buttonType: "text",
+    containerProps: { "data-testid": "ds-navsearchbox-prev" },
+    icon: /* @__PURE__ */ import_react.default.createElement(import_ds_icons.ChevronUp, {
+      color: ["brand-primary", "800"]
+    }),
+    onClick: onPrevious
+  })), showClear ? /* @__PURE__ */ import_react.default.createElement(NavBtn, {
+    containerProps: { "data-testid": "ds-navsearchbox-clear" },
+    buttonType: "text",
+    icon: /* @__PURE__ */ import_react.default.createElement(import_ds_icons.CloseXsmall, {
+      color: ["brand-primary", "800"]
+    }),
+    onClick: onClear,
+    last: true
+  }) : /* @__PURE__ */ import_react.default.createElement(NavBtn, {
+    containerProps: { "data-testid": "ds-navsearchbox-clear" },
+    buttonType: "text",
+    icon: /* @__PURE__ */ import_react.default.createElement(import_ds_icons.Search, {
+      color: ["brand-primary", "800"]
+    }),
+    last: true
+  }));
 };
-
-const ResultTracker = props => {
-  const {
+RightButtonsGroup.propTypes = {
+  onNext: import_prop_types.default.func.isRequired,
+  onPrevious: import_prop_types.default.func.isRequired,
+  onClear: import_prop_types.default.func.isRequired,
+  hideNavs: import_prop_types.default.bool,
+  showClear: import_prop_types.default.bool
+};
+const ResultTracker = (props) => {
+  const { currentResultIndex, totalResults } = props;
+  if (currentResultIndex === -1 && !totalResults)
+    return null;
+  if (currentResultIndex === -1 && totalResults)
+    return /* @__PURE__ */ import_react.default.createElement(StyledResultTracker, null, totalResults);
+  return /* @__PURE__ */ import_react.default.createElement(StyledResultTracker, null, `${currentResultIndex + 1} / ${totalResults}`);
+};
+ResultTracker.propTypes = {
+  currentResultIndex: import_prop_types.default.number.isRequired,
+  totalResults: import_prop_types.default.number.isRequired
+};
+const VerticalSeparator = () => /* @__PURE__ */ import_react.default.createElement(StyledVerticalSeparator, null);
+const ToolbarRightAddons = (props) => {
+  const { onNext, onPrevious, onClear, currentResultIndex, totalResults, showClear } = props;
+  return /* @__PURE__ */ import_react.default.createElement(StyledToolbarRightAddonsWrapper, null, /* @__PURE__ */ import_react.default.createElement(ResultTracker, {
     currentResultIndex,
     totalResults
-  } = props;
-  if (currentResultIndex === -1 && !totalResults) return null;
-  if (currentResultIndex === -1 && totalResults) return /*#__PURE__*/_jsx__default["default"](StyledResultTracker, {}, void 0, totalResults);
-  return /*#__PURE__*/_jsx__default["default"](StyledResultTracker, {}, void 0, "".concat(currentResultIndex + 1, " / ").concat(totalResults));
-};
-
-const VerticalSeparator = () => _StyledVerticalSepara || (_StyledVerticalSepara = /*#__PURE__*/_jsx__default["default"](StyledVerticalSeparator, {}));
-
-const ToolbarRightAddons = props => {
-  const {
+  }), currentResultIndex !== -1 || totalResults ? /* @__PURE__ */ import_react.default.createElement(VerticalSeparator, null) : null, /* @__PURE__ */ import_react.default.createElement(RightButtonsGroup, {
     onNext,
-    onPrevious,
-    onClear,
-    currentResultIndex,
-    totalResults,
-    showClear
-  } = props;
-  return /*#__PURE__*/_jsx__default["default"](StyledToolbarRightAddonsWrapper, {}, void 0, /*#__PURE__*/_jsx__default["default"](ResultTracker, {
-    currentResultIndex: currentResultIndex,
-    totalResults: totalResults
-  }), currentResultIndex !== -1 || totalResults ? _VerticalSeparator || (_VerticalSeparator = /*#__PURE__*/_jsx__default["default"](VerticalSeparator, {})) : null, /*#__PURE__*/_jsx__default["default"](RightButtonsGroup, {
-    onNext: onNext,
     hideNavs: currentResultIndex === -1 && !totalResults,
-    onPrevious: onPrevious,
-    showClear: showClear,
-    onClear: onClear
+    onPrevious,
+    showClear,
+    onClear
   }));
 };
-
-const NavSearchBox = props => {
+ToolbarRightAddons.propTypes = {
+  onNext: import_prop_types.default.func.isRequired,
+  onPrevious: import_prop_types.default.func.isRequired,
+  onClear: import_prop_types.default.func.isRequired,
+  currentResultIndex: import_prop_types.default.number.isRequired,
+  totalResults: import_prop_types.default.number.isRequired,
+  showClear: import_prop_types.default.bool
+};
+const NavSearchBox = (props) => {
   const {
     currentResultIndex,
     onChange,
@@ -137,51 +148,43 @@ const NavSearchBox = props => {
     autoFocus,
     innerRef
   } = props;
-
-  const handleChange = e => {
-    if (onChange) onChange(e.target.value);
+  const handleChange = (e) => {
+    if (onChange)
+      onChange(e.target.value);
   };
-
-  const handleKeyDown = e => {
-    // SHIFT + ENTER
+  const handleKeyDown = (e) => {
     if (e.shiftKey) {
-      if (e.key === 'Enter' || e.keyCode === 13) {
+      if (e.key === "Enter" || e.keyCode === 13) {
         onPrevious();
       }
-    } // ESCAPE
-    else if (e.key === 'Escape' || e.keyCode === 27) {
+    } else if (e.key === "Escape" || e.keyCode === 27) {
       onClear();
-    } // ENTER
-    else if (e.key === 'Enter' || e.keyCode === 13) {
+    } else if (e.key === "Enter" || e.keyCode === 13) {
       onNext();
     }
   };
-
-  return /*#__PURE__*/_jsx__default["default"](DSTextBox["default"], {
+  return /* @__PURE__ */ import_react.default.createElement(import_TextBox.DSTextBox, {
     onChange: handleChange,
-    containerProps: {
-      'data-testid': 'ds-nav-searchbox-input'
-    },
-    onBlur: onBlur,
+    containerProps: { "data-testid": "ds-nav-searchbox-input" },
+    onBlur,
     onKeyDown: handleKeyDown,
-    placeholder: placeholder,
-    value: value,
-    autoFocus: autoFocus,
-    innerRef: innerRef,
-    rightComponent: /*#__PURE__*/_jsx__default["default"](ToolbarRightAddons, {
+    placeholder,
+    value,
+    autoFocus,
+    innerRef,
+    rightComponent: /* @__PURE__ */ import_react.default.createElement(ToolbarRightAddons, {
       showClear: !!value,
-      onNext: onNext,
-      onPrevious: onPrevious,
-      onClear: onClear,
-      currentResultIndex: currentResultIndex,
-      totalResults: totalResults
+      onNext,
+      onPrevious,
+      onClear,
+      currentResultIndex,
+      totalResults
     })
   });
 };
-
-NavSearchBox.defaultProps = defaultProps.navSearchBoxDefaultProps;
-const DSNavSearchBoxWithSchema = reactDesc.describe(NavSearchBox);
-DSNavSearchBoxWithSchema.propTypes = props.navSearchBoxProps;
-
-exports.DSNavSearchBoxWithSchema = DSNavSearchBoxWithSchema;
-exports.NavSearchBox = NavSearchBox;
+NavSearchBox.propTypes = import_props.navSearchBoxProps;
+NavSearchBox.defaultProps = import_defaultProps.navSearchBoxDefaultProps;
+const DSNavSearchBoxWithSchema = (0, import_react_desc.describe)(NavSearchBox);
+DSNavSearchBoxWithSchema.propTypes = import_props.navSearchBoxProps;
+module.exports = __toCommonJS(NavSearchBox_exports);
+//# sourceMappingURL=NavSearchBox.js.map

package/cjs/SearchBox/NavSearchBox.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/SearchBox/NavSearchBox.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["/* eslint-disable max-lines */\nimport React from 'react';\nimport PropTypes from 'prop-types';\nimport styled from 'styled-components';\nimport { describe } from 'react-desc';\nimport { ChevronDown, Search, ChevronUp, CloseXsmall } from '@elliemae/ds-icons';\nimport { DSButton } from '@elliemae/ds-button';\nimport { DSTextBox } from '../TextBox';\nimport { navSearchBoxProps } from './props';\nimport { navSearchBoxDefaultProps } from './defaultProps';\n\nconst StyledResultTracker = styled.div`\n  padding: 0 8px;\n  color: #a2a9b6; // this is color picked from the placeholder, specs doesn't specify\n  white-space: nowrap;\n  word-spacing: 2px;\n`;\nconst StyledVerticalSeparator = styled.div`\n  height: 60%;\n  border-right: 1px solid #a2a9b6; // this is color picked from the placeholder, specs doesn't specify\n`;\nconst StyledToolbarRightAddonsWrapper = styled.div`\n  display: flex;\n  align-items: center;\n  justify-content: flex-end;\n`;\n\nconst NavBtn = styled(DSButton)`\n  height: calc(100% - 2px);\n  border: none;\n  border-radius: ${({ last }) => (last ? '2px  2px 0px 0px' : '0px')};\n`;\n\nconst RightButtonsGroup = (props) => {\n  const { onNext, onPrevious, onClear, hideNavs, showClear } = props;\n\n  return (\n    <>\n      {!hideNavs && (\n        <>\n          <NavBtn\n            buttonType=\"text\"\n            containerProps={{ 'data-testid': 'ds-navsearchbox-next' }}\n            icon={<ChevronDown color={['brand-primary', '800']} />}\n            onClick={onNext}\n          />\n          <NavBtn\n            buttonType=\"text\"\n            containerProps={{ 'data-testid': 'ds-navsearchbox-prev' }}\n            icon={<ChevronUp color={['brand-primary', '800']} />}\n            onClick={onPrevious}\n          />\n        </>\n      )}\n      {showClear ? (\n        <NavBtn\n          containerProps={{ 'data-testid': 'ds-navsearchbox-clear' }}\n          buttonType=\"text\"\n          icon={<CloseXsmall color={['brand-primary', '800']} />}\n          onClick={onClear}\n          last\n        />\n      ) : (\n        <NavBtn\n          containerProps={{ 'data-testid': 'ds-navsearchbox-clear' }}\n          buttonType=\"text\"\n          icon={<Search color={['brand-primary', '800']} />}\n          last\n        />\n      )}\n    </>\n  );\n};\nRightButtonsGroup.propTypes = {\n  onNext: PropTypes.func.isRequired,\n  onPrevious: PropTypes.func.isRequired,\n  onClear: PropTypes.func.isRequired,\n  hideNavs: PropTypes.bool,\n  showClear: PropTypes.bool,\n};\n\nconst ResultTracker = (props) => {\n  const { currentResultIndex, totalResults } = props;\n\n  if (currentResultIndex === -1 && !totalResults) return null;\n\n  if (currentResultIndex === -1 && totalResults) return <StyledResultTracker>{totalResults}</StyledResultTracker>;\n\n  return <StyledResultTracker>{`${currentResultIndex + 1} / ${totalResults}`}</StyledResultTracker>;\n};\nResultTracker.propTypes = {\n  currentResultIndex: PropTypes.number.isRequired,\n  totalResults: PropTypes.number.isRequired,\n};\n\nconst VerticalSeparator = () => <StyledVerticalSeparator />;\n\nconst ToolbarRightAddons = (props) => {\n  const { onNext, onPrevious, onClear, currentResultIndex, totalResults, showClear } = props;\n\n  return (\n    <StyledToolbarRightAddonsWrapper>\n      <ResultTracker currentResultIndex={currentResultIndex} totalResults={totalResults} />\n      {currentResultIndex !== -1 || totalResults ? <VerticalSeparator /> : null}\n      <RightButtonsGroup\n        onNext={onNext}\n        hideNavs={currentResultIndex === -1 && !totalResults}\n        onPrevious={onPrevious}\n        showClear={showClear}\n        onClear={onClear}\n      />\n    </StyledToolbarRightAddonsWrapper>\n  );\n};\nToolbarRightAddons.propTypes = {\n  onNext: PropTypes.func.isRequired,\n  onPrevious: PropTypes.func.isRequired,\n  onClear: PropTypes.func.isRequired,\n  currentResultIndex: PropTypes.number.isRequired,\n  totalResults: PropTypes.number.isRequired,\n  showClear: PropTypes.bool,\n};\n\ninterface PropsT {\n  value: string;\n  onChange: (val: string) => void;\n  onBlur?: (e: React.FocusEvent<HTMLInputElement>) => void;\n  onNext: () => void;\n  onPrevious: () => void;\n  onClear: () => void;\n  currentResultIndex: number;\n  totalResults: number;\n  placeholder: {\n    defaultValue(arg: import('react-desc').ReactDescPossibleDefaultValues): {\n      deprecated: import('react-desc').PropTypesDescValidator;\n    };\n    isRequired: import('react-desc').PropTypesDescValue;\n  };\n  autoFocus: boolean;\n}\n\nconst NavSearchBox = (props: PropsT) => {\n  const {\n    currentResultIndex,\n    onChange,\n    onClear,\n    onNext,\n    onPrevious,\n    totalResults,\n    value,\n    onBlur,\n    placeholder,\n    autoFocus,\n    innerRef,\n  } = props;\n\n  const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\n    if (onChange) onChange(e.target.value);\n  };\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n    // SHIFT + ENTER\n    if (e.shiftKey) {\n      if (e.key === 'Enter' || e.keyCode === 13) {\n        onPrevious();\n      }\n    } // ESCAPE\n    else if (e.key === 'Escape' || e.keyCode === 27) {\n      onClear();\n    } // ENTER\n    else if (e.key === 'Enter' || e.keyCode === 13) {\n      onNext();\n    }\n  };\n\n  return (\n    <DSTextBox\n      onChange={handleChange}\n      containerProps={{ 'data-testid': 'ds-nav-searchbox-input' }}\n      onBlur={onBlur}\n      onKeyDown={handleKeyDown}\n      placeholder={placeholder}\n      value={value}\n      autoFocus={autoFocus}\n      innerRef={innerRef}\n      rightComponent={\n        <ToolbarRightAddons\n          showClear={!!value}\n          onNext={onNext}\n          onPrevious={onPrevious}\n          onClear={onClear}\n          currentResultIndex={currentResultIndex}\n          totalResults={totalResults}\n        />\n      }\n    />\n  );\n};\n\nNavSearchBox.propTypes = navSearchBoxProps;\nNavSearchBox.defaultProps = navSearchBoxDefaultProps;\nconst DSNavSearchBoxWithSchema = describe(NavSearchBox);\nDSNavSearchBoxWithSchema.propTypes = navSearchBoxProps;\nexport { NavSearchBox, DSNavSearchBoxWithSchema };\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": "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",
+  "names": []
+}

package/cjs/SearchBox/SButton.js

@@ -1,34 +1,77 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var _jsx = require('@babel/runtime/helpers/jsx');
-require('react');
-var styled = require('styled-components');
-var dsSystem = require('@elliemae/ds-system');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
-var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
-
-const Button = /*#__PURE__*/styled__default["default"].button.withConfig({
-  componentId: "sc-15udc15-0"
-})(["all:unset;position:absolute;height:calc(100% - 2px);width:28px;top:1px;right:1px;display:flex;justify-content:center;align-items:center;box-sizing:border-box;cursor:pointer;z-index:1;svg{fill:", ";}&:disabled{color:#5d6775;cursor:not-allowed;svg{fill:#5d6775;}}&:focus{", "}"], props => props.theme.colors.brand['600'], dsSystem.focus());
-
-const SButton = _ref => {
-  let {
-    icon,
-    disabled,
-    onClick,
-    dataTestid = "ds-searchbox-button"
-  } = _ref;
-  return /*#__PURE__*/_jsx__default["default"](Button, {
-    "data-testid": dataTestid,
-    onClick: onClick,
-    disabled: disabled,
-    type: "button"
-  }, void 0, icon);
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
 };
-
-exports.SButton = SButton;
+var __reExport = (target, module2, copyDefault, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toESM = (module2, isNodeMode) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+var __toCommonJS = /* @__PURE__ */ ((cache) => {
+  return (module2, temp) => {
+    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
+  };
+})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
+var SButton_exports = {};
+__export(SButton_exports, {
+  SButton: () => SButton
+});
+var React = __toESM(require("react"));
+var import_react = __toESM(require("react"));
+var import_react_desc = require("react-desc");
+var import_styled_components = __toESM(require("styled-components"));
+var import_ds_system = require("@elliemae/ds-system");
+const Button = import_styled_components.default.button`
+  all: unset;
+  position: absolute;
+  height: calc(100% - 2px);
+  width: 28px;
+  top: 1px;
+  right: 1px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  box-sizing: border-box;
+  cursor: pointer;
+  z-index: 1;
+  svg {
+    fill: ${(props) => props.theme.colors.brand["600"]};
+  }
+  &:disabled {
+    color: #5d6775;
+    cursor: not-allowed;
+    svg {
+      fill: #5d6775;
+    }
+  }
+  &:focus {
+    ${(0, import_ds_system.focus)()}
+  }
+`;
+const SButton = ({ icon, disabled, onClick, dataTestid = "ds-searchbox-button" }) => /* @__PURE__ */ import_react.default.createElement(Button, {
+  "data-testid": dataTestid,
+  onClick,
+  disabled,
+  type: "button"
+}, icon);
+SButton.propTypes = {
+  onClick: import_react_desc.PropTypes.func.isRequired.description("click handler for button"),
+  icon: import_react_desc.PropTypes.node.isRequired.description("ds icon to render inside button"),
+  disabled: import_react_desc.PropTypes.bool.description("disable button"),
+  dataTestid: import_react_desc.PropTypes.string.description("Data test id")
+};
+module.exports = __toCommonJS(SButton_exports);
+//# sourceMappingURL=SButton.js.map

package/cjs/SearchBox/SButton.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/SearchBox/SButton.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import React from 'react';\nimport { PropTypes } from 'react-desc';\nimport styled from 'styled-components';\nimport { focus } from '@elliemae/ds-system';\n\nconst Button = styled.button`\n  all: unset;\n  position: absolute;\n  height: calc(100% - 2px);\n  width: 28px;\n  top: 1px;\n  right: 1px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  box-sizing: border-box;\n  cursor: pointer;\n  z-index: 1;\n  svg {\n    fill: ${(props) => props.theme.colors.brand['600']};\n  }\n  &:disabled {\n    color: #5d6775;\n    cursor: not-allowed;\n    svg {\n      fill: #5d6775;\n    }\n  }\n  &:focus {\n    ${focus()}\n  }\n`;\n\nconst SButton = ({ icon, disabled, onClick, dataTestid = \"ds-searchbox-button\" }) => (\n  <Button\n    data-testid={dataTestid}\n    onClick={onClick}\n    disabled={disabled}\n    type=\"button\"\n  >\n    {icon}\n  </Button>\n);\n\nSButton.propTypes = {\n  /** click handler for button */\n  onClick: PropTypes.func.isRequired.description('click handler for button'),\n  /** ds icon to render inside button */\n  icon: PropTypes.node.isRequired.description(\n    'ds icon to render inside button',\n  ),\n  /** disable button */\n  disabled: PropTypes.bool.description('disable button'),\n  dataTestid: PropTypes.string.description('Data test id')\n};\n\nexport { SButton };\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,wBAA0B;AAC1B,+BAAmB;AACnB,uBAAsB;AAEtB,MAAM,SAAS,iCAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,YAcV,CAAC,UAAU,MAAM,MAAM,OAAO,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAU1C;AAAA;AAAA;AAIN,MAAM,UAAU,CAAC,EAAE,MAAM,UAAU,SAAS,aAAa,4BACvD,mDAAC,QAAD;AAAA,EACE,eAAa;AAAA,EACb;AAAA,EACA;AAAA,EACA,MAAK;AAAA,GAEJ;AAIL,QAAQ,YAAY;AAAA,EAElB,SAAS,4BAAU,KAAK,WAAW,YAAY;AAAA,EAE/C,MAAM,4BAAU,KAAK,WAAW,YAC9B;AAAA,EAGF,UAAU,4BAAU,KAAK,YAAY;AAAA,EACrC,YAAY,4BAAU,OAAO,YAAY;AAAA;",
+  "names": []
+}

package/cjs/SearchBox/SearchBoxToggle.js

@@ -1,78 +1,87 @@
-'use strict';
-
-var _defineProperty = require('@babel/runtime/helpers/defineProperty');
-var _jsx = require('@babel/runtime/helpers/jsx');
-var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
-require('core-js/modules/web.dom-collections.iterator.js');
-require('core-js/modules/esnext.async-iterator.filter.js');
-require('core-js/modules/esnext.iterator.constructor.js');
-require('core-js/modules/esnext.iterator.filter.js');
-require('core-js/modules/esnext.async-iterator.for-each.js');
-require('core-js/modules/esnext.iterator.for-each.js');
-var React = require('react');
-var styled = require('styled-components');
-var dsIcons = require('@elliemae/ds-icons');
-var DSButton = require('@elliemae/ds-button');
-var DSSearchBox = require('./DSSearchBox.js');
-var jsxRuntime = require('react/jsx-runtime');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
-var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
-var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
-var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
-var DSButton__default = /*#__PURE__*/_interopDefaultLegacy(DSButton);
-
-var _Search;
-
-const _excluded = ["onSearchButtonClick", "width"];
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __reExport = (target, module2, copyDefault, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toESM = (module2, isNodeMode) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+var __toCommonJS = /* @__PURE__ */ ((cache) => {
+  return (module2, temp) => {
+    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
+  };
+})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
+var SearchBoxToggle_exports = {};
+__export(SearchBoxToggle_exports, {
+  default: () => SearchBoxToggle_default
+});
+var React = __toESM(require("react"));
+var import_react = __toESM(require("react"));
+var import_styled_components = __toESM(require("styled-components"));
+var import_ds_icons = require("@elliemae/ds-icons");
+var import_ds_button = require("@elliemae/ds-button");
+var import_DSSearchBox = require("./DSSearchBox");
 const SEARCH_BUTTON_WIDTH = 26;
-const SearchWrap = /*#__PURE__*/styled__default["default"].div.withConfig({
-  componentId: "sc-xt33wm-0"
-})(["transition:width 200ms ease;width:", "px;height:0;", " ", ""], SEARCH_BUTTON_WIDTH, props => !props.show ? "\n        opacity:0;\n\n        & * {\n          width: ".concat(SEARCH_BUTTON_WIDTH, "px;\n          height: 0;\n          border: 0;\n        }\n      ") : '', props => props.isOpen ? "width: ".concat(props.width, ";opacity: 1;height: auto;") : ''); // eslint-disable-next-line react/prop-types
-
-const SearchBoxToggle = _ref => {
-  let {
-    onSearchButtonClick,
-    width
-  } = _ref,
-      rest = _objectWithoutProperties__default["default"](_ref, _excluded);
+const SearchWrap = import_styled_components.default.div`
+  transition: width 200ms ease;
+  width: ${SEARCH_BUTTON_WIDTH}px;
+  height: 0;
 
-  const [isOpen, setOpen] = React.useState(false);
-  const [show, setShow] = React.useState(true);
-  const computedWidth = typeof width === 'number' ? "".concat(width, "px") : width;
+  ${(props) => !props.show ? `
+        opacity:0;
 
-  const button = /*#__PURE__*/_jsx__default["default"](DSButton__default["default"], {
+        & * {
+          width: ${SEARCH_BUTTON_WIDTH}px;
+          height: 0;
+          border: 0;
+        }
+      ` : ""}
+  ${(props) => props.isOpen ? `width: ${props.width};opacity: 1;height: auto;` : ""}
+`;
+const SearchBoxToggle = ({ onSearchButtonClick, width, ...rest }) => {
+  const [isOpen, setOpen] = (0, import_react.useState)(false);
+  const [show, setShow] = (0, import_react.useState)(true);
+  const computedWidth = typeof width === "number" ? `${width}px` : width;
+  const button = /* @__PURE__ */ import_react.default.createElement(import_ds_button.DSButton, {
     onClick: () => {
       setOpen(true);
     },
     buttonType: "text",
-    icon: _Search || (_Search = /*#__PURE__*/_jsx__default["default"](dsIcons.Search, {}))
+    icon: /* @__PURE__ */ import_react.default.createElement(import_ds_icons.Search, null)
   });
-
-  return /*#__PURE__*/_jsx__default["default"]("div", {}, void 0, show && !isOpen && button, /*#__PURE__*/_jsx__default["default"](SearchWrap, {
+  return /* @__PURE__ */ import_react.default.createElement("div", null, show && !isOpen && button, /* @__PURE__ */ import_react.default.createElement(SearchWrap, {
     show: !show || isOpen,
-    isOpen: isOpen,
+    isOpen,
     width: computedWidth,
     onTransitionEnd: () => {
       setShow(!isOpen);
     }
-  }, void 0, /*#__PURE__*/jsxRuntime.jsx(DSSearchBox["default"], _objectSpread(_objectSpread({}, rest), {}, {
+  }, /* @__PURE__ */ import_react.default.createElement(import_DSSearchBox.DSSearchBox, {
+    ...rest,
     onSearchButtonClick: () => {
       onSearchButtonClick();
       setOpen(false);
     }
-  }))));
+  })));
 };
-
 SearchBoxToggle.defaultProps = {
   onSearchButtonClick: () => null,
   width: 300
 };
-
-module.exports = SearchBoxToggle;
+var SearchBoxToggle_default = SearchBoxToggle;
+module.exports = __toCommonJS(SearchBoxToggle_exports);
+//# sourceMappingURL=SearchBoxToggle.js.map