@tecsinapse/react-core 1.19.0 → 1.21.0-beta.13

package/esm/components/molecules/Snackbar/styled.d.ts

@@ -0,0 +1,47 @@
+/// <reference types="react" />
+import { View } from 'react-native';
+import { SnackbarProps } from './Snackbar';
+export declare const SnackbarContainer: import("@emotion/native").StyledComponent<import("../../atoms/Paper").PaperProps & {
+    children?: import("react").ReactNode;
+} & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & Partial<SnackbarProps & import("../../../types/defaults").ThemeProviderProps> & {
+    visible: boolean;
+}, {}, {}>;
+export declare const ContentContainer: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;
+export declare const IconContainer: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & Partial<import("../../../types/defaults").ThemeProviderProps>, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;
+export declare const DismissContainer: import("@emotion/native").StyledComponent<import("../../atoms/PressableSurface").PressableSurfaceProps & {
+    children?: import("react").ReactNode;
+} & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & Partial<import("../../../types/defaults").ThemeProviderProps>, {}, {}>;
+export declare const StyledProgressBar: import("@emotion/native").StyledComponent<import("../../atoms/ProgressBar").ProgressBarProps & {
+    children?: import("react").ReactNode;
+} & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & Partial<import("../../../types/defaults").ThemeProviderProps>, {}, {}>;
+export declare const StyledContainerFlexRow: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & Partial<import("../../../types/defaults").ThemeProviderProps>, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;
+export declare const TextContainer: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;

package/esm/components/molecules/Snackbar/styled.js

@@ -0,0 +1,90 @@
+import styled, { css } from '@emotion/native';
+import { View } from 'react-native';
+import 'react';
+import '../../atoms/Text/styled.js';
+import '../../atoms/Input/styled.js';
+import 'currency.js';
+import '../../atoms/Input/InputElement/InputElement.js';
+import '../../atoms/Input/InputMaskElement/InputMaskElement.js';
+import '../../atoms/Input/PressableInputContainer/styled.js';
+import { RFValue } from '../../../utils/ResponsiveFontSize.js';
+import Paper from '../../atoms/Paper/Paper.js';
+import PressableSurface from '../../atoms/PressableSurface/PressableSurface.js';
+import ProgressBar from '../../atoms/ProgressBar/ProgressBar.js';
+
+const baseStyles = ({
+  theme,
+  colorTone = "xlight",
+  colorVariant = "primary",
+  visible
+}) => css`
+  padding: 0;
+  border-radius: ${theme.borderRadius.mili};
+  background-color: ${theme.color[colorVariant][colorTone]};
+  position: absolute;
+  z-index: ${theme.zIndex.modal};
+  display: ${visible ? "flex" : "none"};
+  flex-direction: column;
+  justify-content: space-between;
+  align-items: stretch;
+`;
+const anchorTop = ({
+  theme,
+  anchor,
+  anchorDistance
+}) => {
+  return anchor === "top" && css`
+      top: ${anchorDistance ? `${RFValue(anchorDistance)}px` : theme.spacing.deca};
+    `;
+};
+const anchorBottom = ({
+  theme,
+  anchor,
+  anchorDistance
+}) => {
+  return anchor === "bottom" && css`
+      bottom: ${anchorDistance ? `${RFValue(anchorDistance)}px` : theme.spacing.deca};
+    `;
+};
+const SnackbarContainer = styled(Paper)(
+  (props) => css`
+    ${baseStyles(props)}
+    ${anchorBottom(props)}
+    ${anchorTop(props)}
+  `
+);
+const ContentContainer = styled(View)`
+  flex-direction: row;
+  display: flex;
+  align-items: center;
+  flex-shrink: 1;
+`;
+const IconContainer = styled(View)`
+  flex-direction: row;
+  display: flex;
+  align-items: center;
+  margin-right: ${({ theme }) => theme.spacing.mili};
+`;
+const DismissContainer = styled(PressableSurface)`
+  flex-direction: row;
+  display: flex;
+  align-items: center;
+  margin-left: ${({ theme }) => theme.spacing.mili};
+`;
+const StyledProgressBar = styled(ProgressBar)`
+  border-top-left-radius: 0;
+  border-top-right-radius: 0;
+`;
+const StyledContainerFlexRow = styled(View)`
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  padding: ${({ theme }) => theme.spacing.mili};
+`;
+const TextContainer = styled(View)`
+  display: flex;
+  flex-shrink: 1;
+`;
+
+export { ContentContainer, DismissContainer, IconContainer, SnackbarContainer, StyledContainerFlexRow, StyledProgressBar, TextContainer };
+//# sourceMappingURL=styled.js.map

