npm - @bitrise/bitkit-v2 - Versions diffs - 0.3.462-beta.2927 → 0.3.463 - Mend

@bitrise/bitkit-v2 0.3.462-beta.2927 → 0.3.463

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 (82) hide show

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

@@ -24,11 +24,7 @@ var selectSlotRecipe = defineSlotRecipe({
 		"itemHelperText",
 		"itemLoading",
 		"itemLoadingLabel",
-		"emptyState",
-		"errorState",
-		"errorIcon",
-		"errorTextBlock",
-		"errorLabel"
+		"emptyState"
 	],
 	base: {
 		trigger: {
@@ -119,7 +115,6 @@ var selectSlotRecipe = defineSlotRecipe({
 		},
 		itemList: {
 			flex: "1 1 auto",
-			maxHeight: "var(--select-menu-list-max-height)",
 			minHeight: 0,
 			overflowY: "auto",
 			paddingBlock: "8"
@@ -149,29 +144,6 @@ var selectSlotRecipe = defineSlotRecipe({
 			alignItems: "flex-start",
 			paddingInline: "16"
 		},
-		errorState: {
-			display: "flex",
-			alignItems: "flex-start",
-			gap: "12",
-			paddingInlineStart: "16",
-			paddingInlineEnd: "24"
-		},
-		errorIcon: {
-			color: "icon/negative",
-			flexShrink: 0
-		},
-		errorTextBlock: {
-			display: "flex",
-			flexDirection: "column",
-			flex: 1,
-			minWidth: 0
-		},
-		errorLabel: {
-			color: "text/body",
-			maxWidth: "100%",
-			minWidth: 0,
-			truncate: true
-		},
 		itemIcon: {
 			color: "icon/secondary",
 			"[data-state=\"checked\"] &": { color: "icon/interactive" }
@@ -327,15 +299,13 @@ var selectSlotRecipe = defineSlotRecipe({
 						gap: "12"
 					}
 				},
-				content: { "--select-menu-list-max-height": rem(280) },
+				itemList: { maxHeight: rem(280) },
 				itemLabel: {
 					textStyle: "body/lg/regular",
 					lineHeight: "normal"
 				},
 				itemLoadingLabel: { textStyle: "body/lg/regular" },
 				emptyState: { paddingBlock: "12" },
-				errorState: { paddingBlock: "8" },
-				errorLabel: { textStyle: "body/lg/regular" },
 				action: {
 					minHeight: "48",
 					paddingBlock: "12",
@@ -370,17 +340,13 @@ var selectSlotRecipe = defineSlotRecipe({
 						gap: "12"
 					}
 				},
-				content: { "--select-menu-list-max-height": rem(236) },
+				itemList: { maxHeight: rem(236) },
 				itemLabel: {
 					textStyle: "body/md/regular",
 					lineHeight: "normal"
 				},
 				itemLoadingLabel: { textStyle: "body/md/regular" },
 				emptyState: { paddingBlock: "8" },
-				errorState: { paddingBlock: "4" },
-				errorLabel: { textStyle: "body/md/regular" },
-				errorIcon: { marginBlockStart: "4" },
-				errorTextBlock: { paddingBlock: "2" },
 				action: {
 					minHeight: "40",
 					paddingBlock: "8",

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Select.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Select.recipe.ts"],"sourcesContent":["import { selectAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { base, variants } from '../common/ComboboxAndSelect.common';\nimport { rem } from '../themeUtils';\n\nexport const selectSlotRecipe = defineSlotRecipe({\n className: 'select',\n slots: [\n ...selectAnatomy.keys(),\n 'searchInputGroup',\n 'searchInput',\n 'searchClear',\n 'actionContainer',\n 'action',\n 'checkbox',\n 'checkmark',\n 'itemList',\n 'itemContent',\n 'itemBadge',\n 'itemIcon',\n 'valueIcon',\n 'avatar',\n 'itemLabel',\n 'itemHelperText',\n 'itemLoading',\n 'itemLoadingLabel',\n 'emptyState',\n 'errorState',\n 'errorIcon',\n 'errorTextBlock',\n 'errorLabel',\n ],\n base: {\n trigger: {\n display: 'flex',\n alignItems: 'center',\n borderWidth: '1',\n borderColor: 'border/strong',\n background: 'background/primary',\n color: 'input/text/inputValue',\n gap: '8',\n justifyContent: 'space-between',\n // 15px + the 1px border = the spec's 16px, measured from the trigger's outer edge.\n // The indicator group below is offset the same way on the end side.\n paddingInlineStart: rem(15),\n paddingInlineEnd: '48',\n paddingBlock: rem(11),\n borderRadius: '4',\n cursor: 'pointer',\n userSelect: 'none',\n textAlign: 'start',\n focusVisibleRing: 'inside',\n width: '100%',\n _open: {\n borderColor: 'border/focus',\n },\n _placeholderShown: {\n color: 'text/secondary',\n },\n _disabled: {\n color: 'text/disabled',\n background: 'background/disabled',\n cursor: 'not-allowed',\n },\n _invalid: {\n borderColor: 'border/error',\n },\n _readOnly: {\n background: 'background/disabled',\n cursor: 'default',\n },\n },\n indicatorGroup: {\n display: 'flex',\n alignItems: 'center',\n gap: '8',\n position: 'absolute',\n insetEnd: 0,\n top: 0,\n bottom: 0,\n paddingInlineStart: '16',\n paddingInlineEnd: rem(15),\n pointerEvents: 'none',\n },\n indicator: {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n color: 'icon/secondary',\n _disabled: {\n color: 'icon/disabled',\n },\n _readOnly: {\n color: 'icon/on-disabled',\n },\n },\n ...base,\n content: {\n ...base.content,\n overflow: 'hidden',\n display: 'flex',\n flexDirection: 'column',\n // Zag's popper sets `--reference-width` (the trigger width) on the positioner, so the\n // menu is never narrower than the Select input — but can grow wider for long items.\n minWidth: 'var(--reference-width)',\n maxWidth: rem(800),\n focusVisibleRing: 'none',\n },\n item: {\n ...base.item,\n _active: {\n background: 'background/active',\n },\n _selected: {\n background: 'background/selected',\n _highlighted: {\n background: 'background/selected-hover',\n },\n },\n _disabled: {\n cursor: 'not-allowed',\n color: 'text/disabled',\n _highlighted: {\n background: 'transparent',\n },\n },\n },\n control: {\n position: 'relative',\n width: '100%',\n },\n valueText: {\n display: 'flex',\n alignItems: 'center',\n gap: '8',\n flex: '1 1 0',\n minWidth: 0,\n overflow: 'hidden',\n },\n itemList: {\n flex: '1 1 auto',\n maxHeight: 'var(--select-menu-list-max-height)',\n minHeight: 0,\n overflowY: 'auto',\n paddingBlock: '8',\n },\n itemContent: {\n display: 'flex',\n flexDirection: 'column',\n flex: '1 0 0',\n minWidth: 0,\n },\n itemBadge: {\n display: 'inline-flex',\n flexShrink: 0,\n },\n itemLoading: {\n flexShrink: 0,\n },\n itemLoadingLabel: {\n color: 'text/secondary',\n flex: '1 0 0',\n minWidth: 0,\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n },\n emptyState: {\n display: 'flex',\n flexDirection: 'column',\n alignItems: 'flex-start',\n paddingInline: '16',\n },\n errorState: {\n display: 'flex',\n alignItems: 'flex-start',\n gap: '12',\n paddingInlineStart: '16',\n paddingInlineEnd: '24',\n },\n errorIcon: {\n color: 'icon/negative',\n flexShrink: 0,\n },\n errorTextBlock: {\n display: 'flex',\n flexDirection: 'column',\n flex: 1,\n minWidth: 0,\n },\n errorLabel: {\n color: 'text/body',\n maxWidth: '100%',\n minWidth: 0,\n truncate: true,\n },\n itemIcon: {\n color: 'icon/secondary',\n '[data-state=\"checked\"] &': {\n color: 'icon/interactive',\n },\n },\n // The selected value's icon in the trigger. Mirrors the `indicator` (chevron) state colors —\n // the trigger exposes `data-disabled` / `data-readonly`, so the icon reacts via ancestors.\n valueIcon: {\n color: 'icon/secondary',\n '[data-disabled] &': { color: 'icon/disabled' },\n '[data-readonly] &': { color: 'icon/on-disabled' },\n },\n avatar: {\n flexShrink: 0,\n '[data-disabled] &': { opacity: 0.5 },\n },\n itemLabel: {\n color: 'text/body',\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n maxWidth: '100%',\n minWidth: 0,\n '[data-disabled] &': {\n color: 'text/disabled',\n },\n },\n itemHelperText: {\n color: 'text/helper',\n textStyle: 'body/sm/regular',\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n maxWidth: '100%',\n minWidth: 0,\n '[data-disabled] &': {\n color: 'text/disabled',\n },\n },\n checkbox: {\n position: 'relative',\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n flexShrink: 0,\n borderWidth: '1',\n borderColor: 'border/regular',\n borderRadius: '4',\n background: 'background/primary',\n boxShadow: 'inset/field',\n color: 'icon/on-color',\n '[data-state=checked] &': {\n background: 'input/checkbox/selection',\n borderColor: 'input/checkbox/selection',\n boxShadow: 'none',\n },\n '[data-disabled] &': {\n background: 'background/disabled',\n borderColor: 'border/disabled',\n },\n },\n checkmark: {\n opacity: 0,\n color: 'icon/on-color',\n '[data-state=checked] &': {\n opacity: 1,\n },\n },\n searchInputGroup: {\n borderBottom: '1px solid',\n borderColor: 'border/minimal',\n background: 'background/primary',\n display: 'flex',\n alignItems: 'center',\n gap: '12',\n paddingInlineStart: '16',\n paddingInlineEnd: '12',\n overflow: 'hidden',\n flexShrink: 0,\n _hover: {\n background: 'background/secondary',\n },\n _focusWithin: {\n background: 'background/primary',\n },\n },\n searchInput: {\n flex: '1 0 0',\n minWidth: 0,\n border: 'none',\n outline: 'none',\n background: 'transparent',\n color: 'input/text/inputValue',\n paddingInline: 0,\n paddingBlock: 0,\n _placeholder: {\n color: 'input/text/placeholder',\n },\n },\n searchClear: {\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n borderRadius: '4',\n color: 'icon/primary',\n cursor: 'pointer',\n flexShrink: 0,\n _hover: {\n background: 'background/hover',\n },\n },\n actionContainer: {\n borderTop: '1px solid',\n borderColor: 'border/minimal',\n paddingBlock: '8',\n flexShrink: 0,\n },\n action: {\n display: 'flex',\n alignItems: 'center',\n gap: '12',\n paddingInlineEnd: '24',\n paddingInlineStart: '16',\n color: 'text/primary',\n width: '100%',\n cursor: 'pointer',\n textAlign: 'start',\n _icon: {\n color: 'icon/secondary',\n },\n _hover: {\n background: 'button/secondary/bg-hover',\n _active: {\n background: 'button/secondary/bg-active',\n },\n },\n _active: {\n background: 'button/secondary/bg-active',\n },\n _disabled: {\n color: 'text/disabled',\n cursor: 'not-allowed',\n _icon: {\n color: 'icon/disabled',\n },\n },\n _focusVisible: {\n outlineOffset: '-3px',\n },\n },\n },\n\n variants: {\n hasStatusIcon: {\n true: {\n trigger: {\n paddingInlineEnd: '96',\n },\n },\n false: {},\n },\n size: {\n lg: {\n ...variants.size.lg,\n trigger: {\n '&:has([data-slot=\"avatar\"])': { paddingBlock: rem(7), paddingInlineStart: rem(11) },\n },\n checkbox: {\n width: '24',\n height: '24',\n },\n item: {\n ...variants.size.lg.item,\n '&:has([data-slot=\"avatar\"])': {\n paddingInlineStart: '12',\n paddingInlineEnd: '24',\n paddingBlock: '8',\n gap: '8',\n },\n '&:has([data-slot=\"checkbox\"])': {\n minHeight: '48',\n paddingInlineEnd: '24',\n paddingBlock: '12',\n gap: '12',\n },\n },\n content: {\n // 5.5 × 48px item + 16px paddingBlock\n '--select-menu-list-max-height': rem(280),\n },\n itemLabel: {\n textStyle: 'body/lg/regular',\n lineHeight: 'normal',\n },\n itemLoadingLabel: {\n textStyle: 'body/lg/regular',\n },\n emptyState: {\n paddingBlock: '12',\n },\n errorState: {\n paddingBlock: '8',\n },\n errorLabel: {\n textStyle: 'body/lg/regular',\n },\n action: {\n minHeight: '48',\n paddingBlock: '12',\n textStyle: 'body/lg/regular',\n lineHeight: 'normal',\n },\n searchInputGroup: {\n height: rem(56),\n paddingBlock: '16',\n },\n searchInput: {\n textStyle: 'body/lg/regular',\n },\n searchClear: {\n padding: '8',\n },\n },\n md: {\n ...variants.size.md,\n checkbox: {\n width: '20',\n height: '20',\n },\n item: {\n ...variants.size.md.item,\n '&:has([data-slot=\"avatar\"])': {\n paddingInlineStart: '12',\n paddingInlineEnd: '24',\n paddingBlock: '4',\n gap: '8',\n },\n '&:has([data-slot=\"checkbox\"])': {\n minHeight: '40',\n paddingInlineEnd: '24',\n paddingBlock: '8',\n gap: '12',\n },\n },\n content: {\n // 5.5 × 40px item (checkbox/avatar row) + 16px paddingBlock\n '--select-menu-list-max-height': rem(236),\n },\n itemLabel: {\n textStyle: 'body/md/regular',\n lineHeight: 'normal',\n },\n itemLoadingLabel: {\n textStyle: 'body/md/regular',\n },\n emptyState: {\n paddingBlock: '8',\n },\n errorState: {\n paddingBlock: '4',\n },\n errorLabel: {\n textStyle: 'body/md/regular',\n },\n errorIcon: {\n marginBlockStart: '4',\n },\n errorTextBlock: {\n paddingBlock: '2',\n },\n action: {\n minHeight: '40',\n paddingBlock: '8',\n textStyle: 'body/md/regular',\n lineHeight: 'normal',\n },\n trigger: {\n textStyle: 'body/md/regular',\n paddingBlock: rem(9),\n '&:has([data-slot=\"avatar\"])': { paddingBlock: rem(7), paddingInlineStart: rem(11) },\n },\n searchInputGroup: {\n height: '48',\n paddingBlock: '12',\n },\n searchInput: {\n textStyle: 'body/md/regular',\n },\n searchClear: {\n padding: '4',\n },\n },\n },\n },\n defaultVariants: {\n size: 'lg',\n },\n});\n"],"mappings":"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"}
1	+ {"version":3,"file":"Select.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Select.recipe.ts"],"sourcesContent":["import { selectAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { base, variants } from '../common/ComboboxAndSelect.common';\nimport { rem } from '../themeUtils';\n\nexport const selectSlotRecipe = defineSlotRecipe({\n className: 'select',\n slots: [\n ...selectAnatomy.keys(),\n 'searchInputGroup',\n 'searchInput',\n 'searchClear',\n 'actionContainer',\n 'action',\n 'checkbox',\n 'checkmark',\n 'itemList',\n 'itemContent',\n 'itemBadge',\n 'itemIcon',\n 'valueIcon',\n 'avatar',\n 'itemLabel',\n 'itemHelperText',\n 'itemLoading',\n 'itemLoadingLabel',\n 'emptyState',\n ],\n base: {\n trigger: {\n display: 'flex',\n alignItems: 'center',\n borderWidth: '1',\n borderColor: 'border/strong',\n background: 'background/primary',\n color: 'input/text/inputValue',\n gap: '8',\n justifyContent: 'space-between',\n // 15px + the 1px border = the spec's 16px, measured from the trigger's outer edge.\n // The indicator group below is offset the same way on the end side.\n paddingInlineStart: rem(15),\n paddingInlineEnd: '48',\n paddingBlock: rem(11),\n borderRadius: '4',\n cursor: 'pointer',\n userSelect: 'none',\n textAlign: 'start',\n focusVisibleRing: 'inside',\n width: '100%',\n _open: {\n borderColor: 'border/focus',\n },\n _placeholderShown: {\n color: 'text/secondary',\n },\n _disabled: {\n color: 'text/disabled',\n background: 'background/disabled',\n cursor: 'not-allowed',\n },\n _invalid: {\n borderColor: 'border/error',\n },\n _readOnly: {\n background: 'background/disabled',\n cursor: 'default',\n },\n },\n indicatorGroup: {\n display: 'flex',\n alignItems: 'center',\n gap: '8',\n position: 'absolute',\n insetEnd: 0,\n top: 0,\n bottom: 0,\n paddingInlineStart: '16',\n paddingInlineEnd: rem(15),\n pointerEvents: 'none',\n },\n indicator: {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n color: 'icon/secondary',\n _disabled: {\n color: 'icon/disabled',\n },\n _readOnly: {\n color: 'icon/on-disabled',\n },\n },\n ...base,\n content: {\n ...base.content,\n overflow: 'hidden',\n display: 'flex',\n flexDirection: 'column',\n // Zag's popper sets `--reference-width` (the trigger width) on the positioner, so the\n // menu is never narrower than the Select input — but can grow wider for long items.\n minWidth: 'var(--reference-width)',\n maxWidth: rem(800),\n focusVisibleRing: 'none',\n },\n item: {\n ...base.item,\n _active: {\n background: 'background/active',\n },\n _selected: {\n background: 'background/selected',\n _highlighted: {\n background: 'background/selected-hover',\n },\n },\n _disabled: {\n cursor: 'not-allowed',\n color: 'text/disabled',\n _highlighted: {\n background: 'transparent',\n },\n },\n },\n control: {\n position: 'relative',\n width: '100%',\n },\n valueText: {\n display: 'flex',\n alignItems: 'center',\n gap: '8',\n flex: '1 1 0',\n minWidth: 0,\n overflow: 'hidden',\n },\n itemList: {\n flex: '1 1 auto',\n minHeight: 0,\n overflowY: 'auto',\n paddingBlock: '8',\n },\n itemContent: {\n display: 'flex',\n flexDirection: 'column',\n flex: '1 0 0',\n minWidth: 0,\n },\n itemBadge: {\n display: 'inline-flex',\n flexShrink: 0,\n },\n itemLoading: {\n flexShrink: 0,\n },\n itemLoadingLabel: {\n color: 'text/secondary',\n flex: '1 0 0',\n minWidth: 0,\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n },\n emptyState: {\n display: 'flex',\n flexDirection: 'column',\n alignItems: 'flex-start',\n paddingInline: '16',\n },\n itemIcon: {\n color: 'icon/secondary',\n '[data-state=\"checked\"] &': {\n color: 'icon/interactive',\n },\n },\n // The selected value's icon in the trigger. Mirrors the `indicator` (chevron) state colors —\n // the trigger exposes `data-disabled` / `data-readonly`, so the icon reacts via ancestors.\n valueIcon: {\n color: 'icon/secondary',\n '[data-disabled] &': { color: 'icon/disabled' },\n '[data-readonly] &': { color: 'icon/on-disabled' },\n },\n avatar: {\n flexShrink: 0,\n '[data-disabled] &': { opacity: 0.5 },\n },\n itemLabel: {\n color: 'text/body',\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n maxWidth: '100%',\n minWidth: 0,\n '[data-disabled] &': {\n color: 'text/disabled',\n },\n },\n itemHelperText: {\n color: 'text/helper',\n textStyle: 'body/sm/regular',\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n maxWidth: '100%',\n minWidth: 0,\n '[data-disabled] &': {\n color: 'text/disabled',\n },\n },\n checkbox: {\n position: 'relative',\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n flexShrink: 0,\n borderWidth: '1',\n borderColor: 'border/regular',\n borderRadius: '4',\n background: 'background/primary',\n boxShadow: 'inset/field',\n color: 'icon/on-color',\n '[data-state=checked] &': {\n background: 'input/checkbox/selection',\n borderColor: 'input/checkbox/selection',\n boxShadow: 'none',\n },\n '[data-disabled] &': {\n background: 'background/disabled',\n borderColor: 'border/disabled',\n },\n },\n checkmark: {\n opacity: 0,\n color: 'icon/on-color',\n '[data-state=checked] &': {\n opacity: 1,\n },\n },\n searchInputGroup: {\n borderBottom: '1px solid',\n borderColor: 'border/minimal',\n background: 'background/primary',\n display: 'flex',\n alignItems: 'center',\n gap: '12',\n paddingInlineStart: '16',\n paddingInlineEnd: '12',\n overflow: 'hidden',\n flexShrink: 0,\n _hover: {\n background: 'background/secondary',\n },\n _focusWithin: {\n background: 'background/primary',\n },\n },\n searchInput: {\n flex: '1 0 0',\n minWidth: 0,\n border: 'none',\n outline: 'none',\n background: 'transparent',\n color: 'input/text/inputValue',\n paddingInline: 0,\n paddingBlock: 0,\n _placeholder: {\n color: 'input/text/placeholder',\n },\n },\n searchClear: {\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n borderRadius: '4',\n color: 'icon/primary',\n cursor: 'pointer',\n flexShrink: 0,\n _hover: {\n background: 'background/hover',\n },\n },\n actionContainer: {\n borderTop: '1px solid',\n borderColor: 'border/minimal',\n paddingBlock: '8',\n flexShrink: 0,\n },\n action: {\n display: 'flex',\n alignItems: 'center',\n gap: '12',\n paddingInlineEnd: '24',\n paddingInlineStart: '16',\n color: 'text/primary',\n width: '100%',\n cursor: 'pointer',\n textAlign: 'start',\n _icon: {\n color: 'icon/secondary',\n },\n _hover: {\n background: 'button/secondary/bg-hover',\n _active: {\n background: 'button/secondary/bg-active',\n },\n },\n _active: {\n background: 'button/secondary/bg-active',\n },\n _disabled: {\n color: 'text/disabled',\n cursor: 'not-allowed',\n _icon: {\n color: 'icon/disabled',\n },\n },\n _focusVisible: {\n outlineOffset: '-3px',\n },\n },\n },\n\n variants: {\n hasStatusIcon: {\n true: {\n trigger: {\n paddingInlineEnd: '96',\n },\n },\n false: {},\n },\n size: {\n lg: {\n ...variants.size.lg,\n trigger: {\n '&:has([data-slot=\"avatar\"])': { paddingBlock: rem(7), paddingInlineStart: rem(11) },\n },\n checkbox: {\n width: '24',\n height: '24',\n },\n item: {\n ...variants.size.lg.item,\n '&:has([data-slot=\"avatar\"])': {\n paddingInlineStart: '12',\n paddingInlineEnd: '24',\n paddingBlock: '8',\n gap: '8',\n },\n '&:has([data-slot=\"checkbox\"])': {\n minHeight: '48',\n paddingInlineEnd: '24',\n paddingBlock: '12',\n gap: '12',\n },\n },\n itemList: {\n // 5.5 × 48px item + 16px paddingBlock\n maxHeight: rem(280),\n },\n itemLabel: {\n textStyle: 'body/lg/regular',\n lineHeight: 'normal',\n },\n itemLoadingLabel: {\n textStyle: 'body/lg/regular',\n },\n emptyState: {\n paddingBlock: '12',\n },\n action: {\n minHeight: '48',\n paddingBlock: '12',\n textStyle: 'body/lg/regular',\n lineHeight: 'normal',\n },\n searchInputGroup: {\n height: rem(56),\n paddingBlock: '16',\n },\n searchInput: {\n textStyle: 'body/lg/regular',\n },\n searchClear: {\n padding: '8',\n },\n },\n md: {\n ...variants.size.md,\n checkbox: {\n width: '20',\n height: '20',\n },\n item: {\n ...variants.size.md.item,\n '&:has([data-slot=\"avatar\"])': {\n paddingInlineStart: '12',\n paddingInlineEnd: '24',\n paddingBlock: '4',\n gap: '8',\n },\n '&:has([data-slot=\"checkbox\"])': {\n minHeight: '40',\n paddingInlineEnd: '24',\n paddingBlock: '8',\n gap: '12',\n },\n },\n itemList: {\n // 5.5 × 40px item (checkbox/avatar row) + 16px paddingBlock\n maxHeight: rem(236),\n },\n itemLabel: {\n textStyle: 'body/md/regular',\n lineHeight: 'normal',\n },\n itemLoadingLabel: {\n textStyle: 'body/md/regular',\n },\n emptyState: {\n paddingBlock: '8',\n },\n action: {\n minHeight: '40',\n paddingBlock: '8',\n textStyle: 'body/md/regular',\n lineHeight: 'normal',\n },\n trigger: {\n textStyle: 'body/md/regular',\n paddingBlock: rem(9),\n '&:has([data-slot=\"avatar\"])': { paddingBlock: rem(7), paddingInlineStart: rem(11) },\n },\n searchInputGroup: {\n height: '48',\n paddingBlock: '12',\n },\n searchInput: {\n textStyle: 'body/md/regular',\n },\n searchClear: {\n padding: '4',\n },\n },\n },\n },\n defaultVariants: {\n size: 'lg',\n },\n});\n"],"mappings":"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"}

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

@@ -0,0 +1,60 @@
+/**
+ * BitkitToggletip: the tooltip's bubble on a popover, so it opens on click and tap and its link and
+ * button take focus. Wider and roomier than a tooltip, since it carries an action row.
+ */
+declare const toggletipSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"anchor" | "content" | "body" | "footer" | "header" | "title" | "trigger" | "arrow" | "arrowTip" | "positioner" | "closeTrigger" | "indicator" | "description", {
+    readonly variant: {
+        readonly dark: {
+            readonly content: {
+                readonly '--tooltip-bg': "colors.background/contrast";
+                readonly color: "text/on-contrast";
+            };
+        };
+        readonly light: {
+            readonly content: {
+                readonly '--tooltip-bg': "colors.background/tertiary";
+                readonly color: "text/primary";
+            };
+        };
+    };
+    readonly paddingSize: {
+        readonly sm: {
+            readonly content: {
+                readonly paddingInline: "8";
+                readonly paddingBlock: "4";
+                readonly borderRadius: "4";
+            };
+        };
+        readonly md: {
+            readonly content: {
+                readonly paddingInline: "12";
+                readonly paddingBlock: "8";
+                readonly borderRadius: "8";
+            };
+        };
+        readonly lg: {
+            readonly content: {
+                readonly padding: "16";
+                readonly borderRadius: "8";
+            };
+        };
+    };
+    readonly textStyle: {
+        readonly 'sm/regular': {
+            readonly content: {
+                readonly textStyle: "body/sm/regular";
+            };
+        };
+        readonly 'sm/semibold': {
+            readonly content: {
+                readonly textStyle: "body/sm/semibold";
+            };
+        };
+        readonly 'md/regular': {
+            readonly content: {
+                readonly textStyle: "body/md/regular";
+            };
+        };
+    };
+}>;
+export default toggletipSlotRecipe;

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

@@ -0,0 +1,31 @@
+import { rem } from "../themeUtils.js";
+import { base, variants } from "../common/TooltipAndToggletip.common.js";
+import { defineSlotRecipe } from "@chakra-ui/react/styled-system";
+import { popoverAnatomy } from "@chakra-ui/react/anatomy";
+//#region lib/theme/slot-recipes/Toggletip.recipe.ts
+/**
+* BitkitToggletip: the tooltip's bubble on a popover, so it opens on click and tap and its link and
+* button take focus. Wider and roomier than a tooltip, since it carries an action row.
+*/
+var toggletipSlotRecipe = defineSlotRecipe({
+	className: "toggletip",
+	slots: popoverAnatomy.keys(),
+	base: {
+		...base,
+		content: {
+			...base.content,
+			minWidth: rem(240),
+			focusVisibleRing: "outside"
+		}
+	},
+	variants,
+	defaultVariants: {
+		variant: "dark",
+		paddingSize: "lg",
+		textStyle: "md/regular"
+	}
+});
+//#endregion
+export { toggletipSlotRecipe as default };
+//# sourceMappingURL=Toggletip.recipe.js.map

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

@@ -0,0 +1 @@

+ {"version":3,"file":"Toggletip.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Toggletip.recipe.ts"],"sourcesContent":["import { popoverAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { base, variants } from '../common/TooltipAndToggletip.common';\nimport { rem } from '../themeUtils';\n\n/**\n * BitkitToggletip: the tooltip's bubble on a popover, so it opens on click and tap and its link and\n * button take focus. Wider and roomier than a tooltip, since it carries an action row.\n */\nconst toggletipSlotRecipe = defineSlotRecipe({\n className: 'toggletip',\n slots: popoverAnatomy.keys(),\n base: {\n ...base,\n content: {\n ...base.content,\n minWidth: rem(240),\n // Without a link or a button the content itself takes focus; the global ring skips tabindex=\"-1\".\n focusVisibleRing: 'outside',\n },\n },\n variants,\n defaultVariants: {\n variant: 'dark',\n paddingSize: 'lg',\n textStyle: 'md/regular',\n },\n});\n\nexport default toggletipSlotRecipe;\n"],"mappings":";;;;;;;;;AAUA,IAAM,sBAAsB,iBAAiB;CAC3C,WAAW;CACX,OAAO,eAAe,KAAK;CAC3B,MAAM;EACJ,GAAG;EACH,SAAS;GACP,GAAG,KAAK;GACR,UAAU,IAAI,GAAG;GAEjB,kBAAkB;EACpB;CACF;CACA;CACA,iBAAiB;EACf,SAAS;EACT,aAAa;EACb,WAAW;CACb;AACF,CAAC"}

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

@@ -1,54 +1,54 @@
 declare const tooltipSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "trigger" | "arrow" | "arrowTip" | "positioner", {
-    variant: {
-        dark: {
-            content: {
-                '--tooltip-bg': "colors.background/contrast";
-                color: "text/on-contrast";
+    readonly variant: {
+        readonly dark: {
+            readonly content: {
+                readonly '--tooltip-bg': "colors.background/contrast";
+                readonly color: "text/on-contrast";
             };
         };
-        light: {
-            content: {
-                '--tooltip-bg': "colors.background/tertiary";
-                color: "text/primary";
+        readonly light: {
+            readonly content: {
+                readonly '--tooltip-bg': "colors.background/tertiary";
+                readonly color: "text/primary";
             };
         };
     };
-    paddingSize: {
-        sm: {
-            content: {
-                paddingInline: "8";
-                paddingBlock: "4";
-                borderRadius: "4";
+    readonly paddingSize: {
+        readonly sm: {
+            readonly content: {
+                readonly paddingInline: "8";
+                readonly paddingBlock: "4";
+                readonly borderRadius: "4";
             };
         };
-        md: {
-            content: {
-                paddingInline: "12";
-                paddingBlock: "8";
-                borderRadius: "8";
+        readonly md: {
+            readonly content: {
+                readonly paddingInline: "12";
+                readonly paddingBlock: "8";
+                readonly borderRadius: "8";
             };
         };
-        lg: {
-            content: {
-                padding: "16";
-                borderRadius: "8";
+        readonly lg: {
+            readonly content: {
+                readonly padding: "16";
+                readonly borderRadius: "8";
             };
         };
     };
-    textStyle: {
-        'sm/regular': {
-            content: {
-                textStyle: "body/sm/regular";
+    readonly textStyle: {
+        readonly 'sm/regular': {
+            readonly content: {
+                readonly textStyle: "body/sm/regular";
             };
         };
-        'sm/semibold': {
-            content: {
-                textStyle: "body/sm/semibold";
+        readonly 'sm/semibold': {
+            readonly content: {
+                readonly textStyle: "body/sm/semibold";
             };
         };
-        'md/regular': {
-            content: {
-                textStyle: "body/md/regular";
+        readonly 'md/regular': {
+            readonly content: {
+                readonly textStyle: "body/md/regular";
             };
         };
     };

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

@@ -1,4 +1,4 @@
-import { rem } from "../themeUtils.js";
+import { base, variants } from "../common/TooltipAndToggletip.common.js";
 import { defineSlotRecipe } from "@chakra-ui/react/styled-system";
 import { tooltipAnatomy } from "@chakra-ui/react/anatomy";
 //#region lib/theme/slot-recipes/Tooltip.recipe.ts
@@ -6,70 +6,13 @@ var tooltipSlotRecipe = defineSlotRecipe({
 	className: "tooltip",
 	slots: tooltipAnatomy.keys(),
 	base: {
+		...base,
 		positioner: {
-			fontFamily: "body",
+			...base.positioner,
 			pointerEvents: "none"
-		},
-		content: {
-			"--tooltip-bg": "colors.background/contrast",
-			backgroundColor: "var(--tooltip-bg)",
-			maxWidth: rem(320),
-			color: "text/on-contrast",
-			boxShadow: "elevation/tooltip",
-			zIndex: "tooltip",
-			transformOrigin: "var(--transform-origin)",
-			_open: {
-				animationStyle: "scale-fade-in",
-				animationDuration: "fast"
-			},
-			_closed: {
-				animationStyle: "scale-fade-out",
-				animationDuration: "fast"
-			}
-		},
-		arrow: {
-			"--arrow-size": rem(8),
-			"--arrow-background": "var(--tooltip-bg)"
-		},
-		arrowTip: {
-			borderTopWidth: "1",
-			borderInlineStartWidth: "1",
-			borderColor: "var(--tooltip-bg)"
-		}
-	},
-	variants: {
-		variant: {
-			dark: { content: {
-				"--tooltip-bg": "colors.background/contrast",
-				color: "text/on-contrast"
-			} },
-			light: { content: {
-				"--tooltip-bg": "colors.background/tertiary",
-				color: "text/primary"
-			} }
-		},
-		paddingSize: {
-			sm: { content: {
-				paddingInline: "8",
-				paddingBlock: "4",
-				borderRadius: "4"
-			} },
-			md: { content: {
-				paddingInline: "12",
-				paddingBlock: "8",
-				borderRadius: "8"
-			} },
-			lg: { content: {
-				padding: "16",
-				borderRadius: "8"
-			} }
-		},
-		textStyle: {
-			"sm/regular": { content: { textStyle: "body/sm/regular" } },
-			"sm/semibold": { content: { textStyle: "body/sm/semibold" } },
-			"md/regular": { content: { textStyle: "body/md/regular" } }
 		}
 	},
+	variants,
 	defaultVariants: {
 		variant: "dark",
 		paddingSize: "md",

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Tooltip.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Tooltip.recipe.ts"],"sourcesContent":["import { tooltipAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { ~~rem~~ } from '../~~themeUtils~~';\n\nconst tooltipSlotRecipe = defineSlotRecipe({\n className: 'tooltip',\n slots: tooltipAnatomy.keys(),\n base: {\n ~~positioner: {\n fontFamily: 'body'~~,\n ~~pointerEvents: 'none',\n~~ ~~},\n content~~: {\n ~~'--tooltip-bg': 'colors~~.~~background/contrast'~~,\n ~~backgroundColor: 'var(--tooltip-bg)',\n~~ // ~~Without~~ ~~a cap a~~ tooltip ~~grows~~ to ~~the width of its~~ text, so a ~~long~~ ~~one~~ ~~runs to~~ the edge of\n // the viewport. Every component that renders a tooltip therefore has to set this, and the one\n // that forgot -- BitkitLabelTooltip -- had no cap at all. It belongs to the tooltip, not to\n // each caller. BitkitOverflowTooltip overrides it: it exists to show text that was truncated,\n // so it is allowed to be wider.\n ~~maxWidth~~: ~~rem(320),\n color:~~ '~~text/on-contrast~~',\n boxShadow: 'elevation/tooltip',\n zIndex: 'tooltip',\n transformOrigin: 'var(--transform-origin)',\n _open: {\n animationStyle: 'scale-fade-in',\n animationDuration: 'fast',\n },\n _closed: {\n animationStyle: 'scale-fade-out',\n animationDuration: 'fast',\n },\n },\n arrow: {\n '--arrow-size': rem(8),\n '--arrow-background': 'var(--tooltip-bg)',\n },\n arrowTip: {\n borderTopWidth: '1',\n borderInlineStartWidth: '1',\n borderColor: 'var(--tooltip-bg)',\n },\n },\n variants~~: {\n variant: {\n dark: {\n content: {\n '--tooltip-bg': 'colors.background/contrast'~~,\n color: 'text/on-contrast',\n },\n },\n light: {\n content: {\n '--tooltip-bg': 'colors.background/tertiary',\n color: 'text/primary',\n },\n },\n },\n paddingSize: {\n sm: {\n content: {\n paddingInline: '8',\n paddingBlock: '4',\n borderRadius: '4',\n },\n },\n md: {\n content: {\n paddingInline: '12',\n paddingBlock: '8',\n borderRadius: '8',\n },\n },\n lg: {\n content: {\n padding: '16',\n borderRadius: '8',\n },\n },\n },\n textStyle: {\n 'sm/regular': {\n content: {\n textStyle: 'body/sm/regular',\n },\n },\n 'sm/semibold': {\n content: {\n textStyle: 'body/sm/semibold',\n },\n },\n 'md/regular': {\n content: {\n textStyle: 'body/md/regular',\n },\n },\n },\n ~~},\n~~ defaultVariants: {\n variant: 'dark',\n paddingSize: 'md',\n textStyle: 'md/regular',\n },\n});\n\nexport default tooltipSlotRecipe;\n"],"mappings":";;;;AAKA,IAAM,oBAAoB,iBAAiB;CACzC,WAAW;CACX,OAAO,eAAe,KAAK;CAC3B,MAAM;EACJ,~~YAAY~~;~~GACV~~,YAAY;~~GACZ~~,~~eAAe;EACjB;EACA,SAAS;GACP,gBAAgB;GAChB,iBAAiB;GAMjB,UAAU,IAAI,~~GAAG~~;GACjB~~,~~OAAO~~;~~GACP~~,~~WAAW~~;~~GACX,QAAQ~~;GACR,iBAAiB;GACjB,OAAO;IACL,gBAAgB;IAChB,mBAAmB;GACrB;GACA,SAAS;IACP,gBAAgB;IAChB,mBAAmB;GACrB;EACF;EACA,OAAO;GACL,gBAAgB,IAAI,CAAC;GACrB,sBAAsB;EACxB;EACA,UAAU;GACR,gBAAgB;GAChB,wBAAwB;GACxB,aAAa;EACf;CACF;CACA~~,UAAU~~;EACR,SAAS;GACP,MAAM,EACJ,SAAS;IACP,gBAAgB;IAChB,OAAO;GACT,EACF;GACA,OAAO,EACL,SAAS;IACP,gBAAgB;IAChB,OAAO;GACT,EACF;EACF;EACA,aAAa;GACX,IAAI,EACF,SAAS;IACP,eAAe;IACf,cAAc;IACd,cAAc;GAChB,EACF;GACA,IAAI,EACF,SAAS;IACP,eAAe;IACf,cAAc;IACd,cAAc;GAChB,EACF;GACA,IAAI,EACF,SAAS;IACP,SAAS;IACT,cAAc;GAChB,EACF;EACF;EACA,WAAW;GACT,cAAc,EACZ,SAAS,EACP,WAAW,kBACb,EACF;GACA,eAAe,EACb,SAAS,EACP,WAAW,mBACb,EACF;GACA,cAAc,EACZ,SAAS,EACP,WAAW,kBACb,EACF;EACF;CACF;CACA,iBAAiB;EACf,SAAS;EACT,aAAa;EACb,WAAW;CACb;AACF,CAAC"}
1	+ {"version":3,"file":"Tooltip.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Tooltip.recipe.ts"],"sourcesContent":["import { tooltipAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { base, variants } from '../common/TooltipAndToggletip.common';\n\nconst tooltipSlotRecipe = defineSlotRecipe({\n className: 'tooltip',\n slots: tooltipAnatomy.keys(),\n base: {\n ...base,\n positioner: {\n ...base.positioner,\n // A tooltip holds only text, so it never takes the pointer.\n pointerEvents: 'none',\n },\n },\n variants,\n defaultVariants: {\n variant: 'dark',\n paddingSize: 'md',\n textStyle: 'md/regular',\n },\n});\n\nexport default tooltipSlotRecipe;\n"],"mappings":";;;;AAKA,IAAM,oBAAoB,iBAAiB;CACzC,WAAW;CACX,OAAO,eAAe,KAAK;CAC3B,MAAM;EACJ,GAAG;EACH,YAAY;GACV,GAAG,KAAK;GAER,eAAe;EACjB;CACF;CACA;CACA,iBAAiB;EACf,SAAS;EACT,aAAa;EACb,WAAW;CACb;AACF,CAAC"}

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

@@ -32,16 +32,14 @@ var baseItemStyle = {
 		},
 		_active: { background: "background/selected-hover" }
 	},
-	_disabled: {
-		opacity: .4,
-		cursor: "not-allowed"
-	}
+	_disabled: { cursor: "not-allowed" }
 };
 var baseTextStyle = {
 	flex: 1,
 	minWidth: 0,
 	display: "flex",
-	flexDirection: "column"
+	flexDirection: "column",
+	_disabled: { color: "text/tertiary" }
 };
 var treeViewSlotRecipe = defineSlotRecipe({
 	className: "bitkit-tree-view",
@@ -88,7 +86,8 @@ var treeViewSlotRecipe = defineSlotRecipe({
 		branchIndicator: {
 			display: "flex",
 			justifyContent: "center",
-			color: "icon/secondary"
+			color: "icon/secondary",
+			_disabled: { color: "icon/disabled" }
 		},
 		branchTrigger: {
 			display: "inline-flex",
@@ -106,6 +105,10 @@ var treeViewSlotRecipe = defineSlotRecipe({
 			_selected: {
 				...baseItemStyle._selected,
 				"& > svg": { color: "icon/primary" }
+			},
+			_disabled: {
+				...baseItemStyle._disabled,
+				"& > svg": { color: "icon/disabled" }
 			}
 		},
 		branchText: baseTextStyle,

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

	@@ -1 +1 @@
1	- {"version":3,"file":"TreeView.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/TreeView.recipe.ts"],"sourcesContent":["import { treeViewAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nconst depthOffsetStyle = {\n '--tree-depth': 'calc(var(--depth) - 1)',\n '--tree-indentation-offset': 'calc(var(--tree-indentation) * var(--tree-depth))',\n '--tree-icon-offset': 'calc(var(--tree-icon-size) * var(--tree-depth) * 0.5)',\n '--tree-offset': 'calc(var(--tree-padding-inline-start) + var(--tree-indentation-offset) + var(--tree-icon-offset))',\n paddingInlineStart: 'var(--tree-offset)',\n} as const;\n\nconst baseItemStyle = {\n display: 'flex',\n alignItems: 'flex-start',\n gap: 'var(--tree-item-gap)',\n cursor: 'pointer',\n userSelect: 'none',\n position: 'relative',\n ...depthOffsetStyle,\n focusVisibleRing: 'inside',\n focusRingWidth: '2px',\n _hover: {\n background: 'background/secondary',\n _active: {\n background: 'background/tertiary',\n },\n },\n _active: {\n background: 'background/tertiary',\n },\n _selected: {\n background: 'background/selected',\n _hover: {\n background: 'background/selected-hover',\n _active: {\n background: 'background/selected-hover',\n },\n },\n _active: {\n background: 'background/selected-hover',\n },\n },\n _disabled: {\n opacity: 0.4,\n cursor: 'not-allowed',\n },\n} as const;\n\nconst baseTextStyle = {\n flex: 1,\n minWidth: 0,\n display: 'flex',\n flexDirection: 'column',\n} as const;\n\nconst treeViewSlotRecipe = defineSlotRecipe({\n className: 'bitkit-tree-view',\n slots: [...treeViewAnatomy.keys(), 'actionGroup', 'footer', 'suffixGroup', 'secondaryText'],\n base: {\n root: {\n width: 'full',\n display: 'flex',\n flexDirection: 'column',\n },\n tree: {\n display: 'flex',\n flexDirection: 'column',\n textStyle: 'body/md/regular',\n '--tree-item-gap': 'spacing.8',\n '--tree-indentation': 'spacing.16',\n '--tree-padding-inline-start': 'spacing.8',\n '--tree-icon-size': 'spacing.16',\n _icon: {\n boxSize: 'var(--tree-icon-size)',\n },\n },\n label: {\n fontWeight: 'medium',\n textStyle: 'body/sm/regular',\n },\n branch: {\n position: 'relative',\n },\n branchContent: {\n position: 'relative',\n overflow: 'hidden',\n _open: {\n animationName: 'expand-height, fade-in',\n animationDuration: 'moderate',\n },\n _closed: {\n animationName: 'collapse-height, fade-out',\n animationDuration: 'moderate',\n },\n },\n branchIndicator: {\n display: 'flex',\n justifyContent: 'center',\n color: 'icon/secondary',\n },\n branchTrigger: {\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n },\n branchControl: {\n ...baseItemStyle,\n },\n item: {\n ...baseItemStyle,\n // Direct-child selector (not Chakra's _icon): the item also hosts SVGs in its suffix and\n // action slots, which keep their own colour.\n '& > svg': {\n color: 'icon/secondary',\n },\n _active: {\n ...baseItemStyle._active,\n '& > svg': {\n color: 'icon/primary',\n },\n },\n _selected: {\n ...baseItemStyle._selected,\n '& > svg': {\n color: 'icon/primary',\n },\n },\n },\n branchText: baseTextStyle,\n itemText: baseTextStyle,\n branchIndentGuide: {},\n itemIndicator: {},\n nodeCheckbox: {\n display: 'inline-flex',\n },\n suffixGroup: {\n display: 'flex',\n gap: '8',\n alignItems: 'center',\n justifyContent: 'flex-end',\n color: 'text/secondary',\n '[data-selected] > &, [data-state=\"open\"] > &': {\n color: 'text/primary',\n },\n paddingInlineStart: '16',\n flexShrink: 0,\n _groupHover: {\n display: 'none',\n },\n },\n footer: depthOffsetStyle,\n actionGroup: {\n display: 'none',\n alignItems: 'center',\n justifyContent: 'flex-end',\n paddingInlineStart: '16',\n flexShrink: 0,\n _groupHover: {\n display: 'flex',\n },\n },\n secondaryText: {\n textStyle: 'body/sm/regular',\n color: 'text/secondary',\n },\n },\n variants: {\n variant: {\n files: {\n branchControl: {\n borderRadius: '4',\n paddingInlineEnd: '16',\n '& > svg': {\n marginBlockStart: '8',\n },\n '& > .badge': {\n marginBlockStart: '6',\n },\n },\n item: {\n borderRadius: '4',\n paddingInlineEnd: '16',\n '& > svg': {\n marginBlockStart: '8',\n },\n '& > .badge': {\n marginBlockStart: '6',\n },\n },\n footer: {\n paddingInlineEnd: '16',\n },\n branchIndicator: {\n alignItems: 'flex-start',\n marginBlockStart: '8',\n alignSelf: 'stretch',\n position: 'relative',\n _open: {\n '&::after': {\n content: '\"\"',\n position: 'absolute',\n insetBlockStart: '16',\n insetBlockEnd: 0,\n insetInlineStart: '50%',\n width: '1',\n background: 'border/regular',\n },\n },\n },\n branchText: {\n paddingBlock: '6',\n },\n itemText: {\n paddingBlock: '6',\n },\n suffixGroup: {\n height: rem(31),\n '& > span': {\n marginBlockEnd: '-1',\n },\n },\n branchIndentGuide: {\n height: '100%',\n width: '1',\n background: 'border/regular',\n position: 'absolute',\n insetBlockStart: 0,\n '--tree-depth': 'calc(var(--depth) - 1)',\n '--tree-indentation-offset': 'calc(var(--tree-indentation) * var(--tree-depth))',\n '--tree-offset': 'calc(var(--tree-padding-inline-start) + var(--tree-indentation-offset))',\n '--tree-icon-offset': 'calc(var(--tree-icon-size) * 0.5 * var(--depth))',\n insetInlineStart: 'calc(var(--tree-offset) + var(--tree-icon-offset))',\n zIndex: 1,\n },\n },\n navigation: {\n branchControl: {\n borderRadius: 0,\n paddingInlineEnd: '16',\n '&:not([data-path=\"0\"])::before': {\n content: '\"\"',\n position: 'absolute',\n insetBlockStart: 0,\n insetInlineStart: 'var(--tree-offset)',\n insetInlineEnd: 0,\n height: '1',\n background: 'border/minimal',\n },\n _selected: {\n '&::after': {\n content: '\"\"',\n position: 'absolute',\n insetBlock: 0,\n insetInlineEnd: 0,\n width: '4',\n background: 'border/selected',\n borderRadius: '0 2px 2px 0',\n },\n },\n },\n item: {\n borderRadius: 0,\n paddingInlineEnd: '16',\n '&:not([data-path=\"0\"])::before': {\n content: '\"\"',\n position: 'absolute',\n insetBlockStart: 0,\n insetInlineStart: 'var(--tree-offset)',\n insetInlineEnd: 0,\n height: '1',\n background: 'border/minimal',\n },\n '& > svg': {\n marginBlockStart: rem(9),\n },\n _selected: {\n '&::after': {\n content: '\"\"',\n position: 'absolute',\n insetBlock: 0,\n insetInlineEnd: 0,\n width: '4',\n background: 'border/selected',\n borderRadius: '0 2px 2px 0',\n },\n },\n },\n branchIndicator: {\n marginBlockStart: '8',\n transformOrigin: 'center',\n transitionDuration: 'normal',\n transitionProperty: 'transform',\n transitionTimingFunction: 'default',\n _open: {\n transform: 'rotate(90deg)',\n },\n },\n branchText: {\n paddingBlock: '8',\n gap: '4',\n _open: {\n textStyle: 'body/md/semibold',\n color: 'text/primary',\n },\n },\n itemText: {\n paddingBlock: '8',\n },\n suffixGroup: {\n height: rem(35),\n '& > span': {\n marginBlockEnd: '-1',\n },\n },\n branchIndentGuide: {\n display: 'none',\n },\n },\n },\n },\n defaultVariants: {\n variant: 'files',\n },\n});\n\nexport default treeViewSlotRecipe;\n"],"mappings":"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IACd;IACA,WAAW,EACT,YAAY;KACV,SAAS;KACT,UAAU;KACV,YAAY;KACZ,gBAAgB;KAChB,OAAO;KACP,YAAY;KACZ,cAAc;IAChB,EACF;GACF;GACA,MAAM;IACJ,cAAc;IACd,kBAAkB;IAClB,oCAAkC;KAChC,SAAS;KACT,UAAU;KACV,iBAAiB;KACjB,kBAAkB;KAClB,gBAAgB;KAChB,QAAQ;KACR,YAAY;IACd;IACA,WAAW,EACT,kBAAkB,IAAI,CAAC,EACzB;IACA,WAAW,EACT,YAAY;KACV,SAAS;KACT,UAAU;KACV,YAAY;KACZ,gBAAgB;KAChB,OAAO;KACP,YAAY;KACZ,cAAc;IAChB,EACF;GACF;GACA,iBAAiB;IACf,kBAAkB;IAClB,iBAAiB;IACjB,oBAAoB;IACpB,oBAAoB;IACpB,0BAA0B;IAC1B,OAAO,EACL,WAAW,gBACb;GACF;GACA,YAAY;IACV,cAAc;IACd,KAAK;IACL,OAAO;KACL,WAAW;KACX,OAAO;IACT;GACF;GACA,UAAU,EACR,cAAc,IAChB;GACA,aAAa;IACX,QAAQ,IAAI,EAAE;IACd,YAAY,EACV,gBAAgB,KAClB;GACF;GACA,mBAAmB,EACjB,SAAS,OACX;EACF;CACF,EACF;CACA,iBAAiB,EACf,SAAS,QACX;AACF,CAAC"}
1	+ {"version":3,"file":"TreeView.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/TreeView.recipe.ts"],"sourcesContent":["import { treeViewAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nconst depthOffsetStyle = {\n '--tree-depth': 'calc(var(--depth) - 1)',\n '--tree-indentation-offset': 'calc(var(--tree-indentation) * var(--tree-depth))',\n '--tree-icon-offset': 'calc(var(--tree-icon-size) * var(--tree-depth) * 0.5)',\n '--tree-offset': 'calc(var(--tree-padding-inline-start) + var(--tree-indentation-offset) + var(--tree-icon-offset))',\n paddingInlineStart: 'var(--tree-offset)',\n} as const;\n\nconst baseItemStyle = {\n display: 'flex',\n alignItems: 'flex-start',\n gap: 'var(--tree-item-gap)',\n cursor: 'pointer',\n userSelect: 'none',\n position: 'relative',\n ...depthOffsetStyle,\n focusVisibleRing: 'inside',\n focusRingWidth: '2px',\n _hover: {\n background: 'background/secondary',\n _active: {\n background: 'background/tertiary',\n },\n },\n _active: {\n background: 'background/tertiary',\n },\n _selected: {\n background: 'background/selected',\n _hover: {\n background: 'background/selected-hover',\n _active: {\n background: 'background/selected-hover',\n },\n },\n _active: {\n background: 'background/selected-hover',\n },\n },\n // Colours, not opacity: the row's actions stay usable on a disabled (empty) node and must not fade with it.\n _disabled: {\n cursor: 'not-allowed',\n },\n} as const;\n\nconst baseTextStyle = {\n flex: 1,\n minWidth: 0,\n display: 'flex',\n flexDirection: 'column',\n _disabled: {\n color: 'text/tertiary',\n },\n} as const;\n\nconst treeViewSlotRecipe = defineSlotRecipe({\n className: 'bitkit-tree-view',\n slots: [...treeViewAnatomy.keys(), 'actionGroup', 'footer', 'suffixGroup', 'secondaryText'],\n base: {\n root: {\n width: 'full',\n display: 'flex',\n flexDirection: 'column',\n },\n tree: {\n display: 'flex',\n flexDirection: 'column',\n textStyle: 'body/md/regular',\n '--tree-item-gap': 'spacing.8',\n '--tree-indentation': 'spacing.16',\n '--tree-padding-inline-start': 'spacing.8',\n '--tree-icon-size': 'spacing.16',\n _icon: {\n boxSize: 'var(--tree-icon-size)',\n },\n },\n label: {\n fontWeight: 'medium',\n textStyle: 'body/sm/regular',\n },\n branch: {\n position: 'relative',\n },\n branchContent: {\n position: 'relative',\n overflow: 'hidden',\n _open: {\n animationName: 'expand-height, fade-in',\n animationDuration: 'moderate',\n },\n _closed: {\n animationName: 'collapse-height, fade-out',\n animationDuration: 'moderate',\n },\n },\n branchIndicator: {\n display: 'flex',\n justifyContent: 'center',\n color: 'icon/secondary',\n _disabled: {\n color: 'icon/disabled',\n },\n },\n branchTrigger: {\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n },\n branchControl: {\n ...baseItemStyle,\n },\n item: {\n ...baseItemStyle,\n // Direct-child selector (not Chakra's _icon): the item also hosts SVGs in its suffix and\n // action slots, which keep their own colour.\n '& > svg': {\n color: 'icon/secondary',\n },\n _active: {\n ...baseItemStyle._active,\n '& > svg': {\n color: 'icon/primary',\n },\n },\n _selected: {\n ...baseItemStyle._selected,\n '& > svg': {\n color: 'icon/primary',\n },\n },\n _disabled: {\n ...baseItemStyle._disabled,\n '& > svg': {\n color: 'icon/disabled',\n },\n },\n },\n branchText: baseTextStyle,\n itemText: baseTextStyle,\n branchIndentGuide: {},\n itemIndicator: {},\n nodeCheckbox: {\n display: 'inline-flex',\n },\n suffixGroup: {\n display: 'flex',\n gap: '8',\n alignItems: 'center',\n justifyContent: 'flex-end',\n color: 'text/secondary',\n '[data-selected] > &, [data-state=\"open\"] > &': {\n color: 'text/primary',\n },\n paddingInlineStart: '16',\n flexShrink: 0,\n _groupHover: {\n display: 'none',\n },\n },\n footer: depthOffsetStyle,\n actionGroup: {\n display: 'none',\n alignItems: 'center',\n justifyContent: 'flex-end',\n paddingInlineStart: '16',\n flexShrink: 0,\n _groupHover: {\n display: 'flex',\n },\n },\n secondaryText: {\n textStyle: 'body/sm/regular',\n color: 'text/secondary',\n },\n },\n variants: {\n variant: {\n files: {\n branchControl: {\n borderRadius: '4',\n paddingInlineEnd: '16',\n '& > svg': {\n marginBlockStart: '8',\n },\n '& > .badge': {\n marginBlockStart: '6',\n },\n },\n item: {\n borderRadius: '4',\n paddingInlineEnd: '16',\n '& > svg': {\n marginBlockStart: '8',\n },\n '& > .badge': {\n marginBlockStart: '6',\n },\n },\n footer: {\n paddingInlineEnd: '16',\n },\n branchIndicator: {\n alignItems: 'flex-start',\n marginBlockStart: '8',\n alignSelf: 'stretch',\n position: 'relative',\n _open: {\n '&::after': {\n content: '\"\"',\n position: 'absolute',\n insetBlockStart: '16',\n insetBlockEnd: 0,\n insetInlineStart: '50%',\n width: '1',\n background: 'border/regular',\n },\n },\n },\n branchText: {\n paddingBlock: '6',\n },\n itemText: {\n paddingBlock: '6',\n },\n suffixGroup: {\n height: rem(31),\n '& > span': {\n marginBlockEnd: '-1',\n },\n },\n branchIndentGuide: {\n height: '100%',\n width: '1',\n background: 'border/regular',\n position: 'absolute',\n insetBlockStart: 0,\n '--tree-depth': 'calc(var(--depth) - 1)',\n '--tree-indentation-offset': 'calc(var(--tree-indentation) * var(--tree-depth))',\n '--tree-offset': 'calc(var(--tree-padding-inline-start) + var(--tree-indentation-offset))',\n '--tree-icon-offset': 'calc(var(--tree-icon-size) * 0.5 * var(--depth))',\n insetInlineStart: 'calc(var(--tree-offset) + var(--tree-icon-offset))',\n zIndex: 1,\n },\n },\n navigation: {\n branchControl: {\n borderRadius: 0,\n paddingInlineEnd: '16',\n '&:not([data-path=\"0\"])::before': {\n content: '\"\"',\n position: 'absolute',\n insetBlockStart: 0,\n insetInlineStart: 'var(--tree-offset)',\n insetInlineEnd: 0,\n height: '1',\n background: 'border/minimal',\n },\n _selected: {\n '&::after': {\n content: '\"\"',\n position: 'absolute',\n insetBlock: 0,\n insetInlineEnd: 0,\n width: '4',\n background: 'border/selected',\n borderRadius: '0 2px 2px 0',\n },\n },\n },\n item: {\n borderRadius: 0,\n paddingInlineEnd: '16',\n '&:not([data-path=\"0\"])::before': {\n content: '\"\"',\n position: 'absolute',\n insetBlockStart: 0,\n insetInlineStart: 'var(--tree-offset)',\n insetInlineEnd: 0,\n height: '1',\n background: 'border/minimal',\n },\n '& > svg': {\n marginBlockStart: rem(9),\n },\n _selected: {\n '&::after': {\n content: '\"\"',\n position: 'absolute',\n insetBlock: 0,\n insetInlineEnd: 0,\n width: '4',\n background: 'border/selected',\n borderRadius: '0 2px 2px 0',\n },\n },\n },\n branchIndicator: {\n marginBlockStart: '8',\n transformOrigin: 'center',\n transitionDuration: 'normal',\n transitionProperty: 'transform',\n transitionTimingFunction: 'default',\n _open: {\n transform: 'rotate(90deg)',\n },\n },\n branchText: {\n paddingBlock: '8',\n gap: '4',\n _open: {\n textStyle: 'body/md/semibold',\n color: 'text/primary',\n },\n },\n itemText: {\n paddingBlock: '8',\n },\n suffixGroup: {\n height: rem(35),\n '& > span': {\n marginBlockEnd: '-1',\n },\n },\n branchIndentGuide: {\n display: 'none',\n },\n },\n },\n },\n defaultVariants: {\n variant: 'files',\n },\n});\n\nexport default treeViewSlotRecipe;\n"],"mappings":"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AAkB;IAClB,oCAAkC;KAChC,SAAS;KACT,UAAU;KACV,iBAAiB;KACjB,kBAAkB;KAClB,gBAAgB;KAChB,QAAQ;KACR,YAAY;IACd;IACA,WAAW,EACT,YAAY;KACV,SAAS;KACT,UAAU;KACV,YAAY;KACZ,gBAAgB;KAChB,OAAO;KACP,YAAY;KACZ,cAAc;IAChB,EACF;GACF;GACA,MAAM;IACJ,cAAc;IACd,kBAAkB;IAClB,oCAAkC;KAChC,SAAS;KACT,UAAU;KACV,iBAAiB;KACjB,kBAAkB;KAClB,gBAAgB;KAChB,QAAQ;KACR,YAAY;IACd;IACA,WAAW,EACT,kBAAkB,IAAI,CAAC,EACzB;IACA,WAAW,EACT,YAAY;KACV,SAAS;KACT,UAAU;KACV,YAAY;KACZ,gBAAgB;KAChB,OAAO;KACP,YAAY;KACZ,cAAc;IAChB,EACF;GACF;GACA,iBAAiB;IACf,kBAAkB;IAClB,iBAAiB;IACjB,oBAAoB;IACpB,oBAAoB;IACpB,0BAA0B;IAC1B,OAAO,EACL,WAAW,gBACb;GACF;GACA,YAAY;IACV,cAAc;IACd,KAAK;IACL,OAAO;KACL,WAAW;KACX,OAAO;IACT;GACF;GACA,UAAU,EACR,cAAc,IAChB;GACA,aAAa;IACX,QAAQ,IAAI,EAAE;IACd,YAAY,EACV,gBAAgB,KAClB;GACF;GACA,mBAAmB,EACjB,SAAS,OACX;EACF;CACF,EACF;CACA,iBAAiB,EACf,SAAS,QACX;AACF,CAAC"}