@tecsinapse/react-core 1.19.0 → 1.20.0

package/esm/components/atoms/GroupButton/GroupButton.js

@@ -0,0 +1,78 @@
+var _excluded = ["style"],
+    _excluded2 = ["options", "renderOption", "renderKey", "onChange", "value", "disableAllOptions"];
+
+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; }
+
+import { useTheme } from '@emotion/react';
+import React from 'react';
+import { StyledDivider, StyledGroupButton, StyledOption, StyledPressable } from './styled';
+
+var GroupButton = function GroupButton(_ref) {
+  var style = _ref.style,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  return React.createElement(StyledGroupButton, {
+    style: style
+  }, groupOptions(rest));
+};
+
+var groupOptions = function groupOptions(_ref2) {
+  var options = _ref2.options,
+      renderOption = _ref2.renderOption,
+      renderKey = _ref2.renderKey,
+      onChange = _ref2.onChange,
+      value = _ref2.value,
+      disableAllOptions = _ref2.disableAllOptions,
+      rest = _objectWithoutProperties(_ref2, _excluded2);
+
+  var theme = useTheme();
+  return options === null || options === void 0 ? void 0 : options.map(function (option, idx) {
+    var _option$options2;
+
+    var optionValue = option.value,
+        _option$options = option.options;
+    _option$options = _option$options === void 0 ? {} : _option$options;
+    var activeStyle = _option$options.activeStyle,
+        inactiveStyle = _option$options.inactiveStyle,
+        activeBackgroundColor = _option$options.activeBackgroundColor,
+        activeBackgroundColorTone = _option$options.activeBackgroundColorTone,
+        inactiveBackgroundColor = _option$options.inactiveBackgroundColor,
+        inactiveBackgroundColorTone = _option$options.inactiveBackgroundColorTone,
+        _option$options$disab = _option$options.disabled,
+        disabled = _option$options$disab === void 0 ? disableAllOptions || ((_option$options2 = option.options) === null || _option$options2 === void 0 ? void 0 : _option$options2.disabled) : _option$options$disab;
+    var key = renderKey === null || renderKey === void 0 ? void 0 : renderKey(optionValue);
+    var active = key === (renderKey === null || renderKey === void 0 ? void 0 : renderKey(value));
+    var isFirst = idx === 0;
+    var isLast = idx === options.length - 1;
+    var colors = theme.miscellaneous.surfaceColor;
+
+    if (active) {
+      colors = theme.color[activeBackgroundColor || 'secondary'][activeBackgroundColorTone || 'medium'];
+    }
+
+    if (!active && (inactiveBackgroundColor || inactiveBackgroundColorTone)) {
+      colors = theme.color[inactiveBackgroundColor || 'secondary'][inactiveBackgroundColorTone || 'medium'];
+    }
+
+    return React.createElement(StyledOption, {
+      key: key
+    }, React.createElement(StyledPressable, _extends({}, rest, option.options, {
+      disabled: disabled,
+      isActive: active,
+      isFirstOption: isFirst,
+      isLastOption: isLast,
+      onPress: function onPress() {
+        return onChange === null || onChange === void 0 ? void 0 : onChange(optionValue);
+      },
+      surfaceColor: colors,
+      style: active ? activeStyle : inactiveStyle
+    }), renderOption === null || renderOption === void 0 ? void 0 : renderOption(option.value, active)), !isLast && React.createElement(StyledDivider, null));
+  });
+};
+
+export default GroupButton;
+//# sourceMappingURL=GroupButton.js.map

package/esm/components/atoms/GroupButton/GroupButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GroupButton.js","names":["useTheme","React","StyledDivider","StyledGroupButton","StyledOption","StyledPressable","GroupButton","style","rest","groupOptions","options","renderOption","renderKey","onChange","value","disableAllOptions","theme","map","option","idx","optionValue","activeStyle","inactiveStyle","activeBackgroundColor","activeBackgroundColorTone","inactiveBackgroundColor","inactiveBackgroundColorTone","disabled","key","active","isFirst","isLast","length","colors","miscellaneous","surfaceColor","color"],"sources":["../../../../src/components/atoms/GroupButton/GroupButton.tsx"],"sourcesContent":["import { useTheme } from '@emotion/react';\nimport React from 'react';\nimport { StyleProp, ViewStyle } from 'react-native';\nimport {\n  ColorGradationType,\n  ColorType,\n  ThemeProp,\n} from '../../../types/defaults';\nimport { ButtonSizeType } from '../Button';\nimport {\n  StyledDivider,\n  StyledGroupButton,\n  StyledOption,\n  StyledPressable,\n} from './styled';\n\nexport interface GroupButtonOptions {\n  activeBackgroundColor?: ColorType;\n  activeBackgroundColorTone?: ColorGradationType;\n  activeBorderColor?: ColorType;\n  activeBorderColorTone?: ColorGradationType;\n  inactiveBackgroundColor?: ColorType;\n  inactiveBackgroundColorTone?: ColorGradationType;\n  inactiveBorderColor?: ColorType;\n  inactiveBorderColorTone?: ColorGradationType;\n  activeStyle?: StyleProp<ViewStyle>;\n  inactiveStyle?: StyleProp<ViewStyle>;\n  disabled?: boolean;\n}\n\nexport interface GroupButtonValue<T> {\n  value: T;\n  options?: GroupButtonOptions;\n}\n\nexport interface GroupButtonProps<T> {\n  value: T;\n  options: GroupButtonValue<T>[];\n  renderKey: (option?: T) => string | number | undefined;\n  renderOption: (option: T, active: boolean) => JSX.Element;\n  onChange: (option: T) => void;\n  buttonSize?: ButtonSizeType;\n  style?: StyleProp<ViewStyle>;\n  disableAllOptions?: boolean;\n}\n\nconst GroupButton = <T,>({ style, ...rest }: GroupButtonProps<T>) => {\n  return (\n    <StyledGroupButton style={style}>{groupOptions(rest)}</StyledGroupButton>\n  );\n};\n\nconst groupOptions = <T,>({\n  options,\n  renderOption,\n  renderKey,\n  onChange,\n  value,\n  disableAllOptions,\n  ...rest\n}: Partial<GroupButtonProps<T>>) => {\n  const theme = useTheme() as ThemeProp;\n  return options?.map((option, idx) => {\n    const {\n      value: optionValue,\n      options: {\n        activeStyle,\n        inactiveStyle,\n        activeBackgroundColor,\n        activeBackgroundColorTone,\n        inactiveBackgroundColor,\n        inactiveBackgroundColorTone,\n        disabled = disableAllOptions || option.options?.disabled,\n      } = {},\n    } = option;\n\n    const key = renderKey?.(optionValue);\n    const active = key === renderKey?.(value);\n    const isFirst = idx === 0;\n    const isLast = idx === options.length - 1;\n\n    let colors = theme.miscellaneous.surfaceColor;\n    if (active) {\n      colors =\n        theme.color[activeBackgroundColor || 'secondary'][\n          activeBackgroundColorTone || 'medium'\n        ];\n    }\n\n    if (!active && (inactiveBackgroundColor || inactiveBackgroundColorTone)) {\n      colors =\n        theme.color[inactiveBackgroundColor || 'secondary'][\n          inactiveBackgroundColorTone || 'medium'\n        ];\n    }\n\n    return (\n      <StyledOption key={key}>\n        <StyledPressable\n          {...rest}\n          {...option.options}\n          disabled={disabled}\n          isActive={active}\n          isFirstOption={isFirst}\n          isLastOption={isLast}\n          onPress={() => onChange?.(optionValue)}\n          surfaceColor={colors}\n          style={active ? activeStyle : inactiveStyle}\n        >\n          {renderOption?.(option.value, active)}\n        </StyledPressable>\n        {!isLast && <StyledDivider />}\n      </StyledOption>\n    );\n  });\n};\n\nexport default GroupButton;\n"],"mappings":"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"}

