@mattermost/compass-ui 0.1.0-alpha.15 → 0.1.0-alpha.17

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 (198) hide show
  1. package/dist/components/admin-console-footer/AdminConsoleFooter.cjs +2 -0
  2. package/dist/components/admin-console-footer/AdminConsoleFooter.cjs.map +1 -0
  3. package/dist/components/admin-console-footer/AdminConsoleFooter.css +1 -0
  4. package/dist/components/admin-console-footer/AdminConsoleFooter.d.ts +27 -0
  5. package/dist/components/admin-console-footer/AdminConsoleFooter.d.ts.map +1 -0
  6. package/dist/components/admin-console-footer/AdminConsoleFooter.js +84 -0
  7. package/dist/components/admin-console-footer/AdminConsoleFooter.js.map +1 -0
  8. package/dist/components/admin-console-footer/AdminConsoleFooter.module.scss.cjs +2 -0
  9. package/dist/components/admin-console-footer/AdminConsoleFooter.module.scss.cjs.map +1 -0
  10. package/dist/components/admin-console-footer/AdminConsoleFooter.module.scss.js +13 -0
  11. package/dist/components/admin-console-footer/AdminConsoleFooter.module.scss.js.map +1 -0
  12. package/dist/components/admin-console-footer/index.cjs +2 -0
  13. package/dist/components/admin-console-footer/index.cjs.map +1 -0
  14. package/dist/components/admin-console-footer/index.d.ts +3 -0
  15. package/dist/components/admin-console-footer/index.d.ts.map +1 -0
  16. package/dist/components/admin-console-footer/index.js +5 -0
  17. package/dist/components/admin-console-footer/index.js.map +1 -0
  18. package/dist/components/admin-panel/AdminPanel.cjs +1 -1
  19. package/dist/components/admin-panel/AdminPanel.cjs.map +1 -1
  20. package/dist/components/admin-panel/AdminPanel.d.ts +41 -9
  21. package/dist/components/admin-panel/AdminPanel.d.ts.map +1 -1
  22. package/dist/components/admin-panel/AdminPanel.js +91 -81
  23. package/dist/components/admin-panel/AdminPanel.js.map +1 -1
  24. package/dist/components/admin-panel-footer/AdminPanelFooter.cjs +1 -1
  25. package/dist/components/admin-panel-footer/AdminPanelFooter.cjs.map +1 -1
  26. package/dist/components/admin-panel-footer/AdminPanelFooter.css +1 -1
  27. package/dist/components/admin-panel-footer/AdminPanelFooter.d.ts +18 -21
  28. package/dist/components/admin-panel-footer/AdminPanelFooter.d.ts.map +1 -1
  29. package/dist/components/admin-panel-footer/AdminPanelFooter.js +24 -61
  30. package/dist/components/admin-panel-footer/AdminPanelFooter.js.map +1 -1
  31. package/dist/components/admin-panel-footer/AdminPanelFooter.module.scss.cjs +1 -1
  32. package/dist/components/admin-panel-footer/AdminPanelFooter.module.scss.js +7 -9
  33. package/dist/components/admin-panel-footer/AdminPanelFooter.module.scss.js.map +1 -1
  34. package/dist/components/admin-panel-footer/index.d.ts +1 -1
  35. package/dist/components/admin-panel-footer/index.d.ts.map +1 -1
  36. package/dist/components/admin-panel-header/AdminPanelHeader.cjs.map +1 -1
  37. package/dist/components/admin-panel-header/AdminPanelHeader.d.ts +3 -2
  38. package/dist/components/admin-panel-header/AdminPanelHeader.d.ts.map +1 -1
  39. package/dist/components/admin-panel-header/AdminPanelHeader.js.map +1 -1
  40. package/dist/components/channel-sidebar-item/ChannelSidebarItem.css +1 -1
  41. package/dist/components/channel-sidebar-item/ChannelSidebarItem.module.scss.cjs +1 -1
  42. package/dist/components/channel-sidebar-item/ChannelSidebarItem.module.scss.js +22 -22
  43. package/dist/components/checkbox/Checkbox.css +1 -1
  44. package/dist/components/checkbox/Checkbox.module.scss.cjs +1 -1
  45. package/dist/components/checkbox/Checkbox.module.scss.js +10 -10
  46. package/dist/components/chip/Chip.css +1 -1
  47. package/dist/components/chip/Chip.module.scss.cjs +1 -1
  48. package/dist/components/chip/Chip.module.scss.js +12 -12
  49. package/dist/components/combobox/Combobox.cjs +1 -1
  50. package/dist/components/combobox/Combobox.cjs.map +1 -1
  51. package/dist/components/combobox/Combobox.css +1 -1
  52. package/dist/components/combobox/Combobox.d.ts +14 -0
  53. package/dist/components/combobox/Combobox.d.ts.map +1 -1
  54. package/dist/components/combobox/Combobox.js +240 -224
  55. package/dist/components/combobox/Combobox.js.map +1 -1
  56. package/dist/components/combobox/Combobox.module.scss.cjs +1 -1
  57. package/dist/components/combobox/Combobox.module.scss.js +21 -21
  58. package/dist/components/error-message/ErrorMessage.cjs +1 -1
  59. package/dist/components/error-message/ErrorMessage.cjs.map +1 -1
  60. package/dist/components/error-message/ErrorMessage.d.ts +2 -3
  61. package/dist/components/error-message/ErrorMessage.d.ts.map +1 -1
  62. package/dist/components/error-message/ErrorMessage.js +16 -14
  63. package/dist/components/error-message/ErrorMessage.js.map +1 -1
  64. package/dist/components/field/FieldClearButton.cjs +2 -0
  65. package/dist/components/field/FieldClearButton.cjs.map +1 -0
  66. package/dist/components/field/FieldClearButton.css +1 -0
  67. package/dist/components/field/FieldClearButton.d.ts +17 -0
  68. package/dist/components/field/FieldClearButton.d.ts.map +1 -0
  69. package/dist/components/field/FieldClearButton.js +40 -0
  70. package/dist/components/field/FieldClearButton.js.map +1 -0
  71. package/dist/components/field/FieldClearButton.module.scss.cjs +2 -0
  72. package/dist/components/field/FieldClearButton.module.scss.cjs.map +1 -0
  73. package/dist/components/field/FieldClearButton.module.scss.js +7 -0
  74. package/dist/components/field/FieldClearButton.module.scss.js.map +1 -0
  75. package/dist/components/field/fieldDescribedBy.cjs +2 -0
  76. package/dist/components/field/fieldDescribedBy.cjs.map +1 -0
  77. package/dist/components/field/fieldDescribedBy.d.ts +11 -0
  78. package/dist/components/field/fieldDescribedBy.d.ts.map +1 -0
  79. package/dist/components/field/fieldDescribedBy.js +15 -0
  80. package/dist/components/field/fieldDescribedBy.js.map +1 -0
  81. package/dist/components/field/useFieldClear.cjs +2 -0
  82. package/dist/components/field/useFieldClear.cjs.map +1 -0
  83. package/dist/components/field/useFieldClear.d.ts +21 -0
  84. package/dist/components/field/useFieldClear.d.ts.map +1 -0
  85. package/dist/components/field/useFieldClear.js +73 -0
  86. package/dist/components/field/useFieldClear.js.map +1 -0
  87. package/dist/components/field-message/FieldMessage.cjs +2 -0
  88. package/dist/components/field-message/FieldMessage.cjs.map +1 -0
  89. package/dist/components/field-message/FieldMessage.css +1 -0
  90. package/dist/components/field-message/FieldMessage.d.ts +17 -0
  91. package/dist/components/field-message/FieldMessage.d.ts.map +1 -0
  92. package/dist/components/field-message/FieldMessage.js +28 -0
  93. package/dist/components/field-message/FieldMessage.js.map +1 -0
  94. package/dist/components/field-message/FieldMessage.module.scss.cjs +2 -0
  95. package/dist/components/field-message/FieldMessage.module.scss.cjs.map +1 -0
  96. package/dist/components/field-message/FieldMessage.module.scss.js +13 -0
  97. package/dist/components/field-message/FieldMessage.module.scss.js.map +1 -0
  98. package/dist/components/field-message/index.cjs +2 -0
  99. package/dist/components/field-message/index.cjs.map +1 -0
  100. package/dist/components/field-message/index.d.ts +3 -0
  101. package/dist/components/field-message/index.d.ts.map +1 -0
  102. package/dist/components/field-message/index.js +5 -0
  103. package/dist/components/field-message/index.js.map +1 -0
  104. package/dist/components/menu-item/MenuItem.cjs.map +1 -1
  105. package/dist/components/menu-item/MenuItem.css +1 -1
  106. package/dist/components/menu-item/MenuItem.d.ts +20 -0
  107. package/dist/components/menu-item/MenuItem.d.ts.map +1 -1
  108. package/dist/components/menu-item/MenuItem.js.map +1 -1
  109. package/dist/components/menu-item/MenuItem.module.scss.cjs +1 -1
  110. package/dist/components/menu-item/MenuItem.module.scss.js +16 -16
  111. package/dist/components/menu-item/index.d.ts +1 -1
  112. package/dist/components/menu-item/index.d.ts.map +1 -1
  113. package/dist/components/password-input/PasswordInput.cjs +2 -0
  114. package/dist/components/password-input/PasswordInput.cjs.map +1 -0
  115. package/dist/components/password-input/PasswordInput.css +1 -0
  116. package/dist/components/password-input/PasswordInput.d.ts +49 -0
  117. package/dist/components/password-input/PasswordInput.d.ts.map +1 -0
  118. package/dist/components/password-input/PasswordInput.js +140 -0
  119. package/dist/components/password-input/PasswordInput.js.map +1 -0
  120. package/dist/components/password-input/PasswordInput.module.scss.cjs +2 -0
  121. package/dist/components/password-input/PasswordInput.module.scss.cjs.map +1 -0
  122. package/dist/components/password-input/PasswordInput.module.scss.js +18 -0
  123. package/dist/components/password-input/PasswordInput.module.scss.js.map +1 -0
  124. package/dist/components/password-input/index.cjs +2 -0
  125. package/dist/components/password-input/index.cjs.map +1 -0
  126. package/dist/components/password-input/index.d.ts +3 -0
  127. package/dist/components/password-input/index.d.ts.map +1 -0
  128. package/dist/components/password-input/index.js +5 -0
  129. package/dist/components/password-input/index.js.map +1 -0
  130. package/dist/components/radio/Radio.css +1 -1
  131. package/dist/components/radio/Radio.module.scss.cjs +1 -1
  132. package/dist/components/radio/Radio.module.scss.js +12 -12
  133. package/dist/components/search-input/SearchInput.cjs +1 -1
  134. package/dist/components/search-input/SearchInput.cjs.map +1 -1
  135. package/dist/components/search-input/SearchInput.css +1 -1
  136. package/dist/components/search-input/SearchInput.d.ts +8 -0
  137. package/dist/components/search-input/SearchInput.d.ts.map +1 -1
  138. package/dist/components/search-input/SearchInput.js +114 -115
  139. package/dist/components/search-input/SearchInput.js.map +1 -1
  140. package/dist/components/search-input/SearchInput.module.scss.cjs +1 -1
  141. package/dist/components/search-input/SearchInput.module.scss.js +15 -16
  142. package/dist/components/search-input/SearchInput.module.scss.js.map +1 -1
  143. package/dist/components/section-notice/SectionNotice.cjs +1 -1
  144. package/dist/components/section-notice/SectionNotice.cjs.map +1 -1
  145. package/dist/components/section-notice/SectionNotice.css +1 -1
  146. package/dist/components/section-notice/SectionNotice.js +17 -17
  147. package/dist/components/section-notice/SectionNotice.js.map +1 -1
  148. package/dist/components/section-notice/SectionNotice.module.scss.cjs +1 -1
  149. package/dist/components/section-notice/SectionNotice.module.scss.js +12 -12
  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.css +1 -1
  153. package/dist/components/select/Select.d.ts +16 -0
  154. package/dist/components/select/Select.d.ts.map +1 -1
  155. package/dist/components/select/Select.js +177 -157
  156. package/dist/components/select/Select.js.map +1 -1
  157. package/dist/components/select/Select.module.scss.cjs +1 -1
  158. package/dist/components/select/Select.module.scss.js +20 -20
  159. package/dist/components/switch/Switch.css +1 -1
  160. package/dist/components/switch/Switch.module.scss.cjs +1 -1
  161. package/dist/components/switch/Switch.module.scss.js +9 -9
  162. package/dist/components/text-area/TextArea.cjs +1 -1
  163. package/dist/components/text-area/TextArea.cjs.map +1 -1
  164. package/dist/components/text-area/TextArea.css +1 -1
  165. package/dist/components/text-area/TextArea.d.ts +8 -0
  166. package/dist/components/text-area/TextArea.d.ts.map +1 -1
  167. package/dist/components/text-area/TextArea.js +86 -67
  168. package/dist/components/text-area/TextArea.js.map +1 -1
  169. package/dist/components/text-area/TextArea.module.scss.cjs +1 -1
  170. package/dist/components/text-area/TextArea.module.scss.js +12 -10
  171. package/dist/components/text-area/TextArea.module.scss.js.map +1 -1
  172. package/dist/components/text-input/TextInput.cjs +1 -1
  173. package/dist/components/text-input/TextInput.cjs.map +1 -1
  174. package/dist/components/text-input/TextInput.css +1 -1
  175. package/dist/components/text-input/TextInput.d.ts +38 -1
  176. package/dist/components/text-input/TextInput.d.ts.map +1 -1
  177. package/dist/components/text-input/TextInput.js +149 -93
  178. package/dist/components/text-input/TextInput.js.map +1 -1
  179. package/dist/components/text-input/TextInput.module.scss.cjs +1 -1
  180. package/dist/components/text-input/TextInput.module.scss.js +19 -14
  181. package/dist/components/text-input/TextInput.module.scss.js.map +1 -1
  182. package/dist/index.cjs +1 -1
  183. package/dist/index.d.ts +3 -0
  184. package/dist/index.d.ts.map +1 -1
  185. package/dist/index.js +172 -166
  186. package/dist/index.js.map +1 -1
  187. package/dist/utils/menuItemProps.cjs +2 -0
  188. package/dist/utils/menuItemProps.cjs.map +1 -0
  189. package/dist/utils/menuItemProps.d.ts +5 -0
  190. package/dist/utils/menuItemProps.d.ts.map +1 -0
  191. package/dist/utils/menuItemProps.js +12 -0
  192. package/dist/utils/menuItemProps.js.map +1 -0
  193. package/package.json +10 -1
  194. package/dist/components/error-message/ErrorMessage.css +0 -1
  195. package/dist/components/error-message/ErrorMessage.module.scss.cjs +0 -2
  196. package/dist/components/error-message/ErrorMessage.module.scss.cjs.map +0 -1
  197. package/dist/components/error-message/ErrorMessage.module.scss.js +0 -9
  198. package/dist/components/error-message/ErrorMessage.module.scss.js.map +0 -1
