> ## Documentation Index
> Fetch the complete documentation index at: https://docs.twenty.com/llms.txt
> Use this file to discover all available pages before exploring further.

# اختصار

> اعرض مجموعات المفاتيح المتزامنة والاختصارات المتسلسلة.

## نظرة عامة

استورد `Shortcut` و`formatShortcut` من `twenty-ui/primitives/typography`. يشترك كلاهما في النموذج والرموز والفواصل نفسها. سجّل الاختصارات في تطبيقك. يقوم `Shortcut` بتنسيق التلميح فقط؛ ولا يسجل إجراءات لوحة المفاتيح. تستهدف السمات الأصلية ومعالجات الأحداث والأنماط وأسماء الفئات والمراجع عنصر span الخارجي الخاص به. `ShortcutProps` و`ShortcutFormatOptions` نوعان عامان.

**Light**

[عروض الاختصارات (light)](https://storybook.twenty.com/iframe.html?id=ui-typography-shortcut--display\&viewMode=story\&globals=colorScheme:light)

**Dark**

[عروض الاختصارات (dark)](https://storybook.twenty.com/iframe.html?id=ui-typography-shortcut--display\&viewMode=story\&globals=colorScheme:dark)

[Open in Storybook](https://storybook.twenty.com/?path=/story/ui-typography-shortcut--display)

## استخدام

```tsx theme={null}
import { Shortcut } from 'twenty-ui/primitives/typography';

export const SearchShortcut = () => <Shortcut shortcut={['Mod', 'K']} />;
```

## التركيبات والتسلسلات

```tsx theme={null}
import { Shortcut, formatShortcut } from 'twenty-ui/primitives/typography';

export const ShortcutExamples = () => (
  <>
    <Shortcut shortcut={['Enter']} />
    <Shortcut shortcut={['Mod', 'K']} />
    <Shortcut shortcut={[['G'], ['P']]} sequenceJoinLabel="then" />
    <Shortcut
      shortcut={[
        ['Mod', 'K'],
        ['Mod', 'C'],
      ]}
      sequenceJoinLabel="then"
    />
  </>
);

const hint = formatShortcut({
  shortcut: ['Mod', 'Enter'],
});
```

المصفوفة المسطحة هي مجموعة متزامنة: `['Mod', 'K']` تعني الضغط على Mod وK معًا. المصفوفة المتداخلة هي تسلسل مرتب: `[['G'], ['P']]` تعني الضغط على G، ثم P. كل مصفوفة متداخلة هي مجموعة واحدة، لذا فإن `[['Mod', 'K'], ['Mod', 'C']]` تعني الضغط على Mod وK، ثم Mod وC. استخدم مصفوفة ذات عنصر واحد لمفتاح واحد. يمكن أن يكون كلا شكلي المصفوفات للقراءة فقط.

يعرض `Mod` و`CommandOrControl` مفتاح Command على macOS وiOS، ومفتاح Control في أماكن أخرى. تحتوي مفاتيح `Command` و`Control` و`Alt` و`Enter` الصريحة أيضًا على تسميات عرض. تُعرض السلاسل الأخرى كما تم توفيرها. يكون اكتشاف الجهاز آمنًا دون عموميات المتصفح؛ ويستبدله `platform` اختياريًا بالقيمة `mac` أو `other`.

استخدم `sequenceJoinLabel` لنص الربط المترجم. يمكن أن يحافظ `combinationSeparator` على اصطلاح المضيف مثل `+`. يكون فاصل النص الافتراضي فارغًا على أجهزة Apple ومسافة في أماكن أخرى. يختار `variant` بين `keys` أو `text` أو `button`. يخفي `visibility="desktop"` التلميح عند عروض إطار العرض على الأجهزة المحمولة، بينما يظل `always` مرئيًا.

تحتوي رموز المفاتيح على أسماء مقروءة ومتاحة. استخدم `accessibleKeyLabels` لترجمة أسماء المفاتيح الفردية في مخرجات قارئ الشاشة. وفّر `aria-label` أو `aria-labelledby` اسمًا مترجمًا للاختصار بأكمله، أو `aria-hidden` لتلميح زخرفي. تحتفظ الأزرار بأسماء إجراءاتها وتخفي تلميحاتها الزخرفية على الأجهزة المحمولة. تُبقي صفوف القوائم والقوائم المنسدلة تلميحاتها مرئية.

## المظهر

استخدم `keys` لأغطية المفاتيح الفردية، و`text` لتلميح مضمن، أو `button` للتلميح المضغوط داخل إجراء. تغيّر هذه المتغيرات العرض فقط.

**Light**

[متغيرات مظهر الاختصار (light)](https://storybook.twenty.com/iframe.html?id=ui-typography-shortcut--catalog\&viewMode=story\&globals=colorScheme:light)

**Dark**

[متغيرات مظهر الاختصار (dark)](https://storybook.twenty.com/iframe.html?id=ui-typography-shortcut--catalog\&viewMode=story\&globals=colorScheme:dark)

[Open in Storybook](https://storybook.twenty.com/?path=/story/ui-typography-shortcut--catalog)

## الترحيل

| الخاصية السابقة | البديل |
| - | - |
| زر `hotkeys={['⌘', 'K']}` | `shortcut={['Mod', 'K']}` |
| تسلسل `hotkeys` / `hotKeys` في ListItem | `shortcut={[['G'], ['P']]}` |
| `hotkeysJoinLabel` / `hotKeysJoinLabel` | `shortcutJoinLabel` في مكونات Button وListItem وDropdown |
| تسلسل مفاتيح تلميح الأدوات يدويًا | `formatShortcut({ shortcut: ['Mod', 'Enter'] })` |

تحتاج المصفوفات المسطحة المخزنة التي تمثل ضغطات مفاتيح متعاقبة إلى تداخل قبل تمريرها إلى `shortcut`: `hotKeys.map((key) => [key])`. يمكن تمرير المصفوفات التي تمثل مفاتيح متزامنة مباشرةً. تظل سلاسل المفاتيح رموزًا حرفية، لذا تحتوي `['Mod', '+']` على مفتاح زائد وتحتوي `['Space']` على مفتاح Space؛ ولا يلزم تحليل سلسلة الاختصار.

## الإزاحة

**accessibleKeyLabels** `Readonly\<Record\<string, string\>\>`

Optional localized names for individual keys in screen reader output.

**combinationSeparator** `string`

Optional separator between simultaneous keys. Defaults to no separator on Apple devices and a space elsewhere.

**platform** `"mac" | "other"`

Optional mac or other platform override. Defaults to server-safe device detection.

**sequenceJoinLabel** `string`

Text between sequence steps. Defaults to then.

**shortcut** `ShortcutDefinition` *required*

Flat key array for a simultaneous combination, or nested key arrays for an ordered sequence of combinations.

**variant** `"button" | "keys" | "text"` (default: keys)

Keycaps, inline text, or a separated button hint.

**visibility** `"always" | "desktop"` (default: always)

Always visible by default. Desktop hints hide on mobile viewports.


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.