@fluentui-copilot/react-send-button 0.0.0-nightly-20250416-0405-24e1479b.1

package/CHANGELOG.json

@@ -0,0 +1,20 @@
+{
+  "name": "@fluentui-copilot/react-send-button",
+  "entries": [
+    {
+      "date": "Wed, 16 Apr 2025 04:13:14 GMT",
+      "tag": "@fluentui-copilot/react-send-button_v0.0.0-nightly-20250416-0405-24e1479b.1",
+      "version": "0.0.0-nightly-20250416-0405-24e1479b.1",
+      "comments": {
+        "prerelease": [
+          {
+            "author": "fluentui-internal@service.microsoft.com",
+            "package": "@fluentui-copilot/react-send-button",
+            "commit": "not available",
+            "comment": "Release nightly"
+          }
+        ]
+      }
+    }
+  ]
+}

package/CHANGELOG.md

@@ -0,0 +1,13 @@
+# Change Log - @fluentui-copilot/react-send-button
+
+This log was last generated on Wed, 16 Apr 2025 04:13:14 GMT and should not be manually modified.
+
+<!-- Start content -->
+
+## [0.0.0-nightly-20250416-0405-24e1479b.1](https://github.com/microsoft/fluentai/tree/@fluentui-copilot/react-send-button_v0.0.0-nightly-20250416-0405-24e1479b.1)
+
+Wed, 16 Apr 2025 04:13:14 GMT
+
+### Changes
+
+- Release nightly ([commit](https://github.com/microsoft/fluentai/commit/not available) by fluentui-internal@service.microsoft.com)

package/LICENSE

@@ -0,0 +1,23 @@
+@fluentui-copilot/react-send-button
+
+MIT License
+
+Copyright (c) Microsoft Corporation.
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE

package/README.md

@@ -0,0 +1,5 @@
+# @fluentui-copilot/react-send-button
+
+**For internal use only. External use is not supported at this time.**
+
+**React Send Button components for [Fluent AI React](https://ai.fluentui.dev/)**

package/dist/index.d.ts

@@ -0,0 +1,68 @@
+import type { ARIAButtonSlotProps } from '@fluentui/react-aria';
+import type { ButtonProps } from '@fluentui/react-components';
+import type { ButtonState } from '@fluentui/react-components';
+import type { ComponentProps } from '@fluentui/react-components';
+import type { ComponentState } from '@fluentui/react-components';
+import type { CopilotMode } from '@fluentui-copilot/react-provider';
+import type { DesignVersion } from '@fluentui-copilot/react-provider';
+import type { ForwardRefComponent } from '@fluentui/react-components';
+import type { PresenceMotionSlotProps } from '@fluentui/react-motion';
+import * as React_2 from 'react';
+import type { Slot } from '@fluentui/react-components';
+import type { SlotClassNames } from '@fluentui/react-components';
+
+/**
+ * Render the final JSX of SendButton
+ */
+export declare const renderSendButton_unstable: (state: SendButtonState) => JSX.Element;
+
+export declare const SendButton: ForwardRefComponent<SendButtonProps>;
+
+export declare const sendButtonClassNames: SlotClassNames<SendButtonSlots>;
+
+/**
+ * SendButton Props
+ */
+export declare type SendButtonProps = ComponentProps<Partial<SendButtonSlots>> & Pick<ButtonProps, 'appearance' | 'disabled' | 'disabledFocusable' | 'iconPosition' | 'shape' | 'size'> & DesignVersion & CopilotMode & {
+    /**
+     * Checks whether query is sending.
+     */
+    isSending?: boolean;
+    isSendIconFilled?: boolean;
+};
+
+export declare type SendButtonSlots = {
+    root: NonNullable<Slot<ARIAButtonSlotProps<'a'>>>;
+    sendIcon: NonNullable<Slot<'span'>>;
+    stopIcon?: Slot<'span'>;
+    /** Stop button's circle background */
+    stopBackground: NonNullable<Slot<'div'>>;
+    sendButtonMotion: NonNullable<Slot<PresenceMotionSlotProps>>;
+    stopButtonMotion: NonNullable<Slot<PresenceMotionSlotProps>>;
+    stopBackgroundMotion: NonNullable<Slot<PresenceMotionSlotProps>>;
+};
+
+/**
+ * State used in rendering SendButton
+ */
+export declare type SendButtonState = ComponentState<SendButtonSlots> & Pick<ButtonState, 'appearance' | 'disabled' | 'disabledFocusable' | 'iconPosition' | 'shape' | 'size'> & Pick<SendButtonProps, 'isSendIconFilled' | 'isSending'> & Pick<Required<SendButtonProps>, 'designVersion' | 'mode'> & {
+    isButtonMotionRunning?: boolean;
+};
+
+/**
+ * Create the state required to render SendButton.
+ *
+ * The returned state can be modified with hooks such as useSendButtonStyles_unstable,
+ * before being passed to renderSendButton_unstable.
+ *
+ * @param props - props from this instance of SendButton
+ * @param ref - reference to root HTMLElement of SendButton
+ */
+export declare const useSendButton_unstable: (props: SendButtonProps, ref: React_2.Ref<HTMLButtonElement | HTMLAnchorElement>) => SendButtonState;
+
+/**
+ * Apply styling to the SendButton slots based on the state
+ */
+export declare const useSendButtonStyles_unstable: (state: SendButtonState) => SendButtonState;
+
+export { }

package/lib/SendButton.js

@@ -0,0 +1,2 @@
+export { SendButton, renderSendButton_unstable, useSendButton_unstable, sendButtonClassNames, useSendButtonStyles_unstable } from './components/SendButton';
+//# sourceMappingURL=SendButton.js.map

package/lib/SendButton.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["SendButton.ts"],"sourcesContent":["export {\n  SendButton,\n  renderSendButton_unstable,\n  useSendButton_unstable,\n  sendButtonClassNames,\n  useSendButtonStyles_unstable,\n} from './components/SendButton';\nexport type { SendButtonProps, SendButtonSlots, SendButtonState } from './components/SendButton';\n"],"names":["SendButton","renderSendButton_unstable","useSendButton_unstable","sendButtonClassNames","useSendButtonStyles_unstable"],"rangeMappings":"","mappings":"AAAA,SACEA,UAAU,EACVC,yBAAyB,EACzBC,sBAAsB,EACtBC,oBAAoB,EACpBC,4BAA4B,QACvB,0BAA0B"}

package/lib/components/SendButton/SendButton.js

@@ -0,0 +1,12 @@
+import * as React from 'react';
+import { useSendButton_unstable } from './useSendButton';
+import { renderSendButton_unstable } from './renderSendButton';
+import { useSendButtonStyles_unstable } from './useSendButtonStyles.styles';
+// SendButton component - TODO: add more docs
+export const SendButton = /*#__PURE__*/React.forwardRef((props, ref) => {
+  const state = useSendButton_unstable(props, ref);
+  useSendButtonStyles_unstable(state);
+  return renderSendButton_unstable(state);
+});
+SendButton.displayName = 'SendButton';
+//# sourceMappingURL=SendButton.js.map

package/lib/components/SendButton/SendButton.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["SendButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useSendButton_unstable } from './useSendButton';\nimport { renderSendButton_unstable } from './renderSendButton';\nimport { useSendButtonStyles_unstable } from './useSendButtonStyles.styles';\nimport type { SendButtonProps } from './SendButton.types';\nimport type { ForwardRefComponent } from '@fluentui/react-components';\n\n// SendButton component - TODO: add more docs\nexport const SendButton: ForwardRefComponent<SendButtonProps> = React.forwardRef((props, ref) => {\n  const state = useSendButton_unstable(props, ref);\n\n  useSendButtonStyles_unstable(state);\n  return renderSendButton_unstable(state);\n});\n\nSendButton.displayName = 'SendButton';\n"],"names":["React","useSendButton_unstable","renderSendButton_unstable","useSendButtonStyles_unstable","SendButton","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,sBAAsB,QAAQ,kBAAkB;AACzD,SAASC,yBAAyB,QAAQ,qBAAqB;AAC/D,SAASC,4BAA4B,QAAQ,+BAA+B;AAI5E,6CAA6C;AAC7C,OAAO,MAAMC,2BAAmDJ,MAAMK,UAAU,CAAC,CAACC,OAAOC;IACvF,MAAMC,QAAQP,uBAAuBK,OAAOC;IAE5CJ,6BAA6BK;IAC7B,OAAON,0BAA0BM;AACnC,GAAG;AAEHJ,WAAWK,WAAW,GAAG"}

package/lib/components/SendButton/SendButton.types.js

@@ -0,0 +1,4 @@
+/**
+ * State used in rendering SendButton
+ */export {};
+//# sourceMappingURL=SendButton.types.js.map

package/lib/components/SendButton/SendButton.types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["SendButton.types.ts"],"sourcesContent":["import type { CopilotMode, DesignVersion } from '@fluentui-copilot/react-provider';\nimport type { ARIAButtonSlotProps } from '@fluentui/react-aria';\nimport type { ButtonProps, ButtonState, ComponentProps, ComponentState, Slot } from '@fluentui/react-components';\nimport type { PresenceMotionSlotProps } from '@fluentui/react-motion';\nexport type SendButtonSlots = {\n  root: NonNullable<Slot<ARIAButtonSlotProps<'a'>>>;\n  sendIcon: NonNullable<Slot<'span'>>;\n  stopIcon?: Slot<'span'>;\n  /** Stop button's circle background */\n  stopBackground: NonNullable<Slot<'div'>>;\n  sendButtonMotion: NonNullable<Slot<PresenceMotionSlotProps>>;\n  stopButtonMotion: NonNullable<Slot<PresenceMotionSlotProps>>;\n  stopBackgroundMotion: NonNullable<Slot<PresenceMotionSlotProps>>;\n};\n\n/**\n * SendButton Props\n */\nexport type SendButtonProps = ComponentProps<Partial<SendButtonSlots>> &\n  Pick<ButtonProps, 'appearance' | 'disabled' | 'disabledFocusable' | 'iconPosition' | 'shape' | 'size'> &\n  DesignVersion &\n  CopilotMode & {\n    /**\n     * Checks whether query is sending.\n     */\n    isSending?: boolean;\n    isSendIconFilled?: boolean;\n  };\n\n/**\n * State used in rendering SendButton\n */\nexport type SendButtonState = ComponentState<SendButtonSlots> &\n  Pick<ButtonState, 'appearance' | 'disabled' | 'disabledFocusable' | 'iconPosition' | 'shape' | 'size'> &\n  Pick<SendButtonProps, 'isSendIconFilled' | 'isSending'> &\n  Pick<Required<SendButtonProps>, 'designVersion' | 'mode'> & {\n    isButtonMotionRunning?: boolean;\n  };\n"],"names":[],"rangeMappings":";;","mappings":"AA6BA;;CAEC,GACD,WAKI"}

package/lib/components/SendButton/buttonMotion.js

@@ -0,0 +1,151 @@
+import { createPresenceComponent, motionTokens } from '@fluentui/react-components';
+const scaleSend = 1.2;
+const startScaleStop = 0.5;
+const scaleStop = 1.2;
+const startScaleCircle = 0.1;
+const scaleCircle = 1.1;
+const motionSpeedMultiplier = 1;
+const sendMotion = () => {
+  const enterKeyframes = [{
+    keyframes: [{
+      transform: `scale(0)`
+    }],
+    duration: 0
+  }, {
+    keyframes: [{
+      transform: `scale(0)`
+    }, {
+      transform: `scale(${scaleSend})`
+    }],
+    duration: motionTokens.durationNormal * motionSpeedMultiplier,
+    easing: motionTokens.curveDecelerateMax,
+    delay: motionTokens.durationSlow * motionSpeedMultiplier
+  }, {
+    keyframes: [{
+      transform: `scale(${scaleSend})`
+    }, {
+      transform: 'scale(1)'
+    }],
+    duration: motionTokens.durationSlow * motionSpeedMultiplier,
+    easing: motionTokens.curveDecelerateMid,
+    delay: (motionTokens.durationSlow + motionTokens.durationNormal) * motionSpeedMultiplier
+  }];
+  const exitKeyframes = [{
+    keyframes: [{
+      transform: `scale(1)`
+    }, {
+      transform: `scale(0)`
+    }],
+    duration: motionTokens.durationFast * motionSpeedMultiplier,
+    easing: motionTokens.curveDecelerateMid
+  }];
+  return {
+    enter: enterKeyframes,
+    exit: exitKeyframes
+  };
+};
+const stopMotion = () => {
+  const enterKeyframes = [{
+    keyframes: [{
+      opacity: 0
+    }],
+    duration: 0
+  }, {
+    keyframes: [{
+      opacity: 1
+    }],
+    duration: 0,
+    delay: 30 * motionSpeedMultiplier
+  }, {
+    keyframes: [{
+      transform: `scale(${startScaleStop})`
+    }, {
+      transform: `scale(1)`
+    }],
+    duration: motionTokens.durationSlower * motionSpeedMultiplier,
+    easing: motionTokens.curveDecelerateMid
+  }];
+  const exitKeyframes = [{
+    keyframes: [{
+      transform: `scale(1)`
+    }, {
+      transform: `scale(${scaleStop})`
+    }],
+    duration: motionTokens.durationFast * motionSpeedMultiplier,
+    easing: motionTokens.curveDecelerateMax,
+    delay: motionTokens.durationUltraFast * motionSpeedMultiplier
+  }, {
+    keyframes: [{
+      transform: `scale(${scaleStop})`
+    }, {
+      transform: 'scale(0)'
+    }],
+    duration: motionTokens.durationFaster,
+    easing: motionTokens.curveDecelerateMin,
+    delay: (motionTokens.durationUltraFast + motionTokens.durationFast) * motionSpeedMultiplier
+  }];
+  return {
+    enter: enterKeyframes,
+    exit: exitKeyframes
+  };
+};
+const circleMotion = () => {
+  const enterKeyframes = [{
+    keyframes: [{
+      opacity: 0
+    }],
+    duration: 0
+  }, {
+    keyframes: [{
+      opacity: 0
+    }, {
+      opacity: 1
+    }],
+    duration: 0,
+    delay: motionTokens.durationFaster * motionSpeedMultiplier
+  }, {
+    keyframes: [{
+      transform: `scale(${startScaleCircle})`
+    }, {
+      transform: `scale(${scaleCircle})`
+    }],
+    duration: motionTokens.durationSlow * motionSpeedMultiplier,
+    easing: motionTokens.curveDecelerateMax,
+    delay: motionTokens.durationFaster * motionSpeedMultiplier
+  }, {
+    keyframes: [{
+      transform: `scale(${scaleCircle})`
+    }, {
+      transform: `scale(1)`
+    }],
+    duration: motionTokens.durationNormal * motionSpeedMultiplier,
+    easing: motionTokens.curveDecelerateMin,
+    delay: (motionTokens.durationSlow + motionTokens.durationFaster) * motionSpeedMultiplier
+  }];
+  const exitKeyframes = [{
+    keyframes: [{
+      transform: `scale(1)`
+    }, {
+      transform: `scale(${scaleCircle})`
+    }],
+    duration: motionTokens.durationFast * motionSpeedMultiplier,
+    easing: motionTokens.curveDecelerateMax
+  }, {
+    keyframes: [{
+      transform: `scale(${scaleCircle})`
+    }, {
+      transform: 'scale(0)'
+    }],
+    duration: motionTokens.durationFaster * motionSpeedMultiplier,
+    easing: motionTokens.curveDecelerateMin,
+    delay: motionTokens.durationFast * motionSpeedMultiplier
+  }];
+  return {
+    enter: enterKeyframes,
+    exit: exitKeyframes
+  };
+};
+export const SendButtonMotion = createPresenceComponent(sendMotion);
+export const StopButtonMotion = createPresenceComponent(stopMotion);
+export const CircleButtonMotion = createPresenceComponent(circleMotion);
+//# sourceMappingURL=buttonMotion.js.map

package/lib/components/SendButton/buttonMotion.js.map

@@ -0,0 +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":["createPresenceComponent","motionTokens","scaleSend","startScaleStop","scaleStop","startScaleCircle","scaleCircle","motionSpeedMultiplier","sendMotion","enterKeyframes","keyframes","transform","duration","durationNormal","easing","curveDecelerateMax","delay","durationSlow","curveDecelerateMid","exitKeyframes","durationFast","enter","exit","stopMotion","opacity","durationSlower","durationUltraFast","durationFaster","curveDecelerateMin","circleMotion","SendButtonMotion","StopButtonMotion","CircleButtonMotion"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

package/lib/components/SendButton/index.js

@@ -0,0 +1,5 @@
+export { SendButton } from './SendButton';
+export { renderSendButton_unstable } from './renderSendButton';
+export { useSendButton_unstable } from './useSendButton';
+export { sendButtonClassNames, useSendButtonStyles_unstable } from './useSendButtonStyles.styles';
+//# sourceMappingURL=index.js.map

package/lib/components/SendButton/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["index.ts"],"sourcesContent":["export { SendButton } from './SendButton';\nexport type { SendButtonProps, SendButtonSlots, SendButtonState } from './SendButton.types';\nexport { renderSendButton_unstable } from './renderSendButton';\nexport { useSendButton_unstable } from './useSendButton';\nexport { sendButtonClassNames, useSendButtonStyles_unstable } from './useSendButtonStyles.styles';\n"],"names":["SendButton","renderSendButton_unstable","useSendButton_unstable","sendButtonClassNames","useSendButtonStyles_unstable"],"rangeMappings":";;;","mappings":"AAAA,SAASA,UAAU,QAAQ,eAAe;AAE1C,SAASC,yBAAyB,QAAQ,qBAAqB;AAC/D,SAASC,sBAAsB,QAAQ,kBAAkB;AACzD,SAASC,oBAAoB,EAAEC,4BAA4B,QAAQ,+BAA+B"}

