@invoicebox/ui 0.1.0-alpha.114 → 0.1.0-alpha.115

package/dist/components/_helpers/StoryOneFieldForm/index.d.ts

@@ -0,0 +1,12 @@
+import { FC, ReactNode } from 'react';
+import { Resolver } from 'react-hook-form';
+export declare const FIELD_NAME = "field";
+type TProps = {
+    children: ReactNode;
+    initialValue: any;
+    resolver?: Resolver<{
+        field: any;
+    }>;
+};
+export declare const StoryOneFieldForm: FC<TProps>;
+export {};

package/dist/components/_helpers/StoryOneFieldForm/index.js

@@ -0,0 +1,39 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.StoryOneFieldForm = exports.FIELD_NAME = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _addonActions = require("@storybook/addon-actions");
+var _reactHookForm = require("react-hook-form");
+var _Portal = require("../../common/Portal");
+var _devtools = require("@hookform/devtools");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+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; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+var FIELD_NAME = exports.FIELD_NAME = 'field';
+var StoryOneFieldForm = exports.StoryOneFieldForm = function StoryOneFieldForm(_ref) {
+  var children = _ref.children,
+    initialValue = _ref.initialValue,
+    resolver = _ref.resolver;
+  var methods = (0, _reactHookForm.useForm)({
+    defaultValues: _defineProperty({}, FIELD_NAME, initialValue),
+    resolver: resolver,
+    mode: 'onChange'
+  });
+  var handleSubmit = methods.handleSubmit;
+  var submit = function submit() {
+    (0, _addonActions.action)('submit');
+  };
+  return /*#__PURE__*/_react["default"].createElement(_reactHookForm.FormProvider, methods, /*#__PURE__*/_react["default"].createElement("form", {
+    onSubmit: handleSubmit(submit)
+  }, children, /*#__PURE__*/_react["default"].createElement("button", {
+    type: "submit"
+  }, "\u041E\u0442\u043F\u0440\u0430\u0432\u0438\u0442\u044C"), /*#__PURE__*/_react["default"].createElement(_Portal.Portal, null, /*#__PURE__*/_react["default"].createElement(_devtools.DevTool, {
+    control: methods.control,
+    placement: "top-right"
+  }))));
+};

package/dist/components/_helpers/selectOptions.d.ts

@@ -0,0 +1,4 @@
+export declare const selectOptions: {
+    label: string;
+    value: string;
+}[];

package/dist/components/_helpers/selectOptions.js

@@ -0,0 +1,43 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.selectOptions = void 0;
+var selectOptions = exports.selectOptions = [{
+  label: 'Option 1',
+  value: 'option-1'
+}, {
+  label: 'Option 2',
+  value: 'option-2'
+}, {
+  label: 'Option 3',
+  value: 'option-3'
+}, {
+  label: 'Option 4',
+  value: 'option-4'
+}, {
+  label: 'Option 5',
+  value: 'option-5'
+}, {
+  label: 'Option 6',
+  value: 'option-6'
+}, {
+  label: 'Option 7',
+  value: 'option-7'
+}, {
+  label: 'Option 8',
+  value: 'option-8'
+}, {
+  label: 'Option 9',
+  value: 'option-9'
+}, {
+  label: 'Option 10',
+  value: 'option-10'
+}, {
+  label: 'Option 11',
+  value: 'option-11'
+}, {
+  label: 'Option 12',
+  value: 'option-12'
+}];

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

@@ -0,0 +1,5 @@
+import { FC, ReactNode } from 'react';
+export type TProps = {
+    children: ReactNode;
+};
+export declare const Portal: FC<TProps>;

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

@@ -0,0 +1,27 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Portal = void 0;
+var _react = require("react");
+var _reactDom = require("react-dom");
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+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; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+var Portal = exports.Portal = function Portal(_ref) {
+  var children = _ref.children;
+  var _useState = (0, _react.useState)(document.createElement('div')),
+    _useState2 = _slicedToArray(_useState, 1),
+    container = _useState2[0];
+  (0, _react.useEffect)(function () {
+    document.body.appendChild(container);
+    return function () {
+      document.body.removeChild(container);
+    };
+  }, [container]);
+  return /*#__PURE__*/(0, _reactDom.createPortal)(children, container);
+};

