@mattermost/compass-ui 0.1.0-alpha.4 → 0.1.0-alpha.5

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 (226) hide show
  1. package/dist/compass-ui-standalone.css +10 -0
  2. package/dist/compass-ui.css +2 -0
  3. package/dist/components/action-button/ActionButton.cjs +1 -1
  4. package/dist/components/action-button/ActionButton.cjs.map +1 -1
  5. package/dist/components/action-button/ActionButton.d.ts +2 -1
  6. package/dist/components/action-button/ActionButton.d.ts.map +1 -1
  7. package/dist/components/action-button/ActionButton.js +22 -12
  8. package/dist/components/action-button/ActionButton.js.map +1 -1
  9. package/dist/components/action-button/ActionButton.module.css +1 -1
  10. package/dist/components/action-button/ActionButton.module.scss.cjs +1 -1
  11. package/dist/components/action-button/ActionButton.module.scss.js +5 -5
  12. package/dist/components/attachment-card/AttachmentCard.cjs +1 -1
  13. package/dist/components/attachment-card/AttachmentCard.cjs.map +1 -1
  14. package/dist/components/attachment-card/AttachmentCard.d.ts +3 -1
  15. package/dist/components/attachment-card/AttachmentCard.d.ts.map +1 -1
  16. package/dist/components/attachment-card/AttachmentCard.js +92 -82
  17. package/dist/components/attachment-card/AttachmentCard.js.map +1 -1
  18. package/dist/components/attachment-card/AttachmentCard.module.css +1 -1
  19. package/dist/components/attachment-card/AttachmentCard.module.scss.cjs +1 -1
  20. package/dist/components/attachment-card/AttachmentCard.module.scss.js +19 -18
  21. package/dist/components/attachment-card/AttachmentCard.module.scss.js.map +1 -1
  22. package/dist/components/button/Button.module.css +1 -1
  23. package/dist/components/button/Button.module.scss.cjs +1 -1
  24. package/dist/components/button/Button.module.scss.js +15 -15
  25. package/dist/components/channel-sidebar-item/ChannelSidebarItem.cjs +1 -1
  26. package/dist/components/channel-sidebar-item/ChannelSidebarItem.cjs.map +1 -1
  27. package/dist/components/channel-sidebar-item/ChannelSidebarItem.d.ts +4 -1
  28. package/dist/components/channel-sidebar-item/ChannelSidebarItem.d.ts.map +1 -1
  29. package/dist/components/channel-sidebar-item/ChannelSidebarItem.js +112 -92
  30. package/dist/components/channel-sidebar-item/ChannelSidebarItem.js.map +1 -1
  31. package/dist/components/channel-sidebar-item/ChannelSidebarItem.module.css +1 -1
  32. package/dist/components/channel-sidebar-item/ChannelSidebarItem.module.scss.cjs +1 -1
  33. package/dist/components/channel-sidebar-item/ChannelSidebarItem.module.scss.js +22 -20
  34. package/dist/components/channel-sidebar-item/ChannelSidebarItem.module.scss.js.map +1 -1
  35. package/dist/components/checkbox/Checkbox.cjs +1 -1
  36. package/dist/components/checkbox/Checkbox.cjs.map +1 -1
  37. package/dist/components/checkbox/Checkbox.d.ts +3 -3
  38. package/dist/components/checkbox/Checkbox.d.ts.map +1 -1
  39. package/dist/components/checkbox/Checkbox.js +21 -20
  40. package/dist/components/checkbox/Checkbox.js.map +1 -1
  41. package/dist/components/checkbox/Checkbox.module.css +1 -1
  42. package/dist/components/checkbox/Checkbox.module.scss.cjs +1 -1
  43. package/dist/components/checkbox/Checkbox.module.scss.js +7 -7
  44. package/dist/components/chip/Chip.cjs +1 -1
  45. package/dist/components/chip/Chip.cjs.map +1 -1
  46. package/dist/components/chip/Chip.d.ts +3 -5
  47. package/dist/components/chip/Chip.d.ts.map +1 -1
  48. package/dist/components/chip/Chip.js +90 -48
  49. package/dist/components/chip/Chip.js.map +1 -1
  50. package/dist/components/chip/Chip.module.css +1 -1
  51. package/dist/components/chip/Chip.module.scss.cjs +1 -1
  52. package/dist/components/chip/Chip.module.scss.js +9 -9
  53. package/dist/components/chip/ChipGroup.cjs +2 -0
  54. package/dist/components/chip/ChipGroup.cjs.map +1 -0
  55. package/dist/components/chip/ChipGroup.d.ts +16 -0
  56. package/dist/components/chip/ChipGroup.d.ts.map +1 -0
  57. package/dist/components/chip/ChipGroup.js +112 -0
  58. package/dist/components/chip/ChipGroup.js.map +1 -0
  59. package/dist/components/chip/ChipGroup.module.css +1 -0
  60. package/dist/components/chip/ChipGroup.module.scss.cjs +2 -0
  61. package/dist/components/chip/ChipGroup.module.scss.cjs.map +1 -0
  62. package/dist/components/chip/ChipGroup.module.scss.js +7 -0
  63. package/dist/components/chip/ChipGroup.module.scss.js.map +1 -0
  64. package/dist/components/chip/index.cjs +1 -1
  65. package/dist/components/chip/index.d.ts +2 -0
  66. package/dist/components/chip/index.d.ts.map +1 -1
  67. package/dist/components/chip/index.js +4 -2
  68. package/dist/components/chip/index.js.map +1 -1
  69. package/dist/components/combobox/Combobox.cjs +1 -1
  70. package/dist/components/combobox/Combobox.cjs.map +1 -1
  71. package/dist/components/combobox/Combobox.d.ts.map +1 -1
  72. package/dist/components/combobox/Combobox.js +115 -109
  73. package/dist/components/combobox/Combobox.js.map +1 -1
  74. package/dist/components/combobox/Combobox.module.css +1 -1
  75. package/dist/components/combobox/Combobox.module.scss.cjs +1 -1
  76. package/dist/components/combobox/Combobox.module.scss.js +27 -29
  77. package/dist/components/date-range-picker/DateRangePicker.cjs +1 -1
  78. package/dist/components/date-range-picker/DateRangePicker.cjs.map +1 -1
  79. package/dist/components/date-range-picker/DateRangePicker.js +154 -154
  80. package/dist/components/date-range-picker/DateRangePicker.js.map +1 -1
  81. package/dist/components/date-range-picker/DateRangePicker.module.css +1 -1
  82. package/dist/components/date-range-picker/DateRangePicker.module.scss.cjs +1 -1
  83. package/dist/components/date-range-picker/DateRangePicker.module.scss.js +28 -45
  84. package/dist/components/dropdown/Dropdown.cjs +1 -1
  85. package/dist/components/dropdown/Dropdown.cjs.map +1 -1
  86. package/dist/components/dropdown/Dropdown.js +1 -1
  87. package/dist/components/dropdown/Dropdown.js.map +1 -1
  88. package/dist/components/dropdown/Dropdown.module.css +1 -1
  89. package/dist/components/dropdown/Dropdown.module.scss.cjs +1 -1
  90. package/dist/components/dropdown/Dropdown.module.scss.js +15 -16
  91. package/dist/components/global-banner/GlobalBanner.module.css +1 -1
  92. package/dist/components/global-banner/GlobalBanner.module.scss.cjs +1 -1
  93. package/dist/components/global-banner/GlobalBanner.module.scss.js +10 -10
  94. package/dist/components/icon-button/IconButton.cjs +1 -1
  95. package/dist/components/icon-button/IconButton.cjs.map +1 -1
  96. package/dist/components/icon-button/IconButton.d.ts +1 -1
  97. package/dist/components/icon-button/IconButton.d.ts.map +1 -1
  98. package/dist/components/icon-button/IconButton.js +14 -14
  99. package/dist/components/icon-button/IconButton.js.map +1 -1
  100. package/dist/components/icon-button/IconButton.module.css +1 -1
  101. package/dist/components/icon-button/IconButton.module.scss.cjs +1 -1
  102. package/dist/components/icon-button/IconButton.module.scss.js +15 -15
  103. package/dist/components/image-preview/ImagePreview.cjs +1 -1
  104. package/dist/components/image-preview/ImagePreview.cjs.map +1 -1
  105. package/dist/components/image-preview/ImagePreview.d.ts +2 -1
  106. package/dist/components/image-preview/ImagePreview.d.ts.map +1 -1
  107. package/dist/components/image-preview/ImagePreview.js +70 -52
  108. package/dist/components/image-preview/ImagePreview.js.map +1 -1
  109. package/dist/components/image-preview/ImagePreview.module.css +1 -1
  110. package/dist/components/image-preview/ImagePreview.module.scss.cjs +1 -1
  111. package/dist/components/image-preview/ImagePreview.module.scss.js +15 -15
  112. package/dist/components/menu-item/MenuItem.cjs +1 -1
  113. package/dist/components/menu-item/MenuItem.cjs.map +1 -1
  114. package/dist/components/menu-item/MenuItem.js +11 -11
  115. package/dist/components/menu-item/MenuItem.js.map +1 -1
  116. package/dist/components/menu-item/MenuItem.module.css +1 -1
  117. package/dist/components/menu-item/MenuItem.module.scss.cjs +1 -1
  118. package/dist/components/menu-item/MenuItem.module.scss.js +16 -16
  119. package/dist/components/message/Message.module.css +1 -1
  120. package/dist/components/message/Message.module.scss.cjs +1 -1
  121. package/dist/components/message/Message.module.scss.js +20 -20
  122. package/dist/components/message-reactions/MessageReactions.module.css +1 -1
  123. package/dist/components/message-reactions/MessageReactions.module.scss.cjs +1 -1
  124. package/dist/components/message-reactions/MessageReactions.module.scss.js +12 -12
  125. package/dist/components/more-unreads-banner/MoreUnreadsBanner.module.css +1 -1
  126. package/dist/components/more-unreads-banner/MoreUnreadsBanner.module.scss.cjs +1 -1
  127. package/dist/components/more-unreads-banner/MoreUnreadsBanner.module.scss.js +5 -5
  128. package/dist/components/pagination-dots/PaginationDots.module.css +1 -1
  129. package/dist/components/pagination-dots/PaginationDots.module.scss.cjs +1 -1
  130. package/dist/components/pagination-dots/PaginationDots.module.scss.js +8 -8
  131. package/dist/components/radio/Radio.cjs +1 -1
  132. package/dist/components/radio/Radio.cjs.map +1 -1
  133. package/dist/components/radio/Radio.d.ts +3 -3
  134. package/dist/components/radio/Radio.d.ts.map +1 -1
  135. package/dist/components/radio/Radio.js +11 -11
  136. package/dist/components/radio/Radio.js.map +1 -1
  137. package/dist/components/radio/Radio.module.css +1 -1
  138. package/dist/components/radio/Radio.module.scss.cjs +1 -1
  139. package/dist/components/radio/Radio.module.scss.js +11 -11
  140. package/dist/components/search-input/SearchInput.cjs +1 -1
  141. package/dist/components/search-input/SearchInput.cjs.map +1 -1
  142. package/dist/components/search-input/SearchInput.d.ts +2 -0
  143. package/dist/components/search-input/SearchInput.d.ts.map +1 -1
  144. package/dist/components/search-input/SearchInput.js +78 -64
  145. package/dist/components/search-input/SearchInput.js.map +1 -1
  146. package/dist/components/search-input/SearchInput.module.css +1 -1
  147. package/dist/components/search-input/SearchInput.module.scss.cjs +1 -1
  148. package/dist/components/search-input/SearchInput.module.scss.js +16 -23
  149. package/dist/components/search-input/SearchInput.module.scss.js.map +1 -1
  150. package/dist/components/select/Select.cjs +1 -1
  151. package/dist/components/select/Select.cjs.map +1 -1
  152. package/dist/components/select/Select.d.ts.map +1 -1
  153. package/dist/components/select/Select.js +64 -64
  154. package/dist/components/select/Select.js.map +1 -1
  155. package/dist/components/select/Select.module.css +1 -1
  156. package/dist/components/select/Select.module.scss.cjs +1 -1
  157. package/dist/components/select/Select.module.scss.js +24 -26
  158. package/dist/components/switch/Switch.cjs +1 -1
  159. package/dist/components/switch/Switch.cjs.map +1 -1
  160. package/dist/components/switch/Switch.d.ts.map +1 -1
  161. package/dist/components/switch/Switch.js +2 -2
  162. package/dist/components/switch/Switch.js.map +1 -1
  163. package/dist/components/switch/Switch.module.css +1 -1
  164. package/dist/components/switch/Switch.module.scss.cjs +1 -1
  165. package/dist/components/switch/Switch.module.scss.js +15 -15
  166. package/dist/components/tabs/Tabs.cjs +1 -1
  167. package/dist/components/tabs/Tabs.cjs.map +1 -1
  168. package/dist/components/tabs/Tabs.d.ts +4 -0
  169. package/dist/components/tabs/Tabs.d.ts.map +1 -1
  170. package/dist/components/tabs/Tabs.js +47 -31
  171. package/dist/components/tabs/Tabs.js.map +1 -1
  172. package/dist/components/tabs/Tabs.module.css +1 -1
  173. package/dist/components/tabs/Tabs.module.scss.cjs +1 -1
  174. package/dist/components/tabs/Tabs.module.scss.js +8 -7
  175. package/dist/components/tabs/Tabs.module.scss.js.map +1 -1
  176. package/dist/components/tag/Tag.module.css +1 -1
  177. package/dist/components/tag/Tag.module.scss.cjs +1 -1
  178. package/dist/components/tag/Tag.module.scss.js +15 -15
  179. package/dist/components/text-area/TextArea.cjs +1 -1
  180. package/dist/components/text-area/TextArea.cjs.map +1 -1
  181. package/dist/components/text-area/TextArea.d.ts.map +1 -1
  182. package/dist/components/text-area/TextArea.js +57 -56
  183. package/dist/components/text-area/TextArea.js.map +1 -1
  184. package/dist/components/text-area/TextArea.module.css +1 -1
  185. package/dist/components/text-area/TextArea.module.scss.cjs +1 -1
  186. package/dist/components/text-area/TextArea.module.scss.js +12 -17
  187. package/dist/components/text-input/TextInput.cjs +1 -1
  188. package/dist/components/text-input/TextInput.cjs.map +1 -1
  189. package/dist/components/text-input/TextInput.d.ts.map +1 -1
  190. package/dist/components/text-input/TextInput.js +59 -58
  191. package/dist/components/text-input/TextInput.js.map +1 -1
  192. package/dist/components/text-input/TextInput.module.css +1 -1
  193. package/dist/components/text-input/TextInput.module.scss.cjs +1 -1
  194. package/dist/components/text-input/TextInput.module.scss.js +16 -24
  195. package/dist/components/thread-footer/ThreadFooter.cjs +1 -1
  196. package/dist/components/thread-footer/ThreadFooter.cjs.map +1 -1
  197. package/dist/components/thread-footer/ThreadFooter.d.ts +7 -8
  198. package/dist/components/thread-footer/ThreadFooter.d.ts.map +1 -1
  199. package/dist/components/thread-footer/ThreadFooter.js +59 -62
  200. package/dist/components/thread-footer/ThreadFooter.js.map +1 -1
  201. package/dist/components/thread-footer/ThreadFooter.module.css +1 -1
  202. package/dist/components/thread-footer/ThreadFooter.module.scss.cjs +1 -1
  203. package/dist/components/thread-footer/ThreadFooter.module.scss.js +17 -17
  204. package/dist/components/thread-footer/index.d.ts +7 -1
  205. package/dist/components/thread-footer/index.d.ts.map +1 -1
  206. package/dist/components/thread-list-item/ThreadListItem.cjs +1 -1
  207. package/dist/components/thread-list-item/ThreadListItem.cjs.map +1 -1
  208. package/dist/components/thread-list-item/ThreadListItem.d.ts +1 -1
  209. package/dist/components/thread-list-item/ThreadListItem.d.ts.map +1 -1
  210. package/dist/components/thread-list-item/ThreadListItem.js +102 -87
  211. package/dist/components/thread-list-item/ThreadListItem.js.map +1 -1
  212. package/dist/components/thread-list-item/ThreadListItem.module.css +1 -1
  213. package/dist/components/thread-list-item/ThreadListItem.module.scss.cjs +1 -1
  214. package/dist/components/thread-list-item/ThreadListItem.module.scss.js +26 -23
  215. package/dist/components/thread-list-item/ThreadListItem.module.scss.js.map +1 -1
  216. package/dist/components/toast/Toast.module.css +1 -1
  217. package/dist/components/toast/Toast.module.scss.cjs +1 -1
  218. package/dist/components/toast/Toast.module.scss.js +6 -6
  219. package/dist/components/tour-point/TourPoint.module.css +1 -1
  220. package/dist/components/tour-point/TourPoint.module.scss.cjs +1 -1
  221. package/dist/components/tour-point/TourPoint.module.scss.js +28 -28
  222. package/dist/index.cjs +1 -1
  223. package/dist/index.css +31 -29
  224. package/dist/index.js +156 -154
  225. package/dist/index.js.map +1 -1
  226. package/package.json +1 -1
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("react/jsx-runtime"),n=require("react"),__be=require("@mattermost/compass-icons/components/chevron-down.js"),be=__be?.default??__be,__xe=require("@mattermost/compass-icons/components/check.js"),xe=__xe?.default??__xe,G=require("../icon/Icon.cjs"),K=require("../popover-menu/PopoverMenu.cjs"),c=require("../menu-item/MenuItem.module.scss.cjs"),je=require("../../hooks/use-anchored-popup-portal.cjs"),ge=require("../../hooks/use-outside-close.cjs"),ke=require("../../hooks/use-popover-transition.cjs"),Ne=require("../../utils/string.cjs"),s=require("./Select.module.scss.cjs"),L=280;function ye({option:u,listboxId:_,selected:j,active:y,onSelect:v,onHover:I}){const d=[c.default["menu-item"],y?c.default["menu-item--active"]:""].filter(Boolean).join(" ");return l.jsx("li",{id:`${_}-option-${u.value}`,role:"option",className:[s.default.select__option,d].filter(Boolean).join(" "),"aria-selected":j,"aria-disabled":u.disabled||void 0,onMouseDown:g=>g.preventDefault(),onMouseEnter:I,onPointerUp:()=>{u.disabled||v(u)},children:l.jsxs("div",{className:[c.default["menu-item__content"],u.disabled?s.default["select__option-content--disabled"]:""].filter(Boolean).join(" "),children:[u.leadingVisual!=null&&l.jsx("div",{className:c.default["menu-item__left"],children:l.jsx("span",{className:c.default["menu-item__leading-visual"],children:u.leadingVisual})}),l.jsxs("div",{className:c.default["menu-item__middle"],children:[l.jsx("div",{className:c.default["menu-item__top-row"],children:l.jsx("span",{className:c.default["menu-item__label"],children:u.label})}),u.secondaryLabel!=null&&l.jsx("div",{className:c.default["menu-item__bottom-row"],children:l.jsx("span",{className:c.default["menu-item__secondary-label-below"],children:u.secondaryLabel})})]}),j&&l.jsx("div",{className:c.default["menu-item__right"],children:l.jsx("span",{className:[c.default["menu-item__trailing-visual"],c.default["menu-item__trailing-visual--check"]].join(" "),children:l.jsx(G.default,{glyph:l.jsx(xe,{}),size:"16"})})})]})})}const Ie=n.forwardRef(function({options:_,value:j,defaultValue:y="",onChange:v,placeholder:I,label:d,leadingIcon:g,size:X="medium",invalid:D=!1,disabled:h=!1,id:J,name:q,className:Q="","aria-label":C,portalContainer:W=null,zIndex:Y},k){const Z=n.useId(),w=J??Z,b=`${w}-listbox`,R=n.useRef(null),M=n.useRef(null),O=n.useRef(null),ee=n.useCallback(e=>{O.current=e,typeof k=="function"?k(e):k&&(k.current=e)},[k]),P=j!==void 0,[le,te]=n.useState(y),m=P?j:le,[a,B]=n.useState(!1),[se,E]=n.useState(!1),[f,p]=n.useState(-1),S=n.useMemo(()=>_.find(e=>e.value===m),[_,m]),o=n.useMemo(()=>_.filter(e=>e.value!==""),[_]),V=m!=="",{mounted:$,visible:ne}=ke.usePopoverTransition(a),{placement:ae,maxHeight:oe,style:ie,portalRef:A,renderPortal:ce}=je.useAnchoredPopupPortal(M,$,{preferredHeight:L,maxHeightCap:L,portalContainer:W,zIndex:Y}),x=n.useCallback(()=>{B(!1),p(-1)},[]),N=n.useCallback(()=>{h||B(!0)},[h]);ge.useOutsideClose(R,a,x,A),n.useEffect(()=>{a&&p(e=>{if(o.length===0)return-1;if(e>=0&&e<o.length)return e;const t=o.findIndex(r=>r.value===m);if(t>=0)return t;const i=o.findIndex(r=>!r.disabled);return i>=0?i:0})},[a,o,m]);const H=n.useCallback(e=>{P||te(e),v==null||v(e)},[P,v]),F=n.useCallback(e=>{var t;e.disabled||(H(e.value),x(),(t=O.current)==null||t.focus())},[H,x]),T=n.useCallback(e=>{const t=o.map((i,r)=>({o:i,i:r})).filter(({o:i})=>!i.disabled);if(t.length===0){p(-1);return}p(i=>{const r=t.findIndex(({i:he})=>he===i),ve=r<0?e>0?0:t.length-1:(r+e+t.length)%t.length;return t[ve].i})},[o]);n.useEffect(()=>{if(!a||f<0)return;const e=o[f];if(!e)return;const t=document.getElementById(`${b}-option-${e.value}`);t==null||t.scrollIntoView({block:"nearest"})},[a,f,o,b]);const ue=e=>{var t;if(!h)switch(e.key){case"ArrowDown":e.preventDefault(),a?T(1):N();break;case"ArrowUp":e.preventDefault(),a?T(-1):N();break;case"Home":if(a&&o.length>0){e.preventDefault();const i=o.findIndex(r=>!r.disabled);p(i>=0?i:0)}break;case"End":if(a&&o.length>0){e.preventDefault();for(let i=o.length-1;i>=0;i--)if(!((t=o[i])!=null&&t.disabled)){p(i);break}}break;case"Enter":case" ":e.preventDefault(),a&&f>=0&&o[f]?F(o[f]):a||N();break;case"Escape":a&&(e.preventDefault(),x());break;case"Tab":x();break}},re=se||a||V,z=(S==null?void 0:S.label)??I??"",de=!V&&z!=="",U=f>=0?o[f]:void 0,fe=a&&U!=null?`${b}-option-${U.value}`:void 0,me=s.default[`select--size-${Ne.toKebab(X)}`],pe=[s.default.select,me,D?s.default["select--invalid"]:"",d!=null&&re?s.default["select--label-floated"]:"",g!=null?s.default["select--has-leading-icon"]:"",a?s.default["select--open"]:"",h?s.default["select--disabled"]:"",Q].filter(Boolean).join(" "),_e=[s.default.select__control,de?s.default["select__control--placeholder"]:""].filter(Boolean).join(" ");return l.jsxs("div",{className:pe,ref:R,children:[l.jsxs("div",{className:s.default.select__wrapper,ref:M,children:[d!=null&&l.jsx("label",{className:s.default.select__label,htmlFor:w,children:d}),l.jsxs("button",{ref:ee,id:w,type:"button",role:"combobox",className:_e,disabled:h,"aria-haspopup":"listbox","aria-expanded":a,"aria-controls":b,"aria-activedescendant":fe,"aria-invalid":D?!0:void 0,"aria-label":C??(typeof d=="string"?d:void 0),onClick:()=>a?x():N(),onFocus:()=>E(!0),onBlur:()=>E(!1),onKeyDown:ue,children:[g!=null&&l.jsx("span",{className:s.default.select__leadingIcon,"aria-hidden":!0,children:g}),l.jsx("span",{className:s.default.select__value,children:z}),l.jsx("span",{className:s.default.select__trailingIcon,"aria-hidden":!0,children:l.jsx(G.default,{size:"12",glyph:l.jsx(be,{})})})]})]}),q!=null&&!h&&l.jsx("input",{type:"hidden",name:q,value:m}),$&&ce(l.jsx("div",{ref:A,className:[s.default.select__popup,ae==="above"?s.default["select__popup--above"]:"",ne?s.default["select__popup--visible"]:""].filter(Boolean).join(" "),style:ie,children:l.jsx(K.default,{className:s.default.select__menu,children:l.jsx(K.PopoverMenuScroll,{maxHeight:oe,children:l.jsx("ul",{id:b,className:s.default.select__list,role:"listbox","aria-label":typeof d=="string"?d:C??"Options",children:o.map((e,t)=>l.jsx(ye,{option:e,listboxId:b,selected:e.value===m,active:t===f,onSelect:F,onHover:()=>p(t)},e.value))})})})}))]})});exports.default=Ie;
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("react/jsx-runtime"),a=require("react"),__he=require("@mattermost/compass-icons/components/chevron-down.js"),he=__he?.default??__he,__xe=require("@mattermost/compass-icons/components/check.js"),xe=__xe?.default??__xe,G=require("../icon/Icon.cjs"),K=require("../popover-menu/PopoverMenu.cjs"),c=require("../menu-item/MenuItem.module.scss.cjs"),je=require("../../hooks/use-anchored-popup-portal.cjs"),ge=require("../../hooks/use-outside-close.cjs"),ke=require("../../hooks/use-popover-transition.cjs"),Ne=require("../../utils/string.cjs"),s=require("./Select.module.scss.cjs"),L=280;function ye({option:u,listboxId:_,selected:j,active:y,onSelect:v,onHover:w}){const f=[c.default["menu-item"],y?c.default["menu-item--active"]:""].filter(Boolean).join(" ");return l.jsx("li",{id:`${_}-option-${u.value}`,role:"option",className:[s.default.select__option,f].filter(Boolean).join(" "),"aria-selected":j,"aria-disabled":u.disabled||void 0,onMouseDown:g=>g.preventDefault(),onMouseEnter:w,onPointerUp:()=>{u.disabled||v(u)},children:l.jsxs("div",{className:[c.default["menu-item__content"],u.disabled?s.default["select__option-content--disabled"]:""].filter(Boolean).join(" "),children:[u.leadingVisual!=null&&l.jsx("div",{className:c.default["menu-item__left"],children:l.jsx("span",{className:c.default["menu-item__leading-visual"],children:u.leadingVisual})}),l.jsxs("div",{className:c.default["menu-item__middle"],children:[l.jsx("div",{className:c.default["menu-item__top-row"],children:l.jsx("span",{className:c.default["menu-item__label"],children:u.label})}),u.secondaryLabel!=null&&l.jsx("div",{className:c.default["menu-item__bottom-row"],children:l.jsx("span",{className:c.default["menu-item__secondary-label-below"],children:u.secondaryLabel})})]}),j&&l.jsx("div",{className:c.default["menu-item__right"],children:l.jsx("span",{className:[c.default["menu-item__trailing-visual"],c.default["menu-item__trailing-visual--check"]].join(" "),children:l.jsx(G.default,{glyph:l.jsx(xe,{}),size:"16"})})})]})})}const we=a.forwardRef(function({options:_,value:j,defaultValue:y="",onChange:v,placeholder:w,label:f,leadingIcon:g,size:X="medium",invalid:D=!1,disabled:b=!1,id:J,name:q,className:Q="","aria-label":C,portalContainer:W=null,zIndex:Y},k){const Z=a.useId(),I=J??Z,h=`${I}-listbox`,R=a.useRef(null),M=a.useRef(null),O=a.useRef(null),ee=a.useCallback(e=>{O.current=e,typeof k=="function"?k(e):k&&(k.current=e)},[k]),P=j!==void 0,[le,te]=a.useState(y),m=P?j:le,[n,B]=a.useState(!1),[se,E]=a.useState(!1),[d,p]=a.useState(-1),S=a.useMemo(()=>_.find(e=>e.value===m),[_,m]),o=a.useMemo(()=>_.filter(e=>e.value!==""),[_]),V=m!=="",{mounted:$,visible:ae}=ke.usePopoverTransition(n),{placement:ne,maxHeight:oe,style:ie,portalRef:A,renderPortal:ce}=je.useAnchoredPopupPortal(M,$,{preferredHeight:L,maxHeightCap:L,portalContainer:W,zIndex:Y}),x=a.useCallback(()=>{B(!1),p(-1)},[]),N=a.useCallback(()=>{b||B(!0)},[b]);ge.useOutsideClose(R,n,x,A),a.useEffect(()=>{n&&p(e=>{if(o.length===0)return-1;if(e>=0&&e<o.length)return e;const t=o.findIndex(r=>r.value===m);if(t>=0)return t;const i=o.findIndex(r=>!r.disabled);return i>=0?i:0})},[n,o,m]);const H=a.useCallback(e=>{P||te(e),v==null||v(e)},[P,v]),F=a.useCallback(e=>{var t;e.disabled||(H(e.value),x(),(t=O.current)==null||t.focus())},[H,x]),T=a.useCallback(e=>{const t=o.map((i,r)=>({o:i,i:r})).filter(({o:i})=>!i.disabled);if(t.length===0){p(-1);return}p(i=>{const r=t.findIndex(({i:be})=>be===i),ve=r<0?e>0?0:t.length-1:(r+e+t.length)%t.length;return t[ve].i})},[o]);a.useEffect(()=>{if(!n||d<0)return;const e=o[d];if(!e)return;const t=document.getElementById(`${h}-option-${e.value}`);t==null||t.scrollIntoView({block:"nearest"})},[n,d,o,h]);const ue=e=>{var t;if(!b)switch(e.key){case"ArrowDown":e.preventDefault(),n?T(1):N();break;case"ArrowUp":e.preventDefault(),n?T(-1):N();break;case"Home":if(n&&o.length>0){e.preventDefault();const i=o.findIndex(r=>!r.disabled);p(i>=0?i:0)}break;case"End":if(n&&o.length>0){e.preventDefault();for(let i=o.length-1;i>=0;i--)if(!((t=o[i])!=null&&t.disabled)){p(i);break}}break;case"Enter":case" ":e.preventDefault(),n&&d>=0&&o[d]?F(o[d]):n||N();break;case"Escape":n&&(e.preventDefault(),x());break;case"Tab":x();break}},re=se||n||V,z=(S==null?void 0:S.label)??w??"",de=!V&&z!=="",U=d>=0?o[d]:void 0,fe=n&&U!=null?`${h}-option-${U.value}`:void 0,me=s.default[`select--size-${Ne.toKebab(X)}`],pe=[s.default.select,me,D?s.default["select--invalid"]:"",f!=null&&re?s.default["select--label-floated"]:"",g!=null?s.default["select--has-leading-icon"]:"",n?s.default["select--open"]:"",b?s.default["select--disabled"]:"",Q].filter(Boolean).join(" "),_e=[s.default.select__control,de?s.default["select__control--placeholder"]:""].filter(Boolean).join(" ");return l.jsxs("div",{className:pe,ref:R,children:[l.jsxs("div",{className:s.default.select__wrapper,ref:M,children:[f!=null&&l.jsx("label",{className:s.default.select__label,htmlFor:I,children:f}),l.jsxs("button",{ref:ee,id:I,type:"button",role:"combobox",className:_e,disabled:b,"aria-haspopup":"listbox","aria-expanded":n,"aria-controls":h,"aria-activedescendant":fe,"aria-invalid":D?!0:void 0,"aria-label":C,onClick:()=>n?x():N(),onFocus:()=>E(!0),onBlur:()=>E(!1),onKeyDown:ue,children:[g!=null&&l.jsx("span",{className:s.default["select__leading-icon"],"aria-hidden":!0,children:g}),l.jsx("span",{className:s.default.select__value,children:z}),l.jsx("span",{className:s.default["select__trailing-icon"],"aria-hidden":!0,children:l.jsx(G.default,{size:"12",glyph:l.jsx(he,{})})})]})]}),q!=null&&!b&&l.jsx("input",{type:"hidden",name:q,value:m}),$&&ce(l.jsx("div",{ref:A,className:[s.default.select__popup,ne==="above"?s.default["select__popup--above"]:"",ae?s.default["select__popup--visible"]:""].filter(Boolean).join(" "),style:ie,children:l.jsx(K.default,{className:s.default.select__menu,children:l.jsx(K.PopoverMenuScroll,{maxHeight:oe,children:l.jsx("ul",{id:h,className:s.default.select__list,role:"listbox","aria-label":typeof f=="string"?f:C??"Options",children:o.map((e,t)=>l.jsx(ye,{option:e,listboxId:h,selected:e.value===m,active:t===d,onSelect:F,onHover:()=>p(t)},e.value))})})})}))]})});exports.default=we;
2
2
  //# sourceMappingURL=Select.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"Select.cjs","sources":["../../../src/components/select/Select.tsx"],"sourcesContent":["import type { KeyboardEvent, ReactNode } from 'react';\nimport {\n forwardRef,\n useCallback,\n useEffect,\n useId,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport ChevronDownIcon from '@mattermost/compass-icons/components/chevron-down';\nimport CheckIcon from '@mattermost/compass-icons/components/check';\nimport Icon from '@/components/icon/Icon';\nimport PopoverMenu, {\n PopoverMenuScroll,\n} from '@/components/popover-menu/PopoverMenu';\nimport menuItemStyles from '@/components/menu-item/MenuItem.module.scss';\nimport { useAnchoredPopupPortal } from '@/hooks/use-anchored-popup-portal';\nimport { useOutsideClose } from '@/hooks/use-outside-close';\nimport { usePopoverTransition } from '@/hooks/use-popover-transition';\nimport { toKebab } from '@/utils/string';\nimport styles from './Select.module.scss';\n\nexport type SelectSize = 'small' | 'medium' | 'large';\n\nexport type SelectOption = {\n value: string;\n label: string;\n disabled?: boolean;\n leadingVisual?: ReactNode;\n secondaryLabel?: string;\n};\n\nexport interface SelectProps {\n options: SelectOption[];\n value?: string;\n defaultValue?: string;\n onChange?: (value: string) => void;\n /** Shown on the trigger when no value is selected. Empty-value options are not listed in the menu. */\n placeholder?: string;\n label?: ReactNode;\n leadingIcon?: ReactNode;\n size?: SelectSize;\n invalid?: boolean;\n disabled?: boolean;\n id?: string;\n name?: string;\n className?: string;\n 'aria-label'?: string;\n /** Portal mount node for the menu; defaults to `document.body`. */\n portalContainer?: HTMLElement | null;\n /** Stacking order for the portaled menu. */\n zIndex?: number;\n}\n\nconst POPUP_MAX_HEIGHT = 280;\n\nfunction SelectOptionRow({\n option,\n listboxId,\n selected,\n active,\n onSelect,\n onHover,\n}: {\n option: SelectOption;\n listboxId: string;\n selected: boolean;\n active: boolean;\n onSelect: (option: SelectOption) => void;\n onHover: () => void;\n}) {\n const rowClass = [\n menuItemStyles['menu-item'],\n active ? menuItemStyles['menu-item--active'] : '',\n ]\n .filter(Boolean)\n .join(' ');\n\n return (\n <li\n id={`${listboxId}-option-${option.value}`}\n role=\"option\"\n className={[styles.select__option, rowClass].filter(Boolean).join(' ')}\n aria-selected={selected}\n aria-disabled={option.disabled || undefined}\n onMouseDown={(ev) => ev.preventDefault()}\n onMouseEnter={onHover}\n onPointerUp={() => {\n if (!option.disabled) onSelect(option);\n }}\n >\n <div\n className={[\n menuItemStyles['menu-item__content'],\n option.disabled ? styles['select__option-content--disabled'] : '',\n ]\n .filter(Boolean)\n .join(' ')}\n >\n {option.leadingVisual != null && (\n <div className={menuItemStyles['menu-item__left']}>\n <span className={menuItemStyles['menu-item__leading-visual']}>\n {option.leadingVisual}\n </span>\n </div>\n )}\n <div className={menuItemStyles['menu-item__middle']}>\n <div className={menuItemStyles['menu-item__top-row']}>\n <span className={menuItemStyles['menu-item__label']}>\n {option.label}\n </span>\n </div>\n {option.secondaryLabel != null && (\n <div className={menuItemStyles['menu-item__bottom-row']}>\n <span className={menuItemStyles['menu-item__secondary-label-below']}>\n {option.secondaryLabel}\n </span>\n </div>\n )}\n </div>\n {selected && (\n <div className={menuItemStyles['menu-item__right']}>\n <span\n className={[\n menuItemStyles['menu-item__trailing-visual'],\n menuItemStyles['menu-item__trailing-visual--check'],\n ].join(' ')}\n >\n <Icon glyph={<CheckIcon />} size=\"16\" />\n </span>\n </div>\n )}\n </div>\n </li>\n );\n}\n\n/**\n * { value: 'town-square', label: 'Town Square' }, { value: 'off-topic', label: 'Off-Topic'\n * }, { value: 'design', label: 'Design' }, ];\n */\nconst Select = forwardRef<HTMLButtonElement, SelectProps>(function Select(\n {\n options,\n value: valueProp,\n defaultValue = '',\n onChange,\n placeholder,\n label,\n leadingIcon,\n size = 'medium',\n invalid = false,\n disabled = false,\n id: idProp,\n name,\n className = '',\n 'aria-label': ariaLabel,\n portalContainer = null,\n zIndex,\n },\n ref,\n) {\n const generatedId = useId();\n const id = idProp ?? generatedId;\n const listboxId = `${id}-listbox`;\n\n const rootRef = useRef<HTMLDivElement>(null);\n const anchorRef = useRef<HTMLDivElement>(null);\n const buttonRef = useRef<HTMLButtonElement | null>(null);\n\n const setButtonRef = useCallback(\n (node: HTMLButtonElement | null) => {\n buttonRef.current = node;\n if (typeof ref === 'function') ref(node);\n else if (ref) ref.current = node;\n },\n [ref],\n );\n\n const isControlled = valueProp !== undefined;\n const [uncontrolledValue, setUncontrolledValue] = useState(defaultValue);\n const value = isControlled ? valueProp! : uncontrolledValue;\n\n const [isOpen, setIsOpen] = useState(false);\n const [isFocused, setIsFocused] = useState(false);\n const [activeIndex, setActiveIndex] = useState(-1);\n\n const selectedOption = useMemo(\n () => options.find((o) => o.value === value),\n [options, value],\n );\n\n const listOptions = useMemo(\n () => options.filter((o) => o.value !== ''),\n [options],\n );\n\n const hasValue = value !== '';\n\n const { mounted: popupMounted, visible: popupVisible } =\n usePopoverTransition(isOpen);\n\n const {\n placement,\n maxHeight,\n style: popupStyle,\n portalRef,\n renderPortal,\n } = useAnchoredPopupPortal(anchorRef, popupMounted, {\n preferredHeight: POPUP_MAX_HEIGHT,\n maxHeightCap: POPUP_MAX_HEIGHT,\n portalContainer,\n zIndex,\n });\n\n const close = useCallback(() => {\n setIsOpen(false);\n setActiveIndex(-1);\n }, []);\n\n const open = useCallback(() => {\n if (disabled) return;\n setIsOpen(true);\n }, [disabled]);\n\n useOutsideClose(rootRef, isOpen, close, portalRef);\n\n useEffect(() => {\n if (!isOpen) return;\n setActiveIndex((prev) => {\n if (listOptions.length === 0) return -1;\n if (prev >= 0 && prev < listOptions.length) return prev;\n const selectedIdx = listOptions.findIndex((o) => o.value === value);\n if (selectedIdx >= 0) return selectedIdx;\n const firstEnabled = listOptions.findIndex((o) => !o.disabled);\n return firstEnabled >= 0 ? firstEnabled : 0;\n });\n }, [isOpen, listOptions, value]);\n\n const commitValue = useCallback(\n (next: string) => {\n if (!isControlled) setUncontrolledValue(next);\n onChange?.(next);\n },\n [isControlled, onChange],\n );\n\n const selectOption = useCallback(\n (option: SelectOption) => {\n if (option.disabled) return;\n commitValue(option.value);\n close();\n buttonRef.current?.focus();\n },\n [commitValue, close],\n );\n\n const moveActive = useCallback(\n (delta: number) => {\n const enabled = listOptions\n .map((o, i) => ({ o, i }))\n .filter(({ o }) => !o.disabled);\n if (enabled.length === 0) {\n setActiveIndex(-1);\n return;\n }\n setActiveIndex((prev) => {\n const currentPos = enabled.findIndex(({ i }) => i === prev);\n const nextPos =\n currentPos < 0\n ? delta > 0\n ? 0\n : enabled.length - 1\n : (currentPos + delta + enabled.length) % enabled.length;\n return enabled[nextPos].i;\n });\n },\n [listOptions],\n );\n\n useEffect(() => {\n if (!isOpen || activeIndex < 0) return;\n const option = listOptions[activeIndex];\n if (!option) return;\n const el = document.getElementById(`${listboxId}-option-${option.value}`);\n el?.scrollIntoView({ block: 'nearest' });\n }, [isOpen, activeIndex, listOptions, listboxId]);\n\n const handleKeyDown = (e: KeyboardEvent<HTMLButtonElement>) => {\n if (disabled) return;\n\n switch (e.key) {\n case 'ArrowDown':\n e.preventDefault();\n if (!isOpen) open();\n else moveActive(1);\n break;\n case 'ArrowUp':\n e.preventDefault();\n if (!isOpen) open();\n else moveActive(-1);\n break;\n case 'Home':\n if (isOpen && listOptions.length > 0) {\n e.preventDefault();\n const idx = listOptions.findIndex((o) => !o.disabled);\n setActiveIndex(idx >= 0 ? idx : 0);\n }\n break;\n case 'End':\n if (isOpen && listOptions.length > 0) {\n e.preventDefault();\n for (let i = listOptions.length - 1; i >= 0; i--) {\n if (!listOptions[i]?.disabled) {\n setActiveIndex(i);\n break;\n }\n }\n }\n break;\n case 'Enter':\n case ' ':\n e.preventDefault();\n if (isOpen && activeIndex >= 0 && listOptions[activeIndex]) {\n selectOption(listOptions[activeIndex]);\n } else if (!isOpen) {\n open();\n }\n break;\n case 'Escape':\n if (isOpen) {\n e.preventDefault();\n close();\n }\n break;\n case 'Tab':\n close();\n break;\n default:\n break;\n }\n };\n\n const labelFloated = isFocused || isOpen || hasValue;\n const displayLabel = selectedOption?.label ?? placeholder ?? '';\n const showPlaceholderStyle = !hasValue && displayLabel !== '';\n\n const activeOption =\n activeIndex >= 0 ? listOptions[activeIndex] : undefined;\n const activeDescendant =\n isOpen && activeOption != null\n ? `${listboxId}-option-${activeOption.value}`\n : undefined;\n\n const sizeClass = styles[`select--size-${toKebab(size)}`];\n const rootClass = [\n styles.select,\n sizeClass,\n invalid ? styles['select--invalid'] : '',\n label != null && labelFloated ? styles['select--label-floated'] : '',\n leadingIcon != null ? styles['select--has-leading-icon'] : '',\n isOpen ? styles['select--open'] : '',\n disabled ? styles['select--disabled'] : '',\n className,\n ]\n .filter(Boolean)\n .join(' ');\n\n const controlClass = [\n styles.select__control,\n showPlaceholderStyle ? styles['select__control--placeholder'] : '',\n ]\n .filter(Boolean)\n .join(' ');\n\n return (\n <div className={rootClass} ref={rootRef}>\n <div className={styles.select__wrapper} ref={anchorRef}>\n {label != null && (\n <label className={styles.select__label} htmlFor={id}>\n {label}\n </label>\n )}\n <button\n ref={setButtonRef}\n id={id}\n type=\"button\"\n role=\"combobox\"\n className={controlClass}\n disabled={disabled}\n aria-haspopup=\"listbox\"\n aria-expanded={isOpen}\n aria-controls={listboxId}\n aria-activedescendant={activeDescendant}\n aria-invalid={invalid ? true : undefined}\n aria-label={\n ariaLabel ??\n (typeof label === 'string' ? label : undefined)\n }\n onClick={() => (isOpen ? close() : open())}\n onFocus={() => setIsFocused(true)}\n onBlur={() => setIsFocused(false)}\n onKeyDown={handleKeyDown}\n >\n {leadingIcon != null && (\n <span className={styles.select__leadingIcon} aria-hidden>\n {leadingIcon}\n </span>\n )}\n <span className={styles.select__value}>{displayLabel}</span>\n <span className={styles.select__trailingIcon} aria-hidden>\n <Icon size=\"12\" glyph={<ChevronDownIcon />} />\n </span>\n </button>\n </div>\n\n {name != null && !disabled && (\n <input type=\"hidden\" name={name} value={value} />\n )}\n\n {popupMounted &&\n renderPortal(\n <div\n ref={portalRef}\n className={[\n styles.select__popup,\n placement === 'above' ? styles['select__popup--above'] : '',\n popupVisible ? styles['select__popup--visible'] : '',\n ]\n .filter(Boolean)\n .join(' ')}\n style={popupStyle}\n >\n <PopoverMenu className={styles.select__menu}>\n <PopoverMenuScroll maxHeight={maxHeight}>\n <ul\n id={listboxId}\n className={styles.select__list}\n role=\"listbox\"\n aria-label={\n typeof label === 'string' ? label : (ariaLabel ?? 'Options')\n }\n >\n {listOptions.map((option, index) => (\n <SelectOptionRow\n key={option.value}\n option={option}\n listboxId={listboxId}\n selected={option.value === value}\n active={index === activeIndex}\n onSelect={selectOption}\n onHover={() => setActiveIndex(index)}\n />\n ))}\n </ul>\n </PopoverMenuScroll>\n </PopoverMenu>\n </div>,\n )}\n </div>\n );\n});\n\nexport default Select;\n"],"names":["POPUP_MAX_HEIGHT","SelectOptionRow","option","listboxId","selected","active","onSelect","onHover","rowClass","menuItemStyles","jsx","styles","ev","jsxs","Icon","CheckIcon","Select","forwardRef","options","valueProp","defaultValue","onChange","placeholder","label","leadingIcon","size","invalid","disabled","idProp","name","className","ariaLabel","portalContainer","zIndex","ref","generatedId","useId","id","rootRef","useRef","anchorRef","buttonRef","setButtonRef","useCallback","node","isControlled","uncontrolledValue","setUncontrolledValue","useState","value","isOpen","setIsOpen","isFocused","setIsFocused","activeIndex","setActiveIndex","selectedOption","useMemo","o","listOptions","hasValue","popupMounted","popupVisible","usePopoverTransition","placement","maxHeight","popupStyle","portalRef","renderPortal","useAnchoredPopupPortal","close","open","useOutsideClose","useEffect","prev","selectedIdx","firstEnabled","commitValue","next","selectOption","_a","moveActive","delta","enabled","i","currentPos","nextPos","el","handleKeyDown","idx","labelFloated","displayLabel","showPlaceholderStyle","activeOption","activeDescendant","sizeClass","toKebab","rootClass","controlClass","ChevronDownIcon","PopoverMenu","PopoverMenuScroll","index"],"mappings":"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"}
