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

package/dist/ui/usecases/UseCaseCard.js

@@ -1,35 +1,227 @@
-import { Button } from "../button.js";
-import { HStack, VStack } from "../stack.js";
-import "react";
-import { jsx, jsxs } from "react/jsx-runtime";
+// @bun
+var __require = import.meta.require;
 
-//#region ui/usecases/UseCaseCard.tsx
-function UseCaseCard({ title, summary, ctaHref, ctaLabel = "Learn more", onCtaClick }) {
-	return /* @__PURE__ */ jsxs(VStack, {
-		className: "rounded-lg border p-4",
-		gap: "sm",
-		children: [
-			/* @__PURE__ */ jsx("div", {
-				className: "text-lg font-semibold",
-				children: title
-			}),
-			summary && /* @__PURE__ */ jsx("div", {
-				className: "text-muted-foreground text-base",
-				children: summary
-			}),
-			ctaHref && /* @__PURE__ */ jsx(HStack, { children: /* @__PURE__ */ jsx("a", {
-				href: ctaHref,
-				onClick: onCtaClick,
-				children: /* @__PURE__ */ jsx(Button, {
-					size: "sm",
-					variant: "outline",
-					children: ctaLabel
-				})
-			}) })
-		]
-	});
+// 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);
 }
-
-//#endregion
-export { UseCaseCard };
-//# sourceMappingURL=UseCaseCard.js.map
+export {
+  UseCaseCard
+};

package/dist/ui/usecases/UserStoryCard.d.ts

@@ -1,15 +1,6 @@
-import * as react_jsx_runtime66 from "react/jsx-runtime";
-
-//#region ui/usecases/UserStoryCard.d.ts
-declare function UserStoryCard({
-  title,
-  body,
-  outcome
-}: {
-  title: string;
-  body?: string;
-  outcome?: string;
-}): react_jsx_runtime66.JSX.Element;
-//#endregion
-export { UserStoryCard };
+export declare function UserStoryCard({ title, body, outcome, }: {
+    title: string;
+    body?: string;
+    outcome?: string;
+}): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=UserStoryCard.d.ts.map

package/dist/ui/usecases/UserStoryCard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"UserStoryCard.d.ts","names":[],"sources":["../../../ui/usecases/UserStoryCard.tsx"],"sourcesContent":[],"mappings":";;;iBAGgB,aAAA;;;;;;;EAAA,OAAA,CAAA,EAAA,MAAa;CAC3B,CAAA,EAOD,mBAAA,CAAA,GAAA,CAAA,OAPC"}
+{"version":3,"file":"UserStoryCard.d.ts","sourceRoot":"","sources":["../../../ui/usecases/UserStoryCard.tsx"],"names":[],"mappings":"AAGA,wBAAgB,aAAa,CAAC,EAC5B,KAAK,EACL,IAAI,EACJ,OAAO,GACR,EAAE;IACD,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,2CAYA"}

package/dist/ui/usecases/UserStoryCard.js

@@ -1,36 +1,181 @@
-import { VStack } from "../stack.js";
-import "react";
-import { jsx, jsxs } from "react/jsx-runtime";
+// @bun
+var __require = import.meta.require;
 
-//#region ui/usecases/UserStoryCard.tsx
-function UserStoryCard({ title, body, outcome }) {
-	return /* @__PURE__ */ jsxs(VStack, {
-		className: "rounded-lg border p-4",
-		gap: "sm",
-		children: [
-			/* @__PURE__ */ jsx("div", {
-				className: "text-lg font-semibold",
-				children: title
-			}),
-			body && /* @__PURE__ */ jsx("div", {
-				className: "text-muted-foreground text-base",
-				children: body
-			}),
-			outcome && /* @__PURE__ */ jsxs("div", {
-				className: "text-base",
-				children: [
-					/* @__PURE__ */ jsx("span", {
-						className: "font-medium",
-						children: "Outcome:"
-					}),
-					" ",
-					outcome
-				]
-			})
-		]
-	});
+// ui/stack.tsx
+import * as React from "react";
+import { cva } from "class-variance-authority";
+import { cn } from "@contractspec/lib.ui-kit-core/utils";
+import { jsxDEV } from "react/jsx-dev-runtime";
+var vStackVariants = cva("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 = React.forwardRef(({ className, gap, align, justify, as = "div", ...props }, ref) => {
+  const Comp = as;
+  return /* @__PURE__ */ jsxDEV(Comp, {
+    ref,
+    className: cn(vStackVariants({ gap, align, justify }), className),
+    ...props
+  }, undefined, false, undefined, this);
+});
+VStack.displayName = "VStack";
+var hStackVariants = cva("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 = React.forwardRef(({ className, gap, align, justify, wrap, as = "div", ...props }, ref) => {
+  const Comp = as;
+  return /* @__PURE__ */ jsxDEV(Comp, {
+    ref,
+    className: cn(hStackVariants({ gap, align, justify, wrap }), className),
+    ...props
+  }, undefined, false, undefined, this);
+});
+HStack.displayName = "HStack";
+var boxVariants = cva("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 = React.forwardRef(({ className, gap, align, justify, wrap, as = "div", ...props }, ref) => {
+  const Comp = as;
+  return /* @__PURE__ */ jsxDEV(Comp, {
+    ref,
+    className: cn(boxVariants({ gap, align, justify, wrap }), className),
+    ...props
+  }, undefined, false, undefined, this);
+});
+Box.displayName = "Box";
+// ui/usecases/UserStoryCard.tsx
+import { jsxDEV as jsxDEV2 } from "react/jsx-dev-runtime";
+function UserStoryCard({
+  title,
+  body,
+  outcome
+}) {
+  return /* @__PURE__ */ jsxDEV2(VStack, {
+    className: "rounded-lg border p-4",
+    gap: "sm",
+    children: [
+      /* @__PURE__ */ jsxDEV2("div", {
+        className: "text-lg font-semibold",
+        children: title
+      }, undefined, false, undefined, this),
+      body && /* @__PURE__ */ jsxDEV2("div", {
+        className: "text-muted-foreground text-base",
+        children: body
+      }, undefined, false, undefined, this),
+      outcome && /* @__PURE__ */ jsxDEV2("div", {
+        className: "text-base",
+        children: [
+          /* @__PURE__ */ jsxDEV2("span", {
+            className: "font-medium",
+            children: "Outcome:"
+          }, undefined, false, undefined, this),
+          " ",
+          outcome
+        ]
+      }, undefined, true, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
 }
-
-//#endregion
-export { UserStoryCard };
-//# sourceMappingURL=UserStoryCard.js.map
+export {
+  UserStoryCard
+};

package/dist/ui/usecases/index.d.ts

@@ -1,3 +1,3 @@
-import { UseCaseCard } from "./UseCaseCard.js";
-import { UserStoryCard } from "./UserStoryCard.js";
-export { UseCaseCard, UserStoryCard };
+export { UseCaseCard } from './UseCaseCard';
+export { UserStoryCard } from './UserStoryCard';
+//# sourceMappingURL=index.d.ts.map

package/dist/ui/usecases/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../ui/usecases/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC"}