najm-kit 0.0.29 → 0.0.30

package/dist/index.d.ts

@@ -2139,6 +2139,7 @@ interface WizardClassNames {
     indicator?: string;
     progressBar?: string;
 }
+type WizardFooterDivider = boolean | "none" | "solid" | "dashed" | "dotted";
 interface WizardFormProps {
     steps: StepConfig[];
     schema: any;
@@ -2157,6 +2158,8 @@ interface WizardFormProps {
     className?: string;
     classNames?: WizardClassNames;
     footerSlot?: ReactNode;
+    footerDivider?: WizardFooterDivider;
+    footerDividerClassName?: string;
     children?: ReactNode;
 }
 interface StepMeta {
@@ -2165,7 +2168,7 @@ interface StepMeta {
     title: string;
 }
 
-declare function WizardForm({ steps, schema, defaultValues, onSubmit, currentStep: controlledStep, onCurrentStepChange, onStepComplete, showHeader, showFooter, nextLabel, previousLabel, submitLabel, variant, bordered, className, classNames, footerSlot, }: WizardFormProps): react_jsx_runtime.JSX.Element;
+declare function WizardForm({ steps, schema, defaultValues, onSubmit, currentStep: controlledStep, onCurrentStepChange, onStepComplete, showHeader, showFooter, nextLabel, previousLabel, submitLabel, variant, bordered, className, classNames, footerSlot, footerDivider, footerDividerClassName, }: WizardFormProps): react_jsx_runtime.JSX.Element;
 
 interface StepIndicatorProps {
     stepNumber: number;

package/dist/index.mjs

@@ -5787,16 +5787,35 @@ var PasswordInput = ({ value, onChange, placeholder = "", icon, showIcon = true,
     showPassword ? /* @__PURE__ */ jsx(Eye, { className: "absolute right-2 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground cursor-pointer", onClick: () => setShowPassword(false) }) : /* @__PURE__ */ jsx(EyeOff, { className: "absolute right-2 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground cursor-pointer", onClick: () => setShowPassword(true) })
   ] });
 };
-var TextAreaInput = ({ value, onChange, placeholder = "", className = "", variant = "default", status = "default", bordered, borderColor, rows }) => /* @__PURE__ */ jsx(BaseInput, { variant, status, bordered, borderColor, className: cn("items-start", className), children: /* @__PURE__ */ jsx(
-  Textarea,
-  {
-    rows,
-    placeholder,
-    value,
-    onChange: (ev) => onChange(ev.target.value),
-    className: "h-full border-0 bg-transparent p-0 text-muted-foreground shadow-none focus-visible:border-transparent focus-visible:ring-0 focus-visible:ring-transparent focus-visible:ring-offset-0 dark:bg-transparent"
-  }
-) });
+var DEFAULT_ROWS = 3;
+var MIN_ROWS = 2;
+var REM_PER_ROW = 1.5;
+var VERTICAL_PADDING_REM = 1;
+var TextAreaInput = ({ value, onChange, placeholder = "", className = "", variant = "default", status = "default", bordered, borderColor, rows }) => {
+  const visibleRows = Math.max(rows ?? DEFAULT_ROWS, MIN_ROWS);
+  const minHeight = `${visibleRows * REM_PER_ROW + VERTICAL_PADDING_REM}rem`;
+  return /* @__PURE__ */ jsx(
+    BaseInput,
+    {
+      variant,
+      status,
+      bordered,
+      borderColor,
+      className: cn("h-auto items-start", className),
+      style: { minHeight },
+      children: /* @__PURE__ */ jsx(
+        Textarea,
+        {
+          rows: visibleRows,
+          placeholder,
+          value,
+          onChange: (ev) => onChange(ev.target.value),
+          className: "h-full min-h-0 resize-y border-0 bg-transparent p-0 text-muted-foreground shadow-none focus-visible:border-transparent focus-visible:ring-0 focus-visible:ring-transparent focus-visible:ring-offset-0 dark:bg-transparent"
+        }
+      )
+    }
+  );
+};
 function renderItems(items) {
   return items.map((item) => {
     const value = typeof item === "string" ? item : item.value;
@@ -7744,6 +7763,12 @@ function issuePath(issue) {
 function matchesFieldPath(path, field) {
   return path === field || path.startsWith(`${field}.`) || field.startsWith(`${path}.`);
 }
+function footerDividerClass(divider = "none") {
+  if (divider === false || divider === "none") return "border-t-0";
+  if (divider === "dashed") return "border-t border-dashed border-border";
+  if (divider === "dotted") return "border-t border-dotted border-border";
+  return "border-t border-solid border-border";
+}
 function WizardForm({
   steps,
   schema,
@@ -7761,7 +7786,9 @@ function WizardForm({
   bordered,
   className,
   classNames,
-  footerSlot
+  footerSlot,
+  footerDivider = "none",
+  footerDividerClassName
 }) {
   const nav = useStepNavigation({
     steps,
@@ -7876,13 +7903,25 @@ function WizardForm({
             ]
           }
         ) }) }),
-        showFooter && /* @__PURE__ */ jsxs("div", { className: cn("sticky bottom-0 z-10 mt-auto flex shrink-0 items-center justify-between border-t border-border bg-background/95 pt-3 backdrop-blur", classNames?.footer), children: [
-          /* @__PURE__ */ jsx("div", { children: !nav.isFirstStep && /* @__PURE__ */ jsx(Button, { type: "button", variant: "outline", onClick: nav.handlePrevious, children: previousLabel }) }),
-          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-            footerSlot,
-            nav.isLastStep ? /* @__PURE__ */ jsx(Button, { type: "submit", form: `step-${currentStepConfig.id}`, children: submitLabel }) : /* @__PURE__ */ jsx(Button, { type: "submit", form: `step-${currentStepConfig.id}`, children: nextLabel })
-          ] })
-        ] })
+        showFooter && /* @__PURE__ */ jsxs(
+          "div",
+          {
+            "data-najm-wizard-footer": "true",
+            className: cn(
+              "sticky bottom-0 z-10 mt-auto flex shrink-0 items-center justify-between bg-background/95 pt-3 backdrop-blur",
+              footerDividerClass(footerDivider),
+              footerDividerClassName,
+              classNames?.footer
+            ),
+            children: [
+              /* @__PURE__ */ jsx("div", { children: !nav.isFirstStep && /* @__PURE__ */ jsx(Button, { type: "button", variant: "outline", onClick: nav.handlePrevious, children: previousLabel }) }),
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+                footerSlot,
+                nav.isLastStep ? /* @__PURE__ */ jsx(Button, { type: "submit", form: `step-${currentStepConfig.id}`, children: submitLabel }) : /* @__PURE__ */ jsx(Button, { type: "submit", form: `step-${currentStepConfig.id}`, children: nextLabel })
+              ] })
+            ]
+          }
+        )
       ]
     }
   );