@@ -0,0 +1,2 @@
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),__h=require("@mattermost/compass-icons/components/alert-circle-outline.js"),h=__h?.default??__h,__j=require("@mattermost/compass-icons/components/alert-outline.js"),j=__j?.default??__j,i=require("../button/Button.cjs"),n=require("./AdminConsoleFooter.module.scss.cjs"),x="There are outstanding issues in the form above.",_="There are errors in the form above.";function p({saveLabel:l="Save",cancelLabel:a="Cancel",onSave:c,onCancel:d,saveDisabled:u=!0,status:o="none",statusMessage:t,className:m=""}){let r=null;if(o==="warning"){const s=t??x;r=e.jsxs(e.Fragment,{children:[e.jsx("span",{className:n.default["admin-console-footer__status-icon"],"aria-hidden":!0,children:e.jsx(j,{size:12})}),e.jsx("span",{children:s})]})}if(o==="error"){const s=t??_;r=e.jsxs(e.Fragment,{children:[e.jsx("span",{className:n.default["admin-console-footer__status-icon"],"aria-hidden":!0,children:e.jsx(h,{size:12})}),e.jsx("span",{children:s})]})}const f=o==="warning"?n.default["admin-console-footer--status-warning"]:o==="error"?n.default["admin-console-footer--status-error"]:"";return e.jsx("footer",{className:[n.default["admin-console-footer"],f,m].filter(Boolean).join(" ").trim(),role:"contentinfo",children:e.jsxs("div",{className:n.default["admin-console-footer__inner"],children:[e.jsxs("div",{className:n.default["admin-console-footer__actions"],children:[e.jsx(i.default,{type:"button",size:"medium",emphasis:"primary",disabled:u,onClick:c,children:l}),e.jsx(i.default,{type:"button",size:"medium",emphasis:"tertiary",onClick:d,children:a})]}),r!=null?e.jsx("div",{className:n.default["admin-console-footer__status"],role:"alert",children:r}):null]})})}exports.default=p;
2
+ //# sourceMappingURL=AdminConsoleFooter.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"AdminConsoleFooter.cjs","sources":["../../../src/components/admin-console-footer/AdminConsoleFooter.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport AlertCircleOutlineIcon from '@mattermost/compass-icons/components/alert-circle-outline';\nimport AlertOutlineIcon from '@mattermost/compass-icons/components/alert-outline';\nimport Button from '@/components/button/Button';\nimport styles from './AdminConsoleFooter.module.scss';\n\nexport type AdminConsoleFooterStatus = 'none' | 'warning' | 'error';\n\nexport interface AdminConsoleFooterProps {\n /** Primary footer action label. Default: \"Save\". Accepts translated nodes. */\n saveLabel?: ReactNode;\n /** Default: \"Cancel\". Accepts translated nodes. */\n cancelLabel?: ReactNode;\n onSave?: () => void;\n onCancel?: () => void;\n /** When true, Save uses disabled styling until the sheet is actionable. */\n saveDisabled?: boolean;\n /** Optional validation summary beside the buttons. */\n status?: AdminConsoleFooterStatus;\n /**\n * Override default copy when `warning` | `error`. Defaults: \"There are\n * outstanding issues in the form above.\" / \"There are errors in the form above.\"\n */\n statusMessage?: ReactNode;\n className?: string;\n}\n\nconst DEFAULT_WARNING = 'There are outstanding issues in the form above.';\nconst DEFAULT_ERROR = 'There are errors in the form above.';\n\n/**\n * Admin Console Footer pins Save and Cancel to the bottom of System Console form layouts. It\n * mirrors channel composer discipline: one primary commit path, a safe escape hatch, and\n * optional validation status without stealing focus from the draft.\n */\nexport default function AdminConsoleFooter({\n saveLabel = 'Save',\n cancelLabel = 'Cancel',\n onSave,\n onCancel,\n saveDisabled = true,\n status = 'none',\n statusMessage,\n className = '',\n}: AdminConsoleFooterProps) {\n let statusUi: ReactNode = null;\n\n if (status === 'warning') {\n const copy = statusMessage ?? DEFAULT_WARNING;\n statusUi = (\n <>\n <span\n className={styles['admin-console-footer__status-icon']}\n aria-hidden\n >\n <AlertOutlineIcon size={12} />\n </span>\n <span>{copy}</span>\n </>\n );\n }\n\n if (status === 'error') {\n const copy = statusMessage ?? DEFAULT_ERROR;\n statusUi = (\n <>\n <span\n className={styles['admin-console-footer__status-icon']}\n aria-hidden\n >\n <AlertCircleOutlineIcon size={12} />\n </span>\n <span>{copy}</span>\n </>\n );\n }\n\n const statusMod =\n status === 'warning'\n ? styles['admin-console-footer--status-warning']\n : status === 'error'\n ? styles['admin-console-footer--status-error']\n : '';\n\n return (\n <footer\n className={[styles['admin-console-footer'], statusMod, className]\n .filter(Boolean)\n .join(' ')\n .trim()}\n role=\"contentinfo\"\n >\n <div className={styles['admin-console-footer__inner']}>\n <div className={styles['admin-console-footer__actions']}>\n <Button\n type=\"button\"\n size=\"medium\"\n emphasis=\"primary\"\n disabled={saveDisabled}\n onClick={onSave}\n >\n {saveLabel}\n </Button>\n <Button\n type=\"button\"\n size=\"medium\"\n emphasis=\"tertiary\"\n onClick={onCancel}\n >\n {cancelLabel}\n </Button>\n </div>\n {statusUi != null ? (\n <div className={styles['admin-console-footer__status']} role=\"alert\">\n {statusUi}\n </div>\n ) : null}\n </div>\n </footer>\n );\n}\n"],"names":["DEFAULT_WARNING","DEFAULT_ERROR","AdminConsoleFooter","saveLabel","cancelLabel","onSave","onCancel","saveDisabled","status","statusMessage","className","statusUi","copy","jsxs","Fragment","jsx","styles","AlertOutlineIcon","AlertCircleOutlineIcon","statusMod","Button"],"mappings":"4WA2BMA,EAAkB,kDAClBC,EAAgB,sCAOtB,SAAwBC,EAAmB,CACzC,UAAAC,EAAY,OACZ,YAAAC,EAAc,SACd,OAAAC,EACA,SAAAC,EACA,aAAAC,EAAe,GACf,OAAAC,EAAS,OACT,cAAAC,EACA,UAAAC,EAAY,EACd,EAA4B,CAC1B,IAAIC,EAAsB,KAE1B,GAAIH,IAAW,UAAW,CACxB,MAAMI,EAAOH,GAAiBT,EAC9BW,EACEE,EAAAA,KAAAC,WAAA,CACE,SAAA,CAAAC,EAAAA,IAAC,OAAA,CACC,UAAWC,EAAAA,QAAO,mCAAmC,EACrD,cAAW,GAEX,SAAAD,EAAAA,IAACE,EAAA,CAAiB,KAAM,EAAA,CAAI,CAAA,CAAA,EAE9BF,EAAAA,IAAC,QAAM,SAAAH,CAAA,CAAK,CAAA,EACd,CAEJ,CAEA,GAAIJ,IAAW,QAAS,CACtB,MAAMI,EAAOH,GAAiBR,EAC9BU,EACEE,EAAAA,KAAAC,WAAA,CACE,SAAA,CAAAC,EAAAA,IAAC,OAAA,CACC,UAAWC,EAAAA,QAAO,mCAAmC,EACrD,cAAW,GAEX,SAAAD,EAAAA,IAACG,EAAA,CAAuB,KAAM,EAAA,CAAI,CAAA,CAAA,EAEpCH,EAAAA,IAAC,QAAM,SAAAH,CAAA,CAAK,CAAA,EACd,CAEJ,CAEA,MAAMO,EACJX,IAAW,UACPQ,UAAO,sCAAsC,EAC7CR,IAAW,QACTQ,UAAO,oCAAoC,EAC3C,GAER,OACED,EAAAA,IAAC,SAAA,CACC,UAAW,CAACC,EAAAA,QAAO,sBAAsB,EAAGG,EAAWT,CAAS,EAC7D,OAAO,OAAO,EACd,KAAK,GAAG,EACR,KAAA,EACH,KAAK,cAEL,SAAAG,EAAAA,KAAC,MAAA,CAAI,UAAWG,UAAO,6BAA6B,EAClD,SAAA,CAAAH,EAAAA,KAAC,MAAA,CAAI,UAAWG,EAAAA,QAAO,+BAA+B,EACpD,SAAA,CAAAD,EAAAA,IAACK,EAAAA,QAAA,CACC,KAAK,SACL,KAAK,SACL,SAAS,UACT,SAAUb,EACV,QAASF,EAER,SAAAF,CAAA,CAAA,EAEHY,EAAAA,IAACK,EAAAA,QAAA,CACC,KAAK,SACL,KAAK,SACL,SAAS,WACT,QAASd,EAER,SAAAF,CAAA,CAAA,CACH,EACF,EACCO,GAAY,KACXI,EAAAA,IAAC,MAAA,CAAI,UAAWC,EAAAA,QAAO,8BAA8B,EAAG,KAAK,QAC1D,SAAAL,CAAA,CACH,EACE,IAAA,CAAA,CACN,CAAA,CAAA,CAGN"}
@@ -0,0 +1 @@
1
+ ._admin-console-footer_rqy27_2{display:flex;flex-direction:column;width:100%;background:var(--center-channel-bg);border-top:1px solid rgba(var(--center-channel-color-rgb),.12)}._admin-console-footer__inner_rqy27_9{display:flex;align-items:center;flex-wrap:wrap;gap:var(--spacing-xl);padding:14px var(--spacing-xl);width:100%;box-sizing:border-box}._admin-console-footer__actions_rqy27_18{display:flex;flex-wrap:wrap;gap:var(--spacing-m);align-items:center}._admin-console-footer__status_rqy27_24{display:inline-flex;align-items:center;gap:var(--spacing-xs);flex:1 1 auto;min-width:min(280px,100%);font-family:var(--font-family-body);font-size:var(--font-size-75);font-weight:var(--font-weight-regular);line-height:var(--line-height-75)}._admin-console-footer__status-icon_rqy27_35{display:inline-flex;flex-shrink:0;line-height:0}._admin-console-footer__status-icon_rqy27_35 svg{display:block}._admin-console-footer--status-warning_rqy27_43 ._admin-console-footer__status_rqy27_24,._admin-console-footer--status-warning_rqy27_43 ._admin-console-footer__status-icon_rqy27_35{color:var(--color-warning)}._admin-console-footer--status-error_rqy27_46 ._admin-console-footer__status_rqy27_24,._admin-console-footer--status-error_rqy27_46 ._admin-console-footer__status-icon_rqy27_35{color:var(--error-text, var(--color-danger))}
@@ -0,0 +1,27 @@
1
+ import { ReactNode } from 'react';
2
+ export type AdminConsoleFooterStatus = 'none' | 'warning' | 'error';
3
+ export interface AdminConsoleFooterProps {
4
+ /** Primary footer action label. Default: "Save". Accepts translated nodes. */
5
+ saveLabel?: ReactNode;
6
+ /** Default: "Cancel". Accepts translated nodes. */
7
+ cancelLabel?: ReactNode;
8
+ onSave?: () => void;
9
+ onCancel?: () => void;
10
+ /** When true, Save uses disabled styling until the sheet is actionable. */
11
+ saveDisabled?: boolean;
12
+ /** Optional validation summary beside the buttons. */
13
+ status?: AdminConsoleFooterStatus;
14
+ /**
15
+ * Override default copy when `warning` | `error`. Defaults: "There are
16
+ * outstanding issues in the form above." / "There are errors in the form above."
17
+ */
18
+ statusMessage?: ReactNode;
19
+ className?: string;
20
+ }
21
+ /**
22
+ * Admin Console Footer pins Save and Cancel to the bottom of System Console form layouts. It
23
+ * mirrors channel composer discipline: one primary commit path, a safe escape hatch, and
24
+ * optional validation status without stealing focus from the draft.
25
+ */
26
+ export default function AdminConsoleFooter({ saveLabel, cancelLabel, onSave, onCancel, saveDisabled, status, statusMessage, className, }: AdminConsoleFooterProps): import("react/jsx-runtime").JSX.Element;
27
+ //# sourceMappingURL=AdminConsoleFooter.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"AdminConsoleFooter.d.ts","sourceRoot":"","sources":["../../../src/components/admin-console-footer/AdminConsoleFooter.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAMvC,MAAM,MAAM,wBAAwB,GAAG,MAAM,GAAG,SAAS,GAAG,OAAO,CAAC;AAEpE,MAAM,WAAW,uBAAuB;IACtC,8EAA8E;IAC9E,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,mDAAmD;IACnD,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,2EAA2E;IAC3E,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,sDAAsD;IACtD,MAAM,CAAC,EAAE,wBAAwB,CAAC;IAClC;;;OAGG;IACH,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAKD;;;;GAIG;AACH,MAAM,CAAC,OAAO,UAAU,kBAAkB,CAAC,EACzC,SAAkB,EAClB,WAAsB,EACtB,MAAM,EACN,QAAQ,EACR,YAAmB,EACnB,MAAe,EACf,aAAa,EACb,SAAc,GACf,EAAE,uBAAuB,2CA4EzB"}
@@ -0,0 +1,84 @@
1
+ import { jsx as e, jsxs as i, Fragment as a } from "react/jsx-runtime";
2
+ import ___ from "@mattermost/compass-icons/components/alert-circle-outline.js";const _=___&&___.default?___.default:___;
3
+ import __N from "@mattermost/compass-icons/components/alert-outline.js";const N=__N&&__N.default?__N.default:__N;
4
+ import l from "../button/Button.js";
5
+ import o from "./AdminConsoleFooter.module.scss.js";
6
+ const y = "There are outstanding issues in the form above.", v = "There are errors in the form above.";
7
+ function F({
8
+ saveLabel: c = "Save",
9
+ cancelLabel: m = "Cancel",
10
+ onSave: d,
11
+ onCancel: f,
12
+ saveDisabled: u = !0,
13
+ status: n = "none",
14
+ statusMessage: s,
15
+ className: h = ""
16
+ }) {
17
+ let r = null;
18
+ if (n === "warning") {
19
+ const t = s ?? y;
20
+ r = /* @__PURE__ */ i(a, { children: [
21
+ /* @__PURE__ */ e(
22
+ "span",
23
+ {
24
+ className: o["admin-console-footer__status-icon"],
25
+ "aria-hidden": !0,
26
+ children: /* @__PURE__ */ e(N, { size: 12 })
27
+ }
28
+ ),
29
+ /* @__PURE__ */ e("span", { children: t })
30
+ ] });
31
+ }
32
+ if (n === "error") {
33
+ const t = s ?? v;
34
+ r = /* @__PURE__ */ i(a, { children: [
35
+ /* @__PURE__ */ e(
36
+ "span",
37
+ {
38
+ className: o["admin-console-footer__status-icon"],
39
+ "aria-hidden": !0,
40
+ children: /* @__PURE__ */ e(_, { size: 12 })
41
+ }
42
+ ),
43
+ /* @__PURE__ */ e("span", { children: t })
44
+ ] });
45
+ }
46
+ const p = n === "warning" ? o["admin-console-footer--status-warning"] : n === "error" ? o["admin-console-footer--status-error"] : "";
47
+ return /* @__PURE__ */ e(
48
+ "footer",
49
+ {
50
+ className: [o["admin-console-footer"], p, h].filter(Boolean).join(" ").trim(),
51
+ role: "contentinfo",
52
+ children: /* @__PURE__ */ i("div", { className: o["admin-console-footer__inner"], children: [
53
+ /* @__PURE__ */ i("div", { className: o["admin-console-footer__actions"], children: [
54
+ /* @__PURE__ */ e(
55
+ l,
56
+ {
57
+ type: "button",
58
+ size: "medium",
59
+ emphasis: "primary",
60
+ disabled: u,
61
+ onClick: d,
62
+ children: c
63
+ }
64
+ ),
65
+ /* @__PURE__ */ e(
66
+ l,
67
+ {
68
+ type: "button",
69
+ size: "medium",
70
+ emphasis: "tertiary",
71
+ onClick: f,
72
+ children: m
73
+ }
74
+ )
75
+ ] }),
76
+ r != null ? /* @__PURE__ */ e("div", { className: o["admin-console-footer__status"], role: "alert", children: r }) : null
77
+ ] })
78
+ }
79
+ );
80
+ }
81
+ export {
82
+ F as default
83
+ };
84
+ //# sourceMappingURL=AdminConsoleFooter.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"AdminConsoleFooter.js","sources":["../../../src/components/admin-console-footer/AdminConsoleFooter.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport AlertCircleOutlineIcon from '@mattermost/compass-icons/components/alert-circle-outline';\nimport AlertOutlineIcon from '@mattermost/compass-icons/components/alert-outline';\nimport Button from '@/components/button/Button';\nimport styles from './AdminConsoleFooter.module.scss';\n\nexport type AdminConsoleFooterStatus = 'none' | 'warning' | 'error';\n\nexport interface AdminConsoleFooterProps {\n /** Primary footer action label. Default: \"Save\". Accepts translated nodes. */\n saveLabel?: ReactNode;\n /** Default: \"Cancel\". Accepts translated nodes. */\n cancelLabel?: ReactNode;\n onSave?: () => void;\n onCancel?: () => void;\n /** When true, Save uses disabled styling until the sheet is actionable. */\n saveDisabled?: boolean;\n /** Optional validation summary beside the buttons. */\n status?: AdminConsoleFooterStatus;\n /**\n * Override default copy when `warning` | `error`. Defaults: \"There are\n * outstanding issues in the form above.\" / \"There are errors in the form above.\"\n */\n statusMessage?: ReactNode;\n className?: string;\n}\n\nconst DEFAULT_WARNING = 'There are outstanding issues in the form above.';\nconst DEFAULT_ERROR = 'There are errors in the form above.';\n\n/**\n * Admin Console Footer pins Save and Cancel to the bottom of System Console form layouts. It\n * mirrors channel composer discipline: one primary commit path, a safe escape hatch, and\n * optional validation status without stealing focus from the draft.\n */\nexport default function AdminConsoleFooter({\n saveLabel = 'Save',\n cancelLabel = 'Cancel',\n onSave,\n onCancel,\n saveDisabled = true,\n status = 'none',\n statusMessage,\n className = '',\n}: AdminConsoleFooterProps) {\n let statusUi: ReactNode = null;\n\n if (status === 'warning') {\n const copy = statusMessage ?? DEFAULT_WARNING;\n statusUi = (\n <>\n <span\n className={styles['admin-console-footer__status-icon']}\n aria-hidden\n >\n <AlertOutlineIcon size={12} />\n </span>\n <span>{copy}</span>\n </>\n );\n }\n\n if (status === 'error') {\n const copy = statusMessage ?? DEFAULT_ERROR;\n statusUi = (\n <>\n <span\n className={styles['admin-console-footer__status-icon']}\n aria-hidden\n >\n <AlertCircleOutlineIcon size={12} />\n </span>\n <span>{copy}</span>\n </>\n );\n }\n\n const statusMod =\n status === 'warning'\n ? styles['admin-console-footer--status-warning']\n : status === 'error'\n ? styles['admin-console-footer--status-error']\n : '';\n\n return (\n <footer\n className={[styles['admin-console-footer'], statusMod, className]\n .filter(Boolean)\n .join(' ')\n .trim()}\n role=\"contentinfo\"\n >\n <div className={styles['admin-console-footer__inner']}>\n <div className={styles['admin-console-footer__actions']}>\n <Button\n type=\"button\"\n size=\"medium\"\n emphasis=\"primary\"\n disabled={saveDisabled}\n onClick={onSave}\n >\n {saveLabel}\n </Button>\n <Button\n type=\"button\"\n size=\"medium\"\n emphasis=\"tertiary\"\n onClick={onCancel}\n >\n {cancelLabel}\n </Button>\n </div>\n {statusUi != null ? (\n <div className={styles['admin-console-footer__status']} role=\"alert\">\n {statusUi}\n </div>\n ) : null}\n </div>\n </footer>\n );\n}\n"],"names":["DEFAULT_WARNING","DEFAULT_ERROR","AdminConsoleFooter","saveLabel","cancelLabel","onSave","onCancel","saveDisabled","status","statusMessage","className","statusUi","copy","jsxs","Fragment","jsx","styles","AlertOutlineIcon","AlertCircleOutlineIcon","statusMod","Button"],"mappings":";;;;;AA2BA,MAAMA,IAAkB,mDAClBC,IAAgB;AAOtB,SAAwBC,EAAmB;AAAA,EACzC,WAAAC,IAAY;AAAA,EACZ,aAAAC,IAAc;AAAA,EACd,QAAAC;AAAA,EACA,UAAAC;AAAA,EACA,cAAAC,IAAe;AAAA,EACf,QAAAC,IAAS;AAAA,EACT,eAAAC;AAAA,EACA,WAAAC,IAAY;AACd,GAA4B;AAC1B,MAAIC,IAAsB;AAE1B,MAAIH,MAAW,WAAW;AACxB,UAAMI,IAAOH,KAAiBT;AAC9B,IAAAW,IACE,gBAAAE,EAAAC,GAAA,EACE,UAAA;AAAA,MAAA,gBAAAC;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAWC,EAAO,mCAAmC;AAAA,UACrD,eAAW;AAAA,UAEX,UAAA,gBAAAD,EAACE,GAAA,EAAiB,MAAM,GAAA,CAAI;AAAA,QAAA;AAAA,MAAA;AAAA,MAE9B,gBAAAF,EAAC,UAAM,UAAAH,EAAA,CAAK;AAAA,IAAA,GACd;AAAA,EAEJ;AAEA,MAAIJ,MAAW,SAAS;AACtB,UAAMI,IAAOH,KAAiBR;AAC9B,IAAAU,IACE,gBAAAE,EAAAC,GAAA,EACE,UAAA;AAAA,MAAA,gBAAAC;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,WAAWC,EAAO,mCAAmC;AAAA,UACrD,eAAW;AAAA,UAEX,UAAA,gBAAAD,EAACG,GAAA,EAAuB,MAAM,GAAA,CAAI;AAAA,QAAA;AAAA,MAAA;AAAA,MAEpC,gBAAAH,EAAC,UAAM,UAAAH,EAAA,CAAK;AAAA,IAAA,GACd;AAAA,EAEJ;AAEA,QAAMO,IACJX,MAAW,YACPQ,EAAO,sCAAsC,IAC7CR,MAAW,UACTQ,EAAO,oCAAoC,IAC3C;AAER,SACE,gBAAAD;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW,CAACC,EAAO,sBAAsB,GAAGG,GAAWT,CAAS,EAC7D,OAAO,OAAO,EACd,KAAK,GAAG,EACR,KAAA;AAAA,MACH,MAAK;AAAA,MAEL,UAAA,gBAAAG,EAAC,OAAA,EAAI,WAAWG,EAAO,6BAA6B,GAClD,UAAA;AAAA,QAAA,gBAAAH,EAAC,OAAA,EAAI,WAAWG,EAAO,+BAA+B,GACpD,UAAA;AAAA,UAAA,gBAAAD;AAAA,YAACK;AAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL,MAAK;AAAA,cACL,UAAS;AAAA,cACT,UAAUb;AAAA,cACV,SAASF;AAAA,cAER,UAAAF;AAAA,YAAA;AAAA,UAAA;AAAA,UAEH,gBAAAY;AAAA,YAACK;AAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL,MAAK;AAAA,cACL,UAAS;AAAA,cACT,SAASd;AAAA,cAER,UAAAF;AAAA,YAAA;AAAA,UAAA;AAAA,QACH,GACF;AAAA,QACCO,KAAY,OACX,gBAAAI,EAAC,OAAA,EAAI,WAAWC,EAAO,8BAA8B,GAAG,MAAK,SAC1D,UAAAL,EAAA,CACH,IACE;AAAA,MAAA,EAAA,CACN;AAAA,IAAA;AAAA,EAAA;AAGN;"}
@@ -0,0 +1,2 @@
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});require('./AdminConsoleFooter.css');const o={"admin-console-footer":"_admin-console-footer_rqy27_2","admin-console-footer__inner":"_admin-console-footer__inner_rqy27_9","admin-console-footer__actions":"_admin-console-footer__actions_rqy27_18","admin-console-footer__status":"_admin-console-footer__status_rqy27_24","admin-console-footer__status-icon":"_admin-console-footer__status-icon_rqy27_35","admin-console-footer--status-warning":"_admin-console-footer--status-warning_rqy27_43","admin-console-footer--status-error":"_admin-console-footer--status-error_rqy27_46"};exports.default=o;
2
+ //# sourceMappingURL=AdminConsoleFooter.module.scss.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"AdminConsoleFooter.module.scss.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}
@@ -0,0 +1,13 @@
1
+ import './AdminConsoleFooter.css';const o = {
2
+ "admin-console-footer": "_admin-console-footer_rqy27_2",
3
+ "admin-console-footer__inner": "_admin-console-footer__inner_rqy27_9",
4
+ "admin-console-footer__actions": "_admin-console-footer__actions_rqy27_18",
5
+ "admin-console-footer__status": "_admin-console-footer__status_rqy27_24",
6
+ "admin-console-footer__status-icon": "_admin-console-footer__status-icon_rqy27_35",
7
+ "admin-console-footer--status-warning": "_admin-console-footer--status-warning_rqy27_43",
8
+ "admin-console-footer--status-error": "_admin-console-footer--status-error_rqy27_46"
9
+ };
10
+ export {
11
+ o as default
12
+ };
13
+ //# sourceMappingURL=AdminConsoleFooter.module.scss.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"AdminConsoleFooter.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;"}
@@ -0,0 +1,2 @@
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./AdminConsoleFooter.cjs");exports.AdminConsoleFooter=e.default;
2
+ //# sourceMappingURL=index.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}
@@ -0,0 +1,3 @@
1
+ export { default as AdminConsoleFooter } from './AdminConsoleFooter';
2
+ export type { AdminConsoleFooterProps, AdminConsoleFooterStatus, } from './AdminConsoleFooter';
3
+ //# sourceMappingURL=index.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/admin-console-footer/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AACrE,YAAY,EACV,uBAAuB,EACvB,wBAAwB,GACzB,MAAM,sBAAsB,CAAC"}
@@ -0,0 +1,5 @@
1
+ import { default as r } from "./AdminConsoleFooter.js";
2
+ export {
3
+ r as AdminConsoleFooter
4
+ };
5
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
@@ -1,2 +1,2 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const d=require("react/jsx-runtime"),c=require("react"),k=require("../admin-panel-header/AdminPanelHeader.cjs"),l=require("./AdminPanel.module.scss.cjs");function z({title:u,subtitle:f,headerActions:m,children:n,className:p="",iconLeft:_=!1,leadingIcon:v,showBeta:j=!1,betaLabel:x="Beta",showEnterpriseLabel:E=!1,enterpriseLabel:N="Enterprise",showButton:q=!1,buttonLabel:y="Button",onButtonClick:A,showSwitch:B=!1,switchLabel:P="Off",switchChecked:g,defaultSwitchChecked:w,onSwitchChange:D,switchDisabled:H,expandable:e=!1,expandedState:t,defaultExpandedState:I="collapsed",onExpandedStateChange:a,expandLabel:M,collapseLabel:O,...R}){const i=c.useId(),[S,T]=c.useState(I),o=e&&t!==void 0,s=(e?o?t:S:"expanded")==="expanded",b=r=>{e&&(o||T(r),a==null||a(r))},h=()=>{b(s?"collapsed":"expanded")},U=!e||s;return d.jsxs("section",{...R,className:[l.default["admin-panel"],p].join(" ").trim(),"aria-labelledby":i,children:[d.jsx(k.default,{titleId:i,title:u,subtitle:f,headerActions:m,iconLeft:_,leadingIcon:v,showBeta:j,betaLabel:x,showEnterpriseLabel:E,enterpriseLabel:N,showButton:q,buttonLabel:y,onButtonClick:A,showSwitch:B,switchLabel:P,switchChecked:g,defaultSwitchChecked:w,onSwitchChange:D,switchDisabled:H,expandable:e,isExpanded:s,onToggleExpand:h,expandLabel:M,collapseLabel:O,showDivider:U}),e?d.jsx("div",{className:[l.default["admin-panel__collapse"],s?l.default["admin-panel__collapse--expanded"]:""].filter(Boolean).join(" "),"aria-hidden":!s,children:d.jsx("div",{className:l.default["admin-panel__collapse-inner"],children:d.jsx("div",{className:l.default["admin-panel__body"],children:n})})}):d.jsx("div",{className:l.default["admin-panel__body"],children:n})]})}exports.default=z;
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),i=require("react"),W=require("../admin-panel-header/AdminPanelHeader.cjs"),t=require("./AdminPanel.module.scss.cjs");function X(m){const{title:l,children:c,footer:d,className:w="",...E}=m,{subtitle:v,headerActions:S,iconLeft:_=!1,leadingIcon:j,showBeta:g=!1,betaLabel:L="Beta",showEnterpriseLabel:B=!1,enterpriseLabel:y="Enterprise",showButton:C=!1,buttonLabel:A="Button",onButtonClick:N,showSwitch:P=!1,switchLabel:q="Off",switchChecked:k,defaultSwitchChecked:D,onSwitchChange:H,switchDisabled:I,expandable:R=!1,expandedState:r,defaultExpandedState:F="collapsed",onExpandedStateChange:s,expandLabel:M,collapseLabel:O,...T}=E,u=i.useId(),o=l!=null&&l!==!1&&l!=="",[U,z]=i.useState(F),n=o&&R,p=n&&r!==void 0,a=(n?p?r:U:"expanded")==="expanded",G=b=>{n&&(p||z(b),s==null||s(b))},J=()=>{G(a?"collapsed":"expanded")},h=i.Children.toArray(c).length>0,K=d!=null,f=h||K,Q=f&&(!n||a),x=h?e.jsx("div",{className:t.default["admin-panel__body"],children:c}):null,V=f?n?e.jsx("div",{className:[t.default["admin-panel__collapse"],a?t.default["admin-panel__collapse--expanded"]:""].filter(Boolean).join(" "),"aria-hidden":!a,inert:!a,children:e.jsxs("div",{className:t.default["admin-panel__collapse-inner"],children:[x,d]})}):e.jsxs(e.Fragment,{children:[x,d]}):null;return e.jsxs("section",{...T,className:[t.default["admin-panel"],w].join(" ").trim(),"aria-labelledby":o?u:void 0,children:[o?e.jsx(W.default,{titleId:u,title:l,subtitle:v,headerActions:S,iconLeft:_,leadingIcon:j,showBeta:g,betaLabel:L,showEnterpriseLabel:B,enterpriseLabel:y,showButton:C,buttonLabel:A,onButtonClick:N,showSwitch:P,switchLabel:q,switchChecked:k,defaultSwitchChecked:D,onSwitchChange:H,switchDisabled:I,expandable:n,isExpanded:a,onToggleExpand:J,expandLabel:M,collapseLabel:O,showDivider:Q}):null,V]})}exports.default=X;
2
2
  //# sourceMappingURL=AdminPanel.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"AdminPanel.cjs","sources":["../../../src/components/admin-panel/AdminPanel.tsx"],"sourcesContent":["import {\n useId,\n useState,\n type ChangeEvent,\n type HTMLAttributes,\n type ReactNode,\n} from 'react';\nimport AdminPanelHeader, {\n type AdminPanelExpandedState,\n} from '@/components/admin-panel-header/AdminPanelHeader';\nimport styles from './AdminPanel.module.scss';\n\nexport type { AdminPanelExpandedState };\n\nexport interface AdminPanelProps extends Omit<\n HTMLAttributes<HTMLElement>,\n 'title' | 'children'\n> {\n title: ReactNode;\n subtitle?: ReactNode;\n children?: ReactNode;\n className?: string;\n headerActions?: ReactNode;\n iconLeft?: boolean;\n /** Icon forwarded to `AdminPanelHeader`'s 44×44 circular pill. Pass `<Icon glyph={<SomeIcon />} size=\"20\" />`. */\n leadingIcon?: ReactNode;\n showBeta?: boolean;\n /** Default: \"Beta\". Accepts translated nodes. */\n betaLabel?: ReactNode;\n showEnterpriseLabel?: boolean;\n /** Default: \"Enterprise\". Accepts translated nodes. */\n enterpriseLabel?: ReactNode;\n showButton?: boolean;\n /** Default: \"Button\". Accepts translated nodes. */\n buttonLabel?: ReactNode;\n onButtonClick?: () => void;\n showSwitch?: boolean;\n switchLabel?: ReactNode;\n switchChecked?: boolean;\n defaultSwitchChecked?: boolean;\n onSwitchChange?: (\n checked: boolean,\n event: ChangeEvent<HTMLInputElement>,\n ) => void;\n switchDisabled?: boolean;\n expandable?: boolean;\n expandedState?: AdminPanelExpandedState;\n defaultExpandedState?: AdminPanelExpandedState;\n onExpandedStateChange?: (state: AdminPanelExpandedState) => void;\n /** Accessible name for the expand button while collapsed. Default: \"Expand section\". */\n expandLabel?: string;\n /** Accessible name for the expand button while expanded. Default: \"Collapse section\". */\n collapseLabel?: string;\n}\n\n/**\n * System Console admin settings panel: `AdminPanelHeader` plus a body slot\n * for grouped fields. Expand/collapse state is owned here and passed to the header.\n */\nexport default function AdminPanel({\n title,\n subtitle,\n headerActions,\n children,\n className = '',\n iconLeft = false,\n leadingIcon,\n showBeta = false,\n betaLabel = 'Beta',\n showEnterpriseLabel = false,\n enterpriseLabel = 'Enterprise',\n showButton = false,\n buttonLabel = 'Button',\n onButtonClick,\n showSwitch = false,\n switchLabel = 'Off',\n switchChecked,\n defaultSwitchChecked,\n onSwitchChange,\n switchDisabled,\n expandable = false,\n expandedState: expandedStateProp,\n defaultExpandedState = 'collapsed',\n onExpandedStateChange,\n expandLabel,\n collapseLabel,\n ...rest\n}: AdminPanelProps) {\n const titleId = useId();\n\n const [uncontrolledExpanded, setUncontrolledExpanded] =\n useState<AdminPanelExpandedState>(defaultExpandedState);\n\n const isExpandControlled = expandable && expandedStateProp !== undefined;\n const resolvedExpandedState: AdminPanelExpandedState = !expandable\n ? 'expanded'\n : isExpandControlled\n ? expandedStateProp!\n : uncontrolledExpanded;\n\n const isExpanded = resolvedExpandedState === 'expanded';\n\n const setExpandedState = (next: AdminPanelExpandedState) => {\n if (!expandable) return;\n if (!isExpandControlled) {\n setUncontrolledExpanded(next);\n }\n onExpandedStateChange?.(next);\n };\n\n const toggleExpanded = () => {\n setExpandedState(isExpanded ? 'collapsed' : 'expanded');\n };\n\n const showHeaderDivider = !expandable || isExpanded;\n\n return (\n <section\n {...rest}\n className={[styles['admin-panel'], className].join(' ').trim()}\n aria-labelledby={titleId}\n >\n <AdminPanelHeader\n titleId={titleId}\n title={title}\n subtitle={subtitle}\n headerActions={headerActions}\n iconLeft={iconLeft}\n leadingIcon={leadingIcon}\n showBeta={showBeta}\n betaLabel={betaLabel}\n showEnterpriseLabel={showEnterpriseLabel}\n enterpriseLabel={enterpriseLabel}\n showButton={showButton}\n buttonLabel={buttonLabel}\n onButtonClick={onButtonClick}\n showSwitch={showSwitch}\n switchLabel={switchLabel}\n switchChecked={switchChecked}\n defaultSwitchChecked={defaultSwitchChecked}\n onSwitchChange={onSwitchChange}\n switchDisabled={switchDisabled}\n expandable={expandable}\n isExpanded={isExpanded}\n onToggleExpand={toggleExpanded}\n expandLabel={expandLabel}\n collapseLabel={collapseLabel}\n showDivider={showHeaderDivider}\n />\n {expandable ? (\n <div\n className={[\n styles['admin-panel__collapse'],\n isExpanded ? styles['admin-panel__collapse--expanded'] : '',\n ]\n .filter(Boolean)\n .join(' ')}\n aria-hidden={!isExpanded}\n >\n <div className={styles['admin-panel__collapse-inner']}>\n <div className={styles['admin-panel__body']}>{children}</div>\n </div>\n </div>\n ) : (\n <div className={styles['admin-panel__body']}>{children}</div>\n )}\n </section>\n );\n}\n"],"names":["AdminPanel","title","subtitle","headerActions","children","className","iconLeft","leadingIcon","showBeta","betaLabel","showEnterpriseLabel","enterpriseLabel","showButton","buttonLabel","onButtonClick","showSwitch","switchLabel","switchChecked","defaultSwitchChecked","onSwitchChange","switchDisabled","expandable","expandedStateProp","defaultExpandedState","onExpandedStateChange","expandLabel","collapseLabel","rest","titleId","useId","uncontrolledExpanded","setUncontrolledExpanded","useState","isExpandControlled","isExpanded","setExpandedState","next","toggleExpanded","showHeaderDivider","jsxs","styles","jsx","AdminPanelHeader"],"mappings":"oQA2DA,SAAwBA,EAAW,CACjC,MAAAC,EACA,SAAAC,EACA,cAAAC,EACA,SAAAC,EACA,UAAAC,EAAY,GACZ,SAAAC,EAAW,GACX,YAAAC,EACA,SAAAC,EAAW,GACX,UAAAC,EAAY,OACZ,oBAAAC,EAAsB,GACtB,gBAAAC,EAAkB,aAClB,WAAAC,EAAa,GACb,YAAAC,EAAc,SACd,cAAAC,EACA,WAAAC,EAAa,GACb,YAAAC,EAAc,MACd,cAAAC,EACA,qBAAAC,EACA,eAAAC,EACA,eAAAC,EACA,WAAAC,EAAa,GACb,cAAeC,EACf,qBAAAC,EAAuB,YACvB,sBAAAC,EACA,YAAAC,EACA,cAAAC,EACA,GAAGC,CACL,EAAoB,CAClB,MAAMC,EAAUC,EAAAA,MAAA,EAEV,CAACC,EAAsBC,CAAuB,EAClDC,EAAAA,SAAkCT,CAAoB,EAElDU,EAAqBZ,GAAcC,IAAsB,OAOzDY,GANkDb,EAEpDY,EACEX,EACAQ,EAHF,cAKyC,WAEvCK,EAAoBC,GAAkC,CACrDf,IACAY,GACHF,EAAwBK,CAAI,EAE9BZ,GAAA,MAAAA,EAAwBY,GAC1B,EAEMC,EAAiB,IAAM,CAC3BF,EAAiBD,EAAa,YAAc,UAAU,CACxD,EAEMI,EAAoB,CAACjB,GAAca,EAEzC,OACEK,EAAAA,KAAC,UAAA,CACE,GAAGZ,EACJ,UAAW,CAACa,EAAAA,QAAO,aAAa,EAAGnC,CAAS,EAAE,KAAK,GAAG,EAAE,KAAA,EACxD,kBAAiBuB,EAEjB,SAAA,CAAAa,EAAAA,IAACC,EAAAA,QAAA,CACC,QAAAd,EACA,MAAA3B,EACA,SAAAC,EACA,cAAAC,EACA,SAAAG,EACA,YAAAC,EACA,SAAAC,EACA,UAAAC,EACA,oBAAAC,EACA,gBAAAC,EACA,WAAAC,EACA,YAAAC,EACA,cAAAC,EACA,WAAAC,EACA,YAAAC,EACA,cAAAC,EACA,qBAAAC,EACA,eAAAC,EACA,eAAAC,EACA,WAAAC,EACA,WAAAa,EACA,eAAgBG,EAChB,YAAAZ,EACA,cAAAC,EACA,YAAaY,CAAA,CAAA,EAEdjB,EACCoB,EAAAA,IAAC,MAAA,CACC,UAAW,CACTD,EAAAA,QAAO,uBAAuB,EAC9BN,EAAaM,EAAAA,QAAO,iCAAiC,EAAI,EAAA,EAExD,OAAO,OAAO,EACd,KAAK,GAAG,EACX,cAAa,CAACN,EAEd,SAAAO,EAAAA,IAAC,MAAA,CAAI,UAAWD,EAAAA,QAAO,6BAA6B,EAClD,SAAAC,EAAAA,IAAC,MAAA,CAAI,UAAWD,EAAAA,QAAO,mBAAmB,EAAI,SAAApC,EAAS,CAAA,CACzD,CAAA,CAAA,EAGFqC,EAAAA,IAAC,MAAA,CAAI,UAAWD,EAAAA,QAAO,mBAAmB,EAAI,SAAApC,CAAA,CAAS,CAAA,CAAA,CAAA,CAI/D"}
