@contractspec/lib.ui-kit-web 1.56.1 → 1.58.0

package/dist/ui/usecases/index.js

@@ -1,4 +1,262 @@
-import { UseCaseCard } from "./UseCaseCard.js";
-import { UserStoryCard } from "./UserStoryCard.js";
+// @bun
+var __require = import.meta.require;
 
-export { UseCaseCard, UserStoryCard };
+// ui/button.tsx
+import * as React from "react";
+import { Slot } from "@radix-ui/react-slot";
+import { cva } from "class-variance-authority";
+import { cn } from "@contractspec/lib.ui-kit-core/utils";
+import { jsxDEV } from "react/jsx-dev-runtime";
+var buttonVariants = cva("inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-hidden focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive", {
+  variants: {
+    variant: {
+      default: "bg-primary text-primary-foreground hover:bg-primary/90",
+      destructive: "bg-destructive text-white hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
+      outline: "border bg-background shadow-2xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
+      secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
+      ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
+      link: "text-primary underline-offset-4 hover:underline"
+    },
+    size: {
+      default: "h-9 px-4 py-2 has-[>svg]:px-3",
+      sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
+      lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
+      icon: "size-9"
+    }
+  },
+  defaultVariants: {
+    variant: "default",
+    size: "default"
+  }
+});
+var Button = React.forwardRef(({ className, variant, size, asChild = false, ...props }, ref) => {
+  if (asChild) {
+    return /* @__PURE__ */ jsxDEV(Slot, {
+      "data-slot": "button",
+      className: cn(buttonVariants({ variant, size, className })),
+      ...props
+    }, undefined, false, undefined, this);
+  }
+  return /* @__PURE__ */ jsxDEV("button", {
+    ref,
+    "data-slot": "button",
+    className: cn(buttonVariants({ variant, size, className })),
+    ...props
+  }, undefined, false, undefined, this);
+});
+Button.displayName = "Button";
+// ui/stack.tsx
+import * as React2 from "react";
+import { cva as cva2 } from "class-variance-authority";
+import { cn as cn2 } from "@contractspec/lib.ui-kit-core/utils";
+import { jsxDEV as jsxDEV2 } from "react/jsx-dev-runtime";
+var vStackVariants = cva2("flex flex-col", {
+  variants: {
+    gap: {
+      none: "gap-0",
+      xs: "gap-1",
+      sm: "gap-2",
+      md: "gap-3",
+      lg: "gap-4",
+      xl: "gap-6",
+      "2xl": "gap-8"
+    },
+    align: {
+      start: "items-start",
+      center: "items-center",
+      end: "items-end",
+      stretch: "items-stretch"
+    },
+    justify: {
+      start: "justify-start",
+      center: "justify-center",
+      end: "justify-end",
+      between: "justify-between",
+      around: "justify-around",
+      evenly: "justify-evenly"
+    }
+  },
+  defaultVariants: {
+    gap: "md",
+    align: "stretch",
+    justify: "start"
+  }
+});
+var VStack = React2.forwardRef(({ className, gap, align, justify, as = "div", ...props }, ref) => {
+  const Comp = as;
+  return /* @__PURE__ */ jsxDEV2(Comp, {
+    ref,
+    className: cn2(vStackVariants({ gap, align, justify }), className),
+    ...props
+  }, undefined, false, undefined, this);
+});
+VStack.displayName = "VStack";
+var hStackVariants = cva2("flex flex-row", {
+  variants: {
+    gap: {
+      none: "gap-0",
+      xs: "gap-1",
+      sm: "gap-2",
+      md: "gap-3",
+      lg: "gap-4",
+      xl: "gap-6",
+      "2xl": "gap-8"
+    },
+    align: {
+      start: "items-start",
+      center: "items-center",
+      end: "items-end",
+      stretch: "items-stretch",
+      baseline: "items-baseline"
+    },
+    justify: {
+      start: "justify-start",
+      center: "justify-center",
+      end: "justify-end",
+      between: "justify-between",
+      around: "justify-around",
+      evenly: "justify-evenly"
+    },
+    wrap: {
+      nowrap: "flex-nowrap",
+      wrap: "flex-wrap",
+      wrapReverse: "flex-wrap-reverse"
+    }
+  },
+  defaultVariants: {
+    gap: "md",
+    align: "center",
+    justify: "start",
+    wrap: "wrap"
+  }
+});
+var HStack = React2.forwardRef(({ className, gap, align, justify, wrap, as = "div", ...props }, ref) => {
+  const Comp = as;
+  return /* @__PURE__ */ jsxDEV2(Comp, {
+    ref,
+    className: cn2(hStackVariants({ gap, align, justify, wrap }), className),
+    ...props
+  }, undefined, false, undefined, this);
+});
+HStack.displayName = "HStack";
+var boxVariants = cva2("flex flex-row", {
+  variants: {
+    gap: {
+      none: "gap-0",
+      xs: "gap-1",
+      sm: "gap-2",
+      md: "gap-3",
+      lg: "gap-4",
+      xl: "gap-6",
+      "2xl": "gap-8"
+    },
+    align: {
+      start: "items-start",
+      center: "items-center",
+      end: "items-end",
+      stretch: "items-stretch",
+      baseline: "items-baseline"
+    },
+    justify: {
+      start: "justify-start",
+      center: "justify-center",
+      end: "justify-end",
+      between: "justify-between",
+      around: "justify-around",
+      evenly: "justify-evenly"
+    },
+    wrap: {
+      nowrap: "flex-nowrap",
+      wrap: "flex-wrap",
+      wrapReverse: "flex-wrap-reverse"
+    }
+  },
+  defaultVariants: {
+    gap: "md",
+    align: "center",
+    justify: "center",
+    wrap: "nowrap"
+  }
+});
+var Box = React2.forwardRef(({ className, gap, align, justify, wrap, as = "div", ...props }, ref) => {
+  const Comp = as;
+  return /* @__PURE__ */ jsxDEV2(Comp, {
+    ref,
+    className: cn2(boxVariants({ gap, align, justify, wrap }), className),
+    ...props
+  }, undefined, false, undefined, this);
+});
+Box.displayName = "Box";
+// ui/usecases/UseCaseCard.tsx
+import { jsxDEV as jsxDEV3 } from "react/jsx-dev-runtime";
+function UseCaseCard({
+  title,
+  summary,
+  ctaHref,
+  ctaLabel = "Learn more",
+  onCtaClick
+}) {
+  return /* @__PURE__ */ jsxDEV3(VStack, {
+    className: "rounded-lg border p-4",
+    gap: "sm",
+    children: [
+      /* @__PURE__ */ jsxDEV3("div", {
+        className: "text-lg font-semibold",
+        children: title
+      }, undefined, false, undefined, this),
+      summary && /* @__PURE__ */ jsxDEV3("div", {
+        className: "text-muted-foreground text-base",
+        children: summary
+      }, undefined, false, undefined, this),
+      ctaHref && /* @__PURE__ */ jsxDEV3(HStack, {
+        children: /* @__PURE__ */ jsxDEV3("a", {
+          href: ctaHref,
+          onClick: onCtaClick,
+          children: /* @__PURE__ */ jsxDEV3(Button, {
+            size: "sm",
+            variant: "outline",
+            children: ctaLabel
+          }, undefined, false, undefined, this)
+        }, undefined, false, undefined, this)
+      }, undefined, false, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+}
+
+// ui/usecases/UserStoryCard.tsx
+import { jsxDEV as jsxDEV4 } from "react/jsx-dev-runtime";
+function UserStoryCard({
+  title,
+  body,
+  outcome
+}) {
+  return /* @__PURE__ */ jsxDEV4(VStack, {
+    className: "rounded-lg border p-4",
+    gap: "sm",
+    children: [
+      /* @__PURE__ */ jsxDEV4("div", {
+        className: "text-lg font-semibold",
+        children: title
+      }, undefined, false, undefined, this),
+      body && /* @__PURE__ */ jsxDEV4("div", {
+        className: "text-muted-foreground text-base",
+        children: body
+      }, undefined, false, undefined, this),
+      outcome && /* @__PURE__ */ jsxDEV4("div", {
+        className: "text-base",
+        children: [
+          /* @__PURE__ */ jsxDEV4("span", {
+            className: "font-medium",
+            children: "Outcome:"
+          }, undefined, false, undefined, this),
+          " ",
+          outcome
+        ]
+      }, undefined, true, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+}
+export {
+  UserStoryCard,
+  UseCaseCard
+};

package/dist/ui/utils.d.ts

@@ -1,7 +1,3 @@
-import { ClassValue } from "clsx";
-
-//#region ui/utils.d.ts
-declare function cn(...inputs: ClassValue[]): string;
-//#endregion
-export { cn };
+import { type ClassValue } from 'clsx';
+export declare function cn(...inputs: ClassValue[]): string;
 //# sourceMappingURL=utils.d.ts.map

package/dist/ui/utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"utils.d.ts","names":[],"sources":["../../ui/utils.ts"],"sourcesContent":[],"mappings":";;;iBAGgB,EAAA,YAAc"}
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../ui/utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,UAAU,EAAQ,MAAM,MAAM,CAAC;AAG7C,wBAAgB,EAAE,CAAC,GAAG,MAAM,EAAE,UAAU,EAAE,UAEzC"}

package/dist/ui/utils.js

@@ -1,11 +1,12 @@
+// @bun
+var __require = import.meta.require;
+
+// ui/utils.ts
 import { clsx } from "clsx";
 import { twMerge } from "tailwind-merge";
-
-//#region ui/utils.ts
 function cn(...inputs) {
-	return twMerge(clsx(inputs));
+  return twMerge(clsx(inputs));
 }
-
-//#endregion
-export { cn };
-//# sourceMappingURL=utils.js.map
+export {
+  cn
+};

package/dist/ui/visually-hidden.d.ts

@@ -1,10 +1,7 @@
-import * as React$1 from "react";
-import { JSX } from "react";
-
-//#region ui/visually-hidden.d.ts
-declare const VisuallyHidden: React$1.ForwardRefExoticComponent<React$1.HTMLAttributes<HTMLElement> & {
-  as?: keyof JSX.IntrinsicElements;
-} & React$1.RefAttributes<HTMLElement>>;
-//#endregion
+import type { JSX } from 'react';
+import * as React from 'react';
+declare const VisuallyHidden: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLElement> & {
+    as?: keyof JSX.IntrinsicElements;
+} & React.RefAttributes<HTMLElement>>;
 export { VisuallyHidden };
 //# sourceMappingURL=visually-hidden.d.ts.map

package/dist/ui/visually-hidden.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"visually-hidden.d.ts","names":[],"sources":["../../ui/visually-hidden.tsx"],"sourcesContent":[],"mappings":";;;;cAmBM,gBAAc,OAAA,CAAA,0BAAA,OAAA,CAAA,eAAA;aAfP,GAAA,CAAI;AAHc,CAAA,wBA2B9B,YAAA,CAAA,CAAA"}
+{"version":3,"file":"visually-hidden.d.ts","sourceRoot":"","sources":["../../ui/visually-hidden.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAkB/B,QAAA,MAAM,cAAc;SAfb,MAAM,GAAG,CAAC,iBAAiB;qCAwBjC,CAAC;AAGF,OAAO,EAAE,cAAc,EAAE,CAAC"}

package/dist/ui/visually-hidden.js

@@ -1,31 +1,30 @@
-import * as React$1 from "react";
-import { jsx } from "react/jsx-runtime";
+// @bun
+var __require = import.meta.require;
 
-//#region ui/visually-hidden.tsx
-const srOnlyStyle = {
-	border: 0,
-	clip: "rect(0 0 0 0)",
-	height: "1px",
-	margin: "-1px",
-	overflow: "hidden",
-	padding: 0,
-	position: "absolute",
-	width: "1px",
-	whiteSpace: "nowrap"
+// ui/visually-hidden.tsx
+import * as React from "react";
+import { jsxDEV } from "react/jsx-dev-runtime";
+var srOnlyStyle = {
+  border: 0,
+  clip: "rect(0 0 0 0)",
+  height: "1px",
+  margin: "-1px",
+  overflow: "hidden",
+  padding: 0,
+  position: "absolute",
+  width: "1px",
+  whiteSpace: "nowrap"
 };
-const VisuallyHidden = React$1.forwardRef(({ as = "span", style, children, ...props }, ref) => {
-	return /* @__PURE__ */ jsx(as, {
-		ref,
-		style: {
-			...srOnlyStyle,
-			...style
-		},
-		...props,
-		children
-	});
+var VisuallyHidden = React.forwardRef(({ as = "span", style, children, ...props }, ref) => {
+  const Comp = as;
+  return /* @__PURE__ */ jsxDEV(Comp, {
+    ref,
+    style: { ...srOnlyStyle, ...style },
+    ...props,
+    children
+  }, undefined, false, undefined, this);
 });
 VisuallyHidden.displayName = "VisuallyHidden";
-
-//#endregion
-export { VisuallyHidden };
-//# sourceMappingURL=visually-hidden.js.map
+export {
+  VisuallyHidden
+};