package/dist/components/common/Portal/index.stories.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import type { StoryObj } from '@storybook/react';
+import { TProps } from '.';
+declare const meta: {
+    title: string;
+    component: React.FC<TProps>;
+    tags: string[];
+};
+export default meta;
+export declare const Default: StoryObj<TProps>;

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

@@ -0,0 +1,26 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.Default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _ = require(".");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+var meta = {
+  title: 'common/Portal',
+  component: _.Portal,
+  tags: ['autodocs']
+};
+var _default = exports["default"] = meta;
+var Default = exports.Default = {
+  args: {
+    children: /*#__PURE__*/_react["default"].createElement("div", {
+      style: {
+        position: 'absolute',
+        left: '30px',
+        top: '30px'
+      }
+    }, "Content inner portal")
+  }
+};

package/dist/components/formFields/RHFAutocomplete/index.d.ts

@@ -0,0 +1,6 @@
+import { FC } from 'react';
+import { TAutocompleteProps } from '../../../index';
+export type TProps = Omit<TAutocompleteProps, 'value' | 'onBlur' | 'onFocus'> & {
+    name: string;
+} & Pick<Partial<TAutocompleteProps>, 'onChange'>;
+export declare const RHFAutocomplete: FC<TProps>;

package/dist/components/formFields/RHFAutocomplete/index.js

@@ -0,0 +1,44 @@
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.RHFAutocomplete = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _reactHookForm = require("react-hook-form");
+var _index = require("../../../index");
+var _excluded = ["name", "onChange"];
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+var RHFAutocomplete = exports.RHFAutocomplete = function RHFAutocomplete(_ref) {
+  var name = _ref.name,
+    onChange = _ref.onChange,
+    other = _objectWithoutProperties(_ref, _excluded);
+  var _useFormContext = (0, _reactHookForm.useFormContext)(),
+    control = _useFormContext.control;
+  var render = (0, _react.useCallback)(function (_ref2) {
+    var field = _ref2.field,
+      error = _ref2.fieldState.error;
+    var handleChange = function handleChange(value, option) {
+      field.onChange(value);
+      if (onChange) {
+        onChange(value, option);
+      }
+    };
+    return /*#__PURE__*/_react["default"].createElement(_index.Autocomplete, _extends({}, other, {
+      onBlur: field.onBlur,
+      onChange: handleChange,
+      value: field.value || '',
+      hasError: !!error
+    }));
+  }, [onChange, other]);
+  return /*#__PURE__*/_react["default"].createElement(_reactHookForm.Controller, {
+    name: name,
+    control: control,
+    render: render
+  });
+};

package/dist/components/formFields/RHFAutocomplete/index.stories.d.ts

@@ -0,0 +1,5 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { RHFAutocomplete, TProps } from '.';
+declare const meta: Meta<typeof RHFAutocomplete>;
+export default meta;
+export declare const Default: StoryObj<TProps>;

package/dist/components/formFields/RHFAutocomplete/index.stories.js

@@ -0,0 +1,40 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.Default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _ = require(".");
+var _selectOptions = require("../../_helpers/selectOptions");
+var _StoryOneFieldForm = require("../../_helpers/StoryOneFieldForm");
+var _yup = require("@hookform/resolvers/yup");
+var yup = _interopRequireWildcard(require("yup"));
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+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; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+var meta = {
+  title: 'formFields/RHFAutocomplete',
+  component: _.RHFAutocomplete,
+  tags: ['autodocs']
+};
+var _default = exports["default"] = meta;
+var Default = exports.Default = {
+  args: {
+    label: 'Label',
+    options: _selectOptions.selectOptions
+  },
+  render: function render(props) {
+    return /*#__PURE__*/_react["default"].createElement(_StoryOneFieldForm.StoryOneFieldForm, {
+      initialValue: "",
+      resolver: (0, _yup.yupResolver)(yup.object().shape(_defineProperty({}, _StoryOneFieldForm.FIELD_NAME, yup.string().required())))
+    }, /*#__PURE__*/_react["default"].createElement(_.RHFAutocomplete, _extends({}, props, {
+      name: _StoryOneFieldForm.FIELD_NAME
+    })));
+  }
+};

