@giddaa-housing/ui 0.1.0 → 1.0.0

package/dist/price-tag.js

@@ -0,0 +1,178 @@
+"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 { 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;
+}
+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
+              );
+            })
+          }
+        ) }) })
+      ]
+    }
+  );
+}
+export {
+  PriceTag,
+  priceTagVariants
+};
+//# sourceMappingURL=price-tag.js.map

package/dist/price-tag.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/price-tag.tsx"],"sourcesContent":["\"use client\";\n\nimport { Popover as PopoverPrimitive } from \"@base-ui/react/popover\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport { Check, ChevronDown } from \"lucide-react\";\nimport type * as React from \"react\";\n\nimport { cn } from \"./lib/cn\";\n\nconst priceTagVariants = cva(\n\t\"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\",\n\t{\n\t\tvariants: {\n\t\t\tsize: {\n\t\t\t\txxs: \"min-h-7 gap-1 px-2.5 py-0.75 text-gdt-subtext [&>svg]:size-3\",\n\t\t\t\txs: \"min-h-7.5 gap-1 px-3 py-1 text-gdt-xs [&>svg]:size-3.5\",\n\t\t\t\tsm: \"min-h-9 gap-1.5 px-4 py-1.5 text-gdt-sm [&>svg]:size-3.5\",\n\t\t\t\tmd: \"min-h-10.5 gap-1.5 px-5 py-2 text-gdt-md [&>svg]:size-4\",\n\t\t\t\tlg: \"min-h-13 gap-2 px-7 py-3 text-gdt-lg [&>svg]:size-4.5\",\n\t\t\t},\n\t\t\thasMonthlyPayment: {\n\t\t\t\ttrue: \"items-start\",\n\t\t\t\tfalse: \"\",\n\t\t\t},\n\t\t},\n\t\tdefaultVariants: {\n\t\t\tsize: \"md\",\n\t\t\thasMonthlyPayment: false,\n\t\t},\n\t},\n);\n\ntype PriceTagSize = NonNullable<VariantProps<typeof priceTagVariants>[\"size\"]>;\n\ntype PriceTagCurrencyOption = {\n\tcode: string;\n\tamount: string;\n\tshortAmount?: string;\n\tmonthlyPayment?: string;\n\tmonthlyPaymentLabel?: string;\n};\n\ntype PriceTagFormat = \"full\" | \"shortened\";\n\ntype PriceTagProps = Omit<React.ComponentProps<\"button\">, \"children\"> & {\n\tamount: string;\n\tshortAmount?: string;\n\tformat?: PriceTagFormat;\n\tsize?: PriceTagSize;\n\tmonthlyPayment?: string;\n\tmonthlyPaymentLabel?: string;\n\tcurrencies?: PriceTagCurrencyOption[];\n\tselectedCurrency?: string;\n\tonCurrencyChange?: (currency: PriceTagCurrencyOption) => void;\n\topen?: boolean;\n\tdefaultOpen?: boolean;\n\tonOpenChange?: (open: boolean) => void;\n\tpopoverClassName?: string;\n};\n\nfunction getDisplayAmount({\n\tamount,\n\tshortAmount,\n\tformat,\n}: Pick<PriceTagProps, \"amount\" | \"shortAmount\" | \"format\">) {\n\treturn format === \"shortened\" && shortAmount ? shortAmount : amount;\n}\n\nfunction PriceTag({\n\tamount,\n\tshortAmount,\n\tformat = \"full\",\n\tsize = \"md\",\n\tmonthlyPayment,\n\tmonthlyPaymentLabel = \"Low as\",\n\tcurrencies,\n\tselectedCurrency,\n\tonCurrencyChange,\n\topen,\n\tdefaultOpen,\n\tonOpenChange,\n\tclassName,\n\tpopoverClassName,\n\ttype = \"button\",\n\t...props\n}: PriceTagProps) {\n\tconst hasDropdown = Boolean(currencies?.length);\n\tconst canShowMonthlyPayment = size === \"md\" || size === \"lg\";\n\tconst displayMonthlyPayment =\n\t\tcanShowMonthlyPayment && monthlyPayment\n\t\t\t? `${monthlyPaymentLabel} ${monthlyPayment} monthly`\n\t\t\t: undefined;\n\tconst displayAmount = getDisplayAmount({ amount, shortAmount, format });\n\n\tconst pill = (\n\t\t<span className=\"flex min-w-0 flex-col gap-1\">\n\t\t\t<span>{displayAmount}</span>\n\t\t\t{displayMonthlyPayment ? (\n\t\t\t\t<span\n\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\"hidden text-gdt-subtext font-medium leading-none opacity-90\",\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\"inline-block\": size === \"md\",\n\t\t\t\t\t\t\t\"inline-block text-gdt-xs\": size === \"lg\",\n\t\t\t\t\t\t},\n\t\t\t\t\t)}\n\t\t\t\t>\n\t\t\t\t\t{displayMonthlyPayment}\n\t\t\t\t</span>\n\t\t\t) : null}\n\t\t</span>\n\t);\n\n\tif (!hasDropdown) {\n\t\treturn (\n\t\t\t<span\n\t\t\t\tdata-slot=\"price-tag\"\n\t\t\t\tclassName={cn(\n\t\t\t\t\tpriceTagVariants({\n\t\t\t\t\t\tsize,\n\t\t\t\t\t\thasMonthlyPayment: Boolean(displayMonthlyPayment),\n\t\t\t\t\t}),\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t{pill}\n\t\t\t</span>\n\t\t);\n\t}\n\n\treturn (\n\t\t<PopoverPrimitive.Root\n\t\t\topen={open}\n\t\t\tdefaultOpen={defaultOpen}\n\t\t\tonOpenChange={onOpenChange}\n\t\t>\n\t\t\t<PopoverPrimitive.Trigger\n\t\t\t\tdata-slot=\"price-tag\"\n\t\t\t\tdata-interactive=\"true\"\n\t\t\t\ttype={type}\n\t\t\t\tclassName={cn(\n\t\t\t\t\tpriceTagVariants({\n\t\t\t\t\t\tsize,\n\t\t\t\t\t\thasMonthlyPayment: Boolean(displayMonthlyPayment),\n\t\t\t\t\t}),\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{pill}\n\t\t\t\t<ChevronDown\n\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\tclassName=\"transition-transform group-data-popup-open/price-tag:rotate-180\"\n\t\t\t\t/>\n\t\t\t</PopoverPrimitive.Trigger>\n\t\t\t<PopoverPrimitive.Portal>\n\t\t\t\t<PopoverPrimitive.Positioner sideOffset={10} align=\"start\">\n\t\t\t\t\t<PopoverPrimitive.Popup\n\t\t\t\t\t\tdata-slot=\"price-tag-popover\"\n\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\"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\",\n\t\t\t\t\t\t\tpopoverClassName,\n\t\t\t\t\t\t)}\n\t\t\t\t\t>\n\t\t\t\t\t\t{currencies?.map((currency) => {\n\t\t\t\t\t\t\tconst active = currency.code === selectedCurrency;\n\t\t\t\t\t\t\tconst optionAmount = getDisplayAmount({\n\t\t\t\t\t\t\t\tamount: currency.amount,\n\t\t\t\t\t\t\t\tshortAmount: currency.shortAmount,\n\t\t\t\t\t\t\t\tformat,\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t\tconst optionMonthlyPayment = currency.monthlyPayment\n\t\t\t\t\t\t\t\t? `${currency.monthlyPaymentLabel ?? \"As low as\"} ${\n\t\t\t\t\t\t\t\t\t\tcurrency.monthlyPayment\n\t\t\t\t\t\t\t\t\t} per month`\n\t\t\t\t\t\t\t\t: undefined;\n\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\tkey={currency.code}\n\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\tdata-active={active ? \"true\" : undefined}\n\t\t\t\t\t\t\t\t\tclassName=\"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\"\n\t\t\t\t\t\t\t\t\tonClick={() => onCurrencyChange?.(currency)}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<span className=\"min-w-10 text-gdt-sm font-semibold text-fg-brand\">\n\t\t\t\t\t\t\t\t\t\t{currency.code}\n\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t<span className=\"ml-auto flex min-w-0 flex-col items-end\">\n\t\t\t\t\t\t\t\t\t\t<span className=\"text-gdt-sm font-bold text-fg-primary\">\n\t\t\t\t\t\t\t\t\t\t\t{optionAmount}\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t{optionMonthlyPayment ? (\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"text-gdt-xs text-fg-secondary\">\n\t\t\t\t\t\t\t\t\t\t\t\t{optionMonthlyPayment}\n\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t) : null}\n\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t{active ? (\n\t\t\t\t\t\t\t\t\t\t<Check\n\t\t\t\t\t\t\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"size-4 shrink-0 text-fg-brand\"\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t) : null}\n\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t})}\n\t\t\t\t\t</PopoverPrimitive.Popup>\n\t\t\t\t</PopoverPrimitive.Positioner>\n\t\t\t</PopoverPrimitive.Portal>\n\t\t</PopoverPrimitive.Root>\n\t);\n}\n\nexport {\n\tPriceTag,\n\tpriceTagVariants,\n\ttype PriceTagCurrencyOption,\n\ttype PriceTagFormat,\n\ttype PriceTagProps,\n\ttype PriceTagSize,\n};\n"],"mappings":"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","names":[]}

