@next-degree/pickle-shared-js 0.10.8 → 0.11.0

package/dist/components/jobCard/JobLocation.cjs

@@ -0,0 +1,85 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/jobCard/JobLocation.tsx
+var JobLocation_exports = {};
+__export(JobLocation_exports, {
+  default: () => JobLocation_default
+});
+module.exports = __toCommonJS(JobLocation_exports);
+var import_lucide_react = require("lucide-react");
+
+// src/components/primitives/tooltip.tsx
+var TooltipPrimitive = __toESM(require("@radix-ui/react-tooltip"), 1);
+var React = __toESM(require("react"), 1);
+
+// src/lib/utils.ts
+var import_clsx = require("clsx");
+var import_tailwind_merge = require("tailwind-merge");
+function cn(...inputs) {
+  return (0, import_tailwind_merge.twMerge)((0, import_clsx.clsx)(inputs));
+}
+
+// src/components/primitives/tooltip.tsx
+var import_jsx_runtime = require("react/jsx-runtime");
+var TooltipProvider = TooltipPrimitive.Provider;
+var Tooltip = TooltipPrimitive.Root;
+var TooltipTrigger = TooltipPrimitive.Trigger;
+var TooltipContent = React.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+  TooltipPrimitive.Content,
+  {
+    ref,
+    sideOffset,
+    className: cn(
+      "z-50 overflow-hidden rounded-md border border-neutral-200 bg-white px-3 py-1.5 text-sm text-neutral-950 shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 dark:border-neutral-800 dark:bg-neutral-950 dark:text-neutral-50",
+      className
+    ),
+    ...props
+  }
+));
+TooltipContent.displayName = TooltipPrimitive.Content.displayName;
+
+// src/components/jobCard/JobLocation.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+function JobLocation({ mainLocation, extendedLocations }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "flex items-center gap-2", "data-testid": "job-card-location", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_lucide_react.MapPin, { size: 16 }),
+    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: "text-sm font-thin", children: mainLocation }),
+    extendedLocations && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(TooltipProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(Tooltip, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(TooltipTrigger, { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "length-text group rounded-full bg-grey-5 px-2 py-1 text-sm font-bold text-gray-700 group-hover:cursor-pointer", children: [
+        "+ ",
+        extendedLocations.length,
+        " more"
+      ] }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(TooltipContent, { className: "border-1 rounded-md border border-grey-5 bg-white p-2", children: extendedLocations.map((location) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "text-nowrap text-sm", children: location }, location)) })
+    ] }) })
+  ] });
+}
+var JobLocation_default = JobLocation;
+//# sourceMappingURL=JobLocation.cjs.map

package/dist/components/jobCard/JobLocation.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/jobCard/JobLocation.tsx","../../../src/components/primitives/tooltip.tsx","../../../src/lib/utils.ts"],"sourcesContent":["import { MapPin } from 'lucide-react'\n\nimport {\n  Tooltip,\n  TooltipContent,\n  TooltipProvider,\n  TooltipTrigger,\n} from '@/components/primitives/tooltip'\n\ntype JobLocationProps = Readonly<{\n  mainLocation: string\n  extendedLocations?: string[]\n}>\n\nfunction JobLocation({ mainLocation, extendedLocations }: JobLocationProps) {\n  return (\n    <div className=\"flex items-center gap-2\" data-testid=\"job-card-location\">\n      <MapPin size={16} />\n      <span className=\"text-sm font-thin\">{mainLocation}</span>\n      {extendedLocations && (\n        <TooltipProvider>\n          <Tooltip>\n            <TooltipTrigger>\n              <div className=\"length-text group rounded-full bg-grey-5 px-2 py-1 text-sm font-bold text-gray-700 group-hover:cursor-pointer\">\n                + {extendedLocations.length} more\n              </div>\n            </TooltipTrigger>\n            <TooltipContent className=\"border-1 rounded-md border border-grey-5 bg-white p-2\">\n              {extendedLocations.map((location) => (\n                <div key={location} className=\"text-nowrap text-sm\">\n                  {location}\n                </div>\n              ))}\n            </TooltipContent>\n          </Tooltip>\n        </TooltipProvider>\n      )}\n    </div>\n  )\n}\n\nexport default JobLocation\n","'use client'\n\nimport * as TooltipPrimitive from '@radix-ui/react-tooltip'\nimport * as React from 'react'\n\nimport { cn } from '@/lib/utils'\n\nconst TooltipProvider = TooltipPrimitive.Provider\n\nconst Tooltip = TooltipPrimitive.Root\n\nconst TooltipTrigger = TooltipPrimitive.Trigger\n\nconst TooltipContent = React.forwardRef<\n  React.ElementRef<typeof TooltipPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content>\n>(({ className, sideOffset = 4, ...props }, ref) => (\n  <TooltipPrimitive.Content\n    ref={ref}\n    sideOffset={sideOffset}\n    className={cn(\n      'z-50 overflow-hidden rounded-md border border-neutral-200 bg-white px-3 py-1.5 text-sm text-neutral-950 shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 dark:border-neutral-800 dark:bg-neutral-950 dark:text-neutral-50',\n      className\n    )}\n    {...props}\n  />\n))\nTooltipContent.displayName = TooltipPrimitive.Content.displayName\n\nexport { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger }\n","import { type ClassValue, clsx } from 'clsx'\nimport { twMerge } from 'tailwind-merge'\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs))\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAAuB;;;ACEvB,uBAAkC;AAClC,YAAuB;;;ACHvB,kBAAsC;AACtC,4BAAwB;AAEjB,SAAS,MAAM,QAAsB;AAC1C,aAAO,mCAAQ,kBAAK,MAAM,CAAC;AAC7B;;;ADYE;AAVF,IAAM,kBAAmC;AAEzC,IAAM,UAA2B;AAEjC,IAAM,iBAAkC;AAExC,IAAM,iBAAuB,iBAG3B,CAAC,EAAE,WAAW,aAAa,GAAG,GAAG,MAAM,GAAG,QAC1C;AAAA,EAAkB;AAAA,EAAjB;AAAA,IACC;AAAA,IACA;AAAA,IACA,WAAW;AAAA,MACT;AAAA,MACA;AAAA,IACF;AAAA,IACC,GAAG;AAAA;AACN,CACD;AACD,eAAe,cAA+B,yBAAQ;;;ADVhD,IAAAA,sBAAA;AAHN,SAAS,YAAY,EAAE,cAAc,kBAAkB,GAAqB;AAC1E,SACE,8CAAC,SAAI,WAAU,2BAA0B,eAAY,qBACnD;AAAA,iDAAC,8BAAO,MAAM,IAAI;AAAA,IAClB,6CAAC,UAAK,WAAU,qBAAqB,wBAAa;AAAA,IACjD,qBACC,6CAAC,mBACC,wDAAC,WACC;AAAA,mDAAC,kBACC,wDAAC,SAAI,WAAU,iHAAgH;AAAA;AAAA,QAC1H,kBAAkB;AAAA,QAAO;AAAA,SAC9B,GACF;AAAA,MACA,6CAAC,kBAAe,WAAU,yDACvB,4BAAkB,IAAI,CAAC,aACtB,6CAAC,SAAmB,WAAU,uBAC3B,sBADO,QAEV,CACD,GACH;AAAA,OACF,GACF;AAAA,KAEJ;AAEJ;AAEA,IAAO,sBAAQ;","names":["import_jsx_runtime"]}

package/dist/components/jobCard/JobLocation.d.cts

@@ -0,0 +1,9 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+type JobLocationProps = Readonly<{
+    mainLocation: string;
+    extendedLocations?: string[];
+}>;
+declare function JobLocation({ mainLocation, extendedLocations }: JobLocationProps): react_jsx_runtime.JSX.Element;
+
+export { JobLocation as default };

package/dist/components/jobCard/JobLocation.d.ts

@@ -0,0 +1,9 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+type JobLocationProps = Readonly<{
+    mainLocation: string;
+    extendedLocations?: string[];
+}>;
+declare function JobLocation({ mainLocation, extendedLocations }: JobLocationProps): react_jsx_runtime.JSX.Element;
+
+export { JobLocation as default };

package/dist/components/jobCard/JobLocation.js

@@ -0,0 +1,54 @@
+// src/components/jobCard/JobLocation.tsx
+import { MapPin } from "lucide-react";
+
+// src/components/primitives/tooltip.tsx
+import * as TooltipPrimitive from "@radix-ui/react-tooltip";
+import * as React from "react";
+
+// src/lib/utils.ts
+import { clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+
+// src/components/primitives/tooltip.tsx
+import { jsx } from "react/jsx-runtime";
+var TooltipProvider = TooltipPrimitive.Provider;
+var Tooltip = TooltipPrimitive.Root;
+var TooltipTrigger = TooltipPrimitive.Trigger;
+var TooltipContent = React.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx(
+  TooltipPrimitive.Content,
+  {
+    ref,
+    sideOffset,
+    className: cn(
+      "z-50 overflow-hidden rounded-md border border-neutral-200 bg-white px-3 py-1.5 text-sm text-neutral-950 shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 dark:border-neutral-800 dark:bg-neutral-950 dark:text-neutral-50",
+      className
+    ),
+    ...props
+  }
+));
+TooltipContent.displayName = TooltipPrimitive.Content.displayName;
+
+// src/components/jobCard/JobLocation.tsx
+import { jsx as jsx2, jsxs } from "react/jsx-runtime";
+function JobLocation({ mainLocation, extendedLocations }) {
+  return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", "data-testid": "job-card-location", children: [
+    /* @__PURE__ */ jsx2(MapPin, { size: 16 }),
+    /* @__PURE__ */ jsx2("span", { className: "text-sm font-thin", children: mainLocation }),
+    extendedLocations && /* @__PURE__ */ jsx2(TooltipProvider, { children: /* @__PURE__ */ jsxs(Tooltip, { children: [
+      /* @__PURE__ */ jsx2(TooltipTrigger, { children: /* @__PURE__ */ jsxs("div", { className: "length-text group rounded-full bg-grey-5 px-2 py-1 text-sm font-bold text-gray-700 group-hover:cursor-pointer", children: [
+        "+ ",
+        extendedLocations.length,
+        " more"
+      ] }) }),
+      /* @__PURE__ */ jsx2(TooltipContent, { className: "border-1 rounded-md border border-grey-5 bg-white p-2", children: extendedLocations.map((location) => /* @__PURE__ */ jsx2("div", { className: "text-nowrap text-sm", children: location }, location)) })
+    ] }) })
+  ] });
+}
+var JobLocation_default = JobLocation;
+export {
+  JobLocation_default as default
+};
+//# sourceMappingURL=JobLocation.js.map

