@tecsinapse/cortex-react 1.3.0-beta.25 → 1.3.0-beta.27

package/dist/esm/components/Tooltip.js

@@ -1,5 +1,5 @@
 import { FloatingArrow } from '@floating-ui/react';
-import React, { forwardRef, useRef } from 'react';
+import React__default, { forwardRef, useRef } from 'react';
 import '@internationalized/date';
 import 'react-aria';
 import 'react-stately';
@@ -27,7 +27,7 @@ const Tooltip = forwardRef(
       context,
       floatingStyles
     } = useFloatingLogic({ placement, arrowRef, trigger });
-    return /* @__PURE__ */ React.createElement(React.Fragment, null, cloneWithProps(children, triggerProps), isOpen ? /* @__PURE__ */ React.createElement(
+    return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, cloneWithProps(children, triggerProps), isOpen ? /* @__PURE__ */ React__default.createElement(
       "div",
       {
         ref: ref || refs.setFloating,
@@ -42,8 +42,8 @@ const Tooltip = forwardRef(
         }
       },
       text,
-      /* @__PURE__ */ React.createElement(FloatingArrow, { ref: arrowRef, context, fill: "black" })
-    ) : /* @__PURE__ */ React.createElement(React.Fragment, null));
+      /* @__PURE__ */ React__default.createElement(FloatingArrow, { ref: arrowRef, context, fill: "black" })
+    ) : /* @__PURE__ */ React__default.createElement(React__default.Fragment, null));
   }
 );
 

package/dist/esm/components/utils.js

@@ -1,5 +1,5 @@
 import { CalendarDate, getLocalTimeZone } from '@internationalized/date';
-import React from 'react';
+import React__default from 'react';
 
 const getNameInitials = (name) => {
   const nameSplit = name.split(" ");
@@ -20,7 +20,7 @@ const calendarDateToDate = (value) => {
   return value.toDate(getLocalTimeZone());
 };
 function cloneWithProps(children, triggerProps) {
-  return React.cloneElement(/* @__PURE__ */ React.createElement("div", null, children), triggerProps);
+  return React__default.cloneElement(/* @__PURE__ */ React__default.createElement("div", null, children), triggerProps);
 }
 
 export { calendarDateToDate, cloneWithProps, dateToCalendarDate, getNameInitials };

package/dist/esm/hooks/useSelectGroupedOptions.js

@@ -0,0 +1,33 @@
+import { useState, useEffect } from 'react';
+
+const useSelectGroupedOptions = ({
+  options: _options
+}) => {
+  const [options, setOptions] = useState();
+  const [isLoading, setIsLoading] = useState();
+  const [error, setError] = useState();
+  const initData = async (fetch) => {
+    setIsLoading(true);
+    try {
+      const result = await fetch();
+      if (result) {
+        setOptions(result ?? []);
+      }
+    } catch (e) {
+      setError(String(e));
+    } finally {
+      setIsLoading(false);
+    }
+  };
+  useEffect(() => {
+    if (typeof _options === "function") initData(_options);
+    else setOptions(_options);
+  }, [_options]);
+  return {
+    isLoading,
+    options,
+    error
+  };
+};
+
+export { useSelectGroupedOptions };

package/dist/esm/hooks/useSelectOptions.js

@@ -0,0 +1,33 @@
+import { useState, useCallback, useEffect } from 'react';
+
+const useSelectOptions = ({
+  options: _options
+}) => {
+  const [options, setOptions] = useState();
+  const [isLoading, setIsLoading] = useState();
+  const [error, setError] = useState();
+  const initData = useCallback(async (fetch) => {
+    setIsLoading(true);
+    try {
+      const result = await fetch();
+      if (result) {
+        setOptions(result ?? []);
+      }
+    } catch (e) {
+      setError(String(e));
+    } finally {
+      setIsLoading(false);
+    }
+  }, []);
+  useEffect(() => {
+    if (typeof _options === "function") initData(_options);
+    else setOptions(_options);
+  }, [_options]);
+  return {
+    isLoading,
+    options,
+    error
+  };
+};
+
+export { useSelectOptions };

package/dist/esm/hooks/useTimeField.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React__default from 'react';
 import { useLocale, useTimeField as useTimeField$1 } from 'react-aria';
 import { useTimeFieldState } from 'react-stately';
 import { Time } from '@internationalized/date';
@@ -11,7 +11,7 @@ const useTimeField = (props) => {
     onChange: (timeValue) => onChange({ hour: timeValue.hour, minute: timeValue.minute }),
     locale
   });