package/esm/components/atoms/GroupButton/GroupButtonOption.d.ts

@@ -0,0 +1,9 @@
+import { FC } from 'react';
+import { TextProps } from '../Text';
+export interface GroupButtonOptionProps {
+    active: boolean;
+    description: string;
+    TextComponent?: FC<TextProps>;
+}
+declare const GroupButtonOption: ({ TextComponent, active, description, }: GroupButtonOptionProps) => JSX.Element;
+export default GroupButtonOption;

package/esm/components/atoms/GroupButton/GroupButtonOption.js

@@ -0,0 +1,19 @@
+import React from 'react';
+import { Text } from '../Text';
+import { getStyledGroupItemText } from './styled';
+
+var GroupButtonOption = function GroupButtonOption(_ref) {
+  var _ref$TextComponent = _ref.TextComponent,
+      TextComponent = _ref$TextComponent === void 0 ? Text : _ref$TextComponent,
+      active = _ref.active,
+      description = _ref.description;
+  var StyledText = getStyledGroupItemText(TextComponent);
+  return React.createElement(StyledText, {
+    fontWeight: "bold",
+    typography: "sub",
+    active: active
+  }, description);
+};
+
+export default GroupButtonOption;
+//# sourceMappingURL=GroupButtonOption.js.map

package/esm/components/atoms/GroupButton/GroupButtonOption.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GroupButtonOption.js","names":["React","Text","getStyledGroupItemText","GroupButtonOption","TextComponent","active","description","StyledText"],"sources":["../../../../src/components/atoms/GroupButton/GroupButtonOption.tsx"],"sourcesContent":["import React, { FC } from 'react';\nimport { Text, TextProps } from '../Text';\nimport { getStyledGroupItemText } from './styled';\n\nexport interface GroupButtonOptionProps {\n  active: boolean;\n  description: string;\n  TextComponent?: FC<TextProps>;\n}\n\nconst GroupButtonOption = ({\n  TextComponent = Text,\n  active,\n  description,\n}: GroupButtonOptionProps): JSX.Element => {\n  const StyledText = getStyledGroupItemText(TextComponent);\n  return (\n    <StyledText fontWeight=\"bold\" typography=\"sub\" active={active}>\n      {description}\n    </StyledText>\n  );\n};\n\nexport default GroupButtonOption;\n"],"mappings":"AAAA,OAAOA,KAAP,MAA0B,OAA1B;AACA,SAASC,IAAT,QAAgC,SAAhC;AACA,SAASC,sBAAT,QAAuC,UAAvC;;AAQA,IAAMC,iBAAiB,GAAG,SAApBA,iBAAoB,OAIiB;EAAA,8BAHzCC,aAGyC;EAAA,IAHzCA,aAGyC,mCAHzBH,IAGyB;EAAA,IAFzCI,MAEyC,QAFzCA,MAEyC;EAAA,IADzCC,WACyC,QADzCA,WACyC;EACzC,IAAMC,UAAU,GAAGL,sBAAsB,CAACE,aAAD,CAAzC;EACA,OACE,oBAAC,UAAD;IAAY,UAAU,EAAC,MAAvB;IAA8B,UAAU,EAAC,KAAzC;IAA+C,MAAM,EAAEC;EAAvD,GACGC,WADH,CADF;AAKD,CAXD;;AAaA,eAAeH,iBAAf"}

package/esm/components/atoms/GroupButton/index.d.ts

@@ -0,0 +1,4 @@
+export { default as GroupButton } from './GroupButton';
+export type { GroupButtonProps, GroupButtonValue } from './GroupButton';
+export { default as GroupButtonOption } from './GroupButtonOption';
+export type { GroupButtonOptionProps } from './GroupButtonOption';

