Needless UI

ਕੰਪੋਨੈਂਟ

Dialog

ਨੇਟਿਵ dialog ਐਲੀਮੈਂਟ ’ਤੇ ਬਣੀ ਮੋਡਲ ਵਿੰਡੋ, ਜਿਸ ਵਿੱਚ ਫ਼ੋਕਸ ਬ੍ਰਾਊਜ਼ਰ ਸੰਭਾਲਦਾ ਹੈ।

ਇੰਪੋਰਟ

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

NuiDialog

ਕਿਸੇ ਨੇਟਿਵ <dialog> ਨੂੰ Needless UI ਡਾਇਲਾਗ ਵਿੱਚ ਬਦਲਦਾ ਹੈ।

ਸਿਲੈਕਟਰ
dialog[nuiDialog]
ਐਕਸਪੋਰਟ ਨਾਮ
nuiDialog
ਨਾਮਟਾਈਪਡਿਫ਼ਾਲਟਵੇਰਵਾ
openਦੋ-ਪਾਸੜbooleanfalseਡਾਇਲਾਗ ਖੁੱਲ੍ਹਾ ਹੈ ਜਾਂ ਨਹੀਂ। ਇਸ ਨੂੰ [(open)] ਨਾਲ ਬਾਈਂਡ ਕਰੋ।
modalਇਨਪੁੱਟbooleantrueਡਾਇਲਾਗ ਨੂੰ ਮੋਡਲ ਵਜੋਂ ਖੋਲ੍ਹਦਾ ਹੈ: ਬੈਕਡ੍ਰੌਪ ਸਮੇਤ, ਅਤੇ ਪਿੱਛੇ ਵਾਲਾ ਪੰਨਾ ਨਿਸ਼ਕਿਰਿਆ ਰਹਿੰਦਾ ਹੈ।
dismissibleਇਨਪੁੱਟbooleantrueEsc ਦਬਾਉਣ ਅਤੇ ਬੈਕਡ੍ਰੌਪ ’ਤੇ ਕਲਿੱਕ ਕਰਨ ਨਾਲ ਡਾਇਲਾਗ ਬੰਦ ਹੋਵੇਗਾ ਜਾਂ ਨਹੀਂ।
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ਇਨਪੁੱਟstring''ਉਹ ਵੈਲਿਊ ਜਿਸ ਨਾਲ ਡਾਇਲਾਗ ਬੰਦ ਹੁੰਦਾ ਹੈ; ਇਸ ਨੂੰ (closed) ਐਮਿਟ ਕਰਦਾ ਹੈ।