@fluentui-copilot/react-send-button 0.0.4-hotfix.1 → 0.0.4-hotfix.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.json +4 -4
- package/CHANGELOG.md +5 -5
- package/lib/SendButton.js +1 -0
- package/lib/components/SendButton/SendButton.js +5 -4
- package/lib/components/SendButton/SendButton.types.js +2 -1
- package/lib/components/SendButton/buttonMotion.js +138 -199
- package/lib/components/SendButton/index.js +1 -0
- package/lib/components/SendButton/renderSendButton.js +30 -38
- package/lib/components/SendButton/useSendButton.js +97 -95
- package/lib/components/SendButton/useSendButtonStyles.styles.raw.js +187 -176
- package/lib/index.js +1 -0
- package/lib-commonjs/SendButton.js +1 -0
- package/lib-commonjs/components/SendButton/SendButton.js +1 -1
- package/lib-commonjs/components/SendButton/SendButton.js.map +1 -1
- package/lib-commonjs/components/SendButton/SendButton.types.js +1 -0
- package/lib-commonjs/components/SendButton/buttonMotion.js +1 -1
- package/lib-commonjs/components/SendButton/buttonMotion.js.map +1 -1
- package/lib-commonjs/components/SendButton/index.js +1 -0
- package/lib-commonjs/components/SendButton/renderSendButton.js +1 -1
- package/lib-commonjs/components/SendButton/renderSendButton.js.map +1 -1
- package/lib-commonjs/components/SendButton/useSendButton.js +1 -1
- package/lib-commonjs/components/SendButton/useSendButton.js.map +1 -1
- package/lib-commonjs/components/SendButton/useSendButtonStyles.styles.raw.js +1 -1
- package/lib-commonjs/components/SendButton/useSendButtonStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/index.js +1 -0
- package/package.json +4 -4
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["buttonMotion.ts"],"sourcesContent":["import type { PresenceMotionFn } from '@fluentui/react-components';\nimport { createPresenceComponent, motionTokens } from '@fluentui/react-components';\n\nconst scaleSend = 1.2;\nconst startScaleStop = 0.5;\nconst scaleStop = 1.2;\nconst startScaleCircle = 0.1;\nconst scaleCircle = 1.1;\n\nconst motionSpeedMultiplier = 1;\n\nconst sendMotion: PresenceMotionFn = () => {\n const enterKeyframes = [\n {\n keyframes: [{ transform: `scale(0)` }],\n duration: 0,\n },\n {\n keyframes: [{ transform: `scale(0)` }, { transform: `scale(${scaleSend})` }],\n duration: motionTokens.durationNormal * motionSpeedMultiplier,\n easing: motionTokens.curveDecelerateMax,\n delay: motionTokens.durationSlow * motionSpeedMultiplier,\n },\n {\n keyframes: [{ transform: `scale(${scaleSend})` }, { transform: 'scale(1)' }],\n duration: motionTokens.durationSlow * motionSpeedMultiplier,\n easing: motionTokens.curveDecelerateMid,\n delay: (motionTokens.durationSlow + motionTokens.durationNormal) * motionSpeedMultiplier,\n },\n ];\n\n const exitKeyframes = [\n {\n keyframes: [{ transform: `scale(1)` }, { transform: `scale(0)` }],\n duration: motionTokens.durationFast * motionSpeedMultiplier,\n easing: motionTokens.curveDecelerateMid,\n },\n ];\n\n return {\n enter: enterKeyframes,\n exit: exitKeyframes,\n };\n};\n\nconst stopMotion: PresenceMotionFn = () => {\n const enterKeyframes = [\n {\n keyframes: [{ opacity: 0 }],\n duration: 0,\n },\n {\n keyframes: [{ opacity: 1 }],\n duration: 0,\n delay: 30 * motionSpeedMultiplier, // non-standard motion duration\n },\n {\n keyframes: [{ transform: `scale(${startScaleStop})` }, { transform: `scale(1)` }],\n duration: motionTokens.durationSlower * motionSpeedMultiplier,\n easing: motionTokens.curveDecelerateMid,\n },\n ];\n\n const exitKeyframes = [\n {\n keyframes: [{ transform: `scale(1)` }, { transform: `scale(${scaleStop})` }],\n duration: motionTokens.durationFast * motionSpeedMultiplier,\n easing: motionTokens.curveDecelerateMax,\n delay: motionTokens.durationUltraFast * motionSpeedMultiplier,\n },\n {\n keyframes: [{ transform: `scale(${scaleStop})` }, { transform: 'scale(0)' }],\n duration: motionTokens.durationFaster,\n easing: motionTokens.curveDecelerateMin,\n delay: (motionTokens.durationUltraFast + motionTokens.durationFast) * motionSpeedMultiplier,\n },\n ];\n\n return {\n enter: enterKeyframes,\n exit: exitKeyframes,\n };\n};\n\nconst circleMotion: PresenceMotionFn = () => {\n const enterKeyframes = [\n {\n keyframes: [{ opacity: 0 }],\n duration: 0,\n },\n {\n keyframes: [{ opacity: 0 }, { opacity: 1 }],\n duration: 0,\n delay: motionTokens.durationFaster * motionSpeedMultiplier,\n },\n {\n keyframes: [{ transform: `scale(${startScaleCircle})` }, { transform: `scale(${scaleCircle})` }],\n duration: motionTokens.durationSlow * motionSpeedMultiplier,\n easing: motionTokens.curveDecelerateMax,\n delay: motionTokens.durationFaster * motionSpeedMultiplier,\n },\n {\n keyframes: [{ transform: `scale(${scaleCircle})` }, { transform: `scale(1)` }],\n duration: motionTokens.durationNormal * motionSpeedMultiplier,\n easing: motionTokens.curveDecelerateMin,\n delay: (motionTokens.durationSlow + motionTokens.durationFaster) * motionSpeedMultiplier,\n },\n ];\n\n const exitKeyframes = [\n {\n keyframes: [{ transform: `scale(1)` }, { transform: `scale(${scaleCircle})` }],\n duration: motionTokens.durationFast * motionSpeedMultiplier,\n easing: motionTokens.curveDecelerateMax,\n },\n {\n keyframes: [{ transform: `scale(${scaleCircle})` }, { transform: 'scale(0)' }],\n duration: motionTokens.durationFaster * motionSpeedMultiplier,\n easing: motionTokens.curveDecelerateMin,\n delay: motionTokens.durationFast * motionSpeedMultiplier,\n },\n ];\n\n return {\n enter: enterKeyframes,\n exit: exitKeyframes,\n };\n};\nexport const SendButtonMotion = createPresenceComponent(sendMotion);\nexport const StopButtonMotion = createPresenceComponent(stopMotion);\nexport const CircleButtonMotion = createPresenceComponent(circleMotion);\n"],"names":["CircleButtonMotion","
|
|
1
|
+
{"version":3,"sources":["buttonMotion.ts"],"sourcesContent":["import type { PresenceMotionFn } from '@fluentui/react-components';\nimport { createPresenceComponent, motionTokens } from '@fluentui/react-components';\n\nconst scaleSend = 1.2;\nconst startScaleStop = 0.5;\nconst scaleStop = 1.2;\nconst startScaleCircle = 0.1;\nconst scaleCircle = 1.1;\n\nconst motionSpeedMultiplier = 1;\n\nconst sendMotion: PresenceMotionFn = () => {\n const enterKeyframes = [\n {\n keyframes: [{ transform: `scale(0)` }],\n duration: 0,\n },\n {\n keyframes: [{ transform: `scale(0)` }, { transform: `scale(${scaleSend})` }],\n duration: motionTokens.durationNormal * motionSpeedMultiplier,\n easing: motionTokens.curveDecelerateMax,\n delay: motionTokens.durationSlow * motionSpeedMultiplier,\n },\n {\n keyframes: [{ transform: `scale(${scaleSend})` }, { transform: 'scale(1)' }],\n duration: motionTokens.durationSlow * motionSpeedMultiplier,\n easing: motionTokens.curveDecelerateMid,\n delay: (motionTokens.durationSlow + motionTokens.durationNormal) * motionSpeedMultiplier,\n },\n ];\n\n const exitKeyframes = [\n {\n keyframes: [{ transform: `scale(1)` }, { transform: `scale(0)` }],\n duration: motionTokens.durationFast * motionSpeedMultiplier,\n easing: motionTokens.curveDecelerateMid,\n },\n ];\n\n return {\n enter: enterKeyframes,\n exit: exitKeyframes,\n };\n};\n\nconst stopMotion: PresenceMotionFn = () => {\n const enterKeyframes = [\n {\n keyframes: [{ opacity: 0 }],\n duration: 0,\n },\n {\n keyframes: [{ opacity: 1 }],\n duration: 0,\n delay: 30 * motionSpeedMultiplier, // non-standard motion duration\n },\n {\n keyframes: [{ transform: `scale(${startScaleStop})` }, { transform: `scale(1)` }],\n duration: motionTokens.durationSlower * motionSpeedMultiplier,\n easing: motionTokens.curveDecelerateMid,\n },\n ];\n\n const exitKeyframes = [\n {\n keyframes: [{ transform: `scale(1)` }, { transform: `scale(${scaleStop})` }],\n duration: motionTokens.durationFast * motionSpeedMultiplier,\n easing: motionTokens.curveDecelerateMax,\n delay: motionTokens.durationUltraFast * motionSpeedMultiplier,\n },\n {\n keyframes: [{ transform: `scale(${scaleStop})` }, { transform: 'scale(0)' }],\n duration: motionTokens.durationFaster,\n easing: motionTokens.curveDecelerateMin,\n delay: (motionTokens.durationUltraFast + motionTokens.durationFast) * motionSpeedMultiplier,\n },\n ];\n\n return {\n enter: enterKeyframes,\n exit: exitKeyframes,\n };\n};\n\nconst circleMotion: PresenceMotionFn = () => {\n const enterKeyframes = [\n {\n keyframes: [{ opacity: 0 }],\n duration: 0,\n },\n {\n keyframes: [{ opacity: 0 }, { opacity: 1 }],\n duration: 0,\n delay: motionTokens.durationFaster * motionSpeedMultiplier,\n },\n {\n keyframes: [{ transform: `scale(${startScaleCircle})` }, { transform: `scale(${scaleCircle})` }],\n duration: motionTokens.durationSlow * motionSpeedMultiplier,\n easing: motionTokens.curveDecelerateMax,\n delay: motionTokens.durationFaster * motionSpeedMultiplier,\n },\n {\n keyframes: [{ transform: `scale(${scaleCircle})` }, { transform: `scale(1)` }],\n duration: motionTokens.durationNormal * motionSpeedMultiplier,\n easing: motionTokens.curveDecelerateMin,\n delay: (motionTokens.durationSlow + motionTokens.durationFaster) * motionSpeedMultiplier,\n },\n ];\n\n const exitKeyframes = [\n {\n keyframes: [{ transform: `scale(1)` }, { transform: `scale(${scaleCircle})` }],\n duration: motionTokens.durationFast * motionSpeedMultiplier,\n easing: motionTokens.curveDecelerateMax,\n },\n {\n keyframes: [{ transform: `scale(${scaleCircle})` }, { transform: 'scale(0)' }],\n duration: motionTokens.durationFaster * motionSpeedMultiplier,\n easing: motionTokens.curveDecelerateMin,\n delay: motionTokens.durationFast * motionSpeedMultiplier,\n },\n ];\n\n return {\n enter: enterKeyframes,\n exit: exitKeyframes,\n };\n};\nexport const SendButtonMotion = createPresenceComponent(sendMotion);\nexport const StopButtonMotion = createPresenceComponent(stopMotion);\nexport const CircleButtonMotion = createPresenceComponent(circleMotion);\n"],"names":["CircleButtonMotion","duration","delay","motionTokens","scaleSend","startScaleStop","scaleStop","startScaleCircle","scaleCircle","motionSpeedMultiplier","sendMotion","enterKeyframes","keyframes","durationNormal","transform","durationSlow","curveDecelerateMid","durationFast","exitKeyframes","stopMotion","durationSlower","curveDecelerateMax","durationUltraFast","durationFaster","curveDecelerateMin","opacity","easing","enter","circleMotion","createPresenceComponent"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
|
|
@@ -29,3 +29,4 @@ const _SendButton = require("./SendButton");
|
|
|
29
29
|
const _renderSendButton = require("./renderSendButton");
|
|
30
30
|
const _useSendButton = require("./useSendButton");
|
|
31
31
|
const _useSendButtonStylesstyles = require("./useSendButtonStyles.styles");
|
|
32
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["renderSendButton.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-components';\nimport type { SendButtonState, SendButtonSlots } from './SendButton.types';\n\n/**\n * Render the final JSX of SendButton\n */\nexport const renderSendButton_unstable = (state: SendButtonState) => {\n if (state.designVersion === 'next') {\n return renderSendButtonNext(state);\n }\n\n return renderSendButtonCurrent(state);\n};\n\nfunction renderSendButtonCurrent(state: SendButtonState) {\n assertSlots<SendButtonSlots>(state);\n\n return (\n <state.root>\n {state.stopIcon && (\n <>\n <state.stopBackgroundMotion>\n <state.stopBackground />\n </state.stopBackgroundMotion>\n <state.stopButtonMotion>\n <state.stopIcon />\n </state.stopButtonMotion>\n </>\n )}\n <state.sendButtonMotion>\n <state.sendIcon />\n </state.sendButtonMotion>\n </state.root>\n );\n}\n\nfunction renderSendButtonNext(state: SendButtonState) {\n assertSlots<SendButtonSlots>(state);\n\n return (\n <state.root>\n <state.stopBackgroundMotion>\n <state.stopBackground />\n </state.stopBackgroundMotion>\n {state.stopIcon && (\n <state.stopButtonMotion>\n <state.stopIcon />\n </state.stopButtonMotion>\n )}\n <state.sendButtonMotion>\n <state.sendIcon />\n </state.sendButtonMotion>\n </state.root>\n );\n}\n"],"names":["
|
|
1
|
+
{"version":3,"sources":["renderSendButton.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-components';\nimport type { SendButtonState, SendButtonSlots } from './SendButton.types';\n\n/**\n * Render the final JSX of SendButton\n */\nexport const renderSendButton_unstable = (state: SendButtonState) => {\n if (state.designVersion === 'next') {\n return renderSendButtonNext(state);\n }\n\n return renderSendButtonCurrent(state);\n};\n\nfunction renderSendButtonCurrent(state: SendButtonState) {\n assertSlots<SendButtonSlots>(state);\n\n return (\n <state.root>\n {state.stopIcon && (\n <>\n <state.stopBackgroundMotion>\n <state.stopBackground />\n </state.stopBackgroundMotion>\n <state.stopButtonMotion>\n <state.stopIcon />\n </state.stopButtonMotion>\n </>\n )}\n <state.sendButtonMotion>\n <state.sendIcon />\n </state.sendButtonMotion>\n </state.root>\n );\n}\n\nfunction renderSendButtonNext(state: SendButtonState) {\n assertSlots<SendButtonSlots>(state);\n\n return (\n <state.root>\n <state.stopBackgroundMotion>\n <state.stopBackground />\n </state.stopBackgroundMotion>\n {state.stopIcon && (\n <state.stopButtonMotion>\n <state.stopIcon />\n </state.stopButtonMotion>\n )}\n <state.sendButtonMotion>\n <state.sendIcon />\n </state.sendButtonMotion>\n </state.root>\n );\n}\n"],"names":["state","designVersion","renderSendButtonNext","renderSendButtonCurrent","assertSlots","stopIcon","_jsxs","_Fragment","stopBackgroundMotion","stopButtonMotion","children","_jsx","stopBackground"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAUMA;;;eAAAA;;;4BATN;iCAE4B;AAO1B,MAAIA,4BAAgCA,CAAAA;cAClCC,aAAOC,KAAAA,QAAqBF;QAC9B,OAAAE,qBAAAF;;IAGA,OAAAG,wBAAAH;AAEF;SACEI,wBAA6BJ,KAAAA;oCAE7B,EAAAA;;kBAEKA;YAAAA,MAAMK,QAAQ,IAAA,WACb,GAAAC,IAAAA,gBAAA,EAAAC,oBAAA,EAAA;;;mEACE,EAAAP,MAACA,cAAMQ,EAAAA,CAAAA;;6DACLC,gBAAA,EAAA;;;;;qEAGA,EAAA;;;;;;8BAKJT,KAAA;;;;;gBAIRU,UAAA,WAAA,GAAAC,IAAAA,eAAA,EAAAX,MAAAY,cAAA,EAAA,CAAA;YAEA;YAAAZ,MAASE,QAAAA,IAAAA,WAA2C,GAAAS,IAAAA,eAAA,EAAAX,MAAAS,gBAAA,EAAA;gBAClDL,UAA6BJ,WAAAA,GAAAA,IAAAA,eAAAA,EAAAA,MAAAA,QAAAA,EAAAA,CAAAA;YAE7B;YAAA,WAAA,GAAAW,IAAAA,eACE,EAAAX,MAACA,gBAAU,EAAA;;;;;8CAKP"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useSendButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ButtonProps } from '@fluentui/react-components';\nimport { slot, useButton_unstable, useMergedRefs } from '@fluentui/react-components';\nimport type { SendButtonProps, SendButtonState } from './SendButton.types';\n\nimport { CircleButtonMotion, SendButtonMotion, StopButtonMotion } from './buttonMotion';\nimport {\n bundleIcon,\n SendFilled,\n SendRegular,\n Stop16Filled,\n ArrowRight24Filled,\n Stop20Filled,\n ArrowRight20Filled,\n} from '@fluentui/react-icons';\nimport { presenceMotionSlot } from '@fluentui/react-motion';\nimport { useCopilotMode, useDesignVersion } from '@fluentui-copilot/react-provider';\n\nconst SendIcon = bundleIcon(SendFilled, SendRegular);\n\n/**\n * Create the state required to render SendButton.\n *\n * The returned state can be modified with hooks such as useSendButtonStyles_unstable,\n * before being passed to renderSendButton_unstable.\n *\n * @param props - props from this instance of SendButton\n * @param ref - reference to root HTMLElement of SendButton\n */\nexport const useSendButton_unstable = (\n props: SendButtonProps,\n ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>,\n): SendButtonState => {\n /** Used to apply/remove styles when button is animating */\n const [isSendMotionRunning, setIsSendMotionRunning] = React.useState(false);\n const [isStopMotionRunning, setIsStopMotionRunning] = React.useState(false);\n const isButtonMotionRunning = isSendMotionRunning || isStopMotionRunning;\n\n const designVersion = useDesignVersion(props.designVersion);\n const mode = useCopilotMode(props.mode);\n\n const [visible, setVisible] = React.useState(false);\n const mountRef = React.useCallback((elem: HTMLElement | null) => {\n if (elem) {\n setVisible(true);\n } else {\n setVisible(false);\n }\n }, []);\n const finalRef = useMergedRefs(ref, mountRef);\n const buttonState = useButton_unstable(\n {\n shape: designVersion === 'next' ? 'circular' : undefined,\n ...(props as ButtonProps),\n appearance: 'transparent',\n 'aria-disabled': props.disabled ? true : undefined,\n type: 'submit',\n },\n finalRef,\n );\n\n const icon = (() => {\n if (designVersion === 'next') {\n return mode === 'canvas' ? <ArrowRight24Filled /> : <ArrowRight20Filled />;\n } else {\n if (props.isSendIconFilled || isButtonMotionRunning) {\n return <SendFilled />;\n } else {\n return <SendIcon />;\n }\n }\n })();\n\n const state: SendButtonState = {\n ...buttonState,\n components: {\n root: 'button',\n sendIcon: 'span',\n stopIcon: 'span',\n stopBackground: 'div',\n sendButtonMotion: SendButtonMotion as React.ComponentType,\n stopButtonMotion: StopButtonMotion as React.ComponentType,\n stopBackgroundMotion: CircleButtonMotion as React.ComponentType,\n },\n root: buttonState.root,\n sendIcon: slot.always(props.sendIcon, {\n elementType: 'span',\n defaultProps: {\n children: icon,\n },\n }),\n stopIcon: slot.optional(props.stopIcon, {\n elementType: 'span',\n defaultProps: {\n children: designVersion === 'next' ? mode === 'canvas' ? <Stop20Filled /> : <Stop16Filled /> : <Stop16Filled />,\n },\n renderByDefault: true,\n }),\n stopBackground: slot.always(props.stopBackground, { elementType: 'div' }),\n sendButtonMotion: presenceMotionSlot<{}>(props.sendButtonMotion, {\n elementType: SendButtonMotion,\n defaultProps: {\n visible: !props.isSending,\n unmountOnExit: true,\n onMotionFinish: () => setIsSendMotionRunning(false),\n onMotionStart: () => setIsSendMotionRunning(true),\n },\n }),\n stopButtonMotion: presenceMotionSlot<{}>(props.stopButtonMotion, {\n elementType: StopButtonMotion,\n defaultProps: {\n visible: props.isSending,\n unmountOnExit: true,\n onMotionFinish: () => setIsStopMotionRunning(false),\n onMotionStart: () => setIsStopMotionRunning(true),\n },\n }),\n stopBackgroundMotion: presenceMotionSlot<{}>(props.stopBackgroundMotion, {\n elementType: CircleButtonMotion,\n defaultProps: {\n visible: designVersion === 'next' ? visible : props.isSending,\n unmountOnExit: true,\n },\n }),\n isButtonMotionRunning,\n isDictationActive: props.isDictationActive ?? false,\n isSendIconFilled: props.isSendIconFilled,\n isSending: props.isSending,\n designVersion,\n mode,\n };\n\n return state;\n};\n"],"names":["useSendButton_unstable","SendIcon","bundleIcon","SendFilled","SendRegular","props","ref","
|
|
1
|
+
{"version":3,"sources":["useSendButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ButtonProps } from '@fluentui/react-components';\nimport { slot, useButton_unstable, useMergedRefs } from '@fluentui/react-components';\nimport type { SendButtonProps, SendButtonState } from './SendButton.types';\n\nimport { CircleButtonMotion, SendButtonMotion, StopButtonMotion } from './buttonMotion';\nimport {\n bundleIcon,\n SendFilled,\n SendRegular,\n Stop16Filled,\n ArrowRight24Filled,\n Stop20Filled,\n ArrowRight20Filled,\n} from '@fluentui/react-icons';\nimport { presenceMotionSlot } from '@fluentui/react-motion';\nimport { useCopilotMode, useDesignVersion } from '@fluentui-copilot/react-provider';\n\nconst SendIcon = bundleIcon(SendFilled, SendRegular);\n\n/**\n * Create the state required to render SendButton.\n *\n * The returned state can be modified with hooks such as useSendButtonStyles_unstable,\n * before being passed to renderSendButton_unstable.\n *\n * @param props - props from this instance of SendButton\n * @param ref - reference to root HTMLElement of SendButton\n */\nexport const useSendButton_unstable = (\n props: SendButtonProps,\n ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>,\n): SendButtonState => {\n /** Used to apply/remove styles when button is animating */\n const [isSendMotionRunning, setIsSendMotionRunning] = React.useState(false);\n const [isStopMotionRunning, setIsStopMotionRunning] = React.useState(false);\n const isButtonMotionRunning = isSendMotionRunning || isStopMotionRunning;\n\n const designVersion = useDesignVersion(props.designVersion);\n const mode = useCopilotMode(props.mode);\n\n const [visible, setVisible] = React.useState(false);\n const mountRef = React.useCallback((elem: HTMLElement | null) => {\n if (elem) {\n setVisible(true);\n } else {\n setVisible(false);\n }\n }, []);\n const finalRef = useMergedRefs(ref, mountRef);\n const buttonState = useButton_unstable(\n {\n shape: designVersion === 'next' ? 'circular' : undefined,\n ...(props as ButtonProps),\n appearance: 'transparent',\n 'aria-disabled': props.disabled ? true : undefined,\n type: 'submit',\n },\n finalRef,\n );\n\n const icon = (() => {\n if (designVersion === 'next') {\n return mode === 'canvas' ? <ArrowRight24Filled /> : <ArrowRight20Filled />;\n } else {\n if (props.isSendIconFilled || isButtonMotionRunning) {\n return <SendFilled />;\n } else {\n return <SendIcon />;\n }\n }\n })();\n\n const state: SendButtonState = {\n ...buttonState,\n components: {\n root: 'button',\n sendIcon: 'span',\n stopIcon: 'span',\n stopBackground: 'div',\n sendButtonMotion: SendButtonMotion as React.ComponentType,\n stopButtonMotion: StopButtonMotion as React.ComponentType,\n stopBackgroundMotion: CircleButtonMotion as React.ComponentType,\n },\n root: buttonState.root,\n sendIcon: slot.always(props.sendIcon, {\n elementType: 'span',\n defaultProps: {\n children: icon,\n },\n }),\n stopIcon: slot.optional(props.stopIcon, {\n elementType: 'span',\n defaultProps: {\n children: designVersion === 'next' ? mode === 'canvas' ? <Stop20Filled /> : <Stop16Filled /> : <Stop16Filled />,\n },\n renderByDefault: true,\n }),\n stopBackground: slot.always(props.stopBackground, { elementType: 'div' }),\n sendButtonMotion: presenceMotionSlot<{}>(props.sendButtonMotion, {\n elementType: SendButtonMotion,\n defaultProps: {\n visible: !props.isSending,\n unmountOnExit: true,\n onMotionFinish: () => setIsSendMotionRunning(false),\n onMotionStart: () => setIsSendMotionRunning(true),\n },\n }),\n stopButtonMotion: presenceMotionSlot<{}>(props.stopButtonMotion, {\n elementType: StopButtonMotion,\n defaultProps: {\n visible: props.isSending,\n unmountOnExit: true,\n onMotionFinish: () => setIsStopMotionRunning(false),\n onMotionStart: () => setIsStopMotionRunning(true),\n },\n }),\n stopBackgroundMotion: presenceMotionSlot<{}>(props.stopBackgroundMotion, {\n elementType: CircleButtonMotion,\n defaultProps: {\n visible: designVersion === 'next' ? visible : props.isSending,\n unmountOnExit: true,\n },\n }),\n isButtonMotionRunning,\n isDictationActive: props.isDictationActive ?? false,\n isSendIconFilled: props.isSendIconFilled,\n isSending: props.isSending,\n designVersion,\n mode,\n };\n\n return state;\n};\n"],"names":["useSendButton_unstable","SendIcon","bundleIcon","SendFilled","SendRegular","props","ref","React","useState","setIsSendMotionRunning","isStopMotionRunning","isButtonMotionRunning","isSendMotionRunning","useDesignVersion","designVersion","useCopilotMode","mode","visible","setVisible","mountRef","useCallback","elem","finalRef","buttonState","useButton_unstable","shape","undefined","appearance","disabled","type","icon","createElement","ArrowRight24Filled","ArrowRight20Filled","isSendIconFilled","_props_isDictationActive","state","components","root","sendIcon","stopIcon","stopBackground","sendButtonMotion","stopButtonMotion","StopButtonMotion","stopBackgroundMotion","CircleButtonMotion","slot","always","elementType","defaultProps","children","Stop20Filled","Stop16Filled","SendButtonMotion","unmountOnExit","onMotionFinish","onMotionStart","setIsStopMotionRunning","isSending","isDictationActive"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAiCEA;;;eAAAA;;;;iEAjCqB;iCAEiC;8BAGe;4BAShE;6BAC4B;+BACc;AAEjD,MAAMC,WAAWC,IAAAA,sBAAAA,EAAWC,sBAAAA,EAAYC,uBAAAA;AAetC,MAAAJ,yBAAA,CAAAK,OAAAC;6DAEsDC,GAAAA,MAAMC,CAAAA,qBAASC,uBAAA,GAAAF,OAAAC,QAAA,CAAA;UACrE,CAAAE,qBAAMC,uBAAwBC,GAAAA,OAAuBF,QAAAA,CAAAA;UAErDC,wBAAsBE,uBAAuBC;UAC7CA,gBAAaC,IAAAA,+BAAqBC,EAAAA,MAAIF,aAAA;UAEtCE,OAAOC,IAAAA,6BAASC,EAAAA,MAAcX,IAAMC;UACpC,CAAAS,SAAME,WAAiBC,GAAAA,OAAWZ,QAAEa,CAAAA;UAClCF,WAAUZ,OAAAa,WAAA,CAAAC,CAAAA;kBACRH;uBACK;;uBAEP;QACF;OACA,EAAA;UACAI,WAAMC,IAAAA,8BAAcC,EAAAA,KAAAA;UAEhBC,cAAOX,IAAAA,mCAAkB,EAAA;eACrBT,kBAAK,SAAA,aAAAqB;gBACTC;oBACA;yBACMtB,MAAAuB,QAAA,GAAA,OAAAF;QACRG,MACAP;OAGFA;UACEQ,OAAIhB,CAAAA;8BACKE,QAAS;mBAClBA,SAAO,WAAA,WAAA,GAAAT,OAAAwB,aAAA,CAAAC,8BAAA,EAAA,QAAA,WAAA,GAAAzB,OAAAwB,aAAA,CAAAE,8BAAA,EAAA;;sBAEHC,gBAAA,IAAAvB,uBAAQR;uBACV,WAAO,GAAAI,OAAAwB,aAAA,CAAA5B,sBAAA,EAAA;;uBAEP,WAAA,GAAAI,OAAAwB,aAAA,CAAA9B,UAAA;;QAEJ;;QAEAkC;UACEC,QAAGb;sBACHc;oBACEC;kBACAC;sBACAC;sBACAC;4BACAC;8BACAC,8BAAkBC;8BAClBC,8BAAsBC;kCACxBA,gCAAA;;cAEAP,YAAUQ,IAAKC;kBACbC,qBAAAA,CAAAA,MAAa,CAAA5C,MAAAkC,QAAA,EAAA;yBACbW;0BACEC;0BACFrB;;;kBAGAmB,qBAAAA,CAAAA,QAAa,CAAA5C,MAAAmC,QAAA,EAAA;yBACbU;0BACEC;0BACFrC,kBAAA,SAAAE,SAAA,WAAA,WAAA,GAAAT,OAAAwB,aAAA,CAAAqB,wBAAA,EAAA,QAAA,WAAA,GAAA7C,OAAAwB,aAAA,CAAAsB,wBAAA,EAAA,QAAA,WAAA,GAAA9C,OAAAwB,aAAA,CAAAsB,wBAAA,EAAA;;6BAEF;;wBACoDJ,qBAAAA,CAAaD,MAAA,CAAA3C,MAAAoC,cAAA,EAAA;yBAAM;;0BAErEQ,IAAAA,+BAAaK,EAAAA,MAAAA,gBAAAA,EAAAA;yBACbJ,8BAAc;0BACZjC;yBACAsC,CAAAA,MAAAA,SAAe;+BACfC;gCACAC,IAAAA,uBAAqBhD;+BACvB,IAAAA,uBAAA;;;0BAGAwC,IAAAA,+BAAaL,EAAAA,MAAAA,gBAAAA,EAAAA;yBACbM,8BAAc;0BACZjC;yBACAsC,MAAAA,SAAe;+BACfC;gCACAC,IAAAA,uBAAqBC;+BACvB,IAAAA,uBAAA;;;8BAGaZ,IAAAA,+BAAAA,EAAAA,MAAAA,oBAAAA,EAAAA;yBACbI,gCAAc;0BACZjC;yBACAsC,kBAAe,SAAAtC,UAAAZ,MAAAsD,SAAA;+BACjB;;;;2BAIFzB,CAAAA,2BAAwC7B,MAAAuD,iBAAA,MAAA,QAAAzB,6BAAA,KAAA,IAAAA,2BAAA;0BAC7B9B,MAAMsD,gBAAS;mBAC1B7C,MAAAA,SAAAA;;QAEFE;;IAGA,OAAAoB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useSendButtonStyles.styles.ts"],"sourcesContent":["import {\n makeStyles,\n mergeClasses,\n useButtonStyles_unstable,\n createCustomFocusIndicatorStyle,\n} from '@fluentui/react-components';\nimport { tokens } from '@fluentui-copilot/tokens';\n\nimport type { SendButtonSlots, SendButtonState } from './SendButton.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\n\nexport const sendButtonClassNames: SlotClassNames<SendButtonSlots> = {\n root: 'fai-SendButton',\n sendIcon: 'fai-SendButton__sendIcon',\n stopIcon: 'fai-SendButton__stopIcon',\n stopBackground: 'fai-SendButton__stopBackground',\n sendButtonMotion: 'fai-SendButton__sendButtonMotion',\n stopButtonMotion: 'fai-SendButton__stopButtonMotion',\n stopBackgroundMotion: 'fai-SendButton__stopBackgroundMotion',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n display: 'flex',\n width: '32px',\n minWidth: '32px',\n height: '32px',\n alignItems: 'center',\n padding: '0',\n },\n\n baseIconButton: {\n position: 'absolute',\n alignItems: 'center',\n display: 'inline-flex',\n justifyContent: 'center',\n fontSize: tokens.fontSizeBase500, // 20px\n height: '20px',\n width: '20px',\n },\n\n disabled: {\n color: tokens.colorNeutralForegroundDisabled,\n },\n\n iconFilled: {\n color: tokens.colorCompoundBrandBackground,\n ':hover': {\n color: tokens.colorCompoundBrandBackgroundHover,\n },\n },\n\n stopBackground: {\n position: 'absolute',\n width: 'inherit',\n height: 'inherit',\n borderRadius: tokens.borderRadiusCircular,\n /** To-do: Change to backgroundColor: var(--Brand-Background-Tint-Rest, #EBEFFF);*/\n backgroundColor: tokens.colorBrandBackground2,\n },\n});\n\nconst useNextStyles = makeStyles({\n baseIconButton: {\n display: 'inline-flex',\n justifyContent: 'center',\n gridArea: 'button',\n position: 'initial',\n zIndex: 1,\n color: tokens.colorNeutralForegroundOnBrand,\n },\n\n dictationActive: {\n color: tokens.colorNeutralForeground2,\n },\n\n sendIconFilled: {\n color: tokens.colorNeutralForegroundOnBrand,\n },\n\n stopIconFilled: {\n color: tokens.colorBrandForeground2,\n },\n\n stopBackground: {\n gridArea: 'button',\n height: '100%',\n width: '100%',\n borderRadius: tokens.borderRadiusCircular,\n backgroundColor: tokens.colorBrandBackground,\n },\n\n stopBackgroundSending: {\n backgroundColor: tokens.colorBrandBackground2,\n },\n\n stopBackgroundDictationActive: {\n backgroundColor: tokens.colorTransparentBackground,\n },\n disabled: {\n color: tokens.colorNeutralForegroundDisabled,\n },\n stopBackgroundDisabled: {\n backgroundColor: tokens.colorNeutralBackgroundDisabled,\n },\n});\n\nconst useRootNextStyles = makeStyles({\n root: {\n display: 'grid',\n gridTemplateAreas: `\"button\"`,\n gridTemplateRows: '1fr',\n gridTemplateColumns: '1fr',\n justifyItems: 'center',\n alignItems: 'center',\n padding: tokens.spacingVerticalNone,\n border: 'none',\n position: 'relative',\n ...createCustomFocusIndicatorStyle({\n outline: `${tokens.strokeWidthThick} solid ${tokens.colorTransparentStroke}`,\n boxShadow: `0 0 0 ${tokens.strokeWidthThick} ${tokens.colorStrokeFocus2}`,\n }),\n },\n\n canvas: {\n minWidth: '40px',\n height: '40px',\n },\n\n sidecar: {\n minWidth: '32px',\n height: '32px',\n },\n\n notSending: {\n ':hover': {\n [`& .${sendButtonClassNames.stopBackground}`]: {\n backgroundColor: tokens.colorBrandBackgroundHover,\n },\n\n [`& .${sendButtonClassNames.sendIcon},.${sendButtonClassNames.stopIcon}`]: {\n color: tokens.colorNeutralForegroundOnBrand,\n },\n },\n ':active': {\n [`& .${sendButtonClassNames.stopBackground}`]: {\n backgroundColor: tokens.colorBrandBackgroundPressed,\n },\n },\n },\n notSendingDictationActive: {\n ':hover': {\n [`& .${sendButtonClassNames.stopBackground}`]: {\n backgroundColor: tokens.colorSubtleBackgroundHover,\n },\n\n [`& .${sendButtonClassNames.sendIcon}`]: {\n color: tokens.colorNeutralForeground2Hover,\n },\n },\n ':active': {\n [`& .${sendButtonClassNames.stopBackground}`]: {\n backgroundColor: tokens.colorSubtleBackgroundPressed,\n },\n [`& .${sendButtonClassNames.sendIcon}`]: {\n color: tokens.colorNeutralForeground2Pressed,\n },\n },\n },\n\n sending: {\n ':hover': {\n [`& .${sendButtonClassNames.stopBackground}`]: {\n backgroundColor: tokens.colorBrandBackground2Hover,\n },\n [`& .${sendButtonClassNames.stopIcon}`]: {\n color: tokens.colorBrandForeground2Hover,\n },\n },\n ':active': {\n [`& .${sendButtonClassNames.stopBackground}`]: {\n backgroundColor: tokens.colorBrandBackground2Pressed,\n },\n [`& .${sendButtonClassNames.stopIcon}`]: {\n color: tokens.colorBrandForeground2Pressed,\n },\n },\n },\n});\n\n/**\n * Apply styling to the SendButton slots based on the state\n */\nexport const useSendButtonStyles_unstable = (state: SendButtonState): SendButtonState => {\n 'use no memo';\n const { isDictationActive, isSendIconFilled, isSending, disabled, designVersion, mode } = state;\n\n const styles = useStyles();\n const nextStyles = useNextStyles();\n const rootNextStyles = useRootNextStyles();\n\n const sendIconFilledStyle = designVersion === 'next' ? nextStyles.sendIconFilled : styles.iconFilled;\n const stopIconFilledStyle = designVersion === 'next' ? nextStyles.stopIconFilled : styles.iconFilled;\n\n state.root.className = mergeClasses(\n sendButtonClassNames.root,\n designVersion === 'next' ? rootNextStyles.root : styles.root,\n isSendIconFilled && sendIconFilledStyle,\n (state.isButtonMotionRunning || isSending) && sendIconFilledStyle,\n designVersion === 'next' && rootNextStyles[mode],\n designVersion === 'next' && rootNextStyles.root,\n !disabled &&\n designVersion === 'next' &&\n !isSending &&\n (isDictationActive ? rootNextStyles.notSendingDictationActive : rootNextStyles.notSending),\n !disabled && designVersion === 'next' && isSending && rootNextStyles.sending,\n disabled && styles.disabled,\n state.root.className,\n );\n\n if (state.sendIcon) {\n state.sendIcon.className = mergeClasses(\n sendButtonClassNames.sendIcon,\n designVersion === 'next' ? nextStyles.baseIconButton : styles.baseIconButton,\n !disabled && designVersion === 'next' && !isSending && isDictationActive && nextStyles.dictationActive,\n disabled && designVersion === 'next' && nextStyles.disabled,\n state.sendIcon.className,\n );\n }\n\n if (state.stopIcon) {\n state.stopIcon.className = mergeClasses(\n sendButtonClassNames.stopIcon,\n designVersion === 'next' ? nextStyles.baseIconButton : styles.baseIconButton,\n stopIconFilledStyle,\n state.stopIcon.className,\n );\n }\n\n if (state.stopBackground) {\n state.stopBackground.className = mergeClasses(\n sendButtonClassNames.stopBackground,\n designVersion === 'next' ? nextStyles.stopBackground : styles.stopBackground,\n designVersion === 'next' && isSending && nextStyles.stopBackgroundSending,\n designVersion === 'next' && !isSending && isDictationActive && nextStyles.stopBackgroundDictationActive,\n designVersion === 'next' && disabled && nextStyles.stopBackgroundDisabled,\n state.stopBackground.className,\n );\n }\n\n // Add style hooks from button\n useButtonStyles_unstable({ ...state, components: { ...state.components, icon: 'span' }, iconOnly: false });\n\n return state;\n};\n"],"names":["sendButtonClassNames","useSendButtonStyles_unstable","root","sendIcon","stopIcon","stopBackground","sendButtonMotion","stopButtonMotion","stopBackgroundMotion","useStyles","makeStyles","display","width","minWidth","height","alignItems","padding","baseIconButton","position","justifyContent","fontSize","tokens","fontSizeBase500","disabled","color","colorNeutralForegroundDisabled","iconFilled","colorCompoundBrandBackground","colorCompoundBrandBackgroundHover","borderRadius","borderRadiusCircular","backgroundColor","colorBrandBackground2","useNextStyles","gridArea","zIndex","colorNeutralForegroundOnBrand","dictationActive","colorNeutralForeground2","sendIconFilled","stopIconFilled","colorBrandForeground2","colorBrandBackground","stopBackgroundSending","stopBackgroundDictationActive","colorTransparentBackground","stopBackgroundDisabled","colorNeutralBackgroundDisabled","useRootNextStyles","gridTemplateAreas","gridTemplateRows","gridTemplateColumns","justifyItems","spacingVerticalNone","border","createCustomFocusIndicatorStyle","outline","strokeWidthThick","colorTransparentStroke","boxShadow","colorStrokeFocus2","canvas","sidecar","notSending","colorBrandBackgroundHover","colorBrandBackgroundPressed","notSendingDictationActive","colorSubtleBackgroundHover","colorNeutralForeground2Hover","colorSubtleBackgroundPressed","colorNeutralForeground2Pressed","sending","colorBrandBackground2Hover","colorBrandForeground2Hover","colorBrandBackground2Pressed","colorBrandForeground2Pressed","state","isDictationActive","isSendIconFilled","isSending","designVersion","mode","styles","nextStyles","rootNextStyles","sendIconFilledStyle","stopIconFilledStyle","className","mergeClasses","isButtonMotionRunning","useButtonStyles_unstable","components","icon","iconOnly"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["useSendButtonStyles.styles.ts"],"sourcesContent":["import {\n makeStyles,\n mergeClasses,\n useButtonStyles_unstable,\n createCustomFocusIndicatorStyle,\n} from '@fluentui/react-components';\nimport { tokens } from '@fluentui-copilot/tokens';\n\nimport type { SendButtonSlots, SendButtonState } from './SendButton.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\n\nexport const sendButtonClassNames: SlotClassNames<SendButtonSlots> = {\n root: 'fai-SendButton',\n sendIcon: 'fai-SendButton__sendIcon',\n stopIcon: 'fai-SendButton__stopIcon',\n stopBackground: 'fai-SendButton__stopBackground',\n sendButtonMotion: 'fai-SendButton__sendButtonMotion',\n stopButtonMotion: 'fai-SendButton__stopButtonMotion',\n stopBackgroundMotion: 'fai-SendButton__stopBackgroundMotion',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n display: 'flex',\n width: '32px',\n minWidth: '32px',\n height: '32px',\n alignItems: 'center',\n padding: '0',\n },\n\n baseIconButton: {\n position: 'absolute',\n alignItems: 'center',\n display: 'inline-flex',\n justifyContent: 'center',\n fontSize: tokens.fontSizeBase500, // 20px\n height: '20px',\n width: '20px',\n },\n\n disabled: {\n color: tokens.colorNeutralForegroundDisabled,\n },\n\n iconFilled: {\n color: tokens.colorCompoundBrandBackground,\n ':hover': {\n color: tokens.colorCompoundBrandBackgroundHover,\n },\n },\n\n stopBackground: {\n position: 'absolute',\n width: 'inherit',\n height: 'inherit',\n borderRadius: tokens.borderRadiusCircular,\n /** To-do: Change to backgroundColor: var(--Brand-Background-Tint-Rest, #EBEFFF);*/\n backgroundColor: tokens.colorBrandBackground2,\n },\n});\n\nconst useNextStyles = makeStyles({\n baseIconButton: {\n display: 'inline-flex',\n justifyContent: 'center',\n gridArea: 'button',\n position: 'initial',\n zIndex: 1,\n color: tokens.colorNeutralForegroundOnBrand,\n },\n\n dictationActive: {\n color: tokens.colorNeutralForeground2,\n },\n\n sendIconFilled: {\n color: tokens.colorNeutralForegroundOnBrand,\n },\n\n stopIconFilled: {\n color: tokens.colorBrandForeground2,\n },\n\n stopBackground: {\n gridArea: 'button',\n height: '100%',\n width: '100%',\n borderRadius: tokens.borderRadiusCircular,\n backgroundColor: tokens.colorBrandBackground,\n },\n\n stopBackgroundSending: {\n backgroundColor: tokens.colorBrandBackground2,\n },\n\n stopBackgroundDictationActive: {\n backgroundColor: tokens.colorTransparentBackground,\n },\n disabled: {\n color: tokens.colorNeutralForegroundDisabled,\n },\n stopBackgroundDisabled: {\n backgroundColor: tokens.colorNeutralBackgroundDisabled,\n },\n});\n\nconst useRootNextStyles = makeStyles({\n root: {\n display: 'grid',\n gridTemplateAreas: `\"button\"`,\n gridTemplateRows: '1fr',\n gridTemplateColumns: '1fr',\n justifyItems: 'center',\n alignItems: 'center',\n padding: tokens.spacingVerticalNone,\n border: 'none',\n position: 'relative',\n ...createCustomFocusIndicatorStyle({\n outline: `${tokens.strokeWidthThick} solid ${tokens.colorTransparentStroke}`,\n boxShadow: `0 0 0 ${tokens.strokeWidthThick} ${tokens.colorStrokeFocus2}`,\n }),\n },\n\n canvas: {\n minWidth: '40px',\n height: '40px',\n },\n\n sidecar: {\n minWidth: '32px',\n height: '32px',\n },\n\n notSending: {\n ':hover': {\n [`& .${sendButtonClassNames.stopBackground}`]: {\n backgroundColor: tokens.colorBrandBackgroundHover,\n },\n\n [`& .${sendButtonClassNames.sendIcon},.${sendButtonClassNames.stopIcon}`]: {\n color: tokens.colorNeutralForegroundOnBrand,\n },\n },\n ':active': {\n [`& .${sendButtonClassNames.stopBackground}`]: {\n backgroundColor: tokens.colorBrandBackgroundPressed,\n },\n },\n },\n notSendingDictationActive: {\n ':hover': {\n [`& .${sendButtonClassNames.stopBackground}`]: {\n backgroundColor: tokens.colorSubtleBackgroundHover,\n },\n\n [`& .${sendButtonClassNames.sendIcon}`]: {\n color: tokens.colorNeutralForeground2Hover,\n },\n },\n ':active': {\n [`& .${sendButtonClassNames.stopBackground}`]: {\n backgroundColor: tokens.colorSubtleBackgroundPressed,\n },\n [`& .${sendButtonClassNames.sendIcon}`]: {\n color: tokens.colorNeutralForeground2Pressed,\n },\n },\n },\n\n sending: {\n ':hover': {\n [`& .${sendButtonClassNames.stopBackground}`]: {\n backgroundColor: tokens.colorBrandBackground2Hover,\n },\n [`& .${sendButtonClassNames.stopIcon}`]: {\n color: tokens.colorBrandForeground2Hover,\n },\n },\n ':active': {\n [`& .${sendButtonClassNames.stopBackground}`]: {\n backgroundColor: tokens.colorBrandBackground2Pressed,\n },\n [`& .${sendButtonClassNames.stopIcon}`]: {\n color: tokens.colorBrandForeground2Pressed,\n },\n },\n },\n});\n\n/**\n * Apply styling to the SendButton slots based on the state\n */\nexport const useSendButtonStyles_unstable = (state: SendButtonState): SendButtonState => {\n 'use no memo';\n const { isDictationActive, isSendIconFilled, isSending, disabled, designVersion, mode } = state;\n\n const styles = useStyles();\n const nextStyles = useNextStyles();\n const rootNextStyles = useRootNextStyles();\n\n const sendIconFilledStyle = designVersion === 'next' ? nextStyles.sendIconFilled : styles.iconFilled;\n const stopIconFilledStyle = designVersion === 'next' ? nextStyles.stopIconFilled : styles.iconFilled;\n\n state.root.className = mergeClasses(\n sendButtonClassNames.root,\n designVersion === 'next' ? rootNextStyles.root : styles.root,\n isSendIconFilled && sendIconFilledStyle,\n (state.isButtonMotionRunning || isSending) && sendIconFilledStyle,\n designVersion === 'next' && rootNextStyles[mode],\n designVersion === 'next' && rootNextStyles.root,\n !disabled &&\n designVersion === 'next' &&\n !isSending &&\n (isDictationActive ? rootNextStyles.notSendingDictationActive : rootNextStyles.notSending),\n !disabled && designVersion === 'next' && isSending && rootNextStyles.sending,\n disabled && styles.disabled,\n state.root.className,\n );\n\n if (state.sendIcon) {\n state.sendIcon.className = mergeClasses(\n sendButtonClassNames.sendIcon,\n designVersion === 'next' ? nextStyles.baseIconButton : styles.baseIconButton,\n !disabled && designVersion === 'next' && !isSending && isDictationActive && nextStyles.dictationActive,\n disabled && designVersion === 'next' && nextStyles.disabled,\n state.sendIcon.className,\n );\n }\n\n if (state.stopIcon) {\n state.stopIcon.className = mergeClasses(\n sendButtonClassNames.stopIcon,\n designVersion === 'next' ? nextStyles.baseIconButton : styles.baseIconButton,\n stopIconFilledStyle,\n state.stopIcon.className,\n );\n }\n\n if (state.stopBackground) {\n state.stopBackground.className = mergeClasses(\n sendButtonClassNames.stopBackground,\n designVersion === 'next' ? nextStyles.stopBackground : styles.stopBackground,\n designVersion === 'next' && isSending && nextStyles.stopBackgroundSending,\n designVersion === 'next' && !isSending && isDictationActive && nextStyles.stopBackgroundDictationActive,\n designVersion === 'next' && disabled && nextStyles.stopBackgroundDisabled,\n state.stopBackground.className,\n );\n }\n\n // Add style hooks from button\n useButtonStyles_unstable({ ...state, components: { ...state.components, icon: 'span' }, iconOnly: false });\n\n return state;\n};\n"],"names":["sendButtonClassNames","isDictationActive","isSendIconFilled","root","sendIcon","stopIcon","stopBackground","sendButtonMotion","stopButtonMotion","stopBackgroundMotion","makeStyles","display","width","minWidth","height","alignItems","padding","justifyContent","tokens","fontSizeBase500","color","colorNeutralForegroundDisabled","colorCompoundBrandBackground","colorCompoundBrandBackgroundHover","borderRadius","borderRadiusCircular","backgroundColor","colorBrandBackground2","baseIconButton","position","zIndex","colorNeutralForegroundOnBrand","colorNeutralForeground2","colorBrandForeground2","colorBrandBackground","colorTransparentBackground","colorNeutralBackgroundDisabled","gridTemplateAreas","gridTemplateRows","gridTemplateColumns","border","spacingVerticalNone","createCustomFocusIndicatorStyle","strokeWidthThick","boxShadow","colorTransparentStroke","colorStrokeFocus2","colorBrandBackgroundHover","colorBrandBackgroundPressed","colorSubtleBackgroundHover","colorNeutralForeground2Hover","colorSubtleBackgroundPressed","colorNeutralForeground2Pressed","colorBrandBackground2Hover","colorBrandForeground2Hover","colorBrandBackground2Pressed","colorBrandForeground2Pressed","sendIconFilledStyle","stopIconFilledStyle","state","disabled","mode","nextStyles","useNextStyles","className","mergeClasses","designVersion","stopIconFilled","styles","iconFilled","rootNextStyles","isButtonMotionRunning","isSending","notSendingDictationActive","notSending","sending","useButtonStyles_unstable","dictationActive","components","iconOnly","stopBackgroundSending","stopBackgroundDictationActive","stopBackgroundDisabled"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
|
package/lib-commonjs/index.js
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui-copilot/react-send-button",
|
|
3
|
-
"version": "0.0.4-hotfix.
|
|
3
|
+
"version": "0.0.4-hotfix.2",
|
|
4
4
|
"description": "Fluent AI control for the send button used in ChatInput and PromptInput.",
|
|
5
5
|
"main": "lib-commonjs/index.js",
|
|
6
6
|
"module": "lib/index.js",
|
|
@@ -12,9 +12,9 @@
|
|
|
12
12
|
},
|
|
13
13
|
"license": "MIT",
|
|
14
14
|
"dependencies": {
|
|
15
|
-
"@fluentui-copilot/react-provider": "0.11.3-hotfix.
|
|
16
|
-
"@fluentui-copilot/react-utilities": "0.0.8-hotfix.
|
|
17
|
-
"@fluentui-copilot/tokens": "0.3.11-hotfix.
|
|
15
|
+
"@fluentui-copilot/react-provider": "0.11.3-hotfix.2",
|
|
16
|
+
"@fluentui-copilot/react-utilities": "0.0.8-hotfix.2",
|
|
17
|
+
"@fluentui-copilot/tokens": "0.3.11-hotfix.2",
|
|
18
18
|
"@swc/helpers": "^0.5.1"
|
|
19
19
|
},
|
|
20
20
|
"peerDependencies": {
|