package/dist/components/formFields/RHFTextInput/index.d.ts

@@ -0,0 +1,6 @@
+import { FC } from 'react';
+import { TTextInputProps } from '../../../index';
+export type TProps = Omit<TTextInputProps, 'onChange' | 'value' | 'hasError' | 'onBlur' | 'onFocus'> & {
+    name: string;
+};
+export declare const RHFTextInput: FC<TProps>;

package/dist/components/formFields/RHFTextInput/index.js

@@ -0,0 +1,37 @@
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.RHFTextInput = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _reactHookForm = require("react-hook-form");
+var _index = require("../../../index");
+var _excluded = ["name"];
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+var RHFTextInput = exports.RHFTextInput = function RHFTextInput(_ref) {
+  var name = _ref.name,
+    other = _objectWithoutProperties(_ref, _excluded);
+  var _useFormContext = (0, _reactHookForm.useFormContext)(),
+    control = _useFormContext.control;
+  var render = (0, _react.useCallback)(function (_ref2) {
+    var field = _ref2.field,
+      error = _ref2.fieldState.error;
+    return /*#__PURE__*/_react["default"].createElement(_index.TextInput, _extends({}, other, {
+      onChange: field.onChange,
+      onBlur: field.onBlur,
+      value: field.value || '',
+      hasError: !!error
+    }));
+  }, [other]);
+  return /*#__PURE__*/_react["default"].createElement(_reactHookForm.Controller, {
+    name: name,
+    control: control,
+    render: render
+  });
+};

package/dist/components/formFields/RHFTextInput/index.stories.d.ts

@@ -0,0 +1,5 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { RHFTextInput, TProps } from '.';
+declare const meta: Meta<typeof RHFTextInput>;
+export default meta;
+export declare const Default: StoryObj<TProps>;

package/dist/components/formFields/RHFTextInput/index.stories.js

@@ -0,0 +1,38 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.Default = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _ = require(".");
+var _StoryOneFieldForm = require("../../_helpers/StoryOneFieldForm");
+var _yup = require("@hookform/resolvers/yup");
+var yup = _interopRequireWildcard(require("yup"));
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+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; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+var meta = {
+  title: 'formFields/RHFTextInput',
+  component: _.RHFTextInput,
+  tags: ['autodocs']
+};
+var _default = exports["default"] = meta;
+var Default = exports.Default = {
+  args: {
+    label: 'Label'
+  },
+  render: function render(props) {
+    return /*#__PURE__*/_react["default"].createElement(_StoryOneFieldForm.StoryOneFieldForm, {
+      initialValue: "",
+      resolver: (0, _yup.yupResolver)(yup.object().shape(_defineProperty({}, _StoryOneFieldForm.FIELD_NAME, yup.string().required())))
+    }, /*#__PURE__*/_react["default"].createElement(_.RHFTextInput, _extends({}, props, {
+      name: _StoryOneFieldForm.FIELD_NAME
+    })));
+  }
+};

package/dist/index.d.ts

@@ -39,6 +39,9 @@ export { AppCardLink } from './components/common/AppCardLink';
 export { InvoiceboxLogo } from './components/common/InvoiceboxLogo';
 export type { TProps as TAutocompleteProps } from './components/form/Autocomplete/index';
 export { Autocomplete, AutocompleteDefaultOption, OrganizationAutocompleteItem, } from './components/form/Autocomplete/index';
+export { Portal } from './components/common/Portal';
+export { RHFTextInput } from './components/formFields/RHFTextInput';
+export { RHFAutocomplete } from './components/formFields/RHFAutocomplete';
 export { PaletteProvider, defaultAbstractPalette } from './palette';
 export type { TAbstractPalette } from './palette';
 export { useOutsideClick } from './hooks/useOutsideClick';

