@bitrise/bitkit-v2 0.3.481-beta.3103 → 0.3.481-beta.3107

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

@@ -1,253 +0,0 @@
-import { colorVar, rem } from "../themeUtils.js";
-import { defineSlotRecipe } from "@chakra-ui/react/styled-system";
-//#region lib/theme/slot-recipes/UIHeader.recipe.ts
-/** `uiHeaderHeight` as a number, for a layout that needs one rather than a token. */
-var uiHeaderHeightPx = 48;
-/**
-* The height of the header's bar. A page that pins the header reserves this much room for it, and
-* anything anchored under the header starts here: a drawer's backdrop and positioner, a side
-* navigation's `insetBlockStart`.
-*
-* It is the bar alone. A `banner` sits below it inside the header, and its height is the
-* consumer's content, so a pinned header carrying one is taller than this — measure it rather than
-* assume it.
-*/
-var uiHeaderHeight = rem(48);
-var SEARCH_FIELD_WIDTH = rem(240);
-var SEARCH_FIELD_TINT = colorVar("color/white/20");
-var controlBase = {
-	background: "sys/ui/header/control/bg",
-	_hover: {
-		background: "sys/ui/header/control/bg-hover",
-		_active: { background: "sys/ui/header/control/bg-active" }
-	},
-	_active: { background: "sys/ui/header/control/bg-active" },
-	_selected: {
-		background: "sys/ui/header/control/bg-selected",
-		_hover: {
-			background: "sys/ui/header/control/bg-selected-hover",
-			_active: { background: "sys/ui/header/control/bg-selected" }
-		},
-		_active: { background: "sys/ui/header/control/bg-selected" }
-	},
-	alignItems: "center",
-	borderRadius: 0,
-	color: "icon/on-color",
-	cursor: "pointer",
-	display: "flex",
-	flexShrink: 0,
-	height: uiHeaderHeight,
-	justifyContent: "center",
-	position: "relative",
-	textDecoration: "none",
-	_focusVisible: { outlineOffset: "calc(var(--focus-ring-width) * -1)" }
-};
-var uiHeaderSlotRecipe = defineSlotRecipe({
-	className: "ui-header",
-	slots: [
-		"accountAvatar",
-		"accountIcon",
-		"actions",
-		"badge",
-		"banner",
-		"bar",
-		"control",
-		"indicator",
-		"leading",
-		"logoBlock",
-		"logoLink",
-		"navButton",
-		"navButtonBadge",
-		"navButtonIcon",
-		"root",
-		"search",
-		"searchButton",
-		"searchClear",
-		"searchField",
-		"searchIcon",
-		"searchInput",
-		"spacer"
-	],
-	base: {
-		root: {
-			background: "sys/ui/header/bg",
-			color: "text/on-color",
-			display: "flex",
-			flexDirection: "column",
-			width: "full"
-		},
-		bar: {
-			alignItems: "center",
-			display: "flex",
-			flexShrink: 0,
-			height: uiHeaderHeight,
-			position: "relative",
-			tablet: { paddingInlineStart: "20" }
-		},
-		leading: {
-			display: "flex",
-			flexShrink: 0,
-			tablet: { display: "none" }
-		},
-		spacer: {
-			flexShrink: 1,
-			width: "48",
-			tablet: { display: "none" }
-		},
-		logoBlock: {
-			alignItems: "center",
-			display: "flex",
-			flex: 1,
-			justifyContent: "center",
-			minWidth: 0,
-			tablet: { flex: "none" }
-		},
-		logoLink: {
-			borderRadius: "4",
-			color: "text/on-color",
-			display: "flex",
-			marginBlockEnd: rem(3)
-		},
-		actions: {
-			alignItems: "center",
-			display: "flex",
-			flexShrink: 0,
-			marginInlineStart: "auto",
-			tablet: { paddingInlineEnd: "32" }
-		},
-		banner: { width: "full" },
-		control: {
-			...controlBase,
-			width: "48"
-		},
-		accountAvatar: {
-			borderRadius: "full",
-			display: "none",
-			overflow: "hidden",
-			tablet: { display: "inline-flex" }
-		},
-		accountIcon: {
-			display: "block",
-			tablet: { display: "none" }
-		},
-		navButton: {
-			...controlBase,
-			paddingBlock: "8",
-			paddingInlineEnd: "8",
-			paddingInlineStart: "12"
-		},
-		navButtonBadge: {
-			alignItems: "flex-start",
-			background: "sys/ui/header/bg",
-			borderStartStartRadius: "2",
-			color: "icon/on-color",
-			display: "flex",
-			height: "12",
-			insetBlockEnd: "8",
-			insetInlineEnd: "8",
-			overflow: "hidden",
-			pointerEvents: "none",
-			position: "absolute",
-			width: "16"
-		},
-		navButtonIcon: {
-			flexShrink: 0,
-			marginBlockStart: rem(-1),
-			marginInlineStart: "1"
-		},
-		badge: {
-			background: "sys/ui/header/badge/red",
-			borderRadius: "full",
-			height: "8",
-			insetBlockStart: "12",
-			insetInlineStart: rem(28),
-			pointerEvents: "none",
-			position: "absolute",
-			width: "8",
-			"&[data-pulse]": { _after: {
-				animation: "ping",
-				background: "sys/ui/header/badge/red",
-				borderRadius: "full",
-				content: "\"\"",
-				inset: 0,
-				opacity: .5,
-				position: "absolute",
-				_motionReduce: { animation: "none" }
-			} }
-		},
-		indicator: {
-			background: "sys/ui/header/control/indicator",
-			height: "4",
-			insetBlockEnd: 0,
-			insetInline: 0,
-			pointerEvents: "none",
-			position: "absolute"
-		},
-		search: {
-			display: "flex",
-			flexShrink: 0,
-			position: "relative"
-		},
-		searchField: {
-			alignItems: "center",
-			backgroundColor: "sys/ui/header/bg",
-			backgroundImage: `linear-gradient(0deg, ${SEARCH_FIELD_TINT} 0%, ${SEARCH_FIELD_TINT} 100%)`,
-			borderColor: "border/strong",
-			borderRadius: "4",
-			borderStyle: "solid",
-			borderWidth: "1",
-			display: "none",
-			gap: "8",
-			height: "40",
-			insetBlockStart: "4",
-			insetInlineEnd: 0,
-			opacity: 0,
-			paddingInlineEnd: "12",
-			paddingInlineStart: "8",
-			position: "absolute",
-			transitionDuration: "fast",
-			transitionProperty: "opacity, visibility",
-			transitionTimingFunction: "ease-out",
-			visibility: "hidden",
-			width: SEARCH_FIELD_WIDTH,
-			"&:has(input:focus-visible)": { boxShadow: "0 0 0 var(--focus-ring-width) var(--focus-ring-color) inset" },
-			_open: {
-				opacity: 1,
-				visibility: "visible"
-			},
-			_motionReduce: { transitionProperty: "none" },
-			tablet: { display: "flex" }
-		},
-		searchButton: { tablet: { _open: { visibility: "hidden" } } },
-		searchClear: {
-			color: "icon/on-color",
-			flexShrink: 0
-		},
-		searchIcon: {
-			color: "icon/on-color",
-			flexShrink: 0
-		},
-		searchInput: {
-			background: "transparent",
-			borderWidth: 0,
-			color: "text/on-color",
-			flex: 1,
-			minWidth: 0,
-			padding: 0,
-			textStyle: "body/lg/regular",
-			"&::-webkit-search-cancel-button": { display: "none" },
-			_focusVisible: {
-				outline: "none",
-				outlineWidth: 0
-			},
-			_placeholder: {
-				color: "text/on-color",
-				opacity: .6
-			}
-		}
-	}
-});
-//#endregion
-export { uiHeaderSlotRecipe as default, uiHeaderHeight, uiHeaderHeightPx };
-
-//# sourceMappingURL=UIHeader.recipe.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"UIHeader.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/UIHeader.recipe.ts"],"sourcesContent":["import { defineSlotRecipe, type SystemStyleObject } from '@chakra-ui/react/styled-system';\n\nimport { colorVar, rem } from '../themeUtils';\n\n/** `uiHeaderHeight` as a number, for a layout that needs one rather than a token. */\nexport const uiHeaderHeightPx = 48;\n\n/**\n * The height of the header's bar. A page that pins the header reserves this much room for it, and\n * anything anchored under the header starts here: a drawer's backdrop and positioner, a side\n * navigation's `insetBlockStart`.\n *\n * It is the bar alone. A `banner` sits below it inside the header, and its height is the\n * consumer's content, so a pinned header carrying one is taller than this — measure it rather than\n * assume it.\n */\nexport const uiHeaderHeight = rem(uiHeaderHeightPx);\n\nconst SEARCH_FIELD_WIDTH = rem(240);\n\nconst SEARCH_FIELD_TINT = colorVar('color/white/20');\n\nconst controlStates: SystemStyleObject = {\n  background: 'sys/ui/header/control/bg',\n  _hover: {\n    background: 'sys/ui/header/control/bg-hover',\n    _active: {\n      background: 'sys/ui/header/control/bg-active',\n    },\n  },\n  _active: {\n    background: 'sys/ui/header/control/bg-active',\n  },\n  _selected: {\n    background: 'sys/ui/header/control/bg-selected',\n    _hover: {\n      background: 'sys/ui/header/control/bg-selected-hover',\n      _active: {\n        background: 'sys/ui/header/control/bg-selected',\n      },\n    },\n    _active: {\n      background: 'sys/ui/header/control/bg-selected',\n    },\n  },\n};\n\nconst controlBase: SystemStyleObject = {\n  ...controlStates,\n  alignItems: 'center',\n  borderRadius: 0,\n  color: 'icon/on-color',\n  cursor: 'pointer',\n  display: 'flex',\n  flexShrink: 0,\n  height: uiHeaderHeight,\n  justifyContent: 'center',\n  position: 'relative',\n  textDecoration: 'none',\n  _focusVisible: {\n    outlineOffset: 'calc(var(--focus-ring-width) * -1)',\n  },\n};\n\nconst uiHeaderSlotRecipe = defineSlotRecipe({\n  className: 'ui-header',\n  slots: [\n    'accountAvatar',\n    'accountIcon',\n    'actions',\n    'badge',\n    'banner',\n    'bar',\n    'control',\n    'indicator',\n    'leading',\n    'logoBlock',\n    'logoLink',\n    'navButton',\n    'navButtonBadge',\n    'navButtonIcon',\n    'root',\n    'search',\n    'searchButton',\n    'searchClear',\n    'searchField',\n    'searchIcon',\n    'searchInput',\n    'spacer',\n  ],\n  base: {\n    root: {\n      background: 'sys/ui/header/bg',\n      color: 'text/on-color',\n      display: 'flex',\n      flexDirection: 'column',\n      width: 'full',\n    },\n    bar: {\n      alignItems: 'center',\n      display: 'flex',\n      flexShrink: 0,\n      height: uiHeaderHeight,\n      position: 'relative',\n      tablet: {\n        paddingInlineStart: '20',\n      },\n    },\n    leading: {\n      display: 'flex',\n      flexShrink: 0,\n      tablet: {\n        display: 'none',\n      },\n    },\n    spacer: {\n      flexShrink: 1,\n      width: '48',\n      tablet: {\n        display: 'none',\n      },\n    },\n    logoBlock: {\n      alignItems: 'center',\n      display: 'flex',\n      flex: 1,\n      justifyContent: 'center',\n      minWidth: 0,\n      tablet: {\n        flex: 'none',\n      },\n    },\n    logoLink: {\n      borderRadius: '4',\n      color: 'text/on-color',\n      display: 'flex',\n      marginBlockEnd: rem(3),\n    },\n    actions: {\n      alignItems: 'center',\n      display: 'flex',\n      flexShrink: 0,\n      marginInlineStart: 'auto',\n      tablet: {\n        paddingInlineEnd: '32',\n      },\n    },\n    banner: {\n      width: 'full',\n    },\n    control: {\n      ...controlBase,\n      width: '48',\n    },\n    accountAvatar: {\n      borderRadius: 'full',\n      display: 'none',\n      overflow: 'hidden',\n      tablet: {\n        display: 'inline-flex',\n      },\n    },\n    accountIcon: {\n      display: 'block',\n      tablet: {\n        display: 'none',\n      },\n    },\n    navButton: {\n      ...controlBase,\n      paddingBlock: '8',\n      paddingInlineEnd: '8',\n      paddingInlineStart: '12',\n    },\n    navButtonBadge: {\n      alignItems: 'flex-start',\n      background: 'sys/ui/header/bg',\n      borderStartStartRadius: '2',\n      color: 'icon/on-color',\n      display: 'flex',\n      height: '12',\n      insetBlockEnd: '8',\n      insetInlineEnd: '8',\n      overflow: 'hidden',\n      pointerEvents: 'none',\n      position: 'absolute',\n      width: '16',\n    },\n    navButtonIcon: {\n      flexShrink: 0,\n      marginBlockStart: rem(-1),\n      marginInlineStart: '1',\n    },\n    badge: {\n      background: 'sys/ui/header/badge/red',\n      borderRadius: 'full',\n      height: '8',\n      insetBlockStart: '12',\n      insetInlineStart: rem(28),\n      pointerEvents: 'none',\n      position: 'absolute',\n      width: '8',\n      '&[data-pulse]': {\n        _after: {\n          animation: 'ping',\n          background: 'sys/ui/header/badge/red',\n          borderRadius: 'full',\n          content: '\"\"',\n          inset: 0,\n          opacity: 0.5,\n          position: 'absolute',\n          _motionReduce: {\n            animation: 'none',\n          },\n        },\n      },\n    },\n    indicator: {\n      background: 'sys/ui/header/control/indicator',\n      height: '4',\n      insetBlockEnd: 0,\n      insetInline: 0,\n      pointerEvents: 'none',\n      position: 'absolute',\n    },\n    search: {\n      display: 'flex',\n      flexShrink: 0,\n      position: 'relative',\n    },\n    searchField: {\n      alignItems: 'center',\n      backgroundColor: 'sys/ui/header/bg',\n      backgroundImage: `linear-gradient(0deg, ${SEARCH_FIELD_TINT} 0%, ${SEARCH_FIELD_TINT} 100%)`,\n      borderColor: 'border/strong',\n      borderRadius: '4',\n      borderStyle: 'solid',\n      borderWidth: '1',\n      display: 'none',\n      gap: '8',\n      height: '40',\n      insetBlockStart: '4',\n      insetInlineEnd: 0,\n      opacity: 0,\n      paddingInlineEnd: '12',\n      paddingInlineStart: '8',\n      position: 'absolute',\n      transitionDuration: 'fast',\n      // `visibility` is what takes the closed field out of hit-testing, the tab order and the\n      // accessibility tree in one go. Transitioning it keeps the field visible for the whole fade\n      // and flips it at the end, which `opacity` alone could not do.\n      transitionProperty: 'opacity, visibility',\n      transitionTimingFunction: 'ease-out',\n      visibility: 'hidden',\n      width: SEARCH_FIELD_WIDTH,\n      '&:has(input:focus-visible)': {\n        boxShadow: '0 0 0 var(--focus-ring-width) var(--focus-ring-color) inset',\n      },\n      _open: {\n        opacity: 1,\n        visibility: 'visible',\n      },\n      _motionReduce: {\n        transitionProperty: 'none',\n      },\n      tablet: {\n        display: 'flex',\n      },\n    },\n    searchButton: {\n      tablet: {\n        _open: {\n          visibility: 'hidden',\n        },\n      },\n    },\n    searchClear: {\n      color: 'icon/on-color',\n      flexShrink: 0,\n    },\n    searchIcon: {\n      color: 'icon/on-color',\n      flexShrink: 0,\n    },\n    searchInput: {\n      background: 'transparent',\n      borderWidth: 0,\n      color: 'text/on-color',\n      flex: 1,\n      minWidth: 0,\n      padding: 0,\n      textStyle: 'body/lg/regular',\n      '&::-webkit-search-cancel-button': { display: 'none' },\n      _focusVisible: {\n        outline: 'none',\n        outlineWidth: 0,\n      },\n      _placeholder: {\n        color: 'text/on-color',\n        opacity: 0.6,\n      },\n    },\n  },\n});\n\nexport default uiHeaderSlotRecipe;\n"],"mappings":"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"}