@karakuri-ui/react 0.2.2 → 0.2.4

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

@@ -0,0 +1,30 @@
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import * as React from 'react';
+import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
+import { VariantProps } from 'class-variance-authority';
+
+declare const segmentedVariants: (props?: ({
+    variant?: "default" | "outline" | "ghost" | "underline" | null | undefined;
+    size?: "default" | "sm" | "lg" | "md" | null | undefined;
+    radius?: "default" | "sm" | "lg" | "base" | "none" | "xl" | "2xl" | "3xl" | "full" | null | undefined;
+    fontWeight?: "normal" | "semibold" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare const segmentedItemVariants: (props?: ({
+    variant?: "default" | "outline" | "ghost" | "underline" | null | undefined;
+    size?: "default" | "sm" | "lg" | "md" | null | undefined;
+    radius?: "default" | "sm" | "lg" | "base" | "none" | "xl" | "2xl" | "3xl" | "full" | null | undefined;
+    contentType?: "text" | "icon" | "icon-text" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface SegmentedProps extends React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Root>, VariantProps<typeof segmentedVariants> {
+}
+interface SegmentedItemProps extends React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Item>, Omit<VariantProps<typeof segmentedItemVariants>, 'variant'> {
+}
+declare const SegmentedItem: React.ForwardRefExoticComponent<SegmentedItemProps & React.RefAttributes<HTMLButtonElement>>;
+declare const Segmented: React.ForwardRefExoticComponent<SegmentedProps & React.RefAttributes<HTMLDivElement>> & {
+    Item: React.ForwardRefExoticComponent<SegmentedItemProps & React.RefAttributes<HTMLButtonElement>>;
+};
+declare namespace Segmented {
+    type ItemProps = SegmentedItemProps;
+}
+
+export { Segmented, SegmentedItem, type SegmentedItemProps, type SegmentedProps, segmentedItemVariants, segmentedVariants };

package/dist/components/ui/segmented.js

@@ -0,0 +1,241 @@
+"use strict";
+"use client";
+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);
+var segmented_exports = {};
+__export(segmented_exports, {
+  Segmented: () => Segmented,
+  SegmentedItem: () => SegmentedItem,
+  segmentedItemVariants: () => segmentedItemVariants,
+  segmentedVariants: () => segmentedVariants
+});
+module.exports = __toCommonJS(segmented_exports);
+var React = __toESM(require("react"));
+var RadioGroupPrimitive = __toESM(require("@radix-ui/react-radio-group"));
+var import_class_variance_authority = require("class-variance-authority");
+var import_utils = require("../../lib/utils");
+const SegmentedContext = React.createContext({});
+const useSegmentedContext = () => React.useContext(SegmentedContext);
+const segmentedVariants = (0, import_class_variance_authority.cva)(
+  "inline-flex items-center text-text-subtle",
+  {
+    variants: {
+      variant: {
+        default: "bg-background-muted gap-1",
+        outline: "bg-background border border-border-form gap-1",
+        underline: "bg-transparent border-b border-border-form gap-0",
+        ghost: "bg-transparent gap-1"
+      },
+      size: {
+        sm: "h-8",
+        // 32px height
+        md: "h-9",
+        // 36px height
+        default: "h-10",
+        // 40px height
+        lg: "h-12"
+        // 48px height
+      },
+      radius: {
+        none: "rounded-none",
+        sm: "rounded-sm",
+        base: "rounded",
+        default: "rounded-md",
+        lg: "rounded-lg",
+        xl: "rounded-xl",
+        "2xl": "rounded-2xl",
+        "3xl": "rounded-3xl",
+        full: "rounded-full"
+      },
+      fontWeight: {
+        normal: "[&>*]:font-normal",
+        semibold: "[&>*]:font-semibold"
+      }
+    },
+    compoundVariants: [
+      // Padding for default/outline/ghost variants
+      { variant: "default", className: "p-1" },
+      { variant: "outline", className: "p-1" },
+      { variant: "ghost", className: "p-1" },
+      // Underline has no padding
+      { variant: "underline", className: "p-0" }
+    ],
+    defaultVariants: {
+      variant: "default",
+      size: "default",
+      radius: "default",
+      fontWeight: "normal"
+    }
+  }
+);
+const segmentedItemVariants = (0, import_class_variance_authority.cva)(
+  [
+    "inline-flex items-center justify-center whitespace-nowrap h-full",
+    "transition-all duration-micro ease-out",
+    "focus-visible:focus-ring",
+    "disabled:pointer-events-none disabled:opacity-50"
+  ].join(" "),
+  {
+    variants: {
+      variant: {
+        // Default: light background when selected, text emphasis on hover
+        default: [
+          "hover:text-foreground",
+          "data-[state=checked]:bg-background data-[state=checked]:text-foreground",
+          "data-[state=checked]:shadow-sm"
+        ].join(" "),
+        // Outline: gray background when selected
+        outline: [
+          "data-[state=checked]:bg-background-muted data-[state=checked]:text-foreground",
+          "hover:text-foreground hover:bg-background-muted"
+        ].join(" "),
+        // Underline: bottom border indicator (Stripe/GitHub style)
+        underline: [
+          "border-b-2 border-transparent -mb-px",
+          "hover:text-foreground hover:border-border-form",
+          "data-[state=checked]:text-foreground data-[state=checked]:border-foreground"
+        ].join(" "),
+        // Ghost: pill background only on selected (Notion/Figma style)
+        ghost: [
+          "hover:text-foreground hover:bg-background-muted",
+          "data-[state=checked]:bg-background-muted data-[state=checked]:text-foreground"
+        ].join(" ")
+      },
+      size: {
+        sm: "text-xs",
+        // 12px
+        md: "text-sm",
+        // 13px
+        default: "text-sm",
+        // 13px
+        lg: "text-md"
+        // 14px
+      },
+      radius: {
+        none: "rounded-none",
+        sm: "rounded-sm",
+        base: "rounded",
+        default: "rounded-md",
+        lg: "rounded-md",
+        xl: "rounded-lg",
+        "2xl": "rounded-xl",
+        "3xl": "rounded-2xl",
+        full: "rounded-full"
+      },
+      // Content type determines padding and aspect ratio
+      contentType: {
+        // Icon only: square aspect ratio like IconButton
+        icon: "aspect-square",
+        // Icon + text: rectangular (gap is set via compoundVariants)
+        "icon-text": "",
+        // Text only: standard button padding
+        text: ""
+      }
+    },
+    compoundVariants: [
+      // Icon + text - same padding rules as Button/Toggle
+      { contentType: "icon-text", size: "sm", className: "px-3 gap-2" },
+      // 12px padding, 8px gap
+      { contentType: "icon-text", size: "md", className: "px-3.5 gap-2" },
+      // 14px padding, 8px gap
+      { contentType: "icon-text", size: "default", className: "px-4 gap-2" },
+      // 16px padding, 8px gap
+      { contentType: "icon-text", size: "lg", className: "px-6 gap-2" },
+      // 24px padding, 8px gap
+      // Text only - same padding rules as Button/Toggle
+      { contentType: "text", size: "sm", className: "px-3.5" },
+      // 14px
+      { contentType: "text", size: "md", className: "px-3.5" },
+      // 14px
+      { contentType: "text", size: "default", className: "px-4" },
+      // 16px
+      { contentType: "text", size: "lg", className: "px-6" },
+      // 24px
+      // Underline variant has no rounded corners
+      { variant: "underline", className: "rounded-none" }
+    ],
+    defaultVariants: {
+      variant: "default",
+      size: "default",
+      radius: "default",
+      contentType: "text"
+    }
+  }
+);
+const SegmentedRoot = React.forwardRef(({ className, variant, size, radius, fontWeight, ...props }, ref) => {
+  const resolvedFontWeight = fontWeight ?? "normal";
+  return /* @__PURE__ */ React.createElement(SegmentedContext.Provider, { value: { variant: variant || "default", size: size || "default", radius: radius || "default" } }, /* @__PURE__ */ React.createElement(
+    RadioGroupPrimitive.Root,
+    {
+      className: (0, import_utils.cn)(segmentedVariants({ variant, size, radius, fontWeight: resolvedFontWeight }), className),
+      ...props,
+      ref
+    }
+  ));
+});
+SegmentedRoot.displayName = "Segmented";
+const iconSizeClasses = {
+  sm: "[&>svg]:icon-xs",
+  // 14px
+  md: "[&>svg]:icon-sm",
+  // 16px
+  default: "[&>svg]:icon-sm",
+  // 16px
+  lg: "[&>svg]:icon-sm"
+  // 16px
+};
+const SegmentedItem = React.forwardRef(({ className, children, size, radius, contentType, ...props }, ref) => {
+  const { variant, size: contextSize, radius: contextRadius } = useSegmentedContext();
+  const resolvedSize = size || contextSize || "default";
+  const resolvedRadius = radius || contextRadius || "default";
+  return /* @__PURE__ */ React.createElement(
+    RadioGroupPrimitive.Item,
+    {
+      ref,
+      className: (0, import_utils.cn)(
+        segmentedItemVariants({ variant, size: resolvedSize, radius: resolvedRadius, contentType }),
+        iconSizeClasses[resolvedSize],
+        className
+      ),
+      ...props
+    },
+    children
+  );
+});
+SegmentedItem.displayName = "SegmentedItem";
+const Segmented = Object.assign(SegmentedRoot, {
+  Item: SegmentedItem
+});
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  Segmented,
+  SegmentedItem,
+  segmentedItemVariants,
+  segmentedVariants
+});
+//# sourceMappingURL=segmented.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/ui/segmented.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport * as RadioGroupPrimitive from '@radix-ui/react-radio-group'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { cn } from '../../lib/utils'\n\n// Context to pass variant and size from Segmented to SegmentedItem\ntype SegmentedContextValue = {\n  variant?: 'default' | 'outline' | 'underline' | 'ghost'\n  size?: 'sm' | 'md' | 'default' | 'lg'\n  radius?: 'none' | 'sm' | 'base' | 'default' | 'lg' | 'xl' | '2xl' | '3xl' | 'full'\n}\nconst SegmentedContext = React.createContext<SegmentedContextValue>({})\nconst useSegmentedContext = () => React.useContext(SegmentedContext)\n\nconst segmentedVariants = cva(\n  'inline-flex items-center text-text-subtle',\n  {\n    variants: {\n      variant: {\n        default: 'bg-background-muted gap-1',\n        outline: 'bg-background border border-border-form gap-1',\n        underline: 'bg-transparent border-b border-border-form gap-0',\n        ghost: 'bg-transparent gap-1',\n      },\n      size: {\n        sm: 'h-8',        // 32px height\n        md: 'h-9',        // 36px height\n        default: 'h-10',  // 40px height\n        lg: 'h-12',       // 48px height\n      },\n      radius: {\n        none: 'rounded-none',\n        sm: 'rounded-sm',\n        base: 'rounded',\n        default: 'rounded-md',\n        lg: 'rounded-lg',\n        xl: 'rounded-xl',\n        '2xl': 'rounded-2xl',\n        '3xl': 'rounded-3xl',\n        full: 'rounded-full',\n      },\n      fontWeight: {\n        normal: '[&>*]:font-normal',\n        semibold: '[&>*]:font-semibold',\n      },\n    },\n    compoundVariants: [\n      // Padding for default/outline/ghost variants\n      { variant: 'default', className: 'p-1' },\n      { variant: 'outline', className: 'p-1' },\n      { variant: 'ghost', className: 'p-1' },\n      // Underline has no padding\n      { variant: 'underline', className: 'p-0' },\n    ],\n    defaultVariants: {\n      variant: 'default',\n      size: 'default',\n      radius: 'default',\n      fontWeight: 'normal',\n    },\n  }\n)\n\nconst segmentedItemVariants = cva(\n  [\n    'inline-flex items-center justify-center whitespace-nowrap h-full',\n    'transition-all duration-micro ease-out',\n    'focus-visible:focus-ring',\n    'disabled:pointer-events-none disabled:opacity-50',\n  ].join(' '),\n  {\n    variants: {\n      variant: {\n        // Default: light background when selected, text emphasis on hover\n        default: [\n          'hover:text-foreground',\n          'data-[state=checked]:bg-background data-[state=checked]:text-foreground',\n          'data-[state=checked]:shadow-sm',\n        ].join(' '),\n        // Outline: gray background when selected\n        outline: [\n          'data-[state=checked]:bg-background-muted data-[state=checked]:text-foreground',\n          'hover:text-foreground hover:bg-background-muted',\n        ].join(' '),\n        // Underline: bottom border indicator (Stripe/GitHub style)\n        underline: [\n          'border-b-2 border-transparent -mb-px',\n          'hover:text-foreground hover:border-border-form',\n          'data-[state=checked]:text-foreground data-[state=checked]:border-foreground',\n        ].join(' '),\n        // Ghost: pill background only on selected (Notion/Figma style)\n        ghost: [\n          'hover:text-foreground hover:bg-background-muted',\n          'data-[state=checked]:bg-background-muted data-[state=checked]:text-foreground',\n        ].join(' '),\n      },\n      size: {\n        sm: 'text-xs',      // 12px\n        md: 'text-sm',      // 13px\n        default: 'text-sm', // 13px\n        lg: 'text-md',      // 14px\n      },\n      radius: {\n        none: 'rounded-none',\n        sm: 'rounded-sm',\n        base: 'rounded',\n        default: 'rounded-md',\n        lg: 'rounded-md',\n        xl: 'rounded-lg',\n        '2xl': 'rounded-xl',\n        '3xl': 'rounded-2xl',\n        full: 'rounded-full',\n      },\n      // Content type determines padding and aspect ratio\n      contentType: {\n        // Icon only: square aspect ratio like IconButton\n        icon: 'aspect-square',\n        // Icon + text: rectangular (gap is set via compoundVariants)\n        'icon-text': '',\n        // Text only: standard button padding\n        text: '',\n      },\n    },\n    compoundVariants: [\n      // Icon + text - same padding rules as Button/Toggle\n      { contentType: 'icon-text', size: 'sm', className: 'px-3 gap-2' },      // 12px padding, 8px gap\n      { contentType: 'icon-text', size: 'md', className: 'px-3.5 gap-2' },   // 14px padding, 8px gap\n      { contentType: 'icon-text', size: 'default', className: 'px-4 gap-2' }, // 16px padding, 8px gap\n      { contentType: 'icon-text', size: 'lg', className: 'px-6 gap-2' },      // 24px padding, 8px gap\n      // Text only - same padding rules as Button/Toggle\n      { contentType: 'text', size: 'sm', className: 'px-3.5' },    // 14px\n      { contentType: 'text', size: 'md', className: 'px-3.5' },    // 14px\n      { contentType: 'text', size: 'default', className: 'px-4' }, // 16px\n      { contentType: 'text', size: 'lg', className: 'px-6' },      // 24px\n      // Underline variant has no rounded corners\n      { variant: 'underline', className: 'rounded-none' },\n    ],\n    defaultVariants: {\n      variant: 'default',\n      size: 'default',\n      radius: 'default',\n      contentType: 'text',\n    },\n  }\n)\n\nexport interface SegmentedProps\n  extends React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Root>,\n    VariantProps<typeof segmentedVariants> {}\n\nconst SegmentedRoot = React.forwardRef<\n  React.ElementRef<typeof RadioGroupPrimitive.Root>,\n  SegmentedProps\n>(({ className, variant, size, radius, fontWeight, ...props }, ref) => {\n  // All variants default to normal font weight\n  const resolvedFontWeight = fontWeight ?? 'normal'\n\n  return (\n    <SegmentedContext.Provider value={{ variant: variant || 'default', size: size || 'default', radius: radius || 'default' }}>\n      <RadioGroupPrimitive.Root\n        className={cn(segmentedVariants({ variant, size, radius, fontWeight: resolvedFontWeight }), className)}\n        {...props}\n        ref={ref}\n      />\n    </SegmentedContext.Provider>\n  )\n})\nSegmentedRoot.displayName = 'Segmented'\n\n// Icon size for segmented control (4-step scale, Icon+Text mode)\n// sm: 14px, md~default~lg: 16px\nconst iconSizeClasses = {\n  sm: '[&>svg]:icon-xs',      // 14px\n  md: '[&>svg]:icon-sm',      // 16px\n  default: '[&>svg]:icon-sm', // 16px\n  lg: '[&>svg]:icon-sm',      // 16px\n}\n\nexport interface SegmentedItemProps\n  extends React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Item>,\n    Omit<VariantProps<typeof segmentedItemVariants>, 'variant'> {}\n\nconst SegmentedItem = React.forwardRef<\n  React.ElementRef<typeof RadioGroupPrimitive.Item>,\n  SegmentedItemProps\n>(({ className, children, size, radius, contentType, ...props }, ref) => {\n  const { variant, size: contextSize, radius: contextRadius } = useSegmentedContext()\n  const resolvedSize = size || contextSize || 'default'\n  const resolvedRadius = radius || contextRadius || 'default'\n\n  return (\n    <RadioGroupPrimitive.Item\n      ref={ref}\n      className={cn(\n        segmentedItemVariants({ variant, size: resolvedSize, radius: resolvedRadius, contentType }),\n        iconSizeClasses[resolvedSize],\n        className\n      )}\n      {...props}\n    >\n      {children}\n    </RadioGroupPrimitive.Item>\n  )\n})\nSegmentedItem.displayName = 'SegmentedItem'\n\n// ─── Namespace ──────────────────────────────────────────\nconst Segmented = Object.assign(SegmentedRoot, {\n  Item: SegmentedItem,\n})\n\n// eslint-disable-next-line @typescript-eslint/no-namespace\nnamespace Segmented {\n  export type ItemProps = SegmentedItemProps\n}\n\nexport { Segmented, SegmentedItem, segmentedVariants, segmentedItemVariants }\n"],"mappings":"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","names":[]}

package/dist/components/ui/segmented.mjs

@@ -0,0 +1,204 @@
+"use client";
+import * as React from "react";
+import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
+import { cva } from "class-variance-authority";
+import { cn } from "../../lib/utils";
+const SegmentedContext = React.createContext({});
+const useSegmentedContext = () => React.useContext(SegmentedContext);
+const segmentedVariants = cva(
+  "inline-flex items-center text-text-subtle",
+  {
+    variants: {
+      variant: {
+        default: "bg-background-muted gap-1",
+        outline: "bg-background border border-border-form gap-1",
+        underline: "bg-transparent border-b border-border-form gap-0",
+        ghost: "bg-transparent gap-1"
+      },
+      size: {
+        sm: "h-8",
+        // 32px height
+        md: "h-9",
+        // 36px height
+        default: "h-10",
+        // 40px height
+        lg: "h-12"
+        // 48px height
+      },
+      radius: {
+        none: "rounded-none",
+        sm: "rounded-sm",
+        base: "rounded",
+        default: "rounded-md",
+        lg: "rounded-lg",
+        xl: "rounded-xl",
+        "2xl": "rounded-2xl",
+        "3xl": "rounded-3xl",
+        full: "rounded-full"
+      },
+      fontWeight: {
+        normal: "[&>*]:font-normal",
+        semibold: "[&>*]:font-semibold"
+      }
+    },
+    compoundVariants: [
+      // Padding for default/outline/ghost variants
+      { variant: "default", className: "p-1" },
+      { variant: "outline", className: "p-1" },
+      { variant: "ghost", className: "p-1" },
+      // Underline has no padding
+      { variant: "underline", className: "p-0" }
+    ],
+    defaultVariants: {
+      variant: "default",
+      size: "default",
+      radius: "default",
+      fontWeight: "normal"
+    }
+  }
+);
+const segmentedItemVariants = cva(
+  [
+    "inline-flex items-center justify-center whitespace-nowrap h-full",
+    "transition-all duration-micro ease-out",
+    "focus-visible:focus-ring",
+    "disabled:pointer-events-none disabled:opacity-50"
+  ].join(" "),
+  {
+    variants: {
+      variant: {
+        // Default: light background when selected, text emphasis on hover
+        default: [
+          "hover:text-foreground",
+          "data-[state=checked]:bg-background data-[state=checked]:text-foreground",
+          "data-[state=checked]:shadow-sm"
+        ].join(" "),
+        // Outline: gray background when selected
+        outline: [
+          "data-[state=checked]:bg-background-muted data-[state=checked]:text-foreground",
+          "hover:text-foreground hover:bg-background-muted"
+        ].join(" "),
+        // Underline: bottom border indicator (Stripe/GitHub style)
+        underline: [
+          "border-b-2 border-transparent -mb-px",
+          "hover:text-foreground hover:border-border-form",
+          "data-[state=checked]:text-foreground data-[state=checked]:border-foreground"
+        ].join(" "),
+        // Ghost: pill background only on selected (Notion/Figma style)
+        ghost: [
+          "hover:text-foreground hover:bg-background-muted",
+          "data-[state=checked]:bg-background-muted data-[state=checked]:text-foreground"
+        ].join(" ")
+      },
+      size: {
+        sm: "text-xs",
+        // 12px
+        md: "text-sm",
+        // 13px
+        default: "text-sm",
+        // 13px
+        lg: "text-md"
+        // 14px
+      },
+      radius: {
+        none: "rounded-none",
+        sm: "rounded-sm",
+        base: "rounded",
+        default: "rounded-md",
+        lg: "rounded-md",
+        xl: "rounded-lg",
+        "2xl": "rounded-xl",
+        "3xl": "rounded-2xl",
+        full: "rounded-full"
+      },
+      // Content type determines padding and aspect ratio
+      contentType: {
+        // Icon only: square aspect ratio like IconButton
+        icon: "aspect-square",
+        // Icon + text: rectangular (gap is set via compoundVariants)
+        "icon-text": "",
+        // Text only: standard button padding
+        text: ""
+      }
+    },
+    compoundVariants: [
+      // Icon + text - same padding rules as Button/Toggle
+      { contentType: "icon-text", size: "sm", className: "px-3 gap-2" },
+      // 12px padding, 8px gap
+      { contentType: "icon-text", size: "md", className: "px-3.5 gap-2" },
+      // 14px padding, 8px gap
+      { contentType: "icon-text", size: "default", className: "px-4 gap-2" },
+      // 16px padding, 8px gap
+      { contentType: "icon-text", size: "lg", className: "px-6 gap-2" },
+      // 24px padding, 8px gap
+      // Text only - same padding rules as Button/Toggle
+      { contentType: "text", size: "sm", className: "px-3.5" },
+      // 14px
+      { contentType: "text", size: "md", className: "px-3.5" },
+      // 14px
+      { contentType: "text", size: "default", className: "px-4" },
+      // 16px
+      { contentType: "text", size: "lg", className: "px-6" },
+      // 24px
+      // Underline variant has no rounded corners
+      { variant: "underline", className: "rounded-none" }
+    ],
+    defaultVariants: {
+      variant: "default",
+      size: "default",
+      radius: "default",
+      contentType: "text"
+    }
+  }
+);
+const SegmentedRoot = React.forwardRef(({ className, variant, size, radius, fontWeight, ...props }, ref) => {
+  const resolvedFontWeight = fontWeight ?? "normal";
+  return /* @__PURE__ */ React.createElement(SegmentedContext.Provider, { value: { variant: variant || "default", size: size || "default", radius: radius || "default" } }, /* @__PURE__ */ React.createElement(
+    RadioGroupPrimitive.Root,
+    {
+      className: cn(segmentedVariants({ variant, size, radius, fontWeight: resolvedFontWeight }), className),
+      ...props,
+      ref
+    }
+  ));
+});
+SegmentedRoot.displayName = "Segmented";
+const iconSizeClasses = {
+  sm: "[&>svg]:icon-xs",
+  // 14px
+  md: "[&>svg]:icon-sm",
+  // 16px
+  default: "[&>svg]:icon-sm",
+  // 16px
+  lg: "[&>svg]:icon-sm"
+  // 16px
+};
+const SegmentedItem = React.forwardRef(({ className, children, size, radius, contentType, ...props }, ref) => {
+  const { variant, size: contextSize, radius: contextRadius } = useSegmentedContext();
+  const resolvedSize = size || contextSize || "default";
+  const resolvedRadius = radius || contextRadius || "default";
+  return /* @__PURE__ */ React.createElement(
+    RadioGroupPrimitive.Item,
+    {
+      ref,
+      className: cn(
+        segmentedItemVariants({ variant, size: resolvedSize, radius: resolvedRadius, contentType }),
+        iconSizeClasses[resolvedSize],
+        className
+      ),
+      ...props
+    },
+    children
+  );
+});
+SegmentedItem.displayName = "SegmentedItem";
+const Segmented = Object.assign(SegmentedRoot, {
+  Item: SegmentedItem
+});
+export {
+  Segmented,
+  SegmentedItem,
+  segmentedItemVariants,
+  segmentedVariants
+};
+//# sourceMappingURL=segmented.mjs.map

package/dist/components/ui/segmented.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/ui/segmented.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport * as RadioGroupPrimitive from '@radix-ui/react-radio-group'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { cn } from '../../lib/utils'\n\n// Context to pass variant and size from Segmented to SegmentedItem\ntype SegmentedContextValue = {\n  variant?: 'default' | 'outline' | 'underline' | 'ghost'\n  size?: 'sm' | 'md' | 'default' | 'lg'\n  radius?: 'none' | 'sm' | 'base' | 'default' | 'lg' | 'xl' | '2xl' | '3xl' | 'full'\n}\nconst SegmentedContext = React.createContext<SegmentedContextValue>({})\nconst useSegmentedContext = () => React.useContext(SegmentedContext)\n\nconst segmentedVariants = cva(\n  'inline-flex items-center text-text-subtle',\n  {\n    variants: {\n      variant: {\n        default: 'bg-background-muted gap-1',\n        outline: 'bg-background border border-border-form gap-1',\n        underline: 'bg-transparent border-b border-border-form gap-0',\n        ghost: 'bg-transparent gap-1',\n      },\n      size: {\n        sm: 'h-8',        // 32px height\n        md: 'h-9',        // 36px height\n        default: 'h-10',  // 40px height\n        lg: 'h-12',       // 48px height\n      },\n      radius: {\n        none: 'rounded-none',\n        sm: 'rounded-sm',\n        base: 'rounded',\n        default: 'rounded-md',\n        lg: 'rounded-lg',\n        xl: 'rounded-xl',\n        '2xl': 'rounded-2xl',\n        '3xl': 'rounded-3xl',\n        full: 'rounded-full',\n      },\n      fontWeight: {\n        normal: '[&>*]:font-normal',\n        semibold: '[&>*]:font-semibold',\n      },\n    },\n    compoundVariants: [\n      // Padding for default/outline/ghost variants\n      { variant: 'default', className: 'p-1' },\n      { variant: 'outline', className: 'p-1' },\n      { variant: 'ghost', className: 'p-1' },\n      // Underline has no padding\n      { variant: 'underline', className: 'p-0' },\n    ],\n    defaultVariants: {\n      variant: 'default',\n      size: 'default',\n      radius: 'default',\n      fontWeight: 'normal',\n    },\n  }\n)\n\nconst segmentedItemVariants = cva(\n  [\n    'inline-flex items-center justify-center whitespace-nowrap h-full',\n    'transition-all duration-micro ease-out',\n    'focus-visible:focus-ring',\n    'disabled:pointer-events-none disabled:opacity-50',\n  ].join(' '),\n  {\n    variants: {\n      variant: {\n        // Default: light background when selected, text emphasis on hover\n        default: [\n          'hover:text-foreground',\n          'data-[state=checked]:bg-background data-[state=checked]:text-foreground',\n          'data-[state=checked]:shadow-sm',\n        ].join(' '),\n        // Outline: gray background when selected\n        outline: [\n          'data-[state=checked]:bg-background-muted data-[state=checked]:text-foreground',\n          'hover:text-foreground hover:bg-background-muted',\n        ].join(' '),\n        // Underline: bottom border indicator (Stripe/GitHub style)\n        underline: [\n          'border-b-2 border-transparent -mb-px',\n          'hover:text-foreground hover:border-border-form',\n          'data-[state=checked]:text-foreground data-[state=checked]:border-foreground',\n        ].join(' '),\n        // Ghost: pill background only on selected (Notion/Figma style)\n        ghost: [\n          'hover:text-foreground hover:bg-background-muted',\n          'data-[state=checked]:bg-background-muted data-[state=checked]:text-foreground',\n        ].join(' '),\n      },\n      size: {\n        sm: 'text-xs',      // 12px\n        md: 'text-sm',      // 13px\n        default: 'text-sm', // 13px\n        lg: 'text-md',      // 14px\n      },\n      radius: {\n        none: 'rounded-none',\n        sm: 'rounded-sm',\n        base: 'rounded',\n        default: 'rounded-md',\n        lg: 'rounded-md',\n        xl: 'rounded-lg',\n        '2xl': 'rounded-xl',\n        '3xl': 'rounded-2xl',\n        full: 'rounded-full',\n      },\n      // Content type determines padding and aspect ratio\n      contentType: {\n        // Icon only: square aspect ratio like IconButton\n        icon: 'aspect-square',\n        // Icon + text: rectangular (gap is set via compoundVariants)\n        'icon-text': '',\n        // Text only: standard button padding\n        text: '',\n      },\n    },\n    compoundVariants: [\n      // Icon + text - same padding rules as Button/Toggle\n      { contentType: 'icon-text', size: 'sm', className: 'px-3 gap-2' },      // 12px padding, 8px gap\n      { contentType: 'icon-text', size: 'md', className: 'px-3.5 gap-2' },   // 14px padding, 8px gap\n      { contentType: 'icon-text', size: 'default', className: 'px-4 gap-2' }, // 16px padding, 8px gap\n      { contentType: 'icon-text', size: 'lg', className: 'px-6 gap-2' },      // 24px padding, 8px gap\n      // Text only - same padding rules as Button/Toggle\n      { contentType: 'text', size: 'sm', className: 'px-3.5' },    // 14px\n      { contentType: 'text', size: 'md', className: 'px-3.5' },    // 14px\n      { contentType: 'text', size: 'default', className: 'px-4' }, // 16px\n      { contentType: 'text', size: 'lg', className: 'px-6' },      // 24px\n      // Underline variant has no rounded corners\n      { variant: 'underline', className: 'rounded-none' },\n    ],\n    defaultVariants: {\n      variant: 'default',\n      size: 'default',\n      radius: 'default',\n      contentType: 'text',\n    },\n  }\n)\n\nexport interface SegmentedProps\n  extends React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Root>,\n    VariantProps<typeof segmentedVariants> {}\n\nconst SegmentedRoot = React.forwardRef<\n  React.ElementRef<typeof RadioGroupPrimitive.Root>,\n  SegmentedProps\n>(({ className, variant, size, radius, fontWeight, ...props }, ref) => {\n  // All variants default to normal font weight\n  const resolvedFontWeight = fontWeight ?? 'normal'\n\n  return (\n    <SegmentedContext.Provider value={{ variant: variant || 'default', size: size || 'default', radius: radius || 'default' }}>\n      <RadioGroupPrimitive.Root\n        className={cn(segmentedVariants({ variant, size, radius, fontWeight: resolvedFontWeight }), className)}\n        {...props}\n        ref={ref}\n      />\n    </SegmentedContext.Provider>\n  )\n})\nSegmentedRoot.displayName = 'Segmented'\n\n// Icon size for segmented control (4-step scale, Icon+Text mode)\n// sm: 14px, md~default~lg: 16px\nconst iconSizeClasses = {\n  sm: '[&>svg]:icon-xs',      // 14px\n  md: '[&>svg]:icon-sm',      // 16px\n  default: '[&>svg]:icon-sm', // 16px\n  lg: '[&>svg]:icon-sm',      // 16px\n}\n\nexport interface SegmentedItemProps\n  extends React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Item>,\n    Omit<VariantProps<typeof segmentedItemVariants>, 'variant'> {}\n\nconst SegmentedItem = React.forwardRef<\n  React.ElementRef<typeof RadioGroupPrimitive.Item>,\n  SegmentedItemProps\n>(({ className, children, size, radius, contentType, ...props }, ref) => {\n  const { variant, size: contextSize, radius: contextRadius } = useSegmentedContext()\n  const resolvedSize = size || contextSize || 'default'\n  const resolvedRadius = radius || contextRadius || 'default'\n\n  return (\n    <RadioGroupPrimitive.Item\n      ref={ref}\n      className={cn(\n        segmentedItemVariants({ variant, size: resolvedSize, radius: resolvedRadius, contentType }),\n        iconSizeClasses[resolvedSize],\n        className\n      )}\n      {...props}\n    >\n      {children}\n    </RadioGroupPrimitive.Item>\n  )\n})\nSegmentedItem.displayName = 'SegmentedItem'\n\n// ─── Namespace ──────────────────────────────────────────\nconst Segmented = Object.assign(SegmentedRoot, {\n  Item: SegmentedItem,\n})\n\n// eslint-disable-next-line @typescript-eslint/no-namespace\nnamespace Segmented {\n  export type ItemProps = SegmentedItemProps\n}\n\nexport { Segmented, SegmentedItem, segmentedVariants, segmentedItemVariants }\n"],"mappings":"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","names":[]}

package/dist/components/ui/select.d.mts

@@ -0,0 +1,31 @@
+import * as React from 'react';
+import * as SelectPrimitive from '@radix-ui/react-select';
+
+type SelectRadius = 'none' | 'sm' | 'base' | 'default' | 'lg' | 'xl' | '2xl' | '3xl' | 'full';
+type SelectSize = 'xs' | 'sm' | 'default' | 'lg' | 'xl';
+declare const SelectValue: React.ForwardRefExoticComponent<SelectPrimitive.SelectValueProps & React.RefAttributes<HTMLSpanElement>>;
+declare const SelectGroup: React.ForwardRefExoticComponent<SelectPrimitive.SelectGroupProps & React.RefAttributes<HTMLDivElement>>;
+declare const SelectTrigger: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+declare const SelectContent: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    flush?: boolean;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const SelectItem: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const SelectLabel: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectLabelProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const SelectSeparator: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectSeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+
+declare const Select: (({ size, radius, ...props }: React.ComponentPropsWithoutRef<typeof SelectPrimitive.Root> & {
+    size?: SelectSize;
+    radius?: SelectRadius;
+}) => React.JSX.Element) & {
+    Trigger: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+    Value: React.ForwardRefExoticComponent<SelectPrimitive.SelectValueProps & React.RefAttributes<HTMLSpanElement>>;
+    Content: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+        flush?: boolean;
+    } & React.RefAttributes<HTMLDivElement>>;
+    Item: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    Group: React.ForwardRefExoticComponent<SelectPrimitive.SelectGroupProps & React.RefAttributes<HTMLDivElement>>;
+    Label: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectLabelProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    Separator: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectSeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+};
+
+export { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, type SelectRadius, SelectSeparator, type SelectSize, SelectTrigger, SelectValue };

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

@@ -0,0 +1,31 @@
+import * as React from 'react';
+import * as SelectPrimitive from '@radix-ui/react-select';
+
+type SelectRadius = 'none' | 'sm' | 'base' | 'default' | 'lg' | 'xl' | '2xl' | '3xl' | 'full';
+type SelectSize = 'xs' | 'sm' | 'default' | 'lg' | 'xl';
+declare const SelectValue: React.ForwardRefExoticComponent<SelectPrimitive.SelectValueProps & React.RefAttributes<HTMLSpanElement>>;
+declare const SelectGroup: React.ForwardRefExoticComponent<SelectPrimitive.SelectGroupProps & React.RefAttributes<HTMLDivElement>>;
+declare const SelectTrigger: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+declare const SelectContent: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    flush?: boolean;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const SelectItem: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const SelectLabel: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectLabelProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const SelectSeparator: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectSeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+
+declare const Select: (({ size, radius, ...props }: React.ComponentPropsWithoutRef<typeof SelectPrimitive.Root> & {
+    size?: SelectSize;
+    radius?: SelectRadius;
+}) => React.JSX.Element) & {
+    Trigger: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+    Value: React.ForwardRefExoticComponent<SelectPrimitive.SelectValueProps & React.RefAttributes<HTMLSpanElement>>;
+    Content: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+        flush?: boolean;
+    } & React.RefAttributes<HTMLDivElement>>;
+    Item: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    Group: React.ForwardRefExoticComponent<SelectPrimitive.SelectGroupProps & React.RefAttributes<HTMLDivElement>>;
+    Label: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectLabelProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    Separator: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectSeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+};
+
+export { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, type SelectRadius, SelectSeparator, type SelectSize, SelectTrigger, SelectValue };