Skip to content

feat(base-ui): desktop-native consistency sweep #34

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
joshuapare wants to merge 16 commits into
base: main
Choose a base branch
from
Open

feat(base-ui): desktop-native consistency sweep #34

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
16 commits
Select commit Hold shift + click to select a range
b6ece4e
feat(base-ui): expand ComponentSize to 5-tier and ComponentColor to 8…
joshuapare Mar 17, 2026
6ec4aaf
feat(base-ui): desktop-native size tokens + discovery/secondary colors
joshuapare Mar 17, 2026
b550c96
feat(base-ui): Button xs/xl sizes + discovery/secondary colors
joshuapare Mar 17, 2026
c2ff718
fix(base-ui): remove stale dense prop references from IconButton cons…
joshuapare Mar 17, 2026
44ac455
feat(base-ui): Input/TextArea/TextField xs/xl sizes + discovery/secon…
joshuapare Mar 17, 2026
4b19c94
feat(base-ui): Select/Autocomplete/Combobox/MultiSelect xs/xl, soft v…
joshuapare Mar 17, 2026
deb689c
feat(base-ui): Checkbox/Radio/Switch xs/xl sizes + discovery/secondar…
joshuapare Mar 17, 2026
d10b14f
feat(base-ui): data/list/feedback components xs/xl + discovery/secondary
joshuapare Mar 17, 2026
e64c7be
feat(base-ui): containers, overlays, layout, color-only components co…
joshuapare Mar 17, 2026
3f39f45
feat(base-ui): consistency check story + update all story argTypes
joshuapare Mar 17, 2026
d49d07e
fix(base-ui): add missing info color CSS to 30 components
joshuapare Mar 17, 2026
79f6984
fix(base-ui): consistency story fixes + add missing themes to Storybook
joshuapare Mar 17, 2026
0022197
fix(base-ui): add gap and icon sizing to Tab triggers
joshuapare Mar 17, 2026
b3f98e4
feat(base-ui): Tabs add startDecorator, fix icon sizing and color
joshuapare Mar 17, 2026
7a94bf0
fix(base-ui): Tabs active state, EditorTabs contrast, Toolbar tokens
joshuapare Mar 18, 2026
e94cb4d
fix(base-ui): Tooltip.Trigger should be a pass-through, not a styled …
joshuapare Mar 18, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 6 additions & 10 deletions apps/showcase/src/demos/container-management/components/ContainerDetail.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,7 @@ export function ContainerDetail({ container, onBack }: ContainerDetailProps) {
<IconButton
variant="ghost"
size="sm"
dense

aria-label="Back to container list"
onClick={onBack}
>
Expand Down Expand Up @@ -101,7 +101,7 @@ export function ContainerDetail({ container, onBack }: ContainerDetailProps) {
<IconButton
variant="ghost"
size="sm"
dense

color="danger"
aria-label={`Delete ${container.name}`}
onClick={() => toast(`Deleting ${container.name}`, { severity: 'warning' })}
Expand All @@ -114,20 +114,16 @@ export function ContainerDetail({ container, onBack }: ContainerDetailProps) {
{/* Tabs */}
<Tabs.Root className={styles.tabsRoot} defaultValue="logs" variant="flat" size="sm">
<Tabs.List className={styles.tabsList}>
<Tabs.Tab value="logs">
<LuTerminal aria-hidden />
<Tabs.Tab value="logs" startDecorator={<LuTerminal aria-hidden />}>
Logs
</Tabs.Tab>
<Tabs.Tab value="inspect">
<LuSearch aria-hidden />
<Tabs.Tab value="inspect" startDecorator={<LuSearch aria-hidden />}>
Inspect
</Tabs.Tab>
<Tabs.Tab value="stats">
<LuChartBar aria-hidden />
<Tabs.Tab value="stats" startDecorator={<LuChartBar aria-hidden />}>
Stats
</Tabs.Tab>
<Tabs.Tab value="files">
<LuFolderOpen aria-hidden />
<Tabs.Tab value="files" startDecorator={<LuFolderOpen aria-hidden />}>
Files
</Tabs.Tab>
<Tabs.Indicator />
Expand Down
63 changes: 31 additions & 32 deletions apps/showcase/src/demos/web-browser/components/BrowserToolbar.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ import {
LuRotateCw,
LuLock,
} from 'react-icons/lu';
import { IconButton, Input } from '@omniview/base-ui';
import { IconButton, Input, Toolbar } from '@omniview/base-ui';
import { ensureProtocol, NEW_TAB_URL } from '../data';
import styles from '../index.module.css';

Expand Down Expand Up @@ -47,36 +47,35 @@ export function BrowserToolbar({
);

return (
<div className={styles.toolbar}>
<IconButton
variant="ghost"
size="sm"

aria-label="Back"
disabled={!canGoBack}
onClick={onBack}
>
<LuArrowLeft size={14} />
</IconButton>
<IconButton
variant="ghost"
size="sm"

aria-label="Forward"
disabled={!canGoForward}
onClick={onForward}
>
<LuArrowRight size={14} />
</IconButton>
<IconButton
variant="ghost"
size="sm"

aria-label="Refresh"
onClick={onRefresh}
>
<LuRotateCw size={14} />
</IconButton>
<Toolbar size="sm" className={styles.toolbar}>
<Toolbar.Group>
<IconButton
variant="ghost"
size="sm"
aria-label="Back"
disabled={!canGoBack}
onClick={onBack}
>
<LuArrowLeft />
</IconButton>
<IconButton
variant="ghost"
size="sm"
aria-label="Forward"
disabled={!canGoForward}
onClick={onForward}
>
<LuArrowRight />
</IconButton>
<IconButton
variant="ghost"
size="sm"
aria-label="Refresh"
onClick={onRefresh}
>
<LuRotateCw />
</IconButton>
</Toolbar.Group>
<Input.Root size="sm" className={styles.addressBar}>
<Input.Control
startDecorator={<LuLock size={12} />}
Expand All @@ -87,6 +86,6 @@ export function BrowserToolbar({
placeholder="Enter a URL…"
/>
</Input.Root>
</div>
</Toolbar>
);
}
3 changes: 0 additions & 3 deletions apps/showcase/src/demos/web-browser/index.module.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,9 +31,6 @@

/* Toolbar: nav buttons + address bar */
.toolbar {
display: flex;
align-items: center;
gap: 2px;
padding: 4px 8px;
background: var(--ov-color-bg-surface);
}
Expand Down
2 changes: 1 addition & 1 deletion packages/base-ui/.storybook/preview.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ const preview: Preview = {
defaultValue: 'dark',
toolbar: {
icon: 'paintbrush',
items: ['dark', 'light', 'high-contrast-dark', 'high-contrast-light'],
items: ['dark', 'light', 'high-contrast-dark', 'high-contrast-light', 'obsidian', 'carbon', 'void'],
},
},
density: {
Expand Down
Loading
Loading