1
+ {"version":3,"file":"AdminPanel.cjs","sources":["../../../src/components/admin-panel/AdminPanel.tsx"],"sourcesContent":["import {\n Children,\n useId,\n useState,\n type ChangeEvent,\n type HTMLAttributes,\n type ReactNode,\n} from 'react';\nimport AdminPanelHeader, {\n type AdminPanelExpandedState,\n} from '@/components/admin-panel-header/AdminPanelHeader';\nimport styles from './AdminPanel.module.scss';\n\nexport type { AdminPanelExpandedState };\n\n/** Non-null content for required header/body slots (runtime still guards nullish escapes). */\ntype AdminPanelContent = NonNullable<ReactNode>;\n\ntype AdminPanelChromeProps = Omit<\n HTMLAttributes<HTMLElement>,\n 'title' | 'children'\n> & {\n className?: string;\n /**\n * Optional footer rail below the body — typically\n * [`AdminPanelFooter`](/components/admin-panel-footer) with left/right action slots.\n * Collapses with the body when the panel is expandable.\n */\n footer?: ReactNode;\n};\n\ntype AdminPanelHeaderSlotProps = {\n title: AdminPanelContent;\n subtitle?: ReactNode;\n headerActions?: ReactNode;\n iconLeft?: boolean;\n /** Icon forwarded to `AdminPanelHeader`'s 44×44 circular pill. Pass `<Icon glyph={<SomeIcon />} />`. */\n leadingIcon?: ReactNode;\n showBeta?: boolean;\n /** Default: \"Beta\". Accepts translated nodes. */\n betaLabel?: ReactNode;\n showEnterpriseLabel?: boolean;\n /** Default: \"Enterprise\". Accepts translated nodes. */\n enterpriseLabel?: ReactNode;\n showButton?: boolean;\n /** Default: \"Button\". Accepts translated nodes. */\n buttonLabel?: ReactNode;\n onButtonClick?: () => void;\n showSwitch?: boolean;\n switchLabel?: ReactNode;\n switchChecked?: boolean;\n defaultSwitchChecked?: boolean;\n onSwitchChange?: (\n checked: boolean,\n event: ChangeEvent<HTMLInputElement>,\n ) => void;\n switchDisabled?: boolean;\n expandable?: boolean;\n expandedState?: AdminPanelExpandedState;\n defaultExpandedState?: AdminPanelExpandedState;\n onExpandedStateChange?: (state: AdminPanelExpandedState) => void;\n /** Accessible name for the expand button while collapsed. Default: \"Expand section\". */\n expandLabel?: string;\n /** Accessible name for the expand button while expanded. Default: \"Collapse section\". */\n collapseLabel?: string;\n};\n\n/** Panel with a header. Body and footer are optional. */\ntype AdminPanelWithHeaderProps = AdminPanelChromeProps &\n AdminPanelHeaderSlotProps & {\n children?: ReactNode;\n };\n\n/**\n * Header-less panel. `children` (body) are required — footer alone is not enough.\n * Header chrome props (`subtitle`, `expandable`, …) are not accepted on this variant.\n */\ntype AdminPanelWithoutHeaderProps = AdminPanelChromeProps & {\n title?: undefined;\n children: AdminPanelContent;\n};\n\n/**\n * System Console admin settings panel. Provide a `title` (header), `children`\n * (body), or both. Footer is always optional. Header-only and body-only panels\n * are valid; footer-only is not.\n */\nexport type AdminPanelProps =\n | AdminPanelWithHeaderProps\n | AdminPanelWithoutHeaderProps;\n\n/**\n * Admin Panel is the bordered sheet used throughout System Console for a single\n * settings section. It can include an\n * [`Admin Panel Header`](/components/admin-panel-header), a body where grouped\n * fields and help text live, and an optional\n * [`Admin Panel Footer`](/components/admin-panel-footer) for sectional actions.\n * Provide a header, a body, or both — footer alone is not enough. Expand/collapse\n * state is owned here and passed to the header when present.\n */\nexport default function AdminPanel(props: AdminPanelProps) {\n const {\n title,\n children,\n footer,\n className = '',\n ...rest\n } = props as AdminPanelWithHeaderProps;\n\n const {\n subtitle,\n headerActions,\n iconLeft = false,\n leadingIcon,\n showBeta = false,\n betaLabel = 'Beta',\n showEnterpriseLabel = false,\n enterpriseLabel = 'Enterprise',\n showButton = false,\n buttonLabel = 'Button',\n onButtonClick,\n showSwitch = false,\n switchLabel = 'Off',\n switchChecked,\n defaultSwitchChecked,\n onSwitchChange,\n switchDisabled,\n expandable = false,\n expandedState: expandedStateProp,\n defaultExpandedState = 'collapsed',\n onExpandedStateChange,\n expandLabel,\n collapseLabel,\n ...domRest\n } = rest;\n\n const titleId = useId();\n // Treat nullish / false / '' as no header so JS callers and type escapes stay safe.\n const hasHeader = title != null && title !== false && title !== '';\n\n const [uncontrolledExpanded, setUncontrolledExpanded] =\n useState<AdminPanelExpandedState>(defaultExpandedState);\n\n // Expand/collapse lives on the header; without one, content stays visible.\n const canExpand = hasHeader && expandable;\n const isExpandControlled = canExpand && expandedStateProp !== undefined;\n const resolvedExpandedState: AdminPanelExpandedState = !canExpand\n ? 'expanded'\n : isExpandControlled\n ? expandedStateProp!\n : uncontrolledExpanded;\n\n const isExpanded = resolvedExpandedState === 'expanded';\n\n const setExpandedState = (next: AdminPanelExpandedState) => {\n if (!canExpand) return;\n if (!isExpandControlled) {\n setUncontrolledExpanded(next);\n }\n onExpandedStateChange?.(next);\n };\n\n const toggleExpanded = () => {\n setExpandedState(isExpanded ? 'collapsed' : 'expanded');\n };\n\n const hasBody = Children.toArray(children).length > 0;\n const hasFooter = footer != null;\n const hasContent = hasBody || hasFooter;\n // Skip the header divider when there is no body/footer so header-only\n // panels don’t show an orphan rule above the card edge.\n const showHeaderDivider = hasContent && (!canExpand || isExpanded);\n\n const body = hasBody ? (\n <div className={styles['admin-panel__body']}>{children}</div>\n ) : null;\n\n const content = hasContent ? (\n canExpand ? (\n <div\n className={[\n styles['admin-panel__collapse'],\n isExpanded ? styles['admin-panel__collapse--expanded'] : '',\n ]\n .filter(Boolean)\n .join(' ')}\n aria-hidden={!isExpanded}\n inert={!isExpanded}\n >\n <div className={styles['admin-panel__collapse-inner']}>\n {body}\n {footer}\n </div>\n </div>\n ) : (\n <>\n {body}\n {footer}\n </>\n )\n ) : null;\n\n return (\n <section\n {...domRest}\n className={[styles['admin-panel'], className].join(' ').trim()}\n aria-labelledby={hasHeader ? titleId : undefined}\n >\n {hasHeader ? (\n <AdminPanelHeader\n titleId={titleId}\n title={title}\n subtitle={subtitle}\n headerActions={headerActions}\n iconLeft={iconLeft}\n leadingIcon={leadingIcon}\n showBeta={showBeta}\n betaLabel={betaLabel}\n showEnterpriseLabel={showEnterpriseLabel}\n enterpriseLabel={enterpriseLabel}\n showButton={showButton}\n buttonLabel={buttonLabel}\n onButtonClick={onButtonClick}\n showSwitch={showSwitch}\n switchLabel={switchLabel}\n switchChecked={switchChecked}\n defaultSwitchChecked={defaultSwitchChecked}\n onSwitchChange={onSwitchChange}\n switchDisabled={switchDisabled}\n expandable={canExpand}\n isExpanded={isExpanded}\n onToggleExpand={toggleExpanded}\n expandLabel={expandLabel}\n collapseLabel={collapseLabel}\n showDivider={showHeaderDivider}\n />\n ) : null}\n {content}\n </section>\n );\n}\n"],"names":["AdminPanel","props","title","children","footer","className","rest","subtitle","headerActions","iconLeft","leadingIcon","showBeta","betaLabel","showEnterpriseLabel","enterpriseLabel","showButton","buttonLabel","onButtonClick","showSwitch","switchLabel","switchChecked","defaultSwitchChecked","onSwitchChange","switchDisabled","expandable","expandedStateProp","defaultExpandedState","onExpandedStateChange","expandLabel","collapseLabel","domRest","titleId","useId","hasHeader","uncontrolledExpanded","setUncontrolledExpanded","useState","canExpand","isExpandControlled","isExpanded","setExpandedState","next","toggleExpanded","hasBody","Children","hasFooter","hasContent","showHeaderDivider","body","jsx","styles","content","jsxs","Fragment","AdminPanelHeader"],"mappings":"oQAoGA,SAAwBA,EAAWC,EAAwB,CACzD,KAAM,CACJ,MAAAC,EACA,SAAAC,EACA,OAAAC,EACA,UAAAC,EAAY,GACZ,GAAGC,CAAA,EACDL,EAEE,CACJ,SAAAM,EACA,cAAAC,EACA,SAAAC,EAAW,GACX,YAAAC,EACA,SAAAC,EAAW,GACX,UAAAC,EAAY,OACZ,oBAAAC,EAAsB,GACtB,gBAAAC,EAAkB,aAClB,WAAAC,EAAa,GACb,YAAAC,EAAc,SACd,cAAAC,EACA,WAAAC,EAAa,GACb,YAAAC,EAAc,MACd,cAAAC,EACA,qBAAAC,EACA,eAAAC,EACA,eAAAC,EACA,WAAAC,EAAa,GACb,cAAeC,EACf,qBAAAC,EAAuB,YACvB,sBAAAC,EACA,YAAAC,EACA,cAAAC,EACA,GAAGC,CAAA,EACDxB,EAEEyB,EAAUC,EAAAA,MAAA,EAEVC,EAAY/B,GAAS,MAAQA,IAAU,IAASA,IAAU,GAE1D,CAACgC,EAAsBC,CAAuB,EAClDC,EAAAA,SAAkCV,CAAoB,EAGlDW,EAAYJ,GAAaT,EACzBc,EAAqBD,GAAaZ,IAAsB,OAOxDc,GANkDF,EAEpDC,EACEb,EACAS,EAHF,cAKyC,WAEvCM,EAAoBC,GAAkC,CACrDJ,IACAC,GACHH,EAAwBM,CAAI,EAE9Bd,GAAA,MAAAA,EAAwBc,GAC1B,EAEMC,EAAiB,IAAM,CAC3BF,EAAiBD,EAAa,YAAc,UAAU,CACxD,EAEMI,EAAUC,EAAAA,SAAS,QAAQzC,CAAQ,EAAE,OAAS,EAC9C0C,EAAYzC,GAAU,KACtB0C,EAAaH,GAAWE,EAGxBE,EAAoBD,IAAe,CAACT,GAAaE,GAEjDS,EAAOL,EACXM,EAAAA,IAAC,MAAA,CAAI,UAAWC,EAAAA,QAAO,mBAAmB,EAAI,SAAA/C,CAAA,CAAS,EACrD,KAEEgD,EAAUL,EACdT,EACEY,EAAAA,IAAC,MAAA,CACC,UAAW,CACTC,EAAAA,QAAO,uBAAuB,EAC9BX,EAAaW,EAAAA,QAAO,iCAAiC,EAAI,EAAA,EAExD,OAAO,OAAO,EACd,KAAK,GAAG,EACX,cAAa,CAACX,EACd,MAAO,CAACA,EAER,SAAAa,EAAAA,KAAC,MAAA,CAAI,UAAWF,UAAO,6BAA6B,EACjD,SAAA,CAAAF,EACA5C,CAAA,CAAA,CACH,CAAA,CAAA,EAGFgD,EAAAA,KAAAC,WAAA,CACG,SAAA,CAAAL,EACA5C,CAAA,CAAA,CACH,EAEA,KAEJ,OACEgD,EAAAA,KAAC,UAAA,CACE,GAAGtB,EACJ,UAAW,CAACoB,EAAAA,QAAO,aAAa,EAAG7C,CAAS,EAAE,KAAK,GAAG,EAAE,KAAA,EACxD,kBAAiB4B,EAAYF,EAAU,OAEtC,SAAA,CAAAE,EACCgB,EAAAA,IAACK,EAAAA,QAAA,CACC,QAAAvB,EACA,MAAA7B,EACA,SAAAK,EACA,cAAAC,EACA,SAAAC,EACA,YAAAC,EACA,SAAAC,EACA,UAAAC,EACA,oBAAAC,EACA,gBAAAC,EACA,WAAAC,EACA,YAAAC,EACA,cAAAC,EACA,WAAAC,EACA,YAAAC,EACA,cAAAC,EACA,qBAAAC,EACA,eAAAC,EACA,eAAAC,EACA,WAAYc,EACZ,WAAAE,EACA,eAAgBG,EAChB,YAAAd,EACA,cAAAC,EACA,YAAakB,CAAA,CAAA,EAEb,KACHI,CAAA,CAAA,CAAA,CAGP"}
@@ -1,14 +1,23 @@
1
1
  import { ChangeEvent, HTMLAttributes, ReactNode } from 'react';