package/esm/components/atoms/GroupButton/index.js

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

package/esm/components/atoms/GroupButton/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["default","GroupButton","GroupButtonOption"],"sources":["../../../../src/components/atoms/GroupButton/index.ts"],"sourcesContent":["export { default as GroupButton } from './GroupButton';\nexport type { GroupButtonProps, GroupButtonValue } from './GroupButton';\nexport { default as GroupButtonOption } from './GroupButtonOption';\nexport type { GroupButtonOptionProps } from './GroupButtonOption';\n"],"mappings":"AAAA,SAASA,OAAO,IAAIC,WAApB,QAAuC,eAAvC;AAEA,SAASD,OAAO,IAAIE,iBAApB,QAA6C,qBAA7C"}

package/esm/components/atoms/GroupButton/styled.d.ts

@@ -0,0 +1,42 @@
+import { FC } from 'react';
+import { ButtonSizeType } from '../Button';
+import { TextProps } from '../Text';
+import { GroupButtonOptions } from './GroupButton';
+import { GroupButtonOptionProps } from './GroupButtonOption';
+interface PressableOptions extends GroupButtonOptions {
+    isActive: boolean;
+    isFirstOption: boolean;
+    isLastOption: boolean;
+    buttonSize?: ButtonSizeType;
+}
+export declare const StyledGroupButton: 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<import("react-native").View> | undefined;
+}>;
+export declare const getStyledGroupItemText: (component: FC<TextProps>) => import("@emotion/native").StyledComponent<TextProps & {
+    children?: import("react").ReactNode;
+} & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & Partial<GroupButtonOptionProps> & Partial<import("../../../types/defaults").ThemeProviderProps>, {}, {}>;
+export declare const StyledOption: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, {}, {
+    ref?: import("react").Ref<import("react-native").View> | undefined;
+}>;
+export declare const StyledDivider: 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<import("react-native").View> | undefined;
+}>;
+export declare const StyledPressable: import("@emotion/native").StyledComponent<import("../PressableSurface").PressableSurfaceProps & {
+    children?: import("react").ReactNode;
+} & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & PressableOptions & Partial<import("../../../types/defaults").ThemeProviderProps>, {}, {}>;
+export {};

package/esm/components/atoms/GroupButton/styled.js

@@ -0,0 +1,97 @@
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14;
+
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+
+import styled, { css } from '@emotion/native';
+import { RFValueStr } from '../../../utils';
+import { PressableSurface } from '../PressableSurface';
+export var StyledGroupButton = styled.View(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  flex-direction: row;\n"])));
+
+var disabledStyles = function disabledStyles(_ref) {
+  var disabled = _ref.disabled,
+      isActive = _ref.isActive;
+  return disabled && !isActive && css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    background-color: #dcdcdc;\n  "])));
+};
+
+export var getStyledGroupItemText = function getStyledGroupItemText(component) {
+  return styled(component)(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n    color: ", ";\n  "])), function (_ref2) {
+    var active = _ref2.active,
+        theme = _ref2.theme;
+    return active ? theme.miscellaneous.surfaceColor : theme.color.secondary.medium;
+  });
+};
+
+var activeStyles = function activeStyles(_ref3) {
+  var theme = _ref3.theme,
+      isActive = _ref3.isActive,
+      _ref3$activeBorderCol = _ref3.activeBorderColor,
+      activeBorderColor = _ref3$activeBorderCol === void 0 ? 'secondary' : _ref3$activeBorderCol,
+      _ref3$activeBorderCol2 = _ref3.activeBorderColorTone,
+      activeBorderColorTone = _ref3$activeBorderCol2 === void 0 ? 'medium' : _ref3$activeBorderCol2;
+  return isActive && css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n    border-color: ", ";\n  "])), theme === null || theme === void 0 ? void 0 : theme.color[activeBorderColor][activeBorderColorTone]);
+};
+
+var inactiveStyles = function inactiveStyles(_ref4) {
+  var theme = _ref4.theme,
+      isActive = _ref4.isActive,
+      inactiveBackgroundColor = _ref4.inactiveBackgroundColor,
+      inactiveBackgroundColorTone = _ref4.inactiveBackgroundColorTone,
+      _ref4$inactiveBorderC = _ref4.inactiveBorderColor,
+      inactiveBorderColor = _ref4$inactiveBorderC === void 0 ? 'secondary' : _ref4$inactiveBorderC,
+      _ref4$inactiveBorderC2 = _ref4.inactiveBorderColorTone,
+      inactiveBorderColorTone = _ref4$inactiveBorderC2 === void 0 ? 'light' : _ref4$inactiveBorderC2;
+
+  if (!isActive && inactiveBackgroundColor && inactiveBackgroundColorTone) {
+    return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n      border-color: ", ";\n    "])), theme === null || theme === void 0 ? void 0 : theme.color[inactiveBorderColor][inactiveBorderColorTone]);
+  }
+
+  if (!isActive) {
+    return css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n      border-color: ", ";\n    "])), theme === null || theme === void 0 ? void 0 : theme.color[inactiveBorderColor][inactiveBorderColorTone]);
+  }
+};
+
+var leftStyles = function leftStyles(_ref5) {
+  var theme = _ref5.theme,
+      isFirstOption = _ref5.isFirstOption;
+  return isFirstOption && css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteral(["\n    border-top-left-radius: ", ";\n    border-bottom-left-radius: ", ";\n    border-left-width: ", ";\n  "])), theme === null || theme === void 0 ? void 0 : theme.borderRadius.mili, theme === null || theme === void 0 ? void 0 : theme.borderRadius.mili, theme === null || theme === void 0 ? void 0 : theme.borderWidth.pico);
+};
+
+var rightStyles = function rightStyles(_ref6) {
+  var theme = _ref6.theme,
+      isLastOption = _ref6.isLastOption;
+  return isLastOption && css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteral(["\n    border-top-right-radius: ", ";\n    border-bottom-right-radius: ", ";\n    border-right-width: ", ";\n  "])), theme === null || theme === void 0 ? void 0 : theme.borderRadius.mili, theme === null || theme === void 0 ? void 0 : theme.borderRadius.mili, theme === null || theme === void 0 ? void 0 : theme.borderWidth.pico);
+};
+
+var sizeStyles = function sizeStyles(_ref7) {
+  var theme = _ref7.theme,
+      _ref7$buttonSize = _ref7.buttonSize,
+      buttonSize = _ref7$buttonSize === void 0 ? 'small' : _ref7$buttonSize;
+
+  switch (buttonSize) {
+    case 'small':
+      return css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteral(["\n        padding: ", " ", ";\n        min-height: ", ";\n      "])), theme === null || theme === void 0 ? void 0 : theme.spacing.mili, theme === null || theme === void 0 ? void 0 : theme.spacing.deca, RFValueStr('34px'));
+
+    default:
+      return css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteral(["\n        padding: ", " ", ";\n        min-height: ", ";\n      "])), theme === null || theme === void 0 ? void 0 : theme.spacing.mili, theme === null || theme === void 0 ? void 0 : theme.spacing.kilo, RFValueStr('44px'));
+  }
+};
+
+var StyledPressableBase = styled(PressableSurface)(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n  border-top-width: ", ";\n  border-bottom-width: ", ";\n  justify-content: center;\n  align-items: center;\n  flex: 1;\n"])), function (_ref8) {
+  var theme = _ref8.theme;
+  return theme.borderWidth.pico;
+}, function (_ref9) {
+  var theme = _ref9.theme;
+  return theme.borderWidth.pico;
+});
+export var StyledOption = styled.View(_templateObject12 || (_templateObject12 = _taggedTemplateLiteral(["\n  flex-direction: row;\n  flex: 1;\n"])));
+export var StyledDivider = styled.View(_templateObject13 || (_templateObject13 = _taggedTemplateLiteral(["\n  width: ", ";\n  background-color: ", "; ;\n"])), function (_ref10) {
+  var theme = _ref10.theme;
+  return theme.borderWidth.pico;
+}, function (_ref11) {
+  var theme = _ref11.theme;
+  return theme.color.secondary.light;
+});
+export var StyledPressable = styled(StyledPressableBase)(function (props) {
+  return css(_templateObject14 || (_templateObject14 = _taggedTemplateLiteral(["\n    ", "\n    ", "\n    ", "\n    ", "\n    ", "\n    ", "\n  "])), activeStyles(props), inactiveStyles(props), leftStyles(props), rightStyles(props), sizeStyles(props), disabledStyles(props));
+});
+//# sourceMappingURL=styled.js.map