package/dist/components/jobCard/JobLocation.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/jobCard/JobLocation.tsx","../../../src/components/primitives/tooltip.tsx","../../../src/lib/utils.ts"],"sourcesContent":["import { MapPin } from 'lucide-react'\n\nimport {\n  Tooltip,\n  TooltipContent,\n  TooltipProvider,\n  TooltipTrigger,\n} from '@/components/primitives/tooltip'\n\ntype JobLocationProps = Readonly<{\n  mainLocation: string\n  extendedLocations?: string[]\n}>\n\nfunction JobLocation({ mainLocation, extendedLocations }: JobLocationProps) {\n  return (\n    <div className=\"flex items-center gap-2\" data-testid=\"job-card-location\">\n      <MapPin size={16} />\n      <span className=\"text-sm font-thin\">{mainLocation}</span>\n      {extendedLocations && (\n        <TooltipProvider>\n          <Tooltip>\n            <TooltipTrigger>\n              <div className=\"length-text group rounded-full bg-grey-5 px-2 py-1 text-sm font-bold text-gray-700 group-hover:cursor-pointer\">\n                + {extendedLocations.length} more\n              </div>\n            </TooltipTrigger>\n            <TooltipContent className=\"border-1 rounded-md border border-grey-5 bg-white p-2\">\n              {extendedLocations.map((location) => (\n                <div key={location} className=\"text-nowrap text-sm\">\n                  {location}\n                </div>\n              ))}\n            </TooltipContent>\n          </Tooltip>\n        </TooltipProvider>\n      )}\n    </div>\n  )\n}\n\nexport default JobLocation\n","'use client'\n\nimport * as TooltipPrimitive from '@radix-ui/react-tooltip'\nimport * as React from 'react'\n\nimport { cn } from '@/lib/utils'\n\nconst TooltipProvider = TooltipPrimitive.Provider\n\nconst Tooltip = TooltipPrimitive.Root\n\nconst TooltipTrigger = TooltipPrimitive.Trigger\n\nconst TooltipContent = React.forwardRef<\n  React.ElementRef<typeof TooltipPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content>\n>(({ className, sideOffset = 4, ...props }, ref) => (\n  <TooltipPrimitive.Content\n    ref={ref}\n    sideOffset={sideOffset}\n    className={cn(\n      'z-50 overflow-hidden rounded-md border border-neutral-200 bg-white px-3 py-1.5 text-sm text-neutral-950 shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 dark:border-neutral-800 dark:bg-neutral-950 dark:text-neutral-50',\n      className\n    )}\n    {...props}\n  />\n))\nTooltipContent.displayName = TooltipPrimitive.Content.displayName\n\nexport { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger }\n","import { type ClassValue, clsx } from 'clsx'\nimport { twMerge } from 'tailwind-merge'\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs))\n}\n"],"mappings":";AAAA,SAAS,cAAc;;;ACEvB,YAAY,sBAAsB;AAClC,YAAY,WAAW;;;ACHvB,SAA0B,YAAY;AACtC,SAAS,eAAe;AAEjB,SAAS,MAAM,QAAsB;AAC1C,SAAO,QAAQ,KAAK,MAAM,CAAC;AAC7B;;;ADYE;AAVF,IAAM,kBAAmC;AAEzC,IAAM,UAA2B;AAEjC,IAAM,iBAAkC;AAExC,IAAM,iBAAuB,iBAG3B,CAAC,EAAE,WAAW,aAAa,GAAG,GAAG,MAAM,GAAG,QAC1C;AAAA,EAAkB;AAAA,EAAjB;AAAA,IACC;AAAA,IACA;AAAA,IACA,WAAW;AAAA,MACT;AAAA,MACA;AAAA,IACF;AAAA,IACC,GAAG;AAAA;AACN,CACD;AACD,eAAe,cAA+B,yBAAQ;;;ADVhD,gBAAAA,MAMQ,YANR;AAHN,SAAS,YAAY,EAAE,cAAc,kBAAkB,GAAqB;AAC1E,SACE,qBAAC,SAAI,WAAU,2BAA0B,eAAY,qBACnD;AAAA,oBAAAA,KAAC,UAAO,MAAM,IAAI;AAAA,IAClB,gBAAAA,KAAC,UAAK,WAAU,qBAAqB,wBAAa;AAAA,IACjD,qBACC,gBAAAA,KAAC,mBACC,+BAAC,WACC;AAAA,sBAAAA,KAAC,kBACC,+BAAC,SAAI,WAAU,iHAAgH;AAAA;AAAA,QAC1H,kBAAkB;AAAA,QAAO;AAAA,SAC9B,GACF;AAAA,MACA,gBAAAA,KAAC,kBAAe,WAAU,yDACvB,4BAAkB,IAAI,CAAC,aACtB,gBAAAA,KAAC,SAAmB,WAAU,uBAC3B,sBADO,QAEV,CACD,GACH;AAAA,OACF,GACF;AAAA,KAEJ;AAEJ;AAEA,IAAO,sBAAQ;","names":["jsx"]}

