@app-studio/web 0.3.11 → 0.3.12

package/dist/components/Form/Form.d.ts

@@ -0,0 +1,17 @@
+import React, { PureComponent } from 'react';
+export * from './Checkbox/Checkbox';
+export * from './DatePicker/DatePicker';
+export * from './Label/Label';
+export * from './CountryPicker/CountryPicker';
+export * from './Select/Select';
+export * from './Switch/Switch';
+export * from './TextArea/TextArea';
+export * from './TextField/TextField';
+export * from './Password/Password';
+import type { FieldProps } from 'formik';
+import { FormProps } from 'app-studio';
+export declare function Form(props: FormProps): React.JSX.Element;
+declare class FormContainer extends PureComponent<FieldProps> {
+    render(): React.JSX.Element;
+}
+export default FormContainer;

package/dist/components/Form/FormField.d.ts

@@ -0,0 +1,10 @@
+import * as React from 'react';
+export declare type FormItemProps = {
+    children: React.ReactNode;
+} & {
+    name: string;
+    label?: string;
+    type?: string;
+    labelProps: any;
+};
+export declare const FormField: ({ name, children, label, labelProps, ...restProps }: FormItemProps) => React.JSX.Element;

package/dist/components/Form/TextField/TextField/TextField.props.d.ts

@@ -10,7 +10,7 @@ export interface TextFieldProps {
     /**
      * Specifies whether the input field should display an error state.
      */
-    error?: boolean;
+    error?: any;
     /**
      * Provides additional information about the input field.
      */

package/dist/utils/form.d.ts

@@ -0,0 +1,10 @@
+import type { FormikProps, FormikValues } from 'formik';
+export declare const getForm: () => FormikProps<FormikValues>;
+export declare const setForm: (newForm: FormikProps<FormikValues>) => void;
+export interface InputFormProps {
+    name: string;
+    label?: string;
+    rightIcon?: any;
+    leftIcon?: any;
+    labelProps?: any;
+}

package/dist/web.cjs.development.js

@@ -2476,21 +2476,19 @@ var TextComponent = function TextComponent(props) {
  */
 var Text = TextComponent;
 
-var _excluded$e = ["children", "styles", "error"];
+var _excluded$e = ["children", "styles"];
 var HelperText = function HelperText(_ref) {
   var children = _ref.children,
     _ref$styles = _ref.styles,
     styles = _ref$styles === void 0 ? {
       helperText: {}
     } : _ref$styles,
-    _ref$error = _ref.error,
-    error = _ref$error === void 0 ? false : _ref$error,
     props = _objectWithoutPropertiesLoose(_ref, _excluded$e);
   return React__default.createElement(Text, Object.assign({
     size: "xs",
     marginVertical: 0,
     marginHorizontal: 0,
-    color: error ? 'theme.error' : 'theme.text.dark'
+    color: 'theme.text.dark'
   }, styles['helperText'], props), children);
 };
 
@@ -2505,9 +2503,12 @@ var FieldContainer = function FieldContainer(_ref) {
   return React__default.createElement(Vertical, Object.assign({
     gap: 5,
     position: "relative"
-  }, props), children, helperText && React__default.createElement(HelperText, Object.assign({
-    error: error
-  }, styles), helperText));
+  }, props), children, !error && helperText && React__default.createElement(HelperText, Object.assign({}, styles), helperText), error && React__default.createElement(Text, {
+    size: "xs",
+    marginVertical: 0,
+    marginHorizontal: 0,
+    color: 'theme.error'
+  }, error));
 };
 
 var Shapes = {
@@ -2598,7 +2599,7 @@ var FieldContent = function FieldContent(_ref) {
     borderStyle: "solid",
     alignItems: "center",
     borderColor: color,
-    backgroundColor: "trueGray.50",
+    backgroundColor: "color.trueGray.50",
     transition: "padding 0.2s ease",
     justifyContent: "space-between",
     fontSize: appStudio.Typography.fontSizes[size],
@@ -3023,7 +3024,7 @@ var DatePickerView = function DatePickerView(_ref) {
     },
     fontSize: appStudio.Typography.fontSizes[size],
     backgroundColor: 'transparent',
-    color: isDisabled ? 'trueGray.600' : 'blueGray.700',
+    color: isDisabled ? 'color.trueGray.600' : 'color.blueGray.700',
     cursor: isDisabled ? 'not-allowed' : isReadOnly ? 'auto' : 'pointer'
   }, styles['field']);
   return React__default.createElement(FieldContainer, {
@@ -3431,7 +3432,7 @@ var SelectBox = function SelectBox(_ref2) {
     paddingHorizontal: 0,
     fontSize: appStudio.Typography.fontSizes[size],
     backgroundColor: 'transparent',
-    color: isDisabled ? 'trueGray.600' : 'blueGray.700',
+    color: isDisabled ? 'color.trueGray.600' : 'color.blueGray.700',
     cursor: isDisabled ? 'not-allowed' : 'auto'
   }, styles['field'], styles['text']);
   return React__default.createElement(Text, Object.assign({}, fieldStyles), (selected === '' || selected && selected.length === 0) && !!placeholder ? placeholder : React__default.createElement(React__default.Fragment, null, typeof selected === 'string' ? selected : selected && selected.length > 0 && React__default.createElement(Horizontal, {
@@ -3549,7 +3550,7 @@ var MultiSelect = function MultiSelect(_ref5) {
     borderRadius: 4,
     alignItems: "center",
     fontSize: appStudio.Typography.fontSizes[size],
-    backgroundColor: "trueGray.300",
+    backgroundColor: "color.trueGray.300",
     onClick: function onClick(event) {
       return event.stopPropagation();
     }
@@ -4046,7 +4047,7 @@ var TextAreaView = function TextAreaView(_ref) {
     },
     fontSize: appStudio.Typography.fontSizes[size],
     backgroundColor: 'transparent',
-    color: isDisabled ? 'trueGray.600' : 'blueGray.700',
+    color: isDisabled ? 'color.trueGray.600' : 'color.blueGray.700',
     cursor: isDisabled ? 'not-allowed' : 'auto'
   }, styles['field']);
   var handleHover = function handleHover() {