npm - @bitrise/bitkit-v2 - Versions diffs - 0.3.251 → 0.3.252-beta.1703 - Mend

@bitrise/bitkit-v2 0.3.251 → 0.3.252-beta.1703

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

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

	@@ -1 +1 @@
1	- {"version":3,"file":"TagsInput.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/TagsInput.recipe.ts"],"sourcesContent":["import { tagsInputAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nconst extendedTagsInputAnatomy = tagsInputAnatomy.extendWith('tagsBlock', 'suffixBlock');\n\nconst tagsInputSlotRecipe = defineSlotRecipe({\n className: 'tags-input',\n slots: extendedTagsInputAnatomy.keys(),\n base: {\n root: {\n width: 'full',\n },\n control: {\n alignItems: 'flex-start',\n background: 'background/primary',\n borderColor: 'border/regular',\n borderRadius: '4',\n borderStyle: 'solid',\n borderWidth: rem(1),\n boxShadow: 'inset/field',\n display: 'flex',\n height: rem(88),\n overflowY: 'auto',\n transition: 'border-color 200ms',\n _focusWithin: {\n focusRing: 'outside',\n },\n _hover: {\n borderColor: 'border/hover',\n },\n _invalid: {\n borderColor: 'border/error',\n _hover: {\n borderColor: 'border/error',\n },\n },\n _disabled: {\n background: 'background/disabled',\n borderColor: 'border/disabled',\n cursor: 'not-allowed',\n _hover: {\n borderColor: 'border/disabled',\n },\n },\n _readOnly: {\n background: 'background/disabled',\n borderColor: 'border/disabled',\n _hover: {\n borderColor: 'border/disabled',\n },\n },\n },\n tagsBlock: {\n alignContent: 'flex-start',\n alignItems: 'center',\n display: 'flex',\n flex: '1',\n flexWrap: 'wrap',\n gap: '8',\n minWidth: 0,\n },\n suffixBlock: {\n alignItems: 'center',\n alignSelf: 'flex-start',\n display: 'flex',\n flexShrink: '0',\n gap: '8',\n paddingInline: '4',\n position: 'sticky',\n top: 0,\n '&:has(button)': {\n paddingInline: 0,\n },\n },\n input: {\n background: 'transparent',\n color: 'input/text/inputValue',\n flex: '1',\n lineHeight: 'normal',\n minWidth: rem(80),\n outline: 'none',\n // Per Figma, the empty-state placeholder is offset 4px further from the control's\n // left edge than a filled-state tag chip. That 4px comes from an \"input\" layer in\n // Figma that wraps the typing area — in our recipe we apply it as a left padding on\n // the typing <input> itself so tag chips (which live alongside but not inside the\n // input) remain flush with the control's padding.\n paddingInlineStart: '4',\n _placeholder: {\n color: 'input/text/placeholder',\n },\n _disabled: {\n cursor: 'not-allowed',\n _placeholder: {\n color: 'text/disabled',\n },\n },\n _readOnly: {\n display: 'none',\n },\n },\n item: {\n display: 'flex',\n maxWidth: '100%',\n minWidth: 0,\n },\n itemPreview: {\n alignItems: 'center',\n background: '~~sys~~/neutral/subtle',\n borderColor: '~~sys~~/neutral/muted',\n borderRadius: '4',\n borderStyle: 'solid',\n borderWidth: rem(1),\n color: 'text/primary',\n display: 'flex',\n gap: '4',\n height: '24',\n maxWidth: '100%',\n overflow: 'hidden',\n paddingBlock: '2',\n paddingInlineEnd: '1',\n paddingInlineStart: '8',\n textStyle: 'comp/tag/sm',\n _highlighted: {\n background: '~~sys~~/neutral/moderate',\n },\n _disabled: {\n background: 'background/disabled',\n borderColor: 'border/disabled',\n color: 'text/on-disabled',\n },\n '&:not(:has(button))': {\n paddingInlineEnd: '8',\n },\n },\n itemText: {\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n },\n itemInput: {\n background: 'transparent',\n height: '24',\n minWidth: '20',\n outline: 'none',\n },\n itemDeleteTrigger: {\n alignItems: 'center',\n borderRadius: '2',\n color: 'icon/secondary',\n cursor: 'pointer',\n display: 'flex',\n flexShrink: '0',\n height: '20',\n justifyContent: 'center',\n width: '20',\n _hover: {\n background: '~~sys~~/neutral/moderate',\n },\n _disabled: {\n cursor: 'not-allowed',\n opacity: '0.5',\n },\n },\n clearTrigger: {\n alignItems: 'center',\n borderRadius: '4',\n color: 'icon/secondary',\n cursor: 'pointer',\n display: 'flex',\n justifyContent: 'center',\n padding: '4',\n _hover: {\n background: '~~sys~~/neutral/moderate',\n },\n _disabled: {\n cursor: 'not-allowed',\n opacity: '0.5',\n },\n },\n },\n variants: {\n size: {\n // Padding values below match the Figma control + input layer spec exactly\n // (see FRONTEND-572 thread / Figma node 1941:3510 for md, 1941:3487 for lg).\n // The outer control carries the size-specific padding; the inner tagsBlock adds a\n // constant 4px horizontal padding (set in the base) around the content regardless of size.\n md: {\n control: {\n paddingInlineEnd: '12',\n paddingInlineStart: '8',\n },\n // paddingBlock lives on tagsBlock (not control) so the suffixBlock (clear button) sits\n // at the control's inner top and its vertical center lines up with the first tag-row /\n // placeholder center — matches Figma's filled-state layout.\n tagsBlock: {\n paddingBlock: '8',\n },\n suffixBlock: {\n height: '40',\n },\n input: {\n height: '24',\n fontSize: '0.875rem',\n fontWeight: '400',\n lineHeight: 'normal',\n },\n },\n lg: {\n control: {\n paddingInlineEnd: '16',\n paddingInlineStart: '12',\n },\n tagsBlock: {\n paddingBlock: '12',\n },\n suffixBlock: {\n height: '48',\n },\n input: {\n fontSize: '1rem',\n fontWeight: '400',\n lineHeight: 'normal',\n },\n },\n },\n },\n defaultVariants: {\n size: 'lg',\n },\n});\n\nexport default tagsInputSlotRecipe;\n"],"mappings":";;;;AAOA,IAAM,sBAAsB,iBAAiB;CAC3C,WAAW;CACX,OAJ+B,iBAAiB,WAAW,aAAa,aAIjE,EAAyB,KAAK;CACrC,MAAM;EACJ,MAAM,EACJ,OAAO,OACT;EACA,SAAS;GACP,YAAY;GACZ,YAAY;GACZ,aAAa;GACb,cAAc;GACd,aAAa;GACb,aAAa,IAAI,CAAC;GAClB,WAAW;GACX,SAAS;GACT,QAAQ,IAAI,EAAE;GACd,WAAW;GACX,YAAY;GACZ,cAAc,EACZ,WAAW,UACb;GACA,QAAQ,EACN,aAAa,eACf;GACA,UAAU;IACR,aAAa;IACb,QAAQ,EACN,aAAa,eACf;GACF;GACA,WAAW;IACT,YAAY;IACZ,aAAa;IACb,QAAQ;IACR,QAAQ,EACN,aAAa,kBACf;GACF;GACA,WAAW;IACT,YAAY;IACZ,aAAa;IACb,QAAQ,EACN,aAAa,kBACf;GACF;EACF;EACA,WAAW;GACT,cAAc;GACd,YAAY;GACZ,SAAS;GACT,MAAM;GACN,UAAU;GACV,KAAK;GACL,UAAU;EACZ;EACA,aAAa;GACX,YAAY;GACZ,WAAW;GACX,SAAS;GACT,YAAY;GACZ,KAAK;GACL,eAAe;GACf,UAAU;GACV,KAAK;GACL,iBAAiB,EACf,eAAe,EACjB;EACF;EACA,OAAO;GACL,YAAY;GACZ,OAAO;GACP,MAAM;GACN,YAAY;GACZ,UAAU,IAAI,EAAE;GAChB,SAAS;GAMT,oBAAoB;GACpB,cAAc,EACZ,OAAO,yBACT;GACA,WAAW;IACT,QAAQ;IACR,cAAc,EACZ,OAAO,gBACT;GACF;GACA,WAAW,EACT,SAAS,OACX;EACF;EACA,MAAM;GACJ,SAAS;GACT,UAAU;GACV,UAAU;EACZ;EACA,aAAa;GACX,YAAY;GACZ,YAAY;GACZ,aAAa;GACb,cAAc;GACd,aAAa;GACb,aAAa,IAAI,CAAC;GAClB,OAAO;GACP,SAAS;GACT,KAAK;GACL,QAAQ;GACR,UAAU;GACV,UAAU;GACV,cAAc;GACd,kBAAkB;GAClB,oBAAoB;GACpB,WAAW;GACX,cAAc,EACZ,YAAY,~~uBACd~~;GACA,WAAW;IACT,YAAY;IACZ,aAAa;IACb,OAAO;GACT;GACA,uBAAuB,EACrB,kBAAkB,IACpB;EACF;EACA,UAAU;GACR,UAAU;GACV,cAAc;GACd,YAAY;EACd;EACA,WAAW;GACT,YAAY;GACZ,QAAQ;GACR,UAAU;GACV,SAAS;EACX;EACA,mBAAmB;GACjB,YAAY;GACZ,cAAc;GACd,OAAO;GACP,QAAQ;GACR,SAAS;GACT,YAAY;GACZ,QAAQ;GACR,gBAAgB;GAChB,OAAO;GACP,QAAQ,EACN,YAAY,~~uBACd~~;GACA,WAAW;IACT,QAAQ;IACR,SAAS;GACX;EACF;EACA,cAAc;GACZ,YAAY;GACZ,cAAc;GACd,OAAO;GACP,QAAQ;GACR,SAAS;GACT,gBAAgB;GAChB,SAAS;GACT,QAAQ,EACN,YAAY,~~uBACd~~;GACA,WAAW;IACT,QAAQ;IACR,SAAS;GACX;EACF;CACF;CACA,UAAU,EACR,MAAM;EAKJ,IAAI;GACF,SAAS;IACP,kBAAkB;IAClB,oBAAoB;GACtB;GAIA,WAAW,EACT,cAAc,IAChB;GACA,aAAa,EACX,QAAQ,KACV;GACA,OAAO;IACL,QAAQ;IACR,UAAU;IACV,YAAY;IACZ,YAAY;GACd;EACF;EACA,IAAI;GACF,SAAS;IACP,kBAAkB;IAClB,oBAAoB;GACtB;GACA,WAAW,EACT,cAAc,KAChB;GACA,aAAa,EACX,QAAQ,KACV;GACA,OAAO;IACL,UAAU;IACV,YAAY;IACZ,YAAY;GACd;EACF;CACF,EACF;CACA,iBAAiB,EACf,MAAM,KACR;AACF,CAAC"}
1	+ {"version":3,"file":"TagsInput.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/TagsInput.recipe.ts"],"sourcesContent":["import { tagsInputAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nconst extendedTagsInputAnatomy = tagsInputAnatomy.extendWith('tagsBlock', 'suffixBlock');\n\nconst tagsInputSlotRecipe = defineSlotRecipe({\n className: 'tags-input',\n slots: extendedTagsInputAnatomy.keys(),\n base: {\n root: {\n width: 'full',\n },\n control: {\n alignItems: 'flex-start',\n background: 'background/primary',\n borderColor: 'border/regular',\n borderRadius: '4',\n borderStyle: 'solid',\n borderWidth: rem(1),\n boxShadow: 'inset/field',\n display: 'flex',\n height: rem(88),\n overflowY: 'auto',\n transition: 'border-color 200ms',\n _focusWithin: {\n focusRing: 'outside',\n },\n _hover: {\n borderColor: 'border/hover',\n },\n _invalid: {\n borderColor: 'border/error',\n _hover: {\n borderColor: 'border/error',\n },\n },\n _disabled: {\n background: 'background/disabled',\n borderColor: 'border/disabled',\n cursor: 'not-allowed',\n _hover: {\n borderColor: 'border/disabled',\n },\n },\n _readOnly: {\n background: 'background/disabled',\n borderColor: 'border/disabled',\n _hover: {\n borderColor: 'border/disabled',\n },\n },\n },\n tagsBlock: {\n alignContent: 'flex-start',\n alignItems: 'center',\n display: 'flex',\n flex: '1',\n flexWrap: 'wrap',\n gap: '8',\n minWidth: 0,\n },\n suffixBlock: {\n alignItems: 'center',\n alignSelf: 'flex-start',\n display: 'flex',\n flexShrink: '0',\n gap: '8',\n paddingInline: '4',\n position: 'sticky',\n top: 0,\n '&:has(button)': {\n paddingInline: 0,\n },\n },\n input: {\n background: 'transparent',\n color: 'input/text/inputValue',\n flex: '1',\n lineHeight: 'normal',\n minWidth: rem(80),\n outline: 'none',\n // Per Figma, the empty-state placeholder is offset 4px further from the control's\n // left edge than a filled-state tag chip. That 4px comes from an \"input\" layer in\n // Figma that wraps the typing area — in our recipe we apply it as a left padding on\n // the typing <input> itself so tag chips (which live alongside but not inside the\n // input) remain flush with the control's padding.\n paddingInlineStart: '4',\n _placeholder: {\n color: 'input/text/placeholder',\n },\n _disabled: {\n cursor: 'not-allowed',\n _placeholder: {\n color: 'text/disabled',\n },\n },\n _readOnly: {\n display: 'none',\n },\n },\n item: {\n display: 'flex',\n maxWidth: '100%',\n minWidth: 0,\n },\n itemPreview: {\n alignItems: 'center',\n background: 'color/neutral/subtle',\n borderColor: 'color/neutral/muted',\n borderRadius: '4',\n borderStyle: 'solid',\n borderWidth: rem(1),\n color: 'text/primary',\n display: 'flex',\n gap: '4',\n height: '24',\n maxWidth: '100%',\n overflow: 'hidden',\n paddingBlock: '2',\n paddingInlineEnd: '1',\n paddingInlineStart: '8',\n textStyle: 'comp/tag/sm',\n _highlighted: {\n background: 'color/neutral/moderate',\n },\n _disabled: {\n background: 'background/disabled',\n borderColor: 'border/disabled',\n color: 'text/on-disabled',\n },\n '&:not(:has(button))': {\n paddingInlineEnd: '8',\n },\n },\n itemText: {\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n },\n itemInput: {\n background: 'transparent',\n height: '24',\n minWidth: '20',\n outline: 'none',\n },\n itemDeleteTrigger: {\n alignItems: 'center',\n borderRadius: '2',\n color: 'icon/secondary',\n cursor: 'pointer',\n display: 'flex',\n flexShrink: '0',\n height: '20',\n justifyContent: 'center',\n width: '20',\n _hover: {\n background: 'color/neutral/moderate',\n },\n _disabled: {\n cursor: 'not-allowed',\n opacity: '0.5',\n },\n },\n clearTrigger: {\n alignItems: 'center',\n borderRadius: '4',\n color: 'icon/secondary',\n cursor: 'pointer',\n display: 'flex',\n justifyContent: 'center',\n padding: '4',\n _hover: {\n background: 'color/neutral/moderate',\n },\n _disabled: {\n cursor: 'not-allowed',\n opacity: '0.5',\n },\n },\n },\n variants: {\n size: {\n // Padding values below match the Figma control + input layer spec exactly\n // (see FRONTEND-572 thread / Figma node 1941:3510 for md, 1941:3487 for lg).\n // The outer control carries the size-specific padding; the inner tagsBlock adds a\n // constant 4px horizontal padding (set in the base) around the content regardless of size.\n md: {\n control: {\n paddingInlineEnd: '12',\n paddingInlineStart: '8',\n },\n // paddingBlock lives on tagsBlock (not control) so the suffixBlock (clear button) sits\n // at the control's inner top and its vertical center lines up with the first tag-row /\n // placeholder center — matches Figma's filled-state layout.\n tagsBlock: {\n paddingBlock: '8',\n },\n suffixBlock: {\n height: '40',\n },\n input: {\n height: '24',\n fontSize: '0.875rem',\n fontWeight: '400',\n lineHeight: 'normal',\n },\n },\n lg: {\n control: {\n paddingInlineEnd: '16',\n paddingInlineStart: '12',\n },\n tagsBlock: {\n paddingBlock: '12',\n },\n suffixBlock: {\n height: '48',\n },\n input: {\n fontSize: '1rem',\n fontWeight: '400',\n lineHeight: 'normal',\n },\n },\n },\n },\n defaultVariants: {\n size: 'lg',\n },\n});\n\nexport default tagsInputSlotRecipe;\n"],"mappings":"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"}

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

