@mattermost/compass-ui 0.1.0-alpha.0 → 0.1.0-alpha.2

package/README.md

@@ -19,15 +19,15 @@ import '@mattermost/compass-ui/styles';
 import '@mattermost/compass-ui/component-styles';
 ```
 
-Standalone hosts (Storybook, playground) also need document chrome:
+Standalone hosts (Storybook, playground) also need theme presets and document chrome:
 
 ```tsx
 import '@mattermost/compass-ui/styles/standalone';
 ```
 
-Do not load `/styles/standalone` into Mattermost webapp.
+Do not load `/styles/standalone` into Mattermost webapp (it already owns themes, reset, and document styles).
 
-Set a theme on `<html>`:
+Set a theme on `<html>` (standalone hosts):
 
 ```html
 <html data-theme="denim">
@@ -51,8 +51,8 @@ npm run storybook     # component catalog on :6006
 ## Package layout
 
 - `dist/index.js` / `dist/index.cjs` — component bundle (ESM + CJS)
-- `dist/compass-ui.css` — tokens, themes, and webapp-compat defaults (`./styles`)
-- `dist/compass-ui-standalone.css` — CSS reset + `body` / heading chrome for standalone hosts (`./styles/standalone`)
+- `dist/compass-ui.css` — tokens and webapp-compat defaults (`./styles`)
+- `dist/compass-ui-standalone.css` — theme presets + CSS reset + `body` / heading chrome for standalone hosts (`./styles/standalone`)
 - `dist/index.css` — component CSS modules (injected at build; also available as `./component-styles`)
 
 ## Storybook
@@ -76,7 +76,7 @@ npm run storybook --workspace=@mattermost/compass-ui
 
 ## Integration and releases
 
-- [INTEGRATION.md](./INTEGRATION.md) — Vite + webapp consumer setup
+- [INTEGRATION.md](./INTEGRATION.md) — Vite + webapp consumer setup, **release → CI publish** flow
 - [CHANGELOG.md](./CHANGELOG.md) — release history
 
 Validate a publishable tarball from the monorepo root:

package/dist/compass-ui-standalone.css

