@bitrise/bitkit-v2 0.3.501 → 0.3.502-beta.3231

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

@@ -1 +1 @@
-{"version":3,"file":"BitkitStepsCard.js","names":["_Fragment"],"sources":["../../../lib/components/BitkitStepsCard/BitkitStepsCard.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport {\n  Card,\n  type CardBodyProps,\n  type CardFooterProps,\n  type CardHeaderProps,\n  type CardRootProps,\n} from '@chakra-ui/react/card';\nimport { 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, css, step, ...rest } = props;\n  const styles = useStepsCardStyles();\n\n  return (\n    <StepCardProvider value={{ step }}>\n      <Card.Root ref={ref} css={[styles.root, css]} 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, css, ...rest } = props;\n  const styles = useStepsCardStyles();\n\n  return (\n    <Card.Header ref={ref} css={[styles.header, css]} {...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, css, ...rest } = props;\n  const styles = useStepsCardStyles();\n\n  return (\n    <Card.Body ref={ref} css={[styles.body, css]} {...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\nconst hasContent = (node: ReactNode) => node !== null && node !== undefined && node !== '';\n\nexport interface BitkitStepsCardStepProps {\n  children?: ReactNode;\n  description?: ReactNode;\n  title?: ReactNode;\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  const showTitle = hasContent(title);\n  const showDescription = hasContent(description);\n\n  return (\n    <>\n      {(showTitle || showDescription) && (\n        <Box css={styles.titleGroup}>\n          {showTitle && <Card.Title css={styles.title}>{title}</Card.Title>}\n          {showDescription && <Card.Description css={styles.description}>{description}</Card.Description>}\n        </Box>\n      )}\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, css, ...rest } = props;\n  const styles = useStepsCardStyles();\n\n  return (\n    <Card.Footer ref={ref} css={[styles.footer, css]} {...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":";;;;;;;;AAcA,IAAM,2BAA2B;CAE/B,OADe,cAAc,EAAE,KAAK,YAAY,CACzC,CAAA,CAAO;AAChB;AAOA,IAAM,kBAAkB,YAAkD,OAAO,QAAQ;CACvF,MAAM,EAAE,UAAU,KAAK,MAAM,GAAG,SAAS;CACzC,MAAM,SAAS,mBAAmB;CAElC,OACE,oBAAC,kBAAD;EAAkB,OAAO,EAAE,KAAK;EAC9B,UAAA,oBAAC,KAAK,MAAN;GAAgB;GAAK,KAAK,CAAC,OAAO,MAAM,GAAG;GAAG,UAAA;GAAS,GAAI;GACxD;EACQ,CAAA;CACK,CAAA;AAEtB,CAAC;AAED,gBAAgB,cAAc;AAM9B,IAAM,wBAAwB,YAAwD,OAAO,QAAQ;CACnG,MAAM,EAAE,UAAU,KAAK,GAAG,SAAS;CACnC,MAAM,SAAS,mBAAmB;CAElC,OACE,oBAAC,KAAK,QAAN;EAAkB;EAAK,KAAK,CAAC,OAAO,QAAQ,GAAG;EAAG,GAAI;EACnD;CACU,CAAA;AAEjB,CAAC;AAED,sBAAsB,cAAc;AAMpC,IAAM,sBAAsB,YAAsD,OAAO,QAAQ;CAC/F,MAAM,EAAE,UAAU,KAAK,GAAG,SAAS;CACnC,MAAM,SAAS,mBAAmB;CAElC,OACE,oBAAC,KAAK,MAAN;EAAgB;EAAK,KAAK,CAAC,OAAO,MAAM,GAAG;EAAG,GAAI;EAC/C,UAAA,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;AAElC,IAAM,cAAc,SAAoB,SAAS,QAAQ,SAAS,KAAA,KAAa,SAAS;AAYxF,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,MAAM,YAAY,WAAW,KAAK;CAClC,MAAM,kBAAkB,WAAW,WAAW;CAE9C,OACE,qBAAAA,YAAA,EAAA,UAAA,EACI,aAAa,oBACb,qBAAC,KAAD;EAAK,KAAK,OAAO;EAAjB,UAAA,CACG,aAAa,oBAAC,KAAK,OAAN;GAAY,KAAK,OAAO;GAAQ,UAAA;EAAkB,CAAA,GAC/D,mBAAmB,oBAAC,KAAK,aAAN;GAAkB,KAAK,OAAO;GAAc,UAAA;EAA8B,CAAA,CAC3F;CAEN,CAAA,GAAA,QACD,EAAA,CAAA;AAEN;AAEA,oBAAoB,cAAc;AAMlC,IAAM,wBAAwB,YAAwD,OAAO,QAAQ;CACnG,MAAM,EAAE,UAAU,KAAK,GAAG,SAAS;CACnC,MAAM,SAAS,mBAAmB;CAElC,OACE,oBAAC,KAAK,QAAN;EAAkB;EAAK,KAAK,CAAC,OAAO,QAAQ,GAAG;EAAG,GAAI;EACnD;CACU,CAAA;AAEjB,CAAC;AAED,sBAAsB,cAAc;AAEpC,IAAA,0BAAe,kBAAkB,iBAAiB;CAChD,MAAM;CACN,QAAQ;CACR,QAAQ;CACR,MAAM;AACR,CAAC"}
+{"version":3,"file":"BitkitStepsCard.js","names":["_Fragment"],"sources":["../../../lib/components/BitkitStepsCard/BitkitStepsCard.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport {\n  Card,\n  type CardBodyProps,\n  type CardFooterProps,\n  type CardHeaderProps,\n  type CardRootProps,\n} from '@chakra-ui/react/card';\nimport { 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, css, step, ...rest } = props;\n  const styles = useStepsCardStyles();\n\n  return (\n    <StepCardProvider value={{ step }}>\n      <Card.Root ref={ref} css={[styles.root, css]} 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, css, ...rest } = props;\n  const styles = useStepsCardStyles();\n\n  return (\n    <Card.Header ref={ref} css={[styles.header, css]} {...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, css, ...rest } = props;\n  const styles = useStepsCardStyles();\n\n  return (\n    <Card.Body ref={ref} css={[styles.body, css]} {...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\nconst hasContent = (node: ReactNode) => node !== null && node !== undefined && node !== '';\n\nexport interface BitkitStepsCardStepProps {\n  children?: ReactNode;\n  description?: ReactNode;\n  /** The tag the title renders as, so it fits the page's outline: `h2` when nothing but the page header is above it. */\n  headingLevel?: 'h2' | 'h3' | 'h4' | 'h5' | 'h6';\n  title?: ReactNode;\n}\n\ninterface BitkitStepsCardStepInternalProps extends BitkitStepsCardStepProps {\n  _index?: number;\n}\n\nconst BitkitStepsCardStep = (props: BitkitStepsCardStepProps) => {\n  const { _index = 0, children, description, headingLevel = 'h3', title } = props as BitkitStepsCardStepInternalProps;\n  const { step } = useStepCardContext() ?? { step: 0 };\n  const styles = useStepsCardStyles();\n\n  if (_index !== step) return null;\n\n  const showTitle = hasContent(title);\n  const showDescription = hasContent(description);\n\n  return (\n    <>\n      {(showTitle || showDescription) && (\n        <Box css={styles.titleGroup}>\n          {showTitle && (\n            <Card.Title as={headingLevel} css={styles.title}>\n              {title}\n            </Card.Title>\n          )}\n          {showDescription && <Card.Description css={styles.description}>{description}</Card.Description>}\n        </Box>\n      )}\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, css, ...rest } = props;\n  const styles = useStepsCardStyles();\n\n  return (\n    <Card.Footer ref={ref} css={[styles.footer, css]} {...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":";;;;;;;;AAcA,IAAM,2BAA2B;CAE/B,OADe,cAAc,EAAE,KAAK,YAAY,CACzC,CAAA,CAAO;AAChB;AAOA,IAAM,kBAAkB,YAAkD,OAAO,QAAQ;CACvF,MAAM,EAAE,UAAU,KAAK,MAAM,GAAG,SAAS;CACzC,MAAM,SAAS,mBAAmB;CAElC,OACE,oBAAC,kBAAD;EAAkB,OAAO,EAAE,KAAK;EAC9B,UAAA,oBAAC,KAAK,MAAN;GAAgB;GAAK,KAAK,CAAC,OAAO,MAAM,GAAG;GAAG,UAAA;GAAS,GAAI;GACxD;EACQ,CAAA;CACK,CAAA;AAEtB,CAAC;AAED,gBAAgB,cAAc;AAM9B,IAAM,wBAAwB,YAAwD,OAAO,QAAQ;CACnG,MAAM,EAAE,UAAU,KAAK,GAAG,SAAS;CACnC,MAAM,SAAS,mBAAmB;CAElC,OACE,oBAAC,KAAK,QAAN;EAAkB;EAAK,KAAK,CAAC,OAAO,QAAQ,GAAG;EAAG,GAAI;EACnD;CACU,CAAA;AAEjB,CAAC;AAED,sBAAsB,cAAc;AAMpC,IAAM,sBAAsB,YAAsD,OAAO,QAAQ;CAC/F,MAAM,EAAE,UAAU,KAAK,GAAG,SAAS;CACnC,MAAM,SAAS,mBAAmB;CAElC,OACE,oBAAC,KAAK,MAAN;EAAgB;EAAK,KAAK,CAAC,OAAO,MAAM,GAAG;EAAG,GAAI;EAC/C,UAAA,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;AAElC,IAAM,cAAc,SAAoB,SAAS,QAAQ,SAAS,KAAA,KAAa,SAAS;AAcxF,IAAM,uBAAuB,UAAoC;CAC/D,MAAM,EAAE,SAAS,GAAG,UAAU,aAAa,eAAe,MAAM,UAAU;CAC1E,MAAM,EAAE,SAAS,mBAAmB,KAAK,EAAE,MAAM,EAAE;CACnD,MAAM,SAAS,mBAAmB;CAElC,IAAI,WAAW,MAAM,OAAO;CAE5B,MAAM,YAAY,WAAW,KAAK;CAClC,MAAM,kBAAkB,WAAW,WAAW;CAE9C,OACE,qBAAAA,YAAA,EAAA,UAAA,EACI,aAAa,oBACb,qBAAC,KAAD;EAAK,KAAK,OAAO;EAAjB,UAAA,CACG,aACC,oBAAC,KAAK,OAAN;GAAY,IAAI;GAAc,KAAK,OAAO;GACvC,UAAA;EACS,CAAA,GAEb,mBAAmB,oBAAC,KAAK,aAAN;GAAkB,KAAK,OAAO;GAAc,UAAA;EAA8B,CAAA,CAC3F;CAEN,CAAA,GAAA,QACD,EAAA,CAAA;AAEN;AAEA,oBAAoB,cAAc;AAMlC,IAAM,wBAAwB,YAAwD,OAAO,QAAQ;CACnG,MAAM,EAAE,UAAU,KAAK,GAAG,SAAS;CACnC,MAAM,SAAS,mBAAmB;CAElC,OACE,oBAAC,KAAK,QAAN;EAAkB;EAAK,KAAK,CAAC,OAAO,QAAQ,GAAG;EAAG,GAAI;EACnD;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/index.d.ts

@@ -15,6 +15,7 @@ export { default as BitkitCodeSnippet, type BitkitCodeSnippetProps } from './Bit
 export { default as BitkitCollapsible, type BitkitCollapsibleProps } from './BitkitCollapsible/BitkitCollapsible';
 export { default as BitkitColorButton, type BitkitColorButtonProps } from './BitkitColorButton/BitkitColorButton';
 export { default as BitkitCombobox, type BitkitComboboxProps } from './BitkitCombobox/BitkitCombobox';
+export { type BitkitContentWidth, default as BitkitContentWrapper, type BitkitContentWrapperProps, } from './BitkitContentWrapper/BitkitContentWrapper';
 export { default as BitkitControlButton, type BitkitControlButtonProps, } from './BitkitControlButton/BitkitControlButton';
 export { default as BitkitDataWidget, type BitkitDataWidgetProps } from './BitkitDataWidget/BitkitDataWidget';
 export { default as BitkitDatePicker, type BitkitDatePickerProps } from './BitkitDatePicker/BitkitDatePicker';
@@ -58,6 +59,7 @@ export { default as BitkitOverflowTooltip, type BitkitOverflowTooltipProps, } fr
 export { default as BitkitPageFooter, type BitkitPageFooterItemProps, type BitkitPageFooterProps, } from './BitkitPageFooter/BitkitPageFooter';
 export { default as BitkitPageHeader, type BitkitPageHeaderProps } from './BitkitPageHeader/BitkitPageHeader';
 export { default as BitkitPageSidebar, type BitkitPageSidebarBodyProps, type BitkitPageSidebarDividerProps, type BitkitPageSidebarDrawerHeaderProps, type BitkitPageSidebarFooterProps, type BitkitPageSidebarGroupHeadingProps, type BitkitPageSidebarItemProps, type BitkitPageSidebarProgressItemProps, type BitkitPageSidebarProjectProps, type BitkitPageSidebarProps, type BitkitPageSidebarTitleProps, } from './BitkitPageSidebar/BitkitPageSidebar';
+export { default as BitkitPageSubheader, type BitkitPageSubheaderProps, } from './BitkitPageSubheader/BitkitPageSubheader';
 export { default as BitkitPagination, type BitkitPaginationLabels, type BitkitPaginationProps, } from './BitkitPagination/BitkitPagination';
 export { default as BitkitPaginationLoadMore, type BitkitPaginationLoadMoreProps, } from './BitkitPaginationLoadMore/BitkitPaginationLoadMore';
 export { default as BitkitPopover, type BitkitPopoverProps } from './BitkitPopover/BitkitPopover';

package/dist/main.js

@@ -323,6 +323,7 @@ import BitkitLabel from "./components/BitkitLabel/BitkitLabel.js";
 import BitkitCollapsible from "./components/BitkitCollapsible/BitkitCollapsible.js";
 import BitkitField from "./components/BitkitField/BitkitField.js";
 import BitkitCombobox_default from "./components/BitkitCombobox/BitkitCombobox.js";
+import BitkitContentWrapper from "./components/BitkitContentWrapper/BitkitContentWrapper.js";
 import BitkitDataWidget from "./components/BitkitDataWidget/BitkitDataWidget.js";
 import BitkitDatePicker from "./components/BitkitDatePicker/BitkitDatePicker.js";
 import BitkitToggletip from "./components/BitkitToggletip/BitkitToggletip.js";
@@ -362,6 +363,7 @@ import BitkitOverflowTooltip from "./components/BitkitOverflowTooltip/BitkitOver
 import BitkitPageFooter_default from "./components/BitkitPageFooter/BitkitPageFooter.js";
 import BitkitPageHeader from "./components/BitkitPageHeader/BitkitPageHeader.js";
 import BitkitPageSidebar_default from "./components/BitkitPageSidebar/BitkitPageSidebar.js";
+import BitkitPageSubheader from "./components/BitkitPageSubheader/BitkitPageSubheader.js";
 import BitkitPagination from "./components/BitkitPagination/BitkitPagination.js";
 import BitkitPaginationLoadMore from "./components/BitkitPaginationLoadMore/BitkitPaginationLoadMore.js";
 import BitkitPopover from "./components/BitkitPopover/BitkitPopover.js";
@@ -397,4 +399,4 @@ import { uiSideNavRailWidth } from "./theme/slot-recipes/UISideNav.recipe.js";
 import BitkitUISideNav_default from "./components/BitkitUISideNav/BitkitUISideNav.js";
 import bitkitTheme from "./theme/index.js";
 import Provider from "./providers/BitkitProvider.js";
-export { BitbotLogoWithText, BitkitAccordion_default as BitkitAccordion, BitkitActionBar, BitkitActionMenu_default as BitkitActionMenu, BitkitAlert, BitkitAvatar, BitkitBadge, BitkitBreadcrumb, BitkitButton, BitkitCalendar, BitkitCheckbox, BitkitCheckboxGroup, BitkitCloseButton, BitkitCodeSnippet, BitkitCollapsible, BitkitColorButton, BitkitCombobox_default as BitkitCombobox, BitkitControlButton, BitkitDataWidget, BitkitDatePicker, BitkitDefinitionTooltip, BitkitDialog_default as BitkitDialog, BitkitDraggableCard, BitkitDrawer, BitkitEmptyState, BitkitExpandableCard, BitkitField, BitkitFileInput, BitkitFilter_default as BitkitFilter, BitkitFormDialog_default as BitkitFormDialog, BitkitGroupHeading, BitkitHeading, BitkitIconButton, BitkitInlineLoading, BitkitLabel, BitkitLabelTooltip, BitkitLabeledData, BitkitLightbox, BitkitLink, BitkitLinkButton, BitkitList_default as BitkitList, BitkitMarkdown, BitkitMarkdownCard, BitkitMultiselect_default as BitkitMultiselect, BitkitMultiselectMenu, BitkitNativeSelect, BitkitNoteCard, BitkitNumberInput, BitkitOverflowContent, BitkitOverflowTooltip, BitkitPageFooter_default as BitkitPageFooter, BitkitPageHeader, BitkitPageSidebar_default as BitkitPageSidebar, BitkitPagination, BitkitPaginationLoadMore, BitkitPopover, BitkitProgressBar, BitkitPromoBanner, 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, BitkitSkeletonGroup, BitkitSpinner, BitkitSplitButton_default as BitkitSplitButton, BitkitStat, BitkitSteps_default as BitkitSteps, BitkitStepsCard_default as BitkitStepsCard, BitkitStepsDialog_default as BitkitStepsDialog, BitkitSwitch, BitkitTable, BitkitTableCard, BitkitTabs, BitkitTag, BitkitTagsInput, BitkitTextArea, BitkitTextInput, BitkitToggleButton, BitkitToggletip, BitkitTooltip, BitkitTour, BitkitTreeView, BitkitUIHeader_default as BitkitUIHeader, BitkitUISideNav_default as BitkitUISideNav, 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, IconBitbotIntercomWhite, IconBitbucket, IconBitbucketColor, IconBitbucketNeutral, IconBitbucketWhite, IconBlockCircle, IconBook, IconBoxArrowDown, IconBoxDot, IconBoxLinesOverflow, IconBoxLinesWrap, IconBranch, IconBrowserstackColor, IconBug, IconBuild, IconBuildCache, IconBuildCacheFilled, IconBuildEnvSetup, IconBuildHub, IconBuildHubFilled, 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, IconCopilot, IconCopy, IconCordova, IconCpu, IconCreditcard, IconCredits, IconCross, IconCrossCircle, IconCrossCircleFilled, IconCrown, IconCursor, IconCycle, IconDashboard, IconDashboardFilled, IconDeployment, IconDetails, IconDoc, IconDollar, IconDot, IconDotnet, IconDotnetColor, IconDotnetText, IconDotnetTextColor, IconDoubleCircle, IconDownload, IconDragHandle, IconEc2Ami, IconEnterprise, IconErrorCircle, IconErrorCircleFilled, IconExpand, IconExtraBuildCapacity, IconEye, IconEyeSlash, IconFastlane, IconFile, IconFileDoc, IconFilePdf, IconFilePlist, IconFileYml, 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, IconKiroColor, IconKotlin, IconKotlinColor, IconKotlinWhite, IconLaptop, IconLaunchdarkly, IconLegacyApp, IconLightbulb, IconLink, IconLinux, IconLock, IconLockOpen, IconLogin, IconLogout, IconMacos, IconMagicWand, IconMagnifier, IconMail, IconMcp, IconMedal, IconMemory, IconMenuGrid, IconMenuHamburger, IconMessage, IconMessageAlert, IconMessageQuestion, IconMicrophone, IconMinus, IconMinusCircle, IconMinusCircleFilled, IconMobile, IconMobileLandscape, IconModeDark, IconModeLight, IconModeSystem, IconMonitorChart, IconMoreHorizontal, IconMoreVertical, IconNews, IconNextjs, IconNodejs, IconOpenInNew, IconOther, IconOutsideContributor, IconOverview, IconPause, IconPencil, IconPeople, IconPercent, IconPerson, IconPersonWithDesk, IconPin, 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, IconTabPlus, IconTag, IconTasks, IconTeams, IconTeamsColor, IconTemplateCode, IconTerminal, IconTerminalFilled, IconTestQuarantine, IconThemeDarkToggle, IconThumbDown, IconThumbUp, IconTools, IconTrash, IconTrigger, IconUbuntu, IconUbuntuColor, IconUnity3D, IconUnpin, IconUpload, IconValidateShield, IconVideo, IconVsCode, IconWarning, IconWarningYellow, IconWebUi, IconWebhooks, IconWindsurf, IconWorkflow, IconWorkflowFlow, IconXTwitter, IconXamarin, IconXcode, ResponsiveProvider, bitkitIcon, bitkitTheme as bitriseTheme, createBitkitToast, createTreeCollection, dismissBitkitToast, rem, uiHeaderHeight, uiHeaderHeightPx, uiSideNavRailWidth, useBitkitTour, useResponsive, useStepsDialog, useUISideNav };
+export { BitbotLogoWithText, BitkitAccordion_default as BitkitAccordion, BitkitActionBar, BitkitActionMenu_default as BitkitActionMenu, BitkitAlert, BitkitAvatar, BitkitBadge, BitkitBreadcrumb, BitkitButton, BitkitCalendar, BitkitCheckbox, BitkitCheckboxGroup, BitkitCloseButton, BitkitCodeSnippet, BitkitCollapsible, BitkitColorButton, BitkitCombobox_default as BitkitCombobox, BitkitContentWrapper, BitkitControlButton, BitkitDataWidget, BitkitDatePicker, BitkitDefinitionTooltip, BitkitDialog_default as BitkitDialog, BitkitDraggableCard, BitkitDrawer, BitkitEmptyState, BitkitExpandableCard, BitkitField, BitkitFileInput, BitkitFilter_default as BitkitFilter, BitkitFormDialog_default as BitkitFormDialog, BitkitGroupHeading, BitkitHeading, BitkitIconButton, BitkitInlineLoading, BitkitLabel, BitkitLabelTooltip, BitkitLabeledData, BitkitLightbox, BitkitLink, BitkitLinkButton, BitkitList_default as BitkitList, BitkitMarkdown, BitkitMarkdownCard, BitkitMultiselect_default as BitkitMultiselect, BitkitMultiselectMenu, BitkitNativeSelect, BitkitNoteCard, BitkitNumberInput, BitkitOverflowContent, BitkitOverflowTooltip, BitkitPageFooter_default as BitkitPageFooter, BitkitPageHeader, BitkitPageSidebar_default as BitkitPageSidebar, BitkitPageSubheader, BitkitPagination, BitkitPaginationLoadMore, BitkitPopover, BitkitProgressBar, BitkitPromoBanner, 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, BitkitSkeletonGroup, BitkitSpinner, BitkitSplitButton_default as BitkitSplitButton, BitkitStat, BitkitSteps_default as BitkitSteps, BitkitStepsCard_default as BitkitStepsCard, BitkitStepsDialog_default as BitkitStepsDialog, BitkitSwitch, BitkitTable, BitkitTableCard, BitkitTabs, BitkitTag, BitkitTagsInput, BitkitTextArea, BitkitTextInput, BitkitToggleButton, BitkitToggletip, BitkitTooltip, BitkitTour, BitkitTreeView, BitkitUIHeader_default as BitkitUIHeader, BitkitUISideNav_default as BitkitUISideNav, 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, IconBitbotIntercomWhite, IconBitbucket, IconBitbucketColor, IconBitbucketNeutral, IconBitbucketWhite, IconBlockCircle, IconBook, IconBoxArrowDown, IconBoxDot, IconBoxLinesOverflow, IconBoxLinesWrap, IconBranch, IconBrowserstackColor, IconBug, IconBuild, IconBuildCache, IconBuildCacheFilled, IconBuildEnvSetup, IconBuildHub, IconBuildHubFilled, 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, IconCopilot, IconCopy, IconCordova, IconCpu, IconCreditcard, IconCredits, IconCross, IconCrossCircle, IconCrossCircleFilled, IconCrown, IconCursor, IconCycle, IconDashboard, IconDashboardFilled, IconDeployment, IconDetails, IconDoc, IconDollar, IconDot, IconDotnet, IconDotnetColor, IconDotnetText, IconDotnetTextColor, IconDoubleCircle, IconDownload, IconDragHandle, IconEc2Ami, IconEnterprise, IconErrorCircle, IconErrorCircleFilled, IconExpand, IconExtraBuildCapacity, IconEye, IconEyeSlash, IconFastlane, IconFile, IconFileDoc, IconFilePdf, IconFilePlist, IconFileYml, 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, IconKiroColor, IconKotlin, IconKotlinColor, IconKotlinWhite, IconLaptop, IconLaunchdarkly, IconLegacyApp, IconLightbulb, IconLink, IconLinux, IconLock, IconLockOpen, IconLogin, IconLogout, IconMacos, IconMagicWand, IconMagnifier, IconMail, IconMcp, IconMedal, IconMemory, IconMenuGrid, IconMenuHamburger, IconMessage, IconMessageAlert, IconMessageQuestion, IconMicrophone, IconMinus, IconMinusCircle, IconMinusCircleFilled, IconMobile, IconMobileLandscape, IconModeDark, IconModeLight, IconModeSystem, IconMonitorChart, IconMoreHorizontal, IconMoreVertical, IconNews, IconNextjs, IconNodejs, IconOpenInNew, IconOther, IconOutsideContributor, IconOverview, IconPause, IconPencil, IconPeople, IconPercent, IconPerson, IconPersonWithDesk, IconPin, 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, IconTabPlus, IconTag, IconTasks, IconTeams, IconTeamsColor, IconTemplateCode, IconTerminal, IconTerminalFilled, IconTestQuarantine, IconThemeDarkToggle, IconThumbDown, IconThumbUp, IconTools, IconTrash, IconTrigger, IconUbuntu, IconUbuntuColor, IconUnity3D, IconUnpin, IconUpload, IconValidateShield, IconVideo, IconVsCode, IconWarning, IconWarningYellow, IconWebUi, IconWebhooks, IconWindsurf, IconWorkflow, IconWorkflowFlow, IconXTwitter, IconXamarin, IconXcode, ResponsiveProvider, bitkitIcon, bitkitTheme as bitriseTheme, createBitkitToast, createTreeCollection, dismissBitkitToast, rem, uiHeaderHeight, uiHeaderHeightPx, uiSideNavRailWidth, useBitkitTour, useResponsive, useStepsDialog, useUISideNav };

package/dist/theme/common/ContentWidth.common.d.ts

@@ -0,0 +1,20 @@
+/** The page content widths: a `layout/maxWidth` cap, padding included, or `full` for none. */
+declare const contentWidthStyles: {
+    readonly '640': {
+        readonly maxWidth: "layout/maxWidth/640";
+    };
+    readonly '960': {
+        readonly maxWidth: "layout/maxWidth/960";
+    };
+    readonly '1280': {
+        readonly maxWidth: "layout/maxWidth/1280";
+    };
+    readonly '1616': {
+        readonly maxWidth: "layout/maxWidth/1616";
+    };
+    readonly full: {};
+};
+export type ContentWidth = keyof typeof contentWidthStyles;
+/** The `maxWidth` token for a content width, or nothing for `full` and no width at all. */
+export declare const contentMaxWidth: (contentWidth?: ContentWidth) => "layout/maxWidth/640" | "layout/maxWidth/960" | "layout/maxWidth/1280" | "layout/maxWidth/1616" | undefined;
+export default contentWidthStyles;

package/dist/theme/common/ContentWidth.common.js

@@ -0,0 +1,15 @@
+//#region lib/theme/common/ContentWidth.common.ts
+/** The page content widths: a `layout/maxWidth` cap, padding included, or `full` for none. */
+var contentWidthStyles = {
+	"640": { maxWidth: "layout/maxWidth/640" },
+	"960": { maxWidth: "layout/maxWidth/960" },
+	"1280": { maxWidth: "layout/maxWidth/1280" },
+	"1616": { maxWidth: "layout/maxWidth/1616" },
+	full: {}
+};
+/** The `maxWidth` token for a content width, or nothing for `full` and no width at all. */
+var contentMaxWidth = (contentWidth) => contentWidth && contentWidth !== "full" ? contentWidthStyles[contentWidth].maxWidth : void 0;
+//#endregion
+export { contentMaxWidth, contentWidthStyles as default };
+
+//# sourceMappingURL=ContentWidth.common.js.map

package/dist/theme/common/ContentWidth.common.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ContentWidth.common.js","names":[],"sources":["../../../lib/theme/common/ContentWidth.common.ts"],"sourcesContent":["/** The page content widths: a `layout/maxWidth` cap, padding included, or `full` for none. */\nconst contentWidthStyles = {\n  '640': { maxWidth: 'layout/maxWidth/640' },\n  '960': { maxWidth: 'layout/maxWidth/960' },\n  '1280': { maxWidth: 'layout/maxWidth/1280' },\n  '1616': { maxWidth: 'layout/maxWidth/1616' },\n  full: {},\n} as const;\n\nexport type ContentWidth = keyof typeof contentWidthStyles;\n\n/** The `maxWidth` token for a content width, or nothing for `full` and no width at all. */\nexport const contentMaxWidth = (contentWidth?: ContentWidth) =>\n  contentWidth && contentWidth !== 'full' ? contentWidthStyles[contentWidth].maxWidth : undefined;\n\nexport default contentWidthStyles;\n"],"mappings":";;AACA,IAAM,qBAAqB;CACzB,OAAO,EAAE,UAAU,sBAAsB;CACzC,OAAO,EAAE,UAAU,sBAAsB;CACzC,QAAQ,EAAE,UAAU,uBAAuB;CAC3C,QAAQ,EAAE,UAAU,uBAAuB;CAC3C,MAAM,CAAC;AACT;;AAKA,IAAa,mBAAmB,iBAC9B,gBAAgB,iBAAiB,SAAS,mBAAmB,aAAa,CAAC,WAAW,KAAA"}

package/dist/theme/recipes/ContentWrapper.recipe.d.ts

@@ -0,0 +1,18 @@
+declare const contentWrapperRecipe: import('@chakra-ui/react').RecipeDefinition<{
+    contentWidth: {
+        readonly '640': {
+            readonly maxWidth: "layout/maxWidth/640";
+        };
+        readonly '960': {
+            readonly maxWidth: "layout/maxWidth/960";
+        };
+        readonly '1280': {
+            readonly maxWidth: "layout/maxWidth/1280";
+        };
+        readonly '1616': {
+            readonly maxWidth: "layout/maxWidth/1616";
+        };
+        readonly full: {};
+    };
+}>;
+export default contentWrapperRecipe;

package/dist/theme/recipes/ContentWrapper.recipe.js

@@ -0,0 +1,29 @@
+import contentWidthStyles from "../common/ContentWidth.common.js";
+import { defineRecipe } from "@chakra-ui/react/styled-system";
+//#region lib/theme/recipes/ContentWrapper.recipe.ts
+var contentWrapperRecipe = defineRecipe({
+	className: "content-wrapper",
+	base: {
+		columnGap: {
+			base: "32",
+			desktop: "64"
+		},
+		display: "grid",
+		gridTemplateColumns: "minmax(0, 1fr)",
+		"& > *": { minWidth: 0 },
+		marginInline: "auto",
+		paddingBlockEnd: "48",
+		paddingBlockStart: "32",
+		paddingInline: {
+			base: "16",
+			tablet: "32"
+		},
+		rowGap: "32",
+		width: "100%"
+	},
+	variants: { contentWidth: contentWidthStyles }
+});
+//#endregion
+export { contentWrapperRecipe as default };
+
+//# sourceMappingURL=ContentWrapper.recipe.js.map

package/dist/theme/recipes/ContentWrapper.recipe.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ContentWrapper.recipe.js","names":[],"sources":["../../../lib/theme/recipes/ContentWrapper.recipe.ts"],"sourcesContent":["import { defineRecipe } from '@chakra-ui/react/styled-system';\n\nimport contentWidthStyles from '../common/ContentWidth.common';\n\nconst contentWrapperRecipe = defineRecipe({\n  className: 'content-wrapper',\n  base: {\n    columnGap: { base: '32', desktop: '64' },\n    display: 'grid',\n    gridTemplateColumns: 'minmax(0, 1fr)',\n    // Lets a `1fr` column shrink below its content's width instead of overflowing the page.\n    '& > *': { minWidth: 0 },\n    marginInline: 'auto',\n    paddingBlockEnd: '48',\n    paddingBlockStart: '32',\n    paddingInline: { base: '16', tablet: '32' },\n    rowGap: '32',\n    width: '100%',\n  },\n  variants: {\n    contentWidth: contentWidthStyles,\n  },\n});\n\nexport default contentWrapperRecipe;\n"],"mappings":";;;AAIA,IAAM,uBAAuB,aAAa;CACxC,WAAW;CACX,MAAM;EACJ,WAAW;GAAE,MAAM;GAAM,SAAS;EAAK;EACvC,SAAS;EACT,qBAAqB;EAErB,SAAS,EAAE,UAAU,EAAE;EACvB,cAAc;EACd,iBAAiB;EACjB,mBAAmB;EACnB,eAAe;GAAE,MAAM;GAAM,QAAQ;EAAK;EAC1C,QAAQ;EACR,OAAO;CACT;CACA,UAAU,EACR,cAAc,mBAChB;AACF,CAAC"}

package/dist/theme/recipes/index.js

@@ -4,6 +4,7 @@ import textareaRecipe from "./Textarea.recipe.js";
 import badgeRecipe from "./Badge.recipe.js";
 import buttonRecipe from "./Button.recipe.js";
 import closeButtonRecipe from "./CloseButton.recipe.js";
+import contentWrapperRecipe from "./ContentWrapper.recipe.js";
 import controlButtonRecipe from "./ControlButton.recipe.js";
 import definitionTooltipRecipe from "./DefinitionTooltip.recipe.js";
 import iconRecipe from "./Icon.recipe.js";
@@ -23,6 +24,7 @@ var recipes = {
 	closeButton: closeButtonRecipe,
 	controlButton: controlButtonRecipe,
 	colorButton: colorButtonRecipe,
+	contentWrapper: contentWrapperRecipe,
 	definitionTooltip: definitionTooltipRecipe,
 	icon: iconRecipe,
 	input: inputRecipe,

package/dist/theme/recipes/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../lib/theme/recipes/index.ts"],"sourcesContent":["import badgeRecipe from './Badge.recipe';\nimport buttonRecipe from './Button.recipe';\nimport closeButtonRecipe from './CloseButton.recipe';\nimport colorButtonRecipe from './ColorButton.recipe';\nimport controlButtonRecipe from './ControlButton.recipe';\nimport definitionTooltipRecipe from './DefinitionTooltip.recipe';\nimport iconRecipe from './Icon.recipe';\nimport inputRecipe from './Input.recipe';\nimport inputAddonRecipe from './InputAddon.recipe';\nimport linkRecipe from './Link.recipe';\nimport linkButtonRecipe from './LinkButton.recipe';\nimport selectableTagRecipe from './SelectableTag.recipe';\nimport separatorRecipe from './Separator.recipe';\nimport skeletonRecipe from './Skeleton.recipe';\nimport spinnerRecipe from './Spinner.recipe';\nimport textareaRecipe from './Textarea.recipe';\nimport toggleButtonRecipe from './ToggleButton.recipe';\nimport uiHeaderButtonRecipe from './UIHeaderButton.recipe';\n\nconst recipes = {\n  badge: badgeRecipe,\n  button: buttonRecipe,\n  closeButton: closeButtonRecipe,\n  controlButton: controlButtonRecipe,\n  colorButton: colorButtonRecipe,\n  definitionTooltip: definitionTooltipRecipe,\n  icon: iconRecipe,\n  input: inputRecipe,\n  inputAddon: inputAddonRecipe,\n  link: linkRecipe,\n  linkButton: linkButtonRecipe,\n  selectableTag: selectableTagRecipe,\n  separator: separatorRecipe,\n  skeleton: skeletonRecipe,\n  spinner: spinnerRecipe,\n  textarea: textareaRecipe,\n  toggleButton: toggleButtonRecipe,\n  uiHeaderButton: uiHeaderButtonRecipe,\n};\n\nexport default recipes;\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAmBA,IAAM,UAAU;CACd,OAAO;CACP,QAAQ;CACR,aAAa;CACb,eAAe;CACf,aAAa;CACb,mBAAmB;CACnB,MAAM;CACN,OAAO;CACP,YAAY;CACZ,MAAM;CACN,YAAY;CACZ,eAAe;CACf,WAAW;CACX,UAAU;CACV,SAAS;CACT,UAAU;CACV,cAAc;CACd,gBAAgB;AAClB"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../lib/theme/recipes/index.ts"],"sourcesContent":["import badgeRecipe from './Badge.recipe';\nimport buttonRecipe from './Button.recipe';\nimport closeButtonRecipe from './CloseButton.recipe';\nimport colorButtonRecipe from './ColorButton.recipe';\nimport contentWrapperRecipe from './ContentWrapper.recipe';\nimport controlButtonRecipe from './ControlButton.recipe';\nimport definitionTooltipRecipe from './DefinitionTooltip.recipe';\nimport iconRecipe from './Icon.recipe';\nimport inputRecipe from './Input.recipe';\nimport inputAddonRecipe from './InputAddon.recipe';\nimport linkRecipe from './Link.recipe';\nimport linkButtonRecipe from './LinkButton.recipe';\nimport selectableTagRecipe from './SelectableTag.recipe';\nimport separatorRecipe from './Separator.recipe';\nimport skeletonRecipe from './Skeleton.recipe';\nimport spinnerRecipe from './Spinner.recipe';\nimport textareaRecipe from './Textarea.recipe';\nimport toggleButtonRecipe from './ToggleButton.recipe';\nimport uiHeaderButtonRecipe from './UIHeaderButton.recipe';\n\nconst recipes = {\n  badge: badgeRecipe,\n  button: buttonRecipe,\n  closeButton: closeButtonRecipe,\n  controlButton: controlButtonRecipe,\n  colorButton: colorButtonRecipe,\n  contentWrapper: contentWrapperRecipe,\n  definitionTooltip: definitionTooltipRecipe,\n  icon: iconRecipe,\n  input: inputRecipe,\n  inputAddon: inputAddonRecipe,\n  link: linkRecipe,\n  linkButton: linkButtonRecipe,\n  selectableTag: selectableTagRecipe,\n  separator: separatorRecipe,\n  skeleton: skeletonRecipe,\n  spinner: spinnerRecipe,\n  textarea: textareaRecipe,\n  toggleButton: toggleButtonRecipe,\n  uiHeaderButton: uiHeaderButtonRecipe,\n};\n\nexport default recipes;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAoBA,IAAM,UAAU;CACd,OAAO;CACP,QAAQ;CACR,aAAa;CACb,eAAe;CACf,aAAa;CACb,gBAAgB;CAChB,mBAAmB;CACnB,MAAM;CACN,OAAO;CACP,YAAY;CACZ,MAAM;CACN,YAAY;CACZ,eAAe;CACf,WAAW;CACX,UAAU;CACV,SAAS;CACT,UAAU;CACV,cAAc;CACd,gBAAgB;AAClB"}

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

@@ -27,13 +27,5 @@ declare const filterSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<
             };
         };
     };
-    contentAlign: {
-        center: {};
-        start: {
-            root: {
-                justifyContent: "flex-start";
-            };
-        };
-    };
 }>;
 export default filterSlotRecipe;

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

@@ -619,36 +619,30 @@ var filterSlotRecipe = defineSlotRecipe({
 			width: "48"
 		}
 	},
-	variants: {
-		pageLayout: {
-			capped: {
-				root: {
-					borderBlockEndWidth: "1",
-					borderColor: "border/regular",
-					paddingBlock: "12"
-				},
-				content: { paddingInline: {
-					base: "16",
-					tablet: "32"
-				} }
+	variants: { pageLayout: {
+		capped: {
+			root: {
+				borderBlockEndWidth: "1",
+				borderColor: "border/regular",
+				paddingBlock: "12"
 			},
-			full: {
-				root: {
-					borderBlockEndWidth: "1",
-					borderColor: "border/regular",
-					paddingBlock: "12"
-				},
-				content: { paddingInline: {
-					base: "16",
-					tablet: "32"
-				} }
-			}
-		},
-		contentAlign: {
-			center: {},
-			start: { root: { justifyContent: "flex-start" } }
+			content: { paddingInline: {
+				base: "16",
+				tablet: "32"
+			} }
+		},
+		full: {
+			root: {
+				borderBlockEndWidth: "1",
+				borderColor: "border/regular",
+				paddingBlock: "12"
+			},
+			content: { paddingInline: {
+				base: "16",
+				tablet: "32"
+			} }
 		}
-	}
+	} }
 });
 //#endregion
 export { filterSlotRecipe as default };

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

@@ -1 +1 @@
-{"version":3,"file":"Filter.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Filter.recipe.ts"],"sourcesContent":["import { defineSlotRecipe, type SystemStyleObject } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nconst chipButton: SystemStyleObject = {\n  alignItems: 'center',\n  alignSelf: 'stretch',\n  display: 'flex',\n  _hover: {\n    background: 'background/hover',\n    _active: {\n      background: 'background/active',\n    },\n  },\n  _active: {\n    background: 'background/active',\n  },\n  _disabled: {\n    cursor: 'not-allowed',\n    '& :is(span, svg)': {\n      color: 'text/disabled',\n    },\n    _hover: {\n      background: 'transparent',\n    },\n  },\n};\n\n// The keyboard focus ring for a wrapper whose input has no outline of its own. Chakra's `focusRing`\n// only fires on the focused element itself, so the global ring variables are applied directly.\nconst wrapperFocusRing: SystemStyleObject = {\n  outlineColor: 'var(--focus-ring-color)',\n  outlineOffset: 'var(--focus-ring-offset)',\n  outlineStyle: 'var(--focus-ring-style)',\n  outlineWidth: 'var(--focus-ring-width)',\n};\n\nconst switchItemDisabled: SystemStyleObject = {\n  color: 'text/disabled',\n  cursor: 'not-allowed',\n  '& svg': {\n    color: 'icon/disabled',\n  },\n  _hover: {\n    background: 'transparent',\n    color: 'text/disabled',\n    _active: {\n      background: 'transparent',\n    },\n  },\n  _active: {\n    background: 'transparent',\n  },\n  _checked: {\n    _hover: {\n      background: 'background/primary',\n      _active: {\n        background: 'background/primary',\n      },\n    },\n    _active: {\n      background: 'background/primary',\n    },\n  },\n};\n\nconst filterSlotRecipe = defineSlotRecipe({\n  className: 'filter',\n  slots: [\n    'root',\n    'content',\n    'filters',\n    'icon',\n    'items',\n    'searchBlock',\n    'search',\n    'searchInput',\n    'switch',\n    'switchItem',\n    'switchItemText',\n    'chip',\n    'chipTrigger',\n    'chipLabel',\n    'chipValue',\n    'chipIcon',\n    'chipChevron',\n    'chipRemove',\n    'popoverContent',\n    'addMenu',\n    'addMenuItem',\n    'addMenuLabel',\n    'addMenuIcon',\n    'addSheetBackdrop',\n    'addSheetPositioner',\n    'addSheet',\n    'addSheetItem',\n    'addSheetItemReason',\n    'calendarFooter',\n    'popoverSearch',\n    'popoverBody',\n    'popoverFooter',\n    'popoverFooterStart',\n    'checkboxList',\n    'listHelperText',\n    'loading',\n    'pattern',\n    'patternResults',\n    'patternResultsLabel',\n    'mobileBar',\n    'mobileTrigger',\n    'mobileSearch',\n    'mobileSearchInput',\n    'mobileHeader',\n    'mobileTitle',\n    'mobilePanelHeader',\n    'mobilePanelOverline',\n    'mobilePanelTitle',\n    'mobileBody',\n    'mobileFooter',\n    'mobileListCheck',\n    'mobileListCheckbox',\n    'field',\n    'fieldLabel',\n    'fieldControl',\n    'fieldTrigger',\n    'fieldIcon',\n    'fieldValue',\n    'fieldChevron',\n    'fieldRemove',\n  ],\n  base: {\n    // No padding of its own: placed like any block, its edges line up with what's around it.\n    root: {\n      background: 'background/primary',\n      display: 'flex',\n      justifyContent: 'center',\n    },\n    content: {\n      alignItems: 'flex-start',\n      display: 'flex',\n      flex: '1',\n      gap: '16',\n      minWidth: 0,\n    },\n    filters: {\n      alignItems: 'flex-start',\n      display: 'flex',\n      flex: '1',\n      gap: '12',\n      minWidth: 0,\n    },\n    icon: {\n      color: 'icon/tertiary',\n      // Flex, so the inline svg's line box adds no extra height.\n      display: 'flex',\n      flexShrink: 0,\n      padding: '4',\n    },\n    items: {\n      alignItems: 'center',\n      display: 'flex',\n      flex: '1',\n      flexWrap: 'wrap',\n      gap: '12',\n      minWidth: 0,\n    },\n    searchBlock: {\n      alignSelf: 'stretch',\n      borderColor: 'border/minimal',\n      borderInlineStartWidth: '1',\n      display: 'flex',\n      flexShrink: 0,\n      paddingInlineStart: '16',\n    },\n    search: {\n      alignItems: 'center',\n      background: 'background/primary',\n      borderRadius: '4',\n      cursor: 'text',\n      color: 'icon/tertiary',\n      display: 'flex',\n      gap: '8',\n      // As tall as the chips, so the bar is no taller than a row of them.\n      height: '32',\n      paddingInline: '8',\n      width: rem(148),\n      _hover: {\n        background: 'background/secondary',\n      },\n      '&:has(input:focus-visible)': wrapperFocusRing,\n    },\n    searchInput: {\n      background: 'transparent',\n      color: 'input/text/inputValue',\n      flex: '1',\n      minWidth: 0,\n      outline: 'none',\n      textStyle: 'body/md/regular',\n      _placeholder: {\n        color: 'input/text/placeholder',\n      },\n      // The clear button replaces the native cancel glyph of `type=\"search\"`.\n      '&::-webkit-search-cancel-button': {\n        appearance: 'none',\n      },\n    },\n    switch: {\n      background: 'background/secondary',\n      borderRadius: '4',\n      display: 'inline-flex',\n      flexShrink: 0,\n      position: 'relative',\n    },\n    switchItem: {\n      alignItems: 'center',\n      borderRadius: '4',\n      color: 'text/secondary',\n      cursor: 'pointer',\n      display: 'flex',\n      gap: '4',\n      height: '32',\n      paddingInline: '8',\n      position: 'relative',\n      textStyle: 'body/md/regular',\n      whiteSpace: 'nowrap',\n      // An item's own `iconColor` is left alone, except when disabled.\n      '& svg:not([data-own-color])': {\n        color: 'icon/tertiary',\n      },\n      // Divider after an unselected item, hidden next to the selected or hovered one.\n      _after: {\n        background: 'border/regular',\n        content: '\"\"',\n        height: '16',\n        insetInlineEnd: 0,\n        position: 'absolute',\n        top: '8',\n        width: '1',\n      },\n      '&:last-of-type, &[data-state=checked], &:hover, &:has(+ [data-state=checked]), &:has(+ :hover)': {\n        _after: {\n          display: 'none',\n        },\n      },\n      '&:has(input:focus-visible)': wrapperFocusRing,\n      _hover: {\n        background: 'background/hover',\n        color: 'text/primary',\n        '& svg:not([data-own-color])': {\n          color: 'icon/secondary',\n        },\n        _active: {\n          background: 'background/active',\n        },\n      },\n      _active: {\n        background: 'background/active',\n        color: 'text/primary',\n      },\n      _checked: {\n        background: 'background/primary',\n        // Inset, so the selected item is no taller than the others.\n        boxShadow: 'inset 0 0 0 1px var(--colors-border\\\\/strong)',\n        color: 'text/primary',\n        '& svg:not([data-own-color])': {\n          color: 'icon/secondary',\n        },\n        _hover: {\n          background: 'background/primary',\n        },\n      },\n      // Read-only while the page loads, so the item keeps a focus handed to it; it looks disabled.\n      _disabled: switchItemDisabled,\n      _readOnly: switchItemDisabled,\n    },\n    switchItemText: {\n      paddingInline: '4',\n    },\n    chip: {\n      alignItems: 'center',\n      background: 'background/primary',\n      borderColor: 'border/strong',\n      borderRadius: '4',\n      borderWidth: '1',\n      display: 'inline-flex',\n      height: '32',\n      maxWidth: rem(320),\n      minWidth: 0,\n      overflow: 'hidden',\n      textStyle: 'body/md/regular',\n      '&:has(button:is(:disabled, [aria-disabled=true]))': {\n        borderColor: 'border/disabled',\n      },\n      // The chip's popover is open: Zag marks the trigger inside it as expanded.\n      '&:has([aria-expanded=true])': {\n        boxShadow: '0 0 0 0.125rem var(--focus-ring-color)',\n        // Figma's selected chip stays white, even under the pointer that just opened it.\n        '& button, & button:hover': {\n          background: 'background/primary',\n        },\n      },\n      // The date chip's trigger sits inside the calendar's root and control divs; they stretch like a direct child would.\n      '& [data-scope=date-picker]:is([data-part=root], [data-part=control])': {\n        alignSelf: 'stretch',\n        flex: '1',\n        minWidth: 0,\n      },\n    },\n    chipTrigger: {\n      ...chipButton,\n      flex: '1',\n      gap: '4',\n      minWidth: 0,\n      paddingInlineEnd: '8',\n      paddingInlineStart: '12',\n      whiteSpace: 'nowrap',\n      '&:has([data-chip-icon])': {\n        paddingInlineStart: '8',\n      },\n      '&:is(:hover, :active) [data-chip-icon]': {\n        color: 'icon/secondary',\n      },\n    },\n    chipLabel: {\n      color: 'text/secondary',\n      flexShrink: 0,\n    },\n    chipValue: {\n      color: 'text/body',\n      minWidth: 0,\n      truncate: true,\n    },\n    chipIcon: {\n      color: 'icon/tertiary',\n      flexShrink: 0,\n      marginInlineEnd: '4',\n    },\n    chipChevron: {\n      color: 'icon/primary',\n      flexShrink: 0,\n      marginInlineStart: '8',\n    },\n    chipRemove: {\n      ...chipButton,\n      color: 'icon/primary',\n      flexShrink: 0,\n      paddingInlineEnd: '8',\n      paddingInlineStart: '4',\n    },\n    popoverContent: {\n      // The popover's 60vh cap, or less where the space next to the bar is shorter.\n      maxHeight: 'min(60vh, var(--available-height, 60vh))',\n      // As wide as its content: at least its chip and 320px, at most 800px.\n      maxWidth: rem(800),\n      minWidth: 'max(var(--reference-width, 0px), 20rem)',\n      width: 'max-content',\n      // The wildcard pattern's explanation would otherwise stretch it to its widest.\n      '&:has([data-filter-pattern])': {\n        width: rem(480),\n      },\n      // The footer's top padding is the gap under the list, so the list adds none of its own.\n      '& [data-scope=listbox][data-part=content]': {\n        paddingBlockEnd: 0,\n      },\n    },\n    addMenu: {\n      background: 'background/primary',\n      borderRadius: '8',\n      boxShadow: 'elevation/lg',\n      display: 'flex',\n      flexDirection: 'column',\n      maxHeight: 'var(--available-height)',\n      outline: 'none',\n      overflowY: 'auto',\n      paddingBlock: '8',\n      width: rem(240),\n      zIndex: 'popover',\n    },\n    addMenuItem: {\n      alignItems: 'center',\n      color: 'text/body',\n      cursor: 'pointer',\n      display: 'flex',\n      gap: '4',\n      minHeight: '40',\n      paddingBlock: '8',\n      paddingInline: '16',\n      textStyle: 'body/md/regular',\n      userSelect: 'none',\n      _highlighted: {\n        background: 'background/hover',\n        _active: {\n          background: 'background/active',\n        },\n      },\n      _active: {\n        background: 'background/active',\n      },\n      _disabled: {\n        color: 'text/disabled',\n        cursor: 'not-allowed',\n        _highlighted: {\n          background: 'transparent',\n        },\n        // Not applicable yet: `aria-disabled` but reachable, so the keyboard highlight still shows.\n        '&[data-not-applicable]': {\n          color: 'text/tertiary',\n          _highlighted: {\n            background: 'background/hover',\n          },\n        },\n      },\n      // The chevron only shows on the row under the pointer or keyboard.\n      '&:not([data-highlighted]) [data-add-chevron]': {\n        visibility: 'hidden',\n      },\n    },\n    addMenuLabel: {\n      color: 'text/tertiary',\n      paddingBlock: '8',\n      paddingInline: '16',\n      textStyle: 'heading/h6',\n    },\n    addMenuIcon: {\n      color: 'icon/tertiary',\n      flexShrink: 0,\n      marginInlineStart: 'auto',\n    },\n    addSheetBackdrop: {\n      background: 'utilities/overlay-light',\n      inset: 0,\n      position: 'fixed',\n      zIndex: 'calc({zIndex.dialogOverlay} + var(--layer-index, 0))',\n    },\n    addSheetPositioner: {\n      alignItems: 'flex-end',\n      display: 'flex',\n      inset: 0,\n      justifyContent: 'stretch',\n      padding: '16',\n      position: 'fixed',\n      zIndex: 'calc({zIndex.dialog} + var(--layer-index, 0))',\n    },\n    addSheet: {\n      background: 'background/primary',\n      borderRadius: '8',\n      boxShadow: 'elevation/lg',\n      display: 'flex',\n      flex: '1',\n      flexDirection: 'column',\n      maxHeight: '80dvh',\n      outline: 'none',\n      overflowY: 'auto',\n      paddingBlock: '8',\n    },\n    addSheetItem: {\n      ...chipButton,\n      alignSelf: 'auto',\n      color: 'text/body',\n      gap: '12',\n      minHeight: '48',\n      paddingBlock: '8',\n      paddingInline: '16',\n      textAlign: 'start',\n      textStyle: 'body/lg/regular',\n      _disabled: {\n        color: 'text/disabled',\n        cursor: 'not-allowed',\n        _hover: {\n          background: 'transparent',\n        },\n        '&[data-not-applicable]': {\n          color: 'text/tertiary',\n          '& :is(span, svg)': {\n            color: 'text/tertiary',\n          },\n        },\n      },\n    },\n    addSheetItemReason: {\n      color: 'text/tertiary',\n      textStyle: 'body/sm/regular',\n    },\n    calendarFooter: {\n      alignItems: 'center',\n      display: 'flex',\n      gap: '8',\n      marginBlockStart: '24',\n    },\n    popoverSearch: {\n      flexShrink: 0,\n      paddingBlockEnd: '8',\n      paddingBlockStart: '8',\n      paddingInline: '12',\n    },\n    // When the popover is capped by the space available, the list (or pattern results) gives way and\n    // scrolls on its own, rather than running under the footer: every part may shrink below its content.\n    popoverBody: {\n      display: 'flex',\n      flexDirection: 'column',\n      minHeight: 0,\n      '& > *, & [data-scope=listbox]:is([data-part=root], [data-part=content])': {\n        minHeight: 0,\n      },\n      '& [data-scope=listbox][data-part=root]': {\n        display: 'flex',\n        flexDirection: 'column',\n      },\n    },\n    popoverFooter: {\n      alignItems: 'center',\n      display: 'flex',\n      gap: '8',\n      paddingBlockEnd: '16',\n      paddingBlockStart: '24',\n      paddingInline: '16',\n    },\n    popoverFooterStart: {\n      flex: '1',\n    },\n    checkboxList: {\n      maxHeight: rem(200),\n      overflowY: 'auto',\n      // Room for the last checkbox's check mark, drawn 1px past its box, so a short list doesn't scroll.\n      paddingBlockEnd: '1',\n      paddingBlockStart: '8',\n      paddingInline: '20',\n      // An option's icon: secondary, primary while hovered, interactive once checked.\n      '& [data-option-icon]': {\n        color: 'icon/secondary',\n      },\n      '& [data-scope=checkbox][data-part=root]:hover [data-option-icon]': {\n        color: 'icon/primary',\n      },\n      '& [data-scope=checkbox][data-part=root][data-state=checked] [data-option-icon]': {\n        color: 'icon/interactive',\n      },\n    },\n    listHelperText: {\n      color: 'text/secondary',\n      textStyle: 'body/sm/regular',\n    },\n    loading: {\n      paddingBlock: '8',\n      paddingInline: '16',\n    },\n    pattern: {\n      display: 'flex',\n      flexDirection: 'column',\n      gap: '24',\n      paddingBlockStart: '8',\n      paddingInline: '16',\n    },\n    patternResults: {\n      display: 'flex',\n      flexDirection: 'column',\n      gap: '8',\n      maxHeight: rem(176),\n      minHeight: 0,\n      overflowY: 'auto',\n    },\n    patternResultsLabel: {\n      color: 'text/primary',\n      textStyle: 'comp/input/label',\n    },\n    mobileBar: {\n      alignItems: 'center',\n      borderBlockEndWidth: '1',\n      borderColor: 'border/minimal',\n      display: 'flex',\n      gap: '12',\n      justifyContent: 'space-between',\n      padding: '16',\n    },\n    mobileTrigger: {\n      ...chipButton,\n      alignSelf: 'auto',\n      background: 'background/primary',\n      borderColor: 'border/strong',\n      borderRadius: '4',\n      borderWidth: '1',\n      color: 'text/primary',\n      gap: '8',\n      height: '32',\n      paddingInline: '8',\n      textStyle: 'comp/button/sm',\n      _icon: {\n        color: 'icon/primary',\n      },\n      _disabled: {\n        borderColor: 'border/disabled',\n        color: 'text/disabled',\n        _icon: {\n          color: 'icon/disabled',\n        },\n      },\n    },\n    mobileSearch: {\n      alignItems: 'center',\n      borderBlockEndWidth: '1',\n      borderColor: 'border/minimal',\n      cursor: 'text',\n      color: 'icon/tertiary',\n      display: 'flex',\n      gap: '12',\n      height: rem(56),\n      paddingInline: '16',\n      // Drawn inside, since the row runs edge to edge.\n      '&:has(input:focus-visible)': {\n        ...wrapperFocusRing,\n        outlineOffset: 'calc(var(--focus-ring-width) * -1)',\n      },\n    },\n    mobileSearchInput: {\n      background: 'transparent',\n      color: 'input/text/inputValue',\n      flex: '1',\n      minWidth: 0,\n      outline: 'none',\n      textStyle: 'body/lg/regular',\n      _placeholder: {\n        color: 'input/text/placeholder',\n      },\n      '&::-webkit-search-cancel-button': {\n        appearance: 'none',\n      },\n    },\n    mobileHeader: {\n      alignItems: 'center',\n      borderBlockEndWidth: '1',\n      borderColor: 'border/minimal',\n      display: 'flex',\n      flexShrink: 0,\n      gap: '12',\n      // Matches the docked drawer's body and footer inset.\n      paddingBlock: '16',\n      paddingInline: { base: '16', tablet: '24' },\n    },\n    mobileTitle: {\n      color: 'text/primary',\n      flex: '1',\n      textStyle: 'heading/mobile/h2',\n    },\n    mobilePanelHeader: {\n      alignItems: 'center',\n      borderBlockEndWidth: '1',\n      borderColor: 'border/minimal',\n      display: 'flex',\n      flexShrink: 0,\n      gap: '12',\n      paddingBlock: '12',\n      // Matches the docked drawer's footer inset.\n      paddingInline: { base: '16', tablet: '24' },\n    },\n    mobilePanelOverline: {\n      color: 'text/tertiary',\n      textStyle: 'heading/h6',\n    },\n    mobilePanelTitle: {\n      color: 'text/primary',\n      textStyle: 'heading/mobile/h3',\n    },\n    // The docked drawer pads the body and footer itself.\n    mobileBody: {\n      display: 'flex',\n      flexDirection: 'column',\n      gap: '16',\n    },\n    mobileFooter: {\n      display: 'flex',\n      gap: '12',\n      '& > *': {\n        flex: '1',\n      },\n    },\n    // Drawn in front of the label on mobile, with its column kept on unselected rows so the labels line up.\n    mobileListCheck: {\n      color: 'icon/interactive',\n      display: 'flex',\n      flexShrink: 0,\n      '&[data-state=unchecked]': {\n        visibility: 'hidden',\n      },\n    },\n    mobileListCheckbox: {\n      flexShrink: 0,\n    },\n    field: {\n      display: 'flex',\n      flexDirection: 'column',\n      gap: '8',\n    },\n    fieldLabel: {\n      color: 'text/primary',\n      textStyle: 'comp/input/label',\n    },\n    fieldControl: {\n      background: 'background/primary',\n      borderColor: 'border/strong',\n      borderRadius: '4',\n      borderWidth: '1',\n      display: 'flex',\n      height: '48',\n      overflow: 'hidden',\n      '&:has(button:is(:disabled, [aria-disabled=true]))': {\n        borderColor: 'border/disabled',\n      },\n    },\n    fieldTrigger: {\n      ...chipButton,\n      flex: '1',\n      gap: '8',\n      minWidth: 0,\n      paddingInline: '16',\n      textAlign: 'start',\n      textStyle: 'body/lg/regular',\n    },\n    fieldIcon: {\n      color: 'icon/secondary',\n      flexShrink: 0,\n    },\n    fieldValue: {\n      color: 'text/body',\n      flex: '1',\n      minWidth: 0,\n      truncate: true,\n    },\n    fieldChevron: {\n      color: 'icon/primary',\n      flexShrink: 0,\n    },\n    fieldRemove: {\n      ...chipButton,\n      color: 'icon/primary',\n      flexShrink: 0,\n      justifyContent: 'center',\n      width: '48',\n    },\n  },\n  variants: {\n    // Under a page header: a bottom border and the page's inline padding. `capped` is the centred\n    // column, `full` the full-width one.\n    // The inline padding sits inside the capped content, as in `BitkitPageHeader`: the cap includes it,\n    // so the bar and the header share their left edge.\n    pageLayout: {\n      capped: {\n        root: {\n          borderBlockEndWidth: '1',\n          borderColor: 'border/regular',\n          paddingBlock: '12',\n        },\n        content: {\n          paddingInline: { base: '16', tablet: '32' },\n        },\n      },\n      full: {\n        root: {\n          borderBlockEndWidth: '1',\n          borderColor: 'border/regular',\n          paddingBlock: '12',\n        },\n        content: {\n          paddingInline: { base: '16', tablet: '32' },\n        },\n      },\n    },\n    contentAlign: {\n      center: {},\n      start: {\n        root: {\n          justifyContent: 'flex-start',\n        },\n      },\n    },\n  },\n});\n\nexport default filterSlotRecipe;\n"],"mappings":";;;AAIA,IAAM,aAAgC;CACpC,YAAY;CACZ,WAAW;CACX,SAAS;CACT,QAAQ;EACN,YAAY;EACZ,SAAS,EACP,YAAY,oBACd;CACF;CACA,SAAS,EACP,YAAY,oBACd;CACA,WAAW;EACT,QAAQ;EACR,oBAAoB,EAClB,OAAO,gBACT;EACA,QAAQ,EACN,YAAY,cACd;CACF;AACF;AAIA,IAAM,mBAAsC;CAC1C,cAAc;CACd,eAAe;CACf,cAAc;CACd,cAAc;AAChB;AAEA,IAAM,qBAAwC;CAC5C,OAAO;CACP,QAAQ;CACR,SAAS,EACP,OAAO,gBACT;CACA,QAAQ;EACN,YAAY;EACZ,OAAO;EACP,SAAS,EACP,YAAY,cACd;CACF;CACA,SAAS,EACP,YAAY,cACd;CACA,UAAU;EACR,QAAQ;GACN,YAAY;GACZ,SAAS,EACP,YAAY,qBACd;EACF;EACA,SAAS,EACP,YAAY,qBACd;CACF;AACF;AAEA,IAAM,mBAAmB,iBAAiB;CACxC,WAAW;CACX,OAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF;CACA,MAAM;EAEJ,MAAM;GACJ,YAAY;GACZ,SAAS;GACT,gBAAgB;EAClB;EACA,SAAS;GACP,YAAY;GACZ,SAAS;GACT,MAAM;GACN,KAAK;GACL,UAAU;EACZ;EACA,SAAS;GACP,YAAY;GACZ,SAAS;GACT,MAAM;GACN,KAAK;GACL,UAAU;EACZ;EACA,MAAM;GACJ,OAAO;GAEP,SAAS;GACT,YAAY;GACZ,SAAS;EACX;EACA,OAAO;GACL,YAAY;GACZ,SAAS;GACT,MAAM;GACN,UAAU;GACV,KAAK;GACL,UAAU;EACZ;EACA,aAAa;G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"}
+{"version":3,"file":"Filter.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Filter.recipe.ts"],"sourcesContent":["import { defineSlotRecipe, type SystemStyleObject } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nconst chipButton: SystemStyleObject = {\n  alignItems: 'center',\n  alignSelf: 'stretch',\n  display: 'flex',\n  _hover: {\n    background: 'background/hover',\n    _active: {\n      background: 'background/active',\n    },\n  },\n  _active: {\n    background: 'background/active',\n  },\n  _disabled: {\n    cursor: 'not-allowed',\n    '& :is(span, svg)': {\n      color: 'text/disabled',\n    },\n    _hover: {\n      background: 'transparent',\n    },\n  },\n};\n\n// The keyboard focus ring for a wrapper whose input has no outline of its own. Chakra's `focusRing`\n// only fires on the focused element itself, so the global ring variables are applied directly.\nconst wrapperFocusRing: SystemStyleObject = {\n  outlineColor: 'var(--focus-ring-color)',\n  outlineOffset: 'var(--focus-ring-offset)',\n  outlineStyle: 'var(--focus-ring-style)',\n  outlineWidth: 'var(--focus-ring-width)',\n};\n\nconst switchItemDisabled: SystemStyleObject = {\n  color: 'text/disabled',\n  cursor: 'not-allowed',\n  '& svg': {\n    color: 'icon/disabled',\n  },\n  _hover: {\n    background: 'transparent',\n    color: 'text/disabled',\n    _active: {\n      background: 'transparent',\n    },\n  },\n  _active: {\n    background: 'transparent',\n  },\n  _checked: {\n    _hover: {\n      background: 'background/primary',\n      _active: {\n        background: 'background/primary',\n      },\n    },\n    _active: {\n      background: 'background/primary',\n    },\n  },\n};\n\nconst filterSlotRecipe = defineSlotRecipe({\n  className: 'filter',\n  slots: [\n    'root',\n    'content',\n    'filters',\n    'icon',\n    'items',\n    'searchBlock',\n    'search',\n    'searchInput',\n    'switch',\n    'switchItem',\n    'switchItemText',\n    'chip',\n    'chipTrigger',\n    'chipLabel',\n    'chipValue',\n    'chipIcon',\n    'chipChevron',\n    'chipRemove',\n    'popoverContent',\n    'addMenu',\n    'addMenuItem',\n    'addMenuLabel',\n    'addMenuIcon',\n    'addSheetBackdrop',\n    'addSheetPositioner',\n    'addSheet',\n    'addSheetItem',\n    'addSheetItemReason',\n    'calendarFooter',\n    'popoverSearch',\n    'popoverBody',\n    'popoverFooter',\n    'popoverFooterStart',\n    'checkboxList',\n    'listHelperText',\n    'loading',\n    'pattern',\n    'patternResults',\n    'patternResultsLabel',\n    'mobileBar',\n    'mobileTrigger',\n    'mobileSearch',\n    'mobileSearchInput',\n    'mobileHeader',\n    'mobileTitle',\n    'mobilePanelHeader',\n    'mobilePanelOverline',\n    'mobilePanelTitle',\n    'mobileBody',\n    'mobileFooter',\n    'mobileListCheck',\n    'mobileListCheckbox',\n    'field',\n    'fieldLabel',\n    'fieldControl',\n    'fieldTrigger',\n    'fieldIcon',\n    'fieldValue',\n    'fieldChevron',\n    'fieldRemove',\n  ],\n  base: {\n    // No padding of its own: placed like any block, its edges line up with what's around it.\n    root: {\n      background: 'background/primary',\n      display: 'flex',\n      justifyContent: 'center',\n    },\n    content: {\n      alignItems: 'flex-start',\n      display: 'flex',\n      flex: '1',\n      gap: '16',\n      minWidth: 0,\n    },\n    filters: {\n      alignItems: 'flex-start',\n      display: 'flex',\n      flex: '1',\n      gap: '12',\n      minWidth: 0,\n    },\n    icon: {\n      color: 'icon/tertiary',\n      // Flex, so the inline svg's line box adds no extra height.\n      display: 'flex',\n      flexShrink: 0,\n      padding: '4',\n    },\n    items: {\n      alignItems: 'center',\n      display: 'flex',\n      flex: '1',\n      flexWrap: 'wrap',\n      gap: '12',\n      minWidth: 0,\n    },\n    searchBlock: {\n      alignSelf: 'stretch',\n      borderColor: 'border/minimal',\n      borderInlineStartWidth: '1',\n      display: 'flex',\n      flexShrink: 0,\n      paddingInlineStart: '16',\n    },\n    search: {\n      alignItems: 'center',\n      background: 'background/primary',\n      borderRadius: '4',\n      cursor: 'text',\n      color: 'icon/tertiary',\n      display: 'flex',\n      gap: '8',\n      // As tall as the chips, so the bar is no taller than a row of them.\n      height: '32',\n      paddingInline: '8',\n      width: rem(148),\n      _hover: {\n        background: 'background/secondary',\n      },\n      '&:has(input:focus-visible)': wrapperFocusRing,\n    },\n    searchInput: {\n      background: 'transparent',\n      color: 'input/text/inputValue',\n      flex: '1',\n      minWidth: 0,\n      outline: 'none',\n      textStyle: 'body/md/regular',\n      _placeholder: {\n        color: 'input/text/placeholder',\n      },\n      // The clear button replaces the native cancel glyph of `type=\"search\"`.\n      '&::-webkit-search-cancel-button': {\n        appearance: 'none',\n      },\n    },\n    switch: {\n      background: 'background/secondary',\n      borderRadius: '4',\n      display: 'inline-flex',\n      flexShrink: 0,\n      position: 'relative',\n    },\n    switchItem: {\n      alignItems: 'center',\n      borderRadius: '4',\n      color: 'text/secondary',\n      cursor: 'pointer',\n      display: 'flex',\n      gap: '4',\n      height: '32',\n      paddingInline: '8',\n      position: 'relative',\n      textStyle: 'body/md/regular',\n      whiteSpace: 'nowrap',\n      // An item's own `iconColor` is left alone, except when disabled.\n      '& svg:not([data-own-color])': {\n        color: 'icon/tertiary',\n      },\n      // Divider after an unselected item, hidden next to the selected or hovered one.\n      _after: {\n        background: 'border/regular',\n        content: '\"\"',\n        height: '16',\n        insetInlineEnd: 0,\n        position: 'absolute',\n        top: '8',\n        width: '1',\n      },\n      '&:last-of-type, &[data-state=checked], &:hover, &:has(+ [data-state=checked]), &:has(+ :hover)': {\n        _after: {\n          display: 'none',\n        },\n      },\n      '&:has(input:focus-visible)': wrapperFocusRing,\n      _hover: {\n        background: 'background/hover',\n        color: 'text/primary',\n        '& svg:not([data-own-color])': {\n          color: 'icon/secondary',\n        },\n        _active: {\n          background: 'background/active',\n        },\n      },\n      _active: {\n        background: 'background/active',\n        color: 'text/primary',\n      },\n      _checked: {\n        background: 'background/primary',\n        // Inset, so the selected item is no taller than the others.\n        boxShadow: 'inset 0 0 0 1px var(--colors-border\\\\/strong)',\n        color: 'text/primary',\n        '& svg:not([data-own-color])': {\n          color: 'icon/secondary',\n        },\n        _hover: {\n          background: 'background/primary',\n        },\n      },\n      // Read-only while the page loads, so the item keeps a focus handed to it; it looks disabled.\n      _disabled: switchItemDisabled,\n      _readOnly: switchItemDisabled,\n    },\n    switchItemText: {\n      paddingInline: '4',\n    },\n    chip: {\n      alignItems: 'center',\n      background: 'background/primary',\n      borderColor: 'border/strong',\n      borderRadius: '4',\n      borderWidth: '1',\n      display: 'inline-flex',\n      height: '32',\n      maxWidth: rem(320),\n      minWidth: 0,\n      overflow: 'hidden',\n      textStyle: 'body/md/regular',\n      '&:has(button:is(:disabled, [aria-disabled=true]))': {\n        borderColor: 'border/disabled',\n      },\n      // The chip's popover is open: Zag marks the trigger inside it as expanded.\n      '&:has([aria-expanded=true])': {\n        boxShadow: '0 0 0 0.125rem var(--focus-ring-color)',\n        // Figma's selected chip stays white, even under the pointer that just opened it.\n        '& button, & button:hover': {\n          background: 'background/primary',\n        },\n      },\n      // The date chip's trigger sits inside the calendar's root and control divs; they stretch like a direct child would.\n      '& [data-scope=date-picker]:is([data-part=root], [data-part=control])': {\n        alignSelf: 'stretch',\n        flex: '1',\n        minWidth: 0,\n      },\n    },\n    chipTrigger: {\n      ...chipButton,\n      flex: '1',\n      gap: '4',\n      minWidth: 0,\n      paddingInlineEnd: '8',\n      paddingInlineStart: '12',\n      whiteSpace: 'nowrap',\n      '&:has([data-chip-icon])': {\n        paddingInlineStart: '8',\n      },\n      '&:is(:hover, :active) [data-chip-icon]': {\n        color: 'icon/secondary',\n      },\n    },\n    chipLabel: {\n      color: 'text/secondary',\n      flexShrink: 0,\n    },\n    chipValue: {\n      color: 'text/body',\n      minWidth: 0,\n      truncate: true,\n    },\n    chipIcon: {\n      color: 'icon/tertiary',\n      flexShrink: 0,\n      marginInlineEnd: '4',\n    },\n    chipChevron: {\n      color: 'icon/primary',\n      flexShrink: 0,\n      marginInlineStart: '8',\n    },\n    chipRemove: {\n      ...chipButton,\n      color: 'icon/primary',\n      flexShrink: 0,\n      paddingInlineEnd: '8',\n      paddingInlineStart: '4',\n    },\n    popoverContent: {\n      // The popover's 60vh cap, or less where the space next to the bar is shorter.\n      maxHeight: 'min(60vh, var(--available-height, 60vh))',\n      // As wide as its content: at least its chip and 320px, at most 800px.\n      maxWidth: rem(800),\n      minWidth: 'max(var(--reference-width, 0px), 20rem)',\n      width: 'max-content',\n      // The wildcard pattern's explanation would otherwise stretch it to its widest.\n      '&:has([data-filter-pattern])': {\n        width: rem(480),\n      },\n      // The footer's top padding is the gap under the list, so the list adds none of its own.\n      '& [data-scope=listbox][data-part=content]': {\n        paddingBlockEnd: 0,\n      },\n    },\n    addMenu: {\n      background: 'background/primary',\n      borderRadius: '8',\n      boxShadow: 'elevation/lg',\n      display: 'flex',\n      flexDirection: 'column',\n      maxHeight: 'var(--available-height)',\n      outline: 'none',\n      overflowY: 'auto',\n      paddingBlock: '8',\n      width: rem(240),\n      zIndex: 'popover',\n    },\n    addMenuItem: {\n      alignItems: 'center',\n      color: 'text/body',\n      cursor: 'pointer',\n      display: 'flex',\n      gap: '4',\n      minHeight: '40',\n      paddingBlock: '8',\n      paddingInline: '16',\n      textStyle: 'body/md/regular',\n      userSelect: 'none',\n      _highlighted: {\n        background: 'background/hover',\n        _active: {\n          background: 'background/active',\n        },\n      },\n      _active: {\n        background: 'background/active',\n      },\n      _disabled: {\n        color: 'text/disabled',\n        cursor: 'not-allowed',\n        _highlighted: {\n          background: 'transparent',\n        },\n        // Not applicable yet: `aria-disabled` but reachable, so the keyboard highlight still shows.\n        '&[data-not-applicable]': {\n          color: 'text/tertiary',\n          _highlighted: {\n            background: 'background/hover',\n          },\n        },\n      },\n      // The chevron only shows on the row under the pointer or keyboard.\n      '&:not([data-highlighted]) [data-add-chevron]': {\n        visibility: 'hidden',\n      },\n    },\n    addMenuLabel: {\n      color: 'text/tertiary',\n      paddingBlock: '8',\n      paddingInline: '16',\n      textStyle: 'heading/h6',\n    },\n    addMenuIcon: {\n      color: 'icon/tertiary',\n      flexShrink: 0,\n      marginInlineStart: 'auto',\n    },\n    addSheetBackdrop: {\n      background: 'utilities/overlay-light',\n      inset: 0,\n      position: 'fixed',\n      zIndex: 'calc({zIndex.dialogOverlay} + var(--layer-index, 0))',\n    },\n    addSheetPositioner: {\n      alignItems: 'flex-end',\n      display: 'flex',\n      inset: 0,\n      justifyContent: 'stretch',\n      padding: '16',\n      position: 'fixed',\n      zIndex: 'calc({zIndex.dialog} + var(--layer-index, 0))',\n    },\n    addSheet: {\n      background: 'background/primary',\n      borderRadius: '8',\n      boxShadow: 'elevation/lg',\n      display: 'flex',\n      flex: '1',\n      flexDirection: 'column',\n      maxHeight: '80dvh',\n      outline: 'none',\n      overflowY: 'auto',\n      paddingBlock: '8',\n    },\n    addSheetItem: {\n      ...chipButton,\n      alignSelf: 'auto',\n      color: 'text/body',\n      gap: '12',\n      minHeight: '48',\n      paddingBlock: '8',\n      paddingInline: '16',\n      textAlign: 'start',\n      textStyle: 'body/lg/regular',\n      _disabled: {\n        color: 'text/disabled',\n        cursor: 'not-allowed',\n        _hover: {\n          background: 'transparent',\n        },\n        '&[data-not-applicable]': {\n          color: 'text/tertiary',\n          '& :is(span, svg)': {\n            color: 'text/tertiary',\n          },\n        },\n      },\n    },\n    addSheetItemReason: {\n      color: 'text/tertiary',\n      textStyle: 'body/sm/regular',\n    },\n    calendarFooter: {\n      alignItems: 'center',\n      display: 'flex',\n      gap: '8',\n      marginBlockStart: '24',\n    },\n    popoverSearch: {\n      flexShrink: 0,\n      paddingBlockEnd: '8',\n      paddingBlockStart: '8',\n      paddingInline: '12',\n    },\n    // When the popover is capped by the space available, the list (or pattern results) gives way and\n    // scrolls on its own, rather than running under the footer: every part may shrink below its content.\n    popoverBody: {\n      display: 'flex',\n      flexDirection: 'column',\n      minHeight: 0,\n      '& > *, & [data-scope=listbox]:is([data-part=root], [data-part=content])': {\n        minHeight: 0,\n      },\n      '& [data-scope=listbox][data-part=root]': {\n        display: 'flex',\n        flexDirection: 'column',\n      },\n    },\n    popoverFooter: {\n      alignItems: 'center',\n      display: 'flex',\n      gap: '8',\n      paddingBlockEnd: '16',\n      paddingBlockStart: '24',\n      paddingInline: '16',\n    },\n    popoverFooterStart: {\n      flex: '1',\n    },\n    checkboxList: {\n      maxHeight: rem(200),\n      overflowY: 'auto',\n      // Room for the last checkbox's check mark, drawn 1px past its box, so a short list doesn't scroll.\n      paddingBlockEnd: '1',\n      paddingBlockStart: '8',\n      paddingInline: '20',\n      // An option's icon: secondary, primary while hovered, interactive once checked.\n      '& [data-option-icon]': {\n        color: 'icon/secondary',\n      },\n      '& [data-scope=checkbox][data-part=root]:hover [data-option-icon]': {\n        color: 'icon/primary',\n      },\n      '& [data-scope=checkbox][data-part=root][data-state=checked] [data-option-icon]': {\n        color: 'icon/interactive',\n      },\n    },\n    listHelperText: {\n      color: 'text/secondary',\n      textStyle: 'body/sm/regular',\n    },\n    loading: {\n      paddingBlock: '8',\n      paddingInline: '16',\n    },\n    pattern: {\n      display: 'flex',\n      flexDirection: 'column',\n      gap: '24',\n      paddingBlockStart: '8',\n      paddingInline: '16',\n    },\n    patternResults: {\n      display: 'flex',\n      flexDirection: 'column',\n      gap: '8',\n      maxHeight: rem(176),\n      minHeight: 0,\n      overflowY: 'auto',\n    },\n    patternResultsLabel: {\n      color: 'text/primary',\n      textStyle: 'comp/input/label',\n    },\n    mobileBar: {\n      alignItems: 'center',\n      borderBlockEndWidth: '1',\n      borderColor: 'border/minimal',\n      display: 'flex',\n      gap: '12',\n      justifyContent: 'space-between',\n      padding: '16',\n    },\n    mobileTrigger: {\n      ...chipButton,\n      alignSelf: 'auto',\n      background: 'background/primary',\n      borderColor: 'border/strong',\n      borderRadius: '4',\n      borderWidth: '1',\n      color: 'text/primary',\n      gap: '8',\n      height: '32',\n      paddingInline: '8',\n      textStyle: 'comp/button/sm',\n      _icon: {\n        color: 'icon/primary',\n      },\n      _disabled: {\n        borderColor: 'border/disabled',\n        color: 'text/disabled',\n        _icon: {\n          color: 'icon/disabled',\n        },\n      },\n    },\n    mobileSearch: {\n      alignItems: 'center',\n      borderBlockEndWidth: '1',\n      borderColor: 'border/minimal',\n      cursor: 'text',\n      color: 'icon/tertiary',\n      display: 'flex',\n      gap: '12',\n      height: rem(56),\n      paddingInline: '16',\n      // Drawn inside, since the row runs edge to edge.\n      '&:has(input:focus-visible)': {\n        ...wrapperFocusRing,\n        outlineOffset: 'calc(var(--focus-ring-width) * -1)',\n      },\n    },\n    mobileSearchInput: {\n      background: 'transparent',\n      color: 'input/text/inputValue',\n      flex: '1',\n      minWidth: 0,\n      outline: 'none',\n      textStyle: 'body/lg/regular',\n      _placeholder: {\n        color: 'input/text/placeholder',\n      },\n      '&::-webkit-search-cancel-button': {\n        appearance: 'none',\n      },\n    },\n    mobileHeader: {\n      alignItems: 'center',\n      borderBlockEndWidth: '1',\n      borderColor: 'border/minimal',\n      display: 'flex',\n      flexShrink: 0,\n      gap: '12',\n      // Matches the docked drawer's body and footer inset.\n      paddingBlock: '16',\n      paddingInline: { base: '16', tablet: '24' },\n    },\n    mobileTitle: {\n      color: 'text/primary',\n      flex: '1',\n      textStyle: 'heading/mobile/h2',\n    },\n    mobilePanelHeader: {\n      alignItems: 'center',\n      borderBlockEndWidth: '1',\n      borderColor: 'border/minimal',\n      display: 'flex',\n      flexShrink: 0,\n      gap: '12',\n      paddingBlock: '12',\n      // Matches the docked drawer's footer inset.\n      paddingInline: { base: '16', tablet: '24' },\n    },\n    mobilePanelOverline: {\n      color: 'text/tertiary',\n      textStyle: 'heading/h6',\n    },\n    mobilePanelTitle: {\n      color: 'text/primary',\n      textStyle: 'heading/mobile/h3',\n    },\n    // The docked drawer pads the body and footer itself.\n    mobileBody: {\n      display: 'flex',\n      flexDirection: 'column',\n      gap: '16',\n    },\n    mobileFooter: {\n      display: 'flex',\n      gap: '12',\n      '& > *': {\n        flex: '1',\n      },\n    },\n    // Drawn in front of the label on mobile, with its column kept on unselected rows so the labels line up.\n    mobileListCheck: {\n      color: 'icon/interactive',\n      display: 'flex',\n      flexShrink: 0,\n      '&[data-state=unchecked]': {\n        visibility: 'hidden',\n      },\n    },\n    mobileListCheckbox: {\n      flexShrink: 0,\n    },\n    field: {\n      display: 'flex',\n      flexDirection: 'column',\n      gap: '8',\n    },\n    fieldLabel: {\n      color: 'text/primary',\n      textStyle: 'comp/input/label',\n    },\n    fieldControl: {\n      background: 'background/primary',\n      borderColor: 'border/strong',\n      borderRadius: '4',\n      borderWidth: '1',\n      display: 'flex',\n      height: '48',\n      overflow: 'hidden',\n      '&:has(button:is(:disabled, [aria-disabled=true]))': {\n        borderColor: 'border/disabled',\n      },\n    },\n    fieldTrigger: {\n      ...chipButton,\n      flex: '1',\n      gap: '8',\n      minWidth: 0,\n      paddingInline: '16',\n      textAlign: 'start',\n      textStyle: 'body/lg/regular',\n    },\n    fieldIcon: {\n      color: 'icon/secondary',\n      flexShrink: 0,\n    },\n    fieldValue: {\n      color: 'text/body',\n      flex: '1',\n      minWidth: 0,\n      truncate: true,\n    },\n    fieldChevron: {\n      color: 'icon/primary',\n      flexShrink: 0,\n    },\n    fieldRemove: {\n      ...chipButton,\n      color: 'icon/primary',\n      flexShrink: 0,\n      justifyContent: 'center',\n      width: '48',\n    },\n  },\n  variants: {\n    // Under a page header: a bottom border and the page's inline padding. `capped` is the centred\n    // column, `full` the full-width one.\n    // The inline padding sits inside the capped content, as in `BitkitPageHeader`: the cap includes it,\n    // so the bar and the header share their left edge.\n    pageLayout: {\n      capped: {\n        root: {\n          borderBlockEndWidth: '1',\n          borderColor: 'border/regular',\n          paddingBlock: '12',\n        },\n        content: {\n          paddingInline: { base: '16', tablet: '32' },\n        },\n      },\n      full: {\n        root: {\n          borderBlockEndWidth: '1',\n          borderColor: 'border/regular',\n          paddingBlock: '12',\n        },\n        content: {\n          paddingInline: { base: '16', tablet: '32' },\n        },\n      },\n    },\n  },\n});\n\nexport default filterSlotRecipe;\n"],"mappings":";;;AAIA,IAAM,aAAgC;CACpC,YAAY;CACZ,WAAW;CACX,SAAS;CACT,QAAQ;EACN,YAAY;EACZ,SAAS,EACP,YAAY,oBACd;CACF;CACA,SAAS,EACP,YAAY,oBACd;CACA,WAAW;EACT,QAAQ;EACR,oBAAoB,EAClB,OAAO,gBACT;EACA,QAAQ,EACN,YAAY,cACd;CACF;AACF;AAIA,IAAM,mBAAsC;CAC1C,cAAc;CACd,eAAe;CACf,cAAc;CACd,cAAc;AAChB;AAEA,IAAM,qBAAwC;CAC5C,OAAO;CACP,QAAQ;CACR,SAAS,EACP,OAAO,gBACT;CACA,QAAQ;EACN,YAAY;EACZ,OAAO;EACP,SAAS,EACP,YAAY,cACd;CACF;CACA,SAAS,EACP,YAAY,cACd;CACA,UAAU;EACR,QAAQ;GACN,YAAY;GACZ,SAAS,EACP,YAAY,qBACd;EACF;EACA,SAAS,EACP,YAAY,qBACd;CACF;AACF;AAEA,IAAM,mBAAmB,iBAAiB;CACxC,WAAW;CACX,OAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF;CACA,MAAM;EAEJ,MAAM;GACJ,YAAY;GACZ,SAAS;GACT,gBAAgB;EAClB;EACA,SAAS;GACP,YAAY;GACZ,SAAS;GACT,MAAM;GACN,KAAK;GACL,UAAU;EACZ;EACA,SAAS;GACP,YAAY;GACZ,SAAS;GACT,MAAM;GACN,KAAK;GACL,UAAU;EACZ;EACA,MAAM;GACJ,OAAO;GAEP,SAAS;GACT,YAAY;GACZ,SAAS;EACX;EACA,OAAO;GACL,YAAY;GACZ,SAAS;GACT,MAAM;GACN,UAAU;GACV,KAAK;GACL,UAAU;EACZ;EACA,aAAa;G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"}

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