package/esm/components/atoms/GroupButton/styled.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styled.js","names":["styled","css","RFValueStr","PressableSurface","StyledGroupButton","View","disabledStyles","disabled","isActive","getStyledGroupItemText","component","active","theme","miscellaneous","surfaceColor","color","secondary","medium","activeStyles","activeBorderColor","activeBorderColorTone","inactiveStyles","inactiveBackgroundColor","inactiveBackgroundColorTone","inactiveBorderColor","inactiveBorderColorTone","leftStyles","isFirstOption","borderRadius","mili","borderWidth","pico","rightStyles","isLastOption","sizeStyles","buttonSize","spacing","deca","kilo","StyledPressableBase","StyledOption","StyledDivider","light","StyledPressable","props"],"sources":["../../../../src/components/atoms/GroupButton/styled.ts"],"sourcesContent":["import styled, { css } from '@emotion/native';\nimport { FC } from 'react';\nimport { StyleProps } from '../../../types/defaults';\nimport { RFValueStr } from '../../../utils';\nimport { ButtonSizeType } from '../Button';\nimport { PressableSurface } from '../PressableSurface';\nimport { TextProps } from '../Text';\nimport { GroupButtonOptions } from './GroupButton';\nimport { GroupButtonOptionProps } from './GroupButtonOption';\n\ninterface PressableOptions extends GroupButtonOptions {\n  isActive: boolean;\n  isFirstOption: boolean;\n  isLastOption: boolean;\n  buttonSize?: ButtonSizeType;\n}\n\nexport const StyledGroupButton = styled.View<Partial<StyleProps>>`\n  flex-direction: row;\n`;\n\n// TO FIXED: hexa color to theme definitions\nconst disabledStyles = ({\n  disabled,\n  isActive,\n}: PressableOptions & Partial<StyleProps>) =>\n  disabled &&\n  !isActive &&\n  css`\n    background-color: #dcdcdc;\n  `;\n\nexport const getStyledGroupItemText = (component: FC<TextProps>) => {\n  return styled(component)<\n    Partial<GroupButtonOptionProps> & Partial<StyleProps>\n  >`\n    color: ${({ active, theme }) =>\n      active ? theme.miscellaneous.surfaceColor : theme.color.secondary.medium};\n  `;\n};\n\nconst activeStyles = ({\n  theme,\n  isActive,\n  activeBorderColor = 'secondary',\n  activeBorderColorTone = 'medium',\n}: PressableOptions & Partial<StyleProps>) =>\n  isActive &&\n  css`\n    border-color: ${theme?.color[activeBorderColor][activeBorderColorTone]};\n  `;\n\nconst inactiveStyles = ({\n  theme,\n  isActive,\n  inactiveBackgroundColor,\n  inactiveBackgroundColorTone,\n  inactiveBorderColor = 'secondary',\n  inactiveBorderColorTone = 'light',\n}: PressableOptions & Partial<StyleProps>) => {\n  if (!isActive && inactiveBackgroundColor && inactiveBackgroundColorTone) {\n    return css`\n      border-color: ${theme?.color[inactiveBorderColor][\n        inactiveBorderColorTone\n      ]};\n    `;\n  }\n\n  if (!isActive) {\n    return css`\n      border-color: ${theme?.color[inactiveBorderColor][\n        inactiveBorderColorTone\n      ]};\n    `;\n  }\n};\n\nconst leftStyles = ({\n  theme,\n  isFirstOption,\n}: PressableOptions & Partial<StyleProps>) =>\n  isFirstOption &&\n  css`\n    border-top-left-radius: ${theme?.borderRadius.mili};\n    border-bottom-left-radius: ${theme?.borderRadius.mili};\n    border-left-width: ${theme?.borderWidth.pico};\n  `;\n\nconst rightStyles = ({\n  theme,\n  isLastOption,\n}: PressableOptions & Partial<StyleProps>) =>\n  isLastOption &&\n  css`\n    border-top-right-radius: ${theme?.borderRadius.mili};\n    border-bottom-right-radius: ${theme?.borderRadius.mili};\n    border-right-width: ${theme?.borderWidth.pico};\n  `;\n\nconst sizeStyles = ({\n  theme,\n  buttonSize = 'small',\n}: PressableOptions & Partial<StyleProps>) => {\n  switch (buttonSize) {\n    case 'small':\n      return css`\n        padding: ${theme?.spacing.mili} ${theme?.spacing.deca};\n        min-height: ${RFValueStr('34px')};\n      `;\n    default:\n      return css`\n        padding: ${theme?.spacing.mili} ${theme?.spacing.kilo};\n        min-height: ${RFValueStr('44px')};\n      `;\n  }\n};\n\nconst StyledPressableBase = styled(PressableSurface)<\n  PressableOptions & Partial<StyleProps>\n>`\n  border-top-width: ${({ theme }) => theme.borderWidth.pico};\n  border-bottom-width: ${({ theme }) => theme.borderWidth.pico};\n  justify-content: center;\n  align-items: center;\n  flex: 1;\n`;\n\nexport const StyledOption = styled.View`\n  flex-direction: row;\n  flex: 1;\n`;\n\nexport const StyledDivider = styled.View<Partial<StyleProps>>`\n  width: ${({ theme }) => theme.borderWidth.pico};\n  background-color: ${({ theme }) => theme.color.secondary.light}; ;\n`;\n\nexport const StyledPressable = styled(StyledPressableBase)(\n  (props: PressableOptions & Partial<StyleProps>) => css`\n    ${activeStyles(props)}\n    ${inactiveStyles(props)}\n    ${leftStyles(props)}\n    ${rightStyles(props)}\n    ${sizeStyles(props)}\n    ${disabledStyles(props)}\n  `\n);\n"],"mappings":"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"}

