@bitrise/bitkit-v2 0.3.332 → 0.3.333
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/dist/components/BitkitDialog/BitkitDialog.d.ts +4 -1
- package/dist/components/BitkitDialog/BitkitDialog.js +2 -1
- package/dist/components/BitkitDialog/BitkitDialog.js.map +1 -1
- package/dist/components/BitkitDialog/BitkitFormDialog.js +2 -1
- package/dist/components/BitkitDialog/BitkitFormDialog.js.map +1 -1
- package/dist/components/BitkitDialog/BitkitStepperDialog.d.ts +4 -1
- package/dist/components/BitkitDialog/BitkitStepperDialog.js +2 -1
- package/dist/components/BitkitDialog/BitkitStepperDialog.js.map +1 -1
- package/dist/components/BitkitDialog/DialogShell.d.ts +8 -3
- package/dist/components/BitkitDialog/DialogShell.js +5 -2
- package/dist/components/BitkitDialog/DialogShell.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,11 +1,14 @@
|
|
|
1
1
|
import { Dialog } from '@chakra-ui/react/dialog';
|
|
2
2
|
import { ReactNode } from 'react';
|
|
3
|
+
import { DialogShellProps } from './DialogShell';
|
|
3
4
|
export interface BitkitDialogProps {
|
|
4
5
|
children?: ReactNode;
|
|
5
6
|
closable?: boolean;
|
|
6
7
|
footerButtons?: ReactNode;
|
|
7
8
|
footerContent?: ReactNode;
|
|
8
9
|
headerLabel?: string;
|
|
10
|
+
/** Element to focus when the dialog opens, instead of the first focusable one. */
|
|
11
|
+
initialFocusEl?: DialogShellProps['initialFocusEl'];
|
|
9
12
|
maxHeight?: string;
|
|
10
13
|
onExitComplete?: () => void;
|
|
11
14
|
onOpenChange?: (details: {
|
|
@@ -21,7 +24,7 @@ export interface BitkitDialogProps {
|
|
|
21
24
|
variant?: 'overflowContent';
|
|
22
25
|
}
|
|
23
26
|
declare const _default: {
|
|
24
|
-
({ children, closable, footerButtons, footerContent, headerLabel, maxHeight, onExitComplete, onOpenChange, open, preventScroll, scrollBehavior, showScrollGradient, size, title, trigger, variant, }: BitkitDialogProps): import("react").JSX.Element;
|
|
27
|
+
({ children, closable, footerButtons, footerContent, headerLabel, initialFocusEl, maxHeight, onExitComplete, onOpenChange, open, preventScroll, scrollBehavior, showScrollGradient, size, title, trigger, variant, }: BitkitDialogProps): import("react").JSX.Element;
|
|
25
28
|
displayName: string;
|
|
26
29
|
} & {
|
|
27
30
|
ActionTrigger: import('react').ForwardRefExoticComponent<Dialog.ActionTriggerProps & import('react').RefAttributes<HTMLButtonElement>>;
|
|
@@ -4,8 +4,9 @@ import DialogShell from "./DialogShell.js";
|
|
|
4
4
|
import { jsx } from "react/jsx-runtime";
|
|
5
5
|
import { Dialog } from "@chakra-ui/react/dialog";
|
|
6
6
|
//#region lib/components/BitkitDialog/BitkitDialog.tsx
|
|
7
|
-
var BitkitDialog = ({ children, closable = true, footerButtons, footerContent, headerLabel, maxHeight, onExitComplete, onOpenChange, open, preventScroll, scrollBehavior, showScrollGradient, size, title, trigger, variant }) => /* @__PURE__ */ jsx(DialogShell, {
|
|
7
|
+
var BitkitDialog = ({ children, closable = true, footerButtons, footerContent, headerLabel, initialFocusEl, maxHeight, onExitComplete, onOpenChange, open, preventScroll, scrollBehavior, showScrollGradient, size, title, trigger, variant }) => /* @__PURE__ */ jsx(DialogShell, {
|
|
8
8
|
closable,
|
|
9
|
+
initialFocusEl,
|
|
9
10
|
onExitComplete,
|
|
10
11
|
onOpenChange,
|
|
11
12
|
open,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BitkitDialog.js","names":[],"sources":["../../../lib/components/BitkitDialog/BitkitDialog.tsx"],"sourcesContent":["import { Dialog } from '@chakra-ui/react/dialog';\nimport { type ReactNode } from 'react';\n\nimport { withSubComponents } from '../../utilities/withSubComponents';\nimport DialogInner from './DialogInner';\nimport DialogShell from './DialogShell';\n\nexport interface BitkitDialogProps {\n children?: ReactNode;\n closable?: boolean;\n footerButtons?: ReactNode;\n footerContent?: ReactNode;\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' | 'full';\n title: ReactNode;\n trigger?: ReactNode;\n variant?: 'overflowContent';\n}\n\nconst BitkitDialog = ({\n children,\n closable = true,\n footerButtons,\n footerContent,\n headerLabel,\n maxHeight,\n onExitComplete,\n onOpenChange,\n open,\n preventScroll,\n scrollBehavior,\n showScrollGradient,\n size,\n title,\n trigger,\n variant,\n}: BitkitDialogProps) => (\n <DialogShell\n closable={closable}\n onExitComplete={onExitComplete}\n onOpenChange={onOpenChange}\n open={open}\n preventScroll={preventScroll}\n scrollBehavior={scrollBehavior}\n size={size}\n trigger={trigger}\n variant={variant}\n >\n <Dialog.Content maxHeight={maxHeight}>\n <DialogInner\n closable={closable}\n footerButtons={footerButtons}\n footerContent={footerContent}\n headerLabel={headerLabel}\n scrollBehavior={scrollBehavior}\n showScrollGradient={showScrollGradient}\n title={title}\n variant={variant}\n >\n {children}\n </DialogInner>\n </Dialog.Content>\n </DialogShell>\n);\n\nBitkitDialog.displayName = 'BitkitDialog';\n\nexport default withSubComponents(BitkitDialog, { ActionTrigger: Dialog.ActionTrigger });\n"],"mappings":";;;;;;
|
|
1
|
+
{"version":3,"file":"BitkitDialog.js","names":[],"sources":["../../../lib/components/BitkitDialog/BitkitDialog.tsx"],"sourcesContent":["import { Dialog } from '@chakra-ui/react/dialog';\nimport { type ReactNode } from 'react';\n\nimport { withSubComponents } from '../../utilities/withSubComponents';\nimport DialogInner from './DialogInner';\nimport DialogShell, { type DialogShellProps } from './DialogShell';\n\nexport interface BitkitDialogProps {\n children?: ReactNode;\n closable?: boolean;\n footerButtons?: ReactNode;\n footerContent?: ReactNode;\n headerLabel?: string;\n /** Element to focus when the dialog opens, instead of the first focusable one. */\n initialFocusEl?: DialogShellProps['initialFocusEl'];\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' | 'full';\n title: ReactNode;\n trigger?: ReactNode;\n variant?: 'overflowContent';\n}\n\nconst BitkitDialog = ({\n children,\n closable = true,\n footerButtons,\n footerContent,\n headerLabel,\n initialFocusEl,\n maxHeight,\n onExitComplete,\n onOpenChange,\n open,\n preventScroll,\n scrollBehavior,\n showScrollGradient,\n size,\n title,\n trigger,\n variant,\n}: BitkitDialogProps) => (\n <DialogShell\n closable={closable}\n initialFocusEl={initialFocusEl}\n onExitComplete={onExitComplete}\n onOpenChange={onOpenChange}\n open={open}\n preventScroll={preventScroll}\n scrollBehavior={scrollBehavior}\n size={size}\n trigger={trigger}\n variant={variant}\n >\n <Dialog.Content maxHeight={maxHeight}>\n <DialogInner\n closable={closable}\n footerButtons={footerButtons}\n footerContent={footerContent}\n headerLabel={headerLabel}\n scrollBehavior={scrollBehavior}\n showScrollGradient={showScrollGradient}\n title={title}\n variant={variant}\n >\n {children}\n </DialogInner>\n </Dialog.Content>\n </DialogShell>\n);\n\nBitkitDialog.displayName = 'BitkitDialog';\n\nexport default withSubComponents(BitkitDialog, { ActionTrigger: Dialog.ActionTrigger });\n"],"mappings":";;;;;;AA4BA,IAAM,gBAAgB,EACpB,UACA,WAAW,MACX,eACA,eACA,aACA,gBACA,WACA,gBACA,cACA,MACA,eACA,gBACA,oBACA,MACA,OACA,SACA,cAEA,oBAAC,aAAD;CACY;CACM;CACA;CACF;CACR;CACS;CACC;CACV;CACG;CACA;CAET,UAAA,oBAAC,OAAO,SAAR;EAA2B;EACzB,UAAA,oBAAC,aAAD;GACY;GACK;GACA;GACF;GACG;GACI;GACb;GACE;GAER;EACU,CAAA;CACC,CAAA;AACL,CAAA;AAGf,aAAa,cAAc;AAE3B,IAAA,uBAAe,kBAAkB,cAAc,EAAE,eAAe,OAAO,cAAc,CAAC"}
|
|
@@ -13,9 +13,10 @@ import { Dialog } from "@chakra-ui/react/dialog";
|
|
|
13
13
|
* does NOT accept Chakra style props (`width`, `padding`, …), which would override the `size` variant.
|
|
14
14
|
*/
|
|
15
15
|
var BitkitFormDialog = forwardRef((props, ref) => {
|
|
16
|
-
const { children, closable = true, footerButtons, footerContent, headerLabel, maxHeight, onExitComplete, onOpenChange, open, preventScroll, scrollBehavior, showScrollGradient, size, title, trigger, variant, ...formProps } = props;
|
|
16
|
+
const { children, closable = true, footerButtons, footerContent, headerLabel, initialFocusEl, maxHeight, onExitComplete, onOpenChange, open, preventScroll, scrollBehavior, showScrollGradient, size, title, trigger, variant, ...formProps } = props;
|
|
17
17
|
return /* @__PURE__ */ jsx(DialogShell, {
|
|
18
18
|
closable,
|
|
19
|
+
initialFocusEl,
|
|
19
20
|
onExitComplete,
|
|
20
21
|
onOpenChange,
|
|
21
22
|
open,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BitkitFormDialog.js","names":[],"sources":["../../../lib/components/BitkitDialog/BitkitFormDialog.tsx"],"sourcesContent":["import { Dialog } from '@chakra-ui/react/dialog';\nimport { chakra } from '@chakra-ui/react/styled-system';\nimport { type ComponentPropsWithoutRef, forwardRef } from 'react';\n\nimport { withSubComponents } from '../../utilities/withSubComponents';\nimport { type BitkitDialogProps } from './BitkitDialog';\nimport DialogInner from './DialogInner';\nimport DialogShell from './DialogShell';\n\nexport interface BitkitFormDialogProps\n extends BitkitDialogProps, Omit<ComponentPropsWithoutRef<'form'>, keyof BitkitDialogProps> {}\n\n/**\n * A dialog whose entire content is a `<form>`, so a `type=\"submit\"` button in the footer submits\n * natively. Exposes native form attributes (`onSubmit`, `method`, `noValidate`, …) alongside the\n * standard dialog props. Like the other dialog overlays it owns its own layout — it intentionally\n * does NOT accept Chakra style props (`width`, `padding`, …), which would override the `size` variant.\n */\nconst BitkitFormDialog = forwardRef<HTMLFormElement, BitkitFormDialogProps>((props, ref) => {\n const {\n children,\n closable = true,\n footerButtons,\n footerContent,\n headerLabel,\n maxHeight,\n onExitComplete,\n onOpenChange,\n open,\n preventScroll,\n scrollBehavior,\n showScrollGradient,\n size,\n title,\n trigger,\n variant,\n ...formProps\n } = props;\n\n return (\n <DialogShell\n closable={closable}\n onExitComplete={onExitComplete}\n onOpenChange={onOpenChange}\n open={open}\n preventScroll={preventScroll}\n scrollBehavior={scrollBehavior}\n size={size}\n trigger={trigger}\n variant={variant}\n >\n <Dialog.Content asChild maxHeight={maxHeight}>\n <chakra.form ref={ref} {...formProps}>\n <DialogInner\n closable={closable}\n footerButtons={footerButtons}\n footerContent={footerContent}\n headerLabel={headerLabel}\n scrollBehavior={scrollBehavior}\n showScrollGradient={showScrollGradient}\n title={title}\n variant={variant}\n >\n {children}\n </DialogInner>\n </chakra.form>\n </Dialog.Content>\n </DialogShell>\n );\n});\n\nBitkitFormDialog.displayName = 'BitkitFormDialog';\n\nexport default withSubComponents(BitkitFormDialog, { ActionTrigger: Dialog.ActionTrigger });\n"],"mappings":";;;;;;;;;;;;;;AAkBA,IAAM,mBAAmB,YAAoD,OAAO,QAAQ;CAC1F,MAAM,EACJ,UACA,WAAW,MACX,eACA,eACA,aACA,WACA,gBACA,cACA,MACA,eACA,gBACA,oBACA,MACA,OACA,SACA,SACA,GAAG,cACD;CAEJ,OACE,oBAAC,aAAD;EACY;EACM;EACF;EACR;EACS;EACC;EACV;EACG;EACA;EAET,UAAA,oBAAC,OAAO,SAAR;GAAgB,SAAA;GAAmB;GACjC,UAAA,oBAAC,OAAO,MAAR;IAAkB;IAAK,GAAI;IACzB,UAAA,oBAAC,aAAD;KACY;KACK;KACA;KACF;KACG;KACI;KACb;KACE;KAER;IACU,CAAA;GACF,CAAA;EACC,CAAA;CACL,CAAA;AAEjB,CAAC;AAED,iBAAiB,cAAc;AAE/B,IAAA,2BAAe,kBAAkB,kBAAkB,EAAE,eAAe,OAAO,cAAc,CAAC"}
|
|
1
|
+
{"version":3,"file":"BitkitFormDialog.js","names":[],"sources":["../../../lib/components/BitkitDialog/BitkitFormDialog.tsx"],"sourcesContent":["import { Dialog } from '@chakra-ui/react/dialog';\nimport { chakra } from '@chakra-ui/react/styled-system';\nimport { type ComponentPropsWithoutRef, forwardRef } from 'react';\n\nimport { withSubComponents } from '../../utilities/withSubComponents';\nimport { type BitkitDialogProps } from './BitkitDialog';\nimport DialogInner from './DialogInner';\nimport DialogShell from './DialogShell';\n\nexport interface BitkitFormDialogProps\n extends BitkitDialogProps, Omit<ComponentPropsWithoutRef<'form'>, keyof BitkitDialogProps> {}\n\n/**\n * A dialog whose entire content is a `<form>`, so a `type=\"submit\"` button in the footer submits\n * natively. Exposes native form attributes (`onSubmit`, `method`, `noValidate`, …) alongside the\n * standard dialog props. Like the other dialog overlays it owns its own layout — it intentionally\n * does NOT accept Chakra style props (`width`, `padding`, …), which would override the `size` variant.\n */\nconst BitkitFormDialog = forwardRef<HTMLFormElement, BitkitFormDialogProps>((props, ref) => {\n const {\n children,\n closable = true,\n footerButtons,\n footerContent,\n headerLabel,\n initialFocusEl,\n maxHeight,\n onExitComplete,\n onOpenChange,\n open,\n preventScroll,\n scrollBehavior,\n showScrollGradient,\n size,\n title,\n trigger,\n variant,\n ...formProps\n } = props;\n\n return (\n <DialogShell\n closable={closable}\n initialFocusEl={initialFocusEl}\n onExitComplete={onExitComplete}\n onOpenChange={onOpenChange}\n open={open}\n preventScroll={preventScroll}\n scrollBehavior={scrollBehavior}\n size={size}\n trigger={trigger}\n variant={variant}\n >\n <Dialog.Content asChild maxHeight={maxHeight}>\n <chakra.form ref={ref} {...formProps}>\n <DialogInner\n closable={closable}\n footerButtons={footerButtons}\n footerContent={footerContent}\n headerLabel={headerLabel}\n scrollBehavior={scrollBehavior}\n showScrollGradient={showScrollGradient}\n title={title}\n variant={variant}\n >\n {children}\n </DialogInner>\n </chakra.form>\n </Dialog.Content>\n </DialogShell>\n );\n});\n\nBitkitFormDialog.displayName = 'BitkitFormDialog';\n\nexport default withSubComponents(BitkitFormDialog, { ActionTrigger: Dialog.ActionTrigger });\n"],"mappings":";;;;;;;;;;;;;;AAkBA,IAAM,mBAAmB,YAAoD,OAAO,QAAQ;CAC1F,MAAM,EACJ,UACA,WAAW,MACX,eACA,eACA,aACA,gBACA,WACA,gBACA,cACA,MACA,eACA,gBACA,oBACA,MACA,OACA,SACA,SACA,GAAG,cACD;CAEJ,OACE,oBAAC,aAAD;EACY;EACM;EACA;EACF;EACR;EACS;EACC;EACV;EACG;EACA;EAET,UAAA,oBAAC,OAAO,SAAR;GAAgB,SAAA;GAAmB;GACjC,UAAA,oBAAC,OAAO,MAAR;IAAkB;IAAK,GAAI;IACzB,UAAA,oBAAC,aAAD;KACY;KACK;KACA;KACF;KACG;KACI;KACb;KACE;KAER;IACU,CAAA;GACF,CAAA;EACC,CAAA;CACL,CAAA;AAEjB,CAAC;AAED,iBAAiB,cAAc;AAE/B,IAAA,2BAAe,kBAAkB,kBAAkB,EAAE,eAAe,OAAO,cAAc,CAAC"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { Dialog } from '@chakra-ui/react/dialog';
|
|
2
2
|
import { ReactNode } from 'react';
|
|
3
3
|
import { BitkitStepperDialogStepProps } from './BitkitStepperDialogStep';
|
|
4
|
+
import { DialogShellProps } from './DialogShell';
|
|
4
5
|
export { useStepperDialog } from './StepperContext';
|
|
5
6
|
export interface BitkitStepperDialogProps {
|
|
6
7
|
/** `BitkitStepperDialog.Step` children, one per step. */
|
|
@@ -8,6 +9,8 @@ export interface BitkitStepperDialogProps {
|
|
|
8
9
|
closable?: boolean;
|
|
9
10
|
/** Initial step when uncontrolled. Resets to this when the dialog closes. */
|
|
10
11
|
defaultStep?: number;
|
|
12
|
+
/** Element to focus when the dialog opens, instead of the first focusable one. */
|
|
13
|
+
initialFocusEl?: DialogShellProps['initialFocusEl'];
|
|
11
14
|
/**
|
|
12
15
|
* Footer content rendered raw. Stepper footers are space-between (Cancel left, Prev/Next right),
|
|
13
16
|
* so build the nav row here with `useStepperDialog()` — there is no `footerButtons` slot, which
|
|
@@ -34,7 +37,7 @@ export interface BitkitStepperDialogProps {
|
|
|
34
37
|
variant?: 'overflowContent';
|
|
35
38
|
}
|
|
36
39
|
declare const _default: {
|
|
37
|
-
({ children, closable, defaultStep, footerContent, headerLabel, maxHeight, onExitComplete, onOpenChange, onStepChange, open, preventScroll, scrollBehavior, showScrollGradient, size, step: stepProp, title, trigger, variant, }: BitkitStepperDialogProps): import("react").JSX.Element;
|
|
40
|
+
({ children, closable, defaultStep, initialFocusEl, footerContent, headerLabel, maxHeight, onExitComplete, onOpenChange, onStepChange, open, preventScroll, scrollBehavior, showScrollGradient, size, step: stepProp, title, trigger, variant, }: BitkitStepperDialogProps): import("react").JSX.Element;
|
|
38
41
|
displayName: string;
|
|
39
42
|
} & {
|
|
40
43
|
ActionTrigger: import('react').ForwardRefExoticComponent<Dialog.ActionTriggerProps & import('react').RefAttributes<HTMLButtonElement>>;
|
|
@@ -13,7 +13,7 @@ import { Dialog } from "@chakra-ui/react/dialog";
|
|
|
13
13
|
* state, auto-renders the steps header, and shows only the active step's body. Footer navigation is
|
|
14
14
|
* wired by the consumer through the `useStepperDialog()` hook.
|
|
15
15
|
*/
|
|
16
|
-
var BitkitStepperDialog = ({ children, closable = true, defaultStep = 0, footerContent, headerLabel, maxHeight, onExitComplete, onOpenChange, onStepChange, open, preventScroll, scrollBehavior, showScrollGradient, size, step: stepProp, title, trigger, variant }) => {
|
|
16
|
+
var BitkitStepperDialog = ({ children, closable = true, defaultStep = 0, initialFocusEl, footerContent, headerLabel, maxHeight, onExitComplete, onOpenChange, onStepChange, open, preventScroll, scrollBehavior, showScrollGradient, size, step: stepProp, title, trigger, variant }) => {
|
|
17
17
|
const [internalStep, setInternalStep] = useState(defaultStep);
|
|
18
18
|
const isControlled = stepProp !== void 0;
|
|
19
19
|
const rawStep = (isControlled ? stepProp : internalStep) ?? 0;
|
|
@@ -55,6 +55,7 @@ var BitkitStepperDialog = ({ children, closable = true, defaultStep = 0, footerC
|
|
|
55
55
|
value: ctx,
|
|
56
56
|
children: /* @__PURE__ */ jsx(DialogShell, {
|
|
57
57
|
closable,
|
|
58
|
+
initialFocusEl,
|
|
58
59
|
onExitComplete,
|
|
59
60
|
onOpenChange: handleOpenChange,
|
|
60
61
|
open,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BitkitStepperDialog.js","names":[],"sources":["../../../lib/components/BitkitDialog/BitkitStepperDialog.tsx"],"sourcesContent":["import { Dialog } from '@chakra-ui/react/dialog';\nimport { Children, isValidElement, type ReactElement, type ReactNode, useCallback, useMemo, useState } from 'react';\n\nimport { withSubComponents } from '../../utilities/withSubComponents';\nimport BitkitSteps from '../BitkitSteps/BitkitSteps';\nimport BitkitStepperDialogStep, { type BitkitStepperDialogStepProps } from './BitkitStepperDialogStep';\nimport DialogInner from './DialogInner';\nimport DialogShell from './DialogShell';\nimport { StepperDialogProvider } from './StepperContext';\n\nexport { useStepperDialog } from './StepperContext';\n\nexport interface BitkitStepperDialogProps {\n /** `BitkitStepperDialog.Step` children, one per step. */\n children: ReactNode;\n closable?: boolean;\n /** Initial step when uncontrolled. Resets to this when the dialog closes. */\n defaultStep?: number;\n /**\n * Footer content rendered raw. Stepper footers are space-between (Cancel left, Prev/Next right),\n * so build the nav row here with `useStepperDialog()` — there is no `footerButtons` slot, which\n * would force right-alignment.\n */\n footerContent?: ReactNode;\n headerLabel?: string;\n maxHeight?: string;\n onExitComplete?: () => void;\n onOpenChange?: (details: { open: boolean }) => void;\n /** Called whenever the active step changes (controlled or uncontrolled). */\n onStepChange?: (step: number) => void;\n open?: boolean;\n preventScroll?: boolean;\n scrollBehavior?: 'inside' | 'outside';\n showScrollGradient?: boolean;\n size?: 'sm' | 'md' | 'lg' | 'full';\n /** Controlled active step. Omit for uncontrolled (see `defaultStep`). */\n step?: number;\n title: ReactNode;\n trigger?: ReactNode;\n variant?: 'overflowContent';\n}\n\n/**\n * A dialog that walks through a sequence of `BitkitStepperDialog.Step` children. It owns the step\n * state, auto-renders the steps header, and shows only the active step's body. Footer navigation is\n * wired by the consumer through the `useStepperDialog()` hook.\n */\nconst BitkitStepperDialog = ({\n children,\n closable = true,\n defaultStep = 0,\n footerContent,\n headerLabel,\n maxHeight,\n onExitComplete,\n onOpenChange,\n onStepChange,\n open,\n preventScroll,\n scrollBehavior,\n showScrollGradient,\n size,\n step: stepProp,\n title,\n trigger,\n variant,\n}: BitkitStepperDialogProps) => {\n const [internalStep, setInternalStep] = useState(defaultStep);\n const isControlled = stepProp !== undefined;\n const rawStep = (isControlled ? stepProp : internalStep) ?? 0;\n const steps = Children.toArray(children).filter(\n (child): child is ReactElement<BitkitStepperDialogStepProps> =>\n isValidElement(child) && child.type === BitkitStepperDialogStep,\n );\n const totalSteps = steps.length;\n const step = Math.max(0, Math.min(rawStep, Math.max(0, totalSteps - 1)));\n\n const setStep = useCallback(\n (next: number) => {\n const clamped = Math.max(0, Math.min(next, totalSteps - 1));\n if (!isControlled) setInternalStep(clamped);\n onStepChange?.(clamped);\n },\n [isControlled, onStepChange, totalSteps],\n );\n\n const ctx = useMemo(\n () => ({\n goTo: setStep,\n isFirst: step === 0,\n isLast: step === totalSteps - 1,\n next: () => setStep(step + 1),\n prev: () => setStep(step - 1),\n setStep,\n step,\n totalSteps,\n }),\n [setStep, step, totalSteps],\n );\n\n const handleOpenChange = (details: { open: boolean }) => {\n if (!details.open && !isControlled) setInternalStep(defaultStep);\n onOpenChange?.(details);\n };\n\n const stepsHeader = (\n <BitkitSteps step={step}>\n {steps.map((child, index) => (\n <BitkitSteps.Item key={index} label={child.props.label} />\n ))}\n </BitkitSteps>\n );\n\n return (\n <StepperDialogProvider value={ctx}>\n <DialogShell\n closable={closable}\n onExitComplete={onExitComplete}\n onOpenChange={handleOpenChange}\n open={open}\n preventScroll={preventScroll}\n scrollBehavior={scrollBehavior}\n size={size}\n trigger={trigger}\n variant={variant}\n >\n <Dialog.Content maxHeight={maxHeight}>\n <DialogInner\n closable={closable}\n footerContent={footerContent}\n headerExtra={stepsHeader}\n headerLabel={headerLabel}\n scrollBehavior={scrollBehavior}\n showScrollGradient={showScrollGradient}\n title={title}\n variant={variant}\n >\n {steps[step]}\n </DialogInner>\n </Dialog.Content>\n </DialogShell>\n </StepperDialogProvider>\n );\n};\n\nBitkitStepperDialog.displayName = 'BitkitStepperDialog';\n\nexport default withSubComponents(BitkitStepperDialog, {\n ActionTrigger: Dialog.ActionTrigger,\n Step: BitkitStepperDialogStep,\n});\n"],"mappings":";;;;;;;;;;;;;;;
|
|
1
|
+
{"version":3,"file":"BitkitStepperDialog.js","names":[],"sources":["../../../lib/components/BitkitDialog/BitkitStepperDialog.tsx"],"sourcesContent":["import { Dialog } from '@chakra-ui/react/dialog';\nimport { Children, isValidElement, type ReactElement, type ReactNode, useCallback, useMemo, useState } from 'react';\n\nimport { withSubComponents } from '../../utilities/withSubComponents';\nimport BitkitSteps from '../BitkitSteps/BitkitSteps';\nimport BitkitStepperDialogStep, { type BitkitStepperDialogStepProps } from './BitkitStepperDialogStep';\nimport DialogInner from './DialogInner';\nimport DialogShell, { type DialogShellProps } from './DialogShell';\nimport { StepperDialogProvider } from './StepperContext';\n\nexport { useStepperDialog } from './StepperContext';\n\nexport interface BitkitStepperDialogProps {\n /** `BitkitStepperDialog.Step` children, one per step. */\n children: ReactNode;\n closable?: boolean;\n /** Initial step when uncontrolled. Resets to this when the dialog closes. */\n defaultStep?: number;\n /** Element to focus when the dialog opens, instead of the first focusable one. */\n initialFocusEl?: DialogShellProps['initialFocusEl'];\n /**\n * Footer content rendered raw. Stepper footers are space-between (Cancel left, Prev/Next right),\n * so build the nav row here with `useStepperDialog()` — there is no `footerButtons` slot, which\n * would force right-alignment.\n */\n footerContent?: ReactNode;\n headerLabel?: string;\n maxHeight?: string;\n onExitComplete?: () => void;\n onOpenChange?: (details: { open: boolean }) => void;\n /** Called whenever the active step changes (controlled or uncontrolled). */\n onStepChange?: (step: number) => void;\n open?: boolean;\n preventScroll?: boolean;\n scrollBehavior?: 'inside' | 'outside';\n showScrollGradient?: boolean;\n size?: 'sm' | 'md' | 'lg' | 'full';\n /** Controlled active step. Omit for uncontrolled (see `defaultStep`). */\n step?: number;\n title: ReactNode;\n trigger?: ReactNode;\n variant?: 'overflowContent';\n}\n\n/**\n * A dialog that walks through a sequence of `BitkitStepperDialog.Step` children. It owns the step\n * state, auto-renders the steps header, and shows only the active step's body. Footer navigation is\n * wired by the consumer through the `useStepperDialog()` hook.\n */\nconst BitkitStepperDialog = ({\n children,\n closable = true,\n defaultStep = 0,\n initialFocusEl,\n footerContent,\n headerLabel,\n maxHeight,\n onExitComplete,\n onOpenChange,\n onStepChange,\n open,\n preventScroll,\n scrollBehavior,\n showScrollGradient,\n size,\n step: stepProp,\n title,\n trigger,\n variant,\n}: BitkitStepperDialogProps) => {\n const [internalStep, setInternalStep] = useState(defaultStep);\n const isControlled = stepProp !== undefined;\n const rawStep = (isControlled ? stepProp : internalStep) ?? 0;\n const steps = Children.toArray(children).filter(\n (child): child is ReactElement<BitkitStepperDialogStepProps> =>\n isValidElement(child) && child.type === BitkitStepperDialogStep,\n );\n const totalSteps = steps.length;\n const step = Math.max(0, Math.min(rawStep, Math.max(0, totalSteps - 1)));\n\n const setStep = useCallback(\n (next: number) => {\n const clamped = Math.max(0, Math.min(next, totalSteps - 1));\n if (!isControlled) setInternalStep(clamped);\n onStepChange?.(clamped);\n },\n [isControlled, onStepChange, totalSteps],\n );\n\n const ctx = useMemo(\n () => ({\n goTo: setStep,\n isFirst: step === 0,\n isLast: step === totalSteps - 1,\n next: () => setStep(step + 1),\n prev: () => setStep(step - 1),\n setStep,\n step,\n totalSteps,\n }),\n [setStep, step, totalSteps],\n );\n\n const handleOpenChange = (details: { open: boolean }) => {\n if (!details.open && !isControlled) setInternalStep(defaultStep);\n onOpenChange?.(details);\n };\n\n const stepsHeader = (\n <BitkitSteps step={step}>\n {steps.map((child, index) => (\n <BitkitSteps.Item key={index} label={child.props.label} />\n ))}\n </BitkitSteps>\n );\n\n return (\n <StepperDialogProvider value={ctx}>\n <DialogShell\n closable={closable}\n initialFocusEl={initialFocusEl}\n onExitComplete={onExitComplete}\n onOpenChange={handleOpenChange}\n open={open}\n preventScroll={preventScroll}\n scrollBehavior={scrollBehavior}\n size={size}\n trigger={trigger}\n variant={variant}\n >\n <Dialog.Content maxHeight={maxHeight}>\n <DialogInner\n closable={closable}\n footerContent={footerContent}\n headerExtra={stepsHeader}\n headerLabel={headerLabel}\n scrollBehavior={scrollBehavior}\n showScrollGradient={showScrollGradient}\n title={title}\n variant={variant}\n >\n {steps[step]}\n </DialogInner>\n </Dialog.Content>\n </DialogShell>\n </StepperDialogProvider>\n );\n};\n\nBitkitStepperDialog.displayName = 'BitkitStepperDialog';\n\nexport default withSubComponents(BitkitStepperDialog, {\n ActionTrigger: Dialog.ActionTrigger,\n Step: BitkitStepperDialogStep,\n});\n"],"mappings":";;;;;;;;;;;;;;;AAiDA,IAAM,uBAAuB,EAC3B,UACA,WAAW,MACX,cAAc,GACd,gBACA,eACA,aACA,WACA,gBACA,cACA,cACA,MACA,eACA,gBACA,oBACA,MACA,MAAM,UACN,OACA,SACA,cAC8B;CAC9B,MAAM,CAAC,cAAc,mBAAmB,SAAS,WAAW;CAC5D,MAAM,eAAe,aAAa,KAAA;CAClC,MAAM,WAAW,eAAe,WAAW,iBAAiB;CAC5D,MAAM,QAAQ,SAAS,QAAQ,QAAQ,CAAC,CAAC,QACtC,UACC,eAAe,KAAK,KAAK,MAAM,SAAS,uBAC5C;CACA,MAAM,aAAa,MAAM;CACzB,MAAM,OAAO,KAAK,IAAI,GAAG,KAAK,IAAI,SAAS,KAAK,IAAI,GAAG,aAAa,CAAC,CAAC,CAAC;CAEvE,MAAM,UAAU,aACb,SAAiB;EAChB,MAAM,UAAU,KAAK,IAAI,GAAG,KAAK,IAAI,MAAM,aAAa,CAAC,CAAC;EAC1D,IAAI,CAAC,cAAc,gBAAgB,OAAO;EAC1C,eAAe,OAAO;CACxB,GACA;EAAC;EAAc;EAAc;CAAU,CACzC;CAEA,MAAM,MAAM,eACH;EACL,MAAM;EACN,SAAS,SAAS;EAClB,QAAQ,SAAS,aAAa;EAC9B,YAAY,QAAQ,OAAO,CAAC;EAC5B,YAAY,QAAQ,OAAO,CAAC;EAC5B;EACA;EACA;CACF,IACA;EAAC;EAAS;EAAM;CAAU,CAC5B;CAEA,MAAM,oBAAoB,YAA+B;EACvD,IAAI,CAAC,QAAQ,QAAQ,CAAC,cAAc,gBAAgB,WAAW;EAC/D,eAAe,OAAO;CACxB;CAEA,MAAM,cACJ,oBAAC,qBAAD;EAAmB;EAChB,UAAA,MAAM,KAAK,OAAO,UACjB,oBAAC,oBAAY,MAAb,EAA8B,OAAO,MAAM,MAAM,MAAQ,GAAlC,KAAkC,CAC1D;CACU,CAAA;CAGf,OACE,oBAAC,uBAAD;EAAuB,OAAO;EAC5B,UAAA,oBAAC,aAAD;GACY;GACM;GACA;GAChB,cAAc;GACR;GACS;GACC;GACV;GACG;GACA;GAET,UAAA,oBAAC,OAAO,SAAR;IAA2B;IACzB,UAAA,oBAAC,aAAD;KACY;KACK;KACf,aAAa;KACA;KACG;KACI;KACb;KACE;KAER,UAAA,MAAM;IACI,CAAA;GACC,CAAA;EACL,CAAA;CACQ,CAAA;AAE3B;AAEA,oBAAoB,cAAc;AAElC,IAAA,8BAAe,kBAAkB,qBAAqB;CACpD,eAAe,OAAO;CACtB,MAAM;AACR,CAAC"}
|
|
@@ -1,8 +1,11 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { Dialog } from '@chakra-ui/react/dialog';
|
|
2
|
+
import { ComponentProps, ReactNode } from 'react';
|
|
2
3
|
export interface DialogShellProps {
|
|
3
4
|
/** The `Dialog.Content` element (rendered inside the positioner). */
|
|
4
5
|
children: ReactNode;
|
|
5
6
|
closable?: boolean;
|
|
7
|
+
/** Element to focus when the dialog opens, instead of the first focusable one. */
|
|
8
|
+
initialFocusEl?: ComponentProps<typeof Dialog.Root>['initialFocusEl'];
|
|
6
9
|
onExitComplete?: () => void;
|
|
7
10
|
onOpenChange?: (details: {
|
|
8
11
|
open: boolean;
|
|
@@ -17,8 +20,10 @@ export interface DialogShellProps {
|
|
|
17
20
|
/**
|
|
18
21
|
* Shared overlay shell for every Bitkit dialog flavour: `Dialog.Root` + optional trigger + portal +
|
|
19
22
|
* backdrop + positioner. Dismiss policy is derived from `closable` for ESC/close-trigger; outside
|
|
20
|
-
* clicks are always ignored (`closeOnInteractOutside={false}`).
|
|
23
|
+
* clicks are always ignored (`closeOnInteractOutside={false}`). Note that `closable` does not reach
|
|
24
|
+
* `ActionTrigger` -- a footer button wired to it closes the dialog either way, so a caller that has
|
|
25
|
+
* to block every route out disables that button itself.
|
|
21
26
|
* The caller passes the `Dialog.Content` (or a `Dialog.Content asChild` wrapper) as children.
|
|
22
27
|
**/
|
|
23
|
-
declare const DialogShell: ({ children, closable, onExitComplete, onOpenChange, open, preventScroll, scrollBehavior: scrollBehaviorProp, size, trigger, variant, }: DialogShellProps) => import("react").JSX.Element;
|
|
28
|
+
declare const DialogShell: ({ children, closable, initialFocusEl, onExitComplete, onOpenChange, open, preventScroll, scrollBehavior: scrollBehaviorProp, size, trigger, variant, }: DialogShellProps) => import("react").JSX.Element;
|
|
24
29
|
export default DialogShell;
|
|
@@ -6,14 +6,17 @@ import { Dialog } from "@chakra-ui/react/dialog";
|
|
|
6
6
|
/**
|
|
7
7
|
* Shared overlay shell for every Bitkit dialog flavour: `Dialog.Root` + optional trigger + portal +
|
|
8
8
|
* backdrop + positioner. Dismiss policy is derived from `closable` for ESC/close-trigger; outside
|
|
9
|
-
* clicks are always ignored (`closeOnInteractOutside={false}`).
|
|
9
|
+
* clicks are always ignored (`closeOnInteractOutside={false}`). Note that `closable` does not reach
|
|
10
|
+
* `ActionTrigger` -- a footer button wired to it closes the dialog either way, so a caller that has
|
|
11
|
+
* to block every route out disables that button itself.
|
|
10
12
|
* The caller passes the `Dialog.Content` (or a `Dialog.Content asChild` wrapper) as children.
|
|
11
13
|
**/
|
|
12
|
-
var DialogShell = ({ children, closable = true, onExitComplete, onOpenChange, open, preventScroll = true, scrollBehavior: scrollBehaviorProp, size, trigger, variant }) => {
|
|
14
|
+
var DialogShell = ({ children, closable = true, initialFocusEl, onExitComplete, onOpenChange, open, preventScroll = true, scrollBehavior: scrollBehaviorProp, size, trigger, variant }) => {
|
|
13
15
|
const scrollBehavior = resolveScrollBehavior(variant, scrollBehaviorProp);
|
|
14
16
|
return /* @__PURE__ */ jsxs(Dialog.Root, {
|
|
15
17
|
closeOnEscape: closable,
|
|
16
18
|
closeOnInteractOutside: false,
|
|
19
|
+
initialFocusEl,
|
|
17
20
|
onExitComplete,
|
|
18
21
|
onOpenChange,
|
|
19
22
|
open,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DialogShell.js","names":[],"sources":["../../../lib/components/BitkitDialog/DialogShell.tsx"],"sourcesContent":["import { Dialog } from '@chakra-ui/react/dialog';\nimport { Portal } from '@chakra-ui/react/portal';\nimport { type ReactNode } from 'react';\n\nimport { resolveScrollBehavior } from './DialogBodyContext';\n\nexport interface DialogShellProps {\n /** The `Dialog.Content` element (rendered inside the positioner). */\n children: ReactNode;\n closable?: boolean;\n onExitComplete?: () => void;\n onOpenChange?: (details: { open: boolean }) => void;\n open?: boolean;\n preventScroll?: boolean;\n scrollBehavior?: 'inside' | 'outside';\n size?: 'sm' | 'md' | 'lg' | 'full';\n trigger?: ReactNode;\n variant?: 'overflowContent';\n}\n\n/**\n * Shared overlay shell for every Bitkit dialog flavour: `Dialog.Root` + optional trigger + portal +\n * backdrop + positioner. Dismiss policy is derived from `closable` for ESC/close-trigger; outside\n * clicks are always ignored (`closeOnInteractOutside={false}`).\n * The caller passes the `Dialog.Content` (or a `Dialog.Content asChild` wrapper) as children.\n **/\n\nconst DialogShell = ({\n children,\n closable = true,\n onExitComplete,\n onOpenChange,\n open,\n preventScroll = true,\n scrollBehavior: scrollBehaviorProp,\n size,\n trigger,\n variant,\n}: DialogShellProps) => {\n const scrollBehavior = resolveScrollBehavior(variant, scrollBehaviorProp);\n\n return (\n <Dialog.Root\n closeOnEscape={closable}\n closeOnInteractOutside={false}\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>{children}</Dialog.Positioner>\n </Portal>\n </Dialog.Root>\n );\n};\n\nexport default DialogShell;\n"],"mappings":"
|
|
1
|
+
{"version":3,"file":"DialogShell.js","names":[],"sources":["../../../lib/components/BitkitDialog/DialogShell.tsx"],"sourcesContent":["import { Dialog } from '@chakra-ui/react/dialog';\nimport { Portal } from '@chakra-ui/react/portal';\nimport { type ComponentProps, type ReactNode } from 'react';\n\nimport { resolveScrollBehavior } from './DialogBodyContext';\n\nexport interface DialogShellProps {\n /** The `Dialog.Content` element (rendered inside the positioner). */\n children: ReactNode;\n closable?: boolean;\n /** Element to focus when the dialog opens, instead of the first focusable one. */\n initialFocusEl?: ComponentProps<typeof Dialog.Root>['initialFocusEl'];\n onExitComplete?: () => void;\n onOpenChange?: (details: { open: boolean }) => void;\n open?: boolean;\n preventScroll?: boolean;\n scrollBehavior?: 'inside' | 'outside';\n size?: 'sm' | 'md' | 'lg' | 'full';\n trigger?: ReactNode;\n variant?: 'overflowContent';\n}\n\n/**\n * Shared overlay shell for every Bitkit dialog flavour: `Dialog.Root` + optional trigger + portal +\n * backdrop + positioner. Dismiss policy is derived from `closable` for ESC/close-trigger; outside\n * clicks are always ignored (`closeOnInteractOutside={false}`). Note that `closable` does not reach\n * `ActionTrigger` -- a footer button wired to it closes the dialog either way, so a caller that has\n * to block every route out disables that button itself.\n * The caller passes the `Dialog.Content` (or a `Dialog.Content asChild` wrapper) as children.\n **/\n\nconst DialogShell = ({\n children,\n closable = true,\n initialFocusEl,\n onExitComplete,\n onOpenChange,\n open,\n preventScroll = true,\n scrollBehavior: scrollBehaviorProp,\n size,\n trigger,\n variant,\n}: DialogShellProps) => {\n const scrollBehavior = resolveScrollBehavior(variant, scrollBehaviorProp);\n\n return (\n <Dialog.Root\n closeOnEscape={closable}\n closeOnInteractOutside={false}\n initialFocusEl={initialFocusEl}\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>{children}</Dialog.Positioner>\n </Portal>\n </Dialog.Root>\n );\n};\n\nexport default DialogShell;\n"],"mappings":";;;;;;;;;;;;;AA+BA,IAAM,eAAe,EACnB,UACA,WAAW,MACX,gBACA,gBACA,cACA,MACA,gBAAgB,MAChB,gBAAgB,oBAChB,MACA,SACA,cACsB;CACtB,MAAM,iBAAiB,sBAAsB,SAAS,kBAAkB;CAExE,OACE,qBAAC,OAAO,MAAR;EACE,eAAe;EACf,wBAAwB;EACR;EACA;EACF;EACR;EACS;EACC;EACV;EACG;EAVX,UAAA,CAYG,WAAW,oBAAC,OAAO,SAAR;GAAgB,SAAA;GAAS,UAAA;EAAwB,CAAA,GAC7D,qBAAC,QAAD,EAAA,UAAA,CACE,oBAAC,OAAO,UAAR,CAAkB,CAAA,GAClB,oBAAC,OAAO,YAAR,EAAoB,SAA4B,CAAA,CAC1C,EAAA,CAAA,CACG;;AAEjB"}
|