shadcn-glass-ui 2.1.5 → 2.2.0
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/CHANGELOG.md +51 -0
- package/README.md +11 -11
- package/context7.json +14 -3
- package/dist/cli/index.cjs +1 -1
- package/dist/components.cjs +4 -4
- package/dist/components.d.ts +18 -4
- package/dist/components.js +1 -1
- package/dist/hooks.cjs +2 -2
- package/dist/index.cjs +2320 -997
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +2284 -996
- package/dist/index.js.map +1 -1
- package/dist/shadcn-glass-ui.css +1 -1
- package/dist/{theme-context-Y98bGvcm.cjs → theme-context-D_cb9KzA.cjs} +2 -2
- package/dist/{theme-context-Y98bGvcm.cjs.map → theme-context-D_cb9KzA.cjs.map} +1 -1
- package/dist/themes.cjs +1 -1
- package/dist/{trust-score-card-glass-2rjz00d_.cjs → trust-score-card-glass-CTsEVRD3.cjs} +178 -35
- package/dist/{trust-score-card-glass-2rjz00d_.cjs.map → trust-score-card-glass-CTsEVRD3.cjs.map} +1 -1
- package/dist/{trust-score-card-glass-zjkx4OC2.js → trust-score-card-glass-CUStm4o_.js} +86 -15
- package/dist/{trust-score-card-glass-zjkx4OC2.js.map → trust-score-card-glass-CUStm4o_.js.map} +1 -1
- package/dist/{use-focus-DbpBEuee.cjs → use-focus--Hw2nevi.cjs} +2 -2
- package/dist/{use-focus-DbpBEuee.cjs.map → use-focus--Hw2nevi.cjs.map} +1 -1
- package/dist/{use-wallpaper-tint-DbawS9zh.cjs → use-wallpaper-tint-B4oMQsXQ.cjs} +2 -2
- package/dist/{use-wallpaper-tint-DbawS9zh.cjs.map → use-wallpaper-tint-B4oMQsXQ.cjs.map} +1 -1
- package/dist/{utils-XlyXIhuP.cjs → utils-BqeJ4aco.cjs} +2 -2
- package/dist/{utils-XlyXIhuP.cjs.map → utils-BqeJ4aco.cjs.map} +1 -1
- package/dist/utils.cjs +1 -1
- package/package.json +4 -2
package/dist/index.js
CHANGED
|
@@ -1,16 +1,18 @@
|
|
|
1
|
-
import { $ as BaseProgressGlass, $t as
|
|
1
|
+
import { $ as BaseProgressGlass, $t as DropdownMenuGlassShortcut, A as useChartHeight, An as InteractiveCard, At as notificationVariants, B as adaptEventsOfChild, Bt as GlassCardTitle, C as sparklineContainerVariants, Cn as AvatarGlassImage, Ct as skeletonVariants, D as Tooltip, Dn as AlertGlass, Dt as PopoverGlassLegacy, E as Cell, En as statusSizes, Et as PopoverGlassContent, F as selectLegendPayload, Ft as GlassCardAction, G as SegmentedControlGlass, Gt as DropdownMenuGlassContent, H as isNumber, Ht as DropdownGlass, I as useAppDispatch, It as GlassCardContent, J as progressSizes, Jt as DropdownMenuGlassLabel, K as RainbowProgressGlass, Kt as DropdownMenuGlassGroup, L as useAppSelector, Lt as GlassCardDescription, M as useMargin, Mn as TouchTarget, Mt as modalSizes, N as ResponsiveContainer, Nn as alertVariants, Nt as InputGlass, O as setLegendSettings, On as AlertGlassDescription, Ot as PopoverGlassTrigger, P as useElementOffset, Pt as GlassCard, Q as StatusIndicatorGlass, Qt as DropdownMenuGlassSeparator, R as getUniqPayload, Rt as GlassCardFooter, S as sparklineBarVariants, Sn as AvatarGlassFallback, St as SkeletonGlass, T as Bar, Tn as avatarSizes, Tt as PopoverGlassAnchor, U as useLegendPortal, Ut as DropdownMenuGlass, V as Symbols, Vt as cardIntensity, W as Surface, Wt as DropdownMenuGlassCheckboxItem, X as LanguageBarGlass, Xt as DropdownMenuGlassRadioGroup, Y as ProfileAvatarGlass, Yt as DropdownMenuGlassPortal, Z as FlagAlertGlass, Zt as DropdownMenuGlassRadioItem, _ as ContributionMetricsGlass, _n as ButtonGlass, _t as SliderGlass, a as HeaderBrandingGlass, an as inputVariants, at as insightCardVariants, b as AICardGlass, bn as badgeVariants, bt as useDirection, c as YearCardGlass, cn as Presence, ct as ExpandableHeaderGlass, d as TrustScoreDisplayGlass, dn as useLayoutEffect2, dt as TooltipGlassProvider, en as DropdownMenuGlassSub, et as ThemeToggleGlass, f as RepositoryMetadataGlass, fn as useCallbackRef, ft as TooltipGlassSimple, g as MetricCardGlass, gn as CheckboxGlass, gt as TabsGlass, h as MetricsGridGlass, hn as CircularProgressGlass, ht as toggleSizes, i as HeaderNavGlass, in as ComboBoxGlass, it as InsightCardGlass, j as useChartWidth, jn as FormFieldWrapper, jt as ModalGlass, k as setLegendSize, kn as AlertGlassTitle, kt as NotificationGlass, l as UserStatsLineGlass, ln as useSize, lt as TooltipGlass, m as RepositoryCardGlass, mn as composeEventHandlers, mt as ToggleGlass, n as ProjectsListGlass, nn as DropdownMenuGlassSubTrigger, nt as SortDropdownGlass, o as FlagsSectionGlass, on as Primitive$3, ot as insightVariantConfig, p as RepositoryHeaderGlass, pn as useComposedRefs, pt as TooltipGlassTrigger, q as ProgressGlass, qt as DropdownMenuGlassItem, r as ProfileHeaderGlass, rn as DropdownMenuGlassTrigger, rt as SearchBoxGlass, s as CareerStatsGlass, sn as useControllableState, st as IconButtonGlass, t as TrustScoreCardGlass, tn as DropdownMenuGlassSubContent, tt as StatItemGlass, u as UserInfoGlass, un as useId$1, ut as TooltipGlassContent, v as CircularMetricGlass, vn as buttonGlassVariants, vt as createCollection, w as BarChart, wn as AvatarGlassSimple, wt as PopoverGlass, x as SparklineGlass, xn as AvatarGlass, xt as clamp, y as CareerStatsHeaderGlass, yn as BadgeGlass, yt as usePrevious, z as resolveDefaultProps, zt as GlassCardHeader } from "./trust-score-card-glass-CUStm4o_.js";
|
|
2
2
|
import { t as cn } from "./utils-CcyeqpKQ.js";
|
|
3
3
|
import { n as useHover, t as useFocus } from "./use-focus-CX0TJJIj.js";
|
|
4
4
|
import { a as getThemeConfig, i as getNextTheme, n as THEME_CONFIG, o as useTheme, r as ThemeProvider, t as THEMES } from "./theme-context-_T5r1KG4.js";
|
|
5
5
|
import { n as useResponsive, t as useWallpaperTint } from "./use-wallpaper-tint-DUgmytlY.js";
|
|
6
6
|
import * as React$1 from "react";
|
|
7
|
-
import { createContext, forwardRef, useCallback, useContext, useEffect, useId, useLayoutEffect, useMemo, useRef, useState } from "react";
|
|
8
|
-
import { Check, ChevronDown, Menu, PanelLeft, PanelLeftClose, PanelLeftOpen, X } from "lucide-react";
|
|
7
|
+
import React, { createContext, forwardRef, useCallback, useContext, useEffect, useId, useLayoutEffect, useMemo, useRef, useState } from "react";
|
|
8
|
+
import { Check, ChevronDown, Circle, Menu, PanelLeft, PanelLeftClose, PanelLeftOpen, X } from "lucide-react";
|
|
9
9
|
import { clsx } from "clsx";
|
|
10
10
|
import { cva } from "class-variance-authority";
|
|
11
11
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
12
12
|
import { Slot, createSlot } from "@radix-ui/react-slot";
|
|
13
13
|
import { createPortal } from "react-dom";
|
|
14
|
+
import * as DialogPrimitive from "@radix-ui/react-dialog";
|
|
15
|
+
import { Toggle } from "@radix-ui/react-toggle";
|
|
14
16
|
const stepperRootVariants = cva("flex w-full", {
|
|
15
17
|
variants: { orientation: {
|
|
16
18
|
horizontal: "flex-col",
|
|
@@ -371,63 +373,662 @@ const StepperGlass = {
|
|
|
371
373
|
Step: StepperStep,
|
|
372
374
|
Content: StepperContent
|
|
373
375
|
};
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
|
|
376
|
+
function createContextScope$3(scopeName, createContextScopeDeps = []) {
|
|
377
|
+
let defaultContexts = [];
|
|
378
|
+
function createContext3(rootComponentName, defaultContext) {
|
|
379
|
+
const BaseContext = React$1.createContext(defaultContext);
|
|
380
|
+
const index = defaultContexts.length;
|
|
381
|
+
defaultContexts = [...defaultContexts, defaultContext];
|
|
382
|
+
const Provider = (props) => {
|
|
383
|
+
const { scope, children, ...context } = props;
|
|
384
|
+
const Context = scope?.[scopeName]?.[index] || BaseContext;
|
|
385
|
+
const value = React$1.useMemo(() => context, Object.values(context));
|
|
386
|
+
return /* @__PURE__ */ jsx(Context.Provider, {
|
|
387
|
+
value,
|
|
388
|
+
children
|
|
389
|
+
});
|
|
390
|
+
};
|
|
391
|
+
Provider.displayName = rootComponentName + "Provider";
|
|
392
|
+
function useContext2(consumerName, scope) {
|
|
393
|
+
const Context = scope?.[scopeName]?.[index] || BaseContext;
|
|
394
|
+
const context = React$1.useContext(Context);
|
|
395
|
+
if (context) return context;
|
|
396
|
+
if (defaultContext !== void 0) return defaultContext;
|
|
397
|
+
throw new Error(`\`${consumerName}\` must be used within \`${rootComponentName}\``);
|
|
398
|
+
}
|
|
399
|
+
return [Provider, useContext2];
|
|
400
|
+
}
|
|
401
|
+
const createScope = () => {
|
|
402
|
+
const scopeContexts = defaultContexts.map((defaultContext) => {
|
|
403
|
+
return React$1.createContext(defaultContext);
|
|
404
|
+
});
|
|
405
|
+
return function useScope(scope) {
|
|
406
|
+
const contexts = scope?.[scopeName] || scopeContexts;
|
|
407
|
+
return React$1.useMemo(() => ({ [`__scope${scopeName}`]: {
|
|
408
|
+
...scope,
|
|
409
|
+
[scopeName]: contexts
|
|
410
|
+
} }), [scope, contexts]);
|
|
411
|
+
};
|
|
412
|
+
};
|
|
413
|
+
createScope.scopeName = scopeName;
|
|
414
|
+
return [createContext3, composeContextScopes$4(createScope, ...createContextScopeDeps)];
|
|
382
415
|
}
|
|
383
|
-
|
|
384
|
-
const
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
|
|
416
|
+
function composeContextScopes$4(...scopes) {
|
|
417
|
+
const baseScope = scopes[0];
|
|
418
|
+
if (scopes.length === 1) return baseScope;
|
|
419
|
+
const createScope = () => {
|
|
420
|
+
const scopeHooks = scopes.map((createScope2) => ({
|
|
421
|
+
useScope: createScope2(),
|
|
422
|
+
scopeName: createScope2.scopeName
|
|
423
|
+
}));
|
|
424
|
+
return function useComposedScopes(overrideScopes) {
|
|
425
|
+
const nextScopes = scopeHooks.reduce((nextScopes2, { useScope, scopeName }) => {
|
|
426
|
+
const currentScope = useScope(overrideScopes)[`__scope${scopeName}`];
|
|
427
|
+
return {
|
|
428
|
+
...nextScopes2,
|
|
429
|
+
...currentScope
|
|
430
|
+
};
|
|
431
|
+
}, {});
|
|
432
|
+
return React$1.useMemo(() => ({ [`__scope${baseScope.scopeName}`]: nextScopes }), [nextScopes]);
|
|
433
|
+
};
|
|
434
|
+
};
|
|
435
|
+
createScope.scopeName = baseScope.scopeName;
|
|
436
|
+
return createScope;
|
|
437
|
+
}
|
|
438
|
+
var Primitive$4 = [
|
|
439
|
+
"a",
|
|
440
|
+
"button",
|
|
441
|
+
"div",
|
|
442
|
+
"form",
|
|
443
|
+
"h2",
|
|
444
|
+
"h3",
|
|
445
|
+
"img",
|
|
446
|
+
"input",
|
|
447
|
+
"label",
|
|
448
|
+
"li",
|
|
449
|
+
"nav",
|
|
450
|
+
"ol",
|
|
451
|
+
"p",
|
|
452
|
+
"select",
|
|
453
|
+
"span",
|
|
454
|
+
"svg",
|
|
455
|
+
"ul"
|
|
456
|
+
].reduce((primitive, node) => {
|
|
457
|
+
const Slot$1 = createSlot(`Primitive.${node}`);
|
|
458
|
+
const Node = React$1.forwardRef((props, forwardedRef) => {
|
|
459
|
+
const { asChild, ...primitiveProps } = props;
|
|
460
|
+
const Comp = asChild ? Slot$1 : node;
|
|
461
|
+
if (typeof window !== "undefined") window[Symbol.for("radix-ui")] = true;
|
|
462
|
+
return /* @__PURE__ */ jsx(Comp, {
|
|
463
|
+
...primitiveProps,
|
|
464
|
+
ref: forwardedRef
|
|
465
|
+
});
|
|
466
|
+
});
|
|
467
|
+
Node.displayName = `Primitive.${node}`;
|
|
468
|
+
return {
|
|
469
|
+
...primitive,
|
|
470
|
+
[node]: Node
|
|
471
|
+
};
|
|
472
|
+
}, {});
|
|
473
|
+
function createContextScope$4(scopeName, createContextScopeDeps = []) {
|
|
474
|
+
let defaultContexts = [];
|
|
475
|
+
function createContext3(rootComponentName, defaultContext) {
|
|
476
|
+
const BaseContext = React$1.createContext(defaultContext);
|
|
477
|
+
const index = defaultContexts.length;
|
|
478
|
+
defaultContexts = [...defaultContexts, defaultContext];
|
|
479
|
+
const Provider = (props) => {
|
|
480
|
+
const { scope, children, ...context } = props;
|
|
481
|
+
const Context = scope?.[scopeName]?.[index] || BaseContext;
|
|
482
|
+
const value = React$1.useMemo(() => context, Object.values(context));
|
|
483
|
+
return /* @__PURE__ */ jsx(Context.Provider, {
|
|
484
|
+
value,
|
|
485
|
+
children
|
|
486
|
+
});
|
|
487
|
+
};
|
|
488
|
+
Provider.displayName = rootComponentName + "Provider";
|
|
489
|
+
function useContext2(consumerName, scope) {
|
|
490
|
+
const Context = scope?.[scopeName]?.[index] || BaseContext;
|
|
491
|
+
const context = React$1.useContext(Context);
|
|
492
|
+
if (context) return context;
|
|
493
|
+
if (defaultContext !== void 0) return defaultContext;
|
|
494
|
+
throw new Error(`\`${consumerName}\` must be used within \`${rootComponentName}\``);
|
|
388
495
|
}
|
|
389
|
-
return
|
|
496
|
+
return [Provider, useContext2];
|
|
497
|
+
}
|
|
498
|
+
const createScope = () => {
|
|
499
|
+
const scopeContexts = defaultContexts.map((defaultContext) => {
|
|
500
|
+
return React$1.createContext(defaultContext);
|
|
501
|
+
});
|
|
502
|
+
return function useScope(scope) {
|
|
503
|
+
const contexts = scope?.[scopeName] || scopeContexts;
|
|
504
|
+
return React$1.useMemo(() => ({ [`__scope${scopeName}`]: {
|
|
505
|
+
...scope,
|
|
506
|
+
[scopeName]: contexts
|
|
507
|
+
} }), [scope, contexts]);
|
|
508
|
+
};
|
|
509
|
+
};
|
|
510
|
+
createScope.scopeName = scopeName;
|
|
511
|
+
return [createContext3, composeContextScopes$3(createScope, ...createContextScopeDeps)];
|
|
512
|
+
}
|
|
513
|
+
function composeContextScopes$3(...scopes) {
|
|
514
|
+
const baseScope = scopes[0];
|
|
515
|
+
if (scopes.length === 1) return baseScope;
|
|
516
|
+
const createScope = () => {
|
|
517
|
+
const scopeHooks = scopes.map((createScope2) => ({
|
|
518
|
+
useScope: createScope2(),
|
|
519
|
+
scopeName: createScope2.scopeName
|
|
520
|
+
}));
|
|
521
|
+
return function useComposedScopes(overrideScopes) {
|
|
522
|
+
const nextScopes = scopeHooks.reduce((nextScopes2, { useScope, scopeName }) => {
|
|
523
|
+
const currentScope = useScope(overrideScopes)[`__scope${scopeName}`];
|
|
524
|
+
return {
|
|
525
|
+
...nextScopes2,
|
|
526
|
+
...currentScope
|
|
527
|
+
};
|
|
528
|
+
}, {});
|
|
529
|
+
return React$1.useMemo(() => ({ [`__scope${baseScope.scopeName}`]: nextScopes }), [nextScopes]);
|
|
530
|
+
};
|
|
531
|
+
};
|
|
532
|
+
createScope.scopeName = baseScope.scopeName;
|
|
533
|
+
return createScope;
|
|
534
|
+
}
|
|
535
|
+
var Primitive$5 = [
|
|
536
|
+
"a",
|
|
537
|
+
"button",
|
|
538
|
+
"div",
|
|
539
|
+
"form",
|
|
540
|
+
"h2",
|
|
541
|
+
"h3",
|
|
542
|
+
"img",
|
|
543
|
+
"input",
|
|
544
|
+
"label",
|
|
545
|
+
"li",
|
|
546
|
+
"nav",
|
|
547
|
+
"ol",
|
|
548
|
+
"p",
|
|
549
|
+
"select",
|
|
550
|
+
"span",
|
|
551
|
+
"svg",
|
|
552
|
+
"ul"
|
|
553
|
+
].reduce((primitive, node) => {
|
|
554
|
+
const Slot$1 = createSlot(`Primitive.${node}`);
|
|
555
|
+
const Node = React$1.forwardRef((props, forwardedRef) => {
|
|
556
|
+
const { asChild, ...primitiveProps } = props;
|
|
557
|
+
const Comp = asChild ? Slot$1 : node;
|
|
558
|
+
if (typeof window !== "undefined") window[Symbol.for("radix-ui")] = true;
|
|
559
|
+
return /* @__PURE__ */ jsx(Comp, {
|
|
560
|
+
...primitiveProps,
|
|
561
|
+
ref: forwardedRef
|
|
562
|
+
});
|
|
390
563
|
});
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
395
|
-
|
|
396
|
-
|
|
397
|
-
|
|
398
|
-
|
|
399
|
-
|
|
400
|
-
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
|
|
404
|
-
|
|
405
|
-
|
|
564
|
+
Node.displayName = `Primitive.${node}`;
|
|
565
|
+
return {
|
|
566
|
+
...primitive,
|
|
567
|
+
[node]: Node
|
|
568
|
+
};
|
|
569
|
+
}, {});
|
|
570
|
+
var ENTRY_FOCUS = "rovingFocusGroup.onEntryFocus";
|
|
571
|
+
var EVENT_OPTIONS = {
|
|
572
|
+
bubbles: false,
|
|
573
|
+
cancelable: true
|
|
574
|
+
};
|
|
575
|
+
var GROUP_NAME = "RovingFocusGroup";
|
|
576
|
+
var [Collection, useCollection, createCollectionScope] = createCollection(GROUP_NAME);
|
|
577
|
+
var [createRovingFocusGroupContext, createRovingFocusGroupScope] = createContextScope$4(GROUP_NAME, [createCollectionScope]);
|
|
578
|
+
var [RovingFocusProvider, useRovingFocusContext] = createRovingFocusGroupContext(GROUP_NAME);
|
|
579
|
+
var RovingFocusGroup = React$1.forwardRef((props, forwardedRef) => {
|
|
580
|
+
return /* @__PURE__ */ jsx(Collection.Provider, {
|
|
581
|
+
scope: props.__scopeRovingFocusGroup,
|
|
582
|
+
children: /* @__PURE__ */ jsx(Collection.Slot, {
|
|
583
|
+
scope: props.__scopeRovingFocusGroup,
|
|
584
|
+
children: /* @__PURE__ */ jsx(RovingFocusGroupImpl, {
|
|
585
|
+
...props,
|
|
586
|
+
ref: forwardedRef
|
|
587
|
+
})
|
|
588
|
+
})
|
|
406
589
|
});
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
419
|
-
|
|
420
|
-
|
|
590
|
+
});
|
|
591
|
+
RovingFocusGroup.displayName = GROUP_NAME;
|
|
592
|
+
var RovingFocusGroupImpl = React$1.forwardRef((props, forwardedRef) => {
|
|
593
|
+
const { __scopeRovingFocusGroup, orientation, loop = false, dir, currentTabStopId: currentTabStopIdProp, defaultCurrentTabStopId, onCurrentTabStopIdChange, onEntryFocus, preventScrollOnEntryFocus = false, ...groupProps } = props;
|
|
594
|
+
const ref = React$1.useRef(null);
|
|
595
|
+
const composedRefs = useComposedRefs(forwardedRef, ref);
|
|
596
|
+
const direction = useDirection(dir);
|
|
597
|
+
const [currentTabStopId, setCurrentTabStopId] = useControllableState({
|
|
598
|
+
prop: currentTabStopIdProp,
|
|
599
|
+
defaultProp: defaultCurrentTabStopId ?? null,
|
|
600
|
+
onChange: onCurrentTabStopIdChange,
|
|
601
|
+
caller: GROUP_NAME
|
|
602
|
+
});
|
|
603
|
+
const [isTabbingBackOut, setIsTabbingBackOut] = React$1.useState(false);
|
|
604
|
+
const handleEntryFocus = useCallbackRef(onEntryFocus);
|
|
605
|
+
const getItems = useCollection(__scopeRovingFocusGroup);
|
|
606
|
+
const isClickFocusRef = React$1.useRef(false);
|
|
607
|
+
const [focusableItemsCount, setFocusableItemsCount] = React$1.useState(0);
|
|
608
|
+
React$1.useEffect(() => {
|
|
609
|
+
const node = ref.current;
|
|
610
|
+
if (node) {
|
|
611
|
+
node.addEventListener(ENTRY_FOCUS, handleEntryFocus);
|
|
612
|
+
return () => node.removeEventListener(ENTRY_FOCUS, handleEntryFocus);
|
|
613
|
+
}
|
|
614
|
+
}, [handleEntryFocus]);
|
|
615
|
+
return /* @__PURE__ */ jsx(RovingFocusProvider, {
|
|
616
|
+
scope: __scopeRovingFocusGroup,
|
|
617
|
+
orientation,
|
|
618
|
+
dir: direction,
|
|
619
|
+
loop,
|
|
620
|
+
currentTabStopId,
|
|
621
|
+
onItemFocus: React$1.useCallback((tabStopId) => setCurrentTabStopId(tabStopId), [setCurrentTabStopId]),
|
|
622
|
+
onItemShiftTab: React$1.useCallback(() => setIsTabbingBackOut(true), []),
|
|
623
|
+
onFocusableItemAdd: React$1.useCallback(() => setFocusableItemsCount((prevCount) => prevCount + 1), []),
|
|
624
|
+
onFocusableItemRemove: React$1.useCallback(() => setFocusableItemsCount((prevCount) => prevCount - 1), []),
|
|
625
|
+
children: /* @__PURE__ */ jsx(Primitive$5.div, {
|
|
626
|
+
tabIndex: isTabbingBackOut || focusableItemsCount === 0 ? -1 : 0,
|
|
627
|
+
"data-orientation": orientation,
|
|
628
|
+
...groupProps,
|
|
629
|
+
ref: composedRefs,
|
|
630
|
+
style: {
|
|
631
|
+
outline: "none",
|
|
632
|
+
...props.style
|
|
633
|
+
},
|
|
634
|
+
onMouseDown: composeEventHandlers(props.onMouseDown, () => {
|
|
635
|
+
isClickFocusRef.current = true;
|
|
636
|
+
}),
|
|
637
|
+
onFocus: composeEventHandlers(props.onFocus, (event) => {
|
|
638
|
+
const isKeyboardFocus = !isClickFocusRef.current;
|
|
639
|
+
if (event.target === event.currentTarget && isKeyboardFocus && !isTabbingBackOut) {
|
|
640
|
+
const entryFocusEvent = new CustomEvent(ENTRY_FOCUS, EVENT_OPTIONS);
|
|
641
|
+
event.currentTarget.dispatchEvent(entryFocusEvent);
|
|
642
|
+
if (!entryFocusEvent.defaultPrevented) {
|
|
643
|
+
const items = getItems().filter((item) => item.focusable);
|
|
644
|
+
focusFirst([
|
|
645
|
+
items.find((item) => item.active),
|
|
646
|
+
items.find((item) => item.id === currentTabStopId),
|
|
647
|
+
...items
|
|
648
|
+
].filter(Boolean).map((item) => item.ref.current), preventScrollOnEntryFocus);
|
|
649
|
+
}
|
|
650
|
+
}
|
|
651
|
+
isClickFocusRef.current = false;
|
|
652
|
+
}),
|
|
653
|
+
onBlur: composeEventHandlers(props.onBlur, () => setIsTabbingBackOut(false))
|
|
654
|
+
})
|
|
655
|
+
});
|
|
656
|
+
});
|
|
657
|
+
var ITEM_NAME$2 = "RovingFocusGroupItem";
|
|
658
|
+
var RovingFocusGroupItem = React$1.forwardRef((props, forwardedRef) => {
|
|
659
|
+
const { __scopeRovingFocusGroup, focusable = true, active = false, tabStopId, children, ...itemProps } = props;
|
|
660
|
+
const autoId = useId$1();
|
|
661
|
+
const id = tabStopId || autoId;
|
|
662
|
+
const context = useRovingFocusContext(ITEM_NAME$2, __scopeRovingFocusGroup);
|
|
663
|
+
const isCurrentTabStop = context.currentTabStopId === id;
|
|
664
|
+
const getItems = useCollection(__scopeRovingFocusGroup);
|
|
665
|
+
const { onFocusableItemAdd, onFocusableItemRemove, currentTabStopId } = context;
|
|
666
|
+
React$1.useEffect(() => {
|
|
667
|
+
if (focusable) {
|
|
668
|
+
onFocusableItemAdd();
|
|
669
|
+
return () => onFocusableItemRemove();
|
|
670
|
+
}
|
|
421
671
|
}, [
|
|
422
|
-
|
|
423
|
-
|
|
424
|
-
|
|
672
|
+
focusable,
|
|
673
|
+
onFocusableItemAdd,
|
|
674
|
+
onFocusableItemRemove
|
|
425
675
|
]);
|
|
426
|
-
|
|
427
|
-
|
|
428
|
-
|
|
429
|
-
|
|
430
|
-
|
|
676
|
+
return /* @__PURE__ */ jsx(Collection.ItemSlot, {
|
|
677
|
+
scope: __scopeRovingFocusGroup,
|
|
678
|
+
id,
|
|
679
|
+
focusable,
|
|
680
|
+
active,
|
|
681
|
+
children: /* @__PURE__ */ jsx(Primitive$5.span, {
|
|
682
|
+
tabIndex: isCurrentTabStop ? 0 : -1,
|
|
683
|
+
"data-orientation": context.orientation,
|
|
684
|
+
...itemProps,
|
|
685
|
+
ref: forwardedRef,
|
|
686
|
+
onMouseDown: composeEventHandlers(props.onMouseDown, (event) => {
|
|
687
|
+
if (!focusable) event.preventDefault();
|
|
688
|
+
else context.onItemFocus(id);
|
|
689
|
+
}),
|
|
690
|
+
onFocus: composeEventHandlers(props.onFocus, () => context.onItemFocus(id)),
|
|
691
|
+
onKeyDown: composeEventHandlers(props.onKeyDown, (event) => {
|
|
692
|
+
if (event.key === "Tab" && event.shiftKey) {
|
|
693
|
+
context.onItemShiftTab();
|
|
694
|
+
return;
|
|
695
|
+
}
|
|
696
|
+
if (event.target !== event.currentTarget) return;
|
|
697
|
+
const focusIntent = getFocusIntent(event, context.orientation, context.dir);
|
|
698
|
+
if (focusIntent !== void 0) {
|
|
699
|
+
if (event.metaKey || event.ctrlKey || event.altKey || event.shiftKey) return;
|
|
700
|
+
event.preventDefault();
|
|
701
|
+
let candidateNodes = getItems().filter((item) => item.focusable).map((item) => item.ref.current);
|
|
702
|
+
if (focusIntent === "last") candidateNodes.reverse();
|
|
703
|
+
else if (focusIntent === "prev" || focusIntent === "next") {
|
|
704
|
+
if (focusIntent === "prev") candidateNodes.reverse();
|
|
705
|
+
const currentIndex = candidateNodes.indexOf(event.currentTarget);
|
|
706
|
+
candidateNodes = context.loop ? wrapArray(candidateNodes, currentIndex + 1) : candidateNodes.slice(currentIndex + 1);
|
|
707
|
+
}
|
|
708
|
+
setTimeout(() => focusFirst(candidateNodes));
|
|
709
|
+
}
|
|
710
|
+
}),
|
|
711
|
+
children: typeof children === "function" ? children({
|
|
712
|
+
isCurrentTabStop,
|
|
713
|
+
hasTabStop: currentTabStopId != null
|
|
714
|
+
}) : children
|
|
715
|
+
})
|
|
716
|
+
});
|
|
717
|
+
});
|
|
718
|
+
RovingFocusGroupItem.displayName = ITEM_NAME$2;
|
|
719
|
+
var MAP_KEY_TO_FOCUS_INTENT = {
|
|
720
|
+
ArrowLeft: "prev",
|
|
721
|
+
ArrowUp: "prev",
|
|
722
|
+
ArrowRight: "next",
|
|
723
|
+
ArrowDown: "next",
|
|
724
|
+
PageUp: "first",
|
|
725
|
+
Home: "first",
|
|
726
|
+
PageDown: "last",
|
|
727
|
+
End: "last"
|
|
728
|
+
};
|
|
729
|
+
function getDirectionAwareKey(key, dir) {
|
|
730
|
+
if (dir !== "rtl") return key;
|
|
731
|
+
return key === "ArrowLeft" ? "ArrowRight" : key === "ArrowRight" ? "ArrowLeft" : key;
|
|
732
|
+
}
|
|
733
|
+
function getFocusIntent(event, orientation, dir) {
|
|
734
|
+
const key = getDirectionAwareKey(event.key, dir);
|
|
735
|
+
if (orientation === "vertical" && ["ArrowLeft", "ArrowRight"].includes(key)) return void 0;
|
|
736
|
+
if (orientation === "horizontal" && ["ArrowUp", "ArrowDown"].includes(key)) return void 0;
|
|
737
|
+
return MAP_KEY_TO_FOCUS_INTENT[key];
|
|
738
|
+
}
|
|
739
|
+
function focusFirst(candidates, preventScroll = false) {
|
|
740
|
+
const PREVIOUSLY_FOCUSED_ELEMENT = document.activeElement;
|
|
741
|
+
for (const candidate of candidates) {
|
|
742
|
+
if (candidate === PREVIOUSLY_FOCUSED_ELEMENT) return;
|
|
743
|
+
candidate.focus({ preventScroll });
|
|
744
|
+
if (document.activeElement !== PREVIOUSLY_FOCUSED_ELEMENT) return;
|
|
745
|
+
}
|
|
746
|
+
}
|
|
747
|
+
function wrapArray(array, startIndex) {
|
|
748
|
+
return array.map((_, index) => array[(startIndex + index) % array.length]);
|
|
749
|
+
}
|
|
750
|
+
var Root$3 = RovingFocusGroup;
|
|
751
|
+
var Item = RovingFocusGroupItem;
|
|
752
|
+
var TOGGLE_GROUP_NAME = "ToggleGroup";
|
|
753
|
+
var [createToggleGroupContext, createToggleGroupScope] = createContextScope$3(TOGGLE_GROUP_NAME, [createRovingFocusGroupScope]);
|
|
754
|
+
var useRovingFocusGroupScope$1 = createRovingFocusGroupScope();
|
|
755
|
+
var ToggleGroup = React.forwardRef((props, forwardedRef) => {
|
|
756
|
+
const { type, ...toggleGroupProps } = props;
|
|
757
|
+
if (type === "single") return /* @__PURE__ */ jsx(ToggleGroupImplSingle, {
|
|
758
|
+
...toggleGroupProps,
|
|
759
|
+
ref: forwardedRef
|
|
760
|
+
});
|
|
761
|
+
if (type === "multiple") return /* @__PURE__ */ jsx(ToggleGroupImplMultiple, {
|
|
762
|
+
...toggleGroupProps,
|
|
763
|
+
ref: forwardedRef
|
|
764
|
+
});
|
|
765
|
+
throw new Error(`Missing prop \`type\` expected on \`${TOGGLE_GROUP_NAME}\``);
|
|
766
|
+
});
|
|
767
|
+
ToggleGroup.displayName = TOGGLE_GROUP_NAME;
|
|
768
|
+
var [ToggleGroupValueProvider, useToggleGroupValueContext] = createToggleGroupContext(TOGGLE_GROUP_NAME);
|
|
769
|
+
var ToggleGroupImplSingle = React.forwardRef((props, forwardedRef) => {
|
|
770
|
+
const { value: valueProp, defaultValue, onValueChange = () => {}, ...toggleGroupSingleProps } = props;
|
|
771
|
+
const [value, setValue] = useControllableState({
|
|
772
|
+
prop: valueProp,
|
|
773
|
+
defaultProp: defaultValue ?? "",
|
|
774
|
+
onChange: onValueChange,
|
|
775
|
+
caller: TOGGLE_GROUP_NAME
|
|
776
|
+
});
|
|
777
|
+
return /* @__PURE__ */ jsx(ToggleGroupValueProvider, {
|
|
778
|
+
scope: props.__scopeToggleGroup,
|
|
779
|
+
type: "single",
|
|
780
|
+
value: React.useMemo(() => value ? [value] : [], [value]),
|
|
781
|
+
onItemActivate: setValue,
|
|
782
|
+
onItemDeactivate: React.useCallback(() => setValue(""), [setValue]),
|
|
783
|
+
children: /* @__PURE__ */ jsx(ToggleGroupImpl, {
|
|
784
|
+
...toggleGroupSingleProps,
|
|
785
|
+
ref: forwardedRef
|
|
786
|
+
})
|
|
787
|
+
});
|
|
788
|
+
});
|
|
789
|
+
var ToggleGroupImplMultiple = React.forwardRef((props, forwardedRef) => {
|
|
790
|
+
const { value: valueProp, defaultValue, onValueChange = () => {}, ...toggleGroupMultipleProps } = props;
|
|
791
|
+
const [value, setValue] = useControllableState({
|
|
792
|
+
prop: valueProp,
|
|
793
|
+
defaultProp: defaultValue ?? [],
|
|
794
|
+
onChange: onValueChange,
|
|
795
|
+
caller: TOGGLE_GROUP_NAME
|
|
796
|
+
});
|
|
797
|
+
const handleButtonActivate = React.useCallback((itemValue) => setValue((prevValue = []) => [...prevValue, itemValue]), [setValue]);
|
|
798
|
+
const handleButtonDeactivate = React.useCallback((itemValue) => setValue((prevValue = []) => prevValue.filter((value2) => value2 !== itemValue)), [setValue]);
|
|
799
|
+
return /* @__PURE__ */ jsx(ToggleGroupValueProvider, {
|
|
800
|
+
scope: props.__scopeToggleGroup,
|
|
801
|
+
type: "multiple",
|
|
802
|
+
value,
|
|
803
|
+
onItemActivate: handleButtonActivate,
|
|
804
|
+
onItemDeactivate: handleButtonDeactivate,
|
|
805
|
+
children: /* @__PURE__ */ jsx(ToggleGroupImpl, {
|
|
806
|
+
...toggleGroupMultipleProps,
|
|
807
|
+
ref: forwardedRef
|
|
808
|
+
})
|
|
809
|
+
});
|
|
810
|
+
});
|
|
811
|
+
ToggleGroup.displayName = TOGGLE_GROUP_NAME;
|
|
812
|
+
var [ToggleGroupContext$1, useToggleGroupContext] = createToggleGroupContext(TOGGLE_GROUP_NAME);
|
|
813
|
+
var ToggleGroupImpl = React.forwardRef((props, forwardedRef) => {
|
|
814
|
+
const { __scopeToggleGroup, disabled = false, rovingFocus = true, orientation, dir, loop = true, ...toggleGroupProps } = props;
|
|
815
|
+
const rovingFocusGroupScope = useRovingFocusGroupScope$1(__scopeToggleGroup);
|
|
816
|
+
const direction = useDirection(dir);
|
|
817
|
+
const commonProps = {
|
|
818
|
+
role: "group",
|
|
819
|
+
dir: direction,
|
|
820
|
+
...toggleGroupProps
|
|
821
|
+
};
|
|
822
|
+
return /* @__PURE__ */ jsx(ToggleGroupContext$1, {
|
|
823
|
+
scope: __scopeToggleGroup,
|
|
824
|
+
rovingFocus,
|
|
825
|
+
disabled,
|
|
826
|
+
children: rovingFocus ? /* @__PURE__ */ jsx(Root$3, {
|
|
827
|
+
asChild: true,
|
|
828
|
+
...rovingFocusGroupScope,
|
|
829
|
+
orientation,
|
|
830
|
+
dir: direction,
|
|
831
|
+
loop,
|
|
832
|
+
children: /* @__PURE__ */ jsx(Primitive$4.div, {
|
|
833
|
+
...commonProps,
|
|
834
|
+
ref: forwardedRef
|
|
835
|
+
})
|
|
836
|
+
}) : /* @__PURE__ */ jsx(Primitive$4.div, {
|
|
837
|
+
...commonProps,
|
|
838
|
+
ref: forwardedRef
|
|
839
|
+
})
|
|
840
|
+
});
|
|
841
|
+
});
|
|
842
|
+
var ITEM_NAME$1 = "ToggleGroupItem";
|
|
843
|
+
var ToggleGroupItem = React.forwardRef((props, forwardedRef) => {
|
|
844
|
+
const valueContext = useToggleGroupValueContext(ITEM_NAME$1, props.__scopeToggleGroup);
|
|
845
|
+
const context = useToggleGroupContext(ITEM_NAME$1, props.__scopeToggleGroup);
|
|
846
|
+
const rovingFocusGroupScope = useRovingFocusGroupScope$1(props.__scopeToggleGroup);
|
|
847
|
+
const pressed = valueContext.value.includes(props.value);
|
|
848
|
+
const disabled = context.disabled || props.disabled;
|
|
849
|
+
const commonProps = {
|
|
850
|
+
...props,
|
|
851
|
+
pressed,
|
|
852
|
+
disabled
|
|
853
|
+
};
|
|
854
|
+
const ref = React.useRef(null);
|
|
855
|
+
return context.rovingFocus ? /* @__PURE__ */ jsx(Item, {
|
|
856
|
+
asChild: true,
|
|
857
|
+
...rovingFocusGroupScope,
|
|
858
|
+
focusable: !disabled,
|
|
859
|
+
active: pressed,
|
|
860
|
+
ref,
|
|
861
|
+
children: /* @__PURE__ */ jsx(ToggleGroupItemImpl, {
|
|
862
|
+
...commonProps,
|
|
863
|
+
ref: forwardedRef
|
|
864
|
+
})
|
|
865
|
+
}) : /* @__PURE__ */ jsx(ToggleGroupItemImpl, {
|
|
866
|
+
...commonProps,
|
|
867
|
+
ref: forwardedRef
|
|
868
|
+
});
|
|
869
|
+
});
|
|
870
|
+
ToggleGroupItem.displayName = ITEM_NAME$1;
|
|
871
|
+
var ToggleGroupItemImpl = React.forwardRef((props, forwardedRef) => {
|
|
872
|
+
const { __scopeToggleGroup, value, ...itemProps } = props;
|
|
873
|
+
const valueContext = useToggleGroupValueContext(ITEM_NAME$1, __scopeToggleGroup);
|
|
874
|
+
const singleProps = {
|
|
875
|
+
role: "radio",
|
|
876
|
+
"aria-checked": props.pressed,
|
|
877
|
+
"aria-pressed": void 0
|
|
878
|
+
};
|
|
879
|
+
return /* @__PURE__ */ jsx(Toggle, {
|
|
880
|
+
...valueContext.type === "single" ? singleProps : void 0,
|
|
881
|
+
...itemProps,
|
|
882
|
+
ref: forwardedRef,
|
|
883
|
+
onPressedChange: (pressed) => {
|
|
884
|
+
if (pressed) valueContext.onItemActivate(value);
|
|
885
|
+
else valueContext.onItemDeactivate(value);
|
|
886
|
+
}
|
|
887
|
+
});
|
|
888
|
+
});
|
|
889
|
+
var Root2$1 = ToggleGroup;
|
|
890
|
+
var Item2$1 = ToggleGroupItem;
|
|
891
|
+
var ToggleGroupContext = React$1.createContext({
|
|
892
|
+
size: "default",
|
|
893
|
+
variant: "default"
|
|
894
|
+
});
|
|
895
|
+
var toggleGroupItemVariants = cva([
|
|
896
|
+
"inline-flex items-center justify-center rounded-md text-sm font-medium",
|
|
897
|
+
"transition-all duration-200",
|
|
898
|
+
"focus:outline-none focus-visible:ring-2",
|
|
899
|
+
"focus-visible:ring-[var(--focus-ring)] focus-visible:ring-offset-2",
|
|
900
|
+
"disabled:pointer-events-none disabled:opacity-50"
|
|
901
|
+
], {
|
|
902
|
+
variants: {
|
|
903
|
+
variant: {
|
|
904
|
+
default: [
|
|
905
|
+
"bg-[var(--toggle-group-item-bg,transparent)]",
|
|
906
|
+
"hover:bg-[var(--toggle-group-item-hover-bg,var(--glass-bg-subtle))]",
|
|
907
|
+
"data-[state=on]:bg-[var(--toggle-group-item-active-bg,var(--semantic-primary-subtle))]",
|
|
908
|
+
"data-[state=on]:text-[var(--toggle-group-item-active-text,var(--semantic-primary))]"
|
|
909
|
+
],
|
|
910
|
+
outline: [
|
|
911
|
+
"border border-[var(--toggle-group-item-border,var(--glass-border))]",
|
|
912
|
+
"bg-transparent",
|
|
913
|
+
"hover:bg-[var(--toggle-group-item-hover-bg,var(--glass-bg-subtle))]",
|
|
914
|
+
"data-[state=on]:border-[var(--semantic-primary)]",
|
|
915
|
+
"data-[state=on]:bg-[var(--toggle-group-item-active-bg,var(--semantic-primary-subtle))]",
|
|
916
|
+
"data-[state=on]:text-[var(--toggle-group-item-active-text,var(--semantic-primary))]"
|
|
917
|
+
]
|
|
918
|
+
},
|
|
919
|
+
size: {
|
|
920
|
+
default: "h-10 px-3",
|
|
921
|
+
sm: "h-8 px-2",
|
|
922
|
+
lg: "h-11 px-4"
|
|
923
|
+
}
|
|
924
|
+
},
|
|
925
|
+
defaultVariants: {
|
|
926
|
+
variant: "default",
|
|
927
|
+
size: "default"
|
|
928
|
+
}
|
|
929
|
+
});
|
|
930
|
+
function ToggleGroupGlassRootImpl(props, ref) {
|
|
931
|
+
const { className, variant = "default", size = "default", children, ...rest } = props;
|
|
932
|
+
const containerClasses = cn("inline-flex items-center justify-center gap-1", "rounded-lg p-1", "bg-[var(--toggle-group-bg,var(--glass-bg-subtle))]", "border border-[var(--toggle-group-border,var(--glass-border))]", className);
|
|
933
|
+
const contextValue = {
|
|
934
|
+
size: size ?? "default",
|
|
935
|
+
variant: variant ?? "default"
|
|
936
|
+
};
|
|
937
|
+
if (props.type === "multiple") return /* @__PURE__ */ jsx(Root2$1, {
|
|
938
|
+
ref,
|
|
939
|
+
className: containerClasses,
|
|
940
|
+
...rest,
|
|
941
|
+
children: /* @__PURE__ */ jsx(ToggleGroupContext.Provider, {
|
|
942
|
+
value: contextValue,
|
|
943
|
+
children
|
|
944
|
+
})
|
|
945
|
+
});
|
|
946
|
+
return /* @__PURE__ */ jsx(Root2$1, {
|
|
947
|
+
ref,
|
|
948
|
+
className: containerClasses,
|
|
949
|
+
...rest,
|
|
950
|
+
children: /* @__PURE__ */ jsx(ToggleGroupContext.Provider, {
|
|
951
|
+
value: contextValue,
|
|
952
|
+
children
|
|
953
|
+
})
|
|
954
|
+
});
|
|
955
|
+
}
|
|
956
|
+
var ToggleGroupGlassRoot = React$1.forwardRef(ToggleGroupGlassRootImpl);
|
|
957
|
+
ToggleGroupGlassRoot.displayName = "ToggleGroupGlassRoot";
|
|
958
|
+
var ToggleGroupGlassItem = React$1.forwardRef(({ className, children, variant, size, ...props }, ref) => {
|
|
959
|
+
const context = React$1.useContext(ToggleGroupContext);
|
|
960
|
+
return /* @__PURE__ */ jsx(Item2$1, {
|
|
961
|
+
ref,
|
|
962
|
+
className: cn(toggleGroupItemVariants({
|
|
963
|
+
variant: variant ?? context.variant,
|
|
964
|
+
size: size ?? context.size
|
|
965
|
+
}), className),
|
|
966
|
+
...props,
|
|
967
|
+
children
|
|
968
|
+
});
|
|
969
|
+
});
|
|
970
|
+
ToggleGroupGlassItem.displayName = "ToggleGroupGlassItem";
|
|
971
|
+
const ToggleGroupGlass = {
|
|
972
|
+
Root: ToggleGroupGlassRoot,
|
|
973
|
+
Item: ToggleGroupGlassItem
|
|
974
|
+
};
|
|
975
|
+
var MOBILE_BREAKPOINT = 768;
|
|
976
|
+
var SIDEBAR_COOKIE_NAME = "sidebar:state";
|
|
977
|
+
var SIDEBAR_COOKIE_MAX_AGE = 3600 * 24 * 7;
|
|
978
|
+
var SidebarContext = createContext(null);
|
|
979
|
+
function useSidebar() {
|
|
980
|
+
const context = useContext(SidebarContext);
|
|
981
|
+
if (!context) throw new Error("useSidebar must be used within SidebarGlass.Provider. Wrap your component tree with <SidebarGlass.Provider>.");
|
|
982
|
+
return context;
|
|
983
|
+
}
|
|
984
|
+
const SidebarProvider = ({ children, open: controlledOpen, onOpenChange, defaultOpen = true, side = "left", variant = "sidebar", collapsible = "offcanvas", cookieName = SIDEBAR_COOKIE_NAME, keyboardShortcut = "b" }) => {
|
|
985
|
+
const [internalOpen, setInternalOpen] = useState(() => {
|
|
986
|
+
if (typeof document !== "undefined") {
|
|
987
|
+
const sidebarCookie = document.cookie.split(";").find((c) => c.trim().startsWith(`${cookieName}=`));
|
|
988
|
+
if (sidebarCookie) return sidebarCookie.split("=")[1] === "true";
|
|
989
|
+
}
|
|
990
|
+
return defaultOpen;
|
|
991
|
+
});
|
|
992
|
+
const isControlled = controlledOpen !== void 0;
|
|
993
|
+
const open = isControlled ? controlledOpen : internalOpen;
|
|
994
|
+
const setOpen = useCallback((value$1) => {
|
|
995
|
+
if (!isControlled) setInternalOpen(value$1);
|
|
996
|
+
onOpenChange?.(value$1);
|
|
997
|
+
if (typeof document !== "undefined") document.cookie = `${cookieName}=${value$1}; path=/; max-age=${SIDEBAR_COOKIE_MAX_AGE}`;
|
|
998
|
+
}, [
|
|
999
|
+
isControlled,
|
|
1000
|
+
onOpenChange,
|
|
1001
|
+
cookieName
|
|
1002
|
+
]);
|
|
1003
|
+
const [openMobile, setOpenMobile] = useState(false);
|
|
1004
|
+
const [isMobile, setIsMobile] = useState(() => {
|
|
1005
|
+
if (typeof window === "undefined") return false;
|
|
1006
|
+
return window.innerWidth < MOBILE_BREAKPOINT;
|
|
1007
|
+
});
|
|
1008
|
+
useEffect(() => {
|
|
1009
|
+
if (typeof window === "undefined") return;
|
|
1010
|
+
const checkMobile = () => {
|
|
1011
|
+
const mobile = window.innerWidth < MOBILE_BREAKPOINT;
|
|
1012
|
+
setIsMobile(mobile);
|
|
1013
|
+
if (!mobile) setOpenMobile(false);
|
|
1014
|
+
};
|
|
1015
|
+
checkMobile();
|
|
1016
|
+
window.addEventListener("resize", checkMobile);
|
|
1017
|
+
return () => window.removeEventListener("resize", checkMobile);
|
|
1018
|
+
}, []);
|
|
1019
|
+
const toggleSidebar = useCallback(() => {
|
|
1020
|
+
if (isMobile) setOpenMobile((prev) => !prev);
|
|
1021
|
+
else setOpen(!open);
|
|
1022
|
+
}, [
|
|
1023
|
+
isMobile,
|
|
1024
|
+
open,
|
|
1025
|
+
setOpen
|
|
1026
|
+
]);
|
|
1027
|
+
useEffect(() => {
|
|
1028
|
+
if (!keyboardShortcut) return;
|
|
1029
|
+
const handleKeyDown = (e) => {
|
|
1030
|
+
if (e.key === keyboardShortcut && (e.metaKey || e.ctrlKey)) {
|
|
1031
|
+
e.preventDefault();
|
|
431
1032
|
toggleSidebar();
|
|
432
1033
|
}
|
|
433
1034
|
};
|
|
@@ -685,435 +1286,131 @@ const SidebarMenuButton = forwardRef(({ asChild = false, isActive = false, toolt
|
|
|
685
1286
|
children: button
|
|
686
1287
|
});
|
|
687
1288
|
});
|
|
688
|
-
SidebarMenuButton.displayName = "SidebarGlass.MenuButton";
|
|
689
|
-
const SidebarMenuAction = forwardRef(({ asChild = false, showOnHover = false, className, ...props }, ref) => {
|
|
690
|
-
return /* @__PURE__ */ jsx(asChild ? Slot : "button", {
|
|
691
|
-
ref,
|
|
692
|
-
"data-sidebar": "menu-action",
|
|
693
|
-
className: cn("absolute right-1 top-1.5", "flex aspect-square w-5 items-center justify-center", "rounded-md p-0 text-[var(--sidebar-foreground)]/60", "ring-[var(--sidebar-ring)]", "transition-transform hover:bg-[var(--sidebar-accent)]", "hover:text-[var(--sidebar-foreground)]", "focus-visible:outline-none focus-visible:ring-2", "[&>svg]:size-4 [&>svg]:shrink-0", "group-data-[state=collapsed]/sidebar:hidden", showOnHover && "peer-hover/menu-button:opacity-100 group-focus-within/menu-item:opacity-100", showOnHover && "data-[state=open]:opacity-100 md:opacity-0", "after:absolute after:-inset-2 after:md:hidden", className),
|
|
694
|
-
...props
|
|
695
|
-
});
|
|
696
|
-
});
|
|
697
|
-
SidebarMenuAction.displayName = "SidebarGlass.MenuAction";
|
|
698
|
-
const SidebarMenuBadge = forwardRef(({ children, className, ...props }, ref) => {
|
|
699
|
-
return /* @__PURE__ */ jsx("div", {
|
|
700
|
-
ref,
|
|
701
|
-
"data-sidebar": "menu-badge",
|
|
702
|
-
className: cn("pointer-events-none absolute right-1 flex h-5 min-w-5", "select-none items-center justify-center", "rounded-md px-1 text-xs font-medium tabular-nums", "text-[var(--sidebar-foreground)]/60", "group-data-[state=collapsed]/sidebar:hidden", className),
|
|
703
|
-
...props,
|
|
704
|
-
children
|
|
705
|
-
});
|
|
706
|
-
});
|
|
707
|
-
SidebarMenuBadge.displayName = "SidebarGlass.MenuBadge";
|
|
708
|
-
const SidebarMenuSkeleton = forwardRef(({ showIcon = false, className, ...props }, ref) => {
|
|
709
|
-
const width = "70%";
|
|
710
|
-
return /* @__PURE__ */ jsxs("div", {
|
|
711
|
-
ref,
|
|
712
|
-
"data-sidebar": "menu-skeleton",
|
|
713
|
-
className: cn("flex h-8 items-center gap-2 rounded-md px-2", className),
|
|
714
|
-
...props,
|
|
715
|
-
children: [showIcon && /* @__PURE__ */ jsx(SkeletonGlass, { className: "size-4 rounded-md" }), /* @__PURE__ */ jsx(SkeletonGlass, {
|
|
716
|
-
className: "h-4 max-w-[var(--skeleton-width)] flex-1",
|
|
717
|
-
style: { "--skeleton-width": width }
|
|
718
|
-
})]
|
|
719
|
-
});
|
|
720
|
-
});
|
|
721
|
-
SidebarMenuSkeleton.displayName = "SidebarGlass.MenuSkeleton";
|
|
722
|
-
var SidebarMenuSubContext = createContext(null);
|
|
723
|
-
const SidebarMenuSub = forwardRef(({ children, className, ...props }, ref) => {
|
|
724
|
-
return /* @__PURE__ */ jsx(SidebarMenuSubContext.Provider, {
|
|
725
|
-
value: { open: true },
|
|
726
|
-
children: /* @__PURE__ */ jsx("ul", {
|
|
727
|
-
ref,
|
|
728
|
-
"data-sidebar": "menu-sub",
|
|
729
|
-
className: cn("flex min-w-0 flex-col gap-1", "mx-3.5 border-l border-[var(--sidebar-border)] px-2.5 py-0.5", "group-data-[state=collapsed]/sidebar:hidden", className),
|
|
730
|
-
...props,
|
|
731
|
-
children
|
|
732
|
-
})
|
|
733
|
-
});
|
|
734
|
-
});
|
|
735
|
-
SidebarMenuSub.displayName = "SidebarGlass.MenuSub";
|
|
736
|
-
const SidebarMenuSubItem = forwardRef(({ children, className, ...props }, ref) => {
|
|
737
|
-
return /* @__PURE__ */ jsx("li", {
|
|
738
|
-
ref,
|
|
739
|
-
"data-sidebar": "menu-sub-item",
|
|
740
|
-
className: cn(className),
|
|
741
|
-
...props,
|
|
742
|
-
children
|
|
743
|
-
});
|
|
744
|
-
});
|
|
745
|
-
SidebarMenuSubItem.displayName = "SidebarGlass.MenuSubItem";
|
|
746
|
-
const SidebarMenuSubButton = forwardRef(({ asChild = false, isActive = false, size = "md", className, ...props }, ref) => {
|
|
747
|
-
return /* @__PURE__ */ jsx(asChild ? Slot : "a", {
|
|
748
|
-
ref,
|
|
749
|
-
"data-sidebar": "menu-sub-button",
|
|
750
|
-
"data-active": isActive,
|
|
751
|
-
"data-size": size,
|
|
752
|
-
className: cn("flex min-w-0 items-center gap-2", "-ml-px rounded-md border-l border-transparent", "text-[var(--sidebar-foreground)]/60", "ring-[var(--sidebar-ring)]", "transition-colors", "hover:border-[var(--sidebar-border)]", "hover:bg-[var(--sidebar-accent)]", "hover:text-[var(--sidebar-accent-foreground)]", "focus-visible:outline-none focus-visible:ring-2", "active:bg-[var(--sidebar-accent)] active:text-[var(--sidebar-accent-foreground)]", "disabled:pointer-events-none disabled:opacity-50", "[&>span:last-child]:truncate", "[&>svg]:size-4 [&>svg]:shrink-0", size === "sm" && "h-7 px-2 text-xs", size === "md" && "h-8 px-2 text-sm", isActive && ["border-[var(--sidebar-primary)]", "text-[var(--sidebar-foreground)]"], className),
|
|
753
|
-
...props
|
|
754
|
-
});
|
|
755
|
-
});
|
|
756
|
-
SidebarMenuSubButton.displayName = "SidebarGlass.MenuSubButton";
|
|
757
|
-
const SidebarGlass = {
|
|
758
|
-
Provider: SidebarProvider,
|
|
759
|
-
Root: SidebarRoot,
|
|
760
|
-
Header: SidebarHeader,
|
|
761
|
-
Content: SidebarContent,
|
|
762
|
-
Footer: SidebarFooter,
|
|
763
|
-
Rail: SidebarRail,
|
|
764
|
-
Inset: SidebarInset,
|
|
765
|
-
Trigger: SidebarTrigger,
|
|
766
|
-
Separator: SidebarSeparator,
|
|
767
|
-
Group: SidebarGroup,
|
|
768
|
-
GroupLabel: SidebarGroupLabel,
|
|
769
|
-
GroupAction: SidebarGroupAction,
|
|
770
|
-
GroupContent: SidebarGroupContent,
|
|
771
|
-
Menu: SidebarMenu,
|
|
772
|
-
MenuItem: SidebarMenuItem,
|
|
773
|
-
MenuButton: SidebarMenuButton,
|
|
774
|
-
MenuAction: SidebarMenuAction,
|
|
775
|
-
MenuBadge: SidebarMenuBadge,
|
|
776
|
-
MenuSkeleton: SidebarMenuSkeleton,
|
|
777
|
-
MenuSub: SidebarMenuSub,
|
|
778
|
-
MenuSubItem: SidebarMenuSubItem,
|
|
779
|
-
MenuSubButton: SidebarMenuSubButton
|
|
780
|
-
};
|
|
781
|
-
function _extends$1() {
|
|
782
|
-
return _extends$1 = Object.assign ? Object.assign.bind() : function(n) {
|
|
783
|
-
for (var e = 1; e < arguments.length; e++) {
|
|
784
|
-
var t = arguments[e];
|
|
785
|
-
for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
|
|
786
|
-
}
|
|
787
|
-
return n;
|
|
788
|
-
}, _extends$1.apply(null, arguments);
|
|
789
|
-
}
|
|
790
|
-
function ownKeys$1(e, r) {
|
|
791
|
-
var t = Object.keys(e);
|
|
792
|
-
if (Object.getOwnPropertySymbols) {
|
|
793
|
-
var o = Object.getOwnPropertySymbols(e);
|
|
794
|
-
r && (o = o.filter(function(r$1) {
|
|
795
|
-
return Object.getOwnPropertyDescriptor(e, r$1).enumerable;
|
|
796
|
-
})), t.push.apply(t, o);
|
|
797
|
-
}
|
|
798
|
-
return t;
|
|
799
|
-
}
|
|
800
|
-
function _objectSpread$1(e) {
|
|
801
|
-
for (var r = 1; r < arguments.length; r++) {
|
|
802
|
-
var t = null != arguments[r] ? arguments[r] : {};
|
|
803
|
-
r % 2 ? ownKeys$1(Object(t), !0).forEach(function(r$1) {
|
|
804
|
-
_defineProperty$1(e, r$1, t[r$1]);
|
|
805
|
-
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function(r$1) {
|
|
806
|
-
Object.defineProperty(e, r$1, Object.getOwnPropertyDescriptor(t, r$1));
|
|
807
|
-
});
|
|
808
|
-
}
|
|
809
|
-
return e;
|
|
810
|
-
}
|
|
811
|
-
function _defineProperty$1(e, r, t) {
|
|
812
|
-
return (r = _toPropertyKey$1(r)) in e ? Object.defineProperty(e, r, {
|
|
813
|
-
value: t,
|
|
814
|
-
enumerable: !0,
|
|
815
|
-
configurable: !0,
|
|
816
|
-
writable: !0
|
|
817
|
-
}) : e[r] = t, e;
|
|
818
|
-
}
|
|
819
|
-
function _toPropertyKey$1(t) {
|
|
820
|
-
var i = _toPrimitive$1(t, "string");
|
|
821
|
-
return "symbol" == typeof i ? i : i + "";
|
|
822
|
-
}
|
|
823
|
-
function _toPrimitive$1(t, r) {
|
|
824
|
-
if ("object" != typeof t || !t) return t;
|
|
825
|
-
var e = t[Symbol.toPrimitive];
|
|
826
|
-
if (void 0 !== e) {
|
|
827
|
-
var i = e.call(t, r || "default");
|
|
828
|
-
if ("object" != typeof i) return i;
|
|
829
|
-
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
830
|
-
}
|
|
831
|
-
return ("string" === r ? String : Number)(t);
|
|
832
|
-
}
|
|
833
|
-
var SIZE = 32;
|
|
834
|
-
var defaultLegendContentDefaultProps = {
|
|
835
|
-
align: "center",
|
|
836
|
-
iconSize: 14,
|
|
837
|
-
inactiveColor: "#ccc",
|
|
838
|
-
layout: "horizontal",
|
|
839
|
-
verticalAlign: "middle"
|
|
840
|
-
};
|
|
841
|
-
function Icon(_ref) {
|
|
842
|
-
var { data, iconType, inactiveColor } = _ref;
|
|
843
|
-
var halfSize = SIZE / 2;
|
|
844
|
-
var sixthSize = SIZE / 6;
|
|
845
|
-
var thirdSize = SIZE / 3;
|
|
846
|
-
var color = data.inactive ? inactiveColor : data.color;
|
|
847
|
-
var preferredIcon = iconType !== null && iconType !== void 0 ? iconType : data.type;
|
|
848
|
-
if (preferredIcon === "none") return null;
|
|
849
|
-
if (preferredIcon === "plainline") {
|
|
850
|
-
var _data$payload;
|
|
851
|
-
return /* @__PURE__ */ React$1.createElement("line", {
|
|
852
|
-
strokeWidth: 4,
|
|
853
|
-
fill: "none",
|
|
854
|
-
stroke: color,
|
|
855
|
-
strokeDasharray: (_data$payload = data.payload) === null || _data$payload === void 0 ? void 0 : _data$payload.strokeDasharray,
|
|
856
|
-
x1: 0,
|
|
857
|
-
y1: halfSize,
|
|
858
|
-
x2: SIZE,
|
|
859
|
-
y2: halfSize,
|
|
860
|
-
className: "recharts-legend-icon"
|
|
861
|
-
});
|
|
862
|
-
}
|
|
863
|
-
if (preferredIcon === "line") return /* @__PURE__ */ React$1.createElement("path", {
|
|
864
|
-
strokeWidth: 4,
|
|
865
|
-
fill: "none",
|
|
866
|
-
stroke: color,
|
|
867
|
-
d: "M0,".concat(halfSize, "h").concat(thirdSize, "\n A").concat(sixthSize, ",").concat(sixthSize, ",0,1,1,").concat(2 * thirdSize, ",").concat(halfSize, "\n H").concat(SIZE, "M").concat(2 * thirdSize, ",").concat(halfSize, "\n A").concat(sixthSize, ",").concat(sixthSize, ",0,1,1,").concat(thirdSize, ",").concat(halfSize),
|
|
868
|
-
className: "recharts-legend-icon"
|
|
869
|
-
});
|
|
870
|
-
if (preferredIcon === "rect") return /* @__PURE__ */ React$1.createElement("path", {
|
|
871
|
-
stroke: "none",
|
|
872
|
-
fill: color,
|
|
873
|
-
d: "M0,".concat(SIZE / 8, "h").concat(SIZE, "v").concat(SIZE * 3 / 4, "h").concat(-SIZE, "z"),
|
|
874
|
-
className: "recharts-legend-icon"
|
|
875
|
-
});
|
|
876
|
-
if (/* @__PURE__ */ React$1.isValidElement(data.legendIcon)) {
|
|
877
|
-
var iconProps = _objectSpread$1({}, data);
|
|
878
|
-
delete iconProps.legendIcon;
|
|
879
|
-
return /* @__PURE__ */ React$1.cloneElement(data.legendIcon, iconProps);
|
|
880
|
-
}
|
|
881
|
-
return /* @__PURE__ */ React$1.createElement(Symbols, {
|
|
882
|
-
fill: color,
|
|
883
|
-
cx: halfSize,
|
|
884
|
-
cy: halfSize,
|
|
885
|
-
size: SIZE,
|
|
886
|
-
sizeType: "diameter",
|
|
887
|
-
type: preferredIcon
|
|
888
|
-
});
|
|
889
|
-
}
|
|
890
|
-
function Items(props) {
|
|
891
|
-
var { payload, iconSize, layout, formatter, inactiveColor, iconType } = props;
|
|
892
|
-
var viewBox = {
|
|
893
|
-
x: 0,
|
|
894
|
-
y: 0,
|
|
895
|
-
width: SIZE,
|
|
896
|
-
height: SIZE
|
|
897
|
-
};
|
|
898
|
-
var itemStyle = {
|
|
899
|
-
display: layout === "horizontal" ? "inline-block" : "block",
|
|
900
|
-
marginRight: 10
|
|
901
|
-
};
|
|
902
|
-
var svgStyle = {
|
|
903
|
-
display: "inline-block",
|
|
904
|
-
verticalAlign: "middle",
|
|
905
|
-
marginRight: 4
|
|
906
|
-
};
|
|
907
|
-
return payload.map((entry, i) => {
|
|
908
|
-
var finalFormatter = entry.formatter || formatter;
|
|
909
|
-
var className = clsx({
|
|
910
|
-
"recharts-legend-item": true,
|
|
911
|
-
["legend-item-".concat(i)]: true,
|
|
912
|
-
inactive: entry.inactive
|
|
913
|
-
});
|
|
914
|
-
if (entry.type === "none") return null;
|
|
915
|
-
var color = entry.inactive ? inactiveColor : entry.color;
|
|
916
|
-
var finalValue = finalFormatter ? finalFormatter(entry.value, entry, i) : entry.value;
|
|
917
|
-
return /* @__PURE__ */ React$1.createElement("li", _extends$1({
|
|
918
|
-
className,
|
|
919
|
-
style: itemStyle,
|
|
920
|
-
key: "legend-item-".concat(i)
|
|
921
|
-
}, adaptEventsOfChild(props, entry, i)), /* @__PURE__ */ React$1.createElement(Surface, {
|
|
922
|
-
width: iconSize,
|
|
923
|
-
height: iconSize,
|
|
924
|
-
viewBox,
|
|
925
|
-
style: svgStyle,
|
|
926
|
-
"aria-label": "".concat(finalValue, " legend icon")
|
|
927
|
-
}, /* @__PURE__ */ React$1.createElement(Icon, {
|
|
928
|
-
data: entry,
|
|
929
|
-
iconType,
|
|
930
|
-
inactiveColor
|
|
931
|
-
})), /* @__PURE__ */ React$1.createElement("span", {
|
|
932
|
-
className: "recharts-legend-item-text",
|
|
933
|
-
style: { color }
|
|
934
|
-
}, finalValue));
|
|
935
|
-
});
|
|
936
|
-
}
|
|
937
|
-
var DefaultLegendContent = (outsideProps) => {
|
|
938
|
-
var props = resolveDefaultProps(outsideProps, defaultLegendContentDefaultProps);
|
|
939
|
-
var { payload, layout, align } = props;
|
|
940
|
-
if (!payload || !payload.length) return null;
|
|
941
|
-
var finalStyle = {
|
|
942
|
-
padding: 0,
|
|
943
|
-
margin: 0,
|
|
944
|
-
textAlign: layout === "horizontal" ? align : "left"
|
|
945
|
-
};
|
|
946
|
-
return /* @__PURE__ */ React$1.createElement("ul", {
|
|
947
|
-
className: "recharts-default-legend",
|
|
948
|
-
style: finalStyle
|
|
949
|
-
}, /* @__PURE__ */ React$1.createElement(Items, _extends$1({}, props, { payload })));
|
|
950
|
-
};
|
|
951
|
-
function useLegendPayload() {
|
|
952
|
-
return useAppSelector(selectLegendPayload);
|
|
953
|
-
}
|
|
954
|
-
var _excluded = ["contextPayload"];
|
|
955
|
-
function _extends() {
|
|
956
|
-
return _extends = Object.assign ? Object.assign.bind() : function(n) {
|
|
957
|
-
for (var e = 1; e < arguments.length; e++) {
|
|
958
|
-
var t = arguments[e];
|
|
959
|
-
for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
|
|
960
|
-
}
|
|
961
|
-
return n;
|
|
962
|
-
}, _extends.apply(null, arguments);
|
|
963
|
-
}
|
|
964
|
-
function ownKeys(e, r) {
|
|
965
|
-
var t = Object.keys(e);
|
|
966
|
-
if (Object.getOwnPropertySymbols) {
|
|
967
|
-
var o = Object.getOwnPropertySymbols(e);
|
|
968
|
-
r && (o = o.filter(function(r$1) {
|
|
969
|
-
return Object.getOwnPropertyDescriptor(e, r$1).enumerable;
|
|
970
|
-
})), t.push.apply(t, o);
|
|
971
|
-
}
|
|
972
|
-
return t;
|
|
973
|
-
}
|
|
974
|
-
function _objectSpread(e) {
|
|
975
|
-
for (var r = 1; r < arguments.length; r++) {
|
|
976
|
-
var t = null != arguments[r] ? arguments[r] : {};
|
|
977
|
-
r % 2 ? ownKeys(Object(t), !0).forEach(function(r$1) {
|
|
978
|
-
_defineProperty(e, r$1, t[r$1]);
|
|
979
|
-
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function(r$1) {
|
|
980
|
-
Object.defineProperty(e, r$1, Object.getOwnPropertyDescriptor(t, r$1));
|
|
981
|
-
});
|
|
982
|
-
}
|
|
983
|
-
return e;
|
|
984
|
-
}
|
|
985
|
-
function _defineProperty(e, r, t) {
|
|
986
|
-
return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
|
|
987
|
-
value: t,
|
|
988
|
-
enumerable: !0,
|
|
989
|
-
configurable: !0,
|
|
990
|
-
writable: !0
|
|
991
|
-
}) : e[r] = t, e;
|
|
992
|
-
}
|
|
993
|
-
function _toPropertyKey(t) {
|
|
994
|
-
var i = _toPrimitive(t, "string");
|
|
995
|
-
return "symbol" == typeof i ? i : i + "";
|
|
996
|
-
}
|
|
997
|
-
function _toPrimitive(t, r) {
|
|
998
|
-
if ("object" != typeof t || !t) return t;
|
|
999
|
-
var e = t[Symbol.toPrimitive];
|
|
1000
|
-
if (void 0 !== e) {
|
|
1001
|
-
var i = e.call(t, r || "default");
|
|
1002
|
-
if ("object" != typeof i) return i;
|
|
1003
|
-
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
1004
|
-
}
|
|
1005
|
-
return ("string" === r ? String : Number)(t);
|
|
1006
|
-
}
|
|
1007
|
-
function _objectWithoutProperties(e, t) {
|
|
1008
|
-
if (null == e) return {};
|
|
1009
|
-
var o, r, i = _objectWithoutPropertiesLoose(e, t);
|
|
1010
|
-
if (Object.getOwnPropertySymbols) {
|
|
1011
|
-
var n = Object.getOwnPropertySymbols(e);
|
|
1012
|
-
for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]);
|
|
1013
|
-
}
|
|
1014
|
-
return i;
|
|
1015
|
-
}
|
|
1016
|
-
function _objectWithoutPropertiesLoose(r, e) {
|
|
1017
|
-
if (null == r) return {};
|
|
1018
|
-
var t = {};
|
|
1019
|
-
for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
|
|
1020
|
-
if (-1 !== e.indexOf(n)) continue;
|
|
1021
|
-
t[n] = r[n];
|
|
1022
|
-
}
|
|
1023
|
-
return t;
|
|
1024
|
-
}
|
|
1025
|
-
function defaultUniqBy(entry) {
|
|
1026
|
-
return entry.value;
|
|
1027
|
-
}
|
|
1028
|
-
function LegendContent(props) {
|
|
1029
|
-
var { contextPayload } = props, otherProps = _objectWithoutProperties(props, _excluded);
|
|
1030
|
-
var finalPayload = getUniqPayload(contextPayload, props.payloadUniqBy, defaultUniqBy);
|
|
1031
|
-
var contentProps = _objectSpread(_objectSpread({}, otherProps), {}, { payload: finalPayload });
|
|
1032
|
-
if (/* @__PURE__ */ React$1.isValidElement(props.content)) return /* @__PURE__ */ React$1.cloneElement(props.content, contentProps);
|
|
1033
|
-
if (typeof props.content === "function") return /* @__PURE__ */ React$1.createElement(props.content, contentProps);
|
|
1034
|
-
return /* @__PURE__ */ React$1.createElement(DefaultLegendContent, contentProps);
|
|
1035
|
-
}
|
|
1036
|
-
function getDefaultPosition(style, props, margin, chartWidth, chartHeight, box) {
|
|
1037
|
-
var { layout, align, verticalAlign } = props;
|
|
1038
|
-
var hPos, vPos;
|
|
1039
|
-
if (!style || (style.left === void 0 || style.left === null) && (style.right === void 0 || style.right === null)) if (align === "center" && layout === "vertical") hPos = { left: ((chartWidth || 0) - box.width) / 2 };
|
|
1040
|
-
else hPos = align === "right" ? { right: margin && margin.right || 0 } : { left: margin && margin.left || 0 };
|
|
1041
|
-
if (!style || (style.top === void 0 || style.top === null) && (style.bottom === void 0 || style.bottom === null)) if (verticalAlign === "middle") vPos = { top: ((chartHeight || 0) - box.height) / 2 };
|
|
1042
|
-
else vPos = verticalAlign === "bottom" ? { bottom: margin && margin.bottom || 0 } : { top: margin && margin.top || 0 };
|
|
1043
|
-
return _objectSpread(_objectSpread({}, hPos), vPos);
|
|
1044
|
-
}
|
|
1045
|
-
function LegendSettingsDispatcher(props) {
|
|
1046
|
-
var dispatch = useAppDispatch();
|
|
1047
|
-
useEffect(() => {
|
|
1048
|
-
dispatch(setLegendSettings(props));
|
|
1049
|
-
}, [dispatch, props]);
|
|
1050
|
-
return null;
|
|
1051
|
-
}
|
|
1052
|
-
function LegendSizeDispatcher(props) {
|
|
1053
|
-
var dispatch = useAppDispatch();
|
|
1054
|
-
useEffect(() => {
|
|
1055
|
-
dispatch(setLegendSize(props));
|
|
1056
|
-
return () => {
|
|
1057
|
-
dispatch(setLegendSize({
|
|
1058
|
-
width: 0,
|
|
1059
|
-
height: 0
|
|
1060
|
-
}));
|
|
1061
|
-
};
|
|
1062
|
-
}, [dispatch, props]);
|
|
1063
|
-
return null;
|
|
1064
|
-
}
|
|
1065
|
-
function getWidthOrHeight(layout, height, width, maxWidth) {
|
|
1066
|
-
if (layout === "vertical" && isNumber(height)) return { height };
|
|
1067
|
-
if (layout === "horizontal") return { width: width || maxWidth };
|
|
1068
|
-
return null;
|
|
1069
|
-
}
|
|
1070
|
-
var legendDefaultProps = {
|
|
1071
|
-
align: "center",
|
|
1072
|
-
iconSize: 14,
|
|
1073
|
-
itemSorter: "value",
|
|
1074
|
-
layout: "horizontal",
|
|
1075
|
-
verticalAlign: "bottom"
|
|
1289
|
+
SidebarMenuButton.displayName = "SidebarGlass.MenuButton";
|
|
1290
|
+
const SidebarMenuAction = forwardRef(({ asChild = false, showOnHover = false, className, ...props }, ref) => {
|
|
1291
|
+
return /* @__PURE__ */ jsx(asChild ? Slot : "button", {
|
|
1292
|
+
ref,
|
|
1293
|
+
"data-sidebar": "menu-action",
|
|
1294
|
+
className: cn("absolute right-1 top-1.5", "flex aspect-square w-5 items-center justify-center", "rounded-md p-0 text-[var(--sidebar-foreground)]/60", "ring-[var(--sidebar-ring)]", "transition-transform hover:bg-[var(--sidebar-accent)]", "hover:text-[var(--sidebar-foreground)]", "focus-visible:outline-none focus-visible:ring-2", "[&>svg]:size-4 [&>svg]:shrink-0", "group-data-[state=collapsed]/sidebar:hidden", showOnHover && "peer-hover/menu-button:opacity-100 group-focus-within/menu-item:opacity-100", showOnHover && "data-[state=open]:opacity-100 md:opacity-0", "after:absolute after:-inset-2 after:md:hidden", className),
|
|
1295
|
+
...props
|
|
1296
|
+
});
|
|
1297
|
+
});
|
|
1298
|
+
SidebarMenuAction.displayName = "SidebarGlass.MenuAction";
|
|
1299
|
+
const SidebarMenuBadge = forwardRef(({ children, className, ...props }, ref) => {
|
|
1300
|
+
return /* @__PURE__ */ jsx("div", {
|
|
1301
|
+
ref,
|
|
1302
|
+
"data-sidebar": "menu-badge",
|
|
1303
|
+
className: cn("pointer-events-none absolute right-1 flex h-5 min-w-5", "select-none items-center justify-center", "rounded-md px-1 text-xs font-medium tabular-nums", "text-[var(--sidebar-foreground)]/60", "group-data-[state=collapsed]/sidebar:hidden", className),
|
|
1304
|
+
...props,
|
|
1305
|
+
children
|
|
1306
|
+
});
|
|
1307
|
+
});
|
|
1308
|
+
SidebarMenuBadge.displayName = "SidebarGlass.MenuBadge";
|
|
1309
|
+
const SidebarMenuSkeleton = forwardRef(({ showIcon = false, className, ...props }, ref) => {
|
|
1310
|
+
const width = "70%";
|
|
1311
|
+
return /* @__PURE__ */ jsxs("div", {
|
|
1312
|
+
ref,
|
|
1313
|
+
"data-sidebar": "menu-skeleton",
|
|
1314
|
+
className: cn("flex h-8 items-center gap-2 rounded-md px-2", className),
|
|
1315
|
+
...props,
|
|
1316
|
+
children: [showIcon && /* @__PURE__ */ jsx(SkeletonGlass, { className: "size-4 rounded-md" }), /* @__PURE__ */ jsx(SkeletonGlass, {
|
|
1317
|
+
className: "h-4 max-w-[var(--skeleton-width)] flex-1",
|
|
1318
|
+
style: { "--skeleton-width": width }
|
|
1319
|
+
})]
|
|
1320
|
+
});
|
|
1321
|
+
});
|
|
1322
|
+
SidebarMenuSkeleton.displayName = "SidebarGlass.MenuSkeleton";
|
|
1323
|
+
var SidebarMenuSubContext = createContext(null);
|
|
1324
|
+
const SidebarMenuSub = forwardRef(({ children, className, ...props }, ref) => {
|
|
1325
|
+
return /* @__PURE__ */ jsx(SidebarMenuSubContext.Provider, {
|
|
1326
|
+
value: { open: true },
|
|
1327
|
+
children: /* @__PURE__ */ jsx("ul", {
|
|
1328
|
+
ref,
|
|
1329
|
+
"data-sidebar": "menu-sub",
|
|
1330
|
+
className: cn("flex min-w-0 flex-col gap-1", "mx-3.5 border-l border-[var(--sidebar-border)] px-2.5 py-0.5", "group-data-[state=collapsed]/sidebar:hidden", className),
|
|
1331
|
+
...props,
|
|
1332
|
+
children
|
|
1333
|
+
})
|
|
1334
|
+
});
|
|
1335
|
+
});
|
|
1336
|
+
SidebarMenuSub.displayName = "SidebarGlass.MenuSub";
|
|
1337
|
+
const SidebarMenuSubItem = forwardRef(({ children, className, ...props }, ref) => {
|
|
1338
|
+
return /* @__PURE__ */ jsx("li", {
|
|
1339
|
+
ref,
|
|
1340
|
+
"data-sidebar": "menu-sub-item",
|
|
1341
|
+
className: cn(className),
|
|
1342
|
+
...props,
|
|
1343
|
+
children
|
|
1344
|
+
});
|
|
1345
|
+
});
|
|
1346
|
+
SidebarMenuSubItem.displayName = "SidebarGlass.MenuSubItem";
|
|
1347
|
+
const SidebarMenuSubButton = forwardRef(({ asChild = false, isActive = false, size = "md", className, ...props }, ref) => {
|
|
1348
|
+
return /* @__PURE__ */ jsx(asChild ? Slot : "a", {
|
|
1349
|
+
ref,
|
|
1350
|
+
"data-sidebar": "menu-sub-button",
|
|
1351
|
+
"data-active": isActive,
|
|
1352
|
+
"data-size": size,
|
|
1353
|
+
className: cn("flex min-w-0 items-center gap-2", "-ml-px rounded-md border-l border-transparent", "text-[var(--sidebar-foreground)]/60", "ring-[var(--sidebar-ring)]", "transition-colors", "hover:border-[var(--sidebar-border)]", "hover:bg-[var(--sidebar-accent)]", "hover:text-[var(--sidebar-accent-foreground)]", "focus-visible:outline-none focus-visible:ring-2", "active:bg-[var(--sidebar-accent)] active:text-[var(--sidebar-accent-foreground)]", "disabled:pointer-events-none disabled:opacity-50", "[&>span:last-child]:truncate", "[&>svg]:size-4 [&>svg]:shrink-0", size === "sm" && "h-7 px-2 text-xs", size === "md" && "h-8 px-2 text-sm", isActive && ["border-[var(--sidebar-primary)]", "text-[var(--sidebar-foreground)]"], className),
|
|
1354
|
+
...props
|
|
1355
|
+
});
|
|
1356
|
+
});
|
|
1357
|
+
SidebarMenuSubButton.displayName = "SidebarGlass.MenuSubButton";
|
|
1358
|
+
const SidebarGlass = {
|
|
1359
|
+
Provider: SidebarProvider,
|
|
1360
|
+
Root: SidebarRoot,
|
|
1361
|
+
Header: SidebarHeader,
|
|
1362
|
+
Content: SidebarContent,
|
|
1363
|
+
Footer: SidebarFooter,
|
|
1364
|
+
Rail: SidebarRail,
|
|
1365
|
+
Inset: SidebarInset,
|
|
1366
|
+
Trigger: SidebarTrigger,
|
|
1367
|
+
Separator: SidebarSeparator,
|
|
1368
|
+
Group: SidebarGroup,
|
|
1369
|
+
GroupLabel: SidebarGroupLabel,
|
|
1370
|
+
GroupAction: SidebarGroupAction,
|
|
1371
|
+
GroupContent: SidebarGroupContent,
|
|
1372
|
+
Menu: SidebarMenu,
|
|
1373
|
+
MenuItem: SidebarMenuItem,
|
|
1374
|
+
MenuButton: SidebarMenuButton,
|
|
1375
|
+
MenuAction: SidebarMenuAction,
|
|
1376
|
+
MenuBadge: SidebarMenuBadge,
|
|
1377
|
+
MenuSkeleton: SidebarMenuSkeleton,
|
|
1378
|
+
MenuSub: SidebarMenuSub,
|
|
1379
|
+
MenuSubItem: SidebarMenuSubItem,
|
|
1380
|
+
MenuSubButton: SidebarMenuSubButton
|
|
1076
1381
|
};
|
|
1077
|
-
|
|
1078
|
-
|
|
1079
|
-
|
|
1080
|
-
|
|
1081
|
-
|
|
1082
|
-
|
|
1083
|
-
|
|
1084
|
-
|
|
1085
|
-
|
|
1086
|
-
|
|
1087
|
-
|
|
1088
|
-
|
|
1089
|
-
|
|
1090
|
-
|
|
1091
|
-
|
|
1092
|
-
|
|
1093
|
-
}
|
|
1094
|
-
|
|
1095
|
-
|
|
1096
|
-
|
|
1097
|
-
|
|
1098
|
-
style: outerStyle,
|
|
1099
|
-
ref: updateBoundingBox
|
|
1100
|
-
}, /* @__PURE__ */ React$1.createElement(LegendSettingsDispatcher, {
|
|
1101
|
-
layout: props.layout,
|
|
1102
|
-
align: props.align,
|
|
1103
|
-
verticalAlign: props.verticalAlign,
|
|
1104
|
-
itemSorter: props.itemSorter
|
|
1105
|
-
}), !portalFromProps && /* @__PURE__ */ React$1.createElement(LegendSizeDispatcher, {
|
|
1106
|
-
width: lastBoundingBox.width,
|
|
1107
|
-
height: lastBoundingBox.height
|
|
1108
|
-
}), /* @__PURE__ */ React$1.createElement(LegendContent, _extends({}, props, widthOrHeight, {
|
|
1109
|
-
margin,
|
|
1110
|
-
chartWidth,
|
|
1111
|
-
chartHeight,
|
|
1112
|
-
contextPayload
|
|
1113
|
-
}))), legendPortal);
|
|
1382
|
+
var NAME = "Separator";
|
|
1383
|
+
var DEFAULT_ORIENTATION = "horizontal";
|
|
1384
|
+
var ORIENTATIONS = ["horizontal", "vertical"];
|
|
1385
|
+
var Separator = React$1.forwardRef((props, forwardedRef) => {
|
|
1386
|
+
const { decorative, orientation: orientationProp = DEFAULT_ORIENTATION, ...domProps } = props;
|
|
1387
|
+
const orientation = isValidOrientation(orientationProp) ? orientationProp : DEFAULT_ORIENTATION;
|
|
1388
|
+
const ariaOrientation = orientation === "vertical" ? orientation : void 0;
|
|
1389
|
+
const semanticProps = decorative ? { role: "none" } : {
|
|
1390
|
+
"aria-orientation": ariaOrientation,
|
|
1391
|
+
role: "separator"
|
|
1392
|
+
};
|
|
1393
|
+
return /* @__PURE__ */ jsx(Primitive$3.div, {
|
|
1394
|
+
"data-orientation": orientation,
|
|
1395
|
+
...semanticProps,
|
|
1396
|
+
...domProps,
|
|
1397
|
+
ref: forwardedRef
|
|
1398
|
+
});
|
|
1399
|
+
});
|
|
1400
|
+
Separator.displayName = NAME;
|
|
1401
|
+
function isValidOrientation(orientation) {
|
|
1402
|
+
return ORIENTATIONS.includes(orientation);
|
|
1114
1403
|
}
|
|
1115
|
-
|
|
1116
|
-
var
|
|
1404
|
+
var Root$2 = Separator;
|
|
1405
|
+
var SeparatorGlass = React$1.forwardRef(({ className, orientation = "horizontal", decorative = true, ...props }, ref) => /* @__PURE__ */ jsx(Root$2, {
|
|
1406
|
+
ref,
|
|
1407
|
+
decorative,
|
|
1408
|
+
orientation,
|
|
1409
|
+
className: cn("shrink-0", "bg-[var(--separator-bg,var(--glass-border))]", orientation === "horizontal" ? "h-px w-full" : "h-full w-px", className),
|
|
1410
|
+
...props
|
|
1411
|
+
}));
|
|
1412
|
+
SeparatorGlass.displayName = "SeparatorGlass";
|
|
1413
|
+
var Primitive$2 = [
|
|
1117
1414
|
"a",
|
|
1118
1415
|
"button",
|
|
1119
1416
|
"div",
|
|
@@ -1148,7 +1445,7 @@ var Primitive = [
|
|
|
1148
1445
|
[node]: Node
|
|
1149
1446
|
};
|
|
1150
1447
|
}, {});
|
|
1151
|
-
function createContextScope(scopeName, createContextScopeDeps = []) {
|
|
1448
|
+
function createContextScope$2(scopeName, createContextScopeDeps = []) {
|
|
1152
1449
|
let defaultContexts = [];
|
|
1153
1450
|
function createContext3(rootComponentName, defaultContext) {
|
|
1154
1451
|
const BaseContext = React$1.createContext(defaultContext);
|
|
@@ -1186,9 +1483,9 @@ function createContextScope(scopeName, createContextScopeDeps = []) {
|
|
|
1186
1483
|
};
|
|
1187
1484
|
};
|
|
1188
1485
|
createScope.scopeName = scopeName;
|
|
1189
|
-
return [createContext3, composeContextScopes(createScope, ...createContextScopeDeps)];
|
|
1486
|
+
return [createContext3, composeContextScopes$2(createScope, ...createContextScopeDeps)];
|
|
1190
1487
|
}
|
|
1191
|
-
function composeContextScopes(...scopes) {
|
|
1488
|
+
function composeContextScopes$2(...scopes) {
|
|
1192
1489
|
const baseScope = scopes[0];
|
|
1193
1490
|
if (scopes.length === 1) return baseScope;
|
|
1194
1491
|
const createScope = () => {
|
|
@@ -1216,7 +1513,7 @@ function useStateMachine(initialState, machine) {
|
|
|
1216
1513
|
}, initialState);
|
|
1217
1514
|
}
|
|
1218
1515
|
var SCROLL_AREA_NAME = "ScrollArea";
|
|
1219
|
-
var [createScrollAreaContext, createScrollAreaScope] = createContextScope(SCROLL_AREA_NAME);
|
|
1516
|
+
var [createScrollAreaContext, createScrollAreaScope] = createContextScope$2(SCROLL_AREA_NAME);
|
|
1220
1517
|
var [ScrollAreaProvider, useScrollAreaContext] = createScrollAreaContext(SCROLL_AREA_NAME);
|
|
1221
1518
|
var ScrollArea$1 = React$1.forwardRef((props, forwardedRef) => {
|
|
1222
1519
|
const { __scopeScrollArea, type = "hover", dir, scrollHideDelay = 600, ...scrollAreaProps } = props;
|
|
@@ -1251,7 +1548,7 @@ var ScrollArea$1 = React$1.forwardRef((props, forwardedRef) => {
|
|
|
1251
1548
|
onScrollbarYEnabledChange: setScrollbarYEnabled,
|
|
1252
1549
|
onCornerWidthChange: setCornerWidth,
|
|
1253
1550
|
onCornerHeightChange: setCornerHeight,
|
|
1254
|
-
children: /* @__PURE__ */ jsx(Primitive.div, {
|
|
1551
|
+
children: /* @__PURE__ */ jsx(Primitive$2.div, {
|
|
1255
1552
|
dir: direction,
|
|
1256
1553
|
...scrollAreaProps,
|
|
1257
1554
|
ref: composedRefs,
|
|
@@ -1273,7 +1570,7 @@ var ScrollAreaViewport = React$1.forwardRef((props, forwardedRef) => {
|
|
|
1273
1570
|
return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("style", {
|
|
1274
1571
|
dangerouslySetInnerHTML: { __html: `[data-radix-scroll-area-viewport]{scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch;}[data-radix-scroll-area-viewport]::-webkit-scrollbar{display:none}` },
|
|
1275
1572
|
nonce
|
|
1276
|
-
}), /* @__PURE__ */ jsx(Primitive.div, {
|
|
1573
|
+
}), /* @__PURE__ */ jsx(Primitive$2.div, {
|
|
1277
1574
|
"data-radix-scroll-area-viewport": "",
|
|
1278
1575
|
...viewportProps,
|
|
1279
1576
|
ref: composedRefs,
|
|
@@ -1290,583 +1587,1574 @@ var ScrollAreaViewport = React$1.forwardRef((props, forwardedRef) => {
|
|
|
1290
1587
|
},
|
|
1291
1588
|
children
|
|
1292
1589
|
})
|
|
1293
|
-
})] });
|
|
1590
|
+
})] });
|
|
1591
|
+
});
|
|
1592
|
+
ScrollAreaViewport.displayName = VIEWPORT_NAME;
|
|
1593
|
+
var SCROLLBAR_NAME = "ScrollAreaScrollbar";
|
|
1594
|
+
var ScrollAreaScrollbar = React$1.forwardRef((props, forwardedRef) => {
|
|
1595
|
+
const { forceMount, ...scrollbarProps } = props;
|
|
1596
|
+
const context = useScrollAreaContext(SCROLLBAR_NAME, props.__scopeScrollArea);
|
|
1597
|
+
const { onScrollbarXEnabledChange, onScrollbarYEnabledChange } = context;
|
|
1598
|
+
const isHorizontal = props.orientation === "horizontal";
|
|
1599
|
+
React$1.useEffect(() => {
|
|
1600
|
+
isHorizontal ? onScrollbarXEnabledChange(true) : onScrollbarYEnabledChange(true);
|
|
1601
|
+
return () => {
|
|
1602
|
+
isHorizontal ? onScrollbarXEnabledChange(false) : onScrollbarYEnabledChange(false);
|
|
1603
|
+
};
|
|
1604
|
+
}, [
|
|
1605
|
+
isHorizontal,
|
|
1606
|
+
onScrollbarXEnabledChange,
|
|
1607
|
+
onScrollbarYEnabledChange
|
|
1608
|
+
]);
|
|
1609
|
+
return context.type === "hover" ? /* @__PURE__ */ jsx(ScrollAreaScrollbarHover, {
|
|
1610
|
+
...scrollbarProps,
|
|
1611
|
+
ref: forwardedRef,
|
|
1612
|
+
forceMount
|
|
1613
|
+
}) : context.type === "scroll" ? /* @__PURE__ */ jsx(ScrollAreaScrollbarScroll, {
|
|
1614
|
+
...scrollbarProps,
|
|
1615
|
+
ref: forwardedRef,
|
|
1616
|
+
forceMount
|
|
1617
|
+
}) : context.type === "auto" ? /* @__PURE__ */ jsx(ScrollAreaScrollbarAuto, {
|
|
1618
|
+
...scrollbarProps,
|
|
1619
|
+
ref: forwardedRef,
|
|
1620
|
+
forceMount
|
|
1621
|
+
}) : context.type === "always" ? /* @__PURE__ */ jsx(ScrollAreaScrollbarVisible, {
|
|
1622
|
+
...scrollbarProps,
|
|
1623
|
+
ref: forwardedRef
|
|
1624
|
+
}) : null;
|
|
1625
|
+
});
|
|
1626
|
+
ScrollAreaScrollbar.displayName = SCROLLBAR_NAME;
|
|
1627
|
+
var ScrollAreaScrollbarHover = React$1.forwardRef((props, forwardedRef) => {
|
|
1628
|
+
const { forceMount, ...scrollbarProps } = props;
|
|
1629
|
+
const context = useScrollAreaContext(SCROLLBAR_NAME, props.__scopeScrollArea);
|
|
1630
|
+
const [visible, setVisible] = React$1.useState(false);
|
|
1631
|
+
React$1.useEffect(() => {
|
|
1632
|
+
const scrollArea = context.scrollArea;
|
|
1633
|
+
let hideTimer = 0;
|
|
1634
|
+
if (scrollArea) {
|
|
1635
|
+
const handlePointerEnter = () => {
|
|
1636
|
+
window.clearTimeout(hideTimer);
|
|
1637
|
+
setVisible(true);
|
|
1638
|
+
};
|
|
1639
|
+
const handlePointerLeave = () => {
|
|
1640
|
+
hideTimer = window.setTimeout(() => setVisible(false), context.scrollHideDelay);
|
|
1641
|
+
};
|
|
1642
|
+
scrollArea.addEventListener("pointerenter", handlePointerEnter);
|
|
1643
|
+
scrollArea.addEventListener("pointerleave", handlePointerLeave);
|
|
1644
|
+
return () => {
|
|
1645
|
+
window.clearTimeout(hideTimer);
|
|
1646
|
+
scrollArea.removeEventListener("pointerenter", handlePointerEnter);
|
|
1647
|
+
scrollArea.removeEventListener("pointerleave", handlePointerLeave);
|
|
1648
|
+
};
|
|
1649
|
+
}
|
|
1650
|
+
}, [context.scrollArea, context.scrollHideDelay]);
|
|
1651
|
+
return /* @__PURE__ */ jsx(Presence, {
|
|
1652
|
+
present: forceMount || visible,
|
|
1653
|
+
children: /* @__PURE__ */ jsx(ScrollAreaScrollbarAuto, {
|
|
1654
|
+
"data-state": visible ? "visible" : "hidden",
|
|
1655
|
+
...scrollbarProps,
|
|
1656
|
+
ref: forwardedRef
|
|
1657
|
+
})
|
|
1658
|
+
});
|
|
1659
|
+
});
|
|
1660
|
+
var ScrollAreaScrollbarScroll = React$1.forwardRef((props, forwardedRef) => {
|
|
1661
|
+
const { forceMount, ...scrollbarProps } = props;
|
|
1662
|
+
const context = useScrollAreaContext(SCROLLBAR_NAME, props.__scopeScrollArea);
|
|
1663
|
+
const isHorizontal = props.orientation === "horizontal";
|
|
1664
|
+
const debounceScrollEnd = useDebounceCallback(() => send("SCROLL_END"), 100);
|
|
1665
|
+
const [state, send] = useStateMachine("hidden", {
|
|
1666
|
+
hidden: { SCROLL: "scrolling" },
|
|
1667
|
+
scrolling: {
|
|
1668
|
+
SCROLL_END: "idle",
|
|
1669
|
+
POINTER_ENTER: "interacting"
|
|
1670
|
+
},
|
|
1671
|
+
interacting: {
|
|
1672
|
+
SCROLL: "interacting",
|
|
1673
|
+
POINTER_LEAVE: "idle"
|
|
1674
|
+
},
|
|
1675
|
+
idle: {
|
|
1676
|
+
HIDE: "hidden",
|
|
1677
|
+
SCROLL: "scrolling",
|
|
1678
|
+
POINTER_ENTER: "interacting"
|
|
1679
|
+
}
|
|
1680
|
+
});
|
|
1681
|
+
React$1.useEffect(() => {
|
|
1682
|
+
if (state === "idle") {
|
|
1683
|
+
const hideTimer = window.setTimeout(() => send("HIDE"), context.scrollHideDelay);
|
|
1684
|
+
return () => window.clearTimeout(hideTimer);
|
|
1685
|
+
}
|
|
1686
|
+
}, [
|
|
1687
|
+
state,
|
|
1688
|
+
context.scrollHideDelay,
|
|
1689
|
+
send
|
|
1690
|
+
]);
|
|
1691
|
+
React$1.useEffect(() => {
|
|
1692
|
+
const viewport = context.viewport;
|
|
1693
|
+
const scrollDirection = isHorizontal ? "scrollLeft" : "scrollTop";
|
|
1694
|
+
if (viewport) {
|
|
1695
|
+
let prevScrollPos = viewport[scrollDirection];
|
|
1696
|
+
const handleScroll = () => {
|
|
1697
|
+
const scrollPos = viewport[scrollDirection];
|
|
1698
|
+
if (prevScrollPos !== scrollPos) {
|
|
1699
|
+
send("SCROLL");
|
|
1700
|
+
debounceScrollEnd();
|
|
1701
|
+
}
|
|
1702
|
+
prevScrollPos = scrollPos;
|
|
1703
|
+
};
|
|
1704
|
+
viewport.addEventListener("scroll", handleScroll);
|
|
1705
|
+
return () => viewport.removeEventListener("scroll", handleScroll);
|
|
1706
|
+
}
|
|
1707
|
+
}, [
|
|
1708
|
+
context.viewport,
|
|
1709
|
+
isHorizontal,
|
|
1710
|
+
send,
|
|
1711
|
+
debounceScrollEnd
|
|
1712
|
+
]);
|
|
1713
|
+
return /* @__PURE__ */ jsx(Presence, {
|
|
1714
|
+
present: forceMount || state !== "hidden",
|
|
1715
|
+
children: /* @__PURE__ */ jsx(ScrollAreaScrollbarVisible, {
|
|
1716
|
+
"data-state": state === "hidden" ? "hidden" : "visible",
|
|
1717
|
+
...scrollbarProps,
|
|
1718
|
+
ref: forwardedRef,
|
|
1719
|
+
onPointerEnter: composeEventHandlers(props.onPointerEnter, () => send("POINTER_ENTER")),
|
|
1720
|
+
onPointerLeave: composeEventHandlers(props.onPointerLeave, () => send("POINTER_LEAVE"))
|
|
1721
|
+
})
|
|
1722
|
+
});
|
|
1294
1723
|
});
|
|
1295
|
-
|
|
1296
|
-
var SCROLLBAR_NAME = "ScrollAreaScrollbar";
|
|
1297
|
-
var ScrollAreaScrollbar = React$1.forwardRef((props, forwardedRef) => {
|
|
1298
|
-
const { forceMount, ...scrollbarProps } = props;
|
|
1724
|
+
var ScrollAreaScrollbarAuto = React$1.forwardRef((props, forwardedRef) => {
|
|
1299
1725
|
const context = useScrollAreaContext(SCROLLBAR_NAME, props.__scopeScrollArea);
|
|
1300
|
-
const {
|
|
1726
|
+
const { forceMount, ...scrollbarProps } = props;
|
|
1727
|
+
const [visible, setVisible] = React$1.useState(false);
|
|
1301
1728
|
const isHorizontal = props.orientation === "horizontal";
|
|
1302
|
-
|
|
1303
|
-
|
|
1304
|
-
|
|
1305
|
-
|
|
1306
|
-
|
|
1307
|
-
|
|
1308
|
-
|
|
1309
|
-
|
|
1310
|
-
|
|
1311
|
-
|
|
1312
|
-
|
|
1313
|
-
|
|
1314
|
-
|
|
1315
|
-
|
|
1316
|
-
|
|
1729
|
+
const handleResize = useDebounceCallback(() => {
|
|
1730
|
+
if (context.viewport) {
|
|
1731
|
+
const isOverflowX = context.viewport.offsetWidth < context.viewport.scrollWidth;
|
|
1732
|
+
const isOverflowY = context.viewport.offsetHeight < context.viewport.scrollHeight;
|
|
1733
|
+
setVisible(isHorizontal ? isOverflowX : isOverflowY);
|
|
1734
|
+
}
|
|
1735
|
+
}, 10);
|
|
1736
|
+
useResizeObserver(context.viewport, handleResize);
|
|
1737
|
+
useResizeObserver(context.content, handleResize);
|
|
1738
|
+
return /* @__PURE__ */ jsx(Presence, {
|
|
1739
|
+
present: forceMount || visible,
|
|
1740
|
+
children: /* @__PURE__ */ jsx(ScrollAreaScrollbarVisible, {
|
|
1741
|
+
"data-state": visible ? "visible" : "hidden",
|
|
1742
|
+
...scrollbarProps,
|
|
1743
|
+
ref: forwardedRef
|
|
1744
|
+
})
|
|
1745
|
+
});
|
|
1746
|
+
});
|
|
1747
|
+
var ScrollAreaScrollbarVisible = React$1.forwardRef((props, forwardedRef) => {
|
|
1748
|
+
const { orientation = "vertical", ...scrollbarProps } = props;
|
|
1749
|
+
const context = useScrollAreaContext(SCROLLBAR_NAME, props.__scopeScrollArea);
|
|
1750
|
+
const thumbRef = React$1.useRef(null);
|
|
1751
|
+
const pointerOffsetRef = React$1.useRef(0);
|
|
1752
|
+
const [sizes, setSizes] = React$1.useState({
|
|
1753
|
+
content: 0,
|
|
1754
|
+
viewport: 0,
|
|
1755
|
+
scrollbar: {
|
|
1756
|
+
size: 0,
|
|
1757
|
+
paddingStart: 0,
|
|
1758
|
+
paddingEnd: 0
|
|
1759
|
+
}
|
|
1760
|
+
});
|
|
1761
|
+
const thumbRatio = getThumbRatio(sizes.viewport, sizes.content);
|
|
1762
|
+
const commonProps = {
|
|
1317
1763
|
...scrollbarProps,
|
|
1764
|
+
sizes,
|
|
1765
|
+
onSizesChange: setSizes,
|
|
1766
|
+
hasThumb: Boolean(thumbRatio > 0 && thumbRatio < 1),
|
|
1767
|
+
onThumbChange: (thumb) => thumbRef.current = thumb,
|
|
1768
|
+
onThumbPointerUp: () => pointerOffsetRef.current = 0,
|
|
1769
|
+
onThumbPointerDown: (pointerPos) => pointerOffsetRef.current = pointerPos
|
|
1770
|
+
};
|
|
1771
|
+
function getScrollPosition(pointerPos, dir) {
|
|
1772
|
+
return getScrollPositionFromPointer(pointerPos, pointerOffsetRef.current, sizes, dir);
|
|
1773
|
+
}
|
|
1774
|
+
if (orientation === "horizontal") return /* @__PURE__ */ jsx(ScrollAreaScrollbarX, {
|
|
1775
|
+
...commonProps,
|
|
1318
1776
|
ref: forwardedRef,
|
|
1319
|
-
|
|
1320
|
-
|
|
1321
|
-
|
|
1777
|
+
onThumbPositionChange: () => {
|
|
1778
|
+
if (context.viewport && thumbRef.current) {
|
|
1779
|
+
const scrollPos = context.viewport.scrollLeft;
|
|
1780
|
+
const offset = getThumbOffsetFromScroll(scrollPos, sizes, context.dir);
|
|
1781
|
+
thumbRef.current.style.transform = `translate3d(${offset}px, 0, 0)`;
|
|
1782
|
+
}
|
|
1783
|
+
},
|
|
1784
|
+
onWheelScroll: (scrollPos) => {
|
|
1785
|
+
if (context.viewport) context.viewport.scrollLeft = scrollPos;
|
|
1786
|
+
},
|
|
1787
|
+
onDragScroll: (pointerPos) => {
|
|
1788
|
+
if (context.viewport) context.viewport.scrollLeft = getScrollPosition(pointerPos, context.dir);
|
|
1789
|
+
}
|
|
1790
|
+
});
|
|
1791
|
+
if (orientation === "vertical") return /* @__PURE__ */ jsx(ScrollAreaScrollbarY, {
|
|
1792
|
+
...commonProps,
|
|
1322
1793
|
ref: forwardedRef,
|
|
1323
|
-
|
|
1324
|
-
|
|
1794
|
+
onThumbPositionChange: () => {
|
|
1795
|
+
if (context.viewport && thumbRef.current) {
|
|
1796
|
+
const scrollPos = context.viewport.scrollTop;
|
|
1797
|
+
const offset = getThumbOffsetFromScroll(scrollPos, sizes);
|
|
1798
|
+
thumbRef.current.style.transform = `translate3d(0, ${offset}px, 0)`;
|
|
1799
|
+
}
|
|
1800
|
+
},
|
|
1801
|
+
onWheelScroll: (scrollPos) => {
|
|
1802
|
+
if (context.viewport) context.viewport.scrollTop = scrollPos;
|
|
1803
|
+
},
|
|
1804
|
+
onDragScroll: (pointerPos) => {
|
|
1805
|
+
if (context.viewport) context.viewport.scrollTop = getScrollPosition(pointerPos);
|
|
1806
|
+
}
|
|
1807
|
+
});
|
|
1808
|
+
return null;
|
|
1809
|
+
});
|
|
1810
|
+
var ScrollAreaScrollbarX = React$1.forwardRef((props, forwardedRef) => {
|
|
1811
|
+
const { sizes, onSizesChange, ...scrollbarProps } = props;
|
|
1812
|
+
const context = useScrollAreaContext(SCROLLBAR_NAME, props.__scopeScrollArea);
|
|
1813
|
+
const [computedStyle, setComputedStyle] = React$1.useState();
|
|
1814
|
+
const ref = React$1.useRef(null);
|
|
1815
|
+
const composeRefs = useComposedRefs(forwardedRef, ref, context.onScrollbarXChange);
|
|
1816
|
+
React$1.useEffect(() => {
|
|
1817
|
+
if (ref.current) setComputedStyle(getComputedStyle(ref.current));
|
|
1818
|
+
}, [ref]);
|
|
1819
|
+
return /* @__PURE__ */ jsx(ScrollAreaScrollbarImpl, {
|
|
1820
|
+
"data-orientation": "horizontal",
|
|
1325
1821
|
...scrollbarProps,
|
|
1326
|
-
ref:
|
|
1327
|
-
|
|
1822
|
+
ref: composeRefs,
|
|
1823
|
+
sizes,
|
|
1824
|
+
style: {
|
|
1825
|
+
bottom: 0,
|
|
1826
|
+
left: context.dir === "rtl" ? "var(--radix-scroll-area-corner-width)" : 0,
|
|
1827
|
+
right: context.dir === "ltr" ? "var(--radix-scroll-area-corner-width)" : 0,
|
|
1828
|
+
["--radix-scroll-area-thumb-width"]: getThumbSize(sizes) + "px",
|
|
1829
|
+
...props.style
|
|
1830
|
+
},
|
|
1831
|
+
onThumbPointerDown: (pointerPos) => props.onThumbPointerDown(pointerPos.x),
|
|
1832
|
+
onDragScroll: (pointerPos) => props.onDragScroll(pointerPos.x),
|
|
1833
|
+
onWheelScroll: (event, maxScrollPos) => {
|
|
1834
|
+
if (context.viewport) {
|
|
1835
|
+
const scrollPos = context.viewport.scrollLeft + event.deltaX;
|
|
1836
|
+
props.onWheelScroll(scrollPos);
|
|
1837
|
+
if (isScrollingWithinScrollbarBounds(scrollPos, maxScrollPos)) event.preventDefault();
|
|
1838
|
+
}
|
|
1839
|
+
},
|
|
1840
|
+
onResize: () => {
|
|
1841
|
+
if (ref.current && context.viewport && computedStyle) onSizesChange({
|
|
1842
|
+
content: context.viewport.scrollWidth,
|
|
1843
|
+
viewport: context.viewport.offsetWidth,
|
|
1844
|
+
scrollbar: {
|
|
1845
|
+
size: ref.current.clientWidth,
|
|
1846
|
+
paddingStart: toInt(computedStyle.paddingLeft),
|
|
1847
|
+
paddingEnd: toInt(computedStyle.paddingRight)
|
|
1848
|
+
}
|
|
1849
|
+
});
|
|
1850
|
+
}
|
|
1851
|
+
});
|
|
1328
1852
|
});
|
|
1329
|
-
|
|
1330
|
-
|
|
1331
|
-
const { forceMount, ...scrollbarProps } = props;
|
|
1853
|
+
var ScrollAreaScrollbarY = React$1.forwardRef((props, forwardedRef) => {
|
|
1854
|
+
const { sizes, onSizesChange, ...scrollbarProps } = props;
|
|
1332
1855
|
const context = useScrollAreaContext(SCROLLBAR_NAME, props.__scopeScrollArea);
|
|
1333
|
-
const [
|
|
1856
|
+
const [computedStyle, setComputedStyle] = React$1.useState();
|
|
1857
|
+
const ref = React$1.useRef(null);
|
|
1858
|
+
const composeRefs = useComposedRefs(forwardedRef, ref, context.onScrollbarYChange);
|
|
1334
1859
|
React$1.useEffect(() => {
|
|
1335
|
-
|
|
1336
|
-
|
|
1337
|
-
|
|
1338
|
-
|
|
1339
|
-
|
|
1340
|
-
|
|
1341
|
-
|
|
1342
|
-
|
|
1343
|
-
|
|
1344
|
-
|
|
1345
|
-
|
|
1346
|
-
|
|
1347
|
-
|
|
1348
|
-
|
|
1349
|
-
|
|
1350
|
-
|
|
1351
|
-
|
|
1860
|
+
if (ref.current) setComputedStyle(getComputedStyle(ref.current));
|
|
1861
|
+
}, [ref]);
|
|
1862
|
+
return /* @__PURE__ */ jsx(ScrollAreaScrollbarImpl, {
|
|
1863
|
+
"data-orientation": "vertical",
|
|
1864
|
+
...scrollbarProps,
|
|
1865
|
+
ref: composeRefs,
|
|
1866
|
+
sizes,
|
|
1867
|
+
style: {
|
|
1868
|
+
top: 0,
|
|
1869
|
+
right: context.dir === "ltr" ? 0 : void 0,
|
|
1870
|
+
left: context.dir === "rtl" ? 0 : void 0,
|
|
1871
|
+
bottom: "var(--radix-scroll-area-corner-height)",
|
|
1872
|
+
["--radix-scroll-area-thumb-height"]: getThumbSize(sizes) + "px",
|
|
1873
|
+
...props.style
|
|
1874
|
+
},
|
|
1875
|
+
onThumbPointerDown: (pointerPos) => props.onThumbPointerDown(pointerPos.y),
|
|
1876
|
+
onDragScroll: (pointerPos) => props.onDragScroll(pointerPos.y),
|
|
1877
|
+
onWheelScroll: (event, maxScrollPos) => {
|
|
1878
|
+
if (context.viewport) {
|
|
1879
|
+
const scrollPos = context.viewport.scrollTop + event.deltaY;
|
|
1880
|
+
props.onWheelScroll(scrollPos);
|
|
1881
|
+
if (isScrollingWithinScrollbarBounds(scrollPos, maxScrollPos)) event.preventDefault();
|
|
1882
|
+
}
|
|
1883
|
+
},
|
|
1884
|
+
onResize: () => {
|
|
1885
|
+
if (ref.current && context.viewport && computedStyle) onSizesChange({
|
|
1886
|
+
content: context.viewport.scrollHeight,
|
|
1887
|
+
viewport: context.viewport.offsetHeight,
|
|
1888
|
+
scrollbar: {
|
|
1889
|
+
size: ref.current.clientHeight,
|
|
1890
|
+
paddingStart: toInt(computedStyle.paddingTop),
|
|
1891
|
+
paddingEnd: toInt(computedStyle.paddingBottom)
|
|
1892
|
+
}
|
|
1893
|
+
});
|
|
1352
1894
|
}
|
|
1353
|
-
}
|
|
1354
|
-
|
|
1355
|
-
|
|
1356
|
-
|
|
1357
|
-
|
|
1895
|
+
});
|
|
1896
|
+
});
|
|
1897
|
+
var [ScrollbarProvider, useScrollbarContext] = createScrollAreaContext(SCROLLBAR_NAME);
|
|
1898
|
+
var ScrollAreaScrollbarImpl = React$1.forwardRef((props, forwardedRef) => {
|
|
1899
|
+
const { __scopeScrollArea, sizes, hasThumb, onThumbChange, onThumbPointerUp, onThumbPointerDown, onThumbPositionChange, onDragScroll, onWheelScroll, onResize, ...scrollbarProps } = props;
|
|
1900
|
+
const context = useScrollAreaContext(SCROLLBAR_NAME, __scopeScrollArea);
|
|
1901
|
+
const [scrollbar, setScrollbar] = React$1.useState(null);
|
|
1902
|
+
const composeRefs = useComposedRefs(forwardedRef, (node) => setScrollbar(node));
|
|
1903
|
+
const rectRef = React$1.useRef(null);
|
|
1904
|
+
const prevWebkitUserSelectRef = React$1.useRef("");
|
|
1905
|
+
const viewport = context.viewport;
|
|
1906
|
+
const maxScrollPos = sizes.content - sizes.viewport;
|
|
1907
|
+
const handleWheelScroll = useCallbackRef(onWheelScroll);
|
|
1908
|
+
const handleThumbPositionChange = useCallbackRef(onThumbPositionChange);
|
|
1909
|
+
const handleResize = useDebounceCallback(onResize, 10);
|
|
1910
|
+
function handleDragScroll(event) {
|
|
1911
|
+
if (rectRef.current) onDragScroll({
|
|
1912
|
+
x: event.clientX - rectRef.current.left,
|
|
1913
|
+
y: event.clientY - rectRef.current.top
|
|
1914
|
+
});
|
|
1915
|
+
}
|
|
1916
|
+
React$1.useEffect(() => {
|
|
1917
|
+
const handleWheel = (event) => {
|
|
1918
|
+
const element = event.target;
|
|
1919
|
+
if (scrollbar?.contains(element)) handleWheelScroll(event, maxScrollPos);
|
|
1920
|
+
};
|
|
1921
|
+
document.addEventListener("wheel", handleWheel, { passive: false });
|
|
1922
|
+
return () => document.removeEventListener("wheel", handleWheel, { passive: false });
|
|
1923
|
+
}, [
|
|
1924
|
+
viewport,
|
|
1925
|
+
scrollbar,
|
|
1926
|
+
maxScrollPos,
|
|
1927
|
+
handleWheelScroll
|
|
1928
|
+
]);
|
|
1929
|
+
React$1.useEffect(handleThumbPositionChange, [sizes, handleThumbPositionChange]);
|
|
1930
|
+
useResizeObserver(scrollbar, handleResize);
|
|
1931
|
+
useResizeObserver(context.content, handleResize);
|
|
1932
|
+
return /* @__PURE__ */ jsx(ScrollbarProvider, {
|
|
1933
|
+
scope: __scopeScrollArea,
|
|
1934
|
+
scrollbar,
|
|
1935
|
+
hasThumb,
|
|
1936
|
+
onThumbChange: useCallbackRef(onThumbChange),
|
|
1937
|
+
onThumbPointerUp: useCallbackRef(onThumbPointerUp),
|
|
1938
|
+
onThumbPositionChange: handleThumbPositionChange,
|
|
1939
|
+
onThumbPointerDown: useCallbackRef(onThumbPointerDown),
|
|
1940
|
+
children: /* @__PURE__ */ jsx(Primitive$2.div, {
|
|
1358
1941
|
...scrollbarProps,
|
|
1359
|
-
ref:
|
|
1942
|
+
ref: composeRefs,
|
|
1943
|
+
style: {
|
|
1944
|
+
position: "absolute",
|
|
1945
|
+
...scrollbarProps.style
|
|
1946
|
+
},
|
|
1947
|
+
onPointerDown: composeEventHandlers(props.onPointerDown, (event) => {
|
|
1948
|
+
if (event.button === 0) {
|
|
1949
|
+
event.target.setPointerCapture(event.pointerId);
|
|
1950
|
+
rectRef.current = scrollbar.getBoundingClientRect();
|
|
1951
|
+
prevWebkitUserSelectRef.current = document.body.style.webkitUserSelect;
|
|
1952
|
+
document.body.style.webkitUserSelect = "none";
|
|
1953
|
+
if (context.viewport) context.viewport.style.scrollBehavior = "auto";
|
|
1954
|
+
handleDragScroll(event);
|
|
1955
|
+
}
|
|
1956
|
+
}),
|
|
1957
|
+
onPointerMove: composeEventHandlers(props.onPointerMove, handleDragScroll),
|
|
1958
|
+
onPointerUp: composeEventHandlers(props.onPointerUp, (event) => {
|
|
1959
|
+
const element = event.target;
|
|
1960
|
+
if (element.hasPointerCapture(event.pointerId)) element.releasePointerCapture(event.pointerId);
|
|
1961
|
+
document.body.style.webkitUserSelect = prevWebkitUserSelectRef.current;
|
|
1962
|
+
if (context.viewport) context.viewport.style.scrollBehavior = "";
|
|
1963
|
+
rectRef.current = null;
|
|
1964
|
+
})
|
|
1360
1965
|
})
|
|
1361
1966
|
});
|
|
1362
1967
|
});
|
|
1363
|
-
var
|
|
1364
|
-
|
|
1365
|
-
const
|
|
1366
|
-
const
|
|
1367
|
-
|
|
1368
|
-
|
|
1369
|
-
|
|
1370
|
-
|
|
1371
|
-
|
|
1372
|
-
|
|
1373
|
-
},
|
|
1374
|
-
interacting: {
|
|
1375
|
-
SCROLL: "interacting",
|
|
1376
|
-
POINTER_LEAVE: "idle"
|
|
1377
|
-
},
|
|
1378
|
-
idle: {
|
|
1379
|
-
HIDE: "hidden",
|
|
1380
|
-
SCROLL: "scrolling",
|
|
1381
|
-
POINTER_ENTER: "interacting"
|
|
1382
|
-
}
|
|
1968
|
+
var THUMB_NAME = "ScrollAreaThumb";
|
|
1969
|
+
var ScrollAreaThumb = React$1.forwardRef((props, forwardedRef) => {
|
|
1970
|
+
const { forceMount, ...thumbProps } = props;
|
|
1971
|
+
const scrollbarContext = useScrollbarContext(THUMB_NAME, props.__scopeScrollArea);
|
|
1972
|
+
return /* @__PURE__ */ jsx(Presence, {
|
|
1973
|
+
present: forceMount || scrollbarContext.hasThumb,
|
|
1974
|
+
children: /* @__PURE__ */ jsx(ScrollAreaThumbImpl, {
|
|
1975
|
+
ref: forwardedRef,
|
|
1976
|
+
...thumbProps
|
|
1977
|
+
})
|
|
1383
1978
|
});
|
|
1384
|
-
|
|
1385
|
-
|
|
1386
|
-
|
|
1387
|
-
|
|
1979
|
+
});
|
|
1980
|
+
var ScrollAreaThumbImpl = React$1.forwardRef((props, forwardedRef) => {
|
|
1981
|
+
const { __scopeScrollArea, style, ...thumbProps } = props;
|
|
1982
|
+
const scrollAreaContext = useScrollAreaContext(THUMB_NAME, __scopeScrollArea);
|
|
1983
|
+
const scrollbarContext = useScrollbarContext(THUMB_NAME, __scopeScrollArea);
|
|
1984
|
+
const { onThumbPositionChange } = scrollbarContext;
|
|
1985
|
+
const composedRef = useComposedRefs(forwardedRef, (node) => scrollbarContext.onThumbChange(node));
|
|
1986
|
+
const removeUnlinkedScrollListenerRef = React$1.useRef(void 0);
|
|
1987
|
+
const debounceScrollEnd = useDebounceCallback(() => {
|
|
1988
|
+
if (removeUnlinkedScrollListenerRef.current) {
|
|
1989
|
+
removeUnlinkedScrollListenerRef.current();
|
|
1990
|
+
removeUnlinkedScrollListenerRef.current = void 0;
|
|
1388
1991
|
}
|
|
1389
|
-
},
|
|
1390
|
-
state,
|
|
1391
|
-
context.scrollHideDelay,
|
|
1392
|
-
send
|
|
1393
|
-
]);
|
|
1992
|
+
}, 100);
|
|
1394
1993
|
React$1.useEffect(() => {
|
|
1395
|
-
const viewport =
|
|
1396
|
-
const scrollDirection = isHorizontal ? "scrollLeft" : "scrollTop";
|
|
1994
|
+
const viewport = scrollAreaContext.viewport;
|
|
1397
1995
|
if (viewport) {
|
|
1398
|
-
let prevScrollPos = viewport[scrollDirection];
|
|
1399
1996
|
const handleScroll = () => {
|
|
1400
|
-
|
|
1401
|
-
if (
|
|
1402
|
-
|
|
1403
|
-
|
|
1997
|
+
debounceScrollEnd();
|
|
1998
|
+
if (!removeUnlinkedScrollListenerRef.current) {
|
|
1999
|
+
removeUnlinkedScrollListenerRef.current = addUnlinkedScrollListener(viewport, onThumbPositionChange);
|
|
2000
|
+
onThumbPositionChange();
|
|
1404
2001
|
}
|
|
1405
|
-
prevScrollPos = scrollPos;
|
|
1406
2002
|
};
|
|
1407
|
-
|
|
1408
|
-
|
|
2003
|
+
onThumbPositionChange();
|
|
2004
|
+
viewport.addEventListener("scroll", handleScroll);
|
|
2005
|
+
return () => viewport.removeEventListener("scroll", handleScroll);
|
|
2006
|
+
}
|
|
2007
|
+
}, [
|
|
2008
|
+
scrollAreaContext.viewport,
|
|
2009
|
+
debounceScrollEnd,
|
|
2010
|
+
onThumbPositionChange
|
|
2011
|
+
]);
|
|
2012
|
+
return /* @__PURE__ */ jsx(Primitive$2.div, {
|
|
2013
|
+
"data-state": scrollbarContext.hasThumb ? "visible" : "hidden",
|
|
2014
|
+
...thumbProps,
|
|
2015
|
+
ref: composedRef,
|
|
2016
|
+
style: {
|
|
2017
|
+
width: "var(--radix-scroll-area-thumb-width)",
|
|
2018
|
+
height: "var(--radix-scroll-area-thumb-height)",
|
|
2019
|
+
...style
|
|
2020
|
+
},
|
|
2021
|
+
onPointerDownCapture: composeEventHandlers(props.onPointerDownCapture, (event) => {
|
|
2022
|
+
const thumbRect = event.target.getBoundingClientRect();
|
|
2023
|
+
const x = event.clientX - thumbRect.left;
|
|
2024
|
+
const y = event.clientY - thumbRect.top;
|
|
2025
|
+
scrollbarContext.onThumbPointerDown({
|
|
2026
|
+
x,
|
|
2027
|
+
y
|
|
2028
|
+
});
|
|
2029
|
+
}),
|
|
2030
|
+
onPointerUp: composeEventHandlers(props.onPointerUp, scrollbarContext.onThumbPointerUp)
|
|
2031
|
+
});
|
|
2032
|
+
});
|
|
2033
|
+
ScrollAreaThumb.displayName = THUMB_NAME;
|
|
2034
|
+
var CORNER_NAME = "ScrollAreaCorner";
|
|
2035
|
+
var ScrollAreaCorner = React$1.forwardRef((props, forwardedRef) => {
|
|
2036
|
+
const context = useScrollAreaContext(CORNER_NAME, props.__scopeScrollArea);
|
|
2037
|
+
const hasBothScrollbarsVisible = Boolean(context.scrollbarX && context.scrollbarY);
|
|
2038
|
+
return context.type !== "scroll" && hasBothScrollbarsVisible ? /* @__PURE__ */ jsx(ScrollAreaCornerImpl, {
|
|
2039
|
+
...props,
|
|
2040
|
+
ref: forwardedRef
|
|
2041
|
+
}) : null;
|
|
2042
|
+
});
|
|
2043
|
+
ScrollAreaCorner.displayName = CORNER_NAME;
|
|
2044
|
+
var ScrollAreaCornerImpl = React$1.forwardRef((props, forwardedRef) => {
|
|
2045
|
+
const { __scopeScrollArea, ...cornerProps } = props;
|
|
2046
|
+
const context = useScrollAreaContext(CORNER_NAME, __scopeScrollArea);
|
|
2047
|
+
const [width, setWidth] = React$1.useState(0);
|
|
2048
|
+
const [height, setHeight] = React$1.useState(0);
|
|
2049
|
+
const hasSize = Boolean(width && height);
|
|
2050
|
+
useResizeObserver(context.scrollbarX, () => {
|
|
2051
|
+
const height2 = context.scrollbarX?.offsetHeight || 0;
|
|
2052
|
+
context.onCornerHeightChange(height2);
|
|
2053
|
+
setHeight(height2);
|
|
2054
|
+
});
|
|
2055
|
+
useResizeObserver(context.scrollbarY, () => {
|
|
2056
|
+
const width2 = context.scrollbarY?.offsetWidth || 0;
|
|
2057
|
+
context.onCornerWidthChange(width2);
|
|
2058
|
+
setWidth(width2);
|
|
2059
|
+
});
|
|
2060
|
+
return hasSize ? /* @__PURE__ */ jsx(Primitive$2.div, {
|
|
2061
|
+
...cornerProps,
|
|
2062
|
+
ref: forwardedRef,
|
|
2063
|
+
style: {
|
|
2064
|
+
width,
|
|
2065
|
+
height,
|
|
2066
|
+
position: "absolute",
|
|
2067
|
+
right: context.dir === "ltr" ? 0 : void 0,
|
|
2068
|
+
left: context.dir === "rtl" ? 0 : void 0,
|
|
2069
|
+
bottom: 0,
|
|
2070
|
+
...props.style
|
|
2071
|
+
}
|
|
2072
|
+
}) : null;
|
|
2073
|
+
});
|
|
2074
|
+
function toInt(value) {
|
|
2075
|
+
return value ? parseInt(value, 10) : 0;
|
|
2076
|
+
}
|
|
2077
|
+
function getThumbRatio(viewportSize, contentSize) {
|
|
2078
|
+
const ratio = viewportSize / contentSize;
|
|
2079
|
+
return isNaN(ratio) ? 0 : ratio;
|
|
2080
|
+
}
|
|
2081
|
+
function getThumbSize(sizes) {
|
|
2082
|
+
const ratio = getThumbRatio(sizes.viewport, sizes.content);
|
|
2083
|
+
const scrollbarPadding = sizes.scrollbar.paddingStart + sizes.scrollbar.paddingEnd;
|
|
2084
|
+
const thumbSize = (sizes.scrollbar.size - scrollbarPadding) * ratio;
|
|
2085
|
+
return Math.max(thumbSize, 18);
|
|
2086
|
+
}
|
|
2087
|
+
function getScrollPositionFromPointer(pointerPos, pointerOffset, sizes, dir = "ltr") {
|
|
2088
|
+
const thumbSizePx = getThumbSize(sizes);
|
|
2089
|
+
const thumbCenter = thumbSizePx / 2;
|
|
2090
|
+
const offset = pointerOffset || thumbCenter;
|
|
2091
|
+
const thumbOffsetFromEnd = thumbSizePx - offset;
|
|
2092
|
+
const minPointerPos = sizes.scrollbar.paddingStart + offset;
|
|
2093
|
+
const maxPointerPos = sizes.scrollbar.size - sizes.scrollbar.paddingEnd - thumbOffsetFromEnd;
|
|
2094
|
+
const maxScrollPos = sizes.content - sizes.viewport;
|
|
2095
|
+
const scrollRange = dir === "ltr" ? [0, maxScrollPos] : [maxScrollPos * -1, 0];
|
|
2096
|
+
return linearScale([minPointerPos, maxPointerPos], scrollRange)(pointerPos);
|
|
2097
|
+
}
|
|
2098
|
+
function getThumbOffsetFromScroll(scrollPos, sizes, dir = "ltr") {
|
|
2099
|
+
const thumbSizePx = getThumbSize(sizes);
|
|
2100
|
+
const scrollbarPadding = sizes.scrollbar.paddingStart + sizes.scrollbar.paddingEnd;
|
|
2101
|
+
const scrollbar = sizes.scrollbar.size - scrollbarPadding;
|
|
2102
|
+
const maxScrollPos = sizes.content - sizes.viewport;
|
|
2103
|
+
const maxThumbPos = scrollbar - thumbSizePx;
|
|
2104
|
+
const scrollWithoutMomentum = clamp(scrollPos, dir === "ltr" ? [0, maxScrollPos] : [maxScrollPos * -1, 0]);
|
|
2105
|
+
return linearScale([0, maxScrollPos], [0, maxThumbPos])(scrollWithoutMomentum);
|
|
2106
|
+
}
|
|
2107
|
+
function linearScale(input, output) {
|
|
2108
|
+
return (value) => {
|
|
2109
|
+
if (input[0] === input[1] || output[0] === output[1]) return output[0];
|
|
2110
|
+
const ratio = (output[1] - output[0]) / (input[1] - input[0]);
|
|
2111
|
+
return output[0] + ratio * (value - input[0]);
|
|
2112
|
+
};
|
|
2113
|
+
}
|
|
2114
|
+
function isScrollingWithinScrollbarBounds(scrollPos, maxScrollPos) {
|
|
2115
|
+
return scrollPos > 0 && scrollPos < maxScrollPos;
|
|
2116
|
+
}
|
|
2117
|
+
var addUnlinkedScrollListener = (node, handler = () => {}) => {
|
|
2118
|
+
let prevPosition = {
|
|
2119
|
+
left: node.scrollLeft,
|
|
2120
|
+
top: node.scrollTop
|
|
2121
|
+
};
|
|
2122
|
+
let rAF = 0;
|
|
2123
|
+
(function loop() {
|
|
2124
|
+
const position = {
|
|
2125
|
+
left: node.scrollLeft,
|
|
2126
|
+
top: node.scrollTop
|
|
2127
|
+
};
|
|
2128
|
+
const isHorizontalScroll = prevPosition.left !== position.left;
|
|
2129
|
+
const isVerticalScroll = prevPosition.top !== position.top;
|
|
2130
|
+
if (isHorizontalScroll || isVerticalScroll) handler();
|
|
2131
|
+
prevPosition = position;
|
|
2132
|
+
rAF = window.requestAnimationFrame(loop);
|
|
2133
|
+
})();
|
|
2134
|
+
return () => window.cancelAnimationFrame(rAF);
|
|
2135
|
+
};
|
|
2136
|
+
function useDebounceCallback(callback, delay) {
|
|
2137
|
+
const handleCallback = useCallbackRef(callback);
|
|
2138
|
+
const debounceTimerRef = React$1.useRef(0);
|
|
2139
|
+
React$1.useEffect(() => () => window.clearTimeout(debounceTimerRef.current), []);
|
|
2140
|
+
return React$1.useCallback(() => {
|
|
2141
|
+
window.clearTimeout(debounceTimerRef.current);
|
|
2142
|
+
debounceTimerRef.current = window.setTimeout(handleCallback, delay);
|
|
2143
|
+
}, [handleCallback, delay]);
|
|
2144
|
+
}
|
|
2145
|
+
function useResizeObserver(element, onResize) {
|
|
2146
|
+
const handleResize = useCallbackRef(onResize);
|
|
2147
|
+
useLayoutEffect2(() => {
|
|
2148
|
+
let rAF = 0;
|
|
2149
|
+
if (element) {
|
|
2150
|
+
const resizeObserver = new ResizeObserver(() => {
|
|
2151
|
+
cancelAnimationFrame(rAF);
|
|
2152
|
+
rAF = window.requestAnimationFrame(handleResize);
|
|
2153
|
+
});
|
|
2154
|
+
resizeObserver.observe(element);
|
|
2155
|
+
return () => {
|
|
2156
|
+
window.cancelAnimationFrame(rAF);
|
|
2157
|
+
resizeObserver.unobserve(element);
|
|
2158
|
+
};
|
|
1409
2159
|
}
|
|
1410
|
-
}, [
|
|
1411
|
-
|
|
1412
|
-
|
|
1413
|
-
|
|
1414
|
-
|
|
1415
|
-
|
|
1416
|
-
|
|
1417
|
-
|
|
1418
|
-
|
|
1419
|
-
|
|
1420
|
-
|
|
1421
|
-
|
|
1422
|
-
|
|
1423
|
-
|
|
1424
|
-
|
|
1425
|
-
|
|
1426
|
-
|
|
1427
|
-
|
|
1428
|
-
|
|
1429
|
-
|
|
1430
|
-
|
|
1431
|
-
|
|
1432
|
-
|
|
1433
|
-
|
|
1434
|
-
|
|
1435
|
-
|
|
1436
|
-
|
|
2160
|
+
}, [element, handleResize]);
|
|
2161
|
+
}
|
|
2162
|
+
var Root$1 = ScrollArea$1;
|
|
2163
|
+
var Viewport = ScrollAreaViewport;
|
|
2164
|
+
var Corner = ScrollAreaCorner;
|
|
2165
|
+
var ScrollBarGlass = React$1.forwardRef(({ className, orientation = "vertical", ...props }, ref) => /* @__PURE__ */ jsx(ScrollAreaScrollbar, {
|
|
2166
|
+
ref,
|
|
2167
|
+
orientation,
|
|
2168
|
+
className: cn("flex touch-none select-none transition-colors", "bg-[var(--scrollbar-track,transparent)]", orientation === "vertical" && "h-full w-2.5 border-l border-l-transparent p-[1px]", orientation === "horizontal" && "h-2.5 flex-col border-t border-t-transparent p-[1px]", className),
|
|
2169
|
+
...props,
|
|
2170
|
+
children: /* @__PURE__ */ jsx(ScrollAreaThumb, { className: cn("relative flex-1 rounded-full", "bg-[var(--scrollbar-thumb,var(--glass-border))]", "hover:bg-[var(--scrollbar-thumb-hover,var(--glass-border-hover))]", "transition-colors") })
|
|
2171
|
+
}));
|
|
2172
|
+
ScrollBarGlass.displayName = "ScrollBarGlass";
|
|
2173
|
+
var ScrollAreaGlass = React$1.forwardRef(({ className, children, orientation = "vertical", ...props }, ref) => /* @__PURE__ */ jsxs(Root$1, {
|
|
2174
|
+
ref,
|
|
2175
|
+
className: cn("relative overflow-hidden", className),
|
|
2176
|
+
...props,
|
|
2177
|
+
children: [
|
|
2178
|
+
/* @__PURE__ */ jsx(Viewport, {
|
|
2179
|
+
className: "h-full w-full rounded-[inherit]",
|
|
2180
|
+
children
|
|
2181
|
+
}),
|
|
2182
|
+
(orientation === "vertical" || orientation === "both") && /* @__PURE__ */ jsx(ScrollBarGlass, { orientation: "vertical" }),
|
|
2183
|
+
(orientation === "horizontal" || orientation === "both") && /* @__PURE__ */ jsx(ScrollBarGlass, { orientation: "horizontal" }),
|
|
2184
|
+
/* @__PURE__ */ jsx(Corner, {})
|
|
2185
|
+
]
|
|
2186
|
+
}));
|
|
2187
|
+
ScrollAreaGlass.displayName = "ScrollAreaGlass";
|
|
2188
|
+
function createContextScope$1(scopeName, createContextScopeDeps = []) {
|
|
2189
|
+
let defaultContexts = [];
|
|
2190
|
+
function createContext3(rootComponentName, defaultContext) {
|
|
2191
|
+
const BaseContext = React$1.createContext(defaultContext);
|
|
2192
|
+
const index = defaultContexts.length;
|
|
2193
|
+
defaultContexts = [...defaultContexts, defaultContext];
|
|
2194
|
+
const Provider = (props) => {
|
|
2195
|
+
const { scope, children, ...context } = props;
|
|
2196
|
+
const Context = scope?.[scopeName]?.[index] || BaseContext;
|
|
2197
|
+
const value = React$1.useMemo(() => context, Object.values(context));
|
|
2198
|
+
return /* @__PURE__ */ jsx(Context.Provider, {
|
|
2199
|
+
value,
|
|
2200
|
+
children
|
|
2201
|
+
});
|
|
2202
|
+
};
|
|
2203
|
+
Provider.displayName = rootComponentName + "Provider";
|
|
2204
|
+
function useContext2(consumerName, scope) {
|
|
2205
|
+
const Context = scope?.[scopeName]?.[index] || BaseContext;
|
|
2206
|
+
const context = React$1.useContext(Context);
|
|
2207
|
+
if (context) return context;
|
|
2208
|
+
if (defaultContext !== void 0) return defaultContext;
|
|
2209
|
+
throw new Error(`\`${consumerName}\` must be used within \`${rootComponentName}\``);
|
|
1437
2210
|
}
|
|
1438
|
-
|
|
1439
|
-
|
|
1440
|
-
|
|
1441
|
-
|
|
1442
|
-
|
|
1443
|
-
|
|
1444
|
-
|
|
1445
|
-
|
|
2211
|
+
return [Provider, useContext2];
|
|
2212
|
+
}
|
|
2213
|
+
const createScope = () => {
|
|
2214
|
+
const scopeContexts = defaultContexts.map((defaultContext) => {
|
|
2215
|
+
return React$1.createContext(defaultContext);
|
|
2216
|
+
});
|
|
2217
|
+
return function useScope(scope) {
|
|
2218
|
+
const contexts = scope?.[scopeName] || scopeContexts;
|
|
2219
|
+
return React$1.useMemo(() => ({ [`__scope${scopeName}`]: {
|
|
2220
|
+
...scope,
|
|
2221
|
+
[scopeName]: contexts
|
|
2222
|
+
} }), [scope, contexts]);
|
|
2223
|
+
};
|
|
2224
|
+
};
|
|
2225
|
+
createScope.scopeName = scopeName;
|
|
2226
|
+
return [createContext3, composeContextScopes$1(createScope, ...createContextScopeDeps)];
|
|
2227
|
+
}
|
|
2228
|
+
function composeContextScopes$1(...scopes) {
|
|
2229
|
+
const baseScope = scopes[0];
|
|
2230
|
+
if (scopes.length === 1) return baseScope;
|
|
2231
|
+
const createScope = () => {
|
|
2232
|
+
const scopeHooks = scopes.map((createScope2) => ({
|
|
2233
|
+
useScope: createScope2(),
|
|
2234
|
+
scopeName: createScope2.scopeName
|
|
2235
|
+
}));
|
|
2236
|
+
return function useComposedScopes(overrideScopes) {
|
|
2237
|
+
const nextScopes = scopeHooks.reduce((nextScopes2, { useScope, scopeName }) => {
|
|
2238
|
+
const currentScope = useScope(overrideScopes)[`__scope${scopeName}`];
|
|
2239
|
+
return {
|
|
2240
|
+
...nextScopes2,
|
|
2241
|
+
...currentScope
|
|
2242
|
+
};
|
|
2243
|
+
}, {});
|
|
2244
|
+
return React$1.useMemo(() => ({ [`__scope${baseScope.scopeName}`]: nextScopes }), [nextScopes]);
|
|
2245
|
+
};
|
|
2246
|
+
};
|
|
2247
|
+
createScope.scopeName = baseScope.scopeName;
|
|
2248
|
+
return createScope;
|
|
2249
|
+
}
|
|
2250
|
+
var Primitive$1 = [
|
|
2251
|
+
"a",
|
|
2252
|
+
"button",
|
|
2253
|
+
"div",
|
|
2254
|
+
"form",
|
|
2255
|
+
"h2",
|
|
2256
|
+
"h3",
|
|
2257
|
+
"img",
|
|
2258
|
+
"input",
|
|
2259
|
+
"label",
|
|
2260
|
+
"li",
|
|
2261
|
+
"nav",
|
|
2262
|
+
"ol",
|
|
2263
|
+
"p",
|
|
2264
|
+
"select",
|
|
2265
|
+
"span",
|
|
2266
|
+
"svg",
|
|
2267
|
+
"ul"
|
|
2268
|
+
].reduce((primitive, node) => {
|
|
2269
|
+
const Slot$1 = createSlot(`Primitive.${node}`);
|
|
2270
|
+
const Node = React$1.forwardRef((props, forwardedRef) => {
|
|
2271
|
+
const { asChild, ...primitiveProps } = props;
|
|
2272
|
+
const Comp = asChild ? Slot$1 : node;
|
|
2273
|
+
if (typeof window !== "undefined") window[Symbol.for("radix-ui")] = true;
|
|
2274
|
+
return /* @__PURE__ */ jsx(Comp, {
|
|
2275
|
+
...primitiveProps,
|
|
1446
2276
|
ref: forwardedRef
|
|
1447
|
-
})
|
|
1448
|
-
});
|
|
1449
|
-
});
|
|
1450
|
-
var ScrollAreaScrollbarVisible = React$1.forwardRef((props, forwardedRef) => {
|
|
1451
|
-
const { orientation = "vertical", ...scrollbarProps } = props;
|
|
1452
|
-
const context = useScrollAreaContext(SCROLLBAR_NAME, props.__scopeScrollArea);
|
|
1453
|
-
const thumbRef = React$1.useRef(null);
|
|
1454
|
-
const pointerOffsetRef = React$1.useRef(0);
|
|
1455
|
-
const [sizes, setSizes] = React$1.useState({
|
|
1456
|
-
content: 0,
|
|
1457
|
-
viewport: 0,
|
|
1458
|
-
scrollbar: {
|
|
1459
|
-
size: 0,
|
|
1460
|
-
paddingStart: 0,
|
|
1461
|
-
paddingEnd: 0
|
|
1462
|
-
}
|
|
2277
|
+
});
|
|
1463
2278
|
});
|
|
1464
|
-
|
|
1465
|
-
|
|
1466
|
-
...
|
|
1467
|
-
|
|
1468
|
-
onSizesChange: setSizes,
|
|
1469
|
-
hasThumb: Boolean(thumbRatio > 0 && thumbRatio < 1),
|
|
1470
|
-
onThumbChange: (thumb) => thumbRef.current = thumb,
|
|
1471
|
-
onThumbPointerUp: () => pointerOffsetRef.current = 0,
|
|
1472
|
-
onThumbPointerDown: (pointerPos) => pointerOffsetRef.current = pointerPos
|
|
2279
|
+
Node.displayName = `Primitive.${node}`;
|
|
2280
|
+
return {
|
|
2281
|
+
...primitive,
|
|
2282
|
+
[node]: Node
|
|
1473
2283
|
};
|
|
1474
|
-
|
|
1475
|
-
|
|
1476
|
-
|
|
1477
|
-
|
|
1478
|
-
|
|
1479
|
-
|
|
1480
|
-
|
|
1481
|
-
|
|
1482
|
-
|
|
1483
|
-
|
|
1484
|
-
|
|
1485
|
-
|
|
1486
|
-
|
|
1487
|
-
|
|
1488
|
-
|
|
1489
|
-
|
|
1490
|
-
|
|
1491
|
-
|
|
1492
|
-
|
|
2284
|
+
}, {});
|
|
2285
|
+
var COLLAPSIBLE_NAME = "Collapsible";
|
|
2286
|
+
var [createCollapsibleContext, createCollapsibleScope] = createContextScope$1(COLLAPSIBLE_NAME);
|
|
2287
|
+
var [CollapsibleProvider, useCollapsibleContext] = createCollapsibleContext(COLLAPSIBLE_NAME);
|
|
2288
|
+
var Collapsible = React$1.forwardRef((props, forwardedRef) => {
|
|
2289
|
+
const { __scopeCollapsible, open: openProp, defaultOpen, disabled, onOpenChange, ...collapsibleProps } = props;
|
|
2290
|
+
const [open, setOpen] = useControllableState({
|
|
2291
|
+
prop: openProp,
|
|
2292
|
+
defaultProp: defaultOpen ?? false,
|
|
2293
|
+
onChange: onOpenChange,
|
|
2294
|
+
caller: COLLAPSIBLE_NAME
|
|
2295
|
+
});
|
|
2296
|
+
return /* @__PURE__ */ jsx(CollapsibleProvider, {
|
|
2297
|
+
scope: __scopeCollapsible,
|
|
2298
|
+
disabled,
|
|
2299
|
+
contentId: useId$1(),
|
|
2300
|
+
open,
|
|
2301
|
+
onOpenToggle: React$1.useCallback(() => setOpen((prevOpen) => !prevOpen), [setOpen]),
|
|
2302
|
+
children: /* @__PURE__ */ jsx(Primitive$1.div, {
|
|
2303
|
+
"data-state": getState$1(open),
|
|
2304
|
+
"data-disabled": disabled ? "" : void 0,
|
|
2305
|
+
...collapsibleProps,
|
|
2306
|
+
ref: forwardedRef
|
|
2307
|
+
})
|
|
1493
2308
|
});
|
|
1494
|
-
|
|
1495
|
-
|
|
2309
|
+
});
|
|
2310
|
+
Collapsible.displayName = COLLAPSIBLE_NAME;
|
|
2311
|
+
var TRIGGER_NAME = "CollapsibleTrigger";
|
|
2312
|
+
var CollapsibleTrigger = React$1.forwardRef((props, forwardedRef) => {
|
|
2313
|
+
const { __scopeCollapsible, ...triggerProps } = props;
|
|
2314
|
+
const context = useCollapsibleContext(TRIGGER_NAME, __scopeCollapsible);
|
|
2315
|
+
return /* @__PURE__ */ jsx(Primitive$1.button, {
|
|
2316
|
+
type: "button",
|
|
2317
|
+
"aria-controls": context.contentId,
|
|
2318
|
+
"aria-expanded": context.open || false,
|
|
2319
|
+
"data-state": getState$1(context.open),
|
|
2320
|
+
"data-disabled": context.disabled ? "" : void 0,
|
|
2321
|
+
disabled: context.disabled,
|
|
2322
|
+
...triggerProps,
|
|
1496
2323
|
ref: forwardedRef,
|
|
1497
|
-
|
|
1498
|
-
if (context.viewport && thumbRef.current) {
|
|
1499
|
-
const scrollPos = context.viewport.scrollTop;
|
|
1500
|
-
const offset = getThumbOffsetFromScroll(scrollPos, sizes);
|
|
1501
|
-
thumbRef.current.style.transform = `translate3d(0, ${offset}px, 0)`;
|
|
1502
|
-
}
|
|
1503
|
-
},
|
|
1504
|
-
onWheelScroll: (scrollPos) => {
|
|
1505
|
-
if (context.viewport) context.viewport.scrollTop = scrollPos;
|
|
1506
|
-
},
|
|
1507
|
-
onDragScroll: (pointerPos) => {
|
|
1508
|
-
if (context.viewport) context.viewport.scrollTop = getScrollPosition(pointerPos);
|
|
1509
|
-
}
|
|
2324
|
+
onClick: composeEventHandlers(props.onClick, context.onOpenToggle)
|
|
1510
2325
|
});
|
|
1511
|
-
return null;
|
|
1512
2326
|
});
|
|
1513
|
-
|
|
1514
|
-
|
|
1515
|
-
|
|
1516
|
-
const
|
|
1517
|
-
const
|
|
1518
|
-
|
|
1519
|
-
|
|
1520
|
-
|
|
1521
|
-
|
|
1522
|
-
|
|
1523
|
-
|
|
1524
|
-
|
|
1525
|
-
ref: composeRefs,
|
|
1526
|
-
sizes,
|
|
1527
|
-
style: {
|
|
1528
|
-
bottom: 0,
|
|
1529
|
-
left: context.dir === "rtl" ? "var(--radix-scroll-area-corner-width)" : 0,
|
|
1530
|
-
right: context.dir === "ltr" ? "var(--radix-scroll-area-corner-width)" : 0,
|
|
1531
|
-
["--radix-scroll-area-thumb-width"]: getThumbSize(sizes) + "px",
|
|
1532
|
-
...props.style
|
|
1533
|
-
},
|
|
1534
|
-
onThumbPointerDown: (pointerPos) => props.onThumbPointerDown(pointerPos.x),
|
|
1535
|
-
onDragScroll: (pointerPos) => props.onDragScroll(pointerPos.x),
|
|
1536
|
-
onWheelScroll: (event, maxScrollPos) => {
|
|
1537
|
-
if (context.viewport) {
|
|
1538
|
-
const scrollPos = context.viewport.scrollLeft + event.deltaX;
|
|
1539
|
-
props.onWheelScroll(scrollPos);
|
|
1540
|
-
if (isScrollingWithinScrollbarBounds(scrollPos, maxScrollPos)) event.preventDefault();
|
|
1541
|
-
}
|
|
1542
|
-
},
|
|
1543
|
-
onResize: () => {
|
|
1544
|
-
if (ref.current && context.viewport && computedStyle) onSizesChange({
|
|
1545
|
-
content: context.viewport.scrollWidth,
|
|
1546
|
-
viewport: context.viewport.offsetWidth,
|
|
1547
|
-
scrollbar: {
|
|
1548
|
-
size: ref.current.clientWidth,
|
|
1549
|
-
paddingStart: toInt(computedStyle.paddingLeft),
|
|
1550
|
-
paddingEnd: toInt(computedStyle.paddingRight)
|
|
1551
|
-
}
|
|
1552
|
-
});
|
|
1553
|
-
}
|
|
2327
|
+
CollapsibleTrigger.displayName = TRIGGER_NAME;
|
|
2328
|
+
var CONTENT_NAME = "CollapsibleContent";
|
|
2329
|
+
var CollapsibleContent = React$1.forwardRef((props, forwardedRef) => {
|
|
2330
|
+
const { forceMount, ...contentProps } = props;
|
|
2331
|
+
const context = useCollapsibleContext(CONTENT_NAME, props.__scopeCollapsible);
|
|
2332
|
+
return /* @__PURE__ */ jsx(Presence, {
|
|
2333
|
+
present: forceMount || context.open,
|
|
2334
|
+
children: ({ present }) => /* @__PURE__ */ jsx(CollapsibleContentImpl, {
|
|
2335
|
+
...contentProps,
|
|
2336
|
+
ref: forwardedRef,
|
|
2337
|
+
present
|
|
2338
|
+
})
|
|
1554
2339
|
});
|
|
1555
2340
|
});
|
|
1556
|
-
|
|
1557
|
-
|
|
1558
|
-
const
|
|
1559
|
-
const
|
|
2341
|
+
CollapsibleContent.displayName = CONTENT_NAME;
|
|
2342
|
+
var CollapsibleContentImpl = React$1.forwardRef((props, forwardedRef) => {
|
|
2343
|
+
const { __scopeCollapsible, present, children, ...contentProps } = props;
|
|
2344
|
+
const context = useCollapsibleContext(CONTENT_NAME, __scopeCollapsible);
|
|
2345
|
+
const [isPresent, setIsPresent] = React$1.useState(present);
|
|
1560
2346
|
const ref = React$1.useRef(null);
|
|
1561
|
-
const
|
|
2347
|
+
const composedRefs = useComposedRefs(forwardedRef, ref);
|
|
2348
|
+
const heightRef = React$1.useRef(0);
|
|
2349
|
+
const height = heightRef.current;
|
|
2350
|
+
const widthRef = React$1.useRef(0);
|
|
2351
|
+
const width = widthRef.current;
|
|
2352
|
+
const isOpen = context.open || isPresent;
|
|
2353
|
+
const isMountAnimationPreventedRef = React$1.useRef(isOpen);
|
|
2354
|
+
const originalStylesRef = React$1.useRef(void 0);
|
|
1562
2355
|
React$1.useEffect(() => {
|
|
1563
|
-
|
|
1564
|
-
|
|
1565
|
-
|
|
1566
|
-
|
|
1567
|
-
|
|
1568
|
-
|
|
1569
|
-
|
|
2356
|
+
const rAF = requestAnimationFrame(() => isMountAnimationPreventedRef.current = false);
|
|
2357
|
+
return () => cancelAnimationFrame(rAF);
|
|
2358
|
+
}, []);
|
|
2359
|
+
useLayoutEffect2(() => {
|
|
2360
|
+
const node = ref.current;
|
|
2361
|
+
if (node) {
|
|
2362
|
+
originalStylesRef.current = originalStylesRef.current || {
|
|
2363
|
+
transitionDuration: node.style.transitionDuration,
|
|
2364
|
+
animationName: node.style.animationName
|
|
2365
|
+
};
|
|
2366
|
+
node.style.transitionDuration = "0s";
|
|
2367
|
+
node.style.animationName = "none";
|
|
2368
|
+
const rect = node.getBoundingClientRect();
|
|
2369
|
+
heightRef.current = rect.height;
|
|
2370
|
+
widthRef.current = rect.width;
|
|
2371
|
+
if (!isMountAnimationPreventedRef.current) {
|
|
2372
|
+
node.style.transitionDuration = originalStylesRef.current.transitionDuration;
|
|
2373
|
+
node.style.animationName = originalStylesRef.current.animationName;
|
|
2374
|
+
}
|
|
2375
|
+
setIsPresent(present);
|
|
2376
|
+
}
|
|
2377
|
+
}, [context.open, present]);
|
|
2378
|
+
return /* @__PURE__ */ jsx(Primitive$1.div, {
|
|
2379
|
+
"data-state": getState$1(context.open),
|
|
2380
|
+
"data-disabled": context.disabled ? "" : void 0,
|
|
2381
|
+
id: context.contentId,
|
|
2382
|
+
hidden: !isOpen,
|
|
2383
|
+
...contentProps,
|
|
2384
|
+
ref: composedRefs,
|
|
1570
2385
|
style: {
|
|
1571
|
-
|
|
1572
|
-
|
|
1573
|
-
left: context.dir === "rtl" ? 0 : void 0,
|
|
1574
|
-
bottom: "var(--radix-scroll-area-corner-height)",
|
|
1575
|
-
["--radix-scroll-area-thumb-height"]: getThumbSize(sizes) + "px",
|
|
2386
|
+
[`--radix-collapsible-content-height`]: height ? `${height}px` : void 0,
|
|
2387
|
+
[`--radix-collapsible-content-width`]: width ? `${width}px` : void 0,
|
|
1576
2388
|
...props.style
|
|
1577
2389
|
},
|
|
1578
|
-
|
|
1579
|
-
onDragScroll: (pointerPos) => props.onDragScroll(pointerPos.y),
|
|
1580
|
-
onWheelScroll: (event, maxScrollPos) => {
|
|
1581
|
-
if (context.viewport) {
|
|
1582
|
-
const scrollPos = context.viewport.scrollTop + event.deltaY;
|
|
1583
|
-
props.onWheelScroll(scrollPos);
|
|
1584
|
-
if (isScrollingWithinScrollbarBounds(scrollPos, maxScrollPos)) event.preventDefault();
|
|
1585
|
-
}
|
|
1586
|
-
},
|
|
1587
|
-
onResize: () => {
|
|
1588
|
-
if (ref.current && context.viewport && computedStyle) onSizesChange({
|
|
1589
|
-
content: context.viewport.scrollHeight,
|
|
1590
|
-
viewport: context.viewport.offsetHeight,
|
|
1591
|
-
scrollbar: {
|
|
1592
|
-
size: ref.current.clientHeight,
|
|
1593
|
-
paddingStart: toInt(computedStyle.paddingTop),
|
|
1594
|
-
paddingEnd: toInt(computedStyle.paddingBottom)
|
|
1595
|
-
}
|
|
1596
|
-
});
|
|
1597
|
-
}
|
|
2390
|
+
children: isOpen && children
|
|
1598
2391
|
});
|
|
1599
2392
|
});
|
|
1600
|
-
|
|
1601
|
-
|
|
1602
|
-
|
|
1603
|
-
|
|
1604
|
-
|
|
1605
|
-
|
|
1606
|
-
|
|
1607
|
-
|
|
1608
|
-
|
|
1609
|
-
|
|
1610
|
-
|
|
1611
|
-
|
|
1612
|
-
|
|
1613
|
-
|
|
1614
|
-
|
|
1615
|
-
|
|
1616
|
-
|
|
1617
|
-
|
|
2393
|
+
function getState$1(open) {
|
|
2394
|
+
return open ? "open" : "closed";
|
|
2395
|
+
}
|
|
2396
|
+
var Root = Collapsible;
|
|
2397
|
+
var Trigger = CollapsibleTrigger;
|
|
2398
|
+
var Content = CollapsibleContent;
|
|
2399
|
+
var CollapsibleGlassRoot = React$1.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(Root, {
|
|
2400
|
+
ref,
|
|
2401
|
+
className: cn("w-full", className),
|
|
2402
|
+
...props
|
|
2403
|
+
}));
|
|
2404
|
+
CollapsibleGlassRoot.displayName = "CollapsibleGlassRoot";
|
|
2405
|
+
var CollapsibleGlassTrigger = React$1.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(Trigger, {
|
|
2406
|
+
ref,
|
|
2407
|
+
className: cn("flex w-full items-center justify-between", "focus-visible:outline-none focus-visible:ring-2", "focus-visible:ring-[var(--focus-ring)] focus-visible:ring-offset-2", className),
|
|
2408
|
+
...props
|
|
2409
|
+
}));
|
|
2410
|
+
CollapsibleGlassTrigger.displayName = "CollapsibleGlassTrigger";
|
|
2411
|
+
var CollapsibleGlassContent = React$1.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(Content, {
|
|
2412
|
+
ref,
|
|
2413
|
+
className: cn("overflow-hidden transition-all", "data-[state=closed]:animate-collapsible-up", "data-[state=open]:animate-collapsible-down", className),
|
|
2414
|
+
...props,
|
|
2415
|
+
children
|
|
2416
|
+
}));
|
|
2417
|
+
CollapsibleGlassContent.displayName = "CollapsibleGlassContent";
|
|
2418
|
+
const CollapsibleGlass = {
|
|
2419
|
+
Root: CollapsibleGlassRoot,
|
|
2420
|
+
Trigger: CollapsibleGlassTrigger,
|
|
2421
|
+
Content: CollapsibleGlassContent
|
|
2422
|
+
};
|
|
2423
|
+
function createContextScope(scopeName, createContextScopeDeps = []) {
|
|
2424
|
+
let defaultContexts = [];
|
|
2425
|
+
function createContext3(rootComponentName, defaultContext) {
|
|
2426
|
+
const BaseContext = React$1.createContext(defaultContext);
|
|
2427
|
+
const index = defaultContexts.length;
|
|
2428
|
+
defaultContexts = [...defaultContexts, defaultContext];
|
|
2429
|
+
const Provider = (props) => {
|
|
2430
|
+
const { scope, children, ...context } = props;
|
|
2431
|
+
const Context = scope?.[scopeName]?.[index] || BaseContext;
|
|
2432
|
+
const value = React$1.useMemo(() => context, Object.values(context));
|
|
2433
|
+
return /* @__PURE__ */ jsx(Context.Provider, {
|
|
2434
|
+
value,
|
|
2435
|
+
children
|
|
2436
|
+
});
|
|
2437
|
+
};
|
|
2438
|
+
Provider.displayName = rootComponentName + "Provider";
|
|
2439
|
+
function useContext2(consumerName, scope) {
|
|
2440
|
+
const Context = scope?.[scopeName]?.[index] || BaseContext;
|
|
2441
|
+
const context = React$1.useContext(Context);
|
|
2442
|
+
if (context) return context;
|
|
2443
|
+
if (defaultContext !== void 0) return defaultContext;
|
|
2444
|
+
throw new Error(`\`${consumerName}\` must be used within \`${rootComponentName}\``);
|
|
2445
|
+
}
|
|
2446
|
+
return [Provider, useContext2];
|
|
1618
2447
|
}
|
|
1619
|
-
|
|
1620
|
-
const
|
|
1621
|
-
|
|
1622
|
-
|
|
2448
|
+
const createScope = () => {
|
|
2449
|
+
const scopeContexts = defaultContexts.map((defaultContext) => {
|
|
2450
|
+
return React$1.createContext(defaultContext);
|
|
2451
|
+
});
|
|
2452
|
+
return function useScope(scope) {
|
|
2453
|
+
const contexts = scope?.[scopeName] || scopeContexts;
|
|
2454
|
+
return React$1.useMemo(() => ({ [`__scope${scopeName}`]: {
|
|
2455
|
+
...scope,
|
|
2456
|
+
[scopeName]: contexts
|
|
2457
|
+
} }), [scope, contexts]);
|
|
1623
2458
|
};
|
|
1624
|
-
|
|
1625
|
-
|
|
1626
|
-
|
|
1627
|
-
|
|
1628
|
-
|
|
1629
|
-
|
|
1630
|
-
|
|
1631
|
-
|
|
1632
|
-
|
|
1633
|
-
|
|
1634
|
-
|
|
1635
|
-
|
|
1636
|
-
|
|
1637
|
-
|
|
1638
|
-
|
|
1639
|
-
|
|
1640
|
-
|
|
1641
|
-
|
|
1642
|
-
|
|
1643
|
-
|
|
1644
|
-
|
|
1645
|
-
|
|
1646
|
-
|
|
1647
|
-
|
|
1648
|
-
|
|
1649
|
-
|
|
1650
|
-
|
|
1651
|
-
|
|
1652
|
-
|
|
1653
|
-
|
|
1654
|
-
|
|
1655
|
-
|
|
1656
|
-
|
|
1657
|
-
|
|
2459
|
+
};
|
|
2460
|
+
createScope.scopeName = scopeName;
|
|
2461
|
+
return [createContext3, composeContextScopes(createScope, ...createContextScopeDeps)];
|
|
2462
|
+
}
|
|
2463
|
+
function composeContextScopes(...scopes) {
|
|
2464
|
+
const baseScope = scopes[0];
|
|
2465
|
+
if (scopes.length === 1) return baseScope;
|
|
2466
|
+
const createScope = () => {
|
|
2467
|
+
const scopeHooks = scopes.map((createScope2) => ({
|
|
2468
|
+
useScope: createScope2(),
|
|
2469
|
+
scopeName: createScope2.scopeName
|
|
2470
|
+
}));
|
|
2471
|
+
return function useComposedScopes(overrideScopes) {
|
|
2472
|
+
const nextScopes = scopeHooks.reduce((nextScopes2, { useScope, scopeName }) => {
|
|
2473
|
+
const currentScope = useScope(overrideScopes)[`__scope${scopeName}`];
|
|
2474
|
+
return {
|
|
2475
|
+
...nextScopes2,
|
|
2476
|
+
...currentScope
|
|
2477
|
+
};
|
|
2478
|
+
}, {});
|
|
2479
|
+
return React$1.useMemo(() => ({ [`__scope${baseScope.scopeName}`]: nextScopes }), [nextScopes]);
|
|
2480
|
+
};
|
|
2481
|
+
};
|
|
2482
|
+
createScope.scopeName = baseScope.scopeName;
|
|
2483
|
+
return createScope;
|
|
2484
|
+
}
|
|
2485
|
+
var Primitive = [
|
|
2486
|
+
"a",
|
|
2487
|
+
"button",
|
|
2488
|
+
"div",
|
|
2489
|
+
"form",
|
|
2490
|
+
"h2",
|
|
2491
|
+
"h3",
|
|
2492
|
+
"img",
|
|
2493
|
+
"input",
|
|
2494
|
+
"label",
|
|
2495
|
+
"li",
|
|
2496
|
+
"nav",
|
|
2497
|
+
"ol",
|
|
2498
|
+
"p",
|
|
2499
|
+
"select",
|
|
2500
|
+
"span",
|
|
2501
|
+
"svg",
|
|
2502
|
+
"ul"
|
|
2503
|
+
].reduce((primitive, node) => {
|
|
2504
|
+
const Slot$1 = createSlot(`Primitive.${node}`);
|
|
2505
|
+
const Node = React$1.forwardRef((props, forwardedRef) => {
|
|
2506
|
+
const { asChild, ...primitiveProps } = props;
|
|
2507
|
+
const Comp = asChild ? Slot$1 : node;
|
|
2508
|
+
if (typeof window !== "undefined") window[Symbol.for("radix-ui")] = true;
|
|
2509
|
+
return /* @__PURE__ */ jsx(Comp, {
|
|
2510
|
+
...primitiveProps,
|
|
2511
|
+
ref: forwardedRef
|
|
2512
|
+
});
|
|
2513
|
+
});
|
|
2514
|
+
Node.displayName = `Primitive.${node}`;
|
|
2515
|
+
return {
|
|
2516
|
+
...primitive,
|
|
2517
|
+
[node]: Node
|
|
2518
|
+
};
|
|
2519
|
+
}, {});
|
|
2520
|
+
var RADIO_NAME = "Radio";
|
|
2521
|
+
var [createRadioContext, createRadioScope] = createContextScope(RADIO_NAME);
|
|
2522
|
+
var [RadioProvider, useRadioContext] = createRadioContext(RADIO_NAME);
|
|
2523
|
+
var Radio = React$1.forwardRef((props, forwardedRef) => {
|
|
2524
|
+
const { __scopeRadio, name, checked = false, required, disabled, value = "on", onCheck, form, ...radioProps } = props;
|
|
2525
|
+
const [button, setButton] = React$1.useState(null);
|
|
2526
|
+
const composedRefs = useComposedRefs(forwardedRef, (node) => setButton(node));
|
|
2527
|
+
const hasConsumerStoppedPropagationRef = React$1.useRef(false);
|
|
2528
|
+
const isFormControl = button ? form || !!button.closest("form") : true;
|
|
2529
|
+
return /* @__PURE__ */ jsxs(RadioProvider, {
|
|
2530
|
+
scope: __scopeRadio,
|
|
2531
|
+
checked,
|
|
2532
|
+
disabled,
|
|
2533
|
+
children: [/* @__PURE__ */ jsx(Primitive.button, {
|
|
2534
|
+
type: "button",
|
|
2535
|
+
role: "radio",
|
|
2536
|
+
"aria-checked": checked,
|
|
2537
|
+
"data-state": getState(checked),
|
|
2538
|
+
"data-disabled": disabled ? "" : void 0,
|
|
2539
|
+
disabled,
|
|
2540
|
+
value,
|
|
2541
|
+
...radioProps,
|
|
2542
|
+
ref: composedRefs,
|
|
2543
|
+
onClick: composeEventHandlers(props.onClick, (event) => {
|
|
2544
|
+
if (!checked) onCheck?.();
|
|
2545
|
+
if (isFormControl) {
|
|
2546
|
+
hasConsumerStoppedPropagationRef.current = event.isPropagationStopped();
|
|
2547
|
+
if (!hasConsumerStoppedPropagationRef.current) event.stopPropagation();
|
|
1658
2548
|
}
|
|
1659
|
-
}),
|
|
1660
|
-
onPointerMove: composeEventHandlers(props.onPointerMove, handleDragScroll),
|
|
1661
|
-
onPointerUp: composeEventHandlers(props.onPointerUp, (event) => {
|
|
1662
|
-
const element = event.target;
|
|
1663
|
-
if (element.hasPointerCapture(event.pointerId)) element.releasePointerCapture(event.pointerId);
|
|
1664
|
-
document.body.style.webkitUserSelect = prevWebkitUserSelectRef.current;
|
|
1665
|
-
if (context.viewport) context.viewport.style.scrollBehavior = "";
|
|
1666
|
-
rectRef.current = null;
|
|
1667
2549
|
})
|
|
1668
|
-
})
|
|
2550
|
+
}), isFormControl && /* @__PURE__ */ jsx(RadioBubbleInput, {
|
|
2551
|
+
control: button,
|
|
2552
|
+
bubbles: !hasConsumerStoppedPropagationRef.current,
|
|
2553
|
+
name,
|
|
2554
|
+
value,
|
|
2555
|
+
checked,
|
|
2556
|
+
required,
|
|
2557
|
+
disabled,
|
|
2558
|
+
form,
|
|
2559
|
+
style: { transform: "translateX(-100%)" }
|
|
2560
|
+
})]
|
|
1669
2561
|
});
|
|
1670
2562
|
});
|
|
1671
|
-
|
|
1672
|
-
var
|
|
1673
|
-
|
|
1674
|
-
const
|
|
2563
|
+
Radio.displayName = RADIO_NAME;
|
|
2564
|
+
var INDICATOR_NAME = "RadioIndicator";
|
|
2565
|
+
var RadioIndicator = React$1.forwardRef((props, forwardedRef) => {
|
|
2566
|
+
const { __scopeRadio, forceMount, ...indicatorProps } = props;
|
|
2567
|
+
const context = useRadioContext(INDICATOR_NAME, __scopeRadio);
|
|
1675
2568
|
return /* @__PURE__ */ jsx(Presence, {
|
|
1676
|
-
present: forceMount ||
|
|
1677
|
-
children: /* @__PURE__ */ jsx(
|
|
1678
|
-
|
|
1679
|
-
|
|
1680
|
-
|
|
1681
|
-
|
|
1682
|
-
})
|
|
1683
|
-
|
|
1684
|
-
|
|
1685
|
-
|
|
1686
|
-
|
|
1687
|
-
|
|
1688
|
-
const
|
|
1689
|
-
const
|
|
1690
|
-
const
|
|
1691
|
-
|
|
1692
|
-
|
|
1693
|
-
|
|
1694
|
-
|
|
1695
|
-
|
|
1696
|
-
|
|
1697
|
-
|
|
1698
|
-
|
|
1699
|
-
|
|
1700
|
-
|
|
1701
|
-
if (!removeUnlinkedScrollListenerRef.current) {
|
|
1702
|
-
removeUnlinkedScrollListenerRef.current = addUnlinkedScrollListener(viewport, onThumbPositionChange);
|
|
1703
|
-
onThumbPositionChange();
|
|
1704
|
-
}
|
|
1705
|
-
};
|
|
1706
|
-
onThumbPositionChange();
|
|
1707
|
-
viewport.addEventListener("scroll", handleScroll);
|
|
1708
|
-
return () => viewport.removeEventListener("scroll", handleScroll);
|
|
2569
|
+
present: forceMount || context.checked,
|
|
2570
|
+
children: /* @__PURE__ */ jsx(Primitive.span, {
|
|
2571
|
+
"data-state": getState(context.checked),
|
|
2572
|
+
"data-disabled": context.disabled ? "" : void 0,
|
|
2573
|
+
...indicatorProps,
|
|
2574
|
+
ref: forwardedRef
|
|
2575
|
+
})
|
|
2576
|
+
});
|
|
2577
|
+
});
|
|
2578
|
+
RadioIndicator.displayName = INDICATOR_NAME;
|
|
2579
|
+
var BUBBLE_INPUT_NAME = "RadioBubbleInput";
|
|
2580
|
+
var RadioBubbleInput = React$1.forwardRef(({ __scopeRadio, control, checked, bubbles = true, ...props }, forwardedRef) => {
|
|
2581
|
+
const ref = React$1.useRef(null);
|
|
2582
|
+
const composedRefs = useComposedRefs(ref, forwardedRef);
|
|
2583
|
+
const prevChecked = usePrevious(checked);
|
|
2584
|
+
const controlSize = useSize(control);
|
|
2585
|
+
React$1.useEffect(() => {
|
|
2586
|
+
const input = ref.current;
|
|
2587
|
+
if (!input) return;
|
|
2588
|
+
const inputProto = window.HTMLInputElement.prototype;
|
|
2589
|
+
const setChecked = Object.getOwnPropertyDescriptor(inputProto, "checked").set;
|
|
2590
|
+
if (prevChecked !== checked && setChecked) {
|
|
2591
|
+
const event = new Event("click", { bubbles });
|
|
2592
|
+
setChecked.call(input, checked);
|
|
2593
|
+
input.dispatchEvent(event);
|
|
1709
2594
|
}
|
|
1710
2595
|
}, [
|
|
1711
|
-
|
|
1712
|
-
|
|
1713
|
-
|
|
2596
|
+
prevChecked,
|
|
2597
|
+
checked,
|
|
2598
|
+
bubbles
|
|
1714
2599
|
]);
|
|
1715
|
-
return /* @__PURE__ */ jsx(Primitive.
|
|
1716
|
-
|
|
1717
|
-
|
|
1718
|
-
|
|
2600
|
+
return /* @__PURE__ */ jsx(Primitive.input, {
|
|
2601
|
+
type: "radio",
|
|
2602
|
+
"aria-hidden": true,
|
|
2603
|
+
defaultChecked: checked,
|
|
2604
|
+
...props,
|
|
2605
|
+
tabIndex: -1,
|
|
2606
|
+
ref: composedRefs,
|
|
1719
2607
|
style: {
|
|
1720
|
-
|
|
1721
|
-
|
|
1722
|
-
|
|
1723
|
-
|
|
1724
|
-
|
|
1725
|
-
|
|
1726
|
-
|
|
1727
|
-
const y = event.clientY - thumbRect.top;
|
|
1728
|
-
scrollbarContext.onThumbPointerDown({
|
|
1729
|
-
x,
|
|
1730
|
-
y
|
|
1731
|
-
});
|
|
1732
|
-
}),
|
|
1733
|
-
onPointerUp: composeEventHandlers(props.onPointerUp, scrollbarContext.onThumbPointerUp)
|
|
2608
|
+
...props.style,
|
|
2609
|
+
...controlSize,
|
|
2610
|
+
position: "absolute",
|
|
2611
|
+
pointerEvents: "none",
|
|
2612
|
+
opacity: 0,
|
|
2613
|
+
margin: 0
|
|
2614
|
+
}
|
|
1734
2615
|
});
|
|
1735
2616
|
});
|
|
1736
|
-
|
|
1737
|
-
|
|
1738
|
-
|
|
1739
|
-
|
|
1740
|
-
|
|
1741
|
-
|
|
1742
|
-
|
|
2617
|
+
RadioBubbleInput.displayName = BUBBLE_INPUT_NAME;
|
|
2618
|
+
function getState(checked) {
|
|
2619
|
+
return checked ? "checked" : "unchecked";
|
|
2620
|
+
}
|
|
2621
|
+
var ARROW_KEYS = [
|
|
2622
|
+
"ArrowUp",
|
|
2623
|
+
"ArrowDown",
|
|
2624
|
+
"ArrowLeft",
|
|
2625
|
+
"ArrowRight"
|
|
2626
|
+
];
|
|
2627
|
+
var RADIO_GROUP_NAME = "RadioGroup";
|
|
2628
|
+
var [createRadioGroupContext, createRadioGroupScope] = createContextScope(RADIO_GROUP_NAME, [createRovingFocusGroupScope, createRadioScope]);
|
|
2629
|
+
var useRovingFocusGroupScope = createRovingFocusGroupScope();
|
|
2630
|
+
var useRadioScope = createRadioScope();
|
|
2631
|
+
var [RadioGroupProvider, useRadioGroupContext] = createRadioGroupContext(RADIO_GROUP_NAME);
|
|
2632
|
+
var RadioGroup = React$1.forwardRef((props, forwardedRef) => {
|
|
2633
|
+
const { __scopeRadioGroup, name, defaultValue, value: valueProp, required = false, disabled = false, orientation, dir, loop = true, onValueChange, ...groupProps } = props;
|
|
2634
|
+
const rovingFocusGroupScope = useRovingFocusGroupScope(__scopeRadioGroup);
|
|
2635
|
+
const direction = useDirection(dir);
|
|
2636
|
+
const [value, setValue] = useControllableState({
|
|
2637
|
+
prop: valueProp,
|
|
2638
|
+
defaultProp: defaultValue ?? null,
|
|
2639
|
+
onChange: onValueChange,
|
|
2640
|
+
caller: RADIO_GROUP_NAME
|
|
2641
|
+
});
|
|
2642
|
+
return /* @__PURE__ */ jsx(RadioGroupProvider, {
|
|
2643
|
+
scope: __scopeRadioGroup,
|
|
2644
|
+
name,
|
|
2645
|
+
required,
|
|
2646
|
+
disabled,
|
|
2647
|
+
value,
|
|
2648
|
+
onValueChange: setValue,
|
|
2649
|
+
children: /* @__PURE__ */ jsx(Root$3, {
|
|
2650
|
+
asChild: true,
|
|
2651
|
+
...rovingFocusGroupScope,
|
|
2652
|
+
orientation,
|
|
2653
|
+
dir: direction,
|
|
2654
|
+
loop,
|
|
2655
|
+
children: /* @__PURE__ */ jsx(Primitive.div, {
|
|
2656
|
+
role: "radiogroup",
|
|
2657
|
+
"aria-required": required,
|
|
2658
|
+
"aria-orientation": orientation,
|
|
2659
|
+
"data-disabled": disabled ? "" : void 0,
|
|
2660
|
+
dir: direction,
|
|
2661
|
+
...groupProps,
|
|
2662
|
+
ref: forwardedRef
|
|
2663
|
+
})
|
|
2664
|
+
})
|
|
2665
|
+
});
|
|
2666
|
+
});
|
|
2667
|
+
RadioGroup.displayName = RADIO_GROUP_NAME;
|
|
2668
|
+
var ITEM_NAME = "RadioGroupItem";
|
|
2669
|
+
var RadioGroupItem = React$1.forwardRef((props, forwardedRef) => {
|
|
2670
|
+
const { __scopeRadioGroup, disabled, ...itemProps } = props;
|
|
2671
|
+
const context = useRadioGroupContext(ITEM_NAME, __scopeRadioGroup);
|
|
2672
|
+
const isDisabled = context.disabled || disabled;
|
|
2673
|
+
const rovingFocusGroupScope = useRovingFocusGroupScope(__scopeRadioGroup);
|
|
2674
|
+
const radioScope = useRadioScope(__scopeRadioGroup);
|
|
2675
|
+
const ref = React$1.useRef(null);
|
|
2676
|
+
const composedRefs = useComposedRefs(forwardedRef, ref);
|
|
2677
|
+
const checked = context.value === itemProps.value;
|
|
2678
|
+
const isArrowKeyPressedRef = React$1.useRef(false);
|
|
2679
|
+
React$1.useEffect(() => {
|
|
2680
|
+
const handleKeyDown = (event) => {
|
|
2681
|
+
if (ARROW_KEYS.includes(event.key)) isArrowKeyPressedRef.current = true;
|
|
2682
|
+
};
|
|
2683
|
+
const handleKeyUp = () => isArrowKeyPressedRef.current = false;
|
|
2684
|
+
document.addEventListener("keydown", handleKeyDown);
|
|
2685
|
+
document.addEventListener("keyup", handleKeyUp);
|
|
2686
|
+
return () => {
|
|
2687
|
+
document.removeEventListener("keydown", handleKeyDown);
|
|
2688
|
+
document.removeEventListener("keyup", handleKeyUp);
|
|
2689
|
+
};
|
|
2690
|
+
}, []);
|
|
2691
|
+
return /* @__PURE__ */ jsx(Item, {
|
|
2692
|
+
asChild: true,
|
|
2693
|
+
...rovingFocusGroupScope,
|
|
2694
|
+
focusable: !isDisabled,
|
|
2695
|
+
active: checked,
|
|
2696
|
+
children: /* @__PURE__ */ jsx(Radio, {
|
|
2697
|
+
disabled: isDisabled,
|
|
2698
|
+
required: context.required,
|
|
2699
|
+
checked,
|
|
2700
|
+
...radioScope,
|
|
2701
|
+
...itemProps,
|
|
2702
|
+
name: context.name,
|
|
2703
|
+
ref: composedRefs,
|
|
2704
|
+
onCheck: () => context.onValueChange(itemProps.value),
|
|
2705
|
+
onKeyDown: composeEventHandlers((event) => {
|
|
2706
|
+
if (event.key === "Enter") event.preventDefault();
|
|
2707
|
+
}),
|
|
2708
|
+
onFocus: composeEventHandlers(itemProps.onFocus, () => {
|
|
2709
|
+
if (isArrowKeyPressedRef.current) ref.current?.click();
|
|
2710
|
+
})
|
|
2711
|
+
})
|
|
2712
|
+
});
|
|
2713
|
+
});
|
|
2714
|
+
RadioGroupItem.displayName = ITEM_NAME;
|
|
2715
|
+
var INDICATOR_NAME2 = "RadioGroupIndicator";
|
|
2716
|
+
var RadioGroupIndicator = React$1.forwardRef((props, forwardedRef) => {
|
|
2717
|
+
const { __scopeRadioGroup, ...indicatorProps } = props;
|
|
2718
|
+
return /* @__PURE__ */ jsx(RadioIndicator, {
|
|
2719
|
+
...useRadioScope(__scopeRadioGroup),
|
|
2720
|
+
...indicatorProps,
|
|
1743
2721
|
ref: forwardedRef
|
|
1744
|
-
})
|
|
2722
|
+
});
|
|
1745
2723
|
});
|
|
1746
|
-
|
|
1747
|
-
var
|
|
1748
|
-
|
|
1749
|
-
|
|
1750
|
-
|
|
1751
|
-
|
|
1752
|
-
|
|
1753
|
-
|
|
1754
|
-
|
|
1755
|
-
|
|
1756
|
-
|
|
2724
|
+
RadioGroupIndicator.displayName = INDICATOR_NAME2;
|
|
2725
|
+
var Root2 = RadioGroup;
|
|
2726
|
+
var Item2 = RadioGroupItem;
|
|
2727
|
+
var Indicator = RadioGroupIndicator;
|
|
2728
|
+
var RadioGroupGlassRoot = React$1.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(Root2, {
|
|
2729
|
+
ref,
|
|
2730
|
+
className: cn("grid gap-2", className),
|
|
2731
|
+
...props
|
|
2732
|
+
}));
|
|
2733
|
+
RadioGroupGlassRoot.displayName = "RadioGroupGlassRoot";
|
|
2734
|
+
var RadioGroupGlassItem = React$1.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(Item2, {
|
|
2735
|
+
ref,
|
|
2736
|
+
className: cn("aspect-square h-4 w-4 rounded-full", "border border-[var(--radio-border,var(--glass-border))]", "bg-[var(--radio-bg,transparent)]", "text-[var(--radio-indicator,var(--semantic-primary))]", "ring-offset-background", "focus:outline-none focus-visible:ring-2", "focus-visible:ring-[var(--focus-ring)] focus-visible:ring-offset-2", "disabled:cursor-not-allowed disabled:opacity-50", "data-[state=checked]:border-[var(--radio-border-checked,var(--semantic-primary))]", "data-[state=checked]:bg-[var(--radio-bg-checked,var(--semantic-primary-subtle))]", "transition-all duration-200", className),
|
|
2737
|
+
...props,
|
|
2738
|
+
children: /* @__PURE__ */ jsx(Indicator, {
|
|
2739
|
+
className: "flex items-center justify-center",
|
|
2740
|
+
children: /* @__PURE__ */ jsx(Circle, { className: cn("h-2.5 w-2.5 fill-current text-current", "drop-shadow-[0_0_4px_var(--semantic-primary)]") })
|
|
2741
|
+
})
|
|
2742
|
+
}));
|
|
2743
|
+
RadioGroupGlassItem.displayName = "RadioGroupGlassItem";
|
|
2744
|
+
const RadioGroupGlass = {
|
|
2745
|
+
Root: RadioGroupGlassRoot,
|
|
2746
|
+
Item: RadioGroupGlassItem
|
|
2747
|
+
};
|
|
2748
|
+
var sheetVariants = cva([
|
|
2749
|
+
"fixed z-50 gap-4 p-6",
|
|
2750
|
+
"bg-[var(--sheet-bg,var(--modal-bg))]",
|
|
2751
|
+
"border-[var(--sheet-border,var(--modal-border))]",
|
|
2752
|
+
"backdrop-blur-lg",
|
|
2753
|
+
"transition-all duration-300 ease-in-out",
|
|
2754
|
+
"data-[state=open]:animate-in data-[state=closed]:animate-out"
|
|
2755
|
+
], {
|
|
2756
|
+
variants: { side: {
|
|
2757
|
+
top: ["inset-x-0 top-0 border-b", "data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top"],
|
|
2758
|
+
bottom: ["inset-x-0 bottom-0 border-t", "data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom"],
|
|
2759
|
+
left: ["inset-y-0 left-0 h-full w-3/4 border-r sm:max-w-sm", "data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left"],
|
|
2760
|
+
right: ["inset-y-0 right-0 h-full w-3/4 border-r sm:max-w-sm", "data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right"]
|
|
2761
|
+
} },
|
|
2762
|
+
defaultVariants: { side: "right" }
|
|
2763
|
+
});
|
|
2764
|
+
var SheetGlassRoot = DialogPrimitive.Root;
|
|
2765
|
+
var SheetGlassTrigger = DialogPrimitive.Trigger;
|
|
2766
|
+
var SheetGlassClose = DialogPrimitive.Close;
|
|
2767
|
+
var SheetGlassPortal = DialogPrimitive.Portal;
|
|
2768
|
+
var SheetGlassOverlay = React$1.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(DialogPrimitive.Overlay, {
|
|
2769
|
+
ref,
|
|
2770
|
+
className: cn("fixed inset-0 z-50", "bg-[var(--sheet-overlay,var(--modal-overlay))]", "backdrop-blur-sm", "data-[state=open]:animate-in data-[state=closed]:animate-out", "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0", className),
|
|
2771
|
+
...props
|
|
2772
|
+
}));
|
|
2773
|
+
SheetGlassOverlay.displayName = "SheetGlassOverlay";
|
|
2774
|
+
var SheetGlassContent = React$1.forwardRef(({ side = "right", className, children, ...props }, ref) => /* @__PURE__ */ jsxs(SheetGlassPortal, { children: [/* @__PURE__ */ jsx(SheetGlassOverlay, {}), /* @__PURE__ */ jsxs(DialogPrimitive.Content, {
|
|
2775
|
+
ref,
|
|
2776
|
+
className: cn(sheetVariants({ side }), className),
|
|
2777
|
+
...props,
|
|
2778
|
+
children: [children, /* @__PURE__ */ jsxs(DialogPrimitive.Close, {
|
|
2779
|
+
className: cn("absolute right-4 top-4 rounded-sm", "opacity-70 ring-offset-background", "transition-opacity hover:opacity-100", "focus:outline-none focus:ring-2 focus:ring-[var(--focus-ring)] focus:ring-offset-2", "disabled:pointer-events-none", "data-[state=open]:bg-secondary"),
|
|
2780
|
+
children: [/* @__PURE__ */ jsx(X, { className: "h-4 w-4" }), /* @__PURE__ */ jsx("span", {
|
|
2781
|
+
className: "sr-only",
|
|
2782
|
+
children: "Close"
|
|
2783
|
+
})]
|
|
2784
|
+
})]
|
|
2785
|
+
})] }));
|
|
2786
|
+
SheetGlassContent.displayName = "SheetGlassContent";
|
|
2787
|
+
var SheetGlassHeader = ({ className, ...props }) => /* @__PURE__ */ jsx("div", {
|
|
2788
|
+
className: cn("flex flex-col space-y-2 text-center sm:text-left", className),
|
|
2789
|
+
...props
|
|
2790
|
+
});
|
|
2791
|
+
SheetGlassHeader.displayName = "SheetGlassHeader";
|
|
2792
|
+
var SheetGlassFooter = ({ className, ...props }) => /* @__PURE__ */ jsx("div", {
|
|
2793
|
+
className: cn("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2", className),
|
|
2794
|
+
...props
|
|
2795
|
+
});
|
|
2796
|
+
SheetGlassFooter.displayName = "SheetGlassFooter";
|
|
2797
|
+
var SheetGlassTitle = React$1.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(DialogPrimitive.Title, {
|
|
2798
|
+
ref,
|
|
2799
|
+
className: cn("text-lg font-semibold", "text-[var(--sheet-title,var(--text-primary))]", className),
|
|
2800
|
+
...props
|
|
2801
|
+
}));
|
|
2802
|
+
SheetGlassTitle.displayName = "SheetGlassTitle";
|
|
2803
|
+
var SheetGlassDescription = React$1.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(DialogPrimitive.Description, {
|
|
2804
|
+
ref,
|
|
2805
|
+
className: cn("text-sm", "text-[var(--sheet-description,var(--text-muted))]", className),
|
|
2806
|
+
...props
|
|
2807
|
+
}));
|
|
2808
|
+
SheetGlassDescription.displayName = "SheetGlassDescription";
|
|
2809
|
+
const SheetGlass = {
|
|
2810
|
+
Root: SheetGlassRoot,
|
|
2811
|
+
Trigger: SheetGlassTrigger,
|
|
2812
|
+
Close: SheetGlassClose,
|
|
2813
|
+
Portal: SheetGlassPortal,
|
|
2814
|
+
Overlay: SheetGlassOverlay,
|
|
2815
|
+
Content: SheetGlassContent,
|
|
2816
|
+
Header: SheetGlassHeader,
|
|
2817
|
+
Footer: SheetGlassFooter,
|
|
2818
|
+
Title: SheetGlassTitle,
|
|
2819
|
+
Description: SheetGlassDescription
|
|
2820
|
+
};
|
|
2821
|
+
function _extends$1() {
|
|
2822
|
+
return _extends$1 = Object.assign ? Object.assign.bind() : function(n) {
|
|
2823
|
+
for (var e = 1; e < arguments.length; e++) {
|
|
2824
|
+
var t = arguments[e];
|
|
2825
|
+
for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
|
|
2826
|
+
}
|
|
2827
|
+
return n;
|
|
2828
|
+
}, _extends$1.apply(null, arguments);
|
|
2829
|
+
}
|
|
2830
|
+
function ownKeys$1(e, r) {
|
|
2831
|
+
var t = Object.keys(e);
|
|
2832
|
+
if (Object.getOwnPropertySymbols) {
|
|
2833
|
+
var o = Object.getOwnPropertySymbols(e);
|
|
2834
|
+
r && (o = o.filter(function(r$1) {
|
|
2835
|
+
return Object.getOwnPropertyDescriptor(e, r$1).enumerable;
|
|
2836
|
+
})), t.push.apply(t, o);
|
|
2837
|
+
}
|
|
2838
|
+
return t;
|
|
2839
|
+
}
|
|
2840
|
+
function _objectSpread$1(e) {
|
|
2841
|
+
for (var r = 1; r < arguments.length; r++) {
|
|
2842
|
+
var t = null != arguments[r] ? arguments[r] : {};
|
|
2843
|
+
r % 2 ? ownKeys$1(Object(t), !0).forEach(function(r$1) {
|
|
2844
|
+
_defineProperty$1(e, r$1, t[r$1]);
|
|
2845
|
+
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys$1(Object(t)).forEach(function(r$1) {
|
|
2846
|
+
Object.defineProperty(e, r$1, Object.getOwnPropertyDescriptor(t, r$1));
|
|
2847
|
+
});
|
|
2848
|
+
}
|
|
2849
|
+
return e;
|
|
2850
|
+
}
|
|
2851
|
+
function _defineProperty$1(e, r, t) {
|
|
2852
|
+
return (r = _toPropertyKey$1(r)) in e ? Object.defineProperty(e, r, {
|
|
2853
|
+
value: t,
|
|
2854
|
+
enumerable: !0,
|
|
2855
|
+
configurable: !0,
|
|
2856
|
+
writable: !0
|
|
2857
|
+
}) : e[r] = t, e;
|
|
2858
|
+
}
|
|
2859
|
+
function _toPropertyKey$1(t) {
|
|
2860
|
+
var i = _toPrimitive$1(t, "string");
|
|
2861
|
+
return "symbol" == typeof i ? i : i + "";
|
|
2862
|
+
}
|
|
2863
|
+
function _toPrimitive$1(t, r) {
|
|
2864
|
+
if ("object" != typeof t || !t) return t;
|
|
2865
|
+
var e = t[Symbol.toPrimitive];
|
|
2866
|
+
if (void 0 !== e) {
|
|
2867
|
+
var i = e.call(t, r || "default");
|
|
2868
|
+
if ("object" != typeof i) return i;
|
|
2869
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
2870
|
+
}
|
|
2871
|
+
return ("string" === r ? String : Number)(t);
|
|
2872
|
+
}
|
|
2873
|
+
var SIZE = 32;
|
|
2874
|
+
var defaultLegendContentDefaultProps = {
|
|
2875
|
+
align: "center",
|
|
2876
|
+
iconSize: 14,
|
|
2877
|
+
inactiveColor: "#ccc",
|
|
2878
|
+
layout: "horizontal",
|
|
2879
|
+
verticalAlign: "middle"
|
|
2880
|
+
};
|
|
2881
|
+
function Icon(_ref) {
|
|
2882
|
+
var { data, iconType, inactiveColor } = _ref;
|
|
2883
|
+
var halfSize = SIZE / 2;
|
|
2884
|
+
var sixthSize = SIZE / 6;
|
|
2885
|
+
var thirdSize = SIZE / 3;
|
|
2886
|
+
var color = data.inactive ? inactiveColor : data.color;
|
|
2887
|
+
var preferredIcon = iconType !== null && iconType !== void 0 ? iconType : data.type;
|
|
2888
|
+
if (preferredIcon === "none") return null;
|
|
2889
|
+
if (preferredIcon === "plainline") {
|
|
2890
|
+
var _data$payload;
|
|
2891
|
+
return /* @__PURE__ */ React$1.createElement("line", {
|
|
2892
|
+
strokeWidth: 4,
|
|
2893
|
+
fill: "none",
|
|
2894
|
+
stroke: color,
|
|
2895
|
+
strokeDasharray: (_data$payload = data.payload) === null || _data$payload === void 0 ? void 0 : _data$payload.strokeDasharray,
|
|
2896
|
+
x1: 0,
|
|
2897
|
+
y1: halfSize,
|
|
2898
|
+
x2: SIZE,
|
|
2899
|
+
y2: halfSize,
|
|
2900
|
+
className: "recharts-legend-icon"
|
|
2901
|
+
});
|
|
2902
|
+
}
|
|
2903
|
+
if (preferredIcon === "line") return /* @__PURE__ */ React$1.createElement("path", {
|
|
2904
|
+
strokeWidth: 4,
|
|
2905
|
+
fill: "none",
|
|
2906
|
+
stroke: color,
|
|
2907
|
+
d: "M0,".concat(halfSize, "h").concat(thirdSize, "\n A").concat(sixthSize, ",").concat(sixthSize, ",0,1,1,").concat(2 * thirdSize, ",").concat(halfSize, "\n H").concat(SIZE, "M").concat(2 * thirdSize, ",").concat(halfSize, "\n A").concat(sixthSize, ",").concat(sixthSize, ",0,1,1,").concat(thirdSize, ",").concat(halfSize),
|
|
2908
|
+
className: "recharts-legend-icon"
|
|
1757
2909
|
});
|
|
1758
|
-
|
|
1759
|
-
|
|
1760
|
-
|
|
1761
|
-
|
|
2910
|
+
if (preferredIcon === "rect") return /* @__PURE__ */ React$1.createElement("path", {
|
|
2911
|
+
stroke: "none",
|
|
2912
|
+
fill: color,
|
|
2913
|
+
d: "M0,".concat(SIZE / 8, "h").concat(SIZE, "v").concat(SIZE * 3 / 4, "h").concat(-SIZE, "z"),
|
|
2914
|
+
className: "recharts-legend-icon"
|
|
1762
2915
|
});
|
|
1763
|
-
|
|
1764
|
-
|
|
1765
|
-
|
|
1766
|
-
|
|
1767
|
-
|
|
1768
|
-
|
|
1769
|
-
|
|
1770
|
-
|
|
1771
|
-
|
|
1772
|
-
|
|
1773
|
-
|
|
2916
|
+
if (/* @__PURE__ */ React$1.isValidElement(data.legendIcon)) {
|
|
2917
|
+
var iconProps = _objectSpread$1({}, data);
|
|
2918
|
+
delete iconProps.legendIcon;
|
|
2919
|
+
return /* @__PURE__ */ React$1.cloneElement(data.legendIcon, iconProps);
|
|
2920
|
+
}
|
|
2921
|
+
return /* @__PURE__ */ React$1.createElement(Symbols, {
|
|
2922
|
+
fill: color,
|
|
2923
|
+
cx: halfSize,
|
|
2924
|
+
cy: halfSize,
|
|
2925
|
+
size: SIZE,
|
|
2926
|
+
sizeType: "diameter",
|
|
2927
|
+
type: preferredIcon
|
|
2928
|
+
});
|
|
2929
|
+
}
|
|
2930
|
+
function Items(props) {
|
|
2931
|
+
var { payload, iconSize, layout, formatter, inactiveColor, iconType } = props;
|
|
2932
|
+
var viewBox = {
|
|
2933
|
+
x: 0,
|
|
2934
|
+
y: 0,
|
|
2935
|
+
width: SIZE,
|
|
2936
|
+
height: SIZE
|
|
2937
|
+
};
|
|
2938
|
+
var itemStyle = {
|
|
2939
|
+
display: layout === "horizontal" ? "inline-block" : "block",
|
|
2940
|
+
marginRight: 10
|
|
2941
|
+
};
|
|
2942
|
+
var svgStyle = {
|
|
2943
|
+
display: "inline-block",
|
|
2944
|
+
verticalAlign: "middle",
|
|
2945
|
+
marginRight: 4
|
|
2946
|
+
};
|
|
2947
|
+
return payload.map((entry, i) => {
|
|
2948
|
+
var finalFormatter = entry.formatter || formatter;
|
|
2949
|
+
var className = clsx({
|
|
2950
|
+
"recharts-legend-item": true,
|
|
2951
|
+
["legend-item-".concat(i)]: true,
|
|
2952
|
+
inactive: entry.inactive
|
|
2953
|
+
});
|
|
2954
|
+
if (entry.type === "none") return null;
|
|
2955
|
+
var color = entry.inactive ? inactiveColor : entry.color;
|
|
2956
|
+
var finalValue = finalFormatter ? finalFormatter(entry.value, entry, i) : entry.value;
|
|
2957
|
+
return /* @__PURE__ */ React$1.createElement("li", _extends$1({
|
|
2958
|
+
className,
|
|
2959
|
+
style: itemStyle,
|
|
2960
|
+
key: "legend-item-".concat(i)
|
|
2961
|
+
}, adaptEventsOfChild(props, entry, i)), /* @__PURE__ */ React$1.createElement(Surface, {
|
|
2962
|
+
width: iconSize,
|
|
2963
|
+
height: iconSize,
|
|
2964
|
+
viewBox,
|
|
2965
|
+
style: svgStyle,
|
|
2966
|
+
"aria-label": "".concat(finalValue, " legend icon")
|
|
2967
|
+
}, /* @__PURE__ */ React$1.createElement(Icon, {
|
|
2968
|
+
data: entry,
|
|
2969
|
+
iconType,
|
|
2970
|
+
inactiveColor
|
|
2971
|
+
})), /* @__PURE__ */ React$1.createElement("span", {
|
|
2972
|
+
className: "recharts-legend-item-text",
|
|
2973
|
+
style: { color }
|
|
2974
|
+
}, finalValue));
|
|
2975
|
+
});
|
|
2976
|
+
}
|
|
2977
|
+
var DefaultLegendContent = (outsideProps) => {
|
|
2978
|
+
var props = resolveDefaultProps(outsideProps, defaultLegendContentDefaultProps);
|
|
2979
|
+
var { payload, layout, align } = props;
|
|
2980
|
+
if (!payload || !payload.length) return null;
|
|
2981
|
+
var finalStyle = {
|
|
2982
|
+
padding: 0,
|
|
2983
|
+
margin: 0,
|
|
2984
|
+
textAlign: layout === "horizontal" ? align : "left"
|
|
2985
|
+
};
|
|
2986
|
+
return /* @__PURE__ */ React$1.createElement("ul", {
|
|
2987
|
+
className: "recharts-default-legend",
|
|
2988
|
+
style: finalStyle
|
|
2989
|
+
}, /* @__PURE__ */ React$1.createElement(Items, _extends$1({}, props, { payload })));
|
|
2990
|
+
};
|
|
2991
|
+
function useLegendPayload() {
|
|
2992
|
+
return useAppSelector(selectLegendPayload);
|
|
2993
|
+
}
|
|
2994
|
+
var _excluded = ["contextPayload"];
|
|
2995
|
+
function _extends() {
|
|
2996
|
+
return _extends = Object.assign ? Object.assign.bind() : function(n) {
|
|
2997
|
+
for (var e = 1; e < arguments.length; e++) {
|
|
2998
|
+
var t = arguments[e];
|
|
2999
|
+
for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
|
|
1774
3000
|
}
|
|
1775
|
-
|
|
1776
|
-
});
|
|
1777
|
-
function toInt(value) {
|
|
1778
|
-
return value ? parseInt(value, 10) : 0;
|
|
3001
|
+
return n;
|
|
3002
|
+
}, _extends.apply(null, arguments);
|
|
1779
3003
|
}
|
|
1780
|
-
function
|
|
1781
|
-
|
|
1782
|
-
|
|
3004
|
+
function ownKeys(e, r) {
|
|
3005
|
+
var t = Object.keys(e);
|
|
3006
|
+
if (Object.getOwnPropertySymbols) {
|
|
3007
|
+
var o = Object.getOwnPropertySymbols(e);
|
|
3008
|
+
r && (o = o.filter(function(r$1) {
|
|
3009
|
+
return Object.getOwnPropertyDescriptor(e, r$1).enumerable;
|
|
3010
|
+
})), t.push.apply(t, o);
|
|
3011
|
+
}
|
|
3012
|
+
return t;
|
|
1783
3013
|
}
|
|
1784
|
-
function
|
|
1785
|
-
|
|
1786
|
-
|
|
1787
|
-
|
|
1788
|
-
|
|
3014
|
+
function _objectSpread(e) {
|
|
3015
|
+
for (var r = 1; r < arguments.length; r++) {
|
|
3016
|
+
var t = null != arguments[r] ? arguments[r] : {};
|
|
3017
|
+
r % 2 ? ownKeys(Object(t), !0).forEach(function(r$1) {
|
|
3018
|
+
_defineProperty(e, r$1, t[r$1]);
|
|
3019
|
+
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function(r$1) {
|
|
3020
|
+
Object.defineProperty(e, r$1, Object.getOwnPropertyDescriptor(t, r$1));
|
|
3021
|
+
});
|
|
3022
|
+
}
|
|
3023
|
+
return e;
|
|
1789
3024
|
}
|
|
1790
|
-
function
|
|
1791
|
-
|
|
1792
|
-
|
|
1793
|
-
|
|
1794
|
-
|
|
1795
|
-
|
|
1796
|
-
|
|
1797
|
-
const maxScrollPos = sizes.content - sizes.viewport;
|
|
1798
|
-
const scrollRange = dir === "ltr" ? [0, maxScrollPos] : [maxScrollPos * -1, 0];
|
|
1799
|
-
return linearScale([minPointerPos, maxPointerPos], scrollRange)(pointerPos);
|
|
3025
|
+
function _defineProperty(e, r, t) {
|
|
3026
|
+
return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
|
|
3027
|
+
value: t,
|
|
3028
|
+
enumerable: !0,
|
|
3029
|
+
configurable: !0,
|
|
3030
|
+
writable: !0
|
|
3031
|
+
}) : e[r] = t, e;
|
|
1800
3032
|
}
|
|
1801
|
-
function
|
|
1802
|
-
|
|
1803
|
-
|
|
1804
|
-
const scrollbar = sizes.scrollbar.size - scrollbarPadding;
|
|
1805
|
-
const maxScrollPos = sizes.content - sizes.viewport;
|
|
1806
|
-
const maxThumbPos = scrollbar - thumbSizePx;
|
|
1807
|
-
const scrollWithoutMomentum = clamp(scrollPos, dir === "ltr" ? [0, maxScrollPos] : [maxScrollPos * -1, 0]);
|
|
1808
|
-
return linearScale([0, maxScrollPos], [0, maxThumbPos])(scrollWithoutMomentum);
|
|
3033
|
+
function _toPropertyKey(t) {
|
|
3034
|
+
var i = _toPrimitive(t, "string");
|
|
3035
|
+
return "symbol" == typeof i ? i : i + "";
|
|
1809
3036
|
}
|
|
1810
|
-
function
|
|
1811
|
-
|
|
1812
|
-
|
|
1813
|
-
|
|
1814
|
-
|
|
1815
|
-
|
|
3037
|
+
function _toPrimitive(t, r) {
|
|
3038
|
+
if ("object" != typeof t || !t) return t;
|
|
3039
|
+
var e = t[Symbol.toPrimitive];
|
|
3040
|
+
if (void 0 !== e) {
|
|
3041
|
+
var i = e.call(t, r || "default");
|
|
3042
|
+
if ("object" != typeof i) return i;
|
|
3043
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
3044
|
+
}
|
|
3045
|
+
return ("string" === r ? String : Number)(t);
|
|
1816
3046
|
}
|
|
1817
|
-
function
|
|
1818
|
-
|
|
3047
|
+
function _objectWithoutProperties(e, t) {
|
|
3048
|
+
if (null == e) return {};
|
|
3049
|
+
var o, r, i = _objectWithoutPropertiesLoose(e, t);
|
|
3050
|
+
if (Object.getOwnPropertySymbols) {
|
|
3051
|
+
var n = Object.getOwnPropertySymbols(e);
|
|
3052
|
+
for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]);
|
|
3053
|
+
}
|
|
3054
|
+
return i;
|
|
1819
3055
|
}
|
|
1820
|
-
|
|
1821
|
-
|
|
1822
|
-
|
|
1823
|
-
|
|
1824
|
-
|
|
1825
|
-
|
|
1826
|
-
|
|
1827
|
-
|
|
1828
|
-
|
|
1829
|
-
|
|
3056
|
+
function _objectWithoutPropertiesLoose(r, e) {
|
|
3057
|
+
if (null == r) return {};
|
|
3058
|
+
var t = {};
|
|
3059
|
+
for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
|
|
3060
|
+
if (-1 !== e.indexOf(n)) continue;
|
|
3061
|
+
t[n] = r[n];
|
|
3062
|
+
}
|
|
3063
|
+
return t;
|
|
3064
|
+
}
|
|
3065
|
+
function defaultUniqBy(entry) {
|
|
3066
|
+
return entry.value;
|
|
3067
|
+
}
|
|
3068
|
+
function LegendContent(props) {
|
|
3069
|
+
var { contextPayload } = props, otherProps = _objectWithoutProperties(props, _excluded);
|
|
3070
|
+
var finalPayload = getUniqPayload(contextPayload, props.payloadUniqBy, defaultUniqBy);
|
|
3071
|
+
var contentProps = _objectSpread(_objectSpread({}, otherProps), {}, { payload: finalPayload });
|
|
3072
|
+
if (/* @__PURE__ */ React$1.isValidElement(props.content)) return /* @__PURE__ */ React$1.cloneElement(props.content, contentProps);
|
|
3073
|
+
if (typeof props.content === "function") return /* @__PURE__ */ React$1.createElement(props.content, contentProps);
|
|
3074
|
+
return /* @__PURE__ */ React$1.createElement(DefaultLegendContent, contentProps);
|
|
3075
|
+
}
|
|
3076
|
+
function getDefaultPosition(style, props, margin, chartWidth, chartHeight, box) {
|
|
3077
|
+
var { layout, align, verticalAlign } = props;
|
|
3078
|
+
var hPos, vPos;
|
|
3079
|
+
if (!style || (style.left === void 0 || style.left === null) && (style.right === void 0 || style.right === null)) if (align === "center" && layout === "vertical") hPos = { left: ((chartWidth || 0) - box.width) / 2 };
|
|
3080
|
+
else hPos = align === "right" ? { right: margin && margin.right || 0 } : { left: margin && margin.left || 0 };
|
|
3081
|
+
if (!style || (style.top === void 0 || style.top === null) && (style.bottom === void 0 || style.bottom === null)) if (verticalAlign === "middle") vPos = { top: ((chartHeight || 0) - box.height) / 2 };
|
|
3082
|
+
else vPos = verticalAlign === "bottom" ? { bottom: margin && margin.bottom || 0 } : { top: margin && margin.top || 0 };
|
|
3083
|
+
return _objectSpread(_objectSpread({}, hPos), vPos);
|
|
3084
|
+
}
|
|
3085
|
+
function LegendSettingsDispatcher(props) {
|
|
3086
|
+
var dispatch = useAppDispatch();
|
|
3087
|
+
useEffect(() => {
|
|
3088
|
+
dispatch(setLegendSettings(props));
|
|
3089
|
+
}, [dispatch, props]);
|
|
3090
|
+
return null;
|
|
3091
|
+
}
|
|
3092
|
+
function LegendSizeDispatcher(props) {
|
|
3093
|
+
var dispatch = useAppDispatch();
|
|
3094
|
+
useEffect(() => {
|
|
3095
|
+
dispatch(setLegendSize(props));
|
|
3096
|
+
return () => {
|
|
3097
|
+
dispatch(setLegendSize({
|
|
3098
|
+
width: 0,
|
|
3099
|
+
height: 0
|
|
3100
|
+
}));
|
|
1830
3101
|
};
|
|
1831
|
-
|
|
1832
|
-
|
|
1833
|
-
if (isHorizontalScroll || isVerticalScroll) handler();
|
|
1834
|
-
prevPosition = position;
|
|
1835
|
-
rAF = window.requestAnimationFrame(loop);
|
|
1836
|
-
})();
|
|
1837
|
-
return () => window.cancelAnimationFrame(rAF);
|
|
1838
|
-
};
|
|
1839
|
-
function useDebounceCallback(callback, delay) {
|
|
1840
|
-
const handleCallback = useCallbackRef(callback);
|
|
1841
|
-
const debounceTimerRef = React$1.useRef(0);
|
|
1842
|
-
React$1.useEffect(() => () => window.clearTimeout(debounceTimerRef.current), []);
|
|
1843
|
-
return React$1.useCallback(() => {
|
|
1844
|
-
window.clearTimeout(debounceTimerRef.current);
|
|
1845
|
-
debounceTimerRef.current = window.setTimeout(handleCallback, delay);
|
|
1846
|
-
}, [handleCallback, delay]);
|
|
3102
|
+
}, [dispatch, props]);
|
|
3103
|
+
return null;
|
|
1847
3104
|
}
|
|
1848
|
-
function
|
|
1849
|
-
|
|
1850
|
-
|
|
1851
|
-
|
|
1852
|
-
if (element) {
|
|
1853
|
-
const resizeObserver = new ResizeObserver(() => {
|
|
1854
|
-
cancelAnimationFrame(rAF);
|
|
1855
|
-
rAF = window.requestAnimationFrame(handleResize);
|
|
1856
|
-
});
|
|
1857
|
-
resizeObserver.observe(element);
|
|
1858
|
-
return () => {
|
|
1859
|
-
window.cancelAnimationFrame(rAF);
|
|
1860
|
-
resizeObserver.unobserve(element);
|
|
1861
|
-
};
|
|
1862
|
-
}
|
|
1863
|
-
}, [element, handleResize]);
|
|
3105
|
+
function getWidthOrHeight(layout, height, width, maxWidth) {
|
|
3106
|
+
if (layout === "vertical" && isNumber(height)) return { height };
|
|
3107
|
+
if (layout === "horizontal") return { width: width || maxWidth };
|
|
3108
|
+
return null;
|
|
1864
3109
|
}
|
|
1865
|
-
var
|
|
1866
|
-
|
|
1867
|
-
|
|
3110
|
+
var legendDefaultProps = {
|
|
3111
|
+
align: "center",
|
|
3112
|
+
iconSize: 14,
|
|
3113
|
+
itemSorter: "value",
|
|
3114
|
+
layout: "horizontal",
|
|
3115
|
+
verticalAlign: "bottom"
|
|
3116
|
+
};
|
|
3117
|
+
function Legend(outsideProps) {
|
|
3118
|
+
var props = resolveDefaultProps(outsideProps, legendDefaultProps);
|
|
3119
|
+
var contextPayload = useLegendPayload();
|
|
3120
|
+
var legendPortalFromContext = useLegendPortal();
|
|
3121
|
+
var margin = useMargin();
|
|
3122
|
+
var { width: widthFromProps, height: heightFromProps, wrapperStyle, portal: portalFromProps } = props;
|
|
3123
|
+
var [lastBoundingBox, updateBoundingBox] = useElementOffset([contextPayload]);
|
|
3124
|
+
var chartWidth = useChartWidth();
|
|
3125
|
+
var chartHeight = useChartHeight();
|
|
3126
|
+
if (chartWidth == null || chartHeight == null) return null;
|
|
3127
|
+
var maxWidth = chartWidth - ((margin === null || margin === void 0 ? void 0 : margin.left) || 0) - ((margin === null || margin === void 0 ? void 0 : margin.right) || 0);
|
|
3128
|
+
var widthOrHeight = getWidthOrHeight(props.layout, heightFromProps, widthFromProps, maxWidth);
|
|
3129
|
+
var outerStyle = portalFromProps ? wrapperStyle : _objectSpread(_objectSpread({
|
|
3130
|
+
position: "absolute",
|
|
3131
|
+
width: (widthOrHeight === null || widthOrHeight === void 0 ? void 0 : widthOrHeight.width) || widthFromProps || "auto",
|
|
3132
|
+
height: (widthOrHeight === null || widthOrHeight === void 0 ? void 0 : widthOrHeight.height) || heightFromProps || "auto"
|
|
3133
|
+
}, getDefaultPosition(wrapperStyle, props, margin, chartWidth, chartHeight, lastBoundingBox)), wrapperStyle);
|
|
3134
|
+
var legendPortal = portalFromProps !== null && portalFromProps !== void 0 ? portalFromProps : legendPortalFromContext;
|
|
3135
|
+
if (legendPortal == null || contextPayload == null) return null;
|
|
3136
|
+
return /* @__PURE__ */ createPortal(/* @__PURE__ */ React$1.createElement("div", {
|
|
3137
|
+
className: "recharts-legend-wrapper",
|
|
3138
|
+
style: outerStyle,
|
|
3139
|
+
ref: updateBoundingBox
|
|
3140
|
+
}, /* @__PURE__ */ React$1.createElement(LegendSettingsDispatcher, {
|
|
3141
|
+
layout: props.layout,
|
|
3142
|
+
align: props.align,
|
|
3143
|
+
verticalAlign: props.verticalAlign,
|
|
3144
|
+
itemSorter: props.itemSorter
|
|
3145
|
+
}), !portalFromProps && /* @__PURE__ */ React$1.createElement(LegendSizeDispatcher, {
|
|
3146
|
+
width: lastBoundingBox.width,
|
|
3147
|
+
height: lastBoundingBox.height
|
|
3148
|
+
}), /* @__PURE__ */ React$1.createElement(LegendContent, _extends({}, props, widthOrHeight, {
|
|
3149
|
+
margin,
|
|
3150
|
+
chartWidth,
|
|
3151
|
+
chartHeight,
|
|
3152
|
+
contextPayload
|
|
3153
|
+
}))), legendPortal);
|
|
3154
|
+
}
|
|
3155
|
+
Legend.displayName = "Legend";
|
|
1868
3156
|
function ScrollArea({ className, children, ...props }) {
|
|
1869
|
-
return /* @__PURE__ */ jsxs(Root, {
|
|
3157
|
+
return /* @__PURE__ */ jsxs(Root$1, {
|
|
1870
3158
|
"data-slot": "scroll-area",
|
|
1871
3159
|
className: cn("relative", className),
|
|
1872
3160
|
...props,
|
|
@@ -2548,6 +3836,6 @@ const buttonVariants = cva("inline-flex items-center justify-center gap-2 whites
|
|
|
2548
3836
|
size: "default"
|
|
2549
3837
|
}
|
|
2550
3838
|
});
|
|
2551
|
-
export { AICardGlass, AlertGlass, AlertGlassDescription, AlertGlassTitle, AvatarGlass, AvatarGlassFallback, AvatarGlassImage, AvatarGlassSimple, BadgeGlass, Bar, BarChart, BaseProgressGlass, ButtonGlass, CareerStatsGlass, CareerStatsHeaderGlass, Cell, ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent, CheckboxGlass, CircularMetricGlass, CircularProgressGlass, ComboBoxGlass, ContributionMetricsGlass, DropdownGlass, DropdownMenuGlass, DropdownMenuGlassCheckboxItem, DropdownMenuGlassContent, DropdownMenuGlassGroup, DropdownMenuGlassItem, DropdownMenuGlassLabel, DropdownMenuGlassPortal, DropdownMenuGlassRadioGroup, DropdownMenuGlassRadioItem, DropdownMenuGlassSeparator, DropdownMenuGlassShortcut, DropdownMenuGlassSub, DropdownMenuGlassSubContent, DropdownMenuGlassSubTrigger, DropdownMenuGlassTrigger, ExpandableHeaderGlass, FlagAlertGlass, FlagsSectionGlass, FormFieldWrapper, GlassCard, HeaderBrandingGlass, HeaderNavGlass, IconButtonGlass, InputGlass, InsightCardGlass, InteractiveCard, LanguageBarGlass, MetricCardGlass, MetricsGridGlass, ModalGlass, NotificationGlass, PopoverGlass, PopoverGlassAnchor, PopoverGlassContent, PopoverGlassLegacy, PopoverGlassTrigger, ProfileAvatarGlass, ProfileHeaderGlass, ProgressGlass, ProjectsListGlass, RainbowProgressGlass, RepositoryCardGlass, RepositoryHeaderGlass, RepositoryMetadataGlass, ResponsiveContainer, SearchBoxGlass, SegmentedControlGlass, SidebarGlass, SkeletonGlass, SliderGlass, SortDropdownGlass, SparklineGlass, SplitLayoutAccordion, SplitLayoutGlass, StatItemGlass, StatusIndicatorGlass, StepperGlass, THEMES, THEME_CONFIG, TabsGlass, ThemeProvider, ThemeToggleGlass, ToggleGlass, TooltipGlass, TooltipGlassContent, TooltipGlassProvider, TooltipGlassSimple, TooltipGlassTrigger, TouchTarget, TrustScoreCardGlass, TrustScoreDisplayGlass, UserInfoGlass, UserStatsLineGlass, YearCardGlass, alertVariants, avatarSizes, badgeVariants, buttonGlassVariants, cardIntensity, cn, dropdownAlign, getNextTheme, getThemeConfig, inputVariants, insightCardVariants, insightVariantConfig, modalSizes, notificationVariants, progressSizes, alertVariants$1 as shadcnAlertVariants, badgeVariants$1 as shadcnBadgeVariants, buttonVariants as shadcnButtonVariants, skeletonVariants, sparklineBarVariants, sparklineContainerVariants, statusSizes, stepperConnectorVariants, stepperContentVariants, stepperDescriptionVariants, stepperIndicatorVariants, stepperLabelVariants, stepperListVariants, stepperRootVariants, stepperStepContainerVariants, toggleSizes, tooltipPositions, useChart, useFocus, useHover, useResponsive, useSidebar, useSplitLayout, useSplitLayoutOptional, useTheme, useWallpaperTint };
|
|
3839
|
+
export { AICardGlass, AlertGlass, AlertGlassDescription, AlertGlassTitle, AvatarGlass, AvatarGlassFallback, AvatarGlassImage, AvatarGlassSimple, BadgeGlass, Bar, BarChart, BaseProgressGlass, ButtonGlass, CareerStatsGlass, CareerStatsHeaderGlass, Cell, ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent, CheckboxGlass, CircularMetricGlass, CircularProgressGlass, CollapsibleGlass, CollapsibleGlassContent, CollapsibleGlassRoot, CollapsibleGlassTrigger, ComboBoxGlass, ContributionMetricsGlass, DropdownGlass, DropdownMenuGlass, DropdownMenuGlassCheckboxItem, DropdownMenuGlassContent, DropdownMenuGlassGroup, DropdownMenuGlassItem, DropdownMenuGlassLabel, DropdownMenuGlassPortal, DropdownMenuGlassRadioGroup, DropdownMenuGlassRadioItem, DropdownMenuGlassSeparator, DropdownMenuGlassShortcut, DropdownMenuGlassSub, DropdownMenuGlassSubContent, DropdownMenuGlassSubTrigger, DropdownMenuGlassTrigger, ExpandableHeaderGlass, FlagAlertGlass, FlagsSectionGlass, FormFieldWrapper, GlassCard, GlassCardAction, GlassCardContent, GlassCardDescription, GlassCardFooter, GlassCardHeader, GlassCardTitle, HeaderBrandingGlass, HeaderNavGlass, IconButtonGlass, InputGlass, InsightCardGlass, InteractiveCard, LanguageBarGlass, MetricCardGlass, MetricsGridGlass, ModalGlass, NotificationGlass, PopoverGlass, PopoverGlassAnchor, PopoverGlassContent, PopoverGlassLegacy, PopoverGlassTrigger, ProfileAvatarGlass, ProfileHeaderGlass, ProgressGlass, ProjectsListGlass, RadioGroupGlass, RadioGroupGlassItem, RadioGroupGlassRoot, RainbowProgressGlass, RepositoryCardGlass, RepositoryHeaderGlass, RepositoryMetadataGlass, ResponsiveContainer, ScrollAreaGlass, ScrollBarGlass, SearchBoxGlass, SegmentedControlGlass, SeparatorGlass, SheetGlass, SheetGlassClose, SheetGlassContent, SheetGlassDescription, SheetGlassFooter, SheetGlassHeader, SheetGlassOverlay, SheetGlassPortal, SheetGlassRoot, SheetGlassTitle, SheetGlassTrigger, SidebarGlass, SkeletonGlass, SliderGlass, SortDropdownGlass, SparklineGlass, SplitLayoutAccordion, SplitLayoutGlass, StatItemGlass, StatusIndicatorGlass, StepperGlass, THEMES, THEME_CONFIG, TabsGlass, ThemeProvider, ThemeToggleGlass, ToggleGlass, ToggleGroupGlass, ToggleGroupGlassItem, ToggleGroupGlassRoot, TooltipGlass, TooltipGlassContent, TooltipGlassProvider, TooltipGlassSimple, TooltipGlassTrigger, TouchTarget, TrustScoreCardGlass, TrustScoreDisplayGlass, UserInfoGlass, UserStatsLineGlass, YearCardGlass, alertVariants, avatarSizes, badgeVariants, buttonGlassVariants, cardIntensity, cn, dropdownAlign, getNextTheme, getThemeConfig, inputVariants, insightCardVariants, insightVariantConfig, modalSizes, notificationVariants, progressSizes, alertVariants$1 as shadcnAlertVariants, badgeVariants$1 as shadcnBadgeVariants, buttonVariants as shadcnButtonVariants, skeletonVariants, sparklineBarVariants, sparklineContainerVariants, statusSizes, stepperConnectorVariants, stepperContentVariants, stepperDescriptionVariants, stepperIndicatorVariants, stepperLabelVariants, stepperListVariants, stepperRootVariants, stepperStepContainerVariants, toggleSizes, tooltipPositions, useChart, useFocus, useHover, useResponsive, useSidebar, useSplitLayout, useSplitLayoutOptional, useTheme, useWallpaperTint };
|
|
2552
3840
|
|
|
2553
3841
|
//# sourceMappingURL=index.js.map
|