@orcestr/ui 0.2.0 → 0.2.2

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Artasov
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -10,6 +10,9 @@
 
 # Orcestr UI
 
+[![npm](https://img.shields.io/npm/v/@orcestr/ui)](https://www.npmjs.com/package/@orcestr/ui)
+[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](./LICENSE)
+
 ## [Demo](https://orcestr.com/ui)
 
 Open the live example page to inspect Orcestr UI components and patterns in context.
@@ -142,6 +145,16 @@ For the first `0.0.1` release, commit the prepared package and push tag `ui-v0.0
 
 The workflow runs typecheck, tests, build and `npm pack --dry-run` before publishing `@orcestr/ui` to NPM.
 
+## Contributing
+
+Read [CONTRIBUTING.md](./CONTRIBUTING.md) before opening a pull request.
+
+Security issues should be reported privately according to [SECURITY.md](./SECURITY.md).
+
+## License
+
+MIT. See [LICENSE](./LICENSE).
+
 ## Ecosystem
 
 Orcestr UI is one of the first public pieces of the Orcestr ecosystem.

package/README.ru.md

@@ -10,6 +10,9 @@
 
 # Orcestr UI
 
+[![npm](https://img.shields.io/npm/v/@orcestr/ui)](https://www.npmjs.com/package/@orcestr/ui)
+[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](./LICENSE)
+
 ## [Demo](https://orcestr.com/ui)
 
 Открой live example page, чтобы посмотреть компоненты и паттерны Orcestr UI в контексте.
@@ -142,6 +145,16 @@ git push origin ui-v0.0.2
 
 Workflow перед публикацией `@orcestr/ui` в NPM запускает typecheck, tests, build и `npm pack --dry-run`.
 
+## Contributing
+
+Перед pull request прочитай [CONTRIBUTING.md](./CONTRIBUTING.md).
+
+Security issues нужно отправлять приватно по правилам из [SECURITY.md](./SECURITY.md).
+
+## License
+
+MIT. См. [LICENSE](./LICENSE).
+
 ## Экосистема
 
 Orcestr UI - одна из первых публичных частей экосистемы Orcestr.

package/dist/components/ContextMenu/ContextMenu.js

@@ -54,7 +54,7 @@ export function ContextMenu({ children, items, className, testId, }) {
                 } })] }));
 }
 function ContextMenuContent({ items, close, requestConfirmation, testId, }) {
-    return (_jsx("div", { className: "oui-menu-list", role: "menu", "data-testid": testId, children: items.map((item) => (_jsxs("div", { children: [item.separatorBefore ? _jsx("div", { className: "oui-menu-separator" }) : null, _jsxs("button", { type: "button", role: "menuitem", className: "oui-menu-item oui-combobox-option", "data-tone": item.tone, "data-selected": "false", "data-loading": item.loading ? 'true' : undefined, "data-testid": testId ? `${testId}-${item.key}` : undefined, "aria-busy": item.loading ? 'true' : undefined, disabled: isActionItemDisabled(item) || Boolean(item.children?.length), onClick: () => {
+    return (_jsx("div", { className: "oui-menu-list", role: "menu", "data-testid": testId, children: items.map((item) => (_jsxs("div", { children: [item.separatorBefore ? _jsx("div", { className: "oui-menu-separator" }) : null, _jsxs("button", { type: "button", role: "menuitem", className: "oui-menu-item", "data-tone": item.tone, "data-loading": item.loading ? 'true' : undefined, "data-testid": testId ? `${testId}-${item.key}` : undefined, "aria-busy": item.loading ? 'true' : undefined, disabled: isActionItemDisabled(item) || Boolean(item.children?.length), onClick: () => {
                         if (isActionItemDisabled(item) || item.children?.length)
                             return;
                         if (item.confirm) {

package/dist/components/Menu/Menu.js

@@ -35,7 +35,7 @@ function MenuList({ items, reserveIconSpace, inlineState, close, requestConfirma
         disabled: isActionItemDisabled(item),
         searchText: menuItemText(item),
     })), [items]);
-    const navigation = useListNavigation(navigationItems);
+    const navigation = useListNavigation(navigationItems, { highlightFirst: false });
     const highlightedKey = navigation.highlightedValue;
     useEffect(() => {
         if (autoFocus)
@@ -97,9 +97,9 @@ function MenuList({ items, reserveIconSpace, inlineState, close, requestConfirma
                 }
         }
     }, [close, handleTypeahead, navigation, selectHighlighted]);
-    return (_jsx("div", { ref: listRef, className: "oui-menu-list", role: "menu", tabIndex: 0, "data-testid": testId, onKeyDown: handleKeyDown, children: items.map((item) => (_jsx(MenuRow, { item: item, reserveIconSpace: reserveIconSpace, inlineState: inlineState, close: close, requestConfirmation: requestConfirmation, highlighted: highlightedKey === item.key, setHighlighted: () => navigation.setHighlightedValue(item.key), testId: testId ? `${testId}-${item.key}` : undefined }, item.key))) }));
+    return (_jsx("div", { ref: listRef, className: "oui-menu-list", role: "menu", tabIndex: 0, "data-testid": testId, onKeyDown: handleKeyDown, children: items.map((item) => (_jsx(MenuRow, { item: item, reserveIconSpace: reserveIconSpace, inlineState: inlineState, close: close, requestConfirmation: requestConfirmation, highlighted: highlightedKey === item.key, setHighlighted: () => navigation.setHighlightedValue(item.key), clearHighlighted: navigation.reset, testId: testId ? `${testId}-${item.key}` : undefined }, item.key))) }));
 }
-function MenuRow({ item, reserveIconSpace, inlineState, close, requestConfirmation, highlighted, setHighlighted, testId, }) {
+function MenuRow({ item, reserveIconSpace, inlineState, close, requestConfirmation, highlighted, setHighlighted, clearHighlighted, testId, }) {
     const [hoverOpen, setHoverOpen] = useState(false);
     const hasChildren = Boolean(item.children?.length);
     const inlineOpen = inlineState.openSubmenus.has(item.key);
@@ -107,7 +107,10 @@ function MenuRow({ item, reserveIconSpace, inlineState, close, requestConfirmati
     return (_jsxs("div", { className: "oui-menu-row", onMouseEnter: () => {
             setHighlighted();
             setHoverOpen(true);
-        }, onMouseLeave: () => setHoverOpen(false), children: [item.separatorBefore ? _jsx("div", { className: "oui-menu-separator" }) : null, _jsxs("button", { type: "button", className: "oui-menu-item oui-combobox-option", "data-tone": item.tone, "data-selected": "false", "data-highlighted": highlighted ? 'true' : undefined, "data-submenu-state": inlineOpen || hoverOpen ? 'open' : 'closed', "data-loading": item.loading ? 'true' : undefined, "data-testid": testId, "aria-busy": item.loading ? 'true' : undefined, disabled: isActionItemDisabled(item), tabIndex: -1, onClick: (event) => {
+        }, onMouseLeave: () => {
+            setHoverOpen(false);
+            clearHighlighted();
+        }, children: [item.separatorBefore ? _jsx("div", { className: "oui-menu-separator" }) : null, _jsxs("button", { type: "button", className: "oui-menu-item", "data-tone": item.tone, "data-highlighted": highlighted ? 'true' : undefined, "data-submenu-state": inlineOpen || hoverOpen ? 'open' : 'closed', "data-loading": item.loading ? 'true' : undefined, "data-testid": testId, "aria-busy": item.loading ? 'true' : undefined, disabled: isActionItemDisabled(item), tabIndex: -1, onClick: (event) => {
                     event.stopPropagation();
                     if (isActionItemDisabled(item))
                         return;

package/dist/hooks/useListNavigation.d.ts

@@ -3,10 +3,11 @@ export type ListNavigationItem = {
     disabled?: boolean;
     searchText?: string;
 };
-export declare function useListNavigation(items: ReadonlyArray<ListNavigationItem>, { value, }?: {
+export declare function useListNavigation(items: ReadonlyArray<ListNavigationItem>, { highlightFirst, value, }?: {
+    highlightFirst?: boolean;
     value?: string | null;
 }): {
-    highlightedValue: string;
+    highlightedValue: string | null;
     setHighlightedValue: import("react").Dispatch<import("react").SetStateAction<string | null>>;
     move: (direction: 1 | -1) => void;
     first: () => void;

package/dist/hooks/useListNavigation.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useListNavigation.d.ts","sourceRoot":"","sources":["../../src/hooks/useListNavigation.ts"],"names":[],"mappings":"AAIA,MAAM,MAAM,kBAAkB,GAAG;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC;AAEF,wBAAgB,iBAAiB,CAC7B,KAAK,EAAE,aAAa,CAAC,kBAAkB,CAAC,EACxC,EACI,KAAY,GACf,GAAE;IACC,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CACpB;;;sBAgBU,CAAC,GAAG,CAAC,CAAC;;;;;EAiCzB"}
+{"version":3,"file":"useListNavigation.d.ts","sourceRoot":"","sources":["../../src/hooks/useListNavigation.ts"],"names":[],"mappings":"AAIA,MAAM,MAAM,kBAAkB,GAAG;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC;AAEF,wBAAgB,iBAAiB,CAC7B,KAAK,EAAE,aAAa,CAAC,kBAAkB,CAAC,EACxC,EACI,cAAqB,EACrB,KAAY,GACf,GAAE;IACC,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CACpB;;;sBAgBU,CAAC,GAAG,CAAC,CAAC;;;;;EAiCzB"}

package/dist/hooks/useListNavigation.js

@@ -1,6 +1,6 @@
 'use client';
 import { useCallback, useMemo, useState } from 'react';
-export function useListNavigation(items, { value = null, } = {}) {
+export function useListNavigation(items, { highlightFirst = true, value = null, } = {}) {
     const enabledItems = useMemo(() => items.filter((item) => !item.disabled), [items]);
     const [requestedValue, setRequestedValue] = useState(null);
     const highlightedValue = useMemo(() => {
@@ -10,8 +10,8 @@ export function useListNavigation(items, { value = null, } = {}) {
         if (value !== null && enabledItems.some((item) => item.value === value)) {
             return value;
         }
-        return enabledItems[0]?.value ?? null;
-    }, [enabledItems, requestedValue, value]);
+        return highlightFirst ? (enabledItems[0]?.value ?? null) : null;
+    }, [enabledItems, highlightFirst, requestedValue, value]);
     const move = useCallback((direction) => {
         if (enabledItems.length === 0)
             return;

package/dist/styles/orcestr-ui.css

@@ -3251,9 +3251,9 @@ a.oui-card {
 .oui-select-content {
   --oui-selection-content-text: var(--oui-text, #202020);
   --oui-selection-content-bg: var(--oui-floating-bg, var(--oui-bg, #ffffff));
-  --oui-selection-option-hover-bg: var(--oui-control-hover-bg, color-mix(in srgb, var(--oui-selection-content-text) 8%, transparent));
+  --oui-selection-option-hover-bg: var(--oui-pad-hover-bg, color-mix(in srgb, var(--oui-selection-content-text) 8%, transparent));
   --oui-selection-option-selected-bg: var(--oui-selected-bg, color-mix(in srgb, var(--oui-selection-content-text) 10%, transparent));
-  --oui-selection-option-selected-hover-bg: var(--oui-control-hover-bg, color-mix(in srgb, var(--oui-selection-content-text) 13%, transparent));
+  --oui-selection-option-selected-hover-bg: color-mix(in srgb, var(--oui-selection-option-selected-bg) 76%, var(--oui-selection-option-hover-bg));
   --oui-selection-check-color: var(--oui-primary-text, #0d74ce);
   min-width: 280px;
   max-width: min(420px, 100vw - 24px);
@@ -3263,26 +3263,6 @@ a.oui-card {
   background: var(--oui-selection-content-bg);
 }
 
-.oui-combobox-content[data-oui-theme=light],
-.oui-select-content[data-oui-theme=light] {
-  --oui-selection-content-text: #202020;
-  --oui-selection-content-bg: #ffffff;
-  --oui-selection-option-hover-bg: #0000000f;
-  --oui-selection-option-selected-bg: #008ff519;
-  --oui-selection-option-selected-hover-bg: #008ff526;
-  --oui-selection-check-color: #0d74ce;
-}
-
-.oui-combobox-content[data-oui-theme=dark],
-.oui-select-content[data-oui-theme=dark] {
-  --oui-selection-content-text: #eeeeee;
-  --oui-selection-content-bg: #0c0c0f;
-  --oui-selection-option-hover-bg: #ffffff12;
-  --oui-selection-option-selected-bg: #0077ff3a;
-  --oui-selection-option-selected-hover-bg: #0077ff52;
-  --oui-selection-check-color: #70b8ff;
-}
-
 .oui-combobox-search-wrap {
   display: flex;
   align-items: center;

package/dist/theme/defaultTheme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"defaultTheme.d.ts","sourceRoot":"","sources":["../../src/theme/defaultTheme.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACR,YAAY,EACZ,gBAAgB,EAChB,qBAAqB,EACrB,mBAAmB,EACtB,MAAM,cAAc,CAAC;AAItB,MAAM,MAAM,6BAA6B,GAAG;IACxC,KAAK,EAAE,mBAAmB,CAAC;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;CACvB,CAAC;AAEF,eAAO,MAAM,2BAA2B,EAAE,MAAM,CAC5C,mBAAmB,EACnB,6BAA6B,CAsBhC,CAAC;AAEF,eAAO,MAAM,oBAAoB,EAAE,6BAA6B,EAK/D,CAAC;AA0rBF,wBAAgB,WAAW,CACvB,IAAI,EAAE,gBAAgB,EACtB,OAAO,GAAE,mBAA+B,EACxC,cAAc,CAAC,EAAE,qBAAqB,GACvC,YAAY,CASd;AAED,eAAO,MAAM,SAAS,EAAE,YAAkC,CAAC;AAC3D,eAAO,MAAM,UAAU,EAAE,YAAmC,CAAC"}
+{"version":3,"file":"defaultTheme.d.ts","sourceRoot":"","sources":["../../src/theme/defaultTheme.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACR,YAAY,EACZ,gBAAgB,EAChB,qBAAqB,EACrB,mBAAmB,EACtB,MAAM,cAAc,CAAC;AAItB,MAAM,MAAM,6BAA6B,GAAG;IACxC,KAAK,EAAE,mBAAmB,CAAC;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;CACvB,CAAC;AAEF,eAAO,MAAM,2BAA2B,EAAE,MAAM,CAC5C,mBAAmB,EACnB,6BAA6B,CAsBhC,CAAC;AAEF,eAAO,MAAM,oBAAoB,EAAE,6BAA6B,EAK/D,CAAC;AAivBF,wBAAgB,WAAW,CACvB,IAAI,EAAE,gBAAgB,EACtB,OAAO,GAAE,mBAA+B,EACxC,cAAc,CAAC,EAAE,qBAAqB,GACvC,YAAY,CASd;AAED,eAAO,MAAM,SAAS,EAAE,YAAkC,CAAC;AAC3D,eAAO,MAAM,UAAU,EAAE,YAAmC,CAAC"}

package/dist/theme/defaultTheme.js

@@ -387,22 +387,77 @@ const surfaceOverrides = {
     orcestr: {
         dark: {
             colors: {
+                bg: '#0d0b13',
+                panel: '#14101f',
+                panelSoft: '#1d172b',
+                floating: '#14101f',
+                text: '#f8f5ff',
+                muted: '#cfc6dd',
+                border: 'rgb(255 255 255 / 6%)',
+                borderStrong: 'rgb(168 139 250 / 18%)',
+                pad: 'rgb(255 255 255 / 7%)',
+                padHover: 'rgb(255 255 255 / 10%)',
                 primary: {
-                    base: '#6e56cf',
-                    text: '#baa7ff',
-                    surface: '#8354fe36',
-                    border: '#8f6cfd6d',
+                    base: '#7c3aed',
+                    text: '#d8ccff',
+                    surface: 'rgb(124 58 237 / 16%)',
+                    border: 'rgb(168 139 250 / 18%)',
                     contrast: '#ffffff',
                 },
-                selected: '#8354fe36',
-                focusRing: '0 0 0 3px #7d51fd50',
+                selected: 'rgb(124 58 237 / 16%)',
+                focusRing: '0 0 0 3px rgb(124 58 237 / 30%)',
+                success: {
+                    base: '#22c55e',
+                    text: '#86efac',
+                    surface: 'rgb(34 197 94 / 12%)',
+                    border: 'rgb(34 197 94 / 16%)',
+                    contrast: '#111111',
+                },
+                warning: {
+                    base: '#f59e0b',
+                    text: '#fbbf24',
+                    surface: 'rgb(245 158 11 / 13%)',
+                    border: 'rgb(245 158 11 / 18%)',
+                    contrast: '#111111',
+                },
+                info: {
+                    base: '#60a5fa',
+                    text: '#93c5fd',
+                    surface: 'rgb(37 99 235 / 16%)',
+                    border: 'rgb(96 165 250 / 18%)',
+                    contrast: '#111111',
+                },
+            },
+            shadows: {
+                sm: 'inset 0 0 0 1px rgb(255 255 255 / 6%), inset 0 1px 1px rgb(255 255 255 / 5%)',
+                md: '0 0 0 1px rgb(255 255 255 / 6%), 0 12px 28px rgb(0 0 0 / 16%)',
+                overlay: '0 24px 70px rgb(0 0 0 / 34%)',
+                section: '0 18px 54px rgb(0 0 0 / 22%)',
             },
             status: {
                 primary: {
-                    color: '#6e56cf',
-                    text: '#baa7ff',
-                    soft: '#8354fe36',
-                    border: '#8f6cfd6d',
+                    color: '#7c3aed',
+                    text: '#d8ccff',
+                    soft: 'rgb(124 58 237 / 16%)',
+                    border: 'rgb(168 139 250 / 18%)',
+                },
+                success: {
+                    color: '#22c55e',
+                    text: '#86efac',
+                    soft: 'rgb(34 197 94 / 12%)',
+                    border: 'rgb(34 197 94 / 16%)',
+                },
+                warning: {
+                    color: '#f59e0b',
+                    text: '#fbbf24',
+                    soft: 'rgb(245 158 11 / 13%)',
+                    border: 'rgb(245 158 11 / 18%)',
+                },
+                info: {
+                    color: '#60a5fa',
+                    text: '#93c5fd',
+                    soft: 'rgb(37 99 235 / 16%)',
+                    border: 'rgb(96 165 250 / 18%)',
                 },
             },
         },

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@orcestr/ui",
-  "version": "0.2.0",
+  "version": "0.2.2",
   "description": "Shared React UI package for Orcestr products.",
-  "license": "UNLICENSED",
+  "license": "MIT",
   "type": "module",
   "repository": {
     "type": "git",
@@ -20,6 +20,7 @@
     "dist",
     "README.md",
     "README.ru.md",
+    "LICENSE",
     "assets"
   ],
   "publishConfig": {