package/esm/components/molecules/Snackbar/styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styled.js","sources":["../../../../src/components/molecules/Snackbar/styled.ts"],"sourcesContent":["import styled, { css } from '@emotion/native';\nimport { View } from 'react-native';\nimport { StyleProps } from '../../../types/defaults';\nimport { RFValue } from '../../../utils';\nimport { Paper } from '../../atoms/Paper';\nimport { PressableSurface } from '../../atoms/PressableSurface';\nimport { ProgressBar } from '../../atoms/ProgressBar';\nimport { SnackbarProps } from './Snackbar';\n\nconst baseStyles = ({\n  theme,\n  colorTone = 'xlight',\n  colorVariant = 'primary',\n  visible,\n}: StyleProps & Partial<SnackbarProps> & { visible: boolean }) => css`\n  padding: 0;\n  border-radius: ${theme.borderRadius.mili};\n  background-color: ${theme.color[colorVariant][colorTone]};\n  position: absolute;\n  z-index: ${theme.zIndex.modal};\n  display: ${visible ? 'flex' : 'none'};\n  flex-direction: column;\n  justify-content: space-between;\n  align-items: stretch;\n`;\n\nconst anchorTop = ({\n  theme,\n  anchor,\n  anchorDistance,\n}: Partial<SnackbarProps> & StyleProps) => {\n  return (\n    anchor === 'top' &&\n    css`\n      top: ${anchorDistance\n        ? `${RFValue(anchorDistance)}px`\n        : theme.spacing.deca};\n    `\n  );\n};\n\nconst anchorBottom = ({\n  theme,\n  anchor,\n  anchorDistance,\n}: Partial<SnackbarProps> & StyleProps) => {\n  return (\n    anchor === 'bottom' &&\n    css`\n      bottom: ${anchorDistance\n        ? `${RFValue(anchorDistance)}px`\n        : theme.spacing.deca};\n    `\n  );\n};\n\nexport const SnackbarContainer = styled(Paper)<\n  Partial<SnackbarProps & StyleProps> & { visible: boolean }\n>(\n  props => css`\n    ${baseStyles(props)}\n    ${anchorBottom(props)}\n    ${anchorTop(props)}\n  `\n);\n\nexport const ContentContainer = styled(View)`\n  flex-direction: row;\n  display: flex;\n  align-items: center;\n  flex-shrink: 1;\n`;\n\nexport const IconContainer = styled(View)<Partial<StyleProps>>`\n  flex-direction: row;\n  display: flex;\n  align-items: center;\n  margin-right: ${({ theme }) => theme.spacing.mili};\n`;\n\nexport const DismissContainer = styled(PressableSurface)<Partial<StyleProps>>`\n  flex-direction: row;\n  display: flex;\n  align-items: center;\n  margin-left: ${({ theme }) => theme.spacing.mili};\n`;\n\nexport const StyledProgressBar = styled(ProgressBar)<Partial<StyleProps>>`\n  border-top-left-radius: 0;\n  border-top-right-radius: 0;\n`;\n\nexport const StyledContainerFlexRow = styled(View)<Partial<StyleProps>>`\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n  padding: ${({ theme }) => theme.spacing.mili};\n`;\n\nexport const TextContainer = styled(View)`\n  display: flex;\n  flex-shrink: 1;\n`;\n"],"names":[],"mappings":";;;;;;;;;;;;;;AASA,MAAM,aAAa,CAAC;AAAA,EAClB,KAAA;AAAA,EACA,SAAY,GAAA,QAAA;AAAA,EACZ,YAAe,GAAA,SAAA;AAAA,EACf,OAAA;AACF,CAAkE,KAAA,GAAA,CAAA;AAAA;AAAA,iBAAA,EAE/C,MAAM,YAAa,CAAA,IAAA,CAAA;AAAA,oBAChB,EAAA,KAAA,CAAM,MAAM,YAAc,CAAA,CAAA,SAAA,CAAA,CAAA;AAAA;AAAA,WAAA,EAEnC,MAAM,MAAO,CAAA,KAAA,CAAA;AAAA,WAAA,EACb,UAAU,MAAS,GAAA,MAAA,CAAA;AAAA;AAAA;AAAA;AAAA,CAAA,CAAA;AAMhC,MAAM,YAAY,CAAC;AAAA,EACjB,KAAA;AAAA,EACA,MAAA;AAAA,EACA,cAAA;AACF,CAA2C,KAAA;AACzC,EAAA,OACE,WAAW,KACX,IAAA,GAAA,CAAA;AAAA,WAAA,EACS,iBACH,CAAG,EAAA,OAAA,CAAQ,cAAc,CAAA,CAAA,EAAA,CAAA,GACzB,MAAM,OAAQ,CAAA,IAAA,CAAA;AAAA,IAAA,CAAA,CAAA;AAGxB,CAAA,CAAA;AAEA,MAAM,eAAe,CAAC;AAAA,EACpB,KAAA;AAAA,EACA,MAAA;AAAA,EACA,cAAA;AACF,CAA2C,KAAA;AACzC,EAAA,OACE,WAAW,QACX,IAAA,GAAA,CAAA;AAAA,cAAA,EACY,iBACN,CAAG,EAAA,OAAA,CAAQ,cAAc,CAAA,CAAA,EAAA,CAAA,GACzB,MAAM,OAAQ,CAAA,IAAA,CAAA;AAAA,IAAA,CAAA,CAAA;AAGxB,CAAA,CAAA;AAEa,MAAA,iBAAA,GAAoB,OAAO,KAAK,CAAA;AAAA,EAG3C,CAAS,KAAA,KAAA,GAAA,CAAA;AAAA,IAAA,EACL,WAAW,KAAK,CAAA,CAAA;AAAA,IAAA,EAChB,aAAa,KAAK,CAAA,CAAA;AAAA,IAAA,EAClB,UAAU,KAAK,CAAA,CAAA;AAAA,EAAA,CAAA;AAErB,EAAA;AAEa,MAAA,gBAAA,GAAmB,OAAO,IAAI,CAAA,CAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAA;AAO9B,MAAA,aAAA,GAAgB,OAAO,IAAI,CAAA,CAAA;AAAA;AAAA;AAAA;AAAA,gBAAA,EAItB,CAAC,EAAE,KAAM,EAAA,KAAM,MAAM,OAAQ,CAAA,IAAA,CAAA;AAAA,EAAA;AAGlC,MAAA,gBAAA,GAAmB,OAAO,gBAAgB,CAAA,CAAA;AAAA;AAAA;AAAA;AAAA,eAAA,EAItC,CAAC,EAAE,KAAM,EAAA,KAAM,MAAM,OAAQ,CAAA,IAAA,CAAA;AAAA,EAAA;AAGjC,MAAA,iBAAA,GAAoB,OAAO,WAAW,CAAA,CAAA;AAAA;AAAA;AAAA,EAAA;AAKtC,MAAA,sBAAA,GAAyB,OAAO,IAAI,CAAA,CAAA;AAAA;AAAA;AAAA;AAAA,WAAA,EAIpC,CAAC,EAAE,KAAM,EAAA,KAAM,MAAM,OAAQ,CAAA,IAAA,CAAA;AAAA,EAAA;AAG7B,MAAA,aAAA,GAAgB,OAAO,IAAI,CAAA,CAAA;AAAA;AAAA;AAAA;;;;"}