package/esm/components/atoms/Icon/Icon.d.ts

@@ -0,0 +1,14 @@
+import { FC } from 'react';
+import { StyleProp, TextStyle } from 'react-native';
+import { ColorGradationType, ColorType, FontColorType, IconSizeType, IconType } from '@tecsinapse/react-core';
+export interface IconProps {
+    name: string;
+    size?: IconSizeType;
+    type: IconType;
+    fontColor?: FontColorType;
+    colorVariant?: ColorType;
+    colorTone?: ColorGradationType;
+    style?: StyleProp<TextStyle>;
+}
+declare const Icon: FC<IconProps>;
+export default Icon;

package/esm/components/atoms/Icon/Icon.js

@@ -0,0 +1,37 @@
+var _excluded = ["name", "size", "type", "style", "fontColor", "colorVariant", "colorTone"];
+
+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; }
+
+import React from 'react';
+import { useTheme } from '@emotion/react';
+import { getIconColor, getIconComponent } from './helpers';
+
+var Icon = function Icon(_ref) {
+  var name = _ref.name,
+      _ref$size = _ref.size,
+      size = _ref$size === void 0 ? 'centi' : _ref$size,
+      type = _ref.type,
+      style = _ref.style,
+      _ref$fontColor = _ref.fontColor,
+      fontColor = _ref$fontColor === void 0 ? 'dark' : _ref$fontColor,
+      colorVariant = _ref.colorVariant,
+      _ref$colorTone = _ref.colorTone,
+      colorTone = _ref$colorTone === void 0 ? 'medium' : _ref$colorTone,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
+  var theme = useTheme();
+  var color = getIconColor(colorVariant, colorTone, fontColor, theme);
+  var RNVIcon = getIconComponent(type, size);
+  return React.createElement(RNVIcon, _extends({}, rest, {
+    style: style,
+    name: name,
+    color: color
+  }));
+};
+
+export default Icon;
+//# sourceMappingURL=Icon.js.map

