From 33ebb22d2d4e8418739ba1425058e58012bef2eb Mon Sep 17 00:00:00 2001 From: Miki Date: Thu, 19 Oct 2023 13:46:41 -0700 Subject: [PATCH 1/4] Bump `@types/react` and `csstype` (#1105) * These are needed to be kept in sync with OSD's. * Switch `css-loader` to an alternate to match that of OSD's, just in case. Signed-off-by: Miki Signed-off-by: keskami --- CHANGELOG.md | 4 +-- i18ntokens.json | 8 ++--- package.json | 2 +- .../tabs/tabbed_content/tabbed_content.tsx | 2 +- yarn.lock | 34 +++++++++++-------- 5 files changed, 28 insertions(+), 22 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 15b8df7fdc..7ac144d839 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -32,10 +32,10 @@ ### 🛠 Maintenance - Remove Internet Explorer specific code ([#890](https://github.com/opensearch-project/oui/pull/890)) - - Update caniuse database ([#1046](https://github.com/opensearch-project/oui/pull/1046)) - Bump TypeScript to v4.6.4 ([#879](https://github.com/opensearch-project/oui/pull/879)) -- Clean up `react-datepicker` package to remove unnecessary directories and files([#1067](https://github.com/opensearch-project/oui/pull/1067)) +- Clean up `react-datepicker` package to remove unnecessary directories and files ([#1067](https://github.com/opensearch-project/oui/pull/1067)) +- Bump `@types/react` and `csstype` ([#1105](https://github.com/opensearch-project/oui/pull/1105)) ### 🪛 Refactoring diff --git a/i18ntokens.json b/i18ntokens.json index 51d5c7ed53..f93f61a162 100644 --- a/i18ntokens.json +++ b/i18ntokens.json @@ -2653,12 +2653,12 @@ "start": { "line": 143, "column": 4, - "index": 4700 + "index": 4717 }, "end": { "line": 148, "column": 44, - "index": 4885 + "index": 4902 } }, "filepath": "src/components/list_group/pinnable_list_group/pinnable_list_group.tsx" @@ -2671,12 +2671,12 @@ "start": { "line": 143, "column": 4, - "index": 4700 + "index": 4717 }, "end": { "line": 148, "column": 44, - "index": 4885 + "index": 4902 } }, "filepath": "src/components/list_group/pinnable_list_group/pinnable_list_group.tsx" diff --git a/package.json b/package.json index 89035a3aaa..eaf39b8da1 100644 --- a/package.json +++ b/package.json @@ -237,7 +237,7 @@ "sass-embedded": "^1.66.1", "sass-lint": "^1.13.1", "sass-lint-auto-fix": "^0.21.2", - "sass-loader": "npm:@bsfishy/sass-loader@10.4.1-support-sass-embedded.3", + "sass-loader": "npm:@amoo-miki/sass-loader@10.4.1-node-sass-9.0.0-libsass-3.6.5-with-sass-embedded.rc1", "shelljs": "^0.8.5", "start-server-and-test": "^2.0.0", "style-loader": "^1.2.1", diff --git a/src/components/tabs/tabbed_content/tabbed_content.tsx b/src/components/tabs/tabbed_content/tabbed_content.tsx index 8204d66c73..cf1d62cda8 100644 --- a/src/components/tabs/tabbed_content/tabbed_content.tsx +++ b/src/components/tabs/tabbed_content/tabbed_content.tsx @@ -53,7 +53,7 @@ interface OuiTabbedContentState { } export type OuiTabbedContentProps = CommonProps & - HTMLAttributes & { + Omit, 'autoFocus'> & { /** * When tabbing into the tabs, set the focus on `initial` for the first tab, * or `selected` for the currently selected tab. Best use case is for inside of diff --git a/yarn.lock b/yarn.lock index f24176cdd7..71b9f9777d 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2577,12 +2577,13 @@ "@types/react" "*" "@types/react@*", "@types/react@^16.9.34": - version "16.9.35" - resolved "https://registry.yarnpkg.com/@types/react/-/react-16.9.35.tgz#a0830d172e8aadd9bd41709ba2281a3124bbd368" - integrity sha512-q0n0SsWcGc8nDqH2GJfWQWUOmZSJhXV64CjVN5SvcNti3TdEaA3AH0D8DwNmMdzjMAC/78tB8nAZIlV8yTz+zQ== + version "16.14.50" + resolved "https://registry.yarnpkg.com/@types/react/-/react-16.14.50.tgz#ec9c30f2f0c7d9aa748949536d88e3439526a25d" + integrity sha512-7TWZ/HjhXsRK3BbhSFxTinbSft3sUXJAU3ONngT0rpcKJaIOlxkRke4bidqQTopUbEv1ApC5nlSEkIpX43MkTg== dependencies: "@types/prop-types" "*" - csstype "^2.2.0" + "@types/scheduler" "*" + csstype "^3.0.2" "@types/refractor@^3.0.0": version "3.0.0" @@ -2603,6 +2604,11 @@ dependencies: "@types/node" "*" +"@types/scheduler@*": + version "0.16.5" + resolved "https://registry.yarnpkg.com/@types/scheduler/-/scheduler-0.16.5.tgz#4751153abbf8d6199babb345a52e1eb4167d64af" + integrity sha512-s/FPdYRmZR8SjLWGMCuax7r3qCWQw9QKHzXVukAuuIJkXkDRwp+Pu5LMIVFi0Fxbav35WURicYr8u1QsoybnQw== + "@types/semver@^7.3.12": version "7.5.0" resolved "https://registry.yarnpkg.com/@types/semver/-/semver-7.5.0.tgz#591c1ce3a702c45ee15f47a42ade72c2fd78978a" @@ -5609,10 +5615,10 @@ cssstyle@^1.0.0: dependencies: cssom "0.3.x" -csstype@^2.2.0: - version "2.6.9" - resolved "https://registry.yarnpkg.com/csstype/-/csstype-2.6.9.tgz#05141d0cd557a56b8891394c1911c40c8a98d098" - integrity sha512-xz39Sb4+OaTsULgUERcCk+TJj8ylkL4aSVDQiX/ksxbELSqwkgt4d4RD7fovIdgJGSuNYqwZEiVjYY5l0ask+Q== +csstype@^3.0.2: + version "3.1.2" + resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.1.2.tgz#1d4bf9d572f11c14031f0436e1c10bc1f571f50b" + integrity sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ== cwd@^0.9.1: version "0.9.1" @@ -14840,16 +14846,16 @@ sass-lint@^1.13.1: path-is-absolute "^1.0.0" util "^0.10.3" -"sass-loader@npm:@bsfishy/sass-loader@10.4.1-support-sass-embedded.3": - version "10.4.1-support-sass-embedded.3" - resolved "https://registry.yarnpkg.com/@bsfishy/sass-loader/-/sass-loader-10.4.1-support-sass-embedded.3.tgz#5be3f0a6bc1eb20e081a336fb1d3474b5c8d7259" - integrity sha512-IcMG8iVIzAjLI9t3S4ucZAwDo6uAiQ+F+1G+TxSv5dt3isHYvDM3T7RgagILdP8i8JcJicfX3GiG8N8/2B/xVQ== +"sass-loader@npm:@amoo-miki/sass-loader@10.4.1-node-sass-9.0.0-libsass-3.6.5-with-sass-embedded.rc1": + version "10.4.1-node-sass-9.0.0-libsass-3.6.5-with-sass-embedded.rc1" + resolved "https://registry.yarnpkg.com/@amoo-miki/sass-loader/-/sass-loader-10.4.1-node-sass-9.0.0-libsass-3.6.5-with-sass-embedded.rc1.tgz#53d6f5ecb9785f957ee5a96780f98a97cb19e9c5" + integrity sha512-ymdhgRVtB4PFnoOEgk/TMr75+STk3rKGFCm8Ju1uTuPNGkA/forR6Xv5GvBjNnMD3xdZyDpBszCeYfuP9Mfdzw== dependencies: klona "^2.0.4" loader-utils "^2.0.0" neo-async "^2.6.2" schema-utils "^3.0.0" - semver "^7.3.2" + semver "^7.5.4" sax@^1.2.4, sax@~1.2.1, sax@~1.2.4: version "1.2.4" @@ -14956,7 +14962,7 @@ semver-truncate@^1.1.2: dependencies: semver "^5.3.0" -"semver@2 || 3 || 4 || 5", semver@5.4.1, semver@5.5.0, semver@7.0.0, semver@^5.0.3, semver@^5.1.0, semver@^5.3.0, semver@^5.4.1, semver@^5.5.0, semver@^5.5.1, semver@^5.6.0, semver@^5.7.0, semver@^5.7.1, semver@^6.0.0, semver@^6.2.0, semver@^6.3.0, semver@^7.1.1, semver@^7.1.3, semver@^7.2.1, semver@^7.3.2, semver@^7.3.4, semver@^7.3.5, semver@^7.3.7, semver@^7.5.3: +"semver@2 || 3 || 4 || 5", semver@5.4.1, semver@5.5.0, semver@7.0.0, semver@^5.0.3, semver@^5.1.0, semver@^5.3.0, semver@^5.4.1, semver@^5.5.0, semver@^5.5.1, semver@^5.6.0, semver@^5.7.0, semver@^5.7.1, semver@^6.0.0, semver@^6.2.0, semver@^6.3.0, semver@^7.1.1, semver@^7.1.3, semver@^7.2.1, semver@^7.3.2, semver@^7.3.4, semver@^7.3.5, semver@^7.3.7, semver@^7.5.3, semver@^7.5.4: version "7.5.3" resolved "https://registry.yarnpkg.com/semver/-/semver-7.5.3.tgz#161ce8c2c6b4b3bdca6caadc9fa3317a4c4fe88e" integrity sha512-QBlUtyVk/5EeHbi7X0fw6liDZc7BBmEaSYn01fMU1OUYbf6GPsbTtd8WmnqbI20SeycoHSeiybkE/q1Q+qlThQ== From 7ca23d07a3adfa3ace4220604400a235242f5f16 Mon Sep 17 00:00:00 2001 From: keskami Date: Thu, 26 Oct 2023 13:54:00 -0400 Subject: [PATCH 2/4] tooltip added Signed-off-by: keskami --- .../__snapshots__/data_grid.test.tsx.snap | 516 ++++++++++-------- .../datagrid/data_grid_header_cell.tsx | 123 +++-- 2 files changed, 346 insertions(+), 293 deletions(-) diff --git a/src/components/datagrid/__snapshots__/data_grid.test.tsx.snap b/src/components/datagrid/__snapshots__/data_grid.test.tsx.snap index bb537ef767..746988b592 100644 --- a/src/components/datagrid/__snapshots__/data_grid.test.tsx.snap +++ b/src/components/datagrid/__snapshots__/data_grid.test.tsx.snap @@ -1051,81 +1051,93 @@ Array [ data-test-subj="dataGridHeader" role="row" > -
-
-
+
-
- - +
-
+ -
-
-
+
-
- - +
-
+
-
-
-
+
-
- - +
-
+ -
-
-
+
-
- - +
-
+
-
-
-
+
-
- - +
-
+
-
-
-
+
-
- - +
-
+
-
-
-
+
-
- - +
-
+
-
-
-
+
-
- - +
-
+
- {column.isResizable !== false && width != null ? ( - - ) : null} +
+ +
+ {column.isResizable !== false && width != null ? ( + + ) : null} - {sorting && sorting.columns.length >= 2 && ( - -
{sortString}
- - )} - {!showColumnActions ? ( - <> - {sortingArrow} -
- {display || displayAsText || id} -
- - ) : ( - - setIsPopoverOpen((isPopoverOpen) => !isPopoverOpen) - }> + {sorting && sorting.columns.length >= 2 && ( + +
{sortString}
+ + )} + {!showColumnActions ? ( + <> {sortingArrow}
{display || displayAsText || id}
- - - } - isOpen={isPopoverOpen} - closePopover={() => setIsPopoverOpen(false)}> -
- -
- - )} + + ) : ( + + setIsPopoverOpen((isPopoverOpen) => !isPopoverOpen) + }> + {sortingArrow} +
+ {display || displayAsText || id} +
+ + + } + isOpen={isPopoverOpen} + closePopover={() => setIsPopoverOpen(false)}> +
+ +
+ + )} +
+
); }; From b5961483c8834c0656d5308d406a328f9ff1d892 Mon Sep 17 00:00:00 2001 From: keskami Date: Thu, 26 Oct 2023 13:59:04 -0400 Subject: [PATCH 3/4] tooltip documented Signed-off-by: Kestan Kamei Signed-off-by: keskami --- src/components/datagrid/data_grid_header_cell.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/src/components/datagrid/data_grid_header_cell.tsx b/src/components/datagrid/data_grid_header_cell.tsx index b3af8b3e81..c6e6fc6d13 100644 --- a/src/components/datagrid/data_grid_header_cell.tsx +++ b/src/components/datagrid/data_grid_header_cell.tsx @@ -312,6 +312,7 @@ export const OuiDataGridHeaderCell: FunctionComponent
Date: Thu, 26 Oct 2023 14:11:34 -0400 Subject: [PATCH 4/4] Signed-off-by: Kestan Kamei tooltip added Signed-off-by: keskami --- .../datagrid/data_grid_header_cell.tsx | 132 +++++++++--------- 1 file changed, 65 insertions(+), 67 deletions(-) diff --git a/src/components/datagrid/data_grid_header_cell.tsx b/src/components/datagrid/data_grid_header_cell.tsx index c6e6fc6d13..55564c14c8 100644 --- a/src/components/datagrid/data_grid_header_cell.tsx +++ b/src/components/datagrid/data_grid_header_cell.tsx @@ -313,74 +313,72 @@ export const OuiDataGridHeaderCell: FunctionComponent - -
- {column.isResizable !== false && width != null ? ( - - ) : null} + +
+ {column.isResizable !== false && width != null ? ( + + ) : null} - {sorting && sorting.columns.length >= 2 && ( - -
{sortString}
- - )} - {!showColumnActions ? ( - <> - {sortingArrow} -
- {display || displayAsText || id} -
- - ) : ( - - setIsPopoverOpen((isPopoverOpen) => !isPopoverOpen) - }> - {sortingArrow} -
- {display || displayAsText || id} -
- - - } - isOpen={isPopoverOpen} - closePopover={() => setIsPopoverOpen(false)}> -
- = 2 && ( + +
{sortString}
+ + )} + {!showColumnActions ? ( + <> + {sortingArrow} +
+ {display || displayAsText || id} +
+ + ) : ( + + setIsPopoverOpen((isPopoverOpen) => !isPopoverOpen) + }> + {sortingArrow} +
+ {display || displayAsText || id} +
+ -
- - )} -
- -
+ + } + isOpen={isPopoverOpen} + closePopover={() => setIsPopoverOpen(false)}> +
+ +
+ + )} +
+ ); };