@@ -2,13 +2,13 @@ declare const tooltipSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition
     variant: {
         dark: {
             content: {
-                '--tooltip-bg': "colors.background.contrast";
+                '--tooltip-bg': "colors.background/contrast";
                 color: "text/on-contrast";
             };
         };
         light: {
             content: {
-                '--tooltip-bg': "colors.background.tertiary";
+                '--tooltip-bg': "colors.background/tertiary";
                 color: "text/primary";
             };
         };

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

@@ -11,7 +11,7 @@ var tooltipSlotRecipe = defineSlotRecipe({
 			pointerEvents: "none"
 		},
 		content: {
-			"--tooltip-bg": "colors.background.contrast",
+			"--tooltip-bg": "colors.background/contrast",
 			backgroundColor: "var(--tooltip-bg)",
 			color: "text/on-contrast",
 			boxShadow: "elevation/tooltip",
@@ -39,11 +39,11 @@ var tooltipSlotRecipe = defineSlotRecipe({
 	variants: {
 		variant: {
 			dark: { content: {
-				"--tooltip-bg": "colors.background.contrast",
+				"--tooltip-bg": "colors.background/contrast",
 				color: "text/on-contrast"
 			} },
 			light: { content: {
-				"--tooltip-bg": "colors.background.tertiary",
+				"--tooltip-bg": "colors.background/tertiary",
 				color: "text/primary"
 			} }
 		},

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 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: rem(1),\n borderInlineStartWidth: rem(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;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,IAAI,CAAC;GACrB,wBAAwB,IAAI,CAAC;GAC7B,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 { 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 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: rem(1),\n borderInlineStartWidth: rem(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;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,IAAI,CAAC;GACrB,wBAAwB,IAAI,CAAC;GAC7B,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"}

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

@@ -218,6 +218,62 @@ declare const slotRecipes: {
             };
             rounded: {};
         };
+        colorVariant: {
+            neutral: {
+                root: {
+                    color: "color/neutral/strong";
+                    backgroundColor: "color/neutral/subtle";
+                };
+            };
+            purple: {
+                root: {
+                    color: "color/purple/strong";
+                    backgroundColor: "color/purple/subtle";
+                };
+            };
+            indigo: {
+                root: {
+                    color: "color/indigo/strong";
+                    backgroundColor: "color/indigo/subtle";
+                };
+            };
+            blue: {
+                root: {
+                    color: "color/blue/strong";
+                    backgroundColor: "color/blue/subtle";
+                };
+            };
+            green: {
+                root: {
+                    color: "color/green/strong";
+                    backgroundColor: "color/green/subtle";
+                };
+            };
+            yellow: {
+                root: {
+                    color: "color/yellow/strong";
+                    backgroundColor: "color/yellow/subtle";
+                };
+            };
+            red: {
+                root: {
+                    color: "color/red/strong";
+                    backgroundColor: "color/red/subtle";
+                };
+            };
+            orange: {
+                root: {
+                    color: "color/orange/strong";
+                    backgroundColor: "color/orange/subtle";
+                };
+            };
+            turquoise: {
+                root: {
+                    color: "color/turquoise/strong";
+                    backgroundColor: "color/turquoise/subtle";
+                };
+            };
+        };
     }>;
     breadcrumb: import('@chakra-ui/react').SlotRecipeDefinition<"link" | "separator" | "list" | "ellipsis" | "root" | "item" | "currentLink", import('@chakra-ui/react').SlotRecipeVariantRecord<"link" | "separator" | "list" | "ellipsis" | "root" | "item" | "currentLink">>;
     card: import('@chakra-ui/react').SlotRecipeDefinition<"body" | "footer" | "header" | "title" | "root" | "description", {
@@ -856,7 +912,7 @@ declare const slotRecipes: {
         };
     }>;
     emptyState: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "title" | "root" | "indicator" | "description", {
-        colorScheme: {
+        colorVariant: {
             white: {
                 root: {
                     backgroundColor: "background/primary";
@@ -1007,7 +1063,7 @@ declare const slotRecipes: {
                 iconBar: {
                     backgroundColor: "status/success/bg";
                     borderColor: "status/success/border";
-                    color: "sys/green/base";
+                    color: "color/green/base";
                 };
                 root: {
                     borderColor: "status/success/border";
@@ -1017,7 +1073,7 @@ declare const slotRecipes: {
                 iconBar: {
                     backgroundColor: "status/warning/bg";
                     borderColor: "status/warning/border";
-                    color: "sys/yellow/base";
+                    color: "color/yellow/base";
                 };
                 root: {
                     borderColor: "status/warning/border";
@@ -1027,7 +1083,7 @@ declare const slotRecipes: {
                 iconBar: {
                     backgroundColor: "status/critical/bg";
                     borderColor: "status/critical/border";
-                    color: "sys/red/base";
+                    color: "color/red/base";
                 };
                 root: {
                     borderColor: "status/critical/border";
@@ -1105,7 +1161,7 @@ declare const slotRecipes: {
         status: {
             ai: {
                 iconBar: {
-                    background: "{colors.ai.background.minimal-vertical}";
+                    background: "ai/background/minimal-vertical";
                     color: string;
                 };
                 messageSolo: {
@@ -1114,7 +1170,7 @@ declare const slotRecipes: {
                 root: {
                     backgroundColor: "transparent";
                     border: "1px solid transparent";
-                    background: "linear-gradient({colors.background.primary}, {colors.background.primary}) padding-box, {colors.status.ai.border} border-box";
+                    background: "linear-gradient({colors.neutral.100}, {colors.neutral.100}) padding-box, linear-gradient(135deg, {colors.purple.80} 0%, {colors.indigo.80} 50%, {colors.blue.80} 100%) border-box";
                 };
                 title: {
                     color: string;
@@ -1243,7 +1299,7 @@ declare const slotRecipes: {
     }>;
     overflowContent: import('@chakra-ui/react').SlotRecipeDefinition<"root" | "action" | "preview", import('@chakra-ui/react').SlotRecipeVariantRecord<"root" | "action" | "preview">>;
     pageFooter: import('@chakra-ui/react').SlotRecipeDefinition<"link" | "status" | "root" | "statusLabel" | "statusDot" | "copyright" | "copyrightText" | "links", {
-        colorScheme: {
+        colorVariant: {
             gray: {
                 root: {
                     background: "background/secondary";
@@ -1304,11 +1360,11 @@ declare const slotRecipes: {
                 };
                 links: {
                     borderBlockEnd: {
-                        base: "1px solid {colors.border.minimal}";
+                        base: "1px solid {colors.neutral.93}";
                         tablet: "none";
                     };
                     borderBlockStart: {
-                        base: "1px solid {colors.border.minimal}";
+                        base: "1px solid {colors.neutral.93}";
                         tablet: "none";
                     };
                     paddingBlock: {
@@ -1326,7 +1382,7 @@ declare const slotRecipes: {
                 };
                 links: {
                     borderBlockEnd: {
-                        base: "1px solid {colors.border.minimal}";
+                        base: "1px solid {colors.neutral.93}";
                         tablet: "none";
                     };
                     paddingBlockEnd: {
@@ -1448,7 +1504,45 @@ declare const slotRecipes: {
             };
         };
     }>;
-    ribbon: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "root" | "textBlock", import('@chakra-ui/react').SlotRecipeVariantRecord<"content" | "root" | "textBlock">>;
+    ribbon: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "root" | "textBlock", {
+        colorVariant: {
+            blue: {
+                root: {
+                    background: "color/blue/subtle";
+                    borderColor: "color/blue/muted";
+                    color: "color/blue/strong";
+                };
+            };
+            green: {
+                root: {
+                    background: "color/green/subtle";
+                    borderColor: "color/green/muted";
+                    color: "color/green/strong";
+                };
+            };
+            yellow: {
+                root: {
+                    background: "color/yellow/subtle";
+                    borderColor: "color/yellow/muted";
+                    color: "color/yellow/strong";
+                };
+            };
+            red: {
+                root: {
+                    background: "color/red/subtle";
+                    borderColor: "color/red/muted";
+                    color: "color/red/strong";
+                };
+            };
+            purple: {
+                root: {
+                    background: "color/purple/subtle";
+                    borderColor: "color/purple/muted";
+                    color: "color/purple/strong";
+                };
+            };
+        };
+    }>;
     sectionHeading: import('@chakra-ui/react').SlotRecipeDefinition<"label" | "icon" | "root" | "titleBlock" | "helperText" | "contentBlock" | "helperBlock", import('@chakra-ui/react').SlotRecipeVariantRecord<"label" | "icon" | "root" | "titleBlock" | "helperText" | "contentBlock" | "helperBlock">>;
     labeledData: import('@chakra-ui/react').SlotRecipeDefinition<"label" | "value" | "root" | "limit" | "helpText", {
         size: {
@@ -2032,7 +2126,7 @@ declare const slotRecipes: {
                         backgroundColor: "background/active";
                     };
                     _disabled: {
-                        backgroundColor: "sys/neutral/moderate";
+                        backgroundColor: "color/neutral/moderate";
                         color: "text/on-disabled";
                     };
                     _selected: {
@@ -2047,6 +2141,50 @@ declare const slotRecipes: {
         };
     }>;
     tag: import('@chakra-ui/react').SlotRecipeDefinition<"label" | "root" | "closeTrigger" | "startElement" | "endElement", {
+        colorVariant: {
+            neutral: {
+                root: {
+                    backgroundColor: "color/neutral/subtle";
+                    borderColor: "color/neutral/muted";
+                    color: "color/neutral/strong";
+                };
+            };
+            blue: {
+                root: {
+                    backgroundColor: "color/blue/subtle";
+                    borderColor: "color/blue/muted";
+                    color: "color/blue/strong";
+                };
+            };
+            green: {
+                root: {
+                    backgroundColor: "color/green/subtle";
+                    borderColor: "color/green/muted";
+                    color: "color/green/strong";
+                };
+            };
+            red: {
+                root: {
+                    backgroundColor: "color/red/subtle";
+                    borderColor: "color/red/muted";
+                    color: "color/red/strong";
+                };
+            };
+            yellow: {
+                root: {
+                    backgroundColor: "color/yellow/subtle";
+                    borderColor: "color/yellow/muted";
+                    color: "color/yellow/strong";
+                };
+            };
+            purple: {
+                root: {
+                    backgroundColor: "color/purple/subtle";
+                    borderColor: "color/purple/muted";
+                    color: "color/purple/strong";
+                };
+            };
+        };
         disabled: {
             true: {
                 root: {
@@ -2170,13 +2308,13 @@ declare const slotRecipes: {
         variant: {
             dark: {
                 content: {
-                    '--tooltip-bg': "colors.background.contrast";
+                    '--tooltip-bg': "colors.background/contrast";
                     color: "text/on-contrast";
                 };
             };
             light: {
                 content: {
-                    '--tooltip-bg': "colors.background.tertiary";
+                    '--tooltip-bg': "colors.background/tertiary";
                     color: "text/primary";
                 };
             };

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

@@ -1,8 +1,8 @@
+import avatarSlotRecipe from "./Avatar.recipe.js";
 import numberInputSlotRecipe from "./NumberInput.recipe.js";
 import accordionSlotRecipe from "./Accordion.recipe.js";
 import actionBarSlotRecipe from "./ActionBar.recipe.js";
 import alertSlotRecipe from "./Alert.recipe.js";
-import avatarSlotRecipe from "./Avatar.recipe.js";
 import breadcrumbSlotRecipe from "./Breadcrumb.recipe.js";
 import cardSlotRecipe from "./Card.recipe.js";
 import checkboxSlotRecipe from "./Checkbox.recipe.js";