From 7c234d0cead00265f05cbc81a6a84b5bd07d1b5f Mon Sep 17 00:00:00 2001 From: npiyush97 Date: Fri, 19 Apr 2024 21:25:00 +0530 Subject: [PATCH] added style maxwidth 200 and props Signed-off-by: npiyush97 --- packages/core-components/api-report.md | 1 - packages/core-components/package.json | 46 +++++++++---------- .../OverflowTooltip.stories.tsx | 8 +--- .../OverflowTooltip/OverflowTooltip.tsx | 3 +- 4 files changed, 26 insertions(+), 32 deletions(-) diff --git a/packages/core-components/api-report.md b/packages/core-components/api-report.md index 7fd706db43..06676ab429 100644 --- a/packages/core-components/api-report.md +++ b/packages/core-components/api-report.md @@ -47,7 +47,6 @@ import { StyledComponentProps } from '@material-ui/core/styles/withStyles'; import { StyleRules } from '@material-ui/styles'; import { StyleRules as StyleRules_2 } from '@material-ui/core/styles/withStyles'; import { TabProps } from '@material-ui/core/Tab'; -import { TextTruncateProps } from 'react-text-truncate'; import { Theme } from '@material-ui/core/styles'; import { TooltipProps } from '@material-ui/core/Tooltip'; import { WithStyles } from '@material-ui/core/styles'; diff --git a/packages/core-components/package.json b/packages/core-components/package.json index 9f632bcc7f..cbdb256c65 100644 --- a/packages/core-components/package.json +++ b/packages/core-components/package.json @@ -1,31 +1,32 @@ { "name": "@backstage/core-components", - "description": "Core components used by Backstage plugins and apps", "version": "0.14.4", - "publishConfig": { - "access": "public" - }, + "description": "Core components used by Backstage plugins and apps", "backstage": { "role": "web-library" }, + "publishConfig": { + "access": "public" + }, + "keywords": [ + "backstage" + ], "homepage": "https://backstage.io", "repository": { "type": "git", "url": "https://github.com/backstage/backstage", "directory": "packages/core-components" }, - "keywords": [ - "backstage" - ], "license": "Apache-2.0", - "main": "src/index.ts", - "types": "src/index.ts", + "sideEffects": false, "exports": { ".": "./src/index.ts", "./alpha": "./src/alpha.ts", "./testUtils": "./src/testUtils.ts", "./package.json": "./package.json" }, + "main": "src/index.ts", + "types": "src/index.ts", "typesVersions": { "*": { "alpha": [ @@ -39,15 +40,18 @@ ] } }, - "sideEffects": false, + "files": [ + "dist", + "config.d.ts" + ], "scripts": { "build": "backstage-cli package build", + "clean": "backstage-cli package clean", "lint": "backstage-cli package lint", - "test": "backstage-cli package test", "prepack": "backstage-cli package prepack", "postpack": "backstage-cli package postpack", - "clean": "backstage-cli package clean", - "start": "backstage-cli package start" + "start": "backstage-cli package start", + "test": "backstage-cli package test" }, "dependencies": { "@backstage/config": "workspace:^", @@ -63,7 +67,6 @@ "@react-hookz/web": "^24.0.0", "@types/react": "^16.13.1 || ^17.0.0 || ^18.0.0", "@types/react-sparklines": "^1.7.0", - "@types/react-text-truncate": "^0.14.0", "ansi-regex": "^6.0.1", "classnames": "^2.2.6", "d3-selection": "^3.0.0", @@ -82,7 +85,6 @@ "react-markdown": "^8.0.0", "react-sparklines": "^1.7.0", "react-syntax-highlighter": "^15.4.5", - "react-text-truncate": "^0.19.0", "react-use": "^17.3.2", "react-virtualized-auto-sizer": "^1.0.11", "react-window": "^1.8.6", @@ -90,11 +92,6 @@ "zen-observable": "^0.10.0", "zod": "^3.22.4" }, - "peerDependencies": { - "react": "^16.13.1 || ^17.0.0 || ^18.0.0", - "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", - "react-router-dom": "6.0.0-beta.0 || ^6.3.0" - }, "devDependencies": { "@backstage/app-defaults": "workspace:^", "@backstage/cli": "workspace:^", @@ -120,9 +117,10 @@ "history": "^5.0.0", "msw": "^1.0.0" }, - "files": [ - "dist", - "config.d.ts" - ], + "peerDependencies": { + "react": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-dom": "^16.13.1 || ^17.0.0 || ^18.0.0", + "react-router-dom": "6.0.0-beta.0 || ^6.3.0" + }, "configSchema": "config.d.ts" } diff --git a/packages/core-components/src/components/OverflowTooltip/OverflowTooltip.stories.tsx b/packages/core-components/src/components/OverflowTooltip/OverflowTooltip.stories.tsx index 5ab5ba7dc4..a302a0a7e3 100644 --- a/packages/core-components/src/components/OverflowTooltip/OverflowTooltip.stories.tsx +++ b/packages/core-components/src/components/OverflowTooltip/OverflowTooltip.stories.tsx @@ -33,16 +33,12 @@ export const Default = () => ( export const MultiLine = () => ( - + ); export const DifferentTitle = () => ( - + ); diff --git a/packages/core-components/src/components/OverflowTooltip/OverflowTooltip.tsx b/packages/core-components/src/components/OverflowTooltip/OverflowTooltip.tsx index b7a33f97fc..12de79644f 100644 --- a/packages/core-components/src/components/OverflowTooltip/OverflowTooltip.tsx +++ b/packages/core-components/src/components/OverflowTooltip/OverflowTooltip.tsx @@ -21,7 +21,7 @@ import React from 'react'; import Typography from '@material-ui/core/Typography'; type Props = { - text: string; + text?: string | undefined; title?: TooltipProps['title']; placement?: TooltipProps['placement']; }; @@ -34,6 +34,7 @@ const useStyles = makeStyles( overflow: 'visible !important', }, typo: { + maxWidth: 200, display: 'inline-block', overflow: 'hidden', whiteSpace: 'nowrap',