@contractspec/lib.ui-kit 1.57.0 → 1.59.0

package/dist/browser/ui/toggle-group.js

@@ -0,0 +1,150 @@
+// 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 { 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/toggle.tsx
+import * as TogglePrimitive from "@rn-primitives/toggle";
+import { cva } from "class-variance-authority";
+import * as React2 from "react";
+import { cn as cn2 } from "@contractspec/lib.ui-kit-core/utils";
+import { jsxDEV as jsxDEV2 } from "react/jsx-dev-runtime";
+var toggleVariants = cva("web:group web:inline-flex items-center justify-center rounded-md web:ring-offset-background web:transition-colors web:hover:bg-muted active:bg-muted web:focus-visible:outline-hidden web:focus-visible:ring-2 web:focus-visible:ring-ring web:focus-visible:ring-offset-2", {
+  variants: {
+    variant: {
+      default: "bg-transparent",
+      outline: "border border-input bg-transparent web:hover:bg-accent active:bg-accent active:bg-accent"
+    },
+    size: {
+      default: "h-10 px-3 native:h-12 native:px-[12]",
+      sm: "h-9 px-2.5 native:h-10 native:px-[9]",
+      lg: "h-11 px-5 native:h-14 native:px-6"
+    }
+  },
+  defaultVariants: {
+    variant: "default",
+    size: "default"
+  }
+});
+var toggleTextVariants = cva("text-sm native:text-base text-foreground font-medium", {
+  variants: {
+    variant: {
+      default: "",
+      outline: "web:group-hover:text-accent-foreground web:group-active:text-accent-foreground"
+    },
+    size: {
+      default: "",
+      sm: "",
+      lg: ""
+    }
+  },
+  defaultVariants: {
+    variant: "default",
+    size: "default"
+  }
+});
+function Toggle({
+  className,
+  variant,
+  size,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxDEV2(TextClassContext.Provider, {
+    value: cn2(toggleTextVariants({ variant, size }), props.pressed ? "text-accent-foreground" : "web:group-hover:text-muted-foreground", className),
+    children: /* @__PURE__ */ jsxDEV2(TogglePrimitive.Root, {
+      className: cn2(toggleVariants({ variant, size }), props.disabled && "web:pointer-events-none opacity-50", props.pressed && "bg-accent", className),
+      ...props
+    }, undefined, false, undefined, this)
+  }, undefined, false, undefined, this);
+}
+function ToggleIcon({
+  className,
+  icon: Icon,
+  ...props
+}) {
+  const textClass = React2.useContext(TextClassContext);
+  return /* @__PURE__ */ jsxDEV2(Icon, {
+    className: cn2(textClass, className),
+    ...props
+  }, undefined, false, undefined, this);
+}
+// ui/toggle-group.tsx
+import * as React3 from "react";
+import * as ToggleGroupPrimitive from "@rn-primitives/toggle-group";
+import { cn as cn3 } from "@contractspec/lib.ui-kit-core/utils";
+import { jsxDEV as jsxDEV3 } from "react/jsx-dev-runtime";
+var ToggleGroupContext = React3.createContext(null);
+function ToggleGroup({
+  className,
+  variant,
+  size,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxDEV3(ToggleGroupPrimitive.Root, {
+    className: cn3("flex flex-row items-center justify-center gap-1", className),
+    ...props,
+    children: /* @__PURE__ */ jsxDEV3(ToggleGroupContext.Provider, {
+      value: { variant, size },
+      children
+    }, undefined, false, undefined, this)
+  }, undefined, false, undefined, this);
+}
+function useToggleGroupContext() {
+  const context = React3.useContext(ToggleGroupContext);
+  if (context === null) {
+    throw new Error("ToggleGroup compound components cannot be rendered outside the ToggleGroup component");
+  }
+  return context;
+}
+function ToggleGroupItem({
+  className,
+  children,
+  variant,
+  size,
+  ...props
+}) {
+  const context = useToggleGroupContext();
+  const { value } = ToggleGroupPrimitive.useRootContext();
+  return /* @__PURE__ */ jsxDEV3(TextClassContext.Provider, {
+    value: cn3(toggleTextVariants({ variant, size }), ToggleGroupPrimitive.utils.getIsSelected(value, props.value) ? "text-accent-foreground" : "web:group-hover:text-muted-foreground"),
+    children: /* @__PURE__ */ jsxDEV3(ToggleGroupPrimitive.Item, {
+      className: cn3(toggleVariants({
+        variant: context.variant || variant,
+        size: context.size || size
+      }), props.disabled && "web:pointer-events-none opacity-50", ToggleGroupPrimitive.utils.getIsSelected(value, props.value) && "bg-accent", className),
+      ...props,
+      children
+    }, undefined, false, undefined, this)
+  }, undefined, false, undefined, this);
+}
+function ToggleGroupIcon({
+  className,
+  icon: Icon,
+  ...props
+}) {
+  const textClass = React3.useContext(TextClassContext);
+  return /* @__PURE__ */ jsxDEV3(Icon, {
+    className: cn3(textClass, className),
+    ...props
+  }, undefined, false, undefined, this);
+}
+export {
+  ToggleGroupItem,
+  ToggleGroupIcon,
+  ToggleGroup
+};

package/dist/browser/ui/toggle.js

@@ -0,0 +1,90 @@
+// 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 { 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/toggle.tsx
+import * as TogglePrimitive from "@rn-primitives/toggle";
+import { cva } from "class-variance-authority";
+import * as React2 from "react";
+import { cn as cn2 } from "@contractspec/lib.ui-kit-core/utils";
+import { jsxDEV as jsxDEV2 } from "react/jsx-dev-runtime";
+var toggleVariants = cva("web:group web:inline-flex items-center justify-center rounded-md web:ring-offset-background web:transition-colors web:hover:bg-muted active:bg-muted web:focus-visible:outline-hidden web:focus-visible:ring-2 web:focus-visible:ring-ring web:focus-visible:ring-offset-2", {
+  variants: {
+    variant: {
+      default: "bg-transparent",
+      outline: "border border-input bg-transparent web:hover:bg-accent active:bg-accent active:bg-accent"
+    },
+    size: {
+      default: "h-10 px-3 native:h-12 native:px-[12]",
+      sm: "h-9 px-2.5 native:h-10 native:px-[9]",
+      lg: "h-11 px-5 native:h-14 native:px-6"
+    }
+  },
+  defaultVariants: {
+    variant: "default",
+    size: "default"
+  }
+});
+var toggleTextVariants = cva("text-sm native:text-base text-foreground font-medium", {
+  variants: {
+    variant: {
+      default: "",
+      outline: "web:group-hover:text-accent-foreground web:group-active:text-accent-foreground"
+    },
+    size: {
+      default: "",
+      sm: "",
+      lg: ""
+    }
+  },
+  defaultVariants: {
+    variant: "default",
+    size: "default"
+  }
+});
+function Toggle({
+  className,
+  variant,
+  size,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxDEV2(TextClassContext.Provider, {
+    value: cn2(toggleTextVariants({ variant, size }), props.pressed ? "text-accent-foreground" : "web:group-hover:text-muted-foreground", className),
+    children: /* @__PURE__ */ jsxDEV2(TogglePrimitive.Root, {
+      className: cn2(toggleVariants({ variant, size }), props.disabled && "web:pointer-events-none opacity-50", props.pressed && "bg-accent", className),
+      ...props
+    }, undefined, false, undefined, this)
+  }, undefined, false, undefined, this);
+}
+function ToggleIcon({
+  className,
+  icon: Icon,
+  ...props
+}) {
+  const textClass = React2.useContext(TextClassContext);
+  return /* @__PURE__ */ jsxDEV2(Icon, {
+    className: cn2(textClass, className),
+    ...props
+  }, undefined, false, undefined, this);
+}
+export {
+  toggleVariants,
+  toggleTextVariants,
+  ToggleIcon,
+  Toggle
+};

package/dist/browser/ui/tooltip.js

@@ -0,0 +1,57 @@
+// 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 { 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/tooltip.tsx
+import * as TooltipPrimitive from "@rn-primitives/tooltip";
+import { Platform, StyleSheet } from "react-native";
+import Animated, { FadeIn, FadeOut } from "react-native-reanimated";
+import { cn as cn2 } from "@contractspec/lib.ui-kit-core/utils";
+import { jsxDEV as jsxDEV2 } from "react/jsx-dev-runtime";
+var Tooltip = TooltipPrimitive.Root;
+var TooltipTrigger = TooltipPrimitive.Trigger;
+function TooltipContent({
+  className,
+  sideOffset = 4,
+  portalHost,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxDEV2(TooltipPrimitive.Portal, {
+    hostName: portalHost,
+    children: /* @__PURE__ */ jsxDEV2(TooltipPrimitive.Overlay, {
+      style: Platform.OS !== "web" ? StyleSheet.absoluteFill : undefined,
+      children: /* @__PURE__ */ jsxDEV2(Animated.View, {
+        entering: Platform.select({ web: undefined, default: FadeIn }),
+        exiting: Platform.select({ web: undefined, default: FadeOut }),
+        children: /* @__PURE__ */ jsxDEV2(TextClassContext.Provider, {
+          value: "text-sm native:text-base text-popover-foreground",
+          children: /* @__PURE__ */ jsxDEV2(TooltipPrimitive.Content, {
+            sideOffset,
+            className: cn2("border-border bg-popover shadow-foreground/5 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 web:animate-in web:fade-in-0 web:zoom-in-95 z-50 overflow-hidden rounded-md border px-3 py-1.5 shadow-md", className),
+            ...props
+          }, undefined, false, undefined, this)
+        }, undefined, false, undefined, this)
+      }, undefined, false, undefined, this)
+    }, undefined, false, undefined, this)
+  }, undefined, false, undefined, this);
+}
+export {
+  TooltipTrigger,
+  TooltipContent,
+  Tooltip
+};

package/dist/browser/ui/typography.js

@@ -0,0 +1,124 @@
+// 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 { 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/typography.tsx
+import * as Slot2 from "@rn-primitives/slot";
+import { Platform } from "react-native";
+import { cn as cn2 } from "@contractspec/lib.ui-kit-core/utils";
+import { jsxDEV as jsxDEV2 } from "react/jsx-dev-runtime";
+function H1({ className, asChild = false, ...props }) {
+  const Component = asChild ? Slot2.Text : Text2;
+  return /* @__PURE__ */ jsxDEV2(Component, {
+    role: "heading",
+    "aria-level": "1",
+    className: cn2("text-foreground web:select-text web:scroll-m-20 text-4xl font-extrabold tracking-tight lg:text-5xl", className),
+    ...props
+  }, undefined, false, undefined, this);
+}
+function H2({ className, asChild = false, ...props }) {
+  const Component = asChild ? Slot2.Text : Text2;
+  return /* @__PURE__ */ jsxDEV2(Component, {
+    role: "heading",
+    "aria-level": "2",
+    className: cn2("border-border text-foreground web:select-text web:scroll-m-20 border-b pb-2 text-3xl font-semibold tracking-tight first:mt-0", className),
+    ...props
+  }, undefined, false, undefined, this);
+}
+function H3({ className, asChild = false, ...props }) {
+  const Component = asChild ? Slot2.Text : Text2;
+  return /* @__PURE__ */ jsxDEV2(Component, {
+    role: "heading",
+    "aria-level": "3",
+    className: cn2("text-foreground web:select-text web:scroll-m-20 text-2xl font-semibold tracking-tight", className),
+    ...props
+  }, undefined, false, undefined, this);
+}
+function H4({ className, asChild = false, ...props }) {
+  const Component = asChild ? Slot2.Text : Text2;
+  return /* @__PURE__ */ jsxDEV2(Component, {
+    role: "heading",
+    "aria-level": "4",
+    className: cn2("text-foreground web:select-text web:scroll-m-20 text-xl font-semibold tracking-tight", className),
+    ...props
+  }, undefined, false, undefined, this);
+}
+function P({ className, asChild = false, ...props }) {
+  const Component = asChild ? Slot2.Text : Text2;
+  return /* @__PURE__ */ jsxDEV2(Component, {
+    className: cn2("text-foreground web:select-text text-base", className),
+    ...props
+  }, undefined, false, undefined, this);
+}
+function BlockQuote({ className, asChild = false, ...props }) {
+  const Component = asChild ? Slot2.Text : Text2;
+  return /* @__PURE__ */ jsxDEV2(Component, {
+    role: Platform.OS === "web" ? "blockquote" : undefined,
+    className: cn2("native:mt-4 native:pl-3 border-border text-foreground web:select-text mt-6 border-l-2 pl-6 text-base italic", className),
+    ...props
+  }, undefined, false, undefined, this);
+}
+function Code({ className, asChild = false, ...props }) {
+  const Component = asChild ? Slot2.Text : Text2;
+  return /* @__PURE__ */ jsxDEV2(Component, {
+    role: Platform.OS === "web" ? "code" : undefined,
+    className: cn2("bg-muted text-foreground web:select-text relative rounded-md px-[0.3rem] py-[0.2rem] text-sm font-semibold", className),
+    ...props
+  }, undefined, false, undefined, this);
+}
+function Lead({ className, asChild = false, ...props }) {
+  const Component = asChild ? Slot2.Text : Text2;
+  return /* @__PURE__ */ jsxDEV2(Component, {
+    className: cn2("text-muted-foreground web:select-text text-xl", className),
+    ...props
+  }, undefined, false, undefined, this);
+}
+function Large({ className, asChild = false, ...props }) {
+  const Component = asChild ? Slot2.Text : Text2;
+  return /* @__PURE__ */ jsxDEV2(Component, {
+    className: cn2("text-foreground web:select-text text-xl font-semibold", className),
+    ...props
+  }, undefined, false, undefined, this);
+}
+function Small({ className, asChild = false, ...props }) {
+  const Component = asChild ? Slot2.Text : Text2;
+  return /* @__PURE__ */ jsxDEV2(Component, {
+    className: cn2("text-foreground web:select-text text-sm leading-none font-medium", className),
+    ...props
+  }, undefined, false, undefined, this);
+}
+function Muted({ className, asChild = false, ...props }) {
+  const Component = asChild ? Slot2.Text : Text2;
+  return /* @__PURE__ */ jsxDEV2(Component, {
+    className: cn2("text-muted-foreground web:select-text text-sm", className),
+    ...props
+  }, undefined, false, undefined, this);
+}
+export {
+  Small,
+  P,
+  Muted,
+  Lead,
+  Large,
+  H4,
+  H3,
+  H2,
+  H1,
+  Code,
+  BlockQuote
+};

package/dist/browser/ui/useColorScheme.js

@@ -0,0 +1,15 @@
+// ui/useColorScheme.tsx
+import { useColorScheme as useNativewindColorScheme } from "nativewind";
+var DEFAULT_COLOR_SCHEME = "light";
+function useColorScheme() {
+  const { colorScheme, setColorScheme, toggleColorScheme } = useNativewindColorScheme();
+  return {
+    colorScheme: colorScheme ?? DEFAULT_COLOR_SCHEME,
+    isDarkColorScheme: colorScheme === "dark",
+    setColorScheme,
+    toggleColorScheme
+  };
+}
+export {
+  useColorScheme
+};

package/dist/browser/ui/useListState.js

@@ -0,0 +1,68 @@
+// ui/useListState.tsx
+import { useCallback, useMemo, useState } from "react";
+var useListState = ({
+  initialSearch = "",
+  initialFilters = {},
+  initialPage = 1,
+  initialItemsPerPage = 25
+} = {}) => {
+  const [searchQuery, setSearchQuery] = useState(initialSearch);
+  const [filters, setFilters] = useState(initialFilters);
+  const [currentPage, setCurrentPage] = useState(initialPage);
+  const [itemsPerPage, setItemsPerPage] = useState(initialItemsPerPage);
+  const setFilter = useCallback((key, value) => {
+    setFilters((prev) => ({
+      ...prev,
+      [key]: value
+    }));
+    setCurrentPage(1);
+  }, []);
+  const clearFilters = useCallback(() => {
+    setFilters({});
+    setCurrentPage(1);
+  }, []);
+  const handleSetSearchQuery = useCallback((query) => {
+    setSearchQuery(query);
+    setCurrentPage(1);
+  }, []);
+  const handleSetItemsPerPage = useCallback((newItemsPerPage) => {
+    setItemsPerPage(newItemsPerPage);
+    setCurrentPage(1);
+  }, []);
+  const resetAll = useCallback(() => {
+    setSearchQuery(initialSearch);
+    setFilters(initialFilters);
+    setCurrentPage(initialPage);
+    setItemsPerPage(initialItemsPerPage);
+  }, [initialSearch, initialFilters, initialPage, initialItemsPerPage]);
+  const queryParams = useMemo(() => {
+    const baseParams = {
+      search: searchQuery,
+      page: currentPage,
+      limit: itemsPerPage
+    };
+    const filterParams = {};
+    Object.entries(filters).forEach(([key, value]) => {
+      if (value) {
+        filterParams[key] = value;
+      }
+    });
+    return { ...baseParams, ...filterParams };
+  }, [searchQuery, filters, currentPage, itemsPerPage]);
+  return {
+    searchQuery,
+    setSearchQuery: handleSetSearchQuery,
+    filters,
+    setFilter,
+    clearFilters,
+    currentPage,
+    itemsPerPage,
+    setCurrentPage,
+    setItemsPerPage: handleSetItemsPerPage,
+    queryParams,
+    resetAll
+  };
+};
+export {
+  useListState
+};