@@ -239,46 +239,29 @@ declare const pageHeaderSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinit
         };
     };
     /**
-     * Lines the content block up with the page content below, leaving the root full-width — so the
-     * header's background and bottom border run edge to edge while the title sits where the content
-     * does. The cap, when there is one, is a `maxWidth` the component sets from `contentWidth`, since
-     * a recipe variant cannot carry an arbitrary length; `contentAlign` places it, and does nothing
-     * when `contentWidth` is `'full'` and there is no cap.
+     * Lines the content up with the page content below, leaving the root full-width — so the header's background and
+     * bottom border run edge to edge while the title and the tabs sit where the content does. The cap is a `maxWidth`
+     * the component sets from `contentWidth`; the auto margins centre it, and resolve to nothing when there is no cap.
      *
-     * The design's centred frame pads both sides with 32, where the default header starts at 24.
-     * Only from `tablet`: below it the base 16 stands, matching what a content column pads with
-     * there, while the cap itself stays unscoped so the two track each other at every width.
+     * The design's centred frame pads both sides with 32, where the default header starts at 24. Only from `tablet`:
+     * below it the base 16 stands, matching what a content column pads with there.
      *
-     * The collapsed row (`isSticky`, `minimal`) resets the start padding to 24 under the same
-     * `tablet` key and wins that merge, so the 32 is restated there by a compound variant — see
-     * `contentAlignedCollapsed`.
+     * The collapsed row (`isSticky`, `minimal`) resets the start padding to 24 under the same `tablet` key and wins
+     * that merge, so the 32 is restated there by a compound variant — see `contentAlignedCollapsed`.
      */
     alignsToContent: {
         true: {
             headerBlock: {
+                marginInline: "auto";
                 tablet: {
                     paddingInlineStart: "32";
                 };
             };
-        };
-        false: {};
-    };
-    /**
-     * Where the capped block sits in the full-width root: centred over a centred content column, or
-     * at the start over one that starts against a sidebar. Without a cap the block spans the root, so
-     * the auto margins resolve to nothing and either value renders the same.
-     */
-    contentAlign: {
-        center: {
-            headerBlock: {
+            tabs: {
                 marginInline: "auto";
             };
         };
-        start: {
-            headerBlock: {
-                marginInlineEnd: "auto";
-            };
-        };
+        false: {};
     };
 }>;
 export default pageHeaderSlotRecipe;

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

