From 64e0b04c609b89d173ae236a8ea5fe190ec9d98d Mon Sep 17 00:00:00 2001 From: Praveen Murali Date: Mon, 15 Apr 2024 19:46:04 +0530 Subject: [PATCH 1/4] Added border to Popover arrow (#2165) * added border to popover * revert Story changes * removed unused prop --- src/styles/components/_tooltip.scss | 67 ++++++++++++++++++++++++++++- 1 file changed, 65 insertions(+), 2 deletions(-) diff --git a/src/styles/components/_tooltip.scss b/src/styles/components/_tooltip.scss index e7455c09a..05567c308 100644 --- a/src/styles/components/_tooltip.scss +++ b/src/styles/components/_tooltip.scss @@ -1,4 +1,6 @@ -:root, .neeto-ui-theme--light, .neeto-ui-theme--dark { +:root, +.neeto-ui-theme--light, +.neeto-ui-theme--dark { --neeto-ui-tooltip-max-width: calc(100vw - 10px); --neeto-ui-tooltip-font-size: var(--neeto-ui-text-xs); --neeto-ui-tooltip-bg-color: rgb(var(--neeto-ui-gray-800)); @@ -12,6 +14,8 @@ // Arrow --neeto-ui-tooltip-arrow-color: rgb(var(--neeto-ui-gray-800)); + --neeto-ui-tooltip-arrow-size: 6px; + --neeto-ui-tooltip-arrow-offset: 12px; // Light theme --neeto-ui-tooltip-light-theme-bg-color: rgb(var(--neeto-ui-white)); @@ -200,7 +204,8 @@ border-top-color: var(--neeto-ui-tooltip-light-theme-arrow-border-color); } -.tippy-box[data-theme~="light"][data-placement^="bottom"] > .tippy-arrow:before { +.tippy-box[data-theme~="light"][data-placement^="bottom"] + > .tippy-arrow:before { border-bottom-color: var(--neeto-ui-tooltip-light-theme-arrow-border-color); } @@ -225,3 +230,61 @@ --neeto-ui-tooltip-arrow-color: rgb(var(--neeto-ui-primary-800)); --neeto-ui-tooltip-light-theme-color: rgb(var(--neeto-ui-primary-800)); } + +// Adding border to popover + +.tippy-box[data-theme~="light"] { + .tippy-arrow { + transform-style: preserve-3d; + width: 0; + height: 0; + border: var(--neeto-ui-tooltip-arrow-size) solid transparent; + color: rgb(var(--neeto-ui-white)); + + &::before { + transform: translateZ(-1px); + border: var(--neeto-ui-tooltip-arrow-size) solid transparent; + } + } + &[data-placement^="right"] .tippy-arrow { + border-right-color: rgb(var(--neeto-ui-white)); + left: calc(-1 * var(--neeto-ui-tooltip-arrow-offset)); + + &::before { + left: calc(-1 * (var(--neeto-ui-tooltip-arrow-size) + 1px)); + top: calc(-1 * var(--neeto-ui-tooltip-arrow-size)); + border-right-color: var(--neeto-ui-popover-light-theme-border-color); + } + } + &[data-placement^="left"] .tippy-arrow { + border-left-color: rgb(var(--neeto-ui-white)); + right: calc(-1 * var(--neeto-ui-tooltip-arrow-offset)); + + &::before { + right: calc(-1 * (var(--neeto-ui-tooltip-arrow-size) + 1px)); + top: calc(-1 * var(--neeto-ui-tooltip-arrow-size)); + border-left-color: var(--neeto-ui-popover-light-theme-border-color); + } + } + &[data-placement^="bottom"] .tippy-arrow { + border-bottom-color: rgb(var(--neeto-ui-white)); + top: calc(-1 * var(--neeto-ui-tooltip-arrow-offset)); + + &::before { + top: calc(-1 * (var(--neeto-ui-tooltip-arrow-size) + 1px)); + left: calc(-1 * var(--neeto-ui-tooltip-arrow-size)); + bottom: auto; + border-bottom-color: var(--neeto-ui-popover-light-theme-border-color); + } + } + &[data-placement^="top"] .tippy-arrow { + border-top-color: rgb(var(--neeto-ui-white)); + bottom: calc(-1 * var(--neeto-ui-tooltip-arrow-offset)); + + &::before { + left: calc(-1 * var(--neeto-ui-tooltip-arrow-size)); + top: calc(-1 * (var(--neeto-ui-tooltip-arrow-size) - 1px)); + border-top-color: var(--neeto-ui-popover-light-theme-border-color); + } + } +} From 3cdcf6e4332ed640d597efb327bdcd5049fb7e8b Mon Sep 17 00:00:00 2001 From: praveen-murali-ind Date: Mon, 15 Apr 2024 14:17:53 +0000 Subject: [PATCH 2/4] New version release --- CHANGELOG.md | 14 +++++++++++--- package.json | 2 +- 2 files changed, 12 insertions(+), 4 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index e430abf60..91af9a5b8 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -23,6 +23,17 @@ Each change is prefixed with one of these keywords:: - *Fixed*: Denotes bug fixes. - *Security*: Pertains to actions taken in response to vulnerabilities. +## 6.5.12 - 2024-04-15 + +- Added: Customizable border to Popover arrow. + +Screenshot 2024-04-15 at 7 25 08 PM +Screenshot 2024-04-15 at 7 24 56 PM +Screenshot 2024-04-15 at 7 27 10 PM +Screenshot 2024-04-15 at 7 25 54 PM +Darkmode + +Screenshot 2024-04-15 at 7 40 37 PM ## 6.5.11 - 2024-04-11 Fixed: `antd` Datepicker not validating minDate and maxDate on input date changes. @@ -60,7 +71,6 @@ Added: `bulkSelectAllRowsProps` for tables to allow selecting all rows for multi ## 6.4.0 - 2024-03-21 Added: minDateTime and maxDateTime prop. ## 6.3.10 - 2024-03-20 - While changing the page for multi-paged table, the selected rows will not be deselected. @@ -245,7 +255,6 @@ Added: `Add` button in *Select* Added: *Stepper* component. ## 5.2.27 - 2023-11-08 Changed: Updated instances of `@reach/autoid` with React `useId` - ## 5.2.26 - 2023-11-08 - Changed: pagination button size from `32px` to `28px`. @@ -1025,7 +1034,6 @@ Changes documentations to sentence case from title casing. - Fixed: issue with closeOnEsc prop when the Pane is controlled. ## 3.5.9 - 2022-07-05 - Fixed: Checkbox in *Table* component cut off in lower screen resolutions. - ## 3.5.8 - 2022-07-01 - Fixed: Error when handling `axios` error objects with `undefined` response in diff --git a/package.json b/package.json index cd7a262dd..177b23285 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@bigbinary/neetoui", - "version": "6.5.11", + "version": "6.5.12", "author": "BigBinary", "license": "MIT", "description": "neetoUI drives the experience at all neeto products", From 8276a4af69afd25f44d9a6d1db235b0208bfb709 Mon Sep 17 00:00:00 2001 From: Deepak Jose Date: Tue, 16 Apr 2024 20:43:40 +0530 Subject: [PATCH 3/4] Fixes occasional scrollbar that appears when typing in the Textarea component. (#2167) --- src/components/Textarea.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/Textarea.jsx b/src/components/Textarea.jsx index 3185e568e..3bcbc74b0 100644 --- a/src/components/Textarea.jsx +++ b/src/components/Textarea.jsx @@ -56,7 +56,7 @@ const Textarea = forwardRef( textareaRef.current.style.minHeight = "22px"; textareaRef.current.style.height = "auto"; const scrollHeight = textareaRef.current.scrollHeight; - textareaRef.current.style.height = `${scrollHeight}px`; + textareaRef.current.style.height = `${scrollHeight + 1}px`; }, [value]); return ( From 7837bccd85e3429d01bb509a62f875ffd7a0df1a Mon Sep 17 00:00:00 2001 From: josephmathew900 Date: Tue, 16 Apr 2024 15:15:28 +0000 Subject: [PATCH 4/4] New version release --- CHANGELOG.md | 9 ++++----- package.json | 2 +- 2 files changed, 5 insertions(+), 6 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 91af9a5b8..87135065b 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -23,6 +23,10 @@ Each change is prefixed with one of these keywords:: - *Fixed*: Denotes bug fixes. - *Security*: Pertains to actions taken in response to vulnerabilities. +## 6.5.13 - 2024-04-16 + +Fixes the occasional scrollbar that appears when the input height is calculated based on the content in the value change handler. + ## 6.5.12 - 2024-04-15 - Added: Customizable border to Popover arrow. @@ -32,10 +36,8 @@ Each change is prefixed with one of these keywords:: Screenshot 2024-04-15 at 7 27 10 PM Screenshot 2024-04-15 at 7 25 54 PM Darkmode - Screenshot 2024-04-15 at 7 40 37 PM ## 6.5.11 - 2024-04-11 - Fixed: `antd` Datepicker not validating minDate and maxDate on input date changes. ## 6.5.10 - 2024-04-11 @@ -73,7 +75,6 @@ Added: minDateTime and maxDateTime prop. ## 6.3.10 - 2024-03-20 While changing the page for multi-paged table, the selected rows will not be deselected. - ## 6.3.9 - 2024-03-20 - Added: Support for overriding the dropdown props in the *ColorPicker* @@ -256,7 +257,6 @@ Added: *Stepper* component. ## 5.2.27 - 2023-11-08 Changed: Updated instances of `@reach/autoid` with React `useId` ## 5.2.26 - 2023-11-08 - - Changed: pagination button size from `32px` to `28px`. - Changed: reduced pagination margin top and margin bottom values to make it more compact. @@ -1035,7 +1035,6 @@ Changes documentations to sentence case from title casing. ## 3.5.9 - 2022-07-05 - Fixed: Checkbox in *Table* component cut off in lower screen resolutions. ## 3.5.8 - 2022-07-01 - - Fixed: Error when handling `axios` error objects with `undefined` response in `Toastr.error` diff --git a/package.json b/package.json index 177b23285..dde4b4fed 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@bigbinary/neetoui", - "version": "6.5.12", + "version": "6.5.13", "author": "BigBinary", "license": "MIT", "description": "neetoUI drives the experience at all neeto products",