@bitrise/bitkit-v2 0.3.179 → 0.3.180

package/dist/components/BitkitFileInput/BitkitFileInput.js

@@ -1,112 +1,136 @@
-import e from "../../icons/IconMinusCircle.js";
-import t from "../../icons/IconUpload.js";
-import n from "../BitkitButton/BitkitButton.js";
-import r from "../BitkitCard/BitkitCard.js";
-import i from "../BitkitField/BitkitField.js";
-import a, { useImageCropperContext as o } from "../../atoms/ImageCropper/ImageCropper.js";
-import { Text as s } from "@chakra-ui/react/text";
-import { forwardRef as c, useEffect as l, useMemo as u } from "react";
-import { Fragment as d, jsx as f, jsxs as p } from "react/jsx-runtime";
-import { FileUpload as m, useFileUploadContext as h } from "@chakra-ui/react/file-upload";
-import { VStack as g } from "@chakra-ui/react/stack";
-import { splitProps as _ } from "@zag-js/file-upload";
+import IconMinusCircle from "../../icons/IconMinusCircle.js";
+import IconUpload from "../../icons/IconUpload.js";
+import BitkitButton from "../BitkitButton/BitkitButton.js";
+import BitkitCard from "../BitkitCard/BitkitCard.js";
+import BitkitField from "../BitkitField/BitkitField.js";
+import ImageCropper_default, { useImageCropperContext } from "../../atoms/ImageCropper/ImageCropper.js";
+import { Text } from "@chakra-ui/react/text";
+import { forwardRef, useEffect, useMemo } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
+import { FileUpload, useFileUploadContext } from "@chakra-ui/react/file-upload";
+import { VStack } from "@chakra-ui/react/stack";
+import { splitProps } from "@zag-js/file-upload";
 //#region lib/components/BitkitFileInput/BitkitFileInput.tsx