@@ -1,3 +1,210 @@
+:root,
+[data-theme=denim] {
+  --sidebar-bg: var(--color-indigo-500);
+  --sidebar-bg-rgb: var(--color-indigo-500-rgb);
+  --sidebar-header-bg: #192a4d;
+  --sidebar-header-bg-rgb: 25, 42, 77;
+  --sidebar-teambar-bg: #162545;
+  --sidebar-teambar-bg-rgb: 22, 37, 69;
+  --sidebar-text: var(--color-neutral-0);
+  --sidebar-text-rgb: var(--color-neutral-0-rgb);
+  --sidebar-text-hover-bg: var(--color-indigo-400);
+  --sidebar-text-hover-bg-rgb: var(--color-indigo-400-rgb);
+  --sidebar-text-active-border: var(--color-blue-300);
+  --sidebar-text-active-border-rgb: var(--color-blue-300-rgb);
+  --sidebar-text-active-color: var(--color-neutral-0);
+  --sidebar-unread-text: var(--color-neutral-0);
+  --sidebar-header-text-color: var(--color-neutral-0);
+  --center-channel-bg: var(--color-neutral-0);
+  --center-channel-bg-rgb: var(--color-neutral-0-rgb);
+  --center-channel-color: var(--color-neutral-900);
+  --center-channel-color-rgb: var(--color-neutral-900-rgb);
+  --button-bg: var(--color-blue-500);
+  --button-bg-rgb: var(--color-blue-500-rgb);
+  --button-color: var(--color-neutral-0);
+  --button-color-rgb: var(--color-neutral-0-rgb);
+  --link-color: var(--color-blue-600);
+  --link-color-rgb: var(--color-blue-600-rgb);
+  --error-text: var(--color-red-400);
+  --error-text-color-rgb: var(--color-red-400-rgb);
+  --mention-bg: var(--color-neutral-0);
+  --mention-bg-rgb: var(--color-neutral-0-rgb);
+  --mention-color: var(--color-indigo-500);
+  --mention-color-rgb: var(--color-indigo-500-rgb);
+  --mention-highlight-bg: var(--color-yellow-200);
+  --mention-highlight-link: var(--color-neutral-1100);
+  --new-message-separator: var(--color-yellow-600);
+  --online-indicator: var(--color-green-500);
+  --away-indicator: var(--color-yellow-500);
+  --dnd-indicator: var(--color-red-400);
+  --calls-bg: var(--color-indigo-600);
+  --calls-bg-rgb: var(--color-indigo-600-rgb);
+}
+
+[data-theme=sapphire] {
+  --sidebar-bg: #1543a3;
+  --sidebar-bg-rgb: 21, 67, 163;
+  --sidebar-header-bg: #123b91;
+  --sidebar-header-bg-rgb: 18, 59, 145;
+  --sidebar-teambar-bg: #123582;
+  --sidebar-teambar-bg-rgb: 18, 53, 130;
+  --sidebar-text: var(--color-neutral-0);
+  --sidebar-text-rgb: var(--color-neutral-0-rgb);
+  --sidebar-text-hover-bg: #2a58ba;
+  --sidebar-text-hover-bg-rgb: 42, 88, 186;
+  --sidebar-text-active-border: var(--color-cyan-300);
+  --sidebar-text-active-border-rgb: var(--color-cyan-300-rgb);
+  --sidebar-text-active-color: var(--color-neutral-0);
+  --sidebar-unread-text: var(--color-neutral-0);
+  --sidebar-header-text-color: var(--color-neutral-0);
+  --center-channel-bg: var(--color-neutral-0);
+  --center-channel-bg-rgb: var(--color-neutral-0-rgb);
+  --center-channel-color: var(--color-neutral-900);
+  --center-channel-color-rgb: var(--color-neutral-900-rgb);
+  --button-bg: var(--color-blue-500);
+  --button-bg-rgb: var(--color-blue-500-rgb);
+  --button-color: var(--color-neutral-0);
+  --link-color: var(--color-blue-600);
+  --link-color-rgb: var(--color-blue-600-rgb);
+  --error-text: var(--color-red-300);
+  --error-text-color-rgb: var(--color-red-300-rgb);
+  --mention-bg: var(--color-neutral-0);
+  --mention-bg-rgb: var(--color-neutral-0-rgb);
+  --mention-color: #1543a3;
+  --mention-color-rgb: 21, 67, 163;
+  --mention-highlight-bg: var(--color-teal-200);
+  --mention-highlight-link: var(--color-teal-800);
+  --new-message-separator: var(--color-yellow-400);
+  --online-indicator: var(--color-green-500);
+  --away-indicator: var(--color-yellow-500);
+  --dnd-indicator: var(--color-red-400);
+  --calls-bg: #091d48;
+  --calls-bg-rgb: 9, 29, 72;
+}
+
+[data-theme=quartz] {
+  --sidebar-bg: var(--color-neutral-50);
+  --sidebar-bg-rgb: var(--color-neutral-50-rgb);
+  --sidebar-header-bg: #ebecef;
+  --sidebar-header-bg-rgb: 235, 236, 239;
+  --sidebar-teambar-bg: #e5e7eb;
+  --sidebar-teambar-bg-rgb: 229, 231, 235;
+  --sidebar-text: var(--color-neutral-1100);
+  --sidebar-text-rgb: var(--color-neutral-1100-rgb);
+  --sidebar-text-hover-bg: #e8eaed;
+  --sidebar-text-hover-bg-rgb: 232, 234, 237;
+  --sidebar-text-active-border: var(--color-cyan-500);
+  --sidebar-text-active-border-rgb: var(--color-cyan-500-rgb);
+  --sidebar-text-active-color: var(--color-neutral-1100);
+  --sidebar-unread-text: var(--color-neutral-1100);
+  --sidebar-header-text-color: var(--color-neutral-1100);
+  --center-channel-bg: var(--color-neutral-0);
+  --center-channel-bg-rgb: var(--color-neutral-0-rgb);
+  --center-channel-color: var(--color-neutral-900);
+  --center-channel-color-rgb: var(--color-neutral-900-rgb);
+  --button-bg: var(--color-blue-500);
+  --button-bg-rgb: var(--color-blue-500-rgb);
+  --button-color: var(--color-neutral-0);
+  --link-color: var(--color-blue-600);
+  --link-color-rgb: var(--color-blue-600-rgb);
+  --error-text: var(--color-red-400);
+  --error-text-color-rgb: var(--color-red-400-rgb);
+  --mention-bg: var(--color-blue-500);
+  --mention-bg-rgb: var(--color-blue-500-rgb);
+  --mention-color: var(--color-neutral-0);
+  --mention-color-rgb: var(--color-neutral-0-rgb);
+  --mention-highlight-bg: var(--color-teal-200);
+  --mention-highlight-link: var(--color-teal-800);
+  --new-message-separator: var(--color-teal-600);
+  --online-indicator: var(--color-green-500);
+  --away-indicator: var(--color-yellow-500);
+  --dnd-indicator: var(--color-red-400);
+  --calls-bg: var(--color-neutral-1050);
+  --calls-bg-rgb: var(--color-neutral-1050-rgb);
+}
+
+[data-theme=indigo] {
+  --sidebar-bg: #151e32;
+  --sidebar-bg-rgb: 21, 30, 50;
+  --sidebar-header-bg: #182339;
+  --sidebar-header-bg-rgb: 24, 35, 57;
+  --sidebar-teambar-bg: #1c2740;
+  --sidebar-teambar-bg-rgb: 28, 39, 64;
+  --sidebar-text: var(--color-neutral-0);
+  --sidebar-text-rgb: var(--color-neutral-0-rgb);
+  --sidebar-text-hover-bg: #222c3f;
+  --sidebar-text-hover-bg-rgb: 34, 44, 63;
+  --sidebar-text-active-border: #4a7ce8;
+  --sidebar-text-active-border-rgb: 74, 124, 232;
+  --sidebar-text-active-color: var(--color-neutral-0);
+  --sidebar-unread-text: var(--color-neutral-0);
+  --sidebar-header-text-color: var(--color-neutral-0);
+  --center-channel-bg: #111827;
+  --center-channel-bg-rgb: 17, 24, 39;
+  --center-channel-color: var(--color-neutral-150);
+  --center-channel-color-rgb: var(--color-neutral-150-rgb);
+  --button-bg: #4a7ce8;
+  --button-bg-rgb: 74, 124, 232;
+  --button-color: var(--color-neutral-0);
+  --link-color: var(--color-blue-300);
+  --link-color-rgb: var(--color-blue-300-rgb);
+  --error-text: var(--color-red-300);
+  --error-text-color-rgb: var(--color-red-300-rgb);
+  --mention-bg: #4a7ce8;
+  --mention-bg-rgb: 74, 124, 232;
+  --mention-color: var(--color-neutral-0);
+  --mention-color-rgb: var(--color-neutral-0-rgb);
+  --mention-highlight-bg: var(--color-blue-700);
+  --mention-highlight-link: var(--color-teal-100);
+  --new-message-separator: var(--color-yellow-400);
+  --online-indicator: var(--color-green-500);
+  --away-indicator: var(--color-yellow-500);
+  --dnd-indicator: var(--color-red-400);
+  --calls-bg: #222c3f;
+  --calls-bg-rgb: 34, 44, 63;
+}
+
+[data-theme=onyx] {
+  --sidebar-bg: #202228;
+  --sidebar-bg-rgb: 32, 34, 40;
+  --sidebar-header-bg: #24272d;
+  --sidebar-header-bg-rgb: 36, 39, 45;
+  --sidebar-teambar-bg: #292c33;
+  --sidebar-teambar-bg-rgb: 41, 44, 51;
+  --sidebar-text: var(--color-neutral-0);
+  --sidebar-text-rgb: var(--color-neutral-0-rgb);
+  --sidebar-text-hover-bg: #25262a;
+  --sidebar-text-hover-bg-rgb: 37, 38, 42;
+  --sidebar-text-active-border: #4a7ce8;
+  --sidebar-text-active-border-rgb: 74, 124, 232;
+  --sidebar-text-active-color: var(--color-neutral-0);
+  --sidebar-unread-text: var(--color-neutral-0);
+  --sidebar-header-text-color: var(--color-neutral-0);
+  --center-channel-bg: #191b1f;
+  --center-channel-bg-rgb: 25, 27, 31;
+  --center-channel-color: var(--color-neutral-150);
+  --center-channel-color-rgb: var(--color-neutral-150-rgb);
+  --button-bg: #4a7ce8;
+  --button-bg-rgb: 74, 124, 232;
+  --button-color: var(--color-neutral-0);
+  --link-color: var(--color-blue-300);
+  --link-color-rgb: var(--color-blue-300-rgb);
+  --error-text: var(--color-red-300);
+  --error-text-color-rgb: var(--color-red-300-rgb);
+  --mention-bg: #4a7ce8;
+  --mention-bg-rgb: 74, 124, 232;
+  --mention-color: var(--color-neutral-0);
+  --mention-color-rgb: var(--color-neutral-0-rgb);
+  --mention-highlight-bg: var(--color-teal-800);
+  --mention-highlight-link: var(--color-teal-100);
+  --new-message-separator: var(--color-yellow-400);
+  --online-indicator: var(--color-green-500);
+  --away-indicator: var(--color-yellow-500);
+  --dnd-indicator: var(--color-red-400);
+  --calls-bg: #24262d;
+  --calls-bg-rgb: 36, 38, 45;
+}
+
 *,
 *::before,
 *::after {

package/dist/compass-ui.css

@@ -300,209 +300,3 @@
     --semantic-color-danger: var(--color-red-500-rgb);
   }
 }
