@7onic-ui/react 0.3.10 → 0.3.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +2 -2
- package/dist/{chunk-GRCJ35DX.mjs → chunk-2WIIXHOV.mjs} +7 -3
- package/dist/chunk-2WIIXHOV.mjs.map +1 -0
- package/dist/{chunk-DTLNWOTR.mjs → chunk-C5D3VRNJ.mjs} +29 -7
- package/dist/chunk-C5D3VRNJ.mjs.map +1 -0
- package/dist/{chunk-T546XBQG.mjs → chunk-EG2GTK65.mjs} +3 -3
- package/dist/{chunk-T546XBQG.mjs.map → chunk-EG2GTK65.mjs.map} +1 -1
- package/dist/{chunk-UWTT5AE6.mjs → chunk-HS2VRYSX.mjs} +7 -4
- package/dist/chunk-HS2VRYSX.mjs.map +1 -0
- package/dist/{chunk-N4K2BDGM.mjs → chunk-IHHI3LIN.mjs} +5 -3
- package/dist/chunk-IHHI3LIN.mjs.map +1 -0
- package/dist/{chunk-VUPGBB5X.mjs → chunk-IJ2FZ3L5.mjs} +11 -2
- package/dist/chunk-IJ2FZ3L5.mjs.map +1 -0
- package/dist/{chunk-IY3R2VGB.mjs → chunk-L55ABE4H.mjs} +14 -3
- package/dist/chunk-L55ABE4H.mjs.map +1 -0
- package/dist/{chunk-DRVHHEAY.mjs → chunk-ND6TUVP2.mjs} +7 -4
- package/dist/chunk-ND6TUVP2.mjs.map +1 -0
- package/dist/{chunk-234NAXGV.mjs → chunk-R7FJEO4K.mjs} +1 -1
- package/dist/chunk-R7FJEO4K.mjs.map +1 -0
- package/dist/{chunk-WWSN5YME.mjs → chunk-SDDAGZWA.mjs} +5 -3
- package/dist/chunk-SDDAGZWA.mjs.map +1 -0
- package/dist/{chunk-Z6JWWCNL.mjs → chunk-T5A4APEL.mjs} +35 -3
- package/dist/chunk-T5A4APEL.mjs.map +1 -0
- package/dist/{chunk-MRUVGHGP.mjs → chunk-YZ7HHFKA.mjs} +7 -7
- package/dist/chunk-YZ7HHFKA.mjs.map +1 -0
- package/dist/components/chat-input.mjs +1 -1
- package/dist/components/chat-message.mjs +1 -1
- package/dist/components/checkbox.mjs +2 -2
- package/dist/components/field.mjs +5 -3
- package/dist/components/input.mjs +2 -2
- package/dist/components/navigation-menu.mjs +1 -1
- package/dist/components/pagination.mjs +1 -1
- package/dist/components/radio-group.mjs +2 -2
- package/dist/components/select.mjs +2 -1
- package/dist/components/slider.mjs +2 -1
- package/dist/components/switch.mjs +2 -2
- package/dist/components/textarea.mjs +2 -2
- package/dist/index.d.ts +11 -2
- package/dist/index.js +95 -21
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +12 -12
- package/llms.txt +27 -9
- package/package.json +11 -12
- package/dist/chunk-234NAXGV.mjs.map +0 -1
- package/dist/chunk-DRVHHEAY.mjs.map +0 -1
- package/dist/chunk-DTLNWOTR.mjs.map +0 -1
- package/dist/chunk-GRCJ35DX.mjs.map +0 -1
- package/dist/chunk-IY3R2VGB.mjs.map +0 -1
- package/dist/chunk-MRUVGHGP.mjs.map +0 -1
- package/dist/chunk-N4K2BDGM.mjs.map +0 -1
- package/dist/chunk-UWTT5AE6.mjs.map +0 -1
- package/dist/chunk-VUPGBB5X.mjs.map +0 -1
- package/dist/chunk-WWSN5YME.mjs.map +0 -1
- package/dist/chunk-Z6JWWCNL.mjs.map +0 -1
package/README.md
CHANGED
|
@@ -324,7 +324,7 @@ your project's `.claude/`) or copy the files from
|
|
|
324
324
|
- [x] Automated doc verification (8 checks, AST-powered, blocks publish on error)
|
|
325
325
|
- [x] Automated component verification (7 checks — hardcoded colors, tokens, dark mode, dead code)
|
|
326
326
|
- [x] Multilingual documentation — English, Japanese, Korean (powered by next-intl)
|
|
327
|
-
- [x] npm package distribution — `@7onic-ui/react` + `@7onic-ui/tokens` v0.3.
|
|
327
|
+
- [x] npm package distribution — `@7onic-ui/react` + `@7onic-ui/tokens` v0.3.11
|
|
328
328
|
- [x] AI integration — `llms.txt` standard, setup guides for Claude Code / Cursor / Copilot / ChatGPT
|
|
329
329
|
- [x] MCP server — token search, component catalog, layout recipes, `validate_code` rule checking (en/ja/ko), Claude Code plugin one-command install
|
|
330
330
|
- [x] AI Kit — `/7onic-setup` + `/7onic-design` skills and a design agent (plugin, `npx 7onic init --claude`, or manual copy)
|
|
@@ -355,5 +355,5 @@ MIT
|
|
|
355
355
|
<p align="center">
|
|
356
356
|
<strong>One JSON, every format — from Figma to production.</strong><br>
|
|
357
357
|
Independently built.<br>
|
|
358
|
-
<sub>Last updated: 2026-10-
|
|
358
|
+
<sub>Last updated: 2026-10-29 (v0.3.11)</sub>
|
|
359
359
|
</p>
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import {
|
|
3
|
-
useFieldContext
|
|
4
|
-
|
|
3
|
+
useFieldContext,
|
|
4
|
+
useFieldControl
|
|
5
|
+
} from "./chunk-T5A4APEL.mjs";
|
|
5
6
|
import {
|
|
6
7
|
cn
|
|
7
8
|
} from "./chunk-53MIUPSY.mjs";
|
|
@@ -35,6 +36,8 @@ var radioGroupVariants = cva("grid gap-3", {
|
|
|
35
36
|
var RadioGroup = React.forwardRef(({ className, orientation, size = "default", weight = "bold", color = "default", disabled, ...props }, ref) => {
|
|
36
37
|
const fieldContext = useFieldContext();
|
|
37
38
|
const resolvedDisabled = disabled ?? fieldContext?.disabled;
|
|
39
|
+
useFieldControl("labelled", Boolean(fieldContext));
|
|
40
|
+
const labelledBy = fieldContext?.hasLabel && !props["aria-label"] ? fieldContext.labelId : void 0;
|
|
38
41
|
return /* @__PURE__ */ React.createElement(RadioGroupContext.Provider, { value: { size, weight, color, disabled: resolvedDisabled } }, /* @__PURE__ */ React.createElement(
|
|
39
42
|
RadioGroupPrimitive.Root,
|
|
40
43
|
{
|
|
@@ -42,6 +45,7 @@ var RadioGroup = React.forwardRef(({ className, orientation, size = "default", w
|
|
|
42
45
|
className: cn(radioGroupVariants({ orientation }), className),
|
|
43
46
|
orientation: orientation || void 0,
|
|
44
47
|
disabled: resolvedDisabled,
|
|
48
|
+
"aria-labelledby": labelledBy,
|
|
45
49
|
...props
|
|
46
50
|
}
|
|
47
51
|
));
|
|
@@ -141,4 +145,4 @@ export {
|
|
|
141
145
|
radioItemVariants,
|
|
142
146
|
RadioGroupItem
|
|
143
147
|
};
|
|
144
|
-
//# sourceMappingURL=chunk-
|
|
148
|
+
//# sourceMappingURL=chunk-2WIIXHOV.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/ui/radio-group.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport * as RadioGroupPrimitive from '@radix-ui/react-radio-group'\nimport { cva } from 'class-variance-authority'\nimport { cn } from '@/lib/utils'\nimport { useFieldContext, useFieldControl } from './field'\n\n// Color maps for checked state\nconst radioColorMap = {\n default: {\n border: 'data-[state=checked]:border-foreground',\n dot: 'bg-foreground',\n },\n primary: {\n border: 'data-[state=checked]:border-primary',\n dot: 'bg-primary',\n },\n} as const\n\nexport type RadioColor = keyof typeof radioColorMap\n\n// Context to pass size, weight, color from RadioGroup to RadioGroupItem\ntype RadioGroupContextValue = {\n size: 'sm' | 'default' | 'lg'\n weight: 'thin' | 'bold'\n color: RadioColor\n disabled?: boolean\n}\nconst RadioGroupContext = React.createContext<RadioGroupContextValue>({ size: 'default', weight: 'bold', color: 'default' })\n\n// RadioGroup container\nconst radioGroupVariants = cva('grid gap-3', {\n variants: {\n orientation: {\n vertical: 'grid-cols-1',\n horizontal: 'grid-flow-col auto-cols-max gap-4',\n },\n },\n defaultVariants: {\n orientation: 'vertical',\n },\n})\n\nexport interface RadioGroupProps\n extends React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Root> {\n size?: 'sm' | 'default' | 'lg'\n weight?: 'thin' | 'bold'\n /** Checked state color */\n color?: RadioColor\n}\n\nconst RadioGroup = React.forwardRef<\n React.ElementRef<typeof RadioGroupPrimitive.Root>,\n RadioGroupProps\n>(({ className, orientation, size = 'default', weight = 'bold', color = 'default', disabled, ...props }, ref) => {\n const fieldContext = useFieldContext()\n const resolvedDisabled = disabled ?? fieldContext?.disabled\n // Inside a Field the FieldLabel names the radio group (items keep their own labels)\n useFieldControl('labelled', Boolean(fieldContext))\n const labelledBy = fieldContext?.hasLabel && !props['aria-label'] ? fieldContext.labelId : undefined\n\n return (\n <RadioGroupContext.Provider value={{ size, weight, color, disabled: resolvedDisabled }}>\n <RadioGroupPrimitive.Root\n ref={ref}\n className={cn(radioGroupVariants({ orientation }), className)}\n orientation={orientation || undefined}\n disabled={resolvedDisabled}\n aria-labelledby={labelledBy}\n {...props}\n />\n </RadioGroupContext.Provider>\n )\n})\nRadioGroup.displayName = 'RadioGroup'\n\n// RadioGroupItem circle variants\nconst radioItemVariants = cva(\n [\n 'relative shrink-0 rounded-full border-border hover:border-border-strong transition-all duration-micro ease-out',\n 'focus-visible:focus-ring',\n 'disabled:cursor-not-allowed disabled:opacity-50',\n // Transparent hit area expansion via ::after\n \"after:absolute after:content-['']\",\n ].join(' '),\n {\n variants: {\n size: {\n sm: 'w-3.5 h-3.5 after:-inset-[5px]', // 14px circle → 24px click\n default: 'w-4 h-4 after:-inset-2', // 16px circle → 32px click\n lg: 'w-5 h-5 after:-inset-2', // 20px circle → 36px click\n },\n weight: {\n thin: 'border', // 1px\n bold: 'border-2', // 2px\n },\n },\n defaultVariants: {\n size: 'default',\n weight: 'bold',\n },\n }\n)\n\n// Dot sizes per radio size\nconst dotSizes = {\n sm: 'w-1.5 h-1.5', // 6px\n default: 'w-2 h-2', // 8px\n lg: 'w-2.5 h-2.5', // 10px\n}\n\n// Label font sizes\nconst labelSizes = {\n sm: 'text-xs', // 12px\n default: 'text-md', // 14px\n lg: 'text-base', // 16px\n}\n\n// Gap between radio and label\nconst gapSizes = {\n sm: 'gap-1.5',\n default: 'gap-2',\n lg: 'gap-2.5',\n}\n\nexport interface RadioGroupItemProps\n extends React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Item> {\n label?: string\n}\n\nconst RadioGroupItem = React.forwardRef<\n React.ElementRef<typeof RadioGroupPrimitive.Item>,\n RadioGroupItemProps\n>(({ className, label, disabled, ...props }, ref) => {\n const { size, weight, color, disabled: groupDisabled } = React.useContext(RadioGroupContext)\n const resolvedDisabled = disabled ?? groupDisabled\n const itemId = React.useId()\n\n const radio = (\n <RadioGroupPrimitive.Item\n ref={ref}\n id={label ? itemId : undefined}\n disabled={resolvedDisabled}\n className={cn(\n radioItemVariants({ size, weight }),\n radioColorMap[color].border,\n className\n )}\n {...props}\n >\n <RadioGroupPrimitive.Indicator className=\"flex items-center justify-center animate-radio-enter\">\n <div className={cn('rounded-full', radioColorMap[color].dot, dotSizes[size])} />\n </RadioGroupPrimitive.Indicator>\n </RadioGroupPrimitive.Item>\n )\n\n if (!label) return radio\n\n return (\n <div className={cn('group flex items-center', gapSizes[size])}>\n <div className=\"flex items-center\">\n {radio}\n </div>\n <label\n htmlFor={itemId}\n className={cn(\n labelSizes[size],\n 'text-text-muted cursor-pointer select-none transition-colors duration-micro',\n 'group-hover:text-foreground',\n resolvedDisabled && 'opacity-50 cursor-not-allowed'\n )}\n >\n {label}\n </label>\n </div>\n )\n})\nRadioGroupItem.displayName = 'RadioGroupItem'\n\nexport { RadioGroup, RadioGroupItem, radioGroupVariants, radioItemVariants }\n"],"mappings":"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","names":[]}
|
|
@@ -177,9 +177,11 @@ var NavigationMenuItem = React.forwardRef(
|
|
|
177
177
|
({ className, value, defaultOpen = false, children, ...props }, ref) => {
|
|
178
178
|
const { orientation, collapsed } = useNavigationMenuContext();
|
|
179
179
|
const [open, setOpen] = React.useState(defaultOpen);
|
|
180
|
-
React.
|
|
180
|
+
const [prevCollapsed, setPrevCollapsed] = React.useState(collapsed);
|
|
181
|
+
if (collapsed !== prevCollapsed) {
|
|
182
|
+
setPrevCollapsed(collapsed);
|
|
181
183
|
if (collapsed) setOpen(false);
|
|
182
|
-
}
|
|
184
|
+
}
|
|
183
185
|
if (orientation === "horizontal") {
|
|
184
186
|
return /* @__PURE__ */ React.createElement(
|
|
185
187
|
NavigationMenuPrimitive.Item,
|
|
@@ -411,10 +413,30 @@ var NavigationMenuGroup = React.forwardRef(
|
|
|
411
413
|
({ className, label, children, ...props }, ref) => {
|
|
412
414
|
const { size, collapsed } = useNavigationMenuContext();
|
|
413
415
|
const s = navigationMenuSizeMap[size];
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
416
|
+
const labelId = React.useId();
|
|
417
|
+
const showLabel = Boolean(label) && !collapsed;
|
|
418
|
+
return /* @__PURE__ */ React.createElement("li", { className: cn(showLabel && s.groupMargin) }, /* @__PURE__ */ React.createElement(
|
|
419
|
+
"div",
|
|
420
|
+
{
|
|
421
|
+
ref,
|
|
422
|
+
role: "group",
|
|
423
|
+
"aria-labelledby": showLabel && !props["aria-label"] ? labelId : void 0,
|
|
424
|
+
className,
|
|
425
|
+
...props
|
|
426
|
+
},
|
|
427
|
+
showLabel && /* @__PURE__ */ React.createElement(
|
|
428
|
+
"div",
|
|
429
|
+
{
|
|
430
|
+
id: labelId,
|
|
431
|
+
className: cn(
|
|
432
|
+
"font-semibold text-text-subtle uppercase tracking-wider select-none",
|
|
433
|
+
s.groupLabel
|
|
434
|
+
)
|
|
435
|
+
},
|
|
436
|
+
label
|
|
437
|
+
),
|
|
438
|
+
/* @__PURE__ */ React.createElement("ul", { className: "flex flex-col gap-0.5" }, children)
|
|
439
|
+
));
|
|
418
440
|
}
|
|
419
441
|
);
|
|
420
442
|
NavigationMenuGroup.displayName = "NavigationMenuGroup";
|
|
@@ -479,4 +501,4 @@ export {
|
|
|
479
501
|
NavigationMenuIndicator,
|
|
480
502
|
NavigationMenuViewport
|
|
481
503
|
};
|
|
482
|
-
//# sourceMappingURL=chunk-
|
|
504
|
+
//# sourceMappingURL=chunk-C5D3VRNJ.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/ui/navigation-menu.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu'\nimport * as CollapsiblePrimitive from '@radix-ui/react-collapsible'\nimport { Slot } from '@radix-ui/react-slot'\nimport { cn } from '@/lib/utils'\n\n// ─── Built-in Icons ───────────────────────────────────────\n\nfunction ChevronDownIcon({ className }: { className?: string }) {\n return (\n <svg className={className} fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" strokeWidth={2} aria-hidden=\"true\">\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M19 9l-7 7-7-7\" />\n </svg>\n )\n}\n\nfunction ChevronRightIcon({ className }: { className?: string }) {\n return (\n <svg className={className} fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" strokeWidth={2} aria-hidden=\"true\">\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M9 5l7 7-7 7\" />\n </svg>\n )\n}\n\n// ─── Radius Configuration ─────────────────────────────────\n\ntype NavigationMenuRadius = 'sm' | 'md' | 'lg' | 'xl'\n\nconst contentRadiusMap: Record<NavigationMenuRadius, string> = {\n sm: 'rounded', // 4px\n md: 'rounded-md', // 6px\n lg: 'rounded-lg', // 8px\n xl: 'rounded-xl', // 12px\n}\n\nconst itemRadiusMap: Record<NavigationMenuRadius, string> = {\n sm: 'rounded-sm', // 2px\n md: 'rounded', // 4px\n lg: 'rounded-md', // 6px\n xl: 'rounded-lg', // 8px\n}\n\n// ─── Contexts ─────────────────────────────────────────────\n\ntype NavigationMenuContextValue = {\n orientation: 'horizontal' | 'vertical'\n size: 'sm' | 'md' | 'default' | 'lg'\n collapsed: boolean\n radius: NavigationMenuRadius\n fontWeight: 'normal' | 'semibold'\n}\n\nconst NavigationMenuContext = React.createContext<NavigationMenuContextValue>({\n orientation: 'horizontal',\n size: 'default',\n collapsed: false,\n radius: 'lg',\n fontWeight: 'normal',\n})\nconst useNavigationMenuContext = () => React.useContext(NavigationMenuContext)\n\n// Whether we're inside NavigationMenuContent (affects link styling)\nconst ContentLevelContext = React.createContext(false)\n\n// ─── Size Configuration ───────────────────────────────────\n\nconst navigationMenuSizeMap = {\n sm: {\n trigger: 'h-8 text-sm px-3 gap-2',\n link: 'h-8 text-sm px-3 gap-2',\n icon: 'icon-xs',\n collapsedSquare: 'size-8', collapsedWidth: 56,\n dropdownLink: 'px-3 py-1.5 text-sm gap-2',\n subLink: 'h-8 text-sm pl-8 pr-3 gap-2',\n groupLabel: 'text-2xs px-3 mb-1', groupMargin: 'mt-4 first:mt-0',\n },\n md: {\n trigger: 'h-9 text-md px-3.5 gap-2',\n link: 'h-9 text-md px-3.5 gap-2',\n icon: 'icon-sm',\n collapsedSquare: 'size-9', collapsedWidth: 60,\n dropdownLink: 'px-3 py-1.5 text-md gap-2',\n subLink: 'h-9 text-md pl-9 pr-3.5 gap-2',\n groupLabel: 'text-xs px-3.5 mb-1', groupMargin: 'mt-4 first:mt-0',\n },\n default: {\n trigger: 'h-10 text-md px-4 gap-2',\n link: 'h-10 text-md px-4 gap-2',\n icon: 'icon-sm',\n collapsedSquare: 'size-10', collapsedWidth: 64,\n dropdownLink: 'px-3 py-2 text-md gap-2',\n subLink: 'h-10 text-md pl-10 pr-4 gap-2',\n groupLabel: 'text-xs px-4 mb-1.5', groupMargin: 'mt-5 first:mt-0',\n },\n lg: {\n trigger: 'h-12 text-base px-6 gap-2',\n link: 'h-12 text-base px-6 gap-2',\n icon: 'icon-sm',\n collapsedSquare: 'size-12', collapsedWidth: 72,\n dropdownLink: 'px-3 py-2.5 text-base gap-2',\n subLink: 'h-12 text-base pl-12 pr-6 gap-2',\n groupLabel: 'text-xs px-4 mb-2', groupMargin: 'mt-6 first:mt-0',\n },\n} as const\n\n// ─── NavigationMenu (Root) ────────────────────────────────\n\nexport interface NavigationMenuProps extends React.HTMLAttributes<HTMLElement> {\n /** Layout orientation */\n orientation?: 'horizontal' | 'vertical'\n /** Size of the menu items */\n size?: 'sm' | 'md' | 'default' | 'lg'\n /** Vertical only: show icons only (collapsed sidebar) */\n collapsed?: boolean\n /** Vertical only: sidebar width (default: 256px / 16rem) */\n width?: number | string\n /** Vertical only: collapsed sidebar width (default: 64px / 4rem) */\n collapsedWidth?: number | string\n /** Border radius for dropdown content and items */\n radius?: NavigationMenuRadius\n /** Font weight for menu items (default: normal, active items always use semibold) */\n fontWeight?: 'normal' | 'semibold'\n /** Horizontal only: delay before hover opens in ms */\n delayDuration?: number\n /** Horizontal only: skip delay when moving between triggers */\n skipDelayDuration?: number\n /** Controlled active menu item value */\n value?: string\n /** Default active menu item value (uncontrolled) */\n defaultValue?: string\n /** Callback when active item changes */\n onValueChange?: (value: string) => void\n}\n\nconst NavigationMenu = React.forwardRef<HTMLElement, NavigationMenuProps>(\n ({\n className,\n orientation = 'horizontal',\n size = 'default',\n collapsed = false,\n width,\n collapsedWidth,\n radius = 'lg',\n fontWeight = 'normal',\n delayDuration = 200,\n skipDelayDuration = 300,\n value,\n defaultValue,\n onValueChange,\n children,\n style,\n ...props\n }, ref) => {\n const contextValue = React.useMemo(\n () => ({ orientation, size, collapsed: orientation === 'vertical' ? collapsed : false, radius, fontWeight }),\n [orientation, size, collapsed, radius, fontWeight]\n )\n\n if (orientation === 'horizontal') {\n return (\n <NavigationMenuContext.Provider value={contextValue}>\n <NavigationMenuPrimitive.Root\n ref={ref as React.Ref<HTMLDivElement>}\n className={cn('relative', className)}\n delayDuration={delayDuration}\n skipDelayDuration={skipDelayDuration}\n value={value}\n defaultValue={defaultValue ?? ''}\n onValueChange={onValueChange}\n >\n {children}\n </NavigationMenuPrimitive.Root>\n </NavigationMenuContext.Provider>\n )\n }\n\n // Vertical mode\n const resolvedWidth = collapsed\n ? (collapsedWidth ?? navigationMenuSizeMap[size].collapsedWidth)\n : (width ?? 256)\n const widthValue = typeof resolvedWidth === 'number' ? `${resolvedWidth}px` : resolvedWidth\n\n return (\n <NavigationMenuContext.Provider value={contextValue}>\n <nav\n ref={ref}\n aria-label=\"navigation\"\n className={cn(\n 'flex flex-col',\n 'transition-[width] duration-normal ease-out',\n className\n )}\n style={{ width: widthValue, ...style }}\n {...props}\n >\n {children}\n </nav>\n </NavigationMenuContext.Provider>\n )\n }\n)\nNavigationMenu.displayName = 'NavigationMenu'\n\n// ─── NavigationMenuList ───────────────────────────────────\n\nexport interface NavigationMenuListProps extends React.HTMLAttributes<HTMLUListElement> {}\n\nconst NavigationMenuList = React.forwardRef<HTMLUListElement, NavigationMenuListProps>(\n ({ className, children, ...props }, ref) => {\n const { orientation } = useNavigationMenuContext()\n\n if (orientation === 'horizontal') {\n return (\n <NavigationMenuPrimitive.List\n ref={ref}\n className={cn('flex items-center gap-1', className)}\n {...props}\n >\n {children}\n </NavigationMenuPrimitive.List>\n )\n }\n\n return (\n <ul\n ref={ref}\n className={cn('flex flex-col gap-0.5', className)}\n {...props}\n >\n {children}\n </ul>\n )\n }\n)\nNavigationMenuList.displayName = 'NavigationMenuList'\n\n// ─── NavigationMenuItem ───────────────────────────────────\n\nexport interface NavigationMenuItemProps extends React.HTMLAttributes<HTMLLIElement> {\n /** Value identifier for Radix (horizontal mode) */\n value?: string\n /** Vertical only: default open state for sub-menu */\n defaultOpen?: boolean\n}\n\nconst NavigationMenuItem = React.forwardRef<HTMLLIElement, NavigationMenuItemProps>(\n ({ className, value, defaultOpen = false, children, ...props }, ref) => {\n const { orientation, collapsed } = useNavigationMenuContext()\n const [open, setOpen] = React.useState(defaultOpen)\n\n // Auto-close sub-menus when collapsed. Adjusted during render (React's pattern for\n // state that follows a prop) instead of in an effect, which re-rendered once more.\n const [prevCollapsed, setPrevCollapsed] = React.useState(collapsed)\n if (collapsed !== prevCollapsed) {\n setPrevCollapsed(collapsed)\n if (collapsed) setOpen(false)\n }\n\n if (orientation === 'horizontal') {\n return (\n <NavigationMenuPrimitive.Item\n ref={ref}\n className={cn('relative', className)}\n value={value}\n {...props}\n >\n {children}\n </NavigationMenuPrimitive.Item>\n )\n }\n\n // Vertical: wrap in Collapsible.Root for sub-menu support\n return (\n <CollapsiblePrimitive.Root\n open={collapsed ? false : open}\n onOpenChange={collapsed ? undefined : setOpen}\n asChild\n >\n <li ref={ref} className={cn('', className)} {...props}>\n {children}\n </li>\n </CollapsiblePrimitive.Root>\n )\n }\n)\nNavigationMenuItem.displayName = 'NavigationMenuItem'\n\n// ─── NavigationMenuTrigger ────────────────────────────────\n\nexport interface NavigationMenuTriggerProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n /** Icon displayed before the label */\n icon?: React.ReactNode\n /** Custom chevron icon (default: built-in ChevronDown for horizontal, ChevronRight for vertical) */\n chevronIcon?: React.ReactNode\n}\n\nconst NavigationMenuTrigger = React.forwardRef<HTMLButtonElement, NavigationMenuTriggerProps>(\n ({ className, children, icon, chevronIcon, ...props }, ref) => {\n const { orientation, size, collapsed, radius, fontWeight: fw } = useNavigationMenuContext()\n const s = navigationMenuSizeMap[size]\n const fwClass = fw === 'semibold' ? 'font-semibold' : 'font-normal'\n\n if (orientation === 'horizontal') {\n return (\n <NavigationMenuPrimitive.Trigger\n ref={ref}\n className={cn(\n 'group inline-flex items-center justify-center',\n s.trigger,\n 'gap-0',\n fwClass, 'text-text-muted',\n 'transition-colors duration-fast',\n 'hover:text-foreground',\n 'data-[state=open]:text-foreground',\n 'focus-visible:focus-ring',\n 'disabled:pointer-events-none disabled:opacity-50',\n className\n )}\n {...props}\n >\n {icon && <span className={cn('shrink-0 mr-2', s.icon)}>{icon}</span>}\n {children}\n <span className={cn('shrink-0 ml-1 text-text-subtle transition-transform duration-fast group-data-[state=open]:rotate-180', s.icon)}>\n {chevronIcon ?? <ChevronDownIcon className=\"size-full\" />}\n </span>\n </NavigationMenuPrimitive.Trigger>\n )\n }\n\n // Vertical: Collapsible trigger\n return (\n <CollapsiblePrimitive.Trigger\n ref={ref}\n className={cn(\n 'group flex items-center cursor-pointer',\n contentRadiusMap[radius],\n collapsed\n ? [s.collapsedSquare, 'justify-center mx-auto']\n : ['w-full', s.trigger],\n fwClass, 'text-text-muted transition-colors duration-fast',\n 'hover:text-foreground hover:bg-background-muted',\n !collapsed && 'data-[state=open]:text-foreground',\n 'focus-visible:focus-ring',\n 'disabled:pointer-events-none disabled:opacity-50',\n className\n )}\n {...(collapsed && typeof children === 'string' ? { title: children } : {})}\n {...props}\n >\n {icon && <span className={cn('shrink-0', s.icon)}>{icon}</span>}\n {!collapsed && (\n <>\n <span className=\"flex-1 text-left truncate\">{children}</span>\n <span\n className={cn(\n 'shrink-0 text-text-subtle transition-transform duration-normal',\n s.icon,\n 'group-data-[state=open]:rotate-90'\n )}\n >\n {chevronIcon ?? <ChevronRightIcon className=\"size-full\" />}\n </span>\n </>\n )}\n </CollapsiblePrimitive.Trigger>\n )\n }\n)\nNavigationMenuTrigger.displayName = 'NavigationMenuTrigger'\n\n// ─── NavigationMenuContent ────────────────────────────────\n\nexport interface NavigationMenuContentProps extends React.HTMLAttributes<HTMLDivElement> {}\n\nconst NavigationMenuContent = React.forwardRef<HTMLDivElement, NavigationMenuContentProps>(\n ({ className, children, ...props }, ref) => {\n const { orientation, collapsed, radius } = useNavigationMenuContext()\n\n if (orientation === 'horizontal') {\n return (\n <ContentLevelContext.Provider value={true}>\n <NavigationMenuPrimitive.Content\n ref={ref}\n className={cn(\n 'absolute left-0 top-full z-dropdown pt-1',\n 'data-[state=open]:animate-fade-in data-[state=closed]:animate-fade-out',\n className\n )}\n {...props}\n >\n <div className={cn('min-w-[180px] border border-border bg-background shadow-lg p-1.5 grid gap-0.5', contentRadiusMap[radius])}>\n {children}\n </div>\n </NavigationMenuPrimitive.Content>\n </ContentLevelContext.Provider>\n )\n }\n\n // Vertical: Collapsible content (hidden when collapsed)\n if (collapsed) return null\n\n return (\n <ContentLevelContext.Provider value={true}>\n <CollapsiblePrimitive.Content\n ref={ref}\n className={cn(\n 'overflow-hidden',\n 'data-[state=open]:animate-collapsible-down data-[state=closed]:animate-collapsible-up',\n )}\n {...props}\n >\n <div className={cn(\n 'flex flex-col gap-0.5 py-1',\n className\n )}>\n {children}\n </div>\n </CollapsiblePrimitive.Content>\n </ContentLevelContext.Provider>\n )\n }\n)\nNavigationMenuContent.displayName = 'NavigationMenuContent'\n\n// ─── NavigationMenuLink ───────────────────────────────────\n\nexport interface NavigationMenuLinkProps extends React.AnchorHTMLAttributes<HTMLAnchorElement> {\n /** Whether the link represents the current page */\n active?: boolean\n /** Compose with custom link component (Radix Slot) */\n asChild?: boolean\n /** Icon displayed before the label */\n icon?: React.ReactNode\n}\n\nconst NavigationMenuLink = React.forwardRef<HTMLAnchorElement, NavigationMenuLinkProps>(\n ({ className, active, asChild, icon, children, ...props }, ref) => {\n const { orientation, size, collapsed, radius, fontWeight: fw } = useNavigationMenuContext()\n const s = navigationMenuSizeMap[size]\n const fwClass = fw === 'semibold' ? 'font-semibold' : 'font-normal'\n const inContent = React.useContext(ContentLevelContext)\n\n if (orientation === 'horizontal') {\n // Exclude onSelect to avoid React vs Radix type conflict\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const { onSelect, ...radixSafeProps } = props as any\n\n // Content-level links (inside dropdown): block style with hover bg\n if (inContent) {\n return (\n <NavigationMenuPrimitive.Link\n ref={ref}\n className={cn(\n 'flex items-center w-full',\n s.dropdownLink,\n itemRadiusMap[radius],\n 'text-text-muted transition-colors duration-fast',\n 'hover:text-foreground hover:bg-background-muted',\n active && 'text-foreground bg-background-muted font-semibold',\n 'focus-visible:focus-ring',\n className\n )}\n active={active}\n asChild={asChild}\n onSelect={onSelect}\n {...radixSafeProps}\n >\n {asChild ? children : (\n <>\n {icon && <span className={cn('shrink-0', s.icon)}>{icon}</span>}\n {children}\n </>\n )}\n </NavigationMenuPrimitive.Link>\n )\n }\n\n // Top-level horizontal links: text only, no hover bg\n return (\n <NavigationMenuPrimitive.Link\n ref={ref}\n className={cn(\n 'inline-flex items-center justify-center',\n s.link,\n fwClass, 'text-text-muted',\n 'transition-colors duration-fast',\n 'hover:text-foreground',\n active && 'text-foreground font-semibold',\n 'focus-visible:focus-ring',\n className\n )}\n active={active}\n asChild={asChild}\n onSelect={onSelect}\n {...radixSafeProps}\n >\n {asChild ? children : (\n <>\n {icon && <span className={cn('shrink-0', s.icon)}>{icon}</span>}\n {children}\n </>\n )}\n </NavigationMenuPrimitive.Link>\n )\n }\n\n // ── Vertical mode ──\n\n const Comp = asChild ? Slot : 'a'\n\n // Content-level links (sub-menu items): compact, indented\n if (inContent) {\n return (\n <Comp\n ref={ref}\n className={cn(\n 'flex items-center w-full cursor-pointer',\n contentRadiusMap[radius],\n s.subLink,\n 'text-text-muted transition-colors duration-fast',\n 'hover:text-foreground hover:bg-background-muted',\n active && 'text-foreground bg-background-muted font-semibold',\n 'focus-visible:focus-ring',\n className\n )}\n {...(active ? { 'aria-current': 'page' as const } : {})}\n {...props}\n >\n {icon && <span className={cn('shrink-0', s.icon)}>{icon}</span>}\n {!collapsed && children}\n </Comp>\n )\n }\n\n // Top-level vertical links\n return (\n <Comp\n ref={ref}\n className={cn(\n 'relative flex items-center cursor-pointer',\n contentRadiusMap[radius],\n collapsed\n ? [s.collapsedSquare, 'justify-center mx-auto']\n : ['w-full', s.link],\n 'text-text-muted transition-colors duration-fast',\n 'hover:text-foreground hover:bg-background-muted',\n active && 'text-foreground bg-background-muted font-semibold',\n 'focus-visible:focus-ring',\n className\n )}\n {...(active ? { 'aria-current': 'page' as const } : {})}\n {...(collapsed && typeof children === 'string' ? { title: children } : {})}\n {...props}\n >\n {icon && <span className={cn('shrink-0', s.icon)}>{icon}</span>}\n {!collapsed && <span className=\"truncate\">{children}</span>}\n </Comp>\n )\n }\n)\nNavigationMenuLink.displayName = 'NavigationMenuLink'\n\n// ─── NavigationMenuGroup (vertical only) ──────────────────\n\nexport interface NavigationMenuGroupProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Group header label */\n label?: string\n}\n\nconst NavigationMenuGroup = React.forwardRef<HTMLDivElement, NavigationMenuGroupProps>(\n ({ className, label, children, ...props }, ref) => {\n const { size, collapsed } = useNavigationMenuContext()\n const s = navigationMenuSizeMap[size]\n\n const labelId = React.useId()\n const showLabel = Boolean(label) && !collapsed\n\n // Groups sit inside NavigationMenuList's <ul>, so the group is wrapped in an <li> to\n // keep the list structure valid. The spacing class stays on that <li>: it relies on\n // :first-child among the list's children.\n return (\n <li className={cn(showLabel && s.groupMargin)}>\n <div\n ref={ref}\n role=\"group\"\n aria-labelledby={showLabel && !props['aria-label'] ? labelId : undefined}\n className={className}\n {...props}\n >\n {showLabel && (\n <div\n id={labelId}\n className={cn(\n 'font-semibold text-text-subtle uppercase tracking-wider select-none',\n s.groupLabel,\n )}\n >\n {label}\n </div>\n )}\n <ul className=\"flex flex-col gap-0.5\">\n {children}\n </ul>\n </div>\n </li>\n )\n }\n)\nNavigationMenuGroup.displayName = 'NavigationMenuGroup'\n\n// ─── NavigationMenuIndicator ──────────────────────────────\n\nexport interface NavigationMenuIndicatorProps extends React.HTMLAttributes<HTMLDivElement> {\n /** Active indicator dot color (default: dark/foreground, primary: brand color) */\n color?: 'default' | 'primary'\n}\n\nconst NavigationMenuIndicator = React.forwardRef<HTMLDivElement, NavigationMenuIndicatorProps>(\n ({ className, color = 'default', ...props }, ref) => {\n const { orientation } = useNavigationMenuContext()\n\n // Vertical: active indicator is built into NavigationMenuLink styling\n if (orientation === 'vertical') return null\n\n return (\n <NavigationMenuPrimitive.Indicator\n ref={ref}\n className={cn(\n 'z-10 flex h-[3px] items-end justify-center overflow-hidden',\n 'transition-[width,transform] duration-normal ease-out',\n 'data-[state=visible]:animate-fade-in data-[state=hidden]:animate-fade-out',\n className\n )}\n {...props}\n >\n <div className={cn(\n 'relative h-full w-full rounded-full',\n color === 'default' ? 'bg-foreground' : 'bg-primary'\n )} />\n </NavigationMenuPrimitive.Indicator>\n )\n }\n)\nNavigationMenuIndicator.displayName = 'NavigationMenuIndicator'\n\n// ─── NavigationMenuViewport ───────────────────────────────\n\nexport interface NavigationMenuViewportProps extends React.HTMLAttributes<HTMLDivElement> {}\n\nconst NavigationMenuViewport = React.forwardRef<HTMLDivElement, NavigationMenuViewportProps>(\n ({ className, ...props }, ref) => {\n const { orientation } = useNavigationMenuContext()\n\n // Vertical mode does not use a viewport\n if (orientation === 'vertical') return null\n\n return (\n <div className=\"absolute left-0 top-full z-dropdown w-auto pt-1\">\n <NavigationMenuPrimitive.Viewport\n ref={ref}\n className={cn(\n 'relative overflow-hidden',\n 'border border-border bg-background rounded-xl shadow-lg',\n 'h-[var(--radix-navigation-menu-viewport-height)]',\n 'w-[var(--radix-navigation-menu-viewport-width)]',\n 'transition-[width,height] duration-fast ease-out',\n 'data-[state=open]:animate-nav-viewport-enter',\n 'data-[state=closed]:animate-nav-viewport-exit',\n className\n )}\n {...props}\n />\n </div>\n )\n }\n)\nNavigationMenuViewport.displayName = 'NavigationMenuViewport'\n\n// ─── Exports ──────────────────────────────────────────────\nexport {\n NavigationMenu,\n NavigationMenuList,\n NavigationMenuItem,\n NavigationMenuTrigger,\n NavigationMenuContent,\n NavigationMenuLink,\n NavigationMenuGroup,\n NavigationMenuIndicator,\n NavigationMenuViewport,\n navigationMenuSizeMap,\n type NavigationMenuRadius,\n}\n"],"mappings":"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","names":[]}
|
|
@@ -418,9 +418,9 @@ var PaginationEllipsis = React.forwardRef(
|
|
|
418
418
|
);
|
|
419
419
|
PaginationEllipsis.displayName = "PaginationEllipsis";
|
|
420
420
|
var PaginationItems = React.forwardRef(
|
|
421
|
-
(
|
|
421
|
+
(_props, _ref) => {
|
|
422
422
|
const ctx = usePaginationContext();
|
|
423
|
-
return /* @__PURE__ */ React.createElement(
|
|
423
|
+
return /* @__PURE__ */ React.createElement(React.Fragment, null, ctx.paginationRange.map((item, index) => /* @__PURE__ */ React.createElement(PaginationItem, { key: `${item}-${index}` }, item === "dots" ? /* @__PURE__ */ React.createElement(PaginationEllipsis, null) : /* @__PURE__ */ React.createElement(PaginationLink, { page: item }))));
|
|
424
424
|
}
|
|
425
425
|
);
|
|
426
426
|
PaginationItems.displayName = "PaginationItems";
|
|
@@ -440,4 +440,4 @@ export {
|
|
|
440
440
|
PaginationEllipsis,
|
|
441
441
|
PaginationItems
|
|
442
442
|
};
|
|
443
|
-
//# sourceMappingURL=chunk-
|
|
443
|
+
//# sourceMappingURL=chunk-EG2GTK65.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/ui/pagination.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport { cva } from 'class-variance-authority'\nimport { cn } from '@/lib/utils'\n\n// ─── Built-in Icons ──────────────────────────────────────\n\nfunction ChevronLeftIcon({ className }: { className?: string }) {\n return (\n <svg\n className={className}\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n strokeWidth={2}\n >\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M15 19l-7-7 7-7\" />\n </svg>\n )\n}\n\nfunction ChevronRightIcon({ className }: { className?: string }) {\n return (\n <svg\n className={className}\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n strokeWidth={2}\n >\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M9 5l7 7-7 7\" />\n </svg>\n )\n}\n\nfunction ChevronsLeftIcon({ className }: { className?: string }) {\n return (\n <svg\n className={className}\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n strokeWidth={2}\n >\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M11 17l-5-5 5-5M18 17l-5-5 5-5\" />\n </svg>\n )\n}\n\nfunction ChevronsRightIcon({ className }: { className?: string }) {\n return (\n <svg\n className={className}\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n strokeWidth={2}\n >\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M13 7l5 5-5 5M6 7l5 5-5 5\" />\n </svg>\n )\n}\n\nfunction EllipsisIcon({ className }: { className?: string }) {\n return (\n <svg\n className={className}\n fill=\"currentColor\"\n viewBox=\"0 0 24 24\"\n >\n <circle cx=\"6\" cy=\"12\" r=\"1.5\" />\n <circle cx=\"12\" cy=\"12\" r=\"1.5\" />\n <circle cx=\"18\" cy=\"12\" r=\"1.5\" />\n </svg>\n )\n}\n\n// ─── usePagination Hook ──────────────────────────────────\n\nexport type PaginationRange = (number | 'dots')[]\n\nexport interface UsePaginationProps {\n /** Total number of pages */\n total: number\n /** Number of siblings on each side of current page */\n siblings?: number\n /** Number of boundary pages at start/end */\n boundaries?: number\n /** Current active page (1-based) */\n page: number\n}\n\nfunction range(start: number, end: number): number[] {\n const result: number[] = []\n for (let i = start; i <= end; i++) result.push(i)\n return result\n}\n\nexport function usePagination({\n total,\n siblings = 1,\n boundaries = 1,\n page,\n}: UsePaginationProps): PaginationRange {\n if (total <= 0) return []\n\n const totalPageNumbers = siblings * 2 + 3 + boundaries * 2\n if (totalPageNumbers >= total) {\n return range(1, total)\n }\n\n const leftSiblingIndex = Math.max(page - siblings, boundaries + 1)\n const rightSiblingIndex = Math.min(page + siblings, total - boundaries)\n\n const showLeftDots = leftSiblingIndex > boundaries + 2\n const showRightDots = rightSiblingIndex < total - boundaries - 1\n\n if (!showLeftDots && showRightDots) {\n const leftItemCount = 3 + 2 * siblings + boundaries\n const leftRange = range(1, leftItemCount)\n return [...leftRange, 'dots' as const, ...range(total - boundaries + 1, total)]\n }\n\n if (showLeftDots && !showRightDots) {\n const rightItemCount = 3 + 2 * siblings + boundaries\n const rightRange = range(total - rightItemCount + 1, total)\n return [...range(1, boundaries), 'dots' as const, ...rightRange]\n }\n\n return [\n ...range(1, boundaries),\n 'dots' as const,\n ...range(leftSiblingIndex, rightSiblingIndex),\n 'dots' as const,\n ...range(total - boundaries + 1, total),\n ]\n}\n\n// ─── Context ─────────────────────────────────────────────\n\nexport type PaginationSize = 'xs' | 'sm' | 'default' | 'lg' | 'xl'\nexport type PaginationVariant = 'default' | 'outline' | 'ghost'\nexport type PaginationColor = 'default' | 'primary'\nexport type PaginationRadius = 'sm' | 'base' | 'md' | 'lg' | 'xl' | 'full'\n\ntype PaginationContextValue = {\n page: number\n total: number\n siblings: number\n boundaries: number\n size: PaginationSize\n variant: PaginationVariant\n color: PaginationColor\n radius: PaginationRadius\n disabled: boolean\n loop: boolean\n onPageChange: (page: number) => void\n paginationRange: PaginationRange\n}\n\nconst PaginationContext = React.createContext<PaginationContextValue | null>(null)\n\nfunction usePaginationContext() {\n const ctx = React.useContext(PaginationContext)\n if (!ctx) throw new Error('Pagination components must be used within <Pagination>')\n return ctx\n}\n\n// ─── Size Map ────────────────────────────────────────────\n\nconst paginationSizeMap = {\n xs: { item: 'h-7 min-w-7 text-xs', icon: 'icon-xs', gap: 'gap-1' },\n sm: { item: 'h-8 min-w-8 text-sm', icon: 'icon-xs', gap: 'gap-1' },\n default: { item: 'h-9 min-w-9 text-md', icon: 'icon-sm', gap: 'gap-1' },\n lg: { item: 'h-10 min-w-10 text-md', icon: 'icon-sm', gap: 'gap-1.5' },\n xl: { item: 'h-12 min-w-12 text-base', icon: 'icon-sm', gap: 'gap-1.5' },\n} as const\n\n// ─── Item Variants (CVA) ─────────────────────────────────\n\nconst paginationItemVariants = cva(\n 'inline-flex items-center justify-center select-none transition-colors duration-fast font-semibold focus-visible:focus-ring',\n {\n variants: {\n radius: {\n sm: 'rounded-sm',\n base: 'rounded',\n md: 'rounded-md',\n lg: 'rounded-lg',\n xl: 'rounded-xl',\n full: 'rounded-full',\n },\n },\n defaultVariants: {\n radius: 'md',\n },\n }\n)\n\n// ─── Variant Style Helpers ───────────────────────────────\n\n// Active color maps\nconst activeColorMap = {\n default: 'bg-foreground text-background',\n primary: 'bg-primary text-primary-foreground',\n} as const\n\nconst ghostActiveColorMap = {\n default: 'bg-background-muted text-foreground font-bold',\n primary: 'bg-background-muted text-primary',\n} as const\n\nfunction getItemClasses(variant: PaginationVariant, color: PaginationColor, isActive: boolean, disabled: boolean) {\n if (disabled) {\n return variant === 'outline'\n ? 'border border-border text-disabled-foreground pointer-events-none opacity-50'\n : 'border border-transparent text-disabled-foreground pointer-events-none opacity-50'\n }\n if (isActive) {\n switch (variant) {\n case 'outline':\n return `border ${color === 'default' ? 'border-foreground' : 'border-primary'} ${activeColorMap[color]}`\n case 'ghost':\n return `border border-transparent ${ghostActiveColorMap[color]}`\n case 'default':\n default:\n return `border border-transparent ${activeColorMap[color]}`\n }\n }\n switch (variant) {\n case 'outline':\n return 'border border-border text-text-muted hover:bg-background-muted hover:text-foreground'\n case 'ghost':\n return 'border border-transparent text-text-muted hover:bg-background-muted hover:text-foreground'\n case 'default':\n default:\n return 'border border-transparent text-text-muted hover:bg-background-muted hover:text-foreground'\n }\n}\n\n// ─── Pagination (Root) ───────────────────────────────────\n\nexport interface PaginationProps extends Omit<React.ComponentPropsWithoutRef<'nav'>, 'onChange'> {\n /** Total number of pages */\n total?: number\n /** Controlled active page (1-based) */\n value?: number\n /** Initial page for uncontrolled mode */\n defaultValue?: number\n /** Page change callback */\n onChange?: (page: number) => void\n /** Number of siblings on each side of current page */\n siblings?: number\n /** Number of boundary pages at start/end */\n boundaries?: number\n /** Component size */\n size?: PaginationSize\n /** Visual variant */\n variant?: PaginationVariant\n /** Active page color */\n color?: PaginationColor\n /** Border radius */\n radius?: PaginationRadius\n /** Disable all interactions */\n disabled?: boolean\n /** Show previous/next controls */\n withControls?: boolean\n /** Show first/last controls */\n withEdges?: boolean\n /** Loop from last to first and vice versa */\n loop?: boolean\n}\n\nconst Pagination = React.forwardRef<HTMLElement, PaginationProps>(\n ({\n className,\n total = 1,\n value,\n defaultValue = 1,\n onChange,\n siblings = 1,\n boundaries = 1,\n size = 'default',\n variant = 'default',\n color = 'default',\n radius = 'md',\n disabled = false,\n withControls = true,\n withEdges = false,\n loop = false,\n children,\n ...props\n }, ref) => {\n // Controlled / Uncontrolled\n const [internalPage, setInternalPage] = React.useState(defaultValue)\n const isControlled = value !== undefined\n const page = isControlled ? value : internalPage\n\n const handlePageChange = React.useCallback((newPage: number) => {\n if (disabled) return\n const clamped = Math.max(1, Math.min(total, newPage))\n if (!isControlled) setInternalPage(clamped)\n onChange?.(clamped)\n }, [disabled, total, isControlled, onChange])\n\n const paginationRange = usePagination({ total, siblings, boundaries, page })\n\n const contextValue = React.useMemo<PaginationContextValue>(() => ({\n page,\n total,\n siblings,\n boundaries,\n size,\n variant,\n color,\n radius,\n disabled,\n loop,\n onPageChange: handlePageChange,\n paginationRange,\n }), [page, total, siblings, boundaries, size, variant, color, radius, disabled, loop, handlePageChange, paginationRange])\n\n return (\n <PaginationContext.Provider value={contextValue}>\n <nav\n ref={ref}\n role=\"navigation\"\n aria-label=\"pagination\"\n className={cn('', className)}\n {...props}\n >\n {children ?? (\n <PaginationContent>\n {withEdges && <PaginationItem><PaginationFirst /></PaginationItem>}\n {withControls && <PaginationItem><PaginationPrevious /></PaginationItem>}\n <PaginationItems />\n {withControls && <PaginationItem><PaginationNext /></PaginationItem>}\n {withEdges && <PaginationItem><PaginationLast /></PaginationItem>}\n </PaginationContent>\n )}\n </nav>\n </PaginationContext.Provider>\n )\n }\n)\nPagination.displayName = 'Pagination'\n\n// ─── PaginationContent ───────────────────────────────────\n\nconst PaginationContent = React.forwardRef<HTMLUListElement, React.ComponentPropsWithoutRef<'ul'>>(\n ({ className, ...props }, ref) => {\n const { size } = usePaginationContext()\n const sizeClass = paginationSizeMap[size]\n return (\n <ul\n ref={ref}\n className={cn('flex flex-wrap items-center', sizeClass.gap, className)}\n {...props}\n />\n )\n }\n)\nPaginationContent.displayName = 'PaginationContent'\n\n// ─── PaginationItem ──────────────────────────────────────\n\nconst PaginationItem = React.forwardRef<HTMLLIElement, React.ComponentPropsWithoutRef<'li'>>(\n ({ className, ...props }, ref) => (\n <li ref={ref} className={cn('', className)} {...props} />\n )\n)\nPaginationItem.displayName = 'PaginationItem'\n\n// ─── PaginationLink ──────────────────────────────────────\n\nexport interface PaginationLinkProps extends React.ComponentPropsWithoutRef<'button'> {\n /** Page number this link navigates to */\n page: number\n /** Whether this page is currently active (auto-detected from context if omitted) */\n isActive?: boolean\n}\n\nconst PaginationLink = React.forwardRef<HTMLButtonElement, PaginationLinkProps>(\n ({ className, page: targetPage, isActive: isActiveProp, ...props }, ref) => {\n const ctx = usePaginationContext()\n const isActive = isActiveProp ?? (ctx.page === targetPage)\n const sizeClass = paginationSizeMap[ctx.size]\n\n return (\n <button\n ref={ref}\n type=\"button\"\n aria-current={isActive ? 'page' : undefined}\n aria-label={`Go to page ${targetPage}`}\n disabled={ctx.disabled}\n onClick={() => ctx.onPageChange(targetPage)}\n className={cn(\n paginationItemVariants({ radius: ctx.radius }),\n sizeClass.item,\n getItemClasses(ctx.variant, ctx.color, isActive, ctx.disabled),\n className\n )}\n {...props}\n >\n {targetPage}\n </button>\n )\n }\n)\nPaginationLink.displayName = 'PaginationLink'\n\n// ─── PaginationPrevious ──────────────────────────────────\n\nexport interface PaginationPreviousProps extends React.ComponentPropsWithoutRef<'button'> {\n /** Custom icon */\n icon?: React.ReactNode\n}\n\nconst PaginationPrevious = React.forwardRef<HTMLButtonElement, PaginationPreviousProps>(\n ({ className, icon, ...props }, ref) => {\n const ctx = usePaginationContext()\n const sizeClass = paginationSizeMap[ctx.size]\n const isDisabled = ctx.disabled || (!ctx.loop && ctx.page <= 1)\n\n const handleClick = () => {\n if (ctx.page <= 1) {\n if (ctx.loop) ctx.onPageChange(ctx.total)\n } else {\n ctx.onPageChange(ctx.page - 1)\n }\n }\n\n return (\n <button\n ref={ref}\n type=\"button\"\n aria-label=\"Go to previous page\"\n disabled={isDisabled}\n onClick={handleClick}\n className={cn(\n paginationItemVariants({ radius: ctx.radius }),\n sizeClass.item,\n getItemClasses(ctx.variant, ctx.color, false, isDisabled),\n className\n )}\n {...props}\n >\n {icon ?? <ChevronLeftIcon className={sizeClass.icon} />}\n </button>\n )\n }\n)\nPaginationPrevious.displayName = 'PaginationPrevious'\n\n// ─── PaginationNext ──────────────────────────────────────\n\nexport interface PaginationNextProps extends React.ComponentPropsWithoutRef<'button'> {\n /** Custom icon */\n icon?: React.ReactNode\n}\n\nconst PaginationNext = React.forwardRef<HTMLButtonElement, PaginationNextProps>(\n ({ className, icon, ...props }, ref) => {\n const ctx = usePaginationContext()\n const sizeClass = paginationSizeMap[ctx.size]\n const isDisabled = ctx.disabled || (!ctx.loop && ctx.page >= ctx.total)\n\n const handleClick = () => {\n if (ctx.page >= ctx.total) {\n if (ctx.loop) ctx.onPageChange(1)\n } else {\n ctx.onPageChange(ctx.page + 1)\n }\n }\n\n return (\n <button\n ref={ref}\n type=\"button\"\n aria-label=\"Go to next page\"\n disabled={isDisabled}\n onClick={handleClick}\n className={cn(\n paginationItemVariants({ radius: ctx.radius }),\n sizeClass.item,\n getItemClasses(ctx.variant, ctx.color, false, isDisabled),\n className\n )}\n {...props}\n >\n {icon ?? <ChevronRightIcon className={sizeClass.icon} />}\n </button>\n )\n }\n)\nPaginationNext.displayName = 'PaginationNext'\n\n// ─── PaginationFirst ─────────────────────────────────────\n\nexport interface PaginationFirstProps extends React.ComponentPropsWithoutRef<'button'> {\n /** Custom icon */\n icon?: React.ReactNode\n}\n\nconst PaginationFirst = React.forwardRef<HTMLButtonElement, PaginationFirstProps>(\n ({ className, icon, ...props }, ref) => {\n const ctx = usePaginationContext()\n const sizeClass = paginationSizeMap[ctx.size]\n const isDisabled = ctx.disabled || ctx.page <= 1\n\n return (\n <button\n ref={ref}\n type=\"button\"\n aria-label=\"Go to first page\"\n disabled={isDisabled}\n onClick={() => ctx.onPageChange(1)}\n className={cn(\n paginationItemVariants({ radius: ctx.radius }),\n sizeClass.item,\n getItemClasses(ctx.variant, ctx.color, false, isDisabled),\n className\n )}\n {...props}\n >\n {icon ?? <ChevronsLeftIcon className={sizeClass.icon} />}\n </button>\n )\n }\n)\nPaginationFirst.displayName = 'PaginationFirst'\n\n// ─── PaginationLast ──────────────────────────────────────\n\nexport interface PaginationLastProps extends React.ComponentPropsWithoutRef<'button'> {\n /** Custom icon */\n icon?: React.ReactNode\n}\n\nconst PaginationLast = React.forwardRef<HTMLButtonElement, PaginationLastProps>(\n ({ className, icon, ...props }, ref) => {\n const ctx = usePaginationContext()\n const sizeClass = paginationSizeMap[ctx.size]\n const isDisabled = ctx.disabled || ctx.page >= ctx.total\n\n return (\n <button\n ref={ref}\n type=\"button\"\n aria-label=\"Go to last page\"\n disabled={isDisabled}\n onClick={() => ctx.onPageChange(ctx.total)}\n className={cn(\n paginationItemVariants({ radius: ctx.radius }),\n sizeClass.item,\n getItemClasses(ctx.variant, ctx.color, false, isDisabled),\n className\n )}\n {...props}\n >\n {icon ?? <ChevronsRightIcon className={sizeClass.icon} />}\n </button>\n )\n }\n)\nPaginationLast.displayName = 'PaginationLast'\n\n// ─── PaginationEllipsis ──────────────────────────────────\n\nconst PaginationEllipsis = React.forwardRef<HTMLSpanElement, React.ComponentPropsWithoutRef<'span'>>(\n ({ className, ...props }, ref) => {\n const ctx = usePaginationContext()\n const sizeClass = paginationSizeMap[ctx.size]\n return (\n <span\n ref={ref}\n aria-hidden=\"true\"\n className={cn(\n 'inline-flex items-center justify-center text-text-muted',\n sizeClass.item,\n className\n )}\n {...props}\n >\n <EllipsisIcon className={sizeClass.icon} />\n <span className=\"sr-only\">More pages</span>\n </span>\n )\n }\n)\nPaginationEllipsis.displayName = 'PaginationEllipsis'\n\n// ─── PaginationItems (Convenience) ───────────────────────\n\nconst PaginationItems = React.forwardRef<HTMLDivElement, React.ComponentPropsWithoutRef<'div'>>(\n ({ className, ...props }, ref) => {\n const ctx = usePaginationContext()\n return (\n <div ref={ref} className={cn('contents', className)} {...props}>\n {ctx.paginationRange.map((item, index) => (\n <PaginationItem key={`${item}-${index}`}>\n {item === 'dots' ? (\n <PaginationEllipsis />\n ) : (\n <PaginationLink page={item} />\n )}\n </PaginationItem>\n ))}\n </div>\n )\n }\n)\nPaginationItems.displayName = 'PaginationItems'\n\n// ─── Exports ─────────────────────────────────────────────\nexport {\n Pagination,\n PaginationContent,\n PaginationItem,\n PaginationLink,\n PaginationPrevious,\n PaginationNext,\n PaginationFirst,\n PaginationLast,\n PaginationEllipsis,\n PaginationItems,\n paginationItemVariants,\n paginationSizeMap,\n}\n"],"mappings":"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","names":[]}
|
|
1
|
+
{"version":3,"sources":["../src/components/ui/pagination.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport { cva } from 'class-variance-authority'\nimport { cn } from '@/lib/utils'\n\n// ─── Built-in Icons ──────────────────────────────────────\n\nfunction ChevronLeftIcon({ className }: { className?: string }) {\n return (\n <svg\n className={className}\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n strokeWidth={2}\n >\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M15 19l-7-7 7-7\" />\n </svg>\n )\n}\n\nfunction ChevronRightIcon({ className }: { className?: string }) {\n return (\n <svg\n className={className}\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n strokeWidth={2}\n >\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M9 5l7 7-7 7\" />\n </svg>\n )\n}\n\nfunction ChevronsLeftIcon({ className }: { className?: string }) {\n return (\n <svg\n className={className}\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n strokeWidth={2}\n >\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M11 17l-5-5 5-5M18 17l-5-5 5-5\" />\n </svg>\n )\n}\n\nfunction ChevronsRightIcon({ className }: { className?: string }) {\n return (\n <svg\n className={className}\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n strokeWidth={2}\n >\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M13 7l5 5-5 5M6 7l5 5-5 5\" />\n </svg>\n )\n}\n\nfunction EllipsisIcon({ className }: { className?: string }) {\n return (\n <svg\n className={className}\n fill=\"currentColor\"\n viewBox=\"0 0 24 24\"\n >\n <circle cx=\"6\" cy=\"12\" r=\"1.5\" />\n <circle cx=\"12\" cy=\"12\" r=\"1.5\" />\n <circle cx=\"18\" cy=\"12\" r=\"1.5\" />\n </svg>\n )\n}\n\n// ─── usePagination Hook ──────────────────────────────────\n\nexport type PaginationRange = (number | 'dots')[]\n\nexport interface UsePaginationProps {\n /** Total number of pages */\n total: number\n /** Number of siblings on each side of current page */\n siblings?: number\n /** Number of boundary pages at start/end */\n boundaries?: number\n /** Current active page (1-based) */\n page: number\n}\n\nfunction range(start: number, end: number): number[] {\n const result: number[] = []\n for (let i = start; i <= end; i++) result.push(i)\n return result\n}\n\nexport function usePagination({\n total,\n siblings = 1,\n boundaries = 1,\n page,\n}: UsePaginationProps): PaginationRange {\n if (total <= 0) return []\n\n const totalPageNumbers = siblings * 2 + 3 + boundaries * 2\n if (totalPageNumbers >= total) {\n return range(1, total)\n }\n\n const leftSiblingIndex = Math.max(page - siblings, boundaries + 1)\n const rightSiblingIndex = Math.min(page + siblings, total - boundaries)\n\n const showLeftDots = leftSiblingIndex > boundaries + 2\n const showRightDots = rightSiblingIndex < total - boundaries - 1\n\n if (!showLeftDots && showRightDots) {\n const leftItemCount = 3 + 2 * siblings + boundaries\n const leftRange = range(1, leftItemCount)\n return [...leftRange, 'dots' as const, ...range(total - boundaries + 1, total)]\n }\n\n if (showLeftDots && !showRightDots) {\n const rightItemCount = 3 + 2 * siblings + boundaries\n const rightRange = range(total - rightItemCount + 1, total)\n return [...range(1, boundaries), 'dots' as const, ...rightRange]\n }\n\n return [\n ...range(1, boundaries),\n 'dots' as const,\n ...range(leftSiblingIndex, rightSiblingIndex),\n 'dots' as const,\n ...range(total - boundaries + 1, total),\n ]\n}\n\n// ─── Context ─────────────────────────────────────────────\n\nexport type PaginationSize = 'xs' | 'sm' | 'default' | 'lg' | 'xl'\nexport type PaginationVariant = 'default' | 'outline' | 'ghost'\nexport type PaginationColor = 'default' | 'primary'\nexport type PaginationRadius = 'sm' | 'base' | 'md' | 'lg' | 'xl' | 'full'\n\ntype PaginationContextValue = {\n page: number\n total: number\n siblings: number\n boundaries: number\n size: PaginationSize\n variant: PaginationVariant\n color: PaginationColor\n radius: PaginationRadius\n disabled: boolean\n loop: boolean\n onPageChange: (page: number) => void\n paginationRange: PaginationRange\n}\n\nconst PaginationContext = React.createContext<PaginationContextValue | null>(null)\n\nfunction usePaginationContext() {\n const ctx = React.useContext(PaginationContext)\n if (!ctx) throw new Error('Pagination components must be used within <Pagination>')\n return ctx\n}\n\n// ─── Size Map ────────────────────────────────────────────\n\nconst paginationSizeMap = {\n xs: { item: 'h-7 min-w-7 text-xs', icon: 'icon-xs', gap: 'gap-1' },\n sm: { item: 'h-8 min-w-8 text-sm', icon: 'icon-xs', gap: 'gap-1' },\n default: { item: 'h-9 min-w-9 text-md', icon: 'icon-sm', gap: 'gap-1' },\n lg: { item: 'h-10 min-w-10 text-md', icon: 'icon-sm', gap: 'gap-1.5' },\n xl: { item: 'h-12 min-w-12 text-base', icon: 'icon-sm', gap: 'gap-1.5' },\n} as const\n\n// ─── Item Variants (CVA) ─────────────────────────────────\n\nconst paginationItemVariants = cva(\n 'inline-flex items-center justify-center select-none transition-colors duration-fast font-semibold focus-visible:focus-ring',\n {\n variants: {\n radius: {\n sm: 'rounded-sm',\n base: 'rounded',\n md: 'rounded-md',\n lg: 'rounded-lg',\n xl: 'rounded-xl',\n full: 'rounded-full',\n },\n },\n defaultVariants: {\n radius: 'md',\n },\n }\n)\n\n// ─── Variant Style Helpers ───────────────────────────────\n\n// Active color maps\nconst activeColorMap = {\n default: 'bg-foreground text-background',\n primary: 'bg-primary text-primary-foreground',\n} as const\n\nconst ghostActiveColorMap = {\n default: 'bg-background-muted text-foreground font-bold',\n primary: 'bg-background-muted text-primary',\n} as const\n\nfunction getItemClasses(variant: PaginationVariant, color: PaginationColor, isActive: boolean, disabled: boolean) {\n if (disabled) {\n return variant === 'outline'\n ? 'border border-border text-disabled-foreground pointer-events-none opacity-50'\n : 'border border-transparent text-disabled-foreground pointer-events-none opacity-50'\n }\n if (isActive) {\n switch (variant) {\n case 'outline':\n return `border ${color === 'default' ? 'border-foreground' : 'border-primary'} ${activeColorMap[color]}`\n case 'ghost':\n return `border border-transparent ${ghostActiveColorMap[color]}`\n case 'default':\n default:\n return `border border-transparent ${activeColorMap[color]}`\n }\n }\n switch (variant) {\n case 'outline':\n return 'border border-border text-text-muted hover:bg-background-muted hover:text-foreground'\n case 'ghost':\n return 'border border-transparent text-text-muted hover:bg-background-muted hover:text-foreground'\n case 'default':\n default:\n return 'border border-transparent text-text-muted hover:bg-background-muted hover:text-foreground'\n }\n}\n\n// ─── Pagination (Root) ───────────────────────────────────\n\nexport interface PaginationProps extends Omit<React.ComponentPropsWithoutRef<'nav'>, 'onChange'> {\n /** Total number of pages */\n total?: number\n /** Controlled active page (1-based) */\n value?: number\n /** Initial page for uncontrolled mode */\n defaultValue?: number\n /** Page change callback */\n onChange?: (page: number) => void\n /** Number of siblings on each side of current page */\n siblings?: number\n /** Number of boundary pages at start/end */\n boundaries?: number\n /** Component size */\n size?: PaginationSize\n /** Visual variant */\n variant?: PaginationVariant\n /** Active page color */\n color?: PaginationColor\n /** Border radius */\n radius?: PaginationRadius\n /** Disable all interactions */\n disabled?: boolean\n /** Show previous/next controls */\n withControls?: boolean\n /** Show first/last controls */\n withEdges?: boolean\n /** Loop from last to first and vice versa */\n loop?: boolean\n}\n\nconst Pagination = React.forwardRef<HTMLElement, PaginationProps>(\n ({\n className,\n total = 1,\n value,\n defaultValue = 1,\n onChange,\n siblings = 1,\n boundaries = 1,\n size = 'default',\n variant = 'default',\n color = 'default',\n radius = 'md',\n disabled = false,\n withControls = true,\n withEdges = false,\n loop = false,\n children,\n ...props\n }, ref) => {\n // Controlled / Uncontrolled\n const [internalPage, setInternalPage] = React.useState(defaultValue)\n const isControlled = value !== undefined\n const page = isControlled ? value : internalPage\n\n const handlePageChange = React.useCallback((newPage: number) => {\n if (disabled) return\n const clamped = Math.max(1, Math.min(total, newPage))\n if (!isControlled) setInternalPage(clamped)\n onChange?.(clamped)\n }, [disabled, total, isControlled, onChange])\n\n const paginationRange = usePagination({ total, siblings, boundaries, page })\n\n const contextValue = React.useMemo<PaginationContextValue>(() => ({\n page,\n total,\n siblings,\n boundaries,\n size,\n variant,\n color,\n radius,\n disabled,\n loop,\n onPageChange: handlePageChange,\n paginationRange,\n }), [page, total, siblings, boundaries, size, variant, color, radius, disabled, loop, handlePageChange, paginationRange])\n\n return (\n <PaginationContext.Provider value={contextValue}>\n <nav\n ref={ref}\n role=\"navigation\"\n aria-label=\"pagination\"\n className={cn('', className)}\n {...props}\n >\n {children ?? (\n <PaginationContent>\n {withEdges && <PaginationItem><PaginationFirst /></PaginationItem>}\n {withControls && <PaginationItem><PaginationPrevious /></PaginationItem>}\n <PaginationItems />\n {withControls && <PaginationItem><PaginationNext /></PaginationItem>}\n {withEdges && <PaginationItem><PaginationLast /></PaginationItem>}\n </PaginationContent>\n )}\n </nav>\n </PaginationContext.Provider>\n )\n }\n)\nPagination.displayName = 'Pagination'\n\n// ─── PaginationContent ───────────────────────────────────\n\nconst PaginationContent = React.forwardRef<HTMLUListElement, React.ComponentPropsWithoutRef<'ul'>>(\n ({ className, ...props }, ref) => {\n const { size } = usePaginationContext()\n const sizeClass = paginationSizeMap[size]\n return (\n <ul\n ref={ref}\n className={cn('flex flex-wrap items-center', sizeClass.gap, className)}\n {...props}\n />\n )\n }\n)\nPaginationContent.displayName = 'PaginationContent'\n\n// ─── PaginationItem ──────────────────────────────────────\n\nconst PaginationItem = React.forwardRef<HTMLLIElement, React.ComponentPropsWithoutRef<'li'>>(\n ({ className, ...props }, ref) => (\n <li ref={ref} className={cn('', className)} {...props} />\n )\n)\nPaginationItem.displayName = 'PaginationItem'\n\n// ─── PaginationLink ──────────────────────────────────────\n\nexport interface PaginationLinkProps extends React.ComponentPropsWithoutRef<'button'> {\n /** Page number this link navigates to */\n page: number\n /** Whether this page is currently active (auto-detected from context if omitted) */\n isActive?: boolean\n}\n\nconst PaginationLink = React.forwardRef<HTMLButtonElement, PaginationLinkProps>(\n ({ className, page: targetPage, isActive: isActiveProp, ...props }, ref) => {\n const ctx = usePaginationContext()\n const isActive = isActiveProp ?? (ctx.page === targetPage)\n const sizeClass = paginationSizeMap[ctx.size]\n\n return (\n <button\n ref={ref}\n type=\"button\"\n aria-current={isActive ? 'page' : undefined}\n aria-label={`Go to page ${targetPage}`}\n disabled={ctx.disabled}\n onClick={() => ctx.onPageChange(targetPage)}\n className={cn(\n paginationItemVariants({ radius: ctx.radius }),\n sizeClass.item,\n getItemClasses(ctx.variant, ctx.color, isActive, ctx.disabled),\n className\n )}\n {...props}\n >\n {targetPage}\n </button>\n )\n }\n)\nPaginationLink.displayName = 'PaginationLink'\n\n// ─── PaginationPrevious ──────────────────────────────────\n\nexport interface PaginationPreviousProps extends React.ComponentPropsWithoutRef<'button'> {\n /** Custom icon */\n icon?: React.ReactNode\n}\n\nconst PaginationPrevious = React.forwardRef<HTMLButtonElement, PaginationPreviousProps>(\n ({ className, icon, ...props }, ref) => {\n const ctx = usePaginationContext()\n const sizeClass = paginationSizeMap[ctx.size]\n const isDisabled = ctx.disabled || (!ctx.loop && ctx.page <= 1)\n\n const handleClick = () => {\n if (ctx.page <= 1) {\n if (ctx.loop) ctx.onPageChange(ctx.total)\n } else {\n ctx.onPageChange(ctx.page - 1)\n }\n }\n\n return (\n <button\n ref={ref}\n type=\"button\"\n aria-label=\"Go to previous page\"\n disabled={isDisabled}\n onClick={handleClick}\n className={cn(\n paginationItemVariants({ radius: ctx.radius }),\n sizeClass.item,\n getItemClasses(ctx.variant, ctx.color, false, isDisabled),\n className\n )}\n {...props}\n >\n {icon ?? <ChevronLeftIcon className={sizeClass.icon} />}\n </button>\n )\n }\n)\nPaginationPrevious.displayName = 'PaginationPrevious'\n\n// ─── PaginationNext ──────────────────────────────────────\n\nexport interface PaginationNextProps extends React.ComponentPropsWithoutRef<'button'> {\n /** Custom icon */\n icon?: React.ReactNode\n}\n\nconst PaginationNext = React.forwardRef<HTMLButtonElement, PaginationNextProps>(\n ({ className, icon, ...props }, ref) => {\n const ctx = usePaginationContext()\n const sizeClass = paginationSizeMap[ctx.size]\n const isDisabled = ctx.disabled || (!ctx.loop && ctx.page >= ctx.total)\n\n const handleClick = () => {\n if (ctx.page >= ctx.total) {\n if (ctx.loop) ctx.onPageChange(1)\n } else {\n ctx.onPageChange(ctx.page + 1)\n }\n }\n\n return (\n <button\n ref={ref}\n type=\"button\"\n aria-label=\"Go to next page\"\n disabled={isDisabled}\n onClick={handleClick}\n className={cn(\n paginationItemVariants({ radius: ctx.radius }),\n sizeClass.item,\n getItemClasses(ctx.variant, ctx.color, false, isDisabled),\n className\n )}\n {...props}\n >\n {icon ?? <ChevronRightIcon className={sizeClass.icon} />}\n </button>\n )\n }\n)\nPaginationNext.displayName = 'PaginationNext'\n\n// ─── PaginationFirst ─────────────────────────────────────\n\nexport interface PaginationFirstProps extends React.ComponentPropsWithoutRef<'button'> {\n /** Custom icon */\n icon?: React.ReactNode\n}\n\nconst PaginationFirst = React.forwardRef<HTMLButtonElement, PaginationFirstProps>(\n ({ className, icon, ...props }, ref) => {\n const ctx = usePaginationContext()\n const sizeClass = paginationSizeMap[ctx.size]\n const isDisabled = ctx.disabled || ctx.page <= 1\n\n return (\n <button\n ref={ref}\n type=\"button\"\n aria-label=\"Go to first page\"\n disabled={isDisabled}\n onClick={() => ctx.onPageChange(1)}\n className={cn(\n paginationItemVariants({ radius: ctx.radius }),\n sizeClass.item,\n getItemClasses(ctx.variant, ctx.color, false, isDisabled),\n className\n )}\n {...props}\n >\n {icon ?? <ChevronsLeftIcon className={sizeClass.icon} />}\n </button>\n )\n }\n)\nPaginationFirst.displayName = 'PaginationFirst'\n\n// ─── PaginationLast ──────────────────────────────────────\n\nexport interface PaginationLastProps extends React.ComponentPropsWithoutRef<'button'> {\n /** Custom icon */\n icon?: React.ReactNode\n}\n\nconst PaginationLast = React.forwardRef<HTMLButtonElement, PaginationLastProps>(\n ({ className, icon, ...props }, ref) => {\n const ctx = usePaginationContext()\n const sizeClass = paginationSizeMap[ctx.size]\n const isDisabled = ctx.disabled || ctx.page >= ctx.total\n\n return (\n <button\n ref={ref}\n type=\"button\"\n aria-label=\"Go to last page\"\n disabled={isDisabled}\n onClick={() => ctx.onPageChange(ctx.total)}\n className={cn(\n paginationItemVariants({ radius: ctx.radius }),\n sizeClass.item,\n getItemClasses(ctx.variant, ctx.color, false, isDisabled),\n className\n )}\n {...props}\n >\n {icon ?? <ChevronsRightIcon className={sizeClass.icon} />}\n </button>\n )\n }\n)\nPaginationLast.displayName = 'PaginationLast'\n\n// ─── PaginationEllipsis ──────────────────────────────────\n\nconst PaginationEllipsis = React.forwardRef<HTMLSpanElement, React.ComponentPropsWithoutRef<'span'>>(\n ({ className, ...props }, ref) => {\n const ctx = usePaginationContext()\n const sizeClass = paginationSizeMap[ctx.size]\n return (\n <span\n ref={ref}\n aria-hidden=\"true\"\n className={cn(\n 'inline-flex items-center justify-center text-text-muted',\n sizeClass.item,\n className\n )}\n {...props}\n >\n <EllipsisIcon className={sizeClass.icon} />\n <span className=\"sr-only\">More pages</span>\n </span>\n )\n }\n)\nPaginationEllipsis.displayName = 'PaginationEllipsis'\n\n// ─── PaginationItems (Convenience) ───────────────────────\n\n// Renders the <li> items straight into PaginationContent's <ul>: a wrapper element\n// between them breaks the list structure for assistive technology (a `display:\n// contents` div used to sit here). The div props and ref stay in the signature for\n// compatibility but have no element to attach to.\nconst PaginationItems = React.forwardRef<HTMLDivElement, React.ComponentPropsWithoutRef<'div'>>(\n (_props, _ref) => {\n const ctx = usePaginationContext()\n return (\n <>\n {ctx.paginationRange.map((item, index) => (\n <PaginationItem key={`${item}-${index}`}>\n {item === 'dots' ? (\n <PaginationEllipsis />\n ) : (\n <PaginationLink page={item} />\n )}\n </PaginationItem>\n ))}\n </>\n )\n }\n)\nPaginationItems.displayName = 'PaginationItems'\n\n// ─── Exports ─────────────────────────────────────────────\nexport {\n Pagination,\n PaginationContent,\n PaginationItem,\n PaginationLink,\n PaginationPrevious,\n PaginationNext,\n PaginationFirst,\n PaginationLast,\n PaginationEllipsis,\n PaginationItems,\n paginationItemVariants,\n paginationSizeMap,\n}\n"],"mappings":"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","names":[]}
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import {
|
|
3
|
-
useFieldContext
|
|
4
|
-
|
|
3
|
+
useFieldContext,
|
|
4
|
+
useFieldControl
|
|
5
|
+
} from "./chunk-T5A4APEL.mjs";
|
|
5
6
|
import {
|
|
6
7
|
cn
|
|
7
8
|
} from "./chunk-53MIUPSY.mjs";
|
|
@@ -80,7 +81,9 @@ var Checkbox = React.forwardRef(({ className, size, radius, weight, color = "def
|
|
|
80
81
|
const resolvedSize = size || "default";
|
|
81
82
|
const resolvedDisabled = disabled ?? fieldContext?.disabled;
|
|
82
83
|
const generatedId = React.useId();
|
|
83
|
-
const
|
|
84
|
+
const hasOwnLabel = Boolean(label);
|
|
85
|
+
const checkboxId = id ?? (hasOwnLabel ? generatedId : fieldContext?.id ?? generatedId);
|
|
86
|
+
useFieldControl(hasOwnLabel ? "group" : "single", Boolean(fieldContext) && (hasOwnLabel || !id));
|
|
84
87
|
const checkbox = /* @__PURE__ */ React.createElement(
|
|
85
88
|
CheckboxPrimitive.Root,
|
|
86
89
|
{
|
|
@@ -142,4 +145,4 @@ export {
|
|
|
142
145
|
checkboxVariants,
|
|
143
146
|
Checkbox
|
|
144
147
|
};
|
|
145
|
-
//# sourceMappingURL=chunk-
|
|
148
|
+
//# sourceMappingURL=chunk-HS2VRYSX.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/ui/checkbox.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport * as CheckboxPrimitive from '@radix-ui/react-checkbox'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { cn } from '@/lib/utils'\nimport { useFieldContext, useFieldControl } from './field'\n\n// Color maps for checked/indeterminate state\nconst checkboxColorMap = {\n default: 'data-[state=checked]:bg-foreground data-[state=checked]:border-foreground data-[state=checked]:text-background data-[state=indeterminate]:bg-foreground data-[state=indeterminate]:border-foreground data-[state=indeterminate]:text-background',\n primary: 'data-[state=checked]:bg-primary data-[state=checked]:border-primary data-[state=checked]:text-primary-foreground data-[state=indeterminate]:bg-primary data-[state=indeterminate]:border-primary data-[state=indeterminate]:text-primary-foreground',\n} as const\n\nexport type CheckboxColor = keyof typeof checkboxColorMap\n\n// Checkbox box variants\nconst checkboxVariants = cva(\n [\n 'peer relative shrink-0 border-border hover:border-border-strong transition-all duration-micro ease-out',\n 'focus-visible:focus-ring',\n 'disabled:cursor-not-allowed disabled:opacity-50',\n // Transparent hit area expansion via ::after\n \"after:absolute after:content-['']\",\n ].join(' '),\n {\n variants: {\n size: {\n sm: 'w-3.5 h-3.5 after:-inset-[5px]', // 14px box → 24px click\n default: 'w-4 h-4 after:-inset-2', // 16px box → 32px click\n lg: 'w-5 h-5 after:-inset-2', // 20px box → 36px click\n },\n radius: {\n none: 'rounded-none', // 0px — sharp square\n sm: 'rounded-sm', // 2px — default checkbox style\n md: 'rounded', // 4px — softer corners\n },\n weight: {\n thin: 'border', // 1px\n bold: 'border-2', // 2px\n },\n },\n defaultVariants: {\n size: 'default',\n radius: 'sm',\n weight: 'bold',\n },\n }\n)\n\n// Check icon sizes per checkbox size\nconst checkIconSizes = {\n sm: 'w-2.5 h-2.5', // 10px in 14px box\n default: 'w-3 h-3', // 12px in 16px box\n lg: 'icon-xs', // 14px in 20px box\n}\n\n// Label font sizes per checkbox size\nconst labelSizes = {\n sm: 'text-xs', // 12px\n default: 'text-md', // 14px\n lg: 'text-base', // 16px\n}\n\n// Gap between checkbox and label\nconst gapSizes = {\n sm: 'gap-1.5',\n default: 'gap-2',\n lg: 'gap-2.5',\n}\n\nexport interface CheckboxProps\n extends Omit<React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root>, 'children'>,\n VariantProps<typeof checkboxVariants> {\n /** Checked state color */\n color?: CheckboxColor\n label?: string\n radius?: 'none' | 'sm' | 'md'\n}\n\nconst Checkbox = React.forwardRef<\n React.ElementRef<typeof CheckboxPrimitive.Root>,\n CheckboxProps\n>(({ className, size, radius, weight, color = 'default', label, disabled, id, ...props }, ref) => {\n const fieldContext = useFieldContext()\n const resolvedSize = size || 'default'\n const resolvedDisabled = disabled ?? fieldContext?.disabled\n const generatedId = React.useId()\n // With its own label the checkbox is one item of a group: keep a unique id. Only a\n // bare checkbox labelled by FieldLabel takes the Field id.\n const hasOwnLabel = Boolean(label)\n const checkboxId = id ?? (hasOwnLabel ? generatedId : fieldContext?.id ?? generatedId)\n useFieldControl(hasOwnLabel ? 'group' : 'single', Boolean(fieldContext) && (hasOwnLabel || !id))\n\n const checkbox = (\n <CheckboxPrimitive.Root\n ref={ref}\n id={checkboxId}\n disabled={resolvedDisabled}\n className={cn(\n checkboxVariants({ size, radius, weight }),\n checkboxColorMap[color],\n className\n )}\n {...props}\n >\n <CheckboxPrimitive.Indicator className=\"flex items-center justify-center animate-checkbox-enter\">\n <CheckIcon className={checkIconSizes[resolvedSize]} />\n </CheckboxPrimitive.Indicator>\n </CheckboxPrimitive.Root>\n )\n\n if (!label) return checkbox\n\n return (\n <div className={cn('group flex items-center', gapSizes[resolvedSize])}>\n <div className=\"flex items-center\">\n {checkbox}\n </div>\n <label\n htmlFor={checkboxId}\n className={cn(\n labelSizes[resolvedSize],\n 'text-text-muted cursor-pointer select-none transition-colors duration-micro',\n 'group-hover:text-foreground',\n resolvedDisabled && 'opacity-50 cursor-not-allowed'\n )}\n >\n {label}\n </label>\n </div>\n )\n})\nCheckbox.displayName = 'Checkbox'\n\n// Check icon — renders ✓ for checked, — for indeterminate\nfunction CheckIcon({ className }: { className?: string }) {\n return (\n <>\n {/* Check mark (shown when data-state=checked on parent Indicator) */}\n <svg\n className={cn(className, 'hidden [[data-state=checked]_&]:block')}\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n strokeWidth={3}\n aria-hidden=\"true\"\n >\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M5 13l4 4L19 7\" />\n </svg>\n {/* Dash (shown when data-state=indeterminate on parent Indicator) */}\n <svg\n className={cn(className, 'hidden [[data-state=indeterminate]_&]:block')}\n fill=\"none\"\n viewBox=\"0 0 24 24\"\n stroke=\"currentColor\"\n strokeWidth={3}\n aria-hidden=\"true\"\n >\n <path strokeLinecap=\"round\" strokeLinejoin=\"round\" d=\"M5 12h14\" />\n </svg>\n </>\n )\n}\n\nexport { Checkbox, checkboxVariants }\n"],"mappings":"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","names":[]}
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import {
|
|
3
|
-
useFieldContext
|
|
4
|
-
|
|
3
|
+
useFieldContext,
|
|
4
|
+
useFieldControl
|
|
5
|
+
} from "./chunk-T5A4APEL.mjs";
|
|
5
6
|
import {
|
|
6
7
|
cn
|
|
7
8
|
} from "./chunk-53MIUPSY.mjs";
|
|
@@ -83,6 +84,7 @@ var Textarea = React.forwardRef(
|
|
|
83
84
|
const resolvedError = error ?? fieldContext?.error;
|
|
84
85
|
const resolvedState = resolvedError ? "error" : state;
|
|
85
86
|
const textareaId = id ?? fieldContext?.id;
|
|
87
|
+
useFieldControl("single", Boolean(fieldContext) && !id);
|
|
86
88
|
const isDisabled = props.disabled ?? fieldContext?.disabled;
|
|
87
89
|
const pointerRef = React.useRef(false);
|
|
88
90
|
const windowBlurredRef = React.useRef(false);
|
|
@@ -150,4 +152,4 @@ export {
|
|
|
150
152
|
textareaVariants,
|
|
151
153
|
Textarea
|
|
152
154
|
};
|
|
153
|
-
//# sourceMappingURL=chunk-
|
|
155
|
+
//# sourceMappingURL=chunk-IHHI3LIN.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/ui/textarea.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { cn } from '@/lib/utils'\nimport { useFieldContext, useFieldControl } from './field'\n\nconst textareaVariants = cva(\n [\n 'flex w-full bg-background text-foreground placeholder:text-foreground/30',\n 'border transition-colors duration-micro outline-transparent',\n 'focus:[outline:2px_solid_transparent]',\n 'disabled:cursor-not-allowed disabled:opacity-50 disabled:bg-background-muted',\n ].join(' '),\n {\n variants: {\n variant: {\n default: 'border-border hover:border-border-strong',\n filled: 'border-transparent bg-background-muted',\n },\n focusRing: {\n true: '',\n false: '',\n },\n size: {\n compact: 'px-3 py-2 text-md', // 12px padding / 14px font - compact spaces\n default: 'px-4 py-3 text-base', // 16px padding / 16px font - standard\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-3xl', // rounded-full looks unnatural on textarea, using 3xl instead\n },\n resize: {\n none: 'resize-none',\n vertical: 'resize-y',\n horizontal: 'resize-x',\n both: 'resize',\n },\n state: {\n default: '',\n error: 'border-error hover:border-error focus:border-error shadow-[0_0_0_2px_var(--color-focus-ring-error)]',\n },\n },\n compoundVariants: [\n // focusRing: true → show custom focus ring\n { focusRing: true, className: 'focus-visible:shadow-[0_0_0_2px_var(--color-focus-ring)]' },\n // focusRing: false → keep same state as hover\n { variant: 'default', focusRing: false, className: 'focus:border-border-strong' },\n // filled + error\n {\n variant: 'filled',\n state: 'error',\n className: 'border-transparent hover:border-transparent focus:border-transparent bg-[var(--color-error-bg)] hover:bg-[var(--color-error-bg)] focus:bg-[var(--color-error-bg)] shadow-none',\n },\n ],\n defaultVariants: {\n variant: 'default',\n size: 'default',\n radius: 'default',\n resize: 'vertical',\n state: 'default',\n focusRing: false,\n },\n }\n)\n\nexport interface TextareaProps\n extends Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, 'size'>,\n VariantProps<typeof textareaVariants> {\n error?: boolean\n focusRing?: boolean\n}\n\nconst Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(\n ({ className, variant, size, radius, resize, state, error, focusRing, id, rows = 4, onPointerDown, onFocus, onBlur, ...props }, ref) => {\n const fieldContext = useFieldContext()\n const resolvedError = error ?? fieldContext?.error\n const resolvedState = resolvedError ? 'error' : state\n const textareaId = id ?? fieldContext?.id\n useFieldControl('single', Boolean(fieldContext) && !id)\n const isDisabled = props.disabled ?? fieldContext?.disabled\n\n // Keyboard focus detection (when focusRing: false, auto-show ring on Tab navigation)\n const pointerRef = React.useRef(false)\n const windowBlurredRef = React.useRef(false)\n const [keyboardFocus, setKeyboardFocus] = React.useState(false)\n\n // Track window blur/focus to distinguish Tab navigation from window re-activation\n React.useEffect(() => {\n const onBlur = () => { windowBlurredRef.current = true }\n const onFocus = () => { requestAnimationFrame(() => { windowBlurredRef.current = false }) }\n window.addEventListener('blur', onBlur)\n window.addEventListener('focus', onFocus)\n return () => { window.removeEventListener('blur', onBlur); window.removeEventListener('focus', onFocus) }\n }, [])\n\n const handlePointerDown = React.useCallback((e: React.PointerEvent<HTMLTextAreaElement>) => {\n pointerRef.current = true\n onPointerDown?.(e)\n }, [onPointerDown])\n\n const handleFocus = React.useCallback((e: React.FocusEvent<HTMLTextAreaElement>) => {\n if (!pointerRef.current && !focusRing && !windowBlurredRef.current) {\n setKeyboardFocus(true)\n }\n pointerRef.current = false\n onFocus?.(e)\n }, [focusRing, onFocus])\n\n const handleBlur = React.useCallback((e: React.FocusEvent<HTMLTextAreaElement>) => {\n setKeyboardFocus(false)\n pointerRef.current = false\n onBlur?.(e)\n }, [onBlur])\n\n // Build aria-describedby from context\n const ariaDescribedBy = fieldContext\n ? [\n resolvedError ? `${fieldContext.id}-error` : null,\n ]\n .filter(Boolean)\n .join(' ') || undefined\n : undefined\n\n return (\n <textarea\n id={textareaId}\n rows={rows}\n className={cn(\n textareaVariants({ variant, size, radius, resize, state: resolvedState, focusRing }),\n keyboardFocus && 'shadow-[0_0_0_2px_var(--color-focus-ring)]',\n className\n )}\n aria-invalid={resolvedError || undefined}\n aria-describedby={ariaDescribedBy}\n disabled={isDisabled}\n ref={ref}\n onPointerDown={handlePointerDown}\n onFocus={handleFocus}\n onBlur={handleBlur}\n {...props}\n />\n )\n }\n)\nTextarea.displayName = 'Textarea'\n\nexport { Textarea, textareaVariants }\n"],"mappings":"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","names":["onBlur","onFocus"]}
|
|
@@ -1,4 +1,8 @@
|
|
|
1
1
|
"use client";
|
|
2
|
+
import {
|
|
3
|
+
useFieldContext,
|
|
4
|
+
useFieldControl
|
|
5
|
+
} from "./chunk-T5A4APEL.mjs";
|
|
2
6
|
import {
|
|
3
7
|
cn
|
|
4
8
|
} from "./chunk-53MIUPSY.mjs";
|
|
@@ -51,8 +55,11 @@ var sliderColorMap = {
|
|
|
51
55
|
thumbActive: "active:shadow-[0_0_0_6px_color-mix(in_srgb,var(--color-primary)_16%,transparent)]"
|
|
52
56
|
}
|
|
53
57
|
};
|
|
54
|
-
var Slider = React.forwardRef(({ className, size, color = "default", value, defaultValue, onValueChange, showTooltip = "never", formatLabel, startContent, endContent, orientation, ...props }, ref) => {
|
|
58
|
+
var Slider = React.forwardRef(({ className, size, color = "default", value, defaultValue, onValueChange, showTooltip = "never", formatLabel, startContent, endContent, orientation, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, ...props }, ref) => {
|
|
55
59
|
const resolvedSize = size || "default";
|
|
60
|
+
const fieldContext = useFieldContext();
|
|
61
|
+
useFieldControl("labelled", Boolean(fieldContext));
|
|
62
|
+
const thumbLabelledBy = ariaLabelledBy ?? (!ariaLabel && fieldContext?.hasLabel ? fieldContext.labelId : void 0);
|
|
56
63
|
const thumbCount = value?.length ?? defaultValue?.length ?? 1;
|
|
57
64
|
const hasTooltip = showTooltip !== "never";
|
|
58
65
|
const hasWrapper = !!(startContent || endContent);
|
|
@@ -105,6 +112,8 @@ var Slider = React.forwardRef(({ className, size, color = "default", value, defa
|
|
|
105
112
|
SliderPrimitive.Thumb,
|
|
106
113
|
{
|
|
107
114
|
key: i,
|
|
115
|
+
"aria-label": ariaLabel,
|
|
116
|
+
"aria-labelledby": thumbLabelledBy,
|
|
108
117
|
className: cn(
|
|
109
118
|
"group/thumb block rounded-full border-2 shadow-sm",
|
|
110
119
|
sliderColorMap[color].thumb,
|
|
@@ -147,4 +156,4 @@ export {
|
|
|
147
156
|
sliderVariants,
|
|
148
157
|
Slider
|
|
149
158
|
};
|
|
150
|
-
//# sourceMappingURL=chunk-
|
|
159
|
+
//# sourceMappingURL=chunk-IJ2FZ3L5.mjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/ui/slider.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport * as SliderPrimitive from '@radix-ui/react-slider'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { cn } from '@/lib/utils'\nimport { useFieldContext, useFieldControl } from './field'\n\n// Slider root variants\nconst sliderVariants = cva(\n 'relative flex touch-none select-none',\n {\n variants: {\n size: {\n sm: '',\n default: '',\n lg: '',\n },\n },\n defaultVariants: {\n size: 'default',\n },\n }\n)\n\n// Track sizes per orientation\nconst trackSizes = {\n sm: 'h-1 data-[orientation=vertical]:h-auto data-[orientation=vertical]:w-1',\n default: 'h-1.5 data-[orientation=vertical]:h-auto data-[orientation=vertical]:w-1.5',\n lg: 'h-2 data-[orientation=vertical]:h-auto data-[orientation=vertical]:w-2',\n}\n\n// Thumb sizes\nconst thumbSizes = {\n sm: 'w-[var(--component-slider-thumb-sm)] h-[var(--component-slider-thumb-sm)]',\n default: 'w-[var(--component-slider-thumb-default)] h-[var(--component-slider-thumb-default)]',\n lg: 'w-[var(--component-slider-thumb-lg)] h-[var(--component-slider-thumb-lg)]',\n}\n\n// Content font sizes (for startContent / endContent)\nconst contentSizes = {\n sm: 'text-xs',\n default: 'text-sm',\n lg: 'text-base',\n}\n\n// Color maps for range and thumb\nconst sliderColorMap = {\n default: {\n range: 'bg-foreground',\n thumb: 'bg-background border-foreground',\n thumbHover: 'hover:shadow-[0_0_0_4px_color-mix(in_srgb,var(--color-text)_16%,transparent)] hover:border-foreground',\n thumbActive: 'active:shadow-[0_0_0_6px_color-mix(in_srgb,var(--color-text)_16%,transparent)]',\n },\n primary: {\n range: 'bg-primary',\n thumb: 'bg-primary-foreground border-primary',\n thumbHover: 'hover:shadow-primary-glow hover:border-primary-hover',\n thumbActive: 'active:shadow-[0_0_0_6px_color-mix(in_srgb,var(--color-primary)_16%,transparent)]',\n },\n} as const\n\nexport type SliderColor = keyof typeof sliderColorMap\n\nexport interface SliderProps\n extends React.ComponentPropsWithoutRef<typeof SliderPrimitive.Root>,\n VariantProps<typeof sliderVariants> {\n /** Track and thumb color */\n color?: SliderColor\n /** Tooltip display mode: auto (hover/drag), always, never */\n showTooltip?: 'auto' | 'always' | 'never'\n /** Custom formatter for tooltip value */\n formatLabel?: (value: number) => string\n /** Content to display before the slider (icon, label, etc.) */\n startContent?: React.ReactNode\n /** Content to display after the slider */\n endContent?: React.ReactNode\n}\n\nconst Slider = React.forwardRef<\n React.ElementRef<typeof SliderPrimitive.Root>,\n SliderProps\n>(({ className, size, color = 'default', value, defaultValue, onValueChange, showTooltip = 'never', formatLabel, startContent, endContent, orientation, 'aria-label': ariaLabel, 'aria-labelledby': ariaLabelledBy, ...props }, ref) => {\n const resolvedSize = size || 'default'\n // The thumbs carry role=\"slider\", so the accessible name goes on them, not on the\n // Root. Inside a Field the FieldLabel names the slider unless a name is given.\n const fieldContext = useFieldContext()\n useFieldControl('labelled', Boolean(fieldContext))\n const thumbLabelledBy = ariaLabelledBy ?? (!ariaLabel && fieldContext?.hasLabel ? fieldContext.labelId : undefined)\n const thumbCount = value?.length ?? defaultValue?.length ?? 1\n const hasTooltip = showTooltip !== 'never'\n const hasWrapper = !!(startContent || endContent)\n const isVertical = orientation === 'vertical'\n\n // Track value internally for tooltip display\n const [internalValue, setInternalValue] = React.useState(\n () => value ?? defaultValue ?? Array(thumbCount).fill(props.min ?? 0)\n )\n const displayValues = value ?? internalValue\n\n const handleValueChange = React.useCallback((newValue: number[]) => {\n setInternalValue(newValue)\n onValueChange?.(newValue)\n }, [onValueChange])\n\n const sliderRoot = (\n <SliderPrimitive.Root\n ref={ref}\n className={cn(\n sliderVariants({ size }),\n isVertical\n ? 'h-full w-auto flex-col items-center'\n : 'w-full items-center',\n hasWrapper && (isVertical ? 'flex-1 min-h-0' : 'flex-1 min-w-0'),\n !hasWrapper && className\n )}\n value={value}\n defaultValue={defaultValue}\n onValueChange={hasTooltip ? handleValueChange : onValueChange}\n orientation={orientation}\n {...props}\n >\n <SliderPrimitive.Track\n className={cn(\n 'relative grow overflow-hidden rounded-full bg-border',\n isVertical ? 'h-full' : 'w-full',\n trackSizes[resolvedSize]\n )}\n >\n <SliderPrimitive.Range\n className={cn(\n 'absolute rounded-full', sliderColorMap[color].range,\n isVertical\n ? 'w-full transition-[top,bottom] duration-fast ease-out'\n : 'h-full transition-[left,right] duration-fast ease-out'\n )}\n />\n </SliderPrimitive.Track>\n {Array.from({ length: thumbCount }).map((_, i) => (\n <SliderPrimitive.Thumb\n key={i}\n aria-label={ariaLabel}\n aria-labelledby={thumbLabelledBy}\n className={cn(\n 'group/thumb block rounded-full border-2 shadow-sm', sliderColorMap[color].thumb,\n isVertical\n ? 'transition-[top,box-shadow,border-color] duration-fast ease-out'\n : 'transition-[left,box-shadow,border-color] duration-fast ease-out',\n sliderColorMap[color].thumbHover,\n sliderColorMap[color].thumbActive,\n 'focus-visible:focus-ring',\n 'disabled:pointer-events-none disabled:opacity-50',\n thumbSizes[resolvedSize]\n )}\n >\n {hasTooltip && (\n <div\n className={cn(\n 'absolute pointer-events-none',\n 'transition-all duration-fast ease-out',\n isVertical\n ? 'right-full top-1/2 -translate-y-1/2 mr-2 origin-right'\n : 'bottom-full left-1/2 -translate-x-1/2 mb-2 origin-bottom',\n showTooltip === 'always'\n ? 'opacity-100 scale-100'\n : [\n 'opacity-0 scale-95',\n 'group-hover/thumb:opacity-100 group-hover/thumb:scale-100',\n 'group-active/thumb:opacity-100 group-active/thumb:scale-100',\n 'group-focus-visible/thumb:opacity-100 group-focus-visible/thumb:scale-100',\n ]\n )}\n >\n <div className=\"relative bg-foreground text-background text-xs font-semibold font-mono tabular-nums px-2.5 py-1 rounded-md shadow-lg whitespace-nowrap\">\n {formatLabel ? formatLabel(displayValues[i]) : displayValues[i]}\n {/* Arrow */}\n {isVertical ? (\n <div className=\"absolute left-full top-1/2 -translate-y-1/2 border-4 border-transparent border-l-foreground\" />\n ) : (\n <div className=\"absolute top-full left-1/2 -translate-x-1/2 border-4 border-transparent border-t-foreground\" />\n )}\n </div>\n </div>\n )}\n </SliderPrimitive.Thumb>\n ))}\n </SliderPrimitive.Root>\n )\n\n if (!hasWrapper) return sliderRoot\n\n return (\n <div className={cn(\n isVertical ? 'inline-flex flex-col items-center gap-2 h-full' : 'flex items-center gap-3',\n className\n )}>\n {startContent && (\n <span className={cn('shrink-0 text-text-muted select-none', contentSizes[resolvedSize], props.disabled && 'opacity-50')}>\n {startContent}\n </span>\n )}\n {sliderRoot}\n {endContent && (\n <span className={cn('shrink-0 text-text-muted select-none', contentSizes[resolvedSize], props.disabled && 'opacity-50')}>\n {endContent}\n </span>\n )}\n </div>\n )\n})\nSlider.displayName = 'Slider'\n\nexport { Slider, sliderVariants }\n"],"mappings":"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","names":[]}
|
|
@@ -1,4 +1,8 @@
|
|
|
1
1
|
"use client";
|
|
2
|
+
import {
|
|
3
|
+
useFieldContext,
|
|
4
|
+
useFieldControl
|
|
5
|
+
} from "./chunk-T5A4APEL.mjs";
|
|
2
6
|
import {
|
|
3
7
|
cn
|
|
4
8
|
} from "./chunk-53MIUPSY.mjs";
|
|
@@ -110,16 +114,23 @@ var SelectStyleContext = React.createContext({ contentRadius: "xl", itemSize: "m
|
|
|
110
114
|
var Select = ({
|
|
111
115
|
size = "default",
|
|
112
116
|
radius = "default",
|
|
117
|
+
disabled,
|
|
113
118
|
...props
|
|
114
|
-
}) =>
|
|
119
|
+
}) => {
|
|
120
|
+
const fieldContext = useFieldContext();
|
|
121
|
+
return /* @__PURE__ */ React.createElement(SelectRootContext.Provider, { value: { size, radius } }, /* @__PURE__ */ React.createElement(SelectPrimitive.Root, { disabled: disabled ?? fieldContext?.disabled, ...props }));
|
|
122
|
+
};
|
|
115
123
|
var SelectValue = SelectPrimitive.Value;
|
|
116
124
|
var SelectGroup = SelectPrimitive.Group;
|
|
117
|
-
var SelectTrigger = React.forwardRef(({ className, children, ...props }, ref) => {
|
|
125
|
+
var SelectTrigger = React.forwardRef(({ className, children, id, ...props }, ref) => {
|
|
118
126
|
const { size, radius } = React.useContext(SelectRootContext);
|
|
127
|
+
const fieldContext = useFieldContext();
|
|
128
|
+
useFieldControl("single", Boolean(fieldContext) && !id);
|
|
119
129
|
return /* @__PURE__ */ React.createElement(
|
|
120
130
|
SelectPrimitive.Trigger,
|
|
121
131
|
{
|
|
122
132
|
ref,
|
|
133
|
+
id: id ?? fieldContext?.id,
|
|
123
134
|
className: cn(
|
|
124
135
|
"flex w-full items-center justify-between bg-background text-foreground hover:bg-background-muted",
|
|
125
136
|
"border border-border",
|
|
@@ -269,4 +280,4 @@ export {
|
|
|
269
280
|
SelectLabel,
|
|
270
281
|
SelectSeparator
|
|
271
282
|
};
|
|
272
|
-
//# sourceMappingURL=chunk-
|
|
283
|
+
//# sourceMappingURL=chunk-L55ABE4H.mjs.map
|