2
2
  import { AdminPanelExpandedState } from '../admin-panel-header/AdminPanelHeader';
3
3
  export type { AdminPanelExpandedState };
4
- export interface AdminPanelProps extends Omit<HTMLAttributes<HTMLElement>, 'title' | 'children'> {
5
- title: ReactNode;
6
- subtitle?: ReactNode;
7
- children?: ReactNode;
4
+ /** Non-null content for required header/body slots (runtime still guards nullish escapes). */
5
+ type AdminPanelContent = NonNullable<ReactNode>;
6
+ type AdminPanelChromeProps = Omit<HTMLAttributes<HTMLElement>, 'title' | 'children'> & {
8
7
  className?: string;
8
+ /**
9
+ * Optional footer rail below the body — typically
10
+ * [`AdminPanelFooter`](/components/admin-panel-footer) with left/right action slots.
11
+ * Collapses with the body when the panel is expandable.
12
+ */
13
+ footer?: ReactNode;
14
+ };
15
+ type AdminPanelHeaderSlotProps = {
16
+ title: AdminPanelContent;
17
+ subtitle?: ReactNode;
9
18
  headerActions?: ReactNode;
10
19
  iconLeft?: boolean;
11
- /** Icon forwarded to `AdminPanelHeader`'s 44×44 circular pill. Pass `<Icon glyph={<SomeIcon />} size="20" />`. */
20
+ /** Icon forwarded to `AdminPanelHeader`'s 44×44 circular pill. Pass `<Icon glyph={<SomeIcon />} />`. */
12
21
  leadingIcon?: ReactNode;
13
22
  showBeta?: boolean;
14
23
  /** Default: "Beta". Accepts translated nodes. */
@@ -34,10 +43,33 @@ export interface AdminPanelProps extends Omit<HTMLAttributes<HTMLElement>, 'titl
34
43
  expandLabel?: string;
35
44
  /** Accessible name for the expand button while expanded. Default: "Collapse section". */
36
45
  collapseLabel?: string;
37
- }
46
+ };
47
+ /** Panel with a header. Body and footer are optional. */
48
+ type AdminPanelWithHeaderProps = AdminPanelChromeProps & AdminPanelHeaderSlotProps & {
49
+ children?: ReactNode;
50
+ };
51
+ /**
52
+ * Header-less panel. `children` (body) are required — footer alone is not enough.
53
+ * Header chrome props (`subtitle`, `expandable`, …) are not accepted on this variant.
54
+ */
55
+ type AdminPanelWithoutHeaderProps = AdminPanelChromeProps & {
56
+ title?: undefined;
57
+ children: AdminPanelContent;
58
+ };
59
+ /**
60
+ * System Console admin settings panel. Provide a `title` (header), `children`
61
+ * (body), or both. Footer is always optional. Header-only and body-only panels
62
+ * are valid; footer-only is not.
63
+ */
64
+ export type AdminPanelProps = AdminPanelWithHeaderProps | AdminPanelWithoutHeaderProps;
38
65
  /**
39
- * System Console admin settings panel: `AdminPanelHeader` plus a body slot
40
- * for grouped fields. Expand/collapse state is owned here and passed to the header.
66
+ * Admin Panel is the bordered sheet used throughout System Console for a single
67
+ * settings section. It can include an
68
+ * [`Admin Panel Header`](/components/admin-panel-header), a body where grouped
69
+ * fields and help text live, and an optional
70
+ * [`Admin Panel Footer`](/components/admin-panel-footer) for sectional actions.
71
+ * Provide a header, a body, or both — footer alone is not enough. Expand/collapse
72
+ * state is owned here and passed to the header when present.
41
73
  */
