@giddaa-housing/ui 0.1.0 → 1.1.0

package/dist/input.js

@@ -1,83 +1,27 @@
-// src/components/ui/input.tsx
-import { Input as InputPrimitive } from "@base-ui/react/input";
+import { t as cn } from "./cn-BI_4DMBf.js";
+import { useInputComponentSize } from "./input-size-context.js";
+import { jsx } from "react/jsx-runtime";
 import { cva } from "class-variance-authority";
-
-// src/lib/cn.ts
-import { clsx } from "clsx";
-import { extendTailwindMerge } from "tailwind-merge";
-var twMerge = extendTailwindMerge({
-  extend: {
-    classGroups: {
-      "font-size": [
-        {
-          text: [
-            "gdt-display",
-            "gdt-h1",
-            "gdt-h2",
-            "gdt-h3",
-            "gdt-h4",
-            "gdt-h5",
-            "gdt-xl",
-            "gdt-lg",
-            "gdt-md",
-            "gdt-sm",
-            "gdt-xs",
-            "gdt-subtext",
-            "gdt-capitalized"
-          ]
-        }
-      ]
-    }
-  }
+import { Input as Input$1 } from "@base-ui/react/input";
+//#region src/input.tsx
+const inputVariants = cva("flex w-full min-w-0 rounded-full border border-line bg-canvas text-fg-primary transition-[background-color,border-color,box-shadow,color] outline-none file:inline-flex file:border-0 file:bg-transparent file:font-normal file:text-fg-primary placeholder:text-fg-caption-placeholder hover:border-line-strong focus-visible:border-line-focus focus-visible:inset-ring-1 inset-ring-line-focus disabled:pointer-events-none disabled:cursor-not-allowed disabled:border-line-subtle disabled:bg-surface disabled:text-fg-caption-placeholder disabled:placeholder:text-fg-caption-placeholder aria-invalid:border-line-danger aria-invalid:text-fg-danger aria-invalid:placeholder:text-fg-danger aria-invalid:shadow-none", {
+	variants: { size: {
+		sm: "h-8 px-3 text-gdt-xs font-normal file:text-gdt-xs",
+		md: "h-10 px-3.5 text-gdt-sm font-normal file:text-gdt-sm",
+		lg: "h-12 px-4 text-gdt-md font-normal file:text-gdt-md",
+		xl: "h-14 px-4.5 text-gdt-lg font-normal file:text-gdt-lg"
+	} },
+	defaultVariants: { size: "md" }
 });
-function cn(...inputs) {
-  return twMerge(clsx(inputs));
-}
-
-// src/components/ui/input-size-context.tsx
-import { createContext, useContext } from "react";
-import { Fragment, jsx } from "react/jsx-runtime";
-var InputSizeContext = createContext(
-  void 0
-);
-function useInputComponentSize(size, fallback = "md") {
-  const inheritedSize = useContext(InputSizeContext);
-  return size ?? inheritedSize ?? fallback;
-}
-
-// src/components/ui/input.tsx
-import { jsx as jsx2 } from "react/jsx-runtime";
-var inputVariants = cva(
-  "flex w-full min-w-0 rounded-full border border-line bg-canvas text-fg-primary transition-[background-color,border-color,box-shadow,color] outline-none file:inline-flex file:border-0 file:bg-transparent file:font-normal file:text-fg-primary placeholder:text-fg-muted hover:border-line-strong focus-visible:border-line-focus focus-visible:inset-ring-1 inset-ring-line-focus disabled:pointer-events-none disabled:cursor-not-allowed disabled:border-line-subtle disabled:bg-surface disabled:text-fg-muted disabled:placeholder:text-fg-muted aria-invalid:border-line-danger aria-invalid:text-fg-danger aria-invalid:placeholder:text-fg-danger aria-invalid:shadow-none",
-  {
-    variants: {
-      size: {
-        sm: "h-8 px-3 text-gdt-xs font-normal file:text-gdt-xs",
-        md: "h-10 px-3.5 text-gdt-sm font-normal file:text-gdt-sm",
-        lg: "h-12 px-4 text-gdt-md font-normal file:text-gdt-md",
-        xl: "h-14 px-4.5 text-gdt-lg font-normal file:text-gdt-lg"
-      }
-    },
-    defaultVariants: {
-      size: "md"
-    }
-  }
-);
 function Input({ className, size, type, ...props }) {
-  const resolvedSize = useInputComponentSize(size);
-  return /* @__PURE__ */ jsx2(
-    InputPrimitive,
-    {
-      type,
-      "data-slot": "input",
-      "data-size": resolvedSize,
-      className: cn(inputVariants({ size: resolvedSize }), className),
-      ...props
-    }
-  );
+	const resolvedSize = useInputComponentSize(size);
+	return /* @__PURE__ */ jsx(Input$1, {
+		type,
+		"data-slot": "input",
+		"data-size": resolvedSize,
+		className: cn(inputVariants({ size: resolvedSize }), className),
+		...props
+	});
 }
-export {
-  Input,
-  inputVariants
-};
-//# sourceMappingURL=input.js.map
+//#endregion
+export { Input, inputVariants };

package/dist/item.d.ts

@@ -1,8 +1,7 @@
-import * as React from 'react';
-import { useRender } from '@base-ui/react';
-
-declare function Item({ className, render, ...props }: useRender.ComponentProps<"div">): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
-declare function ItemLabel({ className, render, ...props }: useRender.ComponentProps<"div">): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
-declare function ItemValue({ className, render, ...props }: useRender.ComponentProps<"div">): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
-
-export { Item, ItemLabel, ItemValue };
+import { useRender } from "@base-ui/react";
+//#region src/item.d.ts
+declare function Item({ className, render, ...props }: useRender.ComponentProps<"div">): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
+declare function ItemLabel({ className, render, ...props }: useRender.ComponentProps<"div">): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
+declare function ItemValue({ className, render, ...props }: useRender.ComponentProps<"div">): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
+//#endregion
+export { Item, ItemLabel, ItemValue };

package/dist/item.js

@@ -1,93 +1,26 @@
-// src/components/ui/item.tsx
+import { t as cn } from "./cn-BI_4DMBf.js";
 import { mergeProps, useRender } from "@base-ui/react";
-
-// src/lib/cn.ts
-import { clsx } from "clsx";
-import { extendTailwindMerge } from "tailwind-merge";
-var twMerge = extendTailwindMerge({
-  extend: {
-    classGroups: {
-      "font-size": [
-        {
-          text: [
-            "gdt-display",
-            "gdt-h1",
-            "gdt-h2",
-            "gdt-h3",
-            "gdt-h4",
-            "gdt-h5",
-            "gdt-xl",
-            "gdt-lg",
-            "gdt-md",
-            "gdt-sm",
-            "gdt-xs",
-            "gdt-subtext",
-            "gdt-capitalized"
-          ]
-        }
-      ]
-    }
-  }
-});
-function cn(...inputs) {
-  return twMerge(clsx(inputs));
+//#region src/item.tsx
+function Item({ className, render, ...props }) {
+	return useRender({
+		defaultTagName: "div",
+		props: mergeProps({ className: cn("flex flex-col gap-1", className) }, props),
+		render
+	});
 }
-
-// src/components/ui/item.tsx
-function Item({
-  className,
-  render,
-  ...props
-}) {
-  return useRender({
-    defaultTagName: "div",
-    props: mergeProps(
-      {
-        className: cn("flex flex-col gap-1", className)
-      },
-      props
-    ),
-    render
-  });
+function ItemLabel({ className, render, ...props }) {
+	return useRender({
+		defaultTagName: "div",
+		props: mergeProps({ className: cn("text-gdt-sm  text-fg-secondary", className) }, props),
+		render
+	});
 }
-function ItemLabel({
-  className,
-  render,
-  ...props
-}) {
-  return useRender({
-    defaultTagName: "div",
-    props: mergeProps(
-      {
-        className: cn("text-gdt-sm  text-fg-secondary", className)
-      },
-      props
-    ),
-    render
-  });
+function ItemValue({ className, render, ...props }) {
+	return useRender({
+		defaultTagName: "div",
+		props: mergeProps({ className: cn("text-gdt-sm font-semibold text-fg-primary [a]:text-fg-brand [&_a]:text-fg-brand", className) }, props),
+		render
+	});
 }
-function ItemValue({
-  className,
-  render,
-  ...props
-}) {
-  return useRender({
-    defaultTagName: "div",
-    props: mergeProps(
-      {
-        className: cn(
-          "text-gdt-sm font-semibold text-fg-primary [a]:text-fg-brand [&_a]:text-fg-brand",
-          className
-        )
-      },
-      props
-    ),
-    render
-  });
-}
-export {
-  Item,
-  ItemLabel,
-  ItemValue
-};
-//# sourceMappingURL=item.js.map
+//#endregion
+export { Item, ItemLabel, ItemValue };

package/dist/kpi-card.d.ts

@@ -1,24 +1,22 @@
-import * as class_variance_authority_types from 'class-variance-authority/types';
-import * as React$1 from 'react';
-import { useRender } from '@base-ui/react/use-render';
-import { VariantProps } from 'class-variance-authority';
-import { Skeleton } from './skeleton.js';
-
+import { Skeleton } from "./skeleton.js";
+import { useRender } from "@base-ui/react/use-render";
+import { VariantProps } from "class-variance-authority";
+//#region src/kpi-card.d.ts
 declare function KpiCard({ className, loading, render, ...props }: useRender.ComponentProps<"article"> & {
-    loading?: boolean;
-}): React$1.ReactElement<unknown, string | React$1.JSXElementConstructor<any>>;
-declare function KpiCardTitle({ className, render, ...props }: useRender.ComponentProps<"h3">): React$1.ReactElement<unknown, string | React$1.JSXElementConstructor<any>>;
-declare function KpiCardLinkOutIcon({ children, className, render, ...props }: useRender.ComponentProps<"span">): React$1.ReactElement<unknown, string | React$1.JSXElementConstructor<any>>;
-declare function KpiCardValue({ className, render, ...props }: useRender.ComponentProps<"p">): React$1.ReactElement<unknown, string | React$1.JSXElementConstructor<any>>;
-declare function KpiCardValueSkeleton({ className, ...props }: React.ComponentProps<typeof Skeleton>): React$1.JSX.Element;
+  loading?: boolean;
+}): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
+declare function KpiCardTitle({ className, render, ...props }: useRender.ComponentProps<"h3">): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
+declare function KpiCardLinkOutIcon({ children, className, render, ...props }: useRender.ComponentProps<"span">): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
+declare function KpiCardValue({ className, render, ...props }: useRender.ComponentProps<"p">): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
+declare function KpiCardValueSkeleton({ className, ...props }: React.ComponentProps<typeof Skeleton>): import("react").JSX.Element;
 declare const kpiCardTrendVariants: (props?: ({
-    direction?: "up" | "down" | null | undefined;
-} & class_variance_authority_types.ClassProp) | undefined) => string;
+  direction?: "down" | "up" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
 type KpiCardTrendProps = useRender.ComponentProps<"p"> & VariantProps<typeof kpiCardTrendVariants> & {
-    showIcon?: boolean;
+  showIcon?: boolean;
 };
-declare function KpiCardTrend({ children, className, direction, render, showIcon, ...props }: KpiCardTrendProps): React$1.ReactElement<unknown, string | React$1.JSXElementConstructor<any>>;
-declare function KpiCardTrendValue({ className, render, ...props }: useRender.ComponentProps<"span">): React$1.ReactElement<unknown, string | React$1.JSXElementConstructor<any>>;
-declare function KpiCardTrendCaption({ className, render, ...props }: useRender.ComponentProps<"span">): React$1.ReactElement<unknown, string | React$1.JSXElementConstructor<any>>;
-
-export { KpiCard, KpiCardLinkOutIcon, KpiCardTitle, KpiCardTrend, KpiCardTrendCaption, KpiCardTrendValue, KpiCardValue, KpiCardValueSkeleton, kpiCardTrendVariants };
+declare function KpiCardTrend({ children, className, direction, render, showIcon, ...props }: KpiCardTrendProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
+declare function KpiCardTrendValue({ className, render, ...props }: useRender.ComponentProps<"span">): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
+declare function KpiCardTrendCaption({ className, render, ...props }: useRender.ComponentProps<"span">): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
+//#endregion
+export { KpiCard, KpiCardLinkOutIcon, KpiCardTitle, KpiCardTrend, KpiCardTrendCaption, KpiCardTrendValue, KpiCardValue, KpiCardValueSkeleton, kpiCardTrendVariants };

package/dist/kpi-card.js

@@ -1,243 +1,95 @@
-// src/components/ui/kpi-card.tsx
+import { t as cn } from "./cn-BI_4DMBf.js";
+import { Skeleton } from "./skeleton.js";
+import { ArrowDown, ArrowUp, ArrowUpRight } from "lucide-react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { mergeProps } from "@base-ui/react/merge-props";
 import { useRender } from "@base-ui/react/use-render";
 import { cva } from "class-variance-authority";
-import { ArrowDown, ArrowUp, ArrowUpRight } from "lucide-react";
-
-// src/lib/cn.ts
-import { clsx } from "clsx";
-import { extendTailwindMerge } from "tailwind-merge";
-var twMerge = extendTailwindMerge({
-  extend: {
-    classGroups: {
-      "font-size": [
-        {
-          text: [
-            "gdt-display",
-            "gdt-h1",
-            "gdt-h2",
-            "gdt-h3",
-            "gdt-h4",
-            "gdt-h5",
-            "gdt-xl",
-            "gdt-lg",
-            "gdt-md",
-            "gdt-sm",
-            "gdt-xs",
-            "gdt-subtext",
-            "gdt-capitalized"
-          ]
-        }
-      ]
-    }
-  }
-});
-function cn(...inputs) {
-  return twMerge(clsx(inputs));
+//#region src/kpi-card.tsx
+function KpiCard({ className, loading = false, render, ...props }) {
+	return useRender({
+		defaultTagName: "article",
+		props: mergeProps({
+			"aria-busy": loading || void 0,
+			className: cn("group/kpi-card relative flex w-full min-w-0 flex-col gap-4 rounded-xl p-5 text-fg-primary transition-[background-color,border-color,box-shadow,transform] outline-none border border-line-subtle shadow-1", className)
+		}, props),
+		render,
+		state: {
+			slot: "kpi-card",
+			loading
+		}
+	});
 }
-
-// src/components/ui/skeleton.tsx
-import { jsx } from "react/jsx-runtime";
-function Skeleton({ className, ...props }) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      "data-slot": "skeleton",
-      className: cn("animate-pulse rounded-md bg-line", className),
-      ...props
-    }
-  );
+function KpiCardTitle({ className, render, ...props }) {
+	return useRender({
+		defaultTagName: "h3",
+		props: mergeProps({ className: cn("min-w-0 pr-gdt-xl text-gdt-sm font-semibold capitalized text-fg-secondary", className) }, props),
+		render
+	});
 }
-
-// src/components/ui/kpi-card.tsx
-import { Fragment, jsx as jsx2, jsxs } from "react/jsx-runtime";
-function KpiCard({
-  className,
-  loading = false,
-  render,
-  ...props
-}) {
-  return useRender({
-    defaultTagName: "article",
-    props: mergeProps(
-      {
-        "aria-busy": loading || void 0,
-        className: cn(
-          "group/kpi-card relative flex w-full min-w-0 flex-col gap-4 rounded-xl p-5 text-fg-primary transition-[background-color,border-color,box-shadow,transform] outline-none border border-line-subtle shadow-1",
-          className
-        )
-      },
-      props
-    ),
-    render,
-    state: {
-      slot: "kpi-card",
-      loading
-    }
-  });
+function KpiCardLinkOutIcon({ children, className, render, ...props }) {
+	return useRender({
+		defaultTagName: "span",
+		props: mergeProps({
+			"aria-hidden": true,
+			className: cn("pointer-events-none absolute right-gdt-md top-gdt-md inline-flex size-4 shrink-0 items-center justify-center text-fg-secondary [&>svg]:size-4 [&>svg]:shrink-0", className),
+			children: children ?? /* @__PURE__ */ jsx(ArrowUpRight, { "aria-hidden": "true" })
+		}, props),
+		render
+	});
 }
-function KpiCardTitle({
-  className,
-  render,
-  ...props
-}) {
-  return useRender({
-    defaultTagName: "h3",
-    props: mergeProps(
-      {
-        className: cn(
-          "min-w-0 pr-gdt-xl text-gdt-sm font-semibold capitalized text-fg-secondary",
-          className
-        )
-      },
-      props
-    ),
-    render
-  });
+function KpiCardValue({ className, render, ...props }) {
+	return useRender({
+		defaultTagName: "p",
+		props: mergeProps({ className: cn("text-gdt-h3 font-extrabold  text-fg-primary group-aria-busy/kpi-card:hidden", className) }, props),
+		render
+	});
 }
-function KpiCardLinkOutIcon({
-  children,
-  className,
-  render,
-  ...props
-}) {
-  return useRender({
-    defaultTagName: "span",
-    props: mergeProps(
-      {
-        "aria-hidden": true,
-        className: cn(
-          "pointer-events-none absolute right-gdt-md top-gdt-md inline-flex size-4 shrink-0 items-center justify-center text-fg-secondary [&>svg]:size-4 [&>svg]:shrink-0",
-          className
-        ),
-        children: children ?? /* @__PURE__ */ jsx2(ArrowUpRight, { "aria-hidden": "true" })
-      },
-      props
-    ),
-    render
-  });
+function KpiCardValueSkeleton({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Skeleton, {
+		className: cn("hidden h-8 mt-2 md:mt-3 w-24 rounded-md group-aria-busy/kpi-card:block", className),
+		...props
+	});
 }
-function KpiCardValue({
-  className,
-  render,
-  ...props
-}) {
-  return useRender({
-    defaultTagName: "p",
-    props: mergeProps(
-      {
-        className: cn(
-          "text-gdt-h3 font-extrabold  text-fg-primary group-aria-busy/kpi-card:hidden",
-          className
-        )
-      },
-      props
-    ),
-    render
-  });
-}
-function KpiCardValueSkeleton({
-  className,
-  ...props
-}) {
-  return /* @__PURE__ */ jsx2(
-    Skeleton,
-    {
-      className: cn(
-        "hidden h-8 mt-2 md:mt-3 w-24 rounded-md group-aria-busy/kpi-card:block",
-        className
-      ),
-      ...props
-    }
-  );
-}
-var kpiCardTrendVariants = cva(
-  "flex min-w-0 items-center gap-1.5 text-gdt-capitalized",
-  {
-    variants: {
-      direction: {
-        up: "text-status-success",
-        down: "text-status-danger"
-      }
-    },
-    defaultVariants: {
-      direction: "up"
-    }
-  }
-);
-function KpiCardTrend({
-  children,
-  className,
-  direction = "up",
-  render,
-  showIcon = true,
-  ...props
-}) {
-  const Icon = direction === "down" ? ArrowDown : ArrowUp;
-  return useRender({
-    defaultTagName: "p",
-    props: mergeProps(
-      {
-        className: cn(kpiCardTrendVariants({ direction }), className),
-        children: /* @__PURE__ */ jsxs(Fragment, { children: [
-          showIcon ? /* @__PURE__ */ jsx2(Icon, { "aria-hidden": "true", className: "size-3 shrink-0" }) : null,
-          children
-        ] })
-      },
-      props
-    ),
-    render,
-    state: {
-      direction,
-      showIcon,
-      slot: "kpi-card-trend"
-    }
-  });
+const kpiCardTrendVariants = cva("flex min-w-0 items-center gap-1.5 text-gdt-capitalized", {
+	variants: { direction: {
+		up: "text-status-success",
+		down: "text-status-danger"
+	} },
+	defaultVariants: { direction: "up" }
+});
+function KpiCardTrend({ children, className, direction = "up", render, showIcon = true, ...props }) {
+	const Icon = direction === "down" ? ArrowDown : ArrowUp;
+	return useRender({
+		defaultTagName: "p",
+		props: mergeProps({
+			className: cn(kpiCardTrendVariants({ direction }), className),
+			children: /* @__PURE__ */ jsxs(Fragment, { children: [showIcon ? /* @__PURE__ */ jsx(Icon, {
+				"aria-hidden": "true",
+				className: "size-3 shrink-0"
+			}) : null, children] })
+		}, props),
+		render,
+		state: {
+			direction,
+			showIcon,
+			slot: "kpi-card-trend"
+		}
+	});
 }
-function KpiCardTrendValue({
-  className,
-  render,
-  ...props
-}) {
-  return useRender({
-    defaultTagName: "span",
-    props: mergeProps(
-      {
-        className: cn("text-gdt-sm text-current font-semibold", className)
-      },
-      props
-    ),
-    render
-  });
+function KpiCardTrendValue({ className, render, ...props }) {
+	return useRender({
+		defaultTagName: "span",
+		props: mergeProps({ className: cn("text-gdt-sm text-current font-semibold", className) }, props),
+		render
+	});
 }
-function KpiCardTrendCaption({
-  className,
-  render,
-  ...props
-}) {
-  return useRender({
-    defaultTagName: "span",
-    props: mergeProps(
-      {
-        className: cn(
-          "min-w-0 truncate text-gdt-xs text-fg-secondary font-normal",
-          className
-        )
-      },
-      props
-    ),
-    render
-  });
+function KpiCardTrendCaption({ className, render, ...props }) {
+	return useRender({
+		defaultTagName: "span",
+		props: mergeProps({ className: cn("min-w-0 truncate text-gdt-xs text-fg-secondary font-normal", className) }, props),
+		render
+	});
 }
-export {
-  KpiCard,
-  KpiCardLinkOutIcon,
-  KpiCardTitle,
-  KpiCardTrend,
-  KpiCardTrendCaption,
-  KpiCardTrendValue,
-  KpiCardValue,
-  KpiCardValueSkeleton,
-  kpiCardTrendVariants
-};
-//# sourceMappingURL=kpi-card.js.map
+//#endregion
+export { KpiCard, KpiCardLinkOutIcon, KpiCardTitle, KpiCardTrend, KpiCardTrendCaption, KpiCardTrendValue, KpiCardValue, KpiCardValueSkeleton, kpiCardTrendVariants };

package/dist/label.d.ts

@@ -1,8 +1,8 @@
-import * as React from 'react';
-
+import * as React from "react";
+//#region src/label.d.ts
 declare function Label({ className, children, withAsterisk, showOptionalText, ...props }: React.ComponentProps<"label"> & {
-    withAsterisk?: boolean;
-    showOptionalText?: boolean;
+  withAsterisk?: boolean;
+  showOptionalText?: boolean;
 }): React.JSX.Element;
-
-export { Label };
+//#endregion
+export { Label };