-var v = () => {
-	let { disabled: e } = h(), n = e ? "Cannot upload file" : "Drag and drop file here or click to select";
-	return /* @__PURE__ */ f(m.Dropzone, { children: /* @__PURE__ */ p(m.DropzoneContent, { children: [/* @__PURE__ */ f(t, {}), /* @__PURE__ */ f(s, {
+var Dropzone = () => {
+	const { disabled } = useFileUploadContext();
+	const dropzoneLabel = disabled ? "Cannot upload file" : "Drag and drop file here or click to select";
+	return /* @__PURE__ */ jsx(FileUpload.Dropzone, { children: /* @__PURE__ */ jsxs(FileUpload.DropzoneContent, { children: [/* @__PURE__ */ jsx(IconUpload, {}), /* @__PURE__ */ jsx(Text, {
 		as: "span",
-		children: n
+		children: dropzoneLabel
 	})] }) });
-}, y = (e) => {
-	let { onCropChange: t } = e, { acceptedFiles: n } = h(), { dragging: r, getCroppedImage: i } = o(), s = n[0], c = u(() => s ? URL.createObjectURL(s) : void 0, [s]);
-	return l(() => () => {
-		c && URL.revokeObjectURL(c);
-	}, [c]), l(() => {
-		if (!t || r || !s) return;
-		let e = !1;
-		return i().then((n) => {
-			!e && n instanceof Blob && t(new File([n], s.name, { type: n.type }));
-		}), () => {
-			e = !0;
+};
+var ImagePreviewContent = (props) => {
+	const { onCropChange } = props;
+	const { acceptedFiles } = useFileUploadContext();
+	const { dragging, getCroppedImage } = useImageCropperContext();
+	const acceptedFile = acceptedFiles[0];
+	const objectUrl = useMemo(() => acceptedFile ? URL.createObjectURL(acceptedFile) : void 0, [acceptedFile]);
+	useEffect(() => {
+		return () => {
+			if (objectUrl) URL.revokeObjectURL(objectUrl);
+		};
+	}, [objectUrl]);
+	useEffect(() => {
+		if (!onCropChange || dragging) return;
+		if (!acceptedFile) return;
+		let cancelled = false;
+		getCroppedImage().then((result) => {
+			if (!cancelled && result instanceof Blob) onCropChange(new File([result], acceptedFile.name, { type: result.type }));
+		});
+		return () => {
+			cancelled = true;
 		};
 	}, [
-		i,
-		s,
-		t,
-		r
-	]), /* @__PURE__ */ p(a.Viewport, { children: [/* @__PURE__ */ f(a.Image, { src: c }), /* @__PURE__ */ f(a.Selection, { children: a.handles.map((e) => /* @__PURE__ */ f(a.Handle, {
-		position: e,
-		children: /* @__PURE__ */ f("div", {})
-	}, e)) })] });
-}, b = (e) => {
-	let { aspectRatio: t, onCropChange: n } = e;
-	return /* @__PURE__ */ f(a.Root, {
-		aspectRatio: t,
+		getCroppedImage,
+		acceptedFile,
+		onCropChange,
+		dragging
+	]);
+	return /* @__PURE__ */ jsxs(ImageCropper_default.Viewport, { children: [/* @__PURE__ */ jsx(ImageCropper_default.Image, { src: objectUrl }), /* @__PURE__ */ jsx(ImageCropper_default.Selection, { children: ImageCropper_default.handles.map((position) => /* @__PURE__ */ jsx(ImageCropper_default.Handle, {
+		position,
+		children: /* @__PURE__ */ jsx("div", {})
+	}, position)) })] });
+};
+var ImagePreview = (props) => {
+	const { aspectRatio, onCropChange } = props;
+	return /* @__PURE__ */ jsx(ImageCropper_default.Root, {
+		aspectRatio,
 		height: "100%",
-		children: /* @__PURE__ */ f(y, { onCropChange: n })
+		children: /* @__PURE__ */ jsx(ImagePreviewContent, { onCropChange })
 	});
-}, x = () => {
-	let t = h(), i = t.acceptedFiles[0];
-	return /* @__PURE__ */ p(r, {
+};
+var NonImagePreview = () => {
+	const fileUpload = useFileUploadContext();
+	const acceptedFile = fileUpload.acceptedFiles[0];
+	return /* @__PURE__ */ jsxs(BitkitCard, {
 		display: "flex",
-		elevation: !1,
+		elevation: false,
 		paddingBlock: "20",
 		paddingInline: "24",
 		alignItems: "center",
 		flex: "1",
-		children: [/* @__PURE__ */ p(g, {
+		children: [/* @__PURE__ */ jsxs(VStack, {
 			gap: "4",
 			alignItems: "flex-start",
 			flex: "1",
 			minWidth: "0",
-			children: [/* @__PURE__ */ f(s, {
+			children: [/* @__PURE__ */ jsx(Text, {
 				textStyle: "comp/input/label",
 				children: "Selected file"
-			}), /* @__PURE__ */ f(s, {
+			}), /* @__PURE__ */ jsx(Text, {
 				whiteSpace: "nowrap",
 				textOverflow: "ellipsis",
 				overflow: "hidden",
 				maxWidth: "100%",
-				children: i.name
+				children: acceptedFile.name
 			})]
-		}), /* @__PURE__ */ f(n, {
-			icon: e,
+		}), /* @__PURE__ */ jsx(BitkitButton, {
+			icon: IconMinusCircle,
 			variant: "secondary",
 			size: "md",
-			onClick: t.clearFiles,
+			onClick: fileUpload.clearFiles,
 			children: "Remove"
 		})]
 	});
-}, S = (e) => {
-	let { variant: t, aspectRatio: n, onCropChange: r } = e, i = h().acceptedFiles[0];
-	return /* @__PURE__ */ p(d, { children: [
-		!i && /* @__PURE__ */ f(v, {}),
-		i && t === "image" && /* @__PURE__ */ f(b, {
-			aspectRatio: n,
-			onCropChange: r
+};
+var BitkitFileInputContent = (props) => {
+	const { variant, aspectRatio, onCropChange } = props;
+	const acceptedFile = useFileUploadContext().acceptedFiles[0];
+	return /* @__PURE__ */ jsxs(Fragment$1, { children: [
+		!acceptedFile && /* @__PURE__ */ jsx(Dropzone, {}),
+		acceptedFile && variant === "image" && /* @__PURE__ */ jsx(ImagePreview, {
+			aspectRatio,
+			onCropChange
 		}),
-		i && t !== "image" && /* @__PURE__ */ f(x, {})
+		acceptedFile && variant !== "image" && /* @__PURE__ */ jsx(NonImagePreview, {})
 	] });
-}, C = c((e, t) => {
-	let { aspectRatio: n, onCropChange: r, onFileAccept: a, onFileAccepted: o, state: s, variant: c, ...l } = e, [u, d] = _(l), h = (e) => {
-		a?.(e), o?.(e.files[0]);
-	}, g = {
-		variant: c,
-		aspectRatio: n,
-		onCropChange: r
+};
+var BitkitFileInput = forwardRef((props, ref) => {
+	const { aspectRatio, onCropChange, onFileAccept, onFileAccepted, state, variant, ...rest } = props;
+	const [fileUploadProps, fieldProps] = splitProps(rest);
+	const handleFileAccept = (details) => {
+		onFileAccept?.(details);
+		onFileAccepted?.(details.files[0]);
+	};
+	const contentProps = {
+		variant,
+		aspectRatio,
+		onCropChange
 	};
-	return /* @__PURE__ */ f(i, {
-		ref: t,
-		state: s,
-		...d,
-		children: /* @__PURE__ */ p(m.Root, {
-			variant: c,
-			onFileAccept: h,
-			...u,
-			children: [/* @__PURE__ */ f(m.HiddenInput, {}), /* @__PURE__ */ f(S, { ...g })]
+	return /* @__PURE__ */ jsx(BitkitField, {
+		ref,
+		state,
+		...fieldProps,
+		children: /* @__PURE__ */ jsxs(FileUpload.Root, {
+			variant,
+			onFileAccept: handleFileAccept,
+			...fileUploadProps,
+			children: [/* @__PURE__ */ jsx(FileUpload.HiddenInput, {}), /* @__PURE__ */ jsx(BitkitFileInputContent, { ...contentProps })]
 		})
 	});
 });
-C.displayName = "BitkitFileInput";
+BitkitFileInput.displayName = "BitkitFileInput";
 //#endregion
-export { C as default };
+export { BitkitFileInput as default };
+
+//# sourceMappingURL=BitkitFileInput.js.map

package/dist/components/BitkitFileInput/BitkitFileInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BitkitFileInput.js","names":[],"sources":["../../../lib/components/BitkitFileInput/BitkitFileInput.tsx"],"sourcesContent":["import {\n  FileUpload,\n  type FileUploadFileAcceptDetails,\n  type FileUploadRootProps,\n  useFileUploadContext,\n} from '@chakra-ui/react/file-upload';\nimport { VStack } from '@chakra-ui/react/stack';\nimport { Text } from '@chakra-ui/react/text';\nimport { splitProps as splitFileUploadProps } from '@zag-js/file-upload';\nimport { forwardRef, useEffect, useMemo } from 'react';\n\nimport ImageCropper, { useImageCropperContext } from '../../atoms/ImageCropper/ImageCropper';\nimport { IconMinusCircle, IconUpload } from '../../icons';\nimport BitkitButton from '../BitkitButton/BitkitButton';\nimport BitkitCard from '../BitkitCard/BitkitCard';\nimport BitkitField, { type BitkitFieldProps } from '../BitkitField/BitkitField';\n\ntype BitkitFileInputProps = Omit<BitkitFieldProps, 'children' | 'state'> &\n  Omit<FileUploadRootProps, 'disabled' | 'invalid'> & {\n    aspectRatio?: number;\n    onCropChange?: (file: File) => void;\n    onFileAccepted?: (file: File) => void;\n    state?: 'error' | 'disabled';\n  };\n\nconst Dropzone = () => {\n  const { disabled } = useFileUploadContext();\n  const dropzoneLabel = disabled ? 'Cannot upload file' : 'Drag and drop file here or click to select';\n\n  return (\n    <FileUpload.Dropzone>\n      <FileUpload.DropzoneContent>\n        <IconUpload />\n        <Text as=\"span\">{dropzoneLabel}</Text>\n      </FileUpload.DropzoneContent>\n    </FileUpload.Dropzone>\n  );\n};\n\nconst ImagePreviewContent = (props: Pick<BitkitFileInputProps, 'onCropChange'>) => {\n  const { onCropChange } = props;\n\n  const { acceptedFiles } = useFileUploadContext();\n  const { dragging, getCroppedImage } = useImageCropperContext();\n\n  const acceptedFile = acceptedFiles[0];\n  const objectUrl = useMemo(() => (acceptedFile ? URL.createObjectURL(acceptedFile) : undefined), [acceptedFile]);\n\n  useEffect(() => {\n    return () => {\n      if (objectUrl) {\n        URL.revokeObjectURL(objectUrl);\n      }\n    };\n  }, [objectUrl]);\n\n  useEffect(() => {\n    if (!onCropChange || dragging) {\n      return;\n    }\n\n    if (!acceptedFile) {\n      return;\n    }\n\n    let cancelled = false;\n    getCroppedImage().then((result) => {\n      if (!cancelled && result instanceof Blob) {\n        onCropChange(new File([result], acceptedFile.name, { type: result.type }));\n      }\n    });\n\n    return () => {\n      cancelled = true;\n    };\n  }, [getCroppedImage, acceptedFile, onCropChange, dragging]);\n\n  return (\n    <ImageCropper.Viewport>\n      <ImageCropper.Image src={objectUrl} />\n      <ImageCropper.Selection>\n        {ImageCropper.handles.map((position) => (\n          <ImageCropper.Handle key={position} position={position}>\n            <div />\n          </ImageCropper.Handle>\n        ))}\n      </ImageCropper.Selection>\n    </ImageCropper.Viewport>\n  );\n};\n\nconst ImagePreview = (props: Pick<BitkitFileInputProps, 'aspectRatio' | 'onCropChange'>) => {\n  const { aspectRatio, onCropChange } = props;\n\n  return (\n    <ImageCropper.Root aspectRatio={aspectRatio} height=\"100%\">\n      <ImagePreviewContent onCropChange={onCropChange} />\n    </ImageCropper.Root>\n  );\n};\n\nconst NonImagePreview = () => {\n  const fileUpload = useFileUploadContext();\n  const acceptedFile = fileUpload.acceptedFiles[0];\n\n  return (\n    <BitkitCard display=\"flex\" elevation={false} paddingBlock=\"20\" paddingInline=\"24\" alignItems=\"center\" flex=\"1\">\n      <VStack gap=\"4\" alignItems=\"flex-start\" flex=\"1\" minWidth=\"0\">\n        <Text textStyle=\"comp/input/label\">Selected file</Text>\n        <Text whiteSpace=\"nowrap\" textOverflow=\"ellipsis\" overflow=\"hidden\" maxWidth=\"100%\">\n          {acceptedFile.name}\n        </Text>\n      </VStack>\n      <BitkitButton icon={IconMinusCircle} variant=\"secondary\" size=\"md\" onClick={fileUpload.clearFiles}>\n        Remove\n      </BitkitButton>\n    </BitkitCard>\n  );\n};\n\nconst BitkitFileInputContent = (props: Pick<BitkitFileInputProps, 'variant' | 'aspectRatio' | 'onCropChange'>) => {\n  const { variant, aspectRatio, onCropChange } = props;\n  const acceptedFile = useFileUploadContext().acceptedFiles[0];\n\n  return (\n    <>\n      {!acceptedFile && <Dropzone />}\n      {acceptedFile && variant === 'image' && <ImagePreview aspectRatio={aspectRatio} onCropChange={onCropChange} />}\n      {acceptedFile && variant !== 'image' && <NonImagePreview />}\n    </>\n  );\n};\n\nconst BitkitFileInput = forwardRef<HTMLDivElement, BitkitFileInputProps>((props, ref) => {\n  const { aspectRatio, onCropChange, onFileAccept, onFileAccepted, state, variant, ...rest } = props;\n  const [fileUploadProps, fieldProps] = splitFileUploadProps(rest as never);\n\n  const handleFileAccept = (details: FileUploadFileAcceptDetails) => {\n    onFileAccept?.(details);\n    onFileAccepted?.(details.files[0]);\n  };\n\n  const contentProps = {\n    variant,\n    aspectRatio,\n    onCropChange,\n  };\n\n  return (\n    <BitkitField ref={ref} state={state} {...fieldProps}>\n      <FileUpload.Root variant={variant} onFileAccept={handleFileAccept} {...fileUploadProps}>\n        <FileUpload.HiddenInput />\n        <BitkitFileInputContent {...contentProps} />\n      </FileUpload.Root>\n    </BitkitField>\n  );\n});\n\nBitkitFileInput.displayName = 'BitkitFileInput';\n\nexport default BitkitFileInput;\n"],"mappings":"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"}

package/dist/components/BitkitGroupHeading/BitkitGroupHeading.js

@@ -1,27 +1,30 @@
-import { Box as e } from "@chakra-ui/react/box";
-import { chakra as t, useSlotRecipe as n } from "@chakra-ui/react/styled-system";
-import { forwardRef as r } from "react";
-import { jsx as i, jsxs as a } from "react/jsx-runtime";
-import { Separator as o } from "@chakra-ui/react/separator";
+import { Box } from "@chakra-ui/react/box";
+import { chakra, useSlotRecipe } from "@chakra-ui/react/styled-system";
+import { forwardRef } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Separator } from "@chakra-ui/react/separator";
 //#region lib/components/BitkitGroupHeading/BitkitGroupHeading.tsx
-var s = r((r, s) => {
-	let { icon: c, label: l, ...u } = r, d = n({ key: "groupHeading" })();
-	return /* @__PURE__ */ a(e, {
-		css: d.root,
-		ref: s,
-		...u,
-		children: [/* @__PURE__ */ a(t.div, {
-			css: d.titleBlock,
-			children: [c && /* @__PURE__ */ i(c, {
-				css: d.icon,
+var BitkitGroupHeading = forwardRef((props, ref) => {
+	const { icon: Icon, label, ...rest } = props;
+	const styles = useSlotRecipe({ key: "groupHeading" })();
+	return /* @__PURE__ */ jsxs(Box, {
+		css: styles.root,
+		ref,
+		...rest,
+		children: [/* @__PURE__ */ jsxs(chakra.div, {
+			css: styles.titleBlock,
+			children: [Icon && /* @__PURE__ */ jsx(Icon, {
+				css: styles.icon,
 				size: "16"
-			}), /* @__PURE__ */ i(t.span, {
-				css: d.label,
-				children: l
+			}), /* @__PURE__ */ jsx(chakra.span, {
+				css: styles.label,
+				children: label
 			})]
-		}), /* @__PURE__ */ i(o, { css: d.separator })]
+		}), /* @__PURE__ */ jsx(Separator, { css: styles.separator })]
 	});
 });
-s.displayName = "BitkitGroupHeading";
+BitkitGroupHeading.displayName = "BitkitGroupHeading";
 //#endregion
-export { s as default };
+export { BitkitGroupHeading as default };
+
+//# sourceMappingURL=BitkitGroupHeading.js.map

package/dist/components/BitkitGroupHeading/BitkitGroupHeading.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BitkitGroupHeading.js","names":[],"sources":["../../../lib/components/BitkitGroupHeading/BitkitGroupHeading.tsx"],"sourcesContent":["import { Box, type BoxProps } from '@chakra-ui/react/box';\nimport { Separator } from '@chakra-ui/react/separator';\nimport { chakra, useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { forwardRef } from 'react';\n\nimport { type BitkitIconComponent } from '../../icons';\n\nexport interface BitkitGroupHeadingProps extends Omit<BoxProps, 'icon'> {\n  icon?: BitkitIconComponent;\n  label: string;\n}\n\nconst BitkitGroupHeading = forwardRef<HTMLDivElement, BitkitGroupHeadingProps>((props, ref) => {\n  const { icon: Icon, label, ...rest } = props;\n\n  const recipe = useSlotRecipe({ key: 'groupHeading' });\n  const styles = recipe();\n\n  return (\n    <Box css={styles.root} ref={ref} {...rest}>\n      <chakra.div css={styles.titleBlock}>\n        {Icon && <Icon css={styles.icon} size=\"16\" />}\n        <chakra.span css={styles.label}>{label}</chakra.span>\n      </chakra.div>\n      <Separator css={styles.separator} />\n    </Box>\n  );\n});\n\nBitkitGroupHeading.displayName = 'BitkitGroupHeading';\n\nexport default BitkitGroupHeading;\n"],"mappings":";;;;;;AAYA,IAAM,qBAAqB,YAAqD,OAAO,QAAQ;CAC7F,MAAM,EAAE,MAAM,MAAM,OAAO,GAAG,SAAS;CAGvC,MAAM,SADS,cAAc,EAAE,KAAK,gBAAgB,CAAC,EAC9B;AAEvB,QACE,qBAAC,KAAD;EAAK,KAAK,OAAO;EAAW;EAAK,GAAI;YAArC,CACE,qBAAC,OAAO,KAAR;GAAY,KAAK,OAAO;aAAxB,CACG,QAAQ,oBAAC,MAAD;IAAM,KAAK,OAAO;IAAM,MAAK;IAAO,CAAA,EAC7C,oBAAC,OAAO,MAAR;IAAa,KAAK,OAAO;cAAQ;IAAoB,CAAA,CAC1C;MACb,oBAAC,WAAD,EAAW,KAAK,OAAO,WAAa,CAAA,CAChC;;EAER;AAEF,mBAAmB,cAAc"}

package/dist/components/BitkitIconButton/BitkitIconButton.js

@@ -1,29 +1,32 @@
-import e from "../BitkitTooltip/BitkitTooltip.js";
-import { forwardRef as t } from "react";
-import { jsx as n } from "react/jsx-runtime";
-import { IconButton as r } from "@chakra-ui/react/button";
-import { Skeleton as i } from "@chakra-ui/react/skeleton";
+import BitkitTooltip from "../BitkitTooltip/BitkitTooltip.js";
+import { forwardRef } from "react";
+import { jsx } from "react/jsx-runtime";
+import { IconButton } from "@chakra-ui/react/button";
+import { Skeleton } from "@chakra-ui/react/skeleton";
 //#region lib/components/BitkitIconButton/BitkitIconButton.tsx
-var a = t((t, a) => {
-	let { icon: o, label: s, size: c, state: l, tooltipProps: u, ...d } = t, f = c === "lg" ? "24" : "16";
-	return /* @__PURE__ */ n(e, {
-		text: s,
-		...u,
-		children: /* @__PURE__ */ n(i, {
-			asChild: !0,
-			loading: l === "skeleton",
-			children: /* @__PURE__ */ n(r, {
-				"aria-label": s,
-				disabled: l === "disabled",
-				loading: l === "loading",
-				ref: a,
-				size: c,
-				...d,
-				children: /* @__PURE__ */ n(o, { size: f })
+var BitkitIconButton = forwardRef((props, ref) => {
+	const { icon: Icon, label, size, state, tooltipProps, ...rest } = props;
+	const iconSize = size === "lg" ? "24" : "16";
+	return /* @__PURE__ */ jsx(BitkitTooltip, {
+		text: label,
+		...tooltipProps,
+		children: /* @__PURE__ */ jsx(Skeleton, {
+			asChild: true,
+			loading: state === "skeleton",
+			children: /* @__PURE__ */ jsx(IconButton, {
+				"aria-label": label,
+				disabled: state === "disabled",
+				loading: state === "loading",
+				ref,
+				size,
+				...rest,
+				children: /* @__PURE__ */ jsx(Icon, { size: iconSize })
 			})
 		})
 	});
 });
-a.displayName = "BitkitIconButton";
+BitkitIconButton.displayName = "BitkitIconButton";
 //#endregion
-export { a as default };
+export { BitkitIconButton as default };
+
+//# sourceMappingURL=BitkitIconButton.js.map

package/dist/components/BitkitIconButton/BitkitIconButton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BitkitIconButton.js","names":[],"sources":["../../../lib/components/BitkitIconButton/BitkitIconButton.tsx"],"sourcesContent":["import { IconButton, type IconButtonProps } from '@chakra-ui/react/button';\nimport { Skeleton } from '@chakra-ui/react/skeleton';\nimport { forwardRef } from 'react';\n\nimport { type BitkitIconComponent } from '../../icons';\nimport BitkitTooltip, { type BitkitTooltipProps } from '../BitkitTooltip/BitkitTooltip';\n\nexport interface BitkitIconButtonProps extends Omit<\n  IconButtonProps,\n  'aria-label' | 'children' | 'colorPalette' | 'disabled' | 'loading' | 'loadingText' | 'spinner' | 'spinnerPlacement'\n> {\n  icon: BitkitIconComponent;\n  label: string;\n  state?: 'disabled' | 'loading' | 'skeleton';\n  tooltipProps?: Partial<Omit<BitkitTooltipProps, 'children' | 'text'>>;\n}\n\nconst BitkitIconButton = forwardRef<HTMLButtonElement, BitkitIconButtonProps>((props, ref) => {\n  const { icon: Icon, label, size, state, tooltipProps, ...rest } = props;\n  const iconSize = size === 'lg' ? '24' : '16';\n\n  return (\n    <BitkitTooltip text={label} {...tooltipProps}>\n      <Skeleton asChild loading={state === 'skeleton'}>\n        <IconButton\n          aria-label={label}\n          disabled={state === 'disabled'}\n          loading={state === 'loading'}\n          ref={ref}\n          size={size}\n          {...rest}\n        >\n          <Icon size={iconSize} />\n        </IconButton>\n      </Skeleton>\n    </BitkitTooltip>\n  );\n});\n\nBitkitIconButton.displayName = 'BitkitIconButton';\n\nexport default BitkitIconButton;\n"],"mappings":";;;;;;AAiBA,IAAM,mBAAmB,YAAsD,OAAO,QAAQ;CAC5F,MAAM,EAAE,MAAM,MAAM,OAAO,MAAM,OAAO,cAAc,GAAG,SAAS;CAClE,MAAM,WAAW,SAAS,OAAO,OAAO;AAExC,QACE,oBAAC,eAAD;EAAe,MAAM;EAAO,GAAI;YAC9B,oBAAC,UAAD;GAAU,SAAA;GAAQ,SAAS,UAAU;aACnC,oBAAC,YAAD;IACE,cAAY;IACZ,UAAU,UAAU;IACpB,SAAS,UAAU;IACd;IACC;IACN,GAAI;cAEJ,oBAAC,MAAD,EAAM,MAAM,UAAY,CAAA;IACb,CAAA;GACJ,CAAA;EACG,CAAA;EAElB;AAEF,iBAAiB,cAAc"}

package/dist/components/BitkitInlineLoading/BitkitInlineLoading.js

@@ -1,16 +1,17 @@
-import e from "../../icons/IconCheckCircleFilled.js";
-import t from "../../icons/IconCrossCircleFilled.js";
-import { Box as n } from "@chakra-ui/react/box";
-import { chakra as r, useSlotRecipe as i } from "@chakra-ui/react/styled-system";
-import { forwardRef as a } from "react";
-import { jsx as o, jsxs as s } from "react/jsx-runtime";
-import { Spinner as c } from "@chakra-ui/react/spinner";
+import IconCheckCircleFilled from "../../icons/IconCheckCircleFilled.js";
+import IconCrossCircleFilled from "../../icons/IconCrossCircleFilled.js";
+import { Box } from "@chakra-ui/react/box";
+import { chakra, useSlotRecipe } from "@chakra-ui/react/styled-system";
+import { forwardRef } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Spinner } from "@chakra-ui/react/spinner";
 //#region lib/components/BitkitInlineLoading/BitkitInlineLoading.tsx
-var l = {
+var ICON_SIZE_MAP = {
 	lg: "24",
 	md: "16",
 	sm: "16"
-}, u = {
+};
+var SPINNER_SIZE_MAP = {
 	lg: {
 		margin: "2",
 		size: "20"
@@ -23,37 +24,43 @@ var l = {
 		margin: "1",
 		size: "14px"
 	}
-}, d = a((a, d) => {
-	let { label: f, size: p = "md", status: m = "loading", ...h } = a, g = i({ key: "inlineLoading" })({
-		size: p,
-		status: m
-	}), _ = l[p], { margin: v, size: y } = u[p];
-	return /* @__PURE__ */ s(n, {
-		css: g.root,
-		ref: d,
-		...h,
+};
+var BitkitInlineLoading = forwardRef((props, ref) => {
+	const { label, size = "md", status = "loading", ...rest } = props;
+	const styles = useSlotRecipe({ key: "inlineLoading" })({
+		size,
+		status
+	});
+	const iconSize = ICON_SIZE_MAP[size];
+	const { margin: spinnerMargin, size: spinnerSize } = SPINNER_SIZE_MAP[size];
+	return /* @__PURE__ */ jsxs(Box, {
+		css: styles.root,
+		ref,
+		...rest,
 		children: [
-			m === "loading" && /* @__PURE__ */ o(c, {
+			status === "loading" && /* @__PURE__ */ jsx(Spinner, {
 				variant: "purple",
-				width: y,
-				height: y,
-				margin: v
+				width: spinnerSize,
+				height: spinnerSize,
+				margin: spinnerMargin
 			}),
-			m === "success" && /* @__PURE__ */ o(e, {
+			status === "success" && /* @__PURE__ */ jsx(IconCheckCircleFilled, {
 				color: "icon/positive",
-				size: _
+				size: iconSize
 			}),
-			m === "error" && /* @__PURE__ */ o(t, {
+			status === "error" && /* @__PURE__ */ jsx(IconCrossCircleFilled, {
 				color: "icon/negative",
-				size: _
+				size: iconSize
 			}),
-			f && /* @__PURE__ */ o(r.span, {
-				css: g.label,
-				children: f
+			label && /* @__PURE__ */ jsx(chakra.span, {
+				css: styles.label,
+				children: label
 			})
 		]
 	});
 });
-d.displayName = "BitkitInlineLoading";
+BitkitInlineLoading.displayName = "BitkitInlineLoading";
 //#endregion
-export { d as default };
+export { BitkitInlineLoading as default };
+
+//# sourceMappingURL=BitkitInlineLoading.js.map

package/dist/components/BitkitInlineLoading/BitkitInlineLoading.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BitkitInlineLoading.js","names":[],"sources":["../../../lib/components/BitkitInlineLoading/BitkitInlineLoading.tsx"],"sourcesContent":["import { Box, type BoxProps } from '@chakra-ui/react/box';\nimport { Spinner } from '@chakra-ui/react/spinner';\nimport { chakra, useSlotRecipe } from '@chakra-ui/react/styled-system';\nimport { forwardRef } from 'react';\n\nimport IconCheckCircleFilled from '../../icons/IconCheckCircleFilled';\nimport IconCrossCircleFilled from '../../icons/IconCrossCircleFilled';\n\nexport interface BitkitInlineLoadingProps extends Omit<BoxProps, 'size'> {\n  label?: string;\n  size?: 'lg' | 'md' | 'sm';\n  status?: 'error' | 'loading' | 'success';\n}\n\nconst ICON_SIZE_MAP = {\n  lg: '24',\n  md: '16',\n  sm: '16',\n} as const;\n\n// Icons have built-in padding: 2px for 24px icons, 1px for 16px icons.\n// The spinner uses the inner visual size + matching margin to occupy the same bounding box.\nconst SPINNER_SIZE_MAP = {\n  lg: { margin: '2', size: '20' },\n  md: { margin: '1', size: '14px' },\n  sm: { margin: '1', size: '14px' },\n} as const;\n\nconst BitkitInlineLoading = forwardRef<HTMLDivElement, BitkitInlineLoadingProps>((props, ref) => {\n  const { label, size = 'md', status = 'loading', ...rest } = props;\n\n  const recipe = useSlotRecipe({ key: 'inlineLoading' });\n  const styles = recipe({ size, status });\n\n  const iconSize = ICON_SIZE_MAP[size];\n  const { margin: spinnerMargin, size: spinnerSize } = SPINNER_SIZE_MAP[size];\n\n  return (\n    <Box css={styles.root} ref={ref} {...rest}>\n      {status === 'loading' && (\n        <Spinner variant=\"purple\" width={spinnerSize} height={spinnerSize} margin={spinnerMargin} />\n      )}\n      {status === 'success' && <IconCheckCircleFilled color=\"icon/positive\" size={iconSize} />}\n      {status === 'error' && <IconCrossCircleFilled color=\"icon/negative\" size={iconSize} />}\n      {label && <chakra.span css={styles.label}>{label}</chakra.span>}\n    </Box>\n  );\n});\n\nBitkitInlineLoading.displayName = 'BitkitInlineLoading';\n\nexport default BitkitInlineLoading;\n"],"mappings":";;;;;;;;AAcA,IAAM,gBAAgB;CACpB,IAAI;CACJ,IAAI;CACJ,IAAI;CACL;AAID,IAAM,mBAAmB;CACvB,IAAI;EAAE,QAAQ;EAAK,MAAM;EAAM;CAC/B,IAAI;EAAE,QAAQ;EAAK,MAAM;EAAQ;CACjC,IAAI;EAAE,QAAQ;EAAK,MAAM;EAAQ;CAClC;AAED,IAAM,sBAAsB,YAAsD,OAAO,QAAQ;CAC/F,MAAM,EAAE,OAAO,OAAO,MAAM,SAAS,WAAW,GAAG,SAAS;CAG5D,MAAM,SADS,cAAc,EAAE,KAAK,iBAAiB,CAAC,CAChC;EAAE;EAAM;EAAQ,CAAC;CAEvC,MAAM,WAAW,cAAc;CAC/B,MAAM,EAAE,QAAQ,eAAe,MAAM,gBAAgB,iBAAiB;AAEtE,QACE,qBAAC,KAAD;EAAK,KAAK,OAAO;EAAW;EAAK,GAAI;YAArC;GACG,WAAW,aACV,oBAAC,SAAD;IAAS,SAAQ;IAAS,OAAO;IAAa,QAAQ;IAAa,QAAQ;IAAiB,CAAA;GAE7F,WAAW,aAAa,oBAAC,uBAAD;IAAuB,OAAM;IAAgB,MAAM;IAAY,CAAA;GACvF,WAAW,WAAW,oBAAC,uBAAD;IAAuB,OAAM;IAAgB,MAAM;IAAY,CAAA;GACrF,SAAS,oBAAC,OAAO,MAAR;IAAa,KAAK,OAAO;cAAQ;IAAoB,CAAA;GAC3D;;EAER;AAEF,oBAAoB,cAAc"}

package/dist/components/BitkitInteractiveTooltip/BitkitInteractiveTooltip.js

@@ -1,41 +1,45 @@
-import e from "../BitkitColorButton/BitkitColorButton.js";
-import { Box as t } from "@chakra-ui/react/box";
-import { jsx as n, jsxs as r } from "react/jsx-runtime";
-import { Tooltip as i } from "@chakra-ui/react/tooltip";
-import { Link as a } from "@chakra-ui/react/link";
+import BitkitColorButton from "../BitkitColorButton/BitkitColorButton.js";
+import { Box } from "@chakra-ui/react/box";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Tooltip } from "@chakra-ui/react/tooltip";
+import { Link } from "@chakra-ui/react/link";
 //#region lib/components/BitkitInteractiveTooltip/BitkitInteractiveTooltip.tsx
-var o = ({ button: o, children: s, learnMoreTarget: c, learnMoreUrl: l, placement: u = "top", text: d }) => /* @__PURE__ */ r(i.Root, {
-	interactive: !0,
-	paddingSize: "lg",
-	positioning: {
-		placement: u,
-		offset: {
-			mainAxis: 8,
-			crossAxis: 0
-		}
-	},
-	children: [/* @__PURE__ */ n(i.Trigger, {
-		asChild: !0,
-		children: s
-	}), /* @__PURE__ */ n(i.Positioner, { children: /* @__PURE__ */ r(i.Content, { children: [
-		/* @__PURE__ */ n(i.Arrow, { children: /* @__PURE__ */ n(i.ArrowTip, {}) }),
-		d,
-		/* @__PURE__ */ r(t, {
-			marginBlockStart: "16",
-			display: "flex",
-			gap: "16",
-			justifyContent: "space-between",
-			alignItems: "center",
-			children: [/* @__PURE__ */ n(a, {
-				color: "sys/purple/highlight",
-				href: l,
-				rel: c === "_blank" ? "noopener noreferrer" : void 0,
-				target: c,
-				children: "Learn more"
-			}), o && /* @__PURE__ */ n(e, { ...o })]
-		})
-	] }) })]
-});
-o.displayName = "BitkitInteractiveTooltip";
+var BitkitInteractiveTooltip = ({ button, children, learnMoreTarget, learnMoreUrl, placement = "top", text }) => {
+	return /* @__PURE__ */ jsxs(Tooltip.Root, {
+		interactive: true,
+		paddingSize: "lg",
+		positioning: {
+			placement,
+			offset: {
+				mainAxis: 8,
+				crossAxis: 0
+			}
+		},
+		children: [/* @__PURE__ */ jsx(Tooltip.Trigger, {
+			asChild: true,
+			children
+		}), /* @__PURE__ */ jsx(Tooltip.Positioner, { children: /* @__PURE__ */ jsxs(Tooltip.Content, { children: [
+			/* @__PURE__ */ jsx(Tooltip.Arrow, { children: /* @__PURE__ */ jsx(Tooltip.ArrowTip, {}) }),
+			text,
+			/* @__PURE__ */ jsxs(Box, {
+				marginBlockStart: "16",
+				display: "flex",
+				gap: "16",
+				justifyContent: "space-between",
+				alignItems: "center",
+				children: [/* @__PURE__ */ jsx(Link, {
+					color: "sys/purple/highlight",
+					href: learnMoreUrl,
+					rel: learnMoreTarget === "_blank" ? "noopener noreferrer" : void 0,
+					target: learnMoreTarget,
+					children: "Learn more"
+				}), button && /* @__PURE__ */ jsx(BitkitColorButton, { ...button })]
+			})
+		] }) })]
+	});
+};
+BitkitInteractiveTooltip.displayName = "BitkitInteractiveTooltip";
 //#endregion
-export { o as default };
+export { BitkitInteractiveTooltip as default };
+
+//# sourceMappingURL=BitkitInteractiveTooltip.js.map

package/dist/components/BitkitInteractiveTooltip/BitkitInteractiveTooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BitkitInteractiveTooltip.js","names":[],"sources":["../../../lib/components/BitkitInteractiveTooltip/BitkitInteractiveTooltip.tsx"],"sourcesContent":["import { Box } from '@chakra-ui/react/box';\nimport { Link } from '@chakra-ui/react/link';\nimport { Tooltip, type TooltipRootProps } from '@chakra-ui/react/tooltip';\nimport { type ReactNode } from 'react';\n\nimport BitkitColorButton, { type BitkitColorButtonProps } from '../BitkitColorButton/BitkitColorButton';\n\nexport type BitkitInteractiveTooltipProps = {\n  button?: BitkitColorButtonProps;\n  children: ReactNode;\n  learnMoreTarget?: HTMLAnchorElement['target'];\n  learnMoreUrl: string;\n  placement?: NonNullable<TooltipRootProps['positioning']>['placement'];\n  text: string;\n};\n\nconst BitkitInteractiveTooltip = ({\n  button,\n  children,\n  learnMoreTarget,\n  learnMoreUrl,\n  placement = 'top',\n  text,\n}: BitkitInteractiveTooltipProps) => {\n  return (\n    <Tooltip.Root interactive paddingSize=\"lg\" positioning={{ placement, offset: { mainAxis: 8, crossAxis: 0 } }}>\n      <Tooltip.Trigger asChild>{children}</Tooltip.Trigger>\n      <Tooltip.Positioner>\n        <Tooltip.Content>\n          <Tooltip.Arrow>\n            <Tooltip.ArrowTip />\n          </Tooltip.Arrow>\n          {text}\n          <Box marginBlockStart=\"16\" display=\"flex\" gap=\"16\" justifyContent=\"space-between\" alignItems=\"center\">\n            <Link\n              color=\"sys/purple/highlight\"\n              href={learnMoreUrl}\n              rel={learnMoreTarget === '_blank' ? 'noopener noreferrer' : undefined}\n              target={learnMoreTarget}\n            >\n              Learn more\n            </Link>\n            {button && <BitkitColorButton {...button} />}\n          </Box>\n        </Tooltip.Content>\n      </Tooltip.Positioner>\n    </Tooltip.Root>\n  );\n};\n\nBitkitInteractiveTooltip.displayName = 'BitkitInteractiveTooltip';\n\nexport default BitkitInteractiveTooltip;\n"],"mappings":";;;;;;AAgBA,IAAM,4BAA4B,EAChC,QACA,UACA,iBACA,cACA,YAAY,OACZ,WACmC;AACnC,QACE,qBAAC,QAAQ,MAAT;EAAc,aAAA;EAAY,aAAY;EAAK,aAAa;GAAE;GAAW,QAAQ;IAAE,UAAU;IAAG,WAAW;IAAG;GAAE;YAA5G,CACE,oBAAC,QAAQ,SAAT;GAAiB,SAAA;GAAS;GAA2B,CAAA,EACrD,oBAAC,QAAQ,YAAT,EAAA,UACE,qBAAC,QAAQ,SAAT,EAAA,UAAA;GACE,oBAAC,QAAQ,OAAT,EAAA,UACE,oBAAC,QAAQ,UAAT,EAAoB,CAAA,EACN,CAAA;GACf;GACD,qBAAC,KAAD;IAAK,kBAAiB;IAAK,SAAQ;IAAO,KAAI;IAAK,gBAAe;IAAgB,YAAW;cAA7F,CACE,oBAAC,MAAD;KACE,OAAM;KACN,MAAM;KACN,KAAK,oBAAoB,WAAW,wBAAwB,KAAA;KAC5D,QAAQ;eACT;KAEM,CAAA,EACN,UAAU,oBAAC,mBAAD,EAAmB,GAAI,QAAU,CAAA,CACxC;;GACU,EAAA,CAAA,EACC,CAAA,CACR;;;AAInB,yBAAyB,cAAc"}