-:root,
-[data-theme=denim] {
-  --sidebar-bg: var(--color-indigo-500);
-  --sidebar-bg-rgb: var(--color-indigo-500-rgb);
-  --sidebar-header-bg: #192a4d;
-  --sidebar-header-bg-rgb: 25, 42, 77;
-  --sidebar-teambar-bg: #162545;
-  --sidebar-teambar-bg-rgb: 22, 37, 69;
-  --sidebar-text: var(--color-neutral-0);
-  --sidebar-text-rgb: var(--color-neutral-0-rgb);
-  --sidebar-text-hover-bg: var(--color-indigo-400);
-  --sidebar-text-hover-bg-rgb: var(--color-indigo-400-rgb);
-  --sidebar-text-active-border: var(--color-blue-300);
-  --sidebar-text-active-border-rgb: var(--color-blue-300-rgb);
-  --sidebar-text-active-color: var(--color-neutral-0);
-  --sidebar-unread-text: var(--color-neutral-0);
-  --sidebar-header-text-color: var(--color-neutral-0);
-  --center-channel-bg: var(--color-neutral-0);
-  --center-channel-bg-rgb: var(--color-neutral-0-rgb);
-  --center-channel-color: var(--color-neutral-900);
-  --center-channel-color-rgb: var(--color-neutral-900-rgb);
-  --button-bg: var(--color-blue-500);
-  --button-bg-rgb: var(--color-blue-500-rgb);
-  --button-color: var(--color-neutral-0);
-  --button-color-rgb: var(--color-neutral-0-rgb);
-  --link-color: var(--color-blue-600);
-  --link-color-rgb: var(--color-blue-600-rgb);
-  --error-text: var(--color-red-400);
-  --error-text-color-rgb: var(--color-red-400-rgb);
-  --mention-bg: var(--color-neutral-0);
-  --mention-bg-rgb: var(--color-neutral-0-rgb);
-  --mention-color: var(--color-indigo-500);
-  --mention-color-rgb: var(--color-indigo-500-rgb);
-  --mention-highlight-bg: var(--color-yellow-200);
-  --mention-highlight-link: var(--color-neutral-1100);
-  --new-message-separator: var(--color-yellow-600);
-  --online-indicator: var(--color-green-500);
-  --away-indicator: var(--color-yellow-500);
-  --dnd-indicator: var(--color-red-400);
-  --calls-bg: var(--color-indigo-600);
-  --calls-bg-rgb: var(--color-indigo-600-rgb);
-}
-
-[data-theme=sapphire] {
-  --sidebar-bg: #1543a3;
-  --sidebar-bg-rgb: 21, 67, 163;
-  --sidebar-header-bg: #123b91;
-  --sidebar-header-bg-rgb: 18, 59, 145;
-  --sidebar-teambar-bg: #123582;
-  --sidebar-teambar-bg-rgb: 18, 53, 130;
-  --sidebar-text: var(--color-neutral-0);
-  --sidebar-text-rgb: var(--color-neutral-0-rgb);
-  --sidebar-text-hover-bg: #2a58ba;
-  --sidebar-text-hover-bg-rgb: 42, 88, 186;
-  --sidebar-text-active-border: var(--color-cyan-300);
-  --sidebar-text-active-border-rgb: var(--color-cyan-300-rgb);
-  --sidebar-text-active-color: var(--color-neutral-0);
-  --sidebar-unread-text: var(--color-neutral-0);
-  --sidebar-header-text-color: var(--color-neutral-0);
-  --center-channel-bg: var(--color-neutral-0);
-  --center-channel-bg-rgb: var(--color-neutral-0-rgb);
-  --center-channel-color: var(--color-neutral-900);
-  --center-channel-color-rgb: var(--color-neutral-900-rgb);
-  --button-bg: var(--color-blue-500);
-  --button-bg-rgb: var(--color-blue-500-rgb);
-  --button-color: var(--color-neutral-0);
-  --link-color: var(--color-blue-600);
-  --link-color-rgb: var(--color-blue-600-rgb);
-  --error-text: var(--color-red-300);
-  --error-text-color-rgb: var(--color-red-300-rgb);
-  --mention-bg: var(--color-neutral-0);
-  --mention-bg-rgb: var(--color-neutral-0-rgb);
-  --mention-color: #1543a3;
-  --mention-color-rgb: 21, 67, 163;
-  --mention-highlight-bg: var(--color-teal-200);
-  --mention-highlight-link: var(--color-teal-800);
-  --new-message-separator: var(--color-yellow-400);
-  --online-indicator: var(--color-green-500);
-  --away-indicator: var(--color-yellow-500);
-  --dnd-indicator: var(--color-red-400);
-  --calls-bg: #091d48;
-  --calls-bg-rgb: 9, 29, 72;
-}
-
-[data-theme=quartz] {
-  --sidebar-bg: var(--color-neutral-50);
-  --sidebar-bg-rgb: var(--color-neutral-50-rgb);
-  --sidebar-header-bg: #ebecef;
-  --sidebar-header-bg-rgb: 235, 236, 239;
-  --sidebar-teambar-bg: #e5e7eb;
-  --sidebar-teambar-bg-rgb: 229, 231, 235;
-  --sidebar-text: var(--color-neutral-1100);
-  --sidebar-text-rgb: var(--color-neutral-1100-rgb);
-  --sidebar-text-hover-bg: #e8eaed;
-  --sidebar-text-hover-bg-rgb: 232, 234, 237;
-  --sidebar-text-active-border: var(--color-cyan-500);
-  --sidebar-text-active-border-rgb: var(--color-cyan-500-rgb);
-  --sidebar-text-active-color: var(--color-neutral-1100);
-  --sidebar-unread-text: var(--color-neutral-1100);
-  --sidebar-header-text-color: var(--color-neutral-1100);
-  --center-channel-bg: var(--color-neutral-0);
-  --center-channel-bg-rgb: var(--color-neutral-0-rgb);
-  --center-channel-color: var(--color-neutral-900);
-  --center-channel-color-rgb: var(--color-neutral-900-rgb);
-  --button-bg: var(--color-blue-500);
-  --button-bg-rgb: var(--color-blue-500-rgb);
-  --button-color: var(--color-neutral-0);
-  --link-color: var(--color-blue-600);
-  --link-color-rgb: var(--color-blue-600-rgb);
-  --error-text: var(--color-red-400);
-  --error-text-color-rgb: var(--color-red-400-rgb);
-  --mention-bg: var(--color-blue-500);
-  --mention-bg-rgb: var(--color-blue-500-rgb);
-  --mention-color: var(--color-neutral-0);
-  --mention-color-rgb: var(--color-neutral-0-rgb);
-  --mention-highlight-bg: var(--color-teal-200);
-  --mention-highlight-link: var(--color-teal-800);
-  --new-message-separator: var(--color-teal-600);
-  --online-indicator: var(--color-green-500);
-  --away-indicator: var(--color-yellow-500);
-  --dnd-indicator: var(--color-red-400);
-  --calls-bg: var(--color-neutral-1050);
-  --calls-bg-rgb: var(--color-neutral-1050-rgb);
-}
-
-[data-theme=indigo] {
-  --sidebar-bg: #151e32;
-  --sidebar-bg-rgb: 21, 30, 50;
-  --sidebar-header-bg: #182339;
-  --sidebar-header-bg-rgb: 24, 35, 57;
-  --sidebar-teambar-bg: #1c2740;
-  --sidebar-teambar-bg-rgb: 28, 39, 64;
-  --sidebar-text: var(--color-neutral-0);
-  --sidebar-text-rgb: var(--color-neutral-0-rgb);
-  --sidebar-text-hover-bg: #222c3f;
-  --sidebar-text-hover-bg-rgb: 34, 44, 63;
-  --sidebar-text-active-border: #4a7ce8;
-  --sidebar-text-active-border-rgb: 74, 124, 232;
-  --sidebar-text-active-color: var(--color-neutral-0);
-  --sidebar-unread-text: var(--color-neutral-0);
-  --sidebar-header-text-color: var(--color-neutral-0);
-  --center-channel-bg: #111827;
-  --center-channel-bg-rgb: 17, 24, 39;
-  --center-channel-color: var(--color-neutral-150);
-  --center-channel-color-rgb: var(--color-neutral-150-rgb);
-  --button-bg: #4a7ce8;
-  --button-bg-rgb: 74, 124, 232;
-  --button-color: var(--color-neutral-0);
-  --link-color: var(--color-blue-300);
-  --link-color-rgb: var(--color-blue-300-rgb);
-  --error-text: var(--color-red-300);
-  --error-text-color-rgb: var(--color-red-300-rgb);
-  --mention-bg: #4a7ce8;
-  --mention-bg-rgb: 74, 124, 232;
-  --mention-color: var(--color-neutral-0);
-  --mention-color-rgb: var(--color-neutral-0-rgb);
-  --mention-highlight-bg: var(--color-blue-700);
-  --mention-highlight-link: var(--color-teal-100);
-  --new-message-separator: var(--color-yellow-400);
-  --online-indicator: var(--color-green-500);
-  --away-indicator: var(--color-yellow-500);
-  --dnd-indicator: var(--color-red-400);
-  --calls-bg: #222c3f;
-  --calls-bg-rgb: 34, 44, 63;
-}
-
-[data-theme=onyx] {
-  --sidebar-bg: #202228;
-  --sidebar-bg-rgb: 32, 34, 40;
-  --sidebar-header-bg: #24272d;
-  --sidebar-header-bg-rgb: 36, 39, 45;
-  --sidebar-teambar-bg: #292c33;
-  --sidebar-teambar-bg-rgb: 41, 44, 51;
-  --sidebar-text: var(--color-neutral-0);
-  --sidebar-text-rgb: var(--color-neutral-0-rgb);
-  --sidebar-text-hover-bg: #25262a;
-  --sidebar-text-hover-bg-rgb: 37, 38, 42;
-  --sidebar-text-active-border: #4a7ce8;
-  --sidebar-text-active-border-rgb: 74, 124, 232;
-  --sidebar-text-active-color: var(--color-neutral-0);
-  --sidebar-unread-text: var(--color-neutral-0);
-  --sidebar-header-text-color: var(--color-neutral-0);
-  --center-channel-bg: #191b1f;
-  --center-channel-bg-rgb: 25, 27, 31;
-  --center-channel-color: var(--color-neutral-150);
-  --center-channel-color-rgb: var(--color-neutral-150-rgb);
-  --button-bg: #4a7ce8;
-  --button-bg-rgb: 74, 124, 232;
-  --button-color: var(--color-neutral-0);
-  --link-color: var(--color-blue-300);
-  --link-color-rgb: var(--color-blue-300-rgb);
-  --error-text: var(--color-red-300);
-  --error-text-color-rgb: var(--color-red-300-rgb);
-  --mention-bg: #4a7ce8;
-  --mention-bg-rgb: 74, 124, 232;
-  --mention-color: var(--color-neutral-0);
-  --mention-color-rgb: var(--color-neutral-0-rgb);
-  --mention-highlight-bg: var(--color-teal-800);
-  --mention-highlight-link: var(--color-teal-100);
-  --new-message-separator: var(--color-yellow-400);
-  --online-indicator: var(--color-green-500);
-  --away-indicator: var(--color-yellow-500);
-  --dnd-indicator: var(--color-red-400);
-  --calls-bg: #24262d;
-  --calls-bg-rgb: 36, 38, 45;
-}