package/esm/components/molecules/TextArea/TextArea.d.ts

@@ -0,0 +1,14 @@
+import { FC } from 'react';
+import { FontStackType, FontWeightType } from '@tecsinapse/react-core';
+import { InputContainerProps, InputElementProps } from '../../atoms/Input';
+import { TextProps } from '../../atoms/Text';
+export interface TextAreaProps extends Omit<InputElementProps, 'style' | 'multiline' | 'value'>, InputContainerProps {
+    inputFontStack?: FontStackType;
+    inputFontWeight?: FontWeightType;
+    maxCharCount?: number;
+    value: string;
+    TextComponent?: FC<TextProps>;
+    focused?: boolean;
+}
+declare const TextArea: FC<TextAreaProps>;
+export default TextArea;

package/esm/components/molecules/TextArea/TextArea.js

@@ -0,0 +1,76 @@
+import React__default from 'react';
+import { View } from 'react-native';
+import Hint from '../../atoms/Input/Hint.js';
+import 'currency.js';
+import Text from '../../atoms/Text/Text.js';
+import '../../atoms/Input/styled.js';
+import '../../atoms/Input/InputElement/InputElement.js';
+import '../../atoms/Input/InputMaskElement/InputMaskElement.js';
+import '../../atoms/Input/PressableInputContainer/styled.js';
+import { StyledInputContainer } from './styled.js';
+
+const TextArea = ({
+  label,
+  labelColor,
+  labelColorVariant,
+  labelColorTone,
+  labelTypography,
+  labelStack,
+  labelWeight,
+  leftComponent,
+  rightComponent,
+  disabled,
+  style,
+  borderColor,
+  borderColorGradation,
+  inputContainerStyle,
+  variant = "default",
+  hintComponent,
+  hint,
+  TextComponent = Text,
+  focused,
+  children,
+  maxLength: _maxLenght,
+  value: _value
+}) => {
+  let length = _value.length;
+  const maxLength = _maxLenght;
+  if (maxLength && length > maxLength) {
+    length = maxLength;
+  }
+  const _hint = hintComponent || /* @__PURE__ */ React__default.createElement(Hint, {
+    TextComponent,
+    text: hint,
+    variant
+  });
+  return /* @__PURE__ */ React__default.createElement(View, {
+    style
+  }, /* @__PURE__ */ React__default.createElement(StyledInputContainer, {
+    label,
+    labelColor,
+    labelColorVariant,
+    labelColorTone,
+    labelTypography,
+    labelStack,
+    labelWeight,
+    LabelComponent: TextComponent,
+    leftComponent,
+    rightComponent,
+    borderColor,
+    borderColorGradation,
+    inputContainerStyle,
+    focused,
+    disabled,
+    variant
+  }, children, maxLength && /* @__PURE__ */ React__default.createElement(TextComponent, {
+    colorVariant: "secondary",
+    colorTone: "medium",
+    typography: "label",
+    fontStack: "default",
+    fontWeight: "bold",
+    style: { textAlign: "right" }
+  }, `${length}/${maxLength}`)), hint && _hint);
+};
+
+export { TextArea as default };
+//# sourceMappingURL=TextArea.js.map

