npm - @bitrise/bitkit-v2 - Versions diffs - 0.3.480-beta.3052 → 0.3.481-beta.3055 - Mend

@bitrise/bitkit-v2 0.3.480-beta.3052 → 0.3.481-beta.3055

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (139) hide show

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

@@ -0,0 +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 root: {\n background: 'background/primary',\n display: 'flex',\n justifyContent: 'center',\n paddingBlock: '12',\n paddingInline: '16',\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 paddingBlock: '4',\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 color: 'icon/tertiary',\n display: 'flex',\n gap: '8',\n height: '40',\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 width: rem(480),\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 paddingInlineEnd: '24',\n paddingInlineStart: '16',\n },\n popoverFooterStart: {\n flex: '1',\n },\n checkboxList: {\n maxHeight: rem(200),\n overflowY: 'auto',\n paddingBlockEnd: '16',\n paddingBlockStart: '8',\n paddingInline: '20',\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 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, which starts at 24 like the default `BitkitPageHeader`.\n pageLayout: {\n capped: {\n root: {\n borderBlockEndWidth: '1',\n borderColor: 'border/regular',\n paddingInline: { base: '16', tablet: '32' },\n },\n },\n full: {\n root: {\n borderBlockEndWidth: '1',\n borderColor: 'border/regular',\n paddingInlineEnd: { base: '16', tablet: '32' },\n paddingInlineStart: { base: '16', tablet: '24' },\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;EACJ,MAAM;GACJ,YAAY;GACZ,SAAS;GACT,gBAAgB;GAChB,cAAc;GACd,eAAe;EACjB;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;GACV,cAAc;EAChB;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;GACX,WAAW;GACX,aAAa;GACb,wBAAwB;GACxB,SAAS;GACT,YAAY;GACZ,oBAAoB;EACtB;EACA,QAAQ;GACN,YAAY;GACZ,YAAY;GACZ,cAAc;GACd,OAAO;GACP,SAAS;GACT,KAAK;GACL,QAAQ;GACR,eAAe;GACf,OAAO,IAAI,GAAG;GACd,QAAQ,EACN,YAAY,uBACd;GACA,8BAA8B;EAChC;EACA,aAAa;GACX,YAAY;GACZ,OAAO;GACP,MAAM;GACN,UAAU;GACV,SAAS;GACT,WAAW;GACX,cAAc,EACZ,OAAO,yBACT;GAEA,mCAAmC,EACjC,YAAY,OACd;EACF;EACA,QAAQ;GACN,YAAY;GACZ,cAAc;GACd,SAAS;GACT,YAAY;GACZ,UAAU;EACZ;EACA,YAAY;GACV,YAAY;GACZ,cAAc;GACd,OAAO;GACP,QAAQ;GACR,SAAS;GACT,KAAK;GACL,QAAQ;GACR,eAAe;GACf,UAAU;GACV,WAAW;GACX,YAAY;GAEZ,+BAA+B,EAC7B,OAAO,gBACT;GAEA,QAAQ;IACN,YAAY;IACZ,SAAS;IACT,QAAQ;IACR,gBAAgB;IAChB,UAAU;IACV,KAAK;IACL,OAAO;GACT;GACA,kGAAkG,EAChG,QAAQ,EACN,SAAS,OACX,EACF;GACA,8BAA8B;GAC9B,QAAQ;IACN,YAAY;IACZ,OAAO;IACP,+BAA+B,EAC7B,OAAO,iBACT;IACA,SAAS,EACP,YAAY,oBACd;GACF;GACA,SAAS;IACP,YAAY;IACZ,OAAO;GACT;GACA,UAAU;IACR,YAAY;IAEZ,WAAW;IACX,OAAO;IACP,+BAA+B,EAC7B,OAAO,iBACT;IACA,QAAQ,EACN,YAAY,qBACd;GACF;GAEA,WAAW;GACX,WAAW;EACb;EACA,gBAAgB,EACd,eAAe,IACjB;EACA,MAAM;GACJ,YAAY;GACZ,YAAY;GACZ,aAAa;GACb,cAAc;GACd,aAAa;GACb,SAAS;GACT,QAAQ;GACR,UAAU,IAAI,GAAG;GACjB,UAAU;GACV,UAAU;GACV,WAAW;GACX,qDAAqD,EACnD,aAAa,kBACf;GAEA,+BAA+B;IAC7B,WAAW;IAEX,4BAA4B,EAC1B,YAAY,qBACd;GACF;GAEA,wEAAwE;IACtE,WAAW;IACX,MAAM;IACN,UAAU;GACZ;EACF;EACA,aAAa;GACX,GAAG;GACH,MAAM;GACN,KAAK;GACL,UAAU;GACV,kBAAkB;GAClB,oBAAoB;GACpB,YAAY;GACZ,2BAA2B,EACzB,oBAAoB,IACtB;GACA,0CAA0C,EACxC,OAAO,iBACT;EACF;EACA,WAAW;GACT,OAAO;GACP,YAAY;EACd;EACA,WAAW;GACT,OAAO;GACP,UAAU;GACV,UAAU;EACZ;EACA,UAAU;GACR,OAAO;GACP,YAAY;GACZ,iBAAiB;EACnB;EACA,aAAa;GACX,OAAO;GACP,YAAY;GACZ,mBAAmB;EACrB;EACA,YAAY;GACV,GAAG;GACH,OAAO;GACP,YAAY;GACZ,kBAAkB;GAClB,oBAAoB;EACtB;EACA,gBAAgB;GAEd,WAAW;GACX,OAAO,IAAI,GAAG;EAChB;EACA,SAAS;GACP,YAAY;GACZ,cAAc;GACd,WAAW;GACX,SAAS;GACT,eAAe;GACf,WAAW;GACX,SAAS;GACT,WAAW;GACX,cAAc;GACd,OAAO,IAAI,GAAG;GACd,QAAQ;EACV;EACA,aAAa;GACX,YAAY;GACZ,OAAO;GACP,QAAQ;GACR,SAAS;GACT,KAAK;GACL,WAAW;GACX,cAAc;GACd,eAAe;GACf,WAAW;GACX,YAAY;GACZ,cAAc;IACZ,YAAY;IACZ,SAAS,EACP,YAAY,oBACd;GACF;GACA,SAAS,EACP,YAAY,oBACd;GACA,WAAW;IACT,OAAO;IACP,QAAQ;IACR,cAAc,EACZ,YAAY,cACd;IAEA,0BAA0B;KACxB,OAAO;KACP,cAAc,EACZ,YAAY,mBACd;IACF;GACF;GAEA,gDAAgD,EAC9C,YAAY,SACd;EACF;EACA,cAAc;GACZ,OAAO;GACP,cAAc;GACd,eAAe;GACf,WAAW;EACb;EACA,aAAa;GACX,OAAO;GACP,YAAY;GACZ,mBAAmB;EACrB;EACA,kBAAkB;GAChB,YAAY;GACZ,OAAO;GACP,UAAU;GACV,QAAQ;EACV;EACA,oBAAoB;GAClB,YAAY;GACZ,SAAS;GACT,OAAO;GACP,gBAAgB;GAChB,SAAS;GACT,UAAU;GACV,QAAQ;EACV;EACA,UAAU;GACR,YAAY;GACZ,cAAc;GACd,WAAW;GACX,SAAS;GACT,MAAM;GACN,eAAe;GACf,WAAW;GACX,SAAS;GACT,WAAW;GACX,cAAc;EAChB;EACA,cAAc;GACZ,GAAG;GACH,WAAW;GACX,OAAO;GACP,KAAK;GACL,WAAW;GACX,cAAc;GACd,eAAe;GACf,WAAW;GACX,WAAW;GACX,WAAW;IACT,OAAO;IACP,QAAQ;IACR,QAAQ,EACN,YAAY,cACd;IACA,0BAA0B;KACxB,OAAO;KACP,oBAAoB,EAClB,OAAO,gBACT;IACF;GACF;EACF;EACA,oBAAoB;GAClB,OAAO;GACP,WAAW;EACb;EACA,gBAAgB;GACd,YAAY;GACZ,SAAS;GACT,KAAK;GACL,kBAAkB;EACpB;EACA,eAAe;GACb,YAAY;GACZ,iBAAiB;GACjB,mBAAmB;GACnB,eAAe;EACjB;EAGA,aAAa;GACX,SAAS;GACT,eAAe;GACf,WAAW;GACX,2EAA2E,EACzE,WAAW,EACb;GACA,0CAA0C;IACxC,SAAS;IACT,eAAe;GACjB;EACF;EACA,eAAe;GACb,YAAY;GACZ,SAAS;GACT,KAAK;GACL,iBAAiB;GACjB,mBAAmB;GACnB,kBAAkB;GAClB,oBAAoB;EACtB;EACA,oBAAoB,EAClB,MAAM,IACR;EACA,cAAc;GACZ,WAAW,IAAI,GAAG;GAClB,WAAW;GACX,iBAAiB;GACjB,mBAAmB;GACnB,eAAe;EACjB;EACA,gBAAgB;GACd,OAAO;GACP,WAAW;EACb;EACA,SAAS;GACP,cAAc;GACd,eAAe;EACjB;EACA,SAAS;GACP,SAAS;GACT,eAAe;GACf,KAAK;GACL,mBAAmB;GACnB,eAAe;EACjB;EACA,gBAAgB;GACd,SAAS;GACT,eAAe;GACf,KAAK;GACL,WAAW,IAAI,GAAG;GAClB,WAAW;GACX,WAAW;EACb;EACA,qBAAqB;GACnB,OAAO;GACP,WAAW;EACb;EACA,WAAW;GACT,YAAY;GACZ,qBAAqB;GACrB,aAAa;GACb,SAAS;GACT,KAAK;GACL,gBAAgB;GAChB,SAAS;EACX;EACA,eAAe;GACb,GAAG;GACH,WAAW;GACX,YAAY;GACZ,aAAa;GACb,cAAc;GACd,aAAa;GACb,OAAO;GACP,KAAK;GACL,QAAQ;GACR,eAAe;GACf,WAAW;GACX,OAAO,EACL,OAAO,eACT;GACA,WAAW;IACT,aAAa;IACb,OAAO;IACP,OAAO,EACL,OAAO,gBACT;GACF;EACF;EACA,cAAc;GACZ,YAAY;GACZ,qBAAqB;GACrB,aAAa;GACb,OAAO;GACP,SAAS;GACT,KAAK;GACL,QAAQ,IAAI,EAAE;GACd,eAAe;GAEf,8BAA8B;IAC5B,GAAG;IACH,eAAe;GACjB;EACF;EACA,mBAAmB;GACjB,YAAY;GACZ,OAAO;GACP,MAAM;GACN,UAAU;GACV,SAAS;GACT,WAAW;GACX,cAAc,EACZ,OAAO,yBACT;GACA,mCAAmC,EACjC,YAAY,OACd;EACF;EACA,cAAc;GACZ,YAAY;GACZ,qBAAqB;GACrB,aAAa;GACb,SAAS;GACT,YAAY;GACZ,KAAK;GAEL,cAAc;GACd,eAAe;IAAE,MAAM;IAAM,QAAQ;GAAK;EAC5C;EACA,aAAa;GACX,OAAO;GACP,MAAM;GACN,WAAW;EACb;EACA,mBAAmB;GACjB,YAAY;GACZ,qBAAqB;GACrB,aAAa;GACb,SAAS;GACT,YAAY;GACZ,KAAK;GACL,cAAc;GAEd,eAAe;IAAE,MAAM;IAAM,QAAQ;GAAK;EAC5C;EACA,qBAAqB;GACnB,OAAO;GACP,WAAW;EACb;EACA,kBAAkB;GAChB,OAAO;GACP,WAAW;EACb;EAEA,YAAY;GACV,SAAS;GACT,eAAe;GACf,KAAK;EACP;EACA,cAAc;GACZ,SAAS;GACT,KAAK;GACL,SAAS,EACP,MAAM,IACR;EACF;EAEA,iBAAiB;GACf,OAAO;GACP,SAAS;GACT,YAAY;GACZ,2BAA2B,EACzB,YAAY,SACd;EACF;EACA,oBAAoB,EAClB,YAAY,EACd;EACA,OAAO;GACL,SAAS;GACT,eAAe;GACf,KAAK;EACP;EACA,YAAY;GACV,OAAO;GACP,WAAW;EACb;EACA,cAAc;GACZ,YAAY;GACZ,aAAa;GACb,cAAc;GACd,aAAa;GACb,SAAS;GACT,QAAQ;GACR,UAAU;GACV,qDAAqD,EACnD,aAAa,kBACf;EACF;EACA,cAAc;GACZ,GAAG;GACH,MAAM;GACN,KAAK;GACL,UAAU;GACV,eAAe;GACf,WAAW;GACX,WAAW;EACb;EACA,WAAW;GACT,OAAO;GACP,YAAY;EACd;EACA,YAAY;GACV,OAAO;GACP,MAAM;GACN,UAAU;GACV,UAAU;EACZ;EACA,cAAc;GACZ,OAAO;GACP,YAAY;EACd;EACA,aAAa;GACX,GAAG;GACH,OAAO;GACP,YAAY;GACZ,gBAAgB;GAChB,OAAO;EACT;CACF;CACA,UAAU;EAGR,YAAY;GACV,QAAQ,EACN,MAAM;IACJ,qBAAqB;IACrB,aAAa;IACb,eAAe;KAAE,MAAM;KAAM,QAAQ;IAAK;GAC5C,EACF;GACA,MAAM,EACJ,MAAM;IACJ,qBAAqB;IACrB,aAAa;IACb,kBAAkB;KAAE,MAAM;KAAM,QAAQ;IAAK;IAC7C,oBAAoB;KAAE,MAAM;KAAM,QAAQ;IAAK;GACjD,EACF;EACF;EACA,cAAc;GACZ,QAAQ,CAAC;GACT,OAAO,EACL,MAAM,EACJ,gBAAgB,aAClB,EACF;EACF;CACF;AACF,CAAC"}

package/dist/theme/slot-recipes/Listbox.recipe.d.ts ADDED Viewed

@@ -0,0 +1,22 @@
+declare const listboxSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "input" | "label" | "root" | "item" | "itemIndicator" | "itemGroup" | "itemGroupLabel" | "itemText" | "valueText" | "empty", {
+    size: {
+        md: {};
+        lg: {
+            content: {
+                maxHeight: "none";
+                paddingBlock: "8";
+            };
+            item: {
+                minHeight: "48";
+                textStyle: "body/lg/regular";
+                _selected: {
+                    textStyle: "body/lg/regular";
+                };
+            };
+            empty: {
+                textStyle: "body/lg/regular";
+            };
+        };
+    };
+}>;
+export default listboxSlotRecipe;

package/dist/theme/slot-recipes/Listbox.recipe.js ADDED Viewed

@@ -0,0 +1,92 @@
+import { rem } from "../themeUtils.js";
+import { defineSlotRecipe } from "@chakra-ui/react/styled-system";
+import { listboxAnatomy } from "@chakra-ui/react/anatomy";
+//#region lib/theme/slot-recipes/Listbox.recipe.ts
+var listboxSlotRecipe = defineSlotRecipe({
+	className: "listbox",
+	slots: listboxAnatomy.keys(),
+	base: {
+		root: {
+			display: "flex",
+			flexDirection: "column",
+			width: "100%"
+		},
+		content: {
+			display: "flex",
+			flexDirection: "column",
+			maxHeight: rem(200),
+			outline: "none",
+			overflowY: "auto",
+			paddingBlockEnd: "16"
+		},
+		item: {
+			alignItems: "center",
+			color: "text/body",
+			cursor: "pointer",
+			display: "flex",
+			gap: "12",
+			minHeight: "40",
+			paddingBlock: "8",
+			paddingInline: "24",
+			textAlign: "start",
+			textStyle: "body/md/regular",
+			userSelect: "none",
+			_highlighted: { background: "background/hover" },
+			_selected: {
+				background: "background/selected",
+				color: "text/primary",
+				textStyle: "body/md/semibold",
+				_highlighted: { background: "background/selected-hover" }
+			},
+			_disabled: {
+				color: "text/disabled",
+				cursor: "not-allowed",
+				_highlighted: { background: "transparent" }
+			}
+		},
+		itemText: {
+			flex: "1",
+			minWidth: 0,
+			truncate: true
+		},
+		itemIndicator: {
+			color: "icon/interactive",
+			display: "flex",
+			flexShrink: 0
+		},
+		itemGroup: {},
+		itemGroupLabel: {},
+		empty: {
+			color: "text/secondary",
+			paddingBlock: "8",
+			paddingInline: "24",
+			textStyle: "body/md/regular"
+		},
+		label: {
+			color: "text/primary",
+			textStyle: "comp/input/label"
+		},
+		valueText: { truncate: true },
+		input: {}
+	},
+	variants: { size: {
+		md: {},
+		lg: {
+			content: {
+				maxHeight: "none",
+				paddingBlock: "8"
+			},
+			item: {
+				minHeight: "48",
+				textStyle: "body/lg/regular",
+				_selected: { textStyle: "body/lg/regular" }
+			},
+			empty: { textStyle: "body/lg/regular" }
+		}
+	} },
+	defaultVariants: { size: "md" }
+});
+//#endregion
+export { listboxSlotRecipe as default };
+//# sourceMappingURL=Listbox.recipe.js.map

package/dist/theme/slot-recipes/Listbox.recipe.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Listbox.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Listbox.recipe.ts"],"sourcesContent":["import { listboxAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nconst listboxSlotRecipe = defineSlotRecipe({\n className: 'listbox',\n slots: listboxAnatomy.keys(),\n base: {\n root: {\n display: 'flex',\n flexDirection: 'column',\n width: '100%',\n },\n content: {\n display: 'flex',\n flexDirection: 'column',\n maxHeight: rem(200),\n outline: 'none',\n overflowY: 'auto',\n paddingBlockEnd: '16',\n },\n item: {\n alignItems: 'center',\n color: 'text/body',\n cursor: 'pointer',\n display: 'flex',\n gap: '12',\n minHeight: '40',\n paddingBlock: '8',\n paddingInline: '24',\n textAlign: 'start',\n textStyle: 'body/md/regular',\n userSelect: 'none',\n _highlighted: {\n background: 'background/hover',\n },\n _selected: {\n background: 'background/selected',\n color: 'text/primary',\n textStyle: 'body/md/semibold',\n _highlighted: {\n background: 'background/selected-hover',\n },\n },\n _disabled: {\n color: 'text/disabled',\n cursor: 'not-allowed',\n _highlighted: {\n background: 'transparent',\n },\n },\n },\n itemText: {\n flex: '1',\n minWidth: 0,\n truncate: true,\n },\n itemIndicator: {\n color: 'icon/interactive',\n display: 'flex',\n flexShrink: 0,\n },\n itemGroup: {},\n // A group's label is a `BitkitGroupHeading`, which brings its own styles.\n itemGroupLabel: {},\n empty: {\n color: 'text/secondary',\n paddingBlock: '8',\n paddingInline: '24',\n textStyle: 'body/md/regular',\n },\n label: {\n color: 'text/primary',\n textStyle: 'comp/input/label',\n },\n valueText: {\n truncate: true,\n },\n input: {},\n },\n variants: {\n size: {\n md: {},\n // The full-screen mobile filter list: taller rows, larger text, unbounded height.\n lg: {\n content: {\n maxHeight: 'none',\n paddingBlock: '8',\n },\n item: {\n minHeight: '48',\n textStyle: 'body/lg/regular',\n _selected: {\n textStyle: 'body/lg/regular',\n },\n },\n empty: {\n textStyle: 'body/lg/regular',\n },\n },\n },\n },\n defaultVariants: {\n size: 'md',\n },\n});\n\nexport default listboxSlotRecipe;\n"],"mappings":";;;;AAKA,IAAM,oBAAoB,iBAAiB;CACzC,WAAW;CACX,OAAO,eAAe,KAAK;CAC3B,MAAM;EACJ,MAAM;GACJ,SAAS;GACT,eAAe;GACf,OAAO;EACT;EACA,SAAS;GACP,SAAS;GACT,eAAe;GACf,WAAW,IAAI,GAAG;GAClB,SAAS;GACT,WAAW;GACX,iBAAiB;EACnB;EACA,MAAM;GACJ,YAAY;GACZ,OAAO;GACP,QAAQ;GACR,SAAS;GACT,KAAK;GACL,WAAW;GACX,cAAc;GACd,eAAe;GACf,WAAW;GACX,WAAW;GACX,YAAY;GACZ,cAAc,EACZ,YAAY,mBACd;GACA,WAAW;IACT,YAAY;IACZ,OAAO;IACP,WAAW;IACX,cAAc,EACZ,YAAY,4BACd;GACF;GACA,WAAW;IACT,OAAO;IACP,QAAQ;IACR,cAAc,EACZ,YAAY,cACd;GACF;EACF;EACA,UAAU;GACR,MAAM;GACN,UAAU;GACV,UAAU;EACZ;EACA,eAAe;GACb,OAAO;GACP,SAAS;GACT,YAAY;EACd;EACA,WAAW,CAAC;EAEZ,gBAAgB,CAAC;EACjB,OAAO;GACL,OAAO;GACP,cAAc;GACd,eAAe;GACf,WAAW;EACb;EACA,OAAO;GACL,OAAO;GACP,WAAW;EACb;EACA,WAAW,EACT,UAAU,KACZ;EACA,OAAO,CAAC;CACV;CACA,UAAU,EACR,MAAM;EACJ,IAAI,CAAC;EAEL,IAAI;GACF,SAAS;IACP,WAAW;IACX,cAAc;GAChB;GACA,MAAM;IACJ,WAAW;IACX,WAAW;IACX,WAAW,EACT,WAAW,kBACb;GACF;GACA,OAAO,EACL,WAAW,kBACb;EACF;CACF,EACF;CACA,iBAAiB,EACf,MAAM,KACR;AACF,CAAC"}

package/dist/theme/slot-recipes/Menu.recipe.js CHANGED Viewed

@@ -73,7 +73,6 @@ var menuSlotRecipe = defineSlotRecipe({
 			flexDirection: "row",
 			paddingLeft: "16",
 			paddingRight: "24",
-			_disabled: { cursor: "not-allowed" },
 			"&[data-danger]": {
 				color: "button/danger-secondary/fg",
 				_icon: { color: "button/danger-secondary/fg" },
@@ -90,6 +89,12 @@ var menuSlotRecipe = defineSlotRecipe({
 				background: "button/secondary/bg-hover",
 				_active: itemActive
 			},
+			_disabled: {
+				color: "text/disabled",
+				cursor: "not-allowed",
+				_icon: { color: "icon/disabled" },
+				_highlighted: { background: "transparent" }
+			},
 			"& [data-suffix-icon]": { color: "icon/tertiary" }
 		},
 		itemGroupLabel: {

package/dist/theme/slot-recipes/Menu.recipe.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Menu.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Menu.recipe.ts"],"sourcesContent":["import { menuAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe, type SystemStyleObject } from '@chakra-ui/react/styled-system';\n\nconst itemActive: SystemStyleObject = {\n background: 'button/secondary/bg-active',\n _icon: {\n color: 'icon/primary',\n },\n};\nconst itemActiveDanger: SystemStyleObject = {\n background: 'button/danger-secondary/bg-active',\n color: 'button/danger-secondary/fg-active',\n _icon: {\n color: 'button/danger-secondary/fg-active',\n },\n};\nconst menuSlotRecipe = defineSlotRecipe({\n className: 'menu',\n slots: [...menuAnatomy.keys(), 'itemHelper'],\n variants: {\n size: {\n lg: {\n item: {\n alignItems: 'center',\n paddingY: '12',\n textStyle: 'body/lg/regular',\n // With a helper line the item aligns to the top of the label and gets tighter padding.\n '&[data-helper]': {\n alignItems: 'flex-start',\n paddingY: '8',\n },\n },\n },\n md: {\n item: {\n alignItems: 'center',\n // The label line (20px) alone is shorter than the designed 40px row.\n minHeight: '40',\n paddingY: '8',\n textStyle: 'body/md/regular',\n '&[data-helper]': {\n _icon: {\n // Optically center the 16px icon against the 20px label line.\n marginTop: '2',\n },\n alignItems: 'flex-start',\n paddingY: '6',\n },\n },\n },\n },\n },\n base: {\n content: {\n // Sit above the legacy v1 full-dialog/drawer layer (zIndex.fullDialog = 1200); the menu\n // portals out, so without this it renders behind a v1 FloatingDrawer. Matches the content-slot\n // z-index convention of the other floating recipes (Popover, Tooltip, Combobox/Select).\n zIndex: 'popover',\n borderRadius: '4',\n paddingY: '8',\n border: '1px solid',\n borderColor: 'border/minimal',\n _focusVisible: { outline: 'none' },\n boxShadow: 'elevation/lg',\n background: 'background/primary',\n maxHeight: 'var(--available-height)',\n // The cap is useless without these: the positioner sets --available-height from the viewport,\n // and a longer list then spills out of the content box instead of scrolling inside it.\n overflow: 'hidden',\n overflowY: 'auto',\n _open: {\n animationStyle: 'slide-fade-in',\n animationDuration: 'fast',\n },\n _closed: {\n animationStyle: 'slide-fade-out',\n animationDuration: 'faster',\n },\n },\n itemHelper: {\n textStyle: 'body/sm/regular',\n color: 'text/secondary',\n },\n item: {\n _icon: {\n color: 'icon/secondary',\n _active: {\n color: 'icon/primary',\n },\n },\n cursor: 'pointer',\n display: 'flex',\n gap: '12',\n userSelect: 'none',\n flexDirection: 'row',\n paddingLeft: '16',\n paddingRight: '24',\n ~~_disabled: {\n cursor:~~ '~~not-allowed',\n },\n '~~&[data-danger]': {\n color: 'button/danger-secondary/fg',\n _icon: {\n color: 'button/danger-secondary/fg',\n },\n _active: itemActiveDanger,\n _highlighted: {\n background: 'button/danger-secondary/bg-hover',\n color: 'button/danger-secondary/fg-hover',\n _active: itemActiveDanger,\n _icon: {\n color: 'button/danger-secondary/fg-hover',\n },\n },\n },\n _active: itemActive,\n _highlighted: {\n background: 'button/secondary/bg-hover',\n _active: itemActive,\n },\n // The \"leaves this page\" arrow is quieter than the leading icon, and stays that way in every\n // state — including the destructive one, which overrides `_icon` above.\n '& [data-suffix-icon]': {\n color: 'icon/tertiary',\n },\n },\n itemGroupLabel: {\n // The rule after the label is a Chakra Separator, whose recipe base is `border/regular` — a\n // shade darker than the menu's own separator. Match `BitkitActionMenu.Separator`.\n '& .separator': {\n borderColor: 'border/minimal',\n },\n textStyle: 'heading/h6',\n color: 'text/tertiary',\n paddingTop: '12',\n paddingLeft: '16',\n paddingRight: '16',\n paddingBottom: '6',\n display: 'flex',\n gap: '8',\n flexDirection: 'row',\n alignItems: 'center',\n },\n separator: {\n color: 'border/minimal',\n marginY: '8',\n },\n },\n defaultVariants: {\n size: 'lg',\n },\n});\n\nexport default menuSlotRecipe;\n"],"mappings":";;;AAGA,IAAM,aAAgC;CACpC,YAAY;CACZ,OAAO,EACL,OAAO,eACT;AACF;AACA,IAAM,mBAAsC;CAC1C,YAAY;CACZ,OAAO;CACP,OAAO,EACL,OAAO,oCACT;AACF;AACA,IAAM,iBAAiB,iBAAiB;CACtC,WAAW;CACX,OAAO,CAAC,GAAG,YAAY,KAAK,GAAG,YAAY;CAC3C,UAAU,EACR,MAAM;EACJ,IAAI,EACF,MAAM;GACJ,YAAY;GACZ,UAAU;GACV,WAAW;GAEX,kBAAkB;IAChB,YAAY;IACZ,UAAU;GACZ;EACF,EACF;EACA,IAAI,EACF,MAAM;GACJ,YAAY;GAEZ,WAAW;GACX,UAAU;GACV,WAAW;GACX,kBAAkB;IAChB,OAAO,EAEL,WAAW,IACb;IACA,YAAY;IACZ,UAAU;GACZ;EACF,EACF;CACF,EACF;CACA,MAAM;EACJ,SAAS;GAIP,QAAQ;GACR,cAAc;GACd,UAAU;GACV,QAAQ;GACR,aAAa;GACb,eAAe,EAAE,SAAS,OAAO;GACjC,WAAW;GACX,YAAY;GACZ,WAAW;GAGX,UAAU;GACV,WAAW;GACX,OAAO;IACL,gBAAgB;IAChB,mBAAmB;GACrB;GACA,SAAS;IACP,gBAAgB;IAChB,mBAAmB;GACrB;EACF;EACA,YAAY;GACV,WAAW;GACX,OAAO;EACT;EACA,MAAM;GACJ,OAAO;IACL,OAAO;IACP,SAAS,EACP,OAAO,eACT;GACF;GACA,QAAQ;GACR,SAAS;GACT,KAAK;GACL,YAAY;GACZ,eAAe;GACf,aAAa;GACb,cAAc;GACd,~~WAAW,EACT,QAAQ,cACV;GACA,~~kBAAkB;IAChB,OAAO;IACP,OAAO,EACL,OAAO,6BACT;IACA,SAAS;IACT,cAAc;KACZ,YAAY;KACZ,OAAO;KACP,SAAS;KACT,OAAO,EACL,OAAO,mCACT;IACF;GACF;GACA,SAAS;GACT,cAAc;IACZ,YAAY;IACZ,SAAS;GACX;GAGA,wBAAwB,EACtB,OAAO,gBACT;EACF;EACA,gBAAgB;GAGd,gBAAgB,EACd,aAAa,iBACf;GACA,WAAW;GACX,OAAO;GACP,YAAY;GACZ,aAAa;GACb,cAAc;GACd,eAAe;GACf,SAAS;GACT,KAAK;GACL,eAAe;GACf,YAAY;EACd;EACA,WAAW;GACT,OAAO;GACP,SAAS;EACX;CACF;CACA,iBAAiB,EACf,MAAM,KACR;AACF,CAAC"}
1	+ {"version":3,"file":"Menu.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Menu.recipe.ts"],"sourcesContent":["import { menuAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe, type SystemStyleObject } from '@chakra-ui/react/styled-system';\n\nconst itemActive: SystemStyleObject = {\n background: 'button/secondary/bg-active',\n _icon: {\n color: 'icon/primary',\n },\n};\nconst itemActiveDanger: SystemStyleObject = {\n background: 'button/danger-secondary/bg-active',\n color: 'button/danger-secondary/fg-active',\n _icon: {\n color: 'button/danger-secondary/fg-active',\n },\n};\nconst menuSlotRecipe = defineSlotRecipe({\n className: 'menu',\n slots: [...menuAnatomy.keys(), 'itemHelper'],\n variants: {\n size: {\n lg: {\n item: {\n alignItems: 'center',\n paddingY: '12',\n textStyle: 'body/lg/regular',\n // With a helper line the item aligns to the top of the label and gets tighter padding.\n '&[data-helper]': {\n alignItems: 'flex-start',\n paddingY: '8',\n },\n },\n },\n md: {\n item: {\n alignItems: 'center',\n // The label line (20px) alone is shorter than the designed 40px row.\n minHeight: '40',\n paddingY: '8',\n textStyle: 'body/md/regular',\n '&[data-helper]': {\n _icon: {\n // Optically center the 16px icon against the 20px label line.\n marginTop: '2',\n },\n alignItems: 'flex-start',\n paddingY: '6',\n },\n },\n },\n },\n },\n base: {\n content: {\n // Sit above the legacy v1 full-dialog/drawer layer (zIndex.fullDialog = 1200); the menu\n // portals out, so without this it renders behind a v1 FloatingDrawer. Matches the content-slot\n // z-index convention of the other floating recipes (Popover, Tooltip, Combobox/Select).\n zIndex: 'popover',\n borderRadius: '4',\n paddingY: '8',\n border: '1px solid',\n borderColor: 'border/minimal',\n _focusVisible: { outline: 'none' },\n boxShadow: 'elevation/lg',\n background: 'background/primary',\n maxHeight: 'var(--available-height)',\n // The cap is useless without these: the positioner sets --available-height from the viewport,\n // and a longer list then spills out of the content box instead of scrolling inside it.\n overflow: 'hidden',\n overflowY: 'auto',\n _open: {\n animationStyle: 'slide-fade-in',\n animationDuration: 'fast',\n },\n _closed: {\n animationStyle: 'slide-fade-out',\n animationDuration: 'faster',\n },\n },\n itemHelper: {\n textStyle: 'body/sm/regular',\n color: 'text/secondary',\n },\n item: {\n _icon: {\n color: 'icon/secondary',\n _active: {\n color: 'icon/primary',\n },\n },\n cursor: 'pointer',\n display: 'flex',\n gap: '12',\n userSelect: 'none',\n flexDirection: 'row',\n paddingLeft: '16',\n paddingRight: '24',\n '&[data-danger]': {\n color: 'button/danger-secondary/fg',\n _icon: {\n color: 'button/danger-secondary/fg',\n },\n _active: itemActiveDanger,\n _highlighted: {\n background: 'button/danger-secondary/bg-hover',\n color: 'button/danger-secondary/fg-hover',\n _active: itemActiveDanger,\n _icon: {\n color: 'button/danger-secondary/fg-hover',\n },\n },\n },\n _active: itemActive,\n _highlighted: {\n background: 'button/secondary/bg-hover',\n _active: itemActive,\n },\n // After the danger and highlight blocks: equally specific, so the later one wins for a disabled danger item.\n _disabled: {\n color: 'text/disabled',\n cursor: 'not-allowed',\n _icon: {\n color: 'icon/disabled',\n },\n _highlighted: {\n background: 'transparent',\n },\n },\n // The \"leaves this page\" arrow is quieter than the leading icon, and stays that way in every\n // state — including the destructive one, which overrides `_icon` above.\n '& [data-suffix-icon]': {\n color: 'icon/tertiary',\n },\n },\n itemGroupLabel: {\n // The rule after the label is a Chakra Separator, whose recipe base is `border/regular` — a\n // shade darker than the menu's own separator. Match `BitkitActionMenu.Separator`.\n '& .separator': {\n borderColor: 'border/minimal',\n },\n textStyle: 'heading/h6',\n color: 'text/tertiary',\n paddingTop: '12',\n paddingLeft: '16',\n paddingRight: '16',\n paddingBottom: '6',\n display: 'flex',\n gap: '8',\n flexDirection: 'row',\n alignItems: 'center',\n },\n separator: {\n color: 'border/minimal',\n marginY: '8',\n },\n },\n defaultVariants: {\n size: 'lg',\n },\n});\n\nexport default menuSlotRecipe;\n"],"mappings":";;;AAGA,IAAM,aAAgC;CACpC,YAAY;CACZ,OAAO,EACL,OAAO,eACT;AACF;AACA,IAAM,mBAAsC;CAC1C,YAAY;CACZ,OAAO;CACP,OAAO,EACL,OAAO,oCACT;AACF;AACA,IAAM,iBAAiB,iBAAiB;CACtC,WAAW;CACX,OAAO,CAAC,GAAG,YAAY,KAAK,GAAG,YAAY;CAC3C,UAAU,EACR,MAAM;EACJ,IAAI,EACF,MAAM;GACJ,YAAY;GACZ,UAAU;GACV,WAAW;GAEX,kBAAkB;IAChB,YAAY;IACZ,UAAU;GACZ;EACF,EACF;EACA,IAAI,EACF,MAAM;GACJ,YAAY;GAEZ,WAAW;GACX,UAAU;GACV,WAAW;GACX,kBAAkB;IAChB,OAAO,EAEL,WAAW,IACb;IACA,YAAY;IACZ,UAAU;GACZ;EACF,EACF;CACF,EACF;CACA,MAAM;EACJ,SAAS;GAIP,QAAQ;GACR,cAAc;GACd,UAAU;GACV,QAAQ;GACR,aAAa;GACb,eAAe,EAAE,SAAS,OAAO;GACjC,WAAW;GACX,YAAY;GACZ,WAAW;GAGX,UAAU;GACV,WAAW;GACX,OAAO;IACL,gBAAgB;IAChB,mBAAmB;GACrB;GACA,SAAS;IACP,gBAAgB;IAChB,mBAAmB;GACrB;EACF;EACA,YAAY;GACV,WAAW;GACX,OAAO;EACT;EACA,MAAM;GACJ,OAAO;IACL,OAAO;IACP,SAAS,EACP,OAAO,eACT;GACF;GACA,QAAQ;GACR,SAAS;GACT,KAAK;GACL,YAAY;GACZ,eAAe;GACf,aAAa;GACb,cAAc;GACd,kBAAkB;IAChB,OAAO;IACP,OAAO,EACL,OAAO,6BACT;IACA,SAAS;IACT,cAAc;KACZ,YAAY;KACZ,OAAO;KACP,SAAS;KACT,OAAO,EACL,OAAO,mCACT;IACF;GACF;GACA,SAAS;GACT,cAAc;IACZ,YAAY;IACZ,SAAS;GACX;GAEA,WAAW;IACT,OAAO;IACP,QAAQ;IACR,OAAO,EACL,OAAO,gBACT;IACA,cAAc,EACZ,YAAY,cACd;GACF;GAGA,wBAAwB,EACtB,OAAO,gBACT;EACF;EACA,gBAAgB;GAGd,gBAAgB,EACd,aAAa,iBACf;GACA,WAAW;GACX,OAAO;GACP,YAAY;GACZ,aAAa;GACb,cAAc;GACd,eAAe;GACf,SAAS;GACT,KAAK;GACL,eAAe;GACf,YAAY;EACd;EACA,WAAW;GACT,OAAO;GACP,SAAS;EACX;CACF;CACA,iBAAiB,EACf,MAAM,KACR;AACF,CAAC"}

package/dist/theme/slot-recipes/SegmentGroup.recipe.d.ts CHANGED Viewed

@@ -12,19 +12,21 @@ declare const segmentGroupSlotRecipe: import('@chakra-ui/react').SlotRecipeDefin
     };
     size: {
         lg: {
+            root: {
+                height: "48";
+            };
             item: {
-                paddingBlock: "12";
                 textStyle: "body/lg/regular";
             };
         };
         md: {
-            item: {
-                paddingBlock: "8";
+            root: {
+                height: "40";
             };
         };
         sm: {
-            item: {
-                paddingBlock: "6";
+            root: {
+                height: "32";
             };
         };
     };

package/dist/theme/slot-recipes/SegmentGroup.recipe.js CHANGED Viewed

@@ -32,6 +32,7 @@ var segmentGroupSlotRecipe = defineSlotRecipe({
 		},
 		item: {
 			alignItems: "center",
+			alignSelf: "stretch",
 			borderRadius: "4",
 			color: "text/secondary",
 			cursor: "pointer",
@@ -87,12 +88,12 @@ var segmentGroupSlotRecipe = defineSlotRecipe({
 			item: { flex: "1" }
 		} },
 		size: {
-			lg: { item: {
-				paddingBlock: "12",
-				textStyle: "body/lg/regular"
-			} },
-			md: { item: { paddingBlock: "8" } },
-			sm: { item: { paddingBlock: "6" } }
+			lg: {
+				root: { height: "48" },
+				item: { textStyle: "body/lg/regular" }
+			},
+			md: { root: { height: "40" } },
+			sm: { root: { height: "32" } }
 		}
 	},
 	defaultVariants: { size: "sm" }

package/dist/theme/slot-recipes/SegmentGroup.recipe.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SegmentGroup.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/SegmentGroup.recipe.ts"],"sourcesContent":["import { segmentGroupAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nconst segmentGroupSlotRecipe = defineSlotRecipe({\n slots: segmentGroupAnatomy.keys(),\n className: 'segment-group',\n base: {\n root: {\n alignItems: 'center',\n backgroundColor: 'background/secondary',\n borderColor: 'border/minimal',\n borderRadius: '4',\n borderStyle: 'solid',\n borderWidth: '1',\n display: 'inline-flex',\n gap: '1',\n isolation: 'isolate',\n position: 'relative',\n },\n // Zag.js positions the indicator via inline CSS variables (--width, --height, --top, --left).\n // We must reference them here because our custom recipe replaces the Chakra default entirely.\n indicator: {\n backgroundColor: 'background/primary',\n borderRadius: '4',\n boxShadow: 'small',\n height: 'var(--height)',\n left: 'var(--left)',\n outline: '1px solid',\n outlineColor: 'border/regular',\n position: 'absolute',\n top: 'var(--top)',\n width: 'var(--width)',\n zIndex: -1,\n },\n item: {\n alignItems: 'center',\n borderRadius: '4',\n color: 'text/secondary',\n cursor: 'pointer',\n _icon: {\n color: 'icon/secondary',\n },\n display: 'flex',\n gap: '4',\n justifyContent: 'center',\n paddingInline: '12',\n position: 'relative',\n textStyle: 'body/md/regular',\n // Vertical separator between items\n _before: {\n backgroundColor: 'border/minimal',\n content: '\"\"',\n insetBlock: '8',\n insetInlineStart: '-1px',\n position: 'absolute',\n width: '1',\n },\n // Hide separator on first item, and on both sides of the checked item\n '& + &[data-state=checked], &[data-state=checked] + &, &:first-of-type': {\n _before: { opacity: '0' },\n },\n // Focus ring on item when its hidden input is focused (same as Chakra default)\n '&:has(input:focus-visible)': {\n focusRing: 'outside',\n },\n _hover: {\n backgroundColor: 'background/hover',\n color: 'text/primary',\n _active: {\n backgroundColor: 'background/active',\n },\n },\n _active: {\n backgroundColor: 'background/active',\n color: 'text/primary',\n },\n _checked: {\n backgroundColor: 'transparent',\n color: 'text/primary',\n _active: {\n backgroundColor: 'transparent',\n },\n _hover: {\n backgroundColor: 'transparent',\n _active: {\n backgroundColor: 'transparent',\n },\n },\n },\n _disabled: {\n color: 'text/disabled',\n cursor: 'not-allowed',\n _hover: {\n backgroundColor: 'transparent',\n },\n },\n },\n itemText: {\n paddingInline: '4',\n },\n },\n variants: {\n fullWidth: {\n true: {\n root: {\n display: 'flex',\n width: '100%',\n },\n item: {\n flex: '1',\n },\n },\n },\n size: {\n lg: {\n ~~item~~: {\n ~~paddingBlock~~: '12',\n textStyle: 'body/lg/regular',\n },\n },\n md: {\n ~~item~~: {\n ~~paddingBlock~~: '8',\n },\n },\n sm: {\n ~~item~~: {\n ~~paddingBlock~~: '6',\n },\n },\n },\n },\n defaultVariants: {\n size: 'sm',\n },\n});\n\nexport default segmentGroupSlotRecipe;\n"],"mappings":";;;AAGA,IAAM,yBAAyB,iBAAiB;CAC9C,OAAO,oBAAoB,KAAK;CAChC,WAAW;CACX,MAAM;EACJ,MAAM;GACJ,YAAY;GACZ,iBAAiB;GACjB,aAAa;GACb,cAAc;GACd,aAAa;GACb,aAAa;GACb,SAAS;GACT,KAAK;GACL,WAAW;GACX,UAAU;EACZ;EAGA,WAAW;GACT,iBAAiB;GACjB,cAAc;GACd,WAAW;GACX,QAAQ;GACR,MAAM;GACN,SAAS;GACT,cAAc;GACd,UAAU;GACV,KAAK;GACL,OAAO;GACP,QAAQ;EACV;EACA,MAAM;GACJ,YAAY;GACZ,cAAc;GACd,OAAO;GACP,QAAQ;GACR,OAAO,EACL,OAAO,iBACT;GACA,SAAS;GACT,KAAK;GACL,gBAAgB;GAChB,eAAe;GACf,UAAU;GACV,WAAW;GAEX,SAAS;IACP,iBAAiB;IACjB,SAAS;IACT,YAAY;IACZ,kBAAkB;IAClB,UAAU;IACV,OAAO;GACT;GAEA,yEAAyE,EACvE,SAAS,EAAE,SAAS,IAAI,EAC1B;GAEA,8BAA8B,EAC5B,WAAW,UACb;GACA,QAAQ;IACN,iBAAiB;IACjB,OAAO;IACP,SAAS,EACP,iBAAiB,oBACnB;GACF;GACA,SAAS;IACP,iBAAiB;IACjB,OAAO;GACT;GACA,UAAU;IACR,iBAAiB;IACjB,OAAO;IACP,SAAS,EACP,iBAAiB,cACnB;IACA,QAAQ;KACN,iBAAiB;KACjB,SAAS,EACP,iBAAiB,cACnB;IACF;GACF;GACA,WAAW;IACT,OAAO;IACP,QAAQ;IACR,QAAQ,EACN,iBAAiB,cACnB;GACF;EACF;EACA,UAAU,EACR,eAAe,IACjB;CACF;CACA,UAAU;EACR,WAAW,EACT,MAAM;GACJ,MAAM;IACJ,SAAS;IACT,OAAO;GACT;GACA,MAAM,EACJ,MAAM,IACR;EACF,EACF;~~EACA~~,MAAM;GACJ,IAAI,~~EACF,~~MAAM~~;IACJ~~,~~cAAc~~;~~IACd~~,WAAW~~;GACb~~,~~EACF~~;GACA,IAAI,EACF,MAAM,EACJ,~~cAAc~~,~~IAChB~~,EACF;GACA,IAAI,EACF,MAAM,EACJ,~~cAAc~~,~~IAChB~~,EACF;EACF;CACF;CACA,iBAAiB,EACf,MAAM,KACR;AACF,CAAC"}
1	+ {"version":3,"file":"SegmentGroup.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/SegmentGroup.recipe.ts"],"sourcesContent":["import { segmentGroupAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nconst segmentGroupSlotRecipe = defineSlotRecipe({\n slots: segmentGroupAnatomy.keys(),\n className: 'segment-group',\n base: {\n root: {\n alignItems: 'center',\n backgroundColor: 'background/secondary',\n borderColor: 'border/minimal',\n borderRadius: '4',\n borderStyle: 'solid',\n borderWidth: '1',\n display: 'inline-flex',\n gap: '1',\n isolation: 'isolate',\n position: 'relative',\n },\n // Zag.js positions the indicator via inline CSS variables (--width, --height, --top, --left).\n // We must reference them here because our custom recipe replaces the Chakra default entirely.\n indicator: {\n backgroundColor: 'background/primary',\n borderRadius: '4',\n boxShadow: 'small',\n height: 'var(--height)',\n left: 'var(--left)',\n outline: '1px solid',\n outlineColor: 'border/regular',\n position: 'absolute',\n top: 'var(--top)',\n width: 'var(--width)',\n zIndex: -1,\n },\n item: {\n alignItems: 'center',\n alignSelf: 'stretch',\n borderRadius: '4',\n color: 'text/secondary',\n cursor: 'pointer',\n _icon: {\n color: 'icon/secondary',\n },\n display: 'flex',\n gap: '4',\n justifyContent: 'center',\n paddingInline: '12',\n position: 'relative',\n textStyle: 'body/md/regular',\n // Vertical separator between items\n _before: {\n backgroundColor: 'border/minimal',\n content: '\"\"',\n insetBlock: '8',\n insetInlineStart: '-1px',\n position: 'absolute',\n width: '1',\n },\n // Hide separator on first item, and on both sides of the checked item\n '& + &[data-state=checked], &[data-state=checked] + &, &:first-of-type': {\n _before: { opacity: '0' },\n },\n // Focus ring on item when its hidden input is focused (same as Chakra default)\n '&:has(input:focus-visible)': {\n focusRing: 'outside',\n },\n _hover: {\n backgroundColor: 'background/hover',\n color: 'text/primary',\n _active: {\n backgroundColor: 'background/active',\n },\n },\n _active: {\n backgroundColor: 'background/active',\n color: 'text/primary',\n },\n _checked: {\n backgroundColor: 'transparent',\n color: 'text/primary',\n _active: {\n backgroundColor: 'transparent',\n },\n _hover: {\n backgroundColor: 'transparent',\n _active: {\n backgroundColor: 'transparent',\n },\n },\n },\n _disabled: {\n color: 'text/disabled',\n cursor: 'not-allowed',\n _hover: {\n backgroundColor: 'transparent',\n },\n },\n },\n itemText: {\n paddingInline: '4',\n },\n },\n variants: {\n fullWidth: {\n true: {\n root: {\n display: 'flex',\n width: '100%',\n },\n item: {\n flex: '1',\n },\n },\n },\n // Heights include the root's 1px border (border-box); the items stretch to fill it.\n size: {\n lg: {\n root: {\n height: '48',\n },\n item: {\n textStyle: 'body/lg/regular',\n },\n },\n md: {\n root: {\n height: '40',\n },\n },\n sm: {\n root: {\n height: '32',\n },\n },\n },\n },\n defaultVariants: {\n size: 'sm',\n },\n});\n\nexport default segmentGroupSlotRecipe;\n"],"mappings":";;;AAGA,IAAM,yBAAyB,iBAAiB;CAC9C,OAAO,oBAAoB,KAAK;CAChC,WAAW;CACX,MAAM;EACJ,MAAM;GACJ,YAAY;GACZ,iBAAiB;GACjB,aAAa;GACb,cAAc;GACd,aAAa;GACb,aAAa;GACb,SAAS;GACT,KAAK;GACL,WAAW;GACX,UAAU;EACZ;EAGA,WAAW;GACT,iBAAiB;GACjB,cAAc;GACd,WAAW;GACX,QAAQ;GACR,MAAM;GACN,SAAS;GACT,cAAc;GACd,UAAU;GACV,KAAK;GACL,OAAO;GACP,QAAQ;EACV;EACA,MAAM;GACJ,YAAY;GACZ,WAAW;GACX,cAAc;GACd,OAAO;GACP,QAAQ;GACR,OAAO,EACL,OAAO,iBACT;GACA,SAAS;GACT,KAAK;GACL,gBAAgB;GAChB,eAAe;GACf,UAAU;GACV,WAAW;GAEX,SAAS;IACP,iBAAiB;IACjB,SAAS;IACT,YAAY;IACZ,kBAAkB;IAClB,UAAU;IACV,OAAO;GACT;GAEA,yEAAyE,EACvE,SAAS,EAAE,SAAS,IAAI,EAC1B;GAEA,8BAA8B,EAC5B,WAAW,UACb;GACA,QAAQ;IACN,iBAAiB;IACjB,OAAO;IACP,SAAS,EACP,iBAAiB,oBACnB;GACF;GACA,SAAS;IACP,iBAAiB;IACjB,OAAO;GACT;GACA,UAAU;IACR,iBAAiB;IACjB,OAAO;IACP,SAAS,EACP,iBAAiB,cACnB;IACA,QAAQ;KACN,iBAAiB;KACjB,SAAS,EACP,iBAAiB,cACnB;IACF;GACF;GACA,WAAW;IACT,OAAO;IACP,QAAQ;IACR,QAAQ,EACN,iBAAiB,cACnB;GACF;EACF;EACA,UAAU,EACR,eAAe,IACjB;CACF;CACA,UAAU;EACR,WAAW,EACT,MAAM;GACJ,MAAM;IACJ,SAAS;IACT,OAAO;GACT;GACA,MAAM,EACJ,MAAM,IACR;EACF,EACF;EAEA,MAAM;GACJ,IAAI;IACF,MAAM,EACJ,QAAQ,KACV;IACA,MAAM,EACJ,WAAW,kBACb;GACF;GACA,IAAI,EACF,MAAM,EACJ,QAAQ,KACV,EACF;GACA,IAAI,EACF,MAAM,EACJ,QAAQ,KACV,EACF;EACF;CACF;CACA,iBAAiB,EACf,MAAM,KACR;AACF,CAAC"}

package/dist/theme/slot-recipes/Tag.recipe.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-declare const tagSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"label" | "root" | "closeTrigger" | "startElement" | "endElement", {
+declare const tagSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"label" | "root" | "closeTrigger" | "endElement" | "startElement", {
     colorVariant: {
         neutral: {
             root: {

package/dist/theme/slot-recipes/index.d.ts CHANGED Viewed

@@ -609,10 +609,25 @@ declare const slotRecipes: {
         device: {
             mobile: {
                 content: {
+                    minWidth: number;
                     boxShadow: "none";
                     paddingBlock: "16";
                     paddingInline: "16";
                 };
+                view: {
+                    gap: "16";
+                };
+                tableHeader: {
+                    height: "40";
+                    maxWidth: "none";
+                    minWidth: number;
+                    textStyle: "body/lg/regular";
+                    width: "auto";
+                };
+                tableCellTrigger: {
+                    height: "40";
+                    textStyle: "body/lg/regular";
+                };
             };
         };
     }>;
@@ -703,6 +718,91 @@ declare const slotRecipes: {
                     height: "16";
                 } | undefined;
             };
+            lg: {
+                trigger: {
+                    height: "40";
+                    paddingBlock: "8";
+                    paddingInlineEnd: `${number}rem`;
+                    paddingInlineStart: "8";
+                    textStyle: "body/lg/regular";
+                    '&:has([data-slot="avatar"])'?: {
+                        paddingBlock: `${number}rem`;
+                        paddingInlineStart: `${number}rem`;
+                    } | undefined;
+                };
+                indicatorGroup: {
+                    paddingInlineEnd: "4";
+                };
+                indicator: {
+                    _icon: {
+                        width: "16";
+                        height: "16";
+                    };
+                };
+                checkbox?: {
+                    width: "24";
+                    height: "24";
+                } | undefined;
+                item?: {
+                    '&:has([data-slot="avatar"])': {
+                        paddingInlineStart: "12";
+                        paddingInlineEnd: "24";
+                        paddingBlock: "8";
+                        gap: "8";
+                    };
+                    '&:has([data-slot="checkbox"])': {
+                        minHeight: "48";
+                        paddingInlineEnd: "24";
+                        paddingBlock: "12";
+                        gap: "12";
+                    };
+                    paddingInline: "16";
+                    paddingBlock: "12";
+                    textStyle: "body/lg/regular";
+                    _selected: {
+                        textStyle: "body/lg/semibold";
+                    };
+                } | undefined;
+                content?: {
+                    '--select-menu-list-max-height': `${number}rem`;
+                } | undefined;
+                itemLabel?: {
+                    textStyle: "body/lg/regular";
+                    lineHeight: "normal";
+                } | undefined;
+                itemLoadingLabel?: {
+                    textStyle: "body/lg/regular";
+                } | undefined;
+                emptyState?: {
+                    paddingBlock: "12";
+                } | undefined;
+                errorState?: {
+                    paddingBlock: "8";
+                } | undefined;
+                errorLabel?: {
+                    textStyle: "body/lg/regular";
+                } | undefined;
+                action?: {
+                    minHeight: "48";
+                    paddingBlock: "12";
+                    textStyle: "body/lg/regular";
+                    lineHeight: "normal";
+                } | undefined;
+                searchInputGroup?: {
+                    height: `${number}rem`;
+                    paddingBlock: "16";
+                } | undefined;
+                searchInput?: {
+                    textStyle: "body/lg/regular";
+                } | undefined;
+                searchClear?: {
+                    padding: "8";
+                } | undefined;
+                itemIndicator?: {
+                    width: "24";
+                    height: "24";
+                } | undefined;
+            };
         };
     }>;
     dialog: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "body" | "footer" | "header" | "label" | "title" | "trigger" | "positioner" | "closeTrigger" | "description" | "scrollBody" | "scrollArea" | "scrollGradient" | "scrollButton" | "stepHeader" | "backdrop" | "stepDescription" | "stepTitle" | "stepTitleGroup", {
@@ -1084,6 +1184,42 @@ declare const slotRecipes: {
             };
         };
     }>;
+    filter: import('@chakra-ui/react').SlotRecipeDefinition<"search" | "content" | "pattern" | "switch" | "icon" | "field" | "root" | "loading" | "items" | "searchInput" | "addSheetBackdrop" | "addSheetPositioner" | "addSheet" | "addMenu" | "addMenuLabel" | "addSheetItem" | "addMenuItem" | "addMenuIcon" | "addSheetItemReason" | "chip" | "chipLabel" | "chipTrigger" | "chipRemove" | "chipIcon" | "chipValue" | "chipChevron" | "fieldLabel" | "fieldControl" | "fieldTrigger" | "fieldRemove" | "fieldIcon" | "fieldValue" | "fieldChevron" | "mobilePanelHeader" | "popoverFooter" | "mobileFooter" | "popoverFooterStart" | "mobilePanelOverline" | "mobilePanelTitle" | "popoverContent" | "calendarFooter" | "mobileSearch" | "mobileSearchInput" | "popoverBody" | "checkboxList" | "popoverSearch" | "listHelperText" | "mobileListCheckbox" | "mobileListCheck" | "patternResults" | "patternResultsLabel" | "switchItem" | "switchItemText" | "filters" | "searchBlock" | "mobileBar" | "mobileTrigger" | "mobileHeader" | "mobileTitle" | "mobileBody", {
+        pageLayout: {
+            capped: {
+                root: {
+                    borderBlockEndWidth: "1";
+                    borderColor: "border/regular";
+                    paddingInline: {
+                        base: "16";
+                        tablet: "32";
+                    };
+                };
+            };
+            full: {
+                root: {
+                    borderBlockEndWidth: "1";
+                    borderColor: "border/regular";
+                    paddingInlineEnd: {
+                        base: "16";
+                        tablet: "32";
+                    };
+                    paddingInlineStart: {
+                        base: "16";
+                        tablet: "24";
+                    };
+                };
+            };
+        };
+        contentAlign: {
+            center: {};
+            start: {
+                root: {
+                    justifyContent: "flex-start";
+                };
+            };
+        };
+    }>;
     imageCropper: import('@chakra-ui/react').SlotRecipeDefinition<"grid" | "image" | "root" | "handle" | "viewport" | "selection", import('@chakra-ui/react').SlotRecipeVariantRecord<"grid" | "image" | "root" | "handle" | "viewport" | "selection">>;
     inlineLoading: import('@chakra-ui/react').SlotRecipeDefinition<"label" | "root", {
         size: {
@@ -1144,6 +1280,27 @@ declare const slotRecipes: {
             };
         };
     }>;
+    listbox: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "input" | "label" | "root" | "item" | "itemIndicator" | "itemGroup" | "itemGroupLabel" | "itemText" | "valueText" | "empty", {
+        size: {
+            md: {};
+            lg: {
+                content: {
+                    maxHeight: "none";
+                    paddingBlock: "8";
+                };
+                item: {
+                    minHeight: "48";
+                    textStyle: "body/lg/regular";
+                    _selected: {
+                        textStyle: "body/lg/regular";
+                    };
+                };
+                empty: {
+                    textStyle: "body/lg/regular";
+                };
+            };
+        };
+    }>;
     markdown: import('@chakra-ui/react').SlotRecipeDefinition<"blockquote" | "root", {
         size: {
             sm: {
@@ -2272,19 +2429,21 @@ declare const slotRecipes: {
         };
         size: {
             lg: {
+                root: {
+                    height: "48";
+                };
                 item: {
-                    paddingBlock: "12";
                     textStyle: "body/lg/regular";
                 };
             };
             md: {
-                item: {
-                    paddingBlock: "8";
+                root: {
+                    height: "40";
                 };
             };
             sm: {
-                item: {
-                    paddingBlock: "6";
+                root: {
+                    height: "32";
                 };
             };
         };
@@ -3108,7 +3267,7 @@ declare const slotRecipes: {
             md: {};
         };
     }>;
-    tag: import('@chakra-ui/react').SlotRecipeDefinition<"label" | "root" | "closeTrigger" | "startElement" | "endElement", {
+    tag: import('@chakra-ui/react').SlotRecipeDefinition<"label" | "root" | "closeTrigger" | "endElement" | "startElement", {
         colorVariant: {
             neutral: {
                 root: {
@@ -3602,7 +3761,6 @@ declare const slotRecipes: {
             };
         };
     }>;
-    uiHeader: import('@chakra-ui/react').SlotRecipeDefinition<"search" | "badge" | "banner" | "bar" | "root" | "indicator" | "spacer" | "control" | "searchInput" | "searchClear" | "actions" | "navButton" | "accountAvatar" | "accountIcon" | "navButtonBadge" | "navButtonIcon" | "searchButton" | "searchField" | "searchIcon" | "leading" | "logoBlock" | "logoLink", import('@chakra-ui/react').SlotRecipeVariantRecord<"search" | "badge" | "banner" | "bar" | "root" | "indicator" | "spacer" | "control" | "searchInput" | "searchClear" | "actions" | "navButton" | "accountAvatar" | "accountIcon" | "navButtonBadge" | "navButtonIcon" | "searchButton" | "searchField" | "searchIcon" | "leading" | "logoBlock" | "logoLink">>;
     uiSideNav: import('@chakra-ui/react').SlotRecipeDefinition<"link" | "content" | "body" | "footer" | "closeButton" | "root" | "item" | "itemIndicator" | "positioner" | "itemLabel" | "itemIcon" | "backdrop" | "footerSeparator" | "footerHeading" | "linkIconBlock" | "linkTextBlock" | "linkIcon" | "linkStatusDot" | "linkLabel" | "linkSecondaryText" | "workspaceRoot" | "workspaceControl" | "workspace" | "workspaceTextBlock" | "workspaceChevron" | "workspaceMenu" | "workspaceLabel" | "workspaceValue", {
         layout: {
             rail: {

package/dist/theme/slot-recipes/index.js CHANGED Viewed

@@ -1,6 +1,5 @@
 import avatarSlotRecipe from "./Avatar.recipe.js";
 import numberInputSlotRecipe from "./NumberInput.recipe.js";
-import uiHeaderSlotRecipe from "./UIHeader.recipe.js";
 import uiSideNavSlotRecipe from "./UISideNav.recipe.js";
 import accordionSlotRecipe from "./Accordion.recipe.js";
 import actionBarSlotRecipe from "./ActionBar.recipe.js";
@@ -23,11 +22,13 @@ import expandableCardSlotRecipe from "./ExpandableCard.recipe.js";
 import fieldSlotRecipe from "./Field.recipe.js";
 import fieldsetSlotRecipe from "./Fieldset.recipe.js";
 import fileUploadSlotRecipe from "./FileUpload.recipe.js";
+import filterSlotRecipe from "./Filter.recipe.js";
 import groupHeadingRecipe from "./GroupHeading.recipe.js";
 import imageCropperSlotRecipe from "./ImageCropper.recipe.js";
 import inlineLoadingRecipe from "./InlineLoading.recipe.js";
 import labeledDataSlotRecipe from "./LabeledData.recipe.js";
 import listSlotRecipe from "./List.recipe.js";
+import listboxSlotRecipe from "./Listbox.recipe.js";
 import markdownSlotRecipe from "./Markdown.recipe.js";
 import markdownCardSlotRecipe from "./MarkdownCard.recipe.js";
 import menuSlotRecipe from "./Menu.recipe.js";
@@ -88,9 +89,11 @@ var slotRecipes = {
 	groupHeading: groupHeadingRecipe,
 	fieldset: fieldsetSlotRecipe,
 	fileUpload: fileUploadSlotRecipe,
+	filter: filterSlotRecipe,
 	imageCropper: imageCropperSlotRecipe,
 	inlineLoading: inlineLoadingRecipe,
 	list: listSlotRecipe,
+	listbox: listboxSlotRecipe,
 	markdown: markdownSlotRecipe,
 	markdownCard: markdownCardSlotRecipe,
 	menu: menuSlotRecipe,
@@ -130,7 +133,6 @@ var slotRecipes = {
 	tooltip: tooltipSlotRecipe,
 	tour: tourSlotRecipe,
 	treeView: treeViewSlotRecipe,
-	uiHeader: uiHeaderSlotRecipe,
 	uiSideNav: uiSideNavSlotRecipe
 };
 //#endregion