@fluentui/react-migration-v0-v9 9.5.0 → 9.6.0

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.
Files changed (145) hide show
  1. package/CHANGELOG.md +17 -2
  2. package/dist/index.d.ts +4 -2
  3. package/lib/components/Attachment/Attachment.js.map +1 -1
  4. package/lib/components/Attachment/Attachment.styles.raw.js.map +1 -1
  5. package/lib/components/Attachment/AttachmentAction.js.map +1 -1
  6. package/lib/components/Attachment/AttachmentAction.styles.raw.js.map +1 -1
  7. package/lib/components/Attachment/AttachmentBody.js.map +1 -1
  8. package/lib/components/Attachment/AttachmentBody.styles.raw.js.map +1 -1
  9. package/lib/components/Attachment/AttachmentDescription.js.map +1 -1
  10. package/lib/components/Attachment/AttachmentDescription.styles.raw.js.map +1 -1
  11. package/lib/components/Attachment/AttachmentHeader.js.map +1 -1
  12. package/lib/components/Attachment/AttachmentHeader.styles.raw.js.map +1 -1
  13. package/lib/components/Attachment/AttachmentIcon.js.map +1 -1
  14. package/lib/components/Attachment/AttachmentIcon.styles.raw.js.map +1 -1
  15. package/lib/components/Attachment/index.js.map +1 -1
  16. package/lib/components/Button/ButtonMigration.mixins.js.map +1 -1
  17. package/lib/components/Button/index.js.map +1 -1
  18. package/lib/components/Flex/Flex.js.map +1 -1
  19. package/lib/components/Flex/Flex.styles.raw.js.map +1 -1
  20. package/lib/components/Flex/FlexItem.mixins.js.map +1 -1
  21. package/lib/components/Flex/index.js.map +1 -1
  22. package/lib/components/FormField/FormFieldShim.js.map +1 -1
  23. package/lib/components/FormField/index.js.map +1 -1
  24. package/lib/components/Grid/Grid.mixins.js.map +1 -1
  25. package/lib/components/Grid/Grid.styles.raw.js.map +1 -1
  26. package/lib/components/Grid/GridShim.js.map +1 -1
  27. package/lib/components/Grid/index.js.map +1 -1
  28. package/lib/components/Input/Input.mixins.js.map +1 -1
  29. package/lib/components/Input/index.js.map +1 -1
  30. package/lib/components/ItemLayout/ItemLayout.js.map +1 -1
  31. package/lib/components/ItemLayout/ItemLayout.styles.raw.js.map +1 -1
  32. package/lib/components/ItemLayout/index.js.map +1 -1
  33. package/lib/components/List/List/List.js.map +1 -1
  34. package/lib/components/List/List/List.types.js.map +1 -1
  35. package/lib/components/List/List/index.js.map +1 -1
  36. package/lib/components/List/List/listContext.js.map +1 -1
  37. package/lib/components/List/List/renderList.js.map +1 -1
  38. package/lib/components/List/List/useList.js.map +1 -1
  39. package/lib/components/List/List/useListContextValues.js.map +1 -1
  40. package/lib/components/List/List/useListStyles.styles.raw.js.map +1 -1
  41. package/lib/components/List/ListItem/ListItem.js.map +1 -1
  42. package/lib/components/List/ListItem/ListItem.types.js.map +1 -1
  43. package/lib/components/List/ListItem/index.js.map +1 -1
  44. package/lib/components/List/ListItem/renderListItem.js.map +1 -1
  45. package/lib/components/List/ListItem/useListItem.js.map +1 -1
  46. package/lib/components/List/ListItem/useListItemStyles.styles.raw.js.map +1 -1
  47. package/lib/components/List/hooks/index.js.map +1 -1
  48. package/lib/components/List/hooks/types.js.map +1 -1
  49. package/lib/components/List/hooks/useListSelection.js.map +1 -1
  50. package/lib/components/List/index.js.map +1 -1
  51. package/lib/components/Primitive/Primitive.js.map +1 -1
  52. package/lib/components/Primitive/index.js.map +1 -1
  53. package/lib/components/Segment/Segment.js.map +1 -1
  54. package/lib/components/Segment/Segment.styles.raw.js.map +1 -1
  55. package/lib/components/Segment/index.js.map +1 -1
  56. package/lib/components/Slider/Slider.mixins.js.map +1 -1
  57. package/lib/components/Slider/index.js.map +1 -1
  58. package/lib/components/Spinner/SpinnerMigration.mixins.js.map +1 -1
  59. package/lib/components/Spinner/index.js.map +1 -1
  60. package/lib/components/StyledText/StyledText.js.map +1 -1
  61. package/lib/components/StyledText/StyledText.styles.raw.js.map +1 -1
  62. package/lib/components/StyledText/index.js.map +1 -1
  63. package/lib/components/Video/Video.js.map +1 -1
  64. package/lib/components/Video/Video.styles.raw.js.map +1 -1
  65. package/lib/components/Video/index.js.map +1 -1
  66. package/lib/index.js.map +1 -1
  67. package/lib-commonjs/components/Attachment/Attachment.js.map +1 -1
  68. package/lib-commonjs/components/Attachment/Attachment.styles.js.map +1 -1
  69. package/lib-commonjs/components/Attachment/Attachment.styles.raw.js.map +1 -1
  70. package/lib-commonjs/components/Attachment/AttachmentAction.js.map +1 -1
  71. package/lib-commonjs/components/Attachment/AttachmentAction.styles.js.map +1 -1
  72. package/lib-commonjs/components/Attachment/AttachmentAction.styles.raw.js.map +1 -1
  73. package/lib-commonjs/components/Attachment/AttachmentBody.js.map +1 -1
  74. package/lib-commonjs/components/Attachment/AttachmentBody.styles.js.map +1 -1
  75. package/lib-commonjs/components/Attachment/AttachmentBody.styles.raw.js.map +1 -1
  76. package/lib-commonjs/components/Attachment/AttachmentDescription.js.map +1 -1
  77. package/lib-commonjs/components/Attachment/AttachmentDescription.styles.js.map +1 -1
  78. package/lib-commonjs/components/Attachment/AttachmentDescription.styles.raw.js.map +1 -1
  79. package/lib-commonjs/components/Attachment/AttachmentHeader.js.map +1 -1
  80. package/lib-commonjs/components/Attachment/AttachmentHeader.styles.js.map +1 -1
  81. package/lib-commonjs/components/Attachment/AttachmentHeader.styles.raw.js.map +1 -1
  82. package/lib-commonjs/components/Attachment/AttachmentIcon.js.map +1 -1
  83. package/lib-commonjs/components/Attachment/AttachmentIcon.styles.js.map +1 -1
  84. package/lib-commonjs/components/Attachment/AttachmentIcon.styles.raw.js.map +1 -1
  85. package/lib-commonjs/components/Attachment/index.js.map +1 -1
  86. package/lib-commonjs/components/Button/ButtonMigration.mixins.js.map +1 -1
  87. package/lib-commonjs/components/Button/index.js.map +1 -1
  88. package/lib-commonjs/components/Flex/Flex.js.map +1 -1
  89. package/lib-commonjs/components/Flex/Flex.styles.js.map +1 -1
  90. package/lib-commonjs/components/Flex/Flex.styles.raw.js.map +1 -1
  91. package/lib-commonjs/components/Flex/FlexItem.mixins.js.map +1 -1
  92. package/lib-commonjs/components/Flex/index.js.map +1 -1
  93. package/lib-commonjs/components/FormField/FormFieldShim.js.map +1 -1
  94. package/lib-commonjs/components/FormField/index.js.map +1 -1
  95. package/lib-commonjs/components/Grid/Grid.mixins.js.map +1 -1
  96. package/lib-commonjs/components/Grid/Grid.styles.js.map +1 -1
  97. package/lib-commonjs/components/Grid/Grid.styles.raw.js.map +1 -1
  98. package/lib-commonjs/components/Grid/GridShim.js.map +1 -1
  99. package/lib-commonjs/components/Grid/index.js.map +1 -1
  100. package/lib-commonjs/components/Input/Input.mixins.js.map +1 -1
  101. package/lib-commonjs/components/Input/index.js.map +1 -1
  102. package/lib-commonjs/components/ItemLayout/ItemLayout.js.map +1 -1
  103. package/lib-commonjs/components/ItemLayout/ItemLayout.styles.js.map +1 -1
  104. package/lib-commonjs/components/ItemLayout/ItemLayout.styles.raw.js.map +1 -1
  105. package/lib-commonjs/components/ItemLayout/index.js.map +1 -1
  106. package/lib-commonjs/components/List/List/List.js.map +1 -1
  107. package/lib-commonjs/components/List/List/List.types.js.map +1 -1
  108. package/lib-commonjs/components/List/List/index.js.map +1 -1
  109. package/lib-commonjs/components/List/List/listContext.js.map +1 -1
  110. package/lib-commonjs/components/List/List/renderList.js.map +1 -1
  111. package/lib-commonjs/components/List/List/useList.js.map +1 -1
  112. package/lib-commonjs/components/List/List/useListContextValues.js.map +1 -1
  113. package/lib-commonjs/components/List/List/useListStyles.styles.js.map +1 -1
  114. package/lib-commonjs/components/List/List/useListStyles.styles.raw.js.map +1 -1
  115. package/lib-commonjs/components/List/ListItem/ListItem.js.map +1 -1
  116. package/lib-commonjs/components/List/ListItem/ListItem.types.js.map +1 -1
  117. package/lib-commonjs/components/List/ListItem/index.js.map +1 -1
  118. package/lib-commonjs/components/List/ListItem/renderListItem.js.map +1 -1
  119. package/lib-commonjs/components/List/ListItem/useListItem.js.map +1 -1
  120. package/lib-commonjs/components/List/ListItem/useListItemStyles.styles.js.map +1 -1
  121. package/lib-commonjs/components/List/ListItem/useListItemStyles.styles.raw.js.map +1 -1
  122. package/lib-commonjs/components/List/hooks/index.js.map +1 -1
  123. package/lib-commonjs/components/List/hooks/types.js.map +1 -1
  124. package/lib-commonjs/components/List/hooks/useListSelection.js.map +1 -1
  125. package/lib-commonjs/components/List/index.js.map +1 -1
  126. package/lib-commonjs/components/Primitive/Primitive.js.map +1 -1
  127. package/lib-commonjs/components/Primitive/index.js.map +1 -1
  128. package/lib-commonjs/components/Segment/Segment.js.map +1 -1
  129. package/lib-commonjs/components/Segment/Segment.styles.js.map +1 -1
  130. package/lib-commonjs/components/Segment/Segment.styles.raw.js.map +1 -1
  131. package/lib-commonjs/components/Segment/index.js.map +1 -1
  132. package/lib-commonjs/components/Slider/Slider.mixins.js.map +1 -1
  133. package/lib-commonjs/components/Slider/index.js.map +1 -1
  134. package/lib-commonjs/components/Spinner/SpinnerMigration.mixins.js.map +1 -1
  135. package/lib-commonjs/components/Spinner/index.js.map +1 -1
  136. package/lib-commonjs/components/StyledText/StyledText.js.map +1 -1
  137. package/lib-commonjs/components/StyledText/StyledText.styles.js.map +1 -1
  138. package/lib-commonjs/components/StyledText/StyledText.styles.raw.js.map +1 -1
  139. package/lib-commonjs/components/StyledText/index.js.map +1 -1
  140. package/lib-commonjs/components/Video/Video.js.map +1 -1
  141. package/lib-commonjs/components/Video/Video.styles.js.map +1 -1
  142. package/lib-commonjs/components/Video/Video.styles.raw.js.map +1 -1
  143. package/lib-commonjs/components/Video/index.js.map +1 -1
  144. package/lib-commonjs/index.js.map +1 -1
  145. package/package.json +7 -7
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/List/List/useList.ts"],"sourcesContent":["import * as React from 'react';\nimport {\n getIntrinsicElementProps,\n OnSelectionChangeData,\n slot,\n useControllableState,\n useEventCallback,\n} from '@fluentui/react-utilities';\nimport { useArrowNavigationGroup } from '@fluentui/react-tabster';\nimport { ListProps, ListState } from './List.types';\nimport { useListSelection } from '../hooks/useListSelection';\n\nconst DEFAULT_ROOT_EL_TYPE = 'ul';\n\n/**\n * Create the state required to render List.\n *\n * The returned state can be modified with hooks such as useListStyles_unstable,\n * before being passed to renderList_unstable.\n *\n * @param props - props from this instance of List\n * @param ref - reference to root HTMLElement of List\n */\nexport const useList_unstable = (props: ListProps, ref: React.Ref<HTMLDivElement | HTMLUListElement>): ListState => {\n const {\n layout = 'vertical',\n navigable = false,\n selectable = false,\n selectionMode = 'single',\n selectedItems,\n defaultSelectedItems,\n as,\n onSelectionChange,\n truncateContent = false,\n truncateHeader = false,\n } = props;\n\n const arrowNavigationAttributes = useArrowNavigationGroup({\n axis: layout === 'grid' ? 'grid-linear' : 'both',\n memorizeCurrent: true,\n });\n\n const [selectionState, setSelectionState] = useControllableState({\n state: selectedItems,\n defaultState: defaultSelectedItems,\n initialState: [],\n });\n\n const onChange = useEventCallback((e: React.SyntheticEvent, data: OnSelectionChangeData) => {\n const selectedItemsAsArray = Array.from(data.selectedItems);\n setSelectionState(selectedItemsAsArray);\n onSelectionChange?.(e, { selectedItems: selectedItemsAsArray });\n });\n\n const selection = useListSelection({\n onSelectionChange: onChange,\n selectionMode,\n selectedItems: selectionState,\n defaultSelectedItems,\n });\n\n return {\n components: {\n root: DEFAULT_ROOT_EL_TYPE,\n },\n root: slot.always(\n getIntrinsicElementProps(DEFAULT_ROOT_EL_TYPE, {\n ref,\n ...(navigable && { role: 'menu' }),\n ...(selectable && {\n role: 'listbox',\n 'aria-multiselectable': selectionMode === 'multiselect' ? true : undefined,\n }),\n ...arrowNavigationAttributes,\n ...props,\n }),\n { elementType: DEFAULT_ROOT_EL_TYPE },\n ),\n layout,\n // context:\n navigable,\n as: as || DEFAULT_ROOT_EL_TYPE,\n truncateContent,\n truncateHeader,\n // only pass down selection state if its handled internally, otherwise just report the events\n selection: selectable ? selection : undefined,\n };\n};\n"],"names":["React","getIntrinsicElementProps","slot","useControllableState","useEventCallback","useArrowNavigationGroup","useListSelection","DEFAULT_ROOT_EL_TYPE","useList_unstable","props","ref","layout","navigable","selectable","selectionMode","selectedItems","defaultSelectedItems","as","onSelectionChange","truncateContent","truncateHeader","arrowNavigationAttributes","axis","memorizeCurrent","selectionState","setSelectionState","state","defaultState","initialState","onChange","e","data","selectedItemsAsArray","Array","from","selection","components","root","always","role","undefined","elementType"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SACEC,wBAAwB,EAExBC,IAAI,EACJC,oBAAoB,EACpBC,gBAAgB,QACX,4BAA4B;AACnC,SAASC,uBAAuB,QAAQ,0BAA0B;AAElE,SAASC,gBAAgB,QAAQ,4BAA4B;AAE7D,MAAMC,uBAAuB;AAE7B;;;;;;;;CAQC,GACD,OAAO,MAAMC,mBAAmB,CAACC,OAAkBC;IACjD,MAAM,EACJC,SAAS,UAAU,EACnBC,YAAY,KAAK,EACjBC,aAAa,KAAK,EAClBC,gBAAgB,QAAQ,EACxBC,aAAa,EACbC,oBAAoB,EACpBC,EAAE,EACFC,iBAAiB,EACjBC,kBAAkB,KAAK,EACvBC,iBAAiB,KAAK,EACvB,GAAGX;IAEJ,MAAMY,4BAA4BhB,wBAAwB;QACxDiB,MAAMX,WAAW,SAAS,gBAAgB;QAC1CY,iBAAiB;IACnB;IAEA,MAAM,CAACC,gBAAgBC,kBAAkB,GAAGtB,qBAAqB;QAC/DuB,OAAOX;QACPY,cAAcX;QACdY,cAAc,EAAE;IAClB;IAEA,MAAMC,WAAWzB,iBAAiB,CAAC0B,GAAyBC;QAC1D,MAAMC,uBAAuBC,MAAMC,IAAI,CAACH,KAAKhB,aAAa;QAC1DU,kBAAkBO;QAClBd,8BAAAA,wCAAAA,kBAAoBY,GAAG;YAAEf,eAAeiB;QAAqB;IAC/D;IAEA,MAAMG,YAAY7B,iBAAiB;QACjCY,mBAAmBW;QACnBf;QACAC,eAAeS;QACfR;IACF;IAEA,OAAO;QACLoB,YAAY;YACVC,MAAM9B;QACR;QACA8B,MAAMnC,KAAKoC,MAAM,CACfrC,yBAAyBM,sBAAsB;YAC7CG;YACA,GAAIE,aAAa;gBAAE2B,MAAM;YAAO,CAAC;YACjC,GAAI1B,cAAc;gBAChB0B,MAAM;gBACN,wBAAwBzB,kBAAkB,gBAAgB,OAAO0B;YACnE,CAAC;YACD,GAAGnB,yBAAyB;YAC5B,GAAGZ,KAAK;QACV,IACA;YAAEgC,aAAalC;QAAqB;QAEtCI;QACA,WAAW;QACXC;QACAK,IAAIA,MAAMV;QACVY;QACAC;QACA,6FAA6F;QAC7Fe,WAAWtB,aAAasB,YAAYK;IACtC;AACF,EAAE"}
1
+ {"version":3,"sources":["../src/components/List/List/useList.ts"],"sourcesContent":["import * as React from 'react';\nimport {\n getIntrinsicElementProps,\n OnSelectionChangeData,\n slot,\n useControllableState,\n useEventCallback,\n} from '@fluentui/react-utilities';\nimport { useArrowNavigationGroup } from '@fluentui/react-tabster';\nimport { ListProps, ListState } from './List.types';\nimport { useListSelection } from '../hooks/useListSelection';\n\nconst DEFAULT_ROOT_EL_TYPE = 'ul';\n\n/**\n * Create the state required to render List.\n *\n * The returned state can be modified with hooks such as useListStyles_unstable,\n * before being passed to renderList_unstable.\n *\n * @param props - props from this instance of List\n * @param ref - reference to root HTMLElement of List\n */\nexport const useList_unstable = (props: ListProps, ref: React.Ref<HTMLDivElement | HTMLUListElement>): ListState => {\n const {\n layout = 'vertical',\n navigable = false,\n selectable = false,\n selectionMode = 'single',\n selectedItems,\n defaultSelectedItems,\n as,\n onSelectionChange,\n truncateContent = false,\n truncateHeader = false,\n } = props;\n\n const arrowNavigationAttributes = useArrowNavigationGroup({\n axis: layout === 'grid' ? 'grid-linear' : 'both',\n memorizeCurrent: true,\n });\n\n const [selectionState, setSelectionState] = useControllableState({\n state: selectedItems,\n defaultState: defaultSelectedItems,\n initialState: [],\n });\n\n const onChange = useEventCallback((e: React.SyntheticEvent, data: OnSelectionChangeData) => {\n const selectedItemsAsArray = Array.from(data.selectedItems);\n setSelectionState(selectedItemsAsArray);\n onSelectionChange?.(e, { selectedItems: selectedItemsAsArray });\n });\n\n const selection = useListSelection({\n onSelectionChange: onChange,\n selectionMode,\n selectedItems: selectionState,\n defaultSelectedItems,\n });\n\n return {\n components: {\n root: DEFAULT_ROOT_EL_TYPE,\n },\n root: slot.always(\n getIntrinsicElementProps(DEFAULT_ROOT_EL_TYPE, {\n ref,\n ...(navigable && { role: 'menu' }),\n ...(selectable && {\n role: 'listbox',\n 'aria-multiselectable': selectionMode === 'multiselect' ? true : undefined,\n }),\n ...arrowNavigationAttributes,\n ...props,\n }),\n { elementType: DEFAULT_ROOT_EL_TYPE },\n ),\n layout,\n // context:\n navigable,\n as: as || DEFAULT_ROOT_EL_TYPE,\n truncateContent,\n truncateHeader,\n // only pass down selection state if its handled internally, otherwise just report the events\n selection: selectable ? selection : undefined,\n };\n};\n"],"names":["React","getIntrinsicElementProps","slot","useControllableState","useEventCallback","useArrowNavigationGroup","useListSelection","DEFAULT_ROOT_EL_TYPE","useList_unstable","props","ref","layout","navigable","selectable","selectionMode","selectedItems","defaultSelectedItems","as","onSelectionChange","truncateContent","truncateHeader","arrowNavigationAttributes","axis","memorizeCurrent","selectionState","setSelectionState","state","defaultState","initialState","onChange","e","data","selectedItemsAsArray","Array","from","selection","components","root","always","role","undefined","elementType"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SACEC,wBAAwB,EAExBC,IAAI,EACJC,oBAAoB,EACpBC,gBAAgB,QACX,4BAA4B;AACnC,SAASC,uBAAuB,QAAQ,0BAA0B;AAElE,SAASC,gBAAgB,QAAQ,4BAA4B;AAE7D,MAAMC,uBAAuB;AAE7B;;;;;;;;CAQC,GACD,OAAO,MAAMC,mBAAmB,CAACC,OAAkBC;IACjD,MAAM,EACJC,SAAS,UAAU,EACnBC,YAAY,KAAK,EACjBC,aAAa,KAAK,EAClBC,gBAAgB,QAAQ,EACxBC,aAAa,EACbC,oBAAoB,EACpBC,EAAE,EACFC,iBAAiB,EACjBC,kBAAkB,KAAK,EACvBC,iBAAiB,KAAK,EACvB,GAAGX;IAEJ,MAAMY,4BAA4BhB,wBAAwB;QACxDiB,MAAMX,WAAW,SAAS,gBAAgB;QAC1CY,iBAAiB;IACnB;IAEA,MAAM,CAACC,gBAAgBC,kBAAkB,GAAGtB,qBAAqB;QAC/DuB,OAAOX;QACPY,cAAcX;QACdY,cAAc,EAAE;IAClB;IAEA,MAAMC,WAAWzB,iBAAiB,CAAC0B,GAAyBC;QAC1D,MAAMC,uBAAuBC,MAAMC,IAAI,CAACH,KAAKhB,aAAa;QAC1DU,kBAAkBO;QAClBd,8BAAAA,wCAAAA,kBAAoBY,GAAG;YAAEf,eAAeiB;QAAqB;IAC/D;IAEA,MAAMG,YAAY7B,iBAAiB;QACjCY,mBAAmBW;QACnBf;QACAC,eAAeS;QACfR;IACF;IAEA,OAAO;QACLoB,YAAY;YACVC,MAAM9B;QACR;QACA8B,MAAMnC,KAAKoC,MAAM,CACfrC,yBAAyBM,sBAAsB;YAC7CG;YACA,GAAIE,aAAa;gBAAE2B,MAAM;YAAO,CAAC;YACjC,GAAI1B,cAAc;gBAChB0B,MAAM;gBACN,wBAAwBzB,kBAAkB,gBAAgB,OAAO0B;YACnE,CAAC;YACD,GAAGnB,yBAAyB;YAC5B,GAAGZ,KAAK;QACV,IACA;YAAEgC,aAAalC;QAAqB;QAEtCI;QACA,WAAW;QACXC;QACAK,IAAIA,MAAMV;QACVY;QACAC;QACA,6FAA6F;QAC7Fe,WAAWtB,aAAasB,YAAYK;IACtC;AACF,EAAE"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/List/List/useListContextValues.ts"],"sourcesContent":["import { ListContextValues, ListState } from './List.types';\n\nexport function useListContextValues_unstable(state: ListState): ListContextValues {\n const { navigable, selection, as, truncateContent, truncateHeader } = state;\n\n const listContext = {\n navigable,\n selection,\n as,\n truncateContent,\n truncateHeader,\n };\n\n return {\n listContext,\n };\n}\n"],"names":["useListContextValues_unstable","state","navigable","selection","as","truncateContent","truncateHeader","listContext"],"rangeMappings":";;;;;;;;;;;;","mappings":"AAEA,OAAO,SAASA,8BAA8BC,KAAgB;IAC5D,MAAM,EAAEC,SAAS,EAAEC,SAAS,EAAEC,EAAE,EAAEC,eAAe,EAAEC,cAAc,EAAE,GAAGL;IAEtE,MAAMM,cAAc;QAClBL;QACAC;QACAC;QACAC;QACAC;IACF;IAEA,OAAO;QACLC;IACF;AACF"}
1
+ {"version":3,"sources":["../src/components/List/List/useListContextValues.ts"],"sourcesContent":["import { ListContextValues, ListState } from './List.types';\n\nexport function useListContextValues_unstable(state: ListState): ListContextValues {\n const { navigable, selection, as, truncateContent, truncateHeader } = state;\n\n const listContext = {\n navigable,\n selection,\n as,\n truncateContent,\n truncateHeader,\n };\n\n return {\n listContext,\n };\n}\n"],"names":["useListContextValues_unstable","state","navigable","selection","as","truncateContent","truncateHeader","listContext"],"mappings":"AAEA,OAAO,SAASA,8BAA8BC,KAAgB;IAC5D,MAAM,EAAEC,SAAS,EAAEC,SAAS,EAAEC,EAAE,EAAEC,eAAe,EAAEC,cAAc,EAAE,GAAGL;IAEtE,MAAMM,cAAc;QAClBL;QACAC;QACAC;QACAC;QACAC;IACF;IAEA,OAAO;QACLC;IACF;AACF"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/List/List/useListStyles.styles.ts"],"sourcesContent":["import type { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeStyles, makeResetStyles, mergeClasses } from '@griffel/react';\nimport type { ListSlots, ListState } from './List.types';\n\nexport const listClassNames: SlotClassNames<ListSlots> = {\n root: 'fui-List',\n};\n\nconst useRootBaseStyles = makeResetStyles({\n padding: 0,\n margin: 0,\n textIndent: 0,\n listStyleType: 'none',\n});\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n rootHorizontal: {\n display: 'flex',\n },\n\n rootGrid: {\n display: 'grid',\n },\n});\n\n/**\n * Apply styling to the List slots based on the state\n */\nexport const useListStyles_unstable = (state: ListState): ListState => {\n 'use no memo';\n\n const rootStyles = useRootBaseStyles();\n const styles = useStyles();\n\n const layoutToStyles = {\n ['horizontal']: styles.rootHorizontal,\n ['grid']: styles.rootGrid,\n ['vertical']: undefined, // no extra styles needed, keep it in for completeness and type safety\n };\n\n state.root.className = mergeClasses(\n listClassNames.root,\n rootStyles,\n layoutToStyles[state.layout],\n state.root.className,\n );\n\n return state;\n};\n"],"names":["makeStyles","makeResetStyles","mergeClasses","listClassNames","root","useRootBaseStyles","padding","margin","textIndent","listStyleType","useStyles","rootHorizontal","display","rootGrid","useListStyles_unstable","state","rootStyles","styles","layoutToStyles","undefined","className","layout"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AACA,SAASA,UAAU,EAAEC,eAAe,EAAEC,YAAY,QAAQ,iBAAiB;AAG3E,OAAO,MAAMC,iBAA4C;IACvDC,MAAM;AACR,EAAE;AAEF,MAAMC,oBAAoBJ,gBAAgB;IACxCK,SAAS;IACTC,QAAQ;IACRC,YAAY;IACZC,eAAe;AACjB;AAEA;;CAEC,GACD,MAAMC,YAAYV,WAAW;IAC3BW,gBAAgB;QACdC,SAAS;IACX;IAEAC,UAAU;QACRD,SAAS;IACX;AACF;AAEA;;CAEC,GACD,OAAO,MAAME,yBAAyB,CAACC;IACrC;IAEA,MAAMC,aAAaX;IACnB,MAAMY,SAASP;IAEf,MAAMQ,iBAAiB;QACrB,CAAC,aAAa,EAAED,OAAON,cAAc;QACrC,CAAC,OAAO,EAAEM,OAAOJ,QAAQ;QACzB,CAAC,WAAW,EAAEM;IAChB;IAEAJ,MAAMX,IAAI,CAACgB,SAAS,GAAGlB,aACrBC,eAAeC,IAAI,EACnBY,YACAE,cAAc,CAACH,MAAMM,MAAM,CAAC,EAC5BN,MAAMX,IAAI,CAACgB,SAAS;IAGtB,OAAOL;AACT,EAAE"}
1
+ {"version":3,"sources":["../src/components/List/List/useListStyles.styles.ts"],"sourcesContent":["import type { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeStyles, makeResetStyles, mergeClasses } from '@griffel/react';\nimport type { ListSlots, ListState } from './List.types';\n\nexport const listClassNames: SlotClassNames<ListSlots> = {\n root: 'fui-List',\n};\n\nconst useRootBaseStyles = makeResetStyles({\n padding: 0,\n margin: 0,\n textIndent: 0,\n listStyleType: 'none',\n});\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n rootHorizontal: {\n display: 'flex',\n },\n\n rootGrid: {\n display: 'grid',\n },\n});\n\n/**\n * Apply styling to the List slots based on the state\n */\nexport const useListStyles_unstable = (state: ListState): ListState => {\n 'use no memo';\n\n const rootStyles = useRootBaseStyles();\n const styles = useStyles();\n\n const layoutToStyles = {\n ['horizontal']: styles.rootHorizontal,\n ['grid']: styles.rootGrid,\n ['vertical']: undefined, // no extra styles needed, keep it in for completeness and type safety\n };\n\n state.root.className = mergeClasses(\n listClassNames.root,\n rootStyles,\n layoutToStyles[state.layout],\n state.root.className,\n );\n\n return state;\n};\n"],"names":["makeStyles","makeResetStyles","mergeClasses","listClassNames","root","useRootBaseStyles","padding","margin","textIndent","listStyleType","useStyles","rootHorizontal","display","rootGrid","useListStyles_unstable","state","rootStyles","styles","layoutToStyles","undefined","className","layout"],"mappings":"AACA,SAASA,UAAU,EAAEC,eAAe,EAAEC,YAAY,QAAQ,iBAAiB;AAG3E,OAAO,MAAMC,iBAA4C;IACvDC,MAAM;AACR,EAAE;AAEF,MAAMC,oBAAoBJ,gBAAgB;IACxCK,SAAS;IACTC,QAAQ;IACRC,YAAY;IACZC,eAAe;AACjB;AAEA;;CAEC,GACD,MAAMC,YAAYV,WAAW;IAC3BW,gBAAgB;QACdC,SAAS;IACX;IAEAC,UAAU;QACRD,SAAS;IACX;AACF;AAEA;;CAEC,GACD,OAAO,MAAME,yBAAyB,CAACC;IACrC;IAEA,MAAMC,aAAaX;IACnB,MAAMY,SAASP;IAEf,MAAMQ,iBAAiB;QACrB,CAAC,aAAa,EAAED,OAAON,cAAc;QACrC,CAAC,OAAO,EAAEM,OAAOJ,QAAQ;QACzB,CAAC,WAAW,EAAEM;IAChB;IAEAJ,MAAMX,IAAI,CAACgB,SAAS,GAAGlB,aACrBC,eAAeC,IAAI,EACnBY,YACAE,cAAc,CAACH,MAAMM,MAAM,CAAC,EAC5BN,MAAMX,IAAI,CAACgB,SAAS;IAGtB,OAAOL;AACT,EAAE"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/List/ListItem/ListItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport { useListItem_unstable } from './useListItem';\nimport { renderListItem_unstable } from './renderListItem';\nimport { useListItemStyles_unstable } from './useListItemStyles.styles';\nimport type { ListItemProps } from './ListItem.types';\n\nexport const ListItem: ForwardRefComponent<ListItemProps> = React.forwardRef<HTMLLIElement | HTMLDivElement>(\n (props, ref) => {\n const state = useListItem_unstable(props, ref);\n\n useListItemStyles_unstable(state);\n useCustomStyleHook_unstable('useListItemStyles_unstable')(state);\n return renderListItem_unstable(state);\n },\n);\n\nListItem.displayName = 'ListItem';\n"],"names":["React","useCustomStyleHook_unstable","useListItem_unstable","renderListItem_unstable","useListItemStyles_unstable","ListItem","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,2BAA2B,QAAQ,kCAAkC;AAC9E,SAASC,oBAAoB,QAAQ,gBAAgB;AACrD,SAASC,uBAAuB,QAAQ,mBAAmB;AAC3D,SAASC,0BAA0B,QAAQ,6BAA6B;AAGxE,OAAO,MAAMC,yBAA+CL,MAAMM,UAAU,CAC1E,CAACC,OAAOC;IACN,MAAMC,QAAQP,qBAAqBK,OAAOC;IAE1CJ,2BAA2BK;IAC3BR,4BAA4B,8BAA8BQ;IAC1D,OAAON,wBAAwBM;AACjC,GACA;AAEFJ,SAASK,WAAW,GAAG"}
1
+ {"version":3,"sources":["../src/components/List/ListItem/ListItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport { useListItem_unstable } from './useListItem';\nimport { renderListItem_unstable } from './renderListItem';\nimport { useListItemStyles_unstable } from './useListItemStyles.styles';\nimport type { ListItemProps } from './ListItem.types';\n\nexport const ListItem: ForwardRefComponent<ListItemProps> = React.forwardRef<HTMLLIElement | HTMLDivElement>(\n (props, ref) => {\n const state = useListItem_unstable(props, ref);\n\n useListItemStyles_unstable(state);\n useCustomStyleHook_unstable('useListItemStyles_unstable')(state);\n return renderListItem_unstable(state);\n },\n);\n\nListItem.displayName = 'ListItem';\n"],"names":["React","useCustomStyleHook_unstable","useListItem_unstable","renderListItem_unstable","useListItemStyles_unstable","ListItem","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,2BAA2B,QAAQ,kCAAkC;AAC9E,SAASC,oBAAoB,QAAQ,gBAAgB;AACrD,SAASC,uBAAuB,QAAQ,mBAAmB;AAC3D,SAASC,0BAA0B,QAAQ,6BAA6B;AAGxE,OAAO,MAAMC,yBAA+CL,MAAMM,UAAU,CAC1E,CAACC,OAAOC;IACN,MAAMC,QAAQP,qBAAqBK,OAAOC;IAE1CJ,2BAA2BK;IAC3BR,4BAA4B,8BAA8BQ;IAC1D,OAAON,wBAAwBM;AACjC,GACA;AAEFJ,SAASK,WAAW,GAAG"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/List/ListItem/ListItem.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { ItemLayout } from '../../ItemLayout';\n\nexport type ListItemSlots = {\n root: NonNullable<Slot<'li', 'div'>>;\n media?: React.ComponentProps<typeof ItemLayout>['startMedia'];\n header?: React.ComponentProps<typeof ItemLayout>['header'];\n contentWrapper?: React.ComponentProps<typeof ItemLayout>['contentWrapper'];\n headerMedia?: React.ComponentProps<typeof ItemLayout>['headerMedia'];\n contentMedia?: React.ComponentProps<typeof ItemLayout>['contentMedia'];\n endMedia?: React.ComponentProps<typeof ItemLayout>['endMedia'];\n};\n\n/**\n * ListItem Props\n */\nexport type ListItemProps = ComponentProps<ListItemSlots> & {\n value?: string | number;\n truncateHeader?: boolean;\n truncateContent?: boolean;\n};\n\n/**\n * State used in rendering ListItem\n */\nexport type ListItemState = ComponentState<ListItemSlots> & {\n selectable?: boolean;\n selected?: boolean;\n navigable?: boolean;\n truncateHeader?: boolean;\n truncateContent?: boolean;\n};\n"],"names":["React"],"rangeMappings":"","mappings":"AAAA,YAAYA,WAAW,QAAQ"}
1
+ {"version":3,"sources":["../src/components/List/ListItem/ListItem.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { ItemLayout } from '../../ItemLayout';\n\nexport type ListItemSlots = {\n root: NonNullable<Slot<'li', 'div'>>;\n media?: React.ComponentProps<typeof ItemLayout>['startMedia'];\n header?: React.ComponentProps<typeof ItemLayout>['header'];\n contentWrapper?: React.ComponentProps<typeof ItemLayout>['contentWrapper'];\n headerMedia?: React.ComponentProps<typeof ItemLayout>['headerMedia'];\n contentMedia?: React.ComponentProps<typeof ItemLayout>['contentMedia'];\n endMedia?: React.ComponentProps<typeof ItemLayout>['endMedia'];\n};\n\n/**\n * ListItem Props\n */\nexport type ListItemProps = ComponentProps<ListItemSlots> & {\n value?: string | number;\n truncateHeader?: boolean;\n truncateContent?: boolean;\n};\n\n/**\n * State used in rendering ListItem\n */\nexport type ListItemState = ComponentState<ListItemSlots> & {\n selectable?: boolean;\n selected?: boolean;\n navigable?: boolean;\n truncateHeader?: boolean;\n truncateContent?: boolean;\n};\n"],"names":["React"],"mappings":"AAAA,YAAYA,WAAW,QAAQ"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/List/ListItem/index.ts"],"sourcesContent":["export { ListItem } from './ListItem';\nexport type { ListItemProps, ListItemSlots, ListItemState } from './ListItem.types';\nexport { renderListItem_unstable } from './renderListItem';\nexport { useListItem_unstable } from './useListItem';\nexport { listItemClassNames, useListItemStyles_unstable } from './useListItemStyles.styles';\n"],"names":["ListItem","renderListItem_unstable","useListItem_unstable","listItemClassNames","useListItemStyles_unstable"],"rangeMappings":";;;","mappings":"AAAA,SAASA,QAAQ,QAAQ,aAAa;AAEtC,SAASC,uBAAuB,QAAQ,mBAAmB;AAC3D,SAASC,oBAAoB,QAAQ,gBAAgB;AACrD,SAASC,kBAAkB,EAAEC,0BAA0B,QAAQ,6BAA6B"}
1
+ {"version":3,"sources":["../src/components/List/ListItem/index.ts"],"sourcesContent":["export { ListItem } from './ListItem';\nexport type { ListItemProps, ListItemSlots, ListItemState } from './ListItem.types';\nexport { renderListItem_unstable } from './renderListItem';\nexport { useListItem_unstable } from './useListItem';\nexport { listItemClassNames, useListItemStyles_unstable } from './useListItemStyles.styles';\n"],"names":["ListItem","renderListItem_unstable","useListItem_unstable","listItemClassNames","useListItemStyles_unstable"],"mappings":"AAAA,SAASA,QAAQ,QAAQ,aAAa;AAEtC,SAASC,uBAAuB,QAAQ,mBAAmB;AAC3D,SAASC,oBAAoB,QAAQ,gBAAgB;AACrD,SAASC,kBAAkB,EAAEC,0BAA0B,QAAQ,6BAA6B"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/List/ListItem/renderListItem.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { ItemLayout } from '../../ItemLayout';\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { ListItemSlots, ListItemState } from './ListItem.types';\n/**\n * Render the final JSX of ListItem\n */\nexport const renderListItem_unstable = (state: ListItemState) => {\n assertSlots<ListItemSlots>(state);\n\n return (\n <state.root>\n <ItemLayout\n startMedia={state.media}\n header={state.header}\n headerMedia={state.headerMedia}\n contentWrapper={state.contentWrapper}\n contentMedia={state.contentMedia}\n endMedia={state.endMedia}\n >\n {state.root.children}\n </ItemLayout>\n </state.root>\n );\n};\n"],"names":["ItemLayout","assertSlots","renderListItem_unstable","state","root","startMedia","media","header","headerMedia","contentWrapper","contentMedia","endMedia","children"],"rangeMappings":";;;;;;;;;;;;;;;;;;","mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,UAAU,QAAQ,mBAAmB;AAC9C,SAASC,WAAW,QAAQ,4BAA4B;AAExD;;CAEC,GACD,OAAO,MAAMC,0BAA0B,CAACC;IACtCF,YAA2BE;IAE3B,qBACE,KAACA,MAAMC,IAAI;kBACT,cAAA,KAACJ;YACCK,YAAYF,MAAMG,KAAK;YACvBC,QAAQJ,MAAMI,MAAM;YACpBC,aAAaL,MAAMK,WAAW;YAC9BC,gBAAgBN,MAAMM,cAAc;YACpCC,cAAcP,MAAMO,YAAY;YAChCC,UAAUR,MAAMQ,QAAQ;sBAEvBR,MAAMC,IAAI,CAACQ,QAAQ;;;AAI5B,EAAE"}
1
+ {"version":3,"sources":["../src/components/List/ListItem/renderListItem.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { ItemLayout } from '../../ItemLayout';\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { ListItemSlots, ListItemState } from './ListItem.types';\n/**\n * Render the final JSX of ListItem\n */\nexport const renderListItem_unstable = (state: ListItemState) => {\n assertSlots<ListItemSlots>(state);\n\n return (\n <state.root>\n <ItemLayout\n startMedia={state.media}\n header={state.header}\n headerMedia={state.headerMedia}\n contentWrapper={state.contentWrapper}\n contentMedia={state.contentMedia}\n endMedia={state.endMedia}\n >\n {state.root.children}\n </ItemLayout>\n </state.root>\n );\n};\n"],"names":["ItemLayout","assertSlots","renderListItem_unstable","state","root","startMedia","media","header","headerMedia","contentWrapper","contentMedia","endMedia","children"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,UAAU,QAAQ,mBAAmB;AAC9C,SAASC,WAAW,QAAQ,4BAA4B;AAExD;;CAEC,GACD,OAAO,MAAMC,0BAA0B,CAACC;IACtCF,YAA2BE;IAE3B,qBACE,KAACA,MAAMC,IAAI;kBACT,cAAA,KAACJ;YACCK,YAAYF,MAAMG,KAAK;YACvBC,QAAQJ,MAAMI,MAAM;YACpBC,aAAaL,MAAMK,WAAW;YAC9BC,gBAAgBN,MAAMM,cAAc;YACpCC,cAAcP,MAAMO,YAAY;YAChCC,UAAUR,MAAMQ,QAAQ;sBAEvBR,MAAMC,IAAI,CAACQ,QAAQ;;;AAI5B,EAAE"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/List/ListItem/useListItem.tsx"],"sourcesContent":["import { useARIAButtonProps } from '@fluentui/react-aria';\nimport { getIntrinsicElementProps, slot, useEventCallback, useId } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport { useListContext_unstable } from '../List/listContext';\nimport type { ListItemProps, ListItemState } from './ListItem.types';\n\nconst DEFAULT_ROOT_EL_TYPE = 'li';\n\nfunction validateProperElementTypes(parentRenderedAs?: 'div' | 'ul' | 'ol', renderedAs?: 'div' | 'li') {\n if (process.env.NODE_ENV === 'production') {\n return;\n }\n\n if (renderedAs === 'div' && parentRenderedAs !== 'div') {\n throw new Error('ListItem cannot be rendered as a div when its parent is not a div.');\n }\n if (renderedAs === 'li' && parentRenderedAs === 'div') {\n throw new Error('ListItem cannot be rendered as a li when its parent is a div.');\n }\n}\n\nfunction validateNavigableWhenOnClickPresent(navigable: boolean, onClick?: React.MouseEventHandler) {\n if (process.env.NODE_ENV === 'production') {\n return;\n }\n\n if (onClick && !navigable) {\n throw new Error('ListItem must be navigable when onClick is present. Set navigable={true} on the List.');\n }\n}\n\n/**\n * Create the state required to render ListItem.\n *\n * The returned state can be modified with hooks such as useListItemStyles_unstable,\n * before being passed to renderListItem_unstable.\n *\n * @param props - props from this instance of ListItem\n * @param ref - reference to root HTMLLIElement | HTMLDivElementof ListItem\n */\nexport const useListItem_unstable = (\n props: ListItemProps,\n ref: React.Ref<HTMLLIElement | HTMLDivElement>,\n): ListItemState => {\n const id = useId('listItem');\n const { value = id, truncateHeader, truncateContent, onClick, onKeyDown, onKeyUp } = props;\n\n const navigable = useListContext_unstable(ctx => ctx.navigable);\n const toggleItem = useListContext_unstable(ctx => ctx.selection?.toggleItem);\n const isSelectionEnabled = useListContext_unstable(ctx => !!ctx.selection);\n const isSelected = useListContext_unstable(ctx => ctx.selection?.isSelected(value));\n\n const truncateHeaderOnList = useListContext_unstable(ctx => ctx.truncateHeader);\n const truncateContentOnList = useListContext_unstable(ctx => ctx.truncateContent);\n\n const parentRenderedAs = useListContext_unstable(ctx => ctx.as);\n const renderedAs = props.as || DEFAULT_ROOT_EL_TYPE;\n\n validateProperElementTypes(parentRenderedAs, renderedAs);\n\n validateNavigableWhenOnClickPresent(navigable, onClick);\n\n const handleClick: React.MouseEventHandler<HTMLLIElement & HTMLDivElement> = useEventCallback(e => {\n onClick?.(e);\n\n if (!isSelectionEnabled || e.defaultPrevented) {\n return;\n }\n\n toggleItem?.(e, value);\n });\n\n // avoid passing empty onClick to prevent items unnecessary being narrated as clickable\n // see https://github.com/microsoft/fluentui/issues/20658\n const passClickHandler = !!onClick || isSelectionEnabled;\n\n const clickHandlerProps = {\n onClick: passClickHandler ? handleClick : undefined,\n onKeyDown: onKeyDown as React.KeyboardEventHandler<HTMLLIElement & HTMLDivElement>,\n onKeyUp: onKeyUp as React.KeyboardEventHandler<HTMLLIElement & HTMLDivElement>,\n };\n\n // This will give us the onKeyDown and onKeyUp props for Enter and Space\n const ariaButtonProps = useARIAButtonProps('div', clickHandlerProps);\n\n // v0 ListItem adds keyboard handling only for navigable or selectable items\n const buttonProps = navigable || isSelectionEnabled ? ariaButtonProps : clickHandlerProps;\n\n const root = slot.always(\n getIntrinsicElementProps(DEFAULT_ROOT_EL_TYPE, {\n ref: ref as React.Ref<HTMLLIElement & HTMLDivElement>,\n tabIndex: navigable || isSelectionEnabled ? 0 : undefined,\n role: navigable ? 'menuitem' : 'listitem',\n id: String(value),\n ...(isSelectionEnabled && {\n role: 'option',\n 'aria-selected': isSelected,\n }),\n ...props,\n onKeyDown: buttonProps.onKeyDown as React.KeyboardEventHandler<HTMLLIElement & HTMLDivElement>,\n onKeyUp: buttonProps.onKeyUp as React.KeyboardEventHandler<HTMLLIElement & HTMLDivElement>,\n onClick: buttonProps.onClick as React.MouseEventHandler<HTMLLIElement & HTMLDivElement>,\n }),\n { elementType: DEFAULT_ROOT_EL_TYPE },\n );\n\n const state: ListItemState = {\n components: {\n root: DEFAULT_ROOT_EL_TYPE,\n media: 'div',\n header: 'div',\n contentWrapper: 'div',\n headerMedia: 'div',\n contentMedia: 'div',\n endMedia: 'div',\n },\n root,\n navigable,\n selectable: isSelectionEnabled,\n selected: isSelected,\n media: slot.optional(props.media, { elementType: 'div' }),\n header: slot.optional(props.header, { elementType: 'div' }),\n contentWrapper: slot.optional(props.contentWrapper, { elementType: 'div', renderByDefault: true }),\n headerMedia: slot.optional(props.headerMedia, { elementType: 'div' }),\n contentMedia: slot.optional(props.contentMedia, { elementType: 'div' }),\n endMedia: slot.optional(props.endMedia, { elementType: 'div' }),\n truncateHeader: truncateHeader ?? truncateHeaderOnList,\n truncateContent: truncateContent ?? truncateContentOnList,\n };\n\n return state;\n};\n"],"names":["useARIAButtonProps","getIntrinsicElementProps","slot","useEventCallback","useId","React","useListContext_unstable","DEFAULT_ROOT_EL_TYPE","validateProperElementTypes","parentRenderedAs","renderedAs","process","env","NODE_ENV","Error","validateNavigableWhenOnClickPresent","navigable","onClick","useListItem_unstable","props","ref","id","value","truncateHeader","truncateContent","onKeyDown","onKeyUp","ctx","toggleItem","selection","isSelectionEnabled","isSelected","truncateHeaderOnList","truncateContentOnList","as","handleClick","e","defaultPrevented","passClickHandler","clickHandlerProps","undefined","ariaButtonProps","buttonProps","root","always","tabIndex","role","String","elementType","state","components","media","header","contentWrapper","headerMedia","contentMedia","endMedia","selectable","selected","optional","renderByDefault"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SAASA,kBAAkB,QAAQ,uBAAuB;AAC1D,SAASC,wBAAwB,EAAEC,IAAI,EAAEC,gBAAgB,EAAEC,KAAK,QAAQ,4BAA4B;AACpG,YAAYC,WAAW,QAAQ;AAC/B,SAASC,uBAAuB,QAAQ,sBAAsB;AAG9D,MAAMC,uBAAuB;AAE7B,SAASC,2BAA2BC,gBAAsC,EAAEC,UAAyB;IACnG,IAAIC,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;QACzC;IACF;IAEA,IAAIH,eAAe,SAASD,qBAAqB,OAAO;QACtD,MAAM,IAAIK,MAAM;IAClB;IACA,IAAIJ,eAAe,QAAQD,qBAAqB,OAAO;QACrD,MAAM,IAAIK,MAAM;IAClB;AACF;AAEA,SAASC,oCAAoCC,SAAkB,EAAEC,OAAiC;IAChG,IAAIN,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;QACzC;IACF;IAEA,IAAII,WAAW,CAACD,WAAW;QACzB,MAAM,IAAIF,MAAM;IAClB;AACF;AAEA;;;;;;;;CAQC,GACD,OAAO,MAAMI,uBAAuB,CAClCC,OACAC;IAEA,MAAMC,KAAKjB,MAAM;IACjB,MAAM,EAAEkB,QAAQD,EAAE,EAAEE,cAAc,EAAEC,eAAe,EAAEP,OAAO,EAAEQ,SAAS,EAAEC,OAAO,EAAE,GAAGP;IAErF,MAAMH,YAAYV,wBAAwBqB,CAAAA,MAAOA,IAAIX,SAAS;IAC9D,MAAMY,aAAatB,wBAAwBqB,CAAAA;YAAOA;gBAAAA,iBAAAA,IAAIE,SAAS,cAAbF,qCAAAA,eAAeC,UAAU;;IAC3E,MAAME,qBAAqBxB,wBAAwBqB,CAAAA,MAAO,CAAC,CAACA,IAAIE,SAAS;IACzE,MAAME,aAAazB,wBAAwBqB,CAAAA;YAAOA;gBAAAA,iBAAAA,IAAIE,SAAS,cAAbF,qCAAAA,eAAeI,UAAU,CAACT;;IAE5E,MAAMU,uBAAuB1B,wBAAwBqB,CAAAA,MAAOA,IAAIJ,cAAc;IAC9E,MAAMU,wBAAwB3B,wBAAwBqB,CAAAA,MAAOA,IAAIH,eAAe;IAEhF,MAAMf,mBAAmBH,wBAAwBqB,CAAAA,MAAOA,IAAIO,EAAE;IAC9D,MAAMxB,aAAaS,MAAMe,EAAE,IAAI3B;IAE/BC,2BAA2BC,kBAAkBC;IAE7CK,oCAAoCC,WAAWC;IAE/C,MAAMkB,cAAuEhC,iBAAiBiC,CAAAA;QAC5FnB,oBAAAA,8BAAAA,QAAUmB;QAEV,IAAI,CAACN,sBAAsBM,EAAEC,gBAAgB,EAAE;YAC7C;QACF;QAEAT,uBAAAA,iCAAAA,WAAaQ,GAAGd;IAClB;IAEA,uFAAuF;IACvF,yDAAyD;IACzD,MAAMgB,mBAAmB,CAAC,CAACrB,WAAWa;IAEtC,MAAMS,oBAAoB;QACxBtB,SAASqB,mBAAmBH,cAAcK;QAC1Cf,WAAWA;QACXC,SAASA;IACX;IAEA,wEAAwE;IACxE,MAAMe,kBAAkBzC,mBAAmB,OAAOuC;IAElD,4EAA4E;IAC5E,MAAMG,cAAc1B,aAAac,qBAAqBW,kBAAkBF;IAExE,MAAMI,OAAOzC,KAAK0C,MAAM,CACtB3C,yBAAyBM,sBAAsB;QAC7Ca,KAAKA;QACLyB,UAAU7B,aAAac,qBAAqB,IAAIU;QAChDM,MAAM9B,YAAY,aAAa;QAC/BK,IAAI0B,OAAOzB;QACX,GAAIQ,sBAAsB;YACxBgB,MAAM;YACN,iBAAiBf;QACnB,CAAC;QACD,GAAGZ,KAAK;QACRM,WAAWiB,YAAYjB,SAAS;QAChCC,SAASgB,YAAYhB,OAAO;QAC5BT,SAASyB,YAAYzB,OAAO;IAC9B,IACA;QAAE+B,aAAazC;IAAqB;IAGtC,MAAM0C,QAAuB;QAC3BC,YAAY;YACVP,MAAMpC;YACN4C,OAAO;YACPC,QAAQ;YACRC,gBAAgB;YAChBC,aAAa;YACbC,cAAc;YACdC,UAAU;QACZ;QACAb;QACA3B;QACAyC,YAAY3B;QACZ4B,UAAU3B;QACVoB,OAAOjD,KAAKyD,QAAQ,CAACxC,MAAMgC,KAAK,EAAE;YAAEH,aAAa;QAAM;QACvDI,QAAQlD,KAAKyD,QAAQ,CAACxC,MAAMiC,MAAM,EAAE;YAAEJ,aAAa;QAAM;QACzDK,gBAAgBnD,KAAKyD,QAAQ,CAACxC,MAAMkC,cAAc,EAAE;YAAEL,aAAa;YAAOY,iBAAiB;QAAK;QAChGN,aAAapD,KAAKyD,QAAQ,CAACxC,MAAMmC,WAAW,EAAE;YAAEN,aAAa;QAAM;QACnEO,cAAcrD,KAAKyD,QAAQ,CAACxC,MAAMoC,YAAY,EAAE;YAAEP,aAAa;QAAM;QACrEQ,UAAUtD,KAAKyD,QAAQ,CAACxC,MAAMqC,QAAQ,EAAE;YAAER,aAAa;QAAM;QAC7DzB,gBAAgBA,2BAAAA,4BAAAA,iBAAkBS;QAClCR,iBAAiBA,4BAAAA,6BAAAA,kBAAmBS;IACtC;IAEA,OAAOgB;AACT,EAAE"}
1
+ {"version":3,"sources":["../src/components/List/ListItem/useListItem.tsx"],"sourcesContent":["import { useARIAButtonProps } from '@fluentui/react-aria';\nimport { getIntrinsicElementProps, slot, useEventCallback, useId } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport { useListContext_unstable } from '../List/listContext';\nimport type { ListItemProps, ListItemState } from './ListItem.types';\n\nconst DEFAULT_ROOT_EL_TYPE = 'li';\n\nfunction validateProperElementTypes(parentRenderedAs?: 'div' | 'ul' | 'ol', renderedAs?: 'div' | 'li') {\n if (process.env.NODE_ENV === 'production') {\n return;\n }\n\n if (renderedAs === 'div' && parentRenderedAs !== 'div') {\n throw new Error('ListItem cannot be rendered as a div when its parent is not a div.');\n }\n if (renderedAs === 'li' && parentRenderedAs === 'div') {\n throw new Error('ListItem cannot be rendered as a li when its parent is a div.');\n }\n}\n\nfunction validateNavigableWhenOnClickPresent(navigable: boolean, onClick?: React.MouseEventHandler) {\n if (process.env.NODE_ENV === 'production') {\n return;\n }\n\n if (onClick && !navigable) {\n throw new Error('ListItem must be navigable when onClick is present. Set navigable={true} on the List.');\n }\n}\n\n/**\n * Create the state required to render ListItem.\n *\n * The returned state can be modified with hooks such as useListItemStyles_unstable,\n * before being passed to renderListItem_unstable.\n *\n * @param props - props from this instance of ListItem\n * @param ref - reference to root HTMLLIElement | HTMLDivElementof ListItem\n */\nexport const useListItem_unstable = (\n props: ListItemProps,\n ref: React.Ref<HTMLLIElement | HTMLDivElement>,\n): ListItemState => {\n const id = useId('listItem');\n const { value = id, truncateHeader, truncateContent, onClick, onKeyDown, onKeyUp } = props;\n\n const navigable = useListContext_unstable(ctx => ctx.navigable);\n const toggleItem = useListContext_unstable(ctx => ctx.selection?.toggleItem);\n const isSelectionEnabled = useListContext_unstable(ctx => !!ctx.selection);\n const isSelected = useListContext_unstable(ctx => ctx.selection?.isSelected(value));\n\n const truncateHeaderOnList = useListContext_unstable(ctx => ctx.truncateHeader);\n const truncateContentOnList = useListContext_unstable(ctx => ctx.truncateContent);\n\n const parentRenderedAs = useListContext_unstable(ctx => ctx.as);\n const renderedAs = props.as || DEFAULT_ROOT_EL_TYPE;\n\n validateProperElementTypes(parentRenderedAs, renderedAs);\n\n validateNavigableWhenOnClickPresent(navigable, onClick);\n\n const handleClick: React.MouseEventHandler<HTMLLIElement & HTMLDivElement> = useEventCallback(e => {\n onClick?.(e);\n\n if (!isSelectionEnabled || e.defaultPrevented) {\n return;\n }\n\n toggleItem?.(e, value);\n });\n\n // avoid passing empty onClick to prevent items unnecessary being narrated as clickable\n // see https://github.com/microsoft/fluentui/issues/20658\n const passClickHandler = !!onClick || isSelectionEnabled;\n\n const clickHandlerProps = {\n onClick: passClickHandler ? handleClick : undefined,\n onKeyDown: onKeyDown as React.KeyboardEventHandler<HTMLLIElement & HTMLDivElement>,\n onKeyUp: onKeyUp as React.KeyboardEventHandler<HTMLLIElement & HTMLDivElement>,\n };\n\n // This will give us the onKeyDown and onKeyUp props for Enter and Space\n const ariaButtonProps = useARIAButtonProps('div', clickHandlerProps);\n\n // v0 ListItem adds keyboard handling only for navigable or selectable items\n const buttonProps = navigable || isSelectionEnabled ? ariaButtonProps : clickHandlerProps;\n\n const root = slot.always(\n getIntrinsicElementProps(DEFAULT_ROOT_EL_TYPE, {\n ref: ref as React.Ref<HTMLLIElement & HTMLDivElement>,\n tabIndex: navigable || isSelectionEnabled ? 0 : undefined,\n role: navigable ? 'menuitem' : 'listitem',\n id: String(value),\n ...(isSelectionEnabled && {\n role: 'option',\n 'aria-selected': isSelected,\n }),\n ...props,\n onKeyDown: buttonProps.onKeyDown as React.KeyboardEventHandler<HTMLLIElement & HTMLDivElement>,\n onKeyUp: buttonProps.onKeyUp as React.KeyboardEventHandler<HTMLLIElement & HTMLDivElement>,\n onClick: buttonProps.onClick as React.MouseEventHandler<HTMLLIElement & HTMLDivElement>,\n }),\n { elementType: DEFAULT_ROOT_EL_TYPE },\n );\n\n const state: ListItemState = {\n components: {\n root: DEFAULT_ROOT_EL_TYPE,\n media: 'div',\n header: 'div',\n contentWrapper: 'div',\n headerMedia: 'div',\n contentMedia: 'div',\n endMedia: 'div',\n },\n root,\n navigable,\n selectable: isSelectionEnabled,\n selected: isSelected,\n media: slot.optional(props.media, { elementType: 'div' }),\n header: slot.optional(props.header, { elementType: 'div' }),\n contentWrapper: slot.optional(props.contentWrapper, { elementType: 'div', renderByDefault: true }),\n headerMedia: slot.optional(props.headerMedia, { elementType: 'div' }),\n contentMedia: slot.optional(props.contentMedia, { elementType: 'div' }),\n endMedia: slot.optional(props.endMedia, { elementType: 'div' }),\n truncateHeader: truncateHeader ?? truncateHeaderOnList,\n truncateContent: truncateContent ?? truncateContentOnList,\n };\n\n return state;\n};\n"],"names":["useARIAButtonProps","getIntrinsicElementProps","slot","useEventCallback","useId","React","useListContext_unstable","DEFAULT_ROOT_EL_TYPE","validateProperElementTypes","parentRenderedAs","renderedAs","process","env","NODE_ENV","Error","validateNavigableWhenOnClickPresent","navigable","onClick","useListItem_unstable","props","ref","id","value","truncateHeader","truncateContent","onKeyDown","onKeyUp","ctx","toggleItem","selection","isSelectionEnabled","isSelected","truncateHeaderOnList","truncateContentOnList","as","handleClick","e","defaultPrevented","passClickHandler","clickHandlerProps","undefined","ariaButtonProps","buttonProps","root","always","tabIndex","role","String","elementType","state","components","media","header","contentWrapper","headerMedia","contentMedia","endMedia","selectable","selected","optional","renderByDefault"],"mappings":"AAAA,SAASA,kBAAkB,QAAQ,uBAAuB;AAC1D,SAASC,wBAAwB,EAAEC,IAAI,EAAEC,gBAAgB,EAAEC,KAAK,QAAQ,4BAA4B;AACpG,YAAYC,WAAW,QAAQ;AAC/B,SAASC,uBAAuB,QAAQ,sBAAsB;AAG9D,MAAMC,uBAAuB;AAE7B,SAASC,2BAA2BC,gBAAsC,EAAEC,UAAyB;IACnG,IAAIC,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;QACzC;IACF;IAEA,IAAIH,eAAe,SAASD,qBAAqB,OAAO;QACtD,MAAM,IAAIK,MAAM;IAClB;IACA,IAAIJ,eAAe,QAAQD,qBAAqB,OAAO;QACrD,MAAM,IAAIK,MAAM;IAClB;AACF;AAEA,SAASC,oCAAoCC,SAAkB,EAAEC,OAAiC;IAChG,IAAIN,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;QACzC;IACF;IAEA,IAAII,WAAW,CAACD,WAAW;QACzB,MAAM,IAAIF,MAAM;IAClB;AACF;AAEA;;;;;;;;CAQC,GACD,OAAO,MAAMI,uBAAuB,CAClCC,OACAC;IAEA,MAAMC,KAAKjB,MAAM;IACjB,MAAM,EAAEkB,QAAQD,EAAE,EAAEE,cAAc,EAAEC,eAAe,EAAEP,OAAO,EAAEQ,SAAS,EAAEC,OAAO,EAAE,GAAGP;IAErF,MAAMH,YAAYV,wBAAwBqB,CAAAA,MAAOA,IAAIX,SAAS;IAC9D,MAAMY,aAAatB,wBAAwBqB,CAAAA;YAAOA;gBAAAA,iBAAAA,IAAIE,SAAS,cAAbF,qCAAAA,eAAeC,UAAU;;IAC3E,MAAME,qBAAqBxB,wBAAwBqB,CAAAA,MAAO,CAAC,CAACA,IAAIE,SAAS;IACzE,MAAME,aAAazB,wBAAwBqB,CAAAA;YAAOA;gBAAAA,iBAAAA,IAAIE,SAAS,cAAbF,qCAAAA,eAAeI,UAAU,CAACT;;IAE5E,MAAMU,uBAAuB1B,wBAAwBqB,CAAAA,MAAOA,IAAIJ,cAAc;IAC9E,MAAMU,wBAAwB3B,wBAAwBqB,CAAAA,MAAOA,IAAIH,eAAe;IAEhF,MAAMf,mBAAmBH,wBAAwBqB,CAAAA,MAAOA,IAAIO,EAAE;IAC9D,MAAMxB,aAAaS,MAAMe,EAAE,IAAI3B;IAE/BC,2BAA2BC,kBAAkBC;IAE7CK,oCAAoCC,WAAWC;IAE/C,MAAMkB,cAAuEhC,iBAAiBiC,CAAAA;QAC5FnB,oBAAAA,8BAAAA,QAAUmB;QAEV,IAAI,CAACN,sBAAsBM,EAAEC,gBAAgB,EAAE;YAC7C;QACF;QAEAT,uBAAAA,iCAAAA,WAAaQ,GAAGd;IAClB;IAEA,uFAAuF;IACvF,yDAAyD;IACzD,MAAMgB,mBAAmB,CAAC,CAACrB,WAAWa;IAEtC,MAAMS,oBAAoB;QACxBtB,SAASqB,mBAAmBH,cAAcK;QAC1Cf,WAAWA;QACXC,SAASA;IACX;IAEA,wEAAwE;IACxE,MAAMe,kBAAkBzC,mBAAmB,OAAOuC;IAElD,4EAA4E;IAC5E,MAAMG,cAAc1B,aAAac,qBAAqBW,kBAAkBF;IAExE,MAAMI,OAAOzC,KAAK0C,MAAM,CACtB3C,yBAAyBM,sBAAsB;QAC7Ca,KAAKA;QACLyB,UAAU7B,aAAac,qBAAqB,IAAIU;QAChDM,MAAM9B,YAAY,aAAa;QAC/BK,IAAI0B,OAAOzB;QACX,GAAIQ,sBAAsB;YACxBgB,MAAM;YACN,iBAAiBf;QACnB,CAAC;QACD,GAAGZ,KAAK;QACRM,WAAWiB,YAAYjB,SAAS;QAChCC,SAASgB,YAAYhB,OAAO;QAC5BT,SAASyB,YAAYzB,OAAO;IAC9B,IACA;QAAE+B,aAAazC;IAAqB;IAGtC,MAAM0C,QAAuB;QAC3BC,YAAY;YACVP,MAAMpC;YACN4C,OAAO;YACPC,QAAQ;YACRC,gBAAgB;YAChBC,aAAa;YACbC,cAAc;YACdC,UAAU;QACZ;QACAb;QACA3B;QACAyC,YAAY3B;QACZ4B,UAAU3B;QACVoB,OAAOjD,KAAKyD,QAAQ,CAACxC,MAAMgC,KAAK,EAAE;YAAEH,aAAa;QAAM;QACvDI,QAAQlD,KAAKyD,QAAQ,CAACxC,MAAMiC,MAAM,EAAE;YAAEJ,aAAa;QAAM;QACzDK,gBAAgBnD,KAAKyD,QAAQ,CAACxC,MAAMkC,cAAc,EAAE;YAAEL,aAAa;YAAOY,iBAAiB;QAAK;QAChGN,aAAapD,KAAKyD,QAAQ,CAACxC,MAAMmC,WAAW,EAAE;YAAEN,aAAa;QAAM;QACnEO,cAAcrD,KAAKyD,QAAQ,CAACxC,MAAMoC,YAAY,EAAE;YAAEP,aAAa;QAAM;QACrEQ,UAAUtD,KAAKyD,QAAQ,CAACxC,MAAMqC,QAAQ,EAAE;YAAER,aAAa;QAAM;QAC7DzB,gBAAgBA,2BAAAA,4BAAAA,iBAAkBS;QAClCR,iBAAiBA,4BAAAA,6BAAAA,kBAAmBS;IACtC;IAEA,OAAOgB;AACT,EAAE"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/List/ListItem/useListItemStyles.styles.ts"],"sourcesContent":["import type { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeStyles, makeResetStyles, mergeClasses } from '@griffel/react';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport type { ListItemSlots, ListItemState } from './ListItem.types';\nimport { tokens } from '@fluentui/react-theme';\n\nexport const listItemClassNames: SlotClassNames<ListItemSlots> = {\n root: 'fui-ListItem',\n media: 'fui-ListItem__media',\n header: 'fui-ListItem__header',\n contentWrapper: 'fui-ListItem__contentWrapper',\n headerMedia: 'fui-ListItem__headerMedia',\n contentMedia: 'fui-ListItem__contentMedia',\n endMedia: 'fui-ListItem__endMedia',\n};\n\nconst useRootBaseStyles = makeResetStyles({\n padding: '0 10px',\n margin: 0,\n textIndent: 0,\n listStyleType: 'none',\n ...createCustomFocusIndicatorStyle(\n {\n outline: `${tokens.strokeWidthThick} solid ${tokens.colorStrokeFocus2}`,\n borderRadius: tokens.borderRadiusMedium,\n },\n { selector: 'focus' },\n ),\n});\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n contentWrapper: {\n fontSize: tokens.fontSizeBase200,\n },\n\n // The content should go all the way to the end if the content media is not present\n contentWrapperWithoutMedia: {\n gridColumnEnd: 4,\n },\n truncate: {\n overflow: 'hidden',\n textWrap: 'nowrap',\n textOverflow: 'ellipsis',\n },\n rootSelected: {\n backgroundColor: tokens.colorNeutralBackground1Selected,\n },\n rootClickable: {\n cursor: 'pointer',\n\n '&:hover': {\n backgroundColor: tokens.colorNeutralBackground1Hover,\n },\n },\n});\n\n/**\n * Apply styling to the ListItem slots based on the state\n */\nexport const useListItemStyles_unstable = (state: ListItemState): ListItemState => {\n 'use no memo';\n\n const rootBaseStyles = useRootBaseStyles();\n const styles = useStyles();\n\n state.root.className = mergeClasses(\n listItemClassNames.root,\n rootBaseStyles,\n (state.selectable || state.navigable) && styles.rootClickable,\n state.selected && styles.rootSelected,\n state.root.className,\n );\n\n if (state.header) {\n state.header.className = mergeClasses(state.truncateHeader && styles.truncate, state.header?.className);\n }\n\n if (state.contentWrapper) {\n state.contentWrapper.className = mergeClasses(\n styles.contentWrapper,\n state.truncateContent && styles.truncate,\n !state.contentMedia && styles.contentWrapperWithoutMedia,\n state.contentWrapper?.className,\n );\n }\n\n return state;\n};\n"],"names":["makeStyles","makeResetStyles","mergeClasses","createCustomFocusIndicatorStyle","tokens","listItemClassNames","root","media","header","contentWrapper","headerMedia","contentMedia","endMedia","useRootBaseStyles","padding","margin","textIndent","listStyleType","outline","strokeWidthThick","colorStrokeFocus2","borderRadius","borderRadiusMedium","selector","useStyles","fontSize","fontSizeBase200","contentWrapperWithoutMedia","gridColumnEnd","truncate","overflow","textWrap","textOverflow","rootSelected","backgroundColor","colorNeutralBackground1Selected","rootClickable","cursor","colorNeutralBackground1Hover","useListItemStyles_unstable","state","rootBaseStyles","styles","className","selectable","navigable","selected","truncateHeader","truncateContent"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AACA,SAASA,UAAU,EAAEC,eAAe,EAAEC,YAAY,QAAQ,iBAAiB;AAC3E,SAASC,+BAA+B,QAAQ,0BAA0B;AAE1E,SAASC,MAAM,QAAQ,wBAAwB;AAE/C,OAAO,MAAMC,qBAAoD;IAC/DC,MAAM;IACNC,OAAO;IACPC,QAAQ;IACRC,gBAAgB;IAChBC,aAAa;IACbC,cAAc;IACdC,UAAU;AACZ,EAAE;AAEF,MAAMC,oBAAoBZ,gBAAgB;IACxCa,SAAS;IACTC,QAAQ;IACRC,YAAY;IACZC,eAAe;IACf,GAAGd,gCACD;QACEe,SAAS,CAAC,EAAEd,OAAOe,gBAAgB,CAAC,OAAO,EAAEf,OAAOgB,iBAAiB,CAAC,CAAC;QACvEC,cAAcjB,OAAOkB,kBAAkB;IACzC,GACA;QAAEC,UAAU;IAAQ,EACrB;AACH;AAEA;;CAEC,GACD,MAAMC,YAAYxB,WAAW;IAC3BS,gBAAgB;QACdgB,UAAUrB,OAAOsB,eAAe;IAClC;IAEA,mFAAmF;IACnFC,4BAA4B;QAC1BC,eAAe;IACjB;IACAC,UAAU;QACRC,UAAU;QACVC,UAAU;QACVC,cAAc;IAChB;IACAC,cAAc;QACZC,iBAAiB9B,OAAO+B,+BAA+B;IACzD;IACAC,eAAe;QACbC,QAAQ;QAER,WAAW;YACTH,iBAAiB9B,OAAOkC,4BAA4B;QACtD;IACF;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,6BAA6B,CAACC;IACzC;IAEA,MAAMC,iBAAiB5B;IACvB,MAAM6B,SAASlB;IAEfgB,MAAMlC,IAAI,CAACqC,SAAS,GAAGzC,aACrBG,mBAAmBC,IAAI,EACvBmC,gBACA,AAACD,CAAAA,MAAMI,UAAU,IAAIJ,MAAMK,SAAS,AAAD,KAAMH,OAAON,aAAa,EAC7DI,MAAMM,QAAQ,IAAIJ,OAAOT,YAAY,EACrCO,MAAMlC,IAAI,CAACqC,SAAS;IAGtB,IAAIH,MAAMhC,MAAM,EAAE;YAC+DgC;QAA/EA,MAAMhC,MAAM,CAACmC,SAAS,GAAGzC,aAAasC,MAAMO,cAAc,IAAIL,OAAOb,QAAQ,GAAEW,gBAAAA,MAAMhC,MAAM,cAAZgC,oCAAAA,cAAcG,SAAS;IACxG;IAEA,IAAIH,MAAM/B,cAAc,EAAE;YAKtB+B;QAJFA,MAAM/B,cAAc,CAACkC,SAAS,GAAGzC,aAC/BwC,OAAOjC,cAAc,EACrB+B,MAAMQ,eAAe,IAAIN,OAAOb,QAAQ,EACxC,CAACW,MAAM7B,YAAY,IAAI+B,OAAOf,0BAA0B,GACxDa,wBAAAA,MAAM/B,cAAc,cAApB+B,4CAAAA,sBAAsBG,SAAS;IAEnC;IAEA,OAAOH;AACT,EAAE"}
1
+ {"version":3,"sources":["../src/components/List/ListItem/useListItemStyles.styles.ts"],"sourcesContent":["import type { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeStyles, makeResetStyles, mergeClasses } from '@griffel/react';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport type { ListItemSlots, ListItemState } from './ListItem.types';\nimport { tokens } from '@fluentui/react-theme';\n\nexport const listItemClassNames: SlotClassNames<ListItemSlots> = {\n root: 'fui-ListItem',\n media: 'fui-ListItem__media',\n header: 'fui-ListItem__header',\n contentWrapper: 'fui-ListItem__contentWrapper',\n headerMedia: 'fui-ListItem__headerMedia',\n contentMedia: 'fui-ListItem__contentMedia',\n endMedia: 'fui-ListItem__endMedia',\n};\n\nconst useRootBaseStyles = makeResetStyles({\n padding: '0 10px',\n margin: 0,\n textIndent: 0,\n listStyleType: 'none',\n ...createCustomFocusIndicatorStyle(\n {\n outline: `${tokens.strokeWidthThick} solid ${tokens.colorStrokeFocus2}`,\n borderRadius: tokens.borderRadiusMedium,\n },\n { selector: 'focus' },\n ),\n});\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n contentWrapper: {\n fontSize: tokens.fontSizeBase200,\n },\n\n // The content should go all the way to the end if the content media is not present\n contentWrapperWithoutMedia: {\n gridColumnEnd: 4,\n },\n truncate: {\n overflow: 'hidden',\n textWrap: 'nowrap',\n textOverflow: 'ellipsis',\n },\n rootSelected: {\n backgroundColor: tokens.colorNeutralBackground1Selected,\n },\n rootClickable: {\n cursor: 'pointer',\n\n '&:hover': {\n backgroundColor: tokens.colorNeutralBackground1Hover,\n },\n },\n});\n\n/**\n * Apply styling to the ListItem slots based on the state\n */\nexport const useListItemStyles_unstable = (state: ListItemState): ListItemState => {\n 'use no memo';\n\n const rootBaseStyles = useRootBaseStyles();\n const styles = useStyles();\n\n state.root.className = mergeClasses(\n listItemClassNames.root,\n rootBaseStyles,\n (state.selectable || state.navigable) && styles.rootClickable,\n state.selected && styles.rootSelected,\n state.root.className,\n );\n\n if (state.header) {\n state.header.className = mergeClasses(state.truncateHeader && styles.truncate, state.header?.className);\n }\n\n if (state.contentWrapper) {\n state.contentWrapper.className = mergeClasses(\n styles.contentWrapper,\n state.truncateContent && styles.truncate,\n !state.contentMedia && styles.contentWrapperWithoutMedia,\n state.contentWrapper?.className,\n );\n }\n\n return state;\n};\n"],"names":["makeStyles","makeResetStyles","mergeClasses","createCustomFocusIndicatorStyle","tokens","listItemClassNames","root","media","header","contentWrapper","headerMedia","contentMedia","endMedia","useRootBaseStyles","padding","margin","textIndent","listStyleType","outline","strokeWidthThick","colorStrokeFocus2","borderRadius","borderRadiusMedium","selector","useStyles","fontSize","fontSizeBase200","contentWrapperWithoutMedia","gridColumnEnd","truncate","overflow","textWrap","textOverflow","rootSelected","backgroundColor","colorNeutralBackground1Selected","rootClickable","cursor","colorNeutralBackground1Hover","useListItemStyles_unstable","state","rootBaseStyles","styles","className","selectable","navigable","selected","truncateHeader","truncateContent"],"mappings":"AACA,SAASA,UAAU,EAAEC,eAAe,EAAEC,YAAY,QAAQ,iBAAiB;AAC3E,SAASC,+BAA+B,QAAQ,0BAA0B;AAE1E,SAASC,MAAM,QAAQ,wBAAwB;AAE/C,OAAO,MAAMC,qBAAoD;IAC/DC,MAAM;IACNC,OAAO;IACPC,QAAQ;IACRC,gBAAgB;IAChBC,aAAa;IACbC,cAAc;IACdC,UAAU;AACZ,EAAE;AAEF,MAAMC,oBAAoBZ,gBAAgB;IACxCa,SAAS;IACTC,QAAQ;IACRC,YAAY;IACZC,eAAe;IACf,GAAGd,gCACD;QACEe,SAAS,GAAGd,OAAOe,gBAAgB,CAAC,OAAO,EAAEf,OAAOgB,iBAAiB,EAAE;QACvEC,cAAcjB,OAAOkB,kBAAkB;IACzC,GACA;QAAEC,UAAU;IAAQ,EACrB;AACH;AAEA;;CAEC,GACD,MAAMC,YAAYxB,WAAW;IAC3BS,gBAAgB;QACdgB,UAAUrB,OAAOsB,eAAe;IAClC;IAEA,mFAAmF;IACnFC,4BAA4B;QAC1BC,eAAe;IACjB;IACAC,UAAU;QACRC,UAAU;QACVC,UAAU;QACVC,cAAc;IAChB;IACAC,cAAc;QACZC,iBAAiB9B,OAAO+B,+BAA+B;IACzD;IACAC,eAAe;QACbC,QAAQ;QAER,WAAW;YACTH,iBAAiB9B,OAAOkC,4BAA4B;QACtD;IACF;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,6BAA6B,CAACC;IACzC;IAEA,MAAMC,iBAAiB5B;IACvB,MAAM6B,SAASlB;IAEfgB,MAAMlC,IAAI,CAACqC,SAAS,GAAGzC,aACrBG,mBAAmBC,IAAI,EACvBmC,gBACA,AAACD,CAAAA,MAAMI,UAAU,IAAIJ,MAAMK,SAAS,AAAD,KAAMH,OAAON,aAAa,EAC7DI,MAAMM,QAAQ,IAAIJ,OAAOT,YAAY,EACrCO,MAAMlC,IAAI,CAACqC,SAAS;IAGtB,IAAIH,MAAMhC,MAAM,EAAE;YAC+DgC;QAA/EA,MAAMhC,MAAM,CAACmC,SAAS,GAAGzC,aAAasC,MAAMO,cAAc,IAAIL,OAAOb,QAAQ,GAAEW,gBAAAA,MAAMhC,MAAM,cAAZgC,oCAAAA,cAAcG,SAAS;IACxG;IAEA,IAAIH,MAAM/B,cAAc,EAAE;YAKtB+B;QAJFA,MAAM/B,cAAc,CAACkC,SAAS,GAAGzC,aAC/BwC,OAAOjC,cAAc,EACrB+B,MAAMQ,eAAe,IAAIN,OAAOb,QAAQ,EACxC,CAACW,MAAM7B,YAAY,IAAI+B,OAAOf,0BAA0B,GACxDa,wBAAAA,MAAM/B,cAAc,cAApB+B,4CAAAA,sBAAsBG,SAAS;IAEnC;IAEA,OAAOH;AACT,EAAE"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/List/hooks/index.ts"],"sourcesContent":["export { useListSelection } from './useListSelection';\n"],"names":["useListSelection"],"rangeMappings":"","mappings":"AAAA,SAASA,gBAAgB,QAAQ,qBAAqB"}
1
+ {"version":3,"sources":["../src/components/List/hooks/index.ts"],"sourcesContent":["export { useListSelection } from './useListSelection';\n"],"names":["useListSelection"],"mappings":"AAAA,SAASA,gBAAgB,QAAQ,qBAAqB"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/List/hooks/types.ts"],"sourcesContent":["import { SelectionItemId } from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nexport type ListSelectionState = {\n isSelected: (item: string | number) => boolean;\n toggleItem: (e: React.SyntheticEvent, id: string | number) => void;\n deselectItem: (e: React.SyntheticEvent, id: string | number) => void;\n selectItem: (e: React.SyntheticEvent, id: string | number) => void;\n clearSelection: (e: React.SyntheticEvent) => void;\n toggleAllItems: (e: React.SyntheticEvent, itemIds: string[] | number[]) => void;\n setSelectedItems: React.Dispatch<React.SetStateAction<Iterable<SelectionItemId>>>;\n selectedItems: SelectionItemId[];\n};\n"],"names":["React"],"rangeMappings":"","mappings":"AACA,YAAYA,WAAW,QAAQ"}
1
+ {"version":3,"sources":["../src/components/List/hooks/types.ts"],"sourcesContent":["import { SelectionItemId } from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nexport type ListSelectionState = {\n isSelected: (item: string | number) => boolean;\n toggleItem: (e: React.SyntheticEvent, id: string | number) => void;\n deselectItem: (e: React.SyntheticEvent, id: string | number) => void;\n selectItem: (e: React.SyntheticEvent, id: string | number) => void;\n clearSelection: (e: React.SyntheticEvent) => void;\n toggleAllItems: (e: React.SyntheticEvent, itemIds: string[] | number[]) => void;\n setSelectedItems: React.Dispatch<React.SetStateAction<Iterable<SelectionItemId>>>;\n selectedItems: SelectionItemId[];\n};\n"],"names":["React"],"mappings":"AACA,YAAYA,WAAW,QAAQ"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/List/hooks/useListSelection.tsx"],"sourcesContent":["import { SelectionHookParams, useControllableState, useEventCallback, useSelection } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport type { ListSelectionState } from './types';\n\nexport function useListSelection(options: SelectionHookParams = { selectionMode: 'multiselect' }): ListSelectionState {\n const { selectionMode, defaultSelectedItems, onSelectionChange } = options;\n\n const [selectedItems, setSelectedItems] = useControllableState({\n state: options.selectedItems,\n defaultState: defaultSelectedItems,\n initialState: [],\n });\n\n const [selected, selectionMethods] = useSelection({\n selectionMode,\n defaultSelectedItems,\n selectedItems,\n onSelectionChange: (e, data) => {\n setSelectedItems(data.selectedItems);\n onSelectionChange?.(e, data);\n },\n });\n\n const toggleItem: ListSelectionState['toggleItem'] = useEventCallback((e, itemId) =>\n selectionMethods.toggleItem(e, itemId),\n );\n\n const toggleAllItems: ListSelectionState['toggleAllItems'] = useEventCallback((e, itemIds) => {\n selectionMethods.toggleAllItems(e, itemIds);\n });\n\n const deselectItem: ListSelectionState['deselectItem'] = useEventCallback((e, itemId: string | number) =>\n selectionMethods.deselectItem(e, itemId),\n );\n\n const selectItem: ListSelectionState['selectItem'] = useEventCallback((e, itemId: string | number) =>\n selectionMethods.selectItem(e, itemId),\n );\n\n const clearSelection: ListSelectionState['clearSelection'] = useEventCallback(e => selectionMethods.clearItems(e));\n\n const selectedArray = React.useMemo(() => Array.from(selected), [selected]);\n\n return {\n selectedItems: selectedArray,\n toggleItem,\n toggleAllItems,\n deselectItem,\n selectItem,\n setSelectedItems,\n isSelected: (id: string | number) => selectionMethods.isSelected(id),\n clearSelection,\n };\n}\n"],"names":["useControllableState","useEventCallback","useSelection","React","useListSelection","options","selectionMode","defaultSelectedItems","onSelectionChange","selectedItems","setSelectedItems","state","defaultState","initialState","selected","selectionMethods","e","data","toggleItem","itemId","toggleAllItems","itemIds","deselectItem","selectItem","clearSelection","clearItems","selectedArray","useMemo","Array","from","isSelected","id"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SAA8BA,oBAAoB,EAAEC,gBAAgB,EAAEC,YAAY,QAAQ,4BAA4B;AACtH,YAAYC,WAAW,QAAQ;AAG/B,OAAO,SAASC,iBAAiBC,UAA+B;IAAEC,eAAe;AAAc,CAAC;IAC9F,MAAM,EAAEA,aAAa,EAAEC,oBAAoB,EAAEC,iBAAiB,EAAE,GAAGH;IAEnE,MAAM,CAACI,eAAeC,iBAAiB,GAAGV,qBAAqB;QAC7DW,OAAON,QAAQI,aAAa;QAC5BG,cAAcL;QACdM,cAAc,EAAE;IAClB;IAEA,MAAM,CAACC,UAAUC,iBAAiB,GAAGb,aAAa;QAChDI;QACAC;QACAE;QACAD,mBAAmB,CAACQ,GAAGC;YACrBP,iBAAiBO,KAAKR,aAAa;YACnCD,8BAAAA,wCAAAA,kBAAoBQ,GAAGC;QACzB;IACF;IAEA,MAAMC,aAA+CjB,iBAAiB,CAACe,GAAGG,SACxEJ,iBAAiBG,UAAU,CAACF,GAAGG;IAGjC,MAAMC,iBAAuDnB,iBAAiB,CAACe,GAAGK;QAChFN,iBAAiBK,cAAc,CAACJ,GAAGK;IACrC;IAEA,MAAMC,eAAmDrB,iBAAiB,CAACe,GAAGG,SAC5EJ,iBAAiBO,YAAY,CAACN,GAAGG;IAGnC,MAAMI,aAA+CtB,iBAAiB,CAACe,GAAGG,SACxEJ,iBAAiBQ,UAAU,CAACP,GAAGG;IAGjC,MAAMK,iBAAuDvB,iBAAiBe,CAAAA,IAAKD,iBAAiBU,UAAU,CAACT;IAE/G,MAAMU,gBAAgBvB,MAAMwB,OAAO,CAAC,IAAMC,MAAMC,IAAI,CAACf,WAAW;QAACA;KAAS;IAE1E,OAAO;QACLL,eAAeiB;QACfR;QACAE;QACAE;QACAC;QACAb;QACAoB,YAAY,CAACC,KAAwBhB,iBAAiBe,UAAU,CAACC;QACjEP;IACF;AACF"}
1
+ {"version":3,"sources":["../src/components/List/hooks/useListSelection.tsx"],"sourcesContent":["import { SelectionHookParams, useControllableState, useEventCallback, useSelection } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport type { ListSelectionState } from './types';\n\nexport function useListSelection(options: SelectionHookParams = { selectionMode: 'multiselect' }): ListSelectionState {\n const { selectionMode, defaultSelectedItems, onSelectionChange } = options;\n\n const [selectedItems, setSelectedItems] = useControllableState({\n state: options.selectedItems,\n defaultState: defaultSelectedItems,\n initialState: [],\n });\n\n const [selected, selectionMethods] = useSelection({\n selectionMode,\n defaultSelectedItems,\n selectedItems,\n onSelectionChange: (e, data) => {\n setSelectedItems(data.selectedItems);\n onSelectionChange?.(e, data);\n },\n });\n\n const toggleItem: ListSelectionState['toggleItem'] = useEventCallback((e, itemId) =>\n selectionMethods.toggleItem(e, itemId),\n );\n\n const toggleAllItems: ListSelectionState['toggleAllItems'] = useEventCallback((e, itemIds) => {\n selectionMethods.toggleAllItems(e, itemIds);\n });\n\n const deselectItem: ListSelectionState['deselectItem'] = useEventCallback((e, itemId: string | number) =>\n selectionMethods.deselectItem(e, itemId),\n );\n\n const selectItem: ListSelectionState['selectItem'] = useEventCallback((e, itemId: string | number) =>\n selectionMethods.selectItem(e, itemId),\n );\n\n const clearSelection: ListSelectionState['clearSelection'] = useEventCallback(e => selectionMethods.clearItems(e));\n\n const selectedArray = React.useMemo(() => Array.from(selected), [selected]);\n\n return {\n selectedItems: selectedArray,\n toggleItem,\n toggleAllItems,\n deselectItem,\n selectItem,\n setSelectedItems,\n isSelected: (id: string | number) => selectionMethods.isSelected(id),\n clearSelection,\n };\n}\n"],"names":["useControllableState","useEventCallback","useSelection","React","useListSelection","options","selectionMode","defaultSelectedItems","onSelectionChange","selectedItems","setSelectedItems","state","defaultState","initialState","selected","selectionMethods","e","data","toggleItem","itemId","toggleAllItems","itemIds","deselectItem","selectItem","clearSelection","clearItems","selectedArray","useMemo","Array","from","isSelected","id"],"mappings":"AAAA,SAA8BA,oBAAoB,EAAEC,gBAAgB,EAAEC,YAAY,QAAQ,4BAA4B;AACtH,YAAYC,WAAW,QAAQ;AAG/B,OAAO,SAASC,iBAAiBC,UAA+B;IAAEC,eAAe;AAAc,CAAC;IAC9F,MAAM,EAAEA,aAAa,EAAEC,oBAAoB,EAAEC,iBAAiB,EAAE,GAAGH;IAEnE,MAAM,CAACI,eAAeC,iBAAiB,GAAGV,qBAAqB;QAC7DW,OAAON,QAAQI,aAAa;QAC5BG,cAAcL;QACdM,cAAc,EAAE;IAClB;IAEA,MAAM,CAACC,UAAUC,iBAAiB,GAAGb,aAAa;QAChDI;QACAC;QACAE;QACAD,mBAAmB,CAACQ,GAAGC;YACrBP,iBAAiBO,KAAKR,aAAa;YACnCD,8BAAAA,wCAAAA,kBAAoBQ,GAAGC;QACzB;IACF;IAEA,MAAMC,aAA+CjB,iBAAiB,CAACe,GAAGG,SACxEJ,iBAAiBG,UAAU,CAACF,GAAGG;IAGjC,MAAMC,iBAAuDnB,iBAAiB,CAACe,GAAGK;QAChFN,iBAAiBK,cAAc,CAACJ,GAAGK;IACrC;IAEA,MAAMC,eAAmDrB,iBAAiB,CAACe,GAAGG,SAC5EJ,iBAAiBO,YAAY,CAACN,GAAGG;IAGnC,MAAMI,aAA+CtB,iBAAiB,CAACe,GAAGG,SACxEJ,iBAAiBQ,UAAU,CAACP,GAAGG;IAGjC,MAAMK,iBAAuDvB,iBAAiBe,CAAAA,IAAKD,iBAAiBU,UAAU,CAACT;IAE/G,MAAMU,gBAAgBvB,MAAMwB,OAAO,CAAC,IAAMC,MAAMC,IAAI,CAACf,WAAW;QAACA;KAAS;IAE1E,OAAO;QACLL,eAAeiB;QACfR;QACAE;QACAE;QACAC;QACAb;QACAoB,YAAY,CAACC,KAAwBhB,iBAAiBe,UAAU,CAACC;QACjEP;IACF;AACF"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/List/index.ts"],"sourcesContent":["export { List, listClassNames, renderList_unstable, useListStyles_unstable, useList_unstable } from './List';\nexport type { ListProps, ListSlots, ListState } from './List';\n\nexport {\n ListItem,\n listItemClassNames,\n renderListItem_unstable,\n useListItemStyles_unstable,\n useListItem_unstable,\n} from './ListItem';\nexport type { ListItemProps, ListItemSlots, ListItemState } from './ListItem';\n\nexport { useListSelection } from './hooks';\n"],"names":["List","listClassNames","renderList_unstable","useListStyles_unstable","useList_unstable","ListItem","listItemClassNames","renderListItem_unstable","useListItemStyles_unstable","useListItem_unstable","useListSelection"],"rangeMappings":";;","mappings":"AAAA,SAASA,IAAI,EAAEC,cAAc,EAAEC,mBAAmB,EAAEC,sBAAsB,EAAEC,gBAAgB,QAAQ,SAAS;AAG7G,SACEC,QAAQ,EACRC,kBAAkB,EAClBC,uBAAuB,EACvBC,0BAA0B,EAC1BC,oBAAoB,QACf,aAAa;AAGpB,SAASC,gBAAgB,QAAQ,UAAU"}
1
+ {"version":3,"sources":["../src/components/List/index.ts"],"sourcesContent":["export { List, listClassNames, renderList_unstable, useListStyles_unstable, useList_unstable } from './List';\nexport type { ListProps, ListSlots, ListState } from './List';\n\nexport {\n ListItem,\n listItemClassNames,\n renderListItem_unstable,\n useListItemStyles_unstable,\n useListItem_unstable,\n} from './ListItem';\nexport type { ListItemProps, ListItemSlots, ListItemState } from './ListItem';\n\nexport { useListSelection } from './hooks';\n"],"names":["List","listClassNames","renderList_unstable","useListStyles_unstable","useList_unstable","ListItem","listItemClassNames","renderListItem_unstable","useListItemStyles_unstable","useListItem_unstable","useListSelection"],"mappings":"AAAA,SAASA,IAAI,EAAEC,cAAc,EAAEC,mBAAmB,EAAEC,sBAAsB,EAAEC,gBAAgB,QAAQ,SAAS;AAG7G,SACEC,QAAQ,EACRC,kBAAkB,EAClBC,uBAAuB,EACvBC,0BAA0B,EAC1BC,oBAAoB,QACf,aAAa;AAGpB,SAASC,gBAAgB,QAAQ,UAAU"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Primitive/Primitive.tsx"],"sourcesContent":["import * as React from 'react';\nimport { mergeClasses } from '@fluentui/react-components';\n\n// Simplified version from https://github.com/reach/reach-ui/blob/55d28eda39afc4c667e97f5f62a48d1de034b93f/packages/utils/src/polymorphic.ts\ninterface PrimitiveComponent {\n /**\n * Infers props from JSX.IntrinsicElements based on \"as\" value. Explicitly avoids `React.ElementType` and manually\n * narrow the prop types so that events are typed when using JSX.IntrinsicElements.\n */\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n <As extends keyof JSX.IntrinsicElements>(props: { as?: As } & JSX.IntrinsicElements[As]): React.ReactElement | null;\n\n displayName: string;\n}\n\nexport const primitiveClassName = 'fui-Primitive';\n\nexport const Primitive = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLElement> & { as: 'div' }>(\n (props, ref) => {\n const { as: Component = 'div', ...rest } = props;\n\n const dir = typeof props.children === 'string' ? 'auto' : undefined;\n\n const className = mergeClasses(primitiveClassName, props.className);\n\n return <Component dir={dir} {...rest} className={className} ref={ref} />;\n },\n) as PrimitiveComponent;\n\nPrimitive.displayName = 'Primitive';\n"],"names":["React","mergeClasses","primitiveClassName","Primitive","forwardRef","props","ref","as","Component","rest","dir","children","undefined","className","displayName"],"rangeMappings":";;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,YAAY,QAAQ,6BAA6B;AAc1D,OAAO,MAAMC,qBAAqB,gBAAgB;AAElD,OAAO,MAAMC,0BAAYH,MAAMI,UAAU,CACvC,CAACC,OAAOC;IACN,MAAM,EAAEC,IAAIC,YAAY,KAAK,EAAE,GAAGC,MAAM,GAAGJ;IAE3C,MAAMK,MAAM,OAAOL,MAAMM,QAAQ,KAAK,WAAW,SAASC;IAE1D,MAAMC,YAAYZ,aAAaC,oBAAoBG,MAAMQ,SAAS;IAElE,qBAAO,oBAACL;QAAUE,KAAKA;QAAM,GAAGD,IAAI;QAAEI,WAAWA;QAAWP,KAAKA;;AACnE,GACsB;AAExBH,UAAUW,WAAW,GAAG"}
1
+ {"version":3,"sources":["../src/components/Primitive/Primitive.tsx"],"sourcesContent":["import * as React from 'react';\nimport { mergeClasses } from '@fluentui/react-components';\nimport type { JSXIntrinsicElement, JSXIntrinsicElementKeys } from '@fluentui/react-utilities';\n\n// Simplified version from https://github.com/reach/reach-ui/blob/55d28eda39afc4c667e97f5f62a48d1de034b93f/packages/utils/src/polymorphic.ts\ninterface PrimitiveComponent {\n /**\n * Infers props from JSX.IntrinsicElements based on \"as\" value. Explicitly avoids `React.ElementType` and manually\n * narrow the prop types so that events are typed when using JSX.IntrinsicElements.\n */\n <As extends JSXIntrinsicElementKeys>(props: { as?: As } & JSXIntrinsicElement<As>): React.ReactElement | null;\n\n displayName: string;\n}\n\nexport const primitiveClassName = 'fui-Primitive';\n\nexport const Primitive = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLElement> & { as: 'div' }>(\n (props, ref) => {\n const { as: Component = 'div', ...rest } = props;\n\n const dir = typeof props.children === 'string' ? 'auto' : undefined;\n\n const className = mergeClasses(primitiveClassName, props.className);\n\n return <Component dir={dir} {...rest} className={className} ref={ref} />;\n },\n) as PrimitiveComponent;\n\nPrimitive.displayName = 'Primitive';\n"],"names":["React","mergeClasses","primitiveClassName","Primitive","forwardRef","props","ref","as","Component","rest","dir","children","undefined","className","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,YAAY,QAAQ,6BAA6B;AAc1D,OAAO,MAAMC,qBAAqB,gBAAgB;AAElD,OAAO,MAAMC,0BAAYH,MAAMI,UAAU,CACvC,CAACC,OAAOC;IACN,MAAM,EAAEC,IAAIC,YAAY,KAAK,EAAE,GAAGC,MAAM,GAAGJ;IAE3C,MAAMK,MAAM,OAAOL,MAAMM,QAAQ,KAAK,WAAW,SAASC;IAE1D,MAAMC,YAAYZ,aAAaC,oBAAoBG,MAAMQ,SAAS;IAElE,qBAAO,oBAACL;QAAUE,KAAKA;QAAM,GAAGD,IAAI;QAAEI,WAAWA;QAAWP,KAAKA;;AACnE,GACsB;AAExBH,UAAUW,WAAW,GAAG"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Primitive/index.tsx"],"sourcesContent":["export { Primitive, primitiveClassName } from './Primitive';\n"],"names":["Primitive","primitiveClassName"],"rangeMappings":"","mappings":"AAAA,SAASA,SAAS,EAAEC,kBAAkB,QAAQ,cAAc"}
1
+ {"version":3,"sources":["../src/components/Primitive/index.tsx"],"sourcesContent":["export { Primitive, primitiveClassName } from './Primitive';\n"],"names":["Primitive","primitiveClassName"],"mappings":"AAAA,SAASA,SAAS,EAAEC,kBAAkB,QAAQ,cAAc"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Segment/Segment.tsx"],"sourcesContent":["import { mergeClasses } from '@fluentui/react-components';\nimport * as React from 'react';\n\nimport { useSegmentStyles } from './Segment.styles';\n\nexport const segmentClassName = 'fui-Segment';\n\nexport const Segment = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLElement>>((props, ref) => {\n const { children, className, ...rest } = props;\n const classes = useSegmentStyles();\n\n const segmentClasses = mergeClasses(segmentClassName, classes.segment, className);\n\n return (\n <div ref={ref} className={segmentClasses} {...rest}>\n {children}\n </div>\n );\n});\n\nSegment.displayName = 'Segment';\n"],"names":["mergeClasses","React","useSegmentStyles","segmentClassName","Segment","forwardRef","props","ref","children","className","rest","classes","segmentClasses","segment","div","displayName"],"rangeMappings":";;;;;;;;;;;;;;","mappings":"AAAA,SAASA,YAAY,QAAQ,6BAA6B;AAC1D,YAAYC,WAAW,QAAQ;AAE/B,SAASC,gBAAgB,QAAQ,mBAAmB;AAEpD,OAAO,MAAMC,mBAAmB,cAAc;AAE9C,OAAO,MAAMC,wBAAUH,MAAMI,UAAU,CAAoD,CAACC,OAAOC;IACjG,MAAM,EAAEC,QAAQ,EAAEC,SAAS,EAAE,GAAGC,MAAM,GAAGJ;IACzC,MAAMK,UAAUT;IAEhB,MAAMU,iBAAiBZ,aAAaG,kBAAkBQ,QAAQE,OAAO,EAAEJ;IAEvE,qBACE,oBAACK;QAAIP,KAAKA;QAAKE,WAAWG;QAAiB,GAAGF,IAAI;OAC/CF;AAGP,GAAG;AAEHJ,QAAQW,WAAW,GAAG"}
1
+ {"version":3,"sources":["../src/components/Segment/Segment.tsx"],"sourcesContent":["import { mergeClasses } from '@fluentui/react-components';\nimport * as React from 'react';\n\nimport { useSegmentStyles } from './Segment.styles';\n\nexport const segmentClassName = 'fui-Segment';\n\nexport const Segment = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLElement>>((props, ref) => {\n const { children, className, ...rest } = props;\n const classes = useSegmentStyles();\n\n const segmentClasses = mergeClasses(segmentClassName, classes.segment, className);\n\n return (\n <div ref={ref} className={segmentClasses} {...rest}>\n {children}\n </div>\n );\n});\n\nSegment.displayName = 'Segment';\n"],"names":["mergeClasses","React","useSegmentStyles","segmentClassName","Segment","forwardRef","props","ref","children","className","rest","classes","segmentClasses","segment","div","displayName"],"mappings":"AAAA,SAASA,YAAY,QAAQ,6BAA6B;AAC1D,YAAYC,WAAW,QAAQ;AAE/B,SAASC,gBAAgB,QAAQ,mBAAmB;AAEpD,OAAO,MAAMC,mBAAmB,cAAc;AAE9C,OAAO,MAAMC,wBAAUH,MAAMI,UAAU,CAAoD,CAACC,OAAOC;IACjG,MAAM,EAAEC,QAAQ,EAAEC,SAAS,EAAE,GAAGC,MAAM,GAAGJ;IACzC,MAAMK,UAAUT;IAEhB,MAAMU,iBAAiBZ,aAAaG,kBAAkBQ,QAAQE,OAAO,EAAEJ;IAEvE,qBACE,oBAACK;QAAIP,KAAKA;QAAKE,WAAWG;QAAiB,GAAGF,IAAI;OAC/CF;AAGP,GAAG;AAEHJ,QAAQW,WAAW,GAAG"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Segment/Segment.styles.ts"],"sourcesContent":["import { makeStyles, shorthands, tokens } from '@fluentui/react-components';\n\nexport const useSegmentStyles = makeStyles({\n segment: {\n padding: '1em',\n ...shorthands.borderWidth('2px', 0, 0),\n ...shorthands.borderColor('transparent'),\n ...shorthands.borderStyle('solid'),\n backgroundColor: tokens.colorNeutralBackground1,\n boxShadow: `0 1px 1px 1px ${tokens.colorNeutralShadowKey}`,\n },\n});\n"],"names":["makeStyles","shorthands","tokens","useSegmentStyles","segment","padding","borderWidth","borderColor","borderStyle","backgroundColor","colorNeutralBackground1","boxShadow","colorNeutralShadowKey"],"rangeMappings":";;;;;;;;;;","mappings":"AAAA,SAASA,UAAU,EAAEC,UAAU,EAAEC,MAAM,QAAQ,6BAA6B;AAE5E,OAAO,MAAMC,mBAAmBH,WAAW;IACzCI,SAAS;QACPC,SAAS;QACT,GAAGJ,WAAWK,WAAW,CAAC,OAAO,GAAG,EAAE;QACtC,GAAGL,WAAWM,WAAW,CAAC,cAAc;QACxC,GAAGN,WAAWO,WAAW,CAAC,QAAQ;QAClCC,iBAAiBP,OAAOQ,uBAAuB;QAC/CC,WAAW,CAAC,cAAc,EAAET,OAAOU,qBAAqB,CAAC,CAAC;IAC5D;AACF,GAAG"}
1
+ {"version":3,"sources":["../src/components/Segment/Segment.styles.ts"],"sourcesContent":["import { makeStyles, shorthands, tokens } from '@fluentui/react-components';\n\nexport const useSegmentStyles = makeStyles({\n segment: {\n padding: '1em',\n ...shorthands.borderWidth('2px', 0, 0),\n ...shorthands.borderColor('transparent'),\n ...shorthands.borderStyle('solid'),\n backgroundColor: tokens.colorNeutralBackground1,\n boxShadow: `0 1px 1px 1px ${tokens.colorNeutralShadowKey}`,\n },\n});\n"],"names":["makeStyles","shorthands","tokens","useSegmentStyles","segment","padding","borderWidth","borderColor","borderStyle","backgroundColor","colorNeutralBackground1","boxShadow","colorNeutralShadowKey"],"mappings":"AAAA,SAASA,UAAU,EAAEC,UAAU,EAAEC,MAAM,QAAQ,6BAA6B;AAE5E,OAAO,MAAMC,mBAAmBH,WAAW;IACzCI,SAAS;QACPC,SAAS;QACT,GAAGJ,WAAWK,WAAW,CAAC,OAAO,GAAG,EAAE;QACtC,GAAGL,WAAWM,WAAW,CAAC,cAAc;QACxC,GAAGN,WAAWO,WAAW,CAAC,QAAQ;QAClCC,iBAAiBP,OAAOQ,uBAAuB;QAC/CC,WAAW,CAAC,cAAc,EAAET,OAAOU,qBAAqB,EAAE;IAC5D;AACF,GAAG"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Segment/index.ts"],"sourcesContent":["export { Segment, segmentClassName } from './Segment';\n"],"names":["Segment","segmentClassName"],"rangeMappings":"","mappings":"AAAA,SAASA,OAAO,EAAEC,gBAAgB,QAAQ,YAAY"}
1
+ {"version":3,"sources":["../src/components/Segment/index.ts"],"sourcesContent":["export { Segment, segmentClassName } from './Segment';\n"],"names":["Segment","segmentClassName"],"mappings":"AAAA,SAASA,OAAO,EAAEC,gBAAgB,QAAQ,YAAY"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Slider/Slider.mixins.ts"],"sourcesContent":["import { GriffelStyle } from '@fluentui/react-components';\n\nconst fluid = (): GriffelStyle => ({ width: '100%' });\n\nexport const slider = {\n fluid,\n};\n"],"names":["fluid","width","slider"],"rangeMappings":";;;;;","mappings":"AAEA,MAAMA,QAAQ,IAAqB,CAAA;QAAEC,OAAO;IAAO,CAAA;AAEnD,OAAO,MAAMC,SAAS;IACpBF;AACF,EAAE"}
1
+ {"version":3,"sources":["../src/components/Slider/Slider.mixins.ts"],"sourcesContent":["import { GriffelStyle } from '@fluentui/react-components';\n\nconst fluid = (): GriffelStyle => ({ width: '100%' });\n\nexport const slider = {\n fluid,\n};\n"],"names":["fluid","width","slider"],"mappings":"AAEA,MAAMA,QAAQ,IAAqB,CAAA;QAAEC,OAAO;IAAO,CAAA;AAEnD,OAAO,MAAMC,SAAS;IACpBF;AACF,EAAE"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Slider/index.ts"],"sourcesContent":["export { slider } from './Slider.mixins';\n"],"names":["slider"],"rangeMappings":"","mappings":"AAAA,SAASA,MAAM,QAAQ,kBAAkB"}
1
+ {"version":3,"sources":["../src/components/Slider/index.ts"],"sourcesContent":["export { slider } from './Slider.mixins';\n"],"names":["slider"],"mappings":"AAAA,SAASA,MAAM,QAAQ,kBAAkB"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Spinner/SpinnerMigration.mixins.ts"],"sourcesContent":["import { GriffelStyle, tokens, labelClassNames } from '@fluentui/react-components';\n\nconst v0Inline = (): GriffelStyle => ({ display: 'inline-flex' });\n\nconst v0SpinnerLabelStyle = (): GriffelStyle => ({\n [`& .${labelClassNames.root}`]: {\n fontSize: '14px',\n fontWeight: tokens.fontWeightMedium,\n },\n});\n\nexport const spinner = {\n v0Inline,\n v0SpinnerLabelStyle,\n};\n"],"names":["tokens","labelClassNames","v0Inline","display","v0SpinnerLabelStyle","root","fontSize","fontWeight","fontWeightMedium","spinner"],"rangeMappings":";;;;;;;;;;;;;","mappings":"AAAA,SAAuBA,MAAM,EAAEC,eAAe,QAAQ,6BAA6B;AAEnF,MAAMC,WAAW,IAAqB,CAAA;QAAEC,SAAS;IAAc,CAAA;AAE/D,MAAMC,sBAAsB,IAAqB,CAAA;QAC/C,CAAC,CAAC,GAAG,EAAEH,gBAAgBI,IAAI,CAAC,CAAC,CAAC,EAAE;YAC9BC,UAAU;YACVC,YAAYP,OAAOQ,gBAAgB;QACrC;IACF,CAAA;AAEA,OAAO,MAAMC,UAAU;IACrBP;IACAE;AACF,EAAE"}
1
+ {"version":3,"sources":["../src/components/Spinner/SpinnerMigration.mixins.ts"],"sourcesContent":["import { GriffelStyle, tokens, labelClassNames } from '@fluentui/react-components';\n\nconst v0Inline = (): GriffelStyle => ({ display: 'inline-flex' });\n\nconst v0SpinnerLabelStyle = (): GriffelStyle => ({\n [`& .${labelClassNames.root}`]: {\n fontSize: '14px',\n fontWeight: tokens.fontWeightMedium,\n },\n});\n\nexport const spinner = {\n v0Inline,\n v0SpinnerLabelStyle,\n};\n"],"names":["tokens","labelClassNames","v0Inline","display","v0SpinnerLabelStyle","root","fontSize","fontWeight","fontWeightMedium","spinner"],"mappings":"AAAA,SAAuBA,MAAM,EAAEC,eAAe,QAAQ,6BAA6B;AAEnF,MAAMC,WAAW,IAAqB,CAAA;QAAEC,SAAS;IAAc,CAAA;AAE/D,MAAMC,sBAAsB,IAAqB,CAAA;QAC/C,CAAC,CAAC,GAAG,EAAEH,gBAAgBI,IAAI,EAAE,CAAC,EAAE;YAC9BC,UAAU;YACVC,YAAYP,OAAOQ,gBAAgB;QACrC;IACF,CAAA;AAEA,OAAO,MAAMC,UAAU;IACrBP;IACAE;AACF,EAAE"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Spinner/index.tsx"],"sourcesContent":["export { spinner } from './SpinnerMigration.mixins';\n"],"names":["spinner"],"rangeMappings":"","mappings":"AAAA,SAASA,OAAO,QAAQ,4BAA4B"}
1
+ {"version":3,"sources":["../src/components/Spinner/index.tsx"],"sourcesContent":["export { spinner } from './SpinnerMigration.mixins';\n"],"names":["spinner"],"mappings":"AAAA,SAASA,OAAO,QAAQ,4BAA4B"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/StyledText/StyledText.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport * as React from 'react';\nimport { getIntrinsicElementProps, mergeClasses, Slot, ComponentProps, slot } from '@fluentui/react-components';\nimport { useSizeStyles, useStyles, useWeightStyles } from './StyledText.styles';\n\nexport type StyledTextSlots = {\n root: Slot<'span', 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'p' | 'pre' | 'time'>;\n};\n\nexport type StyledTextProps = ComponentProps<StyledTextSlots> & {\n /**\n * Aligns text based on the parent container.\n */\n align?: 'start' | 'center' | 'end' | 'justify';\n\n /**\n * At mentions can be formatted to draw users' attention.\n * Mentions for \"me\" can be formatted to appear differently.\n */\n atMention?: 'me' | boolean;\n\n /**\n * Set as disabled StyledText component\n */\n disabled?: boolean;\n\n /**\n * Set as error StyledText component\n */\n error?: boolean;\n\n /**\n * The StyledText can appear more important and draw user's attention\n */\n important?: boolean;\n\n /**\n * Applies font size and line height based on the theme tokens.\n */\n size?:\n | 'smaller'\n | 'small'\n | 'medium'\n | 'large'\n | 'large500'\n | 'larger'\n | 'largest'\n | 100\n | 200\n | 300\n | 400\n | 500\n | 600\n | 700;\n\n /**\n * Set as success StyledText component\n */\n success?: boolean;\n\n /**\n * The text can signify a temporary state\n */\n temporary?: boolean;\n\n /**\n * Set as timestamp StyledText component\n */\n timestamp?: boolean;\n\n /**\n * Truncate overflowing text for block displays.\n */\n truncate?: boolean;\n\n /**\n * Applies font weight to the content.\n */\n weight?: 'light' | 'semilight' | 'regular' | 'medium' | 'semibold' | 'bold';\n\n /**\n * Wraps the text content on white spaces.\n *\n * @default true\n */\n wrap?: boolean;\n};\n\nexport const styledTextClassName = 'fui-StyledText';\n\nconst sizeMap: Record<string, 'base100' | 'base200' | 'base300' | 'base400' | 'base500' | 'base600' | 'hero700'> = {\n '100': 'base100',\n '200': 'base200',\n '300': 'base300',\n '400': 'base400',\n '500': 'base500',\n '600': 'base600',\n '700': 'hero700',\n smaller: 'base100',\n small: 'base200',\n medium: 'base300',\n large: 'base400',\n large500: 'base500',\n larger: 'base600',\n largest: 'hero700',\n};\n\nexport const StyledText = React.forwardRef<HTMLSpanElement, StyledTextProps>((props, ref) => {\n const {\n align,\n atMention,\n disabled,\n error,\n important,\n success,\n temporary,\n timestamp,\n truncate,\n weight,\n wrap = true,\n } = props;\n\n const dir = typeof props.children === 'string' ? 'auto' : undefined;\n\n const sizeStyles = useSizeStyles();\n const weightStyles = useWeightStyles();\n const styles = useStyles();\n\n const size = props.size ? sizeMap[props.size] : props.size;\n\n const RootSlot = slot.always(\n getIntrinsicElementProps('span', {\n ref,\n ...props,\n dir,\n className: mergeClasses(\n styledTextClassName,\n size && sizeStyles[size],\n weight && weightStyles[weight],\n wrap === false && styles.nowrap,\n truncate && styles.truncate,\n align === 'center' && styles.alignCenter,\n align === 'end' && styles.alignEnd,\n align === 'justify' && styles.alignJustify,\n\n atMention && styles.mention,\n atMention === 'me' && styles.mentionMe,\n disabled && styles.disabled,\n error && styles.error,\n important && styles.important,\n success && styles.success,\n temporary && styles.temporary,\n timestamp && styles.timestamp,\n props.className,\n ),\n }),\n { elementType: 'span' },\n );\n\n return <RootSlot />;\n});\n\nStyledText.displayName = 'StyledText';\n"],"names":["React","getIntrinsicElementProps","mergeClasses","slot","useSizeStyles","useStyles","useWeightStyles","styledTextClassName","sizeMap","smaller","small","medium","large","large500","larger","largest","StyledText","forwardRef","props","ref","align","atMention","disabled","error","important","success","temporary","timestamp","truncate","weight","wrap","dir","children","undefined","sizeStyles","weightStyles","styles","size","RootSlot","always","className","nowrap","alignCenter","alignEnd","alignJustify","mention","mentionMe","elementType","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,EAAEC,YAAY,EAAwBC,IAAI,QAAQ,6BAA6B;AAChH,SAASC,aAAa,EAAEC,SAAS,EAAEC,eAAe,QAAQ,sBAAsB;AAqFhF,OAAO,MAAMC,sBAAsB,iBAAiB;AAEpD,MAAMC,UAA6G;IACjH,OAAO;IACP,OAAO;IACP,OAAO;IACP,OAAO;IACP,OAAO;IACP,OAAO;IACP,OAAO;IACPC,SAAS;IACTC,OAAO;IACPC,QAAQ;IACRC,OAAO;IACPC,UAAU;IACVC,QAAQ;IACRC,SAAS;AACX;AAEA,OAAO,MAAMC,2BAAahB,MAAMiB,UAAU,CAAmC,CAACC,OAAOC;IACnF,MAAM,EACJC,KAAK,EACLC,SAAS,EACTC,QAAQ,EACRC,KAAK,EACLC,SAAS,EACTC,OAAO,EACPC,SAAS,EACTC,SAAS,EACTC,QAAQ,EACRC,MAAM,EACNC,OAAO,IAAI,EACZ,GAAGZ;IAEJ,MAAMa,MAAM,OAAOb,MAAMc,QAAQ,KAAK,WAAW,SAASC;IAE1D,MAAMC,aAAa9B;IACnB,MAAM+B,eAAe7B;IACrB,MAAM8B,SAAS/B;IAEf,MAAMgC,OAAOnB,MAAMmB,IAAI,GAAG7B,OAAO,CAACU,MAAMmB,IAAI,CAAC,GAAGnB,MAAMmB,IAAI;IAE1D,MAAMC,WAAWnC,KAAKoC,MAAM,CAC1BtC,yBAAyB,QAAQ;QAC/BkB;QACA,GAAGD,KAAK;QACRa;QACAS,WAAWtC,aACTK,qBACA8B,QAAQH,UAAU,CAACG,KAAK,EACxBR,UAAUM,YAAY,CAACN,OAAO,EAC9BC,SAAS,SAASM,OAAOK,MAAM,EAC/Bb,YAAYQ,OAAOR,QAAQ,EAC3BR,UAAU,YAAYgB,OAAOM,WAAW,EACxCtB,UAAU,SAASgB,OAAOO,QAAQ,EAClCvB,UAAU,aAAagB,OAAOQ,YAAY,EAE1CvB,aAAae,OAAOS,OAAO,EAC3BxB,cAAc,QAAQe,OAAOU,SAAS,EACtCxB,YAAYc,OAAOd,QAAQ,EAC3BC,SAASa,OAAOb,KAAK,EACrBC,aAAaY,OAAOZ,SAAS,EAC7BC,WAAWW,OAAOX,OAAO,EACzBC,aAAaU,OAAOV,SAAS,EAC7BC,aAAaS,OAAOT,SAAS,EAC7BT,MAAMsB,SAAS;IAEnB,IACA;QAAEO,aAAa;IAAO;IAGxB,qBAAO,KAACT;AACV,GAAG;AAEHtB,WAAWgC,WAAW,GAAG"}
1
+ {"version":3,"sources":["../src/components/StyledText/StyledText.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport * as React from 'react';\nimport { getIntrinsicElementProps, mergeClasses, Slot, ComponentProps, slot } from '@fluentui/react-components';\nimport { useSizeStyles, useStyles, useWeightStyles } from './StyledText.styles';\n\nexport type StyledTextSlots = {\n root: Slot<'span', 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'p' | 'pre' | 'time'>;\n};\n\nexport type StyledTextProps = ComponentProps<StyledTextSlots> & {\n /**\n * Aligns text based on the parent container.\n */\n align?: 'start' | 'center' | 'end' | 'justify';\n\n /**\n * At mentions can be formatted to draw users' attention.\n * Mentions for \"me\" can be formatted to appear differently.\n */\n atMention?: 'me' | boolean;\n\n /**\n * Set as disabled StyledText component\n */\n disabled?: boolean;\n\n /**\n * Set as error StyledText component\n */\n error?: boolean;\n\n /**\n * The StyledText can appear more important and draw user's attention\n */\n important?: boolean;\n\n /**\n * Applies font size and line height based on the theme tokens.\n */\n size?:\n | 'smaller'\n | 'small'\n | 'medium'\n | 'large'\n | 'large500'\n | 'larger'\n | 'largest'\n | 100\n | 200\n | 300\n | 400\n | 500\n | 600\n | 700;\n\n /**\n * Set as success StyledText component\n */\n success?: boolean;\n\n /**\n * The text can signify a temporary state\n */\n temporary?: boolean;\n\n /**\n * Set as timestamp StyledText component\n */\n timestamp?: boolean;\n\n /**\n * Truncate overflowing text for block displays.\n */\n truncate?: boolean;\n\n /**\n * Applies font weight to the content.\n */\n weight?: 'light' | 'semilight' | 'regular' | 'medium' | 'semibold' | 'bold';\n\n /**\n * Wraps the text content on white spaces.\n *\n * @default true\n */\n wrap?: boolean;\n};\n\nexport const styledTextClassName = 'fui-StyledText';\n\nconst sizeMap: Record<string, 'base100' | 'base200' | 'base300' | 'base400' | 'base500' | 'base600' | 'hero700'> = {\n '100': 'base100',\n '200': 'base200',\n '300': 'base300',\n '400': 'base400',\n '500': 'base500',\n '600': 'base600',\n '700': 'hero700',\n smaller: 'base100',\n small: 'base200',\n medium: 'base300',\n large: 'base400',\n large500: 'base500',\n larger: 'base600',\n largest: 'hero700',\n};\n\nexport const StyledText = React.forwardRef<HTMLSpanElement, StyledTextProps>((props, ref) => {\n const {\n align,\n atMention,\n disabled,\n error,\n important,\n success,\n temporary,\n timestamp,\n truncate,\n weight,\n wrap = true,\n } = props;\n\n const dir = typeof props.children === 'string' ? 'auto' : undefined;\n\n const sizeStyles = useSizeStyles();\n const weightStyles = useWeightStyles();\n const styles = useStyles();\n\n const size = props.size ? sizeMap[props.size] : props.size;\n\n const RootSlot = slot.always(\n getIntrinsicElementProps('span', {\n ref,\n ...props,\n dir,\n className: mergeClasses(\n styledTextClassName,\n size && sizeStyles[size],\n weight && weightStyles[weight],\n wrap === false && styles.nowrap,\n truncate && styles.truncate,\n align === 'center' && styles.alignCenter,\n align === 'end' && styles.alignEnd,\n align === 'justify' && styles.alignJustify,\n\n atMention && styles.mention,\n atMention === 'me' && styles.mentionMe,\n disabled && styles.disabled,\n error && styles.error,\n important && styles.important,\n success && styles.success,\n temporary && styles.temporary,\n timestamp && styles.timestamp,\n props.className,\n ),\n }),\n { elementType: 'span' },\n );\n\n return <RootSlot />;\n});\n\nStyledText.displayName = 'StyledText';\n"],"names":["React","getIntrinsicElementProps","mergeClasses","slot","useSizeStyles","useStyles","useWeightStyles","styledTextClassName","sizeMap","smaller","small","medium","large","large500","larger","largest","StyledText","forwardRef","props","ref","align","atMention","disabled","error","important","success","temporary","timestamp","truncate","weight","wrap","dir","children","undefined","sizeStyles","weightStyles","styles","size","RootSlot","always","className","nowrap","alignCenter","alignEnd","alignJustify","mention","mentionMe","elementType","displayName"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,EAAEC,YAAY,EAAwBC,IAAI,QAAQ,6BAA6B;AAChH,SAASC,aAAa,EAAEC,SAAS,EAAEC,eAAe,QAAQ,sBAAsB;AAqFhF,OAAO,MAAMC,sBAAsB,iBAAiB;AAEpD,MAAMC,UAA6G;IACjH,OAAO;IACP,OAAO;IACP,OAAO;IACP,OAAO;IACP,OAAO;IACP,OAAO;IACP,OAAO;IACPC,SAAS;IACTC,OAAO;IACPC,QAAQ;IACRC,OAAO;IACPC,UAAU;IACVC,QAAQ;IACRC,SAAS;AACX;AAEA,OAAO,MAAMC,2BAAahB,MAAMiB,UAAU,CAAmC,CAACC,OAAOC;IACnF,MAAM,EACJC,KAAK,EACLC,SAAS,EACTC,QAAQ,EACRC,KAAK,EACLC,SAAS,EACTC,OAAO,EACPC,SAAS,EACTC,SAAS,EACTC,QAAQ,EACRC,MAAM,EACNC,OAAO,IAAI,EACZ,GAAGZ;IAEJ,MAAMa,MAAM,OAAOb,MAAMc,QAAQ,KAAK,WAAW,SAASC;IAE1D,MAAMC,aAAa9B;IACnB,MAAM+B,eAAe7B;IACrB,MAAM8B,SAAS/B;IAEf,MAAMgC,OAAOnB,MAAMmB,IAAI,GAAG7B,OAAO,CAACU,MAAMmB,IAAI,CAAC,GAAGnB,MAAMmB,IAAI;IAE1D,MAAMC,WAAWnC,KAAKoC,MAAM,CAC1BtC,yBAAyB,QAAQ;QAC/BkB;QACA,GAAGD,KAAK;QACRa;QACAS,WAAWtC,aACTK,qBACA8B,QAAQH,UAAU,CAACG,KAAK,EACxBR,UAAUM,YAAY,CAACN,OAAO,EAC9BC,SAAS,SAASM,OAAOK,MAAM,EAC/Bb,YAAYQ,OAAOR,QAAQ,EAC3BR,UAAU,YAAYgB,OAAOM,WAAW,EACxCtB,UAAU,SAASgB,OAAOO,QAAQ,EAClCvB,UAAU,aAAagB,OAAOQ,YAAY,EAE1CvB,aAAae,OAAOS,OAAO,EAC3BxB,cAAc,QAAQe,OAAOU,SAAS,EACtCxB,YAAYc,OAAOd,QAAQ,EAC3BC,SAASa,OAAOb,KAAK,EACrBC,aAAaY,OAAOZ,SAAS,EAC7BC,WAAWW,OAAOX,OAAO,EACzBC,aAAaU,OAAOV,SAAS,EAC7BC,aAAaS,OAAOT,SAAS,EAC7BT,MAAMsB,SAAS;IAEnB,IACA;QAAEO,aAAa;IAAO;IAGxB,qBAAO,KAACT;AACV,GAAG;AAEHtB,WAAWgC,WAAW,GAAG"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/StyledText/StyledText.styles.ts"],"sourcesContent":["import { makeStyles, tokens } from '@fluentui/react-components';\n\nexport const useSizeStyles = makeStyles({\n base100: {\n fontSize: tokens.fontSizeBase100,\n lineHeight: tokens.lineHeightBase100,\n },\n base200: {\n fontSize: tokens.fontSizeBase200,\n lineHeight: tokens.lineHeightBase200,\n },\n base300: {\n fontSize: tokens.fontSizeBase300,\n lineHeight: tokens.lineHeightBase300,\n },\n base400: {\n fontSize: tokens.fontSizeBase400,\n lineHeight: tokens.lineHeightBase400,\n },\n base500: {\n fontSize: tokens.fontSizeBase500,\n lineHeight: tokens.lineHeightBase500,\n },\n base600: {\n fontSize: tokens.fontSizeBase600,\n lineHeight: tokens.lineHeightBase600,\n },\n hero700: {\n fontSize: tokens.fontSizeHero700,\n lineHeight: tokens.lineHeightHero700,\n },\n});\n\nexport const useWeightStyles = makeStyles({\n light: {\n fontWeight: 200,\n },\n semilight: {\n fontWeight: 300,\n },\n regular: {\n fontWeight: 400,\n },\n medium: {\n fontWeight: 500,\n },\n semibold: {\n fontWeight: 600,\n },\n bold: {\n fontWeight: 700,\n },\n});\n\nexport const useStyles = makeStyles({\n mention: {\n color: tokens.colorBrandForegroundLink,\n },\n mentionMe: {\n color: tokens.colorPalettePumpkinBorderActive,\n fontWeight: 700,\n },\n disabled: {\n color: tokens.colorNeutralForegroundDisabled,\n },\n error: {\n color: tokens.colorPaletteRedForeground3,\n },\n important: {\n color: tokens.colorPaletteDarkOrangeForeground3,\n fontWeight: 700,\n },\n success: {\n color: tokens.colorPaletteGreenForeground3,\n },\n temporary: {\n fontStyle: 'italic',\n },\n timestamp: {\n color: tokens.colorNeutralForeground3,\n },\n nowrap: {\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n },\n truncate: {\n textOverflow: 'ellipsis',\n },\n alignCenter: {\n textAlign: 'center',\n },\n alignEnd: {\n textAlign: 'end',\n },\n alignJustify: {\n textAlign: 'justify',\n },\n});\n"],"names":["makeStyles","tokens","useSizeStyles","base100","fontSize","fontSizeBase100","lineHeight","lineHeightBase100","base200","fontSizeBase200","lineHeightBase200","base300","fontSizeBase300","lineHeightBase300","base400","fontSizeBase400","lineHeightBase400","base500","fontSizeBase500","lineHeightBase500","base600","fontSizeBase600","lineHeightBase600","hero700","fontSizeHero700","lineHeightHero700","useWeightStyles","light","fontWeight","semilight","regular","medium","semibold","bold","useStyles","mention","color","colorBrandForegroundLink","mentionMe","colorPalettePumpkinBorderActive","disabled","colorNeutralForegroundDisabled","error","colorPaletteRedForeground3","important","colorPaletteDarkOrangeForeground3","success","colorPaletteGreenForeground3","temporary","fontStyle","timestamp","colorNeutralForeground3","nowrap","whiteSpace","overflow","truncate","textOverflow","alignCenter","textAlign","alignEnd","alignJustify"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SAASA,UAAU,EAAEC,MAAM,QAAQ,6BAA6B;AAEhE,OAAO,MAAMC,gBAAgBF,WAAW;IACtCG,SAAS;QACPC,UAAUH,OAAOI,eAAe;QAChCC,YAAYL,OAAOM,iBAAiB;IACtC;IACAC,SAAS;QACPJ,UAAUH,OAAOQ,eAAe;QAChCH,YAAYL,OAAOS,iBAAiB;IACtC;IACAC,SAAS;QACPP,UAAUH,OAAOW,eAAe;QAChCN,YAAYL,OAAOY,iBAAiB;IACtC;IACAC,SAAS;QACPV,UAAUH,OAAOc,eAAe;QAChCT,YAAYL,OAAOe,iBAAiB;IACtC;IACAC,SAAS;QACPb,UAAUH,OAAOiB,eAAe;QAChCZ,YAAYL,OAAOkB,iBAAiB;IACtC;IACAC,SAAS;QACPhB,UAAUH,OAAOoB,eAAe;QAChCf,YAAYL,OAAOqB,iBAAiB;IACtC;IACAC,SAAS;QACPnB,UAAUH,OAAOuB,eAAe;QAChClB,YAAYL,OAAOwB,iBAAiB;IACtC;AACF,GAAG;AAEH,OAAO,MAAMC,kBAAkB1B,WAAW;IACxC2B,OAAO;QACLC,YAAY;IACd;IACAC,WAAW;QACTD,YAAY;IACd;IACAE,SAAS;QACPF,YAAY;IACd;IACAG,QAAQ;QACNH,YAAY;IACd;IACAI,UAAU;QACRJ,YAAY;IACd;IACAK,MAAM;QACJL,YAAY;IACd;AACF,GAAG;AAEH,OAAO,MAAMM,YAAYlC,WAAW;IAClCmC,SAAS;QACPC,OAAOnC,OAAOoC,wBAAwB;IACxC;IACAC,WAAW;QACTF,OAAOnC,OAAOsC,+BAA+B;QAC7CX,YAAY;IACd;IACAY,UAAU;QACRJ,OAAOnC,OAAOwC,8BAA8B;IAC9C;IACAC,OAAO;QACLN,OAAOnC,OAAO0C,0BAA0B;IAC1C;IACAC,WAAW;QACTR,OAAOnC,OAAO4C,iCAAiC;QAC/CjB,YAAY;IACd;IACAkB,SAAS;QACPV,OAAOnC,OAAO8C,4BAA4B;IAC5C;IACAC,WAAW;QACTC,WAAW;IACb;IACAC,WAAW;QACTd,OAAOnC,OAAOkD,uBAAuB;IACvC;IACAC,QAAQ;QACNC,YAAY;QACZC,UAAU;IACZ;IACAC,UAAU;QACRC,cAAc;IAChB;IACAC,aAAa;QACXC,WAAW;IACb;IACAC,UAAU;QACRD,WAAW;IACb;IACAE,cAAc;QACZF,WAAW;IACb;AACF,GAAG"}
1
+ {"version":3,"sources":["../src/components/StyledText/StyledText.styles.ts"],"sourcesContent":["import { makeStyles, tokens } from '@fluentui/react-components';\n\nexport const useSizeStyles = makeStyles({\n base100: {\n fontSize: tokens.fontSizeBase100,\n lineHeight: tokens.lineHeightBase100,\n },\n base200: {\n fontSize: tokens.fontSizeBase200,\n lineHeight: tokens.lineHeightBase200,\n },\n base300: {\n fontSize: tokens.fontSizeBase300,\n lineHeight: tokens.lineHeightBase300,\n },\n base400: {\n fontSize: tokens.fontSizeBase400,\n lineHeight: tokens.lineHeightBase400,\n },\n base500: {\n fontSize: tokens.fontSizeBase500,\n lineHeight: tokens.lineHeightBase500,\n },\n base600: {\n fontSize: tokens.fontSizeBase600,\n lineHeight: tokens.lineHeightBase600,\n },\n hero700: {\n fontSize: tokens.fontSizeHero700,\n lineHeight: tokens.lineHeightHero700,\n },\n});\n\nexport const useWeightStyles = makeStyles({\n light: {\n fontWeight: 200,\n },\n semilight: {\n fontWeight: 300,\n },\n regular: {\n fontWeight: 400,\n },\n medium: {\n fontWeight: 500,\n },\n semibold: {\n fontWeight: 600,\n },\n bold: {\n fontWeight: 700,\n },\n});\n\nexport const useStyles = makeStyles({\n mention: {\n color: tokens.colorBrandForegroundLink,\n },\n mentionMe: {\n color: tokens.colorPalettePumpkinBorderActive,\n fontWeight: 700,\n },\n disabled: {\n color: tokens.colorNeutralForegroundDisabled,\n },\n error: {\n color: tokens.colorPaletteRedForeground3,\n },\n important: {\n color: tokens.colorPaletteDarkOrangeForeground3,\n fontWeight: 700,\n },\n success: {\n color: tokens.colorPaletteGreenForeground3,\n },\n temporary: {\n fontStyle: 'italic',\n },\n timestamp: {\n color: tokens.colorNeutralForeground3,\n },\n nowrap: {\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n },\n truncate: {\n textOverflow: 'ellipsis',\n },\n alignCenter: {\n textAlign: 'center',\n },\n alignEnd: {\n textAlign: 'end',\n },\n alignJustify: {\n textAlign: 'justify',\n },\n});\n"],"names":["makeStyles","tokens","useSizeStyles","base100","fontSize","fontSizeBase100","lineHeight","lineHeightBase100","base200","fontSizeBase200","lineHeightBase200","base300","fontSizeBase300","lineHeightBase300","base400","fontSizeBase400","lineHeightBase400","base500","fontSizeBase500","lineHeightBase500","base600","fontSizeBase600","lineHeightBase600","hero700","fontSizeHero700","lineHeightHero700","useWeightStyles","light","fontWeight","semilight","regular","medium","semibold","bold","useStyles","mention","color","colorBrandForegroundLink","mentionMe","colorPalettePumpkinBorderActive","disabled","colorNeutralForegroundDisabled","error","colorPaletteRedForeground3","important","colorPaletteDarkOrangeForeground3","success","colorPaletteGreenForeground3","temporary","fontStyle","timestamp","colorNeutralForeground3","nowrap","whiteSpace","overflow","truncate","textOverflow","alignCenter","textAlign","alignEnd","alignJustify"],"mappings":"AAAA,SAASA,UAAU,EAAEC,MAAM,QAAQ,6BAA6B;AAEhE,OAAO,MAAMC,gBAAgBF,WAAW;IACtCG,SAAS;QACPC,UAAUH,OAAOI,eAAe;QAChCC,YAAYL,OAAOM,iBAAiB;IACtC;IACAC,SAAS;QACPJ,UAAUH,OAAOQ,eAAe;QAChCH,YAAYL,OAAOS,iBAAiB;IACtC;IACAC,SAAS;QACPP,UAAUH,OAAOW,eAAe;QAChCN,YAAYL,OAAOY,iBAAiB;IACtC;IACAC,SAAS;QACPV,UAAUH,OAAOc,eAAe;QAChCT,YAAYL,OAAOe,iBAAiB;IACtC;IACAC,SAAS;QACPb,UAAUH,OAAOiB,eAAe;QAChCZ,YAAYL,OAAOkB,iBAAiB;IACtC;IACAC,SAAS;QACPhB,UAAUH,OAAOoB,eAAe;QAChCf,YAAYL,OAAOqB,iBAAiB;IACtC;IACAC,SAAS;QACPnB,UAAUH,OAAOuB,eAAe;QAChClB,YAAYL,OAAOwB,iBAAiB;IACtC;AACF,GAAG;AAEH,OAAO,MAAMC,kBAAkB1B,WAAW;IACxC2B,OAAO;QACLC,YAAY;IACd;IACAC,WAAW;QACTD,YAAY;IACd;IACAE,SAAS;QACPF,YAAY;IACd;IACAG,QAAQ;QACNH,YAAY;IACd;IACAI,UAAU;QACRJ,YAAY;IACd;IACAK,MAAM;QACJL,YAAY;IACd;AACF,GAAG;AAEH,OAAO,MAAMM,YAAYlC,WAAW;IAClCmC,SAAS;QACPC,OAAOnC,OAAOoC,wBAAwB;IACxC;IACAC,WAAW;QACTF,OAAOnC,OAAOsC,+BAA+B;QAC7CX,YAAY;IACd;IACAY,UAAU;QACRJ,OAAOnC,OAAOwC,8BAA8B;IAC9C;IACAC,OAAO;QACLN,OAAOnC,OAAO0C,0BAA0B;IAC1C;IACAC,WAAW;QACTR,OAAOnC,OAAO4C,iCAAiC;QAC/CjB,YAAY;IACd;IACAkB,SAAS;QACPV,OAAOnC,OAAO8C,4BAA4B;IAC5C;IACAC,WAAW;QACTC,WAAW;IACb;IACAC,WAAW;QACTd,OAAOnC,OAAOkD,uBAAuB;IACvC;IACAC,QAAQ;QACNC,YAAY;QACZC,UAAU;IACZ;IACAC,UAAU;QACRC,cAAc;IAChB;IACAC,aAAa;QACXC,WAAW;IACb;IACAC,UAAU;QACRD,WAAW;IACb;IACAE,cAAc;QACZF,WAAW;IACb;AACF,GAAG"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/StyledText/index.tsx"],"sourcesContent":["export type { StyledTextProps, StyledTextSlots } from './StyledText';\nexport { StyledText, styledTextClassName } from './StyledText';\nexport { useSizeStyles, useStyles, useWeightStyles } from './StyledText.styles';\n"],"names":["StyledText","styledTextClassName","useSizeStyles","useStyles","useWeightStyles"],"rangeMappings":";","mappings":"AACA,SAASA,UAAU,EAAEC,mBAAmB,QAAQ,eAAe;AAC/D,SAASC,aAAa,EAAEC,SAAS,EAAEC,eAAe,QAAQ,sBAAsB"}
1
+ {"version":3,"sources":["../src/components/StyledText/index.tsx"],"sourcesContent":["export type { StyledTextProps, StyledTextSlots } from './StyledText';\nexport { StyledText, styledTextClassName } from './StyledText';\nexport { useSizeStyles, useStyles, useWeightStyles } from './StyledText.styles';\n"],"names":["StyledText","styledTextClassName","useSizeStyles","useStyles","useWeightStyles"],"mappings":"AACA,SAASA,UAAU,EAAEC,mBAAmB,QAAQ,eAAe;AAC/D,SAASC,aAAa,EAAEC,SAAS,EAAEC,eAAe,QAAQ,sBAAsB"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Video/Video.tsx"],"sourcesContent":["import { mergeClasses, useMergedRefs } from '@fluentui/react-components';\nimport * as React from 'react';\nimport { useVideoStyles } from './Video.styles';\n\nexport const videoClassName = 'fui-Video';\n\n/**\n * Video component props\n */\nexport interface VideoProps extends React.VideoHTMLAttributes<HTMLVideoElement> {\n /**\n * The source URL of the video\n */\n src: string;\n\n /**\n * Whether the video should start playing automatically\n * @default false\n */\n autoPlay?: boolean;\n\n /**\n * Whether the video should display controls\n * @default true\n */\n controls?: boolean;\n\n /**\n * Whether the video should loop\n */\n loop?: boolean;\n\n /**\n * Whether the video should be muted\n */\n muted?: boolean;\n\n /**\n * The URL of an image to display while the video is loading\n */\n poster?: string;\n}\n\nexport const Video = React.forwardRef<HTMLVideoElement, VideoProps>((props, ref) => {\n 'use no memo';\n\n const { className, muted, ...rest } = props;\n\n const videoRef = React.useRef<HTMLVideoElement>();\n\n const classes = useVideoStyles();\n React.useEffect(() => {\n // this is a workaround for a potential memory leak in Chromium which retains a Detached HTMLVideoElement when <video autoplay> is unmounted\n // https://bugs.chromium.org/p/chromium/issues/detail?id=969049\n return () => {\n if (videoRef?.current) {\n // we want to perform the cleanup on the latest element rendered\n // eslint-disable-next-line react-hooks/exhaustive-deps\n videoRef.current.src = '';\n }\n };\n }, [videoRef]);\n\n React.useEffect(() => {\n // React doesn't guarantee that props will be set:\n // https://github.com/facebook/react/issues/10389\n if (videoRef.current) {\n videoRef.current.muted = !!muted;\n }\n }, [muted]);\n\n return (\n <video\n ref={useMergedRefs(ref, videoRef) as React.Ref<HTMLVideoElement>}\n role=\"application\"\n className={mergeClasses(videoClassName, classes.root, className)}\n controls={true}\n autoPlay={false}\n muted={muted}\n {...rest}\n />\n );\n});\n\nVideo.displayName = 'Video';\n"],"names":["mergeClasses","useMergedRefs","React","useVideoStyles","videoClassName","Video","forwardRef","props","ref","className","muted","rest","videoRef","useRef","classes","useEffect","current","src","video","role","root","controls","autoPlay","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SAASA,YAAY,EAAEC,aAAa,QAAQ,6BAA6B;AACzE,YAAYC,WAAW,QAAQ;AAC/B,SAASC,cAAc,QAAQ,iBAAiB;AAEhD,OAAO,MAAMC,iBAAiB,YAAY;AAuC1C,OAAO,MAAMC,sBAAQH,MAAMI,UAAU,CAA+B,CAACC,OAAOC;IAC1E;IAEA,MAAM,EAAEC,SAAS,EAAEC,KAAK,EAAE,GAAGC,MAAM,GAAGJ;IAEtC,MAAMK,WAAWV,MAAMW,MAAM;IAE7B,MAAMC,UAAUX;IAChBD,MAAMa,SAAS,CAAC;QACd,4IAA4I;QAC5I,+DAA+D;QAC/D,OAAO;YACL,IAAIH,qBAAAA,+BAAAA,SAAUI,OAAO,EAAE;gBACrB,gEAAgE;gBAChE,uDAAuD;gBACvDJ,SAASI,OAAO,CAACC,GAAG,GAAG;YACzB;QACF;IACF,GAAG;QAACL;KAAS;IAEbV,MAAMa,SAAS,CAAC;QACd,kDAAkD;QAClD,iDAAiD;QACjD,IAAIH,SAASI,OAAO,EAAE;YACpBJ,SAASI,OAAO,CAACN,KAAK,GAAG,CAAC,CAACA;QAC7B;IACF,GAAG;QAACA;KAAM;IAEV,qBACE,oBAACQ;QACCV,KAAKP,cAAcO,KAAKI;QACxBO,MAAK;QACLV,WAAWT,aAAaI,gBAAgBU,QAAQM,IAAI,EAAEX;QACtDY,UAAU;QACVC,UAAU;QACVZ,OAAOA;QACN,GAAGC,IAAI;;AAGd,GAAG;AAEHN,MAAMkB,WAAW,GAAG"}
1
+ {"version":3,"sources":["../src/components/Video/Video.tsx"],"sourcesContent":["import { mergeClasses, useMergedRefs } from '@fluentui/react-components';\nimport * as React from 'react';\nimport { useVideoStyles } from './Video.styles';\n\nexport const videoClassName = 'fui-Video';\n\n/**\n * Video component props\n */\nexport interface VideoProps extends React.VideoHTMLAttributes<HTMLVideoElement> {\n /**\n * The source URL of the video\n */\n src: string;\n\n /**\n * Whether the video should start playing automatically\n * @default false\n */\n autoPlay?: boolean;\n\n /**\n * Whether the video should display controls\n * @default true\n */\n controls?: boolean;\n\n /**\n * Whether the video should loop\n */\n loop?: boolean;\n\n /**\n * Whether the video should be muted\n */\n muted?: boolean;\n\n /**\n * The URL of an image to display while the video is loading\n */\n poster?: string;\n}\n\nexport const Video = React.forwardRef<HTMLVideoElement, VideoProps>((props, ref) => {\n 'use no memo';\n\n const { className, muted, ...rest } = props;\n\n const videoRef = React.useRef<HTMLVideoElement>();\n\n const classes = useVideoStyles();\n React.useEffect(() => {\n // this is a workaround for a potential memory leak in Chromium which retains a Detached HTMLVideoElement when <video autoplay> is unmounted\n // https://bugs.chromium.org/p/chromium/issues/detail?id=969049\n return () => {\n if (videoRef?.current) {\n // we want to perform the cleanup on the latest element rendered\n // eslint-disable-next-line react-hooks/exhaustive-deps\n videoRef.current.src = '';\n }\n };\n }, [videoRef]);\n\n React.useEffect(() => {\n // React doesn't guarantee that props will be set:\n // https://github.com/facebook/react/issues/10389\n if (videoRef.current) {\n videoRef.current.muted = !!muted;\n }\n }, [muted]);\n\n return (\n <video\n ref={useMergedRefs(ref, videoRef) as React.Ref<HTMLVideoElement>}\n role=\"application\"\n className={mergeClasses(videoClassName, classes.root, className)}\n controls={true}\n autoPlay={false}\n muted={muted}\n {...rest}\n />\n );\n});\n\nVideo.displayName = 'Video';\n"],"names":["mergeClasses","useMergedRefs","React","useVideoStyles","videoClassName","Video","forwardRef","props","ref","className","muted","rest","videoRef","useRef","classes","useEffect","current","src","video","role","root","controls","autoPlay","displayName"],"mappings":"AAAA,SAASA,YAAY,EAAEC,aAAa,QAAQ,6BAA6B;AACzE,YAAYC,WAAW,QAAQ;AAC/B,SAASC,cAAc,QAAQ,iBAAiB;AAEhD,OAAO,MAAMC,iBAAiB,YAAY;AAuC1C,OAAO,MAAMC,sBAAQH,MAAMI,UAAU,CAA+B,CAACC,OAAOC;IAC1E;IAEA,MAAM,EAAEC,SAAS,EAAEC,KAAK,EAAE,GAAGC,MAAM,GAAGJ;IAEtC,MAAMK,WAAWV,MAAMW,MAAM;IAE7B,MAAMC,UAAUX;IAChBD,MAAMa,SAAS,CAAC;QACd,4IAA4I;QAC5I,+DAA+D;QAC/D,OAAO;YACL,IAAIH,qBAAAA,+BAAAA,SAAUI,OAAO,EAAE;gBACrB,gEAAgE;gBAChE,uDAAuD;gBACvDJ,SAASI,OAAO,CAACC,GAAG,GAAG;YACzB;QACF;IACF,GAAG;QAACL;KAAS;IAEbV,MAAMa,SAAS,CAAC;QACd,kDAAkD;QAClD,iDAAiD;QACjD,IAAIH,SAASI,OAAO,EAAE;YACpBJ,SAASI,OAAO,CAACN,KAAK,GAAG,CAAC,CAACA;QAC7B;IACF,GAAG;QAACA;KAAM;IAEV,qBACE,oBAACQ;QACCV,KAAKP,cAAcO,KAAKI;QACxBO,MAAK;QACLV,WAAWT,aAAaI,gBAAgBU,QAAQM,IAAI,EAAEX;QACtDY,UAAU;QACVC,UAAU;QACVZ,OAAOA;QACN,GAAGC,IAAI;;AAGd,GAAG;AAEHN,MAAMkB,WAAW,GAAG"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Video/Video.styles.ts"],"sourcesContent":["import { makeStyles } from '@fluentui/react-components';\n\nexport const useVideoStyles = makeStyles({\n root: {\n display: 'inline-block',\n verticalAlign: 'middle',\n width: '100%',\n height: 'auto',\n },\n});\n"],"names":["makeStyles","useVideoStyles","root","display","verticalAlign","width","height"],"rangeMappings":";;;;;;;;","mappings":"AAAA,SAASA,UAAU,QAAQ,6BAA6B;AAExD,OAAO,MAAMC,iBAAiBD,WAAW;IACvCE,MAAM;QACJC,SAAS;QACTC,eAAe;QACfC,OAAO;QACPC,QAAQ;IACV;AACF,GAAG"}
1
+ {"version":3,"sources":["../src/components/Video/Video.styles.ts"],"sourcesContent":["import { makeStyles } from '@fluentui/react-components';\n\nexport const useVideoStyles = makeStyles({\n root: {\n display: 'inline-block',\n verticalAlign: 'middle',\n width: '100%',\n height: 'auto',\n },\n});\n"],"names":["makeStyles","useVideoStyles","root","display","verticalAlign","width","height"],"mappings":"AAAA,SAASA,UAAU,QAAQ,6BAA6B;AAExD,OAAO,MAAMC,iBAAiBD,WAAW;IACvCE,MAAM;QACJC,SAAS;QACTC,eAAe;QACfC,OAAO;QACPC,QAAQ;IACV;AACF,GAAG"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Video/index.ts"],"sourcesContent":["export type { VideoProps } from './Video';\nexport { Video, videoClassName } from './Video';\n"],"names":["Video","videoClassName"],"rangeMappings":"","mappings":"AACA,SAASA,KAAK,EAAEC,cAAc,QAAQ,UAAU"}
1
+ {"version":3,"sources":["../src/components/Video/index.ts"],"sourcesContent":["export type { VideoProps } from './Video';\nexport { Video, videoClassName } from './Video';\n"],"names":["Video","videoClassName"],"mappings":"AACA,SAASA,KAAK,EAAEC,cAAc,QAAQ,UAAU"}
package/lib/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.ts"],"sourcesContent":["export { GridShim, grid, gridClassName, useGridStyles } from './components/Grid/index';\nexport type { GridShimProps } from './components/Grid/index';\nexport { FormFieldShim } from './components/FormField';\nexport { Segment } from './components/Segment';\nexport { slider } from './components/Slider';\nexport { Video, videoClassName } from './components/Video';\nexport { type VideoProps } from './components/Video';\nexport { input } from './components/Input';\nexport { v0Icon, v9CustomSizeIcon, v9DisabledCursor, v9HoverClasses, v9Icon } from './components/Button';\nexport { spinner } from './components/Spinner';\nexport { StyledText, styledTextClassName } from './components/StyledText';\nexport type { StyledTextProps, StyledTextSlots } from './components/StyledText';\nexport { Primitive, primitiveClassName } from './components/Primitive';\nexport { ItemLayout, itemLayoutClassName, useItemLayoutStyles } from './components/ItemLayout';\nexport { Flex, flexClassName, flexItem, useFlexStyles } from './components/Flex';\nexport {\n List,\n ListItem,\n listClassNames,\n listItemClassNames,\n renderListItem_unstable,\n renderList_unstable,\n useListItemStyles_unstable,\n useListItem_unstable,\n useListSelection,\n useListStyles_unstable,\n useList_unstable,\n} from './components/List';\nexport type { ListItemProps, ListItemSlots, ListItemState, ListProps, ListSlots, ListState } from './components/List';\nexport {\n Attachment,\n AttachmentAction,\n AttachmentBody,\n AttachmentDescription,\n AttachmentHeader,\n AttachmentIcon,\n attachmentClassName,\n attachmentActionClassName,\n attachmentBodyClassName,\n attachmentDescriptionClassName,\n attachmentHeaderClassName,\n attachmentIconClassName,\n attachmentProgressBarClassName,\n attachmentProgressContainerClassName,\n} from './components/Attachment';\n\nexport type {\n AttachmentProps,\n AttachmentActionProps,\n AttachmentBodyProps,\n AttachmentDescriptionProps,\n AttachmentHeaderProps,\n AttachmentIconProps,\n} from './components/Attachment';\n"],"names":["GridShim","grid","gridClassName","useGridStyles","FormFieldShim","Segment","slider","Video","videoClassName","input","v0Icon","v9CustomSizeIcon","v9DisabledCursor","v9HoverClasses","v9Icon","spinner","StyledText","styledTextClassName","Primitive","primitiveClassName","ItemLayout","itemLayoutClassName","useItemLayoutStyles","Flex","flexClassName","flexItem","useFlexStyles","List","ListItem","listClassNames","listItemClassNames","renderListItem_unstable","renderList_unstable","useListItemStyles_unstable","useListItem_unstable","useListSelection","useListStyles_unstable","useList_unstable","Attachment","AttachmentAction","AttachmentBody","AttachmentDescription","AttachmentHeader","AttachmentIcon","attachmentClassName","attachmentActionClassName","attachmentBodyClassName","attachmentDescriptionClassName","attachmentHeaderClassName","attachmentIconClassName","attachmentProgressBarClassName","attachmentProgressContainerClassName"],"rangeMappings":";;;;;;;;;;;;;","mappings":"AAAA,SAASA,QAAQ,EAAEC,IAAI,EAAEC,aAAa,EAAEC,aAAa,QAAQ,0BAA0B;AAEvF,SAASC,aAAa,QAAQ,yBAAyB;AACvD,SAASC,OAAO,QAAQ,uBAAuB;AAC/C,SAASC,MAAM,QAAQ,sBAAsB;AAC7C,SAASC,KAAK,EAAEC,cAAc,QAAQ,qBAAqB;AAE3D,SAASC,KAAK,QAAQ,qBAAqB;AAC3C,SAASC,MAAM,EAAEC,gBAAgB,EAAEC,gBAAgB,EAAEC,cAAc,EAAEC,MAAM,QAAQ,sBAAsB;AACzG,SAASC,OAAO,QAAQ,uBAAuB;AAC/C,SAASC,UAAU,EAAEC,mBAAmB,QAAQ,0BAA0B;AAE1E,SAASC,SAAS,EAAEC,kBAAkB,QAAQ,yBAAyB;AACvE,SAASC,UAAU,EAAEC,mBAAmB,EAAEC,mBAAmB,QAAQ,0BAA0B;AAC/F,SAASC,IAAI,EAAEC,aAAa,EAAEC,QAAQ,EAAEC,aAAa,QAAQ,oBAAoB;AACjF,SACEC,IAAI,EACJC,QAAQ,EACRC,cAAc,EACdC,kBAAkB,EAClBC,uBAAuB,EACvBC,mBAAmB,EACnBC,0BAA0B,EAC1BC,oBAAoB,EACpBC,gBAAgB,EAChBC,sBAAsB,EACtBC,gBAAgB,QACX,oBAAoB;AAE3B,SACEC,UAAU,EACVC,gBAAgB,EAChBC,cAAc,EACdC,qBAAqB,EACrBC,gBAAgB,EAChBC,cAAc,EACdC,mBAAmB,EACnBC,yBAAyB,EACzBC,uBAAuB,EACvBC,8BAA8B,EAC9BC,yBAAyB,EACzBC,uBAAuB,EACvBC,8BAA8B,EAC9BC,oCAAoC,QAC/B,0BAA0B"}
1
+ {"version":3,"sources":["../src/index.ts"],"sourcesContent":["export { GridShim, grid, gridClassName, useGridStyles } from './components/Grid/index';\nexport type { GridShimProps } from './components/Grid/index';\nexport { FormFieldShim } from './components/FormField';\nexport { Segment } from './components/Segment';\nexport { slider } from './components/Slider';\nexport { Video, videoClassName } from './components/Video';\nexport { type VideoProps } from './components/Video';\nexport { input } from './components/Input';\nexport { v0Icon, v9CustomSizeIcon, v9DisabledCursor, v9HoverClasses, v9Icon } from './components/Button';\nexport { spinner } from './components/Spinner';\nexport { StyledText, styledTextClassName } from './components/StyledText';\nexport type { StyledTextProps, StyledTextSlots } from './components/StyledText';\nexport { Primitive, primitiveClassName } from './components/Primitive';\nexport { ItemLayout, itemLayoutClassName, useItemLayoutStyles } from './components/ItemLayout';\nexport { Flex, flexClassName, flexItem, useFlexStyles } from './components/Flex';\nexport {\n List,\n ListItem,\n listClassNames,\n listItemClassNames,\n renderListItem_unstable,\n renderList_unstable,\n useListItemStyles_unstable,\n useListItem_unstable,\n useListSelection,\n useListStyles_unstable,\n useList_unstable,\n} from './components/List';\nexport type { ListItemProps, ListItemSlots, ListItemState, ListProps, ListSlots, ListState } from './components/List';\nexport {\n Attachment,\n AttachmentAction,\n AttachmentBody,\n AttachmentDescription,\n AttachmentHeader,\n AttachmentIcon,\n attachmentClassName,\n attachmentActionClassName,\n attachmentBodyClassName,\n attachmentDescriptionClassName,\n attachmentHeaderClassName,\n attachmentIconClassName,\n attachmentProgressBarClassName,\n attachmentProgressContainerClassName,\n} from './components/Attachment';\n\nexport type {\n AttachmentProps,\n AttachmentActionProps,\n AttachmentBodyProps,\n AttachmentDescriptionProps,\n AttachmentHeaderProps,\n AttachmentIconProps,\n} from './components/Attachment';\n"],"names":["GridShim","grid","gridClassName","useGridStyles","FormFieldShim","Segment","slider","Video","videoClassName","input","v0Icon","v9CustomSizeIcon","v9DisabledCursor","v9HoverClasses","v9Icon","spinner","StyledText","styledTextClassName","Primitive","primitiveClassName","ItemLayout","itemLayoutClassName","useItemLayoutStyles","Flex","flexClassName","flexItem","useFlexStyles","List","ListItem","listClassNames","listItemClassNames","renderListItem_unstable","renderList_unstable","useListItemStyles_unstable","useListItem_unstable","useListSelection","useListStyles_unstable","useList_unstable","Attachment","AttachmentAction","AttachmentBody","AttachmentDescription","AttachmentHeader","AttachmentIcon","attachmentClassName","attachmentActionClassName","attachmentBodyClassName","attachmentDescriptionClassName","attachmentHeaderClassName","attachmentIconClassName","attachmentProgressBarClassName","attachmentProgressContainerClassName"],"mappings":"AAAA,SAASA,QAAQ,EAAEC,IAAI,EAAEC,aAAa,EAAEC,aAAa,QAAQ,0BAA0B;AAEvF,SAASC,aAAa,QAAQ,yBAAyB;AACvD,SAASC,OAAO,QAAQ,uBAAuB;AAC/C,SAASC,MAAM,QAAQ,sBAAsB;AAC7C,SAASC,KAAK,EAAEC,cAAc,QAAQ,qBAAqB;AAE3D,SAASC,KAAK,QAAQ,qBAAqB;AAC3C,SAASC,MAAM,EAAEC,gBAAgB,EAAEC,gBAAgB,EAAEC,cAAc,EAAEC,MAAM,QAAQ,sBAAsB;AACzG,SAASC,OAAO,QAAQ,uBAAuB;AAC/C,SAASC,UAAU,EAAEC,mBAAmB,QAAQ,0BAA0B;AAE1E,SAASC,SAAS,EAAEC,kBAAkB,QAAQ,yBAAyB;AACvE,SAASC,UAAU,EAAEC,mBAAmB,EAAEC,mBAAmB,QAAQ,0BAA0B;AAC/F,SAASC,IAAI,EAAEC,aAAa,EAAEC,QAAQ,EAAEC,aAAa,QAAQ,oBAAoB;AACjF,SACEC,IAAI,EACJC,QAAQ,EACRC,cAAc,EACdC,kBAAkB,EAClBC,uBAAuB,EACvBC,mBAAmB,EACnBC,0BAA0B,EAC1BC,oBAAoB,EACpBC,gBAAgB,EAChBC,sBAAsB,EACtBC,gBAAgB,QACX,oBAAoB;AAE3B,SACEC,UAAU,EACVC,gBAAgB,EAChBC,cAAc,EACdC,qBAAqB,EACrBC,gBAAgB,EAChBC,cAAc,EACdC,mBAAmB,EACnBC,yBAAyB,EACzBC,uBAAuB,EACvBC,8BAA8B,EAC9BC,yBAAyB,EACzBC,uBAAuB,EACvBC,8BAA8B,EAC9BC,oCAAoC,QAC/B,0BAA0B"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Attachment/Attachment.tsx"],"sourcesContent":["import { mergeClasses } from '@fluentui/react-components';\nimport { useARIAButtonProps } from '@fluentui/react-aria';\nimport * as React from 'react';\n\nimport { useAttachmentBaseStyles, useAttachmentStyles } from './Attachment.styles';\n\nexport const attachmentClassName = 'fui-Attachment';\nexport const attachmentProgressContainerClassName = `${attachmentClassName}__progress-container`;\nexport const attachmentProgressBarClassName = `${attachmentClassName}__progress`;\n\nexport interface AttachmentProps extends React.HTMLAttributes<HTMLElement> {\n actionable?: boolean;\n disabled?: boolean;\n progress?: string | number;\n onClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;\n}\n\nexport const Attachment = React.forwardRef<HTMLDivElement, AttachmentProps>((props, ref) => {\n const { actionable, className, children, disabled, onClick, progress, onKeyDown, onKeyUp, ...rest } = props;\n const attachmentBaseClass = useAttachmentBaseStyles();\n const classes = useAttachmentStyles();\n\n const buttonProps = useARIAButtonProps('div', {\n disabled,\n onClick,\n onKeyDown: onKeyDown as React.KeyboardEventHandler<HTMLLIElement & HTMLDivElement>,\n onKeyUp: onKeyUp as React.KeyboardEventHandler<HTMLLIElement & HTMLDivElement>,\n });\n\n return (\n <div\n ref={ref}\n className={mergeClasses(attachmentClassName, attachmentBaseClass, actionable && classes.actionable, className)}\n {...(actionable && {\n 'data-is-focusable': true,\n ...buttonProps,\n })}\n {...rest}\n >\n {children}\n {!isNaN(Number(progress)) && (\n <div className={mergeClasses(attachmentProgressContainerClassName, classes.progressContainer)}>\n <div\n className={mergeClasses(classes.progressBar, attachmentProgressBarClassName)}\n style={{ width: `${progress}%` }}\n />\n </div>\n )}\n </div>\n );\n});\n\nAttachment.displayName = 'Attachment';\n"],"names":["Attachment","attachmentClassName","attachmentProgressBarClassName","attachmentProgressContainerClassName","React","forwardRef","props","ref","actionable","className","children","disabled","onClick","progress","onKeyDown","onKeyUp","rest","attachmentBaseClass","useAttachmentBaseStyles","classes","useAttachmentStyles","buttonProps","useARIAButtonProps","createElement","div","mergeClasses","isNaN","Number","progressContainer","progressBar","style","width","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAiBaA,UAAAA;eAAAA;;IAXAC,mBAAAA;eAAAA;;IAEAC,8BAAAA;eAAAA;;IADAC,oCAAAA;eAAAA;;;;iCAPgB;2BACM;iEACZ;kCAEsC;AAEtD,MAAMF,sBAAsB;AAC5B,MAAME,uCAAuC,CAAC,EAAEF,oBAAoB,oBAAoB,CAAC;AACzF,MAAMC,iCAAiC,CAAC,EAAED,oBAAoB,UAAU,CAAC;AASzE,MAAMD,aAAAA,WAAAA,GAAaI,OAAMC,UAAU,CAAkC,CAACC,OAAOC;IAClF,MAAM,EAAEC,UAAU,EAAEC,SAAS,EAAEC,QAAQ,EAAEC,QAAQ,EAAEC,OAAO,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,OAAO,EAAE,GAAGC,MAAM,GAAGV;IACtG,MAAMW,sBAAsBC,IAAAA,yCAAAA;IAC5B,MAAMC,UAAUC,IAAAA,qCAAAA;IAEhB,MAAMC,cAAcC,IAAAA,6BAAAA,EAAmB,OAAO;QAC5CX;QACAC;QACAE,WAAWA;QACXC,SAASA;IACX;IAEA,OAAA,WAAA,GACEX,OAAAmB,aAAA,CAACC,OAAAA;QACCjB,KAAKA;QACLE,WAAWgB,IAAAA,6BAAAA,EAAaxB,qBAAqBgB,qBAAqBT,cAAcW,QAAQX,UAAU,EAAEC;QACnG,GAAID,cAAc;YACjB,qBAAqB;YACrB,GAAGa,WAAW;QAChB,CAAC;QACA,GAAGL,IAAI;OAEPN,UACA,CAACgB,MAAMC,OAAOd,cAAAA,WAAAA,GACbT,OAAAmB,aAAA,CAACC,OAAAA;QAAIf,WAAWgB,IAAAA,6BAAAA,EAAatB,sCAAsCgB,QAAQS,iBAAiB;qBAC1FxB,OAAAmB,aAAA,CAACC,OAAAA;QACCf,WAAWgB,IAAAA,6BAAAA,EAAaN,QAAQU,WAAW,EAAE3B;QAC7C4B,OAAO;YAAEC,OAAO,CAAC,EAAElB,SAAS,CAAC,CAAC;QAAC;;AAM3C;AAEAb,WAAWgC,WAAW,GAAG"}
1
+ {"version":3,"sources":["../src/components/Attachment/Attachment.tsx"],"sourcesContent":["import { mergeClasses } from '@fluentui/react-components';\nimport { useARIAButtonProps } from '@fluentui/react-aria';\nimport * as React from 'react';\n\nimport { useAttachmentBaseStyles, useAttachmentStyles } from './Attachment.styles';\n\nexport const attachmentClassName = 'fui-Attachment';\nexport const attachmentProgressContainerClassName = `${attachmentClassName}__progress-container`;\nexport const attachmentProgressBarClassName = `${attachmentClassName}__progress`;\n\nexport interface AttachmentProps extends React.HTMLAttributes<HTMLElement> {\n actionable?: boolean;\n disabled?: boolean;\n progress?: string | number;\n onClick?: (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => void;\n}\n\nexport const Attachment = React.forwardRef<HTMLDivElement, AttachmentProps>((props, ref) => {\n const { actionable, className, children, disabled, onClick, progress, onKeyDown, onKeyUp, ...rest } = props;\n const attachmentBaseClass = useAttachmentBaseStyles();\n const classes = useAttachmentStyles();\n\n const buttonProps = useARIAButtonProps('div', {\n disabled,\n onClick,\n onKeyDown: onKeyDown as React.KeyboardEventHandler<HTMLLIElement & HTMLDivElement>,\n onKeyUp: onKeyUp as React.KeyboardEventHandler<HTMLLIElement & HTMLDivElement>,\n });\n\n return (\n <div\n ref={ref}\n className={mergeClasses(attachmentClassName, attachmentBaseClass, actionable && classes.actionable, className)}\n {...(actionable && {\n 'data-is-focusable': true,\n ...buttonProps,\n })}\n {...rest}\n >\n {children}\n {!isNaN(Number(progress)) && (\n <div className={mergeClasses(attachmentProgressContainerClassName, classes.progressContainer)}>\n <div\n className={mergeClasses(classes.progressBar, attachmentProgressBarClassName)}\n style={{ width: `${progress}%` }}\n />\n </div>\n )}\n </div>\n );\n});\n\nAttachment.displayName = 'Attachment';\n"],"names":["mergeClasses","useARIAButtonProps","React","useAttachmentBaseStyles","useAttachmentStyles","attachmentClassName","attachmentProgressContainerClassName","attachmentProgressBarClassName","Attachment","forwardRef","props","ref","actionable","className","children","disabled","onClick","progress","onKeyDown","onKeyUp","rest","attachmentBaseClass","classes","buttonProps","div","isNaN","Number","progressContainer","progressBar","style","width","displayName"],"mappings":";;;;;;;;;;;IAiBaQ,UAAAA;;;uBAXAH;;;kCAEAE;;;wCADAD;;;;;iCAPgB,6BAA6B;2BACvB,uBAAuB;iEACnC,QAAQ;kCAE8B,sBAAsB;AAE5E,MAAMD,sBAAsB,iBAAiB;AAC7C,MAAMC,uCAAuC,GAAGD,oBAAoB,oBAAoB,CAAC,CAAC;AAC1F,MAAME,iCAAiC,GAAGF,oBAAoB,UAAU,CAAC,CAAC;AAS1E,mBAAMG,WAAAA,GAAaN,OAAMO,UAAU,CAAkC,CAACC,OAAOC;IAClF,MAAM,EAAEC,UAAU,EAAEC,SAAS,EAAEC,QAAQ,EAAEC,QAAQ,EAAEC,OAAO,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,OAAO,EAAE,GAAGC,MAAM,GAAGV;IACtG,MAAMW,0BAAsBlB,yCAAAA;IAC5B,MAAMmB,UAAUlB,yCAAAA;IAEhB,MAAMmB,kBAActB,6BAAAA,EAAmB,OAAO;QAC5Cc;QACAC;QACAE,WAAWA;QACXC,SAASA;IACX;IAEA,OAAA,WAAA,GACE,OAAA,aAAA,CAACK,OAAAA;QACCb,KAAKA;QACLE,eAAWb,6BAAAA,EAAaK,qBAAqBgB,qBAAqBT,cAAcU,QAAQV,UAAU,EAAEC;QACnG,GAAID,cAAc;YACjB,qBAAqB;YACrB,GAAGW,WAAW;QAChB,CAAC;QACA,GAAGH,IAAI;OAEPN,UACA,CAACW,MAAMC,OAAOT,cAAAA,WAAAA,GACb,OAAA,aAAA,CAACO,OAAAA;QAAIX,eAAWb,6BAAAA,EAAaM,sCAAsCgB,QAAQK,iBAAiB;qBAC1F,OAAA,aAAA,CAACH,OAAAA;QACCX,WAAWb,iCAAAA,EAAasB,QAAQM,WAAW,EAAErB;QAC7CsB,OAAO;YAAEC,OAAO,GAAGb,SAAS,CAAC,CAAC;QAAC;;AAM3C,GAAG;AAEHT,WAAWuB,WAAW,GAAG"}
@@ -1 +1 @@
1
- {"version":3,"sources":["Attachment.styles.js"],"sourcesContent":["import { createCustomFocusIndicatorStyle, makeResetStyles, makeStyles, shorthands, tokens } from '@fluentui/react-components';\nimport { attachmentActionClassName } from './AttachmentAction';\nimport { attachmentIconClassName } from './AttachmentIcon';\nexport const useAttachmentBaseStyles = makeResetStyles({\n ...createCustomFocusIndicatorStyle({\n outline: `${tokens.strokeWidthThick} solid ${tokens.colorStrokeFocus2}`,\n borderRadius: tokens.borderRadiusMedium,\n backgroundColor: undefined,\n color: undefined,\n [`& .${attachmentActionClassName}`]: {\n color: undefined\n },\n [`& .${attachmentIconClassName}`]: {\n color: undefined\n }\n }, {\n selector: 'focus'\n }),\n position: 'relative',\n display: 'inline-flex',\n alignItems: 'center',\n width: '100%',\n maxWidth: '424px',\n minHeight: '32px',\n ...shorthands.padding('7px', '3px', '7px', '11px'),\n marginBottom: '2px',\n marginRight: '2px',\n backgroundColor: tokens.colorNeutralBackground6,\n color: tokens.colorNeutralForeground1,\n boxShadow: `0 .2rem .4rem -.075rem ${tokens.colorNeutralShadowAmbient}`,\n ...shorthands.border('1px', 'solid', tokens.colorNeutralStroke3),\n borderRadius: '4px'\n});\nexport const useAttachmentStyles = makeStyles({\n actionable: {\n cursor: 'pointer',\n ':hover': {\n backgroundColor: tokens.colorNeutralBackground4Hover\n }\n },\n progressContainer: {\n borderBottomLeftRadius: '4px',\n borderBottomRightRadius: '4px',\n bottom: 0,\n height: '4px',\n left: 0,\n overflow: 'hidden',\n position: 'absolute',\n right: 0\n },\n progressBar: {\n backgroundColor: tokens.colorPaletteLightGreenBackground3,\n height: '100%',\n maxWidth: '100%',\n transition: 'width 0.2s'\n }\n});\n"],"names":["useAttachmentBaseStyles","useAttachmentStyles","__resetStyles","__styles","actionable","Bceei9c","Jwef8y","progressContainer","Beyfa6y","Bbmb7ep","B5kzvoi","Bqenvij","oyh7mz","B68tc82","Bmxbyg5","Bpg54ce","qhf8xq","j35jbq","progressBar","De3pzq","B2u0y6b","Bn62ygk","Cwk7ip","B3o57yi","Bmy1vo4","Bkqvd7p","Bi2q7bf","d","p","h"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAGaA,uBAAuB;eAAvBA;;IA8BAC,mBAAmB;eAAnBA;;;iCAjCoF;AAG1F,MAAMD,0BAAuB,WAAA,GAAGE,IAAAA,8BAAA,EAAA,WAAA,WAAA;IAAA;IAAA;IAAA;IAAA;CA6BtC;AACM,MAAMD,sBAAmB,WAAA,GAAGE,IAAAA,yBAAA,EAAA;IAAAC,YAAA;QAAAC,SAAA;QAAAC,QAAA;IAAA;IAAAC,mBAAA;QAAAC,SAAA;YAAA;YAAA;SAAA;QAAAC,SAAA;YAAA;YAAA;SAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,QAAA;YAAA;YAAA;SAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,QAAA;QAAAC,QAAA;YAAA;YAAA;SAAA;IAAA;IAAAC,aAAA;QAAAC,QAAA;QAAAR,SAAA;QAAAS,SAAA;QAAAC,SAAA;QAAAC,QAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,SAAA;IAAA;AAAA,GAAA;IAAAC,GAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAC,GAAA,CAAA;YAAA;SAAA;QAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAA,GAAA,CAAA;YAAA;SAAA;KAAA;IAAAC,GAAA;QAAA;KAAA;AAAA"}
1
+ {"version":3,"sources":["Attachment.styles.js"],"sourcesContent":["import { createCustomFocusIndicatorStyle, makeResetStyles, makeStyles, shorthands, tokens } from '@fluentui/react-components';\nimport { attachmentActionClassName } from './AttachmentAction';\nimport { attachmentIconClassName } from './AttachmentIcon';\nexport const useAttachmentBaseStyles = makeResetStyles({\n ...createCustomFocusIndicatorStyle({\n outline: `${tokens.strokeWidthThick} solid ${tokens.colorStrokeFocus2}`,\n borderRadius: tokens.borderRadiusMedium,\n backgroundColor: undefined,\n color: undefined,\n [`& .${attachmentActionClassName}`]: {\n color: undefined\n },\n [`& .${attachmentIconClassName}`]: {\n color: undefined\n }\n }, {\n selector: 'focus'\n }),\n position: 'relative',\n display: 'inline-flex',\n alignItems: 'center',\n width: '100%',\n maxWidth: '424px',\n minHeight: '32px',\n ...shorthands.padding('7px', '3px', '7px', '11px'),\n marginBottom: '2px',\n marginRight: '2px',\n backgroundColor: tokens.colorNeutralBackground6,\n color: tokens.colorNeutralForeground1,\n boxShadow: `0 .2rem .4rem -.075rem ${tokens.colorNeutralShadowAmbient}`,\n ...shorthands.border('1px', 'solid', tokens.colorNeutralStroke3),\n borderRadius: '4px'\n});\nexport const useAttachmentStyles = makeStyles({\n actionable: {\n cursor: 'pointer',\n ':hover': {\n backgroundColor: tokens.colorNeutralBackground4Hover\n }\n },\n progressContainer: {\n borderBottomLeftRadius: '4px',\n borderBottomRightRadius: '4px',\n bottom: 0,\n height: '4px',\n left: 0,\n overflow: 'hidden',\n position: 'absolute',\n right: 0\n },\n progressBar: {\n backgroundColor: tokens.colorPaletteLightGreenBackground3,\n height: '100%',\n maxWidth: '100%',\n transition: 'width 0.2s'\n }\n});\n"],"names":["createCustomFocusIndicatorStyle","__resetStyles","__styles","shorthands","tokens","attachmentActionClassName","attachmentIconClassName","useAttachmentBaseStyles","useAttachmentStyles","actionable","Bceei9c","Jwef8y","progressContainer","Beyfa6y","Bbmb7ep","B5kzvoi","Bqenvij","oyh7mz","B68tc82","Bmxbyg5","Bpg54ce","qhf8xq","j35jbq","progressBar","De3pzq","B2u0y6b","Bn62ygk","Cwk7ip","B3o57yi","Bmy1vo4","Bkqvd7p","Bi2q7bf","d","p","h"],"mappings":";;;;;;;;;;;2BAGoC;eAAvBO;;uBA8BmB;eAAnBC;;;iCAjCoF,4BAA4B;AAGtH,gCAA6B,WAAA,OAAGP,8BAAA,EAAA,WAAA,WAAA;IAAA;IAAA;IAAA;IAAA;CA6BtC,CAAC;AACK,4BAAyB,WAAA,OAAGC,yBAAA,EAAA;IAAAO,UAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;IAAAC,iBAAA,EAAA;QAAAC,OAAA,EAAA;YAAA;YAAA;SAAA;QAAAC,OAAA,EAAA;YAAA;YAAA;SAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;YAAA;YAAA;SAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;YAAA;YAAA;SAAA;IAAA;IAAAC,WAAA,EAAA;QAAAC,MAAA,EAAA;QAAAR,OAAA,EAAA;QAAAS,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAC,CAAA,EAAA,CAAA;YAAA;SAAA;QAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;gBAAAA,CAAA,EAAA,CAAA;YAAA;SAAA;KAAA;IAAAC,CAAA,EAAA;QAAA;KAAA;AAAA,CAuBlC,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Attachment/Attachment.styles.ts"],"sourcesContent":["import {\n createCustomFocusIndicatorStyle,\n makeResetStyles,\n makeStyles,\n shorthands,\n tokens,\n} from '@fluentui/react-components';\nimport { attachmentActionClassName } from './AttachmentAction';\nimport { attachmentIconClassName } from './AttachmentIcon';\n\nexport const useAttachmentBaseStyles = makeResetStyles({\n ...createCustomFocusIndicatorStyle(\n {\n outline: `${tokens.strokeWidthThick} solid ${tokens.colorStrokeFocus2}`,\n borderRadius: tokens.borderRadiusMedium,\n backgroundColor: undefined,\n color: undefined,\n [`& .${attachmentActionClassName}`]: {\n color: undefined,\n },\n\n [`& .${attachmentIconClassName}`]: {\n color: undefined,\n },\n },\n { selector: 'focus' },\n ),\n position: 'relative',\n display: 'inline-flex',\n alignItems: 'center',\n width: '100%',\n maxWidth: '424px',\n minHeight: '32px',\n ...shorthands.padding('7px', '3px', '7px', '11px'),\n marginBottom: '2px',\n marginRight: '2px',\n backgroundColor: tokens.colorNeutralBackground6,\n color: tokens.colorNeutralForeground1,\n boxShadow: `0 .2rem .4rem -.075rem ${tokens.colorNeutralShadowAmbient}`,\n ...shorthands.border('1px', 'solid', tokens.colorNeutralStroke3),\n borderRadius: '4px',\n});\n\nexport const useAttachmentStyles = makeStyles({\n actionable: {\n cursor: 'pointer',\n ':hover': {\n backgroundColor: tokens.colorNeutralBackground4Hover,\n },\n },\n progressContainer: {\n borderBottomLeftRadius: '4px',\n borderBottomRightRadius: '4px',\n bottom: 0,\n height: '4px',\n left: 0,\n overflow: 'hidden',\n position: 'absolute',\n right: 0,\n },\n progressBar: {\n backgroundColor: tokens.colorPaletteLightGreenBackground3,\n height: '100%',\n maxWidth: '100%',\n transition: 'width 0.2s',\n },\n});\n"],"names":["useAttachmentBaseStyles","useAttachmentStyles","makeResetStyles","createCustomFocusIndicatorStyle","outline","tokens","strokeWidthThick","colorStrokeFocus2","borderRadius","borderRadiusMedium","backgroundColor","undefined","color","attachmentActionClassName","attachmentIconClassName","selector","position","display","alignItems","width","maxWidth","minHeight","shorthands","padding","marginBottom","marginRight","colorNeutralBackground6","colorNeutralForeground1","boxShadow","colorNeutralShadowAmbient","border","colorNeutralStroke3","makeStyles","actionable","cursor","colorNeutralBackground4Hover","progressContainer","borderBottomLeftRadius","borderBottomRightRadius","bottom","height","left","overflow","right","progressBar","colorPaletteLightGreenBackground3","transition"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAUaA,uBAAAA;eAAAA;;IAiCAC,mBAAAA;eAAAA;;;iCArCN;kCACmC;gCACF;AAEjC,MAAMD,0BAA0BE,IAAAA,gCAAAA,EAAgB;IACrD,GAAGC,IAAAA,gDAAAA,EACD;QACEC,SAAS,CAAC,EAAEC,uBAAAA,CAAOC,gBAAgB,CAAC,OAAO,EAAED,uBAAAA,CAAOE,iBAAiB,CAAC,CAAC;QACvEC,cAAcH,uBAAAA,CAAOI,kBAAkB;QACvCC,iBAAiBC;QACjBC,OAAOD;QACP,CAAC,CAAC,GAAG,EAAEE,2CAAAA,CAA0B,CAAC,CAAC,EAAE;YACnCD,OAAOD;QACT;QAEA,CAAC,CAAC,GAAG,EAAEG,uCAAAA,CAAwB,CAAC,CAAC,EAAE;YACjCF,OAAOD;QACT;IACF,GACA;QAAEI,UAAU;IAAQ,EACrB;IACDC,UAAU;IACVC,SAAS;IACTC,YAAY;IACZC,OAAO;IACPC,UAAU;IACVC,WAAW;IACX,GAAGC,2BAAAA,CAAWC,OAAO,CAAC,OAAO,OAAO,OAAO,OAAO;IAClDC,cAAc;IACdC,aAAa;IACbf,iBAAiBL,uBAAAA,CAAOqB,uBAAuB;IAC/Cd,OAAOP,uBAAAA,CAAOsB,uBAAuB;IACrCC,WAAW,CAAC,uBAAuB,EAAEvB,uBAAAA,CAAOwB,yBAAyB,CAAC,CAAC;IACvE,GAAGP,2BAAAA,CAAWQ,MAAM,CAAC,OAAO,SAASzB,uBAAAA,CAAO0B,mBAAmB,CAAC;IAChEvB,cAAc;AAChB;AAEO,MAAMP,sBAAsB+B,IAAAA,2BAAAA,EAAW;IAC5CC,YAAY;QACVC,QAAQ;QACR,UAAU;YACRxB,iBAAiBL,uBAAAA,CAAO8B,4BAA4B;QACtD;IACF;IACAC,mBAAmB;QACjBC,wBAAwB;QACxBC,yBAAyB;QACzBC,QAAQ;QACRC,QAAQ;QACRC,MAAM;QACNC,UAAU;QACV1B,UAAU;QACV2B,OAAO;IACT;IACAC,aAAa;QACXlC,iBAAiBL,uBAAAA,CAAOwC,iCAAiC;QACzDL,QAAQ;QACRpB,UAAU;QACV0B,YAAY;IACd;AACF"}
1
+ {"version":3,"sources":["../src/components/Attachment/Attachment.styles.ts"],"sourcesContent":["import {\n createCustomFocusIndicatorStyle,\n makeResetStyles,\n makeStyles,\n shorthands,\n tokens,\n} from '@fluentui/react-components';\nimport { attachmentActionClassName } from './AttachmentAction';\nimport { attachmentIconClassName } from './AttachmentIcon';\n\nexport const useAttachmentBaseStyles = makeResetStyles({\n ...createCustomFocusIndicatorStyle(\n {\n outline: `${tokens.strokeWidthThick} solid ${tokens.colorStrokeFocus2}`,\n borderRadius: tokens.borderRadiusMedium,\n backgroundColor: undefined,\n color: undefined,\n [`& .${attachmentActionClassName}`]: {\n color: undefined,\n },\n\n [`& .${attachmentIconClassName}`]: {\n color: undefined,\n },\n },\n { selector: 'focus' },\n ),\n position: 'relative',\n display: 'inline-flex',\n alignItems: 'center',\n width: '100%',\n maxWidth: '424px',\n minHeight: '32px',\n ...shorthands.padding('7px', '3px', '7px', '11px'),\n marginBottom: '2px',\n marginRight: '2px',\n backgroundColor: tokens.colorNeutralBackground6,\n color: tokens.colorNeutralForeground1,\n boxShadow: `0 .2rem .4rem -.075rem ${tokens.colorNeutralShadowAmbient}`,\n ...shorthands.border('1px', 'solid', tokens.colorNeutralStroke3),\n borderRadius: '4px',\n});\n\nexport const useAttachmentStyles = makeStyles({\n actionable: {\n cursor: 'pointer',\n ':hover': {\n backgroundColor: tokens.colorNeutralBackground4Hover,\n },\n },\n progressContainer: {\n borderBottomLeftRadius: '4px',\n borderBottomRightRadius: '4px',\n bottom: 0,\n height: '4px',\n left: 0,\n overflow: 'hidden',\n position: 'absolute',\n right: 0,\n },\n progressBar: {\n backgroundColor: tokens.colorPaletteLightGreenBackground3,\n height: '100%',\n maxWidth: '100%',\n transition: 'width 0.2s',\n },\n});\n"],"names":["createCustomFocusIndicatorStyle","makeResetStyles","makeStyles","shorthands","tokens","attachmentActionClassName","attachmentIconClassName","useAttachmentBaseStyles","outline","strokeWidthThick","colorStrokeFocus2","borderRadius","borderRadiusMedium","backgroundColor","undefined","color","selector","position","display","alignItems","width","maxWidth","minHeight","padding","marginBottom","marginRight","colorNeutralBackground6","colorNeutralForeground1","boxShadow","colorNeutralShadowAmbient","border","colorNeutralStroke3","useAttachmentStyles","actionable","cursor","colorNeutralBackground4Hover","progressContainer","borderBottomLeftRadius","borderBottomRightRadius","bottom","height","left","overflow","right","progressBar","colorPaletteLightGreenBackground3","transition"],"mappings":";;;;;;;;;;;IAUaO,uBAAAA;;;uBAiCAyB;eAAAA;;;iCArCN,6BAA6B;kCACM,qBAAqB;gCACvB,mBAAmB;AAEpD,oCAAgC/B,gCAAAA,EAAgB;IACrD,OAAGD,gDAAAA,EACD;QACEQ,SAAS,GAAGJ,uBAAAA,CAAOK,gBAAgB,CAAC,OAAO,EAAEL,uBAAAA,CAAOM,iBAAiB,EAAE;QACvEC,cAAcP,uBAAAA,CAAOQ,kBAAkB;QACvCC,iBAAiBC;QACjBC,OAAOD;QACP,CAAC,CAAC,GAAG,EAAET,2CAAAA,EAA2B,CAAC,EAAE;YACnCU,OAAOD;QACT;QAEA,CAAC,CAAC,GAAG,EAAER,uCAAAA,EAAyB,CAAC,EAAE;YACjCS,OAAOD;QACT;IACF,GACA;QAAEE,UAAU;IAAQ,EACrB;IACDC,UAAU;IACVC,SAAS;IACTC,YAAY;IACZC,OAAO;IACPC,UAAU;IACVC,WAAW;IACX,GAAGnB,2BAAAA,CAAWoB,OAAO,CAAC,OAAO,OAAO,OAAO,OAAO;IAClDC,cAAc;IACdC,aAAa;IACbZ,iBAAiBT,uBAAAA,CAAOsB,uBAAuB;IAC/CX,OAAOX,uBAAAA,CAAOuB,uBAAuB;IACrCC,WAAW,CAAC,uBAAuB,EAAExB,uBAAAA,CAAOyB,yBAAyB,EAAE;IACvE,GAAG1B,2BAAAA,CAAW2B,MAAM,CAAC,OAAO,SAAS1B,uBAAAA,CAAO2B,mBAAmB,CAAC;IAChEpB,cAAc;AAChB,GAAG;AAEI,gCAA4BT,2BAAAA,EAAW;IAC5C+B,YAAY;QACVC,QAAQ;QACR,UAAU;YACRrB,iBAAiBT,uBAAAA,CAAO+B,4BAA4B;QACtD;IACF;IACAC,mBAAmB;QACjBC,wBAAwB;QACxBC,yBAAyB;QACzBC,QAAQ;QACRC,QAAQ;QACRC,MAAM;QACNC,UAAU;QACVzB,UAAU;QACV0B,OAAO;IACT;IACAC,aAAa;QACX/B,iBAAiBT,uBAAAA,CAAOyC,iCAAiC;QACzDL,QAAQ;QACRnB,UAAU;QACVyB,YAAY;IACd;AACF,GAAG"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Attachment/AttachmentAction.tsx"],"sourcesContent":["import { Button, ButtonProps, mergeClasses } from '@fluentui/react-components';\nimport * as React from 'react';\nimport { useAttachmentActionStyles } from './AttachmentAction.styles';\n\nexport type AttachmentActionProps = ButtonProps;\n\nexport const attachmentActionClassName = 'fui-AttachmentAction';\n\nexport const AttachmentAction = React.forwardRef<HTMLButtonElement, AttachmentActionProps>((props, ref) => {\n const { className, disabled, disabledFocusable, children, onClick, onKeyUp, onKeyDown, ...rest } = props;\n const classes = useAttachmentActionStyles();\n\n const handleClick = React.useCallback<React.MouseEventHandler<HTMLButtonElement & HTMLAnchorElement>>(\n e => {\n e.stopPropagation();\n e.preventDefault();\n onClick?.(e);\n },\n [onClick],\n );\n\n const handleKeyUp = React.useCallback<React.KeyboardEventHandler<HTMLAnchorElement & HTMLButtonElement>>(\n e => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.stopPropagation();\n }\n onKeyUp?.(e);\n },\n [onKeyUp],\n );\n\n const handleKeyDown = React.useCallback<React.KeyboardEventHandler<HTMLButtonElement & HTMLAnchorElement>>(\n e => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.stopPropagation();\n }\n onKeyDown?.(e);\n },\n [onKeyDown],\n );\n\n return (\n <Button\n ref={ref}\n className={mergeClasses(\n attachmentActionClassName,\n classes.root,\n (disabled || disabledFocusable) && classes.disabled,\n className,\n )}\n appearance=\"transparent\"\n disabled={disabled}\n disabledFocusable={disabledFocusable}\n onClick={handleClick}\n onKeyDown={handleKeyDown}\n onKeyUp={handleKeyUp}\n {...rest}\n >\n {children}\n </Button>\n );\n});\n\nAttachmentAction.displayName = 'AttachmentAction';\n"],"names":["AttachmentAction","attachmentActionClassName","React","forwardRef","props","ref","className","disabled","disabledFocusable","children","onClick","onKeyUp","onKeyDown","rest","classes","useAttachmentActionStyles","handleClick","useCallback","e","stopPropagation","preventDefault","handleKeyUp","key","handleKeyDown","createElement","Button","mergeClasses","root","appearance","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAQaA,gBAAAA;eAAAA;;IAFAC,yBAAAA;eAAAA;;;;iCANqC;iEAC3B;wCACmB;AAInC,MAAMA,4BAA4B;AAElC,MAAMD,mBAAAA,WAAAA,GAAmBE,OAAMC,UAAU,CAA2C,CAACC,OAAOC;IACjG,MAAM,EAAEC,SAAS,EAAEC,QAAQ,EAAEC,iBAAiB,EAAEC,QAAQ,EAAEC,OAAO,EAAEC,OAAO,EAAEC,SAAS,EAAE,GAAGC,MAAM,GAAGT;IACnG,MAAMU,UAAUC,IAAAA,iDAAAA;IAEhB,MAAMC,cAAcd,OAAMe,WAAW,CACnCC,CAAAA;QACEA,EAAEC,eAAe;QACjBD,EAAEE,cAAc;QAChBV,YAAAA,QAAAA,YAAAA,KAAAA,IAAAA,KAAAA,IAAAA,QAAUQ;IACZ,GACA;QAACR;KAAQ;IAGX,MAAMW,cAAcnB,OAAMe,WAAW,CACnCC,CAAAA;QACE,IAAIA,EAAEI,GAAG,KAAK,WAAWJ,EAAEI,GAAG,KAAK,KAAK;YACtCJ,EAAEC,eAAe;QACnB;QACAR,YAAAA,QAAAA,YAAAA,KAAAA,IAAAA,KAAAA,IAAAA,QAAUO;IACZ,GACA;QAACP;KAAQ;IAGX,MAAMY,gBAAgBrB,OAAMe,WAAW,CACrCC,CAAAA;QACE,IAAIA,EAAEI,GAAG,KAAK,WAAWJ,EAAEI,GAAG,KAAK,KAAK;YACtCJ,EAAEC,eAAe;QACnB;QACAP,cAAAA,QAAAA,cAAAA,KAAAA,IAAAA,KAAAA,IAAAA,UAAYM;IACd,GACA;QAACN;KAAU;IAGb,OAAA,WAAA,GACEV,OAAAsB,aAAA,CAACC,uBAAAA,EAAAA;QACCpB,KAAKA;QACLC,WAAWoB,IAAAA,6BAAAA,EACTzB,2BACAa,QAAQa,IAAI,EACZ,AAACpB,CAAAA,YAAYC,iBAAAA,KAAsBM,QAAQP,QAAQ,EACnDD;QAEFsB,YAAW;QACXrB,UAAUA;QACVC,mBAAmBA;QACnBE,SAASM;QACTJ,WAAWW;QACXZ,SAASU;QACR,GAAGR,IAAI;OAEPJ;AAGP;AAEAT,iBAAiB6B,WAAW,GAAG"}
1
+ {"version":3,"sources":["../src/components/Attachment/AttachmentAction.tsx"],"sourcesContent":["import { Button, ButtonProps, mergeClasses } from '@fluentui/react-components';\nimport * as React from 'react';\nimport { useAttachmentActionStyles } from './AttachmentAction.styles';\n\nexport type AttachmentActionProps = ButtonProps;\n\nexport const attachmentActionClassName = 'fui-AttachmentAction';\n\nexport const AttachmentAction = React.forwardRef<HTMLButtonElement, AttachmentActionProps>((props, ref) => {\n const { className, disabled, disabledFocusable, children, onClick, onKeyUp, onKeyDown, ...rest } = props;\n const classes = useAttachmentActionStyles();\n\n const handleClick = React.useCallback<React.MouseEventHandler<HTMLButtonElement & HTMLAnchorElement>>(\n e => {\n e.stopPropagation();\n e.preventDefault();\n onClick?.(e);\n },\n [onClick],\n );\n\n const handleKeyUp = React.useCallback<React.KeyboardEventHandler<HTMLAnchorElement & HTMLButtonElement>>(\n e => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.stopPropagation();\n }\n onKeyUp?.(e);\n },\n [onKeyUp],\n );\n\n const handleKeyDown = React.useCallback<React.KeyboardEventHandler<HTMLButtonElement & HTMLAnchorElement>>(\n e => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.stopPropagation();\n }\n onKeyDown?.(e);\n },\n [onKeyDown],\n );\n\n return (\n <Button\n ref={ref}\n className={mergeClasses(\n attachmentActionClassName,\n classes.root,\n (disabled || disabledFocusable) && classes.disabled,\n className,\n )}\n appearance=\"transparent\"\n disabled={disabled}\n disabledFocusable={disabledFocusable}\n onClick={handleClick}\n onKeyDown={handleKeyDown}\n onKeyUp={handleKeyUp}\n {...rest}\n >\n {children}\n </Button>\n );\n});\n\nAttachmentAction.displayName = 'AttachmentAction';\n"],"names":["Button","mergeClasses","React","useAttachmentActionStyles","attachmentActionClassName","AttachmentAction","forwardRef","props","ref","className","disabled","disabledFocusable","children","onClick","onKeyUp","onKeyDown","rest","classes","handleClick","useCallback","e","stopPropagation","preventDefault","handleKeyUp","key","handleKeyDown","root","appearance","displayName"],"mappings":";;;;;;;;;;;IAQaK,gBAAAA;;;6BAFAD;;;;;iCANqC,6BAA6B;iEACxD,QAAQ;wCACW,4BAA4B;AAI/D,MAAMA,4BAA4B,uBAAuB;AAEzD,yBAAMC,WAAAA,GAAmBH,OAAMI,UAAU,CAA2C,CAACC,OAAOC;IACjG,MAAM,EAAEC,SAAS,EAAEC,QAAQ,EAAEC,iBAAiB,EAAEC,QAAQ,EAAEC,OAAO,EAAEC,OAAO,EAAEC,SAAS,EAAE,GAAGC,MAAM,GAAGT;IACnG,MAAMU,cAAUd,iDAAAA;IAEhB,MAAMe,cAAchB,OAAMiB,WAAW,CACnCC,CAAAA;QACEA,EAAEC,eAAe;QACjBD,EAAEE,cAAc;QAChBT,YAAAA,QAAAA,YAAAA,KAAAA,IAAAA,KAAAA,IAAAA,QAAUO;IACZ,GACA;QAACP;KAAQ;IAGX,MAAMU,cAAcrB,OAAMiB,WAAW,CACnCC,CAAAA;QACE,IAAIA,EAAEI,GAAG,KAAK,WAAWJ,EAAEI,GAAG,KAAK,KAAK;YACtCJ,EAAEC,eAAe;QACnB;QACAP,YAAAA,QAAAA,YAAAA,KAAAA,IAAAA,KAAAA,IAAAA,QAAUM;IACZ,GACA;QAACN;KAAQ;IAGX,MAAMW,gBAAgBvB,OAAMiB,WAAW,CACrCC,CAAAA;QACE,IAAIA,EAAEI,GAAG,KAAK,WAAWJ,EAAEI,GAAG,KAAK,KAAK;YACtCJ,EAAEC,eAAe;QACnB;QACAN,cAAAA,QAAAA,cAAAA,KAAAA,IAAAA,KAAAA,IAAAA,UAAYK;IACd,GACA;QAACL;KAAU;IAGb,OAAA,WAAA,GACE,OAAA,aAAA,CAACf,uBAAAA,EAAAA;QACCQ,KAAKA;QACLC,eAAWR,6BAAAA,EACTG,2BACAa,QAAQS,IAAI,EACXhB,CAAAA,YAAYC,iBAAAA,CAAgB,IAAMM,QAAQP,QAAQ,EACnDD;QAEFkB,YAAW;QACXjB,UAAUA;QACVC,mBAAmBA;QACnBE,SAASK;QACTH,WAAWU;QACXX,SAASS;QACR,GAAGP,IAAI;OAEPJ;AAGP,GAAG;AAEHP,iBAAiBuB,WAAW,GAAG"}
@@ -1 +1 @@
1
- {"version":3,"sources":["AttachmentAction.styles.js"],"sourcesContent":["import { makeStyles } from '@fluentui/react-components';\nexport const useAttachmentActionStyles = makeStyles({\n root: {\n height: '32px',\n maxWidth: '280px',\n minWidth: '32px',\n display: 'inline-flex',\n justifyContent: 'center',\n alignItems: 'center',\n position: 'relative',\n verticalAlign: 'middle',\n cursor: 'pointer'\n },\n disabled: {\n cursor: 'default'\n }\n});\n"],"names":["useAttachmentActionStyles","__styles","root","Bqenvij","B2u0y6b","Bf4jedk","mc9l5x","Brf1p80","Bt984gj","qhf8xq","ha4doy","Bceei9c","disabled","d"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BACaA;;;eAAAA;;;iCADc;AACpB,MAAMA,4BAAyB,WAAA,GAAGC,IAAAA,yBAAA,EAAA;IAAAC,MAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,QAAA;QAAAC,SAAA;QAAAC,SAAA;QAAAC,QAAA;QAAAC,QAAA;QAAAC,SAAA;IAAA;IAAAC,UAAA;QAAAD,SAAA;IAAA;AAAA,GAAA;IAAAE,GAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;AAAA"}
1
+ {"version":3,"sources":["AttachmentAction.styles.js"],"sourcesContent":["import { makeStyles } from '@fluentui/react-components';\nexport const useAttachmentActionStyles = makeStyles({\n root: {\n height: '32px',\n maxWidth: '280px',\n minWidth: '32px',\n display: 'inline-flex',\n justifyContent: 'center',\n alignItems: 'center',\n position: 'relative',\n verticalAlign: 'middle',\n cursor: 'pointer'\n },\n disabled: {\n cursor: 'default'\n }\n});\n"],"names":["__styles","useAttachmentActionStyles","root","Bqenvij","B2u0y6b","Bf4jedk","mc9l5x","Brf1p80","Bt984gj","qhf8xq","ha4doy","Bceei9c","disabled","d"],"mappings":";;;;+BACaC,yBAAyB;;;;;;iCADX,4BAA4B;AAChD,kCAA+B,WAAA,OAAGD,yBAAA,EAAA;IAAAE,IAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,OAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,MAAA,EAAA;QAAAC,OAAA,EAAA;IAAA;IAAAC,QAAA,EAAA;QAAAD,OAAA,EAAA;IAAA;AAAA,GAAA;IAAAE,CAAA,EAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;AAAA,CAexC,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Attachment/AttachmentAction.styles.ts"],"sourcesContent":["import { makeStyles } from '@fluentui/react-components';\n\nexport const useAttachmentActionStyles = makeStyles({\n root: {\n height: '32px',\n maxWidth: '280px',\n minWidth: '32px',\n display: 'inline-flex',\n justifyContent: 'center',\n alignItems: 'center',\n position: 'relative',\n verticalAlign: 'middle',\n cursor: 'pointer',\n },\n disabled: {\n cursor: 'default',\n },\n});\n"],"names":["useAttachmentActionStyles","makeStyles","root","height","maxWidth","minWidth","display","justifyContent","alignItems","position","verticalAlign","cursor","disabled"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAEaA;;;eAAAA;;;iCAFc;AAEpB,MAAMA,4BAA4BC,IAAAA,2BAAAA,EAAW;IAClDC,MAAM;QACJC,QAAQ;QACRC,UAAU;QACVC,UAAU;QACVC,SAAS;QACTC,gBAAgB;QAChBC,YAAY;QACZC,UAAU;QACVC,eAAe;QACfC,QAAQ;IACV;IACAC,UAAU;QACRD,QAAQ;IACV;AACF"}
1
+ {"version":3,"sources":["../src/components/Attachment/AttachmentAction.styles.ts"],"sourcesContent":["import { makeStyles } from '@fluentui/react-components';\n\nexport const useAttachmentActionStyles = makeStyles({\n root: {\n height: '32px',\n maxWidth: '280px',\n minWidth: '32px',\n display: 'inline-flex',\n justifyContent: 'center',\n alignItems: 'center',\n position: 'relative',\n verticalAlign: 'middle',\n cursor: 'pointer',\n },\n disabled: {\n cursor: 'default',\n },\n});\n"],"names":["makeStyles","useAttachmentActionStyles","root","height","maxWidth","minWidth","display","justifyContent","alignItems","position","verticalAlign","cursor","disabled"],"mappings":";;;;+BAEaC;;;;;;iCAFc,6BAA6B;AAEjD,sCAAkCD,2BAAAA,EAAW;IAClDE,MAAM;QACJC,QAAQ;QACRC,UAAU;QACVC,UAAU;QACVC,SAAS;QACTC,gBAAgB;QAChBC,YAAY;QACZC,UAAU;QACVC,eAAe;QACfC,QAAQ;IACV;IACAC,UAAU;QACRD,QAAQ;IACV;AACF,GAAG"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Attachment/AttachmentBody.tsx"],"sourcesContent":["import { mergeClasses } from '@fluentui/react-components';\nimport * as React from 'react';\nimport { useAttachmentBodyStyles } from './AttachmentBody.styles';\n\nexport interface AttachmentBodyProps extends React.HTMLAttributes<HTMLDivElement> {}\n\nexport const attachmentBodyClassName = 'fui-AttachmentBody';\n\nexport const AttachmentBody: React.FC<AttachmentBodyProps> = React.forwardRef<HTMLDivElement, AttachmentBodyProps>(\n (props, ref) => {\n const { className, children, ...rest } = props;\n const classes = useAttachmentBodyStyles();\n\n return (\n <div ref={ref} className={mergeClasses(attachmentBodyClassName, classes.root, className)} {...rest}>\n {children}\n </div>\n );\n },\n);\n\nAttachmentBody.displayName = 'AttachmentBody';\n"],"names":["AttachmentBody","attachmentBodyClassName","React","forwardRef","props","ref","className","children","rest","classes","useAttachmentBodyStyles","createElement","div","mergeClasses","root","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAQaA,cAAAA;eAAAA;;IAFAC,uBAAAA;eAAAA;;;;iCANgB;iEACN;sCACiB;AAIjC,MAAMA,0BAA0B;AAEhC,MAAMD,iBAAAA,WAAAA,GAAgDE,OAAMC,UAAU,CAC3E,CAACC,OAAOC;IACN,MAAM,EAAEC,SAAS,EAAEC,QAAQ,EAAE,GAAGC,MAAM,GAAGJ;IACzC,MAAMK,UAAUC,IAAAA,6CAAAA;IAEhB,OAAA,WAAA,GACER,OAAAS,aAAA,CAACC,OAAAA;QAAIP,KAAKA;QAAKC,WAAWO,IAAAA,6BAAAA,EAAaZ,yBAAyBQ,QAAQK,IAAI,EAAER;QAAa,GAAGE,IAAI;OAC/FD;AAGP;AAGFP,eAAee,WAAW,GAAG"}
1
+ {"version":3,"sources":["../src/components/Attachment/AttachmentBody.tsx"],"sourcesContent":["import { mergeClasses } from '@fluentui/react-components';\nimport * as React from 'react';\nimport { useAttachmentBodyStyles } from './AttachmentBody.styles';\n\nexport interface AttachmentBodyProps extends React.HTMLAttributes<HTMLDivElement> {}\n\nexport const attachmentBodyClassName = 'fui-AttachmentBody';\n\nexport const AttachmentBody: React.FC<AttachmentBodyProps> = React.forwardRef<HTMLDivElement, AttachmentBodyProps>(\n (props, ref) => {\n const { className, children, ...rest } = props;\n const classes = useAttachmentBodyStyles();\n\n return (\n <div ref={ref} className={mergeClasses(attachmentBodyClassName, classes.root, className)} {...rest}>\n {children}\n </div>\n );\n },\n);\n\nAttachmentBody.displayName = 'AttachmentBody';\n"],"names":["mergeClasses","React","useAttachmentBodyStyles","attachmentBodyClassName","AttachmentBody","forwardRef","props","ref","className","children","rest","classes","div","root","displayName"],"mappings":";;;;;;;;;;;IAQaI,cAAAA;;;2BAFAD;;;;;iCANgB,6BAA6B;iEACnC,QAAQ;sCACS,0BAA0B;AAI3D,MAAMA,0BAA0B,qBAAqB;AAErD,uBAAMC,WAAAA,GAAgDH,OAAMI,UAAU,CAC3E,CAACC,OAAOC;IACN,MAAM,EAAEC,SAAS,EAAEC,QAAQ,EAAE,GAAGC,MAAM,GAAGJ;IACzC,MAAMK,cAAUT,6CAAAA;IAEhB,OAAA,WAAA,GACE,OAAA,aAAA,CAACU,OAAAA;QAAIL,KAAKA;QAAKC,eAAWR,6BAAAA,EAAaG,yBAAyBQ,QAAQE,IAAI,EAAEL;QAAa,GAAGE,IAAI;OAC/FD;AAGP,GACA;AAEFL,eAAeU,WAAW,GAAG"}