@bitrise/bitkit-v2 0.3.226 → 0.3.227

package/dist/components/BitkitSettingsCard/BitkitSettingsCard.js

@@ -1,3 +1,4 @@
+import { withSubComponents } from "../../utilities/withSubComponents.js";
 import { Box } from "@chakra-ui/react/box";
 import { useSlotRecipe } from "@chakra-ui/react/styled-system";
 import { Text } from "@chakra-ui/react/text";
@@ -76,7 +77,7 @@ var Footer = forwardRef((props, ref) => {
 	});
 });
 Footer.displayName = "BitkitSettingsCard.Footer";
-var BitkitSettingsCard_default = Object.assign(BitkitSettingsCard, {
+var BitkitSettingsCard_default = withSubComponents(BitkitSettingsCard, {
 	Content,
 	Footer,
 	Status

package/dist/components/BitkitSettingsCard/BitkitSettingsCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"BitkitSettingsCard.js","names":[],"sources":["../../../lib/components/BitkitSettingsCard/BitkitSettingsCard.tsx"],"sourcesContent":["import { Box, type BoxProps } from '@chakra-ui/react/box';\nimport { Card, type CardBodyProps, type CardFooterProps, type CardRootProps } from '@chakra-ui/react/card';\nimport { useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { Text } from '@chakra-ui/react/text';\nimport { forwardRef, type ReactNode } from 'react';\n\nimport { type BitkitIconComponent } from '../../icons';\n\nconst useSettingsCardStyles = () => {\n  const recipe = useSlotRecipe({ key: 'settingsCard' });\n  return recipe();\n};\n\n// --- Root ---\n\nexport interface BitkitSettingsCardProps extends Omit<CardRootProps, 'children'> {\n  children: ReactNode;\n}\n\nconst BitkitSettingsCard = forwardRef<HTMLDivElement, BitkitSettingsCardProps>((props, ref) => {\n  const { children, ...rest } = props;\n  const styles = useSettingsCardStyles();\n\n  return (\n    <Card.Root ref={ref} elevation={false} paddingSize=\"md\" css={styles.root} {...rest}>\n      {children}\n    </Card.Root>\n  );\n});\n\nBitkitSettingsCard.displayName = 'BitkitSettingsCard';\n\n// --- Content ---\n\nexport interface BitkitSettingsCardContentProps extends Omit<CardBodyProps, 'children'> {\n  actions?: ReactNode;\n  children: ReactNode;\n}\n\nconst Content = forwardRef<HTMLDivElement, BitkitSettingsCardContentProps>((props, ref) => {\n  const { actions, children, ...rest } = props;\n  const styles = useSettingsCardStyles();\n\n  return (\n    <Card.Body ref={ref} css={styles.content} {...rest}>\n      <Box css={styles.contentBody}>{children}</Box>\n      {actions && <Box css={styles.contentActions}>{actions}</Box>}\n    </Card.Body>\n  );\n});\n\nContent.displayName = 'BitkitSettingsCard.Content';\n\n// --- Status ---\n\nexport interface BitkitSettingsCardStatusProps extends Omit<BoxProps, 'children' | 'colorPalette'> {\n  description?: string;\n  helperText?: ReactNode;\n  icon: BitkitIconComponent;\n  iconColor?: string;\n  statusText: string;\n}\n\nconst Status = forwardRef<HTMLDivElement, BitkitSettingsCardStatusProps>((props, ref) => {\n  const { description, helperText, icon: Icon, iconColor, statusText, ...rest } = props;\n  const styles = useSettingsCardStyles();\n\n  return (\n    <Box ref={ref} role=\"status\" {...rest}>\n      <Box css={styles.statusRow}>\n        <Icon color={iconColor} css={styles.statusIcon} size=\"16\" />\n        <Box>\n          <Text as=\"strong\" css={styles.statusText}>\n            {statusText}\n          </Text>\n          {description && (\n            <Text as=\"p\" css={styles.statusDescription}>\n              {description}\n            </Text>\n          )}\n        </Box>\n      </Box>\n      {helperText && <Text css={styles.statusHelperText}>{helperText}</Text>}\n    </Box>\n  );\n});\n\nStatus.displayName = 'BitkitSettingsCard.Status';\n\n// --- Footer ---\n\nconst Footer = forwardRef<HTMLDivElement, CardFooterProps>((props, ref) => {\n  const styles = useSettingsCardStyles();\n  return <Card.Footer ref={ref} css={styles.footer} {...props} />;\n});\n\nFooter.displayName = 'BitkitSettingsCard.Footer';\n\n// --- Compound export ---\n\nexport default Object.assign(BitkitSettingsCard, {\n  Content,\n  Footer,\n  Status,\n});\n"],"mappings":";;;;;;;AAQA,IAAM,8BAA8B;CAElC,OADe,cAAc,EAAE,KAAK,eAAe,CAC5C,EAAO;AAChB;AAQA,IAAM,qBAAqB,YAAqD,OAAO,QAAQ;CAC7F,MAAM,EAAE,UAAU,GAAG,SAAS;CAC9B,MAAM,SAAS,sBAAsB;CAErC,OACE,oBAAC,KAAK,MAAN;EAAgB;EAAK,WAAW;EAAO,aAAY;EAAK,KAAK,OAAO;EAAM,GAAI;EAC3E;CACQ,CAAA;AAEf,CAAC;AAED,mBAAmB,cAAc;AASjC,IAAM,UAAU,YAA4D,OAAO,QAAQ;CACzF,MAAM,EAAE,SAAS,UAAU,GAAG,SAAS;CACvC,MAAM,SAAS,sBAAsB;CAErC,OACE,qBAAC,KAAK,MAAN;EAAgB;EAAK,KAAK,OAAO;EAAS,GAAI;YAA9C,CACE,oBAAC,KAAD;GAAK,KAAK,OAAO;GAAc;EAAc,CAAA,GAC5C,WAAW,oBAAC,KAAD;GAAK,KAAK,OAAO;aAAiB;EAAa,CAAA,CAClD;;AAEf,CAAC;AAED,QAAQ,cAAc;AAYtB,IAAM,SAAS,YAA2D,OAAO,QAAQ;CACvF,MAAM,EAAE,aAAa,YAAY,MAAM,MAAM,WAAW,YAAY,GAAG,SAAS;CAChF,MAAM,SAAS,sBAAsB;CAErC,OACE,qBAAC,KAAD;EAAU;EAAK,MAAK;EAAS,GAAI;YAAjC,CACE,qBAAC,KAAD;GAAK,KAAK,OAAO;aAAjB,CACE,oBAAC,MAAD;IAAM,OAAO;IAAW,KAAK,OAAO;IAAY,MAAK;GAAM,CAAA,GAC3D,qBAAC,KAAD,EAAA,UAAA,CACE,oBAAC,MAAD;IAAM,IAAG;IAAS,KAAK,OAAO;cAC3B;GACG,CAAA,GACL,eACC,oBAAC,MAAD;IAAM,IAAG;IAAI,KAAK,OAAO;cACtB;GACG,CAAA,CAEL,EAAA,CAAA,CACF;MACJ,cAAc,oBAAC,MAAD;GAAM,KAAK,OAAO;aAAmB;EAAiB,CAAA,CAClE;;AAET,CAAC;AAED,OAAO,cAAc;AAIrB,IAAM,SAAS,YAA6C,OAAO,QAAQ;CACzE,MAAM,SAAS,sBAAsB;CACrC,OAAO,oBAAC,KAAK,QAAN;EAAkB;EAAK,KAAK,OAAO;EAAQ,GAAI;CAAQ,CAAA;AAChE,CAAC;AAED,OAAO,cAAc;AAIrB,IAAA,6BAAe,OAAO,OAAO,oBAAoB;CAC/C;CACA;CACA;AACF,CAAC"}
+{"version":3,"file":"BitkitSettingsCard.js","names":[],"sources":["../../../lib/components/BitkitSettingsCard/BitkitSettingsCard.tsx"],"sourcesContent":["import { Box, type BoxProps } from '@chakra-ui/react/box';\nimport { Card, type CardBodyProps, type CardFooterProps, type CardRootProps } from '@chakra-ui/react/card';\nimport { useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { Text } from '@chakra-ui/react/text';\nimport { forwardRef, type ReactNode } from 'react';\n\nimport { type BitkitIconComponent } from '../../icons';\nimport { withSubComponents } from '../../utilities/withSubComponents';\n\nconst useSettingsCardStyles = () => {\n  const recipe = useSlotRecipe({ key: 'settingsCard' });\n  return recipe();\n};\n\n// --- Root ---\n\nexport interface BitkitSettingsCardProps extends Omit<CardRootProps, 'children'> {\n  children: ReactNode;\n}\n\nconst BitkitSettingsCard = forwardRef<HTMLDivElement, BitkitSettingsCardProps>((props, ref) => {\n  const { children, ...rest } = props;\n  const styles = useSettingsCardStyles();\n\n  return (\n    <Card.Root ref={ref} elevation={false} paddingSize=\"md\" css={styles.root} {...rest}>\n      {children}\n    </Card.Root>\n  );\n});\n\nBitkitSettingsCard.displayName = 'BitkitSettingsCard';\n\n// --- Content ---\n\nexport interface BitkitSettingsCardContentProps extends Omit<CardBodyProps, 'children'> {\n  actions?: ReactNode;\n  children: ReactNode;\n}\n\nconst Content = forwardRef<HTMLDivElement, BitkitSettingsCardContentProps>((props, ref) => {\n  const { actions, children, ...rest } = props;\n  const styles = useSettingsCardStyles();\n\n  return (\n    <Card.Body ref={ref} css={styles.content} {...rest}>\n      <Box css={styles.contentBody}>{children}</Box>\n      {actions && <Box css={styles.contentActions}>{actions}</Box>}\n    </Card.Body>\n  );\n});\n\nContent.displayName = 'BitkitSettingsCard.Content';\n\n// --- Status ---\n\nexport interface BitkitSettingsCardStatusProps extends Omit<BoxProps, 'children' | 'colorPalette'> {\n  description?: string;\n  helperText?: ReactNode;\n  icon: BitkitIconComponent;\n  iconColor?: string;\n  statusText: string;\n}\n\nconst Status = forwardRef<HTMLDivElement, BitkitSettingsCardStatusProps>((props, ref) => {\n  const { description, helperText, icon: Icon, iconColor, statusText, ...rest } = props;\n  const styles = useSettingsCardStyles();\n\n  return (\n    <Box ref={ref} role=\"status\" {...rest}>\n      <Box css={styles.statusRow}>\n        <Icon color={iconColor} css={styles.statusIcon} size=\"16\" />\n        <Box>\n          <Text as=\"strong\" css={styles.statusText}>\n            {statusText}\n          </Text>\n          {description && (\n            <Text as=\"p\" css={styles.statusDescription}>\n              {description}\n            </Text>\n          )}\n        </Box>\n      </Box>\n      {helperText && <Text css={styles.statusHelperText}>{helperText}</Text>}\n    </Box>\n  );\n});\n\nStatus.displayName = 'BitkitSettingsCard.Status';\n\n// --- Footer ---\n\nconst Footer = forwardRef<HTMLDivElement, CardFooterProps>((props, ref) => {\n  const styles = useSettingsCardStyles();\n  return <Card.Footer ref={ref} css={styles.footer} {...props} />;\n});\n\nFooter.displayName = 'BitkitSettingsCard.Footer';\n\n// --- Compound export ---\n\nexport default withSubComponents(BitkitSettingsCard, {\n  Content,\n  Footer,\n  Status,\n});\n"],"mappings":";;;;;;;;AASA,IAAM,8BAA8B;CAElC,OADe,cAAc,EAAE,KAAK,eAAe,CAC5C,EAAO;AAChB;AAQA,IAAM,qBAAqB,YAAqD,OAAO,QAAQ;CAC7F,MAAM,EAAE,UAAU,GAAG,SAAS;CAC9B,MAAM,SAAS,sBAAsB;CAErC,OACE,oBAAC,KAAK,MAAN;EAAgB;EAAK,WAAW;EAAO,aAAY;EAAK,KAAK,OAAO;EAAM,GAAI;EAC3E;CACQ,CAAA;AAEf,CAAC;AAED,mBAAmB,cAAc;AASjC,IAAM,UAAU,YAA4D,OAAO,QAAQ;CACzF,MAAM,EAAE,SAAS,UAAU,GAAG,SAAS;CACvC,MAAM,SAAS,sBAAsB;CAErC,OACE,qBAAC,KAAK,MAAN;EAAgB;EAAK,KAAK,OAAO;EAAS,GAAI;YAA9C,CACE,oBAAC,KAAD;GAAK,KAAK,OAAO;GAAc;EAAc,CAAA,GAC5C,WAAW,oBAAC,KAAD;GAAK,KAAK,OAAO;aAAiB;EAAa,CAAA,CAClD;;AAEf,CAAC;AAED,QAAQ,cAAc;AAYtB,IAAM,SAAS,YAA2D,OAAO,QAAQ;CACvF,MAAM,EAAE,aAAa,YAAY,MAAM,MAAM,WAAW,YAAY,GAAG,SAAS;CAChF,MAAM,SAAS,sBAAsB;CAErC,OACE,qBAAC,KAAD;EAAU;EAAK,MAAK;EAAS,GAAI;YAAjC,CACE,qBAAC,KAAD;GAAK,KAAK,OAAO;aAAjB,CACE,oBAAC,MAAD;IAAM,OAAO;IAAW,KAAK,OAAO;IAAY,MAAK;GAAM,CAAA,GAC3D,qBAAC,KAAD,EAAA,UAAA,CACE,oBAAC,MAAD;IAAM,IAAG;IAAS,KAAK,OAAO;cAC3B;GACG,CAAA,GACL,eACC,oBAAC,MAAD;IAAM,IAAG;IAAI,KAAK,OAAO;cACtB;GACG,CAAA,CAEL,EAAA,CAAA,CACF;MACJ,cAAc,oBAAC,MAAD;GAAM,KAAK,OAAO;aAAmB;EAAiB,CAAA,CAClE;;AAET,CAAC;AAED,OAAO,cAAc;AAIrB,IAAM,SAAS,YAA6C,OAAO,QAAQ;CACzE,MAAM,SAAS,sBAAsB;CACrC,OAAO,oBAAC,KAAK,QAAN;EAAkB;EAAK,KAAK,OAAO;EAAQ,GAAI;CAAQ,CAAA;AAChE,CAAC;AAED,OAAO,cAAc;AAIrB,IAAA,6BAAe,kBAAkB,oBAAoB;CACnD;CACA;CACA;AACF,CAAC"}

package/dist/components/BitkitSidebar/BitkitSidebar.js

@@ -1,5 +1,6 @@
 import IconChevronLeft from "../../icons/IconChevronLeft.js";
 import BitkitLabelTooltip from "../BitkitLabelTooltip/BitkitLabelTooltip.js";
+import { withSubComponents } from "../../utilities/withSubComponents.js";
 import BitkitGroupHeading from "../BitkitGroupHeading/BitkitGroupHeading.js";
 import { Box } from "@chakra-ui/react/box";
 import { chakra, useRecipe, useSlotRecipe } from "@chakra-ui/react/styled-system";
@@ -129,7 +130,7 @@ var BitkitSidebarDivider = forwardRef((_, ref) => {
 	});
 });
 BitkitSidebarDivider.displayName = "BitkitSidebarDivider";
-var BitkitSidebar_default = Object.assign(BitkitSidebar, {
+var BitkitSidebar_default = withSubComponents(BitkitSidebar, {
 	Divider: BitkitSidebarDivider,
 	Footer: BitkitSidebarFooter,
 	GroupHeading: BitkitSidebarGroupHeading,

package/dist/components/BitkitSidebar/BitkitSidebar.js.map

@@ -1 +1 @@
-{"version":3,"file":"BitkitSidebar.js","names":[],"sources":["../../../lib/components/BitkitSidebar/BitkitSidebar.tsx"],"sourcesContent":["import { Box, type BoxProps } from '@chakra-ui/react/box';\nimport { Separator } from '@chakra-ui/react/separator';\nimport { chakra, type HTMLChakraProps, useRecipe, useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { forwardRef, type ReactNode } from 'react';\n\nimport { type BitkitIconComponent } from '../../icons';\nimport IconChevronLeft from '../../icons/IconChevronLeft';\nimport BitkitGroupHeading, { type BitkitGroupHeadingProps } from '../BitkitGroupHeading/BitkitGroupHeading';\nimport BitkitLabelTooltip from '../BitkitLabelTooltip/BitkitLabelTooltip';\n\n// ----- BitkitSidebar (Root) -----\n\nexport interface BitkitSidebarProps extends BoxProps {\n  children: ReactNode;\n}\n\nconst BitkitSidebar = forwardRef<HTMLElement, BitkitSidebarProps>((props, ref) => {\n  const { children, ...rest } = props;\n\n  const recipe = useSlotRecipe({ key: 'sidebar' });\n  const styles = recipe();\n\n  return (\n    <Box ref={ref} asChild css={styles.root} {...rest}>\n      <nav>{children}</nav>\n    </Box>\n  );\n});\n\nBitkitSidebar.displayName = 'BitkitSidebar';\n\n// ----- BitkitSidebar.Item -----\n\ninterface BitkitSidebarItemCommonProps {\n  badge?: ReactNode;\n  children: ReactNode;\n  icon?: BitkitIconComponent;\n  selected?: boolean;\n  suffixIcon?: BitkitIconComponent;\n}\n\ninterface BitkitSidebarItemLinkProps extends Omit<HTMLChakraProps<'a'>, 'children'>, BitkitSidebarItemCommonProps {\n  href: string;\n}\n\ninterface BitkitSidebarItemButtonProps\n  extends Omit<HTMLChakraProps<'button'>, 'children'>, BitkitSidebarItemCommonProps {\n  href?: never;\n}\n\nexport type BitkitSidebarItemProps = BitkitSidebarItemButtonProps | BitkitSidebarItemLinkProps;\n\nconst BitkitSidebarItem = forwardRef<HTMLButtonElement & HTMLAnchorElement, BitkitSidebarItemProps>((props, ref) => {\n  const { badge, children, icon: Icon, selected, suffixIcon: SuffixIcon, ...rest } = props;\n\n  const recipe = useSlotRecipe({ key: 'sidebar' });\n  const styles = recipe({ selected });\n\n  const itemContent = (\n    <>\n      {Icon && <Icon css={styles.itemIcon} size=\"24\" />}\n      <chakra.span css={styles.itemLabel}>{children}</chakra.span>\n      {badge}\n      {SuffixIcon && <SuffixIcon css={styles.suffixIcon} size=\"24\" />}\n      <chakra.div css={styles.selectionMarker} />\n    </>\n  );\n\n  if (rest.href !== undefined) {\n    const { className, ...linkRest } = rest;\n    return (\n      <chakra.a\n        ref={ref}\n        {...linkRest}\n        aria-current={selected ? 'page' : undefined}\n        className={className ? `group ${className}` : 'group'}\n        css={styles.item}\n      >\n        {itemContent}\n      </chakra.a>\n    );\n  }\n\n  const { className, href: _, ...buttonRest } = rest;\n  return (\n    <chakra.button\n      ref={ref}\n      {...buttonRest}\n      aria-pressed={selected}\n      className={className ? `group ${className}` : 'group'}\n      css={styles.item}\n      type=\"button\"\n    >\n      {itemContent}\n    </chakra.button>\n  );\n});\n\nBitkitSidebarItem.displayName = 'BitkitSidebarItem';\n\n// ----- BitkitSidebar.Title -----\n\nexport interface BitkitSidebarTitleProps extends BoxProps {\n  backHref?: string;\n  backLabel?: string;\n  children: ReactNode;\n  onBackClick?: () => void;\n}\n\nconst BitkitSidebarTitle = forwardRef<HTMLDivElement, BitkitSidebarTitleProps>((props, ref) => {\n  const { backHref, backLabel = 'Back', children, onBackClick, ...rest } = props;\n\n  const recipe = useSlotRecipe({ key: 'sidebar' });\n  const styles = recipe();\n  const controlButtonRecipe = useRecipe({ key: 'controlButton' });\n\n  const hasBack = !!backHref || !!onBackClick;\n\n  const BackElement = onBackClick ? chakra.button : chakra.a;\n\n  return (\n    <Box ref={ref} css={hasBack ? styles.titleWithBack : styles.title} {...rest}>\n      {hasBack && (\n        <BitkitLabelTooltip text={backLabel}>\n          <BackElement\n            aria-label={backLabel}\n            css={controlButtonRecipe({ size: 'sm' })}\n            {...(onBackClick ? { onClick: onBackClick, type: 'button' as const } : { href: backHref })}\n          >\n            <IconChevronLeft size=\"24\" />\n          </BackElement>\n        </BitkitLabelTooltip>\n      )}\n      {children}\n    </Box>\n  );\n});\n\nBitkitSidebarTitle.displayName = 'BitkitSidebarTitle';\n\n// ----- BitkitSidebar.Footer -----\n\nexport interface BitkitSidebarFooterProps extends BoxProps {\n  children: ReactNode;\n}\n\nconst BitkitSidebarFooter = forwardRef<HTMLDivElement, BitkitSidebarFooterProps>((props, ref) => {\n  const { children, ...rest } = props;\n\n  const recipe = useSlotRecipe({ key: 'sidebar' });\n  const styles = recipe();\n\n  return (\n    <Box ref={ref} css={styles.footer} {...rest}>\n      {children}\n    </Box>\n  );\n});\n\nBitkitSidebarFooter.displayName = 'BitkitSidebarFooter';\n\n// ----- BitkitSidebar.Project -----\n\nexport interface BitkitSidebarProjectProps extends BoxProps {\n  label: string;\n  value: string;\n}\n\nconst BitkitSidebarProject = forwardRef<HTMLDivElement, BitkitSidebarProjectProps>((props, ref) => {\n  const { label, value, ...rest } = props;\n\n  const recipe = useSlotRecipe({ key: 'sidebar' });\n  const styles = recipe();\n\n  return (\n    <Box ref={ref} css={styles.project} {...rest}>\n      <chakra.span css={styles.projectLabel}>{label}</chakra.span>\n      <chakra.span css={styles.projectValue}>{value}</chakra.span>\n    </Box>\n  );\n});\n\nBitkitSidebarProject.displayName = 'BitkitSidebarProject';\n\n// ----- BitkitSidebar.GroupHeading -----\n\nexport type BitkitSidebarGroupHeadingProps = BitkitGroupHeadingProps;\n\nconst BitkitSidebarGroupHeading = forwardRef<HTMLDivElement, BitkitSidebarGroupHeadingProps>((props, ref) => {\n  return <BitkitGroupHeading ref={ref} paddingBlockEnd=\"12\" paddingBlockStart=\"24\" paddingInline=\"32\" {...props} />;\n});\n\nBitkitSidebarGroupHeading.displayName = 'BitkitSidebarGroupHeading';\n\n// ----- BitkitSidebar.Divider -----\n\nconst BitkitSidebarDivider = forwardRef<HTMLDivElement>((_, ref) => {\n  const recipe = useSlotRecipe({ key: 'sidebar' });\n  const styles = recipe();\n\n  return <Separator ref={ref} css={styles.divider} />;\n});\n\nBitkitSidebarDivider.displayName = 'BitkitSidebarDivider';\n\nexport default Object.assign(BitkitSidebar, {\n  Divider: BitkitSidebarDivider,\n  Footer: BitkitSidebarFooter,\n  GroupHeading: BitkitSidebarGroupHeading,\n  Item: BitkitSidebarItem,\n  Project: BitkitSidebarProject,\n  Title: BitkitSidebarTitle,\n});\n"],"mappings":"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"}
+{"version":3,"file":"BitkitSidebar.js","names":[],"sources":["../../../lib/components/BitkitSidebar/BitkitSidebar.tsx"],"sourcesContent":["import { Box, type BoxProps } from '@chakra-ui/react/box';\nimport { Separator } from '@chakra-ui/react/separator';\nimport { chakra, type HTMLChakraProps, useRecipe, useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { forwardRef, type ReactNode } from 'react';\n\nimport { type BitkitIconComponent } from '../../icons';\nimport IconChevronLeft from '../../icons/IconChevronLeft';\nimport { withSubComponents } from '../../utilities/withSubComponents';\nimport BitkitGroupHeading, { type BitkitGroupHeadingProps } from '../BitkitGroupHeading/BitkitGroupHeading';\nimport BitkitLabelTooltip from '../BitkitLabelTooltip/BitkitLabelTooltip';\n\n// ----- BitkitSidebar (Root) -----\n\nexport interface BitkitSidebarProps extends BoxProps {\n  children: ReactNode;\n}\n\nconst BitkitSidebar = forwardRef<HTMLElement, BitkitSidebarProps>((props, ref) => {\n  const { children, ...rest } = props;\n\n  const recipe = useSlotRecipe({ key: 'sidebar' });\n  const styles = recipe();\n\n  return (\n    <Box ref={ref} asChild css={styles.root} {...rest}>\n      <nav>{children}</nav>\n    </Box>\n  );\n});\n\nBitkitSidebar.displayName = 'BitkitSidebar';\n\n// ----- BitkitSidebar.Item -----\n\ninterface BitkitSidebarItemCommonProps {\n  badge?: ReactNode;\n  children: ReactNode;\n  icon?: BitkitIconComponent;\n  selected?: boolean;\n  suffixIcon?: BitkitIconComponent;\n}\n\ninterface BitkitSidebarItemLinkProps extends Omit<HTMLChakraProps<'a'>, 'children'>, BitkitSidebarItemCommonProps {\n  href: string;\n}\n\ninterface BitkitSidebarItemButtonProps\n  extends Omit<HTMLChakraProps<'button'>, 'children'>, BitkitSidebarItemCommonProps {\n  href?: never;\n}\n\nexport type BitkitSidebarItemProps = BitkitSidebarItemButtonProps | BitkitSidebarItemLinkProps;\n\nconst BitkitSidebarItem = forwardRef<HTMLButtonElement & HTMLAnchorElement, BitkitSidebarItemProps>((props, ref) => {\n  const { badge, children, icon: Icon, selected, suffixIcon: SuffixIcon, ...rest } = props;\n\n  const recipe = useSlotRecipe({ key: 'sidebar' });\n  const styles = recipe({ selected });\n\n  const itemContent = (\n    <>\n      {Icon && <Icon css={styles.itemIcon} size=\"24\" />}\n      <chakra.span css={styles.itemLabel}>{children}</chakra.span>\n      {badge}\n      {SuffixIcon && <SuffixIcon css={styles.suffixIcon} size=\"24\" />}\n      <chakra.div css={styles.selectionMarker} />\n    </>\n  );\n\n  if (rest.href !== undefined) {\n    const { className, ...linkRest } = rest;\n    return (\n      <chakra.a\n        ref={ref}\n        {...linkRest}\n        aria-current={selected ? 'page' : undefined}\n        className={className ? `group ${className}` : 'group'}\n        css={styles.item}\n      >\n        {itemContent}\n      </chakra.a>\n    );\n  }\n\n  const { className, href: _, ...buttonRest } = rest;\n  return (\n    <chakra.button\n      ref={ref}\n      {...buttonRest}\n      aria-pressed={selected}\n      className={className ? `group ${className}` : 'group'}\n      css={styles.item}\n      type=\"button\"\n    >\n      {itemContent}\n    </chakra.button>\n  );\n});\n\nBitkitSidebarItem.displayName = 'BitkitSidebarItem';\n\n// ----- BitkitSidebar.Title -----\n\nexport interface BitkitSidebarTitleProps extends BoxProps {\n  backHref?: string;\n  backLabel?: string;\n  children: ReactNode;\n  onBackClick?: () => void;\n}\n\nconst BitkitSidebarTitle = forwardRef<HTMLDivElement, BitkitSidebarTitleProps>((props, ref) => {\n  const { backHref, backLabel = 'Back', children, onBackClick, ...rest } = props;\n\n  const recipe = useSlotRecipe({ key: 'sidebar' });\n  const styles = recipe();\n  const controlButtonRecipe = useRecipe({ key: 'controlButton' });\n\n  const hasBack = !!backHref || !!onBackClick;\n\n  const BackElement = onBackClick ? chakra.button : chakra.a;\n\n  return (\n    <Box ref={ref} css={hasBack ? styles.titleWithBack : styles.title} {...rest}>\n      {hasBack && (\n        <BitkitLabelTooltip text={backLabel}>\n          <BackElement\n            aria-label={backLabel}\n            css={controlButtonRecipe({ size: 'sm' })}\n            {...(onBackClick ? { onClick: onBackClick, type: 'button' as const } : { href: backHref })}\n          >\n            <IconChevronLeft size=\"24\" />\n          </BackElement>\n        </BitkitLabelTooltip>\n      )}\n      {children}\n    </Box>\n  );\n});\n\nBitkitSidebarTitle.displayName = 'BitkitSidebarTitle';\n\n// ----- BitkitSidebar.Footer -----\n\nexport interface BitkitSidebarFooterProps extends BoxProps {\n  children: ReactNode;\n}\n\nconst BitkitSidebarFooter = forwardRef<HTMLDivElement, BitkitSidebarFooterProps>((props, ref) => {\n  const { children, ...rest } = props;\n\n  const recipe = useSlotRecipe({ key: 'sidebar' });\n  const styles = recipe();\n\n  return (\n    <Box ref={ref} css={styles.footer} {...rest}>\n      {children}\n    </Box>\n  );\n});\n\nBitkitSidebarFooter.displayName = 'BitkitSidebarFooter';\n\n// ----- BitkitSidebar.Project -----\n\nexport interface BitkitSidebarProjectProps extends BoxProps {\n  label: string;\n  value: string;\n}\n\nconst BitkitSidebarProject = forwardRef<HTMLDivElement, BitkitSidebarProjectProps>((props, ref) => {\n  const { label, value, ...rest } = props;\n\n  const recipe = useSlotRecipe({ key: 'sidebar' });\n  const styles = recipe();\n\n  return (\n    <Box ref={ref} css={styles.project} {...rest}>\n      <chakra.span css={styles.projectLabel}>{label}</chakra.span>\n      <chakra.span css={styles.projectValue}>{value}</chakra.span>\n    </Box>\n  );\n});\n\nBitkitSidebarProject.displayName = 'BitkitSidebarProject';\n\n// ----- BitkitSidebar.GroupHeading -----\n\nexport type BitkitSidebarGroupHeadingProps = BitkitGroupHeadingProps;\n\nconst BitkitSidebarGroupHeading = forwardRef<HTMLDivElement, BitkitSidebarGroupHeadingProps>((props, ref) => {\n  return <BitkitGroupHeading ref={ref} paddingBlockEnd=\"12\" paddingBlockStart=\"24\" paddingInline=\"32\" {...props} />;\n});\n\nBitkitSidebarGroupHeading.displayName = 'BitkitSidebarGroupHeading';\n\n// ----- BitkitSidebar.Divider -----\n\nconst BitkitSidebarDivider = forwardRef<HTMLDivElement>((_, ref) => {\n  const recipe = useSlotRecipe({ key: 'sidebar' });\n  const styles = recipe();\n\n  return <Separator ref={ref} css={styles.divider} />;\n});\n\nBitkitSidebarDivider.displayName = 'BitkitSidebarDivider';\n\nexport default withSubComponents(BitkitSidebar, {\n  Divider: BitkitSidebarDivider,\n  Footer: BitkitSidebarFooter,\n  GroupHeading: BitkitSidebarGroupHeading,\n  Item: BitkitSidebarItem,\n  Project: BitkitSidebarProject,\n  Title: BitkitSidebarTitle,\n});\n"],"mappings":"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"}

package/dist/components/BitkitSplitButton/BitkitSplitButton.js

@@ -1,5 +1,6 @@
 import IconChevronDown from "../../icons/IconChevronDown.js";
 import BitkitActionMenu from "../BitkitActionMenu/BitkitActionMenu.js";
+import { withSubComponents } from "../../utilities/withSubComponents.js";
 import BitkitButton from "../BitkitButton/BitkitButton.js";
 import BitkitIconButton from "../BitkitIconButton/BitkitIconButton.js";
 import { useSlotRecipe } from "@chakra-ui/react/styled-system";
@@ -80,7 +81,7 @@ var BitkitSplitButton = forwardRef((props, ref) => {
 	});
 });
 BitkitSplitButton.displayName = "BitkitSplitButton";
-var BitkitSplitButton_default = Object.assign(BitkitSplitButton, {
+var BitkitSplitButton_default = withSubComponents(BitkitSplitButton, {
 	Action: BitkitSplitButtonAction,
 	Group: BitkitActionMenu.Group,
 	Item: BitkitActionMenu.Item,

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, 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, {\n  type BitkitButtonAsAnchorProps,\n  type BitkitButtonAsButtonProps,\n} 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 ---\n// Split-button action can be a button (default) or anchor (when href is set). asChild is intentionally\n// not part of the API — routing-library elements don't fit cleanly into the Group attached layout.\n// The forwarded ref is HTMLElement so it covers both <button> and <a>.\ntype BitkitSplitButtonActionProps = Omit<\n  BitkitButtonAsButtonProps | BitkitButtonAsAnchorProps,\n  'size' | 'variant' | 'state'\n>;\n\nconst BitkitSplitButtonAction = forwardRef<HTMLElement, BitkitSplitButtonActionProps>((props, ref) => {\n  const { size, state, styles, variant } = useSplitButtonContext();\n\n  if (props.href !== undefined) {\n    // Anchor branch: BitkitButton's anchor variant doesn't allow state=\"loading\". Coerce to \"disabled\"\n    // so a SplitButton-wide loading state still surfaces visually on a link-mode action.\n    return (\n      <BitkitButton\n        {...(props as BitkitButtonAsAnchorProps)}\n        css={styles.action}\n        ref={ref}\n        size={size}\n        state={state === 'loading' ? 'disabled' : state}\n        variant={variant}\n      />\n    );\n  }\n\n  return (\n    <BitkitButton\n      {...(props as BitkitButtonAsButtonProps)}\n      css={styles.action}\n      ref={ref}\n      size={size}\n      state={state}\n      variant={variant}\n    />\n  );\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":";;;;;;;;;;;AAmBA,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;AAWD,IAAM,0BAA0B,YAAuD,OAAO,QAAQ;CACpG,MAAM,EAAE,MAAM,OAAO,QAAQ,YAAY,sBAAsB;CAE/D,IAAI,MAAM,SAAS,KAAA,GAGjB,OACE,oBAAC,cAAD;EACE,GAAK;EACL,KAAK,OAAO;EACP;EACC;EACN,OAAO,UAAU,YAAY,aAAa;EACjC;CACV,CAAA;CAIL,OACE,oBAAC,cAAD;EACE,GAAK;EACL,KAAK,OAAO;EACP;EACC;EACC;EACE;CACV,CAAA;AAEL,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"}
+{"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 { withSubComponents } from '../../utilities/withSubComponents';\nimport BitkitActionMenu from '../BitkitActionMenu/BitkitActionMenu';\nimport BitkitButton, {\n  type BitkitButtonAsAnchorProps,\n  type BitkitButtonAsButtonProps,\n} 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 ---\n// Split-button action can be a button (default) or anchor (when href is set). asChild is intentionally\n// not part of the API — routing-library elements don't fit cleanly into the Group attached layout.\n// The forwarded ref is HTMLElement so it covers both <button> and <a>.\ntype BitkitSplitButtonActionProps = Omit<\n  BitkitButtonAsButtonProps | BitkitButtonAsAnchorProps,\n  'size' | 'variant' | 'state'\n>;\n\nconst BitkitSplitButtonAction = forwardRef<HTMLElement, BitkitSplitButtonActionProps>((props, ref) => {\n  const { size, state, styles, variant } = useSplitButtonContext();\n\n  if (props.href !== undefined) {\n    // Anchor branch: BitkitButton's anchor variant doesn't allow state=\"loading\". Coerce to \"disabled\"\n    // so a SplitButton-wide loading state still surfaces visually on a link-mode action.\n    return (\n      <BitkitButton\n        {...(props as BitkitButtonAsAnchorProps)}\n        css={styles.action}\n        ref={ref}\n        size={size}\n        state={state === 'loading' ? 'disabled' : state}\n        variant={variant}\n      />\n    );\n  }\n\n  return (\n    <BitkitButton\n      {...(props as BitkitButtonAsButtonProps)}\n      css={styles.action}\n      ref={ref}\n      size={size}\n      state={state}\n      variant={variant}\n    />\n  );\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 withSubComponents(BitkitSplitButton, {\n  Action: BitkitSplitButtonAction,\n  Group: BitkitActionMenu.Group,\n  Item: BitkitActionMenu.Item,\n  Separator: BitkitActionMenu.Separator,\n});\n"],"mappings":";;;;;;;;;;;;AAoBA,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;AAWD,IAAM,0BAA0B,YAAuD,OAAO,QAAQ;CACpG,MAAM,EAAE,MAAM,OAAO,QAAQ,YAAY,sBAAsB;CAE/D,IAAI,MAAM,SAAS,KAAA,GAGjB,OACE,oBAAC,cAAD;EACE,GAAK;EACL,KAAK,OAAO;EACP;EACC;EACN,OAAO,UAAU,YAAY,aAAa;EACjC;CACV,CAAA;CAIL,OACE,oBAAC,cAAD;EACE,GAAK;EACL,KAAK,OAAO;EACP;EACC;EACC;EACE;CACV,CAAA;AAEL,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,kBAAkB,mBAAmB;CAClD,QAAQ;CACR,OAAO,iBAAiB;CACxB,MAAM,iBAAiB;CACvB,WAAW,iBAAiB;AAC9B,CAAC"}

package/dist/components/BitkitSteps/BitkitSteps.js

@@ -1,5 +1,6 @@
 import IconCheck from "../../icons/IconCheck.js";
 import IconSkip from "../../icons/IconSkip.js";
+import { withSubComponents } from "../../utilities/withSubComponents.js";
 import { useStepCardContext } from "../BitkitStepsCard/StepCardContext.js";
 import { Box } from "@chakra-ui/react/box";
 import { Children, cloneElement, forwardRef, isValidElement } from "react";
@@ -91,7 +92,7 @@ var BitkitStepsItem = forwardRef((props, ref) => {
 	});
 });
 BitkitStepsItem.displayName = "BitkitStepsItem";
-var BitkitSteps_default = Object.assign(BitkitSteps, { Item: BitkitStepsItem });
+var BitkitSteps_default = withSubComponents(BitkitSteps, { Item: BitkitStepsItem });
 //#endregion
 export { BitkitSteps_default as default };
 

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, 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"}
+{"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 { withSubComponents } from '../../utilities/withSubComponents';\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 withSubComponents(BitkitSteps, { Item: BitkitStepsItem });\n"],"mappings":";;;;;;;;;;AAcA,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,kBAAkB,aAAa,EAAE,MAAM,gBAAgB,CAAC"}

package/dist/components/BitkitStepsCard/BitkitStepsCard.js

@@ -1,3 +1,4 @@
+import { withSubComponents } from "../../utilities/withSubComponents.js";
 import { StepCardProvider, useStepCardContext } from "./StepCardContext.js";
 import { chakra, useSlotRecipe } from "@chakra-ui/react/styled-system";
 import { Children, cloneElement, forwardRef, isValidElement } from "react";
@@ -75,7 +76,7 @@ var BitkitStepsCardFooter = forwardRef((props, ref) => {
 	});
 });
 BitkitStepsCardFooter.displayName = "BitkitStepsCardFooter";
-var BitkitStepsCard_default = Object.assign(BitkitStepsCard, {
+var BitkitStepsCard_default = withSubComponents(BitkitStepsCard, {
 	Body: BitkitStepsCardBody,
 	Footer: BitkitStepsCardFooter,
 	Header: BitkitStepsCardHeader,

package/dist/components/BitkitStepsCard/BitkitStepsCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"BitkitStepsCard.js","names":[],"sources":["../../../lib/components/BitkitStepsCard/BitkitStepsCard.tsx"],"sourcesContent":["import {\n  Card,\n  type CardBodyProps,\n  type CardFooterProps,\n  type CardHeaderProps,\n  type CardRootProps,\n} from '@chakra-ui/react/card';\nimport { chakra, useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { Children, cloneElement, forwardRef, isValidElement, type ReactElement, type ReactNode } from 'react';\n\nimport { StepCardProvider, useStepCardContext } from './StepCardContext';\n\nconst useStepsCardStyles = () => {\n  const recipe = useSlotRecipe({ key: 'stepsCard' });\n  return recipe();\n};\n\nexport interface BitkitStepsCardProps extends Omit<CardRootProps, 'children' | 'title'> {\n  children: ReactNode;\n  step: number;\n}\n\nconst BitkitStepsCard = forwardRef<HTMLDivElement, BitkitStepsCardProps>((props, ref) => {\n  const { children, step, ...rest } = props;\n  const styles = useStepsCardStyles();\n\n  return (\n    <StepCardProvider value={{ step }}>\n      <Card.Root ref={ref} css={styles.root} unstyled {...rest}>\n        {children}\n      </Card.Root>\n    </StepCardProvider>\n  );\n});\n\nBitkitStepsCard.displayName = 'BitkitStepsCard';\n\nexport interface BitkitStepsCardHeaderProps extends Omit<CardHeaderProps, 'children'> {\n  children: ReactNode;\n}\n\nconst BitkitStepsCardHeader = forwardRef<HTMLDivElement, BitkitStepsCardHeaderProps>((props, ref) => {\n  const { children, ...rest } = props;\n  const styles = useStepsCardStyles();\n\n  return (\n    <Card.Header ref={ref} css={styles.header} {...rest}>\n      {children}\n    </Card.Header>\n  );\n});\n\nBitkitStepsCardHeader.displayName = 'BitkitStepsCardHeader';\n\nexport interface BitkitStepsCardBodyProps extends Omit<CardBodyProps, 'children'> {\n  children: ReactNode;\n}\n\nconst BitkitStepsCardBody = forwardRef<HTMLDivElement, BitkitStepsCardBodyProps>((props, ref) => {\n  const { children, ...rest } = props;\n  const styles = useStepsCardStyles();\n\n  return (\n    <Card.Body ref={ref} css={styles.body} {...rest}>\n      {Children.map(children, (child, index) => {\n        if (isValidElement(child)) {\n          return cloneElement(child as ReactElement<{ _index?: number }>, { _index: index });\n        }\n        return child;\n      })}\n    </Card.Body>\n  );\n});\n\nBitkitStepsCardBody.displayName = 'BitkitStepsCardBody';\n\nexport interface BitkitStepsCardStepProps {\n  children?: ReactNode;\n  description?: string;\n  title: string;\n}\n\ninterface BitkitStepsCardStepInternalProps extends BitkitStepsCardStepProps {\n  _index?: number;\n}\n\nconst BitkitStepsCardStep = (props: BitkitStepsCardStepProps) => {\n  const { _index = 0, children, description, title } = props as BitkitStepsCardStepInternalProps;\n  const { step } = useStepCardContext() ?? { step: 0 };\n  const styles = useStepsCardStyles();\n\n  if (_index !== step) return null;\n\n  return (\n    <>\n      <chakra.div css={styles.titleGroup}>\n        <Card.Title css={styles.title}>{title}</Card.Title>\n        {description && <Card.Description css={styles.description}>{description}</Card.Description>}\n      </chakra.div>\n      {children}\n    </>\n  );\n};\n\nBitkitStepsCardStep.displayName = 'BitkitStepsCardStep';\n\nexport interface BitkitStepsCardFooterProps extends Omit<CardFooterProps, 'children'> {\n  children: ReactNode;\n}\n\nconst BitkitStepsCardFooter = forwardRef<HTMLDivElement, BitkitStepsCardFooterProps>((props, ref) => {\n  const { children, ...rest } = props;\n  const styles = useStepsCardStyles();\n\n  return (\n    <Card.Footer ref={ref} css={styles.footer} {...rest}>\n      {children}\n    </Card.Footer>\n  );\n});\n\nBitkitStepsCardFooter.displayName = 'BitkitStepsCardFooter';\n\nexport default Object.assign(BitkitStepsCard, {\n  Body: BitkitStepsCardBody,\n  Footer: BitkitStepsCardFooter,\n  Header: BitkitStepsCardHeader,\n  Step: BitkitStepsCardStep,\n});\n"],"mappings":";;;;;;AAYA,IAAM,2BAA2B;CAE/B,OADe,cAAc,EAAE,KAAK,YAAY,CACzC,EAAO;AAChB;AAOA,IAAM,kBAAkB,YAAkD,OAAO,QAAQ;CACvF,MAAM,EAAE,UAAU,MAAM,GAAG,SAAS;CACpC,MAAM,SAAS,mBAAmB;CAElC,OACE,oBAAC,kBAAD;EAAkB,OAAO,EAAE,KAAK;YAC9B,oBAAC,KAAK,MAAN;GAAgB;GAAK,KAAK,OAAO;GAAM,UAAA;GAAS,GAAI;GACjD;EACQ,CAAA;CACK,CAAA;AAEtB,CAAC;AAED,gBAAgB,cAAc;AAM9B,IAAM,wBAAwB,YAAwD,OAAO,QAAQ;CACnG,MAAM,EAAE,UAAU,GAAG,SAAS;CAC9B,MAAM,SAAS,mBAAmB;CAElC,OACE,oBAAC,KAAK,QAAN;EAAkB;EAAK,KAAK,OAAO;EAAQ,GAAI;EAC5C;CACU,CAAA;AAEjB,CAAC;AAED,sBAAsB,cAAc;AAMpC,IAAM,sBAAsB,YAAsD,OAAO,QAAQ;CAC/F,MAAM,EAAE,UAAU,GAAG,SAAS;CAC9B,MAAM,SAAS,mBAAmB;CAElC,OACE,oBAAC,KAAK,MAAN;EAAgB;EAAK,KAAK,OAAO;EAAM,GAAI;YACxC,SAAS,IAAI,WAAW,OAAO,UAAU;GACxC,IAAI,eAAe,KAAK,GACtB,OAAO,aAAa,OAA4C,EAAE,QAAQ,MAAM,CAAC;GAEnF,OAAO;EACT,CAAC;CACQ,CAAA;AAEf,CAAC;AAED,oBAAoB,cAAc;AAYlC,IAAM,uBAAuB,UAAoC;CAC/D,MAAM,EAAE,SAAS,GAAG,UAAU,aAAa,UAAU;CACrD,MAAM,EAAE,SAAS,mBAAmB,KAAK,EAAE,MAAM,EAAE;CACnD,MAAM,SAAS,mBAAmB;CAElC,IAAI,WAAW,MAAM,OAAO;CAE5B,OACE,qBAAA,YAAA,EAAA,UAAA,CACE,qBAAC,OAAO,KAAR;EAAY,KAAK,OAAO;YAAxB,CACE,oBAAC,KAAK,OAAN;GAAY,KAAK,OAAO;aAAQ;EAAkB,CAAA,GACjD,eAAe,oBAAC,KAAK,aAAN;GAAkB,KAAK,OAAO;aAAc;EAA8B,CAAA,CAChF;KACX,QACD,EAAA,CAAA;AAEN;AAEA,oBAAoB,cAAc;AAMlC,IAAM,wBAAwB,YAAwD,OAAO,QAAQ;CACnG,MAAM,EAAE,UAAU,GAAG,SAAS;CAC9B,MAAM,SAAS,mBAAmB;CAElC,OACE,oBAAC,KAAK,QAAN;EAAkB;EAAK,KAAK,OAAO;EAAQ,GAAI;EAC5C;CACU,CAAA;AAEjB,CAAC;AAED,sBAAsB,cAAc;AAEpC,IAAA,0BAAe,OAAO,OAAO,iBAAiB;CAC5C,MAAM;CACN,QAAQ;CACR,QAAQ;CACR,MAAM;AACR,CAAC"}
+{"version":3,"file":"BitkitStepsCard.js","names":[],"sources":["../../../lib/components/BitkitStepsCard/BitkitStepsCard.tsx"],"sourcesContent":["import {\n  Card,\n  type CardBodyProps,\n  type CardFooterProps,\n  type CardHeaderProps,\n  type CardRootProps,\n} from '@chakra-ui/react/card';\nimport { chakra, useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { Children, cloneElement, forwardRef, isValidElement, type ReactElement, type ReactNode } from 'react';\n\nimport { withSubComponents } from '../../utilities/withSubComponents';\nimport { StepCardProvider, useStepCardContext } from './StepCardContext';\n\nconst useStepsCardStyles = () => {\n  const recipe = useSlotRecipe({ key: 'stepsCard' });\n  return recipe();\n};\n\nexport interface BitkitStepsCardProps extends Omit<CardRootProps, 'children' | 'title'> {\n  children: ReactNode;\n  step: number;\n}\n\nconst BitkitStepsCard = forwardRef<HTMLDivElement, BitkitStepsCardProps>((props, ref) => {\n  const { children, step, ...rest } = props;\n  const styles = useStepsCardStyles();\n\n  return (\n    <StepCardProvider value={{ step }}>\n      <Card.Root ref={ref} css={styles.root} unstyled {...rest}>\n        {children}\n      </Card.Root>\n    </StepCardProvider>\n  );\n});\n\nBitkitStepsCard.displayName = 'BitkitStepsCard';\n\nexport interface BitkitStepsCardHeaderProps extends Omit<CardHeaderProps, 'children'> {\n  children: ReactNode;\n}\n\nconst BitkitStepsCardHeader = forwardRef<HTMLDivElement, BitkitStepsCardHeaderProps>((props, ref) => {\n  const { children, ...rest } = props;\n  const styles = useStepsCardStyles();\n\n  return (\n    <Card.Header ref={ref} css={styles.header} {...rest}>\n      {children}\n    </Card.Header>\n  );\n});\n\nBitkitStepsCardHeader.displayName = 'BitkitStepsCardHeader';\n\nexport interface BitkitStepsCardBodyProps extends Omit<CardBodyProps, 'children'> {\n  children: ReactNode;\n}\n\nconst BitkitStepsCardBody = forwardRef<HTMLDivElement, BitkitStepsCardBodyProps>((props, ref) => {\n  const { children, ...rest } = props;\n  const styles = useStepsCardStyles();\n\n  return (\n    <Card.Body ref={ref} css={styles.body} {...rest}>\n      {Children.map(children, (child, index) => {\n        if (isValidElement(child)) {\n          return cloneElement(child as ReactElement<{ _index?: number }>, { _index: index });\n        }\n        return child;\n      })}\n    </Card.Body>\n  );\n});\n\nBitkitStepsCardBody.displayName = 'BitkitStepsCardBody';\n\nexport interface BitkitStepsCardStepProps {\n  children?: ReactNode;\n  description?: string;\n  title: string;\n}\n\ninterface BitkitStepsCardStepInternalProps extends BitkitStepsCardStepProps {\n  _index?: number;\n}\n\nconst BitkitStepsCardStep = (props: BitkitStepsCardStepProps) => {\n  const { _index = 0, children, description, title } = props as BitkitStepsCardStepInternalProps;\n  const { step } = useStepCardContext() ?? { step: 0 };\n  const styles = useStepsCardStyles();\n\n  if (_index !== step) return null;\n\n  return (\n    <>\n      <chakra.div css={styles.titleGroup}>\n        <Card.Title css={styles.title}>{title}</Card.Title>\n        {description && <Card.Description css={styles.description}>{description}</Card.Description>}\n      </chakra.div>\n      {children}\n    </>\n  );\n};\n\nBitkitStepsCardStep.displayName = 'BitkitStepsCardStep';\n\nexport interface BitkitStepsCardFooterProps extends Omit<CardFooterProps, 'children'> {\n  children: ReactNode;\n}\n\nconst BitkitStepsCardFooter = forwardRef<HTMLDivElement, BitkitStepsCardFooterProps>((props, ref) => {\n  const { children, ...rest } = props;\n  const styles = useStepsCardStyles();\n\n  return (\n    <Card.Footer ref={ref} css={styles.footer} {...rest}>\n      {children}\n    </Card.Footer>\n  );\n});\n\nBitkitStepsCardFooter.displayName = 'BitkitStepsCardFooter';\n\nexport default withSubComponents(BitkitStepsCard, {\n  Body: BitkitStepsCardBody,\n  Footer: BitkitStepsCardFooter,\n  Header: BitkitStepsCardHeader,\n  Step: BitkitStepsCardStep,\n});\n"],"mappings":";;;;;;;AAaA,IAAM,2BAA2B;CAE/B,OADe,cAAc,EAAE,KAAK,YAAY,CACzC,EAAO;AAChB;AAOA,IAAM,kBAAkB,YAAkD,OAAO,QAAQ;CACvF,MAAM,EAAE,UAAU,MAAM,GAAG,SAAS;CACpC,MAAM,SAAS,mBAAmB;CAElC,OACE,oBAAC,kBAAD;EAAkB,OAAO,EAAE,KAAK;YAC9B,oBAAC,KAAK,MAAN;GAAgB;GAAK,KAAK,OAAO;GAAM,UAAA;GAAS,GAAI;GACjD;EACQ,CAAA;CACK,CAAA;AAEtB,CAAC;AAED,gBAAgB,cAAc;AAM9B,IAAM,wBAAwB,YAAwD,OAAO,QAAQ;CACnG,MAAM,EAAE,UAAU,GAAG,SAAS;CAC9B,MAAM,SAAS,mBAAmB;CAElC,OACE,oBAAC,KAAK,QAAN;EAAkB;EAAK,KAAK,OAAO;EAAQ,GAAI;EAC5C;CACU,CAAA;AAEjB,CAAC;AAED,sBAAsB,cAAc;AAMpC,IAAM,sBAAsB,YAAsD,OAAO,QAAQ;CAC/F,MAAM,EAAE,UAAU,GAAG,SAAS;CAC9B,MAAM,SAAS,mBAAmB;CAElC,OACE,oBAAC,KAAK,MAAN;EAAgB;EAAK,KAAK,OAAO;EAAM,GAAI;YACxC,SAAS,IAAI,WAAW,OAAO,UAAU;GACxC,IAAI,eAAe,KAAK,GACtB,OAAO,aAAa,OAA4C,EAAE,QAAQ,MAAM,CAAC;GAEnF,OAAO;EACT,CAAC;CACQ,CAAA;AAEf,CAAC;AAED,oBAAoB,cAAc;AAYlC,IAAM,uBAAuB,UAAoC;CAC/D,MAAM,EAAE,SAAS,GAAG,UAAU,aAAa,UAAU;CACrD,MAAM,EAAE,SAAS,mBAAmB,KAAK,EAAE,MAAM,EAAE;CACnD,MAAM,SAAS,mBAAmB;CAElC,IAAI,WAAW,MAAM,OAAO;CAE5B,OACE,qBAAA,YAAA,EAAA,UAAA,CACE,qBAAC,OAAO,KAAR;EAAY,KAAK,OAAO;YAAxB,CACE,oBAAC,KAAK,OAAN;GAAY,KAAK,OAAO;aAAQ;EAAkB,CAAA,GACjD,eAAe,oBAAC,KAAK,aAAN;GAAkB,KAAK,OAAO;aAAc;EAA8B,CAAA,CAChF;KACX,QACD,EAAA,CAAA;AAEN;AAEA,oBAAoB,cAAc;AAMlC,IAAM,wBAAwB,YAAwD,OAAO,QAAQ;CACnG,MAAM,EAAE,UAAU,GAAG,SAAS;CAC9B,MAAM,SAAS,mBAAmB;CAElC,OACE,oBAAC,KAAK,QAAN;EAAkB;EAAK,KAAK,OAAO;EAAQ,GAAI;EAC5C;CACU,CAAA;AAEjB,CAAC;AAED,sBAAsB,cAAc;AAEpC,IAAA,0BAAe,kBAAkB,iBAAiB;CAChD,MAAM;CACN,QAAQ;CACR,QAAQ;CACR,MAAM;AACR,CAAC"}

package/dist/components/BitkitTreeView/BitkitTreeView.js

@@ -1,6 +1,7 @@
 import IconChevronRight from "../../icons/IconChevronRight.js";
 import IconFolder from "../../icons/IconFolder.js";
 import IconWarningYellow from "../../icons/IconWarningYellow.js";
+import { withSubComponents } from "../../utilities/withSubComponents.js";
 import { Box } from "@chakra-ui/react/box";
 import { useSlotRecipe } from "@chakra-ui/react/styled-system";
 import { Text } from "@chakra-ui/react/text";
@@ -99,7 +100,7 @@ var Leaf = forwardRef((props, ref) => {
 	});
 });
 Leaf.displayName = "BitkitTreeView.Leaf";
-var BitkitTreeView = Object.assign(Root, {
+var BitkitTreeView = withSubComponents(Root, {
 	Branch,
 	Leaf
 });

package/dist/components/BitkitTreeView/BitkitTreeView.js.map

@@ -1 +1 @@
-{"version":3,"file":"BitkitTreeView.js","names":[],"sources":["../../../lib/components/BitkitTreeView/BitkitTreeView.tsx"],"sourcesContent":["// eslint-disable-next-line no-restricted-imports\nimport { createContext } from '@chakra-ui/react';\nimport { Box } from '@chakra-ui/react/box';\nimport { useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { Text } from '@chakra-ui/react/text';\nimport {\n  TreeView,\n  type TreeViewBranchControlProps,\n  type TreeViewItemProps,\n  type TreeViewNodeRenderProps,\n  type TreeViewRootProps,\n} from '@chakra-ui/react/tree-view';\nimport { cloneElement, forwardRef, type ReactElement, type ReactNode } from 'react';\n\nimport { type BitkitIconComponent, IconChevronRight, IconFolder, IconWarningYellow } from '../../icons';\n\n// Re-export for consumer convenience\nexport { createTreeCollection } from '@chakra-ui/react/collection';\n\n// Re-export useful types\nexport type {\n  TreeViewExpandedChangeDetails as BitkitTreeViewExpandedChangeDetails,\n  TreeViewNodeRenderProps as BitkitTreeViewNodeRenderProps,\n  TreeViewSelectionChangeDetails as BitkitTreeViewSelectionChangeDetails,\n} from '@chakra-ui/react/tree-view';\n\n// --- Variant context ---\n\nexport type BitkitTreeViewVariant = 'files' | 'navigation';\n\nconst [VariantProvider, useVariant] = createContext<{ variant: BitkitTreeViewVariant }>({\n  name: 'BitkitTreeViewVariantContext',\n  defaultValue: { variant: 'files' },\n});\n\nconst useCustomSlotStyles = (variant: BitkitTreeViewVariant) => {\n  const recipe = useSlotRecipe({ key: 'treeView' });\n  return recipe({ variant });\n};\n\n// --- Root ---\n\nexport interface BitkitTreeViewRootProps extends Omit<TreeViewRootProps, 'children'> {\n  children?: ReactNode;\n  render: (props: TreeViewNodeRenderProps) => ReactNode;\n  variant?: BitkitTreeViewVariant;\n}\n\nconst Root = forwardRef<HTMLDivElement, BitkitTreeViewRootProps>(\n  ({ children, render, variant = 'files', ...props }, ref) => {\n    const indentGuide = variant === 'files' ? <TreeView.BranchIndentGuide /> : undefined;\n\n    return (\n      <VariantProvider value={{ variant }}>\n        <TreeView.Root ref={ref} variant={variant} {...props}>\n          <TreeView.Tree>\n            <TreeView.Node indentGuide={indentGuide} render={render as never} />\n            {children}\n          </TreeView.Tree>\n        </TreeView.Root>\n      </VariantProvider>\n    );\n  },\n);\nRoot.displayName = 'BitkitTreeView';\n\n// --- Branch ---\n\nexport interface BitkitTreeViewBranchProps extends Omit<TreeViewBranchControlProps, 'children'> {\n  actions?: ReactElement[];\n  hasWarning?: boolean;\n  label: string;\n  subtext?: ReactNode;\n  suffixIcon?: BitkitIconComponent;\n  suffixText?: string;\n}\n\nconst Branch = forwardRef<HTMLDivElement, BitkitTreeViewBranchProps>((props, ref) => {\n  const { actions, hasWarning, label, subtext, suffixIcon: SuffixIcon, suffixText, ...rest } = props;\n  const { variant } = useVariant();\n  const styles = useCustomSlotStyles(variant);\n  const hasSuffix = hasWarning || SuffixIcon || suffixText;\n  const hasActions = actions && actions.length > 0;\n\n  const BranchIcon = variant === 'navigation' ? IconChevronRight : IconFolder;\n\n  return (\n    <TreeView.BranchControl ref={ref} className={hasActions ? 'group' : undefined} {...rest}>\n      <TreeView.BranchIndicator>\n        <BranchIcon size=\"16\" />\n      </TreeView.BranchIndicator>\n      <TreeView.BranchText>\n        {label}\n        {subtext && <Text css={styles.secondaryText}>{subtext}</Text>}\n      </TreeView.BranchText>\n      {hasSuffix && (\n        <Box css={styles.suffixGroup}>\n          {hasWarning && <IconWarningYellow size=\"16\" />}\n          {SuffixIcon && <SuffixIcon size=\"16\" />}\n          {suffixText && <span>{suffixText}</span>}\n        </Box>\n      )}\n      {hasActions && (\n        <Box css={styles.actionGroup}>{actions.map((action) => cloneElement(action, { size: 'xs' }))}</Box>\n      )}\n    </TreeView.BranchControl>\n  );\n});\nBranch.displayName = 'BitkitTreeView.Branch';\n\n// --- Leaf ---\n\nexport interface BitkitTreeViewLeafProps extends Omit<TreeViewItemProps, 'children'> {\n  actions?: ReactElement[];\n  badge?: ReactElement;\n  hasWarning?: boolean;\n  icon?: BitkitIconComponent;\n  label: string;\n  subtext?: ReactNode;\n  suffixIcon?: BitkitIconComponent;\n  suffixText?: string;\n}\n\nconst Leaf = forwardRef<HTMLDivElement, BitkitTreeViewLeafProps>((props, ref) => {\n  const { actions, badge, hasWarning, icon: Icon, label, subtext, suffixIcon: SuffixIcon, suffixText, ...rest } = props;\n  const { variant } = useVariant();\n  const styles = useCustomSlotStyles(variant);\n  const hasSuffix = hasWarning || SuffixIcon || suffixText;\n  const hasActions = actions && actions.length > 0;\n\n  return (\n    <TreeView.Item ref={ref} className={hasActions ? 'group' : undefined} {...rest}>\n      {Icon && <Icon size=\"16\" />}\n      {badge && cloneElement(badge, { size: 'xxs' })}\n      <TreeView.ItemText>\n        {label}\n        {subtext && <Text css={styles.secondaryText}>{subtext}</Text>}\n      </TreeView.ItemText>\n      {hasSuffix && (\n        <Box css={styles.suffixGroup}>\n          {hasWarning && <IconWarningYellow size=\"16\" />}\n          {SuffixIcon && <SuffixIcon size=\"16\" />}\n          {suffixText && <span>{suffixText}</span>}\n        </Box>\n      )}\n      {hasActions && (\n        <Box css={styles.actionGroup}>{actions.map((action) => cloneElement(action, { size: 'xs' }))}</Box>\n      )}\n    </TreeView.Item>\n  );\n});\nLeaf.displayName = 'BitkitTreeView.Leaf';\n\n// --- Main export ---\n\nconst BitkitTreeView = Object.assign(Root, {\n  Branch,\n  Leaf,\n});\n\nexport default BitkitTreeView;\n"],"mappings":"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"}
+{"version":3,"file":"BitkitTreeView.js","names":[],"sources":["../../../lib/components/BitkitTreeView/BitkitTreeView.tsx"],"sourcesContent":["// eslint-disable-next-line no-restricted-imports\nimport { createContext } from '@chakra-ui/react';\nimport { Box } from '@chakra-ui/react/box';\nimport { useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { Text } from '@chakra-ui/react/text';\nimport {\n  TreeView,\n  type TreeViewBranchControlProps,\n  type TreeViewItemProps,\n  type TreeViewNodeRenderProps,\n  type TreeViewRootProps,\n} from '@chakra-ui/react/tree-view';\nimport { cloneElement, forwardRef, type ReactElement, type ReactNode } from 'react';\n\nimport { type BitkitIconComponent, IconChevronRight, IconFolder, IconWarningYellow } from '../../icons';\nimport { withSubComponents } from '../../utilities/withSubComponents';\n\n// Re-export for consumer convenience\nexport { createTreeCollection } from '@chakra-ui/react/collection';\n\n// Re-export useful types\nexport type {\n  TreeViewExpandedChangeDetails as BitkitTreeViewExpandedChangeDetails,\n  TreeViewNodeRenderProps as BitkitTreeViewNodeRenderProps,\n  TreeViewSelectionChangeDetails as BitkitTreeViewSelectionChangeDetails,\n} from '@chakra-ui/react/tree-view';\n\n// --- Variant context ---\n\nexport type BitkitTreeViewVariant = 'files' | 'navigation';\n\nconst [VariantProvider, useVariant] = createContext<{ variant: BitkitTreeViewVariant }>({\n  name: 'BitkitTreeViewVariantContext',\n  defaultValue: { variant: 'files' },\n});\n\nconst useCustomSlotStyles = (variant: BitkitTreeViewVariant) => {\n  const recipe = useSlotRecipe({ key: 'treeView' });\n  return recipe({ variant });\n};\n\n// --- Root ---\n\nexport interface BitkitTreeViewRootProps extends Omit<TreeViewRootProps, 'children'> {\n  children?: ReactNode;\n  render: (props: TreeViewNodeRenderProps) => ReactNode;\n  variant?: BitkitTreeViewVariant;\n}\n\nconst Root = forwardRef<HTMLDivElement, BitkitTreeViewRootProps>(\n  ({ children, render, variant = 'files', ...props }, ref) => {\n    const indentGuide = variant === 'files' ? <TreeView.BranchIndentGuide /> : undefined;\n\n    return (\n      <VariantProvider value={{ variant }}>\n        <TreeView.Root ref={ref} variant={variant} {...props}>\n          <TreeView.Tree>\n            <TreeView.Node indentGuide={indentGuide} render={render as never} />\n            {children}\n          </TreeView.Tree>\n        </TreeView.Root>\n      </VariantProvider>\n    );\n  },\n);\nRoot.displayName = 'BitkitTreeView';\n\n// --- Branch ---\n\nexport interface BitkitTreeViewBranchProps extends Omit<TreeViewBranchControlProps, 'children'> {\n  actions?: ReactElement[];\n  hasWarning?: boolean;\n  label: string;\n  subtext?: ReactNode;\n  suffixIcon?: BitkitIconComponent;\n  suffixText?: string;\n}\n\nconst Branch = forwardRef<HTMLDivElement, BitkitTreeViewBranchProps>((props, ref) => {\n  const { actions, hasWarning, label, subtext, suffixIcon: SuffixIcon, suffixText, ...rest } = props;\n  const { variant } = useVariant();\n  const styles = useCustomSlotStyles(variant);\n  const hasSuffix = hasWarning || SuffixIcon || suffixText;\n  const hasActions = actions && actions.length > 0;\n\n  const BranchIcon = variant === 'navigation' ? IconChevronRight : IconFolder;\n\n  return (\n    <TreeView.BranchControl ref={ref} className={hasActions ? 'group' : undefined} {...rest}>\n      <TreeView.BranchIndicator>\n        <BranchIcon size=\"16\" />\n      </TreeView.BranchIndicator>\n      <TreeView.BranchText>\n        {label}\n        {subtext && <Text css={styles.secondaryText}>{subtext}</Text>}\n      </TreeView.BranchText>\n      {hasSuffix && (\n        <Box css={styles.suffixGroup}>\n          {hasWarning && <IconWarningYellow size=\"16\" />}\n          {SuffixIcon && <SuffixIcon size=\"16\" />}\n          {suffixText && <span>{suffixText}</span>}\n        </Box>\n      )}\n      {hasActions && (\n        <Box css={styles.actionGroup}>{actions.map((action) => cloneElement(action, { size: 'xs' }))}</Box>\n      )}\n    </TreeView.BranchControl>\n  );\n});\nBranch.displayName = 'BitkitTreeView.Branch';\n\n// --- Leaf ---\n\nexport interface BitkitTreeViewLeafProps extends Omit<TreeViewItemProps, 'children'> {\n  actions?: ReactElement[];\n  badge?: ReactElement;\n  hasWarning?: boolean;\n  icon?: BitkitIconComponent;\n  label: string;\n  subtext?: ReactNode;\n  suffixIcon?: BitkitIconComponent;\n  suffixText?: string;\n}\n\nconst Leaf = forwardRef<HTMLDivElement, BitkitTreeViewLeafProps>((props, ref) => {\n  const { actions, badge, hasWarning, icon: Icon, label, subtext, suffixIcon: SuffixIcon, suffixText, ...rest } = props;\n  const { variant } = useVariant();\n  const styles = useCustomSlotStyles(variant);\n  const hasSuffix = hasWarning || SuffixIcon || suffixText;\n  const hasActions = actions && actions.length > 0;\n\n  return (\n    <TreeView.Item ref={ref} className={hasActions ? 'group' : undefined} {...rest}>\n      {Icon && <Icon size=\"16\" />}\n      {badge && cloneElement(badge, { size: 'xxs' })}\n      <TreeView.ItemText>\n        {label}\n        {subtext && <Text css={styles.secondaryText}>{subtext}</Text>}\n      </TreeView.ItemText>\n      {hasSuffix && (\n        <Box css={styles.suffixGroup}>\n          {hasWarning && <IconWarningYellow size=\"16\" />}\n          {SuffixIcon && <SuffixIcon size=\"16\" />}\n          {suffixText && <span>{suffixText}</span>}\n        </Box>\n      )}\n      {hasActions && (\n        <Box css={styles.actionGroup}>{actions.map((action) => cloneElement(action, { size: 'xs' }))}</Box>\n      )}\n    </TreeView.Item>\n  );\n});\nLeaf.displayName = 'BitkitTreeView.Leaf';\n\n// --- Main export ---\n\nconst BitkitTreeView = withSubComponents(Root, {\n  Branch,\n  Leaf,\n});\n\nexport default BitkitTreeView;\n"],"mappings":"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"}

package/dist/components/index.d.ts

@@ -61,6 +61,7 @@ export { default as BitkitSegmentedControl, type BitkitSegmentedControlItemProps
 export { default as BitkitSelect, type BitkitSelectProps } from './BitkitSelect/BitkitSelect';
 export { default as BitkitSelectableTag, type BitkitSelectableTagItemProps, type BitkitSelectableTagProps, } from './BitkitSelectableTag/BitkitSelectableTag';
 export { default as BitkitSelectMenu, type BitkitSelectMenuProps } from './BitkitSelectMenu/BitkitSelectMenu';
+export { default as BitkitSelectMenuAction, type BitkitSelectMenuActionProps, } from './BitkitSelectMenu/BitkitSelectMenuAction';
 export { default as BitkitSettingsCard, type BitkitSettingsCardContentProps, type BitkitSettingsCardProps, type BitkitSettingsCardStatusProps, } from './BitkitSettingsCard/BitkitSettingsCard';
 export { default as BitkitSidebar, type BitkitSidebarFooterProps, type BitkitSidebarGroupHeadingProps, type BitkitSidebarItemProps, type BitkitSidebarProjectProps, type BitkitSidebarProps, type BitkitSidebarTitleProps, } from './BitkitSidebar/BitkitSidebar';
 export { default as BitkitSpinner, type BitkitSpinnerProps } from './BitkitSpinner/BitkitSpinner';

package/dist/main.js

@@ -292,6 +292,7 @@ import BitkitControlButton from "./components/BitkitControlButton/BitkitControlB
 import BitkitBreadcrumb from "./components/BitkitBreadcrumb/BitkitBreadcrumb.js";
 import BitkitButton from "./components/BitkitButton/BitkitButton.js";
 import BitkitGroupHeading from "./components/BitkitGroupHeading/BitkitGroupHeading.js";
+import BitkitSelectMenuAction from "./components/BitkitSelectMenu/BitkitSelectMenuAction.js";
 import BitkitSelectMenu from "./components/BitkitSelectMenu/BitkitSelectMenu.js";
 import BitkitCalendar from "./components/BitkitCalendar/BitkitCalendar.js";
 import BitkitCard from "./components/BitkitCard/BitkitCard.js";
@@ -302,7 +303,7 @@ import BitkitCodeSnippet from "./components/BitkitCodeSnippet/BitkitCodeSnippet.
 import BitkitLabel from "./components/BitkitLabel/BitkitLabel.js";
 import BitkitCollapsible from "./components/BitkitCollapsible/BitkitCollapsible.js";
 import BitkitField from "./components/BitkitField/BitkitField.js";
-import BitkitCombobox from "./components/BitkitCombobox/BitkitCombobox.js";
+import BitkitCombobox_default from "./components/BitkitCombobox/BitkitCombobox.js";
 import BitkitDataWidget from "./components/BitkitDataWidget/BitkitDataWidget.js";
 import BitkitDefinitionTooltip from "./components/BitkitDefinitionTooltip/BitkitDefinitionTooltip.js";
 import BitkitDialogStep from "./components/BitkitDialog/BitkitDialogStep.js";
@@ -327,7 +328,7 @@ import BitkitMarkdown from "./components/BitkitMarkdown/BitkitMarkdown.js";
 import BitkitMarkdownCard from "./components/BitkitMarkdownCard/BitkitMarkdownCard.js";
 import BitkitMultiselectMenu from "./components/BitkitMultiselectMenu/BitkitMultiselectMenu.js";
 import BitkitTag from "./components/BitkitTag/BitkitTag.js";
-import BitkitMultiselect from "./components/BitkitMultiselect/BitkitMultiselect.js";
+import BitkitMultiselect_default from "./components/BitkitMultiselect/BitkitMultiselect.js";
 import BitkitNativeSelect from "./components/BitkitNativeSelect/BitkitNativeSelect.js";
 import BitkitNoteCard from "./components/BitkitNoteCard/BitkitNoteCard.js";
 import BitkitNumberInput from "./components/BitkitNumberInput/BitkitNumberInput.js";
@@ -342,7 +343,7 @@ import BitkitRibbon from "./components/BitkitRibbon/BitkitRibbon.js";
 import BitkitSearchInput from "./components/BitkitSearchInput/BitkitSearchInput.js";
 import BitkitSectionHeading from "./components/BitkitSectionHeading/BitkitSectionHeading.js";
 import BitkitSegmentedControl_default from "./components/BitkitSegmentedControl/BitkitSegmentedControl.js";
-import BitkitSelect from "./components/BitkitSelect/BitkitSelect.js";
+import BitkitSelect_default from "./components/BitkitSelect/BitkitSelect.js";
 import BitkitSelectableTag_default from "./components/BitkitSelectableTag/BitkitSelectableTag.js";
 import BitkitSettingsCard_default from "./components/BitkitSettingsCard/BitkitSettingsCard.js";
 import BitkitSidebar_default from "./components/BitkitSidebar/BitkitSidebar.js";
@@ -364,4 +365,4 @@ import BitkitTreeView, { createTreeCollection } from "./components/BitkitTreeVie
 import useResponsive, { ResponsiveProvider } from "./hooks/useResponsive.js";
 import bitkitTheme from "./theme/index.js";
 import Provider from "./providers/BitkitProvider.js";
-export { BitkitAccordion, BitkitActionBar, BitkitActionMenu, BitkitAlert, BitkitAvatar, BitkitBadge, BitkitBreadcrumb, BitkitButton, BitkitCalendar, BitkitCard, BitkitCheckbox, BitkitCheckboxGroup, BitkitCloseButton, BitkitCodeSnippet, BitkitCollapsible, BitkitColorButton, BitkitCombobox, BitkitControlButton, BitkitDataWidget, BitkitDefinitionTooltip, BitkitDialog_default as BitkitDialog, BitkitDialogBody, BitkitDialogButtons, BitkitDialogContent, BitkitDialogHeader, BitkitDialogRoot, BitkitDialogStep, BitkitDraggableCard, BitkitDrawer, BitkitEmptyState, BitkitExpandableCard, BitkitExpandableRow, BitkitField, BitkitFileInput, BitkitGroupHeading, BitkitIconButton, BitkitInlineLoading, BitkitLabel, BitkitLabelTooltip, BitkitLabeledData, BitkitLink, BitkitLinkButton, BitkitList_default as BitkitList, BitkitMarkdown, BitkitMarkdownCard, BitkitMultiselect, BitkitMultiselectMenu, BitkitNativeSelect, BitkitNoteCard, BitkitNumberInput, BitkitOverflowContent, BitkitOverflowTooltip, BitkitPageFooter_default as BitkitPageFooter, BitkitPagination, BitkitPaginationLoadMore, Provider as BitkitProvider, BitkitRadio, BitkitRadioGroup, BitkitRibbon, BitkitSearchInput, BitkitSectionHeading, BitkitSegmentedControl_default as BitkitSegmentedControl, BitkitSelect, BitkitSelectMenu, BitkitSelectableTag_default as BitkitSelectableTag, BitkitSettingsCard_default as BitkitSettingsCard, BitkitSidebar_default as BitkitSidebar, BitkitSortableColumnHeader, BitkitSpinner, BitkitSplitButton_default as BitkitSplitButton, BitkitStat, BitkitSteps_default as BitkitSteps, BitkitStepsCard_default as BitkitStepsCard, BitkitSwitch, BitkitTabs, BitkitTag, BitkitTagsInput, BitkitTextArea, BitkitTextInput, BitkitToggleButton, BitkitTooltip, BitkitTreeView, IconAbortCircle, IconAbortCircleFilled, IconAddons, IconAgent, IconAnchor, IconAndroid, IconApp, IconAppSettings, IconAppStore, IconAppStoreColor, IconApple, IconArchive, IconArchiveDelete, IconArchiveRestore, IconArrowBackAndDown, IconArrowBackAndUp, IconArrowDown, IconArrowForwardAndDown, IconArrowForwardAndUp, IconArrowLeft, IconArrowNortheast, IconArrowNorthwest, IconArrowRight, IconArrowUp, IconArrowsHorizontal, IconArrowsVertical, IconAutomation, IconAws, IconAwsColor, IconBadge3RdParty, IconBadgeBitrise, IconBadgeUpgrade, IconBadgeVersionOk, IconBazel, IconBell, IconBitbot, IconBitbotError, IconBitbucket, IconBitbucketColor, IconBitbucketNeutral, IconBitbucketWhite, IconBlockCircle, IconBook, IconBoxArrowDown, IconBoxDot, IconBoxLinesOverflow, IconBoxLinesWrap, IconBranch, IconBrowserstackColor, IconBug, IconBuild, IconBuildCache, IconBuildCacheFilled, IconBuildEnvSetup, IconCalendar, IconChangePlan, IconChat, IconCheck, IconCheckCircle, IconCheckCircleFilled, IconChevronDown, IconChevronLeft, IconChevronRight, IconChevronUp, IconCi, IconCiFilled, IconCircle, IconCircleDashed, IconCircleHalfFilled, IconClaude, IconClaudeColor, IconClock, IconCode, IconCodePush, IconCodeSigning, IconCoffee, IconCommit, IconConfigure, IconConnectedAccounts, IconContainer, IconCopy, IconCordova, IconCpu, IconCreditcard, IconCredits, IconCross, IconCrossCircle, IconCrossCircleFilled, IconCrown, IconCycle, IconDashboard, IconDashboardFilled, IconDeployment, IconDetails, IconDoc, IconDollar, IconDot, IconDotnet, IconDotnetColor, IconDotnetText, IconDotnetTextColor, IconDoubleCircle, IconDownload, IconDragHandle, IconEc2Ami, IconEnterprise, IconErrorCircle, IconErrorCircleFilled, IconExpand, IconExtraBuildCapacity, IconEye, IconEyeSlash, IconFastlane, IconFileDoc, IconFilePdf, IconFilePlist, IconFileZip, IconFilter, IconFlag, IconFlutter, IconFolder, IconFullscreen, IconFullscreenExit, IconGauge, IconGit, IconGithub, IconGitlab, IconGitlabColor, IconGitlabWhite, IconGlobe, IconGo, IconGoogleColor, IconGooglePlay, IconGooglePlayColor, IconGradle, IconGroup, IconHashtag, IconHeadset, IconHeart, IconHistory, IconHourglass, IconImage, IconInfoCircle, IconInfoCircleFilled, IconInsights, IconInsightsFilled, IconInstall, IconInteraction, IconInvoice, IconIonic, IconJapanese, IconJava, IconJavaColor, IconJavaDuke, IconJavaDukeColor, IconKey, IconKotlin, IconKotlinColor, IconKotlinWhite, IconLaptop, IconLaunchdarkly, IconLegacyApp, IconLightbulb, IconLink, IconLinux, IconLock, IconLockOpen, IconLogin, IconLogout, IconMacos, IconMagicWand, IconMagnifier, IconMail, IconMedal, IconMemory, IconMenuGrid, IconMenuHamburger, IconMessage, IconMessageAlert, IconMessageQuestion, IconMicrophone, IconMinus, IconMinusCircle, IconMinusCircleFilled, IconMobile, IconMobileLandscape, IconMonitorChart, IconMoreHorizontal, IconMoreVertical, IconNews, IconNextjs, IconNodejs, IconOpenInNew, IconOther, IconOutsideContributor, IconOverview, IconPause, IconPencil, IconPeople, IconPercent, IconPerson, IconPersonWithDesk, IconPlay, IconPlus, IconPlusCircle, IconPlusCircleFilled, IconPower, IconProject, IconProjectSettings, IconPull, IconPush, IconPuzzle, IconPython, IconPythonColor, IconQuestionCircle, IconQuestionCircleFilled, IconReact, IconRefresh, IconRegex, IconRelease, IconReleaseFilled, IconRemoteAccess, IconReplace, IconResponsiveness, IconReviewerApproved, IconReviewerAssigned, IconReviewerRejected, IconRuby, IconRubyColor, IconSave, IconSecurityShield, IconSettings, IconSettingsFilled, IconShuffle, IconSiren, IconSkip, IconSkipCircle, IconSkipCircleFilled, IconSlack, IconSlackColor, IconSparkle, IconSparkleFilled, IconSpinnerOnDisabled, IconSpinnerPurple, IconSpinnerPurpleDouble, IconSpinnerWhite, IconStability, IconStack, IconStar, IconStep, IconStop, IconStopwatch, IconTag, IconTasks, IconTeams, IconTeamsColor, IconTemplateCode, IconTerminal, IconTestQuarantine, IconThemeDarkToggle, IconThumbDown, IconThumbUp, IconTools, IconTrash, IconTrigger, IconUbuntu, IconUbuntuColor, IconUnity3D, IconUpload, IconValidateShield, IconVideo, IconWarning, IconWarningYellow, IconWebUi, IconWebhooks, IconWorkflow, IconWorkflowFlow, IconXTwitter, IconXamarin, IconXcode, ResponsiveProvider, bitkitIcon, bitkitTheme as bitriseTheme, createBitkitToast, createTreeCollection, useResponsive };
+export { BitkitAccordion, BitkitActionBar, BitkitActionMenu, BitkitAlert, BitkitAvatar, BitkitBadge, BitkitBreadcrumb, BitkitButton, BitkitCalendar, BitkitCard, BitkitCheckbox, BitkitCheckboxGroup, BitkitCloseButton, BitkitCodeSnippet, BitkitCollapsible, BitkitColorButton, BitkitCombobox_default as BitkitCombobox, BitkitControlButton, BitkitDataWidget, BitkitDefinitionTooltip, BitkitDialog_default as BitkitDialog, BitkitDialogBody, BitkitDialogButtons, BitkitDialogContent, BitkitDialogHeader, BitkitDialogRoot, BitkitDialogStep, BitkitDraggableCard, BitkitDrawer, BitkitEmptyState, BitkitExpandableCard, BitkitExpandableRow, BitkitField, BitkitFileInput, BitkitGroupHeading, BitkitIconButton, BitkitInlineLoading, BitkitLabel, BitkitLabelTooltip, BitkitLabeledData, BitkitLink, BitkitLinkButton, BitkitList_default as BitkitList, BitkitMarkdown, BitkitMarkdownCard, BitkitMultiselect_default as BitkitMultiselect, BitkitMultiselectMenu, BitkitNativeSelect, BitkitNoteCard, BitkitNumberInput, BitkitOverflowContent, BitkitOverflowTooltip, BitkitPageFooter_default as BitkitPageFooter, BitkitPagination, BitkitPaginationLoadMore, Provider as BitkitProvider, BitkitRadio, BitkitRadioGroup, BitkitRibbon, BitkitSearchInput, BitkitSectionHeading, BitkitSegmentedControl_default as BitkitSegmentedControl, BitkitSelect_default as BitkitSelect, BitkitSelectMenu, BitkitSelectMenuAction, BitkitSelectableTag_default as BitkitSelectableTag, BitkitSettingsCard_default as BitkitSettingsCard, BitkitSidebar_default as BitkitSidebar, BitkitSortableColumnHeader, BitkitSpinner, BitkitSplitButton_default as BitkitSplitButton, BitkitStat, BitkitSteps_default as BitkitSteps, BitkitStepsCard_default as BitkitStepsCard, BitkitSwitch, BitkitTabs, BitkitTag, BitkitTagsInput, BitkitTextArea, BitkitTextInput, BitkitToggleButton, BitkitTooltip, BitkitTreeView, IconAbortCircle, IconAbortCircleFilled, IconAddons, IconAgent, IconAnchor, IconAndroid, IconApp, IconAppSettings, IconAppStore, IconAppStoreColor, IconApple, IconArchive, IconArchiveDelete, IconArchiveRestore, IconArrowBackAndDown, IconArrowBackAndUp, IconArrowDown, IconArrowForwardAndDown, IconArrowForwardAndUp, IconArrowLeft, IconArrowNortheast, IconArrowNorthwest, IconArrowRight, IconArrowUp, IconArrowsHorizontal, IconArrowsVertical, IconAutomation, IconAws, IconAwsColor, IconBadge3RdParty, IconBadgeBitrise, IconBadgeUpgrade, IconBadgeVersionOk, IconBazel, IconBell, IconBitbot, IconBitbotError, IconBitbucket, IconBitbucketColor, IconBitbucketNeutral, IconBitbucketWhite, IconBlockCircle, IconBook, IconBoxArrowDown, IconBoxDot, IconBoxLinesOverflow, IconBoxLinesWrap, IconBranch, IconBrowserstackColor, IconBug, IconBuild, IconBuildCache, IconBuildCacheFilled, IconBuildEnvSetup, IconCalendar, IconChangePlan, IconChat, IconCheck, IconCheckCircle, IconCheckCircleFilled, IconChevronDown, IconChevronLeft, IconChevronRight, IconChevronUp, IconCi, IconCiFilled, IconCircle, IconCircleDashed, IconCircleHalfFilled, IconClaude, IconClaudeColor, IconClock, IconCode, IconCodePush, IconCodeSigning, IconCoffee, IconCommit, IconConfigure, IconConnectedAccounts, IconContainer, IconCopy, IconCordova, IconCpu, IconCreditcard, IconCredits, IconCross, IconCrossCircle, IconCrossCircleFilled, IconCrown, IconCycle, IconDashboard, IconDashboardFilled, IconDeployment, IconDetails, IconDoc, IconDollar, IconDot, IconDotnet, IconDotnetColor, IconDotnetText, IconDotnetTextColor, IconDoubleCircle, IconDownload, IconDragHandle, IconEc2Ami, IconEnterprise, IconErrorCircle, IconErrorCircleFilled, IconExpand, IconExtraBuildCapacity, IconEye, IconEyeSlash, IconFastlane, IconFileDoc, IconFilePdf, IconFilePlist, IconFileZip, IconFilter, IconFlag, IconFlutter, IconFolder, IconFullscreen, IconFullscreenExit, IconGauge, IconGit, IconGithub, IconGitlab, IconGitlabColor, IconGitlabWhite, IconGlobe, IconGo, IconGoogleColor, IconGooglePlay, IconGooglePlayColor, IconGradle, IconGroup, IconHashtag, IconHeadset, IconHeart, IconHistory, IconHourglass, IconImage, IconInfoCircle, IconInfoCircleFilled, IconInsights, IconInsightsFilled, IconInstall, IconInteraction, IconInvoice, IconIonic, IconJapanese, IconJava, IconJavaColor, IconJavaDuke, IconJavaDukeColor, IconKey, IconKotlin, IconKotlinColor, IconKotlinWhite, IconLaptop, IconLaunchdarkly, IconLegacyApp, IconLightbulb, IconLink, IconLinux, IconLock, IconLockOpen, IconLogin, IconLogout, IconMacos, IconMagicWand, IconMagnifier, IconMail, IconMedal, IconMemory, IconMenuGrid, IconMenuHamburger, IconMessage, IconMessageAlert, IconMessageQuestion, IconMicrophone, IconMinus, IconMinusCircle, IconMinusCircleFilled, IconMobile, IconMobileLandscape, IconMonitorChart, IconMoreHorizontal, IconMoreVertical, IconNews, IconNextjs, IconNodejs, IconOpenInNew, IconOther, IconOutsideContributor, IconOverview, IconPause, IconPencil, IconPeople, IconPercent, IconPerson, IconPersonWithDesk, IconPlay, IconPlus, IconPlusCircle, IconPlusCircleFilled, IconPower, IconProject, IconProjectSettings, IconPull, IconPush, IconPuzzle, IconPython, IconPythonColor, IconQuestionCircle, IconQuestionCircleFilled, IconReact, IconRefresh, IconRegex, IconRelease, IconReleaseFilled, IconRemoteAccess, IconReplace, IconResponsiveness, IconReviewerApproved, IconReviewerAssigned, IconReviewerRejected, IconRuby, IconRubyColor, IconSave, IconSecurityShield, IconSettings, IconSettingsFilled, IconShuffle, IconSiren, IconSkip, IconSkipCircle, IconSkipCircleFilled, IconSlack, IconSlackColor, IconSparkle, IconSparkleFilled, IconSpinnerOnDisabled, IconSpinnerPurple, IconSpinnerPurpleDouble, IconSpinnerWhite, IconStability, IconStack, IconStar, IconStep, IconStop, IconStopwatch, IconTag, IconTasks, IconTeams, IconTeamsColor, IconTemplateCode, IconTerminal, IconTestQuarantine, IconThemeDarkToggle, IconThumbDown, IconThumbUp, IconTools, IconTrash, IconTrigger, IconUbuntu, IconUbuntuColor, IconUnity3D, IconUpload, IconValidateShield, IconVideo, IconWarning, IconWarningYellow, IconWebUi, IconWebhooks, IconWorkflow, IconWorkflowFlow, IconXTwitter, IconXamarin, IconXcode, ResponsiveProvider, bitkitIcon, bitkitTheme as bitriseTheme, createBitkitToast, createTreeCollection, useResponsive };

package/dist/theme/slot-recipes/Combobox.recipe.d.ts

@@ -14,6 +14,7 @@ declare const comboboxSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinitio
                 height: "16";
             };
             input: {
+                paddingInlineEnd: "96";
                 lineHeight: "normal";
                 paddingInline: string;
                 paddingBlock: string;
@@ -35,6 +36,7 @@ declare const comboboxSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinitio
                 height: "24";
             };
             input: {
+                paddingInlineEnd: "96";
                 lineHeight: "normal";
                 paddingInline: string;
                 paddingBlock: string;
@@ -43,5 +45,13 @@ declare const comboboxSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinitio
             };
         };
     };
+    hasStatusIcon: {
+        true: {
+            input: {
+                paddingInlineEnd: "128";
+            };
+        };
+        false: {};
+    };
 }>;
 export default comboboxSlotRecipe;

package/dist/theme/slot-recipes/Combobox.recipe.js

@@ -15,7 +15,8 @@ var comboboxSlotRecipe = defineSlotRecipe({
 		input: {
 			...base,
 			...singleLineInputOverrides,
-			height: "var(--input-height)"
+			height: "var(--input-height)",
+			textOverflow: "ellipsis"
 		},
 		empty: {
 			paddingInline: "16",
@@ -37,22 +38,30 @@ var comboboxSlotRecipe = defineSlotRecipe({
 			transform: "translateY(-50%)"
 		}
 	},
-	variants: { size: {
-		md: {
-			input: {
-				...variants.size.md,
-				...singleLineInputOverrides
+	variants: {
+		size: {
+			md: {
+				input: {
+					...variants.size.md,
+					...singleLineInputOverrides,
+					paddingInlineEnd: "96"
+				},
+				...variants$1.size.md
 			},
-			...variants$1.size.md
+			lg: {
+				input: {
+					...variants.size.lg,
+					...singleLineInputOverrides,
+					paddingInlineEnd: "96"
+				},
+				...variants$1.size.lg
+			}
 		},
-		lg: {
-			input: {
-				...variants.size.lg,
-				...singleLineInputOverrides
-			},
-			...variants$1.size.lg
+		hasStatusIcon: {
+			true: { input: { paddingInlineEnd: "128" } },
+			false: {}
 		}
-	} },
+	},
 	defaultVariants: { size: "lg" }
 });
 //#endregion

package/dist/theme/slot-recipes/Combobox.recipe.js.map

@@ -1 +1 @@
-{"version":3,"file":"Combobox.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Combobox.recipe.ts"],"sourcesContent":["import { comboboxAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { base, variants } from '../common/ComboboxAndSelect.common';\nimport * as inputStyle from '../common/InputAndTextarea.common';\n\nconst comboboxSlotRecipe = defineSlotRecipe({\n  className: 'combobox',\n  slots: [...comboboxAnatomy.keys(), 'emptyHelperText'],\n  base: {\n    control: {\n      display: 'flex',\n      alignItems: 'center',\n      position: 'relative',\n    },\n    input: { ...inputStyle.base, ...inputStyle.singleLineInputOverrides, height: 'var(--input-height)' },\n    empty: {\n      paddingInline: '16',\n      paddingBlock: '8',\n      textStyle: 'body/lg/regular',\n    },\n    emptyHelperText: {\n      color: 'text/helper',\n      textStyle: 'body/sm/regular',\n    },\n    ...base,\n    indicatorGroup: {\n      display: 'flex',\n      alignItems: 'center',\n      gap: '8',\n      position: 'absolute',\n      right: '16',\n      top: '50%',\n      transform: 'translateY(-50%)',\n    },\n  },\n  variants: {\n    size: {\n      md: {\n        input: { ...inputStyle.variants.size.md, ...inputStyle.singleLineInputOverrides },\n        ...variants.size.md,\n      },\n      lg: {\n        input: { ...inputStyle.variants.size.lg, ...inputStyle.singleLineInputOverrides },\n        ...variants.size.lg,\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'lg',\n  },\n});\n\nexport default comboboxSlotRecipe;\n"],"mappings":";;;;;AAMA,IAAM,qBAAqB,iBAAiB;CAC1C,WAAW;CACX,OAAO,CAAC,GAAG,gBAAgB,KAAK,GAAG,iBAAiB;CACpD,MAAM;EACJ,SAAS;GACP,SAAS;GACT,YAAY;GACZ,UAAU;EACZ;EACA,OAAO;GAAE,GAAG;GAAiB,GAAG;GAAqC,QAAQ;EAAsB;EACnG,OAAO;GACL,eAAe;GACf,cAAc;GACd,WAAW;EACb;EACA,iBAAiB;GACf,OAAO;GACP,WAAW;EACb;EACA,GAAG;EACH,gBAAgB;GACd,SAAS;GACT,YAAY;GACZ,KAAK;GACL,UAAU;GACV,OAAO;GACP,KAAK;GACL,WAAW;EACb;CACF;CACA,UAAU,EACR,MAAM;EACJ,IAAI;GACF,OAAO;IAAE,GAAA,SAAuB,KAAK;IAAI,GAAG;GAAoC;GAChF,GAAG,WAAS,KAAK;EACnB;EACA,IAAI;GACF,OAAO;IAAE,GAAA,SAAuB,KAAK;IAAI,GAAG;GAAoC;GAChF,GAAG,WAAS,KAAK;EACnB;CACF,EACF;CACA,iBAAiB,EACf,MAAM,KACR;AACF,CAAC"}
+{"version":3,"file":"Combobox.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Combobox.recipe.ts"],"sourcesContent":["import { comboboxAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { base, variants } from '../common/ComboboxAndSelect.common';\nimport * as inputStyle from '../common/InputAndTextarea.common';\n\nconst comboboxSlotRecipe = defineSlotRecipe({\n  className: 'combobox',\n  slots: [...comboboxAnatomy.keys(), 'emptyHelperText'],\n  base: {\n    control: {\n      display: 'flex',\n      alignItems: 'center',\n      position: 'relative',\n    },\n    input: {\n      ...inputStyle.base,\n      ...inputStyle.singleLineInputOverrides,\n      height: 'var(--input-height)',\n      textOverflow: 'ellipsis',\n    },\n    empty: {\n      paddingInline: '16',\n      paddingBlock: '8',\n      textStyle: 'body/lg/regular',\n    },\n    emptyHelperText: {\n      color: 'text/helper',\n      textStyle: 'body/sm/regular',\n    },\n    ...base,\n    indicatorGroup: {\n      display: 'flex',\n      alignItems: 'center',\n      gap: '8',\n      position: 'absolute',\n      right: '16',\n      top: '50%',\n      transform: 'translateY(-50%)',\n    },\n  },\n  variants: {\n    size: {\n      md: {\n        input: {\n          ...inputStyle.variants.size.md,\n          ...inputStyle.singleLineInputOverrides,\n          paddingInlineEnd: '96',\n        },\n        ...variants.size.md,\n      },\n      lg: {\n        input: {\n          ...inputStyle.variants.size.lg,\n          ...inputStyle.singleLineInputOverrides,\n          paddingInlineEnd: '96',\n        },\n        ...variants.size.lg,\n      },\n    },\n    hasStatusIcon: {\n      true: {\n        input: {\n          paddingInlineEnd: '128',\n        },\n      },\n      false: {},\n    },\n  },\n  defaultVariants: {\n    size: 'lg',\n  },\n});\n\nexport default comboboxSlotRecipe;\n"],"mappings":";;;;;AAMA,IAAM,qBAAqB,iBAAiB;CAC1C,WAAW;CACX,OAAO,CAAC,GAAG,gBAAgB,KAAK,GAAG,iBAAiB;CACpD,MAAM;EACJ,SAAS;GACP,SAAS;GACT,YAAY;GACZ,UAAU;EACZ;EACA,OAAO;GACL,GAAG;GACH,GAAG;GACH,QAAQ;GACR,cAAc;EAChB;EACA,OAAO;GACL,eAAe;GACf,cAAc;GACd,WAAW;EACb;EACA,iBAAiB;GACf,OAAO;GACP,WAAW;EACb;EACA,GAAG;EACH,gBAAgB;GACd,SAAS;GACT,YAAY;GACZ,KAAK;GACL,UAAU;GACV,OAAO;GACP,KAAK;GACL,WAAW;EACb;CACF;CACA,UAAU;EACR,MAAM;GACJ,IAAI;IACF,OAAO;KACL,GAAA,SAAuB,KAAK;KAC5B,GAAG;KACH,kBAAkB;IACpB;IACA,GAAG,WAAS,KAAK;GACnB;GACA,IAAI;IACF,OAAO;KACL,GAAA,SAAuB,KAAK;KAC5B,GAAG;KACH,kBAAkB;IACpB;IACA,GAAG,WAAS,KAAK;GACnB;EACF;EACA,eAAe;GACb,MAAM,EACJ,OAAO,EACL,kBAAkB,MACpB,EACF;GACA,OAAO,CAAC;EACV;CACF;CACA,iBAAiB,EACf,MAAM,KACR;AACF,CAAC"}

package/dist/theme/slot-recipes/DatePickerSelect.recipe.d.ts

@@ -48,7 +48,7 @@ declare const datePickerSelectSlotRecipe: import('@chakra-ui/react').SlotRecipeD
             emptyState?: {
                 paddingBlock: "8";
             } | undefined;
-            createItem?: {
+            action?: {
                 minHeight: "40";
                 paddingBlock: "8";
                 textStyle: "body/md/regular";

package/dist/theme/slot-recipes/Select.recipe.d.ts

@@ -1,4 +1,12 @@
-export declare const selectSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "label" | "checkbox" | "emptyState" | "list" | "root" | "item" | "itemContent" | "itemIndicator" | "trigger" | "positioner" | "indicator" | "itemGroup" | "itemGroupLabel" | "itemText" | "valueText" | "clearTrigger" | "control" | "searchInputGroup" | "itemList" | "createItemContainer" | "searchInput" | "searchClear" | "createItem" | "itemLabel" | "itemHelperText" | "indicatorGroup" | "checkmark" | "itemLoading" | "itemLoadingLabel", {
+export declare const selectSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "label" | "checkbox" | "emptyState" | "list" | "root" | "item" | "itemContent" | "itemIndicator" | "trigger" | "positioner" | "indicator" | "itemGroup" | "itemGroupLabel" | "itemText" | "valueText" | "action" | "clearTrigger" | "control" | "actionContainer" | "searchInputGroup" | "searchInput" | "searchClear" | "itemList" | "itemLabel" | "itemHelperText" | "indicatorGroup" | "checkmark" | "itemLoading" | "itemLoadingLabel", {
+    hasStatusIcon: {
+        true: {
+            trigger: {
+                paddingInlineEnd: "96";
+            };
+        };
+        false: {};
+    };
     size: {
         lg: {
             checkbox: {
@@ -38,7 +46,7 @@ export declare const selectSlotRecipe: import('@chakra-ui/react').SlotRecipeDefi
             emptyState: {
                 paddingBlock: "12";
             };
-            createItem: {
+            action: {
                 minHeight: "48";
                 paddingBlock: "12";
                 textStyle: "body/lg/regular";
@@ -97,7 +105,7 @@ export declare const selectSlotRecipe: import('@chakra-ui/react').SlotRecipeDefi
             emptyState: {
                 paddingBlock: "8";
             };
-            createItem: {
+            action: {
                 minHeight: "40";
                 paddingBlock: "8";
                 textStyle: "body/md/regular";