package/esm/components/atoms/Icon/Icon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Icon.js","names":["React","useTheme","getIconColor","getIconComponent","Icon","name","size","type","style","fontColor","colorVariant","colorTone","rest","theme","color","RNVIcon"],"sources":["../../../../src/components/atoms/Icon/Icon.tsx"],"sourcesContent":["import React, { FC } from 'react';\nimport { StyleProp, TextStyle } from 'react-native';\nimport { useTheme } from '@emotion/react';\nimport {\n  ColorGradationType,\n  ColorType,\n  FontColorType,\n  IconSizeType,\n  IconType,\n  ThemeProp,\n} from '@tecsinapse/react-core';\nimport { getIconColor, getIconComponent } from './helpers';\n\nexport interface IconProps {\n  /**  Name of the icon. You must use the same icons from react-native-vector-icons */\n  name: string;\n  /**  Default icon sizes from theme */\n  size?: IconSizeType;\n  /**  Icon family. You must use the same icons from react-native-vector-icons */\n  type: IconType;\n  /** Font theme fill color */\n  fontColor?: FontColorType;\n  /** Palette theme fill color */\n  colorVariant?: ColorType;\n  /** Palette theme gradation fill color */\n  colorTone?: ColorGradationType;\n  style?: StyleProp<TextStyle>;\n}\n\n/** NOTE: When using colors, the order matters if you're trying to merge multiple types. */\nconst Icon: FC<IconProps> = ({\n  name,\n  size = 'centi',\n  type,\n  style,\n  fontColor = 'dark',\n  colorVariant,\n  colorTone = 'medium',\n  ...rest\n}) => {\n  const theme = useTheme() as ThemeProp;\n  const color = getIconColor(colorVariant, colorTone, fontColor, theme);\n  const RNVIcon = getIconComponent(type, size);\n\n  return <RNVIcon {...rest} style={style} name={name} color={color} />;\n};\n\nexport default Icon;\n"],"mappings":";;;;;;;;AAAA,OAAOA,KAAP,MAA0B,OAA1B;AAEA,SAASC,QAAT,QAAyB,gBAAzB;AASA,SAASC,YAAT,EAAuBC,gBAAvB,QAA+C,WAA/C;;AAmBA,IAAMC,IAAmB,GAAG,SAAtBA,IAAsB,OAStB;EAAA,IARJC,IAQI,QARJA,IAQI;EAAA,qBAPJC,IAOI;EAAA,IAPJA,IAOI,0BAPG,OAOH;EAAA,IANJC,IAMI,QANJA,IAMI;EAAA,IALJC,KAKI,QALJA,KAKI;EAAA,0BAJJC,SAII;EAAA,IAJJA,SAII,+BAJQ,MAIR;EAAA,IAHJC,YAGI,QAHJA,YAGI;EAAA,0BAFJC,SAEI;EAAA,IAFJA,SAEI,+BAFQ,QAER;EAAA,IADDC,IACC;;EACJ,IAAMC,KAAK,GAAGZ,QAAQ,EAAtB;EACA,IAAMa,KAAK,GAAGZ,YAAY,CAACQ,YAAD,EAAeC,SAAf,EAA0BF,SAA1B,EAAqCI,KAArC,CAA1B;EACA,IAAME,OAAO,GAAGZ,gBAAgB,CAACI,IAAD,EAAOD,IAAP,CAAhC;EAEA,OAAO,oBAAC,OAAD,eAAaM,IAAb;IAAmB,KAAK,EAAEJ,KAA1B;IAAiC,IAAI,EAAEH,IAAvC;IAA6C,KAAK,EAAES;EAApD,GAAP;AACD,CAfD;;AAiBA,eAAeV,IAAf"}

package/esm/components/atoms/Icon/helpers.d.ts

@@ -0,0 +1,4 @@
+import { ColorGradationType, ColorType, FontColorType, IconSizeType, IconType, ThemeProp } from '@tecsinapse/react-core';
+export declare const registerCustomIconType: (id: string, customIcon: any) => void;
+export declare const getIconComponent: (type: IconType, size: IconSizeType) => any;
+export declare const getIconColor: (colorVariant: ColorType | undefined, colorGradation: ColorGradationType | undefined, fontColor: FontColorType, theme: ThemeProp) => string;

package/esm/components/atoms/Icon/helpers.js

@@ -0,0 +1,78 @@
+var _templateObject;
+
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+
+import styled from '@emotion/native';
+var customIcons = {};
+export var registerCustomIconType = function registerCustomIconType(id, customIcon) {
+  customIcons[id] = customIcon;
+};
+
+var getStyledIcon = function getStyledIcon(Component, size) {
+  return styled(Component)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  font-size: ", ";\n  text-align: center;\n"])), function (_ref) {
+    var theme = _ref.theme;
+    return theme.iconSize[size];
+  });
+};
+
+export var getIconComponent = function getIconComponent(type, size) {
+  switch (type) {
+    case 'zocial':
+      return getStyledIcon(require('react-native-vector-icons/dist/Zocial')["default"], size);
+
+    case 'octicon':
+      return getStyledIcon(require('react-native-vector-icons/dist/Octicons')["default"], size);
+
+    case 'material':
+      return getStyledIcon(require('react-native-vector-icons/dist/MaterialIcons')["default"], size);
+
+    case 'material-community':
+      return getStyledIcon(require('react-native-vector-icons/dist/MaterialCommunityIcons')["default"], size);
+
+    case 'ionicon':
+      return getStyledIcon(require('react-native-vector-icons/dist/Ionicons')["default"], size);
+
+    case 'foundation':
+      return getStyledIcon(require('react-native-vector-icons/dist/Foundation')["default"], size);
+
+    case 'evilicon':
+      return getStyledIcon(require('react-native-vector-icons/dist/EvilIcons')["default"], size);
+
+    case 'entypo':
+      return getStyledIcon(require('react-native-vector-icons/dist/Entypo')["default"], size);
+
+    case 'font-awesome':
+      return getStyledIcon(require('react-native-vector-icons/dist/FontAwesome')["default"], size);
+
+    case 'font-awesome-5':
+      return getStyledIcon(require('react-native-vector-icons/dist/FontAwesome5')["default"], size);
+
+    case 'simple-line-icon':
+      return getStyledIcon(require('react-native-vector-icons/dist/SimpleLineIcons')["default"], size);
+
+    case 'feather':
+      return getStyledIcon(require('react-native-vector-icons/dist/Feather')["default"], size);
+
+    case 'antdesign':
+    case 'ant-design':
+      return getStyledIcon(require('react-native-vector-icons/dist/AntDesign')["default"], size);
+
+    case 'fontisto':
+      return getStyledIcon(require('react-native-vector-icons/dist/Fontisto')["default"], size);
+
+    default:
+      if (Object.prototype.hasOwnProperty.call(customIcons, type)) {
+        return getStyledIcon(customIcons[type], size);
+      }
+
+      return getStyledIcon(require('react-native-vector-icons/dist/MaterialIcons')["default"], size);
+  }
+};
+export var getIconColor = function getIconColor(colorVariant, colorGradation, fontColor, theme) {
+  if (colorVariant && colorGradation) {
+    return theme.color[colorVariant][colorGradation];
+  }
+
+  return theme.font.color[fontColor];
+};
+//# sourceMappingURL=helpers.js.map

