Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Updated the change log and fix datepicker component UI #236

Merged
merged 7 commits into from
Dec 30, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 5 additions & 1 deletion changelog.txt
Original file line number Diff line number Diff line change
@@ -1,9 +1,13 @@
Version 1.3.4 - 27th December, 2024
Version 1.3.4 - 30th December, 2024
- Improvement - Enhanced the UI of the Table and Line chart component for responsive design.
- Improvement - Added option group to the Select component.
- Improvement - Updated the Table component design.
- Improvement - Added support for controlling selected dates through the 'selected' prop in DatePicker component.
- Fixed - Adjusted search icon size in Select combobox for better visual consistency.
- Fixed - Focus ring offset of Select, Switch, Checkbox, and dropdown component.
- Fixed - Checkbox/Switch toggle behavior with hint text and adjusted help text size.
- Fixed - DatePicker component crash when navigating through years.
- Fixed - DatePicker component UI styles for better visual consistency.

Version 1.3.3 - 20th December, 2024
- Fixed - React `Each child in a list should have a unique "key" prop` console warning.
Expand Down
4 changes: 2 additions & 2 deletions src/components/datepicker/datepicker-component.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -361,7 +361,7 @@ const DatePickerComponent = ( {

// Common class for disabled outside days
const disabledOutsideClass =
'bg-transperant opacity-50 text-text-disabled cursor-auto';
'bg-transparent opacity-50 text-text-disabled cursor-auto';

const buttonClasses = cn(
'h-10 w-10 flex items-center justify-center transition text-text-secondary relative text-sm',
Expand Down Expand Up @@ -391,7 +391,7 @@ const DatePickerComponent = ( {
>
{ ( ! showOutsideDates || ( isPartOfRange && shouldShowDay ) ) &&
format( day.date, 'd' ) }
{ isToday && (
{ isToday && shouldShowDay && (
<span className="absolute h-1 w-1 bg-background-brand rounded-full bottom-1"></span>
) }
</button>
Expand Down
6 changes: 3 additions & 3 deletions src/components/datepicker/datepicker.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -208,13 +208,13 @@ const DatePicker = ( {
if ( variant === 'presets' ) {
return (
<div className="flex flex-row shadow-datepicker-wrapper">
<div className="flex flex-col gap-1 p-3 items-start border border-solid border-border-subtle border-r-0 rounded-tl-md rounded-bl-md">
<div className="flex flex-col gap-1 p-3 items-start border border-solid border-border-subtle border-r-0 rounded-tl-md rounded-bl-md bg-background-primary">
{ presets.map( ( preset, index ) => (
<Button
key={ index }
onClick={ () => handlePresetClick( preset.range ) }
variant="ghost"
className="font-medium text-sm"
className="font-medium text-sm text-nowrap"
>
{ preset.label }
</Button>
Expand All @@ -234,7 +234,7 @@ const DatePicker = ( {
width="w-auto"
numberOfMonths={ 2 }
footer={
<div className="flex justify-end p-2 gap-3 border border-solid border-border-subtle border-t-0 rounded-md rounded-tl-none rounded-tr-none bg-background-primary">
<div className="flex justify-end p-2 gap-3 border-l border-r border-t-0 border-b border-solid border-border-subtle bg-background-primary rounded-br-md">
<Button
variant="outline"
onClick={ handleCancelClick }
Expand Down
6 changes: 1 addition & 5 deletions src/components/table/table.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -397,11 +397,7 @@ export const TableFooter: React.FC<TableFooterProps> = ( {
const { checkboxSelection } = useTableContext();
return (
<div
className={ cn(
'px-3 py-3',
checkboxSelection && 'px-4',
className
) }
className={ cn( 'px-3 py-3', checkboxSelection && 'px-4', className ) }
{ ...props }
>
{ children }
Expand Down
Loading