@pyck/react 0.0.5 → 0.0.7

package/dist/components/table/index.js

@@ -1,9 +1,11 @@
 import { t as __exportAll } from "../../chunk-BYypO7fO.js";
 import { match } from "ts-pattern";
+import { c } from "react/compiler-runtime";
 import { useCallback, useEffect, useState } from "react";
 import { ark } from "@ark-ui/react/factory";
 import { Box, HStack, createStyleContext } from "@pyck/styled-system/jsx";
 import { table } from "@pyck/styled-system/recipes";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { Show } from "@pyck/react/show";
 import { Wrap } from "@pyck/react/wrap";
 import { Icon } from "@pyck/react/icon";
@@ -12,69 +14,388 @@ import { Tooltip } from "@pyck/react/tooltip";
 import { DisplayDateValue } from "@pyck/react/display-date-value";
 
 //#region src/components/table/cells/table-cell-content.tsx
-const renderIcon = (icon, iconProps) => match(icon).when((x) => typeof x === "function", (Icon) => <Icon {...iconProps} />).otherwise((node) => node ?? null);
+const renderIcon = (icon, iconProps) => match(icon).when((x) => typeof x === "function", (Icon) => /* @__PURE__ */ jsx(Icon, { ...iconProps })).otherwise((node) => node ?? null);
 const TableCellContent = (props) => {
-	const { children, icon, iconProps, tooltip, justifyContent = "flex-start", ...rest } = props;
-	const content = <HStack justifyContent={justifyContent} {...rest}>
-      <Wrap when={!!icon} with={(children) => <Icon boxSize="4">{children}</Icon>}>
-        {renderIcon(icon, iconProps)}
-      </Wrap>
-
-      <Box overflow="hidden" textOverflow="ellipsis">
-        {children}
-      </Box>
-    </HStack>;
-	return <Show when={!!tooltip} fallback={content}>
-      <Tooltip content={tooltip} openDelay={100}>
-        {content}
-      </Tooltip>
-    </Show>;
+	const $ = c(27);
+	let children;
+	let icon;
+	let iconProps;
+	let rest;
+	let t0;
+	let tooltip;
+	if ($[0] !== props) {
+		({children, icon, iconProps, tooltip, justifyContent: t0, ...rest} = props);
+		$[0] = props;
+		$[1] = children;
+		$[2] = icon;
+		$[3] = iconProps;
+		$[4] = rest;
+		$[5] = t0;
+		$[6] = tooltip;
+	} else {
+		children = $[1];
+		icon = $[2];
+		iconProps = $[3];
+		rest = $[4];
+		t0 = $[5];
+		tooltip = $[6];
+	}
+	const justifyContent = t0 === void 0 ? "flex-start" : t0;
+	const t1 = !!icon;
+	let t2;
+	if ($[7] !== icon || $[8] !== iconProps) {
+		t2 = renderIcon(icon, iconProps);
+		$[7] = icon;
+		$[8] = iconProps;
+		$[9] = t2;
+	} else t2 = $[9];
+	let t3;
+	if ($[10] !== t1 || $[11] !== t2) {
+		t3 = /* @__PURE__ */ jsx(Wrap, {
+			when: t1,
+			with: _temp,
+			children: t2
+		});
+		$[10] = t1;
+		$[11] = t2;
+		$[12] = t3;
+	} else t3 = $[12];
+	let t4;
+	if ($[13] !== children) {
+		t4 = /* @__PURE__ */ jsx(Box, {
+			overflow: "hidden",
+			textOverflow: "ellipsis",
+			children
+		});
+		$[13] = children;
+		$[14] = t4;
+	} else t4 = $[14];
+	let t5;
+	if ($[15] !== justifyContent || $[16] !== rest || $[17] !== t3 || $[18] !== t4) {
+		t5 = /* @__PURE__ */ jsxs(HStack, {
+			justifyContent,
+			...rest,
+			children: [t3, t4]
+		});
+		$[15] = justifyContent;
+		$[16] = rest;
+		$[17] = t3;
+		$[18] = t4;
+		$[19] = t5;
+	} else t5 = $[19];
+	const content = t5;
+	const t6 = !!tooltip;
+	let t7;
+	if ($[20] !== content || $[21] !== tooltip) {
+		t7 = /* @__PURE__ */ jsx(Tooltip, {
+			content: tooltip,
+			openDelay: 100,
+			children: content
+		});
+		$[20] = content;
+		$[21] = tooltip;
+		$[22] = t7;
+	} else t7 = $[22];
+	let t8;
+	if ($[23] !== content || $[24] !== t6 || $[25] !== t7) {
+		t8 = /* @__PURE__ */ jsx(Show, {
+			when: t6,
+			fallback: content,
+			children: t7
+		});
+		$[23] = content;
+		$[24] = t6;
+		$[25] = t7;
+		$[26] = t8;
+	} else t8 = $[26];
+	return t8;
 };
