مرجع API لمكوّن Dialog

الاستيراد

import-dialog.ts

import {
  NuiDialog,
  NuiDialogActions,
  NuiDialogClose,
  NuiDialogDescription,
  NuiDialogTitle,
} from '@needless-ui/angular/dialog';

NuiDialog

يحوّل عنصر <dialog> الأصلي إلى مربع حوار من Needless UI.

المُحدِّد: dialog[nuiDialog]
يُصدَّر باسم: nuiDialog

NuiDialog: الخصائص
الاسم	النوع	القيمة الافتراضية	الوصف
`open`ثنائي الاتجاه	`boolean`	`false`	يحدد ما إذا كان مربع الحوار مفتوحًا. اربطه عبر `[(open)]`.
`modal`مُدخَل	`boolean`	`true`	يُفتح بشكل مشروط، مع خلفية وصفحة غير قابلة للتفاعل خلفه.
`dismissible`مُدخَل	`boolean`	`true`	يحدد ما إذا كان مفتاح Esc والنقر على الخلفية يُغلقان مربع الحوار.
`size`مُدخَل	`'sm' \| 'md' \| 'lg'`	`'md'`	العرض الأقصى: `sm` (24rem) أو `md` (32rem) أو `lg` (44rem).
`enter`مُدخَل	`NuiEnter`		طريقة ظهوره: `zoom` أو `fade` أو `drop` أو `rise` أو `unfold` أو `flip` أو `swing` أو `slide` أو `none`.
`motion`مُدخَل	`NuiMotion`		النابض الذي يتحرك به: `snappy` أو `bouncy` أو `jelly` أو `elastic` أو `lazy` أو `mechanical` أو `none`.
`spring`مُدخَل	`NuiSpring`		أي نابض تريده بصيغة `{ stiffness, damping, mass }`، ويُحوَّل إلى CSS أثناء التشغيل. وله الأولوية على `motion`.
`corners`مُدخَل	`NuiCorners`		شكل زواياه: `round` أو `squircle` أو `bevel` أو `scoop` أو `notch` أو `square`.
`radius`مُدخَل	`NuiRadius`		حجم زواياه: `none` أو `small` أو `medium` أو `large` أو `full`.
`density`مُدخَل	`NuiDensity`		المساحة التي يشغلها: `compact` أو `regular` أو `roomy`.
`closed`مُخرَج	`string`		يُطلق قيمة الإرجاع في كل مرة يُغلق فيها مربع الحوار، وتكون فارغة إذا أُغلق دون اختيار.
`close`دالة	`(returnValue?: string) => void`		يُغلق مربع الحوار مع قيمة إرجاع اختيارية.

مُدخلات التخصيص التي تتركها دون ضبط تتبع أقرب سمة data-nui-*. راجع دليل التخصيص.

NuiDialogTitle

عنوان مربع الحوار. يحصل على معرّف (id) ويصبح قيمة aria-labelledby لمربع الحوار.

المُحدِّد: [nuiDialogTitle]

NuiDialogDescription

وصف قصير يُشير إليه aria-describedby في مربع الحوار.

المُحدِّد: [nuiDialogDescription]

NuiDialogActions

صف من الأزرار أسفل مربع الحوار، بمحاذاة نهاية السطر.

المُحدِّد: [nuiDialogActions]

NuiDialogClose

يُغلق مربع الحوار الذي يحتويه عند النقر عليه.

المُحدِّد: [nuiDialogClose]

NuiDialogClose: الخصائص
الاسم	النوع	القيمة الافتراضية	الوصف
`nuiDialogClose`مُدخَل	`string`	`''`	القيمة التي يُغلق بها مربع الحوار، ويُطلقها `(closed)`.