@digital-ai/dot-components 2.5.4 → 2.5.5

package/CHANGE_LOG.md

@@ -1,5 +1,14 @@
 # Changelog
 
+## [2.5.5](https://www.npmjs.com/package/@digital-ai/dot-components) (03/31/2023)
+
+[Full Changelog](https://digital-ai.github.io/dot-components/?path=/story/introduction--page/digital-ai/dot-components/compare/2.5.4...2.5.5)
+
+**Fixed bugs:**
+
+- S-82103: Update InlineEdit state [\#1430](https://github.com/digital-ai/dot-components/pull/1430) ([ryangamble](https://github.com/ryangamble))
+- D-24591: Align icon on `ButtonToggle` [\#1427](https://github.com/digital-ai/dot-components/pull/1427) ([angel-git](https://github.com/angel-git))
+
 ## [2.5.4](https://www.npmjs.com/package/@digital-ai/dot-components) (03/29/2023)
 
 [Full Changelog](https://digital-ai.github.io/dot-components/?path=/story/introduction--page/digital-ai/dot-components/compare/2.5.3...2.5.4)
@@ -12,10 +21,6 @@
 
 - D-24483: Do not hide the backdrop [\#1423](https://github.com/digital-ai/dot-components/pull/1423) ([jmcnally](https://github.com/jmcnally))
 
-**Misc:**
-
-- resolve build issues with vsm-hub demo [\#1424](https://github.com/digital-ai/dot-components/pull/1424) ([CWSites](https://github.com/CWSites))
-
 ## [2.5.3](https://www.npmjs.com/package/@digital-ai/dot-components) (03/21/2023)
 
 [Full Changelog](https://digital-ai.github.io/dot-components/?path=/story/introduction--page/digital-ai/dot-components/compare/1.21.10...2.5.3)
@@ -32,6 +37,10 @@
 
 - D-24419 InlineEdit: show tooltip on readonly as well [\#1417](https://github.com/digital-ai/dot-components/pull/1417) ([angel-git](https://github.com/angel-git))
 
+**Misc:**
+
+- resolve build issues with vsm-hub demo [\#1424](https://github.com/digital-ai/dot-components/pull/1424) ([CWSites](https://github.com/CWSites))
+
 ## [2.5.2](https://www.npmjs.com/package/@digital-ai/dot-components) (03/17/2023)
 
 [Full Changelog](https://digital-ai.github.io/dot-components/?path=/story/introduction--page/digital-ai/dot-components/compare/2.5.1...2.5.2)
@@ -45,6 +54,7 @@
 
 - D-24317 Fix height on InlineEdit [\#1414](https://github.com/digital-ai/dot-components/pull/1414) ([angel-git](https://github.com/angel-git))
 - D-24419 `InlineEdit` show tooltip on readonly as well [\#1413](https://github.com/digital-ai/dot-components/pull/1413) ([angel-git](https://github.com/angel-git))
+- S-89896: Still trying to get SQ off its \(non-\)duplicate obsession [\#1388](https://github.com/digital-ai/dot-components/pull/1388) ([jmcnally](https://github.com/jmcnally))
 
 ## [2.5.1](https://www.npmjs.com/package/@digital-ai/dot-components) (03/14/2023)
 
@@ -96,7 +106,6 @@
 
 **Fixed bugs:**
 
-- S-89896: Still trying to get SQ off its \(non-\)duplicate obsession [\#1388](https://github.com/digital-ai/dot-components/pull/1388) ([jmcnally](https://github.com/jmcnally))
 - S-89896: Sort app types alphabetically [\#1384](https://github.com/digital-ai/dot-components/pull/1384) ([jmcnally](https://github.com/jmcnally))
 - S-89896: Handle non-product apps in their own group [\#1381](https://github.com/digital-ai/dot-components/pull/1381) ([jmcnally](https://github.com/jmcnally))
 
@@ -299,6 +308,10 @@
 - S-87616 Adjust left margin for helper text [\#1262](https://github.com/digital-ai/dot-components/pull/1262) ([nikolinadapic](https://github.com/nikolinadapic))
 - S-87599: `DotAutocomplete`  Add optional `persistentLabel` prop [\#1258](https://github.com/digital-ai/dot-components/pull/1258) ([dmiletic85](https://github.com/dmiletic85))
 
+**Fixed bugs:**
+
+- S-85900: Optional behavior for app toolbar click away to close main menu [\#1256](https://github.com/digital-ai/dot-components/pull/1256) ([ray-jonathan](https://github.com/ray-jonathan))
+
 ## [2.0.0-rc.2](https://www.npmjs.com/package/@digital-ai/dot-components) (09/15/2022)
 
 [Full Changelog](https://digital-ai.github.io/dot-components/?path=/story/introduction--page/digital-ai/dot-components/compare/1.21.2...2.0.0-rc.2)
@@ -311,17 +324,13 @@
 
 - S-87316 Add focus state for Inline Edit [\#1255](https://github.com/digital-ai/dot-components/pull/1255) ([nikolinadapic](https://github.com/nikolinadapic))
 
-**Fixed bugs:**
-
-- S-85900: Optional behavior for app toolbar click away to close main menu [\#1256](https://github.com/digital-ai/dot-components/pull/1256) ([ray-jonathan](https://github.com/ray-jonathan))
-- D-22241: `DotFileListItem`: fix focus states and expose `onKeyPress` [\#1254](https://github.com/digital-ai/dot-components/pull/1254) ([dmiletic85](https://github.com/dmiletic85))
-
 ## [2.0.0-rc.1](https://www.npmjs.com/package/@digital-ai/dot-components) (08/31/2022)
 
 [Full Changelog](https://digital-ai.github.io/dot-components/?path=/story/introduction--page/digital-ai/dot-components/compare/1.21.1...2.0.0-rc.1)
 
 **Fixed bugs:**
 
+- D-22241: `DotFileListItem`: fix focus states and expose `onKeyPress` [\#1254](https://github.com/digital-ai/dot-components/pull/1254) ([dmiletic85](https://github.com/dmiletic85))
 - S-86692: component cleanup [\#1238](https://github.com/digital-ai/dot-components/pull/1238) ([CWSites](https://github.com/CWSites))
 - S-84151: fix e2e tests for Release 2.0 [\#1146](https://github.com/digital-ai/dot-components/pull/1146) ([CWSites](https://github.com/CWSites))
 
@@ -888,6 +897,7 @@
 
 - D-19151: `DotBadge` generates console warnings [\#827](https://github.com/digital-ai/dot-components/pull/827) ([dmiletic85](https://github.com/dmiletic85))
 - D-19177: `Go back` item in `DotSidebar` is not aligned with rest of items [\#826](https://github.com/digital-ai/dot-components/pull/826) ([dmiletic85](https://github.com/dmiletic85))
+- \#795 Address AlertBanner style issues [\#815](https://github.com/digital-ai/dot-components/pull/815) ([angel-git](https://github.com/angel-git))
 
 ## [1.3.4](https://www.npmjs.com/package/@digital-ai/dot-components) (11/30/2021)
 
@@ -902,7 +912,6 @@
 
 **Fixed bugs:**
 
-- \#795 Address AlertBanner style issues [\#815](https://github.com/digital-ai/dot-components/pull/815) ([angel-git](https://github.com/angel-git))
 - D-19138: Remove margin-bottom from breadcrumbs [\#813](https://github.com/digital-ai/dot-components/pull/813) ([angel-git](https://github.com/angel-git))
 - D-19148: Input elements not displaying correctly when `border-box` is used in consumer components [\#812](https://github.com/digital-ai/dot-components/pull/812) ([dmiletic85](https://github.com/dmiletic85))
 - \[D-18631\]\[D-18632\]\[D-18802\]:Focus state of avatar button and sidebar list item and inaccurate count of nav item [\#804](https://github.com/digital-ai/dot-components/pull/804) ([monapatel91](https://github.com/monapatel91))
@@ -1033,6 +1042,7 @@
 - S-76773: product badges in app toolbar and sidebar [\#712](https://github.com/digital-ai/dot-components/pull/712) ([CWSites](https://github.com/CWSites))
 - Icons update oct 7th 2021 [\#709](https://github.com/digital-ai/dot-components/pull/709) ([BojanKocijan](https://github.com/BojanKocijan))
 - S-78833 agility sidebar [\#701](https://github.com/digital-ai/dot-components/pull/701) ([CWSites](https://github.com/CWSites))
+- S-78832: Agility icon & badge updates [\#698](https://github.com/digital-ai/dot-components/pull/698) ([CWSites](https://github.com/CWSites))
 
 ## [1.1.1](https://www.npmjs.com/package/@digital-ai/dot-components) (10/06/2021)
 
@@ -1046,7 +1056,6 @@
 
 - MINOR RELEASE [\#704](https://github.com/digital-ai/dot-components/pull/704) ([CWSites](https://github.com/CWSites))
 - S-79291: update nested dependencies [\#700](https://github.com/digital-ai/dot-components/pull/700) ([CWSites](https://github.com/CWSites))
-- S-78832: Agility icon & badge updates [\#698](https://github.com/digital-ai/dot-components/pull/698) ([CWSites](https://github.com/CWSites))
 - S-79251: add workflow for sonarqube scan when code merged to develop [\#697](https://github.com/digital-ai/dot-components/pull/697) ([CWSites](https://github.com/CWSites))
 - S-76906: table action column [\#692](https://github.com/digital-ai/dot-components/pull/692) ([monapatel91](https://github.com/monapatel91))
 
@@ -1078,6 +1087,7 @@
 **Misc:**
 
 - Next Release [\#689](https://github.com/digital-ai/dot-components/pull/689) ([CWSites](https://github.com/CWSites))
+- S-78594: Update avatar component to randomly assign a color of the avatar background to the signed in user [\#680](https://github.com/digital-ai/dot-components/pull/680) ([dmiletic85](https://github.com/dmiletic85))
 
 ## [1.0.11](https://www.npmjs.com/package/@digital-ai/dot-components) (09/16/2021)
 
@@ -1087,10 +1097,6 @@
 
 - D-18421: close hamburger on navigate [\#679](https://github.com/digital-ai/dot-components/pull/679) ([CWSites](https://github.com/CWSites))
 
-**Misc:**
-
-- S-78594: Update avatar component to randomly assign a color of the avatar background to the signed in user [\#680](https://github.com/digital-ai/dot-components/pull/680) ([dmiletic85](https://github.com/dmiletic85))
-
 ## [1.0.10](https://www.npmjs.com/package/@digital-ai/dot-components) (09/09/2021)
 
 [Full Changelog](https://digital-ai.github.io/dot-components/?path=/story/introduction--page/digital-ai/dot-components/compare/1.0.9...1.0.10)
@@ -1241,7 +1247,6 @@
 - Add isUnderToolbar property to Sidebar for use beneath AppToolbar [\#560](https://github.com/digital-ai/dot-components/pull/560) ([selsemore](https://github.com/selsemore))
 - Move approved components to "Stable" [\#559](https://github.com/digital-ai/dot-components/pull/559) ([CWSites](https://github.com/CWSites))
 - S-75998: \[PB Tech Debt\] Avoid unnecessary form re-renders when typing application name [\#556](https://github.com/digital-ai/dot-components/pull/556) ([dmiletic85](https://github.com/dmiletic85))
-- S-75991: \[PB Tech Debt\] Refactor and improve wrapper component in demo app [\#546](https://github.com/digital-ai/dot-components/pull/546) ([dmiletic85](https://github.com/dmiletic85))
 
 ## [1.0.1](https://www.npmjs.com/package/@digital-ai/dot-components) (07/02/2021)
 

package/index.esm.js

@@ -4979,7 +4979,7 @@ const StyledToggleButtonGroup = styled(ToggleButtonGroup).withConfig({
   componentId: "sc-1oh4ljv-0"
 })(["", ""], ({
   theme
-}) => css(["&.", "{button:not(.MuiToggleButton-sizeLarge):not(.MuiToggleButton-sizeSmall){height:", ";.dot-icon{width:", ";}}.dot-icon{color:", ";+ p{margin-left:", ";}i{height:auto;}}.dot-typography{margin-bottom:0;}.MuiToggleButton-label{color:", ";p{margin-bottom:0;}}.MuiToggleButtonGroup-groupedHorizontal{border:1px solid ", ";border-radius:0;}.dot-tooltip{&:first-child .MuiToggleButtonGroup-groupedHorizontal{border-top-left-radius:4px;border-bottom-left-radius:4px;margin-left:0;}&:last-child .MuiToggleButtonGroup-groupedHorizontal{border-top-right-radius:4px;border-bottom-right-radius:4px;margin-right:0;}&:not(:first-child) .MuiToggleButtonGroup-groupedHorizontal{margin-left:-1px;}}& > .MuiToggleButtonGroup-groupedHorizontal{:first-child{border-top-left-radius:4px;border-bottom-left-radius:4px;margin-left:0;}:last-child{border-top-right-radius:4px;border-bottom-right-radius:4px;margin-right:0;}}}.MuiButtonBase-root{&.Mui-disabled p,&.Mui-disabled .dot-icon{color:", ";}&.Mui-selected{&.MuiToggleButton-standard{background:", ";}.dot-typography{color:inherit;}}}"], rootClassName$C, theme.spacing(5), theme.spacing(2), theme.palette.layer.n700, theme.spacing(1), theme.palette.layer.n700, theme.palette.layer.n300, theme.palette.grey[200], selectedGray));
+}) => css(["&.", "{button:not(.MuiToggleButton-sizeLarge):not(.MuiToggleButton-sizeSmall){height:", ";.dot-icon{width:", ";}}.dot-icon{color:", ";display:flex;+ p{margin-left:", ";}i{height:auto;}}.dot-typography{margin-bottom:0;}.MuiToggleButton-label{color:", ";p{margin-bottom:0;}}.MuiToggleButtonGroup-groupedHorizontal{border:1px solid ", ";border-radius:0;}.dot-tooltip{&:first-child .MuiToggleButtonGroup-groupedHorizontal{border-top-left-radius:4px;border-bottom-left-radius:4px;margin-left:0;}&:last-child .MuiToggleButtonGroup-groupedHorizontal{border-top-right-radius:4px;border-bottom-right-radius:4px;margin-right:0;}&:not(:first-child) .MuiToggleButtonGroup-groupedHorizontal{margin-left:-1px;}}& > .MuiToggleButtonGroup-groupedHorizontal{:first-child{border-top-left-radius:4px;border-bottom-left-radius:4px;margin-left:0;}:last-child{border-top-right-radius:4px;border-bottom-right-radius:4px;margin-right:0;}}}.MuiButtonBase-root{&.Mui-disabled p,&.Mui-disabled .dot-icon{color:", ";}&.Mui-selected{&.MuiToggleButton-standard{background:", ";}.dot-typography{color:inherit;}}}"], rootClassName$C, theme.spacing(5), theme.spacing(2), theme.palette.layer.n700, theme.spacing(1), theme.palette.layer.n700, theme.palette.layer.n300, theme.palette.grey[200], selectedGray));
 
 const DotButtonToggle = ({
   ariaLabel,
@@ -7058,6 +7058,11 @@ const DotInlineEdit = ({
   const [inputValue, setInputValue] = useState(_value);
   const inputRef = useRef();
   const inlineEditRef = useRef();
+  useEffect(() => {
+    if (_value !== inputValue) {
+      setInputValue(_value);
+    }
+  }, [_value]);
   const isSaveDisabled = checkIfEmptyValue(inputValue);
   const rootClasses = useStylesWithRootClass(rootClassName$n, className, editing ? editModeClassName : '');
   const handleShowTooltip = visible => {

package/index.umd.js

@@ -5449,7 +5449,7 @@
       componentId: "sc-1oh4ljv-0"
     })(templateObject_2$C || (templateObject_2$C = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), function (_a) {
       var theme = _a.theme;
-      return styled.css(templateObject_1$F || (templateObject_1$F = __makeTemplateObject(["\n    &.", " {\n      button:not(.MuiToggleButton-sizeLarge):not(.MuiToggleButton-sizeSmall) {\n        /* Override height for medium size */\n        height: ", ";\n\n        .dot-icon {\n          /* With this, the width of the medium size button matches its height (40px) */\n          width: ", ";\n        }\n      }\n\n      .dot-icon {\n        color: ", ";\n\n        + p {\n          margin-left: ", ";\n        }\n        i {\n          height: auto;\n        }\n      }\n\n      .dot-typography {\n        margin-bottom: 0;\n      }\n\n      .MuiToggleButton-label {\n        color: ", ";\n        p {\n          margin-bottom: 0;\n        }\n      }\n\n      .MuiToggleButtonGroup-groupedHorizontal {\n        border: 1px solid ", ";\n        border-radius: 0;\n      }\n\n      .dot-tooltip {\n        &:first-child .MuiToggleButtonGroup-groupedHorizontal {\n          border-top-left-radius: 4px;\n          border-bottom-left-radius: 4px;\n          margin-left: 0;\n        }\n        &:last-child .MuiToggleButtonGroup-groupedHorizontal {\n          border-top-right-radius: 4px;\n          border-bottom-right-radius: 4px;\n          margin-right: 0;\n        }\n        &:not(:first-child) .MuiToggleButtonGroup-groupedHorizontal {\n          margin-left: -1px;\n        }\n      }\n\n      & > .MuiToggleButtonGroup-groupedHorizontal {\n        :first-child {\n          border-top-left-radius: 4px;\n          border-bottom-left-radius: 4px;\n          margin-left: 0;\n        }\n        :last-child {\n          border-top-right-radius: 4px;\n          border-bottom-right-radius: 4px;\n          margin-right: 0;\n        }\n      }\n    }\n\n    .MuiButtonBase-root {\n      &.Mui-disabled p,\n      &.Mui-disabled .dot-icon {\n        color: ", ";\n      }\n\n      &.Mui-selected {\n        &.MuiToggleButton-standard {\n          background: ", ";\n        }\n\n        .dot-typography {\n          color: inherit;\n        }\n      }\n    }\n  "], ["\n    &.", " {\n      button:not(.MuiToggleButton-sizeLarge):not(.MuiToggleButton-sizeSmall) {\n        /* Override height for medium size */\n        height: ", ";\n\n        .dot-icon {\n          /* With this, the width of the medium size button matches its height (40px) */\n          width: ", ";\n        }\n      }\n\n      .dot-icon {\n        color: ", ";\n\n        + p {\n          margin-left: ", ";\n        }\n        i {\n          height: auto;\n        }\n      }\n\n      .dot-typography {\n        margin-bottom: 0;\n      }\n\n      .MuiToggleButton-label {\n        color: ", ";\n        p {\n          margin-bottom: 0;\n        }\n      }\n\n      .MuiToggleButtonGroup-groupedHorizontal {\n        border: 1px solid ", ";\n        border-radius: 0;\n      }\n\n      .dot-tooltip {\n        &:first-child .MuiToggleButtonGroup-groupedHorizontal {\n          border-top-left-radius: 4px;\n          border-bottom-left-radius: 4px;\n          margin-left: 0;\n        }\n        &:last-child .MuiToggleButtonGroup-groupedHorizontal {\n          border-top-right-radius: 4px;\n          border-bottom-right-radius: 4px;\n          margin-right: 0;\n        }\n        &:not(:first-child) .MuiToggleButtonGroup-groupedHorizontal {\n          margin-left: -1px;\n        }\n      }\n\n      & > .MuiToggleButtonGroup-groupedHorizontal {\n        :first-child {\n          border-top-left-radius: 4px;\n          border-bottom-left-radius: 4px;\n          margin-left: 0;\n        }\n        :last-child {\n          border-top-right-radius: 4px;\n          border-bottom-right-radius: 4px;\n          margin-right: 0;\n        }\n      }\n    }\n\n    .MuiButtonBase-root {\n      &.Mui-disabled p,\n      &.Mui-disabled .dot-icon {\n        color: ", ";\n      }\n\n      &.Mui-selected {\n        &.MuiToggleButton-standard {\n          background: ", ";\n        }\n\n        .dot-typography {\n          color: inherit;\n        }\n      }\n    }\n  "])), rootClassName$C, theme.spacing(5), theme.spacing(2), theme.palette.layer.n700, theme.spacing(1), theme.palette.layer.n700, theme.palette.layer.n300, theme.palette.grey[200], selectedGray);
+      return styled.css(templateObject_1$F || (templateObject_1$F = __makeTemplateObject(["\n    &.", " {\n      button:not(.MuiToggleButton-sizeLarge):not(.MuiToggleButton-sizeSmall) {\n        /* Override height for medium size */\n        height: ", ";\n\n        .dot-icon {\n          /* With this, the width of the medium size button matches its height (40px) */\n          width: ", ";\n        }\n      }\n\n      .dot-icon {\n        color: ", ";\n        display: flex;\n\n        + p {\n          margin-left: ", ";\n        }\n        i {\n          height: auto;\n        }\n      }\n\n      .dot-typography {\n        margin-bottom: 0;\n      }\n\n      .MuiToggleButton-label {\n        color: ", ";\n        p {\n          margin-bottom: 0;\n        }\n      }\n\n      .MuiToggleButtonGroup-groupedHorizontal {\n        border: 1px solid ", ";\n        border-radius: 0;\n      }\n\n      .dot-tooltip {\n        &:first-child .MuiToggleButtonGroup-groupedHorizontal {\n          border-top-left-radius: 4px;\n          border-bottom-left-radius: 4px;\n          margin-left: 0;\n        }\n        &:last-child .MuiToggleButtonGroup-groupedHorizontal {\n          border-top-right-radius: 4px;\n          border-bottom-right-radius: 4px;\n          margin-right: 0;\n        }\n        &:not(:first-child) .MuiToggleButtonGroup-groupedHorizontal {\n          margin-left: -1px;\n        }\n      }\n\n      & > .MuiToggleButtonGroup-groupedHorizontal {\n        :first-child {\n          border-top-left-radius: 4px;\n          border-bottom-left-radius: 4px;\n          margin-left: 0;\n        }\n        :last-child {\n          border-top-right-radius: 4px;\n          border-bottom-right-radius: 4px;\n          margin-right: 0;\n        }\n      }\n    }\n\n    .MuiButtonBase-root {\n      &.Mui-disabled p,\n      &.Mui-disabled .dot-icon {\n        color: ", ";\n      }\n\n      &.Mui-selected {\n        &.MuiToggleButton-standard {\n          background: ", ";\n        }\n\n        .dot-typography {\n          color: inherit;\n        }\n      }\n    }\n  "], ["\n    &.", " {\n      button:not(.MuiToggleButton-sizeLarge):not(.MuiToggleButton-sizeSmall) {\n        /* Override height for medium size */\n        height: ", ";\n\n        .dot-icon {\n          /* With this, the width of the medium size button matches its height (40px) */\n          width: ", ";\n        }\n      }\n\n      .dot-icon {\n        color: ", ";\n        display: flex;\n\n        + p {\n          margin-left: ", ";\n        }\n        i {\n          height: auto;\n        }\n      }\n\n      .dot-typography {\n        margin-bottom: 0;\n      }\n\n      .MuiToggleButton-label {\n        color: ", ";\n        p {\n          margin-bottom: 0;\n        }\n      }\n\n      .MuiToggleButtonGroup-groupedHorizontal {\n        border: 1px solid ", ";\n        border-radius: 0;\n      }\n\n      .dot-tooltip {\n        &:first-child .MuiToggleButtonGroup-groupedHorizontal {\n          border-top-left-radius: 4px;\n          border-bottom-left-radius: 4px;\n          margin-left: 0;\n        }\n        &:last-child .MuiToggleButtonGroup-groupedHorizontal {\n          border-top-right-radius: 4px;\n          border-bottom-right-radius: 4px;\n          margin-right: 0;\n        }\n        &:not(:first-child) .MuiToggleButtonGroup-groupedHorizontal {\n          margin-left: -1px;\n        }\n      }\n\n      & > .MuiToggleButtonGroup-groupedHorizontal {\n        :first-child {\n          border-top-left-radius: 4px;\n          border-bottom-left-radius: 4px;\n          margin-left: 0;\n        }\n        :last-child {\n          border-top-right-radius: 4px;\n          border-bottom-right-radius: 4px;\n          margin-right: 0;\n        }\n      }\n    }\n\n    .MuiButtonBase-root {\n      &.Mui-disabled p,\n      &.Mui-disabled .dot-icon {\n        color: ", ";\n      }\n\n      &.Mui-selected {\n        &.MuiToggleButton-standard {\n          background: ", ";\n        }\n\n        .dot-typography {\n          color: inherit;\n        }\n      }\n    }\n  "])), rootClassName$C, theme.spacing(5), theme.spacing(2), theme.palette.layer.n700, theme.spacing(1), theme.palette.layer.n700, theme.palette.layer.n300, theme.palette.grey[200], selectedGray);
     });
     var templateObject_1$F, templateObject_2$C;
 
@@ -7608,6 +7608,11 @@
         setInputValue = _j[1];
       var inputRef = React.useRef();
       var inlineEditRef = React.useRef();
+      React.useEffect(function () {
+        if (value !== inputValue) {
+          setInputValue(value);
+        }
+      }, [value]);
       var isSaveDisabled = checkIfEmptyValue(inputValue);
       var rootClasses = useStylesWithRootClass(rootClassName$n, className, editing ? editModeClassName : '');
       var handleShowTooltip = function handleShowTooltip(visible) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@digital-ai/dot-components",
-  "version": "2.5.4",
+  "version": "2.5.5",
   "private": false,
   "license": "SEE LICENSE IN <LICENSE.md>",
   "contributors": [