package/esm/components/molecules/TextArea/TextArea.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextArea.js","sources":["../../../../src/components/molecules/TextArea/TextArea.tsx"],"sourcesContent":["import React, { FC } from 'react';\nimport { View } from 'react-native';\nimport { FontStackType, FontWeightType } from '@tecsinapse/react-core';\nimport {\n  Hint,\n  InputContainerProps,\n  InputElementProps,\n} from '../../atoms/Input';\nimport { Text, TextProps } from '../../atoms/Text';\nimport { StyledInputContainer } from './styled';\n\nexport interface TextAreaProps\n  extends Omit<InputElementProps, 'style' | 'multiline' | 'value'>,\n    InputContainerProps {\n  inputFontStack?: FontStackType;\n  inputFontWeight?: FontWeightType;\n  maxCharCount?: number;\n  value: string;\n  // Omit below\n  TextComponent?: FC<TextProps>;\n  focused?: boolean;\n}\n\nconst TextArea: FC<TextAreaProps> = ({\n  label,\n  labelColor,\n  labelColorVariant,\n  labelColorTone,\n  labelTypography,\n  labelStack,\n  labelWeight,\n  leftComponent,\n  rightComponent,\n  disabled,\n  style,\n  borderColor,\n  borderColorGradation,\n  inputContainerStyle,\n  variant = 'default',\n  hintComponent,\n  hint,\n  TextComponent = Text,\n  focused,\n  children,\n  maxLength: _maxLenght,\n  value: _value,\n}) => {\n  let length = _value.length;\n  const maxLength = _maxLenght;\n  if (maxLength && length > maxLength) {\n    length = maxLength;\n  }\n\n  const _hint = hintComponent || (\n    <Hint TextComponent={TextComponent} text={hint} variant={variant} />\n  );\n\n  return (\n    <View style={style}>\n      <StyledInputContainer\n        label={label}\n        labelColor={labelColor}\n        labelColorVariant={labelColorVariant}\n        labelColorTone={labelColorTone}\n        labelTypography={labelTypography}\n        labelStack={labelStack}\n        labelWeight={labelWeight}\n        LabelComponent={TextComponent}\n        leftComponent={leftComponent}\n        rightComponent={rightComponent}\n        borderColor={borderColor}\n        borderColorGradation={borderColorGradation}\n        inputContainerStyle={inputContainerStyle}\n        focused={focused}\n        disabled={disabled}\n        variant={variant}\n      >\n        {children}\n        {maxLength && (\n          <TextComponent\n            colorVariant={'secondary'}\n            colorTone={'medium'}\n            typography={'label'}\n            fontStack={'default'}\n            fontWeight={'bold'}\n            style={{ textAlign: 'right' }}\n          >\n            {`${length}/${maxLength}`}\n          </TextComponent>\n        )}\n      </StyledInputContainer>\n      {hint && _hint}\n    </View>\n  );\n};\n\nexport default TextArea;\n"],"names":["React"],"mappings":";;;;;;;;;;;AAuBA,MAAM,WAA8B,CAAC;AAAA,EACnC,KAAA;AAAA,EACA,UAAA;AAAA,EACA,iBAAA;AAAA,EACA,cAAA;AAAA,EACA,eAAA;AAAA,EACA,UAAA;AAAA,EACA,WAAA;AAAA,EACA,aAAA;AAAA,EACA,cAAA;AAAA,EACA,QAAA;AAAA,EACA,KAAA;AAAA,EACA,WAAA;AAAA,EACA,oBAAA;AAAA,EACA,mBAAA;AAAA,EACA,OAAU,GAAA,SAAA;AAAA,EACV,aAAA;AAAA,EACA,IAAA;AAAA,EACA,aAAgB,GAAA,IAAA;AAAA,EAChB,OAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAW,EAAA,UAAA;AAAA,EACX,KAAO,EAAA,MAAA;AACT,CAAM,KAAA;AACJ,EAAA,IAAI,SAAS,MAAO,CAAA,MAAA,CAAA;AACpB,EAAA,MAAM,SAAY,GAAA,UAAA,CAAA;AAClB,EAAI,IAAA,SAAA,IAAa,SAAS,SAAW,EAAA;AACnC,IAAS,MAAA,GAAA,SAAA,CAAA;AAAA,GACX;AAEA,EAAM,MAAA,KAAA,GAAQ,iCACXA,cAAA,CAAA,aAAA,CAAA,IAAA,EAAA;AAAA,IAAK,aAAA;AAAA,IAA8B,IAAM,EAAA,IAAA;AAAA,IAAM,OAAA;AAAA,GAAkB,CAAA,CAAA;AAGpE,EAAA,uBACGA,cAAA,CAAA,aAAA,CAAA,IAAA,EAAA;AAAA,IAAK,KAAA;AAAA,GAAA,kBACHA,cAAA,CAAA,aAAA,CAAA,oBAAA,EAAA;AAAA,IACC,KAAA;AAAA,IACA,UAAA;AAAA,IACA,iBAAA;AAAA,IACA,cAAA;AAAA,IACA,eAAA;AAAA,IACA,UAAA;AAAA,IACA,WAAA;AAAA,IACA,cAAgB,EAAA,aAAA;AAAA,IAChB,aAAA;AAAA,IACA,cAAA;AAAA,IACA,WAAA;AAAA,IACA,oBAAA;AAAA,IACA,mBAAA;AAAA,IACA,OAAA;AAAA,IACA,QAAA;AAAA,IACA,OAAA;AAAA,GAEC,EAAA,QAAA,EACA,6BACEA,cAAA,CAAA,aAAA,CAAA,aAAA,EAAA;AAAA,IACC,YAAc,EAAA,WAAA;AAAA,IACd,SAAW,EAAA,QAAA;AAAA,IACX,UAAY,EAAA,OAAA;AAAA,IACZ,SAAW,EAAA,SAAA;AAAA,IACX,UAAY,EAAA,MAAA;AAAA,IACZ,KAAA,EAAO,EAAE,SAAA,EAAW,OAAQ,EAAA;AAAA,GAAA,EAE3B,GAAG,MAAU,CAAA,CAAA,EAAA,SAAA,CAAA,CAChB,CAEJ,CAAA,EACC,QAAQ,KACX,CAAA,CAAA;AAEJ;;;;"}

package/esm/components/molecules/TextArea/index.d.ts

@@ -0,0 +1,3 @@
+export { default as TextArea } from './TextArea';
+export type { TextAreaProps } from './TextArea';
+export { TextAreaInputBase } from './styled';

package/esm/components/molecules/TextArea/index.js

@@ -0,0 +1,3 @@
+export { default as TextArea } from './TextArea';
+export { TextAreaInputBase } from './styled';
+//# sourceMappingURL=index.js.map

package/esm/components/molecules/TextArea/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["default","TextArea","TextAreaInputBase"],"sources":["../../../../src/components/molecules/TextArea/index.ts"],"sourcesContent":["export { default as TextArea } from './TextArea';\nexport type { TextAreaProps } from './TextArea';\nexport { TextAreaInputBase } from './styled';\n"],"mappings":"AAAA,SAASA,OAAO,IAAIC,QAApB,QAAoC,YAApC;AAEA,SAASC,iBAAT,QAAkC,UAAlC"}