@@ -9338,7 +9377,7 @@ function NTableJson() {
   if (viewMode !== "json") return null;
   return /* @__PURE__ */ jsx("div", { className: "flex-1 flex flex-col min-h-0 overflow-hidden", children: renderJson?.() ?? /* @__PURE__ */ jsx(NajmScroll, { axis: "both", className: "h-full min-h-0 rounded-md border border-border bg-muted/40", children: /* @__PURE__ */ jsx("pre", { className: "p-4 font-mono text-xs leading-relaxed text-foreground", children: formatJsonValue(jsonValue) }) }) });
 }
-var DEFAULT_ROWS = 6;
+var DEFAULT_ROWS2 = 6;
 function NTableHeaderSkeleton() {
   const filters = useTableStore.use.filters();
   const showViewToggle = useTableStore.use.showViewToggle();
@@ -9363,7 +9402,7 @@ function NTableHeaderSkeleton() {
     ] })
   ] });
 }
-function NTableLoadingSkeleton({ rows = DEFAULT_ROWS }) {
+function NTableLoadingSkeleton({ rows = DEFAULT_ROWS2 }) {
   const columns = useTableStore.use.columns();
   const showCheckbox = useTableStore.use.showCheckbox();
   const headerClassName = useTableStore.use.headerClassName();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "najm-kit",
-  "version": "0.0.29",
+  "version": "0.0.30",
   "type": "module",
   "description": "Reusable React UI component package for Najm framework",
   "main": "./dist/index.mjs",