@contractspec/lib.ui-kit 1.57.0 → 1.59.0

package/dist/ui/date-range-picker.js

@@ -1,86 +1,349 @@
-import { Text as Text$1 } from "./text.js";
-import { HStack, VStack } from "./stack.js";
-import React, { useMemo, useState } from "react";
-import { Platform, Pressable } from "react-native";
+// @bun
+// ui/text.tsx
+import * as Slot from "@rn-primitives/slot";
+import * as React from "react";
+import { Text as RNText } from "react-native";
 import { cn } from "@contractspec/lib.ui-kit-core/utils";
-import { jsx, jsxs } from "react/jsx-runtime";
+import { jsxDEV } from "react/jsx-dev-runtime";
+var TextClassContext = React.createContext(undefined);
+function Text2({
+  className,
+  asChild = false,
+  ...props
+}) {
+  const textClass = React.useContext(TextClassContext);
+  const Component = asChild ? Slot.Text : RNText;
+  return /* @__PURE__ */ jsxDEV(Component, {
+    className: cn("text-foreground web:select-text text-base", textClass, className),
+    ...props
+  }, undefined, false, undefined, this);
+}
+// ui/stack.tsx
+import { View } from "react-native";
+import { cn as cn2 } from "@contractspec/lib.ui-kit-core/utils";
+import { cva } from "class-variance-authority";
+import { jsxDEV as jsxDEV2 } from "react/jsx-dev-runtime";
+var baseStyle = "flex";
+var vStackVariants = cva([baseStyle, "flex-col"], {
+  variants: {
+    spacing: {
+      none: "",
+      xs: "gap-y-1",
+      sm: "gap-y-2",
+      md: "gap-y-4",
+      lg: "gap-y-6",
+      xl: "gap-y-8",
+      "2xl": "gap-y-12"
+    },
+    align: {
+      stretch: "items-stretch",
+      start: "items-start",
+      center: "items-center",
+      end: "items-end"
+    },
+    justify: {
+      start: "justify-start",
+      center: "justify-center",
+      end: "justify-end",
+      between: "justify-between",
+      around: "justify-around",
+      evenly: "justify-evenly"
+    },
+    width: {
+      auto: "w-auto",
+      full: "w-full",
+      screen: "w-screen",
+      fit: "w-fit"
+    },
+    padding: {
+      none: "",
+      xs: "p-1",
+      sm: "p-2",
+      md: "p-4",
+      lg: "p-6",
+      xl: "p-8"
+    },
+    gap: {
+      none: "",
+      xs: "gap-1",
+      sm: "gap-2",
+      md: "gap-4",
+      lg: "gap-6",
+      xl: "gap-8"
+    }
+  },
+  defaultVariants: {
+    spacing: "md",
+    align: "stretch",
+    justify: "start",
+    width: "auto",
+    padding: "none",
+    gap: "none"
+  }
+});
+var hStackVariants = cva([baseStyle, "flex-row"], {
+  variants: {
+    spacing: {
+      none: "",
+      xs: "gap-x-1",
+      sm: "gap-x-2",
+      md: "gap-x-4",
+      lg: "gap-x-6",
+      xl: "gap-x-8",
+      "2xl": "gap-x-12"
+    },
+    align: {
+      stretch: "items-stretch",
+      start: "items-start",
+      center: "items-center",
+      end: "items-end",
+      baseline: "items-baseline"
+    },
+    justify: {
+      start: "justify-start",
+      center: "justify-center",
+      end: "justify-end",
+      between: "justify-between",
+      around: "justify-around",
+      evenly: "justify-evenly"
+    },
+    width: {
+      auto: "w-auto",
+      full: "w-full",
+      screen: "w-screen",
+      fit: "w-fit"
+    },
+    padding: {
+      none: "",
+      xs: "p-1",
+      sm: "p-2",
+      md: "p-4",
+      lg: "p-6",
+      xl: "p-8"
+    },
+    gap: {
+      none: "",
+      xs: "gap-1",
+      sm: "gap-2",
+      md: "gap-4",
+      lg: "gap-6",
+      xl: "gap-8"
+    },
+    wrap: {
+      nowrap: "flex-nowrap",
+      wrap: "flex-wrap",
+      reverse: "flex-wrap-reverse"
+    }
+  },
+  defaultVariants: {
+    spacing: "md",
+    align: "center",
+    justify: "start",
+    width: "auto",
+    padding: "none",
+    gap: "none",
+    wrap: "wrap"
+  }
+});
+var boxVariants = cva([baseStyle, "flex-row"], {
+  variants: {
+    spacing: {
+      none: "",
+      xs: "gap-x-1",
+      sm: "gap-x-2",
+      md: "gap-x-4",
+      lg: "gap-x-6",
+      xl: "gap-x-8",
+      "2xl": "gap-x-12"
+    },
+    align: {
+      stretch: "items-stretch",
+      start: "items-start",
+      center: "items-center",
+      end: "items-end",
+      baseline: "items-baseline"
+    },
+    justify: {
+      start: "justify-start",
+      center: "justify-center",
+      end: "justify-end",
+      between: "justify-between",
+      around: "justify-around",
+      evenly: "justify-evenly"
+    },
+    width: {
+      auto: "w-auto",
+      full: "w-full",
+      screen: "w-screen",
+      fit: "w-fit"
+    },
+    padding: {
+      none: "",
+      xs: "p-1",
+      sm: "p-2",
+      md: "p-4",
+      lg: "p-6",
+      xl: "p-8"
+    },
+    gap: {
+      none: "",
+      xs: "gap-1",
+      sm: "gap-2",
+      md: "gap-4",
+      lg: "gap-6",
+      xl: "gap-8"
+    },
+    wrap: {
+      nowrap: "flex-nowrap",
+      wrap: "flex-wrap",
+      reverse: "flex-wrap-reverse"
+    }
+  },
+  defaultVariants: {
+    spacing: "md",
+    align: "center",
+    justify: "center",
+    width: "auto",
+    padding: "none",
+    gap: "none",
+    wrap: "wrap"
+  }
+});
+function Box({
+  className,
+  spacing,
+  align,
+  justify,
+  width,
+  padding,
+  gap,
+  wrap,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxDEV2(View, {
+    className: cn2(boxVariants({ spacing, align, justify, width, padding, gap, wrap }), className),
+    ...props
+  }, undefined, false, undefined, this);
+}
+function HStack({
+  className,
+  spacing,
+  align,
+  justify,
+  width,
+  padding,
+  gap,
+  wrap,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxDEV2(View, {
+    className: cn2(hStackVariants({ spacing, align, justify, width, padding, gap, wrap }), className),
+    ...props
+  }, undefined, false, undefined, this);
+}
+function VStack({
+  className,
+  spacing,
+  align,
+  justify,
+  width,
+  padding,
+  gap,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxDEV2(View, {
+    className: cn2(vStackVariants({ spacing, align, justify, width, padding, gap }), className),
+    ...props
+  }, undefined, false, undefined, this);
+}
+// ui/date-range-picker.tsx
+import { useMemo, useState } from "react";
+import { Platform, Pressable } from "react-native";
 import DateTimePicker from "@react-native-community/datetimepicker";
-
-//#region ui/date-range-picker.tsx
+import { cn as cn3 } from "@contractspec/lib.ui-kit-core/utils";
+import { jsxDEV as jsxDEV3 } from "react/jsx-dev-runtime";
 function fmt(d) {
-	if (!d) return "";
-	try {
-		return d.toLocaleDateString();
-	} catch {
-		return "";
-	}
+  if (!d)
+    return "";
+  try {
+    return d.toLocaleDateString();
+  } catch {
+    return "";
+  }
 }
-function DateRangePicker({ value, onChange, disabled, minDate, maxDate, placeholders, className }) {
-	const [showStart, setShowStart] = useState(false);
-	const [showEnd, setShowEnd] = useState(false);
-	const pickerCommon = useMemo(() => ({
-		minimumDate: minDate,
-		maximumDate: maxDate
-	}), [minDate, maxDate]);
-	const handleStart = (_, d) => {
-		if (Platform.OS !== "ios") setShowStart(false);
-		if (!d) return;
-		onChange({
-			start: d,
-			end: value.end && d > value.end ? d : value.end
-		});
-	};
-	const handleEnd = (_, d) => {
-		if (Platform.OS !== "ios") setShowEnd(false);
-		if (!d) return;
-		onChange({
-			start: value.start && d < value.start ? d : value.start,
-			end: d
-		});
-	};
-	return /* @__PURE__ */ jsxs(VStack, {
-		className: cn("w-full", className),
-		spacing: "sm",
-		children: [
-			/* @__PURE__ */ jsxs(HStack, {
-				gap: "sm",
-				children: [/* @__PURE__ */ jsx(Pressable, {
-					disabled,
-					onPress: () => setShowStart(true),
-					className: cn("border-input bg-background h-12 flex-1 flex-row items-center rounded-md border px-3", disabled && "opacity-50"),
-					children: /* @__PURE__ */ jsx(Text$1, {
-						className: cn("text-foreground text-base", !value.start && "opacity-50"),
-						children: value.start ? fmt(value.start) : placeholders?.start || "Start date"
-					})
-				}), /* @__PURE__ */ jsx(Pressable, {
-					disabled,
-					onPress: () => setShowEnd(true),
-					className: cn("border-input bg-background h-12 flex-1 flex-row items-center rounded-md border px-3", disabled && "opacity-50"),
-					children: /* @__PURE__ */ jsx(Text$1, {
-						className: cn("text-foreground text-base", !value.end && "opacity-50"),
-						children: value.end ? fmt(value.end) : placeholders?.end || "End date"
-					})
-				})]
-			}),
-			showStart && /* @__PURE__ */ jsx(DateTimePicker, {
-				value: value.start ?? /* @__PURE__ */ new Date(),
-				mode: "date",
-				display: Platform.OS === "ios" ? "inline" : "default",
-				onChange: handleStart,
-				...pickerCommon
-			}),
-			showEnd && /* @__PURE__ */ jsx(DateTimePicker, {
-				value: value.end ?? value.start ?? /* @__PURE__ */ new Date(),
-				mode: "date",
-				display: Platform.OS === "ios" ? "inline" : "default",
-				onChange: handleEnd,
-				minimumDate: value.start ?? minDate,
-				maximumDate: maxDate
-			})
-		]
-	});
+function DateRangePicker({
+  value,
+  onChange,
+  disabled,
+  minDate,
+  maxDate,
+  placeholders,
+  className
+}) {
+  const [showStart, setShowStart] = useState(false);
+  const [showEnd, setShowEnd] = useState(false);
+  const pickerCommon = useMemo(() => ({ minimumDate: minDate, maximumDate: maxDate }), [minDate, maxDate]);
+  const handleStart = (_, d) => {
+    if (Platform.OS !== "ios")
+      setShowStart(false);
+    if (!d)
+      return;
+    const end = value.end && d > value.end ? d : value.end;
+    onChange({ start: d, end });
+  };
+  const handleEnd = (_, d) => {
+    if (Platform.OS !== "ios")
+      setShowEnd(false);
+    if (!d)
+      return;
+    const start = value.start && d < value.start ? d : value.start;
+    onChange({ start, end: d });
+  };
+  return /* @__PURE__ */ jsxDEV3(VStack, {
+    className: cn3("w-full", className),
+    spacing: "sm",
+    children: [
+      /* @__PURE__ */ jsxDEV3(HStack, {
+        gap: "sm",
+        children: [
+          /* @__PURE__ */ jsxDEV3(Pressable, {
+            disabled,
+            onPress: () => setShowStart(true),
+            className: cn3("border-input bg-background h-12 flex-1 flex-row items-center rounded-md border px-3", disabled && "opacity-50"),
+            children: /* @__PURE__ */ jsxDEV3(Text2, {
+              className: cn3("text-foreground text-base", !value.start && "opacity-50"),
+              children: value.start ? fmt(value.start) : placeholders?.start || "Start date"
+            }, undefined, false, undefined, this)
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV3(Pressable, {
+            disabled,
+            onPress: () => setShowEnd(true),
+            className: cn3("border-input bg-background h-12 flex-1 flex-row items-center rounded-md border px-3", disabled && "opacity-50"),
+            children: /* @__PURE__ */ jsxDEV3(Text2, {
+              className: cn3("text-foreground text-base", !value.end && "opacity-50"),
+              children: value.end ? fmt(value.end) : placeholders?.end || "End date"
+            }, undefined, false, undefined, this)
+          }, undefined, false, undefined, this)
+        ]
+      }, undefined, true, undefined, this),
+      showStart && /* @__PURE__ */ jsxDEV3(DateTimePicker, {
+        value: value.start ?? new Date,
+        mode: "date",
+        display: Platform.OS === "ios" ? "inline" : "default",
+        onChange: handleStart,
+        ...pickerCommon
+      }, undefined, false, undefined, this),
+      showEnd && /* @__PURE__ */ jsxDEV3(DateTimePicker, {
+        value: value.end ?? value.start ?? new Date,
+        mode: "date",
+        display: Platform.OS === "ios" ? "inline" : "default",
+        onChange: handleEnd,
+        minimumDate: value.start ?? minDate,
+        maximumDate: maxDate
+      }, undefined, false, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
 }
-
-//#endregion
-export { DateRangePicker };
-//# sourceMappingURL=date-range-picker.js.map
+export {
+  DateRangePicker
+};

package/dist/ui/datetime-picker.d.ts

@@ -1,28 +1,13 @@
-import * as react_jsx_runtime0 from "react/jsx-runtime";
-
-//#region ui/datetime-picker.d.ts
-interface DateTimePickerProps {
-  value: Date | null;
-  onChange: (date: Date | null) => void;
-  disabled?: boolean;
-  minDate?: Date;
-  maxDate?: Date;
-  datePlaceholder?: string;
-  timePlaceholder?: string;
-  is24Hour?: boolean;
-  className?: string;
+export interface DateTimePickerProps {
+    value: Date | null;
+    onChange: (date: Date | null) => void;
+    disabled?: boolean;
+    minDate?: Date;
+    maxDate?: Date;
+    datePlaceholder?: string;
+    timePlaceholder?: string;
+    is24Hour?: boolean;
+    className?: string;
 }
-declare function DateTimePicker({
-  value,
-  onChange,
-  disabled,
-  minDate,
-  maxDate,
-  datePlaceholder,
-  timePlaceholder,
-  is24Hour,
-  className
-}: DateTimePickerProps): react_jsx_runtime0.JSX.Element;
-//#endregion
-export { DateTimePicker, DateTimePickerProps };
+export declare function DateTimePicker({ value, onChange, disabled, minDate, maxDate, datePlaceholder, timePlaceholder, is24Hour, className, }: DateTimePickerProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=datetime-picker.d.ts.map

package/dist/ui/datetime-picker.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"datetime-picker.d.ts","names":[],"sources":["../../ui/datetime-picker.tsx"],"mappings":";;;UAKiB,mBAAA;EACf,KAAA,EAAO,IAAA;EACP,QAAA,GAAW,IAAA,EAAM,IAAA;EACjB,QAAA;EACA,OAAA,GAAU,IAAA;EACV,OAAA,GAAU,IAAA;EACV,eAAA;EACA,eAAA;EACA,QAAA;EACA,SAAA;AAAA;AAAA,iBAGc,cAAA,CAAA;EACd,KAAA;EACA,QAAA;EACA,QAAA;EACA,OAAA;EACA,OAAA;EACA,eAAA;EACA,eAAA;EACA,QAAA;EACA;AAAA,GACC,mBAAA,GAAmB,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"datetime-picker.d.ts","sourceRoot":"","sources":["../../ui/datetime-picker.tsx"],"names":[],"mappings":"AAKA,MAAM,WAAW,mBAAmB;IAClC,KAAK,EAAE,IAAI,GAAG,IAAI,CAAC;IACnB,QAAQ,EAAE,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,KAAK,IAAI,CAAC;IACtC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,IAAI,CAAC;IACf,OAAO,CAAC,EAAE,IAAI,CAAC;IACf,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,cAAc,CAAC,EAC7B,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,OAAO,EACP,OAAO,EACP,eAAe,EACf,eAAe,EACf,QAAQ,EACR,SAAS,GACV,EAAE,mBAAmB,2CAsCrB"}