Feature/updates and improvements #13
Merged
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
added 28 commits
June 7, 2024 13:26
This commit introduces a new feature, the InputSignature component, which allows users to provide their signatures as input. The component is implemented in both controlled and uncontrolled versions, and utilizes a custom hook, useDraw, for handling the drawing functionality. Key additions include: inputSignatureUncontrolled.tsx: Uncontrolled version of the InputSignature component, which manages its own state. inputSignatureControlled.tsx: Controlled version of the InputSignature component, which expects state to be managed by the parent component. useDraw.tsx: Custom hook providing drawing functionality for the InputSignature component. inputSignature.test.tsx and useDraw.test.tsx: Test suites for the InputSignature component and useDraw hook. inputSignature.styled.ts: Styles for the InputSignature component. inputSignature.stories.tsx and argTypes.ts: Storybook story and argTypes for the InputSignature component. index.ts: Exports for the InputSignature component, its types, and the useDraw hook. This feature enhances the application's user interaction capabilities by allowing signature inputs.
This commit replaces the global structuredClone function with a utility function that leverages the browser's built-in structuredClone method when available. In cases where the browser does not support the structuredClone method, the utility function falls back to using the @ungap/structured-clone package. This change ensures broader compatibility and reliability of the structuredClone functionality across different browser environments.
This commit replaces the global structuredClone function with a utility function that leverages the browser's built-in structuredClone method when available. In cases where the browser does not support the structuredClone method, the utility function falls back to using the @ungap/structured-clone package. This change ensures broader compatibility and reliability of the structuredClone functionality across different browser environments.
This commit addresses an issue with the carousel component when no elements are present. Previously, the carousel would break or behave unexpectedly if it was empty. With this fix, the carousel now handles the scenario of having no elements gracefully, ensuring a smooth user experience regardless of the number of elements in the carousel.
This commit enhances the behavior of the dropdown component by automatically closing it when its visibility changes. This ensures a more intuitive user experience, as the dropdown will no longer remain open when it's not visible, improving the overall usability of the interface.
This commit enhances the behavior of the dropdown component by automatically closing it when its visibility changes. This ensures a more intuitive user experience, as the dropdown will no longer remain open when it's not visible, improving the overall usability of the interface.
This commit introduces a new lastChild property to the RadioButton component and its associated interfaces. This property is used to control the bottom margin of each radio button in a group, ensuring that the last radio button does not have a bottom margin. Key changes include: radioButton.styled.ts: Added a new lastChild optional property to the IRadioButtonContentStyled interface. This property is then used in the RadioButtonStyled component to conditionally apply a bottom margin. radioButtonStandAlone.tsx: The RadioButtonStandAlone component now accepts a lastChild prop and passes it to the RadioButtonStyled component. radioButton.ts: The IRadioButtonStandAlone interface has been updated to include the lastChild optional property. radioButtonGroupStandAlone.tsx: The RadioButtonGroupStandAloneComponent now calculates whether each option is the last child and passes the result as the lastChild prop to the RadioButtonStandAlone component. This change improves the visual consistency and spacing within radio button groups.
This commit focuses on improving the code readability and user interface of the application. The changes are primarily in the ErrorMessageStandAlone component and the style properties. Key changes include: errorMessage.tsx: Refactored the rendering of error messages and error icons to improve readability. This change simplifies the conditional rendering by checking for an error state before rendering the error icon and message. input.stories.tsx: Removed the icon property from commonArgs, shifting towards using leftIcon and rightIcon properties for icon placement. styles.ts: Updated padding and alignment properties in commonProps for better alignment and spacing. This includes changing the padding property in inputContainer, updating the text_align property in helpMessage, and adjusting the left and right properties in inputIconContainerRight and inputIconContainerLeft to use constants from SPACINGS. input.mixin.ts: Modified the getIconPadding function to ensure the padding is correctly calculated when only one value is provided. These changes enhance the readability of the code and the user interface, leading to a better user experience and easier maintenance.
This commit addresses two issues with the Link component: the 'font-weight' and 'color' props were not functioning correctly. When a user set a different value from the default in Storybook, the changes were not reflected visually in the component. Key changes include: link.tsx: Added receipt of 'weight' value via props. Previously, the 'styles.container' object wasn't storing the 'weight' value, so it was always undefined. link.styled.ts: Included 'applyDevicePropsTextStyles' function to link's style. The 'color' is a text property and needs to be applied by 'TextStylesExtended' styles const. These changes ensure that the 'font-weight' and 'color' props of the Link component function as expected, improving the component's flexibility and usability.
This commit introduces a new prefixNode prop to the InputPhone component. This new prop enhances the flexibility of the component, allowing users to add a custom prefix node to the input field. This can be particularly useful for displaying additional information or customizing the input field's appearance.
This commit involves significant changes to the Message component and related files, with a focus on enhancing flexibility and readability. Key changes include the refactoring of styled components, code simplification, and updates to the Storybook file and styles. Key changes include: message.styled.ts: Refactored MessageHeaderStyled and ButtonSectionStyled to include style props, allowing for more flexible styling. messageStandAlone.tsx: Removed unnecessary div elements and restructured the MessageStandAloneComponent to simplify the code and improve readability. message.stories.tsx: Updated the Storybook file to include new props such as infoIcon, closeIcon, actionButton, and tag. styles.ts: Adjusted the commonProps object to modify the flex direction and gap of the container and headerContainer styles, and added a new buttonSectionContainer style. messageTheme.ts: Added a buttonSectionContainer to the MessagePropsThemeType to allow for styling of the button section container. message.ts: Changed the content prop type from string | ReactNode to React.ReactNode to allow for more flexibility in the type of content that can be passed. These changes improve the flexibility and readability of the Message component, enhancing its usability and maintainability.
Include new helper to modify align and background for cells and header
This commit enhances the InputCurrencyStandAloneComponent and its associated types, allowing for more flexible styling options. The changes introduce optional extra styles for different positions (top, bottom, left, right, center). Key changes include: inputCurrencyStandAlone.tsx: The InputCurrencyStandAloneComponent has been updated to check if there are any specific styles defined for different positions in the props. If these styles are not defined, it falls back to the default getExtraStyles function. inputCurrencyTheme.ts: New optional style properties (leftExtraStyles, centerExtraStyles, rightExtraStyles, topExtraStyles, bottomExtraStyles) have been added to the InputCurrencyStateProps type. These properties accept CSS props, allowing for custom styles to be applied to the different positions of the InputCurrencyStandAloneComponent. These changes provide more flexibility in styling the InputCurrencyStandAloneComponent, enhancing its usability and adaptability.
Improve types for useInput and tooltipUncontrolled
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
No description provided.