@bitrise/bitkit-v2 0.3.218 → 0.3.220

package/AGENTS.md

@@ -92,6 +92,11 @@ Bitkit components use consistent prop names across the library:
   <BitkitAccordion.ItemTrigger suffix={<Badge>3</Badge>}>Files</BitkitAccordion.ItemTrigger>
   ```
 - **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.
+- **`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):
+  ```tsx
+  <BitkitDialog closable={false} open={open} onOpenChange={…} title="Action required">…</BitkitDialog>
+  <BitkitDialog open={open} onExitComplete={() => navigate('/next')} onOpenChange={…} title="…">…</BitkitDialog>
+  ```
 
 ## Coding rules
 
@@ -104,7 +109,29 @@ Bitkit components use consistent prop names across the library:
 - **Omit default prop values** — `<IconCross />`, not `<IconCross size="24" />` when 24 is the default.
 - **No shorthand props** — use full names: `marginInline`, `paddingBlockEnd`, `width`, `background`, `padding`. Never `mx`, `pb`, `w`, `bg`, `p`, `mt`.
 - **Prefer logical over physical properties** — `marginInline`, `paddingBlock`, `insetInlineStart` over `marginLeft`/`marginRight`, `paddingTop`/`paddingBottom`, `left`.
-- **Minimal wrappers** — only use `<Box>` (from `@chakra-ui/react/box`) when truly needed for layout. Use empty fragments (`<>...</>`) otherwise.
+- **Never wrap a Bitkit component in `<Box>` for styling** — most Bitkit components accept Chakra style props (`width`, `flex`, `flexShrink`, `marginInline`, `padding`, `display`, etc.) directly on themselves. Set them on the component, never on a wrapper:
+  ```tsx
+  // Bad — pointless wrapper
+  <Box width="128" flexShrink="0">
+    <BitkitTextInput ... />
+  </Box>
+
+  // Good — props on the component itself
+  <BitkitTextInput width="128" flexShrink="0" ... />
+  ```
+  This holds for form fields (`BitkitTextInput`, `BitkitSelect`, `BitkitNativeSelect`, `BitkitCombobox`, etc.), buttons (`BitkitButton`, `BitkitIconButton`, etc.), and most other components — they all forward Chakra style props through to the rendered root element.
+
+  **Exceptions** — a few component groups intentionally own their own layout and don't accept arbitrary style props from outside:
+  - Page-level overlays: `BitkitDialog`, `BitkitDrawer`, `BitkitCalendar` — use the component's own sizing API (`size`, `maxHeight`, etc.).
+  - Floating positioned components: `BitkitTooltip`, `BitkitLabelTooltip`, `BitkitDefinitionTooltip`, `BitkitOverflowTooltip`, `BitkitToast`, `BitkitSelectMenu`, `BitkitMultiselectMenu` — their layout is positioned automatically; pass styling via the component's own props instead of a wrapper.
+
+  > **For everything else, if a style prop doesn't take effect on a Bitkit component, that's a bug in the component, not a styling task.** Stop, tell the user something looks off in Bitkit so they can flag it to the Bitkit team — don't quietly add a `<Box>` workaround. Each silent workaround hides a regression and bakes the wrapper pattern into the codebase.
+
+  Use `<Box>` only when:
+  - The wrapper holds multiple children that need a layout container (flex/grid parent for several siblings)
+  - You need a wrapper element for purely structural reasons (CSS Grid placement, sibling selectors, etc.)
+
+  For grouping a single child or a few siblings without styling, use a fragment (`<>...</>`).
 - **Use `Text` for text content, not `Box`** — when rendering string content, use `<Text>` from `@chakra-ui/react/text`. Choose semantic tag via `as`: `<Text as="strong">`, `<Text as="span">`, `<Text as="label">`, plain `<Text>` for paragraphs.
 - **Import from Chakra subpaths** — `import { Button } from '@chakra-ui/react/button'`, not `from '@chakra-ui/react'`.
 

package/dist/components/BitkitBreadcrumb/BitkitBreadcrumb.d.ts

@@ -1,12 +1,15 @@
+import { Breadcrumb, BreadcrumbRootProps } from '@chakra-ui/react/breadcrumb';
 import { ReactElement } from 'react';
 import { CurrentItemProps } from './components/BreadcrumbCurrentItem.tsx';
 import { OverflowMenuProps } from './components/OverflowMenu.tsx';
 import { ItemProps } from './types.ts';
 type BitkitBreadcrumbChild = ReactElement<ItemProps> | ReactElement<CurrentItemProps> | ReactElement<OverflowMenuProps>;
