@ttoss/forms 0.25.6 → 0.26.1

package/src/MultistepForm/MultistepHeader.tsx

@@ -1,78 +0,0 @@
-import { CloseButton, Flex, Image, Text } from '@ttoss/ui';
-import { Icon, type IconType } from '@ttoss/react-icons';
-
-type MultistepHeaderTitledProps = {
-  variant: 'titled';
-  title: string;
-  leftIcon: IconType;
-  rightIcon: IconType;
-  onLeftIconClick: () => void;
-  onRightIconClick: () => void;
-};
-
-const MultistepHeaderTitled = ({
-  title,
-  leftIcon,
-  onLeftIconClick,
-  rightIcon,
-  onRightIconClick,
-}: MultistepHeaderTitledProps) => {
-  return (
-    <Flex
-      sx={{
-        display: 'flex',
-        justifyContent: 'space-between',
-        paddingX: 'xl',
-        paddingY: 'lg',
-        alignItems: 'center',
-      }}
-    >
-      <Icon icon={leftIcon} onClick={onLeftIconClick} />
-      <Text sx={{ fontWeight: 'bold', fontSize: 'lg' }}>{title}</Text>
-      <Icon icon={rightIcon} onClick={onRightIconClick} />
-    </Flex>
-  );
-};
-
-type MultistepHeaderLogoProps = {
-  variant: 'logo';
-  src: string;
-  onClose?: () => void;
-};
-
-const MultistepHeaderLogo = ({ onClose, src }: MultistepHeaderLogoProps) => {
-  return (
-    <Flex
-      sx={{
-        justifyContent: 'space-between',
-        alignItems: 'center',
-        paddingX: 'xl',
-        paddingY: 'lg',
-      }}
-    >
-      <Image
-        width={115}
-        height={32}
-        sx={{ objectFit: 'cover', width: 115, height: 32 }}
-        src={src}
-      />
-      {onClose && <CloseButton onClick={onClose} />}
-    </Flex>
-  );
-};
-
-export type MultistepHeaderProps =
-  | MultistepHeaderLogoProps
-  | MultistepHeaderTitledProps;
-
-export const MultistepHeader = (props: MultistepHeaderProps) => {
-  if (props.variant === 'logo') {
-    return <MultistepHeaderLogo {...props} />;
-  }
-
-  if (props.variant === 'titled') {
-    return <MultistepHeaderTitled {...props} />;
-  }
-
-  return null;
-};

package/src/MultistepForm/MultistepNavigation.tsx

@@ -1,38 +0,0 @@
-import { Flex, Text } from '@ttoss/ui';
-import { Icon } from '@ttoss/react-icons';
-
-export type MultistepNavigationProps = {
-  amountOfSteps: number;
-  currentStepNumber: number;
-  onBack: () => void;
-  stepsLabel: string[];
-};
-
-export const MultistepNavigation = ({
-  amountOfSteps,
-  currentStepNumber,
-  onBack,
-  stepsLabel,
-}: MultistepNavigationProps) => {
-  return (
-    <Flex
-      sx={{
-        justifyContent: 'space-between',
-        marginX: '2xl',
-      }}
-    >
-      <Flex onClick={onBack} sx={{ alignItems: 'center', cursor: 'pointer' }}>
-        <Text sx={{ color: '#ACADB7', display: 'flex' }}>
-          <Icon icon="nav-left" />
-        </Text>
-        <Text sx={{ color: '#ACADB7' }}>
-          {stepsLabel[currentStepNumber - 2]}
-        </Text>
-      </Flex>
-
-      <Text sx={{ alignItems: 'center', color: '#ACADB7' }}>
-        {currentStepNumber}/{amountOfSteps}
-      </Text>
-    </Flex>
-  );
-};

package/src/MultistepForm/MultistepQuestion.tsx

