@navecss/base-ui 0.3.0 → 0.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +2 -2
- package/dist/registry/base-ui-accordion.json +3 -3
- package/dist/registry/base-ui-alert-dialog.json +4 -4
- package/dist/registry/base-ui-autocomplete.json +3 -3
- package/dist/registry/base-ui-avatar.json +3 -3
- package/dist/registry/base-ui-button.json +4 -4
- package/dist/registry/base-ui-checkbox-group.json +3 -3
- package/dist/registry/base-ui-checkbox.json +3 -3
- package/dist/registry/base-ui-collapsible.json +3 -3
- package/dist/registry/base-ui-combobox.json +3 -3
- package/dist/registry/base-ui-context-menu.json +3 -3
- package/dist/registry/base-ui-dialog.json +4 -4
- package/dist/registry/base-ui-field.json +3 -3
- package/dist/registry/base-ui-fieldset.json +3 -3
- package/dist/registry/base-ui-input.json +3 -3
- package/dist/registry/base-ui-menu.json +4 -4
- package/dist/registry/base-ui-menubar.json +3 -3
- package/dist/registry/base-ui-meter.json +3 -3
- package/dist/registry/base-ui-navigation-menu.json +3 -3
- package/dist/registry/base-ui-number-field.json +3 -3
- package/dist/registry/base-ui-popover.json +4 -4
- package/dist/registry/base-ui-preview-card.json +3 -3
- package/dist/registry/base-ui-progress.json +3 -3
- package/dist/registry/base-ui-radio-group.json +3 -3
- package/dist/registry/base-ui-radio.json +3 -3
- package/dist/registry/base-ui-scroll-area.json +3 -3
- package/dist/registry/base-ui-select.json +3 -3
- package/dist/registry/base-ui-separator.json +3 -3
- package/dist/registry/base-ui-slider.json +3 -3
- package/dist/registry/base-ui-switch.json +3 -3
- package/dist/registry/base-ui-tabs.json +3 -3
- package/dist/registry/base-ui-toast.json +4 -4
- package/dist/registry/base-ui-toggle-group.json +3 -3
- package/dist/registry/base-ui-toggle.json +4 -4
- package/dist/registry/base-ui-toolbar.json +4 -4
- package/dist/registry/base-ui-tooltip.json +4 -4
- package/dist/registry/registry.json +105 -105
- package/dist/styles.css +5 -1
- package/package.json +13 -12
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
"react-dom"
|
|
8
8
|
],
|
|
9
9
|
"description": "NaveCSS's styling of the Base UI Navigation Menu, as files copied into your project: Base UI's parts from @base-ui/react, which Base UI's maintainers publish, with Nave's classes from a CSS Module that reads Nave's tokens.",
|
|
10
|
-
"docs": "Import { NavigationMenu } from the nave-navigation-menu file just written, not from @navecss/base-ui/navigation-menu.\nKeep @navecss/tokens/css imported: the copied rules read Nave's tokens. They sit in a CSS Module, so your build needs CSS Modules.\nThe copy needs @base-ui/react 1.3 or later in the 1.x line, @navecss/tokens 0.
|
|
10
|
+
"docs": "Import { NavigationMenu } from the nave-navigation-menu file just written, not from @navecss/base-ui/navigation-menu.\nKeep @navecss/tokens/css imported: the copied rules read Nave's tokens. They sit in a CSS Module, so your build needs CSS Modules.\nThe copy needs @base-ui/react 1.3 or later in the 1.x line, @navecss/tokens 0.5.0 or later before 1.0, and React 18 or 19. A version already in your package.json is kept; a missing package is installed at its latest version.\nGenerated from @navecss/base-ui 0.4.0. No later release changes these files.",
|
|
11
11
|
"files": [
|
|
12
12
|
{
|
|
13
13
|
"content": "// SPDX-License-Identifier: MIT\n// Copyright (c) 2026 Nave Contributors. From NaveCSS (https://github.com/navecss/navecss), under the MIT License; the full text is in NAVECSS-LICENSE.\n\nexport * as NavigationMenu from './nave-navigation-menu.parts'\nexport type * from '@base-ui/react/navigation-menu'\n",
|
|
@@ -43,11 +43,11 @@
|
|
|
43
43
|
"meta": {
|
|
44
44
|
"peerDependencies": {
|
|
45
45
|
"@base-ui/react": "^1.3.0",
|
|
46
|
-
"@navecss/tokens": ">=0.
|
|
46
|
+
"@navecss/tokens": ">=0.5.0 <1.0.0",
|
|
47
47
|
"react": "^18 || ^19",
|
|
48
48
|
"react-dom": "^18 || ^19"
|
|
49
49
|
},
|
|
50
|
-
"version": "0.
|
|
50
|
+
"version": "0.4.0"
|
|
51
51
|
},
|
|
52
52
|
"name": "base-ui-navigation-menu",
|
|
53
53
|
"title": "NaveCSS styling of Base UI Navigation Menu",
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
"react-dom"
|
|
8
8
|
],
|
|
9
9
|
"description": "NaveCSS's styling of the Base UI Number Field, as files copied into your project: Base UI's parts from @base-ui/react, which Base UI's maintainers publish, with Nave's classes from a CSS Module that reads Nave's tokens.",
|
|
10
|
-
"docs": "Import { NumberField } from the nave-number-field file just written, not from @navecss/base-ui/number-field.\nKeep @navecss/tokens/css imported: the copied rules read Nave's tokens. They sit in a CSS Module, so your build needs CSS Modules.\nThe copy needs @base-ui/react 1.3 or later in the 1.x line, @navecss/tokens 0.
|
|
10
|
+
"docs": "Import { NumberField } from the nave-number-field file just written, not from @navecss/base-ui/number-field.\nKeep @navecss/tokens/css imported: the copied rules read Nave's tokens. They sit in a CSS Module, so your build needs CSS Modules.\nThe copy needs @base-ui/react 1.3 or later in the 1.x line, @navecss/tokens 0.5.0 or later before 1.0, and React 18 or 19. A version already in your package.json is kept; a missing package is installed at its latest version.\nGenerated from @navecss/base-ui 0.4.0. No later release changes these files.",
|
|
11
11
|
"files": [
|
|
12
12
|
{
|
|
13
13
|
"content": "// SPDX-License-Identifier: MIT\n// Copyright (c) 2026 Nave Contributors. From NaveCSS (https://github.com/navecss/navecss), under the MIT License; the full text is in NAVECSS-LICENSE.\n\nexport * as NumberField from './nave-number-field.parts'\nexport type * from '@base-ui/react/number-field'\n",
|
|
@@ -43,11 +43,11 @@
|
|
|
43
43
|
"meta": {
|
|
44
44
|
"peerDependencies": {
|
|
45
45
|
"@base-ui/react": "^1.3.0",
|
|
46
|
-
"@navecss/tokens": ">=0.
|
|
46
|
+
"@navecss/tokens": ">=0.5.0 <1.0.0",
|
|
47
47
|
"react": "^18 || ^19",
|
|
48
48
|
"react-dom": "^18 || ^19"
|
|
49
49
|
},
|
|
50
|
-
"version": "0.
|
|
50
|
+
"version": "0.4.0"
|
|
51
51
|
},
|
|
52
52
|
"name": "base-ui-number-field",
|
|
53
53
|
"title": "NaveCSS styling of Base UI Number Field",
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
"react-dom"
|
|
8
8
|
],
|
|
9
9
|
"description": "NaveCSS's styling of the Base UI Popover, as files copied into your project: Base UI's parts from @base-ui/react, which Base UI's maintainers publish, with Nave's classes from a CSS Module that reads Nave's tokens.",
|
|
10
|
-
"docs": "Import { Popover } from the nave-popover file just written, not from @navecss/base-ui/popover.\nKeep @navecss/tokens/css imported: the copied rules read Nave's tokens. They sit in a CSS Module, so your build needs CSS Modules.\nThe copy needs @base-ui/react 1.3 or later in the 1.x line, @navecss/tokens 0.
|
|
10
|
+
"docs": "Import { Popover } from the nave-popover file just written, not from @navecss/base-ui/popover.\nKeep @navecss/tokens/css imported: the copied rules read Nave's tokens. They sit in a CSS Module, so your build needs CSS Modules.\nThe copy needs @base-ui/react 1.3 or later in the 1.x line, @navecss/tokens 0.5.0 or later before 1.0, and React 18 or 19. A version already in your package.json is kept; a missing package is installed at its latest version.\nGenerated from @navecss/base-ui 0.4.0. No later release changes these files.",
|
|
11
11
|
"files": [
|
|
12
12
|
{
|
|
13
13
|
"content": "// SPDX-License-Identifier: MIT\n// Copyright (c) 2026 Nave Contributors. From NaveCSS (https://github.com/navecss/navecss), under the MIT License; the full text is in NAVECSS-LICENSE.\n\nexport * as Popover from './nave-popover.parts'\nexport type * from '@base-ui/react/popover'\n",
|
|
@@ -28,7 +28,7 @@
|
|
|
28
28
|
"type": "registry:file"
|
|
29
29
|
},
|
|
30
30
|
{
|
|
31
|
-
"content": "/* SPDX-License-Identifier: MIT */\n/* Copyright (c) 2026 Nave Contributors. From NaveCSS (https://github.com/navecss/navecss), under the MIT License; the full text is in NAVECSS-LICENSE. */\n@layer tokens.defaults, tokens.presets, reset, atomic, components.nave, components.consumer, overrides;\n\n@layer components.consumer {\n .popoverPopup {\n box-sizing: border-box;\n background-color: var(--nave-color-surface-overlay);\n color: var(--nave-color-content-primary);\n border: var(--nave-border-width-sm) solid var(--nave-color-border-default);\n border-radius: var(--nave-radius-control);\n box-shadow: var(--nave-shadow-overlay);\n padding: var(--nave-spacing-content-md);\n font-size: var(--nave-font-size-sm);\n max-block-size: var(--available-height);\n overflow-y: auto;\n scroll-padding: var(--nave-spacing-content-md);\n }\n .arrow {\n &[data-side=\"top\"],\n &[data-side=\"bottom\"],\n &[data-side=\"left\"],\n &[data-side=\"right\"] {\n position: absolute;\n box-sizing: border-box;\n inline-size: 8px;\n block-size: 8px;\n background-color: inherit;\n border-style: inherit;\n border-width: inherit;\n border-color: inherit;\n border-top-style: none;\n border-left-style: none;\n }\n\n &[data-side=\"top\"] {\n bottom: -4px;\n rotate: 45deg;\n }\n\n &[data-side=\"bottom\"] {\n top: -4px;\n rotate: 225deg;\n }\n\n &[data-side=\"left\"] {\n right: -4px;\n rotate: -45deg;\n }\n\n &[data-side=\"right\"] {\n left: -4px;\n rotate: 135deg;\n }\n }\n .title {\n margin: 0;\n font-size: var(--nave-font-size-lg);\n font-weight: var(--nave-font-weight-semibold);\n line-height: var(--nave-line-height-tight);\n }\n .description {\n margin: 0;\n font-size: var(--nave-font-size-sm);\n line-height: var(--nave-line-height-base);\n color: var(--nave-color-content-secondary);\n }\n .button {\n box-sizing: border-box;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--nave-spacing-control-sm);\n min-block-size: var(--nave-size-control-md);\n padding-block: 0;\n padding-inline: var(--nave-spacing-control-lg);\n border: var(--nave-border-width-sm) solid var(--nave-color-border-control);\n border-radius: var(--nave-radius-control);\n background-color: var(--nave-color-action-secondary);\n color: var(--nave-color-content-primary);\n font-family: inherit;\n font-size: var(--nave-font-size-sm);\n font-weight: var(--nave-font-weight-medium);\n line-height: var(--nave-line-height-tight);\n white-space: nowrap;\n cursor: pointer;\n user-select: none;\n &[data-nave-size=\"sm\"] {\n min-block-size: var(--nave-size-control-sm);\n padding-inline: var(--nave-spacing-control-md);\n }\n &[data-nave-variant=\"primary\"] {\n background-color: var(--nave-color-action-primary);\n border-color: transparent;\n color: var(--nave-color-on-action-primary);\n }\n &[data-nave-variant=\"primary\"]:hover:not(\n :disabled,\n [aria-disabled=\"true\"]\n ) {\n background-color: var(--nave-color-action-primary-hover);\n }\n &[data-nave-variant=\"primary\"]:active:not(\n :disabled,\n [aria-disabled=\"true\"]\n ) {\n background-color: var(--nave-color-action-primary-active);\n }\n &:disabled,\n &[aria-disabled=\"true\"] {\n background-color: transparent;\n border-color: var(--nave-color-border-disabled);\n color: var(--nave-color-content-disabled);\n cursor: not-allowed;\n }\n &[data-nave-variant=\"ghost\"] {\n background-color: transparent;\n border-color: transparent;\n }\n &[data-nave-variant=\"ghost\"]:hover:not(:disabled, [aria-disabled=\"true\"]) {\n background-color: var(--nave-color-action-highlight);\n }\n &[data-nave-variant=\"ghost\"]:active:not(:disabled, [aria-disabled=\"true\"]) {\n background-color: var(--nave-color-action-highlight);\n }\n &[data-nave-variant=\"ghost\"][aria-expanded=\"true\"]:not(\n :disabled,\n [aria-disabled=\"true\"]\n ) {\n background-color: var(--nave-color-action-
|
|
31
|
+
"content": "/* SPDX-License-Identifier: MIT */\n/* Copyright (c) 2026 Nave Contributors. From NaveCSS (https://github.com/navecss/navecss), under the MIT License; the full text is in NAVECSS-LICENSE. */\n@layer tokens.defaults, tokens.presets, reset, atomic, components.nave, components.consumer, overrides;\n\n@layer components.consumer {\n .popoverPopup {\n box-sizing: border-box;\n background-color: var(--nave-color-surface-overlay);\n color: var(--nave-color-content-primary);\n border: var(--nave-border-width-sm) solid var(--nave-color-border-default);\n border-radius: var(--nave-radius-control);\n box-shadow: var(--nave-shadow-overlay);\n padding: var(--nave-spacing-content-md);\n font-size: var(--nave-font-size-sm);\n max-block-size: var(--available-height);\n overflow-y: auto;\n scroll-padding: var(--nave-spacing-content-md);\n }\n .arrow {\n &[data-side=\"top\"],\n &[data-side=\"bottom\"],\n &[data-side=\"left\"],\n &[data-side=\"right\"] {\n position: absolute;\n box-sizing: border-box;\n inline-size: 8px;\n block-size: 8px;\n background-color: inherit;\n border-style: inherit;\n border-width: inherit;\n border-color: inherit;\n border-top-style: none;\n border-left-style: none;\n }\n\n &[data-side=\"top\"] {\n bottom: -4px;\n rotate: 45deg;\n }\n\n &[data-side=\"bottom\"] {\n top: -4px;\n rotate: 225deg;\n }\n\n &[data-side=\"left\"] {\n right: -4px;\n rotate: -45deg;\n }\n\n &[data-side=\"right\"] {\n left: -4px;\n rotate: 135deg;\n }\n }\n .title {\n margin: 0;\n font-size: var(--nave-font-size-lg);\n font-weight: var(--nave-font-weight-semibold);\n line-height: var(--nave-line-height-tight);\n }\n .description {\n margin: 0;\n font-size: var(--nave-font-size-sm);\n line-height: var(--nave-line-height-base);\n color: var(--nave-color-content-secondary);\n }\n .button {\n box-sizing: border-box;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--nave-spacing-control-sm);\n min-block-size: var(--nave-size-control-md);\n padding-block: 0;\n padding-inline: var(--nave-spacing-control-lg);\n border: var(--nave-border-width-sm) solid var(--nave-color-border-control);\n border-radius: var(--nave-radius-control);\n background-color: var(--nave-color-action-secondary);\n color: var(--nave-color-content-primary);\n font-family: inherit;\n font-size: var(--nave-font-size-sm);\n font-weight: var(--nave-font-weight-medium);\n line-height: var(--nave-line-height-tight);\n white-space: nowrap;\n cursor: pointer;\n user-select: none;\n &[data-nave-size=\"sm\"] {\n min-block-size: var(--nave-size-control-sm);\n padding-inline: var(--nave-spacing-control-md);\n }\n &[data-nave-variant=\"primary\"] {\n background-color: var(--nave-color-action-primary);\n border-color: transparent;\n color: var(--nave-color-on-action-primary);\n }\n &[data-nave-variant=\"primary\"]:hover:not(\n :disabled,\n [aria-disabled=\"true\"]\n ) {\n background-color: var(--nave-color-action-primary-hover);\n }\n &[data-nave-variant=\"primary\"]:active:not(\n :disabled,\n [aria-disabled=\"true\"]\n ) {\n background-color: var(--nave-color-action-primary-active);\n }\n &:disabled,\n &[aria-disabled=\"true\"] {\n background-color: transparent;\n border-color: var(--nave-color-border-disabled);\n color: var(--nave-color-content-disabled);\n cursor: not-allowed;\n }\n &[data-nave-variant=\"ghost\"] {\n background-color: transparent;\n border-color: transparent;\n }\n &[data-nave-variant=\"ghost\"]:hover:not(:disabled, [aria-disabled=\"true\"]) {\n background-color: var(--nave-color-action-highlight);\n }\n &[data-nave-variant=\"ghost\"]:active:not(:disabled, [aria-disabled=\"true\"]) {\n background-color: var(--nave-color-action-highlight);\n }\n &[data-nave-variant=\"ghost\"][aria-expanded=\"true\"]:is(\n [aria-haspopup=\"menu\"],\n [aria-haspopup=\"true\"],\n [aria-haspopup=\"dialog\"]\n ):not(:disabled, [aria-disabled=\"true\"]) {\n background-color: var(--nave-color-action-highlight);\n }\n &:not([data-nave-variant=\"primary\"], [data-nave-variant=\"ghost\"]):hover:not(\n :disabled,\n [aria-disabled=\"true\"]\n ) {\n background-color: var(--nave-color-action-secondary-hover);\n }\n &:not(\n [data-nave-variant=\"primary\"],\n [data-nave-variant=\"ghost\"]\n ):active:not(:disabled, [aria-disabled=\"true\"]) {\n background-color: var(--nave-color-action-secondary-active);\n }\n & {\n /* stylelint-disable-next-line declaration-property-value-disallowed-list -- the outline the &:focus-visible rule for this class draws replaces the browser's default focus indicator; keep that rule while this declaration stays. */\n outline: none;\n }\n &:focus-visible {\n outline-style: solid;\n outline-width: var(--nave-border-width-focus, 2px);\n outline-color: var(--nave-color-border-focus, currentColor);\n outline-offset: 2px;\n }\n }\n .popupMotion {\n transition-property: opacity;\n transition-duration: var(--nave-motion-duration-fast);\n transition-timing-function: var(--nave-motion-easing-decelerate);\n &[data-starting-style],\n &[data-ending-style] {\n opacity: 0;\n }\n &[data-ending-style] {\n transition-timing-function: var(--nave-motion-easing-accelerate);\n }\n &[data-instant] {\n transition-duration: var(--nave-motion-duration-instant);\n }\n @media (prefers-reduced-motion: reduce) {\n &,\n &[data-instant] {\n transition-duration: calc(0 * var(--nave-motion-duration-fast));\n }\n }\n }\n .arrowInline {\n &[data-side=\"inline-start\"],\n &[data-side=\"inline-end\"] {\n position: absolute;\n box-sizing: border-box;\n inline-size: 8px;\n block-size: 8px;\n background-color: inherit;\n border-style: inherit;\n border-width: inherit;\n border-color: inherit;\n border-top-style: none;\n border-left-style: none;\n }\n\n &[data-side=\"inline-start\"] {\n inset-inline-end: -4px;\n rotate: -45deg;\n }\n\n &[data-side=\"inline-end\"] {\n inset-inline-start: -4px;\n rotate: 135deg;\n }\n\n &[data-side=\"inline-start\"]:dir(rtl) {\n rotate: 135deg;\n }\n\n &[data-side=\"inline-end\"]:dir(rtl) {\n rotate: -45deg;\n }\n }\n}\n",
|
|
32
32
|
"path": "registry/nave/nave-popover.module.css",
|
|
33
33
|
"target": "components/nave/nave-popover.module.css",
|
|
34
34
|
"type": "registry:file"
|
|
@@ -43,11 +43,11 @@
|
|
|
43
43
|
"meta": {
|
|
44
44
|
"peerDependencies": {
|
|
45
45
|
"@base-ui/react": "^1.3.0",
|
|
46
|
-
"@navecss/tokens": ">=0.
|
|
46
|
+
"@navecss/tokens": ">=0.5.0 <1.0.0",
|
|
47
47
|
"react": "^18 || ^19",
|
|
48
48
|
"react-dom": "^18 || ^19"
|
|
49
49
|
},
|
|
50
|
-
"version": "0.
|
|
50
|
+
"version": "0.4.0"
|
|
51
51
|
},
|
|
52
52
|
"name": "base-ui-popover",
|
|
53
53
|
"title": "NaveCSS styling of Base UI Popover",
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
"react-dom"
|
|
8
8
|
],
|
|
9
9
|
"description": "NaveCSS's styling of the Base UI Preview Card, as files copied into your project: Base UI's parts from @base-ui/react, which Base UI's maintainers publish, with Nave's classes from a CSS Module that reads Nave's tokens.",
|
|
10
|
-
"docs": "Import { PreviewCard } from the nave-preview-card file just written, not from @navecss/base-ui/preview-card.\nKeep @navecss/tokens/css imported: the copied rules read Nave's tokens. They sit in a CSS Module, so your build needs CSS Modules.\nThe copy needs @base-ui/react 1.3 or later in the 1.x line, @navecss/tokens 0.
|
|
10
|
+
"docs": "Import { PreviewCard } from the nave-preview-card file just written, not from @navecss/base-ui/preview-card.\nKeep @navecss/tokens/css imported: the copied rules read Nave's tokens. They sit in a CSS Module, so your build needs CSS Modules.\nThe copy needs @base-ui/react 1.3 or later in the 1.x line, @navecss/tokens 0.5.0 or later before 1.0, and React 18 or 19. A version already in your package.json is kept; a missing package is installed at its latest version.\nGenerated from @navecss/base-ui 0.4.0. No later release changes these files.",
|
|
11
11
|
"files": [
|
|
12
12
|
{
|
|
13
13
|
"content": "// SPDX-License-Identifier: MIT\n// Copyright (c) 2026 Nave Contributors. From NaveCSS (https://github.com/navecss/navecss), under the MIT License; the full text is in NAVECSS-LICENSE.\n\nexport * as PreviewCard from './nave-preview-card.parts'\nexport type * from '@base-ui/react/preview-card'\n",
|
|
@@ -43,11 +43,11 @@
|
|
|
43
43
|
"meta": {
|
|
44
44
|
"peerDependencies": {
|
|
45
45
|
"@base-ui/react": "^1.3.0",
|
|
46
|
-
"@navecss/tokens": ">=0.
|
|
46
|
+
"@navecss/tokens": ">=0.5.0 <1.0.0",
|
|
47
47
|
"react": "^18 || ^19",
|
|
48
48
|
"react-dom": "^18 || ^19"
|
|
49
49
|
},
|
|
50
|
-
"version": "0.
|
|
50
|
+
"version": "0.4.0"
|
|
51
51
|
},
|
|
52
52
|
"name": "base-ui-preview-card",
|
|
53
53
|
"title": "NaveCSS styling of Base UI Preview Card",
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
"react-dom"
|
|
8
8
|
],
|
|
9
9
|
"description": "NaveCSS's styling of the Base UI Progress, as files copied into your project: Base UI's parts from @base-ui/react, which Base UI's maintainers publish, with Nave's classes from a CSS Module that reads Nave's tokens.",
|
|
10
|
-
"docs": "Import { Progress } from the nave-progress file just written, not from @navecss/base-ui/progress.\nKeep @navecss/tokens/css imported: the copied rules read Nave's tokens. They sit in a CSS Module, so your build needs CSS Modules.\nThe copy needs @base-ui/react 1.3 or later in the 1.x line, @navecss/tokens 0.
|
|
10
|
+
"docs": "Import { Progress } from the nave-progress file just written, not from @navecss/base-ui/progress.\nKeep @navecss/tokens/css imported: the copied rules read Nave's tokens. They sit in a CSS Module, so your build needs CSS Modules.\nThe copy needs @base-ui/react 1.3 or later in the 1.x line, @navecss/tokens 0.5.0 or later before 1.0, and React 18 or 19. A version already in your package.json is kept; a missing package is installed at its latest version.\nGenerated from @navecss/base-ui 0.4.0. No later release changes these files.",
|
|
11
11
|
"files": [
|
|
12
12
|
{
|
|
13
13
|
"content": "// SPDX-License-Identifier: MIT\n// Copyright (c) 2026 Nave Contributors. From NaveCSS (https://github.com/navecss/navecss), under the MIT License; the full text is in NAVECSS-LICENSE.\n\nexport * as Progress from './nave-progress.parts'\nexport type * from '@base-ui/react/progress'\n",
|
|
@@ -43,11 +43,11 @@
|
|
|
43
43
|
"meta": {
|
|
44
44
|
"peerDependencies": {
|
|
45
45
|
"@base-ui/react": "^1.3.0",
|
|
46
|
-
"@navecss/tokens": ">=0.
|
|
46
|
+
"@navecss/tokens": ">=0.5.0 <1.0.0",
|
|
47
47
|
"react": "^18 || ^19",
|
|
48
48
|
"react-dom": "^18 || ^19"
|
|
49
49
|
},
|
|
50
|
-
"version": "0.
|
|
50
|
+
"version": "0.4.0"
|
|
51
51
|
},
|
|
52
52
|
"name": "base-ui-progress",
|
|
53
53
|
"title": "NaveCSS styling of Base UI Progress",
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
"react-dom"
|
|
8
8
|
],
|
|
9
9
|
"description": "NaveCSS's styling of the Base UI Radio Group, as files copied into your project: Base UI's parts from @base-ui/react, which Base UI's maintainers publish, with Nave's classes from a CSS Module that reads Nave's tokens.",
|
|
10
|
-
"docs": "Import { RadioGroup } from the nave-radio-group file just written, not from @navecss/base-ui/radio-group.\nKeep @navecss/tokens/css imported: the copied rules read Nave's tokens. They sit in a CSS Module, so your build needs CSS Modules.\nThe copy needs @base-ui/react 1.3 or later in the 1.x line, @navecss/tokens 0.
|
|
10
|
+
"docs": "Import { RadioGroup } from the nave-radio-group file just written, not from @navecss/base-ui/radio-group.\nKeep @navecss/tokens/css imported: the copied rules read Nave's tokens. They sit in a CSS Module, so your build needs CSS Modules.\nThe copy needs @base-ui/react 1.3 or later in the 1.x line, @navecss/tokens 0.5.0 or later before 1.0, and React 18 or 19. A version already in your package.json is kept; a missing package is installed at its latest version.\nGenerated from @navecss/base-ui 0.4.0. No later release changes these files.",
|
|
11
11
|
"files": [
|
|
12
12
|
{
|
|
13
13
|
"content": "// SPDX-License-Identifier: MIT\n// Copyright (c) 2026 Nave Contributors. From NaveCSS (https://github.com/navecss/navecss), under the MIT License; the full text is in NAVECSS-LICENSE.\n\nexport { RadioGroup } from './nave-radio-group.parts'\nexport type * from '@base-ui/react/radio-group'\n",
|
|
@@ -43,11 +43,11 @@
|
|
|
43
43
|
"meta": {
|
|
44
44
|
"peerDependencies": {
|
|
45
45
|
"@base-ui/react": "^1.3.0",
|
|
46
|
-
"@navecss/tokens": ">=0.
|
|
46
|
+
"@navecss/tokens": ">=0.5.0 <1.0.0",
|
|
47
47
|
"react": "^18 || ^19",
|
|
48
48
|
"react-dom": "^18 || ^19"
|
|
49
49
|
},
|
|
50
|
-
"version": "0.
|
|
50
|
+
"version": "0.4.0"
|
|
51
51
|
},
|
|
52
52
|
"name": "base-ui-radio-group",
|
|
53
53
|
"title": "NaveCSS styling of Base UI Radio Group",
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
"react-dom"
|
|
8
8
|
],
|
|
9
9
|
"description": "NaveCSS's styling of the Base UI Radio, as files copied into your project: Base UI's parts from @base-ui/react, which Base UI's maintainers publish, with Nave's classes from a CSS Module that reads Nave's tokens.",
|
|
10
|
-
"docs": "Import { Radio } from the nave-radio file just written, not from @navecss/base-ui/radio.\nKeep @navecss/tokens/css imported: the copied rules read Nave's tokens. They sit in a CSS Module, so your build needs CSS Modules.\nThe copy needs @base-ui/react 1.3 or later in the 1.x line, @navecss/tokens 0.
|
|
10
|
+
"docs": "Import { Radio } from the nave-radio file just written, not from @navecss/base-ui/radio.\nKeep @navecss/tokens/css imported: the copied rules read Nave's tokens. They sit in a CSS Module, so your build needs CSS Modules.\nThe copy needs @base-ui/react 1.3 or later in the 1.x line, @navecss/tokens 0.5.0 or later before 1.0, and React 18 or 19. A version already in your package.json is kept; a missing package is installed at its latest version.\nGenerated from @navecss/base-ui 0.4.0. No later release changes these files.",
|
|
11
11
|
"files": [
|
|
12
12
|
{
|
|
13
13
|
"content": "// SPDX-License-Identifier: MIT\n// Copyright (c) 2026 Nave Contributors. From NaveCSS (https://github.com/navecss/navecss), under the MIT License; the full text is in NAVECSS-LICENSE.\n\nexport * as Radio from './nave-radio.parts'\nexport type * from '@base-ui/react/radio'\n",
|
|
@@ -43,11 +43,11 @@
|
|
|
43
43
|
"meta": {
|
|
44
44
|
"peerDependencies": {
|
|
45
45
|
"@base-ui/react": "^1.3.0",
|
|
46
|
-
"@navecss/tokens": ">=0.
|
|
46
|
+
"@navecss/tokens": ">=0.5.0 <1.0.0",
|
|
47
47
|
"react": "^18 || ^19",
|
|
48
48
|
"react-dom": "^18 || ^19"
|
|
49
49
|
},
|
|
50
|
-
"version": "0.
|
|
50
|
+
"version": "0.4.0"
|
|
51
51
|
},
|
|
52
52
|
"name": "base-ui-radio",
|
|
53
53
|
"title": "NaveCSS styling of Base UI Radio",
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
"react-dom"
|
|
8
8
|
],
|
|
9
9
|
"description": "NaveCSS's styling of the Base UI Scroll Area, as files copied into your project: Base UI's parts from @base-ui/react, which Base UI's maintainers publish, with Nave's classes from a CSS Module that reads Nave's tokens.",
|
|
10
|
-
"docs": "Import { ScrollArea } from the nave-scroll-area file just written, not from @navecss/base-ui/scroll-area.\nKeep @navecss/tokens/css imported: the copied rules read Nave's tokens. They sit in a CSS Module, so your build needs CSS Modules.\nThe copy needs @base-ui/react 1.3 or later in the 1.x line, @navecss/tokens 0.
|
|
10
|
+
"docs": "Import { ScrollArea } from the nave-scroll-area file just written, not from @navecss/base-ui/scroll-area.\nKeep @navecss/tokens/css imported: the copied rules read Nave's tokens. They sit in a CSS Module, so your build needs CSS Modules.\nThe copy needs @base-ui/react 1.3 or later in the 1.x line, @navecss/tokens 0.5.0 or later before 1.0, and React 18 or 19. A version already in your package.json is kept; a missing package is installed at its latest version.\nGenerated from @navecss/base-ui 0.4.0. No later release changes these files.",
|
|
11
11
|
"files": [
|
|
12
12
|
{
|
|
13
13
|
"content": "// SPDX-License-Identifier: MIT\n// Copyright (c) 2026 Nave Contributors. From NaveCSS (https://github.com/navecss/navecss), under the MIT License; the full text is in NAVECSS-LICENSE.\n\nexport * as ScrollArea from './nave-scroll-area.parts'\nexport type * from '@base-ui/react/scroll-area'\n",
|
|
@@ -43,11 +43,11 @@
|
|
|
43
43
|
"meta": {
|
|
44
44
|
"peerDependencies": {
|
|
45
45
|
"@base-ui/react": "^1.3.0",
|
|
46
|
-
"@navecss/tokens": ">=0.
|
|
46
|
+
"@navecss/tokens": ">=0.5.0 <1.0.0",
|
|
47
47
|
"react": "^18 || ^19",
|
|
48
48
|
"react-dom": "^18 || ^19"
|
|
49
49
|
},
|
|
50
|
-
"version": "0.
|
|
50
|
+
"version": "0.4.0"
|
|
51
51
|
},
|
|
52
52
|
"name": "base-ui-scroll-area",
|
|
53
53
|
"title": "NaveCSS styling of Base UI Scroll Area",
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
"react-dom"
|
|
8
8
|
],
|
|
9
9
|
"description": "NaveCSS's styling of the Base UI Select, as files copied into your project: Base UI's parts from @base-ui/react, which Base UI's maintainers publish, with Nave's classes from a CSS Module that reads Nave's tokens.",
|
|
10
|
-
"docs": "Import { Select } from the nave-select file just written, not from @navecss/base-ui/select.\nKeep @navecss/tokens/css imported: the copied rules read Nave's tokens. They sit in a CSS Module, so your build needs CSS Modules.\nThe copy needs @base-ui/react 1.3 or later in the 1.x line, @navecss/tokens 0.
|
|
10
|
+
"docs": "Import { Select } from the nave-select file just written, not from @navecss/base-ui/select.\nKeep @navecss/tokens/css imported: the copied rules read Nave's tokens. They sit in a CSS Module, so your build needs CSS Modules.\nThe copy needs @base-ui/react 1.3 or later in the 1.x line, @navecss/tokens 0.5.0 or later before 1.0, and React 18 or 19. A version already in your package.json is kept; a missing package is installed at its latest version.\nGenerated from @navecss/base-ui 0.4.0. No later release changes these files.",
|
|
11
11
|
"files": [
|
|
12
12
|
{
|
|
13
13
|
"content": "// SPDX-License-Identifier: MIT\n// Copyright (c) 2026 Nave Contributors. From NaveCSS (https://github.com/navecss/navecss), under the MIT License; the full text is in NAVECSS-LICENSE.\n\nexport * as Select from './nave-select.parts'\nexport type * from '@base-ui/react/select'\n",
|
|
@@ -43,11 +43,11 @@
|
|
|
43
43
|
"meta": {
|
|
44
44
|
"peerDependencies": {
|
|
45
45
|
"@base-ui/react": "^1.3.0",
|
|
46
|
-
"@navecss/tokens": ">=0.
|
|
46
|
+
"@navecss/tokens": ">=0.5.0 <1.0.0",
|
|
47
47
|
"react": "^18 || ^19",
|
|
48
48
|
"react-dom": "^18 || ^19"
|
|
49
49
|
},
|
|
50
|
-
"version": "0.
|
|
50
|
+
"version": "0.4.0"
|
|
51
51
|
},
|
|
52
52
|
"name": "base-ui-select",
|
|
53
53
|
"title": "NaveCSS styling of Base UI Select",
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
"react-dom"
|
|
8
8
|
],
|
|
9
9
|
"description": "NaveCSS's styling of the Base UI Separator, as files copied into your project: Base UI's parts from @base-ui/react, which Base UI's maintainers publish, with Nave's classes from a CSS Module that reads Nave's tokens.",
|
|
10
|
-
"docs": "Import { Separator } from the nave-separator file just written, not from @navecss/base-ui/separator.\nKeep @navecss/tokens/css imported: the copied rules read Nave's tokens. They sit in a CSS Module, so your build needs CSS Modules.\nThe copy needs @base-ui/react 1.3 or later in the 1.x line, @navecss/tokens 0.
|
|
10
|
+
"docs": "Import { Separator } from the nave-separator file just written, not from @navecss/base-ui/separator.\nKeep @navecss/tokens/css imported: the copied rules read Nave's tokens. They sit in a CSS Module, so your build needs CSS Modules.\nThe copy needs @base-ui/react 1.3 or later in the 1.x line, @navecss/tokens 0.5.0 or later before 1.0, and React 18 or 19. A version already in your package.json is kept; a missing package is installed at its latest version.\nGenerated from @navecss/base-ui 0.4.0. No later release changes these files.",
|
|
11
11
|
"files": [
|
|
12
12
|
{
|
|
13
13
|
"content": "// SPDX-License-Identifier: MIT\n// Copyright (c) 2026 Nave Contributors. From NaveCSS (https://github.com/navecss/navecss), under the MIT License; the full text is in NAVECSS-LICENSE.\n\nexport { Separator } from './nave-separator.parts'\nexport type * from '@base-ui/react/separator'\n",
|
|
@@ -43,11 +43,11 @@
|
|
|
43
43
|
"meta": {
|
|
44
44
|
"peerDependencies": {
|
|
45
45
|
"@base-ui/react": "^1.3.0",
|
|
46
|
-
"@navecss/tokens": ">=0.
|
|
46
|
+
"@navecss/tokens": ">=0.5.0 <1.0.0",
|
|
47
47
|
"react": "^18 || ^19",
|
|
48
48
|
"react-dom": "^18 || ^19"
|
|
49
49
|
},
|
|
50
|
-
"version": "0.
|
|
50
|
+
"version": "0.4.0"
|
|
51
51
|
},
|
|
52
52
|
"name": "base-ui-separator",
|
|
53
53
|
"title": "NaveCSS styling of Base UI Separator",
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
"react-dom"
|
|
8
8
|
],
|
|
9
9
|
"description": "NaveCSS's styling of the Base UI Slider, as files copied into your project: Base UI's parts from @base-ui/react, which Base UI's maintainers publish, with Nave's classes from a CSS Module that reads Nave's tokens.",
|
|
10
|
-
"docs": "Import { Slider } from the nave-slider file just written, not from @navecss/base-ui/slider.\nKeep @navecss/tokens/css imported: the copied rules read Nave's tokens. They sit in a CSS Module, so your build needs CSS Modules.\nThe copy needs @base-ui/react 1.3 or later in the 1.x line, @navecss/tokens 0.
|
|
10
|
+
"docs": "Import { Slider } from the nave-slider file just written, not from @navecss/base-ui/slider.\nKeep @navecss/tokens/css imported: the copied rules read Nave's tokens. They sit in a CSS Module, so your build needs CSS Modules.\nThe copy needs @base-ui/react 1.3 or later in the 1.x line, @navecss/tokens 0.5.0 or later before 1.0, and React 18 or 19. A version already in your package.json is kept; a missing package is installed at its latest version.\nGenerated from @navecss/base-ui 0.4.0. No later release changes these files.",
|
|
11
11
|
"files": [
|
|
12
12
|
{
|
|
13
13
|
"content": "// SPDX-License-Identifier: MIT\n// Copyright (c) 2026 Nave Contributors. From NaveCSS (https://github.com/navecss/navecss), under the MIT License; the full text is in NAVECSS-LICENSE.\n\nexport * as Slider from './nave-slider.parts'\nexport type * from '@base-ui/react/slider'\n",
|
|
@@ -43,11 +43,11 @@
|
|
|
43
43
|
"meta": {
|
|
44
44
|
"peerDependencies": {
|
|
45
45
|
"@base-ui/react": "^1.3.0",
|
|
46
|
-
"@navecss/tokens": ">=0.
|
|
46
|
+
"@navecss/tokens": ">=0.5.0 <1.0.0",
|
|
47
47
|
"react": "^18 || ^19",
|
|
48
48
|
"react-dom": "^18 || ^19"
|
|
49
49
|
},
|
|
50
|
-
"version": "0.
|
|
50
|
+
"version": "0.4.0"
|
|
51
51
|
},
|
|
52
52
|
"name": "base-ui-slider",
|
|
53
53
|
"title": "NaveCSS styling of Base UI Slider",
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
"react-dom"
|
|
8
8
|
],
|
|
9
9
|
"description": "NaveCSS's styling of the Base UI Switch, as files copied into your project: Base UI's parts from @base-ui/react, which Base UI's maintainers publish, with Nave's classes from a CSS Module that reads Nave's tokens.",
|
|
10
|
-
"docs": "Import { Switch } from the nave-switch file just written, not from @navecss/base-ui/switch.\nKeep @navecss/tokens/css imported: the copied rules read Nave's tokens. They sit in a CSS Module, so your build needs CSS Modules.\nThe copy needs @base-ui/react 1.3 or later in the 1.x line, @navecss/tokens 0.
|
|
10
|
+
"docs": "Import { Switch } from the nave-switch file just written, not from @navecss/base-ui/switch.\nKeep @navecss/tokens/css imported: the copied rules read Nave's tokens. They sit in a CSS Module, so your build needs CSS Modules.\nThe copy needs @base-ui/react 1.3 or later in the 1.x line, @navecss/tokens 0.5.0 or later before 1.0, and React 18 or 19. A version already in your package.json is kept; a missing package is installed at its latest version.\nGenerated from @navecss/base-ui 0.4.0. No later release changes these files.",
|
|
11
11
|
"files": [
|
|
12
12
|
{
|
|
13
13
|
"content": "// SPDX-License-Identifier: MIT\n// Copyright (c) 2026 Nave Contributors. From NaveCSS (https://github.com/navecss/navecss), under the MIT License; the full text is in NAVECSS-LICENSE.\n\nexport * as Switch from './nave-switch.parts'\nexport type * from '@base-ui/react/switch'\n",
|
|
@@ -43,11 +43,11 @@
|
|
|
43
43
|
"meta": {
|
|
44
44
|
"peerDependencies": {
|
|
45
45
|
"@base-ui/react": "^1.3.0",
|
|
46
|
-
"@navecss/tokens": ">=0.
|
|
46
|
+
"@navecss/tokens": ">=0.5.0 <1.0.0",
|
|
47
47
|
"react": "^18 || ^19",
|
|
48
48
|
"react-dom": "^18 || ^19"
|
|
49
49
|
},
|
|
50
|
-
"version": "0.
|
|
50
|
+
"version": "0.4.0"
|
|
51
51
|
},
|
|
52
52
|
"name": "base-ui-switch",
|
|
53
53
|
"title": "NaveCSS styling of Base UI Switch",
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
"react-dom"
|
|
8
8
|
],
|
|
9
9
|
"description": "NaveCSS's styling of the Base UI Tabs, as files copied into your project: Base UI's parts from @base-ui/react, which Base UI's maintainers publish, with Nave's classes from a CSS Module that reads Nave's tokens.",
|
|
10
|
-
"docs": "Import { Tabs } from the nave-tabs file just written, not from @navecss/base-ui/tabs.\nKeep @navecss/tokens/css imported: the copied rules read Nave's tokens. They sit in a CSS Module, so your build needs CSS Modules.\nThe copy needs @base-ui/react 1.3 or later in the 1.x line, @navecss/tokens 0.
|
|
10
|
+
"docs": "Import { Tabs } from the nave-tabs file just written, not from @navecss/base-ui/tabs.\nKeep @navecss/tokens/css imported: the copied rules read Nave's tokens. They sit in a CSS Module, so your build needs CSS Modules.\nThe copy needs @base-ui/react 1.3 or later in the 1.x line, @navecss/tokens 0.5.0 or later before 1.0, and React 18 or 19. A version already in your package.json is kept; a missing package is installed at its latest version.\nGenerated from @navecss/base-ui 0.4.0. No later release changes these files.",
|
|
11
11
|
"files": [
|
|
12
12
|
{
|
|
13
13
|
"content": "// SPDX-License-Identifier: MIT\n// Copyright (c) 2026 Nave Contributors. From NaveCSS (https://github.com/navecss/navecss), under the MIT License; the full text is in NAVECSS-LICENSE.\n\nexport * as Tabs from './nave-tabs.parts'\nexport type * from '@base-ui/react/tabs'\n",
|
|
@@ -43,11 +43,11 @@
|
|
|
43
43
|
"meta": {
|
|
44
44
|
"peerDependencies": {
|
|
45
45
|
"@base-ui/react": "^1.3.0",
|
|
46
|
-
"@navecss/tokens": ">=0.
|
|
46
|
+
"@navecss/tokens": ">=0.5.0 <1.0.0",
|
|
47
47
|
"react": "^18 || ^19",
|
|
48
48
|
"react-dom": "^18 || ^19"
|
|
49
49
|
},
|
|
50
|
-
"version": "0.
|
|
50
|
+
"version": "0.4.0"
|
|
51
51
|
},
|
|
52
52
|
"name": "base-ui-tabs",
|
|
53
53
|
"title": "NaveCSS styling of Base UI Tabs",
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
"react-dom"
|
|
8
8
|
],
|
|
9
9
|
"description": "NaveCSS's styling of the Base UI Toast, as files copied into your project: Base UI's parts from @base-ui/react, which Base UI's maintainers publish, with Nave's classes from a CSS Module that reads Nave's tokens.",
|
|
10
|
-
"docs": "Import { Toast } from the nave-toast file just written, not from @navecss/base-ui/toast.\nKeep @navecss/tokens/css imported: the copied rules read Nave's tokens. They sit in a CSS Module, so your build needs CSS Modules.\nThe copy needs @base-ui/react 1.3 or later in the 1.x line, @navecss/tokens 0.
|
|
10
|
+
"docs": "Import { Toast } from the nave-toast file just written, not from @navecss/base-ui/toast.\nKeep @navecss/tokens/css imported: the copied rules read Nave's tokens. They sit in a CSS Module, so your build needs CSS Modules.\nThe copy needs @base-ui/react 1.3 or later in the 1.x line, @navecss/tokens 0.5.0 or later before 1.0, and React 18 or 19. A version already in your package.json is kept; a missing package is installed at its latest version.\nGenerated from @navecss/base-ui 0.4.0. No later release changes these files.",
|
|
11
11
|
"files": [
|
|
12
12
|
{
|
|
13
13
|
"content": "// SPDX-License-Identifier: MIT\n// Copyright (c) 2026 Nave Contributors. From NaveCSS (https://github.com/navecss/navecss), under the MIT License; the full text is in NAVECSS-LICENSE.\n\nexport * as Toast from './nave-toast.parts'\nexport type * from '@base-ui/react/toast'\n",
|
|
@@ -28,7 +28,7 @@
|
|
|
28
28
|
"type": "registry:file"
|
|
29
29
|
},
|
|
30
30
|
{
|
|
31
|
-
"content": "/* SPDX-License-Identifier: MIT */\n/* Copyright (c) 2026 Nave Contributors. From NaveCSS (https://github.com/navecss/navecss), under the MIT License; the full text is in NAVECSS-LICENSE. */\n@layer tokens.defaults, tokens.presets, reset, atomic, components.nave, components.consumer, overrides;\n\n@layer components.consumer {\n .arrow {\n &[data-side=\"top\"],\n &[data-side=\"bottom\"],\n &[data-side=\"left\"],\n &[data-side=\"right\"] {\n position: absolute;\n box-sizing: border-box;\n inline-size: 8px;\n block-size: 8px;\n background-color: inherit;\n border-style: inherit;\n border-width: inherit;\n border-color: inherit;\n border-top-style: none;\n border-left-style: none;\n }\n\n &[data-side=\"top\"] {\n bottom: -4px;\n rotate: 45deg;\n }\n\n &[data-side=\"bottom\"] {\n top: -4px;\n rotate: 225deg;\n }\n\n &[data-side=\"left\"] {\n right: -4px;\n rotate: -45deg;\n }\n\n &[data-side=\"right\"] {\n left: -4px;\n rotate: 135deg;\n }\n }\n .title {\n margin: 0;\n font-size: var(--nave-font-size-lg);\n font-weight: var(--nave-font-weight-semibold);\n line-height: var(--nave-line-height-tight);\n }\n .description {\n margin: 0;\n font-size: var(--nave-font-size-sm);\n line-height: var(--nave-line-height-base);\n color: var(--nave-color-content-secondary);\n }\n .button {\n box-sizing: border-box;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--nave-spacing-control-sm);\n min-block-size: var(--nave-size-control-md);\n padding-block: 0;\n padding-inline: var(--nave-spacing-control-lg);\n border: var(--nave-border-width-sm) solid var(--nave-color-border-control);\n border-radius: var(--nave-radius-control);\n background-color: var(--nave-color-action-secondary);\n color: var(--nave-color-content-primary);\n font-family: inherit;\n font-size: var(--nave-font-size-sm);\n font-weight: var(--nave-font-weight-medium);\n line-height: var(--nave-line-height-tight);\n white-space: nowrap;\n cursor: pointer;\n user-select: none;\n &[data-nave-size=\"sm\"] {\n min-block-size: var(--nave-size-control-sm);\n padding-inline: var(--nave-spacing-control-md);\n }\n &[data-nave-variant=\"primary\"] {\n background-color: var(--nave-color-action-primary);\n border-color: transparent;\n color: var(--nave-color-on-action-primary);\n }\n &[data-nave-variant=\"primary\"]:hover:not(\n :disabled,\n [aria-disabled=\"true\"]\n ) {\n background-color: var(--nave-color-action-primary-hover);\n }\n &[data-nave-variant=\"primary\"]:active:not(\n :disabled,\n [aria-disabled=\"true\"]\n ) {\n background-color: var(--nave-color-action-primary-active);\n }\n &:disabled,\n &[aria-disabled=\"true\"] {\n background-color: transparent;\n border-color: var(--nave-color-border-disabled);\n color: var(--nave-color-content-disabled);\n cursor: not-allowed;\n }\n &[data-nave-variant=\"ghost\"] {\n background-color: transparent;\n border-color: transparent;\n }\n &[data-nave-variant=\"ghost\"]:hover:not(:disabled, [aria-disabled=\"true\"]) {\n background-color: var(--nave-color-action-highlight);\n }\n &[data-nave-variant=\"ghost\"]:active:not(:disabled, [aria-disabled=\"true\"]) {\n background-color: var(--nave-color-action-highlight);\n }\n &[data-nave-variant=\"ghost\"][aria-expanded=\"true\"]:not(\n :disabled,\n [aria-disabled=\"true\"]\n ) {\n background-color: var(--nave-color-action-
|
|
31
|
+
"content": "/* SPDX-License-Identifier: MIT */\n/* Copyright (c) 2026 Nave Contributors. From NaveCSS (https://github.com/navecss/navecss), under the MIT License; the full text is in NAVECSS-LICENSE. */\n@layer tokens.defaults, tokens.presets, reset, atomic, components.nave, components.consumer, overrides;\n\n@layer components.consumer {\n .arrow {\n &[data-side=\"top\"],\n &[data-side=\"bottom\"],\n &[data-side=\"left\"],\n &[data-side=\"right\"] {\n position: absolute;\n box-sizing: border-box;\n inline-size: 8px;\n block-size: 8px;\n background-color: inherit;\n border-style: inherit;\n border-width: inherit;\n border-color: inherit;\n border-top-style: none;\n border-left-style: none;\n }\n\n &[data-side=\"top\"] {\n bottom: -4px;\n rotate: 45deg;\n }\n\n &[data-side=\"bottom\"] {\n top: -4px;\n rotate: 225deg;\n }\n\n &[data-side=\"left\"] {\n right: -4px;\n rotate: -45deg;\n }\n\n &[data-side=\"right\"] {\n left: -4px;\n rotate: 135deg;\n }\n }\n .title {\n margin: 0;\n font-size: var(--nave-font-size-lg);\n font-weight: var(--nave-font-weight-semibold);\n line-height: var(--nave-line-height-tight);\n }\n .description {\n margin: 0;\n font-size: var(--nave-font-size-sm);\n line-height: var(--nave-line-height-base);\n color: var(--nave-color-content-secondary);\n }\n .button {\n box-sizing: border-box;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--nave-spacing-control-sm);\n min-block-size: var(--nave-size-control-md);\n padding-block: 0;\n padding-inline: var(--nave-spacing-control-lg);\n border: var(--nave-border-width-sm) solid var(--nave-color-border-control);\n border-radius: var(--nave-radius-control);\n background-color: var(--nave-color-action-secondary);\n color: var(--nave-color-content-primary);\n font-family: inherit;\n font-size: var(--nave-font-size-sm);\n font-weight: var(--nave-font-weight-medium);\n line-height: var(--nave-line-height-tight);\n white-space: nowrap;\n cursor: pointer;\n user-select: none;\n &[data-nave-size=\"sm\"] {\n min-block-size: var(--nave-size-control-sm);\n padding-inline: var(--nave-spacing-control-md);\n }\n &[data-nave-variant=\"primary\"] {\n background-color: var(--nave-color-action-primary);\n border-color: transparent;\n color: var(--nave-color-on-action-primary);\n }\n &[data-nave-variant=\"primary\"]:hover:not(\n :disabled,\n [aria-disabled=\"true\"]\n ) {\n background-color: var(--nave-color-action-primary-hover);\n }\n &[data-nave-variant=\"primary\"]:active:not(\n :disabled,\n [aria-disabled=\"true\"]\n ) {\n background-color: var(--nave-color-action-primary-active);\n }\n &:disabled,\n &[aria-disabled=\"true\"] {\n background-color: transparent;\n border-color: var(--nave-color-border-disabled);\n color: var(--nave-color-content-disabled);\n cursor: not-allowed;\n }\n &[data-nave-variant=\"ghost\"] {\n background-color: transparent;\n border-color: transparent;\n }\n &[data-nave-variant=\"ghost\"]:hover:not(:disabled, [aria-disabled=\"true\"]) {\n background-color: var(--nave-color-action-highlight);\n }\n &[data-nave-variant=\"ghost\"]:active:not(:disabled, [aria-disabled=\"true\"]) {\n background-color: var(--nave-color-action-highlight);\n }\n &[data-nave-variant=\"ghost\"][aria-expanded=\"true\"]:is(\n [aria-haspopup=\"menu\"],\n [aria-haspopup=\"true\"],\n [aria-haspopup=\"dialog\"]\n ):not(:disabled, [aria-disabled=\"true\"]) {\n background-color: var(--nave-color-action-highlight);\n }\n &:not([data-nave-variant=\"primary\"], [data-nave-variant=\"ghost\"]):hover:not(\n :disabled,\n [aria-disabled=\"true\"]\n ) {\n background-color: var(--nave-color-action-secondary-hover);\n }\n &:not(\n [data-nave-variant=\"primary\"],\n [data-nave-variant=\"ghost\"]\n ):active:not(:disabled, [aria-disabled=\"true\"]) {\n background-color: var(--nave-color-action-secondary-active);\n }\n & {\n /* stylelint-disable-next-line declaration-property-value-disallowed-list -- the outline the &:focus-visible rule for this class draws replaces the browser's default focus indicator; keep that rule while this declaration stays. */\n outline: none;\n }\n &:focus-visible {\n outline-style: solid;\n outline-width: var(--nave-border-width-focus, 2px);\n outline-color: var(--nave-color-border-focus, currentColor);\n outline-offset: 2px;\n }\n }\n .arrowInline {\n &[data-side=\"inline-start\"],\n &[data-side=\"inline-end\"] {\n position: absolute;\n box-sizing: border-box;\n inline-size: 8px;\n block-size: 8px;\n background-color: inherit;\n border-style: inherit;\n border-width: inherit;\n border-color: inherit;\n border-top-style: none;\n border-left-style: none;\n }\n\n &[data-side=\"inline-start\"] {\n inset-inline-end: -4px;\n rotate: -45deg;\n }\n\n &[data-side=\"inline-end\"] {\n inset-inline-start: -4px;\n rotate: 135deg;\n }\n\n &[data-side=\"inline-start\"]:dir(rtl) {\n rotate: 135deg;\n }\n\n &[data-side=\"inline-end\"]:dir(rtl) {\n rotate: -45deg;\n }\n }\n .toastViewport {\n display: flex;\n flex-direction: column;\n gap: var(--nave-spacing-content-sm);\n }\n .toastPlacement {\n position: fixed;\n inset-block-end: var(--nave-spacing-content-lg);\n inset-inline-end: var(--nave-spacing-content-lg);\n inline-size: 20rem;\n max-inline-size: calc(100% - 2 * var(--nave-spacing-content-lg));\n z-index: var(--nave-layer-toast);\n }\n .toastRoot {\n box-sizing: border-box;\n background-color: var(--nave-color-surface-overlay);\n color: var(--nave-color-content-primary);\n border: var(--nave-border-width-sm) solid var(--nave-color-border-default);\n border-radius: var(--nave-radius-card);\n box-shadow: var(--nave-shadow-overlay);\n padding: var(--nave-spacing-content-md);\n font-size: var(--nave-font-size-sm);\n }\n .toastFade {\n transition-property: opacity;\n transition-duration: var(--nave-motion-duration-fast);\n transition-timing-function: var(--nave-motion-easing-decelerate);\n &[data-starting-style],\n &[data-ending-style]:not([data-swipe-direction]) {\n opacity: 0;\n }\n &[data-ending-style] {\n transition-timing-function: var(--nave-motion-easing-accelerate);\n }\n @media (prefers-reduced-motion: reduce) {\n & {\n transition-duration: calc(0 * var(--nave-motion-duration-fast));\n }\n }\n }\n .toastLimit {\n &[data-limited] {\n display: none;\n }\n }\n}\n",
|
|
32
32
|
"path": "registry/nave/nave-toast.module.css",
|
|
33
33
|
"target": "components/nave/nave-toast.module.css",
|
|
34
34
|
"type": "registry:file"
|
|
@@ -43,11 +43,11 @@
|
|
|
43
43
|
"meta": {
|
|
44
44
|
"peerDependencies": {
|
|
45
45
|
"@base-ui/react": "^1.3.0",
|
|
46
|
-
"@navecss/tokens": ">=0.
|
|
46
|
+
"@navecss/tokens": ">=0.5.0 <1.0.0",
|
|
47
47
|
"react": "^18 || ^19",
|
|
48
48
|
"react-dom": "^18 || ^19"
|
|
49
49
|
},
|
|
50
|
-
"version": "0.
|
|
50
|
+
"version": "0.4.0"
|
|
51
51
|
},
|
|
52
52
|
"name": "base-ui-toast",
|
|
53
53
|
"title": "NaveCSS styling of Base UI Toast",
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
"react-dom"
|
|
8
8
|
],
|
|
9
9
|
"description": "NaveCSS's styling of the Base UI Toggle Group, as files copied into your project: Base UI's parts from @base-ui/react, which Base UI's maintainers publish, with Nave's classes from a CSS Module that reads Nave's tokens.",
|
|
10
|
-
"docs": "Import { ToggleGroup } from the nave-toggle-group file just written, not from @navecss/base-ui/toggle-group.\nKeep @navecss/tokens/css imported: the copied rules read Nave's tokens. They sit in a CSS Module, so your build needs CSS Modules.\nThe copy needs @base-ui/react 1.3 or later in the 1.x line, @navecss/tokens 0.
|
|
10
|
+
"docs": "Import { ToggleGroup } from the nave-toggle-group file just written, not from @navecss/base-ui/toggle-group.\nKeep @navecss/tokens/css imported: the copied rules read Nave's tokens. They sit in a CSS Module, so your build needs CSS Modules.\nThe copy needs @base-ui/react 1.3 or later in the 1.x line, @navecss/tokens 0.5.0 or later before 1.0, and React 18 or 19. A version already in your package.json is kept; a missing package is installed at its latest version.\nGenerated from @navecss/base-ui 0.4.0. No later release changes these files.",
|
|
11
11
|
"files": [
|
|
12
12
|
{
|
|
13
13
|
"content": "// SPDX-License-Identifier: MIT\n// Copyright (c) 2026 Nave Contributors. From NaveCSS (https://github.com/navecss/navecss), under the MIT License; the full text is in NAVECSS-LICENSE.\n\nexport { ToggleGroup } from './nave-toggle-group.parts'\nexport type * from '@base-ui/react/toggle-group'\n",
|
|
@@ -43,11 +43,11 @@
|
|
|
43
43
|
"meta": {
|
|
44
44
|
"peerDependencies": {
|
|
45
45
|
"@base-ui/react": "^1.3.0",
|
|
46
|
-
"@navecss/tokens": ">=0.
|
|
46
|
+
"@navecss/tokens": ">=0.5.0 <1.0.0",
|
|
47
47
|
"react": "^18 || ^19",
|
|
48
48
|
"react-dom": "^18 || ^19"
|
|
49
49
|
},
|
|
50
|
-
"version": "0.
|
|
50
|
+
"version": "0.4.0"
|
|
51
51
|
},
|
|
52
52
|
"name": "base-ui-toggle-group",
|
|
53
53
|
"title": "NaveCSS styling of Base UI Toggle Group",
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
"react-dom"
|
|
8
8
|
],
|
|
9
9
|
"description": "NaveCSS's styling of the Base UI Toggle, as files copied into your project: Base UI's parts from @base-ui/react, which Base UI's maintainers publish, with Nave's classes from a CSS Module that reads Nave's tokens.",
|
|
10
|
-
"docs": "Import { Toggle } from the nave-toggle file just written, not from @navecss/base-ui/toggle.\nKeep @navecss/tokens/css imported: the copied rules read Nave's tokens. They sit in a CSS Module, so your build needs CSS Modules.\nThe copy needs @base-ui/react 1.3 or later in the 1.x line, @navecss/tokens 0.
|
|
10
|
+
"docs": "Import { Toggle } from the nave-toggle file just written, not from @navecss/base-ui/toggle.\nKeep @navecss/tokens/css imported: the copied rules read Nave's tokens. They sit in a CSS Module, so your build needs CSS Modules.\nThe copy needs @base-ui/react 1.3 or later in the 1.x line, @navecss/tokens 0.5.0 or later before 1.0, and React 18 or 19. A version already in your package.json is kept; a missing package is installed at its latest version.\nGenerated from @navecss/base-ui 0.4.0. No later release changes these files.",
|
|
11
11
|
"files": [
|
|
12
12
|
{
|
|
13
13
|
"content": "// SPDX-License-Identifier: MIT\n// Copyright (c) 2026 Nave Contributors. From NaveCSS (https://github.com/navecss/navecss), under the MIT License; the full text is in NAVECSS-LICENSE.\n\nexport { Toggle } from './nave-toggle.parts'\nexport type * from '@base-ui/react/toggle'\n",
|
|
@@ -28,7 +28,7 @@
|
|
|
28
28
|
"type": "registry:file"
|
|
29
29
|
},
|
|
30
30
|
{
|
|
31
|
-
"content": "/* SPDX-License-Identifier: MIT */\n/* Copyright (c) 2026 Nave Contributors. From NaveCSS (https://github.com/navecss/navecss), under the MIT License; the full text is in NAVECSS-LICENSE. */\n@layer tokens.defaults, tokens.presets, reset, atomic, components.nave, components.consumer, overrides;\n\n@layer components.consumer {\n .toggle {\n box-sizing: border-box;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--nave-spacing-control-sm);\n min-block-size: var(--nave-size-control-md);\n padding-block: 0;\n padding-inline: var(--nave-spacing-control-lg);\n border: var(--nave-border-width-sm) solid var(--nave-color-border-control);\n border-radius: var(--nave-radius-control);\n background-color: var(--nave-color-action-secondary);\n color: var(--nave-color-content-primary);\n font-family: inherit;\n font-size: var(--nave-font-size-sm);\n font-weight: var(--nave-font-weight-medium);\n line-height: var(--nave-line-height-tight);\n white-space: nowrap;\n cursor: pointer;\n user-select: none;\n position: relative;\n &[data-nave-size=\"sm\"] {\n min-block-size: var(--nave-size-control-sm);\n padding-inline: var(--nave-spacing-control-md);\n }\n &[aria-pressed=\"true\"]::after {\n content: \"\";\n position: absolute;\n inset-inline: var(--nave-spacing-control-md);\n inset-block-end: var(--nave-border-width-sm);\n border-block-end: var(--nave-border-width-lg) solid currentColor;\n }\n &:disabled,\n &[aria-disabled=\"true\"] {\n background-color: transparent;\n border-color: var(--nave-color-border-disabled);\n color: var(--nave-color-content-disabled);\n cursor: not-allowed;\n }\n & {\n /* stylelint-disable-next-line declaration-property-value-disallowed-list -- the outline the &:focus-visible rule for this class draws replaces the browser's default focus indicator; keep that rule while this declaration stays. */\n outline: none;\n }\n &:focus-visible {\n outline-style: solid;\n outline-width: var(--nave-border-width-focus, 2px);\n outline-color: var(--nave-color-border-focus, currentColor);\n outline-offset: 2px;\n }\n }\n}\n",
|
|
31
|
+
"content": "/* SPDX-License-Identifier: MIT */\n/* Copyright (c) 2026 Nave Contributors. From NaveCSS (https://github.com/navecss/navecss), under the MIT License; the full text is in NAVECSS-LICENSE. */\n@layer tokens.defaults, tokens.presets, reset, atomic, components.nave, components.consumer, overrides;\n\n@layer components.consumer {\n .toggle {\n box-sizing: border-box;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--nave-spacing-control-sm);\n min-block-size: var(--nave-size-control-md);\n padding-block: 0;\n padding-inline: var(--nave-spacing-control-lg);\n border: var(--nave-border-width-sm) solid var(--nave-color-border-control);\n border-radius: var(--nave-radius-control);\n background-color: var(--nave-color-action-secondary);\n color: var(--nave-color-content-primary);\n font-family: inherit;\n font-size: var(--nave-font-size-sm);\n font-weight: var(--nave-font-weight-medium);\n line-height: var(--nave-line-height-tight);\n white-space: nowrap;\n cursor: pointer;\n user-select: none;\n position: relative;\n &[data-nave-size=\"sm\"] {\n min-block-size: var(--nave-size-control-sm);\n padding-inline: var(--nave-spacing-control-md);\n }\n &[aria-pressed=\"true\"]::after {\n content: \"\";\n position: absolute;\n inset-inline: var(--nave-spacing-control-md);\n inset-block-end: var(--nave-border-width-sm);\n border-block-end: var(--nave-border-width-lg) solid currentColor;\n }\n &:disabled,\n &[aria-disabled=\"true\"] {\n background-color: transparent;\n border-color: var(--nave-color-border-disabled);\n color: var(--nave-color-content-disabled);\n cursor: not-allowed;\n }\n &:hover:not(:disabled, [aria-disabled=\"true\"]) {\n background-color: var(--nave-color-action-secondary-hover);\n }\n &:active:not(:disabled, [aria-disabled=\"true\"]) {\n background-color: var(--nave-color-action-secondary-active);\n }\n & {\n /* stylelint-disable-next-line declaration-property-value-disallowed-list -- the outline the &:focus-visible rule for this class draws replaces the browser's default focus indicator; keep that rule while this declaration stays. */\n outline: none;\n }\n &:focus-visible {\n outline-style: solid;\n outline-width: var(--nave-border-width-focus, 2px);\n outline-color: var(--nave-color-border-focus, currentColor);\n outline-offset: 2px;\n }\n }\n}\n",
|
|
32
32
|
"path": "registry/nave/nave-toggle.module.css",
|
|
33
33
|
"target": "components/nave/nave-toggle.module.css",
|
|
34
34
|
"type": "registry:file"
|
|
@@ -43,11 +43,11 @@
|
|
|
43
43
|
"meta": {
|
|
44
44
|
"peerDependencies": {
|
|
45
45
|
"@base-ui/react": "^1.3.0",
|
|
46
|
-
"@navecss/tokens": ">=0.
|
|
46
|
+
"@navecss/tokens": ">=0.5.0 <1.0.0",
|
|
47
47
|
"react": "^18 || ^19",
|
|
48
48
|
"react-dom": "^18 || ^19"
|
|
49
49
|
},
|
|
50
|
-
"version": "0.
|
|
50
|
+
"version": "0.4.0"
|
|
51
51
|
},
|
|
52
52
|
"name": "base-ui-toggle",
|
|
53
53
|
"title": "NaveCSS styling of Base UI Toggle",
|
|
@@ -7,7 +7,7 @@
|
|
|
7
7
|
"react-dom"
|
|
8
8
|
],
|
|
9
9
|
"description": "NaveCSS's styling of the Base UI Toolbar, as files copied into your project: Base UI's parts from @base-ui/react, which Base UI's maintainers publish, with Nave's classes from a CSS Module that reads Nave's tokens.",
|
|
10
|
-
"docs": "Import { Toolbar } from the nave-toolbar file just written, not from @navecss/base-ui/toolbar.\nKeep @navecss/tokens/css imported: the copied rules read Nave's tokens. They sit in a CSS Module, so your build needs CSS Modules.\nThe copy needs @base-ui/react 1.3 or later in the 1.x line, @navecss/tokens 0.
|
|
10
|
+
"docs": "Import { Toolbar } from the nave-toolbar file just written, not from @navecss/base-ui/toolbar.\nKeep @navecss/tokens/css imported: the copied rules read Nave's tokens. They sit in a CSS Module, so your build needs CSS Modules.\nThe copy needs @base-ui/react 1.3 or later in the 1.x line, @navecss/tokens 0.5.0 or later before 1.0, and React 18 or 19. A version already in your package.json is kept; a missing package is installed at its latest version.\nGenerated from @navecss/base-ui 0.4.0. No later release changes these files.",
|
|
11
11
|
"files": [
|
|
12
12
|
{
|
|
13
13
|
"content": "// SPDX-License-Identifier: MIT\n// Copyright (c) 2026 Nave Contributors. From NaveCSS (https://github.com/navecss/navecss), under the MIT License; the full text is in NAVECSS-LICENSE.\n\nexport * as Toolbar from './nave-toolbar.parts'\nexport type * from '@base-ui/react/toolbar'\n",
|
|
@@ -28,7 +28,7 @@
|
|
|
28
28
|
"type": "registry:file"
|
|
29
29
|
},
|
|
30
30
|
{
|
|
31
|
-
"content": "/* SPDX-License-Identifier: MIT */\n/* Copyright (c) 2026 Nave Contributors. From NaveCSS (https://github.com/navecss/navecss), under the MIT License; the full text is in NAVECSS-LICENSE. */\n@layer tokens.defaults, tokens.presets, reset, atomic, components.nave, components.consumer, overrides;\n\n@layer components.consumer {\n .button {\n box-sizing: border-box;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--nave-spacing-control-sm);\n min-block-size: var(--nave-size-control-md);\n padding-block: 0;\n padding-inline: var(--nave-spacing-control-lg);\n border: var(--nave-border-width-sm) solid var(--nave-color-border-control);\n border-radius: var(--nave-radius-control);\n background-color: var(--nave-color-action-secondary);\n color: var(--nave-color-content-primary);\n font-family: inherit;\n font-size: var(--nave-font-size-sm);\n font-weight: var(--nave-font-weight-medium);\n line-height: var(--nave-line-height-tight);\n white-space: nowrap;\n cursor: pointer;\n user-select: none;\n &[data-nave-size=\"sm\"] {\n min-block-size: var(--nave-size-control-sm);\n padding-inline: var(--nave-spacing-control-md);\n }\n &[data-nave-variant=\"primary\"] {\n background-color: var(--nave-color-action-primary);\n border-color: transparent;\n color: var(--nave-color-on-action-primary);\n }\n &[data-nave-variant=\"primary\"]:hover:not(\n :disabled,\n [aria-disabled=\"true\"]\n ) {\n background-color: var(--nave-color-action-primary-hover);\n }\n &[data-nave-variant=\"primary\"]:active:not(\n :disabled,\n [aria-disabled=\"true\"]\n ) {\n background-color: var(--nave-color-action-primary-active);\n }\n &:disabled,\n &[aria-disabled=\"true\"] {\n background-color: transparent;\n border-color: var(--nave-color-border-disabled);\n color: var(--nave-color-content-disabled);\n cursor: not-allowed;\n }\n &[data-nave-variant=\"ghost\"] {\n background-color: transparent;\n border-color: transparent;\n }\n &[data-nave-variant=\"ghost\"]:hover:not(:disabled, [aria-disabled=\"true\"]) {\n background-color: var(--nave-color-action-highlight);\n }\n &[data-nave-variant=\"ghost\"]:active:not(:disabled, [aria-disabled=\"true\"]) {\n background-color: var(--nave-color-action-highlight);\n }\n &[data-nave-variant=\"ghost\"][aria-expanded=\"true\"]:not(\n :disabled,\n [aria-disabled=\"true\"]\n ) {\n background-color: var(--nave-color-action-
|
|
31
|
+
"content": "/* SPDX-License-Identifier: MIT */\n/* Copyright (c) 2026 Nave Contributors. From NaveCSS (https://github.com/navecss/navecss), under the MIT License; the full text is in NAVECSS-LICENSE. */\n@layer tokens.defaults, tokens.presets, reset, atomic, components.nave, components.consumer, overrides;\n\n@layer components.consumer {\n .button {\n box-sizing: border-box;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--nave-spacing-control-sm);\n min-block-size: var(--nave-size-control-md);\n padding-block: 0;\n padding-inline: var(--nave-spacing-control-lg);\n border: var(--nave-border-width-sm) solid var(--nave-color-border-control);\n border-radius: var(--nave-radius-control);\n background-color: var(--nave-color-action-secondary);\n color: var(--nave-color-content-primary);\n font-family: inherit;\n font-size: var(--nave-font-size-sm);\n font-weight: var(--nave-font-weight-medium);\n line-height: var(--nave-line-height-tight);\n white-space: nowrap;\n cursor: pointer;\n user-select: none;\n &[data-nave-size=\"sm\"] {\n min-block-size: var(--nave-size-control-sm);\n padding-inline: var(--nave-spacing-control-md);\n }\n &[data-nave-variant=\"primary\"] {\n background-color: var(--nave-color-action-primary);\n border-color: transparent;\n color: var(--nave-color-on-action-primary);\n }\n &[data-nave-variant=\"primary\"]:hover:not(\n :disabled,\n [aria-disabled=\"true\"]\n ) {\n background-color: var(--nave-color-action-primary-hover);\n }\n &[data-nave-variant=\"primary\"]:active:not(\n :disabled,\n [aria-disabled=\"true\"]\n ) {\n background-color: var(--nave-color-action-primary-active);\n }\n &:disabled,\n &[aria-disabled=\"true\"] {\n background-color: transparent;\n border-color: var(--nave-color-border-disabled);\n color: var(--nave-color-content-disabled);\n cursor: not-allowed;\n }\n &[data-nave-variant=\"ghost\"] {\n background-color: transparent;\n border-color: transparent;\n }\n &[data-nave-variant=\"ghost\"]:hover:not(:disabled, [aria-disabled=\"true\"]) {\n background-color: var(--nave-color-action-highlight);\n }\n &[data-nave-variant=\"ghost\"]:active:not(:disabled, [aria-disabled=\"true\"]) {\n background-color: var(--nave-color-action-highlight);\n }\n &[data-nave-variant=\"ghost\"][aria-expanded=\"true\"]:is(\n [aria-haspopup=\"menu\"],\n [aria-haspopup=\"true\"],\n [aria-haspopup=\"dialog\"]\n ):not(:disabled, [aria-disabled=\"true\"]) {\n background-color: var(--nave-color-action-highlight);\n }\n &:not([data-nave-variant=\"primary\"], [data-nave-variant=\"ghost\"]):hover:not(\n :disabled,\n [aria-disabled=\"true\"]\n ) {\n background-color: var(--nave-color-action-secondary-hover);\n }\n &:not(\n [data-nave-variant=\"primary\"],\n [data-nave-variant=\"ghost\"]\n ):active:not(:disabled, [aria-disabled=\"true\"]) {\n background-color: var(--nave-color-action-secondary-active);\n }\n & {\n /* stylelint-disable-next-line declaration-property-value-disallowed-list -- the outline the &:focus-visible rule for this class draws replaces the browser's default focus indicator; keep that rule while this declaration stays. */\n outline: none;\n }\n &:focus-visible {\n outline-style: solid;\n outline-width: var(--nave-border-width-focus, 2px);\n outline-color: var(--nave-color-border-focus, currentColor);\n outline-offset: 2px;\n }\n }\n .input {\n box-sizing: border-box;\n min-block-size: var(--nave-size-control-md);\n padding-block: 0;\n padding-inline: var(--nave-spacing-control-md);\n border: var(--nave-border-width-sm) solid var(--nave-color-border-control);\n border-radius: var(--nave-radius-control);\n background-color: transparent;\n color: var(--nave-color-content-primary);\n font-family: inherit;\n font-size: var(--nave-font-size-sm);\n &::placeholder {\n color: var(--nave-color-content-tertiary);\n opacity: 1;\n }\n &[aria-invalid=\"true\"] {\n border-color: var(--nave-color-feedback-danger);\n border-width: var(--nave-border-width-mark);\n padding-inline: calc(\n var(--nave-spacing-control-md) - var(--nave-border-width-mark) +\n var(--nave-border-width-sm)\n );\n }\n &:disabled,\n &[aria-disabled=\"true\"] {\n border-color: var(--nave-color-border-disabled);\n color: var(--nave-color-content-disabled);\n cursor: not-allowed;\n }\n & {\n /* stylelint-disable-next-line declaration-property-value-disallowed-list -- the outline the &:focus-visible rule for this class draws replaces the browser's default focus indicator; keep that rule while this declaration stays. */\n outline: none;\n }\n &:focus-visible {\n outline-style: solid;\n outline-width: var(--nave-border-width-focus, 2px);\n outline-color: var(--nave-color-border-focus, currentColor);\n outline-offset: 2px;\n }\n }\n .toolbar {\n display: flex;\n align-items: center;\n gap: var(--nave-spacing-control-xs);\n padding: var(--nave-spacing-control-xs);\n border: var(--nave-border-width-sm) solid var(--nave-color-border-default);\n border-radius: var(--nave-radius-control);\n &[aria-orientation=\"vertical\"] {\n flex-direction: column;\n align-items: stretch;\n }\n }\n .toolbarGroup {\n display: flex;\n gap: var(--nave-spacing-control-xs);\n &[data-orientation=\"vertical\"] {\n flex-direction: column;\n }\n }\n .toolbarSeparator {\n flex: none;\n align-self: stretch;\n &[aria-orientation=\"vertical\"] {\n inline-size: 0;\n border-inline-start: var(--nave-border-width-sm) solid\n var(--nave-color-border-default);\n margin-inline: var(--nave-spacing-control-xs);\n }\n &[aria-orientation=\"horizontal\"] {\n block-size: 0;\n border-block-start: var(--nave-border-width-sm) solid\n var(--nave-color-border-default);\n margin-block: var(--nave-spacing-control-xs);\n }\n }\n .toolbarLink {\n display: inline-flex;\n align-items: center;\n padding-inline: var(--nave-spacing-control-sm);\n color: var(--nave-color-content-link);\n font-size: var(--nave-font-size-sm);\n /* stylelint-disable-next-line declaration-property-value-disallowed-list -- the outline the &:focus-visible rule for this class draws replaces the browser's default focus indicator; keep that rule while this declaration stays. */\n outline: none;\n &:focus-visible {\n outline-style: solid;\n outline-width: var(--nave-border-width-focus, 2px);\n outline-color: var(--nave-color-border-focus, currentColor);\n outline-offset: 2px;\n }\n }\n}\n",
|
|
32
32
|
"path": "registry/nave/nave-toolbar.module.css",
|
|
33
33
|
"target": "components/nave/nave-toolbar.module.css",
|
|
34
34
|
"type": "registry:file"
|
|
@@ -43,11 +43,11 @@
|
|
|
43
43
|
"meta": {
|
|
44
44
|
"peerDependencies": {
|
|
45
45
|
"@base-ui/react": "^1.3.0",
|
|
46
|
-
"@navecss/tokens": ">=0.
|
|
46
|
+
"@navecss/tokens": ">=0.5.0 <1.0.0",
|
|
47
47
|
"react": "^18 || ^19",
|
|
48
48
|
"react-dom": "^18 || ^19"
|
|
49
49
|
},
|
|
50
|
-
"version": "0.
|
|
50
|
+
"version": "0.4.0"
|
|
51
51
|
},
|
|
52
52
|
"name": "base-ui-toolbar",
|
|
53
53
|
"title": "NaveCSS styling of Base UI Toolbar",
|