-  const ref = React.useRef(null);
+  const ref = React__default.useRef(null);
   const { fieldProps } = useTimeField$1(
     {
       "aria-label": "time-field",

package/dist/esm/index.js

@@ -27,7 +27,7 @@ export { BaseSnackbar } from './components/Snackbar/BaseSnackbar.js';
 export { DefaultSnack } from './components/Snackbar/DefaultSnack.js';
 export { TCell, TFoot, THead, THeadCell, TRow, TRowHeader, Table, Td } from './components/Table.js';
 export { Tag } from './components/Tag.js';
-export { TextArea } from './components/TextArea.js';
+export { TextArea } from './components/TextArea/index.js';
 export { TimeField } from './components/TimeField/TimeField.js';
 export { TimeFieldInput } from './components/TimeField/TimeFieldInput.js';
 export { Toggle } from './components/Toggle.js';
@@ -38,9 +38,12 @@ export { useCalendarGrid } from './hooks/useCalendarGrid.js';
 export { useDatePickerInput } from './hooks/useDatePickerInput.js';
 export { useDateRangePickerInput } from './hooks/useDateRangePickerInput.js';
 export { useDebouncedState } from './hooks/useDebouncedState.js';
+export { useFloatingLogic } from './hooks/useFloatingLogic.js';
 export { useOutsideClickListener } from './hooks/useOutsideClickListener.js';
 export { useRangeCalendar } from './hooks/useRangeCalendar.js';
-export { useFloatingLogic } from './hooks/useFloatingLogic.js';
+export { useSelectGroupedOptions } from './hooks/useSelectGroupedOptions.js';
+export { useSelectOptions } from './hooks/useSelectOptions.js';
 export { SnackbarSonner } from './service/SnackbarSonner.js';
 export { MenubarProvider, useMenubar } from './provider/MenubarProvider.js';
 export { SnackbarProvider, useSnackbar } from './provider/SnackbarProvider.js';
+export { CurrencyIMask, ExpressionMasks, NumberIMask, PercentageIMask } from './components/Input/masks.js';

package/dist/esm/provider/MenubarProvider.js

@@ -1,12 +1,12 @@
-import React, { createContext, useContext } from 'react';
+import React__default, { createContext, useContext } from 'react';
 
 const MenubarContext = createContext({
   show: false,
   setShow: () => void 0
 });
 const MenubarProvider = ({ children }) => {
-  const [show, setShow] = React.useState(false);
-  return /* @__PURE__ */ React.createElement(MenubarContext.Provider, { value: { show, setShow } }, children);
+  const [show, setShow] = React__default.useState(false);
+  return /* @__PURE__ */ React__default.createElement(MenubarContext.Provider, { value: { show, setShow } }, children);
 };
 const useMenubar = () => {
   const context = useContext(MenubarContext);

package/dist/esm/provider/SnackbarProvider.js

@@ -1,11 +1,11 @@
-import React, { createContext, useContext } from 'react';
+import React__default, { createContext, useContext } from 'react';
 import { SnackbarSonner } from '../service/SnackbarSonner.js';
 import { Toaster } from 'sonner';
 
 const SnackbarContext = createContext(null);
 const SnackbarProvider = ({ children }) => {
   const snackbar = new SnackbarSonner();
-  return /* @__PURE__ */ React.createElement(SnackbarContext.Provider, { value: { snackbar } }, children, /* @__PURE__ */ React.createElement(Toaster, null));
+  return /* @__PURE__ */ React__default.createElement(SnackbarContext.Provider, { value: { snackbar } }, children, /* @__PURE__ */ React__default.createElement(Toaster, null));
 };
 const useSnackbar = () => {
   const context = useContext(SnackbarContext);

package/dist/esm/service/SnackbarSonner.js

@@ -1,5 +1,5 @@
 import { toast } from 'sonner';
-import React from 'react';
+import React__default from 'react';
 import 'clsx';
 import '@internationalized/date';
 import '../components/Badge.js';
@@ -48,7 +48,11 @@ import '../components/Select/Trigger.js';
 import '../components/Snackbar/BaseSnackbar.js';
 import { DefaultSnack } from '../components/Snackbar/DefaultSnack.js';
 import '../components/Tag.js';
-import '../components/TextArea.js';
+import '../components/TextArea/Box.js';
+import '../components/TextArea/Face.js';
+import '../components/TextArea/Left.js';
+import '../components/TextArea/Right.js';
+import '../components/TextArea/Root.js';
 import '../components/Toggle.js';
 import '../components/Tooltip.js';
 
@@ -62,7 +66,7 @@ class SnackbarSonner {
   show(type, message, options) {
     return toast.custom(
       (t) => {
-        return /* @__PURE__ */ React.createElement(
+        return /* @__PURE__ */ React__default.createElement(
           DefaultSnack,
           {
             text: message,

package/dist/types/components/Badge.d.ts

@@ -1,12 +1,11 @@
 import { BadgeVariants } from '@tecsinapse/cortex-core';
-import React from 'react';
-interface BadgeProps {
+import * as React from 'react';
+export interface BadgeProps {
     value: string | number;
     variants?: BadgeVariants;
 }
-interface BadgeAnchorProps extends BadgeProps {
-    children: JSX.Element;
+export interface BadgeAnchorProps extends BadgeProps {
+    children: React.ReactNode;
 }
 export declare const Badge: React.ForwardRefExoticComponent<Omit<BadgeProps & Omit<React.HTMLProps<HTMLDivElement>, "className">, "ref"> & React.RefAttributes<HTMLDivElement>>;
 export declare const BadgeAnchor: React.ForwardRefExoticComponent<Omit<BadgeAnchorProps & Omit<React.HTMLProps<HTMLDivElement>, "className">, "ref"> & React.RefAttributes<HTMLDivElement>>;
-export {};

package/dist/types/components/Input/Mask.d.ts

@@ -1,5 +1,3 @@
 import React from 'react';
-import { InputMaskExpressionProps, InputMaskProps } from './types';
-export declare const InputMaskExpression: React.ForwardRefExoticComponent<InputMaskExpressionProps & React.RefAttributes<HTMLInputElement>>;
-export declare const InputMaskNumber: React.ForwardRefExoticComponent<InputMaskProps & React.RefAttributes<HTMLInputElement>>;
-export declare const InputMaskCurrency: React.ForwardRefExoticComponent<InputMaskProps & React.RefAttributes<HTMLInputElement>>;
+import { InputMaskProps } from './types';
+export declare const InputMask: React.ForwardRefExoticComponent<InputMaskProps & React.RefAttributes<HTMLInputElement>>;

package/dist/types/components/Input/index.d.ts

@@ -5,8 +5,7 @@ export declare const Input: {
     Left: import("react").ForwardRefExoticComponent<import("./types").InputLeftProps & import("react").RefAttributes<HTMLDivElement>>;
     Right: import("react").ForwardRefExoticComponent<import("./types").InputRightProps & import("react").RefAttributes<HTMLDivElement>>;
     Search: import("react").ForwardRefExoticComponent<import("./types").InputSearchProps & import("react").RefAttributes<HTMLInputElement>>;
-    MaskCurrency: import("react").ForwardRefExoticComponent<import("./types").InputMaskProps & import("react").RefAttributes<HTMLInputElement>>;
-    MaskNumber: import("react").ForwardRefExoticComponent<import("./types").InputMaskProps & import("react").RefAttributes<HTMLInputElement>>;
-    MaskExpression: import("react").ForwardRefExoticComponent<import("./types").InputMaskExpressionProps & import("react").RefAttributes<HTMLInputElement>>;
+    Mask: import("react").ForwardRefExoticComponent<import("./types").InputMaskProps & import("react").RefAttributes<HTMLInputElement>>;
 };
+export * from './masks';
 export * from './types';

package/dist/types/components/Input/masks.d.ts

@@ -0,0 +1,39 @@
+export declare const ExpressionMasks: {
+    CPF: string;
+    CNPJ: string;
+    PHONE: string;
+    PHONE_EXTENDED: string;
+    DATE: string;
+    CEP: string;
+};
+export declare const NumberIMask: {
+    mask: NumberConstructor;
+    scale: number;
+};
+export declare const CurrencyIMask: {
+    mask: string;
+    blocks: {
+        num: {
+            mask: NumberConstructor;
+            scale: number;
+            thousandsSeparator: string;
+            padFractionalZeros: boolean;
+            radix: string;
+            mapToRadix: string[];
+        };
+    };
+};
+export declare const PercentageIMask: {
+    mask: string;
+    lazy: boolean;
+    blocks: {
+        num: {
+            mask: NumberConstructor;
+            scale: number;
+            thousandsSeparator: string;
+            padFractionalZeros: boolean;
+            radix: string;
+            mapToRadix: string[];
+        };
+    };
+};

package/dist/types/components/Input/types.d.ts

@@ -1,5 +1,4 @@
 import { InputBaseVariants } from '@tecsinapse/cortex-core';
-import { MutableRefObject } from 'react';
 export interface InputPropsBase {
     variants?: InputBaseVariants;
     label?: string;
@@ -19,9 +18,17 @@ export interface InputRightProps extends React.HTMLAttributes<HTMLDivElement> {
 export interface InputSearchProps extends InputProps {
     bounceTimeout?: number;
 }
-export interface InputMaskProps extends InputProps {
-    unmaskedRef?: MutableRefObject<string>;
+export type InputMaskEvent = {
+    value: string;
+    unmaskedValue: string;
+};
+export interface Mask extends Record<string, any> {
+    mask: any;
+}
+export interface InputMaskProps extends Omit<InputProps, 'onChange'> {
+    onChange?: (e: InputMaskEvent) => void;
+    mask: Mask;
 }
 export interface InputMaskExpressionProps extends InputMaskProps {
-    mask: any;
+    mask: Mask;
 }

package/dist/types/components/Popover/Provider.d.ts

@@ -1,5 +1,5 @@
-import { ReactNode } from 'react';
 import { Placement } from '@floating-ui/react';
+import { ReactNode } from 'react';
 export interface PopoverProviderProps {
     children: ReactNode;
     placement?: Placement;

package/dist/types/components/Select/SkeletonOptions.d.ts

@@ -0,0 +1 @@
+export declare const SkeletonOptions: () => JSX.Element;

package/dist/types/components/Select/types.d.ts

@@ -4,7 +4,7 @@ export interface ContentProps {
 }
 export interface SelectGroupedOptionsProps<T> {
     onSelect: (value: T) => void;
-    options?: Map<string, T[]>;
+    options?: Map<string, T[]> | (() => Promise<Map<string, T[]>>);
     groupedLabelExtractor: (value: string) => string;
 }
 export interface SelectMultiCheckAllOptionsProps {
@@ -12,7 +12,7 @@ export interface SelectMultiCheckAllOptionsProps {
 }
 export interface SelectMultiGroupedOptionsProps<T> {
     onSelect: (value: T[]) => void;
-    options?: Map<string, T[]>;
+    options?: Map<string, T[]> | (() => Promise<Map<string, T[]>>);
     groupedLabelExtractor: (value: string) => string;
     children?: React.ReactNode;
 }
@@ -22,7 +22,7 @@ export interface SelectMultiOptionProps<T> {
     grouped?: boolean;
 }
 export interface SelectMultiOptionsProps<T> {
-    options?: T[];
+    options?: T[] | (() => Promise<T[]>);
     onSelect: (value: T[]) => void;
     children?: React.ReactNode;
 }
@@ -32,7 +32,7 @@ export interface SelectOptionProps<T> {
     grouped?: boolean;
 }
 export interface SelectOptionsProps<T> {
-    options?: T[];
+    options?: T[] | (() => Promise<T[]>);
     onSelect: (value: T) => void;
 }
 export interface SelectPopoverProps {

package/dist/types/components/Skeleton.d.ts

@@ -1,4 +1,6 @@
-import React, { ReactNode } from 'react';
-export declare const Skeleton: ({ className, children, ...rest }: React.HTMLAttributes<HTMLDivElement> & {
-    children?: ReactNode;
-}) => JSX.Element;
+import React from 'react';
+interface SkeletonProps extends React.HTMLAttributes<HTMLDivElement> {
+    children?: React.ReactNode;
+}
+export declare const Skeleton: ({ className, children, ...rest }: SkeletonProps) => JSX.Element;
+export {};

package/dist/types/components/Snackbar/BaseSnackbar.d.ts

@@ -1,5 +1,5 @@
-import React, { ReactNode } from 'react';
 import { SnackbarVariants } from '@tecsinapse/cortex-core';
+import React, { ReactNode } from 'react';
 interface SnackbarProps {
     variants?: SnackbarVariants;
     children?: ReactNode;

package/dist/types/components/TextArea/Box.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { TextAreaProps } from './types';
+export declare const TextAreaBox: React.ForwardRefExoticComponent<TextAreaProps & React.RefAttributes<HTMLTextAreaElement>>;

package/dist/types/components/TextArea/Face.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { TextAreaFaceProps } from './types';
+export declare const TextAreaFace: React.ForwardRefExoticComponent<TextAreaFaceProps & React.RefAttributes<HTMLDivElement>>;

package/dist/types/components/TextArea/Left.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { TextAreaElementsProps } from './types';
+export declare const TextAreaLeft: React.ForwardRefExoticComponent<TextAreaElementsProps & React.RefAttributes<HTMLDivElement>>;

package/dist/types/components/TextArea/Right.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { TextAreaElementsProps } from './types';
+export declare const TextAreaRight: React.ForwardRefExoticComponent<TextAreaElementsProps & React.RefAttributes<HTMLDivElement>>;

package/dist/types/components/TextArea/Root.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { TextAreaProps } from './types';
+export declare const TextAreaRoot: React.ForwardRefExoticComponent<TextAreaProps & React.RefAttributes<HTMLTextAreaElement>>;

package/dist/types/components/TextArea/index.d.ts

@@ -0,0 +1,8 @@
+export declare const TextArea: {
+    Root: import("react").ForwardRefExoticComponent<import("./types").TextAreaProps & import("react").RefAttributes<HTMLTextAreaElement>>;
+    Face: import("react").ForwardRefExoticComponent<import("./types").TextAreaFaceProps & import("react").RefAttributes<HTMLDivElement>>;
+    Box: import("react").ForwardRefExoticComponent<import("./types").TextAreaProps & import("react").RefAttributes<HTMLTextAreaElement>>;
+    Left: import("react").ForwardRefExoticComponent<import("./types").TextAreaElementsProps & import("react").RefAttributes<HTMLDivElement>>;
+    Right: import("react").ForwardRefExoticComponent<import("./types").TextAreaElementsProps & import("react").RefAttributes<HTMLDivElement>>;
+};
+export * from './types';

package/dist/types/components/TextArea/types.d.ts

@@ -0,0 +1,15 @@
+import { InputBaseVariants } from '@tecsinapse/cortex-core';
+export type DivBaseProps = React.HTMLAttributes<HTMLDivElement>;
+export interface TextAreaElementsProps extends DivBaseProps {
+    children: React.ReactNode;
+    className?: string;
+}
+export interface TextAreaPropsBase {
+    variants?: InputBaseVariants;
+    label?: string;
+    rows?: number;
+}
+export interface TextAreaProps extends React.TextareaHTMLAttributes<HTMLTextAreaElement>, TextAreaPropsBase {
+}
+export interface TextAreaFaceProps extends DivBaseProps, Pick<TextAreaPropsBase, 'variants'> {
+}

package/dist/types/components/TextArea/utils.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const getValidChildren: (children: React.ReactNode) => React.ReactElement<any, string | React.JSXElementConstructor<any>>[];

package/dist/types/hooks/index.d.ts

@@ -4,6 +4,8 @@ export * from './useCalendarGrid';
 export * from './useDatePickerInput';
 export * from './useDateRangePickerInput';
 export * from './useDebouncedState';
+export * from './useFloatingLogic';
 export * from './useOutsideClickListener';
 export * from './useRangeCalendar';
-export * from './useFloatingLogic';
+export * from './useSelectGroupedOptions';
+export * from './useSelectOptions';

package/dist/types/hooks/useSelectGroupedOptions.d.ts

@@ -0,0 +1,9 @@
+interface useSelectGroupedOptionsProps<T> {
+    options?: Map<string, T[]> | (() => Promise<Map<string, T[]>>);
+}
+export declare const useSelectGroupedOptions: <T>({ options: _options, }: useSelectGroupedOptionsProps<T>) => {
+    isLoading: boolean | undefined;
+    options: Map<string, T[]> | undefined;
+    error: string | undefined;
+};
+export {};

package/dist/types/hooks/useSelectOptions.d.ts

@@ -0,0 +1,9 @@
+interface useSelectOptionsProps<T> {
+    options?: T[] | (() => Promise<T[]>);
+}
+export declare const useSelectOptions: <T>({ options: _options, }: useSelectOptionsProps<T>) => {
+    isLoading: boolean | undefined;
+    options: T[] | undefined;
+    error: string | undefined;
+};
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tecsinapse/cortex-react",
-  "version": "1.3.0-beta.25",
+  "version": "1.3.0-beta.27",
   "description": "React components based in @tecsinapse/cortex-core",
   "license": "MIT",
   "main": "dist/esm/index.js",
@@ -43,5 +43,5 @@
     "react-dom": ">=18.0.0",
     "tailwind": ">=3.3.0"
   },
-  "gitHead": "154d47f69ddd700160f54b381724ac02279a63aa"
+  "gitHead": "43a88a5a80a54451f5e2621363f7164927e5ef47"
 }

package/dist/cjs/components/TextArea.js

@@ -1,83 +0,0 @@
-'use strict';
-
-var cortexCore = require('@tecsinapse/cortex-core');
-var clsx = require('clsx');
-var React = require('react');
-
-const getValidChildren = (children) => {
-  return React.Children.toArray(children).filter(
-    (el) => React.isValidElement(el)
-  );
-};
-const Box = React.forwardRef(
-  ({ id, name, variants, label, placeholder, rows, className, ...rest }, ref) => {
-    return /* @__PURE__ */ React.createElement("div", { className: "flex w-full flex-col" }, /* @__PURE__ */ React.createElement(
-      "textarea",
-      {
-        "data-testid": "textarea-box",
-        ref,
-        id: id ?? name,
-        name,
-        placeholder: placeholder ?? " ",
-        className: clsx.clsx(
-          cortexCore.inputBox(placeholder, label, className),
-          "resize-none mt-mili"
-        ),
-        rows,
-        ...rest
-      }
-    ), /* @__PURE__ */ React.createElement(
-      "label",
-      {
-        htmlFor: id ?? name,
-        className: cortexCore.labelStyle({
-          intent: variants?.intent,
-          placeholder
-        })
-      },
-      label
-    ));
-  }
-);
-const Face = React.forwardRef(
-  ({ children, variants, className, ...rest }, ref) => {
-    const clones = getValidChildren(children).map((el) => {
-      return React.cloneElement(el, { ...el.props, variants });
-    });
-    return /* @__PURE__ */ React.createElement(
-      "div",
-      {
-        ref,
-        className: clsx.clsx(cortexCore.input(variants), className),
-        "data-testid": "textarea-face",
-        id: "textarea-face",
-        ...rest
-      },
-      clones
-    );
-  }
-);
-const Root = React.forwardRef(
-  ({ variants, className, ...rest }, ref) => {
-    return /* @__PURE__ */ React.createElement(Face, { variants, className }, /* @__PURE__ */ React.createElement(Box, { ref, ...rest }));
-  }
-);
-const Left = React.forwardRef(
-  ({ children, className, ...rest }, ref) => {
-    return /* @__PURE__ */ React.createElement("div", { className: clsx.clsx(className, "mr-2.5"), ...rest, ref }, children);
-  }
-);
-const Right = React.forwardRef(
-  ({ children, className, ...rest }, ref) => {
-    return /* @__PURE__ */ React.createElement("div", { className: clsx.clsx(className, "ml-2.5"), ...rest, ref }, children);
-  }
-);
-const TextArea = {
-  Root,
-  Face,
-  Box,
-  Left,
-  Right
-};
-
-exports.TextArea = TextArea;