package/lib/components/SendButton/renderSendButton.js

@@ -0,0 +1,38 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "@fluentui/react-jsx-runtime/jsx-runtime";
+import { assertSlots } from '@fluentui/react-components';
+/**
+ * Render the final JSX of SendButton
+ */
+export const renderSendButton_unstable = state => {
+  if (state.designVersion === 'next') {
+    return renderSendButtonNext(state);
+  }
+  return renderSendButtonCurrent(state);
+};
+function renderSendButtonCurrent(state) {
+  assertSlots(state);
+  return /*#__PURE__*/_jsxs(state.root, {
+    children: [state.stopIcon && /*#__PURE__*/_jsxs(_Fragment, {
+      children: [/*#__PURE__*/_jsx(state.stopBackgroundMotion, {
+        children: /*#__PURE__*/_jsx(state.stopBackground, {})
+      }), /*#__PURE__*/_jsx(state.stopButtonMotion, {
+        children: /*#__PURE__*/_jsx(state.stopIcon, {})
+      })]
+    }), /*#__PURE__*/_jsx(state.sendButtonMotion, {
+      children: /*#__PURE__*/_jsx(state.sendIcon, {})
+    })]
+  });
+}
+function renderSendButtonNext(state) {
+  assertSlots(state);
+  return /*#__PURE__*/_jsxs(state.root, {
+    children: [/*#__PURE__*/_jsx(state.stopBackgroundMotion, {
+      children: /*#__PURE__*/_jsx(state.stopBackground, {})
+    }), state.stopIcon && /*#__PURE__*/_jsx(state.stopButtonMotion, {
+      children: /*#__PURE__*/_jsx(state.stopIcon, {})
+    }), /*#__PURE__*/_jsx(state.sendButtonMotion, {
+      children: /*#__PURE__*/_jsx(state.sendIcon, {})
+    })]
+  });
+}
+//# sourceMappingURL=renderSendButton.js.map

