@bitrise/bitkit-v2 0.3.219 → 0.3.220
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/AGENTS.md +5 -0
- package/dist/components/BitkitDialog/BitkitDialog.d.ts +3 -1
- package/dist/components/BitkitDialog/BitkitDialog.js +5 -2
- package/dist/components/BitkitDialog/BitkitDialog.js.map +1 -1
- package/dist/components/BitkitDialog/BitkitDialogContent.d.ts +2 -1
- package/dist/components/BitkitDialog/BitkitDialogContent.js +5 -2
- package/dist/components/BitkitDialog/BitkitDialogContent.js.map +1 -1
- package/docs/v1-to-v2-migration-guide.md +21 -0
- package/package.json +1 -1
package/AGENTS.md
CHANGED
|
@@ -92,6 +92,11 @@ Bitkit components use consistent prop names across the library:
|
|
|
92
92
|
<BitkitAccordion.ItemTrigger suffix={<Badge>3</Badge>}>Files</BitkitAccordion.ItemTrigger>
|
|
93
93
|
```
|
|
94
94
|
- **Form components are flat** — `BitkitTextInput`, `BitkitSelect`, `BitkitCombobox`, etc. expose `label`, `errorText`, `helperText`, etc. directly as props. No need to wrap in a separate field component.
|
|
95
|
+
- **`BitkitDialog` non-dismissible + post-close callback** — pass `closable={false}` to make the dialog fully non-dismissible: the close button is rendered but disabled (kept for layout consistency), ESC is blocked, and outside clicks are ignored. The only way out is an explicit footer action. Pass `onExitComplete` to run code after the close animation finishes (navigation, focus restoration, cleanup):
|
|
96
|
+
```tsx
|
|
97
|
+
<BitkitDialog closable={false} open={open} onOpenChange={…} title="Action required">…</BitkitDialog>
|
|
98
|
+
<BitkitDialog open={open} onExitComplete={() => navigate('/next')} onOpenChange={…} title="…">…</BitkitDialog>
|
|
99
|
+
```
|
|
95
100
|
|
|
96
101
|
## Coding rules
|
|
97
102
|
|
|
@@ -3,8 +3,10 @@ import { ReactNode } from 'react';
|
|
|
3
3
|
import { BitkitDialogHeaderProps } from './BitkitDialogHeader';
|
|
4
4
|
export interface BitkitDialogProps {
|
|
5
5
|
children?: ReactNode;
|
|
6
|
+
closable?: boolean;
|
|
6
7
|
headerLabel?: string;
|
|
7
8
|
maxHeight?: string;
|
|
9
|
+
onExitComplete?: () => void;
|
|
8
10
|
onOpenChange?: (details: {
|
|
9
11
|
open: boolean;
|
|
10
12
|
}) => void;
|
|
@@ -19,7 +21,7 @@ export interface BitkitDialogProps {
|
|
|
19
21
|
variant?: 'overflowContent';
|
|
20
22
|
}
|
|
21
23
|
declare const _default: {
|
|
22
|
-
({ children, headerLabel, maxHeight, onOpenChange, open, preventScroll, scrollBehavior: scrollBehaviorProp, showScrollGradient, size, step, title, trigger, variant, }: BitkitDialogProps): import("react/jsx-runtime").JSX.Element;
|
|
24
|
+
({ children, closable, headerLabel, maxHeight, onExitComplete, onOpenChange, open, preventScroll, scrollBehavior: scrollBehaviorProp, showScrollGradient, size, step, title, trigger, variant, }: BitkitDialogProps): import("react/jsx-runtime").JSX.Element;
|
|
23
25
|
displayName: string;
|
|
24
26
|
} & {
|
|
25
27
|
ActionTrigger: import('react').ForwardRefExoticComponent<Dialog.ActionTriggerProps & import('react').RefAttributes<HTMLButtonElement>>;
|
|
@@ -9,23 +9,26 @@ import { jsx, jsxs } from "react/jsx-runtime";
|
|
|
9
9
|
import { Portal } from "@chakra-ui/react/portal";
|
|
10
10
|
import { Dialog } from "@chakra-ui/react/dialog";
|
|
11
11
|
//#region lib/components/BitkitDialog/BitkitDialog.tsx
|
|
12
|
-
var BitkitDialog = ({ children, headerLabel, maxHeight, onOpenChange, open, preventScroll, scrollBehavior: scrollBehaviorProp, showScrollGradient, size, step = 0, title, trigger, variant }) => {
|
|
12
|
+
var BitkitDialog = ({ children, closable = true, headerLabel, maxHeight, onExitComplete, onOpenChange, open, preventScroll, scrollBehavior: scrollBehaviorProp, showScrollGradient, size, step = 0, title, trigger, variant }) => {
|
|
13
13
|
const scrollBehavior = variant === "overflowContent" ? "inside" : scrollBehaviorProp;
|
|
14
14
|
const childrenArray = Children.toArray(children);
|
|
15
15
|
const headerChild = childrenArray.find((child) => isValidElement(child) && child.type === BitkitDialogHeader);
|
|
16
16
|
const bodyChildren = childrenArray.filter((child) => !(isValidElement(child) && child.type === BitkitDialogHeader));
|
|
17
17
|
const stepHeader = isValidElement(headerChild) ? headerChild.props.children : void 0;
|
|
18
18
|
return /* @__PURE__ */ jsxs(BitkitDialogRoot, {
|
|
19
|
+
closeOnEscape: closable,
|
|
20
|
+
onExitComplete,
|
|
21
|
+
onOpenChange,
|
|
19
22
|
open,
|
|
20
23
|
preventScroll,
|
|
21
24
|
scrollBehavior,
|
|
22
25
|
size,
|
|
23
26
|
variant,
|
|
24
|
-
onOpenChange,
|
|
25
27
|
children: [trigger && /* @__PURE__ */ jsx(Dialog.Trigger, {
|
|
26
28
|
asChild: true,
|
|
27
29
|
children: trigger
|
|
28
30
|
}), /* @__PURE__ */ jsxs(Portal, { children: [/* @__PURE__ */ jsx(Dialog.Backdrop, {}), /* @__PURE__ */ jsx(Dialog.Positioner, { children: /* @__PURE__ */ jsx(BitkitDialogContent, {
|
|
31
|
+
closable,
|
|
29
32
|
headerLabel,
|
|
30
33
|
maxHeight,
|
|
31
34
|
scrollBehavior,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BitkitDialog.js","names":[],"sources":["../../../lib/components/BitkitDialog/BitkitDialog.tsx"],"sourcesContent":["import { Dialog } from '@chakra-ui/react/dialog';\nimport { Portal } from '@chakra-ui/react/portal';\nimport { Children, isValidElement, type ReactNode } from 'react';\n\nimport BitkitDialogBody from './BitkitDialogBody';\nimport BitkitDialogButtons from './BitkitDialogButtons';\nimport BitkitDialogContent from './BitkitDialogContent';\nimport BitkitDialogHeader, { type BitkitDialogHeaderProps } from './BitkitDialogHeader';\nimport BitkitDialogRoot from './BitkitDialogRoot';\nimport BitkitDialogStep from './BitkitDialogStep';\n\nexport interface BitkitDialogProps {\n children?: ReactNode;\n headerLabel?: string;\n maxHeight?: string;\n onOpenChange?: (details: { open: boolean }) => void;\n open?: boolean;\n preventScroll?: boolean;\n scrollBehavior?: 'inside' | 'outside';\n showScrollGradient?: boolean;\n size?: 'sm' | 'md' | 'lg';\n step?: number;\n title: ReactNode;\n trigger?: ReactNode;\n variant?: 'overflowContent';\n}\n\nconst BitkitDialog = ({\n children,\n headerLabel,\n maxHeight,\n onOpenChange,\n open,\n preventScroll,\n scrollBehavior: scrollBehaviorProp,\n showScrollGradient,\n size,\n step = 0,\n title,\n trigger,\n variant,\n}: BitkitDialogProps) => {\n const scrollBehavior = variant === 'overflowContent' ? 'inside' : scrollBehaviorProp;\n\n const childrenArray = Children.toArray(children);\n const headerChild = childrenArray.find((child) => isValidElement(child) && child.type === BitkitDialogHeader);\n const bodyChildren = childrenArray.filter((child) => !(isValidElement(child) && child.type === BitkitDialogHeader));\n const stepHeader = isValidElement(headerChild) ? (headerChild.props as BitkitDialogHeaderProps).children : undefined;\n\n return (\n <BitkitDialogRoot\n open={open}\n preventScroll={preventScroll}\n scrollBehavior={scrollBehavior}\n size={size}\n variant={variant}\n
|
|
1
|
+
{"version":3,"file":"BitkitDialog.js","names":[],"sources":["../../../lib/components/BitkitDialog/BitkitDialog.tsx"],"sourcesContent":["import { Dialog } from '@chakra-ui/react/dialog';\nimport { Portal } from '@chakra-ui/react/portal';\nimport { Children, isValidElement, type ReactNode } from 'react';\n\nimport BitkitDialogBody from './BitkitDialogBody';\nimport BitkitDialogButtons from './BitkitDialogButtons';\nimport BitkitDialogContent from './BitkitDialogContent';\nimport BitkitDialogHeader, { type BitkitDialogHeaderProps } from './BitkitDialogHeader';\nimport BitkitDialogRoot from './BitkitDialogRoot';\nimport BitkitDialogStep from './BitkitDialogStep';\n\nexport interface BitkitDialogProps {\n children?: ReactNode;\n closable?: boolean;\n headerLabel?: string;\n maxHeight?: string;\n onExitComplete?: () => void;\n onOpenChange?: (details: { open: boolean }) => void;\n open?: boolean;\n preventScroll?: boolean;\n scrollBehavior?: 'inside' | 'outside';\n showScrollGradient?: boolean;\n size?: 'sm' | 'md' | 'lg';\n step?: number;\n title: ReactNode;\n trigger?: ReactNode;\n variant?: 'overflowContent';\n}\n\nconst BitkitDialog = ({\n children,\n closable = true,\n headerLabel,\n maxHeight,\n onExitComplete,\n onOpenChange,\n open,\n preventScroll,\n scrollBehavior: scrollBehaviorProp,\n showScrollGradient,\n size,\n step = 0,\n title,\n trigger,\n variant,\n}: BitkitDialogProps) => {\n const scrollBehavior = variant === 'overflowContent' ? 'inside' : scrollBehaviorProp;\n\n const childrenArray = Children.toArray(children);\n const headerChild = childrenArray.find((child) => isValidElement(child) && child.type === BitkitDialogHeader);\n const bodyChildren = childrenArray.filter((child) => !(isValidElement(child) && child.type === BitkitDialogHeader));\n const stepHeader = isValidElement(headerChild) ? (headerChild.props as BitkitDialogHeaderProps).children : undefined;\n\n return (\n <BitkitDialogRoot\n closeOnEscape={closable}\n onExitComplete={onExitComplete}\n onOpenChange={onOpenChange}\n open={open}\n preventScroll={preventScroll}\n scrollBehavior={scrollBehavior}\n size={size}\n variant={variant}\n >\n {trigger && <Dialog.Trigger asChild>{trigger}</Dialog.Trigger>}\n <Portal>\n <Dialog.Backdrop />\n <Dialog.Positioner>\n <BitkitDialogContent\n closable={closable}\n headerLabel={headerLabel}\n maxHeight={maxHeight}\n scrollBehavior={scrollBehavior}\n showScrollGradient={showScrollGradient}\n step={step}\n stepHeader={stepHeader}\n title={title}\n variant={variant}\n >\n {bodyChildren}\n </BitkitDialogContent>\n </Dialog.Positioner>\n </Portal>\n </BitkitDialogRoot>\n );\n};\n\nBitkitDialog.displayName = 'BitkitDialog';\n\nexport default Object.assign(BitkitDialog, {\n ActionTrigger: Dialog.ActionTrigger,\n Body: BitkitDialogBody,\n Buttons: BitkitDialogButtons,\n Footer: Dialog.Footer,\n Header: BitkitDialogHeader,\n Step: BitkitDialogStep,\n});\n"],"mappings":";;;;;;;;;;;AA6BA,IAAM,gBAAgB,EACpB,UACA,WAAW,MACX,aACA,WACA,gBACA,cACA,MACA,eACA,gBAAgB,oBAChB,oBACA,MACA,OAAO,GACP,OACA,SACA,cACuB;CACvB,MAAM,iBAAiB,YAAY,oBAAoB,WAAW;CAElE,MAAM,gBAAgB,SAAS,QAAQ,QAAQ;CAC/C,MAAM,cAAc,cAAc,MAAM,UAAU,eAAe,KAAK,KAAK,MAAM,SAAS,kBAAkB;CAC5G,MAAM,eAAe,cAAc,QAAQ,UAAU,EAAE,eAAe,KAAK,KAAK,MAAM,SAAS,mBAAmB;CAClH,MAAM,aAAa,eAAe,WAAW,IAAK,YAAY,MAAkC,WAAW,KAAA;CAE3G,OACE,qBAAC,kBAAD;EACE,eAAe;EACC;EACF;EACR;EACS;EACC;EACV;EACG;YARX,CAUG,WAAW,oBAAC,OAAO,SAAR;GAAgB,SAAA;aAAS;EAAwB,CAAA,GAC7D,qBAAC,QAAD,EAAA,UAAA,CACE,oBAAC,OAAO,UAAR,CAAkB,CAAA,GAClB,oBAAC,OAAO,YAAR,EAAA,UACE,oBAAC,qBAAD;GACY;GACG;GACF;GACK;GACI;GACd;GACM;GACL;GACE;aAER;EACkB,CAAA,EACJ,CAAA,CACb,EAAA,CAAA,CACQ;;AAEtB;AAEA,aAAa,cAAc;AAE3B,IAAA,uBAAe,OAAO,OAAO,cAAc;CACzC,eAAe,OAAO;CACtB,MAAM;CACN,SAAS;CACT,QAAQ,OAAO;CACf,QAAQ;CACR,MAAM;AACR,CAAC"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { ReactNode } from 'react';
|
|
2
2
|
export interface BitkitDialogContentProps {
|
|
3
3
|
children?: ReactNode;
|
|
4
|
+
closable?: boolean;
|
|
4
5
|
headerLabel?: string;
|
|
5
6
|
maxHeight?: string;
|
|
6
7
|
scrollBehavior?: 'inside' | 'outside';
|
|
@@ -10,5 +11,5 @@ export interface BitkitDialogContentProps {
|
|
|
10
11
|
title: ReactNode;
|
|
11
12
|
variant?: 'overflowContent';
|
|
12
13
|
}
|
|
13
|
-
declare const BitkitDialogContent: ({ children, headerLabel, maxHeight, scrollBehavior: scrollBehaviorProp, showScrollGradient, step, stepHeader, title, variant, }: BitkitDialogContentProps) => import("react/jsx-runtime").JSX.Element;
|
|
14
|
+
declare const BitkitDialogContent: ({ children, closable, headerLabel, maxHeight, scrollBehavior: scrollBehaviorProp, showScrollGradient, step, stepHeader, title, variant, }: BitkitDialogContentProps) => import("react/jsx-runtime").JSX.Element;
|
|
14
15
|
export default BitkitDialogContent;
|
|
@@ -6,7 +6,7 @@ import { chakra } from "@chakra-ui/react/styled-system";
|
|
|
6
6
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
7
7
|
import { Dialog, useDialogStyles } from "@chakra-ui/react/dialog";
|
|
8
8
|
//#region lib/components/BitkitDialog/BitkitDialogContent.tsx
|
|
9
|
-
var BitkitDialogContent = ({ children, headerLabel, maxHeight, scrollBehavior: scrollBehaviorProp = "outside", showScrollGradient = true, step = 0, stepHeader, title, variant }) => {
|
|
9
|
+
var BitkitDialogContent = ({ children, closable = true, headerLabel, maxHeight, scrollBehavior: scrollBehaviorProp = "outside", showScrollGradient = true, step = 0, stepHeader, title, variant }) => {
|
|
10
10
|
const scrollBehavior = variant === "overflowContent" ? "inside" : scrollBehaviorProp;
|
|
11
11
|
const styles = useDialogStyles();
|
|
12
12
|
return /* @__PURE__ */ jsx(Dialog.Content, {
|
|
@@ -34,7 +34,10 @@ var BitkitDialogContent = ({ children, headerLabel, maxHeight, scrollBehavior: s
|
|
|
34
34
|
}),
|
|
35
35
|
/* @__PURE__ */ jsx(Dialog.CloseTrigger, {
|
|
36
36
|
asChild: true,
|
|
37
|
-
children: /* @__PURE__ */ jsx(BitkitCloseButton, {
|
|
37
|
+
children: /* @__PURE__ */ jsx(BitkitCloseButton, {
|
|
38
|
+
disabled: !closable,
|
|
39
|
+
size: variant === "overflowContent" ? "xs" : "md"
|
|
40
|
+
})
|
|
38
41
|
})
|
|
39
42
|
] }), children]
|
|
40
43
|
})
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BitkitDialogContent.js","names":[],"sources":["../../../lib/components/BitkitDialog/BitkitDialogContent.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Dialog, useDialogStyles } from '@chakra-ui/react/dialog';\nimport { chakra } from '@chakra-ui/react/styled-system';\nimport { type ReactNode } from 'react';\n\nimport BitkitCloseButton from '../BitkitCloseButton/BitkitCloseButton';\nimport { DialogBodyContext } from './BitkitDialogBody';\nimport { BitkitDialogStepProvider } from './BitkitDialogStepContext';\n\nexport interface BitkitDialogContentProps {\n children?: ReactNode;\n headerLabel?: string;\n maxHeight?: string;\n scrollBehavior?: 'inside' | 'outside';\n showScrollGradient?: boolean;\n step?: number;\n stepHeader?: ReactNode;\n title: ReactNode;\n variant?: 'overflowContent';\n}\n\nconst BitkitDialogContent = ({\n children,\n headerLabel,\n maxHeight,\n scrollBehavior: scrollBehaviorProp = 'outside',\n showScrollGradient = true,\n step = 0,\n stepHeader,\n title,\n variant,\n}: BitkitDialogContentProps) => {\n const scrollBehavior = variant === 'overflowContent' ? 'inside' : scrollBehaviorProp;\n const styles = useDialogStyles();\n\n return (\n <Dialog.Content maxHeight={maxHeight}>\n <BitkitDialogStepProvider value={{ step }}>\n <DialogBodyContext.Provider value={{ scrollBehavior, showScrollGradient }}>\n <Dialog.Header>\n <Box display=\"flex\" flexDirection=\"column\" gap=\"4\">\n {headerLabel && <chakra.p css={styles.label}>{headerLabel}</chakra.p>}\n <Dialog.Title>{title}</Dialog.Title>\n </Box>\n {!!stepHeader && <Box css={styles.stepHeader}>{stepHeader}</Box>}\n <Dialog.CloseTrigger asChild>\n <BitkitCloseButton size={variant === 'overflowContent' ? 'xs' : 'md'} />\n </Dialog.CloseTrigger>\n </Dialog.Header>\n {children}\n </DialogBodyContext.Provider>\n </BitkitDialogStepProvider>\n </Dialog.Content>\n );\n};\n\nexport default BitkitDialogContent;\n"],"mappings":";;;;;;;;
|
|
1
|
+
{"version":3,"file":"BitkitDialogContent.js","names":[],"sources":["../../../lib/components/BitkitDialog/BitkitDialogContent.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Dialog, useDialogStyles } from '@chakra-ui/react/dialog';\nimport { chakra } from '@chakra-ui/react/styled-system';\nimport { type ReactNode } from 'react';\n\nimport BitkitCloseButton from '../BitkitCloseButton/BitkitCloseButton';\nimport { DialogBodyContext } from './BitkitDialogBody';\nimport { BitkitDialogStepProvider } from './BitkitDialogStepContext';\n\nexport interface BitkitDialogContentProps {\n children?: ReactNode;\n closable?: boolean;\n headerLabel?: string;\n maxHeight?: string;\n scrollBehavior?: 'inside' | 'outside';\n showScrollGradient?: boolean;\n step?: number;\n stepHeader?: ReactNode;\n title: ReactNode;\n variant?: 'overflowContent';\n}\n\nconst BitkitDialogContent = ({\n children,\n closable = true,\n headerLabel,\n maxHeight,\n scrollBehavior: scrollBehaviorProp = 'outside',\n showScrollGradient = true,\n step = 0,\n stepHeader,\n title,\n variant,\n}: BitkitDialogContentProps) => {\n const scrollBehavior = variant === 'overflowContent' ? 'inside' : scrollBehaviorProp;\n const styles = useDialogStyles();\n\n return (\n <Dialog.Content maxHeight={maxHeight}>\n <BitkitDialogStepProvider value={{ step }}>\n <DialogBodyContext.Provider value={{ scrollBehavior, showScrollGradient }}>\n <Dialog.Header>\n <Box display=\"flex\" flexDirection=\"column\" gap=\"4\">\n {headerLabel && <chakra.p css={styles.label}>{headerLabel}</chakra.p>}\n <Dialog.Title>{title}</Dialog.Title>\n </Box>\n {!!stepHeader && <Box css={styles.stepHeader}>{stepHeader}</Box>}\n <Dialog.CloseTrigger asChild>\n <BitkitCloseButton disabled={!closable} size={variant === 'overflowContent' ? 'xs' : 'md'} />\n </Dialog.CloseTrigger>\n </Dialog.Header>\n {children}\n </DialogBodyContext.Provider>\n </BitkitDialogStepProvider>\n </Dialog.Content>\n );\n};\n\nexport default BitkitDialogContent;\n"],"mappings":";;;;;;;;AAsBA,IAAM,uBAAuB,EAC3B,UACA,WAAW,MACX,aACA,WACA,gBAAgB,qBAAqB,WACrC,qBAAqB,MACrB,OAAO,GACP,YACA,OACA,cAC8B;CAC9B,MAAM,iBAAiB,YAAY,oBAAoB,WAAW;CAClE,MAAM,SAAS,gBAAgB;CAE/B,OACE,oBAAC,OAAO,SAAR;EAA2B;YACzB,oBAAC,0BAAD;GAA0B,OAAO,EAAE,KAAK;aACtC,qBAAC,kBAAkB,UAAnB;IAA4B,OAAO;KAAE;KAAgB;IAAmB;cAAxE,CACE,qBAAC,OAAO,QAAR,EAAA,UAAA;KACE,qBAAC,KAAD;MAAK,SAAQ;MAAO,eAAc;MAAS,KAAI;gBAA/C,CACG,eAAe,oBAAC,OAAO,GAAR;OAAU,KAAK,OAAO;iBAAQ;MAAsB,CAAA,GACpE,oBAAC,OAAO,OAAR,EAAA,UAAe,MAAoB,CAAA,CAChC;;KACJ,CAAC,CAAC,cAAc,oBAAC,KAAD;MAAK,KAAK,OAAO;gBAAa;KAAgB,CAAA;KAC/D,oBAAC,OAAO,cAAR;MAAqB,SAAA;gBACnB,oBAAC,mBAAD;OAAmB,UAAU,CAAC;OAAU,MAAM,YAAY,oBAAoB,OAAO;MAAO,CAAA;KACzE,CAAA;IACR,EAAA,CAAA,GACd,QACyB;;EACJ,CAAA;CACZ,CAAA;AAEpB"}
|
|
@@ -112,6 +112,27 @@ createBitkitToast({ variant: 'critical', titleText: 'Oops', messageText: 'Someth
|
|
|
112
112
|
|
|
113
113
|
Key changes: `isOpen` → `open`, `onClose` → `onOpenChange` (receives `{ open: boolean }`).
|
|
114
114
|
|
|
115
|
+
Other prop mappings:
|
|
116
|
+
|
|
117
|
+
| v1 | v2 |
|
|
118
|
+
|----|----|
|
|
119
|
+
| `isClosable={false}` | `closable={false}` |
|
|
120
|
+
| `onCloseComplete={fn}` | `onExitComplete={fn}` (fires when the close animation finishes) |
|
|
121
|
+
|
|
122
|
+
`closable={false}` matches v1: the header close button is **rendered but disabled** (kept in place so the header layout stays consistent), **ESC is blocked**, and overlay/outside clicks are ignored (`closeOnInteractOutside` is already `false` by default on `BitkitDialogRoot`). The only way to dismiss the dialog is through an explicit footer action.
|
|
123
|
+
|
|
124
|
+
If you're composing the lower-level primitives directly, you have to set the same controls explicitly: pass `closeOnEscape={false}` to `BitkitDialogRoot` and `closable={false}` to `BitkitDialogContent`.
|
|
125
|
+
|
|
126
|
+
```tsx
|
|
127
|
+
// Acknowledge-only dialog
|
|
128
|
+
<BitkitDialog closable={false} open={open} onOpenChange={…} title="Action required">…</BitkitDialog>
|
|
129
|
+
|
|
130
|
+
// Run code after the close animation completes (e.g. navigation, focus restoration)
|
|
131
|
+
<BitkitDialog open={open} onOpenChange={…} onExitComplete={() => navigate('/next')} title="…">
|
|
132
|
+
…
|
|
133
|
+
</BitkitDialog>
|
|
134
|
+
```
|
|
135
|
+
|
|
115
136
|
### Tabs
|
|
116
137
|
|
|
117
138
|
The API changed fundamentally — from index-based to value-based:
|