package/dist/components/jobPost/JobPost.d.cts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { ReactNode } from 'react';
-import { J as JobPostModel } from '../../job_posting_service_latest-DOGQ9tEu.cjs';
+import { J as JobPostModel } from '../../job_posting_service_latest-DaKYQh30.cjs';
 import 'zod';
 
 type JobPostProps = {

package/dist/components/jobPost/JobPost.d.ts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { ReactNode } from 'react';
-import { J as JobPostModel } from '../../job_posting_service_latest-DOGQ9tEu.js';
+import { J as JobPostModel } from '../../job_posting_service_latest-DaKYQh30.js';
 import 'zod';
 
 type JobPostProps = {

package/dist/components/primitives/command.d.cts

@@ -25,7 +25,7 @@ declare const CommandInput: React.ForwardRefExoticComponent<Omit<Omit<Pick<Pick<
     ref?: React.Ref<HTMLInputElement>;
 } & {
     asChild?: boolean;
-}, "key" | "asChild" | keyof React.InputHTMLAttributes<HTMLInputElement>>, "value" | "onChange" | "type"> & {
+}, "key" | "asChild" | keyof React.InputHTMLAttributes<HTMLInputElement>>, "value" | "type" | "onChange"> & {
     value?: string;
     onValueChange?: (search: string) => void;
 } & React.RefAttributes<HTMLInputElement>, "ref"> & React.RefAttributes<HTMLInputElement>>;

package/dist/components/primitives/command.d.ts

@@ -25,7 +25,7 @@ declare const CommandInput: React.ForwardRefExoticComponent<Omit<Omit<Pick<Pick<
     ref?: React.Ref<HTMLInputElement>;
 } & {
     asChild?: boolean;
-}, "key" | "asChild" | keyof React.InputHTMLAttributes<HTMLInputElement>>, "value" | "onChange" | "type"> & {
+}, "key" | "asChild" | keyof React.InputHTMLAttributes<HTMLInputElement>>, "value" | "type" | "onChange"> & {
     value?: string;
     onValueChange?: (search: string) => void;
 } & React.RefAttributes<HTMLInputElement>, "ref"> & React.RefAttributes<HTMLInputElement>>;

package/dist/components/ui/StepTabs.cjs

@@ -35,6 +35,7 @@ __export(StepTabs_exports, {
 });
 module.exports = __toCommonJS(StepTabs_exports);
 var Tabs = __toESM(require("@radix-ui/react-tabs"), 1);
+var import_cva = require("cva");
 
 // src/lib/utils.ts
 var import_clsx = require("clsx");