package/esm/components/molecules/TextArea/styled.d.ts

@@ -0,0 +1,2 @@
+export declare const StyledInputContainer: import("@emotion/native").StyledComponent<any, {}, {}>;
+export declare const TextAreaInputBase: import("@emotion/native").StyledComponent<any, {}, {}>;

package/esm/components/molecules/TextArea/styled.js

@@ -0,0 +1,27 @@
+import styled from '@emotion/native';
+import { extractNumbersFromString } from '../../../utils/extractNumbersFromString.js';
+import 'react';
+import '../../atoms/Text/styled.js';
+import '../../atoms/Input/styled.js';
+import 'currency.js';
+import InputContainer from '../../atoms/Input/InputContainer/InputContainer.js';
+import InputElement from '../../atoms/Input/InputElement/InputElement.js';
+import '../../atoms/Input/InputMaskElement/InputMaskElement.js';
+import '../../atoms/Input/PressableInputContainer/styled.js';
+import 'react-native';
+import { RFValueStr, RFValue } from '../../../utils/ResponsiveFontSize.js';
+
+const StyledInputContainer = styled(InputContainer)`
+  min-height: ${RFValueStr("50px")};
+`;
+const TextAreaInputBase = styled(InputElement)`
+  max-height: ${({ theme, numberOfLines }) => `${RFValue(
+  extractNumbersFromString(theme.typography.h5.lineHeight) * (numberOfLines || 1)
+)}px`};
+  width: 100%;
+  padding: 0;
+  margin: ${RFValueStr("3px")} 0;
+`;
+
+export { StyledInputContainer, TextAreaInputBase };
+//# sourceMappingURL=styled.js.map

package/esm/components/molecules/TextArea/styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styled.js","sources":["../../../../src/components/molecules/TextArea/styled.ts"],"sourcesContent":["import styled from '@emotion/native';\nimport { StyleProps } from '@tecsinapse/react-core';\nimport { extractNumbersFromString, RFValue, RFValueStr } from '../../../utils';\nimport { InputContainer, InputElement } from '../../atoms/Input';\nimport { TextAreaProps } from './TextArea';\n\nexport const StyledInputContainer = styled(InputContainer)<Partial<StyleProps>>`\n  min-height: ${RFValueStr('50px')};\n`;\n\nexport const TextAreaInputBase = styled(InputElement)<\n  Partial<TextAreaProps> & Partial<StyleProps>\n>`\n  max-height: ${({ theme, numberOfLines }) =>\n    `${RFValue(\n      extractNumbersFromString(theme.typography.h5.lineHeight) *\n        (numberOfLines || 1)\n    )}px`};\n  width: 100%;\n  padding: 0;\n  margin: ${RFValueStr('3px')} 0;\n`;\n"],"names":[],"mappings":";;;;;;;;;;;;;AAMa,MAAA,oBAAA,GAAuB,OAAO,cAAc,CAAA,CAAA;AAAA,cAAA,EACzC,WAAW,MAAM,CAAA,CAAA;AAAA,EAAA;AAGpB,MAAA,iBAAA,GAAoB,OAAO,YAAY,CAAA,CAAA;AAAA,cAAA,EAGpC,CAAC,EAAE,KAAO,EAAA,aAAA,OACtB,CAAG,EAAA,OAAA;AAAA,EACD,yBAAyB,KAAM,CAAA,UAAA,CAAW,EAAG,CAAA,UAAU,KACpD,aAAiB,IAAA,CAAA,CAAA;AACtB,CAAA,CAAA,EAAA,CAAA,CAAA;AAAA;AAAA;AAAA,UAAA,EAGQ,WAAW,KAAK,CAAA,CAAA;AAAA;;;;"}

package/esm/hooks/index.d.ts

@@ -0,0 +1,2 @@
+export { useDebouncedState } from './useDebouncedState';
+export { useTheme } from './useTheme';

package/esm/hooks/index.js

@@ -0,0 +1,3 @@
+export { useDebouncedState } from './useDebouncedState';
+export { useTheme } from './useTheme';
+//# sourceMappingURL=index.js.map

package/esm/hooks/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["useDebouncedState","useTheme"],"sources":["../../src/hooks/index.ts"],"sourcesContent":["export { useDebouncedState } from './useDebouncedState';\nexport { useTheme } from './useTheme';\n"],"mappings":"AAAA,SAASA,iBAAT,QAAkC,qBAAlC;AACA,SAASC,QAAT,QAAyB,YAAzB"}

package/esm/hooks/useDebouncedState.d.ts

@@ -0,0 +1,2 @@
+import { Dispatch, SetStateAction } from 'react';
+export declare function useDebouncedState<S>(initialState: S | (() => S), timeoutCallback?: (state: S) => void, timeoutMs?: number): [S, Dispatch<SetStateAction<S>>];

package/esm/hooks/useDebouncedState.js