@@ -1,28 +0,0 @@
-import * as React from 'react';
-import { Flex, Text } from '@ttoss/ui';
-
-type MultistepQuestionProps = {
-  question: string;
-  fields: React.ReactNode | React.ReactNode[];
-};
-
-export const MultistepQuestion = ({
-  fields,
-  question,
-}: MultistepQuestionProps) => {
-  return (
-    <Flex
-      sx={{
-        flexDirection: 'column',
-        paddingTop: 'xl',
-        paddingX: '2xl',
-      }}
-    >
-      <Text sx={{ textAlign: 'center', fontSize: 'lg', marginBottom: 'xl' }}>
-        {question}
-      </Text>
-
-      <Flex sx={{ flexDirection: 'column', gap: 'xl' }}>{fields}</Flex>
-    </Flex>
-  );
-};

package/src/MultistepForm/index.ts

@@ -1 +0,0 @@
-export { MultistepForm, type MultistepFormProps } from './MultistepForm';

package/src/MultistepForm/types.ts

@@ -1,7 +0,0 @@
-export type MultistepFlowMessageVariant =
-  | 'image-text'
-  | 'heading-and-subheading';
-
-export type MultistepFlowMessageBase = {
-  variant: MultistepFlowMessageVariant;
-};

package/src/index.ts

@@ -1,35 +0,0 @@
-export { yupResolver } from '@hookform/resolvers/yup';
-export { yup } from './yup/yup';
-
-export { Form } from './Form';
-export { FormErrorMessage } from './FormErrorMessage';
-export { FormField } from './FormField';
-export { FormFieldCheckbox } from './FormFieldCheckbox';
-export { FormFieldCreditCardNumber } from './FormFieldCreditCardNumber';
-export { FormFieldNumericFormat } from './FormFieldNumericFormat';
-export { FormFieldPatternFormat } from './FormFieldPatternFormat';
-export { FormFieldCurrencyInput } from './FormFieldCurrencyInput';
-export { FormFieldInput } from './FormFieldInput';
-export { FormFieldPassword } from './FormFieldPassword';
-export { FormFieldRadio } from './FormFieldRadio';
-export { FormFieldSelect } from './FormFieldSelect';
-export { FormFieldTextarea } from './FormFieldTextarea';
-export { FormGroup, useFormGroup } from './FormGroup';
-
-/**
- * Export everything from react-hook-form without using export *
- * https://github.com/evanw/esbuild/issues/1737
- */
-export {
-  useForm,
-  useFormContext,
-  useWatch,
-  useFieldArray,
-  useController,
-  useFormState,
-  Controller,
-  FormProvider,
-} from 'react-hook-form';
-
-// Export types
-export * from 'react-hook-form';

package/src/yup/i18n.ts

@@ -1,31 +0,0 @@
-import { defineMessage } from '@ttoss/react-i18n';
-import { setLocale } from 'yup';
-
-setLocale({
-  mixed: {
-    required: defineMessage({
-      defaultMessage: 'Field is required',
-      description: 'Field is required',
-    }),
-    notType: ({ type }) => {
-      return {
-        ...defineMessage({
-          defaultMessage: 'Invalid Value for Field of type {type}',
-          description: 'Invalid Value',
-        }),
-        values: { type },
-      };
-    },
-  },
-  string: {
-    min: ({ min }) => {
-      return {
-        ...defineMessage({
-          defaultMessage: 'Field must be at least {min} characters',
-          description: 'Min length field',
-        }),
-        values: { min },
-      };
-    },
-  },
-});

package/src/yup/schema.ts

@@ -1,26 +0,0 @@
-import * as yup from 'yup';
-import { isCnpjValid } from '../Brazil/FormFieldCNPJ';
-/**
- * Need this import to extend yup types on build time.
- */
-import './typings.d';
-
-yup.addMethod(yup.string, 'cnpj', function () {
-  return this.test('valid-cnpj', 'Invalid CNPJ', (value) => {
-    return isCnpjValid(value);
-  });
-});
-
-yup.addMethod(
-  yup.string,
-  'password',
-  function ({ required }: { required?: boolean } = {}) {
-    const schema = this.trim();
-
-    if (required) {
-      schema.required('Password is required');
-    }
-
-    return schema.min(8, 'Password must be at least 8 characters long');
-  }
-);

package/src/yup/yup.ts

@@ -1,4 +0,0 @@
-import './i18n';
-import './schema';
-
-export * as yup from 'yup';