From cc740bb612a50f2a78d167b7691ce59a44f1cb27 Mon Sep 17 00:00:00 2001 From: Tal Koren Date: Wed, 10 Apr 2024 13:41:54 +0300 Subject: [PATCH 1/4] docs: fix related components link (#2056) --- .../descriptions/dialog-description/dialog-description.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/core/src/storybook/components/related-components/descriptions/dialog-description/dialog-description.tsx b/packages/core/src/storybook/components/related-components/descriptions/dialog-description/dialog-description.tsx index c658a1ab56..3664c65d1e 100644 --- a/packages/core/src/storybook/components/related-components/descriptions/dialog-description/dialog-description.tsx +++ b/packages/core/src/storybook/components/related-components/descriptions/dialog-description/dialog-description.tsx @@ -43,7 +43,7 @@ export const DialogDescription = () => { ); From 7c35041363e880667899df8f033b117058be3a25 Mon Sep 17 00:00:00 2001 From: shaharzil Date: Wed, 10 Apr 2024 14:02:54 +0300 Subject: [PATCH 2/4] fix(DatePicker): added min width to buttons inside year picker (#2050) --- .../DatePicker/YearPicker/YearPicker.module.scss | 4 ++++ .../components/DatePicker/YearPicker/YearsList.tsx | 11 ++++++++++- 2 files changed, 14 insertions(+), 1 deletion(-) diff --git a/packages/core/src/components/DatePicker/YearPicker/YearPicker.module.scss b/packages/core/src/components/DatePicker/YearPicker/YearPicker.module.scss index 3c2818b722..5f9c0c7a4a 100644 --- a/packages/core/src/components/DatePicker/YearPicker/YearPicker.module.scss +++ b/packages/core/src/components/DatePicker/YearPicker/YearPicker.module.scss @@ -38,6 +38,10 @@ position: absolute; top: 55px; pointer-events: all; + + .pickerOption { + min-width: 66px; + } } :global(.CalendarYear--blocked) { diff --git a/packages/core/src/components/DatePicker/YearPicker/YearsList.tsx b/packages/core/src/components/DatePicker/YearPicker/YearsList.tsx index 342c30d9a6..84c2e1efc2 100644 --- a/packages/core/src/components/DatePicker/YearPicker/YearsList.tsx +++ b/packages/core/src/components/DatePicker/YearPicker/YearsList.tsx @@ -1,4 +1,5 @@ import Button from "../../Button/Button"; +import styles from "./YearPicker.module.scss"; // eslint-disable-next-line @typescript-eslint/no-empty-function const NOOP = () => {}; @@ -19,7 +20,15 @@ const YearsList = ({ yearsItems, isYearBlocked, onSelect, selectedYear }: YearsL const kind = parseInt(selectedYear, 10) === currYear ? Button?.kinds?.PRIMARY : Button?.kinds?.TERTIARY; return ( - ); From d40b49efc63fe943a71bf9ba643b513cf5f66d97 Mon Sep 17 00:00:00 2001 From: chensara Date: Wed, 10 Apr 2024 15:28:01 +0300 Subject: [PATCH 3/4] feat: add autoFocus to RadioButton (#2057) --- .../components/RadioButton/RadioButton.tsx | 5 + .../radioButton-snapshot-tests.jest.tsx.snap | 26 ++++ .../radioButton-snapshot-tests.jest.tsx | 6 +- .../__tests__/radioButton-tests.jest.tsx | 119 ++++++++++-------- 4 files changed, 106 insertions(+), 50 deletions(-) diff --git a/packages/core/src/components/RadioButton/RadioButton.tsx b/packages/core/src/components/RadioButton/RadioButton.tsx index a845dd55bf..b4405ed854 100644 --- a/packages/core/src/components/RadioButton/RadioButton.tsx +++ b/packages/core/src/components/RadioButton/RadioButton.tsx @@ -27,6 +27,8 @@ export interface RadioButtonProps extends VibeComponentProps { value?: string; /** A string specifying a name for the input control. This name is submitted along with the control's value when the form data is submitted. */ name?: string; + /** is autoFocus */ + autoFocus?: boolean; /** is disabled */ disabled?: boolean; /** why the input is disabled */ @@ -64,6 +66,7 @@ const RadioButton: VibeComponent & object = forwa */ radioButtonClassName, disabled = false, + autoFocus, disabledReason, defaultChecked = false, children, @@ -80,6 +83,7 @@ const RadioButton: VibeComponent & object = forwa const inputRef = useRef(); const mergedRef = useMergeRef(ref, inputRef); const overrideClassName = backwardCompatibilityForProperties([className, componentClassName]); + const onChildClick = useCallback(() => { if (disabled || !retainChildClick) return; if (inputRef.current) { @@ -114,6 +118,7 @@ const RadioButton: VibeComponent & object = forwa type="radio" value={value} name={name} + autoFocus={autoFocus} disabled={disabled} {...checkedProps} onChange={onSelect} diff --git a/packages/core/src/components/RadioButton/__tests__/__snapshots__/radioButton-snapshot-tests.jest.tsx.snap b/packages/core/src/components/RadioButton/__tests__/__snapshots__/radioButton-snapshot-tests.jest.tsx.snap index afbe409e9c..44d8af9e62 100644 --- a/packages/core/src/components/RadioButton/__tests__/__snapshots__/radioButton-snapshot-tests.jest.tsx.snap +++ b/packages/core/src/components/RadioButton/__tests__/__snapshots__/radioButton-snapshot-tests.jest.tsx.snap @@ -1,5 +1,31 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP +exports[`RadioButton renders correctly when autoFocus 1`] = ` + +`; + exports[`RadioButton renders correctly when checked 1`] = `