@bitrise/bitkit-v2 0.3.317 → 0.3.319

package/dist/components/BitkitPaginationLoadMore/BitkitPaginationLoadMore.d.ts

@@ -1,5 +1,6 @@
 import { BoxProps } from '@chakra-ui/react/box';
 export interface BitkitPaginationLoadMoreProps extends Omit<BoxProps, 'page' | 'size'> {
+    loadError?: boolean;
     loadingMore?: boolean;
     onLoadMore: () => void;
     page: number;

package/dist/components/BitkitPaginationLoadMore/BitkitPaginationLoadMore.js

@@ -1,3 +1,4 @@
+import IconErrorCircleFilled from "../../icons/IconErrorCircleFilled.js";
 import BitkitButton from "../BitkitButton/BitkitButton.js";
 import BitkitInlineLoading from "../BitkitInlineLoading/BitkitInlineLoading.js";
 import BitkitLinkButton from "../BitkitLinkButton/BitkitLinkButton.js";
@@ -5,16 +6,17 @@ import { Box } from "@chakra-ui/react/box";
 import { chakra, useSlotRecipe } from "@chakra-ui/react/styled-system";
 import { forwardRef } from "react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import { Text } from "@chakra-ui/react/text";
 //#region lib/components/BitkitPaginationLoadMore/BitkitPaginationLoadMore.tsx
 var BitkitPaginationLoadMore = forwardRef((props, ref) => {
-	const { loadingMore = false, onLoadMore, page, pageItemsCount, size = "md", totalCount, ...rest } = props;
+	const { loadError = false, loadingMore = false, onLoadMore, page, pageItemsCount, size = "md", totalCount, ...rest } = props;
 	const styles = useSlotRecipe({ key: "paginationLoadMore" })({ size });
 	const clampedPage = Math.max(1, page);
 	const clampedPageItemsCount = Math.max(1, pageItemsCount);
 	const shownCount = Math.min(clampedPage * clampedPageItemsCount, totalCount);
 	const isComplete = shownCount >= totalCount;
 	const loadMoreCount = Math.min(clampedPageItemsCount, totalCount - shownCount);
-	const inlineLoadingSize = size === "md" ? "md" : "sm";
+	const inlineLoadingSize = size === "xs" ? "sm" : "md";
 	return /* @__PURE__ */ jsxs(Box, {
 		css: styles.root,
 		ref,
@@ -27,7 +29,7 @@ var BitkitPaginationLoadMore = forwardRef((props, ref) => {
 				" of ",
 				totalCount
 			]
-		}), !isComplete && /* @__PURE__ */ jsx(Fragment$1, { children: loadingMore ? /* @__PURE__ */ jsx(BitkitInlineLoading, {
+		}), !isComplete && /* @__PURE__ */ jsxs(Fragment$1, { children: [loadingMore ? /* @__PURE__ */ jsx(BitkitInlineLoading, {
 			color: "text/tertiary",
 			label: "Loading more...",
 			size: inlineLoadingSize
@@ -40,7 +42,17 @@ var BitkitPaginationLoadMore = forwardRef((props, ref) => {
 			size: size === "md" ? "md" : "sm",
 			variant: "tertiary",
 			children: `Load ${loadMoreCount} more`
-		}) })]
+		}), loadError && !loadingMore && /* @__PURE__ */ jsxs(Box, {
+			css: styles.error,
+			role: "alert",
+			children: [/* @__PURE__ */ jsx(IconErrorCircleFilled, {
+				color: "icon/negative",
+				size: "16"
+			}), /* @__PURE__ */ jsx(Text, {
+				as: "span",
+				children: "Failed to load items."
+			})]
+		})] })]
 	});
 });
 BitkitPaginationLoadMore.displayName = "BitkitPaginationLoadMore";

package/dist/components/BitkitPaginationLoadMore/BitkitPaginationLoadMore.js.map

