npm - @bitrise/bitkit-v2 - Versions diffs - 0.3.205 → 0.3.207 - Mend

@bitrise/bitkit-v2 0.3.205 → 0.3.207

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

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

@@ -14,7 +14,7 @@ declare const markdownCardSlotRecipe: import('@chakra-ui/react').SlotRecipeDefin
             iconBar: {
                 backgroundColor: "status/success/bg";
                 borderColor: "status/success/border";
-                color: "status/success/icon";
+                color: "sys/green/base";
             };
             root: {
                 borderColor: "status/success/border";
@@ -24,7 +24,7 @@ declare const markdownCardSlotRecipe: import('@chakra-ui/react').SlotRecipeDefin
             iconBar: {
                 backgroundColor: "status/warning/bg";
                 borderColor: "status/warning/border";
-                color: "status/warning/icon";
+                color: "sys/yellow/base";
             };
             root: {
                 borderColor: "status/warning/border";
@@ -34,7 +34,7 @@ declare const markdownCardSlotRecipe: import('@chakra-ui/react').SlotRecipeDefin
             iconBar: {
                 backgroundColor: "status/critical/bg";
                 borderColor: "status/critical/border";
-                color: "status/critical/icon";
+                color: "sys/red/base";
             };
             root: {
                 borderColor: "status/critical/border";

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

@@ -43,6 +43,7 @@ var markdownCardSlotRecipe = defineSlotRecipe({
 		footerButtons: {
 			justifyContent: "flex-end",
 			paddingBlockEnd: "16",
+			paddingBlockStart: "16",
 			paddingInlineEnd: "8"
 		}
 	},
@@ -59,7 +60,7 @@ var markdownCardSlotRecipe = defineSlotRecipe({
 			iconBar: {
 				backgroundColor: "status/success/bg",
 				borderColor: "status/success/border",
-				color: "status/success/icon"
+				color: "sys/green/base"
 			},
 			root: { borderColor: "status/success/border" }
 		},
@@ -67,7 +68,7 @@ var markdownCardSlotRecipe = defineSlotRecipe({
 			iconBar: {
 				backgroundColor: "status/warning/bg",
 				borderColor: "status/warning/border",
-				color: "status/warning/icon"
+				color: "sys/yellow/base"
 			},
 			root: { borderColor: "status/warning/border" }
 		},
@@ -75,7 +76,7 @@ var markdownCardSlotRecipe = defineSlotRecipe({
 			iconBar: {
 				backgroundColor: "status/critical/bg",
 				borderColor: "status/critical/border",
-				color: "status/critical/icon"
+				color: "sys/red/base"
 			},
 			root: { borderColor: "status/critical/border" }
 		}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"MarkdownCard.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/MarkdownCard.recipe.ts"],"sourcesContent":["import { cardAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nconst markdownCardSlotRecipe = defineSlotRecipe({\n className: 'markdown-card',\n slots: [...cardAnatomy.keys(), 'iconBar', 'content', 'gradient', 'footerButtons'],\n base: {\n root: {\n backgroundColor: 'background/primary',\n overflow: 'hidden',\n },\n iconBar: {\n display: 'flex',\n alignItems: 'flex-start',\n justifyContent: 'center',\n paddingInline: '8',\n paddingBlock: '12',\n flexShrink: 0,\n borderInlineEnd: '1px solid',\n },\n content: {\n flex: 1,\n paddingInlineStart: '16',\n paddingInlineEnd: '24',\n paddingBlockStart: '24',\n minWidth: 0,\n position: 'relative',\n },\n gradient: {\n background: 'linear-gradient(to top, {colors.background.primary} 12.5%, transparent)',\n bottom: 0,\n height: '128',\n insetInline: 0,\n pointerEvents: 'none',\n position: 'absolute',\n },\n footerButtons: {\n justifyContent: 'flex-end',\n paddingBlockEnd: '16',\n paddingInlineEnd: '8',\n },\n },\n variants: {\n status: {\n info: {\n iconBar: {\n backgroundColor: 'background/secondary',\n borderColor: 'border/regular',\n color: 'icon/secondary',\n },\n root: {\n borderColor: 'border/regular',\n },\n },\n success: {\n iconBar: {\n backgroundColor: 'status/success/bg',\n borderColor: 'status/success/border',\n color: '~~status~~/~~success~~/~~icon~~',\n },\n root: {\n borderColor: 'status/success/border',\n },\n },\n warning: {\n iconBar: {\n backgroundColor: 'status/warning/bg',\n borderColor: 'status/warning/border',\n color: '~~status~~/~~warning~~/~~icon~~',\n },\n root: {\n borderColor: 'status/warning/border',\n },\n },\n critical: {\n iconBar: {\n backgroundColor: 'status/critical/bg',\n borderColor: 'status/critical/border',\n color: '~~status~~/~~critical~~/~~icon~~',\n },\n root: {\n borderColor: 'status/critical/border',\n },\n },\n },\n },\n defaultVariants: {\n status: 'info',\n },\n});\n\nexport default markdownCardSlotRecipe;\n"],"mappings":";;;AAGA,IAAM,yBAAyB,iBAAiB;CAC9C,WAAW;CACX,OAAO;EAAC,GAAG,YAAY,MAAM;EAAE;EAAW;EAAW;EAAY;EAAgB;CACjF,MAAM;EACJ,MAAM;GACJ,iBAAiB;GACjB,UAAU;GACX;EACD,SAAS;GACP,SAAS;GACT,YAAY;GACZ,gBAAgB;GAChB,eAAe;GACf,cAAc;GACd,YAAY;GACZ,iBAAiB;GAClB;EACD,SAAS;GACP,MAAM;GACN,oBAAoB;GACpB,kBAAkB;GAClB,mBAAmB;GACnB,UAAU;GACV,UAAU;GACX;EACD,UAAU;GACR,YAAY;GACZ,QAAQ;GACR,QAAQ;GACR,aAAa;GACb,eAAe;GACf,UAAU;GACX;EACD,eAAe;GACb,gBAAgB;GAChB,iBAAiB;GACjB,kBAAkB;GACnB;EACF;CACD,UAAU,EACR,QAAQ;EACN,MAAM;GACJ,SAAS;IACP,iBAAiB;IACjB,aAAa;IACb,OAAO;IACR;GACD,MAAM,EACJ,aAAa,kBACd;GACF;EACD,SAAS;GACP,SAAS;IACP,iBAAiB;IACjB,aAAa;IACb,OAAO;IACR;GACD,MAAM,EACJ,aAAa,yBACd;GACF;EACD,SAAS;GACP,SAAS;IACP,iBAAiB;IACjB,aAAa;IACb,OAAO;IACR;GACD,MAAM,EACJ,aAAa,yBACd;GACF;EACD,UAAU;GACR,SAAS;IACP,iBAAiB;IACjB,aAAa;IACb,OAAO;IACR;GACD,MAAM,EACJ,aAAa,0BACd;GACF;EACF,EACF;CACD,iBAAiB,EACf,QAAQ,QACT;CACF,CAAC"}
1	+ {"version":3,"file":"MarkdownCard.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/MarkdownCard.recipe.ts"],"sourcesContent":["import { cardAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nconst markdownCardSlotRecipe = defineSlotRecipe({\n className: 'markdown-card',\n slots: [...cardAnatomy.keys(), 'iconBar', 'content', 'gradient', 'footerButtons'],\n base: {\n root: {\n backgroundColor: 'background/primary',\n overflow: 'hidden',\n },\n iconBar: {\n display: 'flex',\n alignItems: 'flex-start',\n justifyContent: 'center',\n paddingInline: '8',\n paddingBlock: '12',\n flexShrink: 0,\n borderInlineEnd: '1px solid',\n },\n content: {\n flex: 1,\n paddingInlineStart: '16',\n paddingInlineEnd: '24',\n paddingBlockStart: '24',\n minWidth: 0,\n position: 'relative',\n },\n gradient: {\n background: 'linear-gradient(to top, {colors.background.primary} 12.5%, transparent)',\n bottom: 0,\n height: '128',\n insetInline: 0,\n pointerEvents: 'none',\n position: 'absolute',\n },\n footerButtons: {\n justifyContent: 'flex-end',\n paddingBlockEnd: '16',\n paddingBlockStart: '16',\n paddingInlineEnd: '8',\n },\n },\n variants: {\n status: {\n info: {\n iconBar: {\n backgroundColor: 'background/secondary',\n borderColor: 'border/regular',\n color: 'icon/secondary',\n },\n root: {\n borderColor: 'border/regular',\n },\n },\n success: {\n iconBar: {\n backgroundColor: 'status/success/bg',\n borderColor: 'status/success/border',\n color: 'sys/green/base',\n },\n root: {\n borderColor: 'status/success/border',\n },\n },\n warning: {\n iconBar: {\n backgroundColor: 'status/warning/bg',\n borderColor: 'status/warning/border',\n color: 'sys/yellow/base',\n },\n root: {\n borderColor: 'status/warning/border',\n },\n },\n critical: {\n iconBar: {\n backgroundColor: 'status/critical/bg',\n borderColor: 'status/critical/border',\n color: 'sys/red/base',\n },\n root: {\n borderColor: 'status/critical/border',\n },\n },\n },\n },\n defaultVariants: {\n status: 'info',\n },\n});\n\nexport default markdownCardSlotRecipe;\n"],"mappings":";;;AAGA,IAAM,yBAAyB,iBAAiB;CAC9C,WAAW;CACX,OAAO;EAAC,GAAG,YAAY,MAAM;EAAE;EAAW;EAAW;EAAY;EAAgB;CACjF,MAAM;EACJ,MAAM;GACJ,iBAAiB;GACjB,UAAU;GACX;EACD,SAAS;GACP,SAAS;GACT,YAAY;GACZ,gBAAgB;GAChB,eAAe;GACf,cAAc;GACd,YAAY;GACZ,iBAAiB;GAClB;EACD,SAAS;GACP,MAAM;GACN,oBAAoB;GACpB,kBAAkB;GAClB,mBAAmB;GACnB,UAAU;GACV,UAAU;GACX;EACD,UAAU;GACR,YAAY;GACZ,QAAQ;GACR,QAAQ;GACR,aAAa;GACb,eAAe;GACf,UAAU;GACX;EACD,eAAe;GACb,gBAAgB;GAChB,iBAAiB;GACjB,mBAAmB;GACnB,kBAAkB;GACnB;EACF;CACD,UAAU,EACR,QAAQ;EACN,MAAM;GACJ,SAAS;IACP,iBAAiB;IACjB,aAAa;IACb,OAAO;IACR;GACD,MAAM,EACJ,aAAa,kBACd;GACF;EACD,SAAS;GACP,SAAS;IACP,iBAAiB;IACjB,aAAa;IACb,OAAO;IACR;GACD,MAAM,EACJ,aAAa,yBACd;GACF;EACD,SAAS;GACP,SAAS;IACP,iBAAiB;IACjB,aAAa;IACb,OAAO;IACR;GACD,MAAM,EACJ,aAAa,yBACd;GACF;EACD,UAAU;GACR,SAAS;IACP,iBAAiB;IACjB,aAAa;IACb,OAAO;IACR;GACD,MAAM,EACJ,aAAa,0BACd;GACF;EACF,EACF;CACD,iBAAiB,EACf,QAAQ,QACT;CACF,CAAC"}

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

@@ -1,6 +1,13 @@
-import { ICONS_MAP } from "../common/AlertAndToast.common.js";
 import { defineSlotRecipe } from "@chakra-ui/react/styled-system";
 //#region lib/theme/slot-recipes/NoteCard.recipe.ts
+var SIDEBAR_ICON_COLOR_MAP = {
+	ai: "sys/indigo/base",
+	critical: "sys/red/base",
+	info: "sys/blue/base",
+	progress: "sys/purple/base",
+	success: "sys/green/base",
+	warning: "sys/yellow/base"
+};
 var TITLE_COLOR_MAP = {
 	ai: "status/ai/text",
 	critical: "text/negative",
@@ -12,7 +19,7 @@ var TITLE_COLOR_MAP = {
 var getStatusVariant = (v) => ({
 	iconBar: {
 		backgroundColor: `status/${v}/bg`,
-		color: ICONS_MAP[v]
+		color: SIDEBAR_ICON_COLOR_MAP[v]
 	},
 	messageSolo: { color: TITLE_COLOR_MAP[v] },
 	root: { borderColor: `status/${v}/border` },
@@ -78,14 +85,17 @@ var noteCardSlotRecipe = defineSlotRecipe({
 			textStyle: "comp/notification/message",
 			color: "text/body"
 		},
-		messageSolo: { textStyle: "comp/notification/message" },
+		messageSolo: {
+			paddingBlockStart: "2",
+			textStyle: "comp/notification/message"
+		},
 		actionArea: { flexShrink: 0 }
 	},
 	variants: { status: {
 		ai: {
 			iconBar: {
 				background: "{colors.ai.background.minimal-vertical}",
-				color: ICONS_MAP.ai
+				color: SIDEBAR_ICON_COLOR_MAP.ai
 			},
 			messageSolo: { color: TITLE_COLOR_MAP.ai },
 			root: {

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

	@@ -1 +1 @@
1	- {"version":3,"file":"NoteCard.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/NoteCard.recipe.ts"],"sourcesContent":["import { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { ~~ICONS_MAP,~~ type NotificationVariant } from '../common/AlertAndToast.common';\n\nconst TITLE_COLOR_MAP: Record<NotificationVariant, string> = {\n ai: 'status/ai/text',\n critical: 'text/negative',\n info: 'text/primary',\n progress: 'text/secondary',\n success: 'text/positive',\n warning: 'text/primary',\n};\n\nconst getStatusVariant = (v: NotificationVariant) => ({\n iconBar: {\n backgroundColor: `status/${v}/bg`,\n color: ~~ICONS_MAP~~[v],\n },\n messageSolo: { color: TITLE_COLOR_MAP[v] },\n root: { borderColor: `status/${v}/border` },\n title: { color: TITLE_COLOR_MAP[v] },\n});\n\nconst noteCardSlotRecipe = defineSlotRecipe({\n className: 'note-card',\n slots: ['root', 'iconBar', 'iconWrapper', 'content', 'messageBlock', 'title', 'message', 'messageSolo', 'actionArea'],\n base: {\n root: {\n alignItems: 'stretch',\n backgroundColor: 'background/primary',\n border: '1px solid',\n borderRadius: '8',\n display: 'flex',\n overflow: 'hidden',\n },\n iconBar: {\n alignItems: 'flex-start',\n display: 'flex',\n flexShrink: 0,\n justifyContent: 'center',\n paddingBlock: '12',\n paddingInline: '8',\n },\n iconWrapper: {\n alignItems: 'center',\n display: 'flex',\n height: '24',\n justifyContent: 'center',\n width: '24',\n },\n content: {\n alignItems: 'center',\n display: 'flex',\n flex: 1,\n gap: '24',\n minWidth: 0,\n paddingBlock: '12',\n paddingInlineEnd: '16',\n paddingInlineStart: '12',\n },\n messageBlock: {\n display: 'flex',\n flex: 1,\n flexDirection: 'column',\n gap: '4',\n minWidth: 0,\n width: '100%',\n },\n title: {\n textStyle: 'comp/notification/title',\n },\n message: {\n textStyle: 'comp/notification/message',\n color: 'text/body',\n },\n messageSolo: {\n textStyle: 'comp/notification/message',\n },\n actionArea: {\n flexShrink: 0,\n },\n },\n variants: {\n status: {\n ai: {\n iconBar: {\n background: '{colors.ai.background.minimal-vertical}',\n color: ~~ICONS_MAP~~.ai,\n },\n messageSolo: { color: TITLE_COLOR_MAP.ai },\n root: {\n backgroundColor: 'transparent',\n border: '1px solid transparent',\n background:\n 'linear-gradient({colors.background.primary}, {colors.background.primary}) padding-box, {colors.status.ai.border} border-box',\n },\n title: { color: TITLE_COLOR_MAP.ai },\n },\n critical: getStatusVariant('critical'),\n info: getStatusVariant('info'),\n progress: getStatusVariant('progress'),\n success: getStatusVariant('success'),\n warning: getStatusVariant('warning'),\n },\n },\n defaultVariants: {\n status: 'info',\n },\n});\n\nexport default noteCardSlotRecipe;\n"],"mappings":"~~;;;~~AAIA,IAAM,kBAAuD;CAC3D,IAAI;CACJ,UAAU;CACV,MAAM;CACN,UAAU;CACV,SAAS;CACT,SAAS;CACV;AAED,IAAM,oBAAoB,OAA4B;CACpD,SAAS;EACP,iBAAiB,UAAU,EAAE;EAC7B,OAAO,~~UAAU~~;~~EAClB~~;CACD,aAAa,EAAE,OAAO,gBAAgB,IAAI;CAC1C,MAAM,EAAE,aAAa,UAAU,EAAE,UAAU;CAC3C,OAAO,EAAE,OAAO,gBAAgB,IAAI;CACrC;AAED,IAAM,qBAAqB,iBAAiB;CAC1C,WAAW;CACX,OAAO;EAAC;EAAQ;EAAW;EAAe;EAAW;EAAgB;EAAS;EAAW;EAAe;EAAa;CACrH,MAAM;EACJ,MAAM;GACJ,YAAY;GACZ,iBAAiB;GACjB,QAAQ;GACR,cAAc;GACd,SAAS;GACT,UAAU;GACX;EACD,SAAS;GACP,YAAY;GACZ,SAAS;GACT,YAAY;GACZ,gBAAgB;GAChB,cAAc;GACd,eAAe;GAChB;EACD,aAAa;GACX,YAAY;GACZ,SAAS;GACT,QAAQ;GACR,gBAAgB;GAChB,OAAO;GACR;EACD,SAAS;GACP,YAAY;GACZ,SAAS;GACT,MAAM;GACN,KAAK;GACL,UAAU;GACV,cAAc;GACd,kBAAkB;GAClB,oBAAoB;GACrB;EACD,cAAc;GACZ,SAAS;GACT,MAAM;GACN,eAAe;GACf,KAAK;GACL,UAAU;GACV,OAAO;GACR;EACD,OAAO,EACL,WAAW,2BACZ;EACD,SAAS;GACP,WAAW;GACX,OAAO;GACR;EACD,aAAa,~~EACX~~,WAAW~~,6BACZ~~;EACD,YAAY,EACV,YAAY,GACb;EACF;CACD,UAAU,EACR,QAAQ;EACN,IAAI;GACF,SAAS;IACP,YAAY;IACZ,OAAO,~~UAAU~~;~~IAClB~~;GACD,aAAa,EAAE,OAAO,gBAAgB,IAAI;GAC1C,MAAM;IACJ,iBAAiB;IACjB,QAAQ;IACR,YACE;IACH;GACD,OAAO,EAAE,OAAO,gBAAgB,IAAI;GACrC;EACD,UAAU,iBAAiB,WAAW;EACtC,MAAM,iBAAiB,OAAO;EAC9B,UAAU,iBAAiB,WAAW;EACtC,SAAS,iBAAiB,UAAU;EACpC,SAAS,iBAAiB,UAAU;EACrC,EACF;CACD,iBAAiB,EACf,QAAQ,QACT;CACF,CAAC"}
1	+ {"version":3,"file":"NoteCard.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/NoteCard.recipe.ts"],"sourcesContent":["import { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { type NotificationVariant } from '../common/AlertAndToast.common';\n\nconst SIDEBAR_ICON_COLOR_MAP: Record<NotificationVariant, string> = {\n ai: 'sys/indigo/base',\n critical: 'sys/red/base',\n info: 'sys/blue/base',\n progress: 'sys/purple/base',\n success: 'sys/green/base',\n warning: 'sys/yellow/base',\n};\n\nconst TITLE_COLOR_MAP: Record<NotificationVariant, string> = {\n ai: 'status/ai/text',\n critical: 'text/negative',\n info: 'text/primary',\n progress: 'text/secondary',\n success: 'text/positive',\n warning: 'text/primary',\n};\n\nconst getStatusVariant = (v: NotificationVariant) => ({\n iconBar: {\n backgroundColor: `status/${v}/bg`,\n color: SIDEBAR_ICON_COLOR_MAP[v],\n },\n messageSolo: { color: TITLE_COLOR_MAP[v] },\n root: { borderColor: `status/${v}/border` },\n title: { color: TITLE_COLOR_MAP[v] },\n});\n\nconst noteCardSlotRecipe = defineSlotRecipe({\n className: 'note-card',\n slots: ['root', 'iconBar', 'iconWrapper', 'content', 'messageBlock', 'title', 'message', 'messageSolo', 'actionArea'],\n base: {\n root: {\n alignItems: 'stretch',\n backgroundColor: 'background/primary',\n border: '1px solid',\n borderRadius: '8',\n display: 'flex',\n overflow: 'hidden',\n },\n iconBar: {\n alignItems: 'flex-start',\n display: 'flex',\n flexShrink: 0,\n justifyContent: 'center',\n paddingBlock: '12',\n paddingInline: '8',\n },\n iconWrapper: {\n alignItems: 'center',\n display: 'flex',\n height: '24',\n justifyContent: 'center',\n width: '24',\n },\n content: {\n alignItems: 'center',\n display: 'flex',\n flex: 1,\n gap: '24',\n minWidth: 0,\n paddingBlock: '12',\n paddingInlineEnd: '16',\n paddingInlineStart: '12',\n },\n messageBlock: {\n display: 'flex',\n flex: 1,\n flexDirection: 'column',\n gap: '4',\n minWidth: 0,\n width: '100%',\n },\n title: {\n textStyle: 'comp/notification/title',\n },\n message: {\n textStyle: 'comp/notification/message',\n color: 'text/body',\n },\n messageSolo: {\n paddingBlockStart: '2',\n textStyle: 'comp/notification/message',\n },\n actionArea: {\n flexShrink: 0,\n },\n },\n variants: {\n status: {\n ai: {\n iconBar: {\n background: '{colors.ai.background.minimal-vertical}',\n color: SIDEBAR_ICON_COLOR_MAP.ai,\n },\n messageSolo: { color: TITLE_COLOR_MAP.ai },\n root: {\n backgroundColor: 'transparent',\n border: '1px solid transparent',\n background:\n 'linear-gradient({colors.background.primary}, {colors.background.primary}) padding-box, {colors.status.ai.border} border-box',\n },\n title: { color: TITLE_COLOR_MAP.ai },\n },\n critical: getStatusVariant('critical'),\n info: getStatusVariant('info'),\n progress: getStatusVariant('progress'),\n success: getStatusVariant('success'),\n warning: getStatusVariant('warning'),\n },\n },\n defaultVariants: {\n status: 'info',\n },\n});\n\nexport default noteCardSlotRecipe;\n"],"mappings":";;AAIA,IAAM,yBAA8D;CAClE,IAAI;CACJ,UAAU;CACV,MAAM;CACN,UAAU;CACV,SAAS;CACT,SAAS;CACV;AAED,IAAM,kBAAuD;CAC3D,IAAI;CACJ,UAAU;CACV,MAAM;CACN,UAAU;CACV,SAAS;CACT,SAAS;CACV;AAED,IAAM,oBAAoB,OAA4B;CACpD,SAAS;EACP,iBAAiB,UAAU,EAAE;EAC7B,OAAO,uBAAuB;EAC/B;CACD,aAAa,EAAE,OAAO,gBAAgB,IAAI;CAC1C,MAAM,EAAE,aAAa,UAAU,EAAE,UAAU;CAC3C,OAAO,EAAE,OAAO,gBAAgB,IAAI;CACrC;AAED,IAAM,qBAAqB,iBAAiB;CAC1C,WAAW;CACX,OAAO;EAAC;EAAQ;EAAW;EAAe;EAAW;EAAgB;EAAS;EAAW;EAAe;EAAa;CACrH,MAAM;EACJ,MAAM;GACJ,YAAY;GACZ,iBAAiB;GACjB,QAAQ;GACR,cAAc;GACd,SAAS;GACT,UAAU;GACX;EACD,SAAS;GACP,YAAY;GACZ,SAAS;GACT,YAAY;GACZ,gBAAgB;GAChB,cAAc;GACd,eAAe;GAChB;EACD,aAAa;GACX,YAAY;GACZ,SAAS;GACT,QAAQ;GACR,gBAAgB;GAChB,OAAO;GACR;EACD,SAAS;GACP,YAAY;GACZ,SAAS;GACT,MAAM;GACN,KAAK;GACL,UAAU;GACV,cAAc;GACd,kBAAkB;GAClB,oBAAoB;GACrB;EACD,cAAc;GACZ,SAAS;GACT,MAAM;GACN,eAAe;GACf,KAAK;GACL,UAAU;GACV,OAAO;GACR;EACD,OAAO,EACL,WAAW,2BACZ;EACD,SAAS;GACP,WAAW;GACX,OAAO;GACR;EACD,aAAa;GACX,mBAAmB;GACnB,WAAW;GACZ;EACD,YAAY,EACV,YAAY,GACb;EACF;CACD,UAAU,EACR,QAAQ;EACN,IAAI;GACF,SAAS;IACP,YAAY;IACZ,OAAO,uBAAuB;IAC/B;GACD,aAAa,EAAE,OAAO,gBAAgB,IAAI;GAC1C,MAAM;IACJ,iBAAiB;IACjB,QAAQ;IACR,YACE;IACH;GACD,OAAO,EAAE,OAAO,gBAAgB,IAAI;GACrC;EACD,UAAU,iBAAiB,WAAW;EACtC,MAAM,iBAAiB,OAAO;EAC9B,UAAU,iBAAiB,WAAW;EACtC,SAAS,iBAAiB,UAAU;EACpC,SAAS,iBAAiB,UAAU;EACrC,EACF;CACD,iBAAiB,EACf,QAAQ,QACT;CACF,CAAC"}

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

@@ -140,8 +140,6 @@ var selectSlotRecipe = defineSlotRecipe({
 			display: "inline-flex",
 			alignItems: "center",
 			justifyContent: "center",
-			width: "24",
-			height: "24",
 			flexShrink: 0,
 			borderWidth: rem(1),
 			borderColor: "border/regular",
@@ -199,21 +197,23 @@ var selectSlotRecipe = defineSlotRecipe({
 			flexShrink: 0,
 			_hover: { background: "background/hover" }
 		},
-		createItem: {
+		createItemContainer: {
 			borderTop: "1px solid",
 			borderColor: "border/minimal",
+			paddingBlock: "8",
+			flexShrink: 0
+		},
+		createItem: {
 			display: "flex",
 			alignItems: "center",
 			gap: "12",
 			paddingInlineEnd: "24",
 			paddingInlineStart: "16",
-			paddingBlock: "20",
 			color: "text/primary",
-			textStyle: "body/lg/regular",
 			width: "100%",
 			cursor: "pointer",
 			textAlign: "start",
-			flexShrink: 0,
+			_icon: { color: "icon/secondary" },
 			_hover: {
 				background: "button/secondary/bg-hover",
 				_active: { background: "button/secondary/bg-active" }
@@ -225,6 +225,10 @@ var selectSlotRecipe = defineSlotRecipe({
 	variants: { size: {
 		lg: {
 			...variants.size.lg,
+			checkbox: {
+				width: "24",
+				height: "24"
+			},
 			item: {
 				...variants.size.lg.item,
 				"&:has([data-slot=\"avatar\"])": {
@@ -234,6 +238,7 @@ var selectSlotRecipe = defineSlotRecipe({
 					gap: "8"
 				},
 				"&:has([data-slot=\"checkbox\"])": {
+					minHeight: "48",
 					paddingInlineEnd: "24",
 					paddingBlock: "12",
 					gap: "12"
@@ -242,10 +247,16 @@ var selectSlotRecipe = defineSlotRecipe({
 			itemList: { maxHeight: rem(280) },
 			itemLabel: {
 				textStyle: "body/lg/regular",
-				lineHeight: rem(24)
+				lineHeight: "normal"
 			},
 			itemLoadingLabel: { textStyle: "body/lg/regular" },
 			emptyState: { paddingBlock: "12" },
+			createItem: {
+				minHeight: "48",
+				paddingBlock: "12",
+				textStyle: "body/lg/regular",
+				lineHeight: "normal"
+			},
 			searchInputGroup: {
 				height: rem(56),
 				paddingBlock: "16"
@@ -255,6 +266,10 @@ var selectSlotRecipe = defineSlotRecipe({
 		},
 		md: {
 			...variants.size.md,
+			checkbox: {
+				width: "20",
+				height: "20"
+			},
 			item: {
 				...variants.size.md.item,
 				"&:has([data-slot=\"avatar\"])": {
@@ -264,6 +279,7 @@ var selectSlotRecipe = defineSlotRecipe({
 					gap: "8"
 				},
 				"&:has([data-slot=\"checkbox\"])": {
+					minHeight: "40",
 					paddingInlineEnd: "24",
 					paddingBlock: "8",
 					gap: "12"
@@ -272,14 +288,15 @@ var selectSlotRecipe = defineSlotRecipe({
 			itemList: { maxHeight: rem(236) },
 			itemLabel: {
 				textStyle: "body/md/regular",
-				lineHeight: rem(20)
+				lineHeight: "normal"
 			},
 			itemLoadingLabel: { textStyle: "body/md/regular" },
 			emptyState: { paddingBlock: "8" },
 			createItem: {
-				color: "text/primary",
-				paddingBlock: "16",
-				textStyle: "body/md/regular"
+				minHeight: "40",
+				paddingBlock: "8",
+				textStyle: "body/md/regular",
+				lineHeight: "normal"
 			},
 			trigger: {
 				textStyle: "body/md/regular",

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 'createItemContainer',\n 'createItem',\n 'checkbox',\n 'checkmark',\n 'itemList',\n 'itemContent',\n 'itemLabel',\n 'itemHelperText',\n 'itemLoading',\n 'itemLoadingLabel',\n 'emptyState',\n ],\n base: {\n trigger: {\n display: 'flex',\n alignItems: 'center',\n borderWidth: rem(1),\n borderColor: 'border/strong',\n background: 'bg.muted',\n color: 'input/text/inputValue',\n gap: '8',\n justifyContent: 'space-between',\n paddingInline: '16',\n paddingBlock: rem(11),\n borderRadius: '4',\n userSelect: 'none',\n textAlign: 'start',\n focusVisibleRing: 'inside',\n width: '100%',\n _placeholderShown: {\n color: 'text/secondary',\n },\n _disabled: {\n color: 'text/disabled',\n background: 'background/disabled',\n },\n _invalid: {\n borderColor: 'border/error',\n },\n _readOnly: {\n background: 'background/disabled',\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 paddingInline: '16',\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 },\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 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 alignItems: 'flex-start',\n flex: '1 0 0',\n minWidth: 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 itemLabel: {\n color: 'text/body',\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n maxWidth: '100%',\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 '[data-disabled] &': {\n color: 'text/disabled',\n },\n },\n checkbox: {\n position: 'relative',\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n width: '24',\n height: '24',\n flexShrink: 0,\n borderWidth: rem(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 createItem: {\n borderTop: '1px solid',\n borderColor: 'border/minimal',\n display: 'flex',\n alignItems: 'center',\n gap: '12',\n paddingInlineEnd: '24',\n paddingInlineStart: '16',\n paddingBlock: '20',\n color: 'text/primary',\n textStyle: 'body/lg/regular',\n width: '100%',\n cursor: 'pointer',\n textAlign: 'start',\n flexShrink: 0,\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 _focusVisible: {\n outlineOffset: '-3px',\n },\n },\n },\n\n variants: {\n size: {\n lg: {\n ...variants.size.lg,\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 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: rem(24),\n },\n itemLoadingLabel: {\n textStyle: 'body/lg/regular',\n },\n emptyState: {\n paddingBlock: '12',\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 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 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: rem(20),\n },\n itemLoadingLabel: {\n textStyle: 'body/md/regular',\n },\n emptyState: {\n paddingBlock: '8',\n },\n createItem: {\n color: 'text/primary',\n paddingBlock: '16',\n textStyle: 'body/md/regular',\n },\n trigger: {\n textStyle: 'body/md/regular',\n paddingBlock: rem(9),\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":";;;;;AAMA,IAAa,mBAAmB,iBAAiB;CAC/C,WAAW;CACX,OAAO;EACL,GAAG,cAAc,MAAM;EACvB;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,MAAM;EACJ,SAAS;GACP,SAAS;GACT,YAAY;GACZ,aAAa,IAAI,EAAE;GACnB,aAAa;GACb,YAAY;GACZ,OAAO;GACP,KAAK;GACL,gBAAgB;GAChB,eAAe;GACf,cAAc,IAAI,GAAG;GACrB,cAAc;GACd,YAAY;GACZ,WAAW;GACX,kBAAkB;GAClB,OAAO;GACP,mBAAmB,EACjB,OAAO,kBACR;GACD,WAAW;IACT,OAAO;IACP,YAAY;IACb;GACD,UAAU,EACR,aAAa,gBACd;GACD,WAAW,EACT,YAAY,uBACb;GACF;EACD,gBAAgB;GACd,SAAS;GACT,YAAY;GACZ,KAAK;GACL,UAAU;GACV,UAAU;GACV,KAAK;GACL,QAAQ;GACR,eAAe;GACf,eAAe;GAChB;EACD,WAAW;GACT,SAAS;GACT,YAAY;GACZ,gBAAgB;GAChB,OAAO;GACP,WAAW,EACT,OAAO,iBACR;GACD,WAAW,EACT,OAAO,oBACR;GACF;EACD,GAAG;EACH,SAAS;GACP,GAAG,KAAK;GACR,UAAU;GACV,SAAS;GACT,eAAe;GAChB;EACD,MAAM;GACJ,GAAG,KAAK;GACR,SAAS,EACP,YAAY,qBACb;GACD,WAAW;IACT,YAAY;IACZ,cAAc,EACZ,YAAY,6BACb;IACF;GACD,WAAW;IACT,QAAQ;IACR,OAAO;IACP,cAAc,EACZ,YAAY,eACb;IACF;GACF;EACD,SAAS;GACP,UAAU;GACV,OAAO;GACR;EACD,UAAU;GACR,MAAM;GACN,WAAW;GACX,WAAW;GACX,cAAc;GACf;EACD,aAAa;GACX,SAAS;GACT,eAAe;GACf,YAAY;GACZ,MAAM;GACN,UAAU;GACX;EACD,aAAa,EACX,YAAY,GACb;EACD,kBAAkB;GAChB,OAAO;GACP,MAAM;GACN,UAAU;GACV,UAAU;GACV,cAAc;GACd,YAAY;GACb;EACD,YAAY;GACV,SAAS;G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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 'createItemContainer',\n 'createItem',\n 'checkbox',\n 'checkmark',\n 'itemList',\n 'itemContent',\n 'itemLabel',\n 'itemHelperText',\n 'itemLoading',\n 'itemLoadingLabel',\n 'emptyState',\n ],\n base: {\n trigger: {\n display: 'flex',\n alignItems: 'center',\n borderWidth: rem(1),\n borderColor: 'border/strong',\n background: 'bg.muted',\n color: 'input/text/inputValue',\n gap: '8',\n justifyContent: 'space-between',\n paddingInline: '16',\n paddingBlock: rem(11),\n borderRadius: '4',\n userSelect: 'none',\n textAlign: 'start',\n focusVisibleRing: 'inside',\n width: '100%',\n _placeholderShown: {\n color: 'text/secondary',\n },\n _disabled: {\n color: 'text/disabled',\n background: 'background/disabled',\n },\n _invalid: {\n borderColor: 'border/error',\n },\n _readOnly: {\n background: 'background/disabled',\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 paddingInline: '16',\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 },\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 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 alignItems: 'flex-start',\n flex: '1 0 0',\n minWidth: 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 itemLabel: {\n color: 'text/body',\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n maxWidth: '100%',\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 '[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: rem(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 createItemContainer: {\n borderTop: '1px solid',\n borderColor: 'border/minimal',\n paddingBlock: '8',\n flexShrink: 0,\n },\n createItem: {\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 _focusVisible: {\n outlineOffset: '-3px',\n },\n },\n },\n\n variants: {\n size: {\n lg: {\n ...variants.size.lg,\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 createItem: {\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 createItem: {\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 },\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":";;;;;AAMA,IAAa,mBAAmB,iBAAiB;CAC/C,WAAW;CACX,OAAO;EACL,GAAG,cAAc,MAAM;EACvB;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,MAAM;EACJ,SAAS;GACP,SAAS;GACT,YAAY;GACZ,aAAa,IAAI,EAAE;GACnB,aAAa;GACb,YAAY;GACZ,OAAO;GACP,KAAK;GACL,gBAAgB;GAChB,eAAe;GACf,cAAc,IAAI,GAAG;GACrB,cAAc;GACd,YAAY;GACZ,WAAW;GACX,kBAAkB;GAClB,OAAO;GACP,mBAAmB,EACjB,OAAO,kBACR;GACD,WAAW;IACT,OAAO;IACP,YAAY;IACb;GACD,UAAU,EACR,aAAa,gBACd;GACD,WAAW,EACT,YAAY,uBACb;GACF;EACD,gBAAgB;GACd,SAAS;GACT,YAAY;GACZ,KAAK;GACL,UAAU;GACV,UAAU;GACV,KAAK;GACL,QAAQ;GACR,eAAe;GACf,eAAe;GAChB;EACD,WAAW;GACT,SAAS;GACT,YAAY;GACZ,gBAAgB;GAChB,OAAO;GACP,WAAW,EACT,OAAO,iBACR;GACD,WAAW,EACT,OAAO,oBACR;GACF;EACD,GAAG;EACH,SAAS;GACP,GAAG,KAAK;GACR,UAAU;GACV,SAAS;GACT,eAAe;GAChB;EACD,MAAM;GACJ,GAAG,KAAK;GACR,SAAS,EACP,YAAY,qBACb;GACD,WAAW;IACT,YAAY;IACZ,cAAc,EACZ,YAAY,6BACb;IACF;GACD,WAAW;IACT,QAAQ;IACR,OAAO;IACP,cAAc,EACZ,YAAY,eACb;IACF;GACF;EACD,SAAS;GACP,UAAU;GACV,OAAO;GACR;EACD,UAAU;GACR,MAAM;GACN,WAAW;GACX,WAAW;GACX,cAAc;GACf;EACD,aAAa;GACX,SAAS;GACT,eAAe;GACf,YAAY;GACZ,MAAM;GACN,UAAU;GACX;EACD,aAAa,EACX,YAAY,GACb;EACD,kBAAkB;GAChB,OAAO;GACP,MAAM;GACN,UAAU;GACV,UAAU;GACV,cAAc;GACd,YAAY;GACb;EACD,YAAY;GACV,SAAS;G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"}

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

	@@ -1 +1 @@
1	- {"version":3,"file":"StepCard.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/StepCard.recipe.ts"],"sourcesContent":["import { cardAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nconst stepsCardAnatomy = cardAnatomy.extendWith('titleGroup');\n\nconst stepCardSlotRecipe = defineSlotRecipe({\n className: 'steps-card',\n slots: stepsCardAnatomy.keys(),\n base: {\n root: {\n backgroundColor: 'background/primary',\n border: '1px solid',\n borderColor: 'border/minimal',\n borderRadius: '8',\n boxShadow: 'elevation/md',\n overflow: 'hidden',\n },\n header: {\n paddingBlockStart: '32',\n paddingInline: '32',\n },\n body: {\n display: 'flex',\n flexDirection: 'column',\n gap: '24',\n paddingBlockEnd: '48',\n paddingBlockStart: '32',\n paddingInline: '32',\n },\n titleGroup: {\n display: 'flex',\n flexDirection: 'column',\n gap: '4',\n },\n title: {\n color: 'text/primary',\n textStyle: 'heading/h3',\n },\n description: {\n color: 'text/secondary',\n textStyle: 'body/md/regular',\n },\n footer: {\n alignItems: 'center',\n borderBlockStart: '1px solid',\n borderColor: 'border/minimal',\n display: 'flex',\n gap: '16',\n justifyContent: 'flex-end',\n padding: '32',\n },\n },\n});\n\nexport default stepCardSlotRecipe;\n"],"mappings":";;;AAKA,IAAM,qBAAqB,iBAAiB;CAC1C,WAAW;CACX,OAJuB,YAAY,WAAW,~~aAAa~~,~~CAInC~~,MAAM;CAC9B,MAAM;EACJ,MAAM;GACJ,iBAAiB;GACjB,QAAQ;GACR,aAAa;GACb,cAAc;GACd,WAAW;GACX,UAAU;GACX;EACD,QAAQ;GACN,mBAAmB;GACnB,eAAe;GAChB;EACD,MAAM;GACJ,SAAS;GACT,eAAe;GACf,KAAK;GACL,iBAAiB;GACjB,mBAAmB;GACnB,eAAe;GAChB;EACD,YAAY;GACV,SAAS;GACT,eAAe;GACf,KAAK;GACN;EACD,OAAO;GACL,OAAO;GACP,WAAW;GACZ;EACD,aAAa;GACX,OAAO;GACP,WAAW;GACZ;EACD,QAAQ;GACN,YAAY;GACZ,kBAAkB;GAClB,aAAa;GACb,SAAS;GACT,KAAK;GACL,gBAAgB;GAChB,SAAS;GACV;EACF;CACF,CAAC"}
1	+ {"version":3,"file":"StepCard.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/StepCard.recipe.ts"],"sourcesContent":["import { cardAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nconst stepsCardAnatomy = cardAnatomy.extendWith('titleGroup');\n\nconst stepCardSlotRecipe = defineSlotRecipe({\n className: 'steps-card',\n slots: stepsCardAnatomy.keys(),\n base: {\n root: {\n backgroundColor: 'background/primary',\n border: '1px solid',\n borderColor: 'border/minimal',\n borderRadius: '8',\n boxShadow: 'elevation/md',\n overflow: 'hidden',\n },\n header: {\n paddingBlockStart: '32',\n paddingInline: '32',\n },\n body: {\n display: 'flex',\n flexDirection: 'column',\n gap: '24',\n paddingBlockEnd: '48',\n paddingBlockStart: '32',\n paddingInline: '32',\n },\n titleGroup: {\n display: 'flex',\n flexDirection: 'column',\n gap: '4',\n },\n title: {\n color: 'text/primary',\n textStyle: 'heading/h3',\n },\n description: {\n color: 'text/secondary',\n textStyle: 'body/md/regular',\n },\n footer: {\n alignItems: 'center',\n borderBlockStart: '1px solid',\n borderColor: 'border/minimal',\n display: 'flex',\n gap: '16',\n justifyContent: 'flex-end',\n padding: '32',\n },\n },\n});\n\nexport default stepCardSlotRecipe;\n"],"mappings":";;;AAKA,IAAM,qBAAqB,iBAAiB;CAC1C,WAAW;CACX,OAJuB,YAAY,WAAW,aAIvC,CAAiB,MAAM;CAC9B,MAAM;EACJ,MAAM;GACJ,iBAAiB;GACjB,QAAQ;GACR,aAAa;GACb,cAAc;GACd,WAAW;GACX,UAAU;GACX;EACD,QAAQ;GACN,mBAAmB;GACnB,eAAe;GAChB;EACD,MAAM;GACJ,SAAS;GACT,eAAe;GACf,KAAK;GACL,iBAAiB;GACjB,mBAAmB;GACnB,eAAe;GAChB;EACD,YAAY;GACV,SAAS;GACT,eAAe;GACf,KAAK;GACN;EACD,OAAO;GACL,OAAO;GACP,WAAW;GACZ;EACD,aAAa;GACX,OAAO;GACP,WAAW;GACZ;EACD,QAAQ;GACN,YAAY;GACZ,kBAAkB;GAClB,aAAa;GACb,SAAS;GACT,KAAK;GACL,gBAAgB;GAChB,SAAS;GACV;EACF;CACF,CAAC"}

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

@@ -1,6 +1,6 @@
 declare const switchSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"label" | "root" | "indicator" | "control" | "thumb", {
     size: {
-        sm: {
+        md: {
             root: {
                 '--switch-width': string;
                 '--switch-height': string;
@@ -10,10 +10,10 @@ declare const switchSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<
                 borderRadius: "8";
             };
             label: {
-                textStyle: "body/sm/regular";
+                textStyle: "body/md/regular";
             };
         };
-        md: {
+        lg: {
             root: {
                 '--switch-width': string;
                 '--switch-height': string;

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

@@ -33,15 +33,15 @@ var switchSlotRecipe = defineSlotRecipe({
 			display: "inline-flex",
 			width: "var(--switch-width)",
 			height: "var(--switch-height)",
-			bg: "input/toggle/frameOff",
+			bg: "input/switch/off/track",
 			cursor: "pointer",
 			transition: "backgrounds",
 			_checked: {
-				bg: "input/toggle/frameOn",
-				_disabled: { bg: "input/toggle/frameOn-disabled" }
+				bg: "input/switch/on/track",
+				_disabled: { bg: "input/switch/on/track-disabled" }
 			},
 			_disabled: {
-				bg: "input/toggle/frameOff-disabled",
+				bg: "input/switch/off/track-disabled",
 				cursor: "not-allowed"
 			},
 			_readOnly: { cursor: "default" },
@@ -50,33 +50,33 @@ var switchSlotRecipe = defineSlotRecipe({
 		thumb: {
 			width: "var(--switch-height)",
 			height: "var(--switch-height)",
-			bg: "input/toggle/slideOff",
+			bg: "input/switch/off/thumb",
 			boxShadow: "elevation/sm",
 			scale: "0.8",
 			borderRadius: "inherit",
 			transitionProperty: "translate",
 			transitionDuration: "fast",
 			_checked: {
-				bg: "input/toggle/slideOn",
+				bg: "input/switch/on/thumb",
 				translate: "var(--switch-x) 0"
 			},
 			_disabled: {
-				bg: "input/toggle/slideOff-disabled",
-				_checked: { bg: "input/toggle/slideOn-disabled" }
+				bg: "input/switch/off/thumb-disabled",
+				_checked: { bg: "input/switch/on/thumb-disabled" }
 			}
 		}
 	},
 	variants: { size: {
-		sm: {
+		md: {
 			root: {
 				"--switch-width": rem(32),
 				"--switch-height": rem(16),
 				"--switch-indicator-font-size": rem(12)
 			},
 			control: { borderRadius: "8" },
-			label: { textStyle: "body/sm/regular" }
+			label: { textStyle: "body/md/regular" }
 		},
-		md: {
+		lg: {
 			root: {
 				"--switch-width": rem(48),
 				"--switch-height": rem(24),
@@ -86,7 +86,7 @@ var switchSlotRecipe = defineSlotRecipe({
 			label: { textStyle: "body/lg/regular" }
 		}
 	} },
-	defaultVariants: { size: "md" }
+	defaultVariants: { size: "lg" }
 });
 //#endregion
 export { switchSlotRecipe as default };

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Switch.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Switch.recipe.ts"],"sourcesContent":["import { switchAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nconst switchSlotRecipe = defineSlotRecipe({\n slots: switchAnatomy.keys(),\n className: 'switch',\n base: {\n root: {\n display: 'inline-flex',\n alignItems: 'center',\n gap: '8',\n '--switch-diff': 'calc(var(--switch-width) - var(--switch-height))',\n '--switch-x': {\n base: 'var(--switch-diff)',\n _rtl: 'calc(var(--switch-diff) * -1)',\n },\n },\n\n label: {\n _disabled: {\n color: 'text/disabled',\n },\n },\n\n indicator: {\n color: 'icon/on-color',\n position: 'absolute',\n width: 'var(--switch-height)',\n height: 'var(--switch-height)',\n display: 'grid',\n placeContent: 'center',\n userSelect: 'none',\n insetInlineStart: 'calc(var(--switch-x) - 2px)',\n _checked: {\n insetInlineStart: '2',\n },\n },\n\n control: {\n position: 'relative',\n display: 'inline-flex',\n width: 'var(--switch-width)',\n height: 'var(--switch-height)',\n bg: 'input/~~toggle~~/~~frameOff~~',\n cursor: 'pointer',\n transition: 'backgrounds',\n _checked: {\n bg: 'input/~~toggle~~/~~frameOn~~',\n _disabled: {\n bg: 'input/~~toggle~~/~~frameOn~~-disabled',\n },\n },\n _disabled: {\n bg: 'input/~~toggle~~/~~frameOff~~-disabled',\n cursor: 'not-allowed',\n },\n _readOnly: {\n cursor: 'default',\n },\n focusVisibleRing: 'outside',\n },\n\n thumb: {\n width: 'var(--switch-height)',\n height: 'var(--switch-height)',\n bg: 'input/~~toggle~~/~~slideOff~~',\n boxShadow: 'elevation/sm',\n scale: '0.8',\n borderRadius: 'inherit',\n transitionProperty: 'translate',\n transitionDuration: 'fast',\n _checked: {\n bg: 'input/~~toggle~~/~~slideOn~~',\n translate: 'var(--switch-x) 0',\n },\n _disabled: {\n bg: 'input/~~toggle~~/~~slideOff~~-disabled',\n _checked: {\n bg: 'input/~~toggle~~/~~slideOn~~-disabled',\n },\n },\n },\n },\n\n variants: {\n size: {\n sm: {\n root: {\n '--switch-width': rem(32),\n '--switch-height': rem(16),\n '--switch-indicator-font-size': rem(12),\n },\n control: {\n borderRadius: '8',\n },\n label: {\n textStyle: 'body/sm/regular',\n },\n },\n md: {\n root: {\n '--switch-width': rem(48),\n '--switch-height': rem(24),\n '--switch-indicator-font-size': rem(16),\n },\n control: {\n borderRadius: '12',\n },\n label: {\n textStyle: 'body/lg/regular',\n },\n },\n },\n },\n\n defaultVariants: {\n size: 'md',\n },\n});\n\nexport default switchSlotRecipe;\n"],"mappings":";;;;AAKA,IAAM,mBAAmB,iBAAiB;CACxC,OAAO,cAAc,MAAM;CAC3B,WAAW;CACX,MAAM;EACJ,MAAM;GACJ,SAAS;GACT,YAAY;GACZ,KAAK;GACL,iBAAiB;GACjB,cAAc;IACZ,MAAM;IACN,MAAM;IACP;GACF;EAED,OAAO,EACL,WAAW,EACT,OAAO,iBACR,EACF;EAED,WAAW;GACT,OAAO;GACP,UAAU;GACV,OAAO;GACP,QAAQ;GACR,SAAS;GACT,cAAc;GACd,YAAY;GACZ,kBAAkB;GAClB,UAAU,EACR,kBAAkB,KACnB;GACF;EAED,SAAS;GACP,UAAU;GACV,SAAS;GACT,OAAO;GACP,QAAQ;GACR,IAAI;GACJ,QAAQ;GACR,YAAY;GACZ,UAAU;IACR,IAAI;IACJ,WAAW,EACT,IAAI,~~iCACL~~;IACF;GACD,WAAW;IACT,IAAI;IACJ,QAAQ;IACT;GACD,WAAW,EACT,QAAQ,WACT;GACD,kBAAkB;GACnB;EAED,OAAO;GACL,OAAO;GACP,QAAQ;GACR,IAAI;GACJ,WAAW;GACX,OAAO;GACP,cAAc;GACd,oBAAoB;GACpB,oBAAoB;GACpB,UAAU;IACR,IAAI;IACJ,WAAW;IACZ;GACD,WAAW;IACT,IAAI;IACJ,UAAU,EACR,IAAI,~~iCACL~~;IACF;GACF;EACF;CAED,UAAU,EACR,MAAM;EACJ,IAAI;GACF,MAAM;IACJ,kBAAkB,IAAI,GAAG;IACzB,mBAAmB,IAAI,GAAG;IAC1B,gCAAgC,IAAI,GAAG;IACxC;GACD,SAAS,EACP,cAAc,KACf;GACD,OAAO,EACL,WAAW,mBACZ;GACF;EACD,IAAI;GACF,MAAM;IACJ,kBAAkB,IAAI,GAAG;IACzB,mBAAmB,IAAI,GAAG;IAC1B,gCAAgC,IAAI,GAAG;IACxC;GACD,SAAS,EACP,cAAc,MACf;GACD,OAAO,EACL,WAAW,mBACZ;GACF;EACF,EACF;CAED,iBAAiB,EACf,MAAM,MACP;CACF,CAAC"}
1	+ {"version":3,"file":"Switch.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Switch.recipe.ts"],"sourcesContent":["import { switchAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nconst switchSlotRecipe = defineSlotRecipe({\n slots: switchAnatomy.keys(),\n className: 'switch',\n base: {\n root: {\n display: 'inline-flex',\n alignItems: 'center',\n gap: '8',\n '--switch-diff': 'calc(var(--switch-width) - var(--switch-height))',\n '--switch-x': {\n base: 'var(--switch-diff)',\n _rtl: 'calc(var(--switch-diff) * -1)',\n },\n },\n\n label: {\n _disabled: {\n color: 'text/disabled',\n },\n },\n\n indicator: {\n color: 'icon/on-color',\n position: 'absolute',\n width: 'var(--switch-height)',\n height: 'var(--switch-height)',\n display: 'grid',\n placeContent: 'center',\n userSelect: 'none',\n insetInlineStart: 'calc(var(--switch-x) - 2px)',\n _checked: {\n insetInlineStart: '2',\n },\n },\n\n control: {\n position: 'relative',\n display: 'inline-flex',\n width: 'var(--switch-width)',\n height: 'var(--switch-height)',\n bg: 'input/switch/off/track',\n cursor: 'pointer',\n transition: 'backgrounds',\n _checked: {\n bg: 'input/switch/on/track',\n _disabled: {\n bg: 'input/switch/on/track-disabled',\n },\n },\n _disabled: {\n bg: 'input/switch/off/track-disabled',\n cursor: 'not-allowed',\n },\n _readOnly: {\n cursor: 'default',\n },\n focusVisibleRing: 'outside',\n },\n\n thumb: {\n width: 'var(--switch-height)',\n height: 'var(--switch-height)',\n bg: 'input/switch/off/thumb',\n boxShadow: 'elevation/sm',\n scale: '0.8',\n borderRadius: 'inherit',\n transitionProperty: 'translate',\n transitionDuration: 'fast',\n _checked: {\n bg: 'input/switch/on/thumb',\n translate: 'var(--switch-x) 0',\n },\n _disabled: {\n bg: 'input/switch/off/thumb-disabled',\n _checked: {\n bg: 'input/switch/on/thumb-disabled',\n },\n },\n },\n },\n\n variants: {\n size: {\n md: {\n root: {\n '--switch-width': rem(32),\n '--switch-height': rem(16),\n '--switch-indicator-font-size': rem(12),\n },\n control: {\n borderRadius: '8',\n },\n label: {\n textStyle: 'body/md/regular',\n },\n },\n lg: {\n root: {\n '--switch-width': rem(48),\n '--switch-height': rem(24),\n '--switch-indicator-font-size': rem(16),\n },\n control: {\n borderRadius: '12',\n },\n label: {\n textStyle: 'body/lg/regular',\n },\n },\n },\n },\n\n defaultVariants: {\n size: 'lg',\n },\n});\n\nexport default switchSlotRecipe;\n"],"mappings":";;;;AAKA,IAAM,mBAAmB,iBAAiB;CACxC,OAAO,cAAc,MAAM;CAC3B,WAAW;CACX,MAAM;EACJ,MAAM;GACJ,SAAS;GACT,YAAY;GACZ,KAAK;GACL,iBAAiB;GACjB,cAAc;IACZ,MAAM;IACN,MAAM;IACP;GACF;EAED,OAAO,EACL,WAAW,EACT,OAAO,iBACR,EACF;EAED,WAAW;GACT,OAAO;GACP,UAAU;GACV,OAAO;GACP,QAAQ;GACR,SAAS;GACT,cAAc;GACd,YAAY;GACZ,kBAAkB;GAClB,UAAU,EACR,kBAAkB,KACnB;GACF;EAED,SAAS;GACP,UAAU;GACV,SAAS;GACT,OAAO;GACP,QAAQ;GACR,IAAI;GACJ,QAAQ;GACR,YAAY;GACZ,UAAU;IACR,IAAI;IACJ,WAAW,EACT,IAAI,kCACL;IACF;GACD,WAAW;IACT,IAAI;IACJ,QAAQ;IACT;GACD,WAAW,EACT,QAAQ,WACT;GACD,kBAAkB;GACnB;EAED,OAAO;GACL,OAAO;GACP,QAAQ;GACR,IAAI;GACJ,WAAW;GACX,OAAO;GACP,cAAc;GACd,oBAAoB;GACpB,oBAAoB;GACpB,UAAU;IACR,IAAI;IACJ,WAAW;IACZ;GACD,WAAW;IACT,IAAI;IACJ,UAAU,EACR,IAAI,kCACL;IACF;GACF;EACF;CAED,UAAU,EACR,MAAM;EACJ,IAAI;GACF,MAAM;IACJ,kBAAkB,IAAI,GAAG;IACzB,mBAAmB,IAAI,GAAG;IAC1B,gCAAgC,IAAI,GAAG;IACxC;GACD,SAAS,EACP,cAAc,KACf;GACD,OAAO,EACL,WAAW,mBACZ;GACF;EACD,IAAI;GACF,MAAM;IACJ,kBAAkB,IAAI,GAAG;IACzB,mBAAmB,IAAI,GAAG;IAC1B,gCAAgC,IAAI,GAAG;IACxC;GACD,SAAS,EACP,cAAc,MACf;GACD,OAAO,EACL,WAAW,mBACZ;GACF;EACF,EACF;CAED,iBAAiB,EACf,MAAM,MACP;CACF,CAAC"}

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

@@ -2,7 +2,8 @@ declare const tagsInputSlotRecipe: import('@chakra-ui/react').SlotRecipeDefiniti
     size: {
         md: {
             control: {
-                paddingInline: "8";
+                paddingInlineEnd: "12";
+                paddingInlineStart: "8";
             };
             tagsBlock: {
                 paddingBlock: "8";
@@ -12,13 +13,15 @@ declare const tagsInputSlotRecipe: import('@chakra-ui/react').SlotRecipeDefiniti
             };
             input: {
                 height: "24";
-                textStyle: "body/md/regular";
+                fontSize: "0.875rem";
+                fontWeight: "400";
+                lineHeight: "normal";
             };
         };
         lg: {
             control: {
+                paddingInlineEnd: "16";
                 paddingInlineStart: "12";
-                paddingInlineEnd: "8";
             };
             tagsBlock: {
                 paddingBlock: "12";
@@ -27,7 +30,9 @@ declare const tagsInputSlotRecipe: import('@chakra-ui/react').SlotRecipeDefiniti
                 height: "48";
             };
             input: {
-                textStyle: "body/lg/regular";
+                fontSize: "1rem";
+                fontWeight: "400";
+                lineHeight: "normal";
             };
         };
     };

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

@@ -8,6 +8,7 @@ var tagsInputSlotRecipe = defineSlotRecipe({
 	base: {
 		root: { width: "full" },
 		control: {
+			alignItems: "flex-start",
 			background: "background/primary",
 			borderColor: "border/regular",
 			borderRadius: "4",
@@ -38,6 +39,7 @@ var tagsInputSlotRecipe = defineSlotRecipe({
 		},
 		tagsBlock: {
 			alignContent: "flex-start",
+			alignItems: "center",
 			display: "flex",
 			flex: "1",
 			flexWrap: "wrap",
@@ -59,8 +61,10 @@ var tagsInputSlotRecipe = defineSlotRecipe({
 			background: "transparent",
 			color: "input/text/inputValue",
 			flex: "1",
+			lineHeight: "normal",
 			minWidth: rem(80),
 			outline: "none",
+			paddingInlineStart: "4",
 			_placeholder: { color: "input/text/placeholder" },
 			_disabled: {
 				cursor: "not-allowed",
@@ -142,22 +146,31 @@ var tagsInputSlotRecipe = defineSlotRecipe({
 	},
 	variants: { size: {
 		md: {
-			control: { paddingInline: "8" },
+			control: {
+				paddingInlineEnd: "12",
+				paddingInlineStart: "8"
+			},
 			tagsBlock: { paddingBlock: "8" },
 			suffixBlock: { height: "40" },
 			input: {
 				height: "24",
-				textStyle: "body/md/regular"
+				fontSize: "0.875rem",
+				fontWeight: "400",
+				lineHeight: "normal"
 			}
 		},
 		lg: {
 			control: {
-				paddingInlineStart: "12",
-				paddingInlineEnd: "8"
+				paddingInlineEnd: "16",
+				paddingInlineStart: "12"
 			},
 			tagsBlock: { paddingBlock: "12" },
 			suffixBlock: { height: "48" },
-			input: { textStyle: "body/lg/regular" }
+			input: {
+				fontSize: "1rem",
+				fontWeight: "400",
+				lineHeight: "normal"
+			}
 		}
 	} },
 	defaultVariants: { size: "lg" }

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 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 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 minWidth: rem(80),\n outline: 'none',\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 md: {\n control: {\n ~~paddingInline~~: '8',\n },\n tagsBlock: {\n paddingBlock: '8',\n },\n suffixBlock: {\n height: '40',\n },\n input: {\n height: '24',\n ~~textStyle~~: '~~body/md/regular~~',\n },\n },\n lg: {\n control: {\n ~~paddingInlineStart~~: '12',\n ~~paddingInlineEnd~~: '8',\n },\n tagsBlock: {\n paddingBlock: '12',\n },\n suffixBlock: {\n height: '48',\n },\n input: {\n ~~textStyle~~: '~~body/lg/regular~~',\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,~~cAAc~~,~~CAItD~~,MAAM;CACtC,MAAM;EACJ,MAAM,EACJ,OAAO,QACR;EACD,SAAS;GACP,YAAY;GACZ,aAAa;GACb,cAAc;GACd,aAAa;GACb,aAAa,IAAI,EAAE;GACnB,WAAW;GACX,SAAS;GACT,QAAQ,IAAI,GAAG;GACf,WAAW;GACX,YAAY;GACZ,cAAc,EACZ,WAAW,WACZ;GACD,QAAQ,EACN,aAAa,gBACd;GACD,UAAU;IACR,aAAa;IACb,QAAQ,EACN,aAAa,gBACd;IACF;GACD,WAAW;IACT,YAAY;IACZ,aAAa;IACb,QAAQ;IACR,QAAQ,EACN,aAAa,mBACd;IACF;GACD,WAAW;IACT,YAAY;IACZ,aAAa;IACb,QAAQ,EACN,aAAa,mBACd;IACF;GACF;EACD,WAAW;GACT,cAAc;GACd,SAAS;GACT,MAAM;GACN,UAAU;GACV,KAAK;GACL,UAAU;GACX;EACD,aAAa;GACX,YAAY;GACZ,WAAW;GACX,SAAS;GACT,YAAY;GACZ,KAAK;GACL,eAAe;GACf,UAAU;GACV,KAAK;GACL,iBAAiB,EACf,eAAe,GAChB;GACF;EACD,OAAO;GACL,YAAY;GACZ,OAAO;GACP,MAAM;GACN,UAAU,IAAI,GAAG;GACjB,SAAS;~~GACT~~,cAAc,EACZ,OAAO,0BACR;GACD,WAAW;IACT,QAAQ;IACR,cAAc,EACZ,OAAO,iBACR;IACF;GACD,WAAW,EACT,SAAS,QACV;GACF;EACD,MAAM;GACJ,SAAS;GACT,UAAU;GACV,UAAU;GACX;EACD,aAAa;GACX,YAAY;GACZ,YAAY;GACZ,aAAa;GACb,cAAc;GACd,aAAa;GACb,aAAa,IAAI,EAAE;GACnB,OAAO;GACP,SAAS;GACT,KAAK;GACL,QAAQ;GACR,UAAU;GACV,UAAU;GACV,cAAc;GACd,kBAAkB;GAClB,oBAAoB;GACpB,WAAW;GACX,cAAc,EACZ,YAAY,wBACb;GACD,WAAW;IACT,YAAY;IACZ,aAAa;IACb,OAAO;IACR;GACD,uBAAuB,EACrB,kBAAkB,KACnB;GACF;EACD,UAAU;GACR,UAAU;GACV,cAAc;GACd,YAAY;GACb;EACD,WAAW;GACT,YAAY;GACZ,QAAQ;GACR,UAAU;GACV,SAAS;GACV;EACD,mBAAmB;GACjB,YAAY;GACZ,cAAc;GACd,OAAO;GACP,QAAQ;GACR,SAAS;GACT,YAAY;GACZ,QAAQ;GACR,gBAAgB;GAChB,OAAO;GACP,QAAQ,EACN,YAAY,wBACb;GACD,WAAW;IACT,QAAQ;IACR,SAAS;IACV;GACF;EACD,cAAc;GACZ,YAAY;GACZ,cAAc;GACd,OAAO;GACP,QAAQ;GACR,SAAS;GACT,gBAAgB;GAChB,SAAS;GACT,QAAQ,EACN,YAAY,wBACb;GACD,WAAW;IACT,QAAQ;IACR,SAAS;IACV;GACF;EACF;CACD,UAAU,EACR,MAAM;~~EACJ~~,IAAI;GACF,SAAS,~~EACP~~,~~eAAe,KAChB~~;~~GACD~~,WAAW,EACT,cAAc,KACf;GACD,aAAa,EACX,QAAQ,MACT;GACD,OAAO;IACL,QAAQ;IACR,~~WAAW~~;IACZ;GACF;EACD,IAAI;GACF,SAAS;IACP,~~oBAAoB~~;~~IACpB~~,~~kBAAkB~~;~~IACnB~~;GACD,WAAW,EACT,cAAc,MACf;GACD,aAAa,EACX,QAAQ,MACT;GACD,OAAO,~~EACL~~,~~WAAW~~,~~mBACZ~~;GACF;EACF,EACF;CACD,iBAAiB,EACf,MAAM,MACP;CACF,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: '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":"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"}

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

@@ -102,6 +102,7 @@ declare const treeViewSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinitio
                     background: "border/minimal";
                 };
                 '& > svg': {
+                    color: "icon/secondary";
                     marginBlockStart: string;
                 };
                 _selected: {