@giddaa-housing/ui 1.0.0 → 1.1.0

package/dist/price-tag.d.ts

@@ -1,35 +1,34 @@
-import * as class_variance_authority_types from 'class-variance-authority/types';
-import { VariantProps } from 'class-variance-authority';
-import * as React from 'react';
-
+import { VariantProps } from "class-variance-authority";
+import * as React from "react";
+//#region src/price-tag.d.ts
 declare const priceTagVariants: (props?: ({
-    size?: "sm" | "md" | "lg" | "xs" | "xxs" | null | undefined;
-    hasMonthlyPayment?: boolean | null | undefined;
-} & class_variance_authority_types.ClassProp) | undefined) => string;
+  size?: "lg" | "md" | "sm" | "xs" | "xxs" | null | undefined;
+  hasMonthlyPayment?: boolean | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
 type PriceTagSize = NonNullable<VariantProps<typeof priceTagVariants>["size"]>;
 type PriceTagCurrencyOption = {
-    code: string;
-    amount: string;
-    shortAmount?: string;
-    monthlyPayment?: string;
-    monthlyPaymentLabel?: string;
+  code: string;
+  amount: string;
+  shortAmount?: string;
+  monthlyPayment?: string;
+  monthlyPaymentLabel?: string;
 };
 type PriceTagFormat = "full" | "shortened";
 type PriceTagProps = Omit<React.ComponentProps<"button">, "children"> & {
-    amount: string;
-    shortAmount?: string;
-    format?: PriceTagFormat;
-    size?: PriceTagSize;
-    monthlyPayment?: string;
-    monthlyPaymentLabel?: string;
-    currencies?: PriceTagCurrencyOption[];
-    selectedCurrency?: string;
-    onCurrencyChange?: (currency: PriceTagCurrencyOption) => void;
-    open?: boolean;
-    defaultOpen?: boolean;
-    onOpenChange?: (open: boolean) => void;
-    popoverClassName?: string;
+  amount: string;
+  shortAmount?: string;
+  format?: PriceTagFormat;
+  size?: PriceTagSize;
+  monthlyPayment?: string;
+  monthlyPaymentLabel?: string;
+  currencies?: PriceTagCurrencyOption[];
+  selectedCurrency?: string;
+  onCurrencyChange?: (currency: PriceTagCurrencyOption) => void;
+  open?: boolean;
+  defaultOpen?: boolean;
+  onOpenChange?: (open: boolean) => void;
+  popoverClassName?: string;
 };
 declare function PriceTag({ amount, shortAmount, format, size, monthlyPayment, monthlyPaymentLabel, currencies, selectedCurrency, onCurrencyChange, open, defaultOpen, onOpenChange, className, popoverClassName, type, ...props }: PriceTagProps): React.JSX.Element;
-
-export { PriceTag, type PriceTagCurrencyOption, type PriceTagFormat, type PriceTagProps, type PriceTagSize, priceTagVariants };
+//#endregion
+export { PriceTag, type PriceTagCurrencyOption, type PriceTagFormat, type PriceTagProps, type PriceTagSize, priceTagVariants };

package/dist/price-tag.js

@@ -1,178 +1,118 @@
 "use client";
-import {
-  cn
-} from "./chunk-Y4TTYVNE.js";
-
-// src/price-tag.tsx
-import { Popover as PopoverPrimitive } from "@base-ui/react/popover";
-import { cva } from "class-variance-authority";
+import { t as cn } from "./cn-BI_4DMBf.js";
 import { Check, ChevronDown } from "lucide-react";
 import { jsx, jsxs } from "react/jsx-runtime";