@@ -0,0 +1,16 @@
+import { useRef, useState, useEffect } from 'react';
+
+function useDebouncedState(initialState, timeoutCallback, timeoutMs = 166) {
+  const timeoutId = useRef();
+  const [state, setState] = useState(initialState);
+  useEffect(() => {
+    if (timeoutId.current)
+      clearTimeout(timeoutId.current);
+    if (timeoutCallback)
+      timeoutId.current = setTimeout(() => timeoutCallback(state), timeoutMs);
+  }, [state]);
+  return [state, setState];
+}
+
+export { useDebouncedState };
+//# sourceMappingURL=useDebouncedState.js.map

package/esm/hooks/useDebouncedState.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDebouncedState.js","sources":["../../src/hooks/useDebouncedState.ts"],"sourcesContent":["import { Dispatch, SetStateAction, useEffect, useRef, useState } from 'react';\n\n/**\n * @param initialState\n * @param timeoutCallback callback to be called after bouncing ends. Should be memoized.\n * @param timeoutMs\n */\nexport function useDebouncedState<S>(\n  initialState: S | (() => S),\n  timeoutCallback?: (state: S) => void,\n  timeoutMs = 166\n): [S, Dispatch<SetStateAction<S>>] {\n  const timeoutId = useRef<number>();\n\n  const [state, setState] = useState<S>(initialState);\n\n  useEffect(() => {\n    if (timeoutId.current) clearTimeout(timeoutId.current);\n    if (timeoutCallback)\n      timeoutId.current = setTimeout(() => timeoutCallback(state), timeoutMs);\n  }, [state]);\n\n  return [state, setState];\n}\n"],"names":[],"mappings":";;AAOO,SAAS,iBACd,CAAA,YAAA,EACA,eACA,EAAA,SAAA,GAAY,GACsB,EAAA;AAClC,EAAA,MAAM,YAAY,MAAe,EAAA,CAAA;AAEjC,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,CAAA,GAAI,SAAY,YAAY,CAAA,CAAA;AAElD,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,SAAU,CAAA,OAAA;AAAS,MAAA,YAAA,CAAa,UAAU,OAAO,CAAA,CAAA;AACrD,IAAI,IAAA,eAAA;AACF,MAAA,SAAA,CAAU,UAAU,UAAW,CAAA,MAAM,eAAgB,CAAA,KAAK,GAAG,SAAS,CAAA,CAAA;AAAA,GAC1E,EAAG,CAAC,KAAK,CAAC,CAAA,CAAA;AAEV,EAAO,OAAA,CAAC,OAAO,QAAQ,CAAA,CAAA;AACzB;;;;"}

package/esm/hooks/useTheme.d.ts

@@ -0,0 +1,2 @@
+import { ThemeProp } from '../types/defaults';
+export declare const useTheme: () => ThemeProp;

package/esm/hooks/useTheme.js

@@ -0,0 +1,6 @@
+import { useTheme as useTheme$1 } from '@emotion/react';
+
+const useTheme = () => useTheme$1();
+
+export { useTheme };
+//# sourceMappingURL=useTheme.js.map

package/esm/hooks/useTheme.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTheme.js","sources":["../../src/hooks/useTheme.ts"],"sourcesContent":["import { useTheme as useEmotionTheme } from '@emotion/react';\nimport { ThemeProp } from '../types/defaults';\n\nexport const useTheme = (): ThemeProp => useEmotionTheme() as ThemeProp;\n"],"names":["useEmotionTheme"],"mappings":";;AAGa,MAAA,QAAA,GAAW,MAAiBA,UAAgB;;;;"}

package/esm/index.d.ts

