-
Notifications
You must be signed in to change notification settings - Fork 1.5k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
[HIGH] Incorporated PR comments of 4846 (#4857)
* Rename to OrgSchema from SchemaOrg * Rename to OrgSchema * Remove unnecessary handleXXX * Remove unnecessary typings * Remove unnecessary undefined * Remove commented CSS * Remove unnecessary handleXXX * Add CSSTokens and rename to CSS custom properties * Rename to CSSTokens and CSS custom properties * Type out useStyleSet * Add entry * Freeze arrays * Typo * Remove as const * Move typecasting outside
- Loading branch information
Showing
44 changed files
with
173 additions
and
187 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
4 changes: 2 additions & 2 deletions
4
packages/bundle/src/adaptiveCards/Attachment/AnimationCardContent.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
4 changes: 2 additions & 2 deletions
4
packages/bundle/src/adaptiveCards/Attachment/AudioCardContent.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
4 changes: 1 addition & 3 deletions
4
packages/bundle/src/adaptiveCards/Attachment/SignInCardContent.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
4 changes: 2 additions & 2 deletions
4
packages/bundle/src/adaptiveCards/Attachment/VideoCardContent.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,13 @@ | ||
import { hooks } from 'botframework-webchat-component'; | ||
|
||
import type AdaptiveCardsStyleSet from '../adaptiveCards/AdaptiveCardsStyleSet'; | ||
|
||
const useMinimalStyleSet = hooks.useStyleSet; | ||
|
||
type MinimalStyleSet = ReturnType<typeof useMinimalStyleSet>[0]; | ||
|
||
export default function useStyleSet(): readonly [MinimalStyleSet & AdaptiveCardsStyleSet] { | ||
const [styleOptions] = useMinimalStyleSet(); | ||
|
||
return Object.freeze([styleOptions as MinimalStyleSet & AdaptiveCardsStyleSet] as const); | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
2 changes: 1 addition & 1 deletion
2
packages/component/src/ActivityStatus/private/Feedback/private/VoteButton.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,21 @@ | ||
import CustomPropertyNames from './CustomPropertyNames'; | ||
|
||
type CustomPropertyNamesType = typeof CustomPropertyNames; | ||
|
||
type CSSTokensType<T extends Readonly<Record<string, string>>> = { | ||
[K in keyof T]: `var(${T[K]})`; | ||
}; | ||
|
||
// To add/remove/update a token, go to `CustomPropertyName.ts`. | ||
const CSSTokens = new Proxy( | ||
{}, | ||
{ | ||
get(_, key: keyof CustomPropertyNamesType) { | ||
// We already checked in the `CustomPropertyName`. | ||
// eslint-disable-next-line security/detect-object-injection | ||
return `var(${CustomPropertyNames[key]})`; | ||
} | ||
} | ||
) as CSSTokensType<CustomPropertyNamesType>; | ||
|
||
export default CSSTokens; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,16 @@ | ||
const CustomPropertyNames = Object.freeze({ | ||
// Make sure key names does not have JavaScript forbidden names. | ||
ColorAccent: '--webchat__color--accent', | ||
ColorTimestamp: '--webchat__color--timestamp', | ||
FontPrimary: '--webchat__font--primary', | ||
FontSizeSmall: '--webchat__font-size--small', | ||
IconURLExternalLink: '--webchat__icon-url--external-link', | ||
MaxWidthBubble: '--webchat__max-width--bubble', | ||
MinHeightBubble: '--webchat__min-height--bubble', | ||
PaddingRegular: '--webchat__padding--regular' | ||
}); | ||
|
||
// This is for type-checking only to make sure the CSS custom property names is `--webchat__${string}`. | ||
const _TypeChecking: Readonly<Record<string, `--webchat__${string}`>> = CustomPropertyNames; | ||
|
||
export default CustomPropertyNames; |
45 changes: 45 additions & 0 deletions
45
packages/component/src/Styles/StyleSet/CSSCustomProperties.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,45 @@ | ||
import { StrictStyleOptions } from 'botframework-webchat-api'; | ||
|
||
import CustomPropertyNames from '../CustomPropertyNames'; | ||
|
||
export default function createCSSCustomPropertiesStyle({ | ||
accent, | ||
bubbleMaxWidth, | ||
bubbleMinHeight, | ||
fontSizeSmall, | ||
markdownExternalLinkIconImage, | ||
paddingRegular, | ||
primaryFont, | ||
subtle, | ||
timestampColor | ||
}: StrictStyleOptions) { | ||
return { | ||
'&.webchat__css-custom-properties': { | ||
display: 'contents', | ||
|
||
// TODO: Should we register the CSS property for inheritance, type checking, and initial value? | ||
// Registrations need to be done on global level, and duplicate registration will throw. | ||
// https://developer.mozilla.org/en-US/docs/Web/CSS/@property | ||
|
||
// TODO: This is ongoing work. We are slowly adding CSS variables to ease calculations and stuff. | ||
// | ||
// We need to build a story to let web devs override these CSS variables. | ||
// | ||
// Candy points: | ||
// - They should be able to override CSS variables for certain things (say, padding of popover) without affecting much. | ||
// | ||
// House rules: | ||
// - We should put styling varibles here, e.g. paddingRegular | ||
// - We MUST NOT put runtime variables here, e.g. sendTimeout | ||
// - This is because we cannot programmatically know when the sendTimeout change | ||
[CustomPropertyNames.ColorAccent]: accent, | ||
[CustomPropertyNames.ColorTimestamp]: timestampColor || subtle, // Maybe we should not need this if we allow web devs to override CSS variables for certain components. | ||
[CustomPropertyNames.FontPrimary]: primaryFont, | ||
[CustomPropertyNames.FontSizeSmall]: fontSizeSmall, | ||
[CustomPropertyNames.IconURLExternalLink]: markdownExternalLinkIconImage, | ||
[CustomPropertyNames.MaxWidthBubble]: bubbleMaxWidth + 'px', | ||
[CustomPropertyNames.MinHeightBubble]: bubbleMinHeight + 'px', | ||
[CustomPropertyNames.PaddingRegular]: paddingRegular + 'px' | ||
} | ||
}; | ||
} |
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.