package/dist/components/ActionButton/ActionButton.d.ts

@@ -5,5 +5,10 @@ export interface ActionButtonProps extends ButtonHTMLAttributes<HTMLButtonElemen
     active?: boolean;
     destructive?: boolean;
 }
+/**
+ * Action Buttons surface a small set of high-frequency actions in a fixed context — a
+ * profile popover, a channel info panel, a card. They sit close to the content they act on
+ * and read as a row of equal-weight choices.
+ */
 export default function ActionButton({ icon, label, active, destructive, className, ...htmlProps }: ActionButtonProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=ActionButton.d.ts.map

package/dist/components/ActionButton/ActionButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ActionButton.d.ts","sourceRoot":"","sources":["../../../src/components/ActionButton/ActionButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAG7D,MAAM,WAAW,iBAAkB,SAAQ,oBAAoB,CAAC,iBAAiB,CAAC;IAChF,IAAI,EAAE,SAAS,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EACnC,IAAI,EACJ,KAAK,EACL,MAAc,EACd,WAAmB,EACnB,SAAS,EACT,GAAG,SAAS,EACb,EAAE,iBAAiB,2CAgBnB"}
+{"version":3,"file":"ActionButton.d.ts","sourceRoot":"","sources":["../../../src/components/ActionButton/ActionButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAG7D,MAAM,WAAW,iBAAkB,SAAQ,oBAAoB,CAAC,iBAAiB,CAAC;IAChF,IAAI,EAAE,SAAS,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED;;;;GAIG;AACH,MAAM,CAAC,OAAO,UAAU,YAAY,CAAC,EACnC,IAAI,EACJ,KAAK,EACL,MAAc,EACd,WAAmB,EACnB,SAAS,EACT,GAAG,SAAS,EACb,EAAE,iBAAiB,2CAgBnB"}

package/dist/components/AdminConsoleHeader/AdminConsoleHeader.d.ts

@@ -14,7 +14,9 @@ export interface AdminConsoleHeaderProps {
     className?: string;
 }
 /**
- * Strip header for System Console content: title, optional enterprise tag, optional back affordance.
+ * The Admin Console header is the stripe above scrolling System Console content. It anchors
+ * the active page title, optional edition signalling, navigation back into nested settings,
+ * and sparse trailing utilities.
  */
 export default function AdminConsoleHeader({ title, showBack, ariaLabelBack, onBackClick, enterpriseBadge, enterpriseBadgeLabel, trailing, className, }: AdminConsoleHeaderProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=AdminConsoleHeader.d.ts.map

package/dist/components/AdminConsoleHeader/AdminConsoleHeader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AdminConsoleHeader.d.ts","sourceRoot":"","sources":["../../../src/components/AdminConsoleHeader/AdminConsoleHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAQvC,MAAM,WAAW,uBAAuB;IACtC,kCAAkC;IAClC,KAAK,EAAE,SAAS,CAAC;IACjB,2EAA2E;IAC3E,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,qDAAqD;IACrD,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,8DAA8D;IAC9D,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;GAEG;AACH,MAAM,CAAC,OAAO,UAAU,kBAAkB,CAAC,EACzC,KAAK,EACL,QAAgB,EAChB,aAAyB,EACzB,WAAW,EACX,eAAuB,EACvB,oBAAmC,EACnC,QAAQ,EACR,SAAc,GACf,EAAE,uBAAuB,2CA0CzB"}
+{"version":3,"file":"AdminConsoleHeader.d.ts","sourceRoot":"","sources":["../../../src/components/AdminConsoleHeader/AdminConsoleHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAQvC,MAAM,WAAW,uBAAuB;IACtC,kCAAkC;IAClC,KAAK,EAAE,SAAS,CAAC;IACjB,2EAA2E;IAC3E,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,qDAAqD;IACrD,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,8DAA8D;IAC9D,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;GAIG;AACH,MAAM,CAAC,OAAO,UAAU,kBAAkB,CAAC,EACzC,KAAK,EACL,QAAgB,EAChB,aAAyB,EACzB,WAAW,EACX,eAAuB,EACvB,oBAAmC,EACnC,QAAQ,EACR,SAAc,GACf,EAAE,uBAAuB,2CA0CzB"}

package/dist/components/AdminPanelFooter/AdminPanelFooter.d.ts

@@ -14,5 +14,10 @@ export interface AdminPanelFooterProps {
     statusMessage?: ReactNode;
     className?: string;
 }
+/**
+ * Admin Panel Footer pins Save and Cancel to the bottom of System Console form layouts. It
+ * mirrors channel composer discipline: one primary commit path, a safe escape hatch, and
+ * optional validation status without stealing focus from the draft.
+ */
 export default function AdminPanelFooter({ saveLabel, cancelLabel, onSave, onCancel, saveDisabled, status, statusMessage, className, }: AdminPanelFooterProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=AdminPanelFooter.d.ts.map

package/dist/components/AdminPanelFooter/AdminPanelFooter.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AdminPanelFooter.d.ts","sourceRoot":"","sources":["../../../src/components/AdminPanelFooter/AdminPanelFooter.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAMvC,MAAM,MAAM,sBAAsB,GAAG,MAAM,GAAG,SAAS,GAAG,OAAO,CAAC;AAElE,MAAM,WAAW,qBAAqB;IACpC,mCAAmC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,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,sBAAsB,CAAC;IAChC,sDAAsD;IACtD,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAKD,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EACvC,SAAkB,EAClB,WAAsB,EACtB,MAAM,EACN,QAAQ,EACR,YAAmB,EACnB,MAAe,EACf,aAAa,EACb,SAAc,GACf,EAAE,qBAAqB,2CAyEvB"}
+{"version":3,"file":"AdminPanelFooter.d.ts","sourceRoot":"","sources":["../../../src/components/AdminPanelFooter/AdminPanelFooter.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAMvC,MAAM,MAAM,sBAAsB,GAAG,MAAM,GAAG,SAAS,GAAG,OAAO,CAAC;AAElE,MAAM,WAAW,qBAAqB;IACpC,mCAAmC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,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,sBAAsB,CAAC;IAChC,sDAAsD;IACtD,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAKD;;;;GAIG;AACH,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EACvC,SAAkB,EAClB,WAAsB,EACtB,MAAM,EACN,QAAQ,EACR,YAAmB,EACnB,MAAe,EACf,aAAa,EACb,SAAc,GACf,EAAE,qBAAqB,2CAyEvB"}

package/dist/components/AdminPanelHeader/AdminPanelHeader.d.ts

@@ -1,6 +1,6 @@
 import { ChangeEvent, ReactNode } from 'react';
 /** System Console admin panel expand/collapse (`expandedState` in Figma). */
-export type AdminPanelExpandedState = 'Collapsed' | 'Expanded';
+export type AdminPanelExpandedState = 'collapsed' | 'expanded';
 export interface AdminPanelHeaderProps {
     /** Passed to the title `h2` for `aria-labelledby` on the parent panel. */
     titleId: string;
@@ -31,8 +31,10 @@ export interface AdminPanelHeaderProps {
     className?: string;
 }
 /**
- * Titled rail for a System Console settings section: optional leading icon, tags,
- * subtitle, and trailing controls.
+ * Admin Panel Header is the titled rail for a System Console settings section: optional
+ * leading icon, title with optional tags, subtitle, and trailing controls. It is composed
+ * inside the [`Admin Panel`](/patterns/admin-panel) pattern; it can also be documented on
+ * its own when adjusting header anatomy or behaviour.
  */
 export default function AdminPanelHeader({ titleId, title, subtitle, headerActions, iconLeft, leadingIcon, showBeta, betaLabel, showEnterpriseLabel, enterpriseLabel, showButton, buttonLabel, onButtonClick, showSwitch, switchLabel, switchChecked, defaultSwitchChecked, onSwitchChange, switchDisabled, expandable, isExpanded, onToggleExpand, showDivider, className, }: AdminPanelHeaderProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=AdminPanelHeader.d.ts.map

package/dist/components/AdminPanelHeader/AdminPanelHeader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AdminPanelHeader.d.ts","sourceRoot":"","sources":["../../../src/components/AdminPanelHeader/AdminPanelHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,WAAW,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAYzD,6EAA6E;AAC7E,MAAM,MAAM,uBAAuB,GAAG,WAAW,GAAG,UAAU,CAAC;AAE/D,MAAM,WAAW,qBAAqB;IACpC,0EAA0E;IAC1E,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,SAAS,CAAC;IACjB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,2FAA2F;IAC3F,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,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,CAAC,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAClF,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,iFAAiF;IACjF,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;GAGG;AACH,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EACvC,OAAO,EACP,KAAK,EACL,QAAQ,EACR,aAAa,EACb,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,UAAkB,EAClB,cAAc,EACd,WAAkB,EAClB,SAAc,GACf,EAAE,qBAAqB,2CAqGvB"}
+{"version":3,"file":"AdminPanelHeader.d.ts","sourceRoot":"","sources":["../../../src/components/AdminPanelHeader/AdminPanelHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,WAAW,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAYzD,6EAA6E;AAC7E,MAAM,MAAM,uBAAuB,GAAG,WAAW,GAAG,UAAU,CAAC;AAE/D,MAAM,WAAW,qBAAqB;IACpC,0EAA0E;IAC1E,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,EAAE,SAAS,CAAC;IACjB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,2FAA2F;IAC3F,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,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,CAAC,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,WAAW,CAAC,gBAAgB,CAAC,KAAK,IAAI,CAAC;IAClF,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,iFAAiF;IACjF,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;GAKG;AACH,MAAM,CAAC,OAAO,UAAU,gBAAgB,CAAC,EACvC,OAAO,EACP,KAAK,EACL,QAAQ,EACR,aAAa,EACb,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,UAAkB,EAClB,cAAc,EACd,WAAkB,EAClB,SAAc,GACf,EAAE,qBAAqB,2CAqGvB"}

package/dist/components/AppBarItem/AppBarItem.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-export type AppBarItemState = 'Default' | 'Selected';
+export type AppBarItemState = 'default' | 'selected';
 export interface AppBarItemProps {
     /** Icon element (image or SVG) representing the app. */
     icon: ReactNode;
@@ -17,8 +17,9 @@ export interface AppBarItemProps {
     className?: string;
 }
 /**
- * App Bar Item component matching Figma design.
- * Circular app icon for the right-side app bar with optional selection indicator and badges.
+ * The App Bar Item is a circular icon that anchors a third-party app or plugin in the
+ * right-side App Bar. Each item is a single tap-target with optional selection styling and
+ * notification badges.
  */
 export default function AppBarItem({ icon, label, state, mentionBadge, unreadBadge, onClick, className, }: AppBarItemProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=AppBarItem.d.ts.map

package/dist/components/AppBarItem/AppBarItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AppBarItem.d.ts","sourceRoot":"","sources":["../../../src/components/AppBarItem/AppBarItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,MAAM,MAAM,eAAe,GAAG,SAAS,GAAG,UAAU,CAAC;AAErD,MAAM,WAAW,eAAe;IAC9B,wDAAwD;IACxD,IAAI,EAAE,SAAS,CAAC;IAChB,yCAAyC;IACzC,KAAK,EAAE,MAAM,CAAC;IACd,2CAA2C;IAC3C,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB,8CAA8C;IAC9C,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,4CAA4C;IAC5C,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,qBAAqB;IACrB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,+BAA+B;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;GAGG;AACH,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EACjC,IAAI,EACJ,KAAK,EACL,KAAiB,EACjB,YAAY,EACZ,WAAmB,EACnB,OAAO,EACP,SAAc,GACf,EAAE,eAAe,2CAsCjB"}
+{"version":3,"file":"AppBarItem.d.ts","sourceRoot":"","sources":["../../../src/components/AppBarItem/AppBarItem.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,MAAM,MAAM,eAAe,GAAG,SAAS,GAAG,UAAU,CAAC;AAErD,MAAM,WAAW,eAAe;IAC9B,wDAAwD;IACxD,IAAI,EAAE,SAAS,CAAC;IAChB,yCAAyC;IACzC,KAAK,EAAE,MAAM,CAAC;IACd,2CAA2C;IAC3C,KAAK,CAAC,EAAE,eAAe,CAAC;IACxB,8CAA8C;IAC9C,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,4CAA4C;IAC5C,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,qBAAqB;IACrB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,+BAA+B;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;GAIG;AACH,MAAM,CAAC,OAAO,UAAU,UAAU,CAAC,EACjC,IAAI,EACJ,KAAK,EACL,KAAiB,EACjB,YAAY,EACZ,WAAmB,EACnB,OAAO,EACP,SAAc,GACf,EAAE,eAAe,2CAsCjB"}

package/dist/components/AttachmentCard/AttachmentCard.d.ts

@@ -25,5 +25,10 @@ export interface AttachmentCardProps {
     /** Called when the more-options button is clicked (visible on hover in default state). */
     onMore?: () => void;
 }
+/**
+ * Attachment Cards represent a file shared in a channel, message, or task. Each card shows
+ * the file's identity at a glance — type, name, size — and hosts the actions a viewer can
+ * take on it.
+ */
 export default function AttachmentCard({ className, fileName, fileMeta, fileType, state, progress, thumbnailSrc, channelTag, dateTimeStamp, onRemove, onDownload, onMore, }: AttachmentCardProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=AttachmentCard.d.ts.map

package/dist/components/AttachmentCard/AttachmentCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AttachmentCard.d.ts","sourceRoot":"","sources":["../../../src/components/AttachmentCard/AttachmentCard.tsx"],"names":[],"mappings":"AAqBA,MAAM,MAAM,sBAAsB,GAC9B,MAAM,GACN,MAAM,GACN,OAAO,GACP,YAAY,GACZ,KAAK,GACL,YAAY,GACZ,iBAAiB,GACjB,OAAO,GACP,OAAO,GACP,SAAS,GACT,OAAO,GACP,KAAK,GACL,MAAM,CAAC;AAEX,MAAM,MAAM,mBAAmB,GAAG,SAAS,GAAG,WAAW,GAAG,UAAU,CAAC;AAEvE,MAAM,WAAW,mBAAmB;IAClC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,4BAA4B;IAC5B,QAAQ,EAAE,MAAM,CAAC;IACjB,yEAAyE;IACzE,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,+DAA+D;IAC/D,QAAQ,CAAC,EAAE,sBAAsB,CAAC;IAClC,yDAAyD;IACzD,KAAK,CAAC,EAAE,mBAAmB,CAAC;IAC5B,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,iEAAiE;IACjE,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,6EAA6E;IAC7E,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,uDAAuD;IACvD,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,sFAAsF;IACtF,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,0FAA0F;IAC1F,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;CACrB;AAwCD,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACrC,SAAc,EACd,QAAQ,EACR,QAAQ,EACR,QAAoB,EACpB,KAAiB,EACjB,QAAY,EACZ,YAAY,EACZ,UAAU,EACV,aAAa,EACb,QAAQ,EACR,UAAU,EACV,MAAM,GACP,EAAE,mBAAmB,2CA4GrB"}
+{"version":3,"file":"AttachmentCard.d.ts","sourceRoot":"","sources":["../../../src/components/AttachmentCard/AttachmentCard.tsx"],"names":[],"mappings":"AAqBA,MAAM,MAAM,sBAAsB,GAC9B,MAAM,GACN,MAAM,GACN,OAAO,GACP,YAAY,GACZ,KAAK,GACL,YAAY,GACZ,iBAAiB,GACjB,OAAO,GACP,OAAO,GACP,SAAS,GACT,OAAO,GACP,KAAK,GACL,MAAM,CAAC;AAEX,MAAM,MAAM,mBAAmB,GAAG,SAAS,GAAG,WAAW,GAAG,UAAU,CAAC;AAEvE,MAAM,WAAW,mBAAmB;IAClC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,4BAA4B;IAC5B,QAAQ,EAAE,MAAM,CAAC;IACjB,yEAAyE;IACzE,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,+DAA+D;IAC/D,QAAQ,CAAC,EAAE,sBAAsB,CAAC;IAClC,yDAAyD;IACzD,KAAK,CAAC,EAAE,mBAAmB,CAAC;IAC5B,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,iEAAiE;IACjE,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,6EAA6E;IAC7E,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,uDAAuD;IACvD,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,sFAAsF;IACtF,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,0FAA0F;IAC1F,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;CACrB;AAwCD;;;;GAIG;AACH,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,EACrC,SAAc,EACd,QAAQ,EACR,QAAQ,EACR,QAAoB,EACpB,KAAiB,EACjB,QAAY,EACZ,YAAY,EACZ,UAAU,EACV,aAAa,EACb,QAAQ,EACR,UAAU,EACV,MAAM,GACP,EAAE,mBAAmB,2CA4GrB"}

package/dist/components/Button/Button.d.ts

@@ -1,9 +1,9 @@
 import { ButtonHTMLAttributes, ReactNode } from 'react';
-export type ButtonEmphasis = 'Primary' | 'Secondary' | 'Tertiary' | 'Quaternary';
-export type ButtonSize = 'X-Small' | 'Small' | 'Medium' | 'Large';
-export type ButtonAppearance = 'Default' | 'Inverted';
+export type ButtonEmphasis = 'primary' | 'secondary' | 'tertiary' | 'quaternary';
+export type ButtonSize = 'x-small' | 'small' | 'medium' | 'large';
+export type ButtonAppearance = 'default' | 'inverted';
 export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
-    /** Default | Inverted (for use on dark backgrounds). Maps to Figma "Style". */
+    /** default | inverted (for use on dark backgrounds). Maps to Figma "Style". */
     appearance?: ButtonAppearance;
     /** Optional CSS class name. */
     className?: string;
@@ -11,20 +11,19 @@ export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
     children: React.ReactNode;
     /** When true, uses destructive (danger) styling. */
     destructive?: boolean;
-    /** Visual emphasis. Default: Primary. */
+    /** Visual emphasis. Default: primary. */
     emphasis?: ButtonEmphasis;
     /** Leading icon (e.g. <Icon glyph={<SomeIcon />} size="16" />). Icon size should match button size. */
     leadingIcon?: ReactNode;
-    /** Size variant. Default: Medium. */
+    /** Size variant. Default: medium. */
     size?: ButtonSize;
     /** Trailing icon. */
     trailingIcon?: ReactNode;
 }
 /**
- * Button component matching Figma/Compass variants.
- * Use leadingIcon and trailingIcon with the Icon component for icons.
- *
- * @see https://compass.mattermost.com/29be2c109/p/40e456-buttons
+ * Buttons let people take actions or make decisions with a single tap or click — saving a
+ * form, sending a message, confirming a dialog. Compass ships several button variants, each
+ * with the same anatomy and rhythm so they feel like members of the same family.
  */
 export default function Button({ appearance, className, destructive, emphasis, children, leadingIcon, size, trailingIcon, disabled, type, ...rest }: ButtonProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=Button.d.ts.map

package/dist/components/Button/Button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/components/Button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAM7D,MAAM,MAAM,cAAc,GACtB,SAAS,GACT,WAAW,GACX,UAAU,GACV,YAAY,CAAC;AAEjB,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAElE,MAAM,MAAM,gBAAgB,GAAG,SAAS,GAAG,UAAU,CAAC;AAEtD,MAAM,WAAW,WAAY,SAAQ,oBAAoB,CAAC,iBAAiB,CAAC;IAC1E,+EAA+E;IAC/E,UAAU,CAAC,EAAE,gBAAgB,CAAC;IAC9B,+BAA+B;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,oBAAoB;IACpB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,oDAAoD;IACpD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,yCAAyC;IACzC,QAAQ,CAAC,EAAE,cAAc,CAAC;IAC1B,uGAAuG;IACvG,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,qCAAqC;IACrC,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,qBAAqB;IACrB,YAAY,CAAC,EAAE,SAAS,CAAC;CAC1B;AASD;;;;;GAKG;AACH,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,EAC7B,UAAsB,EACtB,SAAc,EACd,WAAmB,EACnB,QAAoB,EACpB,QAAQ,EACR,WAAW,EACX,IAAe,EACf,YAAY,EACZ,QAAQ,EACR,IAAe,EACf,GAAG,IAAI,EACR,EAAE,WAAW,2CA0Cb"}
+{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../src/components/Button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAM7D,MAAM,MAAM,cAAc,GACtB,SAAS,GACT,WAAW,GACX,UAAU,GACV,YAAY,CAAC;AAEjB,MAAM,MAAM,UAAU,GAAG,SAAS,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAElE,MAAM,MAAM,gBAAgB,GAAG,SAAS,GAAG,UAAU,CAAC;AAEtD,MAAM,WAAW,WAAY,SAAQ,oBAAoB,CAAC,iBAAiB,CAAC;IAC1E,+EAA+E;IAC/E,UAAU,CAAC,EAAE,gBAAgB,CAAC;IAC9B,+BAA+B;IAC/B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,oBAAoB;IACpB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,oDAAoD;IACpD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,yCAAyC;IACzC,QAAQ,CAAC,EAAE,cAAc,CAAC;IAC1B,uGAAuG;IACvG,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,qCAAqC;IACrC,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,qBAAqB;IACrB,YAAY,CAAC,EAAE,SAAS,CAAC;CAC1B;AASD;;;;GAIG;AACH,MAAM,CAAC,OAAO,UAAU,MAAM,CAAC,EAC7B,UAAsB,EACtB,SAAc,EACd,WAAmB,EACnB,QAAoB,EACpB,QAAQ,EACR,WAAW,EACX,IAAe,EACf,YAAY,EACZ,QAAQ,EACR,IAAe,EACf,GAAG,IAAI,EACR,EAAE,WAAW,2CA0Cb"}

package/dist/components/ChannelHeader/ChannelHeader.d.ts

@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-export type ChannelHeaderType = 'Channel' | 'Bot' | 'DM' | 'GM' | 'Threads' | 'Drafts';
+export type ChannelHeaderType = 'channel' | 'bot' | 'dm' | 'gm' | 'threads' | 'drafts';
 export interface ChannelHeaderProps {
     /** Channel type variant. Default: Channel. */
     type?: ChannelHeaderType;