diff --git a/CHANGELOG.md b/CHANGELOG.md index a1f2550279..0c8926bb5c 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -43,7 +43,7 @@ Notes: web developers are advised to use [`~` (tilde range)](https://github.com/ - Introduced centralized announcements approach via the new `usePushToLiveRegion` hook, in PR [#5251](https://github.com/microsoft/BotFramework-WebChat/pull/5251), by [@OEvgeny](https://github.com/OEvgeny) - Added keyboard shortcut for the "New Messages" button, in PR [#5251](https://github.com/microsoft/BotFramework-WebChat/pull/5251), by [@OEvgeny](https://github.com/OEvgeny) - Added decorators for loading and completion states to the Fluent theme, in PR [#5269](https://github.com/microsoft/BotFramework-WebChat/pull/5269), by [@OEvgeny](https://github.com/OEvgeny) -- Added blueprint of starter prompts in the Fluent theme, in PR [#5270](https://github.com/microsoft/BotFramework-WebChat/pull/5270), [#5276](https://github.com/microsoft/BotFramework-WebChat/pull/5276) and [#5279](https://github.com/microsoft/BotFramework-WebChat/pull/5279), by [@OEvgeny](https://github.com/OEvgeny) and [@compulim](https://github.com/compulim) +- Added blueprint of starter prompts in the Fluent theme, in PR [#5270](https://github.com/microsoft/BotFramework-WebChat/pull/5270), [#5276](https://github.com/microsoft/BotFramework-WebChat/pull/5276), [#5279](https://github.com/microsoft/BotFramework-WebChat/pull/5279), and [#5284](https://github.com/microsoft/BotFramework-WebChat/pull/5284), by [@OEvgeny](https://github.com/OEvgeny) and [@compulim](https://github.com/compulim) - Added support for liner message activities in the Fluent theme, in PR [#5272](https://github.com/microsoft/BotFramework-WebChat/pull/5272), by [@OEvgeny](https://github.com/OEvgeny) - Added new `uiState` props and `useUIState` hook, in PR [#5276](https://github.com/microsoft/BotFramework-WebChat/pull/5276), by [@compulim](https://github.com/compulim) diff --git a/__tests__/__image_snapshots__/html/ui-state-blueprint-non-english-js-fluent-theme-applied-in-non-english-language-blueprint-state-should-match-normal-state-1-snap.png b/__tests__/__image_snapshots__/html/ui-state-blueprint-non-english-js-fluent-theme-applied-in-non-english-language-blueprint-state-should-match-normal-state-1-snap.png new file mode 100644 index 0000000000..a7295a848c Binary files /dev/null and b/__tests__/__image_snapshots__/html/ui-state-blueprint-non-english-js-fluent-theme-applied-in-non-english-language-blueprint-state-should-match-normal-state-1-snap.png differ diff --git a/__tests__/__image_snapshots__/html/ui-state-blueprint-non-english-js-fluent-theme-applied-in-non-english-language-blueprint-state-should-match-normal-state-2-snap.png b/__tests__/__image_snapshots__/html/ui-state-blueprint-non-english-js-fluent-theme-applied-in-non-english-language-blueprint-state-should-match-normal-state-2-snap.png new file mode 100644 index 0000000000..0de37f5684 Binary files /dev/null and b/__tests__/__image_snapshots__/html/ui-state-blueprint-non-english-js-fluent-theme-applied-in-non-english-language-blueprint-state-should-match-normal-state-2-snap.png differ diff --git a/__tests__/__image_snapshots__/html/ui-state-js-fluent-theme-applied-ui-state-should-display-properly-in-dark-theme-3-snap.png b/__tests__/__image_snapshots__/html/ui-state-js-fluent-theme-applied-ui-state-should-display-properly-in-dark-theme-3-snap.png index 2941f62f37..54ec64a3e0 100644 Binary files a/__tests__/__image_snapshots__/html/ui-state-js-fluent-theme-applied-ui-state-should-display-properly-in-dark-theme-3-snap.png and b/__tests__/__image_snapshots__/html/ui-state-js-fluent-theme-applied-ui-state-should-display-properly-in-dark-theme-3-snap.png differ diff --git a/__tests__/__image_snapshots__/html/ui-state-js-fluent-theme-applied-ui-state-should-display-properly-in-dark-theme-7-snap.png b/__tests__/__image_snapshots__/html/ui-state-js-fluent-theme-applied-ui-state-should-display-properly-in-dark-theme-7-snap.png index 13b70db230..6e068b1a2e 100644 Binary files a/__tests__/__image_snapshots__/html/ui-state-js-fluent-theme-applied-ui-state-should-display-properly-in-dark-theme-7-snap.png and b/__tests__/__image_snapshots__/html/ui-state-js-fluent-theme-applied-ui-state-should-display-properly-in-dark-theme-7-snap.png differ diff --git a/__tests__/__image_snapshots__/html/ui-state-js-fluent-theme-applied-ui-state-should-display-properly-in-dark-theme-and-rtl-3-snap.png b/__tests__/__image_snapshots__/html/ui-state-js-fluent-theme-applied-ui-state-should-display-properly-in-dark-theme-and-rtl-3-snap.png index 1053c08591..36689027a8 100644 Binary files a/__tests__/__image_snapshots__/html/ui-state-js-fluent-theme-applied-ui-state-should-display-properly-in-dark-theme-and-rtl-3-snap.png and b/__tests__/__image_snapshots__/html/ui-state-js-fluent-theme-applied-ui-state-should-display-properly-in-dark-theme-and-rtl-3-snap.png differ diff --git a/__tests__/__image_snapshots__/html/ui-state-js-fluent-theme-applied-ui-state-should-display-properly-in-dark-theme-and-rtl-7-snap.png b/__tests__/__image_snapshots__/html/ui-state-js-fluent-theme-applied-ui-state-should-display-properly-in-dark-theme-and-rtl-7-snap.png index 0d290981db..afed7d9b2b 100644 Binary files a/__tests__/__image_snapshots__/html/ui-state-js-fluent-theme-applied-ui-state-should-display-properly-in-dark-theme-and-rtl-7-snap.png and b/__tests__/__image_snapshots__/html/ui-state-js-fluent-theme-applied-ui-state-should-display-properly-in-dark-theme-and-rtl-7-snap.png differ diff --git a/__tests__/__image_snapshots__/html/ui-state-js-fluent-theme-applied-ui-state-should-display-properly-in-light-theme-3-snap.png b/__tests__/__image_snapshots__/html/ui-state-js-fluent-theme-applied-ui-state-should-display-properly-in-light-theme-3-snap.png index de9284f2f6..8cce1184be 100644 Binary files a/__tests__/__image_snapshots__/html/ui-state-js-fluent-theme-applied-ui-state-should-display-properly-in-light-theme-3-snap.png and b/__tests__/__image_snapshots__/html/ui-state-js-fluent-theme-applied-ui-state-should-display-properly-in-light-theme-3-snap.png differ diff --git a/__tests__/__image_snapshots__/html/ui-state-js-fluent-theme-applied-ui-state-should-display-properly-in-light-theme-7-snap.png b/__tests__/__image_snapshots__/html/ui-state-js-fluent-theme-applied-ui-state-should-display-properly-in-light-theme-7-snap.png index ff692a159b..17740d32ad 100644 Binary files a/__tests__/__image_snapshots__/html/ui-state-js-fluent-theme-applied-ui-state-should-display-properly-in-light-theme-7-snap.png and b/__tests__/__image_snapshots__/html/ui-state-js-fluent-theme-applied-ui-state-should-display-properly-in-light-theme-7-snap.png differ diff --git a/__tests__/html/fluentTheme/uiState.blueprint.nonEnglish.html b/__tests__/html/fluentTheme/uiState.blueprint.nonEnglish.html new file mode 100644 index 0000000000..bd62ac29f4 --- /dev/null +++ b/__tests__/html/fluentTheme/uiState.blueprint.nonEnglish.html @@ -0,0 +1,180 @@ + + + + + + + + + + + + + + +
+ + + diff --git a/__tests__/html/fluentTheme/uiState.blueprint.nonEnglish.js b/__tests__/html/fluentTheme/uiState.blueprint.nonEnglish.js new file mode 100644 index 0000000000..3d94dc0761 --- /dev/null +++ b/__tests__/html/fluentTheme/uiState.blueprint.nonEnglish.js @@ -0,0 +1,5 @@ +/** @jest-environment ./packages/test/harness/src/host/jest/WebDriverEnvironment.js */ + +describe('Fluent theme applied in non-English language', () => { + test('blueprint state should match normal state', () => runHTML('fluentTheme/uiState.blueprint.nonEnglish')); +}); diff --git a/packages/fluent-theme/src/components/preChatActivity/StarterPromptsCardAction.module.css b/packages/fluent-theme/src/components/preChatActivity/StarterPromptsCardAction.module.css index 00f58ea653..fc2195cb6a 100644 --- a/packages/fluent-theme/src/components/preChatActivity/StarterPromptsCardAction.module.css +++ b/packages/fluent-theme/src/components/preChatActivity/StarterPromptsCardAction.module.css @@ -22,10 +22,13 @@ grid-template-columns: 20px 1fr; } + &:empty { + row-gap: 14px; + } + &[aria-disabled='true'], &:empty { cursor: default; - row-gap: 14px; } &[aria-disabled='true']:not(:empty) { diff --git a/packages/fluent-theme/src/components/sendBox/SendBox.tsx b/packages/fluent-theme/src/components/sendBox/SendBox.tsx index 1b661c08a8..322c91ecd2 100644 --- a/packages/fluent-theme/src/components/sendBox/SendBox.tsx +++ b/packages/fluent-theme/src/components/sendBox/SendBox.tsx @@ -182,7 +182,12 @@ function SendBox(props: Props) { }; return ( -
+