-var priceTagVariants = cva(
-  "group/price-tag inline-flex w-fit shrink-0 items-center justify-center rounded-4xl bg-surface-brand font-bold leading-none whitespace-nowrap text-fg-on-brand shadow-none transition-[background-color,box-shadow] outline-none data-[interactive=true]:cursor-pointer data-[interactive=true]:hover:bg-action-primary-hover data-[interactive=true]:focus-visible:shadow-[0px_0px_0px_2px_var(--color-line-focus)] data-[interactive=true]:active:bg-action-primary-pressed",
-  {
-    variants: {
-      size: {
-        xxs: "min-h-7 gap-1 px-2.5 py-0.75 text-gdt-subtext [&>svg]:size-3",
-        xs: "min-h-7.5 gap-1 px-3 py-1 text-gdt-xs [&>svg]:size-3.5",
-        sm: "min-h-9 gap-1.5 px-4 py-1.5 text-gdt-sm [&>svg]:size-3.5",
-        md: "min-h-10.5 gap-1.5 px-5 py-2 text-gdt-md [&>svg]:size-4",
-        lg: "min-h-13 gap-2 px-7 py-3 text-gdt-lg [&>svg]:size-4.5"
-      },
-      hasMonthlyPayment: {
-        true: "items-start",
-        false: ""
-      }
-    },
-    defaultVariants: {
-      size: "md",
-      hasMonthlyPayment: false
-    }
-  }
-);
-function getDisplayAmount({
-  amount,
-  shortAmount,
-  format
-}) {
-  return format === "shortened" && shortAmount ? shortAmount : amount;
+import { cva } from "class-variance-authority";
+import { Popover } from "@base-ui/react/popover";
+//#region src/price-tag.tsx
+const priceTagVariants = cva("group/price-tag inline-flex w-fit shrink-0 items-center justify-center rounded-4xl bg-surface-brand font-bold leading-none whitespace-nowrap text-fg-on-brand shadow-none transition-[background-color,box-shadow] outline-none data-[interactive=true]:cursor-pointer data-[interactive=true]:hover:bg-action-primary-hover data-[interactive=true]:focus-visible:shadow-[0px_0px_0px_2px_var(--color-line-focus)] data-[interactive=true]:active:bg-action-primary-pressed", {
+	variants: {
+		size: {
+			xxs: "min-h-7 gap-1 px-2.5 py-0.75 text-gdt-subtext [&>svg]:size-3",
+			xs: "min-h-7.5 gap-1 px-3 py-1 text-gdt-xs [&>svg]:size-3.5",
+			sm: "min-h-9 gap-1.5 px-4 py-1.5 text-gdt-sm [&>svg]:size-3.5",
+			md: "min-h-10.5 gap-1.5 px-5 py-2 text-gdt-md [&>svg]:size-4",
+			lg: "min-h-13 gap-2 px-7 py-3 text-gdt-lg [&>svg]:size-4.5"
+		},
+		hasMonthlyPayment: {
+			true: "items-start",
+			false: ""
+		}
+	},
+	defaultVariants: {
+		size: "md",
+		hasMonthlyPayment: false
+	}
+});
+function getDisplayAmount({ amount, shortAmount, format }) {
+	return format === "shortened" && shortAmount ? shortAmount : amount;
 }
-function PriceTag({
-  amount,
-  shortAmount,
-  format = "full",
-  size = "md",
-  monthlyPayment,
-  monthlyPaymentLabel = "Low as",
-  currencies,
-  selectedCurrency,
-  onCurrencyChange,
-  open,
-  defaultOpen,
-  onOpenChange,
-  className,
-  popoverClassName,
-  type = "button",
-  ...props
-}) {
-  const hasDropdown = Boolean(currencies?.length);
-  const canShowMonthlyPayment = size === "md" || size === "lg";
-  const displayMonthlyPayment = canShowMonthlyPayment && monthlyPayment ? `${monthlyPaymentLabel} ${monthlyPayment} monthly` : void 0;
-  const displayAmount = getDisplayAmount({ amount, shortAmount, format });
-  const pill = /* @__PURE__ */ jsxs("span", { className: "flex min-w-0 flex-col gap-1", children: [
-    /* @__PURE__ */ jsx("span", { children: displayAmount }),
-    displayMonthlyPayment ? /* @__PURE__ */ jsx(
-      "span",
-      {
-        className: cn(
-          "hidden text-gdt-subtext font-medium leading-none opacity-90",
-          {
-            "inline-block": size === "md",
-            "inline-block text-gdt-xs": size === "lg"
-          }
-        ),
-        children: displayMonthlyPayment
-      }
-    ) : null
-  ] });
-  if (!hasDropdown) {
-    return /* @__PURE__ */ jsx(
-      "span",
-      {
-        "data-slot": "price-tag",
-        className: cn(
-          priceTagVariants({
-            size,
-            hasMonthlyPayment: Boolean(displayMonthlyPayment)
-          }),
-          className
-        ),
-        children: pill
-      }
-    );
-  }
-  return /* @__PURE__ */ jsxs(
-    PopoverPrimitive.Root,
-    {
-      open,
-      defaultOpen,
-      onOpenChange,
-      children: [
-        /* @__PURE__ */ jsxs(
-          PopoverPrimitive.Trigger,
-          {
-            "data-slot": "price-tag",
-            "data-interactive": "true",
-            type,
-            className: cn(
-              priceTagVariants({
-                size,
-                hasMonthlyPayment: Boolean(displayMonthlyPayment)
-              }),
-              className
-            ),
-            ...props,
-            children: [
-              pill,
-              /* @__PURE__ */ jsx(
-                ChevronDown,
-                {
-                  "aria-hidden": "true",
-                  className: "transition-transform group-data-popup-open/price-tag:rotate-180"
-                }
-              )
-            ]
-          }
-        ),
-        /* @__PURE__ */ jsx(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsx(PopoverPrimitive.Positioner, { sideOffset: 10, align: "start", children: /* @__PURE__ */ jsx(
-          PopoverPrimitive.Popup,
-          {
-            "data-slot": "price-tag-popover",
-            className: cn(
-              "z-50 flex w-[17.25rem] max-w-[calc(100vw-2rem)] origin-(--transform-origin) flex-col rounded-xl border border-line-subtle bg-surface-overlay p-2 text-fg-primary shadow-3 outline-hidden duration-100 data-[side=bottom]:slide-in-from-top-2 data-[side=top]:slide-in-from-bottom-2 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
-              popoverClassName
-            ),
-            children: currencies?.map((currency) => {
-              const active = currency.code === selectedCurrency;
-              const optionAmount = getDisplayAmount({
-                amount: currency.amount,
-                shortAmount: currency.shortAmount,
-                format
-              });
-              const optionMonthlyPayment = currency.monthlyPayment ? `${currency.monthlyPaymentLabel ?? "As low as"} ${currency.monthlyPayment} per month` : void 0;
-              return /* @__PURE__ */ jsxs(
-                "button",
-                {
-                  type: "button",
-                  "data-active": active ? "true" : void 0,
-                  className: "flex min-h-14 w-full items-center gap-3 rounded-lg px-3 text-start outline-none transition-colors hover:bg-surface-brand-subtle focus-visible:bg-surface-brand-subtle focus-visible:shadow-[0px_0px_0px_2px_var(--color-line-focus)] data-[active=true]:bg-surface-brand-subtle",
-                  onClick: () => onCurrencyChange?.(currency),
-                  children: [
-                    /* @__PURE__ */ jsx("span", { className: "min-w-10 text-gdt-sm font-semibold text-fg-brand", children: currency.code }),
-                    /* @__PURE__ */ jsxs("span", { className: "ml-auto flex min-w-0 flex-col items-end", children: [
-                      /* @__PURE__ */ jsx("span", { className: "text-gdt-sm font-bold text-fg-primary", children: optionAmount }),
-                      optionMonthlyPayment ? /* @__PURE__ */ jsx("span", { className: "text-gdt-xs text-fg-secondary", children: optionMonthlyPayment }) : null
-                    ] }),
-                    active ? /* @__PURE__ */ jsx(
-                      Check,
-                      {
-                        "aria-hidden": "true",
-                        className: "size-4 shrink-0 text-fg-brand"
-                      }
-                    ) : null
-                  ]
-                },
-                currency.code
-              );
-            })
-          }
-        ) }) })
-      ]
-    }
-  );
+function PriceTag({ amount, shortAmount, format = "full", size = "md", monthlyPayment, monthlyPaymentLabel = "Low as", currencies, selectedCurrency, onCurrencyChange, open, defaultOpen, onOpenChange, className, popoverClassName, type = "button", ...props }) {
+	const hasDropdown = Boolean(currencies?.length);
+	const displayMonthlyPayment = (size === "md" || size === "lg") && monthlyPayment ? `${monthlyPaymentLabel} ${monthlyPayment} monthly` : void 0;
+	const pill = /* @__PURE__ */ jsxs("span", {
+		className: "flex min-w-0 flex-col gap-1",
+		children: [/* @__PURE__ */ jsx("span", { children: getDisplayAmount({
+			amount,
+			shortAmount,
+			format
+		}) }), displayMonthlyPayment ? /* @__PURE__ */ jsx("span", {
+			className: cn("hidden text-gdt-subtext font-medium leading-none opacity-90", {
+				"inline-block": size === "md",
+				"inline-block text-gdt-xs": size === "lg"
+			}),
+			children: displayMonthlyPayment
+		}) : null]
+	});
+	if (!hasDropdown) return /* @__PURE__ */ jsx("span", {
+		"data-slot": "price-tag",
+		className: cn(priceTagVariants({
+			size,
+			hasMonthlyPayment: Boolean(displayMonthlyPayment)
+		}), className),
+		children: pill
+	});
+	return /* @__PURE__ */ jsxs(Popover.Root, {
+		open,
+		defaultOpen,
+		onOpenChange,
+		children: [/* @__PURE__ */ jsxs(Popover.Trigger, {
+			"data-slot": "price-tag",
+			"data-interactive": "true",
+			type,
+			className: cn(priceTagVariants({
+				size,
+				hasMonthlyPayment: Boolean(displayMonthlyPayment)
+			}), className),
+			...props,
+			children: [pill, /* @__PURE__ */ jsx(ChevronDown, {
+				"aria-hidden": "true",
+				className: "transition-transform group-data-popup-open/price-tag:rotate-180"
+			})]
+		}), /* @__PURE__ */ jsx(Popover.Portal, { children: /* @__PURE__ */ jsx(Popover.Positioner, {
+			sideOffset: 10,
+			align: "start",
+			children: /* @__PURE__ */ jsx(Popover.Popup, {
+				"data-slot": "price-tag-popover",
+				className: cn("z-50 flex w-[17.25rem] max-w-[calc(100vw-2rem)] origin-(--transform-origin) flex-col rounded-xl border border-line-subtle bg-surface-overlay p-2 text-fg-primary shadow-3 outline-hidden duration-100 data-[side=bottom]:slide-in-from-top-2 data-[side=top]:slide-in-from-bottom-2 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95", popoverClassName),
+				children: currencies?.map((currency) => {
+					const active = currency.code === selectedCurrency;
+					const optionAmount = getDisplayAmount({
+						amount: currency.amount,
+						shortAmount: currency.shortAmount,
+						format
+					});
+					const optionMonthlyPayment = currency.monthlyPayment ? `${currency.monthlyPaymentLabel ?? "As low as"} ${currency.monthlyPayment} per month` : void 0;
+					return /* @__PURE__ */ jsxs("button", {
+						type: "button",
+						"data-active": active ? "true" : void 0,
+						className: "flex min-h-14 w-full items-center gap-3 rounded-lg px-3 text-start outline-none transition-colors hover:bg-surface-brand-subtle focus-visible:bg-surface-brand-subtle focus-visible:shadow-[0px_0px_0px_2px_var(--color-line-focus)] data-[active=true]:bg-surface-brand-subtle",
+						onClick: () => onCurrencyChange?.(currency),
+						children: [
+							/* @__PURE__ */ jsx("span", {
+								className: "min-w-10 text-gdt-sm font-semibold text-fg-brand",
+								children: currency.code
+							}),
+							/* @__PURE__ */ jsxs("span", {
+								className: "ml-auto flex min-w-0 flex-col items-end",
+								children: [/* @__PURE__ */ jsx("span", {
+									className: "text-gdt-sm font-bold text-fg-primary",
+									children: optionAmount
+								}), optionMonthlyPayment ? /* @__PURE__ */ jsx("span", {
+									className: "text-gdt-xs text-fg-secondary",
+									children: optionMonthlyPayment
+								}) : null]
+							}),
+							active ? /* @__PURE__ */ jsx(Check, {
+								"aria-hidden": "true",
+								className: "size-4 shrink-0 text-fg-brand"
+							}) : null
+						]
+					}, currency.code);
+				})
+			})
+		}) })]
+	});
 }
-export {
-  PriceTag,
-  priceTagVariants
-};
-//# sourceMappingURL=price-tag.js.map
+//#endregion
+export { PriceTag, priceTagVariants };

package/dist/progress.d.ts

@@ -1,24 +1,23 @@
-import * as class_variance_authority_types from 'class-variance-authority/types';
-import { Progress as Progress$1 } from '@base-ui/react/progress';
-import { VariantProps } from 'class-variance-authority';
-import * as React from 'react';
-
+import { VariantProps } from "class-variance-authority";
+import * as React from "react";
+import { Progress as Progress$1 } from "@base-ui/react/progress";
+//#region src/progress.d.ts
 declare const progressVariants: (props?: ({
-    size?: "sm" | "md" | "lg" | null | undefined;
-} & class_variance_authority_types.ClassProp) | undefined) => string;
+  size?: "lg" | "md" | "sm" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
 declare const circularProgressVariants: (props?: ({
-    size?: "sm" | "md" | "lg" | null | undefined;
-} & class_variance_authority_types.ClassProp) | undefined) => string;
+  size?: "lg" | "md" | "sm" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
 type ProgressProps = Progress$1.Root.Props & VariantProps<typeof progressVariants> & {
-    disabled?: boolean;
+  disabled?: boolean;
 };
 type ProgressSize = NonNullable<VariantProps<typeof progressVariants>["size"]>;
 type CircularProgressProps = React.ComponentProps<"div"> & VariantProps<typeof circularProgressVariants> & {
-    value: number;
-    labelOverlay?: boolean;
-    pixelSize?: number;
-    strokeWidth?: number;
-    strokeLinecap?: "round" | "butt" | "square";
+  value: number;
+  labelOverlay?: boolean;
+  pixelSize?: number;
+  strokeWidth?: number;
+  strokeLinecap?: "round" | "butt" | "square";
 };
 declare function Progress({ className, children, value, size, disabled, ...props }: ProgressProps): React.JSX.Element;
 declare function ProgressTrack({ className, ...props }: Progress$1.Track.Props): React.JSX.Element;
@@ -27,5 +26,5 @@ declare function ProgressLabel({ className, ...props }: Progress$1.Label.Props):
 declare function ProgressValue({ className, ...props }: Progress$1.Value.Props): React.JSX.Element;
 declare function ProgressCaption({ className, ...props }: React.ComponentProps<"p">): React.JSX.Element;
 declare function CircularProgress({ className, style, value, size, children, labelOverlay, pixelSize, strokeWidth, strokeLinecap, ...props }: CircularProgressProps): React.JSX.Element;
-
-export { CircularProgress, type CircularProgressProps, Progress, ProgressCaption, ProgressIndicator, ProgressLabel, type ProgressProps, type ProgressSize, ProgressTrack, ProgressValue, circularProgressVariants, progressVariants };
+//#endregion
+export { CircularProgress, type CircularProgressProps, Progress, ProgressCaption, ProgressIndicator, ProgressLabel, type ProgressProps, type ProgressSize, ProgressTrack, ProgressValue, circularProgressVariants, progressVariants };

package/dist/progress.js

@@ -1,26 +1,171 @@
 "use client";
-import {
-  CircularProgress,
-  Progress,
-  ProgressCaption,
-  ProgressIndicator,
-  ProgressLabel,
-  ProgressTrack,
-  ProgressValue,
-  circularProgressVariants,
-  progressVariants
-} from "./chunk-322YCNVL.js";
-import "./chunk-HL3ZSYES.js";
-import "./chunk-Y4TTYVNE.js";
-export {
-  CircularProgress,
-  Progress,
-  ProgressCaption,
-  ProgressIndicator,
-  ProgressLabel,
-  ProgressTrack,
-  ProgressValue,
-  circularProgressVariants,
-  progressVariants
+import { t as cn } from "./cn-BI_4DMBf.js";
+import { SizeProvider, useComponentSize } from "./size-context.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cva } from "class-variance-authority";
+import * as React from "react";
+import { Progress as Progress$1 } from "@base-ui/react/progress";
+//#region src/progress.tsx
+const progressVariants = cva("group/progress flex w-full flex-wrap items-center", {
+	variants: { size: {
+		sm: "gap-x-2 gap-y-1.5",
+		md: "gap-x-3 gap-y-2",
+		lg: "gap-x-4 gap-y-2.5"
+	} },
+	defaultVariants: { size: "md" }
+});
+const circularProgressVariants = cva("relative grid place-items-center text-fg-on-brand", {
+	variants: { size: {
+		sm: "text-[9px]",
+		md: "text-[10px]",
+		lg: "text-gdt-xs"
+	} },
+	defaultVariants: { size: "md" }
+});
+const circularProgressLabelVariants = cva("relative z-10 font-medium tabular-nums leading-none", {
+	variants: {
+		size: {
+			sm: "text-[9px]",
+			md: "text-[10px]",
+			lg: "text-gdt-xs"
+		},
+		overlay: {
+			true: "grid place-items-center rounded-full bg-black/65 text-white shadow-sm backdrop-blur-[1px]",
+			false: ""
+		}
+	},
+	defaultVariants: {
+		size: "md",
+		overlay: false
+	}
+});
+const circularProgressSizes = {
+	sm: {
+		pixelSize: 40,
+		strokeWidth: 3
+	},
+	md: {
+		pixelSize: 48,
+		strokeWidth: 4
+	},
+	lg: {
+		pixelSize: 56,
+		strokeWidth: 5
+	}
 };
-//# sourceMappingURL=progress.js.map
+function Progress({ className, children, value, size, disabled = false, ...props }) {
+	const resolvedSize = useComponentSize(size);
+	const hasCustomTrack = React.Children.toArray(children).some((child) => React.isValidElement(child) && child.type === ProgressTrack);
+	return /* @__PURE__ */ jsx(SizeProvider, {
+		size: resolvedSize,
+		children: /* @__PURE__ */ jsxs(Progress$1.Root, {
+			value,
+			"aria-disabled": disabled || void 0,
+			"data-disabled": disabled,
+			"data-size": resolvedSize,
+			"data-slot": "progress",
+			className: cn(progressVariants({ size: resolvedSize }), className),
+			...props,
+			children: [children, !hasCustomTrack && /* @__PURE__ */ jsx(ProgressTrack, { children: /* @__PURE__ */ jsx(ProgressIndicator, {}) })]
+		})
+	});
+}
+function ProgressTrack({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Progress$1.Track, {
+		className: cn("order-3 relative flex basis-full items-center overflow-hidden rounded-full bg-surface-raised", "group-data-[size=sm]/progress:h-1 group-data-[size=md]/progress:h-1.5 group-data-[size=lg]/progress:h-2", className),
+		"data-slot": "progress-track",
+		...props
+	});
+}
+function ProgressIndicator({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Progress$1.Indicator, {
+		"data-slot": "progress-indicator",
+		className: cn("h-full rounded-full bg-action-primary transition-[width,transform,background-color] duration-300 ease-out group-data-[disabled=true]/progress:bg-line-strong", className),
+		...props
+	});
+}
+function ProgressLabel({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Progress$1.Label, {
+		className: cn("order-1 min-w-0 text-fg-primary font-semibold leading-snug group-data-[disabled=true]/progress:text-fg-caption-placeholder", "group-data-[size=sm]/progress:text-gdt-xs group-data-[size=md]/progress:text-gdt-sm group-data-[size=lg]/progress:text-gdt-md", className),
+		"data-slot": "progress-label",
+		...props
+	});
+}
+function ProgressValue({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Progress$1.Value, {
+		className: cn("order-2 ml-auto shrink-0 tabular-nums text-fg-secondary leading-snug group-data-[disabled=true]/progress:text-fg-caption-placeholder", "group-data-[size=sm]/progress:text-gdt-xs group-data-[size=md]/progress:text-gdt-sm group-data-[size=lg]/progress:text-gdt-md", className),
+		"data-slot": "progress-value",
+		...props
+	});
+}
+function ProgressCaption({ className, ...props }) {
+	return /* @__PURE__ */ jsx("p", {
+		className: cn("order-4 basis-full text-fg-secondary leading-snug group-data-[disabled=true]/progress:text-fg-caption-placeholder", "group-data-[size=sm]/progress:text-gdt-subtext group-data-[size=md]/progress:text-gdt-xs group-data-[size=lg]/progress:text-gdt-sm", className),
+		"data-slot": "progress-caption",
+		...props
+	});
+}
+function CircularProgress({ className, style, value, size, children, labelOverlay = false, pixelSize, strokeWidth, strokeLinecap = "round", ...props }) {
+	const resolvedSize = useComponentSize(size);
+	const progress = Math.min(100, Math.max(0, Math.round(Number.isFinite(value) ? value : 0)));
+	const resolvedDimensions = circularProgressSizes[resolvedSize];
+	const resolvedPixelSize = pixelSize ?? resolvedDimensions.pixelSize;
+	const resolvedStrokeWidth = strokeWidth ?? resolvedDimensions.strokeWidth;
+	const radius = (resolvedPixelSize - resolvedStrokeWidth) / 2;
+	const labelSize = resolvedPixelSize - resolvedStrokeWidth * 3;
+	const circumference = 2 * Math.PI * radius;
+	const strokeDashoffset = circumference - progress / 100 * circumference;
+	return /* @__PURE__ */ jsxs("div", {
+		role: "progressbar",
+		"aria-valuemin": 0,
+		"aria-valuemax": 100,
+		"aria-valuenow": progress,
+		"aria-valuetext": `${progress}%`,
+		"data-slot": "circular-progress",
+		className: cn(circularProgressVariants({ size: resolvedSize }), className),
+		style: {
+			width: resolvedPixelSize,
+			height: resolvedPixelSize,
+			...style
+		},
+		...props,
+		children: [/* @__PURE__ */ jsxs("svg", {
+			"aria-hidden": "true",
+			className: "absolute inset-0 -rotate-90 transform",
+			focusable: "false",
+			width: resolvedPixelSize,
+			height: resolvedPixelSize,
+			viewBox: `0 0 ${resolvedPixelSize} ${resolvedPixelSize}`,
+			fill: "none",
+			stroke: "currentColor",
+			children: [/* @__PURE__ */ jsx("circle", {
+				className: "text-line",
+				strokeWidth: resolvedStrokeWidth,
+				cx: resolvedPixelSize / 2,
+				cy: resolvedPixelSize / 2,
+				r: radius
+			}), /* @__PURE__ */ jsx("circle", {
+				className: "text-action-primary transition-[stroke-dashoffset] duration-300 ease-linear",
+				strokeWidth: resolvedStrokeWidth,
+				strokeLinecap,
+				strokeDasharray: circumference,
+				strokeDashoffset,
+				cx: resolvedPixelSize / 2,
+				cy: resolvedPixelSize / 2,
+				r: radius
+			})]
+		}), children ?? /* @__PURE__ */ jsxs("span", {
+			className: cn(circularProgressLabelVariants({
+				size: resolvedSize,
+				overlay: labelOverlay
+			})),
+			style: labelOverlay ? {
+				width: labelSize,
+				height: labelSize
+			} : void 0,
+			children: [progress, "%"]
+		})]
+	});
+}
+//#endregion
+export { CircularProgress, Progress, ProgressCaption, ProgressIndicator, ProgressLabel, ProgressTrack, ProgressValue, circularProgressVariants, progressVariants };

package/dist/property-listing-card.d.ts

@@ -1,23 +1,20 @@
-import * as class_variance_authority_types from 'class-variance-authority/types';
-import { useRender } from '@base-ui/react/use-render';
-import { VariantProps } from 'class-variance-authority';
-import * as React from 'react';
-import { Button, ButtonLink } from './button.js';
-import '@base-ui/react/button';
-
+import { n as ButtonLink, t as Button } from "./button-BZIeyUw6.js";
+import { useRender } from "@base-ui/react/use-render";
+import { VariantProps } from "class-variance-authority";
+import * as React from "react";
+//#region src/property-listing-card.d.ts
 declare const propertyListingCardVariants: (props?: ({
-    variant?: "default" | "elevated" | null | undefined;
-} & class_variance_authority_types.ClassProp) | undefined) => string;
+  variant?: "default" | "elevated" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
 type PropertyListingImage = {
-    id?: string;
-    src?: string;
-    alt?: string;
+  id?: string;
+  src?: string;
+  alt?: string;
 };
-interface PropertyListingCardProps extends React.ComponentProps<"article">, VariantProps<typeof propertyListingCardVariants> {
-}
+interface PropertyListingCardProps extends React.ComponentProps<"article">, VariantProps<typeof propertyListingCardVariants> {}
 declare function PropertyListingCard({ className, variant, ...props }: PropertyListingCardProps): React.JSX.Element;
 declare function PropertyListingCardMedia({ className, images, children, ...props }: React.ComponentProps<"div"> & {
-    images?: PropertyListingImage[];
+  images?: PropertyListingImage[];
 }): React.JSX.Element;
 declare function PropertyListingCardMediaTop({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
 declare function PropertyListingCardOptionsBar({ className, render, ...props }: useRender.ComponentProps<"a">): React.ReactElement<unknown, string | React.JSXElementConstructor<any>>;
@@ -28,5 +25,5 @@ declare function PropertyListingCardBadges({ className, ...props }: React.Compon
 declare function PropertyListingCardActions({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
 declare function PropertyListingCardActionButton({ className, type, ...props }: React.ComponentProps<typeof Button>): React.JSX.Element;
 declare function PropertyListingCardActionButtonLink({ className, ...props }: React.ComponentProps<typeof ButtonLink>): React.JSX.Element;
-
-export { PropertyListingCard, PropertyListingCardActionButton, PropertyListingCardActionButtonLink, PropertyListingCardActions, PropertyListingCardBadges, PropertyListingCardDetails, PropertyListingCardMedia, PropertyListingCardMediaTop, PropertyListingCardOptionsBar, PropertyListingCardOverview, type PropertyListingCardProps, PropertyListingCardTitle, type PropertyListingImage, propertyListingCardVariants };
+//#endregion
+export { PropertyListingCard, PropertyListingCardActionButton, PropertyListingCardActionButtonLink, PropertyListingCardActions, PropertyListingCardBadges, PropertyListingCardDetails, PropertyListingCardMedia, PropertyListingCardMediaTop, PropertyListingCardOptionsBar, PropertyListingCardOverview, type PropertyListingCardProps, PropertyListingCardTitle, type PropertyListingImage, propertyListingCardVariants };