package/dist/progress.d.ts

@@ -13,9 +13,12 @@ type ProgressProps = Progress$1.Root.Props & VariantProps<typeof progressVariant
     disabled?: boolean;
 };
 type ProgressSize = NonNullable<VariantProps<typeof progressVariants>["size"]>;
-type CircularProgressProps = Omit<React.ComponentProps<"div">, "children"> & VariantProps<typeof circularProgressVariants> & {
+type CircularProgressProps = React.ComponentProps<"div"> & VariantProps<typeof circularProgressVariants> & {
     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;
@@ -23,6 +26,6 @@ declare function ProgressIndicator({ className, ...props }: Progress$1.Indicator
 declare function ProgressLabel({ className, ...props }: Progress$1.Label.Props): React.JSX.Element;
 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, labelOverlay, ...props }: CircularProgressProps): 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 };

package/dist/progress.js

@@ -1,306 +1,17 @@
-// src/components/ui/progress.tsx
-import { Progress as ProgressPrimitive } from "@base-ui/react/progress";
-import { cva } from "class-variance-authority";
-import * as React from "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));
-}
-
-// src/components/ui/size-context.tsx
-import { createContext, useContext } from "react";
-import { Fragment, jsx } from "react/jsx-runtime";
-var SizeContext = createContext(void 0);
-function SizeProvider({
-  children,
-  size
-}) {
-  if (!size) {
-    return /* @__PURE__ */ jsx(Fragment, { children });
-  }
-  return /* @__PURE__ */ jsx(SizeContext.Provider, { value: size, children });
-}
-function useComponentSize(size, fallback = "md") {
-  const inheritedSize = useContext(SizeContext);
-  return size ?? inheritedSize ?? fallback;
-}
-
-// src/components/ui/progress.tsx
-import { jsx as jsx2, jsxs } from "react/jsx-runtime";
-var 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"
-    }
-  }
-);
-var 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"
-    }
-  }
-);
-var 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
-    }
-  }
-);
-var circularProgressSizes = {
-  sm: { pixelSize: 40, strokeWidth: 3 },
-  md: { pixelSize: 48, strokeWidth: 4 },
-  lg: { pixelSize: 56, strokeWidth: 5 }
-};
-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__ */ jsx2(SizeProvider, { size: resolvedSize, children: /* @__PURE__ */ jsxs(
-    ProgressPrimitive.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__ */ jsx2(ProgressTrack, { children: /* @__PURE__ */ jsx2(ProgressIndicator, {}) })
-      ]
-    }
-  ) });
-}
-function ProgressTrack({ className, ...props }) {
-  return /* @__PURE__ */ jsx2(
-    ProgressPrimitive.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__ */ jsx2(
-    ProgressPrimitive.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__ */ jsx2(
-    ProgressPrimitive.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__ */ jsx2(
-    ProgressPrimitive.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__ */ jsx2(
-    "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,
-  labelOverlay = false,
-  ...props
-}) {
-  const resolvedSize = useComponentSize(size);
-  const normalizedValue = Number.isFinite(value) ? value : 0;
-  const progress = Math.min(100, Math.max(0, Math.round(normalizedValue)));
-  const { pixelSize, strokeWidth } = circularProgressSizes[resolvedSize];
-  const radius = (pixelSize - strokeWidth * 2) / 2;
-  const labelSize = pixelSize - strokeWidth * 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: pixelSize, height: pixelSize, ...style },
-      ...props,
-      children: [
-        /* @__PURE__ */ jsxs(
-          "svg",
-          {
-            "aria-hidden": "true",
-            className: "absolute inset-0 -rotate-90 transform",
-            focusable: "false",
-            width: pixelSize,
-            height: pixelSize,
-            viewBox: `0 0 ${pixelSize} ${pixelSize}`,
-            fill: "none",
-            stroke: "currentColor",
-            children: [
-              /* @__PURE__ */ jsx2(
-                "circle",
-                {
-                  className: "text-primary/25",
-                  strokeWidth,
-                  cx: pixelSize / 2,
-                  cy: pixelSize / 2,
-                  r: radius
-                }
-              ),
-              /* @__PURE__ */ jsx2(
-                "circle",
-                {
-                  className: "text-surface-brand transition-[stroke-dashoffset] duration-300 ease-linear",
-                  strokeWidth,
-                  strokeLinecap: "round",
-                  strokeDasharray: circumference,
-                  strokeDashoffset,
-                  cx: pixelSize / 2,
-                  cy: pixelSize / 2,
-                  r: radius
-                }
-              )
-            ]
-          }
-        ),
-        /* @__PURE__ */ jsxs(
-          "span",
-          {
-            className: cn(
-              circularProgressLabelVariants({
-                size: resolvedSize,
-                overlay: labelOverlay
-              })
-            ),
-            style: labelOverlay ? { width: labelSize, height: labelSize } : void 0,
-            children: [
-              progress,
-              "%"
-            ]
-          }
-        )
-      ]
-    }
-  );
-}
+"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,

package/dist/progress.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/ui/progress.tsx","../src/lib/cn.ts","../src/components/ui/size-context.tsx"],"sourcesContent":["\"use client\";\n\nimport { Progress as ProgressPrimitive } from \"@base-ui/react/progress\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport * as React from \"react\";\n\nimport { cn } from \"../../lib/cn\";\nimport {\n\ttype ComponentSize,\n\tSizeProvider,\n\tuseComponentSize,\n} from \"./size-context\";\n\nconst progressVariants = cva(\n\t\"group/progress flex w-full flex-wrap items-center\",\n\t{\n\t\tvariants: {\n\t\t\tsize: {\n\t\t\t\tsm: \"gap-x-2 gap-y-1.5\",\n\t\t\t\tmd: \"gap-x-3 gap-y-2\",\n\t\t\t\tlg: \"gap-x-4 gap-y-2.5\",\n\t\t\t},\n\t\t},\n\t\tdefaultVariants: {\n\t\t\tsize: \"md\",\n\t\t},\n\t},\n);\n\nconst circularProgressVariants = cva(\n\t\"relative grid place-items-center text-fg-on-brand\",\n\t{\n\t\tvariants: {\n\t\t\tsize: {\n\t\t\t\tsm: \"text-[9px]\",\n\t\t\t\tmd: \"text-[10px]\",\n\t\t\t\tlg: \"text-gdt-xs\",\n\t\t\t},\n\t\t},\n\t\tdefaultVariants: {\n\t\t\tsize: \"md\",\n\t\t},\n\t},\n);\n\nconst circularProgressLabelVariants = cva(\n\t\"relative z-10 font-medium tabular-nums leading-none\",\n\t{\n\t\tvariants: {\n\t\t\tsize: {\n\t\t\t\tsm: \"text-[9px]\",\n\t\t\t\tmd: \"text-[10px]\",\n\t\t\t\tlg: \"text-gdt-xs\",\n\t\t\t},\n\t\t\toverlay: {\n\t\t\t\ttrue: \"grid place-items-center rounded-full bg-black/65 text-white shadow-sm backdrop-blur-[1px]\",\n\t\t\t\tfalse: \"\",\n\t\t\t},\n\t\t},\n\t\tdefaultVariants: {\n\t\t\tsize: \"md\",\n\t\t\toverlay: false,\n\t\t},\n\t},\n);\n\nconst circularProgressSizes: Record<\n\tComponentSize,\n\t{ pixelSize: number; strokeWidth: number }\n> = {\n\tsm: { pixelSize: 40, strokeWidth: 3 },\n\tmd: { pixelSize: 48, strokeWidth: 4 },\n\tlg: { pixelSize: 56, strokeWidth: 5 },\n};\n\ntype ProgressProps = ProgressPrimitive.Root.Props &\n\tVariantProps<typeof progressVariants> & {\n\t\tdisabled?: boolean;\n\t};\n\ntype ProgressSize = NonNullable<VariantProps<typeof progressVariants>[\"size\"]>;\n\ntype CircularProgressProps = Omit<React.ComponentProps<\"div\">, \"children\"> &\n\tVariantProps<typeof circularProgressVariants> & {\n\t\tvalue: number;\n\t\tlabelOverlay?: boolean;\n\t};\n\nfunction Progress({\n\tclassName,\n\tchildren,\n\tvalue,\n\tsize,\n\tdisabled = false,\n\t...props\n}: ProgressProps) {\n\tconst resolvedSize = useComponentSize(size);\n\tconst hasCustomTrack = React.Children.toArray(children).some(\n\t\t(child) => React.isValidElement(child) && child.type === ProgressTrack,\n\t);\n\n\treturn (\n\t\t<SizeProvider size={resolvedSize}>\n\t\t\t<ProgressPrimitive.Root\n\t\t\t\tvalue={value}\n\t\t\t\taria-disabled={disabled || undefined}\n\t\t\t\tdata-disabled={disabled}\n\t\t\t\tdata-size={resolvedSize}\n\t\t\t\tdata-slot=\"progress\"\n\t\t\t\tclassName={cn(progressVariants({ size: resolvedSize }), className)}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{children}\n\t\t\t\t{!hasCustomTrack && (\n\t\t\t\t\t<ProgressTrack>\n\t\t\t\t\t\t<ProgressIndicator />\n\t\t\t\t\t</ProgressTrack>\n\t\t\t\t)}\n\t\t\t</ProgressPrimitive.Root>\n\t\t</SizeProvider>\n\t);\n}\n\nfunction ProgressTrack({ className, ...props }: ProgressPrimitive.Track.Props) {\n\treturn (\n\t\t<ProgressPrimitive.Track\n\t\t\tclassName={cn(\n\t\t\t\t\"order-3 relative flex basis-full items-center overflow-hidden rounded-full bg-surface-raised\",\n\t\t\t\t\"group-data-[size=sm]/progress:h-1 group-data-[size=md]/progress:h-1.5 group-data-[size=lg]/progress:h-2\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\tdata-slot=\"progress-track\"\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nfunction ProgressIndicator({\n\tclassName,\n\t...props\n}: ProgressPrimitive.Indicator.Props) {\n\treturn (\n\t\t<ProgressPrimitive.Indicator\n\t\t\tdata-slot=\"progress-indicator\"\n\t\t\tclassName={cn(\n\t\t\t\t\"h-full rounded-full bg-action-primary transition-[width,transform,background-color] duration-300 ease-out group-data-[disabled=true]/progress:bg-line-strong\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nfunction ProgressLabel({ className, ...props }: ProgressPrimitive.Label.Props) {\n\treturn (\n\t\t<ProgressPrimitive.Label\n\t\t\tclassName={cn(\n\t\t\t\t\"order-1 min-w-0 text-fg-primary font-semibold leading-snug group-data-[disabled=true]/progress:text-fg-caption-placeholder\",\n\t\t\t\t\"group-data-[size=sm]/progress:text-gdt-xs group-data-[size=md]/progress:text-gdt-sm group-data-[size=lg]/progress:text-gdt-md\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\tdata-slot=\"progress-label\"\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nfunction ProgressValue({ className, ...props }: ProgressPrimitive.Value.Props) {\n\treturn (\n\t\t<ProgressPrimitive.Value\n\t\t\tclassName={cn(\n\t\t\t\t\"order-2 ml-auto shrink-0 tabular-nums text-fg-secondary leading-snug group-data-[disabled=true]/progress:text-fg-caption-placeholder\",\n\t\t\t\t\"group-data-[size=sm]/progress:text-gdt-xs group-data-[size=md]/progress:text-gdt-sm group-data-[size=lg]/progress:text-gdt-md\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\tdata-slot=\"progress-value\"\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nfunction ProgressCaption({ className, ...props }: React.ComponentProps<\"p\">) {\n\treturn (\n\t\t<p\n\t\t\tclassName={cn(\n\t\t\t\t\"order-4 basis-full text-fg-secondary leading-snug group-data-[disabled=true]/progress:text-fg-caption-placeholder\",\n\t\t\t\t\"group-data-[size=sm]/progress:text-gdt-subtext group-data-[size=md]/progress:text-gdt-xs group-data-[size=lg]/progress:text-gdt-sm\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\tdata-slot=\"progress-caption\"\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nfunction CircularProgress({\n\tclassName,\n\tstyle,\n\tvalue,\n\tsize,\n\tlabelOverlay = false,\n\t...props\n}: CircularProgressProps) {\n\tconst resolvedSize = useComponentSize(size);\n\tconst normalizedValue = Number.isFinite(value) ? value : 0;\n\tconst progress = Math.min(100, Math.max(0, Math.round(normalizedValue)));\n\tconst { pixelSize, strokeWidth } = circularProgressSizes[resolvedSize];\n\tconst radius = (pixelSize - strokeWidth * 2) / 2;\n\tconst labelSize = pixelSize - strokeWidth * 3;\n\tconst circumference = 2 * Math.PI * radius;\n\tconst strokeDashoffset = circumference - (progress / 100) * circumference;\n\n\treturn (\n\t\t<div\n\t\t\trole=\"progressbar\"\n\t\t\taria-valuemin={0}\n\t\t\taria-valuemax={100}\n\t\t\taria-valuenow={progress}\n\t\t\taria-valuetext={`${progress}%`}\n\t\t\tdata-slot=\"circular-progress\"\n\t\t\tclassName={cn(\n\t\t\t\tcircularProgressVariants({ size: resolvedSize }),\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\tstyle={{ width: pixelSize, height: pixelSize, ...style }}\n\t\t\t{...props}\n\t\t>\n\t\t\t<svg\n\t\t\t\taria-hidden=\"true\"\n\t\t\t\tclassName=\"absolute inset-0 -rotate-90 transform\"\n\t\t\t\tfocusable=\"false\"\n\t\t\t\twidth={pixelSize}\n\t\t\t\theight={pixelSize}\n\t\t\t\tviewBox={`0 0 ${pixelSize} ${pixelSize}`}\n\t\t\t\tfill=\"none\"\n\t\t\t\tstroke=\"currentColor\"\n\t\t\t>\n\t\t\t\t<circle\n\t\t\t\t\tclassName=\"text-primary/25\"\n\t\t\t\t\tstrokeWidth={strokeWidth}\n\t\t\t\t\tcx={pixelSize / 2}\n\t\t\t\t\tcy={pixelSize / 2}\n\t\t\t\t\tr={radius}\n\t\t\t\t/>\n\t\t\t\t<circle\n\t\t\t\t\tclassName=\"text-surface-brand transition-[stroke-dashoffset] duration-300 ease-linear\"\n\t\t\t\t\tstrokeWidth={strokeWidth}\n\t\t\t\t\tstrokeLinecap=\"round\"\n\t\t\t\t\tstrokeDasharray={circumference}\n\t\t\t\t\tstrokeDashoffset={strokeDashoffset}\n\t\t\t\t\tcx={pixelSize / 2}\n\t\t\t\t\tcy={pixelSize / 2}\n\t\t\t\t\tr={radius}\n\t\t\t\t/>\n\t\t\t</svg>\n\n\t\t\t<span\n\t\t\t\tclassName={cn(\n\t\t\t\t\tcircularProgressLabelVariants({\n\t\t\t\t\t\tsize: resolvedSize,\n\t\t\t\t\t\toverlay: labelOverlay,\n\t\t\t\t\t}),\n\t\t\t\t)}\n\t\t\t\tstyle={\n\t\t\t\t\tlabelOverlay ? { width: labelSize, height: labelSize } : undefined\n\t\t\t\t}\n\t\t\t>\n\t\t\t\t{progress}%\n\t\t\t</span>\n\t\t</div>\n\t);\n}\n\n/**\n * Composition example\n *\n * <Progress value={60} size=\"md\">\n *  <ProgressLabel>Progress</ProgressLabel>\n *  <ProgressValue>{(formatted) => formatted}</ProgressValue>\n *  <ProgressCaption>\n *\t  Uploading 3 files... Please don't close the window.\n *  </ProgressCaption>\n * </Progress>\n */\n\nexport {\n\tCircularProgress,\n\tProgress,\n\tProgressTrack,\n\tProgressIndicator,\n\tProgressLabel,\n\tProgressValue,\n\tProgressCaption,\n\tcircularProgressVariants,\n\tprogressVariants,\n\ttype CircularProgressProps,\n\ttype ProgressProps,\n\ttype ProgressSize,\n};\n","import { type ClassValue, clsx } from \"clsx\";\nimport { extendTailwindMerge } from \"tailwind-merge\";\n\nconst twMerge = extendTailwindMerge({\n\textend: {\n\t\tclassGroups: {\n\t\t\t\"font-size\": [\n\t\t\t\t{\n\t\t\t\t\ttext: [\n\t\t\t\t\t\t\"gdt-display\",\n\t\t\t\t\t\t\"gdt-h1\",\n\t\t\t\t\t\t\"gdt-h2\",\n\t\t\t\t\t\t\"gdt-h3\",\n\t\t\t\t\t\t\"gdt-h4\",\n\t\t\t\t\t\t\"gdt-h5\",\n\t\t\t\t\t\t\"gdt-xl\",\n\t\t\t\t\t\t\"gdt-lg\",\n\t\t\t\t\t\t\"gdt-md\",\n\t\t\t\t\t\t\"gdt-sm\",\n\t\t\t\t\t\t\"gdt-xs\",\n\t\t\t\t\t\t\"gdt-subtext\",\n\t\t\t\t\t\t\"gdt-capitalized\",\n\t\t\t\t\t],\n\t\t\t\t},\n\t\t\t],\n\t\t},\n\t},\n});\n\nexport function cn(...inputs: ClassValue[]) {\n\treturn twMerge(clsx(inputs));\n}\n","\"use client\";\n\nimport { createContext, type ReactNode, useContext } from \"react\";\n\ntype ComponentSize = \"sm\" | \"md\" | \"lg\";\n\nconst SizeContext = createContext<ComponentSize | undefined>(undefined);\n\nfunction SizeProvider({\n\tchildren,\n\tsize,\n}: {\n\tchildren: ReactNode;\n\tsize?: ComponentSize | null;\n}) {\n\tif (!size) {\n\t\treturn <>{children}</>;\n\t}\n\n\treturn <SizeContext.Provider value={size}>{children}</SizeContext.Provider>;\n}\n\nfunction useComponentSize(\n\tsize?: ComponentSize | null,\n\tfallback: ComponentSize = \"md\",\n) {\n\tconst inheritedSize = useContext(SizeContext);\n\treturn size ?? inheritedSize ?? fallback;\n}\n\nexport { SizeProvider, useComponentSize, type ComponentSize };\n"],"mappings":"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","names":["jsx"]}
+{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

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

@@ -0,0 +1,32 @@
+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';
+
+declare const propertyListingCardVariants: (props?: ({
+    variant?: "default" | "elevated" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type PropertyListingImage = {
+    id?: string;
+    src?: string;
+    alt?: string;
+};
+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[];
+}): 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>>;
+declare function PropertyListingCardDetails({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+declare function PropertyListingCardTitle({ className, ...props }: React.ComponentProps<"h3">): React.JSX.Element;
+declare function PropertyListingCardOverview({ className, ...props }: React.ComponentProps<"p">): React.JSX.Element;
+declare function PropertyListingCardBadges({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
+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 };