package/dist/index.js

@@ -117,6 +117,12 @@ Object.defineProperty(exports, "PhoneInput", {
     return _PhoneInput.PhoneInput;
   }
 });
+Object.defineProperty(exports, "Portal", {
+  enumerable: true,
+  get: function get() {
+    return _Portal.Portal;
+  }
+});
 Object.defineProperty(exports, "PositiveIntegerInput", {
   enumerable: true,
   get: function get() {
@@ -129,6 +135,18 @@ Object.defineProperty(exports, "PureInput", {
     return _PureInput.PureInput;
   }
 });
+Object.defineProperty(exports, "RHFAutocomplete", {
+  enumerable: true,
+  get: function get() {
+    return _RHFAutocomplete.RHFAutocomplete;
+  }
+});
+Object.defineProperty(exports, "RHFTextInput", {
+  enumerable: true,
+  get: function get() {
+    return _RHFTextInput.RHFTextInput;
+  }
+});
 Object.defineProperty(exports, "Scrollbar", {
   enumerable: true,
   get: function get() {
@@ -277,13 +295,18 @@ var _PaymentCard = require("./components/payment/PaymentCard");
 var _AppCardLink = require("./components/common/AppCardLink");
 var _InvoiceboxLogo = require("./components/common/InvoiceboxLogo");
 var _index = require("./components/form/Autocomplete/index");
+var _Portal = require("./components/common/Portal");
+var _RHFTextInput = require("./components/formFields/RHFTextInput");
+var _RHFAutocomplete = require("./components/formFields/RHFAutocomplete");
 var _palette = require("./palette");
 var _useOutsideClick = require("./hooks/useOutsideClick");
 var _useInputFocus = require("./hooks/useInputFocus");
 var _useUnupdatableHandler = require("./hooks/useUnupdatableHandler");
 var _breakpoints = require("./breakpoints");
 var _useMedia = require("./hooks/useMedia");
+// eslint-disable-next-line @typescript-eslint/no-var-requires,no-undef
 var fromEntries = require('object.fromentries');
+// eslint-disable-next-line @typescript-eslint/no-var-requires,no-undef
 var entries = require('object.entries');
 fromEntries.shim();
 entries.shim();

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@invoicebox/ui",
-    "version": "0.1.0-alpha.114",
+    "version": "0.1.0-alpha.115",
     "description": "Invoicebox UI",
     "license": "Apache License 2.0",
     "scripts": {
@@ -22,6 +22,8 @@
         "@babel/preset-env": "^7.23.9",
         "@babel/preset-react": "^7.23.3",
         "@babel/preset-typescript": "^7.23.3",
+        "@hookform/devtools": "^4.3.0",
+        "@hookform/resolvers": "^2.9.7",
         "@storybook/addon-essentials": "^7.6.13",
         "@storybook/addon-interactions": "^7.6.13",
         "@storybook/addon-links": "^7.6.13",
@@ -30,6 +32,7 @@
         "@storybook/react": "^7.6.13",
         "@storybook/react-webpack5": "^7.6.13",
         "@storybook/test": "^7.6.13",
+        "@types/react-dom": "^17.0.2",
         "@typescript-eslint/eslint-plugin": "^5.62.0",
         "@typescript-eslint/parser": "^5.62.0",
         "babel-plugin-inline-json-import": "^0.3.2",
@@ -46,7 +49,8 @@
         "storybook": "^7.6.13",
         "styled-components": "^6.1.8",
         "typescript": "^4.9.5",
-        "webpack": "^5.90.1"
+        "webpack": "^5.90.1",
+        "yup": "^0.32.11"
     },
     "dependencies": {
         "@mona-health/react-input-mask": "^3.0.3",
@@ -55,6 +59,7 @@
         "object.entries": "^1.1.8",
         "object.fromentries": "^2.0.8",
         "react-calendar": "^4.8.0",
+        "react-hook-form": "^7.34.0",
         "react-responsive": "^9.0.2",
         "react-scrollbars-custom": "^4.1.1",
         "react-toastify": "^9.1.3"