Merge branch 'master' into hbhong/fix/TDOPS-4851-no-copy-message

Talend · Aug 2, 2023 · 688b780 · 688b780
2 parents e349b32 + fc50964
commit 688b780
Show file tree

Hide file tree

Showing 11 changed files with 82 additions and 50 deletions.
diff --git a/.changeset/big-masks-relate.md b/.changeset/big-masks-relate.md
diff --git a/.changeset/old-onions-remain.md b/.changeset/old-onions-remain.md
diff --git a/packages/components/CHANGELOG.md b/packages/components/CHANGELOG.md
@@ -1,5 +1,13 @@
 # @talend/react-components
 
+## 11.1.3
+
+### Patch Changes
+
+- 3345262d2: fix: tokens on the Slider component and migration to typescript
+- Updated dependencies [b36165add]
+  - @talend/design-tokens@2.8.0
+
 ## 11.1.2
 
 ### Patch Changes

diff --git a/packages/components/package.json b/packages/components/package.json
@@ -36,7 +36,7 @@
   "dependencies": {
     "@popperjs/core": "^2.11.8",
     "@talend/bootstrap-theme": "^8.0.0",
-    "@talend/design-tokens": "^2.7.3",
+    "@talend/design-tokens": "^2.8.0",
     "@talend/react-a11y": "^1.1.0",
     "@talend/icons": "^6.58.1",
     "@talend/utils": "^2.5.1",
@@ -113,5 +113,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "version": "11.1.2"
+  "version": "11.1.3"
 }
diff --git a/packages/design-tokens/CHANGELOG.md b/packages/design-tokens/CHANGELOG.md
@@ -1,5 +1,11 @@
 # @talend/design-tokens
 
+## 2.8.0
+
+### Minor Changes
+
+- b36165add: feat: add brand & info tokens
+
 ## 2.7.3
 
 ### Patch Changes

diff --git a/packages/design-tokens/package.json b/packages/design-tokens/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@talend/design-tokens",
-  "version": "2.7.3",
+  "version": "2.8.0",
   "description": "Talend Design Tokens",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",

diff --git a/packages/faceted-search/CHANGELOG.md b/packages/faceted-search/CHANGELOG.md
@@ -1,5 +1,12 @@
 # Changelog
 
+## 11.0.1
+
+### Patch Changes
+
+- Updated dependencies [b36165add]
+  - @talend/design-tokens@2.8.0
+
 ## 11.0.0
 
 ### Major Changes

diff --git a/packages/faceted-search/package.json b/packages/faceted-search/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@talend/react-faceted-search",
-  "version": "11.0.0",
+  "version": "11.0.1",
   "description": "Faceted search",
   "main": "lib/index.js",
   "mainSrc": "src/index.js",
@@ -36,7 +36,7 @@
     "@talend/daikon-tql-client": "^1.3.1",
     "@talend/utils": "^2.5.1",
     "@talend/react-bootstrap": "^1.35.2",
-    "@talend/design-tokens": "2.7.3",
+    "@talend/design-tokens": "2.8.0",
     "classnames": "^2.3.2",
     "date-fns": "^1.30.1",
     "invariant": "^2.2.4",
@@ -51,7 +51,7 @@
     "@talend/icons": "^6.58.1",
     "@talend/locales-tui-components": "^9.5.0",
     "@talend/locales-tui-faceted-search": "^8.1.0",
-    "@talend/react-components": "^11.0.0",
+    "@talend/react-components": "^11.1.3",
     "@talend/scripts-core": "^14.0.0",
     "@talend/scripts-config-react-webpack": "^15.4.1",
     "babel-plugin-angularjs-annotate": "^0.10.0",

diff --git a/packages/theme/CHANGELOG.md b/packages/theme/CHANGELOG.md
@@ -1,5 +1,11 @@
 # @talend/bootstrap-theme
 
+## 8.0.1
+
+### Patch Changes
+
+- ae4916894: Bootstrap Theme : Fix various button border issues using Design System tokens
+
 ## 8.0.0
 
 ### Major Changes

diff --git a/packages/theme/package.json b/packages/theme/package.json
@@ -44,5 +44,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "version": "8.0.0"
+  "version": "8.0.1"
 }
diff --git a/packages/theme/src/theme/_buttons.scss b/packages/theme/src/theme/_buttons.scss
@@ -24,21 +24,13 @@
 	&,
 	&:focus,
 	&:hover {
-		color: currentColor;
-		background-color: transparent;
 		border-color: transparent;
 	}
 
 	&:active,
 	.open > &.dropdown-toggle {
 		box-shadow: none;
-
-		&,
-		&:hover {
-			color: var(--t-button-color);
-			background-color: var(--t-button-background-color);
-			border-color: var(--t-button-border-color);
-		}
+		border-color: transparent;
 	}
 
 	&,
@@ -56,9 +48,6 @@
 		&:hover,
 		&:focus,
 		&.focus {
-			color: var(--t-button-color);
-			background-color: var(--t-button-background-color);
-			border-color: var(--t-button-border-color);
 			opacity: 0.54;
 			cursor: not-allowed;
 		}