package/esm/components/atoms/Icon/helpers.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"helpers.js","names":["styled","customIcons","registerCustomIconType","id","customIcon","getStyledIcon","Component","size","theme","iconSize","getIconComponent","type","require","Object","prototype","hasOwnProperty","call","getIconColor","colorVariant","colorGradation","fontColor","color","font"],"sources":["../../../../src/components/atoms/Icon/helpers.ts"],"sourcesContent":["import {\n  ColorGradationType,\n  ColorType,\n  FontColorType,\n  IconSizeType,\n  IconType,\n  ThemeProp,\n} from '@tecsinapse/react-core';\nimport styled from '@emotion/native';\n\n/* eslint-disable */\nconst customIcons: any = {};\n\nexport const registerCustomIconType = (id: string, customIcon: any) => {\n  customIcons[id] = customIcon;\n};\n\nconst getStyledIcon = (Component, size) => styled(Component)`\n  font-size: ${({ theme }) => theme.iconSize[size]};\n  text-align: center;\n`;\n\nexport const getIconComponent = (type: IconType, size: IconSizeType): any => {\n  switch (type) {\n    case 'zocial':\n      return getStyledIcon(\n        require('react-native-vector-icons/dist/Zocial').default,\n        size\n      );\n    case 'octicon':\n      return getStyledIcon(\n        require('react-native-vector-icons/dist/Octicons').default,\n        size\n      );\n    case 'material':\n      return getStyledIcon(\n        require('react-native-vector-icons/dist/MaterialIcons').default,\n        size\n      );\n    case 'material-community':\n      return getStyledIcon(\n        require('react-native-vector-icons/dist/MaterialCommunityIcons')\n          .default,\n        size\n      );\n    case 'ionicon':\n      return getStyledIcon(\n        require('react-native-vector-icons/dist/Ionicons').default,\n        size\n      );\n    case 'foundation':\n      return getStyledIcon(\n        require('react-native-vector-icons/dist/Foundation').default,\n        size\n      );\n    case 'evilicon':\n      return getStyledIcon(\n        require('react-native-vector-icons/dist/EvilIcons').default,\n        size\n      );\n    case 'entypo':\n      return getStyledIcon(\n        require('react-native-vector-icons/dist/Entypo').default,\n        size\n      );\n    case 'font-awesome':\n      return getStyledIcon(\n        require('react-native-vector-icons/dist/FontAwesome').default,\n        size\n      );\n    case 'font-awesome-5':\n      return getStyledIcon(\n        require('react-native-vector-icons/dist/FontAwesome5').default,\n        size\n      );\n    case 'simple-line-icon':\n      return getStyledIcon(\n        require('react-native-vector-icons/dist/SimpleLineIcons').default,\n        size\n      );\n    case 'feather':\n      return getStyledIcon(\n        require('react-native-vector-icons/dist/Feather').default,\n        size\n      );\n    case 'antdesign':\n    case 'ant-design':\n      return getStyledIcon(\n        require('react-native-vector-icons/dist/AntDesign').default,\n        size\n      );\n    case 'fontisto':\n      return getStyledIcon(\n        require('react-native-vector-icons/dist/Fontisto').default,\n        size\n      );\n    default:\n      if (Object.prototype.hasOwnProperty.call(customIcons, type)) {\n        return getStyledIcon(customIcons[type], size);\n      }\n      return getStyledIcon(\n        require('react-native-vector-icons/dist/MaterialIcons').default,\n        size\n      );\n  }\n};\n/* eslint-enable */\nexport const getIconColor = (\n  colorVariant: ColorType | undefined,\n  colorGradation: ColorGradationType | undefined,\n  fontColor: FontColorType,\n  theme: ThemeProp\n): string => {\n  if (colorVariant && colorGradation) {\n    return theme.color[colorVariant][colorGradation];\n  }\n  return theme.font.color[fontColor];\n};\n"],"mappings":"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"}

package/esm/components/atoms/Icon/index.d.ts

@@ -0,0 +1,2 @@
+export { default as Icon } from './Icon';
+export type { IconProps } from './Icon';

package/esm/components/atoms/Icon/index.js

@@ -0,0 +1,2 @@
+export { default as Icon } from './Icon';
+//# sourceMappingURL=index.js.map

package/esm/components/atoms/Icon/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["default","Icon"],"sources":["../../../../src/components/atoms/Icon/index.ts"],"sourcesContent":["export { default as Icon } from './Icon';\nexport type { IconProps } from './Icon';\n"],"mappings":"AAAA,SAASA,OAAO,IAAIC,IAApB,QAAgC,QAAhC"}

package/esm/components/atoms/Input/Hint.d.ts

@@ -0,0 +1,10 @@
+import { FC } from 'react';
+import { InputVariantType } from '../Input';
+import { TextProps } from '../Text';
+interface HintProps {
+    text?: string;
+    variant: InputVariantType;
+    TextComponent?: FC<TextProps>;
+}
+declare const Hint: FC<HintProps>;
+export default Hint;

package/esm/components/atoms/Input/Hint.js

