@invoicebox/ui 0.1.0-alpha.52 → 0.1.0-alpha.53

package/dist/hooks/useInputFocus/index.stories.d.ts

@@ -0,0 +1,4 @@
+import type { Meta, StoryObj } from '@storybook/react';
+declare const meta: Meta;
+export default meta;
+export declare const Default: StoryObj;

package/dist/hooks/useInputFocus/index.stories.js

@@ -0,0 +1,29 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.Default = void 0;
+var _ = require(".");
+/* eslint-disable react-hooks/rules-of-hooks */
+
+var meta = {
+  title: 'hooks/useInputFocus',
+  tags: ['autodocs']
+};
+var _default = exports["default"] = meta;
+var Default = exports.Default = {
+  render: function render() {
+    var _useInputFocus = (0, _.useInputFocus)(),
+      inFocus = _useInputFocus.inFocus,
+      handleBlur = _useInputFocus.handleBlur,
+      handleFocus = _useInputFocus.handleFocus;
+    return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("input", {
+      placeholder: "focus me",
+      onBlur: handleBlur,
+      onFocus: handleFocus
+    }), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("code", null, JSON.stringify({
+      inFocus: inFocus
+    }, null, 2))));
+  }
+};

package/dist/hooks/useOutsideClick/index.stories.d.ts

@@ -0,0 +1,4 @@
+import type { Meta, StoryObj } from '@storybook/react';
+declare const meta: Meta;
+export default meta;
+export declare const Default: StoryObj;

package/dist/hooks/useOutsideClick/index.stories.js

@@ -0,0 +1,27 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.Default = void 0;
+var _addonActions = require("@storybook/addon-actions");
+var _ = require(".");
+/* eslint-disable react-hooks/rules-of-hooks */
+
+var meta = {
+  title: 'hooks/useOutsideClick',
+  tags: ['autodocs']
+};
+var _default = exports["default"] = meta;
+var Default = exports.Default = {
+  render: function render() {
+    var ref = (0, _.useOutsideClick)((0, _addonActions.action)('clicked outside'));
+    return /*#__PURE__*/React.createElement("div", {
+      ref: ref,
+      style: {
+        border: '1px solid black',
+        padding: 15
+      }
+    }, "inside");
+  }
+};

package/dist/index.d.ts

@@ -23,3 +23,5 @@ export { Divider } from './components/common/Divider';
 export type { TProps as TDividerProps } from './components/common/Divider';
 export { PaletteProvider } from './palette';
 export type { TAbstractPalette } from './palette';
+export { useOutsideClick } from './hooks/useOutsideClick';
+export { useInputFocus } from './hooks/useInputFocus';

package/dist/index.js

@@ -111,6 +111,18 @@ Object.defineProperty(exports, "WarningIcon", {
     return _WarningIcon.WarningIcon;
   }
 });
+Object.defineProperty(exports, "useInputFocus", {
+  enumerable: true,
+  get: function get() {
+    return _useInputFocus.useInputFocus;
+  }
+});
+Object.defineProperty(exports, "useOutsideClick", {
+  enumerable: true,
+  get: function get() {
+    return _useOutsideClick.useOutsideClick;
+  }
+});
 var _Skeleton = require("./components/common/Skeleton");
 var _InvoiceboxLoader = require("./components/common/InvoiceboxLoader");
 var _Typography = require("./components/common/Typography");
@@ -127,4 +139,6 @@ var _Calendar = require("./components/common/Calendar");
 var _DateInput = require("./components/form/DateInput");
 var _WarningIcon = require("./components/common/WarningIcon");
 var _Divider = require("./components/common/Divider");
-var _palette = require("./palette");
+var _palette = require("./palette");
+var _useOutsideClick = require("./hooks/useOutsideClick");
+var _useInputFocus = require("./hooks/useInputFocus");

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@invoicebox/ui",
-    "version": "0.1.0-alpha.52",
+    "version": "0.1.0-alpha.53",
     "description": "Invoicebox UI",
     "license": "Apache License 2.0",
     "scripts": {