@@ -99,16 +88,28 @@
 			background: tokens.$coral-color-accent-background-strong-active;
 			color: tokens.$coral-color-accent-text-weak-active;
 		}
+
+		&.disabled,
+		&[disabled],
+		&[aria-disabled='true'],
+		&[aria-busy='true'] {
+			background: tokens.$coral-color-accent-background-strong;
+			color: tokens.$coral-color-accent-text-weak;
+
+			&:hover {
+				background-color: tokens.$coral-color-accent-background-strong;
+			}
+		}
 	}
 
 	&-inverse {
 		background-color: transparent;
-		border: tokens.$coral-border-s-solid tokens.$coral-color-accent-border;
+		border-color: tokens.$coral-color-accent-border;
 		color: tokens.$coral-color-accent-text;
 
 		&:hover {
 			background: tokens.$coral-color-accent-background-weak-hover;
-			border: tokens.$coral-border-s-solid tokens.$coral-color-accent-border;
+			border-color: tokens.$coral-color-accent-border-hover;
 			color: tokens.$coral-color-accent-text-strong-hover;
 		}
 
@@ -117,12 +118,13 @@
 			color: tokens.$coral-color-accent-text-strong-active;
 		}
 
-		&:disabled,
+		&.disabled,
+		&[disabled],
 		&[aria-disabled='true'],
 		&[aria-busy='true'] {
 			background: transparent;
-			border: tokens.$coral-border-s-solid tokens.$coral-color-neutral-border-disabled;
-			color: tokens.$coral-color-neutral-text-disabled;
+			border-color: tokens.$coral-color-accent-border;
+			color: tokens.$coral-color-accent-text;
 
 			&:hover {
 				background-color: transparent;
@@ -132,12 +134,12 @@
 
 	&--secondary {
 		background-color: transparent;
-		border-color: tokens.$coral-color-accent-text;
+		border-color: tokens.$coral-color-accent-border;
 		color: tokens.$coral-color-accent-text;
 
 		&:hover {
 			background: tokens.$coral-color-accent-background-weak-hover;
-			border-color: tokens.$coral-color-accent-text;
+			border-color: tokens.$coral-color-accent-border-hover;
 			color: tokens.$coral-color-accent-text-strong-hover;
 		}
 
@@ -146,12 +148,13 @@
 			color: tokens.$coral-color-accent-text-strong-active;
 		}
 
-		&:disabled,
+		&.disabled,
+		&[disabled],
 		&[aria-disabled='true'],
 		&[aria-busy='true'] {
 			background: transparent;
-			border: tokens.$coral-border-s-solid tokens.$coral-color-neutral-border-disabled;
-			color: tokens.$coral-color-neutral-text-disabled;
+			border-color: tokens.$coral-color-accent-border;
+			color: tokens.$coral-color-accent-text;
 
 			&:hover {
 				background-color: transparent;
@@ -174,12 +177,12 @@
 			color: tokens.$coral-color-accent-text-strong-active;
 		}
 
-		&:disabled,
+		&.disabled,
+		&[disabled],
 		&[aria-disabled='true'],
 		&[aria-busy='true'] {
 			background: transparent;
-			border: tokens.$coral-border-s-solid tokens.$coral-color-neutral-border-disabled;
-			color: tokens.$coral-color-neutral-text-disabled;
+			color: tokens.$coral-color-accent-text;
 
 			&:hover {
 				background-color: transparent;
@@ -198,22 +201,27 @@
 			color: tokens.$coral-color-accent-text-strong-active;
 		}
 
-		&:disabled,
+		&.disabled,
+		&[disabled],
 		&[aria-disabled='true'],
 		&[aria-busy='true'] {
-			border: tokens.$coral-border-s-solid tokens.$coral-color-neutral-border-disabled;
-			color: tokens.$coral-color-neutral-text-disabled;
+			color: tokens.$coral-color-accent-text;
+
+			&:hover {
+				color: tokens.$coral-color-accent-text;
+			}
 		}
 	}
 
 	&.btn-danger,
 	&.btn--destructive {
 		background: tokens.$coral-color-danger-background-strong;
-		border: tokens.$coral-color-danger-background-strong;
+		border-color: tokens.$coral-color-danger-border;
 		color: tokens.$coral-color-danger-text-weak;
 
 		&:hover {
 			background: tokens.$coral-color-danger-background-strong-hover;
+			border-color: tokens.$coral-color-danger-border-hover;
 			color: tokens.$coral-color-danger-text-weak-hover;
 		}
 
@@ -222,10 +230,17 @@
 			color: tokens.$coral-color-danger-text-weak-active;
 		}
 
-		&[disabled] &:hover,
-		.disabled &:hover {
-			background: tokens.$coral-color-neutral-background-disabled;
-			color: tokens.$coral-color-neutral-text-disabled;
+		&[disabled],
+		.disabled,
+		&[aria-disabled='true'],
+		&[aria-busy='true'] {
+			background: tokens.$coral-color-danger-background-strong;
+			border-color: tokens.$coral-color-danger-border;
+			color: tokens.$coral-color-danger-text-weak;
+
+			&:hover {
+				background-color: tokens.$coral-color-danger-background-strong;
+			}
 		}
 	}