@@ -1 +1 @@
-{"version":3,"file":"BitkitPaginationLoadMore.js","names":[],"sources":["../../../lib/components/BitkitPaginationLoadMore/BitkitPaginationLoadMore.tsx"],"sourcesContent":["import { Box, type BoxProps } from '@chakra-ui/react/box';\nimport { chakra, useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { forwardRef } from 'react';\n\nimport BitkitButton from '../BitkitButton/BitkitButton';\nimport BitkitInlineLoading from '../BitkitInlineLoading/BitkitInlineLoading';\nimport BitkitLinkButton from '../BitkitLinkButton/BitkitLinkButton';\n\nexport interface BitkitPaginationLoadMoreProps extends Omit<BoxProps, 'page' | 'size'> {\n  loadingMore?: boolean;\n  onLoadMore: () => void;\n  page: number;\n  pageItemsCount: number;\n  size?: 'md' | 'sm' | 'xs';\n  totalCount: number;\n}\n\nconst BitkitPaginationLoadMore = forwardRef<HTMLDivElement, BitkitPaginationLoadMoreProps>((props, ref) => {\n  const { loadingMore = false, onLoadMore, page, pageItemsCount, size = 'md', totalCount, ...rest } = props;\n\n  const recipe = useSlotRecipe({ key: 'paginationLoadMore' });\n  const styles = recipe({ size });\n\n  const clampedPage = Math.max(1, page);\n  const clampedPageItemsCount = Math.max(1, pageItemsCount);\n  const shownCount = Math.min(clampedPage * clampedPageItemsCount, totalCount);\n  const isComplete = shownCount >= totalCount;\n  const loadMoreCount = Math.min(clampedPageItemsCount, totalCount - shownCount);\n\n  const inlineLoadingSize = size === 'md' ? 'md' : 'sm';\n\n  return (\n    <Box css={styles.root} ref={ref} {...rest}>\n      <chakra.span css={styles.counter}>\n        Showing {shownCount} of {totalCount}\n      </chakra.span>\n      {!isComplete && (\n        <>\n          {loadingMore ? (\n            <BitkitInlineLoading color=\"text/tertiary\" label=\"Loading more...\" size={inlineLoadingSize} />\n          ) : size === 'xs' ? (\n            <BitkitLinkButton onClick={onLoadMore} size=\"sm\">\n              {`Load ${loadMoreCount} more`}\n            </BitkitLinkButton>\n          ) : (\n            <BitkitButton onClick={onLoadMore} size={size === 'md' ? 'md' : 'sm'} variant=\"tertiary\">\n              {`Load ${loadMoreCount} more`}\n            </BitkitButton>\n          )}\n        </>\n      )}\n    </Box>\n  );\n});\n\nBitkitPaginationLoadMore.displayName = 'BitkitPaginationLoadMore';\n\nexport default BitkitPaginationLoadMore;\n"],"mappings":";;;;;;;;AAiBA,IAAM,2BAA2B,YAA2D,OAAO,QAAQ;CACzG,MAAM,EAAE,cAAc,OAAO,YAAY,MAAM,gBAAgB,OAAO,MAAM,YAAY,GAAG,SAAS;CAGpG,MAAM,SADS,cAAc,EAAE,KAAK,qBAAqB,CAC1C,CAAA,CAAO,EAAE,KAAK,CAAC;CAE9B,MAAM,cAAc,KAAK,IAAI,GAAG,IAAI;CACpC,MAAM,wBAAwB,KAAK,IAAI,GAAG,cAAc;CACxD,MAAM,aAAa,KAAK,IAAI,cAAc,uBAAuB,UAAU;CAC3E,MAAM,aAAa,cAAc;CACjC,MAAM,gBAAgB,KAAK,IAAI,uBAAuB,aAAa,UAAU;CAE7E,MAAM,oBAAoB,SAAS,OAAO,OAAO;CAEjD,OACE,qBAAC,KAAD;EAAK,KAAK,OAAO;EAAW;EAAK,GAAI;YAArC,CACE,qBAAC,OAAO,MAAR;GAAa,KAAK,OAAO;aAAzB;IAAkC;IACvB;IAAW;IAAK;GACd;MACZ,CAAC,cACA,oBAAA,YAAA,EAAA,UACG,cACC,oBAAC,qBAAD;GAAqB,OAAM;GAAgB,OAAM;GAAkB,MAAM;EAAoB,CAAA,IAC3F,SAAS,OACX,oBAAC,kBAAD;GAAkB,SAAS;GAAY,MAAK;aACzC,QAAQ,cAAc;EACP,CAAA,IAElB,oBAAC,cAAD;GAAc,SAAS;GAAY,MAAM,SAAS,OAAO,OAAO;GAAM,SAAQ;aAC3E,QAAQ,cAAc;EACX,CAAA,EAEhB,CAAA,CAED;;AAET,CAAC;AAED,yBAAyB,cAAc"}
+{"version":3,"file":"BitkitPaginationLoadMore.js","names":[],"sources":["../../../lib/components/BitkitPaginationLoadMore/BitkitPaginationLoadMore.tsx"],"sourcesContent":["import { Box, type BoxProps } from '@chakra-ui/react/box';\nimport { chakra, useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { Text } from '@chakra-ui/react/text';\nimport { forwardRef } from 'react';\n\nimport IconErrorCircleFilled from '../../icons/IconErrorCircleFilled';\nimport BitkitButton from '../BitkitButton/BitkitButton';\nimport BitkitInlineLoading from '../BitkitInlineLoading/BitkitInlineLoading';\nimport BitkitLinkButton from '../BitkitLinkButton/BitkitLinkButton';\n\nexport interface BitkitPaginationLoadMoreProps extends Omit<BoxProps, 'page' | 'size'> {\n  loadError?: boolean;\n  loadingMore?: boolean;\n  onLoadMore: () => void;\n  page: number;\n  pageItemsCount: number;\n  size?: 'md' | 'sm' | 'xs';\n  totalCount: number;\n}\n\nconst BitkitPaginationLoadMore = forwardRef<HTMLDivElement, BitkitPaginationLoadMoreProps>((props, ref) => {\n  const {\n    loadError = false,\n    loadingMore = false,\n    onLoadMore,\n    page,\n    pageItemsCount,\n    size = 'md',\n    totalCount,\n    ...rest\n  } = props;\n\n  const recipe = useSlotRecipe({ key: 'paginationLoadMore' });\n  const styles = recipe({ size });\n\n  const clampedPage = Math.max(1, page);\n  const clampedPageItemsCount = Math.max(1, pageItemsCount);\n  const shownCount = Math.min(clampedPage * clampedPageItemsCount, totalCount);\n  const isComplete = shownCount >= totalCount;\n  const loadMoreCount = Math.min(clampedPageItemsCount, totalCount - shownCount);\n\n  // Follows the counter's textStyle, not the size name: sm uses body/md/regular too.\n  const inlineLoadingSize = size === 'xs' ? 'sm' : 'md';\n\n  return (\n    <Box css={styles.root} ref={ref} {...rest}>\n      <chakra.span css={styles.counter}>\n        Showing {shownCount} of {totalCount}\n      </chakra.span>\n      {!isComplete && (\n        <>\n          {loadingMore ? (\n            <BitkitInlineLoading color=\"text/tertiary\" label=\"Loading more...\" size={inlineLoadingSize} />\n          ) : size === 'xs' ? (\n            <BitkitLinkButton onClick={onLoadMore} size=\"sm\">\n              {`Load ${loadMoreCount} more`}\n            </BitkitLinkButton>\n          ) : (\n            <BitkitButton onClick={onLoadMore} size={size === 'md' ? 'md' : 'sm'} variant=\"tertiary\">\n              {`Load ${loadMoreCount} more`}\n            </BitkitButton>\n          )}\n          {/* A retry can report both states at once — the spinner replaces the stale error. */}\n          {loadError && !loadingMore && (\n            <Box css={styles.error} role=\"alert\">\n              <IconErrorCircleFilled color=\"icon/negative\" size=\"16\" />\n              <Text as=\"span\">Failed to load items.</Text>\n            </Box>\n          )}\n        </>\n      )}\n    </Box>\n  );\n});\n\nBitkitPaginationLoadMore.displayName = 'BitkitPaginationLoadMore';\n\nexport default BitkitPaginationLoadMore;\n"],"mappings":";;;;;;;;;;AAoBA,IAAM,2BAA2B,YAA2D,OAAO,QAAQ;CACzG,MAAM,EACJ,YAAY,OACZ,cAAc,OACd,YACA,MACA,gBACA,OAAO,MACP,YACA,GAAG,SACD;CAGJ,MAAM,SADS,cAAc,EAAE,KAAK,qBAAqB,CAC1C,CAAA,CAAO,EAAE,KAAK,CAAC;CAE9B,MAAM,cAAc,KAAK,IAAI,GAAG,IAAI;CACpC,MAAM,wBAAwB,KAAK,IAAI,GAAG,cAAc;CACxD,MAAM,aAAa,KAAK,IAAI,cAAc,uBAAuB,UAAU;CAC3E,MAAM,aAAa,cAAc;CACjC,MAAM,gBAAgB,KAAK,IAAI,uBAAuB,aAAa,UAAU;CAG7E,MAAM,oBAAoB,SAAS,OAAO,OAAO;CAEjD,OACE,qBAAC,KAAD;EAAK,KAAK,OAAO;EAAW;EAAK,GAAI;YAArC,CACE,qBAAC,OAAO,MAAR;GAAa,KAAK,OAAO;aAAzB;IAAkC;IACvB;IAAW;IAAK;GACd;MACZ,CAAC,cACA,qBAAA,YAAA,EAAA,UAAA,CACG,cACC,oBAAC,qBAAD;GAAqB,OAAM;GAAgB,OAAM;GAAkB,MAAM;EAAoB,CAAA,IAC3F,SAAS,OACX,oBAAC,kBAAD;GAAkB,SAAS;GAAY,MAAK;aACzC,QAAQ,cAAc;EACP,CAAA,IAElB,oBAAC,cAAD;GAAc,SAAS;GAAY,MAAM,SAAS,OAAO,OAAO;GAAM,SAAQ;aAC3E,QAAQ,cAAc;EACX,CAAA,GAGf,aAAa,CAAC,eACb,qBAAC,KAAD;GAAK,KAAK,OAAO;GAAO,MAAK;aAA7B,CACE,oBAAC,uBAAD;IAAuB,OAAM;IAAgB,MAAK;GAAM,CAAA,GACxD,oBAAC,MAAD;IAAM,IAAG;cAAO;GAA2B,CAAA,CACxC;IAEP,EAAA,CAAA,CAED;;AAET,CAAC;AAED,yBAAyB,cAAc"}