+function _temp(children_0) {
+	return /* @__PURE__ */ jsx(Icon, {
+		boxSize: "4",
+		children: children_0
+	});
+}
 
 //#endregion
 //#region src/components/table/cells/boolean-cell.tsx
 const BooleanCell = (props) => {
-	const { value: booleanValue, trueLabel = "Yes", falseLabel = "No", copyable, icon, tooltip, ...rest } = props;
-	const value = booleanValue ? trueLabel : falseLabel;
-	return <TableCellContent tooltip={tooltip} icon={icon} {...rest}>
-      <DisplayValue value={value} copyable={copyable} />
-    </TableCellContent>;
+	const $ = c(16);
+	let booleanValue;
+	let copyable;
+	let icon;
+	let rest;
+	let t0;
+	let t1;
+	let tooltip;
+	if ($[0] !== props) {
+		({value: booleanValue, trueLabel: t0, falseLabel: t1, copyable, icon, tooltip, ...rest} = props);
+		$[0] = props;
+		$[1] = booleanValue;
+		$[2] = copyable;
+		$[3] = icon;
+		$[4] = rest;
+		$[5] = t0;
+		$[6] = t1;
+		$[7] = tooltip;
+	} else {
+		booleanValue = $[1];
+		copyable = $[2];
+		icon = $[3];
+		rest = $[4];
+		t0 = $[5];
+		t1 = $[6];
+		tooltip = $[7];
+	}
+	const value = booleanValue ? t0 === void 0 ? "Yes" : t0 : t1 === void 0 ? "No" : t1;
+	let t2;
+	if ($[8] !== copyable || $[9] !== value) {
+		t2 = /* @__PURE__ */ jsx(DisplayValue, {
+			value,
+			copyable
+		});
+		$[8] = copyable;
+		$[9] = value;
+		$[10] = t2;
+	} else t2 = $[10];
+	let t3;
+	if ($[11] !== icon || $[12] !== rest || $[13] !== t2 || $[14] !== tooltip) {
+		t3 = /* @__PURE__ */ jsx(TableCellContent, {
+			tooltip,
+			icon,
+			...rest,
+			children: t2
+		});
+		$[11] = icon;
+		$[12] = rest;
+		$[13] = t2;
+		$[14] = tooltip;
+		$[15] = t3;
+	} else t3 = $[15];
+	return t3;
 };
 
 //#endregion
 //#region src/components/table/cells/date-cell.tsx
 const DateCell = (props) => {
-	const { value, type = "date", format, locale, copyable, icon, tooltip, justifyContent, ...rest } = props;
-	return <TableCellContent icon={icon} tooltip={tooltip} justifyContent={justifyContent} {...rest}>
-      <DisplayDateValue value={value} type={type} format={format} locale={locale} copyable={copyable} />
-    </TableCellContent>;
+	const $ = c(22);
+	let copyable;
+	let format;
+	let icon;
+	let justifyContent;
+	let locale;
+	let rest;
+	let t0;
+	let tooltip;
+	let value;
+	if ($[0] !== props) {
+		({value, type: t0, format, locale, copyable, icon, tooltip, justifyContent, ...rest} = props);
+		$[0] = props;
+		$[1] = copyable;
+		$[2] = format;
+		$[3] = icon;
+		$[4] = justifyContent;
+		$[5] = locale;
+		$[6] = rest;
+		$[7] = t0;
+		$[8] = tooltip;
+		$[9] = value;
+	} else {
+		copyable = $[1];
+		format = $[2];
+		icon = $[3];
+		justifyContent = $[4];
+		locale = $[5];
+		rest = $[6];
+		t0 = $[7];
+		tooltip = $[8];
+		value = $[9];
+	}
+	const type = t0 === void 0 ? "date" : t0;
+	let t1;
+	if ($[10] !== copyable || $[11] !== format || $[12] !== locale || $[13] !== type || $[14] !== value) {
+		t1 = /* @__PURE__ */ jsx(DisplayDateValue, {
+			value,
+			type,
+			format,
+			locale,
+			copyable
+		});
+		$[10] = copyable;
+		$[11] = format;
+		$[12] = locale;
+		$[13] = type;
+		$[14] = value;
+		$[15] = t1;
+	} else t1 = $[15];
+	let t2;
+	if ($[16] !== icon || $[17] !== justifyContent || $[18] !== rest || $[19] !== t1 || $[20] !== tooltip) {
+		t2 = /* @__PURE__ */ jsx(TableCellContent, {
+			icon,
+			tooltip,
+			justifyContent,
+			...rest,
+			children: t1
+		});
+		$[16] = icon;
+		$[17] = justifyContent;
+		$[18] = rest;
+		$[19] = t1;
+		$[20] = tooltip;
+		$[21] = t2;
+	} else t2 = $[21];
+	return t2;
 };
 
 //#endregion
 //#region src/components/table/cells/number-cell.tsx
 const NumberCell = (props) => {
-	const { value, minimumFractionDigits, maximumFractionDigits, locale: localeProp, useGrouping, copyable, tooltip, justifyContent = "flex-end", icon, ...rest } = props;
+	const $ = c(26);
+	let copyable;
+	let icon;
+	let localeProp;
+	let maximumFractionDigits;
+	let minimumFractionDigits;
+	let rest;
+	let t0;
+	let tooltip;
+	let useGrouping;
+	let value;
+	if ($[0] !== props) {
+		({value, minimumFractionDigits, maximumFractionDigits, locale: localeProp, useGrouping, copyable, tooltip, justifyContent: t0, icon, ...rest} = props);
+		$[0] = props;
+		$[1] = copyable;
+		$[2] = icon;
+		$[3] = localeProp;
+		$[4] = maximumFractionDigits;
+		$[5] = minimumFractionDigits;
+		$[6] = rest;
+		$[7] = t0;
+		$[8] = tooltip;
+		$[9] = useGrouping;
+		$[10] = value;
+	} else {
+		copyable = $[1];
+		icon = $[2];
+		localeProp = $[3];
+		maximumFractionDigits = $[4];
+		minimumFractionDigits = $[5];
+		rest = $[6];
+		t0 = $[7];
+		tooltip = $[8];
+		useGrouping = $[9];
+		value = $[10];
+	}
+	const justifyContent = t0 === void 0 ? "flex-end" : t0;
 	const locale = localeProp ?? "en";
-	const formatValue = (n) => {
-		if (!Number.isFinite(n)) return null;
-		return new Intl.NumberFormat(locale, {
-			useGrouping,
-			minimumFractionDigits,
-			maximumFractionDigits
-		}).format(n);
-	};
-	return <TableCellContent icon={icon} tooltip={tooltip} justifyContent={justifyContent} {...rest}>
-      <DisplayValue value={value} formatValue={formatValue} copyable={copyable} />
-    </TableCellContent>;
+	let t1;
+	if ($[11] !== locale || $[12] !== maximumFractionDigits || $[13] !== minimumFractionDigits || $[14] !== useGrouping) {
+		t1 = (n) => {
+			if (!Number.isFinite(n)) return null;
+			return new Intl.NumberFormat(locale, {
+				useGrouping,
+				minimumFractionDigits,
+				maximumFractionDigits
+			}).format(n);
+		};
+		$[11] = locale;
+		$[12] = maximumFractionDigits;
+		$[13] = minimumFractionDigits;
+		$[14] = useGrouping;
+		$[15] = t1;
+	} else t1 = $[15];
+	const formatValue = t1;
+	let t2;
+	if ($[16] !== copyable || $[17] !== formatValue || $[18] !== value) {
+		t2 = /* @__PURE__ */ jsx(DisplayValue, {
+			value,
+			formatValue,
+			copyable
+		});
+		$[16] = copyable;
+		$[17] = formatValue;
+		$[18] = value;
+		$[19] = t2;
+	} else t2 = $[19];
+	let t3;
+	if ($[20] !== icon || $[21] !== justifyContent || $[22] !== rest || $[23] !== t2 || $[24] !== tooltip) {
+		t3 = /* @__PURE__ */ jsx(TableCellContent, {
+			icon,
+			tooltip,
+			justifyContent,
+			...rest,
+			children: t2
+		});
+		$[20] = icon;
+		$[21] = justifyContent;
+		$[22] = rest;
+		$[23] = t2;
+		$[24] = tooltip;
+		$[25] = t3;
+	} else t3 = $[25];
+	return t3;
 };
 
 //#endregion
 //#region src/components/table/cells/text-cell.tsx
 const TextCell = (props) => {
-	const { value, formatValue, copyable, icon, tooltip, justifyContent = "flex-start", ...rest } = props;
-	return <TableCellContent icon={icon} tooltip={tooltip} justifyContent={justifyContent} {...rest}>
-      <DisplayValue value={value} formatValue={formatValue} copyable={copyable} />
-    </TableCellContent>;
+	const $ = c(18);
+	let copyable;
+	let formatValue;
+	let icon;
+	let rest;
+	let t0;
+	let tooltip;
+	let value;
+	if ($[0] !== props) {
+		({value, formatValue, copyable, icon, tooltip, justifyContent: t0, ...rest} = props);
+		$[0] = props;
+		$[1] = copyable;
+		$[2] = formatValue;
+		$[3] = icon;
+		$[4] = rest;
+		$[5] = t0;
+		$[6] = tooltip;
+		$[7] = value;
+	} else {
+		copyable = $[1];
+		formatValue = $[2];
+		icon = $[3];
+		rest = $[4];
+		t0 = $[5];
+		tooltip = $[6];
+		value = $[7];
+	}
+	const justifyContent = t0 === void 0 ? "flex-start" : t0;
+	let t1;
+	if ($[8] !== copyable || $[9] !== formatValue || $[10] !== value) {
+		t1 = /* @__PURE__ */ jsx(DisplayValue, {
+			value,
+			formatValue,
+			copyable
+		});
+		$[8] = copyable;
+		$[9] = formatValue;
+		$[10] = value;
+		$[11] = t1;
+	} else t1 = $[11];
+	let t2;
+	if ($[12] !== icon || $[13] !== justifyContent || $[14] !== rest || $[15] !== t1 || $[16] !== tooltip) {
+		t2 = /* @__PURE__ */ jsx(TableCellContent, {
+			icon,
+			tooltip,
+			justifyContent,
+			...rest,
+			children: t1
+		});
+		$[12] = icon;
+		$[13] = justifyContent;
+		$[14] = rest;
+		$[15] = t1;
+		$[16] = tooltip;
+		$[17] = t2;
+	} else t2 = $[17];
+	return t2;
 };
 
 //#endregion
