@app-studio/web 0.8.20 → 0.8.22

package/dist/components/Layout/Center/Center.d.ts

@@ -1,3 +1,4 @@
 import React from 'react';
-import { CenterProps } from './Center/Center.props';
-export declare const Center: React.FC<CenterProps>;
+import { CenterProps } from './Center.props';
+declare const Center: React.ForwardRefExoticComponent<Pick<CenterProps, string | number> & React.RefAttributes<HTMLElement>>;
+export { Center };

package/dist/components/Layout/Center/{Center/Center.props.d.ts → Center.props.d.ts}

@@ -1,3 +1,3 @@
-import { ViewProps } from '../../View/View';
+import { ViewProps } from '../View/View';
 export interface CenterProps extends ViewProps {
 }

package/dist/components/Layout/Horizontal/Horizontal.d.ts

@@ -1,3 +1,4 @@
 import React from 'react';
-import { HorizontalProps } from './Horizontal/Horizontal.props';
-export declare const Horizontal: React.FC<HorizontalProps>;
+import { HorizontalProps } from './Horizontal.props';
+declare const Horizontal: React.ForwardRefExoticComponent<Pick<HorizontalProps, string | number> & React.RefAttributes<HTMLElement>>;
+export { Horizontal };

package/dist/components/Layout/Vertical/Vertical.d.ts

@@ -1,3 +1,4 @@
 import React from 'react';
-import { VerticalProps } from './Vertical/Vertical.props';
-export declare const Vertical: React.FC<VerticalProps>;
+import { VerticalProps } from './Vertical.props';
+declare const Vertical: React.ForwardRefExoticComponent<Pick<VerticalProps, string | number> & React.RefAttributes<HTMLElement>>;
+export { Vertical };

package/dist/web.cjs.development.js

@@ -16,11 +16,9 @@ var reactRouterDom = require('react-router-dom');
 require('core-js/modules/es.array.includes.js');
 require('core-js/modules/es.string.includes.js');
 require('core-js/modules/es.string.starts-with.js');
-var Icon$1 = require('src/components/Icon/Icon');
 var format = _interopDefault(require('date-fns/format'));
 var formik = require('formik');
 var zustand = require('zustand');
-var Layout = require('src/components/Layout');
 
 var Top = props => (/*#__PURE__*/React__default.createElement(appStudio.View, Object.assign({
   marginBottom: "auto"
@@ -173,7 +171,7 @@ var TextComponent = props => {
 var Text = TextComponent;
 
 var _excluded$1 = ["justifyContent", "isReversed"];
-var VerticalView = /*#__PURE__*/React__default.forwardRef((_ref, ref) => {
+var Vertical = /*#__PURE__*/React__default.forwardRef((_ref, ref) => {
   var {
       // Sets a default alignment for content within the Vertical container to 'flex-start'
       justifyContent = 'flex-start',
@@ -189,12 +187,10 @@ var VerticalView = /*#__PURE__*/React__default.forwardRef((_ref, ref) => {
     ref: ref
   }));
 });
-VerticalView.displayName = 'VerticalView';
-
-var Vertical = props => (/*#__PURE__*/React__default.createElement(VerticalView, Object.assign({}, props)));
+Vertical.displayName = 'Vertical';
 
 var _excluded$2 = ["justifyContent", "isReversed"];
-var HorizontalView = /*#__PURE__*/React__default.forwardRef((_ref, ref) => {
+var Horizontal = /*#__PURE__*/React__default.forwardRef((_ref, ref) => {
   var {
       // Sets a default alignment for content within the Horizontal container to 'flex-start'
       justifyContent = 'flex-start',
@@ -210,12 +206,10 @@ var HorizontalView = /*#__PURE__*/React__default.forwardRef((_ref, ref) => {
     ref: ref
   }));
 });
-HorizontalView.displayName = 'Horizontal';
-
-var Horizontal = props => (/*#__PURE__*/React__default.createElement(HorizontalView, Object.assign({}, props)));
+Horizontal.displayName = 'Horizontal';
 
 var _excluded$3 = ["isReversed"];
-var CenterView = /*#__PURE__*/React__default.forwardRef((_ref, ref) => {
+var Center = /*#__PURE__*/React__default.forwardRef((_ref, ref) => {
   var props = _objectWithoutPropertiesLoose(_ref, _excluded$3);
   return /*#__PURE__*/React__default.createElement(appStudio.View, Object.assign({
     display: "flex",
@@ -225,9 +219,7 @@ var CenterView = /*#__PURE__*/React__default.forwardRef((_ref, ref) => {
     ref: ref
   }));
 });
-CenterView.displayName = 'Center';
-
-var Center = props => (/*#__PURE__*/React__default.createElement(CenterView, Object.assign({}, props)));
+Center.displayName = 'Center';
 
 var _excluded$4 = ["size", "color"],
   _excluded2 = ["size", "color"],
@@ -5297,12 +5289,12 @@ var CountryPickerView = _ref5 => {
   }, fieldStyles, props, {
     value: value,
     onChange: handleChange
-  }))), /*#__PURE__*/React__default.createElement(FieldIcons, null, hide ? (/*#__PURE__*/React__default.createElement(Icon$1.ChevronIcon, {
+  }))), /*#__PURE__*/React__default.createElement(FieldIcons, null, hide ? (/*#__PURE__*/React__default.createElement(ChevronIcon, {
     orientation: "down",
     size: IconSizes$4[size],
     color: IconColor,
     style: styles['icon']
-  })) : (/*#__PURE__*/React__default.createElement(Icon$1.ChevronIcon, {
+  })) : (/*#__PURE__*/React__default.createElement(ChevronIcon, {
     orientation: "up",
     size: IconSizes$4[size],
     color: IconColor,
@@ -5635,7 +5627,7 @@ var ComboBoxView = _ref => {
     onChange: value => handleSearch(value),
     hint: placeholder,
     isClearable: false,
-    leftChild: /*#__PURE__*/React__default.createElement(Icon$1.SearchIcon, {
+    leftChild: /*#__PURE__*/React__default.createElement(SearchIcon, {
       size: 12
     }),
     styles: {
@@ -5657,7 +5649,7 @@ var ComboBoxView = _ref => {
     backgroundColor: index === highlightedIndex ? 'color.gray.100' : 'transparent',
     onMouseEnter: () => setHighlightedIndex(index),
     onClick: () => handleSelect(item)
-  }, styles == null ? void 0 : styles.item), /*#__PURE__*/React__default.createElement(Text, null, item.label), /*#__PURE__*/React__default.createElement(React__default.Fragment, null, item.icon && item.icon, item.value === selectedItem.value && showTick && !item.icon && /*#__PURE__*/React__default.createElement(Icon$1.TickIcon, {
+  }, styles == null ? void 0 : styles.item), /*#__PURE__*/React__default.createElement(Text, null, item.label), /*#__PURE__*/React__default.createElement(React__default.Fragment, null, item.icon && item.icon, item.value === selectedItem.value && showTick && !item.icon && /*#__PURE__*/React__default.createElement(TickIcon, {
     size: 20
   }))))))))))));
 };
@@ -6667,7 +6659,7 @@ var TabsView = props => {
     // Returns a boolean indicating if the given tab is identical to the first tab in 'tabsState'.
     return tab.value === tabsState[0].value;
   };
-  return /*#__PURE__*/React__default.createElement(Layout.Vertical, Object.assign({
+  return /*#__PURE__*/React__default.createElement(Vertical, Object.assign({
     width: "100w",
     height: '100%'
   }, styles == null ? void 0 : styles.container), /*#__PURE__*/React__default.createElement(Horizontal, Object.assign({