42
- export default function AdminPanel({ title, subtitle, headerActions, children, className, iconLeft, leadingIcon, showBeta, betaLabel, showEnterpriseLabel, enterpriseLabel, showButton, buttonLabel, onButtonClick, showSwitch, switchLabel, switchChecked, defaultSwitchChecked, onSwitchChange, switchDisabled, expandable, expandedState: expandedStateProp, defaultExpandedState, onExpandedStateChange, expandLabel, collapseLabel, ...rest }: AdminPanelProps): import("react/jsx-runtime").JSX.Element;
74
+ export default function AdminPanel(props: AdminPanelProps): import("react/jsx-runtime").JSX.Element;
43
75
  //# sourceMappingURL=AdminPanel.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"AdminPanel.d.ts","sourceRoot":"","sources":["../../../src/components/admin-panel/AdminPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAGL,KAAK,WAAW,EAChB,KAAK,cAAc,EACnB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AACf,OAAyB,EACvB,KAAK,uBAAuB,EAC7B,MAAM,gDAAgD,CAAC;AAGxD,YAAY,EAAE,uBAAuB,EAAE,CAAC;AAExC,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAC3C,cAAc,CAAC,WAAW,CAAC,EAC3B,OAAO,GAAG,UAAU,CACrB;IACC,KAAK,EAAE,SAAS,CAAC;IACjB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,kHAAkH;IAClH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,iDAAiD;IACjD,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,uDAAuD;IACvD,eAAe,CAAC,EAAE,SAAS,CAAC;IAC5B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,mDAAmD;IACnD,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,cAAc,CAAC,EAAE,CACf,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,WAAW,CAAC,gBAAgB,CAAC,KACjC,IAAI,CAAC;IACV,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,aAAa,CAAC,EAAE,uBAAuB,CAAC;IACxC,oBAAoB,CAAC,EAAE,uBAAuB,CAAC;IAC/C,qBAAqB,CAAC,EAAE,CAAC,KAAK,EAAE,uBAAuB,KAAK,IAAI,CAAC;IACjE,wFAAwF;IACxF,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,yFAAyF;IACzF,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAED;;;GAGG;AACH,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EACjC,KAAK,EACL,QAAQ,EACR,aAAa,EACb,QAAQ,EACR,SAAc,EACd,QAAgB,EAChB,WAAW,EACX,QAAgB,EAChB,SAAkB,EAClB,mBAA2B,EAC3B,eAA8B,EAC9B,UAAkB,EAClB,WAAsB,EACtB,aAAa,EACb,UAAkB,EAClB,WAAmB,EACnB,aAAa,EACb,oBAAoB,EACpB,cAAc,EACd,cAAc,EACd,UAAkB,EAClB,aAAa,EAAE,iBAAiB,EAChC,oBAAkC,EAClC,qBAAqB,EACrB,WAAW,EACX,aAAa,EACb,GAAG,IAAI,EACR,EAAE,eAAe,2CAiFjB"}