package/dist/components/BitkitTextArea/BitkitTextArea.d.ts

@@ -3,7 +3,8 @@ import { BitkitFieldProps } from '../BitkitField/BitkitField';
 export interface BitkitTextAreaProps extends Omit<BitkitFieldProps, 'children' | 'state'> {
     autoresize?: boolean;
     placeholder?: string;
-    resize?: 'none' | 'both' | 'horizontal' | 'vertical';
+    resize?: 'none' | 'vertical';
+    rows?: number;
     size?: 'md' | 'lg';
     state?: 'disabled' | 'error' | 'readOnly' | 'warning';
     textareaProps?: TextareaProps;

package/dist/components/BitkitTextArea/BitkitTextArea.js

@@ -1,20 +1,45 @@
+import IconErrorCircleFilled from "../../icons/IconErrorCircleFilled.js";
+import IconWarningYellow from "../../icons/IconWarningYellow.js";
 import BitkitField from "../BitkitField/BitkitField.js";
+import { textareaStatusIcon } from "../../theme/recipes/Textarea.recipe.js";
+import { Box } from "@chakra-ui/react/box";
 import { forwardRef } from "react";
-import { jsx } from "react/jsx-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { Textarea } from "@chakra-ui/react/textarea";
 //#region lib/components/BitkitTextArea/BitkitTextArea.tsx
 var BitkitTextArea = forwardRef((props, ref) => {
-	const { autoresize, placeholder, resize, size, state, textareaProps, ...fieldProps } = props;
+	const { autoresize, placeholder, resize, rows = 3, size = "lg", state, textareaProps, ...fieldProps } = props;
+	const isInvalid = state === "error" || !!fieldProps.errorText;
+	const hasWarning = state === "warning" || !!fieldProps.warningText;
+	const iconSize = size === "md" ? "16" : "24";
+	const { paddingInlineEnd, ...iconInset } = textareaStatusIcon[size];
+	const statusIcon = isInvalid ? /* @__PURE__ */ jsx(IconErrorCircleFilled, {
+		color: "icon/negative",
+		position: "absolute",
+		size: iconSize,
+		...iconInset
+	}) : hasWarning ? /* @__PURE__ */ jsx(IconWarningYellow, {
+		position: "absolute",
+		size: iconSize,
+		...iconInset
+	}) : null;
+	const { css: consumerCss, ...restTextareaProps } = textareaProps ?? {};
+	const textareaCss = statusIcon != null ? [{ paddingInlineEnd }, consumerCss] : consumerCss;
 	return /* @__PURE__ */ jsx(BitkitField, {
 		state,
 		...fieldProps,
-		children: /* @__PURE__ */ jsx(Textarea, {
-			ref,
-			autoresize,
-			placeholder,
-			resize,
-			size,
-			...textareaProps
+		children: /* @__PURE__ */ jsxs(Box, {
+			position: "relative",
+			children: [/* @__PURE__ */ jsx(Textarea, {
+				ref,
+				autoresize,
+				css: textareaCss,
+				placeholder,
+				resize,
+				rows,
+				size,
+				...restTextareaProps
+			}), statusIcon]
 		})
 	});
 });

package/dist/components/BitkitTextArea/BitkitTextArea.js.map

@@ -1 +1 @@
-{"version":3,"file":"BitkitTextArea.js","names":[],"sources":["../../../lib/components/BitkitTextArea/BitkitTextArea.tsx"],"sourcesContent":["import { Textarea, type TextareaProps } from '@chakra-ui/react/textarea';\nimport { forwardRef } from 'react';\n\nimport BitkitField, { type BitkitFieldProps } from '../BitkitField/BitkitField';\n\nexport interface BitkitTextAreaProps extends Omit<BitkitFieldProps, 'children' | 'state'> {\n  autoresize?: boolean;\n  placeholder?: string;\n  resize?: 'none' | 'both' | 'horizontal' | 'vertical';\n  size?: 'md' | 'lg';\n  state?: 'disabled' | 'error' | 'readOnly' | 'warning';\n  textareaProps?: TextareaProps;\n}\n\nconst BitkitTextArea = forwardRef<HTMLTextAreaElement, BitkitTextAreaProps>((props, ref) => {\n  const { autoresize, placeholder, resize, size, state, textareaProps, ...fieldProps } = props;\n\n  return (\n    <BitkitField state={state} {...fieldProps}>\n      <Textarea\n        ref={ref}\n        autoresize={autoresize}\n        placeholder={placeholder}\n        resize={resize}\n        size={size}\n        {...textareaProps}\n      />\n    </BitkitField>\n  );\n});\n\nBitkitTextArea.displayName = 'BitkitTextArea';\n\nexport default BitkitTextArea;\n"],"mappings":";;;;;AAcA,IAAM,iBAAiB,YAAsD,OAAO,QAAQ;CAC1F,MAAM,EAAE,YAAY,aAAa,QAAQ,MAAM,OAAO,eAAe,GAAG,eAAe;CAEvF,OACE,oBAAC,aAAD;EAAoB;EAAO,GAAI;YAC7B,oBAAC,UAAD;GACO;GACO;GACC;GACL;GACF;GACN,GAAI;EACL,CAAA;CACU,CAAA;AAEjB,CAAC;AAED,eAAe,cAAc"}
+{"version":3,"file":"BitkitTextArea.js","names":[],"sources":["../../../lib/components/BitkitTextArea/BitkitTextArea.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Textarea, type TextareaProps } from '@chakra-ui/react/textarea';\nimport { forwardRef } from 'react';\n\nimport { IconErrorCircleFilled, IconWarningYellow } from '../../icons';\nimport { textareaStatusIcon } from '../../theme/recipes/Textarea.recipe';\nimport BitkitField, { type BitkitFieldProps } from '../BitkitField/BitkitField';\n\nexport interface BitkitTextAreaProps extends Omit<BitkitFieldProps, 'children' | 'state'> {\n  autoresize?: boolean;\n  placeholder?: string;\n  resize?: 'none' | 'vertical';\n  rows?: number;\n  size?: 'md' | 'lg';\n  state?: 'disabled' | 'error' | 'readOnly' | 'warning';\n  textareaProps?: TextareaProps;\n}\n\nconst BitkitTextArea = forwardRef<HTMLTextAreaElement, BitkitTextAreaProps>((props, ref) => {\n  const { autoresize, placeholder, resize, rows = 3, size = 'lg', state, textareaProps, ...fieldProps } = props;\n\n  const isInvalid = state === 'error' || !!fieldProps.errorText;\n  const hasWarning = state === 'warning' || !!fieldProps.warningText;\n  const iconSize = size === 'md' ? '16' : '24';\n\n  const { paddingInlineEnd, ...iconInset } = textareaStatusIcon[size];\n  const statusIcon = isInvalid ? (\n    <IconErrorCircleFilled color=\"icon/negative\" position=\"absolute\" size={iconSize} {...iconInset} />\n  ) : hasWarning ? (\n    <IconWarningYellow position=\"absolute\" size={iconSize} {...iconInset} />\n  ) : null;\n\n  const { css: consumerCss, ...restTextareaProps } = textareaProps ?? {};\n  const textareaCss = statusIcon != null ? [{ paddingInlineEnd }, consumerCss] : consumerCss;\n\n  return (\n    <BitkitField state={state} {...fieldProps}>\n      <Box position=\"relative\">\n        <Textarea\n          ref={ref}\n          autoresize={autoresize}\n          css={textareaCss}\n          placeholder={placeholder}\n          resize={resize}\n          rows={rows}\n          size={size}\n          {...restTextareaProps}\n        />\n        {statusIcon}\n      </Box>\n    </BitkitField>\n  );\n});\n\nBitkitTextArea.displayName = 'BitkitTextArea';\n\nexport default BitkitTextArea;\n"],"mappings":";;;;;;;;;AAkBA,IAAM,iBAAiB,YAAsD,OAAO,QAAQ;CAC1F,MAAM,EAAE,YAAY,aAAa,QAAQ,OAAO,GAAG,OAAO,MAAM,OAAO,eAAe,GAAG,eAAe;CAExG,MAAM,YAAY,UAAU,WAAW,CAAC,CAAC,WAAW;CACpD,MAAM,aAAa,UAAU,aAAa,CAAC,CAAC,WAAW;CACvD,MAAM,WAAW,SAAS,OAAO,OAAO;CAExC,MAAM,EAAE,kBAAkB,GAAG,cAAc,mBAAmB;CAC9D,MAAM,aAAa,YACjB,oBAAC,uBAAD;EAAuB,OAAM;EAAgB,UAAS;EAAW,MAAM;EAAU,GAAI;CAAY,CAAA,IAC/F,aACF,oBAAC,mBAAD;EAAmB,UAAS;EAAW,MAAM;EAAU,GAAI;CAAY,CAAA,IACrE;CAEJ,MAAM,EAAE,KAAK,aAAa,GAAG,sBAAsB,iBAAiB,CAAC;CACrE,MAAM,cAAc,cAAc,OAAO,CAAC,EAAE,iBAAiB,GAAG,WAAW,IAAI;CAE/E,OACE,oBAAC,aAAD;EAAoB;EAAO,GAAI;YAC7B,qBAAC,KAAD;GAAK,UAAS;aAAd,CACE,oBAAC,UAAD;IACO;IACO;IACZ,KAAK;IACQ;IACL;IACF;IACA;IACN,GAAI;GACL,CAAA,GACA,UACE;;CACM,CAAA;AAEjB,CAAC;AAED,eAAe,cAAc"}

package/dist/theme/common/InputAndTextarea.common.d.ts

@@ -85,6 +85,16 @@ export declare const base: {
         };
     };
 };
+export declare const sizePadding: {
+    readonly md: {
+        readonly inline: 11;
+        readonly block: 7;
+    };
+    readonly lg: {
+        readonly inline: 15;
+        readonly block: 11;
+    };
+};
 export declare const variants: {
     size: {
         md: {

package/dist/theme/common/InputAndTextarea.common.js

@@ -42,16 +42,26 @@ var base = {
 		...text._disabled
 	}
 };
+var sizePadding = {
+	md: {
+		inline: 11,
+		block: 7
+	},
+	lg: {
+		inline: 15,
+		block: 11
+	}
+};
 var variants = { size: {
 	md: {
-		paddingInline: rem(11),
-		paddingBlock: rem(9),
+		paddingInline: rem(sizePadding.md.inline),
+		paddingBlock: rem(sizePadding.md.block),
 		textStyle: "body/md/regular",
 		"--input-height": rem(40)
 	},
 	lg: {
-		paddingInline: rem(15),
-		paddingBlock: rem(11),
+		paddingInline: rem(sizePadding.lg.inline),
+		paddingBlock: rem(sizePadding.lg.block),
 		textStyle: "body/lg/regular",
 		"--input-height": rem(48)
 	}
@@ -65,6 +75,6 @@ var defaultVariants = { size: "lg" };
 */
 var singleLineInputOverrides = { lineHeight: "normal" };
 //#endregion
-export { base, defaultVariants, frame, singleLineInputOverrides, text, variants };
+export { base, defaultVariants, frame, singleLineInputOverrides, sizePadding, text, variants };
 
 //# sourceMappingURL=InputAndTextarea.common.js.map

package/dist/theme/common/InputAndTextarea.common.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputAndTextarea.common.js","names":[],"sources":["../../../lib/theme/common/InputAndTextarea.common.ts"],"sourcesContent":["import { type SystemStyleObject } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nexport const frame = {\n  background: 'background/primary',\n  borderColor: 'border/regular',\n  borderRadius: '4',\n  borderWidth: '1',\n  boxShadow: 'inset/field',\n  transition: 'border 200ms',\n  _hover: {\n    borderColor: 'border/hover',\n  },\n  _invalid: {\n    borderColor: 'border/error',\n    _hover: {\n      borderColor: 'border/error',\n    },\n  },\n  _readOnly: {\n    background: 'background/disabled',\n    _hover: {\n      borderColor: 'border/regular',\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} satisfies SystemStyleObject;\n\nexport const text = {\n  appearance: 'none',\n  color: 'input/text/inputValue',\n  textStyle: 'body/lg/regular',\n  _placeholder: {\n    color: 'input/text/placeholder',\n  },\n  _disabled: {\n    color: 'text/disabled',\n    _placeholder: {\n      color: 'text/disabled',\n    },\n  },\n} satisfies SystemStyleObject;\n\nexport const base = {\n  ...frame,\n  ...text,\n  width: '100%',\n  _disabled: {\n    ...frame._disabled,\n    ...text._disabled,\n  },\n} satisfies SystemStyleObject;\n\nexport const variants = {\n  size: {\n    md: {\n      paddingInline: rem(11),\n      paddingBlock: rem(9),\n      textStyle: 'body/md/regular',\n      '--input-height': rem(40),\n    },\n    lg: {\n      paddingInline: rem(15),\n      paddingBlock: rem(11),\n      textStyle: 'body/lg/regular',\n      '--input-height': rem(48),\n    },\n  },\n} satisfies Record<'size', Record<'md' | 'lg', SystemStyleObject>>;\n\nexport const defaultVariants: Record<'size', 'md' | 'lg'> = {\n  size: 'lg',\n};\n\n/**\n * Additional styles for single-line `<input>` elements to opt out of the textStyle's explicit\n * line-height. With this override the caret follows the font's natural metrics (~font-size ×\n * 1.15) instead of the 20/24px line-height, so it no longer visually extends past sibling icons\n * in input groups. Textarea should NOT use this — multi-line text needs the textStyle line-height.\n */\nexport const singleLineInputOverrides = {\n  lineHeight: 'normal',\n} satisfies SystemStyleObject;\n"],"mappings":";;AAIA,IAAa,QAAQ;CACnB,YAAY;CACZ,aAAa;CACb,cAAc;CACd,aAAa;CACb,WAAW;CACX,YAAY;CACZ,QAAQ,EACN,aAAa,eACf;CACA,UAAU;EACR,aAAa;EACb,QAAQ,EACN,aAAa,eACf;CACF;CACA,WAAW;EACT,YAAY;EACZ,QAAQ,EACN,aAAa,iBACf;CACF;CACA,WAAW;EACT,YAAY;EACZ,aAAa;EACb,QAAQ;EACR,QAAQ,EACN,aAAa,kBACf;CACF;AACF;AAEA,IAAa,OAAO;CAClB,YAAY;CACZ,OAAO;CACP,WAAW;CACX,cAAc,EACZ,OAAO,yBACT;CACA,WAAW;EACT,OAAO;EACP,cAAc,EACZ,OAAO,gBACT;CACF;AACF;AAEA,IAAa,OAAO;CAClB,GAAG;CACH,GAAG;CACH,OAAO;CACP,WAAW;EACT,GAAG,MAAM;EACT,GAAG,KAAK;CACV;AACF;AAEA,IAAa,WAAW,EACtB,MAAM;CACJ,IAAI;EACF,eAAe,IAAI,EAAE;EACrB,cAAc,IAAI,CAAC;EACnB,WAAW;EACX,kBAAkB,IAAI,EAAE;CAC1B;CACA,IAAI;EACF,eAAe,IAAI,EAAE;EACrB,cAAc,IAAI,EAAE;EACpB,WAAW;EACX,kBAAkB,IAAI,EAAE;CAC1B;AACF,EACF;AAEA,IAAa,kBAA+C,EAC1D,MAAM,KACR;;;;;;;AAQA,IAAa,2BAA2B,EACtC,YAAY,SACd"}
+{"version":3,"file":"InputAndTextarea.common.js","names":[],"sources":["../../../lib/theme/common/InputAndTextarea.common.ts"],"sourcesContent":["import { type SystemStyleObject } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nexport const frame = {\n  background: 'background/primary',\n  borderColor: 'border/regular',\n  borderRadius: '4',\n  borderWidth: '1',\n  boxShadow: 'inset/field',\n  transition: 'border 200ms',\n  _hover: {\n    borderColor: 'border/hover',\n  },\n  _invalid: {\n    borderColor: 'border/error',\n    _hover: {\n      borderColor: 'border/error',\n    },\n  },\n  _readOnly: {\n    background: 'background/disabled',\n    _hover: {\n      borderColor: 'border/regular',\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} satisfies SystemStyleObject;\n\nexport const text = {\n  appearance: 'none',\n  color: 'input/text/inputValue',\n  textStyle: 'body/lg/regular',\n  _placeholder: {\n    color: 'input/text/placeholder',\n  },\n  _disabled: {\n    color: 'text/disabled',\n    _placeholder: {\n      color: 'text/disabled',\n    },\n  },\n} satisfies SystemStyleObject;\n\nexport const base = {\n  ...frame,\n  ...text,\n  width: '100%',\n  _disabled: {\n    ...frame._disabled,\n    ...text._disabled,\n  },\n} satisfies SystemStyleObject;\n\n// Text padding per size, in px. Single source of truth: the `variants` below derive their\n// paddingInline/paddingBlock from these, and the textarea recipe reuses them to align the\n// status icon with the text (see Textarea.recipe.ts).\nexport const sizePadding = {\n  md: { inline: 11, block: 7 },\n  lg: { inline: 15, block: 11 },\n} as const;\n\nexport const variants = {\n  size: {\n    md: {\n      paddingInline: rem(sizePadding.md.inline),\n      paddingBlock: rem(sizePadding.md.block),\n      textStyle: 'body/md/regular',\n      '--input-height': rem(40),\n    },\n    lg: {\n      paddingInline: rem(sizePadding.lg.inline),\n      paddingBlock: rem(sizePadding.lg.block),\n      textStyle: 'body/lg/regular',\n      '--input-height': rem(48),\n    },\n  },\n} satisfies Record<'size', Record<'md' | 'lg', SystemStyleObject>>;\n\nexport const defaultVariants: Record<'size', 'md' | 'lg'> = {\n  size: 'lg',\n};\n\n/**\n * Additional styles for single-line `<input>` elements to opt out of the textStyle's explicit\n * line-height. With this override the caret follows the font's natural metrics (~font-size ×\n * 1.15) instead of the 20/24px line-height, so it no longer visually extends past sibling icons\n * in input groups. Textarea should NOT use this — multi-line text needs the textStyle line-height.\n */\nexport const singleLineInputOverrides = {\n  lineHeight: 'normal',\n} satisfies SystemStyleObject;\n"],"mappings":";;AAIA,IAAa,QAAQ;CACnB,YAAY;CACZ,aAAa;CACb,cAAc;CACd,aAAa;CACb,WAAW;CACX,YAAY;CACZ,QAAQ,EACN,aAAa,eACf;CACA,UAAU;EACR,aAAa;EACb,QAAQ,EACN,aAAa,eACf;CACF;CACA,WAAW;EACT,YAAY;EACZ,QAAQ,EACN,aAAa,iBACf;CACF;CACA,WAAW;EACT,YAAY;EACZ,aAAa;EACb,QAAQ;EACR,QAAQ,EACN,aAAa,kBACf;CACF;AACF;AAEA,IAAa,OAAO;CAClB,YAAY;CACZ,OAAO;CACP,WAAW;CACX,cAAc,EACZ,OAAO,yBACT;CACA,WAAW;EACT,OAAO;EACP,cAAc,EACZ,OAAO,gBACT;CACF;AACF;AAEA,IAAa,OAAO;CAClB,GAAG;CACH,GAAG;CACH,OAAO;CACP,WAAW;EACT,GAAG,MAAM;EACT,GAAG,KAAK;CACV;AACF;AAKA,IAAa,cAAc;CACzB,IAAI;EAAE,QAAQ;EAAI,OAAO;CAAE;CAC3B,IAAI;EAAE,QAAQ;EAAI,OAAO;CAAG;AAC9B;AAEA,IAAa,WAAW,EACtB,MAAM;CACJ,IAAI;EACF,eAAe,IAAI,YAAY,GAAG,MAAM;EACxC,cAAc,IAAI,YAAY,GAAG,KAAK;EACtC,WAAW;EACX,kBAAkB,IAAI,EAAE;CAC1B;CACA,IAAI;EACF,eAAe,IAAI,YAAY,GAAG,MAAM;EACxC,cAAc,IAAI,YAAY,GAAG,KAAK;EACtC,WAAW;EACX,kBAAkB,IAAI,EAAE;CAC1B;AACF,EACF;AAEA,IAAa,kBAA+C,EAC1D,MAAM,KACR;;;;;;;AAQA,IAAa,2BAA2B,EACtC,YAAY,SACd"}

package/dist/theme/recipes/Textarea.recipe.d.ts

@@ -1,6 +1,9 @@
 declare const textareaRecipe: import('@chakra-ui/react').RecipeDefinition<{
     size: {
         md: {
+            '&[rows="1"]': {
+                paddingBlock: string;
+            };
             paddingInline: string;
             paddingBlock: string;
             textStyle: "body/md/regular";
@@ -14,4 +17,16 @@ declare const textareaRecipe: import('@chakra-ui/react').RecipeDefinition<{
         };
     };
 }>;
+export declare const textareaStatusIcon: {
+    md: {
+        insetBlockStart: string;
+        insetInlineEnd: string;
+        paddingInlineEnd: string;
+    };
+    lg: {
+        insetBlockStart: string;
+        insetInlineEnd: string;
+        paddingInlineEnd: string;
+    };
+};
 export default textareaRecipe;

package/dist/theme/recipes/Textarea.recipe.js

@@ -1,13 +1,41 @@
-import { base, defaultVariants, variants } from "../common/InputAndTextarea.common.js";
+import { rem } from "../themeUtils.js";
+import { base, defaultVariants, sizePadding, variants } from "../common/InputAndTextarea.common.js";
 import { defineRecipe } from "@chakra-ui/react/styled-system";
 //#region lib/theme/recipes/Textarea.recipe.ts
 var textareaRecipe = defineRecipe({
 	className: "textarea",
-	base,
-	variants,
+	base: {
+		...base,
+		display: "block",
+		minBlockSize: "var(--input-height)"
+	},
+	variants: { size: {
+		md: {
+			...variants.size.md,
+			"&[rows=\"1\"]": { paddingBlock: rem(9) }
+		},
+		lg: variants.size.lg
+	} },
 	defaultVariants
 });
+var ICON_GAP = 8;
+var iconSize = {
+	md: 16,
+	lg: 24
+};
+var textareaStatusIcon = {
+	md: {
+		insetBlockStart: rem(sizePadding.md.block),
+		insetInlineEnd: rem(sizePadding.md.inline),
+		paddingInlineEnd: rem(sizePadding.md.inline + iconSize.md + ICON_GAP)
+	},
+	lg: {
+		insetBlockStart: rem(sizePadding.lg.block),
+		insetInlineEnd: rem(sizePadding.lg.inline),
+		paddingInlineEnd: rem(sizePadding.lg.inline + iconSize.lg + ICON_GAP)
+	}
+};
 //#endregion
-export { textareaRecipe as default };
+export { textareaRecipe as default, textareaStatusIcon };
 
 //# sourceMappingURL=Textarea.recipe.js.map

package/dist/theme/recipes/Textarea.recipe.js.map

@@ -1 +1 @@
-{"version":3,"file":"Textarea.recipe.js","names":[],"sources":["../../../lib/theme/recipes/Textarea.recipe.ts"],"sourcesContent":["import { defineRecipe } from '@chakra-ui/react/styled-system';\n\nimport { base, defaultVariants, variants } from '../common/InputAndTextarea.common';\n\nconst textareaRecipe = defineRecipe({\n  className: 'textarea',\n  base,\n  variants,\n  defaultVariants,\n});\n\nexport default textareaRecipe;\n"],"mappings":";;;AAIA,IAAM,iBAAiB,aAAa;CAClC,WAAW;CACX;CACA;CACA;AACF,CAAC"}
+{"version":3,"file":"Textarea.recipe.js","names":[],"sources":["../../../lib/theme/recipes/Textarea.recipe.ts"],"sourcesContent":["import { defineRecipe } from '@chakra-ui/react/styled-system';\n\nimport { base, defaultVariants, sizePadding, variants } from '../common/InputAndTextarea.common';\nimport { rem } from '../themeUtils';\n\n// Single recipe shared by the raw <Textarea> atom and BitkitTextArea (both get it via Chakra's\n// `<Textarea>`, which applies the `textarea` recipe by key).\nconst textareaRecipe = defineRecipe({\n  className: 'textarea',\n  base: {\n    ...base,\n    // A raw <textarea> is inline-block with baseline alignment, which reserves\n    // descender space below it and inflates the gap to the helper text. Block\n    // layout removes that phantom space.\n    display: 'block',\n    minBlockSize: 'var(--input-height)',\n  },\n  variants: {\n    size: {\n      md: {\n        ...variants.size.md,\n        '&[rows=\"1\"]': { paddingBlock: rem(9) },\n      },\n      lg: variants.size.lg,\n    },\n  },\n  defaultVariants,\n});\n\n// Placement for the status icon (error/warning) that BitkitTextArea overlays on the textarea.\n// Derived from the text padding (`sizePadding`) so the icon aligns with the first line of text,\n// and paddingInlineEnd reserves room for it: text padding + icon size + gap.\nconst ICON_GAP = 8;\nconst iconSize = { md: 16, lg: 24 } as const;\n\nexport const textareaStatusIcon = {\n  md: {\n    insetBlockStart: rem(sizePadding.md.block),\n    insetInlineEnd: rem(sizePadding.md.inline),\n    paddingInlineEnd: rem(sizePadding.md.inline + iconSize.md + ICON_GAP),\n  },\n  lg: {\n    insetBlockStart: rem(sizePadding.lg.block),\n    insetInlineEnd: rem(sizePadding.lg.inline),\n    paddingInlineEnd: rem(sizePadding.lg.inline + iconSize.lg + ICON_GAP),\n  },\n};\n\nexport default textareaRecipe;\n"],"mappings":";;;;AAOA,IAAM,iBAAiB,aAAa;CAClC,WAAW;CACX,MAAM;EACJ,GAAG;EAIH,SAAS;EACT,cAAc;CAChB;CACA,UAAU,EACR,MAAM;EACJ,IAAI;GACF,GAAG,SAAS,KAAK;GACjB,iBAAe,EAAE,cAAc,IAAI,CAAC,EAAE;EACxC;EACA,IAAI,SAAS,KAAK;CACpB,EACF;CACA;AACF,CAAC;AAKD,IAAM,WAAW;AACjB,IAAM,WAAW;CAAE,IAAI;CAAI,IAAI;AAAG;AAElC,IAAa,qBAAqB;CAChC,IAAI;EACF,iBAAiB,IAAI,YAAY,GAAG,KAAK;EACzC,gBAAgB,IAAI,YAAY,GAAG,MAAM;EACzC,kBAAkB,IAAI,YAAY,GAAG,SAAS,SAAS,KAAK,QAAQ;CACtE;CACA,IAAI;EACF,iBAAiB,IAAI,YAAY,GAAG,KAAK;EACzC,gBAAgB,IAAI,YAAY,GAAG,MAAM;EACzC,kBAAkB,IAAI,YAAY,GAAG,SAAS,SAAS,KAAK,QAAQ;CACtE;AACF"}

package/dist/theme/recipes/index.d.ts

@@ -492,6 +492,9 @@ declare const recipes: {
     textarea: import('@chakra-ui/react').RecipeDefinition<{
         size: {
             md: {
+                '&[rows="1"]': {
+                    paddingBlock: string;
+                };
                 paddingInline: string;
                 paddingBlock: string;
                 textStyle: "body/md/regular";

package/dist/theme/recipes/index.js

@@ -1,5 +1,6 @@
 import colorButtonRecipe from "./ColorButton.recipe.js";
 import inputRecipe from "./Input.recipe.js";
+import textareaRecipe from "./Textarea.recipe.js";
 import badgeRecipe from "./Badge.recipe.js";
 import buttonRecipe from "./Button.recipe.js";
 import closeButtonRecipe from "./CloseButton.recipe.js";
@@ -13,7 +14,6 @@ import selectableTagRecipe from "./SelectableTag.recipe.js";
 import separatorRecipe from "./Separator.recipe.js";
 import skeletonRecipe from "./Skeleton.recipe.js";
 import spinnerRecipe from "./Spinner.recipe.js";
-import textareaRecipe from "./Textarea.recipe.js";
 import toggleButtonRecipe from "./ToggleButton.recipe.js";
 //#region lib/theme/recipes/index.ts
 var recipes = {

package/dist/theme/slot-recipes/PaginationLoadMore.recipe.d.ts

@@ -1,4 +1,4 @@
-declare const paginationLoadMoreRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"root" | "counter", {
+declare const paginationLoadMoreRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"root" | "error" | "counter", {
     size: {
         md: {
             root: {
@@ -11,6 +11,9 @@ declare const paginationLoadMoreRecipe: import('@chakra-ui/react').SlotRecipeDef
                     paddingInlineEnd: "24";
                 };
             };
+            error: {
+                textStyle: "body/md/regular";
+            };
         };
         sm: {
             root: {
@@ -23,6 +26,9 @@ declare const paginationLoadMoreRecipe: import('@chakra-ui/react').SlotRecipeDef
                     paddingInlineEnd: "16";
                 };
             };
+            error: {
+                textStyle: "body/md/regular";
+            };
         };
         xs: {
             root: {
@@ -35,6 +41,9 @@ declare const paginationLoadMoreRecipe: import('@chakra-ui/react').SlotRecipeDef
                     paddingInlineEnd: "12";
                 };
             };
+            error: {
+                textStyle: "body/sm/regular";
+            };
         };
     };
 }>;

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

@@ -3,7 +3,11 @@ import { defineSlotRecipe } from "@chakra-ui/react/styled-system";
 //#region lib/theme/slot-recipes/PaginationLoadMore.recipe.ts
 var paginationLoadMoreRecipe = defineSlotRecipe({
 	className: "pagination-load-more",
-	slots: ["root", "counter"],
+	slots: [
+		"root",
+		"counter",
+		"error"
+	],
 	base: {
 		root: {
 			alignItems: "center",
@@ -19,6 +23,16 @@ var paginationLoadMoreRecipe = defineSlotRecipe({
 				borderInlineEndStyle: "solid",
 				borderInlineEndWidth: "1"
 			}
+		},
+		error: {
+			alignItems: "center",
+			color: "text/negative",
+			display: "flex",
+			flex: "1",
+			gap: "4",
+			justifyContent: "flex-end",
+			minWidth: 0,
+			paddingBlock: "2"
 		}
 	},
 	variants: { size: {
@@ -30,7 +44,8 @@ var paginationLoadMoreRecipe = defineSlotRecipe({
 			counter: {
 				textStyle: "body/md/regular",
 				"&:has(+ *)": { paddingInlineEnd: "24" }
-			}
+			},
+			error: { textStyle: "body/md/regular" }
 		},
 		sm: {
 			root: {
@@ -40,7 +55,8 @@ var paginationLoadMoreRecipe = defineSlotRecipe({
 			counter: {
 				textStyle: "body/md/regular",
 				"&:has(+ *)": { paddingInlineEnd: "16" }
-			}
+			},
+			error: { textStyle: "body/md/regular" }
 		},
 		xs: {
 			root: {
@@ -50,7 +66,8 @@ var paginationLoadMoreRecipe = defineSlotRecipe({
 			counter: {
 				textStyle: "body/sm/regular",
 				"&:has(+ *)": { paddingInlineEnd: "12" }
-			}
+			},
+			error: { textStyle: "body/sm/regular" }
 		}
 	} },
 	defaultVariants: { size: "md" }

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

@@ -1 +1 @@
-{"version":3,"file":"PaginationLoadMore.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/PaginationLoadMore.recipe.ts"],"sourcesContent":["import { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nconst paginationLoadMoreRecipe = defineSlotRecipe({\n  className: 'pagination-load-more',\n  slots: ['root', 'counter'],\n  base: {\n    root: {\n      alignItems: 'center',\n      display: 'flex',\n      paddingBlock: '8',\n      paddingInline: '16',\n    },\n    counter: {\n      color: 'text/secondary',\n      fontVariantNumeric: 'tabular-nums',\n      '&:has(+ *)': {\n        borderInlineEndColor: 'border/regular',\n        borderInlineEndStyle: 'solid',\n        borderInlineEndWidth: '1',\n      },\n    },\n  },\n  variants: {\n    size: {\n      md: {\n        root: {\n          gap: '24',\n          minHeight: rem(56),\n        },\n        counter: {\n          textStyle: 'body/md/regular',\n          '&:has(+ *)': {\n            paddingInlineEnd: '24',\n          },\n        },\n      },\n      sm: {\n        root: {\n          gap: '16',\n          minHeight: '48',\n        },\n        counter: {\n          textStyle: 'body/md/regular',\n          '&:has(+ *)': {\n            paddingInlineEnd: '16',\n          },\n        },\n      },\n      xs: {\n        root: {\n          gap: '12',\n          minHeight: '32',\n        },\n        counter: {\n          textStyle: 'body/sm/regular',\n          '&:has(+ *)': {\n            paddingInlineEnd: '12',\n          },\n        },\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n  },\n});\n\nexport default paginationLoadMoreRecipe;\n"],"mappings":";;;AAIA,IAAM,2BAA2B,iBAAiB;CAChD,WAAW;CACX,OAAO,CAAC,QAAQ,SAAS;CACzB,MAAM;EACJ,MAAM;GACJ,YAAY;GACZ,SAAS;GACT,cAAc;GACd,eAAe;EACjB;EACA,SAAS;GACP,OAAO;GACP,oBAAoB;GACpB,cAAc;IACZ,sBAAsB;IACtB,sBAAsB;IACtB,sBAAsB;GACxB;EACF;CACF;CACA,UAAU,EACR,MAAM;EACJ,IAAI;GACF,MAAM;IACJ,KAAK;IACL,WAAW,IAAI,EAAE;GACnB;GACA,SAAS;IACP,WAAW;IACX,cAAc,EACZ,kBAAkB,KACpB;GACF;EACF;EACA,IAAI;GACF,MAAM;IACJ,KAAK;IACL,WAAW;GACb;GACA,SAAS;IACP,WAAW;IACX,cAAc,EACZ,kBAAkB,KACpB;GACF;EACF;EACA,IAAI;GACF,MAAM;IACJ,KAAK;IACL,WAAW;GACb;GACA,SAAS;IACP,WAAW;IACX,cAAc,EACZ,kBAAkB,KACpB;GACF;EACF;CACF,EACF;CACA,iBAAiB,EACf,MAAM,KACR;AACF,CAAC"}
+{"version":3,"file":"PaginationLoadMore.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/PaginationLoadMore.recipe.ts"],"sourcesContent":["import { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nconst paginationLoadMoreRecipe = defineSlotRecipe({\n  className: 'pagination-load-more',\n  slots: ['root', 'counter', 'error'],\n  base: {\n    root: {\n      alignItems: 'center',\n      display: 'flex',\n      paddingBlock: '8',\n      paddingInline: '16',\n    },\n    counter: {\n      color: 'text/secondary',\n      fontVariantNumeric: 'tabular-nums',\n      '&:has(+ *)': {\n        borderInlineEndColor: 'border/regular',\n        borderInlineEndStyle: 'solid',\n        borderInlineEndWidth: '1',\n      },\n    },\n    error: {\n      alignItems: 'center',\n      color: 'text/negative',\n      display: 'flex',\n      flex: '1',\n      gap: '4',\n      justifyContent: 'flex-end',\n      minWidth: 0,\n      paddingBlock: '2',\n    },\n  },\n  variants: {\n    // md/sm keep a wider gap than the Figma spec (24/16 instead of 12/8). Figma expects the\n    // tertiary button's own inline padding to make up the rest, but that puts its hover\n    // background within 12/8px of the divider. Trading exact spec for hover breathing room.\n    size: {\n      md: {\n        root: {\n          gap: '24',\n          minHeight: rem(56),\n        },\n        counter: {\n          textStyle: 'body/md/regular',\n          '&:has(+ *)': {\n            paddingInlineEnd: '24',\n          },\n        },\n        error: {\n          textStyle: 'body/md/regular',\n        },\n      },\n      sm: {\n        root: {\n          gap: '16',\n          minHeight: '48',\n        },\n        counter: {\n          textStyle: 'body/md/regular',\n          '&:has(+ *)': {\n            paddingInlineEnd: '16',\n          },\n        },\n        error: {\n          textStyle: 'body/md/regular',\n        },\n      },\n      xs: {\n        root: {\n          gap: '12',\n          minHeight: '32',\n        },\n        counter: {\n          textStyle: 'body/sm/regular',\n          '&:has(+ *)': {\n            paddingInlineEnd: '12',\n          },\n        },\n        error: {\n          textStyle: 'body/sm/regular',\n        },\n      },\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n  },\n});\n\nexport default paginationLoadMoreRecipe;\n"],"mappings":";;;AAIA,IAAM,2BAA2B,iBAAiB;CAChD,WAAW;CACX,OAAO;EAAC;EAAQ;EAAW;CAAO;CAClC,MAAM;EACJ,MAAM;GACJ,YAAY;GACZ,SAAS;GACT,cAAc;GACd,eAAe;EACjB;EACA,SAAS;GACP,OAAO;GACP,oBAAoB;GACpB,cAAc;IACZ,sBAAsB;IACtB,sBAAsB;IACtB,sBAAsB;GACxB;EACF;EACA,OAAO;GACL,YAAY;GACZ,OAAO;GACP,SAAS;GACT,MAAM;GACN,KAAK;GACL,gBAAgB;GAChB,UAAU;GACV,cAAc;EAChB;CACF;CACA,UAAU,EAIR,MAAM;EACJ,IAAI;GACF,MAAM;IACJ,KAAK;IACL,WAAW,IAAI,EAAE;GACnB;GACA,SAAS;IACP,WAAW;IACX,cAAc,EACZ,kBAAkB,KACpB;GACF;GACA,OAAO,EACL,WAAW,kBACb;EACF;EACA,IAAI;GACF,MAAM;IACJ,KAAK;IACL,WAAW;GACb;GACA,SAAS;IACP,WAAW;IACX,cAAc,EACZ,kBAAkB,KACpB;GACF;GACA,OAAO,EACL,WAAW,kBACb;EACF;EACA,IAAI;GACF,MAAM;IACJ,KAAK;IACL,WAAW;GACb;GACA,SAAS;IACP,WAAW;IACX,cAAc,EACZ,kBAAkB,KACpB;GACF;GACA,OAAO,EACL,WAAW,kBACb;EACF;CACF,EACF;CACA,iBAAiB,EACf,MAAM,KACR;AACF,CAAC"}

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

@@ -1448,7 +1448,7 @@ declare const slotRecipes: {
             };
         };
     }>;
-    paginationLoadMore: import('@chakra-ui/react').SlotRecipeDefinition<"root" | "counter", {
+    paginationLoadMore: import('@chakra-ui/react').SlotRecipeDefinition<"root" | "error" | "counter", {
         size: {
             md: {
                 root: {
@@ -1461,6 +1461,9 @@ declare const slotRecipes: {
                         paddingInlineEnd: "24";
                     };
                 };
+                error: {
+                    textStyle: "body/md/regular";
+                };
             };
             sm: {
                 root: {
@@ -1473,6 +1476,9 @@ declare const slotRecipes: {
                         paddingInlineEnd: "16";
                     };
                 };
+                error: {
+                    textStyle: "body/md/regular";
+                };
             };
             xs: {
                 root: {
@@ -1485,6 +1491,9 @@ declare const slotRecipes: {
                         paddingInlineEnd: "12";
                     };
                 };
+                error: {
+                    textStyle: "body/sm/regular";
+                };
             };
         };
     }>;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@bitrise/bitkit-v2",
   "private": false,
-  "version": "0.3.317",
+  "version": "0.3.319",
   "description": "Bitrise Design System Components built with Chakra UI V3",
   "keywords": [
     "react",