@@ -45,13 +46,40 @@ function cn(...inputs) {
 
 // src/components/ui/StepTabs.tsx
 var import_jsx_runtime = require("react/jsx-runtime");
+var tabParentVariants = (0, import_cva.cva)("flex flex-col", {
+  variants: {
+    variant: {
+      primary: "rounded-lg border shadow-sm",
+      neutral: ""
+    }
+  },
+  defaultVariants: {
+    variant: "primary"
+  }
+});
+var singleTabVariants = (0, import_cva.cva)(
+  "flex h-[45px] flex-1 cursor-pointer select-none items-center justify-center bg-white px-5 text-[15px] leading-none text-gray-800 outline-none",
+  {
+    variants: {
+      variant: {
+        primary: "first:rounded-tl-md last:rounded-tr-md hover:text-purple-100 data-[state=active]:text-purple-100 data-[state=active]:shadow-[inset_0_-1px_0_0,0_1px_0_0] data-[state=active]:shadow-current data-[state=active]:focus:relative data-[state=active]:focus:shadow-[0_0_0_2px] data-[state=active]:focus:shadow-black",
+        neutral: "first:rounded-tl-md last:rounded-tr-md hover:text-black data-[state=active]:text-black data-[state=active]:shadow-[inset_0_-1px_0_0,0_1px_0_0] data-[state=active]:shadow-current data-[state=active]:focus:relative"
+      }
+    },
+    defaultVariants: {
+      variant: "primary"
+    }
+  }
+);
 function StepTabs({
   list,
   currentStep,
   setCurrentStep,
   children,
   className,
+  classNameTab,
   defaultValue,
+  variant,
   ...props
 }) {
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
@@ -60,19 +88,19 @@ function StepTabs({
       value: currentStep,
       onValueChange: setCurrentStep,
       defaultValue: defaultValue ?? "0",
-      className: cn("flex flex-col rounded-lg border shadow-sm", className),
+      className: cn(tabParentVariants({ variant }), className),
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Tabs.List, { className: "flex shrink-0 border-b border-grey-20", children: children.length > 1 && list.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Tabs.List, { className: "flex shrink-0 border-b border-grey-20", children: list.length > 1 && list.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
           Tabs.Trigger,
           {
-            className: "flex h-[45px] flex-1 cursor-default select-none items-center justify-center bg-white px-5 text-[15px] leading-none text-gray-800 outline-none first:rounded-tl-md last:rounded-tr-md hover:text-purple-100 data-[state=active]:text-purple-100 data-[state=active]:shadow-[inset_0_-1px_0_0,0_1px_0_0] data-[state=active]:shadow-current data-[state=active]:focus:relative data-[state=active]:focus:shadow-[0_0_0_2px] data-[state=active]:focus:shadow-black",
+            className: cn(singleTabVariants({ variant }), classNameTab),
             value: index.toString(),
             children: item
           },
           `${item}-${index}`
         )) }),
-        children.map((child, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        children && children.map((child, index) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
           Tabs.Content,
           {
             className: "grow rounded-b-md bg-white p-5 outline-none",

package/dist/components/ui/StepTabs.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ui/StepTabs.tsx","../../../src/lib/utils.ts"],"sourcesContent":["'use client'\n\nimport * as Tabs from '@radix-ui/react-tabs'\nimport { type ReactNode } from 'react'\n\nimport { cn } from '@/lib/utils'\n\ntype StepTabsProps = Tabs.TabsProps & {\n  list: string[]\n  currentStep?: string\n  setCurrentStep?: (step: string) => void\n  children: ReactNode[]\n}\n\nexport function StepTabs({\n  list,\n  currentStep,\n  setCurrentStep,\n  children,\n  className,\n  defaultValue,\n  ...props\n}: StepTabsProps) {\n  return (\n    <Tabs.Root\n      value={currentStep}\n      onValueChange={setCurrentStep}\n      defaultValue={defaultValue ?? '0'}\n      className={cn('flex flex-col rounded-lg border shadow-sm', className)}\n      {...props}\n    >\n      <Tabs.List className=\"flex shrink-0 border-b border-grey-20\">\n        {children.length > 1 &&\n          list.map((item, index) => (\n            <Tabs.Trigger\n              key={`${item}-${index}`}\n              className=\"flex h-[45px] flex-1 cursor-default select-none items-center justify-center bg-white px-5 text-[15px] leading-none text-gray-800 outline-none first:rounded-tl-md last:rounded-tr-md hover:text-purple-100 data-[state=active]:text-purple-100 data-[state=active]:shadow-[inset_0_-1px_0_0,0_1px_0_0] data-[state=active]:shadow-current data-[state=active]:focus:relative data-[state=active]:focus:shadow-[0_0_0_2px] data-[state=active]:focus:shadow-black\"\n              value={index.toString()}\n            >\n              {item}\n            </Tabs.Trigger>\n          ))}\n      </Tabs.List>\n\n      {children.map((child, index) => (\n        <Tabs.Content\n          key={index}\n          className=\"grow rounded-b-md bg-white p-5 outline-none\"\n          value={index.toString()}\n        >\n          {child}\n        </Tabs.Content>\n      ))}\n    </Tabs.Root>\n  )\n}\n","import { type ClassValue, clsx } from 'clsx'\nimport { twMerge } from 'tailwind-merge'\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs))\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,WAAsB;;;ACFtB,kBAAsC;AACtC,4BAAwB;AAEjB,SAAS,MAAM,QAAsB;AAC1C,aAAO,mCAAQ,kBAAK,MAAM,CAAC;AAC7B;;;ADmBI;AAVG,SAAS,SAAS;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAkB;AAChB,SACE;AAAA,IAAM;AAAA,IAAL;AAAA,MACC,OAAO;AAAA,MACP,eAAe;AAAA,MACf,cAAc,gBAAgB;AAAA,MAC9B,WAAW,GAAG,6CAA6C,SAAS;AAAA,MACnE,GAAG;AAAA,MAEJ;AAAA,oDAAM,WAAL,EAAU,WAAU,yCAClB,mBAAS,SAAS,KACjB,KAAK,IAAI,CAAC,MAAM,UACd;AAAA,UAAM;AAAA,UAAL;AAAA,YAEC,WAAU;AAAA,YACV,OAAO,MAAM,SAAS;AAAA,YAErB;AAAA;AAAA,UAJI,GAAG,IAAI,IAAI,KAAK;AAAA,QAKvB,CACD,GACL;AAAA,QAEC,SAAS,IAAI,CAAC,OAAO,UACpB;AAAA,UAAM;AAAA,UAAL;AAAA,YAEC,WAAU;AAAA,YACV,OAAO,MAAM,SAAS;AAAA,YAErB;AAAA;AAAA,UAJI;AAAA,QAKP,CACD;AAAA;AAAA;AAAA,EACH;AAEJ;","names":[]}
+{"version":3,"sources":["../../../src/components/ui/StepTabs.tsx","../../../src/lib/utils.ts"],"sourcesContent":["'use client'\n\nimport * as Tabs from '@radix-ui/react-tabs'\nimport { cva, type VariantProps } from 'cva'\nimport { type ReactNode } from 'react'\n\nimport { cn } from '@/lib/utils'\n\nconst tabParentVariants = cva('flex flex-col', {\n  variants: {\n    variant: {\n      primary: 'rounded-lg border shadow-sm',\n      neutral: '',\n    },\n  },\n  defaultVariants: {\n    variant: 'primary',\n  },\n})\n\nconst singleTabVariants = cva(\n  'flex h-[45px] flex-1 cursor-pointer select-none items-center justify-center bg-white px-5 text-[15px] leading-none text-gray-800 outline-none',\n  {\n    variants: {\n      variant: {\n        primary:\n          'first:rounded-tl-md last:rounded-tr-md hover:text-purple-100 data-[state=active]:text-purple-100 data-[state=active]:shadow-[inset_0_-1px_0_0,0_1px_0_0] data-[state=active]:shadow-current data-[state=active]:focus:relative data-[state=active]:focus:shadow-[0_0_0_2px] data-[state=active]:focus:shadow-black',\n        neutral:\n          'first:rounded-tl-md last:rounded-tr-md hover:text-black data-[state=active]:text-black data-[state=active]:shadow-[inset_0_-1px_0_0,0_1px_0_0] data-[state=active]:shadow-current data-[state=active]:focus:relative',\n      },\n    },\n    defaultVariants: {\n      variant: 'primary',\n    },\n  }\n)\n\ntype StepTabsProps = Tabs.TabsProps &\n  VariantProps<typeof tabParentVariants> &\n  VariantProps<typeof singleTabVariants> & {\n    list: string[]\n    currentStep?: string\n    setCurrentStep?: (step: string) => void\n    children?: ReactNode[]\n    classNameTab?: string\n  }\n\nexport function StepTabs({\n  list,\n  currentStep,\n  setCurrentStep,\n  children,\n  className,\n  classNameTab,\n  defaultValue,\n  variant,\n  ...props\n}: StepTabsProps) {\n  return (\n    <Tabs.Root\n      value={currentStep}\n      onValueChange={setCurrentStep}\n      defaultValue={defaultValue ?? '0'}\n      className={cn(tabParentVariants({ variant }), className)}\n      {...props}\n    >\n      <Tabs.List className=\"flex shrink-0 border-b border-grey-20\">\n        {list.length > 1 &&\n          list.map((item, index) => (\n            <Tabs.Trigger\n              key={`${item}-${index}`}\n              className={cn(singleTabVariants({ variant }), classNameTab)}\n              value={index.toString()}\n            >\n              {item}\n            </Tabs.Trigger>\n          ))}\n      </Tabs.List>\n\n      {children &&\n        children.map((child, index) => (\n          <Tabs.Content\n            key={index}\n            className=\"grow rounded-b-md bg-white p-5 outline-none\"\n            value={index.toString()}\n          >\n            {child}\n          </Tabs.Content>\n        ))}\n    </Tabs.Root>\n  )\n}\n","import { type ClassValue, clsx } from 'clsx'\nimport { twMerge } from 'tailwind-merge'\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs))\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,WAAsB;AACtB,iBAAuC;;;ACHvC,kBAAsC;AACtC,4BAAwB;AAEjB,SAAS,MAAM,QAAsB;AAC1C,aAAO,mCAAQ,kBAAK,MAAM,CAAC;AAC7B;;;ADsDI;AAnDJ,IAAM,wBAAoB,gBAAI,iBAAiB;AAAA,EAC7C,UAAU;AAAA,IACR,SAAS;AAAA,MACP,SAAS;AAAA,MACT,SAAS;AAAA,IACX;AAAA,EACF;AAAA,EACA,iBAAiB;AAAA,IACf,SAAS;AAAA,EACX;AACF,CAAC;AAED,IAAM,wBAAoB;AAAA,EACxB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,SAAS;AAAA,QACP,SACE;AAAA,QACF,SACE;AAAA,MACJ;AAAA,IACF;AAAA,IACA,iBAAiB;AAAA,MACf,SAAS;AAAA,IACX;AAAA,EACF;AACF;AAYO,SAAS,SAAS;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAkB;AAChB,SACE;AAAA,IAAM;AAAA,IAAL;AAAA,MACC,OAAO;AAAA,MACP,eAAe;AAAA,MACf,cAAc,gBAAgB;AAAA,MAC9B,WAAW,GAAG,kBAAkB,EAAE,QAAQ,CAAC,GAAG,SAAS;AAAA,MACtD,GAAG;AAAA,MAEJ;AAAA,oDAAM,WAAL,EAAU,WAAU,yCAClB,eAAK,SAAS,KACb,KAAK,IAAI,CAAC,MAAM,UACd;AAAA,UAAM;AAAA,UAAL;AAAA,YAEC,WAAW,GAAG,kBAAkB,EAAE,QAAQ,CAAC,GAAG,YAAY;AAAA,YAC1D,OAAO,MAAM,SAAS;AAAA,YAErB;AAAA;AAAA,UAJI,GAAG,IAAI,IAAI,KAAK;AAAA,QAKvB,CACD,GACL;AAAA,QAEC,YACC,SAAS,IAAI,CAAC,OAAO,UACnB;AAAA,UAAM;AAAA,UAAL;AAAA,YAEC,WAAU;AAAA,YACV,OAAO,MAAM,SAAS;AAAA,YAErB;AAAA;AAAA,UAJI;AAAA,QAKP,CACD;AAAA;AAAA;AAAA,EACL;AAEJ;","names":[]}

package/dist/components/ui/StepTabs.d.cts

@@ -1,13 +1,22 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as cva_types from 'cva/types';
 import * as Tabs from '@radix-ui/react-tabs';
+import { VariantProps } from 'cva';
 import { ReactNode } from 'react';
 
-type StepTabsProps = Tabs.TabsProps & {
+declare const tabParentVariants: (props?: ({
+    variant?: "neutral" | "primary" | null | undefined;
+} & cva_types.ClassProp) | undefined) => string;
+declare const singleTabVariants: (props?: ({
+    variant?: "neutral" | "primary" | null | undefined;
+} & cva_types.ClassProp) | undefined) => string;
+type StepTabsProps = Tabs.TabsProps & VariantProps<typeof tabParentVariants> & VariantProps<typeof singleTabVariants> & {
     list: string[];
     currentStep?: string;
     setCurrentStep?: (step: string) => void;
-    children: ReactNode[];
+    children?: ReactNode[];
+    classNameTab?: string;
 };
-declare function StepTabs({ list, currentStep, setCurrentStep, children, className, defaultValue, ...props }: StepTabsProps): react_jsx_runtime.JSX.Element;
+declare function StepTabs({ list, currentStep, setCurrentStep, children, className, classNameTab, defaultValue, variant, ...props }: StepTabsProps): react_jsx_runtime.JSX.Element;
 
 export { StepTabs };

package/dist/components/ui/StepTabs.d.ts

@@ -1,13 +1,22 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as cva_types from 'cva/types';
 import * as Tabs from '@radix-ui/react-tabs';
+import { VariantProps } from 'cva';
 import { ReactNode } from 'react';
 
-type StepTabsProps = Tabs.TabsProps & {
+declare const tabParentVariants: (props?: ({
+    variant?: "neutral" | "primary" | null | undefined;
+} & cva_types.ClassProp) | undefined) => string;
+declare const singleTabVariants: (props?: ({
+    variant?: "neutral" | "primary" | null | undefined;
+} & cva_types.ClassProp) | undefined) => string;
+type StepTabsProps = Tabs.TabsProps & VariantProps<typeof tabParentVariants> & VariantProps<typeof singleTabVariants> & {
     list: string[];
     currentStep?: string;
     setCurrentStep?: (step: string) => void;
-    children: ReactNode[];
+    children?: ReactNode[];
+    classNameTab?: string;
 };
-declare function StepTabs({ list, currentStep, setCurrentStep, children, className, defaultValue, ...props }: StepTabsProps): react_jsx_runtime.JSX.Element;
+declare function StepTabs({ list, currentStep, setCurrentStep, children, className, classNameTab, defaultValue, variant, ...props }: StepTabsProps): react_jsx_runtime.JSX.Element;
 
 export { StepTabs };

package/dist/components/ui/StepTabs.js

@@ -2,6 +2,7 @@
 
 // src/components/ui/StepTabs.tsx
 import * as Tabs from "@radix-ui/react-tabs";
+import { cva } from "cva";
 
 // src/lib/utils.ts
 import { clsx } from "clsx";
@@ -12,13 +13,40 @@ function cn(...inputs) {
 
 // src/components/ui/StepTabs.tsx
 import { jsx, jsxs } from "react/jsx-runtime";
+var tabParentVariants = cva("flex flex-col", {
+  variants: {
+    variant: {
+      primary: "rounded-lg border shadow-sm",
+      neutral: ""
+    }
+  },
+  defaultVariants: {
+    variant: "primary"
+  }
+});
+var singleTabVariants = cva(
+  "flex h-[45px] flex-1 cursor-pointer select-none items-center justify-center bg-white px-5 text-[15px] leading-none text-gray-800 outline-none",
+  {
+    variants: {
+      variant: {
+        primary: "first:rounded-tl-md last:rounded-tr-md hover:text-purple-100 data-[state=active]:text-purple-100 data-[state=active]:shadow-[inset_0_-1px_0_0,0_1px_0_0] data-[state=active]:shadow-current data-[state=active]:focus:relative data-[state=active]:focus:shadow-[0_0_0_2px] data-[state=active]:focus:shadow-black",
+        neutral: "first:rounded-tl-md last:rounded-tr-md hover:text-black data-[state=active]:text-black data-[state=active]:shadow-[inset_0_-1px_0_0,0_1px_0_0] data-[state=active]:shadow-current data-[state=active]:focus:relative"
+      }
+    },
+    defaultVariants: {
+      variant: "primary"
+    }
+  }
+);
 function StepTabs({
   list,
   currentStep,
   setCurrentStep,
   children,
   className,
+  classNameTab,
   defaultValue,
+  variant,
   ...props
 }) {
   return /* @__PURE__ */ jsxs(
@@ -27,19 +55,19 @@ function StepTabs({
       value: currentStep,
       onValueChange: setCurrentStep,
       defaultValue: defaultValue ?? "0",
-      className: cn("flex flex-col rounded-lg border shadow-sm", className),
+      className: cn(tabParentVariants({ variant }), className),
       ...props,
       children: [
-        /* @__PURE__ */ jsx(Tabs.List, { className: "flex shrink-0 border-b border-grey-20", children: children.length > 1 && list.map((item, index) => /* @__PURE__ */ jsx(
+        /* @__PURE__ */ jsx(Tabs.List, { className: "flex shrink-0 border-b border-grey-20", children: list.length > 1 && list.map((item, index) => /* @__PURE__ */ jsx(
           Tabs.Trigger,
           {
-            className: "flex h-[45px] flex-1 cursor-default select-none items-center justify-center bg-white px-5 text-[15px] leading-none text-gray-800 outline-none first:rounded-tl-md last:rounded-tr-md hover:text-purple-100 data-[state=active]:text-purple-100 data-[state=active]:shadow-[inset_0_-1px_0_0,0_1px_0_0] data-[state=active]:shadow-current data-[state=active]:focus:relative data-[state=active]:focus:shadow-[0_0_0_2px] data-[state=active]:focus:shadow-black",
+            className: cn(singleTabVariants({ variant }), classNameTab),
             value: index.toString(),
             children: item
           },
           `${item}-${index}`
         )) }),
-        children.map((child, index) => /* @__PURE__ */ jsx(
+        children && children.map((child, index) => /* @__PURE__ */ jsx(
           Tabs.Content,
           {
             className: "grow rounded-b-md bg-white p-5 outline-none",

package/dist/components/ui/StepTabs.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/ui/StepTabs.tsx","../../../src/lib/utils.ts"],"sourcesContent":["'use client'\n\nimport * as Tabs from '@radix-ui/react-tabs'\nimport { type ReactNode } from 'react'\n\nimport { cn } from '@/lib/utils'\n\ntype StepTabsProps = Tabs.TabsProps & {\n  list: string[]\n  currentStep?: string\n  setCurrentStep?: (step: string) => void\n  children: ReactNode[]\n}\n\nexport function StepTabs({\n  list,\n  currentStep,\n  setCurrentStep,\n  children,\n  className,\n  defaultValue,\n  ...props\n}: StepTabsProps) {\n  return (\n    <Tabs.Root\n      value={currentStep}\n      onValueChange={setCurrentStep}\n      defaultValue={defaultValue ?? '0'}\n      className={cn('flex flex-col rounded-lg border shadow-sm', className)}\n      {...props}\n    >\n      <Tabs.List className=\"flex shrink-0 border-b border-grey-20\">\n        {children.length > 1 &&\n          list.map((item, index) => (\n            <Tabs.Trigger\n              key={`${item}-${index}`}\n              className=\"flex h-[45px] flex-1 cursor-default select-none items-center justify-center bg-white px-5 text-[15px] leading-none text-gray-800 outline-none first:rounded-tl-md last:rounded-tr-md hover:text-purple-100 data-[state=active]:text-purple-100 data-[state=active]:shadow-[inset_0_-1px_0_0,0_1px_0_0] data-[state=active]:shadow-current data-[state=active]:focus:relative data-[state=active]:focus:shadow-[0_0_0_2px] data-[state=active]:focus:shadow-black\"\n              value={index.toString()}\n            >\n              {item}\n            </Tabs.Trigger>\n          ))}\n      </Tabs.List>\n\n      {children.map((child, index) => (\n        <Tabs.Content\n          key={index}\n          className=\"grow rounded-b-md bg-white p-5 outline-none\"\n          value={index.toString()}\n        >\n          {child}\n        </Tabs.Content>\n      ))}\n    </Tabs.Root>\n  )\n}\n","import { type ClassValue, clsx } from 'clsx'\nimport { twMerge } from 'tailwind-merge'\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs))\n}\n"],"mappings":";;;AAEA,YAAY,UAAU;;;ACFtB,SAA0B,YAAY;AACtC,SAAS,eAAe;AAEjB,SAAS,MAAM,QAAsB;AAC1C,SAAO,QAAQ,KAAK,MAAM,CAAC;AAC7B;;;ADmBI,SAUQ,KAVR;AAVG,SAAS,SAAS;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAkB;AAChB,SACE;AAAA,IAAM;AAAA,IAAL;AAAA,MACC,OAAO;AAAA,MACP,eAAe;AAAA,MACf,cAAc,gBAAgB;AAAA,MAC9B,WAAW,GAAG,6CAA6C,SAAS;AAAA,MACnE,GAAG;AAAA,MAEJ;AAAA,4BAAM,WAAL,EAAU,WAAU,yCAClB,mBAAS,SAAS,KACjB,KAAK,IAAI,CAAC,MAAM,UACd;AAAA,UAAM;AAAA,UAAL;AAAA,YAEC,WAAU;AAAA,YACV,OAAO,MAAM,SAAS;AAAA,YAErB;AAAA;AAAA,UAJI,GAAG,IAAI,IAAI,KAAK;AAAA,QAKvB,CACD,GACL;AAAA,QAEC,SAAS,IAAI,CAAC,OAAO,UACpB;AAAA,UAAM;AAAA,UAAL;AAAA,YAEC,WAAU;AAAA,YACV,OAAO,MAAM,SAAS;AAAA,YAErB;AAAA;AAAA,UAJI;AAAA,QAKP,CACD;AAAA;AAAA;AAAA,EACH;AAEJ;","names":[]}
+{"version":3,"sources":["../../../src/components/ui/StepTabs.tsx","../../../src/lib/utils.ts"],"sourcesContent":["'use client'\n\nimport * as Tabs from '@radix-ui/react-tabs'\nimport { cva, type VariantProps } from 'cva'\nimport { type ReactNode } from 'react'\n\nimport { cn } from '@/lib/utils'\n\nconst tabParentVariants = cva('flex flex-col', {\n  variants: {\n    variant: {\n      primary: 'rounded-lg border shadow-sm',\n      neutral: '',\n    },\n  },\n  defaultVariants: {\n    variant: 'primary',\n  },\n})\n\nconst singleTabVariants = cva(\n  'flex h-[45px] flex-1 cursor-pointer select-none items-center justify-center bg-white px-5 text-[15px] leading-none text-gray-800 outline-none',\n  {\n    variants: {\n      variant: {\n        primary:\n          'first:rounded-tl-md last:rounded-tr-md hover:text-purple-100 data-[state=active]:text-purple-100 data-[state=active]:shadow-[inset_0_-1px_0_0,0_1px_0_0] data-[state=active]:shadow-current data-[state=active]:focus:relative data-[state=active]:focus:shadow-[0_0_0_2px] data-[state=active]:focus:shadow-black',\n        neutral:\n          'first:rounded-tl-md last:rounded-tr-md hover:text-black data-[state=active]:text-black data-[state=active]:shadow-[inset_0_-1px_0_0,0_1px_0_0] data-[state=active]:shadow-current data-[state=active]:focus:relative',\n      },\n    },\n    defaultVariants: {\n      variant: 'primary',\n    },\n  }\n)\n\ntype StepTabsProps = Tabs.TabsProps &\n  VariantProps<typeof tabParentVariants> &\n  VariantProps<typeof singleTabVariants> & {\n    list: string[]\n    currentStep?: string\n    setCurrentStep?: (step: string) => void\n    children?: ReactNode[]\n    classNameTab?: string\n  }\n\nexport function StepTabs({\n  list,\n  currentStep,\n  setCurrentStep,\n  children,\n  className,\n  classNameTab,\n  defaultValue,\n  variant,\n  ...props\n}: StepTabsProps) {\n  return (\n    <Tabs.Root\n      value={currentStep}\n      onValueChange={setCurrentStep}\n      defaultValue={defaultValue ?? '0'}\n      className={cn(tabParentVariants({ variant }), className)}\n      {...props}\n    >\n      <Tabs.List className=\"flex shrink-0 border-b border-grey-20\">\n        {list.length > 1 &&\n          list.map((item, index) => (\n            <Tabs.Trigger\n              key={`${item}-${index}`}\n              className={cn(singleTabVariants({ variant }), classNameTab)}\n              value={index.toString()}\n            >\n              {item}\n            </Tabs.Trigger>\n          ))}\n      </Tabs.List>\n\n      {children &&\n        children.map((child, index) => (\n          <Tabs.Content\n            key={index}\n            className=\"grow rounded-b-md bg-white p-5 outline-none\"\n            value={index.toString()}\n          >\n            {child}\n          </Tabs.Content>\n        ))}\n    </Tabs.Root>\n  )\n}\n","import { type ClassValue, clsx } from 'clsx'\nimport { twMerge } from 'tailwind-merge'\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs))\n}\n"],"mappings":";;;AAEA,YAAY,UAAU;AACtB,SAAS,WAA8B;;;ACHvC,SAA0B,YAAY;AACtC,SAAS,eAAe;AAEjB,SAAS,MAAM,QAAsB;AAC1C,SAAO,QAAQ,KAAK,MAAM,CAAC;AAC7B;;;ADsDI,SAUQ,KAVR;AAnDJ,IAAM,oBAAoB,IAAI,iBAAiB;AAAA,EAC7C,UAAU;AAAA,IACR,SAAS;AAAA,MACP,SAAS;AAAA,MACT,SAAS;AAAA,IACX;AAAA,EACF;AAAA,EACA,iBAAiB;AAAA,IACf,SAAS;AAAA,EACX;AACF,CAAC;AAED,IAAM,oBAAoB;AAAA,EACxB;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,SAAS;AAAA,QACP,SACE;AAAA,QACF,SACE;AAAA,MACJ;AAAA,IACF;AAAA,IACA,iBAAiB;AAAA,MACf,SAAS;AAAA,IACX;AAAA,EACF;AACF;AAYO,SAAS,SAAS;AAAA,EACvB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAkB;AAChB,SACE;AAAA,IAAM;AAAA,IAAL;AAAA,MACC,OAAO;AAAA,MACP,eAAe;AAAA,MACf,cAAc,gBAAgB;AAAA,MAC9B,WAAW,GAAG,kBAAkB,EAAE,QAAQ,CAAC,GAAG,SAAS;AAAA,MACtD,GAAG;AAAA,MAEJ;AAAA,4BAAM,WAAL,EAAU,WAAU,yCAClB,eAAK,SAAS,KACb,KAAK,IAAI,CAAC,MAAM,UACd;AAAA,UAAM;AAAA,UAAL;AAAA,YAEC,WAAW,GAAG,kBAAkB,EAAE,QAAQ,CAAC,GAAG,YAAY;AAAA,YAC1D,OAAO,MAAM,SAAS;AAAA,YAErB;AAAA;AAAA,UAJI,GAAG,IAAI,IAAI,KAAK;AAAA,QAKvB,CACD,GACL;AAAA,QAEC,YACC,SAAS,IAAI,CAAC,OAAO,UACnB;AAAA,UAAM;AAAA,UAAL;AAAA,YAEC,WAAU;AAAA,YACV,OAAO,MAAM,SAAS;AAAA,YAErB;AAAA;AAAA,UAJI;AAAA,QAKP,CACD;AAAA;AAAA;AAAA,EACL;AAEJ;","names":[]}

package/dist/{displayText-CBIWVZVw.d.ts → displayText-D8MYOaYK.d.ts}

@@ -1,7 +1,7 @@
 import * as zod from 'zod';
 import { z } from 'zod';
-import { E as EmploymentTypeEnum, a as EmploymentLevelEnum, b as JobFunctionEnum, B as BestFitEnum, C as ClinicalSpecialtyEnum, S as ShiftEnum, c as ClinicalSettingEnum } from './job_posting_service_latest-DOGQ9tEu.js';
-import { U as UnitTextEnum, C as CurrencyEnum } from './shared_pickle_output_latest-DKOmTyYk.js';
+import { E as EmploymentTypeEnum, a as EmploymentLevelEnum, b as JobFunctionEnum, B as BestFitEnum, C as ClinicalSpecialtyEnum, S as ShiftEnum, c as ClinicalSettingEnum } from './job_posting_service_latest-DaKYQh30.js';
+import { U as UnitTextEnum, C as CurrencyEnum } from './shared_pickle_output_latest-BjRRmT8R.js';
 
 declare const employmentTypeDisplayText: DisplayTextConfig<typeof EmploymentTypeEnum>;
 declare const unitTextDisplayText: DisplayTextConfig<typeof UnitTextEnum>;

package/dist/{displayText-4cJ7-3Mw.d.cts → displayText-DHKm6_JF.d.cts}

@@ -1,7 +1,7 @@
 import * as zod from 'zod';
 import { z } from 'zod';
-import { E as EmploymentTypeEnum, a as EmploymentLevelEnum, b as JobFunctionEnum, B as BestFitEnum, C as ClinicalSpecialtyEnum, S as ShiftEnum, c as ClinicalSettingEnum } from './job_posting_service_latest-DOGQ9tEu.cjs';
-import { U as UnitTextEnum, C as CurrencyEnum } from './shared_pickle_output_latest-DKOmTyYk.cjs';
+import { E as EmploymentTypeEnum, a as EmploymentLevelEnum, b as JobFunctionEnum, B as BestFitEnum, C as ClinicalSpecialtyEnum, S as ShiftEnum, c as ClinicalSettingEnum } from './job_posting_service_latest-DaKYQh30.cjs';
+import { U as UnitTextEnum, C as CurrencyEnum } from './shared_pickle_output_latest-BjRRmT8R.cjs';
 
 declare const employmentTypeDisplayText: DisplayTextConfig<typeof EmploymentTypeEnum>;
 declare const unitTextDisplayText: DisplayTextConfig<typeof UnitTextEnum>;

package/dist/hooks/useDisplayText.d.cts

@@ -1,7 +1,7 @@
-import { S as ServiceMappings } from '../displayText-4cJ7-3Mw.cjs';
+import { S as ServiceMappings } from '../displayText-DHKm6_JF.cjs';
 import 'zod';
-import '../job_posting_service_latest-DOGQ9tEu.cjs';
-import '../shared_pickle_output_latest-DKOmTyYk.cjs';
+import '../job_posting_service_latest-DaKYQh30.cjs';
+import '../shared_pickle_output_latest-BjRRmT8R.cjs';
 
 declare const useDisplayText: (scope: keyof ServiceMappings, value: string | string[] | undefined | null) => string;
 

package/dist/hooks/useDisplayText.d.ts

@@ -1,7 +1,7 @@
-import { S as ServiceMappings } from '../displayText-CBIWVZVw.js';
+import { S as ServiceMappings } from '../displayText-D8MYOaYK.js';
 import 'zod';
-import '../job_posting_service_latest-DOGQ9tEu.js';
-import '../shared_pickle_output_latest-DKOmTyYk.js';
+import '../job_posting_service_latest-DaKYQh30.js';
+import '../shared_pickle_output_latest-BjRRmT8R.js';
 
 declare const useDisplayText: (scope: keyof ServiceMappings, value: string | string[] | undefined | null) => string;
 

package/dist/index.cjs

@@ -2016,14 +2016,42 @@ var datePickerStyle = (0, import_cva9.cva)([
 
 // src/components/ui/StepTabs.tsx
 var Tabs = __toESM(require("@radix-ui/react-tabs"), 1);
+var import_cva10 = require("cva");
 var import_jsx_runtime32 = require("react/jsx-runtime");
+var tabParentVariants = (0, import_cva10.cva)("flex flex-col", {
+  variants: {
+    variant: {
+      primary: "rounded-lg border shadow-sm",
+      neutral: ""
+    }
+  },
+  defaultVariants: {
+    variant: "primary"
+  }
+});
+var singleTabVariants = (0, import_cva10.cva)(
+  "flex h-[45px] flex-1 cursor-pointer select-none items-center justify-center bg-white px-5 text-[15px] leading-none text-gray-800 outline-none",
+  {
+    variants: {
+      variant: {
+        primary: "first:rounded-tl-md last:rounded-tr-md hover:text-purple-100 data-[state=active]:text-purple-100 data-[state=active]:shadow-[inset_0_-1px_0_0,0_1px_0_0] data-[state=active]:shadow-current data-[state=active]:focus:relative data-[state=active]:focus:shadow-[0_0_0_2px] data-[state=active]:focus:shadow-black",
+        neutral: "first:rounded-tl-md last:rounded-tr-md hover:text-black data-[state=active]:text-black data-[state=active]:shadow-[inset_0_-1px_0_0,0_1px_0_0] data-[state=active]:shadow-current data-[state=active]:focus:relative"
+      }
+    },
+    defaultVariants: {
+      variant: "primary"
+    }
+  }
+);
 function StepTabs({
   list,
   currentStep,
   setCurrentStep,
   children,
   className,
+  classNameTab,
   defaultValue,
+  variant,
   ...props
 }) {
   return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(
@@ -2032,19 +2060,19 @@ function StepTabs({
       value: currentStep,
       onValueChange: setCurrentStep,
       defaultValue: defaultValue ?? "0",
-      className: cn("flex flex-col rounded-lg border shadow-sm", className),
+      className: cn(tabParentVariants({ variant }), className),
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Tabs.List, { className: "flex shrink-0 border-b border-grey-20", children: children.length > 1 && list.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Tabs.List, { className: "flex shrink-0 border-b border-grey-20", children: list.length > 1 && list.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
           Tabs.Trigger,
           {
-            className: "flex h-[45px] flex-1 cursor-default select-none items-center justify-center bg-white px-5 text-[15px] leading-none text-gray-800 outline-none first:rounded-tl-md last:rounded-tr-md hover:text-purple-100 data-[state=active]:text-purple-100 data-[state=active]:shadow-[inset_0_-1px_0_0,0_1px_0_0] data-[state=active]:shadow-current data-[state=active]:focus:relative data-[state=active]:focus:shadow-[0_0_0_2px] data-[state=active]:focus:shadow-black",
+            className: cn(singleTabVariants({ variant }), classNameTab),
             value: index.toString(),
             children: item
           },
           `${item}-${index}`
         )) }),
-        children.map((child, index) => /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+        children && children.map((child, index) => /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
           Tabs.Content,
           {
             className: "grow rounded-b-md bg-white p-5 outline-none",