@orcestr/ui 0.1.0 → 0.2.0

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

@@ -3,7 +3,7 @@ export type CodeExample = {
     code: string;
 };
 export declare const codeSamples: {
-    typography: string;
+    text: string;
     skeleton: string;
     appShell: string;
     layoutFlex: string;

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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+zCc,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"}

package/dist/example/codeSamples.js

@@ -1,5 +1,5 @@
 export const codeSamples = {
-    typography: `import {Badge, Box, Flex, Stack, Text} from '@orcestr/ui';
+    text: `import {Badge, Box, Flex, Stack, Text} from '@orcestr/ui';
 
 <Stack g={3}>
     <Stack g={1}>
@@ -28,9 +28,9 @@ export const codeSamples = {
         <Text tone='info' fw={700}>Info</Text>
     </Flex>
 
-    <Box w='100%' p={2} r={3}>
+    <Box w='100%' p={2} r={3} style={{background: 'var(--oui-pad-bg)'}}>
         <Text display='block' truncate>
-            This is a long single line value that truncates cleanly.
+            This is a long single line value that truncates cleanly inside a constrained row.
         </Text>
     </Box>
 
@@ -55,22 +55,31 @@ import {
     AppShell,
     AppShellContent,
     AppShellHeader,
+    type AppShellSide,
     AppSidebar,
-    Badge,
     Button,
     Flex,
     IconButton,
     IconTextButton,
+    Menu,
     PageTitleBlock,
     SpecialModal,
-    Text,
+    Tooltip,
+    type MenuItem,
 } from '@orcestr/ui';
-import {LuBell, LuBox, LuCalendar, LuClipboardList, LuEllipsis, LuMessageSquare, LuSearch, LuTruck} from 'react-icons/lu';
+import {LuArrowLeft, LuArrowLeftRight, LuBell, LuBox, LuCalendar, LuCheck, LuClipboardList, LuEllipsis, LuLanguages, LuMessageSquare, LuSearch, LuTruck} from 'react-icons/lu';
 
 const [open, setOpen] = useState(false);
 const [mobileOpen, setMobileOpen] = useState(false);
 const [previewMode, setPreviewMode] = useState<'desktop' | 'phone'>('desktop');
+const [sidebarSide, setSidebarSide] = useState<AppShellSide>('left');
 const [activeKey, setActiveKey] = useState('requests');
+const [locale, setLocale] = useState<'ru' | 'en'>('en');
+const isPhone = previewMode === 'phone';
+const isRight = sidebarSide === 'right';
+const toggleSidebarSide = () => {
+    setSidebarSide((side) => side === 'left' ? 'right' : 'left');
+};
 
 const groups = [
     {
@@ -81,20 +90,23 @@ const groups = [
         ],
     },
     {
-        key: 'operations',
+        key: 'inventory',
         items: [
             {key: 'products', label: 'Products', icon: <LuBox />, active: activeKey === 'products'},
             {key: 'calendar', label: 'Calendar', icon: <LuCalendar />, active: activeKey === 'calendar'},
         ],
     },
 ];
+const languageItems: MenuItem[] = [
+    {key: 'ru', label: 'RU', icon: locale === 'ru' ? <LuCheck /> : undefined, onSelect: () => setLocale('ru')},
+    {key: 'en', label: 'EN', icon: locale === 'en' ? <LuCheck /> : undefined, onSelect: () => setLocale('en')},
+];
 
 <>
     <Button onClick={() => setOpen(true)}>Open AppShell preview</Button>
     <SpecialModal open={open} onOpenChange={setOpen} size='full' scroll='body'>
         <SpecialModal.Header
             title='AppShell preview'
-            meta={<Badge tone='primary'>{previewMode}</Badge>}
             actions={(
                 <>
                     <Button size={2} v='surface' onClick={() => setPreviewMode((mode) => mode === 'desktop' ? 'phone' : 'desktop')}>
@@ -106,8 +118,10 @@ const groups = [
         />
         <SpecialModal.Body>
             <AppShell
-                sidebarMode={previewMode === 'phone' ? 'mobile' : 'desktop'}
+                sidebarMode={isPhone ? 'mobile' : 'desktop'}
+                sidebarSide={sidebarSide}
                 sidebarOpen={mobileOpen}
+                desktopSidebarOpen
                 onSidebarOpenChange={setMobileOpen}
                 sidebarWidth={300}
                 contentInset={0}
@@ -116,21 +130,39 @@ const groups = [
                     <AppShellHeader
                         visibility='always'
                         sidebarOpen={mobileOpen}
-                        onSidebarOpenChange={previewMode === 'phone' ? setMobileOpen : undefined}
+                        onSidebarOpenChange={setMobileOpen}
+                        navigationVisibility='mobile'
                         actions={(
                             <Flex a='c' g={1}>
                                 <IconTextButton size={2} v='soft' tone='neutral' icon={<LuSearch />}>Quick jump</IconTextButton>
                                 <IconButton size={2} v='ghost' icon={<LuBell />} badge={64} aria-label='Notifications' />
                                 <IconButton size={2} v='ghost' icon={<LuMessageSquare />} badge={99} aria-label='Messages' />
+                                <Menu
+                                    align='end'
+                                    items={languageItems}
+                                    trigger={<IconButton size={2} v='ghost' icon={<LuLanguages />} aria-label={'Language: ' + locale.toUpperCase()} />}
+                                />
                             </Flex>
                         )}
-                    >
-                        <Text fw={760}>Deliveries</Text>
-                    </AppShellHeader>
+                    />
                 )}
                 sidebar={(
                     <AppSidebar
-                        header={<div className='oui-app-sidebar-brand'><span className='oui-app-sidebar-logo'>O</span><span className='oui-app-sidebar-title'>Deliveries</span></div>}
+                        side={sidebarSide}
+                        header={(
+                            <>
+                                <div className='oui-app-sidebar-brand'><span className='oui-app-sidebar-logo'>O</span><span className='oui-app-sidebar-title'>Deliveries</span></div>
+                                <div className='oui-app-sidebar-actions'>
+                                    <Tooltip content='Back'>
+                                        <IconButton size={2} v='ghost' icon={<LuArrowLeft />} aria-label='Back' />
+                                    </Tooltip>
+                                    <Tooltip content={isRight ? 'Move sidebar left' : 'Move sidebar right'}>
+                                        <IconButton size={2} v='ghost' icon={<LuArrowLeftRight />} aria-label={isRight ? 'Move sidebar left' : 'Move sidebar right'} onClick={toggleSidebarSide} />
+                                    </Tooltip>
+                                    <IconButton size={2} v='ghost' icon={<LuEllipsis />} aria-label='Sidebar actions' />
+                                </div>
+                            </>
+                        )}
                         itemH={38}
                         onNavigate={(item) => setActiveKey(item.key)}
                         groups={groups}
@@ -141,7 +173,6 @@ const groups = [
                     <PageTitleBlock
                         title='Requests'
                         caption='Module workspace with responsive header and AppSidebar navigation.'
-                        badge='shell'
                         action={<IconButton size={2} v='pad' icon={<LuEllipsis />} aria-label='More actions' />}
                     />
                     {children}
@@ -165,23 +196,50 @@ const groups = [
     </Flex>
     <Flex row g={2} wrap>
         {['Intake', 'Review', 'Complete'].map((item, index) => (
-            <Flex key={item} col g={1} p={2} r={3} flex='1 1 150px'>
+            <Flex
+                key={item}
+                col
+                g={1}
+                p={2}
+                r={3}
+                flex='1 1 150px'
+                style={{background: 'var(--oui-pad-bg)'}}
+            >
                 <Text fs='12px' tone='muted'>Step {index + 1}</Text>
                 <Text fw={700}>{item}</Text>
             </Flex>
         ))}
     </Flex>
 </Flex>`,
-    layoutStack: `import {Box, Flex, Stack, Text} from '@orcestr/ui';
+    layoutStack: `import {Flex, Stack, Text} from '@orcestr/ui';
 
 <Stack g={2}>
     {[
-        ['Created', 'Draft created from intake'],
-        ['Reserved', 'Capacity is reserved for review'],
-        ['Scheduled', 'Review window is confirmed'],
-    ].map(([title, description]) => (
-        <Flex key={title} row g={2} p={2} r={3} a='s'>
-            <Box size={8} r={7} mt={1} />
+        ['/gallery/cyberpunk-rain.webp', 'Created', 'Draft created from intake'],
+        ['/gallery/hollywood-star.webp', 'Reserved', 'Capacity is reserved for review'],
+        ['/gallery/ice-cave.webp', 'Scheduled', 'Review window is confirmed'],
+    ].map(([image, title, description]) => (
+        <Flex
+            key={title}
+            row
+            g={2}
+            a='c'
+            w='min(100%, 360px)'
+            p='8px 10px'
+            r={2}
+            style={{background: 'var(--oui-pad-bg)'}}
+        >
+            <img
+                src={image}
+                alt=''
+                style={{
+                    width: 34,
+                    height: 34,
+                    flex: '0 0 34px',
+                    borderRadius: 999,
+                    objectFit: 'cover',
+                }}
+            />
             <Stack g={0}>
                 <Text fs='13px' fw={700}>{title}</Text>
                 <Text fs='12px' tone='muted' lh={1.45}>{description}</Text>
@@ -202,7 +260,7 @@ const [detailsOpen, setDetailsOpen] = useState(true);
         </Button>
     </Flex>
     <Collapse open={detailsOpen}>
-        <Stack g={2} p={2} r={3}>
+        <Stack g={2} p={2} r={3} style={{background: 'var(--oui-pad-bg)'}}>
             <Flex row g={2} j='sb'>
                 <Text tone='muted'>Owner</Text>
                 <Text fw={700}>Core team</Text>
@@ -222,7 +280,7 @@ const [detailsOpen, setDetailsOpen] = useState(true);
 
 <Grid columns='repeat(3, minmax(0, 1fr))' g={2}>
     {['A', 'B', 'C', 'D', 'E', 'F'].map((item) => (
-        <Box key={item} p={2} r={3} ta='center'>
+        <Box key={item} p={2} r={3} ta='center' style={{background: 'var(--oui-pad-bg)'}}>
             <Text fs='13px' fw={700}>{item}</Text>
         </Box>
     ))}
@@ -248,11 +306,29 @@ const [detailsOpen, setDetailsOpen] = useState(true);
         position='absolute'
     />
 </div>`,
-    scrollArea: `import {Badge, Flex, ScrollArea, Stack, Text} from '@orcestr/ui';
+    scrollArea: `import {Badge, Box, Flex, ScrollArea, Stack, Text} from '@orcestr/ui';
+
+const scrollRows = Array.from({length: 10}, (_, index) => index + 1);
+const richRows = [
+    ['Queued', 'No top shade at the initial position.'],
+    ['Reserved', 'The top shade starts after 50px.'],
+    ['Packed', 'Opacity reaches maximum over 160px.'],
+    ['Labeled', 'Bottom shade fades near the end.'],
+    ['Reviewed', 'Each edge has its own configuration.'],
+    ['Delivered', 'The gradient uses the solid surface color.'],
+    ['Checked', 'Content remains readable under the fade.'],
+    ['Archived', 'The bottom edge disappears at the end.'],
+];
 
 <Stack g={2}>
     <ScrollArea h={116} pr={1}>
-        <Stack g={1}>{rows}</Stack>
+        <Stack g={1}>
+            {scrollRows.map((row) => (
+                <Box key={row} p={2} r={3} style={{background: 'var(--oui-pad-bg)'}}>
+                    <Text fs='13px'>Scroll row {row}</Text>
+                </Box>
+            ))}
+        </Stack>
     </ScrollArea>
 
     <ScrollArea
@@ -263,7 +339,13 @@ const [detailsOpen, setDetailsOpen] = useState(true);
         highlightTop={{h: 28, mode: 'static', maxOpacity: 0.96}}
         highlightBottom={{h: 28, mode: 'static', maxOpacity: 0.96}}
     >
-        <Stack g={1}>{rows}</Stack>
+        <Stack g={1}>
+            {scrollRows.slice(0, 8).map((row) => (
+                <Box key={row} p={2} r={3} style={{background: 'var(--oui-pad-bg)'}}>
+                    <Text fs='13px'>Both edges row {row}</Text>
+                </Box>
+            ))}
+        </Stack>
     </ScrollArea>
 
     <ScrollArea
@@ -287,14 +369,22 @@ const [detailsOpen, setDetailsOpen] = useState(true);
         }}
     >
         <Stack g={1}>
-            {rows.map((row, index) => (
-                <Flex key={row.id} row g={2} p={2} r={3} a='c'>
+            {richRows.map(([title, description], index) => (
+                <Flex
+                    key={title}
+                    row
+                    g={2}
+                    p={2}
+                    r={3}
+                    a='c'
+                    style={{background: 'var(--oui-pad-bg)'}}
+                >
                     <Badge tone={index < 3 ? 'primary' : 'info'}>
                         {index + 1}
                     </Badge>
                     <Stack g={0}>
-                        <Text fs='13px' fw={700}>{row.title}</Text>
-                        <Text fs='12px' tone='muted'>{row.description}</Text>
+                        <Text fs='13px' fw={700}>{title}</Text>
+                        <Text fs='12px' tone='muted'>{description}</Text>
                     </Stack>
                 </Flex>
             ))}
@@ -305,8 +395,16 @@ const [detailsOpen, setDetailsOpen] = useState(true);
 
 <Flex g={2} a='c' wrap>
     {[0, 2, 4, 6, 7].map((radius) => (
-        <Box key={radius} size={32} r={radius} display='flex' a='c' j='c'>
-            <Text fs='12px'>{radius}</Text>
+        <Box
+            key={radius}
+            size={32}
+            r={radius}
+            display='flex'
+            a='c'
+            j='c'
+            style={{background: 'var(--oui-pad-bg)'}}
+        >
+            <Text fs='12px' fw={700}>{radius}</Text>
         </Box>
     ))}
 </Flex>
@@ -329,13 +427,19 @@ const [detailsOpen, setDetailsOpen] = useState(true);
                 <Text fs='12px' tone='muted'>Quiet grouped content.</Text>
             </Stack>
         </Card>
+        <Card v='classic'>
+            <Stack g={1}>
+                <Text fw={760}>Classic card</Text>
+                <Text fs='12px' tone='muted'>More explicit border and background.</Text>
+            </Stack>
+        </Card>
     </Grid>
     <Separator />
     <Alert title='Inventory sync delayed' action={<Button size={1} v='surface'>Retry</Button>}>
         Check this status before creating the next shipment.
     </Alert>
 </Section>`,
-    buttons: `import {Button, Spinner} from '@orcestr/ui';
+    buttons: `import {Button, CopyButton, CopyIconButton, Spinner} from '@orcestr/ui';
 import {LuCheck, LuInfo, LuTrash2, LuTriangleAlert} from 'react-icons/lu';
 
 <Button size={3}>Solid</Button>
@@ -367,6 +471,19 @@ import {LuCheck, LuInfo, LuTrash2, LuTriangleAlert} from 'react-icons/lu';
 <Button v='surface' pressAnimation='soft'>Press soft</Button>
 <Button v='surface' pressAnimation='none'>Press none</Button>
 
+<CopyButton
+    text='https://orcestr.dev/requests/PR-2026-0900'
+    label='Copy link'
+    successMessage='Link copied'
+    v='surface'
+/>
+<CopyIconButton
+    text='PR-2026-0900'
+    label='Copy request number'
+    successMessage='Request number copied'
+    v='surface'
+/>
+
 <Button size={3} loading>Loading</Button>
 <Button size={3} v='surface' loading leftIcon={<LuCheck size={16} />}>Save</Button>
 <Button size={3} tone='success' loading leftIcon={<LuCheck size={16} />}>Success</Button>
@@ -999,6 +1116,19 @@ const toast = useToast();
 >
     Success
 </Button>
+<Button
+    onClick={() =>
+        toast.success({
+            title: 'Endless',
+            message: 'This success toast stays until you click it.',
+            position: 'bottom-right',
+            duration: null,
+            dedupeKey: 'endless-success-toast',
+        })
+    }
+>
+    Endless
+</Button>
 <Button
     onClick={() =>
         toast.warning({
@@ -1043,31 +1173,14 @@ const toast = useToast();
     onClick={() =>
         toast.info({
             title: 'Glass background',
-            message: 'Custom blur and translucent background.',
+            message: 'Theme blur and translucent background.',
             position: 'bottom-right',
-            background: 'rgb(18 24 34 / 72%)',
-            blur: 18,
-            borderColor: 'rgb(255 255 255 / 18%)',
             duration: 5200,
         })
     }
 >
     Glass
 </Button>
-<Button
-    onClick={() =>
-        toast.info({
-            title: 'Static background',
-            message: 'Blur can be disabled per toast.',
-            position: 'bottom-left',
-            background: 'var(--oui-floating-bg)',
-            blur: false,
-            duration: 5200,
-        })
-    }
->
-    Static
-</Button>
 
 const toastPositions: Array<{position: ToastPosition; label: string}> = [
     {position: 'top-left', label: 'Top left'},
@@ -1083,51 +1196,42 @@ const toastPositionVariants: Array<{
     label: string;
     tone: ToastTone;
     message: string;
-    background?: string;
-    blur?: number | string | false;
 }> = [
     {
         position: 'top-left',
         label: 'Status synced',
         tone: 'success',
-        message: 'Glass toast from the left edge.',
-        blur: 14,
+        message: 'Default glass toast from the left edge.',
     },
     {
         position: 'top-center',
         label: 'Command ready',
         tone: 'info',
-        message: 'Centered toast drops from the top.',
-        background: 'rgb(18 28 42 / 88%)',
-        blur: 10,
+        message: 'Centered toast uses the same glass surface.',
     },
     {
         position: 'top-right',
         label: 'Needs attention',
         tone: 'warning',
-        message: 'Right edge bubble animation.',
-        blur: 12,
+        message: 'Right edge toast keeps the same translucent surface.',
     },
     {
         position: 'bottom-left',
         label: 'Import queued',
         tone: 'info',
-        message: 'Static background, no blur.',
-        blur: false,
+        message: 'Bottom left toast keeps the same theme blur.',
     },
     {
         position: 'bottom-center',
         label: 'Batch completed',
         tone: 'success',
-        message: 'Bottom center rises into place.',
-        blur: 16,
+        message: 'Bottom center toast uses the theme defaults.',
     },
     {
         position: 'bottom-right',
         label: 'Export failed',
         tone: 'danger',
         message: 'Actionable toast from the right edge.',
-        blur: 12,
     },
 ];
 
@@ -1139,7 +1243,7 @@ const toastPositionVariants: Array<{
         onClick={() =>
             toast.info({
                 title: item.label,
-                message: 'Positioned toast with directional bubble animation.',
+                message: 'Positioned toast with the default glass surface.',
                 position: item.position,
                 duration: 3600,
             })
@@ -1161,8 +1265,6 @@ const toastPositionVariants: Array<{
                     message: item.message,
                     position: item.position,
                     tone: item.tone,
-                    background: item.background,
-                    blur: item.blur,
                     duration: 4200 + index * 220,
                 });
             }, index * 120);

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

@@ -1 +1 @@
-{"version":3,"file":"exampleData.d.ts","sourceRoot":"","sources":["../../src/example/exampleData.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,KAAK,kBAAkB,EAAE,KAAK,WAAW,EAAE,KAAK,eAAe,EAAC,MAAM,IAAI,CAAC;AAEnF,MAAM,MAAM,cAAc,GAAG;IACzB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG;IAC1B,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,SAAS,cAAc,EAAE,CAAC;CACpC,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,eAAe,EA0FtC,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,cAAc,EAA8C,CAAC;AACpF,eAAO,MAAM,aAAa,+BAAyD,CAAC;AA0GpF,MAAM,MAAM,YAAY,GAAG;IACvB,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,CAAC;CAClB,CAAC;AAgBF,wBAAgB,cAAc,CAAC,MAAM,EAAE,eAAe,iBAErD;AAED,wBAAgB,eAAe,CAAC,MAAM,EAAE,eAAe,wBAEtD;AAED,wBAAgB,aAAa,CAAC,MAAM,EAAE,eAAe;;;IAEpD;AAMD,wBAAsB,cAAc,CAChC,MAAM,EAAE,eAAe,EACvB,IAAI,EAAE,MAAM,EACZ,MAAM,EAAE,MAAM;;;;;;GAiBjB"}
+{"version":3,"file":"exampleData.d.ts","sourceRoot":"","sources":["../../src/example/exampleData.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,kBAAkB,EAAE,KAAK,WAAW,EAAE,KAAK,eAAe,EAAE,MAAM,IAAI,CAAC;AAErF,MAAM,MAAM,cAAc,GAAG;IACzB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG;IAC1B,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,SAAS,cAAc,EAAE,CAAC;CACpC,CAAC;AAEF,eAAO,MAAM,SAAS,EAAE,eAAe,EAoFtC,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,cAAc,EAA8C,CAAC;AACpF,eAAO,MAAM,aAAa,+BAAyD,CAAC;AA0GpF,MAAM,MAAM,YAAY,GAAG;IACvB,EAAE,EAAE,MAAM,CAAC;IACX,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,CAAC;CAClB,CAAC;AAgBF,wBAAgB,cAAc,CAAC,MAAM,EAAE,eAAe,iBAErD;AAED,wBAAgB,eAAe,CAAC,MAAM,EAAE,eAAe,wBAEtD;AAED,wBAAgB,aAAa,CAAC,MAAM,EAAE,eAAe;;;IAEpD;AAMD,wBAAsB,cAAc,CAAC,MAAM,EAAE,eAAe,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM;;;;;;GAgBzF"}

package/dist/example/exampleData.js

@@ -6,7 +6,7 @@ export const navGroups = [
         items: [
             { id: 'theme', label: 'Themes' },
             { id: 'foundations', label: 'Foundations' },
-            { id: 'typography', label: 'Typography' },
+            { id: 'text', label: 'Text' },
             { id: 'skeleton-example', label: 'Skeleton' },
             { id: 'icon-text-example', label: 'IconText' },
         ],
@@ -33,6 +33,8 @@ export const navGroups = [
             { id: 'icon-text-buttons-example', label: 'Icon text buttons' },
             { id: 'icon-buttons-example', label: 'Icon buttons' },
             { id: 'context-menu-example', label: 'Context menu' },
+            { id: 'state-card-example', label: 'StateCard' },
+            { id: 'badges-example', label: 'Badge' },
         ],
     },
     {
@@ -55,14 +57,6 @@ export const navGroups = [
             { id: 'tabs-example', label: 'Tabs' },
         ],
     },
-    {
-        key: 'states',
-        label: 'States',
-        items: [
-            { id: 'state-card-example', label: 'StateCard' },
-            { id: 'badges-example', label: 'Badge' },
-        ],
-    },
     {
         key: 'data',
         label: 'Data',
@@ -127,7 +121,7 @@ const ruCommandItems = [
         group: 'Навигация',
     },
     {
-        key: 'open-operations',
+        key: 'open-queue',
         label: 'Открыть очередь',
         description: 'Перейти к рабочей очереди.',
         shortcut: 'G D',
@@ -164,7 +158,7 @@ const enCommandItems = [
         group: 'Navigation',
     },
     {
-        key: 'open-operations',
+        key: 'open-queue',
         label: 'Open queue',
         description: 'Go to the work queue.',
         shortcut: 'G D',