package/lib/components/SendButton/renderSendButton.js.map

@@ -0,0 +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":["assertSlots","renderSendButton_unstable","state","designVersion","renderSendButtonNext","renderSendButtonCurrent","root","stopIcon","stopBackgroundMotion","stopBackground","stopButtonMotion","sendButtonMotion","sendIcon"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,6BAA6B;AAGzD;;CAEC,GACD,OAAO,MAAMC,4BAA4B,CAACC;IACxC,IAAIA,MAAMC,aAAa,KAAK,QAAQ;QAClC,OAAOC,qBAAqBF;IAC9B;IAEA,OAAOG,wBAAwBH;AACjC,EAAE;AAEF,SAASG,wBAAwBH,KAAsB;IACrDF,YAA6BE;IAE7B,qBACE,MAACA,MAAMI,IAAI;;YACRJ,MAAMK,QAAQ,kBACb;;kCACE,KAACL,MAAMM,oBAAoB;kCACzB,cAAA,KAACN,MAAMO,cAAc;;kCAEvB,KAACP,MAAMQ,gBAAgB;kCACrB,cAAA,KAACR,MAAMK,QAAQ;;;;0BAIrB,KAACL,MAAMS,gBAAgB;0BACrB,cAAA,KAACT,MAAMU,QAAQ;;;;AAIvB;AAEA,SAASR,qBAAqBF,KAAsB;IAClDF,YAA6BE;IAE7B,qBACE,MAACA,MAAMI,IAAI;;0BACT,KAACJ,MAAMM,oBAAoB;0BACzB,cAAA,KAACN,MAAMO,cAAc;;YAEtBP,MAAMK,QAAQ,kBACb,KAACL,MAAMQ,gBAAgB;0BACrB,cAAA,KAACR,MAAMK,QAAQ;;0BAGnB,KAACL,MAAMS,gBAAgB;0BACrB,cAAA,KAACT,MAAMU,QAAQ;;;;AAIvB"}