@@ -0,0 +1,41 @@
+import React from 'react';
+import { Text } from '../Text';
+import { StyledHintContainer, StyledHintIcon } from './styled';
+
+var Hint = function Hint(_ref) {
+  var variant = _ref.variant,
+      text = _ref.text,
+      _ref$TextComponent = _ref.TextComponent,
+      TextComponent = _ref$TextComponent === void 0 ? Text : _ref$TextComponent;
+  var color;
+  var icon;
+
+  switch (variant) {
+    case 'default':
+      color = 'secondary';
+      break;
+
+    case 'error':
+      color = 'error';
+      icon = 'close-circle-outline';
+      break;
+
+    case 'success':
+      color = 'success';
+      icon = 'checkmark-circle-outline';
+      break;
+  }
+
+  return React.createElement(StyledHintContainer, null, icon && React.createElement(StyledHintIcon, {
+    name: icon,
+    type: "ionicon",
+    size: "centi",
+    colorVariant: color
+  }), React.createElement(TextComponent, {
+    typography: "label",
+    colorVariant: color
+  }, text));
+};
+
+export default Hint;
+//# sourceMappingURL=Hint.js.map

package/esm/components/atoms/Input/Hint.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Hint.js","names":["React","Text","StyledHintContainer","StyledHintIcon","Hint","variant","text","TextComponent","color","icon"],"sources":["../../../../src/components/atoms/Input/Hint.tsx"],"sourcesContent":["import React, { FC } from 'react';\nimport { ColorType } from '../../../types/defaults';\nimport { InputVariantType } from '../Input';\nimport { Text, TextProps } from '../Text';\nimport { StyledHintContainer, StyledHintIcon } from './styled';\n\ninterface HintProps {\n  text?: string;\n  variant: InputVariantType;\n  TextComponent?: FC<TextProps>;\n}\n\nconst Hint: FC<HintProps> = ({ variant, text, TextComponent = Text }) => {\n  let color: ColorType;\n  let icon;\n\n  switch (variant) {\n    case 'default':\n      color = 'secondary';\n      break;\n    case 'error':\n      color = 'error';\n      icon = 'close-circle-outline';\n      break;\n    case 'success':\n      color = 'success';\n      icon = 'checkmark-circle-outline';\n      break;\n  }\n\n  return (\n    <StyledHintContainer>\n      {icon && (\n        <StyledHintIcon\n          name={icon}\n          type=\"ionicon\"\n          size=\"centi\"\n          colorVariant={color}\n        />\n      )}\n      <TextComponent typography=\"label\" colorVariant={color}>\n        {text}\n      </TextComponent>\n    </StyledHintContainer>\n  );\n};\n\nexport default Hint;\n"],"mappings":"AAAA,OAAOA,KAAP,MAA0B,OAA1B;AAGA,SAASC,IAAT,QAAgC,SAAhC;AACA,SAASC,mBAAT,EAA8BC,cAA9B,QAAoD,UAApD;;AAQA,IAAMC,IAAmB,GAAG,SAAtBA,IAAsB,OAA6C;EAAA,IAA1CC,OAA0C,QAA1CA,OAA0C;EAAA,IAAjCC,IAAiC,QAAjCA,IAAiC;EAAA,8BAA3BC,aAA2B;EAAA,IAA3BA,aAA2B,mCAAXN,IAAW;EACvE,IAAIO,KAAJ;EACA,IAAIC,IAAJ;;EAEA,QAAQJ,OAAR;IACE,KAAK,SAAL;MACEG,KAAK,GAAG,WAAR;MACA;;IACF,KAAK,OAAL;MACEA,KAAK,GAAG,OAAR;MACAC,IAAI,GAAG,sBAAP;MACA;;IACF,KAAK,SAAL;MACED,KAAK,GAAG,SAAR;MACAC,IAAI,GAAG,0BAAP;MACA;EAXJ;;EAcA,OACE,oBAAC,mBAAD,QACGA,IAAI,IACH,oBAAC,cAAD;IACE,IAAI,EAAEA,IADR;IAEE,IAAI,EAAC,SAFP;IAGE,IAAI,EAAC,OAHP;IAIE,YAAY,EAAED;EAJhB,EAFJ,EASE,oBAAC,aAAD;IAAe,UAAU,EAAC,OAA1B;IAAkC,YAAY,EAAEA;EAAhD,GACGF,IADH,CATF,CADF;AAeD,CAjCD;;AAmCA,eAAeF,IAAf"}

package/esm/components/atoms/Input/InputContainer/InputContainer.d.ts

@@ -0,0 +1,29 @@
+import { FC } from 'react';
+import { StyleProp, ViewStyle } from 'react-native';
+import { InputElementProps } from '..';
+import { ColorGradationType, ColorType, FontColorType, FontStackType, FontWeightType, TypographyVariationType } from '@tecsinapse/react-core';
+import { TextProps } from '../../Text';
+export declare type InputVariantType = 'default' | 'error' | 'success';
+export interface InputContainerProps {
+    label?: string;
+    labelColor?: FontColorType;
+    labelColorVariant?: ColorType;
+    labelColorTone?: ColorGradationType;
+    labelTypography?: TypographyVariationType;
+    labelStack?: FontStackType;
+    LabelComponent?: FC<TextProps>;
+    labelWeight?: FontWeightType;
+    leftComponent?: JSX.Element;
+    rightComponent?: JSX.Element;
+    borderColor?: ColorType;
+    borderColorGradation?: ColorGradationType;
+    style?: StyleProp<ViewStyle>;
+    inputContainerStyle?: StyleProp<ViewStyle>;
+    focused?: boolean;
+    disabled?: boolean;
+    variant?: InputVariantType;
+    hint?: string;
+    hintComponent?: JSX.Element;
+}
+declare const InputContainer: FC<InputContainerProps & Partial<InputElementProps>>;
+export default InputContainer;