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

package/dist/components/common/Arrow/components/StyledSvg/index.d.ts

@@ -1,11 +1,8 @@
 /// <reference types="react" />
 export declare const StyledSvg: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").Substitute<import("../Svg").TProps, {
     $isOpen: boolean;
-    $isLight: boolean;
-    $openLightColor: string;
-    $closeLightColor: string;
-    $openUsualColor: string;
-    $closeUsualColor: string;
+    $openColor: string;
+    $closeColor: string;
     $padding: number;
     $defaultRotate: number;
 }>> & Omit<import("react").FC<import("../Svg").TProps>, keyof import("react").Component<any, {}, any>>;

package/dist/components/common/Arrow/components/StyledSvg/index.js

@@ -18,14 +18,8 @@ var StyledSvg = exports.StyledSvg = (0, _styledComponents["default"])(_Svg.Svg).
   var $padding = _ref2.$padding;
   return $padding;
 }, function (_ref3) {
-  var $isLight = _ref3.$isLight,
-    $isOpen = _ref3.$isOpen,
-    $openLightColor = _ref3.$openLightColor,
-    $closeLightColor = _ref3.$closeLightColor,
-    $openUsualColor = _ref3.$openUsualColor,
-    $closeUsualColor = _ref3.$closeUsualColor;
-  if ($isLight && $isOpen) return $openLightColor;
-  if ($isLight && !$isOpen) return $closeLightColor;
-  if (!$isLight && $isOpen) return $openUsualColor;
-  if (!$isLight && !$isOpen) return $closeUsualColor;
+  var $isOpen = _ref3.$isOpen,
+    $openColor = _ref3.$openColor,
+    $closeColor = _ref3.$closeColor;
+  return $isOpen ? $openColor : $closeColor;
 });

package/dist/components/common/Arrow/components/StyledSvg/index.stories.js

@@ -17,11 +17,8 @@ var _default = exports["default"] = meta;
 var Default = exports.Default = {
   args: {
     $isOpen: false,
-    $isLight: false,
-    $openLightColor: '#cfc',
-    $closeLightColor: '#cac',
-    $openUsualColor: '#05b',
-    $closeUsualColor: '#00b',
+    $openColor: '#05b',
+    $closeColor: '#00b',
     size: 10,
     $padding: 7,
     $defaultRotate: 0

package/dist/components/common/Arrow/index.d.ts

@@ -2,7 +2,6 @@ import { FC } from 'react';
 import { TArrowPalette } from './palette';
 export type TProps = {
     isOpen: boolean;
-    isLight?: boolean;
     innerSize?: number;
     outterSize?: number;
     defaultRotate?: number;

package/dist/components/common/Arrow/index.js

@@ -10,8 +10,6 @@ var _palette = require("../../../palette");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 var Arrow = exports.Arrow = function Arrow(_ref) {
   var isOpen = _ref.isOpen,
-    _ref$isLight = _ref.isLight,
-    isLight = _ref$isLight === void 0 ? false : _ref$isLight,
     _ref$innerSize = _ref.innerSize,
     innerSize = _ref$innerSize === void 0 ? 10 : _ref$innerSize,
     _ref$outterSize = _ref.outterSize,
@@ -22,11 +20,8 @@ var Arrow = exports.Arrow = function Arrow(_ref) {
   var mergedPalette = (0, _palette.useComponentPalette)('arrow', palette);
   return /*#__PURE__*/_react["default"].createElement(_StyledSvg.StyledSvg, {
     $isOpen: isOpen,
-    $isLight: isLight,
-    $openLightColor: mergedPalette.openLight,
-    $closeLightColor: mergedPalette.closeLight,
-    $openUsualColor: mergedPalette.openUsual,
-    $closeUsualColor: mergedPalette.closeUsual,
+    $openColor: mergedPalette.open,
+    $closeColor: mergedPalette.close,
     size: innerSize,
     $padding: (outterSize - innerSize) / 2,
     $defaultRotate: defaultRotate

package/dist/components/common/Arrow/index.stories.js

@@ -14,7 +14,6 @@ var _default = exports["default"] = meta;
 var Default = exports.Default = {
   args: {
     isOpen: false,
-    isLight: false,
     innerSize: 10,
     outterSize: 24,
     defaultRotate: 0

package/dist/components/common/Arrow/palette.d.ts

@@ -1,8 +1,6 @@
 import { TAbstractPalette } from '../../../palette';
 export type TArrowPalette = {
-    openLight: string;
-    closeLight: string;
-    openUsual: string;
-    closeUsual: string;
+    open: string;
+    close: string;
 };
 export declare const generateArrowPalette: (abstractPalette: TAbstractPalette) => TArrowPalette;

package/dist/components/common/Arrow/palette.js

@@ -8,9 +8,7 @@ var _hexToRgba = _interopRequireDefault(require("hex-to-rgba"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 var generateArrowPalette = exports.generateArrowPalette = function generateArrowPalette(abstractPalette) {
   return {
-    openLight: (0, _hexToRgba["default"])(abstractPalette.neutralUsual, 0.8),
-    closeLight: (0, _hexToRgba["default"])(abstractPalette.neutralUsual, 0.8),
-    openUsual: (0, _hexToRgba["default"])(abstractPalette.primary, 0.5),
-    closeUsual: (0, _hexToRgba["default"])(abstractPalette.primary, 0.5)
+    open: (0, _hexToRgba["default"])(abstractPalette.primary, 0.5),
+    close: (0, _hexToRgba["default"])(abstractPalette.primary, 0.5)
   };
 };

package/dist/components/form/DateInput/docs.stories.d.ts

@@ -0,0 +1,6 @@
+import type { StoryObj } from '@storybook/react';
+declare const meta: {
+    title: string;
+};
+export default meta;
+export declare const Installation: StoryObj;

package/dist/components/form/DateInput/docs.stories.js

@@ -0,0 +1,20 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.Installation = void 0;
+var _markdownToJsx = _interopRequireDefault(require("markdown-to-jsx"));
+var _Typography = require("../../common/Typography");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+var meta = {
+  title: 'form/DateInput'
+};
+var _default = exports["default"] = meta;
+var Installation = exports.Installation = {
+  render: function render() {
+    return /*#__PURE__*/React.createElement(_Typography.Typography, {
+      variant: "bodyL"
+    }, /*#__PURE__*/React.createElement(_markdownToJsx["default"], null, "\n### \u0423\u0441\u0442\u0430\u043D\u043E\u0432\u043A\u0430\n\nDateInput \u0438\u0441\u043F\u043E\u043B\u044C\u0437\u0443\u0435\u0442 \u043A\u043E\u043C\u043F\u043E\u043D\u0435\u043D\u0442 Calendar.\nCalendar \u0434\u043E\u043B\u0436\u0435\u043D \u0431\u044B\u0442\u044C \u0443\u0441\u0442\u0430\u043D\u043E\u0432\u043B\u0435\u043D. \n[\u041F\u043E\u0434\u0440\u043E\u0431\u043D\u0435\u0435.](/?path=/story/common-calendar--installation)\n"));
+  }
+};

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.51",
+    "version": "0.1.0-alpha.53",
     "description": "Invoicebox UI",
     "license": "Apache License 2.0",
     "scripts": {