package/lib/components/SendButton/useSendButton.js

@@ -0,0 +1,117 @@
+import * as React from 'react';
+import { slot, useButton_unstable, useMergedRefs } from '@fluentui/react-components';
+import { CircleButtonMotion, SendButtonMotion, StopButtonMotion } from './buttonMotion';
+import { bundleIcon, SendFilled, SendRegular, Stop16Filled, Stop24Filled, ArrowRight24Filled, ArrowRight24Regular, Stop20Filled, ArrowRight20Regular, ArrowRight20Filled } from '@fluentui/react-icons';
+import { presenceMotionSlot } from '@fluentui/react-motion';
+import { useCopilotMode, useDesignVersion } from '@fluentui-copilot/react-provider';
+const SendIcon = bundleIcon(SendFilled, SendRegular);
+const SendIconV2Canvas = bundleIcon(ArrowRight24Filled, ArrowRight24Regular);
+const SendIconV2Sidecar = bundleIcon(ArrowRight20Filled, ArrowRight20Regular);
+/**
+ * Create the state required to render SendButton.
+ *
+ * The returned state can be modified with hooks such as useSendButtonStyles_unstable,
+ * before being passed to renderSendButton_unstable.
+ *
+ * @param props - props from this instance of SendButton
+ * @param ref - reference to root HTMLElement of SendButton
+ */
+export const useSendButton_unstable = (props, ref) => {
+  /** Used to apply/remove styles when button is animating */const [isSendMotionRunning, setIsSendMotionRunning] = React.useState(false);
+  const [isStopMotionRunning, setIsStopMotionRunning] = React.useState(false);
+  const isButtonMotionRunning = isSendMotionRunning || isStopMotionRunning;
+  const designVersion = useDesignVersion(props.designVersion);
+  const mode = useCopilotMode(props.mode);
+  const [visible, setVisible] = React.useState(false);
+  const mountRef = React.useCallback(elem => {
+    if (elem) {
+      setVisible(true);
+    } else {
+      setVisible(false);
+    }
+  }, []);
+  const finalRef = useMergedRefs(ref, mountRef);
+  const buttonState = useButton_unstable({
+    shape: designVersion === 'next' ? 'circular' : undefined,
+    ...props,
+    appearance: 'transparent',
+    'aria-disabled': props.disabled ? true : undefined,
+    type: 'submit'
+  }, finalRef);
+  const icon = (() => {
+    if (designVersion === 'next') {
+      if (props.isSendIconFilled || isButtonMotionRunning) {
+        return mode === 'canvas' ? /*#__PURE__*/React.createElement(ArrowRight24Filled, null) : /*#__PURE__*/React.createElement(ArrowRight20Regular, null);
+      } else {
+        return mode === 'canvas' ? /*#__PURE__*/React.createElement(SendIconV2Canvas, null) : /*#__PURE__*/React.createElement(SendIconV2Sidecar, null);
+      }
+    } else {
+      if (props.isSendIconFilled || isButtonMotionRunning) {
+        return /*#__PURE__*/React.createElement(SendFilled, null);
+      } else {
+        return /*#__PURE__*/React.createElement(SendIcon, null);
+      }
+    }
+  })();
+  const state = {
+    ...buttonState,
+    components: {
+      root: 'button',
+      sendIcon: 'span',
+      stopIcon: 'span',
+      stopBackground: 'div',
+      sendButtonMotion: SendButtonMotion,
+      stopButtonMotion: StopButtonMotion,
+      stopBackgroundMotion: CircleButtonMotion
+    },
+    root: buttonState.root,
+    sendIcon: slot.always(props.sendIcon, {
+      elementType: 'span',
+      defaultProps: {
+        children: icon
+      }
+    }),
+    stopIcon: slot.optional(props.stopIcon, {
+      elementType: 'span',
+      defaultProps: {
+        children: designVersion === 'next' ? mode === 'canvas' ? /*#__PURE__*/React.createElement(Stop24Filled, null) : /*#__PURE__*/React.createElement(Stop20Filled, null) : /*#__PURE__*/React.createElement(Stop16Filled, null)
+      },
+      renderByDefault: true
+    }),
+    stopBackground: slot.always(props.stopBackground, {
+      elementType: 'div'
+    }),
+    sendButtonMotion: presenceMotionSlot(props.sendButtonMotion, {
+      elementType: SendButtonMotion,
+      defaultProps: {
+        visible: !props.isSending,
+        unmountOnExit: true,
+        onMotionFinish: () => setIsSendMotionRunning(false),
+        onMotionStart: () => setIsSendMotionRunning(true)
+      }
+    }),
+    stopButtonMotion: presenceMotionSlot(props.stopButtonMotion, {
+      elementType: StopButtonMotion,
+      defaultProps: {
+        visible: props.isSending,
+        unmountOnExit: true,
+        onMotionFinish: () => setIsStopMotionRunning(false),
+        onMotionStart: () => setIsStopMotionRunning(true)
+      }
+    }),
+    stopBackgroundMotion: presenceMotionSlot(props.stopBackgroundMotion, {
+      elementType: CircleButtonMotion,
+      defaultProps: {
+        visible: designVersion === 'next' ? visible : props.isSending,
+        unmountOnExit: true
+      }
+    }),
+    isButtonMotionRunning,
+    isSendIconFilled: props.isSendIconFilled,
+    isSending: props.isSending,
+    designVersion,
+    mode
+  };
+  return state;
+};
+//# sourceMappingURL=useSendButton.js.map

