@fluentui-copilot/react-attachments 0.8.1 → 0.8.3

package/CHANGELOG.json

@@ -2,7 +2,43 @@
   "name": "@fluentui-copilot/react-attachments",
   "entries": [
     {
-      "date": "Thu, 14 Mar 2024 18:24:04 GMT",
+      "date": "Wed, 03 Apr 2024 22:27:26 GMT",
+      "tag": "@fluentui-copilot/react-attachments_v0.8.3",
+      "version": "0.8.3",
+      "comments": {
+        "patch": [
+          {
+            "author": "tristan.watanabe@gmail.com",
+            "package": "@fluentui-copilot/react-attachments",
+            "commit": "db2c9191dc03bf477de894b8fb8a6c349147157b",
+            "comment": "fix: use getIntrinsicElementProps to replace deprecated getNativeElementProps."
+          },
+          {
+            "author": "tristan.watanabe@gmail.com",
+            "package": "@fluentui-copilot/react-attachments",
+            "commit": "6b759badcb2260ef4901988973ec37e9bed35a1f",
+            "comment": "feat: Implement AttachmentList component."
+          }
+        ]
+      }
+    },
+    {
+      "date": "Wed, 03 Apr 2024 00:23:41 GMT",
+      "tag": "@fluentui-copilot/react-attachments_v0.8.2",
+      "version": "0.8.2",
+      "comments": {
+        "patch": [
+          {
+            "author": "tristan.watanabe@gmail.com",
+            "package": "@fluentui-copilot/react-attachments",
+            "commit": "42907801f4b0eb4a808729ac00f86380b3e8a5bf",
+            "comment": "feat: implement Attachment component."
+          }
+        ]
+      }
+    },
+    {
+      "date": "Thu, 14 Mar 2024 18:24:19 GMT",
       "tag": "@fluentui-copilot/react-attachments_v0.8.1",
       "version": "0.8.1",
       "comments": {

package/CHANGELOG.md

@@ -1,12 +1,31 @@
 # Change Log - @fluentui-copilot/react-attachments
 
-This log was last generated on Thu, 14 Mar 2024 18:24:04 GMT and should not be manually modified.
+This log was last generated on Wed, 03 Apr 2024 22:27:26 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [0.8.3](https://github.com/microsoft/fluentai/tree/@fluentui-copilot/react-attachments_v0.8.3)
+
+Wed, 03 Apr 2024 22:27:26 GMT 
+[Compare changes](https://github.com/microsoft/fluentai/compare/@fluentui-copilot/react-attachments_v0.8.2..@fluentui-copilot/react-attachments_v0.8.3)
+
+### Patches
+
+- fix: use getIntrinsicElementProps to replace deprecated getNativeElementProps. ([PR #1509](https://github.com/microsoft/fluentai/pull/1509) by tristan.watanabe@gmail.com)
+- feat: Implement AttachmentList component. ([PR #1488](https://github.com/microsoft/fluentai/pull/1488) by tristan.watanabe@gmail.com)
+
+## [0.8.2](https://github.com/microsoft/fluentai/tree/@fluentui-copilot/react-attachments_v0.8.2)
+
+Wed, 03 Apr 2024 00:23:41 GMT 
+[Compare changes](https://github.com/microsoft/fluentai/compare/@fluentui-copilot/react-attachments_v0.8.1..@fluentui-copilot/react-attachments_v0.8.2)
+
+### Patches
+
+- feat: implement Attachment component. ([PR #1466](https://github.com/microsoft/fluentai/pull/1466) by tristan.watanabe@gmail.com)
+
 ## [0.8.1](https://github.com/microsoft/fluentai/tree/@fluentui-copilot/react-attachments_v0.8.1)
 
-Thu, 14 Mar 2024 18:24:04 GMT 
+Thu, 14 Mar 2024 18:24:19 GMT 
 [Compare changes](https://github.com/microsoft/fluentai/compare/@fluentui-copilot/react-attachments_v0.8.0..@fluentui-copilot/react-attachments_v0.8.1)
 
 ### Patches

package/dist/index.d.ts

@@ -2,11 +2,78 @@
 
 import type { ComponentProps } from '@fluentui/react-components';
 import type { ComponentState } from '@fluentui/react-components';
+import type { Context } from '@fluentui/react-context-selector';
+import type { ContextSelector } from '@fluentui/react-context-selector';
+import { FC } from 'react';
 import type { ForwardRefComponent } from '@fluentui/react-components';
-import type * as React_2 from 'react';
+import { Provider } from 'react';
+import { ProviderProps } from 'react';
+import * as React_2 from 'react';
 import type { Slot } from '@fluentui/react-components';
 import type { SlotClassNames } from '@fluentui/react-components';
 
+export declare const Attachment: ForwardRefComponent<AttachmentProps>;
+
+export declare const attachmentClassNames: SlotClassNames<AttachmentSlots>;
+
+declare type AttachmentDismissedData = {
+    id: string;
+};
+
+export declare const AttachmentList: ForwardRefComponent<AttachmentListProps>;
+
+export declare const attachmentListClassNames: SlotClassNames<AttachmentListSlots>;
+
+export declare const AttachmentListContext: Context<AttachmentListContextValue>;
+
+/**
+ * Context shared between AttachmentList and its children components
+ */
+export declare type AttachmentListContextValue = Pick<AttachmentListProps, 'onAttachmentDismiss'>;
+
+declare type AttachmentListContextValues = {
+    attachmentList: AttachmentListContextValue;
+};
+
+/**
+ * AttachmentList Props
+ */
+export declare type AttachmentListProps = ComponentProps<Partial<AttachmentListSlots>> & {
+    onAttachmentDismiss?: (e: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement>, data: AttachmentDismissedData) => void;
+};
+
+export declare const AttachmentListProvider: Provider<AttachmentListContextValue> & FC<ProviderProps<AttachmentListContextValue>>;
+
+export declare type AttachmentListSlots = {
+    root: Slot<'div'>;
+};
+
+/**
+ * State used in rendering AttachmentList
+ */
+export declare type AttachmentListState = ComponentState<AttachmentListSlots> & Pick<AttachmentListProps, 'onAttachmentDismiss'>;
+
+/**
+ * Attachment Props
+ */
+export declare type AttachmentProps = ComponentProps<Partial<AttachmentSlots>> & {
+    id: string;
+};
+
+export declare type AttachmentSlots = {
+    root: NonNullable<Slot<'div'>>;
+    primaryAction: NonNullable<Slot<'button', 'span'>>;
+    dismissButton: NonNullable<Slot<'button'>>;
+    media?: Slot<'span'>;
+    content: NonNullable<Slot<'span'>>;
+    dismissIcon: NonNullable<Slot<'span'>>;
+};
+
+/**
+ * State used in rendering Attachment
+ */
+export declare type AttachmentState = ComponentState<AttachmentSlots>;
+
 export declare const AttachmentTag: ForwardRefComponent<AttachmentTagProps>;
 
 export declare const attachmentTagClassNames: SlotClassNames<AttachmentTagSlots>;
@@ -83,6 +150,16 @@ export declare type AttachmentTagSlots = {
  */
 export declare type AttachmentTagState = ComponentState<AttachmentTagSlots>;
 
+/**
+ * Render the final JSX of Attachment
+ */
+export declare const renderAttachment_unstable: (state: AttachmentState) => JSX.Element;
+
+/**
+ * Render the final JSX of AttachmentList
+ */
+export declare const renderAttachmentList_unstable: (state: AttachmentListState, contextValues: AttachmentListContextValues) => JSX.Element;
+
 /**
  * Render the final JSX of AttachmentTag
  */
@@ -98,6 +175,40 @@ export declare const renderAttachmentTagItem_unstable: (state: AttachmentTagItem
  */
 export declare const renderAttachmentTagList_unstable: (state: AttachmentTagListState, contextValues: AttachmentTagListContextValues) => JSX.Element;
 
+/**
+ * Create the state required to render Attachment.
+ *
+ * The returned state can be modified with hooks such as useAttachmentStyles_unstable,
+ * before being passed to renderAttachment_unstable.
+ *
+ * @param props - props from this instance of Attachment
+ * @param ref - reference to root HTMLElement of Attachment
+ */
+export declare const useAttachment_unstable: (props: AttachmentProps, ref: React_2.Ref<HTMLDivElement>) => AttachmentState;
+
+/**
+ * Create the state required to render AttachmentList.
+ *
+ * The returned state can be modified with hooks such as useAttachmentListStyles_unstable,
+ * before being passed to renderAttachmentList_unstable.
+ *
+ * @param props - props from this instance of AttachmentList
+ * @param ref - reference to root HTMLElement of AttachmentList
+ */
+export declare const useAttachmentList_unstable: (props: AttachmentListProps, ref: React_2.Ref<HTMLDivElement>) => AttachmentListState;
+
+export declare const useAttachmentListContext_unstable: <T>(selector: ContextSelector<AttachmentListContextValue, T>) => T;
+
+/**
+ * Apply styling to the AttachmentList slots based on the state
+ */
+export declare const useAttachmentListStyles_unstable: (state: AttachmentListState) => AttachmentListState;
+
+/**
+ * Apply styling to the Attachment slots based on the state
+ */
+export declare const useAttachmentStyles_unstable: (state: AttachmentState) => AttachmentState;
+
 /**
  * Create the state required to render AttachmentTag.
  *

package/lib/Attachment.js

@@ -0,0 +1,2 @@
+export * from './components/Attachment/index';
+//# sourceMappingURL=Attachment.js.map

package/lib/Attachment.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Attachment.ts"],"sourcesContent":["export * from './components/Attachment/index';\n"],"names":[],"mappings":"AAAA,cAAc,gCAAgC"}

package/lib/AttachmentList.js

@@ -0,0 +1,2 @@
+export * from './components/AttachmentList/index';
+//# sourceMappingURL=AttachmentList.js.map

package/lib/AttachmentList.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["AttachmentList.ts"],"sourcesContent":["export * from './components/AttachmentList/index';\n"],"names":[],"mappings":"AAAA,cAAc,oCAAoC"}

package/lib/components/Attachment/Attachment.js

@@ -0,0 +1,12 @@
+import * as React from 'react';
+import { useAttachment_unstable } from './useAttachment';
+import { renderAttachment_unstable } from './renderAttachment';
+import { useAttachmentStyles_unstable } from './useAttachmentStyles';
+// Attachment component - TODO: add more docs
+export const Attachment = /*#__PURE__*/React.forwardRef((props, ref) => {
+  const state = useAttachment_unstable(props, ref);
+  useAttachmentStyles_unstable(state);
+  return renderAttachment_unstable(state);
+});
+Attachment.displayName = 'Attachment';
+//# sourceMappingURL=Attachment.js.map

package/lib/components/Attachment/Attachment.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Attachment.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useAttachment_unstable } from './useAttachment';\nimport { renderAttachment_unstable } from './renderAttachment';\nimport { useAttachmentStyles_unstable } from './useAttachmentStyles';\nimport type { AttachmentProps } from './Attachment.types';\nimport type { ForwardRefComponent } from '@fluentui/react-components';\n\n// Attachment component - TODO: add more docs\nexport const Attachment: ForwardRefComponent<AttachmentProps> = React.forwardRef((props, ref) => {\n  const state = useAttachment_unstable(props, ref);\n\n  useAttachmentStyles_unstable(state);\n  return renderAttachment_unstable(state);\n});\n\nAttachment.displayName = 'Attachment';\n"],"names":["React","useAttachment_unstable","renderAttachment_unstable","useAttachmentStyles_unstable","Attachment","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,sBAAsB,QAAQ,kBAAkB;AACzD,SAASC,yBAAyB,QAAQ,qBAAqB;AAC/D,SAASC,4BAA4B,QAAQ,wBAAwB;AAIrE,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/Attachment/Attachment.types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=Attachment.types.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["Attachment.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-components';\n\nexport type AttachmentSlots = {\n  root: NonNullable<Slot<'div'>>;\n  primaryAction: NonNullable<Slot<'button', 'span'>>;\n  dismissButton: NonNullable<Slot<'button'>>;\n  media?: Slot<'span'>;\n  content: NonNullable<Slot<'span'>>;\n  dismissIcon: NonNullable<Slot<'span'>>;\n};\n\n/**\n * Attachment Props\n */\nexport type AttachmentProps = ComponentProps<Partial<AttachmentSlots>> & {\n  id: string;\n};\n\n/**\n * State used in rendering Attachment\n */\nexport type AttachmentState = ComponentState<AttachmentSlots>;\n"],"names":[],"mappings":"AAAA,WAqB8D"}

package/lib/components/Attachment/index.js

@@ -0,0 +1,6 @@
+export * from './Attachment';
+export * from './Attachment.types';
+export * from './renderAttachment';
+export * from './useAttachment';
+export * from './useAttachmentStyles';
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './Attachment';\nexport * from './Attachment.types';\nexport * from './renderAttachment';\nexport * from './useAttachment';\nexport * from './useAttachmentStyles';\n"],"names":[],"mappings":"AAAA,cAAc,eAAe;AAC7B,cAAc,qBAAqB;AACnC,cAAc,qBAAqB;AACnC,cAAc,kBAAkB;AAChC,cAAc,wBAAwB"}

package/lib/components/Attachment/renderAttachment.js

@@ -0,0 +1,16 @@
+import { jsx as _jsx, jsxs as _jsxs } from "@fluentui/react-jsx-runtime/jsx-runtime";
+import { assertSlots } from '@fluentui/react-components';
+/**
+ * Render the final JSX of Attachment
+ */
+export const renderAttachment_unstable = state => {
+  assertSlots(state);
+  return /*#__PURE__*/_jsxs(state.root, {
+    children: [/*#__PURE__*/_jsxs(state.primaryAction, {
+      children: [state.media && /*#__PURE__*/_jsx(state.media, {}), /*#__PURE__*/_jsx(state.content, {})]
+    }), /*#__PURE__*/_jsx(state.dismissButton, {
+      children: /*#__PURE__*/_jsx(state.dismissIcon, {})
+    })]
+  });
+};
+//# sourceMappingURL=renderAttachment.js.map

package/lib/components/Attachment/renderAttachment.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["renderAttachment.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-components';\nimport type { AttachmentState, AttachmentSlots } from './Attachment.types';\n\n/**\n * Render the final JSX of Attachment\n */\nexport const renderAttachment_unstable = (state: AttachmentState) => {\n  assertSlots<AttachmentSlots>(state);\n\n  return (\n    <state.root>\n      <state.primaryAction>\n        {state.media && <state.media />}\n        <state.content />\n      </state.primaryAction>\n      <state.dismissButton>\n        <state.dismissIcon />\n      </state.dismissButton>\n    </state.root>\n  );\n};\n"],"names":["assertSlots","renderAttachment_unstable","state","root","primaryAction","media","content","dismissButton","dismissIcon"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,6BAA6B;AAGzD;;CAEC,GACD,OAAO,MAAMC,4BAA4B,CAACC;IACxCF,YAA6BE;IAE7B,qBACE,MAACA,MAAMC,IAAI;;0BACT,MAACD,MAAME,aAAa;;oBACjBF,MAAMG,KAAK,kBAAI,KAACH,MAAMG,KAAK;kCAC5B,KAACH,MAAMI,OAAO;;;0BAEhB,KAACJ,MAAMK,aAAa;0BAClB,cAAA,KAACL,MAAMM,WAAW;;;;AAI1B,EAAE"}

package/lib/components/Attachment/useAttachment.js

@@ -0,0 +1,71 @@
+import * as React from 'react';
+import { getIntrinsicElementProps, mergeCallbacks, slot } from '@fluentui/react-components';
+import { Dismiss20Regular, Dismiss20Filled, bundleIcon } from '@fluentui/react-icons';
+import { useAttachmentListContext_unstable } from '../../contexts/attachmentListContext';
+/**
+ * Create the state required to render Attachment.
+ *
+ * The returned state can be modified with hooks such as useAttachmentStyles_unstable,
+ * before being passed to renderAttachment_unstable.
+ *
+ * @param props - props from this instance of Attachment
+ * @param ref - reference to root HTMLElement of Attachment
+ */
+export const useAttachment_unstable = (props, ref) => {
+  const DismissIcon = bundleIcon(Dismiss20Filled, Dismiss20Regular);
+  const onAttachmentDismiss = useAttachmentListContext_unstable(context => context.onAttachmentDismiss);
+  const root = slot.always(getIntrinsicElementProps('div', {
+    ref,
+    ...props
+  }), {
+    elementType: 'div'
+  });
+  const primaryAction = slot.always(props.primaryAction, {
+    elementType: 'button'
+  });
+  const dismissButton = slot.always(props.dismissButton, {
+    defaultProps: {
+      'aria-label': 'Dismiss'
+    },
+    elementType: 'button'
+  });
+  dismissButton.onClick = mergeCallbacks(dismissButton.onClick, ev => onAttachmentDismiss === null || onAttachmentDismiss === void 0 ? void 0 : onAttachmentDismiss(ev, {
+    id: props.id
+  }));
+  const media = slot.optional(props.media, {
+    elementType: 'span'
+  });
+  const content = slot.always(props.content, {
+    defaultProps: {
+      children: props.children
+    },
+    elementType: 'span'
+  });
+  const dismissIcon = slot.always(props.dismissIcon, {
+    defaultProps: {
+      children: /*#__PURE__*/React.createElement(DismissIcon, null)
+    },
+    elementType: 'span'
+  });
+  const state = {
+    components: {
+      root: 'div',
+      primaryAction: 'button',
+      dismissButton: 'button',
+      media: 'span',
+      content: 'span',
+      dismissIcon: 'span'
+    },
+    root,
+    primaryAction,
+    dismissButton,
+    media,
+    content,
+    dismissIcon
+  };
+  if (state.primaryAction.as === 'span') {
+    state.components.primaryAction = 'span';
+  }
+  return state;
+};
+//# sourceMappingURL=useAttachment.js.map

package/lib/components/Attachment/useAttachment.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useAttachment.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, mergeCallbacks, slot } from '@fluentui/react-components';\nimport { Dismiss20Regular, Dismiss20Filled, bundleIcon } from '@fluentui/react-icons';\nimport { useAttachmentListContext_unstable } from '../../contexts/attachmentListContext';\nimport type { AttachmentProps, AttachmentState } from './Attachment.types';\n\n/**\n * Create the state required to render Attachment.\n *\n * The returned state can be modified with hooks such as useAttachmentStyles_unstable,\n * before being passed to renderAttachment_unstable.\n *\n * @param props - props from this instance of Attachment\n * @param ref - reference to root HTMLElement of Attachment\n */\nexport const useAttachment_unstable = (props: AttachmentProps, ref: React.Ref<HTMLDivElement>): AttachmentState => {\n  const DismissIcon = bundleIcon(Dismiss20Filled, Dismiss20Regular);\n\n  const onAttachmentDismiss = useAttachmentListContext_unstable(context => context.onAttachmentDismiss);\n\n  const root = slot.always(\n    getIntrinsicElementProps('div', {\n      ref,\n      ...props,\n    }),\n    { elementType: 'div' },\n  );\n\n  const primaryAction = slot.always(props.primaryAction, {\n    elementType: 'button',\n  });\n\n  const dismissButton = slot.always(props.dismissButton, {\n    defaultProps: { 'aria-label': 'Dismiss' },\n    elementType: 'button',\n  });\n\n  dismissButton.onClick = mergeCallbacks(\n    dismissButton.onClick as React.MouseEventHandler<HTMLAnchorElement | HTMLButtonElement>,\n    (ev: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement>) => onAttachmentDismiss?.(ev, { id: props.id }),\n  );\n\n  const media = slot.optional(props.media, { elementType: 'span' });\n\n  const content = slot.always(props.content, {\n    defaultProps: {\n      children: props.children,\n    },\n    elementType: 'span',\n  });\n\n  const dismissIcon = slot.always(props.dismissIcon, {\n    defaultProps: {\n      children: <DismissIcon />,\n    },\n    elementType: 'span',\n  });\n\n  const state: AttachmentState = {\n    components: {\n      root: 'div',\n      primaryAction: 'button',\n      dismissButton: 'button',\n      media: 'span',\n      content: 'span',\n      dismissIcon: 'span',\n    },\n\n    root,\n    primaryAction,\n    dismissButton,\n    media,\n    content,\n    dismissIcon,\n  };\n\n  if (state.primaryAction.as === 'span') {\n    state.components.primaryAction = 'span';\n  }\n\n  return state;\n};\n"],"names":["React","getIntrinsicElementProps","mergeCallbacks","slot","Dismiss20Regular","Dismiss20Filled","bundleIcon","useAttachmentListContext_unstable","useAttachment_unstable","props","ref","DismissIcon","onAttachmentDismiss","context","root","always","elementType","primaryAction","dismissButton","defaultProps","onClick","ev","id","media","optional","content","children","dismissIcon","state","components","as"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,EAAEC,cAAc,EAAEC,IAAI,QAAQ,6BAA6B;AAC5F,SAASC,gBAAgB,EAAEC,eAAe,EAAEC,UAAU,QAAQ,wBAAwB;AACtF,SAASC,iCAAiC,QAAQ,uCAAuC;AAGzF;;;;;;;;CAQC,GACD,OAAO,MAAMC,yBAAyB,CAACC,OAAwBC;IAC7D,MAAMC,cAAcL,WAAWD,iBAAiBD;IAEhD,MAAMQ,sBAAsBL,kCAAkCM,CAAAA,UAAWA,QAAQD,mBAAmB;IAEpG,MAAME,OAAOX,KAAKY,MAAM,CACtBd,yBAAyB,OAAO;QAC9BS;QACA,GAAGD,KAAK;IACV,IACA;QAAEO,aAAa;IAAM;IAGvB,MAAMC,gBAAgBd,KAAKY,MAAM,CAACN,MAAMQ,aAAa,EAAE;QACrDD,aAAa;IACf;IAEA,MAAME,gBAAgBf,KAAKY,MAAM,CAACN,MAAMS,aAAa,EAAE;QACrDC,cAAc;YAAE,cAAc;QAAU;QACxCH,aAAa;IACf;IAEAE,cAAcE,OAAO,GAAGlB,eACtBgB,cAAcE,OAAO,EACrB,CAACC,KAAgET,gCAAAA,0CAAAA,oBAAsBS,IAAI;YAAEC,IAAIb,MAAMa,EAAE;QAAC;IAG5G,MAAMC,QAAQpB,KAAKqB,QAAQ,CAACf,MAAMc,KAAK,EAAE;QAAEP,aAAa;IAAO;IAE/D,MAAMS,UAAUtB,KAAKY,MAAM,CAACN,MAAMgB,OAAO,EAAE;QACzCN,cAAc;YACZO,UAAUjB,MAAMiB,QAAQ;QAC1B;QACAV,aAAa;IACf;IAEA,MAAMW,cAAcxB,KAAKY,MAAM,CAACN,MAAMkB,WAAW,EAAE;QACjDR,cAAc;YACZO,wBAAU,oBAACf;QACb;QACAK,aAAa;IACf;IAEA,MAAMY,QAAyB;QAC7BC,YAAY;YACVf,MAAM;YACNG,eAAe;YACfC,eAAe;YACfK,OAAO;YACPE,SAAS;YACTE,aAAa;QACf;QAEAb;QACAG;QACAC;QACAK;QACAE;QACAE;IACF;IAEA,IAAIC,MAAMX,aAAa,CAACa,EAAE,KAAK,QAAQ;QACrCF,MAAMC,UAAU,CAACZ,aAAa,GAAG;IACnC;IAEA,OAAOW;AACT,EAAE"}

package/lib/components/Attachment/useAttachmentStyles.js

@@ -0,0 +1,82 @@
+import { createCustomFocusIndicatorStyle, __resetStyles, __styles, mergeClasses, shorthands, tokens, typographyStyles } from '@fluentui/react-components';
+export const attachmentClassNames = {
+  root: 'fai-Attachment',
+  primaryAction: 'fai-Attachment__primaryAction',
+  dismissButton: 'fai-Attachment__dismissButton',
+  media: 'fai-Attachment__media',
+  content: 'fai-Attachment__content',
+  dismissIcon: 'fai-Attachment__dismissIcon'
+};
+const ATTACHMENT_MAXWIDTH = '180px';
+const ATTACHMENT_SIZE = '20px';
+const useRootBaseClassName = __resetStyles("rj3sqpg", null, [".rj3sqpg{display:inline-flex;flex-wrap:nowrap;vertical-align:middle;box-sizing:border-box;width:fit-content;}"]);
+const buttonBaseStyles = {
+  alignItems: 'center',
+  backgroundColor: tokens.colorNeutralBackground1,
+  border: `${tokens.strokeWidthThin} solid ${tokens.colorNeutralStroke1}`,
+  borderRadius: tokens.borderRadiusMedium,
+  boxSizing: 'border-box',
+  columnGap: tokens.spacingHorizontalSNudge,
+  color: tokens.colorNeutralForeground1,
+  cursor: 'pointer',
+  display: 'inline-flex',
+  flexWrap: 'nowrap',
+  justifyContent: 'center',
+  ...createCustomFocusIndicatorStyle({
+    ...shorthands.outline(tokens.strokeWidthThick, 'solid', tokens.colorStrokeFocus2),
+    zIndex: 1
+  }),
+  verticalAlign: 'middle'
+};
+const usePrimaryActionBaseClassName = __resetStyles("rftb5h9", "rofiitm", [".rftb5h9{align-items:center;background-color:var(--colorNeutralBackground1);border:var(--strokeWidthThin) solid var(--colorNeutralStroke1);border-radius:var(--borderRadiusMedium);box-sizing:border-box;column-gap:var(--spacingHorizontalSNudge);color:var(--colorNeutralForeground1);cursor:pointer;display:inline-flex;flex-wrap:nowrap;justify-content:center;vertical-align:middle;border-top-right-radius:var(--borderRadiusNone);border-bottom-right-radius:var(--borderRadiusNone);border-right-style:none;max-width:calc(180px - 20px + var(--strokeWidthThin) * 2 + var(--spacingHorizontalXXS) - var(--spacingHorizontalXS));padding:var(--spacingVerticalXS) var(--spacingHorizontalS) var(--spacingVerticalXS) var(--spacingHorizontalS);}", ".rftb5h9[data-fui-focus-visible]{outline-width:var(--strokeWidthThick);outline-style:solid;outline-color:var(--colorStrokeFocus2);z-index:1;}", ".rofiitm{align-items:center;background-color:var(--colorNeutralBackground1);border:var(--strokeWidthThin) solid var(--colorNeutralStroke1);border-radius:var(--borderRadiusMedium);box-sizing:border-box;column-gap:var(--spacingHorizontalSNudge);color:var(--colorNeutralForeground1);cursor:pointer;display:inline-flex;flex-wrap:nowrap;justify-content:center;vertical-align:middle;border-top-left-radius:var(--borderRadiusNone);border-bottom-left-radius:var(--borderRadiusNone);border-left-style:none;max-width:calc(180px - 20px + var(--strokeWidthThin) * 2 + var(--spacingHorizontalXXS) - var(--spacingHorizontalXS));padding:var(--spacingVerticalXS) var(--spacingHorizontalS) var(--spacingVerticalXS) var(--spacingHorizontalS);}", ".rofiitm[data-fui-focus-visible]{outline-width:var(--strokeWidthThick);outline-style:solid;outline-color:var(--colorStrokeFocus2);z-index:1;}"]);
+const usePrimaryActionStyles = __styles({
+  button: {
+    eoavqd: "f8491dx",
+    Jwef8y: "f1h648pw",
+    Bi91k9c: "fnwyq0v",
+    ecr2s2: "fwdzr64",
+    lj723h: "flvvhsy",
+    Bqrx1nm: "fq7113v",
+    kx9iu6: "fp3oj7s"
+  }
+}, {
+  h: [".f8491dx:hover{cursor:pointer;}", ".f1h648pw:hover{background-color:var(--colorNeutralBackground3Hover);}", ".fnwyq0v:hover{color:var(--colorNeutralForeground2Hover);}"],
+  a: [".fwdzr64:active{background-color:var(--colorNeutralBackground3Pressed);}", ".flvvhsy:active{color:var(--colorNeutralForeground2Pressed);}"],
+  m: [["@media (forced-colors: active){.fq7113v:hover{background-color:HighlightText;}}", {
+    m: "(forced-colors: active)"
+  }], ["@media (forced-colors: active){.fp3oj7s:active{background-color:HighlightText;}}", {
+    m: "(forced-colors: active)"
+  }]]
+});
+const useDismissButtonBaseClassName = __resetStyles("r1cf2ehf", "rhq1520", {
+  r: [".r1cf2ehf{align-items:center;background-color:var(--colorNeutralBackground1);border:var(--strokeWidthThin) solid var(--colorNeutralStroke1);border-radius:var(--borderRadiusMedium);box-sizing:border-box;column-gap:var(--spacingHorizontalSNudge);color:var(--colorNeutralForeground1);cursor:pointer;display:inline-flex;flex-wrap:nowrap;justify-content:center;vertical-align:middle;padding:var(--spacingVerticalXS) var(--spacingHorizontalXS) var(--spacingVerticalXS) var(--spacingHorizontalXS);max-width:calc(20px + var(--strokeWidthThin) * 2 + var(--spacingHorizontalXXS))+var(--spacingHorizontalXS);min-width:calc(20px + var(--strokeWidthThin) * 2 + var(--spacingHorizontalXXS))+var(--spacingHorizontalXS);border-left-color:var(--colorNeutralStroke1);border-top-left-radius:var(--borderRadiusNone);border-bottom-left-radius:var(--borderRadiusNone);border-top-right-radius:var(--borderRadiusMedium);border-bottom-right-radius:var(--borderRadiusMedium);}", ".r1cf2ehf[data-fui-focus-visible]{outline-width:var(--strokeWidthThick);outline-style:solid;outline-color:var(--colorStrokeFocus2);z-index:1;}", ".r1cf2ehf:hover{cursor:pointer;background-color:var(--colorNeutralBackground3Hover);color:var(--colorNeutralForeground2BrandHover);}", ".r1cf2ehf:hover .fai-Attachment__dismissIcon{color:var(--colorBrandForegroundLinkHover);}", ".r1cf2ehf:active{background-color:var(--colorNeutralBackground3Pressed);color:var(--colorNeutralForeground2BrandPressed);}", ".r1cf2ehf:focus .fai-Attachment__dismissIcon{color:var(--colorNeutralForeground2BrandHover);}", ".rhq1520{align-items:center;background-color:var(--colorNeutralBackground1);border:var(--strokeWidthThin) solid var(--colorNeutralStroke1);border-radius:var(--borderRadiusMedium);box-sizing:border-box;column-gap:var(--spacingHorizontalSNudge);color:var(--colorNeutralForeground1);cursor:pointer;display:inline-flex;flex-wrap:nowrap;justify-content:center;vertical-align:middle;padding:var(--spacingVerticalXS) var(--spacingHorizontalXS) var(--spacingVerticalXS) var(--spacingHorizontalXS);max-width:calc(20px + var(--strokeWidthThin) * 2 + var(--spacingHorizontalXXS))+var(--spacingHorizontalXS);min-width:calc(20px + var(--strokeWidthThin) * 2 + var(--spacingHorizontalXXS))+var(--spacingHorizontalXS);border-right-color:var(--colorNeutralStroke1);border-top-right-radius:var(--borderRadiusNone);border-bottom-right-radius:var(--borderRadiusNone);border-top-left-radius:var(--borderRadiusMedium);border-bottom-left-radius:var(--borderRadiusMedium);}", ".rhq1520[data-fui-focus-visible]{outline-width:var(--strokeWidthThick);outline-style:solid;outline-color:var(--colorStrokeFocus2);z-index:1;}", ".rhq1520:hover{cursor:pointer;background-color:var(--colorNeutralBackground3Hover);color:var(--colorNeutralForeground2BrandHover);}", ".rhq1520:hover .fai-Attachment__dismissIcon{color:var(--colorBrandForegroundLinkHover);}", ".rhq1520:active{background-color:var(--colorNeutralBackground3Pressed);color:var(--colorNeutralForeground2BrandPressed);}", ".rhq1520:focus .fai-Attachment__dismissIcon{color:var(--colorNeutralForeground2BrandHover);}"],
+  s: ["@media (forced-colors: active){.r1cf2ehf:hover{background-color:HighlightText;}.r1cf2ehf:active{background-color:HighlightText;}}", "@media (forced-colors: active){.rhq1520:hover{background-color:HighlightText;}.rhq1520:active{background-color:HighlightText;}}"]
+});
+const useMediaBaseClassName = __resetStyles("rz1lum2", null, [".rz1lum2{display:inline-flex;font-size:20px;height:20px;line-height:20px;width:20px;}"]);
+const useContentBaseClassName = __resetStyles("rmt99gk", null, [".rmt99gk{overflow-x:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase300);font-weight:var(--fontWeightRegular);line-height:var(--lineHeightBase300);}"]);
+const useDismissIconBaseClassName = __resetStyles("r176grtk", null, [".r176grtk{align-items:center;border-radius:var(--borderRadiusCircular);border:var(--strokeWidthThin) solid var(--colorTransparentStroke);box-sizing:border-box;color:var(--colorNeutralForeground1);display:inline-flex;font-size:20px;height:calc(20px + var(--strokeWidthThin) * 2 + var(--spacingVerticalXXS));justify-content:center;max-width:calc(20px + var(--strokeWidthThin) * 2 + var(--spacingHorizontalXXS));min-width:calc(20px + var(--strokeWidthThin) * 2 + var(--spacingHorizontalXXS));padding:calc(var(--spacingVerticalXXS) / 2) calc(var(--spacingHorizontalXXS) / 2);}"]);
+/**
+ * Apply styling to the Attachment slots based on the state
+ */
+export const useAttachmentStyles_unstable = state => {
+  const rootBaseClassName = useRootBaseClassName();
+  const primaryActionBaseClassName = usePrimaryActionBaseClassName();
+  const dismissButtonBaseClassName = useDismissButtonBaseClassName();
+  const mediaBaseClassName = useMediaBaseClassName();
+  const contentBaseClassName = useContentBaseClassName();
+  const dismissIconBaseClassName = useDismissIconBaseClassName();
+  const primaryActionStyles = usePrimaryActionStyles();
+  const {
+    primaryAction
+  } = state;
+  state.root.className = mergeClasses(attachmentClassNames.root, rootBaseClassName, state.root.className);
+  state.primaryAction.className = mergeClasses(attachmentClassNames.primaryAction, primaryActionBaseClassName, primaryAction.as !== 'span' && primaryActionStyles.button, state.primaryAction.className);
+  state.dismissButton.className = mergeClasses(attachmentClassNames.dismissButton, dismissButtonBaseClassName, state.dismissButton.className);
+  if (state.media) {
+    state.media.className = mergeClasses(attachmentClassNames.media, mediaBaseClassName, state.media.className);
+  }
+  state.content.className = mergeClasses(attachmentClassNames.content, contentBaseClassName, state.content.className);
+  state.dismissIcon.className = mergeClasses(attachmentClassNames.dismissIcon, dismissIconBaseClassName, state.dismissIcon.className);
+  return state;
+};
+//# sourceMappingURL=useAttachmentStyles.js.map

package/lib/components/Attachment/useAttachmentStyles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useAttachmentStyles.ts"],"sourcesContent":["import {\n  createCustomFocusIndicatorStyle,\n  makeResetStyles,\n  makeStyles,\n  mergeClasses,\n  shorthands,\n  tokens,\n  typographyStyles,\n} from '@fluentui/react-components';\nimport type { AttachmentSlots, AttachmentState } from './Attachment.types';\nimport type { GriffelResetStyle, SlotClassNames } from '@fluentui/react-components';\n\nexport const attachmentClassNames: SlotClassNames<AttachmentSlots> = {\n  root: 'fai-Attachment',\n  primaryAction: 'fai-Attachment__primaryAction',\n  dismissButton: 'fai-Attachment__dismissButton',\n  media: 'fai-Attachment__media',\n  content: 'fai-Attachment__content',\n  dismissIcon: 'fai-Attachment__dismissIcon',\n};\n\nconst ATTACHMENT_MAXWIDTH = '180px';\nconst ATTACHMENT_SIZE = '20px';\n\nconst useRootBaseClassName = makeResetStyles({\n  display: 'inline-flex',\n  flexWrap: 'nowrap',\n  verticalAlign: 'middle',\n  boxSizing: 'border-box',\n  width: 'fit-content',\n});\n\nconst buttonBaseStyles: GriffelResetStyle = {\n  alignItems: 'center',\n  backgroundColor: tokens.colorNeutralBackground1,\n  border: `${tokens.strokeWidthThin} solid ${tokens.colorNeutralStroke1}`,\n  borderRadius: tokens.borderRadiusMedium,\n  boxSizing: 'border-box',\n  columnGap: tokens.spacingHorizontalSNudge,\n  color: tokens.colorNeutralForeground1,\n  cursor: 'pointer',\n  display: 'inline-flex',\n  flexWrap: 'nowrap',\n  justifyContent: 'center',\n  ...createCustomFocusIndicatorStyle({\n    ...shorthands.outline(tokens.strokeWidthThick, 'solid', tokens.colorStrokeFocus2),\n    zIndex: 1,\n  }),\n  verticalAlign: 'middle',\n};\n\nconst usePrimaryActionBaseClassName = makeResetStyles({\n  ...buttonBaseStyles,\n  borderTopRightRadius: tokens.borderRadiusNone,\n  borderBottomRightRadius: tokens.borderRadiusNone,\n  borderRightStyle: 'none',\n  maxWidth: `calc(${ATTACHMENT_MAXWIDTH} - ${ATTACHMENT_SIZE} + ${tokens.strokeWidthThin} * 2 + ${tokens.spacingHorizontalXXS} - ${tokens.spacingHorizontalXS})`,\n  padding: `${tokens.spacingVerticalXS} ${tokens.spacingHorizontalS} ${tokens.spacingVerticalXS} ${tokens.spacingHorizontalS}`,\n});\n\nconst usePrimaryActionStyles = makeStyles({\n  button: {\n    ':hover': {\n      cursor: 'pointer',\n      backgroundColor: tokens.colorNeutralBackground3Hover,\n      color: tokens.colorNeutralForeground2Hover,\n    },\n    ':active': {\n      backgroundColor: tokens.colorNeutralBackground3Pressed,\n      color: tokens.colorNeutralForeground2Pressed,\n    },\n    '@media (forced-colors: active)': {\n      ':hover': {\n        backgroundColor: 'HighlightText',\n      },\n      ':active': {\n        backgroundColor: 'HighlightText',\n      },\n    },\n  },\n});\n\nconst useDismissButtonBaseClassName = makeResetStyles({\n  ...buttonBaseStyles,\n\n  padding: `${tokens.spacingVerticalXS} ${tokens.spacingHorizontalXS} ${tokens.spacingVerticalXS} ${tokens.spacingHorizontalXS}`,\n  maxWidth: `calc(${ATTACHMENT_SIZE} + ${tokens.strokeWidthThin} * 2 + ${tokens.spacingHorizontalXXS}) + ${tokens.spacingHorizontalXS}`,\n  minWidth: `calc(${ATTACHMENT_SIZE} + ${tokens.strokeWidthThin} * 2 + ${tokens.spacingHorizontalXXS}) + ${tokens.spacingHorizontalXS}`,\n\n  // divider:\n  borderLeftColor: tokens.colorNeutralStroke1,\n  borderTopLeftRadius: tokens.borderRadiusNone,\n  borderBottomLeftRadius: tokens.borderRadiusNone,\n\n  borderTopRightRadius: tokens.borderRadiusMedium,\n  borderBottomRightRadius: tokens.borderRadiusMedium,\n\n  ':hover': {\n    cursor: 'pointer',\n    backgroundColor: tokens.colorNeutralBackground3Hover,\n    color: tokens.colorNeutralForeground2BrandHover,\n    [`& .${attachmentClassNames.dismissIcon}`]: {\n      color: tokens.colorBrandForegroundLinkHover,\n    },\n  },\n  ':active': {\n    backgroundColor: tokens.colorNeutralBackground3Pressed,\n    color: tokens.colorNeutralForeground2BrandPressed,\n  },\n  ':focus': {\n    [`& .${attachmentClassNames.dismissIcon}`]: {\n      color: tokens.colorNeutralForeground2BrandHover,\n    },\n  },\n  '@media (forced-colors: active)': {\n    ':hover': {\n      backgroundColor: 'HighlightText',\n    },\n    ':active': {\n      backgroundColor: 'HighlightText',\n    },\n  },\n});\n\nconst useMediaBaseClassName = makeResetStyles({\n  display: 'inline-flex',\n  fontSize: ATTACHMENT_SIZE,\n  height: ATTACHMENT_SIZE,\n  lineHeight: ATTACHMENT_SIZE,\n  width: ATTACHMENT_SIZE,\n});\n\nconst useContentBaseClassName = makeResetStyles({\n  overflowX: 'hidden',\n  textOverflow: 'ellipsis',\n  whiteSpace: 'nowrap',\n  ...typographyStyles.body1,\n});\n\nconst useDismissIconBaseClassName = makeResetStyles({\n  alignItems: 'center',\n  borderRadius: tokens.borderRadiusCircular,\n  border: `${tokens.strokeWidthThin} solid ${tokens.colorTransparentStroke}`,\n  boxSizing: 'border-box',\n  color: tokens.colorNeutralForeground1,\n  display: 'inline-flex',\n  fontSize: ATTACHMENT_SIZE,\n  height: `calc(${ATTACHMENT_SIZE} + ${tokens.strokeWidthThin} * 2 + ${tokens.spacingVerticalXXS})`,\n  justifyContent: 'center',\n  maxWidth: `calc(${ATTACHMENT_SIZE} + ${tokens.strokeWidthThin} * 2 + ${tokens.spacingHorizontalXXS})`,\n  minWidth: `calc(${ATTACHMENT_SIZE} + ${tokens.strokeWidthThin} * 2 + ${tokens.spacingHorizontalXXS})`,\n  padding: `calc(${tokens.spacingVerticalXXS} / 2) calc(${tokens.spacingHorizontalXXS} / 2)`,\n});\n\n/**\n * Apply styling to the Attachment slots based on the state\n */\nexport const useAttachmentStyles_unstable = (state: AttachmentState): AttachmentState => {\n  const rootBaseClassName = useRootBaseClassName();\n  const primaryActionBaseClassName = usePrimaryActionBaseClassName();\n  const dismissButtonBaseClassName = useDismissButtonBaseClassName();\n  const mediaBaseClassName = useMediaBaseClassName();\n  const contentBaseClassName = useContentBaseClassName();\n  const dismissIconBaseClassName = useDismissIconBaseClassName();\n  const primaryActionStyles = usePrimaryActionStyles();\n  const { primaryAction } = state;\n\n  state.root.className = mergeClasses(attachmentClassNames.root, rootBaseClassName, state.root.className);\n  state.primaryAction.className = mergeClasses(\n    attachmentClassNames.primaryAction,\n    primaryActionBaseClassName,\n    primaryAction.as !== 'span' && primaryActionStyles.button,\n    state.primaryAction.className,\n  );\n  state.dismissButton.className = mergeClasses(\n    attachmentClassNames.dismissButton,\n    dismissButtonBaseClassName,\n    state.dismissButton.className,\n  );\n  if (state.media) {\n    state.media.className = mergeClasses(attachmentClassNames.media, mediaBaseClassName, state.media.className);\n  }\n  state.content.className = mergeClasses(attachmentClassNames.content, contentBaseClassName, state.content.className);\n  state.dismissIcon.className = mergeClasses(\n    attachmentClassNames.dismissIcon,\n    dismissIconBaseClassName,\n    state.dismissIcon.className,\n  );\n\n  return state;\n};\n"],"names":["createCustomFocusIndicatorStyle","makeResetStyles","makeStyles","mergeClasses","shorthands","tokens","typographyStyles","attachmentClassNames","root","primaryAction","dismissButton","media","content","dismissIcon","ATTACHMENT_MAXWIDTH","ATTACHMENT_SIZE","useRootBaseClassName","display","flexWrap","verticalAlign","boxSizing","width","buttonBaseStyles","alignItems","backgroundColor","colorNeutralBackground1","border","strokeWidthThin","colorNeutralStroke1","borderRadius","borderRadiusMedium","columnGap","spacingHorizontalSNudge","color","colorNeutralForeground1","cursor","justifyContent","outline","strokeWidthThick","colorStrokeFocus2","zIndex","usePrimaryActionBaseClassName","borderTopRightRadius","borderRadiusNone","borderBottomRightRadius","borderRightStyle","maxWidth","spacingHorizontalXXS","spacingHorizontalXS","padding","spacingVerticalXS","spacingHorizontalS","usePrimaryActionStyles","button","colorNeutralBackground3Hover","colorNeutralForeground2Hover","colorNeutralBackground3Pressed","colorNeutralForeground2Pressed","useDismissButtonBaseClassName","minWidth","borderLeftColor","borderTopLeftRadius","borderBottomLeftRadius","colorNeutralForeground2BrandHover","colorBrandForegroundLinkHover","colorNeutralForeground2BrandPressed","useMediaBaseClassName","fontSize","height","lineHeight","useContentBaseClassName","overflowX","textOverflow","whiteSpace","body1","useDismissIconBaseClassName","borderRadiusCircular","colorTransparentStroke","spacingVerticalXXS","useAttachmentStyles_unstable","state","rootBaseClassName","primaryActionBaseClassName","dismissButtonBaseClassName","mediaBaseClassName","contentBaseClassName","dismissIconBaseClassName","primaryActionStyles","className","as"],"mappings":"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"}

package/lib/components/AttachmentList/AttachmentList.js

@@ -0,0 +1,13 @@
+import * as React from 'react';
+import { useAttachmentList_unstable } from './useAttachmentList';
+import { renderAttachmentList_unstable } from './renderAttachmentList';
+import { useAttachmentListStyles_unstable } from './useAttachmentListStyles';
+import { useAttachmentListContextValues_unstable } from './useAttachmentListContextValues';
+export const AttachmentList = /*#__PURE__*/React.forwardRef((props, ref) => {
+  const state = useAttachmentList_unstable(props, ref);
+  const contextValues = useAttachmentListContextValues_unstable(state);
+  useAttachmentListStyles_unstable(state);
+  return renderAttachmentList_unstable(state, contextValues);
+});
+AttachmentList.displayName = 'AttachmentList';
+//# sourceMappingURL=AttachmentList.js.map

package/lib/components/AttachmentList/AttachmentList.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["AttachmentList.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useAttachmentList_unstable } from './useAttachmentList';\nimport { renderAttachmentList_unstable } from './renderAttachmentList';\nimport { useAttachmentListStyles_unstable } from './useAttachmentListStyles';\nimport { useAttachmentListContextValues_unstable } from './useAttachmentListContextValues';\nimport type { AttachmentListProps } from './AttachmentList.types';\nimport type { ForwardRefComponent } from '@fluentui/react-components';\n\nexport const AttachmentList: ForwardRefComponent<AttachmentListProps> = React.forwardRef((props, ref) => {\n  const state = useAttachmentList_unstable(props, ref);\n  const contextValues = useAttachmentListContextValues_unstable(state);\n\n  useAttachmentListStyles_unstable(state);\n\n  return renderAttachmentList_unstable(state, contextValues);\n});\n\nAttachmentList.displayName = 'AttachmentList';\n"],"names":["React","useAttachmentList_unstable","renderAttachmentList_unstable","useAttachmentListStyles_unstable","useAttachmentListContextValues_unstable","AttachmentList","forwardRef","props","ref","state","contextValues","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,0BAA0B,QAAQ,sBAAsB;AACjE,SAASC,6BAA6B,QAAQ,yBAAyB;AACvE,SAASC,gCAAgC,QAAQ,4BAA4B;AAC7E,SAASC,uCAAuC,QAAQ,mCAAmC;AAI3F,OAAO,MAAMC,+BAA2DL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IAC/F,MAAMC,QAAQR,2BAA2BM,OAAOC;IAChD,MAAME,gBAAgBN,wCAAwCK;IAE9DN,iCAAiCM;IAEjC,OAAOP,8BAA8BO,OAAOC;AAC9C,GAAG;AAEHL,eAAeM,WAAW,GAAG"}

package/lib/components/AttachmentList/AttachmentList.types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=AttachmentList.types.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["AttachmentList.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-components';\nimport type { AttachmentListContextValue } from '../../contexts/attachmentListContext';\n\nexport type AttachmentListSlots = {\n  root: Slot<'div'>;\n};\n\nexport type AttachmentDismissedData = {\n  id: string;\n};\n\n/**\n * AttachmentList Props\n */\nexport type AttachmentListProps = ComponentProps<Partial<AttachmentListSlots>> & {\n  onAttachmentDismiss?: (\n    e: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement>,\n    data: AttachmentDismissedData,\n  ) => void;\n};\n\n/**\n * State used in rendering AttachmentList\n */\nexport type AttachmentListState = ComponentState<AttachmentListSlots> &\n  Pick<AttachmentListProps, 'onAttachmentDismiss'>;\n\nexport type AttachmentListContextValues = {\n  attachmentList: AttachmentListContextValue;\n};\n"],"names":[],"mappings":"AAAA,WA6BE"}

package/lib/components/AttachmentList/index.js

@@ -0,0 +1,6 @@
+export * from './AttachmentList';
+export * from './AttachmentList.types';
+export * from './renderAttachmentList';
+export * from './useAttachmentList';
+export * from './useAttachmentListStyles';
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './AttachmentList';\nexport * from './AttachmentList.types';\nexport * from './renderAttachmentList';\nexport * from './useAttachmentList';\nexport * from './useAttachmentListStyles';\n"],"names":[],"mappings":"AAAA,cAAc,mBAAmB;AACjC,cAAc,yBAAyB;AACvC,cAAc,yBAAyB;AACvC,cAAc,sBAAsB;AACpC,cAAc,4BAA4B"}

package/lib/components/AttachmentList/renderAttachmentList.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx } from "@fluentui/react-jsx-runtime/jsx-runtime";
+import { assertSlots } from '@fluentui/react-components';
+import { AttachmentListProvider } from '../../contexts/attachmentListContext';
+/**
+ * Render the final JSX of AttachmentList
+ */
+export const renderAttachmentList_unstable = (state, contextValues) => {
+  assertSlots(state);
+  return /*#__PURE__*/_jsx(AttachmentListProvider, {
+    value: contextValues.attachmentList,
+    children: /*#__PURE__*/_jsx(state.root, {})
+  });
+};
+//# sourceMappingURL=renderAttachmentList.js.map

package/lib/components/AttachmentList/renderAttachmentList.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["renderAttachmentList.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-components';\nimport { AttachmentListProvider } from '../../contexts/attachmentListContext';\nimport type { AttachmentListState, AttachmentListSlots, AttachmentListContextValues } from './AttachmentList.types';\n\n/**\n * Render the final JSX of AttachmentList\n */\nexport const renderAttachmentList_unstable = (\n  state: AttachmentListState,\n  contextValues: AttachmentListContextValues,\n) => {\n  assertSlots<AttachmentListSlots>(state);\n\n  return (\n    <AttachmentListProvider value={contextValues.attachmentList}>\n      <state.root />\n    </AttachmentListProvider>\n  );\n};\n"],"names":["assertSlots","AttachmentListProvider","renderAttachmentList_unstable","state","contextValues","value","attachmentList","root"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,6BAA6B;AACzD,SAASC,sBAAsB,QAAQ,uCAAuC;AAG9E;;CAEC,GACD,OAAO,MAAMC,gCAAgC,CAC3CC,OACAC;IAEAJ,YAAiCG;IAEjC,qBACE,KAACF;QAAuBI,OAAOD,cAAcE,cAAc;kBACzD,cAAA,KAACH,MAAMI,IAAI;;AAGjB,EAAE"}