@orcestr/ui 0.1.1 → 0.2.1

package/dist/example/ExampleStateSection.js

@@ -115,18 +115,18 @@ import {LuCircleAlert, LuCircleCheck, LuCircleX, LuInfo, LuLoaderCircle} from 'r
     <IconText icon={<LuInfo />} iconTone='info' fs='13px'>Sync scheduled</IconText>
 </Flex>`,
 };
-export function BadgeSection({ onOpenCode, }) {
+export function BadgeSection({ onOpenCode }) {
     const [status, setStatus] = useState('review');
     const statusItems = [
         { value: 'draft', label: 'Draft' },
         { value: 'review', label: 'Review' },
         { value: 'accepted', label: 'Accepted' },
     ];
-    return (_jsx(UiExampleSection, { id: 'badges-example', title: 'Badge', description: 'Compact counters and statuses without a special wrapper.', children: _jsx(ExampleTile, { title: 'Badge', code: badgeSample.code, onOpen: onOpenCode, children: _jsxs(Flex, { g: 2, wrap: true, children: [_jsxs(Badge, { tone: 'neutral', children: ["Requested ", _jsx("strong", { children: "43" })] }), _jsxs(Badge, { tone: 'info', icon: _jsx(LuClock3, {}), children: ["Ordered ", _jsx("strong", { children: "12" })] }), _jsxs(Badge, { tone: 'success', icon: _jsx(LuPackageCheck, {}), children: ["Accepted ", _jsx("strong", { children: "8" })] }), _jsx(Badge, { tone: 'warning', v: 'surface', icon: _jsx(LuShieldCheck, {}), children: "Review" }), _jsx(Badge, { tone: 'danger', v: 'outline', children: "Blocked" }), _jsx(Badge, { tone: 'primary', v: 'solid', children: "Primary" }), _jsx(BadgeSelectMenu, { value: status, items: statusItems, onValueChange: setStatus, tone: 'warning' })] }) }) }));
+    return (_jsx(UiExampleSection, { id: "badges-example", title: "Badge", description: "Compact counters and statuses without a special wrapper.", children: _jsx(ExampleTile, { title: "Badge", code: badgeSample.code, onOpen: onOpenCode, children: _jsxs(Flex, { g: 2, wrap: true, children: [_jsxs(Badge, { tone: "neutral", children: ["Requested ", _jsx("strong", { children: "43" })] }), _jsxs(Badge, { tone: "info", icon: _jsx(LuClock3, {}), children: ["Ordered ", _jsx("strong", { children: "12" })] }), _jsxs(Badge, { tone: "success", icon: _jsx(LuPackageCheck, {}), children: ["Accepted ", _jsx("strong", { children: "8" })] }), _jsx(Badge, { tone: "warning", v: "surface", icon: _jsx(LuShieldCheck, {}), children: "Review" }), _jsx(Badge, { tone: "danger", v: "outline", children: "Blocked" }), _jsx(Badge, { tone: "primary", v: "solid", children: "Primary" }), _jsx(BadgeSelectMenu, { value: status, items: statusItems, onValueChange: setStatus, tone: "warning" })] }) }) }));
 }
-export function StateCardSection({ onOpenCode, }) {
-    return (_jsx(UiExampleSection, { id: 'state-card-example', title: 'StateCard', description: 'Block-level state for empty, loading, error, access and status surfaces.', children: _jsx(ExampleTile, { title: 'StateCard', code: stateCardSample.code, onOpen: onOpenCode, children: _jsxs(Stack, { g: 2, children: [_jsx(StateCard, { tone: 'info', title: 'General state', description: 'One card for informational, empty, loading and error states.' }), _jsxs(Grid, { columns: 'repeat(auto-fit, minmax(min(100%, 260px), 1fr))', g: 2, children: [_jsx(StateCard, { v: 'surface', tone: 'primary', title: 'Surface', titleTone: 'primary', description: 'Uses the regular surface with a toned title.', descriptionTone: 'muted' }), _jsx(StateCard, { v: 'outline', tone: 'warning', title: 'Outline', description: 'Useful when the card should stay quiet.' }), _jsx(StateCard, { v: 'ghost', tone: 'success', title: 'Ghost', description: 'No extra background.' })] }), _jsx(StateCard, { tone: 'danger', title: 'Validation failed', children: _jsx(Stack, { g: 1, children: validationItems.map((item) => (_jsxs(Text, { fs: '13px', lh: 1.3, children: [_jsxs("strong", { children: [item.label, ": "] }), item.message] }, item.key))) }) }), _jsxs(Grid, { columns: 'repeat(auto-fit, minmax(min(100%, 260px), 1fr))', g: 2, children: [_jsx(EmptyState, { compact: true, description: 'No records yet.' }), _jsx(LoadingState, { compact: true, description: 'Loading the next page.' }), _jsx(ErrorState, { compact: true, description: 'Request failed.', onRetry: () => undefined })] }), _jsx(StateCard, { tone: 'success', title: 'Saved', description: 'Changes were applied.', action: _jsx(Button, { size: 1, v: 'surface', children: "Open" }) })] }) }) }));
+export function StateCardSection({ onOpenCode }) {
+    return (_jsx(UiExampleSection, { id: "state-card-example", title: "StateCard", description: "Block-level state for empty, loading, error, access and status surfaces.", children: _jsx(ExampleTile, { title: "StateCard", code: stateCardSample.code, onOpen: onOpenCode, children: _jsxs(Stack, { g: 2, children: [_jsx(StateCard, { tone: "info", title: "General state", description: "One card for informational, empty, loading and error states." }), _jsxs(Grid, { columns: "repeat(auto-fit, minmax(min(100%, 260px), 1fr))", g: 2, children: [_jsx(StateCard, { v: "surface", tone: "primary", title: "Surface", titleTone: "primary", description: "Uses the regular surface with a toned title.", descriptionTone: "muted" }), _jsx(StateCard, { v: "outline", tone: "warning", title: "Outline", description: "Useful when the card should stay quiet." }), _jsx(StateCard, { v: "ghost", tone: "success", title: "Ghost", description: "No extra background." })] }), _jsx(StateCard, { tone: "danger", title: "Validation failed", children: _jsx(Stack, { g: 1, children: validationItems.map((item) => (_jsxs(Text, { fs: "13px", lh: 1.3, children: [_jsxs("strong", { children: [item.label, ": "] }), item.message] }, item.key))) }) }), _jsxs(Grid, { columns: "repeat(auto-fit, minmax(min(100%, 260px), 1fr))", g: 2, children: [_jsx(EmptyState, { compact: true, description: "No records yet." }), _jsx(LoadingState, { compact: true, description: "Loading the next page." }), _jsx(ErrorState, { compact: true, description: "Request failed.", onRetry: () => undefined })] }), _jsx(StateCard, { tone: "success", title: "Saved", description: "Changes were applied.", action: _jsx(Button, { size: 1, v: "surface", children: "Open" }) })] }) }) }));
 }
-export function IconTextSection({ onOpenCode, }) {
-    return (_jsx(UiExampleSection, { id: 'icon-text-example', title: 'IconText', description: 'Inline text primitive with an icon, text props and independent icon tone.', children: _jsx(ExampleTile, { title: 'IconText', code: iconTextSample.code, onOpen: onOpenCode, children: _jsxs(Flex, { g: 2, wrap: true, children: [_jsx(IconText, { icon: _jsx(LuLoaderCircle, {}), iconTone: 'info', iconSpin: true, children: "Saving changes" }), _jsx(IconText, { icon: _jsx(LuCircleCheck, {}), iconTone: 'success', children: "Saved" }), _jsx(IconText, { icon: _jsx(LuCircleX, {}), iconTone: 'danger', children: "Save failed" }), _jsx(IconText, { icon: _jsx(LuCircleAlert, {}), iconTone: 'warning', fw: 760, children: "Review required" }), _jsx(IconText, { icon: _jsx(LuInfo, {}), iconTone: 'info', fs: '13px', children: "Sync scheduled" })] }) }) }));
+export function IconTextSection({ onOpenCode }) {
+    return (_jsx(UiExampleSection, { id: "icon-text-example", title: "IconText", description: "Inline text primitive with an icon, text props and independent icon tone.", children: _jsx(ExampleTile, { title: "IconText", code: iconTextSample.code, onOpen: onOpenCode, children: _jsxs(Flex, { g: 2, wrap: true, children: [_jsx(IconText, { icon: _jsx(LuLoaderCircle, {}), iconTone: "info", iconSpin: true, children: "Saving changes" }), _jsx(IconText, { icon: _jsx(LuCircleCheck, {}), iconTone: "success", children: "Saved" }), _jsx(IconText, { icon: _jsx(LuCircleX, {}), iconTone: "danger", children: "Save failed" }), _jsx(IconText, { icon: _jsx(LuCircleAlert, {}), iconTone: "warning", fw: 760, children: "Review required" }), _jsx(IconText, { icon: _jsx(LuInfo, {}), iconTone: "info", fs: "13px", children: "Sync scheduled" })] }) }) }));
 }

package/dist/example/ExampleThemePlayground.d.ts

@@ -32,17 +32,17 @@ export declare const themePlaygroundPresets: readonly [{
     readonly previewText: "#f4f6f8";
     readonly group: "dark";
 }, {
-    readonly id: "operations-dark";
+    readonly id: "deliveries-dark";
     readonly label: {
-        readonly ru: "Operations";
-        readonly en: "Operations";
+        readonly ru: "Deliveries";
+        readonly en: "Deliveries";
     };
     readonly description: {
         readonly ru: "Плотная тема для повторяющейся операционной работы.";
-        readonly en: "Dense theme for repeated operational work.";
+        readonly en: "Dense theme for deliveries workflows.";
     };
     readonly mode: "dark";
-    readonly surface: "operations";
+    readonly surface: "deliveries";
     readonly accent: "#34d399";
     readonly previewBg: "#07140f";
     readonly previewPanel: "#0d2119";
@@ -166,17 +166,17 @@ export declare const themePlaygroundPresets: readonly [{
         };
     };
 }, {
-    readonly id: "media-dark";
+    readonly id: "beauty-dark";
     readonly label: {
-        readonly ru: "Media dark";
-        readonly en: "Media dark";
+        readonly ru: "Beauty dark";
+        readonly en: "Beauty dark";
     };
     readonly description: {
         readonly ru: "Мягкая темная тема для контентных интерфейсов.";
         readonly en: "Soft dark theme for content-heavy interfaces.";
     };
     readonly mode: "dark";
-    readonly surface: "media";
+    readonly surface: "beauty";
     readonly accent: "#f0a6d8";
     readonly previewBg: "#141116";
     readonly previewPanel: "#1d1820";
@@ -204,17 +204,17 @@ export declare const themePlaygroundPresets: readonly [{
         };
     };
 }, {
-    readonly id: "catalog-dark";
+    readonly id: "jewelry-dark";
     readonly label: {
-        readonly ru: "Catalog dark";
-        readonly en: "Catalog dark";
+        readonly ru: "Jewelry dark";
+        readonly en: "Jewelry dark";
     };
     readonly description: {
         readonly ru: "Точная темная тема для структурированных каталогов.";
         readonly en: "Precise dark theme for structured index surfaces.";
     };
     readonly mode: "dark";
-    readonly surface: "catalog";
+    readonly surface: "jewelry";
     readonly accent: "#e6c26a";
     readonly previewBg: "#11100d";
     readonly previewPanel: "#191712";
@@ -276,17 +276,17 @@ export declare const themePlaygroundPresets: readonly [{
     readonly previewText: "#111827";
     readonly group: "light";
 }, {
-    readonly id: "operations-light";
+    readonly id: "deliveries-light";
     readonly label: {
-        readonly ru: "Operations light";
-        readonly en: "Operations light";
+        readonly ru: "Deliveries light";
+        readonly en: "Deliveries light";
     };
     readonly description: {
         readonly ru: "Плотная светлая тема для повторяющейся операционной работы.";
         readonly en: "Dense light theme for repeated operational work.";
     };
     readonly mode: "light";
-    readonly surface: "operations";
+    readonly surface: "deliveries";
     readonly accent: "#047857";
     readonly previewBg: "#eefbf4";
     readonly previewPanel: "#ffffff";
@@ -308,17 +308,17 @@ export declare const themePlaygroundPresets: readonly [{
         };
     };
 }, {
-    readonly id: "media-light";
+    readonly id: "beauty-light";
     readonly label: {
-        readonly ru: "Media light";
-        readonly en: "Media light";
+        readonly ru: "Beauty light";
+        readonly en: "Beauty light";
     };
     readonly description: {
         readonly ru: "Мягкая светлая тема для контентных интерфейсов.";
         readonly en: "Soft light theme for content-heavy interfaces.";
     };
     readonly mode: "light";
-    readonly surface: "media";
+    readonly surface: "beauty";
     readonly accent: "#db2777";
     readonly previewBg: "#fff1f8";
     readonly previewPanel: "#ffffff";
@@ -340,17 +340,17 @@ export declare const themePlaygroundPresets: readonly [{
         };
     };
 }, {
-    readonly id: "catalog-light";
+    readonly id: "jewelry-light";
     readonly label: {
-        readonly ru: "Catalog light";
-        readonly en: "Catalog light";
+        readonly ru: "Jewelry light";
+        readonly en: "Jewelry light";
     };
     readonly description: {
         readonly ru: "Теплая светлая тема для структурированных каталогов.";
         readonly en: "Warm light theme for structured index surfaces.";
     };
     readonly mode: "light";
-    readonly surface: "catalog";
+    readonly surface: "jewelry";
     readonly accent: "#9b6f12";
     readonly previewBg: "#fbfaf6";
     readonly previewPanel: "#ffffff";

package/dist/example/ExampleThemePlayground.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ExampleThemePlayground.d.ts","sourceRoot":"","sources":["../../src/example/ExampleThemePlayground.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAsB,KAAK,aAAa,EAAE,KAAK,QAAQ,EAAE,KAAK,cAAc,EAAC,MAAM,OAAO,CAAC;AAElG,OAAO,EAOH,KAAK,YAAY,EACjB,KAAK,gBAAgB,EACrB,KAAK,qBAAqB,EAC1B,KAAK,mBAAmB,EAExB,KAAK,eAAe,EACvB,MAAM,IAAI,CAAC;AAEZ,KAAK,aAAa,GAAG,MAAM,CAAC,eAAe,EAAE,MAAM,CAAC,CAAC;AAErD,MAAM,MAAM,WAAW,GAAG;IACtB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,aAAa,CAAC;IACrB,WAAW,EAAE,aAAa,CAAC;IAC3B,IAAI,EAAE,gBAAgB,CAAC;IACvB,OAAO,EAAE,mBAAmB,CAAC;IAC7B,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,EAAE,MAAM,CAAC;IAClB,YAAY,EAAE,MAAM,CAAC;IACrB,WAAW,EAAE,MAAM,CAAC;IACpB,KAAK,EAAE,MAAM,GAAG,OAAO,CAAC;IACxB,SAAS,CAAC,EAAE,qBAAqB,CAAC;CACrC,CAAC;AAEF,eAAO,MAAM,sBAAsB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAyaY,CAAC;AAOhD,MAAM,MAAM,aAAa,GAAG,CAAC,OAAO,sBAAsB,CAAC,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,CAAC;AAE1E,wBAAgB,wBAAwB,CAAC,EAAE,EAAE,aAAa,GAAG,WAAW,CAEvE;AAED,wBAAgB,gBAAgB,CAAC,MAAM,EAAE,WAAW,EAAE,MAAM,EAAE,eAAe,UAE5E;AAED,wBAAgB,sBAAsB,CAAC,MAAM,EAAE,WAAW,EAAE,MAAM,EAAE,eAAe,UAElF;AA6FD,wBAAgB,sBAAsB,CAAC,EACnC,cAAc,EACd,KAAK,EACL,MAAM,EACN,cAAc,EACd,sBAAsB,GACzB,EAAE;IACC,cAAc,EAAE,aAAa,CAAC;IAC9B,KAAK,EAAE,YAAY,CAAC;IACpB,MAAM,EAAE,eAAe,CAAC;IACxB,cAAc,EAAE,CAAC,MAAM,EAAE,WAAW,KAAK,IAAI,CAAC;IAC9C,sBAAsB,EAAE,QAAQ,CAAC,cAAc,CAAC,qBAAqB,CAAC,CAAC,CAAC;CAC3E,2CAwFA;AAED,wBAAgB,mBAAmB,CAAC,EAChC,cAAc,EACd,MAAM,EACN,cAAc,GACjB,EAAE;IACC,cAAc,EAAE,aAAa,CAAC;IAC9B,MAAM,EAAE,eAAe,CAAC;IACxB,cAAc,EAAE,CAAC,MAAM,EAAE,WAAW,KAAK,IAAI,CAAC;CACjD,2CAkDA;AAED,wBAAgB,uBAAuB,CAAC,MAAM,EAAE,WAAW,GAMlD,aAAa,CACrB"}
+{"version":3,"file":"ExampleThemePlayground.d.ts","sourceRoot":"","sources":["../../src/example/ExampleThemePlayground.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAuB,KAAK,aAAa,EAAE,KAAK,QAAQ,EAAE,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AAEpG,OAAO,EAOH,KAAK,YAAY,EACjB,KAAK,gBAAgB,EACrB,KAAK,qBAAqB,EAC1B,KAAK,mBAAmB,EAExB,KAAK,eAAe,EACvB,MAAM,IAAI,CAAC;AAEZ,KAAK,aAAa,GAAG,MAAM,CAAC,eAAe,EAAE,MAAM,CAAC,CAAC;AAErD,MAAM,MAAM,WAAW,GAAG;IACtB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,aAAa,CAAC;IACrB,WAAW,EAAE,aAAa,CAAC;IAC3B,IAAI,EAAE,gBAAgB,CAAC;IACvB,OAAO,EAAE,mBAAmB,CAAC;IAC7B,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,EAAE,MAAM,CAAC;IAClB,YAAY,EAAE,MAAM,CAAC;IACrB,WAAW,EAAE,MAAM,CAAC;IACpB,KAAK,EAAE,MAAM,GAAG,OAAO,CAAC;IACxB,SAAS,CAAC,EAAE,qBAAqB,CAAC;CACrC,CAAC;AAEF,eAAO,MAAM,sBAAsB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAyaY,CAAC;AAOhD,MAAM,MAAM,aAAa,GAAG,CAAC,OAAO,sBAAsB,CAAC,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,CAAC;AAE1E,wBAAgB,wBAAwB,CAAC,EAAE,EAAE,aAAa,GAAG,WAAW,CAEvE;AAED,wBAAgB,gBAAgB,CAAC,MAAM,EAAE,WAAW,EAAE,MAAM,EAAE,eAAe,UAE5E;AAED,wBAAgB,sBAAsB,CAAC,MAAM,EAAE,WAAW,EAAE,MAAM,EAAE,eAAe,UAElF;AA0GD,wBAAgB,sBAAsB,CAAC,EACnC,cAAc,EACd,KAAK,EACL,MAAM,EACN,cAAc,EACd,sBAAsB,GACzB,EAAE;IACC,cAAc,EAAE,aAAa,CAAC;IAC9B,KAAK,EAAE,YAAY,CAAC;IACpB,MAAM,EAAE,eAAe,CAAC;IACxB,cAAc,EAAE,CAAC,MAAM,EAAE,WAAW,KAAK,IAAI,CAAC;IAC9C,sBAAsB,EAAE,QAAQ,CAAC,cAAc,CAAC,qBAAqB,CAAC,CAAC,CAAC;CAC3E,2CAwFA;AAED,wBAAgB,mBAAmB,CAAC,EAChC,cAAc,EACd,MAAM,EACN,cAAc,GACjB,EAAE;IACC,cAAc,EAAE,aAAa,CAAC;IAC9B,MAAM,EAAE,eAAe,CAAC;IACxB,cAAc,EAAE,CAAC,MAAM,EAAE,WAAW,KAAK,IAAI,CAAC;CACjD,2CAoDA;AAED,wBAAgB,uBAAuB,CAAC,MAAM,EAAE,WAAW,GAMlD,aAAa,CACrB"}

package/dist/example/ExampleThemePlayground.js

@@ -22,17 +22,17 @@ export const themePlaygroundPresets = [
         group: 'dark',
     },
     {
-        id: 'operations-dark',
+        id: 'deliveries-dark',
         label: {
-            ru: 'Operations',
-            en: 'Operations',
+            ru: 'Deliveries',
+            en: 'Deliveries',
         },
         description: {
             ru: 'Плотная тема для повторяющейся операционной работы.',
-            en: 'Dense theme for repeated operational work.',
+            en: 'Dense theme for deliveries workflows.',
         },
         mode: 'dark',
-        surface: 'operations',
+        surface: 'deliveries',
         accent: '#34d399',
         previewBg: '#07140f',
         previewPanel: '#0d2119',
@@ -159,17 +159,17 @@ export const themePlaygroundPresets = [
         },
     },
     {
-        id: 'media-dark',
+        id: 'beauty-dark',
         label: {
-            ru: 'Media dark',
-            en: 'Media dark',
+            ru: 'Beauty dark',
+            en: 'Beauty dark',
         },
         description: {
             ru: 'Мягкая темная тема для контентных интерфейсов.',
             en: 'Soft dark theme for content-heavy interfaces.',
         },
         mode: 'dark',
-        surface: 'media',
+        surface: 'beauty',
         accent: '#f0a6d8',
         previewBg: '#141116',
         previewPanel: '#1d1820',
@@ -198,17 +198,17 @@ export const themePlaygroundPresets = [
         },
     },
     {
-        id: 'catalog-dark',
+        id: 'jewelry-dark',
         label: {
-            ru: 'Catalog dark',
-            en: 'Catalog dark',
+            ru: 'Jewelry dark',
+            en: 'Jewelry dark',
         },
         description: {
             ru: 'Точная темная тема для структурированных каталогов.',
             en: 'Precise dark theme for structured index surfaces.',
         },
         mode: 'dark',
-        surface: 'catalog',
+        surface: 'jewelry',
         accent: '#e6c26a',
         previewBg: '#11100d',
         previewPanel: '#191712',
@@ -273,17 +273,17 @@ export const themePlaygroundPresets = [
         group: 'light',
     },
     {
-        id: 'operations-light',
+        id: 'deliveries-light',
         label: {
-            ru: 'Operations light',
-            en: 'Operations light',
+            ru: 'Deliveries light',
+            en: 'Deliveries light',
         },
         description: {
             ru: 'Плотная светлая тема для повторяющейся операционной работы.',
             en: 'Dense light theme for repeated operational work.',
         },
         mode: 'light',
-        surface: 'operations',
+        surface: 'deliveries',
         accent: '#047857',
         previewBg: '#eefbf4',
         previewPanel: '#ffffff',
@@ -306,17 +306,17 @@ export const themePlaygroundPresets = [
         },
     },
     {
-        id: 'media-light',
+        id: 'beauty-light',
         label: {
-            ru: 'Media light',
-            en: 'Media light',
+            ru: 'Beauty light',
+            en: 'Beauty light',
         },
         description: {
             ru: 'Мягкая светлая тема для контентных интерфейсов.',
             en: 'Soft light theme for content-heavy interfaces.',
         },
         mode: 'light',
-        surface: 'media',
+        surface: 'beauty',
         accent: '#db2777',
         previewBg: '#fff1f8',
         previewPanel: '#ffffff',
@@ -339,17 +339,17 @@ export const themePlaygroundPresets = [
         },
     },
     {
-        id: 'catalog-light',
+        id: 'jewelry-light',
         label: {
-            ru: 'Catalog light',
-            en: 'Catalog light',
+            ru: 'Jewelry light',
+            en: 'Jewelry light',
         },
         description: {
             ru: 'Теплая светлая тема для структурированных каталогов.',
             en: 'Warm light theme for structured index surfaces.',
         },
         mode: 'light',
-        surface: 'catalog',
+        surface: 'jewelry',
         accent: '#9b6f12',
         previewBg: '#fbfaf6',
         previewPanel: '#ffffff',
@@ -456,7 +456,15 @@ const flatTokenSections = [
     'zIndex',
     'components',
 ];
-const statusKeys = ['neutral', 'primary', 'secondary', 'success', 'warning', 'danger', 'info'];
+const statusKeys = [
+    'neutral',
+    'primary',
+    'secondary',
+    'success',
+    'warning',
+    'danger',
+    'info',
+];
 const COLOR_TOKEN_COMMIT_DELAY_MS = 180;
 const themePlaygroundCopy = {
     ru: {
@@ -517,7 +525,7 @@ const themePlaygroundCopy = {
 export function ExampleThemePlayground({ activePresetId, theme, locale, onPresetChange, onThemeOverridesChange, }) {
     const activePreset = getThemePlaygroundPreset(activePresetId);
     const copy = themePlaygroundCopy[locale];
-    return (_jsxs("section", { id: 'theme', className: 'oui-section oui-ui-section', children: [_jsx("div", { className: 'oui-ui-section-head', children: _jsxs("div", { children: [_jsx("h2", { className: 'oui-ui-section-title', children: copy.title }), _jsx("p", { className: 'oui-ui-description', children: copy.description })] }) }), _jsxs("div", { className: 'oui-theme-playground', children: [_jsx(Stack, { className: 'oui-theme-playground-presets', g: 2, children: _jsx(ThemePresetSelector, { activePresetId: activePreset.id, locale: locale, onPresetChange: onPresetChange }) }), _jsxs("div", { className: 'oui-section oui-theme-preview', children: [_jsxs("div", { className: 'oui-theme-preview-head', children: [_jsx(Text, { fw: 760, children: copy.tokenEditor }), _jsx(Button, { size: 1, v: 'surface', onClick: () => onPresetChange(activePreset), children: copy.resetPreset })] }), _jsxs(ScrollArea, { className: 'oui-theme-preview-scroll', highlights: true, highlightColor: 'var(--oui-section-nested-solid-bg)', highlightTop: {
+    return (_jsxs("section", { id: "theme", className: "oui-section oui-ui-section", children: [_jsx("div", { className: "oui-ui-section-head", children: _jsxs("div", { children: [_jsx("h2", { className: "oui-ui-section-title", children: copy.title }), _jsx("p", { className: "oui-ui-description", children: copy.description })] }) }), _jsxs("div", { className: "oui-theme-playground", children: [_jsx(Stack, { className: "oui-theme-playground-presets", g: 2, children: _jsx(ThemePresetSelector, { activePresetId: activePreset.id, locale: locale, onPresetChange: onPresetChange }) }), _jsxs("div", { className: "oui-section oui-theme-preview", children: [_jsxs("div", { className: "oui-theme-preview-head", children: [_jsx(Text, { fw: 760, children: copy.tokenEditor }), _jsx(Button, { size: 1, v: "surface", onClick: () => onPresetChange(activePreset), children: copy.resetPreset })] }), _jsxs(ScrollArea, { className: "oui-theme-preview-scroll", highlights: true, highlightColor: "var(--oui-section-nested-solid-bg)", highlightTop: {
                                     start: 2,
                                     fadeDistance: 28,
                                     maxOpacity: 0.94,
@@ -525,10 +533,10 @@ export function ExampleThemePlayground({ activePresetId, theme, locale, onPreset
                                     start: 2,
                                     fadeDistance: 28,
                                     maxOpacity: 0.94,
-                                }, children: [_jsxs("div", { className: 'oui-theme-token-editor', children: [flatTokenSections.map((section) => (_jsx(TokenSection, { title: tokenSectionLabel(section, locale), section: section, values: tokenSectionValues(theme, section), onTokenChange: (key, value) => updateFlatToken(onThemeOverridesChange, section, key, value) }, section))), statusKeys.map((statusKey) => (_jsx(TokenSection, { title: `${copy.statuses} / ${statusKey}`, section: 'status', statusKey: statusKey, values: theme.status[statusKey], onTokenChange: (key, value) => updateStatusToken(onThemeOverridesChange, statusKey, key, String(value)) }, `status-${statusKey}`)))] }), _jsxs(Flex, { g: 2, wrap: true, children: [_jsx(Button, { size: 1, children: copy.primaryAction }), _jsx(Button, { size: 1, v: 'surface', children: copy.surface }), _jsx(Button, { size: 1, v: 'ghost', children: copy.secondary }), _jsx(Badge, { tone: 'success', children: copy.ready }), _jsx(Badge, { tone: 'warning', children: copy.warning })] })] })] })] })] }));
+                                }, children: [_jsxs("div", { className: "oui-theme-token-editor", children: [flatTokenSections.map((section) => (_jsx(TokenSection, { title: tokenSectionLabel(section, locale), section: section, values: tokenSectionValues(theme, section), onTokenChange: (key, value) => updateFlatToken(onThemeOverridesChange, section, key, value) }, section))), statusKeys.map((statusKey) => (_jsx(TokenSection, { title: `${copy.statuses} / ${statusKey}`, section: "status", statusKey: statusKey, values: theme.status[statusKey], onTokenChange: (key, value) => updateStatusToken(onThemeOverridesChange, statusKey, key, String(value)) }, `status-${statusKey}`)))] }), _jsxs(Flex, { g: 2, wrap: true, children: [_jsx(Button, { size: 1, children: copy.primaryAction }), _jsx(Button, { size: 1, v: "surface", children: copy.surface }), _jsx(Button, { size: 1, v: "ghost", children: copy.secondary }), _jsx(Badge, { tone: "success", children: copy.ready }), _jsx(Badge, { tone: "warning", children: copy.warning })] })] })] })] })] }));
 }
 export function ThemePresetSelector({ activePresetId, locale, onPresetChange, }) {
-    return (_jsx("div", { className: 'oui-theme-preset-grid', children: themePresetGroups.map((group) => (_jsxs("div", { className: 'oui-theme-preset-group', children: [_jsx("div", { className: 'oui-theme-preset-group-label', children: group.label[locale] }), _jsx(ScrollArea, { className: 'oui-theme-preset-scroll', highlights: true, highlightColor: 'var(--oui-section-solid-bg)', highlightTop: {
+    return (_jsx("div", { className: "oui-theme-preset-grid", children: themePresetGroups.map((group) => (_jsxs("div", { className: "oui-theme-preset-group", children: [_jsx("div", { className: "oui-theme-preset-group-label", children: group.label[locale] }), _jsx(ScrollArea, { className: "oui-theme-preset-scroll", highlights: true, highlightColor: "var(--oui-section-solid-bg)", highlightTop: {
                         start: 1,
                         fadeDistance: 18,
                         maxOpacity: 0.94,
@@ -536,9 +544,9 @@ export function ThemePresetSelector({ activePresetId, locale, onPresetChange, })
                         start: 1,
                         fadeDistance: 18,
                         maxOpacity: 0.94,
-                    }, children: _jsx("div", { className: 'oui-theme-preset-list', children: themePlaygroundPresets
+                    }, children: _jsx("div", { className: "oui-theme-preset-list", children: themePlaygroundPresets
                             .filter((preset) => preset.group === group.key)
-                            .map((preset) => (_jsxs("button", { type: 'button', className: 'oui-theme-preset-card', "data-active": activePresetId === preset.id ? 'true' : undefined, style: themePresetPreviewStyle(preset), onClick: () => onPresetChange(preset), children: [_jsxs("span", { className: 'oui-theme-preset-preview', children: [_jsx("span", {}), _jsx("span", {}), _jsx("span", {})] }), _jsxs("span", { className: 'oui-theme-preset-body', children: [_jsx("strong", { children: themePresetLabel(preset, locale) }), _jsx("span", { children: themePresetDescription(preset, locale) })] })] }, preset.id))) }) })] }, group.key))) }));
+                            .map((preset) => (_jsxs("button", { type: "button", className: "oui-theme-preset-card", "data-active": activePresetId === preset.id ? 'true' : undefined, style: themePresetPreviewStyle(preset), onClick: () => onPresetChange(preset), children: [_jsxs("span", { className: "oui-theme-preset-preview", children: [_jsx("span", {}), _jsx("span", {}), _jsx("span", {})] }), _jsxs("span", { className: "oui-theme-preset-body", children: [_jsx("strong", { children: themePresetLabel(preset, locale) }), _jsx("span", { children: themePresetDescription(preset, locale) })] })] }, preset.id))) }) })] }, group.key))) }));
 }
 export function themePresetPreviewStyle(preset) {
     return {
@@ -549,7 +557,7 @@ export function themePresetPreviewStyle(preset) {
     };
 }
 function TokenSection({ title, section, statusKey, values, onTokenChange, }) {
-    return (_jsxs("div", { className: 'oui-theme-token-section', children: [_jsx(Text, { fs: '12px', fw: 760, tone: 'muted', children: title }), _jsx("div", { className: 'oui-theme-token-grid', children: Object.entries(values).map(([key, value]) => (_jsx(ThemeTokenControl, { label: readableTokenName(key), path: statusKey ? `${statusKey}.${key}` : key, section: section, value: value, onChange: (next) => onTokenChange(key, next) }, `${title}-${key}`))) })] }));
+    return (_jsxs("div", { className: "oui-theme-token-section", children: [_jsx(Text, { fs: "12px", fw: 760, tone: "muted", children: title }), _jsx("div", { className: "oui-theme-token-grid", children: Object.entries(values).map(([key, value]) => (_jsx(ThemeTokenControl, { label: readableTokenName(key), path: statusKey ? `${statusKey}.${key}` : key, section: section, value: value, onChange: (next) => onTokenChange(key, next) }, `${title}-${key}`))) })] }));
 }
 function ThemeTokenControl({ label, path, section, value, onChange, }) {
     const valueText = String(value);
@@ -571,11 +579,14 @@ function ThemeTokenControl({ label, path, section, value, onChange, }) {
             return;
         onChange(colorDraft);
     };
-    return (_jsxs("div", { className: 'oui-theme-token oui-theme-token-control', children: [_jsx("span", { className: 'oui-theme-token-swatch', style: {
-                    background: visibleColorValue ?? (section === 'colors' || section === 'status'
-                        ? valueText
-                        : 'var(--oui-primary-surface)'),
-                }, children: colorInputValue ? (_jsx("input", { className: 'oui-theme-token-swatch-input', type: 'color', value: visibleColorValue ?? colorInputValue, "aria-label": `${label} color`, onChange: (event) => setColorDraft(event.target.value), onBlur: commitColorDraft })) : null }), _jsxs("span", { className: 'oui-theme-token-text', children: [_jsx(Text, { fs: '12px', fw: 700, children: label }), _jsx(Text, { fs: '11px', tone: 'muted', children: path })] }), _jsx("span", { className: 'oui-theme-token-control-field', children: selectOptions ? (_jsx("select", { value: valueText, "aria-label": label, onChange: (event) => onChange(event.target.value), children: selectOptions.map((option) => (_jsx("option", { value: option, children: option }, option))) })) : (_jsx("input", { type: typeof value === 'number' ? 'number' : 'text', value: valueText, "aria-label": label, onChange: (event) => onChange(typeof value === 'number' ? Number(event.target.value) : event.target.value) })) })] }));
+    return (_jsxs("div", { className: "oui-theme-token oui-theme-token-control", children: [_jsx("span", { className: "oui-theme-token-swatch", style: {
+                    background: visibleColorValue ??
+                        (section === 'colors' || section === 'status'
+                            ? valueText
+                            : 'var(--oui-primary-surface)'),
+                }, children: colorInputValue ? (_jsx("input", { className: "oui-theme-token-swatch-input", type: "color", value: visibleColorValue ?? colorInputValue, "aria-label": `${label} color`, onChange: (event) => setColorDraft(event.target.value), onBlur: commitColorDraft })) : null }), _jsxs("span", { className: "oui-theme-token-text", children: [_jsx(Text, { fs: "12px", fw: 700, children: label }), _jsx(Text, { fs: "11px", tone: "muted", children: path })] }), _jsx("span", { className: "oui-theme-token-control-field", children: selectOptions ? (_jsx("select", { value: valueText, "aria-label": label, onChange: (event) => onChange(event.target.value), children: selectOptions.map((option) => (_jsx("option", { value: option, children: option }, option))) })) : (_jsx("input", { type: typeof value === 'number' ? 'number' : 'text', value: valueText, "aria-label": label, onChange: (event) => onChange(typeof value === 'number'
+                        ? Number(event.target.value)
+                        : event.target.value) })) })] }));
 }
 function updateFlatToken(updateOverrides, section, key, value) {
     if (section === 'colors' && key.includes('.')) {

package/dist/example/UiExamplePage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"UiExamplePage.d.ts","sourceRoot":"","sources":["../../src/example/UiExamplePage.tsx"],"names":[],"mappings":"AAYA,OAAO,EAaH,KAAK,eAAe,EACvB,MAAM,IAAI,CAAC;AAwlBZ,MAAM,MAAM,kBAAkB,GAAG;IAC7B,MAAM,CAAC,EAAE,eAAe,CAAC;IACzB,aAAa,CAAC,EAAE,eAAe,CAAC;IAChC,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,eAAe,KAAK,IAAI,CAAC;CACtD,CAAC;AAEF,wBAAgB,aAAa,CAAC,EAC1B,MAAM,EAAE,gBAAgB,EACxB,aAAoB,EACpB,cAAc,GACjB,GAAE,kBAAuB,2CA8CzB"}
+{"version":3,"file":"UiExamplePage.d.ts","sourceRoot":"","sources":["../../src/example/UiExamplePage.tsx"],"names":[],"mappings":"AAqBA,OAAO,EAaH,KAAK,eAAe,EACvB,MAAM,IAAI,CAAC;AAolBZ,MAAM,MAAM,kBAAkB,GAAG;IAC7B,MAAM,CAAC,EAAE,eAAe,CAAC;IACzB,aAAa,CAAC,EAAE,eAAe,CAAC;IAChC,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,eAAe,KAAK,IAAI,CAAC;CACtD,CAAC;AAEF,wBAAgB,aAAa,CAAC,EAC1B,MAAM,EAAE,gBAAgB,EACxB,aAAoB,EACpB,cAAc,GACjB,GAAE,kBAAuB,2CAmDzB"}

package/dist/example/UiExamplePage.js

@@ -1,6 +1,6 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { memo, useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import { memo, useCallback, useEffect, useMemo, useRef, useState, } from 'react';
 import { LuBell, LuCheck, LuExternalLink, LuLanguages, LuRefreshCw, LuTrash2, } from 'react-icons/lu';
 import { AppShell, AppShellContent, AppShellHeader, AppSidebar, IconButton, Menu, OrcestrUiProvider, ScrollArea, useOrcestrTheme, useToast, } from '..';
 import { LayoutSection, TextSection } from './ExampleBasicsSections';
@@ -50,9 +50,7 @@ function uiExampleSectionScrollTop(node, scrollRoot) {
     const maxTop = scrollRoot
         ? Math.max(0, scrollRoot.scrollHeight - scrollRoot.clientHeight)
         : Number.POSITIVE_INFINITY;
-    const targetTop = scrollRoot
-        ? uiExampleSectionAbsoluteTop(node, scrollRoot)
-        : node.offsetTop;
+    const targetTop = scrollRoot ? uiExampleSectionAbsoluteTop(node, scrollRoot) : node.offsetTop;
     return Math.min(maxTop, Math.max(0, targetTop - UI_EXAMPLE_SCROLL_LEAD));
 }
 function uiExampleSectionAbsoluteTop(node, scrollRoot) {
@@ -186,7 +184,7 @@ function UiExampleContent({ activePresetId, onThemePresetChange, onThemeOverride
             },
         ];
     }, [locale, toast]);
-    return (_jsxs(AppShell, { sidebarOpen: mobileNavOpen, onSidebarOpenChange: setMobileNavOpen, header: _jsx(AppShellHeader, { sidebarOpen: mobileNavOpen, onSidebarOpenChange: setMobileNavOpen, navigationVisibility: 'mobile', actions: _jsx(UiExampleHeaderActions, { compact: true, locale: locale, onLocaleChange: onLocaleChange }) }), sidebar: _jsx(UiExampleSidebar, { onNavigate: () => setMobileNavOpen(false) }), children: [_jsxs("div", { className: 'oui-ui-workspace', children: [_jsx("div", { className: 'oui-ui-workspace-main', children: _jsxs(AppShellContent, { children: [_jsx(ExampleThemePlayground, { activePresetId: activePresetId, theme: theme, locale: locale, onPresetChange: onThemePresetChange, onThemeOverridesChange: onThemeOverridesChange }), _jsx(MemoFoundationsSection, { onOpenCode: setCodeExample }), _jsx(MemoTextSection, { onOpenCode: setCodeExample }), _jsx(MemoIconTextSection, { onOpenCode: setCodeExample }), _jsx(MemoLayoutSection, { onOpenCode: setCodeExample }), _jsx(MemoActionsSection, { menuItems: menuItems, onOpenCode: setCodeExample, onOpenPalette: openPalette }), _jsx(MemoFieldsSection, { stepperValue: stepperValue, onStepperValueChange: setStepperValue, dateValue: dateValue, onDateValueChange: setDateValue, dateRange: dateRange, onDateRangeChange: setDateRange, onOpenCode: setCodeExample }), _jsx(MemoSelectionSection, { locale: locale, segment: segment, onSegmentChange: setSegment, selectValue: selectValue, onSelectValueChange: setSelectValue, selectNoChevronValue: selectNoChevronValue, onSelectNoChevronValueChange: setSelectNoChevronValue, selectPlainValue: selectPlainValue, onSelectPlainValueChange: setSelectPlainValue, comboValue: comboValue, onComboValueChange: setComboValue, entityValue: entityValue, onEntityValueChange: setEntityValue, paginatedValue: paginatedValue, onPaginatedValueChange: setPaginatedValue, ownerValues: ownerValues, onOwnerValuesChange: setOwnerValues, radioValue: radioValue, onRadioValueChange: setRadioValue, tabValue: tabValue, onTabValueChange: setTabValue, onOpenCode: setCodeExample, onToast: toast.push }), _jsx(MemoStateCardSection, { onOpenCode: setCodeExample }), _jsx(MemoBadgeSection, { onOpenCode: setCodeExample }), _jsx(MemoDataSection, { onOpenCode: setCodeExample }), _jsx(MemoOverlaysSection, { setModalOpen: setModalOpen, setBlurModalOpen: setBlurModalOpen, setFastModalOpen: setFastModalOpen, setRiseModalOpen: setRiseModalOpen, setSlowModalOpen: setSlowModalOpen, setDangerModalOpen: setDangerModalOpen, onOpenCode: setCodeExample }), _jsx(MemoApplicationSection, { onOpenCode: setCodeExample })] }) }), _jsx(UiExampleThemeRail, { activePresetId: activePresetId, locale: locale, onThemePresetChange: onThemePresetChange })] }), _jsx(CodePreviewModal, { example: codeExample, onClose: () => setCodeExample(null) }), _jsx(ExampleOverlays, { locale: locale, modalOpen: modalOpen, setModalOpen: setModalOpen, nestedOpen: nestedOpen, setNestedOpen: setNestedOpen, blurModalOpen: blurModalOpen, setBlurModalOpen: setBlurModalOpen, blurNestedOpen: blurNestedOpen, setBlurNestedOpen: setBlurNestedOpen, blurFinalOpen: blurFinalOpen, setBlurFinalOpen: setBlurFinalOpen, fastModalOpen: fastModalOpen, setFastModalOpen: setFastModalOpen, slowModalOpen: slowModalOpen, setSlowModalOpen: setSlowModalOpen, riseModalOpen: riseModalOpen, setRiseModalOpen: setRiseModalOpen, dangerModalOpen: dangerModalOpen, setDangerModalOpen: setDangerModalOpen, paletteOpen: paletteOpen, setPaletteOpen: setPaletteOpen, onToast: toast.push })] }));
+    return (_jsxs(AppShell, { sidebarOpen: mobileNavOpen, onSidebarOpenChange: setMobileNavOpen, header: _jsx(AppShellHeader, { sidebarOpen: mobileNavOpen, onSidebarOpenChange: setMobileNavOpen, navigationVisibility: "mobile", actions: _jsx(UiExampleHeaderActions, { compact: true, locale: locale, onLocaleChange: onLocaleChange }) }), sidebar: _jsx(UiExampleSidebar, { onNavigate: () => setMobileNavOpen(false) }), children: [_jsxs("div", { className: "oui-ui-workspace", children: [_jsx("div", { className: "oui-ui-workspace-main", children: _jsxs(AppShellContent, { children: [_jsx(ExampleThemePlayground, { activePresetId: activePresetId, theme: theme, locale: locale, onPresetChange: onThemePresetChange, onThemeOverridesChange: onThemeOverridesChange }), _jsx(MemoFoundationsSection, { onOpenCode: setCodeExample }), _jsx(MemoTextSection, { onOpenCode: setCodeExample }), _jsx(MemoIconTextSection, { onOpenCode: setCodeExample }), _jsx(MemoLayoutSection, { onOpenCode: setCodeExample }), _jsx(MemoActionsSection, { menuItems: menuItems, onOpenCode: setCodeExample, onOpenPalette: openPalette }), _jsx(MemoFieldsSection, { stepperValue: stepperValue, onStepperValueChange: setStepperValue, dateValue: dateValue, onDateValueChange: setDateValue, dateRange: dateRange, onDateRangeChange: setDateRange, onOpenCode: setCodeExample }), _jsx(MemoSelectionSection, { locale: locale, segment: segment, onSegmentChange: setSegment, selectValue: selectValue, onSelectValueChange: setSelectValue, selectNoChevronValue: selectNoChevronValue, onSelectNoChevronValueChange: setSelectNoChevronValue, selectPlainValue: selectPlainValue, onSelectPlainValueChange: setSelectPlainValue, comboValue: comboValue, onComboValueChange: setComboValue, entityValue: entityValue, onEntityValueChange: setEntityValue, paginatedValue: paginatedValue, onPaginatedValueChange: setPaginatedValue, ownerValues: ownerValues, onOwnerValuesChange: setOwnerValues, radioValue: radioValue, onRadioValueChange: setRadioValue, tabValue: tabValue, onTabValueChange: setTabValue, onOpenCode: setCodeExample, onToast: toast.push }), _jsx(MemoStateCardSection, { onOpenCode: setCodeExample }), _jsx(MemoBadgeSection, { onOpenCode: setCodeExample }), _jsx(MemoDataSection, { onOpenCode: setCodeExample }), _jsx(MemoOverlaysSection, { setModalOpen: setModalOpen, setBlurModalOpen: setBlurModalOpen, setFastModalOpen: setFastModalOpen, setRiseModalOpen: setRiseModalOpen, setSlowModalOpen: setSlowModalOpen, setDangerModalOpen: setDangerModalOpen, onOpenCode: setCodeExample }), _jsx(MemoApplicationSection, { onOpenCode: setCodeExample })] }) }), _jsx(UiExampleThemeRail, { activePresetId: activePresetId, locale: locale, onThemePresetChange: onThemePresetChange })] }), _jsx(CodePreviewModal, { example: codeExample, onClose: () => setCodeExample(null) }), _jsx(ExampleOverlays, { locale: locale, modalOpen: modalOpen, setModalOpen: setModalOpen, nestedOpen: nestedOpen, setNestedOpen: setNestedOpen, blurModalOpen: blurModalOpen, setBlurModalOpen: setBlurModalOpen, blurNestedOpen: blurNestedOpen, setBlurNestedOpen: setBlurNestedOpen, blurFinalOpen: blurFinalOpen, setBlurFinalOpen: setBlurFinalOpen, fastModalOpen: fastModalOpen, setFastModalOpen: setFastModalOpen, slowModalOpen: slowModalOpen, setSlowModalOpen: setSlowModalOpen, riseModalOpen: riseModalOpen, setRiseModalOpen: setRiseModalOpen, dangerModalOpen: dangerModalOpen, setDangerModalOpen: setDangerModalOpen, paletteOpen: paletteOpen, setPaletteOpen: setPaletteOpen, onToast: toast.push })] }));
 }
 function UiExampleThemeRail({ activePresetId, locale, onThemePresetChange, }) {
     const presets = useMemo(() => {
@@ -202,7 +200,7 @@ function UiExampleThemeRail({ activePresetId, locale, onThemePresetChange, }) {
         }
         return next;
     }, []);
-    return (_jsxs("aside", { className: 'oui-ui-theme-rail', "aria-label": 'Theme presets', children: [_jsx("div", { className: 'oui-ui-theme-rail-title', children: "Themes" }), _jsx(ScrollArea, { className: 'oui-ui-theme-rail-scroll', highlights: true, highlightColor: 'var(--oui-ui-theme-rail-highlight-bg)', highlightTop: {
+    return (_jsxs("aside", { className: "oui-ui-theme-rail", "aria-label": "Theme presets", children: [_jsx("div", { className: "oui-ui-theme-rail-title", children: "Themes" }), _jsx(ScrollArea, { className: "oui-ui-theme-rail-scroll", highlights: true, highlightColor: "var(--oui-ui-theme-rail-highlight-bg)", highlightTop: {
                     start: 18,
                     fadeDistance: 90,
                     maxOpacity: 0.94,
@@ -210,7 +208,7 @@ function UiExampleThemeRail({ activePresetId, locale, onThemePresetChange, }) {
                     start: 12,
                     fadeDistance: 90,
                     maxOpacity: 0.94,
-                }, children: _jsx("div", { className: 'oui-ui-theme-rail-list', children: presets.map((preset) => (_jsxs("button", { type: 'button', className: 'oui-ui-theme-rail-item', "data-active": activePresetId === preset.id ? 'true' : undefined, style: themePresetPreviewStyle(preset), onClick: () => onThemePresetChange(preset), children: [_jsxs("span", { className: 'oui-ui-theme-rail-preview', "aria-hidden": true, children: [_jsx("span", {}), _jsx("span", {})] }), _jsx("span", { className: 'oui-ui-theme-rail-name', children: themePresetLabel(preset, locale) })] }, preset.id))) }) })] }));
+                }, children: _jsx("div", { className: "oui-ui-theme-rail-list", children: presets.map((preset) => (_jsxs("button", { type: "button", className: "oui-ui-theme-rail-item", "data-active": activePresetId === preset.id ? 'true' : undefined, style: themePresetPreviewStyle(preset), onClick: () => onThemePresetChange(preset), children: [_jsxs("span", { className: "oui-ui-theme-rail-preview", "aria-hidden": true, children: [_jsx("span", {}), _jsx("span", {})] }), _jsx("span", { className: "oui-ui-theme-rail-name", children: themePresetLabel(preset, locale) })] }, preset.id))) }) })] }));
 }
 function UiExampleSidebar({ onNavigate }) {
     const [activeSection, setActiveSection] = useState('theme');
@@ -219,7 +217,7 @@ function UiExampleSidebar({ onNavigate }) {
     const scrollNavigationReleaseTimerRef = useRef(null);
     const setActiveSectionValue = useCallback((id) => {
         activeSectionRef.current = id;
-        setActiveSection((current) => current === id ? current : id);
+        setActiveSection((current) => (current === id ? current : id));
     }, []);
     const lockScrollNavigationTarget = useCallback((id) => {
         scrollNavigationTargetRef.current = id;
@@ -260,15 +258,13 @@ function UiExampleSidebar({ onNavigate }) {
                 }
                 return;
             }
-            const bottomDistance = scrollRoot.scrollHeight
-                - scrollRoot.clientHeight
-                - scrollRoot.scrollTop;
+            const bottomDistance = scrollRoot.scrollHeight - scrollRoot.clientHeight - scrollRoot.scrollTop;
             const top = scrollRoot.scrollTop + UI_EXAMPLE_ACTIVE_PROBE_OFFSET;
             const next = bottomDistance <= 2
                 ? nodes.at(-1)?.id
-                : nodes
+                : (nodes
                     .filter((node) => uiExampleSectionAbsoluteTop(node, scrollRoot) <= top)
-                    .at(-1)?.id ?? nodes[0]?.id;
+                    .at(-1)?.id ?? nodes[0]?.id);
             if (next && next !== activeSectionRef.current)
                 setActiveSectionValue(next);
         };
@@ -304,10 +300,10 @@ function UiExampleSidebar({ onNavigate }) {
             onSelect: () => navigateToSection(item.id),
         })),
     })), [activeSection, navigateToSection]);
-    return (_jsx(AppSidebar, { className: 'oui-ui-main-sidebar', header: _jsx(UiExampleBrand, {}), itemH: 34, groups: sidebarNavGroups }));
+    return (_jsx(AppSidebar, { className: "oui-ui-main-sidebar", header: _jsx(UiExampleBrand, {}), itemH: 34, groups: sidebarNavGroups }));
 }
 function UiExampleBrand({ compact = false }) {
-    return (_jsxs("div", { className: 'oui-ui-brand', "data-compact": compact ? 'true' : undefined, children: [_jsx("span", { className: 'oui-ui-brand-mark', "aria-hidden": 'true', children: _jsx("img", { className: 'oui-ui-brand-logo', src: ORCESTR_LOGO_SRC, alt: '' }) }), _jsx("span", { className: 'oui-ui-brand-text', children: _jsx("strong", { children: "Orcestr UI" }) })] }));
+    return (_jsxs("div", { className: "oui-ui-brand", "data-compact": compact ? 'true' : undefined, children: [_jsx("span", { className: "oui-ui-brand-mark", "aria-hidden": "true", children: _jsx("img", { className: "oui-ui-brand-logo", src: ORCESTR_LOGO_SRC, alt: "" }) }), _jsx("span", { className: "oui-ui-brand-text", children: _jsx("strong", { children: "Orcestr UI" }) })] }));
 }
 function UiExampleHeaderActions({ compact = false, locale, onLocaleChange, }) {
     const languageItems = useMemo(() => [
@@ -324,7 +320,7 @@ function UiExampleHeaderActions({ compact = false, locale, onLocaleChange, }) {
             onSelect: () => onLocaleChange('en'),
         },
     ], [locale, onLocaleChange]);
-    return (_jsxs("div", { className: 'oui-ui-header-actions', "data-compact": compact ? 'true' : undefined, children: [_jsx(Menu, { items: languageItems, trigger: _jsx(IconButton, { className: 'oui-ui-language-button', size: 2, v: 'pad', icon: _jsx(LuLanguages, { size: 16 }), "aria-label": `Language: ${locale.toUpperCase()}` }) }), _jsxs("a", { className: 'oui-ui-header-link', href: 'https://github.com/Artasov/orcestr', target: '_blank', rel: 'noreferrer', children: [_jsx(LuExternalLink, { size: 14, "aria-hidden": true }), _jsx("span", { children: "GitHub" })] })] }));
+    return (_jsxs("div", { className: "oui-ui-header-actions", "data-compact": compact ? 'true' : undefined, children: [_jsx(Menu, { items: languageItems, trigger: _jsx(IconButton, { className: "oui-ui-language-button", size: 2, v: "pad", icon: _jsx(LuLanguages, { size: 16 }), "aria-label": `Language: ${locale.toUpperCase()}` }) }), _jsxs("a", { className: "oui-ui-header-link", href: "https://github.com/Artasov/orcestr", target: "_blank", rel: "noreferrer", children: [_jsx(LuExternalLink, { size: 14, "aria-hidden": true }), _jsx("span", { children: "GitHub" })] })] }));
 }
 export function UiExamplePage({ locale: controlledLocale, defaultLocale = 'ru', onLocaleChange, } = {}) {
     const firstPreset = getThemePlaygroundPreset('orcestr-dark');

package/dist/example/UiExampleSection.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"UiExampleSection.d.ts","sourceRoot":"","sources":["../../src/example/UiExampleSection.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,OAAO,CAAC;AAIrC,wBAAgB,gBAAgB,CAAC,EAC7B,EAAE,EACF,KAAK,EACL,WAAW,EACX,QAAQ,GACX,EAAE;IACC,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,EAAE,SAAS,CAAC;CACvB,2CAcA"}
+{"version":3,"file":"UiExampleSection.d.ts","sourceRoot":"","sources":["../../src/example/UiExampleSection.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIvC,wBAAgB,gBAAgB,CAAC,EAC7B,EAAE,EACF,KAAK,EACL,WAAW,EACX,QAAQ,GACX,EAAE;IACC,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,EAAE,SAAS,CAAC;CACvB,2CAYA"}

package/dist/example/UiExampleSection.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Section } from '../components/Section/Section';
 export function UiExampleSection({ id, title, description, children, }) {
-    return (_jsxs(Section, { id: id, className: 'oui-ui-section', children: [_jsx("div", { className: 'oui-ui-section-head', children: _jsxs("div", { children: [_jsx("h2", { className: 'oui-ui-section-title', children: title }), description ? (_jsx("p", { className: 'oui-ui-description', children: description })) : null] }) }), children] }));
+    return (_jsxs(Section, { id: id, className: "oui-ui-section", children: [_jsx("div", { className: "oui-ui-section-head", children: _jsxs("div", { children: [_jsx("h2", { className: "oui-ui-section-title", children: title }), description ? _jsx("p", { className: "oui-ui-description", children: description }) : null] }) }), children] }));
 }

package/dist/example/codeSamples.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"codeSamples.d.ts","sourceRoot":"","sources":["../../src/example/codeSamples.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,WAAW,GAAG;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAq6Cc,CAAC"}
+{"version":3,"file":"codeSamples.d.ts","sourceRoot":"","sources":["../../src/example/codeSamples.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,WAAW,GAAG;IACtB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAs6CU,CAAC"}