@@ -206,6 +206,10 @@ var pageHeaderSlotRecipe = defineSlotRecipe({
 			width: "100%"
 		},
 		titleBlock: {
+			alignSelf: {
+				base: "stretch",
+				tablet: "auto"
+			},
 			display: "flex",
 			flex: "1 0 0",
 			minWidth: 0
@@ -434,37 +438,29 @@ var pageHeaderSlotRecipe = defineSlotRecipe({
 			minimal: collapsedSlots
 		},
 		/**
-		* Lines the content block up with the page content below, leaving the root full-width — so the
-		* header's background and bottom border run edge to edge while the title sits where the content
-		* does. The cap, when there is one, is a `maxWidth` the component sets from `contentWidth`, since
-		* a recipe variant cannot carry an arbitrary length; `contentAlign` places it, and does nothing
-		* when `contentWidth` is `'full'` and there is no cap.
+		* Lines the content up with the page content below, leaving the root full-width — so the header's background and
+		* bottom border run edge to edge while the title and the tabs sit where the content does. The cap is a `maxWidth`
+		* the component sets from `contentWidth`; the auto margins centre it, and resolve to nothing when there is no cap.
 		*
-		* The design's centred frame pads both sides with 32, where the default header starts at 24.
-		* Only from `tablet`: below it the base 16 stands, matching what a content column pads with
-		* there, while the cap itself stays unscoped so the two track each other at every width.
+		* The design's centred frame pads both sides with 32, where the default header starts at 24. Only from `tablet`:
+		* below it the base 16 stands, matching what a content column pads with there.
 		*
-		* The collapsed row (`isSticky`, `minimal`) resets the start padding to 24 under the same
-		* `tablet` key and wins that merge, so the 32 is restated there by a compound variant — see
-		* `contentAlignedCollapsed`.
+		* The collapsed row (`isSticky`, `minimal`) resets the start padding to 24 under the same `tablet` key and wins
+		* that merge, so the 32 is restated there by a compound variant — see `contentAlignedCollapsed`.
 		*/
 		alignsToContent: {
-			true: { headerBlock: { tablet: { paddingInlineStart: "32" } } },
+			true: {
+				headerBlock: {
+					marginInline: "auto",
+					tablet: { paddingInlineStart: "32" }
+				},
+				tabs: { marginInline: "auto" }
+			},
 			false: {}
-		},
-		/**
-		* Where the capped block sits in the full-width root: centred over a centred content column, or
-		* at the start over one that starts against a sidebar. Without a cap the block spans the root, so
-		* the auto margins resolve to nothing and either value renders the same.
-		*/
-		contentAlign: {
-			center: { headerBlock: { marginInline: "auto" } },
-			start: { headerBlock: { marginInlineEnd: "auto" } }
 		}
 	},
 	defaultVariants: {
 		alignsToContent: false,
-		contentAlign: "center",
 		contentVariant: "title",
 		hasBreadcrumb: false,
 		hasControls: false,