@axtec/components 0.1.5 → 0.1.6

package/dist/index51.js.map

@@ -1 +1 @@
-{"version":3,"file":"index51.js","sources":["../src/components/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import { cn } from '@/lib/utils'\n\nexport interface RadioOption {\n  value: string\n  label: string\n  description?: string\n  disabled?: boolean\n}\n\nexport interface RadioGroupProps {\n  options: RadioOption[]\n  value?: string\n  onChange?: (value: string) => void\n  name: string\n  orientation?: 'horizontal' | 'vertical'\n  className?: string\n}\n\nexport function RadioGroup({\n  options,\n  value,\n  onChange,\n  name,\n  orientation = 'vertical',\n  className,\n}: RadioGroupProps) {\n  return (\n    <div\n      className={cn(\n        'flex gap-3',\n        orientation === 'vertical' ? 'flex-col' : 'flex-row flex-wrap',\n        className\n      )}\n      role=\"radiogroup\"\n    >\n      {options.map((option) => (\n        <label\n          key={option.value}\n          className={cn(\n            'flex items-start gap-3 cursor-pointer group',\n            option.disabled && 'opacity-50 cursor-not-allowed'\n          )}\n        >\n          <div className=\"relative flex-shrink-0 mt-0.5\">\n            <input\n              type=\"radio\"\n              name={name}\n              value={option.value}\n              checked={value === option.value}\n              onChange={() => onChange?.(option.value)}\n              disabled={option.disabled}\n              className=\"peer sr-only\"\n            />\n            <div\n              className={cn(\n                'h-5 w-5 rounded-full border-2 transition-colors duration-200',\n                'flex items-center justify-center',\n                'peer-focus:ring-2 peer-focus:ring-primary-500 peer-focus:ring-offset-2',\n                value === option.value\n                  ? 'border-primary-500'\n                  : 'border-slate-300 group-hover:border-slate-400'\n              )}\n            >\n              {value === option.value && (\n                <div className=\"h-2.5 w-2.5 rounded-full bg-primary-500\" />\n              )}\n            </div>\n          </div>\n          <div className=\"flex flex-col\">\n            <span className=\"text-sm font-medium text-slate-900\">\n              {option.label}\n            </span>\n            {option.description && (\n              <span className=\"text-sm text-slate-500\">{option.description}</span>\n            )}\n          </div>\n        </label>\n      ))}\n    </div>\n  )\n}\n"],"names":["RadioGroup","options","value","onChange","name","orientation","className","jsx","cn","option","jsxs"],"mappings":";;AAkBO,SAASA,EAAW;AAAA,EACzB,SAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,MAAAC;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,WAAAC;AACF,GAAoB;AAClB,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACT;AAAA,QACAH,MAAgB,aAAa,aAAa;AAAA,QAC1CC;AAAA,MAAA;AAAA,MAEF,MAAK;AAAA,MAEJ,UAAAL,EAAQ,IAAI,CAACQ,MACZ,gBAAAC;AAAA,QAAC;AAAA,QAAA;AAAA,UAEC,WAAWF;AAAA,YACT;AAAA,YACAC,EAAO,YAAY;AAAA,UAAA;AAAA,UAGrB,UAAA;AAAA,YAAA,gBAAAC,EAAC,OAAA,EAAI,WAAU,iCACb,UAAA;AAAA,cAAA,gBAAAH;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,MAAK;AAAA,kBACL,MAAAH;AAAA,kBACA,OAAOK,EAAO;AAAA,kBACd,SAASP,MAAUO,EAAO;AAAA,kBAC1B,UAAU,MAAMN,KAAA,gBAAAA,EAAWM,EAAO;AAAA,kBAClC,UAAUA,EAAO;AAAA,kBACjB,WAAU;AAAA,gBAAA;AAAA,cAAA;AAAA,cAEZ,gBAAAF;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,WAAWC;AAAA,oBACT;AAAA,oBACA;AAAA,oBACA;AAAA,oBACAN,MAAUO,EAAO,QACb,uBACA;AAAA,kBAAA;AAAA,kBAGL,gBAAUA,EAAO,SAChB,gBAAAF,EAAC,OAAA,EAAI,WAAU,0CAAA,CAA0C;AAAA,gBAAA;AAAA,cAAA;AAAA,YAE7D,GACF;AAAA,YACA,gBAAAG,EAAC,OAAA,EAAI,WAAU,iBACb,UAAA;AAAA,cAAA,gBAAAH,EAAC,QAAA,EAAK,WAAU,sCACb,UAAAE,EAAO,OACV;AAAA,cACCA,EAAO,eACN,gBAAAF,EAAC,UAAK,WAAU,0BAA0B,YAAO,YAAA,CAAY;AAAA,YAAA,EAAA,CAEjE;AAAA,UAAA;AAAA,QAAA;AAAA,QAtCKE,EAAO;AAAA,MAAA,CAwCf;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"index51.js","sources":["../src/components/QuickActions/QuickActions.tsx"],"sourcesContent":["import { type ReactNode } from 'react'\nimport { cn } from '@/lib/utils'\n\nexport interface QuickActionsProps {\n  children: ReactNode\n  bottom?: number\n  right?: number\n  className?: string\n}\n\nexport const QuickActions = ({\n  children,\n  bottom = 60,\n  right = 18,\n  className,\n}: QuickActionsProps) => {\n  return (\n    <div\n      className={cn('fixed z-10', className)}\n      style={{ bottom: `${bottom}px`, right: `${right}px` }}\n    >\n      {children}\n    </div>\n  )\n}\n"],"names":["QuickActions","children","bottom","right","className","jsx","cn"],"mappings":";;AAUO,MAAMA,IAAe,CAAC;AAAA,EAC3B,UAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,OAAAC,IAAQ;AAAA,EACR,WAAAC;AACF,MAEI,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAWC,EAAG,cAAcF,CAAS;AAAA,IACrC,OAAO,EAAE,QAAQ,GAAGF,CAAM,MAAM,OAAO,GAAGC,CAAK,KAAA;AAAA,IAE9C,UAAAF;AAAA,EAAA;AAAA;"}

package/dist/index52.js

@@ -1,57 +1,68 @@
-import { jsxs as S, jsx as e } from "react/jsx-runtime";
-import { useState as M } from "react";
-import { cn as r } from "./index3.js";
-import { StarIcon as V } from "@heroicons/react/24/solid";
-import { StarIcon as w } from "@heroicons/react/24/outline";
-const y = {
-  sm: "w-4 h-4",
-  md: "w-6 h-6",
-  lg: "w-8 h-8"
-}, E = ({
-  value: d = 0,
-  onChange: n,
-  max: a = 5,
-  size: p = "md",
-  readonly: t = !1,
-  label: l,
-  error: c,
-  className: h
-}) => {
-  const [i, m] = M(null), x = (s) => {
-    !t && n && n(s);
-  }, b = (s) => {
-    t || m(s);
-  }, g = () => {
-    m(null);
-  }, v = i !== null ? i : d, u = y[p];
-  return /* @__PURE__ */ S("div", { className: r("flex flex-col", h), children: [
-    l && /* @__PURE__ */ e("span", { className: "text-sm font-semibold text-slate-700 mb-2", children: l }),
-    /* @__PURE__ */ e("div", { className: "flex items-center gap-1", children: Array.from({ length: a }, (s, f) => {
-      const o = f + 1, N = o <= v;
-      return /* @__PURE__ */ e(
-        "button",
+import { jsx as r, jsxs as s } from "react/jsx-runtime";
+import { cn as c } from "./index3.js";
+function o({
+  options: d,
+  value: l,
+  onChange: a,
+  name: i,
+  orientation: t = "vertical",
+  className: m
+}) {
+  return /* @__PURE__ */ r(
+    "div",
+    {
+      className: c(
+        "flex gap-3",
+        t === "vertical" ? "flex-col" : "flex-row flex-wrap",
+        m
+      ),
+      role: "radiogroup",
+      children: d.map((e) => /* @__PURE__ */ s(
+        "label",
         {
-          type: "button",
-          onClick: () => x(o),
-          onMouseEnter: () => b(o),
-          onMouseLeave: g,
-          disabled: t,
-          className: r(
-            "p-0 border-0 bg-transparent",
-            t ? "cursor-default" : "cursor-pointer",
-            "transition-transform hover:scale-110",
-            "focus:outline-none focus:ring-2 focus:ring-primary-500 focus:ring-offset-1 rounded"
+          className: c(
+            "flex items-start gap-3 cursor-pointer group",
+            e.disabled && "opacity-50 cursor-not-allowed"
           ),
-          "aria-label": `Rate ${o} out of ${a}`,
-          children: N ? /* @__PURE__ */ e(V, { className: r(u, "text-primary-500") }) : /* @__PURE__ */ e(w, { className: r(u, "text-slate-300") })
+          children: [
+            /* @__PURE__ */ s("div", { className: "relative flex-shrink-0 mt-0.5", children: [
+              /* @__PURE__ */ r(
+                "input",
+                {
+                  type: "radio",
+                  name: i,
+                  value: e.value,
+                  checked: l === e.value,
+                  onChange: () => a == null ? void 0 : a(e.value),
+                  disabled: e.disabled,
+                  className: "peer sr-only"
+                }
+              ),
+              /* @__PURE__ */ r(
+                "div",
+                {
+                  className: c(
+                    "h-5 w-5 rounded-full border-2 transition-colors duration-200",
+                    "flex items-center justify-center",
+                    "peer-focus:ring-2 peer-focus:ring-primary-500 peer-focus:ring-offset-2",
+                    l === e.value ? "border-primary-500" : "border-slate-300 group-hover:border-slate-400"
+                  ),
+                  children: l === e.value && /* @__PURE__ */ r("div", { className: "h-2.5 w-2.5 rounded-full bg-primary-500" })
+                }
+              )
+            ] }),
+            /* @__PURE__ */ s("div", { className: "flex flex-col", children: [
+              /* @__PURE__ */ r("span", { className: "text-sm font-medium text-slate-900", children: e.label }),
+              e.description && /* @__PURE__ */ r("span", { className: "text-sm text-slate-500", children: e.description })
+            ] })
+          ]
         },
-        f
-      );
-    }) }),
-    c && /* @__PURE__ */ e("span", { className: "text-sm text-red-500 mt-1", children: c })
-  ] });
-};
+        e.value
+      ))
+    }
+  );
+}
 export {
-  E as Rating
+  o as RadioGroup
 };
 //# sourceMappingURL=index52.js.map

package/dist/index52.js.map

@@ -1 +1 @@
-{"version":3,"file":"index52.js","sources":["../src/components/Rating/Rating.tsx"],"sourcesContent":["import { useState } from 'react'\nimport { cn } from '@/lib/utils'\nimport { StarIcon as StarSolid } from '@heroicons/react/24/solid'\nimport { StarIcon as StarOutline } from '@heroicons/react/24/outline'\n\nexport interface RatingProps {\n  value?: number\n  onChange?: (rating: number) => void\n  max?: number\n  size?: 'sm' | 'md' | 'lg'\n  readonly?: boolean\n  label?: string\n  error?: string\n  className?: string\n}\n\nconst sizeStyles = {\n  sm: 'w-4 h-4',\n  md: 'w-6 h-6',\n  lg: 'w-8 h-8',\n}\n\nexport const Rating = ({\n  value = 0,\n  onChange,\n  max = 5,\n  size = 'md',\n  readonly = false,\n  label,\n  error,\n  className,\n}: RatingProps) => {\n  const [hoverValue, setHoverValue] = useState<number | null>(null)\n\n  const handleClick = (rating: number) => {\n    if (!readonly && onChange) {\n      onChange(rating)\n    }\n  }\n\n  const handleMouseEnter = (rating: number) => {\n    if (!readonly) {\n      setHoverValue(rating)\n    }\n  }\n\n  const handleMouseLeave = () => {\n    setHoverValue(null)\n  }\n\n  const displayValue = hoverValue !== null ? hoverValue : value\n  const iconClass = sizeStyles[size]\n\n  return (\n    <div className={cn('flex flex-col', className)}>\n      {label && (\n        <span className=\"text-sm font-semibold text-slate-700 mb-2\">\n          {label}\n        </span>\n      )}\n      <div className=\"flex items-center gap-1\">\n        {Array.from({ length: max }, (_, index) => {\n          const starValue = index + 1\n          const isFilled = starValue <= displayValue\n\n          return (\n            <button\n              key={index}\n              type=\"button\"\n              onClick={() => handleClick(starValue)}\n              onMouseEnter={() => handleMouseEnter(starValue)}\n              onMouseLeave={handleMouseLeave}\n              disabled={readonly}\n              className={cn(\n                'p-0 border-0 bg-transparent',\n                readonly ? 'cursor-default' : 'cursor-pointer',\n                'transition-transform hover:scale-110',\n                'focus:outline-none focus:ring-2 focus:ring-primary-500 focus:ring-offset-1 rounded'\n              )}\n              aria-label={`Rate ${starValue} out of ${max}`}\n            >\n              {isFilled ? (\n                <StarSolid className={cn(iconClass, 'text-primary-500')} />\n              ) : (\n                <StarOutline className={cn(iconClass, 'text-slate-300')} />\n              )}\n            </button>\n          )\n        })}\n      </div>\n      {error && (\n        <span className=\"text-sm text-red-500 mt-1\">{error}</span>\n      )}\n    </div>\n  )\n}\n"],"names":["sizeStyles","Rating","value","onChange","max","size","readonly","label","error","className","hoverValue","setHoverValue","useState","handleClick","rating","handleMouseEnter","handleMouseLeave","displayValue","iconClass","cn","jsx","_","index","starValue","isFilled","StarSolid","StarOutline"],"mappings":";;;;;AAgBA,MAAMA,IAAa;AAAA,EACjB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAEaC,IAAS,CAAC;AAAA,EACrB,OAAAC,IAAQ;AAAA,EACR,UAAAC;AAAA,EACA,KAAAC,IAAM;AAAA,EACN,MAAAC,IAAO;AAAA,EACP,UAAAC,IAAW;AAAA,EACX,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,WAAAC;AACF,MAAmB;AACjB,QAAM,CAACC,GAAYC,CAAa,IAAIC,EAAwB,IAAI,GAE1DC,IAAc,CAACC,MAAmB;AACtC,IAAI,CAACR,KAAYH,KACfA,EAASW,CAAM;AAAA,EAEnB,GAEMC,IAAmB,CAACD,MAAmB;AAC3C,IAAKR,KACHK,EAAcG,CAAM;AAAA,EAExB,GAEME,IAAmB,MAAM;AAC7B,IAAAL,EAAc,IAAI;AAAA,EACpB,GAEMM,IAAeP,MAAe,OAAOA,IAAaR,GAClDgB,IAAYlB,EAAWK,CAAI;AAEjC,2BACG,OAAA,EAAI,WAAWc,EAAG,iBAAiBV,CAAS,GAC1C,UAAA;AAAA,IAAAF,KACC,gBAAAa,EAAC,QAAA,EAAK,WAAU,6CACb,UAAAb,GACH;AAAA,IAEF,gBAAAa,EAAC,OAAA,EAAI,WAAU,2BACZ,UAAA,MAAM,KAAK,EAAE,QAAQhB,EAAA,GAAO,CAACiB,GAAGC,MAAU;AACzC,YAAMC,IAAYD,IAAQ,GACpBE,IAAWD,KAAaN;AAE9B,aACE,gBAAAG;AAAA,QAAC;AAAA,QAAA;AAAA,UAEC,MAAK;AAAA,UACL,SAAS,MAAMP,EAAYU,CAAS;AAAA,UACpC,cAAc,MAAMR,EAAiBQ,CAAS;AAAA,UAC9C,cAAcP;AAAA,UACd,UAAUV;AAAA,UACV,WAAWa;AAAA,YACT;AAAA,YACAb,IAAW,mBAAmB;AAAA,YAC9B;AAAA,YACA;AAAA,UAAA;AAAA,UAEF,cAAY,QAAQiB,CAAS,WAAWnB,CAAG;AAAA,UAE1C,UAAAoB,IACC,gBAAAJ,EAACK,GAAA,EAAU,WAAWN,EAAGD,GAAW,kBAAkB,EAAA,CAAG,sBAExDQ,GAAA,EAAY,WAAWP,EAAGD,GAAW,gBAAgB,EAAA,CAAG;AAAA,QAAA;AAAA,QAjBtDI;AAAA,MAAA;AAAA,IAqBX,CAAC,EAAA,CACH;AAAA,IACCd,KACC,gBAAAY,EAAC,QAAA,EAAK,WAAU,6BAA6B,UAAAZ,EAAA,CAAM;AAAA,EAAA,GAEvD;AAEJ;"}
+{"version":3,"file":"index52.js","sources":["../src/components/RadioGroup/RadioGroup.tsx"],"sourcesContent":["import { cn } from '@/lib/utils'\n\nexport interface RadioOption {\n  value: string\n  label: string\n  description?: string\n  disabled?: boolean\n}\n\nexport interface RadioGroupProps {\n  options: RadioOption[]\n  value?: string\n  onChange?: (value: string) => void\n  name: string\n  orientation?: 'horizontal' | 'vertical'\n  className?: string\n}\n\nexport function RadioGroup({\n  options,\n  value,\n  onChange,\n  name,\n  orientation = 'vertical',\n  className,\n}: RadioGroupProps) {\n  return (\n    <div\n      className={cn(\n        'flex gap-3',\n        orientation === 'vertical' ? 'flex-col' : 'flex-row flex-wrap',\n        className\n      )}\n      role=\"radiogroup\"\n    >\n      {options.map((option) => (\n        <label\n          key={option.value}\n          className={cn(\n            'flex items-start gap-3 cursor-pointer group',\n            option.disabled && 'opacity-50 cursor-not-allowed'\n          )}\n        >\n          <div className=\"relative flex-shrink-0 mt-0.5\">\n            <input\n              type=\"radio\"\n              name={name}\n              value={option.value}\n              checked={value === option.value}\n              onChange={() => onChange?.(option.value)}\n              disabled={option.disabled}\n              className=\"peer sr-only\"\n            />\n            <div\n              className={cn(\n                'h-5 w-5 rounded-full border-2 transition-colors duration-200',\n                'flex items-center justify-center',\n                'peer-focus:ring-2 peer-focus:ring-primary-500 peer-focus:ring-offset-2',\n                value === option.value\n                  ? 'border-primary-500'\n                  : 'border-slate-300 group-hover:border-slate-400'\n              )}\n            >\n              {value === option.value && (\n                <div className=\"h-2.5 w-2.5 rounded-full bg-primary-500\" />\n              )}\n            </div>\n          </div>\n          <div className=\"flex flex-col\">\n            <span className=\"text-sm font-medium text-slate-900\">\n              {option.label}\n            </span>\n            {option.description && (\n              <span className=\"text-sm text-slate-500\">{option.description}</span>\n            )}\n          </div>\n        </label>\n      ))}\n    </div>\n  )\n}\n"],"names":["RadioGroup","options","value","onChange","name","orientation","className","jsx","cn","option","jsxs"],"mappings":";;AAkBO,SAASA,EAAW;AAAA,EACzB,SAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,MAAAC;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,WAAAC;AACF,GAAoB;AAClB,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACT;AAAA,QACAH,MAAgB,aAAa,aAAa;AAAA,QAC1CC;AAAA,MAAA;AAAA,MAEF,MAAK;AAAA,MAEJ,UAAAL,EAAQ,IAAI,CAACQ,MACZ,gBAAAC;AAAA,QAAC;AAAA,QAAA;AAAA,UAEC,WAAWF;AAAA,YACT;AAAA,YACAC,EAAO,YAAY;AAAA,UAAA;AAAA,UAGrB,UAAA;AAAA,YAAA,gBAAAC,EAAC,OAAA,EAAI,WAAU,iCACb,UAAA;AAAA,cAAA,gBAAAH;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,MAAK;AAAA,kBACL,MAAAH;AAAA,kBACA,OAAOK,EAAO;AAAA,kBACd,SAASP,MAAUO,EAAO;AAAA,kBAC1B,UAAU,MAAMN,KAAA,gBAAAA,EAAWM,EAAO;AAAA,kBAClC,UAAUA,EAAO;AAAA,kBACjB,WAAU;AAAA,gBAAA;AAAA,cAAA;AAAA,cAEZ,gBAAAF;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,WAAWC;AAAA,oBACT;AAAA,oBACA;AAAA,oBACA;AAAA,oBACAN,MAAUO,EAAO,QACb,uBACA;AAAA,kBAAA;AAAA,kBAGL,gBAAUA,EAAO,SAChB,gBAAAF,EAAC,OAAA,EAAI,WAAU,0CAAA,CAA0C;AAAA,gBAAA;AAAA,cAAA;AAAA,YAE7D,GACF;AAAA,YACA,gBAAAG,EAAC,OAAA,EAAI,WAAU,iBACb,UAAA;AAAA,cAAA,gBAAAH,EAAC,QAAA,EAAK,WAAU,sCACb,UAAAE,EAAO,OACV;AAAA,cACCA,EAAO,eACN,gBAAAF,EAAC,UAAK,WAAU,0BAA0B,YAAO,YAAA,CAAY;AAAA,YAAA,EAAA,CAEjE;AAAA,UAAA;AAAA,QAAA;AAAA,QAtCKE,EAAO;AAAA,MAAA,CAwCf;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/index53.js

@@ -1,40 +1,57 @@
-import { jsx as o } from "react/jsx-runtime";
-import { cn as c } from "./index3.js";
-const f = {
-  start: "items-start",
-  center: "items-center",
-  end: "items-end",
-  stretch: "items-stretch"
-}, u = {
-  start: "justify-start",
-  center: "justify-center",
-  end: "justify-end",
-  between: "justify-between",
-  around: "justify-around"
-}, y = ({
-  children: s,
-  height: t = 48,
-  className: r,
-  gap: e,
-  align: n = "center",
-  justify: i = "start"
-}) => /* @__PURE__ */ o(
-  "div",
-  {
-    className: c(
-      "flex flex-row w-full",
-      f[n],
-      u[i],
-      r
-    ),
-    style: {
-      height: typeof t == "number" ? `${t}px` : t,
-      gap: e ? `${e}px` : void 0
-    },
-    children: s
-  }
-);
+import { jsxs as S, jsx as e } from "react/jsx-runtime";
+import { useState as M } from "react";
+import { cn as r } from "./index3.js";
+import { StarIcon as V } from "@heroicons/react/24/solid";
+import { StarIcon as w } from "@heroicons/react/24/outline";
+const y = {
+  sm: "w-4 h-4",
+  md: "w-6 h-6",
+  lg: "w-8 h-8"
+}, E = ({
+  value: d = 0,
+  onChange: n,
+  max: a = 5,
+  size: p = "md",
+  readonly: t = !1,
+  label: l,
+  error: c,
+  className: h
+}) => {
+  const [i, m] = M(null), x = (s) => {
+    !t && n && n(s);
+  }, b = (s) => {
+    t || m(s);
+  }, g = () => {
+    m(null);
+  }, v = i !== null ? i : d, u = y[p];
+  return /* @__PURE__ */ S("div", { className: r("flex flex-col", h), children: [
+    l && /* @__PURE__ */ e("span", { className: "text-sm font-semibold text-slate-700 mb-2", children: l }),
+    /* @__PURE__ */ e("div", { className: "flex items-center gap-1", children: Array.from({ length: a }, (s, f) => {
+      const o = f + 1, N = o <= v;
+      return /* @__PURE__ */ e(
+        "button",
+        {
+          type: "button",
+          onClick: () => x(o),
+          onMouseEnter: () => b(o),
+          onMouseLeave: g,
+          disabled: t,
+          className: r(
+            "p-0 border-0 bg-transparent",
+            t ? "cursor-default" : "cursor-pointer",
+            "transition-transform hover:scale-110",
+            "focus:outline-none focus:ring-2 focus:ring-primary-500 focus:ring-offset-1 rounded"
+          ),
+          "aria-label": `Rate ${o} out of ${a}`,
+          children: N ? /* @__PURE__ */ e(V, { className: r(u, "text-primary-500") }) : /* @__PURE__ */ e(w, { className: r(u, "text-slate-300") })
+        },
+        f
+      );
+    }) }),
+    c && /* @__PURE__ */ e("span", { className: "text-sm text-red-500 mt-1", children: c })
+  ] });
+};
 export {
-  y as Row
+  E as Rating
 };
 //# sourceMappingURL=index53.js.map

package/dist/index53.js.map

@@ -1 +1 @@
-{"version":3,"file":"index53.js","sources":["../src/components/Row/Row.tsx"],"sourcesContent":["import { type ReactNode } from 'react'\nimport { cn } from '@/lib/utils'\n\nexport interface RowProps {\n  children: ReactNode\n  height?: number | string\n  className?: string\n  gap?: number\n  align?: 'start' | 'center' | 'end' | 'stretch'\n  justify?: 'start' | 'center' | 'end' | 'between' | 'around'\n}\n\nconst alignStyles = {\n  start: 'items-start',\n  center: 'items-center',\n  end: 'items-end',\n  stretch: 'items-stretch',\n}\n\nconst justifyStyles = {\n  start: 'justify-start',\n  center: 'justify-center',\n  end: 'justify-end',\n  between: 'justify-between',\n  around: 'justify-around',\n}\n\nexport const Row = ({\n  children,\n  height = 48,\n  className,\n  gap,\n  align = 'center',\n  justify = 'start',\n}: RowProps) => {\n  return (\n    <div\n      className={cn(\n        'flex flex-row w-full',\n        alignStyles[align],\n        justifyStyles[justify],\n        className\n      )}\n      style={{\n        height: typeof height === 'number' ? `${height}px` : height,\n        gap: gap ? `${gap}px` : undefined,\n      }}\n    >\n      {children}\n    </div>\n  )\n}\n"],"names":["alignStyles","justifyStyles","Row","children","height","className","gap","align","justify","jsx","cn"],"mappings":";;AAYA,MAAMA,IAAc;AAAA,EAClB,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,KAAK;AAAA,EACL,SAAS;AACX,GAEMC,IAAgB;AAAA,EACpB,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,KAAK;AAAA,EACL,SAAS;AAAA,EACT,QAAQ;AACV,GAEaC,IAAM,CAAC;AAAA,EAClB,UAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,WAAAC;AAAA,EACA,KAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,SAAAC,IAAU;AACZ,MAEI,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAWC;AAAA,MACT;AAAA,MACAV,EAAYO,CAAK;AAAA,MACjBN,EAAcO,CAAO;AAAA,MACrBH;AAAA,IAAA;AAAA,IAEF,OAAO;AAAA,MACL,QAAQ,OAAOD,KAAW,WAAW,GAAGA,CAAM,OAAOA;AAAA,MACrD,KAAKE,IAAM,GAAGA,CAAG,OAAO;AAAA,IAAA;AAAA,IAGzB,UAAAH;AAAA,EAAA;AAAA;"}
+{"version":3,"file":"index53.js","sources":["../src/components/Rating/Rating.tsx"],"sourcesContent":["import { useState } from 'react'\nimport { cn } from '@/lib/utils'\nimport { StarIcon as StarSolid } from '@heroicons/react/24/solid'\nimport { StarIcon as StarOutline } from '@heroicons/react/24/outline'\n\nexport interface RatingProps {\n  value?: number\n  onChange?: (rating: number) => void\n  max?: number\n  size?: 'sm' | 'md' | 'lg'\n  readonly?: boolean\n  label?: string\n  error?: string\n  className?: string\n}\n\nconst sizeStyles = {\n  sm: 'w-4 h-4',\n  md: 'w-6 h-6',\n  lg: 'w-8 h-8',\n}\n\nexport const Rating = ({\n  value = 0,\n  onChange,\n  max = 5,\n  size = 'md',\n  readonly = false,\n  label,\n  error,\n  className,\n}: RatingProps) => {\n  const [hoverValue, setHoverValue] = useState<number | null>(null)\n\n  const handleClick = (rating: number) => {\n    if (!readonly && onChange) {\n      onChange(rating)\n    }\n  }\n\n  const handleMouseEnter = (rating: number) => {\n    if (!readonly) {\n      setHoverValue(rating)\n    }\n  }\n\n  const handleMouseLeave = () => {\n    setHoverValue(null)\n  }\n\n  const displayValue = hoverValue !== null ? hoverValue : value\n  const iconClass = sizeStyles[size]\n\n  return (\n    <div className={cn('flex flex-col', className)}>\n      {label && (\n        <span className=\"text-sm font-semibold text-slate-700 mb-2\">\n          {label}\n        </span>\n      )}\n      <div className=\"flex items-center gap-1\">\n        {Array.from({ length: max }, (_, index) => {\n          const starValue = index + 1\n          const isFilled = starValue <= displayValue\n\n          return (\n            <button\n              key={index}\n              type=\"button\"\n              onClick={() => handleClick(starValue)}\n              onMouseEnter={() => handleMouseEnter(starValue)}\n              onMouseLeave={handleMouseLeave}\n              disabled={readonly}\n              className={cn(\n                'p-0 border-0 bg-transparent',\n                readonly ? 'cursor-default' : 'cursor-pointer',\n                'transition-transform hover:scale-110',\n                'focus:outline-none focus:ring-2 focus:ring-primary-500 focus:ring-offset-1 rounded'\n              )}\n              aria-label={`Rate ${starValue} out of ${max}`}\n            >\n              {isFilled ? (\n                <StarSolid className={cn(iconClass, 'text-primary-500')} />\n              ) : (\n                <StarOutline className={cn(iconClass, 'text-slate-300')} />\n              )}\n            </button>\n          )\n        })}\n      </div>\n      {error && (\n        <span className=\"text-sm text-red-500 mt-1\">{error}</span>\n      )}\n    </div>\n  )\n}\n"],"names":["sizeStyles","Rating","value","onChange","max","size","readonly","label","error","className","hoverValue","setHoverValue","useState","handleClick","rating","handleMouseEnter","handleMouseLeave","displayValue","iconClass","cn","jsx","_","index","starValue","isFilled","StarSolid","StarOutline"],"mappings":";;;;;AAgBA,MAAMA,IAAa;AAAA,EACjB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAEaC,IAAS,CAAC;AAAA,EACrB,OAAAC,IAAQ;AAAA,EACR,UAAAC;AAAA,EACA,KAAAC,IAAM;AAAA,EACN,MAAAC,IAAO;AAAA,EACP,UAAAC,IAAW;AAAA,EACX,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,WAAAC;AACF,MAAmB;AACjB,QAAM,CAACC,GAAYC,CAAa,IAAIC,EAAwB,IAAI,GAE1DC,IAAc,CAACC,MAAmB;AACtC,IAAI,CAACR,KAAYH,KACfA,EAASW,CAAM;AAAA,EAEnB,GAEMC,IAAmB,CAACD,MAAmB;AAC3C,IAAKR,KACHK,EAAcG,CAAM;AAAA,EAExB,GAEME,IAAmB,MAAM;AAC7B,IAAAL,EAAc,IAAI;AAAA,EACpB,GAEMM,IAAeP,MAAe,OAAOA,IAAaR,GAClDgB,IAAYlB,EAAWK,CAAI;AAEjC,2BACG,OAAA,EAAI,WAAWc,EAAG,iBAAiBV,CAAS,GAC1C,UAAA;AAAA,IAAAF,KACC,gBAAAa,EAAC,QAAA,EAAK,WAAU,6CACb,UAAAb,GACH;AAAA,IAEF,gBAAAa,EAAC,OAAA,EAAI,WAAU,2BACZ,UAAA,MAAM,KAAK,EAAE,QAAQhB,EAAA,GAAO,CAACiB,GAAGC,MAAU;AACzC,YAAMC,IAAYD,IAAQ,GACpBE,IAAWD,KAAaN;AAE9B,aACE,gBAAAG;AAAA,QAAC;AAAA,QAAA;AAAA,UAEC,MAAK;AAAA,UACL,SAAS,MAAMP,EAAYU,CAAS;AAAA,UACpC,cAAc,MAAMR,EAAiBQ,CAAS;AAAA,UAC9C,cAAcP;AAAA,UACd,UAAUV;AAAA,UACV,WAAWa;AAAA,YACT;AAAA,YACAb,IAAW,mBAAmB;AAAA,YAC9B;AAAA,YACA;AAAA,UAAA;AAAA,UAEF,cAAY,QAAQiB,CAAS,WAAWnB,CAAG;AAAA,UAE1C,UAAAoB,IACC,gBAAAJ,EAACK,GAAA,EAAU,WAAWN,EAAGD,GAAW,kBAAkB,EAAA,CAAG,sBAExDQ,GAAA,EAAY,WAAWP,EAAGD,GAAW,gBAAgB,EAAA,CAAG;AAAA,QAAA;AAAA,QAjBtDI;AAAA,MAAA;AAAA,IAqBX,CAAC,EAAA,CACH;AAAA,IACCd,KACC,gBAAAY,EAAC,QAAA,EAAK,WAAU,6BAA6B,UAAAZ,EAAA,CAAM;AAAA,EAAA,GAEvD;AAEJ;"}

package/dist/index54.js

@@ -1,69 +1,40 @@
-import { jsxs as t, jsx as e } from "react/jsx-runtime";
-import { Dialog as x, DialogPanel as f, DialogTitle as h } from "@headlessui/react";
-import { cn as b } from "./index3.js";
-import { ArrowLeftIcon as p, XMarkIcon as u } from "@heroicons/react/24/outline";
-import { Button as N } from "./index17.js";
-const k = ({
-  isOpen: o,
-  onClose: a,
-  title: d,
-  children: n,
-  onBack: r,
-  onSkip: s,
-  rightActions: i = [],
-  className: c
-}) => /* @__PURE__ */ t(x, { open: o, onClose: a, className: "relative z-50", children: [
-  /* @__PURE__ */ e("div", { className: "fixed inset-0 bg-black/50", "aria-hidden": "true" }),
-  /* @__PURE__ */ e("div", { className: "fixed inset-0 flex items-center justify-center p-4", children: /* @__PURE__ */ t(
-    f,
-    {
-      className: b(
-        "bg-white rounded-lg shadow-xl w-full max-w-2xl max-h-[90vh] flex flex-col overflow-hidden",
-        c
-      ),
-      children: [
-        /* @__PURE__ */ t("div", { className: "flex items-center justify-between px-6 py-4 border-b border-slate-200", children: [
-          /* @__PURE__ */ e("div", { className: "w-10", children: r && /* @__PURE__ */ e(
-            "button",
-            {
-              onClick: r,
-              className: "p-2 rounded-md hover:bg-slate-100 transition-colors",
-              "aria-label": "Go back",
-              children: /* @__PURE__ */ e(p, { className: "w-5 h-5 text-slate-500" })
-            }
-          ) }),
-          /* @__PURE__ */ e(h, { className: "text-lg font-bold text-slate-900 flex-1 text-center", children: d }),
-          /* @__PURE__ */ e("div", { className: "w-10 flex justify-end", children: s ? /* @__PURE__ */ e(
-            "button",
-            {
-              onClick: s,
-              className: "text-sm font-semibold text-slate-600 hover:text-slate-800",
-              children: "Skip"
-            }
-          ) : /* @__PURE__ */ e(
-            "button",
-            {
-              onClick: a,
-              className: "p-2 rounded-md hover:bg-slate-100 transition-colors",
-              "aria-label": "Close",
-              children: /* @__PURE__ */ e(u, { className: "w-5 h-5 text-slate-500" })
-            }
-          ) })
-        ] }),
-        /* @__PURE__ */ e("div", { className: "flex-1 overflow-y-auto px-8 py-6", children: n }),
-        i.length > 0 && /* @__PURE__ */ e("div", { className: "flex justify-end gap-2 px-8 py-4 border-t border-slate-200", children: i.map((l, m) => /* @__PURE__ */ e(
-          N,
-          {
-            ...l,
-            children: l.text || l.children
-          },
-          l.key || l.text || `action-${m}`
-        )) })
-      ]
-    }
-  ) })
-] });
+import { jsx as o } from "react/jsx-runtime";
+import { cn as c } from "./index3.js";
+const f = {
+  start: "items-start",
+  center: "items-center",
+  end: "items-end",
+  stretch: "items-stretch"
+}, u = {
+  start: "justify-start",
+  center: "justify-center",
+  end: "justify-end",
+  between: "justify-between",
+  around: "justify-around"
+}, y = ({
+  children: s,
+  height: t = 48,
+  className: r,
+  gap: e,
+  align: n = "center",
+  justify: i = "start"
+}) => /* @__PURE__ */ o(
+  "div",
+  {
+    className: c(
+      "flex flex-row w-full",
+      f[n],
+      u[i],
+      r
+    ),
+    style: {
+      height: typeof t == "number" ? `${t}px` : t,
+      gap: e ? `${e}px` : void 0
+    },
+    children: s
+  }
+);
 export {
-  k as ScrollableModal
+  y as Row
 };
 //# sourceMappingURL=index54.js.map

package/dist/index54.js.map

@@ -1 +1 @@
-{"version":3,"file":"index54.js","sources":["../src/components/ScrollableModal/ScrollableModal.tsx"],"sourcesContent":["import { type ReactNode } from 'react'\nimport { Dialog, DialogPanel, DialogTitle } from '@headlessui/react'\nimport { cn } from '@/lib/utils'\nimport { XMarkIcon, ArrowLeftIcon } from '@heroicons/react/24/outline'\nimport { Button, type ButtonProps } from '../Button/Button'\n\nexport interface ScrollableModalAction extends Omit<ButtonProps, 'key'> {\n  key?: string\n  text?: string\n}\n\nexport interface ScrollableModalProps {\n  isOpen: boolean\n  onClose: () => void\n  title?: string\n  children: ReactNode\n  onBack?: () => void\n  onSkip?: () => void\n  rightActions?: ScrollableModalAction[]\n  className?: string\n}\n\nexport const ScrollableModal = ({\n  isOpen,\n  onClose,\n  title,\n  children,\n  onBack,\n  onSkip,\n  rightActions = [],\n  className,\n}: ScrollableModalProps) => {\n  return (\n    <Dialog open={isOpen} onClose={onClose} className=\"relative z-50\">\n      {/* Backdrop */}\n      <div className=\"fixed inset-0 bg-black/50\" aria-hidden=\"true\" />\n\n      {/* Full-screen container */}\n      <div className=\"fixed inset-0 flex items-center justify-center p-4\">\n        <DialogPanel\n          className={cn(\n            'bg-white rounded-lg shadow-xl w-full max-w-2xl max-h-[90vh] flex flex-col overflow-hidden',\n            className\n          )}\n        >\n          {/* Header */}\n          <div className=\"flex items-center justify-between px-6 py-4 border-b border-slate-200\">\n            <div className=\"w-10\">\n              {onBack && (\n                <button\n                  onClick={onBack}\n                  className=\"p-2 rounded-md hover:bg-slate-100 transition-colors\"\n                  aria-label=\"Go back\"\n                >\n                  <ArrowLeftIcon className=\"w-5 h-5 text-slate-500\" />\n                </button>\n              )}\n            </div>\n\n            <DialogTitle className=\"text-lg font-bold text-slate-900 flex-1 text-center\">\n              {title}\n            </DialogTitle>\n\n            <div className=\"w-10 flex justify-end\">\n              {onSkip ? (\n                <button\n                  onClick={onSkip}\n                  className=\"text-sm font-semibold text-slate-600 hover:text-slate-800\"\n                >\n                  Skip\n                </button>\n              ) : (\n                <button\n                  onClick={onClose}\n                  className=\"p-2 rounded-md hover:bg-slate-100 transition-colors\"\n                  aria-label=\"Close\"\n                >\n                  <XMarkIcon className=\"w-5 h-5 text-slate-500\" />\n                </button>\n              )}\n            </div>\n          </div>\n\n          {/* Scrollable Content */}\n          <div className=\"flex-1 overflow-y-auto px-8 py-6\">\n            {children}\n          </div>\n\n          {/* Footer Actions */}\n          {rightActions.length > 0 && (\n            <div className=\"flex justify-end gap-2 px-8 py-4 border-t border-slate-200\">\n              {rightActions.map((action, index) => (\n                <Button\n                  key={action.key || action.text || `action-${index}`}\n                  {...action}\n                >\n                  {action.text || action.children}\n                </Button>\n              ))}\n            </div>\n          )}\n        </DialogPanel>\n      </div>\n    </Dialog>\n  )\n}\n"],"names":["ScrollableModal","isOpen","onClose","title","children","onBack","onSkip","rightActions","className","Dialog","jsx","jsxs","DialogPanel","cn","ArrowLeftIcon","DialogTitle","XMarkIcon","action","index","Button"],"mappings":";;;;;AAsBO,MAAMA,IAAkB,CAAC;AAAA,EAC9B,QAAAC;AAAA,EACA,SAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,QAAAC;AAAA,EACA,cAAAC,IAAe,CAAA;AAAA,EACf,WAAAC;AACF,wBAEKC,GAAA,EAAO,MAAMR,GAAQ,SAAAC,GAAkB,WAAU,iBAEhD,UAAA;AAAA,EAAA,gBAAAQ,EAAC,OAAA,EAAI,WAAU,6BAA4B,eAAY,QAAO;AAAA,EAG9D,gBAAAA,EAAC,OAAA,EAAI,WAAU,sDACb,UAAA,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACT;AAAA,QACAL;AAAA,MAAA;AAAA,MAIF,UAAA;AAAA,QAAA,gBAAAG,EAAC,OAAA,EAAI,WAAU,yEACb,UAAA;AAAA,UAAA,gBAAAD,EAAC,OAAA,EAAI,WAAU,QACZ,UAAAL,KACC,gBAAAK;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,SAASL;AAAA,cACT,WAAU;AAAA,cACV,cAAW;AAAA,cAEX,UAAA,gBAAAK,EAACI,GAAA,EAAc,WAAU,yBAAA,CAAyB;AAAA,YAAA;AAAA,UAAA,GAGxD;AAAA,UAEA,gBAAAJ,EAACK,GAAA,EAAY,WAAU,uDACpB,UAAAZ,GACH;AAAA,UAEA,gBAAAO,EAAC,OAAA,EAAI,WAAU,yBACZ,UAAAJ,IACC,gBAAAI;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,SAASJ;AAAA,cACT,WAAU;AAAA,cACX,UAAA;AAAA,YAAA;AAAA,UAAA,IAID,gBAAAI;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,SAASR;AAAA,cACT,WAAU;AAAA,cACV,cAAW;AAAA,cAEX,UAAA,gBAAAQ,EAACM,GAAA,EAAU,WAAU,yBAAA,CAAyB;AAAA,YAAA;AAAA,UAAA,EAChD,CAEJ;AAAA,QAAA,GACF;AAAA,QAGA,gBAAAN,EAAC,OAAA,EAAI,WAAU,oCACZ,UAAAN,EAAA,CACH;AAAA,QAGCG,EAAa,SAAS,KACrB,gBAAAG,EAAC,OAAA,EAAI,WAAU,8DACZ,UAAAH,EAAa,IAAI,CAACU,GAAQC,MACzB,gBAAAR;AAAA,UAACS;AAAA,UAAA;AAAA,YAEE,GAAGF;AAAA,YAEH,UAAAA,EAAO,QAAQA,EAAO;AAAA,UAAA;AAAA,UAHlBA,EAAO,OAAOA,EAAO,QAAQ,UAAUC,CAAK;AAAA,QAAA,CAKpD,EAAA,CACH;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA,EAEJ,CACF;AAAA,GACF;"}
+{"version":3,"file":"index54.js","sources":["../src/components/Row/Row.tsx"],"sourcesContent":["import { type ReactNode } from 'react'\nimport { cn } from '@/lib/utils'\n\nexport interface RowProps {\n  children: ReactNode\n  height?: number | string\n  className?: string\n  gap?: number\n  align?: 'start' | 'center' | 'end' | 'stretch'\n  justify?: 'start' | 'center' | 'end' | 'between' | 'around'\n}\n\nconst alignStyles = {\n  start: 'items-start',\n  center: 'items-center',\n  end: 'items-end',\n  stretch: 'items-stretch',\n}\n\nconst justifyStyles = {\n  start: 'justify-start',\n  center: 'justify-center',\n  end: 'justify-end',\n  between: 'justify-between',\n  around: 'justify-around',\n}\n\nexport const Row = ({\n  children,\n  height = 48,\n  className,\n  gap,\n  align = 'center',\n  justify = 'start',\n}: RowProps) => {\n  return (\n    <div\n      className={cn(\n        'flex flex-row w-full',\n        alignStyles[align],\n        justifyStyles[justify],\n        className\n      )}\n      style={{\n        height: typeof height === 'number' ? `${height}px` : height,\n        gap: gap ? `${gap}px` : undefined,\n      }}\n    >\n      {children}\n    </div>\n  )\n}\n"],"names":["alignStyles","justifyStyles","Row","children","height","className","gap","align","justify","jsx","cn"],"mappings":";;AAYA,MAAMA,IAAc;AAAA,EAClB,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,KAAK;AAAA,EACL,SAAS;AACX,GAEMC,IAAgB;AAAA,EACpB,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,KAAK;AAAA,EACL,SAAS;AAAA,EACT,QAAQ;AACV,GAEaC,IAAM,CAAC;AAAA,EAClB,UAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,WAAAC;AAAA,EACA,KAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,SAAAC,IAAU;AACZ,MAEI,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,WAAWC;AAAA,MACT;AAAA,MACAV,EAAYO,CAAK;AAAA,MACjBN,EAAcO,CAAO;AAAA,MACrBH;AAAA,IAAA;AAAA,IAEF,OAAO;AAAA,MACL,QAAQ,OAAOD,KAAW,WAAW,GAAGA,CAAM,OAAOA;AAAA,MACrD,KAAKE,IAAM,GAAGA,CAAG,OAAO;AAAA,IAAA;AAAA,IAGzB,UAAAH;AAAA,EAAA;AAAA;"}

package/dist/index55.js

@@ -1,25 +1,69 @@
-import { jsx as a } from "react/jsx-runtime";
-import { cn as i } from "./index3.js";
-function b({
-  children: r,
-  withBorder: e = !1,
-  leftBorder: o = !1,
-  className: t
-}) {
-  return /* @__PURE__ */ a(
-    "h2",
+import { jsxs as t, jsx as e } from "react/jsx-runtime";
+import { Dialog as x, DialogPanel as f, DialogTitle as h } from "@headlessui/react";
+import { cn as b } from "./index3.js";
+import { ArrowLeftIcon as p, XMarkIcon as u } from "@heroicons/react/24/outline";
+import { Button as N } from "./index17.js";
+const k = ({
+  isOpen: o,
+  onClose: a,
+  title: d,
+  children: n,
+  onBack: r,
+  onSkip: s,
+  rightActions: i = [],
+  className: c
+}) => /* @__PURE__ */ t(x, { open: o, onClose: a, className: "relative z-50", children: [
+  /* @__PURE__ */ e("div", { className: "fixed inset-0 bg-black/50", "aria-hidden": "true" }),
+  /* @__PURE__ */ e("div", { className: "fixed inset-0 flex items-center justify-center p-4", children: /* @__PURE__ */ t(
+    f,
     {
-      className: i(
-        "text-2xl font-semibold text-slate-900",
-        e && "pb-3 border-b-2 border-primary-500",
-        o && "pl-3 border-l-4 border-primary-500",
-        t
+      className: b(
+        "bg-white rounded-lg shadow-xl w-full max-w-2xl max-h-[90vh] flex flex-col overflow-hidden",
+        c
       ),
-      children: r
+      children: [
+        /* @__PURE__ */ t("div", { className: "flex items-center justify-between px-6 py-4 border-b border-slate-200", children: [
+          /* @__PURE__ */ e("div", { className: "w-10", children: r && /* @__PURE__ */ e(
+            "button",
+            {
+              onClick: r,
+              className: "p-2 rounded-md hover:bg-slate-100 transition-colors",
+              "aria-label": "Go back",
+              children: /* @__PURE__ */ e(p, { className: "w-5 h-5 text-slate-500" })
+            }
+          ) }),
+          /* @__PURE__ */ e(h, { className: "text-lg font-bold text-slate-900 flex-1 text-center", children: d }),
+          /* @__PURE__ */ e("div", { className: "w-10 flex justify-end", children: s ? /* @__PURE__ */ e(
+            "button",
+            {
+              onClick: s,
+              className: "text-sm font-semibold text-slate-600 hover:text-slate-800",
+              children: "Skip"
+            }
+          ) : /* @__PURE__ */ e(
+            "button",
+            {
+              onClick: a,
+              className: "p-2 rounded-md hover:bg-slate-100 transition-colors",
+              "aria-label": "Close",
+              children: /* @__PURE__ */ e(u, { className: "w-5 h-5 text-slate-500" })
+            }
+          ) })
+        ] }),
+        /* @__PURE__ */ e("div", { className: "flex-1 overflow-y-auto px-8 py-6", children: n }),
+        i.length > 0 && /* @__PURE__ */ e("div", { className: "flex justify-end gap-2 px-8 py-4 border-t border-slate-200", children: i.map((l, m) => /* @__PURE__ */ e(
+          N,
+          {
+            ...l,
+            children: l.text || l.children
+          },
+          l.key || l.text || `action-${m}`
+        )) })
+      ]
     }
-  );
-}
+  ) })
+] });
 export {
-  b as SectionHeading
+  k as ScrollableModal
 };
 //# sourceMappingURL=index55.js.map

package/dist/index55.js.map

@@ -1 +1 @@
-{"version":3,"file":"index55.js","sources":["../src/components/Typography/SectionHeading.tsx"],"sourcesContent":["import { cn } from '@/lib/utils'\nimport type { ReactNode } from 'react'\n\nexport interface SectionHeadingProps {\n  children: ReactNode\n  /** Bottom border accent */\n  withBorder?: boolean\n  /** Left border accent (RealtorIQ style) */\n  leftBorder?: boolean\n  className?: string\n}\n\nexport function SectionHeading({\n  children,\n  withBorder = false,\n  leftBorder = false,\n  className,\n}: SectionHeadingProps) {\n  return (\n    <h2\n      className={cn(\n        'text-2xl font-semibold text-slate-900',\n        withBorder && 'pb-3 border-b-2 border-primary-500',\n        leftBorder && 'pl-3 border-l-4 border-primary-500',\n        className\n      )}\n    >\n      {children}\n    </h2>\n  )\n}\n"],"names":["SectionHeading","children","withBorder","leftBorder","className","jsx","cn"],"mappings":";;AAYO,SAASA,EAAe;AAAA,EAC7B,UAAAC;AAAA,EACA,YAAAC,IAAa;AAAA,EACb,YAAAC,IAAa;AAAA,EACb,WAAAC;AACF,GAAwB;AACtB,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACT;AAAA,QACAJ,KAAc;AAAA,QACdC,KAAc;AAAA,QACdC;AAAA,MAAA;AAAA,MAGD,UAAAH;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"index55.js","sources":["../src/components/ScrollableModal/ScrollableModal.tsx"],"sourcesContent":["import { type ReactNode } from 'react'\nimport { Dialog, DialogPanel, DialogTitle } from '@headlessui/react'\nimport { cn } from '@/lib/utils'\nimport { XMarkIcon, ArrowLeftIcon } from '@heroicons/react/24/outline'\nimport { Button, type ButtonProps } from '../Button/Button'\n\nexport interface ScrollableModalAction extends Omit<ButtonProps, 'key'> {\n  key?: string\n  text?: string\n}\n\nexport interface ScrollableModalProps {\n  isOpen: boolean\n  onClose: () => void\n  title?: string\n  children: ReactNode\n  onBack?: () => void\n  onSkip?: () => void\n  rightActions?: ScrollableModalAction[]\n  className?: string\n}\n\nexport const ScrollableModal = ({\n  isOpen,\n  onClose,\n  title,\n  children,\n  onBack,\n  onSkip,\n  rightActions = [],\n  className,\n}: ScrollableModalProps) => {\n  return (\n    <Dialog open={isOpen} onClose={onClose} className=\"relative z-50\">\n      {/* Backdrop */}\n      <div className=\"fixed inset-0 bg-black/50\" aria-hidden=\"true\" />\n\n      {/* Full-screen container */}\n      <div className=\"fixed inset-0 flex items-center justify-center p-4\">\n        <DialogPanel\n          className={cn(\n            'bg-white rounded-lg shadow-xl w-full max-w-2xl max-h-[90vh] flex flex-col overflow-hidden',\n            className\n          )}\n        >\n          {/* Header */}\n          <div className=\"flex items-center justify-between px-6 py-4 border-b border-slate-200\">\n            <div className=\"w-10\">\n              {onBack && (\n                <button\n                  onClick={onBack}\n                  className=\"p-2 rounded-md hover:bg-slate-100 transition-colors\"\n                  aria-label=\"Go back\"\n                >\n                  <ArrowLeftIcon className=\"w-5 h-5 text-slate-500\" />\n                </button>\n              )}\n            </div>\n\n            <DialogTitle className=\"text-lg font-bold text-slate-900 flex-1 text-center\">\n              {title}\n            </DialogTitle>\n\n            <div className=\"w-10 flex justify-end\">\n              {onSkip ? (\n                <button\n                  onClick={onSkip}\n                  className=\"text-sm font-semibold text-slate-600 hover:text-slate-800\"\n                >\n                  Skip\n                </button>\n              ) : (\n                <button\n                  onClick={onClose}\n                  className=\"p-2 rounded-md hover:bg-slate-100 transition-colors\"\n                  aria-label=\"Close\"\n                >\n                  <XMarkIcon className=\"w-5 h-5 text-slate-500\" />\n                </button>\n              )}\n            </div>\n          </div>\n\n          {/* Scrollable Content */}\n          <div className=\"flex-1 overflow-y-auto px-8 py-6\">\n            {children}\n          </div>\n\n          {/* Footer Actions */}\n          {rightActions.length > 0 && (\n            <div className=\"flex justify-end gap-2 px-8 py-4 border-t border-slate-200\">\n              {rightActions.map((action, index) => (\n                <Button\n                  key={action.key || action.text || `action-${index}`}\n                  {...action}\n                >\n                  {action.text || action.children}\n                </Button>\n              ))}\n            </div>\n          )}\n        </DialogPanel>\n      </div>\n    </Dialog>\n  )\n}\n"],"names":["ScrollableModal","isOpen","onClose","title","children","onBack","onSkip","rightActions","className","Dialog","jsx","jsxs","DialogPanel","cn","ArrowLeftIcon","DialogTitle","XMarkIcon","action","index","Button"],"mappings":";;;;;AAsBO,MAAMA,IAAkB,CAAC;AAAA,EAC9B,QAAAC;AAAA,EACA,SAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,QAAAC;AAAA,EACA,cAAAC,IAAe,CAAA;AAAA,EACf,WAAAC;AACF,wBAEKC,GAAA,EAAO,MAAMR,GAAQ,SAAAC,GAAkB,WAAU,iBAEhD,UAAA;AAAA,EAAA,gBAAAQ,EAAC,OAAA,EAAI,WAAU,6BAA4B,eAAY,QAAO;AAAA,EAG9D,gBAAAA,EAAC,OAAA,EAAI,WAAU,sDACb,UAAA,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACT;AAAA,QACAL;AAAA,MAAA;AAAA,MAIF,UAAA;AAAA,QAAA,gBAAAG,EAAC,OAAA,EAAI,WAAU,yEACb,UAAA;AAAA,UAAA,gBAAAD,EAAC,OAAA,EAAI,WAAU,QACZ,UAAAL,KACC,gBAAAK;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,SAASL;AAAA,cACT,WAAU;AAAA,cACV,cAAW;AAAA,cAEX,UAAA,gBAAAK,EAACI,GAAA,EAAc,WAAU,yBAAA,CAAyB;AAAA,YAAA;AAAA,UAAA,GAGxD;AAAA,UAEA,gBAAAJ,EAACK,GAAA,EAAY,WAAU,uDACpB,UAAAZ,GACH;AAAA,UAEA,gBAAAO,EAAC,OAAA,EAAI,WAAU,yBACZ,UAAAJ,IACC,gBAAAI;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,SAASJ;AAAA,cACT,WAAU;AAAA,cACX,UAAA;AAAA,YAAA;AAAA,UAAA,IAID,gBAAAI;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,SAASR;AAAA,cACT,WAAU;AAAA,cACV,cAAW;AAAA,cAEX,UAAA,gBAAAQ,EAACM,GAAA,EAAU,WAAU,yBAAA,CAAyB;AAAA,YAAA;AAAA,UAAA,EAChD,CAEJ;AAAA,QAAA,GACF;AAAA,QAGA,gBAAAN,EAAC,OAAA,EAAI,WAAU,oCACZ,UAAAN,EAAA,CACH;AAAA,QAGCG,EAAa,SAAS,KACrB,gBAAAG,EAAC,OAAA,EAAI,WAAU,8DACZ,UAAAH,EAAa,IAAI,CAACU,GAAQC,MACzB,gBAAAR;AAAA,UAACS;AAAA,UAAA;AAAA,YAEE,GAAGF;AAAA,YAEH,UAAAA,EAAO,QAAQA,EAAO;AAAA,UAAA;AAAA,UAHlBA,EAAO,OAAOA,EAAO,QAAQ,UAAUC,CAAK;AAAA,QAAA,CAKpD,EAAA,CACH;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA,EAEJ,CACF;AAAA,GACF;"}