@@ -0,0 +1,64 @@
+export { Avatar } from './components/atoms/Avatar';
+export type { AvatarProps } from './components/atoms/Avatar';
+export { Badge } from './components/atoms/Badge';
+export type { BadgeProps } from './components/atoms/Badge';
+export { BoxContent } from './components/atoms/BoxContent';
+export type { BoxContentProps } from './components/atoms/BoxContent';
+export { Button, Error, Loading, Success } from './components/atoms/Button';
+export type { ButtonProps, ButtonSizeType, ButtonStateProps, ButtonStateType, } from './components/atoms/Button';
+export { Card } from './components/atoms/Card';
+export type { CardProps } from './components/atoms/Card';
+export { Footer } from './components/atoms/Card/Footer';
+export type { FooterProps } from './components/atoms/Card/Footer';
+export { Header } from './components/atoms/Card/Header';
+export type { HeaderProps } from './components/atoms/Card/Header';
+export { Checkbox } from './components/atoms/Checkbox';
+export type { CheckboxProps } from './components/atoms/Checkbox';
+export { Divider } from './components/atoms/Divider';
+export type { DividerProps } from './components/atoms/Divider';
+export { GroupButton, GroupButtonOption } from './components/atoms/GroupButton';
+export type { GroupButtonOptionProps, GroupButtonProps, GroupButtonValue, } from './components/atoms/GroupButton';
+export { Icon } from './components/atoms/Icon';
+export type { IconProps } from './components/atoms/Icon';
+export { disabledInputStyles, Hint, InputContainer, InputElement, InputMaskElement, PressableInputContainer, StyledBorderKeeper, useInputFocus, useNumberMask, useStringMask, } from './components/atoms/Input';
+export type { InputContainerProps, InputElementProps, InputMaskElementProps, InputVariantType, PressableInputContainerProps, } from './components/atoms/Input';
+export { Paper } from './components/atoms/Paper';
+export type { PaperProps } from './components/atoms/Paper';
+export { PressableSurface } from './components/atoms/PressableSurface';
+export type { PressableSurfaceProps } from './components/atoms/PressableSurface';
+export { ProgressBar } from './components/atoms/ProgressBar';
+export type { ProgressBarProps } from './components/atoms/ProgressBar';
+export { RadioButton } from './components/atoms/RadioButton';
+export type { RadioButtonProps } from './components/atoms/RadioButton';
+export { Switch } from './components/atoms/Switch';
+export type { SwitchProps } from './components/atoms/Switch';
+export { Tag } from './components/atoms/Tag';
+export type { TagProps } from './components/atoms/Tag';
+export { Text } from './components/atoms/Text';
+export type { TextProps } from './components/atoms/Text';
+export { Calendar } from './components/molecules/Calendar';
+export type { CalendarProps, DateRange, SelectionType, Value, } from './components/molecules/Calendar';
+export { DatePicker } from './components/molecules/DatePicker';
+export type { DatePickerProps } from './components/molecules/DatePicker';
+export { DateTimePicker } from './components/molecules/DateTimePicker';
+export type { DateTimePickerProps } from './components/molecules/DateTimePicker';
+export { DateTimeSelector } from './components/molecules/DateTimeSelector';
+export type { DateTimeSelectorMode, DateTimeSelectorProps, } from './components/molecules/DateTimeSelector';
+export { getGridItemPadding, getGridItemColumSpan, } from './components/molecules/Grid';
+export type { GridSpacing, IGridItem, IGrid, FlexAlignBase, FlexAlignType, FlexPositioning, FlexSpacing, PaddingPosition, } from './components/molecules/Grid';
+export { HintInputContainer } from './components/molecules/HintInputContainer';
+export type { HintInputContainerProps } from './components/molecules/HintInputContainer';
+export { IconComponent } from './components/molecules/IconTextButton';
+export type { IconPositionOptions, IconTextButtonProps, } from './components/molecules/IconTextButton';
+export { InputPasswordIcon } from './components/molecules/InputPassword';
+export type { LabeledSwitchProps, LabelPositionOptions, } from './components/molecules/LabeledSwitch';
+export { Snackbar } from './components/molecules/Snackbar';
+export type { SnackbarProps } from './components/molecules/Snackbar';
+export { TextArea, TextAreaInputBase } from './components/molecules/TextArea';
+export type { TextAreaProps } from './components/molecules/TextArea';
+export * from './hooks';
+export * from './styles/definitions';
+export * from './styles/light';
+export { default as ThemeProvider } from './styles/ThemeProvider';
+export * from './types/defaults';
+export * from './utils';

package/esm/index.js

@@ -0,0 +1,55 @@
+export { default as Avatar } from './components/atoms/Avatar/Avatar.js';
+export { default as Badge } from './components/atoms/Badge/Badge.js';
+export { default as BoxContent } from './components/atoms/BoxContent/BoxContent.js';
+export { default as Button } from './components/atoms/Button/Button.js';
+export { default as Error } from './components/atoms/Button/States/Error.js';
+export { default as Loading } from './components/atoms/Button/States/Loading.js';
+export { default as Success } from './components/atoms/Button/States/Success.js';
+export { default as Card } from './components/atoms/Card/Card.js';
+export { default as Footer } from './components/atoms/Card/Footer/Footer.js';
+export { default as Header } from './components/atoms/Card/Header/Header.js';
+export { default as Checkbox } from './components/atoms/Checkbox/Checkbox.js';
+export { default as Divider } from './components/atoms/Divider/Divider.js';
+export { default as GroupButton } from './components/atoms/GroupButton/GroupButton.js';
+export { default as GroupButtonOption } from './components/atoms/GroupButton/GroupButtonOption.js';
+export { default as Icon } from './components/atoms/Icon/Icon.js';
+export { default as Hint } from './components/atoms/Input/Hint.js';
+export { useInputFocus } from './components/atoms/Input/hooks/useInputFocus.js';
+export { useNumberMask } from './components/atoms/Input/hooks/useNumberMask.js';
+export { useStringMask } from './components/atoms/Input/hooks/useStringMask.js';
+export { default as InputContainer } from './components/atoms/Input/InputContainer/InputContainer.js';
+export { default as InputElement } from './components/atoms/Input/InputElement/InputElement.js';
+export { default as InputMaskElement } from './components/atoms/Input/InputMaskElement/InputMaskElement.js';
+export { default as PressableInputContainer } from './components/atoms/Input/PressableInputContainer/PressableInputContainer.js';
+export { StyledBorderKeeper, disabledInputStyles } from './components/atoms/Input/styled.js';
+export { default as Paper } from './components/atoms/Paper/Paper.js';
+export { default as PressableSurface } from './components/atoms/PressableSurface/PressableSurface.js';
+export { default as ProgressBar } from './components/atoms/ProgressBar/ProgressBar.js';
+export { default as RadioButton } from './components/atoms/RadioButton/RadioButton.js';
+export { default as Switch } from './components/atoms/Switch/Switch.js';
+export { default as Tag } from './components/atoms/Tag/Tag.js';
+export { default as Text } from './components/atoms/Text/Text.js';
+export { default as Calendar } from './components/molecules/Calendar/Calendar.js';
+export { default as DatePicker } from './components/molecules/DatePicker/DatePicker.js';
+export { default as DateTimePicker } from './components/molecules/DateTimePicker/DateTimePicker.js';
+export { default as DateTimeSelector } from './components/molecules/DateTimeSelector/DateTimeSelector.js';
+export { getGridItemColumSpan, getGridItemPadding } from './components/molecules/Grid/functions.js';
+export { default as HintInputContainer } from './components/molecules/HintInputContainer/HintInputContainer.js';
+export { default as IconComponent } from './components/molecules/IconTextButton/IconComponent.js';
+export { default as InputPasswordIcon } from './components/molecules/InputPassword/InputPasswordIcon.js';
+export { default as Snackbar } from './components/molecules/Snackbar/Snackbar.js';
+export { default as TextArea } from './components/molecules/TextArea/TextArea.js';
+export { TextAreaInputBase } from './components/molecules/TextArea/styled.js';
+export { useDebouncedState } from './hooks/useDebouncedState.js';
+export { useTheme } from './hooks/useTheme.js';
+export { borderRadius, borderWidth, breakpoints, fontColor, fontFiles, fontStack, fontWeight, hex2rgba, iconSize, miscellaneous, spacing, statusColor, typography, zIndex } from './styles/definitions.js';
+export { lightTheme } from './styles/light.js';
+export { default as ThemeProvider } from './styles/ThemeProvider.js';
+export { extractDigitsFromString, extractNumbersFromString } from './utils/extractNumbersFromString.js';
+export { formatWithMask } from './utils/formatWithMask.js';
+export { getBottomSpace, getStatusBarHeight, ifIphoneX, isIphoneX } from './utils/IPhoneXHelper.js';
+export { lightenDarkenColor } from './utils/lightenDarkenColor.js';
+export { Masks } from './utils/masks.js';
+export { RFPercentage, RFValue, RFValueStr } from './utils/ResponsiveFontSize.js';
+export { borderColorGradationVC, borderColorVC, colorGradationVC, colorVC, fontColorVC } from './utils/variantComplement.js';
+//# sourceMappingURL=index.js.map