-export type BitkitBreadcrumbProps = {
+export type BitkitBreadcrumbProps = Omit<BreadcrumbRootProps, 'children'> & {
     children: BitkitBreadcrumbChild | BitkitBreadcrumbChild[];
 };
-declare const BitkitBreadcrumb: import('react').ForwardRefExoticComponent<BitkitBreadcrumbProps & import('react').RefAttributes<HTMLElement>> & {
+declare const BitkitBreadcrumb: import('react').ForwardRefExoticComponent<Omit<Breadcrumb.RootProps, "children"> & {
+    children: BitkitBreadcrumbChild | BitkitBreadcrumbChild[];
+} & import('react').RefAttributes<HTMLElement>> & {
     CurrentItem: import('react').ForwardRefExoticComponent<CurrentItemProps & import('react').RefAttributes<HTMLElement>>;
     Item: import('react').ForwardRefExoticComponent<ItemProps & import('react').RefAttributes<HTMLAnchorElement>>;
     OverflowMenu: {

package/dist/components/BitkitBreadcrumb/BitkitBreadcrumb.js

@@ -33,7 +33,7 @@ var flattenItemProps = (elements) => {
 	}
 	return props;
 };
-var BitkitBreadcrumbRoot = forwardRef(({ children }, ref) => {
+var BitkitBreadcrumbRoot = forwardRef(({ children, ...rest }, ref) => {
 	const isMobile = useBreakpointValue({
 		base: true,
 		tablet: false
@@ -47,6 +47,7 @@ var BitkitBreadcrumbRoot = forwardRef(({ children }, ref) => {
 		const overflowLinks = links.slice(0, -1).reverse();
 		return /* @__PURE__ */ jsx(Breadcrumb.Root, {
 			ref,
+			...rest,
 			children: /* @__PURE__ */ jsxs(Breadcrumb.List, { children: [
 				/* @__PURE__ */ jsxs(Show, {
 					when: overflowLinks.length > 0,
@@ -69,6 +70,7 @@ var BitkitBreadcrumbRoot = forwardRef(({ children }, ref) => {
 	}
 	return /* @__PURE__ */ jsx(Breadcrumb.Root, {
 		ref,
+		...rest,
 		children: /* @__PURE__ */ jsx(Breadcrumb.List, { children: childArray.map((child, index) => /* @__PURE__ */ jsxs(Fragment, { children: [child, /* @__PURE__ */ jsx(Show, {
 			when: index < childArray.length - 1,
 			children: /* @__PURE__ */ jsx(Breadcrumb.Separator, { children: /* @__PURE__ */ jsx(IconChevronRight, {}) })

package/dist/components/BitkitBreadcrumb/BitkitBreadcrumb.js.map

@@ -1 +1 @@
-{"version":3,"file":"BitkitBreadcrumb.js","names":[],"sources":["../../../lib/components/BitkitBreadcrumb/BitkitBreadcrumb.tsx"],"sourcesContent":["import { Breadcrumb } from '@chakra-ui/react/breadcrumb';\nimport { useBreakpointValue } from '@chakra-ui/react/hooks';\nimport { Show } from '@chakra-ui/react/show';\nimport { Children, forwardRef, Fragment, isValidElement, type ReactElement } from 'react';\n\nimport { IconChevronRight, IconMoreHorizontal } from '../../icons';\nimport BitkitControlButton from '../BitkitControlButton/BitkitControlButton.tsx';\nimport BreadcrumbCurrentItem, { type CurrentItemProps } from './components/BreadcrumbCurrentItem.tsx';\nimport BreadcrumbItem from './components/BreadcrumbItem.tsx';\nimport OverflowMenu, { type OverflowMenuProps } from './components/OverflowMenu.tsx';\nimport OverflowMenuItem from './components/OverflowMenuItem.tsx';\nimport OverflowMenuTrigger from './components/OverflowMenuTrigger.tsx';\nimport { type ItemProps } from './types.ts';\n\ntype BitkitBreadcrumbChild = ReactElement<ItemProps> | ReactElement<CurrentItemProps> | ReactElement<OverflowMenuProps>;\n\nexport type BitkitBreadcrumbProps = {\n  children: BitkitBreadcrumbChild | BitkitBreadcrumbChild[];\n};\n\nconst flattenItemProps = (elements: ReactElement[]): ItemProps[] => {\n  const props: ItemProps[] = [];\n\n  for (const child of elements) {\n    if (child.type === BreadcrumbItem) {\n      const { href, children } = child.props as ItemProps;\n      props.push({ href, children });\n    } else if (child.type === OverflowMenu) {\n      const { children: menuChildren } = child.props as OverflowMenuProps;\n      const menuChildArray = Children.toArray(menuChildren).filter(isValidElement);\n      for (const menuChild of menuChildArray) {\n        if (menuChild.type === OverflowMenuItem) {\n          const { href, children } = menuChild.props as ItemProps;\n          props.push({ href, children });\n        }\n      }\n    }\n  }\n\n  return props;\n};\n\nconst BitkitBreadcrumbRoot = forwardRef<HTMLElement, BitkitBreadcrumbProps>(({ children }, ref) => {\n  const isMobile = useBreakpointValue({ base: true, tablet: false }, { fallback: 'tablet' });\n  const childArray = Children.toArray(children).filter(isValidElement);\n\n  if (childArray.length === 0) {\n    return null;\n  }\n\n  if (isMobile) {\n    const links = flattenItemProps(childArray);\n    if (links.length === 0) {\n      return null;\n    }\n\n    const lastLink = links[links.length - 1];\n    const overflowLinks = links.slice(0, -1).reverse();\n\n    return (\n      <Breadcrumb.Root ref={ref}>\n        <Breadcrumb.List>\n          <Show when={overflowLinks.length > 0}>\n            <OverflowMenu>\n              <OverflowMenuTrigger>\n                <BitkitControlButton icon={IconMoreHorizontal} label=\"Open breadcrumbs\" size=\"xs\" />\n              </OverflowMenuTrigger>\n              {overflowLinks.map((link) => (\n                <OverflowMenuItem key={link.href} href={link.href}>\n                  {link.children}\n                </OverflowMenuItem>\n              ))}\n            </OverflowMenu>\n            <Breadcrumb.Separator>\n              <IconChevronRight />\n            </Breadcrumb.Separator>\n          </Show>\n          <BreadcrumbItem href={lastLink.href}>{lastLink.children}</BreadcrumbItem>\n          <Breadcrumb.Separator>\n            <IconChevronRight />\n          </Breadcrumb.Separator>\n        </Breadcrumb.List>\n      </Breadcrumb.Root>\n    );\n  }\n\n  return (\n    <Breadcrumb.Root ref={ref}>\n      <Breadcrumb.List>\n        {childArray.map((child, index) => (\n          <Fragment key={child.key}>\n            {child}\n            <Show when={index < childArray.length - 1}>\n              <Breadcrumb.Separator>\n                <IconChevronRight />\n              </Breadcrumb.Separator>\n            </Show>\n          </Fragment>\n        ))}\n      </Breadcrumb.List>\n    </Breadcrumb.Root>\n  );\n});\n\nBitkitBreadcrumbRoot.displayName = 'BitkitBreadcrumb';\n\nconst BitkitBreadcrumb = Object.assign(BitkitBreadcrumbRoot, {\n  CurrentItem: BreadcrumbCurrentItem,\n  Item: BreadcrumbItem,\n  OverflowMenu,\n  OverflowMenuItem,\n});\n\nexport default BitkitBreadcrumb;\n"],"mappings":";;;;;;;;;;;;;;AAoBA,IAAM,oBAAoB,aAA0C;CAClE,MAAM,QAAqB,CAAC;CAE5B,KAAK,MAAM,SAAS,UAClB,IAAI,MAAM,SAAS,gBAAgB;EACjC,MAAM,EAAE,MAAM,aAAa,MAAM;EACjC,MAAM,KAAK;GAAE;GAAM;EAAS,CAAC;CAC/B,OAAO,IAAI,MAAM,SAAS,cAAc;EACtC,MAAM,EAAE,UAAU,iBAAiB,MAAM;EACzC,MAAM,iBAAiB,SAAS,QAAQ,YAAY,EAAE,OAAO,cAAc;EAC3E,KAAK,MAAM,aAAa,gBACtB,IAAI,UAAU,SAAS,kBAAkB;GACvC,MAAM,EAAE,MAAM,aAAa,UAAU;GACrC,MAAM,KAAK;IAAE;IAAM;GAAS,CAAC;EAC/B;CAEJ;CAGF,OAAO;AACT;AAEA,IAAM,uBAAuB,YAAgD,EAAE,YAAY,QAAQ;CACjG,MAAM,WAAW,mBAAmB;EAAE,MAAM;EAAM,QAAQ;CAAM,GAAG,EAAE,UAAU,SAAS,CAAC;CACzF,MAAM,aAAa,SAAS,QAAQ,QAAQ,EAAE,OAAO,cAAc;CAEnE,IAAI,WAAW,WAAW,GACxB,OAAO;CAGT,IAAI,UAAU;EACZ,MAAM,QAAQ,iBAAiB,UAAU;EACzC,IAAI,MAAM,WAAW,GACnB,OAAO;EAGT,MAAM,WAAW,MAAM,MAAM,SAAS;EACtC,MAAM,gBAAgB,MAAM,MAAM,GAAG,EAAE,EAAE,QAAQ;EAEjD,OACE,oBAAC,WAAW,MAAZ;GAAsB;aACpB,qBAAC,WAAW,MAAZ,EAAA,UAAA;IACE,qBAAC,MAAD;KAAM,MAAM,cAAc,SAAS;eAAnC,CACE,qBAAC,cAAD,EAAA,UAAA,CACE,oBAAC,qBAAD,EAAA,UACE,oBAAC,qBAAD;MAAqB,MAAM;MAAoB,OAAM;MAAmB,MAAK;KAAM,CAAA,EAChE,CAAA,GACpB,cAAc,KAAK,SAClB,oBAAC,kBAAD;MAAkC,MAAM,KAAK;gBAC1C,KAAK;KACU,GAFK,KAAK,IAEV,CACnB,CACW,EAAA,CAAA,GACd,oBAAC,WAAW,WAAZ,EAAA,UACE,oBAAC,kBAAD,CAAmB,CAAA,EACC,CAAA,CAClB;;IACN,oBAAC,gBAAD;KAAgB,MAAM,SAAS;eAAO,SAAS;IAAyB,CAAA;IACxE,oBAAC,WAAW,WAAZ,EAAA,UACE,oBAAC,kBAAD,CAAmB,CAAA,EACC,CAAA;GACP,EAAA,CAAA;EACF,CAAA;CAErB;CAEA,OACE,oBAAC,WAAW,MAAZ;EAAsB;YACpB,oBAAC,WAAW,MAAZ,EAAA,UACG,WAAW,KAAK,OAAO,UACtB,qBAAC,UAAD,EAAA,UAAA,CACG,OACD,oBAAC,MAAD;GAAM,MAAM,QAAQ,WAAW,SAAS;aACtC,oBAAC,WAAW,WAAZ,EAAA,UACE,oBAAC,kBAAD,CAAmB,CAAA,EACC,CAAA;EAClB,CAAA,CACE,EAAA,GAPK,MAAM,GAOX,CACX,EACc,CAAA;CACF,CAAA;AAErB,CAAC;AAED,qBAAqB,cAAc;AAEnC,IAAM,mBAAmB,OAAO,OAAO,sBAAsB;CAC3D,aAAa;CACb,MAAM;CACN;CACA;AACF,CAAC"}
+{"version":3,"file":"BitkitBreadcrumb.js","names":[],"sources":["../../../lib/components/BitkitBreadcrumb/BitkitBreadcrumb.tsx"],"sourcesContent":["import { Breadcrumb, type BreadcrumbRootProps } from '@chakra-ui/react/breadcrumb';\nimport { useBreakpointValue } from '@chakra-ui/react/hooks';\nimport { Show } from '@chakra-ui/react/show';\nimport { Children, forwardRef, Fragment, isValidElement, type ReactElement } from 'react';\n\nimport { IconChevronRight, IconMoreHorizontal } from '../../icons';\nimport BitkitControlButton from '../BitkitControlButton/BitkitControlButton.tsx';\nimport BreadcrumbCurrentItem, { type CurrentItemProps } from './components/BreadcrumbCurrentItem.tsx';\nimport BreadcrumbItem from './components/BreadcrumbItem.tsx';\nimport OverflowMenu, { type OverflowMenuProps } from './components/OverflowMenu.tsx';\nimport OverflowMenuItem from './components/OverflowMenuItem.tsx';\nimport OverflowMenuTrigger from './components/OverflowMenuTrigger.tsx';\nimport { type ItemProps } from './types.ts';\n\ntype BitkitBreadcrumbChild = ReactElement<ItemProps> | ReactElement<CurrentItemProps> | ReactElement<OverflowMenuProps>;\n\nexport type BitkitBreadcrumbProps = Omit<BreadcrumbRootProps, 'children'> & {\n  children: BitkitBreadcrumbChild | BitkitBreadcrumbChild[];\n};\n\nconst flattenItemProps = (elements: ReactElement[]): ItemProps[] => {\n  const props: ItemProps[] = [];\n\n  for (const child of elements) {\n    if (child.type === BreadcrumbItem) {\n      const { href, children } = child.props as ItemProps;\n      props.push({ href, children });\n    } else if (child.type === OverflowMenu) {\n      const { children: menuChildren } = child.props as OverflowMenuProps;\n      const menuChildArray = Children.toArray(menuChildren).filter(isValidElement);\n      for (const menuChild of menuChildArray) {\n        if (menuChild.type === OverflowMenuItem) {\n          const { href, children } = menuChild.props as ItemProps;\n          props.push({ href, children });\n        }\n      }\n    }\n  }\n\n  return props;\n};\n\nconst BitkitBreadcrumbRoot = forwardRef<HTMLElement, BitkitBreadcrumbProps>(({ children, ...rest }, ref) => {\n  const isMobile = useBreakpointValue({ base: true, tablet: false }, { fallback: 'tablet' });\n  const childArray = Children.toArray(children).filter(isValidElement);\n\n  if (childArray.length === 0) {\n    return null;\n  }\n\n  if (isMobile) {\n    const links = flattenItemProps(childArray);\n    if (links.length === 0) {\n      return null;\n    }\n\n    const lastLink = links[links.length - 1];\n    const overflowLinks = links.slice(0, -1).reverse();\n\n    return (\n      <Breadcrumb.Root ref={ref} {...rest}>\n        <Breadcrumb.List>\n          <Show when={overflowLinks.length > 0}>\n            <OverflowMenu>\n              <OverflowMenuTrigger>\n                <BitkitControlButton icon={IconMoreHorizontal} label=\"Open breadcrumbs\" size=\"xs\" />\n              </OverflowMenuTrigger>\n              {overflowLinks.map((link) => (\n                <OverflowMenuItem key={link.href} href={link.href}>\n                  {link.children}\n                </OverflowMenuItem>\n              ))}\n            </OverflowMenu>\n            <Breadcrumb.Separator>\n              <IconChevronRight />\n            </Breadcrumb.Separator>\n          </Show>\n          <BreadcrumbItem href={lastLink.href}>{lastLink.children}</BreadcrumbItem>\n          <Breadcrumb.Separator>\n            <IconChevronRight />\n          </Breadcrumb.Separator>\n        </Breadcrumb.List>\n      </Breadcrumb.Root>\n    );\n  }\n\n  return (\n    <Breadcrumb.Root ref={ref} {...rest}>\n      <Breadcrumb.List>\n        {childArray.map((child, index) => (\n          <Fragment key={child.key}>\n            {child}\n            <Show when={index < childArray.length - 1}>\n              <Breadcrumb.Separator>\n                <IconChevronRight />\n              </Breadcrumb.Separator>\n            </Show>\n          </Fragment>\n        ))}\n      </Breadcrumb.List>\n    </Breadcrumb.Root>\n  );\n});\n\nBitkitBreadcrumbRoot.displayName = 'BitkitBreadcrumb';\n\nconst BitkitBreadcrumb = Object.assign(BitkitBreadcrumbRoot, {\n  CurrentItem: BreadcrumbCurrentItem,\n  Item: BreadcrumbItem,\n  OverflowMenu,\n  OverflowMenuItem,\n});\n\nexport default BitkitBreadcrumb;\n"],"mappings":";;;;;;;;;;;;;;AAoBA,IAAM,oBAAoB,aAA0C;CAClE,MAAM,QAAqB,CAAC;CAE5B,KAAK,MAAM,SAAS,UAClB,IAAI,MAAM,SAAS,gBAAgB;EACjC,MAAM,EAAE,MAAM,aAAa,MAAM;EACjC,MAAM,KAAK;GAAE;GAAM;EAAS,CAAC;CAC/B,OAAO,IAAI,MAAM,SAAS,cAAc;EACtC,MAAM,EAAE,UAAU,iBAAiB,MAAM;EACzC,MAAM,iBAAiB,SAAS,QAAQ,YAAY,EAAE,OAAO,cAAc;EAC3E,KAAK,MAAM,aAAa,gBACtB,IAAI,UAAU,SAAS,kBAAkB;GACvC,MAAM,EAAE,MAAM,aAAa,UAAU;GACrC,MAAM,KAAK;IAAE;IAAM;GAAS,CAAC;EAC/B;CAEJ;CAGF,OAAO;AACT;AAEA,IAAM,uBAAuB,YAAgD,EAAE,UAAU,GAAG,QAAQ,QAAQ;CAC1G,MAAM,WAAW,mBAAmB;EAAE,MAAM;EAAM,QAAQ;CAAM,GAAG,EAAE,UAAU,SAAS,CAAC;CACzF,MAAM,aAAa,SAAS,QAAQ,QAAQ,EAAE,OAAO,cAAc;CAEnE,IAAI,WAAW,WAAW,GACxB,OAAO;CAGT,IAAI,UAAU;EACZ,MAAM,QAAQ,iBAAiB,UAAU;EACzC,IAAI,MAAM,WAAW,GACnB,OAAO;EAGT,MAAM,WAAW,MAAM,MAAM,SAAS;EACtC,MAAM,gBAAgB,MAAM,MAAM,GAAG,EAAE,EAAE,QAAQ;EAEjD,OACE,oBAAC,WAAW,MAAZ;GAAsB;GAAK,GAAI;aAC7B,qBAAC,WAAW,MAAZ,EAAA,UAAA;IACE,qBAAC,MAAD;KAAM,MAAM,cAAc,SAAS;eAAnC,CACE,qBAAC,cAAD,EAAA,UAAA,CACE,oBAAC,qBAAD,EAAA,UACE,oBAAC,qBAAD;MAAqB,MAAM;MAAoB,OAAM;MAAmB,MAAK;KAAM,CAAA,EAChE,CAAA,GACpB,cAAc,KAAK,SAClB,oBAAC,kBAAD;MAAkC,MAAM,KAAK;gBAC1C,KAAK;KACU,GAFK,KAAK,IAEV,CACnB,CACW,EAAA,CAAA,GACd,oBAAC,WAAW,WAAZ,EAAA,UACE,oBAAC,kBAAD,CAAmB,CAAA,EACC,CAAA,CAClB;;IACN,oBAAC,gBAAD;KAAgB,MAAM,SAAS;eAAO,SAAS;IAAyB,CAAA;IACxE,oBAAC,WAAW,WAAZ,EAAA,UACE,oBAAC,kBAAD,CAAmB,CAAA,EACC,CAAA;GACP,EAAA,CAAA;EACF,CAAA;CAErB;CAEA,OACE,oBAAC,WAAW,MAAZ;EAAsB;EAAK,GAAI;YAC7B,oBAAC,WAAW,MAAZ,EAAA,UACG,WAAW,KAAK,OAAO,UACtB,qBAAC,UAAD,EAAA,UAAA,CACG,OACD,oBAAC,MAAD;GAAM,MAAM,QAAQ,WAAW,SAAS;aACtC,oBAAC,WAAW,WAAZ,EAAA,UACE,oBAAC,kBAAD,CAAmB,CAAA,EACC,CAAA;EAClB,CAAA,CACE,EAAA,GAPK,MAAM,GAOX,CACX,EACc,CAAA;CACF,CAAA;AAErB,CAAC;AAED,qBAAqB,cAAc;AAEnC,IAAM,mBAAmB,OAAO,OAAO,sBAAsB;CAC3D,aAAa;CACb,MAAM;CACN;CACA;AACF,CAAC"}

package/dist/components/BitkitCodeSnippet/BitkitCodeSnippet.d.ts

@@ -1,16 +1,18 @@
-interface BaseProps {
+import { HTMLChakraProps } from '@chakra-ui/react/styled-system';
+interface InlineProps extends Omit<HTMLChakraProps<'code'>, 'children' | 'size'> {
     children: string;
-    size?: 'md' | 'lg';
-    textToCopy?: string;
-}
-interface InlineProps extends BaseProps {
     interactive?: boolean;
+    size?: 'md' | 'lg';
     startingHeight?: never;
+    textToCopy?: string;
     variant: 'inline';
 }
-interface BlockProps extends BaseProps {
+interface BlockProps extends Omit<HTMLChakraProps<'div'>, 'children' | 'size'> {
+    children: string;
     interactive?: never;
+    size?: 'md' | 'lg';
     startingHeight?: number;
+    textToCopy?: string;
     variant: 'multi' | 'single';
 }
 export type BitkitCodeSnippetProps = InlineProps | BlockProps;

package/dist/components/BitkitCodeSnippet/BitkitCodeSnippet.js

@@ -9,19 +9,18 @@ import { useClipboard } from "@ark-ui/react/clipboard";
 //#region lib/components/BitkitCodeSnippet/BitkitCodeSnippet.tsx
 var COPY_TOOLTIP = "Copy to clipboard";
 var BitkitCodeSnippet = forwardRef((props, ref) => {
-	const { children, interactive, size = "lg", startingHeight, textToCopy, variant } = props;
-	const hasShowMore = startingHeight !== void 0;
+	const hasShowMore = props.startingHeight !== void 0;
 	const [isExpanded, setIsExpanded] = useState(false);
 	const { copied, copy } = useClipboard({
 		timeout: 2e3,
-		value: textToCopy ?? children
+		value: props.textToCopy ?? props.children
 	});
 	const styles = useSlotRecipe({ key: "codeSnippet" })({
-		size,
-		variant,
 		hasShowMore,
+		interactive: props.interactive,
 		isExpanded,
-		interactive
+		size: props.size ?? "lg",
+		variant: props.variant
 	});
 	const handleToggleExpand = () => {
 		setIsExpanded((prev) => !prev);
@@ -39,28 +38,39 @@ var BitkitCodeSnippet = forwardRef((props, ref) => {
 		type: "button",
 		children: copied ? /* @__PURE__ */ jsx(IconCheck, { size: "16" }) : /* @__PURE__ */ jsx(IconCopy, { size: "16" })
 	});
-	if (variant === "inline") {
+	if (props.variant === "inline") {
+		const { children, interactive, size: _size, textToCopy: _textToCopy, variant: _variant, ...rest } = props;
 		if (!interactive) return /* @__PURE__ */ jsx(chakra.code, {
 			ref,
-			css: styles.root,
+			...rest,
+			css: [styles.root, rest.css],
 			children
 		});
 		return /* @__PURE__ */ jsx(BitkitTooltip, {
 			text: COPY_TOOLTIP,
 			children: /* @__PURE__ */ jsx(chakra.code, {
 				ref,
-				css: styles.root,
-				onClick: copy,
-				onKeyDown: handleKeyDown,
+				...rest,
+				css: [styles.root, rest.css],
+				onClick: (e) => {
+					rest.onClick?.(e);
+					if (!e.defaultPrevented) copy();
+				},
+				onKeyDown: (e) => {
+					rest.onKeyDown?.(e);
+					if (!e.defaultPrevented) handleKeyDown(e);
+				},
 				role: "button",
 				tabIndex: 0,
 				children
 			})
 		});
 	}
+	const { children, size: _size, startingHeight, textToCopy: _textToCopy, variant, ...rest } = props;
 	if (variant === "single") return /* @__PURE__ */ jsxs(chakra.div, {
 		ref,
-		css: styles.root,
+		...rest,
+		css: [styles.root, rest.css],
 		children: [/* @__PURE__ */ jsx(chakra.code, {
 			css: styles.content,
 			tabIndex: -1,
@@ -73,7 +83,8 @@ var BitkitCodeSnippet = forwardRef((props, ref) => {
 	const contentMaxHeight = hasShowMore && !isExpanded ? startingHeight : void 0;
 	return /* @__PURE__ */ jsxs(chakra.div, {
 		ref,
-		css: styles.root,
+		...rest,
+		css: [styles.root, rest.css],
 		children: [
 			/* @__PURE__ */ jsx(chakra.code, {
 				css: styles.content,

package/dist/components/BitkitCodeSnippet/BitkitCodeSnippet.js.map

@@ -1 +1 @@
-{"version":3,"file":"BitkitCodeSnippet.js","names":[],"sources":["../../../lib/components/BitkitCodeSnippet/BitkitCodeSnippet.tsx"],"sourcesContent":["import { useClipboard } from '@ark-ui/react/clipboard';\nimport { chakra, useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { forwardRef, type KeyboardEvent, useState } from 'react';\n\nimport { IconCheck, IconCopy } from '../../icons';\nimport AssetSelectChevron from '../../utilities/AssetSelectChevron';\nimport BitkitTooltip from '../BitkitTooltip/BitkitTooltip';\n\nconst COPY_TOOLTIP = 'Copy to clipboard';\n\ninterface BaseProps {\n  children: string;\n  size?: 'md' | 'lg';\n  textToCopy?: string;\n}\n\ninterface InlineProps extends BaseProps {\n  interactive?: boolean;\n  startingHeight?: never;\n  variant: 'inline';\n}\n\ninterface BlockProps extends BaseProps {\n  interactive?: never;\n  startingHeight?: number;\n  variant: 'multi' | 'single';\n}\n\nexport type BitkitCodeSnippetProps = InlineProps | BlockProps;\n\nconst BitkitCodeSnippet = forwardRef<HTMLElement, BitkitCodeSnippetProps>((props, ref) => {\n  const { children, interactive, size = 'lg', startingHeight, textToCopy, variant } = props;\n\n  const hasShowMore = startingHeight !== undefined;\n  const [isExpanded, setIsExpanded] = useState(false);\n\n  const { copied, copy } = useClipboard({ timeout: 2000, value: textToCopy ?? children });\n\n  const recipe = useSlotRecipe({ key: 'codeSnippet' });\n  const styles = recipe({ size, variant, hasShowMore, isExpanded, interactive });\n\n  const handleToggleExpand = () => {\n    setIsExpanded((prev) => !prev);\n  };\n\n  const handleKeyDown = (e: KeyboardEvent) => {\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      copy();\n    }\n  };\n\n  const copyButton = (\n    <chakra.button aria-label={COPY_TOOLTIP} css={styles.copyButton} onClick={copy} type=\"button\">\n      {copied ? <IconCheck size=\"16\" /> : <IconCopy size=\"16\" />}\n    </chakra.button>\n  );\n\n  if (variant === 'inline') {\n    if (!interactive) {\n      return (\n        <chakra.code ref={ref} css={styles.root}>\n          {children}\n        </chakra.code>\n      );\n    }\n\n    return (\n      <BitkitTooltip text={COPY_TOOLTIP}>\n        <chakra.code ref={ref} css={styles.root} onClick={copy} onKeyDown={handleKeyDown} role=\"button\" tabIndex={0}>\n          {children}\n        </chakra.code>\n      </BitkitTooltip>\n    );\n  }\n\n  if (variant === 'single') {\n    return (\n      <chakra.div ref={ref} css={styles.root}>\n        <chakra.code css={styles.content} tabIndex={-1}>\n          {children}\n        </chakra.code>\n        <BitkitTooltip text={COPY_TOOLTIP}>{copyButton}</BitkitTooltip>\n      </chakra.div>\n    );\n  }\n\n  const contentMaxHeight = hasShowMore && !isExpanded ? startingHeight : undefined;\n\n  return (\n    <chakra.div ref={ref} css={styles.root}>\n      <chakra.code css={styles.content} maxHeight={contentMaxHeight} tabIndex={-1}>\n        {children}\n      </chakra.code>\n      <chakra.div css={styles.copyButtonWrapper}>\n        <BitkitTooltip text={COPY_TOOLTIP}>{copyButton}</BitkitTooltip>\n      </chakra.div>\n      {hasShowMore && (\n        <chakra.div css={styles.showMoreContainer}>\n          {!isExpanded && <chakra.div css={styles.showMoreGradient} />}\n          <chakra.button onClick={handleToggleExpand} css={styles.showMoreButton}>\n            {isExpanded ? 'Show less' : 'Show more'}\n            <AssetSelectChevron data-state={isExpanded ? 'open' : 'closed'} height=\"16\" width=\"16\" />\n          </chakra.button>\n        </chakra.div>\n      )}\n    </chakra.div>\n  );\n});\n\nBitkitCodeSnippet.displayName = 'BitkitCodeSnippet';\n\nexport default BitkitCodeSnippet;\n"],"mappings":";;;;;;;;;AAQA,IAAM,eAAe;AAsBrB,IAAM,oBAAoB,YAAiD,OAAO,QAAQ;CACxF,MAAM,EAAE,UAAU,aAAa,OAAO,MAAM,gBAAgB,YAAY,YAAY;CAEpF,MAAM,cAAc,mBAAmB,KAAA;CACvC,MAAM,CAAC,YAAY,iBAAiB,SAAS,KAAK;CAElD,MAAM,EAAE,QAAQ,SAAS,aAAa;EAAE,SAAS;EAAM,OAAO,cAAc;CAAS,CAAC;CAGtF,MAAM,SADS,cAAc,EAAE,KAAK,cAAc,CACnC,EAAO;EAAE;EAAM;EAAS;EAAa;EAAY;CAAY,CAAC;CAE7E,MAAM,2BAA2B;EAC/B,eAAe,SAAS,CAAC,IAAI;CAC/B;CAEA,MAAM,iBAAiB,MAAqB;EAC1C,IAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,KAAK;GACtC,EAAE,eAAe;GACjB,KAAK;EACP;CACF;CAEA,MAAM,aACJ,oBAAC,OAAO,QAAR;EAAe,cAAY;EAAc,KAAK,OAAO;EAAY,SAAS;EAAM,MAAK;YAClF,SAAS,oBAAC,WAAD,EAAW,MAAK,KAAM,CAAA,IAAI,oBAAC,UAAD,EAAU,MAAK,KAAM,CAAA;CAC5C,CAAA;CAGjB,IAAI,YAAY,UAAU;EACxB,IAAI,CAAC,aACH,OACE,oBAAC,OAAO,MAAR;GAAkB;GAAK,KAAK,OAAO;GAChC;EACU,CAAA;EAIjB,OACE,oBAAC,eAAD;GAAe,MAAM;aACnB,oBAAC,OAAO,MAAR;IAAkB;IAAK,KAAK,OAAO;IAAM,SAAS;IAAM,WAAW;IAAe,MAAK;IAAS,UAAU;IACvG;GACU,CAAA;EACA,CAAA;CAEnB;CAEA,IAAI,YAAY,UACd,OACE,qBAAC,OAAO,KAAR;EAAiB;EAAK,KAAK,OAAO;YAAlC,CACE,oBAAC,OAAO,MAAR;GAAa,KAAK,OAAO;GAAS,UAAU;GACzC;EACU,CAAA,GACb,oBAAC,eAAD;GAAe,MAAM;aAAe;EAA0B,CAAA,CACpD;;CAIhB,MAAM,mBAAmB,eAAe,CAAC,aAAa,iBAAiB,KAAA;CAEvE,OACE,qBAAC,OAAO,KAAR;EAAiB;EAAK,KAAK,OAAO;YAAlC;GACE,oBAAC,OAAO,MAAR;IAAa,KAAK,OAAO;IAAS,WAAW;IAAkB,UAAU;IACtE;GACU,CAAA;GACb,oBAAC,OAAO,KAAR;IAAY,KAAK,OAAO;cACtB,oBAAC,eAAD;KAAe,MAAM;eAAe;IAA0B,CAAA;GACpD,CAAA;GACX,eACC,qBAAC,OAAO,KAAR;IAAY,KAAK,OAAO;cAAxB,CACG,CAAC,cAAc,oBAAC,OAAO,KAAR,EAAY,KAAK,OAAO,iBAAmB,CAAA,GAC3D,qBAAC,OAAO,QAAR;KAAe,SAAS;KAAoB,KAAK,OAAO;eAAxD,CACG,aAAa,cAAc,aAC5B,oBAAC,oBAAD;MAAoB,cAAY,aAAa,SAAS;MAAU,QAAO;MAAK,OAAM;KAAM,CAAA,CAC3E;MACL;;EAEJ;;AAEhB,CAAC;AAED,kBAAkB,cAAc"}
+{"version":3,"file":"BitkitCodeSnippet.js","names":[],"sources":["../../../lib/components/BitkitCodeSnippet/BitkitCodeSnippet.tsx"],"sourcesContent":["import { useClipboard } from '@ark-ui/react/clipboard';\nimport { chakra, type HTMLChakraProps, useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { forwardRef, type KeyboardEvent, useState } from 'react';\n\nimport { IconCheck, IconCopy } from '../../icons';\nimport AssetSelectChevron from '../../utilities/AssetSelectChevron';\nimport BitkitTooltip from '../BitkitTooltip/BitkitTooltip';\n\nconst COPY_TOOLTIP = 'Copy to clipboard';\n\ninterface InlineProps extends Omit<HTMLChakraProps<'code'>, 'children' | 'size'> {\n  children: string;\n  interactive?: boolean;\n  size?: 'md' | 'lg';\n  startingHeight?: never;\n  textToCopy?: string;\n  variant: 'inline';\n}\n\ninterface BlockProps extends Omit<HTMLChakraProps<'div'>, 'children' | 'size'> {\n  children: string;\n  interactive?: never;\n  size?: 'md' | 'lg';\n  startingHeight?: number;\n  textToCopy?: string;\n  variant: 'multi' | 'single';\n}\n\nexport type BitkitCodeSnippetProps = InlineProps | BlockProps;\n\nconst BitkitCodeSnippet = forwardRef<HTMLElement, BitkitCodeSnippetProps>((props, ref) => {\n  const hasShowMore = props.startingHeight !== undefined;\n  const [isExpanded, setIsExpanded] = useState(false);\n\n  const { copied, copy } = useClipboard({ timeout: 2000, value: props.textToCopy ?? props.children });\n\n  const recipe = useSlotRecipe({ key: 'codeSnippet' });\n  const styles = recipe({\n    hasShowMore,\n    interactive: props.interactive,\n    isExpanded,\n    size: props.size ?? 'lg',\n    variant: props.variant,\n  });\n\n  const handleToggleExpand = () => {\n    setIsExpanded((prev) => !prev);\n  };\n\n  const handleKeyDown = (e: KeyboardEvent<HTMLElement>) => {\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      copy();\n    }\n  };\n\n  const copyButton = (\n    <chakra.button aria-label={COPY_TOOLTIP} css={styles.copyButton} onClick={copy} type=\"button\">\n      {copied ? <IconCheck size=\"16\" /> : <IconCopy size=\"16\" />}\n    </chakra.button>\n  );\n\n  if (props.variant === 'inline') {\n    const { children, interactive, size: _size, textToCopy: _textToCopy, variant: _variant, ...rest } = props;\n\n    if (!interactive) {\n      return (\n        <chakra.code ref={ref} {...rest} css={[styles.root, rest.css]}>\n          {children}\n        </chakra.code>\n      );\n    }\n\n    return (\n      <BitkitTooltip text={COPY_TOOLTIP}>\n        <chakra.code\n          ref={ref}\n          {...rest}\n          css={[styles.root, rest.css]}\n          onClick={(e) => {\n            rest.onClick?.(e);\n            if (!e.defaultPrevented) copy();\n          }}\n          onKeyDown={(e) => {\n            rest.onKeyDown?.(e);\n            if (!e.defaultPrevented) handleKeyDown(e);\n          }}\n          role=\"button\"\n          tabIndex={0}\n        >\n          {children}\n        </chakra.code>\n      </BitkitTooltip>\n    );\n  }\n\n  const { children, size: _size, startingHeight, textToCopy: _textToCopy, variant, ...rest } = props;\n\n  if (variant === 'single') {\n    return (\n      <chakra.div ref={ref} {...rest} css={[styles.root, rest.css]}>\n        <chakra.code css={styles.content} tabIndex={-1}>\n          {children}\n        </chakra.code>\n        <BitkitTooltip text={COPY_TOOLTIP}>{copyButton}</BitkitTooltip>\n      </chakra.div>\n    );\n  }\n\n  const contentMaxHeight = hasShowMore && !isExpanded ? startingHeight : undefined;\n\n  return (\n    <chakra.div ref={ref} {...rest} css={[styles.root, rest.css]}>\n      <chakra.code css={styles.content} maxHeight={contentMaxHeight} tabIndex={-1}>\n        {children}\n      </chakra.code>\n      <chakra.div css={styles.copyButtonWrapper}>\n        <BitkitTooltip text={COPY_TOOLTIP}>{copyButton}</BitkitTooltip>\n      </chakra.div>\n      {hasShowMore && (\n        <chakra.div css={styles.showMoreContainer}>\n          {!isExpanded && <chakra.div css={styles.showMoreGradient} />}\n          <chakra.button onClick={handleToggleExpand} css={styles.showMoreButton}>\n            {isExpanded ? 'Show less' : 'Show more'}\n            <AssetSelectChevron data-state={isExpanded ? 'open' : 'closed'} height=\"16\" width=\"16\" />\n          </chakra.button>\n        </chakra.div>\n      )}\n    </chakra.div>\n  );\n});\n\nBitkitCodeSnippet.displayName = 'BitkitCodeSnippet';\n\nexport default BitkitCodeSnippet;\n"],"mappings":";;;;;;;;;AAQA,IAAM,eAAe;AAsBrB,IAAM,oBAAoB,YAAiD,OAAO,QAAQ;CACxF,MAAM,cAAc,MAAM,mBAAmB,KAAA;CAC7C,MAAM,CAAC,YAAY,iBAAiB,SAAS,KAAK;CAElD,MAAM,EAAE,QAAQ,SAAS,aAAa;EAAE,SAAS;EAAM,OAAO,MAAM,cAAc,MAAM;CAAS,CAAC;CAGlG,MAAM,SADS,cAAc,EAAE,KAAK,cAAc,CACnC,EAAO;EACpB;EACA,aAAa,MAAM;EACnB;EACA,MAAM,MAAM,QAAQ;EACpB,SAAS,MAAM;CACjB,CAAC;CAED,MAAM,2BAA2B;EAC/B,eAAe,SAAS,CAAC,IAAI;CAC/B;CAEA,MAAM,iBAAiB,MAAkC;EACvD,IAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,KAAK;GACtC,EAAE,eAAe;GACjB,KAAK;EACP;CACF;CAEA,MAAM,aACJ,oBAAC,OAAO,QAAR;EAAe,cAAY;EAAc,KAAK,OAAO;EAAY,SAAS;EAAM,MAAK;YAClF,SAAS,oBAAC,WAAD,EAAW,MAAK,KAAM,CAAA,IAAI,oBAAC,UAAD,EAAU,MAAK,KAAM,CAAA;CAC5C,CAAA;CAGjB,IAAI,MAAM,YAAY,UAAU;EAC9B,MAAM,EAAE,UAAU,aAAa,MAAM,OAAO,YAAY,aAAa,SAAS,UAAU,GAAG,SAAS;EAEpG,IAAI,CAAC,aACH,OACE,oBAAC,OAAO,MAAR;GAAkB;GAAK,GAAI;GAAM,KAAK,CAAC,OAAO,MAAM,KAAK,GAAG;GACzD;EACU,CAAA;EAIjB,OACE,oBAAC,eAAD;GAAe,MAAM;aACnB,oBAAC,OAAO,MAAR;IACO;IACL,GAAI;IACJ,KAAK,CAAC,OAAO,MAAM,KAAK,GAAG;IAC3B,UAAU,MAAM;KACd,KAAK,UAAU,CAAC;KAChB,IAAI,CAAC,EAAE,kBAAkB,KAAK;IAChC;IACA,YAAY,MAAM;KAChB,KAAK,YAAY,CAAC;KAClB,IAAI,CAAC,EAAE,kBAAkB,cAAc,CAAC;IAC1C;IACA,MAAK;IACL,UAAU;IAET;GACU,CAAA;EACA,CAAA;CAEnB;CAEA,MAAM,EAAE,UAAU,MAAM,OAAO,gBAAgB,YAAY,aAAa,SAAS,GAAG,SAAS;CAE7F,IAAI,YAAY,UACd,OACE,qBAAC,OAAO,KAAR;EAAiB;EAAK,GAAI;EAAM,KAAK,CAAC,OAAO,MAAM,KAAK,GAAG;YAA3D,CACE,oBAAC,OAAO,MAAR;GAAa,KAAK,OAAO;GAAS,UAAU;GACzC;EACU,CAAA,GACb,oBAAC,eAAD;GAAe,MAAM;aAAe;EAA0B,CAAA,CACpD;;CAIhB,MAAM,mBAAmB,eAAe,CAAC,aAAa,iBAAiB,KAAA;CAEvE,OACE,qBAAC,OAAO,KAAR;EAAiB;EAAK,GAAI;EAAM,KAAK,CAAC,OAAO,MAAM,KAAK,GAAG;YAA3D;GACE,oBAAC,OAAO,MAAR;IAAa,KAAK,OAAO;IAAS,WAAW;IAAkB,UAAU;IACtE;GACU,CAAA;GACb,oBAAC,OAAO,KAAR;IAAY,KAAK,OAAO;cACtB,oBAAC,eAAD;KAAe,MAAM;eAAe;IAA0B,CAAA;GACpD,CAAA;GACX,eACC,qBAAC,OAAO,KAAR;IAAY,KAAK,OAAO;cAAxB,CACG,CAAC,cAAc,oBAAC,OAAO,KAAR,EAAY,KAAK,OAAO,iBAAmB,CAAA,GAC3D,qBAAC,OAAO,QAAR;KAAe,SAAS;KAAoB,KAAK,OAAO;eAAxD,CACG,aAAa,cAAc,aAC5B,oBAAC,oBAAD;MAAoB,cAAY,aAAa,SAAS;MAAU,QAAO;MAAK,OAAM;KAAM,CAAA,CAC3E;MACL;;EAEJ;;AAEhB,CAAC;AAED,kBAAkB,cAAc"}

package/dist/components/BitkitDialog/BitkitDialog.d.ts

@@ -3,8 +3,10 @@ import { ReactNode } from 'react';
 import { BitkitDialogHeaderProps } from './BitkitDialogHeader';
 export interface BitkitDialogProps {
     children?: ReactNode;
+    closable?: boolean;
     headerLabel?: string;
     maxHeight?: string;
+    onExitComplete?: () => void;
     onOpenChange?: (details: {
         open: boolean;
     }) => void;
@@ -19,7 +21,7 @@ export interface BitkitDialogProps {
     variant?: 'overflowContent';
 }
 declare const _default: {
-    ({ children, headerLabel, maxHeight, onOpenChange, open, preventScroll, scrollBehavior: scrollBehaviorProp, showScrollGradient, size, step, title, trigger, variant, }: BitkitDialogProps): import("react/jsx-runtime").JSX.Element;
+    ({ children, closable, headerLabel, maxHeight, onExitComplete, onOpenChange, open, preventScroll, scrollBehavior: scrollBehaviorProp, showScrollGradient, size, step, title, trigger, variant, }: BitkitDialogProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 } & {
     ActionTrigger: import('react').ForwardRefExoticComponent<Dialog.ActionTriggerProps & import('react').RefAttributes<HTMLButtonElement>>;

package/dist/components/BitkitDialog/BitkitDialog.js

@@ -9,23 +9,26 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { Portal } from "@chakra-ui/react/portal";
 import { Dialog } from "@chakra-ui/react/dialog";
 //#region lib/components/BitkitDialog/BitkitDialog.tsx
-var BitkitDialog = ({ children, headerLabel, maxHeight, onOpenChange, open, preventScroll, scrollBehavior: scrollBehaviorProp, showScrollGradient, size, step = 0, title, trigger, variant }) => {
+var BitkitDialog = ({ children, closable = true, headerLabel, maxHeight, onExitComplete, onOpenChange, open, preventScroll, scrollBehavior: scrollBehaviorProp, showScrollGradient, size, step = 0, title, trigger, variant }) => {
 	const scrollBehavior = variant === "overflowContent" ? "inside" : scrollBehaviorProp;
 	const childrenArray = Children.toArray(children);
 	const headerChild = childrenArray.find((child) => isValidElement(child) && child.type === BitkitDialogHeader);
 	const bodyChildren = childrenArray.filter((child) => !(isValidElement(child) && child.type === BitkitDialogHeader));
 	const stepHeader = isValidElement(headerChild) ? headerChild.props.children : void 0;
 	return /* @__PURE__ */ jsxs(BitkitDialogRoot, {
+		closeOnEscape: closable,
+		onExitComplete,
+		onOpenChange,
 		open,
 		preventScroll,
 		scrollBehavior,
 		size,
 		variant,
-		onOpenChange,
 		children: [trigger && /* @__PURE__ */ jsx(Dialog.Trigger, {
 			asChild: true,
 			children: trigger
 		}), /* @__PURE__ */ jsxs(Portal, { children: [/* @__PURE__ */ jsx(Dialog.Backdrop, {}), /* @__PURE__ */ jsx(Dialog.Positioner, { children: /* @__PURE__ */ jsx(BitkitDialogContent, {
+			closable,
 			headerLabel,
 			maxHeight,
 			scrollBehavior,

package/dist/components/BitkitDialog/BitkitDialog.js.map

@@ -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      onOpenChange={onOpenChange}\n    >\n      {trigger && <Dialog.Trigger asChild>{trigger}</Dialog.Trigger>}\n      <Portal>\n        <Dialog.Backdrop />\n        <Dialog.Positioner>\n          <BitkitDialogContent\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":";;;;;;;;;;;AA2BA,IAAM,gBAAgB,EACpB,UACA,aACA,WACA,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;EACQ;EACS;EACC;EACV;EACG;EACK;YANhB,CAQG,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;GACe;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"}
+{"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"}

package/dist/components/BitkitDialog/BitkitDialogContent.d.ts

@@ -1,6 +1,7 @@
 import { ReactNode } from 'react';
 export interface BitkitDialogContentProps {
     children?: ReactNode;
+    closable?: boolean;
     headerLabel?: string;
     maxHeight?: string;
     scrollBehavior?: 'inside' | 'outside';
@@ -10,5 +11,5 @@ export interface BitkitDialogContentProps {
     title: ReactNode;
     variant?: 'overflowContent';
 }
-declare const BitkitDialogContent: ({ children, headerLabel, maxHeight, scrollBehavior: scrollBehaviorProp, showScrollGradient, step, stepHeader, title, variant, }: BitkitDialogContentProps) => import("react/jsx-runtime").JSX.Element;
+declare const BitkitDialogContent: ({ children, closable, headerLabel, maxHeight, scrollBehavior: scrollBehaviorProp, showScrollGradient, step, stepHeader, title, variant, }: BitkitDialogContentProps) => import("react/jsx-runtime").JSX.Element;
 export default BitkitDialogContent;

package/dist/components/BitkitDialog/BitkitDialogContent.js

@@ -6,7 +6,7 @@ import { chakra } from "@chakra-ui/react/styled-system";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Dialog, useDialogStyles } from "@chakra-ui/react/dialog";
 //#region lib/components/BitkitDialog/BitkitDialogContent.tsx
-var BitkitDialogContent = ({ children, headerLabel, maxHeight, scrollBehavior: scrollBehaviorProp = "outside", showScrollGradient = true, step = 0, stepHeader, title, variant }) => {
+var BitkitDialogContent = ({ children, closable = true, headerLabel, maxHeight, scrollBehavior: scrollBehaviorProp = "outside", showScrollGradient = true, step = 0, stepHeader, title, variant }) => {
 	const scrollBehavior = variant === "overflowContent" ? "inside" : scrollBehaviorProp;
 	const styles = useDialogStyles();
 	return /* @__PURE__ */ jsx(Dialog.Content, {
@@ -34,7 +34,10 @@ var BitkitDialogContent = ({ children, headerLabel, maxHeight, scrollBehavior: s
 					}),
 					/* @__PURE__ */ jsx(Dialog.CloseTrigger, {
 						asChild: true,
-						children: /* @__PURE__ */ jsx(BitkitCloseButton, { size: variant === "overflowContent" ? "xs" : "md" })
+						children: /* @__PURE__ */ jsx(BitkitCloseButton, {
+							disabled: !closable,
+							size: variant === "overflowContent" ? "xs" : "md"
+						})
 					})
 				] }), children]
 			})

package/dist/components/BitkitDialog/BitkitDialogContent.js.map

@@ -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":";;;;;;;;AAqBA,IAAM,uBAAuB,EAC3B,UACA,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,EAAmB,MAAM,YAAY,oBAAoB,OAAO,KAAO,CAAA;KACpD,CAAA;IACR,EAAA,CAAA,GACd,QACyB;;EACJ,CAAA;CACZ,CAAA;AAEpB"}
+{"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"}

package/dist/components/BitkitSplitButton/BitkitSplitButton.d.ts

@@ -1,15 +1,16 @@
+import { GroupProps } from '@chakra-ui/react/group';
 import { PropsWithChildren, ReactNode } from 'react';
 import { BitkitButtonProps } from '../BitkitButton/BitkitButton';
 type Size = 'lg' | 'md' | 'sm';
 type Variant = 'primary' | 'secondary';
 type State = 'disabled' | 'loading' | 'skeleton';
 type BitkitSplitButtonActionProps = Omit<BitkitButtonProps, 'size' | 'variant' | 'state'>;
-export type BitkitSplitButtonProps = PropsWithChildren<{
+export type BitkitSplitButtonProps = PropsWithChildren<Omit<GroupProps, 'attached' | 'children' | 'display'> & {
     size?: Size;
     variant?: Variant;
     state?: State;
 }>;
-declare const _default: import('react').ForwardRefExoticComponent<{
+declare const _default: import('react').ForwardRefExoticComponent<Omit<GroupProps, "display" | "children" | "attached"> & {
     size?: Size;
     variant?: Variant;
     state?: State;

package/dist/components/BitkitSplitButton/BitkitSplitButton.js

@@ -33,7 +33,7 @@ var BitkitSplitButtonAction = forwardRef((props, ref) => {
 });
 BitkitSplitButtonAction.displayName = "BitkitSplitButtonAction";
 var BitkitSplitButton = forwardRef((props, ref) => {
-	const { children, size = "lg", state, variant = "primary" } = props;
+	const { children, size = "lg", state, variant = "primary", ...rest } = props;
 	const childArray = Children.toArray(children);
 	const actionChild = childArray.find(isValidActionItem);
 	const menuItems = childArray.filter(isValidMenuItem);
@@ -51,6 +51,7 @@ var BitkitSplitButton = forwardRef((props, ref) => {
 			loading: state === "skeleton",
 			children: /* @__PURE__ */ jsxs(Group, {
 				ref,
+				...rest,
 				attached: true,
 				display: "inline-flex",
 				children: [actionChild, /* @__PURE__ */ jsx(BitkitActionMenu.Root, {

package/dist/components/BitkitSplitButton/BitkitSplitButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"BitkitSplitButton.js","names":[],"sources":["../../../lib/components/BitkitSplitButton/BitkitSplitButton.tsx"],"sourcesContent":["// eslint-disable-next-line no-restricted-imports\nimport { createContext } from '@chakra-ui/react';\nimport { Group } from '@chakra-ui/react/group';\nimport { Skeleton } from '@chakra-ui/react/skeleton';\nimport { type SystemStyleObject, useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { Children, forwardRef, isValidElement, type PropsWithChildren, type ReactElement, type ReactNode } from 'react';\n\nimport { IconChevronDown } from '../../icons';\nimport BitkitActionMenu from '../BitkitActionMenu/BitkitActionMenu';\nimport BitkitButton, { type BitkitButtonProps } from '../BitkitButton/BitkitButton';\nimport BitkitIconButton from '../BitkitIconButton/BitkitIconButton';\n\ntype Size = 'lg' | 'md' | 'sm';\ntype Variant = 'primary' | 'secondary';\ntype State = 'disabled' | 'loading' | 'skeleton';\n\nconst isValidActionItem = (child: ReactNode): child is ReactElement => {\n  return isValidElement(child) && child.type === BitkitSplitButtonAction;\n};\n\nconst isValidMenuItem = (child: ReactNode): child is ReactElement => {\n  return (\n    isValidElement(child) &&\n    (child.type === BitkitActionMenu.Group ||\n      child.type === BitkitActionMenu.Item ||\n      child.type === BitkitActionMenu.Separator)\n  );\n};\n\n// --- Context ---\ninterface SplitButtonContext {\n  size: Size;\n  variant: Variant;\n  state: State | undefined;\n  styles: Record<string, SystemStyleObject>;\n}\n\nconst [SplitButtonProvider, useSplitButtonContext] = createContext<SplitButtonContext>({\n  name: 'SplitButtonContext',\n  hookName: 'useSplitButtonContext',\n  providerName: '<BitkitSplitButton />',\n});\n\n// --- Action ---\ntype BitkitSplitButtonActionProps = Omit<BitkitButtonProps, 'size' | 'variant' | 'state'>;\n\nconst BitkitSplitButtonAction = forwardRef<HTMLButtonElement, BitkitSplitButtonActionProps>((props, ref) => {\n  const { size, state, styles, variant } = useSplitButtonContext();\n\n  return <BitkitButton ref={ref} css={styles.action} size={size} variant={variant} state={state} {...props} />;\n});\n\nBitkitSplitButtonAction.displayName = 'BitkitSplitButtonAction';\n\n// --- Root ---\nexport type BitkitSplitButtonProps = PropsWithChildren<{\n  size?: Size;\n  variant?: Variant;\n  state?: State;\n}>;\n\nconst BitkitSplitButton = forwardRef<HTMLDivElement, BitkitSplitButtonProps>((props, ref) => {\n  const { children, size = 'lg', state, variant = 'primary' } = props;\n\n  const childArray = Children.toArray(children);\n  const actionChild = childArray.find(isValidActionItem);\n  const menuItems = childArray.filter(isValidMenuItem);\n\n  const menuSize = size === 'lg' ? 'lg' : 'md';\n  const recipe = useSlotRecipe({ key: 'splitButton' });\n  const styles = recipe({ variant });\n\n  return (\n    <SplitButtonProvider value={{ size, state, styles, variant }}>\n      <Skeleton asChild loading={state === 'skeleton'}>\n        <Group ref={ref} attached display=\"inline-flex\">\n          {actionChild}\n          <BitkitActionMenu.Root\n            size={menuSize}\n            trigger={\n              <BitkitIconButton\n                css={styles.trigger}\n                icon={IconChevronDown}\n                label=\"Toggle menu\"\n                size={size}\n                state={state === 'loading' ? 'disabled' : state}\n                variant={variant}\n              />\n            }\n            positioning={{ placement: 'bottom-end' }}\n          >\n            {menuItems}\n          </BitkitActionMenu.Root>\n        </Group>\n      </Skeleton>\n    </SplitButtonProvider>\n  );\n});\nBitkitSplitButton.displayName = 'BitkitSplitButton';\n\nexport default Object.assign(BitkitSplitButton, {\n  Action: BitkitSplitButtonAction,\n  Group: BitkitActionMenu.Group,\n  Item: BitkitActionMenu.Item,\n  Separator: BitkitActionMenu.Separator,\n});\n"],"mappings":";;;;;;;;;;;AAgBA,IAAM,qBAAqB,UAA4C;CACrE,OAAO,eAAe,KAAK,KAAK,MAAM,SAAS;AACjD;AAEA,IAAM,mBAAmB,UAA4C;CACnE,OACE,eAAe,KAAK,MACnB,MAAM,SAAS,iBAAiB,SAC/B,MAAM,SAAS,iBAAiB,QAChC,MAAM,SAAS,iBAAiB;AAEtC;AAUA,IAAM,CAAC,qBAAqB,yBAAyB,gBAAkC;CACrF,MAAM;CACN,UAAU;CACV,cAAc;AAChB,CAAC;AAKD,IAAM,0BAA0B,YAA6D,OAAO,QAAQ;CAC1G,MAAM,EAAE,MAAM,OAAO,QAAQ,YAAY,sBAAsB;CAE/D,OAAO,oBAAC,cAAD;EAAmB;EAAK,KAAK,OAAO;EAAc;EAAe;EAAgB;EAAO,GAAI;CAAQ,CAAA;AAC7G,CAAC;AAED,wBAAwB,cAAc;AAStC,IAAM,oBAAoB,YAAoD,OAAO,QAAQ;CAC3F,MAAM,EAAE,UAAU,OAAO,MAAM,OAAO,UAAU,cAAc;CAE9D,MAAM,aAAa,SAAS,QAAQ,QAAQ;CAC5C,MAAM,cAAc,WAAW,KAAK,iBAAiB;CACrD,MAAM,YAAY,WAAW,OAAO,eAAe;CAEnD,MAAM,WAAW,SAAS,OAAO,OAAO;CAExC,MAAM,SADS,cAAc,EAAE,KAAK,cAAc,CACnC,EAAO,EAAE,QAAQ,CAAC;CAEjC,OACE,oBAAC,qBAAD;EAAqB,OAAO;GAAE;GAAM;GAAO;GAAQ;EAAQ;YACzD,oBAAC,UAAD;GAAU,SAAA;GAAQ,SAAS,UAAU;aACnC,qBAAC,OAAD;IAAY;IAAK,UAAA;IAAS,SAAQ;cAAlC,CACG,aACD,oBAAC,iBAAiB,MAAlB;KACE,MAAM;KACN,SACE,oBAAC,kBAAD;MACE,KAAK,OAAO;MACZ,MAAM;MACN,OAAM;MACA;MACN,OAAO,UAAU,YAAY,aAAa;MACjC;KACV,CAAA;KAEH,aAAa,EAAE,WAAW,aAAa;eAEtC;IACoB,CAAA,CAClB;;EACC,CAAA;CACS,CAAA;AAEzB,CAAC;AACD,kBAAkB,cAAc;AAEhC,IAAA,4BAAe,OAAO,OAAO,mBAAmB;CAC9C,QAAQ;CACR,OAAO,iBAAiB;CACxB,MAAM,iBAAiB;CACvB,WAAW,iBAAiB;AAC9B,CAAC"}
+{"version":3,"file":"BitkitSplitButton.js","names":[],"sources":["../../../lib/components/BitkitSplitButton/BitkitSplitButton.tsx"],"sourcesContent":["// eslint-disable-next-line no-restricted-imports\nimport { createContext } from '@chakra-ui/react';\nimport { Group, type GroupProps } from '@chakra-ui/react/group';\nimport { Skeleton } from '@chakra-ui/react/skeleton';\nimport { type SystemStyleObject, useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { Children, forwardRef, isValidElement, type PropsWithChildren, type ReactElement, type ReactNode } from 'react';\n\nimport { IconChevronDown } from '../../icons';\nimport BitkitActionMenu from '../BitkitActionMenu/BitkitActionMenu';\nimport BitkitButton, { type BitkitButtonProps } from '../BitkitButton/BitkitButton';\nimport BitkitIconButton from '../BitkitIconButton/BitkitIconButton';\n\ntype Size = 'lg' | 'md' | 'sm';\ntype Variant = 'primary' | 'secondary';\ntype State = 'disabled' | 'loading' | 'skeleton';\n\nconst isValidActionItem = (child: ReactNode): child is ReactElement => {\n  return isValidElement(child) && child.type === BitkitSplitButtonAction;\n};\n\nconst isValidMenuItem = (child: ReactNode): child is ReactElement => {\n  return (\n    isValidElement(child) &&\n    (child.type === BitkitActionMenu.Group ||\n      child.type === BitkitActionMenu.Item ||\n      child.type === BitkitActionMenu.Separator)\n  );\n};\n\n// --- Context ---\ninterface SplitButtonContext {\n  size: Size;\n  variant: Variant;\n  state: State | undefined;\n  styles: Record<string, SystemStyleObject>;\n}\n\nconst [SplitButtonProvider, useSplitButtonContext] = createContext<SplitButtonContext>({\n  name: 'SplitButtonContext',\n  hookName: 'useSplitButtonContext',\n  providerName: '<BitkitSplitButton />',\n});\n\n// --- Action ---\ntype BitkitSplitButtonActionProps = Omit<BitkitButtonProps, 'size' | 'variant' | 'state'>;\n\nconst BitkitSplitButtonAction = forwardRef<HTMLButtonElement, BitkitSplitButtonActionProps>((props, ref) => {\n  const { size, state, styles, variant } = useSplitButtonContext();\n\n  return <BitkitButton ref={ref} css={styles.action} size={size} variant={variant} state={state} {...props} />;\n});\n\nBitkitSplitButtonAction.displayName = 'BitkitSplitButtonAction';\n\n// --- Root ---\nexport type BitkitSplitButtonProps = PropsWithChildren<\n  Omit<GroupProps, 'attached' | 'children' | 'display'> & {\n    size?: Size;\n    variant?: Variant;\n    state?: State;\n  }\n>;\n\nconst BitkitSplitButton = forwardRef<HTMLDivElement, BitkitSplitButtonProps>((props, ref) => {\n  const { children, size = 'lg', state, variant = 'primary', ...rest } = props;\n\n  const childArray = Children.toArray(children);\n  const actionChild = childArray.find(isValidActionItem);\n  const menuItems = childArray.filter(isValidMenuItem);\n\n  const menuSize = size === 'lg' ? 'lg' : 'md';\n  const recipe = useSlotRecipe({ key: 'splitButton' });\n  const styles = recipe({ variant });\n\n  return (\n    <SplitButtonProvider value={{ size, state, styles, variant }}>\n      <Skeleton asChild loading={state === 'skeleton'}>\n        <Group ref={ref} {...rest} attached display=\"inline-flex\">\n          {actionChild}\n          <BitkitActionMenu.Root\n            size={menuSize}\n            trigger={\n              <BitkitIconButton\n                css={styles.trigger}\n                icon={IconChevronDown}\n                label=\"Toggle menu\"\n                size={size}\n                state={state === 'loading' ? 'disabled' : state}\n                variant={variant}\n              />\n            }\n            positioning={{ placement: 'bottom-end' }}\n          >\n            {menuItems}\n          </BitkitActionMenu.Root>\n        </Group>\n      </Skeleton>\n    </SplitButtonProvider>\n  );\n});\nBitkitSplitButton.displayName = 'BitkitSplitButton';\n\nexport default Object.assign(BitkitSplitButton, {\n  Action: BitkitSplitButtonAction,\n  Group: BitkitActionMenu.Group,\n  Item: BitkitActionMenu.Item,\n  Separator: BitkitActionMenu.Separator,\n});\n"],"mappings":";;;;;;;;;;;AAgBA,IAAM,qBAAqB,UAA4C;CACrE,OAAO,eAAe,KAAK,KAAK,MAAM,SAAS;AACjD;AAEA,IAAM,mBAAmB,UAA4C;CACnE,OACE,eAAe,KAAK,MACnB,MAAM,SAAS,iBAAiB,SAC/B,MAAM,SAAS,iBAAiB,QAChC,MAAM,SAAS,iBAAiB;AAEtC;AAUA,IAAM,CAAC,qBAAqB,yBAAyB,gBAAkC;CACrF,MAAM;CACN,UAAU;CACV,cAAc;AAChB,CAAC;AAKD,IAAM,0BAA0B,YAA6D,OAAO,QAAQ;CAC1G,MAAM,EAAE,MAAM,OAAO,QAAQ,YAAY,sBAAsB;CAE/D,OAAO,oBAAC,cAAD;EAAmB;EAAK,KAAK,OAAO;EAAc;EAAe;EAAgB;EAAO,GAAI;CAAQ,CAAA;AAC7G,CAAC;AAED,wBAAwB,cAAc;AAWtC,IAAM,oBAAoB,YAAoD,OAAO,QAAQ;CAC3F,MAAM,EAAE,UAAU,OAAO,MAAM,OAAO,UAAU,WAAW,GAAG,SAAS;CAEvE,MAAM,aAAa,SAAS,QAAQ,QAAQ;CAC5C,MAAM,cAAc,WAAW,KAAK,iBAAiB;CACrD,MAAM,YAAY,WAAW,OAAO,eAAe;CAEnD,MAAM,WAAW,SAAS,OAAO,OAAO;CAExC,MAAM,SADS,cAAc,EAAE,KAAK,cAAc,CACnC,EAAO,EAAE,QAAQ,CAAC;CAEjC,OACE,oBAAC,qBAAD;EAAqB,OAAO;GAAE;GAAM;GAAO;GAAQ;EAAQ;YACzD,oBAAC,UAAD;GAAU,SAAA;GAAQ,SAAS,UAAU;aACnC,qBAAC,OAAD;IAAY;IAAK,GAAI;IAAM,UAAA;IAAS,SAAQ;cAA5C,CACG,aACD,oBAAC,iBAAiB,MAAlB;KACE,MAAM;KACN,SACE,oBAAC,kBAAD;MACE,KAAK,OAAO;MACZ,MAAM;MACN,OAAM;MACA;MACN,OAAO,UAAU,YAAY,aAAa;MACjC;KACV,CAAA;KAEH,aAAa,EAAE,WAAW,aAAa;eAEtC;IACoB,CAAA,CAClB;;EACC,CAAA;CACS,CAAA;AAEzB,CAAC;AACD,kBAAkB,cAAc;AAEhC,IAAA,4BAAe,OAAO,OAAO,mBAAmB;CAC9C,QAAQ;CACR,OAAO,iBAAiB;CACxB,MAAM,iBAAiB;CACvB,WAAW,iBAAiB;AAC9B,CAAC"}

package/dist/components/BitkitSteps/BitkitSteps.d.ts

@@ -1,6 +1,7 @@
+import { StepsRootProps } from '@chakra-ui/react/steps';
 import { ReactNode } from 'react';
 export type BitkitStepsItemState = 'disabled' | 'invalid' | 'skippable';
-export interface BitkitStepsProps {
+export interface BitkitStepsProps extends Omit<StepsRootProps, 'children' | 'count' | 'linear' | 'orientation' | 'step'> {
     children: ReactNode;
     orientation?: 'horizontal' | 'vertical';
     step?: number;

package/dist/components/BitkitSteps/BitkitSteps.js

@@ -40,12 +40,13 @@ var renderLabel = (label, action) => {
 	});
 };
 var BitkitSteps = forwardRef((props, ref) => {
-	const { children, orientation = "horizontal", step: stepProp } = props;
+	const { children, orientation = "horizontal", step: stepProp, ...rest } = props;
 	const stepCardCtx = useStepCardContext();
 	const step = stepProp ?? stepCardCtx?.step ?? 0;
 	const count = Children.count(children);
 	return /* @__PURE__ */ jsx(Steps.Root, {
 		ref,
+		...rest,
 		count,
 		linear: false,
 		orientation,

package/dist/components/BitkitSteps/BitkitSteps.js.map

@@ -1 +1 @@
-{"version":3,"file":"BitkitSteps.js","names":[],"sources":["../../../lib/components/BitkitSteps/BitkitSteps.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Link } from '@chakra-ui/react/link';\nimport { Steps, useStepsContext, useStepsStyles } from '@chakra-ui/react/steps';\nimport { Children, cloneElement, forwardRef, isValidElement, type ReactElement, type ReactNode } from 'react';\n\nimport IconCheck from '../../icons/IconCheck';\nimport IconSkip from '../../icons/IconSkip';\nimport { useStepCardContext } from '../BitkitStepsCard/StepCardContext';\n\nexport type BitkitStepsItemState = 'disabled' | 'invalid' | 'skippable';\n\ntype EffectiveStatus = 'completed' | 'disabled' | 'inProgress' | 'invalid' | 'notStarted' | 'skippable' | 'skipped';\n\nconst getEffectiveStatus = (\n  itemState: BitkitStepsItemState | undefined,\n  index: number,\n  step: number,\n): EffectiveStatus => {\n  if (itemState === 'disabled') return 'disabled';\n  if (itemState === 'invalid') return 'invalid';\n  if (itemState === 'skippable') return index < step ? 'skipped' : 'skippable';\n  if (index < step) return 'completed';\n  if (index === step) return 'inProgress';\n  return 'notStarted';\n};\n\nconst renderIndicatorContent = (index: number, status: EffectiveStatus) => {\n  if (status === 'completed') return <IconCheck size=\"16\" />;\n  if (status === 'skippable' || status === 'skipped') return <IconSkip size=\"16\" />;\n  if (status === 'invalid') return '!';\n  return index + 1;\n};\n\nconst renderLabel = (label: string, action: BitkitStepsItemProps['action']) => {\n  if (!action) return label;\n\n  // Links don't look like links at rest — only the underline + purple color on hover reveals\n  // them. Intentional: this is a power-user affordance on the step title. The base Link recipe\n  // already adds the underline on hover; we only need to swap the color.\n  if (action.href) {\n    return (\n      <Link\n        _hover={{ color: 'text/link' }}\n        href={action.href}\n        onClick={action.onClick}\n        rel={action.isExternal ? 'noopener noreferrer' : undefined}\n        target={action.isExternal ? '_blank' : undefined}\n      >\n        {label}\n      </Link>\n    );\n  }\n\n  return (\n    <Link _hover={{ color: 'text/link' }} as=\"button\" onClick={action.onClick} type=\"button\">\n      {label}\n    </Link>\n  );\n};\n\nexport interface BitkitStepsProps {\n  children: ReactNode;\n  orientation?: 'horizontal' | 'vertical';\n  step?: number;\n}\n\nconst BitkitSteps = forwardRef<HTMLDivElement, BitkitStepsProps>((props, ref) => {\n  const { children, orientation = 'horizontal', step: stepProp } = props;\n  const stepCardCtx = useStepCardContext();\n  const step = stepProp ?? stepCardCtx?.step ?? 0;\n  const count = Children.count(children);\n\n  return (\n    <Steps.Root ref={ref} count={count} linear={false} orientation={orientation} step={step}>\n      <Steps.List>\n        {Children.map(children, (child, index) => {\n          if (isValidElement(child)) {\n            return cloneElement(child as ReactElement<BitkitStepsItemInternalProps>, {\n              _index: index,\n              _orientation: orientation,\n            });\n          }\n          return child;\n        })}\n      </Steps.List>\n    </Steps.Root>\n  );\n});\n\nBitkitSteps.displayName = 'BitkitSteps';\n\nexport interface BitkitStepsItemProps {\n  action?: {\n    href?: string;\n    isExternal?: boolean;\n    onClick?: () => void;\n  };\n  helperText?: string;\n  label: string;\n  state?: BitkitStepsItemState;\n}\n\ninterface BitkitStepsItemInternalProps extends BitkitStepsItemProps {\n  _index?: number;\n  _orientation?: 'horizontal' | 'vertical';\n}\n\nconst BitkitStepsItem = forwardRef<HTMLDivElement, BitkitStepsItemProps>((props, ref) => {\n  const {\n    _index = 0,\n    _orientation = 'horizontal',\n    action,\n    helperText,\n    label,\n    state,\n  } = props as BitkitStepsItemInternalProps;\n\n  const styles = useStepsStyles();\n  const stepsCtx = useStepsContext();\n  const status = getEffectiveStatus(state, _index, stepsCtx.value);\n  const resolvedAction = status === 'completed' ? action : undefined;\n  const statusAttr = { 'data-step-status': status };\n\n  return (\n    <Steps.Item {...statusAttr} index={_index} ref={ref}>\n      <Steps.Indicator {...statusAttr}>{renderIndicatorContent(_index, status)}</Steps.Indicator>\n      <Box css={styles.trigger}>\n        <Steps.Title {...statusAttr}>{renderLabel(label, resolvedAction)}</Steps.Title>\n        {_orientation === 'vertical' && helperText && (\n          <Steps.Description {...statusAttr}>{helperText}</Steps.Description>\n        )}\n      </Box>\n      <Steps.Separator />\n    </Steps.Item>\n  );\n});\n\nBitkitStepsItem.displayName = 'BitkitStepsItem';\n\nexport default Object.assign(BitkitSteps, { Item: BitkitStepsItem });\n"],"mappings":";;;;;;;;;AAaA,IAAM,sBACJ,WACA,OACA,SACoB;CACpB,IAAI,cAAc,YAAY,OAAO;CACrC,IAAI,cAAc,WAAW,OAAO;CACpC,IAAI,cAAc,aAAa,OAAO,QAAQ,OAAO,YAAY;CACjE,IAAI,QAAQ,MAAM,OAAO;CACzB,IAAI,UAAU,MAAM,OAAO;CAC3B,OAAO;AACT;AAEA,IAAM,0BAA0B,OAAe,WAA4B;CACzE,IAAI,WAAW,aAAa,OAAO,oBAAC,WAAD,EAAW,MAAK,KAAM,CAAA;CACzD,IAAI,WAAW,eAAe,WAAW,WAAW,OAAO,oBAAC,UAAD,EAAU,MAAK,KAAM,CAAA;CAChF,IAAI,WAAW,WAAW,OAAO;CACjC,OAAO,QAAQ;AACjB;AAEA,IAAM,eAAe,OAAe,WAA2C;CAC7E,IAAI,CAAC,QAAQ,OAAO;CAKpB,IAAI,OAAO,MACT,OACE,oBAAC,MAAD;EACE,QAAQ,EAAE,OAAO,YAAY;EAC7B,MAAM,OAAO;EACb,SAAS,OAAO;EAChB,KAAK,OAAO,aAAa,wBAAwB,KAAA;EACjD,QAAQ,OAAO,aAAa,WAAW,KAAA;YAEtC;CACG,CAAA;CAIV,OACE,oBAAC,MAAD;EAAM,QAAQ,EAAE,OAAO,YAAY;EAAG,IAAG;EAAS,SAAS,OAAO;EAAS,MAAK;YAC7E;CACG,CAAA;AAEV;AAQA,IAAM,cAAc,YAA8C,OAAO,QAAQ;CAC/E,MAAM,EAAE,UAAU,cAAc,cAAc,MAAM,aAAa;CACjE,MAAM,cAAc,mBAAmB;CACvC,MAAM,OAAO,YAAY,aAAa,QAAQ;CAC9C,MAAM,QAAQ,SAAS,MAAM,QAAQ;CAErC,OACE,oBAAC,MAAM,MAAP;EAAiB;EAAY;EAAO,QAAQ;EAAoB;EAAmB;YACjF,oBAAC,MAAM,MAAP,EAAA,UACG,SAAS,IAAI,WAAW,OAAO,UAAU;GACxC,IAAI,eAAe,KAAK,GACtB,OAAO,aAAa,OAAqD;IACvE,QAAQ;IACR,cAAc;GAChB,CAAC;GAEH,OAAO;EACT,CAAC,EACS,CAAA;CACF,CAAA;AAEhB,CAAC;AAED,YAAY,cAAc;AAkB1B,IAAM,kBAAkB,YAAkD,OAAO,QAAQ;CACvF,MAAM,EACJ,SAAS,GACT,eAAe,cACf,QACA,YACA,OACA,UACE;CAEJ,MAAM,SAAS,eAAe;CAE9B,MAAM,SAAS,mBAAmB,OAAO,QADxB,gBACgC,EAAS,KAAK;CAC/D,MAAM,iBAAiB,WAAW,cAAc,SAAS,KAAA;CACzD,MAAM,aAAa,EAAE,oBAAoB,OAAO;CAEhD,OACE,qBAAC,MAAM,MAAP;EAAY,GAAI;EAAY,OAAO;EAAa;YAAhD;GACE,oBAAC,MAAM,WAAP;IAAiB,GAAI;cAAa,uBAAuB,QAAQ,MAAM;GAAmB,CAAA;GAC1F,qBAAC,KAAD;IAAK,KAAK,OAAO;cAAjB,CACE,oBAAC,MAAM,OAAP;KAAa,GAAI;eAAa,YAAY,OAAO,cAAc;IAAe,CAAA,GAC7E,iBAAiB,cAAc,cAC9B,oBAAC,MAAM,aAAP;KAAmB,GAAI;eAAa;IAA8B,CAAA,CAEjE;;GACL,oBAAC,MAAM,WAAP,CAAkB,CAAA;EACR;;AAEhB,CAAC;AAED,gBAAgB,cAAc;AAE9B,IAAA,sBAAe,OAAO,OAAO,aAAa,EAAE,MAAM,gBAAgB,CAAC"}
+{"version":3,"file":"BitkitSteps.js","names":[],"sources":["../../../lib/components/BitkitSteps/BitkitSteps.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Link } from '@chakra-ui/react/link';\nimport { Steps, type StepsRootProps, useStepsContext, useStepsStyles } from '@chakra-ui/react/steps';\nimport { Children, cloneElement, forwardRef, isValidElement, type ReactElement, type ReactNode } from 'react';\n\nimport IconCheck from '../../icons/IconCheck';\nimport IconSkip from '../../icons/IconSkip';\nimport { useStepCardContext } from '../BitkitStepsCard/StepCardContext';\n\nexport type BitkitStepsItemState = 'disabled' | 'invalid' | 'skippable';\n\ntype EffectiveStatus = 'completed' | 'disabled' | 'inProgress' | 'invalid' | 'notStarted' | 'skippable' | 'skipped';\n\nconst getEffectiveStatus = (\n  itemState: BitkitStepsItemState | undefined,\n  index: number,\n  step: number,\n): EffectiveStatus => {\n  if (itemState === 'disabled') return 'disabled';\n  if (itemState === 'invalid') return 'invalid';\n  if (itemState === 'skippable') return index < step ? 'skipped' : 'skippable';\n  if (index < step) return 'completed';\n  if (index === step) return 'inProgress';\n  return 'notStarted';\n};\n\nconst renderIndicatorContent = (index: number, status: EffectiveStatus) => {\n  if (status === 'completed') return <IconCheck size=\"16\" />;\n  if (status === 'skippable' || status === 'skipped') return <IconSkip size=\"16\" />;\n  if (status === 'invalid') return '!';\n  return index + 1;\n};\n\nconst renderLabel = (label: string, action: BitkitStepsItemProps['action']) => {\n  if (!action) return label;\n\n  // Links don't look like links at rest — only the underline + purple color on hover reveals\n  // them. Intentional: this is a power-user affordance on the step title. The base Link recipe\n  // already adds the underline on hover; we only need to swap the color.\n  if (action.href) {\n    return (\n      <Link\n        _hover={{ color: 'text/link' }}\n        href={action.href}\n        onClick={action.onClick}\n        rel={action.isExternal ? 'noopener noreferrer' : undefined}\n        target={action.isExternal ? '_blank' : undefined}\n      >\n        {label}\n      </Link>\n    );\n  }\n\n  return (\n    <Link _hover={{ color: 'text/link' }} as=\"button\" onClick={action.onClick} type=\"button\">\n      {label}\n    </Link>\n  );\n};\n\nexport interface BitkitStepsProps extends Omit<\n  StepsRootProps,\n  'children' | 'count' | 'linear' | 'orientation' | 'step'\n> {\n  children: ReactNode;\n  orientation?: 'horizontal' | 'vertical';\n  step?: number;\n}\n\nconst BitkitSteps = forwardRef<HTMLDivElement, BitkitStepsProps>((props, ref) => {\n  const { children, orientation = 'horizontal', step: stepProp, ...rest } = props;\n  const stepCardCtx = useStepCardContext();\n  const step = stepProp ?? stepCardCtx?.step ?? 0;\n  const count = Children.count(children);\n\n  return (\n    <Steps.Root ref={ref} {...rest} count={count} linear={false} orientation={orientation} step={step}>\n      <Steps.List>\n        {Children.map(children, (child, index) => {\n          if (isValidElement(child)) {\n            return cloneElement(child as ReactElement<BitkitStepsItemInternalProps>, {\n              _index: index,\n              _orientation: orientation,\n            });\n          }\n          return child;\n        })}\n      </Steps.List>\n    </Steps.Root>\n  );\n});\n\nBitkitSteps.displayName = 'BitkitSteps';\n\nexport interface BitkitStepsItemProps {\n  action?: {\n    href?: string;\n    isExternal?: boolean;\n    onClick?: () => void;\n  };\n  helperText?: string;\n  label: string;\n  state?: BitkitStepsItemState;\n}\n\ninterface BitkitStepsItemInternalProps extends BitkitStepsItemProps {\n  _index?: number;\n  _orientation?: 'horizontal' | 'vertical';\n}\n\nconst BitkitStepsItem = forwardRef<HTMLDivElement, BitkitStepsItemProps>((props, ref) => {\n  const {\n    _index = 0,\n    _orientation = 'horizontal',\n    action,\n    helperText,\n    label,\n    state,\n  } = props as BitkitStepsItemInternalProps;\n\n  const styles = useStepsStyles();\n  const stepsCtx = useStepsContext();\n  const status = getEffectiveStatus(state, _index, stepsCtx.value);\n  const resolvedAction = status === 'completed' ? action : undefined;\n  const statusAttr = { 'data-step-status': status };\n\n  return (\n    <Steps.Item {...statusAttr} index={_index} ref={ref}>\n      <Steps.Indicator {...statusAttr}>{renderIndicatorContent(_index, status)}</Steps.Indicator>\n      <Box css={styles.trigger}>\n        <Steps.Title {...statusAttr}>{renderLabel(label, resolvedAction)}</Steps.Title>\n        {_orientation === 'vertical' && helperText && (\n          <Steps.Description {...statusAttr}>{helperText}</Steps.Description>\n        )}\n      </Box>\n      <Steps.Separator />\n    </Steps.Item>\n  );\n});\n\nBitkitStepsItem.displayName = 'BitkitStepsItem';\n\nexport default Object.assign(BitkitSteps, { Item: BitkitStepsItem });\n"],"mappings":";;;;;;;;;AAaA,IAAM,sBACJ,WACA,OACA,SACoB;CACpB,IAAI,cAAc,YAAY,OAAO;CACrC,IAAI,cAAc,WAAW,OAAO;CACpC,IAAI,cAAc,aAAa,OAAO,QAAQ,OAAO,YAAY;CACjE,IAAI,QAAQ,MAAM,OAAO;CACzB,IAAI,UAAU,MAAM,OAAO;CAC3B,OAAO;AACT;AAEA,IAAM,0BAA0B,OAAe,WAA4B;CACzE,IAAI,WAAW,aAAa,OAAO,oBAAC,WAAD,EAAW,MAAK,KAAM,CAAA;CACzD,IAAI,WAAW,eAAe,WAAW,WAAW,OAAO,oBAAC,UAAD,EAAU,MAAK,KAAM,CAAA;CAChF,IAAI,WAAW,WAAW,OAAO;CACjC,OAAO,QAAQ;AACjB;AAEA,IAAM,eAAe,OAAe,WAA2C;CAC7E,IAAI,CAAC,QAAQ,OAAO;CAKpB,IAAI,OAAO,MACT,OACE,oBAAC,MAAD;EACE,QAAQ,EAAE,OAAO,YAAY;EAC7B,MAAM,OAAO;EACb,SAAS,OAAO;EAChB,KAAK,OAAO,aAAa,wBAAwB,KAAA;EACjD,QAAQ,OAAO,aAAa,WAAW,KAAA;YAEtC;CACG,CAAA;CAIV,OACE,oBAAC,MAAD;EAAM,QAAQ,EAAE,OAAO,YAAY;EAAG,IAAG;EAAS,SAAS,OAAO;EAAS,MAAK;YAC7E;CACG,CAAA;AAEV;AAWA,IAAM,cAAc,YAA8C,OAAO,QAAQ;CAC/E,MAAM,EAAE,UAAU,cAAc,cAAc,MAAM,UAAU,GAAG,SAAS;CAC1E,MAAM,cAAc,mBAAmB;CACvC,MAAM,OAAO,YAAY,aAAa,QAAQ;CAC9C,MAAM,QAAQ,SAAS,MAAM,QAAQ;CAErC,OACE,oBAAC,MAAM,MAAP;EAAiB;EAAK,GAAI;EAAa;EAAO,QAAQ;EAAoB;EAAmB;YAC3F,oBAAC,MAAM,MAAP,EAAA,UACG,SAAS,IAAI,WAAW,OAAO,UAAU;GACxC,IAAI,eAAe,KAAK,GACtB,OAAO,aAAa,OAAqD;IACvE,QAAQ;IACR,cAAc;GAChB,CAAC;GAEH,OAAO;EACT,CAAC,EACS,CAAA;CACF,CAAA;AAEhB,CAAC;AAED,YAAY,cAAc;AAkB1B,IAAM,kBAAkB,YAAkD,OAAO,QAAQ;CACvF,MAAM,EACJ,SAAS,GACT,eAAe,cACf,QACA,YACA,OACA,UACE;CAEJ,MAAM,SAAS,eAAe;CAE9B,MAAM,SAAS,mBAAmB,OAAO,QADxB,gBACgC,EAAS,KAAK;CAC/D,MAAM,iBAAiB,WAAW,cAAc,SAAS,KAAA;CACzD,MAAM,aAAa,EAAE,oBAAoB,OAAO;CAEhD,OACE,qBAAC,MAAM,MAAP;EAAY,GAAI;EAAY,OAAO;EAAa;YAAhD;GACE,oBAAC,MAAM,WAAP;IAAiB,GAAI;cAAa,uBAAuB,QAAQ,MAAM;GAAmB,CAAA;GAC1F,qBAAC,KAAD;IAAK,KAAK,OAAO;cAAjB,CACE,oBAAC,MAAM,OAAP;KAAa,GAAI;eAAa,YAAY,OAAO,cAAc;IAAe,CAAA,GAC7E,iBAAiB,cAAc,cAC9B,oBAAC,MAAM,aAAP;KAAmB,GAAI;eAAa;IAA8B,CAAA,CAEjE;;GACL,oBAAC,MAAM,WAAP,CAAkB,CAAA;EACR;;AAEhB,CAAC;AAED,gBAAgB,cAAc;AAE9B,IAAA,sBAAe,OAAO,OAAO,aAAa,EAAE,MAAM,gBAAgB,CAAC"}

package/docs/v1-to-v2-migration-guide.md

@@ -112,6 +112,27 @@ createBitkitToast({ variant: 'critical', titleText: 'Oops', messageText: 'Someth
 
 Key changes: `isOpen` → `open`, `onClose` → `onOpenChange` (receives `{ open: boolean }`).
 
+Other prop mappings:
+
+| v1 | v2 |
+|----|----|
+| `isClosable={false}` | `closable={false}` |
+| `onCloseComplete={fn}` | `onExitComplete={fn}` (fires when the close animation finishes) |
+
+`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.
+
+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`.
+
+```tsx
+// Acknowledge-only dialog
+<BitkitDialog closable={false} open={open} onOpenChange={…} title="Action required">…</BitkitDialog>
+
+// Run code after the close animation completes (e.g. navigation, focus restoration)
+<BitkitDialog open={open} onOpenChange={…} onExitComplete={() => navigate('/next')} title="…">
+  …
+</BitkitDialog>
+```
+
 ### Tabs
 
 The API changed fundamentally — from index-based to value-based:

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@bitrise/bitkit-v2",
   "private": false,
-  "version": "0.3.218",
+  "version": "0.3.220",
   "description": "Bitrise Design System Components built with Chakra UI V3",
   "keywords": [
     "react",