package/lib/components/SendButton/useSendButton.js.map

@@ -0,0 +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  Stop24Filled,\n  ArrowRight24Filled,\n  ArrowRight24Regular,\n  Stop20Filled,\n  ArrowRight20Regular,\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);\nconst SendIconV2Canvas = bundleIcon(ArrowRight24Filled, ArrowRight24Regular);\nconst SendIconV2Sidecar = bundleIcon(ArrowRight20Filled, ArrowRight20Regular);\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      if (props.isSendIconFilled || isButtonMotionRunning) {\n        return mode === 'canvas' ? <ArrowRight24Filled /> : <ArrowRight20Regular />;\n      } else {\n        return mode === 'canvas' ? <SendIconV2Canvas /> : <SendIconV2Sidecar />;\n      }\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' ? <Stop24Filled /> : <Stop20Filled /> : <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    isSendIconFilled: props.isSendIconFilled,\n    isSending: props.isSending,\n    designVersion,\n    mode,\n  };\n\n  return state;\n};\n"],"names":["React","slot","useButton_unstable","useMergedRefs","CircleButtonMotion","SendButtonMotion","StopButtonMotion","bundleIcon","SendFilled","SendRegular","Stop16Filled","Stop24Filled","ArrowRight24Filled","ArrowRight24Regular","Stop20Filled","ArrowRight20Regular","ArrowRight20Filled","presenceMotionSlot","useCopilotMode","useDesignVersion","SendIcon","SendIconV2Canvas","SendIconV2Sidecar","useSendButton_unstable","props","ref","isSendMotionRunning","setIsSendMotionRunning","useState","isStopMotionRunning","setIsStopMotionRunning","isButtonMotionRunning","designVersion","mode","visible","setVisible","mountRef","useCallback","elem","finalRef","buttonState","shape","undefined","appearance","disabled","type","icon","isSendIconFilled","state","components","root","sendIcon","stopIcon","stopBackground","sendButtonMotion","stopButtonMotion","stopBackgroundMotion","always","elementType","defaultProps","children","optional","renderByDefault","isSending","unmountOnExit","onMotionFinish","onMotionStart"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}