package/esm/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/esm/styles/ThemeProvider.d.ts

@@ -0,0 +1,4 @@
+import { FC } from 'react';
+import { ThemeProviderProps } from '../types/defaults';
+declare const ThemeProvider: FC<ThemeProviderProps>;
+export default ThemeProvider;

package/esm/styles/ThemeProvider.js

@@ -0,0 +1,14 @@
+import React__default from 'react';
+import { ThemeProvider as ThemeProvider$1 } from '@emotion/react';
+
+const ThemeProvider = ({
+  theme,
+  children
+}) => {
+  return /* @__PURE__ */ React__default.createElement(ThemeProvider$1, {
+    theme
+  }, children);
+};
+
+export { ThemeProvider as default };
+//# sourceMappingURL=ThemeProvider.js.map

package/esm/styles/ThemeProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThemeProvider.js","sources":["../../src/styles/ThemeProvider.tsx"],"sourcesContent":["import React, { FC } from 'react';\nimport { ThemeProvider as EmotionProvider } from '@emotion/react';\nimport { ThemeProviderProps } from '../types/defaults';\n\nconst ThemeProvider: FC<ThemeProviderProps> = ({\n  theme,\n  children,\n}): JSX.Element => {\n  return <EmotionProvider theme={theme}>{children}</EmotionProvider>;\n};\n\nexport default ThemeProvider;\n"],"names":["React","EmotionProvider"],"mappings":";;;AAIA,MAAM,gBAAwC,CAAC;AAAA,EAC7C,KAAA;AAAA,EACA,QAAA;AACF,CAAmB,KAAA;AACjB,EAAA,uBAAQA,cAAA,CAAA,aAAA,CAAAC,eAAA,EAAA;AAAA,IAAgB,KAAA;AAAA,GAAA,EAAe,QAAS,CAAA,CAAA;AAClD;;;;"}

package/esm/styles/definitions.d.ts

@@ -0,0 +1,45 @@
+import { BorderRadius, BorderWidth, Breakpoints, FontColor, FontStack, FontWeight, IconSize, Miscellaneous, Spacing, TypographyVariation, ZIndex } from '../types/defaults';
+export declare const statusColor: {
+    error: {
+        xlight: string;
+        light: string;
+        medium: string;
+        dark: string;
+        xdark: string;
+    };
+    warning: {
+        xlight: string;
+        light: string;
+        medium: string;
+        dark: string;
+        xdark: string;
+    };
+    success: {
+        xlight: string;
+        light: string;
+        medium: string;
+        dark: string;
+        xdark: string;
+    };
+    info: {
+        xlight: string;
+        light: string;
+        medium: string;
+        dark: string;
+        xdark: string;
+    };
+};
+export declare const hex2rgba: (hex: any, alpha?: number) => string;
+export declare const miscellaneous: Miscellaneous;
+export declare const spacing: Spacing;
+export declare const iconSize: IconSize;
+export declare const borderRadius: BorderRadius;
+export declare const borderWidth: BorderWidth;
+export declare const typography: TypographyVariation;
+export declare const fontStack: FontStack;
+export declare const fontWeight: FontWeight;
+export declare const fontFiles: FontWeight;
+export declare const fontColor: FontColor;
+export declare const zIndex: ZIndex;
+export declare type IconType = 'material' | 'material-community' | 'simple-line-icon' | 'zocial' | 'font-awesome' | 'octicon' | 'ionicon' | 'foundation' | 'evilicon' | 'entypo' | 'antdesign' | 'font-awesome-5' | string;
+export declare const breakpoints: Breakpoints;