@@ -102,34 +423,81 @@ const Row = withContext(ark.tr, "row");
 //#endregion
 //#region src/components/table/use-virtualized-table-height.ts
 const SCROLL_THRESHOLD = .95;
-const useVirtualizedTableHeight = ({ virtualSize, tableRef, scrollRef }) => {
+const useVirtualizedTableHeight = (t0) => {
+	const $ = c(17);
+	const { virtualSize, tableRef, scrollRef } = t0;
 	const [isScrollNearBottom, setIsScrollNearBottom] = useState(false);
-	const handlePseudoResize = useCallback(() => {
-		return adjustTableHeight(tableRef, virtualSize);
-	}, [tableRef, virtualSize]);
-	const handleScroll = useCallback(() => {
-		if (scrollRef.current) {
-			const scrollPosition = scrollRef.current.scrollTop;
-			const visibleHeight = scrollRef.current.clientHeight;
-			setIsScrollNearBottom(scrollPosition > virtualSize * SCROLL_THRESHOLD - visibleHeight);
-		}
-	}, [scrollRef, virtualSize]);
-	useEffect(() => {
-		const scrollable = scrollRef.current;
-		if (scrollable) scrollable.addEventListener("scroll", handleScroll);
-		handlePseudoResize();
-		return () => {
-			if (scrollable) scrollable.removeEventListener("scroll", handleScroll);
+	let t1;
+	if ($[0] !== tableRef || $[1] !== virtualSize) {
+		t1 = () => adjustTableHeight(tableRef, virtualSize);
+		$[0] = tableRef;
+		$[1] = virtualSize;
+		$[2] = t1;
+	} else t1 = $[2];
+	const handlePseudoResize = t1;
+	let t2;
+	if ($[3] !== scrollRef || $[4] !== virtualSize) {
+		t2 = () => {
+			if (scrollRef.current) {
+				const scrollPosition = scrollRef.current.scrollTop;
+				const visibleHeight = scrollRef.current.clientHeight;
+				setIsScrollNearBottom(scrollPosition > virtualSize * SCROLL_THRESHOLD - visibleHeight);
+			}
+		};
+		$[3] = scrollRef;
+		$[4] = virtualSize;
+		$[5] = t2;
+	} else t2 = $[5];
+	const handleScroll = t2;
+	let t3;
+	let t4;
+	if ($[6] !== handlePseudoResize || $[7] !== handleScroll || $[8] !== scrollRef) {
+		t3 = () => {
+			const scrollable = scrollRef.current;
+			if (scrollable) scrollable.addEventListener("scroll", handleScroll);
+			handlePseudoResize();
+			return () => {
+				if (scrollable) scrollable.removeEventListener("scroll", handleScroll);
+			};
+		};
+		t4 = [
+			scrollRef,
+			handleScroll,
+			handlePseudoResize
+		];
+		$[6] = handlePseudoResize;
+		$[7] = handleScroll;
+		$[8] = scrollRef;
+		$[9] = t3;
+		$[10] = t4;
+	} else {
+		t3 = $[9];
+		t4 = $[10];
+	}
+	useEffect(t3, t4);
+	let t5;
+	let t6;
+	if ($[11] !== handlePseudoResize || $[12] !== isScrollNearBottom) {
+		t5 = () => {
+			if (isScrollNearBottom) handlePseudoResize();
 		};
-	}, [
-		scrollRef,
-		handleScroll,
-		handlePseudoResize
-	]);
-	useEffect(() => {
-		if (isScrollNearBottom) handlePseudoResize();
-	}, [isScrollNearBottom, handlePseudoResize]);
-	return { isScrollNearBottom };
+		t6 = [isScrollNearBottom, handlePseudoResize];
+		$[11] = handlePseudoResize;
+		$[12] = isScrollNearBottom;
+		$[13] = t5;
+		$[14] = t6;
+	} else {
+		t5 = $[13];
+		t6 = $[14];
+	}
+	useEffect(t5, t6);
+	let t7;
+	if ($[15] !== isScrollNearBottom) {
+		t7 = { isScrollNearBottom };
+		$[15] = isScrollNearBottom;
+		$[16] = t7;
+	} else t7 = $[16];
+	return t7;
 };
 const adjustTableHeight = (tableRef, virtualHeight) => {
 	if (!tableRef.current) return;

package/dist/components/tags-input/index.d.ts

@@ -2,8 +2,8 @@ import * as react from "react";
 import { ComponentProps } from "react";
 import * as _pyck_styled_system_jsx0 from "@pyck/styled-system/jsx";
 import * as _pyck_styled_system_recipes0 from "@pyck/styled-system/recipes";
-import { TagsInput, TagsInputContext as Context } from "@ark-ui/react/tags-input";
 import * as react_jsx_runtime0 from "react/jsx-runtime";
+import { TagsInput, TagsInputContext as Context } from "@ark-ui/react/tags-input";
 
 //#region src/components/tags-input/tags-input.d.ts
 declare namespace tags_input_d_exports {

package/dist/components/tags-input/index.js

@@ -1,7 +1,9 @@
 import { t as __exportAll } from "../../chunk-BYypO7fO.js";
+import { c } from "react/compiler-runtime";
 import { createStyleContext } from "@pyck/styled-system/jsx";
 import { tagsInput } from "@pyck/styled-system/recipes";
 import { XIcon } from "lucide-react";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { TagsInput, TagsInputContext as Context, useTagsInputContext } from "@ark-ui/react/tags-input";
 
 //#region src/components/tags-input/tags-input.tsx
@@ -24,24 +26,38 @@ var tags_input_exports = /* @__PURE__ */ __exportAll({
 const { withProvider, withContext } = createStyleContext(tagsInput);
 const Root = withProvider(TagsInput.Root, "root");
 const RootProvider = withProvider(TagsInput.RootProvider, "root");
-const ClearTrigger = withContext(TagsInput.ClearTrigger, "clearTrigger", { defaultProps: { children: <XIcon /> } });
+const ClearTrigger = withContext(TagsInput.ClearTrigger, "clearTrigger", { defaultProps: { children: /* @__PURE__ */ jsx(XIcon, {}) } });
 const Control = withContext(TagsInput.Control, "control");
 const HiddenInput = TagsInput.HiddenInput;
 const Input = withContext(TagsInput.Input, "input");
 const Item = withContext(TagsInput.Item, "item");
-const ItemDeleteTrigger = withContext(TagsInput.ItemDeleteTrigger, "itemDeleteTrigger", { defaultProps: { children: <XIcon /> } });
+const ItemDeleteTrigger = withContext(TagsInput.ItemDeleteTrigger, "itemDeleteTrigger", { defaultProps: { children: /* @__PURE__ */ jsx(XIcon, {}) } });
 const ItemInput = withContext(TagsInput.ItemInput, "itemInput");
 const ItemPreview = withContext(TagsInput.ItemPreview, "itemPreview");
 const ItemText = withContext(TagsInput.ItemText, "itemText");
 const Label = withContext(TagsInput.Label, "label");
 const Items = (props) => {
-	return useTagsInputContext().value.map((item, index) => <Item key={item} index={index} value={item} {...props}>
-      <ItemPreview>
-        <ItemText>{item}</ItemText>
-        <ItemDeleteTrigger />
-      </ItemPreview>
-      <ItemInput />
-    </Item>);
+	const $ = c(5);
+	const context = useTagsInputContext();
+	let t0;
+	if ($[0] !== context.value || $[1] !== props) {
+		let t1;
+		if ($[3] !== props) {
+			t1 = (item, index) => /* @__PURE__ */ jsxs(Item, {
+				index,
+				value: item,
+				...props,
+				children: [/* @__PURE__ */ jsxs(ItemPreview, { children: [/* @__PURE__ */ jsx(ItemText, { children: item }), /* @__PURE__ */ jsx(ItemDeleteTrigger, {})] }), /* @__PURE__ */ jsx(ItemInput, {})]
+			}, item);
+			$[3] = props;
+			$[4] = t1;
+		} else t1 = $[4];
+		t0 = context.value.map(t1);
+		$[0] = context.value;
+		$[1] = props;
+		$[2] = t0;
+	} else t0 = $[2];
+	return t0;
 };
 
 //#endregion

package/dist/components/textarea/index.d.ts

@@ -1,12 +1,12 @@
 import * as react from "react";
 import { ComponentProps } from "react";
 import * as _pyck_styled_system_recipes0 from "@pyck/styled-system/recipes";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
 import { FieldProps } from "@pyck/react/field";
 import { FieldPath, FieldValues } from "react-hook-form";
 import { Field as Field$1 } from "@ark-ui/react/field";
 import { TextareaProps as TextareaProps$1 } from "@pyck/react/textarea";
 import * as _pyck_styled_system_types0 from "@pyck/styled-system/types";
-import * as react_jsx_runtime0 from "react/jsx-runtime";
 
 //#region src/components/textarea/textarea.d.ts
 type TextareaProps = ComponentProps<typeof Textarea>;