1
+ {"version":3,"file":"AdminPanel.d.ts","sourceRoot":"","sources":["../../../src/components/admin-panel/AdminPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAIL,KAAK,WAAW,EAChB,KAAK,cAAc,EACnB,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AACf,OAAyB,EACvB,KAAK,uBAAuB,EAC7B,MAAM,gDAAgD,CAAC;AAGxD,YAAY,EAAE,uBAAuB,EAAE,CAAC;AAExC,8FAA8F;AAC9F,KAAK,iBAAiB,GAAG,WAAW,CAAC,SAAS,CAAC,CAAC;AAEhD,KAAK,qBAAqB,GAAG,IAAI,CAC/B,cAAc,CAAC,WAAW,CAAC,EAC3B,OAAO,GAAG,UAAU,CACrB,GAAG;IACF,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;OAIG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC;CACpB,CAAC;AAEF,KAAK,yBAAyB,GAAG;IAC/B,KAAK,EAAE,iBAAiB,CAAC;IACzB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,wGAAwG;IACxG,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,iDAAiD;IACjD,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,uDAAuD;IACvD,eAAe,CAAC,EAAE,SAAS,CAAC;IAC5B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,mDAAmD;IACnD,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,cAAc,CAAC,EAAE,CACf,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,WAAW,CAAC,gBAAgB,CAAC,KACjC,IAAI,CAAC;IACV,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,aAAa,CAAC,EAAE,uBAAuB,CAAC;IACxC,oBAAoB,CAAC,EAAE,uBAAuB,CAAC;IAC/C,qBAAqB,CAAC,EAAE,CAAC,KAAK,EAAE,uBAAuB,KAAK,IAAI,CAAC;IACjE,wFAAwF;IACxF,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,yFAAyF;IACzF,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AAEF,yDAAyD;AACzD,KAAK,yBAAyB,GAAG,qBAAqB,GACpD,yBAAyB,GAAG;IAC1B,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,CAAC;AAEJ;;;GAGG;AACH,KAAK,4BAA4B,GAAG,qBAAqB,GAAG;IAC1D,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,QAAQ,EAAE,iBAAiB,CAAC;CAC7B,CAAC;AAEF;;;;GAIG;AACH,MAAM,MAAM,eAAe,GACvB,yBAAyB,GACzB,4BAA4B,CAAC;AAEjC;;;;;;;;GAQG;AACH,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,KAAK,EAAE,eAAe,2CA4IxD"}
@@ -1,94 +1,104 @@
1
- import { jsxs as G, jsx as l } from "react/jsx-runtime";
2
- import { useId as J, useState as K } from "react";
3
- import L from "../admin-panel-header/AdminPanelHeader.js";
4
- import s from "./AdminPanel.module.scss.js";
5
- function W({
6
- title: c,
7
- subtitle: m,
8
- headerActions: p,
9
- children: n,
10
- className: f = "",
11
- iconLeft: _ = !1,
12
- leadingIcon: v,
13
- showBeta: u = !1,
14
- betaLabel: x = "Beta",
15
- showEnterpriseLabel: E = !1,
16
- enterpriseLabel: N = "Enterprise",
17
- showButton: j = !1,
18
- buttonLabel: y = "Button",
19
- onButtonClick: B,
20
- showSwitch: w = !1,
21
- switchLabel: A = "Off",
22
- switchChecked: D,
23
- defaultSwitchChecked: H,
24
- onSwitchChange: I,
25
- switchDisabled: h,
26
- expandable: e = !1,
27
- expandedState: o,
28
- defaultExpandedState: O = "collapsed",
29
- onExpandedStateChange: a,
30
- expandLabel: P,
31
- collapseLabel: T,
32
- ...U
33
- }) {
34
- const i = J(), [g, k] = K(O), t = e && o !== void 0, d = (e ? t ? o : g : "expanded") === "expanded", q = (r) => {
35
- e && (t || k(r), a == null || a(r));
36
- }, z = () => {
37
- q(d ? "collapsed" : "expanded");
38
- }, F = !e || d;
39
- return /* @__PURE__ */ G(
1
+ import { jsxs as s, jsx as i, Fragment as W } from "react/jsx-runtime";
2
+ import { useId as X, useState as Y, Children as Z } from "react";
3
+ import $ from "../admin-panel-header/AdminPanelHeader.js";
4
+ import a from "./AdminPanel.module.scss.js";
5
+ function de(b) {
6
+ const {
7
+ title: t,
8
+ children: c,
9
+ footer: l,
10
+ className: w = "",
11
+ ...E
12
+ } = b, {
13
+ subtitle: v,
14
+ headerActions: S,
15
+ iconLeft: L = !1,
16
+ leadingIcon: _,
17
+ showBeta: g = !1,
18
+ betaLabel: B = "Beta",
19
+ showEnterpriseLabel: y = !1,
20
+ enterpriseLabel: C = "Enterprise",
21
+ showButton: N = !1,
22
+ buttonLabel: j = "Button",
23
+ onButtonClick: A,
24
+ showSwitch: k = !1,
25
+ switchLabel: D = "Off",
26
+ switchChecked: H,
27
+ defaultSwitchChecked: I,
28
+ onSwitchChange: P,
29
+ switchDisabled: F,
30
+ expandable: O = !1,
31
+ expandedState: r,
32
+ defaultExpandedState: R = "collapsed",
33
+ onExpandedStateChange: d,
34
+ expandLabel: T,
35
+ collapseLabel: U,
36
+ ...q
37
+ } = E, p = X(), o = t != null && t !== !1 && t !== "", [z, G] = Y(R), e = o && O, h = e && r !== void 0, n = (e ? h ? r : z : "expanded") === "expanded", J = (u) => {
38
+ e && (h || G(u), d == null || d(u));
39
+ }, K = () => {
40
+ J(n ? "collapsed" : "expanded");
41
+ }, m = Z.toArray(c).length > 0, M = l != null, f = m || M, Q = f && (!e || n), x = m ? /* @__PURE__ */ i("div", { className: a["admin-panel__body"], children: c }) : null, V = f ? e ? /* @__PURE__ */ i(
42
+ "div",
43
+ {
44
+ className: [
45
+ a["admin-panel__collapse"],
46
+ n ? a["admin-panel__collapse--expanded"] : ""
47
+ ].filter(Boolean).join(" "),
48
+ "aria-hidden": !n,
49
+ inert: !n,
50
+ children: /* @__PURE__ */ s("div", { className: a["admin-panel__collapse-inner"], children: [
51
+ x,
52
+ l
53
+ ] })
54
+ }
55
+ ) : /* @__PURE__ */ s(W, { children: [
56
+ x,
57
+ l
58
+ ] }) : null;
59
+ return /* @__PURE__ */ s(
40
60
  "section",
41
61
  {
42
- ...U,
43
- className: [s["admin-panel"], f].join(" ").trim(),
44
- "aria-labelledby": i,
62
+ ...q,
63
+ className: [a["admin-panel"], w].join(" ").trim(),
64
+ "aria-labelledby": o ? p : void 0,
45
65
  children: [
46
- /* @__PURE__ */ l(
47
- L,
66
+ o ? /* @__PURE__ */ i(
67
+ $,
48
68
  {
49
- titleId: i,
50
- title: c,
51
- subtitle: m,
52
- headerActions: p,
53
- iconLeft: _,
54
- leadingIcon: v,
55
- showBeta: u,
56
- betaLabel: x,
57
- showEnterpriseLabel: E,
58
- enterpriseLabel: N,
59
- showButton: j,
60
- buttonLabel: y,
61
- onButtonClick: B,
62
- showSwitch: w,
63
- switchLabel: A,
64
- switchChecked: D,
65
- defaultSwitchChecked: H,
66
- onSwitchChange: I,
67
- switchDisabled: h,
69
+ titleId: p,
70
+ title: t,
71
+ subtitle: v,
72
+ headerActions: S,
73
+ iconLeft: L,
74
+ leadingIcon: _,
75
+ showBeta: g,
76
+ betaLabel: B,
77
+ showEnterpriseLabel: y,
78
+ enterpriseLabel: C,
79
+ showButton: N,
80
+ buttonLabel: j,
81
+ onButtonClick: A,
82
+ showSwitch: k,
83
+ switchLabel: D,
84
+ switchChecked: H,
85
+ defaultSwitchChecked: I,
86
+ onSwitchChange: P,
87
+ switchDisabled: F,
68
88
  expandable: e,
69
- isExpanded: d,
70
- onToggleExpand: z,
71
- expandLabel: P,
72
- collapseLabel: T,
73
- showDivider: F
74
- }
75
- ),
76
- e ? /* @__PURE__ */ l(
77
- "div",
78
- {
79
- className: [
80
- s["admin-panel__collapse"],
81
- d ? s["admin-panel__collapse--expanded"] : ""
82
- ].filter(Boolean).join(" "),
83
- "aria-hidden": !d,
84
- children: /* @__PURE__ */ l("div", { className: s["admin-panel__collapse-inner"], children: /* @__PURE__ */ l("div", { className: s["admin-panel__body"], children: n }) })
89
+ isExpanded: n,
90
+ onToggleExpand: K,
91
+ expandLabel: T,
92
+ collapseLabel: U,
93
+ showDivider: Q
85
94
  }
86
- ) : /* @__PURE__ */ l("div", { className: s["admin-panel__body"], children: n })
95
+ ) : null,
96
+ V
87
97
  ]
88
98
  }
89
99
  );
90
100
  }
91
101
  export {
92
- W as default
102
+ de as default
93
103
  };
94
104
  //# sourceMappingURL=AdminPanel.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"AdminPanel.js","sources":["../../../src/components/admin-panel/AdminPanel.tsx"],"sourcesContent":["import {\n useId,\n useState,\n type ChangeEvent,\n type HTMLAttributes,\n type ReactNode,\n} from 'react';\nimport AdminPanelHeader, {\n type AdminPanelExpandedState,\n} from '@/components/admin-panel-header/AdminPanelHeader';\nimport styles from './AdminPanel.module.scss';\n\nexport type { AdminPanelExpandedState };\n\nexport interface AdminPanelProps extends Omit<\n HTMLAttributes<HTMLElement>,\n 'title' | 'children'\n> {\n title: ReactNode;\n subtitle?: ReactNode;\n children?: ReactNode;\n className?: string;\n headerActions?: ReactNode;\n iconLeft?: boolean;\n /** Icon forwarded to `AdminPanelHeader`'s 44×44 circular pill. Pass `<Icon glyph={<SomeIcon />} size=\"20\" />`. */\n leadingIcon?: ReactNode;\n showBeta?: boolean;\n /** Default: \"Beta\". Accepts translated nodes. */\n betaLabel?: ReactNode;\n showEnterpriseLabel?: boolean;\n /** Default: \"Enterprise\". Accepts translated nodes. */\n enterpriseLabel?: ReactNode;\n showButton?: boolean;\n /** Default: \"Button\". Accepts translated nodes. */\n buttonLabel?: ReactNode;\n onButtonClick?: () => void;\n showSwitch?: boolean;\n switchLabel?: ReactNode;\n switchChecked?: boolean;\n defaultSwitchChecked?: boolean;\n onSwitchChange?: (\n checked: boolean,\n event: ChangeEvent<HTMLInputElement>,\n ) => void;\n switchDisabled?: boolean;\n expandable?: boolean;\n expandedState?: AdminPanelExpandedState;\n defaultExpandedState?: AdminPanelExpandedState;\n onExpandedStateChange?: (state: AdminPanelExpandedState) => void;\n /** Accessible name for the expand button while collapsed. Default: \"Expand section\". */\n expandLabel?: string;\n /** Accessible name for the expand button while expanded. Default: \"Collapse section\". */\n collapseLabel?: string;\n}\n\n/**\n * System Console admin settings panel: `AdminPanelHeader` plus a body slot\n * for grouped fields. Expand/collapse state is owned here and passed to the header.\n */\nexport default function AdminPanel({\n title,\n subtitle,\n headerActions,\n children,\n className = '',\n iconLeft = false,\n leadingIcon,\n showBeta = false,\n betaLabel = 'Beta',\n showEnterpriseLabel = false,\n enterpriseLabel = 'Enterprise',\n showButton = false,\n buttonLabel = 'Button',\n onButtonClick,\n showSwitch = false,\n switchLabel = 'Off',\n switchChecked,\n defaultSwitchChecked,\n onSwitchChange,\n switchDisabled,\n expandable = false,\n expandedState: expandedStateProp,\n defaultExpandedState = 'collapsed',\n onExpandedStateChange,\n expandLabel,\n collapseLabel,\n ...rest\n}: AdminPanelProps) {\n const titleId = useId();\n\n const [uncontrolledExpanded, setUncontrolledExpanded] =\n useState<AdminPanelExpandedState>(defaultExpandedState);\n\n const isExpandControlled = expandable && expandedStateProp !== undefined;\n const resolvedExpandedState: AdminPanelExpandedState = !expandable\n ? 'expanded'\n : isExpandControlled\n ? expandedStateProp!\n : uncontrolledExpanded;\n\n const isExpanded = resolvedExpandedState === 'expanded';\n\n const setExpandedState = (next: AdminPanelExpandedState) => {\n if (!expandable) return;\n if (!isExpandControlled) {\n setUncontrolledExpanded(next);\n }\n onExpandedStateChange?.(next);\n };\n\n const toggleExpanded = () => {\n setExpandedState(isExpanded ? 'collapsed' : 'expanded');\n };\n\n const showHeaderDivider = !expandable || isExpanded;\n\n return (\n <section\n {...rest}\n className={[styles['admin-panel'], className].join(' ').trim()}\n aria-labelledby={titleId}\n >\n <AdminPanelHeader\n titleId={titleId}\n title={title}\n subtitle={subtitle}\n headerActions={headerActions}\n iconLeft={iconLeft}\n leadingIcon={leadingIcon}\n showBeta={showBeta}\n betaLabel={betaLabel}\n showEnterpriseLabel={showEnterpriseLabel}\n enterpriseLabel={enterpriseLabel}\n showButton={showButton}\n buttonLabel={buttonLabel}\n onButtonClick={onButtonClick}\n showSwitch={showSwitch}\n switchLabel={switchLabel}\n switchChecked={switchChecked}\n defaultSwitchChecked={defaultSwitchChecked}\n onSwitchChange={onSwitchChange}\n switchDisabled={switchDisabled}\n expandable={expandable}\n isExpanded={isExpanded}\n onToggleExpand={toggleExpanded}\n expandLabel={expandLabel}\n collapseLabel={collapseLabel}\n showDivider={showHeaderDivider}\n />\n {expandable ? (\n <div\n className={[\n styles['admin-panel__collapse'],\n isExpanded ? styles['admin-panel__collapse--expanded'] : '',\n ]\n .filter(Boolean)\n .join(' ')}\n aria-hidden={!isExpanded}\n >\n <div className={styles['admin-panel__collapse-inner']}>\n <div className={styles['admin-panel__body']}>{children}</div>\n </div>\n </div>\n ) : (\n <div className={styles['admin-panel__body']}>{children}</div>\n )}\n </section>\n );\n}\n"],"names":["AdminPanel","title","subtitle","headerActions","children","className","iconLeft","leadingIcon","showBeta","betaLabel","showEnterpriseLabel","enterpriseLabel","showButton","buttonLabel","onButtonClick","showSwitch","switchLabel","switchChecked","defaultSwitchChecked","onSwitchChange","switchDisabled","expandable","expandedStateProp","defaultExpandedState","onExpandedStateChange","expandLabel","collapseLabel","rest","titleId","useId","uncontrolledExpanded","setUncontrolledExpanded","useState","isExpandControlled","isExpanded","setExpandedState","next","toggleExpanded","showHeaderDivider","jsxs","styles","jsx","AdminPanelHeader"],"mappings":";;;;AA2DA,SAAwBA,EAAW;AAAA,EACjC,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,eAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,UAAAC,IAAW;AAAA,EACX,aAAAC;AAAA,EACA,UAAAC,IAAW;AAAA,EACX,WAAAC,IAAY;AAAA,EACZ,qBAAAC,IAAsB;AAAA,EACtB,iBAAAC,IAAkB;AAAA,EAClB,YAAAC,IAAa;AAAA,EACb,aAAAC,IAAc;AAAA,EACd,eAAAC;AAAA,EACA,YAAAC,IAAa;AAAA,EACb,aAAAC,IAAc;AAAA,EACd,eAAAC;AAAA,EACA,sBAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,YAAAC,IAAa;AAAA,EACb,eAAeC;AAAA,EACf,sBAAAC,IAAuB;AAAA,EACvB,uBAAAC;AAAA,EACA,aAAAC;AAAA,EACA,eAAAC;AAAA,EACA,GAAGC;AACL,GAAoB;AAClB,QAAMC,IAAUC,EAAA,GAEV,CAACC,GAAsBC,CAAuB,IAClDC,EAAkCT,CAAoB,GAElDU,IAAqBZ,KAAcC,MAAsB,QAOzDY,KANkDb,IAEpDY,IACEX,IACAQ,IAHF,gBAKyC,YAEvCK,IAAmB,CAACC,MAAkC;AAC1D,IAAKf,MACAY,KACHF,EAAwBK,CAAI,GAE9BZ,KAAA,QAAAA,EAAwBY;AAAA,EAC1B,GAEMC,IAAiB,MAAM;AAC3B,IAAAF,EAAiBD,IAAa,cAAc,UAAU;AAAA,EACxD,GAEMI,IAAoB,CAACjB,KAAca;AAEzC,SACE,gBAAAK;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAGZ;AAAA,MACJ,WAAW,CAACa,EAAO,aAAa,GAAGnC,CAAS,EAAE,KAAK,GAAG,EAAE,KAAA;AAAA,MACxD,mBAAiBuB;AAAA,MAEjB,UAAA;AAAA,QAAA,gBAAAa;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,SAAAd;AAAA,YACA,OAAA3B;AAAA,YACA,UAAAC;AAAA,YACA,eAAAC;AAAA,YACA,UAAAG;AAAA,YACA,aAAAC;AAAA,YACA,UAAAC;AAAA,YACA,WAAAC;AAAA,YACA,qBAAAC;AAAA,YACA,iBAAAC;AAAA,YACA,YAAAC;AAAA,YACA,aAAAC;AAAA,YACA,eAAAC;AAAA,YACA,YAAAC;AAAA,YACA,aAAAC;AAAA,YACA,eAAAC;AAAA,YACA,sBAAAC;AAAA,YACA,gBAAAC;AAAA,YACA,gBAAAC;AAAA,YACA,YAAAC;AAAA,YACA,YAAAa;AAAA,YACA,gBAAgBG;AAAA,YAChB,aAAAZ;AAAA,YACA,eAAAC;AAAA,YACA,aAAaY;AAAA,UAAA;AAAA,QAAA;AAAA,QAEdjB,IACC,gBAAAoB;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAW;AAAA,cACTD,EAAO,uBAAuB;AAAA,cAC9BN,IAAaM,EAAO,iCAAiC,IAAI;AAAA,YAAA,EAExD,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,YACX,eAAa,CAACN;AAAA,YAEd,UAAA,gBAAAO,EAAC,OAAA,EAAI,WAAWD,EAAO,6BAA6B,GAClD,UAAA,gBAAAC,EAAC,OAAA,EAAI,WAAWD,EAAO,mBAAmB,GAAI,UAAApC,GAAS,EAAA,CACzD;AAAA,UAAA;AAAA,QAAA,IAGF,gBAAAqC,EAAC,OAAA,EAAI,WAAWD,EAAO,mBAAmB,GAAI,UAAApC,EAAA,CAAS;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAI/D;"}
1
+ {"version":3,"file":"AdminPanel.js","sources":["../../../src/components/admin-panel/AdminPanel.tsx"],"sourcesContent":["import {\n Children,\n useId,\n useState,\n type ChangeEvent,\n type HTMLAttributes,\n type ReactNode,\n} from 'react';\nimport AdminPanelHeader, {\n type AdminPanelExpandedState,\n} from '@/components/admin-panel-header/AdminPanelHeader';\nimport styles from './AdminPanel.module.scss';\n\nexport type { AdminPanelExpandedState };\n\n/** Non-null content for required header/body slots (runtime still guards nullish escapes). */\ntype AdminPanelContent = NonNullable<ReactNode>;\n\ntype AdminPanelChromeProps = Omit<\n HTMLAttributes<HTMLElement>,\n 'title' | 'children'\n> & {\n className?: string;\n /**\n * Optional footer rail below the body — typically\n * [`AdminPanelFooter`](/components/admin-panel-footer) with left/right action slots.\n * Collapses with the body when the panel is expandable.\n */\n footer?: ReactNode;\n};\n\ntype AdminPanelHeaderSlotProps = {\n title: AdminPanelContent;\n subtitle?: ReactNode;\n headerActions?: ReactNode;\n iconLeft?: boolean;\n /** Icon forwarded to `AdminPanelHeader`'s 44×44 circular pill. Pass `<Icon glyph={<SomeIcon />} />`. */\n leadingIcon?: ReactNode;\n showBeta?: boolean;\n /** Default: \"Beta\". Accepts translated nodes. */\n betaLabel?: ReactNode;\n showEnterpriseLabel?: boolean;\n /** Default: \"Enterprise\". Accepts translated nodes. */\n enterpriseLabel?: ReactNode;\n showButton?: boolean;\n /** Default: \"Button\". Accepts translated nodes. */\n buttonLabel?: ReactNode;\n onButtonClick?: () => void;\n showSwitch?: boolean;\n switchLabel?: ReactNode;\n switchChecked?: boolean;\n defaultSwitchChecked?: boolean;\n onSwitchChange?: (\n checked: boolean,\n event: ChangeEvent<HTMLInputElement>,\n ) => void;\n switchDisabled?: boolean;\n expandable?: boolean;\n expandedState?: AdminPanelExpandedState;\n defaultExpandedState?: AdminPanelExpandedState;\n onExpandedStateChange?: (state: AdminPanelExpandedState) => void;\n /** Accessible name for the expand button while collapsed. Default: \"Expand section\". */\n expandLabel?: string;\n /** Accessible name for the expand button while expanded. Default: \"Collapse section\". */\n collapseLabel?: string;\n};\n\n/** Panel with a header. Body and footer are optional. */\ntype AdminPanelWithHeaderProps = AdminPanelChromeProps &\n AdminPanelHeaderSlotProps & {\n children?: ReactNode;\n };\n\n/**\n * Header-less panel. `children` (body) are required — footer alone is not enough.\n * Header chrome props (`subtitle`, `expandable`, …) are not accepted on this variant.\n */\ntype AdminPanelWithoutHeaderProps = AdminPanelChromeProps & {\n title?: undefined;\n children: AdminPanelContent;\n};\n\n/**\n * System Console admin settings panel. Provide a `title` (header), `children`\n * (body), or both. Footer is always optional. Header-only and body-only panels\n * are valid; footer-only is not.\n */\nexport type AdminPanelProps =\n | AdminPanelWithHeaderProps\n | AdminPanelWithoutHeaderProps;\n\n/**\n * Admin Panel is the bordered sheet used throughout System Console for a single\n * settings section. It can include an\n * [`Admin Panel Header`](/components/admin-panel-header), a body where grouped\n * fields and help text live, and an optional\n * [`Admin Panel Footer`](/components/admin-panel-footer) for sectional actions.\n * Provide a header, a body, or both — footer alone is not enough. Expand/collapse\n * state is owned here and passed to the header when present.\n */\nexport default function AdminPanel(props: AdminPanelProps) {\n const {\n title,\n children,\n footer,\n className = '',\n ...rest\n } = props as AdminPanelWithHeaderProps;\n\n const {\n subtitle,\n headerActions,\n iconLeft = false,\n leadingIcon,\n showBeta = false,\n betaLabel = 'Beta',\n showEnterpriseLabel = false,\n enterpriseLabel = 'Enterprise',\n showButton = false,\n buttonLabel = 'Button',\n onButtonClick,\n showSwitch = false,\n switchLabel = 'Off',\n switchChecked,\n defaultSwitchChecked,\n onSwitchChange,\n switchDisabled,\n expandable = false,\n expandedState: expandedStateProp,\n defaultExpandedState = 'collapsed',\n onExpandedStateChange,\n expandLabel,\n collapseLabel,\n ...domRest\n } = rest;\n\n const titleId = useId();\n // Treat nullish / false / '' as no header so JS callers and type escapes stay safe.\n const hasHeader = title != null && title !== false && title !== '';\n\n const [uncontrolledExpanded, setUncontrolledExpanded] =\n useState<AdminPanelExpandedState>(defaultExpandedState);\n\n // Expand/collapse lives on the header; without one, content stays visible.\n const canExpand = hasHeader && expandable;\n const isExpandControlled = canExpand && expandedStateProp !== undefined;\n const resolvedExpandedState: AdminPanelExpandedState = !canExpand\n ? 'expanded'\n : isExpandControlled\n ? expandedStateProp!\n : uncontrolledExpanded;\n\n const isExpanded = resolvedExpandedState === 'expanded';\n\n const setExpandedState = (next: AdminPanelExpandedState) => {\n if (!canExpand) return;\n if (!isExpandControlled) {\n setUncontrolledExpanded(next);\n }\n onExpandedStateChange?.(next);\n };\n\n const toggleExpanded = () => {\n setExpandedState(isExpanded ? 'collapsed' : 'expanded');\n };\n\n const hasBody = Children.toArray(children).length > 0;\n const hasFooter = footer != null;\n const hasContent = hasBody || hasFooter;\n // Skip the header divider when there is no body/footer so header-only\n // panels don’t show an orphan rule above the card edge.\n const showHeaderDivider = hasContent && (!canExpand || isExpanded);\n\n const body = hasBody ? (\n <div className={styles['admin-panel__body']}>{children}</div>\n ) : null;\n\n const content = hasContent ? (\n canExpand ? (\n <div\n className={[\n styles['admin-panel__collapse'],\n isExpanded ? styles['admin-panel__collapse--expanded'] : '',\n ]\n .filter(Boolean)\n .join(' ')}\n aria-hidden={!isExpanded}\n inert={!isExpanded}\n >\n <div className={styles['admin-panel__collapse-inner']}>\n {body}\n {footer}\n </div>\n </div>\n ) : (\n <>\n {body}\n {footer}\n </>\n )\n ) : null;\n\n return (\n <section\n {...domRest}\n className={[styles['admin-panel'], className].join(' ').trim()}\n aria-labelledby={hasHeader ? titleId : undefined}\n >\n {hasHeader ? (\n <AdminPanelHeader\n titleId={titleId}\n title={title}\n subtitle={subtitle}\n headerActions={headerActions}\n iconLeft={iconLeft}\n leadingIcon={leadingIcon}\n showBeta={showBeta}\n betaLabel={betaLabel}\n showEnterpriseLabel={showEnterpriseLabel}\n enterpriseLabel={enterpriseLabel}\n showButton={showButton}\n buttonLabel={buttonLabel}\n onButtonClick={onButtonClick}\n showSwitch={showSwitch}\n switchLabel={switchLabel}\n switchChecked={switchChecked}\n defaultSwitchChecked={defaultSwitchChecked}\n onSwitchChange={onSwitchChange}\n switchDisabled={switchDisabled}\n expandable={canExpand}\n isExpanded={isExpanded}\n onToggleExpand={toggleExpanded}\n expandLabel={expandLabel}\n collapseLabel={collapseLabel}\n showDivider={showHeaderDivider}\n />\n ) : null}\n {content}\n </section>\n );\n}\n"],"names":["AdminPanel","props","title","children","footer","className","rest","subtitle","headerActions","iconLeft","leadingIcon","showBeta","betaLabel","showEnterpriseLabel","enterpriseLabel","showButton","buttonLabel","onButtonClick","showSwitch","switchLabel","switchChecked","defaultSwitchChecked","onSwitchChange","switchDisabled","expandable","expandedStateProp","defaultExpandedState","onExpandedStateChange","expandLabel","collapseLabel","domRest","titleId","useId","hasHeader","uncontrolledExpanded","setUncontrolledExpanded","useState","canExpand","isExpandControlled","isExpanded","setExpandedState","next","toggleExpanded","hasBody","Children","hasFooter","hasContent","showHeaderDivider","body","jsx","styles","content","jsxs","Fragment","AdminPanelHeader"],"mappings":";;;;AAoGA,SAAwBA,GAAWC,GAAwB;AACzD,QAAM;AAAA,IACJ,OAAAC;AAAA,IACA,UAAAC;AAAA,IACA,QAAAC;AAAA,IACA,WAAAC,IAAY;AAAA,IACZ,GAAGC;AAAA,EAAA,IACDL,GAEE;AAAA,IACJ,UAAAM;AAAA,IACA,eAAAC;AAAA,IACA,UAAAC,IAAW;AAAA,IACX,aAAAC;AAAA,IACA,UAAAC,IAAW;AAAA,IACX,WAAAC,IAAY;AAAA,IACZ,qBAAAC,IAAsB;AAAA,IACtB,iBAAAC,IAAkB;AAAA,IAClB,YAAAC,IAAa;AAAA,IACb,aAAAC,IAAc;AAAA,IACd,eAAAC;AAAA,IACA,YAAAC,IAAa;AAAA,IACb,aAAAC,IAAc;AAAA,IACd,eAAAC;AAAA,IACA,sBAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,YAAAC,IAAa;AAAA,IACb,eAAeC;AAAA,IACf,sBAAAC,IAAuB;AAAA,IACvB,uBAAAC;AAAA,IACA,aAAAC;AAAA,IACA,eAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACDxB,GAEEyB,IAAUC,EAAA,GAEVC,IAAY/B,KAAS,QAAQA,MAAU,MAASA,MAAU,IAE1D,CAACgC,GAAsBC,CAAuB,IAClDC,EAAkCV,CAAoB,GAGlDW,IAAYJ,KAAaT,GACzBc,IAAqBD,KAAaZ,MAAsB,QAOxDc,KANkDF,IAEpDC,IACEb,IACAS,IAHF,gBAKyC,YAEvCM,IAAmB,CAACC,MAAkC;AAC1D,IAAKJ,MACAC,KACHH,EAAwBM,CAAI,GAE9Bd,KAAA,QAAAA,EAAwBc;AAAA,EAC1B,GAEMC,IAAiB,MAAM;AAC3B,IAAAF,EAAiBD,IAAa,cAAc,UAAU;AAAA,EACxD,GAEMI,IAAUC,EAAS,QAAQzC,CAAQ,EAAE,SAAS,GAC9C0C,IAAYzC,KAAU,MACtB0C,IAAaH,KAAWE,GAGxBE,IAAoBD,MAAe,CAACT,KAAaE,IAEjDS,IAAOL,IACX,gBAAAM,EAAC,OAAA,EAAI,WAAWC,EAAO,mBAAmB,GAAI,UAAA/C,EAAA,CAAS,IACrD,MAEEgD,IAAUL,IACdT,IACE,gBAAAY;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACTC,EAAO,uBAAuB;AAAA,QAC9BX,IAAaW,EAAO,iCAAiC,IAAI;AAAA,MAAA,EAExD,OAAO,OAAO,EACd,KAAK,GAAG;AAAA,MACX,eAAa,CAACX;AAAA,MACd,OAAO,CAACA;AAAA,MAER,UAAA,gBAAAa,EAAC,OAAA,EAAI,WAAWF,EAAO,6BAA6B,GACjD,UAAA;AAAA,QAAAF;AAAA,QACA5C;AAAA,MAAA,EAAA,CACH;AAAA,IAAA;AAAA,EAAA,IAGF,gBAAAgD,EAAAC,GAAA,EACG,UAAA;AAAA,IAAAL;AAAA,IACA5C;AAAA,EAAA,EAAA,CACH,IAEA;AAEJ,SACE,gBAAAgD;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAGtB;AAAA,MACJ,WAAW,CAACoB,EAAO,aAAa,GAAG7C,CAAS,EAAE,KAAK,GAAG,EAAE,KAAA;AAAA,MACxD,mBAAiB4B,IAAYF,IAAU;AAAA,MAEtC,UAAA;AAAA,QAAAE,IACC,gBAAAgB;AAAA,UAACK;AAAA,UAAA;AAAA,YACC,SAAAvB;AAAA,YACA,OAAA7B;AAAA,YACA,UAAAK;AAAA,YACA,eAAAC;AAAA,YACA,UAAAC;AAAA,YACA,aAAAC;AAAA,YACA,UAAAC;AAAA,YACA,WAAAC;AAAA,YACA,qBAAAC;AAAA,YACA,iBAAAC;AAAA,YACA,YAAAC;AAAA,YACA,aAAAC;AAAA,YACA,eAAAC;AAAA,YACA,YAAAC;AAAA,YACA,aAAAC;AAAA,YACA,eAAAC;AAAA,YACA,sBAAAC;AAAA,YACA,gBAAAC;AAAA,YACA,gBAAAC;AAAA,YACA,YAAYc;AAAA,YACZ,YAAAE;AAAA,YACA,gBAAgBG;AAAA,YAChB,aAAAd;AAAA,YACA,eAAAC;AAAA,YACA,aAAakB;AAAA,UAAA;AAAA,QAAA,IAEb;AAAA,QACHI;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGP;"}