@nexus-cross/design-system 1.0.12 → 1.0.13

package/dist/chunks/{chunk-HI5XZ4PB.mjs → chunk-Z4YM7LU3.mjs}

@@ -8,7 +8,8 @@ var toggleGroupVariants = cva("nexus-toggle-group", {
   variants: {
     variant: {
       default: "nexus-toggle-group--default",
-      outline: "nexus-toggle-group--outline"
+      primary: "nexus-toggle-group--primary",
+      secondary: "nexus-toggle-group--secondary"
     },
     size: {
       sm: "nexus-toggle-group--sm",
@@ -22,7 +23,7 @@ var toggleGroupVariants = cva("nexus-toggle-group", {
   }
 });
 var ToggleGroup = React.forwardRef(
-  ({ className, variant, size, items, disabled, required, ...props }, ref) => {
+  ({ className, variant, size, items, disabled, required = true, ...props }, ref) => {
     const rootRef = React.useRef(null);
     const [animated, setAnimated] = React.useState(false);
     const [pos, setPos] = React.useState(null);
@@ -39,10 +40,9 @@ var ToggleGroup = React.forwardRef(
     React.useEffect(() => {
       if (currentValue !== void 0) setTrackedValue(currentValue);
     }, [currentValue]);
-    const isDefault = variant !== "outline";
     React.useLayoutEffect(() => {
       const root = rootRef.current;
-      if (!root || !isDefault) return;
+      if (!root) return;
       const activeVal = Array.isArray(trackedValue) ? trackedValue[0] : trackedValue;
       if (!activeVal) {
         setPos(null);
@@ -66,7 +66,7 @@ var ToggleGroup = React.forwardRef(
         x: elRect.left - rootRect.left,
         y: elRect.top - rootRect.top
       });
-    }, [trackedValue, items, isDefault]);
+    }, [trackedValue, items]);
     React.useEffect(() => {
       const frame = requestAnimationFrame(() => {
         requestAnimationFrame(() => setAnimated(true));
@@ -118,7 +118,7 @@ var ToggleGroup = React.forwardRef(
         disabled,
         ...rootProps,
         children: [
-          isDefault && /* @__PURE__ */ jsx(
+          /* @__PURE__ */ jsx(
             "span",
             {
               className: cn(
@@ -134,7 +134,7 @@ var ToggleGroup = React.forwardRef(
             {
               value: item.value,
               disabled: item.disabled,
-              className: "nexus-toggle-group__item",
+              className: cn("nexus-toggle-group__item", item.className),
               children: [
                 item.icon && /* @__PURE__ */ jsx("span", { className: "nexus-toggle-group__icon", children: item.icon }),
                 item.label && /* @__PURE__ */ jsx("span", { children: item.label })

package/dist/components/ToggleGroup.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { type VariantProps } from 'class-variance-authority';
 declare const toggleGroupVariants: (props?: ({
-    variant?: "default" | "outline" | null | undefined;
+    variant?: "primary" | "secondary" | "default" | null | undefined;
     size?: "lg" | "md" | "sm" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 interface ToggleGroupItem {
@@ -9,6 +9,7 @@ interface ToggleGroupItem {
     label: React.ReactNode;
     icon?: React.ReactNode;
     disabled?: boolean;
+    className?: string;
 }
 interface ToggleGroupSingleProps extends VariantProps<typeof toggleGroupVariants> {
     type?: 'single';

package/dist/components/ToggleGroup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ToggleGroup.d.ts","sourceRoot":"","sources":["../../src/components/ToggleGroup.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAGlE,QAAA,MAAM,mBAAmB;;;8EAgBvB,CAAC;AAEH,UAAU,eAAe;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,UAAU,sBAAuB,SAAQ,YAAY,CAAC,OAAO,mBAAmB,CAAC;IAC/E,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,KAAK,EAAE,eAAe,EAAE,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,UAAU,wBAAyB,SAAQ,YAAY,CAAC,OAAO,mBAAmB,CAAC;IACjF,IAAI,EAAE,UAAU,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC1C,KAAK,EAAE,eAAe,EAAE,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,KAAK,gBAAgB,GAAG,sBAAsB,GAAG,wBAAwB,CAAC;AAS1E,QAAA,MAAM,WAAW,yFAsJhB,CAAC;AAIF,OAAO,EAAE,WAAW,EAAE,mBAAmB,EAAE,CAAC;AAC5C,YAAY,EAAE,gBAAgB,EAAE,eAAe,EAAE,CAAC"}
+{"version":3,"file":"ToggleGroup.d.ts","sourceRoot":"","sources":["../../src/components/ToggleGroup.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAGlE,QAAA,MAAM,mBAAmB;;;8EAiBvB,CAAC;AAEH,UAAU,eAAe;IACvB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,UAAU,sBAAuB,SAAQ,YAAY,CAAC,OAAO,mBAAmB,CAAC;IAC/E,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,KAAK,EAAE,eAAe,EAAE,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,UAAU,wBAAyB,SAAQ,YAAY,CAAC,OAAO,mBAAmB,CAAC;IACjF,IAAI,EAAE,UAAU,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC1C,KAAK,EAAE,eAAe,EAAE,CAAC;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,KAAK,gBAAgB,GAAG,sBAAsB,GAAG,wBAAwB,CAAC;AAS1E,QAAA,MAAM,WAAW,yFAkJhB,CAAC;AAIF,OAAO,EAAE,WAAW,EAAE,mBAAmB,EAAE,CAAC;AAC5C,YAAY,EAAE,gBAAgB,EAAE,eAAe,EAAE,CAAC"}

package/dist/index.js

@@ -19,7 +19,7 @@ var chunkPDJTSQOC_js = require('./chunks/chunk-PDJTSQOC.js');
 var chunkWATCVNBT_js = require('./chunks/chunk-WATCVNBT.js');
 var chunkX3CTJ7TD_js = require('./chunks/chunk-X3CTJ7TD.js');
 var chunkC2DSAJTL_js = require('./chunks/chunk-C2DSAJTL.js');
-var chunk2WM23PO6_js = require('./chunks/chunk-2WM23PO6.js');
+var chunkK574BYHQ_js = require('./chunks/chunk-K574BYHQ.js');
 var chunkLOQXCHKL_js = require('./chunks/chunk-LOQXCHKL.js');
 var chunkYCG4FZC3_js = require('./chunks/chunk-YCG4FZC3.js');
 var chunkOMN5YQCE_js = require('./chunks/chunk-OMN5YQCE.js');
@@ -495,11 +495,11 @@ Object.defineProperty(exports, "DropdownMenuTrigger", {
 });
 Object.defineProperty(exports, "ToggleGroup", {
   enumerable: true,
-  get: function () { return chunk2WM23PO6_js.ToggleGroup; }
+  get: function () { return chunkK574BYHQ_js.ToggleGroup; }
 });
 Object.defineProperty(exports, "toggleGroupVariants", {
   enumerable: true,
-  get: function () { return chunk2WM23PO6_js.toggleGroupVariants; }
+  get: function () { return chunkK574BYHQ_js.toggleGroupVariants; }
 });
 Object.defineProperty(exports, "Popover", {
   enumerable: true,

package/dist/index.mjs

@@ -17,7 +17,7 @@ export { EmptyState, emptyStateVariants } from './chunks/chunk-YO5MSDPX.mjs';
 export { Breadcrumb, BreadcrumbItem } from './chunks/chunk-DDY7ENHX.mjs';
 export { Stepper, stepperVariants } from './chunks/chunk-MMCA33FW.mjs';
 export { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuRoot, DropdownMenuSeparator, DropdownMenuTrigger } from './chunks/chunk-6DBRL6NA.mjs';
-export { ToggleGroup, toggleGroupVariants } from './chunks/chunk-HI5XZ4PB.mjs';
+export { ToggleGroup, toggleGroupVariants } from './chunks/chunk-Z4YM7LU3.mjs';
 export { Popover, PopoverArrow, PopoverClose, PopoverContent, PopoverTrigger, popoverContentClasses } from './chunks/chunk-ULGYTBCT.mjs';
 export { Carousel, CarouselDots, CarouselNext, CarouselPrev, CarouselSlide, useCarousel } from './chunks/chunk-3HHJORN7.mjs';
 export { VirtualGrid, VirtualList } from './chunks/chunk-EHAUUUWB.mjs';

package/dist/schemas/_all.json

@@ -3496,6 +3496,10 @@
                   "disabled": {
                     "type": "boolean",
                     "description": "Disabled"
+                  },
+                  "className": {
+                    "type": "string",
+                    "description": "Item style override"
                   }
                 },
                 "required": [
@@ -3518,10 +3522,11 @@
               "type": "string",
               "enum": [
                 "default",
-                "outline"
+                "primary",
+                "secondary"
               ],
               "default": "default",
-              "description": "Style variant"
+              "description": "Style variant (default=slider, primary=accent filled, secondary=accent filled)"
             },
             "size": {
               "type": "string",
@@ -3539,6 +3544,7 @@
             },
             "required": {
               "type": "boolean",
+              "default": true,
               "description": "Prevent deselection (at least one must be selected)"
             },
             "className": {

package/dist/schemas/toggle-group.d.ts

@@ -6,13 +6,16 @@ export declare const toggleGroupPropsSchema: z.ZodObject<{
         label: z.ZodAny;
         icon: z.ZodOptional<z.ZodAny>;
         disabled: z.ZodOptional<z.ZodBoolean>;
+        className: z.ZodOptional<z.ZodString>;
     }, "strip", z.ZodTypeAny, {
         value: string;
+        className?: string | undefined;
         label?: any;
         icon?: any;
         disabled?: boolean | undefined;
     }, {
         value: string;
+        className?: string | undefined;
         label?: any;
         icon?: any;
         disabled?: boolean | undefined;
@@ -20,30 +23,32 @@ export declare const toggleGroupPropsSchema: z.ZodObject<{
     value: z.ZodOptional<z.ZodAny>;
     defaultValue: z.ZodOptional<z.ZodAny>;
     onValueChange: z.ZodOptional<z.ZodAny>;
-    variant: z.ZodDefault<z.ZodEnum<["default", "outline"]>>;
+    variant: z.ZodDefault<z.ZodEnum<["default", "primary", "secondary"]>>;
     size: z.ZodDefault<z.ZodEnum<["sm", "md", "lg"]>>;
     disabled: z.ZodOptional<z.ZodBoolean>;
-    required: z.ZodOptional<z.ZodBoolean>;
+    required: z.ZodDefault<z.ZodBoolean>;
     className: z.ZodOptional<z.ZodString>;
 }, "strip", z.ZodTypeAny, {
     type: "multiple" | "single";
     size: "lg" | "md" | "sm";
-    variant: "default" | "outline";
+    variant: "primary" | "secondary" | "default";
     items: {
         value: string;
+        className?: string | undefined;
         label?: any;
         icon?: any;
         disabled?: boolean | undefined;
     }[];
+    required: boolean;
     className?: string | undefined;
     value?: any;
     disabled?: boolean | undefined;
     defaultValue?: any;
     onValueChange?: any;
-    required?: boolean | undefined;
 }, {
     items: {
         value: string;
+        className?: string | undefined;
         label?: any;
         icon?: any;
         disabled?: boolean | undefined;
@@ -53,7 +58,7 @@ export declare const toggleGroupPropsSchema: z.ZodObject<{
     value?: any;
     size?: "lg" | "md" | "sm" | undefined;
     disabled?: boolean | undefined;
-    variant?: "default" | "outline" | undefined;
+    variant?: "primary" | "secondary" | "default" | undefined;
     defaultValue?: any;
     onValueChange?: any;
     required?: boolean | undefined;

package/dist/schemas/toggle-group.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"toggle-group.d.ts","sourceRoot":"","sources":["../../src/schemas/toggle-group.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AASxB,eAAO,MAAM,sBAAsB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAauC,CAAC"}
+{"version":3,"file":"toggle-group.d.ts","sourceRoot":"","sources":["../../src/schemas/toggle-group.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AAUxB,eAAO,MAAM,sBAAsB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAauC,CAAC"}

package/dist/schemas/toggleGroup.json

@@ -31,6 +31,10 @@
               "disabled": {
                 "type": "boolean",
                 "description": "Disabled"
+              },
+              "className": {
+                "type": "string",
+                "description": "Item style override"
               }
             },
             "required": [
@@ -53,10 +57,11 @@
           "type": "string",
           "enum": [
             "default",
-            "outline"
+            "primary",
+            "secondary"
           ],
           "default": "default",
-          "description": "Style variant"
+          "description": "Style variant (default=slider, primary=accent filled, secondary=accent filled)"
         },
         "size": {
           "type": "string",
@@ -74,6 +79,7 @@
         },
         "required": {
           "type": "boolean",
+          "default": true,
           "description": "Prevent deselection (at least one must be selected)"
         },
         "className": {

package/dist/schemas.js

@@ -123,7 +123,8 @@ var toggleGroupItemSchema = zod.z.object({
   value: zod.z.string().describe("Item value"),
   label: zod.z.any().describe("Display label (ReactNode)"),
   icon: zod.z.any().optional().describe("Icon (ReactNode)"),
-  disabled: zod.z.boolean().optional().describe("Disabled")
+  disabled: zod.z.boolean().optional().describe("Disabled"),
+  className: zod.z.string().optional().describe("Item style override")
 });
 var toggleGroupPropsSchema = zod.z.object({
   type: zod.z.enum(["single", "multiple"]).default("single").describe("Selection mode"),
@@ -131,10 +132,10 @@ var toggleGroupPropsSchema = zod.z.object({
   value: zod.z.any().optional().describe("Controlled value (string | string[])"),
   defaultValue: zod.z.any().optional().describe("Default value"),
   onValueChange: zod.z.any().optional().describe("Value change callback"),
-  variant: zod.z.enum(["default", "outline"]).default("default").describe("Style variant"),
+  variant: zod.z.enum(["default", "primary", "secondary"]).default("default").describe("Style variant (default=slider, primary=accent filled, secondary=accent filled)"),
   size: zod.z.enum(["sm", "md", "lg"]).default("md").describe("Size"),
   disabled: zod.z.boolean().optional().describe("Disable all items"),
-  required: zod.z.boolean().optional().describe("Prevent deselection (at least one must be selected)"),
+  required: zod.z.boolean().default(true).describe("Prevent deselection (at least one must be selected)"),
   className: zod.z.string().optional().describe("Style override")
 }).describe("Toggle group / Segment control. Based on Radix ToggleGroup.");
 var sliderPropsSchema = zod.z.object({

package/dist/schemas.mjs

@@ -121,7 +121,8 @@ var toggleGroupItemSchema = z.object({
   value: z.string().describe("Item value"),
   label: z.any().describe("Display label (ReactNode)"),
   icon: z.any().optional().describe("Icon (ReactNode)"),
-  disabled: z.boolean().optional().describe("Disabled")
+  disabled: z.boolean().optional().describe("Disabled"),
+  className: z.string().optional().describe("Item style override")
 });
 var toggleGroupPropsSchema = z.object({
   type: z.enum(["single", "multiple"]).default("single").describe("Selection mode"),
@@ -129,10 +130,10 @@ var toggleGroupPropsSchema = z.object({
   value: z.any().optional().describe("Controlled value (string | string[])"),
   defaultValue: z.any().optional().describe("Default value"),
   onValueChange: z.any().optional().describe("Value change callback"),
-  variant: z.enum(["default", "outline"]).default("default").describe("Style variant"),
+  variant: z.enum(["default", "primary", "secondary"]).default("default").describe("Style variant (default=slider, primary=accent filled, secondary=accent filled)"),
   size: z.enum(["sm", "md", "lg"]).default("md").describe("Size"),
   disabled: z.boolean().optional().describe("Disable all items"),
-  required: z.boolean().optional().describe("Prevent deselection (at least one must be selected)"),
+  required: z.boolean().default(true).describe("Prevent deselection (at least one must be selected)"),
   className: z.string().optional().describe("Style override")
 }).describe("Toggle group / Segment control. Based on Radix ToggleGroup.");
 var sliderPropsSchema = z.object({