1
+ {"version":3,"file":"Select.cjs","sources":["../../../src/components/select/Select.tsx"],"sourcesContent":["import type { KeyboardEvent, ReactNode } from 'react';\nimport {\n forwardRef,\n useCallback,\n useEffect,\n useId,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport ChevronDownIcon from '@mattermost/compass-icons/components/chevron-down';\nimport CheckIcon from '@mattermost/compass-icons/components/check';\nimport Icon from '@/components/icon/Icon';\nimport PopoverMenu, {\n PopoverMenuScroll,\n} from '@/components/popover-menu/PopoverMenu';\nimport menuItemStyles from '@/components/menu-item/MenuItem.module.scss';\nimport { useAnchoredPopupPortal } from '@/hooks/use-anchored-popup-portal';\nimport { useOutsideClose } from '@/hooks/use-outside-close';\nimport { usePopoverTransition } from '@/hooks/use-popover-transition';\nimport { toKebab } from '@/utils/string';\nimport styles from './Select.module.scss';\n\nexport type SelectSize = 'small' | 'medium' | 'large';\n\nexport type SelectOption = {\n value: string;\n label: string;\n disabled?: boolean;\n leadingVisual?: ReactNode;\n secondaryLabel?: string;\n};\n\nexport interface SelectProps {\n options: SelectOption[];\n value?: string;\n defaultValue?: string;\n onChange?: (value: string) => void;\n /** Shown on the trigger when no value is selected. Empty-value options are not listed in the menu. */\n placeholder?: string;\n label?: ReactNode;\n leadingIcon?: ReactNode;\n size?: SelectSize;\n invalid?: boolean;\n disabled?: boolean;\n id?: string;\n name?: string;\n className?: string;\n 'aria-label'?: string;\n /** Portal mount node for the menu; defaults to `document.body`. */\n portalContainer?: HTMLElement | null;\n /** Stacking order for the portaled menu. */\n zIndex?: number;\n}\n\nconst POPUP_MAX_HEIGHT = 280;\n\nfunction SelectOptionRow({\n option,\n listboxId,\n selected,\n active,\n onSelect,\n onHover,\n}: {\n option: SelectOption;\n listboxId: string;\n selected: boolean;\n active: boolean;\n onSelect: (option: SelectOption) => void;\n onHover: () => void;\n}) {\n const rowClass = [\n menuItemStyles['menu-item'],\n active ? menuItemStyles['menu-item--active'] : '',\n ]\n .filter(Boolean)\n .join(' ');\n\n return (\n <li\n id={`${listboxId}-option-${option.value}`}\n role=\"option\"\n className={[styles.select__option, rowClass].filter(Boolean).join(' ')}\n aria-selected={selected}\n aria-disabled={option.disabled || undefined}\n onMouseDown={(ev) => ev.preventDefault()}\n onMouseEnter={onHover}\n onPointerUp={() => {\n if (!option.disabled) onSelect(option);\n }}\n >\n <div\n className={[\n menuItemStyles['menu-item__content'],\n option.disabled ? styles['select__option-content--disabled'] : '',\n ]\n .filter(Boolean)\n .join(' ')}\n >\n {option.leadingVisual != null && (\n <div className={menuItemStyles['menu-item__left']}>\n <span className={menuItemStyles['menu-item__leading-visual']}>\n {option.leadingVisual}\n </span>\n </div>\n )}\n <div className={menuItemStyles['menu-item__middle']}>\n <div className={menuItemStyles['menu-item__top-row']}>\n <span className={menuItemStyles['menu-item__label']}>\n {option.label}\n </span>\n </div>\n {option.secondaryLabel != null && (\n <div className={menuItemStyles['menu-item__bottom-row']}>\n <span className={menuItemStyles['menu-item__secondary-label-below']}>\n {option.secondaryLabel}\n </span>\n </div>\n )}\n </div>\n {selected && (\n <div className={menuItemStyles['menu-item__right']}>\n <span\n className={[\n menuItemStyles['menu-item__trailing-visual'],\n menuItemStyles['menu-item__trailing-visual--check'],\n ].join(' ')}\n >\n <Icon glyph={<CheckIcon />} size=\"16\" />\n </span>\n </div>\n )}\n </div>\n </li>\n );\n}\n\n/**\n * { value: 'town-square', label: 'Town Square' }, { value: 'off-topic', label: 'Off-Topic'\n * }, { value: 'design', label: 'Design' }, ];\n */\nconst Select = forwardRef<HTMLButtonElement, SelectProps>(function Select(\n {\n options,\n value: valueProp,\n defaultValue = '',\n onChange,\n placeholder,\n label,\n leadingIcon,\n size = 'medium',\n invalid = false,\n disabled = false,\n id: idProp,\n name,\n className = '',\n 'aria-label': ariaLabel,\n portalContainer = null,\n zIndex,\n },\n ref,\n) {\n const generatedId = useId();\n const id = idProp ?? generatedId;\n const listboxId = `${id}-listbox`;\n\n const rootRef = useRef<HTMLDivElement>(null);\n const anchorRef = useRef<HTMLDivElement>(null);\n const buttonRef = useRef<HTMLButtonElement | null>(null);\n\n const setButtonRef = useCallback(\n (node: HTMLButtonElement | null) => {\n buttonRef.current = node;\n if (typeof ref === 'function') ref(node);\n else if (ref) ref.current = node;\n },\n [ref],\n );\n\n const isControlled = valueProp !== undefined;\n const [uncontrolledValue, setUncontrolledValue] = useState(defaultValue);\n const value = isControlled ? valueProp! : uncontrolledValue;\n\n const [isOpen, setIsOpen] = useState(false);\n const [isFocused, setIsFocused] = useState(false);\n const [activeIndex, setActiveIndex] = useState(-1);\n\n const selectedOption = useMemo(\n () => options.find((o) => o.value === value),\n [options, value],\n );\n\n const listOptions = useMemo(\n () => options.filter((o) => o.value !== ''),\n [options],\n );\n\n const hasValue = value !== '';\n\n const { mounted: popupMounted, visible: popupVisible } =\n usePopoverTransition(isOpen);\n\n const {\n placement,\n maxHeight,\n style: popupStyle,\n portalRef,\n renderPortal,\n } = useAnchoredPopupPortal(anchorRef, popupMounted, {\n preferredHeight: POPUP_MAX_HEIGHT,\n maxHeightCap: POPUP_MAX_HEIGHT,\n portalContainer,\n zIndex,\n });\n\n const close = useCallback(() => {\n setIsOpen(false);\n setActiveIndex(-1);\n }, []);\n\n const open = useCallback(() => {\n if (disabled) return;\n setIsOpen(true);\n }, [disabled]);\n\n useOutsideClose(rootRef, isOpen, close, portalRef);\n\n useEffect(() => {\n if (!isOpen) return;\n setActiveIndex((prev) => {\n if (listOptions.length === 0) return -1;\n if (prev >= 0 && prev < listOptions.length) return prev;\n const selectedIdx = listOptions.findIndex((o) => o.value === value);\n if (selectedIdx >= 0) return selectedIdx;\n const firstEnabled = listOptions.findIndex((o) => !o.disabled);\n return firstEnabled >= 0 ? firstEnabled : 0;\n });\n }, [isOpen, listOptions, value]);\n\n const commitValue = useCallback(\n (next: string) => {\n if (!isControlled) setUncontrolledValue(next);\n onChange?.(next);\n },\n [isControlled, onChange],\n );\n\n const selectOption = useCallback(\n (option: SelectOption) => {\n if (option.disabled) return;\n commitValue(option.value);\n close();\n buttonRef.current?.focus();\n },\n [commitValue, close],\n );\n\n const moveActive = useCallback(\n (delta: number) => {\n const enabled = listOptions\n .map((o, i) => ({ o, i }))\n .filter(({ o }) => !o.disabled);\n if (enabled.length === 0) {\n setActiveIndex(-1);\n return;\n }\n setActiveIndex((prev) => {\n const currentPos = enabled.findIndex(({ i }) => i === prev);\n const nextPos =\n currentPos < 0\n ? delta > 0\n ? 0\n : enabled.length - 1\n : (currentPos + delta + enabled.length) % enabled.length;\n return enabled[nextPos].i;\n });\n },\n [listOptions],\n );\n\n useEffect(() => {\n if (!isOpen || activeIndex < 0) return;\n const option = listOptions[activeIndex];\n if (!option) return;\n const el = document.getElementById(`${listboxId}-option-${option.value}`);\n el?.scrollIntoView({ block: 'nearest' });\n }, [isOpen, activeIndex, listOptions, listboxId]);\n\n const handleKeyDown = (e: KeyboardEvent<HTMLButtonElement>) => {\n if (disabled) return;\n\n switch (e.key) {\n case 'ArrowDown':\n e.preventDefault();\n if (!isOpen) open();\n else moveActive(1);\n break;\n case 'ArrowUp':\n e.preventDefault();\n if (!isOpen) open();\n else moveActive(-1);\n break;\n case 'Home':\n if (isOpen && listOptions.length > 0) {\n e.preventDefault();\n const idx = listOptions.findIndex((o) => !o.disabled);\n setActiveIndex(idx >= 0 ? idx : 0);\n }\n break;\n case 'End':\n if (isOpen && listOptions.length > 0) {\n e.preventDefault();\n for (let i = listOptions.length - 1; i >= 0; i--) {\n if (!listOptions[i]?.disabled) {\n setActiveIndex(i);\n break;\n }\n }\n }\n break;\n case 'Enter':\n case ' ':\n e.preventDefault();\n if (isOpen && activeIndex >= 0 && listOptions[activeIndex]) {\n selectOption(listOptions[activeIndex]);\n } else if (!isOpen) {\n open();\n }\n break;\n case 'Escape':\n if (isOpen) {\n e.preventDefault();\n close();\n }\n break;\n case 'Tab':\n close();\n break;\n default:\n break;\n }\n };\n\n const labelFloated = isFocused || isOpen || hasValue;\n const displayLabel = selectedOption?.label ?? placeholder ?? '';\n const showPlaceholderStyle = !hasValue && displayLabel !== '';\n\n const activeOption =\n activeIndex >= 0 ? listOptions[activeIndex] : undefined;\n const activeDescendant =\n isOpen && activeOption != null\n ? `${listboxId}-option-${activeOption.value}`\n : undefined;\n\n const sizeClass = styles[`select--size-${toKebab(size)}`];\n const rootClass = [\n styles.select,\n sizeClass,\n invalid ? styles['select--invalid'] : '',\n label != null && labelFloated ? styles['select--label-floated'] : '',\n leadingIcon != null ? styles['select--has-leading-icon'] : '',\n isOpen ? styles['select--open'] : '',\n disabled ? styles['select--disabled'] : '',\n className,\n ]\n .filter(Boolean)\n .join(' ');\n\n const controlClass = [\n styles.select__control,\n showPlaceholderStyle ? styles['select__control--placeholder'] : '',\n ]\n .filter(Boolean)\n .join(' ');\n\n return (\n <div className={rootClass} ref={rootRef}>\n <div className={styles.select__wrapper} ref={anchorRef}>\n {label != null && (\n <label className={styles.select__label} htmlFor={id}>\n {label}\n </label>\n )}\n <button\n ref={setButtonRef}\n id={id}\n type=\"button\"\n role=\"combobox\"\n className={controlClass}\n disabled={disabled}\n aria-haspopup=\"listbox\"\n aria-expanded={isOpen}\n aria-controls={listboxId}\n aria-activedescendant={activeDescendant}\n aria-invalid={invalid ? true : undefined}\n aria-label={ariaLabel}\n onClick={() => (isOpen ? close() : open())}\n onFocus={() => setIsFocused(true)}\n onBlur={() => setIsFocused(false)}\n onKeyDown={handleKeyDown}\n >\n {leadingIcon != null && (\n <span className={styles['select__leading-icon']} aria-hidden>\n {leadingIcon}\n </span>\n )}\n <span className={styles.select__value}>{displayLabel}</span>\n <span className={styles['select__trailing-icon']} aria-hidden>\n <Icon size=\"12\" glyph={<ChevronDownIcon />} />\n </span>\n </button>\n </div>\n\n {name != null && !disabled && (\n <input type=\"hidden\" name={name} value={value} />\n )}\n\n {popupMounted &&\n renderPortal(\n <div\n ref={portalRef}\n className={[\n styles.select__popup,\n placement === 'above' ? styles['select__popup--above'] : '',\n popupVisible ? styles['select__popup--visible'] : '',\n ]\n .filter(Boolean)\n .join(' ')}\n style={popupStyle}\n >\n <PopoverMenu className={styles.select__menu}>\n <PopoverMenuScroll maxHeight={maxHeight}>\n <ul\n id={listboxId}\n className={styles.select__list}\n role=\"listbox\"\n aria-label={\n typeof label === 'string' ? label : (ariaLabel ?? 'Options')\n }\n >\n {listOptions.map((option, index) => (\n <SelectOptionRow\n key={option.value}\n option={option}\n listboxId={listboxId}\n selected={option.value === value}\n active={index === activeIndex}\n onSelect={selectOption}\n onHover={() => setActiveIndex(index)}\n />\n ))}\n </ul>\n </PopoverMenuScroll>\n </PopoverMenu>\n </div>,\n )}\n </div>\n );\n});\n\nexport default Select;\n"],"names":["POPUP_MAX_HEIGHT","SelectOptionRow","option","listboxId","selected","active","onSelect","onHover","rowClass","menuItemStyles","jsx","styles","ev","jsxs","Icon","CheckIcon","Select","forwardRef","options","valueProp","defaultValue","onChange","placeholder","label","leadingIcon","size","invalid","disabled","idProp","name","className","ariaLabel","portalContainer","zIndex","ref","generatedId","useId","id","rootRef","useRef","anchorRef","buttonRef","setButtonRef","useCallback","node","isControlled","uncontrolledValue","setUncontrolledValue","useState","value","isOpen","setIsOpen","isFocused","setIsFocused","activeIndex","setActiveIndex","selectedOption","useMemo","o","listOptions","hasValue","popupMounted","popupVisible","usePopoverTransition","placement","maxHeight","popupStyle","portalRef","renderPortal","useAnchoredPopupPortal","close","open","useOutsideClose","useEffect","prev","selectedIdx","firstEnabled","commitValue","next","selectOption","_a","moveActive","delta","enabled","i","currentPos","nextPos","el","handleKeyDown","idx","labelFloated","displayLabel","showPlaceholderStyle","activeOption","activeDescendant","sizeClass","toKebab","rootClass","controlClass","ChevronDownIcon","PopoverMenu","PopoverMenuScroll","index"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../src/components/select/Select.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAiB,SAAS,EAAE,MAAM,OAAO,CAAC;AAuBtD,MAAM,MAAM,UAAU,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAEtD,MAAM,MAAM,YAAY,GAAG;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC;AAEF,MAAM,WAAW,WAAW;IAC1B,OAAO,EAAE,YAAY,EAAE,CAAC;IACxB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,sGAAsG;IACtG,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,mEAAmE;IACnE,eAAe,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IACrC,4CAA4C;IAC5C,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAqFD;;;GAGG;AACH,QAAA,MAAM,MAAM,2GAgUV,CAAC;AAEH,eAAe,MAAM,CAAC"}
1
+ {"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../src/components/select/Select.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAiB,SAAS,EAAE,MAAM,OAAO,CAAC;AAuBtD,MAAM,MAAM,UAAU,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAEtD,MAAM,MAAM,YAAY,GAAG;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC;AAEF,MAAM,WAAW,WAAW;IAC1B,OAAO,EAAE,YAAY,EAAE,CAAC;IACxB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,sGAAsG;IACtG,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,mEAAmE;IACnE,eAAe,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IACrC,4CAA4C;IAC5C,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAqFD;;;GAGG;AACH,QAAA,MAAM,MAAM,2GA6TV,CAAC;AAEH,eAAe,MAAM,CAAC"}
@@ -1,10 +1,10 @@
1
- import { jsxs as x, jsx as l } from "react/jsx-runtime";
2
- import { forwardRef as Ie, useId as xe, useRef as E, useCallback as y, useState as k, useMemo as q, useEffect as J } from "react";
3
- import __we from "@mattermost/compass-icons/components/chevron-down.js";const we=__we&&__we.default?__we.default:__we;
1
+ import { jsxs as w, jsx as l } from "react/jsx-runtime";
2
+ import { forwardRef as xe, useId as we, useRef as E, useCallback as N, useState as k, useMemo as q, useEffect as J } from "react";
3
+ import __Ie from "@mattermost/compass-icons/components/chevron-down.js";const Ie=__Ie&&__Ie.default?__Ie.default:__Ie;
4
4
  import __ke from "@mattermost/compass-icons/components/check.js";const ke=__ke&&__ke.default?__ke.default:__ke;
5
5
  import W from "../icon/Icon.js";
6
6
  import De, { PopoverMenuScroll as Pe } from "../popover-menu/PopoverMenu.js";
7
- import a from "../menu-item/MenuItem.module.scss.js";
7
+ import i from "../menu-item/MenuItem.module.scss.js";
8
8
  import { useAnchoredPopupPortal as je } from "../../hooks/use-anchored-popup-portal.js";
9
9
  import { useOutsideClose as Be } from "../../hooks/use-outside-close.js";
10
10
  import { usePopoverTransition as Se } from "../../hooks/use-popover-transition.js";
@@ -14,47 +14,47 @@ const Q = 280;
14
14
  function Oe({
15
15
  option: r,
16
16
  listboxId: p,
17
- selected: N,
17
+ selected: y,
18
18
  active: D,
19
19
  onSelect: v,
20
20
  onHover: P
21
21
  }) {
22
- const u = [
23
- a["menu-item"],
24
- D ? a["menu-item--active"] : ""
22
+ const d = [
23
+ i["menu-item"],
24
+ D ? i["menu-item--active"] : ""
25
25
  ].filter(Boolean).join(" ");
26
26
  return /* @__PURE__ */ l(
27
27
  "li",
28
28
  {
29
29
  id: `${p}-option-${r.value}`,
30
30
  role: "option",
31
- className: [n.select__option, u].filter(Boolean).join(" "),
32
- "aria-selected": N,
31
+ className: [n.select__option, d].filter(Boolean).join(" "),
32
+ "aria-selected": y,
33
33
  "aria-disabled": r.disabled || void 0,
34
34
  onMouseDown: (g) => g.preventDefault(),
35
35
  onMouseEnter: P,
36
36
  onPointerUp: () => {
37
37
  r.disabled || v(r);
38
38
  },
39
- children: /* @__PURE__ */ x(
39
+ children: /* @__PURE__ */ w(
40
40
  "div",
41
41
  {
42
42
  className: [
43
- a["menu-item__content"],
43
+ i["menu-item__content"],
44
44
  r.disabled ? n["select__option-content--disabled"] : ""
45
45
  ].filter(Boolean).join(" "),
46
46
  children: [
47
- r.leadingVisual != null && /* @__PURE__ */ l("div", { className: a["menu-item__left"], children: /* @__PURE__ */ l("span", { className: a["menu-item__leading-visual"], children: r.leadingVisual }) }),
48
- /* @__PURE__ */ x("div", { className: a["menu-item__middle"], children: [
49
- /* @__PURE__ */ l("div", { className: a["menu-item__top-row"], children: /* @__PURE__ */ l("span", { className: a["menu-item__label"], children: r.label }) }),
50
- r.secondaryLabel != null && /* @__PURE__ */ l("div", { className: a["menu-item__bottom-row"], children: /* @__PURE__ */ l("span", { className: a["menu-item__secondary-label-below"], children: r.secondaryLabel }) })
47
+ r.leadingVisual != null && /* @__PURE__ */ l("div", { className: i["menu-item__left"], children: /* @__PURE__ */ l("span", { className: i["menu-item__leading-visual"], children: r.leadingVisual }) }),
48
+ /* @__PURE__ */ w("div", { className: i["menu-item__middle"], children: [
49
+ /* @__PURE__ */ l("div", { className: i["menu-item__top-row"], children: /* @__PURE__ */ l("span", { className: i["menu-item__label"], children: r.label }) }),
50
+ r.secondaryLabel != null && /* @__PURE__ */ l("div", { className: i["menu-item__bottom-row"], children: /* @__PURE__ */ l("span", { className: i["menu-item__secondary-label-below"], children: r.secondaryLabel }) })
51
51
  ] }),
52
- N && /* @__PURE__ */ l("div", { className: a["menu-item__right"], children: /* @__PURE__ */ l(
52
+ y && /* @__PURE__ */ l("div", { className: i["menu-item__right"], children: /* @__PURE__ */ l(
53
53
  "span",
54
54
  {
55
55
  className: [
56
- a["menu-item__trailing-visual"],
57
- a["menu-item__trailing-visual--check"]
56
+ i["menu-item__trailing-visual"],
57
+ i["menu-item__trailing-visual--check"]
58
58
  ].join(" "),
59
59
  children: /* @__PURE__ */ l(W, { glyph: /* @__PURE__ */ l(ke, {}), size: "16" })
60
60
  }
@@ -65,13 +65,13 @@ function Oe({
65
65
  }
66
66
  );
67
67
  }
68
- const Le = Ie(function({
68
+ const Le = xe(function({
69
69
  options: p,
70
- value: N,
70
+ value: y,
71
71
  defaultValue: D = "",
72
72
  onChange: v,
73
73
  placeholder: P,
74
- label: u,
74
+ label: d,
75
75
  leadingIcon: g,
76
76
  size: Y = "medium",
77
77
  invalid: O = !1,
@@ -82,13 +82,13 @@ const Le = Ie(function({
82
82
  "aria-label": V,
83
83
  portalContainer: le = null,
84
84
  zIndex: te
85
- }, I) {
86
- const ne = xe(), j = Z ?? ne, h = `${j}-listbox`, $ = E(null), H = E(null), M = E(null), se = y(
85
+ }, x) {
86
+ const ne = we(), j = Z ?? ne, h = `${j}-listbox`, $ = E(null), H = E(null), M = E(null), se = N(
87
87
  (e) => {
88
- M.current = e, typeof I == "function" ? I(e) : I && (I.current = e);
88
+ M.current = e, typeof x == "function" ? x(e) : x && (x.current = e);
89
89
  },
90
- [I]
91
- ), B = N !== void 0, [oe, ie] = k(D), m = B ? N : oe, [s, A] = k(!1), [ae, C] = k(!1), [d, f] = k(-1), S = q(
90
+ [x]
91
+ ), B = y !== void 0, [oe, ae] = k(D), m = B ? y : oe, [s, A] = k(!1), [ie, C] = k(!1), [u, f] = k(-1), S = q(
92
92
  () => p.find((e) => e.value === m),
93
93
  [p, m]
94
94
  ), o = q(
@@ -105,9 +105,9 @@ const Le = Ie(function({
105
105
  maxHeightCap: Q,
106
106
  portalContainer: le,
107
107
  zIndex: te
108
- }), b = y(() => {
108
+ }), b = N(() => {
109
109
  A(!1), f(-1);
110
- }, []), w = y(() => {
110
+ }, []), I = N(() => {
111
111
  _ || A(!0);
112
112
  }, [_]);
113
113
  Be($, s, b, U), J(() => {
@@ -116,72 +116,72 @@ const Le = Ie(function({
116
116
  if (e >= 0 && e < o.length) return e;
117
117
  const t = o.findIndex((c) => c.value === m);
118
118
  if (t >= 0) return t;
119
- const i = o.findIndex((c) => !c.disabled);
120
- return i >= 0 ? i : 0;
119
+ const a = o.findIndex((c) => !c.disabled);
120
+ return a >= 0 ? a : 0;
121
121
  });
122
122
  }, [s, o, m]);
123
- const K = y(
123
+ const K = N(
124
124
  (e) => {
125
- B || ie(e), v == null || v(e);
125
+ B || ae(e), v == null || v(e);
126
126
  },
127
127
  [B, v]
128
- ), T = y(
128
+ ), T = N(
129
129
  (e) => {
130
130
  var t;
131
131
  e.disabled || (K(e.value), b(), (t = M.current) == null || t.focus());
132
132
  },
133
133
  [K, b]
134
- ), L = y(
134
+ ), L = N(
135
135
  (e) => {
136
- const t = o.map((i, c) => ({ o: i, i: c })).filter(({ o: i }) => !i.disabled);
136
+ const t = o.map((a, c) => ({ o: a, i: c })).filter(({ o: a }) => !a.disabled);
137
137
  if (t.length === 0) {
138
138
  f(-1);
139
139
  return;
140
140
  }
141
- f((i) => {
142
- const c = t.findIndex(({ i: ge }) => ge === i), Ne = c < 0 ? e > 0 ? 0 : t.length - 1 : (c + e + t.length) % t.length;
143
- return t[Ne].i;
141
+ f((a) => {
142
+ const c = t.findIndex(({ i: ge }) => ge === a), ye = c < 0 ? e > 0 ? 0 : t.length - 1 : (c + e + t.length) % t.length;
143
+ return t[ye].i;
144
144
  });
145
145
  },
146
146
  [o]
147
147
  );
148
148
  J(() => {
149
- if (!s || d < 0) return;
150
- const e = o[d];
149
+ if (!s || u < 0) return;
150
+ const e = o[u];
151
151
  if (!e) return;
152
152
  const t = document.getElementById(`${h}-option-${e.value}`);
153
153
  t == null || t.scrollIntoView({ block: "nearest" });
154
- }, [s, d, o, h]);
154
+ }, [s, u, o, h]);
155
155
  const fe = (e) => {
156
156
  var t;
157
157
  if (!_)
158
158
  switch (e.key) {
159
159
  case "ArrowDown":
160
- e.preventDefault(), s ? L(1) : w();
160
+ e.preventDefault(), s ? L(1) : I();
161
161
  break;
162
162
  case "ArrowUp":
163
- e.preventDefault(), s ? L(-1) : w();
163
+ e.preventDefault(), s ? L(-1) : I();
164
164
  break;
165
165
  case "Home":
166
166
  if (s && o.length > 0) {
167
167
  e.preventDefault();
168
- const i = o.findIndex((c) => !c.disabled);
169
- f(i >= 0 ? i : 0);
168
+ const a = o.findIndex((c) => !c.disabled);
169
+ f(a >= 0 ? a : 0);
170
170
  }
171
171
  break;
172
172
  case "End":
173
173
  if (s && o.length > 0) {
174
174
  e.preventDefault();
175
- for (let i = o.length - 1; i >= 0; i--)
176
- if (!((t = o[i]) != null && t.disabled)) {
177
- f(i);
175
+ for (let a = o.length - 1; a >= 0; a--)
176
+ if (!((t = o[a]) != null && t.disabled)) {
177
+ f(a);
178
178
  break;
179
179
  }
180
180
  }
181
181
  break;
182
182
  case "Enter":
183
183
  case " ":
184
- e.preventDefault(), s && d >= 0 && o[d] ? T(o[d]) : s || w();
184
+ e.preventDefault(), s && u >= 0 && o[u] ? T(o[u]) : s || I();
185
185
  break;
186
186
  case "Escape":
187
187
  s && (e.preventDefault(), b());
@@ -190,45 +190,45 @@ const Le = Ie(function({
190
190
  b();
191
191
  break;
192
192
  }
193
- }, pe = ae || s || F, G = (S == null ? void 0 : S.label) ?? P ?? "", ve = !F && G !== "", X = d >= 0 ? o[d] : void 0, _e = s && X != null ? `${h}-option-${X.value}` : void 0, he = n[`select--size-${Ee(Y)}`], be = [
193
+ }, pe = ie || s || F, G = (S == null ? void 0 : S.label) ?? P ?? "", ve = !F && G !== "", X = u >= 0 ? o[u] : void 0, _e = s && X != null ? `${h}-option-${X.value}` : void 0, he = n[`select--size-${Ee(Y)}`], be = [
194
194
  n.select,
195
195
  he,
196
196
  O ? n["select--invalid"] : "",
197
- u != null && pe ? n["select--label-floated"] : "",
197
+ d != null && pe ? n["select--label-floated"] : "",
198
198
  g != null ? n["select--has-leading-icon"] : "",
199
199
  s ? n["select--open"] : "",
200
200
  _ ? n["select--disabled"] : "",
201
201
  ee
202
- ].filter(Boolean).join(" "), ye = [
202
+ ].filter(Boolean).join(" "), Ne = [
203
203
  n.select__control,
204
204
  ve ? n["select__control--placeholder"] : ""
205
205
  ].filter(Boolean).join(" ");
206
- return /* @__PURE__ */ x("div", { className: be, ref: $, children: [
207
- /* @__PURE__ */ x("div", { className: n.select__wrapper, ref: H, children: [
208
- u != null && /* @__PURE__ */ l("label", { className: n.select__label, htmlFor: j, children: u }),
209
- /* @__PURE__ */ x(
206
+ return /* @__PURE__ */ w("div", { className: be, ref: $, children: [
207
+ /* @__PURE__ */ w("div", { className: n.select__wrapper, ref: H, children: [
208
+ d != null && /* @__PURE__ */ l("label", { className: n.select__label, htmlFor: j, children: d }),
209
+ /* @__PURE__ */ w(
210
210
  "button",
211
211
  {
212
212
  ref: se,
213
213
  id: j,
214
214
  type: "button",
215
215
  role: "combobox",
216
- className: ye,
216
+ className: Ne,
217
217
  disabled: _,
218
218
  "aria-haspopup": "listbox",
219
219
  "aria-expanded": s,
220
220
  "aria-controls": h,
221
221
  "aria-activedescendant": _e,
222
222
  "aria-invalid": O ? !0 : void 0,
223
- "aria-label": V ?? (typeof u == "string" ? u : void 0),
224
- onClick: () => s ? b() : w(),
223
+ "aria-label": V,
224
+ onClick: () => s ? b() : I(),
225
225
  onFocus: () => C(!0),
226
226
  onBlur: () => C(!1),
227
227
  onKeyDown: fe,
228
228
  children: [
229
- g != null && /* @__PURE__ */ l("span", { className: n.select__leadingIcon, "aria-hidden": !0, children: g }),
229
+ g != null && /* @__PURE__ */ l("span", { className: n["select__leading-icon"], "aria-hidden": !0, children: g }),
230
230
  /* @__PURE__ */ l("span", { className: n.select__value, children: G }),
231
- /* @__PURE__ */ l("span", { className: n.select__trailingIcon, "aria-hidden": !0, children: /* @__PURE__ */ l(W, { size: "12", glyph: /* @__PURE__ */ l(we, {}) }) })
231
+ /* @__PURE__ */ l("span", { className: n["select__trailing-icon"], "aria-hidden": !0, children: /* @__PURE__ */ l(W, { size: "12", glyph: /* @__PURE__ */ l(Ie, {}) }) })
232
232
  ]
233
233
  }
234
234
  )
@@ -251,14 +251,14 @@ const Le = Ie(function({
251
251
  id: h,
252
252
  className: n.select__list,
253
253
  role: "listbox",
254
- "aria-label": typeof u == "string" ? u : V ?? "Options",
254
+ "aria-label": typeof d == "string" ? d : V ?? "Options",
255
255
  children: o.map((e, t) => /* @__PURE__ */ l(
256
256
  Oe,
257
257
  {
258
258
  option: e,
259
259
  listboxId: h,
260
260
  selected: e.value === m,
261
- active: t === d,
261
+ active: t === u,
262
262
  onSelect: T,
263
263
  onHover: () => f(t)
264
264
  },
@@ -1 +1 @@
1
- {"version":3,"file":"Select.js","sources":["../../../src/components/select/Select.tsx"],"sourcesContent":["import type { KeyboardEvent, ReactNode } from 'react';\nimport {\n forwardRef,\n useCallback,\n useEffect,\n useId,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport ChevronDownIcon from '@mattermost/compass-icons/components/chevron-down';\nimport CheckIcon from '@mattermost/compass-icons/components/check';\nimport Icon from '@/components/icon/Icon';\nimport PopoverMenu, {\n PopoverMenuScroll,\n} from '@/components/popover-menu/PopoverMenu';\nimport menuItemStyles from '@/components/menu-item/MenuItem.module.scss';\nimport { useAnchoredPopupPortal } from '@/hooks/use-anchored-popup-portal';\nimport { useOutsideClose } from '@/hooks/use-outside-close';\nimport { usePopoverTransition } from '@/hooks/use-popover-transition';\nimport { toKebab } from '@/utils/string';\nimport styles from './Select.module.scss';\n\nexport type SelectSize = 'small' | 'medium' | 'large';\n\nexport type SelectOption = {\n value: string;\n label: string;\n disabled?: boolean;\n leadingVisual?: ReactNode;\n secondaryLabel?: string;\n};\n\nexport interface SelectProps {\n options: SelectOption[];\n value?: string;\n defaultValue?: string;\n onChange?: (value: string) => void;\n /** Shown on the trigger when no value is selected. Empty-value options are not listed in the menu. */\n placeholder?: string;\n label?: ReactNode;\n leadingIcon?: ReactNode;\n size?: SelectSize;\n invalid?: boolean;\n disabled?: boolean;\n id?: string;\n name?: string;\n className?: string;\n 'aria-label'?: string;\n /** Portal mount node for the menu; defaults to `document.body`. */\n portalContainer?: HTMLElement | null;\n /** Stacking order for the portaled menu. */\n zIndex?: number;\n}\n\nconst POPUP_MAX_HEIGHT = 280;\n\nfunction SelectOptionRow({\n option,\n listboxId,\n selected,\n active,\n onSelect,\n onHover,\n}: {\n option: SelectOption;\n listboxId: string;\n selected: boolean;\n active: boolean;\n onSelect: (option: SelectOption) => void;\n onHover: () => void;\n}) {\n const rowClass = [\n menuItemStyles['menu-item'],\n active ? menuItemStyles['menu-item--active'] : '',\n ]\n .filter(Boolean)\n .join(' ');\n\n return (\n <li\n id={`${listboxId}-option-${option.value}`}\n role=\"option\"\n className={[styles.select__option, rowClass].filter(Boolean).join(' ')}\n aria-selected={selected}\n aria-disabled={option.disabled || undefined}\n onMouseDown={(ev) => ev.preventDefault()}\n onMouseEnter={onHover}\n onPointerUp={() => {\n if (!option.disabled) onSelect(option);\n }}\n >\n <div\n className={[\n menuItemStyles['menu-item__content'],\n option.disabled ? styles['select__option-content--disabled'] : '',\n ]\n .filter(Boolean)\n .join(' ')}\n >\n {option.leadingVisual != null && (\n <div className={menuItemStyles['menu-item__left']}>\n <span className={menuItemStyles['menu-item__leading-visual']}>\n {option.leadingVisual}\n </span>\n </div>\n )}\n <div className={menuItemStyles['menu-item__middle']}>\n <div className={menuItemStyles['menu-item__top-row']}>\n <span className={menuItemStyles['menu-item__label']}>\n {option.label}\n </span>\n </div>\n {option.secondaryLabel != null && (\n <div className={menuItemStyles['menu-item__bottom-row']}>\n <span className={menuItemStyles['menu-item__secondary-label-below']}>\n {option.secondaryLabel}\n </span>\n </div>\n )}\n </div>\n {selected && (\n <div className={menuItemStyles['menu-item__right']}>\n <span\n className={[\n menuItemStyles['menu-item__trailing-visual'],\n menuItemStyles['menu-item__trailing-visual--check'],\n ].join(' ')}\n >\n <Icon glyph={<CheckIcon />} size=\"16\" />\n </span>\n </div>\n )}\n </div>\n </li>\n );\n}\n\n/**\n * { value: 'town-square', label: 'Town Square' }, { value: 'off-topic', label: 'Off-Topic'\n * }, { value: 'design', label: 'Design' }, ];\n */\nconst Select = forwardRef<HTMLButtonElement, SelectProps>(function Select(\n {\n options,\n value: valueProp,\n defaultValue = '',\n onChange,\n placeholder,\n label,\n leadingIcon,\n size = 'medium',\n invalid = false,\n disabled = false,\n id: idProp,\n name,\n className = '',\n 'aria-label': ariaLabel,\n portalContainer = null,\n zIndex,\n },\n ref,\n) {\n const generatedId = useId();\n const id = idProp ?? generatedId;\n const listboxId = `${id}-listbox`;\n\n const rootRef = useRef<HTMLDivElement>(null);\n const anchorRef = useRef<HTMLDivElement>(null);\n const buttonRef = useRef<HTMLButtonElement | null>(null);\n\n const setButtonRef = useCallback(\n (node: HTMLButtonElement | null) => {\n buttonRef.current = node;\n if (typeof ref === 'function') ref(node);\n else if (ref) ref.current = node;\n },\n [ref],\n );\n\n const isControlled = valueProp !== undefined;\n const [uncontrolledValue, setUncontrolledValue] = useState(defaultValue);\n const value = isControlled ? valueProp! : uncontrolledValue;\n\n const [isOpen, setIsOpen] = useState(false);\n const [isFocused, setIsFocused] = useState(false);\n const [activeIndex, setActiveIndex] = useState(-1);\n\n const selectedOption = useMemo(\n () => options.find((o) => o.value === value),\n [options, value],\n );\n\n const listOptions = useMemo(\n () => options.filter((o) => o.value !== ''),\n [options],\n );\n\n const hasValue = value !== '';\n\n const { mounted: popupMounted, visible: popupVisible } =\n usePopoverTransition(isOpen);\n\n const {\n placement,\n maxHeight,\n style: popupStyle,\n portalRef,\n renderPortal,\n } = useAnchoredPopupPortal(anchorRef, popupMounted, {\n preferredHeight: POPUP_MAX_HEIGHT,\n maxHeightCap: POPUP_MAX_HEIGHT,\n portalContainer,\n zIndex,\n });\n\n const close = useCallback(() => {\n setIsOpen(false);\n setActiveIndex(-1);\n }, []);\n\n const open = useCallback(() => {\n if (disabled) return;\n setIsOpen(true);\n }, [disabled]);\n\n useOutsideClose(rootRef, isOpen, close, portalRef);\n\n useEffect(() => {\n if (!isOpen) return;\n setActiveIndex((prev) => {\n if (listOptions.length === 0) return -1;\n if (prev >= 0 && prev < listOptions.length) return prev;\n const selectedIdx = listOptions.findIndex((o) => o.value === value);\n if (selectedIdx >= 0) return selectedIdx;\n const firstEnabled = listOptions.findIndex((o) => !o.disabled);\n return firstEnabled >= 0 ? firstEnabled : 0;\n });\n }, [isOpen, listOptions, value]);\n\n const commitValue = useCallback(\n (next: string) => {\n if (!isControlled) setUncontrolledValue(next);\n onChange?.(next);\n },\n [isControlled, onChange],\n );\n\n const selectOption = useCallback(\n (option: SelectOption) => {\n if (option.disabled) return;\n commitValue(option.value);\n close();\n buttonRef.current?.focus();\n },\n [commitValue, close],\n );\n\n const moveActive = useCallback(\n (delta: number) => {\n const enabled = listOptions\n .map((o, i) => ({ o, i }))\n .filter(({ o }) => !o.disabled);\n if (enabled.length === 0) {\n setActiveIndex(-1);\n return;\n }\n setActiveIndex((prev) => {\n const currentPos = enabled.findIndex(({ i }) => i === prev);\n const nextPos =\n currentPos < 0\n ? delta > 0\n ? 0\n : enabled.length - 1\n : (currentPos + delta + enabled.length) % enabled.length;\n return enabled[nextPos].i;\n });\n },\n [listOptions],\n );\n\n useEffect(() => {\n if (!isOpen || activeIndex < 0) return;\n const option = listOptions[activeIndex];\n if (!option) return;\n const el = document.getElementById(`${listboxId}-option-${option.value}`);\n el?.scrollIntoView({ block: 'nearest' });\n }, [isOpen, activeIndex, listOptions, listboxId]);\n\n const handleKeyDown = (e: KeyboardEvent<HTMLButtonElement>) => {\n if (disabled) return;\n\n switch (e.key) {\n case 'ArrowDown':\n e.preventDefault();\n if (!isOpen) open();\n else moveActive(1);\n break;\n case 'ArrowUp':\n e.preventDefault();\n if (!isOpen) open();\n else moveActive(-1);\n break;\n case 'Home':\n if (isOpen && listOptions.length > 0) {\n e.preventDefault();\n const idx = listOptions.findIndex((o) => !o.disabled);\n setActiveIndex(idx >= 0 ? idx : 0);\n }\n break;\n case 'End':\n if (isOpen && listOptions.length > 0) {\n e.preventDefault();\n for (let i = listOptions.length - 1; i >= 0; i--) {\n if (!listOptions[i]?.disabled) {\n setActiveIndex(i);\n break;\n }\n }\n }\n break;\n case 'Enter':\n case ' ':\n e.preventDefault();\n if (isOpen && activeIndex >= 0 && listOptions[activeIndex]) {\n selectOption(listOptions[activeIndex]);\n } else if (!isOpen) {\n open();\n }\n break;\n case 'Escape':\n if (isOpen) {\n e.preventDefault();\n close();\n }\n break;\n case 'Tab':\n close();\n break;\n default:\n break;\n }\n };\n\n const labelFloated = isFocused || isOpen || hasValue;\n const displayLabel = selectedOption?.label ?? placeholder ?? '';\n const showPlaceholderStyle = !hasValue && displayLabel !== '';\n\n const activeOption =\n activeIndex >= 0 ? listOptions[activeIndex] : undefined;\n const activeDescendant =\n isOpen && activeOption != null\n ? `${listboxId}-option-${activeOption.value}`\n : undefined;\n\n const sizeClass = styles[`select--size-${toKebab(size)}`];\n const rootClass = [\n styles.select,\n sizeClass,\n invalid ? styles['select--invalid'] : '',\n label != null && labelFloated ? styles['select--label-floated'] : '',\n leadingIcon != null ? styles['select--has-leading-icon'] : '',\n isOpen ? styles['select--open'] : '',\n disabled ? styles['select--disabled'] : '',\n className,\n ]\n .filter(Boolean)\n .join(' ');\n\n const controlClass = [\n styles.select__control,\n showPlaceholderStyle ? styles['select__control--placeholder'] : '',\n ]\n .filter(Boolean)\n .join(' ');\n\n return (\n <div className={rootClass} ref={rootRef}>\n <div className={styles.select__wrapper} ref={anchorRef}>\n {label != null && (\n <label className={styles.select__label} htmlFor={id}>\n {label}\n </label>\n )}\n <button\n ref={setButtonRef}\n id={id}\n type=\"button\"\n role=\"combobox\"\n className={controlClass}\n disabled={disabled}\n aria-haspopup=\"listbox\"\n aria-expanded={isOpen}\n aria-controls={listboxId}\n aria-activedescendant={activeDescendant}\n aria-invalid={invalid ? true : undefined}\n aria-label={\n ariaLabel ??\n (typeof label === 'string' ? label : undefined)\n }\n onClick={() => (isOpen ? close() : open())}\n onFocus={() => setIsFocused(true)}\n onBlur={() => setIsFocused(false)}\n onKeyDown={handleKeyDown}\n >\n {leadingIcon != null && (\n <span className={styles.select__leadingIcon} aria-hidden>\n {leadingIcon}\n </span>\n )}\n <span className={styles.select__value}>{displayLabel}</span>\n <span className={styles.select__trailingIcon} aria-hidden>\n <Icon size=\"12\" glyph={<ChevronDownIcon />} />\n </span>\n </button>\n </div>\n\n {name != null && !disabled && (\n <input type=\"hidden\" name={name} value={value} />\n )}\n\n {popupMounted &&\n renderPortal(\n <div\n ref={portalRef}\n className={[\n styles.select__popup,\n placement === 'above' ? styles['select__popup--above'] : '',\n popupVisible ? styles['select__popup--visible'] : '',\n ]\n .filter(Boolean)\n .join(' ')}\n style={popupStyle}\n >\n <PopoverMenu className={styles.select__menu}>\n <PopoverMenuScroll maxHeight={maxHeight}>\n <ul\n id={listboxId}\n className={styles.select__list}\n role=\"listbox\"\n aria-label={\n typeof label === 'string' ? label : (ariaLabel ?? 'Options')\n }\n >\n {listOptions.map((option, index) => (\n <SelectOptionRow\n key={option.value}\n option={option}\n listboxId={listboxId}\n selected={option.value === value}\n active={index === activeIndex}\n onSelect={selectOption}\n onHover={() => setActiveIndex(index)}\n />\n ))}\n </ul>\n </PopoverMenuScroll>\n </PopoverMenu>\n </div>,\n )}\n </div>\n );\n});\n\nexport default Select;\n"],"names":["POPUP_MAX_HEIGHT","SelectOptionRow","option","listboxId","selected","active","onSelect","onHover","rowClass","menuItemStyles","jsx","styles","ev","jsxs","Icon","CheckIcon","Select","forwardRef","options","valueProp","defaultValue","onChange","placeholder","label","leadingIcon","size","invalid","disabled","idProp","name","className","ariaLabel","portalContainer","zIndex","ref","generatedId","useId","id","rootRef","useRef","anchorRef","buttonRef","setButtonRef","useCallback","node","isControlled","uncontrolledValue","setUncontrolledValue","useState","value","isOpen","setIsOpen","isFocused","setIsFocused","activeIndex","setActiveIndex","selectedOption","useMemo","o","listOptions","hasValue","popupMounted","popupVisible","usePopoverTransition","placement","maxHeight","popupStyle","portalRef","renderPortal","useAnchoredPopupPortal","close","open","useOutsideClose","useEffect","prev","selectedIdx","firstEnabled","commitValue","next","selectOption","_a","moveActive","delta","enabled","i","currentPos","nextPos","el","handleKeyDown","idx","labelFloated","displayLabel","showPlaceholderStyle","activeOption","activeDescendant","sizeClass","toKebab","rootClass","controlClass","ChevronDownIcon","PopoverMenu","PopoverMenuScroll","index"],"mappings":"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"}
1
+ {"version":3,"file":"Select.js","sources":["../../../src/components/select/Select.tsx"],"sourcesContent":["import type { KeyboardEvent, ReactNode } from 'react';\nimport {\n forwardRef,\n useCallback,\n useEffect,\n useId,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport ChevronDownIcon from '@mattermost/compass-icons/components/chevron-down';\nimport CheckIcon from '@mattermost/compass-icons/components/check';\nimport Icon from '@/components/icon/Icon';\nimport PopoverMenu, {\n PopoverMenuScroll,\n} from '@/components/popover-menu/PopoverMenu';\nimport menuItemStyles from '@/components/menu-item/MenuItem.module.scss';\nimport { useAnchoredPopupPortal } from '@/hooks/use-anchored-popup-portal';\nimport { useOutsideClose } from '@/hooks/use-outside-close';\nimport { usePopoverTransition } from '@/hooks/use-popover-transition';\nimport { toKebab } from '@/utils/string';\nimport styles from './Select.module.scss';\n\nexport type SelectSize = 'small' | 'medium' | 'large';\n\nexport type SelectOption = {\n value: string;\n label: string;\n disabled?: boolean;\n leadingVisual?: ReactNode;\n secondaryLabel?: string;\n};\n\nexport interface SelectProps {\n options: SelectOption[];\n value?: string;\n defaultValue?: string;\n onChange?: (value: string) => void;\n /** Shown on the trigger when no value is selected. Empty-value options are not listed in the menu. */\n placeholder?: string;\n label?: ReactNode;\n leadingIcon?: ReactNode;\n size?: SelectSize;\n invalid?: boolean;\n disabled?: boolean;\n id?: string;\n name?: string;\n className?: string;\n 'aria-label'?: string;\n /** Portal mount node for the menu; defaults to `document.body`. */\n portalContainer?: HTMLElement | null;\n /** Stacking order for the portaled menu. */\n zIndex?: number;\n}\n\nconst POPUP_MAX_HEIGHT = 280;\n\nfunction SelectOptionRow({\n option,\n listboxId,\n selected,\n active,\n onSelect,\n onHover,\n}: {\n option: SelectOption;\n listboxId: string;\n selected: boolean;\n active: boolean;\n onSelect: (option: SelectOption) => void;\n onHover: () => void;\n}) {\n const rowClass = [\n menuItemStyles['menu-item'],\n active ? menuItemStyles['menu-item--active'] : '',\n ]\n .filter(Boolean)\n .join(' ');\n\n return (\n <li\n id={`${listboxId}-option-${option.value}`}\n role=\"option\"\n className={[styles.select__option, rowClass].filter(Boolean).join(' ')}\n aria-selected={selected}\n aria-disabled={option.disabled || undefined}\n onMouseDown={(ev) => ev.preventDefault()}\n onMouseEnter={onHover}\n onPointerUp={() => {\n if (!option.disabled) onSelect(option);\n }}\n >\n <div\n className={[\n menuItemStyles['menu-item__content'],\n option.disabled ? styles['select__option-content--disabled'] : '',\n ]\n .filter(Boolean)\n .join(' ')}\n >\n {option.leadingVisual != null && (\n <div className={menuItemStyles['menu-item__left']}>\n <span className={menuItemStyles['menu-item__leading-visual']}>\n {option.leadingVisual}\n </span>\n </div>\n )}\n <div className={menuItemStyles['menu-item__middle']}>\n <div className={menuItemStyles['menu-item__top-row']}>\n <span className={menuItemStyles['menu-item__label']}>\n {option.label}\n </span>\n </div>\n {option.secondaryLabel != null && (\n <div className={menuItemStyles['menu-item__bottom-row']}>\n <span className={menuItemStyles['menu-item__secondary-label-below']}>\n {option.secondaryLabel}\n </span>\n </div>\n )}\n </div>\n {selected && (\n <div className={menuItemStyles['menu-item__right']}>\n <span\n className={[\n menuItemStyles['menu-item__trailing-visual'],\n menuItemStyles['menu-item__trailing-visual--check'],\n ].join(' ')}\n >\n <Icon glyph={<CheckIcon />} size=\"16\" />\n </span>\n </div>\n )}\n </div>\n </li>\n );\n}\n\n/**\n * { value: 'town-square', label: 'Town Square' }, { value: 'off-topic', label: 'Off-Topic'\n * }, { value: 'design', label: 'Design' }, ];\n */\nconst Select = forwardRef<HTMLButtonElement, SelectProps>(function Select(\n {\n options,\n value: valueProp,\n defaultValue = '',\n onChange,\n placeholder,\n label,\n leadingIcon,\n size = 'medium',\n invalid = false,\n disabled = false,\n id: idProp,\n name,\n className = '',\n 'aria-label': ariaLabel,\n portalContainer = null,\n zIndex,\n },\n ref,\n) {\n const generatedId = useId();\n const id = idProp ?? generatedId;\n const listboxId = `${id}-listbox`;\n\n const rootRef = useRef<HTMLDivElement>(null);\n const anchorRef = useRef<HTMLDivElement>(null);\n const buttonRef = useRef<HTMLButtonElement | null>(null);\n\n const setButtonRef = useCallback(\n (node: HTMLButtonElement | null) => {\n buttonRef.current = node;\n if (typeof ref === 'function') ref(node);\n else if (ref) ref.current = node;\n },\n [ref],\n );\n\n const isControlled = valueProp !== undefined;\n const [uncontrolledValue, setUncontrolledValue] = useState(defaultValue);\n const value = isControlled ? valueProp! : uncontrolledValue;\n\n const [isOpen, setIsOpen] = useState(false);\n const [isFocused, setIsFocused] = useState(false);\n const [activeIndex, setActiveIndex] = useState(-1);\n\n const selectedOption = useMemo(\n () => options.find((o) => o.value === value),\n [options, value],\n );\n\n const listOptions = useMemo(\n () => options.filter((o) => o.value !== ''),\n [options],\n );\n\n const hasValue = value !== '';\n\n const { mounted: popupMounted, visible: popupVisible } =\n usePopoverTransition(isOpen);\n\n const {\n placement,\n maxHeight,\n style: popupStyle,\n portalRef,\n renderPortal,\n } = useAnchoredPopupPortal(anchorRef, popupMounted, {\n preferredHeight: POPUP_MAX_HEIGHT,\n maxHeightCap: POPUP_MAX_HEIGHT,\n portalContainer,\n zIndex,\n });\n\n const close = useCallback(() => {\n setIsOpen(false);\n setActiveIndex(-1);\n }, []);\n\n const open = useCallback(() => {\n if (disabled) return;\n setIsOpen(true);\n }, [disabled]);\n\n useOutsideClose(rootRef, isOpen, close, portalRef);\n\n useEffect(() => {\n if (!isOpen) return;\n setActiveIndex((prev) => {\n if (listOptions.length === 0) return -1;\n if (prev >= 0 && prev < listOptions.length) return prev;\n const selectedIdx = listOptions.findIndex((o) => o.value === value);\n if (selectedIdx >= 0) return selectedIdx;\n const firstEnabled = listOptions.findIndex((o) => !o.disabled);\n return firstEnabled >= 0 ? firstEnabled : 0;\n });\n }, [isOpen, listOptions, value]);\n\n const commitValue = useCallback(\n (next: string) => {\n if (!isControlled) setUncontrolledValue(next);\n onChange?.(next);\n },\n [isControlled, onChange],\n );\n\n const selectOption = useCallback(\n (option: SelectOption) => {\n if (option.disabled) return;\n commitValue(option.value);\n close();\n buttonRef.current?.focus();\n },\n [commitValue, close],\n );\n\n const moveActive = useCallback(\n (delta: number) => {\n const enabled = listOptions\n .map((o, i) => ({ o, i }))\n .filter(({ o }) => !o.disabled);\n if (enabled.length === 0) {\n setActiveIndex(-1);\n return;\n }\n setActiveIndex((prev) => {\n const currentPos = enabled.findIndex(({ i }) => i === prev);\n const nextPos =\n currentPos < 0\n ? delta > 0\n ? 0\n : enabled.length - 1\n : (currentPos + delta + enabled.length) % enabled.length;\n return enabled[nextPos].i;\n });\n },\n [listOptions],\n );\n\n useEffect(() => {\n if (!isOpen || activeIndex < 0) return;\n const option = listOptions[activeIndex];\n if (!option) return;\n const el = document.getElementById(`${listboxId}-option-${option.value}`);\n el?.scrollIntoView({ block: 'nearest' });\n }, [isOpen, activeIndex, listOptions, listboxId]);\n\n const handleKeyDown = (e: KeyboardEvent<HTMLButtonElement>) => {\n if (disabled) return;\n\n switch (e.key) {\n case 'ArrowDown':\n e.preventDefault();\n if (!isOpen) open();\n else moveActive(1);\n break;\n case 'ArrowUp':\n e.preventDefault();\n if (!isOpen) open();\n else moveActive(-1);\n break;\n case 'Home':\n if (isOpen && listOptions.length > 0) {\n e.preventDefault();\n const idx = listOptions.findIndex((o) => !o.disabled);\n setActiveIndex(idx >= 0 ? idx : 0);\n }\n break;\n case 'End':\n if (isOpen && listOptions.length > 0) {\n e.preventDefault();\n for (let i = listOptions.length - 1; i >= 0; i--) {\n if (!listOptions[i]?.disabled) {\n setActiveIndex(i);\n break;\n }\n }\n }\n break;\n case 'Enter':\n case ' ':\n e.preventDefault();\n if (isOpen && activeIndex >= 0 && listOptions[activeIndex]) {\n selectOption(listOptions[activeIndex]);\n } else if (!isOpen) {\n open();\n }\n break;\n case 'Escape':\n if (isOpen) {\n e.preventDefault();\n close();\n }\n break;\n case 'Tab':\n close();\n break;\n default:\n break;\n }\n };\n\n const labelFloated = isFocused || isOpen || hasValue;\n const displayLabel = selectedOption?.label ?? placeholder ?? '';\n const showPlaceholderStyle = !hasValue && displayLabel !== '';\n\n const activeOption =\n activeIndex >= 0 ? listOptions[activeIndex] : undefined;\n const activeDescendant =\n isOpen && activeOption != null\n ? `${listboxId}-option-${activeOption.value}`\n : undefined;\n\n const sizeClass = styles[`select--size-${toKebab(size)}`];\n const rootClass = [\n styles.select,\n sizeClass,\n invalid ? styles['select--invalid'] : '',\n label != null && labelFloated ? styles['select--label-floated'] : '',\n leadingIcon != null ? styles['select--has-leading-icon'] : '',\n isOpen ? styles['select--open'] : '',\n disabled ? styles['select--disabled'] : '',\n className,\n ]\n .filter(Boolean)\n .join(' ');\n\n const controlClass = [\n styles.select__control,\n showPlaceholderStyle ? styles['select__control--placeholder'] : '',\n ]\n .filter(Boolean)\n .join(' ');\n\n return (\n <div className={rootClass} ref={rootRef}>\n <div className={styles.select__wrapper} ref={anchorRef}>\n {label != null && (\n <label className={styles.select__label} htmlFor={id}>\n {label}\n </label>\n )}\n <button\n ref={setButtonRef}\n id={id}\n type=\"button\"\n role=\"combobox\"\n className={controlClass}\n disabled={disabled}\n aria-haspopup=\"listbox\"\n aria-expanded={isOpen}\n aria-controls={listboxId}\n aria-activedescendant={activeDescendant}\n aria-invalid={invalid ? true : undefined}\n aria-label={ariaLabel}\n onClick={() => (isOpen ? close() : open())}\n onFocus={() => setIsFocused(true)}\n onBlur={() => setIsFocused(false)}\n onKeyDown={handleKeyDown}\n >\n {leadingIcon != null && (\n <span className={styles['select__leading-icon']} aria-hidden>\n {leadingIcon}\n </span>\n )}\n <span className={styles.select__value}>{displayLabel}</span>\n <span className={styles['select__trailing-icon']} aria-hidden>\n <Icon size=\"12\" glyph={<ChevronDownIcon />} />\n </span>\n </button>\n </div>\n\n {name != null && !disabled && (\n <input type=\"hidden\" name={name} value={value} />\n )}\n\n {popupMounted &&\n renderPortal(\n <div\n ref={portalRef}\n className={[\n styles.select__popup,\n placement === 'above' ? styles['select__popup--above'] : '',\n popupVisible ? styles['select__popup--visible'] : '',\n ]\n .filter(Boolean)\n .join(' ')}\n style={popupStyle}\n >\n <PopoverMenu className={styles.select__menu}>\n <PopoverMenuScroll maxHeight={maxHeight}>\n <ul\n id={listboxId}\n className={styles.select__list}\n role=\"listbox\"\n aria-label={\n typeof label === 'string' ? label : (ariaLabel ?? 'Options')\n }\n >\n {listOptions.map((option, index) => (\n <SelectOptionRow\n key={option.value}\n option={option}\n listboxId={listboxId}\n selected={option.value === value}\n active={index === activeIndex}\n onSelect={selectOption}\n onHover={() => setActiveIndex(index)}\n />\n ))}\n </ul>\n </PopoverMenuScroll>\n </PopoverMenu>\n </div>,\n )}\n </div>\n );\n});\n\nexport default Select;\n"],"names":["POPUP_MAX_HEIGHT","SelectOptionRow","option","listboxId","selected","active","onSelect","onHover","rowClass","menuItemStyles","jsx","styles","ev","jsxs","Icon","CheckIcon","Select","forwardRef","options","valueProp","defaultValue","onChange","placeholder","label","leadingIcon","size","invalid","disabled","idProp","name","className","ariaLabel","portalContainer","zIndex","ref","generatedId","useId","id","rootRef","useRef","anchorRef","buttonRef","setButtonRef","useCallback","node","isControlled","uncontrolledValue","setUncontrolledValue","useState","value","isOpen","setIsOpen","isFocused","setIsFocused","activeIndex","setActiveIndex","selectedOption","useMemo","o","listOptions","hasValue","popupMounted","popupVisible","usePopoverTransition","placement","maxHeight","popupStyle","portalRef","renderPortal","useAnchoredPopupPortal","close","open","useOutsideClose","useEffect","prev","selectedIdx","firstEnabled","commitValue","next","selectOption","_a","moveActive","delta","enabled","i","currentPos","nextPos","el","handleKeyDown","idx","labelFloated","displayLabel","showPlaceholderStyle","activeOption","activeDescendant","sizeClass","toKebab","rootClass","controlClass","ChevronDownIcon","PopoverMenu","PopoverMenuScroll","index"],"mappings":"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"}